framer-motion 12.23.26 → 12.23.28

package/dist/es/utils/get-context-window.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"get-context-window.mjs","sources":["../../../src/utils/get-context-window.ts"],"sourcesContent":["import { VisualElement } from \"../render/VisualElement\"\n\n// Fixes https://github.com/motiondivision/motion/issues/2270\nexport const getContextWindow = ({ current }: VisualElement<Element>) => {\n    return current ? current.ownerDocument.defaultView : null\n}\n"],"names":[],"mappings":"AAEA;MACa,gBAAgB,GAAG,CAAC,EAAE,OAAO,EAA0B,KAAI;AACpE,IAAA,OAAO,OAAO,GAAG,OAAO,CAAC,aAAa,CAAC,WAAW,GAAG,IAAI,CAAA;AAC7D;;;;"}

package/dist/es/utils/is-browser.mjs

@@ -1,3 +1,4 @@
 const isBrowser = typeof window !== "undefined";
 
 export { isBrowser };
+//# sourceMappingURL=is-browser.mjs.map

package/dist/es/utils/is-browser.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"is-browser.mjs","sources":["../../../src/utils/is-browser.ts"],"sourcesContent":["export const isBrowser = typeof window !== \"undefined\"\n"],"names":[],"mappings":"MAAa,SAAS,GAAG,OAAO,MAAM,KAAK;;;;"}

package/dist/es/utils/is-ref-object.mjs

@@ -5,3 +5,4 @@ function isRefObject(ref) {
 }
 
 export { isRefObject };
+//# sourceMappingURL=is-ref-object.mjs.map

package/dist/es/utils/is-ref-object.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"is-ref-object.mjs","sources":["../../../src/utils/is-ref-object.ts"],"sourcesContent":["import { MutableRefObject } from \"./safe-react-types\"\n\nexport function isRefObject<E = any>(ref: any): ref is MutableRefObject<E> {\n    return (\n        ref &&\n        typeof ref === \"object\" &&\n        Object.prototype.hasOwnProperty.call(ref, \"current\")\n    )\n}\n"],"names":[],"mappings":"AAEM,SAAU,WAAW,CAAU,GAAQ,EAAA;AACzC,IAAA,QACI,GAAG;QACH,OAAO,GAAG,KAAK,QAAQ;AACvB,QAAA,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,GAAG,EAAE,SAAS,CAAC,EACvD;AACL;;;;"}

package/dist/es/utils/reduced-motion/index.mjs

@@ -17,3 +17,4 @@ function initPrefersReducedMotion() {
 }
 
 export { initPrefersReducedMotion };
+//# sourceMappingURL=index.mjs.map

package/dist/es/utils/reduced-motion/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../../src/utils/reduced-motion/index.ts"],"sourcesContent":["import { isBrowser } from \"../is-browser\"\nimport { hasReducedMotionListener, prefersReducedMotion } from \"./state\"\n\nexport function initPrefersReducedMotion() {\n    hasReducedMotionListener.current = true\n    if (!isBrowser) return\n\n    if (window.matchMedia) {\n        const motionMediaQuery = window.matchMedia(\"(prefers-reduced-motion)\")\n\n        const setReducedMotionPreferences = () =>\n            (prefersReducedMotion.current = motionMediaQuery.matches)\n\n        motionMediaQuery.addEventListener(\"change\", setReducedMotionPreferences)\n\n        setReducedMotionPreferences()\n    } else {\n        prefersReducedMotion.current = false\n    }\n}\n"],"names":[],"mappings":";;;SAGgB,wBAAwB,GAAA;AACpC,IAAA,wBAAwB,CAAC,OAAO,GAAG,IAAI,CAAA;AACvC,IAAA,IAAI,CAAC,SAAS;QAAE,OAAM;AAEtB,IAAA,IAAI,MAAM,CAAC,UAAU,EAAE;QACnB,MAAM,gBAAgB,GAAG,MAAM,CAAC,UAAU,CAAC,0BAA0B,CAAC,CAAA;AAEtE,QAAA,MAAM,2BAA2B,GAAG,OAC/B,oBAAoB,CAAC,OAAO,GAAG,gBAAgB,CAAC,OAAO,CAAC,CAAA;AAE7D,QAAA,gBAAgB,CAAC,gBAAgB,CAAC,QAAQ,EAAE,2BAA2B,CAAC,CAAA;AAExE,QAAA,2BAA2B,EAAE,CAAA;KAChC;SAAM;AACH,QAAA,oBAAoB,CAAC,OAAO,GAAG,KAAK,CAAA;KACvC;AACL;;;;"}

package/dist/es/utils/reduced-motion/state.mjs

@@ -3,3 +3,4 @@ const prefersReducedMotion = { current: null };
 const hasReducedMotionListener = { current: false };
 
 export { hasReducedMotionListener, prefersReducedMotion };
+//# sourceMappingURL=state.mjs.map

package/dist/es/utils/reduced-motion/state.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"state.mjs","sources":["../../../../src/utils/reduced-motion/state.ts"],"sourcesContent":["interface ReducedMotionState {\n    current: boolean | null\n}\n\n// Does this device prefer reduced motion? Returns `null` server-side.\nexport const prefersReducedMotion: ReducedMotionState = { current: null }\n\nexport const hasReducedMotionListener = { current: false }\n"],"names":[],"mappings":"AAIA;MACa,oBAAoB,GAAuB,EAAE,OAAO,EAAE,IAAI,GAAE;MAE5D,wBAAwB,GAAG,EAAE,OAAO,EAAE,KAAK;;;;"}

package/dist/es/utils/reduced-motion/use-reduced-motion-config.mjs

@@ -18,3 +18,4 @@ function useReducedMotionConfig() {
 }
 
 export { useReducedMotionConfig };
+//# sourceMappingURL=use-reduced-motion-config.mjs.map

package/dist/es/utils/reduced-motion/use-reduced-motion-config.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-reduced-motion-config.mjs","sources":["../../../../src/utils/reduced-motion/use-reduced-motion-config.ts"],"sourcesContent":["\"use client\"\n\nimport { useContext } from \"react\"\nimport { MotionConfigContext } from \"../../context/MotionConfigContext\"\nimport { useReducedMotion } from \"./use-reduced-motion\"\n\nexport function useReducedMotionConfig() {\n    const reducedMotionPreference = useReducedMotion()\n    const { reducedMotion } = useContext(MotionConfigContext)\n\n    if (reducedMotion === \"never\") {\n        return false\n    } else if (reducedMotion === \"always\") {\n        return true\n    } else {\n        return reducedMotionPreference\n    }\n}\n"],"names":[],"mappings":";;;;;;AAOI;;AAGA;AACI;;AACG;AACH;;;AAEA;;AAER;;"}

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

@@ -46,3 +46,4 @@ function useReducedMotion() {
 }
 
 export { useReducedMotion };
+//# sourceMappingURL=use-reduced-motion.mjs.map

package/dist/es/utils/reduced-motion/use-reduced-motion.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-reduced-motion.mjs","sources":["../../../../src/utils/reduced-motion/use-reduced-motion.ts"],"sourcesContent":["\"use client\"\n\nimport { warnOnce } from \"motion-utils\"\nimport { useState } from \"react\"\nimport { initPrefersReducedMotion } from \".\"\nimport { hasReducedMotionListener, prefersReducedMotion } from \"./state\"\n\n/**\n * A hook that returns `true` if we should be using reduced motion based on the current device's Reduced Motion setting.\n *\n * This can be used to implement changes to your UI based on Reduced Motion. For instance, replacing motion-sickness inducing\n * `x`/`y` animations with `opacity`, disabling the autoplay of background videos, or turning off parallax motion.\n *\n * It will actively respond to changes and re-render your components with the latest setting.\n *\n * ```jsx\n * export function Sidebar({ isOpen }) {\n *   const shouldReduceMotion = useReducedMotion()\n *   const closedX = shouldReduceMotion ? 0 : \"-100%\"\n *\n *   return (\n *     <motion.div animate={{\n *       opacity: isOpen ? 1 : 0,\n *       x: isOpen ? 0 : closedX\n *     }} />\n *   )\n * }\n * ```\n *\n * @return boolean\n *\n * @public\n */\nexport function useReducedMotion() {\n    /**\n     * Lazy initialisation of prefersReducedMotion\n     */\n    !hasReducedMotionListener.current && initPrefersReducedMotion()\n\n    const [shouldReduceMotion] = useState(prefersReducedMotion.current)\n\n    if (process.env.NODE_ENV !== \"production\") {\n        warnOnce(\n            shouldReduceMotion !== true,\n            \"You have Reduced Motion enabled on your device. Animations may not appear as expected.\",\n            \"reduced-motion-disabled\"\n        )\n    }\n\n    /**\n     * TODO See if people miss automatically updating shouldReduceMotion setting\n     */\n\n    return shouldReduceMotion\n}\n"],"names":[],"mappings":";;;;;;AAOA;;;;;;;;;;;;;;;;;;;;;;;;;AAyBG;;AAEC;;AAEG;AACH;;;;;AAYA;;AAEG;AAEH;AACJ;;"}

package/dist/es/utils/shallow-compare.mjs

@@ -12,3 +12,4 @@ function shallowCompare(next, prev) {
 }
 
 export { shallowCompare };
+//# sourceMappingURL=shallow-compare.mjs.map

package/dist/es/utils/shallow-compare.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"shallow-compare.mjs","sources":["../../../src/utils/shallow-compare.ts"],"sourcesContent":["export function shallowCompare(next: any[], prev: any[] | null) {\n    if (!Array.isArray(prev)) return false\n\n    const prevLength = prev.length\n\n    if (prevLength !== next.length) return false\n\n    for (let i = 0; i < prevLength; i++) {\n        if (prev[i] !== next[i]) return false\n    }\n\n    return true\n}\n"],"names":[],"mappings":"AAAgB,SAAA,cAAc,CAAC,IAAW,EAAE,IAAkB,EAAA;AAC1D,IAAA,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC;AAAE,QAAA,OAAO,KAAK,CAAA;AAEtC,IAAA,MAAM,UAAU,GAAG,IAAI,CAAC,MAAM,CAAA;AAE9B,IAAA,IAAI,UAAU,KAAK,IAAI,CAAC,MAAM;AAAE,QAAA,OAAO,KAAK,CAAA;AAE5C,IAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,UAAU,EAAE,CAAC,EAAE,EAAE;QACjC,IAAI,IAAI,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC;AAAE,YAAA,OAAO,KAAK,CAAA;KACxC;AAED,IAAA,OAAO,IAAI,CAAA;AACf;;;;"}

package/dist/es/utils/use-animation-frame.mjs

@@ -20,3 +20,4 @@ function useAnimationFrame(callback) {
 }
 
 export { useAnimationFrame };
+//# sourceMappingURL=use-animation-frame.mjs.map

package/dist/es/utils/use-animation-frame.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-animation-frame.mjs","sources":["../../../src/utils/use-animation-frame.ts"],"sourcesContent":["\"use client\"\n\nimport { cancelFrame, frame, FrameData } from \"motion-dom\"\nimport { useContext, useEffect, useRef } from \"react\"\nimport { MotionConfigContext } from \"../context/MotionConfigContext\"\n\nexport type FrameCallback = (timestamp: number, delta: number) => void\n\nexport function useAnimationFrame(callback: FrameCallback) {\n    const initialTimestamp = useRef(0)\n    const { isStatic } = useContext(MotionConfigContext)\n\n    useEffect(() => {\n        if (isStatic) return\n\n        const provideTimeSinceStart = ({ timestamp, delta }: FrameData) => {\n            if (!initialTimestamp.current) initialTimestamp.current = timestamp\n\n            callback(timestamp - initialTimestamp.current, delta)\n        }\n\n        frame.update(provideTimeSinceStart, true)\n        return () => cancelFrame(provideTimeSinceStart)\n    }, [callback])\n}\n"],"names":[],"mappings":";;;;;AAQM;AACF;;;AAII;;;;AAGmC;;AAGnC;AAEA;AACA;AACJ;AACJ;;"}

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

@@ -58,3 +58,4 @@ function useComposedRefs(...refs) {
 }
 
 export { useComposedRefs };
+//# sourceMappingURL=use-composed-ref.mjs.map

package/dist/es/utils/use-composed-ref.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-composed-ref.mjs","sources":["../../../src/utils/use-composed-ref.ts"],"sourcesContent":["/**\n * Taken from https://github.com/radix-ui/primitives/blob/main/packages/react/compose-refs/src/compose-refs.tsx\n */\nimport * as React from \"react\"\n\ntype PossibleRef<T> = React.Ref<T> | undefined\n\n/**\n * Set a given ref to a given value\n * This utility takes care of different types of refs: callback refs and RefObject(s)\n */\nfunction setRef<T>(ref: PossibleRef<T>, value: T): void | (() => void) {\n    if (typeof ref === \"function\") {\n        return ref(value)\n    } else if (ref !== null && ref !== undefined) {\n        ;(ref as React.MutableRefObject<T>).current = value\n    }\n}\n\n/**\n * A utility to compose multiple refs together\n * Accepts callback refs and RefObject(s)\n */\nfunction composeRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {\n    return (node) => {\n        let hasCleanup = false\n        const cleanups = refs.map((ref) => {\n            const cleanup = setRef(ref, node)\n            if (!hasCleanup && typeof cleanup === \"function\") {\n                hasCleanup = true\n            }\n            return cleanup\n        })\n        // React <19 will log an error to the console if a callback ref returns a\n        // value. We don't use ref cleanups internally so this will only happen if a\n        // user's ref callback returns a value, which we only expect if they are\n        // using the cleanup functionality added in React 19.\n        if (hasCleanup) {\n            return () => {\n                for (let i = 0; i < cleanups.length; i++) {\n                    const cleanup = cleanups[i]\n                    if (typeof cleanup === \"function\") {\n                        cleanup()\n                    } else {\n                        setRef(refs[i], null)\n                    }\n                }\n            }\n        }\n    }\n}\n\n/**\n * A custom hook that composes multiple refs\n * Accepts callback refs and RefObject(s)\n */\nfunction useComposedRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    return React.useCallback(composeRefs(...refs), refs)\n}\n\nexport { useComposedRefs }\n"],"names":[],"mappings":";;AAAA;;AAEG;AAKH;;;AAGG;AACH,SAAS,MAAM,CAAI,GAAmB,EAAE,KAAQ,EAAA;AAC5C,IAAA,IAAI,OAAO,GAAG,KAAK,UAAU,EAAE;AAC3B,QAAA,OAAO,GAAG,CAAC,KAAK,CAAC,CAAA;KACpB;SAAM,IAAI,GAAG,KAAK,IAAI,IAAI,GAAG,KAAK,SAAS,EAAE;AACxC,QAAA,GAAiC,CAAC,OAAO,GAAG,KAAK,CAAA;KACtD;AACL,CAAC;AAED;;;AAGG;AACH,SAAS,WAAW,CAAI,GAAG,IAAsB,EAAA;IAC7C,OAAO,CAAC,IAAI,KAAI;QACZ,IAAI,UAAU,GAAG,KAAK,CAAA;QACtB,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,KAAI;YAC9B,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,EAAE,IAAI,CAAC,CAAA;YACjC,IAAI,CAAC,UAAU,IAAI,OAAO,OAAO,KAAK,UAAU,EAAE;gBAC9C,UAAU,GAAG,IAAI,CAAA;aACpB;AACD,YAAA,OAAO,OAAO,CAAA;AAClB,SAAC,CAAC,CAAA;;;;;QAKF,IAAI,UAAU,EAAE;AACZ,YAAA,OAAO,MAAK;AACR,gBAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,QAAQ,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;AACtC,oBAAA,MAAM,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAA;AAC3B,oBAAA,IAAI,OAAO,OAAO,KAAK,UAAU,EAAE;AAC/B,wBAAA,OAAO,EAAE,CAAA;qBACZ;yBAAM;wBACH,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,CAAA;qBACxB;iBACJ;AACL,aAAC,CAAA;SACJ;AACL,KAAC,CAAA;AACL,CAAC;AAED;;;AAGG;AACH,SAAS,eAAe,CAAI,GAAG,IAAsB,EAAA;;AAEjD,IAAA,OAAO,KAAK,CAAC,WAAW,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC,EAAE,IAAI,CAAC,CAAA;AACxD;;;;"}

package/dist/es/utils/use-constant.mjs

@@ -17,3 +17,4 @@ function useConstant(init) {
 }
 
 export { useConstant };
+//# sourceMappingURL=use-constant.mjs.map

package/dist/es/utils/use-constant.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-constant.mjs","sources":["../../../src/utils/use-constant.ts"],"sourcesContent":["\"use client\"\n\nimport { useRef } from \"react\"\n\ntype Init<T> = () => T\n\n/**\n * Creates a constant value over the lifecycle of a component.\n *\n * Even if `useMemo` is provided an empty array as its final argument, it doesn't offer\n * a guarantee that it won't re-run for performance reasons later on. By using `useConstant`\n * you can ensure that initialisers don't execute twice or more.\n */\nexport function useConstant<T>(init: Init<T>) {\n    const ref = useRef<T | null>(null)\n\n    if (ref.current === null) {\n        ref.current = init()\n    }\n\n    return ref.current\n}\n"],"names":[],"mappings":";;;AAMA;;;;;;AAMG;AACG;AACF;AAEA;AACI;;;AAIR;;"}

package/dist/es/utils/use-cycle.mjs

@@ -46,3 +46,4 @@ function useCycle(...items) {
 }
 
 export { useCycle };
+//# sourceMappingURL=use-cycle.mjs.map

package/dist/es/utils/use-cycle.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-cycle.mjs","sources":["../../../src/utils/use-cycle.ts"],"sourcesContent":["\"use client\"\n\nimport { wrap } from \"motion-utils\"\nimport { useCallback, useRef, useState } from \"react\"\n\nexport type Cycle = (i?: number) => void\n\nexport type CycleState<T> = [T, Cycle]\n\n/**\n * Cycles through a series of visual properties. Can be used to toggle between or cycle through animations. It works similar to `useState` in React. It is provided an initial array of possible states, and returns an array of two arguments.\n *\n * An index value can be passed to the returned `cycle` function to cycle to a specific index.\n *\n * ```jsx\n * import * as React from \"react\"\n * import { motion, useCycle } from \"framer-motion\"\n *\n * export const MyComponent = () => {\n *   const [x, cycleX] = useCycle(0, 50, 100)\n *\n *   return (\n *     <motion.div\n *       animate={{ x: x }}\n *       onTap={() => cycleX()}\n *      />\n *    )\n * }\n * ```\n *\n * @param items - items to cycle through\n * @returns [currentState, cycleState]\n *\n * @public\n */\nexport function useCycle<T>(...items: T[]): CycleState<T> {\n    const index = useRef(0)\n    const [item, setItem] = useState(items[index.current])\n\n    const runCycle = useCallback(\n        (next?: number) => {\n            index.current =\n                typeof next !== \"number\"\n                    ? wrap(0, items.length, index.current + 1)\n                    : next\n\n            setItem(items[index.current])\n        },\n        // The array will change on each call, but by putting items.length at\n        // the front of this array, we guarantee the dependency comparison will match up\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n        [items.length, ...items]\n    )\n    return [item, runCycle]\n}\n"],"names":[],"mappings":";;;;AASA;;;;;;;;;;;;;;;;;;;;;;;;;AAyBG;AACa;AACZ;AACA;AAEA;AAEQ;;AAEQ;;;;;;;;AAUhB;AACJ;;"}

package/dist/es/utils/use-force-update.mjs

@@ -18,3 +18,4 @@ function useForceUpdate() {
 }
 
 export { useForceUpdate };
+//# sourceMappingURL=use-force-update.mjs.map

package/dist/es/utils/use-force-update.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-force-update.mjs","sources":["../../../src/utils/use-force-update.ts"],"sourcesContent":["\"use client\"\n\nimport { frame } from \"motion-dom\"\nimport { useCallback, useState } from \"react\"\nimport { useIsMounted } from \"./use-is-mounted\"\n\nexport function useForceUpdate(): [VoidFunction, number] {\n    const isMounted = useIsMounted()\n    const [forcedRenderCount, setForcedRenderCount] = useState(0)\n\n    const forceRender = useCallback(() => {\n        isMounted.current && setForcedRenderCount(forcedRenderCount + 1)\n    }, [forcedRenderCount])\n\n    /**\n     * Defer this to the end of the next animation frame in case there are multiple\n     * synchronous calls.\n     */\n    const deferredForceRender = useCallback(\n        () => frame.postRender(forceRender),\n        [forceRender]\n    )\n\n    return [deferredForceRender, forcedRenderCount]\n}\n"],"names":[],"mappings":";;;;;;AAOI;;AAGA;;AAEA;AAEA;;;AAGG;AACH;AAKA;AACJ;;"}

package/dist/es/utils/use-in-view.mjs

@@ -22,3 +22,4 @@ function useInView(ref, { root, margin, amount, once = false, initial = false, }
 }
 
 export { useInView };
+//# sourceMappingURL=use-in-view.mjs.map

package/dist/es/utils/use-in-view.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-in-view.mjs","sources":["../../../src/utils/use-in-view.ts"],"sourcesContent":["\"use client\"\n\nimport { RefObject, useEffect, useState } from \"react\"\nimport { inView, InViewOptions } from \"../render/dom/viewport\"\n\nexport interface UseInViewOptions\n    extends Omit<InViewOptions, \"root\" | \"amount\"> {\n    root?: RefObject<Element | null>\n    once?: boolean\n    amount?: \"some\" | \"all\" | number\n    initial?: boolean\n}\n\nexport function useInView(\n    ref: RefObject<Element | null>,\n    {\n        root,\n        margin,\n        amount,\n        once = false,\n        initial = false,\n    }: UseInViewOptions = {}\n) {\n    const [isInView, setInView] = useState(initial)\n\n    useEffect(() => {\n        if (!ref.current || (once && isInView)) return\n\n        const onEnter = () => {\n            setInView(true)\n\n            return once ? undefined : () => setInView(false)\n        }\n\n        const options: InViewOptions = {\n            root: (root && root.current) || undefined,\n            margin,\n            amount,\n        }\n\n        return inView(ref.current, onEnter, options)\n    }, [root, ref, margin, once, amount])\n\n    return isInView\n}\n"],"names":[],"mappings":";;;;AAaM;;;;;;;AAkBM;AACJ;AAEA;;;;;;AAOJ;AAEA;AACJ;;"}

package/dist/es/utils/use-instant-transition.mjs

@@ -40,3 +40,4 @@ function disableInstantTransitions() {
 }
 
 export { disableInstantTransitions, useInstantTransition };
+//# sourceMappingURL=use-instant-transition.mjs.map

package/dist/es/utils/use-instant-transition.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-instant-transition.mjs","sources":["../../../src/utils/use-instant-transition.ts"],"sourcesContent":["\"use client\"\n\nimport { frame } from \"motion-dom\"\nimport { MotionGlobalConfig } from \"motion-utils\"\nimport { useEffect, useRef } from \"react\"\nimport { useInstantLayoutTransition } from \"../projection/use-instant-layout-transition\"\nimport { useForceUpdate } from \"./use-force-update\"\n\nexport function useInstantTransition() {\n    const [forceUpdate, forcedRenderCount] = useForceUpdate()\n    const startInstantLayoutTransition = useInstantLayoutTransition()\n    const unlockOnFrameRef = useRef<number>(-1)\n\n    useEffect(() => {\n        /**\n         * Unblock after two animation frames, otherwise this will unblock too soon.\n         */\n        frame.postRender(() =>\n            frame.postRender(() => {\n                /**\n                 * If the callback has been called again after the effect\n                 * triggered this 2 frame delay, don't unblock animations. This\n                 * prevents the previous effect from unblocking the current\n                 * instant transition too soon. This becomes more likely when\n                 * used in conjunction with React.startTransition().\n                 */\n                if (forcedRenderCount !== unlockOnFrameRef.current) return\n                MotionGlobalConfig.instantAnimations = false\n            })\n        )\n    }, [forcedRenderCount])\n\n    return (callback: () => void) => {\n        startInstantLayoutTransition(() => {\n            MotionGlobalConfig.instantAnimations = true\n            forceUpdate()\n            callback()\n            unlockOnFrameRef.current = forcedRenderCount + 1\n        })\n    }\n}\n\nexport function disableInstantTransitions() {\n    MotionGlobalConfig.instantAnimations = false\n}\n"],"names":[],"mappings":";;;;;;;;;AAUI;AACA;;AAGI;;AAEG;;AAGK;;;;;;AAMG;AACH;;AACA;;AAGZ;;;AAIQ;AACA;AACA;AACA;AACJ;AACJ;AACJ;;AAGI;AACJ;;"}

package/dist/es/utils/use-is-mounted.mjs

@@ -14,3 +14,4 @@ function useIsMounted() {
 }
 
 export { useIsMounted };
+//# sourceMappingURL=use-is-mounted.mjs.map

package/dist/es/utils/use-is-mounted.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-is-mounted.mjs","sources":["../../../src/utils/use-is-mounted.ts"],"sourcesContent":["\"use client\"\n\nimport { useRef } from \"react\"\nimport { useIsomorphicLayoutEffect } from \"./use-isomorphic-effect\"\n\nexport function useIsMounted() {\n    const isMounted = useRef(false)\n    useIsomorphicLayoutEffect(() => {\n        isMounted.current = true\n\n        return () => {\n            isMounted.current = false\n        }\n    }, [])\n\n    return isMounted\n}\n"],"names":[],"mappings":";;;;;AAMI;;AAEI;AAEA;AACI;AACJ;;AAGJ;AACJ;;"}

package/dist/es/utils/use-isomorphic-effect.mjs

@@ -5,3 +5,4 @@ import { isBrowser } from './is-browser.mjs';
 const useIsomorphicLayoutEffect = isBrowser ? useLayoutEffect : useEffect;
 
 export { useIsomorphicLayoutEffect };
+//# sourceMappingURL=use-isomorphic-effect.mjs.map

package/dist/es/utils/use-isomorphic-effect.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-isomorphic-effect.mjs","sources":["../../../src/utils/use-isomorphic-effect.ts"],"sourcesContent":["\"use client\"\n\nimport { useEffect, useLayoutEffect } from \"react\"\nimport { isBrowser } from \"./is-browser\"\n\nexport const useIsomorphicLayoutEffect = isBrowser ? useLayoutEffect : useEffect\n"],"names":[],"mappings":";;;;AAKO;;"}

package/dist/es/utils/use-motion-value-event.mjs

@@ -12,3 +12,4 @@ function useMotionValueEvent(value, event, callback) {
 }
 
 export { useMotionValueEvent };
+//# sourceMappingURL=use-motion-value-event.mjs.map

package/dist/es/utils/use-motion-value-event.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-motion-value-event.mjs","sources":["../../../src/utils/use-motion-value-event.ts"],"sourcesContent":["\"use client\"\n\nimport { MotionValue, MotionValueEventCallbacks } from \"motion-dom\"\nimport { useInsertionEffect } from \"react\"\n\nexport function useMotionValueEvent<\n    V,\n    EventName extends keyof MotionValueEventCallbacks<V>\n>(\n    value: MotionValue<V>,\n    event: EventName,\n    callback: MotionValueEventCallbacks<V>[EventName]\n) {\n    /**\n     * useInsertionEffect will create subscriptions before any other\n     * effects will run. Effects run upwards through the tree so it\n     * can be that binding a useLayoutEffect higher up the tree can\n     * miss changes from lower down the tree.\n     */\n    useInsertionEffect(\n        () => value.on(event, callback),\n        [value, event, callback]\n    )\n}\n"],"names":[],"mappings":";;;;AAaI;;;;;AAKG;;AAKP;;"}

package/dist/es/utils/use-page-in-view.mjs

@@ -17,3 +17,4 @@ function usePageInView() {
 }
 
 export { usePageInView };
+//# sourceMappingURL=use-page-in-view.mjs.map

package/dist/es/utils/use-page-in-view.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-page-in-view.mjs","sources":["../../../src/utils/use-page-in-view.ts"],"sourcesContent":["\"use client\"\n\nimport { useEffect, useState } from \"react\"\n\nexport function usePageInView() {\n    const [isInView, setIsInView] = useState(true)\n\n    useEffect(() => {\n        const handleVisibilityChange = () => setIsInView(!document.hidden)\n\n        if (document.hidden) {\n            handleVisibilityChange()\n        }\n\n        document.addEventListener(\"visibilitychange\", handleVisibilityChange)\n\n        return () => {\n            document.removeEventListener(\n                \"visibilitychange\",\n                handleVisibilityChange\n            )\n        }\n    }, [])\n\n    return isInView\n}\n"],"names":[],"mappings":";;;;;;AAQQ;AAEA;AACI;;AAGJ;AAEA;AACI;AAIJ;;AAGJ;AACJ;;"}

package/dist/es/utils/use-unmount-effect.mjs

@@ -6,3 +6,4 @@ function useUnmountEffect(callback) {
 }
 
 export { useUnmountEffect };
+//# sourceMappingURL=use-unmount-effect.mjs.map

package/dist/es/utils/use-unmount-effect.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-unmount-effect.mjs","sources":["../../../src/utils/use-unmount-effect.ts"],"sourcesContent":["\"use client\"\n\nimport { useEffect } from \"react\"\n\nexport function useUnmountEffect(callback: () => void) {\n    return useEffect(() => () => callback(), [])\n}\n"],"names":[],"mappings":";;;AAIM;AACF;AACJ;;"}

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

@@ -12,3 +12,4 @@ function useElementScroll(ref) {
 }
 
 export { useElementScroll };
+//# sourceMappingURL=use-element-scroll.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"use-element-scroll.mjs","sources":["../../../../src/value/scroll/use-element-scroll.ts"],"sourcesContent":["import { warnOnce } from \"motion-utils\"\nimport { RefObject } from \"react\"\nimport { useScroll } from \"../use-scroll\"\n\n/**\n * @deprecated useElementScroll is deprecated. Convert to useScroll({ container: ref })\n */\nexport function useElementScroll(ref: RefObject<HTMLElement | null>) {\n    if (process.env.NODE_ENV === \"development\") {\n        warnOnce(\n            false,\n            \"useElementScroll is deprecated. Convert to useScroll({ container: ref }).\"\n        )\n    }\n\n    return useScroll({ container: ref })\n}\n"],"names":[],"mappings":";;;AAIA;;AAEG;AACG,SAAU,gBAAgB,CAAC,GAAkC,EAAA;IAC/D,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,aAAa,EAAE;AACxC,QAAA,QAAQ,CACJ,KAAK,EACL,2EAA2E,CAC9E,CAAA;KACJ;IAED,OAAO,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC,CAAA;AACxC;;;;"}

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

@@ -12,3 +12,4 @@ function useViewportScroll() {
 }
 
 export { useViewportScroll };
+//# sourceMappingURL=use-viewport-scroll.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"use-viewport-scroll.mjs","sources":["../../../../src/value/scroll/use-viewport-scroll.ts"],"sourcesContent":["import { warnOnce } from \"motion-utils\"\nimport { useScroll } from \"../use-scroll\"\n\n/**\n * @deprecated useViewportScroll is deprecated. Convert to useScroll()\n */\nexport function useViewportScroll() {\n    if (process.env.NODE_ENV !== \"production\") {\n        warnOnce(\n            false,\n            \"useViewportScroll is deprecated. Convert to useScroll().\"\n        )\n    }\n    return useScroll()\n}\n"],"names":[],"mappings":";;;AAGA;;AAEG;SACa,iBAAiB,GAAA;IAC7B,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,YAAY,EAAE;AACvC,QAAA,QAAQ,CACJ,KAAK,EACL,0DAA0D,CAC7D,CAAA;KACJ;IACD,OAAO,SAAS,EAAE,CAAA;AACtB;;;;"}

package/dist/es/value/use-combine-values.mjs

@@ -36,3 +36,4 @@ function useCombineMotionValues(values, combineValues) {
 }
 
 export { useCombineMotionValues };
+//# sourceMappingURL=use-combine-values.mjs.map

package/dist/es/value/use-combine-values.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-combine-values.mjs","sources":["../../../src/value/use-combine-values.ts"],"sourcesContent":["\"use client\"\n\nimport { cancelFrame, frame, MotionValue } from \"motion-dom\"\nimport { useIsomorphicLayoutEffect } from \"../utils/use-isomorphic-effect\"\nimport { useMotionValue } from \"./use-motion-value\"\n\nexport function useCombineMotionValues<R>(\n    values: MotionValue[],\n    combineValues: () => R\n) {\n    /**\n     * Initialise the returned motion value. This remains the same between renders.\n     */\n    const value = useMotionValue(combineValues())\n\n    /**\n     * Create a function that will update the template motion value with the latest values.\n     * This is pre-bound so whenever a motion value updates it can schedule its\n     * execution in Framesync. If it's already been scheduled it won't be fired twice\n     * in a single frame.\n     */\n    const updateValue = () => value.set(combineValues())\n\n    /**\n     * Synchronously update the motion value with the latest values during the render.\n     * This ensures that within a React render, the styles applied to the DOM are up-to-date.\n     */\n    updateValue()\n\n    /**\n     * Subscribe to all motion values found within the template. Whenever any of them change,\n     * schedule an update.\n     */\n    useIsomorphicLayoutEffect(() => {\n        const scheduleUpdate = () => frame.preRender(updateValue, false, true)\n        const subscriptions = values.map((v) => v.on(\"change\", scheduleUpdate))\n\n        return () => {\n            subscriptions.forEach((unsubscribe) => unsubscribe())\n            cancelFrame(updateValue)\n        }\n    })\n\n    return value\n}\n"],"names":[],"mappings":";;;;;AAMgB;AAIZ;;AAEG;AACH;AAEA;;;;;AAKG;AACH;AAEA;;;AAGG;AACH;AAEA;;;AAGG;;AAEC;;AAGA;;;AAGA;AACJ;AAEA;AACJ;;"}

package/dist/es/value/use-computed.mjs

@@ -18,3 +18,4 @@ function useComputed(compute) {
 }
 
 export { useComputed };
+//# sourceMappingURL=use-computed.mjs.map

package/dist/es/value/use-computed.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-computed.mjs","sources":["../../../src/value/use-computed.ts"],"sourcesContent":["\"use client\"\n\nimport { collectMotionValues, type MotionValue } from \"motion-dom\"\nimport { useCombineMotionValues } from \"./use-combine-values\"\n\nexport function useComputed<O>(compute: () => O): MotionValue<O> {\n    /**\n     * Open session of collectMotionValues. Any MotionValue that calls get()\n     * will be saved into this array.\n     */\n    collectMotionValues.current = []\n\n    compute()\n\n    const value = useCombineMotionValues(collectMotionValues.current, compute)\n\n    /**\n     * Synchronously close session of collectMotionValues.\n     */\n    collectMotionValues.current = undefined\n\n    return value\n}\n"],"names":[],"mappings":";;;;AAKM;AACF;;;AAGG;AACH;AAEA;;AAIA;;AAEG;AACH;AAEA;AACJ;;"}

package/dist/es/value/use-inverted-scale.mjs

@@ -51,3 +51,4 @@ function useInvertedScale(scale) {
 }
 
 export { invertScale, useInvertedScale };
+//# sourceMappingURL=use-inverted-scale.mjs.map

package/dist/es/value/use-inverted-scale.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-inverted-scale.mjs","sources":["../../../src/value/use-inverted-scale.ts"],"sourcesContent":["\"use client\"\n\nimport { MotionValue } from \"motion-dom\"\nimport { invariant, warning } from \"motion-utils\"\nimport { useContext } from \"react\"\nimport { MotionContext } from \"../context/MotionContext\"\nimport { useMotionValue } from \"./use-motion-value\"\nimport { useTransform } from \"./use-transform\"\n\ninterface ScaleMotionValues {\n    scaleX: MotionValue<number>\n    scaleY: MotionValue<number>\n}\n\n// Keep things reasonable and avoid scale: Infinity. In practise we might need\n// to add another value, opacity, that could interpolate scaleX/Y [0,0.01] => [0,1]\n// to simply hide content at unreasonable scales.\nconst maxScale = 100000\nexport const invertScale = (scale: number) =>\n    scale > 0.001 ? 1 / scale : maxScale\n\nlet hasWarned = false\n\n/**\n * Returns a `MotionValue` each for `scaleX` and `scaleY` that update with the inverse\n * of their respective parent scales.\n *\n * This is useful for undoing the distortion of content when scaling a parent component.\n *\n * By default, `useInvertedScale` will automatically fetch `scaleX` and `scaleY` from the nearest parent.\n * By passing other `MotionValue`s in as `useInvertedScale({ scaleX, scaleY })`, it will invert the output\n * of those instead.\n *\n * ```jsx\n * const MyComponent = () => {\n *   const { scaleX, scaleY } = useInvertedScale()\n *   return <motion.div style={{ scaleX, scaleY }} />\n * }\n * ```\n *\n * @deprecated\n */\nexport function useInvertedScale(\n    scale?: Partial<ScaleMotionValues>\n): ScaleMotionValues {\n    let parentScaleX = useMotionValue(1)\n    let parentScaleY = useMotionValue(1)\n    const { visualElement } = useContext(MotionContext)\n\n    invariant(\n        !!(scale || visualElement),\n        \"If no scale values are provided, useInvertedScale must be used within a child of another motion component.\"\n    )\n\n    warning(\n        hasWarned,\n        \"useInvertedScale is deprecated and will be removed in 3.0. Use the layout prop instead.\"\n    )\n\n    hasWarned = true\n\n    if (scale) {\n        parentScaleX = scale.scaleX || parentScaleX\n        parentScaleY = scale.scaleY || parentScaleY\n    } else if (visualElement) {\n        parentScaleX = visualElement.getValue(\"scaleX\", 1)\n        parentScaleY = visualElement.getValue(\"scaleY\", 1)\n    }\n\n    const scaleX = useTransform(parentScaleX, invertScale)\n    const scaleY = useTransform(parentScaleY, invertScale)\n\n    return { scaleX, scaleY }\n}\n"],"names":[],"mappings":";;;;;;;AAcA;AACA;AACA;AACA;;AAIA;AAEA;;;;;;;;;;;;;;;;;;AAkBG;AACG;AAGF;AACA;;;AAQA;;;AAQI;AACA;;;;;;;;AASJ;AACJ;;"}

package/dist/es/value/use-motion-template.mjs

@@ -44,3 +44,4 @@ function useMotionTemplate(fragments, ...values) {
 }
 
 export { useMotionTemplate };
+//# sourceMappingURL=use-motion-template.mjs.map

package/dist/es/value/use-motion-template.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-motion-template.mjs","sources":["../../../src/value/use-motion-template.ts"],"sourcesContent":["\"use client\"\n\nimport { isMotionValue, MotionValue } from \"motion-dom\"\nimport { useCombineMotionValues } from \"./use-combine-values\"\n\n/**\n * Combine multiple motion values into a new one using a string template literal.\n *\n * ```jsx\n * import {\n *   motion,\n *   useSpring,\n *   useMotionValue,\n *   useMotionTemplate\n * } from \"framer-motion\"\n *\n * function Component() {\n *   const shadowX = useSpring(0)\n *   const shadowY = useMotionValue(0)\n *   const shadow = useMotionTemplate`drop-shadow(${shadowX}px ${shadowY}px 20px rgba(0,0,0,0.3))`\n *\n *   return <motion.div style={{ filter: shadow }} />\n * }\n * ```\n *\n * @public\n */\nexport function useMotionTemplate(\n    fragments: TemplateStringsArray,\n    ...values: Array<MotionValue | number | string>\n) {\n    /**\n     * Create a function that will build a string from the latest motion values.\n     */\n    const numFragments = fragments.length\n\n    function buildValue() {\n        let output = ``\n\n        for (let i = 0; i < numFragments; i++) {\n            output += fragments[i]\n            const value = values[i]\n            if (value) {\n                output += isMotionValue(value) ? value.get() : value\n            }\n        }\n\n        return output\n    }\n\n    return useCombineMotionValues(values.filter(isMotionValue), buildValue)\n}\n"],"names":[],"mappings":";;;;AAKA;;;;;;;;;;;;;;;;;;;;;AAqBG;;AAKC;;AAEG;AACH;AAEA;;AAGI;AACI;AACA;;AAEI;;;AAIR;;;AAIR;;"}

package/dist/es/value/use-motion-value.mjs

@@ -37,3 +37,4 @@ function useMotionValue(initial) {
 }
 
 export { useMotionValue };
+//# sourceMappingURL=use-motion-value.mjs.map

package/dist/es/value/use-motion-value.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-motion-value.mjs","sources":["../../../src/value/use-motion-value.ts"],"sourcesContent":["\"use client\"\n\nimport { motionValue, MotionValue } from \"motion-dom\"\nimport { useContext, useEffect, useState } from \"react\"\nimport { MotionConfigContext } from \"../context/MotionConfigContext\"\nimport { useConstant } from \"../utils/use-constant\"\n\n/**\n * Creates a `MotionValue` to track the state and velocity of a value.\n *\n * Usually, these are created automatically. For advanced use-cases, like use with `useTransform`, you can create `MotionValue`s externally and pass them into the animated component via the `style` prop.\n *\n * ```jsx\n * export const MyComponent = () => {\n *   const scale = useMotionValue(1)\n *\n *   return <motion.div style={{ scale }} />\n * }\n * ```\n *\n * @param initial - The initial state.\n *\n * @public\n */\nexport function useMotionValue<T>(initial: T): MotionValue<T> {\n    const value = useConstant(() => motionValue(initial))\n\n    /**\n     * If this motion value is being used in static mode, like on\n     * the Framer canvas, force components to rerender when the motion\n     * value is updated.\n     */\n    const { isStatic } = useContext(MotionConfigContext)\n    if (isStatic) {\n        const [, setLatest] = useState(initial)\n        useEffect(() => value.on(\"change\", setLatest), [])\n    }\n\n    return value\n}\n"],"names":[],"mappings":";;;;;;AAOA;;;;;;;;;;;;;;;;AAgBG;AACG;AACF;AAEA;;;;AAIG;;;;AAIC;;AAGJ;AACJ;;"}

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

@@ -60,3 +60,4 @@ function useScroll({ container, target, ...options } = {}) {
 }
 
 export { useScroll };
+//# sourceMappingURL=use-scroll.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"use-scroll.mjs","sources":["../../../src/value/use-scroll.ts"],"sourcesContent":["\"use client\"\n\nimport { motionValue } from \"motion-dom\"\nimport { invariant } from \"motion-utils\"\nimport { RefObject, useCallback, useEffect, useRef } from \"react\"\nimport { scroll } from \"../render/dom/scroll\"\nimport { ScrollInfoOptions } from \"../render/dom/scroll/types\"\nimport { useConstant } from \"../utils/use-constant\"\nimport { useIsomorphicLayoutEffect } from \"../utils/use-isomorphic-effect\"\n\nexport interface UseScrollOptions\n    extends Omit<ScrollInfoOptions, \"container\" | \"target\"> {\n    container?: RefObject<HTMLElement | null>\n    target?: RefObject<HTMLElement | null>\n}\n\nconst createScrollMotionValues = () => ({\n    scrollX: motionValue(0),\n    scrollY: motionValue(0),\n    scrollXProgress: motionValue(0),\n    scrollYProgress: motionValue(0),\n})\n\nconst isRefPending = (ref?: RefObject<HTMLElement | null>) => {\n    if (!ref) return false\n    return !ref.current\n}\n\nexport function useScroll({\n    container,\n    target,\n    ...options\n}: UseScrollOptions = {}) {\n    const values = useConstant(createScrollMotionValues)\n    const scrollAnimation = useRef<VoidFunction | null>(null)\n    const needsStart = useRef(false)\n\n    const start = useCallback(() => {\n        scrollAnimation.current = scroll(\n            (\n                _progress: number,\n                {\n                    x,\n                    y,\n                }: {\n                    x: { current: number; progress: number }\n                    y: { current: number; progress: number }\n                }\n            ) => {\n                values.scrollX.set(x.current)\n                values.scrollXProgress.set(x.progress)\n                values.scrollY.set(y.current)\n                values.scrollYProgress.set(y.progress)\n            },\n            {\n                ...options,\n                container: container?.current || undefined,\n                target: target?.current || undefined,\n            }\n        )\n\n        return () => {\n            scrollAnimation.current?.()\n        }\n    }, [container, target, JSON.stringify(options.offset)])\n\n    useIsomorphicLayoutEffect(() => {\n        needsStart.current = false\n\n        if (isRefPending(container) || isRefPending(target)) {\n            needsStart.current = true\n            return\n        } else {\n            return start()\n        }\n    }, [start])\n\n    useEffect(() => {\n        if (needsStart.current) {\n            invariant(\n                !isRefPending(container),\n                \"Container ref is defined but not hydrated\",\n                \"use-scroll-ref\"\n            )\n            invariant(\n                !isRefPending(target),\n                \"Target ref is defined but not hydrated\",\n                \"use-scroll-ref\"\n            )\n            return start()\n        } else {\n            return\n        }\n    }, [start])\n\n    return values\n}\n"],"names":[],"mappings":";;;;;;;;AAgBA;AACI;AACA;AACA;AACA;AACH;AAED;AACI;AAAU;AACV;AACJ;AAEM;AAKF;AACA;AACA;AAEA;AACI;;;;;AAeI;AAEI;AACA;AACA;AACH;AAGL;AACI;AACJ;AACJ;;AAGI;;AAGI;;;;;;AAKR;;AAGI;;;;;;;;AAeJ;AAEA;AACJ;;"}

package/dist/es/value/use-spring.mjs

@@ -20,3 +20,4 @@ function useSpring(source, options = {}) {
 }
 
 export { useSpring };
+//# sourceMappingURL=use-spring.mjs.map

package/dist/es/value/use-spring.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-spring.mjs","sources":["../../../src/value/use-spring.ts"],"sourcesContent":["\"use client\"\n\nimport {\n    AnyResolvedKeyframe,\n    attachSpring,\n    isMotionValue,\n    MotionValue,\n    SpringOptions,\n} from \"motion-dom\"\nimport { useContext, useInsertionEffect } from \"react\"\nimport { MotionConfigContext } from \"../context/MotionConfigContext\"\nimport { useMotionValue } from \"./use-motion-value\"\nimport { useTransform } from \"./use-transform\"\n\n/**\n * Creates a `MotionValue` that, when `set`, will use a spring animation to animate to its new state.\n *\n * It can either work as a stand-alone `MotionValue` by initialising it with a value, or as a subscriber\n * to another `MotionValue`.\n *\n * @remarks\n *\n * ```jsx\n * const x = useSpring(0, { stiffness: 300 })\n * const y = useSpring(x, { damping: 10 })\n * ```\n *\n * @param inputValue - `MotionValue` or number. If provided a `MotionValue`, when the input `MotionValue` changes, the created `MotionValue` will spring towards that value.\n * @param springConfig - Configuration options for the spring.\n * @returns `MotionValue`\n *\n * @public\n */\nexport function useSpring(\n    source: MotionValue<string>,\n    options?: SpringOptions\n): MotionValue<string>\nexport function useSpring(\n    source: string,\n    options?: SpringOptions\n): MotionValue<string>\nexport function useSpring(\n    source: MotionValue<number>,\n    options?: SpringOptions\n): MotionValue<number>\nexport function useSpring(\n    source: number,\n    options?: SpringOptions\n): MotionValue<number>\nexport function useSpring(\n    source: MotionValue<string> | MotionValue<number> | AnyResolvedKeyframe,\n    options: SpringOptions = {}\n) {\n    const { isStatic } = useContext(MotionConfigContext)\n    const getFromSource = () => (isMotionValue(source) ? source.get() : source)\n\n    // isStatic will never change, allowing early hooks return\n    if (isStatic) {\n        return useTransform(getFromSource)\n    }\n\n    const value = useMotionValue(getFromSource())\n\n    useInsertionEffect(() => {\n        return attachSpring(value, source, options)\n    }, [value, JSON.stringify(options)])\n\n    return value\n}\n"],"names":[],"mappings":";;;;;;;;;;;;AA0DQ;;AAGJ;;;AAIA;AAEA;AACJ;;"}

package/dist/es/value/use-time.mjs

@@ -9,3 +9,4 @@ function useTime() {
 }
 
 export { useTime };
+//# sourceMappingURL=use-time.mjs.map

package/dist/es/value/use-time.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-time.mjs","sources":["../../../src/value/use-time.ts"],"sourcesContent":["\"use client\"\n\nimport { useAnimationFrame } from \"../utils/use-animation-frame\"\nimport { useMotionValue } from \"./use-motion-value\"\n\nexport function useTime() {\n    const time = useMotionValue(0)\n    useAnimationFrame((t) => time.set(t))\n    return time\n}\n"],"names":[],"mappings":";;;;;AAMI;AACA;AACA;AACJ;;"}

package/dist/es/value/use-transform.mjs

@@ -28,3 +28,4 @@ function useListTransform(values, transformer) {
 }
 
 export { useTransform };
+//# sourceMappingURL=use-transform.mjs.map

package/dist/es/value/use-transform.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-transform.mjs","sources":["../../../src/value/use-transform.ts"],"sourcesContent":["\"use client\"\n\nimport {\n    AnyResolvedKeyframe,\n    MotionValue,\n    transform,\n    TransformOptions,\n} from \"motion-dom\"\nimport { useConstant } from \"../utils/use-constant\"\nimport { useCombineMotionValues } from \"./use-combine-values\"\nimport { useComputed } from \"./use-computed\"\n\nexport type InputRange = number[]\ntype SingleTransformer<I, O> = (input: I) => O\ntype MultiTransformer<I, O> = (input: I[]) => O\ntype Transformer<I, O> =\n    | SingleTransformer<I, O>\n    /**\n     * Ideally, this would be typed <I, O> in all instances, but to type this\n     * more accurately requires the tuple support in TypeScript 4:\n     * https://gist.github.com/InventingWithMonster/c4d23752a0fae7888596c4ff6d92733a\n     */\n    | MultiTransformer<AnyResolvedKeyframe, O>\n\n/**\n * Create a `MotionValue` that transforms the output of another `MotionValue` by mapping it from one range of values into another.\n *\n * @remarks\n *\n * Given an input range of `[-200, -100, 100, 200]` and an output range of\n * `[0, 1, 1, 0]`, the returned `MotionValue` will:\n *\n * - When provided a value between `-200` and `-100`, will return a value between `0` and  `1`.\n * - When provided a value between `-100` and `100`, will return `1`.\n * - When provided a value between `100` and `200`, will return a value between `1` and  `0`\n *\n *\n * The input range must be a linear series of numbers. The output range\n * can be any value type supported by Motion: numbers, colors, shadows, etc.\n *\n * Every value in the output range must be of the same type and in the same format.\n *\n * ```jsx\n * export const MyComponent = () => {\n *   const x = useMotionValue(0)\n *   const xRange = [-200, -100, 100, 200]\n *   const opacityRange = [0, 1, 1, 0]\n *   const opacity = useTransform(x, xRange, opacityRange)\n *\n *   return (\n *     <motion.div\n *       animate={{ x: 200 }}\n *       style={{ opacity, x }}\n *     />\n *   )\n * }\n * ```\n *\n * @param inputValue - `MotionValue`\n * @param inputRange - A linear series of numbers (either all increasing or decreasing)\n * @param outputRange - A series of numbers, colors or strings. Must be the same length as `inputRange`.\n * @param options -\n *\n *  - clamp: boolean. Clamp values to within the given range. Defaults to `true`\n *  - ease: EasingFunction[]. Easing functions to use on the interpolations between each value in the input and output ranges. If provided as an array, the array must be one item shorter than the input and output ranges, as the easings apply to the transition between each.\n *\n * @returns `MotionValue`\n *\n * @public\n */\nexport function useTransform<I, O>(\n    value: MotionValue<number>,\n    inputRange: InputRange,\n    outputRange: O[],\n    options?: TransformOptions<O>\n): MotionValue<O>\n\n/**\n * Create a `MotionValue` that transforms the output of another `MotionValue` through a function.\n * In this example, `y` will always be double `x`.\n *\n * ```jsx\n * export const MyComponent = () => {\n *   const x = useMotionValue(10)\n *   const y = useTransform(x, value => value * 2)\n *\n *   return <motion.div style={{ x, y }} />\n * }\n * ```\n *\n * @param input - A `MotionValue` that will pass its latest value through `transform` to update the returned `MotionValue`.\n * @param transform - A function that accepts the latest value from `input` and returns a new value.\n * @returns `MotionValue`\n *\n * @public\n */\nexport function useTransform<I, O>(\n    input: MotionValue<I>,\n    transformer: SingleTransformer<I, O>\n): MotionValue<O>\n\n/**\n * Pass an array of `MotionValue`s and a function to combine them. In this example, `z` will be the `x` multiplied by `y`.\n *\n * ```jsx\n * export const MyComponent = () => {\n *   const x = useMotionValue(0)\n *   const y = useMotionValue(0)\n *   const z = useTransform([x, y], ([latestX, latestY]) => latestX * latestY)\n *\n *   return <motion.div style={{ x, y, z }} />\n * }\n * ```\n *\n * @param input - An array of `MotionValue`s that will pass their latest values through `transform` to update the returned `MotionValue`.\n * @param transform - A function that accepts the latest values from `input` and returns a new value.\n * @returns `MotionValue`\n *\n * @public\n */\nexport function useTransform<I, O>(\n    input:\n        | MotionValue<string>[]\n        | MotionValue<number>[]\n        | MotionValue<AnyResolvedKeyframe>[],\n    transformer: MultiTransformer<I, O>\n): MotionValue<O>\nexport function useTransform<I, O>(transformer: () => O): MotionValue<O>\nexport function useTransform<I, O>(\n    input:\n        | MotionValue<I>\n        | MotionValue<string>[]\n        | MotionValue<number>[]\n        | MotionValue<AnyResolvedKeyframe>[]\n        | (() => O),\n    inputRangeOrTransformer?: InputRange | Transformer<I, O>,\n    outputRange?: O[],\n    options?: TransformOptions<O>\n): MotionValue<O> {\n    if (typeof input === \"function\") {\n        return useComputed(input)\n    }\n\n    const transformer =\n        typeof inputRangeOrTransformer === \"function\"\n            ? inputRangeOrTransformer\n            : transform(inputRangeOrTransformer!, outputRange!, options)\n\n    return Array.isArray(input)\n        ? useListTransform(\n              input,\n              transformer as MultiTransformer<AnyResolvedKeyframe, O>\n          )\n        : useListTransform([input], ([latest]) =>\n              (transformer as SingleTransformer<I, O>)(latest)\n          )\n}\n\nfunction useListTransform<I, O>(\n    values: MotionValue<I>[],\n    transformer: MultiTransformer<I, O>\n): MotionValue<O> {\n    const latest = useConstant<I[]>(() => [])\n\n    return useCombineMotionValues(values, () => {\n        latest.length = 0\n        const numValues = values.length\n        for (let i = 0; i < numValues; i++) {\n            latest[i] = values[i].get()\n        }\n\n        return transformer(latest)\n    })\n}\n"],"names":[],"mappings":";;;;;;AAgIM;AAWF;AACI;;AAGJ;AAEQ;;AAGR;AACI;AAIA;AAGR;AAEA;;AAMI;AACI;AACA;AACA;;;AAIA;AACJ;AACJ;;"}

package/dist/es/value/use-velocity.mjs

@@ -34,3 +34,4 @@ function useVelocity(value) {
 }
 
 export { useVelocity };
+//# sourceMappingURL=use-velocity.mjs.map

package/dist/es/value/use-velocity.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-velocity.mjs","sources":["../../../src/value/use-velocity.ts"],"sourcesContent":["\"use client\"\n\nimport { frame, MotionValue } from \"motion-dom\"\nimport { useMotionValueEvent } from \"../utils/use-motion-value-event\"\nimport { useMotionValue } from \"./use-motion-value\"\n/**\n * Creates a `MotionValue` that updates when the velocity of the provided `MotionValue` changes.\n *\n * ```javascript\n * const x = useMotionValue(0)\n * const xVelocity = useVelocity(x)\n * const xAcceleration = useVelocity(xVelocity)\n * ```\n *\n * @public\n */\nexport function useVelocity(value: MotionValue<number>): MotionValue<number> {\n    const velocity = useMotionValue(value.getVelocity())\n\n    const updateVelocity = () => {\n        const latest = value.getVelocity()\n        velocity.set(latest)\n\n        /**\n         * If we still have velocity, schedule an update for the next frame\n         * to keep checking until it is zero.\n         */\n        if (latest) frame.update(updateVelocity)\n    }\n\n    useMotionValueEvent(value, \"change\", () => {\n        // Schedule an update to this value at the end of the current frame.\n        frame.update(updateVelocity, false, true)\n    })\n\n    return velocity\n}\n"],"names":[],"mappings":";;;;;AAKA;;;;;;;;;;AAUG;AACG;;;AAIE;AACA;AAEA;;;AAGG;AACH;AAAY;AAChB;AAEA;;;AAGA;AAEA;AACJ;;"}

package/dist/es/value/use-will-change/WillChangeMotionValue.mjs

@@ -17,3 +17,4 @@ class WillChangeMotionValue extends MotionValue {
 }
 
 export { WillChangeMotionValue };
+//# sourceMappingURL=WillChangeMotionValue.mjs.map

package/dist/es/value/use-will-change/WillChangeMotionValue.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"WillChangeMotionValue.mjs","sources":["../../../../src/value/use-will-change/WillChangeMotionValue.ts"],"sourcesContent":["import { acceleratedValues, MotionValue, transformProps } from \"motion-dom\"\nimport { WillChange } from \"./types\"\n\nexport class WillChangeMotionValue\n    extends MotionValue<string>\n    implements WillChange\n{\n    private isEnabled = false\n\n    add(name: string) {\n        if (transformProps.has(name) || acceleratedValues.has(name)) {\n            this.isEnabled = true\n            this.update()\n        }\n    }\n\n    private update() {\n        this.set(this.isEnabled ? \"transform\" : \"auto\")\n    }\n}\n"],"names":[],"mappings":";;AAGM,MAAO,qBACT,SAAQ,WAAmB,CAAA;AAD/B,IAAA,WAAA,GAAA;;QAIY,IAAS,CAAA,SAAA,GAAG,KAAK,CAAA;KAY5B;AAVG,IAAA,GAAG,CAAC,IAAY,EAAA;AACZ,QAAA,IAAI,cAAc,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,iBAAiB,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;AACzD,YAAA,IAAI,CAAC,SAAS,GAAG,IAAI,CAAA;YACrB,IAAI,CAAC,MAAM,EAAE,CAAA;SAChB;KACJ;IAEO,MAAM,GAAA;AACV,QAAA,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,GAAG,WAAW,GAAG,MAAM,CAAC,CAAA;KAClD;AACJ;;;;"}

package/dist/es/value/use-will-change/add-will-change.mjs

@@ -18,3 +18,4 @@ function addValueToWillChange(visualElement, key) {
 }
 
 export { addValueToWillChange };
+//# sourceMappingURL=add-will-change.mjs.map

package/dist/es/value/use-will-change/add-will-change.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"add-will-change.mjs","sources":["../../../../src/value/use-will-change/add-will-change.ts"],"sourcesContent":["import { MotionGlobalConfig } from \"motion-utils\"\nimport type { VisualElement } from \"../../render/VisualElement\"\nimport { isWillChangeMotionValue } from \"./is\"\n\nexport function addValueToWillChange(\n    visualElement: VisualElement,\n    key: string\n) {\n    const willChange = visualElement.getValue(\"willChange\")\n\n    /**\n     * It could be that a user has set willChange to a regular MotionValue,\n     * in which case we can't add the value to it.\n     */\n    if (isWillChangeMotionValue(willChange)) {\n        return willChange.add(key)\n    } else if (!willChange && MotionGlobalConfig.WillChange) {\n        const newWillChange = new MotionGlobalConfig.WillChange(\"auto\")\n\n        visualElement.addValue(\"willChange\", newWillChange)\n        newWillChange.add(key)\n    }\n}\n"],"names":[],"mappings":";;;AAIgB,SAAA,oBAAoB,CAChC,aAA4B,EAC5B,GAAW,EAAA;IAEX,MAAM,UAAU,GAAG,aAAa,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAA;AAEvD;;;AAGG;AACH,IAAA,IAAI,uBAAuB,CAAC,UAAU,CAAC,EAAE;AACrC,QAAA,OAAO,UAAU,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;KAC7B;AAAM,SAAA,IAAI,CAAC,UAAU,IAAI,kBAAkB,CAAC,UAAU,EAAE;QACrD,MAAM,aAAa,GAAG,IAAI,kBAAkB,CAAC,UAAU,CAAC,MAAM,CAAC,CAAA;AAE/D,QAAA,aAAa,CAAC,QAAQ,CAAC,YAAY,EAAE,aAAa,CAAC,CAAA;AACnD,QAAA,aAAa,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;KACzB;AACL;;;;"}

package/dist/es/value/use-will-change/index.mjs

@@ -7,3 +7,4 @@ function useWillChange() {
 }
 
 export { useWillChange };
+//# sourceMappingURL=index.mjs.map

package/dist/es/value/use-will-change/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../../src/value/use-will-change/index.ts"],"sourcesContent":["\"use client\"\n\nimport { useConstant } from \"../../utils/use-constant\"\nimport { WillChangeMotionValue } from \"./WillChangeMotionValue\"\nimport { WillChange } from \"./types\"\n\nexport function useWillChange(): WillChange {\n    return useConstant(() => new WillChangeMotionValue(\"auto\"))\n}\n"],"names":[],"mappings":";;;;;;AAQA;;"}

package/dist/es/value/use-will-change/is.mjs

@@ -5,3 +5,4 @@ function isWillChangeMotionValue(value) {
 }
 
 export { isWillChangeMotionValue };
+//# sourceMappingURL=is.mjs.map

package/dist/es/value/use-will-change/is.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"is.mjs","sources":["../../../../src/value/use-will-change/is.ts"],"sourcesContent":["import { isMotionValue } from \"motion-dom\"\nimport { WillChange } from \"./types\"\n\nexport function isWillChangeMotionValue(value: any): value is WillChange {\n    return Boolean(isMotionValue(value) && (value as WillChange).add)\n}\n"],"names":[],"mappings":";;AAGM,SAAU,uBAAuB,CAAC,KAAU,EAAA;IAC9C,OAAO,OAAO,CAAC,aAAa,CAAC,KAAK,CAAC,IAAK,KAAoB,CAAC,GAAG,CAAC,CAAA;AACrE;;;;"}

package/dist/es/value/utils/resolve-motion-value.mjs

@@ -10,3 +10,4 @@ function resolveMotionValue(value) {
 }
 
 export { resolveMotionValue };
+//# sourceMappingURL=resolve-motion-value.mjs.map

package/dist/es/value/utils/resolve-motion-value.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolve-motion-value.mjs","sources":["../../../../src/value/utils/resolve-motion-value.ts"],"sourcesContent":["import { AnyResolvedKeyframe, isMotionValue, MotionValue } from \"motion-dom\"\n\n/**\n * If the provided value is a MotionValue, this returns the actual value, otherwise just the value itself\n *\n * TODO: Remove and move to library\n */\nexport function resolveMotionValue(\n    value?: AnyResolvedKeyframe | MotionValue\n): AnyResolvedKeyframe {\n    return isMotionValue(value) ? value.get() : value\n}\n"],"names":[],"mappings":";;AAEA;;;;AAIG;AACG,SAAU,kBAAkB,CAC9B,KAAyC,EAAA;AAEzC,IAAA,OAAO,aAAa,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,EAAE,GAAG,KAAK,CAAA;AACrD;;;;"}

package/dist/framer-motion.dev.js

@@ -119,7 +119,8 @@
 
     exports.warning = () => { };
     exports.invariant = () => { };
-    {
+    if (typeof process !== "undefined" &&
+        process.env?.NODE_ENV !== "production") {
         exports.warning = (check, message, errorCode) => {
             if (!check && typeof console !== "undefined") {
                 console.warn(formatErrorMessage(message, errorCode));
@@ -605,6 +606,17 @@
         return singleCssVariableRegex.test(value.split("/*")[0].trim());
     };
     const singleCssVariableRegex = /var\(--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*\))*\))+\s*)\)$/iu;
+    /**
+     * Check if a value contains a CSS variable anywhere (e.g. inside calc()).
+     * Unlike isCSSVariableToken which checks if the value IS a var() token,
+     * this checks if the value CONTAINS var() somewhere in the string.
+     */
+    function containsCSSVariable(value) {
+        if (typeof value !== "string")
+            return false;
+        // Strip comments to avoid false positives
+        return value.split("/*")[0].includes("var(--");
+    }
 
     const number = {
         test: (v) => typeof v === "number",
@@ -2608,7 +2620,7 @@
         /**
          * WAAPI doesn't natively have any interruption capabilities.
          *
-         * Rather than read commited styles back out of the DOM, we can
+         * Rather than read committed styles back out of the DOM, we can
          * create a renderless JS animation and sample it twice to calculate
          * its current value, "previous" value, and therefore allow
          * Motion to calculate velocity for any subsequent animation.
@@ -2804,7 +2816,7 @@
              * progress, which would feel snappier.
              *
              * However, if there's a delay (main thread work) between the creation of
-             * the animation and the first commited frame, we prefer to use resolvedAt
+             * the animation and the first committed frame, we prefer to use resolvedAt
              * to avoid a sudden jump into the animation.
              */
             const startTime = sync
@@ -3306,6 +3318,16 @@
             const [origin, target] = unresolvedKeyframes;
             const originType = findDimensionValueType(origin);
             const targetType = findDimensionValueType(target);
+            /**
+             * If one keyframe contains embedded CSS variables (e.g. in calc()) and the other
+             * doesn't, we need to measure to convert to pixels. This handles GitHub issue #3410.
+             */
+            const originHasVar = containsCSSVariable(origin);
+            const targetHasVar = containsCSSVariable(target);
+            if (originHasVar !== targetHasVar && positionalValues[name]) {
+                this.needsMeasurement = true;
+                return;
+            }
             /**
              * Either we don't recognise these value types or we can animate between them.
              */
@@ -5981,7 +6003,7 @@
                 });
             }
             if (delta) {
-                // Incoporate each ancestor's scale into a culmulative treeScale for this component
+                // Incoporate each ancestor's scale into a cumulative treeScale for this component
                 treeScale.x *= delta.x.scale;
                 treeScale.y *= delta.y.scale;
                 // Apply each ancestor's calculated delta into this component's recorded layout box
@@ -6707,7 +6729,7 @@
                             /**
                              * If the layout hasn't changed and we have an animation that hasn't started yet,
                              * finish it immediately. Otherwise it will be animating from a location
-                             * that was probably never commited to screen and look like a jumpy box.
+                             * that was probably never committed to screen and look like a jumpy box.
                              */
                             if (!hasLayoutChanged) {
                                 finishAnimation(this);
@@ -14220,6 +14242,7 @@
     exports.collectMotionValues = collectMotionValues;
     exports.color = color;
     exports.complex = complex;
+    exports.containsCSSVariable = containsCSSVariable;
     exports.convertOffsetToTimes = convertOffsetToTimes;
     exports.createBox = createBox;
     exports.createGeneratorEasing = createGeneratorEasing;