@yamada-ui/react/dist/cjs/components/collapse/collapse.cjs.map

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

{"version":3,"file":"collapse.cjs","names":["variants: Variants","createTransition","createComponent","collapseStyle","AnimatePresence","motion"],"sources":["../../../../src/components/collapse/collapse.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 { CollapseStyle } from \"./collapse.style\"\nimport { AnimatePresence } from \"motion/react\"\nimport { useEffect, useMemo, useState } from \"react\"\nimport { createComponent } from \"../../core\"\nimport { createdDom, isNumeric } from \"../../utils\"\nimport { createTransition, motion } from \"../motion\"\nimport { collapseStyle } from \"./collapse.style\"\n\nconst variants: Variants = {\n  enter: ({\n    animationOpacity,\n    delay,\n    duration,\n    endingHeight: height,\n    enter,\n    transition,\n    transitionEnd,\n  } = {}) => ({\n    ...(animationOpacity ? { opacity: 1 } : {}),\n    height,\n    transition: createTransition.enter(transition?.enter)(delay, duration),\n    transitionEnd: transitionEnd?.enter,\n    ...enter,\n  }),\n  exit: ({\n    animationOpacity,\n    delay,\n    duration,\n    exit,\n    startingHeight: height,\n    transition,\n    transitionEnd,\n  } = {}) => ({\n    ...(animationOpacity ? { opacity: isNumeric(height) ? 1 : 0 } : {}),\n    height,\n    transition: createTransition.exit(transition?.exit)(delay, duration),\n    transitionEnd: transitionEnd?.exit,\n    ...exit,\n  }),\n} satisfies MotionTransitionVariants\n\nexport interface CollapseProps\n  extends WithTransitionProps<HTMLMotionProps>,\n    ThemeProps<CollapseStyle> {\n  /**\n   * If `true`, the opacity of the content will be animated.\n   *\n   * @default true\n   */\n  animationOpacity?: boolean\n  /**\n   * The height you want the content in its expanded state.\n   *\n   * @default 'auto'\n   */\n  endingHeight?: number | string\n  /**\n   * The height you want the content in its collapsed state.\n   *\n   * @default 0\n   */\n  startingHeight?: number | string\n}\n\nconst {\n  PropsContext: CollapsePropsContext,\n  usePropsContext: useCollapsePropsContext,\n  withContext,\n} = createComponent<CollapseProps, CollapseStyle>(\"collapse\", collapseStyle)\n\nexport { CollapsePropsContext, useCollapsePropsContext }\n\n/**\n * `Collapse` is a component that allows you to expand or collapse an element for display.\n *\n * @see https://yamada-ui.com/docs/components/collapse\n */\nexport const Collapse = withContext<\"div\", CollapseProps>(\n  ({\n    style,\n    animationOpacity = true,\n    delay,\n    duration,\n    endingHeight = \"auto\",\n    open: openProp,\n    startingHeight = 0,\n    transition: transitionProp,\n    transitionEnd,\n    unmountOnExit,\n    ...rest\n  }) => {\n    const [mounted, setMounted] = useState(false)\n    const animate = openProp || unmountOnExit ? \"enter\" : \"exit\"\n    const open = unmountOnExit ? openProp : true\n\n    const transition = useMemo(() => {\n      if (!mounted) {\n        return { enter: { duration: 0 } }\n      } else if (transitionProp) {\n        return transitionProp\n      } else {\n        return {\n          enter: {\n            height: {\n              duration: duration ?? 0.3,\n              ease: [0.25, 0.1, 0.25, 1],\n            },\n            opacity: {\n              duration: duration ?? 0.4,\n              ease: [0.25, 0.1, 0.25, 1],\n            },\n          },\n          exit: {\n            height: {\n              duration: duration ?? 0.3,\n              ease: [0.25, 0.1, 0.25, 1],\n            },\n            opacity: {\n              duration: duration ?? 0.4,\n              ease: [0.25, 0.1, 0.25, 1],\n            },\n          },\n        }\n      }\n    }, [mounted, duration, transitionProp])\n\n    const custom = useMemo(\n      () => ({\n        animationOpacity,\n        delay,\n        duration,\n        endingHeight,\n        startingHeight,\n        transition,\n        transitionEnd,\n      }),\n      [\n        animationOpacity,\n        delay,\n        duration,\n        endingHeight,\n        startingHeight,\n        transition,\n        transitionEnd,\n      ],\n    )\n\n    useEffect(() => {\n      if (createdDom()) setMounted(true)\n    }, [])\n\n    return (\n      <AnimatePresence custom={custom} initial={false}>\n        {open ? (\n          <motion.div\n            style={{ overflow: \"hidden\", ...style }}\n            animate={animate}\n            custom={custom}\n            exit=\"exit\"\n            initial={unmountOnExit ? \"exit\" : false}\n            variants={variants}\n            {...rest}\n          />\n        ) : null}\n      </AnimatePresence>\n    )\n  },\n)()\n"],"mappings":";;;;;;;;;;;;;;;;;AAiBA,MAAMA,WAAqB;CACzB,QAAQ,EACN,kBACA,OACA,UACA,cAAc,QACd,OACA,YACA,kBACE,EAAE,MAAM;EACV,GAAI,mBAAmB,EAAE,SAAS,GAAG,GAAG,EAAE;EAC1C;EACA,YAAYC,oCAAiB,MAAM,YAAY,MAAM,CAAC,OAAO,SAAS;EACtE,eAAe,eAAe;EAC9B,GAAG;EACJ;CACD,OAAO,EACL,kBACA,OACA,UACA,MACA,gBAAgB,QAChB,YACA,kBACE,EAAE,MAAM;EACV,GAAI,mBAAmB,EAAE,0DAAmB,OAAO,GAAG,IAAI,GAAG,GAAG,EAAE;EAClE;EACA,YAAYA,oCAAiB,KAAK,YAAY,KAAK,CAAC,OAAO,SAAS;EACpE,eAAe,eAAe;EAC9B,GAAG;EACJ;CACF;AAyBD,MAAM,EACJ,cAAc,sBACd,iBAAiB,yBACjB,gBACEC,yCAA8C,YAAYC,qCAAc;;;;;;AAS5E,MAAa,WAAW,aACrB,EACC,OACA,mBAAmB,MACnB,OACA,UACA,eAAe,QACf,MAAM,UACN,iBAAiB,GACjB,YAAY,gBACZ,eACA,cACA,GAAG,WACC;CACJ,MAAM,CAAC,SAAS,kCAAuB,MAAM;CAC7C,MAAM,UAAU,YAAY,gBAAgB,UAAU;CACtD,MAAM,OAAO,gBAAgB,WAAW;CAExC,MAAM,sCAA2B;AAC/B,MAAI,CAAC,QACH,QAAO,EAAE,OAAO,EAAE,UAAU,GAAG,EAAE;WACxB,eACT,QAAO;MAEP,QAAO;GACL,OAAO;IACL,QAAQ;KACN,UAAU,YAAY;KACtB,MAAM;MAAC;MAAM;MAAK;MAAM;MAAE;KAC3B;IACD,SAAS;KACP,UAAU,YAAY;KACtB,MAAM;MAAC;MAAM;MAAK;MAAM;MAAE;KAC3B;IACF;GACD,MAAM;IACJ,QAAQ;KACN,UAAU,YAAY;KACtB,MAAM;MAAC;MAAM;MAAK;MAAM;MAAE;KAC3B;IACD,SAAS;KACP,UAAU,YAAY;KACtB,MAAM;MAAC;MAAM;MAAK;MAAM;MAAE;KAC3B;IACF;GACF;IAEF;EAAC;EAAS;EAAU;EAAe,CAAC;CAEvC,MAAM,mCACG;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACD,GACD;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;AAED,4BAAgB;AACd,yDAAgB,CAAE,YAAW,KAAK;IACjC,EAAE,CAAC;AAEN,QACE,2CAACC;EAAwB;EAAQ,SAAS;YACvC,OACC,2CAACC,uBAAO;GACN,OAAO;IAAE,UAAU;IAAU,GAAG;IAAO;GAC9B;GACD;GACR,MAAK;GACL,SAAS,gBAAgB,SAAS;GACxB;GACV,GAAI;IACJ,GACA;GACY;EAGvB,EAAE"}