framer-motion 10.2.4 → 10.2.5

package/dist/index.d.ts

@@ -1403,6 +1403,7 @@ interface IProjectionNode<I = unknown> {
     isProjectionDirty: boolean;
     isSharedProjectionDirty: boolean;
     isTransformDirty: boolean;
+    resolvedRelativeTargetAt?: number;
     shouldResetTransform: boolean;
     prevTransformTemplateValue: string | undefined;
     isUpdateBlocked(): boolean;
@@ -1438,7 +1439,7 @@ interface IProjectionNode<I = unknown> {
     resetTransform(): void;
     resetRotation(): void;
     applyTransform(box: Box, transformOnly?: boolean): Box;
-    resolveTargetDelta(): void;
+    resolveTargetDelta(force?: boolean): void;
     calcProjection(): void;
     getProjectionStyles(styles?: MotionStyle): MotionStyle | undefined;
     clearMeasurements(): void;

package/dist/projection.dev.js

@@ -1973,7 +1973,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 = "10.2.4";
+            this.version = "10.2.5";
             /**
              * Duration, in milliseconds, since last updating frame.
              *
@@ -3549,10 +3549,7 @@
                 this.target = undefined;
                 this.isLayoutDirty = false;
             }
-            /**
-             * Frame calculations
-             */
-            resolveTargetDelta() {
+            resolveTargetDelta(forceRecalculation = false) {
                 var _a;
                 /**
                  * Once the dirty status of nodes has been spread through the tree, we also
@@ -3568,7 +3565,8 @@
                  * We don't use transform for this step of processing so we don't
                  * need to check whether any nodes have changed transform.
                  */
-                const canSkip = !((isShared && this.isSharedProjectionDirty) ||
+                const canSkip = !(forceRecalculation ||
+                    (isShared && this.isSharedProjectionDirty) ||
                     this.isProjectionDirty ||
                     ((_a = this.parent) === null || _a === void 0 ? void 0 : _a.isProjectionDirty) ||
                     this.attemptToResolveRelativeTarget);
@@ -3580,6 +3578,7 @@
                  */
                 if (!this.layout || !(layout || layoutId))
                     return;
+                this.resolvedRelativeTargetAt = frameData.timestamp;
                 /**
                  * If we don't have a targetDelta but do have a layout, we can attempt to resolve
                  * a relativeParent. This will allow a component to perform scale correction
@@ -3620,6 +3619,16 @@
                     this.relativeTargetOrigin &&
                     this.relativeParent &&
                     this.relativeParent.target) {
+                    /**
+                     * If the parent target isn't up-to-date, force it to update.
+                     * This is an unfortunate de-optimisation as it means any updating relative
+                     * projection will cause all the relative parents to recalculate back
+                     * up the tree.
+                     */
+                    if (this.relativeParent.resolvedRelativeTargetAt !==
+                        frameData.timestamp) {
+                        this.relativeParent.resolveTargetDelta(true);
+                    }
                     calcRelativeBox(this.target, this.relativeTarget, this.relativeParent.target);
                     /**
                      * If we've only got a targetDelta, resolve it into a target
@@ -3706,6 +3715,13 @@
                     (this.isSharedProjectionDirty || this.isTransformDirty)) {
                     canSkip = false;
                 }
+                /**
+                 * If we have resolved the target this frame we must recalculate the
+                 * projection to ensure it visually represents the internal calculations.
+                 */
+                if (this.resolvedRelativeTargetAt === frameData.timestamp) {
+                    canSkip = false;
+                }
                 if (canSkip)
                     return;
                 const { layout, layoutId } = this.options;
@@ -5203,7 +5219,7 @@
                  * and warn against mismatches.
                  */
                 {
-                    warnOnce(nextValue.version === "10.2.4", `Attempting to mix Framer Motion versions ${nextValue.version} with 10.2.4 may not work as expected.`);
+                    warnOnce(nextValue.version === "10.2.5", `Attempting to mix Framer Motion versions ${nextValue.version} with 10.2.5 may not work as expected.`);
                 }
             }
             else if (isMotionValue(prevValue)) {
@@ -5845,6 +5861,7 @@
     exports.calcBoxDelta = calcBoxDelta;
     exports.correctBorderRadius = correctBorderRadius;
     exports.correctBoxShadow = correctBoxShadow;
+    exports.frameData = frameData;
     exports.mix = mix;
     exports.nodeGroup = nodeGroup;
     exports.sync = sync;

package/dist/three-entry.d.ts

@@ -1299,6 +1299,7 @@ interface IProjectionNode<I = unknown> {
     isProjectionDirty: boolean;
     isSharedProjectionDirty: boolean;
     isTransformDirty: boolean;
+    resolvedRelativeTargetAt?: number;
     shouldResetTransform: boolean;
     prevTransformTemplateValue: string | undefined;
     isUpdateBlocked(): boolean;
@@ -1334,7 +1335,7 @@ interface IProjectionNode<I = unknown> {
     resetTransform(): void;
     resetRotation(): void;
     applyTransform(box: Box, transformOnly?: boolean): Box;
-    resolveTargetDelta(): void;
+    resolveTargetDelta(force?: boolean): void;
     calcProjection(): void;
     getProjectionStyles(styles?: MotionStyle): MotionStyle | undefined;
     clearMeasurements(): void;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "framer-motion",
-    "version": "10.2.4",
+    "version": "10.2.5",
     "description": "A simple and powerful React and JavaScript animation library",
     "main": "dist/cjs/index.js",
     "module": "dist/es/index.mjs",
@@ -85,7 +85,7 @@
     "bundlesize": [
         {
             "path": "./dist/size-rollup-motion.js",
-            "maxSize": "29.85 kB"
+            "maxSize": "29.89 kB"
         },
         {
             "path": "./dist/size-rollup-m.js",
@@ -93,11 +93,11 @@
         },
         {
             "path": "./dist/size-rollup-dom-animation.js",
-            "maxSize": "14.56 kB"
+            "maxSize": "14.64 kB"
         },
         {
             "path": "./dist/size-rollup-dom-max.js",
-            "maxSize": "25.6 kB"
+            "maxSize": "25.64 kB"
         },
         {
             "path": "./dist/size-rollup-animate.js",
@@ -113,8 +113,8 @@
         },
         {
             "path": "./dist/size-webpack-dom-max.js",
-            "maxSize": "30.42 kB"
+            "maxSize": "30.46 kB"
         }
     ],
-    "gitHead": "82eb0ba26cd103d524a27dc95415e437cce35822"
+    "gitHead": "08a892929cc60026ae1e97d382dee6f0d8f3893d"
 }