kritzel-stencil 0.0.76 → 0.0.78

package/dist/cjs/loader.cjs.js

@@ -5,7 +5,7 @@ var index = require('./index-BUKRdCPx.js');
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await index.globalScripts();
-  return index.bootstrapLazy([["kritzel-dummy.cjs",[[1,"kritzel-dummy"]]],["kritzel-brush-style_18.cjs",[[0,"kritzel-editor",{"controls":[16],"customSvgIcons":[16,"custom-svg-icons"],"hideControls":[4,"hide-controls"],"forceUpdate":[32]},[[0,"dblclick","handleTouchStart"]]],[1,"kritzel-controls",{"controls":[16],"activeControl":[1040,"active-control"],"firstConfig":[32],"tooltipVisible":[32],"forceUpdate":[32]},[[4,"activeToolChange","handleActiveToolChange"],[4,"click","handleClick"]]],[1,"kritzel-engine",{"activeTool":[16,"active-tool"],"globalContextMenuItems":[16,"global-context-menu-items"],"objectContextMenuItems":[16,"object-context-menu-items"],"forceUpdate":[32],"registerTool":[64],"changeActiveTool":[64],"setFocus":[64],"disable":[64],"enable":[64],"delete":[64],"copy":[64],"paste":[64],"moveToTop":[64],"moveToBottom":[64],"selectAllInViewport":[64],"undo":[64],"redo":[64],"hideContextMenu":[64]},[[0,"contextmenu","handleContextMenu"],[1,"mousedown","handleMouseDown"],[1,"mousemove","handleMouseMove"],[1,"mouseup","handleMouseUp"],[0,"dblclick","handleDoubleClick"],[0,"doubletap","handleDoubleTap"],[0,"touchstart","handleTouchStart"],[0,"touchmove","handleTouchMove"],[0,"touchend","handleTouchEnd"],[0,"touchcancel","handleTouchCancel"],[0,"wheel","handleWheel"],[9,"resize","handleResize"],[8,"keydown","handleKeyDown"],[8,"keyup","handleKeyUp"],[9,"mousedown","updateFocus"]]],[1,"kritzel-control-text-config",{"tool":[1040],"isExpanded":[1028,"is-expanded"]}],[1,"kritzel-control-brush-config",{"tool":[1040],"isExpanded":[1028,"is-expanded"],"palette":[32]},null,{"tool":["handleToolChange"]}],[1,"kritzel-context-menu",{"items":[16]}],[1,"kritzel-utility-panel"],[1,"kritzel-cursor-trail",{"cursorTrailPoints":[32],"isLeftButtonDown":[32]},[[9,"mousedown","handleMouseDown"],[9,"mousemove","handleMouseMove"],[9,"mouseup","handleMouseUp"],[9,"touchstart","handleTouchStart"],[9,"touchmove","handleTouchMove"],[9,"touchend","handleTouchEnd"]]],[1,"kritzel-tooltip",{"isVisible":[4,"is-visible"],"anchorElement":[16,"anchor-element"],"arrowSize":[2,"arrow-size"],"offsetY":[2,"offset-y"],"positionX":[32],"arrowOffset":[32],"isMobileView":[32]},[[9,"resize","handleWindowResize"]]],[1,"kritzel-brush-style",{"type":[1],"brushOptions":[16,"brush-options"]}],[1,"kritzel-font-family",{"fontOptions":[16,"font-options"],"selectedFontFamily":[1025,"selected-font-family"]}],[1,"kritzel-font-size",{"sizes":[16],"selectedSize":[1026,"selected-size"],"fontFamily":[1,"font-family"]}],[1,"kritzel-stroke-size",{"sizes":[16],"selectedSize":[1026,"selected-size"]}],[1,"kritzel-color-palette",{"colors":[16],"selectedColor":[1025,"selected-color"],"isExpanded":[4,"is-expanded"],"isOpaque":[4,"is-opaque"]}],[1,"kritzel-font",{"fontFamily":[1,"font-family"],"size":[2],"color":[1]}],[1,"kritzel-color",{"value":[1],"size":[2]}],[1,"kritzel-dropdown",{"options":[16],"value":[1],"width":[1],"selectStyles":[8,"select-styles"],"internalValue":[32],"hasSuffixContent":[32],"hasPrefixContent":[32]},null,{"value":["externalValueChanged"],"options":["optionsChanged"]}],[1,"kritzel-icon",{"name":[1],"label":[1],"size":[2]}]]]], options);
+  return index.bootstrapLazy([["kritzel-brush-style_19.cjs",[[1,"kritzel-editor",{"controls":[16],"customSvgIcons":[16,"custom-svg-icons"],"hideControls":[4,"hide-controls"],"forceUpdate":[32]},[[0,"dblclick","handleTouchStart"]]],[1,"kritzel-controls",{"controls":[16],"activeControl":[1040,"active-control"],"firstConfig":[32],"tooltipVisible":[32],"forceUpdate":[32]},[[4,"activeToolChange","handleActiveToolChange"],[4,"click","handleClick"]]],[1,"kritzel-engine",{"activeTool":[16,"active-tool"],"globalContextMenuItems":[16,"global-context-menu-items"],"objectContextMenuItems":[16,"object-context-menu-items"],"forceUpdate":[32],"registerTool":[64],"changeActiveTool":[64],"setFocus":[64],"disable":[64],"enable":[64],"delete":[64],"copy":[64],"paste":[64],"moveToTop":[64],"moveToBottom":[64],"selectAllInViewport":[64],"undo":[64],"redo":[64],"hideContextMenu":[64]},[[0,"contextmenu","handleContextMenu"],[1,"mousedown","handleMouseDown"],[1,"mousemove","handleMouseMove"],[1,"mouseup","handleMouseUp"],[0,"dblclick","handleDoubleClick"],[0,"doubletap","handleDoubleTap"],[0,"touchstart","handleTouchStart"],[0,"touchmove","handleTouchMove"],[0,"touchend","handleTouchEnd"],[0,"touchcancel","handleTouchCancel"],[0,"wheel","handleWheel"],[9,"resize","handleResize"],[8,"keydown","handleKeyDown"],[8,"keyup","handleKeyUp"],[9,"mousedown","updateFocus"]]],[1,"kritzel-dummy"],[1,"kritzel-control-text-config",{"tool":[1040],"isExpanded":[1028,"is-expanded"]}],[1,"kritzel-control-brush-config",{"tool":[1040],"isExpanded":[1028,"is-expanded"],"palette":[32]},null,{"tool":["handleToolChange"]}],[1,"kritzel-context-menu",{"items":[16]}],[1,"kritzel-utility-panel"],[1,"kritzel-cursor-trail",{"cursorTrailPoints":[32],"isLeftButtonDown":[32]},[[9,"mousedown","handleMouseDown"],[9,"mousemove","handleMouseMove"],[9,"mouseup","handleMouseUp"],[9,"touchstart","handleTouchStart"],[9,"touchmove","handleTouchMove"],[9,"touchend","handleTouchEnd"]]],[1,"kritzel-tooltip",{"isVisible":[4,"is-visible"],"anchorElement":[16,"anchor-element"],"arrowSize":[2,"arrow-size"],"offsetY":[2,"offset-y"],"positionX":[32],"arrowOffset":[32],"isMobileView":[32]},[[9,"resize","handleWindowResize"]]],[1,"kritzel-brush-style",{"type":[1],"brushOptions":[16,"brush-options"]}],[1,"kritzel-font-family",{"fontOptions":[16,"font-options"],"selectedFontFamily":[1025,"selected-font-family"]}],[1,"kritzel-font-size",{"sizes":[16],"selectedSize":[1026,"selected-size"],"fontFamily":[1,"font-family"]}],[1,"kritzel-stroke-size",{"sizes":[16],"selectedSize":[1026,"selected-size"]}],[1,"kritzel-color-palette",{"colors":[16],"selectedColor":[1025,"selected-color"],"isExpanded":[4,"is-expanded"],"isOpaque":[4,"is-opaque"]}],[1,"kritzel-font",{"fontFamily":[1,"font-family"],"size":[2],"color":[1]}],[1,"kritzel-color",{"value":[1],"size":[2]}],[1,"kritzel-dropdown",{"options":[16],"value":[1],"width":[1],"selectStyles":[8,"select-styles"],"internalValue":[32],"hasSuffixContent":[32],"hasPrefixContent":[32]},null,{"value":["externalValueChanged"],"options":["optionsChanged"]}],[1,"kritzel-icon",{"name":[1],"label":[1],"size":[2]}]]]], options);
 };
 
 exports.setNonce = index.setNonce;

package/dist/cjs/stencil.cjs.js

@@ -18,7 +18,7 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await index.globalScripts();
-  return index.bootstrapLazy([["kritzel-dummy.cjs",[[1,"kritzel-dummy"]]],["kritzel-brush-style_18.cjs",[[0,"kritzel-editor",{"controls":[16],"customSvgIcons":[16,"custom-svg-icons"],"hideControls":[4,"hide-controls"],"forceUpdate":[32]},[[0,"dblclick","handleTouchStart"]]],[1,"kritzel-controls",{"controls":[16],"activeControl":[1040,"active-control"],"firstConfig":[32],"tooltipVisible":[32],"forceUpdate":[32]},[[4,"activeToolChange","handleActiveToolChange"],[4,"click","handleClick"]]],[1,"kritzel-engine",{"activeTool":[16,"active-tool"],"globalContextMenuItems":[16,"global-context-menu-items"],"objectContextMenuItems":[16,"object-context-menu-items"],"forceUpdate":[32],"registerTool":[64],"changeActiveTool":[64],"setFocus":[64],"disable":[64],"enable":[64],"delete":[64],"copy":[64],"paste":[64],"moveToTop":[64],"moveToBottom":[64],"selectAllInViewport":[64],"undo":[64],"redo":[64],"hideContextMenu":[64]},[[0,"contextmenu","handleContextMenu"],[1,"mousedown","handleMouseDown"],[1,"mousemove","handleMouseMove"],[1,"mouseup","handleMouseUp"],[0,"dblclick","handleDoubleClick"],[0,"doubletap","handleDoubleTap"],[0,"touchstart","handleTouchStart"],[0,"touchmove","handleTouchMove"],[0,"touchend","handleTouchEnd"],[0,"touchcancel","handleTouchCancel"],[0,"wheel","handleWheel"],[9,"resize","handleResize"],[8,"keydown","handleKeyDown"],[8,"keyup","handleKeyUp"],[9,"mousedown","updateFocus"]]],[1,"kritzel-control-text-config",{"tool":[1040],"isExpanded":[1028,"is-expanded"]}],[1,"kritzel-control-brush-config",{"tool":[1040],"isExpanded":[1028,"is-expanded"],"palette":[32]},null,{"tool":["handleToolChange"]}],[1,"kritzel-context-menu",{"items":[16]}],[1,"kritzel-utility-panel"],[1,"kritzel-cursor-trail",{"cursorTrailPoints":[32],"isLeftButtonDown":[32]},[[9,"mousedown","handleMouseDown"],[9,"mousemove","handleMouseMove"],[9,"mouseup","handleMouseUp"],[9,"touchstart","handleTouchStart"],[9,"touchmove","handleTouchMove"],[9,"touchend","handleTouchEnd"]]],[1,"kritzel-tooltip",{"isVisible":[4,"is-visible"],"anchorElement":[16,"anchor-element"],"arrowSize":[2,"arrow-size"],"offsetY":[2,"offset-y"],"positionX":[32],"arrowOffset":[32],"isMobileView":[32]},[[9,"resize","handleWindowResize"]]],[1,"kritzel-brush-style",{"type":[1],"brushOptions":[16,"brush-options"]}],[1,"kritzel-font-family",{"fontOptions":[16,"font-options"],"selectedFontFamily":[1025,"selected-font-family"]}],[1,"kritzel-font-size",{"sizes":[16],"selectedSize":[1026,"selected-size"],"fontFamily":[1,"font-family"]}],[1,"kritzel-stroke-size",{"sizes":[16],"selectedSize":[1026,"selected-size"]}],[1,"kritzel-color-palette",{"colors":[16],"selectedColor":[1025,"selected-color"],"isExpanded":[4,"is-expanded"],"isOpaque":[4,"is-opaque"]}],[1,"kritzel-font",{"fontFamily":[1,"font-family"],"size":[2],"color":[1]}],[1,"kritzel-color",{"value":[1],"size":[2]}],[1,"kritzel-dropdown",{"options":[16],"value":[1],"width":[1],"selectStyles":[8,"select-styles"],"internalValue":[32],"hasSuffixContent":[32],"hasPrefixContent":[32]},null,{"value":["externalValueChanged"],"options":["optionsChanged"]}],[1,"kritzel-icon",{"name":[1],"label":[1],"size":[2]}]]]], options);
+  return index.bootstrapLazy([["kritzel-brush-style_19.cjs",[[1,"kritzel-editor",{"controls":[16],"customSvgIcons":[16,"custom-svg-icons"],"hideControls":[4,"hide-controls"],"forceUpdate":[32]},[[0,"dblclick","handleTouchStart"]]],[1,"kritzel-controls",{"controls":[16],"activeControl":[1040,"active-control"],"firstConfig":[32],"tooltipVisible":[32],"forceUpdate":[32]},[[4,"activeToolChange","handleActiveToolChange"],[4,"click","handleClick"]]],[1,"kritzel-engine",{"activeTool":[16,"active-tool"],"globalContextMenuItems":[16,"global-context-menu-items"],"objectContextMenuItems":[16,"object-context-menu-items"],"forceUpdate":[32],"registerTool":[64],"changeActiveTool":[64],"setFocus":[64],"disable":[64],"enable":[64],"delete":[64],"copy":[64],"paste":[64],"moveToTop":[64],"moveToBottom":[64],"selectAllInViewport":[64],"undo":[64],"redo":[64],"hideContextMenu":[64]},[[0,"contextmenu","handleContextMenu"],[1,"mousedown","handleMouseDown"],[1,"mousemove","handleMouseMove"],[1,"mouseup","handleMouseUp"],[0,"dblclick","handleDoubleClick"],[0,"doubletap","handleDoubleTap"],[0,"touchstart","handleTouchStart"],[0,"touchmove","handleTouchMove"],[0,"touchend","handleTouchEnd"],[0,"touchcancel","handleTouchCancel"],[0,"wheel","handleWheel"],[9,"resize","handleResize"],[8,"keydown","handleKeyDown"],[8,"keyup","handleKeyUp"],[9,"mousedown","updateFocus"]]],[1,"kritzel-dummy"],[1,"kritzel-control-text-config",{"tool":[1040],"isExpanded":[1028,"is-expanded"]}],[1,"kritzel-control-brush-config",{"tool":[1040],"isExpanded":[1028,"is-expanded"],"palette":[32]},null,{"tool":["handleToolChange"]}],[1,"kritzel-context-menu",{"items":[16]}],[1,"kritzel-utility-panel"],[1,"kritzel-cursor-trail",{"cursorTrailPoints":[32],"isLeftButtonDown":[32]},[[9,"mousedown","handleMouseDown"],[9,"mousemove","handleMouseMove"],[9,"mouseup","handleMouseUp"],[9,"touchstart","handleTouchStart"],[9,"touchmove","handleTouchMove"],[9,"touchend","handleTouchEnd"]]],[1,"kritzel-tooltip",{"isVisible":[4,"is-visible"],"anchorElement":[16,"anchor-element"],"arrowSize":[2,"arrow-size"],"offsetY":[2,"offset-y"],"positionX":[32],"arrowOffset":[32],"isMobileView":[32]},[[9,"resize","handleWindowResize"]]],[1,"kritzel-brush-style",{"type":[1],"brushOptions":[16,"brush-options"]}],[1,"kritzel-font-family",{"fontOptions":[16,"font-options"],"selectedFontFamily":[1025,"selected-font-family"]}],[1,"kritzel-font-size",{"sizes":[16],"selectedSize":[1026,"selected-size"],"fontFamily":[1,"font-family"]}],[1,"kritzel-stroke-size",{"sizes":[16],"selectedSize":[1026,"selected-size"]}],[1,"kritzel-color-palette",{"colors":[16],"selectedColor":[1025,"selected-color"],"isExpanded":[4,"is-expanded"],"isOpaque":[4,"is-opaque"]}],[1,"kritzel-font",{"fontFamily":[1,"font-family"],"size":[2],"color":[1]}],[1,"kritzel-color",{"value":[1],"size":[2]}],[1,"kritzel-dropdown",{"options":[16],"value":[1],"width":[1],"selectStyles":[8,"select-styles"],"internalValue":[32],"hasSuffixContent":[32],"hasPrefixContent":[32]},null,{"value":["externalValueChanged"],"options":["optionsChanged"]}],[1,"kritzel-icon",{"name":[1],"label":[1],"size":[2]}]]]], options);
 });
 
 exports.setNonce = index.setNonce;

package/dist/collection/components/core/kritzel-editor/kritzel-editor.css

@@ -1,4 +1,4 @@
-kritzel-editor {
+:host {
   display: flex;
   margin: 0;
   position: relative;
@@ -75,7 +75,23 @@ kritzel-editor {
   --kritzel-engine-background-color: #ffffff;
 }
 
-kritzel-controls {
+.dummy-top {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 16px;
+  z-index: 1;
+}
+
+.dummy-bottom {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: 16px;
+  z-index: 1;
+}
+
+kritzel-controls{
   position: absolute;
   left: 50%;
   transform: translateX(-50%);

package/dist/collection/components/core/kritzel-editor/kritzel-editor.js

@@ -35,9 +35,12 @@ export class KritzelEditor {
         }
     }
     render() {
-        return (h(Host, { key: '1498c131b352144fbe99d0cadcf3de1eef794aff' }, h("kritzel-engine", { key: '65aa62cd9bd11f42c6bb460f943af8fb7832fae9', onEngineReady: () => this.handleEngineReady() }), h("kritzel-controls", { key: 'ec8b22b47b369b76580e7d164bda28b4fed538c2', controls: this.controls, onControlsReady: () => this.handleControlsReady(), style: this.hideControls ? { display: 'none' } : {} })));
+        return (h(Host, { key: '37e291c25a636b65cc751799cfe57de216a14990' }, h("kritzel-dummy", { key: '5b3b3e9c6baf1885a85f749f674ca257fa9f109e', class: "dummy-top" }), h("kritzel-engine", { key: '11ec65ad0858d842c472b829667c1be7086d92b1', onEngineReady: () => this.handleEngineReady() }), h("kritzel-dummy", { key: 'c3e3586692f5f8340aa34cd8b04e7ac1fbd7401b', class: "dummy-bottom" }), h("kritzel-controls", { key: '3f999492eeabe6e3179027753138099d387aa541', controls: this.controls, onControlsReady: () => this.handleControlsReady(), style: {
+                visibility: 'hidden'
+            } })));
     }
     static get is() { return "kritzel-editor"; }
+    static get encapsulation() { return "shadow"; }
     static get originalStyleUrls() {
         return {
             "$": ["kritzel-editor.css"]

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

@@ -1 +1 @@
-{"version":3,"file":"kritzel-editor.js","sourceRoot":"","sources":["../../../../src/components/core/kritzel-editor/kritzel-editor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACxE,OAAO,EAAE,mBAAmB,EAAE,MAAM,sCAAsC,CAAC;AAE3E,OAAO,EAAE,wBAAwB,EAAE,MAAM,2CAA2C,CAAC;AAOrF,MAAM,OAAO,aAAa;IAL1B;QAOE,aAAQ,GAA4B,wBAAwB,CAAC;QAG7D,mBAAc,GAA2B,EAAE,CAAC;QAG5C,iBAAY,GAAY,KAAK,CAAC;QAG9B,gBAAW,GAAW,CAAC,CAAC;QAEhB,gBAAW,GAAY,KAAK,CAAC;QAE7B,kBAAa,GAAY,KAAK,CAAC;KA6CxC;IA1CC,gBAAgB,CAAC,KAAiB;QAChC,IAAI,KAAK,CAAC,UAAU,EAAE,CAAC;YACrB,KAAK,CAAC,cAAc,EAAE,CAAC;QACzB,CAAC;IACH,CAAC;IAED,iBAAiB;QACf,KAAK,MAAM,CAAC,IAAI,EAAE,GAAG,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,cAAc,CAAC,EAAE,CAAC;YAC9D,mBAAmB,CAAC,QAAQ,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;QAC1C,CAAC;IACH,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;QACxB,IAAI,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAED,mBAAmB;QACjB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;QAC1B,IAAI,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAED,cAAc;QACZ,IAAI,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC;YAC3C,OAAO,CAAC,IAAI,CAAC,wBAAwB,CAAC,CAAC;YACvC,IAAI,CAAC,WAAW,EAAE,CAAC;QACrB,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,uEAAgB,aAAa,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,iBAAiB,EAAE,GAAmB;YAEhF,yEACE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,eAAe,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,mBAAmB,EAAE,EACjD,KAAK,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,GACjC,CACf,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Listen, Prop, State, h } from '@stencil/core';\r\nimport { KritzelIconRegistry } from '../../../classes/icon-registry.class';\r\nimport { KritzelToolbarControl } from '../../../interfaces/toolbar-control.interface';\r\nimport { DEFAULT_KRITZEL_CONTROLS } from '../../../configs/default-toolbar-controls';\r\n\r\n@Component({\r\n  tag: 'kritzel-editor',\r\n  styleUrl: 'kritzel-editor.css',\r\n  shadow: false,\r\n})\r\nexport class KritzelEditor {\r\n  @Prop()\r\n  controls: KritzelToolbarControl[] = DEFAULT_KRITZEL_CONTROLS;\r\n\r\n  @Prop()\r\n  customSvgIcons: Record<string, string> = {};\r\n\r\n  @Prop()\r\n  hideControls: boolean = false;\r\n\r\n  @State()\r\n  forceUpdate: number = 0;\r\n\r\n  private engineReady: boolean = false;\r\n\r\n  private controlsReady: boolean = false;\r\n\r\n  @Listen('dblclick', { passive: false })\r\n  handleTouchStart(event: TouchEvent) {\r\n    if (event.cancelable) {\r\n      event.preventDefault();\r\n    }\r\n  }\r\n\r\n  componentWillLoad() {\r\n    for (const [name, svg] of Object.entries(this.customSvgIcons)) {\r\n      KritzelIconRegistry.register(name, svg);\r\n    }\r\n  }\r\n\r\n  handleEngineReady() {\r\n    this.engineReady = true;\r\n    this.checkReadiness();\r\n  }\r\n\r\n  handleControlsReady() {\r\n    this.controlsReady = true;\r\n    this.checkReadiness();\r\n  }\r\n\r\n  checkReadiness() {\r\n    if (this.engineReady && this.controlsReady) {\r\n      console.info('KritzelEditor is ready');\r\n      this.forceUpdate++;\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host>\r\n        <kritzel-engine onEngineReady={() => this.handleEngineReady()}></kritzel-engine>\r\n\r\n        <kritzel-controls\r\n          controls={this.controls}\r\n          onControlsReady={() => this.handleControlsReady()}\r\n          style={this.hideControls ? { display: 'none' } : {}}\r\n        ></kritzel-controls>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"kritzel-editor.js","sourceRoot":"","sources":["../../../../src/components/core/kritzel-editor/kritzel-editor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACxE,OAAO,EAAE,mBAAmB,EAAE,MAAM,sCAAsC,CAAC;AAE3E,OAAO,EAAE,wBAAwB,EAAE,MAAM,2CAA2C,CAAC;AAOrF,MAAM,OAAO,aAAa;IAL1B;QAOE,aAAQ,GAA4B,wBAAwB,CAAC;QAG7D,mBAAc,GAA2B,EAAE,CAAC;QAG5C,iBAAY,GAAY,KAAK,CAAC;QAG9B,gBAAW,GAAW,CAAC,CAAC;QAEhB,gBAAW,GAAY,KAAK,CAAC;QAE7B,kBAAa,GAAY,KAAK,CAAC;KAoDxC;IAjDC,gBAAgB,CAAC,KAAiB;QAChC,IAAI,KAAK,CAAC,UAAU,EAAE,CAAC;YACrB,KAAK,CAAC,cAAc,EAAE,CAAC;QACzB,CAAC;IACH,CAAC;IAED,iBAAiB;QACf,KAAK,MAAM,CAAC,IAAI,EAAE,GAAG,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,cAAc,CAAC,EAAE,CAAC;YAC9D,mBAAmB,CAAC,QAAQ,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;QAC1C,CAAC;IACH,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;QACxB,IAAI,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAED,mBAAmB;QACjB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;QAC1B,IAAI,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAED,cAAc;QACZ,IAAI,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC;YAC3C,OAAO,CAAC,IAAI,CAAC,wBAAwB,CAAC,CAAC;YACvC,IAAI,CAAC,WAAW,EAAE,CAAC;QACrB,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YAEH,sEAAe,KAAK,EAAC,WAAW,GAAiB;YAEjD,uEAAgB,aAAa,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,iBAAiB,EAAE,GAAmB;YAEhF,sEAAe,KAAK,EAAC,cAAc,GAAiB;YAEpD,yEACE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,eAAe,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,mBAAmB,EAAE,EACjD,KAAK,EAAE;oBACL,UAAU,EAAE,QAAQ;iBACrB,GACiB,CACf,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Listen, Prop, State, h } from '@stencil/core';\r\nimport { KritzelIconRegistry } from '../../../classes/icon-registry.class';\r\nimport { KritzelToolbarControl } from '../../../interfaces/toolbar-control.interface';\r\nimport { DEFAULT_KRITZEL_CONTROLS } from '../../../configs/default-toolbar-controls';\r\n\r\n@Component({\r\n  tag: 'kritzel-editor',\r\n  styleUrl: 'kritzel-editor.css',\r\n  shadow: true,\r\n})\r\nexport class KritzelEditor {\r\n  @Prop()\r\n  controls: KritzelToolbarControl[] = DEFAULT_KRITZEL_CONTROLS;\r\n\r\n  @Prop()\r\n  customSvgIcons: Record<string, string> = {};\r\n\r\n  @Prop()\r\n  hideControls: boolean = false;\r\n\r\n  @State()\r\n  forceUpdate: number = 0;\r\n\r\n  private engineReady: boolean = false;\r\n\r\n  private controlsReady: boolean = false;\r\n\r\n  @Listen('dblclick', { passive: false })\r\n  handleTouchStart(event: TouchEvent) {\r\n    if (event.cancelable) {\r\n      event.preventDefault();\r\n    }\r\n  }\r\n\r\n  componentWillLoad() {\r\n    for (const [name, svg] of Object.entries(this.customSvgIcons)) {\r\n      KritzelIconRegistry.register(name, svg);\r\n    }\r\n  }\r\n\r\n  handleEngineReady() {\r\n    this.engineReady = true;\r\n    this.checkReadiness();\r\n  }\r\n\r\n  handleControlsReady() {\r\n    this.controlsReady = true;\r\n    this.checkReadiness();\r\n  }\r\n\r\n  checkReadiness() {\r\n    if (this.engineReady && this.controlsReady) {\r\n      console.info('KritzelEditor is ready');\r\n      this.forceUpdate++;\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host>\r\n\r\n        <kritzel-dummy class=\"dummy-top\"></kritzel-dummy>\r\n\r\n        <kritzel-engine onEngineReady={() => this.handleEngineReady()}></kritzel-engine>\r\n\r\n        <kritzel-dummy class=\"dummy-bottom\"></kritzel-dummy>\r\n\r\n        <kritzel-controls\r\n          controls={this.controls}\r\n          onControlsReady={() => this.handleControlsReady()}\r\n          style={{\r\n            visibility: 'hidden'\r\n          }}\r\n        ></kritzel-controls>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/components/shared/kritzel-color/kritzel-color.js

@@ -29,13 +29,13 @@ export class KritzelColor {
     }
     render() {
         const isColorVeryLight = this.isLightColor(this.value);
-        return (h(Host, { key: 'e913815994a30d97f92781e742c4a13de19e59fe' }, h("div", { key: 'e0cc40b10dcb298f5b86be7d4283d6bffbd08c2c', class: "checkerboard-bg", style: {
+        return (h(Host, { key: '6771c3aac90292a82070af08b995fdf297061bc1' }, h("div", { key: '4bb3e10fee1566db56f8a727dc858351e8a4184f', class: "checkerboard-bg", style: {
                 width: `${this.size}px`,
                 height: `${this.size}px`,
                 borderRadius: '50%',
                 display: 'inline-block',
                 position: 'relative',
-            } }, h("div", { key: '5e0a092a6d3463d852a1760d125fba04494e0d90', class: {
+            } }, h("div", { key: '290f49b17b686482057d3492752217e35af85d81', class: {
                 'color-circle': true,
                 'white': isColorVeryLight,
             }, style: {

package/dist/collection/components/shared/kritzel-color-palette/kritzel-color-palette.js

@@ -20,7 +20,7 @@ export class KritzelColorPalette {
     render() {
         const displayedColors = this.isExpanded ? this.colors : this.colors.slice(0, 6);
         const expandedHeight = this.isExpanded ? this.calculateHeight() : '32px';
-        return (h(Host, { key: '0f0d176e1c8b199a973dbdb23b84e4a8d4d57f59' }, h("div", { key: '1d4707cdb30752d21a5058dbbef5fb32934bd3bd', class: {
+        return (h(Host, { key: 'e3e89140f833e336a3e0c299c1e9c9d4cad21fdb' }, h("div", { key: '019b62ab59cf468fc497ba0f6b429b844bcc4584', class: {
                 'color-grid': true,
                 'expanded': this.isExpanded,
             }, style: {

package/dist/collection/components/shared/kritzel-font/kritzel-font.js

@@ -6,7 +6,7 @@ export class KritzelFont {
         this.color = '#000000';
     }
     render() {
-        return (h(Host, { key: '6f25832892d8042464751360cc9e2307193f5407' }, h("div", { key: '3d2ec48a6a3b3e347c8cc1ab6f129bfacd984776', class: "font-preview", style: {
+        return (h(Host, { key: '4e952fbcaea52c332a72cda1ba6fc060696aa107' }, h("div", { key: 'db371b9552eceb53470b2bbd964c9c31578bb7e1', class: "font-preview", style: {
                 fontFamily: this.fontFamily,
                 fontSize: `${this.size}px`,
                 color: this.color

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

@@ -10,7 +10,7 @@ export class KritzelFontSize {
         this.sizeChange.emit(size);
     }
     render() {
-        return (h(Host, { key: '20ad8f22858732c62838693c7b135dc92dbc5910' }, this.sizes.map(size => (h("div", { class: {
+        return (h(Host, { key: '2cd69fb4d291f46121f2f05acd44153d4fe51801' }, 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 }))))));

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

@@ -9,7 +9,7 @@ export class KritzelStrokeSize {
         this.sizeChange.emit(size);
     }
     render() {
-        return (h(Host, { key: '2e2a4d38920e25e1e60788deabe4912b510d0b10' }, this.sizes.map(size => (h("div", { class: {
+        return (h(Host, { key: '9738591d397c522c72d9744bbb7e0ff7f6976175' }, this.sizes.map(size => (h("div", { class: {
                 'size-container': true,
                 'selected': this.selectedSize === size,
             }, onClick: () => this.handleSizeClick(size) }, h("kritzel-color", { value: '#000000', size: size }))))));

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

@@ -37,23 +37,23 @@ export class KritzelTooltip {
         }
     }
     render() {
-        return (h(Host, { key: '30db4852719464fcb9c6964c34992e87a364caa3', style: {
+        return (h(Host, { key: 'a8c55d66efd76aeea390e7a5bdb05dbdb1e35bd2', style: {
                 position: 'fixed',
                 zIndex: '9999',
                 transition: 'opacity 0.3s ease-in-out, transform 0.3s ease-in-out',
                 visibility: this.isVisible ? 'visible' : 'hidden',
                 left: !this.isMobileView ? `${this.positionX}px` : '50%',
                 marginBottom: `${this.offsetY + this.arrowSize}px`,
-            } }, h("div", { key: '3f270c9bdb1a5282f67034618123a5d61f9f8b40', class: "tooltip-content", onClick: event => event.stopPropagation() }, h("slot", { key: 'bd4a11782eb2e263f21a8ab57ad64eb4fd4fe7ec' }), h("div", { key: '4ede173979b8e0335fb3a012b662a694dc09ea28', class: "tooltip-arrow-wrapper", style: {
+            } }, h("div", { key: '5d3ad02c4885e9ee3dc55a7358357bb224ae102e', class: "tooltip-content", onClick: event => event.stopPropagation() }, h("slot", { key: '767fb0dbf8fa9a63d184f601d28536fbff677a02' }), h("div", { key: '30c0bdd69f56cab6b94fb0f4290de370d990c500', class: "tooltip-arrow-wrapper", style: {
                 position: 'fixed',
                 left: this.arrowOffset,
                 bottom: `-${this.arrowSize * 2}px`,
-            } }, h("div", { key: '8bf67c5383b53ac908b1d0865cf2ffe9cadf3fd6', class: "tooltip-arrow", style: {
+            } }, h("div", { key: '2d2197a52e69477308ae7591446b4ca20635e0bc', class: "tooltip-arrow", style: {
                 borderLeft: `${this.arrowSize}px solid transparent`,
                 borderRight: `${this.arrowSize}px solid transparent`,
                 borderTop: `${this.arrowSize}px solid var(--kritzel-controls-tooltip-background-color)`,
                 filter: 'drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2))',
-            } }), h("div", { key: '0991da16ce655de3f9a798b1da9ddb3e8e399487', class: "tooltip-arrow-rect", style: {
+            } }), h("div", { key: 'fa932ba1b6b242455c85fbf13b51c58c53ad3e9a', class: "tooltip-arrow-rect", style: {
                 position: 'relative',
                 width: `${this.arrowSize * 2}px`,
                 height: `${this.arrowSize}px`,

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

@@ -28,14 +28,14 @@ export class KritzelControlBrushConfig {
         this.toolChange.emit(this.tool);
     }
     render() {
-        return (h(Host, { key: '1658cc6062f9a62c11a7011e36bd5f892653f691' }, h("div", { key: 'bfafd20ebc6f7541e6a0952b555e3aefd0524086', style: {
+        return (h(Host, { key: '57c18e06633951d2d82006d5b28cf863e9414bf4' }, h("div", { key: '6e4666f8efb3f1c9f1b1c8362119d2eababcc314', style: {
                 display: 'flex',
                 flexDirection: 'row',
                 alignItems: 'center',
                 justifyContent: 'flex-start',
                 width: '100%',
                 gap: '8px',
-            } }, h("kritzel-brush-style", { key: '6530b0fbee10db66f6dfd0e482e2a95279f303eb', type: this.tool.type, onTypeChange: event => this.handleTypeChange(event) }), h("button", { key: 'f16a4c5aefb298228d29576d6bf8a0632301169d', class: "expand-toggle", onClick: () => this.handleToggleExpand(), title: this.isExpanded ? 'Collapse' : 'Expand', style: this.palette.length > 6 ? { visibillity: 'visible' } : { visibility: 'hidden' } }, h("kritzel-icon", { key: '138726189ee12b0d15dedfdbd07019701712ea3b', name: this.isExpanded ? 'chevron-up' : 'chevron-down' }))), h("kritzel-color-palette", { key: 'ca15a07a28ad955d49289299265e1b62da508cfd', colors: this.palette, selectedColor: this.tool.color, isExpanded: this.isExpanded, isOpaque: true, onColorChange: color => this.handleColorChange(color) }), h("kritzel-stroke-size", { key: '1017df7a36bad69af055fe08e685a1be3ff48b4b', selectedSize: this.tool.size, onSizeChange: event => this.handleSizeChange(event) })));
+            } }, h("kritzel-brush-style", { key: 'b52b7f8d0a64c0f973fbfbf35aad04c4b17b2b57', type: this.tool.type, onTypeChange: event => this.handleTypeChange(event) }), h("button", { key: 'e74f649d44e94e45668aa335935e4c3e05888a85', class: "expand-toggle", onClick: () => this.handleToggleExpand(), title: this.isExpanded ? 'Collapse' : 'Expand', style: this.palette.length > 6 ? { visibillity: 'visible' } : { visibility: 'hidden' } }, h("kritzel-icon", { key: '457c7b47b45ac62e696e69459b9674d8679e6736', name: this.isExpanded ? 'chevron-up' : 'chevron-down' }))), h("kritzel-color-palette", { key: '3914791059ff9215c082315a4c52170b88cb0908', colors: this.palette, selectedColor: this.tool.color, isExpanded: this.isExpanded, isOpaque: true, onColorChange: color => this.handleColorChange(color) }), h("kritzel-stroke-size", { key: '51e8a2080cf27e08b060f099ed4696b352e3d10c', selectedSize: this.tool.size, onSizeChange: event => this.handleSizeChange(event) })));
     }
     static get is() { return "kritzel-control-brush-config"; }
     static get encapsulation() { return "shadow"; }

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

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

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

@@ -18,45 +18,46 @@ export class KritzelControls {
         var _a;
         return (_a = this.activeControl) === null || _a === void 0 ? void 0 : _a.tool;
     }
-    // async componentDidLoad() {
-    //   console.log('KritzelControls componentDidLoad');
-    //   this.forceUpdate++;
-    //   this.controlsReady.emit();
-    //   this.initializeEngine().then(() => {
-    //     this.initializeTools()
-    //       .then(() => {
-    //         console.info('KritzelControls initialized with tools:', this.controls);
-    //         this.forceUpdate++;
-    //       })
-    //       .catch(error => {
-    //         console.error('Error initializing tools:', error);
-    //       });
-    //   });
-    // }
-    // private async initializeEngine() {
-    //   this.kritzelEngine = this.host.parentElement.querySelector('kritzel-engine');
-    //   if (!this.kritzelEngine) {
-    //     throw new Error('kritzel-engine not found in parent element.');
-    //   }
-    // }
-    // private async initializeTools() {
-    //   for (const c of this.controls) {
-    //     if (c.type === 'tool' && c.tool) {
-    //       c.tool = await this.kritzelEngine.registerTool(c.name, c.tool, c.config);
-    //     }
-    //     if (c.type === 'tool' && c.isDefault && c.tool) {
-    //       await this.kritzelEngine.changeActiveTool(c.tool as KritzelBaseTool);
-    //       this.activeControl = c;
-    //     }
-    //     if (c.type === 'config') {
-    //       if (this.firstConfig === null) {
-    //         this.firstConfig = c;
-    //       } else {
-    //         console.warn('Only one config control is allowed. The first one will be used.');
-    //       }
-    //     }
-    //   }
-    // }
+    async componentDidLoad() {
+        console.log('KritzelControls componentDidLoad');
+        this.forceUpdate++;
+        this.controlsReady.emit();
+        this.initializeEngine().then(() => {
+            this.initializeTools()
+                .then(() => {
+                console.info('KritzelControls initialized with tools:', this.controls);
+                this.forceUpdate++;
+            })
+                .catch(error => {
+                console.error('Error initializing tools:', error);
+            });
+        });
+    }
+    async initializeEngine() {
+        this.kritzelEngine = this.host.parentElement.querySelector('kritzel-engine');
+        if (!this.kritzelEngine) {
+            throw new Error('kritzel-engine not found in parent element.');
+        }
+    }
+    async initializeTools() {
+        for (const c of this.controls) {
+            if (c.type === 'tool' && c.tool) {
+                c.tool = await this.kritzelEngine.registerTool(c.name, c.tool, c.config);
+            }
+            if (c.type === 'tool' && c.isDefault && c.tool) {
+                await this.kritzelEngine.changeActiveTool(c.tool);
+                this.activeControl = c;
+            }
+            if (c.type === 'config') {
+                if (this.firstConfig === null) {
+                    this.firstConfig = c;
+                }
+                else {
+                    console.warn('Only one config control is allowed. The first one will be used.');
+                }
+            }
+        }
+    }
     async handleActiveToolChange(event) {
         var _a;
         this.activeControl = this.controls.find(control => control.tool === event.detail) || null;
@@ -94,11 +95,11 @@ export class KritzelControls {
     render() {
         var _a, _b;
         const hasNoConfig = ((_a = this.activeControl) === null || _a === void 0 ? void 0 : _a.config) === undefined || ((_b = this.activeControl) === null || _b === void 0 ? void 0 : _b.config) === null;
-        return (h(Host, { key: 'e17295147adc548fc3051cafe5625a8f87474c3b' }, h("kritzel-utility-panel", { key: 'b8e715a2534b2750f31f5fe5f311528f64c1c013', style: {
+        return (h(Host, { key: 'b2ccafa0e74d1a036f1bfd0fb994bd5aa746401d' }, h("kritzel-utility-panel", { key: '585a8058b22015956b11df13614e8acf721be969', style: {
                 position: 'absolute',
                 bottom: '56px',
                 left: '12px',
-            }, onUndo: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.undo(); }, onRedo: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.redo(); }, onDelete: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.delete(); } }), h("div", { key: 'c82659049cc0a55659159ad393c603759c25c2d3', class: "kritzel-controls" }, this.controls.map(control => {
+            }, onUndo: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.undo(); }, onRedo: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.redo(); }, onDelete: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.delete(); } }), h("div", { key: '56238089b382ba65f6951ee841bdb1cd36159b31', class: "kritzel-controls" }, this.controls.map(control => {
             var _a, _b, _c, _d, _e, _f, _g, _h;
             if (control.type === 'tool') {
                 return (h("button", { class: {

package/dist/collection/components/ui/kritzel-controls/kritzel-controls.js.map

@@ -1 +1 @@
-{"version":3,"file":"kritzel-controls.js","sourceRoot":"","sources":["../../../../src/components/ui/kritzel-controls/kritzel-controls.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AACtG,OAAO,EAAE,gBAAgB,EAAE,MAAM,yCAAyC,CAAC;AAC3E,OAAO,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAC;AAYzE,MAAM,OAAO,eAAe;IAN5B;QAQE,aAAQ,GAA4B,EAAE,CAAC;QAGvC,kBAAa,GAAiC,IAAI,CAAC;QASnD,gBAAW,GAAsB,IAAI,CAAC;QAGtC,mBAAc,GAAY,KAAK,CAAC;QAGhC,gBAAW,GAAW,CAAC,CAAC;QAExB,kBAAa,GAAoC,IAAI,CAAC;KAgMvD;IA9LC,IAAI,oBAAoB;;QACtB,OAAO,MAAA,IAAI,CAAC,aAAa,0CAAE,IAAuB,CAAC;IACrD,CAAC;IAED,IAAI,qBAAqB;;QACvB,OAAO,MAAA,IAAI,CAAC,aAAa,0CAAE,IAAwB,CAAC;IACtD,CAAC;IAED,6BAA6B;IAC7B,qDAAqD;IACrD,wBAAwB;IACxB,+BAA+B;IAC/B,yCAAyC;IACzC,6BAA6B;IAC7B,sBAAsB;IACtB,kFAAkF;IAClF,8BAA8B;IAC9B,WAAW;IACX,0BAA0B;IAC1B,6DAA6D;IAC7D,YAAY;IACZ,QAAQ;IACR,IAAI;IAEJ,qCAAqC;IACrC,kFAAkF;IAElF,+BAA+B;IAC/B,sEAAsE;IACtE,MAAM;IACN,IAAI;IAEJ,oCAAoC;IACpC,qCAAqC;IACrC,yCAAyC;IACzC,kFAAkF;IAClF,QAAQ;IAER,wDAAwD;IACxD,8EAA8E;IAC9E,gCAAgC;IAChC,QAAQ;IAER,iCAAiC;IACjC,yCAAyC;IACzC,gCAAgC;IAChC,iBAAiB;IACjB,2FAA2F;IAC3F,UAAU;IACV,QAAQ;IACR,MAAM;IACN,IAAI;IAGJ,KAAK,CAAC,sBAAsB,CAAC,KAAkB;;QAC7C,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,OAAO,CAAC,IAAI,KAAK,KAAK,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC;QAC1F,MAAM,CAAA,MAAA,IAAI,CAAC,aAAa,0CAAE,QAAQ,EAAE,CAAA,CAAC;IACvC,CAAC;IAGD,WAAW,CAAC,KAAiB;QAC3B,MAAM,OAAO,GAAG,KAAK,CAAC,MAAqB,CAAC;QAE5C,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,OAAO,CAAC,OAAO,CAAC,kBAAkB,CAAC,EAAE,CAAC;YAC/D,OAAO;QACT,CAAC;QAED,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;QAC5B,IAAI,CAAC,aAAa,CAAC,MAAM,EAAE,CAAC;IAC9B,CAAC;IAED,cAAc,CAAC,KAAY;QACzB,IAAI,KAAK,CAAC,UAAU,EAAE,CAAC;YACrB,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,KAAK,CAAC,eAAe,EAAE,CAAC;QAC1B,CAAC;IACH,CAAC;IAED,KAAK,CAAC,kBAAkB,CAAC,OAA8B;QACrD,IAAI,CAAC,aAAa,GAAG,OAAO,CAAC;QAE7B,IAAI,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;YACvC,MAAM,IAAI,CAAC,aAAa,CAAC,gBAAgB,CAAC,IAAI,CAAC,aAAa,CAAC,IAAuB,CAAC,CAAC;QACxF,CAAC;IACH,CAAC;IAED,iBAAiB,CAAC,KAAiB;QACjC,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,IAAI,CAAC,cAAc,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC;QAC3C,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,CAAC;IAC/B,CAAC;IAED,KAAK,CAAC,gBAAgB,CAAC,KAAkB;QACvC,IAAI,CAAC,aAAa,mCAAQ,IAAI,CAAC,aAAa,KAAE,IAAI,EAAE,KAAK,CAAC,MAAM,GAAE,CAAC;QACnE,MAAM,IAAI,CAAC,aAAa,CAAC,gBAAgB,CAAE,IAAI,CAAC,aAAqB,CAAC,IAAI,CAAC,CAAC;IAC9E,CAAC;IAED,MAAM;;QACJ,MAAM,WAAW,GAAG,CAAA,MAAA,IAAI,CAAC,aAAa,0CAAE,MAAM,MAAK,SAAS,IAAI,CAAA,MAAA,IAAI,CAAC,aAAa,0CAAE,MAAM,MAAK,IAAI,CAAC;QAEpG,OAAO,CACL,EAAC,IAAI;YACH,8EACE,KAAK,EAAE;oBACL,QAAQ,EAAE,UAAU;oBACpB,MAAM,EAAE,MAAM;oBACd,IAAI,EAAE,MAAM;iBACb,EACD,MAAM,EAAE,GAAG,EAAE,WAAC,OAAA,MAAA,IAAI,CAAC,aAAa,0CAAE,IAAI,EAAE,CAAA,EAAA,EACxC,MAAM,EAAE,GAAG,EAAE,WAAC,OAAA,MAAA,IAAI,CAAC,aAAa,0CAAE,IAAI,EAAE,CAAA,EAAA,EACxC,QAAQ,EAAE,GAAG,EAAE,WAAC,OAAA,MAAA,IAAI,CAAC,aAAa,0CAAE,MAAM,EAAE,CAAA,EAAA,GACrB;YAEzB,4DAAK,KAAK,EAAC,kBAAkB,IAC1B,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;;gBAC3B,IAAI,OAAO,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;oBAC5B,OAAO,CACL,cACE,KAAK,EAAE;4BACL,iBAAiB,EAAE,IAAI;4BACvB,UAAU,EAAE,CAAA,MAAA,IAAI,CAAC,aAAa,0CAAE,IAAI,OAAK,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI,CAAA;yBACvD,EACD,GAAG,EAAE,OAAO,CAAC,IAAI,EACjB,OAAO,EAAE,MAAM,CAAC,EAAE,WAAC,OAAA,MAAA,IAAI,CAAC,kBAAkB,qDAAG,OAAO,CAAC,CAAA,EAAA;wBAErD,oBAAc,IAAI,EAAE,OAAO,CAAC,IAAI,GAAiB,CAC1C,CACV,CAAC;gBACJ,CAAC;gBAED,IAAI,OAAO,CAAC,IAAI,KAAK,SAAS,EAAE,CAAC;oBAC/B,OAAO,WAAK,KAAK,EAAC,iBAAiB,EAAC,GAAG,EAAE,OAAO,CAAC,IAAI,GAAQ,CAAC;gBAChE,CAAC;gBAED,IAAI,OAAO,CAAC,IAAI,KAAK,QAAQ,IAAI,OAAO,CAAC,IAAI,MAAK,MAAA,IAAI,CAAC,WAAW,0CAAE,IAAI,CAAA,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC;oBAC/F,OAAO,CACL,WAAK,KAAK,EAAC,0BAA0B,EAAC,GAAG,EAAE,OAAO,CAAC,IAAI;wBACrD,uBAAiB,SAAS,EAAE,IAAI,CAAC,cAAc,EAAE,aAAa,EAAE,MAAA,IAAI,CAAC,IAAI,CAAC,UAAU,0CAAE,aAAa,CAAC,2BAA2B,CAAgB;4BAC7I,WAAK,KAAK,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE;gCAC3C,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,OAAO,IAAI,CACtC,oCAA8B,IAAI,EAAE,IAAI,CAAC,qBAAqB,EAAE,YAAY,EAAE,KAAK,CAAC,EAAE,WAAC,OAAA,MAAA,IAAI,CAAC,gBAAgB,qDAAG,KAAK,CAAC,CAAA,EAAA,GAAiC,CACvJ;gCAEA,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,MAAM,IAAI,CACrC,mCAA6B,IAAI,EAAE,IAAI,CAAC,oBAAoB,EAAE,YAAY,EAAE,KAAK,CAAC,EAAE,WAAC,OAAA,MAAA,IAAI,CAAC,gBAAgB,qDAAG,KAAK,CAAC,CAAA,EAAA,GAAgC,CACpJ,CACG,CACU;wBAElB,WACE,KAAK,EAAC,gBAAgB,EACtB,OAAO,EAAE,KAAK,CAAC,EAAE,WAAC,OAAA,MAAA,IAAI,CAAC,iBAAiB,qDAAG,KAAK,CAAC,CAAA,EAAA,EACjD,KAAK,EAAE;gCACL,MAAM,EAAE,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;gCACzD,aAAa,EAAE,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;6BAC7C;4BAEA,IAAI,CAAC,aAAa,CAAC,IAAI,YAAY,gBAAgB,IAAI,CACtD,WAAK,KAAK,EAAC,iBAAiB;gCAC1B,qBACE,KAAK,EAAE,MAAA,IAAI,CAAC,qBAAqB,0CAAE,KAAK,EACxC,IAAI,EAAE,MAAA,IAAI,CAAC,qBAAqB,0CAAE,IAAI,EACtC,KAAK,EAAE;wCACL,YAAY,EAAE,KAAK;wCACnB,MAAM,EAAE,MAAM;qCACf,GACc,CACb,CACP;4BAEA,IAAI,CAAC,aAAa,CAAC,IAAI,YAAY,eAAe,IAAI,CACrD,WAAK,KAAK,EAAC,gBAAgB;gCACzB,oBACE,UAAU,EAAE,MAAA,IAAI,CAAC,oBAAoB,0CAAE,UAAU,EACjD,IAAI,EAAE,MAAA,IAAI,CAAC,oBAAoB,0CAAE,QAAQ,EACzC,KAAK,EAAE,MAAA,IAAI,CAAC,oBAAoB,0CAAE,SAAS,GAC7B,CACZ,CACP;4BAEA,WAAW,IAAI,WAAK,KAAK,EAAC,WAAW,GAAO,CACzC,CACF,CACP,CAAC;gBACJ,CAAC;YACH,CAAC,CAAC,CACE,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Element, Host, Listen, Event, EventEmitter } from '@stencil/core';\r\nimport { KritzelBrushTool } from '../../../classes/tools/brush-tool.class';\r\nimport { KritzelTextTool } from '../../../classes/tools/text-tool.class';\r\nimport { KritzelToolbarControl } from '../../../interfaces/toolbar-control.interface';\r\nimport { KritzelBaseTool } from '../../../classes/tools/base-tool.class';\r\n\r\ntype ToolConfig = Record<string, any>;\r\n\r\n@Component({\r\n  tag: 'kritzel-controls',\r\n  styleUrl: 'kritzel-controls.css',\r\n  shadow: true,\r\n  assetsDirs: ['../assets'],\r\n})\r\nexport class KritzelControls {\r\n  @Prop()\r\n  controls: KritzelToolbarControl[] = [];\r\n\r\n  @Prop({ mutable: true })\r\n  activeControl: KritzelToolbarControl | null = null;\r\n\r\n  @Event()\r\n  controlsReady: EventEmitter<void>;\r\n\r\n  @Element()\r\n  host!: HTMLElement;\r\n\r\n  @State()\r\n  firstConfig: ToolConfig | null = null;\r\n\r\n  @State()\r\n  tooltipVisible: boolean = false;\r\n\r\n  @State()\r\n  forceUpdate: number = 0;\r\n\r\n  kritzelEngine: HTMLKritzelEngineElement | null = null;\r\n\r\n  get activeToolAsTextTool() {\r\n    return this.activeControl?.tool as KritzelTextTool;\r\n  }\r\n\r\n  get activeToolAsBrushTool() {\r\n    return this.activeControl?.tool as KritzelBrushTool;\r\n  }\r\n\r\n  // async componentDidLoad() {\r\n  //   console.log('KritzelControls componentDidLoad');\r\n  //   this.forceUpdate++;\r\n  //   this.controlsReady.emit();\r\n  //   this.initializeEngine().then(() => {\r\n  //     this.initializeTools()\r\n  //       .then(() => {\r\n  //         console.info('KritzelControls initialized with tools:', this.controls);\r\n  //         this.forceUpdate++;\r\n  //       })\r\n  //       .catch(error => {\r\n  //         console.error('Error initializing tools:', error);\r\n  //       });\r\n  //   });\r\n  // }\r\n\r\n  // private async initializeEngine() {\r\n  //   this.kritzelEngine = this.host.parentElement.querySelector('kritzel-engine');\r\n\r\n  //   if (!this.kritzelEngine) {\r\n  //     throw new Error('kritzel-engine not found in parent element.');\r\n  //   }\r\n  // }\r\n\r\n  // private async initializeTools() {\r\n  //   for (const c of this.controls) {\r\n  //     if (c.type === 'tool' && c.tool) {\r\n  //       c.tool = await this.kritzelEngine.registerTool(c.name, c.tool, c.config);\r\n  //     }\r\n\r\n  //     if (c.type === 'tool' && c.isDefault && c.tool) {\r\n  //       await this.kritzelEngine.changeActiveTool(c.tool as KritzelBaseTool);\r\n  //       this.activeControl = c;\r\n  //     }\r\n\r\n  //     if (c.type === 'config') {\r\n  //       if (this.firstConfig === null) {\r\n  //         this.firstConfig = c;\r\n  //       } else {\r\n  //         console.warn('Only one config control is allowed. The first one will be used.');\r\n  //       }\r\n  //     }\r\n  //   }\r\n  // }\r\n\r\n  @Listen('activeToolChange', { target: 'document' })\r\n  async handleActiveToolChange(event: CustomEvent) {\r\n    this.activeControl = this.controls.find(control => control.tool === event.detail) || null;\r\n    await this.kritzelEngine?.setFocus();\r\n  }\r\n\r\n  @Listen('click', { target: 'document' })\r\n  handleClick(event: MouseEvent) {\r\n    const element = event.target as HTMLElement;\r\n\r\n    if (!this.kritzelEngine || element.closest('.kritzel-tooltip')) {\r\n      return;\r\n    }\r\n\r\n    this.tooltipVisible = false;\r\n    this.kritzelEngine.enable();\r\n  }\r\n\r\n  preventDefault(event: Event) {\r\n    if (event.cancelable) {\r\n      event.preventDefault();\r\n      event.stopPropagation();\r\n    }\r\n  }\r\n\r\n  async handleControlClick(control: KritzelToolbarControl) {\r\n    this.activeControl = control;\r\n\r\n    if (this.activeControl.type === 'tool') {\r\n      await this.kritzelEngine.changeActiveTool(this.activeControl.tool as KritzelBaseTool);\r\n    }\r\n  }\r\n\r\n  handleConfigClick(event: MouseEvent) {\r\n    event.stopPropagation();\r\n    this.tooltipVisible = !this.tooltipVisible;\r\n    this.kritzelEngine.disable();\r\n  }\r\n\r\n  async handleToolChange(event: CustomEvent) {\r\n    this.activeControl = { ...this.activeControl, tool: event.detail };\r\n    await this.kritzelEngine.changeActiveTool((this.activeControl as any).tool);\r\n  }\r\n\r\n  render() {\r\n    const hasNoConfig = this.activeControl?.config === undefined || this.activeControl?.config === null;\r\n\r\n    return (\r\n      <Host>\r\n        <kritzel-utility-panel\r\n          style={{\r\n            position: 'absolute',\r\n            bottom: '56px',\r\n            left: '12px',\r\n          }}\r\n          onUndo={() => this.kritzelEngine?.undo()}\r\n          onRedo={() => this.kritzelEngine?.redo()}\r\n          onDelete={() => this.kritzelEngine?.delete()}\r\n        ></kritzel-utility-panel>\r\n\r\n        <div class=\"kritzel-controls\">\r\n          {this.controls.map(control => {\r\n            if (control.type === 'tool') {\r\n              return (\r\n                <button\r\n                  class={{\r\n                    'kritzel-control': true,\r\n                    'selected': this.activeControl?.name === control?.name,\r\n                  }}\r\n                  key={control.name}\r\n                  onClick={_event => this.handleControlClick?.(control)}\r\n                >\r\n                  <kritzel-icon name={control.icon}></kritzel-icon>\r\n                </button>\r\n              );\r\n            }\r\n\r\n            if (control.type === 'divider') {\r\n              return <div class=\"kritzel-divider\" key={control.name}></div>;\r\n            }\r\n\r\n            if (control.type === 'config' && control.name === this.firstConfig?.name && this.activeControl) {\r\n              return (\r\n                <div class=\"kritzel-config-container\" key={control.name}>\r\n                  <kritzel-tooltip isVisible={this.tooltipVisible} anchorElement={this.host.shadowRoot?.querySelector('.kritzel-config-container') as HTMLElement}>\r\n                    <div style={{ width: '294px', height: '100%' }}>\r\n                      {this.activeControl.name === 'brush' && (\r\n                        <kritzel-control-brush-config tool={this.activeToolAsBrushTool} onToolChange={event => this.handleToolChange?.(event)}></kritzel-control-brush-config>\r\n                      )}\r\n\r\n                      {this.activeControl.name === 'text' && (\r\n                        <kritzel-control-text-config tool={this.activeToolAsTextTool} onToolChange={event => this.handleToolChange?.(event)}></kritzel-control-text-config>\r\n                      )}\r\n                    </div>\r\n                  </kritzel-tooltip>\r\n\r\n                  <div\r\n                    class=\"kritzel-config\"\r\n                    onClick={event => this.handleConfigClick?.(event)}\r\n                    style={{\r\n                      cursor: this.activeControl.config ? 'pointer' : 'default',\r\n                      pointerEvents: hasNoConfig ? 'none' : 'auto',\r\n                    }}\r\n                  >\r\n                    {this.activeControl.tool instanceof KritzelBrushTool && (\r\n                      <div class=\"color-container\">\r\n                        <kritzel-color\r\n                          value={this.activeToolAsBrushTool?.color}\r\n                          size={this.activeToolAsBrushTool?.size}\r\n                          style={{\r\n                            borderRadius: '50%',\r\n                            border: 'none',\r\n                          }}\r\n                        ></kritzel-color>\r\n                      </div>\r\n                    )}\r\n\r\n                    {this.activeControl.tool instanceof KritzelTextTool && (\r\n                      <div class=\"font-container\">\r\n                        <kritzel-font\r\n                          fontFamily={this.activeToolAsTextTool?.fontFamily}\r\n                          size={this.activeToolAsTextTool?.fontSize}\r\n                          color={this.activeToolAsTextTool?.fontColor}\r\n                        ></kritzel-font>\r\n                      </div>\r\n                    )}\r\n\r\n                    {hasNoConfig && <div class=\"no-config\"></div>}\r\n                  </div>\r\n                </div>\r\n              );\r\n            }\r\n          })}\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"kritzel-controls.js","sourceRoot":"","sources":["../../../../src/components/ui/kritzel-controls/kritzel-controls.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, State, Element, Host, Listen, Event, EventEmitter } from '@stencil/core';\r\nimport { KritzelBrushTool } from '../../../classes/tools/brush-tool.class';\r\nimport { KritzelTextTool } from '../../../classes/tools/text-tool.class';\r\nimport { KritzelToolbarControl } from '../../../interfaces/toolbar-control.interface';\r\nimport { KritzelBaseTool } from '../../../classes/tools/base-tool.class';\r\n\r\ntype ToolConfig = Record<string, any>;\r\n\r\n@Component({\r\n  tag: 'kritzel-controls',\r\n  styleUrl: 'kritzel-controls.css',\r\n  shadow: true,\r\n  assetsDirs: ['../assets'],\r\n})\r\nexport class KritzelControls {\r\n  @Prop()\r\n  controls: KritzelToolbarControl[] = [];\r\n\r\n  @Prop({ mutable: true })\r\n  activeControl: KritzelToolbarControl | null = null;\r\n\r\n  @Event()\r\n  controlsReady: EventEmitter<void>;\r\n\r\n  @Element()\r\n  host!: HTMLElement;\r\n\r\n  @State()\r\n  firstConfig: ToolConfig | null = null;\r\n\r\n  @State()\r\n  tooltipVisible: boolean = false;\r\n\r\n  @State()\r\n  forceUpdate: number = 0;\r\n\r\n  kritzelEngine: HTMLKritzelEngineElement | null = null;\r\n\r\n  get activeToolAsTextTool() {\r\n    return this.activeControl?.tool as KritzelTextTool;\r\n  }\r\n\r\n  get activeToolAsBrushTool() {\r\n    return this.activeControl?.tool as KritzelBrushTool;\r\n  }\r\n\r\n  async componentDidLoad() {\r\n    console.log('KritzelControls componentDidLoad');\r\n    this.forceUpdate++;\r\n    this.controlsReady.emit();\r\n    this.initializeEngine().then(() => {\r\n      this.initializeTools()\r\n        .then(() => {\r\n          console.info('KritzelControls initialized with tools:', this.controls);\r\n          this.forceUpdate++;\r\n        })\r\n        .catch(error => {\r\n          console.error('Error initializing tools:', error);\r\n        });\r\n    });\r\n  }\r\n\r\n  private async initializeEngine() {\r\n    this.kritzelEngine = this.host.parentElement.querySelector('kritzel-engine');\r\n\r\n    if (!this.kritzelEngine) {\r\n      throw new Error('kritzel-engine not found in parent element.');\r\n    }\r\n  }\r\n\r\n  private async initializeTools() {\r\n    for (const c of this.controls) {\r\n      if (c.type === 'tool' && c.tool) {\r\n        c.tool = await this.kritzelEngine.registerTool(c.name, c.tool, c.config);\r\n      }\r\n\r\n      if (c.type === 'tool' && c.isDefault && c.tool) {\r\n        await this.kritzelEngine.changeActiveTool(c.tool as KritzelBaseTool);\r\n        this.activeControl = c;\r\n      }\r\n\r\n      if (c.type === 'config') {\r\n        if (this.firstConfig === null) {\r\n          this.firstConfig = c;\r\n        } else {\r\n          console.warn('Only one config control is allowed. The first one will be used.');\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  @Listen('activeToolChange', { target: 'document' })\r\n  async handleActiveToolChange(event: CustomEvent) {\r\n    this.activeControl = this.controls.find(control => control.tool === event.detail) || null;\r\n    await this.kritzelEngine?.setFocus();\r\n  }\r\n\r\n  @Listen('click', { target: 'document' })\r\n  handleClick(event: MouseEvent) {\r\n    const element = event.target as HTMLElement;\r\n\r\n    if (!this.kritzelEngine || element.closest('.kritzel-tooltip')) {\r\n      return;\r\n    }\r\n\r\n    this.tooltipVisible = false;\r\n    this.kritzelEngine.enable();\r\n  }\r\n\r\n  preventDefault(event: Event) {\r\n    if (event.cancelable) {\r\n      event.preventDefault();\r\n      event.stopPropagation();\r\n    }\r\n  }\r\n\r\n  async handleControlClick(control: KritzelToolbarControl) {\r\n    this.activeControl = control;\r\n\r\n    if (this.activeControl.type === 'tool') {\r\n      await this.kritzelEngine.changeActiveTool(this.activeControl.tool as KritzelBaseTool);\r\n    }\r\n  }\r\n\r\n  handleConfigClick(event: MouseEvent) {\r\n    event.stopPropagation();\r\n    this.tooltipVisible = !this.tooltipVisible;\r\n    this.kritzelEngine.disable();\r\n  }\r\n\r\n  async handleToolChange(event: CustomEvent) {\r\n    this.activeControl = { ...this.activeControl, tool: event.detail };\r\n    await this.kritzelEngine.changeActiveTool((this.activeControl as any).tool);\r\n  }\r\n\r\n  render() {\r\n    const hasNoConfig = this.activeControl?.config === undefined || this.activeControl?.config === null;\r\n\r\n    return (\r\n      <Host>\r\n        <kritzel-utility-panel\r\n          style={{\r\n            position: 'absolute',\r\n            bottom: '56px',\r\n            left: '12px',\r\n          }}\r\n          onUndo={() => this.kritzelEngine?.undo()}\r\n          onRedo={() => this.kritzelEngine?.redo()}\r\n          onDelete={() => this.kritzelEngine?.delete()}\r\n        ></kritzel-utility-panel>\r\n\r\n        <div class=\"kritzel-controls\">\r\n          {this.controls.map(control => {\r\n            if (control.type === 'tool') {\r\n              return (\r\n                <button\r\n                  class={{\r\n                    'kritzel-control': true,\r\n                    'selected': this.activeControl?.name === control?.name,\r\n                  }}\r\n                  key={control.name}\r\n                  onClick={_event => this.handleControlClick?.(control)}\r\n                >\r\n                  <kritzel-icon name={control.icon}></kritzel-icon>\r\n                </button>\r\n              );\r\n            }\r\n\r\n            if (control.type === 'divider') {\r\n              return <div class=\"kritzel-divider\" key={control.name}></div>;\r\n            }\r\n\r\n            if (control.type === 'config' && control.name === this.firstConfig?.name && this.activeControl) {\r\n              return (\r\n                <div class=\"kritzel-config-container\" key={control.name}>\r\n                  <kritzel-tooltip isVisible={this.tooltipVisible} anchorElement={this.host.shadowRoot?.querySelector('.kritzel-config-container') as HTMLElement}>\r\n                    <div style={{ width: '294px', height: '100%' }}>\r\n                      {this.activeControl.name === 'brush' && (\r\n                        <kritzel-control-brush-config tool={this.activeToolAsBrushTool} onToolChange={event => this.handleToolChange?.(event)}></kritzel-control-brush-config>\r\n                      )}\r\n\r\n                      {this.activeControl.name === 'text' && (\r\n                        <kritzel-control-text-config tool={this.activeToolAsTextTool} onToolChange={event => this.handleToolChange?.(event)}></kritzel-control-text-config>\r\n                      )}\r\n                    </div>\r\n                  </kritzel-tooltip>\r\n\r\n                  <div\r\n                    class=\"kritzel-config\"\r\n                    onClick={event => this.handleConfigClick?.(event)}\r\n                    style={{\r\n                      cursor: this.activeControl.config ? 'pointer' : 'default',\r\n                      pointerEvents: hasNoConfig ? 'none' : 'auto',\r\n                    }}\r\n                  >\r\n                    {this.activeControl.tool instanceof KritzelBrushTool && (\r\n                      <div class=\"color-container\">\r\n                        <kritzel-color\r\n                          value={this.activeToolAsBrushTool?.color}\r\n                          size={this.activeToolAsBrushTool?.size}\r\n                          style={{\r\n                            borderRadius: '50%',\r\n                            border: 'none',\r\n                          }}\r\n                        ></kritzel-color>\r\n                      </div>\r\n                    )}\r\n\r\n                    {this.activeControl.tool instanceof KritzelTextTool && (\r\n                      <div class=\"font-container\">\r\n                        <kritzel-font\r\n                          fontFamily={this.activeToolAsTextTool?.fontFamily}\r\n                          size={this.activeToolAsTextTool?.fontSize}\r\n                          color={this.activeToolAsTextTool?.fontColor}\r\n                        ></kritzel-font>\r\n                      </div>\r\n                    )}\r\n\r\n                    {hasNoConfig && <div class=\"no-config\"></div>}\r\n                  </div>\r\n                </div>\r\n              );\r\n            }\r\n          })}\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/components/ui/kritzel-dummy/kritzel-dummy.js

@@ -1,7 +1,7 @@
 import { Host, h } from "@stencil/core";
 export class KritzelDummy {
     render() {
-        return (h(Host, { key: 'ab62a8c7ef676c182d60a36be96ddb12ae636659' }, "Dummy Component Works!"));
+        return (h(Host, { key: 'aff3d5d844af503ead3cd02a1a62f26c885587ef' }, "Dummy Component Works!"));
     }
     static get is() { return "kritzel-dummy"; }
     static get encapsulation() { return "shadow"; }

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

@@ -13,7 +13,7 @@ export class KritzelUtilityPanel {
         this.redo.emit();
     }
     render() {
-        return (h(Host, { key: 'f381fac2cb032ca19c6945ef4f39673ea0bd0cc5' }, h("button", { key: '1f7200672970baf1d0cfcaa116fa3f8f9a39832a', class: "utility-button", onClick: event => this.handleUndo(event) }, h("kritzel-icon", { key: '755d9201d80d8db086f07b38e90a01a06e980b50', name: "undo" })), h("button", { key: '06e4d5c2956f23245c3d48f21c15d54e8bef8119', class: "utility-button", onClick: event => this.handleRedo(event) }, h("kritzel-icon", { key: '13eb6b31c45b67ac399fc7c84b941ddce04c5c86', name: "redo" })), h("div", { key: '7f03a576a37649db679b93604c2654d29cc81da4', class: "utility-separator" }), h("button", { key: '0c40613e9f6a049cec872d71e9f948d685ec1dbe', class: "utility-button" }, h("kritzel-icon", { key: '8cba73bcb02ef8b7c182ba2fd16d98d6855f1c1b', name: "delete", onClick: () => this.delete.emit() }))));
+        return (h(Host, { key: '41a059b44da75d93169ad9c3ab9e7094a178ce6a' }, h("button", { key: 'cb6ce47be3b7b8efa863658b45339c084c006558', class: "utility-button", onClick: event => this.handleUndo(event) }, h("kritzel-icon", { key: '2cd0e214a354603a0b6d3c5a20414e5592b57c72', name: "undo" })), h("button", { key: '3a2c931d270d1173603722eb6f0be7450905225d', class: "utility-button", onClick: event => this.handleRedo(event) }, h("kritzel-icon", { key: '647ee8f80f8ee7991278ae09c824c2d41939b799', name: "redo" })), h("div", { key: 'cc8aab4de10a3c7997e8b65682fa5fed4a0e9ee7', class: "utility-separator" }), h("button", { key: '8e1f513af08407fafc4d2cfe48dc781120942ebd', class: "utility-button" }, h("kritzel-icon", { key: '4758c3bdcbb2a273424982ce4c1a05575199c130', name: "delete", onClick: () => this.delete.emit() }))));
     }
     static get is() { return "kritzel-utility-panel"; }
     static get encapsulation() { return "shadow"; }

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

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

package/dist/components/kritzel-color.js

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

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

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

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

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

package/dist/components/kritzel-controls.js

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

package/dist/components/kritzel-dummy.js

@@ -1,31 +1,4 @@
-import { p as proxyCustomElement, H, h, d as Host } from './p-nnmjP18w.js';
-
-const kritzelDummyCss = ":host{display:block}";
-
-const KritzelDummy$1 = /*@__PURE__*/ proxyCustomElement(class KritzelDummy extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-    }
-    render() {
-        return (h(Host, { key: 'ab62a8c7ef676c182d60a36be96ddb12ae636659' }, "Dummy Component Works!"));
-    }
-    static get style() { return kritzelDummyCss; }
-}, [1, "kritzel-dummy"]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["kritzel-dummy"];
-    components.forEach(tagName => { switch (tagName) {
-        case "kritzel-dummy":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, KritzelDummy$1);
-            }
-            break;
-    } });
-}
+import { K as KritzelDummy$1, d as defineCustomElement$1 } from './p-9_JiL_wH.js';
 
 const KritzelDummy = KritzelDummy$1;
 const defineCustomElement = defineCustomElement$1;

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

@@ -1 +1 @@
-{"file":"kritzel-dummy.js","mappings":";;AAAA,MAAM,eAAe,GAAG,sBAAsB;;MCOjCA,cAAY,iBAAAC,kBAAA,CAAA,MAAA,YAAA,SAAAC,CAAA,CAAA;;;;;;IACvB,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAA,wBAAA,CAEE;;;;;;;;;;;;;;;;;;;;;;;","names":["KritzelDummy","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ui/kritzel-dummy/kritzel-dummy.css?tag=kritzel-dummy&encapsulation=shadow","src/components/ui/kritzel-dummy/kritzel-dummy.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n","import { Component, Host, h } from '@stencil/core';\n\n@Component({\n  tag: 'kritzel-dummy',\n  styleUrl: 'kritzel-dummy.css',\n  shadow: true,\n})\nexport class KritzelDummy {\n  render() {\n    return (\n      <Host>\n        Dummy Component Works!\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"kritzel-dummy.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}