@nutui/nutui-react 3.0.6 → 3.0.7

package/dist/es/packages/dialog/confirm.js

@@ -2,16 +2,11 @@ import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
 import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
 import React from "react";
 import { Dialog } from "./dialog";
-import { destroyList } from "./types";
+import { destroyList } from "../../types";
 import { render as reactRender, unmount } from "../../utils/render";
 function ConfirmDialog(props) {
     return /*#__PURE__*/ React.createElement(Dialog, props, props.content);
 }
-// 如果是消息提示型弹出框，那么只有确认按钮
-export var normalizeConfig = function(config) {
-    config.hideCancelButton = config.isNotice;
-    return config;
-};
 var confirm = function(config, renderFunc) {
     var div = document.createElement('div');
     document.body.appendChild(div);
@@ -45,7 +40,6 @@ var confirm = function(config, renderFunc) {
     };
     // 如果是promise，那么处理loading和加载完成关闭
     dialogConfig.onConfirm = onConfirm;
-    dialogConfig = normalizeConfig(dialogConfig);
     dialogConfig.visible = true;
     renderFunction(dialogConfig);
     var destroy = function() {
@@ -73,7 +67,6 @@ var confirm = function(config, renderFunc) {
     };
     var update = function(newConfig) {
         dialogConfig = _object_spread({}, dialogConfig, newConfig);
-        dialogConfig = normalizeConfig(dialogConfig);
         renderFunction(dialogConfig);
     };
     var close = function() {

package/dist/es/packages/dialog/content.d.ts

@@ -1,4 +1,12 @@
 import { FunctionComponent, HTMLAttributes } from 'react';
-import { ContentProps } from './types';
-export declare const defaultContentProps: ContentProps;
-export declare const Content: FunctionComponent<Partial<ContentProps> & Omit<HTMLAttributes<HTMLDivElement>, 'title' | 'content'>>;
+import { WebContentProps } from "../../types";
+export declare const defaultContentProps: {
+    visible: boolean;
+    title: string;
+    header: string;
+    footer: string;
+    close: string;
+    footerDirection: string;
+    onClick: () => void;
+};
+export declare const Content: FunctionComponent<Partial<WebContentProps> & Omit<HTMLAttributes<HTMLDivElement>, 'title' | 'content'>>;

package/dist/es/packages/dialog/dialog.d.ts

@@ -1,2 +1,2 @@
-import { DialogComponent } from './types';
+import { DialogComponent } from "../../types";
 export declare const Dialog: DialogComponent;

package/dist/es/packages/dialog/dialog.js

@@ -2,20 +2,26 @@ import { _ as _async_to_generator } from "@swc/helpers/_/_async_to_generator";
 import { _ as _define_property } from "@swc/helpers/_/_define_property";
 import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
 import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
-import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
 import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
 import { _ as _ts_generator } from "@swc/helpers/_/_ts_generator";
 import React, { forwardRef, useState } from "react";
 import classNames from "classnames";
+import { CSSTransition } from "react-transition-group";
 import { Failure, Close } from "@nutui/icons-react";
 import Button from "../button";
 import confirm from "./confirm";
-import { DialogWrap, defaultDialogWrapProps } from "./dialogwrap";
+import Overlay from "../overlay";
+import { Content, defaultContentProps } from "./content";
+import { defaultOverlayProps } from "../overlay/overlay";
 import { useConfig } from "../configprovider";
-var defaultProps = _object_spread_props(_object_spread({}, defaultDialogWrapProps), {
+import { mergeProps } from "../../utils/merge-props";
+var defaultProps = _object_spread_props(_object_spread({}, defaultOverlayProps, defaultContentProps), {
+    title: '',
+    content: '',
+    header: '',
+    footer: '',
     confirmText: '',
     cancelText: '',
-    overlay: true,
     closeOnOverlayClick: true,
     hideConfirmButton: false,
     hideCancelButton: false,
@@ -24,36 +30,26 @@ var defaultProps = _object_spread_props(_object_spread({}, defaultDialogWrapProp
     lockScroll: true,
     closeIconPosition: 'bottom',
     closeIcon: false,
+    overlay: true,
+    overlayStyle: {},
+    overlayClassName: 'nut-dialog-overlay',
     zIndex: 1200,
     beforeCancel: function() {
         return true;
     },
     beforeClose: function() {
         return true;
+    },
+    onCancel: function() {},
+    onClose: function() {},
+    onOverlayClick: function() {
+        return true;
     }
 });
 var BaseDialog = function(props, ref) {
-    var locale = useConfig().locale;
-    var _ref = _object_spread({}, defaultProps, props), visible = _ref.visible, footer = _ref.footer, hideConfirmButton = _ref.hideConfirmButton, hideCancelButton = _ref.hideCancelButton, lockScroll = _ref.lockScroll, disableConfirmButton = _ref.disableConfirmButton, closeOnOverlayClick = _ref.closeOnOverlayClick, confirmText = _ref.confirmText, cancelText = _ref.cancelText, closeIconPosition = _ref.closeIconPosition, closeIcon = _ref.closeIcon, footerDirection = _ref.footerDirection, onClose = _ref.onClose, onCancel = _ref.onCancel, onConfirm = _ref.onConfirm, beforeCancel = _ref.beforeCancel, beforeClose = _ref.beforeClose, restProps = _object_without_properties(_ref, [
-        "visible",
-        "footer",
-        "hideConfirmButton",
-        "hideCancelButton",
-        "lockScroll",
-        "disableConfirmButton",
-        "closeOnOverlayClick",
-        "confirmText",
-        "cancelText",
-        "closeIconPosition",
-        "closeIcon",
-        "footerDirection",
-        "onClose",
-        "onCancel",
-        "onConfirm",
-        "beforeCancel",
-        "beforeClose"
-    ]);
+    var _mergeProps = mergeProps(defaultProps, props), closeOnOverlayClick = _mergeProps.closeOnOverlayClick, confirmText = _mergeProps.confirmText, cancelText = _mergeProps.cancelText, children = _mergeProps.children, className = _mergeProps.className, closeIconPosition = _mergeProps.closeIconPosition, closeIcon = _mergeProps.closeIcon, content = _mergeProps.content, disableConfirmButton = _mergeProps.disableConfirmButton, footer = _mergeProps.footer, footerDirection = _mergeProps.footerDirection, header = _mergeProps.header, hideConfirmButton = _mergeProps.hideConfirmButton, hideCancelButton = _mergeProps.hideCancelButton, lockScroll = _mergeProps.lockScroll, overlay = _mergeProps.overlay, overlayStyle = _mergeProps.overlayStyle, overlayClassName = _mergeProps.overlayClassName, style = _mergeProps.style, title = _mergeProps.title, visible = _mergeProps.visible, zIndex = _mergeProps.zIndex, beforeCancel = _mergeProps.beforeCancel, beforeClose = _mergeProps.beforeClose, onClose = _mergeProps.onClose, onCancel = _mergeProps.onCancel, onConfirm = _mergeProps.onConfirm, onOverlayClick = _mergeProps.onOverlayClick;
     var classPrefix = 'nut-dialog';
+    var locale = useConfig().locale;
     var _useState = _sliced_to_array(useState(false), 2), loading = _useState[0], setLoading = _useState[1];
     var renderFooter = function() {
         if (footer === null) return '';
@@ -61,8 +57,8 @@ var BaseDialog = function(props, ref) {
             e.stopPropagation();
             if (!(beforeCancel === null || beforeCancel === void 0 ? void 0 : beforeCancel())) return;
             if (!(beforeClose === null || beforeClose === void 0 ? void 0 : beforeClose())) return;
-            onClose === null || onClose === void 0 ? void 0 : onClose();
-            onCancel === null || onCancel === void 0 ? void 0 : onCancel();
+            onClose();
+            onCancel();
         };
         var handleOk = /*#__PURE__*/ function() {
             var _ref = _async_to_generator(function(e) {
@@ -87,7 +83,7 @@ var BaseDialog = function(props, ref) {
                         case 2:
                             _state.sent();
                             setLoading(false);
-                            onClose === null || onClose === void 0 ? void 0 : onClose();
+                            onClose();
                             return [
                                 3,
                                 4
@@ -111,41 +107,50 @@ var BaseDialog = function(props, ref) {
             };
         }();
         var btnClass = hideCancelButton || hideConfirmButton ? "".concat(classPrefix, "-footer-block") : '';
-        return footer || /*#__PURE__*/ React.createElement(React.Fragment, null, !hideCancelButton && (footerDirection === 'vertical' ? /*#__PURE__*/ React.createElement("div", {
-            style: {
-                order: 2
-            },
-            className: "".concat(classPrefix, "-footer-cancel ").concat(btnClass),
-            onClick: function(e) {
-                return handleCancel(e);
-            }
-        }, cancelText || locale.cancel) : /*#__PURE__*/ React.createElement(Button, {
-            type: "default",
-            size: "large",
-            className: "".concat(classPrefix, "-footer-cancel ").concat(btnClass),
-            onClick: function(e) {
-                return handleCancel(e);
-            }
-        }, cancelText || locale.cancel)), !hideConfirmButton && /*#__PURE__*/ React.createElement(Button, {
-            type: "primary",
-            size: "large",
-            className: classNames("".concat(classPrefix, "-footer-ok ").concat(btnClass), {
-                disabled: disableConfirmButton
-            }),
-            disabled: disableConfirmButton,
-            onClick: function(e) {
-                return handleOk(e);
-            },
-            loading: loading
-        }, confirmText || locale.confirm));
+        var renderCancelOfVertical = function() {
+            return !hideCancelButton && /*#__PURE__*/ React.createElement("div", {
+                style: {
+                    order: 2
+                },
+                className: "".concat(classPrefix, "-footer-cancel ").concat(btnClass),
+                onClick: function(e) {
+                    return handleCancel(e);
+                }
+            }, cancelText || locale.cancel);
+        };
+        var renderCancel = function() {
+            return !hideCancelButton && /*#__PURE__*/ React.createElement(Button, {
+                type: "default",
+                size: "large",
+                className: "".concat(classPrefix, "-footer-cancel ").concat(btnClass),
+                onClick: function(e) {
+                    return handleCancel(e);
+                }
+            }, cancelText || locale.cancel);
+        };
+        var renderConfirm = function() {
+            return !hideConfirmButton && /*#__PURE__*/ React.createElement(Button, {
+                type: "primary",
+                size: "large",
+                className: classNames("".concat(classPrefix, "-footer-ok ").concat(btnClass), {
+                    disabled: disableConfirmButton
+                }),
+                disabled: disableConfirmButton,
+                onClick: function(e) {
+                    return handleOk(e);
+                },
+                loading: loading
+            }, confirmText || locale.confirm);
+        };
+        return footer || /*#__PURE__*/ React.createElement(React.Fragment, null, footerDirection === 'vertical' ? /*#__PURE__*/ React.createElement(React.Fragment, null, renderConfirm(), renderCancelOfVertical()) : /*#__PURE__*/ React.createElement(React.Fragment, null, renderCancel(), renderConfirm()));
     };
     var renderCloseIcon = function() {
         if (!closeIcon) return null;
         var handleCancel = function() {
             if (!(beforeCancel === null || beforeCancel === void 0 ? void 0 : beforeCancel())) return;
             if (!(beforeClose === null || beforeClose === void 0 ? void 0 : beforeClose())) return;
-            onClose === null || onClose === void 0 ? void 0 : onClose();
-            onCancel === null || onCancel === void 0 ? void 0 : onCancel();
+            onClose();
+            onCancel();
         };
         var _obj;
         var closeClasses = classNames((_obj = {}, _define_property(_obj, "".concat(classPrefix, "-close"), true), _define_property(_obj, "".concat(classPrefix, "-close-").concat(closeIconPosition), true), _obj));
@@ -155,19 +160,46 @@ var BaseDialog = function(props, ref) {
             onClick: handleCancel
         }, /*#__PURE__*/ React.isValidElement(closeIcon) ? closeIcon : systomIcon);
     };
+    var onHandleClickOverlay = function(e) {
+        if (closeOnOverlayClick && visible && e.target === e.currentTarget) {
+            var closed = onOverlayClick && onOverlayClick(e);
+            closed && onClose();
+            closed && onCancel();
+        }
+    };
+    var renderContent = function() {
+        return /*#__PURE__*/ React.createElement(CSSTransition, {
+            in: visible,
+            timeout: 300,
+            classNames: "fadeDialog",
+            unmountOnExit: true,
+            appear: true
+        }, /*#__PURE__*/ React.createElement(Content, {
+            className: className,
+            style: _object_spread({
+                zIndex: zIndex
+            }, style),
+            title: title,
+            header: header,
+            close: renderCloseIcon(),
+            footer: renderFooter(),
+            footerDirection: footerDirection,
+            visible: visible
+        }, content || children));
+    };
     return /*#__PURE__*/ React.createElement("div", {
         style: {
             display: visible ? 'block' : 'none'
         }
-    }, /*#__PURE__*/ React.createElement(DialogWrap, _object_spread_props(_object_spread({}, restProps), {
+    }, overlay && /*#__PURE__*/ React.createElement(Overlay, {
+        zIndex: zIndex,
         visible: visible,
+        style: overlayStyle,
+        className: overlayClassName,
+        closeOnOverlayClick: closeOnOverlayClick,
         lockScroll: lockScroll,
-        footer: renderFooter(),
-        footerDirection: footerDirection,
-        close: renderCloseIcon(),
-        onClose: onClose,
-        onCancel: onCancel
-    })));
+        onClick: onHandleClickOverlay
+    }), renderContent());
 };
 export var Dialog = /*#__PURE__*/ forwardRef(BaseDialog);
 Dialog.confirm = function(props) {
@@ -175,13 +207,10 @@ Dialog.confirm = function(props) {
 };
 [
     'alert'
-].forEach(function(type) {
+].forEach(function() {
     ;
-    Dialog[type] = function(props) {
-        return confirm(_object_spread_props(_object_spread({}, props), {
-            isNotice: false,
-            noticeType: type
-        }));
+    Dialog.alert = function(props) {
+        return confirm(_object_spread({}, props));
     };
 });
 Dialog.displayName = 'NutDialog';

package/dist/es/packages/dialog/index.d.ts

@@ -1,3 +1,3 @@
 import { Dialog } from './dialog';
-export type { DialogConfigType, DialogCloseIconPosition, DialogFooterDirection, ContentProps, DialogWrapProps, DialogBasicProps, DialogConfirmProps, DialogReturnProps, } from './types';
+export type { DialogConfigType, DialogCloseIconPosition, DialogFooterDirection, WebContentProps as ContentProps, DialogWrapProps, WebDialogProps as DialogProps, DialogReturnProps, } from "../../types";
 export default Dialog;

package/dist/es/packages/dialog/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/empty/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/imagepreview/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/numberkeyboard/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/picker/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 {