@syntrologie/adapt-content 2.8.0-canary.93 → 2.8.0-canary.95

package/node_modules/@syntrologie/shared-editor-ui/dist/components/AnchorPickerLit.d.ts

@@ -54,9 +54,17 @@ export declare class AnchorPickerLit extends LitElement {
     updated(changed: Map<string, unknown>): void;
     private _attachDocumentListeners;
     private _detachDocumentListeners;
+    /**
+     * Resolve the shadow host this picker lives inside, if any. When the picker
+     * is mounted inside a shadow root (e.g. the editor SDK mounts inside
+     * `<smart-canvas>`'s shadow), `document.elementFromPoint` returns the shadow
+     * *host*, not the host page element beneath. Temporarily disabling pointer
+     * events on the host lets hit-testing fall through to the host page.
+     */
+    private _getShadowHost;
     private _handleMouseMove;
     private _handleClick;
     private _handleKeyDown;
-    render(): import("lit-html").TemplateResult<1> | typeof nothing;
+    render(): typeof nothing | import("lit-html").TemplateResult<1>;
 }
 //# sourceMappingURL=AnchorPickerLit.d.ts.map

package/node_modules/@syntrologie/shared-editor-ui/dist/components/AnchorPickerLit.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AnchorPickerLit.d.ts","sourceRoot":"","sources":["../../src/components/AnchorPickerLit.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAEH,OAAO,EAAQ,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAahD,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;CACrB;AAgBD,qBAAa,eAAgB,SAAQ,UAAU;IAC7C,OAAgB,UAAU;;;;;;;;;;;;;;;;;;;MAOxB;IAEF,QAAQ,UAAS;IACjB,iBAAiB,UAAS;IAC1B,eAAe,EAAE,MAAM,CAA4B;IAGnD,OAAO,CAAC,eAAe,CAAwB;IAC/C,OAAO,CAAC,gBAAgB,CAAM;IAG9B,OAAO,CAAC,UAAU,CAA+B;IAIxC,gBAAgB;IAIhB,iBAAiB,IAAI,IAAI;IAOzB,oBAAoB,IAAI,IAAI;IAK5B,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAiBrD,OAAO,CAAC,wBAAwB;IAQhC,OAAO,CAAC,wBAAwB;IAQhC,OAAO,CAAC,gBAAgB,CAoCtB;IAEF,OAAO,CAAC,YAAY,CAwBlB;IAEF,OAAO,CAAC,cAAc,CAUpB;IAIO,MAAM;CA0GhB"}
+{"version":3,"file":"AnchorPickerLit.d.ts","sourceRoot":"","sources":["../../src/components/AnchorPickerLit.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAEH,OAAO,EAAQ,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAahD,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;CACrB;AAgBD,qBAAa,eAAgB,SAAQ,UAAU;IAC7C,OAAgB,UAAU;;;;;;;;;;;;;;;;;;;MAOxB;IAEF,QAAQ,UAAS;IACjB,iBAAiB,UAAS;IAC1B,eAAe,EAAE,MAAM,CAA4B;IAGnD,OAAO,CAAC,eAAe,CAAwB;IAC/C,OAAO,CAAC,gBAAgB,CAAM;IAG9B,OAAO,CAAC,UAAU,CAA+B;IAIxC,gBAAgB;IAIhB,iBAAiB,IAAI,IAAI;IAOzB,oBAAoB,IAAI,IAAI;IAK5B,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAiBrD,OAAO,CAAC,wBAAwB;IAQhC,OAAO,CAAC,wBAAwB;IAQhC;;;;;;OAMG;IACH,OAAO,CAAC,cAAc;IAMtB,OAAO,CAAC,gBAAgB,CA+CtB;IAEF,OAAO,CAAC,YAAY,CAwBlB;IAEF,OAAO,CAAC,cAAc,CAUpB;IAIO,MAAM;CA0GhB"}

package/node_modules/@syntrologie/shared-editor-ui/dist/components/AnchorPickerLit.js

@@ -38,16 +38,28 @@ export class AnchorPickerLit extends LitElement {
         this._hoveredSelector = '';
         // DOM ref for the overlay
         this._overlayEl = null;
-        // ---- EVENT HANDLERS ----
         this._handleMouseMove = (e) => {
             const overlay = this._overlayEl;
+            const shadowHost = this._getShadowHost();
             // In passthrough mode the overlay is already pointerEvents:'none',
             // so elementFromPoint can see through it -- no toggle needed.
             // In non-passthrough mode, temporarily disable to detect elements underneath.
             if (overlay && !this.passthroughClicks) {
                 overlay.style.pointerEvents = 'none';
             }
+            // If we're inside a shadow root, temporarily hide the host so
+            // elementFromPoint can reach the host page underneath. `pointer-events`
+            // doesn't work here because any fixed-position descendant inside the
+            // shadow tree with pointer-events:auto (e.g. a canvas overlay) causes
+            // elementFromPoint to return the shadow host regardless of what the
+            // host's own pointer-events is. `visibility:hidden` removes the entire
+            // subtree from hit-testing without triggering layout reflow.
+            const prevHostVis = shadowHost?.style.visibility;
+            if (shadowHost)
+                shadowHost.style.visibility = 'hidden';
             const elementAtPoint = document.elementFromPoint(e.clientX, e.clientY);
+            if (shadowHost)
+                shadowHost.style.visibility = prevHostVis ?? '';
             if (overlay && !this.passthroughClicks) {
                 overlay.style.pointerEvents = 'auto';
             }
@@ -141,6 +153,20 @@ export class AnchorPickerLit extends LitElement {
         document.removeEventListener('click', this._handleClick, true);
         document.removeEventListener('keydown', this._handleKeyDown, true);
     }
+    // ---- EVENT HANDLERS ----
+    /**
+     * Resolve the shadow host this picker lives inside, if any. When the picker
+     * is mounted inside a shadow root (e.g. the editor SDK mounts inside
+     * `<smart-canvas>`'s shadow), `document.elementFromPoint` returns the shadow
+     * *host*, not the host page element beneath. Temporarily disabling pointer
+     * events on the host lets hit-testing fall through to the host page.
+     */
+    _getShadowHost() {
+        const root = this.getRootNode();
+        if (root instanceof ShadowRoot)
+            return root.host;
+        return null;
+    }
     // ---- RENDER ----
     render() {
         if (!this.isActive)

package/node_modules/@syntrologie/shared-editor-ui/dist/components/EditorPanelShell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EditorPanelShell.d.ts","sourceRoot":"","sources":["../../src/components/EditorPanelShell.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,MAAM,WAAW,qBAAqB;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,6EAA6E;IAC7E,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,gFAAgF;IAChF,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,+EAA+E;IAC/E,YAAY,CAAC,EAAE,WAAW,CAAC;IAC3B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AA8MD,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EACN,QAAQ,EACR,OAAO,EACP,MAAmB,EACnB,QAAQ,GACT,EAAE,qBAAqB,2CAySvB"}
+{"version":3,"file":"EditorPanelShell.d.ts","sourceRoot":"","sources":["../../src/components/EditorPanelShell.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAGH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,MAAM,WAAW,qBAAqB;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,6EAA6E;IAC7E,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,gFAAgF;IAChF,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,+EAA+E;IAC/E,YAAY,CAAC,EAAE,WAAW,CAAC;IAC3B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AA8MD,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EACN,QAAQ,EACR,OAAO,EACP,MAAmB,EACnB,QAAQ,GACT,EAAE,qBAAqB,2CAwSvB"}

package/node_modules/@syntrologie/shared-editor-ui/dist/components/EditorPanelShell.js

@@ -1,17 +1,28 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * EditorPanelShell — moveable, resizable wrapper for editor sidebars.
+ *
+ * Renders:
+ *  1. A fixed FAB button (Syntrologie logo) at the panel's bottom-left corner.
+ *     Click toggles open/minimized. Drag moves the entire panel.
+ *  2. A resizable panel container with semi-transparent background and backdrop blur.
+ *     Supports docked (left/right edge, full height) and free-floating modes.
+ *     Position, size, and dock state persist in localStorage.
+ */
+import { panelShell } from '@syntro/design-system';
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { cn } from '../cn';
 // =============================================================================
 // Constants
 // =============================================================================
 const STORAGE_KEY = 'syntro:editor-panel';
-const MIN_WIDTH = 480;
-const MIN_HEIGHT = 400;
-const FAB_SIZE = 56;
-const FAB_INSET = 12;
-const SNAP_THRESHOLD = 20;
-const DRAG_THRESHOLD = 5;
-const HANDLE_SIZE = 8;
+const MIN_WIDTH = panelShell.behavior.minWidth;
+const MIN_HEIGHT = panelShell.behavior.minHeight;
+const FAB_SIZE = panelShell.fab.size;
+const FAB_INSET = panelShell.fab.inset;
+const SNAP_THRESHOLD = panelShell.behavior.snapThreshold;
+const DRAG_THRESHOLD = panelShell.behavior.dragThreshold;
+const HANDLE_SIZE = panelShell.behavior.handleSize;
 // =============================================================================
 // Logo
 // =============================================================================
@@ -313,12 +324,14 @@ export function EditorPanelShell({ isOpen, onToggle, panelId, zIndex = 214748364
     const panelStyle = {
         position: 'fixed',
         zIndex,
-        background: 'linear-gradient(160deg, rgba(7,8,10,0.84) 0%, rgba(14,17,20,0.88) 45%, rgba(15,19,24,0.84) 100%)',
+        background: panelShell.background,
+        backdropFilter: `blur(${panelShell.backdropBlur})`,
+        WebkitBackdropFilter: `blur(${panelShell.backdropBlur})`,
         boxShadow: isDocked
             ? geometry.docked === 'right'
-                ? '-20px 0 60px rgba(0,0,0,0.5)'
-                : '20px 0 60px rgba(0,0,0,0.5)'
-            : '0 8px 60px rgba(0,0,0,0.5)',
+                ? panelShell.shadows.dockedRight
+                : panelShell.shadows.dockedLeft
+            : panelShell.shadows.floating,
         // Prevent wheel scroll from chaining to the page behind the panel.
         // overflow-y: auto makes this a scroll container so overscroll-behavior applies.
         overflowY: 'auto',
@@ -350,16 +363,14 @@ export function EditorPanelShell({ isOpen, onToggle, panelId, zIndex = 214748364
         width: FAB_SIZE,
         height: FAB_SIZE,
         borderRadius: '50%',
-        border: '2px solid #b72e2a',
+        border: panelShell.fab.border,
         cursor: 'grab',
         display: 'flex',
         alignItems: 'center',
         justifyContent: 'center',
-        background: '#000000',
-        color: '#ffffff',
-        boxShadow: isOpen
-            ? '0 4px 24px rgba(0,0,0,0.6), 0 0 0 2px rgba(255,255,255,0.08)'
-            : '0 4px 24px rgba(0,0,0,0.6)',
+        background: panelShell.fab.background,
+        color: panelShell.fab.color,
+        boxShadow: isOpen ? panelShell.fab.shadowOpen : panelShell.fab.shadowClosed,
         transition: 'box-shadow 150ms ease',
         touchAction: 'none',
         userSelect: 'none',

package/node_modules/@syntrologie/shared-editor-ui/dist/components/EditorPanelShellLit.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EditorPanelShellLit.d.ts","sourceRoot":"","sources":["../../src/components/EditorPanelShellLit.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAAQ,UAAU,EAAW,MAAM,KAAK,CAAC;AA8OhD,qBAAa,mBAAoB,SAAQ,UAAU;IACjD,OAAgB,UAAU;;;;;;;;;;;;;MAIxB;IAEF,MAAM,UAAS;IACf,OAAO,EAAE,MAAM,GAAG,SAAS,CAAC;IAC5B,MAAM,SAAc;IAGpB,OAAO,CAAC,SAAS,CAAuC;IAGxD,OAAO,CAAC,QAAQ,CAA+B;IAC/C,OAAO,CAAC,MAAM,CAAkC;IAGhD,OAAO,CAAC,WAAW,CAAS;IAC5B,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,WAAW,CAAkB;IACrC,OAAO,CAAC,cAAc,CAAkB;IACxC,OAAO,CAAC,WAAW,CAA8B;IAGjD,OAAO,CAAC,aAAa,CAA0B;IAC/C,OAAO,CAAC,iBAAiB,CAAkB;IAC3C,OAAO,CAAC,eAAe,CAAuC;IAI9D,OAAO,KAAK,WAAW,GAEtB;IAEQ,gBAAgB;IAIhB,iBAAiB,IAAI,IAAI;IAMzB,oBAAoB,IAAI,IAAI;IAK5B,OAAO,IAAI,IAAI;IAQxB,OAAO,CAAC,eAAe;IAMvB,OAAO,CAAC,mBAAmB,CAEzB;IAEF,OAAO,CAAC,WAAW;IAWnB,OAAO,CAAC,qBAAqB;IAa7B,OAAO,CAAC,qBAAqB;IA+B7B,OAAO,CAAC,mBAAmB;IA2B3B,OAAO,CAAC,wBAAwB;IAgBhC,OAAO,CAAC,wBAAwB;IAqChC,OAAO,CAAC,sBAAsB;IAW9B,OAAO,CAAC,gBAAgB;IAaxB,OAAO,CAAC,eAAe;IAwCvB,OAAO,CAAC,aAAa;IA+BZ,MAAM;CAsDhB"}
+{"version":3,"file":"EditorPanelShellLit.d.ts","sourceRoot":"","sources":["../../src/components/EditorPanelShellLit.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAGH,OAAO,EAAQ,UAAU,EAAW,MAAM,KAAK,CAAC;AA8OhD,qBAAa,mBAAoB,SAAQ,UAAU;IACjD,OAAgB,UAAU;;;;;;;;;;;;;MAIxB;IAEF,MAAM,UAAS;IACf,OAAO,EAAE,MAAM,GAAG,SAAS,CAAC;IAC5B,MAAM,SAAc;IAGpB,OAAO,CAAC,SAAS,CAAuC;IAGxD,OAAO,CAAC,QAAQ,CAA+B;IAC/C,OAAO,CAAC,MAAM,CAAkC;IAGhD,OAAO,CAAC,WAAW,CAAS;IAC5B,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,WAAW,CAAkB;IACrC,OAAO,CAAC,cAAc,CAAkB;IACxC,OAAO,CAAC,WAAW,CAA8B;IAGjD,OAAO,CAAC,aAAa,CAA0B;IAC/C,OAAO,CAAC,iBAAiB,CAAkB;IAC3C,OAAO,CAAC,eAAe,CAAuC;IAI9D,OAAO,KAAK,WAAW,GAEtB;IAEQ,gBAAgB;IAIhB,iBAAiB,IAAI,IAAI;IAMzB,oBAAoB,IAAI,IAAI;IAK5B,OAAO,IAAI,IAAI;IAQxB,OAAO,CAAC,eAAe;IAMvB,OAAO,CAAC,mBAAmB,CAEzB;IAEF,OAAO,CAAC,WAAW;IAWnB,OAAO,CAAC,qBAAqB;IAa7B,OAAO,CAAC,qBAAqB;IA+B7B,OAAO,CAAC,mBAAmB;IA2B3B,OAAO,CAAC,wBAAwB;IAgBhC,OAAO,CAAC,wBAAwB;IAqChC,OAAO,CAAC,sBAAsB;IAW9B,OAAO,CAAC,gBAAgB;IAaxB,OAAO,CAAC,eAAe;IAyCvB,OAAO,CAAC,aAAa;IA6BZ,MAAM;CAsDhB"}

package/node_modules/@syntrologie/shared-editor-ui/dist/components/EditorPanelShellLit.js

@@ -14,19 +14,20 @@
  * - localStorage persistence of geometry
  * - Viewport clamping on window resize
  */
+import { panelShell } from '@syntro/design-system';
 import { html, LitElement, nothing } from 'lit';
 import { styleMap } from 'lit/directives/style-map.js';
 // =============================================================================
 // Constants
 // =============================================================================
 const STORAGE_KEY = 'syntro:editor-panel';
-const MIN_WIDTH = 480;
-const MIN_HEIGHT = 400;
-const FAB_SIZE = 56;
-const FAB_INSET = 12;
-const SNAP_THRESHOLD = 20;
-const DRAG_THRESHOLD = 5;
-const HANDLE_SIZE = 8;
+const MIN_WIDTH = panelShell.behavior.minWidth;
+const MIN_HEIGHT = panelShell.behavior.minHeight;
+const FAB_SIZE = panelShell.fab.size;
+const FAB_INSET = panelShell.fab.inset;
+const SNAP_THRESHOLD = panelShell.behavior.snapThreshold;
+const DRAG_THRESHOLD = panelShell.behavior.dragThreshold;
+const HANDLE_SIZE = panelShell.behavior.handleSize;
 // =============================================================================
 // Geometry Helpers
 // =============================================================================
@@ -411,12 +412,14 @@ export class EditorPanelShellLit extends LitElement {
             // Re-enable pointer events — parent editor container uses pointer-events:none
             // so clicks pass through to elements beneath (e.g., the launcher FAB).
             pointerEvents: 'auto',
-            background: 'linear-gradient(160deg, rgba(7,8,10,0.84) 0%, rgba(14,17,20,0.88) 45%, rgba(15,19,24,0.84) 100%)',
+            background: panelShell.background,
+            backdropFilter: `blur(${panelShell.backdropBlur})`,
+            webkitBackdropFilter: `blur(${panelShell.backdropBlur})`,
             boxShadow: isDocked
                 ? geo.docked === 'right'
-                    ? '-20px 0 60px rgba(0,0,0,0.5)'
-                    : '20px 0 60px rgba(0,0,0,0.5)'
-                : '0 8px 60px rgba(0,0,0,0.5)',
+                    ? panelShell.shadows.dockedRight
+                    : panelShell.shadows.dockedLeft
+                : panelShell.shadows.floating,
             overflowY: 'auto',
             overscrollBehavior: 'contain',
         };
@@ -452,16 +455,14 @@ export class EditorPanelShellLit extends LitElement {
             width: `${FAB_SIZE}px`,
             height: `${FAB_SIZE}px`,
             borderRadius: '50%',
-            border: '2px solid #b72e2a',
+            border: panelShell.fab.border,
             cursor: 'grab',
             display: 'flex',
             alignItems: 'center',
             justifyContent: 'center',
-            background: '#000000',
-            color: '#ffffff',
-            boxShadow: this.isOpen
-                ? '0 4px 24px rgba(0,0,0,0.6), 0 0 0 2px rgba(255,255,255,0.08)'
-                : '0 4px 24px rgba(0,0,0,0.6)',
+            background: panelShell.fab.background,
+            color: panelShell.fab.color,
+            boxShadow: this.isOpen ? panelShell.fab.shadowOpen : panelShell.fab.shadowClosed,
             transition: 'box-shadow 150ms ease',
             touchAction: 'none',
             userSelect: 'none',

package/node_modules/@syntrologie/shared-editor-ui/dist/components/ElementHighlightLit.d.ts

@@ -85,6 +85,6 @@ export declare class ElementHighlightLit extends LitElement {
     private _handleClick;
     private _handleKeyDown;
     private _handleRemove;
-    render(): import("lit-html").TemplateResult<1> | typeof nothing;
+    render(): typeof nothing | import("lit-html").TemplateResult<1>;
 }
 //# sourceMappingURL=ElementHighlightLit.d.ts.map

package/node_modules/@syntrologie/shared-editor-ui/dist/controllers/PanelShellController.d.ts

@@ -0,0 +1,110 @@
+/**
+ * PanelShellController — Lit ReactiveController for draggable/resizable panels.
+ *
+ * Owns geometry state (position, size, dock), pointer-event handlers for the
+ * drag FAB and 8 resize handles, localStorage persistence, and viewport
+ * clamping. A consuming LitElement calls `attachFab(el)` / `attachHandle(el, dir)`
+ * on its rendered DOM to hook up pointer events, and reads `panelStyles` /
+ * `fabStyles` to position the panel + FAB.
+ *
+ * Why a controller, not a wrapper element: `<slot>`-based wrapper elements
+ * don't compose well in light DOM (Lit wipes children on render), and shadow
+ * DOM breaks Playwright child selectors used by E2E tests. A ReactiveController
+ * is the Lit-idiomatic way to share stateful logic across elements.
+ *
+ * Emits one callback: `onToggle` when the FAB is pressed without dragging.
+ */
+import type { ReactiveController, ReactiveControllerHost } from 'lit';
+export interface PanelGeometry {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    docked: 'left' | 'right' | null;
+}
+export type ResizeDir = 'n' | 'ne' | 'e' | 'se' | 's' | 'sw' | 'w' | 'nw';
+export interface PanelShellControllerOptions {
+    /** Unique storage key for geometry persistence. */
+    storageKey?: string;
+    /** Minimum width when resizing or undocked. Default 480. */
+    minWidth?: number;
+    /** Minimum height when resizing or undocked. Default 400. */
+    minHeight?: number;
+    /** Pixels the FAB must move before a press is treated as a drag. Default 5. */
+    dragThreshold?: number;
+    /** Edge-snap distance for docking. Default 20. */
+    snapThreshold?: number;
+    /** Size of the FAB in pixels. Default 56. */
+    fabSize?: number;
+    /** Inset of the FAB from the panel's top-left corner. Default 12. */
+    fabInset?: number;
+    /** Default geometry on first load when nothing is in storage. */
+    defaultGeometry?: Partial<PanelGeometry>;
+    /** Called when the FAB is pressed without dragging. */
+    onToggle?: () => void;
+}
+export interface ResizeHandleDef {
+    dir: ResizeDir;
+    style: Record<string, string>;
+    cursor: string;
+}
+export declare function makeResizeHandles(): ResizeHandleDef[];
+export declare class PanelShellController implements ReactiveController {
+    private readonly host;
+    private readonly opts;
+    private _geometry;
+    private _panelEl;
+    private _fabEl;
+    private _isDragging;
+    private _hasMoved;
+    private _dragOffset;
+    private _startPanelPos;
+    private _pendingGeo;
+    private _activeResize;
+    private _resizeStartMouse;
+    private _resizeStartGeo;
+    constructor(host: ReactiveControllerHost, options?: PanelShellControllerOptions);
+    /** Current geometry (read-only snapshot). */
+    get geometry(): PanelGeometry;
+    /** Pixel rect of the panel, resolving docked positions. */
+    get rect(): {
+        top: number;
+        left: number;
+        width: number;
+        height: number;
+    };
+    /** Pixel right edge of the panel (useful for positioning adjacent UI). */
+    get rightEdge(): number;
+    /** Set geometry directly — useful for testing or external state sync. */
+    setGeometry(geo: PanelGeometry): void;
+    /** Reset geometry to default (and clear persisted state). */
+    reset(): void;
+    /** Styles to apply to the panel element. */
+    panelStyles(): Record<string, string>;
+    /** Styles to apply to the FAB button. `isOpen` adjusts the shadow. */
+    fabStyles(isOpen: boolean): Record<string, string>;
+    /** Direction descriptors for the 8 resize handles. */
+    get handles(): ResizeHandleDef[];
+    /** Bind the current panel element so the controller can direct-write styles during drag/resize. */
+    attachPanel(el: HTMLElement | null): void;
+    /** Bind the current FAB element. */
+    attachFab(el: HTMLElement | null): void;
+    hostConnected(): void;
+    hostDisconnected(): void;
+    handleFabPointerDown: (e: PointerEvent) => void;
+    handleFabPointerMove: (e: PointerEvent) => void;
+    handleFabPointerUp: (e: PointerEvent) => void;
+    handleResizePointerDown: (dir: ResizeDir, e: PointerEvent) => void;
+    handleResizePointerMove: (e: PointerEvent) => void;
+    handleResizePointerUp: (e: PointerEvent) => void;
+    private _commit;
+    private _writeStylesDuringGesture;
+    private _onWindowResize;
+    private _clampToViewport;
+    private _undockGeometry;
+    private _panelRect;
+    private _loadGeometry;
+    private _saveGeometry;
+    private _resolveDefaultGeometry;
+}
+//# sourceMappingURL=PanelShellController.d.ts.map

package/node_modules/@syntrologie/shared-editor-ui/dist/controllers/PanelShellController.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PanelShellController.d.ts","sourceRoot":"","sources":["../../src/controllers/PanelShellController.ts"],"names":[],"mappings":"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"}

package/node_modules/@syntrologie/shared-editor-ui/dist/controllers/PanelShellController.js

@@ -0,0 +1,476 @@
+/**
+ * PanelShellController — Lit ReactiveController for draggable/resizable panels.
+ *
+ * Owns geometry state (position, size, dock), pointer-event handlers for the
+ * drag FAB and 8 resize handles, localStorage persistence, and viewport
+ * clamping. A consuming LitElement calls `attachFab(el)` / `attachHandle(el, dir)`
+ * on its rendered DOM to hook up pointer events, and reads `panelStyles` /
+ * `fabStyles` to position the panel + FAB.
+ *
+ * Why a controller, not a wrapper element: `<slot>`-based wrapper elements
+ * don't compose well in light DOM (Lit wipes children on render), and shadow
+ * DOM breaks Playwright child selectors used by E2E tests. A ReactiveController
+ * is the Lit-idiomatic way to share stateful logic across elements.
+ *
+ * Emits one callback: `onToggle` when the FAB is pressed without dragging.
+ */
+import { panelShell } from '@syntro/design-system';
+// =============================================================================
+// Constants
+// =============================================================================
+const DEFAULTS = {
+    minWidth: panelShell.behavior.minWidth,
+    minHeight: panelShell.behavior.minHeight,
+    dragThreshold: panelShell.behavior.dragThreshold,
+    snapThreshold: panelShell.behavior.snapThreshold,
+    fabSize: panelShell.fab.size,
+    fabInset: panelShell.fab.inset,
+    storageKey: 'syntro:editor-panel',
+};
+const HANDLE_SIZE = panelShell.behavior.handleSize;
+// =============================================================================
+// Helpers
+// =============================================================================
+export function makeResizeHandles() {
+    return [
+        {
+            dir: 'n',
+            style: {
+                top: '0',
+                left: `${HANDLE_SIZE}px`,
+                right: `${HANDLE_SIZE}px`,
+                height: `${HANDLE_SIZE}px`,
+            },
+            cursor: 'ns-resize',
+        },
+        {
+            dir: 's',
+            style: {
+                bottom: '0',
+                left: `${HANDLE_SIZE}px`,
+                right: `${HANDLE_SIZE}px`,
+                height: `${HANDLE_SIZE}px`,
+            },
+            cursor: 'ns-resize',
+        },
+        {
+            dir: 'e',
+            style: {
+                right: '0',
+                top: `${HANDLE_SIZE}px`,
+                bottom: `${HANDLE_SIZE}px`,
+                width: `${HANDLE_SIZE}px`,
+            },
+            cursor: 'ew-resize',
+        },
+        {
+            dir: 'w',
+            style: {
+                left: '0',
+                top: `${HANDLE_SIZE}px`,
+                bottom: `${HANDLE_SIZE}px`,
+                width: `${HANDLE_SIZE}px`,
+            },
+            cursor: 'ew-resize',
+        },
+        {
+            dir: 'ne',
+            style: {
+                top: '0',
+                right: '0',
+                width: `${HANDLE_SIZE * 2}px`,
+                height: `${HANDLE_SIZE * 2}px`,
+            },
+            cursor: 'nesw-resize',
+        },
+        {
+            dir: 'nw',
+            style: {
+                top: '0',
+                left: '0',
+                width: `${HANDLE_SIZE * 2}px`,
+                height: `${HANDLE_SIZE * 2}px`,
+            },
+            cursor: 'nwse-resize',
+        },
+        {
+            dir: 'se',
+            style: {
+                bottom: '0',
+                right: '0',
+                width: `${HANDLE_SIZE * 2}px`,
+                height: `${HANDLE_SIZE * 2}px`,
+            },
+            cursor: 'nwse-resize',
+        },
+        {
+            dir: 'sw',
+            style: {
+                bottom: '0',
+                left: '0',
+                width: `${HANDLE_SIZE * 2}px`,
+                height: `${HANDLE_SIZE * 2}px`,
+            },
+            cursor: 'nesw-resize',
+        },
+    ];
+}
+// =============================================================================
+// Controller
+// =============================================================================
+export class PanelShellController {
+    constructor(host, options = {}) {
+        this._panelEl = null;
+        this._fabEl = null;
+        // Drag state
+        this._isDragging = false;
+        this._hasMoved = false;
+        this._dragOffset = { x: 0, y: 0 };
+        this._startPanelPos = { x: 0, y: 0 };
+        this._pendingGeo = null;
+        // Resize state
+        this._activeResize = null;
+        this._resizeStartMouse = { x: 0, y: 0 };
+        // ---- FAB pointer handlers ----
+        this.handleFabPointerDown = (e) => {
+            this._isDragging = true;
+            this._hasMoved = false;
+            const rect = this.rect;
+            this._startPanelPos = { x: rect.left, y: rect.top };
+            this._dragOffset = { x: e.clientX - rect.left, y: e.clientY - rect.top };
+            try {
+                e.target.setPointerCapture(e.pointerId);
+            }
+            catch {
+                // best-effort
+            }
+            e.preventDefault();
+        };
+        this.handleFabPointerMove = (e) => {
+            if (!this._isDragging)
+                return;
+            const newX = e.clientX - this._dragOffset.x;
+            const newY = e.clientY - this._dragOffset.y;
+            if (!this._hasMoved) {
+                const dx = Math.abs(newX - this._startPanelPos.x);
+                const dy = Math.abs(newY - this._startPanelPos.y);
+                if (dx < this.opts.dragThreshold && dy < this.opts.dragThreshold)
+                    return;
+                this._hasMoved = true;
+            }
+            const geo = this._geometry;
+            const height = geo.docked ? window.innerHeight : geo.height;
+            this._writeStylesDuringGesture({ x: newX, y: newY, width: geo.width, height });
+            this._pendingGeo = { x: newX, y: newY, width: geo.width, height, docked: null };
+        };
+        this.handleFabPointerUp = (e) => {
+            try {
+                e.target.releasePointerCapture(e.pointerId);
+            }
+            catch {
+                // best-effort
+            }
+            const wasDragging = this._hasMoved;
+            this._isDragging = false;
+            this._hasMoved = false;
+            if (!wasDragging) {
+                this.opts.onToggle?.();
+                return;
+            }
+            if (this._pendingGeo) {
+                const geo = this._pendingGeo;
+                if (geo.x <= this.opts.snapThreshold) {
+                    this._commit({ ...geo, docked: 'left', x: 0, y: 0 });
+                }
+                else if (geo.x + geo.width >= window.innerWidth - this.opts.snapThreshold) {
+                    this._commit({ ...geo, docked: 'right', x: 0, y: 0 });
+                }
+                else {
+                    this._commit(geo);
+                }
+                this._pendingGeo = null;
+            }
+        };
+        // ---- Resize pointer handlers ----
+        this.handleResizePointerDown = (dir, e) => {
+            let geo = this._geometry;
+            if (geo.docked) {
+                geo = this._undockGeometry(geo);
+                this._commit(geo);
+            }
+            this._activeResize = dir;
+            this._resizeStartMouse = { x: e.clientX, y: e.clientY };
+            this._resizeStartGeo = { ...geo };
+            try {
+                e.target.setPointerCapture(e.pointerId);
+            }
+            catch {
+                // best-effort
+            }
+            e.preventDefault();
+        };
+        this.handleResizePointerMove = (e) => {
+            if (!this._activeResize)
+                return;
+            const dx = e.clientX - this._resizeStartMouse.x;
+            const dy = e.clientY - this._resizeStartMouse.y;
+            const dir = this._activeResize;
+            const start = this._resizeStartGeo;
+            let { x, y, width, height } = start;
+            if (dir.includes('e'))
+                width = Math.max(this.opts.minWidth, start.width + dx);
+            if (dir.includes('w')) {
+                const newW = Math.max(this.opts.minWidth, start.width - dx);
+                x = start.x + start.width - newW;
+                width = newW;
+            }
+            if (dir.includes('s'))
+                height = Math.max(this.opts.minHeight, start.height + dy);
+            if (dir.includes('n')) {
+                const newH = Math.max(this.opts.minHeight, start.height - dy);
+                y = start.y + start.height - newH;
+                height = newH;
+            }
+            this._writeStylesDuringGesture({ x, y, width, height });
+            this._pendingGeo = { x, y, width, height, docked: null };
+        };
+        this.handleResizePointerUp = (e) => {
+            try {
+                e.target.releasePointerCapture(e.pointerId);
+            }
+            catch {
+                // best-effort
+            }
+            this._activeResize = null;
+            if (this._pendingGeo) {
+                this._commit(this._pendingGeo);
+                this._pendingGeo = null;
+            }
+        };
+        this._onWindowResize = () => {
+            this._commit(this._clampToViewport(this._geometry));
+        };
+        this.host = host;
+        this.opts = {
+            storageKey: options.storageKey ?? DEFAULTS.storageKey,
+            minWidth: options.minWidth ?? DEFAULTS.minWidth,
+            minHeight: options.minHeight ?? DEFAULTS.minHeight,
+            dragThreshold: options.dragThreshold ?? DEFAULTS.dragThreshold,
+            snapThreshold: options.snapThreshold ?? DEFAULTS.snapThreshold,
+            fabSize: options.fabSize ?? DEFAULTS.fabSize,
+            fabInset: options.fabInset ?? DEFAULTS.fabInset,
+            onToggle: options.onToggle,
+            defaultGeometry: this._resolveDefaultGeometry(options.defaultGeometry),
+        };
+        this._geometry = this.opts.defaultGeometry;
+        this._resizeStartGeo = this._geometry;
+        host.addController(this);
+    }
+    // ---- Public API ----
+    /** Current geometry (read-only snapshot). */
+    get geometry() {
+        return this._geometry;
+    }
+    /** Pixel rect of the panel, resolving docked positions. */
+    get rect() {
+        return this._panelRect(this._geometry);
+    }
+    /** Pixel right edge of the panel (useful for positioning adjacent UI). */
+    get rightEdge() {
+        const r = this.rect;
+        return r.left + r.width;
+    }
+    /** Set geometry directly — useful for testing or external state sync. */
+    setGeometry(geo) {
+        this._geometry = geo;
+        this._saveGeometry(geo);
+        this.host.requestUpdate();
+    }
+    /** Reset geometry to default (and clear persisted state). */
+    reset() {
+        this._geometry = this.opts.defaultGeometry;
+        try {
+            localStorage.removeItem(this.opts.storageKey);
+        }
+        catch {
+            // ignore
+        }
+        this.host.requestUpdate();
+    }
+    /** Styles to apply to the panel element. */
+    panelStyles() {
+        const geo = this._geometry;
+        const blur = `blur(${panelShell.backdropBlur})`;
+        const shadow = geo.docked === 'right'
+            ? panelShell.shadows.dockedRight
+            : geo.docked === 'left'
+                ? panelShell.shadows.dockedLeft
+                : panelShell.shadows.floating;
+        const styles = {
+            position: 'fixed',
+            pointerEvents: 'auto',
+            background: panelShell.background,
+            backdropFilter: blur,
+            webkitBackdropFilter: blur,
+            boxShadow: shadow,
+            overflow: 'hidden',
+        };
+        if (geo.docked === 'left') {
+            styles.top = '0';
+            styles.left = '0';
+            styles.width = `${geo.width}px`;
+            styles.height = '100vh';
+        }
+        else if (geo.docked === 'right') {
+            styles.top = '0';
+            styles.right = '0';
+            styles.width = `${geo.width}px`;
+            styles.height = '100vh';
+        }
+        else {
+            styles.top = `${geo.y}px`;
+            styles.left = `${geo.x}px`;
+            styles.width = `${geo.width}px`;
+            styles.height = `${geo.height}px`;
+        }
+        return styles;
+    }
+    /** Styles to apply to the FAB button. `isOpen` adjusts the shadow. */
+    fabStyles(isOpen) {
+        const rect = this.rect;
+        return {
+            position: 'fixed',
+            left: `${rect.left + this.opts.fabInset}px`,
+            top: `${rect.top + this.opts.fabInset}px`,
+            pointerEvents: 'auto',
+            width: `${this.opts.fabSize}px`,
+            height: `${this.opts.fabSize}px`,
+            borderRadius: '50%',
+            border: panelShell.fab.border,
+            cursor: 'grab',
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            background: panelShell.fab.background,
+            color: panelShell.fab.color,
+            boxShadow: isOpen ? panelShell.fab.shadowOpen : panelShell.fab.shadowClosed,
+            transition: 'box-shadow 150ms ease',
+            touchAction: 'none',
+            userSelect: 'none',
+            webkitUserSelect: 'none',
+        };
+    }
+    /** Direction descriptors for the 8 resize handles. */
+    get handles() {
+        return makeResizeHandles();
+    }
+    /** Bind the current panel element so the controller can direct-write styles during drag/resize. */
+    attachPanel(el) {
+        this._panelEl = el;
+    }
+    /** Bind the current FAB element. */
+    attachFab(el) {
+        this._fabEl = el;
+    }
+    // ---- ReactiveController lifecycle ----
+    hostConnected() {
+        this._geometry = this._loadGeometry();
+        this.host.requestUpdate();
+        if (typeof window !== 'undefined') {
+            window.addEventListener('resize', this._onWindowResize);
+        }
+    }
+    hostDisconnected() {
+        if (typeof window !== 'undefined') {
+            window.removeEventListener('resize', this._onWindowResize);
+        }
+    }
+    // ---- Internals ----
+    _commit(geo) {
+        this._geometry = geo;
+        this._saveGeometry(geo);
+        this.host.requestUpdate();
+    }
+    _writeStylesDuringGesture({ x, y, width, height, }) {
+        if (this._panelEl) {
+            this._panelEl.style.left = `${x}px`;
+            this._panelEl.style.top = `${y}px`;
+            this._panelEl.style.right = 'auto';
+            this._panelEl.style.width = `${width}px`;
+            this._panelEl.style.height = `${height}px`;
+        }
+        if (this._fabEl) {
+            this._fabEl.style.left = `${x + this.opts.fabInset}px`;
+            this._fabEl.style.top = `${y + this.opts.fabInset}px`;
+        }
+    }
+    _clampToViewport(geo) {
+        if (geo.docked)
+            return geo;
+        const vw = window.innerWidth;
+        const vh = window.innerHeight;
+        return {
+            ...geo,
+            x: Math.max(-(geo.width - this.opts.fabSize), Math.min(geo.x, vw - this.opts.fabSize)),
+            y: Math.max(-this.opts.fabInset, Math.min(geo.y, vh - this.opts.fabSize - this.opts.fabInset)),
+        };
+    }
+    _undockGeometry(geo) {
+        const r = this._panelRect(geo);
+        return { x: r.left, y: r.top, width: geo.width, height: r.height, docked: null };
+    }
+    _panelRect(geo) {
+        if (geo.docked === 'left') {
+            return { top: 0, left: 0, width: geo.width, height: window.innerHeight };
+        }
+        if (geo.docked === 'right') {
+            return {
+                top: 0,
+                left: window.innerWidth - geo.width,
+                width: geo.width,
+                height: window.innerHeight,
+            };
+        }
+        const { x: left, y: top, width, height } = geo;
+        return { top, left, width, height };
+    }
+    _loadGeometry() {
+        if (typeof window === 'undefined')
+            return this.opts.defaultGeometry;
+        try {
+            const raw = localStorage.getItem(this.opts.storageKey);
+            if (!raw)
+                return this.opts.defaultGeometry;
+            const p = JSON.parse(raw);
+            return {
+                x: typeof p.x === 'number' ? p.x : 0,
+                y: typeof p.y === 'number' ? p.y : 0,
+                width: Math.max(this.opts.minWidth, typeof p.width === 'number' ? p.width : this.opts.minWidth),
+                height: Math.max(this.opts.minHeight, typeof p.height === 'number' ? p.height : window.innerHeight),
+                docked: p.docked === 'left' || p.docked === 'right' ? p.docked : null,
+            };
+        }
+        catch {
+            return this.opts.defaultGeometry;
+        }
+    }
+    _saveGeometry(geo) {
+        try {
+            localStorage.setItem(this.opts.storageKey, JSON.stringify(geo));
+        }
+        catch {
+            // ignore
+        }
+    }
+    _resolveDefaultGeometry(partial) {
+        const w = typeof window !== 'undefined' ? window : null;
+        const base = {
+            x: 0,
+            y: 0,
+            width: DEFAULTS.minWidth,
+            height: w ? w.innerHeight : 800,
+            docked: 'right',
+        };
+        return { ...base, ...(partial ?? {}) };
+    }
+}

package/node_modules/@syntrologie/shared-editor-ui/dist/index.d.ts

@@ -23,6 +23,8 @@ export { EmptyState } from './components/EmptyState';
 export { GroupHeader } from './components/GroupHeader';
 export type { TriggerJourneyProps } from './components/TriggerJourney';
 export { TriggerJourney } from './components/TriggerJourney';
+export type { PanelGeometry, PanelShellControllerOptions, ResizeDir, ResizeHandleDef, } from './controllers/PanelShellController';
+export { makeResizeHandles, PanelShellController } from './controllers/PanelShellController';
 export type { ConditionProgress, FormattedCondition } from './formatConditionLabel';
 export { formatConditionLabel } from './formatConditionLabel';
 export { useElementRect } from './hooks/useElementRect';

package/node_modules/@syntrologie/shared-editor-ui/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,MAAM,CAAC;AAE1B,YAAY,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAClF,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,YAAY,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,kCAAkC,CAAC;AAC3F,OAAO,EAAE,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AACvE,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,YAAY,EAAE,qBAAqB,EAAE,MAAM,+BAA+B,CAAC;AAC3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,YAAY,EAAE,qBAAqB,EAAE,MAAM,+BAA+B,CAAC;AAC3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,YAAY,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AACvE,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,YAAY,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AACpF,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxD,YAAY,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AACpE,OAAO,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AACpE,OAAO,EACL,KAAK,UAAU,EACf,0BAA0B,EAC1B,oBAAoB,EACpB,KAAK,cAAc,GACpB,MAAM,iCAAiC,CAAC;AACzC,YAAY,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EACL,gBAAgB,EAChB,qBAAqB,EACrB,gBAAgB,GACjB,MAAM,2BAA2B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,MAAM,CAAC;AAC1B,YAAY,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAClF,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,YAAY,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,kCAAkC,CAAC;AAC3F,OAAO,EAAE,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AACvE,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,YAAY,EAAE,qBAAqB,EAAE,MAAM,+BAA+B,CAAC;AAC3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,YAAY,EAAE,qBAAqB,EAAE,MAAM,+BAA+B,CAAC;AAC3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,YAAY,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AACvE,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,YAAY,EACV,aAAa,EACb,2BAA2B,EAC3B,SAAS,EACT,eAAe,GAChB,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,oCAAoC,CAAC;AAC7F,YAAY,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AACpF,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxD,YAAY,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AACpE,OAAO,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AACpE,OAAO,EACL,KAAK,UAAU,EACf,0BAA0B,EAC1B,oBAAoB,EACpB,KAAK,cAAc,GACpB,MAAM,iCAAiC,CAAC;AACzC,YAAY,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EACL,gBAAgB,EAChB,qBAAqB,EACrB,gBAAgB,GACjB,MAAM,2BAA2B,CAAC"}

package/node_modules/@syntrologie/shared-editor-ui/dist/index.js

@@ -18,6 +18,7 @@ export { ElementHighlight } from './components/ElementHighlight';
 export { EmptyState } from './components/EmptyState';
 export { GroupHeader } from './components/GroupHeader';
 export { TriggerJourney } from './components/TriggerJourney';
+export { makeResizeHandles, PanelShellController } from './controllers/PanelShellController';
 export { formatConditionLabel } from './formatConditionLabel';
 export { useElementRect } from './hooks/useElementRect';
 export { useTriggerWhenStatus } from './hooks/useTriggerWhenStatus';

package/node_modules/@syntrologie/shared-editor-ui/dist/lit-elements.d.ts

@@ -5,6 +5,7 @@
  *
  * Does NOT pull in any React dependencies.
  */
+import './components/AnchorPickerLit';
 import './components/EditorCardLit';
 import './components/EditorPanelShellLit';
 import './components/EditorTextareaLit';

package/node_modules/@syntrologie/shared-editor-ui/dist/lit-elements.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"lit-elements.d.ts","sourceRoot":"","sources":["../src/lit-elements.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,4BAA4B,CAAC;AACpC,OAAO,kCAAkC,CAAC;AAC1C,OAAO,gCAAgC,CAAC;AACxC,OAAO,kCAAkC,CAAC;AAC1C,OAAO,4BAA4B,CAAC;AACpC,OAAO,6BAA6B,CAAC"}
+{"version":3,"file":"lit-elements.d.ts","sourceRoot":"","sources":["../src/lit-elements.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,8BAA8B,CAAC;AACtC,OAAO,4BAA4B,CAAC;AACpC,OAAO,kCAAkC,CAAC;AAC1C,OAAO,gCAAgC,CAAC;AACxC,OAAO,kCAAkC,CAAC;AAC1C,OAAO,4BAA4B,CAAC;AACpC,OAAO,6BAA6B,CAAC"}

package/node_modules/@syntrologie/shared-editor-ui/dist/lit-elements.js

@@ -5,6 +5,7 @@
  *
  * Does NOT pull in any React dependencies.
  */
+import './components/AnchorPickerLit';
 import './components/EditorCardLit';
 import './components/EditorPanelShellLit';
 import './components/EditorTextareaLit';

package/node_modules/@syntrologie/shared-editor-ui/package.json

@@ -29,6 +29,7 @@
     "test:watch": "vitest"
   },
   "dependencies": {
+    "@syntro/design-system": "*",
     "css-selector-generator": "3.8.0",
     "lit": "3.3.2"
   },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@syntrologie/adapt-content",
-  "version": "2.8.0-canary.93",
+  "version": "2.8.0-canary.95",
   "description": "Adaptive Content app - DOM manipulation actions for text, attributes, and styles",
   "license": "Proprietary",
   "private": false,