@open-draw/canvas 0.0.0-stage → 0.2.0

package/dist/shapes/image/handlers.js

@@ -0,0 +1,85 @@
+import { containFit } from './geometry.js';
+export function createImageFromDataUrl(editor, dataUrl, pagePoint, natural) {
+    const fit = containFit(natural, { width: 300, height: 300 });
+    editor.store.transact(() => {
+        editor.createShape({
+            type: 'image',
+            x: pagePoint.x,
+            y: pagePoint.y,
+            props: {
+                width: fit.width,
+                height: fit.height,
+                src: dataUrl,
+                natural,
+            },
+        });
+    });
+}
+export function attachImageTransferHandlers(container, editor) {
+    const onDragOver = (e) => {
+        e.preventDefault();
+        if (e.dataTransfer) {
+            e.dataTransfer.dropEffect = 'copy';
+        }
+    };
+    const onDrop = (e) => {
+        e.preventDefault();
+        const file = e.dataTransfer?.files?.[0];
+        if (!file || !file.type.startsWith('image/'))
+            return;
+        const containerRect = container.getBoundingClientRect();
+        const screenPt = { x: e.clientX - containerRect.left, y: e.clientY - containerRect.top };
+        const pagePt = editor.camera.screenToPage(screenPt);
+        const reader = new FileReader();
+        reader.onload = (event) => {
+            const dataUrl = event.target?.result;
+            const img = new Image();
+            img.onload = () => {
+                createImageFromDataUrl(editor, dataUrl, pagePt, {
+                    w: img.naturalWidth || 200,
+                    h: img.naturalHeight || 200,
+                });
+            };
+            img.src = dataUrl;
+        };
+        reader.readAsDataURL(file);
+    };
+    const onPaste = (e) => {
+        const items = e.clipboardData?.items;
+        if (!items)
+            return;
+        for (let i = 0; i < items.length; i++) {
+            const item = items[i];
+            if (item && item.type.startsWith('image/')) {
+                const file = item.getAsFile();
+                if (!file)
+                    continue;
+                const centerScreen = { x: container.clientWidth / 2, y: container.clientHeight / 2 };
+                const pagePt = editor.camera.screenToPage(centerScreen);
+                const reader = new FileReader();
+                reader.onload = (event) => {
+                    const dataUrl = event.target?.result;
+                    const img = new Image();
+                    img.onload = () => {
+                        createImageFromDataUrl(editor, dataUrl, pagePt, {
+                            w: img.naturalWidth || 200,
+                            h: img.naturalHeight || 200,
+                        });
+                    };
+                    img.src = dataUrl;
+                };
+                reader.readAsDataURL(file);
+                break;
+            }
+        }
+    };
+    container.addEventListener('dragover', onDragOver);
+    container.addEventListener('drop', onDrop);
+    window.addEventListener('paste', onPaste);
+    return () => {
+        container.removeEventListener('dragover', onDragOver);
+        container.removeEventListener('drop', onDrop);
+        window.removeEventListener('paste', onPaste);
+    };
+}
+//# sourceMappingURL=handlers.js.map

package/dist/shapes/image/handlers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"handlers.js","sourceRoot":"","sources":["../../../src/shapes/image/handlers.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C,MAAM,UAAU,sBAAsB,CACpC,MAAoB,EACpB,OAAe,EACf,SAAmC,EACnC,OAAiC;IAEjC,MAAM,GAAG,GAAG,UAAU,CAAC,OAAO,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC;IAC7D,MAAM,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE;QACzB,MAAM,CAAC,WAAW,CAAC;YACjB,IAAI,EAAE,OAAO;YACb,CAAC,EAAE,SAAS,CAAC,CAAC;YACd,CAAC,EAAE,SAAS,CAAC,CAAC;YACd,KAAK,EAAE;gBACL,KAAK,EAAE,GAAG,CAAC,KAAK;gBAChB,MAAM,EAAE,GAAG,CAAC,MAAM;gBAClB,GAAG,EAAE,OAAO;gBACZ,OAAO;aACR;SACF,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC;AAED,MAAM,UAAU,2BAA2B,CAAC,SAAsB,EAAE,MAAoB;IACtF,MAAM,UAAU,GAAG,CAAC,CAAY,EAAE,EAAE;QAClC,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,IAAI,CAAC,CAAC,YAAY,EAAE,CAAC;YACnB,CAAC,CAAC,YAAY,CAAC,UAAU,GAAG,MAAM,CAAC;QACrC,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,MAAM,GAAG,CAAC,CAAY,EAAE,EAAE;QAC9B,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,MAAM,IAAI,GAAG,CAAC,CAAC,YAAY,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC;QACxC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC;YAAE,OAAO;QAErD,MAAM,aAAa,GAAG,SAAS,CAAC,qBAAqB,EAAE,CAAC;QACxD,MAAM,QAAQ,GAAG,EAAE,CAAC,EAAE,CAAC,CAAC,OAAO,GAAG,aAAa,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC,CAAC,OAAO,GAAG,aAAa,CAAC,GAAG,EAAE,CAAC;QACzF,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;QAEpD,MAAM,MAAM,GAAG,IAAI,UAAU,EAAE,CAAC;QAChC,MAAM,CAAC,MAAM,GAAG,CAAC,KAAK,EAAE,EAAE;YACxB,MAAM,OAAO,GAAG,KAAK,CAAC,MAAM,EAAE,MAAgB,CAAC;YAC/C,MAAM,GAAG,GAAG,IAAI,KAAK,EAAE,CAAC;YACxB,GAAG,CAAC,MAAM,GAAG,GAAG,EAAE;gBAChB,sBAAsB,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE;oBAC9C,CAAC,EAAE,GAAG,CAAC,YAAY,IAAI,GAAG;oBAC1B,CAAC,EAAE,GAAG,CAAC,aAAa,IAAI,GAAG;iBAC5B,CAAC,CAAC;YACL,CAAC,CAAC;YACF,GAAG,CAAC,GAAG,GAAG,OAAO,CAAC;QACpB,CAAC,CAAC;QACF,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;IAC7B,CAAC,CAAC;IAEF,MAAM,OAAO,GAAG,CAAC,CAAiB,EAAE,EAAE;QACpC,MAAM,KAAK,GAAG,CAAC,CAAC,aAAa,EAAE,KAAK,CAAC;QACrC,IAAI,CAAC,KAAK;YAAE,OAAO;QAEnB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;YACtC,MAAM,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;YACtB,IAAI,IAAI,IAAI,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE,CAAC;gBAC3C,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC;gBAC9B,IAAI,CAAC,IAAI;oBAAE,SAAS;gBAEpB,MAAM,YAAY,GAAG,EAAE,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,CAAC,EAAE,CAAC,EAAE,SAAS,CAAC,YAAY,GAAG,CAAC,EAAE,CAAC;gBACrF,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;gBAExD,MAAM,MAAM,GAAG,IAAI,UAAU,EAAE,CAAC;gBAChC,MAAM,CAAC,MAAM,GAAG,CAAC,KAAK,EAAE,EAAE;oBACxB,MAAM,OAAO,GAAG,KAAK,CAAC,MAAM,EAAE,MAAgB,CAAC;oBAC/C,MAAM,GAAG,GAAG,IAAI,KAAK,EAAE,CAAC;oBACxB,GAAG,CAAC,MAAM,GAAG,GAAG,EAAE;wBAChB,sBAAsB,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE;4BAC9C,CAAC,EAAE,GAAG,CAAC,YAAY,IAAI,GAAG;4BAC1B,CAAC,EAAE,GAAG,CAAC,aAAa,IAAI,GAAG;yBAC5B,CAAC,CAAC;oBACL,CAAC,CAAC;oBACF,GAAG,CAAC,GAAG,GAAG,OAAO,CAAC;gBACpB,CAAC,CAAC;gBACF,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;gBAC3B,MAAM;YACR,CAAC;QACH,CAAC;IACH,CAAC,CAAC;IAEF,SAAS,CAAC,gBAAgB,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC;IACnD,SAAS,CAAC,gBAAgB,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC3C,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IAE1C,OAAO,GAAG,EAAE;QACV,SAAS,CAAC,mBAAmB,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC;QACtD,SAAS,CAAC,mBAAmB,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;QAC9C,MAAM,CAAC,mBAAmB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IAC/C,CAAC,CAAC;AACJ,CAAC"}

package/dist/shapes/image/index.d.ts

@@ -0,0 +1,8 @@
+import type { ShapeDefinition } from '../../registry.js';
+import type { ImageProps } from './defs.js';
+export * from './defs.js';
+export * from './geometry.js';
+export * from './render.js';
+export * from './handlers.js';
+export declare const imageDefinition: ShapeDefinition<ImageProps>;
+//# sourceMappingURL=index.d.ts.map

package/dist/shapes/image/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/shapes/image/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAI5C,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAE9B,eAAO,MAAM,eAAe,EAAE,eAAe,CAAC,UAAU,CAavD,CAAC"}

package/dist/shapes/image/index.js

@@ -0,0 +1,21 @@
+import { imageGeometry } from './geometry.js';
+import { renderImage, updateImage } from './render.js';
+export * from './defs.js';
+export * from './geometry.js';
+export * from './render.js';
+export * from './handlers.js';
+export const imageDefinition = {
+    type: 'image',
+    defaultProps() {
+        return {
+            width: 200,
+            height: 200,
+            src: '',
+            natural: { w: 200, h: 200 },
+        };
+    },
+    geometry: imageGeometry,
+    render: renderImage,
+    update: updateImage,
+};
+//# sourceMappingURL=index.js.map

package/dist/shapes/image/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/shapes/image/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAEvD,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAE9B,MAAM,CAAC,MAAM,eAAe,GAAgC;IAC1D,IAAI,EAAE,OAAO;IACb,YAAY;QACV,OAAO;YACL,KAAK,EAAE,GAAG;YACV,MAAM,EAAE,GAAG;YACX,GAAG,EAAE,EAAE;YACP,OAAO,EAAE,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE;SAC5B,CAAC;IACJ,CAAC;IACD,QAAQ,EAAE,aAAa;IACvB,MAAM,EAAE,WAAW;IACnB,MAAM,EAAE,WAAW;CACpB,CAAC"}

package/dist/shapes/image/render.d.ts

@@ -0,0 +1,6 @@
+import type { ShapeRecord } from '@open-draw/schema';
+import type { RenderContext } from '../../registry.js';
+import type { ImageProps } from './defs.js';
+export declare function renderImage(shape: ShapeRecord<ImageProps>, _ctx: RenderContext): SVGElement;
+export declare function updateImage(element: SVGElement, shape: ShapeRecord<ImageProps>, _prevShape: ShapeRecord<ImageProps>, _ctx: RenderContext): void;
+//# sourceMappingURL=render.d.ts.map

package/dist/shapes/image/render.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../../../src/shapes/image/render.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AACvD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAE5C,wBAAgB,WAAW,CAAC,KAAK,EAAE,WAAW,CAAC,UAAU,CAAC,EAAE,IAAI,EAAE,aAAa,GAAG,UAAU,CAa3F;AAED,wBAAgB,WAAW,CACzB,OAAO,EAAE,UAAU,EACnB,KAAK,EAAE,WAAW,CAAC,UAAU,CAAC,EAC9B,UAAU,EAAE,WAAW,CAAC,UAAU,CAAC,EACnC,IAAI,EAAE,aAAa,GAClB,IAAI,CAYN"}

package/dist/shapes/image/render.js

@@ -0,0 +1,28 @@
+export function renderImage(shape, _ctx) {
+    const image = document.createElementNS('http://www.w3.org/2000/svg', 'image');
+    image.setAttribute('class', 'od-shape-body');
+    image.setAttribute('x', '0');
+    image.setAttribute('y', '0');
+    image.setAttribute('width', String(shape.props.width));
+    image.setAttribute('height', String(shape.props.height));
+    image.setAttribute('preserveAspectRatio', 'xMidYMid meet');
+    if (shape.props.src) {
+        image.setAttributeNS('http://www.w3.org/1999/xlink', 'href', shape.props.src);
+        image.setAttribute('href', shape.props.src);
+    }
+    return image;
+}
+export function updateImage(element, shape, _prevShape, _ctx) {
+    const image = element.classList.contains('od-shape-body')
+        ? element
+        : element.querySelector('.od-shape-body');
+    if (image) {
+        image.setAttribute('width', String(shape.props.width));
+        image.setAttribute('height', String(shape.props.height));
+        if (shape.props.src) {
+            image.setAttributeNS('http://www.w3.org/1999/xlink', 'href', shape.props.src);
+            image.setAttribute('href', shape.props.src);
+        }
+    }
+}
+//# sourceMappingURL=render.js.map

package/dist/shapes/image/render.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"render.js","sourceRoot":"","sources":["../../../src/shapes/image/render.ts"],"names":[],"mappings":"AAIA,MAAM,UAAU,WAAW,CAAC,KAA8B,EAAE,IAAmB;IAC7E,MAAM,KAAK,GAAG,QAAQ,CAAC,eAAe,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;IAC9E,KAAK,CAAC,YAAY,CAAC,OAAO,EAAE,eAAe,CAAC,CAAC;IAC7C,KAAK,CAAC,YAAY,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;IAC7B,KAAK,CAAC,YAAY,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;IAC7B,KAAK,CAAC,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IACvD,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IACzD,KAAK,CAAC,YAAY,CAAC,qBAAqB,EAAE,eAAe,CAAC,CAAC;IAC3D,IAAI,KAAK,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;QACpB,KAAK,CAAC,cAAc,CAAC,8BAA8B,EAAE,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAC9E,KAAK,CAAC,YAAY,CAAC,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IAC9C,CAAC;IACD,OAAO,KAAK,CAAC;AACf,CAAC;AAED,MAAM,UAAU,WAAW,CACzB,OAAmB,EACnB,KAA8B,EAC9B,UAAmC,EACnC,IAAmB;IAEnB,MAAM,KAAK,GAAG,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC,eAAe,CAAC;QACvD,CAAC,CAAE,OAA2B;QAC9B,CAAC,CAAC,OAAO,CAAC,aAAa,CAAkB,gBAAgB,CAAC,CAAC;IAC7D,IAAI,KAAK,EAAE,CAAC;QACV,KAAK,CAAC,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;QACvD,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;QACzD,IAAI,KAAK,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;YACpB,KAAK,CAAC,cAAc,CAAC,8BAA8B,EAAE,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;YAC9E,KAAK,CAAC,YAAY,CAAC,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAC9C,CAAC;IACH,CAAC;AACH,CAAC"}

package/dist/shapes/ink/defs.d.ts

@@ -0,0 +1,10 @@
+export interface InkProps {
+    readonly pts: readonly number[];
+    readonly stroke?: string;
+    readonly strokeWidth?: number;
+    readonly isHighlighter?: boolean;
+    readonly label?: string;
+}
+export declare const DEFAULT_INK_PROPS: InkProps;
+export declare const DEFAULT_HIGHLIGHTER_PROPS: InkProps;
+//# sourceMappingURL=defs.d.ts.map

package/dist/shapes/ink/defs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"defs.d.ts","sourceRoot":"","sources":["../../../src/shapes/ink/defs.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,QAAQ;IACvB,QAAQ,CAAC,GAAG,EAAE,SAAS,MAAM,EAAE,CAAC;IAChC,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAC;IAC9B,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IACjC,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,eAAO,MAAM,iBAAiB,EAAE,QAK/B,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,QAKvC,CAAC"}

package/dist/shapes/ink/defs.js

@@ -0,0 +1,13 @@
+export const DEFAULT_INK_PROPS = {
+    pts: [],
+    stroke: '#1e293b',
+    strokeWidth: 3,
+    isHighlighter: false,
+};
+export const DEFAULT_HIGHLIGHTER_PROPS = {
+    pts: [],
+    stroke: '#fef08a',
+    strokeWidth: 20,
+    isHighlighter: true,
+};
+//# sourceMappingURL=defs.js.map

package/dist/shapes/ink/defs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"defs.js","sourceRoot":"","sources":["../../../src/shapes/ink/defs.ts"],"names":[],"mappings":"AAQA,MAAM,CAAC,MAAM,iBAAiB,GAAa;IACzC,GAAG,EAAE,EAAE;IACP,MAAM,EAAE,SAAS;IACjB,WAAW,EAAE,CAAC;IACd,aAAa,EAAE,KAAK;CACrB,CAAC;AAEF,MAAM,CAAC,MAAM,yBAAyB,GAAa;IACjD,GAAG,EAAE,EAAE;IACP,MAAM,EAAE,SAAS;IACjB,WAAW,EAAE,EAAE;IACf,aAAa,EAAE,IAAI;CACpB,CAAC"}

package/dist/shapes/ink/geometry.d.ts

@@ -0,0 +1,4 @@
+import type { ShapeGeometry } from '../../registry.js';
+import { type InkProps } from './defs.js';
+export declare const inkGeometry: ShapeGeometry<InkProps>;
+//# sourceMappingURL=geometry.d.ts.map

package/dist/shapes/ink/geometry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"geometry.d.ts","sourceRoot":"","sources":["../../../src/shapes/ink/geometry.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAgB,aAAa,EAAE,MAAM,mBAAmB,CAAC;AACrE,OAAO,EAAqB,KAAK,QAAQ,EAAE,MAAM,WAAW,CAAC;AAE7D,eAAO,MAAM,WAAW,EAAE,aAAa,CAAC,QAAQ,CAsE/C,CAAC"}

package/dist/shapes/ink/geometry.js

@@ -0,0 +1,67 @@
+import { DEFAULT_INK_PROPS } from './defs.js';
+export const inkGeometry = {
+    bounds(shape) {
+        const pts = shape.props.pts;
+        if (!pts || pts.length < 2) {
+            return { x: shape.x, y: shape.y, width: 0, height: 0 };
+        }
+        let minX = pts[0];
+        let maxX = pts[0];
+        let minY = pts[1];
+        let maxY = pts[1];
+        for (let i = 2; i < pts.length; i += 2) {
+            const px = pts[i];
+            const py = pts[i + 1];
+            if (px < minX)
+                minX = px;
+            if (px > maxX)
+                maxX = px;
+            if (py < minY)
+                minY = py;
+            if (py > maxY)
+                maxY = py;
+        }
+        const sw = shape.props.strokeWidth ?? DEFAULT_INK_PROPS.strokeWidth ?? 3;
+        return {
+            x: minX - sw / 2,
+            y: minY - sw / 2,
+            width: Math.max(1, maxX - minX + sw),
+            height: Math.max(1, maxY - minY + sw),
+        };
+    },
+    resize(shape, _handle, _point) {
+        return shape;
+    },
+    hit(shape, point) {
+        const pts = shape.props.pts;
+        if (!pts || pts.length < 2)
+            return false;
+        const threshold = (shape.props.strokeWidth ?? DEFAULT_INK_PROPS.strokeWidth ?? 3) / 2 + 4;
+        const count = pts.length / 2;
+        if (count === 1) {
+            return Math.hypot(point.x - pts[0], point.y - pts[1]) <= threshold;
+        }
+        for (let i = 0; i < count - 1; i++) {
+            const x1 = pts[i * 2];
+            const y1 = pts[i * 2 + 1];
+            const x2 = pts[(i + 1) * 2];
+            const y2 = pts[(i + 1) * 2 + 1];
+            const dx = x2 - x1;
+            const dy = y2 - y1;
+            const lenSq = dx * dx + dy * dy;
+            if (lenSq === 0) {
+                if (Math.hypot(point.x - x1, point.y - y1) <= threshold)
+                    return true;
+                continue;
+            }
+            const t = Math.max(0, Math.min(1, ((point.x - x1) * dx + (point.y - y1) * dy) / lenSq));
+            const projX = x1 + t * dx;
+            const projY = y1 + t * dy;
+            if (Math.hypot(point.x - projX, point.y - projY) <= threshold) {
+                return true;
+            }
+        }
+        return false;
+    },
+};
+//# sourceMappingURL=geometry.js.map

package/dist/shapes/ink/geometry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"geometry.js","sourceRoot":"","sources":["../../../src/shapes/ink/geometry.ts"],"names":[],"mappings":"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"}

package/dist/shapes/ink/index.d.ts

@@ -0,0 +1,9 @@
+import type { ShapeDefinition } from '../../registry.js';
+import { type InkProps } from './defs.js';
+export * from './defs.js';
+export * from './rdp.js';
+export * from './geometry.js';
+export * from './render.js';
+export declare const inkDefinition: ShapeDefinition<InkProps>;
+export declare const highlighterDefinition: ShapeDefinition<InkProps>;
+//# sourceMappingURL=index.d.ts.map

package/dist/shapes/ink/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/shapes/ink/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAgD,KAAK,QAAQ,EAAE,MAAM,WAAW,CAAC;AAIxF,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAE5B,eAAO,MAAM,aAAa,EAAE,eAAe,CAAC,QAAQ,CAMnD,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,eAAe,CAAC,QAAQ,CAM3D,CAAC"}

package/dist/shapes/ink/index.js

@@ -0,0 +1,22 @@
+import { DEFAULT_HIGHLIGHTER_PROPS, DEFAULT_INK_PROPS } from './defs.js';
+import { inkGeometry } from './geometry.js';
+import { renderInk, updateInk } from './render.js';
+export * from './defs.js';
+export * from './rdp.js';
+export * from './geometry.js';
+export * from './render.js';
+export const inkDefinition = {
+    type: 'ink',
+    defaultProps: () => ({ ...DEFAULT_INK_PROPS }),
+    geometry: inkGeometry,
+    render: renderInk,
+    update: updateInk,
+};
+export const highlighterDefinition = {
+    type: 'highlighter',
+    defaultProps: () => ({ ...DEFAULT_HIGHLIGHTER_PROPS }),
+    geometry: inkGeometry,
+    render: renderInk,
+    update: updateInk,
+};
+//# sourceMappingURL=index.js.map

package/dist/shapes/ink/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/shapes/ink/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,yBAAyB,EAAE,iBAAiB,EAAiB,MAAM,WAAW,CAAC;AACxF,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAEnD,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAE5B,MAAM,CAAC,MAAM,aAAa,GAA8B;IACtD,IAAI,EAAE,KAAK;IACX,YAAY,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,GAAG,iBAAiB,EAAE,CAAC;IAC9C,QAAQ,EAAE,WAAW;IACrB,MAAM,EAAE,SAAS;IACjB,MAAM,EAAE,SAAS;CAClB,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAA8B;IAC9D,IAAI,EAAE,aAAa;IACnB,YAAY,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,GAAG,yBAAyB,EAAE,CAAC;IACtD,QAAQ,EAAE,WAAW;IACrB,MAAM,EAAE,SAAS;IACjB,MAAM,EAAE,SAAS;CAClB,CAAC"}

package/dist/shapes/ink/rdp.d.ts

@@ -0,0 +1,2 @@
+export declare function simplifyRDP(points: readonly number[], epsilon?: number): number[];
+//# sourceMappingURL=rdp.d.ts.map

package/dist/shapes/ink/rdp.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"rdp.d.ts","sourceRoot":"","sources":["../../../src/shapes/ink/rdp.ts"],"names":[],"mappings":"AAiBA,wBAAgB,WAAW,CAAC,MAAM,EAAE,SAAS,MAAM,EAAE,EAAE,OAAO,GAAE,MAAY,GAAG,MAAM,EAAE,CA+BtF"}

package/dist/shapes/ink/rdp.js

@@ -0,0 +1,37 @@
+function perpendicularDistance(px, py, x1, y1, x2, y2) {
+    const dx = x2 - x1;
+    const dy = y2 - y1;
+    const lenSq = dx * dx + dy * dy;
+    if (lenSq === 0) {
+        return Math.hypot(px - x1, py - y1);
+    }
+    return Math.abs(dy * px - dx * py + x2 * y1 - y2 * x1) / Math.sqrt(lenSq);
+}
+export function simplifyRDP(points, epsilon = 1.5) {
+    const count = Math.floor(points.length / 2);
+    if (count <= 2) {
+        return Array.from(points);
+    }
+    const x1 = points[0];
+    const y1 = points[1];
+    const x2 = points[(count - 1) * 2];
+    const y2 = points[(count - 1) * 2 + 1];
+    let maxDist = 0;
+    let maxIndex = 0;
+    for (let i = 1; i < count - 1; i++) {
+        const px = points[i * 2];
+        const py = points[i * 2 + 1];
+        const dist = perpendicularDistance(px, py, x1, y1, x2, y2);
+        if (dist > maxDist) {
+            maxDist = dist;
+            maxIndex = i;
+        }
+    }
+    if (maxDist > epsilon) {
+        const left = simplifyRDP(points.slice(0, (maxIndex + 1) * 2), epsilon);
+        const right = simplifyRDP(points.slice(maxIndex * 2), epsilon);
+        return left.slice(0, -2).concat(right);
+    }
+    return [x1, y1, x2, y2];
+}
+//# sourceMappingURL=rdp.js.map

package/dist/shapes/ink/rdp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"rdp.js","sourceRoot":"","sources":["../../../src/shapes/ink/rdp.ts"],"names":[],"mappings":"AAAA,SAAS,qBAAqB,CAC5B,EAAU,EACV,EAAU,EACV,EAAU,EACV,EAAU,EACV,EAAU,EACV,EAAU;IAEV,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;IACnB,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;IACnB,MAAM,KAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;IAChC,IAAI,KAAK,KAAK,CAAC,EAAE,CAAC;QAChB,OAAO,IAAI,CAAC,KAAK,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,CAAC;IACtC,CAAC;IACD,OAAO,IAAI,CAAC,GAAG,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;AAC5E,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,MAAyB,EAAE,OAAO,GAAW,GAAG;IAC1E,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;IAC5C,IAAI,KAAK,IAAI,CAAC,EAAE,CAAC;QACf,OAAO,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAC5B,CAAC;IAED,MAAM,EAAE,GAAG,MAAM,CAAC,CAAC,CAAE,CAAC;IACtB,MAAM,EAAE,GAAG,MAAM,CAAC,CAAC,CAAE,CAAC;IACtB,MAAM,EAAE,GAAG,MAAM,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,GAAG,CAAC,CAAE,CAAC;IACpC,MAAM,EAAE,GAAG,MAAM,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,CAAE,CAAC;IAExC,IAAI,OAAO,GAAG,CAAC,CAAC;IAChB,IAAI,QAAQ,GAAG,CAAC,CAAC;IAEjB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,GAAG,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;QACnC,MAAM,EAAE,GAAG,MAAM,CAAC,CAAC,GAAG,CAAC,CAAE,CAAC;QAC1B,MAAM,EAAE,GAAG,MAAM,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,CAAE,CAAC;QAC9B,MAAM,IAAI,GAAG,qBAAqB,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;QAC3D,IAAI,IAAI,GAAG,OAAO,EAAE,CAAC;YACnB,OAAO,GAAG,IAAI,CAAC;YACf,QAAQ,GAAG,CAAC,CAAC;QACf,CAAC;IACH,CAAC;IAED,IAAI,OAAO,GAAG,OAAO,EAAE,CAAC;QACtB,MAAM,IAAI,GAAG,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,QAAQ,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;QACvE,MAAM,KAAK,GAAG,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,QAAQ,GAAG,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;QAC/D,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IACzC,CAAC;IAED,OAAO,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;AAC1B,CAAC"}

package/dist/shapes/ink/render.d.ts

@@ -0,0 +1,7 @@
+import type { ShapeRecord } from '@open-draw/schema';
+import type { RenderContext } from '../../registry.js';
+import { type InkProps } from './defs.js';
+export declare function pointsToSvgPath(pts: readonly number[], ox: number, oy: number): string;
+export declare function renderInk(shape: ShapeRecord<InkProps>, ctx: RenderContext): SVGElement;
+export declare function updateInk(element: SVGElement, shape: ShapeRecord<InkProps>, _prevShape: ShapeRecord<InkProps>, ctx: RenderContext): void;
+//# sourceMappingURL=render.d.ts.map

package/dist/shapes/ink/render.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../../../src/shapes/ink/render.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AACvD,OAAO,EAAqB,KAAK,QAAQ,EAAE,MAAM,WAAW,CAAC;AAE7D,wBAAgB,eAAe,CAAC,GAAG,EAAE,SAAS,MAAM,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,GAAG,MAAM,CAatF;AAED,wBAAgB,SAAS,CAAC,KAAK,EAAE,WAAW,CAAC,QAAQ,CAAC,EAAE,GAAG,EAAE,aAAa,GAAG,UAAU,CAyBtF;AAED,wBAAgB,SAAS,CACvB,OAAO,EAAE,UAAU,EACnB,KAAK,EAAE,WAAW,CAAC,QAAQ,CAAC,EAC5B,UAAU,EAAE,WAAW,CAAC,QAAQ,CAAC,EACjC,GAAG,EAAE,aAAa,GACjB,IAAI,CAqBN"}

package/dist/shapes/ink/render.js

@@ -0,0 +1,81 @@
+import { DEFAULT_INK_PROPS } from './defs.js';
+export function pointsToSvgPath(pts, ox, oy) {
+    if (!pts || pts.length < 2)
+        return '';
+    const count = Math.floor(pts.length / 2);
+    if (count === 1) {
+        const lx = pts[0] - ox;
+        const ly = pts[1] - oy;
+        return `M ${lx} ${ly} L ${lx + 0.1} ${ly + 0.1}`;
+    }
+    let d = `M ${pts[0] - ox} ${pts[1] - oy}`;
+    for (let i = 1; i < count; i++) {
+        d += ` L ${pts[i * 2] - ox} ${pts[i * 2 + 1] - oy}`;
+    }
+    return d;
+}
+export function renderInk(shape, ctx) {
+    const stroke = shape.props.stroke ?? DEFAULT_INK_PROPS.stroke ?? '#1e293b';
+    const strokeWidth = shape.props.strokeWidth ?? DEFAULT_INK_PROPS.strokeWidth ?? 3;
+    const isHighlighter = Boolean(shape.props.isHighlighter);
+    const d = pointsToSvgPath(shape.props.pts, shape.x, shape.y);
+    const path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
+    path.setAttribute('class', 'od-ink-path');
+    path.setAttribute('d', d);
+    path.setAttribute('fill', 'none');
+    path.setAttribute('stroke', stroke);
+    path.setAttribute('stroke-width', String(strokeWidth));
+    path.setAttribute('stroke-linecap', 'round');
+    path.setAttribute('stroke-linejoin', 'round');
+    if (isHighlighter) {
+        path.setAttribute('stroke-opacity', '0.4');
+        path.style.mixBlendMode = 'multiply';
+    }
+    if (ctx.overlaySlot) {
+        updateInkOverlayLabel(ctx.overlaySlot, shape.props.pts, shape.x, shape.y, shape.props.label);
+    }
+    return path;
+}
+export function updateInk(element, shape, _prevShape, ctx) {
+    const stroke = shape.props.stroke ?? DEFAULT_INK_PROPS.stroke ?? '#1e293b';
+    const strokeWidth = shape.props.strokeWidth ?? DEFAULT_INK_PROPS.strokeWidth ?? 3;
+    const isHighlighter = Boolean(shape.props.isHighlighter);
+    const d = pointsToSvgPath(shape.props.pts, shape.x, shape.y);
+    const path = (element.querySelector('.od-ink-path') ??
+        (element.classList.contains('od-ink-path') ? element : null));
+    if (path) {
+        path.setAttribute('d', d);
+        path.setAttribute('stroke', stroke);
+        path.setAttribute('stroke-width', String(strokeWidth));
+        if (isHighlighter) {
+            path.setAttribute('stroke-opacity', '0.4');
+            path.style.mixBlendMode = 'multiply';
+        }
+    }
+    if (ctx.overlaySlot) {
+        updateInkOverlayLabel(ctx.overlaySlot, shape.props.pts, shape.x, shape.y, shape.props.label);
+    }
+}
+function updateInkOverlayLabel(slot, pts, ox, oy, labelText) {
+    let label = slot.querySelector('.od-ink-label');
+    if (!labelText || !pts || pts.length < 2) {
+        if (label)
+            label.remove();
+        return;
+    }
+    const lx = pts[0] - ox;
+    const ly = pts[1] - oy;
+    if (!label) {
+        label = document.createElementNS('http://www.w3.org/2000/svg', 'text');
+        label.setAttribute('class', 'od-ink-label');
+        label.setAttribute('font-size', '11');
+        label.setAttribute('font-family', 'sans-serif');
+        label.setAttribute('font-weight', '500');
+        label.setAttribute('fill', '#475569');
+        slot.appendChild(label);
+    }
+    label.setAttribute('x', String(lx));
+    label.setAttribute('y', String(ly - 6));
+    label.textContent = labelText;
+}
+//# sourceMappingURL=render.js.map

package/dist/shapes/ink/render.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"render.js","sourceRoot":"","sources":["../../../src/shapes/ink/render.ts"],"names":[],"mappings":"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"}

package/dist/shapes/note/defs.d.ts

@@ -0,0 +1,7 @@
+export interface NoteProps {
+    width: number;
+    height: number;
+    text?: string;
+    color?: string;
+}
+//# sourceMappingURL=defs.d.ts.map

package/dist/shapes/note/defs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"defs.d.ts","sourceRoot":"","sources":["../../../src/shapes/note/defs.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB"}

package/dist/shapes/note/defs.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=defs.js.map

package/dist/shapes/note/defs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"defs.js","sourceRoot":"","sources":["../../../src/shapes/note/defs.ts"],"names":[],"mappings":""}

package/dist/shapes/note/geometry.d.ts

@@ -0,0 +1,11 @@
+import type { Bounds, Point, ShapeRecord } from '@open-draw/schema';
+import type { ResizeHandle } from '../../registry.js';
+import type { NoteProps } from './defs.js';
+export declare const MIN_NOTE_WIDTH = 100;
+export declare const MIN_NOTE_HEIGHT = 80;
+export declare const noteGeometry: {
+    bounds(shape: ShapeRecord<NoteProps>): Bounds;
+    resize(shape: ShapeRecord<NoteProps>, handleOrBounds: ResizeHandle | Bounds, point?: Point): Partial<ShapeRecord<NoteProps>>;
+    hit(shape: ShapeRecord<NoteProps>, point: Point): boolean;
+};
+//# sourceMappingURL=geometry.d.ts.map

package/dist/shapes/note/geometry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"geometry.d.ts","sourceRoot":"","sources":["../../../src/shapes/note/geometry.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACpE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAE3C,eAAO,MAAM,cAAc,MAAM,CAAC;AAClC,eAAO,MAAM,eAAe,KAAK,CAAC;AAElC,eAAO,MAAM,YAAY;IACvB,MAAM,QAAQ,WAAW,CAAC,SAAS,CAAC,GAAG,MAAM;IAS7C,MAAM,QAAQ,WAAW,CAAC,SAAS,CAAC,kBAAkB,YAAY,GAAG,MAAM,UAAU,KAAK,GAAG,OAAO,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC;IAwD5H,GAAG,QAAQ,WAAW,CAAC,SAAS,CAAC,SAAS,KAAK,GAAG,OAAO;CAK1D,CAAC"}

package/dist/shapes/note/geometry.js

@@ -0,0 +1,70 @@
+export const MIN_NOTE_WIDTH = 100;
+export const MIN_NOTE_HEIGHT = 80;
+export const noteGeometry = {
+    bounds(shape) {
+        return {
+            x: shape.x,
+            y: shape.y,
+            width: shape.props.width,
+            height: shape.props.height,
+        };
+    },
+    resize(shape, handleOrBounds, point) {
+        if (typeof handleOrBounds === 'object' && 'width' in handleOrBounds && 'height' in handleOrBounds) {
+            return {
+                x: handleOrBounds.x,
+                y: handleOrBounds.y,
+                props: {
+                    ...shape.props,
+                    width: Math.max(MIN_NOTE_WIDTH, handleOrBounds.width),
+                    height: Math.max(MIN_NOTE_HEIGHT, handleOrBounds.height),
+                },
+            };
+        }
+        let { x, y } = shape;
+        let width = shape.props.width;
+        let height = shape.props.height;
+        const pt = point ?? { x, y };
+        switch (handleOrBounds) {
+            case 'bottom-right':
+            case 'se':
+                width = Math.max(MIN_NOTE_WIDTH, pt.x - x);
+                height = Math.max(MIN_NOTE_HEIGHT, pt.y - y);
+                break;
+            case 'bottom-left':
+            case 'sw':
+                width = Math.max(MIN_NOTE_WIDTH, x + width - pt.x);
+                height = Math.max(MIN_NOTE_HEIGHT, pt.y - y);
+                x = pt.x;
+                break;
+            case 'top-right':
+            case 'ne':
+                width = Math.max(MIN_NOTE_WIDTH, pt.x - x);
+                height = Math.max(MIN_NOTE_HEIGHT, y + height - pt.y);
+                y = pt.y;
+                break;
+            case 'top-left':
+            case 'nw':
+                width = Math.max(MIN_NOTE_WIDTH, x + width - pt.x);
+                height = Math.max(MIN_NOTE_HEIGHT, y + height - pt.y);
+                x = pt.x;
+                y = pt.y;
+                break;
+        }
+        return {
+            x,
+            y,
+            props: {
+                ...shape.props,
+                width,
+                height,
+            },
+        };
+    },
+    hit(shape, point) {
+        const localX = point.x - shape.x;
+        const localY = point.y - shape.y;
+        return localX >= 0 && localX <= shape.props.width && localY >= 0 && localY <= shape.props.height;
+    },
+};
+//# sourceMappingURL=geometry.js.map

package/dist/shapes/note/geometry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"geometry.js","sourceRoot":"","sources":["../../../src/shapes/note/geometry.ts"],"names":[],"mappings":"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"}

package/dist/shapes/note/index.d.ts

@@ -0,0 +1,7 @@
+import type { ShapeDefinition } from '../../registry.js';
+import type { NoteProps } from './defs.js';
+export * from './defs.js';
+export * from './geometry.js';
+export * from './render.js';
+export declare const noteDefinition: ShapeDefinition<NoteProps>;
+//# sourceMappingURL=index.d.ts.map

package/dist/shapes/note/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/shapes/note/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAI3C,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAE5B,eAAO,MAAM,cAAc,EAAE,eAAe,CAAC,SAAS,CAkCrD,CAAC"}