kritzel-stencil 0.1.87 → 0.1.89

package/dist/cjs/index.cjs.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var workspace_migrations = require('./workspace.migrations-DPbmUuGp.js');
+var workspace_migrations = require('./workspace.migrations-B_dbGmyV.js');
 var Y = require('yjs');
 var yWebsocket = require('y-websocket');
 require('y-indexeddb');
@@ -557,19 +557,538 @@ class WebSocketSyncProvider {
     }
 }
 
+/**
+ * Hocuspocus sync provider for real-time collaboration
+ * Supports multiplexing - multiple documents can share the same WebSocket connection
+ */
+class HocuspocusSyncProvider {
+    type = 'network';
+    provider;
+    isConnected = false;
+    isSynced = false;
+    usesSharedSocket = false;
+    isDestroyed = false;
+    connectTimeout = null;
+    pendingConnectReject = null;
+    connectionTimeoutMs;
+    _connectionStatus = 'disconnected';
+    visibilityHandler = null;
+    onlineHandler = null;
+    get awareness() {
+        return this.provider.awareness;
+    }
+    get connectionStatus() {
+        return this._connectionStatus;
+    }
+    // Static shared WebSocket instance for multiplexing
+    static sharedWebSocketProvider = null;
+    constructor(docName, doc, options) {
+        const name = options?.name || docName;
+        const url = options?.url || 'ws://localhost:1234';
+        this.connectionTimeoutMs = options?.connectionTimeout ?? 10000;
+        // Use provided websocketProvider or the static shared one
+        const websocketProvider = options?.websocketProvider || HocuspocusSyncProvider.sharedWebSocketProvider;
+        // Build reconnect config from options
+        const reconnectConfig = {};
+        if (options?.delay !== undefined)
+            reconnectConfig.delay = options.delay;
+        if (options?.factor !== undefined)
+            reconnectConfig.factor = options.factor;
+        if (options?.maxAttempts !== undefined)
+            reconnectConfig.maxAttempts = options.maxAttempts;
+        if (options?.minDelay !== undefined)
+            reconnectConfig.minDelay = options.minDelay;
+        if (options?.maxDelay !== undefined)
+            reconnectConfig.maxDelay = options.maxDelay;
+        const onConnect = () => {
+            if (this.isDestroyed) {
+                return;
+            }
+            this.isConnected = true;
+            this._connectionStatus = 'connected';
+            if (!options?.quiet) {
+                console.info(`Hocuspocus connected: ${name}`);
+            }
+            if (options?.onConnect) {
+                options.onConnect();
+            }
+        };
+        const onDisconnect = () => {
+            if (this.isDestroyed) {
+                return;
+            }
+            this.isConnected = false;
+            this.isSynced = false;
+            this._connectionStatus = 'disconnected';
+            if (!options?.quiet) {
+                console.info(`Hocuspocus disconnected: ${name}`);
+            }
+            if (options?.onDisconnect) {
+                options.onDisconnect();
+            }
+        };
+        const onSynced = () => {
+            if (this.isDestroyed) {
+                return;
+            }
+            this.isSynced = true;
+            this._connectionStatus = 'synced';
+            if (!options?.quiet) {
+                console.info(`Hocuspocus synced: ${name}`);
+            }
+            if (options?.onSynced) {
+                options.onSynced();
+            }
+        };
+        const onStatus = (data) => {
+            if (this.isDestroyed) {
+                return;
+            }
+            if (data.status === 'connecting') {
+                this._connectionStatus = 'connecting';
+            }
+            if (options?.onStatus) {
+                options.onStatus(data);
+            }
+        };
+        if (websocketProvider) {
+            // Multiplexing mode - use shared WebSocket connection
+            this.usesSharedSocket = true;
+            const config = {
+                websocketProvider,
+                name,
+                document: doc,
+                token: options?.token || null,
+                onStatus,
+                onConnect,
+                onDisconnect,
+                onSynced,
+                ...reconnectConfig,
+            };
+            // Add optional settings
+            if (options?.forceSyncInterval !== undefined) {
+                config.forceSyncInterval = options.forceSyncInterval;
+            }
+            if (options?.onAuthenticationFailed) {
+                config.onAuthenticationFailed = options.onAuthenticationFailed;
+            }
+            this.provider = new workspace_migrations.HocuspocusProvider(config);
+            // Must call attach() explicitly when using shared socket
+            this.provider.attach();
+            if (!options?.quiet) {
+                console.info(`Hocuspocus Provider initialized (multiplexed): ${name}`);
+            }
+        }
+        else {
+            // Standalone mode - create own WebSocket connection
+            this.usesSharedSocket = false;
+            const config = {
+                url,
+                name,
+                document: doc,
+                token: options?.token || null,
+                autoConnect: false,
+                onStatus,
+                onConnect,
+                onDisconnect,
+                onSynced,
+                ...reconnectConfig,
+            };
+            // Add optional settings
+            if (options?.forceSyncInterval !== undefined) {
+                config.forceSyncInterval = options.forceSyncInterval;
+            }
+            if (options?.onAuthenticationFailed) {
+                config.onAuthenticationFailed = options.onAuthenticationFailed;
+            }
+            if (options?.WebSocketPolyfill) {
+                config.WebSocketPolyfill = options.WebSocketPolyfill;
+            }
+            this.provider = new workspace_migrations.HocuspocusProvider(config);
+            if (!options?.quiet) {
+                console.info(`Hocuspocus Provider initialized: ${url}/${name}`);
+            }
+        }
+        this.setupBrowserEventListeners();
+    }
+    setupBrowserEventListeners() {
+        if (typeof document !== 'undefined') {
+            this.visibilityHandler = () => {
+                if (document.visibilityState === 'visible' && !this.isConnected && !this.isDestroyed) {
+                    this.provider.connect();
+                }
+            };
+            document.addEventListener('visibilitychange', this.visibilityHandler);
+        }
+        if (typeof window !== 'undefined') {
+            this.onlineHandler = () => {
+                if (!this.isConnected && !this.isDestroyed) {
+                    this.provider.connect();
+                }
+            };
+            window.addEventListener('online', this.onlineHandler);
+        }
+    }
+    removeBrowserEventListeners() {
+        if (this.visibilityHandler && typeof document !== 'undefined') {
+            document.removeEventListener('visibilitychange', this.visibilityHandler);
+            this.visibilityHandler = null;
+        }
+        if (this.onlineHandler && typeof window !== 'undefined') {
+            window.removeEventListener('online', this.onlineHandler);
+            this.onlineHandler = null;
+        }
+    }
+    /**
+     * Create a shared WebSocket connection for multiplexing
+     * Call this once to create a shared connection that multiple providers can use
+     */
+    static createSharedWebSocket(options) {
+        if (HocuspocusSyncProvider.sharedWebSocketProvider) {
+            console.warn('Shared WebSocket already exists. Returning existing instance.');
+            return HocuspocusSyncProvider.sharedWebSocketProvider;
+        }
+        const config = {
+            url: options.url,
+        };
+        if (options.WebSocketPolyfill) {
+            config.WebSocketPolyfill = options.WebSocketPolyfill;
+        }
+        if (options.onConnect) {
+            config.onConnect = options.onConnect;
+        }
+        if (options.onDisconnect) {
+            config.onDisconnect = options.onDisconnect;
+        }
+        if (options.onStatus) {
+            config.onStatus = options.onStatus;
+        }
+        HocuspocusSyncProvider.sharedWebSocketProvider = new workspace_migrations.HocuspocusProviderWebsocket(config);
+        console.info(`Shared Hocuspocus WebSocket created: ${options.url}`);
+        return HocuspocusSyncProvider.sharedWebSocketProvider;
+    }
+    /**
+     * Destroy the shared WebSocket connection
+     * Call this when you're done with all multiplexed providers
+     */
+    static destroySharedWebSocket() {
+        if (HocuspocusSyncProvider.sharedWebSocketProvider) {
+            HocuspocusSyncProvider.sharedWebSocketProvider.destroy();
+            HocuspocusSyncProvider.sharedWebSocketProvider = null;
+            console.info('Shared Hocuspocus WebSocket destroyed');
+        }
+    }
+    /**
+     * Get the shared WebSocket provider instance (if it exists)
+     */
+    static getSharedWebSocket() {
+        return HocuspocusSyncProvider.sharedWebSocketProvider;
+    }
+    /**
+     * Static factory method for creating HocuspocusSyncProvider with configuration options
+     * Returns a ProviderFactory that can be used in sync configuration
+     */
+    static with(options) {
+        return {
+            create: (docName, doc, runtimeOptions) => {
+                const mergedOptions = runtimeOptions ? { ...options, ...runtimeOptions } : options;
+                return new HocuspocusSyncProvider(docName, doc, mergedOptions);
+            },
+        };
+    }
+    async connect() {
+        if (this.isSynced || this.isDestroyed) {
+            return;
+        }
+        this._connectionStatus = 'connecting';
+        return new Promise((resolve, reject) => {
+            // 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'));
+            }, this.connectionTimeoutMs);
+            const syncHandler = () => {
+                if (this.connectTimeout) {
+                    clearTimeout(this.connectTimeout);
+                    this.connectTimeout = null;
+                }
+                this.pendingConnectReject = null;
+                this.provider.off('synced', syncHandler);
+                if (!this.isDestroyed) {
+                    resolve();
+                }
+            };
+            this.provider.on('synced', syncHandler);
+            // If already synced, resolve immediately
+            if (this.provider.isSynced) {
+                if (this.connectTimeout) {
+                    clearTimeout(this.connectTimeout);
+                    this.connectTimeout = null;
+                }
+                this.pendingConnectReject = null;
+                this.provider.off('synced', syncHandler);
+                resolve();
+                return;
+            }
+            // Connect if not already connected (standalone mode only)
+            if (!this.isConnected && !this.usesSharedSocket) {
+                this.provider.connect();
+            }
+        });
+    }
+    async reconnect() {
+        this.disconnect();
+        return this.connect();
+    }
+    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
+                this.provider.detach();
+            }
+            else {
+                this.provider.disconnect();
+            }
+        }
+        this.isConnected = false;
+        this.isSynced = false;
+        this._connectionStatus = 'disconnected';
+    }
+    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
+        }
+        this.removeBrowserEventListeners();
+        if (this.provider) {
+            this.provider.destroy();
+        }
+        this.isConnected = false;
+        this.isSynced = false;
+        this._connectionStatus = 'disconnected';
+    }
+}
+
+/**
+ * Remote asset storage provider backed by a plain HTTP endpoint.
+ *
+ * The host application is responsible for exposing a REST-ish backend
+ * that accepts a multipart upload and serves the stored asset at a
+ * stable URL. Authentication is injected via `headers`.
+ */
+class HttpAssetProvider {
+    type = 'remote';
+    name = 'HttpAssetProvider';
+    _options;
+    constructor(options) {
+        this._options = options;
+    }
+    /**
+     * Factory helper enabling use as `HttpAssetProvider.with({ ... })` inside
+     * a `KritzelAssetStorageConfig.providers` array.
+     */
+    static with(options) {
+        return { create: () => new HttpAssetProvider(options) };
+    }
+    async init() {
+        // No initialization needed for a stateless HTTP provider.
+    }
+    destroy() {
+        // No-op; no resources to release.
+    }
+    canResolve(_id) {
+        // Remote providers don't know without a round-trip; assume yes.
+        return true;
+    }
+    async put(blob, metadata) {
+        const id = metadata.id ?? this.generateUuid();
+        const fullMetadata = { ...metadata, id };
+        const headers = (await this._options.headers?.()) ?? {};
+        const url = await this._options.uploadUrl(fullMetadata);
+        const uploader = this._options.upload ?? this.defaultUpload;
+        const response = await uploader(url, blob, fullMetadata, headers);
+        return {
+            id: response.id ?? id,
+            kind: metadata.kind ?? 'file',
+            mimeType: metadata.mimeType,
+            size: blob.size,
+            createdAt: Date.now(),
+            width: metadata.width,
+            height: metadata.height,
+            durationMs: metadata.durationMs,
+            originalFilename: metadata.originalFilename,
+        };
+    }
+    async resolve(id) {
+        return this._options.resolveUrl(id);
+    }
+    async fetch(id) {
+        const url = await this._options.resolveUrl(id);
+        const headers = (await this._options.headers?.()) ?? {};
+        const res = await fetch(url, { headers });
+        if (!res.ok) {
+            throw new Error(`[HttpAssetProvider] Failed to fetch asset ${id}: ${res.status} ${res.statusText}`);
+        }
+        return res.blob();
+    }
+    async delete(id) {
+        if (!this._options.deleteUrl)
+            return;
+        const url = await this._options.deleteUrl(id);
+        const headers = (await this._options.headers?.()) ?? {};
+        const res = await fetch(url, { method: 'DELETE', headers });
+        if (!res.ok) {
+            throw new Error(`[HttpAssetProvider] Failed to delete asset ${id}: ${res.status} ${res.statusText}`);
+        }
+    }
+    defaultUpload = async (url, blob, metadata, headers) => {
+        const form = new FormData();
+        form.append('metadata', JSON.stringify(metadata));
+        form.append('file', blob, metadata.originalFilename || `${metadata.id}.${this.extensionFromMime(metadata.mimeType)}`);
+        const res = await fetch(url, {
+            method: 'POST',
+            headers,
+            body: form,
+        });
+        if (!res.ok) {
+            throw new Error(`[HttpAssetProvider] Upload failed: ${res.status} ${res.statusText}`);
+        }
+        // Try to parse a JSON response; tolerate empty/plain-text bodies.
+        const contentType = res.headers.get('content-type') || '';
+        if (contentType.includes('application/json')) {
+            return (await res.json());
+        }
+        return {};
+    };
+    extensionFromMime(mime) {
+        const slash = mime.indexOf('/');
+        return slash >= 0 ? mime.slice(slash + 1) : 'bin';
+    }
+    generateUuid() {
+        if (typeof crypto !== 'undefined' && typeof crypto.randomUUID === 'function') {
+            return crypto.randomUUID();
+        }
+        const bytes = crypto.getRandomValues(new Uint8Array(16));
+        bytes[6] = (bytes[6] & 0x0f) | 0x40;
+        bytes[8] = (bytes[8] & 0x3f) | 0x80;
+        const hex = Array.from(bytes, b => b.toString(16).padStart(2, '0')).join('');
+        return `${hex.slice(0, 8)}-${hex.slice(8, 12)}-${hex.slice(12, 16)}-${hex.slice(16, 20)}-${hex.slice(20)}`;
+    }
+}
+
+/**
+ * Remote asset storage provider for pre-signed URL uploads (S3, GCS, ...).
+ *
+ * All auth and URL signing is performed by the host application via the
+ * callbacks in {@link PresignedAssetProviderOptions}. The library simply
+ * PUTs/POSTs bytes to the provided URL.
+ */
+class PresignedAssetProvider {
+    type = 'remote';
+    name = 'PresignedAssetProvider';
+    _options;
+    constructor(options) {
+        this._options = options;
+    }
+    static with(options) {
+        return { create: () => new PresignedAssetProvider(options) };
+    }
+    async init() {
+        // Stateless provider.
+    }
+    destroy() {
+        // No-op.
+    }
+    canResolve(_id) {
+        return true;
+    }
+    async put(blob, metadata) {
+        const descriptor = await this._options.getUploadDescriptor(metadata);
+        const method = descriptor.method ?? 'PUT';
+        const headers = { ...(descriptor.headers ?? {}) };
+        if (!headers['Content-Type'] && !headers['content-type']) {
+            headers['Content-Type'] = metadata.mimeType;
+        }
+        let body;
+        if (method === 'POST' && descriptor.fields) {
+            const form = new FormData();
+            for (const [key, value] of Object.entries(descriptor.fields)) {
+                form.append(key, value);
+            }
+            form.append('file', blob);
+            body = form;
+            // Browser sets multipart boundary; avoid forcing content-type.
+            delete headers['Content-Type'];
+            delete headers['content-type'];
+        }
+        else {
+            body = blob;
+        }
+        const res = await fetch(descriptor.url, { method, headers, body });
+        if (!res.ok) {
+            throw new Error(`[PresignedAssetProvider] Upload failed: ${res.status} ${res.statusText}`);
+        }
+        return {
+            id: descriptor.id,
+            kind: metadata.kind ?? 'file',
+            mimeType: metadata.mimeType,
+            size: blob.size,
+            createdAt: Date.now(),
+            width: metadata.width,
+            height: metadata.height,
+            durationMs: metadata.durationMs,
+            originalFilename: metadata.originalFilename,
+        };
+    }
+    async resolve(id) {
+        return this._options.getDownloadUrl(id);
+    }
+    async fetch(id) {
+        const url = await this._options.getDownloadUrl(id);
+        const res = await fetch(url);
+        if (!res.ok) {
+            throw new Error(`[PresignedAssetProvider] Failed to fetch asset ${id}: ${res.status} ${res.statusText}`);
+        }
+        return res.blob();
+    }
+    async delete(id) {
+        if (!this._options.deleteAsset)
+            return;
+        await this._options.deleteAsset(id);
+    }
+}
+
 exports.APP_STATE_MIGRATIONS = workspace_migrations.APP_STATE_MIGRATIONS;
 exports.CURRENT_APP_STATE_SCHEMA_VERSION = workspace_migrations.CURRENT_APP_STATE_SCHEMA_VERSION;
 exports.CURRENT_WORKSPACE_SCHEMA_VERSION = workspace_migrations.CURRENT_WORKSPACE_SCHEMA_VERSION;
+exports.DEFAULT_ASSET_STORAGE_CONFIG = workspace_migrations.DEFAULT_ASSET_STORAGE_CONFIG;
 exports.DEFAULT_BRUSH_CONFIG = workspace_migrations.DEFAULT_BRUSH_CONFIG;
 exports.DEFAULT_LINE_TOOL_CONFIG = workspace_migrations.DEFAULT_LINE_TOOL_CONFIG;
 exports.DEFAULT_TEXT_CONFIG = workspace_migrations.DEFAULT_TEXT_CONFIG;
-exports.HocuspocusSyncProvider = workspace_migrations.HocuspocusSyncProvider;
+exports.IndexedDBAssetProvider = workspace_migrations.IndexedDBAssetProvider;
 exports.IndexedDBSyncProvider = workspace_migrations.IndexedDBSyncProvider;
 Object.defineProperty(exports, "KritzelAlignment", {
   enumerable: true,
   get: function () { return workspace_migrations.KritzelAlignment; }
 });
 exports.KritzelAnchorManager = workspace_migrations.KritzelAnchorManager;
+exports.KritzelAssetResolver = workspace_migrations.KritzelAssetResolver;
 exports.KritzelBrushTool = workspace_migrations.KritzelBrushTool;
 exports.KritzelCursorHelper = workspace_migrations.KritzelCursorHelper;
 exports.KritzelEraserTool = workspace_migrations.KritzelEraserTool;
@@ -596,4 +1115,7 @@ exports.darkTheme = workspace_migrations.darkTheme;
 exports.lightTheme = workspace_migrations.lightTheme;
 exports.runMigrations = workspace_migrations.runMigrations;
 exports.BroadcastSyncProvider = BroadcastSyncProvider;
+exports.HocuspocusSyncProvider = HocuspocusSyncProvider;
+exports.HttpAssetProvider = HttpAssetProvider;
+exports.PresignedAssetProvider = PresignedAssetProvider;
 exports.WebSocketSyncProvider = WebSocketSyncProvider;