kritzel-stencil 0.4.20 → 0.4.22

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 (226) hide show
  1. package/LICENSE +21 -21
  2. package/LICENSE.md +49 -49
  3. package/dist/cjs/{index-Dn19mGl-.js → index-Xav9JFHg.js} +11 -47
  4. package/dist/cjs/index.cjs.js +51 -2
  5. package/dist/cjs/kritzel-active-users_47.cjs.entry.js +268 -139
  6. package/dist/cjs/kritzel-brush-style.cjs.entry.js +2 -2
  7. package/dist/cjs/loader.cjs.js +1 -1
  8. package/dist/cjs/{schema.constants-CY0WWJYd.js → schema.constants-CjN-B633.js} +20 -44
  9. package/dist/cjs/stencil.cjs.js +2 -2
  10. package/dist/collection/classes/providers/sync/hocuspocus-sync-provider.class.js +21 -0
  11. package/dist/collection/classes/providers/sync/websocket-sync-provider.class.js +29 -1
  12. package/dist/collection/classes/structures/app-state-map.structure.js +19 -6
  13. package/dist/collection/classes/structures/object-map.structure.js +66 -4
  14. package/dist/collection/collection-manifest.json +1 -1
  15. package/dist/collection/components/core/kritzel-awareness-cursors/kritzel-awareness-cursors.css +115 -115
  16. package/dist/collection/components/core/kritzel-awareness-cursors/kritzel-awareness-cursors.js +1 -1
  17. package/dist/collection/components/core/kritzel-cursor-trail/kritzel-cursor-trail.css +10 -10
  18. package/dist/collection/components/core/kritzel-cursor-trail/kritzel-cursor-trail.js +1 -1
  19. package/dist/collection/components/core/kritzel-editor/kritzel-editor.css +160 -160
  20. package/dist/collection/components/core/kritzel-editor/kritzel-editor.js +51 -18
  21. package/dist/collection/components/core/kritzel-engine/kritzel-engine.css +80 -80
  22. package/dist/collection/components/core/kritzel-engine/kritzel-engine.js +87 -38
  23. package/dist/collection/components/core/kritzel-watermark/kritzel-watermark.css +29 -29
  24. package/dist/collection/components/core/kritzel-watermark/kritzel-watermark.js +2 -2
  25. package/dist/collection/components/shared/kritzel-avatar/kritzel-avatar.css +58 -58
  26. package/dist/collection/components/shared/kritzel-avatar/kritzel-avatar.js +3 -3
  27. package/dist/collection/components/shared/kritzel-brush-style/kritzel-brush-style.css +42 -42
  28. package/dist/collection/components/shared/kritzel-brush-style/kritzel-brush-style.js +3 -3
  29. package/dist/collection/components/shared/kritzel-button/kritzel-button.css +73 -73
  30. package/dist/collection/components/shared/kritzel-button/kritzel-button.js +2 -2
  31. package/dist/collection/components/shared/kritzel-color/kritzel-color.css +24 -24
  32. package/dist/collection/components/shared/kritzel-color/kritzel-color.js +2 -2
  33. package/dist/collection/components/shared/kritzel-color-palette/kritzel-color-palette.css +46 -46
  34. package/dist/collection/components/shared/kritzel-color-palette/kritzel-color-palette.js +1 -1
  35. package/dist/collection/components/shared/kritzel-dialog/kritzel-dialog.css +209 -209
  36. package/dist/collection/components/shared/kritzel-dropdown/kritzel-dropdown.css +190 -190
  37. package/dist/collection/components/shared/kritzel-dropdown/kritzel-dropdown.js +2 -2
  38. package/dist/collection/components/shared/kritzel-font/kritzel-font.css +10 -10
  39. package/dist/collection/components/shared/kritzel-font/kritzel-font.js +1 -1
  40. package/dist/collection/components/shared/kritzel-font-family/kritzel-font-family.css +48 -48
  41. package/dist/collection/components/shared/kritzel-font-family/kritzel-font-family.js +2 -2
  42. package/dist/collection/components/shared/kritzel-font-size/kritzel-font-size.css +30 -30
  43. package/dist/collection/components/shared/kritzel-font-size/kritzel-font-size.js +1 -1
  44. package/dist/collection/components/shared/kritzel-icon/kritzel-icon.css +18 -18
  45. package/dist/collection/components/shared/kritzel-input/kritzel-input.css +69 -69
  46. package/dist/collection/components/shared/kritzel-input/kritzel-input.js +1 -1
  47. package/dist/collection/components/shared/kritzel-line-endings/kritzel-line-endings.css +60 -60
  48. package/dist/collection/components/shared/kritzel-line-endings/kritzel-line-endings.js +3 -3
  49. package/dist/collection/components/shared/kritzel-master-detail/kritzel-master-detail.css +190 -190
  50. package/dist/collection/components/shared/kritzel-master-detail/kritzel-master-detail.js +3 -3
  51. package/dist/collection/components/shared/kritzel-menu/kritzel-menu.css +34 -34
  52. package/dist/collection/components/shared/kritzel-menu/kritzel-menu.js +1 -1
  53. package/dist/collection/components/shared/kritzel-menu-item/kritzel-menu-item.css +166 -166
  54. package/dist/collection/components/shared/kritzel-menu-item/kritzel-menu-item.js +2 -2
  55. package/dist/collection/components/shared/kritzel-numeric-input/kritzel-numeric-input.css +102 -102
  56. package/dist/collection/components/shared/kritzel-numeric-input/kritzel-numeric-input.js +1 -1
  57. package/dist/collection/components/shared/kritzel-opacity-slider/kritzel-opacity-slider.css +85 -85
  58. package/dist/collection/components/shared/kritzel-opacity-slider/kritzel-opacity-slider.js +1 -1
  59. package/dist/collection/components/shared/kritzel-pill-tabs/kritzel-pill-tabs.css +68 -68
  60. package/dist/collection/components/shared/kritzel-pill-tabs/kritzel-pill-tabs.js +2 -2
  61. package/dist/collection/components/shared/kritzel-portal/kritzel-portal.js +1 -1
  62. package/dist/collection/components/shared/kritzel-shape-fill/kritzel-shape-fill.css +47 -47
  63. package/dist/collection/components/shared/kritzel-shape-fill/kritzel-shape-fill.js +4 -4
  64. package/dist/collection/components/shared/kritzel-slide-toggle/kritzel-slide-toggle.css +48 -48
  65. package/dist/collection/components/shared/kritzel-slide-toggle/kritzel-slide-toggle.js +1 -1
  66. package/dist/collection/components/shared/kritzel-split-button/kritzel-split-button.css +78 -78
  67. package/dist/collection/components/shared/kritzel-split-button/kritzel-split-button.js +1 -1
  68. package/dist/collection/components/shared/kritzel-stroke-size/kritzel-stroke-size.css +37 -37
  69. package/dist/collection/components/shared/kritzel-stroke-size/kritzel-stroke-size.js +1 -1
  70. package/dist/collection/components/shared/kritzel-sync-indicator/kritzel-sync-indicator.css +50 -50
  71. package/dist/collection/components/shared/kritzel-sync-indicator/kritzel-sync-indicator.js +1 -1
  72. package/dist/collection/components/shared/kritzel-tooltip/kritzel-tooltip.css +18 -18
  73. package/dist/collection/components/shared/kritzel-tooltip/kritzel-tooltip.js +2 -2
  74. package/dist/collection/components/ui/kritzel-active-users/kritzel-active-users.css +65 -65
  75. package/dist/collection/components/ui/kritzel-back-to-content/kritzel-back-to-content.css +42 -42
  76. package/dist/collection/components/ui/kritzel-back-to-content/kritzel-back-to-content.js +1 -1
  77. package/dist/collection/components/ui/kritzel-context-menu/kritzel-context-menu.css +112 -112
  78. package/dist/collection/components/ui/kritzel-controls/kritzel-controls.css +331 -331
  79. package/dist/collection/components/ui/kritzel-controls/kritzel-controls.js +6 -6
  80. package/dist/collection/components/ui/kritzel-current-user/kritzel-current-user.css +11 -11
  81. package/dist/collection/components/ui/kritzel-current-user/kritzel-current-user.js +1 -1
  82. package/dist/collection/components/ui/kritzel-current-user-dialog/kritzel-current-user-dialog.css +39 -39
  83. package/dist/collection/components/ui/kritzel-current-user-dialog/kritzel-current-user-dialog.js +1 -1
  84. package/dist/collection/components/ui/kritzel-export/kritzel-export.css +89 -89
  85. package/dist/collection/components/ui/kritzel-export/kritzel-export.js +1 -1
  86. package/dist/collection/components/ui/kritzel-loading-overlay/kritzel-loading-overlay.css +50 -50
  87. package/dist/collection/components/ui/kritzel-loading-overlay/kritzel-loading-overlay.js +1 -1
  88. package/dist/collection/components/ui/kritzel-login-dialog/kritzel-login-dialog.css +98 -98
  89. package/dist/collection/components/ui/kritzel-login-dialog/kritzel-login-dialog.js +1 -1
  90. package/dist/collection/components/ui/kritzel-more-menu/kritzel-more-menu.css +58 -58
  91. package/dist/collection/components/ui/kritzel-more-menu/kritzel-more-menu.js +2 -2
  92. package/dist/collection/components/ui/kritzel-notification-card/kritzel-notification-card.css +101 -101
  93. package/dist/collection/components/ui/kritzel-settings/kritzel-settings.css +137 -137
  94. package/dist/collection/components/ui/kritzel-settings/kritzel-settings.js +1 -1
  95. package/dist/collection/components/ui/kritzel-share-dialog/kritzel-share-dialog.css +150 -150
  96. package/dist/collection/components/ui/kritzel-share-dialog/kritzel-share-dialog.js +2 -2
  97. package/dist/collection/components/ui/kritzel-tool-config/kritzel-tool-config.css +38 -38
  98. package/dist/collection/components/ui/kritzel-utility-panel/kritzel-utility-panel.css +45 -45
  99. package/dist/collection/components/ui/kritzel-utility-panel/kritzel-utility-panel.js +1 -1
  100. package/dist/collection/components/ui/kritzel-workspace-manager/kritzel-workspace-manager.css +16 -16
  101. package/dist/collection/components/ui/kritzel-zoom-panel/kritzel-zoom-panel.css +72 -72
  102. package/dist/collection/components/ui/kritzel-zoom-panel/kritzel-zoom-panel.js +1 -1
  103. package/dist/collection/constants/version.js +1 -1
  104. package/dist/collection/helpers/cursor.helper.js +6 -6
  105. package/dist/collection/helpers/svg-export.helper.js +41 -41
  106. package/dist/components/index.js +53 -4
  107. package/dist/components/kritzel-active-users.js +1 -1
  108. package/dist/components/kritzel-avatar.js +1 -1
  109. package/dist/components/kritzel-awareness-cursors.js +1 -1
  110. package/dist/components/kritzel-back-to-content.js +1 -1
  111. package/dist/components/kritzel-brush-style.js +4 -4
  112. package/dist/components/kritzel-button.js +1 -1
  113. package/dist/components/kritzel-color-palette.js +1 -1
  114. package/dist/components/kritzel-color.js +1 -1
  115. package/dist/components/kritzel-context-menu.js +1 -1
  116. package/dist/components/kritzel-controls.js +1 -1
  117. package/dist/components/kritzel-current-user-dialog.js +1 -1
  118. package/dist/components/kritzel-current-user.js +1 -1
  119. package/dist/components/kritzel-cursor-trail.js +1 -1
  120. package/dist/components/kritzel-dialog.js +1 -1
  121. package/dist/components/kritzel-dropdown.js +1 -1
  122. package/dist/components/kritzel-editor.js +61 -56
  123. package/dist/components/kritzel-engine.js +1 -1
  124. package/dist/components/kritzel-export.js +1 -1
  125. package/dist/components/kritzel-font-family.js +1 -1
  126. package/dist/components/kritzel-font-size.js +1 -1
  127. package/dist/components/kritzel-font.js +1 -1
  128. package/dist/components/kritzel-icon.js +1 -1
  129. package/dist/components/kritzel-input.js +1 -1
  130. package/dist/components/kritzel-line-endings.js +1 -1
  131. package/dist/components/kritzel-loading-overlay.js +1 -1
  132. package/dist/components/kritzel-login-dialog.js +1 -1
  133. package/dist/components/kritzel-master-detail.js +1 -1
  134. package/dist/components/kritzel-menu-item.js +1 -1
  135. package/dist/components/kritzel-menu.js +1 -1
  136. package/dist/components/kritzel-more-menu.js +1 -1
  137. package/dist/components/kritzel-notification-card.js +1 -1
  138. package/dist/components/kritzel-numeric-input.js +1 -1
  139. package/dist/components/kritzel-opacity-slider.js +1 -1
  140. package/dist/components/kritzel-pill-tabs.js +1 -1
  141. package/dist/components/kritzel-portal.js +1 -1
  142. package/dist/components/kritzel-settings.js +1 -1
  143. package/dist/components/kritzel-shape-fill.js +1 -1
  144. package/dist/components/kritzel-share-dialog.js +1 -1
  145. package/dist/components/kritzel-slide-toggle.js +1 -1
  146. package/dist/components/kritzel-split-button.js +1 -1
  147. package/dist/components/kritzel-stroke-size.js +1 -1
  148. package/dist/components/kritzel-sync-indicator.js +1 -1
  149. package/dist/components/kritzel-tool-config.js +1 -1
  150. package/dist/components/kritzel-tooltip.js +1 -1
  151. package/dist/components/kritzel-utility-panel.js +1 -1
  152. package/dist/components/kritzel-watermark.js +1 -1
  153. package/dist/components/kritzel-workspace-manager.js +1 -1
  154. package/dist/components/kritzel-zoom-panel.js +1 -1
  155. package/dist/components/{p-CLAz6RJc.js → p-2WiGyky4.js} +3 -3
  156. package/dist/components/{p-zG-WUBGF.js → p-4SPnZZkH.js} +4 -4
  157. package/dist/components/{p-MhQxGUvY.js → p-B-585egz.js} +3 -3
  158. package/dist/components/{p-C9_yBEoX.js → p-B43upypT.js} +10 -30
  159. package/dist/components/{p-CSKToqUl.js → p-B5SWPDuq.js} +4 -4
  160. package/dist/components/{p-Covorf4C.js → p-BFYtCsZu.js} +3 -3
  161. package/dist/components/{p-Csxx9TbU.js → p-BNeE3SiZ.js} +216 -116
  162. package/dist/components/{p-DYPA7jpg.js → p-BPsKYMH6.js} +2 -2
  163. package/dist/components/{p-Cx-L_28S.js → p-BoN700-O.js} +3 -3
  164. package/dist/components/{p-ME1sDz3f.js → p-BozrueXV.js} +2 -2
  165. package/dist/components/{p-D2VcPEtL.js → p-BrNsOp2v.js} +6 -6
  166. package/dist/components/{p-BXUx_C0N.js → p-BsLI_BWq.js} +2 -2
  167. package/dist/components/{p-dAXnRkjA.js → p-C98Eb3_R.js} +5 -5
  168. package/dist/components/{p-Bxi-Bm49.js → p-CAoN_STZ.js} +2 -2
  169. package/dist/components/{p-CSWCmyzb.js → p-CF8pLc07.js} +5 -5
  170. package/dist/components/{p-D3BzgkIE.js → p-CSPYkLLH.js} +2 -2
  171. package/dist/components/{p-Ck-87E2G.js → p-CSuU8frA.js} +1 -1
  172. package/dist/components/{p-Di--2boB.js → p-CXpv9Rxe.js} +3 -3
  173. package/dist/components/{p-o3NYKrVL.js → p-CaBbajU2.js} +3 -3
  174. package/dist/components/{p-3tBE7SyG.js → p-Cm33td2O.js} +2 -2
  175. package/dist/components/{p-vDCa_ZDm.js → p-CrHvaLRV.js} +3 -3
  176. package/dist/components/{p-DT_WBwsw.js → p-CwZ3KKFq.js} +6 -6
  177. package/dist/components/{p-BZZ3KRPk.js → p-CzW58DHM.js} +3 -3
  178. package/dist/components/{p-BrqSjRJN.js → p-Czhdc844.js} +3 -3
  179. package/dist/components/{p-BkXQL5Dl.js → p-D1rjfWgJ.js} +5 -5
  180. package/dist/components/{p-DPsbNStn.js → p-DB58Oa5V.js} +2 -2
  181. package/dist/components/{p-DafP9PAA.js → p-DBqoPgev.js} +2 -2
  182. package/dist/components/{p-BrA9NBEE.js → p-DDTMGbtA.js} +21 -21
  183. package/dist/components/{p-Dznwo6oc.js → p-DKGg-76-.js} +2 -2
  184. package/dist/components/{p-Dp1CD4gK.js → p-DVXTPI71.js} +2 -2
  185. package/dist/components/{p-QSyeAy8R.js → p-DX2nriaq.js} +2 -2
  186. package/dist/components/{p-CHoOe3FD.js → p-Df3BwVGy.js} +3 -3
  187. package/dist/components/{p-DcUIO14-.js → p-Dt7-I2Xz.js} +4 -4
  188. package/dist/components/{p-BShrnlam.js → p-DtnMdWWB.js} +2 -2
  189. package/dist/components/{p-Ch-KG9To.js → p-DwMqCX2P.js} +3 -3
  190. package/dist/components/{p-25ExYYPf.js → p-Dx5NfJ0U.js} +9 -9
  191. package/dist/components/{p-fSV6KVTC.js → p-GKmqCI8r.js} +3 -3
  192. package/dist/components/{p-CWAChRD5.js → p-HoO86l1o.js} +12 -12
  193. package/dist/components/{p-Qdo3E8dr.js → p-PjPPCHVL.js} +2 -2
  194. package/dist/components/{p-D6JycG-I.js → p-bAacqNHq.js} +3 -3
  195. package/dist/components/{p-DjXQxw9R.js → p-djJSnjAX.js} +3 -3
  196. package/dist/components/{p-b0J2ktAm.js → p-dsxHDlQ3.js} +7 -7
  197. package/dist/components/{p-BppcoKoo.js → p-eZXIu4yK.js} +5 -5
  198. package/dist/components/{p-BFYT03fw.js → p-fL9rl200.js} +3 -3
  199. package/dist/components/{p-1Q4VnThv.js → p-jIKskj3S.js} +3 -3
  200. package/dist/components/{p-D0Trc3IQ.js → p-vqEUQ-4Q.js} +5 -5
  201. package/dist/esm/{index-2va1Pk9z.js → index-Dhio9uis.js} +11 -47
  202. package/dist/esm/index.js +52 -3
  203. package/dist/esm/kritzel-active-users_47.entry.js +268 -139
  204. package/dist/esm/kritzel-brush-style.entry.js +2 -2
  205. package/dist/esm/loader.js +2 -2
  206. package/dist/esm/{schema.constants-DBvUmuDH.js → schema.constants-DfvqHmxc.js} +20 -44
  207. package/dist/esm/stencil.js +3 -3
  208. package/dist/stencil/index.esm.js +52 -3
  209. package/dist/stencil/{p-DBvUmuDH.js → p-DfvqHmxc.js} +20 -44
  210. package/dist/stencil/{p-2va1Pk9z.js → p-Dhio9uis.js} +11 -47
  211. package/dist/stencil/{p-d19d1b82.entry.js → p-ab5c4292.entry.js} +268 -139
  212. package/dist/stencil/{p-df06ca3a.entry.js → p-fb32cd8f.entry.js} +2 -2
  213. package/dist/stencil/stencil.esm.js +4 -4
  214. package/dist/types/classes/providers/sync/hocuspocus-sync-provider.class.d.ts +5 -0
  215. package/dist/types/classes/providers/sync/websocket-sync-provider.class.d.ts +6 -0
  216. package/dist/types/classes/structures/app-state-map.structure.d.ts +6 -0
  217. package/dist/types/classes/structures/object-map.structure.d.ts +26 -2
  218. package/dist/types/components/core/kritzel-editor/kritzel-editor.d.ts +3 -0
  219. package/dist/types/components/core/kritzel-engine/kritzel-engine.d.ts +14 -1
  220. package/dist/types/components.d.ts +8 -1
  221. package/dist/types/constants/version.d.ts +1 -1
  222. package/dist/types/interfaces/sync-provider.interface.d.ts +13 -0
  223. package/dist/types/stencil-public-runtime.d.ts +0 -12
  224. package/loader/index.d.ts +1 -1
  225. package/package.json +1 -1
  226. package/readme.md +10 -10
@@ -1,4 +1,4 @@
1
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
1
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
2
 
3
3
  const kritzelSlideToggleCss = () => `:host{display:inline-flex;align-items:center;cursor:var(--kritzel-global-pointer-cursor, pointer);outline:none;z-index:1;-webkit-tap-highlight-color:transparent}:host(:focus-visible) .toggle-track{box-shadow:0 0 0 2px var(--kritzel-global-focus-ring-color, rgba(0, 122, 255, 0.3))}:host(.disabled){opacity:0.5;pointer-events:none;cursor:default}.toggle-track{position:relative;width:var(--kritzel-slide-toggle-width, 40px);height:var(--kritzel-slide-toggle-height, 22px);background-color:var(--kritzel-slide-toggle-track-color, #ccc);border-radius:var(--kritzel-slide-toggle-border-radius, 11px);transition:background-color var(--kritzel-slide-toggle-transition-duration, 0.2s) ease}:host(.checked) .toggle-track{background-color:var(--kritzel-slide-toggle-track-checked-color, #007AFF)}.toggle-thumb{position:absolute;top:50%;left:2px;transform:translateY(-50%);width:var(--kritzel-slide-toggle-thumb-size, 18px);height:var(--kritzel-slide-toggle-thumb-size, 18px);background-color:var(--kritzel-slide-toggle-thumb-color, #fff);border-radius:50%;box-shadow:0 1px 3px rgba(0, 0, 0, 0.2);transition:left var(--kritzel-slide-toggle-transition-duration, 0.2s) ease}:host(.checked) .toggle-thumb{left:calc(var(--kritzel-slide-toggle-width, 40px) - var(--kritzel-slide-toggle-thumb-size, 18px) - 2px)}`;
4
4
 
@@ -32,7 +32,7 @@ const KritzelSlideToggle = /*@__PURE__*/ proxyCustomElement(class KritzelSlideTo
32
32
  }
33
33
  };
34
34
  render() {
35
- return (h(Host, { key: 'd92f521cf1c7c16db079416dd0943c7bc4f721e9', class: { checked: this.checked, disabled: this.disabled }, tabIndex: this.disabled ? -1 : 0, role: "switch", "aria-checked": this.checked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.label, onClick: this.handleToggle, onKeyDown: this.handleKeyDown }, h("div", { key: 'e6086cf26ff3065d1215c548f30318414f710798', class: "toggle-track" }, h("div", { key: '38e6c2edef2fde42ac75063858ad44b83e3f8f7b', class: "toggle-thumb" }))));
35
+ return (h(Host, { key: 'e310e7bc8c115feadaa2494a6a543719f1b25245', class: { checked: this.checked, disabled: this.disabled }, tabIndex: this.disabled ? -1 : 0, role: "switch", "aria-checked": this.checked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.label, onClick: this.handleToggle, onKeyDown: this.handleKeyDown }, h("div", { key: 'fef37a1b373bf438cbacbf6537640269c2ab6b59', class: "toggle-track" }, h("div", { key: '4e140f83a8802e04c0b42e76f5e5719efd5a1cbc', class: "toggle-thumb" }))));
36
36
  }
37
37
  static get style() { return kritzelSlideToggleCss(); }
38
38
  }, [513, "kritzel-slide-toggle", {
@@ -1,7 +1,7 @@
1
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
2
- import { d as defineCustomElement$3 } from './p-Ck-87E2G.js';
1
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
+ import { d as defineCustomElement$3 } from './p-CSuU8frA.js';
3
3
  import { K as KritzelDevicesHelper } from './p-jGOpkGDl.js';
4
- import { d as defineCustomElement$2 } from './p-DYPA7jpg.js';
4
+ import { d as defineCustomElement$2 } from './p-BPsKYMH6.js';
5
5
 
6
6
  const kritzelMenuItemCss = () => `:host{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--kritzel-menu-item-padding, 8px);box-sizing:border-box;gap:16px;height:var(--kritzel-menu-item-height, 40px);min-height:var(--kritzel-menu-item-min-height, 40px);font-family:sans-serif;font-size:var(--kritzel-menu-item-font-size, 14px);color:var(--kritzel-menu-item-color, #333333);border-radius:var(--kritzel-menu-item-border-radius, 12px);-webkit-tap-highlight-color:transparent}:host:focus:not(:focus-visible){outline:none}:host(:hover) .menu-item-overlay,:host(:focus-within) .menu-item-overlay{background-color:var(--kritzel-menu-item-overlay-background-color, hsl(0, 0%, 0%, 4.3%))}:host(.selected){background-color:var(--kritzel-menu-item-selected-background-color, #007aff);color:var(--kritzel-menu-item-selected-color, #ffffff)}:host(.selected) .action-button{color:var(--kritzel-menu-item-selected-color, #ffffff)}:host(.selected.editing){background-color:var(--kritzel-menu-item-selected-background-color, #007aff)}:host(.selected) .edit-input{color:var(--kritzel-menu-item-selected-color, #ffffff);caret-color:var(--kritzel-menu-item-input-caret-color-on-selected, #ffffff);border-color:var(--kritzel-menu-item-input-border-color-on-selected, #ffffff)}:host(.selected) .action-button kritzel-icon{--kritzel-icon-color:var(--kritzel-menu-item-selected-color, #ffffff)}kritzel-icon{--kritzel-icon-color:var(--kritzel-menu-item-color, #333333)}:host(.selected) kritzel-icon{--kritzel-icon-color:var(--kritzel-menu-item-selected-color, #ffffff)}:host(.selected) .edit-input::selection{background-color:var(--kritzel-menu-item-input-selection-color-on-selected, rgba(255, 255, 255, 0.3));color:var(--kritzel-menu-item-input-selection-text-color-on-selected, #ffffff)}:host(.editing){background-color:var(--kritzel-menu-item-editing-background-color, hsl(0, 0%, 0%, 4.3%))}:host(.disabled){opacity:0.5;pointer-events:none !important}:host(.child-open){background-color:var(--kritzel-menu-item-child-open-background-color, hsl(0, 0%, 0%, 4.3%))}:host(.child-open.selected){background-color:var(--kritzel-menu-item-selected-background-color, #007aff)}.menu-item-overlay{position:absolute;inset:0;background-color:transparent;z-index:0;pointer-events:none;border-radius:var(--kritzel-menu-item-border-radius, 12px)}.menu-item-content{display:flex;align-items:center;gap:8px;position:relative;z-index:1;height:100%}.menu-item-content span{display:flex;align-items:center;line-height:0}.left{justify-content:flex-start;flex:1;min-width:0}.left>div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.right{justify-content:flex-end}.edit-input{flex:1;height:var(--kritzel-menu-item-input-height, 24px);padding:0;background-color:transparent;border-radius:0;border:none;border-bottom:var(--kritzel-menu-item-input-border, 1px solid #ccc);font-size:var(--kritzel-menu-item-font-size, 14px);width:100%;min-width:0;box-sizing:border-box;outline:none;color:inherit}.edit-input{caret-color:var(--kritzel-menu-item-input-caret-color, currentColor)}.edit-input::selection{background-color:var(--kritzel-menu-item-input-selection-color, #007bff);color:var(--kritzel-menu-item-input-selection-text-color, #ffffff)}.action-button{padding:4px;border-radius:8px;border:none;cursor:var(--kritzel-global-pointer-cursor, pointer);display:flex;align-items:center;justify-content:center;background-color:transparent;background:transparent;-webkit-tap-highlight-color:transparent}.action-button:hover,.action-button:focus{background-color:var(--kritzel-menu-item-button-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.action-button.disabled{pointer-events:none;opacity:0.5}`;
7
7
 
@@ -107,12 +107,12 @@ const KritzelMenuItem = /*@__PURE__*/ proxyCustomElement(class KritzelMenuItem e
107
107
  ];
108
108
  }
109
109
  render() {
110
- return (h(Host, { key: '9fd327cadf3c28f51a28d174a1c888c3891cbcbd', tabIndex: this.item.isDisabled ? -1 : 0, class: {
110
+ return (h(Host, { key: '9b35e5631cfa14aca391636f06598ef6f2f26550', tabIndex: this.item.isDisabled ? -1 : 0, class: {
111
111
  'selected': this.item.isSelected,
112
112
  'editing': this.item.isEditing,
113
113
  'disabled': this.item.isDisabled,
114
114
  'child-open': this.item.isChildMenuOpen,
115
- }, onClick: this.handleItemSelect }, h("div", { key: '080c4fb6e04d6c88d7fa1410a5b86caa4952ed07', class: "menu-item-overlay" }), this.item.isEditing ? this.renderEditMode() : this.renderViewMode()));
115
+ }, onClick: this.handleItemSelect }, h("div", { key: '175258699f76fdad5dcf3c7481e7882c6765bf33', class: "menu-item-overlay" }), this.item.isEditing ? this.renderEditMode() : this.renderViewMode()));
116
116
  }
117
117
  static get watchers() { return {
118
118
  "item": [{
@@ -230,7 +230,7 @@ const KritzelMenu = /*@__PURE__*/ proxyCustomElement(class KritzelMenu extends H
230
230
  this.itemCloseChildMenu.emit(event.detail);
231
231
  };
232
232
  render() {
233
- return (h(Host, { key: '9ab5256e8888aa48ab6018ffc1109f9614075772', tabIndex: 0, onClick: e => e.stopPropagation() }, this.openChildMenuItem && h("div", { key: '05415b8e7559af7bee51a2dcc62e8ed016fbfc42', class: "has-open-child-overlay", onClick: this.onOverlayClick }), this.items.map(item => (h("kritzel-menu-item", { key: item.id, "data-testid": `menu-item-${item.id}`, item: item, parent: this.parent, style: { pointerEvents: this.editingMenuItem && !item.isEditing ? 'none' : 'auto' }, onItemSelect: this.handleItemSelect, onItemSave: this.handleSave, onItemCancel: this.handleCancel, onItemToggleChildMenu: this.handleToggleChildMenu, onItemCloseChildMenu: this.handleCloseChildMenu })))));
233
+ return (h(Host, { key: '804ed34eb5340ecc1611ada01f608f7a0cf2f619', tabIndex: 0, onClick: e => e.stopPropagation() }, this.openChildMenuItem && h("div", { key: '6de5954a05b7f28961fa33cf8d34df3a81aae5f8', class: "has-open-child-overlay", onClick: this.onOverlayClick }), this.items.map(item => (h("kritzel-menu-item", { key: item.id, "data-testid": `menu-item-${item.id}`, item: item, parent: this.parent, style: { pointerEvents: this.editingMenuItem && !item.isEditing ? 'none' : 'auto' }, onItemSelect: this.handleItemSelect, onItemSave: this.handleSave, onItemCancel: this.handleCancel, onItemToggleChildMenu: this.handleToggleChildMenu, onItemCloseChildMenu: this.handleCloseChildMenu })))));
234
234
  }
235
235
  static get style() { return kritzelMenuCss(); }
236
236
  }, [513, "kritzel-menu", {
@@ -1,5 +1,5 @@
1
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
2
- import { d as defineCustomElement$1 } from './p-Ck-87E2G.js';
1
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
+ import { d as defineCustomElement$1 } from './p-CSuU8frA.js';
3
3
 
4
4
  const kritzelNotificationCardCss = () => `:host{display:block}.card{box-sizing:border-box;width:100%;max-width:var(--kritzel-notification-card-max-width, 360px);margin-inline:auto;font-family:var(--kritzel-font-family, sans-serif);padding:var(--kritzel-notification-card-padding, 12px 14px);border:var(--kritzel-notification-card-border, 1px solid #e5e7eb);border-radius:var(--kritzel-notification-card-border-radius, 12px);background-color:var(--kritzel-notification-card-background-color, #ffffff);color:var(--kritzel-notification-card-color, #111827);box-shadow:var(--kritzel-notification-card-box-shadow, 0 8px 20px rgba(15, 23, 42, 0.08))}.card-header{display:flex;align-items:center;justify-content:space-between;gap:var(--kritzel-notification-card-header-gap, 8px);margin-bottom:var(--kritzel-notification-card-header-margin-bottom, 8px)}.header-right{display:inline-flex;align-items:center;gap:var(--kritzel-notification-card-header-right-gap, 6px)}.type-pill{display:inline-flex;align-items:center;justify-content:center;min-height:var(--kritzel-notification-card-pill-height, 22px);padding:var(--kritzel-notification-card-pill-padding, 0 8px);border-radius:var(--kritzel-notification-card-pill-border-radius, 999px);background-color:var(--kritzel-notification-card-pill-background-color, #eff6ff);color:var(--kritzel-notification-card-pill-color, #1d4ed8);font-size:var(--kritzel-notification-card-pill-font-size, 12px);font-weight:var(--kritzel-notification-card-pill-font-weight, 600);line-height:1}.card.type-info .type-pill{background-color:var(--kritzel-notification-card-info-pill-background-color, #eff6ff);color:var(--kritzel-notification-card-info-pill-color, #1d4ed8)}.card.type-warning .type-pill{background-color:var(--kritzel-notification-card-warning-pill-background-color, #fff7ed);color:var(--kritzel-notification-card-warning-pill-color, #b45309)}.card.type-error .type-pill{background-color:var(--kritzel-notification-card-error-pill-background-color, #fef2f2);color:var(--kritzel-notification-card-error-pill-color, #b91c1c)}.timestamp{color:var(--kritzel-notification-card-timestamp-color, #6b7280);font-size:var(--kritzel-notification-card-timestamp-font-size, 12px);white-space:nowrap}.dismiss-button{display:inline-flex;align-items:center;justify-content:center;width:var(--kritzel-notification-card-dismiss-button-size, 24px);height:var(--kritzel-notification-card-dismiss-button-size, 24px);padding:0;border:none;border-radius:var(--kritzel-notification-card-dismiss-button-border-radius, 6px);background:var(--kritzel-notification-card-dismiss-button-background-color, transparent);color:var(--kritzel-notification-card-dismiss-button-color, #4b5563);cursor:var(--kritzel-global-pointer-cursor, pointer);-webkit-tap-highlight-color:transparent}.dismiss-button:hover{background:var(--kritzel-notification-card-dismiss-button-hover-background-color, #f3f4f6)}.dismiss-button:active{background:var(--kritzel-notification-card-dismiss-button-active-background-color, #e5e7eb)}.dismiss-button:focus-visible{outline:revert}.message{margin:0;color:var(--kritzel-notification-card-message-color, inherit);font-size:var(--kritzel-notification-card-message-font-size, 14px);line-height:var(--kritzel-notification-card-message-line-height, 1.45);word-break:break-word}`;
5
5
 
@@ -1,8 +1,8 @@
1
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
1
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
2
  import { K as KritzelDevicesHelper } from './p-jGOpkGDl.js';
3
- import { d as defineCustomElement$4 } from './p-Ck-87E2G.js';
4
- import { d as defineCustomElement$2, a as defineCustomElement$3 } from './p-D2VcPEtL.js';
5
- import { d as defineCustomElement$1 } from './p-DYPA7jpg.js';
3
+ import { d as defineCustomElement$4 } from './p-CSuU8frA.js';
4
+ import { d as defineCustomElement$2, a as defineCustomElement$3 } from './p-BrNsOp2v.js';
5
+ import { d as defineCustomElement$1 } from './p-BPsKYMH6.js';
6
6
 
7
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:var(--kritzel-split-button-color, #000000);-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:var(--kritzel-global-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
 
@@ -103,7 +103,7 @@ const KritzelSplitButton = /*@__PURE__*/ proxyCustomElement(class KritzelSplitBu
103
103
  this.menuScrollTop = event.target.scrollTop;
104
104
  };
105
105
  render() {
106
- return (h(Host, { key: 'd8dac18091d84994607f96dea4cb09f5823b8477', class: { mobile: this.isTouchDevice } }, h("button", { key: '7601c722ba60bf73e8009c32b40ff88e51680011', class: "split-main-button", tabIndex: 0, onClick: this.handleButtonClick, disabled: this.mainButtonDisabled, "aria-label": "Main action" }, this.buttonIcon && h("kritzel-icon", { key: '567ea117b77ee0e8a4e023bc80d5cbafd44e7e05', name: this.buttonIcon })), h("div", { key: '53ae4da47818cb474fe659700d59171a9fe1b150', class: "split-divider" }), h("button", { key: '3893a36b2e33c86aa013e4a28a4428ba6ad4bb55', ref: el => (this.splitMenuButtonRef = el), class: "split-menu-button", tabIndex: 0, onClick: this.toggleMenu, disabled: this.menuButtonDisabled, "aria-label": "Open menu" }, h("kritzel-icon", { key: '2dd391e711b37b41ccfe310fc705842fbde80110', name: this.dropdownIcon })), h("kritzel-portal", { key: '5e5d03337b0fd3e11547bb1678595dd1559e0b88', anchor: this.anchorElement, offsetY: 4, onClose: this.closeMenu }, h("kritzel-menu", { key: 'c50fe3d6591024513e0cb2ecce97f23a34499fe5', 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 }))));
106
+ return (h(Host, { key: 'f7f5019b32f4514a4ccf5bd07742658e3d05020a', class: { mobile: this.isTouchDevice } }, h("button", { key: '361007b4281edfe2bf18f28f7c4f19ba1f251b49', class: "split-main-button", tabIndex: 0, onClick: this.handleButtonClick, disabled: this.mainButtonDisabled, "aria-label": "Main action" }, this.buttonIcon && h("kritzel-icon", { key: '17d4fad6cfa070225daa67dfc648d4ac64091e90', name: this.buttonIcon })), h("div", { key: 'c18107b7d557525092c28ff5d7336ebb3648b672', class: "split-divider" }), h("button", { key: 'c7a9a67d832f026fa8e21eff7ea5935cd72862ed', ref: el => (this.splitMenuButtonRef = el), class: "split-menu-button", tabIndex: 0, onClick: this.toggleMenu, disabled: this.menuButtonDisabled, "aria-label": "Open menu" }, h("kritzel-icon", { key: '5b40284c8f04fba80ca606b0af201040efe53880', name: this.dropdownIcon })), h("kritzel-portal", { key: '62bd7f26c020497f2131759d0d1ef9d18e817b37', anchor: this.anchorElement, offsetY: 4, onClose: this.closeMenu }, h("kritzel-menu", { key: 'a1a11a0ae33f9626db3cd56fbb881c613f1ab78c', 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 }))));
107
107
  }
108
108
  static get style() { return kritzelSplitButtonCss(); }
109
109
  }, [513, "kritzel-split-button", {
@@ -1,4 +1,4 @@
1
- import { p as proxyCustomElement, H, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
1
+ import { p as proxyCustomElement, H, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
2
 
3
3
  const kritzelSyncIndicatorCss = () => `:host{display:contents}.indicator{position:absolute;top:12px;left:50%;transform:translateX(-50%);z-index:var(--kritzel-editor-sync-indicator-z-index, 10001);pointer-events:none;display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;background:var(--kritzel-editor-sync-indicator-background, rgba(255, 255, 255, 0.92));color:var(--kritzel-editor-sync-indicator-color, #334155);box-shadow:0 2px 10px rgba(0, 0, 0, 0.12);font-family:var(--kritzel-font-family, sans-serif);font-size:12px;line-height:1;font-weight:500;opacity:0;visibility:hidden}.indicator.visible{opacity:1;visibility:visible}.spinner{width:12px;height:12px;border-radius:50%;border:2px solid var(--kritzel-editor-sync-indicator-spinner-track, rgba(148, 163, 184, 0.35));border-top-color:var(--kritzel-editor-sync-indicator-spinner-color, #2563eb);animation:kritzel-sync-indicator-spin 0.8s linear infinite}@keyframes kritzel-sync-indicator-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}`;
4
4
 
@@ -15,7 +15,7 @@ const KritzelSyncIndicator = /*@__PURE__*/ proxyCustomElement(class KritzelSyncI
15
15
  /** The text displayed next to the spinner. */
16
16
  text = 'Syncing...';
17
17
  render() {
18
- return (h(Host, { key: '2622544751cd377f172115f5f73e21e0f0995185' }, h("div", { key: '0cf49cbfbfa4ed0625eeff443ba1e2996a26562e', class: { indicator: true, visible: this.visible }, role: "status", "aria-live": "polite", "aria-label": "Synchronizing workspace" }, h("span", { key: '053ddc85e9ad2210822d3100ecf5d54d7170d470', class: "spinner", "aria-hidden": "true" }), h("span", { key: '94ea7f6be206688e9065d02b1d5c753e3598e9df' }, this.text))));
18
+ return (h(Host, { key: '05e825ee1c08fe02008b8e1adfe9e09a7996f221' }, h("div", { key: 'ea1635896f643c16713d35d6efd3abf486b1fbe2', class: { indicator: true, visible: this.visible }, role: "status", "aria-live": "polite", "aria-label": "Synchronizing workspace" }, h("span", { key: '7b57ea67d6f2c40dc74e966c16ebe9d95c75394a', class: "spinner", "aria-hidden": "true" }), h("span", { key: 'fc16405b02d96213d0025239b6e863883192ada5' }, this.text))));
19
19
  }
20
20
  static get style() { return kritzelSyncIndicatorCss(); }
21
21
  }, [513, "kritzel-sync-indicator", {
@@ -1,5 +1,5 @@
1
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
2
- import { d as defineCustomElement$1 } from './p-Ck-87E2G.js';
1
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
+ import { d as defineCustomElement$1 } from './p-CSuU8frA.js';
3
3
 
4
4
  const kritzelMasterDetailCss = () => `:host{display:block;width:100%;height:100%}.master-detail-container{display:flex;width:100%;height:100%;min-height:var(--kritzel-master-detail-min-height, 300px);gap:var(--kritzel-master-detail-gap, 0);background-color:var(--kritzel-master-detail-background-color, transparent)}.master-menu{display:flex;flex-direction:column;width:var(--kritzel-master-detail-menu-width, 200px);min-width:var(--kritzel-master-detail-menu-min-width, 160px);padding:var(--kritzel-master-detail-menu-padding, 8px);background-color:var(--kritzel-master-detail-menu-background-color, #ffffff);border-right:var(--kritzel-master-detail-menu-border-right, 1px solid #ebebeb);gap:var(--kritzel-master-detail-menu-gap, 4px);overflow-y:auto}.menu-item{display:flex;align-items:center;gap:var(--kritzel-master-detail-menu-item-gap, 10px);padding:var(--kritzel-master-detail-menu-item-padding, 10px 12px);border:none;border-radius:var(--kritzel-master-detail-menu-item-border-radius, 6px);background-color:var(--kritzel-master-detail-menu-item-background-color, transparent);color:var(--kritzel-master-detail-menu-item-color, #333333);font-family:inherit;font-size:var(--kritzel-master-detail-menu-item-font-size, 14px);font-weight:var(--kritzel-master-detail-menu-item-font-weight, 400);text-align:left;cursor:var(--kritzel-global-pointer-cursor, pointer);transition:background-color 150ms ease, color 150ms ease;-webkit-tap-highlight-color:transparent}.menu-item:hover:not(.is-disabled){background-color:var(--kritzel-master-detail-menu-item-hover-background-color, #ebebeb)}.menu-item:active:not(.is-disabled){background-color:var(--kritzel-master-detail-menu-item-active-background-color, #e0e0e0)}.menu-item.is-selected{background-color:var(--kritzel-master-detail-menu-item-selected-background-color, #0066cc);color:var(--kritzel-master-detail-menu-item-selected-color, #ffffff);font-weight:var(--kritzel-master-detail-menu-item-selected-font-weight, 500)}.menu-item.is-selected:hover{background-color:var(--kritzel-master-detail-menu-item-selected-hover-background-color, #0052a3)}.menu-item.is-disabled{color:var(--kritzel-master-detail-menu-item-disabled-color, #999999);cursor:not-allowed;opacity:0.6}.menu-item:focus-visible{outline:var(--kritzel-master-detail-menu-item-focus-outline, revert);outline-offset:var(--kritzel-master-detail-menu-item-focus-outline-offset, revert)}.menu-item-icon{flex-shrink:0;display:flex;align-items:center;justify-content:center}.menu-item-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.detail-panel{flex:1;min-height:0;padding:var(--kritzel-master-detail-detail-padding, 16px);background-color:var(--kritzel-master-detail-detail-background-color, #ffffff);overflow-y:auto;-webkit-overflow-scrolling:touch;scrollbar-color:var(--kritzel-global-scrollbar-thumb-color, #ebebeb) transparent;scrollbar-width:thin}.detail-panel:focus{outline:none}.detail-panel:focus-visible{outline:var(--kritzel-master-detail-detail-focus-outline, revert);outline-offset:var(--kritzel-master-detail-detail-focus-outline-offset, revert)}.mobile-back-button{display:none;align-items:center;gap:8px;background:none;border:none;padding:0 0 16px 0;cursor:pointer;-webkit-tap-highlight-color:transparent;color:var(--kritzel-master-detail-back-button-color, #333333);font-weight:500;font-size:14px;font-family:inherit}.mobile-back-icon{display:flex;align-items:center;flex-shrink:0}.menu-item-chevron{display:none;flex-shrink:0;margin-left:auto;color:var(--kritzel-master-detail-menu-item-chevron-color, #999999)}.menu-item-chevron svg{width:16px;height:16px;stroke:currentColor}@media (max-width: 768px){.master-menu{width:100%;border-right:none}.detail-panel{display:none;width:100%}.master-detail-container.is-mobile-detail-visible .master-menu{display:none}.master-detail-container.is-mobile-detail-visible .detail-panel{display:block}.mobile-back-button{display:flex}.menu-item.is-selected{background-color:transparent;color:var(--kritzel-master-detail-menu-item-color, #333333);font-weight:var(--kritzel-master-detail-menu-item-font-weight, 400)}.menu-item.is-selected:hover{background-color:var(--kritzel-master-detail-menu-item-hover-background-color, #ebebeb)}.menu-item-chevron{display:flex;align-items:center}}`;
5
5
 
@@ -102,15 +102,15 @@ const KritzelMasterDetail = /*@__PURE__*/ proxyCustomElement(class KritzelMaster
102
102
  const selectedItem = this.items.find(item => item.id === this.selectedItemId);
103
103
  const panelId = 'master-detail-panel';
104
104
  const selectedTabId = selectedItem ? `tab-${selectedItem.id}` : undefined;
105
- return (h(Host, { key: 'f54d66ffc0330fa9dc4294f6a21810e3dd5db495' }, h("div", { key: '8f786b099dd5d4b0efcc45cbfb38f37916f60126', class: {
105
+ return (h(Host, { key: '0166376f16ebb098049cd2ef5539a86086a5570e' }, h("div", { key: 'f5091fe672bc4751c8f66d43baa5c1fc86fca034', class: {
106
106
  'master-detail-container': true,
107
107
  'is-mobile-detail-visible': this.showMobileDetail,
108
- } }, h("nav", { key: '1a5db5ba8ba393ff7f29b9d438c59acbb6fbd849', class: "master-menu", role: "tablist", "aria-orientation": "vertical", "aria-label": "Settings categories" }, this.items.map((item, index) => (h("button", { key: item.id, id: `tab-${item.id}`, ref: el => this.setTabRef(el, index), class: {
108
+ } }, h("nav", { key: '66f5c61ea0308ea9ae1339526e86dcf1ee51fc0a', class: "master-menu", role: "tablist", "aria-orientation": "vertical", "aria-label": "Settings categories" }, this.items.map((item, index) => (h("button", { key: item.id, id: `tab-${item.id}`, ref: el => this.setTabRef(el, index), class: {
109
109
  'menu-item': true,
110
110
  'is-selected': item.id === this.selectedItemId,
111
111
  'is-disabled': !!item.disabled,
112
112
  'is-focused': index === this.focusedIndex,
113
- }, role: "tab", "aria-selected": item.id === this.selectedItemId ? 'true' : 'false', "aria-controls": panelId, "aria-disabled": item.disabled ? 'true' : undefined, tabIndex: this.getTabIndex(item, index), disabled: item.disabled, onClick: () => this.handleItemClick(item), onKeyDown: e => this.handleKeyDown(e, item, index), onFocus: () => this.handleFocus(index), onBlur: this.handleBlur }, item.icon && (h("kritzel-icon", { name: item.icon, size: 20, class: "menu-item-icon" })), h("span", { class: "menu-item-label" }, item.label), h("span", { class: "menu-item-chevron", "aria-hidden": "true" }, h("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { d: "m9 18 6-6-6-6" }))))))), h("div", { key: '22943ef64af7b63780fc4a25d0009443b5e1b0ba', id: panelId, class: "detail-panel", role: "tabpanel", "aria-labelledby": selectedTabId }, h("button", { key: '777b26506f739290be2d2267c1bc1381d59475fa', class: "mobile-back-button", onClick: this.handleBackClick, "aria-label": "Back to menu" }, h("kritzel-icon", { key: '96fe6b08965d7c5c41673bae0a5c5cc12f575a8f', name: "chevron-left", size: 20, class: "mobile-back-icon" }), "Back"), h("slot", { key: '985869d89bb10860e4a4bf221523376b7111ec1d' })))));
113
+ }, role: "tab", "aria-selected": item.id === this.selectedItemId ? 'true' : 'false', "aria-controls": panelId, "aria-disabled": item.disabled ? 'true' : undefined, tabIndex: this.getTabIndex(item, index), disabled: item.disabled, onClick: () => this.handleItemClick(item), onKeyDown: e => this.handleKeyDown(e, item, index), onFocus: () => this.handleFocus(index), onBlur: this.handleBlur }, item.icon && (h("kritzel-icon", { name: item.icon, size: 20, class: "menu-item-icon" })), h("span", { class: "menu-item-label" }, item.label), h("span", { class: "menu-item-chevron", "aria-hidden": "true" }, h("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { d: "m9 18 6-6-6-6" }))))))), h("div", { key: 'e8f762ad87fdcf401ec717538bf1e979b22a9f15', id: panelId, class: "detail-panel", role: "tabpanel", "aria-labelledby": selectedTabId }, h("button", { key: '958360d57a1fad0953bc3865503e86c1d8aa24e3', class: "mobile-back-button", onClick: this.handleBackClick, "aria-label": "Back to menu" }, h("kritzel-icon", { key: 'c65eb947f80aafec99b367dae7ea72b1a77acdac', name: "chevron-left", size: 20, class: "mobile-back-icon" }), "Back"), h("slot", { key: '44557fddf513fffd86c7a1b28b71a41fef7701f1' })))));
114
114
  }
115
115
  static get watchers() { return {
116
116
  "selectedItemId": [{
@@ -1,5 +1,5 @@
1
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
2
- import { d as defineCustomElement$1 } from './p-Ck-87E2G.js';
1
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
+ import { d as defineCustomElement$1 } from './p-CSuU8frA.js';
3
3
 
4
4
  const kritzelContextMenuCss = () => `:host{display:block}.menu-container{position:relative;z-index:1;display:flex;flex-direction:column;gap:var(--kritzel-context-menu-item-spacing, 2px);background-color:var(--kritzel-context-menu-background-color, #ffffff);border-radius:var(--kritzel-context-menu-border-radius, 12px);box-shadow:var(--kritzel-context-menu-box-shadow, 0 1px 6px rgba(0, 0, 0, 0.12));border:var(--kritzel-context-menu-border, 1px solid #ebebeb);padding:var(--kritzel-context-menu-padding, 4px);min-width:var(--kritzel-context-menu-min-width, 140px)}.menu-item-wrapper{position:relative}.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:var(--kritzel-global-pointer-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;width:100%;min-width:0}.menu-item:not(.disabled):hover,.menu-item.submenu-open{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)}.menu-item.has-children.disabled{cursor:var(--kritzel-global-pointer-cursor, pointer);color:var(--kritzel-context-menu-item-color, #333333)}.menu-item kritzel-icon{opacity:0.8;flex-shrink:0}.menu-item.disabled kritzel-icon{opacity:0.4}.menu-item.has-children.disabled kritzel-icon{opacity:0.8}.label{flex-grow:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.submenu-arrow{margin-left:auto;opacity:0.5}.menu-divider{height:1px;background-color:var(--kritzel-context-menu-divider-color, rgba(0, 0, 0, 0.1));margin:var(--kritzel-context-menu-divider-margin, 4px 8px)}.submenu-container{position:absolute;top:0;left:100%;z-index:2;margin-left:4px;display:flex;flex-direction:column;gap:var(--kritzel-context-menu-item-spacing, 2px);background-color:var(--kritzel-context-menu-background-color, #ffffff);border-radius:var(--kritzel-context-menu-border-radius, 12px);box-shadow:var(--kritzel-context-menu-box-shadow, 0 1px 6px rgba(0, 0, 0, 0.12));border:var(--kritzel-context-menu-border, 1px solid #ebebeb);padding:var(--kritzel-context-menu-padding, 4px);min-width:120px}.submenu-container.position-left{left:auto;right:100%;margin-left:0;margin-right:4px}`;
5
5
 
@@ -1,4 +1,4 @@
1
- import { p as proxyCustomElement, H, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
1
+ import { p as proxyCustomElement, H, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
2
 
3
3
  /**
4
4
  * A static registry for managing SVG icons throughout the Kritzel library.
@@ -1,4 +1,4 @@
1
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
1
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
2
 
3
3
  const kritzelLineEndingsCss = () => `:host{display:flex;flex-direction:column;gap:12px;padding:0;box-sizing:border-box}.endings-section{display:flex;flex-direction:column;gap:6px}.section-label{font-size:12px;font-weight:500;color:var(--kritzel-line-endings-label-color, #666666);padding-left:4px}.endings-row{display:flex;align-items:center;gap:4px}.ending-option{display:flex;justify-content:center;align-items:center;width:48px;height:32px;border-radius:6px;cursor:var(--kritzel-global-pointer-cursor, pointer);border:2px solid transparent;box-sizing:border-box;background:var(--kritzel-line-endings-option-background, #ffffff);padding:4px;transition:background-color 0.15s ease, border-color 0.15s ease}.ending-option:hover{background-color:var(--kritzel-line-endings-hover-background-color, #ebebeb)}.ending-option.selected{border-color:var(--kritzel-selection-border-color, #007AFF);background-color:var(--kritzel-line-endings-selected-background-color, #ebebeb)}.ending-option:focus{outline:none;box-shadow:0 0 0 2px var(--kritzel-global-focus-ring-color, rgba(0, 122, 255, 0.3))}.ending-icon{width:100%;height:100%}`;
4
4
 
@@ -76,10 +76,10 @@ const KritzelLineEndings = /*@__PURE__*/ proxyCustomElement(class KritzelLineEnd
76
76
  render() {
77
77
  const startEnding = this.getStartEnding();
78
78
  const endEnding = this.getEndEnding();
79
- return (h(Host, { key: '81e3262408d26a06acb2677698832b89651292a1' }, h("div", { key: '85c67f948075b2d58abfbd9d168a84c89554e81f', class: "endings-section" }, h("div", { key: 'd10a0b1c58fd06926a83cd78e213417aca28d01c', class: "endings-row" }, this.styles.map(type => (h("button", { class: {
79
+ return (h(Host, { key: '60115b8a2840ffe21e0846fdc2678c6ba24b22c0' }, h("div", { key: '3b63aa05ca78699172c645fdd404efdc55bc4536', class: "endings-section" }, h("div", { key: '9538369e8d2bb26600d6054ddbbc13d6c960bd56', class: "endings-row" }, this.styles.map(type => (h("button", { class: {
80
80
  'ending-option': true,
81
81
  'selected': startEnding === type,
82
- }, onClick: () => this.handleStartChange(type), title: type === 'none' ? 'No start arrow' : `${type} start arrow` }, this.renderEndingIcon(type, true)))))), h("div", { key: 'fd99875f3cefa8c4e36e106e836088fa61c75432', class: "endings-section" }, h("div", { key: 'dbcd0a32f278cc0d0317913827034f912a14d2b4', class: "endings-row" }, this.styles.map(type => (h("button", { class: {
82
+ }, onClick: () => this.handleStartChange(type), title: type === 'none' ? 'No start arrow' : `${type} start arrow` }, this.renderEndingIcon(type, true)))))), h("div", { key: 'ecec29740c09a61190938bab4955ccde6b84cfa2', class: "endings-section" }, h("div", { key: 'ea054597c3e3566e7921f2c04c07d74e4f4331a1', class: "endings-row" }, this.styles.map(type => (h("button", { class: {
83
83
  'ending-option': true,
84
84
  'selected': endEnding === type,
85
85
  }, onClick: () => this.handleEndChange(type), title: type === 'none' ? 'No end arrow' : `${type} end arrow` }, this.renderEndingIcon(type, false))))))));
@@ -1,4 +1,4 @@
1
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
1
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
2
  import { K as KritzelHTMLHelper } from './p-WUdQqYnu.js';
3
3
 
4
4
  const kritzelTooltipCss = () => `:host{width:auto}.tooltip-content{position:relative;padding:8px 12px;border-radius:4px;width:fit-content;background-color:var(--kritzel-tooltip-background-color, #ffffff);color:var(--kritzel-tooltip-color, #000000);padding:var(--kritzel-tooltip-padding, 12px);border:var(--kritzel-tooltip-border, 1px solid #ebebeb);border-radius:var(--kritzel-tooltip-border-radius, 16px);white-space:nowrap;box-shadow:var(--kritzel-tooltip-box-shadow, 0 1px 6px rgba(0, 0, 0, 0.12))}`;
@@ -140,14 +140,14 @@ const KritzelTooltip = /*@__PURE__*/ proxyCustomElement(class KritzelTooltip ext
140
140
  }
141
141
  }
142
142
  render() {
143
- return (h(Host, { key: '2fee8c1343888c34bbed7dd172b946ff732f6fc1', style: {
143
+ return (h(Host, { key: '93486d37c5dcaaf9a3d0d1c53d6308ddd5712560', style: {
144
144
  position: 'fixed',
145
145
  zIndex: '9999',
146
146
  transition: 'opacity 0.3s ease-in-out, transform 0.3s ease-in-out',
147
147
  visibility: this.isVisible ? 'visible' : 'hidden',
148
148
  left: `${this.positionX}px`,
149
149
  bottom: `${this.positionY}px`,
150
- } }, h("div", { key: 'fe72d28fb81f24309077f30193c84064afcd6ebe', class: "tooltip-content", onClick: event => event.stopPropagation(), onPointerDown: event => event.stopPropagation(), onMouseDown: event => event.stopPropagation() }, h("slot", { key: 'ee95da259971a58b048780b21a0018fd6731bb03' }))));
150
+ } }, h("div", { key: '4b5cf451f75d09459145b874eb3c7faffafa87e0', class: "tooltip-content", onClick: event => event.stopPropagation(), onPointerDown: event => event.stopPropagation(), onMouseDown: event => event.stopPropagation() }, h("slot", { key: '6c7fda100473a7d4fc533edc52d67bf6909bdc0e' }))));
151
151
  }
152
152
  static get watchers() { return {
153
153
  "triggerElement": [{
@@ -1,4 +1,4 @@
1
- import { p as proxyCustomElement, H, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
1
+ import { p as proxyCustomElement, H, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
2
 
3
3
  var KritzelMouseButton;
4
4
  (function (KritzelMouseButton) {
@@ -79,7 +79,7 @@ const KritzelCursorTrail = /*@__PURE__*/ proxyCustomElement(class KritzelCursorT
79
79
  }
80
80
  }
81
81
  render() {
82
- return (h(Host, { key: 'cf2cf1c689bdc8ea393a7ea8f32698cfcdb0e375' }, this.cursorTrailPoints.length > 1 && (h("svg", { key: 'df38c45537217982f7fb9513b954f3b0fa27acea', class: "cursor-trail-svg", xmlns: "http://www.w3.org/2000/svg", style: {
82
+ return (h(Host, { key: 'b427550b19a3e172cb25d05e34635121b82a61c5' }, this.cursorTrailPoints.length > 1 && (h("svg", { key: '9685b563497e110f36c0feffbfde04ebeb38024b', class: "cursor-trail-svg", xmlns: "http://www.w3.org/2000/svg", style: {
83
83
  position: 'absolute',
84
84
  left: '0',
85
85
  top: '0',
@@ -1,6 +1,6 @@
1
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
1
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
2
 
3
- const kritzelOpacitySliderCss = () => `:host{display:flex;flex-direction:column;padding:0;box-sizing:border-box}.opacity-container{display:flex;align-items:center;width:232px}.slider-wrapper{flex:1;display:flex;align-items:center}.opacity-slider{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:3px;background:linear-gradient( to right, var(--kritzel-opacity-slider-active-color, #007AFF) 0%, var(--kritzel-opacity-slider-active-color, #007AFF) var(--slider-progress, 100%), var(--kritzel-opacity-slider-track-color, #e0e0e0) var(--slider-progress, 100%), var(--kritzel-opacity-slider-track-color, #e0e0e0) 100% );outline:none;cursor:var(--kritzel-global-pointer-cursor, pointer)}.opacity-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--kritzel-opacity-slider-thumb-color, #ffffff);border:2px solid var(--kritzel-opacity-slider-thumb-border-color, #007AFF);cursor:var(--kritzel-global-pointer-cursor, pointer);box-shadow:0 1px 3px rgba(0, 0, 0, 0.2);transition:transform 0.1s ease}.opacity-slider::-webkit-slider-thumb:hover{transform:scale(1.1)}.opacity-slider::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--kritzel-opacity-slider-thumb-color, #ffffff);border:2px solid var(--kritzel-opacity-slider-thumb-border-color, #007AFF);cursor:var(--kritzel-global-pointer-cursor, pointer);box-shadow:0 1px 3px rgba(0, 0, 0, 0.2);transition:transform 0.1s ease}.opacity-slider::-moz-range-thumb:hover{transform:scale(1.1)}.opacity-slider::-moz-range-track{height:6px;border-radius:3px;background:transparent}.opacity-slider:focus{outline:none}.opacity-slider:focus::-webkit-slider-thumb{box-shadow:0 0 0 2px var(--kritzel-global-focus-ring-color, rgba(0, 122, 255, 0.3))}.opacity-slider:focus::-moz-range-thumb{box-shadow:0 0 0 2px var(--kritzel-global-focus-ring-color, rgba(0, 122, 255, 0.3))}`;
3
+ const kritzelOpacitySliderCss = () => `:host{display:flex;flex-direction:column;padding:0;box-sizing:border-box}.opacity-container{display:flex;align-items:center;width:232px}.slider-wrapper{flex:1;display:flex;align-items:center}.opacity-slider{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:3px;background:linear-gradient( to right, var(--kritzel-opacity-slider-active-color, #007AFF) 0%, var(--kritzel-opacity-slider-active-color, #007AFF) var(--slider-progress, 100%), var(--kritzel-opacity-slider-track-color, #e0e0e0) var(--slider-progress, 100%), var(--kritzel-opacity-slider-track-color, #e0e0e0) 100% );outline:none;cursor:var(--kritzel-global-pointer-cursor, pointer)}.opacity-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--kritzel-opacity-slider-thumb-color, #ffffff);border:2px solid var(--kritzel-opacity-slider-thumb-border-color, #007AFF);cursor:var(--kritzel-global-pointer-cursor, pointer);box-shadow:0 1px 3px rgba(0, 0, 0, 0.2);transition:transform 0.1s ease}.opacity-slider::-webkit-slider-thumb:hover{transform:scale(1.1)}.opacity-slider::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--kritzel-opacity-slider-thumb-color, #ffffff);border:2px solid var(--kritzel-opacity-slider-thumb-border-color, #007AFF);cursor:var(--kritzel-global-pointer-cursor, pointer);box-shadow:0 1px 3px rgba(0, 0, 0, 0.2);transition:transform 0.1s ease}.opacity-slider::-moz-range-thumb:hover{transform:scale(1.1)}.opacity-slider::-moz-range-track{height:6px;border-radius:3px;background:transparent}.opacity-slider:focus{outline:none}.opacity-slider:focus::-webkit-slider-thumb{box-shadow:0 0 0 2px var(--kritzel-global-focus-ring-color, rgba(0, 122, 255, 0.3))}.opacity-slider:focus::-moz-range-thumb{box-shadow:0 0 0 2px var(--kritzel-global-focus-ring-color, rgba(0, 122, 255, 0.3))}`;
4
4
 
5
5
  const KritzelOpacitySlider = /*@__PURE__*/ proxyCustomElement(class KritzelOpacitySlider extends H {
6
6
  constructor(registerHost) {
@@ -33,7 +33,7 @@ const KritzelOpacitySlider = /*@__PURE__*/ proxyCustomElement(class KritzelOpaci
33
33
  }
34
34
  render() {
35
35
  const percentage = this.getPercentage();
36
- return (h(Host, { key: 'f1f0dad662e93506ddfc99e648a3cedc841de730' }, h("div", { key: '7b495a97a92f8fa8b28c33323d60b790781c7271', class: "opacity-container" }, h("div", { key: 'c41d3b0543a3bf78dc15602e0439f56aef21ddbe', class: "slider-wrapper" }, h("input", { key: 'd9ba313d84b91a0f9312ef1ad9fe67cc231073c9', type: "range", class: "opacity-slider", min: this.min, max: this.max, step: this.step, value: this.value, onInput: (e) => this.handleInput(e), style: {
36
+ return (h(Host, { key: '895ae10ad71e846a1bc62b794751332816650727' }, h("div", { key: '22ea167ce0d6eb17c733d789cde10477c48a2a0e', class: "opacity-container" }, h("div", { key: '2be4fbf8c1f8ddb1fde8f9da727ed0947d21646c', class: "slider-wrapper" }, h("input", { key: 'ed3621baf0adc54aa513a0296ede2f413378a06f', type: "range", class: "opacity-slider", min: this.min, max: this.max, step: this.step, value: this.value, onInput: (e) => this.handleInput(e), style: {
37
37
  '--slider-progress': `${percentage}%`,
38
38
  '--kritzel-opacity-slider-thumb-border-color': this.previewColor,
39
39
  } })))));
@@ -1,8 +1,8 @@
1
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
1
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
2
  import { g as getDefaultExportFromCjs } from './p-BFTU3MAI.js';
3
- import { d as defineCustomElement$3 } from './p-QSyeAy8R.js';
4
- import { d as defineCustomElement$2 } from './p-Ck-87E2G.js';
5
- import { d as defineCustomElement$1 } from './p-ME1sDz3f.js';
3
+ import { d as defineCustomElement$3 } from './p-DX2nriaq.js';
4
+ import { d as defineCustomElement$2 } from './p-CSuU8frA.js';
5
+ import { d as defineCustomElement$1 } from './p-BozrueXV.js';
6
6
 
7
7
  var browser = {};
8
8
 
@@ -3204,9 +3204,9 @@ const KritzelShareDialog = /*@__PURE__*/ proxyCustomElement(class KritzelShareDi
3204
3204
  this.dialogClosed.emit();
3205
3205
  };
3206
3206
  render() {
3207
- return (h(Host, { key: '0e6a5c0b25595499bc676008b22a6b27752666f3' }, h("kritzel-dialog", { key: '1770c3cf05e2ff488872da0db990d119f6903f26', dialogTitle: this.terms['share.dialogTitle'] ?? 'Share Workspace', size: "small", isOpen: this.isDialogOpen, onDialogClose: this.closeDialog, contained: true }, h("div", { key: 'ac629b3c4078c121009d64d7ba29ca8cc0fd7d64', class: "share-content" }, h("div", { key: 'c31fd9bcec831b9105a9784c0764b7d4773fc571', class: "share-section" }, h("div", { key: '1e1177dc959ca3e8e4447e6eda4ed4bf7f2faaff', class: "share-row" }, h("div", { key: 'b82c3a22f22291f2a79b0ebc98825fbc35e849fe', class: "share-label-group" }, h("label", { key: 'f4551050cb0434896f29524b540a7222f48085f2', class: "share-label" }, this.terms['share.linkSharing.label'] ?? 'Link sharing'), h("p", { key: '13ae0f33238041ea949bdd55ac5ba271c58fbdc5', class: "share-description" }, this.internalIsPublic
3207
+ return (h(Host, { key: 'f6028ad618f04e3be65c816f4b53c4ccaa93fc71' }, h("kritzel-dialog", { key: '7dabab65955f287650de4ba484e37f4ccdd7c57e', dialogTitle: this.terms['share.dialogTitle'] ?? 'Share Workspace', size: "small", isOpen: this.isDialogOpen, onDialogClose: this.closeDialog, contained: true }, h("div", { key: '321e2b17048dea20528c0f34f39a462548c64689', class: "share-content" }, h("div", { key: 'b31bbe2f686f5fe2fdc03189ffb98082683fff63', class: "share-section" }, h("div", { key: '2c864e00aa4c2da0a7f8ee6c83f149e6e93610a5', class: "share-row" }, h("div", { key: 'cbee03ac7ec9ee82f22c77d3681d4a540a0780a3', class: "share-label-group" }, h("label", { key: '3be7c8dc2ac2f7dbfe6458a902b14a887895fdc3', class: "share-label" }, this.terms['share.linkSharing.label'] ?? 'Link sharing'), h("p", { key: 'c7401bc76fdccbafc6c7c4e37380fc75f35b3a99', class: "share-description" }, this.internalIsPublic
3208
3208
  ? (this.terms['share.linkSharing.enabledDescription'] ?? 'Anyone with the link can access this workspace.')
3209
- : (this.terms['share.linkSharing.disabledDescription'] ?? 'Link sharing is disabled. Only you can access this workspace.'))), h("kritzel-slide-toggle", { key: '9e7b75fe3ae7994fae8a498f1654636481365768', checked: this.internalIsPublic, onCheckedChange: this.handleToggleChange, label: this.terms['share.linkSharing.toggleLabel'] ?? 'Enable link sharing' }))), this.internalIsPublic && (h("div", { key: '1fb6f344bc897284c7d942aeddc77968f7af0509', class: "share-section" }, h("div", { key: '23b4889472eeb7c36c5ebf3655883346cb32bf6c', class: "share-url-container" }, h("input", { key: 'ed5b25430b5013c453ea829ce328a5b4adafd2d9', type: "text", class: "share-url-input", value: this.getShareUrl(), readOnly: true, onClick: (e) => e.target.select() }), h("button", { key: 'ba5b067993e0fab26b149057a4e70f394525cc90', class: { 'copy-button': true, 'copy-success': this.copySuccess }, onClick: this.handleCopyUrl, title: this.copySuccess ? (this.terms['share.copyLink.copied'] ?? 'Copied!') : (this.terms['share.copyLink.title'] ?? 'Copy link') }, h("kritzel-icon", { key: '3f684e493506b62d5c5b32f991c2855f64302e29', name: this.copySuccess ? 'check' : 'copy', size: 18 }))), this.qrCodeDataUrl && (h("div", { key: 'a6314296e3301a1d487d34573fcf581a307cebf4', class: "share-qr-container" }, h("img", { key: '7521ce575728d0418564dc2c407381a536053394', class: "share-qr-image", src: this.qrCodeDataUrl, alt: "QR code for share link" })))))))));
3209
+ : (this.terms['share.linkSharing.disabledDescription'] ?? 'Link sharing is disabled. Only you can access this workspace.'))), h("kritzel-slide-toggle", { key: '52ae14da0d79797e9ad73f1ffbac003fd1395f47', checked: this.internalIsPublic, onCheckedChange: this.handleToggleChange, label: this.terms['share.linkSharing.toggleLabel'] ?? 'Enable link sharing' }))), this.internalIsPublic && (h("div", { key: 'bd44618680db14d7d95f0c1bbc4441a103e9f15a', class: "share-section" }, h("div", { key: '659cd6b2e2e719d76f692a8dc5a8c0855e5d246d', class: "share-url-container" }, h("input", { key: '76be432ecaad753cb7043aad912d8aa1770afb61', type: "text", class: "share-url-input", value: this.getShareUrl(), readOnly: true, onClick: (e) => e.target.select() }), h("button", { key: 'ef75a04964fb481fae2f6e924497eb2adedc100d', class: { 'copy-button': true, 'copy-success': this.copySuccess }, onClick: this.handleCopyUrl, title: this.copySuccess ? (this.terms['share.copyLink.copied'] ?? 'Copied!') : (this.terms['share.copyLink.title'] ?? 'Copy link') }, h("kritzel-icon", { key: '06bbdc32d4348ca6d75dbbe11ba74d94e1c86882', name: this.copySuccess ? 'check' : 'copy', size: 18 }))), this.qrCodeDataUrl && (h("div", { key: '9246e86b26a9794738a29e6a6bfe6c4812339449', class: "share-qr-container" }, h("img", { key: '90e18eee230c23e0bfd773c9b8a6967803ae10dc', class: "share-qr-image", src: this.qrCodeDataUrl, alt: "QR code for share link" })))))))));
3210
3210
  }
3211
3211
  static get watchers() { return {
3212
3212
  "isPublic": [{
@@ -1,5 +1,5 @@
1
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
2
- import { d as defineCustomElement$1 } from './p-Ck-87E2G.js';
1
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
+ import { d as defineCustomElement$1 } from './p-CSuU8frA.js';
3
3
 
4
4
  const kritzelUtilityPanelCss = () => `: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:var(--kritzel-utility-panel-background-color, #e2e2e2);width:fit-content;user-select:none;z-index:1}.utility-button{display:flex;justify-content:center;align-items:center;width:28px;height:28px;padding:8px 4px;border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);color:var(--kritzel-utility-panel-button-color, #333333);--kritzel-icon-color:var(--kritzel-utility-panel-button-color, #333333);-webkit-tap-highlight-color:transparent;border-radius:var(--kritzel-utility-panel-button-border-radius, 8px)}.utility-button:hover,.utility-button:focus-visible{background-color:var(--kritzel-utility-panel-button-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.utility-button:disabled{opacity:0.4;cursor:not-allowed;pointer-events:none}.utility-separator{width:1px;height:16px;background-color:var(--kritzel-utility-panel-separator-color, hsl(0, 0%, 0%, 8%))}`;
5
5
 
@@ -33,7 +33,7 @@ const KritzelUtilityPanel = /*@__PURE__*/ proxyCustomElement(class KritzelUtilit
33
33
  this.redo.emit();
34
34
  }
35
35
  render() {
36
- return (h(Host, { key: 'bc0322b40c4ff4fba997f1dc1901edbb934e4a0a' }, h("button", { key: 'ff48698d2757b0d99cacfd4fbaa5a7b0ae8f1604', class: "utility-button", "data-testid": "utility-undo", disabled: !this.undoState?.canUndo, onClick: event => this.handleUndo(event), "aria-label": this.terms['utility.undo'] ?? 'Undo' }, h("kritzel-icon", { key: 'bc6756df10c7979e06cd9ebdb172b5ef54c7bb67', name: "undo" })), h("button", { key: '07afd176ae1b5cb5a65cd097ce4a99a131aee7aa', class: "utility-button", "data-testid": "utility-redo", disabled: !this.undoState?.canRedo, onClick: event => this.handleRedo(event), "aria-label": this.terms['utility.redo'] ?? 'Redo' }, h("kritzel-icon", { key: '4573d7ab91f0cbfa0aafb607050f0b09048d60e1', name: "redo" })), h("div", { key: 'b663c43ef9181f61b12614245a65d063f6d94eaf', class: "utility-separator" }), h("button", { key: '248f7ae7cabbd83585674dcb16124a3f9fa2449b', class: "utility-button", "data-testid": "utility-delete", onClick: () => this.delete.emit(), "aria-label": this.terms['utility.delete'] ?? 'Delete selected items' }, h("kritzel-icon", { key: '6cbc48e118c96770333ed3e5947e54e497e93716', name: "delete" }))));
36
+ return (h(Host, { key: '57c1a6746e4d5b319bb368c9d0bfc52a31d8c8de' }, h("button", { key: '5fb00d62b68de41feda9fafb3eec46cc0b85ba0e', class: "utility-button", "data-testid": "utility-undo", disabled: !this.undoState?.canUndo, onClick: event => this.handleUndo(event), "aria-label": this.terms['utility.undo'] ?? 'Undo' }, h("kritzel-icon", { key: '5ed2c36405ac7113ac697de9102aaf7067127e2a', name: "undo" })), h("button", { key: '0d58c8cbbb8e9547b9416dbf81a2c8011208dc6c', class: "utility-button", "data-testid": "utility-redo", disabled: !this.undoState?.canRedo, onClick: event => this.handleRedo(event), "aria-label": this.terms['utility.redo'] ?? 'Redo' }, h("kritzel-icon", { key: '70264118cbe0f54335a02941fdc868f63476cd1c', name: "redo" })), h("div", { key: '6eed6a603b8bc62e55b1f6fe82e7d035d1f5833c', class: "utility-separator" }), h("button", { key: 'd11195da7a86496afcca26105a6a0f066b1b2340', class: "utility-button", "data-testid": "utility-delete", onClick: () => this.delete.emit(), "aria-label": this.terms['utility.delete'] ?? 'Delete selected items' }, h("kritzel-icon", { key: '5e4c731f90863b4db917c67ac7e87c2945c7bcaa', name: "delete" }))));
37
37
  }
38
38
  static get style() { return kritzelUtilityPanelCss(); }
39
39
  }, [513, "kritzel-utility-panel", {
@@ -1,5 +1,5 @@
1
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
2
- import { d as defineCustomElement$1 } from './p-Ck-87E2G.js';
1
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
+ import { d as defineCustomElement$1 } from './p-CSuU8frA.js';
3
3
 
4
4
  const kritzelBackToContentCss = () => `:host{display:block;z-index:var(--kritzel-back-to-content-z-index, 1000)}.back-to-content-button{display:flex;align-items:center;justify-content:center;height:var(--kritzel-back-to-content-height, 50px);box-sizing:border-box;gap:var(--kritzel-back-to-content-gap, 6px);padding:var(--kritzel-back-to-content-padding, 0 16px);border:var(--kritzel-back-to-content-border, 1px solid #ebebeb);border-radius:var(--kritzel-back-to-content-border-radius, 12px);background-color:var(--kritzel-back-to-content-background-color, #ffffff);color:var(--kritzel-back-to-content-color, #000000);font-size:var(--kritzel-back-to-content-font-size, 14px);font-weight:var(--kritzel-back-to-content-font-weight, 500);cursor:var(--kritzel-global-pointer-cursor, pointer);box-shadow:var(--kritzel-back-to-content-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));opacity:0;pointer-events:none;transition:opacity 0.2s ease-out, transform 0.2s ease-out, background-color 0.15s ease-out;-webkit-tap-highlight-color:transparent;user-select:none}.back-to-content-button.visible{opacity:1;pointer-events:auto}@media (hover: hover){.back-to-content-button:hover{background-color:var(--kritzel-back-to-content-hover-background-color, hsl(0, 0%, 0%, 4.3%))}}.back-to-content-button:active{background-color:var(--kritzel-back-to-content-active-background-color, hsl(0, 0%, 0%, 8.6%))}`;
5
5
 
@@ -28,7 +28,7 @@ const KritzelBackToContent = /*@__PURE__*/ proxyCustomElement(class KritzelBackT
28
28
  this.backToContent.emit();
29
29
  };
30
30
  render() {
31
- return (h(Host, { key: '612164b48226601d863cb2acdab1d567e9652188' }, h("button", { key: '159a4f4f01934c03c7898f2803bf87d5f0d95aba', class: { 'back-to-content-button': true, visible: this.visible }, onClick: this.handleClick, "aria-label": this.text }, h("kritzel-icon", { key: 'e7ec1308ab12ca233509a00fc76df17fce1f5700', name: "chevrons-left" }))));
31
+ return (h(Host, { key: '2576489b9f97c77d1931e7c8496bae968d998f9d' }, h("button", { key: 'da891543ce8a9b5ccd2f4a461bdcdc7f3f9ad266', class: { 'back-to-content-button': true, visible: this.visible }, onClick: this.handleClick, "aria-label": this.text }, h("kritzel-icon", { key: '4559cc932918707d5961c6237f3c5e23c9e4cc9d', name: "chevrons-left" }))));
32
32
  }
33
33
  static get style() { return kritzelBackToContentCss(); }
34
34
  }, [513, "kritzel-back-to-content", {
@@ -1,10 +1,10 @@
1
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
1
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
2
  import { K as KritzelWorkspace } from './p-DAwPPDMS.js';
3
3
  import { O as ObjectHelper } from './p-DPONTran.js';
4
- import { d as defineCustomElement$5 } from './p-Ck-87E2G.js';
5
- import { d as defineCustomElement$3, a as defineCustomElement$4 } from './p-D2VcPEtL.js';
6
- import { d as defineCustomElement$2 } from './p-DYPA7jpg.js';
7
- import { d as defineCustomElement$1 } from './p-dAXnRkjA.js';
4
+ import { d as defineCustomElement$5 } from './p-CSuU8frA.js';
5
+ import { d as defineCustomElement$3, a as defineCustomElement$4 } from './p-BrNsOp2v.js';
6
+ import { d as defineCustomElement$2 } from './p-BPsKYMH6.js';
7
+ import { d as defineCustomElement$1 } from './p-C98Eb3_R.js';
8
8
 
9
9
  const kritzelWorkspaceManagerCss = () => `:host{display:flex;flex-direction:column;z-index:1}.manager{opacity:0;pointer-events:none;transition:opacity 0.2s ease-out}.manager.visible{opacity:1;pointer-events:auto}`;
10
10
 
@@ -1,4 +1,4 @@
1
- import { p as proxyCustomElement, H, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
1
+ import { p as proxyCustomElement, H, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
2
 
3
3
  const kritzelLoadingOverlayCss = () => `:host{display:contents}.loading-overlay{position:absolute;inset:0;z-index:var(--kritzel-editor-loading-overlay-z-index, 9999);display:flex;align-items:center;justify-content:center;gap:10px;background-color:var(--kritzel-editor-loading-overlay-background, rgba(255, 255, 255, 0.6));color:var(--kritzel-editor-loading-overlay-color, #333);font-family:var(--kritzel-font-family, sans-serif);font-size:1.25rem;opacity:0;pointer-events:none;visibility:hidden}.loading-overlay.visible{pointer-events:all;visibility:visible;animation:kritzel-loading-fade-in 200ms ease-out var(--kritzel-editor-loading-overlay-delay, 300ms) forwards}.loading-spinner{width:20px;height:20px;box-sizing:border-box;display:block;flex-shrink:0;border:2px solid var(--kritzel-editor-loading-overlay-spinner-color, #cccccc);border-top-color:var(--kritzel-editor-loading-overlay-spinner-active-color, #333333);border-radius:50%;animation:kritzel-loading-spin 0.6s linear infinite}@keyframes kritzel-loading-spin{to{transform:rotate(360deg)}}@keyframes kritzel-loading-fade-in{to{opacity:1}}`;
4
4
 
@@ -19,7 +19,7 @@ const KritzelLoadingOverlay = /*@__PURE__*/ proxyCustomElement(class KritzelLoad
19
19
  */
20
20
  text = 'Loading...';
21
21
  render() {
22
- return (h(Host, { key: 'bba8ce825e41dff170d9552c28ac996249639ff3' }, h("div", { key: 'af98ab01de836fb6c718f5ceda4a490d91231e66', class: { 'loading-overlay': true, visible: this.visible }, "aria-hidden": this.visible ? 'false' : 'true' }, h("span", { key: '7c04c6abcb445c34f9a036e1797605ef7d575031', class: "loading-spinner" }), this.text)));
22
+ return (h(Host, { key: '6fc1886217516966fa3599473989748151d93efd' }, h("div", { key: 'c6f2aa1c7f81bbab65411292934d185b4bf69e5a', class: { 'loading-overlay': true, visible: this.visible }, "aria-hidden": this.visible ? 'false' : 'true' }, h("span", { key: '21bae0b6f9b9a08f814aec7e6635a904018ab839', class: "loading-spinner" }), this.text)));
23
23
  }
24
24
  static get style() { return kritzelLoadingOverlayCss(); }
25
25
  }, [513, "kritzel-loading-overlay", {
@@ -1,5 +1,5 @@
1
- import { p as proxyCustomElement, t as transformTag, H, h, d as Host } from './p-C9_yBEoX.js';
2
- import { d as defineCustomElement$1 } from './p-zG-WUBGF.js';
1
+ import { p as proxyCustomElement, t as transformTag, H, h, d as Host } from './p-B43upypT.js';
2
+ import { d as defineCustomElement$1 } from './p-4SPnZZkH.js';
3
3
 
4
4
  const kritzelActiveUsersCss = () => `:host{display:inline-flex;align-items:center}.avatars{display:flex;align-items:center}.avatar-wrapper{position:relative;transition:margin-left 200ms ease}.avatar-wrapper kritzel-avatar{border-radius:50%;box-shadow:0 0 0 2px var(--kritzel-active-users-avatar-border-color, #ffffff)}.avatars:hover .avatar-wrapper{margin-left:-6px !important}.avatar-tooltip{position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:12px;padding:4px 8px;background-color:var(--kritzel-active-users-tooltip-background, #333333);color:var(--kritzel-active-users-tooltip-color, #ffffff);font-family:sans-serif;font-size:12px;font-weight:500;border-radius:4px;white-space:nowrap;width:max-content;pointer-events:none;opacity:0;transition:opacity 150ms ease}.avatar-wrapper:hover .avatar-tooltip,.overflow-count:hover .avatar-tooltip{opacity:1}.overflow-count{position:relative;margin-left:8px;font-family:sans-serif;font-size:var(--kritzel-active-users-overflow-font-size, 14px);font-weight:500;color:var(--kritzel-active-users-overflow-color, #666666);white-space:nowrap;cursor:default}.overflow-count .avatar-tooltip{white-space:nowrap;text-align:left;margin-top:20px}`;
5
5
 
@@ -1,20 +1,20 @@
1
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
1
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
2
  import { K as KritzelDevicesHelper } from './p-jGOpkGDl.js';
3
- import { K as KritzelToolConfigHelper, d as defineCustomElement$3 } from './p-CWAChRD5.js';
3
+ import { K as KritzelToolConfigHelper, d as defineCustomElement$3 } from './p-HoO86l1o.js';
4
4
  import { a as KritzelColorHelper } from './p-7I4Uzjrw.js';
5
- import { d as defineCustomElement$e } from './p-DcUIO14-.js';
6
- import { d as defineCustomElement$d } from './p-MhQxGUvY.js';
7
- import { d as defineCustomElement$c } from './p-CHoOe3FD.js';
8
- import { d as defineCustomElement$b } from './p-Dp1CD4gK.js';
9
- import { d as defineCustomElement$a } from './p-DjXQxw9R.js';
10
- import { d as defineCustomElement$9 } from './p-CLAz6RJc.js';
11
- import { d as defineCustomElement$8 } from './p-Ck-87E2G.js';
12
- import { d as defineCustomElement$7 } from './p-Di--2boB.js';
13
- import { d as defineCustomElement$6 } from './p-vDCa_ZDm.js';
14
- import { d as defineCustomElement$5 } from './p-Covorf4C.js';
15
- import { d as defineCustomElement$4 } from './p-fSV6KVTC.js';
16
- import { d as defineCustomElement$2 } from './p-o3NYKrVL.js';
17
- import { d as defineCustomElement$1 } from './p-BZZ3KRPk.js';
5
+ import { d as defineCustomElement$e } from './p-Dt7-I2Xz.js';
6
+ import { d as defineCustomElement$d } from './p-B-585egz.js';
7
+ import { d as defineCustomElement$c } from './p-Df3BwVGy.js';
8
+ import { d as defineCustomElement$b } from './p-DVXTPI71.js';
9
+ import { d as defineCustomElement$a } from './p-djJSnjAX.js';
10
+ import { d as defineCustomElement$9 } from './p-2WiGyky4.js';
11
+ import { d as defineCustomElement$8 } from './p-CSuU8frA.js';
12
+ import { d as defineCustomElement$7 } from './p-CXpv9Rxe.js';
13
+ import { d as defineCustomElement$6 } from './p-CrHvaLRV.js';
14
+ import { d as defineCustomElement$5 } from './p-BFYtCsZu.js';
15
+ import { d as defineCustomElement$4 } from './p-GKmqCI8r.js';
16
+ import { d as defineCustomElement$2 } from './p-CaBbajU2.js';
17
+ import { d as defineCustomElement$1 } from './p-CzW58DHM.js';
18
18
 
19
19
  const kritzelControlsCss = () => `:host{display:flex;flex-direction:column;user-select:none;max-width:100%;z-index:1}:host(.mobile){--kritzel-controls-control-hover-background-color:transparent;--kritzel-controls-control-active-background-color:transparent}.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 #ebebeb);z-index:1;position:relative;max-width:100%;overflow:hidden}.kritzel-tools-scroll{display:flex;flex-direction:row;align-items:center;gap:var(--kritzel-controls-gap, 8px);overflow-x:auto;overflow-y:hidden;flex:1 1 auto;min-width:0;padding:4px;margin:-4px;scrollbar-width:none;-ms-overflow-style:none}.kritzel-tools-scroll::-webkit-scrollbar{display:none}.scroll-indicator-left,.scroll-indicator-right{position:absolute;top:0;bottom:0;width:32px;pointer-events:none;opacity:0;transition:opacity 0.2s ease-out;z-index:1}.scroll-indicator-left{left:0;background:linear-gradient(to right, var(--kritzel-controls-background-color, #ffffff), transparent);border-radius:var(--kritzel-controls-border-radius, 16px) 0 0 var(--kritzel-controls-border-radius, 16px)}.scroll-indicator-right{right:0;background:linear-gradient(to left, var(--kritzel-controls-background-color, #ffffff), transparent);border-radius:0 var(--kritzel-controls-border-radius, 16px) var(--kritzel-controls-border-radius, 16px) 0}.scroll-indicator-left.visible,.scroll-indicator-right.visible{opacity:1}.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;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);-webkit-tap-highlight-color:transparent;font-weight:bold}.kritzel-control:focus,.kritzel-control:hover{background-color:var(--kritzel-controls-control-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.kritzel-control:active{background-color:var(--kritzel-controls-control-active-background-color, hsl(0, 0%, 0%, 8.6%))}.kritzel-control.selected,.kritzel-control.selected:hover,.kritzel-control.selected:active{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF) !important;color:var(--kritzel-controls-control-selected-color, #ffffff) !important}.kritzel-control.selected:focus{background-color:var(--kritzel-controls-control-selected-background-color, #007bffe3) !important}.kritzel-control-separator{width:1px;height:24px;background-color:var(--kritzel-controls-separator-color, #ebebeb);margin:0 4px}.kritzel-control-split{position:relative;display:flex;align-items:center;border-radius:var(--kritzel-controls-control-border-radius, 12px);color:var(--kritzel-controls-control-color, #000000)}.kritzel-control-split .kritzel-control-main{display:flex;justify-content:center;align-items:center;padding:var(--kritzel-controls-control-padding, 8px);border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);-webkit-tap-highlight-color:transparent;border-radius:var(--kritzel-controls-control-border-radius, 12px);color:inherit}.kritzel-control-split.selected .kritzel-control-main{border-radius:var(--kritzel-controls-control-border-radius, 12px) 0 0 var(--kritzel-controls-control-border-radius, 12px)}.kritzel-control-split .kritzel-control-dropdown{display:flex;justify-content:center;align-items:center;align-self:stretch;border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);-webkit-tap-highlight-color:transparent;border-radius:0 var(--kritzel-controls-control-border-radius, 12px) var(--kritzel-controls-control-border-radius, 12px) 0;color:inherit;width:0;padding:0;opacity:0;overflow:hidden;pointer-events:none;transition:width 0.15s ease-out, padding 0.15s ease-out, opacity 0.15s ease-out}.kritzel-control-split .kritzel-control-dropdown.visible{width:auto;padding:0 6px;opacity:1;pointer-events:auto}.kritzel-control-split .kritzel-control-main:focus,.kritzel-control-split .kritzel-control-main:hover,.kritzel-control-split .kritzel-control-dropdown:focus,.kritzel-control-split .kritzel-control-dropdown:hover{background-color:var(--kritzel-controls-control-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.kritzel-control-split .kritzel-control-main:active,.kritzel-control-split .kritzel-control-dropdown:active{background-color:var(--kritzel-controls-control-active-background-color, hsl(0, 0%, 0%, 8.6%))}.kritzel-control-split.selected{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF) !important;color:var(--kritzel-controls-control-selected-color, #ffffff) !important}.kritzel-control-split.selected .kritzel-control-main:hover,.kritzel-control-split.selected .kritzel-control-dropdown:hover{background-color:rgba(255, 255, 255, 0.15)}.kritzel-submenu-content{display:flex;flex-direction:column;gap:var(--kritzel-submenu-gap, 4px);min-width:140px}.kritzel-submenu-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);border-radius:8px;color:var(--kritzel-controls-control-color, #000000);font-size:14px;text-align:left;white-space:nowrap;-webkit-tap-highlight-color:transparent}.kritzel-submenu-item:hover{background-color:var(--kritzel-controls-control-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.kritzel-submenu-item.active{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF);color:var(--kritzel-controls-control-selected-color, #ffffff)}.kritzel-submenu-item.active:hover{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF)}.kritzel-config-container{position:relative;display:flex;justify-content:center;align-items:center;height:40px;box-sizing:border-box;-webkit-tap-highlight-color:transparent;flex-shrink:0;width:0;opacity:0;overflow:hidden;pointer-events:none;margin-left:calc(-1 * var(--kritzel-controls-gap, 8px));transition:width 0.2s ease-out, opacity 0.2s ease-out, margin-left 0.2s ease-out}.kritzel-config-container.visible{width:40px;opacity:1;pointer-events:auto;margin-left:0;overflow:visible}.config-gradient-left{position:absolute;top:0;bottom:0;left:-32px;width:32px;background:linear-gradient(to right, transparent, var(--kritzel-controls-background-color, #ffffff));pointer-events:none;z-index:1;opacity:0;transition:opacity 0.2s ease-out}.config-gradient-left.visible{opacity:1}.kritzel-config{display:flex;justify-content:center;align-items:center;cursor:var(--kritzel-global-pointer-cursor, pointer);border-radius:50%}.color-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:50%;cursor:var(--kritzel-global-pointer-cursor, pointer);border:2px solid transparent;box-sizing:border-box;background-color:var(--kritzel-color-palette-hover-background-color, #ebebeb)}.font-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:50%;cursor:var(--kritzel-global-pointer-cursor, pointer);border:2px solid transparent;box-sizing:border-box;background-color:var(--kritzel-color-palette-hover-background-color, #ebebeb)}.no-config{height:24px;width:24px;border-radius:50%;border:1px dashed gray}kritzel-tooltip{z-index:10001}`;
20
20
 
@@ -256,13 +256,13 @@ const KritzelControls = /*@__PURE__*/ proxyCustomElement(class KritzelControls e
256
256
  // Separate tool controls from config control
257
257
  const toolControls = this.internalControls.filter(c => c.type === 'tool' || c.type === 'separator');
258
258
  const configControl = this.internalControls.find(c => c.type === 'config' && c.name === this.firstConfig?.name);
259
- return (h(Host, { key: '0c61b173d0a92351de148c9c98b25031f231e1ab', style: { display: this.visible ? '' : 'none' }, class: {
259
+ return (h(Host, { key: '2a7595b72594df3e8ff9a103c3ff7dd70f0a8045', style: { display: this.visible ? '' : 'none' }, class: {
260
260
  mobile: this.isTouchDevice,
261
- } }, this.isUtilityPanelVisible && (h("kritzel-utility-panel", { key: 'a696e0af5f126456e610a6353377cb5a68b4fcb4', style: {
261
+ } }, this.isUtilityPanelVisible && (h("kritzel-utility-panel", { key: '1c2d9f14c53944f291cf49cbcd1bf282ad8a8683', style: {
262
262
  position: 'absolute',
263
263
  bottom: '56px',
264
264
  left: '12px',
265
- }, undoState: this.undoState, terms: this.terms, onUndo: () => this.kritzelEngine?.undo(), onRedo: () => this.kritzelEngine?.redo(), onDelete: () => this.kritzelEngine?.delete() })), h("div", { key: 'ffe96a9b2b73d3e08c7d149fd64b9b209eaf47d3', class: "kritzel-controls" }, h("div", { key: 'a351b3a4a801a4480d2476a6ca34bbbd628525ac', class: { 'scroll-indicator-left': true, 'visible': this.canScrollLeft } }), h("div", { key: '9447a0d4728d4d476113a2bcb94f53a5652f7dd1', class: "kritzel-tools-scroll", ref: el => (this.toolsScrollRef = el), onScroll: this.handleToolsScroll }, toolControls.map(control => {
265
+ }, undoState: this.undoState, terms: this.terms, onUndo: () => this.kritzelEngine?.undo(), onRedo: () => this.kritzelEngine?.redo(), onDelete: () => this.kritzelEngine?.delete() })), h("div", { key: '8ac30e183885bc106033ca163aa7e5927802e67c', class: "kritzel-controls" }, h("div", { key: '74b2808a506e671682aed91107c7c9e27aa4b2c7', class: { 'scroll-indicator-left': true, 'visible': this.canScrollLeft } }), h("div", { key: '3fd693c993d5b11eadd2eec7481214fbc1550301', class: "kritzel-tools-scroll", ref: el => (this.toolsScrollRef = el), onScroll: this.handleToolsScroll }, toolControls.map(control => {
266
266
  // Check if this control has sub-options (split-button)
267
267
  if (control.subOptions?.length) {
268
268
  const selectedSubOption = this.getSelectedSubOption(control);
@@ -292,10 +292,10 @@ const KritzelControls = /*@__PURE__*/ proxyCustomElement(class KritzelControls e
292
292
  'kritzel-control': true,
293
293
  'selected': this.activeControl?.name === control?.name,
294
294
  }, key: control.name, "data-testid": `tool-${control.name}`, onClick: _event => this.handleControlClick?.(control), "aria-label": control.name.charAt(0).toUpperCase() + control.name.slice(1) }, h("kritzel-icon", { name: control.icon })));
295
- })), h("div", { key: '31a1d141b1381c9aa0b7f07c1ae7d1606d1a8fc6', class: { 'scroll-indicator-right': true, 'visible': this.canScrollRight && !(configControl && this.activeControl && hasConfigUI) } }), configControl && this.activeControl && (h("div", { class: {
295
+ })), h("div", { key: '6f16a8332dc6a082f2e6aedbec3e31398f2a8b66', class: { 'scroll-indicator-right': true, 'visible': this.canScrollRight && !(configControl && this.activeControl && hasConfigUI) } }), configControl && this.activeControl && (h("div", { class: {
296
296
  'kritzel-config-container': true,
297
297
  'visible': hasConfigUI,
298
- }, key: configControl.name }, h("div", { key: 'ed4b6440e5b99b68a29269476de7efa15ecec38f', class: { 'config-gradient-left': true, 'visible': this.needsScrolling } }), h("kritzel-tooltip", { key: 'cac5417d5e1a8c4ec19fbcf38affb30ac67b521e', anchorElement: this.host.shadowRoot?.querySelector('.kritzel-config-container'), triggerElement: this.configTriggerRef }, h("kritzel-tool-config", { key: 'ffba221a22ab50b4c44c0247ef9e86e4b67e5bde', tool: this.activeControl.tool, theme: this.theme, engine: this.kritzelEngine, terms: this.terms, onToolChange: event => this.handleToolChange?.(event), onDisplayValuesChange: this.handleDisplayValuesChange, style: { width: '100%', height: '100%' } })), h("div", { key: '1f5b90e286d5aa8fcf10aa3987c6c6cd75360d49', tabIndex: hasConfigUI ? 0 : -1, class: "kritzel-config", "data-testid": "tool-config", ref: el => {
298
+ }, key: configControl.name }, h("div", { key: '554d743fccfb62d8c368f2a5cdca232ae9842b7f', class: { 'config-gradient-left': true, 'visible': this.needsScrolling } }), h("kritzel-tooltip", { key: 'af97d986d82c961d66c910f7edabd6e597ec59ab', anchorElement: this.host.shadowRoot?.querySelector('.kritzel-config-container'), triggerElement: this.configTriggerRef }, h("kritzel-tool-config", { key: '3721e5463a85881c7e806d69c0a9524f44732978', tool: this.activeControl.tool, theme: this.theme, engine: this.kritzelEngine, terms: this.terms, onToolChange: event => this.handleToolChange?.(event), onDisplayValuesChange: this.handleDisplayValuesChange, style: { width: '100%', height: '100%' } })), h("div", { key: 'c6e3fe4a4a9b781db394073c8f929533487be760', tabIndex: hasConfigUI ? 0 : -1, class: "kritzel-config", "data-testid": "tool-config", ref: el => {
299
299
  if (el)
300
300
  this.configTriggerRef = el;
301
301
  }, onKeyDown: event => {
@@ -304,7 +304,7 @@ const KritzelControls = /*@__PURE__*/ proxyCustomElement(class KritzelControls e
304
304
  }
305
305
  }, style: {
306
306
  cursor: 'pointer',
307
- } }, this.displayValues && (h("div", { key: '3857f9f2bc30ddac57d108a8021061edc5decb07', class: "color-container" }, h("kritzel-color", { key: '304eda20d9036bf567db7a4f146f1b07a8ca4c34', value: this.displayValues.color, theme: this.theme, size: 18, style: {
307
+ } }, this.displayValues && (h("div", { key: '9eeb3a9fc29f4848ee9f325d50b4cbfc5bfe5f1c', class: "color-container" }, h("kritzel-color", { key: '1d45edb7ed07a8d12ab55e374ea456b8e95c8d41', value: this.displayValues.color, theme: this.theme, size: 18, style: {
308
308
  borderRadius: '50%',
309
309
  border: 'none',
310
310
  } })))))))));
@@ -1,4 +1,4 @@
1
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
1
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
2
 
3
3
  const kritzelNumericInputCss = () => `:host{display:block}.input-container{display:flex;flex-direction:column;gap:6px}.input-label{font-size:14px;font-weight:500;color:var(--kritzel-numeric-input-label-color, #333333)}.input-wrapper{display:flex;position:relative}.numeric-input{flex:1;padding:8px 36px 8px 12px;border:1px solid var(--kritzel-numeric-input-border-color, #ebebeb);border-radius:var(--kritzel-numeric-input-border-radius, 6px);font-size:14px;color:var(--kritzel-numeric-input-text-color, #333333);background-color:var(--kritzel-numeric-input-input-background, #ffffff);outline:none;transition:border-color 150ms ease;box-sizing:border-box}.numeric-input::-webkit-outer-spin-button,.numeric-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.numeric-input[type='number']{-moz-appearance:textfield}.numeric-input::selection{background-color:var(--kritzel-numeric-input-selection-background, #007AFF);color:var(--kritzel-numeric-input-selection-color, #ffffff)}.numeric-input:hover{border-color:var(--kritzel-numeric-input-hover-border-color, #cccccc)}.numeric-input:focus{border-color:var(--kritzel-numeric-input-focus-border-color, #0066ff);border-width:2px;padding:7px 35px 7px 11px}.spinner-buttons{position:absolute;right:1px;top:1px;bottom:1px;display:flex;flex-direction:column;border-left:1px solid var(--kritzel-numeric-input-border-color, #ebebeb);border-radius:0 var(--kritzel-numeric-input-spinner-border-radius, 5px) var(--kritzel-numeric-input-spinner-border-radius, 5px) 0;overflow:hidden}.spinner-button{flex:1;display:flex;align-items:center;justify-content:center;width:24px;padding:0;border:none;background-color:var(--kritzel-numeric-input-spinner-background, #f5f5f5);color:var(--kritzel-numeric-input-spinner-color, #666666);cursor:pointer;transition:background-color 150ms ease}.spinner-button:hover{background-color:var(--kritzel-numeric-input-spinner-hover-background, #ebebeb)}.spinner-button:active{background-color:var(--kritzel-numeric-input-spinner-active-background, #dddddd)}.spinner-up{border-bottom:1px solid var(--kritzel-numeric-input-border-color, #ebebeb)}.spinner-icon{width:10px;height:6px}`;
4
4
 
@@ -97,7 +97,7 @@ const KritzelNumericInput = /*@__PURE__*/ proxyCustomElement(class KritzelNumeri
97
97
  this.valueChange.emit(newValue);
98
98
  };
99
99
  render() {
100
- return (h(Host, { key: '7af3efe94c98934dcfe701c516ffc7cea2b4fde9' }, h("div", { key: '81347ea86a62f72b5b7662d90670e2ace98b16e7', class: "input-container" }, this.label && h("label", { key: '35b7650a3c4d1b93dbcb763b0c8f3767e3b519ac', class: "input-label" }, this.label), h("div", { key: '691ade138e5ba2ef51a76b1fc54da51fb7dd7389', class: "input-wrapper" }, h("input", { key: '58445c41cc8be438d1065787d375fb9d271f3873', type: "number", class: "numeric-input", title: "", min: this.min === Number.MIN_SAFE_INTEGER ? undefined : this.min, max: this.max === Number.MAX_SAFE_INTEGER ? undefined : this.max, step: this.step, value: this.inputValue, placeholder: this.placeholder, onInput: this.handleInput, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, onInvalid: this.handleInvalid }), h("div", { key: 'c669fc612696c555b96f046a8c70e75e9650af23', class: "spinner-buttons" }, h("button", { key: 'ae904cc60925d48120405f74d656ee9cbf312d70', type: "button", class: "spinner-button spinner-up", onClick: this.handleIncrement, tabIndex: -1, "aria-label": "Increase value" }, h("svg", { key: '4a4964336820cfc2128b98bf245556425919dfb6', viewBox: "0 0 10 6", class: "spinner-icon" }, h("path", { key: 'f305136d337690b0eaa39983d26a67454e4862da', d: "M1 5L5 1L9 5", stroke: "currentColor", "stroke-width": "1.5", fill: "none", "stroke-linecap": "round", "stroke-linejoin": "round" }))), h("button", { key: 'c90f2d9a3deac66dc577142f87f73aef491e5f25', type: "button", class: "spinner-button spinner-down", onClick: this.handleDecrement, tabIndex: -1, "aria-label": "Decrease value" }, h("svg", { key: '2a3e33c55b6ace48f15ec56d78c6aab782c64520', viewBox: "0 0 10 6", class: "spinner-icon" }, h("path", { key: 'f327413078824800ad061126417a8f25578ba2de', d: "M1 1L5 5L9 1", stroke: "currentColor", "stroke-width": "1.5", fill: "none", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))));
100
+ return (h(Host, { key: '68e6fecd79c3c970d1742b1a0bb8667ca2d31729' }, h("div", { key: 'efcf623186d221690bbb956088ec51343de07f3a', class: "input-container" }, this.label && h("label", { key: '300de793f02008ad037da021003b46fc34fc5239', class: "input-label" }, this.label), h("div", { key: '9ff424901fddfcbdac4835e2b2089df2e0966d0f', class: "input-wrapper" }, h("input", { key: 'fc77e6ad1c0b15e3dd3f960b6448ddab1a9beeb1', type: "number", class: "numeric-input", title: "", min: this.min === Number.MIN_SAFE_INTEGER ? undefined : this.min, max: this.max === Number.MAX_SAFE_INTEGER ? undefined : this.max, step: this.step, value: this.inputValue, placeholder: this.placeholder, onInput: this.handleInput, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, onInvalid: this.handleInvalid }), h("div", { key: 'c286606fa0617cc3acbbe40a27e40b154002e01d', class: "spinner-buttons" }, h("button", { key: 'e3a65a327975918fe604cd196ffb087fc4d3ca47', type: "button", class: "spinner-button spinner-up", onClick: this.handleIncrement, tabIndex: -1, "aria-label": "Increase value" }, h("svg", { key: '62b2ff4ed67ca8b6fc220ff9c63ceca90f75baea', viewBox: "0 0 10 6", class: "spinner-icon" }, h("path", { key: '803d5c30826d40d95f282071f3f88356366a9faf', d: "M1 5L5 1L9 5", stroke: "currentColor", "stroke-width": "1.5", fill: "none", "stroke-linecap": "round", "stroke-linejoin": "round" }))), h("button", { key: '3c54a48e7082f5aaa9ed923357d0cc4a722018b5', type: "button", class: "spinner-button spinner-down", onClick: this.handleDecrement, tabIndex: -1, "aria-label": "Decrease value" }, h("svg", { key: '9f6cb5f34bbb0e70b5773aecec519b7d8b742712', viewBox: "0 0 10 6", class: "spinner-icon" }, h("path", { key: '6539b0d4f4bd26e463fa9152cf58757497355cf6', d: "M1 1L5 5L9 1", stroke: "currentColor", "stroke-width": "1.5", fill: "none", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))));
101
101
  }
102
102
  static get watchers() { return {
103
103
  "value": [{
@@ -1,4 +1,4 @@
1
- import { p as proxyCustomElement, H, h, d as Host, t as transformTag } from './p-C9_yBEoX.js';
1
+ import { p as proxyCustomElement, H, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
2
 
3
3
  const kritzelFontCss = () => `:host{display:block}.font-preview{color:var(--kritzel-font-size-text-color, #333333);line-height:1;text-align:center;font-weight:bold}`;
4
4
 
@@ -14,7 +14,7 @@ const KritzelFont = /*@__PURE__*/ proxyCustomElement(class KritzelFont extends H
14
14
  size = 24;
15
15
  color = '#000000';
16
16
  render() {
17
- return (h(Host, { key: '8e4cf962a3456fb293faa678725e0c86af08bf49' }, h("div", { key: 'acf6986196dffd5c00b7edefa9453259149bf3cf', class: "font-preview", style: {
17
+ return (h(Host, { key: '42f058426e2afcc49c788f2385e23a5ff153e77c' }, h("div", { key: '962dfc48ba84c5f5d2b98eb2464c69c04764ab0f', class: "font-preview", style: {
18
18
  fontFamily: this.fontFamily,
19
19
  fontSize: `${this.size}px`,
20
20
  color: this.color