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

package/es/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/es/Dialog/FunctionalDialog.js

@@ -62,7 +62,7 @@ const formatProps = (props) => {
 const DialogGenerator = (options) => {
   const dialogFragment = isMini ? document.createElement("div") : document.createDocumentFragment();
   const rootElement = 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 = useCallback(() => {

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

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

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

@@ -1,4 +1,4 @@
-import React from "react";
+import * as React from "react";
 import Dialog from "../../Dialog";
 const basicDialogDemo = () => {
   return /* @__PURE__ */ React.createElement(

package/es/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/es/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/es/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/es/Drawer/Drawer.js

@@ -30,7 +30,7 @@ var __objRest = (source, exclude) => {
   return target;
 };
 import clsx from "clsx";
-import React from "react";
+import * as React from "react";
 import Modal from "../Modal";
 import Slide from "../Slide";
 import "./index.css";

package/es/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/es/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;

package/es/Fade/Fade.js

@@ -36,7 +36,7 @@ import {
   getTransitionProps,
   useForkRef
 } from "@bifrostui/utils";
-import React from "react";
+import * as React from "react";
 import Transition from "../Transition";
 const defaultEasing = {
   enter: easing.easeOut,

package/es/Fade/Fade.miniapp.js

@@ -29,7 +29,7 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-import React, { useEffect, useState, useRef } from "react";
+import React, { useEffect, useState, useRef, useMemo } from "react";
 import {
   createTransitions,
   duration,
@@ -106,15 +106,18 @@ const Fade = /* @__PURE__ */ React.forwardRef((props, ref) => {
   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" }
-    )
+  const animation = useMemo(
+    () => transitions.create(
+      animationName,
+      getTransitionProps(
+        __spreadProps(__spreadValues({}, animationDurationAndDelay), {
+          style,
+          easing: easingProp
+        }),
+        { mode: inProp ? "enter" : "exit" }
+      )
+    ),
+    [inProp]
   );
   useEffect(() => {
     if (inProp && !isMounted) {
@@ -135,7 +138,7 @@ const Fade = /* @__PURE__ */ React.forwardRef((props, ref) => {
     } else {
       onExit == null ? void 0 : onExit(elementRef.current);
     }
-  }, [inProp, isMounted, shouldExecuteAnimation, onEnter, onExit]);
+  }, [inProp, isMounted]);
   const handleAnimationStart = () => {
     if (!shouldExecuteAnimation)
       return;

package/es/Fade/Fade.types.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { TransitionProps } from '../Transition';
 export interface FadeProps extends Omit<TransitionProps, 'children'> {
     children?: React.ReactElement;

package/es/IconButton/IconButton.d.ts

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

package/es/IconButton/IconButton.js

@@ -28,7 +28,7 @@ var __objRest = (source, exclude) => {
 };
 import { isMini } from "@bifrostui/utils";
 import clsx from "clsx";
-import React from "react";
+import * as React from "react";
 import "./index.css";
 const prefixCls = "bui-icon-btn";
 const IconButton = /* @__PURE__ */ React.forwardRef(

package/es/IconButton/IconButton.types.d.ts

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

package/es/Input/Input.types.d.ts

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

package/es/Input/__tests__/fixtures/A11yDemos.d.ts

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

package/es/Input/__tests__/fixtures/A11yDemos.js

@@ -1,4 +1,4 @@
-import React from "react";
+import * as React from "react";
 import Input from "../../Input";
 const basicInputDemo = () => {
   return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("label", null, "First name: ", /* @__PURE__ */ React.createElement(Input, { placeholder: "\u8BF7\u8F93\u5165\u5185\u5BB9" })));

package/es/ItemSelector/ItemSelector.miniapp.js

@@ -53,11 +53,13 @@ const ItemSelector = /* @__PURE__ */ React.forwardRef(
       const { screenHeight } = Taro.getSystemInfoSync();
       const query = Taro.createSelectorQuery();
       query.select(".bui-item-selector-scroll-view-container").boundingClientRect();
-      query.exec((codeRect) => {
-        var _a;
-        const domHeight = (_a = codeRect == null ? void 0 : codeRect[0]) == null ? void 0 : _a.height;
-        setHeight(`${domHeight / screenHeight * 100}vh`);
-      });
+      query.exec(
+        (codeRect) => {
+          var _a;
+          const domHeight = (_a = codeRect == null ? void 0 : codeRect[0]) == null ? void 0 : _a.height;
+          setHeight(`${domHeight / screenHeight * 100}vh`);
+        }
+      );
     }, [items]);
     const parseIndex = (length, index) => {
       if (index <= 0)

package/es/ItemSelector/ItemSelector.types.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { OverrideProps } from '@bifrostui/types';
 export type itemType = {
     /** Item名 */

package/es/ItemSelector/Selector/index.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { itemType } from '../ItemSelector.types';
 import './index.less';
 type propsType = {

package/es/ItemSelector/Selector/index.js

@@ -1,4 +1,4 @@
-import React from "react";
+import * as React from "react";
 import "./index.css";
 const Selector = (props) => {
   const { item, onSelect } = props;

package/es/List/List.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { ListProps } from './List.types';
 import './List.less';
 declare const List: React.ForwardRefExoticComponent<Omit<ListProps<"div", {}>, "ref"> & React.RefAttributes<HTMLElement>>;

package/es/List/List.js

@@ -27,7 +27,7 @@ var __objRest = (source, exclude) => {
   return target;
 };
 import clsx from "clsx";
-import React from "react";
+import * as React from "react";
 import ListContext from "./ListContext";
 import "./List.css";
 const prefixCls = "bui-list";

package/es/List/ListContext.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 interface IListContext {
     /** 是否展示分割线 */
     hideDivider?: boolean;

package/es/List/ListContext.js

@@ -1,4 +1,4 @@
-import React from "react";
+import * as React from "react";
 const ListContext = React.createContext({
   hideDivider: false
 });

package/es/List/ListItem.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { ListItemProps } from './ListItem.types';
 import './ListItem.less';
 declare const ListItem: React.ForwardRefExoticComponent<Omit<ListItemProps<"div", {}>, "ref"> & React.RefAttributes<HTMLElement>>;

package/es/List/ListItem.js

@@ -28,7 +28,7 @@ var __objRest = (source, exclude) => {
 };
 import { ArrowForwardIcon } from "@bifrostui/icons";
 import clsx from "clsx";
-import React from "react";
+import * as React from "react";
 import ListContext from "./ListContext";
 import ListItemFooter from "./ListItemFooter";
 import "./ListItem.css";

package/es/List/ListItem.types.d.ts

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

package/es/List/ListItemContent.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { ListItemContentProps } from './ListItemContent.types';
 import './ListItemContent.less';
 declare const ListItemContent: React.ForwardRefExoticComponent<Omit<ListItemContentProps<"div", {}>, "ref"> & React.RefAttributes<HTMLElement>>;

package/es/List/ListItemContent.js

@@ -27,7 +27,7 @@ var __objRest = (source, exclude) => {
   return target;
 };
 import clsx from "clsx";
-import React from "react";
+import * as React from "react";
 import "./ListItemContent.css";
 const prefixCls = "bui-list-item-content";
 const ListItemContent = /* @__PURE__ */ React.forwardRef(

package/es/List/ListItemContent.types.d.ts

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

package/es/List/ListItemExtra.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { ListItemExtraProps } from './ListItemExtra.types';
 import './ListItemExtra.less';
 declare const ListItemExtra: React.ForwardRefExoticComponent<Omit<ListItemExtraProps<"div", {}>, "ref"> & React.RefAttributes<HTMLElement>>;

package/es/List/ListItemExtra.js

@@ -27,7 +27,7 @@ var __objRest = (source, exclude) => {
   return target;
 };
 import clsx from "clsx";
-import React from "react";
+import * as React from "react";
 import "./ListItemExtra.css";
 const prefixCls = "bui-list-item-extra";
 const ListItemExtra = /* @__PURE__ */ React.forwardRef(

package/es/List/ListItemExtra.types.d.ts

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

package/es/List/ListItemFooter.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { ListItemFooterProps } from './ListItemFooter.types';
 import './ListItemFooter.less';
 declare const ListItemFooter: React.ForwardRefExoticComponent<Omit<ListItemFooterProps<"div", {}>, "ref"> & React.RefAttributes<HTMLElement>>;

package/es/List/ListItemFooter.js

@@ -27,7 +27,7 @@ var __objRest = (source, exclude) => {
   return target;
 };
 import clsx from "clsx";
-import React from "react";
+import * as React from "react";
 import "./ListItemFooter.css";
 const prefixCls = "bui-list-item-footer";
 const ListItemFooter = /* @__PURE__ */ React.forwardRef(

package/es/List/ListItemFooter.types.d.ts

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

package/es/List/ListItemHeader.d.ts

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

package/es/List/ListItemHeader.js

@@ -27,7 +27,7 @@ var __objRest = (source, exclude) => {
   return target;
 };
 import clsx from "clsx";
-import React from "react";
+import * as React from "react";
 import "./ListItemHeader.css";
 const prefixCls = "bui-list-item-header";
 const ListItemHeader = /* @__PURE__ */ React.forwardRef(

package/es/List/ListItemHeader.types.d.ts

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

package/es/Loading/Loading.d.ts

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

package/es/Loading/Loading.js

@@ -26,7 +26,7 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-import React from "react";
+import * as React from "react";
 import clsx from "clsx";
 import { LoadingThreeQuartersOutlinedIcon } from "@bifrostui/icons";
 import "./index.css";

package/es/Loading/Loading.types.d.ts

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

package/es/Modal/Modal.d.ts

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

package/es/Modal/Modal.js

@@ -30,7 +30,7 @@ var __objRest = (source, exclude) => {
   return target;
 };
 import clsx from "clsx";
-import React from "react";
+import * as React from "react";
 import Backdrop from "../Backdrop";
 import Portal from "../Portal";
 import { useModal } from "./useModal";

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

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { ViewProps } from '@tarojs/components';
 import './index.less';
 declare const Modal: React.ForwardRefExoticComponent<Omit<ViewProps & {

package/es/Modal/Modal.miniapp.js

@@ -30,7 +30,7 @@ var __objRest = (source, exclude) => {
   return target;
 };
 import clsx from "clsx";
-import React from "react";
+import * as React from "react";
 import { View } from "@tarojs/components";
 import Backdrop from "../Backdrop";
 import Portal from "../Portal";

package/es/Modal/__tests__/fixtures/A11yDemos.d.ts

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

package/es/Modal/__tests__/fixtures/A11yDemos.js

@@ -1,4 +1,4 @@
-import React from "react";
+import * as React from "react";
 import Modal from "../../Modal";
 const basicModalDemo = () => {
   return /* @__PURE__ */ React.createElement(Modal, { open: true, disablePortal: true }, "\u8FD9\u662F\u4E00\u4E2A\u57FA\u7840\u7684 Modal \u7EC4\u4EF6\u793A\u4F8B");

package/es/Modal/useModal.d.ts

@@ -7,6 +7,7 @@ export interface UseModalParameters {
     }) => void;
     open: boolean;
     rootRef?: React.Ref<Element>;
+    children?: React.ReactElement;
     [key: string]: any;
 }
 export interface UseModalReturnValue {