@nadicodeai/ui 12.1.136 → 12.1.137

package/dist/components/agent-orb.d.ts

@@ -35,7 +35,9 @@ export type AgentOrbProps = AgentOrbBaseProps & ({
  * @family Status
  * @when An Agent, anywhere: 20 in the sidebar, 32 in a row, 64 on her Profile card, 96 in an Agent
  * card, 160 on entry. There is no other Agent picture. The sizes are 20, 24, 32, 40, 64, 96 and
- * 160 px, and no other. On a photograph the orb takes the stronger `presence="over-picture"`
+ * 160 px, and no other. Detail follows the size the orb is drawn at: up to 32 px it draws the
+ * engine's lightest dot profile, at 40 px the middle one and from 64 px the full one, since a small
+ * orb cannot show the full profile's dots apart. On a photograph the orb takes the stronger `presence="over-picture"`
  * weight; everywhere else it is `plain`.
  * @instead A person is an `Avatar`. The system's own wait is the waiting line, never an orb. An orb
  * in artwork, such as a sign-in picture, takes `motion="ambient"` and claims no activity. An orb
@@ -47,6 +49,8 @@ export type AgentOrbProps = AgentOrbBaseProps & ({
  * Done celebrates once over 4.8 s, then rests at 72% of native particle speed with the Idle breath.
  * A state change interrupts the previous gesture; `motionKey` replays it and `paused` freezes it. A surface that only knows a machine checked in draws idle. No state draws
  * a circle around the orb. Ambient motion moves the form at its own pace with no state pose or cue.
+ * An orb at rest (idle, ambient, or done after its celebration) paints 15 frames a second; every
+ * other state, gesture and the celebration paint 30. The pace is the same at either rate.
  * Reduced motion: movement stops, a thinking or working orb breathes between full ink and 0.45
  * opacity so busy still reads as busy, an ambient orb holds still, and waiting and blocked keep
  * their centered signs without an entrance gesture.

package/dist/components/agent-orb.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"agent-orb.d.ts","sourceRoot":"","sources":["../../src/components/agent-orb.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,aAAa,EAAqB,MAAM,OAAO,CAAC;AAE9D,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,gBAAgB,EACrB,KAAK,YAAY,EAElB,MAAM,uBAAuB,CAAC;AAG/B,YAAY,EACV,cAAc,EACd,YAAY,EACZ,cAAc,EACd,gBAAgB,EAChB,YAAY,GACb,MAAM,uBAAuB,CAAC;AAE/B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAClE,YAAY,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAElE,KAAK,iBAAiB,GAAG;IACvB,4FAA4F;IAC5F,IAAI,EAAE,cAAc,CAAC;IACrB,wFAAwF;IACxF,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IAC/B,qEAAqE;IACrE,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,wFAAwF;IACxF,QAAQ,CAAC,EAAE,gBAAgB,CAAC;IAC5B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,iBAAiB,GAC3C,CAAC;IAAE,MAAM,CAAC,EAAE,QAAQ,CAAC;IAAC,KAAK,CAAC,EAAE,aAAa,CAAA;CAAE,GAAG;IAAE,MAAM,EAAE,SAAS,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC,GACrF,CAAC;IAAE,UAAU,EAAE,IAAI,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAA;CAAE,GAAG;IAAE,UAAU,CAAC,EAAE,KAAK,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAEhF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,KAAK,EACL,IAAS,EACT,QAAkB,EAClB,MAAc,EACd,KAAc,EACd,MAAiB,EACjB,SAAa,EACb,UAAkB,EAClB,KAAK,EACL,SAAS,GACV,EAAE,aAAa,+BAyDf"}
+{"version":3,"file":"agent-orb.d.ts","sourceRoot":"","sources":["../../src/components/agent-orb.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,aAAa,EAAqB,MAAM,OAAO,CAAC;AAE9D,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,gBAAgB,EACrB,KAAK,YAAY,EAElB,MAAM,uBAAuB,CAAC;AAG/B,YAAY,EACV,cAAc,EACd,YAAY,EACZ,cAAc,EACd,gBAAgB,EAChB,YAAY,GACb,MAAM,uBAAuB,CAAC;AAE/B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAClE,YAAY,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAElE,KAAK,iBAAiB,GAAG;IACvB,4FAA4F;IAC5F,IAAI,EAAE,cAAc,CAAC;IACrB,wFAAwF;IACxF,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IAC/B,qEAAqE;IACrE,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,wFAAwF;IACxF,QAAQ,CAAC,EAAE,gBAAgB,CAAC;IAC5B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,iBAAiB,GAC3C,CAAC;IAAE,MAAM,CAAC,EAAE,QAAQ,CAAC;IAAC,KAAK,CAAC,EAAE,aAAa,CAAA;CAAE,GAAG;IAAE,MAAM,EAAE,SAAS,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC,GACrF,CAAC;IAAE,UAAU,EAAE,IAAI,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAA;CAAE,GAAG;IAAE,UAAU,CAAC,EAAE,KAAK,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAEhF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CG;AACH,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,KAAK,EACL,IAAS,EACT,QAAkB,EAClB,MAAc,EACd,KAAc,EACd,MAAiB,EACjB,SAAa,EACb,UAAkB,EAClB,KAAK,EACL,SAAS,GACV,EAAE,aAAa,+BAyDf"}

package/dist/components/agent-orb.js

@@ -9,7 +9,9 @@ import { cn } from "../lib/utils.js";
  * @family Status
  * @when An Agent, anywhere: 20 in the sidebar, 32 in a row, 64 on her Profile card, 96 in an Agent
  * card, 160 on entry. There is no other Agent picture. The sizes are 20, 24, 32, 40, 64, 96 and
- * 160 px, and no other. On a photograph the orb takes the stronger `presence="over-picture"`
+ * 160 px, and no other. Detail follows the size the orb is drawn at: up to 32 px it draws the
+ * engine's lightest dot profile, at 40 px the middle one and from 64 px the full one, since a small
+ * orb cannot show the full profile's dots apart. On a photograph the orb takes the stronger `presence="over-picture"`
  * weight; everywhere else it is `plain`.
  * @instead A person is an `Avatar`. The system's own wait is the waiting line, never an orb. An orb
  * in artwork, such as a sign-in picture, takes `motion="ambient"` and claims no activity. An orb
@@ -21,6 +23,8 @@ import { cn } from "../lib/utils.js";
  * Done celebrates once over 4.8 s, then rests at 72% of native particle speed with the Idle breath.
  * A state change interrupts the previous gesture; `motionKey` replays it and `paused` freezes it. A surface that only knows a machine checked in draws idle. No state draws
  * a circle around the orb. Ambient motion moves the form at its own pace with no state pose or cue.
+ * An orb at rest (idle, ambient, or done after its celebration) paints 15 frames a second; every
+ * other state, gesture and the celebration paint 30. The pace is the same at either rate.
  * Reduced motion: movement stops, a thinking or working orb breathes between full ink and 0.45
  * opacity so busy still reads as busy, an ambient orb holds still, and waiting and blocked keep
  * their centered signs without an entrance gesture.

package/dist/components/company-card/renderer.d.ts

@@ -1,6 +1,14 @@
+import * as webgpu from "vgpu";
+import type { Gpu, Surface, Target } from "vgpu";
 import { type FoilColors } from "./scene.js";
+type Webgpu = Pick<typeof webgpu, "clock" | "frameLoop" | "init"> & {
+    surface: (gpu: Gpu, canvas: HTMLCanvasElement, options: {
+        dpr: [number, number];
+    }) => Target & Pick<Surface, "onResize">;
+};
 type RendererOptions = {
     colors: FoilColors;
+    vgpu?: Webgpu;
     /** The card's current turn in radians, for the page to turn the card itself. */
     onTilt: (tiltX: number, tiltY: number) => void;
 };

package/dist/components/company-card/renderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"renderer.d.ts","sourceRoot":"","sources":["../../../src/components/company-card/renderer.ts"],"names":[],"mappings":"AAQA,OAAO,EAAe,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAEvD,KAAK,eAAe,GAAG;IACrB,MAAM,EAAE,UAAU,CAAC;IACnB,gFAAgF;IAChF,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAChD,CAAC;AAEF,wBAAgB,cAAc,CAAC,MAAM,EAAE,iBAAiB,EAAE,OAAO,EAAE,eAAe;;;;EA+HjF"}
+{"version":3,"file":"renderer.d.ts","sourceRoot":"","sources":["../../../src/components/company-card/renderer.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,MAAM,MAAM,CAAC;AAC/B,OAAO,KAAK,EAA0B,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,MAAM,CAAC;AAEzE,OAAO,EAAe,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AASvD,KAAK,MAAM,GAAG,IAAI,CAAC,OAAO,MAAM,EAAE,OAAO,GAAG,WAAW,GAAG,MAAM,CAAC,GAAG;IAClE,OAAO,EAAE,CACP,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,iBAAiB,EACzB,OAAO,EAAE;QAAE,GAAG,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;KAAE,KAC/B,MAAM,GAAG,IAAI,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC;CACzC,CAAC;AAEF,KAAK,eAAe,GAAG;IACrB,MAAM,EAAE,UAAU,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,gFAAgF;IAChF,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAChD,CAAC;AAEF,wBAAgB,cAAc,CAAC,MAAM,EAAE,iBAAiB,EAAE,OAAO,EAAE,eAAe;;;;EA+LjF"}

package/dist/components/company-card/renderer.js

@@ -1,14 +1,18 @@
 // nadicode: vgpu's holographic card renderer (MIT, https://github.com/vercel-labs/vgpu,
-// examples/holographic-card, revision 6fa27bb4), with its WebGPU set-up, frame
-// loop and cleanup as they are. The pointer is read on the whole page, as the
-// example reads it on its whole stage, so the foil wakes as the pointer comes
-// within one card width; the turn it computes is handed to the page, which
-// turns the card and its words together.
-import { clock, frameLoop, init, surface } from "vgpu";
+// examples/holographic-card, revision 6fa27bb4), with its WebGPU set-up and
+// cleanup as they are.
+import * as webgpu from "vgpu";
 import { approach, SWEEP_MS, SWEEP_TURN } from "./approach.js";
 import { createScene } from "./scene.js";
+const AT_REST = 1e-4;
+/**
+ * The first frame after the loop starts again counts as one frame of the
+ * 60 fps it runs at, not the time it was stopped.
+ */
+const FRAME_SECONDS = 1 / 60;
 export function createRenderer(canvas, options) {
-    const { colors, onTilt } = options;
+    const { colors, onTilt, vgpu = webgpu } = options;
+    const { clock, frameLoop, init, surface } = vgpu;
     let disposed = false;
     let gpu;
     let removeInput = () => { };
@@ -33,6 +37,7 @@ export function createRenderer(canvas, options) {
         if (disposed)
             return;
         const motion = window.matchMedia("(prefers-reduced-motion: reduce)");
+        const time = clock(context);
         let targetHover = 0;
         let pointerX = 0;
         let pointerY = 0;
@@ -46,52 +51,32 @@ export function createRenderer(canvas, options) {
         // from its top-left corner to its bottom-right, then rests. It tells a
         // person at a glance that this is a card that answers the pointer.
         let sweepStart = null;
-        // Under reduced motion the card keeps still: the light moves only with the pointer.
-        requestSweep = () => {
-            if (!motion.matches)
-                sweepStart = performance.now();
-        };
-        const move = (event) => {
-            if (!event.isPrimary)
-                return;
-            const near = approach(canvas.getBoundingClientRect(), event.clientX, event.clientY);
-            // A pointer elsewhere on the page leaves a sweep to finish; one that
-            // comes near takes the card over.
-            if (near.hover > 0)
-                sweepStart = null;
-            if (sweepStart !== null)
-                return;
-            pointerX = near.x;
-            pointerY = near.y;
-            targetHover = near.hover;
-        };
-        const leave = () => {
-            if (sweepStart === null)
-                targetHover = 0;
-        };
-        const up = (event) => {
-            if (event.pointerType !== "mouse")
-                leave();
-        };
-        const root = document.documentElement;
-        window.addEventListener("pointermove", move, { passive: true });
-        window.addEventListener("pointerdown", move, { passive: true });
-        window.addEventListener("pointercancel", leave);
-        window.addEventListener("pointerup", up);
-        root.addEventListener("pointerleave", leave);
-        const unsubscribeResize = output.onResize(() => {
-            shader.set({ params: { resolution: output.size } });
-        });
-        removeInput = () => {
-            window.removeEventListener("pointermove", move);
-            window.removeEventListener("pointerdown", move);
-            window.removeEventListener("pointercancel", leave);
-            window.removeEventListener("pointerup", up);
-            root.removeEventListener("pointerleave", leave);
-            unsubscribeResize();
+        let pointer = null;
+        let needsDraw = true;
+        let onScreen = false;
+        let loop = null;
+        const stop = () => {
+            loop?.stop();
+            loop = null;
         };
-        const time = clock(context);
-        frameLoop(context, (currentFrame) => {
+        const settled = (targetX, targetY, within) => sweepStart === null &&
+            Math.abs(targetX - tiltX) <= within &&
+            Math.abs(targetY - tiltY) <= within &&
+            Math.abs(targetHover - hover) <= within &&
+            (targetHover === 0 ||
+                (Math.abs(pointerX - lightX) <= within && Math.abs(pointerY - lightY) <= within));
+        const draw = (currentFrame) => {
+            if (pointer) {
+                const near = approach(canvas.getBoundingClientRect(), pointer.clientX, pointer.clientY);
+                pointer = null;
+                if (near.hover > 0)
+                    sweepStart = null;
+                if (sweepStart === null) {
+                    pointerX = near.x;
+                    pointerY = near.y;
+                    targetHover = near.hover;
+                }
+            }
             let turn = null;
             if (sweepStart !== null) {
                 const progress = (performance.now() - sweepStart) / SWEEP_MS;
@@ -116,6 +101,11 @@ export function createRenderer(canvas, options) {
             const targetY = motion.matches
                 ? 0
                 : (turn?.[1] ?? -Math.max(-1, Math.min(1, pointerY)) * 0.12 * targetHover);
+            if (!needsDraw && settled(targetX, targetY, 0)) {
+                currentFrame.cancel();
+                stop();
+                return;
+            }
             const blend = motion.matches ? 1 : 1 - Math.exp(-10 * Math.min(time.deltaTime, 0.1));
             tiltX += (targetX - tiltX) * blend;
             tiltY += (targetY - tiltY) * blend;
@@ -124,10 +114,89 @@ export function createRenderer(canvas, options) {
                 lightX += (pointerX - lightX) * blend;
                 lightY += (pointerY - lightY) * blend;
             }
+            const resting = settled(targetX, targetY, AT_REST);
+            if (resting) {
+                tiltX = targetX;
+                tiltY = targetY;
+                hover = targetHover;
+                if (targetHover > 0) {
+                    lightX = pointerX;
+                    lightY = pointerY;
+                }
+            }
             onTilt(tiltX, tiltY);
             shader.set({ params: { tilt: [tiltX, tiltY], pointer: [lightX, lightY], hover } });
             currentFrame.pass(output, shader);
-        }, { fps: 60 });
+            needsDraw = false;
+            if (resting)
+                stop();
+        };
+        const play = () => {
+            if (disposed || !onScreen || document.hidden) {
+                stop();
+                return;
+            }
+            if (loop)
+                return;
+            time.advance(FRAME_SECONDS);
+            loop = frameLoop(context, draw, { fps: 60 });
+        };
+        // Under reduced motion the card keeps still: the light moves only with the pointer.
+        requestSweep = () => {
+            if (motion.matches)
+                return;
+            sweepStart = performance.now();
+            play();
+        };
+        const move = (event) => {
+            if (!event.isPrimary)
+                return;
+            pointer = { clientX: event.clientX, clientY: event.clientY };
+            play();
+        };
+        const leave = () => {
+            pointer = null;
+            if (sweepStart === null)
+                targetHover = 0;
+            play();
+        };
+        const up = (event) => {
+            if (event.pointerType !== "mouse")
+                leave();
+        };
+        const root = document.documentElement;
+        window.addEventListener("pointermove", move, { passive: true });
+        window.addEventListener("pointerdown", move, { passive: true });
+        window.addEventListener("pointercancel", leave);
+        window.addEventListener("pointerup", up);
+        root.addEventListener("pointerleave", leave);
+        document.addEventListener("visibilitychange", play);
+        motion.addEventListener("change", play);
+        // vgpu sizes the canvas on a frame, so a card whose box changes takes one to be drawn again.
+        const unsubscribeResize = output.onResize(() => {
+            shader.set({ params: { resolution: output.size } });
+            needsDraw = true;
+        });
+        const box = new ResizeObserver(play);
+        box.observe(canvas);
+        const visibility = new IntersectionObserver((entries) => {
+            onScreen = entries.at(-1)?.isIntersecting ?? false;
+            play();
+        });
+        visibility.observe(canvas);
+        removeInput = () => {
+            stop();
+            window.removeEventListener("pointermove", move);
+            window.removeEventListener("pointerdown", move);
+            window.removeEventListener("pointercancel", leave);
+            window.removeEventListener("pointerup", up);
+            root.removeEventListener("pointerleave", leave);
+            document.removeEventListener("visibilitychange", play);
+            motion.removeEventListener("change", play);
+            unsubscribeResize();
+            box.disconnect();
+            visibility.disconnect();
+        };
     })().catch((cause) => {
         if (disposed)
             return;

package/dist/components/company-card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"company-card.d.ts","sourceRoot":"","sources":["../../src/components/company-card.tsx"],"names":[],"mappings":"AASA,MAAM,MAAM,kBAAkB,GAAG,SAAS,GAAG,SAAS,CAAC;AAEvD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,eAAe,EAAE,MAAM,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;CAC3B,CAAC;AAqBF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,MAAM,EACN,OAAO,EACP,MAAM,EACN,MAAM,EACN,IAAI,EACJ,WAAmB,GACpB,EAAE;IACD,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,kBAAkB,CAAC;IAC5B,MAAM,EAAE,OAAO,CAAC;IAChB,MAAM,EAAE,iBAAiB,CAAC;IAC1B,gEAAgE;IAChE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,+BAiSA"}
+{"version":3,"file":"company-card.d.ts","sourceRoot":"","sources":["../../src/components/company-card.tsx"],"names":[],"mappings":"AASA,MAAM,MAAM,kBAAkB,GAAG,SAAS,GAAG,SAAS,CAAC;AAEvD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,eAAe,EAAE,MAAM,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;CAC3B,CAAC;AA0BF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,MAAM,EACN,OAAO,EACP,MAAM,EACN,MAAM,EACN,IAAI,EACJ,WAAmB,GACpB,EAAE;IACD,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,kBAAkB,CAAC;IAC5B,MAAM,EAAE,OAAO,CAAC;IAChB,MAAM,EAAE,iBAAiB,CAAC;IAC1B,gEAAgE;IAChE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,+BAsTA"}

package/dist/components/company-card.js

@@ -17,6 +17,10 @@ const FOIL = {
 const STRIPE = 34;
 /** How much of the card must be on screen before it turns, when the caller waits for it. */
 const IN_VIEW = 0.6;
+function setChanged(element, property, value) {
+    if (element.style.getPropertyValue(property) !== value)
+        element.style.setProperty(property, value);
+}
 function reason(cause) {
     return cause instanceof Error ? cause.message : String(cause);
 }
@@ -67,7 +71,6 @@ export function CompanyCard({ name, domain, edition, issued, labels, logo, sweep
     const cardRef = useRef(null);
     const lightRef = useRef(null);
     const stripesRef = useRef(null);
-    const frame = useRef(0);
     const canvasRef = useRef(null);
     const [gpuFoil, setGpuFoil] = useState(false);
     const sweepRef = useRef(() => { });
@@ -102,8 +105,8 @@ export function CompanyCard({ name, domain, edition, issued, labels, logo, sweep
             const created = createRenderer(canvas, {
                 colors: foilColors(card, edition),
                 onTilt: (tiltX, tiltY) => {
-                    card.style.setProperty("--tilt-x", `${tiltY.toFixed(4)}rad`);
-                    card.style.setProperty("--tilt-y", `${tiltX.toFixed(4)}rad`);
+                    setChanged(card, "--tilt-x", `${tiltY.toFixed(4)}rad`);
+                    setChanged(card, "--tilt-y", `${tiltX.toFixed(4)}rad`);
                 },
             });
             renderer = created;
@@ -130,16 +133,17 @@ export function CompanyCard({ name, domain, edition, issued, labels, logo, sweep
             setGpuFoil(false);
         };
     }, [edition, seen]);
-    // The SVG foil behaves as the shader does: it turns once in the light when it
-    // appears and when it is issued, and wakes as the pointer comes within one
-    // card width, easing its turn by how near the pointer is.
     useEffect(() => {
         const card = cardRef.current;
         if (!seen || gpuFoil || !card)
             return;
         const motion = window.matchMedia("(prefers-reduced-motion: reduce)");
+        let onScreen = typeof IntersectionObserver === "undefined";
+        let sweepStart = null;
         let sweepFrame = 0;
-        let sweeping = false;
+        let pointer = null;
+        let pointerFrame = 0;
+        const playing = () => onScreen && !document.hidden;
         const light = (x, y) => {
             lightRef.current?.setAttribute("cx", x.toFixed(3));
             lightRef.current?.setAttribute("cy", y.toFixed(3));
@@ -162,59 +166,86 @@ export function CompanyCard({ name, domain, edition, issued, labels, logo, sweep
             }
         };
         const stopSweep = () => {
-            sweeping = false;
+            sweepStart = null;
             cancelAnimationFrame(sweepFrame);
         };
+        const step = (now) => {
+            if (sweepStart === null)
+                return;
+            const progress = Math.min(1, (now - sweepStart) / SWEEP_MS);
+            const along = progress * progress * (3 - 2 * progress);
+            const rise = Math.sin(Math.PI * progress);
+            show(-0.05 + along * 1.1, 0.22 + along * 0.56, rise ** 0.6 * 0.95, rise * MAX_TILT_DEGREES * 0.3, -Math.sin(2 * Math.PI * along) * ((SWEEP_TURN * 180) / Math.PI));
+            if (progress < 1)
+                sweepFrame = requestAnimationFrame(step);
+            else {
+                sweepStart = null;
+                rest();
+            }
+        };
+        const follow = () => {
+            const at = pointer;
+            pointer = null;
+            if (!at)
+                return;
+            const near = approach(card.getBoundingClientRect(), at.clientX, at.clientY);
+            if (near.hover > 0)
+                stopSweep();
+            if (sweepStart !== null)
+                return;
+            if (near.hover === 0)
+                return rest();
+            const x = Math.min(1, Math.max(0, (near.x + 1) / 2));
+            const y = Math.min(1, Math.max(0, (near.y + 1) / 2));
+            show(x, y, near.hover, (0.5 - y) * 2 * MAX_TILT_DEGREES * near.hover, (x - 0.5) * 2 * MAX_TILT_DEGREES * near.hover);
+        };
+        const play = () => {
+            cancelAnimationFrame(sweepFrame);
+            cancelAnimationFrame(pointerFrame);
+            if (!playing())
+                return;
+            if (sweepStart !== null)
+                sweepFrame = requestAnimationFrame(step);
+            if (pointer)
+                pointerFrame = requestAnimationFrame(follow);
+        };
         const sweep = () => {
             if (motion.matches)
                 return;
-            stopSweep();
-            sweeping = true;
-            const start = performance.now();
-            const step = (now) => {
-                const progress = Math.min(1, (now - start) / SWEEP_MS);
-                const along = progress * progress * (3 - 2 * progress);
-                const rise = Math.sin(Math.PI * progress);
-                show(-0.05 + along * 1.1, 0.22 + along * 0.56, rise ** 0.6 * 0.95, rise * MAX_TILT_DEGREES * 0.3, -Math.sin(2 * Math.PI * along) * ((SWEEP_TURN * 180) / Math.PI));
-                if (progress < 1)
-                    sweepFrame = requestAnimationFrame(step);
-                else {
-                    sweeping = false;
-                    rest();
-                }
-            };
-            sweepFrame = requestAnimationFrame(step);
+            sweepStart = performance.now();
+            play();
         };
         const move = (event) => {
             if (!event.isPrimary)
                 return;
-            const near = approach(card.getBoundingClientRect(), event.clientX, event.clientY);
-            if (near.hover > 0)
-                stopSweep();
-            if (sweeping)
-                return;
-            cancelAnimationFrame(frame.current);
-            frame.current = requestAnimationFrame(() => {
-                if (near.hover === 0)
-                    return rest();
-                const x = Math.min(1, Math.max(0, (near.x + 1) / 2));
-                const y = Math.min(1, Math.max(0, (near.y + 1) / 2));
-                show(x, y, near.hover, (0.5 - y) * 2 * MAX_TILT_DEGREES * near.hover, (x - 0.5) * 2 * MAX_TILT_DEGREES * near.hover);
-            });
+            pointer = { clientX: event.clientX, clientY: event.clientY };
+            cancelAnimationFrame(pointerFrame);
+            if (playing())
+                pointerFrame = requestAnimationFrame(follow);
         };
         const leave = () => {
-            if (!sweeping)
+            if (sweepStart === null)
                 rest();
         };
         window.addEventListener("pointermove", move, { passive: true });
         document.documentElement.addEventListener("pointerleave", leave);
+        document.addEventListener("visibilitychange", play);
+        const visibility = onScreen
+            ? undefined
+            : new IntersectionObserver((entries) => {
+                onScreen = entries.at(-1)?.isIntersecting ?? false;
+                play();
+            });
+        visibility?.observe(card);
         sweepRef.current = sweep;
         sweep();
         return () => {
             window.removeEventListener("pointermove", move);
             document.documentElement.removeEventListener("pointerleave", leave);
+            document.removeEventListener("visibilitychange", play);
+            visibility?.disconnect();
             stopSweep();
-            cancelAnimationFrame(frame.current);
+            cancelAnimationFrame(pointerFrame);
             sweepRef.current = () => { };
             rest();
         };

package/dist/components/hive-scene.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"hive-scene.d.ts","sourceRoot":"","sources":["../../src/components/hive-scene.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,MAAM,MAAM,SAAS,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAEjD,mFAAmF;AACnF,MAAM,MAAM,QAAQ,GAAG;IACrB,OAAO,EAAE,SAAS,SAAS,EAAE,CAAC;IAC9B,SAAS,EAAE,SAAS,SAAS,EAAE,CAAC;CACjC,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AAEzD,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,OAAO,CAAC;AAElD,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IAC3E,IAAI,EAAE,aAAa,CAAC;IACpB,qFAAqF;IACrF,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,kFAAkF;IAClF,IAAI,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;IACrC,6DAA6D;IAC7D,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,mFAAmF;IACnF,IAAI,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,QAAQ,CAAC;IAC7D,iEAAiE;IACjE,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,mEAAmE;IACnE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AAmLF;;;;;;;;;;;;;GAaG;AACH,iBAAS,SAAS,CAAC,EACjB,IAAI,EACJ,MAAkB,EAClB,IAAI,EACJ,OAAO,EACP,IAAI,EACJ,MAAM,EACN,KAAK,EACL,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,qBAsNhB;AAED,2DAA2D;AAC3D,iBAAS,SAAS,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAAC,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,qBAM9E;AAED,iEAAiE;AACjE,iBAAS,QAAQ,CAAC,EAChB,QAAQ,EACR,EAAE,EACF,IAAa,GACd,EAAE;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;CACzB,qBAMA;AAED,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC"}
+{"version":3,"file":"hive-scene.d.ts","sourceRoot":"","sources":["../../src/components/hive-scene.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,MAAM,MAAM,SAAS,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAEjD,mFAAmF;AACnF,MAAM,MAAM,QAAQ,GAAG;IACrB,OAAO,EAAE,SAAS,SAAS,EAAE,CAAC;IAC9B,SAAS,EAAE,SAAS,SAAS,EAAE,CAAC;CACjC,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AAEzD,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,OAAO,CAAC;AAElD,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IAC3E,IAAI,EAAE,aAAa,CAAC;IACpB,qFAAqF;IACrF,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,kFAAkF;IAClF,IAAI,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;IACrC,6DAA6D;IAC7D,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,mFAAmF;IACnF,IAAI,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,QAAQ,CAAC;IAC7D,iEAAiE;IACjE,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,mEAAmE;IACnE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AAmLF;;;;;;;;;;;;;GAaG;AACH,iBAAS,SAAS,CAAC,EACjB,IAAI,EACJ,MAAkB,EAClB,IAAI,EACJ,OAAO,EACP,IAAI,EACJ,MAAM,EACN,KAAK,EACL,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,qBA8PhB;AAED,2DAA2D;AAC3D,iBAAS,SAAS,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAAC,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,qBAM9E;AAED,iEAAiE;AACjE,iBAAS,QAAQ,CAAC,EAChB,QAAQ,EACR,EAAE,EACF,IAAa,GACd,EAAE;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;CACzB,qBAMA;AAED,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC"}

package/dist/components/hive-scene.js

@@ -239,18 +239,25 @@ function HiveScene({ mode, column = "default", logo, picture, work, chrome, labe
             drawComb(comb, width, height);
             context = sizeCanvas(flow, width, height);
         };
+        const observeLayout = (onLayout) => {
+            const resize = new ResizeObserver(onLayout);
+            resize.observe(scene);
+            if (wordsColumn)
+                resize.observe(wordsColumn);
+            return resize;
+        };
         place();
-        const resize = new ResizeObserver(place);
-        resize.observe(scene);
-        if (wordsColumn)
-            resize.observe(wordsColumn);
-        if (still)
+        if (still) {
+            const resize = observeLayout(place);
             return () => resize.disconnect();
+        }
         const colours = orbRefs.current.map((canvas) => canvas ? getComputedStyle(canvas).color : "white");
         const particles = [];
         let frame = 0;
-        let last = performance.now();
+        let last = null;
         let nextSpawn = 0;
+        // A browser that cannot tell whether the scene is seen shows it as seen.
+        let onScreen = typeof IntersectionObserver === "undefined";
         const spawn = () => {
             const source = Math.floor(Math.random() * AGENTS.length);
             const seat = seats[source];
@@ -287,8 +294,11 @@ function HiveScene({ mode, column = "default", logo, picture, work, chrome, labe
                 trail: [],
             });
         };
+        const flowing = () => context !== null && !reduced.matches && seats.some((seat) => seat !== null);
+        const running = () => onScreen && !document.hidden && (particles.length > 0 || flowing());
         const tick = (now) => {
-            const dt = Math.min(0.05, (now - last) / 1000);
+            frame = 0;
+            const dt = last === null ? 0 : Math.min(0.05, (now - last) / 1000);
             last = now;
             nextSpawn -= dt;
             const paint = context;
@@ -322,12 +332,40 @@ function HiveScene({ mode, column = "default", logo, picture, work, chrome, labe
                 }
                 paint.globalAlpha = 1;
             }
+            if (running())
+                frame = requestAnimationFrame(tick);
+        };
+        const play = () => {
+            if (!running()) {
+                cancelAnimationFrame(frame);
+                frame = 0;
+                return;
+            }
+            if (frame)
+                return;
+            last = null;
             frame = requestAnimationFrame(tick);
         };
-        frame = requestAnimationFrame(tick);
+        const resize = observeLayout(() => {
+            place();
+            play();
+        });
+        const visibility = onScreen
+            ? undefined
+            : new IntersectionObserver((entries) => {
+                onScreen = entries.at(-1)?.isIntersecting ?? false;
+                play();
+            });
+        visibility?.observe(scene);
+        document.addEventListener("visibilitychange", play);
+        reduced.addEventListener("change", play);
+        play();
         return () => {
             cancelAnimationFrame(frame);
             resize.disconnect();
+            visibility?.disconnect();
+            document.removeEventListener("visibilitychange", play);
+            reduced.removeEventListener("change", play);
         };
     }, [mode, still, wordsColumn]);
     return (_jsxs("div", { ...props, className: cn("nc-hive dark", className), "data-mode": mode, "data-slot": "hive-scene", ref: sceneRef, ...(mode === "loading" ? { "aria-label": label, role: "status" } : {}), children: [chrome, _jsx("img", { alt: logo.label, className: "nc-hive-logo", "data-slot": "hive-logo", src: logo.src }), picture, _jsx("canvas", { "aria-hidden": "true", className: "nc-hive-comb", ref: combRef }), _jsx("canvas", { "aria-hidden": "true", className: "nc-hive-flow", ref: flowRef }), still

package/dist/components/scroll-area.js

@@ -6,9 +6,9 @@ import { ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon } fro
 import { Button } from "./button.js";
 import { cn } from "../lib/utils.js";
 const viewportAxis = {
-    y: "overflow-x-hidden! [mask-image:linear-gradient(to_bottom,transparent,black_min(2.5rem,var(--scroll-area-overflow-y-start,0px)),black_calc(100%_-_min(2.5rem,var(--scroll-area-overflow-y-end,0px))),transparent)]",
-    x: "overflow-y-hidden! [mask-image:linear-gradient(to_right,transparent,black_min(2.5rem,var(--scroll-area-overflow-x-start,0px)),black_calc(100%_-_min(2.5rem,var(--scroll-area-overflow-x-end,0px))),transparent)]",
-    both: "[mask-composite:intersect] [mask-image:linear-gradient(to_bottom,transparent,black_min(2.5rem,var(--scroll-area-overflow-y-start,0px)),black_calc(100%_-_min(2.5rem,var(--scroll-area-overflow-y-end,0px))),transparent),linear-gradient(to_right,transparent,black_min(2.5rem,var(--scroll-area-overflow-x-start,0px)),black_calc(100%_-_min(2.5rem,var(--scroll-area-overflow-x-end,0px))),transparent)]",
+    y: "overflow-x-hidden! data-overflow-y-start:[mask-image:linear-gradient(to_bottom,transparent,black_2.5rem)] data-overflow-y-end:[mask-image:linear-gradient(to_top,transparent,black_2.5rem)] data-overflow-y-start:data-overflow-y-end:[mask-image:linear-gradient(to_bottom,transparent,black_2.5rem,black_calc(100%_-_2.5rem),transparent)]",
+    x: "overflow-y-hidden! data-overflow-x-start:[mask-image:linear-gradient(to_right,transparent,black_2.5rem)] data-overflow-x-end:[mask-image:linear-gradient(to_left,transparent,black_2.5rem)] data-overflow-x-start:data-overflow-x-end:[mask-image:linear-gradient(to_right,transparent,black_2.5rem,black_calc(100%_-_2.5rem),transparent)]",
+    both: "[--fade-x:linear-gradient(black,black)] [--fade-y:linear-gradient(black,black)] data-overflow-x-start:[--fade-x:linear-gradient(to_right,transparent,black_2.5rem)] data-overflow-x-end:[--fade-x:linear-gradient(to_left,transparent,black_2.5rem)] data-overflow-x-start:data-overflow-x-end:[--fade-x:linear-gradient(to_right,transparent,black_2.5rem,black_calc(100%_-_2.5rem),transparent)] data-overflow-y-start:[--fade-y:linear-gradient(to_bottom,transparent,black_2.5rem)] data-overflow-y-end:[--fade-y:linear-gradient(to_top,transparent,black_2.5rem)] data-overflow-y-start:data-overflow-y-end:[--fade-y:linear-gradient(to_bottom,transparent,black_2.5rem,black_calc(100%_-_2.5rem),transparent)] [mask-composite:intersect] [mask-image:var(--fade-y),var(--fade-x)]",
 };
 function scrollToNeighbour(viewport, content, axis, direction) {
     const edges = (box) => axis === "y" ? { start: box.top, end: box.bottom } : { start: box.left, end: box.right };

package/dist/internal/agent-orb-motion.d.ts

@@ -10,6 +10,10 @@ export declare function stateSpeed(state: AgentOrbState, form: AgentOrbFigure, a
     gestureAge: (age: number) => number;
     settle: (age: number, delay?: number) => number;
 }): number;
+export declare const ORB_FRAME_RATE: {
+    readonly resting: 15;
+    readonly busy: 30;
+};
 /**
  * Reduced motion turns movement off and keeps opacity and colour, so a
  * thinking or working orb breathes between full ink and 0.45 over 1.6 s,

package/dist/internal/agent-orb-motion.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"agent-orb-motion.d.ts","sourceRoot":"","sources":["../../src/internal/agent-orb-motion.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAElD,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,GAAG,MAAM,CAAC;AAc7F,wBAAgB,WAAW,CAAC,IAAI,EAAE,cAAc,UAE/C;AAED,wBAAgB,UAAU,CACxB,KAAK,EAAE,aAAa,EACpB,IAAI,EAAE,cAAc,EACpB,GAAG,SAAI,EACP,MAAM;;;;;;sBA2Cc,MAAM;kBACV,MAAM;CA5CA,UAWvB;AAKD;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,aAAa,EAAE,OAAO,EAAE,MAAM,UAIlE;AAED,wBAAgB,aAAa,CAAC,KAAK,CAAC,EAAE,mBAAmB;;;;;;sBAgBnC,MAAM;kBACV,MAAM;EAGvB;AAUD,wBAAgB,UAAU,CACxB,KAAK,EAAE,aAAa,EACpB,GAAG,EAAE,MAAM,EACX,MAAM;;;;;;sBAjBc,MAAM;kBACV,MAAM;CAgBA,EACtB,OAAO,UAAQ;;;;;;EA+ChB;AA6ED,wBAAgB,WAAW,CACzB,OAAO,EAAE,wBAAwB,EACjC,KAAK,EAAE,aAAa,EACpB,IAAI,EAAE,MAAM,EACZ,OAAO,EAAE,MAAM,EACf,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,SAAS,MAAM,EAAE,EACzB,KAAK,EAAE,MAAM,GAAG,OAAO;AACvB,mFAAmF;AACnF,GAAG,SAAI,EACP,MAAM;;;;;;sBAxJc,MAAM;kBACV,MAAM;CAuJA,EACtB,WAAW,SAA8B,QA4E1C"}
+{"version":3,"file":"agent-orb-motion.d.ts","sourceRoot":"","sources":["../../src/internal/agent-orb-motion.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAElD,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,GAAG,MAAM,CAAC;AAc7F,wBAAgB,WAAW,CAAC,IAAI,EAAE,cAAc,UAE/C;AAED,wBAAgB,UAAU,CACxB,KAAK,EAAE,aAAa,EACpB,IAAI,EAAE,cAAc,EACpB,GAAG,SAAI,EACP,MAAM;;;;;;sBA6Cc,MAAM;kBACV,MAAM;CA9CA,UAWvB;AAED,eAAO,MAAM,cAAc;;;CAAqC,CAAC;AAKjE;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,aAAa,EAAE,OAAO,EAAE,MAAM,UAIlE;AAED,wBAAgB,aAAa,CAAC,KAAK,CAAC,EAAE,mBAAmB;;;;;;sBAgBnC,MAAM;kBACV,MAAM;EAGvB;AAUD,wBAAgB,UAAU,CACxB,KAAK,EAAE,aAAa,EACpB,GAAG,EAAE,MAAM,EACX,MAAM;;;;;;sBAjBc,MAAM;kBACV,MAAM;CAgBA,EACtB,OAAO,UAAQ;;;;;;EA+ChB;AA6ED,wBAAgB,WAAW,CACzB,OAAO,EAAE,wBAAwB,EACjC,KAAK,EAAE,aAAa,EACpB,IAAI,EAAE,MAAM,EACZ,OAAO,EAAE,MAAM,EACf,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,SAAS,MAAM,EAAE,EACzB,KAAK,EAAE,MAAM,GAAG,OAAO;AACvB,mFAAmF;AACnF,GAAG,SAAI,EACP,MAAM;;;;;;sBAxJc,MAAM;kBACV,MAAM;CAuJA,EACtB,WAAW,SAA8B,QA4E1C"}

package/dist/internal/agent-orb-motion.js

@@ -24,6 +24,7 @@ export function stateSpeed(state, form, age = 0, timing = defaultTiming) {
     };
     return speed[state] * nativeSpeed(form);
 }
+export const ORB_FRAME_RATE = { resting: 15, busy: 30 };
 /** The breath's period, in seconds. */
 const BREATH_SECONDS = 1.6;
 /**

package/dist/internal/agent-orb.d.ts

@@ -44,6 +44,7 @@ export type AgentOrbMountOptions = AgentOrbMountBase & ({
     motion: "ambient";
     state?: never;
 });
+export declare const LONGEST_FRAME_SECONDS = 0.1;
 export declare function mountAgentOrb(canvas: HTMLCanvasElement, options: AgentOrbMountOptions): {
     destroy(): void;
     setPaused(_value: boolean): void;

package/dist/internal/agent-orb.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"agent-orb.d.ts","sourceRoot":"","sources":["../../src/internal/agent-orb.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,QAAQ,EAEb,KAAK,QAAQ,EAId,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EACL,KAAK,aAAa,EAOnB,MAAM,oBAAoB,CAAC;AAE5B,QAAA,MAAM,aAAa;;;;;;;;CAQ0B,CAAC;AAE9C,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,aAAa,CAAC;AACtD;;;GAGG;AACH,MAAM,MAAM,cAAc,GAAG,YAAY,GAAG,OAAO,GAAG,OAAO,CAAC;AAC9D,MAAM,MAAM,YAAY,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,GAAG,CAAC;AAE7D,kDAAkD;AAClD,MAAM,MAAM,gBAAgB,GAAG,OAAO,GAAG,cAAc,CAAC;AACxD,+FAA+F;AAC/F,MAAM,MAAM,cAAc,GAAG,QAAQ,GAAG,SAAS,CAAC;AAyDlD;;;;;GAKG;AACH,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,GAAG,QAAQ,CAuDpF;AA6HD,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,cAAc,CAAC;IACrB;;;OAGG;IACH,IAAI,EAAE,YAAY,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,gBAAgB,CAAC;CAC7B,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG,iBAAiB,GAClD,CAAC;IAAE,MAAM,CAAC,EAAE,QAAQ,CAAC;IAAC,KAAK,CAAC,EAAE,aAAa,CAAA;CAAE,GAAG;IAAE,MAAM,EAAE,SAAS,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC,CAAC;AAExF,wBAAgB,aAAa,CAAC,MAAM,EAAE,iBAAiB,EAAE,OAAO,EAAE,oBAAoB;;sBAIzC,OAAO;qBAAuB,aAAa;EA0MvF"}
+{"version":3,"file":"agent-orb.d.ts","sourceRoot":"","sources":["../../src/internal/agent-orb.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,QAAQ,EAEb,KAAK,QAAQ,EAId,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EACL,KAAK,aAAa,EAQnB,MAAM,oBAAoB,CAAC;AAE5B,QAAA,MAAM,aAAa;;;;;;;;CAQ0B,CAAC;AAE9C,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,aAAa,CAAC;AACtD;;;GAGG;AACH,MAAM,MAAM,cAAc,GAAG,YAAY,GAAG,OAAO,GAAG,OAAO,CAAC;AAC9D,MAAM,MAAM,YAAY,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,GAAG,CAAC;AAE7D,kDAAkD;AAClD,MAAM,MAAM,gBAAgB,GAAG,OAAO,GAAG,cAAc,CAAC;AACxD,+FAA+F;AAC/F,MAAM,MAAM,cAAc,GAAG,QAAQ,GAAG,SAAS,CAAC;AA+DlD;;;;;GAKG;AACH,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,GAAG,QAAQ,CAuDpF;AA2ID,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,cAAc,CAAC;IACrB;;;OAGG;IACH,IAAI,EAAE,YAAY,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,gBAAgB,CAAC;CAC7B,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG,iBAAiB,GAClD,CAAC;IAAE,MAAM,CAAC,EAAE,QAAQ,CAAC;IAAC,KAAK,CAAC,EAAE,aAAa,CAAA;CAAE,GAAG;IAAE,MAAM,EAAE,SAAS,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC,CAAC;AAmIxF,eAAO,MAAM,qBAAqB,MAAM,CAAC;AAEzC,wBAAgB,aAAa,CAAC,MAAM,EAAE,iBAAiB,EAAE,OAAO,EAAE,oBAAoB;;sBAIzC,OAAO;qBAAuB,aAAa;EA2LvF"}