framer-motion 7.7.1 → 7.7.2

package/dist/cjs/index.js

@@ -2102,11 +2102,11 @@ const color = {
 const colorToken = "${c}";
 const numberToken = "${n}";
 function test(v) {
-    var _a, _b, _c, _d;
+    var _a, _b;
     return (isNaN(v) &&
         isString(v) &&
-        ((_b = (_a = v.match(floatRegex)) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0) +
-            ((_d = (_c = v.match(colorRegex)) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0) >
+        (((_a = v.match(floatRegex)) === null || _a === void 0 ? void 0 : _a.length) || 0) +
+            (((_b = v.match(colorRegex)) === null || _b === void 0 ? void 0 : _b.length) || 0) >
             0);
 }
 function analyseComplexValue(v) {
@@ -3083,8 +3083,10 @@ function animate$1({ from, autoplay = true, driver = framesync, elapsed = 0, rep
         }
         onUpdate === null || onUpdate === void 0 ? void 0 : onUpdate(latest);
         if (isComplete) {
-            if (repeatCount === 0)
-                computedDuration !== null && computedDuration !== void 0 ? computedDuration : (computedDuration = elapsed);
+            if (repeatCount === 0) {
+                computedDuration =
+                    computedDuration !== undefined ? computedDuration : elapsed;
+            }
             if (repeatCount < repeatMax) {
                 hasRepeatDelayElapsed(elapsed, computedDuration, repeatDelay, isForwardPlayback) && repeat();
             }
@@ -3245,9 +3247,12 @@ function convertTransitionToAnimationOptions({ ease, times, ...transition }) {
  * Get the delay for a value by checking Transition with decreasing specificity.
  */
 function getDelayFromTransition(transition, key) {
-    var _a, _b;
     const valueTransition = getValueTransition(transition, key) || {};
-    return (_b = (_a = valueTransition.delay) !== null && _a !== void 0 ? _a : transition.delay) !== null && _b !== void 0 ? _b : 0;
+    return valueTransition.delay !== undefined
+        ? valueTransition.delay
+        : transition.delay !== undefined
+            ? transition.delay
+            : 0;
 }
 function hydrateKeyframes(options) {
     if (Array.isArray(options.to) && options.to[0] === null) {
@@ -3466,7 +3471,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 = "7.7.1";
+        this.version = "7.7.2";
         /**
          * Duration, in milliseconds, since last updating frame.
          *
@@ -4090,7 +4095,6 @@ function createAnimationState(visualElement) {
      *    what to animate those to.
      */
     function animateChanges(options, changedActiveType) {
-        var _a;
         const props = visualElement.getProps();
         const context = visualElement.getVariantContext(true) || {};
         /**
@@ -4123,7 +4127,7 @@ function createAnimationState(visualElement) {
         for (let i = 0; i < numAnimationTypes; i++) {
             const type = reversePriorityOrder[i];
             const typeState = state[type];
-            const prop = (_a = props[type]) !== null && _a !== void 0 ? _a : context[type];
+            const prop = props[type] !== undefined ? props[type] : context[type];
             const propIsVariant = isVariantLabel(prop);
             /**
              * If this type has *just* changed isActive status, set activeDelta
@@ -4695,10 +4699,9 @@ function resolveAxisElastic(dragElastic, minLabel, maxLabel) {
     };
 }
 function resolvePointElastic(dragElastic, label) {
-    var _a;
     return typeof dragElastic === "number"
         ? dragElastic
-        : (_a = dragElastic[label]) !== null && _a !== void 0 ? _a : 0;
+        : dragElastic[label] || 0;
 }
 
 const createAxisDelta = () => ({
@@ -5120,11 +5123,10 @@ class VisualElementDragControls {
         const { drag, dragMomentum, dragElastic, dragTransition, dragSnapToOrigin, onDragTransitionEnd, } = this.getProps();
         const constraints = this.constraints || {};
         const momentumAnimations = eachAxis((axis) => {
-            var _a;
             if (!shouldDrag(axis, drag, this.currentDirection)) {
                 return;
             }
-            let transition = (_a = constraints === null || constraints === void 0 ? void 0 : constraints[axis]) !== null && _a !== void 0 ? _a : {};
+            let transition = (constraints === null || constraints === void 0 ? void 0 : constraints[axis]) || {};
             if (dragSnapToOrigin)
                 transition = { min: 0, max: 0 };
             /**
@@ -5168,12 +5170,12 @@ class VisualElementDragControls {
      * - Otherwise, we apply the delta to the x/y motion values.
      */
     getAxisMotionValue(axis) {
-        var _a, _b;
+        var _a;
         const dragKey = "_drag" + axis.toUpperCase();
         const externalMotionValue = this.visualElement.getProps()[dragKey];
         return externalMotionValue
             ? externalMotionValue
-            : this.visualElement.getValue(axis, (_b = (_a = this.visualElement.getProps().initial) === null || _a === void 0 ? void 0 : _a[axis]) !== null && _b !== void 0 ? _b : 0);
+            : this.visualElement.getValue(axis, ((_a = this.visualElement.getProps().initial) === null || _a === void 0 ? void 0 : _a[axis]) || 0);
     }
     snapToCursor(point) {
         eachAxis((axis) => {
@@ -5751,7 +5753,7 @@ function updateMotionValuesFromProps(element, next, prev) {
              * and warn against mismatches.
              */
             if (process.env.NODE_ENV === "development") {
-                warnOnce(nextValue.version === "7.7.1", `Attempting to mix Framer Motion versions ${nextValue.version} with 7.7.1 may not work as expected.`);
+                warnOnce(nextValue.version === "7.7.2", `Attempting to mix Framer Motion versions ${nextValue.version} with 7.7.2 may not work as expected.`);
             }
         }
         else if (isMotionValue(prevValue)) {
@@ -6610,16 +6612,14 @@ const numBorders = borders.length;
 const asNumber = (value) => typeof value === "string" ? parseFloat(value) : value;
 const isPx = (value) => typeof value === "number" || px.test(value);
 function mixValues(target, follow, lead, progress, shouldCrossfadeOpacity, isOnlyMember) {
-    var _a, _b, _c, _d;
     if (shouldCrossfadeOpacity) {
         target.opacity = mix(0, 
-        // (follow?.opacity as number) ?? 0,
         // TODO Reinstate this if only child
-        (_a = lead.opacity) !== null && _a !== void 0 ? _a : 1, easeCrossfadeIn(progress));
-        target.opacityExit = mix((_b = follow.opacity) !== null && _b !== void 0 ? _b : 1, 0, easeCrossfadeOut(progress));
+        lead.opacity !== undefined ? lead.opacity : 1, easeCrossfadeIn(progress));
+        target.opacityExit = mix(follow.opacity !== undefined ? follow.opacity : 1, 0, easeCrossfadeOut(progress));
     }
     else if (isOnlyMember) {
-        target.opacity = mix((_c = follow.opacity) !== null && _c !== void 0 ? _c : 1, (_d = lead.opacity) !== null && _d !== void 0 ? _d : 1, progress);
+        target.opacity = mix(follow.opacity !== undefined ? follow.opacity : 1, lead.opacity !== undefined ? lead.opacity : 1, progress);
     }
     /**
      * Mix border radius
@@ -6653,8 +6653,9 @@ function mixValues(target, follow, lead, progress, shouldCrossfadeOpacity, isOnl
     }
 }
 function getRadius(values, radiusName) {
-    var _a;
-    return (_a = values[radiusName]) !== null && _a !== void 0 ? _a : values.borderRadius;
+    return values[radiusName] !== undefined
+        ? values[radiusName]
+        : values.borderRadius;
 }
 // /**
 //  * We only want to mix the background color if there's a follow element

package/dist/es/animation/legacy-popmotion/index.mjs

@@ -74,8 +74,10 @@ function animate({ from, autoplay = true, driver = framesync, elapsed = 0, repea
         }
         onUpdate === null || onUpdate === void 0 ? void 0 : onUpdate(latest);
         if (isComplete) {
-            if (repeatCount === 0)
-                computedDuration !== null && computedDuration !== void 0 ? computedDuration : (computedDuration = elapsed);
+            if (repeatCount === 0) {
+                computedDuration =
+                    computedDuration !== undefined ? computedDuration : elapsed;
+            }
             if (repeatCount < repeatMax) {
                 hasRepeatDelayElapsed(elapsed, computedDuration, repeatDelay, isForwardPlayback) && repeat();
             }

package/dist/es/animation/utils/transitions.mjs

@@ -58,9 +58,12 @@ function convertTransitionToAnimationOptions({ ease, times, ...transition }) {
  * Get the delay for a value by checking Transition with decreasing specificity.
  */
 function getDelayFromTransition(transition, key) {
-    var _a, _b;
     const valueTransition = getValueTransition(transition, key) || {};
-    return (_b = (_a = valueTransition.delay) !== null && _a !== void 0 ? _a : transition.delay) !== null && _b !== void 0 ? _b : 0;
+    return valueTransition.delay !== undefined
+        ? valueTransition.delay
+        : transition.delay !== undefined
+            ? transition.delay
+            : 0;
 }
 function hydrateKeyframes(options) {
     if (Array.isArray(options.to) && options.to[0] === null) {

package/dist/es/gestures/drag/VisualElementDragControls.mjs

@@ -236,11 +236,10 @@ class VisualElementDragControls {
         const { drag, dragMomentum, dragElastic, dragTransition, dragSnapToOrigin, onDragTransitionEnd, } = this.getProps();
         const constraints = this.constraints || {};
         const momentumAnimations = eachAxis((axis) => {
-            var _a;
             if (!shouldDrag(axis, drag, this.currentDirection)) {
                 return;
             }
-            let transition = (_a = constraints === null || constraints === void 0 ? void 0 : constraints[axis]) !== null && _a !== void 0 ? _a : {};
+            let transition = (constraints === null || constraints === void 0 ? void 0 : constraints[axis]) || {};
             if (dragSnapToOrigin)
                 transition = { min: 0, max: 0 };
             /**
@@ -284,12 +283,12 @@ class VisualElementDragControls {
      * - Otherwise, we apply the delta to the x/y motion values.
      */
     getAxisMotionValue(axis) {
-        var _a, _b;
+        var _a;
         const dragKey = "_drag" + axis.toUpperCase();
         const externalMotionValue = this.visualElement.getProps()[dragKey];
         return externalMotionValue
             ? externalMotionValue
-            : this.visualElement.getValue(axis, (_b = (_a = this.visualElement.getProps().initial) === null || _a === void 0 ? void 0 : _a[axis]) !== null && _b !== void 0 ? _b : 0);
+            : this.visualElement.getValue(axis, ((_a = this.visualElement.getProps().initial) === null || _a === void 0 ? void 0 : _a[axis]) || 0);
     }
     snapToCursor(point) {
         eachAxis((axis) => {

package/dist/es/gestures/drag/utils/constraints.mjs

@@ -117,10 +117,9 @@ function resolveAxisElastic(dragElastic, minLabel, maxLabel) {
     };
 }
 function resolvePointElastic(dragElastic, label) {
-    var _a;
     return typeof dragElastic === "number"
         ? dragElastic
-        : (_a = dragElastic[label]) !== null && _a !== void 0 ? _a : 0;
+        : dragElastic[label] || 0;
 }
 
 export { applyConstraints, calcOrigin, calcRelativeAxisConstraints, calcRelativeConstraints, calcViewportAxisConstraints, calcViewportConstraints, defaultElastic, rebaseAxisConstraints, resolveAxisElastic, resolveDragElastic, resolvePointElastic };

package/dist/es/projection/animation/mix-values.mjs

@@ -9,16 +9,14 @@ const numBorders = borders.length;
 const asNumber = (value) => typeof value === "string" ? parseFloat(value) : value;
 const isPx = (value) => typeof value === "number" || px.test(value);
 function mixValues(target, follow, lead, progress, shouldCrossfadeOpacity, isOnlyMember) {
-    var _a, _b, _c, _d;
     if (shouldCrossfadeOpacity) {
         target.opacity = mix(0, 
-        // (follow?.opacity as number) ?? 0,
         // TODO Reinstate this if only child
-        (_a = lead.opacity) !== null && _a !== void 0 ? _a : 1, easeCrossfadeIn(progress));
-        target.opacityExit = mix((_b = follow.opacity) !== null && _b !== void 0 ? _b : 1, 0, easeCrossfadeOut(progress));
+        lead.opacity !== undefined ? lead.opacity : 1, easeCrossfadeIn(progress));
+        target.opacityExit = mix(follow.opacity !== undefined ? follow.opacity : 1, 0, easeCrossfadeOut(progress));
     }
     else if (isOnlyMember) {
-        target.opacity = mix((_c = follow.opacity) !== null && _c !== void 0 ? _c : 1, (_d = lead.opacity) !== null && _d !== void 0 ? _d : 1, progress);
+        target.opacity = mix(follow.opacity !== undefined ? follow.opacity : 1, lead.opacity !== undefined ? lead.opacity : 1, progress);
     }
     /**
      * Mix border radius
@@ -52,8 +50,9 @@ function mixValues(target, follow, lead, progress, shouldCrossfadeOpacity, isOnl
     }
 }
 function getRadius(values, radiusName) {
-    var _a;
-    return (_a = values[radiusName]) !== null && _a !== void 0 ? _a : values.borderRadius;
+    return values[radiusName] !== undefined
+        ? values[radiusName]
+        : values.borderRadius;
 }
 // /**
 //  * We only want to mix the background color if there's a follow element

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

@@ -54,7 +54,6 @@ function createAnimationState(visualElement) {
      *    what to animate those to.
      */
     function animateChanges(options, changedActiveType) {
-        var _a;
         const props = visualElement.getProps();
         const context = visualElement.getVariantContext(true) || {};
         /**
@@ -87,7 +86,7 @@ function createAnimationState(visualElement) {
         for (let i = 0; i < numAnimationTypes; i++) {
             const type = reversePriorityOrder[i];
             const typeState = state[type];
-            const prop = (_a = props[type]) !== null && _a !== void 0 ? _a : context[type];
+            const prop = props[type] !== undefined ? props[type] : context[type];
             const propIsVariant = isVariantLabel(prop);
             /**
              * If this type has *just* changed isActive status, set activeDelta

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 === "7.7.1", `Attempting to mix Framer Motion versions ${nextValue.version} with 7.7.1 may not work as expected.`);
+                warnOnce(nextValue.version === "7.7.2", `Attempting to mix Framer Motion versions ${nextValue.version} with 7.7.2 may not work as expected.`);
             }
         }
         else if (isMotionValue(prevValue)) {

package/dist/es/value/index.mjs

@@ -25,7 +25,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 = "7.7.1";
+        this.version = "7.7.2";
         /**
          * Duration, in milliseconds, since last updating frame.
          *

package/dist/es/value/types/complex/index.mjs

@@ -5,11 +5,11 @@ import { isString, floatRegex, colorRegex, sanitize } from '../utils.mjs';
 const colorToken = "${c}";
 const numberToken = "${n}";
 function test(v) {
-    var _a, _b, _c, _d;
+    var _a, _b;
     return (isNaN(v) &&
         isString(v) &&
-        ((_b = (_a = v.match(floatRegex)) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0) +
-            ((_d = (_c = v.match(colorRegex)) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0) >
+        (((_a = v.match(floatRegex)) === null || _a === void 0 ? void 0 : _a.length) || 0) +
+            (((_b = v.match(colorRegex)) === null || _b === void 0 ? void 0 : _b.length) || 0) >
             0);
 }
 function analyseComplexValue(v) {

package/dist/framer-motion.dev.js

@@ -2115,11 +2115,11 @@
     const colorToken = "${c}";
     const numberToken = "${n}";
     function test(v) {
-        var _a, _b, _c, _d;
+        var _a, _b;
         return (isNaN(v) &&
             isString$1(v) &&
-            ((_b = (_a = v.match(floatRegex)) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0) +
-                ((_d = (_c = v.match(colorRegex)) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0) >
+            (((_a = v.match(floatRegex)) === null || _a === void 0 ? void 0 : _a.length) || 0) +
+                (((_b = v.match(colorRegex)) === null || _b === void 0 ? void 0 : _b.length) || 0) >
                 0);
     }
     function analyseComplexValue(v) {
@@ -3096,8 +3096,10 @@
             }
             onUpdate === null || onUpdate === void 0 ? void 0 : onUpdate(latest);
             if (isComplete) {
-                if (repeatCount === 0)
-                    computedDuration !== null && computedDuration !== void 0 ? computedDuration : (computedDuration = elapsed);
+                if (repeatCount === 0) {
+                    computedDuration =
+                        computedDuration !== undefined ? computedDuration : elapsed;
+                }
                 if (repeatCount < repeatMax) {
                     hasRepeatDelayElapsed(elapsed, computedDuration, repeatDelay, isForwardPlayback) && repeat();
                 }
@@ -3258,9 +3260,12 @@
      * Get the delay for a value by checking Transition with decreasing specificity.
      */
     function getDelayFromTransition(transition, key) {
-        var _a, _b;
         const valueTransition = getValueTransition(transition, key) || {};
-        return (_b = (_a = valueTransition.delay) !== null && _a !== void 0 ? _a : transition.delay) !== null && _b !== void 0 ? _b : 0;
+        return valueTransition.delay !== undefined
+            ? valueTransition.delay
+            : transition.delay !== undefined
+                ? transition.delay
+                : 0;
     }
     function hydrateKeyframes(options) {
         if (Array.isArray(options.to) && options.to[0] === null) {
@@ -3479,7 +3484,7 @@
              * 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 = "7.7.1";
+            this.version = "7.7.2";
             /**
              * Duration, in milliseconds, since last updating frame.
              *
@@ -4103,7 +4108,6 @@
          *    what to animate those to.
          */
         function animateChanges(options, changedActiveType) {
-            var _a;
             const props = visualElement.getProps();
             const context = visualElement.getVariantContext(true) || {};
             /**
@@ -4136,7 +4140,7 @@
             for (let i = 0; i < numAnimationTypes; i++) {
                 const type = reversePriorityOrder[i];
                 const typeState = state[type];
-                const prop = (_a = props[type]) !== null && _a !== void 0 ? _a : context[type];
+                const prop = props[type] !== undefined ? props[type] : context[type];
                 const propIsVariant = isVariantLabel(prop);
                 /**
                  * If this type has *just* changed isActive status, set activeDelta
@@ -4708,10 +4712,9 @@
         };
     }
     function resolvePointElastic(dragElastic, label) {
-        var _a;
         return typeof dragElastic === "number"
             ? dragElastic
-            : (_a = dragElastic[label]) !== null && _a !== void 0 ? _a : 0;
+            : dragElastic[label] || 0;
     }
 
     const createAxisDelta = () => ({
@@ -5133,11 +5136,10 @@
             const { drag, dragMomentum, dragElastic, dragTransition, dragSnapToOrigin, onDragTransitionEnd, } = this.getProps();
             const constraints = this.constraints || {};
             const momentumAnimations = eachAxis((axis) => {
-                var _a;
                 if (!shouldDrag(axis, drag, this.currentDirection)) {
                     return;
                 }
-                let transition = (_a = constraints === null || constraints === void 0 ? void 0 : constraints[axis]) !== null && _a !== void 0 ? _a : {};
+                let transition = (constraints === null || constraints === void 0 ? void 0 : constraints[axis]) || {};
                 if (dragSnapToOrigin)
                     transition = { min: 0, max: 0 };
                 /**
@@ -5181,12 +5183,12 @@
          * - Otherwise, we apply the delta to the x/y motion values.
          */
         getAxisMotionValue(axis) {
-            var _a, _b;
+            var _a;
             const dragKey = "_drag" + axis.toUpperCase();
             const externalMotionValue = this.visualElement.getProps()[dragKey];
             return externalMotionValue
                 ? externalMotionValue
-                : this.visualElement.getValue(axis, (_b = (_a = this.visualElement.getProps().initial) === null || _a === void 0 ? void 0 : _a[axis]) !== null && _b !== void 0 ? _b : 0);
+                : this.visualElement.getValue(axis, ((_a = this.visualElement.getProps().initial) === null || _a === void 0 ? void 0 : _a[axis]) || 0);
         }
         snapToCursor(point) {
             eachAxis((axis) => {
@@ -5764,7 +5766,7 @@
                  * and warn against mismatches.
                  */
                 {
-                    warnOnce(nextValue.version === "7.7.1", `Attempting to mix Framer Motion versions ${nextValue.version} with 7.7.1 may not work as expected.`);
+                    warnOnce(nextValue.version === "7.7.2", `Attempting to mix Framer Motion versions ${nextValue.version} with 7.7.2 may not work as expected.`);
                 }
             }
             else if (isMotionValue(prevValue)) {
@@ -6623,16 +6625,14 @@
     const asNumber = (value) => typeof value === "string" ? parseFloat(value) : value;
     const isPx = (value) => typeof value === "number" || px.test(value);
     function mixValues(target, follow, lead, progress, shouldCrossfadeOpacity, isOnlyMember) {
-        var _a, _b, _c, _d;
         if (shouldCrossfadeOpacity) {
             target.opacity = mix$1(0, 
-            // (follow?.opacity as number) ?? 0,
             // TODO Reinstate this if only child
-            (_a = lead.opacity) !== null && _a !== void 0 ? _a : 1, easeCrossfadeIn(progress));
-            target.opacityExit = mix$1((_b = follow.opacity) !== null && _b !== void 0 ? _b : 1, 0, easeCrossfadeOut(progress));
+            lead.opacity !== undefined ? lead.opacity : 1, easeCrossfadeIn(progress));
+            target.opacityExit = mix$1(follow.opacity !== undefined ? follow.opacity : 1, 0, easeCrossfadeOut(progress));
         }
         else if (isOnlyMember) {
-            target.opacity = mix$1((_c = follow.opacity) !== null && _c !== void 0 ? _c : 1, (_d = lead.opacity) !== null && _d !== void 0 ? _d : 1, progress);
+            target.opacity = mix$1(follow.opacity !== undefined ? follow.opacity : 1, lead.opacity !== undefined ? lead.opacity : 1, progress);
         }
         /**
          * Mix border radius
@@ -6666,8 +6666,9 @@
         }
     }
     function getRadius(values, radiusName) {
-        var _a;
-        return (_a = values[radiusName]) !== null && _a !== void 0 ? _a : values.borderRadius;
+        return values[radiusName] !== undefined
+            ? values[radiusName]
+            : values.borderRadius;
     }
     // /**
     //  * We only want to mix the background color if there's a follow element