framer-motion 6.3.3 → 6.3.6

package/dist/cjs/index.js

@@ -3884,8 +3884,9 @@ exports.AnimationType = void 0;
 })(exports.AnimationType || (exports.AnimationType = {}));
 
 function addDomEvent(target, eventName, handler, options) {
+    if (options === void 0) { options = { passive: true }; }
     target.addEventListener(eventName, handler, options);
-    return function () { return target.removeEventListener(eventName, handler, options); };
+    return function () { return target.removeEventListener(eventName, handler); };
 }
 /**
  * Attaches an event listener directly to the provided DOM element.
@@ -4112,10 +4113,10 @@ function useHoverGesture(_a) {
     var onHoverStart = _a.onHoverStart, onHoverEnd = _a.onHoverEnd, whileHover = _a.whileHover, visualElement = _a.visualElement;
     usePointerEvent(visualElement, "pointerenter", onHoverStart || whileHover
         ? createHoverEvent(visualElement, true, onHoverStart)
-        : undefined);
+        : undefined, { passive: !onHoverStart });
     usePointerEvent(visualElement, "pointerleave", onHoverEnd || whileHover
         ? createHoverEvent(visualElement, false, onHoverEnd)
-        : undefined);
+        : undefined, { passive: !onHoverEnd });
 }
 
 /**
@@ -4150,6 +4151,12 @@ function useTapGesture(_a) {
     var hasPressListeners = onTap || onTapStart || onTapCancel || whileTap;
     var isPressing = React.useRef(false);
     var cancelPointerEndListeners = React.useRef(null);
+    /**
+     * Only set listener to passive if there are no external listeners.
+     */
+    var eventOptions = {
+        passive: !(onTapStart || onTap || onTapCancel || onPointerDown),
+    };
     function removePointerEndListener() {
         var _a;
         (_a = cancelPointerEndListeners.current) === null || _a === void 0 ? void 0 : _a.call(cancelPointerEndListeners);
@@ -4184,14 +4191,14 @@ function useTapGesture(_a) {
         if (isPressing.current)
             return;
         isPressing.current = true;
-        cancelPointerEndListeners.current = popmotion.pipe(addPointerEvent(window, "pointerup", onPointerUp), addPointerEvent(window, "pointercancel", onPointerCancel));
+        cancelPointerEndListeners.current = popmotion.pipe(addPointerEvent(window, "pointerup", onPointerUp, eventOptions), addPointerEvent(window, "pointercancel", onPointerCancel, eventOptions));
         /**
          * Ensure we trigger animations before firing event callback
          */
         (_a = visualElement.animationState) === null || _a === void 0 ? void 0 : _a.setActive(exports.AnimationType.Tap, true);
         onTapStart === null || onTapStart === void 0 ? void 0 : onTapStart(event, info);
     }
-    usePointerEvent(visualElement, "pointerdown", hasPressListeners ? onPointerDown : undefined);
+    usePointerEvent(visualElement, "pointerdown", hasPressListeners ? onPointerDown : undefined, eventOptions);
     useUnmountEffect(removePointerEndListener);
 }
 
@@ -5783,7 +5790,7 @@ var VisualElementDragControls = /** @class */ (function () {
          * constraints as the window resizes.
          */
         var stopResizeListener = addDomEvent(window, "resize", function () {
-            _this.scalePositionWithinConstraints();
+            return _this.scalePositionWithinConstraints();
         });
         /**
          * If the element's layout changes, calculate the delta and apply that to
@@ -7056,10 +7063,7 @@ var layoutFeatures = {
 };
 
 var DocumentProjectionNode = createProjectionNode({
-    attachResizeListener: function (ref, notify) {
-        ref.addEventListener("resize", notify, { passive: true });
-        return function () { return ref.removeEventListener("resize", notify); };
-    },
+    attachResizeListener: function (ref, notify) { return addDomEvent(ref, "resize", notify); },
     measureScroll: function () { return ({
         x: document.documentElement.scrollLeft || document.body.scrollLeft,
         y: document.documentElement.scrollTop || document.body.scrollTop,
@@ -7203,15 +7207,9 @@ function newChildrenMap() {
 }
 
 var getChildKey = function (child) { return child.key || ""; };
-var isDev = process$1.env.NODE_ENV !== "production";
 function updateChildLookup(children, allChildren) {
-    var seenChildren = isDev ? new Set() : null;
     children.forEach(function (child) {
         var key = getChildKey(child);
-        if (isDev && seenChildren && seenChildren.has(key)) {
-            console.warn("Children of AnimatePresence require unique keys. \"".concat(key, "\" is a duplicate."));
-            seenChildren.add(key);
-        }
         allChildren.set(key, child);
     });
 }
@@ -7454,7 +7452,7 @@ function MotionConfig(_a) {
      * Creating a new config context object will re-render every `motion` component
      * every time it renders. So we only want to create a new one sparingly.
      */
-    var context = React.useMemo(function () { return config; }, [JSON.stringify(config.transition), config.transformPagePoint]);
+    var context = React.useMemo(function () { return config; }, [JSON.stringify(config.transition), config.transformPagePoint, config.reducedMotion]);
     return (React__namespace.createElement(MotionConfigContext.Provider, { value: context }, children));
 }
 
@@ -7921,7 +7919,7 @@ function useElementScroll(ref) {
         if (!element)
             return;
         var updateScrollValues = createScrollUpdater(values, getElementScrollOffsets(element));
-        var scrollListener = addDomEvent(element, "scroll", updateScrollValues, { passive: true });
+        var scrollListener = addDomEvent(element, "scroll", updateScrollValues);
         var resizeListener = addDomEvent(element, "resize", updateScrollValues);
         return function () {
             scrollListener && scrollListener();
@@ -7944,7 +7942,7 @@ var hasListeners = false;
 function addEventListeners() {
     hasListeners = true;
     var updateScrollValues = createScrollUpdater(viewportScrollValues, getViewportScrollOffsets);
-    addDomEvent(window, "scroll", updateScrollValues, { passive: true });
+    addDomEvent(window, "scroll", updateScrollValues);
     addDomEvent(window, "resize", updateScrollValues);
 }
 /**

package/dist/es/components/AnimatePresence/index.mjs

@@ -10,15 +10,9 @@ import { useIsomorphicLayoutEffect } from '../../utils/use-isomorphic-effect.mjs
 import { useUnmountEffect } from '../../utils/use-unmount-effect.mjs';
 
 var getChildKey = function (child) { return child.key || ""; };
-var isDev = process.env.NODE_ENV !== "production";
 function updateChildLookup(children, allChildren) {
-    var seenChildren = isDev ? new Set() : null;
     children.forEach(function (child) {
         var key = getChildKey(child);
-        if (isDev && seenChildren && seenChildren.has(key)) {
-            console.warn("Children of AnimatePresence require unique keys. \"".concat(key, "\" is a duplicate."));
-            seenChildren.add(key);
-        }
         allChildren.set(key, child);
     });
 }

package/dist/es/components/MotionConfig/index.mjs

@@ -38,7 +38,7 @@ function MotionConfig(_a) {
      * Creating a new config context object will re-render every `motion` component
      * every time it renders. So we only want to create a new one sparingly.
      */
-    var context = useMemo(function () { return config; }, [JSON.stringify(config.transition), config.transformPagePoint]);
+    var context = useMemo(function () { return config; }, [JSON.stringify(config.transition), config.transformPagePoint, config.reducedMotion]);
     return (React.createElement(MotionConfigContext.Provider, { value: context }, children));
 }
 

package/dist/es/events/use-dom-event.mjs

@@ -1,8 +1,9 @@
 import { useEffect } from 'react';
 
 function addDomEvent(target, eventName, handler, options) {
+    if (options === void 0) { options = { passive: true }; }
     target.addEventListener(eventName, handler, options);
-    return function () { return target.removeEventListener(eventName, handler, options); };
+    return function () { return target.removeEventListener(eventName, handler); };
 }
 /**
  * Attaches an event listener directly to the provided DOM element.

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

@@ -388,7 +388,7 @@ var VisualElementDragControls = /** @class */ (function () {
          * constraints as the window resizes.
          */
         var stopResizeListener = addDomEvent(window, "resize", function () {
-            _this.scalePositionWithinConstraints();
+            return _this.scalePositionWithinConstraints();
         });
         /**
          * If the element's layout changes, calculate the delta and apply that to

package/dist/es/gestures/use-hover-gesture.mjs

@@ -19,10 +19,10 @@ function useHoverGesture(_a) {
     var onHoverStart = _a.onHoverStart, onHoverEnd = _a.onHoverEnd, whileHover = _a.whileHover, visualElement = _a.visualElement;
     usePointerEvent(visualElement, "pointerenter", onHoverStart || whileHover
         ? createHoverEvent(visualElement, true, onHoverStart)
-        : undefined);
+        : undefined, { passive: !onHoverStart });
     usePointerEvent(visualElement, "pointerleave", onHoverEnd || whileHover
         ? createHoverEvent(visualElement, false, onHoverEnd)
-        : undefined);
+        : undefined, { passive: !onHoverEnd });
 }
 
 export { useHoverGesture };

package/dist/es/gestures/use-tap-gesture.mjs

@@ -15,6 +15,12 @@ function useTapGesture(_a) {
     var hasPressListeners = onTap || onTapStart || onTapCancel || whileTap;
     var isPressing = useRef(false);
     var cancelPointerEndListeners = useRef(null);
+    /**
+     * Only set listener to passive if there are no external listeners.
+     */
+    var eventOptions = {
+        passive: !(onTapStart || onTap || onTapCancel || onPointerDown),
+    };
     function removePointerEndListener() {
         var _a;
         (_a = cancelPointerEndListeners.current) === null || _a === void 0 ? void 0 : _a.call(cancelPointerEndListeners);
@@ -49,14 +55,14 @@ function useTapGesture(_a) {
         if (isPressing.current)
             return;
         isPressing.current = true;
-        cancelPointerEndListeners.current = pipe(addPointerEvent(window, "pointerup", onPointerUp), addPointerEvent(window, "pointercancel", onPointerCancel));
+        cancelPointerEndListeners.current = pipe(addPointerEvent(window, "pointerup", onPointerUp, eventOptions), addPointerEvent(window, "pointercancel", onPointerCancel, eventOptions));
         /**
          * Ensure we trigger animations before firing event callback
          */
         (_a = visualElement.animationState) === null || _a === void 0 ? void 0 : _a.setActive(AnimationType.Tap, true);
         onTapStart === null || onTapStart === void 0 ? void 0 : onTapStart(event, info);
     }
-    usePointerEvent(visualElement, "pointerdown", hasPressListeners ? onPointerDown : undefined);
+    usePointerEvent(visualElement, "pointerdown", hasPressListeners ? onPointerDown : undefined, eventOptions);
     useUnmountEffect(removePointerEndListener);
 }
 

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

@@ -1,10 +1,8 @@
 import { createProjectionNode } from './create-projection-node.mjs';
+import { addDomEvent } from '../../events/use-dom-event.mjs';
 
 var DocumentProjectionNode = createProjectionNode({
-    attachResizeListener: function (ref, notify) {
-        ref.addEventListener("resize", notify, { passive: true });
-        return function () { return ref.removeEventListener("resize", notify); };
-    },
+    attachResizeListener: function (ref, notify) { return addDomEvent(ref, "resize", notify); },
     measureScroll: function () { return ({
         x: document.documentElement.scrollLeft || document.body.scrollLeft,
         y: document.documentElement.scrollTop || document.body.scrollTop,

package/dist/es/value/scroll/use-element-scroll.mjs

@@ -45,7 +45,7 @@ function useElementScroll(ref) {
         if (!element)
             return;
         var updateScrollValues = createScrollUpdater(values, getElementScrollOffsets(element));
-        var scrollListener = addDomEvent(element, "scroll", updateScrollValues, { passive: true });
+        var scrollListener = addDomEvent(element, "scroll", updateScrollValues);
         var resizeListener = addDomEvent(element, "resize", updateScrollValues);
         return function () {
             scrollListener && scrollListener();

package/dist/es/value/scroll/use-viewport-scroll.mjs

@@ -15,7 +15,7 @@ var hasListeners = false;
 function addEventListeners() {
     hasListeners = true;
     var updateScrollValues = createScrollUpdater(viewportScrollValues, getViewportScrollOffsets);
-    addDomEvent(window, "scroll", updateScrollValues, { passive: true });
+    addDomEvent(window, "scroll", updateScrollValues);
     addDomEvent(window, "resize", updateScrollValues);
 }
 /**

package/dist/framer-motion.dev.js

@@ -5109,8 +5109,9 @@
     })(exports.AnimationType || (exports.AnimationType = {}));
 
     function addDomEvent(target, eventName, handler, options) {
+        if (options === void 0) { options = { passive: true }; }
         target.addEventListener(eventName, handler, options);
-        return function () { return target.removeEventListener(eventName, handler, options); };
+        return function () { return target.removeEventListener(eventName, handler); };
     }
     /**
      * Attaches an event listener directly to the provided DOM element.
@@ -5337,10 +5338,10 @@
         var onHoverStart = _a.onHoverStart, onHoverEnd = _a.onHoverEnd, whileHover = _a.whileHover, visualElement = _a.visualElement;
         usePointerEvent(visualElement, "pointerenter", onHoverStart || whileHover
             ? createHoverEvent(visualElement, true, onHoverStart)
-            : undefined);
+            : undefined, { passive: !onHoverStart });
         usePointerEvent(visualElement, "pointerleave", onHoverEnd || whileHover
             ? createHoverEvent(visualElement, false, onHoverEnd)
-            : undefined);
+            : undefined, { passive: !onHoverEnd });
     }
 
     /**
@@ -5375,6 +5376,12 @@
         var hasPressListeners = onTap || onTapStart || onTapCancel || whileTap;
         var isPressing = React.useRef(false);
         var cancelPointerEndListeners = React.useRef(null);
+        /**
+         * Only set listener to passive if there are no external listeners.
+         */
+        var eventOptions = {
+            passive: !(onTapStart || onTap || onTapCancel || onPointerDown),
+        };
         function removePointerEndListener() {
             var _a;
             (_a = cancelPointerEndListeners.current) === null || _a === void 0 ? void 0 : _a.call(cancelPointerEndListeners);
@@ -5409,14 +5416,14 @@
             if (isPressing.current)
                 return;
             isPressing.current = true;
-            cancelPointerEndListeners.current = pipe(addPointerEvent(window, "pointerup", onPointerUp), addPointerEvent(window, "pointercancel", onPointerCancel));
+            cancelPointerEndListeners.current = pipe(addPointerEvent(window, "pointerup", onPointerUp, eventOptions), addPointerEvent(window, "pointercancel", onPointerCancel, eventOptions));
             /**
              * Ensure we trigger animations before firing event callback
              */
             (_a = visualElement.animationState) === null || _a === void 0 ? void 0 : _a.setActive(exports.AnimationType.Tap, true);
             onTapStart === null || onTapStart === void 0 ? void 0 : onTapStart(event, info);
         }
-        usePointerEvent(visualElement, "pointerdown", hasPressListeners ? onPointerDown : undefined);
+        usePointerEvent(visualElement, "pointerdown", hasPressListeners ? onPointerDown : undefined, eventOptions);
         useUnmountEffect(removePointerEndListener);
     }
 
@@ -7008,7 +7015,7 @@
              * constraints as the window resizes.
              */
             var stopResizeListener = addDomEvent(window, "resize", function () {
-                _this.scalePositionWithinConstraints();
+                return _this.scalePositionWithinConstraints();
             });
             /**
              * If the element's layout changes, calculate the delta and apply that to
@@ -8281,10 +8288,7 @@
     };
 
     var DocumentProjectionNode = createProjectionNode({
-        attachResizeListener: function (ref, notify) {
-            ref.addEventListener("resize", notify, { passive: true });
-            return function () { return ref.removeEventListener("resize", notify); };
-        },
+        attachResizeListener: function (ref, notify) { return addDomEvent(ref, "resize", notify); },
         measureScroll: function () { return ({
             x: document.documentElement.scrollLeft || document.body.scrollLeft,
             y: document.documentElement.scrollTop || document.body.scrollTop,
@@ -8429,13 +8433,8 @@
 
     var getChildKey = function (child) { return child.key || ""; };
     function updateChildLookup(children, allChildren) {
-        var seenChildren = new Set() ;
         children.forEach(function (child) {
             var key = getChildKey(child);
-            if (seenChildren && seenChildren.has(key)) {
-                console.warn("Children of AnimatePresence require unique keys. \"".concat(key, "\" is a duplicate."));
-                seenChildren.add(key);
-            }
             allChildren.set(key, child);
         });
     }
@@ -8677,7 +8676,7 @@
          * Creating a new config context object will re-render every `motion` component
          * every time it renders. So we only want to create a new one sparingly.
          */
-        var context = React.useMemo(function () { return config; }, [JSON.stringify(config.transition), config.transformPagePoint]);
+        var context = React.useMemo(function () { return config; }, [JSON.stringify(config.transition), config.transformPagePoint, config.reducedMotion]);
         return (React__namespace.createElement(MotionConfigContext.Provider, { value: context }, children));
     }
 
@@ -9144,7 +9143,7 @@
             if (!element)
                 return;
             var updateScrollValues = createScrollUpdater(values, getElementScrollOffsets(element));
-            var scrollListener = addDomEvent(element, "scroll", updateScrollValues, { passive: true });
+            var scrollListener = addDomEvent(element, "scroll", updateScrollValues);
             var resizeListener = addDomEvent(element, "resize", updateScrollValues);
             return function () {
                 scrollListener && scrollListener();
@@ -9167,7 +9166,7 @@
     function addEventListeners() {
         hasListeners = true;
         var updateScrollValues = createScrollUpdater(viewportScrollValues, getViewportScrollOffsets);
-        addDomEvent(window, "scroll", updateScrollValues, { passive: true });
+        addDomEvent(window, "scroll", updateScrollValues);
         addDomEvent(window, "resize", updateScrollValues);
     }
     /**