framer-motion 6.3.13 → 6.3.16

package/dist/cjs/index.js

@@ -472,7 +472,7 @@ var MotionValue = /** @class */ (function () {
          * 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 = "6.3.13";
+        this.version = "6.3.16";
         /**
          * Duration, in milliseconds, since last updating frame.
          *
@@ -1830,7 +1830,7 @@ var globalProjectionState = {
     hasEverUpdated: false,
 };
 function createProjectionNode(_a) {
-    var attachResizeListener = _a.attachResizeListener, defaultParent = _a.defaultParent, measureScroll = _a.measureScroll, resetTransform = _a.resetTransform;
+    var attachResizeListener = _a.attachResizeListener, defaultParent = _a.defaultParent, measureScroll = _a.measureScroll, checkIsScrollRoot = _a.checkIsScrollRoot, resetTransform = _a.resetTransform;
     return /** @class */ (function () {
         function ProjectionNode(id, latestValues, parent) {
             var _this = this;
@@ -2233,6 +2233,7 @@ function createProjectionNode(_a) {
         };
         ProjectionNode.prototype.updateScroll = function () {
             if (this.options.layoutScroll && this.instance) {
+                this.isScrollRoot = checkIsScrollRoot(this.instance);
                 this.scroll = measureScroll(this.instance);
             }
         };
@@ -2276,8 +2277,24 @@ function createProjectionNode(_a) {
              */
             for (var i = 0; i < this.path.length; i++) {
                 var node = this.path[i];
-                var scroll_1 = node.scroll, options = node.options;
+                var scroll_1 = node.scroll, options = node.options, isScrollRoot = node.isScrollRoot;
                 if (node !== this.root && scroll_1 && options.layoutScroll) {
+                    /**
+                     * If this is a new scroll root, we want to remove all previous scrolls
+                     * from the viewport box.
+                     */
+                    if (isScrollRoot) {
+                        copyBoxInto(boxWithoutScroll, box);
+                        var rootScroll = this.root.scroll;
+                        /**
+                         * Undo the application of page scroll that was originally added
+                         * to the measured bounding box.
+                         */
+                        if (rootScroll) {
+                            translateAxis(boxWithoutScroll.x, -rootScroll.x);
+                            translateAxis(boxWithoutScroll.y, -rootScroll.y);
+                        }
+                    }
                     translateAxis(boxWithoutScroll.x, scroll_1.x);
                     translateAxis(boxWithoutScroll.y, scroll_1.y);
                 }
@@ -3002,7 +3019,7 @@ function useProjectionId() {
 var LayoutGroupContext = React.createContext({});
 
 /**
- * @internal
+ * Internal, exported only for usage in Framer
  */
 var SwitchLayoutGroupContext = React.createContext({});
 
@@ -5966,7 +5983,7 @@ function updateMotionValuesFromProps(element, next, prev) {
              * and warn against mismatches.
              */
             if (process.env.NODE_ENV === "development") {
-                warnOnce(nextValue.version === "6.3.13", "Attempting to mix Framer Motion versions ".concat(nextValue.version, " with 6.3.13 may not work as expected."));
+                warnOnce(nextValue.version === "6.3.16", "Attempting to mix Framer Motion versions ".concat(nextValue.version, " with 6.3.16 may not work as expected."));
             }
         }
         else if (isMotionValue(prevValue)) {
@@ -7080,6 +7097,7 @@ var DocumentProjectionNode = createProjectionNode({
         x: document.documentElement.scrollLeft || document.body.scrollLeft,
         y: document.documentElement.scrollTop || document.body.scrollTop,
     }); },
+    checkIsScrollRoot: function () { return true; },
 });
 
 var rootProjectionNode = {
@@ -7102,6 +7120,9 @@ var HTMLProjectionNode = createProjectionNode({
     resetTransform: function (instance, value) {
         instance.style.transform = value !== null && value !== void 0 ? value : "none";
     },
+    checkIsScrollRoot: function (instance) {
+        return Boolean(window.getComputedStyle(instance).position === "fixed");
+    },
 });
 
 var featureBundle = tslib.__assign(tslib.__assign(tslib.__assign(tslib.__assign({}, animations), gestureAnimations), drag), layoutFeatures);

package/dist/es/context/SwitchLayoutGroupContext.mjs

@@ -1,7 +1,7 @@
 import { createContext } from 'react';
 
 /**
- * @internal
+ * Internal, exported only for usage in Framer
  */
 var SwitchLayoutGroupContext = createContext({});
 

package/dist/es/projection/node/DocumentProjectionNode.mjs

@@ -7,6 +7,7 @@ var DocumentProjectionNode = createProjectionNode({
         x: document.documentElement.scrollLeft || document.body.scrollLeft,
         y: document.documentElement.scrollTop || document.body.scrollTop,
     }); },
+    checkIsScrollRoot: function () { return true; },
 });
 
 export { DocumentProjectionNode };

package/dist/es/projection/node/HTMLProjectionNode.mjs

@@ -21,6 +21,9 @@ var HTMLProjectionNode = createProjectionNode({
     resetTransform: function (instance, value) {
         instance.style.transform = value !== null && value !== void 0 ? value : "none";
     },
+    checkIsScrollRoot: function (instance) {
+        return Boolean(window.getComputedStyle(instance).position === "fixed");
+    },
 });
 
 export { HTMLProjectionNode, rootProjectionNode };

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

@@ -43,7 +43,7 @@ var globalProjectionState = {
     hasEverUpdated: false,
 };
 function createProjectionNode(_a) {
-    var attachResizeListener = _a.attachResizeListener, defaultParent = _a.defaultParent, measureScroll = _a.measureScroll, resetTransform = _a.resetTransform;
+    var attachResizeListener = _a.attachResizeListener, defaultParent = _a.defaultParent, measureScroll = _a.measureScroll, checkIsScrollRoot = _a.checkIsScrollRoot, resetTransform = _a.resetTransform;
     return /** @class */ (function () {
         function ProjectionNode(id, latestValues, parent) {
             var _this = this;
@@ -446,6 +446,7 @@ function createProjectionNode(_a) {
         };
         ProjectionNode.prototype.updateScroll = function () {
             if (this.options.layoutScroll && this.instance) {
+                this.isScrollRoot = checkIsScrollRoot(this.instance);
                 this.scroll = measureScroll(this.instance);
             }
         };
@@ -489,8 +490,24 @@ function createProjectionNode(_a) {
              */
             for (var i = 0; i < this.path.length; i++) {
                 var node = this.path[i];
-                var scroll_1 = node.scroll, options = node.options;
+                var scroll_1 = node.scroll, options = node.options, isScrollRoot = node.isScrollRoot;
                 if (node !== this.root && scroll_1 && options.layoutScroll) {
+                    /**
+                     * If this is a new scroll root, we want to remove all previous scrolls
+                     * from the viewport box.
+                     */
+                    if (isScrollRoot) {
+                        copyBoxInto(boxWithoutScroll, box);
+                        var rootScroll = this.root.scroll;
+                        /**
+                         * Undo the application of page scroll that was originally added
+                         * to the measured bounding box.
+                         */
+                        if (rootScroll) {
+                            translateAxis(boxWithoutScroll.x, -rootScroll.x);
+                            translateAxis(boxWithoutScroll.y, -rootScroll.y);
+                        }
+                    }
                     translateAxis(boxWithoutScroll.x, scroll_1.x);
                     translateAxis(boxWithoutScroll.y, scroll_1.y);
                 }

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

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

package/dist/es/value/index.mjs

@@ -25,7 +25,7 @@ var MotionValue = /** @class */ (function () {
          * 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 = "6.3.13";
+        this.version = "6.3.16";
         /**
          * Duration, in milliseconds, since last updating frame.
          *

package/dist/framer-motion.dev.js

@@ -1706,7 +1706,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 = "6.3.13";
+            this.version = "6.3.16";
             /**
              * Duration, in milliseconds, since last updating frame.
              *
@@ -3064,7 +3064,7 @@
         hasEverUpdated: false,
     };
     function createProjectionNode(_a) {
-        var attachResizeListener = _a.attachResizeListener, defaultParent = _a.defaultParent, measureScroll = _a.measureScroll, resetTransform = _a.resetTransform;
+        var attachResizeListener = _a.attachResizeListener, defaultParent = _a.defaultParent, measureScroll = _a.measureScroll, checkIsScrollRoot = _a.checkIsScrollRoot, resetTransform = _a.resetTransform;
         return /** @class */ (function () {
             function ProjectionNode(id, latestValues, parent) {
                 var _this = this;
@@ -3467,6 +3467,7 @@
             };
             ProjectionNode.prototype.updateScroll = function () {
                 if (this.options.layoutScroll && this.instance) {
+                    this.isScrollRoot = checkIsScrollRoot(this.instance);
                     this.scroll = measureScroll(this.instance);
                 }
             };
@@ -3510,8 +3511,24 @@
                  */
                 for (var i = 0; i < this.path.length; i++) {
                     var node = this.path[i];
-                    var scroll_1 = node.scroll, options = node.options;
+                    var scroll_1 = node.scroll, options = node.options, isScrollRoot = node.isScrollRoot;
                     if (node !== this.root && scroll_1 && options.layoutScroll) {
+                        /**
+                         * If this is a new scroll root, we want to remove all previous scrolls
+                         * from the viewport box.
+                         */
+                        if (isScrollRoot) {
+                            copyBoxInto(boxWithoutScroll, box);
+                            var rootScroll = this.root.scroll;
+                            /**
+                             * Undo the application of page scroll that was originally added
+                             * to the measured bounding box.
+                             */
+                            if (rootScroll) {
+                                translateAxis(boxWithoutScroll.x, -rootScroll.x);
+                                translateAxis(boxWithoutScroll.y, -rootScroll.y);
+                            }
+                        }
                         translateAxis(boxWithoutScroll.x, scroll_1.x);
                         translateAxis(boxWithoutScroll.y, scroll_1.y);
                     }
@@ -4236,7 +4253,7 @@
     var LayoutGroupContext = React.createContext({});
 
     /**
-     * @internal
+     * Internal, exported only for usage in Framer
      */
     var SwitchLayoutGroupContext = React.createContext({});
 
@@ -7200,7 +7217,7 @@
                  * and warn against mismatches.
                  */
                 {
-                    warnOnce(nextValue.version === "6.3.13", "Attempting to mix Framer Motion versions ".concat(nextValue.version, " with 6.3.13 may not work as expected."));
+                    warnOnce(nextValue.version === "6.3.16", "Attempting to mix Framer Motion versions ".concat(nextValue.version, " with 6.3.16 may not work as expected."));
                 }
             }
             else if (isMotionValue(prevValue)) {
@@ -8314,6 +8331,7 @@
             x: document.documentElement.scrollLeft || document.body.scrollLeft,
             y: document.documentElement.scrollTop || document.body.scrollTop,
         }); },
+        checkIsScrollRoot: function () { return true; },
     });
 
     var rootProjectionNode = {
@@ -8336,6 +8354,9 @@
         resetTransform: function (instance, value) {
             instance.style.transform = value !== null && value !== void 0 ? value : "none";
         },
+        checkIsScrollRoot: function (instance) {
+            return Boolean(window.getComputedStyle(instance).position === "fixed");
+        },
     });
 
     var featureBundle = __assign(__assign(__assign(__assign({}, animations), gestureAnimations), drag), layoutFeatures);