kritzel-stencil 0.1.46 → 0.1.47

package/dist/cjs/index.cjs.js

@@ -378,7 +378,9 @@ class BroadcastSyncProvider {
         setTimeout(() => {
             this._synced = true;
         }, 100);
-        console.info(`BroadcastChannel Provider initialized: ${docName}`);
+        if (!_options?.quiet) {
+            console.info(`BroadcastChannel Provider initialized: ${docName}`);
+        }
     }
     handleDocUpdate = (update, origin) => {
         // Don't broadcast updates that came from other tabs (to prevent loops)
@@ -451,6 +453,7 @@ class BroadcastSyncProvider {
 class WebSocketSyncProvider {
     provider;
     isConnected = false;
+    _quiet = false;
     constructor(docName, doc, options) {
         const url = options?.url || 'ws://localhost:1234';
         const roomName = options?.roomName || docName;
@@ -462,8 +465,11 @@ class WebSocketSyncProvider {
             maxBackoffTime: options?.maxBackoffTime,
             disableBc: true,
         });
+        this._quiet = options?.quiet ?? false;
         this.setupEventListeners();
-        console.info(`WebSocket Provider initialized: ${url}/${roomName}`);
+        if (!this._quiet) {
+            console.info(`WebSocket Provider initialized: ${url}/${roomName}`);
+        }
     }
     /**
      * Static factory method for creating WebSocketSyncProvider with configuration options
@@ -471,8 +477,9 @@ class WebSocketSyncProvider {
      */
     static with(options) {
         return {
-            create: (docName, doc) => {
-                return new WebSocketSyncProvider(docName, doc, options);
+            create: (docName, doc, runtimeOptions) => {
+                const mergedOptions = runtimeOptions ? { ...options, ...runtimeOptions } : options;
+                return new WebSocketSyncProvider(docName, doc, mergedOptions);
             },
         };
     }
@@ -480,15 +487,19 @@ class WebSocketSyncProvider {
         this.provider.on('status', ({ status }) => {
             if (status === 'connected') {
                 this.isConnected = true;
-                console.info('WebSocket connected');
+                if (!this._quiet) {
+                    console.info('WebSocket connected');
+                }
             }
             else if (status === 'disconnected') {
                 this.isConnected = false;
-                console.info('WebSocket disconnected');
+                if (!this._quiet) {
+                    console.info('WebSocket disconnected');
+                }
             }
         });
         this.provider.on('sync', (synced) => {
-            if (synced) {
+            if (synced && !this._quiet) {
                 console.info('WebSocket synced');
             }
         });
@@ -3362,6 +3373,9 @@ class HocuspocusSyncProvider {
                 document: doc,
                 token: options?.token || null,
                 onConnect: () => {
+                    if (this.isConnected) {
+                        return;
+                    }
                     this.isConnected = true;
                     if (!options?.quiet) {
                         console.info(`Hocuspocus connected: ${name}`);
@@ -3371,6 +3385,9 @@ class HocuspocusSyncProvider {
                     }
                 },
                 onDisconnect: () => {
+                    if (!this.isConnected && !this.isSynced) {
+                        return;
+                    }
                     this.isConnected = false;
                     this.isSynced = false;
                     if (!options?.quiet) {
@@ -3381,6 +3398,9 @@ class HocuspocusSyncProvider {
                     }
                 },
                 onSynced: () => {
+                    if (this.isSynced) {
+                        return;
+                    }
                     this.isSynced = true;
                     if (!options?.quiet) {
                         console.info(`Hocuspocus synced: ${name}`);
@@ -3416,6 +3436,9 @@ class HocuspocusSyncProvider {
                 document: doc,
                 token: options?.token || null,
                 onConnect: () => {
+                    if (this.isConnected) {
+                        return;
+                    }
                     this.isConnected = true;
                     if (!options?.quiet) {
                         console.info(`Hocuspocus connected: ${name}`);
@@ -3425,6 +3448,9 @@ class HocuspocusSyncProvider {
                     }
                 },
                 onDisconnect: () => {
+                    if (!this.isConnected && !this.isSynced) {
+                        return;
+                    }
                     this.isConnected = false;
                     this.isSynced = false;
                     if (!options?.quiet) {
@@ -3435,6 +3461,9 @@ class HocuspocusSyncProvider {
                     }
                 },
                 onSynced: () => {
+                    if (this.isSynced) {
+                        return;
+                    }
                     this.isSynced = true;
                     if (!options?.quiet) {
                         console.info(`Hocuspocus synced: ${name}`);
@@ -3514,8 +3543,9 @@ class HocuspocusSyncProvider {
      */
     static with(options) {
         return {
-            create: (docName, doc) => {
-                return new HocuspocusSyncProvider(docName, doc, options);
+            create: (docName, doc, runtimeOptions) => {
+                const mergedOptions = runtimeOptions ? { ...options, ...runtimeOptions } : options;
+                return new HocuspocusSyncProvider(docName, doc, mergedOptions);
             },
         };
     }

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

@@ -1991,7 +1991,6 @@ const KritzelEditor = class {
         this.registerCustomSvgIcons();
         this.listenForMobileKeyboard();
         this.setOsSpecificCssVariables();
-        console.log('loaded editor');
     }
     async checkIsReady() {
         await customElements.whenDefined('kritzel-editor');
@@ -2184,7 +2183,7 @@ const KritzelEditor = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '496c072de4cb9d0998b4b93d41b6f34d2594336f' }, index.h("div", { key: '61640aefd176f9d2056c55658121754bf656d7a8', class: "top-left-buttons" }, index.h("kritzel-workspace-manager", { key: 'ad017b4dadf7edae048fd69d40d89bef07fad6f4', workspaces: this.workspaces, activeWorkspace: this.activeWorkspace, onWorkspaceChange: event => (this.activeWorkspace = event.detail), onIsWorkspaceManagerReady: () => (this.isWorkspaceManagerReady = true) }), index.h("kritzel-back-to-content", { key: '65c24099b16c6f009f133709cc82e53e3689b2d9', visible: this.isBackToContentButtonVisible, onBackToContent: () => this.backToContent() })), index.h("kritzel-engine", { key: 'c2fc4b7e0b91f748fd4fbc3a34d5d5f9f67e5bfe', ref: el => (this.engineRef = el), workspace: this.activeWorkspace, activeWorkspaceId: this.activeWorkspaceId, editorId: this.editorId, syncConfig: this.syncConfig, 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, 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) }), index.h("kritzel-controls", { key: '5caefbd8d401d9a056f9d2ce67d72d86f7fc63c1', 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: 'e52903a9bfa8ed18e5897a8cb5789be9416aab85', class: "top-right-buttons" }, index.h("kritzel-settings", { key: 'd2a9153401a6da7d12e334b0b11227e258f31a65', ref: el => (this.settingsRef = el), shortcuts: this.shortcuts, editorId: this.editorId, onSettingsChange: event => this.handleSettingsChange(event) }), index.h("kritzel-export", { key: 'b72e97833be9fe13a630f055e48530924336813b', 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: '2c2c994023eda91cc3f30e8341d1c854d0673a2a', users: this.activeUsers }), index.h("kritzel-current-user", { key: 'e650e21eed5f3136727b92b521fa4afa09d7d66a', user: this.user, onItemSelect: event => this.handleCurrentUserItemSelect(event) }), index.h("kritzel-more-menu", { key: '543e84bcbd99cbf9d101c346d571ec6a1d6db1fd', onItemSelect: event => this.handleMoreMenuItemSelect(event) }), index.h("kritzel-share-dialog", { key: '3ed56d1dbaff240a7fa90331bb2244dd836ff7f3', ref: el => (this.shareDialogRef = el), linkShare: this.currentLinkShare, workspaceId: this.activeWorkspace?.id, onToggleLinkShare: this.handleToggleLinkShare, onPermissionChange: this.handleSharePermissionChange }))));
+        return (index.h(index.Host, { key: '90a91249e483f27f52c6677483793a00e78e7488' }, index.h("div", { key: 'be2392052be658194bc00c029abe883ce3fb4a79', class: "top-left-buttons" }, index.h("kritzel-workspace-manager", { key: '3e0a4004dccbada37f1008c77ac143e453714db5', workspaces: this.workspaces, activeWorkspace: this.activeWorkspace, onWorkspaceChange: event => (this.activeWorkspace = event.detail), onIsWorkspaceManagerReady: () => (this.isWorkspaceManagerReady = true) }), index.h("kritzel-back-to-content", { key: 'f6d11f6e0bc0a0be10bab2c5757fadd18d0a305c', visible: this.isBackToContentButtonVisible, onBackToContent: () => this.backToContent() })), index.h("kritzel-engine", { key: 'a5720d2e7d7a2e257f17fd0e68a53d33b4bef711', ref: el => (this.engineRef = el), workspace: this.activeWorkspace, activeWorkspaceId: this.activeWorkspaceId, editorId: this.editorId, syncConfig: this.syncConfig, 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, 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) }), index.h("kritzel-controls", { key: '1324b903ea3cc8296467465a9524b812e65dd627', 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: '7b535fd7cd96bf64f64011b7cc30f8bd471b3bb6', class: "top-right-buttons" }, index.h("kritzel-settings", { key: '483995f3e3b81a381828d9dd0d2e25afb8a48966', ref: el => (this.settingsRef = el), shortcuts: this.shortcuts, editorId: this.editorId, onSettingsChange: event => this.handleSettingsChange(event) }), index.h("kritzel-export", { key: '8697a908a01a0cf6143b3822c232afd047e389a5', 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: '85a54896088999df529e70d524c775e92dcf5e6b', users: this.activeUsers }), index.h("kritzel-current-user", { key: 'cbcd428a95c2ab260f5fe175e75bbf9018de5c21', user: this.user, onItemSelect: event => this.handleCurrentUserItemSelect(event) }), index.h("kritzel-more-menu", { key: '972cc8721173cb2ed8ba448d9690e31e0a9321e1', onItemSelect: event => this.handleMoreMenuItemSelect(event) }), index.h("kritzel-share-dialog", { key: '3c5e325ca58af4f5c09e25bf8e059471f5e178d1', ref: el => (this.shareDialogRef = el), linkShare: this.currentLinkShare, workspaceId: this.activeWorkspace?.id, onToggleLinkShare: this.handleToggleLinkShare, onPermissionChange: this.handleSharePermissionChange }))));
     }
     static get watchers() { return {
         "isEngineReady": [{
@@ -20512,7 +20511,8 @@ const DEFAULT_ENGINE_CONFIG = {
     skipContextMenu: false,
     debugInfo: {
         showObjectInfo: false,
-        showViewportInfo: false
+        showViewportInfo: false,
+        showSyncProviderInfo: false
     },
     host: null,
     pointerX: 0,
@@ -20968,16 +20968,17 @@ class KritzelObjectMap {
         const docName = core.editorId ? `kritzel-workspace-${core.editorId}-${workspaceId}` : `kritzel-workspace-${workspaceId}`;
         const finalConfig = config ?? DEFAULT_SYNC_CONFIG;
         // Instantiate providers from configuration
+        const quiet = !core.store.state.debugInfo.showSyncProviderInfo;
         for (const providerConfig of finalConfig.providers) {
             let provider;
             // Check if it's a class constructor or a factory
             if (typeof providerConfig === 'function') {
                 // It's a class constructor
-                provider = new providerConfig(docName, this._ydoc);
+                provider = new providerConfig(docName, this._ydoc, { quiet });
             }
             else {
                 // It's a factory with a create method
-                provider = providerConfig.create(docName, this._ydoc);
+                provider = providerConfig.create(docName, this._ydoc, { quiet });
             }
             this._providers.push(provider);
         }
@@ -21781,16 +21782,17 @@ class KritzelAppStateMap {
         const docName = core.editorId ? `kritzel-app-state-${core.editorId}` : 'kritzel-app-state';
         const finalConfig = config ?? DEFAULT_SYNC_CONFIG;
         // Instantiate providers from configuration
+        const quiet = !core.store.state.debugInfo.showSyncProviderInfo;
         for (const providerConfig of finalConfig.providers) {
             let provider;
             // Check if it's a class constructor or a factory
             if (typeof providerConfig === 'function') {
                 // It's a class constructor
-                provider = new providerConfig(docName, this._ydoc);
+                provider = new providerConfig(docName, this._ydoc, { quiet });
             }
             else {
                 // It's a factory with a create method
-                provider = providerConfig.create(docName, this._ydoc);
+                provider = providerConfig.create(docName, this._ydoc, { quiet });
             }
             this._providers.push(provider);
         }
@@ -24657,7 +24659,7 @@ const KritzelEngine = class {
             return;
         }
         this.core.beforeWorkspaceChange();
-        await this.core.initializeWorkspace(newWorkspace);
+        await this.initializeWorkspaceIfNeeded(newWorkspace);
         this.activeWorkspaceChange.emit(this.core.store.state.activeWorkspace);
     }
     /** Optional unique identifier for namespacing storage keys across multiple editor instances. */
@@ -25730,6 +25732,8 @@ const KritzelEngine = class {
     _isYjsInitialized = false;
     _isResolvingActiveWorkspaceId = false;
     _stateChangeListenersRegistered = false;
+    _workspaceInitializationPromise = null;
+    _workspaceInitializationTargetKey = null;
     get isSelecting() {
         return this.core.store.state.activeTool instanceof alignment_enum.KritzelSelectionTool && this.core.store.state.isSelecting;
     }
@@ -25791,7 +25795,6 @@ const KritzelEngine = class {
             this.core.store.state.isReady = true;
             this.isEngineReady.emit(this.core.store.state);
         }
-        console.log('loaded engine');
     }
     async initializeSyncAndWorkspace() {
         // Set sync configuration if provided
@@ -25806,17 +25809,17 @@ const KritzelEngine = class {
         if (this.activeWorkspaceId) {
             const startupWorkspace = this.core.getWorkspaces().find(ws => ws.id === this.activeWorkspaceId);
             if (startupWorkspace) {
-                await this.core.initializeWorkspace(startupWorkspace);
+                await this.initializeWorkspaceIfNeeded(startupWorkspace);
             }
             else {
                 // When a specific workspace ID is requested, do not create a fallback workspace.
-                await this.core.initializeWorkspace(undefined, { skipFallbackCreation: true });
+                await this.initializeWorkspaceIfNeeded(undefined, { skipFallbackCreation: true });
             }
         }
         else {
             // Resolve startup workspace, preferring explicit workspace object when provided.
             const startupWorkspace = this.resolveStartupWorkspace();
-            await this.core.initializeWorkspace(startupWorkspace);
+            await this.initializeWorkspaceIfNeeded(startupWorkspace);
         }
         // Emit initial active workspace once startup initialization has completed
         const initialActiveWorkspace = this.core.store.state.activeWorkspace;
@@ -25868,9 +25871,32 @@ const KritzelEngine = class {
             return;
         }
         this.core.beforeWorkspaceChange();
-        await this.core.initializeWorkspace(workspace);
+        await this.initializeWorkspaceIfNeeded(workspace);
         this.activeWorkspaceChange.emit(this.core.store.state.activeWorkspace);
     }
+    async initializeWorkspaceIfNeeded(workspace, options) {
+        const targetWorkspaceId = workspace?.id ?? null;
+        const targetKey = targetWorkspaceId ?? (options?.skipFallbackCreation ? '__NO_FALLBACK__' : '__AUTO__');
+        if (targetWorkspaceId && this.core.store.state.activeWorkspace?.id === targetWorkspaceId) {
+            return;
+        }
+        if (this._workspaceInitializationPromise && this._workspaceInitializationTargetKey === targetKey) {
+            await this._workspaceInitializationPromise;
+            return;
+        }
+        const initializationPromise = this.core.initializeWorkspace(workspace, options);
+        this._workspaceInitializationPromise = initializationPromise;
+        this._workspaceInitializationTargetKey = targetKey;
+        try {
+            await initializationPromise;
+        }
+        finally {
+            if (this._workspaceInitializationPromise === initializationPromise) {
+                this._workspaceInitializationPromise = null;
+                this._workspaceInitializationTargetKey = null;
+            }
+        }
+    }
     emitObjectsChange() {
         const objects = this.core.store.allObjects;
         const undoState = this.core.store.state.objects.undoState;
@@ -27488,7 +27514,7 @@ const KritzelPortal = class {
  * This file is auto-generated by the version bump scripts.
  * Do not modify manually.
  */
-const KRITZEL_VERSION = '0.1.46';
+const KRITZEL_VERSION = '0.1.47';
 
 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/collection/classes/providers/broadcast-sync-provider.class.js

@@ -24,7 +24,9 @@ export class BroadcastSyncProvider {
         setTimeout(() => {
             this._synced = true;
         }, 100);
-        console.info(`BroadcastChannel Provider initialized: ${docName}`);
+        if (!_options?.quiet) {
+            console.info(`BroadcastChannel Provider initialized: ${docName}`);
+        }
     }
     handleDocUpdate = (update, origin) => {
         // Don't broadcast updates that came from other tabs (to prevent loops)

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

@@ -24,6 +24,9 @@ export class HocuspocusSyncProvider {
                 document: doc,
                 token: options?.token || null,
                 onConnect: () => {
+                    if (this.isConnected) {
+                        return;
+                    }
                     this.isConnected = true;
                     if (!options?.quiet) {
                         console.info(`Hocuspocus connected: ${name}`);
@@ -33,6 +36,9 @@ export class HocuspocusSyncProvider {
                     }
                 },
                 onDisconnect: () => {
+                    if (!this.isConnected && !this.isSynced) {
+                        return;
+                    }
                     this.isConnected = false;
                     this.isSynced = false;
                     if (!options?.quiet) {
@@ -43,6 +49,9 @@ export class HocuspocusSyncProvider {
                     }
                 },
                 onSynced: () => {
+                    if (this.isSynced) {
+                        return;
+                    }
                     this.isSynced = true;
                     if (!options?.quiet) {
                         console.info(`Hocuspocus synced: ${name}`);
@@ -78,6 +87,9 @@ export class HocuspocusSyncProvider {
                 document: doc,
                 token: options?.token || null,
                 onConnect: () => {
+                    if (this.isConnected) {
+                        return;
+                    }
                     this.isConnected = true;
                     if (!options?.quiet) {
                         console.info(`Hocuspocus connected: ${name}`);
@@ -87,6 +99,9 @@ export class HocuspocusSyncProvider {
                     }
                 },
                 onDisconnect: () => {
+                    if (!this.isConnected && !this.isSynced) {
+                        return;
+                    }
                     this.isConnected = false;
                     this.isSynced = false;
                     if (!options?.quiet) {
@@ -97,6 +112,9 @@ export class HocuspocusSyncProvider {
                     }
                 },
                 onSynced: () => {
+                    if (this.isSynced) {
+                        return;
+                    }
                     this.isSynced = true;
                     if (!options?.quiet) {
                         console.info(`Hocuspocus synced: ${name}`);
@@ -176,8 +194,9 @@ export class HocuspocusSyncProvider {
      */
     static with(options) {
         return {
-            create: (docName, doc) => {
-                return new HocuspocusSyncProvider(docName, doc, options);
+            create: (docName, doc, runtimeOptions) => {
+                const mergedOptions = runtimeOptions ? { ...options, ...runtimeOptions } : options;
+                return new HocuspocusSyncProvider(docName, doc, mergedOptions);
             },
         };
     }

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

@@ -5,6 +5,7 @@ import { WebsocketProvider } from "y-websocket";
 export class WebSocketSyncProvider {
     provider;
     isConnected = false;
+    _quiet = false;
     constructor(docName, doc, options) {
         const url = options?.url || 'ws://localhost:1234';
         const roomName = options?.roomName || docName;
@@ -16,8 +17,11 @@ export class WebSocketSyncProvider {
             maxBackoffTime: options?.maxBackoffTime,
             disableBc: true,
         });
+        this._quiet = options?.quiet ?? false;
         this.setupEventListeners();
-        console.info(`WebSocket Provider initialized: ${url}/${roomName}`);
+        if (!this._quiet) {
+            console.info(`WebSocket Provider initialized: ${url}/${roomName}`);
+        }
     }
     /**
      * Static factory method for creating WebSocketSyncProvider with configuration options
@@ -25,8 +29,9 @@ export class WebSocketSyncProvider {
      */
     static with(options) {
         return {
-            create: (docName, doc) => {
-                return new WebSocketSyncProvider(docName, doc, options);
+            create: (docName, doc, runtimeOptions) => {
+                const mergedOptions = runtimeOptions ? { ...options, ...runtimeOptions } : options;
+                return new WebSocketSyncProvider(docName, doc, mergedOptions);
             },
         };
     }
@@ -34,15 +39,19 @@ export class WebSocketSyncProvider {
         this.provider.on('status', ({ status }) => {
             if (status === 'connected') {
                 this.isConnected = true;
-                console.info('WebSocket connected');
+                if (!this._quiet) {
+                    console.info('WebSocket connected');
+                }
             }
             else if (status === 'disconnected') {
                 this.isConnected = false;
-                console.info('WebSocket disconnected');
+                if (!this._quiet) {
+                    console.info('WebSocket disconnected');
+                }
             }
         });
         this.provider.on('sync', (synced) => {
-            if (synced) {
+            if (synced && !this._quiet) {
                 console.info('WebSocket synced');
             }
         });

package/dist/collection/classes/structures/app-state-map.structure.js

@@ -52,16 +52,17 @@ export class KritzelAppStateMap {
         const docName = core.editorId ? `kritzel-app-state-${core.editorId}` : 'kritzel-app-state';
         const finalConfig = config ?? DEFAULT_SYNC_CONFIG;
         // Instantiate providers from configuration
+        const quiet = !core.store.state.debugInfo.showSyncProviderInfo;
         for (const providerConfig of finalConfig.providers) {
             let provider;
             // Check if it's a class constructor or a factory
             if (typeof providerConfig === 'function') {
                 // It's a class constructor
-                provider = new providerConfig(docName, this._ydoc);
+                provider = new providerConfig(docName, this._ydoc, { quiet });
             }
             else {
                 // It's a factory with a create method
-                provider = providerConfig.create(docName, this._ydoc);
+                provider = providerConfig.create(docName, this._ydoc, { quiet });
             }
             this._providers.push(provider);
         }

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

@@ -107,16 +107,17 @@ export class KritzelObjectMap {
         const docName = core.editorId ? `kritzel-workspace-${core.editorId}-${workspaceId}` : `kritzel-workspace-${workspaceId}`;
         const finalConfig = config ?? DEFAULT_SYNC_CONFIG;
         // Instantiate providers from configuration
+        const quiet = !core.store.state.debugInfo.showSyncProviderInfo;
         for (const providerConfig of finalConfig.providers) {
             let provider;
             // Check if it's a class constructor or a factory
             if (typeof providerConfig === 'function') {
                 // It's a class constructor
-                provider = new providerConfig(docName, this._ydoc);
+                provider = new providerConfig(docName, this._ydoc, { quiet });
             }
             else {
                 // It's a factory with a create method
-                provider = providerConfig.create(docName, this._ydoc);
+                provider = providerConfig.create(docName, this._ydoc, { quiet });
             }
             this._providers.push(provider);
         }

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

@@ -429,7 +429,6 @@ export class KritzelEditor {
         this.registerCustomSvgIcons();
         this.listenForMobileKeyboard();
         this.setOsSpecificCssVariables();
-        console.log('loaded editor');
     }
     async checkIsReady() {
         await customElements.whenDefined('kritzel-editor');
@@ -622,7 +621,7 @@ export class KritzelEditor {
         }
     }
     render() {
-        return (h(Host, { key: '496c072de4cb9d0998b4b93d41b6f34d2594336f' }, h("div", { key: '61640aefd176f9d2056c55658121754bf656d7a8', class: "top-left-buttons" }, h("kritzel-workspace-manager", { key: 'ad017b4dadf7edae048fd69d40d89bef07fad6f4', workspaces: this.workspaces, activeWorkspace: this.activeWorkspace, onWorkspaceChange: event => (this.activeWorkspace = event.detail), onIsWorkspaceManagerReady: () => (this.isWorkspaceManagerReady = true) }), h("kritzel-back-to-content", { key: '65c24099b16c6f009f133709cc82e53e3689b2d9', visible: this.isBackToContentButtonVisible, onBackToContent: () => this.backToContent() })), h("kritzel-engine", { key: 'c2fc4b7e0b91f748fd4fbc3a34d5d5f9f67e5bfe', ref: el => (this.engineRef = el), workspace: this.activeWorkspace, activeWorkspaceId: this.activeWorkspaceId, editorId: this.editorId, syncConfig: this.syncConfig, 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, 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) }), h("kritzel-controls", { key: '5caefbd8d401d9a056f9d2ce67d72d86f7fc63c1', 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: 'e52903a9bfa8ed18e5897a8cb5789be9416aab85', class: "top-right-buttons" }, h("kritzel-settings", { key: 'd2a9153401a6da7d12e334b0b11227e258f31a65', ref: el => (this.settingsRef = el), shortcuts: this.shortcuts, editorId: this.editorId, onSettingsChange: event => this.handleSettingsChange(event) }), h("kritzel-export", { key: 'b72e97833be9fe13a630f055e48530924336813b', 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: '2c2c994023eda91cc3f30e8341d1c854d0673a2a', users: this.activeUsers }), h("kritzel-current-user", { key: 'e650e21eed5f3136727b92b521fa4afa09d7d66a', user: this.user, onItemSelect: event => this.handleCurrentUserItemSelect(event) }), h("kritzel-more-menu", { key: '543e84bcbd99cbf9d101c346d571ec6a1d6db1fd', onItemSelect: event => this.handleMoreMenuItemSelect(event) }), h("kritzel-share-dialog", { key: '3ed56d1dbaff240a7fa90331bb2244dd836ff7f3', ref: el => (this.shareDialogRef = el), linkShare: this.currentLinkShare, workspaceId: this.activeWorkspace?.id, onToggleLinkShare: this.handleToggleLinkShare, onPermissionChange: this.handleSharePermissionChange }))));
+        return (h(Host, { key: '90a91249e483f27f52c6677483793a00e78e7488' }, h("div", { key: 'be2392052be658194bc00c029abe883ce3fb4a79', class: "top-left-buttons" }, h("kritzel-workspace-manager", { key: '3e0a4004dccbada37f1008c77ac143e453714db5', workspaces: this.workspaces, activeWorkspace: this.activeWorkspace, onWorkspaceChange: event => (this.activeWorkspace = event.detail), onIsWorkspaceManagerReady: () => (this.isWorkspaceManagerReady = true) }), h("kritzel-back-to-content", { key: 'f6d11f6e0bc0a0be10bab2c5757fadd18d0a305c', visible: this.isBackToContentButtonVisible, onBackToContent: () => this.backToContent() })), h("kritzel-engine", { key: 'a5720d2e7d7a2e257f17fd0e68a53d33b4bef711', ref: el => (this.engineRef = el), workspace: this.activeWorkspace, activeWorkspaceId: this.activeWorkspaceId, editorId: this.editorId, syncConfig: this.syncConfig, 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, 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) }), h("kritzel-controls", { key: '1324b903ea3cc8296467465a9524b812e65dd627', 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: '7b535fd7cd96bf64f64011b7cc30f8bd471b3bb6', class: "top-right-buttons" }, h("kritzel-settings", { key: '483995f3e3b81a381828d9dd0d2e25afb8a48966', ref: el => (this.settingsRef = el), shortcuts: this.shortcuts, editorId: this.editorId, onSettingsChange: event => this.handleSettingsChange(event) }), h("kritzel-export", { key: '8697a908a01a0cf6143b3822c232afd047e389a5', 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: '85a54896088999df529e70d524c775e92dcf5e6b', users: this.activeUsers }), h("kritzel-current-user", { key: 'cbcd428a95c2ab260f5fe175e75bbf9018de5c21', user: this.user, onItemSelect: event => this.handleCurrentUserItemSelect(event) }), h("kritzel-more-menu", { key: '972cc8721173cb2ed8ba448d9690e31e0a9321e1', onItemSelect: event => this.handleMoreMenuItemSelect(event) }), h("kritzel-share-dialog", { key: '3c5e325ca58af4f5c09e25bf8e059471f5e178d1', ref: el => (this.shareDialogRef = el), linkShare: this.currentLinkShare, workspaceId: this.activeWorkspace?.id, onToggleLinkShare: this.handleToggleLinkShare, onPermissionChange: this.handleSharePermissionChange }))));
     }
     static get is() { return "kritzel-editor"; }
     static get originalStyleUrls() {

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

@@ -36,7 +36,7 @@ export class KritzelEngine {
             return;
         }
         this.core.beforeWorkspaceChange();
-        await this.core.initializeWorkspace(newWorkspace);
+        await this.initializeWorkspaceIfNeeded(newWorkspace);
         this.activeWorkspaceChange.emit(this.core.store.state.activeWorkspace);
     }
     /** Optional unique identifier for namespacing storage keys across multiple editor instances. */
@@ -1109,6 +1109,8 @@ export class KritzelEngine {
     _isYjsInitialized = false;
     _isResolvingActiveWorkspaceId = false;
     _stateChangeListenersRegistered = false;
+    _workspaceInitializationPromise = null;
+    _workspaceInitializationTargetKey = null;
     get isSelecting() {
         return this.core.store.state.activeTool instanceof KritzelSelectionTool && this.core.store.state.isSelecting;
     }
@@ -1156,7 +1158,6 @@ export class KritzelEngine {
             this.core.store.state.isReady = true;
             this.isEngineReady.emit(this.core.store.state);
         }
-        console.log('loaded engine');
     }
     async initializeSyncAndWorkspace() {
         // Set sync configuration if provided
@@ -1171,17 +1172,17 @@ export class KritzelEngine {
         if (this.activeWorkspaceId) {
             const startupWorkspace = this.core.getWorkspaces().find(ws => ws.id === this.activeWorkspaceId);
             if (startupWorkspace) {
-                await this.core.initializeWorkspace(startupWorkspace);
+                await this.initializeWorkspaceIfNeeded(startupWorkspace);
             }
             else {
                 // When a specific workspace ID is requested, do not create a fallback workspace.
-                await this.core.initializeWorkspace(undefined, { skipFallbackCreation: true });
+                await this.initializeWorkspaceIfNeeded(undefined, { skipFallbackCreation: true });
             }
         }
         else {
             // Resolve startup workspace, preferring explicit workspace object when provided.
             const startupWorkspace = this.resolveStartupWorkspace();
-            await this.core.initializeWorkspace(startupWorkspace);
+            await this.initializeWorkspaceIfNeeded(startupWorkspace);
         }
         // Emit initial active workspace once startup initialization has completed
         const initialActiveWorkspace = this.core.store.state.activeWorkspace;
@@ -1233,9 +1234,32 @@ export class KritzelEngine {
             return;
         }
         this.core.beforeWorkspaceChange();
-        await this.core.initializeWorkspace(workspace);
+        await this.initializeWorkspaceIfNeeded(workspace);
         this.activeWorkspaceChange.emit(this.core.store.state.activeWorkspace);
     }
+    async initializeWorkspaceIfNeeded(workspace, options) {
+        const targetWorkspaceId = workspace?.id ?? null;
+        const targetKey = targetWorkspaceId ?? (options?.skipFallbackCreation ? '__NO_FALLBACK__' : '__AUTO__');
+        if (targetWorkspaceId && this.core.store.state.activeWorkspace?.id === targetWorkspaceId) {
+            return;
+        }
+        if (this._workspaceInitializationPromise && this._workspaceInitializationTargetKey === targetKey) {
+            await this._workspaceInitializationPromise;
+            return;
+        }
+        const initializationPromise = this.core.initializeWorkspace(workspace, options);
+        this._workspaceInitializationPromise = initializationPromise;
+        this._workspaceInitializationTargetKey = targetKey;
+        try {
+            await initializationPromise;
+        }
+        finally {
+            if (this._workspaceInitializationPromise === initializationPromise) {
+                this._workspaceInitializationPromise = null;
+                this._workspaceInitializationTargetKey = null;
+            }
+        }
+    }
     emitObjectsChange() {
         const objects = this.core.store.allObjects;
         const undoState = this.core.store.state.objects.undoState;

package/dist/collection/configs/default-engine-config.js

@@ -33,7 +33,8 @@ export const DEFAULT_ENGINE_CONFIG = {
     skipContextMenu: false,
     debugInfo: {
         showObjectInfo: false,
-        showViewportInfo: false
+        showViewportInfo: false,
+        showSyncProviderInfo: false
     },
     host: null,
     pointerX: 0,

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.46';
+export const KRITZEL_VERSION = '0.1.47';