@bifrostui/react 1.3.1-beta.1 → 1.3.2

package/es/Tabs/Tabs.css

@@ -1,14 +1,11 @@
 .bui-tabs {
-  --height: var(--bui-tabs-height, 39px);
+  --height: 39px;
   --font-size: var(--bui-text-size-1);
   --color: var(--bui-color-fg-subtle);
   --active-color: var(--bui-color-fg-default);
   --line-color: var(--bui-color-primary);
-  --line-height: var(--bui-tabs-line-height, 3PX);
-  --line-width: var(--bui-tabs-line-width, 18px);
-  --mask-height: var(--bui-tabs-mask-height, 100%);
-  --tab-height: var(--bui-tab-height, 100%);
-  --tab-padding: var(--bui-tab-padding, var(--bui-spacing-lg) var(--bui-spacing-lg) 10px);
+  --line-height: 3PX;
+  --line-width: 18px;
   position: relative;
   font-family: var(--bui-font-family);
 }
@@ -43,7 +40,7 @@
   bottom: 0;
   z-index: 1;
   width: 12px;
-  height: var(--bui-tabs-mask-height);
+  height: 100%;
   pointer-events: none;
 }
 .bui-tabs-mask-left {

package/es/Tag/Tag.css

@@ -1,12 +1,15 @@
 .bui-tag {
+  --color: var(--bui-tag-color, var(--bui-color-gray));
+  --border-color: var(--bui-tag-border-color, var(--bui-color-border-gray));
+  --bg-color: var(--bui-tag-bg-color, var(--bui-color-gray));
   position: relative;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   white-space: nowrap;
-  height: var(--tag-height);
-  line-height: var(--tag-line-height);
-  padding: var(--tag-padding);
+  height: 15px;
+  line-height: 15px;
+  padding: 0 var(--bui-spacing-xs);
   font-size: var(--bui-text-size-5);
   font-weight: var(--bui-font-weight-normal);
   border-radius: var(--bui-shape-radius-label);
@@ -16,8 +19,8 @@
   font-family: var(--bui-font-family);
 }
 .bui-tag-outlined {
-  color: var(--tag-color);
-  border: 1px solid var(--tag-border-color);
+  color: var(--color);
+  border: 1px solid var(--border-color);
 }
 .bui-tag-outlined.bui-tag-primary {
   color: var(--bui-color-primary);
@@ -44,7 +47,7 @@
   border: 1px solid var(--bui-color-border-primary);
 }
 .bui-tag-contained {
-  background-color: var(--tag-bg-color);
+  background-color: var(--bg-color);
 }
 .bui-tag-contained.bui-tag-primary {
   background-color: var(--bui-color-primary);
@@ -89,6 +92,6 @@
   color: var(--bui-color-danger);
 }
 .bui-tag-light.bui-tag-vip {
-  background-color: var(--tag-bg-color-vip);
+  background-color: rgba(255, 134, 110, 0.3);
   color: var(--bui-color-vip);
 }

package/es/Tag/TagGroup.css

@@ -1,12 +1,4 @@
 .bui-tag-group {
-  --height: var(--bui-tag-group-divider-height, 13%);
-  --tag-color: var(--bui-tag-color, var(--bui-color-gray));
-  --tag-border-color: var(--bui-tag-border-color, var(--bui-color-border-gray));
-  --tag-bg-color: var(--bui-tag-bg-color, var(--bui-color-gray));
-  --tag-height: var(--bui-tag-height, 15px);
-  --tag-line-height: var(--bui-tag-line-height, 15px);
-  --tag-padding: var(--bui-tag-padding, 0 var(--bui-spacing-xs));
-  --tag-bg-color-vip: var(--bui-tag-color-vip, rgba(255, 134, 110, 0.3));
   display: inline-flex;
   font-family: var(--bui-font-family);
 }
@@ -32,7 +24,7 @@
   position: absolute;
   right: -1px;
   width: 1px;
-  height: var(--height);
+  height: 13%;
   color: #fff;
   background-color: #fff;
   border-right-style: solid;

package/es/TextArea/TextArea.css

@@ -1,19 +1,13 @@
 .bui-textarea {
-  --width: var(--bui-textarea-width, 100%);
   --bg-color: var(--bui-color-bg-default);
-  --text-color: var(--bui-textarea-text-color, var(--bui-color-fg-subtle));
+  --text-color: var(--bui-color-fg-subtle);
   --count-bg-color: var(--bg-color, var(--bui-color-bg-default));
-  --count-text-color: var(--bui-textarea-count-color, var(--bui-color-fg-subtle));
-  --text-font-size: var(--bui-textarea-text-font-size, var(--bui-text-size-2));
-  --count-font-size: var(--bui-textarea-count-font-size, var(--bui-title-size-3));
-  --content-padding: var(--bui-textarea-padding, 8px);
-  --count-padding: var(--bui-textarea-count-padding, 0 4px);
-  --placeholder-line-height: var(--bui-textarea-placeholder-line-height, 1.3);
+  --count-text-color: var(--bui-color-fg-subtle);
   background: var(--bui-color-bg-default);
   font-family: var(--bui-font-family);
 }
 .bui-textarea textarea {
-  font-size: var(--text-font-size);
+  font-size: var(--bui-text-size-2);
   color: var(--text-color);
   line-height: var(--bui-line-height);
 }
@@ -27,10 +21,10 @@
   display: none;
 }
 .bui-textarea-content {
-  width: var(--width);
+  width: 100%;
   resize: none;
   background: var(--bg-color);
-  padding: var(--content-padding);
+  padding: 8px;
   border: none;
   outline: none;
   word-break: break-all;
@@ -38,12 +32,12 @@
 }
 .bui-textarea-content::placeholder {
   color: var(--bui-color-fg-disabled);
-  line-height: var(--placeholder-line-height);
+  line-height: 1.3;
 }
 .bui-textarea-count {
   background: var(--count-bg-color);
   color: var(--count-text-color);
   text-align: right;
-  padding: var(--count-padding);
-  font-size: var(--count-font-size);
+  padding: 0 4px;
+  font-size: var(--bui-title-size-3);
 }

package/es/Toast/FunctionalToast.js

@@ -125,24 +125,6 @@ functionalToast.clear = () => {
     destroyAll();
   });
 };
-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.clear = () => {
-    setTimeout(() => {
-      destroyAll();
-    });
-  };
-  const wrapAPI = functionalToast;
-  return [wrapAPI, /* @__PURE__ */ React.createElement(ToastView, { key: "toast-holder", ref: holderRef })];
-};
-functionalToast.useToast = useToast;
 const Toast = functionalToast;
 var FunctionalToast_default = Toast;
 export {

package/es/Toast/Toast.css

@@ -1,16 +1,15 @@
 .bui-toast {
-  --min-width: var(--bui-toast-min-width, 86px);
-  --max-width: var(--bui-toast-max-width, 80%);
-  --flex-direction: var(--bui-toast-flex-direction, column);
-  --padding: var(--bui-toast-padding, var(--bui-spacing-xl));
+  --min-width: 86px;
+  --max-width: 80%;
+  --font-size: var(--bui-text-size-1);
+  --color: var(--bui-color-white);
+  --padding: var(--bui-spacing-xl);
   --word-break: break-all;
   --z-index: var(--bui-z-index-toast);
-  --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);
-  --icon-font-size: var(--bui-toast-icon-font-size, 30px);
+  --position-top: 15%;
+  --position-bottom: 85%;
+  --background-color: rgba(0, 0, 0, 0.8);
+  --border-radius: var(--bui-shape-radius-default);
   --text-align: center;
   position: fixed;
   left: 50%;
@@ -19,8 +18,8 @@
   min-width: var(--min-width);
   max-width: var(--max-width);
   padding: var(--padding);
-  font-size: var(--bui-text-size-1);
-  color: var(--bui-color-white);
+  font-size: var(--font-size);
+  color: var(--color);
   border-radius: var(--border-radius);
   word-break: var(--word-break);
   white-space: pre-wrap;
@@ -47,10 +46,10 @@
 }
 .bui-toast-icon {
   display: flex;
-  flex-direction: var(--flex-direction);
+  flex-direction: column;
   align-items: center;
 }
 .bui-toast-icon .bui-svg-icon {
-  margin: 0 0 var(--icon-margin);
-  font-size: var(--icon-font-size);
+  margin-bottom: 8px;
+  font-size: 30px;
 }

package/es/Toast/Toast.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ToastProps, ToastRef } from './Toast.types';
+import { ToastProps } from './Toast.types';
 import './Toast.less';
-declare const ToastComponent: React.ForwardRefExoticComponent<ToastProps & React.RefAttributes<ToastRef>>;
+declare const ToastComponent: React.ForwardRefExoticComponent<ToastProps & React.RefAttributes<HTMLDivElement>>;
 export default ToastComponent;

package/es/Toast/Toast.js

@@ -30,7 +30,7 @@ var __objRest = (source, exclude) => {
   return target;
 };
 import clsx from "clsx";
-import React, { useImperativeHandle } from "react";
+import React from "react";
 import {
   ErrorCircleFilledBoldIcon,
   AccessTimeCircleFilledBoldIcon,
@@ -38,60 +38,56 @@ import {
   SuccessCircleFilledBoldIcon
 } from "@bifrostui/icons";
 import Fade from "../Fade";
-import { useTheme } from "../ThemeProvider";
 import "./Toast.css";
 const prefixCls = "bui-toast";
-const ToastComponent = /* @__PURE__ */ React.forwardRef((props, ref) => {
-  const _a = props, {
-    className,
-    style,
-    open,
-    type,
-    icon,
-    message,
-    position = "center",
-    disableClick = false,
-    theme
-  } = _a, others = __objRest(_a, [
-    "className",
-    "style",
-    "open",
-    "type",
-    "icon",
-    "message",
-    "position",
-    "disableClick",
-    "theme"
-  ]);
-  const themeConfig = useTheme(theme);
-  useImperativeHandle(ref, () => {
-    return { theme: themeConfig };
-  }, []);
-  const iconMap = {
-    fail: /* @__PURE__ */ React.createElement(ErrorCircleFilledBoldIcon, { htmlColor: "#ffffff" }),
-    loading: /* @__PURE__ */ React.createElement(AccessTimeCircleFilledBoldIcon, { htmlColor: "#ffffff" }),
-    warning: /* @__PURE__ */ React.createElement(AlertCircleFilledBoldIcon, { htmlColor: "#ffffff" }),
-    success: /* @__PURE__ */ React.createElement(SuccessCircleFilledBoldIcon, { htmlColor: "#ffffff" })
-  };
-  const iconDom = iconMap[type] || icon;
-  return /* @__PURE__ */ React.createElement(Fade, __spreadProps(__spreadValues({}, others), { in: open, appear: false, unmountOnExit: true }), /* @__PURE__ */ React.createElement(
-    "div",
-    {
-      className: clsx(
-        prefixCls,
-        `${prefixCls}-${position}`,
-        {
-          [`${prefixCls}-icon`]: !!iconDom,
-          [`${prefixCls}-allow-click`]: !disableClick
-        },
-        className
-      ),
-      style
-    },
-    iconDom,
-    message
-  ));
-});
+const ToastComponent = /* @__PURE__ */ React.forwardRef(
+  (props, ref) => {
+    const _a = props, {
+      className,
+      style,
+      open,
+      type,
+      icon,
+      message,
+      position = "center",
+      disableClick = false
+    } = _a, others = __objRest(_a, [
+      "className",
+      "style",
+      "open",
+      "type",
+      "icon",
+      "message",
+      "position",
+      "disableClick"
+    ]);
+    const iconMap = {
+      fail: /* @__PURE__ */ React.createElement(ErrorCircleFilledBoldIcon, { htmlColor: "#ffffff" }),
+      loading: /* @__PURE__ */ React.createElement(AccessTimeCircleFilledBoldIcon, { htmlColor: "#ffffff" }),
+      warning: /* @__PURE__ */ React.createElement(AlertCircleFilledBoldIcon, { htmlColor: "#ffffff" }),
+      success: /* @__PURE__ */ React.createElement(SuccessCircleFilledBoldIcon, { htmlColor: "#ffffff" })
+    };
+    const iconDom = iconMap[type] || icon;
+    return /* @__PURE__ */ React.createElement(Fade, __spreadProps(__spreadValues({}, others), { in: open, appear: false, unmountOnExit: true }), /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        className: clsx(
+          prefixCls,
+          `${prefixCls}-${position}`,
+          {
+            [`${prefixCls}-icon`]: !!iconDom,
+            [`${prefixCls}-allow-click`]: !disableClick
+          },
+          className
+        ),
+        ref,
+        style
+      },
+      iconDom,
+      message
+    ));
+  }
+);
 ToastComponent.displayName = "BuiToast";
 var Toast_default = ToastComponent;
 export {

package/es/Toast/Toast.types.d.ts

@@ -1,9 +1,5 @@
 import React from 'react';
 import { FadeProps } from '../Fade/Fade.types';
-import { ThemeProps } from '../ThemeProvider/ThemeProvider.types';
-export type ToastRef = {
-    theme?: ThemeProps;
-};
 /**
  * 提示类型
  */
@@ -40,10 +36,6 @@ export interface ToastProps extends FadeProps {
      * 自定义图标
      */
     icon?: React.ReactNode;
-    /**
-     * theme 主题定制
-     */
-    theme?: ThemeProps;
     /**
      * 展示Toast时，页面内容是否可以点击
      * @default false
@@ -70,7 +62,7 @@ export type ToastReturnType = {
 /**
  * Toast Instance
  */
-export interface ToastFunction {
+export interface ToastInstance {
     (options: ToastOptions): ToastReturnType;
     /**
      * 警告提示
@@ -93,9 +85,3 @@ export interface ToastFunction {
      */
     clear: () => void;
 }
-export interface ToastInstance extends ToastFunction {
-    /**
-     * 获取toast静态方法 & contextHolder
-     */
-    useToast: () => [ToastFunction, React.JSX.Element];
-}

package/es/index.d.ts

@@ -7,7 +7,6 @@ export * from './Button';
 export * from './Calendar';
 export * from './Card';
 export * from './Checkbox';
-export * from './Collapse';
 export * from './Divider';
 export * from './Drawer';
 export * from './Fade';
@@ -16,7 +15,6 @@ export * from './Image';
 export * from './Input';
 export * from './List';
 export * from './Modal';
-export * from './Popover';
 export * from './Portal';
 export * from './Progress';
 export * from './Radio';
@@ -34,16 +32,11 @@ export * from './Tabs';
 export * from './Tag';
 export * from './TextArea';
 export * from './Transition';
-export * from './Tooltip';
 export * from './NavBar';
 export * from './Loading';
 export * from './TabBar';
 export * from './Countdown';
 export * from './CitySelector';
 export * from './Picker';
-export * from './CollapsePanel';
-export * from './Breadcrumb';
 export * from './Toast';
 export * from './Dialog';
-export * from './ThemeProvider';
-export * from './locales';

package/es/index.js

@@ -7,7 +7,6 @@ export * from "./Button";
 export * from "./Calendar";
 export * from "./Card";
 export * from "./Checkbox";
-export * from "./Collapse";
 export * from "./Divider";
 export * from "./Drawer";
 export * from "./Fade";
@@ -16,7 +15,6 @@ export * from "./Image";
 export * from "./Input";
 export * from "./List";
 export * from "./Modal";
-export * from "./Popover";
 export * from "./Portal";
 export * from "./Progress";
 export * from "./Radio";
@@ -34,16 +32,11 @@ export * from "./Tabs";
 export * from "./Tag";
 export * from "./TextArea";
 export * from "./Transition";
-export * from "./Tooltip";
 export * from "./NavBar";
 export * from "./Loading";
 export * from "./TabBar";
 export * from "./Countdown";
 export * from "./CitySelector";
 export * from "./Picker";
-export * from "./CollapsePanel";
-export * from "./Breadcrumb";
 export * from "./Toast";
 export * from "./Dialog";
-export * from "./ThemeProvider";
-export * from "./locales";

package/package.json

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

package/dist/Breadcrumb/Breadcrumb.css

@@ -1,34 +0,0 @@
-.bui-breadcrumb {
-  --margin: var(--bui-breadcrumb-margin, 0);
-  --padding: var(--bui-breadcrumb-padding, 0);
-  --color: var(--bui-breadcrumb-color, rgba(0, 0, 0, 0.45));
-  --item-separator-margin: var(--bui-breadcrumb-item-separator-margin, 0 8px);
-  --list-li-color: var(--bui-breadcrumb-list-li-color, rgba(0, 0, 0, 0.88));
-  margin: var(--margin);
-  padding: var(--padding);
-  color: var(--color);
-  list-style: none;
-  font-size: var(--bui-text-size-1);
-  line-height: var(--bui-line-height);
-}
-.bui-breadcrumb-list {
-  display: flex;
-  flex-wrap: wrap;
-  margin: var(--margin);
-  padding: var(--padding);
-  list-style: none;
-}
-.bui-breadcrumb-list a {
-  color: var(--color);
-  text-decoration: none;
-  cursor: pointer;
-}
-.bui-breadcrumb-list li:last-child {
-  color: var(--list-li-color);
-}
-.bui-breadcrumb-item {
-  cursor: pointer;
-}
-.bui-breadcrumb-item-separator {
-  margin: var(--item-separator-margin);
-}

package/dist/Breadcrumb/Breadcrumb.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import { BreadcrumbProps } from './Breadcrumb.types';
-import './Breadcrumb.less';
-declare const Breadcrumb: React.ForwardRefExoticComponent<Omit<BreadcrumbProps<"nav", {}>, "ref"> & React.RefAttributes<HTMLElement>>;
-export default Breadcrumb;

package/dist/Breadcrumb/Breadcrumb.js

@@ -1,128 +0,0 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-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 __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 Breadcrumb_exports = {};
-__export(Breadcrumb_exports, {
-  default: () => Breadcrumb_default
-});
-module.exports = __toCommonJS(Breadcrumb_exports);
-var import_react = __toESM(require("react"));
-var import_clsx = __toESM(require("clsx"));
-var import_BreadcrumbItem = __toESM(require("./BreadcrumbItem"));
-var import_Breadcrumb2 = require("./Breadcrumb.css");
-const prefixCls = "bui-breadcrumb";
-const Breadcrumb = /* @__PURE__ */ import_react.default.forwardRef(
-  (props, ref) => {
-    const _a = props, {
-      className,
-      style,
-      items,
-      separator = "/",
-      children
-    } = _a, others = __objRest(_a, [
-      "className",
-      "style",
-      "items",
-      "separator",
-      "children"
-    ]);
-    const renderList = () => {
-      if (items && items.length > 0) {
-        return items.map((item, index) => {
-          const _a2 = item, { title } = _a2, otherItemProps = __objRest(_a2, ["title"]);
-          const isLast = index === items.length - 1;
-          return /* @__PURE__ */ import_react.default.createElement(
-            import_BreadcrumbItem.default,
-            __spreadValues({
-              key: index,
-              separator: isLast ? "" : separator
-            }, otherItemProps),
-            title
-          );
-        });
-      }
-      if (children) {
-        const childrenLength = import_react.default.Children.count(children);
-        const enhancedChildren = import_react.default.Children.map(
-          children,
-          (child, index) => {
-            if (import_react.default.isValidElement(child)) {
-              const itemSeparator = child.props.separator || separator;
-              const newProps = {
-                separator: index === childrenLength - 1 ? "" : itemSeparator
-              };
-              return import_react.default.cloneElement(child, newProps);
-            }
-            return child;
-          }
-        );
-        return enhancedChildren;
-      }
-      return null;
-    };
-    if (items == null && children == null) {
-      return null;
-    }
-    return /* @__PURE__ */ import_react.default.createElement(
-      "nav",
-      __spreadValues({
-        className: (0, import_clsx.default)(prefixCls, className),
-        style,
-        ref
-      }, others),
-      /* @__PURE__ */ import_react.default.createElement("ol", { className: `${prefixCls}-list` }, renderList())
-    );
-  }
-);
-Breadcrumb.displayName = "BuiBreadcrumb";
-var Breadcrumb_default = Breadcrumb;