kritzel-stencil 0.1.1 → 0.1.3

package/dist/types/stencil-public-runtime.d.ts

@@ -673,6 +673,35 @@ export declare function h(sel: any, text: string): VNode;
 export declare function h(sel: any, children: Array<VNode | undefined | null>): VNode;
 export declare function h(sel: any, data: VNodeData | null, text: string): VNode;
 export declare function h(sel: any, data: VNodeData | null, children: Array<VNode | undefined | null>): VNode;
+/**
+ * Automatic JSX runtime functions for TypeScript's react-jsx mode.
+ * These functions are called automatically by TypeScript when using "jsx": "react-jsx".
+ * @param type type of node
+ * @param props properties of node
+ * @param key optional key for the node
+ * @returns a jsx vnode
+ */
+export declare function jsx(type: any, props: any, key?: string): VNode;
+/**
+ * Automatic JSX runtime functions for TypeScript's react-jsxmode with multiple children.
+ * @param type type of node
+ * @param props properties of node
+ * @param key optional key for the node
+ * @returns a jsx vnode
+ */
+export declare function jsxs(type: any, props: any, key?: string): VNode;
+/**
+ * Automatic JSX runtime functions for TypeScript's react-jsxdev mode.
+ * These functions are called automatically by TypeScript when using "jsx": "react-jsxdev".
+ * @param type type of node
+ * @param props properties of node
+ * @param key optional key for the node
+ * @param isStaticChildren indicates if the children are static
+ * @param source source information
+ * @param self reference to the component instance
+ * @returns a jsx vnode
+ */
+export declare function jsxDEV(type: any, props: any, key?: string | number, isStaticChildren?: boolean, source?: any, self?: any): VNode;
 export declare function h(sel: any, data: VNodeData | null, children: VNode): VNode;
 /**
  * A virtual DOM node

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kritzel-stencil",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "description": "Stencil Component Starter",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -42,7 +42,8 @@
     "build": "stencil build",
     "start": "stencil build --dev --watch --serve",
     "test": "stencil test --spec",
-    "test.watch": "stencil test --spec --watchAll",
+    "e2e": "stencil test --e2e --screenshot",
+    "e2e:update-screenshots": "stencil test --e2e --screenshot --update-screenshot",
     "generate": "stencil generate",
     "clean": "rimraf dist .stencil loader node_modules",
     "bump": "npm version patch",
@@ -67,7 +68,7 @@
   },
   "devDependencies": {
     "@stencil/angular-output-target": "^1.1.1",
-    "@stencil/core": "^4.36.3",
+    "@stencil/core": "^4.41.0",
     "@stencil/react-output-target": "^1.2.0",
     "@stencil/vue-output-target": "0.11.8",
     "@types/jest": "^29.5.14",
@@ -75,6 +76,7 @@
     "fake-indexeddb": "^6.2.2",
     "jest": "^29.7.0",
     "jest-cli": "^29.7.0",
+    "jest-jasmine2": "^30.2.0",
     "puppeteer": "^24.6.1",
     "ts-jest": "^29.4.4"
   }

package/dist/collection/components/ui/kritzel-control-brush-config/kritzel-control-brush-config.css

@@ -1,19 +0,0 @@
-:host {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-}
-
-.expand-toggle {
-  background: none;
-  border: none;
-  cursor: var(--kritzel-pointer-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);
-}

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

@@ -1,134 +0,0 @@
-import { Host, h } from "@stencil/core";
-export class KritzelControlBrushConfig {
-    tool;
-    handleToolChange(newTool) {
-        this.palette = newTool.palettes[newTool.type];
-    }
-    isExpanded = false;
-    toolChange;
-    palette = [];
-    componentWillLoad() {
-        this.palette = this.tool.palettes[this.tool.type];
-    }
-    handleToggleExpand() {
-        this.isExpanded = !this.isExpanded;
-    }
-    handleTypeChange(event) {
-        this.palette = this.tool.palettes[event.detail];
-        this.tool.type = event.detail;
-        this.tool.color = this.palette[0];
-        this.toolChange.emit(this.tool);
-    }
-    handleColorChange(event) {
-        this.tool.color = event.detail;
-        this.toolChange.emit(this.tool);
-    }
-    handleSizeChange(event) {
-        this.tool.size = event.detail;
-        this.toolChange.emit(this.tool);
-    }
-    render() {
-        return (h(Host, { key: 'ce2ac77db22f52239a45b62f690d54009f2c6954' }, h("div", { key: '5f6c50853e876c3612bb5c270bccc468c2c9a726', style: {
-                display: 'flex',
-                flexDirection: 'row',
-                alignItems: this.isExpanded ? 'flex-start' : 'center',
-                justifyContent: 'flex-start',
-                width: '100%',
-                gap: '8px',
-            } }, h("kritzel-color-palette", { key: 'bfa24bb8683027c37f200ad65e4e6787d7224c56', colors: this.palette, selectedColor: this.tool.color, isExpanded: this.isExpanded, isOpaque: true, onColorChange: color => this.handleColorChange(color) }), h("button", { key: '8e2c55c6d16ca3911c5f068c354bdce5a4f7e844', class: "expand-toggle", onClick: () => this.handleToggleExpand(), title: this.isExpanded ? 'Collapse' : 'Expand', style: this.palette.length > 6 ? { visibillity: 'visible' } : { visibility: 'hidden' } }, h("kritzel-icon", { key: '33610ada109fe5d1d9cb2da4c70a60d672e3d6cb', name: this.isExpanded ? 'chevron-up' : 'chevron-down' }))), h("kritzel-stroke-size", { key: '9b095dd9436e46dd88a3485ceb2dafa5d06d1bc4', selectedSize: this.tool.size, onSizeChange: event => this.handleSizeChange(event) })));
-    }
-    static get is() { return "kritzel-control-brush-config"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["kritzel-control-brush-config.css"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["kritzel-control-brush-config.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "tool": {
-                "type": "unknown",
-                "mutable": true,
-                "complexType": {
-                    "original": "KritzelBrushTool",
-                    "resolved": "KritzelBrushTool",
-                    "references": {
-                        "KritzelBrushTool": {
-                            "location": "import",
-                            "path": "../../../classes/tools/brush-tool.class",
-                            "id": "src/classes/tools/brush-tool.class.ts::KritzelBrushTool"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false
-            },
-            "isExpanded": {
-                "type": "boolean",
-                "mutable": true,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "is-expanded",
-                "defaultValue": "false"
-            }
-        };
-    }
-    static get states() {
-        return {
-            "palette": {}
-        };
-    }
-    static get events() {
-        return [{
-                "method": "toolChange",
-                "name": "toolChange",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "KritzelBrushTool",
-                    "resolved": "KritzelBrushTool",
-                    "references": {
-                        "KritzelBrushTool": {
-                            "location": "import",
-                            "path": "../../../classes/tools/brush-tool.class",
-                            "id": "src/classes/tools/brush-tool.class.ts::KritzelBrushTool"
-                        }
-                    }
-                }
-            }];
-    }
-    static get watchers() {
-        return [{
-                "propName": "tool",
-                "methodName": "handleToolChange"
-            }];
-    }
-}

package/dist/collection/components/ui/kritzel-control-text-config/kritzel-control-text-config.css

@@ -1,19 +0,0 @@
-:host {
-  display: block;
-  flex-direction: column;
-  width: 100%;
-}
-
-.expand-toggle {
-  background: none;
-  border: none;
-  cursor: var(--kritzel-pointer-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);
-}

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

@@ -1,114 +0,0 @@
-import { Host, h } from "@stencil/core";
-export class KritzelControlTextConfig {
-    tool;
-    isExpanded = false;
-    toolChange;
-    handleToggleExpand() {
-        this.isExpanded = !this.isExpanded;
-    }
-    handleFamilyChange(event) {
-        this.tool.fontFamily = event.detail;
-        this.toolChange.emit(this.tool);
-    }
-    handleColorChange(event) {
-        this.tool.fontColor = event.detail;
-        this.toolChange.emit(this.tool);
-    }
-    handleSizeChange(event) {
-        this.tool.fontSize = event.detail;
-        this.toolChange.emit(this.tool);
-    }
-    render() {
-        return (h(Host, { key: '4a0027969b183fef77c374eb114d9d30104e5ad7' }, h("div", { key: '9f49eb3a95080447b938fdfeb256fafbe5ff9ddc', style: {
-                display: 'flex',
-                flexDirection: 'row',
-                alignItems: 'center',
-                justifyContent: 'flex-start',
-                width: '100%',
-                gap: '8px',
-            } }, h("kritzel-font-family", { key: '4e75cda048f8b8c04e6cb5568e7cdcde91e28112', selectedFontFamily: this.tool.fontFamily, onFontFamilyChange: event => this.handleFamilyChange(event) }), h("button", { key: '05c6ce98bd700e9e9d2e676cbcf191b943a2980e', class: "expand-toggle", onClick: () => this.handleToggleExpand(), title: this.isExpanded ? 'Collapse' : 'Expand', tabindex: "0" }, h("kritzel-icon", { key: 'ce30d48dd5ce5eefeee7702dff81ca8f96e0872d', name: this.isExpanded ? 'chevron-up' : 'chevron-down' }))), h("kritzel-color-palette", { key: 'a3d313bf01dafc15c8cf39a129d8c0c35741a3ca', colors: this.tool.palette, selectedColor: this.tool.fontColor, isExpanded: this.isExpanded, onColorChange: event => this.handleColorChange(event) }), h("kritzel-font-size", { key: '954db891b80fb244083de24dc87255b1239ff913', selectedSize: this.tool.fontSize, fontFamily: this.tool.fontFamily, onSizeChange: event => this.handleSizeChange(event) })));
-    }
-    static get is() { return "kritzel-control-text-config"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["kritzel-control-text-config.css"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["kritzel-control-text-config.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "tool": {
-                "type": "unknown",
-                "mutable": true,
-                "complexType": {
-                    "original": "KritzelTextTool",
-                    "resolved": "KritzelTextTool",
-                    "references": {
-                        "KritzelTextTool": {
-                            "location": "import",
-                            "path": "../../../classes/tools/text-tool.class",
-                            "id": "src/classes/tools/text-tool.class.ts::KritzelTextTool"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false
-            },
-            "isExpanded": {
-                "type": "boolean",
-                "mutable": true,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "is-expanded",
-                "defaultValue": "false"
-            }
-        };
-    }
-    static get events() {
-        return [{
-                "method": "toolChange",
-                "name": "toolChange",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "KritzelTextTool",
-                    "resolved": "KritzelTextTool",
-                    "references": {
-                        "KritzelTextTool": {
-                            "location": "import",
-                            "path": "../../../classes/tools/text-tool.class",
-                            "id": "src/classes/tools/text-tool.class.ts::KritzelTextTool"
-                        }
-                    }
-                }
-            }];
-    }
-}

package/dist/components/kritzel-control-brush-config.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface KritzelControlBrushConfig extends Components.KritzelControlBrushConfig, HTMLElement {}
-export const KritzelControlBrushConfig: {
-    prototype: KritzelControlBrushConfig;
-    new (): KritzelControlBrushConfig;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

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

@@ -1 +0,0 @@
-import{K as o,d as s}from"./p-CeKT_dTd.js";const d=o,p=s;export{d as KritzelControlBrushConfig,p as defineCustomElement}

package/dist/components/kritzel-control-text-config.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface KritzelControlTextConfig extends Components.KritzelControlTextConfig, HTMLElement {}
-export const KritzelControlTextConfig: {
-    prototype: KritzelControlTextConfig;
-    new (): KritzelControlTextConfig;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

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

@@ -1 +0,0 @@
-import{K as o,d as r}from"./p-C3UriJh7.js";const s=o,p=r;export{s as KritzelControlTextConfig,p as defineCustomElement}

package/dist/components/p-BXaWhpO2.js

@@ -1 +0,0 @@
-import{p as e,H as t,c as s,h as i,d as r,t as o}from"./p-Bj_Og27M.js";import{d as n}from"./p-C4krHoUl.js";const l=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.sizeChange=s(this,"sizeChange")}sizes=[8,10,12,16,20,24];selectedSize=null;fontFamily="Arial";sizeChange;handleSizeClick(e){this.selectedSize=e,this.sizeChange.emit(e)}handleKeyDown(e,t){"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),this.handleSizeClick(t))}render(){return i(r,{key:"b0ee1ab0eb5e1871f7726d4393aea59f63264ec5"},this.sizes.map((e=>i("div",{tabIndex:0,class:{"size-container":!0,selected:this.selectedSize===e},onClick:()=>this.handleSizeClick(e),onKeyDown:t=>this.handleKeyDown(t,e)},i("kritzel-font",{fontFamily:this.fontFamily,size:e})))))}static get style(){return":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:var(--kritzel-pointer-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)}"}},[513,"kritzel-font-size",{sizes:[16],selectedSize:[1026,"selected-size"],fontFamily:[1,"font-family"]}]);function a(){"undefined"!=typeof customElements&&["kritzel-font-size","kritzel-font"].forEach((e=>{switch(e){case"kritzel-font-size":customElements.get(o(e))||customElements.define(o(e),l);break;case"kritzel-font":customElements.get(o(e))||n()}}))}export{l as K,a as d}

package/dist/components/p-BtuXeItZ.js

@@ -1 +0,0 @@
-import{p as t,H as o,c as i,h as s,d as e,t as n}from"./p-Bj_Og27M.js";import{K as l}from"./p-C6qB08BS.js";const r=t(class extends o{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.tooltipClosed=i(this,"tooltipClosed")}get host(){return this}isVisible=!1;anchorElement;offsetY=24;tooltipClosed;positionX=0;positionY=0;handleOutsideClick(t){this.isVisible&&(this.host.contains(t.target)||this.tooltipClosed.emit())}handleWindowResize(){this.calculateAdjustedPosition()}async focusContent(){const t=l.getFocusableElements(this.host);t.length>0&&t[0].focus()}componentDidLoad(){this.focusSlottedContent()}componentWillLoad(){this.calculateAdjustedPosition()}componentWillUpdate(){this.calculateAdjustedPosition()}focusSlottedContent(){const t=this.host.shadowRoot?.querySelector("slot"),o=t?.assignedElements()||[];o.length>0&&o[0].focus()}calculateAdjustedPosition(){if(this.isVisible&&this.anchorElement){const t=this.anchorElement.getBoundingClientRect(),o=this.host.shadowRoot?.querySelector(".tooltip-content"),i=o?.getBoundingClientRect(),s=i?.width||0,e=12,n=window.innerWidth-s-e;this.positionX=Math.max(e,Math.min(t.left+t.width/2-s/2,n)),this.positionY=window.innerHeight-t.top+this.offsetY}}render(){return s(e,{key:"c257f254b8ba6b95f251eac3136f5be282d23e30",style:{position:"fixed",zIndex:"9999",transition:"opacity 0.3s ease-in-out, transform 0.3s ease-in-out",visibility:this.isVisible?"visible":"hidden",left:`${this.positionX}px`,bottom:`${this.positionY}px`}},s("div",{key:"14f31dc995236a2309e2371ecef278a0e6374139",class:"tooltip-content",onClick:t=>t.stopPropagation()},s("slot",{key:"6dace4d6ed82878333f8771cf4670d53cea36873"})))}static get style(){return":host{width:auto}.tooltip-content{position:relative;padding:8px 12px;border-radius:4px;width:fit-content;background-color:var(--kritzel-controls-tooltip-background-color, #ffffff);color:var(--kritzel-controls-tooltip-color, #000000);padding:var(--kritzel-controls-tooltip-padding, 8px);border-radius:var(--kritzel-controls-tooltip-border-radius, 16px);white-space:nowrap;box-shadow:var(--kritzel-controls-tooltip-box-shadow, 0 1px 6px rgba(0, 0, 0, 0.12))}"}},[769,"kritzel-tooltip",{isVisible:[4,"is-visible"],anchorElement:[16],offsetY:[2,"offset-y"],positionX:[32],positionY:[32],focusContent:[64]},[[4,"click","handleOutsideClick"],[9,"resize","handleWindowResize"]]]);function a(){"undefined"!=typeof customElements&&["kritzel-tooltip"].forEach((t=>{"kritzel-tooltip"===t&&(customElements.get(n(t))||customElements.define(n(t),r))}))}export{r as K,a as d}

package/dist/components/p-C-d2IH4v.js

@@ -1 +0,0 @@
-import{p as t,H as e,c as o,h as l,d as a,t as n}from"./p-Bj_Og27M.js";import{d as r}from"./p-g0N9j_uT.js";const s=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.fontFamilyChange=o(this,"fontFamilyChange")}fontOptions=[{value:"arial",label:"Arial"},{value:"verdana",label:"Verdana"},{value:"helvetica",label:"Helvetica"},{value:"tahoma",label:"Tahoma"},{value:"trebuchet ms",label:"Trebuchet MS"},{value:"times new roman",label:"Times New Roman"},{value:"georgia",label:"Georgia"},{value:"garamond",label:"Garamond"},{value:"courier new",label:"Courier New"},{value:"brush script mt",label:"Brush Script MT"}];selectedFontFamily;fontFamilyChange;componentWillLoad(){if(this.fontOptions&&this.fontOptions.length>0){const t=this.fontOptions.some((t=>t.value===this.selectedFontFamily));this.selectedFontFamily&&t||(this.selectedFontFamily=this.fontOptions[0].value)}}handleDropdownValueChange=t=>{this.fontFamilyChange.emit(t.detail)};render(){const t=this.fontOptions.map((t=>({value:t.value,label:t.label,style:{fontFamily:t.value}})));return l(a,{key:"74f27d2d9f73ee8589448a24bed64e885ef6d2d8"},l("kritzel-dropdown",{key:"58abc26a54b124f253841faaa4ca4227a23baac2",options:t,value:this.selectedFontFamily,onValueChanged:this.handleDropdownValueChange,selectStyles:{fontFamily:this.selectedFontFamily}}))}static get style(){return":host{display:flex;align-items:flex-start;gap:8px;padding:8px;box-sizing:border-box;width:100%}.font-style-button{display:flex;justify-content:center;align-items:center;width:42px;height:32px;padding:0;border:none;outline:none;background:none;cursor:var(--kritzel-pointer-cursor, pointer);border-radius:0;color:var(--control-text-color);font-weight:bold;-webkit-tap-highlight-color:transparent}.font-style-button:not(:last-child){border-right:1px solid #333333}.font-style-button:hover{background-color:var(--control-hover-bg)}.font-style-button:active{background-color:var(--control-active-bg)}.font-style-button.selected,.font-style-button.selected:hover,.font-style-button.selected:active{background-color:var(--control-selected-bg);color:var(--control-selected-color)}.font-style-button.italic-text{font-style:italic}"}},[513,"kritzel-font-family",{fontOptions:[16],selectedFontFamily:[1025,"selected-font-family"]}]);function i(){"undefined"!=typeof customElements&&["kritzel-font-family","kritzel-dropdown"].forEach((t=>{switch(t){case"kritzel-font-family":customElements.get(n(t))||customElements.define(n(t),s);break;case"kritzel-dropdown":customElements.get(n(t))||r()}}))}export{s as K,i as d}

package/dist/components/p-C3UriJh7.js

@@ -1 +0,0 @@
-import{p as e,H as t,c as o,h as s,d as i,t as l}from"./p-Bj_Og27M.js";import{d as r}from"./p-CXzfYQ_u.js";import{d as a}from"./p-Du1vxHy8.js";import{d as n}from"./p-g0N9j_uT.js";import{d as c}from"./p-C4krHoUl.js";import{d}from"./p-C-d2IH4v.js";import{d as f}from"./p-BXaWhpO2.js";import{d as h}from"./p-DTezr6w9.js";const p=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.toolChange=o(this,"toolChange")}tool;isExpanded=!1;toolChange;handleToggleExpand(){this.isExpanded=!this.isExpanded}handleFamilyChange(e){this.tool.fontFamily=e.detail,this.toolChange.emit(this.tool)}handleColorChange(e){this.tool.fontColor=e.detail,this.toolChange.emit(this.tool)}handleSizeChange(e){this.tool.fontSize=e.detail,this.toolChange.emit(this.tool)}render(){return s(i,{key:"4a0027969b183fef77c374eb114d9d30104e5ad7"},s("div",{key:"9f49eb3a95080447b938fdfeb256fafbe5ff9ddc",style:{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"flex-start",width:"100%",gap:"8px"}},s("kritzel-font-family",{key:"4e75cda048f8b8c04e6cb5568e7cdcde91e28112",selectedFontFamily:this.tool.fontFamily,onFontFamilyChange:e=>this.handleFamilyChange(e)}),s("button",{key:"05c6ce98bd700e9e9d2e676cbcf191b943a2980e",class:"expand-toggle",onClick:()=>this.handleToggleExpand(),title:this.isExpanded?"Collapse":"Expand",tabindex:"0"},s("kritzel-icon",{key:"ce30d48dd5ce5eefeee7702dff81ca8f96e0872d",name:this.isExpanded?"chevron-up":"chevron-down"}))),s("kritzel-color-palette",{key:"a3d313bf01dafc15c8cf39a129d8c0c35741a3ca",colors:this.tool.palette,selectedColor:this.tool.fontColor,isExpanded:this.isExpanded,onColorChange:e=>this.handleColorChange(e)}),s("kritzel-font-size",{key:"954db891b80fb244083de24dc87255b1239ff913",selectedSize:this.tool.fontSize,fontFamily:this.tool.fontFamily,onSizeChange:e=>this.handleSizeChange(e)}))}static get style(){return":host{display:block;flex-direction:column;width:100%}.expand-toggle{background:none;border:none;cursor:var(--kritzel-pointer-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)}"}},[513,"kritzel-control-text-config",{tool:[1040],isExpanded:[1028,"is-expanded"]}]);function m(){"undefined"!=typeof customElements&&["kritzel-control-text-config","kritzel-color","kritzel-color-palette","kritzel-dropdown","kritzel-font","kritzel-font-family","kritzel-font-size","kritzel-icon"].forEach((e=>{switch(e){case"kritzel-control-text-config":customElements.get(l(e))||customElements.define(l(e),p);break;case"kritzel-color":customElements.get(l(e))||r();break;case"kritzel-color-palette":customElements.get(l(e))||a();break;case"kritzel-dropdown":customElements.get(l(e))||n();break;case"kritzel-font":customElements.get(l(e))||c();break;case"kritzel-font-family":customElements.get(l(e))||d();break;case"kritzel-font-size":customElements.get(l(e))||f();break;case"kritzel-icon":customElements.get(l(e))||h()}}))}export{p as K,m as d}

package/dist/components/p-CF5L2Gdl.js

@@ -1 +0,0 @@
-import{p as e,H as s,c as r,h as t,d as i,t as o}from"./p-Bj_Og27M.js";import{d as c}from"./p-CXzfYQ_u.js";const l=e(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.sizeChange=r(this,"sizeChange")}sizes=[4,6,8,12,16,24];selectedSize=null;sizeChange;handleSizeClick(e){this.selectedSize=e,this.sizeChange.emit(e)}render(){return t(i,{key:"d204d14384367ca8847ad30cab9801788c8d8fac"},this.sizes.map((e=>t("div",{tabIndex:0,class:{"size-container":!0,selected:this.selectedSize===e},onClick:()=>this.handleSizeClick(e)},t("kritzel-color",{value:"#000000",size:e})))))}static get style(){return":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:var(--kritzel-pointer-cursor, pointer);border:2px solid transparent;box-sizing:border-box}.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)}"}},[513,"kritzel-stroke-size",{sizes:[16],selectedSize:[1026,"selected-size"]}]);function n(){"undefined"!=typeof customElements&&["kritzel-stroke-size","kritzel-color"].forEach((e=>{switch(e){case"kritzel-stroke-size":customElements.get(o(e))||customElements.define(o(e),l);break;case"kritzel-color":customElements.get(o(e))||c()}}))}export{l as K,n as d}

package/dist/components/p-CeKT_dTd.js

@@ -1 +0,0 @@
-import{p as e,H as t,c as o,h as s,d as i,t as l}from"./p-Bj_Og27M.js";import{d as r}from"./p-CXzfYQ_u.js";import{d as a}from"./p-Du1vxHy8.js";import{d as n}from"./p-DTezr6w9.js";import{d as c}from"./p-CF5L2Gdl.js";const d=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.toolChange=o(this,"toolChange")}tool;handleToolChange(e){this.palette=e.palettes[e.type]}isExpanded=!1;toolChange;palette=[];componentWillLoad(){this.palette=this.tool.palettes[this.tool.type]}handleToggleExpand(){this.isExpanded=!this.isExpanded}handleTypeChange(e){this.palette=this.tool.palettes[e.detail],this.tool.type=e.detail,this.tool.color=this.palette[0],this.toolChange.emit(this.tool)}handleColorChange(e){this.tool.color=e.detail,this.toolChange.emit(this.tool)}handleSizeChange(e){this.tool.size=e.detail,this.toolChange.emit(this.tool)}render(){return s(i,{key:"ce2ac77db22f52239a45b62f690d54009f2c6954"},s("div",{key:"5f6c50853e876c3612bb5c270bccc468c2c9a726",style:{display:"flex",flexDirection:"row",alignItems:this.isExpanded?"flex-start":"center",justifyContent:"flex-start",width:"100%",gap:"8px"}},s("kritzel-color-palette",{key:"bfa24bb8683027c37f200ad65e4e6787d7224c56",colors:this.palette,selectedColor:this.tool.color,isExpanded:this.isExpanded,isOpaque:!0,onColorChange:e=>this.handleColorChange(e)}),s("button",{key:"8e2c55c6d16ca3911c5f068c354bdce5a4f7e844",class:"expand-toggle",onClick:()=>this.handleToggleExpand(),title:this.isExpanded?"Collapse":"Expand",style:this.palette.length>6?{visibillity:"visible"}:{visibility:"hidden"}},s("kritzel-icon",{key:"33610ada109fe5d1d9cb2da4c70a60d672e3d6cb",name:this.isExpanded?"chevron-up":"chevron-down"}))),s("kritzel-stroke-size",{key:"9b095dd9436e46dd88a3485ceb2dafa5d06d1bc4",selectedSize:this.tool.size,onSizeChange:e=>this.handleSizeChange(e)}))}static get watchers(){return{tool:[{handleToolChange:0}]}}static get style(){return":host{display:flex;flex-direction:column;width:100%}.expand-toggle{background:none;border:none;cursor:var(--kritzel-pointer-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)}"}},[513,"kritzel-control-brush-config",{tool:[1040],isExpanded:[1028,"is-expanded"],palette:[32]},void 0,{tool:[{handleToolChange:0}]}]);function h(){"undefined"!=typeof customElements&&["kritzel-control-brush-config","kritzel-color","kritzel-color-palette","kritzel-icon","kritzel-stroke-size"].forEach((e=>{switch(e){case"kritzel-control-brush-config":customElements.get(l(e))||customElements.define(l(e),d);break;case"kritzel-color":customElements.get(l(e))||r();break;case"kritzel-color-palette":customElements.get(l(e))||a();break;case"kritzel-icon":customElements.get(l(e))||n();break;case"kritzel-stroke-size":customElements.get(l(e))||c()}}))}export{d as K,h as d}