@wildo-ai/presets-components-3d 1.1.6

package/dist/esm/frame/frame-color.js

@@ -0,0 +1,52 @@
+/**
+ * The frame's colour arithmetic (#1823). INTERNAL to the package: the root barrel does not export it. It is the
+ * model of what the shaders write, and the appearance derivation and its tests share it; it is not an API.
+ */
+export const BLACK = [0, 0, 0];
+export const WHITE = [1, 1, 1];
+/** The gradient is checked at these points, not only its ends: a lerp's luminance can dip below both ends. */
+const GRADIENT_SAMPLES = [0, 0.25, 0.5, 0.75, 1];
+const BOUND_STEPS = 40;
+/** WCAG relative luminance of an sRGB-encoded colour. spec-cite: WCAG 2.2 — "relative luminance" definition — https://www.w3.org/TR/WCAG22/#dfn-relative-luminance */
+export function relativeLuminance(color) {
+    const [r, g, b] = color.map(decodeSrgb);
+    return 0.2126 * r + 0.7152 * g + 0.0722 * b;
+}
+/** WCAG contrast ratio between two sRGB-encoded colours. spec-cite: WCAG 2.2 — "contrast ratio" definition — https://www.w3.org/TR/WCAG22/#dfn-contrast-ratio */
+export function contrastRatio(a, b) {
+    const la = relativeLuminance(a);
+    const lb = relativeLuminance(b);
+    return (Math.max(la, lb) + 0.05) / (Math.min(la, lb) + 0.05);
+}
+/** `top` at `alpha` over an opaque `bottom`, blended in sRGB-encoded space as the framebuffer does. */
+export function composite(top, alpha, bottom) {
+    return [0, 1, 2].map((i) => top[i] * alpha + bottom[i] * (1 - alpha));
+}
+export function mix(a, b, t) {
+    return [0, 1, 2].map((i) => a[i] + (b[i] - a[i]) * t);
+}
+/** The points of a gradient the bound checks. */
+export function gradientPoints(from, to) {
+    return GRADIENT_SAMPLES.map((t) => mix(from, to, t));
+}
+/** Move `color` toward `pole` in small steps until `ok` holds; the pole itself if nothing short of it does. */
+export function pushUntil(color, pole, ok) {
+    for (let step = 0; step <= BOUND_STEPS; step += 1) {
+        const candidate = mix(color, pole, step / BOUND_STEPS);
+        if (ok(candidate))
+            return candidate;
+    }
+    return pole;
+}
+export function decodeSrgb(channel) {
+    return channel <= 0.04045 ? channel / 12.92 : ((channel + 0.055) / 1.055) ** 2.4;
+}
+export function encodeSrgb(channel) {
+    const c = Math.min(1, Math.max(0, channel));
+    return c <= 0.0031308 ? c * 12.92 : 1.055 * c ** (1 / 2.4) - 0.055;
+}
+/** The colour as the 8-bit framebuffer stores it: each channel rounded to the nearest of 256 levels. */
+export function quantize(color) {
+    return color.map((c) => Math.round(Math.min(1, Math.max(0, c)) * 255) / 255);
+}
+//# sourceMappingURL=frame-color.js.map

package/dist/esm/frame/frame-color.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"frame-color.js","sourceRoot":"","sources":["../../../../src/frame/frame-color.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * The frame's colour arithmetic (#1823). INTERNAL to the package: the root barrel does not export it. It is the\n * model of what the shaders write, and the appearance derivation and its tests share it; it is not an API.\n */\n\n/** A colour as the frame draws it: sRGB-ENCODED channels in 0–1, exactly what lands in the framebuffer. */\nexport type FrameColor = readonly [number, number, number];\n\nexport const BLACK: FrameColor = [0, 0, 0];\nexport const WHITE: FrameColor = [1, 1, 1];\n\n/** The gradient is checked at these points, not only its ends: a lerp's luminance can dip below both ends. */\nconst GRADIENT_SAMPLES = [0, 0.25, 0.5, 0.75, 1];\nconst BOUND_STEPS = 40;\n\n/** WCAG relative luminance of an sRGB-encoded colour. spec-cite: WCAG 2.2 — \"relative luminance\" definition — https://www.w3.org/TR/WCAG22/#dfn-relative-luminance */\nexport function relativeLuminance(color: FrameColor): number {\n  const [r, g, b] = color.map(decodeSrgb);\n  return 0.2126 * r! + 0.7152 * g! + 0.0722 * b!;\n}\n\n/** WCAG contrast ratio between two sRGB-encoded colours. spec-cite: WCAG 2.2 — \"contrast ratio\" definition — https://www.w3.org/TR/WCAG22/#dfn-contrast-ratio */\nexport function contrastRatio(a: FrameColor, b: FrameColor): number {\n  const la = relativeLuminance(a);\n  const lb = relativeLuminance(b);\n  return (Math.max(la, lb) + 0.05) / (Math.min(la, lb) + 0.05);\n}\n\n/** `top` at `alpha` over an opaque `bottom`, blended in sRGB-encoded space as the framebuffer does. */\nexport function composite(top: FrameColor, alpha: number, bottom: FrameColor): FrameColor {\n  return [0, 1, 2].map((i) => top[i]! * alpha + bottom[i]! * (1 - alpha)) as unknown as FrameColor;\n}\n\nexport function mix(a: FrameColor, b: FrameColor, t: number): FrameColor {\n  return [0, 1, 2].map((i) => a[i]! + (b[i]! - a[i]!) * t) as unknown as FrameColor;\n}\n\n/** The points of a gradient the bound checks. */\nexport function gradientPoints(from: FrameColor, to: FrameColor): FrameColor[] {\n  return GRADIENT_SAMPLES.map((t) => mix(from, to, t));\n}\n\n/** Move `color` toward `pole` in small steps until `ok` holds; the pole itself if nothing short of it does. */\nexport function pushUntil(color: FrameColor, pole: FrameColor, ok: (c: FrameColor) => boolean): FrameColor {\n  for (let step = 0; step <= BOUND_STEPS; step += 1) {\n    const candidate = mix(color, pole, step / BOUND_STEPS);\n    if (ok(candidate)) return candidate;\n  }\n  return pole;\n}\n\nexport function decodeSrgb(channel: number): number {\n  return channel <= 0.04045 ? channel / 12.92 : ((channel + 0.055) / 1.055) ** 2.4;\n}\n\nexport function encodeSrgb(channel: number): number {\n  const c = Math.min(1, Math.max(0, channel));\n  return c <= 0.0031308 ? c * 12.92 : 1.055 * c ** (1 / 2.4) - 0.055;\n}\n\n/** The colour as the 8-bit framebuffer stores it: each channel rounded to the nearest of 256 levels. */\nexport function quantize(color: FrameColor): FrameColor {\n  return color.map((c) => Math.round(Math.min(1, Math.max(0, c)) * 255) / 255) as unknown as FrameColor;\n}\n"]}

package/dist/esm/frame/frame-driver.d.ts

@@ -0,0 +1,60 @@
+import type { FrameAppearance } from './frame-appearance';
+import { FrameTransitionTrigger, type FrameRenderer, type FrameViewport } from './frame-renderer';
+/** What the driver needs from its host. Injected, so the scheduling is tested with fake clocks and observers. */
+export interface FrameDriverHost {
+    renderer: Pick<FrameRenderer, 'setAppearance' | 'setLayout' | 'setHovered' | 'setZones' | 'rimmedZone' | 'pulse' | 'hasPendingMotion' | 'tick'>;
+    /** Renders the scene as the renderer last left it. */
+    renderScene: () => void;
+    /** The canvas' size in CSS pixels, as the camera was fitted to it. */
+    viewport: () => FrameViewport;
+    /** The canvas element, for context-loss events. */
+    canvas: EventTarget;
+    document: Document;
+    requestFrame: (callback: () => void) => number;
+    cancelFrame: (handle: number) => void;
+    now: () => number;
+    createResizeObserver: (callback: () => void) => Pick<ResizeObserver, 'observe' | 'unobserve' | 'disconnect'>;
+    createMutationObserver: (callback: () => void) => Pick<MutationObserver, 'observe' | 'disconnect'>;
+    /** Whether an appearance change after the first cross-fades (the layout's transitions) or is shown at once. */
+    crossFadeAppearance: boolean;
+    /**
+     * A transition of the frame started (#1826). The canvas counts them on its element, so a live probe can tell that a
+     * choreography ran — draws alone cannot, since a hover or a re-layout draws too.
+     */
+    onTransitionStarted?: (trigger: FrameTransitionTrigger) => void;
+}
+/** The canvas-facing surface of a running driver. */
+export interface FrameDriver {
+    /** A new appearance: shown at once the first time, cross-faded afterwards. */
+    setAppearance(appearance: FrameAppearance | null): void;
+    /** The canvas resized or its pixel ratio changed: the drawing buffer was cleared, so redraw regardless. */
+    redraw(): void;
+    /**
+     * The content's identity: the structural zones' top entries, as the navigation state reports them (#1826). The
+     * first value only records; every later CHANGE plays the layout's navigation choreography. An EMPTY signature (no
+     * zone holds anything yet: the route sync has not landed) is not a place and is never recorded, so the first
+     * landing after the canvas mounted is not played as a navigation.
+     */
+    setNavigation(signature: string): void;
+    /** The navigation state's focused zone (a `data-content-area` value), or null. */
+    setFocusedZone(zone: string | null): void;
+    dispose(): void;
+}
+/**
+ * The frame's scheduler (#1823): decides WHEN the renderer draws, and nothing about what it draws.
+ *
+ * - **At rest**, it draws synchronously inside the callback of whatever changed a region's box (ResizeObserver,
+ *   a region mounting or leaving), so a slab never lags its region by a frame — and draws NOTHING when every box
+ *   is where it was.
+ * - **While something moves** — a CSS transition in the shell, a cross-fade, a hover emphasis — it runs one loop
+ *   per animation frame. The loop still renders only when a box moved or the renderer has motion pending. A
+ *   `transitionstart` anywhere in the document (a button's hover colour) keeps the loop ALIVE, so a moving
+ *   sidebar is followed frame by frame, but a frame where nothing in the scene changed costs no draw.
+ * - **A navigation or a zone focus** (#1826) is an input from the DOM tree (`setNavigation`, `setFocusedZone`); a
+ *   **sidebar resize** is read off the measurement itself (its width changed while it stayed on screen). Each starts
+ *   the renderer's choreography and the same loop, which stops the frame the choreography settles. The zone
+ *   containers are observed like the regions, so a split resized by dragging its divider keeps the rim on the zone.
+ * - **After a context loss**, it draws nothing until the context is restored.
+ */
+export declare function createFrameDriver(host: FrameDriverHost, initialAppearance: FrameAppearance | null): FrameDriver;
+//# sourceMappingURL=frame-driver.d.ts.map

package/dist/esm/frame/frame-driver.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"frame-driver.d.ts","sourceRoot":"","sources":["../../../../src/frame/frame-driver.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAG1D,OAAO,EAAqB,sBAAsB,EAAuB,KAAK,aAAa,EAAE,KAAK,aAAa,EAAqB,MAAM,kBAAkB,CAAC;AAG7J,iHAAiH;AACjH,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,IAAI,CAAC,aAAa,EAAE,eAAe,GAAG,WAAW,GAAG,YAAY,GAAG,UAAU,GAAG,YAAY,GAAG,OAAO,GAAG,kBAAkB,GAAG,MAAM,CAAC,CAAC;IAChJ,sDAAsD;IACtD,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,sEAAsE;IACtE,QAAQ,EAAE,MAAM,aAAa,CAAC;IAC9B,mDAAmD;IACnD,MAAM,EAAE,WAAW,CAAC;IACpB,QAAQ,EAAE,QAAQ,CAAC;IACnB,YAAY,EAAE,CAAC,QAAQ,EAAE,MAAM,IAAI,KAAK,MAAM,CAAC;IAC/C,WAAW,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,GAAG,EAAE,MAAM,MAAM,CAAC;IAClB,oBAAoB,EAAE,CAAC,QAAQ,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC,cAAc,EAAE,SAAS,GAAG,WAAW,GAAG,YAAY,CAAC,CAAC;IAC7G,sBAAsB,EAAE,CAAC,QAAQ,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC,gBAAgB,EAAE,SAAS,GAAG,YAAY,CAAC,CAAC;IACnG,+GAA+G;IAC/G,mBAAmB,EAAE,OAAO,CAAC;IAC7B;;;OAGG;IACH,mBAAmB,CAAC,EAAE,CAAC,OAAO,EAAE,sBAAsB,KAAK,IAAI,CAAC;CACjE;AAED,qDAAqD;AACrD,MAAM,WAAW,WAAW;IAC1B,8EAA8E;IAC9E,aAAa,CAAC,UAAU,EAAE,eAAe,GAAG,IAAI,GAAG,IAAI,CAAC;IACxD,2GAA2G;IAC3G,MAAM,IAAI,IAAI,CAAC;IACf;;;;;OAKG;IACH,aAAa,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACvC,kFAAkF;IAClF,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1C,OAAO,IAAI,IAAI,CAAC;CACjB;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,eAAe,EAAE,iBAAiB,EAAE,eAAe,GAAG,IAAI,GAAG,WAAW,CA2J/G"}

package/dist/esm/frame/frame-driver.js

@@ -0,0 +1,207 @@
+import { ShellRegion } from '@wildo-ai/presets-components-models';
+import { FramePulseOutcome, FrameTransitionTrigger } from './frame-renderer.js';
+import { findNavigationZoneElements, findShellRegionElements, measureNavigationZones, measureShellRegions } from '../shell-region-measurement.js';
+/**
+ * The frame's scheduler (#1823): decides WHEN the renderer draws, and nothing about what it draws.
+ *
+ * - **At rest**, it draws synchronously inside the callback of whatever changed a region's box (ResizeObserver,
+ *   a region mounting or leaving), so a slab never lags its region by a frame — and draws NOTHING when every box
+ *   is where it was.
+ * - **While something moves** — a CSS transition in the shell, a cross-fade, a hover emphasis — it runs one loop
+ *   per animation frame. The loop still renders only when a box moved or the renderer has motion pending. A
+ *   `transitionstart` anywhere in the document (a button's hover colour) keeps the loop ALIVE, so a moving
+ *   sidebar is followed frame by frame, but a frame where nothing in the scene changed costs no draw.
+ * - **A navigation or a zone focus** (#1826) is an input from the DOM tree (`setNavigation`, `setFocusedZone`); a
+ *   **sidebar resize** is read off the measurement itself (its width changed while it stayed on screen). Each starts
+ *   the renderer's choreography and the same loop, which stops the frame the choreography settles. The zone
+ *   containers are observed like the regions, so a split resized by dragging its divider keeps the rim on the zone.
+ * - **After a context loss**, it draws nothing until the context is restored.
+ */
+export function createFrameDriver(host, initialAppearance) {
+    const { renderer, document } = host;
+    let contextLost = false;
+    let hadAppearance = false;
+    let appearance = null;
+    const observed = new Set();
+    const observedZones = new Set();
+    const resizeObserver = host.createResizeObserver(() => draw(false));
+    let navigationSignature = null;
+    let focusedZone = null;
+    /** The sidebar's width at the last measurement, or null when it was not on screen. */
+    let sidebarWidth = null;
+    const started = (trigger) => host.onTransitionStarted?.(trigger);
+    const observeOnly = (present, into) => {
+        for (const element of present)
+            if (!into.has(element)) {
+                resizeObserver.observe(element);
+                into.add(element);
+            }
+        for (const element of into)
+            if (!present.has(element)) {
+                resizeObserver.unobserve(element);
+                into.delete(element);
+            }
+    };
+    const measure = () => {
+        // Every marked region and zone is OBSERVED, whatever its box: one collapsed to nothing must redraw the moment it reappears.
+        observeOnly(new Set(findShellRegionElements(document)), observed);
+        observeOnly(new Set(findNavigationZoneElements(document)), observedZones);
+        const boxes = measureShellRegions(document).map(({ element, region, left, top, width, height, glass }) => ({ element, region, left, top, width, height, glass }));
+        const zones = measureNavigationZones(document);
+        const focused = zones.find((zone) => zone.zone === focusedZone)?.element ?? null;
+        const zoneBoxes = zones.map(({ element, left, top, width, height }) => ({ element, left, top, width, height }));
+        const moved = renderer.setLayout(boxes, host.viewport());
+        // A sidebar resize: its width changed while it stayed on screen. A sidebar that appears (labels ready, an
+        // organization switch) or leaves is not one. Every frame of its animation extends the same pulse.
+        const sidebar = boxes.find((box) => box.region === ShellRegion.SIDEBAR);
+        const width = sidebar ? sidebar.width : null;
+        const resizing = width !== null && sidebarWidth !== null && width !== sidebarWidth;
+        sidebarWidth = width;
+        // Reported when a pulse STARTS, never per frame: a ResizeObserver measure between two animation frames sees an
+        // unchanged width, so any "was it resizing last time" flag would re-arm and count every frame of the animation.
+        if (resizing && renderer.pulse(FrameTransitionTrigger.SIDEBAR_RESIZE) === FramePulseOutcome.STARTED)
+            started(FrameTransitionTrigger.SIDEBAR_RESIZE);
+        const rimmedBefore = renderer.rimmedZone();
+        const zonesChanged = renderer.setZones(zoneBoxes, focused);
+        const rimmedAfter = renderer.rimmedZone();
+        if (rimmedAfter !== null && rimmedAfter !== rimmedBefore)
+            started(FrameTransitionTrigger.ZONE_FOCUS);
+        return zonesChanged || moved || resizing;
+    };
+    const renderFrame = () => {
+        renderer.tick(host.now());
+        host.renderScene();
+    };
+    // A running CSS transition, per (property, element); the deadline stops following one whose end never arrives.
+    const runningTransitions = new Map();
+    let loopHandle = 0;
+    const kick = () => {
+        if (!loopHandle)
+            loopHandle = host.requestFrame(loop);
+    };
+    const loop = () => {
+        loopHandle = 0;
+        if (contextLost)
+            return;
+        const now = host.now();
+        for (const [key, deadline] of runningTransitions)
+            if (now > deadline)
+                runningTransitions.delete(key);
+        const moved = measure();
+        if (moved || renderer.hasPendingMotion())
+            renderFrame();
+        if (renderer.hasPendingMotion() || runningTransitions.size > 0)
+            kick();
+    };
+    function draw(force) {
+        if (contextLost)
+            return;
+        const moved = measure();
+        if (!moved && !force && !renderer.hasPendingMotion())
+            return;
+        renderFrame();
+        if (renderer.hasPendingMotion())
+            kick();
+    }
+    // Regions render nothing until their labels are ready and remount on an organization switch: re-query, at most
+    // once per animation frame, whenever the DOM gains or loses nodes.
+    let mutationHandle = 0;
+    const mutationObserver = host.createMutationObserver(() => {
+        if (mutationHandle)
+            return;
+        mutationHandle = host.requestFrame(() => { mutationHandle = 0; draw(false); });
+    });
+    mutationObserver.observe(document.body, { childList: true, subtree: true });
+    const transitionKey = (event) => `${event.propertyName}#${transitionTargetId(event.target)}`;
+    const onTransitionStart = (event) => {
+        const ceilingMs = (appearance?.transitionCeilingSeconds ?? 1.5) * 1000;
+        runningTransitions.set(transitionKey(event), host.now() + ceilingMs);
+        kick();
+    };
+    const onTransitionEnd = (event) => {
+        runningTransitions.delete(transitionKey(event));
+        draw(false);
+    };
+    document.addEventListener('transitionstart', onTransitionStart, true);
+    document.addEventListener('transitionend', onTransitionEnd, true);
+    document.addEventListener('transitioncancel', onTransitionEnd, true);
+    // Hover: read from the document (the canvas takes no pointer events), resolved to the region under the pointer.
+    const onPointerOver = (event) => {
+        const target = event.target instanceof Element ? event.target.closest('[data-component-area]') : null;
+        if (renderer.setHovered(target && observed.has(target) ? target : null))
+            kick();
+    };
+    const onPointerOut = (event) => {
+        if (event.relatedTarget !== null)
+            return;
+        if (renderer.setHovered(null))
+            kick();
+    };
+    document.addEventListener('pointerover', onPointerOver, { passive: true });
+    document.addEventListener('pointerout', onPointerOut, { passive: true });
+    const onContextLost = (event) => { event.preventDefault(); contextLost = true; };
+    const onContextRestored = () => { contextLost = false; draw(true); };
+    host.canvas.addEventListener('webglcontextlost', onContextLost);
+    host.canvas.addEventListener('webglcontextrestored', onContextRestored);
+    const driver = {
+        setAppearance(next) {
+            appearance = next ?? appearance;
+            renderer.setAppearance(next, { animate: hadAppearance && host.crossFadeAppearance });
+            hadAppearance = hadAppearance || next !== null;
+            draw(true);
+        },
+        redraw() {
+            draw(true);
+        },
+        setNavigation(signature) {
+            if (signature === '')
+                return;
+            const previous = navigationSignature;
+            navigationSignature = signature;
+            if (previous === null || previous === signature)
+                return;
+            const outcome = renderer.pulse(FrameTransitionTrigger.NAVIGATION);
+            if (outcome === FramePulseOutcome.STARTED)
+                started(FrameTransitionTrigger.NAVIGATION);
+            if (outcome !== FramePulseOutcome.NOT_PLAYED)
+                kick();
+        },
+        setFocusedZone(zone) {
+            if (zone === focusedZone)
+                return;
+            focusedZone = zone;
+            draw(false);
+        },
+        dispose() {
+            resizeObserver.disconnect();
+            mutationObserver.disconnect();
+            host.cancelFrame(mutationHandle);
+            host.cancelFrame(loopHandle);
+            document.removeEventListener('transitionstart', onTransitionStart, true);
+            document.removeEventListener('transitionend', onTransitionEnd, true);
+            document.removeEventListener('transitioncancel', onTransitionEnd, true);
+            document.removeEventListener('pointerover', onPointerOver);
+            document.removeEventListener('pointerout', onPointerOut);
+            host.canvas.removeEventListener('webglcontextlost', onContextLost);
+            host.canvas.removeEventListener('webglcontextrestored', onContextRestored);
+        },
+    };
+    // The current appearance, applied at once: a driver re-created by its host (a new renderer, a new camera) must
+    // not wait for the NEXT appearance change to show anything.
+    driver.setAppearance(initialAppearance);
+    return driver;
+}
+/** A stable identity per transitioning element, so two elements animating the same property are two entries. */
+const transitionTargetIds = new WeakMap();
+let nextTransitionTargetId = 0;
+function transitionTargetId(target) {
+    if (!target)
+        return -1;
+    let id = transitionTargetIds.get(target);
+    if (id === undefined) {
+        id = nextTransitionTargetId++;
+        transitionTargetIds.set(target, id);
+    }
+    return id;
+}
+//# sourceMappingURL=frame-driver.js.map

package/dist/esm/frame/frame-driver.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"frame-driver.js","sourceRoot":"","sources":["../../../../src/frame/frame-driver.ts"],"names":[],"mappings":"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","sourcesContent":["import type { FrameAppearance } from './frame-appearance';\nimport { ShellRegion } from '@wildo-ai/presets-components-models';\n\nimport { FramePulseOutcome, FrameTransitionTrigger, type FrameRegionBox, type FrameRenderer, type FrameViewport, type FrameZoneBox } from './frame-renderer';\nimport { findNavigationZoneElements, findShellRegionElements, measureNavigationZones, measureShellRegions } from '../shell-region-measurement';\n\n/** What the driver needs from its host. Injected, so the scheduling is tested with fake clocks and observers. */\nexport interface FrameDriverHost {\n  renderer: Pick<FrameRenderer, 'setAppearance' | 'setLayout' | 'setHovered' | 'setZones' | 'rimmedZone' | 'pulse' | 'hasPendingMotion' | 'tick'>;\n  /** Renders the scene as the renderer last left it. */\n  renderScene: () => void;\n  /** The canvas' size in CSS pixels, as the camera was fitted to it. */\n  viewport: () => FrameViewport;\n  /** The canvas element, for context-loss events. */\n  canvas: EventTarget;\n  document: Document;\n  requestFrame: (callback: () => void) => number;\n  cancelFrame: (handle: number) => void;\n  now: () => number;\n  createResizeObserver: (callback: () => void) => Pick<ResizeObserver, 'observe' | 'unobserve' | 'disconnect'>;\n  createMutationObserver: (callback: () => void) => Pick<MutationObserver, 'observe' | 'disconnect'>;\n  /** Whether an appearance change after the first cross-fades (the layout's transitions) or is shown at once. */\n  crossFadeAppearance: boolean;\n  /**\n   * A transition of the frame started (#1826). The canvas counts them on its element, so a live probe can tell that a\n   * choreography ran — draws alone cannot, since a hover or a re-layout draws too.\n   */\n  onTransitionStarted?: (trigger: FrameTransitionTrigger) => void;\n}\n\n/** The canvas-facing surface of a running driver. */\nexport interface FrameDriver {\n  /** A new appearance: shown at once the first time, cross-faded afterwards. */\n  setAppearance(appearance: FrameAppearance | null): void;\n  /** The canvas resized or its pixel ratio changed: the drawing buffer was cleared, so redraw regardless. */\n  redraw(): void;\n  /**\n   * The content's identity: the structural zones' top entries, as the navigation state reports them (#1826). The\n   * first value only records; every later CHANGE plays the layout's navigation choreography. An EMPTY signature (no\n   * zone holds anything yet: the route sync has not landed) is not a place and is never recorded, so the first\n   * landing after the canvas mounted is not played as a navigation.\n   */\n  setNavigation(signature: string): void;\n  /** The navigation state's focused zone (a `data-content-area` value), or null. */\n  setFocusedZone(zone: string | null): void;\n  dispose(): void;\n}\n\n/**\n * The frame's scheduler (#1823): decides WHEN the renderer draws, and nothing about what it draws.\n *\n * - **At rest**, it draws synchronously inside the callback of whatever changed a region's box (ResizeObserver,\n *   a region mounting or leaving), so a slab never lags its region by a frame — and draws NOTHING when every box\n *   is where it was.\n * - **While something moves** — a CSS transition in the shell, a cross-fade, a hover emphasis — it runs one loop\n *   per animation frame. The loop still renders only when a box moved or the renderer has motion pending. A\n *   `transitionstart` anywhere in the document (a button's hover colour) keeps the loop ALIVE, so a moving\n *   sidebar is followed frame by frame, but a frame where nothing in the scene changed costs no draw.\n * - **A navigation or a zone focus** (#1826) is an input from the DOM tree (`setNavigation`, `setFocusedZone`); a\n *   **sidebar resize** is read off the measurement itself (its width changed while it stayed on screen). Each starts\n *   the renderer's choreography and the same loop, which stops the frame the choreography settles. The zone\n *   containers are observed like the regions, so a split resized by dragging its divider keeps the rim on the zone.\n * - **After a context loss**, it draws nothing until the context is restored.\n */\nexport function createFrameDriver(host: FrameDriverHost, initialAppearance: FrameAppearance | null): FrameDriver {\n  const { renderer, document } = host;\n  let contextLost = false;\n  let hadAppearance = false;\n  let appearance: FrameAppearance | null = null;\n  const observed = new Set<HTMLElement>();\n  const observedZones = new Set<HTMLElement>();\n  const resizeObserver = host.createResizeObserver(() => draw(false));\n  let navigationSignature: string | null = null;\n  let focusedZone: string | null = null;\n  /** The sidebar's width at the last measurement, or null when it was not on screen. */\n  let sidebarWidth: number | null = null;\n  const started = (trigger: FrameTransitionTrigger): void => host.onTransitionStarted?.(trigger);\n\n  const observeOnly = (present: Set<HTMLElement>, into: Set<HTMLElement>): void => {\n    for (const element of present) if (!into.has(element)) { resizeObserver.observe(element); into.add(element); }\n    for (const element of into) if (!present.has(element)) { resizeObserver.unobserve(element); into.delete(element); }\n  };\n\n  const measure = (): boolean => {\n    // Every marked region and zone is OBSERVED, whatever its box: one collapsed to nothing must redraw the moment it reappears.\n    observeOnly(new Set(findShellRegionElements(document)), observed);\n    observeOnly(new Set(findNavigationZoneElements(document)), observedZones);\n    const boxes: FrameRegionBox[] = measureShellRegions(document).map(({ element, region, left, top, width, height, glass }) => ({ element, region, left, top, width, height, glass }));\n    const zones = measureNavigationZones(document);\n    const focused = zones.find((zone) => zone.zone === focusedZone)?.element ?? null;\n    const zoneBoxes: FrameZoneBox[] = zones.map(({ element, left, top, width, height }) => ({ element, left, top, width, height }));\n    const moved = renderer.setLayout(boxes, host.viewport());\n    // A sidebar resize: its width changed while it stayed on screen. A sidebar that appears (labels ready, an\n    // organization switch) or leaves is not one. Every frame of its animation extends the same pulse.\n    const sidebar = boxes.find((box) => box.region === ShellRegion.SIDEBAR);\n    const width = sidebar ? sidebar.width : null;\n    const resizing = width !== null && sidebarWidth !== null && width !== sidebarWidth;\n    sidebarWidth = width;\n    // Reported when a pulse STARTS, never per frame: a ResizeObserver measure between two animation frames sees an\n    // unchanged width, so any \"was it resizing last time\" flag would re-arm and count every frame of the animation.\n    if (resizing && renderer.pulse(FrameTransitionTrigger.SIDEBAR_RESIZE) === FramePulseOutcome.STARTED) started(FrameTransitionTrigger.SIDEBAR_RESIZE);\n    const rimmedBefore = renderer.rimmedZone();\n    const zonesChanged = renderer.setZones(zoneBoxes, focused);\n    const rimmedAfter = renderer.rimmedZone();\n    if (rimmedAfter !== null && rimmedAfter !== rimmedBefore) started(FrameTransitionTrigger.ZONE_FOCUS);\n    return zonesChanged || moved || resizing;\n  };\n\n  const renderFrame = (): void => {\n    renderer.tick(host.now());\n    host.renderScene();\n  };\n\n  // A running CSS transition, per (property, element); the deadline stops following one whose end never arrives.\n  const runningTransitions = new Map<string, number>();\n  let loopHandle = 0;\n  const kick = (): void => {\n    if (!loopHandle) loopHandle = host.requestFrame(loop);\n  };\n  const loop = (): void => {\n    loopHandle = 0;\n    if (contextLost) return;\n    const now = host.now();\n    for (const [key, deadline] of runningTransitions) if (now > deadline) runningTransitions.delete(key);\n    const moved = measure();\n    if (moved || renderer.hasPendingMotion()) renderFrame();\n    if (renderer.hasPendingMotion() || runningTransitions.size > 0) kick();\n  };\n\n  function draw(force: boolean): void {\n    if (contextLost) return;\n    const moved = measure();\n    if (!moved && !force && !renderer.hasPendingMotion()) return;\n    renderFrame();\n    if (renderer.hasPendingMotion()) kick();\n  }\n\n  // Regions render nothing until their labels are ready and remount on an organization switch: re-query, at most\n  // once per animation frame, whenever the DOM gains or loses nodes.\n  let mutationHandle = 0;\n  const mutationObserver = host.createMutationObserver(() => {\n    if (mutationHandle) return;\n    mutationHandle = host.requestFrame(() => { mutationHandle = 0; draw(false); });\n  });\n  mutationObserver.observe(document.body, { childList: true, subtree: true });\n\n  const transitionKey = (event: Event): string => `${(event as TransitionEvent).propertyName}#${transitionTargetId(event.target)}`;\n  const onTransitionStart = (event: Event): void => {\n    const ceilingMs = (appearance?.transitionCeilingSeconds ?? 1.5) * 1000;\n    runningTransitions.set(transitionKey(event), host.now() + ceilingMs);\n    kick();\n  };\n  const onTransitionEnd = (event: Event): void => {\n    runningTransitions.delete(transitionKey(event));\n    draw(false);\n  };\n  document.addEventListener('transitionstart', onTransitionStart, true);\n  document.addEventListener('transitionend', onTransitionEnd, true);\n  document.addEventListener('transitioncancel', onTransitionEnd, true);\n\n  // Hover: read from the document (the canvas takes no pointer events), resolved to the region under the pointer.\n  const onPointerOver = (event: Event): void => {\n    const target = event.target instanceof Element ? event.target.closest<HTMLElement>('[data-component-area]') : null;\n    if (renderer.setHovered(target && observed.has(target) ? target : null)) kick();\n  };\n  const onPointerOut = (event: Event): void => {\n    if ((event as PointerEvent).relatedTarget !== null) return;\n    if (renderer.setHovered(null)) kick();\n  };\n  document.addEventListener('pointerover', onPointerOver, { passive: true });\n  document.addEventListener('pointerout', onPointerOut, { passive: true });\n\n  const onContextLost = (event: Event): void => { event.preventDefault(); contextLost = true; };\n  const onContextRestored = (): void => { contextLost = false; draw(true); };\n  host.canvas.addEventListener('webglcontextlost', onContextLost);\n  host.canvas.addEventListener('webglcontextrestored', onContextRestored);\n\n  const driver: FrameDriver = {\n    setAppearance(next) {\n      appearance = next ?? appearance;\n      renderer.setAppearance(next, { animate: hadAppearance && host.crossFadeAppearance });\n      hadAppearance = hadAppearance || next !== null;\n      draw(true);\n    },\n    redraw() {\n      draw(true);\n    },\n    setNavigation(signature) {\n      if (signature === '') return;\n      const previous = navigationSignature;\n      navigationSignature = signature;\n      if (previous === null || previous === signature) return;\n      const outcome = renderer.pulse(FrameTransitionTrigger.NAVIGATION);\n      if (outcome === FramePulseOutcome.STARTED) started(FrameTransitionTrigger.NAVIGATION);\n      if (outcome !== FramePulseOutcome.NOT_PLAYED) kick();\n    },\n    setFocusedZone(zone) {\n      if (zone === focusedZone) return;\n      focusedZone = zone;\n      draw(false);\n    },\n    dispose() {\n      resizeObserver.disconnect();\n      mutationObserver.disconnect();\n      host.cancelFrame(mutationHandle);\n      host.cancelFrame(loopHandle);\n      document.removeEventListener('transitionstart', onTransitionStart, true);\n      document.removeEventListener('transitionend', onTransitionEnd, true);\n      document.removeEventListener('transitioncancel', onTransitionEnd, true);\n      document.removeEventListener('pointerover', onPointerOver);\n      document.removeEventListener('pointerout', onPointerOut);\n      host.canvas.removeEventListener('webglcontextlost', onContextLost);\n      host.canvas.removeEventListener('webglcontextrestored', onContextRestored);\n    },\n  };\n  // The current appearance, applied at once: a driver re-created by its host (a new renderer, a new camera) must\n  // not wait for the NEXT appearance change to show anything.\n  driver.setAppearance(initialAppearance);\n  return driver;\n}\n\n/** A stable identity per transitioning element, so two elements animating the same property are two entries. */\nconst transitionTargetIds = new WeakMap<object, number>();\nlet nextTransitionTargetId = 0;\nfunction transitionTargetId(target: EventTarget | null): number {\n  if (!target) return -1;\n  let id = transitionTargetIds.get(target);\n  if (id === undefined) { id = nextTransitionTargetId++; transitionTargetIds.set(target, id); }\n  return id;\n}\n"]}

package/dist/esm/frame/frame-renderer.d.ts

@@ -0,0 +1,141 @@
+import { Group } from 'three';
+import { ShellRegion } from '@wildo-ai/presets-components-models';
+import type { FrameAppearance, FrameEasing } from './frame-appearance';
+import { type Layout3DTransitions } from '../layout/layout-3d-vocabulary';
+/** One region the frame draws under, as measured off the DOM. */
+export interface FrameRegionBox {
+    /** The region's element: the identity a slab (and its hover state) follows across redraws. */
+    element: object;
+    region: ShellRegion;
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+    /** The region already renders a glass material (`data-material-kind="glass"`): no slab under it (#1823, no double glass). */
+    glass: boolean;
+}
+/** One navigation zone inside the content region, as measured off the DOM (#1826). */
+export interface FrameZoneBox {
+    /** The zone container: the identity its rim emphasis follows across redraws. */
+    element: object;
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+}
+/** The canvas' size in CSS pixels, which the orthographic camera is fitted to. */
+export interface FrameViewport {
+    width: number;
+    height: number;
+}
+/**
+ * What starts a transition of the frame (#1826). The driver reports each start to its host, which is how a live
+ * probe tells that a choreography ran rather than inferring it from draws.
+ */
+export declare enum FrameTransitionTrigger {
+    /** A structural zone's top entry became another place. Plays the layout's `navigation` choreography. */
+    NAVIGATION = "navigation",
+    /** The sidebar's width changed while it stayed on screen. Plays the layout's `sidebarResize` choreography. */
+    SIDEBAR_RESIZE = "sidebar-resize",
+    /** The focused zone of a split changed, and the layout rims it. */
+    ZONE_FOCUS = "zone-focus"
+}
+/** What a {@link FrameRenderer.pulse} call did. */
+export declare enum FramePulseOutcome {
+    /** Nothing plays: no choreography for the trigger, reduced motion, or no appearance yet. */
+    NOT_PLAYED = "not-played",
+    /** A new pulse started (from rest, or a new rise out of a settle): a transition the driver reports. */
+    STARTED = "started",
+    /** The trigger's pulse was already rising and keeps rising: nothing new to report. */
+    ALREADY_RISING = "already-rising"
+}
+/** The triggers that play a pulse-shaped {@link Layout3DFrameChoreography}. */
+export type FramePulseTrigger = FrameTransitionTrigger.NAVIGATION | FrameTransitionTrigger.SIDEBAR_RESIZE;
+/**
+ * The frame's scene, driven imperatively (#1823).
+ *
+ * It owns the meshes and their uniforms and nothing else: WHEN to draw is the canvas driver's decision. Every
+ * method is a plain state change plus {@link tick}, which applies the state for an instant and says whether
+ * anything is still animating — so the whole scene logic runs, and is tested, without a WebGL context.
+ *
+ * Hover emphasises the RIM only, and its progress is clamped to 0–1 even when a spring overshoots. The frost never
+ * changes on hover, so hover cannot take a colour outside the contrast bound the appearance derivation proved.
+ */
+export declare class FrameRenderer {
+    private readonly group;
+    private readonly geometry;
+    private readonly backgroundMesh;
+    private readonly slabs;
+    private boxes;
+    private viewport;
+    private layoutSignature;
+    /** What is on screen now: the last frame applied, mid-cross-fade included. A new appearance fades FROM this. */
+    private shown;
+    private tween;
+    private appearance;
+    private hovered;
+    private readonly hover;
+    private readonly choreographies;
+    private readonly rimsFocusedZone;
+    private readonly pulses;
+    /** The zone the rim is moving toward, or null. */
+    private rimmed;
+    private zones;
+    private zoneSignature;
+    private focusedZone;
+    /** Each zone's rim emphasis, 0 to 1, stepped exactly like a hover emphasis. */
+    private readonly zoneEmphasis;
+    private readonly zoneRims;
+    /**
+     * @param transitions What the layout plays on a navigation, a sidebar resize and a zone focus. Defaults to nothing:
+     *   a renderer with no layout behind it (a test, a probe) draws the regions and moves only on appearance and hover.
+     */
+    constructor(group: Group, transitions?: Pick<Layout3DTransitions, 'navigation' | 'sidebarResize' | 'zoneFocus'>);
+    /**
+     * The appearance to draw. With `animate`, the change cross-fades over the appearance's transition time —
+     * except when the FOREGROUND changed (a light/dark switch): text switches colour at once, and a backdrop
+     * halfway between two modes is bounded against neither foreground, so the frame switches at once too.
+     */
+    setAppearance(appearance: FrameAppearance | null, options: {
+        animate: boolean;
+    }): void;
+    /** The measured regions. Returns false when nothing moved, so the caller can skip the frame entirely. */
+    setLayout(boxes: FrameRegionBox[], viewport: FrameViewport): boolean;
+    /**
+     * The region element under the pointer, or null. Its rim moves toward the hover opacity — unless the
+     * appearance says the frame is static (reduced motion). Returns whether anything will change on screen.
+     */
+    setHovered(element: object | null): boolean;
+    /**
+     * A shell state changed (#1826): play the layout's choreography for that trigger. Nothing plays when the layout
+     * declares none for it, under reduced motion (the frame is static), or when the theme's motion duration is zero.
+     * Says whether a pulse STARTED, was already rising, or nothing plays.
+     */
+    pulse(trigger: FramePulseTrigger): FramePulseOutcome;
+    /** The zone whose rim is shown or moving in, or null: what the driver compares to report a zone-focus transition. */
+    rimmedZone(): object | null;
+    /**
+     * The navigation zones inside the content region, and the focused one (the navigation state's `focusedZone`), or
+     * null. When the layout rims the focused zone and two or more zones are side by side, the focused one's rim moves
+     * toward full emphasis and every other zone's back to none. Returns whether anything will change on screen.
+     */
+    setZones(zones: FrameZoneBox[], focused: object | null): boolean;
+    /** Whether a cross-fade, a hover or zone emphasis, or a pulse is still moving: the only reasons to draw when no region moved. */
+    hasPendingMotion(): boolean;
+    /** Apply the state for instant `now` (ms). Returns true while a cross-fade or a hover emphasis is still moving. */
+    tick(now: number): boolean;
+    dispose(): void;
+    private apply;
+    /**
+     * The focused zone's rim, drawn over the content slab: the content slab's rim colour and width, at most its HOVER
+     * opacity, and no fill. Each rim is inset from the content box by the content rim's own width, so it never lands
+     * on the content slab's rim band — where it is drawn, it is exactly the case the contrast bound was proved for.
+     */
+    private applyZoneRims;
+    /** Point every zone's rim emphasis at its target: 1 for the focused zone of a split, 0 otherwise. Returns whether any target moved. */
+    private retargetZoneEmphasis;
+    private createSlab;
+}
+/** A cubic-Bézier easing evaluated at `x` in 0–1, as CSS `cubic-bezier()` defines it (x → y, solved by Newton then bisection). */
+export declare function evaluateEasing([x1, y1, x2, y2]: FrameEasing, x: number): number;
+//# sourceMappingURL=frame-renderer.d.ts.map

package/dist/esm/frame/frame-renderer.d.ts.map

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