@bifrostui/react 1.5.1 → 1.5.2

package/dist/DatePicker/DatePicker.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { DatePickerProps } from './DatePicker.types';
-declare const DatePicker: React.ForwardRefExoticComponent<Omit<DatePickerProps<"div", Omit<import("../Picker").PickerProps<"div", import("..").DrawerProps>, "value" | "defaultValue" | "onChange" | "onClose" | "onConfirm">>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DatePicker: React.ForwardRefExoticComponent<Omit<DatePickerProps<"div", Omit<import("../Picker").PickerProps<"div", import("..").DrawerProps>, "defaultValue" | "onChange" | "value" | "onClose" | "onConfirm">>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export default DatePicker;

package/dist/Fade/Fade.miniapp.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Fade Animation Component
+ * @description A component that implements fade in/out animation effects for elements
+ * @component Fade
+ */
+import React from 'react';
+import type { FadeProps } from './Fade.types';
+import './index.less';
+declare const Fade: React.ForwardRefExoticComponent<FadeProps & React.RefAttributes<HTMLElement>>;
+export default Fade;

package/dist/Fade/Fade.miniapp.js

@@ -0,0 +1,199 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Fade_miniapp_exports = {};
+__export(Fade_miniapp_exports, {
+  default: () => Fade_miniapp_default
+});
+module.exports = __toCommonJS(Fade_miniapp_exports);
+var import_react = __toESM(require("react"));
+var import_utils = require("@bifrostui/utils");
+var import_index = require("./index.css");
+const defaultEasing = {
+  enter: import_utils.easing.easeOut,
+  exit: import_utils.easing.sharp
+};
+const defaultTimeout = {
+  enter: import_utils.duration.enteringScreen,
+  exit: import_utils.duration.leavingScreen
+};
+const Fade = /* @__PURE__ */ import_react.default.forwardRef((props, ref) => {
+  var _b;
+  const _a = props, {
+    children: children,
+    in: inProp,
+    style,
+    appear: appear = true,
+    enter = true,
+    exit = true,
+    delay = 0,
+    easing: easingProp = defaultEasing,
+    timeout = defaultTimeout,
+    mountOnEnter: mountOnEnter,
+    unmountOnExit,
+    onEnter: onEnter,
+    onEntering,
+    onEntered,
+    onExit,
+    onExiting,
+    onExited
+  } = _a, others = __objRest(_a, [
+    // Base props
+    "children",
+    "in",
+    "style",
+    // Animation controls
+    "appear",
+    "enter",
+    "exit",
+    "delay",
+    "easing",
+    "timeout",
+    // Lifecycle hooks
+    "mountOnEnter",
+    "unmountOnExit",
+    // Animation callbacks
+    "onEnter",
+    "onEntering",
+    "onEntered",
+    "onExit",
+    "onExiting",
+    "onExited"
+  ]);
+  const isFirstMount = (0, import_react.useRef)(true);
+  const [isMounted, setIsMounted] = (0, import_react.useState)(
+    () => !mountOnEnter || !unmountOnExit
+  );
+  const elementRef = (0, import_react.useRef)(null);
+  const handleRef = (0, import_utils.useForkRef)(ref, children == null ? void 0 : children.ref, elementRef);
+  const shouldAnimateOnFirstMount = inProp && appear;
+  const shouldAnimate = inProp && enter || !inProp && exit;
+  const shouldExecuteAnimation = isFirstMount.current ? shouldAnimateOnFirstMount : shouldAnimate;
+  const getAnimationDurationAndDelay = () => {
+    if (!shouldExecuteAnimation) {
+      return { timeout: 0, delay: 0 };
+    }
+    return { timeout, delay };
+  };
+  const shouldSkipFirstAnimation = isFirstMount.current && !shouldAnimateOnFirstMount;
+  const transitions = (0, import_utils.createTransitions)();
+  const animationName = inProp ? "bui-fade-in" : "bui-fade-out";
+  const animationDurationAndDelay = getAnimationDurationAndDelay();
+  const animation = transitions.create(
+    animationName,
+    (0, import_utils.getTransitionProps)(
+      __spreadProps(__spreadValues({}, animationDurationAndDelay), {
+        style,
+        easing: easingProp
+      }),
+      { mode: inProp ? "enter" : "exit" }
+    )
+  );
+  (0, import_react.useEffect)(() => {
+    if (inProp && !isMounted) {
+      setIsMounted(true);
+    }
+  }, [inProp, isMounted]);
+  (0, import_react.useEffect)(() => {
+    if (isMounted && isFirstMount.current) {
+      isFirstMount.current = false;
+    }
+  }, [isMounted]);
+  (0, import_react.useEffect)(() => {
+    const shouldTriggerCallback = isMounted && shouldExecuteAnimation;
+    if (!shouldTriggerCallback)
+      return;
+    if (inProp) {
+      onEnter == null ? void 0 : onEnter(elementRef.current);
+    } else {
+      onExit == null ? void 0 : onExit(elementRef.current);
+    }
+  }, [inProp, isMounted, shouldExecuteAnimation, onEnter, onExit]);
+  const handleAnimationStart = () => {
+    if (!shouldExecuteAnimation)
+      return;
+    if (inProp) {
+      onEntering == null ? void 0 : onEntering(elementRef.current);
+    } else {
+      onExiting == null ? void 0 : onExiting(elementRef.current);
+    }
+  };
+  const handleAnimationEnd = () => {
+    if (shouldSkipFirstAnimation)
+      return;
+    if (inProp) {
+      onEntered == null ? void 0 : onEntered(elementRef.current);
+    } else {
+      onExited == null ? void 0 : onExited(elementRef.current);
+      if (unmountOnExit) {
+        setIsMounted(false);
+      }
+    }
+  };
+  if (!children || !isMounted)
+    return null;
+  return import_react.default.cloneElement(children, __spreadProps(__spreadValues({}, others), {
+    ref: handleRef,
+    onAnimationEnd: handleAnimationEnd,
+    onAnimationStart: handleAnimationStart,
+    style: __spreadValues(__spreadValues({
+      animation,
+      animationFillMode: "both"
+    }, style), (_b = children.props) == null ? void 0 : _b.style)
+  }));
+});
+Fade.displayName = "BuiFade";
+var Fade_miniapp_default = Fade;

package/dist/Fade/index.css

@@ -0,0 +1,16 @@
+@keyframes bui-fade-in {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+@keyframes bui-fade-out {
+  from {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+  }
+}

package/dist/Modal/Modal.miniapp.d.ts

@@ -12,5 +12,5 @@ declare const Modal: React.ForwardRefExoticComponent<Omit<ViewProps & {
     keepMounted?: boolean;
 } & import("@bifrostui/types").ICommonProps & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: React.Ref<HTMLDivElement>;
-}, "open" | keyof import("@bifrostui/types").ICommonProps | "container" | "disablePortal" | "onClose" | "keepMounted" | "BackdropProps" | "hideBackdrop" | "disableScrollLock">, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}, keyof import("@bifrostui/types").ICommonProps | "open" | "container" | "disablePortal" | "hideBackdrop" | "BackdropProps" | "onClose" | "disableScrollLock" | "keepMounted">, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export default Modal;

package/dist/Modal/Modal.miniapp.js

@@ -79,6 +79,7 @@ const Modal = /* @__PURE__ */ import_react.default.forwardRef(
       disableScrollLock,
       hideBackdrop,
       onClose,
+      onClick,
       keepMounted
     } = _a, others = __objRest(_a, [
       "className",
@@ -90,6 +91,7 @@ const Modal = /* @__PURE__ */ import_react.default.forwardRef(
       "disableScrollLock",
       "hideBackdrop",
       "onClose",
+      "onClick",
       "keepMounted"
     ]);
     const modalRef = import_react.default.useRef(null);
@@ -112,7 +114,10 @@ const Modal = /* @__PURE__ */ import_react.default.forwardRef(
       __spreadValues({
         className: (0, import_clsx.default)(prefixCls, className),
         ref: handleRef,
-        catchMove: !disableScrollLock
+        catchMove: !disableScrollLock,
+        onClick: (event) => {
+          onClick == null ? void 0 : onClick(event);
+        }
       }, others),
       !hideBackdrop ? /* @__PURE__ */ import_react.default.createElement(
         import_Backdrop.default,

package/dist/Slide/Slide.miniapp.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Slide Animation Component
+ * @description A component that implements slide in/out animation effects for elements
+ * @component Slide
+ */
+import React from 'react';
+import type { SlideProps } from './Slide.types';
+import './index.less';
+/**
+ * Slide Component
+ * @component
+ */
+declare const Slide: React.ForwardRefExoticComponent<SlideProps & React.RefAttributes<HTMLElement>>;
+export default Slide;

package/dist/Slide/Slide.miniapp.js

@@ -0,0 +1,212 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Slide_miniapp_exports = {};
+__export(Slide_miniapp_exports, {
+  default: () => Slide_miniapp_default
+});
+module.exports = __toCommonJS(Slide_miniapp_exports);
+var import_react = __toESM(require("react"));
+var import_utils = require("@bifrostui/utils");
+var import_index = require("./index.css");
+const defaultEasing = {
+  enter: import_utils.easing.easeOut,
+  exit: import_utils.easing.sharp
+};
+const defaultTimeout = {
+  enter: import_utils.duration.enteringScreen,
+  exit: import_utils.duration.leavingScreen
+};
+const getAnimationName = (direction, inProp) => {
+  const animations = {
+    left: inProp ? "bui-slide-left-in" : "bui-slide-left-out",
+    right: inProp ? "bui-slide-right-in" : "bui-slide-right-out",
+    up: inProp ? "bui-slide-up-in" : "bui-slide-up-out",
+    down: inProp ? "bui-slide-down-in" : "bui-slide-down-out"
+  };
+  return animations[direction] || animations.down;
+};
+const Slide = /* @__PURE__ */ import_react.default.forwardRef(
+  (_a, ref) => {
+    var _b = _a, {
+      children: children,
+      in: inProp,
+      style,
+      direction = "down",
+      appear: appear = true,
+      enter = true,
+      exit = true,
+      delay = 0,
+      easing: easingProp = defaultEasing,
+      timeout = defaultTimeout,
+      mountOnEnter: mountOnEnter,
+      unmountOnExit,
+      onEnter: onEnter,
+      onEntering,
+      onEntered,
+      onExit,
+      onExiting,
+      onExited
+    } = _b, others = __objRest(_b, [
+      // Base props
+      "children",
+      "in",
+      "style",
+      "direction",
+      // Animation controls
+      "appear",
+      "enter",
+      "exit",
+      "delay",
+      "easing",
+      "timeout",
+      // Lifecycle hooks
+      "mountOnEnter",
+      "unmountOnExit",
+      // Animation callbacks
+      "onEnter",
+      "onEntering",
+      "onEntered",
+      "onExit",
+      "onExiting",
+      "onExited"
+    ]);
+    var _a2;
+    const isFirstMount = (0, import_react.useRef)(true);
+    const [isMounted, setIsMounted] = (0, import_react.useState)(
+      () => !mountOnEnter || !unmountOnExit
+    );
+    const elementRef = (0, import_react.useRef)(null);
+    const handleRef = (0, import_utils.useForkRef)(ref, children == null ? void 0 : children.ref, elementRef);
+    const shouldAnimateOnFirstMount = inProp && appear;
+    const shouldAnimate = inProp && enter || !inProp && exit;
+    const shouldExecuteAnimation = isFirstMount.current ? shouldAnimateOnFirstMount : shouldAnimate;
+    const getAnimationDurationAndDelay = () => {
+      if (!shouldExecuteAnimation) {
+        return { timeout: 0, delay: 0 };
+      }
+      return { timeout, delay };
+    };
+    const shouldSkipFirstAnimation = isFirstMount.current && !shouldAnimateOnFirstMount;
+    const transitions = (0, import_utils.createTransitions)();
+    const animationName = getAnimationName(direction, inProp);
+    const animationDurationAndDelay = getAnimationDurationAndDelay();
+    const animation = transitions.create(
+      animationName,
+      (0, import_utils.getTransitionProps)(
+        __spreadProps(__spreadValues({}, animationDurationAndDelay), {
+          style,
+          easing: easingProp
+        }),
+        { mode: inProp ? "enter" : "exit" }
+      )
+    );
+    (0, import_react.useEffect)(() => {
+      if (inProp && !isMounted) {
+        setIsMounted(true);
+      }
+    }, [inProp, isMounted]);
+    (0, import_react.useEffect)(() => {
+      if (isMounted && isFirstMount.current) {
+        isFirstMount.current = false;
+      }
+    }, [isMounted]);
+    (0, import_react.useEffect)(() => {
+      const shouldTriggerCallback = isMounted && shouldExecuteAnimation;
+      if (!shouldTriggerCallback)
+        return;
+      if (inProp) {
+        onEnter == null ? void 0 : onEnter(elementRef.current);
+      } else {
+        onExit == null ? void 0 : onExit(elementRef.current);
+      }
+    }, [inProp, isMounted, shouldExecuteAnimation, onEnter, onExit]);
+    const handleAnimationStart = () => {
+      if (!shouldExecuteAnimation)
+        return;
+      if (inProp) {
+        onEntering == null ? void 0 : onEntering(elementRef.current);
+      } else {
+        onExiting == null ? void 0 : onExiting(elementRef.current);
+      }
+    };
+    const handleAnimationEnd = () => {
+      if (shouldSkipFirstAnimation)
+        return;
+      if (inProp) {
+        onEntered == null ? void 0 : onEntered(elementRef.current);
+      } else {
+        onExited == null ? void 0 : onExited(elementRef.current);
+        if (unmountOnExit) {
+          setIsMounted(false);
+        }
+      }
+    };
+    if (!children || !isMounted)
+      return null;
+    return import_react.default.cloneElement(children, __spreadProps(__spreadValues({}, others), {
+      ref: handleRef,
+      onAnimationEnd: handleAnimationEnd,
+      onAnimationStart: handleAnimationStart,
+      style: __spreadValues(__spreadValues({
+        animation,
+        animationFillMode: "both"
+      }, style), (_a2 = children.props) == null ? void 0 : _a2.style)
+    }));
+  }
+);
+Slide.displayName = "BuiSlide";
+var Slide_miniapp_default = Slide;

package/dist/Slide/index.css

@@ -0,0 +1,72 @@
+@keyframes bui-slide-left-in {
+  from {
+    transform: translateX(100%);
+  }
+  to {
+    visibility: visible;
+    transform: none;
+  }
+}
+@keyframes bui-slide-left-out {
+  from {
+    transform: none;
+  }
+  to {
+    visibility: hidden;
+    transform: translateX(100%);
+  }
+}
+@keyframes bui-slide-right-in {
+  from {
+    transform: translateX(-100%);
+  }
+  to {
+    visibility: visible;
+    transform: none;
+  }
+}
+@keyframes bui-slide-right-out {
+  from {
+    transform: none;
+  }
+  to {
+    visibility: hidden;
+    transform: translateX(-100%);
+  }
+}
+@keyframes bui-slide-up-in {
+  from {
+    transform: translateY(100%);
+  }
+  to {
+    visibility: visible;
+    transform: none;
+  }
+}
+@keyframes bui-slide-up-out {
+  from {
+    transform: none;
+  }
+  to {
+    visibility: hidden;
+    transform: translateY(100%);
+  }
+}
+@keyframes bui-slide-down-in {
+  from {
+    transform: translateY(-100%);
+  }
+  to {
+    visibility: visible;
+    transform: none;
+  }
+}
+@keyframes bui-slide-down-out {
+  from {
+    transform: none;
+  }
+  to {
+    visibility: hidden;
+    transform: translateY(-100%);
+  }
+}

package/dist/TabBar/TabBarItem.js

@@ -57,8 +57,8 @@ __export(TabBarItem_exports, {
 });
 module.exports = __toCommonJS(TabBarItem_exports);
 var import_react = __toESM(require("react"));
-var import_react2 = require("@bifrostui/react");
 var import_clsx = __toESM(require("clsx"));
+var import_Badge = __toESM(require("../Badge"));
 var import_TabBarItem = require("./TabBarItem.css");
 var import_TabBarContext = __toESM(require("./TabBarContext"));
 const prefixCls = "bui-tab-bar-item";
@@ -102,7 +102,7 @@ const TabBarItem = /* @__PURE__ */ import_react.default.forwardRef(
         ref,
         onClick: handleClick
       }, others),
-      children || ((_b = Object.values(BadgeProps || {})) == null ? void 0 : _b.length) > 0 ? /* @__PURE__ */ import_react.default.createElement(import_react2.Badge, __spreadValues({}, BadgeProps), currentIndex === index && activeIcon ? activeIcon : icon, /* @__PURE__ */ import_react.default.createElement(
+      children || ((_b = Object.values(BadgeProps || {})) == null ? void 0 : _b.length) > 0 ? /* @__PURE__ */ import_react.default.createElement(import_Badge.default, __spreadValues({}, BadgeProps), currentIndex === index && activeIcon ? activeIcon : icon, /* @__PURE__ */ import_react.default.createElement(
         "div",
         {
           className: (0, import_clsx.default)(`${prefixCls}-title`, {

package/dist/Transition/TransitionCore.js

@@ -173,8 +173,8 @@ const TransitionCore = (0, import_react.forwardRef)(
         (_a2 = nextCallback == null ? void 0 : nextCallback.current) == null ? void 0 : _a2.call(nextCallback);
       });
     };
-    const performEnter = () => __async(void 0, null, function* () {
-      if (!enter) {
+    const performEnter = (mounting) => __async(void 0, null, function* () {
+      if (!enter && !mounting) {
         safeSetState(ENTERED, () => __async(void 0, null, function* () {
           yield onEntered == null ? void 0 : onEntered(innerNodeRef == null ? void 0 : innerNodeRef.current);
         }));
@@ -208,18 +208,18 @@ const TransitionCore = (0, import_react.forwardRef)(
         });
       }));
     });
-    const updateStatus = (nextStatus) => {
+    const updateStatus = (nextStatus, mounting) => {
       if (nextStatus !== null) {
         cancelNextCallback();
         if (nextStatus === ENTERING) {
-          performEnter();
+          performEnter(mounting);
         } else if (nextStatus === EXITING) {
           performExit();
         }
       }
     };
     (0, import_react.useEffect)(() => {
-      nextTick(() => updateStatus(appearStatus.current));
+      nextTick(() => updateStatus(appearStatus.current, true));
       return () => {
         cancelNextCallback();
       };
@@ -239,11 +239,11 @@ const TransitionCore = (0, import_react.forwardRef)(
         nextStatus = EXITING;
       }
       if (isMounted)
-        updateStatus(nextStatus);
+        updateStatus(nextStatus, false);
       else
         safeSetState(inProp ? "EXITED" : "ENTERED", () => {
           forceReflow(innerNodeRef == null ? void 0 : innerNodeRef.current);
-          updateStatus(nextStatus);
+          updateStatus(nextStatus, false);
         });
     }, [inProp]);
     if (status === UNMOUNTED)

package/es/Fade/Fade.miniapp.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Fade Animation Component
+ * @description A component that implements fade in/out animation effects for elements
+ * @component Fade
+ */
+import React from 'react';
+import type { FadeProps } from './Fade.types';
+import './index.less';
+declare const Fade: React.ForwardRefExoticComponent<FadeProps & React.RefAttributes<HTMLElement>>;
+export default Fade;

package/es/Fade/Fade.miniapp.js

@@ -0,0 +1,178 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import React, { useEffect, useState, useRef } from "react";
+import {
+  createTransitions,
+  duration,
+  easing,
+  getTransitionProps,
+  useForkRef
+} from "@bifrostui/utils";
+import "./index.css";
+const defaultEasing = {
+  enter: easing.easeOut,
+  exit: easing.sharp
+};
+const defaultTimeout = {
+  enter: duration.enteringScreen,
+  exit: duration.leavingScreen
+};
+const Fade = /* @__PURE__ */ React.forwardRef((props, ref) => {
+  var _b;
+  const _a = props, {
+    children: children,
+    in: inProp,
+    style,
+    appear: appear = true,
+    enter = true,
+    exit = true,
+    delay = 0,
+    easing: easingProp = defaultEasing,
+    timeout = defaultTimeout,
+    mountOnEnter: mountOnEnter,
+    unmountOnExit,
+    onEnter: onEnter,
+    onEntering,
+    onEntered,
+    onExit,
+    onExiting,
+    onExited
+  } = _a, others = __objRest(_a, [
+    // Base props
+    "children",
+    "in",
+    "style",
+    // Animation controls
+    "appear",
+    "enter",
+    "exit",
+    "delay",
+    "easing",
+    "timeout",
+    // Lifecycle hooks
+    "mountOnEnter",
+    "unmountOnExit",
+    // Animation callbacks
+    "onEnter",
+    "onEntering",
+    "onEntered",
+    "onExit",
+    "onExiting",
+    "onExited"
+  ]);
+  const isFirstMount = useRef(true);
+  const [isMounted, setIsMounted] = useState(
+    () => !mountOnEnter || !unmountOnExit
+  );
+  const elementRef = useRef(null);
+  const handleRef = useForkRef(ref, children == null ? void 0 : children.ref, elementRef);
+  const shouldAnimateOnFirstMount = inProp && appear;
+  const shouldAnimate = inProp && enter || !inProp && exit;
+  const shouldExecuteAnimation = isFirstMount.current ? shouldAnimateOnFirstMount : shouldAnimate;
+  const getAnimationDurationAndDelay = () => {
+    if (!shouldExecuteAnimation) {
+      return { timeout: 0, delay: 0 };
+    }
+    return { timeout, delay };
+  };
+  const shouldSkipFirstAnimation = isFirstMount.current && !shouldAnimateOnFirstMount;
+  const transitions = createTransitions();
+  const animationName = inProp ? "bui-fade-in" : "bui-fade-out";
+  const animationDurationAndDelay = getAnimationDurationAndDelay();
+  const animation = transitions.create(
+    animationName,
+    getTransitionProps(
+      __spreadProps(__spreadValues({}, animationDurationAndDelay), {
+        style,
+        easing: easingProp
+      }),
+      { mode: inProp ? "enter" : "exit" }
+    )
+  );
+  useEffect(() => {
+    if (inProp && !isMounted) {
+      setIsMounted(true);
+    }
+  }, [inProp, isMounted]);
+  useEffect(() => {
+    if (isMounted && isFirstMount.current) {
+      isFirstMount.current = false;
+    }
+  }, [isMounted]);
+  useEffect(() => {
+    const shouldTriggerCallback = isMounted && shouldExecuteAnimation;
+    if (!shouldTriggerCallback)
+      return;
+    if (inProp) {
+      onEnter == null ? void 0 : onEnter(elementRef.current);
+    } else {
+      onExit == null ? void 0 : onExit(elementRef.current);
+    }
+  }, [inProp, isMounted, shouldExecuteAnimation, onEnter, onExit]);
+  const handleAnimationStart = () => {
+    if (!shouldExecuteAnimation)
+      return;
+    if (inProp) {
+      onEntering == null ? void 0 : onEntering(elementRef.current);
+    } else {
+      onExiting == null ? void 0 : onExiting(elementRef.current);
+    }
+  };
+  const handleAnimationEnd = () => {
+    if (shouldSkipFirstAnimation)
+      return;
+    if (inProp) {
+      onEntered == null ? void 0 : onEntered(elementRef.current);
+    } else {
+      onExited == null ? void 0 : onExited(elementRef.current);
+      if (unmountOnExit) {
+        setIsMounted(false);
+      }
+    }
+  };
+  if (!children || !isMounted)
+    return null;
+  return React.cloneElement(children, __spreadProps(__spreadValues({}, others), {
+    ref: handleRef,
+    onAnimationEnd: handleAnimationEnd,
+    onAnimationStart: handleAnimationStart,
+    style: __spreadValues(__spreadValues({
+      animation,
+      animationFillMode: "both"
+    }, style), (_b = children.props) == null ? void 0 : _b.style)
+  }));
+});
+Fade.displayName = "BuiFade";
+var Fade_miniapp_default = Fade;
+export {
+  Fade_miniapp_default as default
+};

package/es/Fade/index.css

@@ -0,0 +1,16 @@
+@keyframes bui-fade-in {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+@keyframes bui-fade-out {
+  from {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+  }
+}

package/es/Modal/Modal.miniapp.d.ts

@@ -12,5 +12,5 @@ declare const Modal: React.ForwardRefExoticComponent<Omit<ViewProps & {
     keepMounted?: boolean;
 } & import("@bifrostui/types").ICommonProps & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: React.Ref<HTMLDivElement>;
-}, "open" | keyof import("@bifrostui/types").ICommonProps | "container" | "disablePortal" | "hideBackdrop" | "BackdropProps" | "onClose" | "disableScrollLock" | "keepMounted">, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}, "open" | keyof import("@bifrostui/types").ICommonProps | "container" | "BackdropProps" | "onClose" | "disablePortal" | "hideBackdrop" | "disableScrollLock" | "keepMounted">, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export default Modal;

package/es/Modal/Modal.miniapp.js

@@ -49,6 +49,7 @@ const Modal = /* @__PURE__ */ React.forwardRef(
       disableScrollLock,
       hideBackdrop,
       onClose,
+      onClick,
       keepMounted
     } = _a, others = __objRest(_a, [
       "className",
@@ -60,6 +61,7 @@ const Modal = /* @__PURE__ */ React.forwardRef(
       "disableScrollLock",
       "hideBackdrop",
       "onClose",
+      "onClick",
       "keepMounted"
     ]);
     const modalRef = React.useRef(null);
@@ -82,7 +84,10 @@ const Modal = /* @__PURE__ */ React.forwardRef(
       __spreadValues({
         className: clsx(prefixCls, className),
         ref: handleRef,
-        catchMove: !disableScrollLock
+        catchMove: !disableScrollLock,
+        onClick: (event) => {
+          onClick == null ? void 0 : onClick(event);
+        }
       }, others),
       !hideBackdrop ? /* @__PURE__ */ React.createElement(
         Backdrop,

package/es/Slide/Slide.miniapp.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Slide Animation Component
+ * @description A component that implements slide in/out animation effects for elements
+ * @component Slide
+ */
+import React from 'react';
+import type { SlideProps } from './Slide.types';
+import './index.less';
+/**
+ * Slide Component
+ * @component
+ */
+declare const Slide: React.ForwardRefExoticComponent<SlideProps & React.RefAttributes<HTMLElement>>;
+export default Slide;

package/es/Slide/Slide.miniapp.js

@@ -0,0 +1,191 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import React, { useEffect, useState, useRef } from "react";
+import {
+  createTransitions,
+  duration,
+  easing,
+  getTransitionProps,
+  useForkRef
+} from "@bifrostui/utils";
+import "./index.css";
+const defaultEasing = {
+  enter: easing.easeOut,
+  exit: easing.sharp
+};
+const defaultTimeout = {
+  enter: duration.enteringScreen,
+  exit: duration.leavingScreen
+};
+const getAnimationName = (direction, inProp) => {
+  const animations = {
+    left: inProp ? "bui-slide-left-in" : "bui-slide-left-out",
+    right: inProp ? "bui-slide-right-in" : "bui-slide-right-out",
+    up: inProp ? "bui-slide-up-in" : "bui-slide-up-out",
+    down: inProp ? "bui-slide-down-in" : "bui-slide-down-out"
+  };
+  return animations[direction] || animations.down;
+};
+const Slide = /* @__PURE__ */ React.forwardRef(
+  (_a, ref) => {
+    var _b = _a, {
+      children: children,
+      in: inProp,
+      style,
+      direction = "down",
+      appear: appear = true,
+      enter = true,
+      exit = true,
+      delay = 0,
+      easing: easingProp = defaultEasing,
+      timeout = defaultTimeout,
+      mountOnEnter: mountOnEnter,
+      unmountOnExit,
+      onEnter: onEnter,
+      onEntering,
+      onEntered,
+      onExit,
+      onExiting,
+      onExited
+    } = _b, others = __objRest(_b, [
+      // Base props
+      "children",
+      "in",
+      "style",
+      "direction",
+      // Animation controls
+      "appear",
+      "enter",
+      "exit",
+      "delay",
+      "easing",
+      "timeout",
+      // Lifecycle hooks
+      "mountOnEnter",
+      "unmountOnExit",
+      // Animation callbacks
+      "onEnter",
+      "onEntering",
+      "onEntered",
+      "onExit",
+      "onExiting",
+      "onExited"
+    ]);
+    var _a2;
+    const isFirstMount = useRef(true);
+    const [isMounted, setIsMounted] = useState(
+      () => !mountOnEnter || !unmountOnExit
+    );
+    const elementRef = useRef(null);
+    const handleRef = useForkRef(ref, children == null ? void 0 : children.ref, elementRef);
+    const shouldAnimateOnFirstMount = inProp && appear;
+    const shouldAnimate = inProp && enter || !inProp && exit;
+    const shouldExecuteAnimation = isFirstMount.current ? shouldAnimateOnFirstMount : shouldAnimate;
+    const getAnimationDurationAndDelay = () => {
+      if (!shouldExecuteAnimation) {
+        return { timeout: 0, delay: 0 };
+      }
+      return { timeout, delay };
+    };
+    const shouldSkipFirstAnimation = isFirstMount.current && !shouldAnimateOnFirstMount;
+    const transitions = createTransitions();
+    const animationName = getAnimationName(direction, inProp);
+    const animationDurationAndDelay = getAnimationDurationAndDelay();
+    const animation = transitions.create(
+      animationName,
+      getTransitionProps(
+        __spreadProps(__spreadValues({}, animationDurationAndDelay), {
+          style,
+          easing: easingProp
+        }),
+        { mode: inProp ? "enter" : "exit" }
+      )
+    );
+    useEffect(() => {
+      if (inProp && !isMounted) {
+        setIsMounted(true);
+      }
+    }, [inProp, isMounted]);
+    useEffect(() => {
+      if (isMounted && isFirstMount.current) {
+        isFirstMount.current = false;
+      }
+    }, [isMounted]);
+    useEffect(() => {
+      const shouldTriggerCallback = isMounted && shouldExecuteAnimation;
+      if (!shouldTriggerCallback)
+        return;
+      if (inProp) {
+        onEnter == null ? void 0 : onEnter(elementRef.current);
+      } else {
+        onExit == null ? void 0 : onExit(elementRef.current);
+      }
+    }, [inProp, isMounted, shouldExecuteAnimation, onEnter, onExit]);
+    const handleAnimationStart = () => {
+      if (!shouldExecuteAnimation)
+        return;
+      if (inProp) {
+        onEntering == null ? void 0 : onEntering(elementRef.current);
+      } else {
+        onExiting == null ? void 0 : onExiting(elementRef.current);
+      }
+    };
+    const handleAnimationEnd = () => {
+      if (shouldSkipFirstAnimation)
+        return;
+      if (inProp) {
+        onEntered == null ? void 0 : onEntered(elementRef.current);
+      } else {
+        onExited == null ? void 0 : onExited(elementRef.current);
+        if (unmountOnExit) {
+          setIsMounted(false);
+        }
+      }
+    };
+    if (!children || !isMounted)
+      return null;
+    return React.cloneElement(children, __spreadProps(__spreadValues({}, others), {
+      ref: handleRef,
+      onAnimationEnd: handleAnimationEnd,
+      onAnimationStart: handleAnimationStart,
+      style: __spreadValues(__spreadValues({
+        animation,
+        animationFillMode: "both"
+      }, style), (_a2 = children.props) == null ? void 0 : _a2.style)
+    }));
+  }
+);
+Slide.displayName = "BuiSlide";
+var Slide_miniapp_default = Slide;
+export {
+  Slide_miniapp_default as default
+};

package/es/Slide/index.css

@@ -0,0 +1,72 @@
+@keyframes bui-slide-left-in {
+  from {
+    transform: translateX(100%);
+  }
+  to {
+    visibility: visible;
+    transform: none;
+  }
+}
+@keyframes bui-slide-left-out {
+  from {
+    transform: none;
+  }
+  to {
+    visibility: hidden;
+    transform: translateX(100%);
+  }
+}
+@keyframes bui-slide-right-in {
+  from {
+    transform: translateX(-100%);
+  }
+  to {
+    visibility: visible;
+    transform: none;
+  }
+}
+@keyframes bui-slide-right-out {
+  from {
+    transform: none;
+  }
+  to {
+    visibility: hidden;
+    transform: translateX(-100%);
+  }
+}
+@keyframes bui-slide-up-in {
+  from {
+    transform: translateY(100%);
+  }
+  to {
+    visibility: visible;
+    transform: none;
+  }
+}
+@keyframes bui-slide-up-out {
+  from {
+    transform: none;
+  }
+  to {
+    visibility: hidden;
+    transform: translateY(100%);
+  }
+}
+@keyframes bui-slide-down-in {
+  from {
+    transform: translateY(-100%);
+  }
+  to {
+    visibility: visible;
+    transform: none;
+  }
+}
+@keyframes bui-slide-down-out {
+  from {
+    transform: none;
+  }
+  to {
+    visibility: hidden;
+    transform: translateY(-100%);
+  }
+}

package/es/TabBar/TabBarItem.js

@@ -27,8 +27,8 @@ var __objRest = (source, exclude) => {
   return target;
 };
 import React, { useContext } from "react";
-import { Badge } from "@bifrostui/react";
 import clsx from "clsx";
+import Badge from "../Badge";
 import "./TabBarItem.css";
 import TabBarContext from "./TabBarContext";
 const prefixCls = "bui-tab-bar-item";

package/es/Transition/TransitionCore.js

@@ -143,8 +143,8 @@ const TransitionCore = forwardRef(
         (_a2 = nextCallback == null ? void 0 : nextCallback.current) == null ? void 0 : _a2.call(nextCallback);
       });
     };
-    const performEnter = () => __async(void 0, null, function* () {
-      if (!enter) {
+    const performEnter = (mounting) => __async(void 0, null, function* () {
+      if (!enter && !mounting) {
         safeSetState(ENTERED, () => __async(void 0, null, function* () {
           yield onEntered == null ? void 0 : onEntered(innerNodeRef == null ? void 0 : innerNodeRef.current);
         }));
@@ -178,18 +178,18 @@ const TransitionCore = forwardRef(
         });
       }));
     });
-    const updateStatus = (nextStatus) => {
+    const updateStatus = (nextStatus, mounting) => {
       if (nextStatus !== null) {
         cancelNextCallback();
         if (nextStatus === ENTERING) {
-          performEnter();
+          performEnter(mounting);
         } else if (nextStatus === EXITING) {
           performExit();
         }
       }
     };
     useEffect(() => {
-      nextTick(() => updateStatus(appearStatus.current));
+      nextTick(() => updateStatus(appearStatus.current, true));
       return () => {
         cancelNextCallback();
       };
@@ -209,11 +209,11 @@ const TransitionCore = forwardRef(
         nextStatus = EXITING;
       }
       if (isMounted)
-        updateStatus(nextStatus);
+        updateStatus(nextStatus, false);
       else
         safeSetState(inProp ? "EXITED" : "ENTERED", () => {
           forceReflow(innerNodeRef == null ? void 0 : innerNodeRef.current);
-          updateStatus(nextStatus);
+          updateStatus(nextStatus, false);
         });
     }, [inProp]);
     if (status === UNMOUNTED)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bifrostui/react",
-  "version": "1.5.1",
+  "version": "1.5.2",
   "description": "React components for building mobile application",
   "homepage": "http://bui.taopiaopiao.com",
   "license": "MIT",
@@ -33,10 +33,10 @@
     "clsx": "^1.2.1",
     "dayjs": "^1.11.7",
     "swiper": "^8.1.5",
-    "@bifrostui/icons": "1.5.1",
-    "@bifrostui/styles": "1.5.1",
-    "@bifrostui/types": "1.5.1",
-    "@bifrostui/utils": "1.5.1"
+    "@bifrostui/icons": "1.5.2",
+    "@bifrostui/styles": "1.5.2",
+    "@bifrostui/types": "1.5.2",
+    "@bifrostui/utils": "1.5.2"
   },
   "peerDependencies": {
     "@tarojs/components": "^3.0.0",