npm - kritzel-stencil - Versions diffs - 0.0.125 → 0.0.127 - Mend

kritzel-stencil 0.0.125 → 0.0.127

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (107) hide show

package/dist/collection/components/shared/kritzel-tooltip/kritzel-tooltip.js CHANGED Viewed

@@ -37,23 +37,23 @@ export class KritzelTooltip {
         }
     }
     render() {
-        return (h(Host, { key: '3161826337f6957d2e568f52cfe3f57d705af0ed', style: {
+        return (h(Host, { key: 'aed123eda0750df66229f0dd40eeafea39360901', style: {
                 position: 'fixed',
                 zIndex: '9999',
                 transition: 'opacity 0.3s ease-in-out, transform 0.3s ease-in-out',
                 visibility: this.isVisible ? 'visible' : 'hidden',
                 left: !this.isMobileView ? `${this.positionX}px` : '50%',
                 marginBottom: `${this.offsetY + this.arrowSize}px`,
-            } }, h("div", { key: '12fc4bc05b7be756102ce3779c9be1d51f3fe13b', class: "tooltip-content", onClick: event => event.stopPropagation() }, h("slot", { key: '90f645f8f7cec371aaeda7207a9fb420b02b2ae4' }), h("div", { key: '73380e2c6df22bc4a97479a52315e7b34d069fa1', class: "tooltip-arrow-wrapper", style: {
+            } }, h("div", { key: 'ebd77cc44aea3a3ff193717f2dae7eedb55023fd', class: "tooltip-content", onClick: event => event.stopPropagation() }, h("slot", { key: '70966228bbe59b894eb472704f08b340c32bbad9' }), h("div", { key: '0d82c0f5b1531b39e48b9e80045771e3dda53964', class: "tooltip-arrow-wrapper", style: {
                 position: 'fixed',
                 left: this.arrowOffset,
                 bottom: `-${this.arrowSize * 2}px`,
-            } }, h("div", { key: '2e13cb01a3282e161d3212f4970a93b20ca1a0fe', class: "tooltip-arrow", style: {
+            } }, h("div", { key: '24b911e6fe5b5b9a1009d28c797c4c3d00f6f7c7', class: "tooltip-arrow", style: {
                 borderLeft: `${this.arrowSize}px solid transparent`,
                 borderRight: `${this.arrowSize}px solid transparent`,
                 borderTop: `${this.arrowSize}px solid var(--kritzel-controls-tooltip-background-color, #ffffff)`,
                 filter: 'drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2))',
-            } }), h("div", { key: '30ddbd00b928c0c734656d6309eaefbae5baf264', class: "tooltip-arrow-rect", style: {
+            } }), h("div", { key: '2a15c5e8614e57a763aa3d8d4f8d4138146ac0a7', class: "tooltip-arrow-rect", style: {
                 position: 'relative',
                 width: `${this.arrowSize * 2}px`,
                 height: `${this.arrowSize}px`,

package/dist/collection/components/ui/kritzel-context-menu/kritzel-context-menu.js CHANGED Viewed

@@ -67,7 +67,7 @@ export class KritzelContextMenu {
         this.disabledStates = new Map(newStates);
     }
     render() {
-        return (h(Host, { key: '3265d2e63ff1e1f91faf1c6c5da3490687f3adb1' }, h("div", { key: '80b2100e2ffcaba25ca08cfec650b1f7558c5d25', class: "menu-container" }, this.visibleItems.map((item, index) => {
+        return (h(Host, { key: 'cc1a338a7bf0d32764c2737f4f32774ccb22370a' }, h("div", { key: '4a83b9366332e42b506c3c876c00d77498a2b8b5', class: "menu-container" }, this.visibleItems.map((item, index) => {
             var _a;
             const isDisabled = (_a = this.disabledStates.get(index)) !== null && _a !== void 0 ? _a : false;
             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)));

package/dist/collection/components/ui/kritzel-control-brush-config/kritzel-control-brush-config.js CHANGED Viewed

@@ -28,14 +28,14 @@ export class KritzelControlBrushConfig {
         this.toolChange.emit(this.tool);
     }
     render() {
-        return (h(Host, { key: '8e7930fcc093f7277ed088d8ec5e54e4cd051b86' }, h("div", { key: '08bd37b90decc9054c05d646aabbba0a4985d04c', style: {
+        return (h(Host, { key: 'c200146a90a3dd72241e098eff555312fd3125a9' }, h("div", { key: '886492ec4c5e15954166c4a7569ba832d0e6eff8', style: {
                 display: 'flex',
                 flexDirection: 'row',
                 alignItems: 'center',
                 justifyContent: 'flex-start',
                 width: '100%',
                 gap: '8px',
-            } }, h("kritzel-brush-style", { key: 'f79744fb6523d0b4fa67c324cbf8ff3eb8a0308d', type: this.tool.type, onTypeChange: event => this.handleTypeChange(event) }), h("button", { key: 'dc3bdd90cebb29f2357e13dbc8d2dcaf02ae056e', class: "expand-toggle", onClick: () => this.handleToggleExpand(), title: this.isExpanded ? 'Collapse' : 'Expand', style: this.palette.length > 6 ? { visibillity: 'visible' } : { visibility: 'hidden' } }, h("kritzel-icon", { key: '6e9e6de7fc7c708aad700498e030d2ad7364a9f3', name: this.isExpanded ? 'chevron-up' : 'chevron-down' }))), h("kritzel-color-palette", { key: 'c1ffd48a475754bb1447e9d866b494fd3476f050', colors: this.palette, selectedColor: this.tool.color, isExpanded: this.isExpanded, isOpaque: true, onColorChange: color => this.handleColorChange(color) }), h("kritzel-stroke-size", { key: '38e265b42fe09d0105e0385d7ec8e7d8d318abb0', selectedSize: this.tool.size, onSizeChange: event => this.handleSizeChange(event) })));
+            } }, h("kritzel-brush-style", { key: '64e205189fbd740c01d4fd94c5098edae574d69b', type: this.tool.type, onTypeChange: event => this.handleTypeChange(event) }), h("button", { key: '4b2d0fbf4d485350223dbc27601e78ab37be8df5', class: "expand-toggle", onClick: () => this.handleToggleExpand(), title: this.isExpanded ? 'Collapse' : 'Expand', style: this.palette.length > 6 ? { visibillity: 'visible' } : { visibility: 'hidden' } }, h("kritzel-icon", { key: '35262e8456901d10c84437e578317287282cf690', name: this.isExpanded ? 'chevron-up' : 'chevron-down' }))), h("kritzel-color-palette", { key: '4f519179f419a3e3567d2db39d0d8f9f30d5a6a1', colors: this.palette, selectedColor: this.tool.color, isExpanded: this.isExpanded, isOpaque: true, onColorChange: color => this.handleColorChange(color) }), h("kritzel-stroke-size", { key: '05f05946c3ebd2707f1c41c236a2efca47cedbec', selectedSize: this.tool.size, onSizeChange: event => this.handleSizeChange(event) })));
     }
     static get is() { return "kritzel-control-brush-config"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ui/kritzel-control-text-config/kritzel-control-text-config.js CHANGED Viewed

@@ -19,14 +19,14 @@ export class KritzelControlTextConfig {
         this.toolChange.emit(this.tool);
     }
     render() {
-        return (h(Host, { key: '27d47c47987fb7644313a4face4a7023dfbe454d' }, h("div", { key: '835b8072267da18b39a5c02a6c989e1f7b81e9a5', style: {
+        return (h(Host, { key: '1c8463a1f6b7bcf81f3b58fc0064330c50d6ada9' }, h("div", { key: '69825e6c9be473dda3597c86d51dffff9a6418fd', style: {
                 display: 'flex',
                 flexDirection: 'row',
                 alignItems: 'center',
                 justifyContent: 'flex-start',
                 width: '100%',
                 gap: '8px',
-            } }, h("kritzel-font-family", { key: 'b7a0bde2e9cf53c9ae7c3a32b424825ca9f757c4', selectedFontFamily: this.tool.fontFamily, onFontFamilyChange: event => this.handleFamilyChange(event) }), h("button", { key: '41aba583656195c4825a15ddc12c5e1efed0d8d2', class: "expand-toggle", onClick: () => this.handleToggleExpand(), title: this.isExpanded ? 'Collapse' : 'Expand' }, h("kritzel-icon", { key: '5ff979420066703b5d5e886d12f89687392006e3', name: this.isExpanded ? 'chevron-up' : 'chevron-down' }))), h("kritzel-color-palette", { key: '30fbcc05f80b15fba7f1f5ac6413732d0149ee9b', colors: this.tool.palette, selectedColor: this.tool.fontColor, isExpanded: this.isExpanded, onColorChange: event => this.handleColorChange(event) }), h("kritzel-font-size", { key: '2a0d3c4578316b37bc1a25b6e065ecf565eca2b3', selectedSize: this.tool.fontSize, fontFamily: this.tool.fontFamily, onSizeChange: event => this.handleSizeChange(event) })));
+            } }, h("kritzel-font-family", { key: '56c947950e32989782512a2b00e3be0aaa12d77b', selectedFontFamily: this.tool.fontFamily, onFontFamilyChange: event => this.handleFamilyChange(event) }), h("button", { key: '83fdb5908340adc032a7abae9b4b678697e0cff8', class: "expand-toggle", onClick: () => this.handleToggleExpand(), title: this.isExpanded ? 'Collapse' : 'Expand' }, h("kritzel-icon", { key: '739c175fbc3c0c5c342f2983d0e47323bc5b56f4', name: this.isExpanded ? 'chevron-up' : 'chevron-down' }))), h("kritzel-color-palette", { key: '98251da71574b3487bf6ee46f7e4e95d133e1eea', colors: this.tool.palette, selectedColor: this.tool.fontColor, isExpanded: this.isExpanded, onColorChange: event => this.handleColorChange(event) }), h("kritzel-font-size", { key: '95c88611a6631a4db5d200aac57e7eeef2c195b8', selectedSize: this.tool.fontSize, fontFamily: this.tool.fontFamily, onSizeChange: event => this.handleSizeChange(event) })));
     }
     static get is() { return "kritzel-control-text-config"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ui/kritzel-controls/kritzel-controls.js CHANGED Viewed

@@ -87,13 +87,13 @@ export class KritzelControls {
     render() {
         var _a, _b;
         const hasNoConfig = ((_a = this.activeControl) === null || _a === void 0 ? void 0 : _a.config) === undefined || ((_b = this.activeControl) === null || _b === void 0 ? void 0 : _b.config) === null;
-        return (h(Host, { key: '5531510d4b95c082148ce3e8f5d3048f808162b2', class: {
+        return (h(Host, { key: 'dfb17219cf1d27d86148bc918b8303d74244700c', class: {
                 mobile: this.isTouchDevice,
-            } }, this.isUtilityPanelVisible && (h("kritzel-utility-panel", { key: 'e7e58ee4ae6a8a77918d5c8a954c2dcae287b265', style: {
+            } }, this.isUtilityPanelVisible && (h("kritzel-utility-panel", { key: 'a5eb7c6b59a193ba0bdde53812882c355a7658d4', style: {
                 position: 'absolute',
                 bottom: '56px',
                 left: '12px',
-            }, onUndo: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.undo(); }, onRedo: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.redo(); }, onDelete: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.delete(); } })), h("div", { key: '65ad87089a38f3e89f8332fc6f261555c2e7eb40', class: "kritzel-controls" }, this.controls.map(control => {
+            }, onUndo: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.undo(); }, onRedo: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.redo(); }, onDelete: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.delete(); } })), h("div", { key: 'b51e49664bf6330f22fb07ef64116459ec3832b3', class: "kritzel-controls" }, this.controls.map(control => {
             var _a, _b, _c, _d, _e, _f, _g, _h;
             if (control.type === 'tool') {
                 return (h("button", { class: {

package/dist/collection/components/ui/kritzel-utility-panel/kritzel-utility-panel.js CHANGED Viewed

@@ -13,7 +13,7 @@ export class KritzelUtilityPanel {
         this.redo.emit();
     }
     render() {
-        return (h(Host, { key: '496ed78323c9899ad363e7f7732a1464d99e1b3b' }, h("button", { key: '7b6b9cd238a8d254f032d5752f184d567e9a3096', class: "utility-button", onClick: event => this.handleUndo(event) }, h("kritzel-icon", { key: '8ac19f36c6b82f7cc4a0249e60cf429f75c09218', name: "undo" })), h("button", { key: '1164727510a968356042507c1e302b85a135baf8', class: "utility-button", onClick: event => this.handleRedo(event) }, h("kritzel-icon", { key: '1c6cc414d5841a06853f99316eee7a0a609d5c92', name: "redo" })), h("div", { key: 'e6f3342569b1c6b5a6b267cc215bc8e5d259e302', class: "utility-separator" }), h("button", { key: '0aa486a543df924c224f3637857cdcdb06f995ea', class: "utility-button" }, h("kritzel-icon", { key: '9ee324e03f5df5297916549743539f7f19950768', name: "delete", onClick: () => this.delete.emit() }))));
+        return (h(Host, { key: 'f381fac2cb032ca19c6945ef4f39673ea0bd0cc5' }, h("button", { key: '1f7200672970baf1d0cfcaa116fa3f8f9a39832a', class: "utility-button", onClick: event => this.handleUndo(event) }, h("kritzel-icon", { key: '755d9201d80d8db086f07b38e90a01a06e980b50', name: "undo" })), h("button", { key: '06e4d5c2956f23245c3d48f21c15d54e8bef8119', class: "utility-button", onClick: event => this.handleRedo(event) }, h("kritzel-icon", { key: '13eb6b31c45b67ac399fc7c84b941ddce04c5c86', name: "redo" })), h("div", { key: '7f03a576a37649db679b93604c2654d29cc81da4', class: "utility-separator" }), h("button", { key: '0c40613e9f6a049cec872d71e9f948d685ec1dbe', class: "utility-button" }, h("kritzel-icon", { key: '8cba73bcb02ef8b7c182ba2fd16d98d6855f1c1b', name: "delete", onClick: () => this.delete.emit() }))));
     }
     static get is() { return "kritzel-utility-panel"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/interfaces/object.interface.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"object.interface.js","sourceRoot":"","sources":["../../src/interfaces/object.interface.ts"],"names":[],"mappings":"","sourcesContent":["import { KritzelBaseObject } from '../classes/objects/base-object.class';\r\nimport { KritzelBoundingBox } from './bounding-box.interface';\r\nimport { KritzelPolygon } from './polygon.interface';\r\n\r\nexport interface KritzelObject<T = Element> {\r\n _elementRef: T;\r\n\r\n id: string;\r\n x: number;\r\n y: number;\r\n translateX: number;\r\n translateY: number;\r\n height: number;\r\n width: number;\r\n backgroundColor: string;\r\n borderColor: string;\r\n borderWidth: number;\r\n opacity: number;\r\n scale: number;\r\n resizing: boolean;\r\n rotation: number;\r\n markedForRemoval: boolean;\r\n zIndex: number;\r\n\r\n isVisible: boolean;\r\n isSelected: boolean;\r\n isHovered: boolean;\r\n isMounted: boolean;\r\n isEditable: boolean;\r\n isInteractive: boolean;\r\n isDebugInfoVisible: boolean;\r\n\r\n set elementRef(element: T);\r\n get elementRef(): T;\r\n get boundingBox(): KritzelBoundingBox;\r\n get totalWidth(): number;\r\n get totalHeight(): number;\r\n get rotationDegrees(): number;\r\n get centerX(): number;\r\n get centerY(): number;\r\n\r\n mount(element: T): void;\r\n unmount(): void;\r\n remount(): void;\r\n generateId(): string;\r\n isInViewport(viewport: KritzelBoundingBox, scale: number): boolean;\r\n centerInViewport(): void;\r\n move(startX: number, startY: number, endX: number, endY: number): void;\r\n resize(x: number, y: number, width: number, height: number): void;\r\n rotate(value: number): void;\r\n copy(): KritzelBaseObject<Element>;\r\n onSelectedClick(): void;\r\n isClass<T extends KritzelBaseObject>(this: T, type: string): this is T;\r\n edit(): void;\r\n hitTest(x: number, y: number): boolean;\r\n hitTestPolygon(polygon: KritzelPolygon): boolean;\r\n}\r\n"]}
1	+ {"version":3,"file":"object.interface.js","sourceRoot":"","sources":["../../src/interfaces/object.interface.ts"],"names":[],"mappings":"","sourcesContent":["import { KritzelBaseObject } from '../classes/objects/base-object.class';\r\nimport { KritzelBoundingBox } from './bounding-box.interface';\r\nimport { KritzelPolygon } from './polygon.interface';\r\n\r\nexport interface KritzelObject<T = Element> {\r\n _elementRef: T;\r\n\r\n id: string;\r\n x: number;\r\n y: number;\r\n translateX: number;\r\n translateY: number;\r\n height: number;\r\n width: number;\r\n backgroundColor: string;\r\n borderColor: string;\r\n borderWidth: number;\r\n opacity: number;\r\n scale: number;\r\n resizing: boolean;\r\n rotation: number;\r\n markedForRemoval: boolean;\r\n zIndex: number;\r\n\r\n isVisible: boolean;\r\n isSelected: boolean;\r\n isHovered: boolean;\r\n isMounted: boolean;\r\n isEditable: boolean;\r\n isInteractive: boolean;\r\n isDebugInfoVisible: boolean;\r\n\r\n set elementRef(element: T);\r\n get elementRef(): T;\r\n get boundingBox(): KritzelBoundingBox;\r\n get totalWidth(): number;\r\n get totalHeight(): number;\r\n get rotationDegrees(): number;\r\n get centerX(): number;\r\n get centerY(): number;\r\n\r\n mount(element: T): void;\r\n unmount(): void;\r\n remount(): void;\r\n generateId(): string;\r\n isInViewport(viewport: KritzelBoundingBox, scale: number): boolean;\r\n centerInViewport(): void;\r\n move(startX: number, startY: number, endX: number, endY: number): void;\r\n resize(x: number, y: number, width: number, height: number): void;\r\n rotate(value: number): void;\r\n copy(): KritzelBaseObject<Element>;\r\n onSelectedClick(): void;\r\n isClass<T extends KritzelBaseObject>(this: T, type: string): this is T;\r\n edit(): void;\r\n hitTest(x: number, y: number): boolean;\r\n hitTestPolygon(polygon: KritzelPolygon): boolean;\r\n updatePosition(x: number, y: number): void;\r\n}\r\n"]}

package/dist/components/index.js CHANGED Viewed

@@ -1,6 +1,6 @@
 export { g as getAssetPath, r as render, s as setAssetPath, a as setNonce, b as setPlatformOptions } from './p-DJN0U8pI.js';
-export { b as KritzelBrushTool, a as KritzelPath, K as KritzelText, c as KritzelTextTool } from './p-BJOf0PsO.js';
-export { a as KritzelEraserTool, K as KritzelImage, b as KritzelImageTool, c as KritzelSelectionTool } from './p-BjG1zRRI.js';
+export { b as KritzelBrushTool, a as KritzelPath, K as KritzelText, c as KritzelTextTool } from './p-ljdIU3DL.js';
+export { a as KritzelEraserTool, K as KritzelImage, b as KritzelImageTool, c as KritzelSelectionTool } from './p-CudOuOAW.js';
 export { D as DEFAULT_BRUSH_CONFIG, a as DEFAULT_TEXT_CONFIG, KritzelEditor, defineCustomElement as defineCustomElementKritzelEditor } from './kritzel-editor.js';
 export { KritzelBrushStyle, defineCustomElement as defineCustomElementKritzelBrushStyle } from './kritzel-brush-style.js';
 export { KritzelColor, defineCustomElement as defineCustomElementKritzelColor } from './kritzel-color.js';

package/dist/components/kritzel-color-palette.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { K as KritzelColorPalette$1, d as defineCustomElement$1 } from './p-Bn5P7YQn.js';
+import { K as KritzelColorPalette$1, d as defineCustomElement$1 } from './p-DJc6_PyL.js';
 const KritzelColorPalette = KritzelColorPalette$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/kritzel-color.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { K as KritzelColor$1, d as defineCustomElement$1 } from './p-D0sLslUq.js';
+import { K as KritzelColor$1, d as defineCustomElement$1 } from './p-DfJEh7HZ.js';
 const KritzelColor = KritzelColor$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/kritzel-context-menu.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { K as KritzelContextMenu$1, d as defineCustomElement$1 } from './p-BY8BWGge.js';
+import { K as KritzelContextMenu$1, d as defineCustomElement$1 } from './p-2gNwfcSP.js';
 const KritzelContextMenu = KritzelContextMenu$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/kritzel-control-brush-config.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { K as KritzelControlBrushConfig$1, d as defineCustomElement$1 } from './p-ubNAWsY_.js';
+import { K as KritzelControlBrushConfig$1, d as defineCustomElement$1 } from './p-BkFzf8vg.js';
 const KritzelControlBrushConfig = KritzelControlBrushConfig$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/kritzel-control-text-config.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { K as KritzelControlTextConfig$1, d as defineCustomElement$1 } from './p-DMAzUKo6.js';
+import { K as KritzelControlTextConfig$1, d as defineCustomElement$1 } from './p-BhC-Et5I.js';
 const KritzelControlTextConfig = KritzelControlTextConfig$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/kritzel-controls.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { K as KritzelControls$1, d as defineCustomElement$1 } from './p-CBCFr_x3.js';
+import { K as KritzelControls$1, d as defineCustomElement$1 } from './p-DSWoCkxm.js';
 const KritzelControls = KritzelControls$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/kritzel-cursor-trail.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { K as KritzelCursorTrail$1, d as defineCustomElement$1 } from './p-Cw2ATHMj.js';
+import { K as KritzelCursorTrail$1, d as defineCustomElement$1 } from './p-EQo4-DJT.js';
 const KritzelCursorTrail = KritzelCursorTrail$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/kritzel-editor.js CHANGED Viewed

@@ -1,22 +1,22 @@
 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-BjG1zRRI.js';
-import { b as KritzelBrushTool, c as KritzelTextTool } from './p-BJOf0PsO.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-D0sLslUq.js';
-import { d as defineCustomElement$g } from './p-Bn5P7YQn.js';
-import { d as defineCustomElement$f } from './p-BY8BWGge.js';
-import { d as defineCustomElement$e } from './p-ubNAWsY_.js';
-import { d as defineCustomElement$d } from './p-DMAzUKo6.js';
-import { d as defineCustomElement$c } from './p-CBCFr_x3.js';
-import { d as defineCustomElement$b } from './p-Cw2ATHMj.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-CiT5gBDh.js';
-import { d as defineCustomElement$7 } from './p-CF8ziFc4.js';
-import { d as defineCustomElement$6 } from './p-Cn_kantt.js';
-import { d as defineCustomElement$4 } from './p-DSLY0tr5.js';
-import { d as defineCustomElement$3 } from './p-DpiklJU9.js';
-import { d as defineCustomElement$2 } from './p-BOj_wqdw.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',
@@ -193,8 +193,8 @@ const KritzelEditor$1 = /*@__PURE__*/ proxyCustomElement(class KritzelEditor ext
                 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.moveToTop() },
-            { label: 'Send to Back', icon: 'send-to-back', action: () => this.engineRef.moveToBottom() },
+            { 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;
@@ -269,7 +269,7 @@ const KritzelEditor$1 = /*@__PURE__*/ proxyCustomElement(class KritzelEditor ext
         }
     }
     render() {
-        return (h(Host, { key: 'f2fa7efff5baf4df8a9b2100b96e1546731b006b' }, h("kritzel-engine", { key: 'd4fc5d1b0827656119b14c9e2971818904f41c3f', 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: 'd5f3a9b3d23090bbc8f36b8f974226697868988d', ref: el => (this.controlsRef = el), controls: this.controls, isUtilityPanelVisible: this.isUtilityPanelVisible, style: this.isControlsVisible ? { display: 'flex' } : { display: 'none' }, onIsControlsReady: () => (this.isControlsReady = true) })));
+        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 {

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

	@@ -1 +1 @@
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.moveToTop() },\r\n { label: 'Send to Back', icon: 'send-to-back', action: () => this.engineRef.moveToBottom() },\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}
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 CHANGED Viewed

@@ -1,4 +1,4 @@
-import { d as KritzelEngine$1, e as defineCustomElement$1 } from './p-BjG1zRRI.js';
+import { d as KritzelEngine$1, e as defineCustomElement$1 } from './p-CudOuOAW.js';
 const KritzelEngine = KritzelEngine$1;
 const defineCustomElement = defineCustomElement$1;

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

@@ -1,4 +1,4 @@
-import { K as KritzelFontFamily$1, d as defineCustomElement$1 } from './p-CF8ziFc4.js';
+import { K as KritzelFontFamily$1, d as defineCustomElement$1 } from './p-BubFkS0u.js';
 const KritzelFontFamily = KritzelFontFamily$1;
 const defineCustomElement = defineCustomElement$1;

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

@@ -1,4 +1,4 @@
-import { K as KritzelFontSize$1, d as defineCustomElement$1 } from './p-Cn_kantt.js';
+import { K as KritzelFontSize$1, d as defineCustomElement$1 } from './p-DcvujuV_.js';
 const KritzelFontSize = KritzelFontSize$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/kritzel-font.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { K as KritzelFont$1, d as defineCustomElement$1 } from './p-CiT5gBDh.js';
+import { K as KritzelFont$1, d as defineCustomElement$1 } from './p-Dp8hrISj.js';
 const KritzelFont = KritzelFont$1;
 const defineCustomElement = defineCustomElement$1;

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

@@ -1,4 +1,4 @@
-import { K as KritzelStrokeSize$1, d as defineCustomElement$1 } from './p-DSLY0tr5.js';
+import { K as KritzelStrokeSize$1, d as defineCustomElement$1 } from './p-D5a8vnRF.js';
 const KritzelStrokeSize = KritzelStrokeSize$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/kritzel-tooltip.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { K as KritzelTooltip$1, d as defineCustomElement$1 } from './p-DpiklJU9.js';
+import { K as KritzelTooltip$1, d as defineCustomElement$1 } from './p-CmlcJ8Kw.js';
 const KritzelTooltip = KritzelTooltip$1;
 const defineCustomElement = defineCustomElement$1;

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

@@ -1,4 +1,4 @@
-import { K as KritzelUtilityPanel$1, d as defineCustomElement$1 } from './p-BOj_wqdw.js';
+import { K as KritzelUtilityPanel$1, d as defineCustomElement$1 } from './p-BOUCnklW.js';
 const KritzelUtilityPanel = KritzelUtilityPanel$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/{p-BY8BWGge.js → p-2gNwfcSP.js} RENAMED Viewed

@@ -75,7 +75,7 @@ const KritzelContextMenu = /*@__PURE__*/ proxyCustomElement(class KritzelContext
         this.disabledStates = new Map(newStates);
     }
     render() {
-        return (h(Host, { key: '3265d2e63ff1e1f91faf1c6c5da3490687f3adb1' }, h("div", { key: '80b2100e2ffcaba25ca08cfec650b1f7558c5d25', class: "menu-container" }, this.visibleItems.map((item, index) => {
+        return (h(Host, { key: 'cc1a338a7bf0d32764c2737f4f32774ccb22370a' }, h("div", { key: '4a83b9366332e42b506c3c876c00d77498a2b8b5', class: "menu-container" }, this.visibleItems.map((item, index) => {
             var _a;
             const isDisabled = (_a = this.disabledStates.get(index)) !== null && _a !== void 0 ? _a : false;
             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)));
@@ -114,6 +114,6 @@ function defineCustomElement() {
 }
 export { KritzelContextMenu as K, defineCustomElement as d };
-//# sourceMappingURL=p-BY8BWGge.js.map
+//# sourceMappingURL=p-2gNwfcSP.js.map
-//# sourceMappingURL=p-BY8BWGge.js.map
+//# sourceMappingURL=p-2gNwfcSP.js.map

package/dist/components/{p-BY8BWGge.js.map → p-2gNwfcSP.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~BY8BWGge~~.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}
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}

package/dist/components/{p-BOj_wqdw.js → p-BOUCnklW.js} RENAMED Viewed

@@ -25,7 +25,7 @@ const KritzelUtilityPanel = /*@__PURE__*/ proxyCustomElement(class KritzelUtilit
         this.redo.emit();
     }
     render() {
-        return (h(Host, { key: '496ed78323c9899ad363e7f7732a1464d99e1b3b' }, h("button", { key: '7b6b9cd238a8d254f032d5752f184d567e9a3096', class: "utility-button", onClick: event => this.handleUndo(event) }, h("kritzel-icon", { key: '8ac19f36c6b82f7cc4a0249e60cf429f75c09218', name: "undo" })), h("button", { key: '1164727510a968356042507c1e302b85a135baf8', class: "utility-button", onClick: event => this.handleRedo(event) }, h("kritzel-icon", { key: '1c6cc414d5841a06853f99316eee7a0a609d5c92', name: "redo" })), h("div", { key: 'e6f3342569b1c6b5a6b267cc215bc8e5d259e302', class: "utility-separator" }), h("button", { key: '0aa486a543df924c224f3637857cdcdb06f995ea', class: "utility-button" }, h("kritzel-icon", { key: '9ee324e03f5df5297916549743539f7f19950768', name: "delete", onClick: () => this.delete.emit() }))));
+        return (h(Host, { key: 'f381fac2cb032ca19c6945ef4f39673ea0bd0cc5' }, h("button", { key: '1f7200672970baf1d0cfcaa116fa3f8f9a39832a', class: "utility-button", onClick: event => this.handleUndo(event) }, h("kritzel-icon", { key: '755d9201d80d8db086f07b38e90a01a06e980b50', name: "undo" })), h("button", { key: '06e4d5c2956f23245c3d48f21c15d54e8bef8119', class: "utility-button", onClick: event => this.handleRedo(event) }, h("kritzel-icon", { key: '13eb6b31c45b67ac399fc7c84b941ddce04c5c86', name: "redo" })), h("div", { key: '7f03a576a37649db679b93604c2654d29cc81da4', class: "utility-separator" }), h("button", { key: '0c40613e9f6a049cec872d71e9f948d685ec1dbe', class: "utility-button" }, h("kritzel-icon", { key: '8cba73bcb02ef8b7c182ba2fd16d98d6855f1c1b', name: "delete", onClick: () => this.delete.emit() }))));
     }
     static get style() { return kritzelUtilityPanelCss; }
 }, [257, "kritzel-utility-panel"]);
@@ -49,6 +49,6 @@ function defineCustomElement() {
 }
 export { KritzelUtilityPanel as K, defineCustomElement as d };
-//# sourceMappingURL=p-BOj_wqdw.js.map
+//# sourceMappingURL=p-BOUCnklW.js.map
-//# sourceMappingURL=p-BOj_wqdw.js.map
+//# sourceMappingURL=p-BOUCnklW.js.map

package/dist/components/{p-BOj_wqdw.js.map → p-BOUCnklW.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~BOj_wqdw~~.js","mappings":";;;AAAA,MAAM,sBAAsB,GAAG,0fAA0f;;MCO5gB,mBAAmB,iBAAAA,kBAAA,CAAA,MAAA,mBAAA,SAAAC,CAAA,CAAA;;;;;;;;;AAU9B,IAAA,UAAU,CAAC,KAAY,EAAA;AACrB,QAAA,IAAI,KAAK,CAAC,UAAU,EAAE;YACpB,KAAK,CAAC,cAAc,EAAE;YACtB,KAAK,CAAC,eAAe,EAAE;AACvB,YAAA,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;;;AAIpB,IAAA,UAAU,CAAC,KAAY,EAAA;QACrB,KAAK,CAAC,cAAc,EAAE;QACtB,KAAK,CAAC,eAAe,EAAE;AACvB,QAAA,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;;IAGlB,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAC,gBAAgB,EAAC,OAAO,EAAE,KAAK,IAAI,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,EAAA,EACrE,CAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAc,IAAI,EAAC,MAAM,EAAA,CAAgB,CAClC,EACT,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAC,gBAAgB,EAAC,OAAO,EAAE,KAAK,IAAI,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,EAAA,EACrE,CAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAc,IAAI,EAAC,MAAM,EAAA,CAAgB,CAClC,EAET,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,mBAAmB,EAAO,CAAA,EAErC,CAAQ,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,gBAAgB,EAAA,EAC5B,CAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAc,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,MAAM,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,GAAiB,CACvE,CACJ;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ui/kritzel-utility-panel/kritzel-utility-panel.css?tag=kritzel-utility-panel&encapsulation=shadow","src/components/ui/kritzel-utility-panel/kritzel-utility-panel.tsx"],"sourcesContent":[":host {\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n padding: 4px;\r\n gap: 8px;\r\n border-top-left-radius: 12px;\r\n border-top-right-radius: 12px;\r\n background-color: rgb(226, 226, 226);\r\n width: fit-content;\r\n user-select: none;\r\n}\r\n\r\n.utility-button {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n width: 28px;\r\n height: 28px;\r\n padding: 8px 4px;\r\n border: none;\r\n outline: none;\r\n background: none;\r\n cursor: pointer;\r\n color: #333333;\r\n -webkit-tap-highlight-color: transparent;\r\n}\r\n\r\n.utility-separator {\r\n width: 1px;\r\n height: 16px;\r\n background-color: hsl(0, 0%, 0%, 4.3%);\r\n}","import { Component, Host, h, Event, EventEmitter } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'kritzel-utility-panel',\r\n styleUrl: 'kritzel-utility-panel.css',\r\n shadow: true,\r\n})\r\nexport class KritzelUtilityPanel {\r\n @Event()\r\n undo: EventEmitter<void>;\r\n\r\n @Event()\r\n redo: EventEmitter<void>;\r\n\r\n @Event()\r\n delete: EventEmitter<void>;\r\n\r\n handleUndo(event: Event) {\r\n if (event.cancelable) {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n this.undo.emit();\r\n }\r\n }\r\n\r\n handleRedo(event: Event) {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n this.redo.emit();\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <button class=\"utility-button\" onClick={event => this.handleUndo(event)}>\r\n <kritzel-icon name=\"undo\"></kritzel-icon>\r\n </button>\r\n <button class=\"utility-button\" onClick={event => this.handleRedo(event)}>\r\n <kritzel-icon name=\"redo\"></kritzel-icon>\r\n </button>\r\n\r\n <div class=\"utility-separator\"></div>\r\n\r\n <button class=\"utility-button\">\r\n <kritzel-icon name=\"delete\" onClick={() => this.delete.emit()}></kritzel-icon>\r\n </button>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"p-BOUCnklW.js","mappings":";;;AAAA,MAAM,sBAAsB,GAAG,0fAA0f;;MCO5gB,mBAAmB,iBAAAA,kBAAA,CAAA,MAAA,mBAAA,SAAAC,CAAA,CAAA;;;;;;;;;AAU9B,IAAA,UAAU,CAAC,KAAY,EAAA;AACrB,QAAA,IAAI,KAAK,CAAC,UAAU,EAAE;YACpB,KAAK,CAAC,cAAc,EAAE;YACtB,KAAK,CAAC,eAAe,EAAE;AACvB,YAAA,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;;;AAIpB,IAAA,UAAU,CAAC,KAAY,EAAA;QACrB,KAAK,CAAC,cAAc,EAAE;QACtB,KAAK,CAAC,eAAe,EAAE;AACvB,QAAA,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;;IAGlB,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAC,gBAAgB,EAAC,OAAO,EAAE,KAAK,IAAI,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,EAAA,EACrE,CAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAc,IAAI,EAAC,MAAM,EAAA,CAAgB,CAClC,EACT,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAC,gBAAgB,EAAC,OAAO,EAAE,KAAK,IAAI,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,EAAA,EACrE,CAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAc,IAAI,EAAC,MAAM,EAAA,CAAgB,CAClC,EAET,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,mBAAmB,EAAO,CAAA,EAErC,CAAQ,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,gBAAgB,EAAA,EAC5B,CAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAc,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,MAAM,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,GAAiB,CACvE,CACJ;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ui/kritzel-utility-panel/kritzel-utility-panel.css?tag=kritzel-utility-panel&encapsulation=shadow","src/components/ui/kritzel-utility-panel/kritzel-utility-panel.tsx"],"sourcesContent":[":host {\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n padding: 4px;\r\n gap: 8px;\r\n border-top-left-radius: 12px;\r\n border-top-right-radius: 12px;\r\n background-color: rgb(226, 226, 226);\r\n width: fit-content;\r\n user-select: none;\r\n}\r\n\r\n.utility-button {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n width: 28px;\r\n height: 28px;\r\n padding: 8px 4px;\r\n border: none;\r\n outline: none;\r\n background: none;\r\n cursor: pointer;\r\n color: #333333;\r\n -webkit-tap-highlight-color: transparent;\r\n}\r\n\r\n.utility-separator {\r\n width: 1px;\r\n height: 16px;\r\n background-color: hsl(0, 0%, 0%, 4.3%);\r\n}","import { Component, Host, h, Event, EventEmitter } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'kritzel-utility-panel',\r\n styleUrl: 'kritzel-utility-panel.css',\r\n shadow: true,\r\n})\r\nexport class KritzelUtilityPanel {\r\n @Event()\r\n undo: EventEmitter<void>;\r\n\r\n @Event()\r\n redo: EventEmitter<void>;\r\n\r\n @Event()\r\n delete: EventEmitter<void>;\r\n\r\n handleUndo(event: Event) {\r\n if (event.cancelable) {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n this.undo.emit();\r\n }\r\n }\r\n\r\n handleRedo(event: Event) {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n this.redo.emit();\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <button class=\"utility-button\" onClick={event => this.handleUndo(event)}>\r\n <kritzel-icon name=\"undo\"></kritzel-icon>\r\n </button>\r\n <button class=\"utility-button\" onClick={event => this.handleRedo(event)}>\r\n <kritzel-icon name=\"redo\"></kritzel-icon>\r\n </button>\r\n\r\n <div class=\"utility-separator\"></div>\r\n\r\n <button class=\"utility-button\">\r\n <kritzel-icon name=\"delete\" onClick={() => this.delete.emit()}></kritzel-icon>\r\n </button>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/{p-DMAzUKo6.js → p-BhC-Et5I.js} RENAMED Viewed

@@ -1,10 +1,10 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-DJN0U8pI.js';
-import { d as defineCustomElement$7 } from './p-D0sLslUq.js';
-import { d as defineCustomElement$6 } from './p-Bn5P7YQn.js';
+import { d as defineCustomElement$7 } from './p-DfJEh7HZ.js';
+import { d as defineCustomElement$6 } from './p-DJc6_PyL.js';
 import { d as defineCustomElement$5 } from './p-NZJPrwJV.js';
-import { d as defineCustomElement$4 } from './p-CiT5gBDh.js';
-import { d as defineCustomElement$3 } from './p-CF8ziFc4.js';
-import { d as defineCustomElement$2 } from './p-Cn_kantt.js';
+import { d as defineCustomElement$4 } from './p-Dp8hrISj.js';
+import { d as defineCustomElement$3 } from './p-BubFkS0u.js';
+import { d as defineCustomElement$2 } from './p-DcvujuV_.js';
 import { d as defineCustomElement$1 } from './p-CtiROna-.js';
 const kritzelControlTextConfigCss = ":host{display:block;flex-direction:column;width:100%}.expand-toggle{background:none;border:none;cursor:pointer;font-size:14px;line-height:1;padding:8px;color:var(--kritzel-color-palette-expand-toggle-color, #666666)}.expand-toggle:hover{color:var(--kritzel-color-palette-expand-toggle-hover-color, #333333)}";
@@ -33,14 +33,14 @@ const KritzelControlTextConfig = /*@__PURE__*/ proxyCustomElement(class KritzelC
         this.toolChange.emit(this.tool);
     }
     render() {
-        return (h(Host, { key: '27d47c47987fb7644313a4face4a7023dfbe454d' }, h("div", { key: '835b8072267da18b39a5c02a6c989e1f7b81e9a5', style: {
+        return (h(Host, { key: '1c8463a1f6b7bcf81f3b58fc0064330c50d6ada9' }, h("div", { key: '69825e6c9be473dda3597c86d51dffff9a6418fd', style: {
                 display: 'flex',
                 flexDirection: 'row',
                 alignItems: 'center',
                 justifyContent: 'flex-start',
                 width: '100%',
                 gap: '8px',
-            } }, h("kritzel-font-family", { key: 'b7a0bde2e9cf53c9ae7c3a32b424825ca9f757c4', selectedFontFamily: this.tool.fontFamily, onFontFamilyChange: event => this.handleFamilyChange(event) }), h("button", { key: '41aba583656195c4825a15ddc12c5e1efed0d8d2', class: "expand-toggle", onClick: () => this.handleToggleExpand(), title: this.isExpanded ? 'Collapse' : 'Expand' }, h("kritzel-icon", { key: '5ff979420066703b5d5e886d12f89687392006e3', name: this.isExpanded ? 'chevron-up' : 'chevron-down' }))), h("kritzel-color-palette", { key: '30fbcc05f80b15fba7f1f5ac6413732d0149ee9b', colors: this.tool.palette, selectedColor: this.tool.fontColor, isExpanded: this.isExpanded, onColorChange: event => this.handleColorChange(event) }), h("kritzel-font-size", { key: '2a0d3c4578316b37bc1a25b6e065ecf565eca2b3', selectedSize: this.tool.fontSize, fontFamily: this.tool.fontFamily, onSizeChange: event => this.handleSizeChange(event) })));
+            } }, h("kritzel-font-family", { key: '56c947950e32989782512a2b00e3be0aaa12d77b', selectedFontFamily: this.tool.fontFamily, onFontFamilyChange: event => this.handleFamilyChange(event) }), h("button", { key: '83fdb5908340adc032a7abae9b4b678697e0cff8', class: "expand-toggle", onClick: () => this.handleToggleExpand(), title: this.isExpanded ? 'Collapse' : 'Expand' }, h("kritzel-icon", { key: '739c175fbc3c0c5c342f2983d0e47323bc5b56f4', name: this.isExpanded ? 'chevron-up' : 'chevron-down' }))), h("kritzel-color-palette", { key: '98251da71574b3487bf6ee46f7e4e95d133e1eea', colors: this.tool.palette, selectedColor: this.tool.fontColor, isExpanded: this.isExpanded, onColorChange: event => this.handleColorChange(event) }), h("kritzel-font-size", { key: '95c88611a6631a4db5d200aac57e7eeef2c195b8', selectedSize: this.tool.fontSize, fontFamily: this.tool.fontFamily, onSizeChange: event => this.handleSizeChange(event) })));
     }
     static get style() { return kritzelControlTextConfigCss; }
 }, [257, "kritzel-control-text-config", {
@@ -97,6 +97,6 @@ function defineCustomElement() {
 }
 export { KritzelControlTextConfig as K, defineCustomElement as d };
-//# sourceMappingURL=p-DMAzUKo6.js.map
+//# sourceMappingURL=p-BhC-Et5I.js.map
-//# sourceMappingURL=p-DMAzUKo6.js.map
+//# sourceMappingURL=p-BhC-Et5I.js.map

package/dist/components/{p-DMAzUKo6.js.map → p-BhC-Et5I.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~DMAzUKo6~~.js","mappings":";;;;;;;;;AAAA,MAAM,2BAA2B,GAAG,qTAAqT;;MCQ5U,wBAAwB,iBAAAA,kBAAA,CAAA,MAAA,wBAAA,SAAAC,CAAA,CAAA;AALrC,IAAA,WAAA,GAAA;;;;;AAUE,QAAA,IAAU,CAAA,UAAA,GAAY,KAAK;AAuD5B;IAlDC,kBAAkB,GAAA;AAChB,QAAA,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU;;AAGpC,IAAA,kBAAkB,CAAC,KAA0B,EAAA;QAC3C,IAAI,CAAC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,MAAM;QACnC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;;AAGjC,IAAA,iBAAiB,CAAC,KAA0B,EAAA;QAC1C,IAAI,CAAC,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,MAAM;QAClC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;;AAGjC,IAAA,gBAAgB,CAAC,KAA0B,EAAA;QACzC,IAAI,CAAC,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,MAAM;QACjC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;;IAGjC,MAAM,GAAA;QACJ,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,OAAO,EAAE,MAAM;AACf,gBAAA,aAAa,EAAE,KAAK;AACpB,gBAAA,UAAU,EAAE,QAAQ;AACpB,gBAAA,cAAc,EAAE,YAAY;AAC5B,gBAAA,KAAK,EAAE,MAAM;AACb,gBAAA,GAAG,EAAE,KAAK;AACX,aAAA,EAAA,EAED,CAAqB,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,kBAAkB,EAAE,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,kBAAkB,EAAE,KAAK,IAAI,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,EAAwB,CAAA,EAElJ,CAAQ,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,eAAe,EAAC,OAAO,EAAE,MAAM,IAAI,CAAC,kBAAkB,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,GAAG,UAAU,GAAG,QAAQ,EAAA,EACpH,CAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAc,IAAI,EAAE,IAAI,CAAC,UAAU,GAAG,YAAY,GAAG,cAAc,EAAA,CAAiB,CAC7E,CACL,EAEN,CAAA,CAAA,uBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,OAAO,EACzB,aAAa,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,EAClC,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,aAAa,EAAE,KAAK,IAAI,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,EAC9B,CAAA,EAEzB,CAAA,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAmB,YAAY,EAAE,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,UAAU,EAAE,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,YAAY,EAAE,KAAK,IAAI,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,EAAsB,CAAA,CAC3J;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ui/kritzel-control-text-config/kritzel-control-text-config.css?tag=kritzel-control-text-config&encapsulation=shadow","src/components/ui/kritzel-control-text-config/kritzel-control-text-config.tsx"],"sourcesContent":[":host {\r\n display: block;\r\n flex-direction: column;\r\n width: 100%;\r\n}\r\n\r\n.expand-toggle {\r\n background: none;\r\n border: none;\r\n cursor: pointer;\r\n font-size: 14px;\r\n line-height: 1;\r\n padding: 8px;\r\n color: var(--kritzel-color-palette-expand-toggle-color, #666666);\r\n}\r\n\r\n.expand-toggle:hover {\r\n color: var(--kritzel-color-palette-expand-toggle-hover-color, #333333);\r\n}\r\n","import { Component, Host, Prop, h, Event, EventEmitter } from '@stencil/core';\r\nimport { KritzelTextTool } from '../../../classes/tools/text-tool.class';\r\n\r\n@Component({\r\n tag: 'kritzel-control-text-config',\r\n styleUrl: 'kritzel-control-text-config.css',\r\n shadow: true,\r\n})\r\nexport class KritzelControlTextConfig {\r\n @Prop({ mutable: true })\r\n tool: KritzelTextTool;\r\n\r\n @Prop({ mutable: true })\r\n isExpanded: boolean = false;\r\n\r\n @Event()\r\n toolChange: EventEmitter<KritzelTextTool>;\r\n\r\n handleToggleExpand() {\r\n this.isExpanded = !this.isExpanded;\r\n }\r\n\r\n handleFamilyChange(event: CustomEvent<string>) {\r\n this.tool.fontFamily = event.detail;\r\n this.toolChange.emit(this.tool);\r\n }\r\n\r\n handleColorChange(event: CustomEvent<string>) {\r\n this.tool.fontColor = event.detail;\r\n this.toolChange.emit(this.tool);\r\n }\r\n\r\n handleSizeChange(event: CustomEvent<number>) {\r\n this.tool.fontSize = event.detail;\r\n this.toolChange.emit(this.tool);\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <div\r\n style={{\r\n display: 'flex',\r\n flexDirection: 'row',\r\n alignItems: 'center',\r\n justifyContent: 'flex-start',\r\n width: '100%',\r\n gap: '8px',\r\n }}\r\n >\r\n <kritzel-font-family selectedFontFamily={this.tool.fontFamily} onFontFamilyChange={event => this.handleFamilyChange(event)}></kritzel-font-family>\r\n\r\n <button class=\"expand-toggle\" onClick={() => this.handleToggleExpand()} title={this.isExpanded ? 'Collapse' : 'Expand'}>\r\n <kritzel-icon name={this.isExpanded ? 'chevron-up' : 'chevron-down'}></kritzel-icon>\r\n </button>\r\n </div>\r\n\r\n <kritzel-color-palette\r\n colors={this.tool.palette}\r\n selectedColor={this.tool.fontColor}\r\n isExpanded={this.isExpanded}\r\n onColorChange={event => this.handleColorChange(event)}\r\n ></kritzel-color-palette>\r\n\r\n <kritzel-font-size selectedSize={this.tool.fontSize} fontFamily={this.tool.fontFamily} onSizeChange={event => this.handleSizeChange(event)}></kritzel-font-size>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"p-BhC-Et5I.js","mappings":";;;;;;;;;AAAA,MAAM,2BAA2B,GAAG,qTAAqT;;MCQ5U,wBAAwB,iBAAAA,kBAAA,CAAA,MAAA,wBAAA,SAAAC,CAAA,CAAA;AALrC,IAAA,WAAA,GAAA;;;;;AAUE,QAAA,IAAU,CAAA,UAAA,GAAY,KAAK;AAuD5B;IAlDC,kBAAkB,GAAA;AAChB,QAAA,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU;;AAGpC,IAAA,kBAAkB,CAAC,KAA0B,EAAA;QAC3C,IAAI,CAAC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,MAAM;QACnC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;;AAGjC,IAAA,iBAAiB,CAAC,KAA0B,EAAA;QAC1C,IAAI,CAAC,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,MAAM;QAClC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;;AAGjC,IAAA,gBAAgB,CAAC,KAA0B,EAAA;QACzC,IAAI,CAAC,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,MAAM;QACjC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;;IAGjC,MAAM,GAAA;QACJ,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,OAAO,EAAE,MAAM;AACf,gBAAA,aAAa,EAAE,KAAK;AACpB,gBAAA,UAAU,EAAE,QAAQ;AACpB,gBAAA,cAAc,EAAE,YAAY;AAC5B,gBAAA,KAAK,EAAE,MAAM;AACb,gBAAA,GAAG,EAAE,KAAK;AACX,aAAA,EAAA,EAED,CAAqB,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,kBAAkB,EAAE,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,kBAAkB,EAAE,KAAK,IAAI,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,EAAwB,CAAA,EAElJ,CAAQ,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,eAAe,EAAC,OAAO,EAAE,MAAM,IAAI,CAAC,kBAAkB,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,GAAG,UAAU,GAAG,QAAQ,EAAA,EACpH,CAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAc,IAAI,EAAE,IAAI,CAAC,UAAU,GAAG,YAAY,GAAG,cAAc,EAAA,CAAiB,CAC7E,CACL,EAEN,CAAA,CAAA,uBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,OAAO,EACzB,aAAa,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,EAClC,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,aAAa,EAAE,KAAK,IAAI,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,EAC9B,CAAA,EAEzB,CAAA,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAmB,YAAY,EAAE,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,UAAU,EAAE,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,YAAY,EAAE,KAAK,IAAI,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,EAAsB,CAAA,CAC3J;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ui/kritzel-control-text-config/kritzel-control-text-config.css?tag=kritzel-control-text-config&encapsulation=shadow","src/components/ui/kritzel-control-text-config/kritzel-control-text-config.tsx"],"sourcesContent":[":host {\r\n display: block;\r\n flex-direction: column;\r\n width: 100%;\r\n}\r\n\r\n.expand-toggle {\r\n background: none;\r\n border: none;\r\n cursor: pointer;\r\n font-size: 14px;\r\n line-height: 1;\r\n padding: 8px;\r\n color: var(--kritzel-color-palette-expand-toggle-color, #666666);\r\n}\r\n\r\n.expand-toggle:hover {\r\n color: var(--kritzel-color-palette-expand-toggle-hover-color, #333333);\r\n}\r\n","import { Component, Host, Prop, h, Event, EventEmitter } from '@stencil/core';\r\nimport { KritzelTextTool } from '../../../classes/tools/text-tool.class';\r\n\r\n@Component({\r\n tag: 'kritzel-control-text-config',\r\n styleUrl: 'kritzel-control-text-config.css',\r\n shadow: true,\r\n})\r\nexport class KritzelControlTextConfig {\r\n @Prop({ mutable: true })\r\n tool: KritzelTextTool;\r\n\r\n @Prop({ mutable: true })\r\n isExpanded: boolean = false;\r\n\r\n @Event()\r\n toolChange: EventEmitter<KritzelTextTool>;\r\n\r\n handleToggleExpand() {\r\n this.isExpanded = !this.isExpanded;\r\n }\r\n\r\n handleFamilyChange(event: CustomEvent<string>) {\r\n this.tool.fontFamily = event.detail;\r\n this.toolChange.emit(this.tool);\r\n }\r\n\r\n handleColorChange(event: CustomEvent<string>) {\r\n this.tool.fontColor = event.detail;\r\n this.toolChange.emit(this.tool);\r\n }\r\n\r\n handleSizeChange(event: CustomEvent<number>) {\r\n this.tool.fontSize = event.detail;\r\n this.toolChange.emit(this.tool);\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <div\r\n style={{\r\n display: 'flex',\r\n flexDirection: 'row',\r\n alignItems: 'center',\r\n justifyContent: 'flex-start',\r\n width: '100%',\r\n gap: '8px',\r\n }}\r\n >\r\n <kritzel-font-family selectedFontFamily={this.tool.fontFamily} onFontFamilyChange={event => this.handleFamilyChange(event)}></kritzel-font-family>\r\n\r\n <button class=\"expand-toggle\" onClick={() => this.handleToggleExpand()} title={this.isExpanded ? 'Collapse' : 'Expand'}>\r\n <kritzel-icon name={this.isExpanded ? 'chevron-up' : 'chevron-down'}></kritzel-icon>\r\n </button>\r\n </div>\r\n\r\n <kritzel-color-palette\r\n colors={this.tool.palette}\r\n selectedColor={this.tool.fontColor}\r\n isExpanded={this.isExpanded}\r\n onColorChange={event => this.handleColorChange(event)}\r\n ></kritzel-color-palette>\r\n\r\n <kritzel-font-size selectedSize={this.tool.fontSize} fontFamily={this.tool.fontFamily} onSizeChange={event => this.handleSizeChange(event)}></kritzel-font-size>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}