motion 13.1.1 → 13.2.0

package/dist/es/vgpu.mjs

@@ -0,0 +1,244 @@
+import { createEffect, frame, rgba, color, clamp, hslaToRgba } from 'framer-motion/dom';
+
+const axes = "xyzw";
+const radiansPerDegree = Math.PI / 180;
+const transforms = {
+    x: ["position", 0],
+    y: ["position", 1],
+    z: ["position", 2],
+    rotateX: ["rotation", 0, true],
+    rotateY: ["rotation", 1, true],
+    rotateZ: ["rotation", 2, true],
+    scaleX: ["scale", 0],
+    scaleY: ["scale", 1],
+    scaleZ: ["scale", 2],
+};
+/**
+ * Last vector written to each path. vgpu subjects like Effect and
+ * SharedUniforms have no getters, and SceneNode stores rotation as a
+ * quaternion, so this is how single components find their siblings.
+ */
+const shadows = new WeakMap();
+/**
+ * Values changed this frame, flushed into one set() per subject.
+ */
+const pending = new Map();
+function flush() {
+    pending.forEach(applyValues);
+    pending.clear();
+}
+/**
+ * Binds motion values to vgpu shared uniforms, Effect/Draw/Compute bindings
+ * ("params.time"), scene nodes (x, rotateY, scale), cameras, lights,
+ * materials, orbit controls and target clear colors.
+ *
+ * Register with `animate.addEffect(vgpuEffect)` so `animate()` can target
+ * these subjects directly, or call it yourself to wire up existing motion
+ * values:
+ *
+ * ```ts
+ * vgpuEffect(wave, { "params.time": time })
+ * vgpuEffect(cube, { x, rotateY })
+ * ```
+ *
+ * Changed values are batched into a single set() per subject per frame in
+ * `frame.preRender`, ahead of render loops scheduled with `frame.render`.
+ */
+const vgpuEffect = createEffect((subject, state, key, value) => state.set(key, value, () => {
+    const bag = pending.get(subject) ?? {};
+    bag[key] = state.latest[key];
+    pending.set(subject, bag);
+    frame.preRender(flush, false, true);
+}, undefined, false), {
+    test: isVGPUSubject,
+    read: readInitial,
+    step: frame.preRender,
+});
+/**
+ * Claims vgpu shader units (Effect, Draw, Compute), shared uniforms, scene
+ * nodes, materials, orbit controls and targets. Everything else, including
+ * Three.js vectors and plain objects, is left alone.
+ */
+function isVGPUSubject(subject) {
+    if (!subject || typeof subject !== "object")
+        return false;
+    const s = subject;
+    return typeof s.set === "function"
+        ? typeof s.kind === "string" ||
+            "gpu" in s ||
+            "reflection" in s ||
+            typeof s.yaw === "number"
+        : "clearColor" in s && "gpu" in s;
+}
+function isNode(subject) {
+    return "quaternion" in subject;
+}
+function isVector(value) {
+    return Array.isArray(value) || ArrayBuffer.isView(value);
+}
+function resolveKey(subject, key) {
+    const transform = isNode(subject) && transforms[key];
+    if (transform) {
+        return {
+            path: [transform[0]],
+            index: transform[1],
+            degrees: transform[2],
+        };
+    }
+    const path = key.split(".");
+    const last = path[path.length - 1];
+    const index = axes.indexOf(last.slice(-1).toLowerCase());
+    if (last.length > 1 && index !== -1) {
+        const base = [...path.slice(0, -1), last.slice(0, -1)];
+        if (getVector(subject, base))
+            return { path: base, index };
+    }
+    return { path };
+}
+function readPath(subject, path) {
+    return path.reduce((value, key) => value?.[key], subject);
+}
+/**
+ * Reads a subject property, falling back to ShaderMaterial's `values` record.
+ */
+function readValue(subject, path) {
+    return (readPath(subject, path) ??
+        (subject.values && readPath(subject.values, path)));
+}
+function getVector(subject, path) {
+    const value = readValue(subject, path);
+    if (isVector(value))
+        return Array.from(value);
+    const shadow = shadows.get(subject)?.[path.join(".")];
+    if (shadow)
+        return shadow;
+    return path[0] === "rotation" && isNode(subject)
+        ? eulerFromQuaternion(subject.quaternion)
+        : undefined;
+}
+function setShadow(subject, path, vector) {
+    const shadow = shadows.get(subject) ?? {};
+    shadow[path.join(".")] = vector;
+    shadows.set(subject, shadow);
+}
+function setPath(target, path, value) {
+    var _a;
+    const last = path.length - 1;
+    let current = target;
+    for (let i = 0; i < last; i++) {
+        current = current[_a = path[i]] ?? (current[_a] = {});
+    }
+    current[path[last]] = value;
+}
+function isColorTarget(target) {
+    const sample = Array.isArray(target)
+        ? target.find((value) => typeof value === "string")
+        : target;
+    return typeof sample === "string" && color.test(sample);
+}
+function readInitial(subject, key, target) {
+    const { path, index, degrees } = resolveKey(subject, key);
+    if (index !== undefined) {
+        const value = getVector(subject, path)?.[index];
+        return degrees && value !== undefined ? value / radiansPerDegree : value;
+    }
+    const value = readValue(subject, path);
+    if (typeof value === "number")
+        return value;
+    if (!isVector(value))
+        return undefined;
+    if (isColorTarget(target))
+        return toColorString(value);
+    const sample = Array.isArray(target)
+        ? target.find((keyframe) => keyframe !== null)
+        : target;
+    // A numeric target on a vector reads the first component (uniform scale)
+    return typeof sample === "string" ? Array.from(value).join(" ") : value[0];
+}
+function applyValues(values, subject) {
+    const bag = {};
+    const vectors = new Map();
+    for (const key in values) {
+        const target = resolveKey(subject, key);
+        const { path, index, degrees } = target;
+        const value = values[key];
+        if (index === undefined) {
+            const parsed = parseValue(value, getVector(subject, path));
+            Array.isArray(parsed) && setShadow(subject, path, parsed);
+            setPath(bag, path, parsed);
+            continue;
+        }
+        const id = path.join(".");
+        const entry = vectors.get(id) ?? {
+            ...target,
+            vector: getVector(subject, path) ?? [],
+        };
+        vectors.set(id, entry);
+        entry.vector[index] = degrees
+            ? value * radiansPerDegree
+            : value;
+    }
+    vectors.forEach(({ path, vector }) => {
+        setShadow(subject, path, vector);
+        setPath(bag, path, vector);
+    });
+    typeof subject.set === "function"
+        ? subject.set(bag)
+        : Object.assign(subject, bag);
+}
+/**
+ * Converts animated strings into vgpu values: CSS colors become linear RGB
+ * (matching vgpu/scene's srgb()), "1 0 0" becomes [1, 0, 0].
+ */
+function parseValue(value, current) {
+    if (typeof value !== "string")
+        return value;
+    if (color.test(value)) {
+        const parsed = color.parse(value);
+        const { red, green, blue, alpha = 1, } = "hue" in parsed ? hslaToRgba(parsed) : parsed;
+        const linear = [red, green, blue].map((channel) => toLinear(channel / 255));
+        return current?.length === 4 ? [...linear, alpha] : linear;
+    }
+    const parts = value
+        .split(",")
+        .join(" ")
+        .split(" ")
+        .filter(Boolean)
+        .map(Number);
+    return parts.length > 1 && parts.every((part) => !isNaN(part))
+        ? parts
+        : value;
+}
+function toLinear(channel) {
+    return channel <= 0.04045
+        ? channel / 12.92
+        : ((channel + 0.055) / 1.055) ** 2.4;
+}
+function toSRGB(channel) {
+    return channel <= 0.0031308
+        ? channel * 12.92
+        : 1.055 * channel ** (1 / 2.4) - 0.055;
+}
+function toColorString(linear) {
+    const [red, green, blue, alpha = 1] = Array.from(linear).map((channel, i) => i < 3 ? toSRGB(channel) * 255 : channel);
+    return rgba.transform({ red, green, blue, alpha });
+}
+/**
+ * Inverse of vgpu's quatFromEuler (intrinsic XYZ).
+ */
+function eulerFromQuaternion(quaternion) {
+    const [x, y, z, w] = Array.from(quaternion);
+    const m13 = 2 * (x * z + w * y);
+    const singular = Math.abs(m13) > 0.9999999;
+    return [
+        singular
+            ? Math.atan2(2 * (y * z + w * x), 1 - 2 * (x * x + z * z))
+            : Math.atan2(-2 * (y * z - w * x), 1 - 2 * (x * x + y * y)),
+        Math.asin(clamp(-1, 1, m13)),
+        singular
+            ? 0
+            : Math.atan2(-2 * (x * y - w * z), 1 - 2 * (y * y + z * z)),
+    ];
+}
+
+export { vgpuEffect };

package/dist/motion.dev.js

@@ -1039,15 +1039,16 @@
      * to prevent infinite loops
      */
     const maxGeneratorDuration = 20000;
-    function calcGeneratorDuration(generator) {
+    function calcGeneratorDuration(generator, timeStep = 50, maxDuration = maxGeneratorDuration, keyframes) {
         let duration = 0;
-        const timeStep = 50;
         let state = generator.next(duration);
-        while (!state.done && duration < maxGeneratorDuration) {
+        keyframes?.push(state.value);
+        while (!state.done && duration < maxDuration) {
             duration += timeStep;
             state = generator.next(duration);
+            keyframes?.push(state.value);
         }
-        return duration >= maxGeneratorDuration ? Infinity : duration;
+        return duration >= maxDuration ? Infinity : duration;
     }
 
     /**
@@ -1131,9 +1132,13 @@
                 const exponentialDecay = undampedFreq * dampingRatio;
                 const delta = exponentialDecay * duration;
                 const d = delta * velocity + velocity;
-                const e = Math.pow(dampingRatio, 2) * Math.pow(undampedFreq, 2) * duration;
+                const e = dampingRatio *
+                    dampingRatio *
+                    undampedFreq *
+                    undampedFreq *
+                    duration;
                 const f = Math.exp(-delta);
-                const g = calcAngularFreq(Math.pow(undampedFreq, 2), dampingRatio);
+                const g = calcAngularFreq(undampedFreq * undampedFreq, dampingRatio);
                 const factor = -envelope(undampedFreq) + safeMin > 0 ? -1 : 1;
                 return (factor * ((d - e) * f)) / g;
             };
@@ -1164,7 +1169,7 @@
             };
         }
         else {
-            const stiffness = Math.pow(undampedFreq, 2) * mass;
+            const stiffness = undampedFreq * undampedFreq * mass;
             return {
                 stiffness,
                 damping: dampingRatio * 2 * Math.sqrt(mass * stiffness),
@@ -1244,6 +1249,7 @@
         const dampingRatio = damping / (2 * Math.sqrt(stiffness * mass));
         const initialDelta = target - origin;
         const undampedAngularFreq = millisecondsToSeconds(Math.sqrt(stiffness / mass));
+        const decay = dampingRatio * undampedAngularFreq;
         /**
          * If we're working on a granular scale, use smaller defaults for determining
          * when the spring is finished.
@@ -1260,35 +1266,38 @@
             : springDefaults.restDelta.default);
         let resolveSpring;
         let resolveVelocity;
-        // Underdamped coefficients, hoisted for use in the inlined next() hot path
-        let angularFreq;
-        let A;
-        let sinCoeff;
-        let cosCoeff;
         if (dampingRatio < 1) {
-            angularFreq = calcAngularFreq(undampedAngularFreq, dampingRatio);
-            A =
-                (initialVelocity +
-                    dampingRatio * undampedAngularFreq * initialDelta) /
-                    angularFreq;
+            const angularFreq = calcAngularFreq(undampedAngularFreq, dampingRatio);
+            const A = (initialVelocity + decay * initialDelta) / angularFreq;
+            // Coefficients for the analytical derivative (px/ms)
+            const sinCoeff = decay * A + initialDelta * angularFreq;
+            const cosCoeff = decay * initialDelta - A * angularFreq;
+            /**
+             * The underdamped hot path needs both position and velocity every
+             * frame and they share the same exp/sin/cos terms, so sample both
+             * at once, memoized by t, to only calculate them once per frame.
+             */
+            let sampledT = -1;
+            let position = 0;
+            let velocityAtT = 0;
+            const sample = (t) => {
+                if (t !== sampledT) {
+                    sampledT = t;
+                    const envelope = Math.exp(-decay * t);
+                    const sin = Math.sin(angularFreq * t);
+                    const cos = Math.cos(angularFreq * t);
+                    position = target - envelope * (A * sin + initialDelta * cos);
+                    velocityAtT = envelope * (sinCoeff * sin + cosCoeff * cos);
+                }
+            };
             // Underdamped spring
             resolveSpring = (t) => {
-                const envelope = Math.exp(-dampingRatio * undampedAngularFreq * t);
-                return (target -
-                    envelope *
-                        (A * Math.sin(angularFreq * t) +
-                            initialDelta * Math.cos(angularFreq * t)));
+                sample(t);
+                return position;
             };
-            // Analytical derivative of underdamped spring (px/ms)
-            sinCoeff =
-                dampingRatio * undampedAngularFreq * A + initialDelta * angularFreq;
-            cosCoeff =
-                dampingRatio * undampedAngularFreq * initialDelta - A * angularFreq;
             resolveVelocity = (t) => {
-                const envelope = Math.exp(-dampingRatio * undampedAngularFreq * t);
-                return envelope *
-                    (sinCoeff * Math.sin(angularFreq * t) +
-                        cosCoeff * Math.cos(angularFreq * t));
+                sample(t);
+                return velocityAtT;
             };
         }
         else if (dampingRatio === 1) {
@@ -1306,13 +1315,12 @@
             // Overdamped spring
             const dampedAngularFreq = undampedAngularFreq * Math.sqrt(dampingRatio * dampingRatio - 1);
             resolveSpring = (t) => {
-                const envelope = Math.exp(-dampingRatio * undampedAngularFreq * t);
+                const envelope = Math.exp(-decay * t);
                 // When performing sinh or cosh values can hit Infinity so we cap them here
                 const freqForT = Math.min(dampedAngularFreq * t, 300);
                 return (target -
                     (envelope *
-                        ((initialVelocity +
-                            dampingRatio * undampedAngularFreq * initialDelta) *
+                        ((initialVelocity + decay * initialDelta) *
                             Math.sinh(freqForT) +
                             dampedAngularFreq *
                                 initialDelta *
@@ -1320,43 +1328,21 @@
                         dampedAngularFreq);
             };
             // Analytical derivative of overdamped spring (px/ms)
-            const P = (initialVelocity +
-                dampingRatio * undampedAngularFreq * initialDelta) /
-                dampedAngularFreq;
-            const sinhCoeff = dampingRatio * undampedAngularFreq * P - initialDelta * dampedAngularFreq;
-            const coshCoeff = dampingRatio * undampedAngularFreq * initialDelta - P * dampedAngularFreq;
+            const P = (initialVelocity + decay * initialDelta) / dampedAngularFreq;
+            const sinhCoeff = decay * P - initialDelta * dampedAngularFreq;
+            const coshCoeff = decay * initialDelta - P * dampedAngularFreq;
             resolveVelocity = (t) => {
-                const envelope = Math.exp(-dampingRatio * undampedAngularFreq * t);
+                const envelope = Math.exp(-decay * t);
                 const freqForT = Math.min(dampedAngularFreq * t, 300);
-                return envelope *
+                return (envelope *
                     (sinhCoeff * Math.sinh(freqForT) +
-                        coshCoeff * Math.cosh(freqForT));
+                        coshCoeff * Math.cosh(freqForT)));
             };
         }
         const generator = {
             calculatedDuration: isResolvedFromDuration ? duration || null : null,
             velocity: (t) => secondsToMilliseconds(resolveVelocity(t)),
             next: (t) => {
-                /**
-                 * For underdamped physics springs we need both position and
-                 * velocity each tick. Compute shared trig values once to avoid
-                 * duplicate Math.exp/sin/cos calls on the hot path.
-                 */
-                if (!isResolvedFromDuration && dampingRatio < 1) {
-                    const envelope = Math.exp(-dampingRatio * undampedAngularFreq * t);
-                    const sin = Math.sin(angularFreq * t);
-                    const cos = Math.cos(angularFreq * t);
-                    const current = target -
-                        envelope *
-                            (A * sin + initialDelta * cos);
-                    const currentVelocity = secondsToMilliseconds(envelope *
-                        (sinCoeff * sin + cosCoeff * cos));
-                    state.done =
-                        Math.abs(currentVelocity) <= restSpeed &&
-                            Math.abs(target - current) <= restDelta;
-                    state.value = state.done ? target : current;
-                    return state;
-                }
                 const current = resolveSpring(t);
                 if (!isResolvedFromDuration) {
                     const currentVelocity = secondsToMilliseconds(resolveVelocity(t));
@@ -1387,19 +1373,13 @@
         return options;
     };
 
-    const velocitySampleDuration = 5; // ms
-    function getGeneratorVelocity(resolveValue, t, current) {
-        const prevT = Math.max(t - velocitySampleDuration, 0);
-        return velocityPerSecond(current - resolveValue(prevT), t - prevT);
-    }
-
     function inertia({ keyframes, velocity = 0.0, power = 0.8, timeConstant = 325, bounceDamping = 10, bounceStiffness = 500, modifyTarget, min, max, restDelta = 0.5, restSpeed, }) {
         const origin = keyframes[0];
         const state = {
             done: false,
             value: origin,
         };
-        const isOutOfBounds = (v) => (min !== undefined && v < min) || (max !== undefined && v > max);
+        const isOutOfBounds = (v) => v < min || v > max;
         const nearestBoundary = (v) => {
             if (min === undefined)
                 return max;
@@ -1417,12 +1397,10 @@
         if (target !== ideal)
             amplitude = target - origin;
         const calcDelta = (t) => -amplitude * Math.exp(-t / timeConstant);
-        const calcLatest = (t) => target + calcDelta(t);
         const applyFriction = (t) => {
             const delta = calcDelta(t);
-            const latest = calcLatest(t);
             state.done = Math.abs(delta) <= restDelta;
-            state.value = state.done ? target : latest;
+            state.value = state.done ? target : target + delta;
         };
         /**
          * Ideally this would resolve for t in a stateless way, we could
@@ -1438,7 +1416,12 @@
             timeReachedBoundary = t;
             spring$1 = spring({
                 keyframes: [state.value, nearestBoundary(state.value)],
-                velocity: getGeneratorVelocity(calcLatest, t, state.value), // TODO: This should be passing * 1000
+                /**
+                 * The friction curve is target + calcDelta(t), so its exact
+                 * derivative is -calcDelta(t) / timeConstant in units/ms,
+                 * converted here to the units/second expected by spring.
+                 */
+                velocity: (-calcDelta(t) / timeConstant) * 1000,
                 damping: bounceDamping,
                 stiffness: bounceStiffness,
                 restDelta,
@@ -1607,6 +1590,12 @@
         };
     }
 
+    const velocitySampleDuration = 5; // ms
+    function getGeneratorVelocity(resolveValue, t, current) {
+        const prevT = Math.max(t - velocitySampleDuration, 0);
+        return velocityPerSecond(current - resolveValue(prevT), t - prevT);
+    }
+
     const isNotNull = (value) => value !== null;
     function getFinalKeyframe(keyframes, { repeat, repeatType = "loop" }, finalKeyframe, speed = 1) {
         const resolvedKeyframes = keyframes.filter(isNotNull);
@@ -4612,6 +4601,47 @@
         return true;
     });
 
+    /**
+     * Effects registered via `animate.addEffect()`, most recent first.
+     */
+    const effects = [];
+    function addEffect(effect) {
+        exports.invariant(typeof effect.test === "function" && typeof effect.read === "function", "Effects passed to animate.addEffect() need test() and read().", "effect-missing-test");
+        removeEffect(effect);
+        effects.unshift(effect);
+    }
+    function removeEffect(effect) {
+        removeItem(effects, effect);
+    }
+    function findEffect(subject) {
+        return effects.find((effect) => effect.test(subject));
+    }
+    /**
+     * Animate the keys of `subject` via `effect`. Motion values are created on
+     * first animation, seeded from `effect.read()` or the first keyframe, and
+     * then bound to the subject via the effect for the rest of its life.
+     */
+    function animateEffectSubject(effect, subject, keyframes, transition = {}) {
+        const animations = [];
+        for (const key in keyframes) {
+            const target = keyframes[key];
+            let value = effect.get(subject, key);
+            if (!value) {
+                const initial = effect.read(subject, key, target) ?? firstKeyframe(target);
+                exports.invariant(initial !== undefined, `"${key}" can't be read from the animated subject. Provide [from, to] keyframes.`, "effect-unreadable-value");
+                value = motionValue(initial);
+                effect(subject, { [key]: value });
+            }
+            value.start(animateMotionValue(key, value, target, getValueTransition$1(transition, key)));
+            value.animation && animations.push(value.animation);
+        }
+        return animations;
+    }
+    function firstKeyframe(target) {
+        const first = Array.isArray(target) ? target[0] : undefined;
+        return first === null ? undefined : first;
+    }
+
     function resolveElements(elementOrSelector, scope, selectorCache) {
         if (elementOrSelector == null) {
             return [];
@@ -4656,7 +4686,13 @@
     };
 
     class MotionValueState {
-        constructor() {
+        /**
+         * @param step - The frameloop step renders are scheduled in. Defaults
+         * to `frame.render`. Effects that feed a render loop running in
+         * `frame.render` (GPU scenes) should write in `frame.preRender`.
+         */
+        constructor(step = frame.render) {
+            this.step = step;
             this.latest = {};
             this.values = new Map();
         }
@@ -4673,7 +4709,7 @@
                 else {
                     this.latest[name] = v;
                 }
-                render && frame.render(render);
+                render && this.step(render);
             };
             onChange();
             const cancelOnChange = value.on("change", onChange);
@@ -4692,10 +4728,10 @@
         }
     }
 
-    function createEffect(addValue) {
+    function createEffect(addValue, { step, ...options } = {}) {
         const stateCache = new WeakMap();
-        return (subject, values) => {
-            const state = stateCache.get(subject) ?? new MotionValueState();
+        const effect = (subject, values) => {
+            const state = stateCache.get(subject) ?? new MotionValueState(step);
             stateCache.set(subject, state);
             const subscriptions = [];
             for (const key in values) {
@@ -4708,6 +4744,9 @@
                     cancel();
             };
         };
+        return Object.assign(effect, options, {
+            get: (subject, key) => stateCache.get(subject)?.get(key),
+        });
     }
 
     function canSetAsProperty(element, name) {
@@ -11533,13 +11572,6 @@
             exports.invariant(Boolean(numSubjects), "No valid elements provided.", "no-valid-elements");
             for (let i = 0; i < numSubjects; i++) {
                 const thisSubject = subjects[i];
-                const createVisualElement = thisSubject instanceof Element
-                    ? createDOMVisualElement
-                    : createObjectVisualElement;
-                if (!visualElementStore.has(thisSubject)) {
-                    createVisualElement(thisSubject);
-                }
-                const visualElement = visualElementStore.get(thisSubject);
                 const transition = { ...options };
                 /**
                  * Resolve stagger function if provided.
@@ -11548,6 +11580,23 @@
                     typeof transition.delay === "function") {
                     transition.delay = transition.delay(i, numSubjects);
                 }
+                const isElement = thisSubject instanceof Element;
+                /**
+                 * Registered effects (animate.addEffect) claim non-DOM subjects
+                 * before we fall back to treating them as plain objects.
+                 */
+                const effect = isElement ? undefined : findEffect(thisSubject);
+                if (effect) {
+                    animations.push(...animateEffectSubject(effect, thisSubject, keyframes, transition));
+                    continue;
+                }
+                const createVisualElement = isElement
+                    ? createDOMVisualElement
+                    : createObjectVisualElement;
+                if (!visualElementStore.has(thisSubject)) {
+                    createVisualElement(thisSubject);
+                }
+                const visualElement = visualElementStore.get(thisSubject);
                 animations.push(...animateTarget(visualElement, { ...keyframes, transition }, {}));
             }
         }
@@ -11633,7 +11682,16 @@
         }
         return scopedAnimate;
     }
-    const animate = createScopedAnimate();
+    const animate = Object.assign(createScopedAnimate(), {
+        /**
+         * Register an effect so `animate()` can animate the subjects it
+         * claims, for instance `animate.addEffect(threeEffect)`. The most
+         * recently added effect is tested first. DOM elements are always
+         * animated directly.
+         */
+        addEffect,
+        removeEffect,
+    });
 
     function animateElements(elementOrSelector, keyframes, options, scope) {
         // Gracefully handle null/undefined elements (e.g., from querySelector returning null)
@@ -12408,6 +12466,7 @@
     exports.LayoutAnimationBuilder = LayoutAnimationBuilder;
     exports.MotionGlobalConfig = MotionGlobalConfig;
     exports.MotionValue = MotionValue;
+    exports.MotionValueState = MotionValueState;
     exports.NativeAnimation = NativeAnimation;
     exports.NativeAnimationExtended = NativeAnimationExtended;
     exports.NativeAnimationWrapper = NativeAnimationWrapper;
@@ -12420,6 +12479,7 @@
     exports.acceleratedValues = acceleratedValues;
     exports.addAttrValue = addAttrValue;
     exports.addDomEvent = addDomEvent;
+    exports.addEffect = addEffect;
     exports.addScaleCorrector = addScaleCorrector;
     exports.addStyleValue = addStyleValue;
     exports.addUniqueItem = addUniqueItem;
@@ -12427,6 +12487,7 @@
     exports.alpha = alpha;
     exports.analyseComplexValue = analyseComplexValue;
     exports.animate = animate;
+    exports.animateEffectSubject = animateEffectSubject;
     exports.animateMini = animateMini;
     exports.animateMotionValue = animateMotionValue;
     exports.animateSingleValue = animateSingleValue;
@@ -12499,6 +12560,7 @@
     exports.createAxisDelta = createAxisDelta;
     exports.createBox = createBox;
     exports.createDelta = createDelta;
+    exports.createEffect = createEffect;
     exports.createGeneratorEasing = createGeneratorEasing;
     exports.createProjectionNode = createProjectionNode;
     exports.createRenderBatcher = createRenderBatcher;
@@ -12523,6 +12585,7 @@
     exports.fillOffset = fillOffset;
     exports.fillWildcards = fillWildcards;
     exports.findDimensionValueType = findDimensionValueType;
+    exports.findEffect = findEffect;
     exports.findValueType = findValueType;
     exports.flushKeyframeResolvers = flushKeyframeResolvers;
     exports.followValue = followValue;
@@ -12641,6 +12704,7 @@
     exports.removeAxisDelta = removeAxisDelta;
     exports.removeAxisTransforms = removeAxisTransforms;
     exports.removeBoxTransforms = removeBoxTransforms;
+    exports.removeEffect = removeEffect;
     exports.removeItem = removeItem;
     exports.removePointDelta = removePointDelta;
     exports.renderHTML = renderHTML;