@kritzel/editor 0.4.31

package/dist/components/kritzel-editor.js

@@ -0,0 +1,1792 @@
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-5qkOM1RJ.js';
+import { ABSOLUTE_SCALE_MAX, ABSOLUTE_SCALE_MIN, KritzelSelectionTool, DEFAULT_BRUSH_CONFIG, KritzelBrushTool, KritzelEraserTool, DEFAULT_LINE_TOOL_CONFIG, KritzelLineTool, ShapeType, DEFAULT_SHAPE_CONFIG, KritzelShapeTool, DEFAULT_TEXT_CONFIG, KritzelTextTool, KritzelImageTool, KritzelAlignment, hasRemoteSyncProvider, DEFAULT_SYNC_CONFIG, DEFAULT_ASSET_STORAGE_CONFIG, ObjectHelper, resolveTextToolAvailableFonts, ThemeHelper, darkTheme, lightTheme, KritzelSelectionGroup, KritzelSelectionBox, KritzelIconRegistry, KritzelFontRegistry, KritzelKeyboardHelper, KritzelDevicesHelper } from '@kritzel/engine';
+import { d as defineCustomElement$K } from './p-QEue33R5.js';
+import { d as defineCustomElement$J } from './p-4-qLegHb.js';
+import { d as defineCustomElement$I } from './p-Cy_cLtOP.js';
+import { d as defineCustomElement$H } from './p-CwBxnzYu.js';
+import { d as defineCustomElement$G } from './p-DOJCDPVD.js';
+import { d as defineCustomElement$F } from './p-DVv8ChhE.js';
+import { d as defineCustomElement$E } from './p-GbCxpbQ6.js';
+import { d as defineCustomElement$D } from './p-B6UJztrf.js';
+import { d as defineCustomElement$C } from './p-BrGJIoGK.js';
+import { d as defineCustomElement$B } from './p-CrIEmItB.js';
+import { d as defineCustomElement$A } from './p-Cp4e4oTE.js';
+import { d as defineCustomElement$z } from './p-peZjvnkK.js';
+import { d as defineCustomElement$y } from './p-R1D8Sr0l.js';
+import { d as defineCustomElement$x } from './p-DZsSiMnA.js';
+import { d as defineCustomElement$w } from './p-hQwVRh0t.js';
+import { d as defineCustomElement$v } from './p-BDjRSoAc.js';
+import { d as defineCustomElement$u } from './p-ClfOtiNp.js';
+import { d as defineCustomElement$t } from './p-BfMlwIcG.js';
+import { d as defineCustomElement$s } from './p-BGmTmdLe.js';
+import { d as defineCustomElement$r } from './p-B5xYV1o3.js';
+import { d as defineCustomElement$q } from './p-CoNexfpB.js';
+import { d as defineCustomElement$p } from './p-B3Tqoyl9.js';
+import { d as defineCustomElement$o } from './p-Ds0uNtwQ.js';
+import { d as defineCustomElement$n } from './p-CVxGF4bJ.js';
+import { d as defineCustomElement$m } from './p-DqOC_Yck.js';
+import { d as defineCustomElement$l } from './p-BN8VWPlq.js';
+import { d as defineCustomElement$k } from './p-BZ_KnHdR.js';
+import { d as defineCustomElement$j } from './p-D0tPTPkR.js';
+import { d as defineCustomElement$i } from './p-McY5wZ0h.js';
+import { d as defineCustomElement$h } from './p-h_uh_Njf.js';
+import { d as defineCustomElement$g } from './p-B_gT0lCn.js';
+import { d as defineCustomElement$f } from './p-CS3YZVYE.js';
+import { d as defineCustomElement$e } from './p-CvaxFYS0.js';
+import { d as defineCustomElement$d } from './p-BvG3JO85.js';
+import { d as defineCustomElement$c } from './p-Blq9a1ni.js';
+import { d as defineCustomElement$b } from './p-DyRJFg4w.js';
+import { d as defineCustomElement$a } from './p-kOINnzaR.js';
+import { d as defineCustomElement$9 } from './p-DXuf225S.js';
+import { d as defineCustomElement$8 } from './p-CzUeIini.js';
+import { d as defineCustomElement$7 } from './p-Ckqh1tqY.js';
+import { d as defineCustomElement$6 } from './p-DJxgPPfs.js';
+import { d as defineCustomElement$5 } from './p-BjFrt1q0.js';
+import { d as defineCustomElement$4 } from './p-SLnqczCS.js';
+import { d as defineCustomElement$3 } from './p-CmjXRLdr.js';
+import { d as defineCustomElement$2 } from './p-DXZBWJBt.js';
+
+const kritzelEditorCss = () => `kritzel-editor{display:flex;margin:0;position:relative;container-type:inline-size;overflow:hidden;width:100%;height:100%;align-items:center;justify-content:center;touch-action:manipulation;user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-align:start;line-height:normal}.editor-content{position:absolute;inset:0}.editor-content>kritzel-engine{position:absolute;inset:0;z-index:0}kritzel-toolbar{position:absolute;z-index:2;left:0;right:0;margin-inline:auto;width:max-content;max-width:calc(100% - 16px);bottom:var(--kritzel-editor-toolbar-bottom, 14px);transition:transform var(--kritzel-editor-toolbar-transition-duration, 0.1s) var(--kritzel-editor-toolbar-transition, ease-in-out)}kritzel-toolbar.keyboard-open{transform:var(--kritzel-editor-toolbar-transform, translateY(300%))}.top-left-buttons{position:absolute;z-index:2;top:var(--kritzel-editor-top-left-buttons-top, 14px);left:var(--kritzel-editor-top-left-buttons-left, 14px);display:flex;align-items:flex-start;gap:8px}.top-center-notification-layer{position:absolute;top:var(--kritzel-editor-top-center-notification-top, 14px);left:0;right:0;z-index:var(--kritzel-editor-top-center-notification-z-index, 10001);display:flex;justify-content:center;pointer-events:none}.top-center-notification-container{width:min(90vw, 420px);pointer-events:auto;animation:kritzel-notification-slide-in var(--kritzel-editor-notification-animation-duration, 220ms)      var(--kritzel-editor-notification-animation-easing, cubic-bezier(0.22, 1, 0.36, 1))}.top-center-notification-container.is-dismissing{animation:kritzel-notification-fade-out var(--kritzel-editor-notification-dismiss-animation-duration, 180ms)      var(--kritzel-editor-notification-dismiss-animation-easing, ease-in) forwards}@keyframes kritzel-notification-slide-in{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes kritzel-notification-fade-out{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-6px)}}@media (prefers-reduced-motion: reduce){.top-center-notification-container{animation:none}}.top-right-buttons{position:absolute;z-index:2;top:var(--kritzel-editor-top-right-buttons-top, 14px);right:var(--kritzel-editor-top-right-buttons-right, 14px);display:flex;align-items:center;gap:8px}.bottom-left-buttons{position:absolute;z-index:2;left:var(--kritzel-editor-top-left-buttons-left, 14px);bottom:var(--kritzel-editor-toolbar-bottom, 14px);display:flex;align-items:flex-end}@container (max-width: 767px){.bottom-left-buttons{display:none}}.top-right-button{display:flex;align-items:center;justify-content:center;width:50px;height:50px;padding:0;border:var(--kritzel-split-button-border, 1px solid #ebebeb);border-radius:var(--kritzel-split-button-border-radius, 12px);background-color:var(--kritzel-split-button-background-color, #ffffff);cursor:var(--kritzel-global-pointer-cursor, pointer);box-shadow:var(--kritzel-split-button-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));transition:background-color 150ms ease;-webkit-tap-highlight-color:transparent}.top-right-button:hover{background-color:#f5f5f5}.top-right-button:active{background-color:#ebebeb}`;
+
+const KritzelEditor$1 = /*@__PURE__*/ proxyCustomElement(class KritzelEditor extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.isReady = createEvent(this, "isReady");
+        this.activeWorkspaceChange = createEvent(this, "activeWorkspaceChange");
+        this.objectsChange = createEvent(this, "objectsChange");
+        this.objectsAdded = createEvent(this, "objectsAdded");
+        this.objectsRemoved = createEvent(this, "objectsRemoved");
+        this.objectsUpdated = createEvent(this, "objectsUpdated");
+        this.objectsSelectionChange = createEvent(this, "objectsSelectionChange");
+        this.undoStateChange = createEvent(this, "undoStateChange");
+        this.themeChange = createEvent(this, "themeChange");
+        this.localeChange = createEvent(this, "localeChange");
+        this.viewportChange = createEvent(this, "viewportChange");
+        this.logout = createEvent(this, "logout");
+        this.login = createEvent(this, "login");
+        this.isPublicChange = createEvent(this, "isPublicChange");
+        this.awarenessChange = createEvent(this, "awarenessChange");
+    }
+    get host() { return this; }
+    scaleMax = ABSOLUTE_SCALE_MAX;
+    scaleMin = ABSOLUTE_SCALE_MIN;
+    lockDrawingScale = true;
+    viewportBoundaryLeft = -Infinity;
+    viewportBoundaryRight = Infinity;
+    viewportBoundaryTop = -Infinity;
+    viewportBoundaryBottom = Infinity;
+    debugInfo = {
+        showViewportInfo: false,
+        showObjectInfo: false,
+        showSyncProviderInfo: true,
+        showMigrationInfo: true,
+        showAssetResolverInfo: false,
+    };
+    user;
+    activeUsers;
+    toolbarItems = [
+        {
+            name: 'selection',
+            type: 'tool',
+            isDefault: true,
+            tool: KritzelSelectionTool,
+            icon: 'cursor',
+        },
+        {
+            name: 'brush',
+            type: 'tool',
+            tool: KritzelBrushTool,
+            icon: 'pen',
+            config: DEFAULT_BRUSH_CONFIG,
+        },
+        {
+            name: 'eraser',
+            type: 'tool',
+            tool: KritzelEraserTool,
+            icon: 'eraser',
+        },
+        {
+            name: 'line',
+            type: 'tool',
+            tool: KritzelLineTool,
+            icon: 'arrow',
+            config: DEFAULT_LINE_TOOL_CONFIG,
+        },
+        {
+            name: 'shape',
+            type: 'tool',
+            tool: KritzelShapeTool,
+            icon: 'shape-rectangle',
+            config: DEFAULT_SHAPE_CONFIG,
+            subOptions: [
+                { id: 'rectangle', icon: 'shape-rectangle', label: 'Rectangle', value: ShapeType.Rectangle, toolProperty: 'shapeType' },
+                { id: 'ellipse', icon: 'shape-ellipse', label: 'Ellipse', value: ShapeType.Ellipse, toolProperty: 'shapeType' },
+                { id: 'triangle', icon: 'shape-triangle', label: 'Triangle', value: ShapeType.Triangle, toolProperty: 'shapeType' },
+            ],
+        },
+        {
+            name: 'text',
+            type: 'tool',
+            tool: KritzelTextTool,
+            icon: 'type',
+            config: DEFAULT_TEXT_CONFIG,
+        },
+        {
+            name: 'image',
+            type: 'tool',
+            tool: KritzelImageTool,
+            icon: 'image',
+        },
+        {
+            name: 'config',
+            type: 'config',
+        },
+    ];
+    globalContextMenuItems = [
+        {
+            label: 'menu.paste',
+            icon: 'paste',
+            action: menu => this.engineRef.paste(menu.x, menu.y),
+        },
+        {
+            label: 'menu.selectAll',
+            icon: 'select-all',
+            action: () => this.selectAllObjectsInViewport(),
+        },
+    ];
+    objectContextMenuItems = [
+        { label: 'menu.copy', icon: 'copy', group: 'clipboard', action: () => this.engineRef.copy() },
+        { label: 'menu.cut', icon: 'cut', group: 'clipboard', action: () => this.engineRef.cut() },
+        {
+            label: 'menu.paste',
+            icon: 'paste',
+            group: 'clipboard',
+            action: (menu, _) => this.engineRef.paste(menu.x, menu.y),
+        },
+        {
+            label: 'menu.export',
+            icon: 'upload',
+            group: 'clipboard',
+            isVisible: (_, objects) => this.canExportObjects(objects),
+            action: (_, objects) => {
+                const format = this.getPreferredExportFormat(objects);
+                if (!format) {
+                    return;
+                }
+                void this.engineRef.exportSelectedObject(format);
+            },
+        },
+        {
+            label: 'menu.order',
+            icon: 'ordering',
+            group: 'other',
+            children: [
+                { label: 'menu.bringToFront', icon: 'bring-to-front', action: () => this.engineRef.bringToFront() },
+                { label: 'menu.sendToBack', icon: 'send-to-back', action: () => this.engineRef.sendToBack() },
+                { label: 'menu.moveUp', icon: 'arrow-up-from-dot', action: () => this.engineRef.bringForward() },
+                { label: 'menu.moveDown', icon: 'arrow-down-from-dot', action: () => this.engineRef.sendBackward() },
+            ],
+        },
+        {
+            label: 'menu.align',
+            icon: 'align',
+            group: 'other',
+            children: [
+                { label: 'menu.alignLeft', icon: 'align-start-vertical', action: () => this.engineRef.alignObjects(KritzelAlignment.StartHorizontal) },
+                { label: 'menu.alignCenterHorizontal', icon: 'align-center-horizontal', action: () => this.engineRef.alignObjects(KritzelAlignment.CenterHorizontal) },
+                { label: 'menu.alignRight', icon: 'align-end-vertical', action: () => this.engineRef.alignObjects(KritzelAlignment.EndHorizontal) },
+                { label: 'menu.alignTop', icon: 'align-start-horizontal', action: () => this.engineRef.alignObjects(KritzelAlignment.StartVertical) },
+                { label: 'menu.alignCenterVertical', icon: 'align-center-vertical', action: () => this.engineRef.alignObjects(KritzelAlignment.CenterVertical) },
+                { label: 'menu.alignBottom', icon: 'align-end-horizontal', action: () => this.engineRef.alignObjects(KritzelAlignment.EndVertical) },
+            ],
+        },
+        {
+            label: 'menu.group',
+            icon: 'group',
+            group: 'other',
+            children: [
+                {
+                    label: 'menu.group',
+                    icon: 'group',
+                    action: () => this.engineRef.group(),
+                },
+                {
+                    label: 'menu.ungroup',
+                    icon: 'ungroup',
+                    action: () => this.engineRef.ungroup(),
+                },
+            ],
+        },
+        { label: 'menu.delete', icon: 'delete', group: 'edit', action: () => this.engineRef.delete() },
+    ];
+    moreMenuItems = [
+        {
+            id: 'share',
+            label: 'menu.share',
+            icon: 'share',
+            isVisible: async () => hasRemoteSyncProvider(this.syncConfig),
+            action: () => {
+                if (!this.isLoggedIn && this.loginConfig) {
+                    this.openLoginDialog();
+                    return;
+                }
+                this.shareDialogRef.open();
+            },
+        },
+        {
+            id: 'export',
+            label: 'menu.export',
+            icon: 'upload',
+            action: async () => {
+                const preview = await this.engineRef.getScreenshot('png');
+                this.exportRef.open(preview ?? undefined);
+            },
+        },
+        {
+            id: 'import',
+            label: 'menu.import',
+            icon: 'download',
+            action: () => this.engineRef.importFromFile(),
+        },
+        {
+            id: 'settings',
+            label: 'menu.settings',
+            icon: 'settings',
+            action: () => this.settingsRef.open(),
+        },
+    ];
+    themes;
+    theme = 'light';
+    /** License key that, when valid, removes the "Powered by Kritzel" watermark. */
+    licenseKey;
+    /** The current locale (language) code applied to the editor, e.g. 'en', 'de', 'fr'. */
+    locale = 'en';
+    /** An array of available locale definitions (with optional partial term overrides). */
+    locales;
+    /** The locale used to resolve terms missing from the active locale. */
+    fallbackLocale = 'en';
+    customSvgIcons = {};
+    /**
+     * Registers fonts for runtime usage (for example custom object rendering).
+    * Text-tool config tooltip options are controlled via toolbarItems[].config.availableFonts.
+     */
+    customFonts = {};
+    isPanningEnabled = true;
+    isZoomingEnabled = true;
+    isToolbarVisible = true;
+    isUtilityPanelVisible = true;
+    isWorkspaceManagerVisible = true;
+    isMoreMenuVisible = true;
+    isZoomPanelVisible = true;
+    syncConfig = DEFAULT_SYNC_CONFIG;
+    assetStorageConfig = DEFAULT_ASSET_STORAGE_CONFIG;
+    /** The element to use as the target for the cursor. Defaults to the editor container if not set. */
+    cursorTarget;
+    /** Optional login configuration. When provided, a "Sign in" button is shown that opens a login dialog with the configured providers. */
+    loginConfig;
+    /** Optional unique identifier for namespacing storage keys across multiple editor instances. */
+    editorId;
+    /** Optional workspace ID to set as active. If provided, the editor will automatically activate the workspace with this ID. */
+    activeWorkspaceId;
+    /** Authoritative workspace catalog for this editor instance. When provided, provider-only workspaces are hidden but not deleted. */
+    workspaces;
+    isReady;
+    activeWorkspaceChange;
+    objectsChange;
+    objectsAdded;
+    objectsRemoved;
+    objectsUpdated;
+    objectsSelectionChange;
+    undoStateChange;
+    themeChange;
+    localeChange;
+    viewportChange;
+    logout;
+    login;
+    isPublicChange;
+    awarenessChange;
+    isEngineReady = false;
+    isToolbarReady = false;
+    isWorkspaceManagerReady = false;
+    availableWorkspaces = [];
+    activeWorkspace;
+    isVirtualKeyboardOpen = false;
+    undoState = null;
+    isBackToContentButtonVisible = false;
+    /** Localized strings for editor-owned UI (e.g. the more menu), resolved from the active locale. */
+    resolvedTerms = {};
+    /** Available locales as `{ code, label }` options for the settings language selector. */
+    availableLocaleOptions = [];
+    currentZoomPercent = 100;
+    shortcuts = [];
+    currentIsPublic = false;
+    isEditorVisible = false;
+    activeNotification;
+    isNotificationDismissing = false;
+    contextMenuState;
+    resolvedMoreMenuItems = [];
+    isLoadingOverlayVisible = false;
+    loadingOverlayShowTimeout;
+    loadingOverlayHideTimeout;
+    loadingOverlayShownTimestamp;
+    loadingOverlayDelayMs = 300;
+    loadingOverlayMinDisplayDurationMs = 400;
+    notificationDismissTimeout;
+    notificationDismissAnimationTimeout;
+    notificationDisplayDurationMs = 5000;
+    notificationDismissAnimationDurationMs = 180;
+    isNotificationHovered = false;
+    customFontsLoadVersion = 0;
+    customFontsReady = Promise.resolve();
+    onIsEngineReady(newValue) {
+        if (newValue && this.isToolbarReady) {
+            this.checkIsReady();
+        }
+    }
+    onIsToolbarReady(newValue) {
+        if (newValue && this.isEngineReady) {
+            this.checkIsReady();
+        }
+    }
+    onAvailableWorkspacesChange(newWorkspaces) {
+        const activeWorkspace = this.activeWorkspace;
+        if (activeWorkspace) {
+            const updatedActiveWorkspace = newWorkspaces.find(ws => ws.id === activeWorkspace.id);
+            if (updatedActiveWorkspace && updatedActiveWorkspace !== activeWorkspace) {
+                this.activeWorkspace = updatedActiveWorkspace;
+            }
+        }
+        // If activeWorkspaceId is set, try to keep it in sync with the updated workspaces list
+        if (this.activeWorkspaceId) {
+            const workspaceWithId = newWorkspaces.find(ws => ws.id === this.activeWorkspaceId);
+            if (workspaceWithId && workspaceWithId !== this.activeWorkspace) {
+                this.activeWorkspace = workspaceWithId;
+            }
+        }
+    }
+    onActiveWorkspaceChange() {
+        this.updateCurrentIsPublic();
+    }
+    onCustomFontsChange(newValue) {
+        void this.registerCustomFonts(newValue);
+    }
+    onMoreMenuItemsChange() {
+        this.recomputeMoreMenuItems();
+    }
+    onSyncConfigChange() {
+        this.recomputeMoreMenuItems();
+    }
+    onLoginConfigChange() {
+        this.recomputeMoreMenuItems();
+    }
+    onUserChange() {
+        this.recomputeMoreMenuItems();
+    }
+    onActiveWorkspaceIdChange(newId) {
+        // If no ID is provided, do nothing (allows other logic to control activeWorkspace)
+        if (!newId) {
+            return;
+        }
+        // If workspaces are not loaded yet, the watch will fire again once they are
+        if (this.availableWorkspaces.length === 0) {
+            return;
+        }
+        // Find the workspace with the matching ID
+        const workspace = this.availableWorkspaces.find(ws => ws.id === newId);
+        if (workspace) {
+            // Only update if it's different from the current activeWorkspace
+            if (workspace !== this.activeWorkspace) {
+                this.activeWorkspace = workspace;
+            }
+        }
+        else {
+            console.warn(`[KritzelEditor] No workspace found with ID: ${newId}`);
+        }
+    }
+    onCurrentThemeChange() {
+        this.applyTheme();
+        setTimeout(() => this.setOsSpecificCssVariables(), 0);
+        if (this.engineRef) {
+            this.engineRef.saveSettings(this.currentSettingsConfig);
+        }
+    }
+    onThemesChange() {
+        this.applyTheme();
+    }
+    onLocaleChange(newValue) {
+        if (this.engineRef) {
+            this.engineRef.setLocale(newValue);
+            this.engineRef.saveSettings(this.currentSettingsConfig);
+            void this.refreshLocalizedTerms();
+        }
+    }
+    onLocalesChange(newValue) {
+        if (this.engineRef) {
+            void this.engineRef.configureLocales(newValue).then(() => this.refreshLocalizedTerms());
+        }
+    }
+    /**
+     * Refreshes the editor-owned localized strings (e.g. the more menu and the
+     * strings forwarded to child UI components) from the engine's localization
+     * manager for the active locale.
+     */
+    async refreshLocalizedTerms() {
+        if (!this.engineRef) {
+            return;
+        }
+        const resolvedLocale = await this.engineRef.getLocale();
+        if (resolvedLocale !== this.locale) {
+            // Auto-selected because the previous locale isn't in the (possibly replaced) available set.
+            this.locale = resolvedLocale;
+            this.localeChange.emit(resolvedLocale);
+        }
+        this.resolvedTerms = await this.engineRef.getResolvedTerms();
+        this.availableLocaleOptions = await this.engineRef.getAvailableLocaleOptions();
+        this.recomputeMoreMenuItems();
+    }
+    onTouchStart(event) {
+        if (event.cancelable) {
+            event.preventDefault();
+        }
+    }
+    async getObjectById(id) {
+        return this.engineRef.getObjectById(id);
+    }
+    async addObject(object) {
+        return this.engineRef.addObject(object);
+    }
+    async addObjects(objects) {
+        return this.engineRef.addObjects(objects);
+    }
+    async updateObject(object, updatedProperties) {
+        return this.engineRef.updateObject(object, updatedProperties);
+    }
+    async removeObject(object) {
+        return this.engineRef.removeObject(object);
+    }
+    async removeObjects(objects) {
+        return this.engineRef.removeObjects(objects);
+    }
+    async getSelectedObjects() {
+        return this.engineRef.getSelectedObjects();
+    }
+    async selectObjects(objects) {
+        return this.engineRef.selectObjects(objects);
+    }
+    async selectAllObjectsInViewport() {
+        return this.engineRef.selectAllObjectsInViewport();
+    }
+    async clearSelection() {
+        this.engineRef.clearSelection();
+    }
+    async centerObjectInViewport(object) {
+        return this.engineRef.centerObjectInViewport(object);
+    }
+    async panToObject(object) {
+        return this.engineRef.panToObject(object);
+    }
+    async backToContent() {
+        return this.engineRef.backToContent();
+    }
+    async centerAllObjects(animate = true) {
+        return this.engineRef.centerAllObjects(animate);
+    }
+    async centerObjects(objects, animate = true) {
+        return this.engineRef.centerObjects(objects, animate);
+    }
+    async setViewport(x, y, scale) {
+        return this.engineRef.setViewport(x, y, scale);
+    }
+    async panTo(x, y) {
+        return this.engineRef.panTo(x, y);
+    }
+    async zoomTo(scale, worldX, worldY) {
+        return this.engineRef.zoomTo(scale, worldX, worldY);
+    }
+    async zoomIn(factor = 1.6, duration = 200) {
+        return this.engineRef.zoomIn(factor, duration);
+    }
+    async zoomOut(factor = 1.6, duration = 200) {
+        return this.engineRef.zoomOut(factor, duration);
+    }
+    async getViewport() {
+        return this.engineRef.getViewport();
+    }
+    async screenToWorld(x, y) {
+        return this.engineRef.screenToWorld(x, y);
+    }
+    async worldToScreen(x, y) {
+        return this.engineRef.worldToScreen(x, y);
+    }
+    async setActiveWorkspace(id) {
+        return this.engineRef.setActiveWorkspace(id);
+    }
+    async createWorkspace(workspace) {
+        return this.engineRef.createWorkspace(workspace);
+    }
+    async updateWorkspace(workspace) {
+        return this.engineRef.updateWorkspace(workspace);
+    }
+    async deleteWorkspace(workspace) {
+        return this.engineRef.deleteWorkspace(workspace);
+    }
+    async getWorkspaces() {
+        return this.engineRef.getWorkspaces();
+    }
+    async getActiveWorkspace() {
+        return this.engineRef.getActiveWorkspace();
+    }
+    async loadSharedWorkspace(token) {
+        return this.engineRef.loadSharedWorkspace(token);
+    }
+    async reinitSync() {
+        return this.engineRef.reinitSync();
+    }
+    // ── Tool management ─────────────────────────────────────────────────
+    async registerTool(toolName, toolClass, toolConfig) {
+        return this.engineRef.registerTool(toolName, toolClass, toolConfig);
+    }
+    async changeActiveTool(toolName) {
+        return this.engineRef.changeActiveTool(toolName);
+    }
+    async disable() {
+        return this.engineRef.disable();
+    }
+    async enable() {
+        return this.engineRef.enable();
+    }
+    async copy() {
+        return this.engineRef.copy();
+    }
+    async cut() {
+        return this.engineRef.cut();
+    }
+    async paste(x, y) {
+        return this.engineRef.paste(x, y);
+    }
+    async delete() {
+        return this.engineRef.delete();
+    }
+    async bringForward(object) {
+        return this.engineRef.bringForward(object);
+    }
+    async sendBackward(object) {
+        return this.engineRef.sendBackward(object);
+    }
+    async bringToFront(object) {
+        return this.engineRef.bringToFront(object);
+    }
+    async sendToBack(object) {
+        return this.engineRef.sendToBack(object);
+    }
+    async alignObjects(alignment) {
+        return this.engineRef.alignObjects(alignment);
+    }
+    async group() {
+        return this.engineRef.group();
+    }
+    async ungroup() {
+        return this.engineRef.ungroup();
+    }
+    async undo() {
+        return this.engineRef.undo();
+    }
+    async redo() {
+        return this.engineRef.redo();
+    }
+    async getScreenshot(format = 'png') {
+        return this.engineRef.getScreenshot(format);
+    }
+    async exportViewportAsPng() {
+        return this.engineRef.exportViewportAsPng();
+    }
+    async exportViewportAsSvg() {
+        return this.engineRef.exportViewportAsSvg();
+    }
+    async getSelectedObjectSupportedExportFormats() {
+        return this.engineRef.getSelectedObjectSupportedExportFormats();
+    }
+    async canExportSelectedObjectAs(format) {
+        return this.engineRef.canExportSelectedObjectAs(format);
+    }
+    async exportSelectedObject(format) {
+        return this.engineRef.exportSelectedObject(format);
+    }
+    async exportAsJson() {
+        return this.engineRef.exportAsJson();
+    }
+    async importFromJson(json) {
+        return this.engineRef.importFromJson(json);
+    }
+    async downloadAsJson(filename) {
+        return this.engineRef.downloadAsJson(filename);
+    }
+    async importFromFile() {
+        return this.engineRef.importFromFile();
+    }
+    async loadObjectsFromJson(json) {
+        return this.engineRef.loadObjectsFromJson(json);
+    }
+    async getObjectsTotalCount() {
+        return this.engineRef.getObjectsTotalCount();
+    }
+    async getAllObjects() {
+        return this.engineRef.getAllObjects();
+    }
+    async findObjects(predicate) {
+        return this.engineRef.findObjects(predicate);
+    }
+    async getObjectsInViewport() {
+        return this.engineRef.getObjectsInViewport();
+    }
+    async hideContextMenu() {
+        return this.engineRef.hideContextMenu();
+    }
+    async openContextMenu(options) {
+        return this.engineRef.openContextMenu(options);
+    }
+    async openWorkspaceManagerMenu() {
+        if (!this.isWorkspaceManagerVisible) {
+            return;
+        }
+        await this.workspaceManagerRef?.open();
+    }
+    async closeWorkspaceManagerMenu() {
+        await this.workspaceManagerRef?.close();
+    }
+    async openMoreMenu() {
+        if (!this.isMoreMenuVisible) {
+            return;
+        }
+        await this.moreMenuRef?.open();
+    }
+    async closeMoreMenu() {
+        await this.moreMenuRef?.close();
+    }
+    async openUserDialog() {
+        await this.currentUserDialogRef?.open();
+    }
+    async closeUserDialog() {
+        await this.currentUserDialogRef?.close();
+    }
+    async openExportDialog() {
+        const preview = await this.engineRef.getScreenshot('png');
+        await this.exportRef?.open(preview ?? undefined);
+    }
+    async closeExportDialog() {
+        await this.exportRef?.close();
+    }
+    async openImportDialog() {
+        await this.engineRef.importFromFile();
+    }
+    async closeImportDialog() {
+        await this.engineRef.cancelImportFromFile();
+    }
+    async openSettingsDialog() {
+        await this.settingsRef?.open();
+    }
+    async closeSettingsDialog() {
+        await this.settingsRef?.close();
+    }
+    async openShareDialog() {
+        await this.shareDialogRef?.open();
+    }
+    async closeShareDialog() {
+        await this.shareDialogRef?.close();
+    }
+    async triggerSelectionChange() {
+        return this.engineRef.triggerSelectionChange();
+    }
+    async beginSceneBootstrap() {
+        return this.engineRef.beginSceneBootstrap();
+    }
+    async endSceneBootstrap() {
+        return this.engineRef.endSceneBootstrap();
+    }
+    async getDisplayableShortcuts() {
+        return this.engineRef.getDisplayableShortcuts();
+    }
+    async openLoginDialog() {
+        this.loginDialogRef?.open();
+    }
+    async closeLoginDialog() {
+        this.loginDialogRef?.close();
+    }
+    async setLoginLoading(provider) {
+        this.loginDialogRef?.setLoading(provider);
+    }
+    /**
+     * Sets the active locale (language) and re-renders the UI.
+     * @param code - The locale code to activate, e.g. 'de'.
+     */
+    async setLocale(code) {
+        this.locale = code;
+        await this.engineRef?.setLocale(code);
+    }
+    /**
+     * Gets the currently active locale code.
+     */
+    async getLocale() {
+        return this.engineRef ? this.engineRef.getLocale() : this.locale;
+    }
+    /**
+     * Gets the list of available locale codes (built-in and registered).
+     */
+    async getAvailableLocales() {
+        return this.engineRef ? this.engineRef.getAvailableLocales() : [];
+    }
+    /**
+     * Registers additional locale definitions (with optional partial term overrides).
+     * @param locales - The locale definitions to register.
+     */
+    async registerLocales(locales) {
+        await this.engineRef?.registerLocales(locales);
+    }
+    /**
+     * Registers custom fonts for the editor runtime.
+     * @param fonts - Mapping from font keys to family names or font definitions.
+     * @remarks This no longer controls the text-tool config tooltip font options.
+    * Configure tooltip fonts via toolbarItems[].config.availableFonts.
+     */
+    async registerFonts(fonts) {
+        await this.registerCustomFonts(fonts);
+    }
+    /**
+     * Resolves a term key to its translated string for the active locale.
+     * @param key - The term key to resolve.
+     * @param vars - Optional values for `{placeholder}` interpolation.
+     */
+    async t(key, vars) {
+        return this.engineRef ? this.engineRef.t(key, vars) : key;
+    }
+    /**
+     * Triggers a UI notification programmatically.
+     * @param notification - Notification payload. `id` and `timestamp` are optional.
+     */
+    async triggerNotification(notification) {
+        const normalizedNotification = {
+            ...notification,
+            id: notification.id ?? ObjectHelper.generateUUID(),
+            timestamp: notification.timestamp ?? new Date(),
+        };
+        this.clearNotificationDismissAnimationTimer();
+        this.isNotificationDismissing = false;
+        this.isNotificationHovered = false;
+        this.activeNotification = normalizedNotification;
+        this.scheduleNotificationDismiss();
+    }
+    engineRef;
+    toolbarRef;
+    settingsRef;
+    exportRef;
+    splitButtonRef;
+    workspaceManagerRef;
+    moreMenuRef;
+    shareDialogRef;
+    loginDialogRef;
+    currentUserDialogRef;
+    componentWillLoad() {
+        this.recomputeMoreMenuItems();
+        this.loadSettingsFromStorage();
+        this.applyTheme();
+    }
+    isTextToolConfig(config) {
+        return !!config && 'fontFamily' in config && 'size' in config && 'color' in config;
+    }
+    lastToolbarItemsRef = null;
+    lastNormalizedToolbarItems = [];
+    getNormalizedToolbarItems() {
+        if (this.toolbarItems !== this.lastToolbarItemsRef) {
+            this.lastToolbarItemsRef = this.toolbarItems;
+            this.lastNormalizedToolbarItems = this.normalizeToolbar(this.toolbarItems);
+        }
+        return this.lastNormalizedToolbarItems;
+    }
+    normalizeToolbar(toolbarItems) {
+        return toolbarItems.map(control => {
+            if (!this.isTextToolConfig(control.config)) {
+                return control;
+            }
+            return {
+                ...control,
+                config: {
+                    ...control.config,
+                    availableFonts: resolveTextToolAvailableFonts(control.config.availableFonts),
+                },
+            };
+        });
+    }
+    recomputeMoreMenuItems() {
+        if (this.moreMenuItems) {
+            this.resolvedMoreMenuItems = this.moreMenuItems;
+            return;
+        }
+    }
+    applyTheme() {
+        const themeObj = this.resolveThemeObject();
+        ThemeHelper.applyThemeToElement(this.host, themeObj);
+    }
+    resolveThemeObject() {
+        return this.themes?.find(t => t.name === this.theme) ?? (this.theme === 'dark' ? darkTheme : lightTheme);
+    }
+    componentDidLoad() {
+        this.registerCustomSvgIcons();
+        this.registerCustomFonts();
+        this.listenForMobileKeyboard();
+        this.setOsSpecificCssVariables();
+    }
+    disconnectedCallback() {
+        this.clearLoadingOverlayShowTimer();
+        this.clearLoadingOverlayHideTimer();
+        this.clearNotificationDismissTimer();
+        this.clearNotificationDismissAnimationTimer();
+    }
+    async checkIsReady() {
+        await customElements.whenDefined('kritzel-editor');
+        await customElements.whenDefined('kritzel-workspace-manager');
+        await customElements.whenDefined('kritzel-toolbar');
+        await customElements.whenDefined('kritzel-engine');
+        await this.waitForCustomFontsReady();
+        if (!this.isEngineReady || !this.isToolbarReady || !this.isWorkspaceManagerReady || !this.activeWorkspace) {
+            return;
+        }
+        this.isEditorVisible = true;
+        const { id, name, isPublic, createdAt, updatedAt } = this.activeWorkspace;
+        this.isReady.emit({
+            host: this.host,
+            activeWorkspace: {
+                id,
+                name,
+                isPublic,
+                createdAt,
+                updatedAt,
+            },
+            syncConfig: this.syncConfig,
+            assetStorageConfig: this.assetStorageConfig,
+            loginConfig: this.loginConfig,
+            theme: this.theme,
+        });
+    }
+    async onEngineReady(event) {
+        this.isEngineReady = true;
+        if (!event.detail.activeWorkspace) {
+            return;
+        }
+        this.activeWorkspace = event.detail.activeWorkspace;
+        this.availableWorkspaces = event.detail.workspaces;
+        this.currentIsPublic = await this.engineRef.getIsPublic();
+        await this.refreshLocalizedTerms();
+        const viewport = await this.engineRef.getViewport();
+        this.currentZoomPercent = this.getZoomPercentFromScale(viewport.scale);
+        this.loadShortcuts();
+    }
+    handleWorkspacesChange(event) {
+        event.stopPropagation();
+        this.availableWorkspaces = event.detail;
+    }
+    async handleWorkspaceManagerChange(event) {
+        event.stopPropagation();
+        const workspace = event.detail;
+        this.activeWorkspace = workspace ?? undefined;
+        if (!workspace) {
+            return;
+        }
+        await this.engineRef.setActiveWorkspace(workspace.id);
+    }
+    handleActiveWorkspaceChange(event) {
+        event.stopPropagation();
+        this.activeWorkspace = event.detail;
+        if (!this.isEngineReady) {
+            return;
+        }
+        const { id, name, isPublic, createdAt, updatedAt } = this.activeWorkspace;
+        this.activeWorkspaceChange.emit({
+            id,
+            name,
+            isPublic,
+            createdAt,
+            updatedAt,
+        });
+    }
+    handleObjectsChange(event) {
+        event.stopPropagation();
+        this.objectsChange.emit(event.detail);
+    }
+    handleObjectsAdded(event) {
+        event.stopPropagation();
+        this.objectsAdded.emit(event.detail);
+    }
+    handleObjectsRemoved(event) {
+        event.stopPropagation();
+        this.objectsRemoved.emit(event.detail);
+    }
+    handleObjectsUpdated(event) {
+        event.stopPropagation();
+        this.objectsUpdated.emit(event.detail);
+    }
+    handleObjectsSelectionChange(event) {
+        console.log(event.detail);
+        event.stopPropagation();
+        this.objectsSelectionChange.emit(event.detail);
+    }
+    handleUndoStateChange(event) {
+        event.stopPropagation();
+        this.undoStateChange.emit(event.detail);
+        this.undoState = event.detail;
+    }
+    async handleObjectsInViewportChange(event) {
+        event.stopPropagation();
+        const hasVisibleObjects = this.getContentObjects(event.detail).length > 0;
+        const hasAnyObjectsAtAll = this.getContentObjects(await this.engineRef.getAllObjects()).length > 0;
+        this.isBackToContentButtonVisible = !hasVisibleObjects && hasAnyObjectsAtAll;
+    }
+    handleViewportChange(event) {
+        event.stopPropagation();
+        this.currentZoomPercent = this.getZoomPercentFromScale(event.detail.scale);
+        this.viewportChange.emit(event.detail);
+    }
+    getZoomPercentFromScale(scale) {
+        if (!Number.isFinite(scale) || scale <= 0) {
+            return 100;
+        }
+        return Math.round(scale * 100);
+    }
+    handleAwarenessChange(event) {
+        event.stopPropagation();
+        this.awarenessChange.emit(event.detail);
+    }
+    handleNotificationsChange(event) {
+        event.stopPropagation();
+        this.clearNotificationDismissAnimationTimer();
+        this.isNotificationDismissing = false;
+        this.isNotificationHovered = false;
+        this.activeNotification = event.detail;
+        this.scheduleNotificationDismiss();
+    }
+    handleContextMenuStateChange(event) {
+        event.stopPropagation();
+        this.contextMenuState = event.detail.isVisible ? event.detail : undefined;
+    }
+    handleIsLoadingChange(event) {
+        console.log('isLoadingChange event:', event.detail);
+        event.stopPropagation();
+        this.clearLoadingOverlayShowTimer();
+        this.clearLoadingOverlayHideTimer();
+        if (event.detail) {
+            this.loadingOverlayShowTimeout = setTimeout(() => {
+                this.isLoadingOverlayVisible = true;
+                this.loadingOverlayShownTimestamp = Date.now();
+                this.loadingOverlayShowTimeout = undefined;
+            }, this.loadingOverlayDelayMs);
+            return;
+        }
+        if (this.isLoadingOverlayVisible && this.loadingOverlayShownTimestamp !== undefined) {
+            const elapsed = Date.now() - this.loadingOverlayShownTimestamp;
+            const remaining = this.loadingOverlayMinDisplayDurationMs - elapsed;
+            if (remaining > 0) {
+                this.loadingOverlayHideTimeout = setTimeout(() => {
+                    this.isLoadingOverlayVisible = false;
+                    this.loadingOverlayShownTimestamp = undefined;
+                    this.loadingOverlayHideTimeout = undefined;
+                }, remaining);
+                return;
+            }
+        }
+        this.isLoadingOverlayVisible = false;
+        this.loadingOverlayShownTimestamp = undefined;
+    }
+    clearLoadingOverlayShowTimer() {
+        if (this.loadingOverlayShowTimeout) {
+            clearTimeout(this.loadingOverlayShowTimeout);
+            this.loadingOverlayShowTimeout = undefined;
+        }
+    }
+    clearLoadingOverlayHideTimer() {
+        if (this.loadingOverlayHideTimeout) {
+            clearTimeout(this.loadingOverlayHideTimeout);
+            this.loadingOverlayHideTimeout = undefined;
+        }
+    }
+    handleContextMenuActionSelected(event) {
+        const contextMenuState = this.contextMenuState;
+        if (!contextMenuState || !event.detail.action) {
+            void this.hideContextMenu();
+            return;
+        }
+        event.detail.action({
+            x: contextMenuState.worldPosition.x,
+            y: contextMenuState.worldPosition.y,
+        }, contextMenuState.objects);
+        void this.hideContextMenu();
+    }
+    handleNotificationHoverChange(event) {
+        event.stopPropagation();
+        this.isNotificationHovered = event.detail;
+        if (this.isNotificationHovered) {
+            this.clearNotificationDismissTimer();
+            return;
+        }
+        if (this.activeNotification && !this.isNotificationDismissing) {
+            this.scheduleNotificationDismiss();
+        }
+    }
+    scheduleNotificationDismiss() {
+        this.clearNotificationDismissTimer();
+        this.notificationDismissTimeout = setTimeout(() => {
+            this.dismissNotification();
+        }, this.notificationDisplayDurationMs);
+    }
+    clearNotificationDismissTimer() {
+        if (this.notificationDismissTimeout) {
+            clearTimeout(this.notificationDismissTimeout);
+            this.notificationDismissTimeout = undefined;
+        }
+    }
+    clearNotificationDismissAnimationTimer() {
+        if (this.notificationDismissAnimationTimeout) {
+            clearTimeout(this.notificationDismissAnimationTimeout);
+            this.notificationDismissAnimationTimeout = undefined;
+        }
+    }
+    dismissNotification = () => {
+        this.clearNotificationDismissTimer();
+        this.isNotificationHovered = false;
+        if (!this.activeNotification || this.isNotificationDismissing) {
+            return;
+        }
+        this.isNotificationDismissing = true;
+        this.clearNotificationDismissAnimationTimer();
+        this.notificationDismissAnimationTimeout = setTimeout(() => {
+            this.activeNotification = undefined;
+            this.isNotificationDismissing = false;
+            this.notificationDismissAnimationTimeout = undefined;
+        }, this.notificationDismissAnimationDurationMs);
+    };
+    handleSettingsChange(event) {
+        this.scaleMin = event.detail.scaleMin;
+        this.scaleMax = event.detail.scaleMax;
+        this.lockDrawingScale = event.detail.lockDrawingScale;
+        this.theme = event.detail.theme;
+        if (typeof event.detail.locale === 'string' && event.detail.locale !== this.locale) {
+            this.locale = event.detail.locale;
+            this.localeChange.emit(event.detail.locale);
+        }
+        this.viewportBoundaryLeft = event.detail.viewportBoundaryLeft ?? -Infinity;
+        this.viewportBoundaryRight = event.detail.viewportBoundaryRight ?? Infinity;
+        this.viewportBoundaryTop = event.detail.viewportBoundaryTop ?? -Infinity;
+        this.viewportBoundaryBottom = event.detail.viewportBoundaryBottom ?? Infinity;
+        this.debugInfo = event.detail.debugInfo;
+        if (this.engineRef) {
+            this.engineRef.saveSettings(event.detail);
+        }
+        this.themeChange.emit(event.detail.theme);
+    }
+    handleToggleIsPublic = async (event) => {
+        const isPublic = event.detail;
+        const activeWorkspace = await this.engineRef.getActiveWorkspace();
+        activeWorkspace.isPublic = isPublic;
+        await this.engineRef.updateWorkspace(activeWorkspace);
+        this.activeWorkspace = activeWorkspace.clone();
+        this.isPublicChange.emit({ isPublic, workspaceId: activeWorkspace.id });
+    };
+    /**
+     * Updates the currentIsPublic state from the active workspace and emits the isPublicChange event.
+     */
+    updateCurrentIsPublic() {
+        const isPublic = this.activeWorkspace?.isPublic ?? false;
+        const workspaceId = this.activeWorkspace?.id;
+        this.currentIsPublic = isPublic;
+        if (!workspaceId) {
+            return;
+        }
+        this.isPublicChange.emit({ isPublic, workspaceId });
+    }
+    handleProviderLogin = (event) => {
+        this.login.emit(event.detail);
+    };
+    handleCurrentUserLogout = () => {
+        this.logout.emit();
+    };
+    get isLoggedIn() {
+        return !!this.user && !this.user.isGuest;
+    }
+    canExportObjectsAs(objects, format) {
+        if (!objects || objects.length !== 1) {
+            return false;
+        }
+        const [selected] = objects;
+        if (!ObjectHelper.isKritzelExportable(selected)) {
+            return false;
+        }
+        return selected.getSupportedExportFormats().includes(format);
+    }
+    canExportObjects(objects) {
+        return this.canExportObjectsAs(objects, 'png') || this.canExportObjectsAs(objects, 'svg');
+    }
+    getPreferredExportFormat(objects) {
+        if (this.canExportObjectsAs(objects, 'png')) {
+            return 'png';
+        }
+        if (this.canExportObjectsAs(objects, 'svg')) {
+            return 'svg';
+        }
+        return null;
+    }
+    getSettingsStorageKey() {
+        return this.editorId ? `kritzel-settings-${this.editorId}` : 'kritzel-settings';
+    }
+    loadSettingsFromStorage() {
+        const stored = localStorage.getItem(this.getSettingsStorageKey());
+        if (stored) {
+            try {
+                const parsed = JSON.parse(stored);
+                if (typeof parsed.scaleMin === 'number') {
+                    this.scaleMin = parsed.scaleMin;
+                }
+                if (typeof parsed.scaleMax === 'number') {
+                    this.scaleMax = parsed.scaleMax;
+                }
+                if (typeof parsed.lockDrawingScale === 'boolean') {
+                    this.lockDrawingScale = parsed.lockDrawingScale;
+                }
+                if (typeof parsed.theme === 'string') {
+                    this.theme = parsed.theme;
+                }
+                if (typeof parsed.locale === 'string') {
+                    this.locale = parsed.locale;
+                }
+                if (typeof parsed.viewportBoundaryLeft === 'number') {
+                    this.viewportBoundaryLeft = parsed.viewportBoundaryLeft;
+                }
+                if (typeof parsed.viewportBoundaryRight === 'number') {
+                    this.viewportBoundaryRight = parsed.viewportBoundaryRight;
+                }
+                if (typeof parsed.viewportBoundaryTop === 'number') {
+                    this.viewportBoundaryTop = parsed.viewportBoundaryTop;
+                }
+                if (typeof parsed.viewportBoundaryBottom === 'number') {
+                    this.viewportBoundaryBottom = parsed.viewportBoundaryBottom;
+                }
+                if (parsed.debugInfo) {
+                    this.debugInfo = { ...this.debugInfo, ...parsed.debugInfo };
+                }
+            }
+            catch {
+                // Invalid JSON, use prop defaults
+            }
+        }
+    }
+    async loadShortcuts() {
+        this.shortcuts = await this.engineRef.getDisplayableShortcuts();
+    }
+    get currentSettingsConfig() {
+        return {
+            scaleMin: this.scaleMin,
+            scaleMax: this.scaleMax,
+            lockDrawingScale: this.lockDrawingScale,
+            theme: this.theme,
+            locale: this.locale,
+            viewportBoundaryLeft: this.viewportBoundaryLeft,
+            viewportBoundaryRight: this.viewportBoundaryRight,
+            viewportBoundaryTop: this.viewportBoundaryTop,
+            viewportBoundaryBottom: this.viewportBoundaryBottom,
+            debugInfo: this.debugInfo,
+        };
+    }
+    getContentObjects(objects) {
+        return objects.filter(obj => !(obj instanceof KritzelSelectionGroup) && !(obj instanceof KritzelSelectionBox));
+    }
+    registerCustomSvgIcons() {
+        for (const [name, svg] of Object.entries(this.customSvgIcons)) {
+            KritzelIconRegistry.register(name, svg);
+        }
+    }
+    async registerCustomFonts(fonts = this.customFonts) {
+        KritzelFontRegistry.registerFonts(fonts);
+        const currentVersion = ++this.customFontsLoadVersion;
+        const loadPromise = KritzelFontRegistry.waitForFonts(fonts);
+        this.customFontsReady = loadPromise;
+        await loadPromise;
+        if (currentVersion !== this.customFontsLoadVersion) {
+            await this.waitForCustomFontsReady();
+        }
+    }
+    async waitForCustomFontsReady() {
+        while (true) {
+            const version = this.customFontsLoadVersion;
+            await this.customFontsReady;
+            if (version === this.customFontsLoadVersion) {
+                return;
+            }
+        }
+    }
+    listenForMobileKeyboard() {
+        KritzelKeyboardHelper.onKeyboardVisibleChanged(isOpen => {
+            this.isVirtualKeyboardOpen = isOpen;
+        });
+    }
+    setOsSpecificCssVariables() {
+        const os = KritzelDevicesHelper.detectOS();
+        switch (os) {
+            case 'iOS':
+                // iOS specific adjustments
+                this.host.style.setProperty('--kritzel-editor-top-left-buttons-top', '14px');
+                this.host.style.setProperty('--kritzel-editor-top-left-buttons-left', '14px');
+                this.host.style.setProperty('--kritzel-editor-toolbar-bottom', '14px');
+                this.host.style.setProperty('--kritzel-editor-toolbar-transition', 'cubic-bezier(0.25, 0.1, 0.25, 1.0)');
+                this.host.style.setProperty('--kritzel-editor-toolbar-transform', 'translateY(200%)');
+                this.host.style.setProperty('--kritzel-editor-toolbar-transition-duration', '0.25s');
+                break;
+            case 'Android':
+                // Android specific adjustments
+                this.host.style.setProperty('--kritzel-editor-top-left-buttons-top', '14px');
+                this.host.style.setProperty('--kritzel-editor-top-left-buttons-left', '14px');
+                this.host.style.setProperty('--kritzel-editor-toolbar-bottom', '24px');
+                this.host.style.setProperty('--kritzel-editor-toolbar-transition', 'cubic-bezier(0.25, 0.1, 0.25, 1.0)');
+                this.host.style.setProperty('--kritzel-editor-toolbar-transform', 'translateY(200%)');
+                this.host.style.setProperty('--kritzel-editor-toolbar-transition-duration', '0.25s');
+                break;
+            default:
+                // Default for Windows/Linux
+                this.host.style.setProperty('--kritzel-editor-top-left-buttons-top', '14px');
+                this.host.style.setProperty('--kritzel-editor-top-left-buttons-left', '14px');
+                this.host.style.setProperty('--kritzel-editor-toolbar-bottom', '14px');
+                break;
+        }
+    }
+    render() {
+        const isLoggedIn = this.isLoggedIn;
+        const shouldShowCurrentUser = isLoggedIn;
+        const shouldShowLoginButton = this.isReady && !!this.loginConfig && !isLoggedIn;
+        const normalizedToolbarItems = this.getNormalizedToolbarItems();
+        return (h(Host, { key: '34f8001fb3d6ac1f52a51aa57eef893a41fb1c8c' }, h("div", { key: '61ae20a731ee495361bdd9cb0ed334cde2b3af42', class: "editor-content", style: {
+                opacity: this.isEditorVisible ? '1' : '0',
+                visibility: this.isEditorVisible ? 'visible' : 'hidden',
+                transition: 'opacity 0.2s ease-in-out, visibility 0.2s ease-in-out',
+            } }, h("div", { key: '760c5f02ae80fba30fff328f307fa78e45531f13', class: "top-left-buttons" }, h("kritzel-workspace-manager", { key: '4daf1b5fbc6523c46ce3c0b4bec206f1905cf1b7', ref: el => {
+                if (el) {
+                    this.workspaceManagerRef = el;
+                }
+            }, visible: this.isWorkspaceManagerVisible, workspaces: this.availableWorkspaces, activeWorkspace: this.activeWorkspace, terms: this.resolvedTerms, onWorkspaceChange: event => this.handleWorkspaceManagerChange(event), onIsWorkspaceManagerReady: () => (this.isWorkspaceManagerReady = true) }), h("kritzel-back-to-content", { key: '72e7649d13e3f03bcb7cd7c0507d1bd15e2f4cb3', visible: this.isBackToContentButtonVisible, text: this.resolvedTerms['backToContent.label'] ?? 'Back to content', onBackToContent: () => this.backToContent() })), this.activeNotification && (h("div", { key: '0651bba45fabb7342ea28e120bc930be5ee45de6', class: "top-center-notification-layer", role: "presentation" }, h("div", { key: 'b4b0bf29824b7cb025ef168a7c7be31d5054c0ff', class: { 'top-center-notification-container': true, 'is-dismissing': this.isNotificationDismissing }, role: "presentation" }, h("kritzel-notification-card", { key: '93c6f6b313a082f155eca9c60e623bcfbdd4119f', notification: this.activeNotification, locale: this.locale, onDismiss: this.dismissNotification, onHoverChange: event => this.handleNotificationHoverChange(event) })))), this.contextMenuState && this.contextMenuState.items.length > 0 && (h("kritzel-context-menu", { key: '0ad85b0ee5e85fffa081f88cdc991b3233ddd5ad', class: "context-menu", items: this.contextMenuState.items, objects: this.contextMenuState.objects, style: {
+                position: 'absolute',
+                left: `${this.contextMenuState.position.x}px`,
+                top: `${this.contextMenuState.position.y}px`,
+                zIndex: '10002',
+            }, onActionSelected: event => this.handleContextMenuActionSelected(event), onClose: () => this.hideContextMenu() })), h("kritzel-loading-overlay", { key: 'bf4a9e25c3f78633831bcfdaf580a45171b67fff', visible: this.isLoadingOverlayVisible, text: this.resolvedTerms['editor.loading'] ?? 'Loading...' }), h("kritzel-engine", { key: '46bdfb77cddd106b7c6e8f7767520a331608592f', ref: el => {
+                if (el) {
+                    this.engineRef = el;
+                }
+            }, workspaces: this.workspaces, activeWorkspaceId: this.activeWorkspaceId, editorId: this.editorId, syncConfig: this.syncConfig, assetStorageConfig: this.assetStorageConfig, user: this.user, scaleMax: this.scaleMax, lockDrawingScale: this.lockDrawingScale, scaleMin: this.scaleMin, cursorTarget: this.cursorTarget, viewportBoundaryLeft: this.viewportBoundaryLeft, viewportBoundaryRight: this.viewportBoundaryRight, viewportBoundaryTop: this.viewportBoundaryTop, viewportBoundaryBottom: this.viewportBoundaryBottom, isPanningEnabled: this.isPanningEnabled, isZoomingEnabled: this.isZoomingEnabled, theme: this.theme, themes: this.themes, licenseKey: this.licenseKey, locale: this.locale, locales: this.locales, fallbackLocale: this.fallbackLocale, debugInfo: this.debugInfo, globalContextMenuItems: this.globalContextMenuItems, objectContextMenuItems: this.objectContextMenuItems, onIsEngineReady: event => this.onEngineReady(event), onWorkspacesChange: event => this.handleWorkspacesChange(event), onActiveWorkspaceChange: event => this.handleActiveWorkspaceChange(event), onObjectsChange: event => this.handleObjectsChange(event), onObjectsAdded: event => this.handleObjectsAdded(event), onObjectsRemoved: event => this.handleObjectsRemoved(event), onObjectsUpdated: event => this.handleObjectsUpdated(event), onObjectsSelectionChange: event => this.handleObjectsSelectionChange(event), onUndoStateChange: event => this.handleUndoStateChange(event), onObjectsInViewportChange: event => this.handleObjectsInViewportChange(event), onViewportChange: event => this.handleViewportChange(event), onAwarenessChange: event => this.handleAwarenessChange(event), onNotificationsChange: event => this.handleNotificationsChange(event), onContextMenuStateChange: event => this.handleContextMenuStateChange(event), onIsLoadingChange: event => this.handleIsLoadingChange(event) }), h("kritzel-toolbar", { key: 'f19449a3b6aa08c51eb58ba53a37e133a6d1d1d5', visible: this.isToolbarVisible, class: { 'keyboard-open': this.isVirtualKeyboardOpen }, ref: el => {
+                if (el) {
+                    this.toolbarRef = el;
+                }
+            }, toolbarItems: normalizedToolbarItems, isUtilityPanelVisible: this.isUtilityPanelVisible, undoState: this.undoState ?? undefined, theme: this.theme, terms: this.resolvedTerms, onIsToolbarReady: () => (this.isToolbarReady = true) }), h("div", { key: '3d7b417b286f9e003137d02a7520ef1d9b5563f2', class: "bottom-left-buttons" }, h("kritzel-zoom-panel", { key: '1d366c23cb68e5e345a8cb8833cdc61c9a0c607b', visible: this.isZoomPanelVisible, zoomPercent: this.currentZoomPercent, terms: this.resolvedTerms, onZoomIn: () => this.zoomIn(), onZoomOut: () => this.zoomOut() })), h("div", { key: '1c27cd556dea88b7dcf1fb6960157cff37210260', class: "top-right-buttons" }, h("kritzel-settings", { key: '61be74fbd336e64236a618bc40c5a68c9e4ba2a9', ref: el => {
+                if (el) {
+                    this.settingsRef = el;
+                }
+            }, shortcuts: this.shortcuts, availableThemes: this.themes && this.themes.length > 0 ? this.themes.map(t => t.name) : ['light', 'dark'], availableLocales: this.availableLocaleOptions, settings: this.currentSettingsConfig, terms: this.resolvedTerms, onSettingsChange: event => this.handleSettingsChange(event) }), h("kritzel-export", { key: '4e84be18db6d1c1982bd6420d034f80876b22651', ref: el => {
+                if (el) {
+                    this.exportRef = el;
+                }
+            }, workspaceName: this.activeWorkspace?.name || 'workspace', terms: this.resolvedTerms, onExportPng: () => this.engineRef.exportViewportAsPng(), onExportSvg: () => this.engineRef.exportViewportAsSvg(), onExportJson: event => this.engineRef.downloadAsJson(event.detail) }), h("kritzel-active-users", { key: 'a5c1b3de7e67ecddbac0a581a00585f796cd3dc3', users: this.activeUsers }), shouldShowCurrentUser && h("kritzel-current-user", { key: 'ff5f5668cb662f7275f714b3bad7ae7baff89eb4', user: this.user, terms: this.resolvedTerms, onClick: () => this.currentUserDialogRef?.open() }), shouldShowCurrentUser && (h("kritzel-current-user-dialog", { key: '18139a2382c60adec64fcb093e05904d3f37a639', ref: el => {
+                if (el) {
+                    this.currentUserDialogRef = el;
+                }
+            }, user: this.user, terms: this.resolvedTerms, onLogoutRequest: this.handleCurrentUserLogout })), shouldShowLoginButton && h("kritzel-button", { key: 'c1d72827c6416efda9ba1f5576390135c8161665', onButtonClick: () => this.loginDialogRef?.open() }, this.resolvedTerms['login.dialogTitle'] ?? 'Sign in'), h("kritzel-more-menu", { key: '6cf3f77fd2a1c5f9e04e3cf415e775dd60e94927', ref: el => {
+                if (el) {
+                    this.moreMenuRef = el;
+                }
+            }, items: this.resolvedMoreMenuItems, visible: this.isMoreMenuVisible, terms: this.resolvedTerms }), h("kritzel-share-dialog", { key: '60de09f78488162b0739f0494cc52706ba0df58d', ref: el => {
+                if (el) {
+                    this.shareDialogRef = el;
+                }
+            }, isPublic: this.currentIsPublic, workspaceId: this.activeWorkspace?.id, terms: this.resolvedTerms, onToggleIsPublic: this.handleToggleIsPublic }), this.loginConfig && (h("kritzel-login-dialog", { key: 'ab05733b8c6985f3b3a3d327c4effd58e57b0a8f', ref: el => {
+                if (el) {
+                    this.loginDialogRef = el;
+                }
+            }, providers: this.loginConfig.providers, dialogTitle: this.loginConfig.title ?? this.resolvedTerms['login.dialogTitle'] ?? 'Sign in', subtitle: this.loginConfig.subtitle, onProviderLogin: this.handleProviderLogin }))))));
+    }
+    static get watchers() { return {
+        "isEngineReady": [{
+                "onIsEngineReady": 0
+            }],
+        "isToolbarReady": [{
+                "onIsToolbarReady": 0
+            }],
+        "availableWorkspaces": [{
+                "onAvailableWorkspacesChange": 0
+            }],
+        "activeWorkspace": [{
+                "onActiveWorkspaceChange": 0
+            }],
+        "customFonts": [{
+                "onCustomFontsChange": 0
+            }],
+        "moreMenuItems": [{
+                "onMoreMenuItemsChange": 0
+            }],
+        "syncConfig": [{
+                "onSyncConfigChange": 0
+            }],
+        "loginConfig": [{
+                "onLoginConfigChange": 0
+            }],
+        "user": [{
+                "onUserChange": 0
+            }],
+        "activeWorkspaceId": [{
+                "onActiveWorkspaceIdChange": 0
+            }],
+        "theme": [{
+                "onCurrentThemeChange": 0
+            }],
+        "themes": [{
+                "onThemesChange": 0
+            }],
+        "locale": [{
+                "onLocaleChange": 0
+            }],
+        "locales": [{
+                "onLocalesChange": 0
+            }]
+    }; }
+    static get style() { return kritzelEditorCss(); }
+}, [512, "kritzel-editor", {
+        "scaleMax": [1026, "scale-max"],
+        "scaleMin": [1026, "scale-min"],
+        "lockDrawingScale": [1028, "lock-drawing-scale"],
+        "viewportBoundaryLeft": [1026, "viewport-boundary-left"],
+        "viewportBoundaryRight": [1026, "viewport-boundary-right"],
+        "viewportBoundaryTop": [1026, "viewport-boundary-top"],
+        "viewportBoundaryBottom": [1026, "viewport-boundary-bottom"],
+        "debugInfo": [1040],
+        "user": [16],
+        "activeUsers": [16],
+        "toolbarItems": [16],
+        "globalContextMenuItems": [16],
+        "objectContextMenuItems": [16],
+        "moreMenuItems": [16],
+        "themes": [16],
+        "theme": [1025],
+        "licenseKey": [1, "license-key"],
+        "locale": [1025],
+        "locales": [16],
+        "fallbackLocale": [1, "fallback-locale"],
+        "customSvgIcons": [16],
+        "customFonts": [16],
+        "isPanningEnabled": [1028, "is-panning-enabled"],
+        "isZoomingEnabled": [1028, "is-zooming-enabled"],
+        "isToolbarVisible": [4, "is-toolbar-visible"],
+        "isUtilityPanelVisible": [4, "is-utility-panel-visible"],
+        "isWorkspaceManagerVisible": [4, "is-workspace-manager-visible"],
+        "isMoreMenuVisible": [4, "is-more-menu-visible"],
+        "isZoomPanelVisible": [4, "is-zoom-panel-visible"],
+        "syncConfig": [16],
+        "assetStorageConfig": [16],
+        "cursorTarget": [16],
+        "loginConfig": [16],
+        "editorId": [1, "editor-id"],
+        "activeWorkspaceId": [1, "active-workspace-id"],
+        "workspaces": [16],
+        "isEngineReady": [32],
+        "isToolbarReady": [32],
+        "isWorkspaceManagerReady": [32],
+        "availableWorkspaces": [32],
+        "activeWorkspace": [32],
+        "isVirtualKeyboardOpen": [32],
+        "undoState": [32],
+        "isBackToContentButtonVisible": [32],
+        "resolvedTerms": [32],
+        "availableLocaleOptions": [32],
+        "currentZoomPercent": [32],
+        "shortcuts": [32],
+        "currentIsPublic": [32],
+        "isEditorVisible": [32],
+        "activeNotification": [32],
+        "isNotificationDismissing": [32],
+        "contextMenuState": [32],
+        "resolvedMoreMenuItems": [32],
+        "isLoadingOverlayVisible": [32],
+        "getObjectById": [64],
+        "addObject": [64],
+        "addObjects": [64],
+        "updateObject": [64],
+        "removeObject": [64],
+        "removeObjects": [64],
+        "getSelectedObjects": [64],
+        "selectObjects": [64],
+        "selectAllObjectsInViewport": [64],
+        "clearSelection": [64],
+        "centerObjectInViewport": [64],
+        "panToObject": [64],
+        "backToContent": [64],
+        "centerAllObjects": [64],
+        "centerObjects": [64],
+        "setViewport": [64],
+        "panTo": [64],
+        "zoomTo": [64],
+        "zoomIn": [64],
+        "zoomOut": [64],
+        "getViewport": [64],
+        "screenToWorld": [64],
+        "worldToScreen": [64],
+        "setActiveWorkspace": [64],
+        "createWorkspace": [64],
+        "updateWorkspace": [64],
+        "deleteWorkspace": [64],
+        "getWorkspaces": [64],
+        "getActiveWorkspace": [64],
+        "loadSharedWorkspace": [64],
+        "reinitSync": [64],
+        "registerTool": [64],
+        "changeActiveTool": [64],
+        "disable": [64],
+        "enable": [64],
+        "copy": [64],
+        "cut": [64],
+        "paste": [64],
+        "delete": [64],
+        "bringForward": [64],
+        "sendBackward": [64],
+        "bringToFront": [64],
+        "sendToBack": [64],
+        "alignObjects": [64],
+        "group": [64],
+        "ungroup": [64],
+        "undo": [64],
+        "redo": [64],
+        "getScreenshot": [64],
+        "exportViewportAsPng": [64],
+        "exportViewportAsSvg": [64],
+        "getSelectedObjectSupportedExportFormats": [64],
+        "canExportSelectedObjectAs": [64],
+        "exportSelectedObject": [64],
+        "exportAsJson": [64],
+        "importFromJson": [64],
+        "downloadAsJson": [64],
+        "importFromFile": [64],
+        "loadObjectsFromJson": [64],
+        "getObjectsTotalCount": [64],
+        "getAllObjects": [64],
+        "findObjects": [64],
+        "getObjectsInViewport": [64],
+        "hideContextMenu": [64],
+        "openContextMenu": [64],
+        "openWorkspaceManagerMenu": [64],
+        "closeWorkspaceManagerMenu": [64],
+        "openMoreMenu": [64],
+        "closeMoreMenu": [64],
+        "openUserDialog": [64],
+        "closeUserDialog": [64],
+        "openExportDialog": [64],
+        "closeExportDialog": [64],
+        "openImportDialog": [64],
+        "closeImportDialog": [64],
+        "openSettingsDialog": [64],
+        "closeSettingsDialog": [64],
+        "openShareDialog": [64],
+        "closeShareDialog": [64],
+        "triggerSelectionChange": [64],
+        "beginSceneBootstrap": [64],
+        "endSceneBootstrap": [64],
+        "getDisplayableShortcuts": [64],
+        "openLoginDialog": [64],
+        "closeLoginDialog": [64],
+        "setLoginLoading": [64],
+        "setLocale": [64],
+        "getLocale": [64],
+        "getAvailableLocales": [64],
+        "registerLocales": [64],
+        "registerFonts": [64],
+        "t": [64],
+        "triggerNotification": [64]
+    }, [[0, "dblclick", "onTouchStart"]], {
+        "isEngineReady": [{
+                "onIsEngineReady": 0
+            }],
+        "isToolbarReady": [{
+                "onIsToolbarReady": 0
+            }],
+        "availableWorkspaces": [{
+                "onAvailableWorkspacesChange": 0
+            }],
+        "activeWorkspace": [{
+                "onActiveWorkspaceChange": 0
+            }],
+        "customFonts": [{
+                "onCustomFontsChange": 0
+            }],
+        "moreMenuItems": [{
+                "onMoreMenuItemsChange": 0
+            }],
+        "syncConfig": [{
+                "onSyncConfigChange": 0
+            }],
+        "loginConfig": [{
+                "onLoginConfigChange": 0
+            }],
+        "user": [{
+                "onUserChange": 0
+            }],
+        "activeWorkspaceId": [{
+                "onActiveWorkspaceIdChange": 0
+            }],
+        "theme": [{
+                "onCurrentThemeChange": 0
+            }],
+        "themes": [{
+                "onThemesChange": 0
+            }],
+        "locale": [{
+                "onLocaleChange": 0
+            }],
+        "locales": [{
+                "onLocalesChange": 0
+            }]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["kritzel-editor", "kritzel-active-users", "kritzel-avatar", "kritzel-awareness-cursors", "kritzel-back-to-content", "kritzel-button", "kritzel-color", "kritzel-color-palette", "kritzel-context-menu", "kritzel-current-user", "kritzel-current-user-dialog", "kritzel-cursor-trail", "kritzel-dialog", "kritzel-dropdown", "kritzel-engine", "kritzel-export", "kritzel-font", "kritzel-font-family", "kritzel-font-size", "kritzel-icon", "kritzel-input", "kritzel-line-endings", "kritzel-loading-overlay", "kritzel-login-dialog", "kritzel-master-detail", "kritzel-menu", "kritzel-menu-item", "kritzel-more-menu", "kritzel-notification-card", "kritzel-numeric-input", "kritzel-opacity-slider", "kritzel-pill-tabs", "kritzel-portal", "kritzel-settings", "kritzel-shape-fill", "kritzel-share-dialog", "kritzel-slide-toggle", "kritzel-split-button", "kritzel-stroke-size", "kritzel-tool-config", "kritzel-toolbar", "kritzel-tooltip", "kritzel-utility-panel", "kritzel-watermark", "kritzel-workspace-manager", "kritzel-zoom-panel"];
+    components.forEach(tagName => { switch (tagName) {
+        case "kritzel-editor":
+            if (!customElements.get(transformTag(tagName))) {
+                customElements.define(transformTag(tagName), KritzelEditor$1);
+            }
+            break;
+        case "kritzel-active-users":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$K();
+            }
+            break;
+        case "kritzel-avatar":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$J();
+            }
+            break;
+        case "kritzel-awareness-cursors":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$I();
+            }
+            break;
+        case "kritzel-back-to-content":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$H();
+            }
+            break;
+        case "kritzel-button":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$G();
+            }
+            break;
+        case "kritzel-color":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$F();
+            }
+            break;
+        case "kritzel-color-palette":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$E();
+            }
+            break;
+        case "kritzel-context-menu":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$D();
+            }
+            break;
+        case "kritzel-current-user":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$C();
+            }
+            break;
+        case "kritzel-current-user-dialog":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$B();
+            }
+            break;
+        case "kritzel-cursor-trail":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$A();
+            }
+            break;
+        case "kritzel-dialog":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$z();
+            }
+            break;
+        case "kritzel-dropdown":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$y();
+            }
+            break;
+        case "kritzel-engine":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$x();
+            }
+            break;
+        case "kritzel-export":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$w();
+            }
+            break;
+        case "kritzel-font":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$v();
+            }
+            break;
+        case "kritzel-font-family":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$u();
+            }
+            break;
+        case "kritzel-font-size":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$t();
+            }
+            break;
+        case "kritzel-icon":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$s();
+            }
+            break;
+        case "kritzel-input":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$r();
+            }
+            break;
+        case "kritzel-line-endings":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$q();
+            }
+            break;
+        case "kritzel-loading-overlay":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$p();
+            }
+            break;
+        case "kritzel-login-dialog":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$o();
+            }
+            break;
+        case "kritzel-master-detail":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$n();
+            }
+            break;
+        case "kritzel-menu":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$m();
+            }
+            break;
+        case "kritzel-menu-item":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$l();
+            }
+            break;
+        case "kritzel-more-menu":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$k();
+            }
+            break;
+        case "kritzel-notification-card":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$j();
+            }
+            break;
+        case "kritzel-numeric-input":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$i();
+            }
+            break;
+        case "kritzel-opacity-slider":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$h();
+            }
+            break;
+        case "kritzel-pill-tabs":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$g();
+            }
+            break;
+        case "kritzel-portal":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$f();
+            }
+            break;
+        case "kritzel-settings":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$e();
+            }
+            break;
+        case "kritzel-shape-fill":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$d();
+            }
+            break;
+        case "kritzel-share-dialog":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$c();
+            }
+            break;
+        case "kritzel-slide-toggle":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$b();
+            }
+            break;
+        case "kritzel-split-button":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$a();
+            }
+            break;
+        case "kritzel-stroke-size":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$9();
+            }
+            break;
+        case "kritzel-tool-config":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$8();
+            }
+            break;
+        case "kritzel-toolbar":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$7();
+            }
+            break;
+        case "kritzel-tooltip":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$6();
+            }
+            break;
+        case "kritzel-utility-panel":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$5();
+            }
+            break;
+        case "kritzel-watermark":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$4();
+            }
+            break;
+        case "kritzel-workspace-manager":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$3();
+            }
+            break;
+        case "kritzel-zoom-panel":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+
+const KritzelEditor = KritzelEditor$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { KritzelEditor, defineCustomElement };