@kritzel/engine 0.4.31

package/dist/collection/helpers/theme.helper.js

@@ -0,0 +1,77 @@
+export class ThemeHelper {
+    static appliedVariableNames = new WeakMap();
+    /**
+     * Converts a camelCase string to kebab-case.
+     * @example ThemeHelper.camelToKebab('controlHoverBackgroundColor') → 'control-hover-background-color'
+     * @example ThemeHelper.camelToKebab('backgroundColor') → 'background-color'
+     * @example ThemeHelper.camelToKebab('gap') → 'gap'
+     */
+    static camelToKebab(str) {
+        return str.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
+    }
+    /**
+     * Recursively flattens a theme object into a map of CSS variable names to values.
+     * Skips the 'name' property at the root level since it's the theme identifier, not a CSS value.
+     *
+     * @param theme - The theme object to flatten
+     * @param prefix - The CSS variable prefix (default: '--kritzel')
+     * @returns A Map of CSS variable names to their values
+     *
+     * @example
+     * ThemeHelper.flattenThemeToVariables(lightTheme)
+     * // Returns Map {
+     * //   '--kritzel-global-pointer-cursor' => 'pointer',
+    * //   '--kritzel-toolbar-gap' => '8px',
+     * //   ...
+     * // }
+     */
+    static flattenThemeToVariables(theme, prefix = '--kritzel') {
+        const variables = new Map();
+        const recurse = (obj, currentPrefix, isRoot = false) => {
+            for (const [key, value] of Object.entries(obj)) {
+                // Skip the 'name' property at the root level
+                if (isRoot && key === 'name') {
+                    continue;
+                }
+                const kebabKey = ThemeHelper.camelToKebab(key);
+                const variableName = `${currentPrefix}-${kebabKey}`;
+                if (typeof value === 'object' && value !== null) {
+                    recurse(value, variableName);
+                }
+                else if (typeof value === 'string') {
+                    variables.set(variableName, value);
+                }
+            }
+        };
+        recurse(theme, prefix, true);
+        return variables;
+    }
+    /**
+     * Applies a map of CSS variables to an HTML element.
+     *
+     * @param element - The target HTML element
+     * @param variables - A Map of CSS variable names to values
+     */
+    static applyVariablesToElement(element, variables) {
+        for (const [name, value] of variables) {
+            element.style.setProperty(name, value);
+        }
+    }
+    /**
+     * Convenience method that flattens a theme and applies it to an element in one call.
+     *
+     * @param element - The target HTML element
+     * @param theme - The theme object to apply
+     */
+    static applyThemeToElement(element, theme) {
+        const variables = ThemeHelper.flattenThemeToVariables(theme);
+        const previousVariableNames = ThemeHelper.appliedVariableNames.get(element);
+        for (const name of previousVariableNames ?? []) {
+            if (!variables.has(name)) {
+                element.style.removeProperty(name);
+            }
+        }
+        ThemeHelper.applyVariablesToElement(element, variables);
+        ThemeHelper.appliedVariableNames.set(element, new Set(variables.keys()));
+    }
+}

package/dist/collection/helpers/tool-config.helper.js

@@ -0,0 +1,63 @@
+export class KritzelToolConfigHelper {
+    static getToolConfig(tool) {
+        switch (tool?.toolType) {
+            case 'selection':
+                return 'getToolConfig' in tool && typeof tool.getToolConfig === 'function'
+                    ? tool.getToolConfig()
+                    : null;
+            case 'brush':
+                return {
+                    type: 'brush',
+                    colorProperty: 'color',
+                    sizeProperty: 'size',
+                    opacityProperty: 'opacity',
+                    paletteSource: 'palette',
+                    sizesSource: 'sizes',
+                    controls: [
+                        { type: 'stroke-size', propertyName: 'size' },
+                    ],
+                };
+            case 'line':
+                return {
+                    type: 'line',
+                    colorProperty: 'color',
+                    sizeProperty: 'size',
+                    opacityProperty: 'opacity',
+                    paletteSource: 'palette',
+                    sizesSource: 'sizes',
+                    controls: [
+                        { type: 'stroke-size', propertyName: 'size' },
+                        { type: 'line-endings', propertyName: 'arrows', additionalProps: {} },
+                    ],
+                };
+            case 'shape':
+                return {
+                    type: 'shape',
+                    colorProperty: 'strokeColor',
+                    sizeProperty: 'strokeWidth',
+                    opacityProperty: 'opacity',
+                    paletteSource: 'palette',
+                    sizesSource: 'sizes',
+                    controls: [
+                        { type: 'stroke-size', propertyName: 'strokeWidth' },
+                        { type: 'shape-fill', propertyName: 'fillColor', additionalProps: {} },
+                    ],
+                };
+            case 'text':
+                return {
+                    type: 'text',
+                    colorProperty: 'fontColor',
+                    sizeProperty: 'fontSize',
+                    opacityProperty: 'opacity',
+                    paletteSource: 'palette',
+                    sizesSource: 'sizes',
+                    controls: [
+                        { type: 'font-size', propertyName: 'fontSize', additionalProps: {} },
+                        { type: 'font-family', propertyName: 'fontFamily' },
+                    ],
+                };
+            default:
+                return null;
+        }
+    }
+}

package/dist/collection/helpers/wheel.helper.js

@@ -0,0 +1,113 @@
+export class KritzelWheelHelper {
+    static shouldKeepWheelInDynamicObject(ev, dynamicObject) {
+        // Keep Ctrl+wheel available for viewport zoom gestures.
+        if (ev.ctrlKey || dynamicObject.isSelected !== true) {
+            return false;
+        }
+        const path = typeof ev.composedPath === 'function' ? ev.composedPath() : [];
+        const scrollContainer = this.getScrollableContainerFromEventPath(path, dynamicObject);
+        // No scroll container found inside the dynamic object: let the wheel
+        // event pass through so the viewport can continue handling it.
+        if (!scrollContainer) {
+            return false;
+        }
+        return this.canElementConsumeWheel(scrollContainer, ev.deltaX, ev.deltaY);
+    }
+    static getScrollableContainerFromEventPath(path, dynamicObject) {
+        const potentialRoots = [];
+        if (dynamicObject.element instanceof HTMLElement) {
+            potentialRoots.push(dynamicObject.element);
+        }
+        if (dynamicObject.elementRef instanceof HTMLElement) {
+            potentialRoots.push(dynamicObject.elementRef);
+        }
+        const legacyElementRef = dynamicObject.elmeentRef;
+        if (legacyElementRef instanceof HTMLElement) {
+            potentialRoots.push(legacyElementRef);
+        }
+        for (const root of potentialRoots) {
+            const rootIndex = path.findIndex(entry => entry === root);
+            if (rootIndex === -1) {
+                continue;
+            }
+            for (const entry of path.slice(0, rootIndex + 1)) {
+                if (!(entry instanceof HTMLElement)) {
+                    continue;
+                }
+                if (this.isScrollableElement(entry)) {
+                    return entry;
+                }
+            }
+        }
+        // Fallback for synthetic/custom wheel events where composedPath is absent
+        // or does not include the dynamic-object subtree.
+        for (const root of potentialRoots) {
+            if (this.isScrollableElement(root)) {
+                return root;
+            }
+            const firstChild = root.firstElementChild;
+            if (firstChild instanceof HTMLElement && this.isScrollableElement(firstChild)) {
+                return firstChild;
+            }
+        }
+        return null;
+    }
+    static isScrollableElement(element) {
+        const canScrollVertically = element.scrollHeight - element.clientHeight > 0;
+        const canScrollHorizontally = element.scrollWidth - element.clientWidth > 0;
+        if (!canScrollVertically && !canScrollHorizontally) {
+            return false;
+        }
+        const computedStyle = window.getComputedStyle(element);
+        const overflowX = computedStyle.overflowX;
+        const overflowY = computedStyle.overflowY;
+        const allowsVerticalScroll = overflowY !== 'visible' && overflowY !== 'clip';
+        const allowsHorizontalScroll = overflowX !== 'visible' && overflowX !== 'clip';
+        return (canScrollVertically && allowsVerticalScroll) || (canScrollHorizontally && allowsHorizontalScroll);
+    }
+    static canElementConsumeWheel(element, deltaX, deltaY) {
+        const canConsumeVertical = this.canElementConsumeVerticalWheel(element, deltaY);
+        const canConsumeHorizontal = this.canElementConsumeHorizontalWheel(element, deltaX);
+        // Keep wheel events inside the dynamic object whenever at least one
+        // requested axis can still be consumed by its scroll container.
+        return canConsumeVertical || canConsumeHorizontal;
+    }
+    static canElementConsumeVerticalWheel(element, deltaY) {
+        if (deltaY === 0) {
+            return false;
+        }
+        const maxScrollTop = Math.max(0, element.scrollHeight - element.clientHeight);
+        if (maxScrollTop === 0) {
+            return false;
+        }
+        const epsilon = 1;
+        const scrollingDown = deltaY > 0;
+        const scrollingUp = deltaY < 0;
+        if (scrollingDown) {
+            return element.scrollTop < maxScrollTop - epsilon;
+        }
+        if (scrollingUp) {
+            return element.scrollTop > epsilon;
+        }
+        return false;
+    }
+    static canElementConsumeHorizontalWheel(element, deltaX) {
+        if (deltaX === 0) {
+            return false;
+        }
+        const maxScrollLeft = Math.max(0, element.scrollWidth - element.clientWidth);
+        if (maxScrollLeft === 0) {
+            return false;
+        }
+        const epsilon = 1;
+        const scrollingRight = deltaX > 0;
+        const scrollingLeft = deltaX < 0;
+        if (scrollingRight) {
+            return element.scrollLeft < maxScrollLeft - epsilon;
+        }
+        if (scrollingLeft) {
+            return element.scrollLeft > epsilon;
+        }
+        return false;
+    }
+}

package/dist/collection/index.js

@@ -0,0 +1,107 @@
+/**
+ * @fileoverview entry point for your component library
+ *
+ * This is the entry point for your component library. Use this file to export utilities,
+ * constants or data structure that accompany your components.
+ *
+ * DO NOT use this file to export your components. Instead, use the recommended approaches
+ * to consume components of this package as outlined in the `README.md`.
+ */
+export * from './classes/objects/base-object.class';
+export * from './classes/objects/text.class';
+export * from './classes/objects/path.class';
+export * from './classes/objects/image.class';
+export * from './classes/objects/line.class';
+export * from './classes/objects/group.class';
+export * from './classes/objects/shape.class';
+export * from './classes/objects/dynamic-object.class';
+export * from './classes/objects/selection-group.class';
+export * from './classes/objects/selection-box.class';
+export * from './classes/tools/base-tool.class';
+export * from './classes/tools/brush-tool.class';
+export * from './classes/tools/line-tool.class';
+export * from './classes/tools/eraser-tool.class';
+export * from './classes/tools/image-tool.class';
+export * from './classes/tools/text-tool.class';
+export * from './classes/tools/shape-tool.class';
+export * from './helpers/cursor.helper';
+export * from './helpers/keyboard.helper';
+export * from './helpers/devices.helper';
+export * from './helpers/theme.helper';
+export * from './helpers/object.helper';
+export * from './helpers/color.helper';
+export * from './helpers/html.helper';
+export * from './helpers/tool-config.helper';
+export * from './classes/tools/selection-tool.class';
+export * from './classes/providers/sync/broadcast-sync-provider.class';
+export * from './classes/providers/sync/in-memory-sync-provider.class';
+export * from './classes/providers/sync/indexeddb-sync-provider.class';
+export * from './classes/providers/sync/websocket-sync-provider.class';
+export * from './classes/providers/sync/hocuspocus-sync-provider.class';
+export * from './classes/providers/assets/asset-resolver.class';
+export * from './classes/providers/assets/indexeddb-asset-provider.class';
+export * from './classes/providers/assets/http-asset-provider.class';
+export * from './classes/providers/assets/presigned-asset-provider.class';
+export * from './classes/core/workspace.class';
+export * from './classes/managers/anchor.manager';
+export * from './classes/managers/theme.manager';
+export * from './classes/managers/localization.manager';
+export * from './classes/managers/license.manager';
+export * from './classes/registries/dynamic-object-renderer.registry';
+export * from './classes/registries/font-registry.class';
+export * from './classes/registries/icon-registry.class';
+export * from './interfaces/toolbar-item.interface';
+export * from './interfaces/menu-item.interface';
+export * from './interfaces/object-export.interface';
+export * from './interfaces/object-change-event.interface';
+export * from './interfaces/dynamic-object-renderer.interface';
+export * from './interfaces/sync-provider.interface';
+export * from './interfaces/sync-config.interface';
+export * from './interfaces/asset.interface';
+export * from './interfaces/asset-provider.interface';
+export * from './interfaces/asset-storage-config.interface';
+export * from './interfaces/login-config.interface';
+export * from './interfaces/document-metadata.interface';
+export * from './interfaces/anchor.interface';
+export * from './interfaces/viewport-state.interface';
+export * from './interfaces/context-menu-state.interface';
+export * from './interfaces/user.interface';
+export * from './interfaces/theme.interface';
+export * from './interfaces/localization.interface';
+export * from './interfaces/shortcut.interface';
+export * from './interfaces/share.interface';
+export * from './interfaces/engine-state.interface';
+export * from './interfaces/debug-info.interface';
+export * from './interfaces/bounding-box.interface';
+export * from './interfaces/polygon.interface';
+export * from './interfaces/font.interface';
+export * from './interfaces/settings.interface';
+export * from './interfaces/dialog.interface';
+export * from './interfaces/master-detail.interface';
+export * from './interfaces/tool-config.interface';
+export * from './interfaces/arrow-head.interface';
+export * from './events/active-workspace-change.event';
+export * from './events/editor-is-ready.event';
+export * from './events/login.event';
+export * from './configs/default-brush-tool.config';
+export * from './configs/default-text-tool.config';
+export * from './configs/default-line-tool.config';
+export * from './configs/default-shape-tool.config';
+export * from './configs/default-asset-storage.config';
+export * from './configs/default-sync.config';
+export * from './themes/light-theme';
+export * from './themes/dark-theme';
+export * from './locales/en-locale';
+export * from './locales/de-locale';
+export * from './locales/fr-locale';
+export * from './enums/alignment.enum';
+export * from './enums/shape-type.enum';
+export * from './interfaces/migration.interface';
+export * from './helpers/migration.helper';
+export * from './migrations/app-state.migrations';
+export * from './migrations/workspace.migrations';
+export * from './constants/schema.constants';
+export * from './constants/color-palette.constants';
+export * from './constants/text-tool-fonts.constants';
+export * from './constants/engine.constants';
+export * from './constants/version';

package/dist/collection/interfaces/anchor.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/arrow-head.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/asset-provider.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/asset-storage-config.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/asset.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/bounding-box.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/clonable.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/context-menu-item.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/context-menu-state.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/debug-info.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/dialog.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/document-metadata.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/dynamic-object-renderer.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/engine-state.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/font.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/localization.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/login-config.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/master-detail.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/menu-item.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/migration.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/notification.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/object-change-event.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/object-export.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/object.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/paste-intent-provider.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/point.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/polygon.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/remote-cursor.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/selection-state.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/serializable.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/settings.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/share.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/shortcut.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/sync-config.interface.js

@@ -0,0 +1,21 @@
+/**
+ * Returns the provider type (`'local'` or `'network'`) for a given provider config entry.
+ * Works for both class constructors (via a static `type` property) and
+ * factory objects (via an optional `type` property on the factory).
+ */
+function getProviderConfigType(config) {
+    if (typeof config === 'function') {
+        return config.type;
+    }
+    return config.type;
+}
+/**
+ * Returns `true` when the given sync configuration contains at least one remote
+ * (network) provider, meaning the share option should be available in the UI.
+ */
+export function hasRemoteSyncProvider(syncConfig) {
+    if (!syncConfig?.providers?.length) {
+        return false;
+    }
+    return syncConfig.providers.some(p => getProviderConfigType(p) === 'network');
+}

package/dist/collection/interfaces/sync-provider.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/theme.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/tool-config.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/tool-type.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/tool.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/toolbar-item.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/undo-state.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/user.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/interfaces/viewport-state.interface.js

@@ -0,0 +1 @@
+export {};