kritzel-stencil 0.1.71 → 0.1.73

package/dist/cjs/index.cjs.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var workspace_migrations = require('./workspace.migrations-Cma2Vh5E.js');
+var workspace_migrations = require('./workspace.migrations-DcwqsqPC.js');
 var Y = require('yjs');
 var yWebsocket = require('y-websocket');
 require('y-indexeddb');
@@ -556,6 +556,9 @@ class HocuspocusSyncProvider {
     isConnected = false;
     isSynced = false;
     usesSharedSocket = false;
+    isDestroyed = false;
+    connectTimeout = null;
+    pendingConnectReject = null;
     get awareness() {
         return this.provider.awareness;
     }
@@ -574,8 +577,13 @@ class HocuspocusSyncProvider {
                 name,
                 document: doc,
                 token: options?.token || null,
+                onStatus: (data) => {
+                    if (options?.onStatus) {
+                        options.onStatus(data);
+                    }
+                },
                 onConnect: () => {
-                    if (this.isConnected) {
+                    if (this.isConnected || this.isDestroyed) {
                         return;
                     }
                     this.isConnected = true;
@@ -587,7 +595,7 @@ class HocuspocusSyncProvider {
                     }
                 },
                 onDisconnect: () => {
-                    if (!this.isConnected && !this.isSynced) {
+                    if (this.isDestroyed || (!this.isConnected && !this.isSynced)) {
                         return;
                     }
                     this.isConnected = false;
@@ -600,7 +608,7 @@ class HocuspocusSyncProvider {
                     }
                 },
                 onSynced: () => {
-                    if (this.isSynced) {
+                    if (this.isSynced || this.isDestroyed) {
                         return;
                     }
                     this.isSynced = true;
@@ -619,9 +627,6 @@ class HocuspocusSyncProvider {
             if (options?.onAuthenticationFailed) {
                 config.onAuthenticationFailed = options.onAuthenticationFailed;
             }
-            if (options?.onStatus) {
-                config.onStatus = options.onStatus;
-            }
             this.provider = new workspace_migrations.HocuspocusProvider(config);
             // Must call attach() explicitly when using shared socket
             this.provider.attach();
@@ -637,8 +642,14 @@ class HocuspocusSyncProvider {
                 name,
                 document: doc,
                 token: options?.token || null,
+                autoConnect: false,
+                onStatus: (data) => {
+                    if (options?.onStatus) {
+                        options.onStatus(data);
+                    }
+                },
                 onConnect: () => {
-                    if (this.isConnected) {
+                    if (this.isConnected || this.isDestroyed) {
                         return;
                     }
                     this.isConnected = true;
@@ -650,7 +661,7 @@ class HocuspocusSyncProvider {
                     }
                 },
                 onDisconnect: () => {
-                    if (!this.isConnected && !this.isSynced) {
+                    if (this.isDestroyed || (!this.isConnected && !this.isSynced)) {
                         return;
                     }
                     this.isConnected = false;
@@ -663,7 +674,7 @@ class HocuspocusSyncProvider {
                     }
                 },
                 onSynced: () => {
-                    if (this.isSynced) {
+                    if (this.isSynced || this.isDestroyed) {
                         return;
                     }
                     this.isSynced = true;
@@ -682,9 +693,6 @@ class HocuspocusSyncProvider {
             if (options?.onAuthenticationFailed) {
                 config.onAuthenticationFailed = options.onAuthenticationFailed;
             }
-            if (options?.onStatus) {
-                config.onStatus = options.onStatus;
-            }
             if (options?.WebSocketPolyfill) {
                 config.WebSocketPolyfill = options.WebSocketPolyfill;
             }
@@ -752,22 +760,36 @@ class HocuspocusSyncProvider {
         };
     }
     async connect() {
-        if (this.isSynced) {
+        if (this.isSynced || this.isDestroyed) {
             return;
         }
         return new Promise((resolve, reject) => {
-            const timeout = setTimeout(() => {
+            // Store reject function so we can cancel the connection if destroyed
+            this.pendingConnectReject = reject;
+            this.connectTimeout = setTimeout(() => {
+                this.pendingConnectReject = null;
+                this.connectTimeout = null;
                 reject(new Error('Hocuspocus connection timeout'));
             }, 10000); // 10 second timeout
             const syncHandler = () => {
-                clearTimeout(timeout);
+                if (this.connectTimeout) {
+                    clearTimeout(this.connectTimeout);
+                    this.connectTimeout = null;
+                }
+                this.pendingConnectReject = null;
                 this.provider.off('synced', syncHandler);
-                resolve();
+                if (!this.isDestroyed) {
+                    resolve();
+                }
             };
             this.provider.on('synced', syncHandler);
             // If already synced, resolve immediately
             if (this.provider.isSynced) {
-                clearTimeout(timeout);
+                if (this.connectTimeout) {
+                    clearTimeout(this.connectTimeout);
+                    this.connectTimeout = null;
+                }
+                this.pendingConnectReject = null;
                 this.provider.off('synced', syncHandler);
                 resolve();
                 return;
@@ -779,6 +801,14 @@ class HocuspocusSyncProvider {
         });
     }
     disconnect() {
+        // Cancel any pending connection attempt
+        if (this.connectTimeout) {
+            clearTimeout(this.connectTimeout);
+            this.connectTimeout = null;
+        }
+        if (this.pendingConnectReject) {
+            this.pendingConnectReject = null; // Don't reject, just abandon the promise
+        }
         if (this.provider) {
             if (this.usesSharedSocket) {
                 // Detach from shared socket instead of disconnecting
@@ -792,6 +822,16 @@ class HocuspocusSyncProvider {
         this.isSynced = false;
     }
     destroy() {
+        // Mark as destroyed first to prevent any callbacks from doing work
+        this.isDestroyed = true;
+        // Cancel any pending connection attempt
+        if (this.connectTimeout) {
+            clearTimeout(this.connectTimeout);
+            this.connectTimeout = null;
+        }
+        if (this.pendingConnectReject) {
+            this.pendingConnectReject = null; // Don't reject, just abandon the promise
+        }
         if (this.provider) {
             this.provider.destroy();
         }

package/dist/cjs/kritzel-active-users_41.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var index = require('./index-Dc7LOVhs.js');
-var workspace_migrations = require('./workspace.migrations-Cma2Vh5E.js');
+var workspace_migrations = require('./workspace.migrations-DcwqsqPC.js');
 var Y = require('yjs');
 require('y-websocket');
 require('y-indexeddb');
@@ -2175,6 +2175,7 @@ const KritzelEditor = class {
         const activeWorkspace = await this.engineRef.getActiveWorkspace();
         activeWorkspace.isPublic = isPublic;
         await this.engineRef.updateWorkspace(activeWorkspace);
+        this.activeWorkspace = activeWorkspace.clone();
         this.isPublicChange.emit({ isPublic, workspaceId: this.activeWorkspace?.id });
     };
     /**
@@ -2288,7 +2289,7 @@ const KritzelEditor = class {
         const isLoggedIn = this.isLoggedIn;
         const shouldShowCurrentUser = isLoggedIn;
         const shouldShowLoginButton = !!this.loginConfig && !isLoggedIn;
-        return (index.h(index.Host, { key: '0339b3ea217d55c8192efa53ad8059ff2ffdd578' }, index.h("div", { key: '2149a3f5e251a398e0c7815ebb88d251cbc83d9d', class: "top-left-buttons" }, index.h("kritzel-workspace-manager", { key: '727f465560d3a8aa49ebdfba9251df26b748669a', workspaces: this.workspaces, activeWorkspace: this.activeWorkspace, onWorkspaceChange: event => (this.activeWorkspace = event.detail), onIsWorkspaceManagerReady: () => (this.isWorkspaceManagerReady = true) }), index.h("kritzel-back-to-content", { key: '269748350eef82b390893ed5b8b6516eef85fa1f', visible: this.isBackToContentButtonVisible, onBackToContent: () => this.backToContent() })), index.h("kritzel-engine", { key: 'c8248639b41f4500718d745b55c988b9f63fde27', ref: el => (this.engineRef = el), workspace: this.activeWorkspace, activeWorkspaceId: this.activeWorkspaceId, editorId: this.editorId, syncConfig: this.syncConfig, user: this.user, scaleMax: this.scaleMax, lockDrawingScale: this.lockDrawingScale, scaleMin: this.scaleMin, viewportBoundaryLeft: this.viewportBoundaryLeft, viewportBoundaryRight: this.viewportBoundaryRight, viewportBoundaryTop: this.viewportBoundaryTop, viewportBoundaryBottom: this.viewportBoundaryBottom, wheelEnabled: this.wheelEnabled, theme: this.currentTheme, 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) }), index.h("kritzel-controls", { key: 'fc1be924d9807aba8aad966bf8ea14785064ed45', class: { 'keyboard-open': this.isVirtualKeyboardOpen }, style: { display: this.isControlsVisible ? 'flex' : 'none' }, ref: el => (this.controlsRef = el), controls: this.controls, isUtilityPanelVisible: this.isUtilityPanelVisible, undoState: this.undoState, theme: this.currentTheme, onIsControlsReady: () => (this.isControlsReady = true) }), index.h("div", { key: '12800aa2e7833e838b91d194274344a904d5410b', class: "top-right-buttons" }, index.h("kritzel-settings", { key: 'cb540f195a5a56159999c7d33fccbf94a9d25764', ref: el => (this.settingsRef = el), shortcuts: this.shortcuts, editorId: this.editorId, onSettingsChange: event => this.handleSettingsChange(event) }), index.h("kritzel-export", { key: 'fd17ac3acbf352ee2e1ca797bd72b2d9a4183323', ref: el => (this.exportRef = el), workspaceName: this.activeWorkspace?.name || 'workspace', onExportPng: () => this.engineRef.exportViewportAsPng(), onExportSvg: () => this.engineRef.exportViewportAsSvg(), onExportJson: event => this.engineRef.downloadAsJson(event.detail) }), index.h("kritzel-active-users", { key: '74879be875fe6db127f4864f8aad08f39901e053', users: this.activeUsers }), shouldShowCurrentUser && (index.h("kritzel-current-user", { key: 'a4bc322c69f0784c39c043f0089853babbdd1584', user: this.user })), shouldShowLoginButton && index.h("kritzel-button", { key: 'fb89dd330087ee2dd7288285071ee28a97bcec8e', onButtonClick: () => this.loginDialogRef?.open() }, "Sign in"), index.h("kritzel-more-menu", { key: 'bba9421fab99b82143880478329973f33bfb3039', items: this.moreMenuItems }), index.h("kritzel-share-dialog", { key: 'd03c43ce77c16fd3a5cce7aa134d5ef73361d8b3', ref: el => (this.shareDialogRef = el), isPublic: this.currentIsPublic, workspaceId: this.activeWorkspace?.id, onToggleIsPublic: this.handleToggleIsPublic }), this.loginConfig && (index.h("kritzel-login-dialog", { key: 'ced23497db2b7abea1f2121085a21ed9208ecba9', ref: el => (this.loginDialogRef = el), providers: this.loginConfig.providers, dialogTitle: this.loginConfig.title, subtitle: this.loginConfig.subtitle, onProviderLogin: this.handleProviderLogin })))));
+        return (index.h(index.Host, { key: '84231308ca4b12863139aeeafa754d544345df3f' }, index.h("div", { key: 'b8cdd2862e9bd892dfeed356e85d608759307bf7', class: "top-left-buttons" }, index.h("kritzel-workspace-manager", { key: '2bce2b9564f5a083ba32667718685310d060f23a', workspaces: this.workspaces, activeWorkspace: this.activeWorkspace, onWorkspaceChange: event => (this.activeWorkspace = event.detail), onIsWorkspaceManagerReady: () => (this.isWorkspaceManagerReady = true) }), index.h("kritzel-back-to-content", { key: 'b013213fc04fe86eefcc324911693fcffb8eea51', visible: this.isBackToContentButtonVisible, onBackToContent: () => this.backToContent() })), index.h("kritzel-engine", { key: '7338446462bfdc3995c0897704e9594a875895e1', ref: el => (this.engineRef = el), workspace: this.activeWorkspace, activeWorkspaceId: this.activeWorkspaceId, editorId: this.editorId, syncConfig: this.syncConfig, user: this.user, scaleMax: this.scaleMax, lockDrawingScale: this.lockDrawingScale, scaleMin: this.scaleMin, viewportBoundaryLeft: this.viewportBoundaryLeft, viewportBoundaryRight: this.viewportBoundaryRight, viewportBoundaryTop: this.viewportBoundaryTop, viewportBoundaryBottom: this.viewportBoundaryBottom, wheelEnabled: this.wheelEnabled, theme: this.currentTheme, 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) }), index.h("kritzel-controls", { key: '97b9d8805446afc101f01d99bc96bc24a7054722', class: { 'keyboard-open': this.isVirtualKeyboardOpen }, style: { display: this.isControlsVisible ? 'flex' : 'none' }, ref: el => (this.controlsRef = el), controls: this.controls, isUtilityPanelVisible: this.isUtilityPanelVisible, undoState: this.undoState, theme: this.currentTheme, onIsControlsReady: () => (this.isControlsReady = true) }), index.h("div", { key: '0986b1e82b8fbf989e716fe07a401faca618f642', class: "top-right-buttons" }, index.h("kritzel-settings", { key: '6f4cfe92bb54f0de291b0a0482742b859e86ecf3', ref: el => (this.settingsRef = el), shortcuts: this.shortcuts, editorId: this.editorId, onSettingsChange: event => this.handleSettingsChange(event) }), index.h("kritzel-export", { key: 'd669ecae49f721e765d1f8d2f6725633c28cd635', ref: el => (this.exportRef = el), workspaceName: this.activeWorkspace?.name || 'workspace', onExportPng: () => this.engineRef.exportViewportAsPng(), onExportSvg: () => this.engineRef.exportViewportAsSvg(), onExportJson: event => this.engineRef.downloadAsJson(event.detail) }), index.h("kritzel-active-users", { key: 'e44843dcdc9c0ff1e760aadac3f2ec79a7371aba', users: this.activeUsers }), shouldShowCurrentUser && index.h("kritzel-current-user", { key: '364e09a58fd147f29ce7402406907c6c633124bc', user: this.user }), shouldShowLoginButton && index.h("kritzel-button", { key: '79705ba4c5f991229ae08b90a3397bd3bac56333', onButtonClick: () => this.loginDialogRef?.open() }, "Sign in"), index.h("kritzel-more-menu", { key: '95bd3a7f755aa941bd3d9ffdbc2c7f433e5beaaa', items: this.moreMenuItems }), index.h("kritzel-share-dialog", { key: '94f6cfdb67b82d35c6e86f37c88c2ec323234360', ref: el => (this.shareDialogRef = el), isPublic: this.currentIsPublic, workspaceId: this.activeWorkspace?.id, onToggleIsPublic: this.handleToggleIsPublic }), this.loginConfig && (index.h("kritzel-login-dialog", { key: 'bc4fd1ec6e61f4d4e61c043ad33a0b0e2c3c8792', ref: el => (this.loginDialogRef = el), providers: this.loginConfig.providers, dialogTitle: this.loginConfig.title, subtitle: this.loginConfig.subtitle, onProviderLogin: this.handleProviderLogin })))));
     }
     static get watchers() { return {
         "isEngineReady": [{
@@ -21001,6 +21002,9 @@ class KritzelObjectMap {
     _stackItemPoppedHandler = null;
     _awarenessChangeHandler = null;
     _awarenessChangeCallbacks = [];
+    _lastAwarenessEmitTime = 0;
+    _awarenessEmitTimeout = null;
+    AWARENESS_THROTTLE_INTERVAL = 100; // milliseconds
     /**
      * Indicates whether the object map has been initialized and is ready for use.
      * @returns `true` if providers are connected and the map is operational
@@ -21190,9 +21194,32 @@ class KritzelObjectMap {
         // Subscribe to awareness changes
         if (this._awareness) {
             this._awarenessChangeHandler = () => {
-                const states = this._awareness.getStates();
-                for (const callback of this._awarenessChangeCallbacks) {
-                    callback(states);
+                const now = Date.now();
+                const timeSinceLastEmit = now - this._lastAwarenessEmitTime;
+                // Clear any pending timeout since we have a new event
+                if (this._awarenessEmitTimeout !== null) {
+                    clearTimeout(this._awarenessEmitTimeout);
+                    this._awarenessEmitTimeout = null;
+                }
+                if (timeSinceLastEmit >= this.AWARENESS_THROTTLE_INTERVAL) {
+                    // Enough time has passed, emit immediately
+                    this._lastAwarenessEmitTime = now;
+                    const states = this._awareness.getStates();
+                    for (const callback of this._awarenessChangeCallbacks) {
+                        callback(states);
+                    }
+                }
+                else {
+                    // Schedule emission for the remaining time
+                    const delayMs = this.AWARENESS_THROTTLE_INTERVAL - timeSinceLastEmit;
+                    this._awarenessEmitTimeout = setTimeout(() => {
+                        this._lastAwarenessEmitTime = Date.now();
+                        this._awarenessEmitTimeout = null;
+                        const states = this._awareness.getStates();
+                        for (const callback of this._awarenessChangeCallbacks) {
+                            callback(states);
+                        }
+                    }, delayMs);
                 }
             };
             this._awareness.on('change', this._awarenessChangeHandler);
@@ -21712,11 +21739,14 @@ class KritzelObjectMap {
             this._awareness.off('change', this._awarenessChangeHandler);
             this._awarenessChangeHandler = null;
         }
+        if (this._awarenessEmitTimeout !== null) {
+            clearTimeout(this._awarenessEmitTimeout);
+            this._awarenessEmitTimeout = null;
+        }
         this._awareness = null;
         this._awarenessChangeCallbacks = [];
-        // Disconnect and destroy providers
+        // Destroy providers (destroy handles disconnection internally)
         this._providers.forEach(p => {
-            p.disconnect();
             p.destroy();
         });
         this._providers = [];
@@ -22879,13 +22909,11 @@ class KritzelCore {
      * @param workspace - The workspace to create
      */
     createWorkspace(workspace) {
-        console.log('Creating workspace:', workspace);
         workspace._core = this;
         workspace.createdAt = new Date();
         workspace.updatedAt = new Date();
         this.saveWorkspaceToAppState(workspace);
         this._store.state.workspaces = this.loadWorkspacesFromAppState();
-        console.log('Current workspaces after creation:', this._store.state.workspaces);
     }
     /**
      * Updates an existing workspace in the app state.
@@ -27994,7 +28022,7 @@ const KritzelPortal = class {
  * This file is auto-generated by the version bump scripts.
  * Do not modify manually.
  */
-const KRITZEL_VERSION = '0.1.71';
+const KRITZEL_VERSION = '0.1.73';
 
 const kritzelSettingsCss = () => `:host{display:contents}kritzel-dialog{--kritzel-dialog-body-padding:0;--kritzel-dialog-width-large:800px;--kritzel-dialog-height-large:500px}.footer-button{padding:8px 16px;border-radius:6px;cursor:pointer;font-size:14px}.cancel-button{border:1px solid #ebebeb;background:#fff;color:inherit}.cancel-button:hover{background:#f5f5f5}.settings-content{padding:0}.settings-content h3{margin:0 0 16px 0;font-size:18px;font-weight:600;color:var(--kritzel-settings-content-heading-color, #333333)}.settings-content p{margin:0;font-size:14px;color:var(--kritzel-settings-content-text-color, #666666);line-height:1.5}.settings-group{display:flex;flex-direction:column;gap:24px}.settings-item{display:flex;flex-direction:column;gap:8px}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:16px}.settings-label{font-size:14px;font-weight:600;color:var(--kritzel-settings-label-color, #333333);margin:0 0 4px 0}.settings-description{font-size:12px;color:var(--kritzel-settings-description-color, #888888);margin:0;line-height:1.4}.shortcuts-list{display:flex;flex-direction:column;gap:24px}.shortcuts-category{display:flex;flex-direction:column;gap:8px}.shortcuts-category-title{font-size:14px;font-weight:600;color:var(--kritzel-settings-label-color, #333333);margin:0 0 4px 0}.shortcuts-group{display:flex;flex-direction:column;gap:4px}.shortcut-item{display:flex;justify-content:space-between;align-items:center;padding:6px 8px;border-radius:4px;background:var(--kritzel-settings-shortcut-item-bg, rgba(0, 0, 0, 0.02))}.shortcut-label{font-size:14px;color:var(--kritzel-settings-content-text-color, #666666)}.shortcut-key{font-family:monospace;font-size:12px;padding:2px 8px;border-radius:4px;background:var(--kritzel-settings-shortcut-key-bg, #f0f0f0);color:var(--kritzel-settings-shortcut-key-color, #333333);border:1px solid var(--kritzel-settings-shortcut-key-border, #ddd)}`;
 

package/dist/cjs/{workspace.migrations-Cma2Vh5E.js → workspace.migrations-DcwqsqPC.js}

@@ -25254,6 +25254,13 @@ class KritzelWorkspace {
         }
         return serialized;
     }
+    /**
+     * Creates a shallow clone of this workspace, preserving the prototype chain.
+     * Useful when Stencil needs a new object reference to detect property changes.
+     */
+    clone() {
+        return Object.assign(Object.create(Object.getPrototypeOf(this)), this);
+    }
     /**
      * Deserializes a plain object into this workspace instance.
      * Converts ISO string dates back to Date objects.

package/dist/collection/classes/core/core.class.js

@@ -339,13 +339,11 @@ export class KritzelCore {
      * @param workspace - The workspace to create
      */
     createWorkspace(workspace) {
-        console.log('Creating workspace:', workspace);
         workspace._core = this;
         workspace.createdAt = new Date();
         workspace.updatedAt = new Date();
         this.saveWorkspaceToAppState(workspace);
         this._store.state.workspaces = this.loadWorkspacesFromAppState();
-        console.log('Current workspaces after creation:', this._store.state.workspaces);
     }
     /**
      * Updates an existing workspace in the app state.

package/dist/collection/classes/core/workspace.class.js

@@ -77,6 +77,13 @@ export class KritzelWorkspace {
         }
         return serialized;
     }
+    /**
+     * Creates a shallow clone of this workspace, preserving the prototype chain.
+     * Useful when Stencil needs a new object reference to detect property changes.
+     */
+    clone() {
+        return Object.assign(Object.create(Object.getPrototypeOf(this)), this);
+    }
     /**
      * Deserializes a plain object into this workspace instance.
      * Converts ISO string dates back to Date objects.

package/dist/collection/classes/providers/hocuspocus-sync-provider.class.js

@@ -8,6 +8,9 @@ export class HocuspocusSyncProvider {
     isConnected = false;
     isSynced = false;
     usesSharedSocket = false;
+    isDestroyed = false;
+    connectTimeout = null;
+    pendingConnectReject = null;
     get awareness() {
         return this.provider.awareness;
     }
@@ -26,8 +29,13 @@ export class HocuspocusSyncProvider {
                 name,
                 document: doc,
                 token: options?.token || null,
+                onStatus: (data) => {
+                    if (options?.onStatus) {
+                        options.onStatus(data);
+                    }
+                },
                 onConnect: () => {
-                    if (this.isConnected) {
+                    if (this.isConnected || this.isDestroyed) {
                         return;
                     }
                     this.isConnected = true;
@@ -39,7 +47,7 @@ export class HocuspocusSyncProvider {
                     }
                 },
                 onDisconnect: () => {
-                    if (!this.isConnected && !this.isSynced) {
+                    if (this.isDestroyed || (!this.isConnected && !this.isSynced)) {
                         return;
                     }
                     this.isConnected = false;
@@ -52,7 +60,7 @@ export class HocuspocusSyncProvider {
                     }
                 },
                 onSynced: () => {
-                    if (this.isSynced) {
+                    if (this.isSynced || this.isDestroyed) {
                         return;
                     }
                     this.isSynced = true;
@@ -71,9 +79,6 @@ export class HocuspocusSyncProvider {
             if (options?.onAuthenticationFailed) {
                 config.onAuthenticationFailed = options.onAuthenticationFailed;
             }
-            if (options?.onStatus) {
-                config.onStatus = options.onStatus;
-            }
             this.provider = new HocuspocusProvider(config);
             // Must call attach() explicitly when using shared socket
             this.provider.attach();
@@ -89,8 +94,14 @@ export class HocuspocusSyncProvider {
                 name,
                 document: doc,
                 token: options?.token || null,
+                autoConnect: false,
+                onStatus: (data) => {
+                    if (options?.onStatus) {
+                        options.onStatus(data);
+                    }
+                },
                 onConnect: () => {
-                    if (this.isConnected) {
+                    if (this.isConnected || this.isDestroyed) {
                         return;
                     }
                     this.isConnected = true;
@@ -102,7 +113,7 @@ export class HocuspocusSyncProvider {
                     }
                 },
                 onDisconnect: () => {
-                    if (!this.isConnected && !this.isSynced) {
+                    if (this.isDestroyed || (!this.isConnected && !this.isSynced)) {
                         return;
                     }
                     this.isConnected = false;
@@ -115,7 +126,7 @@ export class HocuspocusSyncProvider {
                     }
                 },
                 onSynced: () => {
-                    if (this.isSynced) {
+                    if (this.isSynced || this.isDestroyed) {
                         return;
                     }
                     this.isSynced = true;
@@ -134,9 +145,6 @@ export class HocuspocusSyncProvider {
             if (options?.onAuthenticationFailed) {
                 config.onAuthenticationFailed = options.onAuthenticationFailed;
             }
-            if (options?.onStatus) {
-                config.onStatus = options.onStatus;
-            }
             if (options?.WebSocketPolyfill) {
                 config.WebSocketPolyfill = options.WebSocketPolyfill;
             }
@@ -204,22 +212,36 @@ export class HocuspocusSyncProvider {
         };
     }
     async connect() {
-        if (this.isSynced) {
+        if (this.isSynced || this.isDestroyed) {
             return;
         }
         return new Promise((resolve, reject) => {
-            const timeout = setTimeout(() => {
+            // Store reject function so we can cancel the connection if destroyed
+            this.pendingConnectReject = reject;
+            this.connectTimeout = setTimeout(() => {
+                this.pendingConnectReject = null;
+                this.connectTimeout = null;
                 reject(new Error('Hocuspocus connection timeout'));
             }, 10000); // 10 second timeout
             const syncHandler = () => {
-                clearTimeout(timeout);
+                if (this.connectTimeout) {
+                    clearTimeout(this.connectTimeout);
+                    this.connectTimeout = null;
+                }
+                this.pendingConnectReject = null;
                 this.provider.off('synced', syncHandler);
-                resolve();
+                if (!this.isDestroyed) {
+                    resolve();
+                }
             };
             this.provider.on('synced', syncHandler);
             // If already synced, resolve immediately
             if (this.provider.isSynced) {
-                clearTimeout(timeout);
+                if (this.connectTimeout) {
+                    clearTimeout(this.connectTimeout);
+                    this.connectTimeout = null;
+                }
+                this.pendingConnectReject = null;
                 this.provider.off('synced', syncHandler);
                 resolve();
                 return;
@@ -231,6 +253,14 @@ export class HocuspocusSyncProvider {
         });
     }
     disconnect() {
+        // Cancel any pending connection attempt
+        if (this.connectTimeout) {
+            clearTimeout(this.connectTimeout);
+            this.connectTimeout = null;
+        }
+        if (this.pendingConnectReject) {
+            this.pendingConnectReject = null; // Don't reject, just abandon the promise
+        }
         if (this.provider) {
             if (this.usesSharedSocket) {
                 // Detach from shared socket instead of disconnecting
@@ -244,6 +274,16 @@ export class HocuspocusSyncProvider {
         this.isSynced = false;
     }
     destroy() {
+        // Mark as destroyed first to prevent any callbacks from doing work
+        this.isDestroyed = true;
+        // Cancel any pending connection attempt
+        if (this.connectTimeout) {
+            clearTimeout(this.connectTimeout);
+            this.connectTimeout = null;
+        }
+        if (this.pendingConnectReject) {
+            this.pendingConnectReject = null; // Don't reject, just abandon the promise
+        }
         if (this.provider) {
             this.provider.destroy();
         }

package/dist/collection/classes/structures/object-map.structure.js

@@ -34,6 +34,9 @@ export class KritzelObjectMap {
     _stackItemPoppedHandler = null;
     _awarenessChangeHandler = null;
     _awarenessChangeCallbacks = [];
+    _lastAwarenessEmitTime = 0;
+    _awarenessEmitTimeout = null;
+    AWARENESS_THROTTLE_INTERVAL = 100; // milliseconds
     /**
      * Indicates whether the object map has been initialized and is ready for use.
      * @returns `true` if providers are connected and the map is operational
@@ -223,9 +226,32 @@ export class KritzelObjectMap {
         // Subscribe to awareness changes
         if (this._awareness) {
             this._awarenessChangeHandler = () => {
-                const states = this._awareness.getStates();
-                for (const callback of this._awarenessChangeCallbacks) {
-                    callback(states);
+                const now = Date.now();
+                const timeSinceLastEmit = now - this._lastAwarenessEmitTime;
+                // Clear any pending timeout since we have a new event
+                if (this._awarenessEmitTimeout !== null) {
+                    clearTimeout(this._awarenessEmitTimeout);
+                    this._awarenessEmitTimeout = null;
+                }
+                if (timeSinceLastEmit >= this.AWARENESS_THROTTLE_INTERVAL) {
+                    // Enough time has passed, emit immediately
+                    this._lastAwarenessEmitTime = now;
+                    const states = this._awareness.getStates();
+                    for (const callback of this._awarenessChangeCallbacks) {
+                        callback(states);
+                    }
+                }
+                else {
+                    // Schedule emission for the remaining time
+                    const delayMs = this.AWARENESS_THROTTLE_INTERVAL - timeSinceLastEmit;
+                    this._awarenessEmitTimeout = setTimeout(() => {
+                        this._lastAwarenessEmitTime = Date.now();
+                        this._awarenessEmitTimeout = null;
+                        const states = this._awareness.getStates();
+                        for (const callback of this._awarenessChangeCallbacks) {
+                            callback(states);
+                        }
+                    }, delayMs);
                 }
             };
             this._awareness.on('change', this._awarenessChangeHandler);
@@ -752,11 +778,14 @@ export class KritzelObjectMap {
             this._awareness.off('change', this._awarenessChangeHandler);
             this._awarenessChangeHandler = null;
         }
+        if (this._awarenessEmitTimeout !== null) {
+            clearTimeout(this._awarenessEmitTimeout);
+            this._awarenessEmitTimeout = null;
+        }
         this._awareness = null;
         this._awarenessChangeCallbacks = [];
-        // Disconnect and destroy providers
+        // Destroy providers (destroy handles disconnection internally)
         this._providers.forEach(p => {
-            p.disconnect();
             p.destroy();
         });
         this._providers = [];

package/dist/collection/components/core/kritzel-editor/kritzel-editor.js

@@ -583,6 +583,7 @@ export class KritzelEditor {
         const activeWorkspace = await this.engineRef.getActiveWorkspace();
         activeWorkspace.isPublic = isPublic;
         await this.engineRef.updateWorkspace(activeWorkspace);
+        this.activeWorkspace = activeWorkspace.clone();
         this.isPublicChange.emit({ isPublic, workspaceId: this.activeWorkspace?.id });
     };
     /**
@@ -696,7 +697,7 @@ export class KritzelEditor {
         const isLoggedIn = this.isLoggedIn;
         const shouldShowCurrentUser = isLoggedIn;
         const shouldShowLoginButton = !!this.loginConfig && !isLoggedIn;
-        return (h(Host, { key: '0339b3ea217d55c8192efa53ad8059ff2ffdd578' }, h("div", { key: '2149a3f5e251a398e0c7815ebb88d251cbc83d9d', class: "top-left-buttons" }, h("kritzel-workspace-manager", { key: '727f465560d3a8aa49ebdfba9251df26b748669a', workspaces: this.workspaces, activeWorkspace: this.activeWorkspace, onWorkspaceChange: event => (this.activeWorkspace = event.detail), onIsWorkspaceManagerReady: () => (this.isWorkspaceManagerReady = true) }), h("kritzel-back-to-content", { key: '269748350eef82b390893ed5b8b6516eef85fa1f', visible: this.isBackToContentButtonVisible, onBackToContent: () => this.backToContent() })), h("kritzel-engine", { key: 'c8248639b41f4500718d745b55c988b9f63fde27', ref: el => (this.engineRef = el), workspace: this.activeWorkspace, activeWorkspaceId: this.activeWorkspaceId, editorId: this.editorId, syncConfig: this.syncConfig, user: this.user, scaleMax: this.scaleMax, lockDrawingScale: this.lockDrawingScale, scaleMin: this.scaleMin, viewportBoundaryLeft: this.viewportBoundaryLeft, viewportBoundaryRight: this.viewportBoundaryRight, viewportBoundaryTop: this.viewportBoundaryTop, viewportBoundaryBottom: this.viewportBoundaryBottom, wheelEnabled: this.wheelEnabled, theme: this.currentTheme, 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) }), h("kritzel-controls", { key: 'fc1be924d9807aba8aad966bf8ea14785064ed45', class: { 'keyboard-open': this.isVirtualKeyboardOpen }, style: { display: this.isControlsVisible ? 'flex' : 'none' }, ref: el => (this.controlsRef = el), controls: this.controls, isUtilityPanelVisible: this.isUtilityPanelVisible, undoState: this.undoState, theme: this.currentTheme, onIsControlsReady: () => (this.isControlsReady = true) }), h("div", { key: '12800aa2e7833e838b91d194274344a904d5410b', class: "top-right-buttons" }, h("kritzel-settings", { key: 'cb540f195a5a56159999c7d33fccbf94a9d25764', ref: el => (this.settingsRef = el), shortcuts: this.shortcuts, editorId: this.editorId, onSettingsChange: event => this.handleSettingsChange(event) }), h("kritzel-export", { key: 'fd17ac3acbf352ee2e1ca797bd72b2d9a4183323', ref: el => (this.exportRef = el), workspaceName: this.activeWorkspace?.name || 'workspace', onExportPng: () => this.engineRef.exportViewportAsPng(), onExportSvg: () => this.engineRef.exportViewportAsSvg(), onExportJson: event => this.engineRef.downloadAsJson(event.detail) }), h("kritzel-active-users", { key: '74879be875fe6db127f4864f8aad08f39901e053', users: this.activeUsers }), shouldShowCurrentUser && (h("kritzel-current-user", { key: 'a4bc322c69f0784c39c043f0089853babbdd1584', user: this.user })), shouldShowLoginButton && h("kritzel-button", { key: 'fb89dd330087ee2dd7288285071ee28a97bcec8e', onButtonClick: () => this.loginDialogRef?.open() }, "Sign in"), h("kritzel-more-menu", { key: 'bba9421fab99b82143880478329973f33bfb3039', items: this.moreMenuItems }), h("kritzel-share-dialog", { key: 'd03c43ce77c16fd3a5cce7aa134d5ef73361d8b3', ref: el => (this.shareDialogRef = el), isPublic: this.currentIsPublic, workspaceId: this.activeWorkspace?.id, onToggleIsPublic: this.handleToggleIsPublic }), this.loginConfig && (h("kritzel-login-dialog", { key: 'ced23497db2b7abea1f2121085a21ed9208ecba9', ref: el => (this.loginDialogRef = el), providers: this.loginConfig.providers, dialogTitle: this.loginConfig.title, subtitle: this.loginConfig.subtitle, onProviderLogin: this.handleProviderLogin })))));
+        return (h(Host, { key: '84231308ca4b12863139aeeafa754d544345df3f' }, h("div", { key: 'b8cdd2862e9bd892dfeed356e85d608759307bf7', class: "top-left-buttons" }, h("kritzel-workspace-manager", { key: '2bce2b9564f5a083ba32667718685310d060f23a', workspaces: this.workspaces, activeWorkspace: this.activeWorkspace, onWorkspaceChange: event => (this.activeWorkspace = event.detail), onIsWorkspaceManagerReady: () => (this.isWorkspaceManagerReady = true) }), h("kritzel-back-to-content", { key: 'b013213fc04fe86eefcc324911693fcffb8eea51', visible: this.isBackToContentButtonVisible, onBackToContent: () => this.backToContent() })), h("kritzel-engine", { key: '7338446462bfdc3995c0897704e9594a875895e1', ref: el => (this.engineRef = el), workspace: this.activeWorkspace, activeWorkspaceId: this.activeWorkspaceId, editorId: this.editorId, syncConfig: this.syncConfig, user: this.user, scaleMax: this.scaleMax, lockDrawingScale: this.lockDrawingScale, scaleMin: this.scaleMin, viewportBoundaryLeft: this.viewportBoundaryLeft, viewportBoundaryRight: this.viewportBoundaryRight, viewportBoundaryTop: this.viewportBoundaryTop, viewportBoundaryBottom: this.viewportBoundaryBottom, wheelEnabled: this.wheelEnabled, theme: this.currentTheme, 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) }), h("kritzel-controls", { key: '97b9d8805446afc101f01d99bc96bc24a7054722', class: { 'keyboard-open': this.isVirtualKeyboardOpen }, style: { display: this.isControlsVisible ? 'flex' : 'none' }, ref: el => (this.controlsRef = el), controls: this.controls, isUtilityPanelVisible: this.isUtilityPanelVisible, undoState: this.undoState, theme: this.currentTheme, onIsControlsReady: () => (this.isControlsReady = true) }), h("div", { key: '0986b1e82b8fbf989e716fe07a401faca618f642', class: "top-right-buttons" }, h("kritzel-settings", { key: '6f4cfe92bb54f0de291b0a0482742b859e86ecf3', ref: el => (this.settingsRef = el), shortcuts: this.shortcuts, editorId: this.editorId, onSettingsChange: event => this.handleSettingsChange(event) }), h("kritzel-export", { key: 'd669ecae49f721e765d1f8d2f6725633c28cd635', ref: el => (this.exportRef = el), workspaceName: this.activeWorkspace?.name || 'workspace', onExportPng: () => this.engineRef.exportViewportAsPng(), onExportSvg: () => this.engineRef.exportViewportAsSvg(), onExportJson: event => this.engineRef.downloadAsJson(event.detail) }), h("kritzel-active-users", { key: 'e44843dcdc9c0ff1e760aadac3f2ec79a7371aba', users: this.activeUsers }), shouldShowCurrentUser && h("kritzel-current-user", { key: '364e09a58fd147f29ce7402406907c6c633124bc', user: this.user }), shouldShowLoginButton && h("kritzel-button", { key: '79705ba4c5f991229ae08b90a3397bd3bac56333', onButtonClick: () => this.loginDialogRef?.open() }, "Sign in"), h("kritzel-more-menu", { key: '95bd3a7f755aa941bd3d9ffdbc2c7f433e5beaaa', items: this.moreMenuItems }), h("kritzel-share-dialog", { key: '94f6cfdb67b82d35c6e86f37c88c2ec323234360', ref: el => (this.shareDialogRef = el), isPublic: this.currentIsPublic, workspaceId: this.activeWorkspace?.id, onToggleIsPublic: this.handleToggleIsPublic }), this.loginConfig && (h("kritzel-login-dialog", { key: 'bc4fd1ec6e61f4d4e61c043ad33a0b0e2c3c8792', ref: el => (this.loginDialogRef = el), providers: this.loginConfig.providers, dialogTitle: this.loginConfig.title, subtitle: this.loginConfig.subtitle, onProviderLogin: this.handleProviderLogin })))));
     }
     static get is() { return "kritzel-editor"; }
     static get originalStyleUrls() {

package/dist/collection/constants/version.js

@@ -3,4 +3,4 @@
  * This file is auto-generated by the version bump scripts.
  * Do not modify manually.
  */
-export const KRITZEL_VERSION = '0.1.71';
+export const KRITZEL_VERSION = '0.1.73';