@yamada-ui/react
Version:
React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion
1 lines • 4.99 kB
Source Map (JSON)
{"version":3,"file":"slide-fade.cjs","names":["slideFadeVariants: Variants","createTransition","createComponent","slideFadeStyle","AnimatePresence","motion"],"sources":["../../../../src/components/slide-fade/slide-fade.tsx"],"sourcesContent":["\"use client\"\n\nimport type { Variants } from \"motion/react\"\nimport type { ThemeProps } from \"../../core\"\nimport type {\n HTMLMotionProps,\n MotionTransitionVariants,\n WithTransitionProps,\n} from \"../motion\"\nimport type { SlideFadeStyle } from \"./slide-fade.style\"\nimport { AnimatePresence } from \"motion/react\"\nimport { useMemo } from \"react\"\nimport { createComponent } from \"../../core\"\nimport { createTransition, motion } from \"../motion\"\nimport { slideFadeStyle } from \"./slide-fade.style\"\n\nexport const slideFadeVariants: Variants = {\n enter: ({ delay, duration, enter, transition, transitionEnd } = {}) => ({\n opacity: 1,\n transition: createTransition.enter(transition?.enter)(delay, duration),\n transitionEnd: transitionEnd?.enter,\n x: 0,\n y: 0,\n ...enter,\n }),\n exit: ({\n delay,\n duration,\n exit,\n offsetX,\n offsetY,\n reverse,\n transition,\n transitionEnd,\n } = {}) => ({\n opacity: 0,\n transition: createTransition.exit(transition?.exit)(delay, duration),\n ...(reverse\n ? { transitionEnd: transitionEnd?.exit, x: offsetX, y: offsetY }\n : { transitionEnd: { x: offsetX, y: offsetY, ...transitionEnd?.exit } }),\n ...exit,\n }),\n initial: ({\n delay,\n duration,\n initial,\n offsetX,\n offsetY,\n transition,\n transitionEnd,\n }) => ({\n opacity: 0,\n transition: createTransition.exit(transition?.exit)(delay, duration),\n transitionEnd: transitionEnd?.exit,\n x: offsetX,\n y: offsetY,\n ...initial,\n }),\n} satisfies MotionTransitionVariants\n\nexport interface SlideFadeProps\n extends WithTransitionProps<HTMLMotionProps>,\n ThemeProps<SlideFadeStyle> {\n /**\n * The offset on the horizontal or `x` axis.\n *\n * @default 0\n */\n offsetX?: number | string\n /**\n * The offset on the vertical or `y` axis.\n *\n * @default 8\n */\n offsetY?: number | string\n /**\n * If `true`, the element will be transitioned back to the offset when it leaves. Otherwise, it'll only fade out.\n *\n * @default true\n */\n reverse?: boolean\n}\n\nconst {\n PropsContext: SlideFadePropsContext,\n usePropsContext: useSlideFadePropsContext,\n withContext,\n} = createComponent<SlideFadeProps, SlideFadeStyle>(\n \"slide-fade\",\n slideFadeStyle,\n)\n\nexport { SlideFadePropsContext, useSlideFadePropsContext }\n\n/**\n * `SlideFade` is a component that gradually shows or hides an element while moving it from a specified position.\n *\n * @see https://yamada-ui.com/docs/components/slide-fade\n */\nexport const SlideFade = withContext<\"div\", SlideFadeProps>(\n ({\n delay,\n duration,\n offsetX = 0,\n offsetY = 8,\n open: openProp,\n reverse = true,\n transition,\n transitionEnd,\n unmountOnExit,\n ...rest\n }) => {\n const animate = openProp || unmountOnExit ? \"enter\" : \"exit\"\n const open = unmountOnExit ? openProp && unmountOnExit : true\n\n const custom = useMemo(\n () => ({\n delay,\n duration,\n offsetX,\n offsetY,\n reverse,\n transition,\n transitionEnd,\n }),\n [delay, duration, offsetX, offsetY, reverse, transition, transitionEnd],\n )\n\n return (\n <AnimatePresence custom={custom}>\n {open ? (\n <motion.div\n animate={animate}\n custom={custom}\n exit=\"exit\"\n initial=\"exit\"\n variants={slideFadeVariants}\n {...rest}\n />\n ) : null}\n </AnimatePresence>\n )\n },\n)()\n"],"mappings":";;;;;;;;;;;;;;;;AAgBA,MAAaA,oBAA8B;CACzC,QAAQ,EAAE,OAAO,UAAU,OAAO,YAAY,kBAAkB,EAAE,MAAM;EACtE,SAAS;EACT,YAAYC,oCAAiB,MAAM,YAAY,MAAM,CAAC,OAAO,SAAS;EACtE,eAAe,eAAe;EAC9B,GAAG;EACH,GAAG;EACH,GAAG;EACJ;CACD,OAAO,EACL,OACA,UACA,MACA,SACA,SACA,SACA,YACA,kBACE,EAAE,MAAM;EACV,SAAS;EACT,YAAYA,oCAAiB,KAAK,YAAY,KAAK,CAAC,OAAO,SAAS;EACpE,GAAI,UACA;GAAE,eAAe,eAAe;GAAM,GAAG;GAAS,GAAG;GAAS,GAC9D,EAAE,eAAe;GAAE,GAAG;GAAS,GAAG;GAAS,GAAG,eAAe;GAAM,EAAE;EACzE,GAAG;EACJ;CACD,UAAU,EACR,OACA,UACA,SACA,SACA,SACA,YACA,qBACK;EACL,SAAS;EACT,YAAYA,oCAAiB,KAAK,YAAY,KAAK,CAAC,OAAO,SAAS;EACpE,eAAe,eAAe;EAC9B,GAAG;EACH,GAAG;EACH,GAAG;EACJ;CACF;AAyBD,MAAM,EACJ,cAAc,uBACd,iBAAiB,0BACjB,gBACEC,yCACF,cACAC,wCACD;;;;;;AASD,MAAa,YAAY,aACtB,EACC,OACA,UACA,UAAU,GACV,UAAU,GACV,MAAM,UACN,UAAU,MACV,YACA,eACA,cACA,GAAG,WACC;CACJ,MAAM,UAAU,YAAY,gBAAgB,UAAU;CACtD,MAAM,OAAO,gBAAgB,YAAY,gBAAgB;CAEzD,MAAM,mCACG;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACD,GACD;EAAC;EAAO;EAAU;EAAS;EAAS;EAAS;EAAY;EAAc,CACxE;AAED,QACE,2CAACC;EAAwB;YACtB,OACC,2CAACC,uBAAO;GACG;GACD;GACR,MAAK;GACL,SAAQ;GACR,UAAU;GACV,GAAI;IACJ,GACA;GACY;EAGvB,EAAE"}