kritzel-stencil 0.0.110 → 0.0.112

package/dist/components/{p-mD9nNnTx.js → p--2WHhuBI.js}

@@ -1,7 +1,8 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-DC8SDK2U.js';
-import { b as KritzelBaseCommand, c as KritzelBaseTool, d as KritzelEventHelper, e as KritzelBaseObject, f as KritzelText, g as KritzelToolRegistry, a as KritzelTextTool, K as KritzelBrushTool, h as KritzelPath, O as ObjectHelper, A as AddObjectCommand, i as KritzelMouseButton, j as KritzelKeyboardHelper } from './p-7Ns73-wN.js';
+import { K as KritzelMouseButton } from './p-D8W6LE-c.js';
+import { b as KritzelBaseCommand, c as KritzelBaseTool, d as KritzelEventHelper, e as KritzelBaseObject, a as KritzelTextTool, K as KritzelBrushTool, f as KritzelText, g as KritzelPath, O as ObjectHelper, A as AddObjectCommand, h as KritzelToolRegistry, i as KritzelKeyboardHelper } from './p-DqZOaMbq.js';
 import { K as KritzelContextMenu, d as defineCustomElement$3 } from './p-BmAloSfd.js';
-import { d as defineCustomElement$2 } from './p-Ds3FhuuO.js';
+import { d as defineCustomElement$2 } from './p-BvPTbq7F.js';
 import { d as defineCustomElement$1 } from './p-CZkSABuJ.js';
 
 class BatchCommand extends KritzelBaseCommand {
@@ -858,6 +859,9 @@ class KritzelSelectionTool extends KritzelBaseTool {
         this.rotationHandler = new KritzelRotationHandler(this._store);
     }
     handlePointerDown(event) {
+        if (event.cancelable) {
+            event.preventDefault();
+        }
         if (event.pointerType === 'mouse') {
             if (KritzelEventHelper.isLeftClick(event)) {
                 this._store.state.isResizeHandleSelected = this.isHandleSelected(event);
@@ -919,6 +923,9 @@ class KritzelSelectionTool extends KritzelBaseTool {
         }
     }
     handlePointerMove(event) {
+        if (event.cancelable) {
+            event.preventDefault();
+        }
         if (event.pointerType === 'mouse') {
             this.moveHandler.handlePointerMove(event);
             this.selectionHandler.handlePointerMove(event);
@@ -938,6 +945,9 @@ class KritzelSelectionTool extends KritzelBaseTool {
         }
     }
     handlePointerUp(event) {
+        if (event.cancelable) {
+            event.preventDefault();
+        }
         if (event.pointerType === 'mouse') {
             this.moveHandler.handlePointerUp(event);
             this.selectionHandler.handlePointerUp(event);
@@ -955,36 +965,6 @@ class KritzelSelectionTool extends KritzelBaseTool {
             this.selectionHandler.handlePointerUp(event);
         }
     }
-    handleDoubleClick(event) {
-        var _a;
-        if (KritzelEventHelper.isLeftClick(event)) {
-            if (this._store.state.selectionGroup && ((_a = this._store.state.selectionGroup) === null || _a === void 0 ? void 0 : _a.objects.length) === 1) {
-                const selectedObject = this._store.state.selectionGroup.objects[0];
-                if (selectedObject instanceof KritzelText) {
-                    this._store.history.executeCommand(new RemoveSelectionGroupCommand(this._store, this._store.state.selectionGroup));
-                    this._store.setState('activeTool', KritzelToolRegistry.getTool('text'));
-                    this._store.state.activeText = selectedObject;
-                    setTimeout(() => {
-                        selectedObject.focus();
-                    }, 300);
-                }
-            }
-        }
-    }
-    handleDoubleTap(event) {
-        const selectionGroup = this.getSelectedObject(event);
-        if (!selectionGroup || selectionGroup.objects.length !== 1) {
-            return;
-        }
-        const selectedObject = selectionGroup.objects[0];
-        if (selectedObject instanceof KritzelText) {
-            this._store.setState('activeTool', KritzelToolRegistry.getTool('text'));
-            this._store.state.activeText = selectedObject;
-            setTimeout(() => {
-                selectedObject.focus();
-            }, 300);
-        }
-    }
     getSelectedObject(event) {
         const path = event.composedPath().slice(1);
         const objectElement = path.find(element => element.classList && element.classList.contains('object'));
@@ -2058,10 +2038,8 @@ class KritzelKeyHandler extends KritzelBaseHandler {
         if (this._store.state.isFocused === false) {
             return;
         }
+        event.preventDefault();
         this._store.state.isCtrlKeyPressed = event.ctrlKey;
-        if (this._store.state.isCtrlKeyPressed) {
-            event.preventDefault();
-        }
         if (event.key === 'Escape' && this._store.state.selectionGroup) {
             this._store.clearSelection();
         }
@@ -2137,6 +2115,10 @@ class KritzelContextMenuHandler extends KritzelBaseHandler {
         this.objectContextMenuItems = objectContextMenuItems;
     }
     handleContextMenu(event) {
+        if (this._store.state.skipContextMenu) {
+            this._store.state.skipContextMenu = false;
+            return;
+        }
         const selectedObject = this._store.getObjectFromPointerEvent(event, '.object');
         if (selectedObject && !(selectedObject instanceof KritzelSelectionGroup)) {
             this._store.state.selectionGroup = KritzelSelectionGroup.create(this._store);
@@ -2252,9 +2234,6 @@ const KritzelEngine = /*@__PURE__*/ proxyCustomElement(class KritzelEngine exten
         if (this.store.state.isEnabled === false) {
             return;
         }
-        if (ev.cancelable) {
-            ev.preventDefault();
-        }
         KritzelEventHelper.onLongTouchPress(ev, (event) => {
             if (!(this.store.state.activeTool instanceof KritzelSelectionTool)) {
                 return;
@@ -2271,9 +2250,6 @@ const KritzelEngine = /*@__PURE__*/ proxyCustomElement(class KritzelEngine exten
         if (this.store.state.isEnabled === false) {
             return;
         }
-        if (ev.cancelable) {
-            ev.preventDefault();
-        }
         this.store.state.pointers.set(ev.pointerId, ev);
         this.viewport.handlePointerMove(ev);
         (_b = (_a = this.store.state) === null || _a === void 0 ? void 0 : _a.activeTool) === null || _b === void 0 ? void 0 : _b.handlePointerMove(ev);
@@ -2283,9 +2259,6 @@ const KritzelEngine = /*@__PURE__*/ proxyCustomElement(class KritzelEngine exten
         if (this.store.state.isEnabled === false) {
             return;
         }
-        if (ev.cancelable) {
-            ev.preventDefault();
-        }
         this.store.state.pointers.delete(ev.pointerId);
         this.host.releasePointerCapture(ev.pointerId);
         this.viewport.handlePointerUp(ev);
@@ -2296,9 +2269,6 @@ const KritzelEngine = /*@__PURE__*/ proxyCustomElement(class KritzelEngine exten
         if (this.store.state.isEnabled === false) {
             return;
         }
-        if (ev.cancelable) {
-            ev.preventDefault();
-        }
         this.host.releasePointerCapture(ev.pointerId);
         this.store.state.pointers.delete(ev.pointerId);
         this.viewport.handlePointerUp(ev);
@@ -2442,15 +2412,15 @@ const KritzelEngine = /*@__PURE__*/ proxyCustomElement(class KritzelEngine exten
         const baseHandleSizePx = computedStyle.getPropertyValue('--kritzel-selection-handle-size').trim() || '6px';
         const baseHandleSize = parseFloat(baseHandleSizePx);
         const baseHandleTouchSize = baseHandleSize * 2 < 14 ? 14 : baseHandleSize;
-        return (h(Host, { key: 'a797514d787c08c2cd6a2e526ace31fecddf8956' }, h("div", { key: 'd0d23c34809f26ab3c21f756923d1ef7a00ebb41', class: "debug-panel", style: { display: this.store.state.debugInfo.showViewportInfo ? 'block' : 'none' } }, h("div", { key: '302b23a9028483c7dc31f4ca983c8036f6de5b25' }, "TranslateX: ", (_a = this.store.state) === null || _a === void 0 ? void 0 :
-            _a.translateX), h("div", { key: '2224e2bb5bd1feea8a65ac4f082342a40e8e18b5' }, "TranslateY: ", (_b = this.store.state) === null || _b === void 0 ? void 0 :
-            _b.translateY), h("div", { key: '02108ee26500eb97a08d8460b6b71cdc553d6c90' }, "ViewportWidth: ", (_c = this.store.state) === null || _c === void 0 ? void 0 :
-            _c.viewportWidth), h("div", { key: '8e87161155f4e2960985292be3101e9f57893381' }, "ViewportHeight: ", (_d = this.store.state) === null || _d === void 0 ? void 0 :
-            _d.viewportHeight), h("div", { key: 'aa2469bda052787a93ea615451676dba4b4fb53e' }, "ObjectsInViewport. ", this.store.objects.length), h("div", { key: '593aaf98bfaec8aae03bd7a3f37e46e14f454333' }, "Scale: ", (_e = this.store.state) === null || _e === void 0 ? void 0 :
-            _e.scale), h("div", { key: '6c9799e82d30236c6f1277830dec32358bfccd93' }, "ActiveTool: ", (_g = (_f = this.store.state) === null || _f === void 0 ? void 0 : _f.activeTool) === null || _g === void 0 ? void 0 :
-            _g.name), h("div", { key: '3dbbec42f8a699a97ef65b5da35f2611866797e5' }, "HasViewportChanged: ", ((_h = this.store.state) === null || _h === void 0 ? void 0 : _h.hasViewportChanged) ? 'true' : 'false'), h("div", { key: '03a71e1efab2801e77e0d8dffc7a4814469613c7' }, "IsEnabled: ", ((_j = this.store.state) === null || _j === void 0 ? void 0 : _j.isEnabled) ? 'true' : 'false'), h("div", { key: '7663ed6cad2ed3b9b74bad5cb238a4cf0310e9e1' }, "IsScaling: ", ((_k = this.store.state) === null || _k === void 0 ? void 0 : _k.isScaling) ? 'true' : 'false'), h("div", { key: '957a1b0906ad9cecc46f470db1ad402d19f94d22' }, "IsPanning: ", ((_l = this.store.state) === null || _l === void 0 ? void 0 : _l.isPanning) ? 'true' : 'false'), h("div", { key: 'b73277742d0966445b6f49a0fb1433f80cab1d60' }, "IsFocused: ", this.store.state.isFocused ? 'true' : 'false'), h("div", { key: '6a4e0ca6d868b1f8ccfe2957f352fc454b3527ea' }, "IsSelecting: ", this.isSelecting ? 'true' : 'false'), h("div", { key: 'da9dce9f4c38cd740f27ecc8de3c32edac2a7fe2' }, "IsSelectionActive: ", this.isSelectionActive ? 'true' : 'false'), h("div", { key: 'f6b0d7cc9e828cac5a65879b9973944a444be6b1' }, "IsResizeHandleSelected: ", this.store.state.isResizeHandleSelected ? 'true' : 'false'), h("div", { key: '3ef7c46329e47a97703e49f47c8f5325f0d4b9b2' }, "IsRotationHandleSelected: ", this.store.state.isRotationHandleSelected ? 'true' : 'false'), h("div", { key: 'cab4fb21ede0b4f4925e9d7d2175ad8661f07907' }, "IsDrawing: ", this.store.state.isDrawing ? 'true' : 'false'), h("div", { key: '2f4eeaa711a56e2246495fe1eee46d5629c93364' }, "IsWriting: ", this.store.state.isWriting ? 'true' : 'false'), h("div", { key: 'ee2e5edcd140da8b957b468989c71e7c247063bb' }, "CursorX: ", (_m = this.store.state) === null || _m === void 0 ? void 0 :
-            _m.cursorX), h("div", { key: '1fea9888ca2f1a9fed25ad0cac065d8278c78227' }, "CursorY: ", (_o = this.store.state) === null || _o === void 0 ? void 0 :
-            _o.cursorY)), h("div", { key: '226c675711317ff06f1db5165fa19794310f2e1e', class: "origin", style: {
+        return (h(Host, { key: '632d8633bd27520dedda2e6eb84862d280fa6714' }, h("div", { key: 'fda3cdc033d97e1f17ae8fcede94933ae73458b3', class: "debug-panel", style: { display: this.store.state.debugInfo.showViewportInfo ? 'block' : 'none' } }, h("div", { key: '823aac3e9b58615e7c499163bd9101675a62ff70' }, "TranslateX: ", (_a = this.store.state) === null || _a === void 0 ? void 0 :
+            _a.translateX), h("div", { key: '5d138212f0fefcaea7dc839f6d5f3e9c68c19681' }, "TranslateY: ", (_b = this.store.state) === null || _b === void 0 ? void 0 :
+            _b.translateY), h("div", { key: '8342eabd22ba71b58fe8346a182904cf5f4ccbb9' }, "ViewportWidth: ", (_c = this.store.state) === null || _c === void 0 ? void 0 :
+            _c.viewportWidth), h("div", { key: '325546fc07c2cfec7808e661d82f21db06d53aea' }, "ViewportHeight: ", (_d = this.store.state) === null || _d === void 0 ? void 0 :
+            _d.viewportHeight), h("div", { key: '2b1826604f561c58ad573d5545a0913498345b1f' }, "ObjectsInViewport. ", this.store.objects.length), h("div", { key: '749b56a6bfd63c838c89c55595bedd6749ee89ad' }, "Scale: ", (_e = this.store.state) === null || _e === void 0 ? void 0 :
+            _e.scale), h("div", { key: '0ee63c810198cb583c4e419f14503f5fb8d71d32' }, "ActiveTool: ", (_g = (_f = this.store.state) === null || _f === void 0 ? void 0 : _f.activeTool) === null || _g === void 0 ? void 0 :
+            _g.name), h("div", { key: '5facf47db6f093db24b12fa4b4453d20af1b1f57' }, "HasViewportChanged: ", ((_h = this.store.state) === null || _h === void 0 ? void 0 : _h.hasViewportChanged) ? 'true' : 'false'), h("div", { key: '948069683ac1568257dab4dbd5d1b3e9926ac501' }, "IsEnabled: ", ((_j = this.store.state) === null || _j === void 0 ? void 0 : _j.isEnabled) ? 'true' : 'false'), h("div", { key: 'a3e5bf4522b9d515bc7d346dbc9803af12eb60f5' }, "IsScaling: ", ((_k = this.store.state) === null || _k === void 0 ? void 0 : _k.isScaling) ? 'true' : 'false'), h("div", { key: 'ce8fc21cd938e7a58fef489b086b5111b1612353' }, "IsPanning: ", ((_l = this.store.state) === null || _l === void 0 ? void 0 : _l.isPanning) ? 'true' : 'false'), h("div", { key: '5725282e17bbe0766ebe010377070df81c1542d2' }, "IsFocused: ", this.store.state.isFocused ? 'true' : 'false'), h("div", { key: '8805bbfac86078d2a0541d60a53a3c6a9585a1db' }, "IsSelecting: ", this.isSelecting ? 'true' : 'false'), h("div", { key: '1801d4d8297e36f4c14022c411ce5a1889042398' }, "IsSelectionActive: ", this.isSelectionActive ? 'true' : 'false'), h("div", { key: 'd269982265e35a511eeb892969b3e47eb21b023f' }, "IsResizeHandleSelected: ", this.store.state.isResizeHandleSelected ? 'true' : 'false'), h("div", { key: '1362e4c3d93a8452705e5fb1a1ba6a0ffdb3c557' }, "IsRotationHandleSelected: ", this.store.state.isRotationHandleSelected ? 'true' : 'false'), h("div", { key: '2181e07738e56e10c57c4d6a06acdd667a14da83' }, "IsDrawing: ", this.store.state.isDrawing ? 'true' : 'false'), h("div", { key: '57b96821b4fb1cbc97ec7083fc523c0bdba7539b' }, "IsWriting: ", this.store.state.isWriting ? 'true' : 'false'), h("div", { key: 'c7302e6ce4635e04aa92a24878dd3cbce8724228' }, "CursorX: ", (_m = this.store.state) === null || _m === void 0 ? void 0 :
+            _m.cursorX), h("div", { key: '93b01e5d147ca445e6645749043bb7fb46852f39' }, "CursorY: ", (_o = this.store.state) === null || _o === void 0 ? void 0 :
+            _o.cursorY)), h("div", { key: '7b535830bbd75ca61e09d6984120e17168911d7d', class: "origin", style: {
                 transform: `matrix(${(_p = this.store.state) === null || _p === void 0 ? void 0 : _p.scale}, 0, 0, ${(_q = this.store.state) === null || _q === void 0 ? void 0 : _q.scale}, ${(_r = this.store.state) === null || _r === void 0 ? void 0 : _r.translateX}, ${(_s = this.store.state) === null || _s === void 0 ? void 0 : _s.translateY})`,
             } }, (_t = this.store.objects) === null || _t === void 0 ? void 0 :
             _t.map(object => {
@@ -2547,7 +2517,7 @@ const KritzelEngine = /*@__PURE__*/ proxyCustomElement(class KritzelEngine exten
                         fill: 'transparent',
                         cursor: 'grab',
                     }, visibility: object.selected && !this.isSelecting ? 'visible' : 'hidden' }), h("g", { style: { display: this.store.state.debugInfo.showObjectInfo ? 'block' : 'none', pointerEvents: 'none' } }, h("foreignObject", { x: object.totalWidth.toString(), y: "0", width: "400px", height: "160px", style: { minHeight: '0', minWidth: '0', display: object.debugInfoVisible ? 'block' : 'none' } }, h("div", { style: { width: '100%', height: '100%' } }, h("div", { style: { whiteSpace: 'nowrap' } }, "zIndex: ", object.zIndex), h("div", { style: { whiteSpace: 'nowrap' } }, "translateX: ", object.translateX), h("div", { style: { whiteSpace: 'nowrap' } }, "translateY: ", object.translateY), h("div", { style: { whiteSpace: 'nowrap' } }, "width: ", object.width), h("div", { style: { whiteSpace: 'nowrap' } }, "height: ", object.height), h("div", { style: { whiteSpace: 'nowrap' } }, "scale: ", object.scale), h("div", { style: { whiteSpace: 'nowrap' } }, "rotation: ", object.rotation)))))));
-            }), h("svg", { key: '34f891f9408d3b0174c67b869f49cce7329fd84a', class: "object", xmlns: "http://www.w3.org/2000/svg", style: {
+            }), h("svg", { key: 'cce82d436a044879bfbb900a836978c392f232ae', class: "object", xmlns: "http://www.w3.org/2000/svg", style: {
                 height: (_u = this.store.state.currentPath) === null || _u === void 0 ? void 0 : _u.height.toString(),
                 width: (_v = this.store.state.currentPath) === null || _v === void 0 ? void 0 : _v.width.toString(),
                 left: '0',
@@ -2557,12 +2527,12 @@ const KritzelEngine = /*@__PURE__*/ proxyCustomElement(class KritzelEngine exten
                 transform: (_x = this.store.state.currentPath) === null || _x === void 0 ? void 0 : _x.transformationMatrix,
                 transformOrigin: 'top left',
                 overflow: 'visible',
-            }, viewBox: (_y = this.store.state.currentPath) === null || _y === void 0 ? void 0 : _y.viewBox }, h("path", { key: '97360b7270a285a87a45459e497968a444cc83cb', d: (_z = this.store.state.currentPath) === null || _z === void 0 ? void 0 : _z.d, fill: (_0 = this.store.state.currentPath) === null || _0 === void 0 ? void 0 : _0.fill, stroke: (_1 = this.store.state.currentPath) === null || _1 === void 0 ? void 0 : _1.stroke }))), this.store.state.isContextMenuVisible && (h("kritzel-context-menu", { key: '111d7b1daccd69aaf914dfcd51f525f2ad81802e', class: "context-menu", ref: el => (this.contextMenuElement = el), items: this.store.state.contextMenuItems, style: {
+            }, viewBox: (_y = this.store.state.currentPath) === null || _y === void 0 ? void 0 : _y.viewBox }, h("path", { key: '1c0366598a805faffc965824c30c05fe1f1e0f74', d: (_z = this.store.state.currentPath) === null || _z === void 0 ? void 0 : _z.d, fill: (_0 = this.store.state.currentPath) === null || _0 === void 0 ? void 0 : _0.fill, stroke: (_1 = this.store.state.currentPath) === null || _1 === void 0 ? void 0 : _1.stroke }))), this.store.state.isContextMenuVisible && (h("kritzel-context-menu", { key: '624855529efbe7a5de784e3e1ce2b82282fac63a', class: "context-menu", ref: el => (this.contextMenuElement = el), items: this.store.state.contextMenuItems, style: {
                 position: 'fixed',
                 left: `${this.store.state.contextMenuX}px`,
                 top: `${this.store.state.contextMenuY}px`,
                 zIndex: '10000',
-            }, onActionSelected: event => this.handleContextMenuAction(event) })), ((_2 = this.store.state) === null || _2 === void 0 ? void 0 : _2.activeTool) instanceof KritzelEraserTool && !this.store.state.isScaling && h("kritzel-cursor-trail", { key: '9814ec7d95a84edc8af1bff319eff5f59b8cfc86' })));
+            }, onActionSelected: event => this.handleContextMenuAction(event) })), ((_2 = this.store.state) === null || _2 === void 0 ? void 0 : _2.activeTool) instanceof KritzelEraserTool && !this.store.state.isScaling && h("kritzel-cursor-trail", { key: 'd09a4701c43b8acec4e9daa09b69f545eebe95b7', store: this.store })));
     }
     get host() { return this; }
     static get style() { return kritzelEngineCss; }
@@ -2622,6 +2592,6 @@ function defineCustomElement() {
 }
 
 export { KritzelEngine as K, KritzelSelectionTool as a, KritzelEraserTool as b, KritzelImageTool as c, defineCustomElement as d };
-//# sourceMappingURL=p-mD9nNnTx.js.map
+//# sourceMappingURL=p--2WHhuBI.js.map
 
-//# sourceMappingURL=p-mD9nNnTx.js.map
+//# sourceMappingURL=p--2WHhuBI.js.map