@kritzel/editor 0.4.31 → 0.4.32

package/dist/components/{p-Cy_cLtOP.js → p-CdwD9F0m.js}

@@ -1,4 +1,4 @@
-import { p as proxyCustomElement, H, h, d as Host, t as transformTag } from './p-5qkOM1RJ.js';
+import { p as proxyCustomElement, H, h, d as Host, t as transformTag } from './p-l1BZ4pYI.js';
 
 var cjs = {};
 
@@ -42,6 +42,19 @@ class ObjectHelper {
     static isClass(object, className) {
         return !!object && object.__class__ === className;
     }
+    static isKritzelEmbeddedObject(object) {
+        if (!object || typeof object !== 'object') {
+            return false;
+        }
+        const candidate = object;
+        return (typeof candidate.isInteractive === 'boolean' &&
+            typeof candidate.isSelected === 'boolean' &&
+            typeof candidate.mount === 'function' &&
+            typeof candidate.unmount === 'function' &&
+            typeof candidate.setIsInteractive === 'function' &&
+            typeof candidate.hasFocusedInputElement === 'function' &&
+            typeof candidate.getEmbeddedContentRoots === 'function');
+    }
     static isKritzelExportable(object) {
         if (!object || typeof object !== 'object') {
             return false;
@@ -1291,6 +1304,7 @@ const lightTheme = {
         dividerColor: '#e0e0e0',
         focusColor: '#333333',
         focusRingColor: '#333333',
+        fontFamily: 'sans-serif',
         iconColor: 'currentColor',
         scrollbarThumbColor: '#ebebeb',
         textPrimary: '#000000',
@@ -1379,7 +1393,6 @@ const lightTheme = {
         closeButtonColor: '#333333',
         closeButtonHoverBackground: 'hsl(0, 0%, 0%, 4.3%)',
         closeButtonHoverColor: '#000000',
-        fontFamily: 'inherit',
         footerBorder: '1px solid #ebebeb',
         headerBorder: '1px solid #ebebeb',
         titleColor: '#000000',
@@ -1414,11 +1427,6 @@ const lightTheme = {
         loadingOverlayColor: '#333333',
         loadingOverlaySpinnerActiveColor: '#333333',
         loadingOverlaySpinnerColor: '#cccccc',
-        syncIndicatorBackground: 'rgba(255, 255, 255, 0.92)',
-        syncIndicatorColor: '#334155',
-        syncIndicatorSpinnerColor: '#007AFF',
-        syncIndicatorSpinnerTrack: 'rgba(148, 163, 184, 0.35)',
-        syncIndicatorZIndex: '10001',
     },
     snap: {
         indicatorFill: 'rgba(59, 130, 246, 0.3)',
@@ -1638,6 +1646,7 @@ const darkTheme = {
         dividerColor: '#3a3a3a',
         focusColor: '#ffffff',
         focusRingColor: '#ffffff',
+        fontFamily: 'sans-serif',
         iconColor: 'currentColor',
         scrollbarThumbColor: '#555555',
         textPrimary: '#ffffff',
@@ -1760,11 +1769,6 @@ const darkTheme = {
         loadingOverlayColor: '#e0e0e0',
         loadingOverlaySpinnerActiveColor: '#e0e0e0',
         loadingOverlaySpinnerColor: '#555555',
-        syncIndicatorBackground: 'rgba(30, 30, 30, 0.95)',
-        syncIndicatorColor: '#e0e0e0',
-        syncIndicatorSpinnerColor: '#0A84FF',
-        syncIndicatorSpinnerTrack: 'rgba(160, 160, 160, 0.3)',
-        syncIndicatorZIndex: '10001',
     },
     snap: {
         indicatorFill: 'rgba(10, 132, 255, 0.35)',
@@ -3141,7 +3145,7 @@ class KritzelLine extends KritzelBaseObject {
     }
 }
 
-const kritzelAwarenessCursorsCss = () => `:host{display:block;position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:1}.awareness-cursor{position:absolute;top:0;left:0;transition:transform var(--kritzel-awareness-cursor-transition-duration, 100ms) ease-out,                opacity 300ms ease;will-change:transform}.awareness-cursor.stale{opacity:0}.awareness-cursor.tracking-object{transition-duration:0ms}.cursor-arrow{filter:drop-shadow(0 1px 2px rgba(0, 0, 0, 0.3))}.cursor-label{position:absolute;left:16px;top:16px;white-space:nowrap;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;font-size:var(--kritzel-awareness-cursor-label-font-size, 12px);color:var(--kritzel-awareness-cursor-label-text-color, #ffffff);padding:2px 8px;border-radius:4px;line-height:1.4;font-weight:500;pointer-events:none;user-select:none}.edge-indicator{position:absolute;top:-12px;left:-12px;width:24px;height:24px;display:flex;align-items:center;justify-content:center;transition:transform var(--kritzel-awareness-cursor-transition-duration, 100ms) ease-out,                opacity 300ms ease;will-change:transform;pointer-events:auto;user-select:none;cursor:pointer}.edge-indicator.stale{opacity:0}.edge-indicator.tracking-object{transition-duration:0ms}.edge-arrow{position:absolute;filter:drop-shadow(0 1px 3px rgba(0, 0, 0, 0.3));transition:opacity 300ms ease}.edge-arrow.stale{opacity:0}.edge-label{position:absolute;white-space:nowrap;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;font-size:var(--kritzel-awareness-cursor-label-font-size, 12px);color:var(--kritzel-awareness-cursor-label-text-color, #ffffff);padding:2px 8px;border-radius:4px;line-height:1.4;font-weight:500;pointer-events:none;opacity:0;transform-origin:center;transition:opacity 150ms ease}.edge-indicator:hover .edge-label{opacity:1}.remote-selection-box{position:absolute;top:0;left:0;border-width:2px;border-style:solid;pointer-events:none;will-change:transform, width, height;transition:transform var(--kritzel-awareness-cursor-transition-duration, 100ms) ease-out,                width var(--kritzel-awareness-cursor-transition-duration, 100ms) ease-out,                height var(--kritzel-awareness-cursor-transition-duration, 100ms) ease-out}`;
+const kritzelAwarenessCursorsCss = () => `:host{display:block;position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:1}.awareness-cursor{position:absolute;top:0;left:0;transition:transform var(--kritzel-awareness-cursor-transition-duration, 100ms) ease-out,               opacity 300ms ease;will-change:transform}.awareness-cursor.stale{opacity:0}.awareness-cursor.tracking-object{transition-duration:0ms}.cursor-arrow{filter:drop-shadow(0 1px 2px rgba(0, 0, 0, 0.3))}.cursor-label{position:absolute;left:16px;top:16px;white-space:nowrap;font-family:var(--kritzel-awareness-font-family, var(--kritzel-global-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif));font-size:var(--kritzel-awareness-cursor-label-font-size, 12px);color:var(--kritzel-awareness-cursor-label-text-color, #ffffff);padding:2px 8px;border-radius:4px;line-height:1.4;font-weight:500;pointer-events:none;user-select:none}.edge-indicator{position:absolute;top:-12px;left:-12px;width:24px;height:24px;display:flex;align-items:center;justify-content:center;transition:transform var(--kritzel-awareness-cursor-transition-duration, 100ms) ease-out,               opacity 300ms ease;will-change:transform;pointer-events:auto;user-select:none;cursor:pointer}.edge-indicator.stale{opacity:0}.edge-indicator.tracking-object{transition-duration:0ms}.edge-arrow{position:absolute;filter:drop-shadow(0 1px 3px rgba(0, 0, 0, 0.3));transition:opacity 300ms ease}.edge-arrow.stale{opacity:0}.edge-label{position:absolute;white-space:nowrap;font-family:var(--kritzel-awareness-font-family, var(--kritzel-global-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif));font-size:var(--kritzel-awareness-cursor-label-font-size, 12px);color:var(--kritzel-awareness-cursor-label-text-color, #ffffff);padding:2px 8px;border-radius:4px;line-height:1.4;font-weight:500;pointer-events:none;opacity:0;transform-origin:center;transition:opacity 150ms ease}.edge-indicator:hover .edge-label{opacity:1}.remote-selection-box{position:absolute;top:0;left:0;border-width:2px;border-style:solid;pointer-events:none;will-change:transform, width, height;transition:transform var(--kritzel-awareness-cursor-transition-duration, 100ms) ease-out,               width var(--kritzel-awareness-cursor-transition-duration, 100ms) ease-out,               height var(--kritzel-awareness-cursor-transition-duration, 100ms) ease-out}`;
 
 const STALE_THRESHOLD_MS = 10_000;
 const REMOVE_THRESHOLD_MS = 30_000;
@@ -3350,7 +3354,7 @@ const KritzelAwarenessCursors = /*@__PURE__*/ proxyCustomElement(class KritzelAw
     }
     render() {
         const cursors = Array.from(this.remoteCursors.values());
-        return (h(Host, { key: 'cf00004efc0c60e81bd6b2f19ecb7ca066396980' }, cursors.map(remoteCursor => {
+        return (h(Host, { key: '2021875ea3e430c04da438dc5b7a2c22f119ea67' }, cursors.map(remoteCursor => {
             if (!remoteCursor.cursor)
                 return null;
             // When a remote user is actively drawing, derive cursor position from

package/dist/components/{p-GbCxpbQ6.js → p-CgCVe3_P.js}

@@ -1,6 +1,6 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-5qkOM1RJ.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-l1BZ4pYI.js';
 import { KritzelColorHelper } from '@kritzel/engine';
-import { d as defineCustomElement$1 } from './p-DVv8ChhE.js';
+import { d as defineCustomElement$1 } from './p-D0lYLWkj.js';
 
 const kritzelColorPaletteCss = () => `:host{display:flex;align-items:flex-start;gap:8px;padding:0;width:100%;box-sizing:border-box}.color-grid{width:100%;display:grid;grid-template-columns:repeat(6, 32px);gap:8px;justify-items:center;overflow:hidden;height:40px;transition:height 0.1s ease-in-out}.color-grid.expanded{height:500px}.color-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:50%;cursor:var(--kritzel-global-pointer-cursor, pointer);border:2px solid transparent;box-sizing:border-box}.color-container:hover{background-color:var(--kritzel-color-palette-hover-background-color, #ebebeb)}.color-container.selected{border-color:var(--kritzel-selection-border-color, #007AFF);background-color:var(--kritzel-color-palette-selected-background-color)}`;
 
@@ -45,7 +45,7 @@ const KritzelColorPalette = /*@__PURE__*/ proxyCustomElement(class KritzelColorP
     render() {
         const displayedColors = this.isExpanded ? this.colors : this.colors.slice(0, 6);
         const expandedHeight = this.isExpanded ? this.calculateHeight() : '32px';
-        return (h(Host, { key: '4d04acd9a67ac1c302bd0ded5fdfe431d0cacf26' }, h("div", { key: 'bb873b67d0e4f05353af87e1518df9525d20a28b', class: {
+        return (h(Host, { key: 'cfdd5136f512aed23198d4a55c628ccd675f08c9' }, h("div", { key: 'bb5445f68b9d17268c6def7cfc4a2dd1fb971c53', class: {
                 'color-grid': true,
                 'expanded': this.isExpanded,
             }, style: {