framer-motion 12.23.18 → 12.23.19

package/dist/cjs/client.js

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

package/dist/cjs/{feature-bundle-pqhrS3ID.js → feature-bundle-DzuUB-G1.js}

@@ -5,25 +5,6 @@ var motionDom = require('motion-dom');
 var motionUtils = require('motion-utils');
 var jsxRuntime = require('react/jsx-runtime');
 
-function _interopNamespaceDefault(e) {
-    var n = Object.create(null);
-    if (e) {
-        Object.keys(e).forEach(function (k) {
-            if (k !== 'default') {
-                var d = Object.getOwnPropertyDescriptor(e, k);
-                Object.defineProperty(n, k, d.get ? d : {
-                    enumerable: true,
-                    get: function () { return e[k]; }
-                });
-            }
-        });
-    }
-    n.default = e;
-    return Object.freeze(n);
-}
-
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
-
 const LayoutGroupContext = React.createContext({});
 
 /**
@@ -4088,22 +4069,16 @@ function isRefObject(ref) {
  * external ref and VisualElement.
  */
 function useMotionRef(visualState, visualElement, externalRef) {
-    const currentInstanceRef = React__namespace.useRef(null);
     return React.useCallback((instance) => {
-        const prevInstance = currentInstanceRef.current;
-        currentInstanceRef.current = instance;
-        // Only run mount/unmount logic when the instance actually changes
-        if (instance !== prevInstance) {
+        if (instance) {
+            visualState.onMount && visualState.onMount(instance);
+        }
+        if (visualElement) {
             if (instance) {
-                visualState.onMount && visualState.onMount(instance);
+                visualElement.mount(instance);
             }
-            if (visualElement) {
-                if (instance) {
-                    visualElement.mount(instance);
-                }
-                else {
-                    visualElement.unmount();
-                }
+            else {
+                visualElement.unmount();
             }
         }
         if (externalRef) {
@@ -4119,7 +4094,7 @@ function useMotionRef(visualState, visualElement, externalRef) {
      * Include externalRef in dependencies to ensure the callback updates
      * when the ref changes, allowing proper ref forwarding.
      */
-    [visualElement, externalRef]);
+    [visualElement]);
 }
 
 /**

package/dist/cjs/index.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
-var featureBundle = require('./feature-bundle-pqhrS3ID.js');
+var featureBundle = require('./feature-bundle-DzuUB-G1.js');
 var motionDom = require('motion-dom');
 var motionUtils = require('motion-utils');
 

package/dist/cjs/m.js

@@ -4,42 +4,23 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
 var motionUtils = require('motion-utils');
-var React = require('react');
+var react = require('react');
 var motionDom = require('motion-dom');
 
-function _interopNamespaceDefault(e) {
-    var n = Object.create(null);
-    if (e) {
-        Object.keys(e).forEach(function (k) {
-            if (k !== 'default') {
-                var d = Object.getOwnPropertyDescriptor(e, k);
-                Object.defineProperty(n, k, d.get ? d : {
-                    enumerable: true,
-                    get: function () { return e[k]; }
-                });
-            }
-        });
-    }
-    n.default = e;
-    return Object.freeze(n);
-}
-
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+const LayoutGroupContext = react.createContext({});
 
-const LayoutGroupContext = React.createContext({});
-
-const LazyContext = React.createContext({ strict: false });
+const LazyContext = react.createContext({ strict: false });
 
 /**
  * @public
  */
-const MotionConfigContext = React.createContext({
+const MotionConfigContext = react.createContext({
     transformPagePoint: (p) => p,
     isStatic: false,
     reducedMotion: "never",
 });
 
-const MotionContext = /* @__PURE__ */ React.createContext({});
+const MotionContext = /* @__PURE__ */ react.createContext({});
 
 function isAnimationControls(v) {
     return (v !== null &&
@@ -87,8 +68,8 @@ function getCurrentTreeVariants(props, context) {
 }
 
 function useCreateMotionContext(props) {
-    const { initial, animate } = getCurrentTreeVariants(props, React.useContext(MotionContext));
-    return React.useMemo(() => ({ initial, animate }), [variantLabelsAsDependency(initial), variantLabelsAsDependency(animate)]);
+    const { initial, animate } = getCurrentTreeVariants(props, react.useContext(MotionContext));
+    return react.useMemo(() => ({ initial, animate }), [variantLabelsAsDependency(initial), variantLabelsAsDependency(animate)]);
 }
 function variantLabelsAsDependency(prop) {
     return Array.isArray(prop) ? prop.join(" ") : prop;
@@ -233,7 +214,7 @@ function copyRawValuesOnly(target, source, props) {
     }
 }
 function useInitialMotionValues({ transformTemplate }, visualState) {
-    return React.useMemo(() => {
+    return react.useMemo(() => {
         const state = createHtmlRenderState();
         buildHTMLStyles(state, visualState, transformTemplate);
         return Object.assign({}, state.vars, state.style);
@@ -365,7 +346,7 @@ const createSvgRenderState = () => ({
 const isSVGTag = (tag) => typeof tag === "string" && tag.toLowerCase() === "svg";
 
 function useSVGProps(props, visualState, _isStatic, Component) {
-    const visualProps = React.useMemo(() => {
+    const visualProps = react.useMemo(() => {
         const state = createSvgRenderState();
         buildSVGAttrs(state, visualState, isSVGTag(Component), props.transformTemplate, props.style);
         return {
@@ -558,15 +539,15 @@ function useRender(Component, props, ref, { latestValues, }, isStatic, forwardMo
         : useHTMLProps;
     const visualProps = useVisualProps(props, latestValues, isStatic, Component);
     const filteredProps = filterProps(props, typeof Component === "string", forwardMotionProps);
-    const elementProps = Component !== React.Fragment ? { ...filteredProps, ...visualProps, ref } : {};
+    const elementProps = Component !== react.Fragment ? { ...filteredProps, ...visualProps, ref } : {};
     /**
      * If component has been handed a motion value as its child,
      * memoise its initial value and render that. Subsequent updates
      * will be handled by the onChange handler
      */
     const { children } = props;
-    const renderedChildren = React.useMemo(() => (motionDom.isMotionValue(children) ? children.get() : children), [children]);
-    return React.createElement(Component, {
+    const renderedChildren = react.useMemo(() => (motionDom.isMotionValue(children) ? children.get() : children), [children]);
+    return react.createElement(Component, {
         ...elementProps,
         children: renderedChildren,
     });
@@ -576,7 +557,7 @@ function useRender(Component, props, ref, { latestValues, }, isStatic, forwardMo
  * @public
  */
 const PresenceContext = 
-/* @__PURE__ */ React.createContext(null);
+/* @__PURE__ */ react.createContext(null);
 
 function getValueState(visualElement) {
     const state = [{}, {}];
@@ -617,7 +598,7 @@ function resolveVariantFromProps(props, definition, custom, visualElement) {
  * you can ensure that initialisers don't execute twice or more.
  */
 function useConstant(init) {
-    const ref = React.useRef(null);
+    const ref = react.useRef(null);
     if (ref.current === null) {
         ref.current = init();
     }
@@ -696,8 +677,8 @@ function makeLatestValues(props, context, presenceContext, scrapeMotionValues) {
     return values;
 }
 const makeUseVisualState = (config) => (props, isStatic) => {
-    const context = React.useContext(MotionContext);
-    const presenceContext = React.useContext(PresenceContext);
+    const context = react.useContext(MotionContext);
+    const presenceContext = react.useContext(PresenceContext);
     const make = () => makeState(config, props, context, presenceContext);
     return isStatic ? make() : useConstant(make);
 };
@@ -783,22 +764,16 @@ function isRefObject(ref) {
  * external ref and VisualElement.
  */
 function useMotionRef(visualState, visualElement, externalRef) {
-    const currentInstanceRef = React__namespace.useRef(null);
-    return React.useCallback((instance) => {
-        const prevInstance = currentInstanceRef.current;
-        currentInstanceRef.current = instance;
-        // Only run mount/unmount logic when the instance actually changes
-        if (instance !== prevInstance) {
+    return react.useCallback((instance) => {
+        if (instance) {
+            visualState.onMount && visualState.onMount(instance);
+        }
+        if (visualElement) {
             if (instance) {
-                visualState.onMount && visualState.onMount(instance);
+                visualElement.mount(instance);
             }
-            if (visualElement) {
-                if (instance) {
-                    visualElement.mount(instance);
-                }
-                else {
-                    visualElement.unmount();
-                }
+            else {
+                visualElement.unmount();
             }
         }
         if (externalRef) {
@@ -814,7 +789,7 @@ function useMotionRef(visualState, visualElement, externalRef) {
      * Include externalRef in dependencies to ensure the callback updates
      * when the ref changes, allowing proper ref forwarding.
      */
-    [visualElement, externalRef]);
+    [visualElement]);
 }
 
 /**
@@ -828,16 +803,16 @@ const optimizedAppearDataAttribute = "data-" + camelToDash(optimizedAppearDataId
 /**
  * Internal, exported only for usage in Framer
  */
-const SwitchLayoutGroupContext = React.createContext({});
+const SwitchLayoutGroupContext = react.createContext({});
 
-const useIsomorphicLayoutEffect = isBrowser ? React.useLayoutEffect : React.useEffect;
+const useIsomorphicLayoutEffect = isBrowser ? react.useLayoutEffect : react.useEffect;
 
 function useVisualElement(Component, visualState, props, createVisualElement, ProjectionNodeConstructor) {
-    const { visualElement: parent } = React.useContext(MotionContext);
-    const lazyContext = React.useContext(LazyContext);
-    const presenceContext = React.useContext(PresenceContext);
-    const reducedMotionConfig = React.useContext(MotionConfigContext).reducedMotion;
-    const visualElementRef = React.useRef(null);
+    const { visualElement: parent } = react.useContext(MotionContext);
+    const lazyContext = react.useContext(LazyContext);
+    const presenceContext = react.useContext(PresenceContext);
+    const reducedMotionConfig = react.useContext(MotionConfigContext).reducedMotion;
+    const visualElementRef = react.useRef(null);
     /**
      * If we haven't preloaded a renderer, check to see if we have one lazy-loaded
      */
@@ -861,15 +836,15 @@ function useVisualElement(Component, visualState, props, createVisualElement, Pr
      * Load Motion gesture and animation features. These are rendered as renderless
      * components so each feature can optionally make use of React lifecycle methods.
      */
-    const initialLayoutGroupConfig = React.useContext(SwitchLayoutGroupContext);
+    const initialLayoutGroupConfig = react.useContext(SwitchLayoutGroupContext);
     if (visualElement &&
         !visualElement.projection &&
         ProjectionNodeConstructor &&
         (visualElement.type === "html" || visualElement.type === "svg")) {
         createProjectionNode(visualElementRef.current, props, ProjectionNodeConstructor, initialLayoutGroupConfig);
     }
-    const isMounted = React.useRef(false);
-    React.useInsertionEffect(() => {
+    const isMounted = react.useRef(false);
+    react.useInsertionEffect(() => {
         /**
          * Check the component has already mounted before calling
          * `update` unnecessarily. This ensures we skip the initial update.
@@ -883,7 +858,7 @@ function useVisualElement(Component, visualState, props, createVisualElement, Pr
      * was present on initial render - it will be deleted after this.
      */
     const optimisedAppearId = props[optimizedAppearDataAttribute];
-    const wantsHandoff = React.useRef(Boolean(optimisedAppearId) &&
+    const wantsHandoff = react.useRef(Boolean(optimisedAppearId) &&
         !window.MotionHandoffIsComplete?.(optimisedAppearId) &&
         window.MotionHasOptimisedAnimation?.(optimisedAppearId));
     useIsomorphicLayoutEffect(() => {
@@ -907,7 +882,7 @@ function useVisualElement(Component, visualState, props, createVisualElement, Pr
             visualElement.animationState.animateChanges();
         }
     });
-    React.useEffect(() => {
+    react.useEffect(() => {
         if (!visualElement)
             return;
         if (!wantsHandoff.current && visualElement.animationState) {
@@ -980,7 +955,7 @@ function createMotionComponent(Component, { forwardMotionProps = false } = {}, p
          */
         let MeasureLayout;
         const configAndProps = {
-            ...React.useContext(MotionConfigContext),
+            ...react.useContext(MotionConfigContext),
             ...props,
             layoutId: useLayoutId(props),
         };
@@ -1008,18 +983,18 @@ function createMotionComponent(Component, { forwardMotionProps = false } = {}, p
     MotionDOMComponent.displayName = `motion.${typeof Component === "string"
         ? Component
         : `create(${Component.displayName ?? Component.name ?? ""})`}`;
-    const ForwardRefMotionComponent = React.forwardRef(MotionDOMComponent);
+    const ForwardRefMotionComponent = react.forwardRef(MotionDOMComponent);
     ForwardRefMotionComponent[motionComponentSymbol] = Component;
     return ForwardRefMotionComponent;
 }
 function useLayoutId({ layoutId }) {
-    const layoutGroupId = React.useContext(LayoutGroupContext).id;
+    const layoutGroupId = react.useContext(LayoutGroupContext).id;
     return layoutGroupId && layoutId !== undefined
         ? layoutGroupId + "-" + layoutId
         : layoutId;
 }
 function useStrictMode(configAndProps, preloadedFeatures) {
-    const isStrict = React.useContext(LazyContext).strict;
+    const isStrict = react.useContext(LazyContext).strict;
     /**
      * If we're in development mode, check to make sure we're not rendering a motion component
      * as a child of LazyMotion, as this will break the file-size benefits of using it.

package/dist/es/motion/utils/use-motion-ref.mjs

@@ -1,5 +1,4 @@
 "use client";
-import * as React from 'react';
 import { useCallback } from 'react';
 import { isRefObject } from '../../utils/is-ref-object.mjs';
 
@@ -8,22 +7,16 @@ import { isRefObject } from '../../utils/is-ref-object.mjs';
  * external ref and VisualElement.
  */
 function useMotionRef(visualState, visualElement, externalRef) {
-    const currentInstanceRef = React.useRef(null);
     return useCallback((instance) => {
-        const prevInstance = currentInstanceRef.current;
-        currentInstanceRef.current = instance;
-        // Only run mount/unmount logic when the instance actually changes
-        if (instance !== prevInstance) {
+        if (instance) {
+            visualState.onMount && visualState.onMount(instance);
+        }
+        if (visualElement) {
             if (instance) {
-                visualState.onMount && visualState.onMount(instance);
+                visualElement.mount(instance);
             }
-            if (visualElement) {
-                if (instance) {
-                    visualElement.mount(instance);
-                }
-                else {
-                    visualElement.unmount();
-                }
+            else {
+                visualElement.unmount();
             }
         }
         if (externalRef) {
@@ -39,7 +32,7 @@ function useMotionRef(visualState, visualElement, externalRef) {
      * Include externalRef in dependencies to ensure the callback updates
      * when the ref changes, allowing proper ref forwarding.
      */
-    [visualElement, externalRef]);
+    [visualElement]);
 }
 
 export { useMotionRef };

package/dist/framer-motion.dev.js

@@ -9601,22 +9601,16 @@
      * external ref and VisualElement.
      */
     function useMotionRef(visualState, visualElement, externalRef) {
-        const currentInstanceRef = React__namespace.useRef(null);
         return React$1.useCallback((instance) => {
-            const prevInstance = currentInstanceRef.current;
-            currentInstanceRef.current = instance;
-            // Only run mount/unmount logic when the instance actually changes
-            if (instance !== prevInstance) {
+            if (instance) {
+                visualState.onMount && visualState.onMount(instance);
+            }
+            if (visualElement) {
                 if (instance) {
-                    visualState.onMount && visualState.onMount(instance);
+                    visualElement.mount(instance);
                 }
-                if (visualElement) {
-                    if (instance) {
-                        visualElement.mount(instance);
-                    }
-                    else {
-                        visualElement.unmount();
-                    }
+                else {
+                    visualElement.unmount();
                 }
             }
             if (externalRef) {
@@ -9632,7 +9626,7 @@
          * Include externalRef in dependencies to ensure the callback updates
          * when the ref changes, allowing proper ref forwarding.
          */
-        [visualElement, externalRef]);
+        [visualElement]);
     }
 
     /**