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

A simple and powerful JavaScript animation library

{"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;;"}