@syntrologie/runtime-sdk 2.14.0 → 2.16.0

package/dist/{chunk-77TNZ66J.js → chunk-XVRDKBYF.js}

@@ -1,9 +1,9 @@
 import {
   NotificationDeepLinkZ
-} from "./chunk-IR6UOR63.js";
+} from "./chunk-GX7BBYX6.js";
 import {
   TriggerWhenZ
-} from "./chunk-YLLWLUQX.js";
+} from "./chunk-4HXPGXUC.js";
 
 // src/actions/schema.ts
 import { z } from "zod";
@@ -249,4 +249,4 @@ export {
   TourZ,
   coreActionStepSchemas
 };
-//# sourceMappingURL=chunk-77TNZ66J.js.map
+//# sourceMappingURL=chunk-XVRDKBYF.js.map

package/dist/components/SyntroCanvasOverlay.d.ts

@@ -0,0 +1,100 @@
+/**
+ * SyntroCanvasOverlay — Lit web component equivalent of ShadowCanvasOverlay.tsx.
+ *
+ * Composes three child custom elements:
+ *   - <syntro-launcher>    FAB button
+ *   - <syntro-drawer>      Side panel
+ *   - <syntro-toast-stack> Notification toasts
+ *
+ * Wiring responsibilities:
+ *   - Manages open/closed state via isOpen property
+ *   - Runs NotifyWatcher loop (equivalent of useNotifyWatcher) to fire
+ *     notification events even when the drawer is closed
+ *   - Handles notification clicks: publish telemetry events, open canvas,
+ *     deep-link, dismiss toast
+ *   - Tracks tile viewed telemetry when canvas opens
+ *   - Publishes canvas.opened / canvas.closed on each toggle
+ *   - Forwards all properties to child elements via Lit bindings
+ *
+ * Uses light DOM (createRenderRoot returns this) so that host-page CSS
+ * variables reach the child elements without piercing shadow boundaries.
+ *
+ * Decorator-free: uses `static override properties` (tsconfig has no
+ * experimentalDecorators).
+ */
+import { LitElement } from 'lit';
+import type { SmartCanvasRuntime } from '../runtime.js';
+import type { TelemetryClient } from '../telemetry/types.js';
+import type { TileConfig } from '../types.js';
+export declare class SyntroCanvasOverlay extends LitElement {
+    static properties: {
+        isOpen: {
+            type: BooleanConstructor;
+        };
+        tiles: {
+            attribute: boolean;
+        };
+        isLoading: {
+            type: BooleanConstructor;
+        };
+        error: {
+            type: StringConstructor;
+        };
+        canvasTitle: {
+            type: StringConstructor;
+        };
+        displayMode: {
+            type: StringConstructor;
+        };
+        runtimeRef: {
+            attribute: boolean;
+        };
+        telemetry: {
+            attribute: boolean;
+        };
+        themeConfig: {
+            attribute: boolean;
+        };
+        launcherAnimate: {
+            type: BooleanConstructor;
+        };
+    };
+    isOpen: boolean;
+    tiles: TileConfig[];
+    isLoading: boolean;
+    error: string | undefined;
+    canvasTitle: string | undefined;
+    displayMode: 'standard' | 'focused';
+    runtimeRef: SmartCanvasRuntime | null;
+    telemetry: TelemetryClient | null;
+    themeConfig: Record<string, any>;
+    launcherAnimate: boolean;
+    private _notifications;
+    /** Prev-state map: entry.id → last evaluated boolean */
+    private _notifyPrevState;
+    /** Unsubscribe for the EventBus notify-watcher subscription */
+    private _notifyUnsub;
+    /** Unsubscribe for the sessionMetrics notify-watcher subscription */
+    private _notifyUnsubMetrics;
+    constructor();
+    createRenderRoot(): this;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    updated(changed: Map<string, unknown>): void;
+    private _syncNotificationsController;
+    private _startNotifyWatcher;
+    private _stopNotifyWatcher;
+    private _restartNotifyWatcher;
+    private _trackTilesViewed;
+    private _toggle;
+    private _handleNotificationClick;
+    private _handleNotificationDismiss;
+    private _onLauncherToggle;
+    private _onDrawerClose;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'syntro-canvas-overlay': SyntroCanvasOverlay;
+    }
+}

package/dist/components/SyntroDrawer.d.ts

@@ -0,0 +1,110 @@
+/**
+ * SyntroDrawer — Lit web component equivalent of the drawer panel from
+ * ShadowCanvasOverlay.tsx.
+ *
+ * Renders the slide-in/out side panel with:
+ * - CSS transform (translateX) + opacity transition
+ * - Configurable position (left/right), width, blur, border, border-radius
+ * - Tile cards (standard: stacked, focused: single full-width)
+ * - Loading and error states
+ * - Optional canvas title header (focused mode)
+ * - Push-mode margin on document.documentElement
+ * - ResizeObserver to keep push margin in sync
+ * - Outside-click-to-close via document mousedown + composedPath()
+ * - Configurable transition duration / easing from theme config
+ * - Mask-image fade at leading edge (disabled when border is visible)
+ *
+ * Decorator-free: uses static `properties` (tsconfig has no experimentalDecorators).
+ *
+ * Usage:
+ *   <syntro-drawer
+ *     .isOpen=${true}
+ *     .tiles=${tiles}
+ *     .isLoading=${false}
+ *     .error=${undefined}
+ *     .canvasTitle=${'My Canvas'}
+ *     .displayMode=${'standard'}
+ *     .runtimeRef=${runtime}
+ *     .telemetry=${telemetry}
+ *     .themeConfig=${themeConfig}
+ *     @drawer-close=${handleClose}
+ *   ></syntro-drawer>
+ */
+import { LitElement } from 'lit';
+import type { SmartCanvasRuntime } from '../runtime.js';
+import type { TelemetryClient } from '../telemetry/types.js';
+import type { TileConfig } from '../types.js';
+export interface DrawerThemeConfig {
+    canvas: {
+        position?: string;
+        width?: string;
+        layout?: string;
+        blur?: string;
+        border?: string;
+        transitionDuration?: string;
+        transitionEasing?: string;
+        transitionFade?: string;
+    };
+}
+export declare class SyntroDrawer extends LitElement {
+    static properties: {
+        isOpen: {
+            type: BooleanConstructor;
+        };
+        tiles: {
+            attribute: boolean;
+        };
+        isLoading: {
+            type: BooleanConstructor;
+        };
+        error: {
+            type: StringConstructor;
+        };
+        canvasTitle: {
+            type: StringConstructor;
+        };
+        displayMode: {
+            type: StringConstructor;
+        };
+        runtimeRef: {
+            attribute: boolean;
+        };
+        telemetry: {
+            attribute: boolean;
+        };
+        themeConfig: {
+            attribute: boolean;
+        };
+    };
+    isOpen: boolean;
+    tiles: TileConfig[];
+    isLoading: boolean;
+    error: string | undefined;
+    canvasTitle: string | undefined;
+    displayMode: 'standard' | 'focused';
+    runtimeRef: SmartCanvasRuntime | null;
+    telemetry: TelemetryClient | null;
+    themeConfig: DrawerThemeConfig;
+    private _containerEl;
+    private _resizeObserver;
+    private _onDocumentMousedown;
+    createRenderRoot(): this;
+    private get _canvas();
+    private get _isRight();
+    private get _isPush();
+    private get _isFocused();
+    private get _canvasBorder();
+    private get _duration();
+    private get _easing();
+    connectedCallback(): void;
+    updated(changed: Map<string, unknown>): void;
+    disconnectedCallback(): void;
+    private _teardownResizeObserver;
+    private _cleanupPushMargin;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'syntro-drawer': SyntroDrawer;
+    }
+}

package/dist/components/SyntroLauncher.d.ts

@@ -0,0 +1,105 @@
+/**
+ * SyntroLauncher — Lit web component equivalent of the launcher FAB
+ * from ShadowCanvasOverlay.tsx.
+ *
+ * Renders a floating action button that:
+ *   - Toggles the canvas open/closed (fires `launcher-toggle`)
+ *   - Supports drag-to-reposition (pointerdown/move/up with 5px threshold)
+ *   - Shows different icons: X when open, custom image if configured, sparkles default
+ *   - Pulse/glow animation when `launcherAnimate` is true and canvas is closed
+ *   - Notification badge with count, ping ring, glow pulse, and bounce animation
+ *   - Hover changes background color using theme config values
+ *   - CSS keyframe animations built dynamically using theme colors
+ *
+ * Usage:
+ *   <syntro-launcher
+ *     .isOpen=${false}
+ *     .launcherAnimate=${true}
+ *     .notificationCount=${3}
+ *     .position=${'right'}
+ *     .launcherIcon=${null}
+ *     .colorPrimary=${primaryHex}
+ *     .colorPrimaryHover=${primaryHoverHex}
+ *     .launcherConfig=${{ background: bgHex, backgroundHover: hoverHex }}
+ *   ></syntro-launcher>
+ *
+ *   element.addEventListener('launcher-toggle', () => { ... });
+ *
+ * Decorator-free: uses `static override properties` (tsconfig has no experimentalDecorators).
+ * Light DOM: uses `createRenderRoot() { return this; }` to inherit parent shadow CSS vars.
+ */
+import { LitElement } from 'lit';
+import type { LauncherElementConfig } from '../theme/types.js';
+export declare class SyntroLauncher extends LitElement {
+    static properties: {
+        isOpen: {
+            type: BooleanConstructor;
+        };
+        launcherAnimate: {
+            type: BooleanConstructor;
+        };
+        notificationCount: {
+            type: NumberConstructor;
+        };
+        position: {
+            type: StringConstructor;
+        };
+        launcherIcon: {
+            attribute: boolean;
+        };
+        colorPrimary: {
+            type: StringConstructor;
+        };
+        colorPrimaryHover: {
+            type: StringConstructor;
+        };
+        launcherConfig: {
+            attribute: boolean;
+        };
+        _launcherPos: {
+            state: boolean;
+        };
+        _hovered: {
+            state: boolean;
+        };
+    };
+    isOpen: boolean;
+    launcherAnimate: boolean;
+    notificationCount: number;
+    position: 'left' | 'right';
+    launcherIcon: string | null;
+    colorPrimary: string;
+    colorPrimaryHover: string;
+    launcherConfig: LauncherElementConfig;
+    _launcherPos: {
+        x: number;
+        y: number;
+    } | null;
+    _hovered: boolean;
+    private _drag;
+    private _styleEl;
+    createRenderRoot(): this;
+    connectedCallback(): void;
+    updated(changed: Map<string, unknown>): void;
+    disconnectedCallback(): void;
+    /**
+     * Inject/update a <style> element with dynamic keyframe CSS that uses
+     * the current colorPrimary and colorPrimaryHover values.
+     * These cannot live in `static styles` because keyframe values
+     * need to be literal colors (var() is unreliable in keyframes).
+     */
+    private _ensureDynamicStyles;
+    private _onPointerDown;
+    private _onPointerMove;
+    private _onPointerUp;
+    private _onMouseEnter;
+    private _onMouseLeave;
+    render(): import("lit-html").TemplateResult<1>;
+    private _renderIcon;
+    private _renderBadge;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'syntro-launcher': SyntroLauncher;
+    }
+}

package/dist/components/SyntroTileCard.d.ts

@@ -0,0 +1,74 @@
+/**
+ * SyntroTileCard — Lit web component equivalent of TileCard.tsx.
+ *
+ * Renders a tile card with header (icon + title + subtitle) and body
+ * (imperatively mounted widget). Preserves:
+ * - IntersectionObserver tracking for `syntro_intervention_seen`
+ * - EventBus subscription for `syntro_intervention_interacted`
+ * - Hover effects (scale + background change)
+ * - CSS variable theming (var(--sc-tile-*))
+ * - Imperative widget mounting via WidgetRegistry
+ * - Late widget registration (subscribes to registry for re-render)
+ * - Prop forwarding without remounting
+ *
+ * Usage:
+ *   <syntro-tile-card
+ *     .config=${tileConfig}
+ *     .surface=${'overlay'}
+ *     .runtimeRef=${runtime}
+ *   ></syntro-tile-card>
+ *
+ * Decorator-free: uses static `properties` (tsconfig has no experimentalDecorators).
+ */
+import { LitElement, nothing } from 'lit';
+import type { SmartCanvasRuntime } from '../runtime.js';
+import type { TileConfig } from '../types.js';
+export declare class SyntroTileCard extends LitElement {
+    static properties: {
+        config: {
+            attribute: boolean;
+        };
+        surface: {
+            type: StringConstructor;
+        };
+        runtimeRef: {
+            attribute: boolean;
+        };
+        _hovered: {
+            state: boolean;
+        };
+    };
+    config: TileConfig | null;
+    surface: 'overlay' | 'wheel';
+    runtimeRef: SmartCanvasRuntime | null;
+    _hovered: boolean;
+    private _widgetHandle;
+    private _widgetContainer;
+    private _mountedWidgetId;
+    private _registryUnsub;
+    private _eventBusUnsub;
+    private _intersectionObserver;
+    private _prevPropsJson;
+    createRenderRoot(): this;
+    connectedCallback(): void;
+    updated(changed: Map<string, unknown>): void;
+    disconnectedCallback(): void;
+    private _mountWidgetIfReady;
+    private _unmountWidget;
+    private _forwardPropUpdates;
+    private _setupRegistrySubscription;
+    private _setupIntersectionObserver;
+    private _setupEventBusSubscription;
+    private _teardownSubscriptions;
+    private get _registration();
+    private get _resolvedIcon();
+    private get _resolvedSubtitle();
+    render(): import("lit-html").TemplateResult<1> | typeof nothing;
+    private _onMouseEnter;
+    private _onMouseLeave;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'syntro-tile-card': SyntroTileCard;
+    }
+}

package/dist/components/SyntroTileWheel.d.ts

@@ -0,0 +1,51 @@
+import { LitElement, nothing } from 'lit';
+import type { SmartCanvasRuntime } from '../runtime.js';
+import type { TelemetryClient } from '../telemetry/types.js';
+import type { TileConfig } from '../types.js';
+/**
+ * <syntro-tile-wheel>
+ *
+ * Lit port of TileWheel.tsx — a carousel that auto-rotates through a sorted
+ * list of tiles, tracks telemetry, and shows clickable dot indicators.
+ *
+ * Uses static properties (no decorators) — tsconfig has no experimentalDecorators.
+ */
+export declare class SyntroTileWheel extends LitElement {
+    static styles: import("lit").CSSResult;
+    static properties: {
+        tiles: {
+            type: ArrayConstructor;
+        };
+        intervalMs: {
+            type: NumberConstructor;
+        };
+        telemetry: {
+            type: ObjectConstructor;
+        };
+        runtimeRef: {
+            type: ObjectConstructor;
+        };
+        _index: {
+            type: NumberConstructor;
+            state: boolean;
+        };
+    };
+    tiles: TileConfig[];
+    intervalMs: number;
+    telemetry: TelemetryClient | null;
+    runtimeRef: SmartCanvasRuntime | null;
+    private _index;
+    private _ordered;
+    private _intervalId;
+    private _canvasOpenedTracked;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    updated(changed: Map<string, unknown>): void;
+    private _syncOrdered;
+    private _trackCanvasOpened;
+    private _trackRectangleViewed;
+    private _startInterval;
+    private _stopInterval;
+    private _goTo;
+    render(): import("lit-html").TemplateResult<1> | typeof nothing;
+}

package/dist/config/schema.js

@@ -12,8 +12,9 @@ import {
   TileNotificationRuleZ,
   TileZ,
   configSchemas
-} from "../chunk-IR6UOR63.js";
-import "../chunk-YLLWLUQX.js";
+} from "../chunk-GX7BBYX6.js";
+import "../chunk-4HXPGXUC.js";
+import "../chunk-JMHRHAEL.js";
 export {
   CanvasConfigResponseZ,
   CanvasElementConfigZ,

package/dist/controllers/DecisionController.d.ts

@@ -0,0 +1,48 @@
+/**
+ * DecisionController
+ *
+ * A Lit ReactiveController that replaces the `useDecision()` React hook
+ * from RuntimeProvider.tsx. Evaluates a DecisionStrategy against the runtime
+ * when the host element connects and exposes the result as reactive properties.
+ *
+ * Usage:
+ * ```ts
+ * class MyElement extends LitElement {
+ *   private _decision = new DecisionController(
+ *     this,
+ *     runtime,
+ *     strategy,
+ *     false  // defaultValue
+ *   );
+ *
+ *   render() {
+ *     if (this._decision.isLoading) return html`...`;
+ *     return this._decision.value ? html`<shown-content>` : html``;
+ *   }
+ * }
+ * ```
+ */
+import type { ReactiveController, ReactiveControllerHost } from 'lit';
+import type { DecisionStrategy } from '../decisions/types.js';
+import type { SmartCanvasRuntime } from '../runtime.js';
+export declare class DecisionController<T> implements ReactiveController {
+    private _host;
+    private _runtime;
+    private _strategy;
+    private _defaultValue;
+    private _value;
+    private _isFallback;
+    private _isLoading;
+    private _cancelled;
+    constructor(host: ReactiveControllerHost, runtime: SmartCanvasRuntime | null | undefined, strategy: DecisionStrategy<T> | null | undefined, defaultValue: T);
+    get value(): T;
+    get isFallback(): boolean;
+    get isLoading(): boolean;
+    hostConnected(): void;
+    hostDisconnected(): void;
+    /**
+     * Update the strategy and re-evaluate. Triggers a host update when done.
+     */
+    setStrategy(strategy: DecisionStrategy<T> | null | undefined): void;
+    private _evaluate;
+}

package/dist/controllers/NotificationsController.d.ts

@@ -0,0 +1,59 @@
+import type { ReactiveController, ReactiveControllerHost } from 'lit';
+import type { EventBus } from '../events/EventBus.js';
+import type { ActiveNotification } from '../notifications/types.js';
+import type { TileConfig } from '../types.js';
+/**
+ * NotificationsController — Lit ReactiveController equivalent of useNotifications().
+ *
+ * Subscribes to the EventBus, evaluates notification rules from tile configs,
+ * and manages the active toast queue.
+ *
+ * Features:
+ * - Max 3 visible toasts (FIFO eviction when exceeded)
+ * - Deduplication by tileId + itemId
+ * - Cooldown per rule (prevents rapid re-firing)
+ * - Auto-dismiss after TTL
+ * - Publishes NOTIFICATION_SHOWN / NOTIFICATION_DISMISSED telemetry events
+ *
+ * Usage (decorator-free):
+ *   class MyElement extends LitElement {
+ *     private _notifications: NotificationsController;
+ *
+ *     constructor() {
+ *       super();
+ *       this._notifications = new NotificationsController(this, eventBus, tiles);
+ *     }
+ *
+ *     render() {
+ *       return html`${this._notifications.notifications.map(...)}`;
+ *     }
+ *   }
+ */
+export declare class NotificationsController implements ReactiveController {
+    private host;
+    private eventBus;
+    private tiles;
+    private _notifications;
+    private _cooldownMap;
+    private _timerIds;
+    private _unsubscribe;
+    constructor(host: ReactiveControllerHost, eventBus: EventBus | null, tiles: TileConfig[]);
+    /** Returns the current list of active (visible) notifications. */
+    get notifications(): ActiveNotification[];
+    /** Update the tile configs (and thus notification rules) after construction. */
+    setTiles(tiles: TileConfig[]): void;
+    /**
+     * Swap the EventBus after construction (e.g. when runtimeRef changes).
+     * Tears down the existing subscription and re-subscribes on the new bus.
+     */
+    setEventBus(eventBus: EventBus | null): void;
+    hostConnected(): void;
+    hostDisconnected(): void;
+    /**
+     * Manually dismiss a notification by ID.
+     * Cancels its auto-dismiss timer and publishes NOTIFICATION_DISMISSED.
+     */
+    dismiss(id: string): void;
+    private _publishDismissed;
+    private _scheduleDismiss;
+}

package/dist/controllers/RuntimeController.d.ts

@@ -0,0 +1,52 @@
+/**
+ * RuntimeController — Lit ReactiveController equivalent of the React runtime hooks.
+ *
+ * Replaces the following hooks from RuntimeProvider.tsx for Lit-based components:
+ *   useRuntime()         → controller.runtime
+ *   useRuntimeContext()  → controller.context
+ *   usePageContext()     → controller.page
+ *   useSessionContext()  → controller.session
+ *   useViewportContext() → controller.viewport
+ *
+ * Usage:
+ *   class MyElement extends LitElement {
+ *     static override properties = { ... };
+ *
+ *     #runtimeCtrl = new RuntimeController(this, myRuntime);
+ *
+ *     override render() {
+ *       const page = this.#runtimeCtrl.page;
+ *       return html`<p>${page?.url}</p>`;
+ *     }
+ *   }
+ *
+ * The controller subscribes to runtime.context.subscribe() when the host connects
+ * to the DOM and calls host.requestUpdate() on every context change, mirroring
+ * the React useState/useEffect pattern in RuntimeProvider.
+ *
+ * Decorator-free: relies on static `properties` declarations on the host element
+ * instead of @property / @state decorators (tsconfig does not enable
+ * experimentalDecorators).
+ */
+import type { ReactiveController, ReactiveControllerHost } from 'lit';
+import type { PageContext, RuntimeContext, SessionContext, ViewportContext } from '../context/types.js';
+import type { SmartCanvasRuntime } from '../runtime.js';
+export declare class RuntimeController implements ReactiveController {
+    readonly host: ReactiveControllerHost;
+    private readonly _runtime;
+    private _context;
+    private _unsubscribe;
+    constructor(host: ReactiveControllerHost, runtime: SmartCanvasRuntime);
+    hostConnected(): void;
+    hostDisconnected(): void;
+    /** The SmartCanvasRuntime instance (equivalent to useRuntime()). */
+    get runtime(): SmartCanvasRuntime;
+    /** Current reactive RuntimeContext snapshot (equivalent to useRuntimeContext()). */
+    get context(): RuntimeContext | null;
+    /** Current page context (equivalent to usePageContext()). */
+    get page(): PageContext | null;
+    /** Current session context (equivalent to useSessionContext()). */
+    get session(): SessionContext | null;
+    /** Current viewport context (equivalent to useViewportContext()). */
+    get viewport(): ViewportContext | null;
+}

package/dist/controllers/RuntimeEventsController.d.ts

@@ -0,0 +1,42 @@
+/**
+ * RuntimeEventsController
+ *
+ * A Lit ReactiveController that replaces the `useRuntimeEvents()` React hook
+ * from RuntimeProvider.tsx. Subscribes to the runtime event bus when the host
+ * element connects to the DOM and unsubscribes when it disconnects.
+ *
+ * Usage:
+ * ```ts
+ * class MyElement extends LitElement {
+ *   private _events = new RuntimeEventsController(
+ *     this,
+ *     runtime,
+ *     { names: ['ui.click'] },
+ *     (event) => { ... }
+ *   );
+ * }
+ * ```
+ */
+import type { ReactiveController, ReactiveControllerHost } from 'lit';
+import type { EventFilter, NormalizedEvent } from '../events/types.js';
+import type { SmartCanvasRuntime } from '../runtime.js';
+export type { EventFilter };
+export declare class RuntimeEventsController implements ReactiveController {
+    private _host;
+    private _runtime;
+    private _filter;
+    private _callback;
+    private _unsubscribe;
+    constructor(host: ReactiveControllerHost, runtime: SmartCanvasRuntime | null | undefined, filter: EventFilter | undefined, callback: (event: NormalizedEvent) => void);
+    hostConnected(): void;
+    hostDisconnected(): void;
+    /**
+     * Update the event filter. Resubscribes immediately if the host is connected.
+     */
+    setFilter(filter: EventFilter | undefined): void;
+    /**
+     * Update the event callback. Resubscribes immediately if the host is connected.
+     */
+    setCallback(callback: (event: NormalizedEvent) => void): void;
+    private _subscribe;
+}