kritzel-stencil 0.0.159 → 0.0.161

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (171) hide show
  1. package/dist/cjs/{default-text-tool.config-BySzvIox.js → default-text-tool.config-zB3FPuXq.js} +270 -58
  2. package/dist/cjs/default-text-tool.config-zB3FPuXq.js.map +1 -0
  3. package/dist/cjs/index.cjs.js +2 -1
  4. package/dist/cjs/index.cjs.js.map +1 -1
  5. package/dist/cjs/kritzel-brush-style.cjs.entry.js +1 -1
  6. package/dist/cjs/kritzel-brush-style.entry.cjs.js.map +1 -1
  7. package/dist/cjs/kritzel-color_22.cjs.entry.js +108 -101
  8. package/dist/cjs/loader.cjs.js +1 -1
  9. package/dist/cjs/stencil.cjs.js +1 -1
  10. package/dist/collection/classes/core/store.class.js +3 -0
  11. package/dist/collection/classes/core/store.class.js.map +1 -1
  12. package/dist/collection/classes/handlers/resize.handler.js +54 -32
  13. package/dist/collection/classes/handlers/resize.handler.js.map +1 -1
  14. package/dist/collection/classes/handlers/rotation.handler.js +12 -8
  15. package/dist/collection/classes/handlers/rotation.handler.js.map +1 -1
  16. package/dist/collection/classes/objects/selection-group.class.js +91 -16
  17. package/dist/collection/classes/objects/selection-group.class.js.map +1 -1
  18. package/dist/collection/classes/registries/icon-registry.class.js +6 -1
  19. package/dist/collection/classes/registries/icon-registry.class.js.map +1 -1
  20. package/dist/collection/components/core/kritzel-cursor-trail/kritzel-cursor-trail.js +1 -1
  21. package/dist/collection/components/core/kritzel-editor/kritzel-editor.js +1 -1
  22. package/dist/collection/components/core/kritzel-engine/kritzel-engine.css +0 -14
  23. package/dist/collection/components/core/kritzel-engine/kritzel-engine.js +80 -10
  24. package/dist/collection/components/core/kritzel-engine/kritzel-engine.js.map +1 -1
  25. package/dist/collection/components/shared/kritzel-brush-style/kritzel-brush-style.css +0 -1
  26. package/dist/collection/components/shared/kritzel-color/kritzel-color.js +2 -2
  27. package/dist/collection/components/shared/kritzel-color-palette/kritzel-color-palette.css +1 -1
  28. package/dist/collection/components/shared/kritzel-color-palette/kritzel-color-palette.js +1 -1
  29. package/dist/collection/components/shared/kritzel-dropdown/kritzel-dropdown.css +1 -1
  30. package/dist/collection/components/shared/kritzel-font/kritzel-font.js +1 -1
  31. package/dist/collection/components/shared/kritzel-font-family/kritzel-font-family.css +1 -1
  32. package/dist/collection/components/shared/kritzel-font-family/kritzel-font-family.js +1 -1
  33. package/dist/collection/components/shared/kritzel-font-size/kritzel-font-size.css +1 -1
  34. package/dist/collection/components/shared/kritzel-font-size/kritzel-font-size.js +1 -1
  35. package/dist/collection/components/shared/kritzel-menu/kritzel-menu.js +1 -1
  36. package/dist/collection/components/shared/kritzel-menu-item/kritzel-menu-item.css +1 -2
  37. package/dist/collection/components/shared/kritzel-menu-item/kritzel-menu-item.js +2 -2
  38. package/dist/collection/components/shared/kritzel-portal/kritzel-portal.js +1 -1
  39. package/dist/collection/components/shared/kritzel-split-button/kritzel-split-button.css +1 -1
  40. package/dist/collection/components/shared/kritzel-split-button/kritzel-split-button.js +1 -1
  41. package/dist/collection/components/shared/kritzel-stroke-size/kritzel-stroke-size.css +1 -1
  42. package/dist/collection/components/shared/kritzel-stroke-size/kritzel-stroke-size.js +1 -1
  43. package/dist/collection/components/shared/kritzel-tooltip/kritzel-tooltip.js +4 -4
  44. package/dist/collection/components/ui/kritzel-context-menu/kritzel-context-menu.css +1 -2
  45. package/dist/collection/components/ui/kritzel-context-menu/kritzel-context-menu.js +1 -1
  46. package/dist/collection/components/ui/kritzel-control-brush-config/kritzel-control-brush-config.css +1 -1
  47. package/dist/collection/components/ui/kritzel-control-brush-config/kritzel-control-brush-config.js +2 -2
  48. package/dist/collection/components/ui/kritzel-control-text-config/kritzel-control-text-config.css +1 -1
  49. package/dist/collection/components/ui/kritzel-control-text-config/kritzel-control-text-config.js +2 -2
  50. package/dist/collection/components/ui/kritzel-controls/kritzel-controls.css +4 -4
  51. package/dist/collection/components/ui/kritzel-controls/kritzel-controls.js +3 -3
  52. package/dist/collection/components/ui/kritzel-utility-panel/kritzel-utility-panel.css +1 -1
  53. package/dist/collection/components/ui/kritzel-utility-panel/kritzel-utility-panel.js +1 -1
  54. package/dist/collection/configs/default-engine-config.js +6 -0
  55. package/dist/collection/configs/default-engine-config.js.map +1 -1
  56. package/dist/collection/helpers/cursor.helper.js +58 -0
  57. package/dist/collection/helpers/cursor.helper.js.map +1 -0
  58. package/dist/collection/index.js +1 -0
  59. package/dist/collection/index.js.map +1 -1
  60. package/dist/collection/interfaces/engine-state.interface.js.map +1 -1
  61. package/dist/components/index.js +2 -2
  62. package/dist/components/kritzel-brush-style.js +3 -3
  63. package/dist/components/kritzel-brush-style.js.map +1 -1
  64. package/dist/components/kritzel-color-palette.js +1 -1
  65. package/dist/components/kritzel-color.js +1 -1
  66. package/dist/components/kritzel-context-menu.js +1 -1
  67. package/dist/components/kritzel-control-brush-config.js +1 -1
  68. package/dist/components/kritzel-control-text-config.js +1 -1
  69. package/dist/components/kritzel-controls.js +1 -1
  70. package/dist/components/kritzel-cursor-trail.js +1 -1
  71. package/dist/components/kritzel-dropdown.js +1 -1
  72. package/dist/components/kritzel-editor.js +21 -21
  73. package/dist/components/kritzel-engine.js +1 -1
  74. package/dist/components/kritzel-font-family.js +1 -1
  75. package/dist/components/kritzel-font-size.js +1 -1
  76. package/dist/components/kritzel-font.js +1 -1
  77. package/dist/components/kritzel-icon.js +1 -1
  78. package/dist/components/kritzel-menu-item.js +1 -1
  79. package/dist/components/kritzel-menu.js +1 -1
  80. package/dist/components/kritzel-portal.js +1 -1
  81. package/dist/components/kritzel-split-button.js +1 -1
  82. package/dist/components/kritzel-stroke-size.js +1 -1
  83. package/dist/components/kritzel-tooltip.js +1 -1
  84. package/dist/components/kritzel-utility-panel.js +1 -1
  85. package/dist/components/kritzel-workspace-manager.js +1 -1
  86. package/dist/components/{p-CK6no3mi.js → p-58y59Acb.js} +6 -6
  87. package/dist/components/{p-CK6no3mi.js.map → p-58y59Acb.js.map} +1 -1
  88. package/dist/components/{p-CTP479Lf.js → p-9Fzdviju.js} +6 -6
  89. package/dist/components/{p-CTP479Lf.js.map → p-9Fzdviju.js.map} +1 -1
  90. package/dist/components/{p-DDmSxM5f.js → p-B6r22FSC.js} +5 -5
  91. package/dist/components/p-B6r22FSC.js.map +1 -0
  92. package/dist/components/{p-CLt3HMl6.js → p-B_3OZeom.js} +3 -3
  93. package/dist/components/{p-CLt3HMl6.js.map → p-B_3OZeom.js.map} +1 -1
  94. package/dist/components/{p-TdCTkEu0.js → p-BdZKPKnx.js} +7 -7
  95. package/dist/components/p-BdZKPKnx.js.map +1 -0
  96. package/dist/components/{p-CIXPLjCu.js → p-BdwB-S9G.js} +3 -3
  97. package/dist/components/p-BdwB-S9G.js.map +1 -0
  98. package/dist/components/{p-1lIHoOlH.js → p-BpXgwgnV.js} +18 -18
  99. package/dist/components/p-BpXgwgnV.js.map +1 -0
  100. package/dist/components/{p-D1uj4A4F.js → p-Brd9SxWS.js} +5 -5
  101. package/dist/components/p-Brd9SxWS.js.map +1 -0
  102. package/dist/components/{p-CsA9M6me.js → p-CC8KFHSe.js} +8 -8
  103. package/dist/components/p-CC8KFHSe.js.map +1 -0
  104. package/dist/components/{p-BgznZoBH.js → p-CFH6XRL5.js} +5 -5
  105. package/dist/components/p-CFH6XRL5.js.map +1 -0
  106. package/dist/components/{p-B4kxkVe-.js → p-CRGwaUcp.js} +5 -5
  107. package/dist/components/p-CRGwaUcp.js.map +1 -0
  108. package/dist/components/{p-uuRJU2R1.js → p-Ck4lGnmt.js} +3 -3
  109. package/dist/components/{p-uuRJU2R1.js.map → p-Ck4lGnmt.js.map} +1 -1
  110. package/dist/components/{p-BAplhrRJ.js → p-D7BLVRXX.js} +289 -75
  111. package/dist/components/p-D7BLVRXX.js.map +1 -0
  112. package/dist/components/{p-C2sWlNsJ.js → p-D_ygcWSz.js} +5 -5
  113. package/dist/components/p-D_ygcWSz.js.map +1 -0
  114. package/dist/components/p-DbKKCHKd.js +103 -0
  115. package/dist/components/p-DbKKCHKd.js.map +1 -0
  116. package/dist/components/{p-Ddh40W3x.js → p-Doixm8-N.js} +9 -9
  117. package/dist/components/p-Doixm8-N.js.map +1 -0
  118. package/dist/components/{p-BQg4YML7.js → p-DxNbcUzt.js} +12 -12
  119. package/dist/components/p-DxNbcUzt.js.map +1 -0
  120. package/dist/components/{p-D4yvhd1d.js → p-LAsVgL2e.js} +4 -4
  121. package/dist/components/{p-D4yvhd1d.js.map → p-LAsVgL2e.js.map} +1 -1
  122. package/dist/components/{p-D5Wq4x4r.js → p-OFrACpZf.js} +3 -3
  123. package/dist/components/{p-D5Wq4x4r.js.map → p-OFrACpZf.js.map} +1 -1
  124. package/dist/components/{p-DAfkuR8U.js → p-i0IlGLv2.js} +5 -5
  125. package/dist/components/p-i0IlGLv2.js.map +1 -0
  126. package/dist/esm/{default-text-tool.config-2YFQA3SF.js → default-text-tool.config-BvCgOiKA.js} +269 -59
  127. package/dist/esm/default-text-tool.config-BvCgOiKA.js.map +1 -0
  128. package/dist/esm/index.js +2 -2
  129. package/dist/esm/kritzel-brush-style.entry.js +1 -1
  130. package/dist/esm/kritzel-brush-style.entry.js.map +1 -1
  131. package/dist/esm/kritzel-color_22.entry.js +106 -99
  132. package/dist/esm/loader.js +1 -1
  133. package/dist/esm/stencil.js +1 -1
  134. package/dist/stencil/index.esm.js +1 -1
  135. package/dist/stencil/kritzel-brush-style.entry.esm.js.map +1 -1
  136. package/dist/stencil/p-385bab97.entry.js +2 -0
  137. package/dist/stencil/{p-d702c5af.entry.js.map → p-385bab97.entry.js.map} +1 -1
  138. package/dist/stencil/p-6d9756d9.entry.js +10 -0
  139. package/dist/stencil/p-6d9756d9.entry.js.map +1 -0
  140. package/dist/stencil/{p-2YFQA3SF.js → p-BvCgOiKA.js} +2 -2
  141. package/dist/stencil/p-BvCgOiKA.js.map +1 -0
  142. package/dist/stencil/stencil.esm.js +1 -1
  143. package/dist/types/classes/core/store.class.d.ts +1 -0
  144. package/dist/types/classes/objects/selection-group.class.d.ts +1 -0
  145. package/dist/types/components/core/kritzel-engine/kritzel-engine.d.ts +4 -0
  146. package/dist/types/components.d.ts +2 -0
  147. package/dist/types/helpers/cursor.helper.d.ts +22 -0
  148. package/dist/types/index.d.ts +1 -0
  149. package/dist/types/interfaces/engine-state.interface.d.ts +7 -0
  150. package/package.json +1 -1
  151. package/dist/cjs/default-text-tool.config-BySzvIox.js.map +0 -1
  152. package/dist/components/p-1lIHoOlH.js.map +0 -1
  153. package/dist/components/p-B4kxkVe-.js.map +0 -1
  154. package/dist/components/p-BAplhrRJ.js.map +0 -1
  155. package/dist/components/p-BQg4YML7.js.map +0 -1
  156. package/dist/components/p-BgznZoBH.js.map +0 -1
  157. package/dist/components/p-Bhtn9qay.js +0 -98
  158. package/dist/components/p-Bhtn9qay.js.map +0 -1
  159. package/dist/components/p-C2sWlNsJ.js.map +0 -1
  160. package/dist/components/p-CIXPLjCu.js.map +0 -1
  161. package/dist/components/p-CsA9M6me.js.map +0 -1
  162. package/dist/components/p-D1uj4A4F.js.map +0 -1
  163. package/dist/components/p-DAfkuR8U.js.map +0 -1
  164. package/dist/components/p-DDmSxM5f.js.map +0 -1
  165. package/dist/components/p-Ddh40W3x.js.map +0 -1
  166. package/dist/components/p-TdCTkEu0.js.map +0 -1
  167. package/dist/esm/default-text-tool.config-2YFQA3SF.js.map +0 -1
  168. package/dist/stencil/p-2YFQA3SF.js.map +0 -1
  169. package/dist/stencil/p-2e85a4af.entry.js +0 -10
  170. package/dist/stencil/p-2e85a4af.entry.js.map +0 -1
  171. package/dist/stencil/p-d702c5af.entry.js +0 -2
@@ -1 +1 @@
1
- {"file":"kritzel-brush-style.js","mappings":";;;;AAAA,MAAM,oBAAoB,GAAG,wuBAAwuB;;MCUxvBA,mBAAiB,iBAAAC,kBAAA,CAAA,MAAA,iBAAA,SAAAC,CAAA,CAAA;;;;;;;;;IACpB,IAAI,GAA0B,KAAK;AACnC,IAAA,YAAY,GAAuB;AACzC,QAAA,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE;AAC9B,QAAA,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,aAAa,EAAE;KAC/C;AAEQ,IAAA,UAAU;AAEnB,IAAA,yBAAyB,CAAC,KAA0B,EAAA;QAClD,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,MAA+B,CAAC;;IAG7D,MAAM,GAAA;AACJ,QAAA,MAAM,eAAe,GAAqB,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,MAAM,KAAK;YACzE,KAAK,EAAE,MAAM,CAAC,KAAK;YACnB,KAAK,EAAE,MAAM,CAAC,KAAK;AACpB,SAAA,CAAC,CAAC;AAEH,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAkB,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAE,eAAe,EAAE,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,cAAc,EAAE,KAAK,IAAI,IAAI,CAAC,yBAAyB,CAAC,KAAK,CAAC,EAAA,EAC1H,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAC,oBAAoB,EAAC,IAAI,EAAC,QAAQ,EAAA,EAC9C,CAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAc,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE,EAAiB,CAAA,CACjD,CACQ,CACd;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["KritzelBrushStyle","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-brush-style/kritzel-brush-style.css?tag=kritzel-brush-style&encapsulation=shadow","src/components/shared/kritzel-brush-style/kritzel-brush-style.tsx"],"sourcesContent":[":host {\r\n display: flex; \r\n align-items: flex-start; \r\n gap: 8px; \r\n padding: 8px; \r\n box-sizing: border-box; \r\n width: 100%;\r\n}\r\n\r\n.brush-style-button {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n width: 42px;\r\n height: 32px;\r\n padding: 0;\r\n border: none;\r\n outline: none;\r\n background: none;\r\n cursor: default;\r\n border-radius: 0; \r\n color: var(--control-text-color);\r\n font-weight: bold;\r\n -webkit-tap-highlight-color: transparent;\r\n}\r\n\r\n.font-style-button:not(:last-child) {\r\n border-right: 1px solid #333333; \r\n}\r\n\r\n.font-style-button:hover {\r\n background-color: var(--control-hover-bg);\r\n}\r\n\r\n.font-style-button:active {\r\n background-color: var(--control-active-bg);\r\n}\r\n\r\n.font-style-button.selected,\r\n.font-style-button.selected:hover,\r\n.font-style-button.selected:active {\r\n background-color: var(--control-selected-bg);\r\n color: var(--control-selected-color);\r\n}","import { Component, Host, h, Prop, EventEmitter, Event } from '@stencil/core';\r\nimport { DropdownOption } from '../kritzel-dropdown/kritzel-dropdown'; // Import DropdownOption\r\n\r\nexport interface BrushStyleOption extends DropdownOption {}\r\n\r\n@Component({\r\n tag: 'kritzel-brush-style',\r\n styleUrl: 'kritzel-brush-style.css',\r\n shadow: true,\r\n})\r\nexport class KritzelBrushStyle {\r\n @Prop() type: 'pen' | 'highlighter' = 'pen';\r\n @Prop() brushOptions: BrushStyleOption[] = [\r\n { value: 'pen', label: 'Pen' },\r\n { value: 'highlighter', label: 'Highlighter' },\r\n ];\r\n\r\n @Event() typeChange: EventEmitter<'pen' | 'highlighter'>;\r\n\r\n handleDropdownValueChange(event: CustomEvent<string>) {\r\n this.typeChange.emit(event.detail as 'pen' | 'highlighter');\r\n }\r\n\r\n render() {\r\n const dropdownOptions: DropdownOption[] = this.brushOptions.map(option => ({\r\n value: option.value,\r\n label: option.label,\r\n }));\r\n\r\n return (\r\n <Host>\r\n <kritzel-dropdown options={dropdownOptions} value={this.type} onValueChanged={event => this.handleDropdownValueChange(event)}>\r\n <button class=\"brush-style-button\" slot=\"prefix\">\r\n <kritzel-icon name={this.type} size={16}></kritzel-icon>\r\n </button>\r\n </kritzel-dropdown>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
1
+ {"file":"kritzel-brush-style.js","mappings":";;;;AAAA,MAAM,oBAAoB,GAAG,ytBAAytB;;MCUzuBA,mBAAiB,iBAAAC,kBAAA,CAAA,MAAA,iBAAA,SAAAC,CAAA,CAAA;;;;;;;;;IACpB,IAAI,GAA0B,KAAK;AACnC,IAAA,YAAY,GAAuB;AACzC,QAAA,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE;AAC9B,QAAA,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,aAAa,EAAE;KAC/C;AAEQ,IAAA,UAAU;AAEnB,IAAA,yBAAyB,CAAC,KAA0B,EAAA;QAClD,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,MAA+B,CAAC;;IAG7D,MAAM,GAAA;AACJ,QAAA,MAAM,eAAe,GAAqB,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,MAAM,KAAK;YACzE,KAAK,EAAE,MAAM,CAAC,KAAK;YACnB,KAAK,EAAE,MAAM,CAAC,KAAK;AACpB,SAAA,CAAC,CAAC;AAEH,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAkB,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAE,eAAe,EAAE,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,cAAc,EAAE,KAAK,IAAI,IAAI,CAAC,yBAAyB,CAAC,KAAK,CAAC,EAAA,EAC1H,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAC,oBAAoB,EAAC,IAAI,EAAC,QAAQ,EAAA,EAC9C,CAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAc,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE,EAAiB,CAAA,CACjD,CACQ,CACd;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["KritzelBrushStyle","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-brush-style/kritzel-brush-style.css?tag=kritzel-brush-style&encapsulation=shadow","src/components/shared/kritzel-brush-style/kritzel-brush-style.tsx"],"sourcesContent":[":host {\r\n display: flex; \r\n align-items: flex-start; \r\n gap: 8px; \r\n padding: 8px; \r\n box-sizing: border-box; \r\n width: 100%;\r\n}\r\n\r\n.brush-style-button {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n width: 42px;\r\n height: 32px;\r\n padding: 0;\r\n border: none;\r\n outline: none;\r\n background: none;\r\n border-radius: 0; \r\n color: var(--control-text-color);\r\n font-weight: bold;\r\n -webkit-tap-highlight-color: transparent;\r\n}\r\n\r\n.font-style-button:not(:last-child) {\r\n border-right: 1px solid #333333; \r\n}\r\n\r\n.font-style-button:hover {\r\n background-color: var(--control-hover-bg);\r\n}\r\n\r\n.font-style-button:active {\r\n background-color: var(--control-active-bg);\r\n}\r\n\r\n.font-style-button.selected,\r\n.font-style-button.selected:hover,\r\n.font-style-button.selected:active {\r\n background-color: var(--control-selected-bg);\r\n color: var(--control-selected-color);\r\n}","import { Component, Host, h, Prop, EventEmitter, Event } from '@stencil/core';\r\nimport { DropdownOption } from '../kritzel-dropdown/kritzel-dropdown'; // Import DropdownOption\r\n\r\nexport interface BrushStyleOption extends DropdownOption {}\r\n\r\n@Component({\r\n tag: 'kritzel-brush-style',\r\n styleUrl: 'kritzel-brush-style.css',\r\n shadow: true,\r\n})\r\nexport class KritzelBrushStyle {\r\n @Prop() type: 'pen' | 'highlighter' = 'pen';\r\n @Prop() brushOptions: BrushStyleOption[] = [\r\n { value: 'pen', label: 'Pen' },\r\n { value: 'highlighter', label: 'Highlighter' },\r\n ];\r\n\r\n @Event() typeChange: EventEmitter<'pen' | 'highlighter'>;\r\n\r\n handleDropdownValueChange(event: CustomEvent<string>) {\r\n this.typeChange.emit(event.detail as 'pen' | 'highlighter');\r\n }\r\n\r\n render() {\r\n const dropdownOptions: DropdownOption[] = this.brushOptions.map(option => ({\r\n value: option.value,\r\n label: option.label,\r\n }));\r\n\r\n return (\r\n <Host>\r\n <kritzel-dropdown options={dropdownOptions} value={this.type} onValueChanged={event => this.handleDropdownValueChange(event)}>\r\n <button class=\"brush-style-button\" slot=\"prefix\">\r\n <kritzel-icon name={this.type} size={16}></kritzel-icon>\r\n </button>\r\n </kritzel-dropdown>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
@@ -1,4 +1,4 @@
1
- import { K as KritzelColorPalette$1, d as defineCustomElement$1 } from './p-D1uj4A4F.js';
1
+ import { K as KritzelColorPalette$1, d as defineCustomElement$1 } from './p-Brd9SxWS.js';
2
2
 
3
3
  const KritzelColorPalette = KritzelColorPalette$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { K as KritzelColor$1, d as defineCustomElement$1 } from './p-D4yvhd1d.js';
1
+ import { K as KritzelColor$1, d as defineCustomElement$1 } from './p-LAsVgL2e.js';
2
2
 
3
3
  const KritzelColor = KritzelColor$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { K as KritzelContextMenu$1, d as defineCustomElement$1 } from './p-C2sWlNsJ.js';
1
+ import { K as KritzelContextMenu$1, d as defineCustomElement$1 } from './p-D_ygcWSz.js';
2
2
 
3
3
  const KritzelContextMenu = KritzelContextMenu$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { K as KritzelControlBrushConfig$1, d as defineCustomElement$1 } from './p-Ddh40W3x.js';
1
+ import { K as KritzelControlBrushConfig$1, d as defineCustomElement$1 } from './p-Doixm8-N.js';
2
2
 
3
3
  const KritzelControlBrushConfig = KritzelControlBrushConfig$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { K as KritzelControlTextConfig$1, d as defineCustomElement$1 } from './p-BQg4YML7.js';
1
+ import { K as KritzelControlTextConfig$1, d as defineCustomElement$1 } from './p-DxNbcUzt.js';
2
2
 
3
3
  const KritzelControlTextConfig = KritzelControlTextConfig$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { K as KritzelControls$1, d as defineCustomElement$1 } from './p-1lIHoOlH.js';
1
+ import { K as KritzelControls$1, d as defineCustomElement$1 } from './p-BpXgwgnV.js';
2
2
 
3
3
  const KritzelControls = KritzelControls$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { K as KritzelCursorTrail$1, d as defineCustomElement$1 } from './p-CLt3HMl6.js';
1
+ import { K as KritzelCursorTrail$1, d as defineCustomElement$1 } from './p-B_3OZeom.js';
2
2
 
3
3
  const KritzelCursorTrail = KritzelCursorTrail$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { K as KritzelDropdown$1, d as defineCustomElement$1 } from './p-CIXPLjCu.js';
1
+ import { K as KritzelDropdown$1, d as defineCustomElement$1 } from './p-BdwB-S9G.js';
2
2
 
3
3
  const KritzelDropdown = KritzelDropdown$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,27 +1,27 @@
1
1
  import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-CwkUrTy1.js';
2
- import { K as KritzelIconRegistry, d as defineCustomElement$a } from './p-Bhtn9qay.js';
3
- import { L as ABSOLUTE_SCALE_MAX, M as ABSOLUTE_SCALE_MIN, G as KritzelSelectionTool, E as KritzelEraserTool, F as KritzelImageTool, N as defineCustomElement$e } from './p-BAplhrRJ.js';
2
+ import { K as KritzelIconRegistry, d as defineCustomElement$a } from './p-DbKKCHKd.js';
3
+ import { M as ABSOLUTE_SCALE_MAX, N as ABSOLUTE_SCALE_MIN, I as KritzelSelectionTool, E as KritzelEraserTool, F as KritzelImageTool, P as defineCustomElement$e } from './p-D7BLVRXX.js';
4
4
  import { b as KritzelBrushTool, c as KritzelTextTool, d as KritzelKeyboardHelper } from './p-CBYBurdY.js';
5
5
  import { K as KritzelWorkspace } from './p-n789Y3S-.js';
6
6
  import { K as KritzelDevicesHelper } from './p-l10It7Nm.js';
7
- import { d as defineCustomElement$m } from './p-D4yvhd1d.js';
8
- import { d as defineCustomElement$l } from './p-D1uj4A4F.js';
9
- import { d as defineCustomElement$k } from './p-C2sWlNsJ.js';
10
- import { d as defineCustomElement$j } from './p-Ddh40W3x.js';
11
- import { d as defineCustomElement$i } from './p-BQg4YML7.js';
12
- import { d as defineCustomElement$h } from './p-1lIHoOlH.js';
13
- import { d as defineCustomElement$g } from './p-CLt3HMl6.js';
14
- import { d as defineCustomElement$f } from './p-CIXPLjCu.js';
15
- import { d as defineCustomElement$d } from './p-uuRJU2R1.js';
16
- import { d as defineCustomElement$c } from './p-BgznZoBH.js';
17
- import { d as defineCustomElement$b } from './p-DDmSxM5f.js';
18
- import { d as defineCustomElement$8, a as defineCustomElement$9 } from './p-CsA9M6me.js';
19
- import { d as defineCustomElement$7 } from './p-D5Wq4x4r.js';
20
- import { d as defineCustomElement$6 } from './p-TdCTkEu0.js';
21
- import { d as defineCustomElement$5 } from './p-B4kxkVe-.js';
22
- import { d as defineCustomElement$4 } from './p-CTP479Lf.js';
23
- import { d as defineCustomElement$3 } from './p-DAfkuR8U.js';
24
- import { d as defineCustomElement$2 } from './p-CK6no3mi.js';
7
+ import { d as defineCustomElement$m } from './p-LAsVgL2e.js';
8
+ import { d as defineCustomElement$l } from './p-Brd9SxWS.js';
9
+ import { d as defineCustomElement$k } from './p-D_ygcWSz.js';
10
+ import { d as defineCustomElement$j } from './p-Doixm8-N.js';
11
+ import { d as defineCustomElement$i } from './p-DxNbcUzt.js';
12
+ import { d as defineCustomElement$h } from './p-BpXgwgnV.js';
13
+ import { d as defineCustomElement$g } from './p-B_3OZeom.js';
14
+ import { d as defineCustomElement$f } from './p-BdwB-S9G.js';
15
+ import { d as defineCustomElement$d } from './p-Ck4lGnmt.js';
16
+ import { d as defineCustomElement$c } from './p-CFH6XRL5.js';
17
+ import { d as defineCustomElement$b } from './p-B6r22FSC.js';
18
+ import { d as defineCustomElement$8, a as defineCustomElement$9 } from './p-CC8KFHSe.js';
19
+ import { d as defineCustomElement$7 } from './p-OFrACpZf.js';
20
+ import { d as defineCustomElement$6 } from './p-BdZKPKnx.js';
21
+ import { d as defineCustomElement$5 } from './p-CRGwaUcp.js';
22
+ import { d as defineCustomElement$4 } from './p-9Fzdviju.js';
23
+ import { d as defineCustomElement$3 } from './p-i0IlGLv2.js';
24
+ import { d as defineCustomElement$2 } from './p-58y59Acb.js';
25
25
 
26
26
  const DEFAULT_BRUSH_CONFIG = {
27
27
  type: 'pen',
@@ -344,7 +344,7 @@ const KritzelEditor$1 = /*@__PURE__*/ proxyCustomElement(class KritzelEditor ext
344
344
  }
345
345
  }
346
346
  render() {
347
- return (h(Host, { key: '87983fe2d4fcdbf226851190e7529f12e7b5fdbf' }, h("kritzel-workspace-manager", { key: 'a1e0f522a7075ef4e2b5eab47dab5dc77098b402', workspaces: this.workspaces, activeWorkspace: this.activeWorkspace, onWorkspaceChange: event => (this.activeWorkspace = event.detail), onIsWorkspaceManagerReady: () => (this.isWorkspaceManagerReady = true) }), h("kritzel-engine", { key: '18e78080712e53ead39ff07e43b7035e43a096f2', ref: el => (this.engineRef = el), workspace: this.activeWorkspace, syncConfig: this.syncConfig, scaleMax: this.scaleMax, scaleMin: this.scaleMin, globalContextMenuItems: this.globalContextMenuItems, objectContextMenuItems: this.objectContextMenuItems, onIsEngineReady: event => this.onEngineReady(event), onWorkspacesChange: event => this.handleWorkspacesChange(event), onObjectsChange: event => this.handleObjectsChange(event), onUndoStateChange: event => this.handleUndoStateChange(event) }), h("kritzel-controls", { key: '5ffaebbbeecbeebab050b3f990d027c6653a1940', class: { 'keyboard-open': this.isVirtualKeyboardOpen }, style: { display: this.isControlsVisible ? 'flex' : 'none' }, ref: el => (this.controlsRef = el), controls: this.controls, isUtilityPanelVisible: this.isUtilityPanelVisible, undoState: this.undoState, onIsControlsReady: () => (this.isControlsReady = true) })));
347
+ return (h(Host, { key: 'c824014ce85ef5c94436211df5241d23f11caed4' }, h("kritzel-workspace-manager", { key: '8ce43afa37896897674b5df943bef3fe1ffba32b', workspaces: this.workspaces, activeWorkspace: this.activeWorkspace, onWorkspaceChange: event => (this.activeWorkspace = event.detail), onIsWorkspaceManagerReady: () => (this.isWorkspaceManagerReady = true) }), h("kritzel-engine", { key: '12f80313bb145d9065a6222d5a8b503f0eca177a', ref: el => (this.engineRef = el), workspace: this.activeWorkspace, syncConfig: this.syncConfig, scaleMax: this.scaleMax, scaleMin: this.scaleMin, globalContextMenuItems: this.globalContextMenuItems, objectContextMenuItems: this.objectContextMenuItems, onIsEngineReady: event => this.onEngineReady(event), onWorkspacesChange: event => this.handleWorkspacesChange(event), onObjectsChange: event => this.handleObjectsChange(event), onUndoStateChange: event => this.handleUndoStateChange(event) }), h("kritzel-controls", { key: '0a1e63580afcbe65e5cf42833d86c3b34bb686c7', class: { 'keyboard-open': this.isVirtualKeyboardOpen }, style: { display: this.isControlsVisible ? 'flex' : 'none' }, ref: el => (this.controlsRef = el), controls: this.controls, isUtilityPanelVisible: this.isUtilityPanelVisible, undoState: this.undoState, onIsControlsReady: () => (this.isControlsReady = true) })));
348
348
  }
349
349
  static get watchers() { return {
350
350
  "isEngineReady": ["onIsEngineReady"],
@@ -1,4 +1,4 @@
1
- import { P as KritzelEngine$1, N as defineCustomElement$1 } from './p-BAplhrRJ.js';
1
+ import { Q as KritzelEngine$1, P as defineCustomElement$1 } from './p-D7BLVRXX.js';
2
2
 
3
3
  const KritzelEngine = KritzelEngine$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { K as KritzelFontFamily$1, d as defineCustomElement$1 } from './p-BgznZoBH.js';
1
+ import { K as KritzelFontFamily$1, d as defineCustomElement$1 } from './p-CFH6XRL5.js';
2
2
 
3
3
  const KritzelFontFamily = KritzelFontFamily$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { K as KritzelFontSize$1, d as defineCustomElement$1 } from './p-DDmSxM5f.js';
1
+ import { K as KritzelFontSize$1, d as defineCustomElement$1 } from './p-B6r22FSC.js';
2
2
 
3
3
  const KritzelFontSize = KritzelFontSize$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { K as KritzelFont$1, d as defineCustomElement$1 } from './p-uuRJU2R1.js';
1
+ import { K as KritzelFont$1, d as defineCustomElement$1 } from './p-Ck4lGnmt.js';
2
2
 
3
3
  const KritzelFont = KritzelFont$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { a as KritzelIcon$1, d as defineCustomElement$1 } from './p-Bhtn9qay.js';
1
+ import { a as KritzelIcon$1, d as defineCustomElement$1 } from './p-DbKKCHKd.js';
2
2
 
3
3
  const KritzelIcon = KritzelIcon$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { b as KritzelMenuItem$1, d as defineCustomElement$1 } from './p-CsA9M6me.js';
1
+ import { b as KritzelMenuItem$1, d as defineCustomElement$1 } from './p-CC8KFHSe.js';
2
2
 
3
3
  const KritzelMenuItem = KritzelMenuItem$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { K as KritzelMenu$1, a as defineCustomElement$1 } from './p-CsA9M6me.js';
1
+ import { K as KritzelMenu$1, a as defineCustomElement$1 } from './p-CC8KFHSe.js';
2
2
 
3
3
  const KritzelMenu = KritzelMenu$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { K as KritzelPortal$1, d as defineCustomElement$1 } from './p-D5Wq4x4r.js';
1
+ import { K as KritzelPortal$1, d as defineCustomElement$1 } from './p-OFrACpZf.js';
2
2
 
3
3
  const KritzelPortal = KritzelPortal$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { K as KritzelSplitButton$1, d as defineCustomElement$1 } from './p-TdCTkEu0.js';
1
+ import { K as KritzelSplitButton$1, d as defineCustomElement$1 } from './p-BdZKPKnx.js';
2
2
 
3
3
  const KritzelSplitButton = KritzelSplitButton$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { K as KritzelStrokeSize$1, d as defineCustomElement$1 } from './p-B4kxkVe-.js';
1
+ import { K as KritzelStrokeSize$1, d as defineCustomElement$1 } from './p-CRGwaUcp.js';
2
2
 
3
3
  const KritzelStrokeSize = KritzelStrokeSize$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { K as KritzelTooltip$1, d as defineCustomElement$1 } from './p-CTP479Lf.js';
1
+ import { K as KritzelTooltip$1, d as defineCustomElement$1 } from './p-9Fzdviju.js';
2
2
 
3
3
  const KritzelTooltip = KritzelTooltip$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { K as KritzelUtilityPanel$1, d as defineCustomElement$1 } from './p-DAfkuR8U.js';
1
+ import { K as KritzelUtilityPanel$1, d as defineCustomElement$1 } from './p-i0IlGLv2.js';
2
2
 
3
3
  const KritzelUtilityPanel = KritzelUtilityPanel$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { K as KritzelWorkspaceManager$1, d as defineCustomElement$1 } from './p-CK6no3mi.js';
1
+ import { K as KritzelWorkspaceManager$1, d as defineCustomElement$1 } from './p-58y59Acb.js';
2
2
 
3
3
  const KritzelWorkspaceManager = KritzelWorkspaceManager$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,10 +1,10 @@
1
1
  import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-CwkUrTy1.js';
2
2
  import { K as KritzelWorkspace } from './p-n789Y3S-.js';
3
3
  import { O as ObjectHelper } from './p-B0kd2rUI.js';
4
- import { d as defineCustomElement$5 } from './p-Bhtn9qay.js';
5
- import { d as defineCustomElement$3, a as defineCustomElement$4 } from './p-CsA9M6me.js';
6
- import { d as defineCustomElement$2 } from './p-D5Wq4x4r.js';
7
- import { d as defineCustomElement$1 } from './p-TdCTkEu0.js';
4
+ import { d as defineCustomElement$5 } from './p-DbKKCHKd.js';
5
+ import { d as defineCustomElement$3, a as defineCustomElement$4 } from './p-CC8KFHSe.js';
6
+ import { d as defineCustomElement$2 } from './p-OFrACpZf.js';
7
+ import { d as defineCustomElement$1 } from './p-BdZKPKnx.js';
8
8
 
9
9
  const kritzelWorkspaceManagerCss = ":host{display:flex;flex-direction:column;z-index:1}";
10
10
 
@@ -196,6 +196,6 @@ function defineCustomElement() {
196
196
  }
197
197
 
198
198
  export { KritzelWorkspaceManager as K, defineCustomElement as d };
199
- //# sourceMappingURL=p-CK6no3mi.js.map
199
+ //# sourceMappingURL=p-58y59Acb.js.map
200
200
 
201
- //# sourceMappingURL=p-CK6no3mi.js.map
201
+ //# sourceMappingURL=p-58y59Acb.js.map
@@ -1 +1 @@
1
- {"file":"p-CK6no3mi.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ui/kritzel-workspace-manager/kritzel-workspace-manager.css?tag=kritzel-workspace-manager&encapsulation=shadow","src/components/ui/kritzel-workspace-manager/kritzel-workspace-manager.tsx"],"sourcesContent":[":host {\r\n display: flex;\r\n flex-direction: column;\r\n z-index: 1;\r\n}\r\n","import { KritzelWorkspace } from '../../../classes/core/workspace.class';\r\nimport { ObjectHelper } from '../../../helpers/object.helper';\r\nimport { IKritzelMenuItem } from '../../../interfaces/menu-item.interface';\r\nimport { Host, h, Component, State, Prop, Event, EventEmitter, Element, Listen } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'kritzel-workspace-manager',\r\n styleUrl: 'kritzel-workspace-manager.css',\r\n shadow: true,\r\n})\r\nexport class KritzelWorkspaceManager {\r\n @Element() host!: HTMLElement;\r\n\r\n @Prop({ mutable: true }) activeWorkspace: KritzelWorkspace;\r\n @Prop() workspaces: KritzelWorkspace[] = [];\r\n\r\n @Event() isWorkspaceManagerReady: EventEmitter<void>;\r\n @Event() workspaceChange: EventEmitter<KritzelWorkspace>;\r\n\r\n @State() childMenuAnchor: HTMLElement = null;\r\n @State() openChildMenuItem: IKritzelMenuItem = null;\r\n @State() newWorkspace: KritzelWorkspace | null = null;\r\n @State() editingItemId: string | null = null;\r\n\r\n @Listen('wheel', { target: 'window', passive: false })\r\n handleWheel(event: WheelEvent) {\r\n if(event.ctrlKey){\r\n event.preventDefault();\r\n }\r\n }\r\n\r\n kritzelEngineRef: HTMLKritzelEngineElement | null = null;\r\n splitButtonRef!: HTMLKritzelSplitButtonElement;\r\n\r\n get sortedWorkspaces() {\r\n return [this.newWorkspace, ...this.workspaces].filter(ws => ws != null).sort((a, b) => b.createdAt.getTime() - a.createdAt.getTime());\r\n }\r\n\r\n async componentWillLoad() {\r\n await this.initializeEngine();\r\n this.isWorkspaceManagerReady.emit();\r\n }\r\n\r\n private async initializeEngine() {\r\n await customElements.whenDefined('kritzel-engine');\r\n this.kritzelEngineRef = this.host.parentElement.querySelector('kritzel-engine');\r\n\r\n if (!this.kritzelEngineRef) {\r\n throw new Error('kritzel-engine not found in parent element.');\r\n }\r\n }\r\n\r\n private async select(item: IKritzelMenuItem, parent: IKritzelMenuItem) {\r\n if (this.editingItemId) {\r\n return;\r\n }\r\n\r\n if (item.action) {\r\n item.action(item, parent);\r\n return;\r\n }\r\n\r\n this.workspaceChange.emit(item.value);\r\n }\r\n\r\n private async add() {\r\n await this.splitButtonRef.open();\r\n this.newWorkspace = new KritzelWorkspace(ObjectHelper.generateUUID(), 'New Workspace');\r\n this.editingItemId = this.newWorkspace.id;\r\n }\r\n\r\n private edit(item: IKritzelMenuItem) {\r\n this.openChildMenuItem = null;\r\n this.childMenuAnchor = null;\r\n requestAnimationFrame(() => {\r\n this.editingItemId = item.id;\r\n });\r\n }\r\n\r\n private async save(item: IKritzelMenuItem) {\r\n if (this.newWorkspace) {\r\n this.newWorkspace.name = item.label;\r\n await this.kritzelEngineRef.createWorkspace(this.newWorkspace);\r\n this.workspaceChange.emit(this.newWorkspace);\r\n } else {\r\n const workspace = item.value;\r\n workspace.name = item.label;\r\n await this.kritzelEngineRef.updateWorkspace(workspace);\r\n }\r\n\r\n this.editingItemId = null;\r\n this.newWorkspace = null;\r\n }\r\n\r\n private cancel() {\r\n this.newWorkspace = null;\r\n this.editingItemId = null;\r\n }\r\n\r\n private async delete(item: IKritzelMenuItem) {\r\n this.openChildMenuItem = null;\r\n this.childMenuAnchor = null;\r\n\r\n await this.kritzelEngineRef.deleteWorkspace(item.value);\r\n\r\n if (item.value.id === this.activeWorkspace?.id) {\r\n this.activeWorkspace = this.sortedWorkspaces.find(ws => ws.id !== item.value.id) || null;\r\n this.workspaceChange.emit(this.activeWorkspace);\r\n }\r\n\r\n await this.splitButtonRef.focusMenu();\r\n }\r\n\r\n private toggleChildMenu(item: IKritzelMenuItem, anchor: HTMLElement) {\r\n this.openChildMenuItem = item;\r\n this.childMenuAnchor = anchor;\r\n }\r\n\r\n private closeChildMenu() {\r\n this.openChildMenuItem = null;\r\n this.childMenuAnchor = null;\r\n }\r\n\r\n private handleMenuOpen() {\r\n this.kritzelEngineRef.disable();\r\n }\r\n\r\n private handleMenuClose() {\r\n this.cancel();\r\n this.closeChildMenu();\r\n this.kritzelEngineRef.enable();\r\n }\r\n\r\n render() {\r\n const menuItems = this.sortedWorkspaces\r\n .sort((a, b) => b.createdAt.getTime() - a.createdAt.getTime())\r\n .filter(ws => ws !== null)\r\n .map(ws => {\r\n return {\r\n id: ws.id,\r\n label: ws.name,\r\n value: ws,\r\n isEditing: this.editingItemId === ws.id,\r\n isSelected: this.activeWorkspace?.id === ws.id,\r\n isNewItem: this.newWorkspace?.id === ws.id,\r\n isChildMenuOpen: this.openChildMenuItem?.id === ws.id,\r\n childMenuAnchor: this.openChildMenuItem?.id === ws.id ? this.childMenuAnchor : null,\r\n children: [\r\n {\r\n id: `${ws.id}-rename`,\r\n label: 'Rename',\r\n value: 'rename',\r\n action: (_item, parent) => this.edit(parent),\r\n },\r\n {\r\n id: `${ws.id}-delete`,\r\n label: 'Delete',\r\n value: 'delete',\r\n isDisabled: this.sortedWorkspaces.length <= 1,\r\n action: (_item, parent) => this.delete(parent),\r\n },\r\n ],\r\n };\r\n });\r\n\r\n return (\r\n <Host>\r\n <kritzel-split-button\r\n ref={el => (this.splitButtonRef = el)}\r\n items={menuItems}\r\n mainButtonDisabled={this.editingItemId != null}\r\n onMainButtonClick={() => this.add()}\r\n onItemSelect={event => this.select(event.detail.item, event.detail.parent)}\r\n onItemToggleChildMenu={event => this.toggleChildMenu(event.detail.item, event.detail.childMenuAnchor)}\r\n onItemSave={event => this.save(event.detail)}\r\n onItemCancel={() => this.cancel()}\r\n onItemCloseChildMenu={() => this.closeChildMenu()}\r\n onMenuOpen={() => this.handleMenuOpen()}\r\n onMenuClose={() => this.handleMenuClose()}\r\n ></kritzel-split-button>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
1
+ {"file":"p-58y59Acb.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ui/kritzel-workspace-manager/kritzel-workspace-manager.css?tag=kritzel-workspace-manager&encapsulation=shadow","src/components/ui/kritzel-workspace-manager/kritzel-workspace-manager.tsx"],"sourcesContent":[":host {\r\n display: flex;\r\n flex-direction: column;\r\n z-index: 1;\r\n}\r\n","import { KritzelWorkspace } from '../../../classes/core/workspace.class';\r\nimport { ObjectHelper } from '../../../helpers/object.helper';\r\nimport { IKritzelMenuItem } from '../../../interfaces/menu-item.interface';\r\nimport { Host, h, Component, State, Prop, Event, EventEmitter, Element, Listen } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'kritzel-workspace-manager',\r\n styleUrl: 'kritzel-workspace-manager.css',\r\n shadow: true,\r\n})\r\nexport class KritzelWorkspaceManager {\r\n @Element() host!: HTMLElement;\r\n\r\n @Prop({ mutable: true }) activeWorkspace: KritzelWorkspace;\r\n @Prop() workspaces: KritzelWorkspace[] = [];\r\n\r\n @Event() isWorkspaceManagerReady: EventEmitter<void>;\r\n @Event() workspaceChange: EventEmitter<KritzelWorkspace>;\r\n\r\n @State() childMenuAnchor: HTMLElement = null;\r\n @State() openChildMenuItem: IKritzelMenuItem = null;\r\n @State() newWorkspace: KritzelWorkspace | null = null;\r\n @State() editingItemId: string | null = null;\r\n\r\n @Listen('wheel', { target: 'window', passive: false })\r\n handleWheel(event: WheelEvent) {\r\n if(event.ctrlKey){\r\n event.preventDefault();\r\n }\r\n }\r\n\r\n kritzelEngineRef: HTMLKritzelEngineElement | null = null;\r\n splitButtonRef!: HTMLKritzelSplitButtonElement;\r\n\r\n get sortedWorkspaces() {\r\n return [this.newWorkspace, ...this.workspaces].filter(ws => ws != null).sort((a, b) => b.createdAt.getTime() - a.createdAt.getTime());\r\n }\r\n\r\n async componentWillLoad() {\r\n await this.initializeEngine();\r\n this.isWorkspaceManagerReady.emit();\r\n }\r\n\r\n private async initializeEngine() {\r\n await customElements.whenDefined('kritzel-engine');\r\n this.kritzelEngineRef = this.host.parentElement.querySelector('kritzel-engine');\r\n\r\n if (!this.kritzelEngineRef) {\r\n throw new Error('kritzel-engine not found in parent element.');\r\n }\r\n }\r\n\r\n private async select(item: IKritzelMenuItem, parent: IKritzelMenuItem) {\r\n if (this.editingItemId) {\r\n return;\r\n }\r\n\r\n if (item.action) {\r\n item.action(item, parent);\r\n return;\r\n }\r\n\r\n this.workspaceChange.emit(item.value);\r\n }\r\n\r\n private async add() {\r\n await this.splitButtonRef.open();\r\n this.newWorkspace = new KritzelWorkspace(ObjectHelper.generateUUID(), 'New Workspace');\r\n this.editingItemId = this.newWorkspace.id;\r\n }\r\n\r\n private edit(item: IKritzelMenuItem) {\r\n this.openChildMenuItem = null;\r\n this.childMenuAnchor = null;\r\n requestAnimationFrame(() => {\r\n this.editingItemId = item.id;\r\n });\r\n }\r\n\r\n private async save(item: IKritzelMenuItem) {\r\n if (this.newWorkspace) {\r\n this.newWorkspace.name = item.label;\r\n await this.kritzelEngineRef.createWorkspace(this.newWorkspace);\r\n this.workspaceChange.emit(this.newWorkspace);\r\n } else {\r\n const workspace = item.value;\r\n workspace.name = item.label;\r\n await this.kritzelEngineRef.updateWorkspace(workspace);\r\n }\r\n\r\n this.editingItemId = null;\r\n this.newWorkspace = null;\r\n }\r\n\r\n private cancel() {\r\n this.newWorkspace = null;\r\n this.editingItemId = null;\r\n }\r\n\r\n private async delete(item: IKritzelMenuItem) {\r\n this.openChildMenuItem = null;\r\n this.childMenuAnchor = null;\r\n\r\n await this.kritzelEngineRef.deleteWorkspace(item.value);\r\n\r\n if (item.value.id === this.activeWorkspace?.id) {\r\n this.activeWorkspace = this.sortedWorkspaces.find(ws => ws.id !== item.value.id) || null;\r\n this.workspaceChange.emit(this.activeWorkspace);\r\n }\r\n\r\n await this.splitButtonRef.focusMenu();\r\n }\r\n\r\n private toggleChildMenu(item: IKritzelMenuItem, anchor: HTMLElement) {\r\n this.openChildMenuItem = item;\r\n this.childMenuAnchor = anchor;\r\n }\r\n\r\n private closeChildMenu() {\r\n this.openChildMenuItem = null;\r\n this.childMenuAnchor = null;\r\n }\r\n\r\n private handleMenuOpen() {\r\n this.kritzelEngineRef.disable();\r\n }\r\n\r\n private handleMenuClose() {\r\n this.cancel();\r\n this.closeChildMenu();\r\n this.kritzelEngineRef.enable();\r\n }\r\n\r\n render() {\r\n const menuItems = this.sortedWorkspaces\r\n .sort((a, b) => b.createdAt.getTime() - a.createdAt.getTime())\r\n .filter(ws => ws !== null)\r\n .map(ws => {\r\n return {\r\n id: ws.id,\r\n label: ws.name,\r\n value: ws,\r\n isEditing: this.editingItemId === ws.id,\r\n isSelected: this.activeWorkspace?.id === ws.id,\r\n isNewItem: this.newWorkspace?.id === ws.id,\r\n isChildMenuOpen: this.openChildMenuItem?.id === ws.id,\r\n childMenuAnchor: this.openChildMenuItem?.id === ws.id ? this.childMenuAnchor : null,\r\n children: [\r\n {\r\n id: `${ws.id}-rename`,\r\n label: 'Rename',\r\n value: 'rename',\r\n action: (_item, parent) => this.edit(parent),\r\n },\r\n {\r\n id: `${ws.id}-delete`,\r\n label: 'Delete',\r\n value: 'delete',\r\n isDisabled: this.sortedWorkspaces.length <= 1,\r\n action: (_item, parent) => this.delete(parent),\r\n },\r\n ],\r\n };\r\n });\r\n\r\n return (\r\n <Host>\r\n <kritzel-split-button\r\n ref={el => (this.splitButtonRef = el)}\r\n items={menuItems}\r\n mainButtonDisabled={this.editingItemId != null}\r\n onMainButtonClick={() => this.add()}\r\n onItemSelect={event => this.select(event.detail.item, event.detail.parent)}\r\n onItemToggleChildMenu={event => this.toggleChildMenu(event.detail.item, event.detail.childMenuAnchor)}\r\n onItemSave={event => this.save(event.detail)}\r\n onItemCancel={() => this.cancel()}\r\n onItemCloseChildMenu={() => this.closeChildMenu()}\r\n onMenuOpen={() => this.handleMenuOpen()}\r\n onMenuClose={() => this.handleMenuClose()}\r\n ></kritzel-split-button>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
@@ -74,23 +74,23 @@ const KritzelTooltip = /*@__PURE__*/ proxyCustomElement(class KritzelTooltip ext
74
74
  }
75
75
  }
76
76
  render() {
77
- return (h(Host, { key: '72a6356a43a15a7abc9a46b0d22c3c62217791e8', style: {
77
+ return (h(Host, { key: '8f78668b3d266d7a0eb140d01626998534acc252', style: {
78
78
  position: 'fixed',
79
79
  zIndex: '9999',
80
80
  transition: 'opacity 0.3s ease-in-out, transform 0.3s ease-in-out',
81
81
  visibility: this.isVisible ? 'visible' : 'hidden',
82
82
  left: !this.isMobileView ? `${this.positionX}px` : '50%',
83
83
  marginBottom: `${this.offsetY + this.arrowSize}px`,
84
- } }, h("div", { key: '75f5350f23ada0eee009279eddd7d25273ad3740', class: "tooltip-content", onClick: event => event.stopPropagation() }, h("slot", { key: 'ad999154289e933cac1fdc13392de2aec78811a8' }), h("div", { key: '6be3f5c24d42898920c339be2cd2f3dd8a82fa80', class: "tooltip-arrow-wrapper", style: {
84
+ } }, h("div", { key: '77b526b1687d41654b32b6f14d3e0400908b0a79', class: "tooltip-content", onClick: event => event.stopPropagation() }, h("slot", { key: 'fcd088608c091ff877b1e58425a0905c84c9999a' }), h("div", { key: '002913b582b5c034e7af722c433fbe79d0c32150', class: "tooltip-arrow-wrapper", style: {
85
85
  position: 'fixed',
86
86
  left: this.arrowOffset,
87
87
  bottom: `-${this.arrowSize * 2}px`,
88
- } }, h("div", { key: '37397c6245dd6b0def23e2611d118e0c4f5860ef', class: "tooltip-arrow", style: {
88
+ } }, h("div", { key: 'fc834bf34b464ac039ffb58e47485b76f8ced03e', class: "tooltip-arrow", style: {
89
89
  borderLeft: `${this.arrowSize}px solid transparent`,
90
90
  borderRight: `${this.arrowSize}px solid transparent`,
91
91
  borderTop: `${this.arrowSize}px solid var(--kritzel-controls-tooltip-background-color, #ffffff)`,
92
92
  filter: 'drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2))',
93
- } }), h("div", { key: 'dbf009c371d46ef0a36e27771758c66e817d9b22', class: "tooltip-arrow-rect", style: {
93
+ } }), h("div", { key: '65939011ae607a144f8217cf3aa5bdd2ff0f88fc', class: "tooltip-arrow-rect", style: {
94
94
  position: 'relative',
95
95
  width: `${this.arrowSize * 2}px`,
96
96
  height: `${this.arrowSize}px`,
@@ -124,6 +124,6 @@ function defineCustomElement() {
124
124
  }
125
125
 
126
126
  export { KritzelTooltip as K, defineCustomElement as d };
127
- //# sourceMappingURL=p-CTP479Lf.js.map
127
+ //# sourceMappingURL=p-9Fzdviju.js.map
128
128
 
129
- //# sourceMappingURL=p-CTP479Lf.js.map
129
+ //# sourceMappingURL=p-9Fzdviju.js.map
@@ -1 +1 @@
1
- {"file":"p-CTP479Lf.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-tooltip/kritzel-tooltip.css?tag=kritzel-tooltip&encapsulation=shadow","src/components/shared/kritzel-tooltip/kritzel-tooltip.tsx"],"sourcesContent":[":host {\r\n width: auto;\r\n}\r\n\r\n.tooltip-content {\r\n position: relative;\r\n padding: 8px 12px;\r\n border-radius: 4px;\r\n width: fit-content;\r\n background-color: var(--kritzel-controls-tooltip-background-color, #ffffff);\r\n color: var(--kritzel-controls-tooltip-color, #000000);\r\n padding: var(--kritzel-controls-tooltip-padding, 8px);\r\n border-radius: var(--kritzel-controls-tooltip-border-radius, 16px);\r\n white-space: nowrap;\r\n box-shadow: var(--kritzel-controls-tooltip-box-shadow, 0 1px 6px rgba(0, 0, 0, 0.12));\r\n}\r\n\r\n","import { Component, Host, Prop, h, Element, State, Listen, Method, Event, EventEmitter } from '@stencil/core';\r\nimport { KritzelHTMLHelper } from '../../../helpers/html.helper';\r\n\r\nconst MOBILE_BREAKPOINT = 768;\r\n\r\n@Component({\r\n tag: 'kritzel-tooltip',\r\n styleUrl: 'kritzel-tooltip.css',\r\n shadow: true,\r\n})\r\nexport class KritzelTooltip {\r\n @Element() host: HTMLElement;\r\n\r\n @Prop() isVisible: boolean = false;\r\n @Prop() anchorElement: HTMLElement;\r\n @Prop() arrowSize: number = 8;\r\n @Prop() offsetY: number = 24;\r\n\r\n @Event() tooltipClosed: EventEmitter<void>;\r\n\r\n @State() positionX: number = 0;\r\n @State() arrowOffset: string = '0px';\r\n @State() isMobileView: boolean = window.innerWidth < MOBILE_BREAKPOINT;\r\n\r\n @Listen('click', { target: 'document' })\r\n handleOutsideClick(event: MouseEvent) {\r\n if( !this.isVisible ) return;\r\n const target = event.target as HTMLElement;\r\n if (!this.host.contains(target)) {\r\n this.tooltipClosed.emit();\r\n }\r\n }\r\n\r\n @Listen('resize', { target: 'window' })\r\n handleWindowResize() {\r\n this.isMobileView = window.innerWidth < MOBILE_BREAKPOINT;\r\n this.calculateAdjustedPosition();\r\n }\r\n\r\n @Method()\r\n async focusContent() {\r\n const focusableElements = KritzelHTMLHelper.getFocusableElements(this.host);\r\n if (focusableElements.length > 0) {\r\n focusableElements[0].focus();\r\n }\r\n }\r\n\r\n componentDidLoad() {\r\n this.focusSlottedContent();\r\n }\r\n\r\n componentWillLoad() {\r\n this.isMobileView = window.innerWidth < MOBILE_BREAKPOINT;\r\n this.calculateAdjustedPosition();\r\n }\r\n\r\n componentWillUpdate() {\r\n this.calculateAdjustedPosition();\r\n }\r\n\r\n private focusSlottedContent() {\r\n const slot = this.host.shadowRoot?.querySelector('slot');\r\n const assignedElements = slot?.assignedElements() || [];\r\n if (assignedElements.length > 0) {\r\n const firstElement = assignedElements[0] as HTMLElement;\r\n firstElement.focus();\r\n }\r\n }\r\n\r\n private calculateAdjustedPosition() {\r\n if (this.isVisible && this.anchorElement) {\r\n const anchorRect = this.anchorElement.getBoundingClientRect();\r\n const tooltipContent = this.host.shadowRoot?.querySelector('.tooltip-content') as HTMLElement;\r\n\r\n if (!this.isMobileView) {\r\n this.positionX = anchorRect.left + anchorRect.width / 2;\r\n this.arrowOffset = `calc(${50}% - ${this.arrowSize}px)`; \r\n } else {\r\n const tooltipRect = tooltipContent.getBoundingClientRect();\r\n this.positionX = anchorRect.left + anchorRect.width / 2 - tooltipRect.width / 2;\r\n this.arrowOffset = `${anchorRect.left + anchorRect.width / 2 - tooltipRect.left - this.arrowSize}px`;\r\n }\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <Host\r\n style={{\r\n position: 'fixed',\r\n zIndex: '9999',\r\n transition: 'opacity 0.3s ease-in-out, transform 0.3s ease-in-out',\r\n visibility: this.isVisible ? 'visible' : 'hidden',\r\n left: !this.isMobileView ? `${this.positionX}px` : '50%',\r\n marginBottom: `${this.offsetY + this.arrowSize}px`,\r\n }}\r\n >\r\n <div class=\"tooltip-content\" onClick={event => event.stopPropagation()}>\r\n <slot></slot>\r\n <div\r\n class=\"tooltip-arrow-wrapper\"\r\n style={{\r\n position: 'fixed',\r\n left: this.arrowOffset,\r\n bottom: `-${this.arrowSize * 2}px`,\r\n }}\r\n >\r\n <div\r\n class=\"tooltip-arrow\"\r\n style={{\r\n borderLeft: `${this.arrowSize}px solid transparent`,\r\n borderRight: `${this.arrowSize}px solid transparent`,\r\n borderTop: `${this.arrowSize}px solid var(--kritzel-controls-tooltip-background-color, #ffffff)`,\r\n filter: 'drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2))',\r\n }}\r\n ></div>\r\n <div\r\n class=\"tooltip-arrow-rect\"\r\n style={{\r\n position: 'relative',\r\n width: `${this.arrowSize * 2}px`,\r\n height: `${this.arrowSize}px`,\r\n backgroundColor: 'var(--kritzel-controls-tooltip-background-color, #ffffff)',\r\n bottom: `${this.arrowSize * 2}px`,\r\n }}\r\n ></div>\r\n </div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
1
+ {"file":"p-9Fzdviju.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-tooltip/kritzel-tooltip.css?tag=kritzel-tooltip&encapsulation=shadow","src/components/shared/kritzel-tooltip/kritzel-tooltip.tsx"],"sourcesContent":[":host {\r\n width: auto;\r\n}\r\n\r\n.tooltip-content {\r\n position: relative;\r\n padding: 8px 12px;\r\n border-radius: 4px;\r\n width: fit-content;\r\n background-color: var(--kritzel-controls-tooltip-background-color, #ffffff);\r\n color: var(--kritzel-controls-tooltip-color, #000000);\r\n padding: var(--kritzel-controls-tooltip-padding, 8px);\r\n border-radius: var(--kritzel-controls-tooltip-border-radius, 16px);\r\n white-space: nowrap;\r\n box-shadow: var(--kritzel-controls-tooltip-box-shadow, 0 1px 6px rgba(0, 0, 0, 0.12));\r\n}\r\n\r\n","import { Component, Host, Prop, h, Element, State, Listen, Method, Event, EventEmitter } from '@stencil/core';\r\nimport { KritzelHTMLHelper } from '../../../helpers/html.helper';\r\n\r\nconst MOBILE_BREAKPOINT = 768;\r\n\r\n@Component({\r\n tag: 'kritzel-tooltip',\r\n styleUrl: 'kritzel-tooltip.css',\r\n shadow: true,\r\n})\r\nexport class KritzelTooltip {\r\n @Element() host: HTMLElement;\r\n\r\n @Prop() isVisible: boolean = false;\r\n @Prop() anchorElement: HTMLElement;\r\n @Prop() arrowSize: number = 8;\r\n @Prop() offsetY: number = 24;\r\n\r\n @Event() tooltipClosed: EventEmitter<void>;\r\n\r\n @State() positionX: number = 0;\r\n @State() arrowOffset: string = '0px';\r\n @State() isMobileView: boolean = window.innerWidth < MOBILE_BREAKPOINT;\r\n\r\n @Listen('click', { target: 'document' })\r\n handleOutsideClick(event: MouseEvent) {\r\n if( !this.isVisible ) return;\r\n const target = event.target as HTMLElement;\r\n if (!this.host.contains(target)) {\r\n this.tooltipClosed.emit();\r\n }\r\n }\r\n\r\n @Listen('resize', { target: 'window' })\r\n handleWindowResize() {\r\n this.isMobileView = window.innerWidth < MOBILE_BREAKPOINT;\r\n this.calculateAdjustedPosition();\r\n }\r\n\r\n @Method()\r\n async focusContent() {\r\n const focusableElements = KritzelHTMLHelper.getFocusableElements(this.host);\r\n if (focusableElements.length > 0) {\r\n focusableElements[0].focus();\r\n }\r\n }\r\n\r\n componentDidLoad() {\r\n this.focusSlottedContent();\r\n }\r\n\r\n componentWillLoad() {\r\n this.isMobileView = window.innerWidth < MOBILE_BREAKPOINT;\r\n this.calculateAdjustedPosition();\r\n }\r\n\r\n componentWillUpdate() {\r\n this.calculateAdjustedPosition();\r\n }\r\n\r\n private focusSlottedContent() {\r\n const slot = this.host.shadowRoot?.querySelector('slot');\r\n const assignedElements = slot?.assignedElements() || [];\r\n if (assignedElements.length > 0) {\r\n const firstElement = assignedElements[0] as HTMLElement;\r\n firstElement.focus();\r\n }\r\n }\r\n\r\n private calculateAdjustedPosition() {\r\n if (this.isVisible && this.anchorElement) {\r\n const anchorRect = this.anchorElement.getBoundingClientRect();\r\n const tooltipContent = this.host.shadowRoot?.querySelector('.tooltip-content') as HTMLElement;\r\n\r\n if (!this.isMobileView) {\r\n this.positionX = anchorRect.left + anchorRect.width / 2;\r\n this.arrowOffset = `calc(${50}% - ${this.arrowSize}px)`; \r\n } else {\r\n const tooltipRect = tooltipContent.getBoundingClientRect();\r\n this.positionX = anchorRect.left + anchorRect.width / 2 - tooltipRect.width / 2;\r\n this.arrowOffset = `${anchorRect.left + anchorRect.width / 2 - tooltipRect.left - this.arrowSize}px`;\r\n }\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <Host\r\n style={{\r\n position: 'fixed',\r\n zIndex: '9999',\r\n transition: 'opacity 0.3s ease-in-out, transform 0.3s ease-in-out',\r\n visibility: this.isVisible ? 'visible' : 'hidden',\r\n left: !this.isMobileView ? `${this.positionX}px` : '50%',\r\n marginBottom: `${this.offsetY + this.arrowSize}px`,\r\n }}\r\n >\r\n <div class=\"tooltip-content\" onClick={event => event.stopPropagation()}>\r\n <slot></slot>\r\n <div\r\n class=\"tooltip-arrow-wrapper\"\r\n style={{\r\n position: 'fixed',\r\n left: this.arrowOffset,\r\n bottom: `-${this.arrowSize * 2}px`,\r\n }}\r\n >\r\n <div\r\n class=\"tooltip-arrow\"\r\n style={{\r\n borderLeft: `${this.arrowSize}px solid transparent`,\r\n borderRight: `${this.arrowSize}px solid transparent`,\r\n borderTop: `${this.arrowSize}px solid var(--kritzel-controls-tooltip-background-color, #ffffff)`,\r\n filter: 'drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2))',\r\n }}\r\n ></div>\r\n <div\r\n class=\"tooltip-arrow-rect\"\r\n style={{\r\n position: 'relative',\r\n width: `${this.arrowSize * 2}px`,\r\n height: `${this.arrowSize}px`,\r\n backgroundColor: 'var(--kritzel-controls-tooltip-background-color, #ffffff)',\r\n bottom: `${this.arrowSize * 2}px`,\r\n }}\r\n ></div>\r\n </div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
@@ -1,7 +1,7 @@
1
1
  import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-CwkUrTy1.js';
2
- import { d as defineCustomElement$1 } from './p-uuRJU2R1.js';
2
+ import { d as defineCustomElement$1 } from './p-Ck4lGnmt.js';
3
3
 
4
- const kritzelFontSizeCss = ":host{display:flex;align-items:flex-start;gap:8px;padding:8px;box-sizing:border-box}.size-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:4px;cursor:pointer;border:2px solid transparent;box-sizing:border-box;border-radius:50%}.size-container:hover{background-color:var(--kritzel-font-size-hover-background-color, #ebebeb)}.size-container.selected{border-color:var(--kritzel-selection-border-color, #007AFF);background-color:var(--kritzel-font-size-selected-background-color, #e0e0e0)}";
4
+ const kritzelFontSizeCss = ":host{display:flex;align-items:flex-start;gap:8px;padding:8px;box-sizing:border-box}.size-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:4px;cursor:var(--kritzel-pointer-cursor, pointer);border:2px solid transparent;box-sizing:border-box;border-radius:50%}.size-container:hover{background-color:var(--kritzel-font-size-hover-background-color, #ebebeb)}.size-container.selected{border-color:var(--kritzel-selection-border-color, #007AFF);background-color:var(--kritzel-font-size-selected-background-color, #e0e0e0)}";
5
5
 
6
6
  const KritzelFontSize = /*@__PURE__*/ proxyCustomElement(class KritzelFontSize extends H {
7
7
  constructor(registerHost) {
@@ -21,7 +21,7 @@ const KritzelFontSize = /*@__PURE__*/ proxyCustomElement(class KritzelFontSize e
21
21
  this.sizeChange.emit(size);
22
22
  }
23
23
  render() {
24
- return (h(Host, { key: '9f3d851d443352f7437116cf91eff8d8de41e322' }, this.sizes.map(size => (h("div", { class: {
24
+ return (h(Host, { key: 'd20034d67eb857065dca11d96074fdf4234c0ef4' }, this.sizes.map(size => (h("div", { class: {
25
25
  'size-container': true,
26
26
  'selected': this.selectedSize === size,
27
27
  }, onClick: () => this.handleSizeClick(size) }, h("kritzel-font", { fontFamily: this.fontFamily, size: size }))))));
@@ -52,6 +52,6 @@ function defineCustomElement() {
52
52
  }
53
53
 
54
54
  export { KritzelFontSize as K, defineCustomElement as d };
55
- //# sourceMappingURL=p-DDmSxM5f.js.map
55
+ //# sourceMappingURL=p-B6r22FSC.js.map
56
56
 
57
- //# sourceMappingURL=p-DDmSxM5f.js.map
57
+ //# sourceMappingURL=p-B6r22FSC.js.map
@@ -0,0 +1 @@
1
+ {"file":"p-B6r22FSC.js","mappings":";;;AAAA,MAAM,kBAAkB,GAAG,2jBAA2jB;;MCOzkB,eAAe,iBAAAA,kBAAA,CAAA,MAAA,eAAA,SAAAC,CAAA,CAAA;;;;;;;;;AAClB,IAAA,KAAK,GAAa,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;IACxB,YAAY,GAAkB,IAAI;IAEnD,UAAU,GAAW,OAAO;AAE3B,IAAA,UAAU;AAEX,IAAA,eAAe,CAAC,IAAY,EAAA;AAClC,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI;AACxB,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;;IAG5B,MAAM,GAAA;AACJ,QAAA,QACE,CAAC,CAAA,IAAI,EACF,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,KAClB,CAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAE;AACL,gBAAA,gBAAgB,EAAE,IAAI;AACtB,gBAAA,UAAU,EAAE,IAAI,CAAC,YAAY,KAAK,IAAI;AACvC,aAAA,EACD,OAAO,EAAE,MAAM,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAA,EAEzC,CAAA,CAAA,cAAA,EAAA,EAAc,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,EAAE,IAAI,GAAiB,CAClE,CACP,CAAC,CACG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-font-size/kritzel-font-size.css?tag=kritzel-font-size&encapsulation=shadow","src/components/shared/kritzel-font-size/kritzel-font-size.tsx"],"sourcesContent":[":host {\r\n display: flex;\r\n align-items: flex-start;\r\n gap: 8px;\r\n padding: 8px;\r\n box-sizing: border-box;\r\n}\r\n\r\n.size-container {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n width: 32px;\r\n height: 32px;\r\n border-radius: 4px;\r\n cursor: var(--kritzel-pointer-cursor, pointer);\r\n border: 2px solid transparent;\r\n box-sizing: border-box;\r\n border-radius: 50%;\r\n}\r\n\r\n.size-container:hover {\r\n background-color: var(--kritzel-font-size-hover-background-color, #ebebeb);\r\n}\r\n\r\n.size-container.selected {\r\n border-color: var(--kritzel-selection-border-color, #007AFF);\r\n background-color: var(--kritzel-font-size-selected-background-color, #e0e0e0);\r\n}\r\n\r\n","import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'kritzel-font-size',\r\n styleUrl: 'kritzel-font-size.css',\r\n shadow: true,\r\n})\r\nexport class KritzelFontSize {\r\n @Prop() sizes: number[] = [8, 10, 12, 16, 20, 24];\r\n @Prop({ mutable: true }) selectedSize: number | null = null;\r\n\r\n @Prop() fontFamily: string = 'Arial';\r\n\r\n @Event() sizeChange: EventEmitter<number>;\r\n\r\n private handleSizeClick(size: number) {\r\n this.selectedSize = size;\r\n this.sizeChange.emit(size);\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n {this.sizes.map(size => (\r\n <div\r\n class={{\r\n 'size-container': true,\r\n 'selected': this.selectedSize === size,\r\n }}\r\n onClick={() => this.handleSizeClick(size)}\r\n >\r\n <kritzel-font fontFamily={this.fontFamily} size={size}></kritzel-font>\r\n </div>\r\n ))}\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
@@ -73,7 +73,7 @@ const KritzelCursorTrail = /*@__PURE__*/ proxyCustomElement(class KritzelCursorT
73
73
  }
74
74
  }
75
75
  render() {
76
- return (h(Host, { key: '10ef620f19d72a8a5c3a12d0d98686bc69308a30' }, this.cursorTrailPoints.length > 1 && (h("svg", { key: 'd03403051e53422aaa28d6360aaa9c0391e3ef6a', class: "cursor-trail-svg", xmlns: "http://www.w3.org/2000/svg", style: {
76
+ return (h(Host, { key: '2bbe2e331555476316c4460ff64fae7a955eee3d' }, this.cursorTrailPoints.length > 1 && (h("svg", { key: '78a354686ff624afba1a3c31df02dbefaf295d4b', class: "cursor-trail-svg", xmlns: "http://www.w3.org/2000/svg", style: {
77
77
  position: 'absolute',
78
78
  left: '0',
79
79
  top: '0',
@@ -114,6 +114,6 @@ function defineCustomElement() {
114
114
  }
115
115
 
116
116
  export { KritzelCursorTrail as K, defineCustomElement as d };
117
- //# sourceMappingURL=p-CLt3HMl6.js.map
117
+ //# sourceMappingURL=p-B_3OZeom.js.map
118
118
 
119
- //# sourceMappingURL=p-CLt3HMl6.js.map
119
+ //# sourceMappingURL=p-B_3OZeom.js.map
@@ -1 +1 @@
1
- {"file":"p-CLt3HMl6.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/core/kritzel-cursor-trail/kritzel-cursor-trail.css?tag=kritzel-cursor-trail&encapsulation=shadow","src/components/core/kritzel-cursor-trail/kritzel-cursor-trail.tsx"],"sourcesContent":[":host {\r\n display: block;\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100vw;\r\n height: 100vh;\r\n pointer-events: none;\r\n z-index: 9000;\r\n}\r\n","import { Component, Host, Listen, Prop, State, h } from '@stencil/core';\r\nimport { KritzelMouseButton } from '../../../enums/event-button.enum';\r\nimport { KritzelCore } from '../../../classes/core/core.class';\r\n\r\n@Component({\r\n tag: 'kritzel-cursor-trail',\r\n styleUrl: 'kritzel-cursor-trail.css',\r\n shadow: true,\r\n})\r\nexport class KritzelCursorTrail {\r\n @Prop() core: KritzelCore;\r\n\r\n @State() cursorTrailPoints: Array<{ x: number; y: number; timestamp: number }> = [];\r\n @State() isLeftButtonDown: boolean = false;\r\n\r\n @Listen('pointerdown', { target: 'window', passive: true })\r\n handleMouseDown(ev: PointerEvent) {\r\n if (ev.pointerType === 'mouse') {\r\n if (ev.button === KritzelMouseButton.Left) {\r\n this.isLeftButtonDown = true;\r\n this.cursorTrailPoints = [];\r\n }\r\n }\r\n\r\n if (ev.pointerType === 'touch') {\r\n if (this.core.store.state.pointers.size === 1) {\r\n this.isLeftButtonDown = true;\r\n this.cursorTrailPoints = [];\r\n }\r\n }\r\n }\r\n\r\n @Listen('pointermove', { target: 'window', passive: true })\r\n handlePointerMove(ev: PointerEvent) {\r\n if (!this.isLeftButtonDown) {\r\n return;\r\n }\r\n const newPoint = { x: ev.clientX, y: ev.clientY, timestamp: Date.now() };\r\n const updatedTrail = [newPoint, ...this.cursorTrailPoints];\r\n if (updatedTrail.length > this.MAX_TRAIL_POINTS) {\r\n this.cursorTrailPoints = updatedTrail.slice(0, this.MAX_TRAIL_POINTS);\r\n } else {\r\n this.cursorTrailPoints = updatedTrail;\r\n }\r\n }\r\n\r\n @Listen('pointerup', { target: 'window', passive: true })\r\n handlePointerUp(ev: PointerEvent) {\r\n if (ev.pointerType === 'mouse') {\r\n if (ev.button === KritzelMouseButton.Left) {\r\n this.isLeftButtonDown = false;\r\n this.cursorTrailPoints = [];\r\n }\r\n }\r\n\r\n if (ev.pointerType === 'touch') {\r\n if (this.core.store.state.pointers.size === 0) {\r\n this.isLeftButtonDown = false;\r\n this.cursorTrailPoints = [];\r\n }\r\n }\r\n }\r\n\r\n private trailCleanupIntervalId: number;\r\n\r\n private readonly TRAIL_DURATION_MS = 100;\r\n\r\n private readonly MAX_TRAIL_POINTS = 50;\r\n\r\n componentDidLoad() {\r\n this.trailCleanupIntervalId = window.setInterval(() => {\r\n const now = Date.now();\r\n const newTrailPoints = this.cursorTrailPoints.filter(p => now - p.timestamp < this.TRAIL_DURATION_MS);\r\n if (newTrailPoints.length !== this.cursorTrailPoints.length) {\r\n this.cursorTrailPoints = newTrailPoints;\r\n }\r\n }, 50);\r\n }\r\n\r\n disconnectedCallback() {\r\n if (this.trailCleanupIntervalId) {\r\n window.clearInterval(this.trailCleanupIntervalId);\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n {this.cursorTrailPoints.length > 1 && (\r\n <svg\r\n class=\"cursor-trail-svg\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n style={{\r\n position: 'absolute',\r\n left: '0',\r\n top: '0',\r\n width: '100%',\r\n height: '100%',\r\n pointerEvents: 'none',\r\n opacity: 'var(--kritzel-cursor-trail-opacity, 0.6)',\r\n zIndex: '9000',\r\n }}\r\n >\r\n {this.cursorTrailPoints.slice(1).map((point, index) => {\r\n const prevPoint = this.cursorTrailPoints[index];\r\n const now = Date.now();\r\n const age = now - point.timestamp;\r\n const progress = Math.max(0, Math.min(1, age / this.TRAIL_DURATION_MS));\r\n\r\n if (progress >= 1) return null;\r\n\r\n const baseStrokeWidth = Math.max(2, 15 * (1 - progress));\r\n\r\n return (\r\n <line\r\n key={`trail-segment-${point.timestamp}`}\r\n x1={prevPoint.x.toString()}\r\n y1={prevPoint.y.toString()}\r\n x2={point.x.toString()}\r\n y2={point.y.toString()}\r\n stroke=\"var(--kritzel-cursor-trail-color, rgb(228, 228, 228))\"\r\n stroke-width={baseStrokeWidth.toString()}\r\n stroke-linecap=\"round\"\r\n />\r\n );\r\n })}\r\n </svg>\r\n )}\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
1
+ {"file":"p-B_3OZeom.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/core/kritzel-cursor-trail/kritzel-cursor-trail.css?tag=kritzel-cursor-trail&encapsulation=shadow","src/components/core/kritzel-cursor-trail/kritzel-cursor-trail.tsx"],"sourcesContent":[":host {\r\n display: block;\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100vw;\r\n height: 100vh;\r\n pointer-events: none;\r\n z-index: 9000;\r\n}\r\n","import { Component, Host, Listen, Prop, State, h } from '@stencil/core';\r\nimport { KritzelMouseButton } from '../../../enums/event-button.enum';\r\nimport { KritzelCore } from '../../../classes/core/core.class';\r\n\r\n@Component({\r\n tag: 'kritzel-cursor-trail',\r\n styleUrl: 'kritzel-cursor-trail.css',\r\n shadow: true,\r\n})\r\nexport class KritzelCursorTrail {\r\n @Prop() core: KritzelCore;\r\n\r\n @State() cursorTrailPoints: Array<{ x: number; y: number; timestamp: number }> = [];\r\n @State() isLeftButtonDown: boolean = false;\r\n\r\n @Listen('pointerdown', { target: 'window', passive: true })\r\n handleMouseDown(ev: PointerEvent) {\r\n if (ev.pointerType === 'mouse') {\r\n if (ev.button === KritzelMouseButton.Left) {\r\n this.isLeftButtonDown = true;\r\n this.cursorTrailPoints = [];\r\n }\r\n }\r\n\r\n if (ev.pointerType === 'touch') {\r\n if (this.core.store.state.pointers.size === 1) {\r\n this.isLeftButtonDown = true;\r\n this.cursorTrailPoints = [];\r\n }\r\n }\r\n }\r\n\r\n @Listen('pointermove', { target: 'window', passive: true })\r\n handlePointerMove(ev: PointerEvent) {\r\n if (!this.isLeftButtonDown) {\r\n return;\r\n }\r\n const newPoint = { x: ev.clientX, y: ev.clientY, timestamp: Date.now() };\r\n const updatedTrail = [newPoint, ...this.cursorTrailPoints];\r\n if (updatedTrail.length > this.MAX_TRAIL_POINTS) {\r\n this.cursorTrailPoints = updatedTrail.slice(0, this.MAX_TRAIL_POINTS);\r\n } else {\r\n this.cursorTrailPoints = updatedTrail;\r\n }\r\n }\r\n\r\n @Listen('pointerup', { target: 'window', passive: true })\r\n handlePointerUp(ev: PointerEvent) {\r\n if (ev.pointerType === 'mouse') {\r\n if (ev.button === KritzelMouseButton.Left) {\r\n this.isLeftButtonDown = false;\r\n this.cursorTrailPoints = [];\r\n }\r\n }\r\n\r\n if (ev.pointerType === 'touch') {\r\n if (this.core.store.state.pointers.size === 0) {\r\n this.isLeftButtonDown = false;\r\n this.cursorTrailPoints = [];\r\n }\r\n }\r\n }\r\n\r\n private trailCleanupIntervalId: number;\r\n\r\n private readonly TRAIL_DURATION_MS = 100;\r\n\r\n private readonly MAX_TRAIL_POINTS = 50;\r\n\r\n componentDidLoad() {\r\n this.trailCleanupIntervalId = window.setInterval(() => {\r\n const now = Date.now();\r\n const newTrailPoints = this.cursorTrailPoints.filter(p => now - p.timestamp < this.TRAIL_DURATION_MS);\r\n if (newTrailPoints.length !== this.cursorTrailPoints.length) {\r\n this.cursorTrailPoints = newTrailPoints;\r\n }\r\n }, 50);\r\n }\r\n\r\n disconnectedCallback() {\r\n if (this.trailCleanupIntervalId) {\r\n window.clearInterval(this.trailCleanupIntervalId);\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n {this.cursorTrailPoints.length > 1 && (\r\n <svg\r\n class=\"cursor-trail-svg\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n style={{\r\n position: 'absolute',\r\n left: '0',\r\n top: '0',\r\n width: '100%',\r\n height: '100%',\r\n pointerEvents: 'none',\r\n opacity: 'var(--kritzel-cursor-trail-opacity, 0.6)',\r\n zIndex: '9000',\r\n }}\r\n >\r\n {this.cursorTrailPoints.slice(1).map((point, index) => {\r\n const prevPoint = this.cursorTrailPoints[index];\r\n const now = Date.now();\r\n const age = now - point.timestamp;\r\n const progress = Math.max(0, Math.min(1, age / this.TRAIL_DURATION_MS));\r\n\r\n if (progress >= 1) return null;\r\n\r\n const baseStrokeWidth = Math.max(2, 15 * (1 - progress));\r\n\r\n return (\r\n <line\r\n key={`trail-segment-${point.timestamp}`}\r\n x1={prevPoint.x.toString()}\r\n y1={prevPoint.y.toString()}\r\n x2={point.x.toString()}\r\n y2={point.y.toString()}\r\n stroke=\"var(--kritzel-cursor-trail-color, rgb(228, 228, 228))\"\r\n stroke-width={baseStrokeWidth.toString()}\r\n stroke-linecap=\"round\"\r\n />\r\n );\r\n })}\r\n </svg>\r\n )}\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
@@ -1,10 +1,10 @@
1
1
  import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-CwkUrTy1.js';
2
2
  import { K as KritzelDevicesHelper } from './p-l10It7Nm.js';
3
- import { d as defineCustomElement$4 } from './p-Bhtn9qay.js';
4
- import { d as defineCustomElement$2, a as defineCustomElement$3 } from './p-CsA9M6me.js';
5
- import { d as defineCustomElement$1 } from './p-D5Wq4x4r.js';
3
+ import { d as defineCustomElement$4 } from './p-DbKKCHKd.js';
4
+ import { d as defineCustomElement$2, a as defineCustomElement$3 } from './p-CC8KFHSe.js';
5
+ import { d as defineCustomElement$1 } from './p-OFrACpZf.js';
6
6
 
7
- const kritzelSplitButtonCss = ":host{position:relative;display:flex;align-items:center;font-family:sans-serif;z-index:1;padding:var(--kritzel-split-button-padding, 4px);background-color:var(--kritzel-split-button-background-color, #ffffff);border-radius:var(--kritzel-split-button-border-radius, 12px);box-shadow:var(--kritzel-split-button-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));border:var(--kritzel-split-button-border, 1px solid #ebebeb);gap:var(--kritzel-split-button-gap, 4px)}:host(.mobile){--kritzel-split-button-hover-background-color:transparent}button{border:none;background-color:transparent;padding:0;margin:0;font-family:inherit;font-size:inherit;color:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;text-align:center;display:flex;align-items:center;justify-content:center;pointer-events:all;-webkit-tap-highlight-color:transparent}.split-main-button,.split-menu-button{height:auto;display:flex;align-items:center;padding:var(--kritzel-split-button-padding, 8px);background-color:var(--kritzel-split-button-background-color, #ffffff);border-radius:var(--kritzel-split-button-border-radius, 12px);font-size:var(--kritzel-split-button-font-size, 14px)}.split-main-button:hover,.split-menu-button:hover{background-color:var(--kritzel-split-button-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.split-main-button:focus,.split-menu-button:focus{background-color:var(--kritzel-split-button-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.split-main-button{gap:var(--kritzel-split-button-gap, 4px)}.split-menu-button{border-left:none;justify-content:center}.split-divider{width:var(--kritzel-split-button-divider-width, 1px);height:24px;background-color:var(--kritzel-split-button-divider-background-color, hsl(0, 0%, 0%, 4.3%))}:disabled{pointer-events:none;opacity:0.5}";
7
+ const kritzelSplitButtonCss = ":host{position:relative;display:flex;align-items:center;font-family:sans-serif;z-index:1;padding:var(--kritzel-split-button-padding, 4px);background-color:var(--kritzel-split-button-background-color, #ffffff);border-radius:var(--kritzel-split-button-border-radius, 12px);box-shadow:var(--kritzel-split-button-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));border:var(--kritzel-split-button-border, 1px solid #ebebeb);gap:var(--kritzel-split-button-gap, 4px)}:host(.mobile){--kritzel-split-button-hover-background-color:transparent}button{border:none;background-color:transparent;padding:0;margin:0;font-family:inherit;font-size:inherit;color:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:var(--kritzel-pointer-cursor, pointer);text-align:center;display:flex;align-items:center;justify-content:center;pointer-events:all;-webkit-tap-highlight-color:transparent}.split-main-button,.split-menu-button{height:auto;display:flex;align-items:center;padding:var(--kritzel-split-button-padding, 8px);background-color:var(--kritzel-split-button-background-color, #ffffff);border-radius:var(--kritzel-split-button-border-radius, 12px);font-size:var(--kritzel-split-button-font-size, 14px)}.split-main-button:hover,.split-menu-button:hover{background-color:var(--kritzel-split-button-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.split-main-button:focus,.split-menu-button:focus{background-color:var(--kritzel-split-button-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.split-main-button{gap:var(--kritzel-split-button-gap, 4px)}.split-menu-button{border-left:none;justify-content:center}.split-divider{width:var(--kritzel-split-button-divider-width, 1px);height:24px;background-color:var(--kritzel-split-button-divider-background-color, hsl(0, 0%, 0%, 4.3%))}:disabled{pointer-events:none;opacity:0.5}";
8
8
 
9
9
  const KritzelSplitButton = /*@__PURE__*/ proxyCustomElement(class KritzelSplitButton extends H {
10
10
  constructor(registerHost) {
@@ -101,7 +101,7 @@ const KritzelSplitButton = /*@__PURE__*/ proxyCustomElement(class KritzelSplitBu
101
101
  this.menuScrollTop = event.target.scrollTop;
102
102
  };
103
103
  render() {
104
- return (h(Host, { key: '4ff7809dd62c1dd60600fda592aeac43cd9bc74c', class: { mobile: this.isTouchDevice } }, h("button", { key: 'db6485fabcffdd75a25d178aca7b653af499a90c', class: "split-main-button", tabIndex: 0, onClick: this.handleButtonClick, disabled: this.mainButtonDisabled }, this.buttonIcon && h("kritzel-icon", { key: '4001a4e23ef53bec2a578310de8c8b593d7b266c', name: this.buttonIcon })), h("div", { key: '8ff86d3c01a48b06afca77dd066518efa3589cb1', class: "split-divider" }), h("button", { key: 'f1c40edbec3756a7f3681de4e8d0f1981dd312a4', ref: el => (this.splitMenuButtonRef = el), class: "split-menu-button", tabIndex: 0, onClick: this.toggleMenu, disabled: this.menuButtonDisabled }, h("kritzel-icon", { key: '0ddb89976632ae7454e66504f8bab3fd5072c252', name: this.dropdownIcon })), h("kritzel-portal", { key: '64531ffd6ac847fd1a99e32aceefea9f18088992', anchor: this.anchorElement, offsetY: 4, onClose: this.closeMenu }, h("kritzel-menu", { key: 'f3b86cb71e5ba39e8f98e26b3669416e2cdb4802', ref: el => (this.menuRef = el), items: this.items, onItemSelect: this.handleItemSelect, onItemSave: this.handleItemSave, onItemCancel: this.handleItemCancel, onItemToggleChildMenu: this.handleItemToggleChildMenu, onItemCloseChildMenu: this.handleItemCloseChildMenu, onClose: this.closeMenu, onScroll: this.handleScroll }))));
104
+ return (h(Host, { key: '3603874994e8a9d666448460d7e403252d38f799', class: { mobile: this.isTouchDevice } }, h("button", { key: 'a6a2f8cd22118f7be668f3fd1fc52e38c44b22b3', class: "split-main-button", tabIndex: 0, onClick: this.handleButtonClick, disabled: this.mainButtonDisabled }, this.buttonIcon && h("kritzel-icon", { key: 'e61abf53a2890b6587746eb2aef5a813e81ff1b9', name: this.buttonIcon })), h("div", { key: '17f78d85b2fbd0fe6e7925e10c2531c51bcfdf41', class: "split-divider" }), h("button", { key: 'ac507c76479d66e3483ee898e144a6bea4e8cf6a', ref: el => (this.splitMenuButtonRef = el), class: "split-menu-button", tabIndex: 0, onClick: this.toggleMenu, disabled: this.menuButtonDisabled }, h("kritzel-icon", { key: '8274be53e327d537c2987bc9a3761bc768bdd41f', name: this.dropdownIcon })), h("kritzel-portal", { key: '71136ef798f3c77cff30426a0fcd4ff91bf312b8', anchor: this.anchorElement, offsetY: 4, onClose: this.closeMenu }, h("kritzel-menu", { key: 'd1363d2029d7b4aafbd6cba9a4ca6cdf617064e9', ref: el => (this.menuRef = el), items: this.items, onItemSelect: this.handleItemSelect, onItemSave: this.handleItemSave, onItemCancel: this.handleItemCancel, onItemToggleChildMenu: this.handleItemToggleChildMenu, onItemCloseChildMenu: this.handleItemCloseChildMenu, onClose: this.closeMenu, onScroll: this.handleScroll }))));
105
105
  }
106
106
  static get style() { return kritzelSplitButtonCss; }
107
107
  }, [769, "kritzel-split-button", {
@@ -152,6 +152,6 @@ function defineCustomElement() {
152
152
  }
153
153
 
154
154
  export { KritzelSplitButton as K, defineCustomElement as d };
155
- //# sourceMappingURL=p-TdCTkEu0.js.map
155
+ //# sourceMappingURL=p-BdZKPKnx.js.map
156
156
 
157
- //# sourceMappingURL=p-TdCTkEu0.js.map
157
+ //# sourceMappingURL=p-BdZKPKnx.js.map
@@ -0,0 +1 @@
1
+ {"file":"p-BdZKPKnx.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-split-button/kritzel-split-button.css?tag=kritzel-split-button&encapsulation=shadow","src/components/shared/kritzel-split-button/kritzel-split-button.tsx"],"sourcesContent":[":host {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n font-family: sans-serif;\r\n z-index: 1;\r\n padding: var(--kritzel-split-button-padding, 4px);\r\n background-color: var(--kritzel-split-button-background-color, #ffffff);\r\n border-radius: var(--kritzel-split-button-border-radius, 12px);\r\n box-shadow: var(--kritzel-split-button-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));\r\n border: var(--kritzel-split-button-border, 1px solid #ebebeb);\r\n gap: var(--kritzel-split-button-gap, 4px);\r\n}\r\n\r\n:host(.mobile){\r\n --kritzel-split-button-hover-background-color: transparent;\r\n}\r\n\r\nbutton {\r\n border: none;\r\n background-color: transparent;\r\n padding: 0;\r\n margin: 0;\r\n font-family: inherit;\r\n font-size: inherit;\r\n color: inherit;\r\n -webkit-appearance: none;\r\n -moz-appearance: none;\r\n appearance: none;\r\n cursor: var(--kritzel-pointer-cursor, pointer);\r\n text-align: center;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n pointer-events: all;\r\n -webkit-tap-highlight-color: transparent;\r\n}\r\n\r\n.split-main-button,\r\n.split-menu-button {\r\n height: auto;\r\n display: flex;\r\n align-items: center;\r\n padding: var(--kritzel-split-button-padding, 8px);\r\n background-color: var(--kritzel-split-button-background-color, #ffffff);\r\n border-radius: var(--kritzel-split-button-border-radius, 12px);\r\n font-size: var(--kritzel-split-button-font-size, 14px);\r\n}\r\n\r\n.split-main-button:hover,\r\n.split-menu-button:hover {\r\n background-color: var(--kritzel-split-button-hover-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n.split-main-button:focus,\r\n.split-menu-button:focus {\r\n background-color: var(--kritzel-split-button-hover-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n.split-main-button {\r\n gap: var(--kritzel-split-button-gap, 4px);\r\n}\r\n\r\n.split-menu-button {\r\n border-left: none;\r\n justify-content: center;\r\n}\r\n\r\n.split-divider {\r\n width: var(--kritzel-split-button-divider-width, 1px);\r\n height: 24px;\r\n background-color: var(--kritzel-split-button-divider-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n:disabled {\r\n pointer-events: none;\r\n opacity: 0.5;\r\n}\r\n","import { Component, h, Prop, State, Event, EventEmitter, Host, Element, Method } from '@stencil/core';\r\nimport { KritzelDevicesHelper } from '../../../helpers/devices.helper';\r\nimport { IKritzelMenuItem, IKritzelMenuItemSelectEvent, IKritzelMenuItemToggleChildMenuEvent } from '../../../interfaces/menu-item.interface';\r\n\r\n@Component({\r\n tag: 'kritzel-split-button',\r\n styleUrl: 'kritzel-split-button.css',\r\n shadow: true,\r\n})\r\nexport class KritzelSplitButton {\r\n @Element() host!: HTMLElement;\r\n\r\n @Prop() buttonIcon: string = 'plus';\r\n @Prop() dropdownIcon: string = 'chevron-down';\r\n @Prop() items: IKritzelMenuItem[] = [];\r\n @Prop() mainButtonDisabled = false;\r\n @Prop() menuButtonDisabled = false;\r\n\r\n @Event() mainButtonClick: EventEmitter<void>;\r\n @Event() itemSelect: EventEmitter<IKritzelMenuItemSelectEvent>;\r\n @Event() itemSave: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemCancel: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemToggleChildMenu: EventEmitter<IKritzelMenuItemToggleChildMenuEvent>;\r\n @Event() itemCloseChildMenu: EventEmitter<IKritzelMenuItem>;\r\n @Event() menuOpen: EventEmitter<void>;\r\n @Event() menuClose: EventEmitter<void>;\r\n\r\n @State() isMenuOpen = false;\r\n @State() isTouchDevice: boolean = KritzelDevicesHelper.isTouchDevice();\r\n @State() anchorElement: HTMLElement;\r\n @State() menuScrollTop: number = 0;\r\n\r\n splitMenuButtonRef: HTMLButtonElement;\r\n menuRef: HTMLKritzelMenuElement;\r\n\r\n @Method()\r\n async open() {\r\n if (this.isMenuOpen) return;\r\n this.isMenuOpen = true;\r\n this.anchorElement = this.host;\r\n this.menuOpen.emit();\r\n }\r\n\r\n @Method()\r\n async focusMenu() {\r\n if (this.menuRef) {\r\n await this.menuRef.setFocus();\r\n }\r\n }\r\n\r\n private handleButtonClick = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.mainButtonClick.emit();\r\n };\r\n\r\n private toggleMenu = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n if (this.isMenuOpen) {\r\n this.closeMenu();\r\n } else {\r\n this.openMenu(event);\r\n }\r\n };\r\n\r\n private openMenu = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.isMenuOpen = true;\r\n this.anchorElement = this.host;\r\n this.menuOpen.emit();\r\n\r\n requestAnimationFrame(() => {\r\n this.menuRef?.setScrollTop(this.menuScrollTop);\r\n });\r\n };\r\n\r\n private closeMenu = () => {\r\n this.isMenuOpen = false;\r\n this.anchorElement = null;\r\n this.splitMenuButtonRef?.blur();\r\n this.menuClose.emit();\r\n };\r\n\r\n private handleItemSelect = event => {\r\n this.itemSelect.emit(event.detail);\r\n };\r\n\r\n private handleItemSave = event => {\r\n this.itemSave.emit(event.detail);\r\n };\r\n\r\n private handleItemCancel = event => {\r\n this.itemCancel.emit(event.detail);\r\n };\r\n\r\n private handleItemToggleChildMenu = event => {\r\n this.itemToggleChildMenu.emit(event.detail);\r\n };\r\n\r\n private handleItemCloseChildMenu = event => {\r\n this.itemCloseChildMenu.emit(event.detail);\r\n };\r\n\r\n private handleScroll = event => {\r\n this.menuScrollTop = (event.target as HTMLElement).scrollTop;\r\n }\r\n\r\n render() {\r\n return (\r\n <Host class={{ mobile: this.isTouchDevice }}>\r\n <button class=\"split-main-button\" tabIndex={0} onClick={this.handleButtonClick} disabled={this.mainButtonDisabled}>\r\n {this.buttonIcon && <kritzel-icon name={this.buttonIcon}></kritzel-icon>}\r\n </button>\r\n\r\n <div class=\"split-divider\"></div>\r\n\r\n <button ref={el => (this.splitMenuButtonRef = el)} class=\"split-menu-button\" tabIndex={0} onClick={this.toggleMenu} disabled={this.menuButtonDisabled}>\r\n <kritzel-icon name={this.dropdownIcon}></kritzel-icon>\r\n </button>\r\n\r\n <kritzel-portal anchor={this.anchorElement} offsetY={4} onClose={this.closeMenu}>\r\n <kritzel-menu\r\n ref={el => (this.menuRef = el)}\r\n items={this.items}\r\n onItemSelect={this.handleItemSelect}\r\n onItemSave={this.handleItemSave}\r\n onItemCancel={this.handleItemCancel}\r\n onItemToggleChildMenu={this.handleItemToggleChildMenu}\r\n onItemCloseChildMenu={this.handleItemCloseChildMenu}\r\n onClose={this.closeMenu}\r\n onScroll={this.handleScroll}\r\n ></kritzel-menu>\r\n </kritzel-portal>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}