@mantine/core
Version:
React components library focused on usability, accessibility and developer experience
58 lines (57 loc) • 2.71 kB
JavaScript
"use client";
const require_Mantine_context = require("../../core/MantineProvider/Mantine.context.cjs");
const require_get_transition_styles = require("./get-transition-styles/get-transition-styles.cjs");
const require_use_transition = require("./use-transition.cjs");
let react = require("react");
let react_jsx_runtime = require("react/jsx-runtime");
//#region packages/@mantine/core/src/components/Transition/Transition.tsx
function Transition({ keepMounted, keepMountedMode = "activity", transition = "fade", duration = 250, exitDuration = duration, mounted, children, timingFunction = "ease", onExit, onEntered, onEnter, onExited, enterDelay, exitDelay }) {
const env = require_Mantine_context.useMantineEnv();
const { transitionDuration, transitionStatus, transitionTimingFunction } = require_use_transition.useTransition({
mounted,
exitDuration,
duration,
timingFunction,
onExit,
onEntered,
onEnter,
onExited,
enterDelay,
exitDelay
});
if (env === "test") return mounted ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: children({}) }) : keepMounted ? children({ display: "none" }) : null;
if (transitionDuration === 0) {
if (keepMounted) {
if (keepMountedMode === "display-none") return mounted ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: children({}) }) : children({ display: "none" });
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Activity, {
mode: mounted ? "visible" : "hidden",
children: children({})
});
}
return mounted ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: children({}) }) : null;
}
const isExited = transitionStatus === "exited";
if (keepMounted) {
const keepMountedChildren = children(isExited ? keepMountedMode === "display-none" ? { display: "none" } : {} : require_get_transition_styles.getTransitionStyles({
transition,
duration: transitionDuration,
state: transitionStatus,
timingFunction: transitionTimingFunction
}));
if (keepMountedMode === "display-none") return keepMountedChildren;
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Activity, {
mode: isExited ? "hidden" : "visible",
children: keepMountedChildren
});
}
return isExited ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: children(require_get_transition_styles.getTransitionStyles({
transition,
duration: transitionDuration,
state: transitionStatus,
timingFunction: transitionTimingFunction
})) });
}
Transition.displayName = "@mantine/core/Transition";
//#endregion
exports.Transition = Transition;
//# sourceMappingURL=Transition.cjs.map