@bifrostui/react 1.4.0-beta.1 → 1.4.0-beta.2

package/dist/Dialog/FunctionalDialog.js

@@ -168,8 +168,9 @@ const prompt = (options) => {
 const useDialog = () => {
   const holderRef = import_react.default.useRef(null);
   const wrapAPI = (props) => {
-    const options = __spreadValues({ theme: holderRef.current.theme }, formatProps(props));
-    const _a = options, { onConfirm, onCancel } = _a, rest = __objRest(_a, ["onConfirm", "onCancel"]);
+    var _a;
+    const options = __spreadValues({ theme: (_a = holderRef.current) == null ? void 0 : _a.theme }, formatProps(props));
+    const _b = options, { onConfirm, onCancel } = _b, rest = __objRest(_b, ["onConfirm", "onCancel"]);
     return new Promise((resolve) => {
       DialogGenerator(__spreadProps(__spreadValues({}, rest), {
         onConfirm: (val) => __async(void 0, null, function* () {
@@ -186,16 +187,22 @@ const useDialog = () => {
       }));
     });
   };
-  wrapAPI.confirm = (options) => Dialog(__spreadProps(__spreadValues({
-    type: "confirm"
-  }, formatProps(options)), {
-    theme: holderRef.current.theme
-  }));
-  wrapAPI.prompt = (options) => Dialog(__spreadProps(__spreadValues({
-    type: "prompt"
-  }, formatProps(options)), {
-    theme: holderRef.current.theme
-  }));
+  wrapAPI.confirm = (options) => {
+    var _a;
+    return Dialog(__spreadProps(__spreadValues({
+      type: "confirm"
+    }, formatProps(options)), {
+      theme: (_a = holderRef.current) == null ? void 0 : _a.theme
+    }));
+  };
+  wrapAPI.prompt = (options) => {
+    var _a;
+    return Dialog(__spreadProps(__spreadValues({
+      type: "prompt"
+    }, formatProps(options)), {
+      theme: (_a = holderRef.current) == null ? void 0 : _a.theme
+    }));
+  };
   return [wrapAPI, /* @__PURE__ */ import_react.default.createElement(import_Dialog.default, { key: "dialog-holder", ref: holderRef })];
 };
 Dialog.confirm = confirm;

package/dist/Input/Input.css

@@ -39,6 +39,10 @@
   outline: none;
   background-color: var(--background-color);
   font-size: var(--bui-text-size-2);
+  width: auto;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 .bui-input-input::placeholder {
   color: var(--bui-color-fg-subtle);

package/dist/Popover/Popover.js

@@ -1,8 +1,6 @@
 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;
@@ -20,7 +18,6 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var __objRest = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -77,8 +74,7 @@ const Popover = /* @__PURE__ */ import_react.default.forwardRef((props, ref) =>
     trigger = "click",
     onOpenChange,
     open,
-    hideArrow,
-    PortalProps
+    hideArrow
   } = _a, others = __objRest(_a, [
     "className",
     "style",
@@ -90,8 +86,7 @@ const Popover = /* @__PURE__ */ import_react.default.forwardRef((props, ref) =>
     "trigger",
     "onOpenChange",
     "open",
-    "hideArrow",
-    "PortalProps"
+    "hideArrow"
   ]);
   const controlByUser = typeof open !== "undefined";
   const positionArr = placement.split(/([A-Z])/);
@@ -136,15 +131,7 @@ const Popover = /* @__PURE__ */ import_react.default.forwardRef((props, ref) =>
       return;
     hidePopover(event);
   };
-  (0, import_react.useEffect)(() => {
-    if (controlByUser)
-      return;
-    document.addEventListener("click", clickEventHandler);
-    return () => {
-      document.removeEventListener("click", clickEventHandler);
-    };
-  }, []);
-  const onRootElementMouted = () => {
+  const onRootElementMouted = (0, import_utils.throttle)(() => {
     const result = (0, import_utils.getStylesAndLocation)({
       childrenRef,
       arrowDirection,
@@ -161,7 +148,25 @@ const Popover = /* @__PURE__ */ import_react.default.forwardRef((props, ref) =>
       setArrowLocation(newArrowLocation);
     }
     setTooltyles(styles);
+  }, 100);
+  const bindEvent = () => {
+    if (!controlByUser) {
+      document.addEventListener("click", clickEventHandler);
+    }
+    window.addEventListener("resize", onRootElementMouted);
   };
+  const unbindEvent = () => {
+    if (!controlByUser) {
+      document.removeEventListener("click", clickEventHandler);
+    }
+    window.removeEventListener("resize", onRootElementMouted);
+  };
+  (0, import_react.useEffect)(() => {
+    bindEvent();
+    return () => {
+      unbindEvent();
+    };
+  }, []);
   if (!title && !content)
     return null;
   let triggerEventOption;
@@ -176,34 +181,26 @@ const Popover = /* @__PURE__ */ import_react.default.forwardRef((props, ref) =>
   const childrenOptions = __spreadValues({
     ref: childrenRef
   }, triggerEventOption);
-  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, open || openStatus ? /* @__PURE__ */ import_react.default.createElement(
-    import_Portal.default,
-    __spreadProps(__spreadValues({
-      onRootElementMouted
-    }, PortalProps), {
-      ref
-    }),
-    /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, open || openStatus ? /* @__PURE__ */ import_react.default.createElement(import_Portal.default, { onRootElementMouted, ref }, /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    __spreadValues({
+      className: (0, import_clsx.default)(prefixCls, className, `popover-${arrowDirection}`, {
+        "bui-popover-arrow-hide": hideArrow
+      }),
+      "data-id": `tt_${ttId}`,
+      style: __spreadValues(__spreadValues({}, style), tooltyles)
+    }, others),
+    !hideArrow ? /* @__PURE__ */ import_react.default.createElement(
       "div",
-      __spreadValues({
-        className: (0, import_clsx.default)(prefixCls, className, `popover-${arrowDirection}`, {
-          "bui-popover-arrow-hide": hideArrow
-        }),
-        "data-id": `tt_${ttId}`,
-        style: __spreadValues(__spreadValues({}, style), tooltyles)
-      }, others),
-      !hideArrow ? /* @__PURE__ */ import_react.default.createElement(
-        "div",
-        {
-          className: (0, import_clsx.default)(
-            "bui-popover-arrow",
-            `location-${arrowLocation}`
-          )
-        }
-      ) : null,
-      /* @__PURE__ */ import_react.default.createElement("div", { className: "bui-popover-content" }, title ? /* @__PURE__ */ import_react.default.createElement("div", { className: "bui-popover-title" }, title) : null, content ? /* @__PURE__ */ import_react.default.createElement("div", { className: "bui-popover-inner-content" }, content) : null)
-    )
-  ) : null, import_react.default.isValidElement(children) ? import_react.default.cloneElement(children, childrenOptions) : children);
+      {
+        className: (0, import_clsx.default)(
+          "bui-popover-arrow",
+          `location-${arrowLocation}`
+        )
+      }
+    ) : null,
+    /* @__PURE__ */ import_react.default.createElement("div", { className: "bui-popover-content" }, title ? /* @__PURE__ */ import_react.default.createElement("div", { className: "bui-popover-title" }, title) : null, content ? /* @__PURE__ */ import_react.default.createElement("div", { className: "bui-popover-inner-content" }, content) : null)
+  )) : null, import_react.default.isValidElement(children) ? import_react.default.cloneElement(children, childrenOptions) : children);
 });
 Popover.displayName = "BuiPopover";
 var Popover_default = Popover;

package/dist/Popover/Popover.types.d.ts

@@ -1,6 +1,5 @@
 import React from 'react';
 import { OverrideProps } from '@bifrostui/types';
-import { PortalCoreProps } from '../Portal/Portal.types';
 type triggerType = 'click' | 'hover';
 export type PopoverProps<D extends React.ElementType = 'div', P = {}> = OverrideProps<{
     props: P & {
@@ -39,10 +38,6 @@ export type PopoverProps<D extends React.ElementType = 'div', P = {}> = Override
          * @default 'click'
          */
         trigger?: triggerType | triggerType[];
-        /**
-         * Portal组件的属性
-         */
-        PortalProps?: PortalCoreProps;
         /**
          * 点击事件回调方法
          * - event 触发事件

package/dist/Progress/Progress.css

@@ -1,5 +1,5 @@
 .bui-progress {
-  --fill-color: var(--bui-progress-fill-color, --bui-color-primary);
+  --fill-color: var(--bui-progress-fill-color, var(--bui-color-primary));
   --trail-color: var(--bui-progress-trail-color, rgba(156, 156, 165, 0.2));
   --stroke-width: var(--bui-progress-stroke-width, 8px);
   --width: var(--bui-progress-width, 100%);

package/dist/Radio/Radio.css

@@ -1,7 +1,7 @@
 .bui-radio {
-  --label-color: var(--bui-radio-label-color, --bui-color-fg-default);
-  --label-font-size: var(--bui-radio-label-font-size, --bui-text-size-1);
-  --icon-font-size: var(--bui-radio-icon-font-size, --bui-title-size-2);
+  --label-color: var(--bui-radio-label-color, var(--bui-color-fg-default));
+  --label-font-size: var(--bui-radio-label-font-size, var(--bui-text-size-1));
+  --icon-font-size: var(--bui-radio-icon-font-size, var(--bui-title-size-2));
   --icon-padding: var(--bui-radio-icon-padding, 5px);
   display: inline-flex;
   align-items: center;

package/dist/Slider/Slider.css

@@ -1,6 +1,6 @@
 .bui-slider {
-  --line-color: var(--bui-slider-line-color, --bui-color-primary);
-  --line-bg-color: var(--bui-slider-line-bg-color, --bui-color-border-default);
+  --line-color: var(--bui-slider-line-color, var(--bui-color-primary));
+  --line-bg-color: var(--bui-slider-line-bg-color, var(--bui-color-border-default));
   --width: var(--bui-slider-width, 100%);
   --height: var(--bui-slider-height, 2px);
   --padding: var(--bui-slider-padding, 19px 0);
@@ -12,9 +12,9 @@
   --tooltip-height: var(--bui-slider-tooltip-height, 24px);
   --tooltip-line-height: var(--bui-slider-tooltip-line-height, 24px);
   --tooltip-border-radius: var(--bui-slider-tooltip-border-radius, 24px);
-  --tooltip-font-size: var(--bui-tooltip-font-size, --bui-text-size-3);
-  --tooltip-color: var(--bui-tooltip-color, --bui-color-white);
-  --tooltip-bg-color: var(--bui-tooltip-bg-color, --line-color);
+  --tooltip-font-size: var(--bui-tooltip-font-size, var(--bui-text-size-3));
+  --tooltip-color: var(--bui-tooltip-color, var(--bui-color-white));
+  --tooltip-bg-color: var(--bui-tooltip-bg-color, var(--line-color));
   position: relative;
   width: var(--width);
   height: var(--height);
@@ -39,7 +39,7 @@
   top: 50%;
   left: 0;
   width: 100%;
-  height: var(---height);
+  height: var(--height);
   transform: translateY(-50%);
   background-color: var(--line-bg-color);
 }

package/dist/ThemeProvider/ThemeProvider.types.d.ts

@@ -1,10 +1,6 @@
 import { ReactNode } from 'react';
 import { OverrideProps } from '@bifrostui/types';
 import { BaseLang } from '../locales/base';
-export type ThemeProviderProps<D extends React.ElementType = 'div', P = {}> = OverrideProps<{
-    props: P & ThemeProps;
-    defaultComponent: D;
-}, D>;
 export interface Breakpoints {
     /**
      * 超小屏幕 (小于 576px，实际为了处理临界值，断点值为 575.98px)
@@ -124,4 +120,8 @@ export type MountResponsiveTokenOptions = Pick<ThemeProps, 'responsive'> & {
 export type UpdateTokensOptions = Pick<ThemeProps, 'isRoot' | 'containerId' | 'container'> & {
     rootString: string;
 };
+export type ThemeProviderProps<D extends React.ElementType = 'div', P = {}> = OverrideProps<{
+    props: P & ThemeProps;
+    defaultComponent: D;
+}, D>;
 export { BaseLang, ResponsiveTokenOptions, ThemeProps, BuiltInThemesTokenOptions, componentsTokenOptions, };

package/dist/Toast/FunctionalToast.js

@@ -62,7 +62,7 @@ module.exports = __toCommonJS(FunctionalToast_exports);
 var import_utils = require("@bifrostui/utils");
 var import_react = __toESM(require("react"));
 var import_Toast = __toESM(require("./Toast"));
-const toastCloses = [];
+let toastCloses = [];
 const formatProps = (props) => {
   if (typeof props === "string") {
     return { message: props };
@@ -126,7 +126,12 @@ const functionalToast = (props) => {
         destroyAll();
       toastCloses.push(close);
       if (duration !== 0 && typeof duration === "number") {
-        timer = setTimeout(close, duration);
+        timer = setTimeout(() => {
+          close();
+          if (!allowMultiple) {
+            toastCloses = [];
+          }
+        }, duration);
       }
       return () => {
         clearTimeout(timer);
@@ -158,11 +163,14 @@ functionalToast.clear = () => {
 const useToast = () => {
   const holderRef = import_react.default.useRef(null);
   ["warning", "loading", "success", "fail"].forEach((methodName) => {
-    functionalToast[methodName] = (options) => functionalToast(__spreadProps(__spreadValues({
-      type: methodName
-    }, formatProps(options)), {
-      theme: holderRef.current.theme
-    }));
+    functionalToast[methodName] = (options) => {
+      var _a;
+      return functionalToast(__spreadProps(__spreadValues({
+        type: methodName
+      }, formatProps(options)), {
+        theme: (_a = holderRef.current) == null ? void 0 : _a.theme
+      }));
+    };
   });
   functionalToast.clear = () => {
     setTimeout(() => {

package/dist/Toast/Toast.css

@@ -1,13 +1,14 @@
 .bui-toast {
   --min-width: var(--bui-toast-min-width, 86px);
   --max-width: var(--bui-toast-max-width, 80%);
+  --text-align: var(--bui-toast-text-align, center);
   --flex-direction: var(--bui-toast-flex-direction, column);
   --padding: var(--bui-toast-padding, var(--bui-spacing-xl));
   --position-top: var(--bui-toast-position-top, 15%);
   --position-bottom: var(--bui-toast-position-bottom, 85%);
   --background-color: var(--bui-toast-bg-color, rgba(0, 0, 0, 0.8));
-  --border-radius: var(--bui-toast-border-radius, --bui-shape-radius-default);
-  --icon-margin: var(--bui-toast-icon-margin-bottom, 8px);
+  --border-radius: var(--bui-toast-border-radius, var(--bui-shape-radius-default));
+  --icon-margin: var(--bui-toast-icon-margin, 0 0 8px);
   --icon-font-size: var(--bui-toast-icon-font-size, 30px);
   position: fixed;
   left: 50%;
@@ -22,7 +23,7 @@
   word-break: break-all;
   white-space: pre-wrap;
   background-color: var(--background-color);
-  text-align: center;
+  text-align: var(--text-align);
   font-family: var(--bui-font-family);
 }
 .bui-toast.bui-toast-allow-click {
@@ -48,6 +49,6 @@
   align-items: center;
 }
 .bui-toast-icon .bui-svg-icon {
-  margin: 0 0 var(--icon-margin);
+  margin: var(--icon-margin);
   font-size: var(--icon-font-size);
 }

package/dist/Tooltip/Tooltip.js

@@ -1,8 +1,6 @@
 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;
@@ -20,7 +18,6 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var __objRest = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -75,8 +72,7 @@ const Tooltip = /* @__PURE__ */ import_react.default.forwardRef((props, ref) =>
     placement = "top",
     trigger = "click",
     onOpenChange,
-    open,
-    PortalProps
+    open
   } = _a, others = __objRest(_a, [
     "className",
     "style",
@@ -86,8 +82,7 @@ const Tooltip = /* @__PURE__ */ import_react.default.forwardRef((props, ref) =>
     "placement",
     "trigger",
     "onOpenChange",
-    "open",
-    "PortalProps"
+    "open"
   ]);
   const controlByUser = typeof open !== "undefined";
   const positionArr = placement.split(/([A-Z])/);
@@ -132,15 +127,7 @@ const Tooltip = /* @__PURE__ */ import_react.default.forwardRef((props, ref) =>
       return;
     hideTooltip(event);
   };
-  (0, import_react.useEffect)(() => {
-    if (controlByUser)
-      return;
-    document.addEventListener("click", clickEventHandler);
-    return () => {
-      document.removeEventListener("click", clickEventHandler);
-    };
-  }, []);
-  const onRootElementMouted = () => {
+  const onRootElementMouted = (0, import_utils.throttle)(() => {
     const result = (0, import_utils.getStylesAndLocation)({
       childrenRef,
       arrowDirection,
@@ -157,7 +144,25 @@ const Tooltip = /* @__PURE__ */ import_react.default.forwardRef((props, ref) =>
       setArrowLocation(newArrowLocation);
     }
     setTooltyles(styles);
+  }, 100);
+  const bindEvent = () => {
+    if (!controlByUser) {
+      document.addEventListener("click", clickEventHandler);
+    }
+    window.addEventListener("resize", onRootElementMouted);
   };
+  const unbindEvent = () => {
+    if (!controlByUser) {
+      document.removeEventListener("click", clickEventHandler);
+    }
+    window.removeEventListener("resize", onRootElementMouted);
+  };
+  (0, import_react.useEffect)(() => {
+    bindEvent();
+    return () => {
+      unbindEvent();
+    };
+  }, []);
   let triggerEventOption;
   if (!controlByUser) {
     triggerEventOption = (0, import_utils.triggerEventTransform)({
@@ -170,29 +175,21 @@ const Tooltip = /* @__PURE__ */ import_react.default.forwardRef((props, ref) =>
   const childrenOptions = __spreadValues({
     ref: childrenRef
   }, triggerEventOption);
-  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, (open || openStatus) && title ? /* @__PURE__ */ import_react.default.createElement(
-    import_Portal.default,
-    __spreadProps(__spreadValues({
-      onRootElementMouted
-    }, PortalProps), {
-      ref
-    }),
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, (open || openStatus) && title ? /* @__PURE__ */ import_react.default.createElement(import_Portal.default, { onRootElementMouted, ref }, /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    __spreadValues({
+      className: (0, import_clsx.default)(prefixCls, className, `tooltip-${arrowDirection}`),
+      style: __spreadValues(__spreadValues({}, style), tooltyles),
+      "data-id": `tt_${ttId}`
+    }, others),
     /* @__PURE__ */ import_react.default.createElement(
       "div",
-      __spreadValues({
-        className: (0, import_clsx.default)(prefixCls, className, `tooltip-${arrowDirection}`),
-        style: __spreadValues(__spreadValues({}, style), tooltyles),
-        "data-id": `tt_${ttId}`
-      }, others),
-      /* @__PURE__ */ import_react.default.createElement(
-        "div",
-        {
-          className: (0, import_clsx.default)("bui-tooltip-arrow", `location-${arrowLocation}`)
-        }
-      ),
-      /* @__PURE__ */ import_react.default.createElement("div", { className: "bui-tooltip-content" }, title)
-    )
-  ) : null, import_react.default.isValidElement(children) ? import_react.default.cloneElement(children, childrenOptions) : children);
+      {
+        className: (0, import_clsx.default)("bui-tooltip-arrow", `location-${arrowLocation}`)
+      }
+    ),
+    /* @__PURE__ */ import_react.default.createElement("div", { className: "bui-tooltip-content" }, title)
+  )) : null, import_react.default.isValidElement(children) ? import_react.default.cloneElement(children, childrenOptions) : children);
 });
 Tooltip.displayName = "BuiTooltip";
 var Tooltip_default = Tooltip;

package/dist/Tooltip/Tooltip.types.d.ts

@@ -1,6 +1,5 @@
 import React from 'react';
 import { OverrideProps } from '@bifrostui/types';
-import { PortalCoreProps } from '../Portal/Portal.types';
 type triggerType = 'click' | 'hover';
 export type TooltipProps<D extends React.ElementType = 'div', P = {}> = OverrideProps<{
     props: P & {
@@ -30,10 +29,6 @@ export type TooltipProps<D extends React.ElementType = 'div', P = {}> = Override
          * @default 'click'
          */
         trigger?: triggerType | triggerType[];
-        /**
-         * Portal组件的属性
-         */
-        PortalProps?: PortalCoreProps;
         /**
          * 点击事件回调方法
          * - event 触发事件

package/es/Dialog/FunctionalDialog.js

@@ -138,8 +138,9 @@ const prompt = (options) => {
 const useDialog = () => {
   const holderRef = React.useRef(null);
   const wrapAPI = (props) => {
-    const options = __spreadValues({ theme: holderRef.current.theme }, formatProps(props));
-    const _a = options, { onConfirm, onCancel } = _a, rest = __objRest(_a, ["onConfirm", "onCancel"]);
+    var _a;
+    const options = __spreadValues({ theme: (_a = holderRef.current) == null ? void 0 : _a.theme }, formatProps(props));
+    const _b = options, { onConfirm, onCancel } = _b, rest = __objRest(_b, ["onConfirm", "onCancel"]);
     return new Promise((resolve) => {
       DialogGenerator(__spreadProps(__spreadValues({}, rest), {
         onConfirm: (val) => __async(void 0, null, function* () {
@@ -156,16 +157,22 @@ const useDialog = () => {
       }));
     });
   };
-  wrapAPI.confirm = (options) => Dialog(__spreadProps(__spreadValues({
-    type: "confirm"
-  }, formatProps(options)), {
-    theme: holderRef.current.theme
-  }));
-  wrapAPI.prompt = (options) => Dialog(__spreadProps(__spreadValues({
-    type: "prompt"
-  }, formatProps(options)), {
-    theme: holderRef.current.theme
-  }));
+  wrapAPI.confirm = (options) => {
+    var _a;
+    return Dialog(__spreadProps(__spreadValues({
+      type: "confirm"
+    }, formatProps(options)), {
+      theme: (_a = holderRef.current) == null ? void 0 : _a.theme
+    }));
+  };
+  wrapAPI.prompt = (options) => {
+    var _a;
+    return Dialog(__spreadProps(__spreadValues({
+      type: "prompt"
+    }, formatProps(options)), {
+      theme: (_a = holderRef.current) == null ? void 0 : _a.theme
+    }));
+  };
   return [wrapAPI, /* @__PURE__ */ React.createElement(Popup, { key: "dialog-holder", ref: holderRef })];
 };
 Dialog.confirm = confirm;

package/es/Input/Input.css

@@ -39,6 +39,10 @@
   outline: none;
   background-color: var(--background-color);
   font-size: var(--bui-text-size-2);
+  width: auto;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 .bui-input-input::placeholder {
   color: var(--bui-color-fg-subtle);

package/es/Popover/Popover.js

@@ -1,6 +1,4 @@
 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;
@@ -16,7 +14,6 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var __objRest = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -34,7 +31,8 @@ import React, { useState, useRef, useEffect } from "react";
 import {
   getStylesAndLocation,
   triggerEventTransform,
-  useUniqueId
+  useUniqueId,
+  throttle
 } from "@bifrostui/utils";
 import Portal from "../Portal";
 import "./Popover.css";
@@ -51,8 +49,7 @@ const Popover = /* @__PURE__ */ React.forwardRef((props, ref) => {
     trigger = "click",
     onOpenChange,
     open,
-    hideArrow,
-    PortalProps
+    hideArrow
   } = _a, others = __objRest(_a, [
     "className",
     "style",
@@ -64,8 +61,7 @@ const Popover = /* @__PURE__ */ React.forwardRef((props, ref) => {
     "trigger",
     "onOpenChange",
     "open",
-    "hideArrow",
-    "PortalProps"
+    "hideArrow"
   ]);
   const controlByUser = typeof open !== "undefined";
   const positionArr = placement.split(/([A-Z])/);
@@ -110,15 +106,7 @@ const Popover = /* @__PURE__ */ React.forwardRef((props, ref) => {
       return;
     hidePopover(event);
   };
-  useEffect(() => {
-    if (controlByUser)
-      return;
-    document.addEventListener("click", clickEventHandler);
-    return () => {
-      document.removeEventListener("click", clickEventHandler);
-    };
-  }, []);
-  const onRootElementMouted = () => {
+  const onRootElementMouted = throttle(() => {
     const result = getStylesAndLocation({
       childrenRef,
       arrowDirection,
@@ -135,7 +123,25 @@ const Popover = /* @__PURE__ */ React.forwardRef((props, ref) => {
       setArrowLocation(newArrowLocation);
     }
     setTooltyles(styles);
+  }, 100);
+  const bindEvent = () => {
+    if (!controlByUser) {
+      document.addEventListener("click", clickEventHandler);
+    }
+    window.addEventListener("resize", onRootElementMouted);
   };
+  const unbindEvent = () => {
+    if (!controlByUser) {
+      document.removeEventListener("click", clickEventHandler);
+    }
+    window.removeEventListener("resize", onRootElementMouted);
+  };
+  useEffect(() => {
+    bindEvent();
+    return () => {
+      unbindEvent();
+    };
+  }, []);
   if (!title && !content)
     return null;
   let triggerEventOption;
@@ -150,34 +156,26 @@ const Popover = /* @__PURE__ */ React.forwardRef((props, ref) => {
   const childrenOptions = __spreadValues({
     ref: childrenRef
   }, triggerEventOption);
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, open || openStatus ? /* @__PURE__ */ React.createElement(
-    Portal,
-    __spreadProps(__spreadValues({
-      onRootElementMouted
-    }, PortalProps), {
-      ref
-    }),
-    /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, open || openStatus ? /* @__PURE__ */ React.createElement(Portal, { onRootElementMouted, ref }, /* @__PURE__ */ React.createElement(
+    "div",
+    __spreadValues({
+      className: clsx(prefixCls, className, `popover-${arrowDirection}`, {
+        "bui-popover-arrow-hide": hideArrow
+      }),
+      "data-id": `tt_${ttId}`,
+      style: __spreadValues(__spreadValues({}, style), tooltyles)
+    }, others),
+    !hideArrow ? /* @__PURE__ */ React.createElement(
       "div",
-      __spreadValues({
-        className: clsx(prefixCls, className, `popover-${arrowDirection}`, {
-          "bui-popover-arrow-hide": hideArrow
-        }),
-        "data-id": `tt_${ttId}`,
-        style: __spreadValues(__spreadValues({}, style), tooltyles)
-      }, others),
-      !hideArrow ? /* @__PURE__ */ React.createElement(
-        "div",
-        {
-          className: clsx(
-            "bui-popover-arrow",
-            `location-${arrowLocation}`
-          )
-        }
-      ) : null,
-      /* @__PURE__ */ React.createElement("div", { className: "bui-popover-content" }, title ? /* @__PURE__ */ React.createElement("div", { className: "bui-popover-title" }, title) : null, content ? /* @__PURE__ */ React.createElement("div", { className: "bui-popover-inner-content" }, content) : null)
-    )
-  ) : null, React.isValidElement(children) ? React.cloneElement(children, childrenOptions) : children);
+      {
+        className: clsx(
+          "bui-popover-arrow",
+          `location-${arrowLocation}`
+        )
+      }
+    ) : null,
+    /* @__PURE__ */ React.createElement("div", { className: "bui-popover-content" }, title ? /* @__PURE__ */ React.createElement("div", { className: "bui-popover-title" }, title) : null, content ? /* @__PURE__ */ React.createElement("div", { className: "bui-popover-inner-content" }, content) : null)
+  )) : null, React.isValidElement(children) ? React.cloneElement(children, childrenOptions) : children);
 });
 Popover.displayName = "BuiPopover";
 var Popover_default = Popover;

package/es/Popover/Popover.types.d.ts

@@ -1,6 +1,5 @@
 import React from 'react';
 import { OverrideProps } from '@bifrostui/types';
-import { PortalCoreProps } from '../Portal/Portal.types';
 type triggerType = 'click' | 'hover';
 export type PopoverProps<D extends React.ElementType = 'div', P = {}> = OverrideProps<{
     props: P & {
@@ -39,10 +38,6 @@ export type PopoverProps<D extends React.ElementType = 'div', P = {}> = Override
          * @default 'click'
          */
         trigger?: triggerType | triggerType[];
-        /**
-         * Portal组件的属性
-         */
-        PortalProps?: PortalCoreProps;
         /**
          * 点击事件回调方法
          * - event 触发事件

package/es/Progress/Progress.css

@@ -1,5 +1,5 @@
 .bui-progress {
-  --fill-color: var(--bui-progress-fill-color, --bui-color-primary);
+  --fill-color: var(--bui-progress-fill-color, var(--bui-color-primary));
   --trail-color: var(--bui-progress-trail-color, rgba(156, 156, 165, 0.2));
   --stroke-width: var(--bui-progress-stroke-width, 8px);
   --width: var(--bui-progress-width, 100%);

package/es/Radio/Radio.css

@@ -1,7 +1,7 @@
 .bui-radio {
-  --label-color: var(--bui-radio-label-color, --bui-color-fg-default);
-  --label-font-size: var(--bui-radio-label-font-size, --bui-text-size-1);
-  --icon-font-size: var(--bui-radio-icon-font-size, --bui-title-size-2);
+  --label-color: var(--bui-radio-label-color, var(--bui-color-fg-default));
+  --label-font-size: var(--bui-radio-label-font-size, var(--bui-text-size-1));
+  --icon-font-size: var(--bui-radio-icon-font-size, var(--bui-title-size-2));
   --icon-padding: var(--bui-radio-icon-padding, 5px);
   display: inline-flex;
   align-items: center;

package/es/Slider/Slider.css

@@ -1,6 +1,6 @@
 .bui-slider {
-  --line-color: var(--bui-slider-line-color, --bui-color-primary);
-  --line-bg-color: var(--bui-slider-line-bg-color, --bui-color-border-default);
+  --line-color: var(--bui-slider-line-color, var(--bui-color-primary));
+  --line-bg-color: var(--bui-slider-line-bg-color, var(--bui-color-border-default));
   --width: var(--bui-slider-width, 100%);
   --height: var(--bui-slider-height, 2px);
   --padding: var(--bui-slider-padding, 19px 0);
@@ -12,9 +12,9 @@
   --tooltip-height: var(--bui-slider-tooltip-height, 24px);
   --tooltip-line-height: var(--bui-slider-tooltip-line-height, 24px);
   --tooltip-border-radius: var(--bui-slider-tooltip-border-radius, 24px);
-  --tooltip-font-size: var(--bui-tooltip-font-size, --bui-text-size-3);
-  --tooltip-color: var(--bui-tooltip-color, --bui-color-white);
-  --tooltip-bg-color: var(--bui-tooltip-bg-color, --line-color);
+  --tooltip-font-size: var(--bui-tooltip-font-size, var(--bui-text-size-3));
+  --tooltip-color: var(--bui-tooltip-color, var(--bui-color-white));
+  --tooltip-bg-color: var(--bui-tooltip-bg-color, var(--line-color));
   position: relative;
   width: var(--width);
   height: var(--height);
@@ -39,7 +39,7 @@
   top: 50%;
   left: 0;
   width: 100%;
-  height: var(---height);
+  height: var(--height);
   transform: translateY(-50%);
   background-color: var(--line-bg-color);
 }

package/es/ThemeProvider/ThemeProvider.types.d.ts

@@ -1,10 +1,6 @@
 import { ReactNode } from 'react';
 import { OverrideProps } from '@bifrostui/types';
 import { BaseLang } from '../locales/base';
-export type ThemeProviderProps<D extends React.ElementType = 'div', P = {}> = OverrideProps<{
-    props: P & ThemeProps;
-    defaultComponent: D;
-}, D>;
 export interface Breakpoints {
     /**
      * 超小屏幕 (小于 576px，实际为了处理临界值，断点值为 575.98px)
@@ -124,4 +120,8 @@ export type MountResponsiveTokenOptions = Pick<ThemeProps, 'responsive'> & {
 export type UpdateTokensOptions = Pick<ThemeProps, 'isRoot' | 'containerId' | 'container'> & {
     rootString: string;
 };
+export type ThemeProviderProps<D extends React.ElementType = 'div', P = {}> = OverrideProps<{
+    props: P & ThemeProps;
+    defaultComponent: D;
+}, D>;
 export { BaseLang, ResponsiveTokenOptions, ThemeProps, BuiltInThemesTokenOptions, componentsTokenOptions, };

package/es/Toast/FunctionalToast.js

@@ -32,7 +32,7 @@ var __objRest = (source, exclude) => {
 import { render, unmount, getRootElement } from "@bifrostui/utils";
 import React, { useCallback, useEffect, useState } from "react";
 import ToastView from "./Toast";
-const toastCloses = [];
+let toastCloses = [];
 const formatProps = (props) => {
   if (typeof props === "string") {
     return { message: props };
@@ -96,7 +96,12 @@ const functionalToast = (props) => {
         destroyAll();
       toastCloses.push(close);
       if (duration !== 0 && typeof duration === "number") {
-        timer = setTimeout(close, duration);
+        timer = setTimeout(() => {
+          close();
+          if (!allowMultiple) {
+            toastCloses = [];
+          }
+        }, duration);
       }
       return () => {
         clearTimeout(timer);
@@ -128,11 +133,14 @@ functionalToast.clear = () => {
 const useToast = () => {
   const holderRef = React.useRef(null);
   ["warning", "loading", "success", "fail"].forEach((methodName) => {
-    functionalToast[methodName] = (options) => functionalToast(__spreadProps(__spreadValues({
-      type: methodName
-    }, formatProps(options)), {
-      theme: holderRef.current.theme
-    }));
+    functionalToast[methodName] = (options) => {
+      var _a;
+      return functionalToast(__spreadProps(__spreadValues({
+        type: methodName
+      }, formatProps(options)), {
+        theme: (_a = holderRef.current) == null ? void 0 : _a.theme
+      }));
+    };
   });
   functionalToast.clear = () => {
     setTimeout(() => {

package/es/Toast/Toast.css

@@ -1,13 +1,14 @@
 .bui-toast {
   --min-width: var(--bui-toast-min-width, 86px);
   --max-width: var(--bui-toast-max-width, 80%);
+  --text-align: var(--bui-toast-text-align, center);
   --flex-direction: var(--bui-toast-flex-direction, column);
   --padding: var(--bui-toast-padding, var(--bui-spacing-xl));
   --position-top: var(--bui-toast-position-top, 15%);
   --position-bottom: var(--bui-toast-position-bottom, 85%);
   --background-color: var(--bui-toast-bg-color, rgba(0, 0, 0, 0.8));
-  --border-radius: var(--bui-toast-border-radius, --bui-shape-radius-default);
-  --icon-margin: var(--bui-toast-icon-margin-bottom, 8px);
+  --border-radius: var(--bui-toast-border-radius, var(--bui-shape-radius-default));
+  --icon-margin: var(--bui-toast-icon-margin, 0 0 8px);
   --icon-font-size: var(--bui-toast-icon-font-size, 30px);
   position: fixed;
   left: 50%;
@@ -22,7 +23,7 @@
   word-break: break-all;
   white-space: pre-wrap;
   background-color: var(--background-color);
-  text-align: center;
+  text-align: var(--text-align);
   font-family: var(--bui-font-family);
 }
 .bui-toast.bui-toast-allow-click {
@@ -48,6 +49,6 @@
   align-items: center;
 }
 .bui-toast-icon .bui-svg-icon {
-  margin: 0 0 var(--icon-margin);
+  margin: var(--icon-margin);
   font-size: var(--icon-font-size);
 }

package/es/Tooltip/Tooltip.js

@@ -1,6 +1,4 @@
 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;
@@ -16,7 +14,6 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var __objRest = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -34,7 +31,8 @@ import React, { useState, useRef, useEffect } from "react";
 import {
   getStylesAndLocation,
   triggerEventTransform,
-  useUniqueId
+  useUniqueId,
+  throttle
 } from "@bifrostui/utils";
 import Portal from "../Portal";
 import "./Tooltip.css";
@@ -49,8 +47,7 @@ const Tooltip = /* @__PURE__ */ React.forwardRef((props, ref) => {
     placement = "top",
     trigger = "click",
     onOpenChange,
-    open,
-    PortalProps
+    open
   } = _a, others = __objRest(_a, [
     "className",
     "style",
@@ -60,8 +57,7 @@ const Tooltip = /* @__PURE__ */ React.forwardRef((props, ref) => {
     "placement",
     "trigger",
     "onOpenChange",
-    "open",
-    "PortalProps"
+    "open"
   ]);
   const controlByUser = typeof open !== "undefined";
   const positionArr = placement.split(/([A-Z])/);
@@ -106,15 +102,7 @@ const Tooltip = /* @__PURE__ */ React.forwardRef((props, ref) => {
       return;
     hideTooltip(event);
   };
-  useEffect(() => {
-    if (controlByUser)
-      return;
-    document.addEventListener("click", clickEventHandler);
-    return () => {
-      document.removeEventListener("click", clickEventHandler);
-    };
-  }, []);
-  const onRootElementMouted = () => {
+  const onRootElementMouted = throttle(() => {
     const result = getStylesAndLocation({
       childrenRef,
       arrowDirection,
@@ -131,7 +119,25 @@ const Tooltip = /* @__PURE__ */ React.forwardRef((props, ref) => {
       setArrowLocation(newArrowLocation);
     }
     setTooltyles(styles);
+  }, 100);
+  const bindEvent = () => {
+    if (!controlByUser) {
+      document.addEventListener("click", clickEventHandler);
+    }
+    window.addEventListener("resize", onRootElementMouted);
   };
+  const unbindEvent = () => {
+    if (!controlByUser) {
+      document.removeEventListener("click", clickEventHandler);
+    }
+    window.removeEventListener("resize", onRootElementMouted);
+  };
+  useEffect(() => {
+    bindEvent();
+    return () => {
+      unbindEvent();
+    };
+  }, []);
   let triggerEventOption;
   if (!controlByUser) {
     triggerEventOption = triggerEventTransform({
@@ -144,29 +150,21 @@ const Tooltip = /* @__PURE__ */ React.forwardRef((props, ref) => {
   const childrenOptions = __spreadValues({
     ref: childrenRef
   }, triggerEventOption);
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, (open || openStatus) && title ? /* @__PURE__ */ React.createElement(
-    Portal,
-    __spreadProps(__spreadValues({
-      onRootElementMouted
-    }, PortalProps), {
-      ref
-    }),
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, (open || openStatus) && title ? /* @__PURE__ */ React.createElement(Portal, { onRootElementMouted, ref }, /* @__PURE__ */ React.createElement(
+    "div",
+    __spreadValues({
+      className: clsx(prefixCls, className, `tooltip-${arrowDirection}`),
+      style: __spreadValues(__spreadValues({}, style), tooltyles),
+      "data-id": `tt_${ttId}`
+    }, others),
     /* @__PURE__ */ React.createElement(
       "div",
-      __spreadValues({
-        className: clsx(prefixCls, className, `tooltip-${arrowDirection}`),
-        style: __spreadValues(__spreadValues({}, style), tooltyles),
-        "data-id": `tt_${ttId}`
-      }, others),
-      /* @__PURE__ */ React.createElement(
-        "div",
-        {
-          className: clsx("bui-tooltip-arrow", `location-${arrowLocation}`)
-        }
-      ),
-      /* @__PURE__ */ React.createElement("div", { className: "bui-tooltip-content" }, title)
-    )
-  ) : null, React.isValidElement(children) ? React.cloneElement(children, childrenOptions) : children);
+      {
+        className: clsx("bui-tooltip-arrow", `location-${arrowLocation}`)
+      }
+    ),
+    /* @__PURE__ */ React.createElement("div", { className: "bui-tooltip-content" }, title)
+  )) : null, React.isValidElement(children) ? React.cloneElement(children, childrenOptions) : children);
 });
 Tooltip.displayName = "BuiTooltip";
 var Tooltip_default = Tooltip;

package/es/Tooltip/Tooltip.types.d.ts

@@ -1,6 +1,5 @@
 import React from 'react';
 import { OverrideProps } from '@bifrostui/types';
-import { PortalCoreProps } from '../Portal/Portal.types';
 type triggerType = 'click' | 'hover';
 export type TooltipProps<D extends React.ElementType = 'div', P = {}> = OverrideProps<{
     props: P & {
@@ -30,10 +29,6 @@ export type TooltipProps<D extends React.ElementType = 'div', P = {}> = Override
          * @default 'click'
          */
         trigger?: triggerType | triggerType[];
-        /**
-         * Portal组件的属性
-         */
-        PortalProps?: PortalCoreProps;
         /**
          * 点击事件回调方法
          * - event 触发事件

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bifrostui/react",
-  "version": "1.4.0-beta.1",
+  "version": "1.4.0-beta.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.4.0-beta.1",
-    "@bifrostui/types": "1.4.0-beta.1",
-    "@bifrostui/styles": "1.4.0-beta.1",
-    "@bifrostui/utils": "1.4.0-beta.1"
+    "@bifrostui/icons": "1.4.0-beta.2",
+    "@bifrostui/styles": "1.4.0-beta.2",
+    "@bifrostui/types": "1.4.0-beta.2",
+    "@bifrostui/utils": "1.4.0-beta.2"
   },
   "peerDependencies": {
     "@tarojs/components": "^3.0.0",