npm - kritzel-stencil - Versions diffs - 0.0.144 → 0.0.145 - Mend

kritzel-stencil 0.0.144 → 0.0.145

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 (290) hide show

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

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

package/dist/components/kritzel-workspace-manager.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { K as KritzelWorkspaceManager$1, d as defineCustomElement$1 } from './p-CEn1WeG3.js';
+import { K as KritzelWorkspaceManager$1, d as defineCustomElement$1 } from './p-Bit0z7Yg.js';
 const KritzelWorkspaceManager = KritzelWorkspaceManager$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/{p-C_hSH2nN.js → p-8iFF5GHL.js} RENAMED Viewed

@@ -1,4 +1,4 @@
-import { p as proxyCustomElement, H, h, d as Host } from './p-C9hrbrUN.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-CwkUrTy1.js';
 const kritzelColorCss = ":host{display:flex}.checkerboard-bg{background:repeating-conic-gradient(#ccc 0% 25%, #fff 0% 50%) 50% / 8px 8px;position:relative;overflow:hidden}.color-circle{width:24px;height:24px;border-radius:50%;box-sizing:border-box;display:block}.color-circle.white{border:1px solid var(--kritzel-color-palette-circle-border-color, #dddcdc)}";
@@ -38,13 +38,13 @@ const KritzelColor = /*@__PURE__*/ proxyCustomElement(class KritzelColor extends
     }
     render() {
         const isColorVeryLight = this.isLightColor(this.value);
-        return (h(Host, { key: '000e54c604c8ceca2c44365e95ec1f5bfb1b729a' }, h("div", { key: '77b2abeae70e4a80714e1364eb4e11e67f16d066', class: "checkerboard-bg", style: {
+        return (h(Host, { key: '198dba41e1600d76faace18de78191d2b7a551ec' }, h("div", { key: 'ee690cffb7925e09cb2c51022eec607247a4849f', class: "checkerboard-bg", style: {
                 width: `${this.size}px`,
                 height: `${this.size}px`,
                 borderRadius: '50%',
                 display: 'inline-block',
                 position: 'relative',
-            } }, h("div", { key: 'df71720cf51d845a36598499adb900a30770c503', class: {
+            } }, h("div", { key: '66cc8df8fabd008db8c00942994875e3e8d722ce', class: {
                 'color-circle': true,
                 'white': isColorVeryLight,
             }, style: {
@@ -59,7 +59,7 @@ const KritzelColor = /*@__PURE__*/ proxyCustomElement(class KritzelColor extends
             } }))));
     }
     static get style() { return kritzelColorCss; }
-}, [257, "kritzel-color", {
+}, [769, "kritzel-color", {
         "value": [1],
         "size": [2]
     }]);
@@ -78,6 +78,6 @@ function defineCustomElement() {
 }
 export { KritzelColor as K, defineCustomElement as d };
-//# sourceMappingURL=p-C_hSH2nN.js.map
+//# sourceMappingURL=p-8iFF5GHL.js.map
-//# sourceMappingURL=p-C_hSH2nN.js.map
+//# sourceMappingURL=p-8iFF5GHL.js.map

package/dist/components/{p-C_hSH2nN.js.map → p-8iFF5GHL.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~C_hSH2nN~~.js","mappings":";;AAAA,MAAM,eAAe,GAAG,8UAA8U;;MCOzV,YAAY,iBAAAA,kBAAA,CAAA,MAAA,YAAA,SAAAC,CAAA,CAAA;;;;;;;;AACf,IAAA,KAAK;IACL,IAAI,GAAW,EAAE;AAEjB,IAAA,YAAY,CAAC,QAAgB,EAAA;AACnC,QAAA,IAAI,CAAC,QAAQ;AAAE,YAAA,OAAO,KAAK;QAE3B,IAAI,CAAC,GAAG,CAAC,EACP,CAAC,GAAG,CAAC,EACL,CAAC,GAAG,CAAC;QAEP,IAAI,YAAY,GAAG,QAAQ,CAAC,UAAU,CAAC,GAAG,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,QAAQ;AAE1E,QAAA,IAAI,YAAY,CAAC,MAAM,KAAK,CAAC,EAAE;AAC7B,YAAA,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC,CAAC,GAAG,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;AACnD,YAAA,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC,CAAC,GAAG,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;AACnD,YAAA,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC,CAAC,GAAG,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;;AAC9C,aAAA,IAAI,YAAY,CAAC,MAAM,KAAK,CAAC,EAAE;AACpC,YAAA,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;AAC9C,YAAA,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;AAC9C,YAAA,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;;aACzC;AACL,YAAA,OAAO,KAAK;;AAGd,QAAA,IAAI,KAAK,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,EAAE;AACpC,YAAA,OAAO,KAAK;;AAGd,QAAA,MAAM,SAAS,GAAG,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC;QAEnD,OAAO,SAAS,GAAG,GAAG;;IAGxB,MAAM,GAAA;QACJ,MAAM,gBAAgB,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC;QACtD,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,iBAAiB,EACvB,KAAK,EAAE;AACL,gBAAA,KAAK,EAAE,CAAA,EAAG,IAAI,CAAC,IAAI,CAAI,EAAA,CAAA;AACvB,gBAAA,MAAM,EAAE,CAAA,EAAG,IAAI,CAAC,IAAI,CAAI,EAAA,CAAA;AACxB,gBAAA,YAAY,EAAE,KAAK;AACnB,gBAAA,OAAO,EAAE,cAAc;AACvB,gBAAA,QAAQ,EAAE,UAAU;aACrB,EAAA,EAED,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,cAAc,EAAE,IAAI;AACpB,gBAAA,OAAO,EAAE,gBAAgB;AAC1B,aAAA,EACD,KAAK,EAAE;gBACL,eAAe,EAAE,IAAI,CAAC,KAAK;AAC3B,gBAAA,KAAK,EAAE,CAAA,EAAG,IAAI,CAAC,IAAI,CAAI,EAAA,CAAA;AACvB,gBAAA,MAAM,EAAE,CAAA,EAAG,IAAI,CAAC,IAAI,CAAI,EAAA,CAAA;AACxB,gBAAA,YAAY,EAAE,KAAK;AACnB,gBAAA,QAAQ,EAAE,UAAU;AACpB,gBAAA,GAAG,EAAE,GAAG;AACR,gBAAA,IAAI,EAAE,GAAG;AACT,gBAAA,OAAO,EAAE,cAAc;AACxB,aAAA,EACI,CAAA,CACH,CACD;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-color/kritzel-color.css?tag=kritzel-color&encapsulation=shadow","src/components/shared/kritzel-color/kritzel-color.tsx"],"sourcesContent":[":host {\r\n display: flex;\r\n}\r\n\r\n.checkerboard-bg {\r\n background: repeating-conic-gradient(#ccc 0% 25%, #fff 0% 50%) 50% / 8px 8px;\r\n position: relative;\r\n overflow: hidden;\r\n}\r\n\r\n.color-circle {\r\n width: 24px;\r\n height: 24px;\r\n border-radius: 50%;\r\n box-sizing: border-box;\r\n display: block;\r\n}\r\n\r\n.color-circle.white {\r\n border: 1px solid var(--kritzel-color-palette-circle-border-color, #dddcdc);\r\n}","import { Component, Host, Prop, h } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'kritzel-color',\r\n styleUrl: 'kritzel-color.css',\r\n shadow: true,\r\n})\r\nexport class KritzelColor {\r\n @Prop() value: string;\r\n @Prop() size: number = 24;\r\n\r\n private isLightColor(hexColor: string): boolean {\r\n if (!hexColor) return false;\r\n\r\n let r = 0,\r\n g = 0,\r\n b = 0;\r\n\r\n let sanitizedHex = hexColor.startsWith('#') ? hexColor.slice(1) : hexColor;\r\n\r\n if (sanitizedHex.length === 3) {\r\n r = parseInt(sanitizedHex[0] + sanitizedHex[0], 16);\r\n g = parseInt(sanitizedHex[1] + sanitizedHex[1], 16);\r\n b = parseInt(sanitizedHex[2] + sanitizedHex[2], 16);\r\n } else if (sanitizedHex.length === 6) {\r\n r = parseInt(sanitizedHex.substring(0, 2), 16);\r\n g = parseInt(sanitizedHex.substring(2, 4), 16);\r\n b = parseInt(sanitizedHex.substring(4, 6), 16);\r\n } else {\r\n return false;\r\n }\r\n\r\n if (isNaN(r) \|\| isNaN(g) \|\| isNaN(b)) {\r\n return false;\r\n }\r\n\r\n const luminance = 0.299 * r + 0.587 * g + 0.114 * b;\r\n\r\n return luminance > 220;\r\n }\r\n\r\n render() {\r\n const isColorVeryLight = this.isLightColor(this.value);\r\n return (\r\n <Host>\r\n <div\r\n class=\"checkerboard-bg\"\r\n style={{\r\n width: `${this.size}px`,\r\n height: `${this.size}px`,\r\n borderRadius: '50%',\r\n display: 'inline-block',\r\n position: 'relative',\r\n }}\r\n >\r\n <div\r\n class={{\r\n 'color-circle': true,\r\n 'white': isColorVeryLight,\r\n }}\r\n style={{\r\n backgroundColor: this.value,\r\n width: `${this.size}px`,\r\n height: `${this.size}px`,\r\n borderRadius: '50%',\r\n position: 'absolute',\r\n top: '0',\r\n left: '0',\r\n display: 'inline-block',\r\n }}\r\n ></div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"p-8iFF5GHL.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-color/kritzel-color.css?tag=kritzel-color&encapsulation=shadow","src/components/shared/kritzel-color/kritzel-color.tsx"],"sourcesContent":[":host {\r\n display: flex;\r\n}\r\n\r\n.checkerboard-bg {\r\n background: repeating-conic-gradient(#ccc 0% 25%, #fff 0% 50%) 50% / 8px 8px;\r\n position: relative;\r\n overflow: hidden;\r\n}\r\n\r\n.color-circle {\r\n width: 24px;\r\n height: 24px;\r\n border-radius: 50%;\r\n box-sizing: border-box;\r\n display: block;\r\n}\r\n\r\n.color-circle.white {\r\n border: 1px solid var(--kritzel-color-palette-circle-border-color, #dddcdc);\r\n}","import { Component, Host, Prop, h } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'kritzel-color',\r\n styleUrl: 'kritzel-color.css',\r\n shadow: true,\r\n})\r\nexport class KritzelColor {\r\n @Prop() value: string;\r\n @Prop() size: number = 24;\r\n\r\n private isLightColor(hexColor: string): boolean {\r\n if (!hexColor) return false;\r\n\r\n let r = 0,\r\n g = 0,\r\n b = 0;\r\n\r\n let sanitizedHex = hexColor.startsWith('#') ? hexColor.slice(1) : hexColor;\r\n\r\n if (sanitizedHex.length === 3) {\r\n r = parseInt(sanitizedHex[0] + sanitizedHex[0], 16);\r\n g = parseInt(sanitizedHex[1] + sanitizedHex[1], 16);\r\n b = parseInt(sanitizedHex[2] + sanitizedHex[2], 16);\r\n } else if (sanitizedHex.length === 6) {\r\n r = parseInt(sanitizedHex.substring(0, 2), 16);\r\n g = parseInt(sanitizedHex.substring(2, 4), 16);\r\n b = parseInt(sanitizedHex.substring(4, 6), 16);\r\n } else {\r\n return false;\r\n }\r\n\r\n if (isNaN(r) \|\| isNaN(g) \|\| isNaN(b)) {\r\n return false;\r\n }\r\n\r\n const luminance = 0.299 * r + 0.587 * g + 0.114 * b;\r\n\r\n return luminance > 220;\r\n }\r\n\r\n render() {\r\n const isColorVeryLight = this.isLightColor(this.value);\r\n return (\r\n <Host>\r\n <div\r\n class=\"checkerboard-bg\"\r\n style={{\r\n width: `${this.size}px`,\r\n height: `${this.size}px`,\r\n borderRadius: '50%',\r\n display: 'inline-block',\r\n position: 'relative',\r\n }}\r\n >\r\n <div\r\n class={{\r\n 'color-circle': true,\r\n 'white': isColorVeryLight,\r\n }}\r\n style={{\r\n backgroundColor: this.value,\r\n width: `${this.size}px`,\r\n height: `${this.size}px`,\r\n borderRadius: '50%',\r\n position: 'absolute',\r\n top: '0',\r\n left: '0',\r\n display: 'inline-block',\r\n }}\r\n ></div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/{p-BycHaC-9.js → p-BCrMfH5n.js} RENAMED Viewed

@@ -1,5 +1,5 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-C9hrbrUN.js';
-import { d as defineCustomElement$1 } from './p-CGb-8cK4.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-CwkUrTy1.js';
+import { d as defineCustomElement$1 } from './p-BlI4vzRZ.js';
 const kritzelFontSizeCss = ":host{display:flex;align-items:flex-start;gap:8px;padding:8px;box-sizing:border-box}.size-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:4px;cursor:pointer;border:2px solid transparent;box-sizing:border-box;border-radius:50%}.size-container:hover{background-color:var(--kritzel-font-size-hover-background-color, #ebebeb)}.size-container.selected{border-color:var(--kritzel-selection-border-color, #007AFF);background-color:var(--kritzel-font-size-selected-background-color, #e0e0e0)}";
@@ -21,13 +21,13 @@ const KritzelFontSize = /*@__PURE__*/ proxyCustomElement(class KritzelFontSize e
         this.sizeChange.emit(size);
     }
     render() {
-        return (h(Host, { key: '9f3d851d443352f7437116cf91eff8d8de41e322' }, this.sizes.map(size => (h("div", { class: {
+        return (h(Host, { key: '583659340d8f3bfb2ff6f64f2cd692ac07cb32d6' }, this.sizes.map(size => (h("div", { class: {
                 'size-container': true,
                 'selected': this.selectedSize === size,
             }, onClick: () => this.handleSizeClick(size) }, h("kritzel-font", { fontFamily: this.fontFamily, size: size }))))));
     }
     static get style() { return kritzelFontSizeCss; }
-}, [257, "kritzel-font-size", {
+}, [769, "kritzel-font-size", {
         "sizes": [16],
         "selectedSize": [1026, "selected-size"],
         "fontFamily": [1, "font-family"]
@@ -52,6 +52,6 @@ function defineCustomElement() {
 }
 export { KritzelFontSize as K, defineCustomElement as d };
-//# sourceMappingURL=p-BycHaC-9.js.map
+//# sourceMappingURL=p-BCrMfH5n.js.map
-//# sourceMappingURL=p-BycHaC-9.js.map
+//# sourceMappingURL=p-BCrMfH5n.js.map

package/dist/components/{p-BycHaC-9.js.map → p-BCrMfH5n.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~BycHaC-9~~.js","mappings":";;;AAAA,MAAM,kBAAkB,GAAG,4hBAA4hB;;MCO1iB,eAAe,iBAAAA,kBAAA,CAAA,MAAA,eAAA,SAAAC,CAAA,CAAA;;;;;;;;;AAClB,IAAA,KAAK,GAAa,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;IACxB,YAAY,GAAkB,IAAI;IAEnD,UAAU,GAAW,OAAO;AAE3B,IAAA,UAAU;AAEX,IAAA,eAAe,CAAC,IAAY,EAAA;AAClC,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI;AACxB,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;;IAG5B,MAAM,GAAA;AACJ,QAAA,QACE,CAAC,CAAA,IAAI,EACF,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,KAClB,CAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAE;AACL,gBAAA,gBAAgB,EAAE,IAAI;AACtB,gBAAA,UAAU,EAAE,IAAI,CAAC,YAAY,KAAK,IAAI;AACvC,aAAA,EACD,OAAO,EAAE,MAAM,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAA,EAEzC,CAAA,CAAA,cAAA,EAAA,EAAc,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,EAAE,IAAI,GAAiB,CAClE,CACP,CAAC,CACG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-font-size/kritzel-font-size.css?tag=kritzel-font-size&encapsulation=shadow","src/components/shared/kritzel-font-size/kritzel-font-size.tsx"],"sourcesContent":[":host {\r\n display: flex;\r\n align-items: flex-start;\r\n gap: 8px;\r\n padding: 8px;\r\n box-sizing: border-box;\r\n}\r\n\r\n.size-container {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n width: 32px;\r\n height: 32px;\r\n border-radius: 4px;\r\n cursor: pointer;\r\n border: 2px solid transparent;\r\n box-sizing: border-box;\r\n border-radius: 50%;\r\n}\r\n\r\n.size-container:hover {\r\n background-color: var(--kritzel-font-size-hover-background-color, #ebebeb);\r\n}\r\n\r\n.size-container.selected {\r\n border-color: var(--kritzel-selection-border-color, #007AFF);\r\n background-color: var(--kritzel-font-size-selected-background-color, #e0e0e0);\r\n}\r\n\r\n","import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'kritzel-font-size',\r\n styleUrl: 'kritzel-font-size.css',\r\n shadow: true,\r\n})\r\nexport class KritzelFontSize {\r\n @Prop() sizes: number[] = [8, 10, 12, 16, 20, 24];\r\n @Prop({ mutable: true }) selectedSize: number \| null = null;\r\n\r\n @Prop() fontFamily: string = 'Arial';\r\n\r\n @Event() sizeChange: EventEmitter<number>;\r\n\r\n private handleSizeClick(size: number) {\r\n this.selectedSize = size;\r\n this.sizeChange.emit(size);\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n {this.sizes.map(size => (\r\n <div\r\n class={{\r\n 'size-container': true,\r\n 'selected': this.selectedSize === size,\r\n }}\r\n onClick={() => this.handleSizeClick(size)}\r\n >\r\n <kritzel-font fontFamily={this.fontFamily} size={size}></kritzel-font>\r\n </div>\r\n ))}\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"p-BCrMfH5n.js","mappings":";;;AAAA,MAAM,kBAAkB,GAAG,4hBAA4hB;;MCO1iB,eAAe,iBAAAA,kBAAA,CAAA,MAAA,eAAA,SAAAC,CAAA,CAAA;;;;;;;;;AAClB,IAAA,KAAK,GAAa,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;IACxB,YAAY,GAAkB,IAAI;IAEnD,UAAU,GAAW,OAAO;AAE3B,IAAA,UAAU;AAEX,IAAA,eAAe,CAAC,IAAY,EAAA;AAClC,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI;AACxB,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;;IAG5B,MAAM,GAAA;AACJ,QAAA,QACE,CAAC,CAAA,IAAI,EACF,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,KAClB,CAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAE;AACL,gBAAA,gBAAgB,EAAE,IAAI;AACtB,gBAAA,UAAU,EAAE,IAAI,CAAC,YAAY,KAAK,IAAI;AACvC,aAAA,EACD,OAAO,EAAE,MAAM,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAA,EAEzC,CAAA,CAAA,cAAA,EAAA,EAAc,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,EAAE,IAAI,GAAiB,CAClE,CACP,CAAC,CACG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-font-size/kritzel-font-size.css?tag=kritzel-font-size&encapsulation=shadow","src/components/shared/kritzel-font-size/kritzel-font-size.tsx"],"sourcesContent":[":host {\r\n display: flex;\r\n align-items: flex-start;\r\n gap: 8px;\r\n padding: 8px;\r\n box-sizing: border-box;\r\n}\r\n\r\n.size-container {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n width: 32px;\r\n height: 32px;\r\n border-radius: 4px;\r\n cursor: pointer;\r\n border: 2px solid transparent;\r\n box-sizing: border-box;\r\n border-radius: 50%;\r\n}\r\n\r\n.size-container:hover {\r\n background-color: var(--kritzel-font-size-hover-background-color, #ebebeb);\r\n}\r\n\r\n.size-container.selected {\r\n border-color: var(--kritzel-selection-border-color, #007AFF);\r\n background-color: var(--kritzel-font-size-selected-background-color, #e0e0e0);\r\n}\r\n\r\n","import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'kritzel-font-size',\r\n styleUrl: 'kritzel-font-size.css',\r\n shadow: true,\r\n})\r\nexport class KritzelFontSize {\r\n @Prop() sizes: number[] = [8, 10, 12, 16, 20, 24];\r\n @Prop({ mutable: true }) selectedSize: number \| null = null;\r\n\r\n @Prop() fontFamily: string = 'Arial';\r\n\r\n @Event() sizeChange: EventEmitter<number>;\r\n\r\n private handleSizeClick(size: number) {\r\n this.selectedSize = size;\r\n this.sizeChange.emit(size);\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n {this.sizes.map(size => (\r\n <div\r\n class={{\r\n 'size-container': true,\r\n 'selected': this.selectedSize === size,\r\n }}\r\n onClick={() => this.handleSizeClick(size)}\r\n >\r\n <kritzel-font fontFamily={this.fontFamily} size={size}></kritzel-font>\r\n </div>\r\n ))}\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/{p-D_RcVGj0.js → p-BHDOht0m.js} RENAMED Viewed

@@ -1,5 +1,5 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-C9hrbrUN.js';
-import { d as defineCustomElement$1 } from './p-C_hSH2nN.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-CwkUrTy1.js';
+import { d as defineCustomElement$1 } from './p-8iFF5GHL.js';
 const kritzelStrokeSizeCss = ":host{display:flex;align-items:flex-start;gap:8px;padding:8px;box-sizing:border-box}.size-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:50%;cursor:pointer;border:2px solid transparent;box-sizing:border-box}.size-container:focus-visible{outline:var(--kritzel-stroke-size-focus-outline, 2px auto #e3e3e3)}.size-container:hover{background-color:var(--kritzel-stroke-size-hover-background-color, #ebebeb)}.size-container.selected{border-color:var(--kritzel-selection-border-color, #007AFF);background-color:var(--kritzel-stroke-size-selected-background-color, #ebebeb)}";
@@ -20,13 +20,13 @@ const KritzelStrokeSize = /*@__PURE__*/ proxyCustomElement(class KritzelStrokeSi
         this.sizeChange.emit(size);
     }
     render() {
-        return (h(Host, { key: '74579e34c23725e22927afe371c1f7925903720a' }, this.sizes.map(size => (h("div", { tabIndex: 0, class: {
+        return (h(Host, { key: '001a0ef8408d19532b57a521929c0cba54e99c52' }, this.sizes.map(size => (h("div", { tabIndex: 0, class: {
                 'size-container': true,
                 'selected': this.selectedSize === size,
             }, onClick: () => this.handleSizeClick(size) }, h("kritzel-color", { value: '#000000', size: size }))))));
     }
     static get style() { return kritzelStrokeSizeCss; }
-}, [257, "kritzel-stroke-size", {
+}, [769, "kritzel-stroke-size", {
         "sizes": [16],
         "selectedSize": [1026, "selected-size"]
     }]);
@@ -50,6 +50,6 @@ function defineCustomElement() {
 }
 export { KritzelStrokeSize as K, defineCustomElement as d };
-//# sourceMappingURL=p-D_RcVGj0.js.map
+//# sourceMappingURL=p-BHDOht0m.js.map
-//# sourceMappingURL=p-D_RcVGj0.js.map
+//# sourceMappingURL=p-BHDOht0m.js.map

package/dist/components/{p-D_RcVGj0.js.map → p-BHDOht0m.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~D_RcVGj0~~.js","mappings":";;;AAAA,MAAM,oBAAoB,GAAG,+mBAA+mB;;MCO/nB,iBAAiB,iBAAAA,kBAAA,CAAA,MAAA,iBAAA,SAAAC,CAAA,CAAA;;;;;;;;;AACpB,IAAA,KAAK,GAAa,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;IACtB,YAAY,GAAkB,IAAI;AAElD,IAAA,UAAU;AAEX,IAAA,eAAe,CAAC,IAAY,EAAA;AAClC,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI;AACxB,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;;IAG5B,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACF,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,KAClB,CAAA,CAAA,KAAA,EAAA,EACE,QAAQ,EAAE,CAAC,EACX,KAAK,EAAE;AACL,gBAAA,gBAAgB,EAAE,IAAI;AACtB,gBAAA,UAAU,EAAE,IAAI,CAAC,YAAY,KAAK,IAAI;AACvC,aAAA,EACD,OAAO,EAAE,MAAM,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAA,EAEzC,CAAA,CAAA,eAAA,EAAA,EAAe,KAAK,EAAC,SAAS,EAAC,IAAI,EAAE,IAAI,EAAA,CAAkB,CACvD,CACP,CAAC,CACG;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-stroke-size/kritzel-stroke-size.css?tag=kritzel-stroke-size&encapsulation=shadow","src/components/shared/kritzel-stroke-size/kritzel-stroke-size.tsx"],"sourcesContent":[":host {\r\n display: flex;\r\n align-items: flex-start;\r\n gap: 8px;\r\n padding: 8px;\r\n box-sizing: border-box;\r\n}\r\n\r\n.size-container {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n width: 32px;\r\n height: 32px;\r\n border-radius: 50%;\r\n cursor: pointer;\r\n border: 2px solid transparent;\r\n box-sizing: border-box;\r\n}\r\n\r\n.size-container:focus-visible {\r\n outline: var(--kritzel-stroke-size-focus-outline, 2px auto #e3e3e3);\r\n}\r\n\r\n.size-container:hover {\r\n background-color: var(--kritzel-stroke-size-hover-background-color, #ebebeb);\r\n}\r\n\r\n.size-container.selected {\r\n border-color: var(--kritzel-selection-border-color, #007AFF);\r\n background-color: var(--kritzel-stroke-size-selected-background-color, #ebebeb);\r\n}\r\n","import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'kritzel-stroke-size',\r\n styleUrl: 'kritzel-stroke-size.css',\r\n shadow: true,\r\n})\r\nexport class KritzelStrokeSize {\r\n @Prop() sizes: number[] = [4, 6, 8, 12, 16, 24];\r\n @Prop({ mutable: true }) selectedSize: number \| null = null;\r\n\r\n @Event() sizeChange: EventEmitter<number>;\r\n\r\n private handleSizeClick(size: number) {\r\n this.selectedSize = size;\r\n this.sizeChange.emit(size);\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n {this.sizes.map(size => (\r\n <div\r\n tabIndex={0}\r\n class={{\r\n 'size-container': true,\r\n 'selected': this.selectedSize === size,\r\n }}\r\n onClick={() => this.handleSizeClick(size)}\r\n >\r\n <kritzel-color value='#000000' size={size}></kritzel-color>\r\n </div>\r\n ))}\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"p-BHDOht0m.js","mappings":";;;AAAA,MAAM,oBAAoB,GAAG,+mBAA+mB;;MCO/nB,iBAAiB,iBAAAA,kBAAA,CAAA,MAAA,iBAAA,SAAAC,CAAA,CAAA;;;;;;;;;AACpB,IAAA,KAAK,GAAa,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;IACtB,YAAY,GAAkB,IAAI;AAElD,IAAA,UAAU;AAEX,IAAA,eAAe,CAAC,IAAY,EAAA;AAClC,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI;AACxB,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;;IAG5B,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACF,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,KAClB,CAAA,CAAA,KAAA,EAAA,EACE,QAAQ,EAAE,CAAC,EACX,KAAK,EAAE;AACL,gBAAA,gBAAgB,EAAE,IAAI;AACtB,gBAAA,UAAU,EAAE,IAAI,CAAC,YAAY,KAAK,IAAI;AACvC,aAAA,EACD,OAAO,EAAE,MAAM,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAA,EAEzC,CAAA,CAAA,eAAA,EAAA,EAAe,KAAK,EAAC,SAAS,EAAC,IAAI,EAAE,IAAI,EAAA,CAAkB,CACvD,CACP,CAAC,CACG;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-stroke-size/kritzel-stroke-size.css?tag=kritzel-stroke-size&encapsulation=shadow","src/components/shared/kritzel-stroke-size/kritzel-stroke-size.tsx"],"sourcesContent":[":host {\r\n display: flex;\r\n align-items: flex-start;\r\n gap: 8px;\r\n padding: 8px;\r\n box-sizing: border-box;\r\n}\r\n\r\n.size-container {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n width: 32px;\r\n height: 32px;\r\n border-radius: 50%;\r\n cursor: pointer;\r\n border: 2px solid transparent;\r\n box-sizing: border-box;\r\n}\r\n\r\n.size-container:focus-visible {\r\n outline: var(--kritzel-stroke-size-focus-outline, 2px auto #e3e3e3);\r\n}\r\n\r\n.size-container:hover {\r\n background-color: var(--kritzel-stroke-size-hover-background-color, #ebebeb);\r\n}\r\n\r\n.size-container.selected {\r\n border-color: var(--kritzel-selection-border-color, #007AFF);\r\n background-color: var(--kritzel-stroke-size-selected-background-color, #ebebeb);\r\n}\r\n","import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'kritzel-stroke-size',\r\n styleUrl: 'kritzel-stroke-size.css',\r\n shadow: true,\r\n})\r\nexport class KritzelStrokeSize {\r\n @Prop() sizes: number[] = [4, 6, 8, 12, 16, 24];\r\n @Prop({ mutable: true }) selectedSize: number \| null = null;\r\n\r\n @Event() sizeChange: EventEmitter<number>;\r\n\r\n private handleSizeClick(size: number) {\r\n this.selectedSize = size;\r\n this.sizeChange.emit(size);\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n {this.sizes.map(size => (\r\n <div\r\n tabIndex={0}\r\n class={{\r\n 'size-container': true,\r\n 'selected': this.selectedSize === size,\r\n }}\r\n onClick={() => this.handleSizeClick(size)}\r\n >\r\n <kritzel-color value='#000000' size={size}></kritzel-color>\r\n </div>\r\n ))}\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/{p-DqsgZIHC.js → p-BHT7_POQ.js} RENAMED Viewed

@@ -1,5 +1,5 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-C9hrbrUN.js';
-import { d as defineCustomElement$1 } from './p-D27d2rKT.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-CwkUrTy1.js';
+import { d as defineCustomElement$1 } from './p-Bhtn9qay.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 #ebebeb);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}";
@@ -57,13 +57,13 @@ const KritzelContextMenu = /*@__PURE__*/ proxyCustomElement(class KritzelContext
         return defaultValue;
     }
     render() {
-        return (h(Host, { key: '45b9652285f9c3fe7568cbe222667d23c151622f' }, h("div", { key: '9aecc01027f297fa4d991780efaaf51b8d4542dc', class: "menu-container" }, this.processedItems.map(({ item, isDisabled }, index) => (h("button", { key: `${item.label}-${index}`, class: { 'menu-item': true, 'disabled': isDisabled }, onClick: () => this.handleItemClick(item, isDisabled), disabled: isDisabled }, item.icon && h("kritzel-icon", { name: item.icon, size: 16 }), h("span", { class: "label" }, item.label)))))));
+        return (h(Host, { key: '908711e45cb4ea41f25c4f66a9d3b03c847f886e' }, h("div", { key: '7dcb6e5654ecafebc1fc1a2efb9fa1b8678236c4', class: "menu-container" }, this.processedItems.map(({ item, isDisabled }, index) => (h("button", { key: `${item.label}-${index}`, class: { 'menu-item': true, 'disabled': isDisabled }, onClick: () => this.handleItemClick(item, isDisabled), disabled: isDisabled }, item.icon && h("kritzel-icon", { name: item.icon, size: 16 }), h("span", { class: "label" }, item.label)))))));
     }
     static get watchers() { return {
         "items": ["onItemsChanged"]
     }; }
     static get style() { return kritzelContextMenuCss; }
-}, [257, "kritzel-context-menu", {
+}, [769, "kritzel-context-menu", {
         "items": [16],
         "objects": [16],
         "processedItems": [32]
@@ -90,6 +90,6 @@ function defineCustomElement() {
 }
 export { KritzelContextMenu as K, defineCustomElement as d };
-//# sourceMappingURL=p-DqsgZIHC.js.map
+//# sourceMappingURL=p-BHT7_POQ.js.map
-//# sourceMappingURL=p-DqsgZIHC.js.map
+//# sourceMappingURL=p-BHT7_POQ.js.map

package/dist/components/{p-DqsgZIHC.js.map → p-BHT7_POQ.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~DqsgZIHC~~.js","mappings":";;;AAAA,MAAM,qBAAqB,GAAG,yxCAAyxC;;MCc1yC,kBAAkB,iBAAAA,kBAAA,CAAA,MAAA,kBAAA,SAAAC,CAAA,CAAA;;;;;;;;;;;AAGrB,IAAA,KAAK;IAEb,cAAc,GAAA;QACZ,IAAI,CAAC,eAAe,EAAE;;AAGhB,IAAA,OAAO;AAEN,IAAA,cAAc;AACd,IAAA,KAAK;IAEG,cAAc,GAAwB,EAAE;AAGzD,IAAA,kBAAkB,CAAC,KAAiB,EAAA;AAClC,QAAA,MAAM,IAAI,GAAG,KAAK,CAAC,YAAY,EAAE;QACjC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;AAC7B,YAAA,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE;;;IAIrB,iBAAiB,GAAA;QACf,IAAI,CAAC,eAAe,EAAE;;IAGhB,eAAe,CAAC,IAAqB,EAAE,UAAmB,EAAA;QAChE,IAAI,CAAC,UAAU,EAAE;AACf,YAAA,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC;;;AAI1B,IAAA,MAAM,eAAe,GAAA;QAC3B,MAAM,SAAS,GAAwB,EAAE;AAEzC,QAAA,KAAK,MAAM,IAAI,IAAI,IAAI,CAAC,KAAK,EAAE;AAC7B,YAAA,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC;YACjE,IAAI,SAAS,EAAE;AACb,gBAAA,MAAM,UAAU,GAAG,MAAM,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,EAAE,KAAK,CAAC;gBACpE,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC;;;AAIxC,QAAA,IAAI,CAAC,cAAc,GAAG,SAAS;;AAGzB,IAAA,MAAM,gBAAgB,CAAC,KAAoG,EAAE,YAAqB,EAAA;AACxJ,QAAA,IAAI,OAAO,KAAK,KAAK,SAAS,EAAE;AAC9B,YAAA,OAAO,KAAK;;AAEd,QAAA,IAAI,OAAO,KAAK,KAAK,UAAU,EAAE;AAC/B,YAAA,OAAO,MAAM,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;;AAEzD,QAAA,OAAO,YAAY;;IAGrB,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,gBAAgB,EAAA,EACxB,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,EAAE,KAAK,MACnD,CACE,CAAA,QAAA,EAAA,EAAA,GAAG,EAAE,CAAG,EAAA,IAAI,CAAC,KAAK,CAAI,CAAA,EAAA,KAAK,CAAE,CAAA,EAC7B,KAAK,EAAE,EAAE,WAAW,EAAE,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,EACpD,OAAO,EAAE,MAAM,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE,UAAU,CAAC,EACrD,QAAQ,EAAE,UAAU,EAAA,EAEnB,IAAI,CAAC,IAAI,IAAI,CAAA,CAAA,cAAA,EAAA,EAAc,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE,EAAiB,CAAA,EACtE,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,OAAO,EAAA,EAAE,IAAI,CAAC,KAAK,CAAQ,CAChC,CACV,CAAC,CACE,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","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 #ebebeb);\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, State, Watch, Listen, Element } from '@stencil/core';\r\nimport { ContextMenuItem } from '../../../interfaces/context-menu-item.interface';\r\nimport { KritzelBaseObject } from '../../../classes/objects/base-object.class';\r\n\r\ninterface ProcessedMenuItem {\r\n item: ContextMenuItem;\r\n isDisabled: boolean;\r\n}\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 @Element() host: HTMLElement;\r\n\r\n @Prop() items: ContextMenuItem[];\r\n @Watch('items')\r\n onItemsChanged() {\r\n this.updateMenuItems();\r\n }\r\n\r\n @Prop() objects: KritzelBaseObject[];\r\n\r\n @Event() actionSelected: EventEmitter<ContextMenuItem>;\r\n @Event() close: EventEmitter<void>;\r\n\r\n @State() private processedItems: ProcessedMenuItem[] = [];\r\n\r\n @Listen('pointerdown', { target: 'window' })\r\n handleOutsideClick(event: MouseEvent) {\r\n const path = event.composedPath();\r\n if (!path.includes(this.host)) {\r\n this.close.emit();\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n this.updateMenuItems();\r\n }\r\n\r\n private handleItemClick(item: ContextMenuItem, isDisabled: boolean) {\r\n if (!isDisabled) {\r\n this.actionSelected.emit(item);\r\n }\r\n }\r\n\r\n private async updateMenuItems() {\r\n const processed: ProcessedMenuItem[] = [];\r\n\r\n for (const item of this.items) {\r\n const isVisible = await this.evaluateProperty(item.visible, true);\r\n if (isVisible) {\r\n const isDisabled = await this.evaluateProperty(item.disabled, false);\r\n processed.push({ item, isDisabled });\r\n }\r\n }\r\n\r\n this.processedItems = processed;\r\n }\r\n\r\n private async evaluateProperty(value: boolean \| ((obj: KritzelBaseObject, objs: KritzelBaseObject[]) => boolean \| Promise<boolean>), defaultValue: boolean): Promise<boolean> {\r\n if (typeof value === 'boolean') {\r\n return value;\r\n }\r\n if (typeof value === 'function') {\r\n return await Promise.resolve(value(null, this.objects));\r\n }\r\n return defaultValue;\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <div class=\"menu-container\">\r\n {this.processedItems.map(({ item, isDisabled }, index) => (\r\n <button\r\n key={`${item.label}-${index}`}\r\n class={{ 'menu-item': true, 'disabled': isDisabled }}\r\n onClick={() => this.handleItemClick(item, isDisabled)}\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 </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"p-BHT7_POQ.js","mappings":";;;AAAA,MAAM,qBAAqB,GAAG,yxCAAyxC;;MCc1yC,kBAAkB,iBAAAA,kBAAA,CAAA,MAAA,kBAAA,SAAAC,CAAA,CAAA;;;;;;;;;;;AAGrB,IAAA,KAAK;IAEb,cAAc,GAAA;QACZ,IAAI,CAAC,eAAe,EAAE;;AAGhB,IAAA,OAAO;AAEN,IAAA,cAAc;AACd,IAAA,KAAK;IAEG,cAAc,GAAwB,EAAE;AAGzD,IAAA,kBAAkB,CAAC,KAAiB,EAAA;AAClC,QAAA,MAAM,IAAI,GAAG,KAAK,CAAC,YAAY,EAAE;QACjC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;AAC7B,YAAA,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE;;;IAIrB,iBAAiB,GAAA;QACf,IAAI,CAAC,eAAe,EAAE;;IAGhB,eAAe,CAAC,IAAqB,EAAE,UAAmB,EAAA;QAChE,IAAI,CAAC,UAAU,EAAE;AACf,YAAA,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC;;;AAI1B,IAAA,MAAM,eAAe,GAAA;QAC3B,MAAM,SAAS,GAAwB,EAAE;AAEzC,QAAA,KAAK,MAAM,IAAI,IAAI,IAAI,CAAC,KAAK,EAAE;AAC7B,YAAA,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC;YACjE,IAAI,SAAS,EAAE;AACb,gBAAA,MAAM,UAAU,GAAG,MAAM,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,EAAE,KAAK,CAAC;gBACpE,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC;;;AAIxC,QAAA,IAAI,CAAC,cAAc,GAAG,SAAS;;AAGzB,IAAA,MAAM,gBAAgB,CAAC,KAAoG,EAAE,YAAqB,EAAA;AACxJ,QAAA,IAAI,OAAO,KAAK,KAAK,SAAS,EAAE;AAC9B,YAAA,OAAO,KAAK;;AAEd,QAAA,IAAI,OAAO,KAAK,KAAK,UAAU,EAAE;AAC/B,YAAA,OAAO,MAAM,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;;AAEzD,QAAA,OAAO,YAAY;;IAGrB,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,gBAAgB,EAAA,EACxB,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,EAAE,KAAK,MACnD,CACE,CAAA,QAAA,EAAA,EAAA,GAAG,EAAE,CAAG,EAAA,IAAI,CAAC,KAAK,CAAI,CAAA,EAAA,KAAK,CAAE,CAAA,EAC7B,KAAK,EAAE,EAAE,WAAW,EAAE,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,EACpD,OAAO,EAAE,MAAM,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE,UAAU,CAAC,EACrD,QAAQ,EAAE,UAAU,EAAA,EAEnB,IAAI,CAAC,IAAI,IAAI,CAAA,CAAA,cAAA,EAAA,EAAc,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE,EAAiB,CAAA,EACtE,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,OAAO,EAAA,EAAE,IAAI,CAAC,KAAK,CAAQ,CAChC,CACV,CAAC,CACE,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","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 #ebebeb);\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, State, Watch, Listen, Element } from '@stencil/core';\r\nimport { ContextMenuItem } from '../../../interfaces/context-menu-item.interface';\r\nimport { KritzelBaseObject } from '../../../classes/objects/base-object.class';\r\n\r\ninterface ProcessedMenuItem {\r\n item: ContextMenuItem;\r\n isDisabled: boolean;\r\n}\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 @Element() host: HTMLElement;\r\n\r\n @Prop() items: ContextMenuItem[];\r\n @Watch('items')\r\n onItemsChanged() {\r\n this.updateMenuItems();\r\n }\r\n\r\n @Prop() objects: KritzelBaseObject[];\r\n\r\n @Event() actionSelected: EventEmitter<ContextMenuItem>;\r\n @Event() close: EventEmitter<void>;\r\n\r\n @State() private processedItems: ProcessedMenuItem[] = [];\r\n\r\n @Listen('pointerdown', { target: 'window' })\r\n handleOutsideClick(event: MouseEvent) {\r\n const path = event.composedPath();\r\n if (!path.includes(this.host)) {\r\n this.close.emit();\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n this.updateMenuItems();\r\n }\r\n\r\n private handleItemClick(item: ContextMenuItem, isDisabled: boolean) {\r\n if (!isDisabled) {\r\n this.actionSelected.emit(item);\r\n }\r\n }\r\n\r\n private async updateMenuItems() {\r\n const processed: ProcessedMenuItem[] = [];\r\n\r\n for (const item of this.items) {\r\n const isVisible = await this.evaluateProperty(item.visible, true);\r\n if (isVisible) {\r\n const isDisabled = await this.evaluateProperty(item.disabled, false);\r\n processed.push({ item, isDisabled });\r\n }\r\n }\r\n\r\n this.processedItems = processed;\r\n }\r\n\r\n private async evaluateProperty(value: boolean \| ((obj: KritzelBaseObject, objs: KritzelBaseObject[]) => boolean \| Promise<boolean>), defaultValue: boolean): Promise<boolean> {\r\n if (typeof value === 'boolean') {\r\n return value;\r\n }\r\n if (typeof value === 'function') {\r\n return await Promise.resolve(value(null, this.objects));\r\n }\r\n return defaultValue;\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <div class=\"menu-container\">\r\n {this.processedItems.map(({ item, isDisabled }, index) => (\r\n <button\r\n key={`${item.label}-${index}`}\r\n class={{ 'menu-item': true, 'disabled': isDisabled }}\r\n onClick={() => this.handleItemClick(item, isDisabled)}\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 </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/{p-DzyZA2GT.js → p-BQ5cdSqE.js} RENAMED Viewed

@@ -1,7 +1,7 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-C9hrbrUN.js';
-import { d as defineCustomElement$3 } from './p-D27d2rKT.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-CwkUrTy1.js';
+import { d as defineCustomElement$3 } from './p-Bhtn9qay.js';
 import { K as KritzelDevicesHelper } from './p-l10It7Nm.js';
-import { d as defineCustomElement$2 } from './p-BEKicPnH.js';
+import { d as defineCustomElement$2 } from './p-Dcf7tVJW.js';
 const kritzelMenuItemCss = ":host{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--kritzel-menu-item-padding, 8px);box-sizing:border-box;gap:16px;height:var(--kritzel-menu-item-height, 40px);min-height:var(--kritzel-menu-item-min-height, 40px);font-family:sans-serif;font-size:var(--kritzel-menu-item-font-size, 14px);color:var(--kritzel-menu-item-color, #333333);border-radius:var(--kritzel-menu-item-border-radius, 12px);outline:none;cursor:default}:host(:hover) .menu-item-overlay,:host(:focus-within) .menu-item-overlay{background-color:var(--kritzel-menu-item-overlay-background-color, hsl(0, 0%, 0%, 4.3%))}:host(.selected){background-color:var(--kritzel-menu-item-selected-bg, #007aff);color:var(--kritzel-menu-item-selected-color, #ffffff)}:host(.selected) .action-button{color:var(--kritzel-menu-item-selected-color, #ffffff)}:host(.selected.editing){background-color:var(--kritzel-menu-item-selected-bg, #007aff)}:host(.selected) .edit-input{color:var(--kritzel-menu-item-selected-color, #ffffff)}:host(.selected) .action-button kritzel-icon{--kritzel-icon-color:var(--kritzel-menu-item-selected-color, #ffffff)}kritzel-icon{--kritzel-icon-color:var(--kritzel-menu-item-color, #333333)}:host(.selected) .edit-input::selection{background-color:var(--kritzel-menu-item-input-selection-color, rgba(255, 255, 255, 0.16))}:host(.editing){background-color:var(--kritzel-menu-item-editing-background-color, hsl(0, 0%, 0%, 4.3%))}:host(.disabled){opacity:0.5;pointer-events:none !important}:host(.child-open){background-color:var(--kritzel-menu-item-child-open-background-color, hsl(0, 0%, 0%, 4.3%))}:host(.child-open.selected){background-color:var(--kritzel-menu-item-selected-bg, #007aff)}.menu-item-overlay{position:absolute;inset:0;background-color:transparent;z-index:0;pointer-events:none;border-radius:var(--kritzel-menu-item-border-radius, 12px)}.menu-item-content{display:flex;align-items:center;gap:8px;position:relative;z-index:1;height:100%}.left{justify-content:flex-start;flex:1;min-width:0}.left>div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.right{justify-content:flex-end}.edit-input{flex:1;height:var(--kritzel-menu-item-input-height, 24px);padding:0;background-color:transparent;border-radius:0;border:none;border-bottom:1px solid var(--kritzel-menu-item-input-border, #ccc);font-size:var(--kritzel-context-menu-item-font-size, 14px);width:100%;min-width:0;box-sizing:border-box;outline:none}.edit-input::selection{background-color:var(--kritzel-menu-item-input-selection-color, #007bff);color:var(--kritzel-menu-item-input-selection-text-color, #ffffff)}.action-button{padding:4px;border-radius:8px;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;background-color:transparent;background:transparent;outline:none;-webkit-tap-highlight-color:transparent}.action-button:hover,.action-button:focus{background-color:var(--kritzel-menu-item-button-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.action-button.disabled{pointer-events:none;opacity:0.5}";
@@ -103,18 +103,18 @@ const KritzelMenuItem = /*@__PURE__*/ proxyCustomElement(class KritzelMenuItem e
         ];
     }
     render() {
-        return (h(Host, { key: '9df3acdaff753e3ed910f848c98e8ad73e2b5f5c', tabIndex: this.item.isDisabled ? -1 : 0, class: {
+        return (h(Host, { key: 'a35e1e3427568f436a36b43ba87af3710a4e83c5', tabIndex: this.item.isDisabled ? -1 : 0, class: {
                 'selected': this.item.isSelected,
                 'editing': this.item.isEditing,
                 'disabled': this.item.isDisabled,
                 'child-open': this.item.isChildMenuOpen,
-            }, onClick: this.handleItemSelect }, h("div", { key: 'bb73e5c0c3dd87efabcaa0b53d20c7c477b34aa1', class: "menu-item-overlay" }), this.item.isEditing ? this.renderEditMode() : this.renderViewMode()));
+            }, onClick: this.handleItemSelect }, h("div", { key: '42eef5a16b9b164839c1fe133e38ecb505c07632', class: "menu-item-overlay" }), this.item.isEditing ? this.renderEditMode() : this.renderViewMode()));
     }
     static get watchers() { return {
         "item": ["onItemChange"]
     }; }
     static get style() { return kritzelMenuItemCss; }
-}, [257, "kritzel-menu-item", {
+}, [769, "kritzel-menu-item", {
         "item": [16],
         "parent": [16],
         "isDirty": [32]
@@ -222,10 +222,10 @@ const KritzelMenu = /*@__PURE__*/ proxyCustomElement(class KritzelMenu extends H
         this.itemCloseChildMenu.emit(event.detail);
     };
     render() {
-        return (h(Host, { key: 'be122cb0ecff3227d9e69997de76a73940a61860', tabIndex: 0, onClick: e => e.stopPropagation() }, this.openChildMenuItem && h("div", { key: 'ae10bec61e5c5e1a29b444cb7378f15c6692f3b6', class: "has-open-child-overlay", onClick: this.onOverlayClick }), this.items.map(item => (h("kritzel-menu-item", { key: item.id, item: item, parent: this.parent, style: { pointerEvents: this.editingMenuItem && !item.isEditing ? 'none' : 'auto' }, onItemSelect: this.handleItemSelect, onItemSave: this.handleSave, onItemCancel: this.handleCancel, onItemToggleChildMenu: this.handleToggleChildMenu, onItemCloseChildMenu: this.handleCloseChildMenu })))));
+        return (h(Host, { key: '211bd579000294d9edf6f85f2d7244aebe331191', tabIndex: 0, onClick: e => e.stopPropagation() }, this.openChildMenuItem && h("div", { key: 'b1c397118b1fbac934867677073661a69be1cab1', class: "has-open-child-overlay", onClick: this.onOverlayClick }), this.items.map(item => (h("kritzel-menu-item", { key: item.id, item: item, parent: this.parent, style: { pointerEvents: this.editingMenuItem && !item.isEditing ? 'none' : 'auto' }, onItemSelect: this.handleItemSelect, onItemSave: this.handleSave, onItemCancel: this.handleCancel, onItemToggleChildMenu: this.handleToggleChildMenu, onItemCloseChildMenu: this.handleCloseChildMenu })))));
     }
     static get style() { return kritzelMenuCss; }
-}, [257, "kritzel-menu", {
+}, [769, "kritzel-menu", {
         "items": [16],
         "parent": [16],
         "selectedIndex": [32],
@@ -266,7 +266,7 @@ function defineCustomElement() {
     } });
 }
-export { KritzelMenu as K, KritzelMenuItem as a, defineCustomElement$1 as b, defineCustomElement as d };
-//# sourceMappingURL=p-DzyZA2GT.js.map
+export { KritzelMenu as K, defineCustomElement as a, KritzelMenuItem as b, defineCustomElement$1 as d };
+//# sourceMappingURL=p-BQ5cdSqE.js.map
-//# sourceMappingURL=p-DzyZA2GT.js.map
+//# sourceMappingURL=p-BQ5cdSqE.js.map

package/dist/components/{p-DzyZA2GT.js.map → p-BQ5cdSqE.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-DzyZA2GT.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-menu-item/kritzel-menu-item.css?tag=kritzel-menu-item&encapsulation=shadow","src/components/shared/kritzel-menu-item/kritzel-menu-item.tsx","src/components/shared/kritzel-menu/kritzel-menu.css?tag=kritzel-menu&encapsulation=shadow","src/components/shared/kritzel-menu/kritzel-menu.tsx"],"sourcesContent":[":host {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n width: 100%;\r\n padding: var(--kritzel-menu-item-padding, 8px);\r\n box-sizing: border-box;\r\n gap: 16px;\r\n height: var(--kritzel-menu-item-height, 40px);\r\n min-height: var(--kritzel-menu-item-min-height, 40px);\r\n font-family: sans-serif;\r\n font-size: var(--kritzel-menu-item-font-size, 14px);\r\n color: var(--kritzel-menu-item-color, #333333);\r\n border-radius: var(--kritzel-menu-item-border-radius, 12px);\r\n outline: none;\r\n cursor: default;\r\n}\r\n\r\n:host(:hover) .menu-item-overlay,\r\n:host(:focus-within) .menu-item-overlay {\r\n background-color: var(--kritzel-menu-item-overlay-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n:host(.selected) {\r\n background-color: var(--kritzel-menu-item-selected-bg, #007aff);\r\n color: var(--kritzel-menu-item-selected-color, #ffffff);\r\n}\r\n\r\n:host(.selected) .action-button {\r\n color: var(--kritzel-menu-item-selected-color, #ffffff);\r\n}\r\n\r\n:host(.selected.editing) {\r\n background-color: var(--kritzel-menu-item-selected-bg, #007aff);\r\n}\r\n\r\n:host(.selected) .edit-input {\r\n color: var(--kritzel-menu-item-selected-color, #ffffff);\r\n}\r\n\r\n:host(.selected) .action-button kritzel-icon {\r\n --kritzel-icon-color: var(--kritzel-menu-item-selected-color, #ffffff);\r\n}\r\n\r\nkritzel-icon {\r\n --kritzel-icon-color: var(--kritzel-menu-item-color, #333333);\r\n}\r\n\r\n:host(.selected) .edit-input::selection {\r\n background-color: var(--kritzel-menu-item-input-selection-color, rgba(255, 255, 255, 0.16));\r\n}\r\n\r\n:host(.editing) {\r\n background-color: var(--kritzel-menu-item-editing-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n:host(.disabled) {\r\n opacity: 0.5;\r\n pointer-events: none !important;\r\n}\r\n\r\n:host(.child-open) {\r\n background-color: var(--kritzel-menu-item-child-open-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n:host(.child-open.selected) {\r\n background-color: var(--kritzel-menu-item-selected-bg, #007aff);\r\n}\r\n\r\n.menu-item-overlay {\r\n position: absolute;\r\n inset: 0;\r\n background-color: transparent;\r\n z-index: 0;\r\n pointer-events: none;\r\n border-radius: var(--kritzel-menu-item-border-radius, 12px);\r\n}\r\n\r\n.menu-item-content {\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n position: relative;\r\n z-index: 1;\r\n height: 100%;\r\n}\r\n\r\n.left {\r\n justify-content: flex-start;\r\n flex: 1;\r\n min-width: 0;\r\n}\r\n\r\n.left > div {\r\n white-space: nowrap;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n}\r\n\r\n.right {\r\n justify-content: flex-end;\r\n}\r\n\r\n.edit-input {\r\n flex: 1;\r\n height: var(--kritzel-menu-item-input-height, 24px);\r\n padding: 0;\r\n background-color: transparent;\r\n border-radius: 0;\r\n border: none;\r\n border-bottom: 1px solid var(--kritzel-menu-item-input-border, #ccc);\r\n font-size: var(--kritzel-context-menu-item-font-size, 14px);\r\n width: 100%;\r\n min-width: 0;\r\n box-sizing: border-box;\r\n outline: none;\r\n}\r\n\r\n.edit-input::selection {\r\n background-color: var(--kritzel-menu-item-input-selection-color, #007bff);\r\n color: var(--kritzel-menu-item-input-selection-text-color, #ffffff);\r\n}\r\n\r\n.action-button {\r\n padding: 4px;\r\n border-radius: 8px;\r\n border: none;\r\n cursor: pointer;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n background-color: transparent;\r\n background: transparent;\r\n outline: none;\r\n -webkit-tap-highlight-color: transparent;\r\n}\r\n\r\n.action-button:hover,\r\n.action-button:focus {\r\n background-color: var(--kritzel-menu-item-button-hover-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n.action-button.disabled {\r\n pointer-events: none;\r\n opacity: 0.5;\r\n}\r\n","import { Component, Host, Prop, h, Element, State, Watch, Event, EventEmitter } from '@stencil/core';\r\nimport { IKritzelMenuItem, IKritzelMenuItemSelectEvent, IKritzelMenuItemToggleChildMenuEvent } from '../../../interfaces/menu-item.interface';\r\nimport { KritzelDevicesHelper } from '../../../helpers/devices.helper';\r\n\r\n@Component({\r\n tag: 'kritzel-menu-item',\r\n styleUrl: 'kritzel-menu-item.css',\r\n shadow: true,\r\n})\r\nexport class KritzelMenuItem {\r\n @Element() host: HTMLElement;\r\n\r\n @Prop() item: IKritzelMenuItem;\r\n @Watch('item')\r\n onItemChange(newValue: IKritzelMenuItem, oldValue: IKritzelMenuItem) {\r\n if (newValue !== oldValue) {\r\n this.isDirty = false;\r\n }\r\n }\r\n @Prop() parent: IKritzelMenuItem = null;\r\n\r\n @Event() itemSelect: EventEmitter<IKritzelMenuItemSelectEvent>;\r\n @Event() itemSave: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemCancel: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemToggleChildMenu: EventEmitter<IKritzelMenuItemToggleChildMenuEvent>;\r\n @Event() itemCloseChildMenu: EventEmitter<IKritzelMenuItem>;\r\n\r\n @State()\r\n isDirty: boolean = false;\r\n\r\n private inputRef: HTMLInputElement;\r\n\r\n private focusInput() {\r\n if (this.item.isEditing && this.inputRef && !this.isDirty) {\r\n this.inputRef.focus();\r\n\r\n if (KritzelDevicesHelper.isIOS()) {\r\n const length = this.inputRef.value.length;\r\n this.inputRef.setSelectionRange(length, length);\r\n } else {\r\n this.inputRef.select();\r\n }\r\n }\r\n }\r\n\r\n componentDidLoad() {\r\n this.setDeviceSpecificStyles();\r\n this.focusInput();\r\n }\r\n\r\n componentDidUpdate() {\r\n this.focusInput();\r\n }\r\n\r\n private setDeviceSpecificStyles = () => {\r\n const isTouchDevice = KritzelDevicesHelper.isTouchDevice();\r\n if (isTouchDevice) {\r\n this.host.style.setProperty('--kritzel-menu-item-overlay-background-color', 'transparent');\r\n this.host.style.setProperty('--kritzel-menu-item-button-hover-background-color', 'transparent');\r\n }\r\n };\r\n\r\n private handleItemSelect = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.itemSelect.emit({ item: this.item, parent: this.parent });\r\n };\r\n\r\n private handleInputChange = (event: Event) => {\r\n event.stopPropagation();\r\n const target = event.target as HTMLInputElement;\r\n this.item.label = target.value;\r\n this.isDirty = true;\r\n };\r\n\r\n private handleSave = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.host.focus();\r\n this.itemSave.emit(this.item);\r\n };\r\n\r\n private handleCancel = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.host.focus();\r\n this.itemCancel.emit(this.item);\r\n };\r\n\r\n private handleMenuToggle = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.itemToggleChildMenu.emit({ item: this.item, childMenuAnchor: event.target as HTMLElement });\r\n };\r\n\r\n private handleMenuClose = () => {\r\n this.itemCloseChildMenu.emit(this.item);\r\n };\r\n\r\n private renderViewMode() {\r\n return [\r\n <div class=\"menu-item-content left\">\r\n <div>{this.item.label}</div>\r\n </div>,\r\n <div class=\"menu-item-content right\">\r\n {this.item.children &&\r\n this.item.children.length > 0 && [\r\n <button id=\"child-menu-toggle\" class=\"action-button\" onClick={this.handleMenuToggle} disabled={this.item.isDisabled}>\r\n <kritzel-icon name=\"ellipsis-vertical\" size={16}></kritzel-icon>\r\n </button>,\r\n <kritzel-portal anchor={this.item.childMenuAnchor} offsetY={4} onClose={this.handleMenuClose}>\r\n <kritzel-menu\r\n items={this.item.children}\r\n parent={this.item}\r\n onItemSelect={event => this.itemSelect.emit(event.detail)}\r\n onItemSave={event => this.itemSave.emit(event.detail)}\r\n onItemCancel={event => this.itemCancel.emit(event.detail)}\r\n onClose={this.handleMenuClose}\r\n ></kritzel-menu>\r\n </kritzel-portal>,\r\n ]}\r\n </div>,\r\n ];\r\n }\r\n\r\n private renderEditMode() {\r\n return [\r\n <div class=\"menu-item-content left\">\r\n <input\r\n ref={el => (this.inputRef = el)}\r\n type=\"text\"\r\n class=\"edit-input\"\r\n value={this.item.label}\r\n onInput={this.handleInputChange}\r\n />\r\n </div>,\r\n <div class=\"menu-item-content right\">\r\n <div tabIndex={0} class=\"action-button\" onClick={this.handleCancel}>\r\n <kritzel-icon name=\"x\" size={16}></kritzel-icon>\r\n </div>\r\n <div\r\n tabIndex={!this.isDirty && !this.item.isNewItem ? -1 : 0}\r\n class={{ 'action-button': true, 'disabled': !this.isDirty && !this.item.isNewItem }}\r\n onClick={this.handleSave}\r\n >\r\n <kritzel-icon name=\"check\" size={16}></kritzel-icon>\r\n </div>\r\n </div>,\r\n ];\r\n }\r\n\r\n render() {\r\n return (\r\n <Host\r\n tabIndex={this.item.isDisabled ? -1 : 0}\r\n class={{\r\n 'selected': this.item.isSelected,\r\n 'editing': this.item.isEditing,\r\n 'disabled': this.item.isDisabled,\r\n 'child-open': this.item.isChildMenuOpen,\r\n }}\r\n onClick={this.handleItemSelect}\r\n >\r\n <div class=\"menu-item-overlay\"></div>\r\n {this.item.isEditing ? this.renderEditMode() : this.renderViewMode()}\r\n </Host>\r\n );\r\n }\r\n}\r\n",":host {\r\n position: relative;\r\n display: flex;\r\n flex-direction: column;\r\n background-color: var(--kritzel-menu-background-color, #ffffff);\r\n width: var(--kritzel-menu-width, 200px);\r\n padding: var(--kritzel-menu-padding, 8px);\r\n border-radius: var(--kritzel-menu-border-radius, 12px);\r\n box-shadow: var(--kritzel-menu-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));\r\n border: var(--kritzel-menu-border, 1px solid #ebebeb);\r\n z-index: 2;\r\n gap: var(--kritzel-menu-gap, 4px);\r\n overflow-y: auto;\r\n scrollbar-color: #ebebeb transparent;\r\n scrollbar-width: thin;\r\n max-height: 300px;\r\n}\r\n\r\n:host(:focus-visible) {\r\n outline: var(--kritzel-menu-focus-outline, 2px solid #e3e3e3);\r\n}\r\n\r\n.has-open-child-overlay {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n z-index: 3;\r\n}\r\n","import { Component, Host, Prop, h, State, Event, EventEmitter, Element, Method } from '@stencil/core';\r\nimport { IKritzelMenuItem, IKritzelMenuItemSelectEvent, IKritzelMenuItemToggleChildMenuEvent } from '../../../interfaces/menu-item.interface';\r\n\r\n@Component({\r\n tag: 'kritzel-menu',\r\n styleUrl: 'kritzel-menu.css',\r\n shadow: true,\r\n})\r\nexport class KritzelMenu {\r\n @Element() host: HTMLElement;\r\n\r\n @Prop() items: IKritzelMenuItem[];\r\n @Prop() parent: IKritzelMenuItem = null;\r\n\r\n @Event() itemSelect: EventEmitter<IKritzelMenuItemSelectEvent>;\r\n @Event() itemSave: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemCancel: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemToggleChildMenu: EventEmitter<IKritzelMenuItemToggleChildMenuEvent>;\r\n @Event() itemCloseChildMenu: EventEmitter<IKritzelMenuItem>;\r\n @Event() close: EventEmitter<void>;\r\n\r\n @State() selectedIndex: number \| null = null;\r\n\r\n @Method()\r\n async setScrollTop(scrollTop: number) {\r\n this.host.scrollTop = scrollTop;\r\n this.host.scrollTo({ top: scrollTop, behavior: 'auto' });\r\n }\r\n\r\n @Method()\r\n async setFocus() {\r\n const firstItem = this.host.shadowRoot.querySelector('kritzel-menu-item');\r\n if (firstItem) {\r\n firstItem.focus();\r\n }\r\n }\r\n\r\n get openChildMenuItem() {\r\n return this.items.find(item => item.isChildMenuOpen);\r\n }\r\n\r\n get editingMenuItem() {\r\n return this.items.find(item => item.isEditing);\r\n }\r\n\r\n private onOverlayClick = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.itemCloseChildMenu.emit(this.openChildMenuItem);\r\n };\r\n\r\n private handleItemSelect = (event: CustomEvent<{ item: IKritzelMenuItem; parent: IKritzelMenuItem }>) => {\r\n event.stopPropagation();\r\n this.itemSelect.emit(event.detail);\r\n };\r\n\r\n private handleSave = (event: CustomEvent<IKritzelMenuItem>) => {\r\n event.stopPropagation();\r\n this.itemSave.emit(event.detail);\r\n };\r\n\r\n private handleCancel = (event: CustomEvent<IKritzelMenuItem>) => {\r\n event.stopPropagation();\r\n this.itemCancel.emit(event.detail);\r\n };\r\n\r\n private handleToggleChildMenu = (event: CustomEvent<{ item: IKritzelMenuItem; childMenuAnchor: HTMLElement }>) => {\r\n event.stopPropagation();\r\n this.itemToggleChildMenu.emit(event.detail);\r\n };\r\n\r\n private handleCloseChildMenu = (event: CustomEvent<IKritzelMenuItem>) => {\r\n event.stopPropagation();\r\n this.itemCloseChildMenu.emit(event.detail);\r\n };\r\n\r\n render() {\r\n return (\r\n <Host tabIndex={0} onClick={e => e.stopPropagation()}>\r\n {this.openChildMenuItem && <div class=\"has-open-child-overlay\" onClick={this.onOverlayClick}></div>}\r\n {this.items.map(item => (\r\n <kritzel-menu-item\r\n key={item.id}\r\n item={item}\r\n parent={this.parent}\r\n style={{ pointerEvents: this.editingMenuItem && !item.isEditing ? 'none' : 'auto' }}\r\n onItemSelect={this.handleItemSelect}\r\n onItemSave={this.handleSave}\r\n onItemCancel={this.handleCancel}\r\n onItemToggleChildMenu={this.handleToggleChildMenu}\r\n onItemCloseChildMenu={this.handleCloseChildMenu}\r\n ></kritzel-menu-item>\r\n ))}\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"p-BQ5cdSqE.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-menu-item/kritzel-menu-item.css?tag=kritzel-menu-item&encapsulation=shadow","src/components/shared/kritzel-menu-item/kritzel-menu-item.tsx","src/components/shared/kritzel-menu/kritzel-menu.css?tag=kritzel-menu&encapsulation=shadow","src/components/shared/kritzel-menu/kritzel-menu.tsx"],"sourcesContent":[":host {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n width: 100%;\r\n padding: var(--kritzel-menu-item-padding, 8px);\r\n box-sizing: border-box;\r\n gap: 16px;\r\n height: var(--kritzel-menu-item-height, 40px);\r\n min-height: var(--kritzel-menu-item-min-height, 40px);\r\n font-family: sans-serif;\r\n font-size: var(--kritzel-menu-item-font-size, 14px);\r\n color: var(--kritzel-menu-item-color, #333333);\r\n border-radius: var(--kritzel-menu-item-border-radius, 12px);\r\n outline: none;\r\n cursor: default;\r\n}\r\n\r\n:host(:hover) .menu-item-overlay,\r\n:host(:focus-within) .menu-item-overlay {\r\n background-color: var(--kritzel-menu-item-overlay-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n:host(.selected) {\r\n background-color: var(--kritzel-menu-item-selected-bg, #007aff);\r\n color: var(--kritzel-menu-item-selected-color, #ffffff);\r\n}\r\n\r\n:host(.selected) .action-button {\r\n color: var(--kritzel-menu-item-selected-color, #ffffff);\r\n}\r\n\r\n:host(.selected.editing) {\r\n background-color: var(--kritzel-menu-item-selected-bg, #007aff);\r\n}\r\n\r\n:host(.selected) .edit-input {\r\n color: var(--kritzel-menu-item-selected-color, #ffffff);\r\n}\r\n\r\n:host(.selected) .action-button kritzel-icon {\r\n --kritzel-icon-color: var(--kritzel-menu-item-selected-color, #ffffff);\r\n}\r\n\r\nkritzel-icon {\r\n --kritzel-icon-color: var(--kritzel-menu-item-color, #333333);\r\n}\r\n\r\n:host(.selected) .edit-input::selection {\r\n background-color: var(--kritzel-menu-item-input-selection-color, rgba(255, 255, 255, 0.16));\r\n}\r\n\r\n:host(.editing) {\r\n background-color: var(--kritzel-menu-item-editing-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n:host(.disabled) {\r\n opacity: 0.5;\r\n pointer-events: none !important;\r\n}\r\n\r\n:host(.child-open) {\r\n background-color: var(--kritzel-menu-item-child-open-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n:host(.child-open.selected) {\r\n background-color: var(--kritzel-menu-item-selected-bg, #007aff);\r\n}\r\n\r\n.menu-item-overlay {\r\n position: absolute;\r\n inset: 0;\r\n background-color: transparent;\r\n z-index: 0;\r\n pointer-events: none;\r\n border-radius: var(--kritzel-menu-item-border-radius, 12px);\r\n}\r\n\r\n.menu-item-content {\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n position: relative;\r\n z-index: 1;\r\n height: 100%;\r\n}\r\n\r\n.left {\r\n justify-content: flex-start;\r\n flex: 1;\r\n min-width: 0;\r\n}\r\n\r\n.left > div {\r\n white-space: nowrap;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n}\r\n\r\n.right {\r\n justify-content: flex-end;\r\n}\r\n\r\n.edit-input {\r\n flex: 1;\r\n height: var(--kritzel-menu-item-input-height, 24px);\r\n padding: 0;\r\n background-color: transparent;\r\n border-radius: 0;\r\n border: none;\r\n border-bottom: 1px solid var(--kritzel-menu-item-input-border, #ccc);\r\n font-size: var(--kritzel-context-menu-item-font-size, 14px);\r\n width: 100%;\r\n min-width: 0;\r\n box-sizing: border-box;\r\n outline: none;\r\n}\r\n\r\n.edit-input::selection {\r\n background-color: var(--kritzel-menu-item-input-selection-color, #007bff);\r\n color: var(--kritzel-menu-item-input-selection-text-color, #ffffff);\r\n}\r\n\r\n.action-button {\r\n padding: 4px;\r\n border-radius: 8px;\r\n border: none;\r\n cursor: pointer;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n background-color: transparent;\r\n background: transparent;\r\n outline: none;\r\n -webkit-tap-highlight-color: transparent;\r\n}\r\n\r\n.action-button:hover,\r\n.action-button:focus {\r\n background-color: var(--kritzel-menu-item-button-hover-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n.action-button.disabled {\r\n pointer-events: none;\r\n opacity: 0.5;\r\n}\r\n","import { Component, Host, Prop, h, Element, State, Watch, Event, EventEmitter } from '@stencil/core';\r\nimport { IKritzelMenuItem, IKritzelMenuItemSelectEvent, IKritzelMenuItemToggleChildMenuEvent } from '../../../interfaces/menu-item.interface';\r\nimport { KritzelDevicesHelper } from '../../../helpers/devices.helper';\r\n\r\n@Component({\r\n tag: 'kritzel-menu-item',\r\n styleUrl: 'kritzel-menu-item.css',\r\n shadow: true,\r\n})\r\nexport class KritzelMenuItem {\r\n @Element() host: HTMLElement;\r\n\r\n @Prop() item: IKritzelMenuItem;\r\n @Watch('item')\r\n onItemChange(newValue: IKritzelMenuItem, oldValue: IKritzelMenuItem) {\r\n if (newValue !== oldValue) {\r\n this.isDirty = false;\r\n }\r\n }\r\n @Prop() parent: IKritzelMenuItem = null;\r\n\r\n @Event() itemSelect: EventEmitter<IKritzelMenuItemSelectEvent>;\r\n @Event() itemSave: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemCancel: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemToggleChildMenu: EventEmitter<IKritzelMenuItemToggleChildMenuEvent>;\r\n @Event() itemCloseChildMenu: EventEmitter<IKritzelMenuItem>;\r\n\r\n @State()\r\n isDirty: boolean = false;\r\n\r\n private inputRef: HTMLInputElement;\r\n\r\n private focusInput() {\r\n if (this.item.isEditing && this.inputRef && !this.isDirty) {\r\n this.inputRef.focus();\r\n\r\n if (KritzelDevicesHelper.isIOS()) {\r\n const length = this.inputRef.value.length;\r\n this.inputRef.setSelectionRange(length, length);\r\n } else {\r\n this.inputRef.select();\r\n }\r\n }\r\n }\r\n\r\n componentDidLoad() {\r\n this.setDeviceSpecificStyles();\r\n this.focusInput();\r\n }\r\n\r\n componentDidUpdate() {\r\n this.focusInput();\r\n }\r\n\r\n private setDeviceSpecificStyles = () => {\r\n const isTouchDevice = KritzelDevicesHelper.isTouchDevice();\r\n if (isTouchDevice) {\r\n this.host.style.setProperty('--kritzel-menu-item-overlay-background-color', 'transparent');\r\n this.host.style.setProperty('--kritzel-menu-item-button-hover-background-color', 'transparent');\r\n }\r\n };\r\n\r\n private handleItemSelect = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.itemSelect.emit({ item: this.item, parent: this.parent });\r\n };\r\n\r\n private handleInputChange = (event: Event) => {\r\n event.stopPropagation();\r\n const target = event.target as HTMLInputElement;\r\n this.item.label = target.value;\r\n this.isDirty = true;\r\n };\r\n\r\n private handleSave = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.host.focus();\r\n this.itemSave.emit(this.item);\r\n };\r\n\r\n private handleCancel = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.host.focus();\r\n this.itemCancel.emit(this.item);\r\n };\r\n\r\n private handleMenuToggle = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.itemToggleChildMenu.emit({ item: this.item, childMenuAnchor: event.target as HTMLElement });\r\n };\r\n\r\n private handleMenuClose = () => {\r\n this.itemCloseChildMenu.emit(this.item);\r\n };\r\n\r\n private renderViewMode() {\r\n return [\r\n <div class=\"menu-item-content left\">\r\n <div>{this.item.label}</div>\r\n </div>,\r\n <div class=\"menu-item-content right\">\r\n {this.item.children &&\r\n this.item.children.length > 0 && [\r\n <button id=\"child-menu-toggle\" class=\"action-button\" onClick={this.handleMenuToggle} disabled={this.item.isDisabled}>\r\n <kritzel-icon name=\"ellipsis-vertical\" size={16}></kritzel-icon>\r\n </button>,\r\n <kritzel-portal anchor={this.item.childMenuAnchor} offsetY={4} onClose={this.handleMenuClose}>\r\n <kritzel-menu\r\n items={this.item.children}\r\n parent={this.item}\r\n onItemSelect={event => this.itemSelect.emit(event.detail)}\r\n onItemSave={event => this.itemSave.emit(event.detail)}\r\n onItemCancel={event => this.itemCancel.emit(event.detail)}\r\n onClose={this.handleMenuClose}\r\n ></kritzel-menu>\r\n </kritzel-portal>,\r\n ]}\r\n </div>,\r\n ];\r\n }\r\n\r\n private renderEditMode() {\r\n return [\r\n <div class=\"menu-item-content left\">\r\n <input\r\n ref={el => (this.inputRef = el)}\r\n type=\"text\"\r\n class=\"edit-input\"\r\n value={this.item.label}\r\n onInput={this.handleInputChange}\r\n />\r\n </div>,\r\n <div class=\"menu-item-content right\">\r\n <div tabIndex={0} class=\"action-button\" onClick={this.handleCancel}>\r\n <kritzel-icon name=\"x\" size={16}></kritzel-icon>\r\n </div>\r\n <div\r\n tabIndex={!this.isDirty && !this.item.isNewItem ? -1 : 0}\r\n class={{ 'action-button': true, 'disabled': !this.isDirty && !this.item.isNewItem }}\r\n onClick={this.handleSave}\r\n >\r\n <kritzel-icon name=\"check\" size={16}></kritzel-icon>\r\n </div>\r\n </div>,\r\n ];\r\n }\r\n\r\n render() {\r\n return (\r\n <Host\r\n tabIndex={this.item.isDisabled ? -1 : 0}\r\n class={{\r\n 'selected': this.item.isSelected,\r\n 'editing': this.item.isEditing,\r\n 'disabled': this.item.isDisabled,\r\n 'child-open': this.item.isChildMenuOpen,\r\n }}\r\n onClick={this.handleItemSelect}\r\n >\r\n <div class=\"menu-item-overlay\"></div>\r\n {this.item.isEditing ? this.renderEditMode() : this.renderViewMode()}\r\n </Host>\r\n );\r\n }\r\n}\r\n",":host {\r\n position: relative;\r\n display: flex;\r\n flex-direction: column;\r\n background-color: var(--kritzel-menu-background-color, #ffffff);\r\n width: var(--kritzel-menu-width, 200px);\r\n padding: var(--kritzel-menu-padding, 8px);\r\n border-radius: var(--kritzel-menu-border-radius, 12px);\r\n box-shadow: var(--kritzel-menu-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));\r\n border: var(--kritzel-menu-border, 1px solid #ebebeb);\r\n z-index: 2;\r\n gap: var(--kritzel-menu-gap, 4px);\r\n overflow-y: auto;\r\n scrollbar-color: #ebebeb transparent;\r\n scrollbar-width: thin;\r\n max-height: 300px;\r\n}\r\n\r\n:host(:focus-visible) {\r\n outline: var(--kritzel-menu-focus-outline, 2px solid #e3e3e3);\r\n}\r\n\r\n.has-open-child-overlay {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n z-index: 3;\r\n}\r\n","import { Component, Host, Prop, h, State, Event, EventEmitter, Element, Method } from '@stencil/core';\r\nimport { IKritzelMenuItem, IKritzelMenuItemSelectEvent, IKritzelMenuItemToggleChildMenuEvent } from '../../../interfaces/menu-item.interface';\r\n\r\n@Component({\r\n tag: 'kritzel-menu',\r\n styleUrl: 'kritzel-menu.css',\r\n shadow: true,\r\n})\r\nexport class KritzelMenu {\r\n @Element() host: HTMLElement;\r\n\r\n @Prop() items: IKritzelMenuItem[];\r\n @Prop() parent: IKritzelMenuItem = null;\r\n\r\n @Event() itemSelect: EventEmitter<IKritzelMenuItemSelectEvent>;\r\n @Event() itemSave: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemCancel: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemToggleChildMenu: EventEmitter<IKritzelMenuItemToggleChildMenuEvent>;\r\n @Event() itemCloseChildMenu: EventEmitter<IKritzelMenuItem>;\r\n @Event() close: EventEmitter<void>;\r\n\r\n @State() selectedIndex: number \| null = null;\r\n\r\n @Method()\r\n async setScrollTop(scrollTop: number) {\r\n this.host.scrollTop = scrollTop;\r\n this.host.scrollTo({ top: scrollTop, behavior: 'auto' });\r\n }\r\n\r\n @Method()\r\n async setFocus() {\r\n const firstItem = this.host.shadowRoot.querySelector('kritzel-menu-item');\r\n if (firstItem) {\r\n firstItem.focus();\r\n }\r\n }\r\n\r\n get openChildMenuItem() {\r\n return this.items.find(item => item.isChildMenuOpen);\r\n }\r\n\r\n get editingMenuItem() {\r\n return this.items.find(item => item.isEditing);\r\n }\r\n\r\n private onOverlayClick = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.itemCloseChildMenu.emit(this.openChildMenuItem);\r\n };\r\n\r\n private handleItemSelect = (event: CustomEvent<{ item: IKritzelMenuItem; parent: IKritzelMenuItem }>) => {\r\n event.stopPropagation();\r\n this.itemSelect.emit(event.detail);\r\n };\r\n\r\n private handleSave = (event: CustomEvent<IKritzelMenuItem>) => {\r\n event.stopPropagation();\r\n this.itemSave.emit(event.detail);\r\n };\r\n\r\n private handleCancel = (event: CustomEvent<IKritzelMenuItem>) => {\r\n event.stopPropagation();\r\n this.itemCancel.emit(event.detail);\r\n };\r\n\r\n private handleToggleChildMenu = (event: CustomEvent<{ item: IKritzelMenuItem; childMenuAnchor: HTMLElement }>) => {\r\n event.stopPropagation();\r\n this.itemToggleChildMenu.emit(event.detail);\r\n };\r\n\r\n private handleCloseChildMenu = (event: CustomEvent<IKritzelMenuItem>) => {\r\n event.stopPropagation();\r\n this.itemCloseChildMenu.emit(event.detail);\r\n };\r\n\r\n render() {\r\n return (\r\n <Host tabIndex={0} onClick={e => e.stopPropagation()}>\r\n {this.openChildMenuItem && <div class=\"has-open-child-overlay\" onClick={this.onOverlayClick}></div>}\r\n {this.items.map(item => (\r\n <kritzel-menu-item\r\n key={item.id}\r\n item={item}\r\n parent={this.parent}\r\n style={{ pointerEvents: this.editingMenuItem && !item.isEditing ? 'none' : 'auto' }}\r\n onItemSelect={this.handleItemSelect}\r\n onItemSave={this.handleSave}\r\n onItemCancel={this.handleCancel}\r\n onItemToggleChildMenu={this.handleToggleChildMenu}\r\n onItemCloseChildMenu={this.handleCloseChildMenu}\r\n ></kritzel-menu-item>\r\n ))}\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/{p-Co5lU_7h.js → p-BaHZYvfq.js} RENAMED Viewed

@@ -1,11 +1,11 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-C9hrbrUN.js';
-import { d as defineCustomElement$7 } from './p-C_hSH2nN.js';
-import { d as defineCustomElement$6 } from './p-gCHmJzc2.js';
-import { d as defineCustomElement$5 } from './p-DPxzgBs0.js';
-import { d as defineCustomElement$4 } from './p-CGb-8cK4.js';
-import { d as defineCustomElement$3 } from './p-dcR2uxM3.js';
-import { d as defineCustomElement$2 } from './p-BycHaC-9.js';
-import { d as defineCustomElement$1 } from './p-D27d2rKT.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-CwkUrTy1.js';
+import { d as defineCustomElement$7 } from './p-8iFF5GHL.js';
+import { d as defineCustomElement$6 } from './p-NXPGXBZ2.js';
+import { d as defineCustomElement$5 } from './p-CIXPLjCu.js';
+import { d as defineCustomElement$4 } from './p-BlI4vzRZ.js';
+import { d as defineCustomElement$3 } from './p-CURq0twf.js';
+import { d as defineCustomElement$2 } from './p-BCrMfH5n.js';
+import { d as defineCustomElement$1 } from './p-Bhtn9qay.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)}";
@@ -37,17 +37,17 @@ const KritzelControlTextConfig = /*@__PURE__*/ proxyCustomElement(class KritzelC
         this.toolChange.emit(this.tool);
     }
     render() {
-        return (h(Host, { key: '82e611092700f057bd36823e7f7503fe7a0423ed' }, h("div", { key: '37ed39adeeeb58981a917918cd185e96d589e973', style: {
+        return (h(Host, { key: '3695b187943af25566885d63257ae3de9f405ea5' }, h("div", { key: '7bb146ae3c188478ba17f18f70fd170ce3536308', style: {
                 display: 'flex',
                 flexDirection: 'row',
                 alignItems: 'center',
                 justifyContent: 'flex-start',
                 width: '100%',
                 gap: '8px',
-            } }, h("kritzel-font-family", { key: 'cd8afc5c4a1eee087610cd3d5a6c05210cfda6b3', selectedFontFamily: this.tool.fontFamily, onFontFamilyChange: event => this.handleFamilyChange(event) }), h("button", { key: '085f1bba060bde27a7b64dc5477bb51305b76235', class: "expand-toggle", onClick: () => this.handleToggleExpand(), title: this.isExpanded ? 'Collapse' : 'Expand' }, h("kritzel-icon", { key: '3ff8fec207120e67f43315c6dace72fc2f6bd0f1', name: this.isExpanded ? 'chevron-up' : 'chevron-down' }))), h("kritzel-color-palette", { key: '2e29d01a6b5c0e4a8ec347e63b6a2698c282db40', colors: this.tool.palette, selectedColor: this.tool.fontColor, isExpanded: this.isExpanded, onColorChange: event => this.handleColorChange(event) }), h("kritzel-font-size", { key: 'c972068f1251d66e756b8de72fbdd1b6002d1daa', selectedSize: this.tool.fontSize, fontFamily: this.tool.fontFamily, onSizeChange: event => this.handleSizeChange(event) })));
+            } }, h("kritzel-font-family", { key: '87f4c5ac2e2a4cfea216b1b828faad231438b9ec', selectedFontFamily: this.tool.fontFamily, onFontFamilyChange: event => this.handleFamilyChange(event) }), h("button", { key: '2e73aaf7da659b9e069c247cc762f68394212293', class: "expand-toggle", onClick: () => this.handleToggleExpand(), title: this.isExpanded ? 'Collapse' : 'Expand' }, h("kritzel-icon", { key: '785b664697ba266432c535ea26e0665f8d8d657f', name: this.isExpanded ? 'chevron-up' : 'chevron-down' }))), h("kritzel-color-palette", { key: 'ed2517a39d254b77f45154914b3ce6a934f66c33', colors: this.tool.palette, selectedColor: this.tool.fontColor, isExpanded: this.isExpanded, onColorChange: event => this.handleColorChange(event) }), h("kritzel-font-size", { key: '9b25c9607fa69c991e769852e3e3e378e48387bd', selectedSize: this.tool.fontSize, fontFamily: this.tool.fontFamily, onSizeChange: event => this.handleSizeChange(event) })));
     }
     static get style() { return kritzelControlTextConfigCss; }
-}, [257, "kritzel-control-text-config", {
+}, [769, "kritzel-control-text-config", {
         "tool": [1040],
         "isExpanded": [1028, "is-expanded"]
     }]);
@@ -101,6 +101,6 @@ function defineCustomElement() {
 }
 export { KritzelControlTextConfig as K, defineCustomElement as d };
-//# sourceMappingURL=p-Co5lU_7h.js.map
+//# sourceMappingURL=p-BaHZYvfq.js.map
-//# sourceMappingURL=p-Co5lU_7h.js.map
+//# sourceMappingURL=p-BaHZYvfq.js.map

package/dist/components/{p-Co5lU_7h.js.map → p-BaHZYvfq.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~Co5lU_7h~~.js","mappings":";;;;;;;;;AAAA,MAAM,2BAA2B,GAAG,qTAAqT;;MCQ5U,wBAAwB,iBAAAA,kBAAA,CAAA,MAAA,wBAAA,SAAAC,CAAA,CAAA;;;;;;;;;AACV,IAAA,IAAI;IACJ,UAAU,GAAY,KAAK;AAE3C,IAAA,UAAU;IAEnB,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 }) tool: KritzelTextTool;\r\n @Prop({ mutable: true }) isExpanded: boolean = false;\r\n\r\n @Event() 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-BaHZYvfq.js","mappings":";;;;;;;;;AAAA,MAAM,2BAA2B,GAAG,qTAAqT;;MCQ5U,wBAAwB,iBAAAA,kBAAA,CAAA,MAAA,wBAAA,SAAAC,CAAA,CAAA;;;;;;;;;AACV,IAAA,IAAI;IACJ,UAAU,GAAY,KAAK;AAE3C,IAAA,UAAU;IAEnB,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 }) tool: KritzelTextTool;\r\n @Prop({ mutable: true }) isExpanded: boolean = false;\r\n\r\n @Event() 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}

package/dist/components/{p-BJbN3vca.js → p-BctNMdxr.js} RENAMED Viewed

@@ -1,8 +1,8 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-C9hrbrUN.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-CwkUrTy1.js';
 import { K as KritzelDevicesHelper } from './p-l10It7Nm.js';
-import { d as defineCustomElement$4 } from './p-D27d2rKT.js';
-import { b as defineCustomElement$2, d as defineCustomElement$3 } from './p-DzyZA2GT.js';
-import { d as defineCustomElement$1 } from './p-BEKicPnH.js';
+import { d as defineCustomElement$4 } from './p-Bhtn9qay.js';
+import { d as defineCustomElement$2, a as defineCustomElement$3 } from './p-BQ5cdSqE.js';
+import { d as defineCustomElement$1 } from './p-Dcf7tVJW.js';
 const kritzelSplitButtonCss = ":host{position:relative;display:flex;align-items:center;font-family:sans-serif;z-index:1;padding:var(--kritzel-split-button-padding, 4px);background-color:var(--kritzel-split-button-background-color, #ffffff);border-radius:var(--kritzel-split-button-border-radius, 12px);box-shadow:var(--kritzel-split-button-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));border:var(--kritzel-split-button-border, 1px solid #ebebeb);gap:var(--kritzel-split-button-gap, 4px)}:host(.mobile){--kritzel-split-button-hover-background-color:transparent}button{border:none;background-color:transparent;padding:0;margin:0;font-family:inherit;font-size:inherit;color:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;text-align:center;display:flex;align-items:center;justify-content:center;pointer-events:all;-webkit-tap-highlight-color:transparent}.split-main-button,.split-menu-button{height:auto;display:flex;align-items:center;padding:var(--kritzel-split-button-padding, 8px);background-color:var(--kritzel-split-button-background-color, #ffffff);border-radius:var(--kritzel-split-button-border-radius, 12px);font-size:var(--kritzel-split-button-font-size, 14px)}.split-main-button:hover,.split-menu-button:hover{background-color:var(--kritzel-split-button-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.split-main-button:focus,.split-menu-button:focus{outline:none;background-color:var(--kritzel-split-button-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.split-main-button{gap:var(--kritzel-split-button-gap, 4px)}.split-menu-button{border-left:none;justify-content:center}.split-divider{width:var(--kritzel-split-button-divider-width, 1px);height:24px;background-color:var(--kritzel-split-button-divider-background-color, hsl(0, 0%, 0%, 4.3%))}:disabled{pointer-events:none;opacity:0.5}";
@@ -101,10 +101,10 @@ const KritzelSplitButton = /*@__PURE__*/ proxyCustomElement(class KritzelSplitBu
         this.menuScrollTop = event.target.scrollTop;
     };
     render() {
-        return (h(Host, { key: '4ff7809dd62c1dd60600fda592aeac43cd9bc74c', class: { mobile: this.isTouchDevice } }, h("button", { key: 'db6485fabcffdd75a25d178aca7b653af499a90c', class: "split-main-button", tabIndex: 0, onClick: this.handleButtonClick, disabled: this.mainButtonDisabled }, this.buttonIcon && h("kritzel-icon", { key: '4001a4e23ef53bec2a578310de8c8b593d7b266c', name: this.buttonIcon })), h("div", { key: '8ff86d3c01a48b06afca77dd066518efa3589cb1', class: "split-divider" }), h("button", { key: 'f1c40edbec3756a7f3681de4e8d0f1981dd312a4', ref: el => (this.splitMenuButtonRef = el), class: "split-menu-button", tabIndex: 0, onClick: this.toggleMenu, disabled: this.menuButtonDisabled }, h("kritzel-icon", { key: '0ddb89976632ae7454e66504f8bab3fd5072c252', name: this.dropdownIcon })), h("kritzel-portal", { key: '64531ffd6ac847fd1a99e32aceefea9f18088992', anchor: this.anchorElement, offsetY: 4, onClose: this.closeMenu }, h("kritzel-menu", { key: 'f3b86cb71e5ba39e8f98e26b3669416e2cdb4802', ref: el => (this.menuRef = el), items: this.items, onItemSelect: this.handleItemSelect, onItemSave: this.handleItemSave, onItemCancel: this.handleItemCancel, onItemToggleChildMenu: this.handleItemToggleChildMenu, onItemCloseChildMenu: this.handleItemCloseChildMenu, onClose: this.closeMenu, onScroll: this.handleScroll }))));
+        return (h(Host, { key: 'd18a70b94e3d6860dfac952b26f66e5b96cc6fa0', class: { mobile: this.isTouchDevice } }, h("button", { key: 'ee65221543fd8984f94d0a0b43beb7e1d28411f2', class: "split-main-button", tabIndex: 0, onClick: this.handleButtonClick, disabled: this.mainButtonDisabled }, this.buttonIcon && h("kritzel-icon", { key: '1dbdd1e4db4087564464e9586e91b48f80b88aae', name: this.buttonIcon })), h("div", { key: '78b5e0589e7a3dd0592fb2c1cdaae8732f57b129', class: "split-divider" }), h("button", { key: 'cfc5d53f06485a927608a99ea491e36b0e993fcc', ref: el => (this.splitMenuButtonRef = el), class: "split-menu-button", tabIndex: 0, onClick: this.toggleMenu, disabled: this.menuButtonDisabled }, h("kritzel-icon", { key: '0e141b614cbfc758f01d21908d846d16bdce586d', name: this.dropdownIcon })), h("kritzel-portal", { key: 'b5def34dcfe5cbbf9641b1218af803937d7a77b6', anchor: this.anchorElement, offsetY: 4, onClose: this.closeMenu }, h("kritzel-menu", { key: '695f6c85a8ecd44f74ecf7752bf77d0caac69e6a', ref: el => (this.menuRef = el), items: this.items, onItemSelect: this.handleItemSelect, onItemSave: this.handleItemSave, onItemCancel: this.handleItemCancel, onItemToggleChildMenu: this.handleItemToggleChildMenu, onItemCloseChildMenu: this.handleItemCloseChildMenu, onClose: this.closeMenu, onScroll: this.handleScroll }))));
     }
     static get style() { return kritzelSplitButtonCss; }
-}, [257, "kritzel-split-button", {
+}, [769, "kritzel-split-button", {
         "buttonIcon": [1, "button-icon"],
         "dropdownIcon": [1, "dropdown-icon"],
         "items": [16],
@@ -152,6 +152,6 @@ function defineCustomElement() {
 }
 export { KritzelSplitButton as K, defineCustomElement as d };
-//# sourceMappingURL=p-BJbN3vca.js.map
+//# sourceMappingURL=p-BctNMdxr.js.map
-//# sourceMappingURL=p-BJbN3vca.js.map
+//# sourceMappingURL=p-BctNMdxr.js.map