UNPKG

@mantine/core

Version:

React components library focused on usability, accessibility and developer experience

51 lines (50 loc) 1.97 kB
"use client"; import { useMantineEnv } from "../../core/MantineProvider/Mantine.context.mjs"; import { getTransitionStyles } from "./get-transition-styles/get-transition-styles.mjs"; import { useTransition } from "./use-transition.mjs"; import { Activity } from "react"; import { Fragment as Fragment$1, jsx } from "react/jsx-runtime"; //#region packages/@mantine/core/src/components/Transition/Transition.tsx function Transition({ keepMounted, transition = "fade", duration = 250, exitDuration = duration, mounted, children, timingFunction = "ease", onExit, onEntered, onEnter, onExited, enterDelay, exitDelay }) { const env = useMantineEnv(); const { transitionDuration, transitionStatus, transitionTimingFunction } = useTransition({ mounted, exitDuration, duration, timingFunction, onExit, onEntered, onEnter, onExited, enterDelay, exitDelay }); if (env === "test") return mounted ? /* @__PURE__ */ jsx(Fragment$1, { children: children({}) }) : keepMounted ? children({ display: "none" }) : null; if (transitionDuration === 0) { if (keepMounted) return /* @__PURE__ */ jsx(Activity, { mode: mounted ? "visible" : "hidden", children: children({}) }); return mounted ? /* @__PURE__ */ jsx(Fragment$1, { children: children({}) }) : null; } const isExited = transitionStatus === "exited"; if (keepMounted) return /* @__PURE__ */ jsx(Activity, { mode: isExited ? "hidden" : "visible", children: children(isExited ? {} : getTransitionStyles({ transition, duration: transitionDuration, state: transitionStatus, timingFunction: transitionTimingFunction })) }); return isExited ? null : /* @__PURE__ */ jsx(Fragment$1, { children: children(getTransitionStyles({ transition, duration: transitionDuration, state: transitionStatus, timingFunction: transitionTimingFunction })) }); } Transition.displayName = "@mantine/core/Transition"; //#endregion export { Transition }; //# sourceMappingURL=Transition.mjs.map