UNPKG

@yamada-ui/transitions

Version:

Yamada UI transitions components

131 lines (130 loc) 4.08 kB
"use client" "use strict"; var __defProp = Object.defineProperty; var __getOwnPropDesc = Object.getOwnPropertyDescriptor; var __getOwnPropNames = Object.getOwnPropertyNames; var __hasOwnProp = Object.prototype.hasOwnProperty; var __export = (target, all) => { for (var name in all) __defProp(target, name, { get: all[name], enumerable: true }); }; var __copyProps = (to, from, except, desc) => { if (from && typeof from === "object" || typeof from === "function") { for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); } return to; }; var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); // src/slide-fade.tsx var slide_fade_exports = {}; __export(slide_fade_exports, { SlideFade: () => SlideFade, slideFadeProps: () => slideFadeProps }); module.exports = __toCommonJS(slide_fade_exports); var import_core = require("@yamada-ui/core"); var import_motion = require("@yamada-ui/motion"); var import_use_value = require("@yamada-ui/use-value"); var import_utils = require("@yamada-ui/utils"); var import_jsx_runtime = require("react/jsx-runtime"); var variants = { enter: ({ delay, duration, enter, transition, transitionEnd } = {}) => ({ opacity: 1, transition: (0, import_motion.transitionEnter)(transition == null ? void 0 : transition.enter)(delay, duration), transitionEnd: transitionEnd == null ? void 0 : transitionEnd.enter, x: 0, y: 0, ...enter }), exit: ({ delay, duration, exit, offsetX, offsetY, reverse, transition, transitionEnd } = {}) => ({ opacity: 0, transition: (0, import_motion.transitionExit)(transition == null ? void 0 : transition.exit)(delay, duration), ...reverse ? { transitionEnd: transitionEnd == null ? void 0 : transitionEnd.exit, x: offsetX, y: offsetY } : { transitionEnd: { x: offsetX, y: offsetY, ...transitionEnd == null ? void 0 : transitionEnd.exit } }, ...exit }), initial: ({ delay, duration, initial, offsetX, offsetY, transition, transitionEnd }) => ({ opacity: 0, transition: (0, import_motion.transitionExit)(transition == null ? void 0 : transition.exit)(delay, duration), transitionEnd: transitionEnd == null ? void 0 : transitionEnd.exit, x: offsetX, y: offsetY, ...initial }) }; var slideFadeProps = { animate: "enter", exit: "exit", initial: "exit", variants }; var SlideFade = (0, import_motion.motionForwardRef)( (props, ref) => { const [style, mergedProps] = (0, import_core.useComponentStyle)("SlideFade", props); const { className, delay, duration, isOpen, offsetX: _offsetX, offsetY: _offsetY, open = isOpen, reverse, transition, transitionEnd, unmountOnExit, ...rest } = (0, import_core.omitThemeProps)(mergedProps); const animate = open || unmountOnExit ? "enter" : "exit"; const offsetX = (0, import_use_value.useValue)(_offsetX); const offsetY = (0, import_use_value.useValue)(_offsetY); const custom = { delay, duration, offsetX, offsetY, reverse, transition, transitionEnd }; const resolvedOpen = unmountOnExit ? open && unmountOnExit : true; return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_motion.AnimatePresence, { custom, children: resolvedOpen ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)( import_motion.motion.div, { ref, className: (0, import_utils.cx)("ui-slide-fade", className), custom, ...slideFadeProps, animate, __css: style, ...rest } ) : null }); } ); SlideFade.displayName = "SlideFade"; SlideFade.__ui__ = "SlideFade"; // Annotate the CommonJS export names for ESM import in node: 0 && (module.exports = { SlideFade, slideFadeProps }); //# sourceMappingURL=slide-fade.js.map