framer-motion 10.3.4 → 10.4.0

package/dist/es/projection/node/create-projection-node.mjs

@@ -1,5 +1,4 @@
 import { cancelSync, flushSync, sync } from '../../frameloop/index.mjs';
-import { animate } from '../../animation/animate.mjs';
 import { SubscriptionManager } from '../../utils/subscription-manager.mjs';
 import { mixValues } from '../animation/mix-values.mjs';
 import { copyBoxInto } from '../geometry/copy.mjs';
@@ -20,6 +19,8 @@ import { globalProjectionState } from './state.mjs';
 import { delay } from '../../utils/delay.mjs';
 import { mix } from '../../utils/mix.mjs';
 import { record } from '../../debug/record.mjs';
+import { isSVGElement } from '../../render/dom/utils/is-svg-element.mjs';
+import { animateSingleValue } from '../../animation/interfaces/single-value.mjs';
 import { frameData } from '../../frameloop/data.mjs';
 
 const transformAxes = ["", "X", "Y", "Z"];
@@ -198,8 +199,7 @@ function createProjectionNode({ attachResizeListener, defaultParent, measureScro
         mount(instance, isLayoutDirty = false) {
             if (this.instance)
                 return;
-            this.isSVG =
-                instance instanceof SVGElement && instance.tagName !== "svg";
+            this.isSVG = isSVGElement(instance);
             this.instance = instance;
             const { layoutId, layout, visualElement } = this.options;
             if (visualElement && !visualElement.current) {
@@ -954,8 +954,9 @@ function createProjectionNode({ attachResizeListener, defaultParent, measureScro
              */
             this.pendingAnimation = sync.update(() => {
                 globalProjectionState.hasAnimatedSinceResize = true;
-                this.currentAnimation = animate(0, animationTarget, {
+                this.currentAnimation = animateSingleValue(0, animationTarget, {
                     ...options,
+                    // keyframes: [0, animationTarget],÷
                     onUpdate: (latest) => {
                         this.mixTargetDelta(latest);
                         options.onUpdate && options.onUpdate(latest);

package/dist/es/render/VisualElement.mjs

@@ -16,6 +16,7 @@ import { resolveVariantFromProps } from './utils/resolve-variants.mjs';
 import { warnOnce } from '../utils/warn-once.mjs';
 import { featureDefinitions } from '../motion/features/definitions.mjs';
 import { variantProps } from './utils/variant-props.mjs';
+import { visualElementStore } from './store.mjs';
 
 const featureNames = Object.keys(featureDefinitions);
 const numFeatures = featureNames.length;
@@ -146,6 +147,7 @@ class VisualElement {
     }
     mount(instance) {
         this.current = instance;
+        visualElementStore.set(instance, this);
         if (this.projection) {
             this.projection.mount(instance);
         }
@@ -170,6 +172,7 @@ class VisualElement {
         this.update(this.props, this.presenceContext);
     }
     unmount() {
+        visualElementStore.delete(this.current);
         this.projection && this.projection.unmount();
         cancelSync.update(this.notifyUpdate);
         cancelSync.render(this.render);

package/dist/es/render/dom/utils/is-svg-element.mjs

@@ -0,0 +1,5 @@
+function isSVGElement(element) {
+    return element instanceof SVGElement && element.tagName !== "svg";
+}
+
+export { isSVGElement };

package/dist/es/render/store.mjs

@@ -0,0 +1,3 @@
+const visualElementStore = new WeakMap();
+
+export { visualElementStore };

package/dist/es/render/utils/animation-state.mjs

@@ -1,10 +1,10 @@
 import { isAnimationControls } from '../../animation/utils/is-animation-controls.mjs';
 import { isKeyframesTarget } from '../../animation/utils/is-keyframes-target.mjs';
 import { shallowCompare } from '../../utils/shallow-compare.mjs';
-import { animateVisualElement } from './animation.mjs';
 import { isVariantLabel } from './is-variant-label.mjs';
 import { resolveVariant } from './resolve-dynamic-variants.mjs';
 import { variantPriorityOrder } from './variant-props.mjs';
+import { animateVisualElement } from '../../animation/interfaces/visual-element.mjs';
 
 const reversePriorityOrder = [...variantPriorityOrder].reverse();
 const numAnimationTypes = variantPriorityOrder.length;

package/dist/es/render/utils/motion-values.mjs

@@ -22,7 +22,7 @@ function updateMotionValuesFromProps(element, next, prev) {
              * and warn against mismatches.
              */
             if (process.env.NODE_ENV === "development") {
-                warnOnce(nextValue.version === "10.3.4", `Attempting to mix Framer Motion versions ${nextValue.version} with 10.3.4 may not work as expected.`);
+                warnOnce(nextValue.version === "10.4.0", `Attempting to mix Framer Motion versions ${nextValue.version} with 10.4.0 may not work as expected.`);
             }
         }
         else if (isMotionValue(prevValue)) {

package/dist/es/utils/interpolate.mjs

@@ -65,6 +65,12 @@ function interpolate(input, output, { clamp: isClamp = true, ease, mixer } = {})
     const inputLength = input.length;
     invariant(inputLength === output.length, "Both input and output ranges must be the same length");
     invariant(!ease || !Array.isArray(ease) || ease.length === inputLength - 1, "Array of easing functions must be of length `input.length - 1`, as it applies to the transitions **between** the defined values.");
+    /**
+     * If we're only provided a single input, we can just make a function
+     * that returns the output.
+     */
+    if (inputLength === 1)
+        return () => output[0];
     // If input runs highest -> lowest, reverse both arrays
     if (input[0] > input[inputLength - 1]) {
         input = [...input].reverse();

package/dist/es/value/index.mjs

@@ -26,7 +26,7 @@ class MotionValue {
          * This will be replaced by the build step with the latest version number.
          * When MotionValues are provided to motion components, warn if versions are mixed.
          */
-        this.version = "10.3.4";
+        this.version = "10.4.0";
         /**
          * Duration, in milliseconds, since last updating frame.
          *

package/dist/es/value/use-spring.mjs

@@ -3,7 +3,7 @@ import { isMotionValue } from './utils/is-motion-value.mjs';
 import { useMotionValue } from './use-motion-value.mjs';
 import { MotionConfigContext } from '../context/MotionConfigContext.mjs';
 import { useIsomorphicLayoutEffect } from '../utils/use-isomorphic-effect.mjs';
-import { animateValue } from '../animation/js/index.mjs';
+import { animateValue } from '../animation/animators/js/index.mjs';
 
 /**
  * Creates a `MotionValue` that, when `set`, will use a spring animation to animate to its new state.