@3driseai/3drise-viewer 0.1.25 → 0.1.27

package/dist/components/ObjectNode.js

@@ -111,7 +111,7 @@ const ObjectNode = ({ node, onObjectReady, onObjectDispose, handleObjectClick })
         path: (obj, onObjectReady) => (_jsx(PathRenderer, { pathSettings: obj.config, ...relabel(obj) }, obj.id)),
         grid: (obj, onObjectReady) => (
         // <GridHelper {...(obj.config as GridConfig)} side={2} />
-        _jsx(GridGenerator, { config: obj.config, ...relabel(obj) })),
+        _jsx(GridGenerator, { config: obj.config, id: obj.id, keyframes: obj.animations?.grid?.animations, mouseMove: obj.mouseMove?.grid, ...relabel(obj) })),
         // A placed body of water — the object host. The world ocean is mounted by
         // the environment instead, so this branch only ever sees a pool, a pond or
         // a canal; OceanBuilder decides which from config.host either way.
@@ -122,7 +122,7 @@ const ObjectNode = ({ node, onObjectReady, onObjectDispose, handleObjectClick })
         landscape: (obj, onObjectReady) => (_jsx(LandscapeObject, { settings: obj, ...relabel(obj) }, obj.id)),
         effect: (obj, _onObjectReady, slot = 0) => (_jsx(EffectsGenerator, { settings: {
                 config: obj.config,
-            }, ...(slot === 0 ? relabel(obj) : NO_READY) }, obj.id)),
+            }, id: slot === 0 ? obj.id : undefined, keyframes: obj.animations?.effect?.animations, mouseMove: obj.mouseMove?.effect, ...(slot === 0 ? relabel(obj) : NO_READY) }, obj.id)),
         gallery: (obj, onObjectReady) => (_jsx(GalleryLayout, { createdObject: obj, handleObjectClick: handleObjectClick, ...relabel(obj) })),
         light: (obj, _onObjectReady, slot = 0) => (_jsx(LightObject, { createdObject: slot === 0 ? obj : withoutShadow(obj), ...(slot === 0 ? relabel(obj) : NO_READY) })),
         environment: (obj, onObjectReady) => (_jsx(EnvironmentObject, { createdObject: obj, onObjectReady: onObjectReady, onObjectDispose: onObjectDispose })),

package/dist/components/ObjectsRenderer.d.ts

@@ -1,4 +1,5 @@
-import type { ActionSequence, AnimationSequence, GeneralObjectSettings, CameraState, CreatedObjectSettings } from '@3driseai/3drise-core';
+import type { ActionSequence, GeneralObjectSettings, CameraState, CreatedObjectSettings } from '@3driseai/3drise-core';
+import type { AnimationClip, AnimationSequence } from '../animationsV2/types';
 import type { ObjectReadyProps } from '../types/objectReady';
 import React from "react";
 import { Object3D } from "three";
@@ -9,7 +10,9 @@ interface ObjectsRendererProps extends ObjectReadyProps {
     createdObjects: CreatedObjectSettings[];
     onObjectsReady?: () => void;
     handleObjectClick?: (object: CreatedObjectSettings, ref: Object3D, event: ThreeEvent<MouseEvent>) => void;
+    /** Animations V2 sequences and clips, for interaction triggers. */
     sequences?: AnimationSequence[];
+    clips?: AnimationClip[];
     actionSequences?: ActionSequence[];
 }
 declare const ObjectsRenderer: React.FC<ObjectsRendererProps>;

package/dist/components/ObjectsRenderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ObjectsRenderer.d.ts","sourceRoot":"","sources":["../../src/components/ObjectsRenderer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,WAAW,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAI1I,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACrD,UAAU,oBAAqB,SAAQ,gBAAgB;IACnD,cAAc,EAAE,WAAW,CAAC;IAC5B,qBAAqB,EAAE,qBAAqB,CAAC;IAC7C,cAAc,EAAE,qBAAqB,EAAE,CAAC;IACxC,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,qBAAqB,EAAE,GAAG,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC;IAC1G,SAAS,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAChC,eAAe,CAAC,EAAE,cAAc,EAAE,CAAC;CACtC;AAGD,QAAA,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA2ClD,CAAC;AAEH,eAAe,eAAe,CAAC"}
+{"version":3,"file":"ObjectsRenderer.d.ts","sourceRoot":"","sources":["../../src/components/ObjectsRenderer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,qBAAqB,EAAE,WAAW,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AACvH,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAO9E,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACrD,UAAU,oBAAqB,SAAQ,gBAAgB;IACnD,cAAc,EAAE,WAAW,CAAC;IAC5B,qBAAqB,EAAE,qBAAqB,CAAC;IAC7C,cAAc,EAAE,qBAAqB,EAAE,CAAC;IACxC,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,qBAAqB,EAAE,GAAG,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC;IAC1G,mEAAmE;IACnE,SAAS,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAChC,KAAK,CAAC,EAAE,aAAa,EAAE,CAAC;IACxB,eAAe,CAAC,EAAE,cAAc,EAAE,CAAC;CACtC;AAGD,QAAA,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAuFlD,CAAC;AAEH,eAAe,eAAe,CAAC"}

package/dist/components/ObjectsRenderer.js

@@ -1,10 +1,13 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { memo, useRef, useCallback, useMemo } from 'react';
+import { memo, useRef, useCallback, useMemo, useEffect } from 'react';
 import { buildObjectTree } from '@3driseai/3drise-core';
 import ObjectNode from './ObjectNode.js';
 import useInteraction from '../hooks/useInteraction.js';
+import { ObjectHoverContext, setEffectPrewarmer, setEffectPreviewer, setInteractionRunner } from '../interactions/runner.js';
+import { prewarmEffect, previewEffect, previewEffects } from '../operations/runtime.js';
+import { findById } from '../utils/sceneQuery.js';
 import { useObjectReady } from '../hooks/useObjectReady.js';
-const ObjectsRenderer = memo(({ cameraSettings, createdObjects, generalObjectSettings, onObjectsReady, onObjectReady, onObjectDispose, handleObjectClick, sequences = [], actionSequences = [], }) => {
+const ObjectsRenderer = memo(({ cameraSettings, createdObjects, generalObjectSettings, onObjectsReady, onObjectReady, onObjectDispose, handleObjectClick, sequences = [], clips = [], actionSequences = [], }) => {
     const groupRef = useRef(null);
     const objectsTree = useMemo(() => buildObjectTree(createdObjects), [createdObjects]);
     const readyObjectsCount = useRef(0);
@@ -32,8 +35,59 @@ const ObjectsRenderer = memo(({ cameraSettings, createdObjects, generalObjectSet
     const { executeInteraction } = useInteraction({
         cameraSettings,
         sequences,
+        clips,
         actionSequences,
     });
+    // Hover triggers: CreatedObject reports enter / leave through ObjectHoverContext.
+    const handleObjectHover = useCallback((createdObject, ref, trigger) => {
+        filterInteractionsByEvent(createdObject.actions, trigger).forEach((interaction) => {
+            executeInteraction({ interaction, ref, createdObject });
+        });
+    }, [executeInteraction]);
+    // "Try it" in the studio: run an interaction as if its trigger fired.
+    const objectsRef = useRef(createdObjects);
+    objectsRef.current = createdObjects;
+    useEffect(() => setInteractionRunner((objectId, interaction, opts) => {
+        const ref = findById(objectId);
+        const createdObject = objectsRef.current?.find(o => o.id === objectId);
+        if (!ref || !createdObject)
+            return false;
+        if (opts?.preview) {
+            // effects play and come back; animations and actions run as usual
+            executeInteraction({ interaction: { ...interaction, effects: [] }, ref, createdObject });
+            void previewEffects(interaction.effects ?? [], ref);
+        }
+        else {
+            executeInteraction({ interaction, ref, createdObject });
+        }
+        return true;
+    }), [executeInteraction]);
+    useEffect(() => setEffectPreviewer((objectId, effect) => {
+        const ref = findById(objectId);
+        return ref ? previewEffect(effect, ref) : Promise.resolve(false);
+    }), []);
+    useEffect(() => setEffectPrewarmer((objectId, effect) => {
+        const ref = findById(objectId);
+        return ref ? prewarmEffect(effect, ref) : Promise.resolve();
+    }), []);
+    // Compile, in the background, the shaders of every effect this scene's interactions
+    // and actions use, so a visitor's first click never stalls. Each (effect, object) once.
+    useEffect(() => {
+        const t = setTimeout(() => {
+            for (const o of objectsRef.current ?? []) {
+                const ref = findById(o.id);
+                if (!ref)
+                    continue;
+                for (const ix of (o.actions ?? []))
+                    for (const e of ix?.effects ?? [])
+                        void prewarmEffect(e, ref);
+            }
+            for (const a of actionSequences ?? [])
+                for (const e of a.effects ?? [])
+                    void prewarmEffect(e, null);
+        }, 1500);
+        return () => clearTimeout(t);
+    }, [createdObjects, actionSequences]);
     const handleObjectClickHandler = (createdObject, ref, event) => {
         const clickInteractions = filterInteractionsByEvent(createdObject.actions, "click");
         clickInteractions.forEach((interaction) => {
@@ -43,7 +97,7 @@ const ObjectsRenderer = memo(({ cameraSettings, createdObjects, generalObjectSet
             handleObjectClick(createdObject, ref, event);
         }
     };
-    return (_jsx("group", { ref: groupRef, name: "main-objects", position: generalObjectSettings.meshSettings.position, rotation: generalObjectSettings.meshSettings.rotation, scale: generalObjectSettings.meshSettings.scale, children: objectsTree.map(node => (_jsx(ObjectNode, { node: node, onObjectReady: handleObjectReady, onObjectDispose: handleObjectDispose, handleObjectClick: handleObjectClickHandler }, node.objectId))) }));
+    return (_jsx(ObjectHoverContext.Provider, { value: handleObjectHover, children: _jsx("group", { ref: groupRef, name: "main-objects", position: generalObjectSettings.meshSettings.position, rotation: generalObjectSettings.meshSettings.rotation, scale: generalObjectSettings.meshSettings.scale, children: objectsTree.map(node => (_jsx(ObjectNode, { node: node, onObjectReady: handleObjectReady, onObjectDispose: handleObjectDispose, handleObjectClick: handleObjectClickHandler }, node.objectId))) }) }));
 });
 ObjectsRenderer.displayName = 'ObjectsRenderer';
 export default ObjectsRenderer;

package/dist/components/Ocean.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Ocean.d.ts","sourceRoot":"","sources":["../../src/components/Ocean.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAU7D,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AACnE,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,MAAM,WAAW,UAAW,SAAQ,gBAAgB;IAChD,QAAQ,EAAE,qBAAqB,CAAC;CACnC;AAGD,QAAA,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CA6J/B,CAAC;AACF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Ocean.d.ts","sourceRoot":"","sources":["../../src/components/Ocean.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAS7D,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AACnE,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,MAAM,WAAW,UAAW,SAAQ,gBAAgB;IAChD,QAAQ,EAAE,qBAAqB,CAAC;CACnC;AAGD,QAAA,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CA+F/B,CAAC;AACF,eAAe,KAAK,CAAC"}

package/dist/components/Ocean.js

@@ -6,7 +6,6 @@ import { useFrame } from '@react-three/fiber';
 import { useMaterialApplication } from '../hooks/useMaterialApplication.js';
 import { useWaterEnvironment } from '../hooks/useWaterEnvironment.js';
 import { useWaterReflections } from '../hooks/useWaterReflections.js';
-import { useAnimationEvents } from '../hooks/useAnimationEvents.js';
 import { useNumericAnimation } from '../hooks/useNumericAnimation.js';
 import { handleTransformAnimations, handleMaterialAnimations, handleTransformMouseMove, handleMaterialMouseMove, } from '@3driseai/3drise-core';
 const Ocean = ({ settings, onObjectReady, onObjectDispose }) => {
@@ -34,68 +33,6 @@ const Ocean = ({ settings, onObjectReady, onObjectDispose }) => {
         updateFrequency: 1,
         enabled: meshSettings.visible,
     });
-    useAnimationEvents({
-        onStepStart: (event) => {
-            if (!event.step?.transitions)
-                return;
-            for (const transition of event.step.transitions) {
-                if (transition.state !== 'ocean' || !meshRef.current)
-                    continue;
-                const toProps = transition.properties.to || {};
-                const fromProps = transition.properties.from || {};
-                // visible — update state so JSX visible prop re-renders
-                if (toProps.visible !== undefined) {
-                    setMeshVisible(toProps.visible);
-                }
-                // numeric uniforms: animate any key in `to` that maps to a shader uniform
-                const material = meshRef.current.material;
-                const uniforms = material?.uniforms;
-                if (!uniforms)
-                    continue;
-                const from = {};
-                const to = {};
-                for (const key of Object.keys(toProps)) {
-                    if (key === 'visible')
-                        continue;
-                    const toVal = toProps[key];
-                    if (toVal === undefined)
-                        continue;
-                    to[key] = toVal;
-                    const fromExplicit = fromProps[key];
-                    if (fromExplicit !== undefined) {
-                        from[key] = fromExplicit;
-                    }
-                    else if (uniforms[key]?.value !== undefined) {
-                        const liveVal = uniforms[key].value;
-                        if (typeof liveVal === 'number') {
-                            from[key] = liveVal;
-                        }
-                        else if (liveVal?.toArray) {
-                            from[key] = liveVal.toArray();
-                        }
-                        else if (Array.isArray(liveVal)) {
-                            from[key] = [...liveVal];
-                        }
-                        else {
-                            from[key] = toVal;
-                        }
-                    }
-                    else {
-                        from[key] = toVal;
-                    }
-                }
-                if (Object.keys(to).length > 0) {
-                    animateNumeric(from, to, (updated) => {
-                        uniformOverrideRef.current = { ...uniformOverrideRef.current, ...updated };
-                    }, () => {
-                        uniformOverrideRef.current = null;
-                        if (toProps.visible !== undefined)
-                            setMeshVisible(null);
-                    }, event.step?.duration);
-                }
-            }
-        },
-    });
     useFrame((state) => {
         const mesh = meshRef.current;
         if (!mesh?.material || !(meshVisible ?? meshSettings.visible))

package/dist/components/OceanBuilder.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { SkySettings, TimeSettings } from '@3driseai/3drise-core';
 import type { ObjectReadyProps } from '../types/objectReady';
-import type { OceanWaterSettings } from '../types/oceanConfigs';
+import type { OceanWaterSettings } from '@3driseai/3drise-core';
 export interface OceanBuilderProps extends ObjectReadyProps {
     /** Accepts a partial or older-shaped blob — including core's retired
      *  `OceanSettings`, the flat plane with a water material picked out of the

package/dist/components/OceanBuilder.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useMemo } from 'react';
-import { normalizeOcean, normalizeOceanQuality } from '../types/oceanConfigs.js';
+import { normalizeOcean, normalizeOceanQuality } from '@3driseai/3drise-core';
 import Sea from './water/Sea.js';
 import Lake from './water/Lake.js';
 import Storm from './water/Storm.js';

package/dist/components/ParticlesGenerator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ParticlesGenerator.d.ts","sourceRoot":"","sources":["../../src/components/ParticlesGenerator.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,2BAA2B,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAC1F,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAU7D,MAAM,WAAW,uBAAwB,SAAQ,gBAAgB;IAC7D,QAAQ,EAAE,2BAA2B,CAAC;IACtC,uFAAuF;IACvF,SAAS,CAAC,EAAE,eAAe,CAAC;CAC/B;AAED,0FAA0F;AAC1F,QAAA,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAgBzD,CAAC;AACF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"ParticlesGenerator.d.ts","sourceRoot":"","sources":["../../src/components/ParticlesGenerator.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,2BAA2B,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAC1F,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAa7D,MAAM,WAAW,uBAAwB,SAAQ,gBAAgB;IAC7D,QAAQ,EAAE,2BAA2B,CAAC;IACtC,uFAAuF;IACvF,SAAS,CAAC,EAAE,eAAe,CAAC;CAC/B;AAED,0FAA0F;AAC1F,QAAA,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAmBzD,CAAC;AACF,eAAe,kBAAkB,CAAC"}

package/dist/components/ParticlesGenerator.js

@@ -7,6 +7,9 @@ import GrinderSparksParticles from './particles/GrinderSparksParticles.js';
 import ChladniSandParticles from './particles/ChladniSandParticles.js';
 import FaradayPowderParticles from './particles/FaradayPowderParticles.js';
 import NeonRainParticles from './particles/NeonRainParticles.js';
+import MagneticBottleParticles from './particles/MagneticBottleParticles.js';
+import ShapeBurstParticles from './particles/ShapeBurstParticles.js';
+import ShapeFlowParticles from './particles/ShapeFlowParticles.js';
 /** Standalone generative particle objects (type 'particles'), switched on config.type. */
 const ParticlesGenerator = ({ settings, mouseMove, onObjectReady, onObjectDispose }) => {
     const { config, animations } = settings;
@@ -23,6 +26,9 @@ const ParticlesGenerator = ({ settings, mouseMove, onObjectReady, onObjectDispos
         case 'chladniSand': return _jsx(ChladniSandParticles, { id: settings.id, size: size, config: config, animations: animations, ...ready });
         case 'faradayPowder': return _jsx(FaradayPowderParticles, { id: settings.id, size: size, config: config, animations: animations, ...ready });
         case 'neonRain': return _jsx(NeonRainParticles, { id: settings.id, size: size, config: config, animations: animations, ...ready });
+        case 'magneticBottle': return _jsx(MagneticBottleParticles, { id: settings.id, size: size, config: config, animations: animations, ...ready });
+        case 'shapeBurst': return _jsx(ShapeBurstParticles, { id: settings.id, size: size, config: config, animations: animations, ...ready });
+        case 'shapeFlow': return _jsx(ShapeFlowParticles, { id: settings.id, size: size, config: config, animations: animations, ...ready });
         default: return null;
     }
 };

package/dist/components/QuasiGrid.d.ts

@@ -1,22 +1,19 @@
 import type { ThreeElements } from '@react-three/fiber';
 import type { ObjectReadyProps } from '../types/objectReady';
 import type { QuasiGridConfig } from '../types/gridConfigs';
+import type { AnimationOptions, MouseMoveDomain } from '@3driseai/3drise-core';
 export interface QuasiGridProps extends ObjectReadyProps {
     config?: QuasiGridConfig;
     groupProps?: ThreeElements['group'];
+    /** Scene object id: the live-edit handle is found by it. */
+    id?: string;
+    /** Keyframes on this grid's config knobs (animations.grid.animations). */
+    keyframes?: AnimationOptions[];
+    /** Pointer bindings on this grid's config knobs (mouseMove.grid). */
+    mouseMove?: MouseMoveDomain;
 }
 /** QuasiGridConfig — the single source of truth for a quasicrystal grid instance. */
 export declare const defaultQuasiGridConfig: QuasiGridConfig;
-/**
- * An aperiodic quasicrystal lattice, built as a de Bruijn multigrid: `symmetry`
- * families of evenly spaced parallel lines spread over a half turn.
- *
- * Where the angles do not divide the half turn evenly the intersections never
- * repeat, so unlike every other grid in this package the pattern is genuinely
- * non-periodic — pan as far as you like and it never comes back around. 5 is
- * Penrose. 4 and 6 do divide evenly and so come out periodic, which makes them
- * a useful sanity check rather than a bug.
- */
-export declare function QuasiGrid({ config, groupProps, onObjectReady, onObjectDispose }: QuasiGridProps): import("react").JSX.Element;
+export declare function QuasiGrid({ config, groupProps, id, keyframes, mouseMove, onObjectReady, onObjectDispose }: QuasiGridProps): import("react").JSX.Element;
 export default QuasiGrid;
 //# sourceMappingURL=QuasiGrid.d.ts.map

package/dist/components/QuasiGrid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QuasiGrid.d.ts","sourceRoot":"","sources":["../../src/components/QuasiGrid.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAIxD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAG5D,MAAM,WAAW,cAAe,SAAQ,gBAAgB;IACpD,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,UAAU,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;CACvC;AAKD,qFAAqF;AACrF,eAAO,MAAM,sBAAsB,EAAE,eA2BpC,CAAC;AAEF;;;;;;;;;GASG;AACH,wBAAgB,SAAS,CAAC,EAAE,MAA+B,EAAE,UAAU,EAAE,aAAa,EAAE,eAAe,EAAE,EAAE,cAAc,+BAgExH;AAED,eAAe,SAAS,CAAC"}
+{"version":3,"file":"QuasiGrid.d.ts","sourceRoot":"","sources":["../../src/components/QuasiGrid.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAOxD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAE5D,OAAO,KAAK,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAE/E,MAAM,WAAW,cAAe,SAAQ,gBAAgB;IACpD,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,UAAU,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IACpC,4DAA4D;IAC5D,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,0EAA0E;IAC1E,SAAS,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC/B,qEAAqE;IACrE,SAAS,CAAC,EAAE,eAAe,CAAC;CAC/B;AAKD,qFAAqF;AACrF,eAAO,MAAM,sBAAsB,EAAE,eA2BpC,CAAC;AAqBF,wBAAgB,SAAS,CAAC,EAAE,MAA+B,EAAE,UAAU,EAAE,EAAE,EAAE,SAAS,EAAE,SAAS,EAAE,aAAa,EAAE,eAAe,EAAE,EAAE,cAAc,+BA6ClJ;AAED,eAAe,SAAS,CAAC"}

package/dist/components/QuasiGrid.js

@@ -1,9 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo, useRef } from 'react';
+import { useCallback, useLayoutEffect, useMemo, useRef } from 'react';
 import * as THREE from 'three';
 import { useObjectReady } from '../hooks/useObjectReady.js';
 import { useGridSurface } from '../hooks/useGridSurface.js';
-import { QuasiGridMaterial } from '@3driseai/3drise-core';
+import { useConfigDriver } from '../hooks/useConfigDriver.js';
+import { withConfigDefaults } from '../utils/configAnimations.js';
+import { applyGridConfig, GRID_STRUCTURAL } from '../utils/gridConfig.js';
+import { QuasiGridMaterial, GRIDS_ANIMATABLE } from '@3driseai/3drise-core';
 // Side-effect import registers <quasiGridMaterial> via extend().
 void QuasiGridMaterial;
 /** QuasiGridConfig — the single source of truth for a quasicrystal grid instance. */
@@ -45,24 +48,39 @@ export const defaultQuasiGridConfig = {
  * Penrose. 4 and 6 do divide evenly and so come out periodic, which makes them
  * a useful sanity check rather than a bug.
  */
-export function QuasiGrid({ config = defaultQuasiGridConfig, groupProps, onObjectReady, onObjectDispose }) {
+/** This grid's own uniforms (u_<key>), pushed by applyGridConfig beside the shared surface knobs. */
+const VARIANT = ['phase'];
+/** Computed uniforms (clamps, enum indices, booleans as 0/1). */
+const DERIVE = { symmetry: (c) => Math.max(3, Math.min(9, c.symmetry)) };
+/** Knobs that rebuild the plane or pick a mode: they change on commit, never through the live path. */
+const STRUCTURAL = [...GRID_STRUCTURAL, 'symmetry'];
+/** Knobs a keyframe or pointer binding may drive per frame — exactly what applyGridConfig pushes. */
+const ANIMATABLE = new Set((GRIDS_ANIMATABLE.quasiGrid ?? []).map((p) => p.value));
+export function QuasiGrid({ config = defaultQuasiGridConfig, groupProps, id, keyframes, mouseMove, onObjectReady, onObjectDispose }) {
     const matRef = useRef(null);
     const rootRef = useRef(null);
     const meshRef = useRef(null);
     useObjectReady(rootRef, config, onObjectReady, onObjectDispose);
-    const { cellSize, size, segments, flat, lineMode, cellMode, lineWidth, sectionSize, sectionWidth, animSpeed, animScale, animIntensity, fadeDistance, fadeStrength, displace, symmetry, phase, lineColor, sectionColor, cellColor, glowColor, bgColor, bgOpacity, followMouse, reveal, revealDuration, } = config;
+    // The committed config over this grid's defaults: every knob has a value to render
+    // and for a keyframe or pointer binding to start from.
+    const base = useMemo(() => withConfigDefaults(defaultQuasiGridConfig, config), [config]);
+    const { cellSize, size, segments, flat, displace, followMouse, reveal, revealDuration } = base;
     const segs = segments ?? (displace > 0
         ? Math.min(256, Math.max(64, Math.ceil(size / Math.max(cellSize, 1e-4)) * 2))
         : 1);
-    const fade = fadeDistance ?? size * 0.5;
-    const colors = useMemo(() => ({
-        line: new THREE.Color(lineColor),
-        section: new THREE.Color(sectionColor),
-        cell: new THREE.Color(cellColor),
-        glow: new THREE.Color(glowColor),
-        bg: new THREE.Color(bgColor),
-    }), [lineColor, sectionColor, cellColor, glowColor, bgColor]);
     useGridSurface(matRef, meshRef, { followMouse, reveal, revealDuration });
-    return (_jsx("group", { ref: rootRef, ...groupProps, children: _jsxs("mesh", { ref: meshRef, rotation: flat ? [-Math.PI / 2, 0, 0] : [0, 0, 0], children: [_jsx("planeGeometry", { args: [size, size, segs, segs] }), _jsx("quasiGridMaterial", { ref: matRef, transparent: true, depthWrite: false, blending: THREE.AdditiveBlending, side: THREE.DoubleSide, u_cellSize: cellSize, u_lineWidth: lineWidth, u_sectionSize: sectionSize, u_sectionWidth: sectionWidth, u_lineMode: lineMode, u_cellMode: cellMode, u_animSpeed: animSpeed, u_animScale: animScale, u_animIntensity: animIntensity, u_fadeDistance: fade, u_fadeStrength: fadeStrength, u_displace: displace, u_symmetry: Math.max(3, Math.min(9, symmetry)), u_phase: phase, u_lineColor: colors.line, u_sectionColor: colors.section, u_cellColor: colors.cell, u_glowColor: colors.glow, u_bgColor: colors.bg, u_bgOpacity: bgOpacity }, QuasiGridMaterial.key)] }) }));
+    // One push point for every uniform the config owns: the committed config when the
+    // material mounts or the config commits, the merged one while anything overrides it.
+    const baseRef = useRef(base);
+    baseRef.current = base;
+    const setMaterial = useCallback((m) => {
+        matRef.current = m;
+        if (m)
+            applyGridConfig(m, baseRef.current, VARIANT, DERIVE);
+    }, []);
+    useLayoutEffect(() => { applyGridConfig(matRef.current, base, VARIANT, DERIVE); }, [base]);
+    const push = useCallback((merged) => applyGridConfig(matRef.current, merged, VARIANT, DERIVE), []);
+    useConfigDriver({ rootRef, id, family: 'grids', base, structural: STRUCTURAL, allowed: ANIMATABLE, keyframes, mouseMove, push });
+    return (_jsx("group", { ref: rootRef, ...groupProps, children: _jsxs("mesh", { ref: meshRef, rotation: flat ? [-Math.PI / 2, 0, 0] : [0, 0, 0], children: [_jsx("planeGeometry", { args: [size, size, segs, segs] }), _jsx("quasiGridMaterial", { ref: setMaterial, transparent: true, depthWrite: false, blending: THREE.AdditiveBlending, side: THREE.DoubleSide }, QuasiGridMaterial.key)] }) }));
 }
 export default QuasiGrid;

package/dist/components/RadarGrid.d.ts

@@ -1,24 +1,19 @@
 import type { ThreeElements } from '@react-three/fiber';
 import type { ObjectReadyProps } from '../types/objectReady';
 import type { RadarGridConfig } from '../types/gridConfigs';
+import type { AnimationOptions, MouseMoveDomain } from '@3driseai/3drise-core';
 export interface RadarGridProps extends ObjectReadyProps {
     config?: RadarGridConfig;
     groupProps?: ThreeElements['group'];
+    /** Scene object id: the live-edit handle is found by it. */
+    id?: string;
+    /** Keyframes on this grid's config knobs (animations.grid.animations). */
+    keyframes?: AnimationOptions[];
+    /** Pointer bindings on this grid's config knobs (mouseMove.grid). */
+    mouseMove?: MouseMoveDomain;
 }
 /** RadarGridConfig — the single source of truth for a radar grid instance. */
 export declare const defaultRadarGridConfig: RadarGridConfig;
-/**
- * A polar HUD — concentric rings and radial spokes instead of an X/Y lattice,
- * masked to a disc of `fadeDistance` rather than filling its square plane.
- *
- * A sweep arm rotates with a decaying trail, contacts light as it crosses them
- * and fade until it comes back around, and `lineMode` 1 sends ping rings out
- * from the focus point. Set `sweepWidth` to 0 for a static instrument face,
- * `spokes` to 0 for rings only.
- *
- * Note that `fadeDistance` is the disc radius here, so keep `size` at least
- * twice it or the disc gets clipped by its own plane.
- */
-export declare function RadarGrid({ config, groupProps, onObjectReady, onObjectDispose }: RadarGridProps): import("react").JSX.Element;
+export declare function RadarGrid({ config, groupProps, id, keyframes, mouseMove, onObjectReady, onObjectDispose }: RadarGridProps): import("react").JSX.Element;
 export default RadarGrid;
 //# sourceMappingURL=RadarGrid.d.ts.map

package/dist/components/RadarGrid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RadarGrid.d.ts","sourceRoot":"","sources":["../../src/components/RadarGrid.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAIxD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAG5D,MAAM,WAAW,cAAe,SAAQ,gBAAgB;IACpD,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,UAAU,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;CACvC;AAKD,8EAA8E;AAC9E,eAAO,MAAM,sBAAsB,EAAE,eA4BpC,CAAC;AAEF;;;;;;;;;;;GAWG;AACH,wBAAgB,SAAS,CAAC,EAAE,MAA+B,EAAE,UAAU,EAAE,aAAa,EAAE,eAAe,EAAE,EAAE,cAAc,+BAiExH;AAED,eAAe,SAAS,CAAC"}
+{"version":3,"file":"RadarGrid.d.ts","sourceRoot":"","sources":["../../src/components/RadarGrid.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAOxD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAE5D,OAAO,KAAK,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAE/E,MAAM,WAAW,cAAe,SAAQ,gBAAgB;IACpD,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,UAAU,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IACpC,4DAA4D;IAC5D,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,0EAA0E;IAC1E,SAAS,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC/B,qEAAqE;IACrE,SAAS,CAAC,EAAE,eAAe,CAAC;CAC/B;AAKD,8EAA8E;AAC9E,eAAO,MAAM,sBAAsB,EAAE,eA4BpC,CAAC;AAuBF,wBAAgB,SAAS,CAAC,EAAE,MAA+B,EAAE,UAAU,EAAE,EAAE,EAAE,SAAS,EAAE,SAAS,EAAE,aAAa,EAAE,eAAe,EAAE,EAAE,cAAc,+BA6ClJ;AAED,eAAe,SAAS,CAAC"}

package/dist/components/RadarGrid.js

@@ -1,9 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo, useRef } from 'react';
+import { useCallback, useLayoutEffect, useMemo, useRef } from 'react';
 import * as THREE from 'three';
 import { useObjectReady } from '../hooks/useObjectReady.js';
 import { useGridSurface } from '../hooks/useGridSurface.js';
-import { RadarGridMaterial } from '@3driseai/3drise-core';
+import { useConfigDriver } from '../hooks/useConfigDriver.js';
+import { withConfigDefaults } from '../utils/configAnimations.js';
+import { applyGridConfig, GRID_STRUCTURAL } from '../utils/gridConfig.js';
+import { RadarGridMaterial, GRIDS_ANIMATABLE } from '@3driseai/3drise-core';
 // Side-effect import registers <radarGridMaterial> via extend().
 void RadarGridMaterial;
 /** RadarGridConfig — the single source of truth for a radar grid instance. */
@@ -48,24 +51,39 @@ export const defaultRadarGridConfig = {
  * Note that `fadeDistance` is the disc radius here, so keep `size` at least
  * twice it or the disc gets clipped by its own plane.
  */
-export function RadarGrid({ config = defaultRadarGridConfig, groupProps, onObjectReady, onObjectDispose }) {
+/** This grid's own uniforms (u_<key>), pushed by applyGridConfig beside the shared surface knobs. */
+const VARIANT = ['spokes', 'sweepWidth', 'blipDensity'];
+/** No computed uniforms: every knob maps straight to its u_<key>. */
+const DERIVE = {};
+/** Knobs that rebuild the plane or pick a mode: they change on commit, never through the live path. */
+const STRUCTURAL = [...GRID_STRUCTURAL, 'spokes'];
+/** Knobs a keyframe or pointer binding may drive per frame — exactly what applyGridConfig pushes. */
+const ANIMATABLE = new Set((GRIDS_ANIMATABLE.radarGrid ?? []).map((p) => p.value));
+export function RadarGrid({ config = defaultRadarGridConfig, groupProps, id, keyframes, mouseMove, onObjectReady, onObjectDispose }) {
     const matRef = useRef(null);
     const rootRef = useRef(null);
     const meshRef = useRef(null);
     useObjectReady(rootRef, config, onObjectReady, onObjectDispose);
-    const { cellSize, size, segments, flat, lineMode, cellMode, lineWidth, sectionSize, sectionWidth, animSpeed, animScale, animIntensity, fadeDistance, fadeStrength, displace, spokes, sweepWidth, blipDensity, lineColor, sectionColor, cellColor, glowColor, bgColor, bgOpacity, followMouse, reveal, revealDuration, } = config;
+    // The committed config over this grid's defaults: every knob has a value to render
+    // and for a keyframe or pointer binding to start from.
+    const base = useMemo(() => withConfigDefaults(defaultRadarGridConfig, config), [config]);
+    const { cellSize, size, segments, flat, displace, followMouse, reveal, revealDuration } = base;
     const segs = segments ?? (displace > 0
         ? Math.min(256, Math.max(64, Math.ceil(size / Math.max(cellSize, 1e-4)) * 4))
         : 1);
-    const fade = fadeDistance ?? size * 0.5;
-    const colors = useMemo(() => ({
-        line: new THREE.Color(lineColor),
-        section: new THREE.Color(sectionColor),
-        cell: new THREE.Color(cellColor),
-        glow: new THREE.Color(glowColor),
-        bg: new THREE.Color(bgColor),
-    }), [lineColor, sectionColor, cellColor, glowColor, bgColor]);
     useGridSurface(matRef, meshRef, { followMouse, reveal, revealDuration });
-    return (_jsx("group", { ref: rootRef, ...groupProps, children: _jsxs("mesh", { ref: meshRef, rotation: flat ? [-Math.PI / 2, 0, 0] : [0, 0, 0], children: [_jsx("planeGeometry", { args: [size, size, segs, segs] }), _jsx("radarGridMaterial", { ref: matRef, transparent: true, depthWrite: false, blending: THREE.AdditiveBlending, side: THREE.DoubleSide, u_cellSize: cellSize, u_lineWidth: lineWidth, u_sectionSize: sectionSize, u_sectionWidth: sectionWidth, u_lineMode: lineMode, u_cellMode: cellMode, u_animSpeed: animSpeed, u_animScale: animScale, u_animIntensity: animIntensity, u_fadeDistance: fade, u_fadeStrength: fadeStrength, u_displace: displace, u_spokes: spokes, u_sweepWidth: sweepWidth, u_blipDensity: blipDensity, u_lineColor: colors.line, u_sectionColor: colors.section, u_cellColor: colors.cell, u_glowColor: colors.glow, u_bgColor: colors.bg, u_bgOpacity: bgOpacity }, RadarGridMaterial.key)] }) }));
+    // One push point for every uniform the config owns: the committed config when the
+    // material mounts or the config commits, the merged one while anything overrides it.
+    const baseRef = useRef(base);
+    baseRef.current = base;
+    const setMaterial = useCallback((m) => {
+        matRef.current = m;
+        if (m)
+            applyGridConfig(m, baseRef.current, VARIANT, DERIVE);
+    }, []);
+    useLayoutEffect(() => { applyGridConfig(matRef.current, base, VARIANT, DERIVE); }, [base]);
+    const push = useCallback((merged) => applyGridConfig(matRef.current, merged, VARIANT, DERIVE), []);
+    useConfigDriver({ rootRef, id, family: 'grids', base, structural: STRUCTURAL, allowed: ANIMATABLE, keyframes, mouseMove, push });
+    return (_jsx("group", { ref: rootRef, ...groupProps, children: _jsxs("mesh", { ref: meshRef, rotation: flat ? [-Math.PI / 2, 0, 0] : [0, 0, 0], children: [_jsx("planeGeometry", { args: [size, size, segs, segs] }), _jsx("radarGridMaterial", { ref: setMaterial, transparent: true, depthWrite: false, blending: THREE.AdditiveBlending, side: THREE.DoubleSide }, RadarGridMaterial.key)] }) }));
 }
 export default RadarGrid;

package/dist/components/ReactionDiffusionGrid.d.ts

@@ -1,15 +1,22 @@
 import type { ThreeElements } from '@react-three/fiber';
 import type { ObjectReadyProps } from '../types/objectReady';
 import type { ReactionDiffusionGridConfig } from '../types/gridConfigs';
+import type { AnimationOptions, MouseMoveDomain } from '@3driseai/3drise-core';
 export interface ReactionDiffusionGridProps extends ObjectReadyProps {
     config?: ReactionDiffusionGridConfig;
     groupProps?: ThreeElements['group'];
+    /** Scene object id: the live-edit handle is found by it. */
+    id?: string;
+    /** Keyframes on this grid's config knobs (animations.grid.animations). */
+    keyframes?: AnimationOptions[];
+    /** Pointer bindings on this grid's config knobs (mouseMove.grid). */
+    mouseMove?: MouseMoveDomain;
 }
 /** ReactionDiffusionGridConfig defaults. Must match the catalog entry in grid-defaults.json exactly. */
 export declare const defaultReactionDiffusionGridConfig: ReactionDiffusionGridConfig;
 /**
  * A Gray-Scott reaction-diffusion field simulated on the GPU and sampled by the plane: coral, labyrinths and dividing spots grow, merge and keep evolving, wrapped seamlessly as a torus.
  */
-export declare function ReactionDiffusionGrid({ config, groupProps, onObjectReady, onObjectDispose }: ReactionDiffusionGridProps): import("react").JSX.Element;
+export declare function ReactionDiffusionGrid({ config, groupProps, id, keyframes, mouseMove, onObjectReady, onObjectDispose }: ReactionDiffusionGridProps): import("react").JSX.Element;
 export default ReactionDiffusionGrid;
 //# sourceMappingURL=ReactionDiffusionGrid.d.ts.map

package/dist/components/ReactionDiffusionGrid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ReactionDiffusionGrid.d.ts","sourceRoot":"","sources":["../../src/components/ReactionDiffusionGrid.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAKxD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,sBAAsB,CAAC;AAGxE,MAAM,WAAW,0BAA2B,SAAQ,gBAAgB;IAChE,MAAM,CAAC,EAAE,2BAA2B,CAAC;IACrC,UAAU,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;CACvC;AAKD,wGAAwG;AACxG,eAAO,MAAM,kCAAkC,EAAE,2BA6BhD,CAAC;AAuTF;;GAEG;AACH,wBAAgB,qBAAqB,CAAC,EAAE,MAA2C,EAAE,UAAU,EAAE,aAAa,EAAE,eAAe,EAAE,EAAE,0BAA0B,+BAgF5J;AAED,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"ReactionDiffusionGrid.d.ts","sourceRoot":"","sources":["../../src/components/ReactionDiffusionGrid.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAQxD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,sBAAsB,CAAC;AAExE,OAAO,KAAK,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAE/E,MAAM,WAAW,0BAA2B,SAAQ,gBAAgB;IAChE,MAAM,CAAC,EAAE,2BAA2B,CAAC;IACrC,UAAU,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IACpC,4DAA4D;IAC5D,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,0EAA0E;IAC1E,SAAS,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC/B,qEAAqE;IACrE,SAAS,CAAC,EAAE,eAAe,CAAC;CAC/B;AAKD,wGAAwG;AACxG,eAAO,MAAM,kCAAkC,EAAE,2BA6BhD,CAAC;AA+LF;;GAEG;AACH,wBAAgB,qBAAqB,CAAC,EAAE,MAA2C,EAAE,UAAU,EAAE,EAAE,EAAE,SAAS,EAAE,SAAS,EAAE,aAAa,EAAE,eAAe,EAAE,EAAE,0BAA0B,+BA0DtL;AAED,eAAe,qBAAqB,CAAC"}