kritzel-stencil 0.3.41 → 0.3.44
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/kritzel-active-users_46.cjs.entry.js +57 -68
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/stencil.cjs.js +1 -1
- package/dist/collection/components/core/kritzel-editor/kritzel-editor.js +9 -16
- package/dist/collection/components/core/kritzel-engine/kritzel-engine.css +0 -7
- package/dist/collection/components/core/kritzel-engine/kritzel-engine.js +4 -10
- package/dist/collection/components/core/kritzel-watermark/kritzel-watermark.js +1 -1
- package/dist/collection/components/shared/kritzel-avatar/kritzel-avatar.js +3 -3
- package/dist/collection/components/shared/kritzel-button/kritzel-button.js +2 -2
- package/dist/collection/components/shared/kritzel-color/kritzel-color.js +2 -2
- package/dist/collection/components/shared/kritzel-color-palette/kritzel-color-palette.js +1 -1
- package/dist/collection/components/shared/kritzel-font/kritzel-font.js +1 -1
- package/dist/collection/components/shared/kritzel-font-size/kritzel-font-size.js +1 -1
- package/dist/collection/components/shared/kritzel-input/kritzel-input.js +1 -1
- package/dist/collection/components/shared/kritzel-master-detail/kritzel-master-detail.js +3 -3
- package/dist/collection/components/shared/kritzel-menu/kritzel-menu.js +1 -1
- package/dist/collection/components/shared/kritzel-menu-item/kritzel-menu-item.js +2 -2
- package/dist/collection/components/shared/kritzel-numeric-input/kritzel-numeric-input.js +1 -1
- package/dist/collection/components/shared/kritzel-opacity-slider/kritzel-opacity-slider.js +1 -1
- package/dist/collection/components/shared/kritzel-portal/kritzel-portal.js +1 -1
- package/dist/collection/components/shared/kritzel-slide-toggle/kritzel-slide-toggle.js +1 -1
- package/dist/collection/components/shared/kritzel-split-button/kritzel-split-button.js +1 -1
- package/dist/collection/components/shared/kritzel-stroke-size/kritzel-stroke-size.js +1 -1
- package/dist/collection/components/shared/kritzel-tooltip/kritzel-tooltip.js +2 -2
- package/dist/collection/components/ui/kritzel-back-to-content/kritzel-back-to-content.js +1 -1
- package/dist/collection/components/ui/kritzel-controls/kritzel-controls.js +6 -6
- package/dist/collection/components/ui/kritzel-current-user/kritzel-current-user.js +1 -1
- package/dist/collection/components/ui/kritzel-current-user-dialog/kritzel-current-user-dialog.js +1 -1
- package/dist/collection/components/ui/kritzel-export/kritzel-export.js +1 -1
- package/dist/collection/components/ui/kritzel-loading-overlay/kritzel-loading-overlay.js +1 -1
- package/dist/collection/components/ui/kritzel-login-dialog/kritzel-login-dialog.js +1 -1
- package/dist/collection/components/ui/kritzel-more-menu/kritzel-more-menu.js +1 -1
- package/dist/collection/components/ui/kritzel-settings/kritzel-settings.js +1 -1
- package/dist/collection/components/ui/kritzel-share-dialog/kritzel-share-dialog.js +2 -2
- package/dist/collection/components/ui/kritzel-utility-panel/kritzel-utility-panel.js +1 -1
- package/dist/collection/components/ui/kritzel-zoom-panel/kritzel-zoom-panel.js +1 -1
- package/dist/collection/constants/version.js +1 -1
- package/dist/components/index.js +1 -1
- package/dist/components/kritzel-active-users.js +1 -1
- package/dist/components/kritzel-avatar.js +1 -1
- package/dist/components/kritzel-back-to-content.js +1 -1
- package/dist/components/kritzel-button.js +1 -1
- package/dist/components/kritzel-color-palette.js +1 -1
- package/dist/components/kritzel-color.js +1 -1
- package/dist/components/kritzel-controls.js +1 -1
- package/dist/components/kritzel-current-user-dialog.js +1 -1
- package/dist/components/kritzel-current-user.js +1 -1
- package/dist/components/kritzel-editor.js +1 -1
- package/dist/components/kritzel-engine.js +1 -1
- package/dist/components/kritzel-export.js +1 -1
- package/dist/components/kritzel-font-size.js +1 -1
- package/dist/components/kritzel-font.js +1 -1
- package/dist/components/kritzel-input.js +1 -1
- package/dist/components/kritzel-loading-overlay.js +1 -1
- package/dist/components/kritzel-login-dialog.js +1 -1
- package/dist/components/kritzel-master-detail.js +1 -1
- package/dist/components/kritzel-menu-item.js +1 -1
- package/dist/components/kritzel-menu.js +1 -1
- package/dist/components/kritzel-more-menu.js +1 -1
- package/dist/components/kritzel-numeric-input.js +1 -1
- package/dist/components/kritzel-opacity-slider.js +1 -1
- package/dist/components/kritzel-portal.js +1 -1
- package/dist/components/kritzel-settings.js +1 -1
- package/dist/components/kritzel-share-dialog.js +1 -1
- package/dist/components/kritzel-slide-toggle.js +1 -1
- package/dist/components/kritzel-split-button.js +1 -1
- package/dist/components/kritzel-stroke-size.js +1 -1
- package/dist/components/kritzel-tool-config.js +1 -1
- package/dist/components/kritzel-tooltip.js +1 -1
- package/dist/components/kritzel-utility-panel.js +1 -1
- package/dist/components/kritzel-watermark.js +1 -1
- package/dist/components/kritzel-workspace-manager.js +1 -1
- package/dist/components/kritzel-zoom-panel.js +1 -1
- package/dist/components/{p-BulDbBWB.js → p-9692OaI_.js} +1 -1
- package/dist/components/{p-BzrxIesp.js → p-B6t5q-V4.js} +1 -1
- package/dist/components/{p-DgnK50xO.js → p-B8Xi4Clg.js} +1 -1
- package/dist/components/{p-DIMNEOTW.js → p-BDzlx2hB.js} +1 -1
- package/dist/components/{p-8xkoVMfO.js → p-BI2ng9I_.js} +1 -1
- package/dist/components/{p-B_6RNask.js → p-BJ3Do8l1.js} +1 -1
- package/dist/components/p-BbGeZ47F.js +9 -0
- package/dist/components/{p-CVhcOiEA.js → p-BsANVili.js} +1 -1
- package/dist/components/{p-DSOc0eIT.js → p-C4NrrUfN.js} +1 -1
- package/dist/components/{p-BzJEwFtn.js → p-CWRSGYOE.js} +1 -1
- package/dist/components/{p-BLOPBDUF.js → p-Ca-igU1f.js} +1 -1
- package/dist/components/{p-Bd_yPNfg.js → p-Cf2ZKUo0.js} +1 -1
- package/dist/components/{p-DMAScsJF.js → p-CiJ8GUSN.js} +1 -1
- package/dist/components/{p-DPpPd5GI.js → p-Cq3RhUie.js} +1 -1
- package/dist/components/{p-zd7zXld8.js → p-CqLgB8JK.js} +1 -1
- package/dist/components/{p-D8TOEhPY.js → p-Cr682JI_.js} +1 -1
- package/dist/components/{p-DEqpY4K2.js → p-CrihGZwy.js} +1 -1
- package/dist/components/{p-BKOsmXB5.js → p-CwJwsRR3.js} +1 -1
- package/dist/components/{p-1nG2hxfJ.js → p-Cymum41a.js} +1 -1
- package/dist/components/{p-Ds-P2bYH.js → p-D-NSbx5U.js} +1 -1
- package/dist/components/p-D2q_wTyG.js +1 -0
- package/dist/components/{p-DXcjIb_a.js → p-D5jf8wAu.js} +1 -1
- package/dist/components/{p-Bm_BWQa4.js → p-D82VaHce.js} +1 -1
- package/dist/components/{p-oGAPPwAL.js → p-DEBwmRTC.js} +1 -1
- package/dist/components/{p-yD_3Z3K1.js → p-DJ88BrIW.js} +1 -1
- package/dist/components/p-DJy_uWqB.js +1 -0
- package/dist/components/{p-CMphprF1.js → p-DS6BjPHy.js} +1 -1
- package/dist/components/{p-DZcwchEg.js → p-DU7g4PU-.js} +1 -1
- package/dist/components/{p-DCW7TkyE.js → p-DiN6reV0.js} +1 -1
- package/dist/components/{p-D52oKO_e.js → p-MWbDABmq.js} +1 -1
- package/dist/components/{p-CwuGA058.js → p-PSFAfAyd.js} +1 -1
- package/dist/components/{p-jzuGPW5o.js → p-_Bq7P1RT.js} +1 -1
- package/dist/components/{p-C4XDwGU0.js → p-zPqYwncm.js} +1 -1
- package/dist/esm/kritzel-active-users_46.entry.js +57 -68
- package/dist/esm/loader.js +1 -1
- package/dist/esm/stencil.js +1 -1
- package/dist/stencil/p-c6ee3857.entry.js +9 -0
- package/dist/stencil/stencil.esm.js +1 -1
- package/dist/types/components/core/kritzel-editor/kritzel-editor.d.ts +0 -3
- package/dist/types/components/core/kritzel-engine/kritzel-engine.d.ts +0 -1
- package/dist/types/constants/version.d.ts +1 -1
- package/package.json +1 -1
- package/dist/components/p-BR0Hnrhc.js +0 -1
- package/dist/components/p-Di5dpXrF.js +0 -1
- package/dist/components/p-hkYKD6tT.js +0 -9
- package/dist/stencil/p-0f31dc8e.entry.js +0 -9
|
@@ -136,16 +136,16 @@ const KritzelAvatar = class {
|
|
|
136
136
|
height: `${this.size}px`,
|
|
137
137
|
fontSize: `${Math.round(this.size * 0.4)}px`,
|
|
138
138
|
};
|
|
139
|
-
return (h(Host, { key: '
|
|
139
|
+
return (h(Host, { key: 'a25cae3d0597e53606a00855e3175c89ff90d58e', style: containerStyles, class: {
|
|
140
140
|
'has-image': !!showImage,
|
|
141
141
|
'has-initials': !!showInitials,
|
|
142
142
|
'has-default': !!showDefaultIcon,
|
|
143
|
-
}, role: "img", "aria-label": this.getDisplayName() || 'User avatar' }, showImage && (h("img", { key: '
|
|
143
|
+
}, role: "img", "aria-label": this.getDisplayName() || 'User avatar' }, showImage && (h("img", { key: 'c3288f0ba9e0d8876403244fe3942dd91e685a79', src: imageUrl, alt: "", class: "avatar-image", ref: (el) => {
|
|
144
144
|
if (el) {
|
|
145
145
|
el.referrerPolicy = 'no-referrer';
|
|
146
146
|
el.crossOrigin = 'anonymous';
|
|
147
147
|
}
|
|
148
|
-
}, onError: this.handleImageError })), showInitials && (h("span", { key: '
|
|
148
|
+
}, onError: this.handleImageError })), showInitials && (h("span", { key: 'ae0ca459b87e90a1f67abe747b75d8dd61247ead', class: "avatar-initials", style: { backgroundColor: this.getBackgroundColor() } }, initials)), showDefaultIcon && (h("span", { key: '2a60a0347ae21732828920339f53803330c9c6c6', class: "avatar-default" }, h("svg", { key: 'ee057dc02ae61206164775b35ad1408fe04dfed9', viewBox: "0 0 24 24", fill: "currentColor" }, h("path", { key: '2190046ba2e2c659d47f8a7f4a12bb10ae626f07', d: "M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z" }))))));
|
|
149
149
|
}
|
|
150
150
|
static get watchers() { return {
|
|
151
151
|
"user": [{
|
|
@@ -455,7 +455,7 @@ const KritzelBackToContent = class {
|
|
|
455
455
|
this.backToContent.emit();
|
|
456
456
|
};
|
|
457
457
|
render() {
|
|
458
|
-
return (h(Host, { key: '
|
|
458
|
+
return (h(Host, { key: 'b03e05aede6950eb17279081b4c80575cbd1e3b9' }, h("button", { key: 'e5cff1173e4212a25aee51b39fc7907625882083', class: { 'back-to-content-button': true, visible: this.visible }, onClick: this.handleClick, "aria-label": this.text }, h("kritzel-icon", { key: '1ae10674d9920d522b20c171a78e3b9a6f35cca5', name: "chevrons-left" }))));
|
|
459
459
|
}
|
|
460
460
|
};
|
|
461
461
|
KritzelBackToContent.style = kritzelBackToContentCss();
|
|
@@ -482,11 +482,11 @@ const KritzelButton = class {
|
|
|
482
482
|
this.buttonClick.emit();
|
|
483
483
|
};
|
|
484
484
|
render() {
|
|
485
|
-
return (h(Host, { key: '
|
|
485
|
+
return (h(Host, { key: 'ee7da1d8d86cdd6f920d15642203265cc93cda4e' }, h("button", { key: '15b1f11be5157c70ef5a4b3cd917bacb8f90ee4a', type: this.type, class: {
|
|
486
486
|
'kritzel-button': true,
|
|
487
487
|
[this.variant]: true,
|
|
488
488
|
'disabled': this.disabled,
|
|
489
|
-
}, disabled: this.disabled, onClick: this.handleClick }, h("slot", { key: '
|
|
489
|
+
}, disabled: this.disabled, onClick: this.handleClick }, h("slot", { key: '8500172bd4540f4fa9c5e629d1ceb1816dcf556a' }))));
|
|
490
490
|
}
|
|
491
491
|
};
|
|
492
492
|
KritzelButton.style = kritzelButtonCss();
|
|
@@ -534,13 +534,13 @@ const KritzelColorComponent = class {
|
|
|
534
534
|
render() {
|
|
535
535
|
const resolvedColor = this.resolveColor();
|
|
536
536
|
const isColorVeryLight = this.isLightColor(resolvedColor);
|
|
537
|
-
return (h(Host, { key: '
|
|
537
|
+
return (h(Host, { key: 'a898705a76a25b051b046cb3d5274c1701482a4c' }, h("div", { key: '7d5ce83a17f710a1d808ff7d572b75585caada72', class: "checkerboard-bg", style: {
|
|
538
538
|
width: `${this.size}px`,
|
|
539
539
|
height: `${this.size}px`,
|
|
540
540
|
borderRadius: '50%',
|
|
541
541
|
display: 'inline-block',
|
|
542
542
|
position: 'relative',
|
|
543
|
-
} }, h("div", { key: '
|
|
543
|
+
} }, h("div", { key: '8d318c989b7e69bc61dd653688a9e7480c4ee34d', class: {
|
|
544
544
|
'color-circle': true,
|
|
545
545
|
'white': isColorVeryLight,
|
|
546
546
|
}, style: {
|
|
@@ -596,7 +596,7 @@ const KritzelColorPalette = class {
|
|
|
596
596
|
render() {
|
|
597
597
|
const displayedColors = this.isExpanded ? this.colors : this.colors.slice(0, 6);
|
|
598
598
|
const expandedHeight = this.isExpanded ? this.calculateHeight() : '32px';
|
|
599
|
-
return (h(Host, { key: '
|
|
599
|
+
return (h(Host, { key: '6e16fdd13c09ab2bcffb83df7ed861560f486518' }, h("div", { key: '48cc257315e13822dcc8bea314d26f1137d9b3cc', class: {
|
|
600
600
|
'color-grid': true,
|
|
601
601
|
'expanded': this.isExpanded,
|
|
602
602
|
}, style: {
|
|
@@ -1164,13 +1164,13 @@ const KritzelControls = class {
|
|
|
1164
1164
|
// Separate tool controls from config control
|
|
1165
1165
|
const toolControls = this.internalControls.filter(c => c.type === 'tool' || c.type === 'separator');
|
|
1166
1166
|
const configControl = this.internalControls.find(c => c.type === 'config' && c.name === this.firstConfig?.name);
|
|
1167
|
-
return (h(Host, { key: '
|
|
1167
|
+
return (h(Host, { key: '7112ce9c79dcff24e48d6dff09257791b253ac4e', style: { display: this.visible ? '' : 'none' }, class: {
|
|
1168
1168
|
mobile: this.isTouchDevice,
|
|
1169
|
-
} }, this.isUtilityPanelVisible && (h("kritzel-utility-panel", { key: '
|
|
1169
|
+
} }, this.isUtilityPanelVisible && (h("kritzel-utility-panel", { key: '19f70fef9b6bd8a2e27c0d01099e93b72c57356b', style: {
|
|
1170
1170
|
position: 'absolute',
|
|
1171
1171
|
bottom: '56px',
|
|
1172
1172
|
left: '12px',
|
|
1173
|
-
}, undoState: this.undoState, terms: this.terms, onUndo: () => this.kritzelEngine?.undo(), onRedo: () => this.kritzelEngine?.redo(), onDelete: () => this.kritzelEngine?.delete() })), h("div", { key: '
|
|
1173
|
+
}, undoState: this.undoState, terms: this.terms, onUndo: () => this.kritzelEngine?.undo(), onRedo: () => this.kritzelEngine?.redo(), onDelete: () => this.kritzelEngine?.delete() })), h("div", { key: '8c36e3de1e3c0012c3e5d98ca0118ab9c45152f8', class: "kritzel-controls" }, h("div", { key: 'b2d6f311dc4c1e3e2edb01c83c7aa01b99e9f01a', class: { 'scroll-indicator-left': true, 'visible': this.canScrollLeft } }), h("div", { key: 'cdd4af3f020a9cf9b8924d27286555488f65477e', class: "kritzel-tools-scroll", ref: el => (this.toolsScrollRef = el), onScroll: this.handleToolsScroll }, toolControls.map(control => {
|
|
1174
1174
|
// Check if this control has sub-options (split-button)
|
|
1175
1175
|
if (control.subOptions?.length) {
|
|
1176
1176
|
const selectedSubOption = this.getSelectedSubOption(control);
|
|
@@ -1200,10 +1200,10 @@ const KritzelControls = class {
|
|
|
1200
1200
|
'kritzel-control': true,
|
|
1201
1201
|
'selected': this.activeControl?.name === control?.name,
|
|
1202
1202
|
}, 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 })));
|
|
1203
|
-
})), h("div", { key: '
|
|
1203
|
+
})), h("div", { key: '7bbd436986a433f934f5992f8ae96b6cdb233381', class: { 'scroll-indicator-right': true, 'visible': this.canScrollRight && !(configControl && this.activeControl && hasConfigUI) } }), configControl && this.activeControl && (h("div", { class: {
|
|
1204
1204
|
'kritzel-config-container': true,
|
|
1205
1205
|
'visible': hasConfigUI,
|
|
1206
|
-
}, key: configControl.name }, h("div", { key: '
|
|
1206
|
+
}, key: configControl.name }, h("div", { key: '3c00abcde934f2a6d5c3768277b20cf22bcf66d6', class: { 'config-gradient-left': true, 'visible': this.needsScrolling } }), h("kritzel-tooltip", { key: '67cf36c2eaddfd66bd243496a48736d89d60b370', anchorElement: this.host.shadowRoot?.querySelector('.kritzel-config-container'), triggerElement: this.configTriggerRef }, h("kritzel-tool-config", { key: '8bcaae6e0482858eea69aae42adbe62665ad4d98', 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: '91d3b8578958f322d31dd0e38dc7203095c23f9f', tabIndex: hasConfigUI ? 0 : -1, class: "kritzel-config", "data-testid": "tool-config", ref: el => {
|
|
1207
1207
|
if (el)
|
|
1208
1208
|
this.configTriggerRef = el;
|
|
1209
1209
|
}, onKeyDown: event => {
|
|
@@ -1212,7 +1212,7 @@ const KritzelControls = class {
|
|
|
1212
1212
|
}
|
|
1213
1213
|
}, style: {
|
|
1214
1214
|
cursor: 'pointer',
|
|
1215
|
-
} }, this.displayValues && (h("div", { key: '
|
|
1215
|
+
} }, this.displayValues && (h("div", { key: '6bd17c4d1781cf9e33483a801f52ef09af70802f', class: "color-container" }, h("kritzel-color", { key: 'a1af397c023a3f0247afdf06b9400543d0c3cbdd', value: this.displayValues.color, theme: this.theme, size: 18, style: {
|
|
1216
1216
|
borderRadius: '50%',
|
|
1217
1217
|
border: 'none',
|
|
1218
1218
|
} })))))))));
|
|
@@ -1246,7 +1246,7 @@ const KritzelCurrentUser = class {
|
|
|
1246
1246
|
/** Resolved localized strings keyed by term key, supplied by the editor. */
|
|
1247
1247
|
terms = {};
|
|
1248
1248
|
render() {
|
|
1249
|
-
return (h(Host, { key: '
|
|
1249
|
+
return (h(Host, { key: '4810f63c9297931ae1a5e2eb9d866bab1bf1aa55' }, h("kritzel-avatar", { key: 'e6735fd9aaea0ff41006d6034ebe8d6248ee6a03', user: this.user, size: this.avatarSize })));
|
|
1250
1250
|
}
|
|
1251
1251
|
};
|
|
1252
1252
|
KritzelCurrentUser.style = kritzelCurrentUserCss();
|
|
@@ -1287,7 +1287,7 @@ const KritzelCurrentUserDialog = class {
|
|
|
1287
1287
|
}
|
|
1288
1288
|
render() {
|
|
1289
1289
|
const displayName = this.getDisplayName();
|
|
1290
|
-
return (h(Host, { key: '
|
|
1290
|
+
return (h(Host, { key: '510a75d18b03e26e6c0b5ebd4e687b938e739318' }, h("kritzel-dialog", { key: '088b9b931b781081b93690c2a683da731a7f1825', dialogTitle: this.terms['currentUser.dialogTitle'] ?? 'Account', isOpen: this.isDialogOpen, onDialogClose: this.closeDialog, size: "small", contained: true }, h("div", { key: '8ae1247fd8c2e21d2a1c541e05373f9e11088aaa', class: "user-info" }, h("kritzel-avatar", { key: '3a8dc6052093be6358a83f004f3b08d926a585d9', user: this.user, size: 80 }), displayName && h("div", { key: '4984bef4e32ece2051b92795e046629760442914', class: "user-name" }, displayName), this.user?.email && h("div", { key: '0c5a73d026512e139e1c90050fa5798c138215e5', class: "user-email" }, this.user.email), h("kritzel-button", { key: '7a3d7947a98e2a16e43865ea5cee83e61cc7294e', class: "logout-button", variant: "primary", onButtonClick: this.handleLogout }, this.terms['menu.logout'] ?? 'Logout')))));
|
|
1291
1291
|
}
|
|
1292
1292
|
};
|
|
1293
1293
|
KritzelCurrentUserDialog.style = kritzelCurrentUserDialogCss();
|
|
@@ -2342,8 +2342,6 @@ const KritzelEditor = class {
|
|
|
2342
2342
|
isEditorVisible = false;
|
|
2343
2343
|
activeNotification;
|
|
2344
2344
|
isNotificationDismissing = false;
|
|
2345
|
-
/** Combined loading state reported by the engine (external `isLoading` prop or internal workspace loading). Starts true so the overlay is shown until the engine reports otherwise. */
|
|
2346
|
-
isEngineLoading = true;
|
|
2347
2345
|
notificationDismissTimeout;
|
|
2348
2346
|
notificationDismissAnimationTimeout;
|
|
2349
2347
|
notificationDisplayDurationMs = 5000;
|
|
@@ -2770,10 +2768,6 @@ const KritzelEditor = class {
|
|
|
2770
2768
|
event.stopPropagation();
|
|
2771
2769
|
this.awarenessChange.emit(event.detail);
|
|
2772
2770
|
}
|
|
2773
|
-
handleLoadingChange(event) {
|
|
2774
|
-
event.stopPropagation();
|
|
2775
|
-
this.isEngineLoading = event.detail;
|
|
2776
|
-
}
|
|
2777
2771
|
handleNotificationsChange(event) {
|
|
2778
2772
|
event.stopPropagation();
|
|
2779
2773
|
this.clearNotificationDismissAnimationTimer();
|
|
@@ -3058,36 +3052,36 @@ const KritzelEditor = class {
|
|
|
3058
3052
|
const isLoggedIn = this.isLoggedIn;
|
|
3059
3053
|
const shouldShowCurrentUser = isLoggedIn;
|
|
3060
3054
|
const shouldShowLoginButton = this.isReady && !!this.loginConfig && !isLoggedIn;
|
|
3061
|
-
return (h(Host, { key: '
|
|
3055
|
+
return (h(Host, { key: '3128b38a04cd636abc1f2466f1ac1aa3dcea2262' }, h("div", { key: 'b1fbb051cb1144fd84f28cfea4ad824f92189dbd', class: "editor-content", style: {
|
|
3062
3056
|
opacity: this.isEditorVisible ? '1' : '0',
|
|
3063
3057
|
visibility: this.isEditorVisible ? 'visible' : 'hidden',
|
|
3064
3058
|
transition: 'opacity 0.2s ease-in-out, visibility 0.2s ease-in-out',
|
|
3065
|
-
} }, h("div", { key: '
|
|
3059
|
+
} }, h("div", { key: '2b896fa8bd00a7c68b74df7a9846e8c3e0f6efc4', class: "top-left-buttons" }, h("kritzel-workspace-manager", { key: '13244251aa8999d78d275eefe5583d592f3506fc', visible: this.isWorkspaceManagerVisible, workspaces: this.workspaces, activeWorkspace: this.activeWorkspace, terms: this.resolvedTerms, onWorkspaceChange: event => (this.activeWorkspace = event.detail), onIsWorkspaceManagerReady: () => (this.isWorkspaceManagerReady = true) }), h("kritzel-back-to-content", { key: '7d3015918e4af7ee435aee8da37ddfa206cdfd66', visible: this.isBackToContentButtonVisible, text: this.resolvedTerms['backToContent.label'] ?? 'Back to content', onBackToContent: () => this.backToContent() })), this.activeNotification && (h("div", { key: '49f13f23698db9b804d139e0f35696be06569346', class: "top-center-notification-layer", role: "presentation" }, h("div", { key: '765aa6995398aca3c7738758bedb7d9a7c2f099a', class: { 'top-center-notification-container': true, 'is-dismissing': this.isNotificationDismissing }, role: "presentation" }, h("kritzel-notification-card", { key: 'fe0dfa30aa498a608f9167b01e0a2309dfa67162', notification: this.activeNotification, locale: this.locale, onDismiss: this.dismissNotification, onHoverChange: event => this.handleNotificationHoverChange(event) })))), h("kritzel-engine", { key: '5aeb7979faa8779653ff6a2930d288fd601cb0e9', ref: el => {
|
|
3066
3060
|
if (el) {
|
|
3067
3061
|
this.engineRef = el;
|
|
3068
3062
|
}
|
|
3069
|
-
}, workspace: this.activeWorkspace, activeWorkspaceId: this.activeWorkspaceId, editorId: this.editorId, syncConfig: this.syncConfig, assetStorageConfig: this.assetStorageConfig, user: this.user, scaleMax: this.scaleMax, lockDrawingScale: this.lockDrawingScale, isObjectDistanceFadingActive: this.isObjectDistanceFadingActive, scaleMin: this.scaleMin, cursorTarget: this.cursorTarget, isLoading: this.isLoading, viewportBoundaryLeft: this.viewportBoundaryLeft, viewportBoundaryRight: this.viewportBoundaryRight, viewportBoundaryTop: this.viewportBoundaryTop, viewportBoundaryBottom: this.viewportBoundaryBottom, isPanningEnabled: this.isPanningEnabled, isZoomingEnabled: this.isZoomingEnabled, theme: this.theme, themes: this.themes, licenseKey: this.licenseKey, locale: this.locale, locales: this.locales, fallbackLocale: this.fallbackLocale, debugInfo: this.debugInfo, globalContextMenuItems: this.globalContextMenuItems, objectContextMenuItems: this.objectContextMenuItems, onIsEngineReady: event => this.onEngineReady(event), onWorkspacesChange: event => this.handleWorkspacesChange(event), onActiveWorkspaceChange: event => this.handleActiveWorkspaceChange(event), onObjectsChange: event => this.handleObjectsChange(event), onObjectsAdded: event => this.handleObjectsAdded(event), onObjectsRemoved: event => this.handleObjectsRemoved(event), onObjectsUpdated: event => this.handleObjectsUpdated(event), onUndoStateChange: event => this.handleUndoStateChange(event), onObjectsInViewportChange: event => this.handleObjectsInViewportChange(event), onViewportChange: event => this.handleViewportChange(event), onAwarenessChange: event => this.handleAwarenessChange(event), onNotificationsChange: event => this.handleNotificationsChange(event)
|
|
3063
|
+
}, workspace: this.activeWorkspace, activeWorkspaceId: this.activeWorkspaceId, editorId: this.editorId, syncConfig: this.syncConfig, assetStorageConfig: this.assetStorageConfig, user: this.user, scaleMax: this.scaleMax, lockDrawingScale: this.lockDrawingScale, isObjectDistanceFadingActive: this.isObjectDistanceFadingActive, scaleMin: this.scaleMin, cursorTarget: this.cursorTarget, isLoading: this.isLoading, viewportBoundaryLeft: this.viewportBoundaryLeft, viewportBoundaryRight: this.viewportBoundaryRight, viewportBoundaryTop: this.viewportBoundaryTop, viewportBoundaryBottom: this.viewportBoundaryBottom, isPanningEnabled: this.isPanningEnabled, isZoomingEnabled: this.isZoomingEnabled, theme: this.theme, themes: this.themes, licenseKey: this.licenseKey, locale: this.locale, locales: this.locales, fallbackLocale: this.fallbackLocale, debugInfo: this.debugInfo, globalContextMenuItems: this.globalContextMenuItems, objectContextMenuItems: this.objectContextMenuItems, onIsEngineReady: event => this.onEngineReady(event), onWorkspacesChange: event => this.handleWorkspacesChange(event), onActiveWorkspaceChange: event => this.handleActiveWorkspaceChange(event), onObjectsChange: event => this.handleObjectsChange(event), onObjectsAdded: event => this.handleObjectsAdded(event), onObjectsRemoved: event => this.handleObjectsRemoved(event), onObjectsUpdated: event => this.handleObjectsUpdated(event), onUndoStateChange: event => this.handleUndoStateChange(event), onObjectsInViewportChange: event => this.handleObjectsInViewportChange(event), onViewportChange: event => this.handleViewportChange(event), onAwarenessChange: event => this.handleAwarenessChange(event), onNotificationsChange: event => this.handleNotificationsChange(event) }), h("kritzel-controls", { key: 'eda4dc93fe663c8472638190216bea5bf64d7153', visible: this.isControlsVisible, class: { 'keyboard-open': this.isVirtualKeyboardOpen }, ref: el => {
|
|
3070
3064
|
if (el) {
|
|
3071
3065
|
this.controlsRef = el;
|
|
3072
3066
|
}
|
|
3073
|
-
}, controls: this.controls, isUtilityPanelVisible: this.isUtilityPanelVisible, undoState: this.undoState ?? undefined, theme: this.theme, terms: this.resolvedTerms, onIsControlsReady: () => (this.isControlsReady = true) }), h("div", { key: '
|
|
3067
|
+
}, controls: this.controls, isUtilityPanelVisible: this.isUtilityPanelVisible, undoState: this.undoState ?? undefined, theme: this.theme, terms: this.resolvedTerms, onIsControlsReady: () => (this.isControlsReady = true) }), h("div", { key: 'ffdb548da8aac3498b1b3e9bfdc9a41f8c448675', class: "bottom-left-buttons" }, h("kritzel-zoom-panel", { key: 'af6f6a86212195fd3ee13bc33c16574e0a5236a6', visible: this.isZoomPanelVisible, disabled: !this.isZoomingEnabled, zoomPercent: this.currentZoomPercent, terms: this.resolvedTerms, onZoomIn: () => this.zoomIn(), onZoomOut: () => this.zoomOut() })), h("div", { key: '0870c0e47838fc99b4041718a431535827e199cf', class: "top-right-buttons" }, h("kritzel-settings", { key: 'b95beb43dbe1a9c99454fc4ff74f0630aca7ad83', ref: el => {
|
|
3074
3068
|
if (el) {
|
|
3075
3069
|
this.settingsRef = el;
|
|
3076
3070
|
}
|
|
3077
|
-
}, shortcuts: this.shortcuts, availableThemes: this.themes && this.themes.length > 0 ? this.themes.map(t => t.name) : ['light', 'dark'], availableLocales: this.availableLocaleOptions, settings: this.currentSettingsConfig, terms: this.resolvedTerms, onSettingsChange: event => this.handleSettingsChange(event) }), h("kritzel-export", { key: '
|
|
3071
|
+
}, shortcuts: this.shortcuts, availableThemes: this.themes && this.themes.length > 0 ? this.themes.map(t => t.name) : ['light', 'dark'], availableLocales: this.availableLocaleOptions, settings: this.currentSettingsConfig, terms: this.resolvedTerms, onSettingsChange: event => this.handleSettingsChange(event) }), h("kritzel-export", { key: 'ef6fea2715ff99226fde937185a693efc2a7dd75', ref: el => {
|
|
3078
3072
|
if (el) {
|
|
3079
3073
|
this.exportRef = el;
|
|
3080
3074
|
}
|
|
3081
|
-
}, workspaceName: this.activeWorkspace?.name || 'workspace', terms: this.resolvedTerms, onExportPng: () => this.engineRef.exportViewportAsPng(), onExportSvg: () => this.engineRef.exportViewportAsSvg(), onExportJson: event => this.engineRef.downloadAsJson(event.detail) }), h("kritzel-active-users", { key: '
|
|
3075
|
+
}, workspaceName: this.activeWorkspace?.name || 'workspace', terms: this.resolvedTerms, onExportPng: () => this.engineRef.exportViewportAsPng(), onExportSvg: () => this.engineRef.exportViewportAsSvg(), onExportJson: event => this.engineRef.downloadAsJson(event.detail) }), h("kritzel-active-users", { key: '872b7fa12d49410d1c370baed3386a34f89d3e2a', users: this.activeUsers }), shouldShowCurrentUser && h("kritzel-current-user", { key: 'da19825b4fba6a516803f8330cdfdfac6b6c9db1', user: this.user, terms: this.resolvedTerms, onClick: () => this.currentUserDialogRef?.open() }), shouldShowCurrentUser && (h("kritzel-current-user-dialog", { key: '9336ce611286d3ecf9318317ab4bedb8c3f79f05', ref: el => {
|
|
3082
3076
|
if (el) {
|
|
3083
3077
|
this.currentUserDialogRef = el;
|
|
3084
3078
|
this.currentUserDialogRef.addEventListener('logoutRequest', this.handleCurrentUserLogout);
|
|
3085
3079
|
}
|
|
3086
|
-
}, user: this.user, terms: this.resolvedTerms })), shouldShowLoginButton && (h("kritzel-button", { key: '
|
|
3080
|
+
}, user: this.user, terms: this.resolvedTerms })), shouldShowLoginButton && (h("kritzel-button", { key: 'a9e38ad3e13c785f6a4223ebde95f60451c6515f', onButtonClick: () => this.loginDialogRef?.open() }, this.resolvedTerms['login.dialogTitle'] ?? 'Sign in')), h("kritzel-more-menu", { key: 'b8f63a63ae4e75a70d0069410170af902f2a362b', items: this.moreMenuItems, visible: this.isMoreMenuVisible, terms: this.resolvedTerms }), h("kritzel-share-dialog", { key: '7a923fd51e8d2bd1e2833e0941622efadd55f881', ref: el => {
|
|
3087
3081
|
if (el) {
|
|
3088
3082
|
this.shareDialogRef = el;
|
|
3089
3083
|
}
|
|
3090
|
-
}, isPublic: this.currentIsPublic, workspaceId: this.activeWorkspace?.id, terms: this.resolvedTerms, onToggleIsPublic: this.handleToggleIsPublic }), this.loginConfig && (h("kritzel-login-dialog", { key: '
|
|
3084
|
+
}, isPublic: this.currentIsPublic, workspaceId: this.activeWorkspace?.id, terms: this.resolvedTerms, onToggleIsPublic: this.handleToggleIsPublic }), this.loginConfig && (h("kritzel-login-dialog", { key: 'ac54c699a94bb2657a6817c37d6220b75d931cd3', ref: el => {
|
|
3091
3085
|
if (el) {
|
|
3092
3086
|
this.loginDialogRef = el;
|
|
3093
3087
|
}
|
|
@@ -27417,7 +27411,7 @@ class KritzelWheelHelper {
|
|
|
27417
27411
|
}
|
|
27418
27412
|
}
|
|
27419
27413
|
|
|
27420
|
-
const kritzelEngineCss = () => `:host{display:block;position:relative;height:100%;width:100%;overflow:hidden;isolation:isolate;background-color:var(--kritzel-engine-background-color, #ffffff)
|
|
27414
|
+
const kritzelEngineCss = () => `:host{display:block;position:relative;height:100%;width:100%;overflow:hidden;isolation:isolate;background-color:var(--kritzel-engine-background-color, #ffffff)}:host,:host *{touch-action:none;user-select:none}.ProseMirror{outline:none}p,h1,h2,h3,h4,h5,h6,blockquote,pre{margin:0;padding:0}.debug-panel{position:absolute;pointer-events:none;top:0;right:0}.origin{position:relative;top:0;left:0;height:0;width:0;pointer-events:none;-webkit-transform-origin:top left;-moz-transform-origin:top left;transform-origin:top left;overflow:visible}.object{overflow:visible}.PlaygroundEditorTheme__quote{margin:0;margin-left:20px;margin-bottom:10px;font-size:15px;color:rgb(101, 103, 107);border-left-color:rgb(206, 208, 212);border-left-width:4px;border-left-style:solid;padding-left:16px}`;
|
|
27421
27415
|
|
|
27422
27416
|
const KritzelEngine = class {
|
|
27423
27417
|
get host() { return getElement(this); }
|
|
@@ -27650,7 +27644,6 @@ const KritzelEngine = class {
|
|
|
27650
27644
|
/** Emitted when the combined loading state (external `isLoading` prop or internal workspace loading) changes. */
|
|
27651
27645
|
loadingChange;
|
|
27652
27646
|
forceUpdate = 0;
|
|
27653
|
-
isContentHidden = true;
|
|
27654
27647
|
/** Manually triggers the `objectsSelectionChange` event. */
|
|
27655
27648
|
async triggerSelectionChange() {
|
|
27656
27649
|
this.objectsSelectionChange.emit();
|
|
@@ -29107,12 +29100,8 @@ const KritzelEngine = class {
|
|
|
29107
29100
|
_objectDistanceFadeCloseMaxScale = 4;
|
|
29108
29101
|
_objectDistanceFadeCloseMinOpacity = 0;
|
|
29109
29102
|
syncLoadingState() {
|
|
29110
|
-
|
|
29111
|
-
this.core.store.state.isLoading
|
|
29112
|
-
if (this.isContentHidden !== isLoading) {
|
|
29113
|
-
this.isContentHidden = isLoading;
|
|
29114
|
-
}
|
|
29115
|
-
this.loadingChange.emit(isLoading);
|
|
29103
|
+
this.core.store.state.isLoading = this._isWorkspaceLoading || this.isLoading;
|
|
29104
|
+
this.loadingChange.emit(this.core.store.state.isLoading);
|
|
29116
29105
|
}
|
|
29117
29106
|
applyToolConfig(tool, toolConfig) {
|
|
29118
29107
|
Object.entries(toolConfig).forEach(([key, value]) => {
|
|
@@ -29574,7 +29563,7 @@ const KritzelEngine = class {
|
|
|
29574
29563
|
this.emitObjectsInViewportChange();
|
|
29575
29564
|
}
|
|
29576
29565
|
}
|
|
29577
|
-
return (h(Host, {
|
|
29566
|
+
return (h(Host, null, h("kritzel-loading-overlay", { visible: this.core.store.state.isLoading, text: this.core.localizationManager.translate('engine.loading') }), this.core.store.state.debugInfo.showViewportInfo && (h("div", { class: "debug-panel" }, h("div", null, "ActiveWorkspaceId: ", this.core.store.state?.activeWorkspace?.id), h("div", null, "ActiveWorkspaceName: ", this.core.store.state?.activeWorkspace?.name), h("div", null, "TranslateX: ", this.core.store.state?.translateX), h("div", null, "TranslateY: ", this.core.store.state?.translateY), h("div", null, "ViewportWidth: ", this.core.store.state?.viewportWidth), h("div", null, "ViewportHeight: ", this.core.store.state?.viewportHeight), h("div", null, "PointerCount: ", this.core.store.state.pointers.size), h("div", null, "Scale: ", this.core.store.state?.scale), h("div", null, "ActiveTool: ", this.core.store.state?.activeTool?.name), h("div", null, "HasViewportChanged: ", this.core.store.state?.hasViewportChanged ? 'true' : 'false'), h("div", null, "IsEnabled: ", this.core.store.state?.isEnabled ? 'true' : 'false'), h("div", null, "IsScaling: ", this.core.store.state?.isScaling ? 'true' : 'false'), h("div", null, "IsPanning: ", this.core.store.state?.isPanning ? 'true' : 'false'), h("div", null, "IsSelecting: ", this.isSelecting ? 'true' : 'false'), h("div", null, "IsSelectionActive: ", this.isSelectionActive ? 'true' : 'false'), h("div", null, "IsResizeHandleSelected: ", this.core.store.state.isResizeHandleSelected ? 'true' : 'false'), h("div", null, "IsRotationHandleSelected: ", this.core.store.state.isRotationHandleSelected ? 'true' : 'false'), h("div", null, "IsRotationHandleHovered: ", this.core.store.state.isRotationHandleHovered ? 'true' : 'false'), h("div", null, "IsDrawing: ", this.core.store.state.isDrawing ? 'true' : 'false'), h("div", null, "IsWriting: ", this.core.store.state.isWriting ? 'true' : 'false'), h("div", null, "IsPointerDown: ", this.core.store.isPointerDown ? 'true' : 'false'), h("div", null, "PointerX: ", this.core.store.state?.pointerX), h("div", null, "PointerY: ", this.core.store.state?.pointerY), h("div", null, "TotalObjects: ", this.core.store.totalObjectCount), h("div", null, "ObjectsInViewport: ", this.core.store.objectsInViewport.length), h("div", null, "SelectedObjects: ", this.core.store.selectionGroup?.objects.length || 0), h("div", null, "ViewportCenter: (", viewportCenterX.toFixed(2), ", ", viewportCenterY.toFixed(2), ")"))), h("div", { id: "origin", class: "origin", style: {
|
|
29578
29567
|
transform: `matrix(${this.core.store.state?.scale}, 0, 0, ${this.core.store.state?.scale}, ${this.core.store.state?.translateX}, ${this.core.store.state?.translateY})`,
|
|
29579
29568
|
} }, visibleObjects?.map(object => {
|
|
29580
29569
|
const { multiplied: effectiveOpacity, overridden: effectiveOpacityString } = this.getObjectEffectiveOpacity(object, viewportScale);
|
|
@@ -30172,7 +30161,7 @@ const KritzelExport = class {
|
|
|
30172
30161
|
return (h("div", { class: "export-tab-content" }, h("kritzel-input", { label: this.terms['export.filename.label'] ?? 'Filename', value: this.exportFilename, placeholder: this.terms['export.filename.placeholder'] ?? 'Enter filename', suffix: ".json", onValueChange: this.handleFilenameChange })));
|
|
30173
30162
|
}
|
|
30174
30163
|
render() {
|
|
30175
|
-
return (h(Host, { key: '
|
|
30164
|
+
return (h(Host, { key: '3c3c627e2042592108a393ee105796d2a295bf98' }, h("kritzel-dialog", { key: '6fb67a7ca59b57a7a492e28ab81d1a0c1c6e7f0c', isOpen: this.isDialogOpen, dialogTitle: this.terms['export.dialogTitle'] ?? 'Export', closable: true, contained: true, onDialogClose: this.closeDialog }, h("div", { key: '95a37c2f0f1d8027904c5b6a075650b19bfcba95', class: "export-content" }, h("kritzel-pill-tabs", { key: '3f09c1a3b0f1c1012e28c00929415752ab10388c', tabs: this.tabs, value: this.activeTab, onValueChange: this.handleTabChange }), this.activeTab === 'viewport' && this.renderViewportExport(), this.activeTab === 'workspace' && this.renderWorkspaceExport(), h("button", { key: '4a552411e8ae23b4227bc7768163d4ec5f69f4ad', class: "export-primary-button", onClick: this.handleExport }, this.terms['export.exportButton'] ?? 'Export')))));
|
|
30176
30165
|
}
|
|
30177
30166
|
};
|
|
30178
30167
|
KritzelExport.style = kritzelExportCss();
|
|
@@ -30187,7 +30176,7 @@ const KritzelFont = class {
|
|
|
30187
30176
|
size = 24;
|
|
30188
30177
|
color = '#000000';
|
|
30189
30178
|
render() {
|
|
30190
|
-
return (h(Host, { key: '
|
|
30179
|
+
return (h(Host, { key: '57369ac95d0c99a52a8580e7659ec10e0e8ab38e' }, h("div", { key: 'e8f128fd7b8d26debb2c4ad2075b27f969d731bd', class: "font-preview", style: {
|
|
30191
30180
|
fontFamily: this.fontFamily,
|
|
30192
30181
|
fontSize: `${this.size}px`,
|
|
30193
30182
|
color: this.color
|
|
@@ -30263,7 +30252,7 @@ const KritzelFontSize = class {
|
|
|
30263
30252
|
render() {
|
|
30264
30253
|
const color = 'var(--kritzel-global-text-primary)';
|
|
30265
30254
|
const sizes = this.sizes ?? [];
|
|
30266
|
-
return (h(Host, { key: '
|
|
30255
|
+
return (h(Host, { key: '298b8c232c4d96583f4899efea86482ae8ebd319' }, sizes.map(size => (h("div", { tabIndex: 0, class: {
|
|
30267
30256
|
'size-container': true,
|
|
30268
30257
|
'selected': this.selectedSize === size,
|
|
30269
30258
|
}, onClick: () => this.handleSizeClick(size), onKeyDown: event => this.handleKeyDown(event, size) }, h("kritzel-font", { fontFamily: this.fontFamily, size: size, color: color }))))));
|
|
@@ -30330,7 +30319,7 @@ const KritzelInput = class {
|
|
|
30330
30319
|
this.valueChange.emit(input.value);
|
|
30331
30320
|
};
|
|
30332
30321
|
render() {
|
|
30333
|
-
return (h(Host, { key: '
|
|
30322
|
+
return (h(Host, { key: 'a59aa026922a3267ec7e6177973e80edfa97202c' }, h("div", { key: '46b1f191072bfb2a26579a329f8fd6ec86ca3ef9', class: "input-container" }, this.label && h("label", { key: '5409f811792034be56c3269b31ff374d8ed33de2', class: "input-label" }, this.label), h("div", { key: 'f51219b2a6384aeee63a7c8214821abd853a0ea5', class: { 'input-wrapper': true, 'has-suffix': !!this.suffix } }, h("input", { key: '05c93a526aa2f2d757a7c139fa3a47d84a4e2d95', type: this.type, class: "text-input", value: this.inputValue, placeholder: this.placeholder, disabled: this.disabled, onInput: this.handleInput }), this.suffix && h("span", { key: '91b60b25a7ff750720ff1961e224a035a2d86096', class: "input-suffix" }, this.suffix)))));
|
|
30334
30323
|
}
|
|
30335
30324
|
static get watchers() { return {
|
|
30336
30325
|
"value": [{
|
|
@@ -30438,7 +30427,7 @@ const KritzelLoadingOverlay = class {
|
|
|
30438
30427
|
*/
|
|
30439
30428
|
text = 'Loading...';
|
|
30440
30429
|
render() {
|
|
30441
|
-
return (h(Host, { key: '
|
|
30430
|
+
return (h(Host, { key: 'aef03bb4eda802193ad095b8ed007106427696bb' }, h("div", { key: '435b0e11a54ea4b84661a35b7307b20892da81e7', class: { 'loading-overlay': true, visible: this.visible }, "aria-hidden": this.visible ? 'false' : 'true' }, h("span", { key: '6b9e369889d77f08671de0459322ca8eb3b218b0', class: "loading-spinner" }), this.text)));
|
|
30442
30431
|
}
|
|
30443
30432
|
};
|
|
30444
30433
|
KritzelLoadingOverlay.style = kritzelLoadingOverlayCss();
|
|
@@ -30490,7 +30479,7 @@ const KritzelLoginDialog = class {
|
|
|
30490
30479
|
this.dialogClosed.emit();
|
|
30491
30480
|
};
|
|
30492
30481
|
render() {
|
|
30493
|
-
return (h(Host, { key: '
|
|
30482
|
+
return (h(Host, { key: '2af5a03ebc5f779527a18e0ebfaf3e603d907ec7' }, h("kritzel-dialog", { key: '10fd1178cb30985fbe3e88be0e3b276bd35d7e7f', dialogTitle: this.dialogTitle, isOpen: this.isDialogOpen, onDialogClose: this.closeDialog, size: "small", contained: true }, h("div", { key: '29ce2d7893a7bca3c62ae3a577c0652d30f62905', class: "login-content" }, this.subtitle && (h("p", { key: 'a70d440e724aa97050d361f2d54456e61192bc54', class: "login-subtitle" }, this.subtitle)), h("div", { key: '4ec6546c23b0ec9dccba77407bbff8d4fa43561f', class: "login-providers" }, this.providers.map(provider => (h("button", { key: provider.name, class: {
|
|
30494
30483
|
'provider-button': true,
|
|
30495
30484
|
'is-loading': this.loadingProvider === provider.name,
|
|
30496
30485
|
'is-disabled': this.loadingProvider !== null && this.loadingProvider !== provider.name,
|
|
@@ -30596,15 +30585,15 @@ const KritzelMasterDetail = class {
|
|
|
30596
30585
|
const selectedItem = this.items.find(item => item.id === this.selectedItemId);
|
|
30597
30586
|
const panelId = 'master-detail-panel';
|
|
30598
30587
|
const selectedTabId = selectedItem ? `tab-${selectedItem.id}` : undefined;
|
|
30599
|
-
return (h(Host, { key: '
|
|
30588
|
+
return (h(Host, { key: 'e363142a5175b1f711cebfc98cfeedf07cd2c6c3' }, h("div", { key: 'eebf863ecdb4a53289cb56e14c02977375781167', class: {
|
|
30600
30589
|
'master-detail-container': true,
|
|
30601
30590
|
'is-mobile-detail-visible': this.showMobileDetail,
|
|
30602
|
-
} }, h("nav", { key: '
|
|
30591
|
+
} }, h("nav", { key: '06660d3cd7de29ba46e3437169f99cb00eef1cc6', 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: {
|
|
30603
30592
|
'menu-item': true,
|
|
30604
30593
|
'is-selected': item.id === this.selectedItemId,
|
|
30605
30594
|
'is-disabled': !!item.disabled,
|
|
30606
30595
|
'is-focused': index === this.focusedIndex,
|
|
30607
|
-
}, 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: '
|
|
30596
|
+
}, 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: '0d6b6722ecbf64b28d27754161f861edafa3882c', id: panelId, class: "detail-panel", role: "tabpanel", "aria-labelledby": selectedTabId }, h("button", { key: '3d8ac88c0f8a7a840b5560c4917d74ff910a99c8', class: "mobile-back-button", onClick: this.handleBackClick, "aria-label": "Back to menu" }, h("kritzel-icon", { key: '03cf6ca5ea2b9d16ff21b1b38fd0b6148d35ff1f', name: "chevron-left", size: 20, class: "mobile-back-icon" }), "Back"), h("slot", { key: '3323357889024c0d2126c30d976c3ece7ddd706a' })))));
|
|
30608
30597
|
}
|
|
30609
30598
|
static get watchers() { return {
|
|
30610
30599
|
"selectedItemId": [{
|
|
@@ -30677,7 +30666,7 @@ const KritzelMenu = class {
|
|
|
30677
30666
|
this.itemCloseChildMenu.emit(event.detail);
|
|
30678
30667
|
};
|
|
30679
30668
|
render() {
|
|
30680
|
-
return (h(Host, { key: '
|
|
30669
|
+
return (h(Host, { key: '9edadb795e13a5242a0a086bd78c21f0f420e88c', tabIndex: 0, onClick: e => e.stopPropagation() }, this.openChildMenuItem && h("div", { key: '4925a8698c1ac61787ba8c44beeed46461c62625', 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 })))));
|
|
30681
30670
|
}
|
|
30682
30671
|
};
|
|
30683
30672
|
KritzelMenu.style = kritzelMenuCss();
|
|
@@ -30782,12 +30771,12 @@ const KritzelMenuItem = class {
|
|
|
30782
30771
|
];
|
|
30783
30772
|
}
|
|
30784
30773
|
render() {
|
|
30785
|
-
return (h(Host, { key: '
|
|
30774
|
+
return (h(Host, { key: '89e05e4ec01b4de48019a2459f625e34669b8429', tabIndex: this.item.isDisabled ? -1 : 0, class: {
|
|
30786
30775
|
'selected': this.item.isSelected,
|
|
30787
30776
|
'editing': this.item.isEditing,
|
|
30788
30777
|
'disabled': this.item.isDisabled,
|
|
30789
30778
|
'child-open': this.item.isChildMenuOpen,
|
|
30790
|
-
}, onClick: this.handleItemSelect }, h("div", { key: '
|
|
30779
|
+
}, onClick: this.handleItemSelect }, h("div", { key: '5de01524315482194c26e4bd4969f2ead4d852ec', class: "menu-item-overlay" }), this.item.isEditing ? this.renderEditMode() : this.renderViewMode()));
|
|
30791
30780
|
}
|
|
30792
30781
|
static get watchers() { return {
|
|
30793
30782
|
"item": [{
|
|
@@ -30860,7 +30849,7 @@ const KritzelMoreMenu = class {
|
|
|
30860
30849
|
this.closeMenu();
|
|
30861
30850
|
};
|
|
30862
30851
|
render() {
|
|
30863
|
-
return (h(Host, { key: '
|
|
30852
|
+
return (h(Host, { key: '74e62332a41aa59ea2748f4650856cc7fe40f0f7', class: { mobile: this.isTouchDevice }, style: { display: this.visible ? '' : 'none' } }, h("div", { key: '562935db827f826b4814bb18ad7a4f213f0a4a4c', class: { 'more-menu-wrapper': true, visible: this.visible } }, h("button", { key: '7dd522a43e8154d85edff6934ecce5253a1d1b4c', class: "more-menu-button", "data-testid": "more-menu-button", onClick: this.toggleMenu, "aria-label": this.terms['moreMenu.ariaLabel'] ?? 'More options' }, h("kritzel-icon", { key: '2787a984c3532b17c3eaad1d5b1ba1f3f55a9ae0', name: this.icon, size: this.iconSize })), h("kritzel-portal", { key: '448375148d9c024bf836b2f6555522f7cd553ebd', anchor: this.menuAnchor, offsetY: this.offsetY, onClose: this.closeMenu }, h("kritzel-menu", { key: '79b35fd2e5ea1050d07894d6eb7949c9ab14d1bc', items: this.visibleItems, onItemSelect: this.handleMenuItemSelect })))));
|
|
30864
30853
|
}
|
|
30865
30854
|
};
|
|
30866
30855
|
KritzelMoreMenu.style = kritzelMoreMenuCss();
|
|
@@ -31027,7 +31016,7 @@ const KritzelNumericInput = class {
|
|
|
31027
31016
|
this.valueChange.emit(newValue);
|
|
31028
31017
|
};
|
|
31029
31018
|
render() {
|
|
31030
|
-
return (h(Host, { key: '
|
|
31019
|
+
return (h(Host, { key: 'eb766b22717d856d096bd1a4a44279f6ac994892' }, h("div", { key: '2394e2b2af48f560e77e7a37b34d00656b0dd344', class: "input-container" }, this.label && h("label", { key: 'd8889aa93d4a86fa841f4da1f0b97411ab039cb1', class: "input-label" }, this.label), h("div", { key: 'b55ae2edf164cdfcdda356119b148c8bfb8fbd24', class: "input-wrapper" }, h("input", { key: 'ee1f1663f19c5ca66d64b6c5142005da318e03e4', 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: '82e127b045e631616e6368c437473bbf9732445d', class: "spinner-buttons" }, h("button", { key: 'e7412dffccbdacbb5743ae2e2e7bd33c68e6fceb', type: "button", class: "spinner-button spinner-up", onClick: this.handleIncrement, tabIndex: -1, "aria-label": "Increase value" }, h("svg", { key: '7e471bf2bee5d4d161fea2e838b26e2f28bb84d9', viewBox: "0 0 10 6", class: "spinner-icon" }, h("path", { key: '69e4c80eed03b2ee2a044d07f35420b7618f4e75', d: "M1 5L5 1L9 5", stroke: "currentColor", "stroke-width": "1.5", fill: "none", "stroke-linecap": "round", "stroke-linejoin": "round" }))), h("button", { key: 'a0c2350d48c398f7396cebd973438c0e390d0aff', type: "button", class: "spinner-button spinner-down", onClick: this.handleDecrement, tabIndex: -1, "aria-label": "Decrease value" }, h("svg", { key: 'c1f6264d187936d5eb0cc43c0275dc2e2c93b854', viewBox: "0 0 10 6", class: "spinner-icon" }, h("path", { key: 'facbdd171b43868ec41b469b0d11d6c9bfcec3aa', d: "M1 1L5 5L9 1", stroke: "currentColor", "stroke-width": "1.5", fill: "none", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))));
|
|
31031
31020
|
}
|
|
31032
31021
|
static get watchers() { return {
|
|
31033
31022
|
"value": [{
|
|
@@ -31066,7 +31055,7 @@ const KritzelOpacitySlider = class {
|
|
|
31066
31055
|
}
|
|
31067
31056
|
render() {
|
|
31068
31057
|
const percentage = this.getPercentage();
|
|
31069
|
-
return (h(Host, { key: '
|
|
31058
|
+
return (h(Host, { key: 'a175945928dac5ae5b4464c0b11c4d812f8a3ef6' }, h("div", { key: 'a045d452d459577f8d657e00dd9189797dd4de66', class: "opacity-container" }, h("div", { key: '11a4217a4b6e1f0b1981a8fd8e03f505a9d4a3b5', class: "slider-wrapper" }, h("input", { key: '2cbf72a10026c4201727208230b8832ea2309a76', type: "range", class: "opacity-slider", min: this.min, max: this.max, step: this.step, value: this.value, onInput: (e) => this.handleInput(e), style: {
|
|
31070
31059
|
'--slider-progress': `${percentage}%`,
|
|
31071
31060
|
'--kritzel-opacity-slider-thumb-border-color': this.previewColor,
|
|
31072
31061
|
} })))));
|
|
@@ -31419,7 +31408,7 @@ const KritzelPortal = class {
|
|
|
31419
31408
|
this.portal.style.visibility = 'visible';
|
|
31420
31409
|
}
|
|
31421
31410
|
render() {
|
|
31422
|
-
return (h(Host, { key: '
|
|
31411
|
+
return (h(Host, { key: 'f919789973cd7828b393028171594d481113fb45', style: { display: this.anchor ? 'block' : 'none' } }, h("slot", { key: '21b837fe7162c0a0a8d01bb5c41d3736a265714c' })));
|
|
31423
31412
|
}
|
|
31424
31413
|
static get watchers() { return {
|
|
31425
31414
|
"anchor": [{
|
|
@@ -31433,7 +31422,7 @@ const KritzelPortal = class {
|
|
|
31433
31422
|
* This file is auto-generated by the version bump scripts.
|
|
31434
31423
|
* Do not modify manually.
|
|
31435
31424
|
*/
|
|
31436
|
-
const KRITZEL_VERSION = '0.3.
|
|
31425
|
+
const KRITZEL_VERSION = '0.3.44';
|
|
31437
31426
|
|
|
31438
31427
|
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-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)}`;
|
|
31439
31428
|
|
|
@@ -31658,7 +31647,7 @@ const KritzelSettings = class {
|
|
|
31658
31647
|
}
|
|
31659
31648
|
}
|
|
31660
31649
|
render() {
|
|
31661
|
-
return (h(Host, { key: '
|
|
31650
|
+
return (h(Host, { key: '22874e24f0da09587a8a7101c0caca229927493d' }, h("kritzel-dialog", { key: '2b754b625e7ccabcfd7b64fdc383165dd5b65f6f', isOpen: this.isDialogOpen, dialogTitle: this.t('settings.dialogTitle', 'Settings'), size: "large", contained: true, onDialogClose: this.closeDialog }, h("kritzel-master-detail", { key: '0a3d94aa291bfb9fe2623714d50cc385ca89ed95', items: this.categories, selectedItemId: this.selectedCategoryId, onItemSelect: this.handleCategorySelect }, this.renderCategoryContent()))));
|
|
31662
31651
|
}
|
|
31663
31652
|
static get watchers() { return {
|
|
31664
31653
|
"settings": [{
|
|
@@ -34898,9 +34887,9 @@ const KritzelShareDialog = class {
|
|
|
34898
34887
|
this.dialogClosed.emit();
|
|
34899
34888
|
};
|
|
34900
34889
|
render() {
|
|
34901
|
-
return (h(Host, { key: '
|
|
34890
|
+
return (h(Host, { key: '043b7bdea68319cab7fdd76db95118c330dc83be' }, h("kritzel-dialog", { key: '407727c7f102d6297b9ced02c6d65212cbfdbae3', dialogTitle: this.terms['share.dialogTitle'] ?? 'Share Workspace', size: "small", isOpen: this.isDialogOpen, onDialogClose: this.closeDialog, contained: true }, h("div", { key: 'ab0d26fdc5997b67eca2f9fe588c471a5f728a72', class: "share-content" }, h("div", { key: '16a9a35a0cd7a6feb312a36a04fea0c10f176ea8', class: "share-section" }, h("div", { key: '1c23741949c4a707f6b7ca545c81cc29c3591d13', class: "share-row" }, h("div", { key: '216232db9f7a4eca44c3f73e725cd7108c38cf07', class: "share-label-group" }, h("label", { key: 'ba52982b1e5f123444f0534cacc234511aab5c19', class: "share-label" }, this.terms['share.linkSharing.label'] ?? 'Link sharing'), h("p", { key: '4d90ec84b0f2a498f849e800ec0c8715a5eb92bb', class: "share-description" }, this.internalIsPublic
|
|
34902
34891
|
? (this.terms['share.linkSharing.enabledDescription'] ?? 'Anyone with the link can access this workspace.')
|
|
34903
|
-
: (this.terms['share.linkSharing.disabledDescription'] ?? 'Link sharing is disabled. Only you can access this workspace.'))), h("kritzel-slide-toggle", { key: '
|
|
34892
|
+
: (this.terms['share.linkSharing.disabledDescription'] ?? 'Link sharing is disabled. Only you can access this workspace.'))), h("kritzel-slide-toggle", { key: 'd39e50798f00ecf419f3e64d43631a0b41e5ecdf', checked: this.internalIsPublic, onCheckedChange: this.handleToggleChange, label: this.terms['share.linkSharing.toggleLabel'] ?? 'Enable link sharing' }))), this.internalIsPublic && (h("div", { key: '505117184ff4980fe12ca1da756bf3cc0f2e91c8', class: "share-section" }, h("div", { key: 'b4c2775734c90db2770360c50e731b42268834d8', class: "share-url-container" }, h("input", { key: 'a157bd21521e70bee669f0822a24d077caafbcaf', type: "text", class: "share-url-input", value: this.getShareUrl(), readOnly: true, onClick: (e) => e.target.select() }), h("button", { key: '697e7d68794ab5e75773dc3458dab70bcc2d6456', 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: '8868df1dc879f73d5c902b4b8bd7333dc80ac611', name: this.copySuccess ? 'check' : 'copy', size: 18 }))), this.qrCodeDataUrl && (h("div", { key: 'c7da884ab7f18755867041fd3f9e0494349046f2', class: "share-qr-container" }, h("img", { key: 'e7912c25d3fd74555ef59bc33354e798352c492b', class: "share-qr-image", src: this.qrCodeDataUrl, alt: "QR code for share link" })))))))));
|
|
34904
34893
|
}
|
|
34905
34894
|
static get watchers() { return {
|
|
34906
34895
|
"isPublic": [{
|
|
@@ -34941,7 +34930,7 @@ const KritzelSlideToggle = class {
|
|
|
34941
34930
|
}
|
|
34942
34931
|
};
|
|
34943
34932
|
render() {
|
|
34944
|
-
return (h(Host, { key: '
|
|
34933
|
+
return (h(Host, { key: 'e132e2614dcf2c7afc51e8aa064de36ea4a84710', 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: 'c7857aa2b747aba1851f7df1bde3d0469898d32a', class: "toggle-track" }, h("div", { key: '6beb1821fdc265b4fb5d0a6813a33fb768366984', class: "toggle-thumb" }))));
|
|
34945
34934
|
}
|
|
34946
34935
|
};
|
|
34947
34936
|
KritzelSlideToggle.style = kritzelSlideToggleCss();
|
|
@@ -35041,7 +35030,7 @@ const KritzelSplitButton = class {
|
|
|
35041
35030
|
this.menuScrollTop = event.target.scrollTop;
|
|
35042
35031
|
};
|
|
35043
35032
|
render() {
|
|
35044
|
-
return (h(Host, { key: '
|
|
35033
|
+
return (h(Host, { key: 'b3b5b4a63df6e6a4bd2902716a8c26830e31127d', class: { mobile: this.isTouchDevice } }, h("button", { key: 'a25f723f41c1604172fa96d036eab6b80a22add5', class: "split-main-button", tabIndex: 0, onClick: this.handleButtonClick, disabled: this.mainButtonDisabled, "aria-label": "Main action" }, this.buttonIcon && h("kritzel-icon", { key: '6999b1baefa3c940c2a25772b0c03ab0c809cd79', name: this.buttonIcon })), h("div", { key: 'dcbff30cae4a73b5c214c0ae98b16c8d681b8eed', class: "split-divider" }), h("button", { key: 'bdbe0b300b3c5df31df58574ee055f05787acceb', 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: '66969517639c73140a745bc189730dfa09eafa08', name: this.dropdownIcon })), h("kritzel-portal", { key: '197d002ea78ddb535743d6d2f872b9779dfc462b', anchor: this.anchorElement, offsetY: 4, onClose: this.closeMenu }, h("kritzel-menu", { key: '15f1d42042e2368ff04e54f7872480f9f8841900', 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 }))));
|
|
35045
35034
|
}
|
|
35046
35035
|
};
|
|
35047
35036
|
KritzelSplitButton.style = kritzelSplitButtonCss();
|
|
@@ -35062,7 +35051,7 @@ const KritzelStrokeSize = class {
|
|
|
35062
35051
|
}
|
|
35063
35052
|
render() {
|
|
35064
35053
|
const sizes = this.sizes ?? [];
|
|
35065
|
-
return (h(Host, { key: '
|
|
35054
|
+
return (h(Host, { key: 'a097daf527501b07874b449ac75ecb765cdd81b2' }, h("div", { key: '0e2b3ade9bae7d4f97d5de8ecd44424fe914f3e7', class: "size-grid" }, sizes.map(size => (h("div", { tabIndex: 0, class: {
|
|
35066
35055
|
'size-container': true,
|
|
35067
35056
|
'selected': this.selectedSize === size,
|
|
35068
35057
|
}, onClick: () => this.handleSizeClick(size) }, h("kritzel-color", { value: 'var(--kritzel-global-text-primary)', size: size })))))));
|
|
@@ -35443,14 +35432,14 @@ const KritzelTooltip = class {
|
|
|
35443
35432
|
}
|
|
35444
35433
|
}
|
|
35445
35434
|
render() {
|
|
35446
|
-
return (h(Host, { key: '
|
|
35435
|
+
return (h(Host, { key: '4465ed45a4a145164e3b86baa2dbfbe6185574ed', style: {
|
|
35447
35436
|
position: 'fixed',
|
|
35448
35437
|
zIndex: '9999',
|
|
35449
35438
|
transition: 'opacity 0.3s ease-in-out, transform 0.3s ease-in-out',
|
|
35450
35439
|
visibility: this.isVisible ? 'visible' : 'hidden',
|
|
35451
35440
|
left: `${this.positionX}px`,
|
|
35452
35441
|
bottom: `${this.positionY}px`,
|
|
35453
|
-
} }, h("div", { key: '
|
|
35442
|
+
} }, h("div", { key: 'b98c28e7d1ecacb04534cb5044d2bee468c8a52c', class: "tooltip-content", onClick: event => event.stopPropagation(), onPointerDown: event => event.stopPropagation(), onMouseDown: event => event.stopPropagation() }, h("slot", { key: '42d05b850b4a87f8b2663d9462f3d05b641df1f1' }))));
|
|
35454
35443
|
}
|
|
35455
35444
|
static get watchers() { return {
|
|
35456
35445
|
"triggerElement": [{
|
|
@@ -35491,7 +35480,7 @@ const KritzelUtilityPanel = class {
|
|
|
35491
35480
|
this.redo.emit();
|
|
35492
35481
|
}
|
|
35493
35482
|
render() {
|
|
35494
|
-
return (h(Host, { key: '
|
|
35483
|
+
return (h(Host, { key: '4df4a9d89f12e576a7cf6a3037f4367e087b7c6a' }, h("button", { key: '037a0bebdf3de809ea38d497ee0e3730fba7f9ec', 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: '17a6b65f2aa78c4ed984840bdfd12b038c662b72', name: "undo" })), h("button", { key: '64ee5620ee3c77326623bdb2124c67f0ada881ae', 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: 'ae0be7d106422963f71f5136155c390ee75c9f3a', name: "redo" })), h("div", { key: 'dec02f58230b18a0e52612033839003f87eb9f73', class: "utility-separator" }), h("button", { key: 'c4226458bd087efc83745596e6c950931213c8fd', class: "utility-button", "data-testid": "utility-delete", onClick: () => this.delete.emit(), "aria-label": this.terms['utility.delete'] ?? 'Delete selected items' }, h("kritzel-icon", { key: 'a9e77780f3c607ee9c8d57de4a9f479f744c3de6', name: "delete" }))));
|
|
35495
35484
|
}
|
|
35496
35485
|
};
|
|
35497
35486
|
KritzelUtilityPanel.style = kritzelUtilityPanelCss();
|
|
@@ -35512,7 +35501,7 @@ const KritzelWatermark = class {
|
|
|
35512
35501
|
label;
|
|
35513
35502
|
render() {
|
|
35514
35503
|
const label = this.label ?? this.core.localizationManager.translate('watermark.poweredBy');
|
|
35515
|
-
return (h(Host, { key: '
|
|
35504
|
+
return (h(Host, { key: '143ea32342e30351c93751714dfd12b725ddca24' }, h("a", { key: '95fb2dfa0d806367e6a71dad3932b321d7ae5a76', class: "watermark-link", href: KRITZEL_WEBSITE_URL, target: "_blank", rel: "noopener noreferrer", part: "watermark", onPointerDown: (ev) => ev.stopPropagation(), onPointerUp: (ev) => ev.stopPropagation() }, label)));
|
|
35516
35505
|
}
|
|
35517
35506
|
};
|
|
35518
35507
|
KritzelWatermark.style = kritzelWatermarkCss();
|
|
@@ -35700,7 +35689,7 @@ const KritzelZoomPanel = class {
|
|
|
35700
35689
|
return Number.isFinite(this.zoomPercent) ? Math.max(1, Math.round(this.zoomPercent)) : 100;
|
|
35701
35690
|
}
|
|
35702
35691
|
render() {
|
|
35703
|
-
return (h(Host, { key: '
|
|
35692
|
+
return (h(Host, { key: '896039bb4a3e29ede6ef5eb596509d36a3543eb9' }, h("div", { key: 'c56e78040be3195b25b08f47b28dfb5217d6ed51', class: { panel: true, visible: this.visible } }, h("button", { key: 'd365dbfd6f1a855166dc75e194e8b3f9221006be', class: "zoom-button", type: "button", "aria-label": this.terms['zoom.zoomOut'] ?? 'Zoom out', disabled: this.disabled, onClick: this.handleZoomOut }, h("kritzel-icon", { key: '958e586cec30aedf5d6580b5825cd6d17da6c7d4', name: "minus" })), h("span", { key: 'f5de55de9d4711f46dc43f84105e2b1febde4a86', class: "zoom-level", "aria-live": "polite" }, this.normalizedZoomPercent, "%"), h("button", { key: 'f6e748d689fe845310d2a55f928fc3a90eae0aee', class: "zoom-button", type: "button", "aria-label": this.terms['zoom.zoomIn'] ?? 'Zoom in', disabled: this.disabled, onClick: this.handleZoomIn }, h("kritzel-icon", { key: '37644571a174917549a8bdc052c835b79dc5deb2', name: "plus" })))));
|
|
35704
35693
|
}
|
|
35705
35694
|
};
|
|
35706
35695
|
KritzelZoomPanel.style = kritzelZoomPanelCss();
|