@infinite-canvas-tutorial/laser-pointer

Getting started

Add this plugin with configuration (similar to tiptap's plugin system):

import { App, DefaultPlugins } from '@infinite-canvas-tutorial/ecs';
import { UIPlugin } from '@infinite-canvas-tutorial/webcomponents';
import { LaserPointerPlugin } from '@infinite-canvas-tutorial/laser-pointer';

const app = new App().addPlugins(
    ...DefaultPlugins,
    UIPlugin,
    LaserPointerPlugin,
);
app.run();

Then import the Spectrum UI like this:

import '@infinite-canvas-tutorial/laser-pointer/spectrum';

And declare this penbar item in HTML like this:

<ic-spectrum-canvas>
    <ic-spectrum-penbar-laser-pointer slot="penbar-item"><ic-spectrum-penbar-laser-pointer />
</ic-spectrum-canvas>