Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 | 32x 32x 32x 32x 32x 32x 194x 193x 193x 193x 193x 193x 193x 167x 193x | import * as React from "react" import { useContext, useMemo } from "react" import { MotionConfigContext } from "../../context/MotionConfigContext" import { loadExternalIsValidProp, IsValidProp, } from "../../render/dom/utils/filter-props" import { useConstant } from "../../utils/use-constant" export interface MotionConfigProps extends Partial<MotionConfigContext> { children?: React.ReactNode isValidProp?: IsValidProp } /** * `MotionConfig` is used to set configuration options for all children `motion` components. * * ```jsx * import { motion, MotionConfig } from "framer-motion" * * export function App() { * return ( * <MotionConfig transition={{ type: "spring" }}> * <motion.div animate={{ x: 100 }} /> * </MotionConfig> * ) * } * ``` * * @public */ export function MotionConfig({ children, isValidProp, ...config }: MotionConfigProps) { isValidProp && loadExternalIsValidProp(isValidProp) /** * Inherit props from any parent MotionConfig components */ config = { ...useContext(MotionConfigContext), ...config } /** * Don't allow isStatic to change between renders as it affects how many hooks * motion components fire. */ config.isStatic = useConstant(() => config.isStatic) /** * 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. */ const context = useMemo( () => config, [JSON.stringify(config.transition), config.transformPagePoint] ) return ( <MotionConfigContext.Provider value={context as MotionConfigContext}> {children} </MotionConfigContext.Provider> ) } |