@3driseai/3drise-viewer 0.1.26 → 0.1.27

package/dist/components/effects/OrbEffect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"OrbEffect.d.ts","sourceRoot":"","sources":["../../../src/components/effects/OrbEffect.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAEzE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAChE,UAAU,cAAe,SAAQ,gBAAgB;IAC7C,cAAc,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,SAAS,CAAC;IAClB,UAAU,CAAC,EAAE,gBAAgB,EAAE,CAAC;CACnC;AAqLD,QAAA,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA4GvC,CAAC;AACF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"OrbEffect.d.ts","sourceRoot":"","sources":["../../../src/components/effects/OrbEffect.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,SAAS,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAG1F,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAChE,MAAM,WAAW,cAAe,SAAQ,gBAAgB;IACpD,cAAc,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,SAAS,CAAC;IAClB,mFAAmF;IACnF,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,8EAA8E;IAC9E,SAAS,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC/B,yEAAyE;IACzE,SAAS,CAAC,EAAE,eAAe,CAAC;CAC/B;AAqND,QAAA,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA8HvC,CAAC;AACF,eAAe,SAAS,CAAC"}

package/dist/components/effects/OrbEffect.js

@@ -1,9 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useRef, useMemo } from 'react';
+import { useCallback, useEffect, useLayoutEffect, useMemo, useRef } from 'react';
 import { useFrame } from '@react-three/fiber';
 import * as THREE from 'three';
-import { applyGenerativeAnimations } from '../../utils/handleGenerativeEffectsAnimations.js';
+import { withConfigDefaults } from '../../utils/configAnimations.js';
+import { DEFAULT_GENERATIVE_EFFECTS, EFFECTS_ANIMATABLE } from "@3driseai/3drise-core";
 import { useObjectReady } from '../../hooks/useObjectReady.js';
+import { useConfigDriver } from '../../hooks/useConfigDriver.js';
 // ── Shared vert (normal + viewDir) ────────────────────────────────────────────
 const sharedVert = /* glsl */ `
   varying vec3 vNormal;
@@ -26,6 +28,7 @@ const coreFrag = /* glsl */ `
   uniform float uNoiseAmount;
   uniform float uIntensity;
   uniform float uPulseSpeed;
+  uniform float uPulsePhase;  // integrated on the CPU: pulse speed changes never jump
 
   varying vec3 vNormal;
   varying vec3 vViewDir;
@@ -56,7 +59,7 @@ const coreFrag = /* glsl */ `
     // Solar flares: ultra-sharp spikes where FBM peaks
     float flares = smoothstep(0.70, 0.85, f) * 6.0;
 
-    float pulse  = 0.85 + 0.15 * sin(u_time * uPulseSpeed * 2.3);
+    float pulse  = 0.85 + 0.15 * sin(uPulsePhase * 2.3);
     float limb   = 1.0 - abs(dot(vNormal, vViewDir)) * 0.4; // limb darkening
 
     // Color: white-hot core cells, outer-color cool lanes
@@ -78,6 +81,7 @@ const plasmaFrag = /* glsl */ `
   uniform float uOpacity;
   uniform float uNoiseAmount;
   uniform float uPulseSpeed;
+  uniform float uPulsePhase;  // integrated on the CPU: pulse speed changes never jump
   uniform float uIntensity;
 
   varying vec3 vNormal;
@@ -116,7 +120,7 @@ const plasmaFrag = /* glsl */ `
     // Plasma cells: lower threshold dimmer glow
     float plasma   = smoothstep(0.50, 0.65, f) * 0.5;
 
-    float pulse    = 0.6 + 0.4 * sin(u_time * uPulseSpeed + uLayerIndex * 2.4);
+    float pulse    = 0.6 + 0.4 * sin(uPulsePhase + uLayerIndex * 2.4);
 
     vec3 col = iriCol + iriCol * (tendril * 2.0 + plasma);
     col      = mix(col, uInnerColor, tendril * 0.3); // brightest tendrils go white
@@ -135,6 +139,7 @@ const glowFrag = /* glsl */ `
   uniform vec3  uOuterColor;
   uniform float uOpacity;
   uniform float uPulseSpeed;
+  uniform float uPulsePhase;  // integrated on the CPU: pulse speed changes never jump
 
   varying vec3 vNormal;
   varying vec3 vViewDir;
@@ -142,7 +147,7 @@ const glowFrag = /* glsl */ `
   void main() {
     float ndv    = abs(dot(normalize(vNormal), normalize(vViewDir)));
     float fresnel = pow(1.0 - ndv, 1.2);
-    float pulse   = 0.55 + 0.45 * sin(u_time * uPulseSpeed * 0.7 + 1.2);
+    float pulse   = 0.55 + 0.45 * sin(uPulsePhase * 0.7 + 1.2);
     float alpha   = fresnel * uOpacity * pulse * 0.5;
     if (alpha < 0.003) discard;
     // Slowly cycle hue of the outer glow
@@ -182,72 +187,102 @@ const coronaFrag = /* glsl */ `
     gl_FragColor = vec4(col * (1.0 + pulse), alpha);
   }
 `;
-const OrbEffect = ({ boundingRadius, config, animations, onObjectReady, onObjectDispose }) => {
-    const { coreSize, glowLayers, innerColor, outerColor, coronaEnabled, coronaColor, noiseAmount, pulseSpeed, opacity, speed, intensity } = config;
-    const startValuesCacheRef = useRef({});
+/** Knobs that rebuild the orb (layer count, radii, the corona mount): commit only, never live. */
+const STRUCTURAL = ['glowLayers', 'coreSize', 'coronaEnabled'];
+/** Knobs a keyframe or pointer binding may drive per frame — exactly what the push point applies. */
+const ANIMATABLE = new Set(EFFECTS_ANIMATABLE.orb.map((p) => p.value));
+const _color = new THREE.Color();
+/** The single push point: every config knob reaches its uniform here. */
+function applyConfig(colors, core, shells, glow, corona, c) {
+    _color.set(c.innerColor);
+    colors.inner.set(_color.r, _color.g, _color.b);
+    _color.set(c.outerColor);
+    colors.outer.set(_color.r, _color.g, _color.b);
+    _color.set(c.coronaColor);
+    colors.corona.set(_color.r, _color.g, _color.b);
+    const pulse = c.pulseSpeed * c.speed;
+    for (const m of [core, ...shells]) {
+        const u = m.uniforms;
+        u.uOpacity.value = c.opacity;
+        u.uNoiseAmount.value = c.noiseAmount;
+        u.uIntensity.value = c.intensity;
+        u.uPulseSpeed.value = pulse;
+    }
+    glow.uniforms.uOpacity.value = c.opacity * 0.6;
+    glow.uniforms.uPulseSpeed.value = pulse;
+    corona.uniforms.uOpacity.value = c.opacity * 0.85;
+    corona.uniforms.uIntensity.value = c.intensity;
+}
+const OrbEffect = ({ boundingRadius, config, id, keyframes, mouseMove, onObjectReady, onObjectDispose }) => {
+    const cfg = useMemo(() => withConfigDefaults(DEFAULT_GENERATIVE_EFFECTS.orb, config), [config]);
+    const { coreSize, glowLayers, coronaEnabled } = cfg;
     const rootRef = useRef(null);
     useObjectReady(rootRef, config, onObjectReady, onObjectDispose);
-    const innerColorVec = useMemo(() => { const c = new THREE.Color(innerColor); return new THREE.Vector3(c.r, c.g, c.b); }, [innerColor]);
-    const outerColorVec = useMemo(() => { const c = new THREE.Color(outerColor); return new THREE.Vector3(c.r, c.g, c.b); }, [outerColor]);
-    const coronaColorVec = useMemo(() => { const c = new THREE.Color(coronaColor); return new THREE.Vector3(c.r, c.g, c.b); }, [coronaColor]);
+    // the knobs read per frame (speed), from the last merged config
+    const cur = useRef(cfg);
+    // shared by every material, so one write recolours the whole orb
+    const colors = useMemo(() => ({ inner: new THREE.Vector3(), outer: new THREE.Vector3(), corona: new THREE.Vector3() }), []);
     const coreR = boundingRadius * coreSize;
-    // Core material — boiling solar surface
+    // Core material - boiling solar surface
     const coreMat = useMemo(() => new THREE.ShaderMaterial({
         vertexShader: sharedVert,
         fragmentShader: coreFrag,
         uniforms: {
             u_time: { value: 0 },
-            uInnerColor: { value: innerColorVec },
-            uOuterColor: { value: outerColorVec },
-            uOpacity: { value: opacity },
-            uNoiseAmount: { value: noiseAmount },
-            uIntensity: { value: intensity },
-            uPulseSpeed: { value: pulseSpeed * speed },
+            uPulsePhase: { value: 0 },
+            uInnerColor: { value: colors.inner },
+            uOuterColor: { value: colors.outer },
+            uOpacity: { value: 1 },
+            uNoiseAmount: { value: 0.45 },
+            uIntensity: { value: 1 },
+            uPulseSpeed: { value: 1 },
         },
         transparent: true,
         depthWrite: false,
         blending: THREE.AdditiveBlending,
-    }), [innerColorVec, outerColorVec, opacity, noiseAmount, intensity, pulseSpeed, speed]);
-    // Plasma shell materials — one per layer
+    }), [colors]);
+    // Plasma shell materials - one per layer
     const shellMats = useMemo(() => Array.from({ length: glowLayers }, (_, i) => new THREE.ShaderMaterial({
         vertexShader: sharedVert,
         fragmentShader: plasmaFrag,
         uniforms: {
             u_time: { value: 0 },
+            uPulsePhase: { value: 0 },
             uLayerIndex: { value: glowLayers > 1 ? i / (glowLayers - 1) : 0 },
-            uInnerColor: { value: innerColorVec },
-            uOuterColor: { value: outerColorVec },
-            uOpacity: { value: opacity },
-            uNoiseAmount: { value: noiseAmount },
-            uPulseSpeed: { value: pulseSpeed * speed },
-            uIntensity: { value: intensity },
+            uInnerColor: { value: colors.inner },
+            uOuterColor: { value: colors.outer },
+            uOpacity: { value: 1 },
+            uNoiseAmount: { value: 0.45 },
+            uPulseSpeed: { value: 1 },
+            uIntensity: { value: 1 },
         },
         transparent: true,
         depthWrite: false,
         blending: THREE.AdditiveBlending,
         side: THREE.BackSide,
-    })), [glowLayers, innerColorVec, outerColorVec, opacity, noiseAmount, pulseSpeed, speed, intensity]);
+    })), [glowLayers, colors]);
     // Outer diffuse glow
     const glowMat = useMemo(() => new THREE.ShaderMaterial({
         vertexShader: sharedVert,
         fragmentShader: glowFrag,
         uniforms: {
             u_time: { value: 0 },
-            uOuterColor: { value: outerColorVec },
-            uOpacity: { value: opacity * 0.6 },
-            uPulseSpeed: { value: pulseSpeed * speed },
+            uPulsePhase: { value: 0 },
+            uOuterColor: { value: colors.outer },
+            uOpacity: { value: 0.6 },
+            uPulseSpeed: { value: 1 },
         },
         transparent: true,
         depthWrite: false,
         blending: THREE.AdditiveBlending,
         side: THREE.BackSide,
-    }), [outerColorVec, opacity, pulseSpeed, speed]);
-    // Corona ring geometry — torus with per-vertex angle attribute for color flow
+    }), [colors]);
+    // Corona ring geometry - torus with per-vertex angle attribute for color flow
     const { coronaGeo, coronaMat } = useMemo(() => {
         const tubeSegs = 80;
         const geo = new THREE.TorusGeometry(coreR * 2.8, coreR * 0.12, 8, tubeSegs);
         const count = geo.attributes.position.count;
-        // Per-vertex angle around the ring (0 → 2π)
+        // Per-vertex angle around the ring (0 -> 2pi)
         const angles = new Float32Array(count);
         // TorusGeometry vertices go around the major circle; approximate angle from XZ
         const pos = geo.attributes.position;
@@ -260,28 +295,40 @@ const OrbEffect = ({ boundingRadius, config, animations, onObjectReady, onObject
             fragmentShader: coronaFrag,
             uniforms: {
                 u_time: { value: 0 },
-                uCoronaColor: { value: coronaColorVec },
-                uOpacity: { value: opacity * 0.85 },
-                uIntensity: { value: intensity },
+                uCoronaColor: { value: colors.corona },
+                uOpacity: { value: 0.85 },
+                uIntensity: { value: 1 },
             },
             transparent: true,
             depthWrite: false,
             blending: THREE.AdditiveBlending,
         });
         return { coronaGeo: geo, coronaMat: mat };
-    }, [coreR, coronaColorVec, opacity, intensity]);
+    }, [coreR, colors]);
+    useEffect(() => () => coreMat.dispose(), [coreMat]);
+    useEffect(() => () => shellMats.forEach((m) => m.dispose()), [shellMats]);
+    useEffect(() => () => glowMat.dispose(), [glowMat]);
+    useEffect(() => () => { coronaGeo.dispose(); coronaMat.dispose(); }, [coronaGeo, coronaMat]);
+    const push = useCallback((merged) => {
+        cur.current = merged;
+        applyConfig(colors, coreMat, shellMats, glowMat, coronaMat, merged);
+    }, [colors, coreMat, shellMats, glowMat, coronaMat]);
+    useLayoutEffect(() => { push(cfg); }, [push, cfg]);
+    useConfigDriver({ rootRef, id, family: 'effects', base: cfg, structural: STRUCTURAL, allowed: ANIMATABLE, keyframes, mouseMove, push });
     const coronaGroupRef = useRef(null);
     const allMats = useMemo(() => [coreMat, ...shellMats, glowMat, coronaMat], [coreMat, shellMats, glowMat, coronaMat]);
     useFrame((state, delta) => {
         const t = state.clock.getElapsedTime();
-        for (const mat of allMats)
+        const dt = Math.min(delta, 0.1);
+        for (const mat of allMats) {
             mat.uniforms.u_time.value = t;
+            // integrated, so changing the pulse speed never makes the pulse jump
+            if (mat.uniforms.uPulsePhase)
+                mat.uniforms.uPulsePhase.value += dt * mat.uniforms.uPulseSpeed.value;
+        }
         // Tilt the corona ring and rotate slowly
         if (coronaGroupRef.current) {
-            coronaGroupRef.current.rotation.z += delta * speed * 0.4;
-        }
-        if (animations?.length) {
-            applyGenerativeAnimations(allMats, animations, startValuesCacheRef.current, Date.now(), false);
+            coronaGroupRef.current.rotation.z += delta * cur.current.speed * 0.4;
         }
     });
     const glowR = coreR * (3.5 + glowLayers * 0.6);

package/dist/components/effects/PlanetaryRingsEffect.d.ts

@@ -1,10 +1,15 @@
 import React from 'react';
-import type { AnimationOptions, PlanetaryRingsConfig } from '@3driseai/3drise-core';
+import type { AnimationOptions, PlanetaryRingsConfig, MouseMoveDomain } from '@3driseai/3drise-core';
 import type { ObjectReadyProps } from '../../types/objectReady';
 export interface PlanetaryRingsEffectProps extends ObjectReadyProps {
     boundingRadius: number;
     config: PlanetaryRingsConfig;
-    animations?: AnimationOptions[];
+    /** Scene object id of a standalone effect: the live-edit handle is found by it. */
+    id?: string;
+    /** Keyframes on this effect's config knobs (animations.effect.animations). */
+    keyframes?: AnimationOptions[];
+    /** Pointer bindings on this effect's config knobs (mouseMove.effect). */
+    mouseMove?: MouseMoveDomain;
     /** True when the effect is attached to an object, so it can react to the host. */
     hasHost?: boolean;
 }

package/dist/components/effects/PlanetaryRingsEffect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PlanetaryRingsEffect.d.ts","sourceRoot":"","sources":["../../../src/components/effects/PlanetaryRingsEffect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsD,MAAM,OAAO,CAAC;AAG3E,OAAO,KAAK,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAGpF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAEhE,MAAM,WAAW,yBAA0B,SAAQ,gBAAgB;IAC/D,cAAc,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,oBAAoB,CAAC;IAC7B,UAAU,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAChC,kFAAkF;IAClF,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB;AAqbD,QAAA,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CA+B7D,CAAC;AAEF,eAAe,oBAAoB,CAAC"}
+{"version":3,"file":"PlanetaryRingsEffect.d.ts","sourceRoot":"","sources":["../../../src/components/effects/PlanetaryRingsEffect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmE,MAAM,OAAO,CAAC;AAIxF,OAAO,KAAK,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAIrG,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAEhE,MAAM,WAAW,yBAA0B,SAAQ,gBAAgB;IAC/D,cAAc,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,oBAAoB,CAAC;IAC7B,mFAAmF;IACnF,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,8EAA8E;IAC9E,SAAS,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC/B,yEAAyE;IACzE,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,kFAAkF;IAClF,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB;AA2bD,QAAA,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CAqC7D,CAAC;AAEF,eAAe,oBAAoB,CAAC"}

package/dist/components/effects/PlanetaryRingsEffect.js

@@ -1,9 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect, useLayoutEffect, useMemo, useRef } from 'react';
+import { useCallback, useEffect, useLayoutEffect, useMemo, useRef } from 'react';
 import * as THREE from 'three';
 import { useFrame } from '@react-three/fiber';
-import { applyGenerativeAnimations } from '../../utils/handleGenerativeEffectsAnimations.js';
+import { EFFECTS_ANIMATABLE } from '@3driseai/3drise-core';
+import { withConfigDefaults } from '../../utils/configAnimations.js';
 import { useObjectReady } from '../../hooks/useObjectReady.js';
+import { useConfigDriver } from '../../hooks/useConfigDriver.js';
 /**
  * A Saturn-like ring system: Keplerian shear shapes icy clumps, resonant moons open gaps and spiral density waves, and the planet casts a soft shadow. Use for planets, sci-fi, space scenes.
  *
@@ -414,7 +416,7 @@ function build(u, c, bound, env) {
         },
     };
 }
-/** Defaults for every knob, so an older saved config still renders. */
+/** A value for every knob: the base the renderer draws and keyframes interpolate from. */
 const DEFAULTS = {
     intensity: 1,
     speed: 1,
@@ -431,27 +433,35 @@ const DEFAULTS = {
     gapColor: '#8fa2b6',
     dustColor: '#ffd3a1',
 };
-const PlanetaryRingsEffect = ({ boundingRadius, config, animations, hasHost = false, onObjectReady, onObjectDispose }) => {
+/** Knobs that rebuild the object: they change on commit, never through the live path. */
+const STRUCTURAL = [];
+/** Knobs a keyframe or pointer binding may drive per frame — exactly what the push point applies. */
+const ANIMATABLE = new Set(EFFECTS_ANIMATABLE.planetaryRings.map((p) => p.value));
+const PlanetaryRingsEffect = ({ boundingRadius, config, id, keyframes, mouseMove, hasHost = false, onObjectReady, onObjectDispose }) => {
     const rootRef = useRef(null);
-    const animCache = useRef({});
     useObjectReady(rootRef, config, onObjectReady, onObjectDispose);
     // a standalone effect gets boundingRadius 1
     const b = boundingRadius > 0 ? boundingRadius : 1;
-    const cfg = useMemo(() => ({ ...DEFAULTS, ...config }), [config]);
+    const cfg = useMemo(() => withConfigDefaults(DEFAULTS, config), [config]);
     const env = useMemo(() => ({ hasHost: hasHost }), [hasHost]);
     // uniforms outlive the objects, so keyframe animations survive a rebuild
     const uniforms = useMemo(() => createUniforms(), []);
     // rebuilt only when the host size or a structural knob changes
-    const instance = useMemo(() => build(uniforms, { ...DEFAULTS, ...config }, b, env), [uniforms, b, env]);
+    const instance = useMemo(() => build(uniforms, cfg, b, env), [uniforms, b, env]);
     useEffect(() => () => instance.dispose(), [instance]);
     useLayoutEffect(() => {
         applyConfig(uniforms, cfg, b, env);
         instance.apply(cfg);
     }, [instance, uniforms, cfg, b, env]);
+    // Committed config + live drag + keyframes + pointer, merged into the one push point
+    // (the uniforms, then the instance's own cheap per-config step).
+    const push = useCallback((merged) => {
+        applyConfig(uniforms, merged, b, env);
+        instance.apply(merged);
+    }, [instance, uniforms, b, env]);
+    useConfigDriver({ rootRef, id, family: 'effects', base: cfg, structural: STRUCTURAL, allowed: ANIMATABLE, keyframes, mouseMove, push });
     useFrame((state, delta) => {
         instance.update(Math.min(delta, 0.1), state.camera);
-        if (animations?.length)
-            applyGenerativeAnimations(instance.materials, animations, animCache.current, Date.now(), false);
     });
     return (_jsx("group", { ref: rootRef, children: _jsx("primitive", { object: instance.object }) }));
 };

package/dist/components/effects/PortalEffect.d.ts

@@ -1,10 +1,15 @@
-import React from 'react';
-import type { AnimationOptions, PortalConfig } from '@3driseai/3drise-core';
+import React from "react";
+import type { PortalConfig, AnimationOptions, MouseMoveDomain } from "@3driseai/3drise-core";
 import type { ObjectReadyProps } from '../../types/objectReady';
 export interface PortalEffectProps extends ObjectReadyProps {
     boundingRadius: number;
     config: PortalConfig;
-    animations?: AnimationOptions[];
+    /** Scene object id of a standalone effect: the live-edit handle is found by it. */
+    id?: string;
+    /** Keyframes on this effect's config knobs (animations.effect.animations). */
+    keyframes?: AnimationOptions[];
+    /** Pointer bindings on this effect's config knobs (mouseMove.effect). */
+    mouseMove?: MouseMoveDomain;
 }
 declare const PortalEffect: React.FC<PortalEffectProps>;
 export default PortalEffect;

package/dist/components/effects/PortalEffect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PortalEffect.d.ts","sourceRoot":"","sources":["../../../src/components/effects/PortalEffect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsD,MAAM,OAAO,CAAC;AAG3E,OAAO,KAAK,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAG5E,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAEhE,MAAM,WAAW,iBAAkB,SAAQ,gBAAgB;IACvD,cAAc,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,YAAY,CAAC;IACrB,UAAU,CAAC,EAAE,gBAAgB,EAAE,CAAC;CACnC;AAsND,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAyE7C,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"PortalEffect.d.ts","sourceRoot":"","sources":["../../../src/components/effects/PortalEffect.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAG7F,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAChE,MAAM,WAAW,iBAAkB,SAAQ,gBAAgB;IACvD,cAAc,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,YAAY,CAAC;IACrB,mFAAmF;IACnF,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,8EAA8E;IAC9E,SAAS,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC/B,yEAAyE;IACzE,SAAS,CAAC,EAAE,eAAe,CAAC;CAC/B;AAgPD,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAgE7C,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/components/effects/PortalEffect.js

@@ -1,9 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useLayoutEffect, useMemo, useRef } from 'react';
-import * as THREE from 'three';
+import { useCallback, useEffect, useLayoutEffect, useMemo, useRef } from 'react';
 import { useFrame } from '@react-three/fiber';
-import { applyGenerativeAnimations } from '../../utils/handleGenerativeEffectsAnimations.js';
+import * as THREE from 'three';
+import { withConfigDefaults } from '../../utils/configAnimations.js';
+import { DEFAULT_GENERATIVE_EFFECTS, EFFECTS_ANIMATABLE } from "@3driseai/3drise-core";
 import { useObjectReady } from '../../hooks/useObjectReady.js';
+import { useConfigDriver } from '../../hooks/useConfigDriver.js';
 /**
  * A wormhole portal lying under the host.
  *
@@ -58,6 +60,7 @@ const portalVert = /* glsl */ `
 const portalFrag = /* glsl */ `
   uniform float uTime;
   uniform float uRotationSpeed;
+  uniform float uSpin;  // integrated on the CPU: rotation speed changes never jump
   uniform float uSpiralTurns;
   uniform float uThroatSize;
   uniform vec3  uInnerGlowColor;
@@ -125,7 +128,7 @@ const portalFrag = /* glsl */ `
     if (r > 1.0) discard;
     float theta = atan(vP.y, vP.x);
     float rt = uThroatSize;
-    float t = uTime * uRotationSpeed;
+    float t = uSpin;
     float aa = fwidth(r) * 1.5;
 
     // ---- throat: the other side, compressed toward the rim like a fisheye.
@@ -166,6 +169,7 @@ const infallVert = /* glsl */ `
   attribute vec3 aSeed;           // x: start angle, y: phase, z: random
   uniform float uTime;
   uniform float uRotationSpeed;
+  uniform float uSpin;  // integrated on the CPU: rotation speed changes never jump
   uniform float uThroatSize;
   uniform float uFunnelDepth;
   uniform float uRadius;
@@ -176,7 +180,7 @@ const infallVert = /* glsl */ `
   void main(){
     // Matter spirals in on r = r0 exp(-k tau) with Keplerian angular speed;
     // the angle is the closed-form integral of Omega = Omega0 r^-1.5.
-    float life = fract(aSeed.y + uTime * uRotationSpeed * 0.05 * (0.7 + 0.6 * aSeed.z));
+    float life = fract(aSeed.y + uSpin * 0.05 * (0.7 + 0.6 * aSeed.z));
     float r0 = 0.95;
     float rt = uThroatSize;
     float k = log(r0 / rt);
@@ -209,15 +213,35 @@ const infallFrag = /* glsl */ `
     gl_FragColor = vec4(col * a, a);
   }
 `;
-const PortalEffect = ({ boundingRadius, config, animations, onObjectReady, onObjectDispose }) => {
-    const { intensity = 1, speed = 1, opacity = 0.95, radius = 1.5, spiralTurns = 6, innerGlowColor = '#e9e4ff', outerGlowColor = '#8800ff', rotationSpeed = 1.2, particleRingEnabled = true, particleCount = 160, throatSize = 0.38, funnelDepth = 0.6, otherSideColor = '#2a6bff', } = config;
+/** Knobs that rebuild the object: commit only, never live. */
+const STRUCTURAL = ['particleCount'];
+/** Knobs a keyframe or pointer binding may drive per frame — exactly what the push point applies. */
+const ANIMATABLE = new Set(EFFECTS_ANIMATABLE.portal.map((p) => p.value));
+/** The single push point: every config knob reaches its uniform here. */
+function applyConfig(u, c, bound) {
+    u.uSpeed.value = c.speed;
+    u.uBound.value = bound;
+    u.uIntensity.value = c.intensity;
+    u.uOpacity.value = c.opacity;
+    u.uRadius.value = c.radius;
+    u.uSpiralTurns.value = c.spiralTurns;
+    u.uRotationSpeed.value = c.rotationSpeed;
+    u.uThroatSize.value = c.throatSize;
+    u.uFunnelDepth.value = c.funnelDepth;
+    u.uInnerGlowColor.value.set(c.innerGlowColor);
+    u.uOuterGlowColor.value.set(c.outerGlowColor);
+    u.uOtherSideColor.value.set(c.otherSideColor);
+}
+const PortalEffect = ({ boundingRadius, config, id, keyframes, mouseMove, onObjectReady, onObjectDispose }) => {
+    const cfg = useMemo(() => withConfigDefaults(DEFAULT_GENERATIVE_EFFECTS.portal, config), [config]);
+    const { particleRingEnabled, particleCount } = cfg;
     const rootRef = useRef(null);
-    const animCache = useRef({});
     useObjectReady(rootRef, config, onObjectReady, onObjectDispose);
     // a standalone effect gets boundingRadius 1; guard against an empty host
     const b = boundingRadius > 0 ? boundingRadius : 1;
     const uniforms = useMemo(() => ({
         uTime: { value: 0 },
+        uSpin: { value: 0 },
         uSpeed: { value: 1 },
         uBound: { value: 1 },
         uIntensity: { value: 1 },
@@ -247,24 +271,16 @@ const PortalEffect = ({ boundingRadius, config, animations, onObjectReady, onObj
         return g;
     }, [particleCount]);
     useEffect(() => () => infallGeometry.dispose(), [infallGeometry]);
-    useLayoutEffect(() => {
-        uniforms.uSpeed.value = speed;
-        uniforms.uBound.value = b;
-        uniforms.uIntensity.value = intensity;
-        uniforms.uOpacity.value = opacity;
-        uniforms.uRadius.value = radius;
-        uniforms.uSpiralTurns.value = spiralTurns;
-        uniforms.uRotationSpeed.value = rotationSpeed;
-        uniforms.uThroatSize.value = throatSize;
-        uniforms.uFunnelDepth.value = funnelDepth;
-        uniforms.uInnerGlowColor.value.set(innerGlowColor);
-        uniforms.uOuterGlowColor.value.set(outerGlowColor);
-        uniforms.uOtherSideColor.value.set(otherSideColor);
-    }, [uniforms, speed, b, intensity, opacity, radius, spiralTurns, rotationSpeed, throatSize, funnelDepth, innerGlowColor, outerGlowColor, otherSideColor]);
+    const push = useCallback((merged) => {
+        applyConfig(uniforms, merged, b);
+    }, [uniforms, b]);
+    useLayoutEffect(() => { push(cfg); }, [push, cfg]);
+    useConfigDriver({ rootRef, id, family: 'effects', base: cfg, structural: STRUCTURAL, allowed: ANIMATABLE, keyframes, mouseMove, push });
     useFrame((_, delta) => {
-        uniforms.uTime.value += delta * uniforms.uSpeed.value;
-        if (animations?.length)
-            applyGenerativeAnimations(materials, animations, animCache.current, Date.now(), false);
+        const dt = delta * uniforms.uSpeed.value;
+        uniforms.uTime.value += dt;
+        // the swirl angle is integrated, so changing the rotation speed never makes it jump
+        uniforms.uSpin.value += dt * uniforms.uRotationSpeed.value;
     });
     return (_jsx("group", { ref: rootRef, children: _jsxs("group", { rotation: [-Math.PI / 2, 0, 0], position: [0, -b * 0.75, 0], children: [_jsx("mesh", { geometry: discGeometry, material: materials[0], frustumCulled: false }), _jsx("points", { geometry: infallGeometry, material: materials[1], visible: particleRingEnabled, frustumCulled: false })] }) }));
 };

package/dist/components/effects/ShockwaveEffect.d.ts

@@ -1,10 +1,15 @@
 import React from 'react';
-import type { AnimationOptions, ShockwaveConfig } from '@3driseai/3drise-core';
+import type { AnimationOptions, ShockwaveConfig, MouseMoveDomain } from '@3driseai/3drise-core';
 import type { ObjectReadyProps } from '../../types/objectReady';
 export interface ShockwaveEffectProps extends ObjectReadyProps {
     boundingRadius: number;
     config: ShockwaveConfig;
-    animations?: AnimationOptions[];
+    /** Scene object id of a standalone effect: the live-edit handle is found by it. */
+    id?: string;
+    /** Keyframes on this effect's config knobs (animations.effect.animations). */
+    keyframes?: AnimationOptions[];
+    /** Pointer bindings on this effect's config knobs (mouseMove.effect). */
+    mouseMove?: MouseMoveDomain;
     /** True when the effect is attached to an object, so it can react to the host. */
     hasHost?: boolean;
 }

package/dist/components/effects/ShockwaveEffect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ShockwaveEffect.d.ts","sourceRoot":"","sources":["../../../src/components/effects/ShockwaveEffect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsD,MAAM,OAAO,CAAC;AAG3E,OAAO,KAAK,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAG/E,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAEhE,MAAM,WAAW,oBAAqB,SAAQ,gBAAgB;IAC1D,cAAc,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,eAAe,CAAC;IACxB,UAAU,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAChC,kFAAkF;IAClF,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB;AA4hBD,QAAA,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA+BnD,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"ShockwaveEffect.d.ts","sourceRoot":"","sources":["../../../src/components/effects/ShockwaveEffect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmE,MAAM,OAAO,CAAC;AAIxF,OAAO,KAAK,EAAE,gBAAgB,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAIhG,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAEhE,MAAM,WAAW,oBAAqB,SAAQ,gBAAgB;IAC1D,cAAc,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,eAAe,CAAC;IACxB,mFAAmF;IACnF,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,8EAA8E;IAC9E,SAAS,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC/B,yEAAyE;IACzE,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,kFAAkF;IAClF,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB;AAkiBD,QAAA,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAqCnD,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/components/effects/ShockwaveEffect.js

@@ -1,9 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect, useLayoutEffect, useMemo, useRef } from 'react';
+import { useCallback, useEffect, useLayoutEffect, useMemo, useRef } from 'react';
 import * as THREE from 'three';
 import { useFrame } from '@react-three/fiber';
-import { applyGenerativeAnimations } from '../../utils/handleGenerativeEffectsAnimations.js';
+import { EFFECTS_ANIMATABLE } from '@3driseai/3drise-core';
+import { withConfigDefaults } from '../../utils/configAnimations.js';
 import { useObjectReady } from '../../hooks/useObjectReady.js';
+import { useConfigDriver } from '../../hooks/useConfigDriver.js';
 /**
  * A Sedov–Taylor blast wave: a razor-bright front over a compressed shell that bursts out, slows and cools, raising dust and a brief condensation dome. Use for explosions, impacts, sci-fi pulses.
  *
@@ -514,7 +516,7 @@ function build(u, c, bound, env) {
         },
     };
 }
-/** Defaults for every knob, so an older saved config still renders. */
+/** A value for every knob: the base the renderer draws and keyframes interpolate from. */
 const DEFAULTS = {
     intensity: 1,
     speed: 1,
@@ -531,27 +533,35 @@ const DEFAULTS = {
     dust: 0.5,
     condensation: 0.3,
 };
-const ShockwaveEffect = ({ boundingRadius, config, animations, hasHost = false, onObjectReady, onObjectDispose }) => {
+/** Knobs that rebuild the object: they change on commit, never through the live path. */
+const STRUCTURAL = [];
+/** Knobs a keyframe or pointer binding may drive per frame — exactly what the push point applies. */
+const ANIMATABLE = new Set(EFFECTS_ANIMATABLE.shockwave.map((p) => p.value));
+const ShockwaveEffect = ({ boundingRadius, config, id, keyframes, mouseMove, hasHost = false, onObjectReady, onObjectDispose }) => {
     const rootRef = useRef(null);
-    const animCache = useRef({});
     useObjectReady(rootRef, config, onObjectReady, onObjectDispose);
     // a standalone effect gets boundingRadius 1
     const b = boundingRadius > 0 ? boundingRadius : 1;
-    const cfg = useMemo(() => ({ ...DEFAULTS, ...config }), [config]);
+    const cfg = useMemo(() => withConfigDefaults(DEFAULTS, config), [config]);
     const env = useMemo(() => ({ hasHost: hasHost }), [hasHost]);
     // uniforms outlive the objects, so keyframe animations survive a rebuild
     const uniforms = useMemo(() => createUniforms(), []);
     // rebuilt only when the host size or a structural knob changes
-    const instance = useMemo(() => build(uniforms, { ...DEFAULTS, ...config }, b, env), [uniforms, b, env]);
+    const instance = useMemo(() => build(uniforms, cfg, b, env), [uniforms, b, env]);
     useEffect(() => () => instance.dispose(), [instance]);
     useLayoutEffect(() => {
         applyConfig(uniforms, cfg, b, env);
         instance.apply(cfg);
     }, [instance, uniforms, cfg, b, env]);
+    // Committed config + live drag + keyframes + pointer, merged into the one push point
+    // (the uniforms, then the instance's own cheap per-config step).
+    const push = useCallback((merged) => {
+        applyConfig(uniforms, merged, b, env);
+        instance.apply(merged);
+    }, [instance, uniforms, b, env]);
+    useConfigDriver({ rootRef, id, family: 'effects', base: cfg, structural: STRUCTURAL, allowed: ANIMATABLE, keyframes, mouseMove, push });
     useFrame((state, delta) => {
         instance.update(Math.min(delta, 0.1), state.camera);
-        if (animations?.length)
-            applyGenerativeAnimations(instance.materials, animations, animCache.current, Date.now(), false);
     });
     return (_jsx("group", { ref: rootRef, children: _jsx("primitive", { object: instance.object }) }));
 };

package/dist/components/effects/SmokePlumeEffect.d.ts

@@ -1,10 +1,15 @@
-import React from 'react';
-import type { AnimationOptions, SmokePlumeConfig } from '@3driseai/3drise-core';
+import React from "react";
+import type { SmokePlumeConfig, AnimationOptions, MouseMoveDomain } from "@3driseai/3drise-core";
 import type { ObjectReadyProps } from '../../types/objectReady';
 export interface SmokePlumeEffectProps extends ObjectReadyProps {
     boundingRadius: number;
     config: SmokePlumeConfig;
-    animations?: AnimationOptions[];
+    /** Scene object id of a standalone effect: the live-edit handle is found by it. */
+    id?: string;
+    /** Keyframes on this effect's config knobs (animations.effect.animations). */
+    keyframes?: AnimationOptions[];
+    /** Pointer bindings on this effect's config knobs (mouseMove.effect). */
+    mouseMove?: MouseMoveDomain;
 }
 declare const SmokePlumeEffect: React.FC<SmokePlumeEffectProps>;
 export default SmokePlumeEffect;

package/dist/components/effects/SmokePlumeEffect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SmokePlumeEffect.d.ts","sourceRoot":"","sources":["../../../src/components/effects/SmokePlumeEffect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsD,MAAM,OAAO,CAAC;AAG3E,OAAO,KAAK,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAGhF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAEhE,MAAM,WAAW,qBAAsB,SAAQ,gBAAgB;IAC3D,cAAc,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,gBAAgB,CAAC;IACzB,UAAU,CAAC,EAAE,gBAAgB,EAAE,CAAC;CACnC;AA4JD,QAAA,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CA+DrD,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"SmokePlumeEffect.d.ts","sourceRoot":"","sources":["../../../src/components/effects/SmokePlumeEffect.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAGjG,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAChE,MAAM,WAAW,qBAAsB,SAAQ,gBAAgB;IAC3D,cAAc,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,gBAAgB,CAAC;IACzB,mFAAmF;IACnF,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,8EAA8E;IAC9E,SAAS,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC/B,yEAAyE;IACzE,SAAS,CAAC,EAAE,eAAe,CAAC;CAC/B;AAgLD,QAAA,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAoDrD,CAAC;AAEF,eAAe,gBAAgB,CAAC"}