@nutui/nutui-react 3.0.6 → 3.0.7

package/dist/cjs/packages/tour/style/style.css

@@ -60,7 +60,7 @@
 
 .nut-popup {
   position: fixed;
-  min-height: 46%;
+  min-height: 26%;
   max-height: 100%;
   background-color: var(--nutui-overlay-content-bg-color, var(--nutui-color-background-overlay, #ffffff));
   -webkit-overflow-scrolling: touch;
@@ -198,12 +198,12 @@
     transform: scale(0.8);
   }
 }
-.nut-popup-slide-default-enter-active {
+.nut-popup-slide-none-enter-active {
   animation-fill-mode: both;
   animation-name: popup-scale-fade-in;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-default-exit-active {
+.nut-popup-slide-none-exit-active {
   animation-fill-mode: both;
   animation-name: popup-scale-fade-out;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
@@ -330,7 +330,7 @@
   animation-name: popup-slide-left-exit;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-default-exit-done.nut-popup, .nut-popup-slide-center-exit-done.nut-popup, .nut-popup-slide-left-exit-done.nut-popup, .nut-popup-slide-right-exit-done.nut-popup, .nut-popup-slide-top-exit-done.nut-popup, .nut-popup-slide-bottom-exit-done.nut-popup {
+.nut-popup-slide-none-exit-done.nut-popup, .nut-popup-slide-center-exit-done.nut-popup, .nut-popup-slide-left-exit-done.nut-popup, .nut-popup-slide-right-exit-done.nut-popup, .nut-popup-slide-top-exit-done.nut-popup, .nut-popup-slide-bottom-exit-done.nut-popup {
   display: none;
 }
 .nut-popup .nut-overflow-hidden {
@@ -411,12 +411,13 @@
   top: 50%;
   transform: rotate(90deg) translateY(-50%);
 }
-.nut-popover-arrow-left.nut-popover-arrow-left-start {
+.nut-popover-arrow-left.nut-popover-arrow-left-top {
   top: 16px;
   right: -8px;
   transform: rotate(90deg) translateY(0%);
 }
-.nut-popover-arrow-left.nut-popover-arrow-left-end {
+.nut-popover-arrow-left.nut-popover-arrow-left-bottom {
+  top: auto;
   bottom: 16px;
   right: -8px;
   transform: rotate(90deg) translateY(0%);
@@ -429,12 +430,12 @@
   left: -6px;
   transform: rotate(-90deg) translateY(-50%);
 }
-.nut-popover-arrow-right.nut-popover-arrow-right-start {
+.nut-popover-arrow-right.nut-popover-arrow-right-top {
   top: 16px;
   left: -8px;
   transform: rotate(-90deg) translateY(0%);
 }
-.nut-popover-arrow-right.nut-popover-arrow-right-end {
+.nut-popover-arrow-right.nut-popover-arrow-right-bottom {
   bottom: 16px;
   left: -8px;
   transform: rotate(-90deg) translateY(0%);
@@ -449,57 +450,51 @@
   max-height: initial;
   overflow-y: initial;
 }
-.nut-popover .nut-popover-content .nut-popover-menu-item {
+.nut-popover .nut-popover-content-group {
+  padding: 0 var(--nutui-popover-padding, 8px);
+}
+.nut-popover .nut-popover-content .nut-popover-item {
   display: flex;
   align-items: center;
   justify-content: center;
-  padding: 0 var(--nutui-popover-menu-item-padding, 8px);
   border-bottom: 1px solid var(--nutui-popover-divider-color, var(--nutui-color-border, rgba(0, 0, 0, 0.06)));
-  max-width: var(--nutui-popover-menu-item-width, 160px);
+  max-width: var(--nutui-popover-item-width, 160px);
   word-wrap: break-word;
 }
-.nut-popover .nut-popover-content .nut-popover-menu-item:last-child {
+.nut-popover .nut-popover-content .nut-popover-item:last-child {
   margin-bottom: 0px;
   border-bottom: none;
 }
-.nut-popover .nut-popover-content .nut-popover-menu-item-icon {
+.nut-popover .nut-popover-content .nut-popover-item-icon, .nut-popover .nut-popover-content .nut-popover-item-action-icon {
   display: flex;
   justify-content: center;
   align-items: center;
-  width: 12px;
-  height: 12px;
-  font-size: 12px;
+  width: var(--nutui-font-size-s, 12px);
+  height: var(--nutui-font-size-s, 12px);
+  font-size: var(--nutui-font-size-s, 12px);
+}
+.nut-popover .nut-popover-content .nut-popover-item-icon .nut-icon, .nut-popover .nut-popover-content .nut-popover-item-action-icon .nut-icon {
+  width: var(--nutui-font-size-s, 12px);
+  height: var(--nutui-font-size-s, 12px);
+  font-size: var(--nutui-font-size-s, 12px);
 }
-.nut-popover .nut-popover-content .nut-popover-menu-item-icon .nut-icon {
-  width: 12px;
-  height: 12px;
-  font-size: 12px;
+.nut-popover .nut-popover-content .nut-popover-item-icon {
+  margin-right: var(--nutui-spacing-xxs, 4px);
 }
-.nut-popover .nut-popover-content .nut-popover-menu-item-name {
+.nut-popover .nut-popover-content .nut-popover-item-name {
   width: calc(100% - 34px);
   word-break: keep-all;
-  margin: 0 8px 0 4px;
   flex: 1;
 }
-.nut-popover .nut-popover-content .nut-popover-menu-item-action-icon {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 12px;
-  height: 12px;
-  font-size: 12px;
+.nut-popover .nut-popover-content .nut-popover-item-action-icon {
   color: var(--nutui-color-text, #505259);
+  margin-left: var(--nutui-spacing-base, 8px);
 }
-.nut-popover .nut-popover-content .nut-popover-menu-item-action-icon .nut-icon {
-  width: 12px;
-  height: 12px;
-  font-size: 12px;
-}
-.nut-popover .nut-popover-content .nut-popover-menu-item.nut-popover-menu-disabled {
+.nut-popover .nut-popover-content .nut-popover-item.nut-popover-item-disabled {
   color: var(--nutui-popover-disable-color, var(--nutui-color-text-disabled, #c2c4cc));
   cursor: not-allowed;
 }
-.nut-popover .nut-popover-content .nut-popover-menu-item.nut-popover-menu-taroitem {
+.nut-popover .nut-popover-content .nut-popover-item.nut-popover-taroitem {
   display: flex;
 }
 .nut-popover .nut-popover-content-top .nut-popover-arrow-top {
@@ -507,18 +502,18 @@
   transform-origin: center left;
   transform: rotate(180deg) translateX(-50%);
 }
-.nut-popover .nut-popover-content-top-end {
+.nut-popover .nut-popover-content-top-right {
   right: 0;
 }
-.nut-popover .nut-popover-content-top-end .nut-popover-arrow-top-end {
+.nut-popover .nut-popover-content-top-right .nut-popover-arrow-top-right {
   right: 16px;
   bottom: -3.5px;
   transform: rotate(180deg) translateX(0%);
 }
-.nut-popover .nut-popover-content-top-start {
+.nut-popover .nut-popover-content-top-left {
   left: 0;
 }
-.nut-popover .nut-popover-content-top-start .nut-popover-arrow-top-start {
+.nut-popover .nut-popover-content-top-left .nut-popover-arrow-top-left {
   left: 16px;
   bottom: -3.5px;
   transform: rotate(180deg) translateX(0%);
@@ -527,30 +522,30 @@
   left: 50%;
   transform: translateX(-50%);
 }
-.nut-popover .nut-popover-content-bottom-end {
+.nut-popover .nut-popover-content-bottom-right {
   right: 0;
 }
-.nut-popover .nut-popover-content-bottom-end .nut-popover-arrow-bottom-end {
+.nut-popover .nut-popover-content-bottom-right .nut-popover-arrow-bottom-right {
   right: 16px;
   transform: translateX(0%);
 }
-.nut-popover .nut-popover-content-bottom-start {
+.nut-popover .nut-popover-content-bottom-left {
   left: 0;
 }
-.nut-popover .nut-popover-content-bottom-start .nut-popover-arrow-bottom-start {
+.nut-popover .nut-popover-content-bottom-left .nut-popover-arrow-bottom-left {
   left: 16px;
   transform: translateX(0%);
 }
-.nut-popover .nut-popover-content-left-end {
+.nut-popover .nut-popover-content-left-bottom {
   bottom: 0;
 }
-.nut-popover .nut-popover-content-left-start {
+.nut-popover .nut-popover-content-left-top {
   top: 0;
 }
-.nut-popover .nut-popover-content-right-end {
+.nut-popover .nut-popover-content-right-bottom {
   bottom: 0;
 }
-.nut-popover .nut-popover-content-right-start {
+.nut-popover .nut-popover-content-right-top {
   top: 0;
 }
 
@@ -565,19 +560,18 @@
   background: var(--nutui-popover-text-color, var(--nutui-color-mask, rgba(0, 0, 0, 0.7))) !important;
   color: var(--nutui-popover-content-background-color, #ffffff) !important;
 }
-.nut-popover-dark .nut-popover-content .nut-popover-menu-item-action-icon {
+.nut-popover-dark .nut-popover-content .nut-popover-item-action-icon {
   color: rgba(255, 255, 255, 0.8);
 }
 
-[dir=rtl] .nut-popover .nut-popover-content .nut-popover-menu-item-name,
-.nut-rtl .nut-popover .nut-popover-content .nut-popover-menu-item-name {
+[dir=rtl] .nut-popover .nut-popover-content .nut-popover-item-name,
+.nut-rtl .nut-popover .nut-popover-content .nut-popover-item-name {
   margin-left: 0;
   margin-right: 4px;
 }
-[dir=rtl] .nut-popover .nut-popover-content .nut-popover-menu-item-action-icon,
-.nut-rtl .nut-popover .nut-popover-content .nut-popover-menu-item-action-icon {
+[dir=rtl] .nut-popover .nut-popover-content .nut-popover-item-action-icon,
+.nut-rtl .nut-popover .nut-popover-content .nut-popover-item-action-icon {
   right: auto;
-  left: var(--nutui-popover-menu-item-padding, 8px);
 }
 [dir=rtl] .nut-popover .nut-popover-content-top .nut-popover-arrow-top,
 .nut-rtl .nut-popover .nut-popover-content-top .nut-popover-arrow-top {
@@ -585,23 +579,23 @@
   right: 50%;
   transform: translateX(50%);
 }
-[dir=rtl] .nut-popover .nut-popover-content-top-end,
-.nut-rtl .nut-popover .nut-popover-content-top-end {
+[dir=rtl] .nut-popover .nut-popover-content-top-right,
+.nut-rtl .nut-popover .nut-popover-content-top-right {
   right: auto;
   left: 0;
 }
-[dir=rtl] .nut-popover .nut-popover-content-top-end .nut-popover-arrow-top-end,
-.nut-rtl .nut-popover .nut-popover-content-top-end .nut-popover-arrow-top-end {
+[dir=rtl] .nut-popover .nut-popover-content-top-right .nut-popover-arrow-top-right,
+.nut-rtl .nut-popover .nut-popover-content-top-right .nut-popover-arrow-top-right {
   right: auto;
   left: 16px;
 }
-[dir=rtl] .nut-popover .nut-popover-content-top-start,
-.nut-rtl .nut-popover .nut-popover-content-top-start {
+[dir=rtl] .nut-popover .nut-popover-content-top-left,
+.nut-rtl .nut-popover .nut-popover-content-top-left {
   left: auto;
   right: 0;
 }
-[dir=rtl] .nut-popover .nut-popover-content-top-start .nut-popover-arrow-top-start,
-.nut-rtl .nut-popover .nut-popover-content-top-start .nut-popover-arrow-top-start {
+[dir=rtl] .nut-popover .nut-popover-content-top-left .nut-popover-arrow-top-left,
+.nut-rtl .nut-popover .nut-popover-content-top-left .nut-popover-arrow-top-left {
   left: auto;
   right: 16px;
 }
@@ -611,23 +605,23 @@
   right: 50%;
   transform: translateX(50%);
 }
-[dir=rtl] .nut-popover .nut-popover-content-bottom-end,
-.nut-rtl .nut-popover .nut-popover-content-bottom-end {
+[dir=rtl] .nut-popover .nut-popover-content-bottom-right,
+.nut-rtl .nut-popover .nut-popover-content-bottom-right {
   right: auto;
   left: 0;
 }
-[dir=rtl] .nut-popover .nut-popover-content-bottom-end .nut-popover-arrow-bottom-end,
-.nut-rtl .nut-popover .nut-popover-content-bottom-end .nut-popover-arrow-bottom-end {
+[dir=rtl] .nut-popover .nut-popover-content-bottom-right .nut-popover-arrow-bottom-right,
+.nut-rtl .nut-popover .nut-popover-content-bottom-right .nut-popover-arrow-bottom-right {
   right: auto;
   left: 16px;
 }
-[dir=rtl] .nut-popover .nut-popover-content-bottom-start,
-.nut-rtl .nut-popover .nut-popover-content-bottom-start {
+[dir=rtl] .nut-popover .nut-popover-content-bottom-left,
+.nut-rtl .nut-popover .nut-popover-content-bottom-left {
   left: auto;
   right: 0;
 }
-[dir=rtl] .nut-popover .nut-popover-content-bottom-start .nut-popover-arrow-bottom-start,
-.nut-rtl .nut-popover .nut-popover-content-bottom-start .nut-popover-arrow-bottom-start {
+[dir=rtl] .nut-popover .nut-popover-content-bottom-left .nut-popover-arrow-bottom-left,
+.nut-rtl .nut-popover .nut-popover-content-bottom-left .nut-popover-arrow-bottom-left {
   left: auto;
   right: 16px;
 }

package/dist/cjs/types/spec/dialog/base.d.ts

@@ -1,2 +1,51 @@
-export interface BaseDialog {
+import { ReactNode, ForwardRefExoticComponent, PropsWithChildren } from 'react';
+import type { MouseEvent, CSSProperties } from 'react';
+import { WebOverlayProps } from "../../../types";
+import { BasicComponent } from "../../../utils/typings";
+export type DialogConfigType = {
+    prefixCls?: string;
+    simple?: boolean;
+};
+export type DialogCloseIconPosition = 'top-right' | 'top-left' | 'bottom';
+export type DialogFooterDirection = 'horizontal' | 'vertical';
+export interface BaseContentProps extends BasicComponent {
+    visible: boolean;
+    title: ReactNode;
+    header: ReactNode;
+    footer: ReactNode;
+    close: ReactNode;
+    footerDirection: DialogFooterDirection;
 }
+export interface DialogWrapProps extends WebOverlayProps, Omit<BaseContentProps, 'onClick'> {
+    visible: boolean;
+    overlay: boolean;
+    overlayStyle: CSSProperties;
+    overlayClassName: string;
+    onCancel: () => void;
+    onClose: () => void;
+    onOverlayClick: (e: MouseEvent) => boolean | void;
+}
+export interface BaseDialog extends DialogWrapProps {
+    content: ReactNode;
+    confirmText: ReactNode;
+    cancelText: ReactNode;
+    hideConfirmButton: boolean;
+    hideCancelButton: boolean;
+    disableConfirmButton: boolean;
+    closeIconPosition: DialogCloseIconPosition;
+    closeIcon: boolean | ReactNode;
+    beforeClose: () => boolean;
+    beforeCancel: () => boolean;
+    onConfirm: (e?: MouseEvent<HTMLButtonElement>) => PromiseLike<any> | void;
+}
+export type DialogReturnProps = {
+    update: (newConfig: Partial<BaseDialog>) => void;
+    close: () => void;
+};
+export interface DialogComponent extends ForwardRefExoticComponent<PropsWithChildren<Partial<BaseDialog>>> {
+    confirm: (props: Partial<BaseDialog>) => DialogReturnProps;
+    alert: (props: Partial<BaseDialog>) => DialogReturnProps;
+    config: (config: DialogConfigType) => void;
+    destroyAll: () => void;
+}
+export declare const destroyList: Array<() => void>;

package/dist/cjs/types/spec/dialog/base.js

@@ -2,3 +2,10 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
+Object.defineProperty(exports, "destroyList", {
+    enumerable: true,
+    get: function() {
+        return destroyList;
+    }
+});
+var destroyList = [];

package/dist/cjs/types/spec/dialog/h5.d.ts

@@ -1,3 +1,6 @@
-import { BaseDialog } from './base';
+import { BaseDialog, BaseContentProps } from './base';
+export interface WebContentProps extends BaseContentProps {
+    onClick: (event: MouseEvent) => void;
+}
 export interface WebDialogProps extends BaseDialog {
 }

package/dist/cjs/types/spec/dialog/taro.d.ts

@@ -1,3 +1,9 @@
-import { BaseDialog } from './base';
-export interface TaroDialogProps extends BaseDialog {
+import { ITouchEvent } from '@tarojs/components';
+import { BaseDialog, BaseContentProps } from './base';
+export interface TaroContentProps extends BaseContentProps {
+    onClick: (event: ITouchEvent) => void;
+}
+export interface TaroDialogProps extends Omit<BaseDialog, 'onOverlayClick' | 'onClick'> {
+    onClick: (event: ITouchEvent) => void;
+    onOverlayClick: (event: ITouchEvent) => boolean | void;
 }

package/dist/cjs/types/spec/popover/base.d.ts

@@ -12,6 +12,13 @@ export interface PopoverList {
         onClick?: (e: any) => void;
     };
 }
+export interface WrapperPosition {
+    width: number;
+    height: number;
+    left: number;
+    top: number;
+    right: number;
+}
 export type BasePopover<POPUP_PROPS> = POPUP_PROPS & BaseProps & {
     theme: UITheme;
     location: FullPosition;

package/dist/cjs/utils/get-rect-by-taro.js

@@ -16,11 +16,14 @@ _export(exports, {
         return makeRect;
     }
 });
+var _interop_require_default = require("@swc/helpers/_/_interop_require_default");
 var _async_to_generator = require("@swc/helpers/_/_async_to_generator");
 var _sliced_to_array = require("@swc/helpers/_/_sliced_to_array");
 var _ts_generator = require("@swc/helpers/_/_ts_generator");
 var _taro = require("@tarojs/taro");
+var _lru = /*#__PURE__*/ _interop_require_default._(require("./lru"));
 var _useclientrect = require("../hooks/use-client-rect");
+var lru = new _lru.default(10);
 function makeRect(width, height) {
     return {
         top: 0,
@@ -48,8 +51,15 @@ var getRectByTaro = /*#__PURE__*/ function() {
                 return [
                     2,
                     new Promise(function(resolve, reject) {
+                        if (lru.has(element)) {
+                            resolve(lru.get(element));
+                            return;
+                        }
                         (0, _taro.createSelectorQuery)().select("#".concat(harmonyId || element.uid)).boundingClientRect().exec(function(param) {
                             var _param = (0, _sliced_to_array._)(param, 1), rects = _param[0];
+                            if (rects) {
+                                lru.set(element, rects);
+                            }
                             resolve(rects);
                         });
                     })

package/dist/cjs/utils/lru.d.ts

@@ -0,0 +1,8 @@
+export default class MiniLru {
+    private cache;
+    private capacity;
+    constructor(capacity: number);
+    get(key: any): any | null;
+    set(key: any, value: any): void;
+    has(key: any): boolean;
+}

package/dist/cjs/utils/lru.js

@@ -0,0 +1,58 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return MiniLru;
+    }
+});
+var _class_call_check = require("@swc/helpers/_/_class_call_check");
+var _create_class = require("@swc/helpers/_/_create_class");
+var _define_property = require("@swc/helpers/_/_define_property");
+var MiniLru = /*#__PURE__*/ function() {
+    "use strict";
+    function MiniLru(capacity) {
+        (0, _class_call_check._)(this, MiniLru);
+        (0, _define_property._)(this, "cache", void 0);
+        (0, _define_property._)(this, "capacity", void 0);
+        if (capacity <= 0) {
+            throw new Error('Cache capacity must be a positive number');
+        }
+        this.cache = new Map();
+        this.capacity = capacity;
+    }
+    (0, _create_class._)(MiniLru, [
+        {
+            key: "get",
+            value: function get(key) {
+                if (this.cache.has(key)) {
+                    var value = this.cache.get(key);
+                    this.cache.delete(key);
+                    this.cache.set(key, value);
+                    return value;
+                }
+                return null;
+            }
+        },
+        {
+            key: "set",
+            value: function set(key, value) {
+                if (this.cache.has(key)) {
+                    this.cache.delete(key);
+                } else if (this.cache.size >= this.capacity) {
+                    this.cache.delete(this.cache.keys().next().value);
+                }
+                this.cache.set(key, value);
+            }
+        },
+        {
+            key: "has",
+            value: function has(key) {
+                return this.cache.has(key);
+            }
+        }
+    ]);
+    return MiniLru;
+}();

package/dist/es/packages/actionsheet/style/style.css

@@ -60,7 +60,7 @@
 
 .nut-popup {
   position: fixed;
-  min-height: 46%;
+  min-height: 26%;
   max-height: 100%;
   background-color: var(--nutui-overlay-content-bg-color, var(--nutui-color-background-overlay, #ffffff));
   -webkit-overflow-scrolling: touch;
@@ -198,12 +198,12 @@
     transform: scale(0.8);
   }
 }
-.nut-popup-slide-default-enter-active {
+.nut-popup-slide-none-enter-active {
   animation-fill-mode: both;
   animation-name: popup-scale-fade-in;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-default-exit-active {
+.nut-popup-slide-none-exit-active {
   animation-fill-mode: both;
   animation-name: popup-scale-fade-out;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
@@ -330,7 +330,7 @@
   animation-name: popup-slide-left-exit;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-default-exit-done.nut-popup, .nut-popup-slide-center-exit-done.nut-popup, .nut-popup-slide-left-exit-done.nut-popup, .nut-popup-slide-right-exit-done.nut-popup, .nut-popup-slide-top-exit-done.nut-popup, .nut-popup-slide-bottom-exit-done.nut-popup {
+.nut-popup-slide-none-exit-done.nut-popup, .nut-popup-slide-center-exit-done.nut-popup, .nut-popup-slide-left-exit-done.nut-popup, .nut-popup-slide-right-exit-done.nut-popup, .nut-popup-slide-top-exit-done.nut-popup, .nut-popup-slide-bottom-exit-done.nut-popup {
   display: none;
 }
 .nut-popup .nut-overflow-hidden {

package/dist/es/packages/address/style/style.css

@@ -178,7 +178,7 @@
 
 .nut-popup {
   position: fixed;
-  min-height: 46%;
+  min-height: 26%;
   max-height: 100%;
   background-color: var(--nutui-overlay-content-bg-color, var(--nutui-color-background-overlay, #ffffff));
   -webkit-overflow-scrolling: touch;
@@ -316,12 +316,12 @@
     transform: scale(0.8);
   }
 }
-.nut-popup-slide-default-enter-active {
+.nut-popup-slide-none-enter-active {
   animation-fill-mode: both;
   animation-name: popup-scale-fade-in;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-default-exit-active {
+.nut-popup-slide-none-exit-active {
   animation-fill-mode: both;
   animation-name: popup-scale-fade-out;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
@@ -448,7 +448,7 @@
   animation-name: popup-slide-left-exit;
   animation-duration: var(--nutui-popup-animation-duration, 0.3s);
 }
-.nut-popup-slide-default-exit-done.nut-popup, .nut-popup-slide-center-exit-done.nut-popup, .nut-popup-slide-left-exit-done.nut-popup, .nut-popup-slide-right-exit-done.nut-popup, .nut-popup-slide-top-exit-done.nut-popup, .nut-popup-slide-bottom-exit-done.nut-popup {
+.nut-popup-slide-none-exit-done.nut-popup, .nut-popup-slide-center-exit-done.nut-popup, .nut-popup-slide-left-exit-done.nut-popup, .nut-popup-slide-right-exit-done.nut-popup, .nut-popup-slide-top-exit-done.nut-popup, .nut-popup-slide-bottom-exit-done.nut-popup {
   display: none;
 }
 .nut-popup .nut-overflow-hidden {

package/dist/es/packages/audio/style/style.css

@@ -94,18 +94,6 @@
 .nut-button-round {
   border-radius: var(--nutui-button-border-radius, var(--nutui-radius-s, 6px));
 }
-.nut-button-round-xlarge {
-  border-radius: var(--nutui-button-xlarge-border-radius, var(--nutui-radius-base, 8px));
-}
-.nut-button-round-large {
-  border-radius: var(--nutui-button-large-border-radius, var(--nutui-radius-base, 8px));
-}
-.nut-button-round-small {
-  border-radius: var(--nutui-button-small-border-radius, var(--nutui-radius-s, 6px));
-}
-.nut-button-round-mini {
-  border-radius: var(--nutui-button-mini-border-radius, var(--nutui-radius-xs, 4px));
-}
 .nut-button-default {
   padding: var(--nutui-button-default-padding, 0px 12px);
   border-style: solid;
@@ -131,7 +119,7 @@
   height: var(--nutui-button-xlarge-height, 48px);
   padding: var(--nutui-button-xlarge-padding, 0px 24px);
   font-size: var(--nutui-button-xlarge-font-size, var(--nutui-font-size-xl, 18px));
-  border-radius: var(--nutui-radius-base, 8px);
+  border-radius: var(--nutui-button-xlarge-border-radius, var(--nutui-radius-base, 8px));
 }
 .nut-button-xlarge .nut-button-text {
   margin-left: var(--nutui-button-xlarge-text-icon-margin, 6px);
@@ -151,7 +139,7 @@
   height: var(--nutui-button-large-height, 40px);
   padding: var(--nutui-button-large-padding, 0px 16px);
   font-size: var(--nutui-button-large-font-size, var(--nutui-font-size-l, 16px));
-  border-radius: var(--nutui-radius-s, 6px);
+  border-radius: var(--nutui-button-large-border-radius, var(--nutui-radius-base, 8px));
 }
 .nut-button-large .nut-button-text {
   margin-left: var(--nutui-button-xlarge-text-icon-margin, 6px);
@@ -171,7 +159,7 @@
   height: var(--nutui-button-small-height, 28px);
   padding: var(--nutui-button-small-padding, 0px 8px);
   font-size: var(--nutui-button-small-font-size, var(--nutui-font-size-s, 12px));
-  border-radius: var(--nutui-radius-xs, 4px);
+  border-radius: var(--nutui-button-small-border-radius, var(--nutui-radius-s, 6px));
 }
 .nut-button-small .nut-icon {
   font-size: var(--nutui-button-small-font-size, var(--nutui-font-size-s, 12px));
@@ -185,7 +173,7 @@
   height: var(--nutui-button-mini-height, 24px);
   padding: var(--nutui-button-mini-padding, 0px 8px);
   font-size: var(--nutui-button-mini-font-size, var(--nutui-font-size-xs, 11px));
-  border-radius: var(--nutui-radius-xs, 4px);
+  border-radius: var(--nutui-button-mini-border-radius, var(--nutui-radius-xs, 4px));
 }
 .nut-button-mini .nut-icon {
   font-size: var(--nutui-button-mini-font-size, var(--nutui-font-size-xs, 11px));

package/dist/es/packages/button/style/button.scss

@@ -101,22 +101,6 @@
 
   &-round {
     border-radius: $button-border-radius;
-
-    &-xlarge {
-      border-radius: $button-xlarge-border-radius;
-    }
-
-    &-large {
-      border-radius: $button-large-border-radius;
-    }
-
-    &-small {
-      border-radius: $button-small-border-radius;
-    }
-
-    &-mini {
-      border-radius: $button-mini-border-radius;
-    }
   }
 
   &-default {
@@ -155,7 +139,7 @@
     height: $button-xlarge-height;
     padding: $button-xlarge-padding;
     font-size: $button-xlarge-font-size;
-    border-radius: $radius-base;
+    border-radius: $button-xlarge-border-radius;
 
     .nut-button-text {
       margin-left: $button-xlarge-text-icon-margin;
@@ -178,7 +162,7 @@
     height: $button-large-height;
     padding: $button-large-padding;
     font-size: $button-large-font-size;
-    border-radius: $radius-s;
+    border-radius: $button-large-border-radius;
 
     .nut-button-text {
       margin-left: $button-xlarge-text-icon-margin;
@@ -202,7 +186,7 @@
     height: $button-small-height;
     padding: $button-small-padding;
     font-size: $button-small-font-size;
-    border-radius: $radius-xs;
+    border-radius: $button-small-border-radius;
 
     .nut-icon {
       font-size: $button-small-font-size;
@@ -219,7 +203,7 @@
     height: $button-mini-height;
     padding: $button-mini-padding;
     font-size: $button-mini-font-size;
-    border-radius: $radius-xs;
+    border-radius: $button-mini-border-radius;
 
     .nut-icon {
       font-size: $button-mini-font-size;