kritzel-stencil 0.0.121 → 0.0.123
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{index-BcrLbdO1.js → index-C05uAr89.js} +10 -4
- package/dist/cjs/index-C05uAr89.js.map +1 -0
- package/dist/cjs/{index-BjLSiQIM.js → index-UcX3pzju.js} +348 -141
- package/dist/cjs/index-UcX3pzju.js.map +1 -0
- package/dist/cjs/index.cjs.js +1 -1
- package/dist/cjs/kritzel-brush-style_18.cjs.entry.js +137 -81
- package/dist/cjs/kritzel-brush-style_18.cjs.entry.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/stencil.cjs.js +2 -2
- package/dist/cjs/stencil.cjs.js.map +1 -1
- package/dist/collection/classes/commands/remove-object.command.js +3 -0
- package/dist/collection/classes/commands/remove-object.command.js.map +1 -1
- package/dist/collection/classes/handlers/context-menu.handler.js +1 -1
- package/dist/collection/classes/handlers/context-menu.handler.js.map +1 -1
- package/dist/collection/classes/handlers/hover.handler.js +22 -0
- package/dist/collection/classes/handlers/hover.handler.js.map +1 -0
- package/dist/collection/classes/handlers/move.handler.js +2 -2
- package/dist/collection/classes/handlers/move.handler.js.map +1 -1
- package/dist/collection/classes/handlers/selection.handler.js +16 -20
- package/dist/collection/classes/handlers/selection.handler.js.map +1 -1
- package/dist/collection/classes/history.class.js +16 -13
- package/dist/collection/classes/history.class.js.map +1 -1
- package/dist/collection/classes/objects/base-object.class.js +34 -32
- package/dist/collection/classes/objects/base-object.class.js.map +1 -1
- package/dist/collection/classes/objects/custom-element.class.js +52 -0
- package/dist/collection/classes/objects/custom-element.class.js.map +1 -0
- package/dist/collection/classes/objects/image.class.js +1 -1
- package/dist/collection/classes/objects/image.class.js.map +1 -1
- package/dist/collection/classes/objects/path.class.js +133 -4
- package/dist/collection/classes/objects/path.class.js.map +1 -1
- package/dist/collection/classes/objects/selection-box.class.js +2 -2
- package/dist/collection/classes/objects/selection-box.class.js.map +1 -1
- package/dist/collection/classes/objects/selection-group.class.js +3 -2
- package/dist/collection/classes/objects/selection-group.class.js.map +1 -1
- package/dist/collection/classes/objects/text.class.js +1 -1
- package/dist/collection/classes/objects/text.class.js.map +1 -1
- package/dist/collection/classes/reviver.class.js +4 -0
- package/dist/collection/classes/reviver.class.js.map +1 -1
- package/dist/collection/classes/store.class.js +45 -6
- package/dist/collection/classes/store.class.js.map +1 -1
- package/dist/collection/classes/tools/eraser-tool.class.js +17 -14
- package/dist/collection/classes/tools/eraser-tool.class.js.map +1 -1
- package/dist/collection/classes/tools/image-tool.class.js +1 -1
- package/dist/collection/classes/tools/image-tool.class.js.map +1 -1
- package/dist/collection/classes/tools/selection-tool.class.js +5 -6
- package/dist/collection/classes/tools/selection-tool.class.js.map +1 -1
- package/dist/collection/classes/viewport.class.js +20 -12
- package/dist/collection/classes/viewport.class.js.map +1 -1
- package/dist/collection/collection-manifest.json +1 -1
- package/dist/collection/components/core/kritzel-editor/kritzel-editor.js +6 -6
- package/dist/collection/components/core/kritzel-editor/kritzel-editor.js.map +1 -1
- package/dist/collection/components/core/kritzel-engine/kritzel-engine.js +43 -37
- package/dist/collection/components/core/kritzel-engine/kritzel-engine.js.map +1 -1
- package/dist/collection/components/shared/kritzel-color-palette/kritzel-color-palette.css +1 -1
- package/dist/collection/components/shared/kritzel-font-size/kritzel-font-size.css +1 -1
- package/dist/collection/components/shared/kritzel-stroke-size/kritzel-stroke-size.css +1 -1
- package/dist/collection/components/ui/kritzel-controls/kritzel-controls.css +1 -1
- package/dist/collection/configs/default-engine-state.js +2 -2
- package/dist/collection/configs/default-engine-state.js.map +1 -1
- package/dist/collection/helpers/html.helper.js +7 -0
- package/dist/collection/helpers/html.helper.js.map +1 -0
- package/dist/collection/helpers/object.helper.js +6 -2
- package/dist/collection/helpers/object.helper.js.map +1 -1
- package/dist/collection/interfaces/engine-state.interface.js.map +1 -1
- package/dist/collection/interfaces/object.interface.js.map +1 -1
- package/dist/components/index.js +3 -3
- package/dist/components/kritzel-brush-style.js +1 -1
- package/dist/components/kritzel-color-palette.js +1 -1
- package/dist/components/kritzel-color.js +1 -1
- package/dist/components/kritzel-context-menu.js +1 -1
- package/dist/components/kritzel-control-brush-config.js +1 -1
- package/dist/components/kritzel-control-text-config.js +1 -1
- package/dist/components/kritzel-controls.js +1 -1
- package/dist/components/kritzel-cursor-trail.js +1 -1
- package/dist/components/kritzel-dropdown.js +1 -1
- package/dist/components/kritzel-editor.js +23 -23
- package/dist/components/kritzel-editor.js.map +1 -1
- package/dist/components/kritzel-engine.js +1 -1
- package/dist/components/kritzel-font-family.js +1 -1
- package/dist/components/kritzel-font-size.js +1 -1
- package/dist/components/kritzel-font.js +1 -1
- package/dist/components/kritzel-icon.js +1 -1
- package/dist/components/kritzel-stroke-size.js +1 -1
- package/dist/components/kritzel-tooltip.js +1 -1
- package/dist/components/kritzel-utility-panel.js +1 -1
- package/dist/components/{p-CqPrOhzi.js → p-BOj_wqdw.js} +4 -4
- package/dist/components/{p-CqPrOhzi.js.map → p-BOj_wqdw.js.map} +1 -1
- package/dist/components/{p-CEYRFk55.js → p-BY8BWGge.js} +4 -4
- package/dist/components/{p-CEYRFk55.js.map → p-BY8BWGge.js.map} +1 -1
- package/dist/components/{p-D-Rf05Ov.js → p-Bn5P7YQn.js} +5 -5
- package/dist/components/{p-D-Rf05Ov.js.map → p-Bn5P7YQn.js.map} +1 -1
- package/dist/components/{p-CIb4IA9u.js → p-C9usqwb5.js} +5 -5
- package/dist/components/{p-CIb4IA9u.js.map → p-C9usqwb5.js.map} +1 -1
- package/dist/components/{p-gDLg_PJJ.js → p-CF8ziFc4.js} +4 -4
- package/dist/components/{p-gDLg_PJJ.js.map → p-CF8ziFc4.js.map} +1 -1
- package/dist/components/{p-CDpq9L_H.js → p-CiT5gBDh.js} +3 -3
- package/dist/components/{p-CDpq9L_H.js.map → p-CiT5gBDh.js.map} +1 -1
- package/dist/components/{p-D1oFXBAp.js → p-Cn_kantt.js} +5 -5
- package/dist/components/{p-D1oFXBAp.js.map → p-Cn_kantt.js.map} +1 -1
- package/dist/components/{p-DC3j4P1n.js → p-Cnc43o9b.js} +227 -41
- package/dist/components/p-Cnc43o9b.js.map +1 -0
- package/dist/components/{p-BAMl2Ww6.js → p-CneTqrgt.js} +18 -18
- package/dist/components/{p-BAMl2Ww6.js.map → p-CneTqrgt.js.map} +1 -1
- package/dist/components/{p-B2wWYPH8.js → p-CtiROna-.js} +3 -3
- package/dist/components/{p-B2wWYPH8.js.map → p-CtiROna-.js.map} +1 -1
- package/dist/components/{p-D0L3GqSK.js → p-Cw2ATHMj.js} +3 -3
- package/dist/components/{p-D0L3GqSK.js.map → p-Cw2ATHMj.js.map} +1 -1
- package/dist/components/{p-CxmkJbeV.js → p-D0sLslUq.js} +3 -3
- package/dist/components/{p-CxmkJbeV.js.map → p-D0sLslUq.js.map} +1 -1
- package/dist/components/{p-dCaxwGmu.js → p-DJN0U8pI.js} +10 -4
- package/dist/components/p-DJN0U8pI.js.map +1 -0
- package/dist/components/{p-q-xqpmae.js → p-DJaVT2yR.js} +255 -178
- package/dist/components/p-DJaVT2yR.js.map +1 -0
- package/dist/components/{p-C3E9PtD3.js → p-DMAzUKo6.js} +10 -10
- package/dist/components/{p-C3E9PtD3.js.map → p-DMAzUKo6.js.map} +1 -1
- package/dist/components/{p-DbPbyRLO.js → p-DSLY0tr5.js} +5 -5
- package/dist/components/{p-DbPbyRLO.js.map → p-DSLY0tr5.js.map} +1 -1
- package/dist/components/{p--2FkikYE.js → p-DpiklJU9.js} +3 -3
- package/dist/components/{p--2FkikYE.js.map → p-DpiklJU9.js.map} +1 -1
- package/dist/components/{p--tElassI.js → p-NZJPrwJV.js} +3 -3
- package/dist/components/{p--tElassI.js.map → p-NZJPrwJV.js.map} +1 -1
- package/dist/components/{p-BSS4UREq.js → p-ubNAWsY_.js} +9 -9
- package/dist/components/{p-BSS4UREq.js.map → p-ubNAWsY_.js.map} +1 -1
- package/dist/esm/{index-BPFXWTBp.js → index-BGl8znzE.js} +10 -4
- package/dist/esm/index-BGl8znzE.js.map +1 -0
- package/dist/esm/{index-DsUDklEm.js → index-DO2IiM_o.js} +348 -141
- package/dist/esm/index-DO2IiM_o.js.map +1 -0
- package/dist/esm/index.js +1 -1
- package/dist/esm/kritzel-brush-style_18.entry.js +137 -81
- package/dist/esm/kritzel-brush-style_18.entry.js.map +1 -1
- package/dist/esm/loader.js +2 -2
- package/dist/esm/stencil.js +3 -3
- package/dist/esm/stencil.js.map +1 -1
- package/dist/stencil/index.esm.js +1 -1
- package/dist/stencil/p-BGl8znzE.js +3 -0
- package/dist/stencil/p-BGl8znzE.js.map +1 -0
- package/dist/stencil/p-DO2IiM_o.js +2 -0
- package/dist/stencil/p-DO2IiM_o.js.map +1 -0
- package/dist/stencil/p-c64f6589.entry.js +2 -0
- package/dist/stencil/p-c64f6589.entry.js.map +1 -0
- package/dist/stencil/stencil.esm.js +1 -1
- package/dist/stencil/stencil.esm.js.map +1 -1
- package/dist/types/classes/handlers/hover.handler.d.ts +6 -0
- package/dist/types/classes/handlers/selection.handler.d.ts +1 -1
- package/dist/types/classes/history.class.d.ts +1 -0
- package/dist/types/classes/objects/base-object.class.d.ts +12 -6
- package/dist/types/classes/objects/custom-element.class.d.ts +26 -0
- package/dist/types/classes/objects/image.class.d.ts +1 -1
- package/dist/types/classes/objects/path.class.d.ts +9 -2
- package/dist/types/classes/objects/text.class.d.ts +1 -1
- package/dist/types/classes/store.class.d.ts +5 -0
- package/dist/types/classes/tools/selection-tool.class.d.ts +2 -0
- package/dist/types/components.d.ts +4 -4
- package/dist/types/helpers/html.helper.d.ts +3 -0
- package/dist/types/interfaces/engine-state.interface.d.ts +2 -2
- package/dist/types/interfaces/object.interface.d.ts +12 -4
- package/package.json +5 -5
- package/dist/cjs/index-BcrLbdO1.js.map +0 -1
- package/dist/cjs/index-BjLSiQIM.js.map +0 -1
- package/dist/components/p-DC3j4P1n.js.map +0 -1
- package/dist/components/p-dCaxwGmu.js.map +0 -1
- package/dist/components/p-q-xqpmae.js.map +0 -1
- package/dist/esm/index-BPFXWTBp.js.map +0 -1
- package/dist/esm/index-DsUDklEm.js.map +0 -1
- package/dist/stencil/p-3797c300.entry.js +0 -2
- package/dist/stencil/p-3797c300.entry.js.map +0 -1
- package/dist/stencil/p-BPFXWTBp.js +0 -3
- package/dist/stencil/p-BPFXWTBp.js.map +0 -1
- package/dist/stencil/p-DsUDklEm.js +0 -2
- package/dist/stencil/p-DsUDklEm.js.map +0 -1
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,c as e,h as i,H as s,g as o}from"./p-BPFXWTBp.js";import{K as n,a as r,b as l,c as h,D as a,d as c,e as d,f,g as u,h as b,i as p,j as v,R as g,k as y,B as k,A as x,l as w,m as z,n as m,o as C,p as j}from"./p-DsUDklEm.js";const M=":host{display:flex;align-items:flex-start;gap:8px;padding:8px;box-sizing:border-box;width:100%}.brush-style-button{display:flex;justify-content:center;align-items:center;width:42px;height:32px;padding:0;border:none;outline:none;background:none;cursor:default;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)}";const I=class{constructor(i){t(this,i);this.typeChange=e(this,"typeChange");this.type="pen";this.brushOptions=[{value:"pen",label:"Pen"},{value:"highlighter",label:"Highlighter"}]}handleDropdownValueChange(t){this.typeChange.emit(t.detail)}render(){const t=this.brushOptions.map((t=>({value:t.value,label:t.label})));return i(s,{key:"d7af382fe6f613aa16a5146785990ad2faa17f60"},i("kritzel-dropdown",{key:"6d6d330d415c210058834b2968774b3db2ab7fc4",options:t,value:this.type,onValueChanged:t=>this.handleDropdownValueChange(t)},i("button",{key:"c9fb33795b8e25f68c1d2ae248dc82a6de29e199",class:"brush-style-button",slot:"prefix"},i("kritzel-icon",{key:"975c95b545a1c27ae2984405ac298592eec9743d",name:this.type,size:16}))))}};I.style=M;const S=":host{display:flex}.checkerboard-bg{background:repeating-conic-gradient(#ccc 0% 25%, #fff 0% 50%) 50% / 8px 8px;position:relative;overflow:hidden}.color-circle{width:24px;height:24px;border-radius:50%;box-sizing:border-box;display:block}.color-circle.white{border:1px solid var(--kritzel-color-palette-circle-border-color, #dddcdc)}";const T=class{constructor(e){t(this,e);this.size=24}isLightColor(t){if(!t)return false;let e=0,i=0,s=0;let o=t.startsWith("#")?t.slice(1):t;if(o.length===3){e=parseInt(o[0]+o[0],16);i=parseInt(o[1]+o[1],16);s=parseInt(o[2]+o[2],16)}else if(o.length===6){e=parseInt(o.substring(0,2),16);i=parseInt(o.substring(2,4),16);s=parseInt(o.substring(4,6),16)}else{return false}if(isNaN(e)||isNaN(i)||isNaN(s)){return false}const n=.299*e+.587*i+.114*s;return n>220}render(){const t=this.isLightColor(this.value);return i(s,{key:"19ad3872a132c885c612dc3b96698a0c8dc7214d"},i("div",{key:"f67108e82396cbaa3d070c8dfc83da2b080ddf47",class:"checkerboard-bg",style:{width:`${this.size}px`,height:`${this.size}px`,borderRadius:"50%",display:"inline-block",position:"relative"}},i("div",{key:"1af0cc3e9f6eebc04cae2367510ef3b98420a818",class:{"color-circle":true,white:t},style:{backgroundColor:this.value,width:`${this.size}px`,height:`${this.size}px`,borderRadius:"50%",position:"absolute",top:"0",left:"0",display:"inline-block"}})))}};T.style=S;const $=":host{display:flex;align-items:flex-start;gap:8px;padding:8px;width:100%;box-sizing:border-box}.color-grid{width:100%;display:grid;grid-template-columns:repeat(6, 32px);gap:8px;justify-items:center;overflow:hidden;height:40px;transition:height 0.1s ease-in-out}.color-grid.expanded{height:500px}.color-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:50%;cursor:pointer;border:2px solid transparent;box-sizing:border-box}.color-container:hover{background-color:var(--kritzel-color-palette-hover-background-color, #f0f0f0)}.color-container.selected{border-color:var(--kritzel-selection-border-color, #0E1111);background-color:var(--kritzel-color-palette-selected-background-color)}";const O=class{constructor(i){t(this,i);this.colorChange=e(this,"colorChange");this.colors=[];this.selectedColor=null;this.isExpanded=false;this.isOpaque=false}handleColorClick(t){this.selectedColor=t;this.colorChange.emit(t)}calculateHeight(){const t=6;const e=32;const i=8;const s=Math.ceil(this.colors.length/t);return`${s*e+(s-1)*i}px`}render(){const t=this.isExpanded?this.colors:this.colors.slice(0,6);const e=this.isExpanded?this.calculateHeight():"32px";return i(s,{key:"0f0d176e1c8b199a973dbdb23b84e4a8d4d57f59"},i("div",{key:"1d4707cdb30752d21a5058dbbef5fb32934bd3bd",class:{"color-grid":true,expanded:this.isExpanded},style:{height:e}},t.map((t=>i("div",{class:{"color-container":true,selected:this.selectedColor===t},onClick:()=>this.handleColorClick(t)},i("kritzel-color",{value:t}))))))}};O.style=$;const B=":host{display:block}.menu-container{display:flex;flex-direction:column;background-color:var(--kritzel-context-menu-background-color, #ffffff);border-radius:var(--kritzel-context-menu-border-radius, 12px);box-shadow:var(--kritzel-context-menu-box-shadow, 0 1px 6px rgba(0, 0, 0, 0.12));border:var(--kritzel-context-menu-border, 1px solid #f0f0f0);padding:var(--kritzel-context-menu-padding,4px)}.menu-item{display:flex;align-items:center;gap:var(--kritzel-context-menu-item-gap, 8px);background:none;border:none;text-align:left;padding:var(--kritzel-context-menu-item-padding, 8px);border-radius:var(--kritzel-context-menu-item-border-radius, 12px);cursor:pointer;font-size:var(--kritzel-context-menu-item-font-size, 14px);color:var(--kritzel-context-menu-item-color, #333333);white-space:nowrap;-webkit-tap-highlight-color:transparent}.menu-item:not(.disabled):hover{background-color:var(--kritzel-context-menu-item-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.menu-item:not(.disabled):active{background-color:var(--kritzel-context-menu-item-active-background-color, hsl(0, 0%, 0%, 8.6%))}.menu-item.disabled{color:var(--kritzel-context-menu-item-disabled-color, #aaaaaa);cursor:default}.menu-item kritzel-icon{opacity:0.8;flex-shrink:0}.menu-item.disabled kritzel-icon{opacity:0.4}.label{flex-grow:1}";const E=class{constructor(i){t(this,i);this.actionSelected=e(this,"actionSelected");this.disabledStates=new Map;this.visibleItems=[]}componentWillLoad(){this.resolveVisibleItems();this.resolveDisabledStates()}onItemsChanged(){this.resolveVisibleItems();this.resolveDisabledStates()}handleItemClick(t,e){if(!this.disabledStates.get(e)){this.actionSelected.emit(t)}}async resolveVisibleItems(){const t=[];const e=this.items.map((async(t,e)=>{let i=true;if(t.visible!==undefined){if(typeof t.visible==="boolean"){i=t.visible}else if(typeof t.visible==="function"){const e=t.visible(null,this.objects);if(e instanceof Promise){i=await e}else{i=e}}}return{item:t,index:e,isVisible:i}}));const i=await Promise.all(e);i.forEach((({item:e,isVisible:i})=>{if(i){t.push(e)}}));this.visibleItems=t}async resolveDisabledStates(){const t=new Map;const e=this.visibleItems.map((async(e,i)=>{let s=false;if(typeof e.disabled==="boolean"){s=e.disabled}else if(typeof e.disabled==="function"){const t=e.disabled(null,this.objects);if(t instanceof Promise){s=await t}else{s=t}}t.set(i,s)}));await Promise.all(e);this.disabledStates=new Map(t)}render(){return i(s,{key:"3265d2e63ff1e1f91faf1c6c5da3490687f3adb1"},i("div",{key:"80b2100e2ffcaba25ca08cfec650b1f7558c5d25",class:"menu-container"},this.visibleItems.map(((t,e)=>{var s;const o=(s=this.disabledStates.get(e))!==null&&s!==void 0?s:false;return i("button",{key:`${t.label}-${e}`,class:{"menu-item":true,disabled:o},onClick:()=>this.handleItemClick(t,e),onTouchStart:()=>this.handleItemClick(t,e),disabled:o},t.icon&&i("kritzel-icon",{name:t.icon,size:16}),i("span",{class:"label"},t.label))}))))}get hostElement(){return o(this)}static get watchers(){return{items:["onItemsChanged"]}}};E.style=B;const _=":host{display:flex;flex-direction:column;width:100%}.expand-toggle{background:none;border:none;cursor:pointer;font-size:14px;line-height:1;padding:8px;color:var(--kritzel-color-palette-expand-toggle-color, #666666)}.expand-toggle:hover{color:var(--kritzel-color-palette-expand-toggle-hover-color, #333333)}";const D=class{constructor(i){t(this,i);this.toolChange=e(this,"toolChange");this.isExpanded=false;this.palette=[]}handleToolChange(t){this.palette=t.palettes[t.type]}componentWillLoad(){this.palette=this.tool.palettes[this.tool.type]}handleToggleExpand(){this.isExpanded=!this.isExpanded}handleTypeChange(t){this.palette=this.tool.palettes[t.detail];this.tool.type=t.detail;this.tool.color=this.palette[0];this.toolChange.emit(this.tool)}handleColorChange(t){this.tool.color=t.detail;this.toolChange.emit(this.tool)}handleSizeChange(t){this.tool.size=t.detail;this.toolChange.emit(this.tool)}render(){return i(s,{key:"8e7930fcc093f7277ed088d8ec5e54e4cd051b86"},i("div",{key:"08bd37b90decc9054c05d646aabbba0a4985d04c",style:{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"flex-start",width:"100%",gap:"8px"}},i("kritzel-brush-style",{key:"f79744fb6523d0b4fa67c324cbf8ff3eb8a0308d",type:this.tool.type,onTypeChange:t=>this.handleTypeChange(t)}),i("button",{key:"dc3bdd90cebb29f2357e13dbc8d2dcaf02ae056e",class:"expand-toggle",onClick:()=>this.handleToggleExpand(),title:this.isExpanded?"Collapse":"Expand",style:this.palette.length>6?{visibillity:"visible"}:{visibility:"hidden"}},i("kritzel-icon",{key:"6e9e6de7fc7c708aad700498e030d2ad7364a9f3",name:this.isExpanded?"chevron-up":"chevron-down"}))),i("kritzel-color-palette",{key:"c1ffd48a475754bb1447e9d866b494fd3476f050",colors:this.palette,selectedColor:this.tool.color,isExpanded:this.isExpanded,isOpaque:true,onColorChange:t=>this.handleColorChange(t)}),i("kritzel-stroke-size",{key:"38e265b42fe09d0105e0385d7ec8e7d8d318abb0",selectedSize:this.tool.size,onSizeChange:t=>this.handleSizeChange(t)}))}static get watchers(){return{tool:["handleToolChange"]}}};D.style=_;const R=":host{display:block;flex-direction:column;width:100%}.expand-toggle{background:none;border:none;cursor:pointer;font-size:14px;line-height:1;padding:8px;color:var(--kritzel-color-palette-expand-toggle-color, #666666)}.expand-toggle:hover{color:var(--kritzel-color-palette-expand-toggle-hover-color, #333333)}";const V=class{constructor(i){t(this,i);this.toolChange=e(this,"toolChange");this.isExpanded=false}handleToggleExpand(){this.isExpanded=!this.isExpanded}handleFamilyChange(t){this.tool.fontFamily=t.detail;this.toolChange.emit(this.tool)}handleColorChange(t){this.tool.fontColor=t.detail;this.toolChange.emit(this.tool)}handleSizeChange(t){this.tool.fontSize=t.detail;this.toolChange.emit(this.tool)}render(){return i(s,{key:"27d47c47987fb7644313a4face4a7023dfbe454d"},i("div",{key:"835b8072267da18b39a5c02a6c989e1f7b81e9a5",style:{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"flex-start",width:"100%",gap:"8px"}},i("kritzel-font-family",{key:"b7a0bde2e9cf53c9ae7c3a32b424825ca9f757c4",selectedFontFamily:this.tool.fontFamily,onFontFamilyChange:t=>this.handleFamilyChange(t)}),i("button",{key:"41aba583656195c4825a15ddc12c5e1efed0d8d2",class:"expand-toggle",onClick:()=>this.handleToggleExpand(),title:this.isExpanded?"Collapse":"Expand"},i("kritzel-icon",{key:"5ff979420066703b5d5e886d12f89687392006e3",name:this.isExpanded?"chevron-up":"chevron-down"}))),i("kritzel-color-palette",{key:"30fbcc05f80b15fba7f1f5ac6413732d0149ee9b",colors:this.tool.palette,selectedColor:this.tool.fontColor,isExpanded:this.isExpanded,onColorChange:t=>this.handleColorChange(t)}),i("kritzel-font-size",{key:"2a0d3c4578316b37bc1a25b6e065ecf565eca2b3",selectedSize:this.tool.fontSize,fontFamily:this.tool.fontFamily,onSizeChange:t=>this.handleSizeChange(t)}))}};V.style=R;class F{static isTouchDevice(){return window.matchMedia("(any-pointer: coarse)").matches}}const P=":host{display:flex;flex-direction:column;user-select:none}.kritzel-controls{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--kritzel-controls-gap, 8px);height:100%;padding:var(--kritzel-controls-padding, 8px);background-color:var(--kritzel-controls-background-color, #ffffff);border-radius:var(--kritzel-controls-border-radius, 16px);box-shadow:var(--kritzel-controls-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));border:var(--kritzel-controls-border, 1px solid #f0f0f0);z-index:10000;position:relative}.kritzel-control{display:flex;justify-content:center;align-items:center;color:var(--kritzel-controls-control-color, #000000);border-radius:var(--kritzel-controls-control-border-radius, 12px);padding:var(--kritzel-controls-control-padding, 8px);border:none;outline:none;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent;font-weight:bold}.kritzel-control:hover{background-color:var(--kritzel-controls-control-hover-background-color, hsl(0, 0%, 0%, 4.3%))}:host(.mobile) .kritzel-control:hover{background-color:unset}.kritzel-control:active{background-color:var(--kritzel-controls-control-active-background-color, hsl(0, 0%, 0%, 8.6%))}:host(.mobile) .kritzel-control:active{background-color:unset}.kritzel-control.selected,.kritzel-control.selected:hover,.kritzel-control.selected:active{background-color:var(--kritzel-controls-control-selected-background-color, #0E1111) !important;color:var(--kritzel-controls-control-selected-color, #ffffff) !important}.kritzel-divider{width:var(--kritzel-controls-divider-width, 1px);height:var(--kritzel-controls-divider-height, 24px);background-color:var(--kritzel-controls-divider-background-color, hsl(0, 0%, 0%, 4.3%))}.kritzel-config-container{position:relative;display:flex;justify-content:center;align-items:center;width:40px;height:40px;box-sizing:border-box;-webkit-tap-highlight-color:transparent}.kritzel-config{display:flex;justify-content:center;align-items:center;cursor:pointer}.color-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:50%;cursor:pointer;border:2px solid transparent;box-sizing:border-box;background-color:var(--kritzel-color-palette-hover-background-color, #f0f0f0)}.font-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:50%;cursor:pointer;border:2px solid transparent;box-sizing:border-box;background-color:var(--kritzel-color-palette-hover-background-color, #f0f0f0)}.no-config{height:24px;width:24px;border-radius:50%;border:1px dashed gray}kritzel-tooltip{position:fixed;bottom:66px;left:50%;transform:translateX(-50%);z-index:10001}";const A=class{constructor(i){t(this,i);this.isControlsReady=e(this,"isControlsReady");this.controls=[];this.activeControl=null;this.isUtilityPanelVisible=true;this.firstConfig=null;this.isTooltipVisible=false;this.isTouchDevice=F.isTouchDevice();this.kritzelEngine=null}async handleActiveToolChange(t){var e;this.activeControl=this.controls.find((e=>e.tool===t.detail))||null;await((e=this.kritzelEngine)===null||e===void 0?void 0:e.setFocus())}handleClick(t){const e=t.target;if(!this.kritzelEngine||e.closest(".kritzel-tooltip")){return}this.isTooltipVisible=false;this.kritzelEngine.enable()}async closeTooltip(){var t;this.isTooltipVisible=false;(t=this.kritzelEngine)===null||t===void 0?void 0:t.enable()}get activeToolAsTextTool(){var t;return(t=this.activeControl)===null||t===void 0?void 0:t.tool}get activeToolAsBrushTool(){var t;return(t=this.activeControl)===null||t===void 0?void 0:t.tool}async componentWillLoad(){await this.initializeEngine();await this.initializeTools();this.isControlsReady.emit()}async initializeEngine(){await customElements.whenDefined("kritzel-engine");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 t of this.controls){if(t.type==="tool"&&t.tool){t.tool=await this.kritzelEngine.registerTool(t.name,t.tool,t.config)}if(t.type==="tool"&&t.isDefault&&t.tool){await this.kritzelEngine.changeActiveTool(t.tool);this.activeControl=t}if(t.type==="config"){if(this.firstConfig===null){this.firstConfig=t}else{console.warn("Only one config control is allowed. The first one will be used.")}}}}async handleControlClick(t){this.activeControl=t;if(this.activeControl.type==="tool"){await this.kritzelEngine.changeActiveTool(this.activeControl.tool)}}handleConfigClick(t){t.stopPropagation();this.isTooltipVisible=!this.isTooltipVisible;this.kritzelEngine.disable()}async handleToolChange(t){this.activeControl=Object.assign(Object.assign({},this.activeControl),{tool:t.detail});await this.kritzelEngine.changeActiveTool(this.activeControl.tool)}render(){var t,e;const o=((t=this.activeControl)===null||t===void 0?void 0:t.config)===undefined||((e=this.activeControl)===null||e===void 0?void 0:e.config)===null;return i(s,{key:"5531510d4b95c082148ce3e8f5d3048f808162b2",class:{mobile:this.isTouchDevice}},this.isUtilityPanelVisible&&i("kritzel-utility-panel",{key:"e7e58ee4ae6a8a77918d5c8a954c2dcae287b265",style:{position:"absolute",bottom:"56px",left:"12px"},onUndo:()=>{var t;return(t=this.kritzelEngine)===null||t===void 0?void 0:t.undo()},onRedo:()=>{var t;return(t=this.kritzelEngine)===null||t===void 0?void 0:t.redo()},onDelete:()=>{var t;return(t=this.kritzelEngine)===null||t===void 0?void 0:t.delete()}}),i("div",{key:"65ad87089a38f3e89f8332fc6f261555c2e7eb40",class:"kritzel-controls"},this.controls.map((t=>{var e,s,l,h,a,c,d,f;if(t.type==="tool"){return i("button",{class:{"kritzel-control":true,selected:((e=this.activeControl)===null||e===void 0?void 0:e.name)===(t===null||t===void 0?void 0:t.name)},key:t.name,onClick:e=>{var i;return(i=this.handleControlClick)===null||i===void 0?void 0:i.call(this,t)}},i("kritzel-icon",{name:t.icon}))}if(t.type==="divider"){return i("div",{class:"kritzel-divider",key:t.name})}if(t.type==="config"&&t.name===((s=this.firstConfig)===null||s===void 0?void 0:s.name)&&this.activeControl){return i("div",{class:"kritzel-config-container",key:t.name},i("kritzel-tooltip",{isVisible:this.isTooltipVisible,anchorElement:(l=this.host.shadowRoot)===null||l===void 0?void 0:l.querySelector(".kritzel-config-container")},i("div",{style:{width:"294px",height:"100%"}},this.activeControl.name==="brush"&&i("kritzel-control-brush-config",{tool:this.activeToolAsBrushTool,onToolChange:t=>{var e;return(e=this.handleToolChange)===null||e===void 0?void 0:e.call(this,t)}}),this.activeControl.name==="text"&&i("kritzel-control-text-config",{tool:this.activeToolAsTextTool,onToolChange:t=>{var e;return(e=this.handleToolChange)===null||e===void 0?void 0:e.call(this,t)}}))),i("div",{class:"kritzel-config",onClick:t=>{var e;return(e=this.handleConfigClick)===null||e===void 0?void 0:e.call(this,t)},style:{cursor:this.activeControl.config?"pointer":"default",pointerEvents:o?"none":"auto"}},this.activeControl.tool instanceof n&&i("div",{class:"color-container"},i("kritzel-color",{value:(h=this.activeToolAsBrushTool)===null||h===void 0?void 0:h.color,size:(a=this.activeToolAsBrushTool)===null||a===void 0?void 0:a.size,style:{borderRadius:"50%",border:"none"}})),this.activeControl.tool instanceof r&&i("div",{class:"font-container"},i("kritzel-font",{fontFamily:(c=this.activeToolAsTextTool)===null||c===void 0?void 0:c.fontFamily,size:(d=this.activeToolAsTextTool)===null||d===void 0?void 0:d.fontSize,color:(f=this.activeToolAsTextTool)===null||f===void 0?void 0:f.fontColor})),o&&i("div",{class:"no-config"})))}}))))}static get assetsDirs(){return["../assets"]}get host(){return o(this)}};A.style=P;const W=":host{display:block;position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:9000}";const L=class{constructor(e){t(this,e);this.cursorTrailPoints=[];this.isLeftButtonDown=false;this.TRAIL_DURATION_MS=100;this.MAX_TRAIL_POINTS=50}componentDidLoad(){this.trailCleanupIntervalId=window.setInterval((()=>{const t=Date.now();const e=this.cursorTrailPoints.filter((e=>t-e.timestamp<this.TRAIL_DURATION_MS));if(e.length!==this.cursorTrailPoints.length){this.cursorTrailPoints=e}}),50)}disconnectedCallback(){if(this.trailCleanupIntervalId){window.clearInterval(this.trailCleanupIntervalId)}}handleMouseDown(t){if(t.pointerType==="mouse"){if(t.button===l.Left){this.isLeftButtonDown=true;this.cursorTrailPoints=[]}}if(t.pointerType==="touch"){if(this.store.state.pointers.size===1){this.isLeftButtonDown=true;this.cursorTrailPoints=[]}}}handlePointerMove(t){if(!this.isLeftButtonDown){return}const e={x:t.clientX,y:t.clientY,timestamp:Date.now()};const i=[e,...this.cursorTrailPoints];if(i.length>this.MAX_TRAIL_POINTS){this.cursorTrailPoints=i.slice(0,this.MAX_TRAIL_POINTS)}else{this.cursorTrailPoints=i}}handlePointerUp(t){if(t.pointerType==="mouse"){if(t.button===l.Left){this.isLeftButtonDown=false;this.cursorTrailPoints=[]}}if(t.pointerType==="touch"){if(this.store.state.pointers.size===0){this.isLeftButtonDown=false;this.cursorTrailPoints=[]}}}render(){return i(s,{key:"2e6ee739a4c25cee00470ee95ca22e55712c8d7b"},this.cursorTrailPoints.length>1&&i("svg",{key:"483aa687ccd290980ca9c588a84547df2bfdb659",class:"cursor-trail-svg",xmlns:"http://www.w3.org/2000/svg",style:{position:"absolute",left:"0",top:"0",width:"100%",height:"100%",pointerEvents:"none",opacity:"var(--kritzel-cursor-trail-opacity, 0.6)",zIndex:"9000"}},this.cursorTrailPoints.slice(1).map(((t,e)=>{const s=this.cursorTrailPoints[e];const o=Date.now();const n=o-t.timestamp;const r=Math.max(0,Math.min(1,n/this.TRAIL_DURATION_MS));if(r>=1)return null;const l=Math.max(2,15*(1-r));return i("line",{key:`trail-segment-${t.timestamp}`,x1:s.x.toString(),y1:s.y.toString(),x2:t.x.toString(),y2:t.y.toString(),stroke:"var(--kritzel-cursor-trail-color, rgb(228, 228, 228))","stroke-width":l.toString(),"stroke-linecap":"round"})}))))}};L.style=W;const H=':host{display:inline-flex;vertical-align:middle;width:100%;}.dropdown-wrapper{display:flex;align-items:center;border:1px solid #333333;border-radius:var(--kritzel-controls-control-border-radius, 12px);overflow:hidden;height:32px;width:100%}.custom-select{padding:0 8px;padding-right:30px;height:100%;width:100%;box-sizing:border-box;border-radius:0;border:none;background-color:#fff;cursor:pointer;outline:none;font-size:inherit;color:var(--kritzel-controls-text-color, #333333);-webkit-tap-highlight-color:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23333333" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>\');background-size:16px 16px;background-repeat:no-repeat;background-position:right 8px center}.custom-select.has-suffix-border{border-right:1px solid #333333}.custom-select.has-prefix-border{border-left:1px solid #333333}::slotted(*){height:100%;box-sizing:border-box}';const X=class{constructor(i){t(this,i);this.valueChanged=e(this,"valueChanged");this.options=[];this.selectStyles={};this.hasSuffixContent=false;this.hasPrefixContent=false;this.handleSelectChange=t=>{const e=t.target.value;if(this.internalValue!==e){this.internalValue=e;this.valueChanged.emit(this.internalValue)}};this.evaluateSuffixContent=()=>{if(this.suffixSlotElement){const t=this.suffixSlotElement.assignedNodes({flatten:true}).length>0;if(this.hasSuffixContent!==t){this.hasSuffixContent=t}}else{if(this.hasSuffixContent!==false){this.hasSuffixContent=false}}};this.evaluatePrefixContent=()=>{if(this.prefixSlotElement){const t=this.prefixSlotElement.assignedNodes({flatten:true}).length>0;if(this.hasPrefixContent!==t){this.hasPrefixContent=t}}else{if(this.hasPrefixContent!==false){this.hasPrefixContent=false}}}}componentWillLoad(){this.updateInternalValue(this.value,false);this.evaluateSuffixContent();this.evaluatePrefixContent()}externalValueChanged(t){if(t!==this.internalValue){this.updateInternalValue(t,false)}}optionsChanged(){this.updateInternalValue(this.internalValue,true)}updateInternalValue(t,e){let i=t;if(this.options&&this.options.length>0){const t=this.options.some((t=>t.value===i));if(!i||!t){i=this.options[0].value}}else{i=undefined}if(this.internalValue!==i){this.internalValue=i;if(e||t!==i&&t!==undefined){this.valueChanged.emit(this.internalValue)}}}render(){const t={"custom-select":true,"has-suffix-border":this.hasSuffixContent,"has-prefix-border":this.hasPrefixContent};return i(s,{key:"32c5f5a4f807c1e316c91b795c005b8d30ce6189"},i("div",{key:"b1cbeff18e688da4a2f7472be290b9527a619f07",class:"dropdown-wrapper"},i("slot",{key:"b3bbb7e21c6f5620cab41aa4b1c7206b6c75fd86",name:"prefix",ref:t=>this.prefixSlotElement=t,onSlotchange:this.evaluatePrefixContent}),i("select",{key:"8b2dcdc125bee59cf29fce7c980b755e78d5816e",class:t,style:Object.assign(Object.assign({},this.selectStyles),{width:this.width}),onInput:this.handleSelectChange},this.options.map((t=>i("option",{value:t.value,style:t.style,selected:t.value===this.internalValue},t.label)))),i("slot",{key:"8d83f0dea41ac959bf2392948efef33bb70d0154",name:"suffix",ref:t=>this.suffixSlotElement=t,onSlotchange:this.evaluateSuffixContent})))}static get watchers(){return{value:["externalValueChanged"],options:["optionsChanged"]}}};X.style=H;class K{static register(t,e){if(this.registry.has(t)){console.warn(`[IconRegistry] Icon "${t}" is already registered. It will be overwritten.`)}this.registry.set(t,e)}static get(t){return this.registry.get(t)}static registerIcons(t){for(const e in t){if(Object.prototype.hasOwnProperty.call(t,e)){this.register(e,t[e])}}}static has(t){return this.registry.has(t)}}K.registry=new Map;K.registerIcons({cursor:'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4.037 4.688a.495.495 0 0 1 .651-.651l16 6.5a.5.5 0 0 1-.063.947l-6.124 1.58a2 2 0 0 0-1.438 1.435l-1.579 6.126a.5.5 0 0 1-.947.063z"/></svg>',pen:'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"/></svg>',highlighter:'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-highlighter-icon lucide-highlighter"><path d="m9 11-6 6v3h9l3-3"/><path d="m22 12-4.6 4.6a2 2 0 0 1-2.8 0l-5.2-5.2a2 2 0 0 1 0-2.8L14 4"/></svg>',eraser:'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="m7 21-4.3-4.3c-1-1-1-2.5 0-3.4l9.6-9.6c1-1 2.5-1 3.4 0l5.6 5.6c1 1 1 2.5 0 3.4L13 21"/><path d="M22 21H7"/><path d="m5 11 9 9"/></svg>',type:'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="4 7 4 4 20 4 20 7"/><line x1="9" x2="15" y1="20" y2="20"/><line x1="12" x2="12" y1="4" y2="20"/></svg>',image:'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect width="18" height="18" x="3" y="3" rx="2" ry="2"/><circle cx="9" cy="9" r="2"/><path d="m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21"/></svg>',"chevron-down":'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg>',"chevron-up":'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="m18 15-6-6-6 6"/></svg>',copy:'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy-icon lucide-copy"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"/><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/></svg>',paste:'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-clipboard-paste-icon lucide-clipboard-paste"><path d="M11 14h10"/><path d="M16 4h2a2 2 0 0 1 2 2v1.344"/><path d="m17 18 4-4-4-4"/><path d="M8 4H6a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h12a2 2 0 0 0 1.793-1.113"/><rect x="8" y="2" width="8" height="4" rx="1"/></svg>',cut:'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-scissors-icon lucide-scissors"><circle cx="6" cy="6" r="3"/><path d="M8.12 8.12 12 12"/><path d="M20 4 8.12 15.88"/><circle cx="6" cy="18" r="3"/><path d="M14.8 14.8 20 20"/></svg>',delete:'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash2-icon lucide-trash-2"><path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/><line x1="10" x2="10" y1="11" y2="17"/><line x1="14" x2="14" y1="11" y2="17"/></svg>',"bring-to-front":'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-up-to-line-icon lucide-arrow-up-to-line"><path d="M5 3h14"/><path d="m18 13-6-6-6 6"/><path d="M12 7v14"/></svg>',"send-to-back":'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-down-to-line-icon lucide-arrow-down-to-line"><path d="M12 17V3"/><path d="m6 11 6 6 6-6"/><path d="M19 21H5"/></svg>',"select-all":'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-mouse-pointer-icon lucide-square-mouse-pointer"><path d="M12.034 12.681a.498.498 0 0 1 .647-.647l9 3.5a.5.5 0 0 1-.033.943l-3.444 1.068a1 1 0 0 0-.66.66l-1.067 3.443a.5.5 0 0 1-.943.033z"/><path d="M21 11V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h6"/></svg>',download:'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-download-icon lucide-download"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" x2="12" y1="15" y2="3"/></svg>',undo:'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-undo-icon lucide-undo"><path d="M3 7v6h6"/><path d="M21 17a9 9 0 0 0-9-9 9 9 0 0 0-6 2.3L3 13"/></svg>',redo:'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-redo-icon lucide-redo"><path d="M21 7v6h-6"/><path d="M3 17a9 9 0 0 1 9-9 9 9 0 0 1 6 2.3l3 2.7"/></svg>'});const Y=1e3;const U=1e-4;const q="kritzel-editor{display:flex;margin:0;position:relative;overflow:hidden;width:100%;height:100%;align-items:center;justify-content:center;touch-action:manipulation;user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}kritzel-controls{position:absolute;bottom:28px}";const N=class{constructor(i){t(this,i);this.isReady=e(this,"isReady");this.scaleMax=Y;this.scaleMin=U;this.controls=[{name:"selection",type:"tool",tool:h,icon:"cursor"},{name:"brush",type:"tool",tool:n,isDefault:true,icon:"pen",config:a},{name:"eraser",type:"tool",tool:c,icon:"eraser"},{name:"text",type:"tool",tool:r,icon:"type",config:d},{name:"image",type:"tool",tool:f,icon:"image"},{name:"divider",type:"divider"},{name:"config",type:"config"}];this.globalContextMenuItems=[{label:"Paste",icon:"paste",disabled:async()=>(await this.engineRef.getCopiedObjects()).length===0,action:t=>this.engineRef.paste(t.x,t.y)},{label:"Select All",icon:"select-all",action:()=>this.selectAllObjectsInViewport()}];this.objectContextMenuItems=[{label:"Edit",icon:"pen",visible:(t,e)=>e.length===1&&e[0].isEditable,action:(t,e)=>{if(e.length===1){const t=e[0];if(t.isEditable){t.edit()}}}},{label:"Copy",icon:"copy",action:()=>this.engineRef.copy()},{label:"Paste",icon:"paste",disabled:async()=>(await this.engineRef.getCopiedObjects()).length===0,action:(t,e)=>this.engineRef.paste(t.x,t.y)},{label:"Delete",icon:"delete",action:()=>this.engineRef.delete()},{label:"Bring to Front",icon:"bring-to-front",action:()=>this.engineRef.moveToTop()},{label:"Send to Back",icon:"send-to-back",action:()=>this.engineRef.moveToBottom()}];this.customSvgIcons={};this.isControlsVisible=true;this.isUtilityPanelVisible=true;this.isEngineReady=false;this.isControlsReady=false}onIsEngineReady(t){if(t&&this.isControlsReady){this.checkIsReady()}}onIsControlsReady(t){if(t&&this.isEngineReady){this.checkIsReady()}}async getObjectById(t){return this.engineRef.getObjectById(t)}async addObject(t){return this.engineRef.addObject(t)}async updateObject(t,e){return this.engineRef.updateObject(t,e)}async removeObject(t){return this.engineRef.removeObject(t)}async getSelectedObjects(){return this.engineRef.getSelectedObjects()}async selectObjects(t){return this.engineRef.selectObjects(t)}async selectAllObjectsInViewport(){return this.engineRef.selectAllObjectsInViewport()}async clearSelection(){this.engineRef.clearSelection()}async centerObjectInViewport(t){return this.engineRef.centerObjectInViewport(t)}handleTouchStart(t){if(t.cancelable){t.preventDefault()}}handleKeyDown(t){var e;if(t.key==="Escape"){t.preventDefault();(e=this.controlsRef)===null||e===void 0?void 0:e.closeTooltip()}}componentDidLoad(){this.registerCustomSvgIcons()}async checkIsReady(){await customElements.whenDefined("kritzel-editor");await customElements.whenDefined("kritzel-controls");await customElements.whenDefined("kritzel-engine");if(!this.isEngineReady||!this.isControlsReady){return}this.isReady.emit(this.host)}registerCustomSvgIcons(){for(const[t,e]of Object.entries(this.customSvgIcons)){K.register(t,e)}}render(){return i(s,{key:"2b269b9caee7c54eaea7782e22b0aa4620a89787"},i("kritzel-engine",{key:"9ba5fbb01d673fdc74c1d9789640f3e513d290d2",ref:t=>this.engineRef=t,onIsEngineReady:()=>this.isEngineReady=true,scaleMax:this.scaleMax,scaleMin:this.scaleMin,globalContextMenuItems:this.globalContextMenuItems,objectContextMenuItems:this.objectContextMenuItems}),i("kritzel-controls",{key:"f21688e22f401430966561f5992049c9faf077c1",ref:t=>this.controlsRef=t,controls:this.controls,isUtilityPanelVisible:this.isUtilityPanelVisible,style:this.isControlsVisible?{display:"flex"}:{display:"none"},onIsControlsReady:()=>this.isControlsReady=true}))}get host(){return o(this)}static get watchers(){return{isEngineReady:["onIsEngineReady"],isControlsReady:["onIsControlsReady"]}}};N.style=q;class G{constructor(t,e){this.initialTouchDistance=0;this.startX=0;this.startY=0;this._store=t;this._store.state.host=e;this._store.state.viewportWidth=e.clientWidth;this._store.state.viewportHeight=e.clientHeight;this._store.state.startX=0;this._store.state.startY=0;this._store.state.translateX=0;this._store.state.translateY=0}handleResize(){this._store.state.viewportWidth=this._store.state.host.clientWidth;this._store.state.viewportHeight=this._store.state.host.clientHeight;this._store.state.hasViewportChanged=true;this._store.rerender()}handlePointerDown(t){if(t.pointerType==="mouse"){const e=t.clientX-this._store.offsetX;const i=t.clientY-this._store.offsetY;if(t.button===l.Right){this._store.state.isPanning=true;this._store.state.startX=e;this._store.state.startY=i}}if(t.pointerType==="touch"){const t=Array.from(this._store.state.pointers.values());if(t.length===2){this._store.state.currentPath=null;this._store.state.isScaling=true;const e=t[0].clientX-this._store.offsetX;const i=t[0].clientY-this._store.offsetY;const s=t[1].clientX-this._store.offsetX;const o=t[1].clientY-this._store.offsetY;this.initialTouchDistance=Math.sqrt(Math.pow(e-s,2)+Math.pow(i-o,2));this.startX=(e+s)/2;this.startY=(i+o)/2;this._store.rerender()}}}handlePointerMove(t){if(t.pointerType==="mouse"){const e=t.clientX-this._store.offsetX;const i=t.clientY-this._store.offsetY;this._store.state.cursorX=e;this._store.state.cursorY=i;if(this._store.state.isPanning){this._store.state.translateX-=this._store.state.startX-e;this._store.state.translateY-=this._store.state.startY-i;this._store.state.startX=e;this._store.state.startY=i;this._store.state.hasViewportChanged=true;this._store.state.skipContextMenu=true;this._store.rerender()}}if(t.pointerType==="touch"){const t=Array.from(this._store.state.pointers.values());if(t.length===2){const e=t[0].clientX-this._store.offsetX;const i=t[0].clientY-this._store.offsetY;const s=t[1].clientX-this._store.offsetX;const o=t[1].clientY-this._store.offsetY;const n=Math.sqrt(Math.pow(e-s,2)+Math.pow(i-o,2));const r=(e+s)/2;const l=(i+o)/2;const h=n/this.initialTouchDistance;const a=this._store.state.scale*h;if(a>this._store.state.scaleMax||a<this._store.state.scaleMin){this._store.state.translateX+=r-this.startX;this._store.state.translateY+=l-this.startY}else{const t=(r-this._store.state.translateX)*(h-1);const e=(l-this._store.state.translateY)*(h-1);this._store.state.translateX+=r-this.startX-t;this._store.state.translateY+=l-this.startY-e;this._store.state.scale=a;this.initialTouchDistance=n}this.startX=r;this.startY=l;this._store.state.hasViewportChanged=true;this._store.rerender()}}}handlePointerUp(t){if(t.pointerType==="mouse"){if(this._store.state.isPanning){this._store.state.isPanning=false;this._store.rerender()}}if(t.pointerType==="touch"){this._store.state.isScaling=false;this._store.rerender()}}handleWheel(t){t.preventDefault();if(t.ctrlKey===true&&u.isMainMouseWheel(t)){this.handleZoom(t)}if(!t.ctrlKey){this.handlePan(t)}}handleZoom(t){const e=this._store.state.host.getBoundingClientRect();this._store.state.cursorX=t.clientX-e.left;this._store.state.cursorY=t.clientY-e.top;const i=t.deltaY>0?-this._store.state.scaleStep*this._store.state.scale:this._store.state.scaleStep*this._store.state.scale;const s=Math.min(this._store.state.scaleMax,Math.max(this._store.state.scaleMin,this._store.state.scale+i));const o=s/this._store.state.scale;const n=(this._store.state.cursorX-this._store.state.translateX)*(o-1);const r=(this._store.state.cursorY-this._store.state.translateY)*(o-1);this._store.state.scale=s;this._store.state.translateX-=n;this._store.state.translateY-=r;this._store.state.hasViewportChanged=true;this._store.rerender()}handlePan(t){const e=.8;this._store.state.translateX-=t.deltaX*e;this._store.state.translateY-=t.deltaY*e;this._store.state.hasViewportChanged=true;this._store.rerender()}}class Z extends b{constructor(t,e,i){super(t,e);this.previousViewport=i;this.currentViewport={scale:this._store.state.scale,translateX:this._store.state.translateX,translateY:this._store.state.translateY}}execute(){this._store.state.scale=this.currentViewport.scale;this._store.state.translateX=this.currentViewport.translateX;this._store.state.translateY=this.currentViewport.translateY}undo(){this._store.state.scale=this.previousViewport.scale;this._store.state.translateX=this.previousViewport.translateX;this._store.state.translateY=this.previousViewport.translateY}}class J{constructor(t){this.head=0;this.tail=0;this.size=0;this.capacity=t;this.buffer=new Array(t).fill(null)}add(t){this.buffer[this.head]=t;this.head=(this.head+1)%this.capacity;if(this.size<this.capacity){this.size++}else{this.tail=(this.tail+1)%this.capacity}}pop(){if(this.size===0){return null}this.head=(this.head-1+this.capacity)%this.capacity;const t=this.buffer[this.head];this.buffer[this.head]=null;this.size--;return t}peek(){if(this.size===0){return null}const t=(this.head-1+this.capacity)%this.capacity;return this.buffer[t]}isEmpty(){return this.size===0}clear(){this.buffer.fill(null);this.head=0;this.tail=0;this.size=0}}class Q{constructor(t){this._store=t;this.undoStack=new J(this._store.state.historyBufferSize);this.redoStack=new J(this._store.state.historyBufferSize);this.previousViewport={scale:this._store.state.scale,scaleStep:this._store.state.scaleStep,translateX:this._store.state.translateX,translateY:this._store.state.translateY}}executeCommand(t){if(this._store.state.hasViewportChanged){const t=new Z(this._store,this,this.previousViewport);t.execute();this.undoStack.add(t);if(this.redoStack.isEmpty()===false){this.redoStack.clear()}this._store.state.hasViewportChanged=false;this.previousViewport={scale:this._store.state.scale,scaleStep:this._store.state.scaleStep,translateX:this._store.state.translateX,translateY:this._store.state.translateY}}t.execute();if(this._store.state.debugInfo.logCommands)console.info("add",t);this.undoStack.add(t);if(this.redoStack.isEmpty()===false){this.redoStack.clear()}this._store.rerender()}undo(){if(this._store.state.hasViewportChanged){const t=new Z(this._store,this,this.previousViewport);t.undo();this._store.state.hasViewportChanged=false;this._store.rerender();return}const t=this.undoStack.pop();if(t){t.undo();if(this._store.state.debugInfo.logCommands)console.info("undo",t);this.redoStack.add(t)}this._store.rerender()}redo(){const t=this.redoStack.pop();if(t){t.execute();if(this._store.state.debugInfo.logCommands)console.info("redo",t);this.undoStack.add(t)}this._store.rerender()}}class tt{constructor(t,e=8){this.objects=[];this.children=null;this.bounds=t;this.capacity=e}insert(t){if(!this.intersects(t.rotatedBoundingBox,this.bounds)){return false}if(this.objects.length<this.capacity&&this.children===null){this.objects.push(t);return true}if(this.children===null){this.subdivide()}for(const e of this.children){if(e.insert(t)){return true}}return false}update(t){const e=this.objects.findIndex((e=>e.id===t.id));if(e!==-1){this.objects[e]=t;return true}if(this.children!==null){for(const e of this.children){if(e.update(t)){return true}}}return false}remove(t){const e=this.objects.findIndex((e=>t(e)));if(e!==-1){this.objects.splice(e,1)}if(this.children!==null){for(const e of this.children){e.remove(t)}}}query(t){const e=[];if(!this.intersects(t,this.bounds)){return e}for(const i of this.objects){if(this.intersects(i.rotatedBoundingBox,t)){e.push(i)}}if(this.children!==null){for(const i of this.children){e.push(...i.query(t))}}return e}filter(t){const e=this.objects.filter((e=>t(e)));if(this.children!==null){for(const i of this.children){e.push(...i.filter(t))}}return e}allObjects(){const t=[...this.objects];if(this.children!==null){for(const e of this.children){t.push(...e.allObjects())}}return t}subdivide(){const{x:t,y:e,z:i,width:s,height:o,depth:n}=this.bounds;const r=s/2;const l=o/2;const h=n/2;this.children=[new tt({x:t,y:e,z:i,width:r,height:l,depth:h},this.capacity),new tt({x:t+r,y:e,z:i,width:r,height:l,depth:h},this.capacity),new tt({x:t,y:e+l,z:i,width:r,height:l,depth:h},this.capacity),new tt({x:t+r,y:e+l,z:i,width:r,height:l,depth:h},this.capacity),new tt({x:t,y:e,z:i+h,width:r,height:l,depth:h},this.capacity),new tt({x:t+r,y:e,z:i+h,width:r,height:l,depth:h},this.capacity),new tt({x:t,y:e+l,z:i+h,width:r,height:l,depth:h},this.capacity),new tt({x:t+r,y:e+l,z:i+h,width:r,height:l,depth:h},this.capacity)]}intersects(t,e){return!(t.x>=e.x+e.width||t.x+t.width<=e.x||t.y>=e.y+e.height||t.y+t.height<=e.y)}}class et extends b{constructor(t,e,i,s){super(t,e);this.object=i;this.updatedProperties=s;this.previousProperties={};for(const t in s){if(s.hasOwnProperty(t)){this.previousProperties[t]=this.object[t]}}}execute(){for(const t in this.updatedProperties){if(this.updatedProperties.hasOwnProperty(t)){this.object[t]=this.updatedProperties[t]}}}undo(){for(const t in this.previousProperties){if(this.previousProperties.hasOwnProperty(t)){this.object[t]=this.previousProperties[t]}}}}const it={activeTool:null,activeText:null,currentPath:null,copiedObjects:null,objectsOctree:null,selectionBox:null,selectionGroup:null,resizeHandleType:null,hasViewportChanged:false,isReady:false,isEnabled:true,isScaling:false,isPanning:false,isFocused:false,isSelecting:false,isResizing:false,isResizeHandleSelected:false,isRotating:false,isRotationHandleSelected:false,isDragging:false,isDrawing:false,isErasing:false,isWriting:false,isCtrlKeyPressed:false,isContextMenuVisible:false,contextMenuItems:[],contextMenuX:0,contextMenuY:0,skipContextMenu:false,debugInfo:{showObjectInfo:false,showViewportInfo:false,logCommands:false},host:null,cursorX:0,cursorY:0,scale:1,scaleMax:1,scaleMin:1,scaleStep:.05,startX:0,startY:0,translateX:0,translateXMax:400,translateXMin:0,translateY:0,translateYMax:400,translateYMin:0,viewportWidth:0,viewportHeight:0,historyBufferSize:1e3,longTouchTimeout:null,longTouchDelay:300,pointers:new Map};class st{get history(){return this._history}get state(){return this._state}get currentZIndex(){return this._state.objectsOctree.filter((t=>!(t instanceof p)&&!(t instanceof v))).length}get allObjects(){return this._state.objectsOctree.allObjects()}get selectedObjects(){return this.allObjects.filter((t=>!(t instanceof p))).filter((t=>t.selected))}get offsetX(){return this._state.host.getBoundingClientRect().left}get offsetY(){return this._state.host.getBoundingClientRect().top}constructor(t){this._listeners=new Map;this.objects=[];this._state=it;this._kritzelEngine=t;this._history=new Q(this);this._state.objectsOctree=new tt({x:-Infinity,y:-Infinity,z:-Infinity,width:Infinity,height:Infinity,depth:Infinity})}rerender(){const t={x:-this._state.translateX/this._state.scale,y:-this._state.translateY/this._state.scale,z:this._state.scale,width:this._state.viewportWidth/this._state.scale,height:this._state.viewportHeight/this._state.scale,depth:100};this.objects=this._state.objectsOctree.query(t);if(this._kritzelEngine){this._kritzelEngine.forceUpdate++}}findObjectById(t){for(const e of this.allObjects){if(e.id===t){return e}}return null}deselectAllObjects(){if(this._state.selectionGroup){this._history.executeCommand(new g(this,this))}}onStateChange(t,e){if(!this._listeners.has(t)){this._listeners.set(t,new Set)}this._listeners.get(t).add(e)}setState(t,e){const i=this._state[t];if(i!==e){this._state[t]=e;if(this._listeners.has(t)){this._listeners.get(t).forEach((s=>s(e,i,String(t))))}}}delete(){if(!this.state.selectionGroup){return}const t=this.state.selectionGroup.objects.map((t=>new y(this,this.state.selectionGroup,t)));const e=new g(this,this.state.selectionGroup);const i=[...t,e];this.history.executeCommand(new k(this,this.state.selectionGroup,i))}deleteObject(t,e=true){const i=this.findObjectById(t);if(i){if(e){const t=new y(this,this,i);this.history.executeCommand(t)}else{this._state.objectsOctree.remove((e=>e.id===t));this.rerender()}}}copy(){this.state.copiedObjects=this.state.selectionGroup.copy()}paste(t,e){this.state.copiedObjects.selected=true;const i=t!==undefined?t:this.state.copiedObjects.translateX+25;const s=e!==undefined?e:this.state.copiedObjects.translateY+25;this.state.copiedObjects.updatePosition(i,s);const o=[];if(this.state.selectionGroup!==null){o.push(new g(this,this.state.selectionGroup))}const n=this.state.copiedObjects.objects.map((t=>new x(this,this,t)));const r=new w(this,this,this.state.copiedObjects);o.push(...n,r);this.history.executeCommand(new k(this,this,o));this.state.isSelecting=false;this.state.copiedObjects=this.state.selectionGroup.copy();this.setState("activeTool",z.getTool("selection"))}bringForward(t){const e=this.allObjects.length+1;const i=t?[t]:this.state.selectionGroup.objects;const s=i.map((t=>{if(t.zIndex===e){return}return new et(this,this,t,{zIndex:t.zIndex+1})}));this.history.executeCommand(new k(this,this,s))}sendBackward(t){const e=0;const i=t?[t]:this.state.selectionGroup.objects;const s=i.map((t=>{if(t.zIndex===e){return}return new et(this,this,t,{zIndex:t.zIndex-1})}));this.history.executeCommand(new k(this,this,s))}bringToFront(t){const e=this.allObjects.length+1;const i=t?[t]:this.state.selectionGroup.objects;const s=i.map((t=>new et(this,this,t,{zIndex:e})));this.history.executeCommand(new k(this,this,s))}sendToBack(t){const e=-1;const i=t?[t]:this.state.selectionGroup.objects;const s=i.map((t=>new et(this,this,t,{zIndex:e})));this.history.executeCommand(new k(this,this,s))}selectObjects(t){if(t.length===0){return}const e=p.create(this);t.forEach((t=>{t.selected=false;e.addOrRemove(t)}));e.selected=true;this.state.selectionGroup=e;if(t.length===1){e.rotation=e.objects[0].rotation}this.history.executeCommand(new w(this,this,e))}selectAllObjectsInViewport(){const t=this._state.objectsOctree.query({x:-this._state.translateX/this._state.scale,y:-this._state.translateY/this._state.scale,z:this._state.scale,width:this._state.viewportWidth/this._state.scale,height:this._state.viewportHeight/this._state.scale,depth:100}).filter((t=>!(t instanceof p)&&!(t instanceof v)&&!(t instanceof E)));if(t.length>0){const e=p.create(this);t.forEach((t=>{t.selected=false;e.addOrRemove(t)}));e.selected=true;this.state.isSelecting=false;if(t.length===1){e.rotation=e.objects[0].rotation}this.history.executeCommand(new w(this,this,e));this.setState("activeTool",z.getTool("selection"))}}clearSelection(){const t=new g(this,this.state.selectionGroup);this.history.executeCommand(t);this.state.selectionGroup=null;this.state.selectionBox=null;this.state.isSelecting=false;this.state.isResizeHandleSelected=false;this.state.isRotationHandleSelected=false}resetActiveText(){if(this.state.activeText&&this.state.activeText.value===" "){this.deleteObject(this.state.activeText.id,false);this.history.undoStack.pop()}this.state.activeText=null}getObjectFromPointerEvent(t,e=".object"){var i;const s=(i=this.state.host)===null||i===void 0?void 0:i.shadowRoot;if(!s)return null;const o=t.clientX;const n=t.clientY;const r=s.elementFromPoint(o,n);if(!r)return null;const l=r.closest(e);if(l){return this.allObjects.find((t=>l.id===t.id))}return null}}class ot extends m{constructor(t){super(t)}handleKeyDown(t){if(this._store.state.isFocused===false){t.preventDefault();return}this._store.state.isCtrlKeyPressed=t.ctrlKey;if(this._store.state.isCtrlKeyPressed){t.preventDefault()}if(t.key==="Escape"&&this._store.state.selectionGroup){this._store.clearSelection()}if(t.key==="Delete"&&this._store.state.selectionGroup){this._store.delete()}if(t.key==="z"&&t.ctrlKey){this._store.history.undo()}if(t.key==="y"&&t.ctrlKey){this._store.history.redo()}if(t.key==="s"&&t.ctrlKey){this._store.setState("activeTool",z.getTool("selection"));this._store.deselectAllObjects()}if(t.key==="b"&&t.ctrlKey){this._store.setState("activeTool",z.getTool("brush"));this._store.deselectAllObjects()}if(t.key==="e"&&t.ctrlKey){this._store.setState("activeTool",z.getTool("eraser"));this._store.deselectAllObjects()}if(t.key==="i"&&t.ctrlKey){this._store.setState("activeTool",z.getTool("image"));this._store.deselectAllObjects()}if(t.key==="x"&&t.ctrlKey){this._store.setState("activeTool",z.getTool("text"));this._store.deselectAllObjects()}if(t.key==="c"&&t.ctrlKey&&this._store.state.selectionGroup){this._store.copy();this._store.rerender()}if(t.key==="v"&&t.ctrlKey&&this._store.state.copiedObjects){this._store.paste()}if(t.key==="+"&&t.ctrlKey&&this._store.state.selectionGroup){this._store.bringForward()}if(t.key==="-"&&t.ctrlKey&&this._store.state.selectionGroup){this._store.sendBackward()}if(t.key==="*"&&t.shiftKey&&this._store.state.selectionGroup){this._store.bringToFront()}if(t.key==="_"&&t.shiftKey&&this._store.state.selectionGroup){this._store.sendToBack()}if(t.key==="a"&&t.ctrlKey&&this._store.state.activeText){this._store.state.activeText.selectAll()}if(t.key==="v"&&t.ctrlKey&&this._store.state.activeText){this._store.state.activeText.insertFromClipboard()}}handleKeyUp(t){if(this._store.state.isFocused===false){return}this._store.state.isCtrlKeyPressed=t.ctrlKey}}class nt extends m{constructor(t,e,i){super(t);this.globalContextMenuItems=[];this.objectContextMenuItems=[];this.globalContextMenuItems=e;this.objectContextMenuItems=i}handleContextMenu(t){if(this._store.state.skipContextMenu){this._store.state.skipContextMenu=false;return}const e=this._store.getObjectFromPointerEvent(t,".object");if(e&&!(e instanceof p)){this._store.state.selectionGroup=p.create(this._store);this._store.state.selectionGroup.addOrRemove(e);this._store.state.selectionGroup.selected=true;this._store.state.selectionGroup.rotation=e.rotation;this._store.state.isSelecting=false;this._store.history.executeCommand(new w(this._store,this,this._store.state.selectionGroup))}this._store.state.contextMenuItems=this._store.state.selectionGroup?this.objectContextMenuItems:this.globalContextMenuItems;let i=t.clientX-this._store.offsetX;let s=t.clientY-this._store.offsetY;const o=150;const n=200;const r=10;if(i+o>window.innerWidth-r){i=window.innerWidth-o-r}if(s+n>window.innerHeight-r){s=window.innerHeight-n-r}i=Math.max(r,i);s=Math.max(r,s);this._store.state.contextMenuX=i;this._store.state.contextMenuY=s;this._store.state.isContextMenuVisible=true;this._store.state.isEnabled=false;this._store.rerender()}}class rt{static isInstanceOf(t,e){return t.__class__===e}}const lt=":host{display:block;position:relative;height:100%;width:100%;overflow:hidden;background-color:var(--kritzel-engine-background-color, #ffffff)}:host,:host *{touch-action:none;user-select:none}.debug-panel{position:absolute;pointer-events:none;top:0;right:0}.origin{position:relative;top:0;left:0;height:0;width:0;pointer-events:none;-webkit-transform-origin:top left;-moz-transform-origin:top left;transform-origin:top left;overflow:visible}.object{overflow:visible}textarea{all:unset;box-sizing:border-box;outline:none !important;border:none !important;overflow:visible}.resize-handle-overlay.top-left,.resize-handle-overlay.bottom-right{cursor:nwse-resize}.resize-handle-overlay.top-right,.resize-handle-overlay.bottom-left{cursor:nesw-resize}.rotation-handle-overlay{cursor:grab}";const ht=class{validateScaleMax(t){if(t>Y){console.warn(`scaleMax cannot be greater than ${Y}.`);this.scaleMax=Y;this.store.state.scaleMax=this.scaleMax}else{this.store.state.scaleMax=t}}validateScaleMin(t){if(t<U){console.warn(`scaleMin cannot be less than ${U}.`);this.scaleMin=U;this.store.state.scaleMin=this.scaleMin}else{this.store.state.scaleMin=t}}get isSelecting(){return this.store.state.activeTool instanceof h&&this.store.state.isSelecting}get isSelectionActive(){return this.store.state.activeTool instanceof h&&this.store.state.selectionGroup!==null}constructor(i){t(this,i);this.isEngineReady=e(this,"isEngineReady");this.activeToolChange=e(this,"activeToolChange");this.scaleMax=Y;this.scaleMin=U;this.forceUpdate=0;this.contextMenuElement=null;this.store=new st(this)}componentWillLoad(){this.validateScaleMax(this.scaleMax);this.validateScaleMin(this.scaleMin)}componentDidLoad(){this.contextMenuHandler=new nt(this.store,this.globalContextMenuItems,this.objectContextMenuItems);this.keyHandler=new ot(this.store);this.viewport=new G(this.store,this.host);this._registerStateChangeListeners();if(this.store.state.isReady===false){this.store.state.isReady=true;this.isEngineReady.emit()}}handleWheel(t){var e,i;if(this.store.state.isContextMenuVisible){this.hideContextMenu()}this.viewport.handleWheel(t);(i=(e=this.store.state)===null||e===void 0?void 0:e.activeTool)===null||i===void 0?void 0:i.handleWheel(t)}handlePointerDown(t){var e,i;if(u.isPointerEventOnContextMenu(t)===false&&this.store.state.isContextMenuVisible){this.hideContextMenu();return}if(this.store.state.isEnabled===false){return}u.onLongTouchPress(t,(t=>{if(!(this.store.state.activeTool instanceof h)){return}this.contextMenuHandler.handleContextMenu(t)}));this.host.setPointerCapture(t.pointerId);this.store.state.pointers.set(t.pointerId,t);this.viewport.handlePointerDown(t);(i=(e=this.store.state)===null||e===void 0?void 0:e.activeTool)===null||i===void 0?void 0:i.handlePointerDown(t)}handlePointerMove(t){var e,i;if(this.store.state.isEnabled===false){return}this.store.state.pointers.set(t.pointerId,t);this.viewport.handlePointerMove(t);(i=(e=this.store.state)===null||e===void 0?void 0:e.activeTool)===null||i===void 0?void 0:i.handlePointerMove(t)}handlePointerUp(t){var e,i;if(this.store.state.isEnabled===false){return}this.store.state.pointers.delete(t.pointerId);this.host.releasePointerCapture(t.pointerId);this.viewport.handlePointerUp(t);(i=(e=this.store.state)===null||e===void 0?void 0:e.activeTool)===null||i===void 0?void 0:i.handlePointerUp(t)}handlePointerCancel(t){var e,i;if(this.store.state.isEnabled===false){return}this.host.releasePointerCapture(t.pointerId);this.store.state.pointers.delete(t.pointerId);this.viewport.handlePointerUp(t);(i=(e=this.store.state)===null||e===void 0?void 0:e.activeTool)===null||i===void 0?void 0:i.handlePointerUp(t)}handleContextMenu(t){t.preventDefault();if(this.store.state.isEnabled===false){return}if(t.pointerType==="touch"){return}this.contextMenuHandler.handleContextMenu(t)}handleResize(){this.viewport.handleResize()}handleKeyDown(t){this.keyHandler.handleKeyDown(t)}handleKeyUp(t){this.keyHandler.handleKeyUp(t)}updateFocus(t){const e=this.store.state.host.getBoundingClientRect();const i=t.clientX>=e.left&&t.clientX<=e.right&&t.clientY>=e.top&&t.clientY<=e.bottom;const s=t.composedPath();const o=this.host.closest("kritzel-engine");const n=s.includes(o||this.host);this.store.setState("isFocused",i&&n)}async registerTool(t,e,i){if(typeof e!=="function"||!(e.prototype instanceof C)){console.error(`Failed to register tool "${t}": Tool class must be a constructor function`);return null}const s=z.registerTool(t,e,this.store);if(i){Object.entries(i).forEach((([t,e])=>{s[t]=e}))}return Promise.resolve(s)}async changeActiveTool(t){var e;(e=this.store.state.activeTool)===null||e===void 0?void 0:e.onDeactivate();this.store.setState("activeTool",t);this.store.deselectAllObjects();t===null||t===void 0?void 0:t.onActivate()}async setFocus(){this.host.focus();this.store.state.isFocused=true}async disable(){this.store.state.isEnabled=false;this.forceUpdate++}async enable(){this.store.state.isEnabled=true;this.forceUpdate++}async delete(){this.store.delete()}async copy(){this.store.copy()}async paste(t,e){this.store.paste(t,e)}async bringForward(t){this.store.bringForward(t)}async sendBackward(t){this.store.sendBackward(t)}async moveToTop(t){this.store.bringToFront(t)}async moveToBottom(t){this.store.sendToBack(t)}async undo(){this.store.history.undo()}async redo(){this.store.history.redo()}async hideContextMenu(){this.store.state.pointers.clear();this.store.state.isContextMenuVisible=false;this.store.state.selectionBox=null;this.store.state.isSelecting=false}async getObjectById(t){const e=this.store.objects.find((e=>e.id===t));return e||null}async addObject(t){this.store.deselectAllObjects();t.id=t.generateId();t._store=this.store;t.scale=t.scale?t.scale:this.store.state.scale;t.zIndex=this.store.currentZIndex;const e=new x(this.store,this,t);this.store.history.executeCommand(e);return t}async updateObject(t,e){this.store.deselectAllObjects();const i=new et(this.store,this,t,e);this.store.history.executeCommand(i);return t}async removeObject(t){this.store.deselectAllObjects();const e=new y(this.store,this,t);this.store.history.executeCommand(e);return t}async getSelectedObjects(){return this.store.state.selectionGroup?this.store.state.selectionGroup.objects:[]}async selectObjects(t){var e;(e=this.store.state.activeTool)===null||e===void 0?void 0:e.onDeactivate();this.store.setState("activeTool",z.getTool("selection"));this.store.deselectAllObjects();this.store.selectObjects(t);console.log("Selected objects:",t)}async selectAllObjectsInViewport(){var t;(t=this.store.state.activeTool)===null||t===void 0?void 0:t.onDeactivate();this.store.setState("activeTool",z.getTool("selection"));this.store.deselectAllObjects();this.store.selectAllObjectsInViewport()}async clearSelection(){this.store.clearSelection()}async centerObjectInViewport(t){t.centerInViewport();const e=new et(this.store,this,t,t);this.store.history.executeCommand(e);return t}async getCopiedObjects(){var t;return((t=this.store.state.copiedObjects)===null||t===void 0?void 0:t.objects)||[]}_registerStateChangeListeners(){this.store.onStateChange("activeTool",this._handleActiveToolChange.bind(this));this.store.onStateChange("isFocused",this._handleIsFocusedChange.bind(this))}_handleActiveToolChange(t){if(!(t instanceof h)){this.store.clearSelection()}this.store.state.skipContextMenu=false;this.activeToolChange.emit(t);j.forceHideKeyboard()}_handleIsFocusedChange(t){if(!t){this.store.resetActiveText()}}render(){var t,e,o,n,r,l,h,a,d,f,u,b,p,v,g,y,k,x,w,z,m,C,j,M,I,S,T,$;const O=window.getComputedStyle(this.host);const B=O.getPropertyValue("--kritzel-selection-handle-size").trim()||"6px";const E=parseFloat(B);const _=E*2<14?14:E;return i(s,{key:"d484b59ebdea9e7b9e8e086c39e7b3a339fb034d"},i("div",{key:"ea68c0a3c0020110b5aca6f3a7bdfab223b64744",class:"debug-panel",style:{display:this.store.state.debugInfo.showViewportInfo?"block":"none"}},i("div",{key:"4a7c60073190f2123dbb6bda4e206a1b488db7ac"},"TranslateX: ",(t=this.store.state)===null||t===void 0?void 0:t.translateX),i("div",{key:"c4fe558accb441fb06ff048f41b07b520ffde505"},"TranslateY: ",(e=this.store.state)===null||e===void 0?void 0:e.translateY),i("div",{key:"00d5fd0b0ec3c79f9ab1dc9a1032fa2f70c7c246"},"ViewportWidth: ",(o=this.store.state)===null||o===void 0?void 0:o.viewportWidth),i("div",{key:"87c8f03bfcc6de031e3d9d74576a6028bfc155bc"},"ViewportHeight: ",(n=this.store.state)===null||n===void 0?void 0:n.viewportHeight),i("div",{key:"f4e82ddee133818b6ad60b5b6c5e9e721fce4968"},"ObjectsInViewport. ",this.store.objects.length),i("div",{key:"4f9018ce1184b676248614d4edfdeffd49ac7ce2"},"Scale: ",(r=this.store.state)===null||r===void 0?void 0:r.scale),i("div",{key:"cc5d72952bc4b80a42d26ca1b1e56bcab96ab76c"},"ActiveTool: ",(h=(l=this.store.state)===null||l===void 0?void 0:l.activeTool)===null||h===void 0?void 0:h.name),i("div",{key:"387071b0ea3f2064d1ea0e0495aa92de8072a900"},"HasViewportChanged: ",((a=this.store.state)===null||a===void 0?void 0:a.hasViewportChanged)?"true":"false"),i("div",{key:"a386b4fb631860b94f710cb601b1809283ab9664"},"IsEnabled: ",((d=this.store.state)===null||d===void 0?void 0:d.isEnabled)?"true":"false"),i("div",{key:"a67ad19caa6a6cafa8b19dace26c25d60347090a"},"IsScaling: ",((f=this.store.state)===null||f===void 0?void 0:f.isScaling)?"true":"false"),i("div",{key:"9fe3152ba0a3e936b6c6551673de3a67bd5de0d1"},"IsPanning: ",((u=this.store.state)===null||u===void 0?void 0:u.isPanning)?"true":"false"),i("div",{key:"8103da258c7bdede340c6c64188a2f9657af16c3"},"IsFocused: ",this.store.state.isFocused?"true":"false"),i("div",{key:"10b315366f6cf8eb2f27a20083094c9e483c2fe3"},"IsSelecting: ",this.isSelecting?"true":"false"),i("div",{key:"b65926aca01fe6b41f70e8d7484674f568e9945a"},"IsSelectionActive: ",this.isSelectionActive?"true":"false"),i("div",{key:"5e95a4268ab30bf06918e83aa5f7e96b5ee1dbe2"},"IsResizeHandleSelected: ",this.store.state.isResizeHandleSelected?"true":"false"),i("div",{key:"3922b7fcb2b74ec28f515db8254f05b454ef6b12"},"IsRotationHandleSelected: ",this.store.state.isRotationHandleSelected?"true":"false"),i("div",{key:"13c162ec56f0990948bac4569c28a6076582c7ea"},"IsDrawing: ",this.store.state.isDrawing?"true":"false"),i("div",{key:"f909cbc959961e47dbff28e5c620175dc04f6873"},"IsWriting: ",this.store.state.isWriting?"true":"false"),i("div",{key:"505122e286976b8fa9e9fac5b131bcecb359eaae"},"CursorX: ",(b=this.store.state)===null||b===void 0?void 0:b.cursorX),i("div",{key:"116217379cf67a0a268e97912ec44d52a98c434b"},"CursorY: ",(p=this.store.state)===null||p===void 0?void 0:p.cursorY)),i("div",{key:"b0bcbb90404d0cbc1281b932bd13e67df612d58d",class:"origin",style:{transform:`matrix(${(v=this.store.state)===null||v===void 0?void 0:v.scale}, 0, 0, ${(g=this.store.state)===null||g===void 0?void 0:g.scale}, ${(y=this.store.state)===null||y===void 0?void 0:y.translateX}, ${(k=this.store.state)===null||k===void 0?void 0:k.translateY})`}},(x=this.store.objects)===null||x===void 0?void 0:x.map((t=>{var e,s,o,n,r,l,h,a,c,d,f,u,b,p,v,g,y,k,x;return i("div",{style:{transform:t===null||t===void 0?void 0:t.transformationMatrix,transformOrigin:"top left",zIndex:t.zIndex.toString(),position:"absolute"}},i("svg",{xmlns:"http://www.w3.org/2000/svg",key:t.id,id:t.id,class:"object",style:{height:t===null||t===void 0?void 0:t.totalHeight.toString(),width:t===null||t===void 0?void 0:t.totalWidth.toString(),left:"0",top:"0",position:"absolute",transform:`rotate(${t.rotationDegrees}deg)`,transformOrigin:"center",opacity:t.markedForRemoval?"0.5":t.opacity.toString(),pointerEvents:t.markedForRemoval?"none":"auto"}},i("foreignObject",{x:"0",y:"0",width:t.totalWidth.toString(),height:t.totalHeight.toString(),style:{minHeight:"0",minWidth:"0",backgroundColor:t.backgroundColor,borderColor:t.borderColor,borderWidth:t.borderWidth+"px",borderStyle:"solid",padding:t.padding+"px",overflow:"visible"}},rt.isInstanceOf(t,"KritzelPath")&&i("svg",{ref:e=>t.mount(e),xmlns:"http://www.w3.org/2000/svg",style:{height:t===null||t===void 0?void 0:t.height.toString(),width:t===null||t===void 0?void 0:t.width.toString(),position:"absolute",overflow:"visible"},viewBox:t===null||t===void 0?void 0:t.viewBox},i("path",{d:t===null||t===void 0?void 0:t.d,fill:t.fill,stroke:t===null||t===void 0?void 0:t.stroke})),rt.isInstanceOf(t,"KritzelImage")&&i("img",{ref:e=>t.mount(e),src:t.src,style:{width:"100%",height:"100%",userSelect:"none",pointerEvents:"none"},draggable:false,onDragStart:t=>t.preventDefault()}),rt.isInstanceOf(t,"KritzelText")&&i("textarea",{ref:e=>t.mount(e),value:t.value,onKeyDown:e=>t.handleKeyDown(e),onInput:e=>t.handleInput(e),rows:t.rows,style:{width:"100%",height:"100%",color:t.fontColor,fontSize:((e=t.fontSize)===null||e===void 0?void 0:e.toString())+"px",fontFamily:t.fontFamily,border:"none",outline:"none",resize:"none",overflow:"hidden",display:"block",padding:"1px",whiteSpace:"nowrap",pointerEvents:t.isReadonly?"none":"auto",cursor:t.isReadonly?"default":"text",caretColor:t.isReadonly?"transparent":"auto"}}),rt.isInstanceOf(t,"KritzelSelectionGroup")&&i("div",{ref:e=>t.mount(e),style:{width:"100%",height:"100%"}}),rt.isInstanceOf(t,"KrtizelSelectionBox")&&i("div",{ref:e=>t.mount(e),style:{width:"100%",height:"100%"}})),i("line",{x1:"0",y1:"0",x2:t.totalWidth,y2:"0",style:{stroke:"var(--kritzel-selection-border-color, #0e1111)",strokeWidth:`calc(var(--kritzel-selection-border-width, 2px) * ${t.scale} / ${(s=this.store.state)===null||s===void 0?void 0:s.scale})`,strokeLinecap:"square"},visibility:t.selected?"visible":"hidden"}),i("line",{x1:"0",y1:"0",x2:"0",y2:t.totalHeight,style:{stroke:"var(--kritzel-selection-border-color, #0e1111)",strokeWidth:`calc(var(--kritzel-selection-border-width, 2px) * ${t.scale} / ${(o=this.store.state)===null||o===void 0?void 0:o.scale})`,strokeLinecap:"square"},visibility:t.selected?"visible":"hidden"}),i("line",{x1:"0",y1:t.totalHeight,x2:t.totalWidth,y2:t.totalHeight,style:{stroke:"var(--kritzel-selection-border-color, #0e1111)",strokeWidth:`calc(var(--kritzel-selection-border-width, 2px) * ${t.scale} / ${(n=this.store.state)===null||n===void 0?void 0:n.scale})`,strokeLinecap:"square"},visibility:t.selected?"visible":"hidden"}),i("line",{x1:t.totalWidth,y1:"0",x2:t.totalWidth,y2:t.totalHeight,style:{stroke:"var(--kritzel-selection-border-color, #0e1111)",strokeWidth:`calc(var(--kritzel-selection-border-width, 2px) * ${t.scale} / ${(r=this.store.state)===null||r===void 0?void 0:r.scale})`,strokeLinecap:"square"},visibility:t.selected?"visible":"hidden"}),i("circle",{class:"resize-handle top-left",cx:"0",cy:"0",r:`${E*t.scale/((l=this.store.state)===null||l===void 0?void 0:l.scale)}`,style:{fill:"var(--kritzel-selection-handle-color, #000000)"},visibility:t.selected&&!this.isSelecting?"visible":"hidden"}),i("circle",{class:"resize-handle-overlay top-left",cx:"0",cy:"0",r:`${_*t.scale/((h=this.store.state)===null||h===void 0?void 0:h.scale)}`,style:{fill:"transparent"},visibility:t.selected&&!this.isSelecting?"visible":"hidden"}),i("circle",{class:"resize-handle top-right",cx:t.totalWidth,cy:"0",r:`${E*t.scale/((a=this.store.state)===null||a===void 0?void 0:a.scale)}`,style:{fill:"var(--kritzel-selection-handle-color, #000000)"},visibility:t.selected&&!this.isSelecting?"visible":"hidden"}),i("circle",{class:"resize-handle-overlay top-right",cx:t.totalWidth,cy:"0",r:`${_*t.scale/((c=this.store.state)===null||c===void 0?void 0:c.scale)}`,style:{fill:"transparent"},visibility:t.selected&&!this.isSelecting?"visible":"hidden"}),i("circle",{class:"resize-handle bottom-left",cx:"0",cy:t.totalHeight,r:`${E*t.scale/((d=this.store.state)===null||d===void 0?void 0:d.scale)}`,style:{fill:"var(--kritzel-selection-handle-color, #000000)"},visibility:t.selected&&!this.isSelecting?"visible":"hidden"}),i("circle",{class:"resize-handle-overlay bottom-left",cx:"0",cy:t.totalHeight,r:`${_*t.scale/((f=this.store.state)===null||f===void 0?void 0:f.scale)}`,style:{fill:"transparent"},visibility:t.selected&&!this.isSelecting?"visible":"hidden"}),i("circle",{class:"resize-handle bottom-right",cx:t.totalWidth,cy:t.totalHeight,r:`${E*t.scale/((u=this.store.state)===null||u===void 0?void 0:u.scale)}`,style:{fill:"var(--kritzel-selection-handle-color, #000000)"},visibility:t.selected&&!this.isSelecting?"visible":"hidden"}),i("circle",{class:"resize-handle-overlay bottom-right",cx:t.totalWidth,cy:t.totalHeight,r:`${_*t.scale/((b=this.store.state)===null||b===void 0?void 0:b.scale)}`,style:{fill:"transparent"},visibility:t.selected&&!this.isSelecting?"visible":"hidden"}),i("line",{x1:t.totalWidth/2,y1:"0",x2:t.totalWidth/2,y2:-(15*t.scale/((p=this.store.state)===null||p===void 0?void 0:p.scale)),style:{stroke:"var(--kritzel-selection-border-color, #0e1111)",strokeWidth:`calc(var(--kritzel-selection-border-width, 2px) * ${t.scale} / ${(v=this.store.state)===null||v===void 0?void 0:v.scale})`},visibility:t.selected&&!this.isSelecting?"visible":"hidden"}),i("circle",{class:"rotation-handle",cx:t.totalWidth/2,cy:-(15*t.scale/((g=this.store.state)===null||g===void 0?void 0:g.scale)),r:`${E*t.scale/((y=this.store.state)===null||y===void 0?void 0:y.scale)}`,style:{fill:"var(--kritzel-selection-handle-color, #000000)"},visibility:t.selected&&!this.isSelecting?"visible":"hidden"}),i("circle",{class:"rotation-handle-overlay",cx:t.totalWidth/2,cy:-(15*t.scale/((k=this.store.state)===null||k===void 0?void 0:k.scale)),r:`${_*t.scale/((x=this.store.state)===null||x===void 0?void 0:x.scale)}`,style:{fill:"transparent",cursor:"grab"},visibility:t.selected&&!this.isSelecting?"visible":"hidden"}),i("g",{style:{display:this.store.state.debugInfo.showObjectInfo?"block":"none",pointerEvents:"none"}},i("foreignObject",{x:t.totalWidth.toString(),y:"0",width:"400px",height:"160px",style:{minHeight:"0",minWidth:"0",display:t.debugInfoVisible?"block":"none"}},i("div",{style:{width:"100%",height:"100%"}},i("div",{style:{whiteSpace:"nowrap"}},"zIndex: ",t.zIndex),i("div",{style:{whiteSpace:"nowrap"}},"translateX: ",t.translateX),i("div",{style:{whiteSpace:"nowrap"}},"translateY: ",t.translateY),i("div",{style:{whiteSpace:"nowrap"}},"width: ",t.width),i("div",{style:{whiteSpace:"nowrap"}},"height: ",t.height),i("div",{style:{whiteSpace:"nowrap"}},"scale: ",t.scale),i("div",{style:{whiteSpace:"nowrap"}},"rotation: ",t.rotation))))))})),i("svg",{key:"4fd9e58c617eaf428edbdc3491d3f4fabe3ce564",class:"object",xmlns:"http://www.w3.org/2000/svg",style:{height:(w=this.store.state.currentPath)===null||w===void 0?void 0:w.height.toString(),width:(z=this.store.state.currentPath)===null||z===void 0?void 0:z.width.toString(),left:"0",top:"0",zIndex:(m=this.store.state.currentPath)===null||m===void 0?void 0:m.zIndex.toString(),position:"absolute",transform:(C=this.store.state.currentPath)===null||C===void 0?void 0:C.transformationMatrix,transformOrigin:"top left",overflow:"visible"},viewBox:(j=this.store.state.currentPath)===null||j===void 0?void 0:j.viewBox},i("path",{key:"ac88c3b66d642bbe42a0ac5345b4f4d6cddef5a3",d:(M=this.store.state.currentPath)===null||M===void 0?void 0:M.d,fill:(I=this.store.state.currentPath)===null||I===void 0?void 0:I.fill,stroke:(S=this.store.state.currentPath)===null||S===void 0?void 0:S.stroke}))),this.store.state.isContextMenuVisible&&i("kritzel-context-menu",{key:"8dc7ef8180a94bc1b4bf25c969574421ca4d0c4e",class:"context-menu",ref:t=>this.contextMenuElement=t,items:this.store.state.contextMenuItems,objects:((T=this.store.state.selectionGroup)===null||T===void 0?void 0:T.objects)||[],style:{position:"fixed",left:`${this.store.state.contextMenuX}px`,top:`${this.store.state.contextMenuY}px`,zIndex:"10000"},onActionSelected:t=>{var e;t.detail.action({x:(-this.store.state.translateX+this.store.state.contextMenuX)/this.store.state.scale,y:(-this.store.state.translateY+this.store.state.contextMenuY)/this.store.state.scale},(e=this.store.state.selectionGroup)===null||e===void 0?void 0:e.objects);this.hideContextMenu()}}),(($=this.store.state)===null||$===void 0?void 0:$.activeTool)instanceof c&&!this.store.state.isScaling&&i("kritzel-cursor-trail",{key:"c4cd252caaae9e0b1f8f2dd6a669cf4c24154e17",store:this.store}))}get host(){return o(this)}static get watchers(){return{scaleMax:["validateScaleMax"],scaleMin:["validateScaleMin"]}}};ht.style=lt;const at=":host{display:block}.font-preview{color:var(--kritzel-font-size-text-color, #333333);line-height:1;text-align:center;font-weight:bold}";const ct=class{constructor(e){t(this,e);this.fontFamily="Arial, sans-serif";this.size=24;this.color="#000000"}render(){return i(s,{key:"d0378237899c5641ae4354f3bffb14e3f8bafb59"},i("div",{key:"1475a6ae39ffc97eb780b30c85015c22cecafa6e",class:"font-preview",style:{fontFamily:this.fontFamily,fontSize:`${this.size}px`,color:this.color}},"A"))}};ct.style=at;const dt=":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: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}";const ft=class{constructor(i){t(this,i);this.fontFamilyChange=e(this,"fontFamilyChange");this.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"}];this.handleDropdownValueChange=t=>{this.fontFamilyChange.emit(t.detail)}}componentWillLoad(){if(this.fontOptions&&this.fontOptions.length>0){const t=this.fontOptions.some((t=>t.value===this.selectedFontFamily));if(!this.selectedFontFamily||!t){this.selectedFontFamily=this.fontOptions[0].value}}}render(){const t=this.fontOptions.map((t=>({value:t.value,label:t.label,style:{fontFamily:t.value}})));return i(s,{key:"f420ff18156d54bfc475148a7d9aae0f1441408c"},i("kritzel-dropdown",{key:"6b54fb8265a0eb59a6a681c6a2b7a95fb222671c",options:t,value:this.selectedFontFamily,onValueChanged:this.handleDropdownValueChange,selectStyles:{fontFamily:this.selectedFontFamily}},i("button",{key:"b853c75a425c7baafa7a8e749c90c0b08884375c",class:"font-style-button",slot:"suffix"},"B"),i("button",{key:"68dea850dd1d1f38db727d8be0eec3481890c571",class:"font-style-button italic-text",slot:"suffix"},"I")))}};ft.style=dt;const ut=":host{display:flex;align-items:flex-start;gap:8px;padding:8px;box-sizing:border-box}.size-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:4px;cursor:pointer;border:2px solid transparent;box-sizing:border-box;border-radius:50%}.size-container:hover{background-color:var(--kritzel-font-size-hover-background-color, #f0f0f0)}.size-container.selected{border-color:var(--kritzel-selection-border-color, #0E1111);background-color:var(--kritzel-font-size-selected-background-color, #e0e0e0)}";const bt=class{constructor(i){t(this,i);this.sizeChange=e(this,"sizeChange");this.sizes=[8,10,12,16,20,24];this.selectedSize=null;this.fontFamily="Arial"}handleSizeClick(t){this.selectedSize=t;this.sizeChange.emit(t)}render(){return i(s,{key:"1c09a403f1e8278d30b2675c3a6e17e12ec79afa"},this.sizes.map((t=>i("div",{class:{"size-container":true,selected:this.selectedSize===t},onClick:()=>this.handleSizeClick(t)},i("kritzel-font",{fontFamily:this.fontFamily,size:t})))))}};bt.style=ut;const pt=":host{display:inline-flex;justify-content:center;align-items:center;}span{display:flex;align-items:center;width:100%;height:100%;}span>svg{width:100%;height:100%}";const vt=class{constructor(e){t(this,e);this.size=24}render(){const t=K.get(this.name);if(!t){console.error(`[kritzel-icon] Icon "${this.name}" not found in registry.`);return i("span",{class:"error-icon","aria-label":`Error: Icon ${this.name} not found`},"?")}const e={width:`${this.size}px`,height:`${this.size}px`};return i(s,{style:e},i("span",{"aria-hidden":!this.label,role:this.label?"img":undefined,"aria-label":this.label,innerHTML:t}))}};vt.style=pt;const gt=":host{display:flex;align-items:flex-start;gap:8px;padding:8px;box-sizing:border-box}.size-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:50%;cursor:pointer;border:2px solid transparent;box-sizing:border-box}.size-container:hover{background-color:var(--kritzel-stroke-size-hover-background-color, #f0f0f0)}.size-container.selected{border-color:var(--kritzel-selection-border-color, #0E1111);background-color:var(--kritzel-stroke-size-selected-background-color, #f0f0f0)}";const yt=class{constructor(i){t(this,i);this.sizeChange=e(this,"sizeChange");this.sizes=[4,6,8,12,16,24];this.selectedSize=null}handleSizeClick(t){this.selectedSize=t;this.sizeChange.emit(t)}render(){return i(s,{key:"2e2a4d38920e25e1e60788deabe4912b510d0b10"},this.sizes.map((t=>i("div",{class:{"size-container":true,selected:this.selectedSize===t},onClick:()=>this.handleSizeClick(t)},i("kritzel-color",{value:"#000000",size:t})))))}};yt.style=gt;const kt=":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))}";const xt=768;const wt=class{constructor(e){t(this,e);this.isVisible=false;this.arrowSize=8;this.offsetY=24;this.positionX=0;this.arrowOffset="0px";this.isMobileView=window.innerWidth<xt}handleWindowResize(){this.isMobileView=window.innerWidth<xt;this.calculateAdjustedPosition()}componentWillLoad(){this.isMobileView=window.innerWidth<xt;this.calculateAdjustedPosition()}componentWillUpdate(){this.calculateAdjustedPosition()}calculateAdjustedPosition(){var t;if(this.isVisible&&this.anchorElement){const e=this.anchorElement.getBoundingClientRect();const i=(t=this.el.shadowRoot)===null||t===void 0?void 0:t.querySelector(".tooltip-content");if(!this.isMobileView){this.positionX=e.left+e.width/2;this.arrowOffset=`calc(${50}% - ${this.arrowSize}px)`}else{const t=i.getBoundingClientRect();this.positionX=e.left+e.width/2-t.width/2;this.arrowOffset=`${e.left+e.width/2-t.left-this.arrowSize}px`}}}render(){return i(s,{key:"3161826337f6957d2e568f52cfe3f57d705af0ed",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`}},i("div",{key:"12fc4bc05b7be756102ce3779c9be1d51f3fe13b",class:"tooltip-content",onClick:t=>t.stopPropagation()},i("slot",{key:"90f645f8f7cec371aaeda7207a9fb420b02b2ae4"}),i("div",{key:"73380e2c6df22bc4a97479a52315e7b34d069fa1",class:"tooltip-arrow-wrapper",style:{position:"fixed",left:this.arrowOffset,bottom:`-${this.arrowSize*2}px`}},i("div",{key:"2e13cb01a3282e161d3212f4970a93b20ca1a0fe",class:"tooltip-arrow",style:{borderLeft:`${this.arrowSize}px solid transparent`,borderRight:`${this.arrowSize}px solid transparent`,borderTop:`${this.arrowSize}px solid var(--kritzel-controls-tooltip-background-color, #ffffff)`,filter:"drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2))"}}),i("div",{key:"30ddbd00b928c0c734656d6309eaefbae5baf264",class:"tooltip-arrow-rect",style:{position:"relative",width:`${this.arrowSize*2}px`,height:`${this.arrowSize}px`,backgroundColor:"var(--kritzel-controls-tooltip-background-color, #ffffff)",bottom:`${this.arrowSize*2}px`}}))))}get el(){return o(this)}};wt.style=kt;const zt=":host{display:flex;flex-direction:row;align-items:center;padding:4px;gap:8px;border-top-left-radius:12px;border-top-right-radius:12px;background-color:rgb(226, 226, 226);width:fit-content;user-select:none}.utility-button{display:flex;justify-content:center;align-items:center;width:28px;height:28px;padding:8px 4px;border:none;outline:none;background:none;cursor:pointer;color:#333333;-webkit-tap-highlight-color:transparent}.utility-separator{width:1px;height:16px;background-color:hsl(0, 0%, 0%, 4.3%)}";const mt=class{constructor(i){t(this,i);this.undo=e(this,"undo");this.redo=e(this,"redo");this.delete=e(this,"delete")}handleUndo(t){if(t.cancelable){t.preventDefault();t.stopPropagation();this.undo.emit()}}handleRedo(t){t.preventDefault();t.stopPropagation();this.redo.emit()}render(){return i(s,{key:"496ed78323c9899ad363e7f7732a1464d99e1b3b"},i("button",{key:"7b6b9cd238a8d254f032d5752f184d567e9a3096",class:"utility-button",onClick:t=>this.handleUndo(t)},i("kritzel-icon",{key:"8ac19f36c6b82f7cc4a0249e60cf429f75c09218",name:"undo"})),i("button",{key:"1164727510a968356042507c1e302b85a135baf8",class:"utility-button",onClick:t=>this.handleRedo(t)},i("kritzel-icon",{key:"1c6cc414d5841a06853f99316eee7a0a609d5c92",name:"redo"})),i("div",{key:"e6f3342569b1c6b5a6b267cc215bc8e5d259e302",class:"utility-separator"}),i("button",{key:"0aa486a543df924c224f3637857cdcdb06f995ea",class:"utility-button"},i("kritzel-icon",{key:"9ee324e03f5df5297916549743539f7f19950768",name:"delete",onClick:()=>this.delete.emit()})))}};mt.style=zt;export{I as kritzel_brush_style,T as kritzel_color,O as kritzel_color_palette,E as kritzel_context_menu,D as kritzel_control_brush_config,V as kritzel_control_text_config,A as kritzel_controls,L as kritzel_cursor_trail,X as kritzel_dropdown,N as kritzel_editor,ht as kritzel_engine,ct as kritzel_font,ft as kritzel_font_family,bt as kritzel_font_size,vt as kritzel_icon,yt as kritzel_stroke_size,wt as kritzel_tooltip,mt as kritzel_utility_panel};
|
|
2
|
-
//# sourceMappingURL=p-3797c300.entry.js.map
|