kritzel-stencil 0.0.126 → 0.0.127

package/dist/components/kritzel-editor.js

@@ -0,0 +1,409 @@
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-DJN0U8pI.js';
+import { a as KritzelIconRegistry, d as defineCustomElement$5 } from './p-CtiROna-.js';
+import { A as ABSOLUTE_SCALE_MAX, f as ABSOLUTE_SCALE_MIN, c as KritzelSelectionTool, a as KritzelEraserTool, b as KritzelImageTool, e as defineCustomElement$9 } from './p-CudOuOAW.js';
+import { b as KritzelBrushTool, c as KritzelTextTool } from './p-ljdIU3DL.js';
+import { d as defineCustomElement$i } from './p-C9usqwb5.js';
+import { d as defineCustomElement$h } from './p-DfJEh7HZ.js';
+import { d as defineCustomElement$g } from './p-DJc6_PyL.js';
+import { d as defineCustomElement$f } from './p-2gNwfcSP.js';
+import { d as defineCustomElement$e } from './p-BkFzf8vg.js';
+import { d as defineCustomElement$d } from './p-BhC-Et5I.js';
+import { d as defineCustomElement$c } from './p-DSWoCkxm.js';
+import { d as defineCustomElement$b } from './p-EQo4-DJT.js';
+import { d as defineCustomElement$a } from './p-NZJPrwJV.js';
+import { d as defineCustomElement$8 } from './p-Dp8hrISj.js';
+import { d as defineCustomElement$7 } from './p-BubFkS0u.js';
+import { d as defineCustomElement$6 } from './p-DcvujuV_.js';
+import { d as defineCustomElement$4 } from './p-D5a8vnRF.js';
+import { d as defineCustomElement$3 } from './p-CmlcJ8Kw.js';
+import { d as defineCustomElement$2 } from './p-BOUCnklW.js';
+
+const DEFAULT_BRUSH_CONFIG = {
+    type: 'pen',
+    color: '#000000',
+    size: 16,
+    palettes: {
+        pen: [
+            '#000000',
+            '#ff5252',
+            '#ffbc00',
+            '#00c853',
+            '#0000FF',
+            '#d500f9',
+            '#fafafa',
+            '#a52714',
+            '#ee8100',
+            '#558b2f',
+            '#01579b',
+            '#8e24aa',
+            '#90a4ae',
+            '#ff4081',
+            '#ff6e40',
+            '#aeea00',
+            '#304ffe',
+            '#7c4dff',
+            '#cfd8dc',
+            '#f8bbd0',
+            '#ffccbc',
+            '#f0f4c3',
+            '#9fa8da',
+            '#d1c4e9',
+        ],
+        highlighter: [
+            '#0000006e',
+            '#ff52526e',
+            '#ffbb006e',
+            '#00c8536e',
+            '#0000FF6e',
+            '#d500f96e',
+            '#fafafa6e',
+            '#a527146e',
+            '#ee81006e',
+            '#558b2f6e',
+            '#01579b6e',
+            '#8e24aa6e',
+            '#90a4ae6e',
+            '#ff40816e',
+            '#ff6e406e',
+            '#aeea006e',
+            '#304ffe6e',
+            '#7c4dff6e',
+            '#cfd8dc6e',
+            '#f8bbd06e',
+            '#ffccbc6e',
+            '#f0f4c36e',
+            '#9fa8da6e',
+            '#d1c4e96e',
+        ],
+    },
+};
+
+const DEFAULT_TEXT_CONFIG = {
+    color: '#000000',
+    size: 8,
+    fontFamily: 'Arial',
+    palette: [
+        '#000000',
+        '#ff5252',
+        '#ffbc00',
+        '#00c853',
+        '#0000FF',
+        '#d500f9',
+        '#fafafa',
+        '#a52714',
+        '#ee8100',
+        '#558b2f',
+        '#01579b',
+        '#8e24aa',
+        '#90a4ae',
+        '#ff4081',
+        '#ff6e40',
+        '#aeea00',
+        '#304ffe',
+        '#7c4dff',
+        '#cfd8dc',
+        '#f8bbd0',
+        '#ffccbc',
+        '#f0f4c3',
+        '#9fa8da',
+        '#d1c4e9',
+    ],
+};
+
+const kritzelEditorCss = "kritzel-editor{display:flex;margin:0;position:relative;overflow:hidden;width:100%;height:100%;align-items:center;justify-content:center;touch-action:manipulation;user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}kritzel-controls{position:absolute;bottom:28px}";
+
+const KritzelEditor$1 = /*@__PURE__*/ proxyCustomElement(class KritzelEditor extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.isReady = createEvent(this, "isReady");
+        this.scaleMax = ABSOLUTE_SCALE_MAX;
+        this.scaleMin = ABSOLUTE_SCALE_MIN;
+        this.controls = [
+            {
+                name: 'selection',
+                type: 'tool',
+                tool: KritzelSelectionTool,
+                icon: 'cursor',
+            },
+            {
+                name: 'brush',
+                type: 'tool',
+                tool: KritzelBrushTool,
+                icon: 'pen',
+                isDefault: true,
+                config: DEFAULT_BRUSH_CONFIG,
+            },
+            {
+                name: 'eraser',
+                type: 'tool',
+                tool: KritzelEraserTool,
+                icon: 'eraser',
+            },
+            {
+                name: 'text',
+                type: 'tool',
+                tool: KritzelTextTool,
+                icon: 'type',
+                config: DEFAULT_TEXT_CONFIG,
+            },
+            {
+                name: 'image',
+                type: 'tool',
+                tool: KritzelImageTool,
+                icon: 'image',
+            },
+            {
+                name: 'divider',
+                type: 'divider',
+            },
+            {
+                name: 'config',
+                type: 'config',
+            },
+        ];
+        this.globalContextMenuItems = [
+            {
+                label: 'Paste',
+                icon: 'paste',
+                disabled: async () => (await this.engineRef.getCopiedObjects()).length === 0,
+                action: menu => this.engineRef.paste(menu.x, menu.y),
+            },
+            { label: 'Select All', icon: 'select-all', action: () => this.selectAllObjectsInViewport() },
+        ];
+        this.objectContextMenuItems = [
+            {
+                label: 'Edit',
+                icon: 'pen',
+                visible: (_, objects) => objects.length === 1 && objects[0].isEditable,
+                action: (_, objects) => {
+                    if (objects.length === 1) {
+                        const object = objects[0];
+                        if (object.isEditable) {
+                            object.edit();
+                        }
+                    }
+                },
+            },
+            { label: 'Copy', icon: 'copy', action: () => this.engineRef.copy() },
+            {
+                label: 'Paste',
+                icon: 'paste',
+                disabled: async () => (await this.engineRef.getCopiedObjects()).length === 0,
+                action: (menu, _) => this.engineRef.paste(menu.x, menu.y),
+            },
+            { label: 'Delete', icon: 'delete', action: () => this.engineRef.delete() },
+            { label: 'Bring to Front', icon: 'bring-to-front', action: () => this.engineRef.bringToFront() },
+            { label: 'Send to Back', icon: 'send-to-back', action: () => this.engineRef.sendToBack() },
+        ];
+        this.customSvgIcons = {};
+        this.isControlsVisible = true;
+        this.isUtilityPanelVisible = true;
+        this.isEngineReady = false;
+        this.isControlsReady = false;
+    }
+    onIsEngineReady(newValue) {
+        if (newValue && this.isControlsReady) {
+            this.checkIsReady();
+        }
+    }
+    onIsControlsReady(newValue) {
+        if (newValue && this.isEngineReady) {
+            this.checkIsReady();
+        }
+    }
+    async getObjectById(id) {
+        return this.engineRef.getObjectById(id);
+    }
+    async addObject(object) {
+        return this.engineRef.addObject(object);
+    }
+    async updateObject(object, updatedProperties) {
+        return this.engineRef.updateObject(object, updatedProperties);
+    }
+    async removeObject(object) {
+        return this.engineRef.removeObject(object);
+    }
+    async getSelectedObjects() {
+        return this.engineRef.getSelectedObjects();
+    }
+    async selectObjects(objects) {
+        return this.engineRef.selectObjects(objects);
+    }
+    async selectAllObjectsInViewport() {
+        return this.engineRef.selectAllObjectsInViewport();
+    }
+    async clearSelection() {
+        this.engineRef.clearSelection();
+    }
+    async centerObjectInViewport(object) {
+        return this.engineRef.centerObjectInViewport(object);
+    }
+    handleTouchStart(event) {
+        if (event.cancelable) {
+            event.preventDefault();
+        }
+    }
+    handleKeyDown(event) {
+        var _a;
+        if (event.key === 'Escape') {
+            event.preventDefault();
+            (_a = this.controlsRef) === null || _a === void 0 ? void 0 : _a.closeTooltip();
+        }
+    }
+    componentDidLoad() {
+        this.registerCustomSvgIcons();
+    }
+    async checkIsReady() {
+        await customElements.whenDefined('kritzel-editor');
+        await customElements.whenDefined('kritzel-controls');
+        await customElements.whenDefined('kritzel-engine');
+        if (!this.isEngineReady || !this.isControlsReady) {
+            return;
+        }
+        this.isReady.emit(this.host);
+    }
+    registerCustomSvgIcons() {
+        for (const [name, svg] of Object.entries(this.customSvgIcons)) {
+            KritzelIconRegistry.register(name, svg);
+        }
+    }
+    render() {
+        return (h(Host, { key: 'ddfb1861cc7fe2acda822b9389c3a049fe626deb' }, h("kritzel-engine", { key: 'ccbf2c636bdf63630ac06e1e8d3239c79bb7e774', ref: el => (this.engineRef = el), onIsEngineReady: () => (this.isEngineReady = true), scaleMax: this.scaleMax, scaleMin: this.scaleMin, globalContextMenuItems: this.globalContextMenuItems, objectContextMenuItems: this.objectContextMenuItems }), h("kritzel-controls", { key: 'a0111b00ecbcb18c615c7f12f005f0edfe363af8', ref: el => (this.controlsRef = el), controls: this.controls, isUtilityPanelVisible: this.isUtilityPanelVisible, style: this.isControlsVisible ? { display: 'flex' } : { display: 'none' }, onIsControlsReady: () => (this.isControlsReady = true) })));
+    }
+    get host() { return this; }
+    static get watchers() { return {
+        "isEngineReady": ["onIsEngineReady"],
+        "isControlsReady": ["onIsControlsReady"]
+    }; }
+    static get style() { return kritzelEditorCss; }
+}, [256, "kritzel-editor", {
+        "scaleMax": [2, "scale-max"],
+        "scaleMin": [2, "scale-min"],
+        "controls": [16],
+        "globalContextMenuItems": [16, "global-context-menu-items"],
+        "objectContextMenuItems": [16, "object-context-menu-items"],
+        "customSvgIcons": [16, "custom-svg-icons"],
+        "isControlsVisible": [4, "is-controls-visible"],
+        "isUtilityPanelVisible": [4, "is-utility-panel-visible"],
+        "isEngineReady": [32],
+        "isControlsReady": [32],
+        "getObjectById": [64],
+        "addObject": [64],
+        "updateObject": [64],
+        "removeObject": [64],
+        "getSelectedObjects": [64],
+        "selectObjects": [64],
+        "selectAllObjectsInViewport": [64],
+        "clearSelection": [64],
+        "centerObjectInViewport": [64]
+    }, [[0, "dblclick", "handleTouchStart"], [8, "keydown", "handleKeyDown"]], {
+        "isEngineReady": ["onIsEngineReady"],
+        "isControlsReady": ["onIsControlsReady"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["kritzel-editor", "kritzel-brush-style", "kritzel-color", "kritzel-color-palette", "kritzel-context-menu", "kritzel-control-brush-config", "kritzel-control-text-config", "kritzel-controls", "kritzel-cursor-trail", "kritzel-dropdown", "kritzel-engine", "kritzel-font", "kritzel-font-family", "kritzel-font-size", "kritzel-icon", "kritzel-stroke-size", "kritzel-tooltip", "kritzel-utility-panel"];
+    components.forEach(tagName => { switch (tagName) {
+        case "kritzel-editor":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, KritzelEditor$1);
+            }
+            break;
+        case "kritzel-brush-style":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$i();
+            }
+            break;
+        case "kritzel-color":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$h();
+            }
+            break;
+        case "kritzel-color-palette":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$g();
+            }
+            break;
+        case "kritzel-context-menu":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$f();
+            }
+            break;
+        case "kritzel-control-brush-config":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$e();
+            }
+            break;
+        case "kritzel-control-text-config":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$d();
+            }
+            break;
+        case "kritzel-controls":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$c();
+            }
+            break;
+        case "kritzel-cursor-trail":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$b();
+            }
+            break;
+        case "kritzel-dropdown":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$a();
+            }
+            break;
+        case "kritzel-engine":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$9();
+            }
+            break;
+        case "kritzel-font":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$8();
+            }
+            break;
+        case "kritzel-font-family":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$7();
+            }
+            break;
+        case "kritzel-font-size":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "kritzel-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "kritzel-stroke-size":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "kritzel-tooltip":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "kritzel-utility-panel":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+
+const KritzelEditor = KritzelEditor$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { DEFAULT_BRUSH_CONFIG as D, KritzelEditor, DEFAULT_TEXT_CONFIG as a, defineCustomElement };
+//# sourceMappingURL=kritzel-editor.js.map
+
+//# sourceMappingURL=kritzel-editor.js.map

package/dist/components/kritzel-editor.js.map

@@ -0,0 +1 @@
+{"file":"kritzel-editor.js","mappings":"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","names":["KritzelEditor","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/configs/default-brush-tool.config.ts","src/configs/default-text-tool.config.ts","src/components/core/kritzel-editor/kritzel-editor.css?tag=kritzel-editor","src/components/core/kritzel-editor/kritzel-editor.tsx"],"sourcesContent":["import { KritzelBrushToolConfig } from '../interfaces/toolbar-control.interface';\r\n\r\nexport const DEFAULT_BRUSH_CONFIG: KritzelBrushToolConfig = {\r\n  type: 'pen',\r\n  color: '#000000',\r\n  size: 16,\r\n  palettes: {\r\n    pen: [\r\n      '#000000',\r\n      '#ff5252',\r\n      '#ffbc00',\r\n      '#00c853',\r\n      '#0000FF',\r\n      '#d500f9',\r\n      '#fafafa',\r\n      '#a52714',\r\n      '#ee8100',\r\n      '#558b2f',\r\n      '#01579b',\r\n      '#8e24aa',\r\n      '#90a4ae',\r\n      '#ff4081',\r\n      '#ff6e40',\r\n      '#aeea00',\r\n      '#304ffe',\r\n      '#7c4dff',\r\n      '#cfd8dc',\r\n      '#f8bbd0',\r\n      '#ffccbc',\r\n      '#f0f4c3',\r\n      '#9fa8da',\r\n      '#d1c4e9',\r\n    ],\r\n    highlighter: [\r\n      '#0000006e',\r\n      '#ff52526e',\r\n      '#ffbb006e',\r\n      '#00c8536e',\r\n      '#0000FF6e',\r\n      '#d500f96e',\r\n      '#fafafa6e',\r\n      '#a527146e',\r\n      '#ee81006e',\r\n      '#558b2f6e',\r\n      '#01579b6e',\r\n      '#8e24aa6e',\r\n      '#90a4ae6e',\r\n      '#ff40816e',\r\n      '#ff6e406e',\r\n      '#aeea006e',\r\n      '#304ffe6e',\r\n      '#7c4dff6e',\r\n      '#cfd8dc6e',\r\n      '#f8bbd06e',\r\n      '#ffccbc6e',\r\n      '#f0f4c36e',\r\n      '#9fa8da6e',\r\n      '#d1c4e96e',\r\n    ],\r\n  },\r\n};\r\n\r\n\r\n","import { KritzelTextToolConfig } from \"../interfaces/toolbar-control.interface\";\r\n\r\nexport const DEFAULT_TEXT_CONFIG: KritzelTextToolConfig = {\r\n  color: '#000000',\r\n  size: 8,\r\n  fontFamily: 'Arial',\r\n  palette: [\r\n    '#000000',\r\n    '#ff5252',\r\n    '#ffbc00',\r\n    '#00c853',\r\n    '#0000FF',\r\n    '#d500f9',\r\n    '#fafafa',\r\n    '#a52714',\r\n    '#ee8100',\r\n    '#558b2f',\r\n    '#01579b',\r\n    '#8e24aa',\r\n    '#90a4ae',\r\n    '#ff4081',\r\n    '#ff6e40',\r\n    '#aeea00',\r\n    '#304ffe',\r\n    '#7c4dff',\r\n    '#cfd8dc',\r\n    '#f8bbd0',\r\n    '#ffccbc',\r\n    '#f0f4c3',\r\n    '#9fa8da',\r\n    '#d1c4e9',\r\n  ],\r\n};","kritzel-editor{\r\n  display: flex;\r\n  margin: 0;\r\n  position: relative;\r\n  overflow: hidden;\r\n  width: 100%;\r\n  height: 100%;\r\n  align-items: center;\r\n  justify-content: center;\r\n  touch-action: manipulation;\r\n  user-select: none;\r\n  -webkit-touch-callout: none;\r\n  -webkit-user-select: none;\r\n  -khtml-user-select: none;\r\n  -moz-user-select: none;\r\n  -ms-user-select: none;\r\n  user-select: none;           \r\n}\r\n\r\n\r\nkritzel-controls {\r\n  position: absolute;\r\n  bottom: 28px;\r\n}","import { Component, Host, Listen, Prop, Element, h, Method, Event, State, EventEmitter, Watch } from '@stencil/core';\r\nimport { KritzelIconRegistry } from '../../../classes/registries/icon-registry.class';\r\nimport { KritzelToolbarControl } from '../../../interfaces/toolbar-control.interface';\r\nimport { KritzelBaseObject } from '../../../classes/objects/base-object.class';\r\nimport { KritzelSelectionTool } from '../../../classes/tools/selection-tool.class';\r\nimport { KritzelEraserTool } from '../../../classes/tools/eraser-tool.class';\r\nimport { KritzelImageTool } from '../../../classes/tools/image-tool.class';\r\nimport { KritzelBrushTool } from '../../../classes/tools/brush-tool.class';\r\nimport { KritzelTextTool } from '../../../classes/tools/text-tool.class';\r\nimport { ContextMenuItem } from '../../../interfaces/context-menu-item.interface';\r\nimport { DEFAULT_BRUSH_CONFIG } from '../../../configs/default-brush-tool.config';\r\nimport { DEFAULT_TEXT_CONFIG } from '../../../configs/default-text-tool.config';\r\nimport { ABSOLUTE_SCALE_MAX, ABSOLUTE_SCALE_MIN } from '../../../constants/engine.constants';\r\n\r\n@Component({\r\n  tag: 'kritzel-editor',\r\n  styleUrl: 'kritzel-editor.css',\r\n  shadow: false,\r\n})\r\nexport class KritzelEditor {\r\n  @Prop()\r\n  scaleMax: number = ABSOLUTE_SCALE_MAX;\r\n\r\n  @Prop()\r\n  scaleMin: number = ABSOLUTE_SCALE_MIN;\r\n\r\n  @Prop()\r\n  controls: KritzelToolbarControl[] = [\r\n    {\r\n      name: 'selection',\r\n      type: 'tool',\r\n      tool: KritzelSelectionTool,\r\n      icon: 'cursor',\r\n    },\r\n    {\r\n      name: 'brush',\r\n      type: 'tool',\r\n      tool: KritzelBrushTool,\r\n      icon: 'pen',\r\n      isDefault: true,\r\n      config: DEFAULT_BRUSH_CONFIG,\r\n    },\r\n    {\r\n      name: 'eraser',\r\n      type: 'tool',\r\n      tool: KritzelEraserTool,\r\n      icon: 'eraser',\r\n    },\r\n    {\r\n      name: 'text',\r\n      type: 'tool',\r\n      tool: KritzelTextTool,\r\n      icon: 'type',\r\n      config: DEFAULT_TEXT_CONFIG,\r\n    },\r\n    {\r\n      name: 'image',\r\n      type: 'tool',\r\n      tool: KritzelImageTool,\r\n      icon: 'image',\r\n    },\r\n    {\r\n      name: 'divider',\r\n      type: 'divider',\r\n    },\r\n    {\r\n      name: 'config',\r\n      type: 'config',\r\n    },\r\n  ];\r\n\r\n  @Prop()\r\n  globalContextMenuItems: ContextMenuItem[] = [\r\n    {\r\n      label: 'Paste',\r\n      icon: 'paste',\r\n      disabled: async () => (await this.engineRef.getCopiedObjects()).length === 0,\r\n      action: menu => this.engineRef.paste(menu.x, menu.y),\r\n    },\r\n    { label: 'Select All', icon: 'select-all', action: () => this.selectAllObjectsInViewport() },\r\n  ];\r\n\r\n  @Prop()\r\n  objectContextMenuItems: ContextMenuItem[] = [\r\n    {\r\n      label: 'Edit',\r\n      icon: 'pen',\r\n      visible: (_, objects) => objects.length === 1 && objects[0].isEditable,\r\n      action: (_, objects) => {\r\n        if (objects.length === 1) {\r\n          const object = objects[0];\r\n          if (object.isEditable) {\r\n            object.edit();\r\n          }\r\n        }\r\n      },\r\n    },\r\n    { label: 'Copy', icon: 'copy', action: () => this.engineRef.copy() },\r\n    {\r\n      label: 'Paste',\r\n      icon: 'paste',\r\n      disabled: async () => (await this.engineRef.getCopiedObjects()).length === 0,\r\n      action: (menu, _) => this.engineRef.paste(menu.x, menu.y),\r\n    },\r\n    { label: 'Delete', icon: 'delete', action: () => this.engineRef.delete() },\r\n    { label: 'Bring to Front', icon: 'bring-to-front', action: () => this.engineRef.bringToFront() },\r\n    { label: 'Send to Back', icon: 'send-to-back', action: () => this.engineRef.sendToBack() },\r\n  ];\r\n\r\n  @Prop()\r\n  customSvgIcons: Record<string, string> = {};\r\n\r\n  @Prop()\r\n  isControlsVisible: boolean = true;\r\n\r\n  @Prop()\r\n  isUtilityPanelVisible: boolean = true;\r\n\r\n  @Event()\r\n  isReady: EventEmitter<HTMLElement>;\r\n\r\n  @Element()\r\n  host!: HTMLElement;\r\n\r\n  @State()\r\n  isEngineReady: boolean = false;\r\n\r\n  @State()\r\n  isControlsReady: boolean = false;\r\n\r\n  @Watch('isEngineReady')\r\n  onIsEngineReady(newValue: boolean) {\r\n    if (newValue && this.isControlsReady) {\r\n      this.checkIsReady();\r\n    }\r\n  }\r\n\r\n  @Watch('isControlsReady')\r\n  onIsControlsReady(newValue: boolean) {\r\n    if (newValue && this.isEngineReady) {\r\n      this.checkIsReady();\r\n    }\r\n  }\r\n\r\n  @Method()\r\n  async getObjectById<T extends KritzelBaseObject>(id: string): Promise<T | null> {\r\n    return this.engineRef.getObjectById(id);\r\n  }\r\n\r\n  @Method()\r\n  async addObject<T extends KritzelBaseObject>(object: T): Promise<T | null> {\r\n    return this.engineRef.addObject(object);\r\n  }\r\n\r\n  @Method()\r\n  async updateObject<T extends KritzelBaseObject>(object: T, updatedProperties: Partial<T>): Promise<T | null> {\r\n    return this.engineRef.updateObject(object, updatedProperties);\r\n  }\r\n\r\n  @Method()\r\n  async removeObject<T extends KritzelBaseObject>(object: T): Promise<T | null> {\r\n    return this.engineRef.removeObject(object);\r\n  }\r\n\r\n  @Method()\r\n  async getSelectedObjects(): Promise<KritzelBaseObject[]> {\r\n    return this.engineRef.getSelectedObjects();\r\n  }\r\n\r\n  @Method()\r\n  async selectObjects(objects: KritzelBaseObject[]) {\r\n    return this.engineRef.selectObjects(objects);\r\n  }\r\n\r\n  @Method()\r\n  async selectAllObjectsInViewport() {\r\n    return this.engineRef.selectAllObjectsInViewport();\r\n  }\r\n\r\n  @Method()\r\n  async clearSelection() {\r\n    this.engineRef.clearSelection();\r\n  }\r\n\r\n  @Method()\r\n  async centerObjectInViewport(object: KritzelBaseObject) {\r\n    return this.engineRef.centerObjectInViewport(object);\r\n  }\r\n\r\n  @Listen('dblclick', { passive: false })\r\n  handleTouchStart(event: MouseEvent) {\r\n    if (event.cancelable) {\r\n      event.preventDefault();\r\n    }\r\n  }\r\n\r\n  @Listen('keydown', { target: 'window' })\r\n  handleKeyDown(event) {\r\n    if (event.key === 'Escape') {\r\n      event.preventDefault();\r\n      this.controlsRef?.closeTooltip();\r\n    }\r\n  }\r\n\r\n  engineRef!: HTMLKritzelEngineElement;\r\n\r\n  controlsRef!: HTMLKritzelControlsElement;\r\n\r\n  componentDidLoad() {\r\n    this.registerCustomSvgIcons();\r\n  }\r\n\r\n  async checkIsReady() {\r\n    await customElements.whenDefined('kritzel-editor');\r\n    await customElements.whenDefined('kritzel-controls');\r\n    await customElements.whenDefined('kritzel-engine');\r\n\r\n    if (!this.isEngineReady || !this.isControlsReady) {\r\n      return;\r\n    }\r\n\r\n    this.isReady.emit(this.host);\r\n  }\r\n\r\n  private registerCustomSvgIcons() {\r\n    for (const [name, svg] of Object.entries(this.customSvgIcons)) {\r\n      KritzelIconRegistry.register(name, svg);\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host>\r\n        <kritzel-engine\r\n          ref={el => (this.engineRef = el)}\r\n          onIsEngineReady={() => (this.isEngineReady = true)}\r\n          scaleMax={this.scaleMax}\r\n          scaleMin={this.scaleMin}\r\n          globalContextMenuItems={this.globalContextMenuItems}\r\n          objectContextMenuItems={this.objectContextMenuItems}\r\n        ></kritzel-engine>\r\n\r\n        <kritzel-controls\r\n          ref={el => (this.controlsRef = el)}\r\n          controls={this.controls}\r\n          isUtilityPanelVisible={this.isUtilityPanelVisible}\r\n          style={this.isControlsVisible ? { display: 'flex' } : { display: 'none' }}\r\n          onIsControlsReady={() => (this.isControlsReady = true)}\r\n        ></kritzel-controls>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"version":3}

package/dist/components/kritzel-engine.js

@@ -0,0 +1,9 @@
+import { d as KritzelEngine$1, e as defineCustomElement$1 } from './p-CudOuOAW.js';
+
+const KritzelEngine = KritzelEngine$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { KritzelEngine, defineCustomElement };
+//# sourceMappingURL=kritzel-engine.js.map
+
+//# sourceMappingURL=kritzel-engine.js.map

package/dist/components/kritzel-engine.js.map

@@ -0,0 +1 @@
+{"file":"kritzel-engine.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/kritzel-font-family.js

@@ -0,0 +1,9 @@
+import { K as KritzelFontFamily$1, d as defineCustomElement$1 } from './p-BubFkS0u.js';
+
+const KritzelFontFamily = KritzelFontFamily$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { KritzelFontFamily, defineCustomElement };
+//# sourceMappingURL=kritzel-font-family.js.map
+
+//# sourceMappingURL=kritzel-font-family.js.map

package/dist/components/kritzel-font-family.js.map

@@ -0,0 +1 @@
+{"file":"kritzel-font-family.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/kritzel-font-size.js

@@ -0,0 +1,9 @@
+import { K as KritzelFontSize$1, d as defineCustomElement$1 } from './p-DcvujuV_.js';
+
+const KritzelFontSize = KritzelFontSize$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { KritzelFontSize, defineCustomElement };
+//# sourceMappingURL=kritzel-font-size.js.map
+
+//# sourceMappingURL=kritzel-font-size.js.map

package/dist/components/kritzel-font-size.js.map

@@ -0,0 +1 @@
+{"file":"kritzel-font-size.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/kritzel-font.js

@@ -0,0 +1,9 @@
+import { K as KritzelFont$1, d as defineCustomElement$1 } from './p-Dp8hrISj.js';
+
+const KritzelFont = KritzelFont$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { KritzelFont, defineCustomElement };
+//# sourceMappingURL=kritzel-font.js.map
+
+//# sourceMappingURL=kritzel-font.js.map

package/dist/components/kritzel-font.js.map

@@ -0,0 +1 @@
+{"file":"kritzel-font.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/kritzel-icon.js

@@ -0,0 +1,9 @@
+import { K as KritzelIcon$1, d as defineCustomElement$1 } from './p-CtiROna-.js';
+
+const KritzelIcon = KritzelIcon$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { KritzelIcon, defineCustomElement };
+//# sourceMappingURL=kritzel-icon.js.map
+
+//# sourceMappingURL=kritzel-icon.js.map

package/dist/components/kritzel-icon.js.map

@@ -0,0 +1 @@
+{"file":"kritzel-icon.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/kritzel-stroke-size.js

@@ -0,0 +1,9 @@
+import { K as KritzelStrokeSize$1, d as defineCustomElement$1 } from './p-D5a8vnRF.js';
+
+const KritzelStrokeSize = KritzelStrokeSize$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { KritzelStrokeSize, defineCustomElement };
+//# sourceMappingURL=kritzel-stroke-size.js.map
+
+//# sourceMappingURL=kritzel-stroke-size.js.map

package/dist/components/kritzel-stroke-size.js.map

@@ -0,0 +1 @@
+{"file":"kritzel-stroke-size.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/kritzel-tooltip.js

@@ -0,0 +1,9 @@
+import { K as KritzelTooltip$1, d as defineCustomElement$1 } from './p-CmlcJ8Kw.js';
+
+const KritzelTooltip = KritzelTooltip$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { KritzelTooltip, defineCustomElement };
+//# sourceMappingURL=kritzel-tooltip.js.map
+
+//# sourceMappingURL=kritzel-tooltip.js.map

package/dist/components/kritzel-tooltip.js.map

@@ -0,0 +1 @@
+{"file":"kritzel-tooltip.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/kritzel-utility-panel.js

@@ -0,0 +1,9 @@
+import { K as KritzelUtilityPanel$1, d as defineCustomElement$1 } from './p-BOUCnklW.js';
+
+const KritzelUtilityPanel = KritzelUtilityPanel$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { KritzelUtilityPanel, defineCustomElement };
+//# sourceMappingURL=kritzel-utility-panel.js.map
+
+//# sourceMappingURL=kritzel-utility-panel.js.map

package/dist/components/kritzel-utility-panel.js.map

@@ -0,0 +1 @@
+{"file":"kritzel-utility-panel.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/{stencil/kritzel-context-menu-B2p1_Ffh.js → components/p-2gNwfcSP.js}

@@ -1,11 +1,14 @@
-import { r as registerInstance, a as createEvent, h, d as Host, e as getElement } from './index-Df69oUcb.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-DJN0U8pI.js';
+import { d as defineCustomElement$1 } from './p-CtiROna-.js';
 
 const kritzelContextMenuCss = ":host{display:block}.menu-container{display:flex;flex-direction:column;background-color:var(--kritzel-context-menu-background-color, #ffffff);border-radius:var(--kritzel-context-menu-border-radius, 12px);box-shadow:var(--kritzel-context-menu-box-shadow, 0 1px 6px rgba(0, 0, 0, 0.12));border:var(--kritzel-context-menu-border, 1px solid #f0f0f0);padding:var(--kritzel-context-menu-padding,4px)}.menu-item{display:flex;align-items:center;gap:var(--kritzel-context-menu-item-gap, 8px);background:none;border:none;text-align:left;padding:var(--kritzel-context-menu-item-padding, 8px);border-radius:var(--kritzel-context-menu-item-border-radius, 12px);cursor:pointer;font-size:var(--kritzel-context-menu-item-font-size, 14px);color:var(--kritzel-context-menu-item-color, #333333);white-space:nowrap;-webkit-tap-highlight-color:transparent}.menu-item:not(.disabled):hover{background-color:var(--kritzel-context-menu-item-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.menu-item:not(.disabled):active{background-color:var(--kritzel-context-menu-item-active-background-color, hsl(0, 0%, 0%, 8.6%))}.menu-item.disabled{color:var(--kritzel-context-menu-item-disabled-color, #aaaaaa);cursor:default}.menu-item kritzel-icon{opacity:0.8;flex-shrink:0}.menu-item.disabled kritzel-icon{opacity:0.4}.label{flex-grow:1}";
 
-const KritzelContextMenu = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.actionSelected = createEvent(this, "actionSelected", 7);
+const KritzelContextMenu = /*@__PURE__*/ proxyCustomElement(class KritzelContextMenu extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.actionSelected = createEvent(this, "actionSelected");
         this.disabledStates = new Map();
         this.visibleItems = [];
     }
@@ -78,14 +81,39 @@ const KritzelContextMenu = class {
             return (h("button", { key: `${item.label}-${index}`, class: { 'menu-item': true, 'disabled': isDisabled }, onClick: () => this.handleItemClick(item, index), onTouchStart: () => this.handleItemClick(item, index), disabled: isDisabled }, item.icon && h("kritzel-icon", { name: item.icon, size: 16 }), h("span", { class: "label" }, item.label)));
         }))));
     }
-    get hostElement() { return getElement(this); }
+    get hostElement() { return this; }
     static get watchers() { return {
         "items": ["onItemsChanged"]
     }; }
-};
-KritzelContextMenu.style = kritzelContextMenuCss;
+    static get style() { return kritzelContextMenuCss; }
+}, [257, "kritzel-context-menu", {
+        "items": [16],
+        "objects": [16],
+        "disabledStates": [32],
+        "visibleItems": [32]
+    }, undefined, {
+        "items": ["onItemsChanged"]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["kritzel-context-menu", "kritzel-icon"];
+    components.forEach(tagName => { switch (tagName) {
+        case "kritzel-context-menu":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, KritzelContextMenu);
+            }
+            break;
+        case "kritzel-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
 
-export { KritzelContextMenu as K };
-//# sourceMappingURL=kritzel-context-menu-B2p1_Ffh.js.map
+export { KritzelContextMenu as K, defineCustomElement as d };
+//# sourceMappingURL=p-2gNwfcSP.js.map
 
-//# sourceMappingURL=kritzel-context-menu-B2p1_Ffh.js.map
+//# sourceMappingURL=p-2gNwfcSP.js.map

package/dist/components/p-2gNwfcSP.js.map

@@ -0,0 +1 @@
+{"file":"p-2gNwfcSP.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ui/kritzel-context-menu/kritzel-context-menu.css?tag=kritzel-context-menu&encapsulation=shadow","src/components/ui/kritzel-context-menu/kritzel-context-menu.tsx"],"sourcesContent":[":host {\r\n  display: block; \r\n}\r\n\r\n.menu-container {\r\n  display: flex;\r\n  flex-direction: column;\r\n  background-color: var(--kritzel-context-menu-background-color, #ffffff);\r\n  border-radius: var(--kritzel-context-menu-border-radius, 12px);\r\n  box-shadow: var(--kritzel-context-menu-box-shadow, 0 1px 6px rgba(0, 0, 0, 0.12));\r\n  border: var(--kritzel-context-menu-border, 1px solid #f0f0f0);\r\n  padding: var(--kritzel-context-menu-padding,4px);\r\n}\r\n\r\n.menu-item {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--kritzel-context-menu-item-gap, 8px);\r\n  background: none;\r\n  border: none;\r\n  text-align: left;\r\n  padding: var(--kritzel-context-menu-item-padding, 8px);\r\n  border-radius: var(--kritzel-context-menu-item-border-radius, 12px);\r\n  cursor: pointer;\r\n  font-size: var(--kritzel-context-menu-item-font-size, 14px);\r\n  color: var(--kritzel-context-menu-item-color, #333333);\r\n  white-space: nowrap;\r\n  -webkit-tap-highlight-color: transparent;\r\n}\r\n\r\n.menu-item:not(.disabled):hover {\r\n  background-color: var(--kritzel-context-menu-item-hover-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n.menu-item:not(.disabled):active {\r\n  background-color: var(--kritzel-context-menu-item-active-background-color, hsl(0, 0%, 0%, 8.6%));\r\n}\r\n\r\n.menu-item.disabled {\r\n  color: var(--kritzel-context-menu-item-disabled-color, #aaaaaa);\r\n  cursor: default;\r\n}\r\n\r\n.menu-item kritzel-icon {\r\n  opacity: 0.8;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.menu-item.disabled kritzel-icon {\r\n  opacity: 0.4;\r\n}\r\n\r\n.label {\r\n  flex-grow: 1;\r\n}\r\n","import { Component, Host, h, Prop, Event, EventEmitter, Element, State, Watch } from '@stencil/core';\r\nimport { ContextMenuItem } from '../../../interfaces/context-menu-item.interface';\r\nimport { KritzelBaseObject } from '../../../classes/objects/base-object.class';\r\n\r\n@Component({\r\n  tag: 'kritzel-context-menu',\r\n  styleUrl: 'kritzel-context-menu.css',\r\n  shadow: true,\r\n})\r\nexport class KritzelContextMenu {\r\n  @Prop()\r\n  items: ContextMenuItem[];\r\n\r\n  @Prop()\r\n  objects: KritzelBaseObject[];\r\n\r\n  @Event()\r\n  actionSelected: EventEmitter<ContextMenuItem>;\r\n\r\n  @Element()\r\n  hostElement: HTMLElement;\r\n\r\n  @State()\r\n  private disabledStates: Map<number, boolean> = new Map();\r\n\r\n  @State()\r\n  private visibleItems: ContextMenuItem[] = [];\r\n\r\n  componentWillLoad() {\r\n    this.resolveVisibleItems();\r\n    this.resolveDisabledStates();\r\n  }\r\n\r\n\r\n  @Watch('items')\r\n  onItemsChanged() {\r\n    this.resolveVisibleItems();\r\n    this.resolveDisabledStates();\r\n  }\r\n\r\n  private handleItemClick(item: ContextMenuItem, index: number) {\r\n    if (!this.disabledStates.get(index)) {\r\n      this.actionSelected.emit(item);\r\n    }\r\n  }\r\n\r\n  private async resolveVisibleItems() {\r\n    const visibleItems: ContextMenuItem[] = [];\r\n    const visibilityPromises = this.items.map(async (item, index) => {\r\n      let isVisible = true;\r\n      if (item.visible !== undefined) {\r\n        if (typeof item.visible === 'boolean') {\r\n          isVisible = item.visible;\r\n        } else if (typeof item.visible === 'function') {\r\n          const result = item.visible(null, this.objects);\r\n          if (result instanceof Promise) {\r\n            isVisible = await result;\r\n          } else {\r\n            isVisible = result;\r\n          }\r\n        }\r\n      }\r\n      return { item, index, isVisible };\r\n    });\r\n\r\n    const visibilityResults = await Promise.all(visibilityPromises);\r\n    visibilityResults.forEach(({ item, isVisible }) => {\r\n      if (isVisible) {\r\n        visibleItems.push(item);\r\n      }\r\n    });\r\n\r\n    this.visibleItems = visibleItems;\r\n  }\r\n\r\n  private async resolveDisabledStates() {\r\n    const newStates = new Map<number, boolean>();\r\n    const disabledPromises = this.visibleItems.map(async (item, index) => {\r\n      let isDisabled = false;\r\n      if (typeof item.disabled === 'boolean') {\r\n        isDisabled = item.disabled;\r\n      } else if (typeof item.disabled === 'function') {\r\n        const result = item.disabled(null, this.objects);\r\n        if (result instanceof Promise) {\r\n          isDisabled = await result;\r\n        } else {\r\n          isDisabled = result;\r\n        }\r\n      }\r\n      newStates.set(index, isDisabled);\r\n    });\r\n\r\n    await Promise.all(disabledPromises);\r\n    this.disabledStates = new Map(newStates);\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host>\r\n        <div class=\"menu-container\">\r\n          {this.visibleItems.map((item, index) => {\r\n            const isDisabled = this.disabledStates.get(index) ?? false;\r\n            return (\r\n              <button\r\n                key={`${item.label}-${index}`}\r\n                class={{ 'menu-item': true, 'disabled': isDisabled }}\r\n                onClick={() => this.handleItemClick(item, index)}\r\n                onTouchStart={() => this.handleItemClick(item, index)}\r\n                disabled={isDisabled}\r\n              >\r\n                {item.icon && <kritzel-icon name={item.icon} size={16}></kritzel-icon>}\r\n                <span class=\"label\">{item.label}</span>\r\n              </button>\r\n            );\r\n          })}\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"version":3}