kritzel-stencil 0.4.25 → 0.4.27

package/dist/cjs/{kritzel-active-users_47.cjs.entry.js → kritzel-active-users_46.cjs.entry.js}

@@ -1,7 +1,7 @@
 'use strict';
 
 var index = require('./index-Xav9JFHg.js');
-var schema_constants = require('./schema.constants-CjN-B633.js');
+var schema_constants = require('./schema.constants-CcvqL5nJ.js');
 var Y = require('yjs');
 require('y-indexeddb');
 require('y-websocket');
@@ -158,16 +158,16 @@ const KritzelAvatar = class {
             height: `${this.size}px`,
             fontSize: `${Math.round(this.size * 0.4)}px`,
         };
-        return (index.h(index.Host, { key: '90ce966bb2a374e68c544906c8c746df6cc01038', style: containerStyles, class: {
+        return (index.h(index.Host, { key: 'f199b56955b749b868ad8e7940ef3114f1109c37', style: containerStyles, class: {
                 'has-image': !!showImage,
                 'has-initials': !!showInitials,
                 'has-default': !!showDefaultIcon,
-            }, role: "img", "aria-label": this.getDisplayName() || 'User avatar' }, showImage && (index.h("img", { key: '6799f4ad45c7d40ebaf640f191171ed6a5f14ae9', src: imageUrl, alt: "", class: "avatar-image", ref: (el) => {
+            }, role: "img", "aria-label": this.getDisplayName() || 'User avatar' }, showImage && (index.h("img", { key: '621a58cc965cf6d037f8515e1263bd5bf4098ab0', src: imageUrl, alt: "", class: "avatar-image", ref: (el) => {
                 if (el) {
                     el.referrerPolicy = 'no-referrer';
                     el.crossOrigin = 'anonymous';
                 }
-            }, onError: this.handleImageError })), showInitials && (index.h("span", { key: '98cdcda64b900994b61a03179be9f2af17c489e8', class: "avatar-initials", style: { backgroundColor: this.getBackgroundColor() } }, initials)), showDefaultIcon && (index.h("span", { key: '64e6a6ee67017c927dce0b51810a5bb02fc0d6d1', class: "avatar-default" }, index.h("svg", { key: '42f99637a3c23aaf10fa7c99753347ede1d518c0', viewBox: "0 0 24 24", fill: "currentColor" }, index.h("path", { key: '28b52a68b36e98b0e14891fd225457be65f1bb46', 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" }))))));
+            }, onError: this.handleImageError })), showInitials && (index.h("span", { key: '28ff2e8b191c2d476c0f40dd57a2c8ec330ba104', class: "avatar-initials", style: { backgroundColor: this.getBackgroundColor() } }, initials)), showDefaultIcon && (index.h("span", { key: 'd2ef56b2fca2a609b5b99bb8d7e8747308ab9699', class: "avatar-default" }, index.h("svg", { key: '1c1d6e6e306a9938f559016eeb77a67aae42f536', viewBox: "0 0 24 24", fill: "currentColor" }, index.h("path", { key: '2c6af53101c20e137756d1194a3bac04c931066d', 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" }))))));
     }
     static get watchers() { return {
         "user": [{
@@ -492,7 +492,7 @@ const KritzelBackToContent = class {
         this.backToContent.emit();
     };
     render() {
-        return (index.h(index.Host, { key: '2576489b9f97c77d1931e7c8496bae968d998f9d' }, index.h("button", { key: 'da891543ce8a9b5ccd2f4a461bdcdc7f3f9ad266', class: { 'back-to-content-button': true, visible: this.visible }, onClick: this.handleClick, "aria-label": this.text }, index.h("kritzel-icon", { key: '4559cc932918707d5961c6237f3c5e23c9e4cc9d', name: "chevrons-left" }))));
+        return (index.h(index.Host, { key: '0a41ed93e39193416eebdaf786557bffd4653dd0' }, index.h("button", { key: '1f621de9699127a095e94d910d5c96328324b299', class: { 'back-to-content-button': true, visible: this.visible }, onClick: this.handleClick, "aria-label": this.text }, index.h("kritzel-icon", { key: '8ff49df055a0472edbbc57d84044a2de09b543c8', name: "chevrons-left" }))));
     }
 };
 KritzelBackToContent.style = kritzelBackToContentCss();
@@ -519,11 +519,11 @@ const KritzelButton = class {
         this.buttonClick.emit();
     };
     render() {
-        return (index.h(index.Host, { key: '51621006f6b085db2b43accf52192f0674d2c50c' }, index.h("button", { key: '01ab2d96abe5ad34285e59f6fec66f6b21e91849', type: this.type, class: {
+        return (index.h(index.Host, { key: 'b7d78dad25d41116ac6368c1ff2cd41ee28d9cdc' }, index.h("button", { key: '88cfd3674e63cd82ea5874205237415a540307b6', type: this.type, class: {
                 'kritzel-button': true,
                 [this.variant]: true,
                 'disabled': this.disabled,
-            }, disabled: this.disabled, onClick: this.handleClick }, index.h("slot", { key: '4b085139ea85ad9f836059f4cf2dde15b948e0e2' }))));
+            }, disabled: this.disabled, onClick: this.handleClick }, index.h("slot", { key: 'a7f4fd923800f66bc7ea438f2cbcdfde81b11ae1' }))));
     }
 };
 KritzelButton.style = kritzelButtonCss();
@@ -571,13 +571,13 @@ const KritzelColorComponent = class {
     render() {
         const resolvedColor = this.resolveColor();
         const isColorVeryLight = this.isLightColor(resolvedColor);
-        return (index.h(index.Host, { key: 'e797bfa6a2aed82d1913ec2f02f8b25a063564e5' }, index.h("div", { key: '5b62fcdbb2985b90fe0d7c7b65b507ec1c55e240', class: "checkerboard-bg", style: {
+        return (index.h(index.Host, { key: '17b5c44e1defe8f3fb41632391be093a12bb899b' }, index.h("div", { key: '545f4c4fd62dea22a4a5f36108a51d30c57f2652', class: "checkerboard-bg", style: {
                 width: `${this.size}px`,
                 height: `${this.size}px`,
                 borderRadius: '50%',
                 display: 'inline-block',
                 position: 'relative',
-            } }, index.h("div", { key: '2d62717ebf81be93219ebda7071c0ba992d7441a', class: {
+            } }, index.h("div", { key: 'bbcb68f6e5f00d9a33b316d52ac86e49911e463c', class: {
                 'color-circle': true,
                 'white': isColorVeryLight,
             }, style: {
@@ -633,7 +633,7 @@ const KritzelColorPalette = class {
     render() {
         const displayedColors = this.isExpanded ? this.colors : this.colors.slice(0, 6);
         const expandedHeight = this.isExpanded ? this.calculateHeight() : '32px';
-        return (index.h(index.Host, { key: '9a637b3a6946384a889f54dc3a635da7ff014439' }, index.h("div", { key: '4db8bbc7a234bfed26b60ed306a5f999875e2195', class: {
+        return (index.h(index.Host, { key: '5f25a2ead76106ba2ef9762b4d212d5a9d7ac2a8' }, index.h("div", { key: '764cc6a55cc1865aaf1c501ee89a161f74fefa1c', class: {
                 'color-grid': true,
                 'expanded': this.isExpanded,
             }, style: {
@@ -1202,13 +1202,13 @@ const KritzelControls = class {
         // Separate tool controls from config control
         const toolControls = this.internalControls.filter(c => c.type === 'tool' || c.type === 'separator');
         const configControl = this.internalControls.find(c => c.type === 'config' && c.name === this.firstConfig?.name);
-        return (index.h(index.Host, { key: '2a7595b72594df3e8ff9a103c3ff7dd70f0a8045', style: { display: this.visible ? '' : 'none' }, class: {
+        return (index.h(index.Host, { key: '42f84f104e4b008a7c53a5e1ea9290c17ba792d2', style: { display: this.visible ? '' : 'none' }, class: {
                 mobile: this.isTouchDevice,
-            } }, this.isUtilityPanelVisible && (index.h("kritzel-utility-panel", { key: '1c2d9f14c53944f291cf49cbcd1bf282ad8a8683', style: {
+            } }, this.isUtilityPanelVisible && (index.h("kritzel-utility-panel", { key: '8f6b3df9db735dfd847da9683db3fbdcc65b08a4', style: {
                 position: 'absolute',
                 bottom: '56px',
                 left: '12px',
-            }, undoState: this.undoState, terms: this.terms, onUndo: () => this.kritzelEngine?.undo(), onRedo: () => this.kritzelEngine?.redo(), onDelete: () => this.kritzelEngine?.delete() })), index.h("div", { key: '8ac30e183885bc106033ca163aa7e5927802e67c', class: "kritzel-controls" }, index.h("div", { key: '74b2808a506e671682aed91107c7c9e27aa4b2c7', class: { 'scroll-indicator-left': true, 'visible': this.canScrollLeft } }), index.h("div", { key: '3fd693c993d5b11eadd2eec7481214fbc1550301', class: "kritzel-tools-scroll", ref: el => (this.toolsScrollRef = el), onScroll: this.handleToolsScroll }, toolControls.map(control => {
+            }, undoState: this.undoState, terms: this.terms, onUndo: () => this.kritzelEngine?.undo(), onRedo: () => this.kritzelEngine?.redo(), onDelete: () => this.kritzelEngine?.delete() })), index.h("div", { key: '7a314d779882e2b42a39fdb2a52f434ccacff112', class: "kritzel-controls" }, index.h("div", { key: '23458bc04c2f1a610cff9c5e617d7be2c657bf4f', class: { 'scroll-indicator-left': true, 'visible': this.canScrollLeft } }), index.h("div", { key: 'b17d817767c92ce7a6edf279759d3f1fb1097911', class: "kritzel-tools-scroll", ref: el => (this.toolsScrollRef = el), onScroll: this.handleToolsScroll }, toolControls.map(control => {
             // Check if this control has sub-options (split-button)
             if (control.subOptions?.length) {
                 const selectedSubOption = this.getSelectedSubOption(control);
@@ -1238,10 +1238,10 @@ const KritzelControls = class {
                     'kritzel-control': true,
                     'selected': this.activeControl?.name === control?.name,
                 }, key: control.name, "data-testid": `tool-${control.name}`, onClick: _event => this.handleControlClick?.(control), "aria-label": control.name.charAt(0).toUpperCase() + control.name.slice(1) }, index.h("kritzel-icon", { name: control.icon })));
-        })), index.h("div", { key: '6f16a8332dc6a082f2e6aedbec3e31398f2a8b66', class: { 'scroll-indicator-right': true, 'visible': this.canScrollRight && !(configControl && this.activeControl && hasConfigUI) } }), configControl && this.activeControl && (index.h("div", { class: {
+        })), index.h("div", { key: '740b52666bf823b7dc504a1072f68b59f94a3773', class: { 'scroll-indicator-right': true, 'visible': this.canScrollRight && !(configControl && this.activeControl && hasConfigUI) } }), configControl && this.activeControl && (index.h("div", { class: {
                 'kritzel-config-container': true,
                 'visible': hasConfigUI,
-            }, key: configControl.name }, index.h("div", { key: '554d743fccfb62d8c368f2a5cdca232ae9842b7f', class: { 'config-gradient-left': true, 'visible': this.needsScrolling } }), index.h("kritzel-tooltip", { key: 'af97d986d82c961d66c910f7edabd6e597ec59ab', anchorElement: this.host.shadowRoot?.querySelector('.kritzel-config-container'), triggerElement: this.configTriggerRef }, index.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%' } })), index.h("div", { key: 'c6e3fe4a4a9b781db394073c8f929533487be760', tabIndex: hasConfigUI ? 0 : -1, class: "kritzel-config", "data-testid": "tool-config", ref: el => {
+            }, key: configControl.name }, index.h("div", { key: '7c5697faa2d03931ba9449b58a32e9f06166528e', class: { 'config-gradient-left': true, 'visible': this.needsScrolling } }), index.h("kritzel-tooltip", { key: '6e9bc7e5cf77778ec1dd2bee1c415344295acc00', anchorElement: this.host.shadowRoot?.querySelector('.kritzel-config-container'), triggerElement: this.configTriggerRef }, index.h("kritzel-tool-config", { key: 'fbfb910dacd4178aaffca5aa02e4e4422ba1b308', 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%' } })), index.h("div", { key: '59d11a83e8c9968ba8d50df4275a892b4b75958c', tabIndex: hasConfigUI ? 0 : -1, class: "kritzel-config", "data-testid": "tool-config", ref: el => {
                 if (el)
                     this.configTriggerRef = el;
             }, onKeyDown: event => {
@@ -1250,7 +1250,7 @@ const KritzelControls = class {
                 }
             }, style: {
                 cursor: 'pointer',
-            } }, this.displayValues && (index.h("div", { key: '9eeb3a9fc29f4848ee9f325d50b4cbfc5bfe5f1c', class: "color-container" }, index.h("kritzel-color", { key: '1d45edb7ed07a8d12ab55e374ea456b8e95c8d41', value: this.displayValues.color, theme: this.theme, size: 18, style: {
+            } }, this.displayValues && (index.h("div", { key: '0ce5a0d8f51773b6e31feeee785606d637e06b42', class: "color-container" }, index.h("kritzel-color", { key: '29cc12dd6677b695b14e76e8a1704da78f910698', value: this.displayValues.color, theme: this.theme, size: 18, style: {
                 borderRadius: '50%',
                 border: 'none',
             } })))))))));
@@ -1284,7 +1284,7 @@ const KritzelCurrentUser = class {
     /** Resolved localized strings keyed by term key, supplied by the editor. */
     terms = {};
     render() {
-        return (index.h(index.Host, { key: '19551eb12507f1384aedf3ca4ce5212eca509c24' }, index.h("kritzel-avatar", { key: 'e39405e8e6c2e77a8acf5f286fa3890e28e8ab17', user: this.user, size: this.avatarSize })));
+        return (index.h(index.Host, { key: '30f2cedeefdef5817fcced6b84e74b53beba76ec' }, index.h("kritzel-avatar", { key: '41dc69bfbc13471fc686bb52e269dc98d2bfa3a8', user: this.user, size: this.avatarSize })));
     }
 };
 KritzelCurrentUser.style = kritzelCurrentUserCss();
@@ -1325,7 +1325,7 @@ const KritzelCurrentUserDialog = class {
     }
     render() {
         const displayName = this.getDisplayName();
-        return (index.h(index.Host, { key: '8f8e63ac6f789f2d0ee43b8b7439634411a91ac9' }, index.h("kritzel-dialog", { key: '4022a7251881f669f290e0a8beb9a39ef6242b19', dialogTitle: this.terms['currentUser.dialogTitle'] ?? 'Account', isOpen: this.isDialogOpen, onDialogClose: this.closeDialog, size: "small", contained: true }, index.h("div", { key: '4671f884c121cfaefdd8a47bd52b30acc2d7b345', class: "user-info" }, index.h("kritzel-avatar", { key: 'a1847b4b67302f3b7179e4e2b751f7f2106b76d4', user: this.user, size: 80 }), displayName && index.h("div", { key: 'b3d09b4c99d76014a2e36260edce52c39f1081e1', class: "user-name" }, displayName), this.user?.email && index.h("div", { key: 'a76ce19cbd24ad536b022264dab6a83f4d1b36c2', class: "user-email" }, this.user.email), index.h("kritzel-button", { key: 'f125164a9d9362eedfbfff4fc2629f7ec055fc14', class: "logout-button", variant: "primary", onButtonClick: this.handleLogout }, this.terms['menu.logout'] ?? 'Logout')))));
+        return (index.h(index.Host, { key: '33baea01a828422f2bba5c2fba82dd82e5c5b32d' }, index.h("kritzel-dialog", { key: '5271e1eb5d36b74f8487c040e70424c26f7019f8', dialogTitle: this.terms['currentUser.dialogTitle'] ?? 'Account', isOpen: this.isDialogOpen, onDialogClose: this.closeDialog, size: "small", contained: true }, index.h("div", { key: '901697b9439eb8449f2f5c8e044c194f176633b1', class: "user-info" }, index.h("kritzel-avatar", { key: '76a17b9a2e4442b36b89747a5f5f168d2c59e7a1', user: this.user, size: 80 }), displayName && index.h("div", { key: '6aaedb1d2d8ea65de2460c15017d13b4e096223d', class: "user-name" }, displayName), this.user?.email && index.h("div", { key: '3cb78d0007087a18f798849f244399e5d6137e3b', class: "user-email" }, this.user.email), index.h("kritzel-button", { key: '67d416a1ac1be41cd6b658f79901cea29a287eb7', class: "logout-button", variant: "primary", onButtonClick: this.handleLogout }, this.terms['menu.logout'] ?? 'Logout')))));
     }
 };
 KritzelCurrentUserDialog.style = kritzelCurrentUserDialogCss();
@@ -2146,10 +2146,10 @@ const KRITZEL_WEBSITE_URL = 'https://kritzel.io';
  * Default sync configuration - None
  */
 const DEFAULT_SYNC_CONFIG = {
-    providers: [],
+    providers: [schema_constants.IndexedDBSyncProvider],
 };
 
-const kritzelEditorCss = () => `kritzel-editor{display:flex;margin:0;position:relative;container-type:inline-size;overflow:hidden;width:100%;height:100%;align-items:center;justify-content:center;touch-action:manipulation;user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-align:start;line-height:normal}.editor-content{position:absolute;inset:0}.editor-content>kritzel-engine{position:absolute;inset:0;z-index:0}kritzel-controls{position:absolute;z-index:1;left:0;right:0;margin-inline:auto;width:max-content;max-width:calc(100% - 16px);bottom:var(--kritzel-editor-controls-bottom, 14px);transition:transform var(--kritzel-editor-controls-transition-duration, 0.1s) var(--kritzel-editor-controls-transition, ease-in-out)}kritzel-controls.keyboard-open{transform:var(--kritzel-editor-controls-transform, translateY(300%))}.top-left-buttons{position:absolute;z-index:1;top:var(--kritzel-editor-top-left-buttons-top, 14px);left:var(--kritzel-editor-top-left-buttons-left, 14px);display:flex;align-items:flex-start;gap:8px}.top-center-notification-layer{position:absolute;top:var(--kritzel-editor-top-center-notification-top, 14px);left:0;right:0;z-index:var(--kritzel-editor-top-center-notification-z-index, 10001);display:flex;justify-content:center;pointer-events:none}.top-center-notification-container{width:min(90vw, 420px);pointer-events:auto;animation:kritzel-notification-slide-in var(--kritzel-editor-notification-animation-duration, 220ms)     var(--kritzel-editor-notification-animation-easing, cubic-bezier(0.22, 1, 0.36, 1))}.top-center-notification-container.is-dismissing{animation:kritzel-notification-fade-out var(--kritzel-editor-notification-dismiss-animation-duration, 180ms)     var(--kritzel-editor-notification-dismiss-animation-easing, ease-in) forwards}@keyframes kritzel-notification-slide-in{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes kritzel-notification-fade-out{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-6px)}}@media (prefers-reduced-motion: reduce){.top-center-notification-container{animation:none}}.top-right-buttons{position:absolute;z-index:1;top:var(--kritzel-editor-top-right-buttons-top, 14px);right:var(--kritzel-editor-top-right-buttons-right, 14px);display:flex;align-items:center;gap:8px}.bottom-left-buttons{position:absolute;z-index:1;left:var(--kritzel-editor-top-left-buttons-left, 14px);bottom:var(--kritzel-editor-controls-bottom, 14px);display:flex;align-items:flex-end}@container (max-width: 767px){.bottom-left-buttons{display:none}}.top-right-button{display:flex;align-items:center;justify-content:center;width:50px;height:50px;padding:0;border:var(--kritzel-split-button-border, 1px solid #ebebeb);border-radius:var(--kritzel-split-button-border-radius, 12px);background-color:var(--kritzel-split-button-background-color, #ffffff);cursor:var(--kritzel-global-pointer-cursor, pointer);box-shadow:var(--kritzel-split-button-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));transition:background-color 150ms ease;-webkit-tap-highlight-color:transparent}.top-right-button:hover{background-color:#f5f5f5}.top-right-button:active{background-color:#ebebeb}`;
+const kritzelEditorCss = () => `kritzel-editor{display:flex;margin:0;position:relative;container-type:inline-size;overflow:hidden;width:100%;height:100%;align-items:center;justify-content:center;touch-action:manipulation;user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-align:start;line-height:normal}.editor-content{position:absolute;inset:0}.editor-content>kritzel-engine{position:absolute;inset:0;z-index:0}kritzel-controls{position:absolute;z-index:2;left:0;right:0;margin-inline:auto;width:max-content;max-width:calc(100% - 16px);bottom:var(--kritzel-editor-controls-bottom, 14px);transition:transform var(--kritzel-editor-controls-transition-duration, 0.1s) var(--kritzel-editor-controls-transition, ease-in-out)}kritzel-controls.keyboard-open{transform:var(--kritzel-editor-controls-transform, translateY(300%))}.top-left-buttons{position:absolute;z-index:2;top:var(--kritzel-editor-top-left-buttons-top, 14px);left:var(--kritzel-editor-top-left-buttons-left, 14px);display:flex;align-items:flex-start;gap:8px}.top-center-notification-layer{position:absolute;top:var(--kritzel-editor-top-center-notification-top, 14px);left:0;right:0;z-index:var(--kritzel-editor-top-center-notification-z-index, 10001);display:flex;justify-content:center;pointer-events:none}.top-center-notification-container{width:min(90vw, 420px);pointer-events:auto;animation:kritzel-notification-slide-in var(--kritzel-editor-notification-animation-duration, 220ms)     var(--kritzel-editor-notification-animation-easing, cubic-bezier(0.22, 1, 0.36, 1))}.top-center-notification-container.is-dismissing{animation:kritzel-notification-fade-out var(--kritzel-editor-notification-dismiss-animation-duration, 180ms)     var(--kritzel-editor-notification-dismiss-animation-easing, ease-in) forwards}@keyframes kritzel-notification-slide-in{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes kritzel-notification-fade-out{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-6px)}}@media (prefers-reduced-motion: reduce){.top-center-notification-container{animation:none}}.top-right-buttons{position:absolute;z-index:2;top:var(--kritzel-editor-top-right-buttons-top, 14px);right:var(--kritzel-editor-top-right-buttons-right, 14px);display:flex;align-items:center;gap:8px}.bottom-left-buttons{position:absolute;z-index:2;left:var(--kritzel-editor-top-left-buttons-left, 14px);bottom:var(--kritzel-editor-controls-bottom, 14px);display:flex;align-items:flex-end}@container (max-width: 767px){.bottom-left-buttons{display:none}}.top-right-button{display:flex;align-items:center;justify-content:center;width:50px;height:50px;padding:0;border:var(--kritzel-split-button-border, 1px solid #ebebeb);border-radius:var(--kritzel-split-button-border-radius, 12px);background-color:var(--kritzel-split-button-background-color, #ffffff);cursor:var(--kritzel-global-pointer-cursor, pointer);box-shadow:var(--kritzel-split-button-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));transition:background-color 150ms ease;-webkit-tap-highlight-color:transparent}.top-right-button:hover{background-color:#f5f5f5}.top-right-button:active{background-color:#ebebeb}`;
 
 const KritzelEditor = class {
     constructor(hostRef) {
@@ -2168,7 +2168,6 @@ const KritzelEditor = class {
         this.login = index.createEvent(this, "login");
         this.isPublicChange = index.createEvent(this, "isPublicChange");
         this.awarenessChange = index.createEvent(this, "awarenessChange");
-        this.isSyncing = index.createEvent(this, "isSyncing");
     }
     get host() { return index.getElement(this); }
     scaleMax = ABSOLUTE_SCALE_MAX;
@@ -2381,15 +2380,12 @@ const KritzelEditor = class {
     isWorkspaceManagerVisible = true;
     isMoreMenuVisible = true;
     isZoomPanelVisible = true;
-    isObjectDistanceFadingActive = false;
     syncConfig = DEFAULT_SYNC_CONFIG;
     assetStorageConfig = schema_constants.DEFAULT_ASSET_STORAGE_CONFIG;
     /** The element to use as the target for the cursor. Defaults to the editor container if not set. */
     cursorTarget;
     /** Optional login configuration. When provided, a "Sign in" button is shown that opens a login dialog with the configured providers. */
     loginConfig;
-    /** Whether the editor is in a loading state. When true, a loading overlay is displayed. */
-    isLoading = false;
     /** Optional unique identifier for namespacing storage keys across multiple editor instances. */
     editorId;
     /** Optional workspace ID to set as active. If provided, the editor will automatically activate the workspace with this ID. */
@@ -2408,7 +2404,6 @@ const KritzelEditor = class {
     login;
     isPublicChange;
     awarenessChange;
-    isSyncing;
     isEngineReady = false;
     isControlsReady = false;
     isWorkspaceManagerReady = false;
@@ -2431,7 +2426,11 @@ const KritzelEditor = class {
     normalizedControls = [];
     resolvedMoreMenuItems = [];
     isLoadingOverlayVisible = false;
-    isSyncingIndicatorVisible = false;
+    loadingOverlayShowTimeout;
+    loadingOverlayHideTimeout;
+    loadingOverlayShownTimestamp;
+    loadingOverlayDelayMs = 300;
+    loadingOverlayMinDisplayDurationMs = 400;
     notificationDismissTimeout;
     notificationDismissAnimationTimeout;
     notificationDisplayDurationMs = 5000;
@@ -2811,6 +2810,8 @@ const KritzelEditor = class {
         this.setOsSpecificCssVariables();
     }
     disconnectedCallback() {
+        this.clearLoadingOverlayShowTimer();
+        this.clearLoadingOverlayHideTimer();
         this.clearNotificationDismissTimer();
         this.clearNotificationDismissAnimationTimer();
     }
@@ -2914,11 +2915,6 @@ const KritzelEditor = class {
         event.stopPropagation();
         this.awarenessChange.emit(event.detail);
     }
-    handleIsSyncingChange(event) {
-        event.stopPropagation();
-        this.isSyncingIndicatorVisible = event.detail;
-        this.isSyncing.emit(event.detail);
-    }
     handleNotificationsChange(event) {
         event.stopPropagation();
         this.clearNotificationDismissAnimationTimer();
@@ -2931,6 +2927,46 @@ const KritzelEditor = class {
         event.stopPropagation();
         this.contextMenuState = event.detail.isVisible ? event.detail : undefined;
     }
+    handleIsLoadingChange(event) {
+        console.log('isLoadingChange event:', event.detail);
+        event.stopPropagation();
+        this.clearLoadingOverlayShowTimer();
+        this.clearLoadingOverlayHideTimer();
+        if (event.detail) {
+            this.loadingOverlayShowTimeout = setTimeout(() => {
+                this.isLoadingOverlayVisible = true;
+                this.loadingOverlayShownTimestamp = Date.now();
+                this.loadingOverlayShowTimeout = undefined;
+            }, this.loadingOverlayDelayMs);
+            return;
+        }
+        if (this.isLoadingOverlayVisible && this.loadingOverlayShownTimestamp !== undefined) {
+            const elapsed = Date.now() - this.loadingOverlayShownTimestamp;
+            const remaining = this.loadingOverlayMinDisplayDurationMs - elapsed;
+            if (remaining > 0) {
+                this.loadingOverlayHideTimeout = setTimeout(() => {
+                    this.isLoadingOverlayVisible = false;
+                    this.loadingOverlayShownTimestamp = undefined;
+                    this.loadingOverlayHideTimeout = undefined;
+                }, remaining);
+                return;
+            }
+        }
+        this.isLoadingOverlayVisible = false;
+        this.loadingOverlayShownTimestamp = undefined;
+    }
+    clearLoadingOverlayShowTimer() {
+        if (this.loadingOverlayShowTimeout) {
+            clearTimeout(this.loadingOverlayShowTimeout);
+            this.loadingOverlayShowTimeout = undefined;
+        }
+    }
+    clearLoadingOverlayHideTimer() {
+        if (this.loadingOverlayHideTimeout) {
+            clearTimeout(this.loadingOverlayHideTimeout);
+            this.loadingOverlayHideTimeout = undefined;
+        }
+    }
     handleContextMenuActionSelected(event) {
         const contextMenuState = this.contextMenuState;
         if (!contextMenuState || !event.detail.action) {
@@ -3232,40 +3268,40 @@ const KritzelEditor = class {
         const isLoggedIn = this.isLoggedIn;
         const shouldShowCurrentUser = isLoggedIn;
         const shouldShowLoginButton = this.isReady && !!this.loginConfig && !isLoggedIn;
-        return (index.h(index.Host, { key: 'a24350a0c12d99ccb0d0ec3ab5975d0f1bf7f861' }, index.h("div", { key: 'bd7029567aeef8cba5290c2bf9937db1af113475', class: "editor-content", style: {
+        return (index.h(index.Host, { key: '247f9ad977943d29333094737c8904253ccab5c7' }, index.h("div", { key: 'e14e57a04ca7138690a4893f2ac14140e0532fd2', class: "editor-content", style: {
                 opacity: this.isEditorVisible ? '1' : '0',
                 visibility: this.isEditorVisible ? 'visible' : 'hidden',
                 transition: 'opacity 0.2s ease-in-out, visibility 0.2s ease-in-out',
-            } }, index.h("div", { key: 'f628dbd94d88c9bdb313a59d73ce86302c90e375', class: "top-left-buttons" }, index.h("kritzel-workspace-manager", { key: '5a82d054da31e47d3f8b5c6c403949a5fb97b9dd', visible: this.isWorkspaceManagerVisible, workspaces: this.workspaces, activeWorkspace: this.activeWorkspace, terms: this.resolvedTerms, onWorkspaceChange: event => (this.activeWorkspace = event.detail), onIsWorkspaceManagerReady: () => (this.isWorkspaceManagerReady = true) }), index.h("kritzel-back-to-content", { key: 'a5bccef36c8a49ef2cb7ec029def1c7ba71d1c31', visible: this.isBackToContentButtonVisible, text: this.resolvedTerms['backToContent.label'] ?? 'Back to content', onBackToContent: () => this.backToContent() })), this.activeNotification && (index.h("div", { key: 'c5c359b199528dd7b1b64a6a32ef349037357c5a', class: "top-center-notification-layer", role: "presentation" }, index.h("div", { key: 'a41cd6c67c56626c2b6f0eb12193af1f80d6a254', class: { 'top-center-notification-container': true, 'is-dismissing': this.isNotificationDismissing }, role: "presentation" }, index.h("kritzel-notification-card", { key: 'fb49769368ddf0fc74998a96dd26dc446ff2b386', notification: this.activeNotification, locale: this.locale, onDismiss: this.dismissNotification, onHoverChange: event => this.handleNotificationHoverChange(event) })))), this.contextMenuState && this.contextMenuState.items.length > 0 && (index.h("kritzel-context-menu", { key: '56f38790f477d08761d7542ed3794c52f1f73815', class: "context-menu", items: this.contextMenuState.items, objects: this.contextMenuState.objects, style: {
+            } }, index.h("div", { key: 'd9304408c6336c4b742b0e44d4a6d4dda5b2fad6', class: "top-left-buttons" }, index.h("kritzel-workspace-manager", { key: 'f44ca859cd70828c77a92607cbe5b9c26fd4a203', visible: this.isWorkspaceManagerVisible, workspaces: this.workspaces, activeWorkspace: this.activeWorkspace, terms: this.resolvedTerms, onWorkspaceChange: event => (this.activeWorkspace = event.detail), onIsWorkspaceManagerReady: () => (this.isWorkspaceManagerReady = true) }), index.h("kritzel-back-to-content", { key: '1c65e5fbcc34dd43b7986f6177b8eab2bd709ad8', visible: this.isBackToContentButtonVisible, text: this.resolvedTerms['backToContent.label'] ?? 'Back to content', onBackToContent: () => this.backToContent() })), this.activeNotification && (index.h("div", { key: '2f7715f5c7c128ec63f2fe60c508543db7dd571c', class: "top-center-notification-layer", role: "presentation" }, index.h("div", { key: '357014e172134af3a3d35af9978d14d23fadf7e3', class: { 'top-center-notification-container': true, 'is-dismissing': this.isNotificationDismissing }, role: "presentation" }, index.h("kritzel-notification-card", { key: '3962a562a8fc10b2bbdc1c8dd741a057e9e6df29', notification: this.activeNotification, locale: this.locale, onDismiss: this.dismissNotification, onHoverChange: event => this.handleNotificationHoverChange(event) })))), this.contextMenuState && this.contextMenuState.items.length > 0 && (index.h("kritzel-context-menu", { key: '669e6dae09d52e87dc22aa536f6f564f725f6c34', class: "context-menu", items: this.contextMenuState.items, objects: this.contextMenuState.objects, style: {
                 position: 'absolute',
                 left: `${this.contextMenuState.position.x}px`,
                 top: `${this.contextMenuState.position.y}px`,
                 zIndex: '10002',
-            }, onActionSelected: event => this.handleContextMenuActionSelected(event), onClose: () => this.hideContextMenu() })), index.h("kritzel-sync-indicator", { key: '4957b8bae0d7087d586c9d0c6da82cae905d7d08', visible: this.isSyncingIndicatorVisible, text: "Syncing..." }), index.h("kritzel-loading-overlay", { key: 'e2e99dc452245a2edf7a575ea5fb60aa91be20df', visible: this.isLoadingOverlayVisible, text: this.resolvedTerms['editor.loading'] ?? 'Loading...' }), index.h("kritzel-engine", { key: 'fcebe1cc1237c8649461f03679f9c76c05dde9c4', ref: el => {
+            }, onActionSelected: event => this.handleContextMenuActionSelected(event), onClose: () => this.hideContextMenu() })), index.h("kritzel-loading-overlay", { key: '40a32849c45b9b8240b3be427579cb6a6c63fa97', visible: this.isLoadingOverlayVisible, text: this.resolvedTerms['editor.loading'] ?? 'Loading...' }), index.h("kritzel-engine", { key: '424ec83a0e8e9c8174cd12439fff2b49898b8016', ref: el => {
                 if (el) {
                     this.engineRef = el;
                 }
-            }, 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), onIsSyncing: event => this.handleIsSyncingChange(event), onNotificationsChange: event => this.handleNotificationsChange(event), onContextMenuStateChange: event => this.handleContextMenuStateChange(event), onLoadingChange: event => (this.isLoadingOverlayVisible = event.detail) }), index.h("kritzel-controls", { key: '72b1a3f80bfedb3843d0d54159ad47793db69977', visible: this.isControlsVisible, class: { 'keyboard-open': this.isVirtualKeyboardOpen }, ref: el => {
+            }, workspace: this.activeWorkspace, activeWorkspaceId: this.activeWorkspaceId, editorId: this.editorId, syncConfig: this.syncConfig, assetStorageConfig: this.assetStorageConfig, user: this.user, scaleMax: this.scaleMax, lockDrawingScale: this.lockDrawingScale, scaleMin: this.scaleMin, cursorTarget: this.cursorTarget, 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), onContextMenuStateChange: event => this.handleContextMenuStateChange(event), onIsLoadingChange: event => this.handleIsLoadingChange(event) }), index.h("kritzel-controls", { key: 'e224d9cde14effc67b07f1f18597f45e3dc6d808', visible: this.isControlsVisible, class: { 'keyboard-open': this.isVirtualKeyboardOpen }, ref: el => {
                 if (el) {
                     this.controlsRef = el;
                 }
-            }, controls: this.normalizedControls, isUtilityPanelVisible: this.isUtilityPanelVisible, undoState: this.undoState ?? undefined, theme: this.theme, terms: this.resolvedTerms, onIsControlsReady: () => (this.isControlsReady = true) }), index.h("div", { key: '1684a320f1806ae9fdfcfcff115d01f5788737e7', class: "bottom-left-buttons" }, index.h("kritzel-zoom-panel", { key: '8e85652ded70df043d79c9cd73b226aaefa5d6d4', visible: this.isZoomPanelVisible, disabled: !this.isZoomingEnabled, zoomPercent: this.currentZoomPercent, terms: this.resolvedTerms, onZoomIn: () => this.zoomIn(), onZoomOut: () => this.zoomOut() })), index.h("div", { key: 'a836056bdae11324f4ce79da4b991281c1985358', class: "top-right-buttons" }, index.h("kritzel-settings", { key: 'e68f4e79bc053e03dc37c18ee153758d284b0d34', ref: el => {
+            }, controls: this.normalizedControls, isUtilityPanelVisible: this.isUtilityPanelVisible, undoState: this.undoState ?? undefined, theme: this.theme, terms: this.resolvedTerms, onIsControlsReady: () => (this.isControlsReady = true) }), index.h("div", { key: '767b369fd2b55329d953d8c55ea897c35b921584', class: "bottom-left-buttons" }, index.h("kritzel-zoom-panel", { key: 'abaa0a55d433fa1740071f32f8dfc1854c6ed157', visible: this.isZoomPanelVisible, disabled: !this.isZoomingEnabled, zoomPercent: this.currentZoomPercent, terms: this.resolvedTerms, onZoomIn: () => this.zoomIn(), onZoomOut: () => this.zoomOut() })), index.h("div", { key: 'eb9e71d97b2b4663f02a17022494d353fa4f877e', class: "top-right-buttons" }, index.h("kritzel-settings", { key: '10ef2f68f90a6ceb3ce0a3110245c58da7ee2492', ref: el => {
                 if (el) {
                     this.settingsRef = el;
                 }
-            }, 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) }), index.h("kritzel-export", { key: 'f1e9ea467d11b55dbe75d8b0252fd7f5ed37a1a2', ref: el => {
+            }, 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) }), index.h("kritzel-export", { key: 'd72b5006a608570c26a2981d03f4d15e9b0c8b30', ref: el => {
                 if (el) {
                     this.exportRef = el;
                 }
-            }, workspaceName: this.activeWorkspace?.name || 'workspace', terms: this.resolvedTerms, onExportPng: () => this.engineRef.exportViewportAsPng(), onExportSvg: () => this.engineRef.exportViewportAsSvg(), onExportJson: event => this.engineRef.downloadAsJson(event.detail) }), index.h("kritzel-active-users", { key: '01bb56bd37bc22e82be5a1175f597cdf724c4834', users: this.activeUsers }), shouldShowCurrentUser && index.h("kritzel-current-user", { key: '5470ef356a4d6332b380e8c75f02f0fccbe861cc', user: this.user, terms: this.resolvedTerms, onClick: () => this.currentUserDialogRef?.open() }), shouldShowCurrentUser && (index.h("kritzel-current-user-dialog", { key: '229551b18f0443944a96f7b8e833ff1aefb001f4', ref: el => {
+            }, workspaceName: this.activeWorkspace?.name || 'workspace', terms: this.resolvedTerms, onExportPng: () => this.engineRef.exportViewportAsPng(), onExportSvg: () => this.engineRef.exportViewportAsSvg(), onExportJson: event => this.engineRef.downloadAsJson(event.detail) }), index.h("kritzel-active-users", { key: 'cceafd7ae3f289edb351af4e614afca2385e196a', users: this.activeUsers }), shouldShowCurrentUser && index.h("kritzel-current-user", { key: '042fc9ce8487ea463f0ee77a5749786ed2931f07', user: this.user, terms: this.resolvedTerms, onClick: () => this.currentUserDialogRef?.open() }), shouldShowCurrentUser && (index.h("kritzel-current-user-dialog", { key: '7cce7677fbae0a1b897b2135f50e017df5409d32', ref: el => {
                 if (el) {
                     this.currentUserDialogRef = el;
                 }
-            }, user: this.user, terms: this.resolvedTerms, onLogoutRequest: this.handleCurrentUserLogout })), shouldShowLoginButton && index.h("kritzel-button", { key: '3d9a8ebbe62084e94348265f1f883bc80e625d9c', onButtonClick: () => this.loginDialogRef?.open() }, this.resolvedTerms['login.dialogTitle'] ?? 'Sign in'), index.h("kritzel-more-menu", { key: '9f7f763c330b27068bc371d98eb22a80adbf359e', items: this.resolvedMoreMenuItems, visible: this.isMoreMenuVisible, terms: this.resolvedTerms }), index.h("kritzel-share-dialog", { key: 'c60b860e22394a44270285dea45f02305a05c545', ref: el => {
+            }, user: this.user, terms: this.resolvedTerms, onLogoutRequest: this.handleCurrentUserLogout })), shouldShowLoginButton && index.h("kritzel-button", { key: '97cf48d83804dfa5220ce38500af3f96687354d2', onButtonClick: () => this.loginDialogRef?.open() }, this.resolvedTerms['login.dialogTitle'] ?? 'Sign in'), index.h("kritzel-more-menu", { key: '40a757fe355666e9306f2224d9ed9bf2c9b58f7a', items: this.resolvedMoreMenuItems, visible: this.isMoreMenuVisible, terms: this.resolvedTerms }), index.h("kritzel-share-dialog", { key: 'abb85b65a9d6196be701d35cbdf8bc3003d36bfe', ref: el => {
                 if (el) {
                     this.shareDialogRef = el;
                 }
-            }, isPublic: this.currentIsPublic, workspaceId: this.activeWorkspace?.id, terms: this.resolvedTerms, onToggleIsPublic: this.handleToggleIsPublic }), this.loginConfig && (index.h("kritzel-login-dialog", { key: '84d0fab11722a7be1d5824b3284f000502277dfc', ref: el => {
+            }, isPublic: this.currentIsPublic, workspaceId: this.activeWorkspace?.id, terms: this.resolvedTerms, onToggleIsPublic: this.handleToggleIsPublic }), this.loginConfig && (index.h("kritzel-login-dialog", { key: '6e8c86420a447b182bcbc23415d64a7fcb32a4a8', ref: el => {
                 if (el) {
                     this.loginDialogRef = el;
                 }
@@ -22311,14 +22347,6 @@ class KritzelObjectMap {
     _lastAwarenessEmitTime = 0;
     _awarenessEmitTimeout = null;
     AWARENESS_THROTTLE_INTERVAL = 100; // milliseconds
-    // Identities of the raw network-provider instances (e.g. WebsocketProvider, HocuspocusProvider)
-    // that Yjs tags as transaction origin for remote updates; local providers (IndexedDB,
-    // BroadcastChannel) never appear here, so their transactions never toggle isSyncing.
-    _networkTransactionOrigins = new Set();
-    _isSyncing = false;
-    _syncingChangeCallbacks = [];
-    _beforeTransactionHandler = null;
-    _afterAllTransactionsHandler = null;
     /**
      * When true, update() only modifies local state (quadtree + idMap)
      * without writing to Yjs. Used during drag operations to avoid
@@ -22494,22 +22522,6 @@ class KritzelObjectMap {
             this._objectsChangeCallbacks = this._objectsChangeCallbacks.filter(existingCallback => existingCallback !== callback);
         };
     }
-    /**
-     * Whether the local copy currently differs from data a remote peer is in the process of merging in.
-     */
-    get isSyncing() {
-        return this._isSyncing;
-    }
-    /**
-     * Registers a callback invoked when a remote sync starts (`true`) or finishes (`false`).
-     * "Starts" fires from `beforeTransaction`, before the incoming remote update is merged.
-     */
-    onSyncingChange(callback) {
-        this._syncingChangeCallbacks.push(callback);
-        return () => {
-            this._syncingChangeCallbacks = this._syncingChangeCallbacks.filter(existingCallback => existingCallback !== callback);
-        };
-    }
     /**
      * Returns the Yjs UndoManager instance for managing undo/redo operations.
      * @returns The UndoManager instance, or `null` if not initialized
@@ -22603,36 +22615,6 @@ class KritzelObjectMap {
             const providerList = this._providers.map(p => `${p.constructor.name} (${p.type})`).join(', ');
             console.info(`[Kritzel] Workspace sync providers initialized for ${docName}: ${providerList || 'none'}`);
         }
-        // Only network providers (WebSocket, Hocuspocus) represent a genuine remote peer;
-        // local providers (IndexedDB, BroadcastChannel) never appear as a transaction origin here,
-        // so loading from IndexedDB or a same-device tab never toggles isSyncing.
-        this._networkTransactionOrigins = new Set(this._providers
-            .filter(p => p.type === 'network')
-            .map(p => p.rawProvider)
-            .filter((origin) => origin != null));
-        // Fires before a remote-origin transaction integrates its update, so this always
-        // precedes any local/remote reconciliation for that update.
-        this._beforeTransactionHandler = transaction => {
-            if (this._isSyncing || !this._networkTransactionOrigins.has(transaction.origin)) {
-                return;
-            }
-            this._isSyncing = true;
-            this._syncingChangeCallbacks.forEach(callback => callback(true));
-        };
-        // Fires once a batch of transactions (possibly several remote updates) has fully settled.
-        this._afterAllTransactionsHandler = (_doc, transactions) => {
-            if (!this._isSyncing) {
-                return;
-            }
-            const hadRemoteTransaction = transactions.some(transaction => this._networkTransactionOrigins.has(transaction.origin));
-            if (!hadRemoteTransaction) {
-                return;
-            }
-            this._isSyncing = false;
-            this._syncingChangeCallbacks.forEach(callback => callback(false));
-        };
-        this._ydoc.on('beforeTransaction', this._beforeTransactionHandler);
-        this._ydoc.on('afterAllTransactions', this._afterAllTransactionsHandler);
         // captureTimeout is effectively infinite — undo-step boundaries are
         // marked explicitly via markUndoBoundary() in insert/remove/reset and
         // at stroke/gesture boundaries in the tools. This prevents a single
@@ -23381,20 +23363,11 @@ class KritzelObjectMap {
             p.destroy();
         });
         this._providers = [];
-        this._networkTransactionOrigins = new Set();
         // Clear object map references
         this._objectsMap = null;
         this._metadataMap = null;
         // Destroy Y.Doc
         if (this._ydoc) {
-            if (this._beforeTransactionHandler) {
-                this._ydoc.off('beforeTransaction', this._beforeTransactionHandler);
-                this._beforeTransactionHandler = null;
-            }
-            if (this._afterAllTransactionsHandler) {
-                this._ydoc.off('afterAllTransactions', this._afterAllTransactionsHandler);
-                this._afterAllTransactionsHandler = null;
-            }
             this._ydoc.destroy();
             this._ydoc = null;
         }
@@ -23404,8 +23377,6 @@ class KritzelObjectMap {
         this._workspaceId = null;
         this._isReady = false;
         this._temporaryItemsCount = 0;
-        this._isSyncing = false;
-        this._syncingChangeCallbacks = [];
     }
 }
 
@@ -25256,10 +25227,6 @@ class KritzelCore {
         objectsMap.onAwarenessChange(states => {
             this.engine.emitAwarenessChange(states);
         });
-        // Forward remote sync start/finish to the engine as events
-        objectsMap.onSyncingChange(isSyncing => {
-            this.engine.emitIsSyncing(isSyncing);
-        });
         // Rebuild anchor index after loading objects
         this._anchorManager.rebuildIndex();
         this.engine.emitObjectsChange();
@@ -27924,11 +27891,6 @@ const KritzelEngine = class {
     isPanningEnabled = true;
     /** When false, Ctrl+wheel events do not zoom the viewport. */
     isZoomingEnabled = true;
-    /** External loading state. Combined with internal workspace-loading state to drive the overlay. */
-    isLoading = false;
-    onIsLoadingChange() {
-        this.syncLoadingState();
-    }
     /** Emitted when the engine has fully initialized and is ready for interaction. */
     isEngineReady;
     /** Emitted when the active drawing tool changes. */
@@ -27957,14 +27919,12 @@ const KritzelEngine = class {
     viewportChange;
     /** Emitted when the awareness state changes (remote user cursors, presence). */
     awarenessChange;
-    /** Emitted when a remote sync starts (`true`, data differs from the local copy) or finishes (`false`). */
-    isSyncing;
     /** Emitted when notifications change. */
     notificationsChange;
     /** Emitted when context-menu visibility, items, or position changes. */
     contextMenuStateChange;
-    /** Emitted when the combined loading state (external `isLoading` prop or internal workspace loading) changes. */
-    loadingChange;
+    /** Emitted while the selected workspace's objects are being initialized and synchronized. */
+    isLoadingChange;
     forceUpdate = 0;
     /** Manually triggers the `objectsSelectionChange` event. */
     async triggerSelectionChange() {
@@ -29542,7 +29502,6 @@ const KritzelEngine = class {
     _syncInitPromise = null;
     _syncConfigRevision = 0;
     _assetStorageConfigRevision = 0;
-    _isWorkspaceLoading = false;
     _hasLoggedUnlicensedWelcomeBanner = false;
     _previousVisibleCustomElements = new Set();
     _revealedImageKeys = new Set();
@@ -29561,9 +29520,12 @@ const KritzelEngine = class {
     _objectDistanceFadeCloseStartScale = 2;
     _objectDistanceFadeCloseMaxScale = 4;
     _objectDistanceFadeCloseMinOpacity = 0;
-    syncLoadingState() {
-        this.core.store.state.isLoading = this._isWorkspaceLoading || this.isLoading;
-        this.loadingChange.emit(this.core.store.state.isLoading);
+    setLoadingState(isLoading) {
+        if (this.core.store.state.isLoading === isLoading) {
+            return;
+        }
+        this.core.store.state.isLoading = isLoading;
+        this.isLoadingChange.emit(isLoading);
     }
     isNetworkAvailable() {
         return typeof navigator !== 'undefined' && navigator.onLine;
@@ -29667,10 +29629,9 @@ const KritzelEngine = class {
         this.objectsInViewportChange = index.createEvent(this, "objectsInViewportChange");
         this.viewportChange = index.createEvent(this, "viewportChange");
         this.awarenessChange = index.createEvent(this, "awarenessChange");
-        this.isSyncing = index.createEvent(this, "isSyncing");
         this.notificationsChange = index.createEvent(this, "notificationsChange");
         this.contextMenuStateChange = index.createEvent(this, "contextMenuStateChange");
-        this.loadingChange = index.createEvent(this, "loadingChange");
+        this.isLoadingChange = index.createEvent(this, "isLoadingChange");
         this.core = new KritzelCore(this);
     }
     disconnectedCallback() {
@@ -29727,8 +29688,6 @@ const KritzelEngine = class {
             this.core.store.state.debugInfo = this.debugInfo;
             this.core.assetResolver.setShowInfo(this.debugInfo.showAssetResolverInfo);
         }
-        this._isWorkspaceLoading = true;
-        this.syncLoadingState();
     }
     async componentDidLoad() {
         setTimeout(async () => {
@@ -29866,15 +29825,7 @@ const KritzelEngine = class {
         if (!this.core.appStateMap.hasNetworkSyncProvider || !this.isNetworkAvailable()) {
             return;
         }
-        this._isWorkspaceLoading = true;
-        this.syncLoadingState();
-        try {
-            await this.core.appStateMap.whenNetworkSynced();
-        }
-        finally {
-            this._isWorkspaceLoading = false;
-            this.syncLoadingState();
-        }
+        await this.core.appStateMap.whenNetworkSynced();
     }
     resolveStartupWorkspace() {
         if (this.activeWorkspaceId) {
@@ -29923,21 +29874,21 @@ const KritzelEngine = class {
             await this._workspaceInitializationPromise;
             return;
         }
-        this._isWorkspaceLoading = true;
-        this.syncLoadingState();
+        this.setLoadingState(true);
         const initializationPromise = this.core.initializeWorkspace(workspace, options);
+        const objectsMap = this.core.store.objects;
         this._workspaceInitializationPromise = initializationPromise;
         this._workspaceInitializationTargetKey = targetKey;
         try {
             await initializationPromise;
+            await objectsMap?.whenNetworkSynced();
         }
         finally {
             // Only the most recent init clears loading state to prevent race conditions
             if (this._workspaceInitializationPromise === initializationPromise) {
                 this._workspaceInitializationPromise = null;
                 this._workspaceInitializationTargetKey = null;
-                this._isWorkspaceLoading = false;
-                this.syncLoadingState();
+                this.setLoadingState(false);
             }
         }
     }
@@ -29974,9 +29925,6 @@ const KritzelEngine = class {
     emitAwarenessChange(states) {
         this.awarenessChange.emit(states);
     }
-    emitIsSyncing(isSyncing) {
-        this.isSyncing.emit(isSyncing);
-    }
     emitObjectsInViewportChange() {
         const visibleObjects = this.core.store.objectsInViewport;
         this.objectsInViewportChange.emit(visibleObjects);
@@ -30649,9 +30597,6 @@ const KritzelEngine = class {
             }],
         "debugInfo": [{
                 "onDebugInfoChange": 0
-            }],
-        "isLoading": [{
-                "onIsLoadingChange": 0
             }]
     }; }
 };
@@ -30735,7 +30680,7 @@ const KritzelExport = class {
         return (index.h("div", { class: "export-tab-content" }, index.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 })));
     }
     render() {
-        return (index.h(index.Host, { key: '64a9957ef87799215f9274213ead958a895dd8ef' }, index.h("kritzel-dialog", { key: '59ad70cc7d2834f5ecac3a659189390015cd26cb', isOpen: this.isDialogOpen, dialogTitle: this.terms['export.dialogTitle'] ?? 'Export', closable: true, contained: true, onDialogClose: this.closeDialog }, index.h("div", { key: 'fc9247f5b3848def87e6f6a6044d3fb1e63594ac', class: "export-content" }, index.h("kritzel-pill-tabs", { key: '54da74bbbd206b5e596865081cc5fe65bf8a776f', tabs: this.tabs, value: this.activeTab, onValueChange: this.handleTabChange }), this.activeTab === 'viewport' && this.renderViewportExport(), this.activeTab === 'workspace' && this.renderWorkspaceExport()), index.h("div", { key: 'b8e748034496936bf000a8eb111f52d58bf28d20', slot: "footer" }, index.h("button", { key: 'b7a59f3882146b45a0eb8395ea1c45cb41af0f34', class: "export-primary-button", onClick: this.handleExport }, this.terms['export.exportButton'] ?? 'Export')))));
+        return (index.h(index.Host, { key: '61ce7589d0453a1bd9fde8f33a711e06225eacde' }, index.h("kritzel-dialog", { key: '48da046edabdb5659b6edefaca56adb7531f9862', isOpen: this.isDialogOpen, dialogTitle: this.terms['export.dialogTitle'] ?? 'Export', closable: true, contained: true, onDialogClose: this.closeDialog }, index.h("div", { key: 'b7afc64ad1f558a78aa68c07b4dec65e6ca21c67', class: "export-content" }, index.h("kritzel-pill-tabs", { key: '59f759ade5a590eda6ba87f89eb433ced62da0cd', tabs: this.tabs, value: this.activeTab, onValueChange: this.handleTabChange }), this.activeTab === 'viewport' && this.renderViewportExport(), this.activeTab === 'workspace' && this.renderWorkspaceExport()), index.h("div", { key: 'a38bf30c9c5256d417cd3b0baf743e245a8cf3e4', slot: "footer" }, index.h("button", { key: '3dc9c53416ff9c8ca47df003f41767a2143fa4ef', class: "export-primary-button", onClick: this.handleExport }, this.terms['export.exportButton'] ?? 'Export')))));
     }
 };
 KritzelExport.style = kritzelExportCss();
@@ -30750,7 +30695,7 @@ const KritzelFont = class {
     size = 24;
     color = '#000000';
     render() {
-        return (index.h(index.Host, { key: '42f058426e2afcc49c788f2385e23a5ff153e77c' }, index.h("div", { key: '962dfc48ba84c5f5d2b98eb2464c69c04764ab0f', class: "font-preview", style: {
+        return (index.h(index.Host, { key: '08ef3f41967f34f17cbbc42982b0edbb59edb2e2' }, index.h("div", { key: 'dc7b64d53dbee634a2da068c618a352e6b43bea7', class: "font-preview", style: {
                 fontFamily: this.fontFamily,
                 fontSize: `${this.size}px`,
                 color: this.color
@@ -30834,7 +30779,7 @@ const KritzelFontSize = class {
     render() {
         const color = 'var(--kritzel-global-text-primary)';
         const sizes = this.sizes ?? [];
-        return (index.h(index.Host, { key: '9d6592f049c25e9dfa2f6f3a270feb2440aa7f35' }, sizes.map(size => (index.h("div", { tabIndex: 0, class: {
+        return (index.h(index.Host, { key: 'c49be084faa8b5eb380ba9bc3382ba8404853e20' }, sizes.map(size => (index.h("div", { tabIndex: 0, class: {
                 'size-container': true,
                 'selected': this.selectedSize === size,
             }, onClick: () => this.handleSizeClick(size), onKeyDown: event => this.handleKeyDown(event, size) }, index.h("kritzel-font", { fontFamily: this.fontFamily, size: size, color: color }))))));
@@ -30901,7 +30846,7 @@ const KritzelInput = class {
         this.valueChange.emit(input.value);
     };
     render() {
-        return (index.h(index.Host, { key: 'a4d86101322da32c87a62ac8bb05edb7015ede2a' }, index.h("div", { key: 'abc5b007af0f6f9353e0b680636c92813ee1ef49', class: "input-container" }, this.label && index.h("label", { key: 'f79e02a925aa6bd1b6cd48fc4225e441695ff893', class: "input-label" }, this.label), index.h("div", { key: 'e2937d2ad1def996e1937a9dd711578a3f9b6494', class: { 'input-wrapper': true, 'has-suffix': !!this.suffix } }, index.h("input", { key: '8bc45cc6f2603bec30f2299286d03beacd8c07fb', type: this.type, class: "text-input", value: this.inputValue, placeholder: this.placeholder, disabled: this.disabled, onInput: this.handleInput }), this.suffix && index.h("span", { key: '917fb6fa6c5fe62ab0f1e5c83f09aedd22623353', class: "input-suffix" }, this.suffix)))));
+        return (index.h(index.Host, { key: '92393344834011156bda2f682e559e7806864d19' }, index.h("div", { key: '5d569b8746d9285701259979ec554dbb41df4490', class: "input-container" }, this.label && index.h("label", { key: 'a27844d3da23d353b0ea2dede3c664fdbcbb6aab', class: "input-label" }, this.label), index.h("div", { key: 'fab4f3f1bda07c78f39ea96ba87c42be5de08286', class: { 'input-wrapper': true, 'has-suffix': !!this.suffix } }, index.h("input", { key: '4294687bc9f6006b0b64427c111af08d82ad5ffd', type: this.type, class: "text-input", value: this.inputValue, placeholder: this.placeholder, disabled: this.disabled, onInput: this.handleInput }), this.suffix && index.h("span", { key: '83adbd2978c92e969fedd9ad75f2c89b017b31a5', class: "input-suffix" }, this.suffix)))));
     }
     static get watchers() { return {
         "value": [{
@@ -30994,7 +30939,7 @@ const KritzelLineEndings = class {
 };
 KritzelLineEndings.style = kritzelLineEndingsCss();
 
-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}}`;
+const kritzelLoadingOverlayCss = () => `:host{position:absolute;inset:0;z-index:var(--kritzel-editor-loading-overlay-z-index, 1);display:block;pointer-events:none}.loading-overlay{position:absolute;inset:0;z-index:0;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;transition:opacity 300ms ease,     visibility 0s linear 300ms}.loading-overlay.visible{opacity:1;pointer-events:all;visibility:visible;transition:opacity 300ms ease,     visibility 0s linear 0s}.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)}}`;
 
 const KritzelLoadingOverlay = class {
     constructor(hostRef) {
@@ -31009,7 +30954,7 @@ const KritzelLoadingOverlay = class {
      */
     text = 'Loading...';
     render() {
-        return (index.h(index.Host, { key: '6fc1886217516966fa3599473989748151d93efd' }, index.h("div", { key: 'c6f2aa1c7f81bbab65411292934d185b4bf69e5a', class: { 'loading-overlay': true, visible: this.visible }, "aria-hidden": this.visible ? 'false' : 'true' }, index.h("span", { key: '21bae0b6f9b9a08f814aec7e6635a904018ab839', class: "loading-spinner" }), this.text)));
+        return (index.h(index.Host, { key: '6795ffc47d57a27f0b58fb42715080bf47c836af' }, index.h("div", { key: '5359411fa326444a1bddf6f40a6e2bd0ccf1617d', class: { 'loading-overlay': true, visible: this.visible }, "aria-hidden": this.visible ? 'false' : 'true' }, index.h("span", { key: 'bd194c6fef9f2fbc4a4e38aee169d0a754e5dc96', class: "loading-spinner" }), this.text)));
     }
 };
 KritzelLoadingOverlay.style = kritzelLoadingOverlayCss();
@@ -31061,7 +31006,7 @@ const KritzelLoginDialog = class {
         this.dialogClosed.emit();
     };
     render() {
-        return (index.h(index.Host, { key: '97532a2eeb125a2692117228ec3c77907c90d021' }, index.h("kritzel-dialog", { key: '60597c3d75f532a3c73aab983bed683bea243eac', dialogTitle: this.dialogTitle, isOpen: this.isDialogOpen, onDialogClose: this.closeDialog, size: "small", contained: true }, index.h("div", { key: 'cb086e90c5981f8c3d5fc65e7b94675884a255dc', class: "login-content" }, this.subtitle && (index.h("p", { key: '0ac0e31a5bf8d8a3e24b7df1d388f1cdc6951bd7', class: "login-subtitle" }, this.subtitle)), index.h("div", { key: '6057615670a1758581d0c518bb2809b88af0672e', class: "login-providers" }, this.providers.map(provider => (index.h("button", { key: provider.name, class: {
+        return (index.h(index.Host, { key: '17fe69ac34171a95bec92dcabc3196fe77549ede' }, index.h("kritzel-dialog", { key: '38ea1c3ed74675b21456cf8c1bfe1b97be029bf4', dialogTitle: this.dialogTitle, isOpen: this.isDialogOpen, onDialogClose: this.closeDialog, size: "small", contained: true }, index.h("div", { key: '63b04f629c2d09a1ce6aeab90118bcac50d59fbc', class: "login-content" }, this.subtitle && (index.h("p", { key: '641597f030c268f2ffc90c914e53fd00fc131c74', class: "login-subtitle" }, this.subtitle)), index.h("div", { key: 'f36dc7b791d1beada21d7786c108319dedb516b9', class: "login-providers" }, this.providers.map(provider => (index.h("button", { key: provider.name, class: {
                 'provider-button': true,
                 'is-loading': this.loadingProvider === provider.name,
                 'is-disabled': this.loadingProvider !== null && this.loadingProvider !== provider.name,
@@ -31167,15 +31112,15 @@ const KritzelMasterDetail = class {
         const selectedItem = this.items.find(item => item.id === this.selectedItemId);
         const panelId = 'master-detail-panel';
         const selectedTabId = selectedItem ? `tab-${selectedItem.id}` : undefined;
-        return (index.h(index.Host, { key: '0166376f16ebb098049cd2ef5539a86086a5570e' }, index.h("div", { key: 'f5091fe672bc4751c8f66d43baa5c1fc86fca034', class: {
+        return (index.h(index.Host, { key: 'fc187266604f9d48210096a1574bf86482498a40' }, index.h("div", { key: '2886b386c6e96df671ff4902b2c9f7084f0c3191', class: {
                 'master-detail-container': true,
                 'is-mobile-detail-visible': this.showMobileDetail,
-            } }, index.h("nav", { key: '66f5c61ea0308ea9ae1339526e86dcf1ee51fc0a', class: "master-menu", role: "tablist", "aria-orientation": "vertical", "aria-label": "Settings categories" }, this.items.map((item, index$1) => (index.h("button", { key: item.id, id: `tab-${item.id}`, ref: el => this.setTabRef(el, index$1), class: {
+            } }, index.h("nav", { key: '94a35861b7c97d7f5f1505e4c25bc7f584c6351f', class: "master-menu", role: "tablist", "aria-orientation": "vertical", "aria-label": "Settings categories" }, this.items.map((item, index$1) => (index.h("button", { key: item.id, id: `tab-${item.id}`, ref: el => this.setTabRef(el, index$1), class: {
                 'menu-item': true,
                 'is-selected': item.id === this.selectedItemId,
                 'is-disabled': !!item.disabled,
                 'is-focused': index$1 === this.focusedIndex,
-            }, role: "tab", "aria-selected": item.id === this.selectedItemId ? 'true' : 'false', "aria-controls": panelId, "aria-disabled": item.disabled ? 'true' : undefined, tabIndex: this.getTabIndex(item, index$1), disabled: item.disabled, onClick: () => this.handleItemClick(item), onKeyDown: e => this.handleKeyDown(e, item, index$1), onFocus: () => this.handleFocus(index$1), onBlur: this.handleBlur }, item.icon && (index.h("kritzel-icon", { name: item.icon, size: 20, class: "menu-item-icon" })), index.h("span", { class: "menu-item-label" }, item.label), index.h("span", { class: "menu-item-chevron", "aria-hidden": "true" }, index.h("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }, index.h("path", { d: "m9 18 6-6-6-6" }))))))), index.h("div", { key: 'e8f762ad87fdcf401ec717538bf1e979b22a9f15', id: panelId, class: "detail-panel", role: "tabpanel", "aria-labelledby": selectedTabId }, index.h("button", { key: '958360d57a1fad0953bc3865503e86c1d8aa24e3', class: "mobile-back-button", onClick: this.handleBackClick, "aria-label": "Back to menu" }, index.h("kritzel-icon", { key: 'c65eb947f80aafec99b367dae7ea72b1a77acdac', name: "chevron-left", size: 20, class: "mobile-back-icon" }), "Back"), index.h("slot", { key: '44557fddf513fffd86c7a1b28b71a41fef7701f1' })))));
+            }, role: "tab", "aria-selected": item.id === this.selectedItemId ? 'true' : 'false', "aria-controls": panelId, "aria-disabled": item.disabled ? 'true' : undefined, tabIndex: this.getTabIndex(item, index$1), disabled: item.disabled, onClick: () => this.handleItemClick(item), onKeyDown: e => this.handleKeyDown(e, item, index$1), onFocus: () => this.handleFocus(index$1), onBlur: this.handleBlur }, item.icon && (index.h("kritzel-icon", { name: item.icon, size: 20, class: "menu-item-icon" })), index.h("span", { class: "menu-item-label" }, item.label), index.h("span", { class: "menu-item-chevron", "aria-hidden": "true" }, index.h("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }, index.h("path", { d: "m9 18 6-6-6-6" }))))))), index.h("div", { key: 'd55507c8e818314bd548506d1b568357062378db', id: panelId, class: "detail-panel", role: "tabpanel", "aria-labelledby": selectedTabId }, index.h("button", { key: 'f7bf50b2ecd7093110ee0fc91d49caf468ee9116', class: "mobile-back-button", onClick: this.handleBackClick, "aria-label": "Back to menu" }, index.h("kritzel-icon", { key: 'c809cea0d279439ced7a580ea2a4f44d5ec2b8b6', name: "chevron-left", size: 20, class: "mobile-back-icon" }), "Back"), index.h("slot", { key: '78babf63e193db45e26ea6602ab09dde045bf06e' })))));
     }
     static get watchers() { return {
         "selectedItemId": [{
@@ -31248,7 +31193,7 @@ const KritzelMenu = class {
         this.itemCloseChildMenu.emit(event.detail);
     };
     render() {
-        return (index.h(index.Host, { key: '804ed34eb5340ecc1611ada01f608f7a0cf2f619', tabIndex: 0, onClick: e => e.stopPropagation() }, this.openChildMenuItem && index.h("div", { key: '6de5954a05b7f28961fa33cf8d34df3a81aae5f8', class: "has-open-child-overlay", onClick: this.onOverlayClick }), this.items.map(item => (index.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 })))));
+        return (index.h(index.Host, { key: '0876a6a7e6dbb0daa984d228bac4c8b5d5790580', tabIndex: 0, onClick: e => e.stopPropagation() }, this.openChildMenuItem && index.h("div", { key: '499dde6694d7b98eb85d9bac314ab7ba2dcf1e71', class: "has-open-child-overlay", onClick: this.onOverlayClick }), this.items.map(item => (index.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 })))));
     }
 };
 KritzelMenu.style = kritzelMenuCss();
@@ -31353,12 +31298,12 @@ const KritzelMenuItem = class {
         ];
     }
     render() {
-        return (index.h(index.Host, { key: '9b35e5631cfa14aca391636f06598ef6f2f26550', tabIndex: this.item.isDisabled ? -1 : 0, class: {
+        return (index.h(index.Host, { key: '40bfb2f086d24080276f27d879216958dff0388a', tabIndex: this.item.isDisabled ? -1 : 0, class: {
                 'selected': this.item.isSelected,
                 'editing': this.item.isEditing,
                 'disabled': this.item.isDisabled,
                 'child-open': this.item.isChildMenuOpen,
-            }, onClick: this.handleItemSelect }, index.h("div", { key: '175258699f76fdad5dcf3c7481e7882c6765bf33', class: "menu-item-overlay" }), this.item.isEditing ? this.renderEditMode() : this.renderViewMode()));
+            }, onClick: this.handleItemSelect }, index.h("div", { key: '0aa55293dfc2cf1010c020f3f35ee3a3bd662c8a', class: "menu-item-overlay" }), this.item.isEditing ? this.renderEditMode() : this.renderViewMode()));
     }
     static get watchers() { return {
         "item": [{
@@ -31510,7 +31455,7 @@ const KritzelMoreMenu = class {
         this.closeMenu();
     };
     render() {
-        return (index.h(index.Host, { key: '3eaf5dac0beb1f08100c9f57f63a2bdbef6e592d', class: { mobile: this.isTouchDevice }, style: { display: this.visible ? '' : 'none' } }, index.h("div", { key: '30e4426b7d3a06ec45f0159f6403862bf4106723', class: { 'more-menu-wrapper': true, visible: this.visible } }, index.h("button", { key: '037b715fadad3b674f07bd9225acc4075b2d41b3', class: "more-menu-button", "data-testid": "more-menu-button", onClick: this.toggleMenu, "aria-label": this.terms['moreMenu.ariaLabel'] ?? 'More options' }, index.h("kritzel-icon", { key: 'b68b306b5b913ff36d220604a70626aa8468215c', name: this.icon, size: this.iconSize })), index.h("kritzel-portal", { key: 'dc86c2679956f2dfc66d000b183d99865291b6d3', anchor: this.menuAnchor, offsetY: this.offsetY, onClose: this.closeMenu }, index.h("kritzel-menu", { key: '9bd661fceea95df4d307e497d64365fcb854e8ce', items: this.resolveMenuLabels(this.visibleItems), onItemSelect: this.handleMenuItemSelect })))));
+        return (index.h(index.Host, { key: 'ac84e832614f37f51b00f351fe70cf679d53ef15', class: { mobile: this.isTouchDevice }, style: { display: this.visible ? '' : 'none' } }, index.h("div", { key: 'a9ead49428833b9bbaf6cfa9a1550e6df514e3d5', class: { 'more-menu-wrapper': true, visible: this.visible } }, index.h("button", { key: 'ddf026728d5b3170faeb1b5e291e3e61b13711d5', class: "more-menu-button", "data-testid": "more-menu-button", onClick: this.toggleMenu, "aria-label": this.terms['moreMenu.ariaLabel'] ?? 'More options' }, index.h("kritzel-icon", { key: 'de7e442b32c755c890579e7254d2cc6dad8bc21a', name: this.icon, size: this.iconSize })), index.h("kritzel-portal", { key: 'a426494a65dfe42a1d9a2040dcf5202d2daee559', anchor: this.menuAnchor, offsetY: this.offsetY, onClose: this.closeMenu }, index.h("kritzel-menu", { key: '4b0ba21f8da0d4149ae52e752c6dd1c6fb4ac0cc', items: this.resolveMenuLabels(this.visibleItems), onItemSelect: this.handleMenuItemSelect })))));
     }
     static get watchers() { return {
         "items": [{
@@ -31682,7 +31627,7 @@ const KritzelNumericInput = class {
         this.valueChange.emit(newValue);
     };
     render() {
-        return (index.h(index.Host, { key: '68e6fecd79c3c970d1742b1a0bb8667ca2d31729' }, index.h("div", { key: 'efcf623186d221690bbb956088ec51343de07f3a', class: "input-container" }, this.label && index.h("label", { key: '300de793f02008ad037da021003b46fc34fc5239', class: "input-label" }, this.label), index.h("div", { key: '9ff424901fddfcbdac4835e2b2089df2e0966d0f', class: "input-wrapper" }, index.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 }), index.h("div", { key: 'c286606fa0617cc3acbbe40a27e40b154002e01d', class: "spinner-buttons" }, index.h("button", { key: 'e3a65a327975918fe604cd196ffb087fc4d3ca47', type: "button", class: "spinner-button spinner-up", onClick: this.handleIncrement, tabIndex: -1, "aria-label": "Increase value" }, index.h("svg", { key: '62b2ff4ed67ca8b6fc220ff9c63ceca90f75baea', viewBox: "0 0 10 6", class: "spinner-icon" }, index.h("path", { key: '803d5c30826d40d95f282071f3f88356366a9faf', d: "M1 5L5 1L9 5", stroke: "currentColor", "stroke-width": "1.5", fill: "none", "stroke-linecap": "round", "stroke-linejoin": "round" }))), index.h("button", { key: '3c54a48e7082f5aaa9ed923357d0cc4a722018b5', type: "button", class: "spinner-button spinner-down", onClick: this.handleDecrement, tabIndex: -1, "aria-label": "Decrease value" }, index.h("svg", { key: '9f6cb5f34bbb0e70b5773aecec519b7d8b742712', viewBox: "0 0 10 6", class: "spinner-icon" }, index.h("path", { key: '6539b0d4f4bd26e463fa9152cf58757497355cf6', d: "M1 1L5 5L9 1", stroke: "currentColor", "stroke-width": "1.5", fill: "none", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))));
+        return (index.h(index.Host, { key: '5ebdff964290d1d7f334d7e42e69f2fa09484a27' }, index.h("div", { key: '8d41fd9c5ba68fbeb927e262d5c2fe61436dee0a', class: "input-container" }, this.label && index.h("label", { key: 'f1172074424465be27ce5c3b6c3326457daf7fdc', class: "input-label" }, this.label), index.h("div", { key: 'ffdea4c84fe026c3bbd26bf288aab8a5da809d00', class: "input-wrapper" }, index.h("input", { key: '0705fa4415727e2689aa0dbfc56f17c9d72e3d18', 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 }), index.h("div", { key: '8f46261cdb045ff20d171bd0a6c98541f65f079b', class: "spinner-buttons" }, index.h("button", { key: 'b61a5e60db34972c3242264b9aa872e295a09b38', type: "button", class: "spinner-button spinner-up", onClick: this.handleIncrement, tabIndex: -1, "aria-label": "Increase value" }, index.h("svg", { key: '6c5a2be0a96b18ad204196fe59001211deedd038', viewBox: "0 0 10 6", class: "spinner-icon" }, index.h("path", { key: '4905b8ffa669e0b00b050cee94fdb8aac3c477e4', d: "M1 5L5 1L9 5", stroke: "currentColor", "stroke-width": "1.5", fill: "none", "stroke-linecap": "round", "stroke-linejoin": "round" }))), index.h("button", { key: 'df2ca8633ca8dbf54ef80a3cffbbcba28534d1fd', type: "button", class: "spinner-button spinner-down", onClick: this.handleDecrement, tabIndex: -1, "aria-label": "Decrease value" }, index.h("svg", { key: 'd4e8bd93fda3e9b1bd4db79f25c503e1057086a3', viewBox: "0 0 10 6", class: "spinner-icon" }, index.h("path", { key: 'a6e343e373963ca86b703783c88efeb4516e87a9', d: "M1 1L5 5L9 1", stroke: "currentColor", "stroke-width": "1.5", fill: "none", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))));
     }
     static get watchers() { return {
         "value": [{
@@ -31721,7 +31666,7 @@ const KritzelOpacitySlider = class {
     }
     render() {
         const percentage = this.getPercentage();
-        return (index.h(index.Host, { key: '895ae10ad71e846a1bc62b794751332816650727' }, index.h("div", { key: '22ea167ce0d6eb17c733d789cde10477c48a2a0e', class: "opacity-container" }, index.h("div", { key: '2be4fbf8c1f8ddb1fde8f9da727ed0947d21646c', class: "slider-wrapper" }, index.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: {
+        return (index.h(index.Host, { key: '51b1e93e982f29f181f9f542dcc2939fca08d7de' }, index.h("div", { key: '3376dac02effb137c04efc5aa9de96d4a5b36452', class: "opacity-container" }, index.h("div", { key: '3d1d2c0fe1b4b4185e37dcbf61a6c3a955fe1356', class: "slider-wrapper" }, index.h("input", { key: '6c43f519ff5d7bbc17ce7804909e52efc6e9533b', type: "range", class: "opacity-slider", min: this.min, max: this.max, step: this.step, value: this.value, onInput: (e) => this.handleInput(e), style: {
                 '--slider-progress': `${percentage}%`,
                 '--kritzel-opacity-slider-thumb-border-color': this.previewColor,
             } })))));
@@ -32074,7 +32019,7 @@ const KritzelPortal = class {
         this.portal.style.visibility = 'visible';
     }
     render() {
-        return (index.h(index.Host, { key: '489a752e48d96c2607defa40a39477675685b60a', style: { display: this.anchor ? 'block' : 'none' } }, index.h("slot", { key: '13c6b7567039b8c8c78de27e3d9aeda30a798de1' })));
+        return (index.h(index.Host, { key: '51633f5b57002a821f73185811626439b0956479', style: { display: this.anchor ? 'block' : 'none' } }, index.h("slot", { key: 'f5cb7946de5775d1fd64d266f6ba5b952e9d89cb' })));
     }
     static get watchers() { return {
         "anchor": [{
@@ -32088,7 +32033,7 @@ const KritzelPortal = class {
  * This file is auto-generated by the version bump scripts.
  * Do not modify manually.
  */
-const KRITZEL_VERSION = '0.4.25';
+const KRITZEL_VERSION = '0.4.27';
 
 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)}`;
 
@@ -32300,7 +32245,7 @@ const KritzelSettings = class {
         return (index.h("div", { class: "settings-categories-wrapper" }, index.h("div", { class: { 'settings-tab-panel': true, 'is-active': this.selectedCategoryId === 'general' } }, index.h("div", { class: "settings-content" }, index.h("h3", null, this.t('settings.general.title', 'General Settings')), index.h("div", { class: "settings-group" }, index.h("div", { class: "settings-item" }, index.h("label", { class: "settings-label" }, this.t('settings.general.theme.label', 'Theme')), index.h("p", { class: "settings-description" }, this.t('settings.general.theme.description', 'Select a registered color theme for the editor interface.')), index.h("kritzel-dropdown", { options: this.availableThemes.map(t => ({ value: t, label: t })), value: this.theme, onValueChanged: this.handleThemeChange })), this.availableLocales.length > 0 && (index.h("div", { class: "settings-item" }, index.h("label", { class: "settings-label" }, this.t('settings.general.language.label', 'Language')), index.h("p", { class: "settings-description" }, this.t('settings.general.language.description', 'Select the display language for the editor interface.')), index.h("kritzel-dropdown", { options: this.availableLocales.map(l => ({ value: l.code, label: l.label })), value: this.locale, onValueChanged: this.handleLocaleChange }))), index.h("div", { class: "settings-item" }, index.h("label", { class: "settings-label" }, this.t('settings.general.lockDrawingScale.label', 'Lock Drawing Scale')), index.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.')), index.h("kritzel-slide-toggle", { checked: this.lockDrawingScale, label: this.t('settings.general.lockDrawingScale.label', 'Lock Drawing Scale'), onCheckedChange: this.handleLockDrawingScaleChange }))))), index.h("div", { class: { 'settings-tab-panel': true, 'is-active': this.selectedCategoryId === 'viewport' } }, index.h("div", { class: "settings-content" }, index.h("h3", null, this.t('settings.viewport.title', 'Viewport Settings')), index.h("div", { class: "settings-group" }, index.h("div", { class: "settings-item" }, index.h("label", { class: "settings-label" }, this.t('settings.viewport.minZoom.label', 'Minimum Zoom Level')), index.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.')), index.h("kritzel-numeric-input", { value: this.scaleMin, min: 0.0001, max: 1, step: 0.0001, onValueChange: this.handleScaleMinChange })), index.h("div", { class: "settings-item" }, index.h("label", { class: "settings-label" }, this.t('settings.viewport.maxZoom.label', 'Maximum Zoom Level')), index.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.')), index.h("kritzel-numeric-input", { value: this.scaleMax, min: 1, max: 1000, step: 1, onValueChange: this.handleScaleMaxChange })), index.h("div", { class: "settings-item" }, index.h("label", { class: "settings-label" }, this.t('settings.viewport.boundaryLeft.label', 'Viewport Boundary Left')), index.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.')), index.h("kritzel-numeric-input", { value: this.viewportBoundaryLeft, step: 100, placeholder: this.t('settings.viewport.boundaryPlaceholder', 'Infinite'), onValueChange: this.handleViewportBoundaryLeftChange })), index.h("div", { class: "settings-item" }, index.h("label", { class: "settings-label" }, this.t('settings.viewport.boundaryRight.label', 'Viewport Boundary Right')), index.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.')), index.h("kritzel-numeric-input", { value: this.viewportBoundaryRight, step: 100, placeholder: this.t('settings.viewport.boundaryPlaceholder', 'Infinite'), onValueChange: this.handleViewportBoundaryRightChange })), index.h("div", { class: "settings-item" }, index.h("label", { class: "settings-label" }, this.t('settings.viewport.boundaryTop.label', 'Viewport Boundary Top')), index.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.')), index.h("kritzel-numeric-input", { value: this.viewportBoundaryTop, step: 100, placeholder: this.t('settings.viewport.boundaryPlaceholder', 'Infinite'), onValueChange: this.handleViewportBoundaryTopChange })), index.h("div", { class: "settings-item" }, index.h("label", { class: "settings-label" }, this.t('settings.viewport.boundaryBottom.label', 'Viewport Boundary Bottom')), index.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.')), index.h("kritzel-numeric-input", { value: this.viewportBoundaryBottom, step: 100, placeholder: this.t('settings.viewport.boundaryPlaceholder', 'Infinite'), onValueChange: this.handleViewportBoundaryBottomChange }))))), index.h("div", { class: { 'settings-tab-panel': true, 'is-active': this.selectedCategoryId === 'shortcuts' } }, index.h("div", { class: "settings-content" }, index.h("h3", null, this.t('settings.shortcuts.title', 'Keyboard Shortcuts')), index.h("div", { class: "shortcuts-list" }, Array.from(this.groupShortcutsByCategory()).map(([category, shortcuts]) => (index.h("div", { class: "shortcuts-category", key: category }, index.h("h4", { class: "shortcuts-category-title" }, category), index.h("div", { class: "shortcuts-group" }, shortcuts.map(shortcut => (index.h("div", { class: "shortcut-item", key: shortcut.key + shortcut.label }, index.h("span", { class: "shortcut-label" }, shortcut.label), index.h("kbd", { class: "shortcut-key" }, this.formatKeyCombo(shortcut)))))))))))), index.h("div", { class: { 'settings-tab-panel': true, 'is-active': this.selectedCategoryId === 'developer' } }, index.h("div", { class: "settings-content" }, index.h("h3", null, this.t('settings.developer.title', 'Developer Options')), index.h("div", { class: "settings-group" }, index.h("div", { class: "settings-item" }, index.h("label", { class: "settings-label" }, this.t('settings.developer.showViewportInfo.label', 'Show Viewport Info')), index.h("p", { class: "settings-description" }, this.t('settings.developer.showViewportInfo.description', 'Display viewport debug information such as position, zoom level, and boundaries.')), index.h("kritzel-slide-toggle", { checked: this.debugInfo.showViewportInfo, label: this.t('settings.developer.showViewportInfo.label', 'Show Viewport Info'), onCheckedChange: this.handleDebugInfoChange('showViewportInfo') })), index.h("div", { class: "settings-item" }, index.h("label", { class: "settings-label" }, this.t('settings.developer.showObjectInfo.label', 'Show Object Info')), index.h("p", { class: "settings-description" }, this.t('settings.developer.showObjectInfo.description', 'Display debug information about objects on the canvas.')), index.h("kritzel-slide-toggle", { checked: this.debugInfo.showObjectInfo, label: this.t('settings.developer.showObjectInfo.label', 'Show Object Info'), onCheckedChange: this.handleDebugInfoChange('showObjectInfo') })), index.h("div", { class: "settings-item" }, index.h("label", { class: "settings-label" }, this.t('settings.developer.showSyncProviderInfo.label', 'Show Sync Provider Info')), index.h("p", { class: "settings-description" }, this.t('settings.developer.showSyncProviderInfo.description', 'Display debug information about the sync provider connection status.')), index.h("kritzel-slide-toggle", { checked: this.debugInfo.showSyncProviderInfo, label: this.t('settings.developer.showSyncProviderInfo.label', 'Show Sync Provider Info'), onCheckedChange: this.handleDebugInfoChange('showSyncProviderInfo') })), index.h("div", { class: "settings-item" }, index.h("label", { class: "settings-label" }, this.t('settings.developer.showMigrationInfo.label', 'Show Migration Info')), index.h("p", { class: "settings-description" }, this.t('settings.developer.showMigrationInfo.description', 'Display debug information about data migrations.')), index.h("kritzel-slide-toggle", { checked: this.debugInfo.showMigrationInfo, label: this.t('settings.developer.showMigrationInfo.label', 'Show Migration Info'), onCheckedChange: this.handleDebugInfoChange('showMigrationInfo') }))))), index.h("div", { class: { 'settings-tab-panel': true, 'is-active': this.selectedCategoryId === 'about' } }, index.h("div", { class: "settings-content" }, index.h("h3", null, this.t('settings.about.title', 'About')), index.h("p", null, this.t('settings.about.description', 'Kritzel - A drawing application')), index.h("p", { class: "version-info" }, "Version ", KRITZEL_VERSION), index.h("p", { class: "version-info" }, "App-State Schema v", schema_constants.CURRENT_APP_STATE_SCHEMA_VERSION), index.h("p", { class: "version-info" }, "Workspace Schema v", schema_constants.CURRENT_WORKSPACE_SCHEMA_VERSION)))));
     }
     render() {
-        return (index.h(index.Host, { key: '71f8a12325a781212dd6f2c8b794563fcb4eee64' }, index.h("kritzel-dialog", { key: '1abe7c1dedcf79433a95d60dadce342f46e62c3a', isOpen: this.isDialogOpen, dialogTitle: this.t('settings.dialogTitle', 'Settings'), size: "large", contained: true, onDialogClose: this.closeDialog }, index.h("kritzel-master-detail", { key: '9e8b3a11d97c1a10c6693434eb2e8bfc1d3fda7d', items: this.categories, selectedItemId: this.selectedCategoryId, onItemSelect: this.handleCategorySelect }, this.renderCategoryContent()))));
+        return (index.h(index.Host, { key: '96981b34953ffdda4cfdfa9e6acc832dedc0c64a' }, index.h("kritzel-dialog", { key: '792a68aa1fe66780a937a95db802e9c6a2135091', isOpen: this.isDialogOpen, dialogTitle: this.t('settings.dialogTitle', 'Settings'), size: "large", contained: true, onDialogClose: this.closeDialog }, index.h("kritzel-master-detail", { key: 'dc7d99c2b90ea4a86bc23527a39eaec70d95acc8', items: this.categories, selectedItemId: this.selectedCategoryId, onItemSelect: this.handleCategorySelect }, this.renderCategoryContent()))));
     }
     static get watchers() { return {
         "settings": [{
@@ -35540,9 +35485,9 @@ const KritzelShareDialog = class {
         this.dialogClosed.emit();
     };
     render() {
-        return (index.h(index.Host, { key: 'f6028ad618f04e3be65c816f4b53c4ccaa93fc71' }, index.h("kritzel-dialog", { key: '7dabab65955f287650de4ba484e37f4ccdd7c57e', dialogTitle: this.terms['share.dialogTitle'] ?? 'Share Workspace', size: "small", isOpen: this.isDialogOpen, onDialogClose: this.closeDialog, contained: true }, index.h("div", { key: '321e2b17048dea20528c0f34f39a462548c64689', class: "share-content" }, index.h("div", { key: 'b31bbe2f686f5fe2fdc03189ffb98082683fff63', class: "share-section" }, index.h("div", { key: '2c864e00aa4c2da0a7f8ee6c83f149e6e93610a5', class: "share-row" }, index.h("div", { key: 'cbee03ac7ec9ee82f22c77d3681d4a540a0780a3', class: "share-label-group" }, index.h("label", { key: '3be7c8dc2ac2f7dbfe6458a902b14a887895fdc3', class: "share-label" }, this.terms['share.linkSharing.label'] ?? 'Link sharing'), index.h("p", { key: 'c7401bc76fdccbafc6c7c4e37380fc75f35b3a99', class: "share-description" }, this.internalIsPublic
+        return (index.h(index.Host, { key: '13e718f70f46a0c71e70d7330e0bcf655ebb60a3' }, index.h("kritzel-dialog", { key: 'd96e31d7259cc5c5461d94395ceecfc7491f403f', dialogTitle: this.terms['share.dialogTitle'] ?? 'Share Workspace', size: "small", isOpen: this.isDialogOpen, onDialogClose: this.closeDialog, contained: true }, index.h("div", { key: '9a82641540675cb645e5520bfb1624e77b5eb382', class: "share-content" }, index.h("div", { key: '5eed405aaf5e39f71083e84d2db0c4177722915b', class: "share-section" }, index.h("div", { key: '2bb736f60448dcae354d2f7931c277fce9fe7964', class: "share-row" }, index.h("div", { key: 'f2b22b2ce9e3331b0bf142bcb280e3dae064f34d', class: "share-label-group" }, index.h("label", { key: '58daf90a8b4de173deaba2e93c31791d78c17214', class: "share-label" }, this.terms['share.linkSharing.label'] ?? 'Link sharing'), index.h("p", { key: 'ba5f9ee772ab44fd4cc9a3066894ee5da10c56d8', class: "share-description" }, this.internalIsPublic
             ? (this.terms['share.linkSharing.enabledDescription'] ?? 'Anyone with the link can access this workspace.')
-            : (this.terms['share.linkSharing.disabledDescription'] ?? 'Link sharing is disabled. Only you can access this workspace.'))), index.h("kritzel-slide-toggle", { key: '52ae14da0d79797e9ad73f1ffbac003fd1395f47', checked: this.internalIsPublic, onCheckedChange: this.handleToggleChange, label: this.terms['share.linkSharing.toggleLabel'] ?? 'Enable link sharing' }))), this.internalIsPublic && (index.h("div", { key: 'bd44618680db14d7d95f0c1bbc4441a103e9f15a', class: "share-section" }, index.h("div", { key: '659cd6b2e2e719d76f692a8dc5a8c0855e5d246d', class: "share-url-container" }, index.h("input", { key: '76be432ecaad753cb7043aad912d8aa1770afb61', type: "text", class: "share-url-input", value: this.getShareUrl(), readOnly: true, onClick: (e) => e.target.select() }), index.h("button", { key: 'ef75a04964fb481fae2f6e924497eb2adedc100d', class: { 'copy-button': true, 'copy-success': this.copySuccess }, onClick: this.handleCopyUrl, title: this.copySuccess ? (this.terms['share.copyLink.copied'] ?? 'Copied!') : (this.terms['share.copyLink.title'] ?? 'Copy link') }, index.h("kritzel-icon", { key: '06bbdc32d4348ca6d75dbbe11ba74d94e1c86882', name: this.copySuccess ? 'check' : 'copy', size: 18 }))), this.qrCodeDataUrl && (index.h("div", { key: '9246e86b26a9794738a29e6a6bfe6c4812339449', class: "share-qr-container" }, index.h("img", { key: '90e18eee230c23e0bfd773c9b8a6967803ae10dc', class: "share-qr-image", src: this.qrCodeDataUrl, alt: "QR code for share link" })))))))));
+            : (this.terms['share.linkSharing.disabledDescription'] ?? 'Link sharing is disabled. Only you can access this workspace.'))), index.h("kritzel-slide-toggle", { key: '7f70df4db90f087d8d7a7efe98012f7bf897975d', checked: this.internalIsPublic, onCheckedChange: this.handleToggleChange, label: this.terms['share.linkSharing.toggleLabel'] ?? 'Enable link sharing' }))), this.internalIsPublic && (index.h("div", { key: '999fe3550e149b7e3f0ebf28f312fa5f676dd945', class: "share-section" }, index.h("div", { key: 'ff623a78f50b8a5e27a978e05e2ee2ba4ac1991b', class: "share-url-container" }, index.h("input", { key: '5c3b5c3e82366ebe4f4e7a73c6afa42dbbf39a20', type: "text", class: "share-url-input", value: this.getShareUrl(), readOnly: true, onClick: (e) => e.target.select() }), index.h("button", { key: '60ac0315841649722b32d098c787f2a0deeec979', 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') }, index.h("kritzel-icon", { key: 'eacbd3b75c554d3c62a098ddd45b6723f59521b5', name: this.copySuccess ? 'check' : 'copy', size: 18 }))), this.qrCodeDataUrl && (index.h("div", { key: 'fc24d6a9673b5b16a35f905023e632a314cef4ce', class: "share-qr-container" }, index.h("img", { key: '3669f9138336cd4cf51d1e3de5caedaddac518e8', class: "share-qr-image", src: this.qrCodeDataUrl, alt: "QR code for share link" })))))))));
     }
     static get watchers() { return {
         "isPublic": [{
@@ -35583,7 +35528,7 @@ const KritzelSlideToggle = class {
         }
     };
     render() {
-        return (index.h(index.Host, { key: 'e310e7bc8c115feadaa2494a6a543719f1b25245', class: { checked: this.checked, disabled: this.disabled }, tabIndex: this.disabled ? -1 : 0, role: "switch", "aria-checked": this.checked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.label, onClick: this.handleToggle, onKeyDown: this.handleKeyDown }, index.h("div", { key: 'fef37a1b373bf438cbacbf6537640269c2ab6b59', class: "toggle-track" }, index.h("div", { key: '4e140f83a8802e04c0b42e76f5e5719efd5a1cbc', class: "toggle-thumb" }))));
+        return (index.h(index.Host, { key: 'd8a9509138995da84fe798da448f0487d8c082b5', 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 }, index.h("div", { key: '0966d487def99332139fe6f4a604fff310088d72', class: "toggle-track" }, index.h("div", { key: 'aeec11224dffa71178f38b0a96a7e15c35f67bcf', class: "toggle-thumb" }))));
     }
 };
 KritzelSlideToggle.style = kritzelSlideToggleCss();
@@ -35683,7 +35628,7 @@ const KritzelSplitButton = class {
         this.menuScrollTop = event.target.scrollTop;
     };
     render() {
-        return (index.h(index.Host, { key: 'f7f5019b32f4514a4ccf5bd07742658e3d05020a', class: { mobile: this.isTouchDevice } }, index.h("button", { key: '361007b4281edfe2bf18f28f7c4f19ba1f251b49', class: "split-main-button", tabIndex: 0, onClick: this.handleButtonClick, disabled: this.mainButtonDisabled, "aria-label": "Main action" }, this.buttonIcon && index.h("kritzel-icon", { key: '17d4fad6cfa070225daa67dfc648d4ac64091e90', name: this.buttonIcon })), index.h("div", { key: 'c18107b7d557525092c28ff5d7336ebb3648b672', class: "split-divider" }), index.h("button", { key: 'c7a9a67d832f026fa8e21eff7ea5935cd72862ed', ref: el => (this.splitMenuButtonRef = el), class: "split-menu-button", tabIndex: 0, onClick: this.toggleMenu, disabled: this.menuButtonDisabled, "aria-label": "Open menu" }, index.h("kritzel-icon", { key: '5b40284c8f04fba80ca606b0af201040efe53880', name: this.dropdownIcon })), index.h("kritzel-portal", { key: '62bd7f26c020497f2131759d0d1ef9d18e817b37', anchor: this.anchorElement, offsetY: 4, onClose: this.closeMenu }, index.h("kritzel-menu", { key: 'a1a11a0ae33f9626db3cd56fbb881c613f1ab78c', ref: el => (this.menuRef = el), items: this.items, onItemSelect: this.handleItemSelect, onItemSave: this.handleItemSave, onItemCancel: this.handleItemCancel, onItemToggleChildMenu: this.handleItemToggleChildMenu, onItemCloseChildMenu: this.handleItemCloseChildMenu, onClose: this.closeMenu, onScroll: this.handleScroll }))));
+        return (index.h(index.Host, { key: '37185b37faa1e703f9457d4f4685c7d8ed40b342', class: { mobile: this.isTouchDevice } }, index.h("button", { key: 'b97d4df106fea68398116f1c44c6d5cd9f31997c', class: "split-main-button", tabIndex: 0, onClick: this.handleButtonClick, disabled: this.mainButtonDisabled, "aria-label": "Main action" }, this.buttonIcon && index.h("kritzel-icon", { key: '66dce735d160e23a16727c294f9ccb1bd3cda8c1', name: this.buttonIcon })), index.h("div", { key: '14ffaf9334090dc10df87d7b8744446be8bb2632', class: "split-divider" }), index.h("button", { key: '421e23ebb99e7b1ca656c0bc16f602a2a9812264', ref: el => (this.splitMenuButtonRef = el), class: "split-menu-button", tabIndex: 0, onClick: this.toggleMenu, disabled: this.menuButtonDisabled, "aria-label": "Open menu" }, index.h("kritzel-icon", { key: 'affc13ef766d21030137a7feb44305553845dbfc', name: this.dropdownIcon })), index.h("kritzel-portal", { key: '326cef4696ebf9986e6c42e18822b90c399b16c2', anchor: this.anchorElement, offsetY: 4, onClose: this.closeMenu }, index.h("kritzel-menu", { key: 'e0800efbdefc9dce3dc548523ec10e810f3f7f73', 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 }))));
     }
 };
 KritzelSplitButton.style = kritzelSplitButtonCss();
@@ -35704,7 +35649,7 @@ const KritzelStrokeSize = class {
     }
     render() {
         const sizes = this.sizes ?? [];
-        return (index.h(index.Host, { key: 'c0307e527e6f9d5d663ae3f8f605162cdde2a339' }, index.h("div", { key: '9533e0486f8078d25b7e8fc3323126d77700ac72', class: "size-grid" }, sizes.map(size => (index.h("div", { tabIndex: 0, class: {
+        return (index.h(index.Host, { key: '8b12f354a3395cd69c7199115ce998cf2eb26eb2' }, index.h("div", { key: '39008613327d50b75270dd78ea498113e5e9617b', class: "size-grid" }, sizes.map(size => (index.h("div", { tabIndex: 0, class: {
                 'size-container': true,
                 'selected': this.selectedSize === size,
             }, onClick: () => this.handleSizeClick(size) }, index.h("kritzel-color", { value: 'var(--kritzel-global-text-primary)', size: size })))))));
@@ -35712,22 +35657,6 @@ const KritzelStrokeSize = class {
 };
 KritzelStrokeSize.style = kritzelStrokeSizeCss();
 
-const kritzelSyncIndicatorCss = () => `:host{display:contents}.indicator{position:absolute;top:12px;left:50%;transform:translateX(-50%);z-index:var(--kritzel-editor-sync-indicator-z-index, 10001);pointer-events:none;display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;background:var(--kritzel-editor-sync-indicator-background, rgba(255, 255, 255, 0.92));color:var(--kritzel-editor-sync-indicator-color, #334155);box-shadow:0 2px 10px rgba(0, 0, 0, 0.12);font-family:var(--kritzel-font-family, sans-serif);font-size:12px;line-height:1;font-weight:500;opacity:0;visibility:hidden}.indicator.visible{opacity:1;visibility:visible}.spinner{width:12px;height:12px;border-radius:50%;border:2px solid var(--kritzel-editor-sync-indicator-spinner-track, rgba(148, 163, 184, 0.35));border-top-color:var(--kritzel-editor-sync-indicator-spinner-color, #2563eb);animation:kritzel-sync-indicator-spin 0.8s linear infinite}@keyframes kritzel-sync-indicator-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}`;
-
-const KritzelSyncIndicator = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-    }
-    /** Whether the indicator is visible. */
-    visible = false;
-    /** The text displayed next to the spinner. */
-    text = 'Syncing...';
-    render() {
-        return (index.h(index.Host, { key: '05e825ee1c08fe02008b8e1adfe9e09a7996f221' }, index.h("div", { key: 'ea1635896f643c16713d35d6efd3abf486b1fbe2', class: { indicator: true, visible: this.visible }, role: "status", "aria-live": "polite", "aria-label": "Synchronizing workspace" }, index.h("span", { key: '7b57ea67d6f2c40dc74e966c16ebe9d95c75394a', class: "spinner", "aria-hidden": "true" }), index.h("span", { key: 'fc16405b02d96213d0025239b6e863883192ada5' }, this.text))));
-    }
-};
-KritzelSyncIndicator.style = kritzelSyncIndicatorCss();
-
 const kritzelToolConfigCss = () => `.expand-toggle{background:none;border:none;cursor:var(--kritzel-global-pointer-cursor, pointer);padding:0;margin:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;color:var(--kritzel-icon-color, currentColor);transition:transform 0.2s ease}.expand-toggle:hover{opacity:0.7}.expand-toggle:focus{outline:none}.expand-toggle:focus-visible{outline:2px solid var(--kritzel-focus-color, #007acc);outline-offset:2px}.expand-toggle:active{transform:scale(0.95)}.divider{height:1px;background-color:var(--kritzel-divider-color, #e0e0e0);margin:4px 0;width:100%}`;
 
 const KritzelToolConfig = class {
@@ -36136,14 +36065,14 @@ const KritzelTooltip = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '93486d37c5dcaaf9a3d0d1c53d6308ddd5712560', style: {
+        return (index.h(index.Host, { key: '407a2f458626f02808fc9d718046a635de71662b', style: {
                 position: 'fixed',
                 zIndex: '9999',
                 transition: 'opacity 0.3s ease-in-out, transform 0.3s ease-in-out',
                 visibility: this.isVisible ? 'visible' : 'hidden',
                 left: `${this.positionX}px`,
                 bottom: `${this.positionY}px`,
-            } }, index.h("div", { key: '4b5cf451f75d09459145b874eb3c7faffafa87e0', class: "tooltip-content", onClick: event => event.stopPropagation(), onPointerDown: event => event.stopPropagation(), onMouseDown: event => event.stopPropagation() }, index.h("slot", { key: '6c7fda100473a7d4fc533edc52d67bf6909bdc0e' }))));
+            } }, index.h("div", { key: '13c00678bd485f1f5bc2676e2c89fd0019f5e089', class: "tooltip-content", onClick: event => event.stopPropagation(), onPointerDown: event => event.stopPropagation(), onMouseDown: event => event.stopPropagation() }, index.h("slot", { key: '67937f71c611f36a2c47ee2632a8657ced1d8cc7' }))));
     }
     static get watchers() { return {
         "triggerElement": [{
@@ -36184,7 +36113,7 @@ const KritzelUtilityPanel = class {
         this.redo.emit();
     }
     render() {
-        return (index.h(index.Host, { key: '57c1a6746e4d5b319bb368c9d0bfc52a31d8c8de' }, index.h("button", { key: '5fb00d62b68de41feda9fafb3eec46cc0b85ba0e', class: "utility-button", "data-testid": "utility-undo", disabled: !this.undoState?.canUndo, onClick: event => this.handleUndo(event), "aria-label": this.terms['utility.undo'] ?? 'Undo' }, index.h("kritzel-icon", { key: '5ed2c36405ac7113ac697de9102aaf7067127e2a', name: "undo" })), index.h("button", { key: '0d58c8cbbb8e9547b9416dbf81a2c8011208dc6c', class: "utility-button", "data-testid": "utility-redo", disabled: !this.undoState?.canRedo, onClick: event => this.handleRedo(event), "aria-label": this.terms['utility.redo'] ?? 'Redo' }, index.h("kritzel-icon", { key: '70264118cbe0f54335a02941fdc868f63476cd1c', name: "redo" })), index.h("div", { key: '6eed6a603b8bc62e55b1f6fe82e7d035d1f5833c', class: "utility-separator" }), index.h("button", { key: 'd11195da7a86496afcca26105a6a0f066b1b2340', class: "utility-button", "data-testid": "utility-delete", onClick: () => this.delete.emit(), "aria-label": this.terms['utility.delete'] ?? 'Delete selected items' }, index.h("kritzel-icon", { key: '5e4c731f90863b4db917c67ac7e87c2945c7bcaa', name: "delete" }))));
+        return (index.h(index.Host, { key: '3485f5cc7c4f1fd71fe24c2337d0a1f7145012c0' }, index.h("button", { key: '0a5eb536282df4fec1d7eead330574412640ae8b', class: "utility-button", "data-testid": "utility-undo", disabled: !this.undoState?.canUndo, onClick: event => this.handleUndo(event), "aria-label": this.terms['utility.undo'] ?? 'Undo' }, index.h("kritzel-icon", { key: '976805f2e645acf710b30a6dc089b93bf3d6efb3', name: "undo" })), index.h("button", { key: 'dd44f61e16f96e315d62c0e9278b0a09ec7169d7', class: "utility-button", "data-testid": "utility-redo", disabled: !this.undoState?.canRedo, onClick: event => this.handleRedo(event), "aria-label": this.terms['utility.redo'] ?? 'Redo' }, index.h("kritzel-icon", { key: '4f3fb33d6bc5cfa5c3b23a39c10998efefec51a8', name: "redo" })), index.h("div", { key: '60124754529de5ac00e6ec281a2402d4c85e1906', class: "utility-separator" }), index.h("button", { key: '0b3cbd654f5a8c2319547a3314887435dfc5b1f7', class: "utility-button", "data-testid": "utility-delete", onClick: () => this.delete.emit(), "aria-label": this.terms['utility.delete'] ?? 'Delete selected items' }, index.h("kritzel-icon", { key: '7fe136ecc1513895b14e479a5d47e13d398f52b4', name: "delete" }))));
     }
 };
 KritzelUtilityPanel.style = kritzelUtilityPanelCss();
@@ -36205,7 +36134,7 @@ const KritzelWatermark = class {
     label;
     render() {
         const label = this.label ?? this.core.localizationManager.translate('watermark.poweredBy');
-        return (index.h(index.Host, { key: 'ae00d98f16912afcb7a90d47a9fc4d55fc7468f0' }, index.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)));
+        return (index.h(index.Host, { key: '297a488f26fd8637da8d00b98af85cfeda5b0992' }, index.h("a", { key: '6e3be65773dfda06e9b7ae611cfbb5ff09ba1f91', class: "watermark-link", href: KRITZEL_WEBSITE_URL, target: "_blank", rel: "noopener noreferrer", part: "watermark", onPointerDown: (ev) => ev.stopPropagation(), onPointerUp: (ev) => ev.stopPropagation() }, label)));
     }
 };
 KritzelWatermark.style = kritzelWatermarkCss();
@@ -36393,7 +36322,7 @@ const KritzelZoomPanel = class {
         return Number.isFinite(this.zoomPercent) ? Math.max(1, Math.round(this.zoomPercent)) : 100;
     }
     render() {
-        return (index.h(index.Host, { key: 'ac5b3f37fbc298b1522f0ff80c26734164b5358a' }, index.h("div", { key: '8ac3f3600c45c064d9c4c4c9efa78397790edf4b', class: { panel: true, visible: this.visible } }, index.h("button", { key: '63b2a3fce804a310146d95cc9c2a874707f9e265', class: "zoom-button", type: "button", "aria-label": this.terms['zoom.zoomOut'] ?? 'Zoom out', disabled: this.disabled, onClick: this.handleZoomOut }, index.h("kritzel-icon", { key: '86ebb85dfc2b746cedd0ed63cd2ae90378f6bbb8', name: "minus" })), index.h("span", { key: '5191cc1aa9966234c1634882af145403acd32211', class: "zoom-level", "aria-live": "polite" }, this.normalizedZoomPercent, "%"), index.h("button", { key: '47a7ee5b6c1cf1c99cd1826877e0a1c4ce224442', class: "zoom-button", type: "button", "aria-label": this.terms['zoom.zoomIn'] ?? 'Zoom in', disabled: this.disabled, onClick: this.handleZoomIn }, index.h("kritzel-icon", { key: '09782e094534fbc5bbcc612f24eea359568d6132', name: "plus" })))));
+        return (index.h(index.Host, { key: '6f39f043da7b8607efcfb0e99d58cebc80d3c031' }, index.h("div", { key: 'f7c7600760ea8d3d9c6efe26e6b398ba20b12e23', class: { panel: true, visible: this.visible } }, index.h("button", { key: '18c6ddc87155a36395b296aded7c15c55500a2c8', class: "zoom-button", type: "button", "aria-label": this.terms['zoom.zoomOut'] ?? 'Zoom out', disabled: this.disabled, onClick: this.handleZoomOut }, index.h("kritzel-icon", { key: '54fea3408bb38c7e5f19877c84fb96a74028693a', name: "minus" })), index.h("span", { key: 'b2b354eb16a0e2102e9214864c438dfab79d8968', class: "zoom-level", "aria-live": "polite" }, this.normalizedZoomPercent, "%"), index.h("button", { key: 'ddc3822e478ccfec770dcc5ba900d0276531b1ad', class: "zoom-button", type: "button", "aria-label": this.terms['zoom.zoomIn'] ?? 'Zoom in', disabled: this.disabled, onClick: this.handleZoomIn }, index.h("kritzel-icon", { key: '2069bf5aba39c362d472f57941ca8ae4f0bedb8a', name: "plus" })))));
     }
 };
 KritzelZoomPanel.style = kritzelZoomPanelCss();
@@ -36438,7 +36367,6 @@ exports.kritzel_share_dialog = KritzelShareDialog;
 exports.kritzel_slide_toggle = KritzelSlideToggle;
 exports.kritzel_split_button = KritzelSplitButton;
 exports.kritzel_stroke_size = KritzelStrokeSize;
-exports.kritzel_sync_indicator = KritzelSyncIndicator;
 exports.kritzel_tool_config = KritzelToolConfig;
 exports.kritzel_tooltip = KritzelTooltip;
 exports.kritzel_utility_panel = KritzelUtilityPanel;