@bifrostui/react 2.0.0-alpha.3 → 2.0.0-alpha.30

package/dist/CollapsePanel/CollapsePanel.types.d.ts

@@ -1,5 +1,5 @@
 import { OverrideProps } from '@bifrostui/types';
-import React from 'react';
+import * as React from 'react';
 export type CollapsePanelItemProps<D extends React.ElementType = 'div', P = {}> = OverrideProps<{
     props: P & {
         /**

package/dist/CollapsePanel/CollapsePanelItem.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { CollapsePanelItemProps } from './CollapsePanel.types';
 declare const CollapsePanelItem: React.ForwardRefExoticComponent<Omit<CollapsePanelItemProps<"div", {}>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export default CollapsePanelItem;

package/dist/CollapsePanel/CollapsePanelItem.js

@@ -56,11 +56,11 @@ __export(CollapsePanelItem_exports, {
   default: () => CollapsePanelItem_default
 });
 module.exports = __toCommonJS(CollapsePanelItem_exports);
-var import_react = __toESM(require("react"));
+var React = __toESM(require("react"));
 var import_clsx = __toESM(require("clsx"));
 var import_Collapse = require("../Collapse");
 const prefixCls = "bui-collapse-panel-item";
-const CollapsePanelItem = /* @__PURE__ */ import_react.default.forwardRef(
+const CollapsePanelItem = /* @__PURE__ */ React.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       className,
@@ -83,14 +83,14 @@ const CollapsePanelItem = /* @__PURE__ */ import_react.default.forwardRef(
     const getIcon = () => {
       return typeof icon === "function" ? icon(active) : icon;
     };
-    return /* @__PURE__ */ import_react.default.createElement(
+    return /* @__PURE__ */ React.createElement(
       "div",
       __spreadValues({
         className: (0, import_clsx.default)(prefixCls, active && `${prefixCls}-active`, className),
         style,
         ref
       }, others),
-      /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-header`, onClick }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-header-label` }, label), /* @__PURE__ */ import_react.default.createElement(
+      /* @__PURE__ */ React.createElement("div", { className: `${prefixCls}-header`, onClick }, /* @__PURE__ */ React.createElement("div", { className: `${prefixCls}-header-label` }, label), /* @__PURE__ */ React.createElement(
         "div",
         {
           className: (0, import_clsx.default)(
@@ -103,7 +103,7 @@ const CollapsePanelItem = /* @__PURE__ */ import_react.default.forwardRef(
         },
         getIcon()
       )),
-      /* @__PURE__ */ import_react.default.createElement(import_Collapse.Collapse, { in: active, direction: "vertical", timeout: 300 }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-content` }, children))
+      /* @__PURE__ */ React.createElement(import_Collapse.Collapse, { in: active, direction: "vertical", timeout: 300 }, /* @__PURE__ */ React.createElement("div", { className: `${prefixCls}-content` }, children))
     );
   }
 );

package/dist/Countdown/Countdown.types.d.ts

@@ -1,5 +1,5 @@
 import { OverrideProps } from '@bifrostui/types';
-import React from 'react';
+import * as React from 'react';
 /**
  * 当前时间
  */
@@ -115,7 +115,7 @@ export interface CountdownItem {
 /**
  * 格式化倒计时
  */
-export type FormatedCountdown = {
+export type FormattedCountdown = {
     /**
      * 剩余总时间
      */

package/dist/Countdown/__tests__/fixtures/A11yDemos.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 /**
  * 自定义 Countdown 组件 Demo 集合
  * 这个文件包含多个测试 demo，展示如何使用 getCustomDemoCodesFromFile 进行无障碍测试

package/dist/Countdown/__tests__/fixtures/A11yDemos.js

@@ -37,16 +37,16 @@ __export(A11yDemos_exports, {
   serverTimestampCountdownDemo: () => serverTimestampCountdownDemo
 });
 module.exports = __toCommonJS(A11yDemos_exports);
-var import_react = __toESM(require("react"));
+var React = __toESM(require("react"));
 var import_Countdown = __toESM(require("../../Countdown"));
 const basicCountdownDemo = () => {
-  return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(import_Countdown.default, { remainingTime: 60 * 1e3 }));
+  return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(import_Countdown.default, { remainingTime: 60 * 1e3 }));
 };
 const ariaLabelCountdownDemo = () => {
-  return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(import_Countdown.default, { remainingTime: 120 * 1e3, "aria-label": "\u4FC3\u9500\u6D3B\u52A8\u7ED3\u675F\u5012\u8BA1\u65F6" }));
+  return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(import_Countdown.default, { remainingTime: 120 * 1e3, "aria-label": "\u4FC3\u9500\u6D3B\u52A8\u7ED3\u675F\u5012\u8BA1\u65F6" }));
 };
 const ariaLabelledbyCountdownDemo = () => {
-  return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("h3", { id: "flash-sale-title" }, "\u9650\u65F6\u62A2\u8D2D"), /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("h3", { id: "flash-sale-title" }, "\u9650\u65F6\u62A2\u8D2D"), /* @__PURE__ */ React.createElement(
     import_Countdown.default,
     {
       remainingTime: 180 * 1e3,
@@ -55,30 +55,30 @@ const ariaLabelledbyCountdownDemo = () => {
   ));
 };
 const ariaDescribedbyCountdownDemo = () => {
-  return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(
     import_Countdown.default,
     {
       remainingTime: 240 * 1e3,
       "aria-describedby": "countdown-description"
     }
-  ), /* @__PURE__ */ import_react.default.createElement("p", { id: "countdown-description" }, "\u5012\u8BA1\u65F6\u7ED3\u675F\u540E\uFF0C\u4F18\u60E0\u4EF7\u683C\u5C06\u6062\u590D\u4E3A\u539F\u4EF7"));
+  ), /* @__PURE__ */ React.createElement("p", { id: "countdown-description" }, "\u5012\u8BA1\u65F6\u7ED3\u675F\u540E\uFF0C\u4F18\u60E0\u4EF7\u683C\u5C06\u6062\u590D\u4E3A\u539F\u4EF7"));
 };
 const customRenderCountdownDemo = () => {
-  return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(
     import_Countdown.default,
     {
       remainingTime: 300 * 1e3,
       renderContent: ({ hours, minutes, seconds }) => {
-        return /* @__PURE__ */ import_react.default.createElement("span", null, "\u8DDD\u79BB\u5012\u8BA1\u65F6\u7ED3\u675F\u8FD8\u5269", hours, "\u5C0F\u65F6", minutes, "\u5206\u949F", seconds, "\u79D2");
+        return /* @__PURE__ */ React.createElement("span", null, "\u8DDD\u79BB\u5012\u8BA1\u65F6\u7ED3\u675F\u8FD8\u5269", hours, "\u5C0F\u65F6", minutes, "\u5206\u949F", seconds, "\u79D2");
       }
     }
   ));
 };
 const endTimestampCountdownDemo = () => {
-  return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(import_Countdown.default, { endTimestamp: Date.now() + 360 * 1e3 }));
+  return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(import_Countdown.default, { endTimestamp: Date.now() + 360 * 1e3 }));
 };
 const serverTimestampCountdownDemo = () => {
-  return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(
     import_Countdown.default,
     {
       serverTimestamp: Date.now() - 10 * 1e3,

package/dist/Countdown/utils.d.ts

@@ -1,4 +1,4 @@
-import { CurrentTime, FormatedCountdown } from './Countdown.types';
+import { CurrentTime, FormattedCountdown } from './Countdown.types';
 /**
  * 解析时间，将结束时间戳拆分为剩余时间对象
  */
@@ -6,4 +6,4 @@ export declare const parseTime: (endTime: number, offsetTime: number) => Current
 /**
  * 格式化倒计时，将剩余时间格式化为指定格式，并拆分位各个时间模块
  */
-export declare const formatCountdown: (duration: number, format: string) => FormatedCountdown;
+export declare const formatCountdown: (duration: number, format: string) => FormattedCountdown;

package/dist/Countdown/utils.js

@@ -49,9 +49,9 @@ const preAppend = (num) => {
   return num < 10 ? `0${num}` : `${num}`;
 };
 const parseTime = (endTime, offsetTime) => {
-  const now = (/* @__PURE__ */ new Date()).getTime();
-  let total = endTime - now - offsetTime || 0;
-  total = total < 0 ? 0 : total;
+  const now = Date.now();
+  const t = endTime - now - offsetTime || 0;
+  const total = Math.max(0, t);
   const years = Math.floor(total / YEAR);
   const months = Math.floor(total / MONTH);
   const days = Math.floor(total / DAY);
@@ -73,7 +73,7 @@ const parseTime = (endTime, offsetTime) => {
 const formatCountdown = (duration, format) => {
   let timeList = [];
   let leftDuration = duration;
-  const escapeRegex = /\[[^\]]*]/g;
+  const escapeRegex = /\[(?:[^\]]{0,100})\]/g;
   const keepList = (format.match(escapeRegex) || []).map(
     (str) => str.slice(1, -1)
   );

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/DatePicker/DatePicker.types.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { OverrideProps } from '@bifrostui/types';
 import { PickerProps, IPickerOptionItem } from '../Picker';
 import { DatePickerType } from './constants';

package/dist/DesktopPicker/DesktopPicker.types.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { OverrideProps } from '@bifrostui/types';
 import { BackdropProps } from '../Backdrop/Backdrop.types';
 export type DesktopPickerProps<D extends React.ElementType = 'div', P = {}> = OverrideProps<{

package/dist/DesktopTimePicker/DesktopTimePicker.types.d.ts

@@ -10,6 +10,17 @@ export type TimeSteps = {
     minute?: number;
     second?: number;
 };
+/** 时间面板单元格对象 */
+export interface ITimeInstance {
+    value: number | string;
+    label: string;
+    disabled: boolean;
+}
+export type DisabledTimeView = () => {
+    hour?: () => number[];
+    minute?: (selectedHour: number) => number[];
+    second?: (selectedHour: number, selectedMinute: number) => number[];
+};
 export type TimePickerProps<D extends React.ElementType = 'div', P = {}> = OverrideProps<{
     props: P & {
         /**
@@ -105,11 +116,6 @@ export type TimePickerProps<D extends React.ElementType = 'div', P = {}> = Overr
     };
     defaultComponent: D;
 }, D>;
-export type DisabledTimeView = () => {
-    hour?: () => number[];
-    minute?: (selectedHour: number) => number[];
-    second?: (selectedHour: number, selectedMinute: number) => number[];
-};
 export interface TimePickerContentProps {
     setIsOpen: Function;
     triggerChange: Function;
@@ -160,12 +166,6 @@ export interface TimePickerContentProps {
      */
     setIsInvalid: (a: boolean) => void;
 }
-/** 时间面板单元格对象 */
-export interface ITimeInstance {
-    value: number | string;
-    label: string;
-    disabled: boolean;
-}
 /** 时分秒面板单元格对象 */
 export interface ITimeItemNumberInstance {
     value: number;

package/dist/DesktopTimePicker/useGetTimePickerContent.js

@@ -114,7 +114,7 @@ const useGetTimePickerContent = (props) => {
     return lists.map((type, index) => {
       var _a;
       const dataList = getViewListData(type, timeSteps[type]);
-      const disabledTime = (0, import_utils.getdisabledTime)(
+      const disabledTime = (0, import_utils.getDisabledTime)(
         type,
         timeValue,
         minTime,
@@ -152,7 +152,7 @@ const useGetTimePickerContent = (props) => {
         const updateHour = (hour) => validTime.format("A") === "PM" ? hour + 12 : hour;
         const getValidTimeValue = (view, newTimeValue) => {
           var _a2, _b;
-          let viewDisabledTime = (0, import_utils.getdisabledTime)(
+          let viewDisabledTime = (0, import_utils.getDisabledTime)(
             view,
             newTimeValue,
             minTime,

package/dist/DesktopTimePicker/utils/utils.d.ts

@@ -23,6 +23,6 @@ export declare const getOutOfMinRangeMinutes: (hourValue: number, minTime: Dayjs
 export declare const getOutOfMaxRangeMinutes: (hourValue: number, maxTime: Dayjs, dataList: ITimeItemNumberInstance[]) => number[];
 export declare const getOutOfMinRangeSeconds: (hourValue: number, minuteValue: number, minTime: Dayjs, dataList: ITimeItemNumberInstance[]) => number[];
 export declare const getOutOfMaxRangeSeconds: (hourValue: number, minuteValue: number, maxTime: Dayjs, dataList: ITimeItemNumberInstance[]) => number[];
-export declare const getdisabledTime: (type: ViewTypeWithMeridiem, timeValue: Dayjs, minTime: Dayjs, maxTime: Dayjs, dataList: ITimeInstance[], disabledTimeView: DisabledTimeView, timeSteps: TimeSteps, ampm?: boolean) => (string | number)[];
+export declare const getDisabledTime: (type: ViewTypeWithMeridiem, timeValue: Dayjs, minTime: Dayjs, maxTime: Dayjs, dataList: ITimeInstance[], disabledTimeView: DisabledTimeView, timeSteps: TimeSteps, ampm?: boolean) => (string | number)[];
 export declare const calculateValidMinTime: (disabledTimeView: DisabledTimeView, minTime?: Dayjs) => dayjs.Dayjs;
 export declare const dateToDayjs: (date: Date) => dayjs.Dayjs;

package/dist/DesktopTimePicker/utils/utils.js

@@ -29,13 +29,13 @@ var utils_exports = {};
 __export(utils_exports, {
   calculateValidMinTime: () => calculateValidMinTime,
   dateToDayjs: () => dateToDayjs,
+  getDisabledTime: () => getDisabledTime,
   getIsRangeDate: () => getIsRangeDate,
   getIsRangeTime: () => getIsRangeTime,
   getOutOfMaxRangeMinutes: () => getOutOfMaxRangeMinutes,
   getOutOfMaxRangeSeconds: () => getOutOfMaxRangeSeconds,
   getOutOfMinRangeMinutes: () => getOutOfMinRangeMinutes,
   getOutOfMinRangeSeconds: () => getOutOfMinRangeSeconds,
-  getdisabledTime: () => getdisabledTime,
   isDisabledTime: () => isDisabledTime,
   isDisabledViewTime: () => isDisabledViewTime
 });
@@ -143,7 +143,7 @@ const getOutOfMaxRangeSeconds = (hourValue, minuteValue, maxTime, dataList) => {
   }
   return outOfMaxRangeMinutes;
 };
-const getdisabledTime = (type, timeValue, minTime, maxTime, dataList, disabledTimeView, timeSteps, ampm) => {
+const getDisabledTime = (type, timeValue, minTime, maxTime, dataList, disabledTimeView, timeSteps, ampm) => {
   var _a, _b, _c, _d, _e;
   const isRangeDate = getIsRangeDate(timeValue, minTime, maxTime);
   if (!isRangeDate) {
@@ -396,13 +396,13 @@ const dateToDayjs = (date) => {
 0 && (module.exports = {
   calculateValidMinTime,
   dateToDayjs,
+  getDisabledTime,
   getIsRangeDate,
   getIsRangeTime,
   getOutOfMaxRangeMinutes,
   getOutOfMaxRangeSeconds,
   getOutOfMinRangeMinutes,
   getOutOfMinRangeSeconds,
-  getdisabledTime,
   isDisabledTime,
   isDisabledViewTime
 });

package/dist/Dialog/Dialog.js

@@ -82,7 +82,9 @@ const Dialog = /* @__PURE__ */ import_react.default.forwardRef((props, ref) => {
     placeholder,
     InputProps,
     className,
-    theme
+    theme,
+    okButtonProps,
+    cancelButtonProps
   } = _a, others = __objRest(_a, [
     "open",
     "onOk",
@@ -95,7 +97,9 @@ const Dialog = /* @__PURE__ */ import_react.default.forwardRef((props, ref) => {
     "placeholder",
     "InputProps",
     "className",
-    "theme"
+    "theme",
+    "okButtonProps",
+    "cancelButtonProps"
   ]);
   const inputRef = (0, import_react.useRef)(null);
   const titleId = (0, import_utils.useUniqueId)();
@@ -118,20 +122,23 @@ const Dialog = /* @__PURE__ */ import_react.default.forwardRef((props, ref) => {
   };
   const actionsNode = /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-actions` }, !isAlertMode && /* @__PURE__ */ import_react.default.createElement(
     import_Button.Button,
-    {
-      variant: "text",
+    __spreadValues({
+      variant: "subtle",
+      color: "primary",
+      size: "full",
       onClick: handleCancel,
-      className: `${prefixCls}-actions-btn`
-    },
+      className: `${prefixCls}-actions-btn-cancel`
+    }, cancelButtonProps),
     cancelText || cancel
   ), /* @__PURE__ */ import_react.default.createElement(
     import_Button.Button,
-    {
-      variant: "text",
+    __spreadValues({
+      variant: "contained",
       color: "primary",
+      size: "full",
       onClick: handleOk,
-      className: `${prefixCls}-actions-btn`
-    },
+      className: `${prefixCls}-actions-btn-ok`
+    }, okButtonProps),
     okText || ok
   ));
   const inputNode = isPromptMode && /* @__PURE__ */ import_react.default.createElement(
@@ -148,12 +155,12 @@ const Dialog = /* @__PURE__ */ import_react.default.forwardRef((props, ref) => {
   const ariaDescribedBy = content ? contentId : void 0;
   return /* @__PURE__ */ import_react.default.createElement(
     import_Modal.default,
-    __spreadProps(__spreadValues({}, others), {
+    __spreadValues({
       open,
       ref,
       className: (0, import_clsx.default)(prefixCls, `${prefixCls}-${type}`, className),
       onClose: handleCancel
-    }),
+    }, others),
     /* @__PURE__ */ import_react.default.createElement(
       "div",
       {

package/dist/Dialog/Dialog.types.d.ts

@@ -1,6 +1,7 @@
 import React, { ReactNode } from 'react';
 import { ModalProps } from '../Modal/Modal.types';
 import { InputProps } from '../Input/Input.types';
+import { ButtonProps } from '../Button/Button.types';
 import { ThemeProps } from '../ThemeProvider/ThemeProvider.types';
 /**
  * 对话框类型
@@ -29,6 +30,14 @@ export interface DialogProps extends Omit<ModalProps, 'title' | 'content'> {
      * 透传给内部Input组件的属性
      */
     InputProps?: Partial<InputProps>;
+    /**
+     * 透传给内部Button组件的属性
+     */
+    okButtonProps?: Partial<ButtonProps> & Record<`data-${string}`, any>;
+    /**
+     * 透传给内部Button组件的属性
+     */
+    cancelButtonProps?: Partial<ButtonProps> & Record<`data-${string}`, any>;
     /**
      * 确认按钮文本内容
      */
@@ -71,6 +80,10 @@ export type DialogOptions = Omit<DialogProps, 'placeholder' | 'inputProps' | 'on
      * 取消回调
      */
     onCancel?: (e: React.SyntheticEvent) => void;
+    /**
+     * 透传 data- 属性
+     */
+    [key: `data-${string}`]: any;
 };
 /**
  * prompt函数式调用配置参数

package/dist/Dialog/FunctionalDialog.js

@@ -92,7 +92,7 @@ const formatProps = (props) => {
 const DialogGenerator = (options) => {
   const dialogFragment = import_utils.isMini ? document.createElement("div") : document.createDocumentFragment();
   const rootElement = (0, import_utils.getRootContainer)(options == null ? void 0 : options.container);
-  rootElement.appendChild(dialogFragment);
+  rootElement == null ? void 0 : rootElement.appendChild(dialogFragment);
   const DialogWrapper = () => {
     const _a = options, { onOk, onCancel } = _a, rest = __objRest(_a, ["onOk", "onCancel"]);
     const close = (0, import_react.useCallback)(() => {

package/dist/Dialog/__tests__/fixtures/A11yDemos.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 /**
  * 自定义 Dialog 组件 Demo 集合
  * 这个文件包含多个测试 demo，展示如何使用 getCustomDemoCodesFromFile 进行无障碍测试

package/dist/Dialog/__tests__/fixtures/A11yDemos.js

@@ -32,10 +32,10 @@ __export(A11yDemos_exports, {
   promptDialogDemo: () => promptDialogDemo
 });
 module.exports = __toCommonJS(A11yDemos_exports);
-var import_react = __toESM(require("react"));
+var React = __toESM(require("react"));
 var import_Dialog = __toESM(require("../../Dialog"));
 const basicDialogDemo = () => {
-  return /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ React.createElement(
     import_Dialog.default,
     {
       open: true,
@@ -46,7 +46,7 @@ const basicDialogDemo = () => {
   );
 };
 const promptDialogDemo = () => {
-  return /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ React.createElement(
     import_Dialog.default,
     {
       open: true,
@@ -59,7 +59,7 @@ const promptDialogDemo = () => {
   );
 };
 const alertDialogDemo = () => {
-  return /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ React.createElement(
     import_Dialog.default,
     {
       open: true,

package/dist/Dialog/index.css

@@ -1,17 +1,9 @@
 :root,
 page,
 xhs-page {
-  --bui-dialog-max-width: 300px;
-  --bui-dialog-border-radius: var(--bui-shape-radius-drawer);
-  --bui-dialog-title-padding: 0 40px 9px;
-  --bui-dialog-content-padding: 0 24px;
-  --bui-dialog-actions-margin: 15px 0 0 0;
-  --bui-dialog-button-height: 53px;
-  --bui-dialog-button-line-height: 25px;
-  --bui-dialog-button-padding: 12px 0 13px;
-  --bui-dialog-button-font-size: 17px;
-  --bui-dialog-button-border-left: 1px solid rgba(0, 0, 0, 0.05);
-  --bui-dialog-button-active-bg-color: rgba(54, 57, 64, 0.05);
+  --bui-dialog-width: 300px;
+  --bui-dialog-border-radius: var(--bui-radius-8);
+  --bui-dialog-padding: 24px;
 }
 .bui-dialog {
   display: flex;
@@ -19,60 +11,45 @@ xhs-page {
   justify-content: center;
 }
 .bui-dialog-container {
-  padding-top: 21px;
-  min-width: var(--bui-dialog-max-width);
+  padding: var(--bui-dialog-padding);
+  position: relative;
+  width: var(--bui-dialog-width);
   margin: 0 auto;
   border-radius: var(--bui-dialog-border-radius);
   background-clip: padding-box;
   background-color: var(--bui-color-bg-view);
-  line-height: 21px;
 }
 .bui-dialog-title {
-  padding: var(--bui-dialog-title-padding);
+  padding-bottom: 12px;
   font-size: var(--bui-title-size-2);
   text-align: center;
   color: var(--bui-color-fg-default);
-  font-weight: var(--bui-font-weight-medium);
-}
-.bui-dialog-title + .bui-dialog-actions {
-  margin-top: var(--bui-spacing-sm);
+  font-weight: var(--bui-font-weight-semibold);
+  line-height: 1.4;
+  margin: 0;
 }
 .bui-dialog-content {
-  padding: var(--bui-dialog-content-padding);
+  padding-bottom: 18px;
   color: var(--bui-color-fg-muted);
   font-size: var(--bui-title-size-4);
   text-align: center;
+  line-height: 1.5;
 }
 .bui-dialog-content:first-child {
   padding-top: 0;
 }
+.bui-dialog-content:last-child {
+  padding-bottom: 0;
+}
 .bui-dialog-actions {
-  margin: var(--bui-dialog-actions-margin);
-  border-top: 1px solid rgba(0, 0, 0, 0.05);
   display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
 }
-.bui-dialog-actions-btn {
-  flex: 1;
-  display: block;
-  width: 100%;
-  height: var(--bui-dialog-button-height);
-  line-height: var(--bui-dialog-button-line-height);
-  padding: var(--bui-dialog-button-padding);
-  font-size: var(--bui-dialog-button-font-size);
-  border: 0;
-  outline: 0;
-  border-left: var(--bui-dialog-button-border-left);
-  border-radius: 0;
-  text-align: center;
-  box-sizing: border-box;
-}
-.bui-dialog-actions-btn:first-child {
-  border: none;
-}
-.bui-dialog-actions-btn:active {
-  background-color: var(--bui-dialog-button-active-bg-color);
+.bui-dialog-actions > * + * {
+  margin-left: var(--bui-spacing-lg);
 }
 .bui-dialog-input {
-  width: calc(100% - 48px);
-  margin: 14px 24px 0;
+  margin-bottom: 18px;
 }

package/dist/Divider/Divider.types.d.ts

@@ -1,5 +1,5 @@
 import { OverrideProps } from '@bifrostui/types';
-import React from 'react';
+import * as React from 'react';
 export type DividerProps<D extends React.ElementType = 'div', P = {}> = OverrideProps<{
     props: P & {
         /**

package/dist/Drawer/Drawer.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { DrawerProps } from './Drawer.types';
 import './index.less';
 declare const Drawer: React.ForwardRefExoticComponent<Omit<DrawerProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/Drawer/Drawer.js

@@ -60,7 +60,7 @@ __export(Drawer_exports, {
 });
 module.exports = __toCommonJS(Drawer_exports);
 var import_clsx = __toESM(require("clsx"));
-var import_react = __toESM(require("react"));
+var React = __toESM(require("react"));
 var import_Modal = __toESM(require("../Modal"));
 var import_Slide = __toESM(require("../Slide"));
 var import_index = require("./index.css");
@@ -71,7 +71,7 @@ const oppositeDirection = {
   top: "down",
   bottom: "up"
 };
-const Drawer = /* @__PURE__ */ import_react.default.forwardRef((props, ref) => {
+const Drawer = /* @__PURE__ */ React.forwardRef((props, ref) => {
   const _a = props, {
     anchor: anchorProp = "bottom",
     container,
@@ -98,7 +98,7 @@ const Drawer = /* @__PURE__ */ import_react.default.forwardRef((props, ref) => {
     "transitionDuration"
   ]);
   const anchorInvariant = oppositeDirection[anchorProp];
-  return /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ React.createElement(
     import_Modal.default,
     __spreadValues({
       container,
@@ -109,14 +109,14 @@ const Drawer = /* @__PURE__ */ import_react.default.forwardRef((props, ref) => {
       className: (0, import_clsx.default)(prefixCls, className),
       disablePortal
     }, others),
-    /* @__PURE__ */ import_react.default.createElement(
+    /* @__PURE__ */ React.createElement(
       import_Slide.default,
       __spreadValues({
         in: open,
         direction: anchorInvariant,
         timeout: transitionDuration
       }, SlideProps),
-      /* @__PURE__ */ import_react.default.createElement(
+      /* @__PURE__ */ React.createElement(
         "div",
         __spreadProps(__spreadValues({}, contentProps), {
           className: (0, import_clsx.default)(

package/dist/Drawer/Drawer.types.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { ModalProps } from '../Modal/Modal.types';
 import { SlideProps } from '../Slide/Slide.types';
 import { TransitionProps } from '../Transition';

package/dist/Fade/Fade.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { FadeProps } from './Fade.types';
 declare const Fade: React.ForwardRefExoticComponent<FadeProps & React.RefAttributes<HTMLElement>>;
 export default Fade;