framer-motion 12.24.8 → 12.24.10

package/dist/cjs/client.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var featureBundle = require('./feature-bundle-C6mMBZjn.js');
+var featureBundle = require('./feature-bundle-OJqyiRBo.js');
 require('react');
 require('motion-dom');
 require('motion-utils');

package/dist/cjs/{feature-bundle-C6mMBZjn.js → feature-bundle-OJqyiRBo.js}

@@ -4105,69 +4105,51 @@ const useSVGVisualState = /*@__PURE__*/ makeUseVisualState({
 
 const motionComponentSymbol = Symbol.for("motionComponentSymbol");
 
-function isRefObject(ref) {
-    return (ref &&
-        typeof ref === "object" &&
-        Object.prototype.hasOwnProperty.call(ref, "current"));
-}
-
-/**
- * Set a given ref to a given value
- * This utility takes care of different types of refs: callback refs and RefObject(s)
- * Returns a cleanup function if the ref callback returns one (React 19 feature)
- */
-function setRef(ref, value) {
-    if (typeof ref === "function") {
-        return ref(value);
-    }
-    else if (isRefObject(ref)) {
-        ref.current = value;
-    }
-}
 /**
  * Creates a ref function that, when called, hydrates the provided
  * external ref and VisualElement.
  */
 function useMotionRef(visualState, visualElement, externalRef) {
-    // Store the cleanup function from external ref if it returns one
-    const externalRefCleanupRef = React.useRef(null);
+    /**
+     * Store externalRef in a ref to avoid including it in the useCallback
+     * dependency array. Including externalRef in dependencies causes issues
+     * with libraries like Radix UI that create new callback refs on each render
+     * when using asChild - this would cause the callback to be recreated,
+     * triggering element remounts and breaking AnimatePresence exit animations.
+     */
+    const externalRefContainer = React.useRef(externalRef);
+    React.useInsertionEffect(() => {
+        externalRefContainer.current = externalRef;
+    });
+    // Store cleanup function returned by callback refs (React 19 feature)
+    const refCleanup = React.useRef(null);
     return React.useCallback((instance) => {
         if (instance) {
-            visualState.onMount && visualState.onMount(instance);
+            visualState.onMount?.(instance);
         }
         if (visualElement) {
-            if (instance) {
-                visualElement.mount(instance);
-            }
-            else {
-                visualElement.unmount();
-            }
+            instance ? visualElement.mount(instance) : visualElement.unmount();
         }
-        if (externalRef) {
+        const ref = externalRefContainer.current;
+        if (typeof ref === "function") {
             if (instance) {
-                // Mount: call the external ref and store any cleanup function
-                const cleanup = setRef(externalRef, instance);
+                const cleanup = ref(instance);
                 if (typeof cleanup === "function") {
-                    externalRefCleanupRef.current = cleanup;
+                    refCleanup.current = cleanup;
                 }
             }
+            else if (refCleanup.current) {
+                refCleanup.current();
+                refCleanup.current = null;
+            }
             else {
-                // Unmount: call stored cleanup function if available, otherwise call ref with null
-                if (externalRefCleanupRef.current) {
-                    externalRefCleanupRef.current();
-                    externalRefCleanupRef.current = null;
-                }
-                else {
-                    // Fallback to React <19 behavior for refs that don't return cleanup
-                    setRef(externalRef, instance);
-                }
+                ref(instance);
             }
         }
-    }, 
-    /**
-     * Include all dependencies to ensure the callback updates correctly
-     */
-    [visualElement, visualState, externalRef]);
+        else if (ref) {
+            ref.current = instance;
+        }
+    }, [visualElement]);
 }
 
 /**
@@ -4175,6 +4157,12 @@ function useMotionRef(visualState, visualElement, externalRef) {
  */
 const SwitchLayoutGroupContext = React.createContext({});
 
+function isRefObject(ref) {
+    return (ref &&
+        typeof ref === "object" &&
+        Object.prototype.hasOwnProperty.call(ref, "current"));
+}
+
 function useVisualElement(Component, visualState, props, createVisualElement, ProjectionNodeConstructor, isSVG) {
     const { visualElement: parent } = React.useContext(MotionContext);
     const lazyContext = React.useContext(LazyContext);
@@ -5172,8 +5160,11 @@ class PanSession {
         this.handlePointerUp = (event, info) => {
             this.end();
             const { onEnd, onSessionEnd, resumeAnimation } = this.handlers;
-            if (this.dragSnapToOrigin)
+            // Resume animation if dragSnapToOrigin is set OR if no drag started (user just clicked)
+            // This ensures constraint animations continue when interrupted by a click
+            if (this.dragSnapToOrigin || !this.startEvent) {
                 resumeAnimation && resumeAnimation();
+            }
             if (!(this.lastMoveEvent && this.lastMoveEventInfo))
                 return;
             const panInfo = getPanInfo(event.type === "pointercancel"
@@ -5422,15 +5413,21 @@ class VisualElementDragControls {
         if (presenceContext && presenceContext.isPresent === false)
             return;
         const onSessionStart = (event) => {
-            const { dragSnapToOrigin } = this.getProps();
-            // Stop or pause any animations on both axis values immediately. This allows the user to throw and catch
-            // the component.
-            dragSnapToOrigin ? this.pauseAnimation() : this.stopAnimation();
+            // Stop or pause animations based on context:
+            // - snapToCursor: stop because we'll set new position values
+            // - otherwise: pause to allow resume if no drag starts (for constraint animations)
             if (snapToCursor) {
+                this.stopAnimation();
                 this.snapToCursor(extractEventInfo(event).point);
             }
+            else {
+                this.pauseAnimation();
+            }
         };
         const onStart = (event, info) => {
+            // Stop any paused animation so motion values reflect true current position
+            // (pauseAnimation was called in onSessionStart to allow resume if no drag started)
+            this.stopAnimation();
             // Attempt to grab the global drag gesture lock - maybe make this part of PanSession
             const { drag, dragPropagation, onDragStart } = this.getProps();
             if (drag && !dragPropagation) {
@@ -5796,7 +5793,11 @@ class VisualElementDragControls {
          */
         const stopPointerListener = addPointerEvent(element, "pointerdown", (event) => {
             const { drag, dragListener = true } = this.getProps();
-            drag && dragListener && this.start(event);
+            if (drag &&
+                dragListener &&
+                !motionDom.isElementKeyboardAccessible(event.target)) {
+                this.start(event);
+            }
         });
         const measureDragConstraints = () => {
             const { dragConstraints } = this.getProps();
@@ -6359,4 +6360,4 @@ exports.useIsPresent = useIsPresent;
 exports.useIsomorphicLayoutEffect = useIsomorphicLayoutEffect;
 exports.usePresence = usePresence;
 exports.visualElementStore = visualElementStore;
-//# sourceMappingURL=feature-bundle-C6mMBZjn.js.map
+//# sourceMappingURL=feature-bundle-OJqyiRBo.js.map