kritzel-stencil 0.4.9 → 0.4.10

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 (136) hide show
  1. package/dist/cjs/index.cjs.js +1 -1
  2. package/dist/cjs/kritzel-active-users_47.cjs.entry.js +61 -59
  3. package/dist/cjs/loader.cjs.js +1 -1
  4. package/dist/cjs/{schema.constants-ByNZ_qAj.js → schema.constants-C6PknABJ.js} +20 -6
  5. package/dist/cjs/stencil.cjs.js +1 -1
  6. package/dist/collection/components/core/kritzel-editor/kritzel-editor.js +14 -10
  7. package/dist/collection/components/core/kritzel-engine/kritzel-engine.js +1 -1
  8. package/dist/collection/components/core/kritzel-watermark/kritzel-watermark.js +1 -1
  9. package/dist/collection/components/shared/kritzel-avatar/kritzel-avatar.js +3 -3
  10. package/dist/collection/components/shared/kritzel-button/kritzel-button.js +2 -2
  11. package/dist/collection/components/shared/kritzel-color/kritzel-color.js +2 -2
  12. package/dist/collection/components/shared/kritzel-color-palette/kritzel-color-palette.js +1 -1
  13. package/dist/collection/components/shared/kritzel-font/kritzel-font.js +1 -1
  14. package/dist/collection/components/shared/kritzel-font-size/kritzel-font-size.js +1 -1
  15. package/dist/collection/components/shared/kritzel-input/kritzel-input.js +1 -1
  16. package/dist/collection/components/shared/kritzel-master-detail/kritzel-master-detail.js +3 -3
  17. package/dist/collection/components/shared/kritzel-menu/kritzel-menu.js +1 -1
  18. package/dist/collection/components/shared/kritzel-menu-item/kritzel-menu-item.js +2 -2
  19. package/dist/collection/components/shared/kritzel-numeric-input/kritzel-numeric-input.js +1 -1
  20. package/dist/collection/components/shared/kritzel-opacity-slider/kritzel-opacity-slider.js +1 -1
  21. package/dist/collection/components/shared/kritzel-portal/kritzel-portal.js +1 -1
  22. package/dist/collection/components/shared/kritzel-slide-toggle/kritzel-slide-toggle.js +1 -1
  23. package/dist/collection/components/shared/kritzel-split-button/kritzel-split-button.js +1 -1
  24. package/dist/collection/components/shared/kritzel-stroke-size/kritzel-stroke-size.js +1 -1
  25. package/dist/collection/components/shared/kritzel-sync-indicator/kritzel-sync-indicator.css +5 -5
  26. package/dist/collection/components/shared/kritzel-sync-indicator/kritzel-sync-indicator.js +1 -1
  27. package/dist/collection/components/shared/kritzel-tooltip/kritzel-tooltip.js +2 -2
  28. package/dist/collection/components/ui/kritzel-back-to-content/kritzel-back-to-content.js +1 -1
  29. package/dist/collection/components/ui/kritzel-controls/kritzel-controls.js +7 -7
  30. package/dist/collection/components/ui/kritzel-current-user/kritzel-current-user.js +2 -2
  31. package/dist/collection/components/ui/kritzel-current-user-dialog/kritzel-current-user-dialog.js +2 -2
  32. package/dist/collection/components/ui/kritzel-export/kritzel-export.js +2 -2
  33. package/dist/collection/components/ui/kritzel-loading-overlay/kritzel-loading-overlay.css +6 -6
  34. package/dist/collection/components/ui/kritzel-loading-overlay/kritzel-loading-overlay.js +1 -1
  35. package/dist/collection/components/ui/kritzel-login-dialog/kritzel-login-dialog.js +1 -1
  36. package/dist/collection/components/ui/kritzel-more-menu/kritzel-more-menu.js +2 -2
  37. package/dist/collection/components/ui/kritzel-settings/kritzel-settings.js +2 -2
  38. package/dist/collection/components/ui/kritzel-share-dialog/kritzel-share-dialog.js +3 -3
  39. package/dist/collection/components/ui/kritzel-tool-config/kritzel-tool-config.js +1 -1
  40. package/dist/collection/components/ui/kritzel-utility-panel/kritzel-utility-panel.js +2 -2
  41. package/dist/collection/components/ui/kritzel-workspace-manager/kritzel-workspace-manager.js +1 -1
  42. package/dist/collection/components/ui/kritzel-zoom-panel/kritzel-zoom-panel.js +2 -2
  43. package/dist/collection/constants/version.js +1 -1
  44. package/dist/collection/locales/de-locale.js +2 -2
  45. package/dist/collection/locales/en-locale.js +2 -2
  46. package/dist/collection/locales/fr-locale.js +2 -2
  47. package/dist/collection/themes/dark-theme.js +7 -0
  48. package/dist/collection/themes/light-theme.js +7 -0
  49. package/dist/components/index.js +3 -3
  50. package/dist/components/kritzel-active-users.js +1 -1
  51. package/dist/components/kritzel-avatar.js +1 -1
  52. package/dist/components/kritzel-awareness-cursors.js +1 -1
  53. package/dist/components/kritzel-back-to-content.js +1 -1
  54. package/dist/components/kritzel-button.js +1 -1
  55. package/dist/components/kritzel-color-palette.js +1 -1
  56. package/dist/components/kritzel-color.js +1 -1
  57. package/dist/components/kritzel-controls.js +1 -1
  58. package/dist/components/kritzel-current-user-dialog.js +1 -1
  59. package/dist/components/kritzel-current-user.js +1 -1
  60. package/dist/components/kritzel-editor.js +49 -45
  61. package/dist/components/kritzel-engine.js +1 -1
  62. package/dist/components/kritzel-export.js +1 -1
  63. package/dist/components/kritzel-font-size.js +1 -1
  64. package/dist/components/kritzel-font.js +1 -1
  65. package/dist/components/kritzel-input.js +1 -1
  66. package/dist/components/kritzel-loading-overlay.js +1 -1
  67. package/dist/components/kritzel-login-dialog.js +1 -1
  68. package/dist/components/kritzel-master-detail.js +1 -1
  69. package/dist/components/kritzel-menu-item.js +1 -1
  70. package/dist/components/kritzel-menu.js +1 -1
  71. package/dist/components/kritzel-more-menu.js +1 -1
  72. package/dist/components/kritzel-numeric-input.js +1 -1
  73. package/dist/components/kritzel-opacity-slider.js +1 -1
  74. package/dist/components/kritzel-portal.js +1 -1
  75. package/dist/components/kritzel-settings.js +1 -1
  76. package/dist/components/kritzel-share-dialog.js +1 -1
  77. package/dist/components/kritzel-slide-toggle.js +1 -1
  78. package/dist/components/kritzel-split-button.js +1 -1
  79. package/dist/components/kritzel-stroke-size.js +1 -1
  80. package/dist/components/kritzel-sync-indicator.js +1 -1
  81. package/dist/components/kritzel-tool-config.js +1 -1
  82. package/dist/components/kritzel-tooltip.js +1 -1
  83. package/dist/components/kritzel-utility-panel.js +1 -1
  84. package/dist/components/kritzel-watermark.js +1 -1
  85. package/dist/components/kritzel-workspace-manager.js +1 -1
  86. package/dist/components/kritzel-zoom-panel.js +1 -1
  87. package/dist/components/{p-8xkoVMfO.js → p-2WiGyky4.js} +2 -2
  88. package/dist/components/{p-DuVkk58V.js → p-30g2W_Gx.js} +3 -3
  89. package/dist/components/{p-DXcjIb_a.js → p-4SPnZZkH.js} +3 -3
  90. package/dist/components/{p-CURiiQfq.js → p-7I4Uzjrw.js} +14 -0
  91. package/dist/components/{p-9m1cAVwG.js → p-B-585egz.js} +3 -3
  92. package/dist/components/{p-dVfh-Sy9.js → p-BP6Fo3rt.js} +2 -2
  93. package/dist/components/{p-C2CeSrTm.js → p-BPsKYMH6.js} +1 -1
  94. package/dist/components/{p-BRGufCki.js → p-BX1aRLEi.js} +3 -3
  95. package/dist/components/{p-DW7WW4EN.js → p-B_lZQo3s.js} +3 -3
  96. package/dist/components/{p-oGAPPwAL.js → p-BoN700-O.js} +2 -2
  97. package/dist/components/{p-BzJEwFtn.js → p-BozrueXV.js} +1 -1
  98. package/dist/components/{p-6rQICkGr.js → p-Bvv1pGFD.js} +1 -1
  99. package/dist/components/{p-ZPPtEla5.js → p-C6e7eOEb.js} +15 -27
  100. package/dist/components/{p-CM1duewg.js → p-CAoN_STZ.js} +2 -2
  101. package/dist/components/{p-CVhcOiEA.js → p-CM65T33m.js} +3 -3
  102. package/dist/components/{p-8ScektIm.js → p-COylwYw1.js} +16 -16
  103. package/dist/components/{p-BYO6pz8T.js → p-CZ99VWQc.js} +1 -1
  104. package/dist/components/{p-DrQRChp3.js → p-CaBbajU2.js} +2 -2
  105. package/dist/components/{p-BzrxIesp.js → p-CrHvaLRV.js} +1 -1
  106. package/dist/components/{p-BqWiEmYI.js → p-D-UkGru5.js} +4 -4
  107. package/dist/components/{p-CoY7emAj.js → p-DB58Oa5V.js} +2 -2
  108. package/dist/components/{p-yD_3Z3K1.js → p-DBqoPgev.js} +1 -1
  109. package/dist/components/{p-DIMNEOTW.js → p-DKGg-76-.js} +1 -1
  110. package/dist/components/{p-DgnK50xO.js → p-DVXTPI71.js} +1 -1
  111. package/dist/components/{p-D7H8oxZb.js → p-DdabFzSa.js} +5 -5
  112. package/dist/components/{p-CMZ09rB1.js → p-Dt7-I2Xz.js} +3 -3
  113. package/dist/components/{p-CwuGA058.js → p-DtnMdWWB.js} +1 -1
  114. package/dist/components/{p-Cj0NElII.js → p-Dv4pZx8G.js} +1 -1
  115. package/dist/components/{p-BO9BvTtK.js → p-DwMqCX2P.js} +2 -2
  116. package/dist/components/{p-Cr2z2UBL.js → p-Dy3uucl_.js} +7 -7
  117. package/dist/components/{p-Ckm1Aq0V.js → p-GKmqCI8r.js} +2 -2
  118. package/dist/components/{p-DSOc0eIT.js → p-PjPPCHVL.js} +1 -1
  119. package/dist/components/{p-U9FjWrp-.js → p-ShJrZeyt.js} +1 -1
  120. package/dist/components/{p-lQ7nfhOy.js → p-bAacqNHq.js} +1 -1
  121. package/dist/components/{p-BU-FZuj0.js → p-vqEUQ-4Q.js} +3 -3
  122. package/dist/components/{p-CXJZxJvp.js → p-x3z0Cz1B.js} +3 -3
  123. package/dist/esm/index.js +2 -2
  124. package/dist/esm/kritzel-active-users_47.entry.js +61 -59
  125. package/dist/esm/loader.js +1 -1
  126. package/dist/esm/{schema.constants-1t45c2_U.js → schema.constants-C-oQbvCY.js} +20 -6
  127. package/dist/esm/stencil.js +1 -1
  128. package/dist/stencil/index.esm.js +2 -2
  129. package/dist/stencil/{p-1t45c2_U.js → p-C-oQbvCY.js} +20 -6
  130. package/dist/stencil/{p-f5f088ea.entry.js → p-be87f9d3.entry.js} +61 -59
  131. package/dist/stencil/stencil.esm.js +1 -1
  132. package/dist/types/components/core/kritzel-editor/kritzel-editor.d.ts +2 -0
  133. package/dist/types/constants/version.d.ts +1 -1
  134. package/dist/types/interfaces/localization.interface.d.ts +1 -1
  135. package/dist/types/interfaces/theme.interface.d.ts +11 -5
  136. package/package.json +1 -1
@@ -1,20 +1,20 @@
1
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-Cr2z2UBL.js';
4
- import { a as KritzelColorHelper } from './p-CURiiQfq.js';
5
- import { d as defineCustomElement$e } from './p-CMZ09rB1.js';
6
- import { d as defineCustomElement$d } from './p-9m1cAVwG.js';
3
+ import { K as KritzelToolConfigHelper, d as defineCustomElement$3 } from './p-Dy3uucl_.js';
4
+ import { a as KritzelColorHelper } from './p-7I4Uzjrw.js';
5
+ import { d as defineCustomElement$e } from './p-Dt7-I2Xz.js';
6
+ import { d as defineCustomElement$d } from './p-B-585egz.js';
7
7
  import { d as defineCustomElement$c } from './p-Df3BwVGy.js';
8
- import { d as defineCustomElement$b } from './p-DgnK50xO.js';
8
+ import { d as defineCustomElement$b } from './p-DVXTPI71.js';
9
9
  import { d as defineCustomElement$a } from './p-djJSnjAX.js';
10
- import { d as defineCustomElement$9 } from './p-8xkoVMfO.js';
10
+ import { d as defineCustomElement$9 } from './p-2WiGyky4.js';
11
11
  import { d as defineCustomElement$8 } from './p-CdR76C4L.js';
12
12
  import { d as defineCustomElement$7 } from './p-CXpv9Rxe.js';
13
- import { d as defineCustomElement$6 } from './p-BzrxIesp.js';
13
+ import { d as defineCustomElement$6 } from './p-CrHvaLRV.js';
14
14
  import { d as defineCustomElement$5 } from './p-BFYtCsZu.js';
15
- import { d as defineCustomElement$4 } from './p-Ckm1Aq0V.js';
16
- import { d as defineCustomElement$2 } from './p-DrQRChp3.js';
17
- import { d as defineCustomElement$1 } from './p-6rQICkGr.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-Bvv1pGFD.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: 'a72f9b1befd185b67d24f6d7a4987ebeb4d6742d', 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: '4e69324b23542878919119d10db98fc44b0dc536', 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: 'f4c7b461a433055512f5b6d397ab69d470531285', class: "kritzel-controls" }, h("div", { key: '53c27ef4ac2a9121f07ce91c82e63de5d7029de6', class: { 'scroll-indicator-left': true, 'visible': this.canScrollLeft } }), h("div", { key: '43d90c6031e164843dd43563d4fe75410b990278', 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: '9a8bd38a8266f1bb5feddcb4e396bb20c25512fa', 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: 'c889744c924d29f1e65cf67263be9ff708916610', class: { 'config-gradient-left': true, 'visible': this.needsScrolling } }), h("kritzel-tooltip", { key: '9df35a6967a9738e24d328865b07b50328cef811', anchorElement: this.host.shadowRoot?.querySelector('.kritzel-config-container'), triggerElement: this.configTriggerRef }, h("kritzel-tool-config", { key: '6f0079c879dc2ca5910193a02d19f246068d09e6', 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: 'a6af0ad5cc2fd0bbef0ade522f82ead53b30f92b', 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: '07a7fb2e0dc5c53a389da7f742322fdf489e0bd7', class: "color-container" }, h("kritzel-color", { key: '2987b76ca66d58a12ee71dd4c7d82a9c42480690', 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
  } })))))))));
@@ -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: '86a94bdc5bb02977214f999b7b880ce3193b6d8f' }, h("button", { key: '6a07c13c9986ebef6100140f7e702a1dfb5c2033', class: { 'back-to-content-button': true, visible: this.visible }, onClick: this.handleClick, "aria-label": this.text }, h("kritzel-icon", { key: 'ebadc99b15f2f015ada8795fa05a3a64ccac9cb5', 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", {
@@ -140,14 +140,14 @@ const KritzelTooltip = /*@__PURE__*/ proxyCustomElement(class KritzelTooltip ext
140
140
  }
141
141
  }
142
142
  render() {
143
- return (h(Host, { key: '227146703158aa65ecffcce348e568d559cee829', 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: '573e97ed81920066e8fbf50f790224c23b37ec21', class: "tooltip-content", onClick: event => event.stopPropagation(), onPointerDown: event => event.stopPropagation(), onMouseDown: event => event.stopPropagation() }, h("slot", { key: 'c489b45928cf6720c6827df73b9eedf08bc9d5e2' }))));
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": [{
@@ -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: '2dadd8a7c4d1af748e91a6005433288ab231f2e8' }, h("div", { key: '65ae90d95bffff244d97329754cf0cb8f73331fa', class: "opacity-container" }, h("div", { key: '90e95347f7015882112f0653a25347e715233227', class: "slider-wrapper" }, h("input", { key: '15836bc089c1725062016677d3b95384d1958431', 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,7 +1,7 @@
1
1
  import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
2
  import { d as defineCustomElement$3 } from './p-CdR76C4L.js';
3
3
  import { K as KritzelDevicesHelper } from './p-jGOpkGDl.js';
4
- import { d as defineCustomElement$2 } from './p-C2CeSrTm.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: '9d6653a630da5a3da38291d89d6d7d59d6994e02', 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: '48a1678296e672c6c03fb3e1473c42d3a246d481', 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: '27a90a3a8549517a2d6e341a5da13496bf714970', tabIndex: 0, onClick: e => e.stopPropagation() }, this.openChildMenuItem && h("div", { key: 'c0c2351fac389f6676b38481eaacee553ca6867a', 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,6 +1,6 @@
1
1
  import { p as proxyCustomElement, H, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
2
 
3
- const kritzelLoadingOverlayCss = () => `:host{display:contents}.loading-overlay{position:absolute;inset:0;z-index:var(--kritzel-loading-overlay-z-index, 9999);display:flex;align-items:center;justify-content:center;gap:10px;background-color:var(--kritzel-loading-overlay-background, rgba(255, 255, 255, 0.6));color:var(--kritzel-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-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-loading-overlay-spinner-color, #cccccc);border-top-color:var(--kritzel-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}}`;
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
 
5
5
  const KritzelLoadingOverlay = /*@__PURE__*/ proxyCustomElement(class KritzelLoadingOverlay extends H {
6
6
  constructor(registerHost) {
@@ -19,7 +19,7 @@ const KritzelLoadingOverlay = /*@__PURE__*/ proxyCustomElement(class KritzelLoad
19
19
  */
20
20
  text = 'Loading...';
21
21
  render() {
22
- return (h(Host, { key: 'ce2edf698db335518979f597ad32fa259c3055b9' }, h("div", { key: '7cf019929b72d18fdd1cea55157dc5b5fc2ea151', class: { 'loading-overlay': true, visible: this.visible }, "aria-hidden": this.visible ? 'false' : 'true' }, h("span", { key: '86b7cb040bcfb1abb2161a38f9cff153d5aa6c18', 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
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-DXcjIb_a.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
 
@@ -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: '8901e0b56ccbc344420483a4a56663f7cd74d9e8' }, h("div", { key: '5f3d6b5c56007e11383aa69f60f22031b0e8f332', class: "input-container" }, this.label && h("label", { key: '2cb102a5b6c16d068f4f304fbcc6241f79fc0ce8', class: "input-label" }, this.label), h("div", { key: '96441095acc3d9a8e77b6d2bac2ceda683c9c976', class: "input-wrapper" }, h("input", { key: '523a5485111077e20faded235df6362e5ea9cfd4', 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: '2071e98125a8d014513e93052bd8c1fee17932a5', class: "spinner-buttons" }, h("button", { key: '12422e5285dfb532dbbb6eb1a36dbcb3de50f2bc', type: "button", class: "spinner-button spinner-up", onClick: this.handleIncrement, tabIndex: -1, "aria-label": "Increase value" }, h("svg", { key: '49ad5625c80fae6706ba4ab91f47bd550481ef74', viewBox: "0 0 10 6", class: "spinner-icon" }, h("path", { key: 'ff7d19b61baeb5ba58bb60f2cc629bcec6eb4411', d: "M1 5L5 1L9 5", stroke: "currentColor", "stroke-width": "1.5", fill: "none", "stroke-linecap": "round", "stroke-linejoin": "round" }))), h("button", { key: 'e4fec28e4fc997e007127f2b30b00cc752433221', type: "button", class: "spinner-button spinner-down", onClick: this.handleDecrement, tabIndex: -1, "aria-label": "Decrease value" }, h("svg", { key: '27bf06cde8de11f4a97090911afd6b8993463112', viewBox: "0 0 10 6", class: "spinner-icon" }, h("path", { key: 'ed7071dd79bfe509ebb319ce43ecb3e982dd4157', 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": [{
@@ -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: '054371cac30a2433611139a670406b0a1e3b99ff' }, h("div", { key: 'b4f2142b3cb31d067f39952a38b6f665f28f63bf', 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
@@ -3,16 +3,16 @@ import { C as CURRENT_APP_STATE_SCHEMA_VERSION, a as CURRENT_WORKSPACE_SCHEMA_VE
3
3
  import { d as defineCustomElement$6 } from './p-DX2nriaq.js';
4
4
  import { d as defineCustomElement$5 } from './p-Df3BwVGy.js';
5
5
  import { d as defineCustomElement$4 } from './p-CdR76C4L.js';
6
- import { d as defineCustomElement$3 } from './p-CVhcOiEA.js';
7
- import { d as defineCustomElement$2 } from './p-DIMNEOTW.js';
8
- import { d as defineCustomElement$1 } from './p-BzJEwFtn.js';
6
+ import { d as defineCustomElement$3 } from './p-CM65T33m.js';
7
+ import { d as defineCustomElement$2 } from './p-DKGg-76-.js';
8
+ import { d as defineCustomElement$1 } from './p-BozrueXV.js';
9
9
 
10
10
  /**
11
11
  * The current version of the Kritzel library.
12
12
  * This file is auto-generated by the version bump scripts.
13
13
  * Do not modify manually.
14
14
  */
15
- const KRITZEL_VERSION = '0.4.9';
15
+ const KRITZEL_VERSION = '0.4.10';
16
16
 
17
17
  const kritzelSettingsCss = () => `:host{display:contents}kritzel-dialog{--kritzel-dialog-body-padding:0;--kritzel-dialog-width-large:800px;--kritzel-dialog-height-large:500px}.footer-button{padding:8px 16px;border-radius:6px;cursor:pointer;font-size:14px}.cancel-button{border:1px solid #ebebeb;background:#fff;color:inherit}.cancel-button:hover{background:#f5f5f5}.settings-tab-panel{display:none}.settings-tab-panel.is-active{display:block}.settings-content{padding:0}.settings-content h3{margin:0 0 16px 0;font-size:18px;font-weight:600;color:var(--kritzel-settings-content-heading-color, #333333)}.settings-content p{margin:0;font-size:14px;color:var(--kritzel-settings-content-text-color, #666666);line-height:1.5}.settings-group{display:flex;flex-direction:column;gap:24px}.settings-item{display:flex;flex-direction:column;gap:8px}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:16px}.settings-label{font-size:14px;font-weight:600;color:var(--kritzel-settings-label-color, #333333);margin:0 0 4px 0}.settings-description{font-size:12px;color:var(--kritzel-settings-description-color, #888888);margin:0;line-height:1.4}.shortcuts-list{display:flex;flex-direction:column;gap:24px}.shortcuts-category{display:flex;flex-direction:column;gap:8px}.shortcuts-category-title{font-size:14px;font-weight:600;color:var(--kritzel-settings-label-color, #333333);margin:0 0 4px 0}.shortcuts-group{display:flex;flex-direction:column;gap:4px}.shortcut-item{display:flex;justify-content:space-between;align-items:center;padding:6px 8px;border-radius:4px;background:var(--kritzel-settings-shortcut-item-bg, rgba(0, 0, 0, 0.02))}.shortcut-label{font-size:14px;color:var(--kritzel-settings-content-text-color, #666666)}.shortcut-key{font-family:monospace;font-size:12px;padding:2px 8px;border-radius:4px;background:var(--kritzel-settings-shortcut-key-bg, #f0f0f0);color:var(--kritzel-settings-shortcut-key-color, #333333);border:1px solid var(--kritzel-settings-shortcut-key-border, #ddd)}`;
18
18
 
@@ -228,7 +228,7 @@ const KritzelSettings = /*@__PURE__*/ proxyCustomElement(class KritzelSettings e
228
228
  return (h("div", { class: "settings-categories-wrapper" }, h("div", { class: { 'settings-tab-panel': true, 'is-active': this.selectedCategoryId === 'general' } }, h("div", { class: "settings-content" }, h("h3", null, this.t('settings.general.title', 'General Settings')), h("div", { class: "settings-group" }, h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.general.theme.label', 'Theme')), h("p", { class: "settings-description" }, this.t('settings.general.theme.description', 'Select a registered color theme for the editor interface.')), h("kritzel-dropdown", { options: this.availableThemes.map(t => ({ value: t, label: t })), value: this.theme, onValueChanged: this.handleThemeChange })), this.availableLocales.length > 0 && (h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.general.language.label', 'Language')), h("p", { class: "settings-description" }, this.t('settings.general.language.description', 'Select the display language for the editor interface.')), h("kritzel-dropdown", { options: this.availableLocales.map(l => ({ value: l.code, label: l.label })), value: this.locale, onValueChanged: this.handleLocaleChange }))), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.general.lockDrawingScale.label', 'Lock Drawing Scale')), h("p", { class: "settings-description" }, this.t('settings.general.lockDrawingScale.description', 'When enabled, drawn objects maintain a fixed visual size regardless of the current zoom level.')), h("kritzel-slide-toggle", { checked: this.lockDrawingScale, label: this.t('settings.general.lockDrawingScale.label', 'Lock Drawing Scale'), onCheckedChange: this.handleLockDrawingScaleChange }))))), h("div", { class: { 'settings-tab-panel': true, 'is-active': this.selectedCategoryId === 'viewport' } }, h("div", { class: "settings-content" }, h("h3", null, this.t('settings.viewport.title', 'Viewport Settings')), h("div", { class: "settings-group" }, h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.viewport.minZoom.label', 'Minimum Zoom Level')), h("p", { class: "settings-description" }, this.t('settings.viewport.minZoom.description', 'Sets the minimum zoom level. Lower values allow zooming out further to see more of the canvas.')), h("kritzel-numeric-input", { value: this.scaleMin, min: 0.0001, max: 1, step: 0.0001, onValueChange: this.handleScaleMinChange })), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.viewport.maxZoom.label', 'Maximum Zoom Level')), h("p", { class: "settings-description" }, this.t('settings.viewport.maxZoom.description', 'Sets the maximum zoom level. Higher values allow zooming in closer for detailed work.')), h("kritzel-numeric-input", { value: this.scaleMax, min: 1, max: 1000, step: 1, onValueChange: this.handleScaleMaxChange })), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.viewport.boundaryLeft.label', 'Viewport Boundary Left')), h("p", { class: "settings-description" }, this.t('settings.viewport.boundaryLeft.description', 'Left boundary in world coordinates. Set to limit how far left the viewport can pan.')), h("kritzel-numeric-input", { value: this.viewportBoundaryLeft, step: 100, placeholder: this.t('settings.viewport.boundaryPlaceholder', 'Infinite'), onValueChange: this.handleViewportBoundaryLeftChange })), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.viewport.boundaryRight.label', 'Viewport Boundary Right')), h("p", { class: "settings-description" }, this.t('settings.viewport.boundaryRight.description', 'Right boundary in world coordinates. Set to limit how far right the viewport can pan.')), h("kritzel-numeric-input", { value: this.viewportBoundaryRight, step: 100, placeholder: this.t('settings.viewport.boundaryPlaceholder', 'Infinite'), onValueChange: this.handleViewportBoundaryRightChange })), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.viewport.boundaryTop.label', 'Viewport Boundary Top')), h("p", { class: "settings-description" }, this.t('settings.viewport.boundaryTop.description', 'Top boundary in world coordinates. Set to limit how far up the viewport can pan.')), h("kritzel-numeric-input", { value: this.viewportBoundaryTop, step: 100, placeholder: this.t('settings.viewport.boundaryPlaceholder', 'Infinite'), onValueChange: this.handleViewportBoundaryTopChange })), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.viewport.boundaryBottom.label', 'Viewport Boundary Bottom')), h("p", { class: "settings-description" }, this.t('settings.viewport.boundaryBottom.description', 'Bottom boundary in world coordinates. Set to limit how far down the viewport can pan.')), h("kritzel-numeric-input", { value: this.viewportBoundaryBottom, step: 100, placeholder: this.t('settings.viewport.boundaryPlaceholder', 'Infinite'), onValueChange: this.handleViewportBoundaryBottomChange }))))), h("div", { class: { 'settings-tab-panel': true, 'is-active': this.selectedCategoryId === 'shortcuts' } }, h("div", { class: "settings-content" }, h("h3", null, this.t('settings.shortcuts.title', 'Keyboard Shortcuts')), h("div", { class: "shortcuts-list" }, Array.from(this.groupShortcutsByCategory()).map(([category, shortcuts]) => (h("div", { class: "shortcuts-category", key: category }, h("h4", { class: "shortcuts-category-title" }, category), h("div", { class: "shortcuts-group" }, shortcuts.map(shortcut => (h("div", { class: "shortcut-item", key: shortcut.key + shortcut.label }, h("span", { class: "shortcut-label" }, shortcut.label), h("kbd", { class: "shortcut-key" }, this.formatKeyCombo(shortcut)))))))))))), h("div", { class: { 'settings-tab-panel': true, 'is-active': this.selectedCategoryId === 'developer' } }, h("div", { class: "settings-content" }, h("h3", null, this.t('settings.developer.title', 'Developer Options')), h("div", { class: "settings-group" }, h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.developer.showViewportInfo.label', 'Show Viewport Info')), h("p", { class: "settings-description" }, this.t('settings.developer.showViewportInfo.description', 'Display viewport debug information such as position, zoom level, and boundaries.')), h("kritzel-slide-toggle", { checked: this.debugInfo.showViewportInfo, label: this.t('settings.developer.showViewportInfo.label', 'Show Viewport Info'), onCheckedChange: this.handleDebugInfoChange('showViewportInfo') })), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.developer.showObjectInfo.label', 'Show Object Info')), h("p", { class: "settings-description" }, this.t('settings.developer.showObjectInfo.description', 'Display debug information about objects on the canvas.')), h("kritzel-slide-toggle", { checked: this.debugInfo.showObjectInfo, label: this.t('settings.developer.showObjectInfo.label', 'Show Object Info'), onCheckedChange: this.handleDebugInfoChange('showObjectInfo') })), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.developer.showSyncProviderInfo.label', 'Show Sync Provider Info')), h("p", { class: "settings-description" }, this.t('settings.developer.showSyncProviderInfo.description', 'Display debug information about the sync provider connection status.')), h("kritzel-slide-toggle", { checked: this.debugInfo.showSyncProviderInfo, label: this.t('settings.developer.showSyncProviderInfo.label', 'Show Sync Provider Info'), onCheckedChange: this.handleDebugInfoChange('showSyncProviderInfo') })), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.developer.showMigrationInfo.label', 'Show Migration Info')), h("p", { class: "settings-description" }, this.t('settings.developer.showMigrationInfo.description', 'Display debug information about data migrations.')), h("kritzel-slide-toggle", { checked: this.debugInfo.showMigrationInfo, label: this.t('settings.developer.showMigrationInfo.label', 'Show Migration Info'), onCheckedChange: this.handleDebugInfoChange('showMigrationInfo') }))))), h("div", { class: { 'settings-tab-panel': true, 'is-active': this.selectedCategoryId === 'about' } }, h("div", { class: "settings-content" }, h("h3", null, this.t('settings.about.title', 'About')), h("p", null, this.t('settings.about.description', 'Kritzel - A drawing application')), h("p", { class: "version-info" }, "Version ", KRITZEL_VERSION), h("p", { class: "version-info" }, "App-State Schema v", CURRENT_APP_STATE_SCHEMA_VERSION), h("p", { class: "version-info" }, "Workspace Schema v", CURRENT_WORKSPACE_SCHEMA_VERSION)))));
229
229
  }
230
230
  render() {
231
- return (h(Host, { key: 'b8a899abd3dd55bc3493b7d124ac5505e2284036' }, h("kritzel-dialog", { key: '8d47f3548271e24a8a280a30139f04b2e4b4ec2b', isOpen: this.isDialogOpen, dialogTitle: this.t('settings.dialogTitle', 'Settings'), size: "large", contained: true, onDialogClose: this.closeDialog }, h("kritzel-master-detail", { key: 'a5213307761b84b8f5f67cb35409ab1c0c1fa57b', items: this.categories, selectedItemId: this.selectedCategoryId, onItemSelect: this.handleCategorySelect }, this.renderCategoryContent()))));
231
+ return (h(Host, { key: '71f8a12325a781212dd6f2c8b794563fcb4eee64' }, h("kritzel-dialog", { key: '1abe7c1dedcf79433a95d60dadce342f46e62c3a', isOpen: this.isDialogOpen, dialogTitle: this.t('settings.dialogTitle', 'Settings'), size: "large", contained: true, onDialogClose: this.closeDialog }, h("kritzel-master-detail", { key: '9e8b3a11d97c1a10c6693434eb2e8bfc1d3fda7d', items: this.categories, selectedItemId: this.selectedCategoryId, onItemSelect: this.handleCategorySelect }, this.renderCategoryContent()))));
232
232
  }
233
233
  static get watchers() { return {
234
234
  "settings": [{
@@ -1,5 +1,5 @@
1
1
  import { p as proxyCustomElement, H, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
- import { a as KritzelColorHelper } from './p-CURiiQfq.js';
2
+ import { a as KritzelColorHelper } from './p-7I4Uzjrw.js';
3
3
 
4
4
  const kritzelColorCss = () => `:host{display:flex}.checkerboard-bg{background:repeating-conic-gradient( var(--kritzel-checkerboard-color-dark, #ccc) 0% 25%, var(--kritzel-checkerboard-color-light, #fff) 0% 50% ) 50% / 8px 8px;position:relative;overflow:hidden}.color-circle{width:24px;height:24px;border-radius:50%;box-sizing:border-box;display:block}.color-circle.white{border:1px solid var(--kritzel-color-palette-circle-border-color, #dddcdc)}`;
5
5
 
@@ -48,13 +48,13 @@ const KritzelColorComponent = /*@__PURE__*/ proxyCustomElement(class KritzelColo
48
48
  render() {
49
49
  const resolvedColor = this.resolveColor();
50
50
  const isColorVeryLight = this.isLightColor(resolvedColor);
51
- return (h(Host, { key: 'e39c77c55942b9c615e404efabf4939b2cf05a34' }, h("div", { key: 'ac343295592ea80ca7d3da61ca1244dd1aaa50db', class: "checkerboard-bg", style: {
51
+ return (h(Host, { key: 'e797bfa6a2aed82d1913ec2f02f8b25a063564e5' }, h("div", { key: '5b62fcdbb2985b90fe0d7c7b65b507ec1c55e240', class: "checkerboard-bg", style: {
52
52
  width: `${this.size}px`,
53
53
  height: `${this.size}px`,
54
54
  borderRadius: '50%',
55
55
  display: 'inline-block',
56
56
  position: 'relative',
57
- } }, h("div", { key: '4c87934b3febd4c41874cd290d86a9a9a557e3e5', class: {
57
+ } }, h("div", { key: '2d62717ebf81be93219ebda7071c0ba992d7441a', class: {
58
58
  'color-circle': true,
59
59
  'white': isColorVeryLight,
60
60
  }, style: {
@@ -25,7 +25,7 @@ const KritzelWatermark = /*@__PURE__*/ proxyCustomElement(class KritzelWatermark
25
25
  label;
26
26
  render() {
27
27
  const label = this.label ?? this.core.localizationManager.translate('watermark.poweredBy');
28
- return (h(Host, { key: '0eccc75e51c7ac199e23d8f3a871593f1fb65a17' }, h("a", { key: '2029f8b56ba8609ca621447eac0df9d30ebfbbbe', class: "watermark-link", href: KRITZEL_WEBSITE_URL, target: "_blank", rel: "noopener noreferrer", part: "watermark", onPointerDown: (ev) => ev.stopPropagation(), onPointerUp: (ev) => ev.stopPropagation() }, label)));
28
+ return (h(Host, { key: 'ae00d98f16912afcb7a90d47a9fc4d55fc7468f0' }, h("a", { key: '8781f94c9efe44b0e7a7a8c20a119160cb9feb8e', class: "watermark-link", href: KRITZEL_WEBSITE_URL, target: "_blank", rel: "noopener noreferrer", part: "watermark", onPointerDown: (ev) => ev.stopPropagation(), onPointerUp: (ev) => ev.stopPropagation() }, label)));
29
29
  }
30
30
  static get style() { return kritzelWatermarkCss(); }
31
31
  }, [513, "kritzel-watermark", {
@@ -53,7 +53,7 @@ const KritzelLoginDialog = /*@__PURE__*/ proxyCustomElement(class KritzelLoginDi
53
53
  this.dialogClosed.emit();
54
54
  };
55
55
  render() {
56
- return (h(Host, { key: '561b4e76017e71d99f05cd33ed9f6e3769bb9aec' }, h("kritzel-dialog", { key: '74b904f67496debebf7a1854e3e3dd193f14a445', dialogTitle: this.dialogTitle, isOpen: this.isDialogOpen, onDialogClose: this.closeDialog, size: "small", contained: true }, h("div", { key: 'dcc2a024349fcdfcad7c7c6d5b7754e5ae990ae3', class: "login-content" }, this.subtitle && (h("p", { key: 'fdc927c84294a2ac92aec90001c3da373cc5f082', class: "login-subtitle" }, this.subtitle)), h("div", { key: 'a6e74ff9b3211df195b05edd2be0ce69d1b128df', class: "login-providers" }, this.providers.map(provider => (h("button", { key: provider.name, class: {
56
+ return (h(Host, { key: '97532a2eeb125a2692117228ec3c77907c90d021' }, h("kritzel-dialog", { key: '60597c3d75f532a3c73aab983bed683bea243eac', dialogTitle: this.dialogTitle, isOpen: this.isDialogOpen, onDialogClose: this.closeDialog, size: "small", contained: true }, h("div", { key: 'cb086e90c5981f8c3d5fc65e7b94675884a255dc', class: "login-content" }, this.subtitle && (h("p", { key: '0ac0e31a5bf8d8a3e24b7df1d388f1cdc6951bd7', class: "login-subtitle" }, this.subtitle)), h("div", { key: '6057615670a1758581d0c518bb2809b88af0672e', class: "login-providers" }, this.providers.map(provider => (h("button", { key: provider.name, class: {
57
57
  'provider-button': true,
58
58
  'is-loading': this.loadingProvider === provider.name,
59
59
  'is-disabled': this.loadingProvider !== null && this.loadingProvider !== provider.name,
@@ -1,5 +1,5 @@
1
1
  import { p as proxyCustomElement, H, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
- import { d as defineCustomElement$1 } from './p-DXcjIb_a.js';
2
+ import { d as defineCustomElement$1 } from './p-4SPnZZkH.js';
3
3
 
4
4
  const kritzelCurrentUserCss = () => `:host{display:inline-flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent}kritzel-avatar{cursor:var(--kritzel-global-pointer-cursor, pointer);border-radius:50%}`;
5
5
 
@@ -22,7 +22,7 @@ const KritzelCurrentUser = /*@__PURE__*/ proxyCustomElement(class KritzelCurrent
22
22
  /** Resolved localized strings keyed by term key, supplied by the editor. */
23
23
  terms = {};
24
24
  render() {
25
- return (h(Host, { key: '3c23677e98ba459144fafde994dc66a14068c5b1' }, h("kritzel-avatar", { key: 'e5c04bf871f7808ab0e380770a2a94ddab8eac83', user: this.user, size: this.avatarSize })));
25
+ return (h(Host, { key: '19551eb12507f1384aedf3ca4ce5212eca509c24' }, h("kritzel-avatar", { key: 'e39405e8e6c2e77a8acf5f286fa3890e28e8ab17', user: this.user, size: this.avatarSize })));
26
26
  }
27
27
  static get style() { return kritzelCurrentUserCss(); }
28
28
  }, [513, "kritzel-current-user", {
@@ -1,17 +1,17 @@
1
1
  import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
- import { a as KritzelColorHelper } from './p-CURiiQfq.js';
2
+ import { a as KritzelColorHelper } from './p-7I4Uzjrw.js';
3
3
  import { r as resolveTextToolAvailableFonts, K as KritzelFontRegistry } from './p-DJkKlUyZ.js';
4
- import { d as defineCustomElement$b } from './p-CMZ09rB1.js';
5
- import { d as defineCustomElement$a } from './p-9m1cAVwG.js';
4
+ import { d as defineCustomElement$b } from './p-Dt7-I2Xz.js';
5
+ import { d as defineCustomElement$a } from './p-B-585egz.js';
6
6
  import { d as defineCustomElement$9 } from './p-Df3BwVGy.js';
7
- import { d as defineCustomElement$8 } from './p-DgnK50xO.js';
7
+ import { d as defineCustomElement$8 } from './p-DVXTPI71.js';
8
8
  import { d as defineCustomElement$7 } from './p-djJSnjAX.js';
9
- import { d as defineCustomElement$6 } from './p-8xkoVMfO.js';
9
+ import { d as defineCustomElement$6 } from './p-2WiGyky4.js';
10
10
  import { d as defineCustomElement$5 } from './p-CdR76C4L.js';
11
11
  import { d as defineCustomElement$4 } from './p-CXpv9Rxe.js';
12
- import { d as defineCustomElement$3 } from './p-BzrxIesp.js';
12
+ import { d as defineCustomElement$3 } from './p-CrHvaLRV.js';
13
13
  import { d as defineCustomElement$2 } from './p-BFYtCsZu.js';
14
- import { d as defineCustomElement$1 } from './p-Ckm1Aq0V.js';
14
+ import { d as defineCustomElement$1 } from './p-GKmqCI8r.js';
15
15
 
16
16
  class KritzelToolConfigHelper {
17
17
  static getToolConfig(tool) {
@@ -1,5 +1,5 @@
1
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-CMZ09rB1.js';
2
+ import { d as defineCustomElement$1 } from './p-Dt7-I2Xz.js';
3
3
 
4
4
  const kritzelStrokeSizeCss = () => `:host{display:flex;align-items:flex-start;gap:0;padding:0;width:100%;box-sizing:border-box}.size-grid{width:100%;display:grid;grid-template-columns:repeat(auto-fill, 32px);gap:8px;justify-items:center}.size-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}.size-container:hover{background-color:var(--kritzel-stroke-size-hover-background-color, #ebebeb)}.size-container.selected{border-color:var(--kritzel-selection-border-color, #007AFF);background-color:var(--kritzel-stroke-size-selected-background-color, #ebebeb)}`;
5
5
 
@@ -21,7 +21,7 @@ const KritzelStrokeSize = /*@__PURE__*/ proxyCustomElement(class KritzelStrokeSi
21
21
  }
22
22
  render() {
23
23
  const sizes = this.sizes ?? [];
24
- return (h(Host, { key: 'ba181d798d2bf7b60308746635d2077ce1353b83' }, h("div", { key: '048fc8934190359b9337747567844ca88925a6ce', class: "size-grid" }, sizes.map(size => (h("div", { tabIndex: 0, class: {
24
+ return (h(Host, { key: 'c0307e527e6f9d5d663ae3f8f605162cdde2a339' }, h("div", { key: '9533e0486f8078d25b7e8fc3323126d77700ac72', class: "size-grid" }, sizes.map(size => (h("div", { tabIndex: 0, class: {
25
25
  'size-container': true,
26
26
  'selected': this.selectedSize === size,
27
27
  }, onClick: () => this.handleSizeClick(size) }, h("kritzel-color", { value: 'var(--kritzel-global-text-primary)', size: size })))))));
@@ -39,7 +39,7 @@ const KritzelInput = /*@__PURE__*/ proxyCustomElement(class KritzelInput extends
39
39
  this.valueChange.emit(input.value);
40
40
  };
41
41
  render() {
42
- return (h(Host, { key: '46a0a48902a06ad85edcbaad3679ce3fe9ba850c' }, h("div", { key: 'a6beaf920614aa959d2fbd68b7268afba8637358', class: "input-container" }, this.label && h("label", { key: 'ca6d3fb3c22f1540795dbb0695ddd9b87cc05eee', class: "input-label" }, this.label), h("div", { key: '78d116e82531a9cca996d594792245449bcaf9c8', class: { 'input-wrapper': true, 'has-suffix': !!this.suffix } }, h("input", { key: '0d10d6356dea3a11338172bbe8c3c878eefcc708', type: this.type, class: "text-input", value: this.inputValue, placeholder: this.placeholder, disabled: this.disabled, onInput: this.handleInput }), this.suffix && h("span", { key: '0e6166ba8728efc1035302d7fb048306efbe5a68', class: "input-suffix" }, this.suffix)))));
42
+ return (h(Host, { key: 'a4d86101322da32c87a62ac8bb05edb7015ede2a' }, h("div", { key: 'abc5b007af0f6f9353e0b680636c92813ee1ef49', class: "input-container" }, this.label && h("label", { key: 'f79e02a925aa6bd1b6cd48fc4225e441695ff893', class: "input-label" }, this.label), h("div", { key: 'e2937d2ad1def996e1937a9dd711578a3f9b6494', class: { 'input-wrapper': true, 'has-suffix': !!this.suffix } }, h("input", { key: '8bc45cc6f2603bec30f2299286d03beacd8c07fb', type: this.type, class: "text-input", value: this.inputValue, placeholder: this.placeholder, disabled: this.disabled, onInput: this.handleInput }), this.suffix && h("span", { key: '917fb6fa6c5fe62ab0f1e5c83f09aedd22623353', class: "input-suffix" }, this.suffix)))));
43
43
  }
44
44
  static get watchers() { return {
45
45
  "value": [{
@@ -39,7 +39,7 @@ const KritzelZoomPanel = /*@__PURE__*/ proxyCustomElement(class KritzelZoomPanel
39
39
  return Number.isFinite(this.zoomPercent) ? Math.max(1, Math.round(this.zoomPercent)) : 100;
40
40
  }
41
41
  render() {
42
- return (h(Host, { key: 'aa4a0194b7ba89a32e369ae5ce9a8c148c05574f' }, h("div", { key: 'c88d4b299210d2aff28e07815bcbd4864ff13afd', class: { panel: true, visible: this.visible } }, h("button", { key: 'bf2c78d32ba31c25dcfed0b1f87fbfaee776acc1', class: "zoom-button", type: "button", "aria-label": this.terms['zoom.zoomOut'] ?? 'Zoom out', disabled: this.disabled, onClick: this.handleZoomOut }, h("kritzel-icon", { key: '3d350d003ed9d0b4548929d0765aae5da82c41b0', name: "minus" })), h("span", { key: 'da6454d4c28b5bdde41300c21b6593d91ce08085', class: "zoom-level", "aria-live": "polite" }, this.normalizedZoomPercent, "%"), h("button", { key: 'cf314fb20dcff5b3e728eae2129978cb12942947', class: "zoom-button", type: "button", "aria-label": this.terms['zoom.zoomIn'] ?? 'Zoom in', disabled: this.disabled, onClick: this.handleZoomIn }, h("kritzel-icon", { key: '71ca263815fd1774d5511118d8217863adcac64b', name: "plus" })))));
42
+ return (h(Host, { key: 'ac5b3f37fbc298b1522f0ff80c26734164b5358a' }, h("div", { key: '8ac3f3600c45c064d9c4c4c9efa78397790edf4b', class: { panel: true, visible: this.visible } }, h("button", { key: '63b2a3fce804a310146d95cc9c2a874707f9e265', class: "zoom-button", type: "button", "aria-label": this.terms['zoom.zoomOut'] ?? 'Zoom out', disabled: this.disabled, onClick: this.handleZoomOut }, h("kritzel-icon", { key: '86ebb85dfc2b746cedd0ed63cd2ae90378f6bbb8', name: "minus" })), h("span", { key: '5191cc1aa9966234c1634882af145403acd32211', class: "zoom-level", "aria-live": "polite" }, this.normalizedZoomPercent, "%"), h("button", { key: '47a7ee5b6c1cf1c99cd1826877e0a1c4ce224442', class: "zoom-button", type: "button", "aria-label": this.terms['zoom.zoomIn'] ?? 'Zoom in', disabled: this.disabled, onClick: this.handleZoomIn }, h("kritzel-icon", { key: '09782e094534fbc5bbcc612f24eea359568d6132', name: "plus" })))));
43
43
  }
44
44
  static get style() { return kritzelZoomPanelCss(); }
45
45
  }, [513, "kritzel-zoom-panel", {
@@ -1,6 +1,6 @@
1
1
  import { p as proxyCustomElement, H, h, d as Host, t as transformTag } from './p-B43upypT.js';
2
2
  import { O as ObjectHelper } from './p-DPONTran.js';
3
- import { a as KritzelColorHelper } from './p-CURiiQfq.js';
3
+ import { a as KritzelColorHelper } from './p-7I4Uzjrw.js';
4
4
 
5
5
  class KritzelGeometryHelper {
6
6
  static doPolygonsIntersect(polygon1, polygon2) {
@@ -1,6 +1,6 @@
1
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-DXcjIb_a.js';
3
- import { d as defineCustomElement$2 } from './p-oGAPPwAL.js';
2
+ import { d as defineCustomElement$3 } from './p-4SPnZZkH.js';
3
+ import { d as defineCustomElement$2 } from './p-BoN700-O.js';
4
4
  import { d as defineCustomElement$1 } from './p-DX2nriaq.js';
5
5
 
6
6
  const kritzelCurrentUserDialogCss = () => `:host{display:contents}kritzel-dialog{--kritzel-dialog-width-small:380px}.user-info{display:flex;flex-direction:column;align-items:center;gap:8px;padding:8px 0}.user-name{font-size:18px;font-weight:600;color:var(--kritzel-current-user-dialog-name-color, #333333);text-align:center;margin-top:8px}.user-email{font-size:14px;color:var(--kritzel-current-user-dialog-email-color, #666666);text-align:center}.logout-button{margin-top:16px;width:100%;--kritzel-button-width:100%;--kritzel-button-primary-background-color:var(--kritzel-current-user-dialog-logout-button-background-color, #007AFF);--kritzel-button-primary-hover-background-color:var(--kritzel-current-user-dialog-logout-button-hover-background-color, #006ae6);--kritzel-button-primary-active-background-color:var(--kritzel-current-user-dialog-logout-button-active-background-color, #005bbf);--kritzel-button-primary-color:var(--kritzel-current-user-dialog-logout-button-color, #ffffff)}`;
@@ -43,7 +43,7 @@ const KritzelCurrentUserDialog = /*@__PURE__*/ proxyCustomElement(class KritzelC
43
43
  }
44
44
  render() {
45
45
  const displayName = this.getDisplayName();
46
- return (h(Host, { key: 'd5be0723f615c45bac897d4f2a2ebe5c67b4769c' }, h("kritzel-dialog", { key: '4de42a3df3d18f96ddfbc362c05e98ade4aeaaf8', dialogTitle: this.terms['currentUser.dialogTitle'] ?? 'Account', isOpen: this.isDialogOpen, onDialogClose: this.closeDialog, size: "small", contained: true }, h("div", { key: '7908d833617b67a6663e41fd91599356ab66619b', class: "user-info" }, h("kritzel-avatar", { key: '93fd9ddb633ad9ad7e17a7c4292861b86ef132f1', user: this.user, size: 80 }), displayName && h("div", { key: 'dff873e3c8b643e7a52f212a3e00167adc301cf7', class: "user-name" }, displayName), this.user?.email && h("div", { key: '7b30a9930cd454ca040181cb11c1d000e408bfc8', class: "user-email" }, this.user.email), h("kritzel-button", { key: '04ea8cbadd90b149ee8f5bbac071040b74eb12b3', class: "logout-button", variant: "primary", onButtonClick: this.handleLogout }, this.terms['menu.logout'] ?? 'Logout')))));
46
+ return (h(Host, { key: '8f8e63ac6f789f2d0ee43b8b7439634411a91ac9' }, h("kritzel-dialog", { key: '4022a7251881f669f290e0a8beb9a39ef6242b19', dialogTitle: this.terms['currentUser.dialogTitle'] ?? 'Account', isOpen: this.isDialogOpen, onDialogClose: this.closeDialog, size: "small", contained: true }, h("div", { key: '4671f884c121cfaefdd8a47bd52b30acc2d7b345', class: "user-info" }, h("kritzel-avatar", { key: 'a1847b4b67302f3b7179e4e2b751f7f2106b76d4', user: this.user, size: 80 }), displayName && h("div", { key: 'b3d09b4c99d76014a2e36260edce52c39f1081e1', class: "user-name" }, displayName), this.user?.email && h("div", { key: 'a76ce19cbd24ad536b022264dab6a83f4d1b36c2', class: "user-email" }, this.user.email), h("kritzel-button", { key: 'f125164a9d9362eedfbfff4fc2629f7ec055fc14', class: "logout-button", variant: "primary", onButtonClick: this.handleLogout }, this.terms['menu.logout'] ?? 'Logout')))));
47
47
  }
48
48
  static get style() { return kritzelCurrentUserDialogCss(); }
49
49
  }, [513, "kritzel-current-user-dialog", {
@@ -2,9 +2,9 @@ import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transf
2
2
  import { K as KritzelWorkspace } from './p-DAwPPDMS.js';
3
3
  import { O as ObjectHelper } from './p-DPONTran.js';
4
4
  import { d as defineCustomElement$5 } from './p-CdR76C4L.js';
5
- import { d as defineCustomElement$3, a as defineCustomElement$4 } from './p-BqWiEmYI.js';
6
- import { d as defineCustomElement$2 } from './p-C2CeSrTm.js';
7
- import { d as defineCustomElement$1 } from './p-DuVkk58V.js';
5
+ import { d as defineCustomElement$3, a as defineCustomElement$4 } from './p-D-UkGru5.js';
6
+ import { d as defineCustomElement$2 } from './p-BPsKYMH6.js';
7
+ import { d as defineCustomElement$1 } from './p-30g2W_Gx.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
 
package/dist/esm/index.js CHANGED
@@ -1,5 +1,5 @@
1
- import { H as HocuspocusProvider, a as HocuspocusProviderWebsocket } from './schema.constants-1t45c2_U.js';
2
- export { P as APP_STATE_MIGRATIONS, A as AssetNotFoundError, R as CURRENT_APP_STATE_SCHEMA_VERSION, T as CURRENT_WORKSPACE_SCHEMA_VERSION, E as DEFAULT_ASSET_STORAGE_CONFIG, D as DEFAULT_BRUSH_CONFIG, C as DEFAULT_LINE_TOOL_CONFIG, B as DEFAULT_TEXT_CONFIG, L as DE_LOCALE, J as EN_LOCALE, M as FR_LOCALE, I as IndexedDBAssetProvider, N as KritzelAlignment, t as KritzelAnchorManager, r as KritzelAssetResolver, K as KritzelBaseObject, i as KritzelBaseTool, j as KritzelBrushTool, p as KritzelCursorHelper, h as KritzelCustomElement, x as KritzelCustomElementRendererRegistry, l as KritzelEraserTool, y as KritzelFontRegistry, f as KritzelGroup, d as KritzelImage, m as KritzelImageTool, w as KritzelLicenseManager, e as KritzelLine, k as KritzelLineTool, v as KritzelLocalizationManager, c as KritzelPath, q as KritzelSelectionTool, g as KritzelShape, o as KritzelShapeTool, b as KritzelText, n as KritzelTextTool, u as KritzelThemeManager, s as KritzelWorkspace, S as ShapeType, W as WORKSPACE_EXPORT_VERSION, Q as WORKSPACE_MIGRATIONS, G as darkTheme, z as hasRemoteSyncProvider, F as lightTheme, O as runMigrations } from './schema.constants-1t45c2_U.js';
1
+ import { H as HocuspocusProvider, a as HocuspocusProviderWebsocket } from './schema.constants-C-oQbvCY.js';
2
+ export { P as APP_STATE_MIGRATIONS, A as AssetNotFoundError, R as CURRENT_APP_STATE_SCHEMA_VERSION, T as CURRENT_WORKSPACE_SCHEMA_VERSION, E as DEFAULT_ASSET_STORAGE_CONFIG, D as DEFAULT_BRUSH_CONFIG, C as DEFAULT_LINE_TOOL_CONFIG, B as DEFAULT_TEXT_CONFIG, L as DE_LOCALE, J as EN_LOCALE, M as FR_LOCALE, I as IndexedDBAssetProvider, N as KritzelAlignment, t as KritzelAnchorManager, r as KritzelAssetResolver, K as KritzelBaseObject, i as KritzelBaseTool, j as KritzelBrushTool, p as KritzelCursorHelper, h as KritzelCustomElement, x as KritzelCustomElementRendererRegistry, l as KritzelEraserTool, y as KritzelFontRegistry, f as KritzelGroup, d as KritzelImage, m as KritzelImageTool, w as KritzelLicenseManager, e as KritzelLine, k as KritzelLineTool, v as KritzelLocalizationManager, c as KritzelPath, q as KritzelSelectionTool, g as KritzelShape, o as KritzelShapeTool, b as KritzelText, n as KritzelTextTool, u as KritzelThemeManager, s as KritzelWorkspace, S as ShapeType, W as WORKSPACE_EXPORT_VERSION, Q as WORKSPACE_MIGRATIONS, G as darkTheme, z as hasRemoteSyncProvider, F as lightTheme, O as runMigrations } from './schema.constants-C-oQbvCY.js';
3
3
  import * as Y from 'yjs';
4
4
  import { IndexeddbPersistence } from 'y-indexeddb';
5
5
  import { WebsocketProvider } from 'y-websocket';