@nutui/nutui-react 3.0.6 → 3.0.7

package/dist/nutui.react.umd.js

@@ -10507,9 +10507,9 @@ Please add \`${key2}Action\` when creating your handler.`);
     var classes = classNames(classPrefix2, {
       active: !disabled && props.active
     }, autoHeightClassName, className);
-    return children && /* @__PURE__ */ React.createElement("div", {
+    return children ? /* @__PURE__ */ React.createElement("div", {
       className: classes
-    }, !disabled && children);
+    }, !disabled && children) : null;
   };
   var defaultProps$1d = _object_spread_props(_object_spread({}, ComponentDefaults), {
     tabStyle: {},
@@ -18476,9 +18476,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     loadingIcon: /* @__PURE__ */ React.createElement(d$3, null)
   });
   var Switch = function(props) {
-    var _ref = _object_spread({}, defaultProps$M, props), checked = _ref.checked, defaultChecked = _ref.defaultChecked, disabled = _ref.disabled, activeText = _ref.activeText, inactiveText = _ref.inactiveText, loadingIcon = _ref.loadingIcon, className = _ref.className, style = _ref.style;
-    _ref.onChange;
-    var rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$M, props), checked = _ref.checked, defaultChecked = _ref.defaultChecked, disabled = _ref.disabled, activeText = _ref.activeText, inactiveText = _ref.inactiveText, loadingIcon = _ref.loadingIcon, className = _ref.className, style = _ref.style, onChange = _ref.onChange, rest = _object_without_properties(_ref, [
       "checked",
       "defaultChecked",
       "disabled",
@@ -18511,9 +18509,9 @@ Please add \`${key2}Action\` when creating your handler.`);
     };
     var onClick = function() {
       if (disabled || changing) return;
-      if (props.onChange) {
+      if (onChange) {
         setChanging(true);
-        props.onChange(!value2);
+        onChange(!value2);
       }
       setValue(!value2);
     };
@@ -19319,6 +19317,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     }));
   };
   ActionSheet.displayName = "NutActionSheet";
+  var destroyList = [];
   var fullClone = _object_spread({}, ReactDOM__namespace);
   var version = fullClone.version, reactRender = fullClone.render, unmountComponentAtNode = fullClone.unmountComponentAtNode;
   var createRoot;
@@ -19383,10 +19382,6 @@ Please add \`${key2}Action\` when creating your handler.`);
   function ConfirmDialog(props) {
     return /* @__PURE__ */ React.createElement(Dialog, props, props.content);
   }
-  var normalizeConfig = function(config2) {
-    config2.hideCancelButton = config2.isNotice;
-    return config2;
-  };
   var confirm = function(config2, renderFunc) {
     var div2 = document.createElement("div");
     document.body.appendChild(div2);
@@ -19419,7 +19414,6 @@ Please add \`${key2}Action\` when creating your handler.`);
       }
     };
     dialogConfig.onConfirm = onConfirm;
-    dialogConfig = normalizeConfig(dialogConfig);
     dialogConfig.visible = true;
     renderFunction(dialogConfig);
     var destroy = function() {
@@ -19427,6 +19421,13 @@ Please add \`${key2}Action\` when creating your handler.`);
       if (div2 === null || div2 === void 0 ? void 0 : div2.parentNode) {
         div2.parentNode.removeChild(div2);
       }
+      for (var i2 = 0; i2 < destroyList.length; i2++) {
+        var fn = destroyList[i2];
+        if (fn === close) {
+          destroyList.splice(i2, 1);
+          break;
+        }
+      }
     };
     var onCancel = function(confirm2) {
       !confirm2 && config2.onCancel && config2.onCancel();
@@ -19440,7 +19441,6 @@ Please add \`${key2}Action\` when creating your handler.`);
     };
     var update2 = function(newConfig) {
       dialogConfig = _object_spread({}, dialogConfig, newConfig);
-      dialogConfig = normalizeConfig(dialogConfig);
       renderFunction(dialogConfig);
     };
     var close = function() {
@@ -19451,6 +19451,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       };
       renderFunction(dialogConfig);
     };
+    destroyList.push(close);
     return {
       close,
       update: update2
@@ -19496,64 +19497,13 @@ Please add \`${key2}Action\` when creating your handler.`);
     }, children), renderFooter()));
   };
   Content.displayName = "NutContent";
-  var defaultDialogWrapProps = _object_spread_props(_object_spread({}, defaultOverlayProps, defaultContentProps), {
-    overlay: true,
-    overlayStyle: {},
-    overlayClassName: "nut-dialog-overlay",
-    onCancel: function() {
-    },
-    onClose: function() {
-    },
-    onOverlayClick: function() {
-      return true;
-    }
-  });
-  var DialogWrap = function(props) {
-    var _ref = _object_spread({}, defaultDialogWrapProps, props), visible = _ref.visible, overlay = _ref.overlay, overlayStyle = _ref.overlayStyle, overlayClassName = _ref.overlayClassName, closeOnOverlayClick = _ref.closeOnOverlayClick, lockScroll = _ref.lockScroll, zIndex = _ref.zIndex, onClose = _ref.onClose, onCancel = _ref.onCancel, onOverlayClick = _ref.onOverlayClick, restProps = _object_without_properties(_ref, [
-      "visible",
-      "overlay",
-      "overlayStyle",
-      "overlayClassName",
-      "closeOnOverlayClick",
-      "lockScroll",
-      "zIndex",
-      "onClose",
-      "onCancel",
-      "onOverlayClick"
-    ]);
-    var onHandleClickOverlay = function(e2) {
-      if (closeOnOverlayClick && visible && e2.target === e2.currentTarget) {
-        var closed = onOverlayClick && onOverlayClick(e2);
-        closed && (onClose === null || onClose === void 0 ? void 0 : onClose());
-        closed && (onCancel === null || onCancel === void 0 ? void 0 : onCancel());
-      }
-    };
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, overlay && /* @__PURE__ */ React.createElement(Overlay, {
-      zIndex,
-      style: overlayStyle,
-      className: overlayClassName,
-      visible,
-      closeOnOverlayClick,
-      lockScroll,
-      onClick: onHandleClickOverlay
-    }), /* @__PURE__ */ React.createElement(CSSTransition, {
-      in: visible,
-      timeout: 300,
-      classNames: "fadeDialog",
-      unmountOnExit: true,
-      appear: true
-    }, /* @__PURE__ */ React.createElement(Content, _object_spread_props(_object_spread({}, restProps), {
-      style: {
-        zIndex
-      },
-      visible
-    }))));
-  };
-  DialogWrap.displayName = "NutDialogWrap";
-  var defaultProps$H = _object_spread_props(_object_spread({}, defaultDialogWrapProps), {
+  var defaultProps$H = _object_spread_props(_object_spread({}, defaultOverlayProps, defaultContentProps), {
+    title: "",
+    content: "",
+    header: "",
+    footer: "",
     confirmText: "",
     cancelText: "",
-    overlay: true,
     closeOnOverlayClick: true,
     hideConfirmButton: false,
     hideCancelButton: false,
@@ -19562,38 +19512,28 @@ Please add \`${key2}Action\` when creating your handler.`);
     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$H, props), visible = _ref.visible, footer = _ref.footer, hideConfirmButton = _ref.hideConfirmButton, hideCancelButton = _ref.hideCancelButton, lockScroll = _ref.lockScroll, disableConfirmButton = _ref.disableConfirmButton;
-    _ref.closeOnOverlayClick;
-    var 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$H, props), closeOnOverlayClick = _mergeProps.closeOnOverlayClick, confirmText = _mergeProps.confirmText, cancelText = _mergeProps.cancelText, children = _mergeProps.children, className = _mergeProps.className, closeIconPosition = _mergeProps.closeIconPosition, closeIcon = _mergeProps.closeIcon, content2 = _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 classPrefix2 = "nut-dialog";
+    var locale = useConfig().locale;
     var _useState = _sliced_to_array(React.useState(false), 2), loading = _useState[0], setLoading = _useState[1];
     var renderFooter = function() {
       if (footer === null) return "";
@@ -19601,11 +19541,11 @@ Please add \`${key2}Action\` when creating your handler.`);
         e2.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 _ref2 = _async_to_generator(function(e2) {
+        var _ref = _async_to_generator(function(e2) {
           return __generator(this, function(_state) {
             switch (_state.label) {
               case 0:
@@ -19626,7 +19566,7 @@ Please add \`${key2}Action\` when creating your handler.`);
               case 2:
                 _state.sent();
                 setLoading(false);
-                onClose === null || onClose === void 0 ? void 0 : onClose();
+                onClose();
                 return [
                   3,
                   4
@@ -19646,45 +19586,54 @@ Please add \`${key2}Action\` when creating your handler.`);
           });
         });
         return function handleOk2(e2) {
-          return _ref2.apply(this, arguments);
+          return _ref.apply(this, arguments);
         };
       }();
       var btnClass = hideCancelButton || hideConfirmButton ? "".concat(classPrefix2, "-footer-block") : "";
-      return footer || /* @__PURE__ */ React.createElement(React.Fragment, null, !hideCancelButton && (footerDirection === "vertical" ? /* @__PURE__ */ React.createElement("div", {
-        style: {
-          order: 2
-        },
-        className: "".concat(classPrefix2, "-footer-cancel ").concat(btnClass),
-        onClick: function(e2) {
-          return handleCancel(e2);
-        }
-      }, cancelText || locale.cancel) : /* @__PURE__ */ React.createElement(Button, {
-        type: "default",
-        size: "large",
-        className: "".concat(classPrefix2, "-footer-cancel ").concat(btnClass),
-        onClick: function(e2) {
-          return handleCancel(e2);
-        }
-      }, cancelText || locale.cancel)), !hideConfirmButton && /* @__PURE__ */ React.createElement(Button, {
-        type: "primary",
-        size: "large",
-        className: classNames("".concat(classPrefix2, "-footer-ok ").concat(btnClass), {
-          disabled: disableConfirmButton
-        }),
-        disabled: disableConfirmButton,
-        onClick: function(e2) {
-          return handleOk(e2);
-        },
-        loading
-      }, confirmText || locale.confirm));
+      var renderCancelOfVertical = function() {
+        return !hideCancelButton && /* @__PURE__ */ React.createElement("div", {
+          style: {
+            order: 2
+          },
+          className: "".concat(classPrefix2, "-footer-cancel ").concat(btnClass),
+          onClick: function(e2) {
+            return handleCancel(e2);
+          }
+        }, cancelText || locale.cancel);
+      };
+      var renderCancel = function() {
+        return !hideCancelButton && /* @__PURE__ */ React.createElement(Button, {
+          type: "default",
+          size: "large",
+          className: "".concat(classPrefix2, "-footer-cancel ").concat(btnClass),
+          onClick: function(e2) {
+            return handleCancel(e2);
+          }
+        }, cancelText || locale.cancel);
+      };
+      var renderConfirm = function() {
+        return !hideConfirmButton && /* @__PURE__ */ React.createElement(Button, {
+          type: "primary",
+          size: "large",
+          className: classNames("".concat(classPrefix2, "-footer-ok ").concat(btnClass), {
+            disabled: disableConfirmButton
+          }),
+          disabled: disableConfirmButton,
+          onClick: function(e2) {
+            return handleOk(e2);
+          },
+          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(classPrefix2, "-close"), true), _define_property(_obj, "".concat(classPrefix2, "-close-").concat(closeIconPosition), true), _obj));
@@ -19694,19 +19643,46 @@ Please add \`${key2}Action\` when creating your handler.`);
         onClick: handleCancel
       }, /* @__PURE__ */ React.isValidElement(closeIcon) ? closeIcon : systomIcon);
     };
+    var onHandleClickOverlay = function(e2) {
+      if (closeOnOverlayClick && visible && e2.target === e2.currentTarget) {
+        var closed = onOverlayClick && onOverlayClick(e2);
+        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,
+        style: _object_spread({
+          zIndex
+        }, style),
+        title,
+        header,
+        close: renderCloseIcon(),
+        footer: renderFooter(),
+        footerDirection,
+        visible
+      }, content2 || 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,
       visible,
+      style: overlayStyle,
+      className: overlayClassName,
+      closeOnOverlayClick,
       lockScroll,
-      footer: renderFooter(),
-      footerDirection,
-      close: renderCloseIcon(),
-      onClose,
-      onCancel
-    })));
+      onClick: onHandleClickOverlay
+    }), renderContent());
   };
   var Dialog = /* @__PURE__ */ React.forwardRef(BaseDialog);
   Dialog.confirm = function(props) {
@@ -19714,12 +19690,9 @@ Please add \`${key2}Action\` when creating your handler.`);
   };
   [
     "alert"
-  ].forEach(function(type2) {
-    Dialog[type2] = function(props) {
-      return confirm(_object_spread_props(_object_spread({}, props), {
-        isNotice: false,
-        noticeType: type2
-      }));
+  ].forEach(function() {
+    Dialog.alert = function(props) {
+      return confirm(_object_spread({}, props));
     };
   });
   Dialog.displayName = "NutDialog";
@@ -37634,12 +37607,12 @@ Please add \`${key2}Action\` when creating your handler.`);
     var popoverRef = React.useRef(null);
     var popoverContentRef = React.useRef(null);
     var _useState = _sliced_to_array(React.useState(false), 2), showPopup = _useState[0], setShowPopup = _useState[1];
-    var _useState1 = _sliced_to_array(React.useState(), 2), rootPosition = _useState1[0], setRootPosition = _useState1[1];
+    var _useState1 = _sliced_to_array(React.useState(), 2), wrapperPosition = _useState1[0], setWrapperPosition = _useState1[1];
     React.useEffect(function() {
       setShowPopup(visible);
       if (visible) {
         setTimeout(function() {
-          getContentWidth();
+          getWrapperPosition();
         }, 0);
       }
     }, [
@@ -37647,25 +37620,10 @@ Please add \`${key2}Action\` when creating your handler.`);
       location
     ]);
     var update2 = React.useRef(function(e2) {
-      getContentWidth();
+      getWrapperPosition();
     });
-    React.useEffect(function() {
-      if (visible) {
-        scrollableParents.forEach(function(parent2) {
-          parent2.addEventListener("scroll", update2.current, {
-            passive: true
-          });
-        });
-      } else {
-        scrollableParents.forEach(function(parent2) {
-          return parent2.removeEventListener("scroll", update2.current);
-        });
-      }
-    }, [
-      visible
-    ]);
-    var element = null;
     var targetSet = [];
+    var element = null;
     if (canUseDom && targetId) {
       element = document.querySelector("#".concat(targetId));
       targetSet = [
@@ -37678,39 +37636,59 @@ Please add \`${key2}Action\` when creating your handler.`);
         popoverContentRef.current
       ];
     }
-    useClickAway(function() {
-      onClick === null || onClick === void 0 ? void 0 : onClick();
-      onClose === null || onClose === void 0 ? void 0 : onClose();
-    }, targetSet, "touchstart", true, visible, closeOnOutsideClick);
     var scrollableParents = React.useMemo(function() {
       return getAllScrollableParents(element || popoverRef.current);
     }, [
       element,
       popoverRef.current
     ]);
-    var getContentWidth = function() {
+    React.useEffect(function() {
+      if (visible) {
+        scrollableParents.forEach(function(parent2) {
+          parent2.addEventListener("scroll", update2.current, {
+            passive: true
+          });
+        });
+      } else {
+        scrollableParents.forEach(function(parent2) {
+          return parent2.removeEventListener("scroll", update2.current);
+        });
+      }
+    }, [
+      visible
+    ]);
+    useClickAway(function() {
+      onClick === null || onClick === void 0 ? void 0 : onClick();
+      onClose === null || onClose === void 0 ? void 0 : onClose();
+    }, targetSet, "touchstart", true, visible, closeOnOutsideClick);
+    var getWrapperPosition = function() {
       var rect = getRect(targetId ? document.querySelector("#".concat(targetId)) : popoverRef.current);
-      setRootPosition({
-        width: rect.width,
-        height: rect.height,
-        left: rtl ? rect.right : rect.left,
-        top: rect.top + Math.max(document.documentElement.scrollTop, document.body.scrollTop),
-        right: rtl ? rect.left : rect.right
+      var distance = Math.max(document.documentElement.scrollTop, document.body.scrollTop);
+      var width2 = rect.width, height2 = rect.height, right = rect.right, left = rect.left, top = rect.top;
+      setWrapperPosition({
+        width: width2,
+        height: height2,
+        left: rtl ? right : left,
+        top: top + distance,
+        right: rtl ? left : right
       });
     };
-    var _obj;
-    var classes = classNames((_obj = {}, _define_property(_obj, "".concat(classPrefix$b), true), _define_property(_obj, "".concat(classPrefix$b, "-").concat(theme), theme === "dark"), _obj), className);
+    var classes = classNames(classPrefix$b, _define_property({}, "".concat(classPrefix$b, "-").concat(theme), theme === "dark"), className);
     var popoverArrow = function() {
       var prefixCls2 = "nut-popover-arrow";
-      return "".concat(prefixCls2, " ").concat(prefixCls2, "-").concat(location.split("-")[0], " ").concat(prefixCls2, "-").concat(location);
+      var direction = location.split("-")[0];
+      return "".concat(prefixCls2, " ").concat(prefixCls2, "-").concat(direction, " ").concat(prefixCls2, "-").concat(location);
     };
-    var getRootPosition = function() {
+    var getPopoverPosition = function() {
       var _popoverContentRef_current, _popoverContentRef_current1;
       var styles = {};
-      if (!rootPosition) return {};
-      var contentWidth = (_popoverContentRef_current = popoverContentRef.current) === null || _popoverContentRef_current === void 0 ? void 0 : _popoverContentRef_current.clientWidth;
-      var contentHeight = (_popoverContentRef_current1 = popoverContentRef.current) === null || _popoverContentRef_current1 === void 0 ? void 0 : _popoverContentRef_current1.clientHeight;
-      var width2 = rootPosition.width, height2 = rootPosition.height, left = rootPosition.left, top = rootPosition.top, right = rootPosition.right;
+      if (!wrapperPosition) {
+        styles.visibility = "hidden";
+        return styles;
+      }
+      var popWidth = (_popoverContentRef_current = popoverContentRef.current) === null || _popoverContentRef_current === void 0 ? void 0 : _popoverContentRef_current.clientWidth;
+      var popHeight = (_popoverContentRef_current1 = popoverContentRef.current) === null || _popoverContentRef_current1 === void 0 ? void 0 : _popoverContentRef_current1.clientHeight;
+      var width2 = wrapperPosition.width, height2 = wrapperPosition.height, left = wrapperPosition.left, top = wrapperPosition.top, right = wrapperPosition.right;
       var direction = location.split("-")[0];
       var skew = location.split("-")[1];
       var cross = 0;
@@ -37726,15 +37704,15 @@ Please add \`${key2}Action\` when creating your handler.`);
           "bottom",
           "top"
         ].includes(direction)) {
-          var h = direction === "bottom" ? height2 + cross : -(contentHeight + cross);
+          var h = direction === "bottom" ? height2 + cross : -(popHeight + cross);
           styles.top = "".concat(top + h, "px");
           if (!skew) {
-            styles[dir] = "".concat(-(contentWidth - width2) / 2 + rootPosition[dir] + parallel, "px");
+            styles[dir] = "".concat(-(popWidth - width2) / 2 + wrapperPosition[dir] + parallel, "px");
           }
-          if (skew === "start") {
+          if (skew === "left") {
             styles.left = "".concat(left + parallel, "px");
           }
-          if (skew === "end") {
+          if (skew === "right") {
             styles.left = "".concat(right + parallel, "px");
           }
         }
@@ -37742,22 +37720,23 @@ Please add \`${key2}Action\` when creating your handler.`);
           "left",
           "right"
         ].includes(direction)) {
-          var contentW = direction === "left" ? -(contentWidth + cross) : width2 + cross;
+          var contentW = direction === "left" ? -(popWidth + cross) : width2 + cross;
           styles.left = "".concat(left + contentW, "px");
           if (!skew) {
-            styles.top = "".concat(top - contentHeight / 2 + height2 / 2 - 4 + parallel, "px");
+            styles.top = "".concat(top - popHeight / 2 + height2 / 2 - 4 + parallel, "px");
           }
-          if (skew === "start") {
+          if (skew === "top") {
             styles.top = "".concat(top + parallel, "px");
           }
-          if (skew === "end") {
+          if (skew === "bottom") {
             styles.top = "".concat(top + height2 + parallel, "px");
           }
         }
       }
+      styles.visibility = popWidth === 0 ? "hidden" : "initial";
       return styles;
     };
-    var arrowStyle = function() {
+    var popoverArrowStyle = function() {
       var styles = {};
       var direction = location.split("-")[0];
       var skew = location.split("-")[1];
@@ -37772,10 +37751,10 @@ Please add \`${key2}Action\` when creating your handler.`);
           if (!skew) {
             styles[dir] = "calc(50% + ".concat(arrowOffset, "px)");
           }
-          if (skew === "start") {
+          if (skew === "left") {
             styles[dir] = "".concat(base + arrowOffset, "px");
           }
-          if (skew === "end") {
+          if (skew === "right") {
             styles[dir2] = "".concat(base - arrowOffset, "px");
           }
         }
@@ -37786,10 +37765,10 @@ Please add \`${key2}Action\` when creating your handler.`);
           if (!skew) {
             styles.top = "calc(50% - ".concat(arrowOffset, "px)");
           }
-          if (skew === "start") {
+          if (skew === "top") {
             styles.top = "".concat(base - arrowOffset, "px");
           }
-          if (skew === "end") {
+          if (skew === "bottom") {
             styles.bottom = "".concat(base + arrowOffset, "px");
           }
         }
@@ -37798,28 +37777,28 @@ Please add \`${key2}Action\` when creating your handler.`);
     };
     var handleSelect = function(item, index2) {
       if (!item.disabled) {
-        onSelect && onSelect(item, index2);
+        onSelect === null || onSelect === void 0 ? void 0 : onSelect(item, index2);
       }
       if (closeOnActionClick) {
-        onClick && onClick();
-        onClose && onClose();
+        onClick === null || onClick === void 0 ? void 0 : onClick();
+        onClose === null || onClose === void 0 ? void 0 : onClose();
       }
     };
     return /* @__PURE__ */ React.createElement(React.Fragment, null, !targetId && /* @__PURE__ */ React.createElement("div", {
       className: "nut-popover-wrapper",
       ref: popoverRef,
       onClick: function() {
-        onClick && onClick();
+        onClick === null || onClick === void 0 ? void 0 : onClick();
         if (!visible) {
-          onOpen && onOpen();
+          onOpen === null || onOpen === void 0 ? void 0 : onOpen();
         } else {
-          onClose && onClose();
+          onClose === null || onClose === void 0 ? void 0 : onClose();
         }
       },
       style
     }, Array.isArray(children) ? children[0] : children), /* @__PURE__ */ ReactDOM.createPortal(/* @__PURE__ */ React.createElement("div", {
       className: classes,
-      style: getRootPosition()
+      style: _object_spread({}, getPopoverPosition(), style)
     }, /* @__PURE__ */ React.createElement(Popup, _object_spread({
       className: "nut-popover-content nut-popover-content-".concat(location),
       visible: showPopup,
@@ -37831,29 +37810,30 @@ Please add \`${key2}Action\` when creating your handler.`);
       ref: popoverContentRef
     }, showArrow && /* @__PURE__ */ React.createElement("div", {
       className: popoverArrow(),
-      style: arrowStyle()
+      style: popoverArrowStyle()
     }, /* @__PURE__ */ React.createElement(i$1, {
       width: 8,
       height: 4
     })), Array.isArray(children) ? children[1] : null, list.map(function(item, index2) {
+      var _item_action;
       return /* @__PURE__ */ React.createElement("div", {
         className: classNames({
-          "nut-popover-menu-item": true,
-          "nut-popover-menu-disabled": item.disabled
+          "nut-popover-item": true,
+          "nut-popover-item-disabled": item.disabled
         }, item.className),
         key: item.key || index2,
         onClick: function() {
           return handleSelect(item, index2);
         }
       }, item.icon && /* @__PURE__ */ React.createElement("div", {
-        className: "nut-popover-menu-item-icon"
+        className: "nut-popover-item-icon"
       }, item.icon), /* @__PURE__ */ React.createElement("div", {
-        className: "nut-popover-menu-item-name"
-      }, item.name), item.action && item.action.icon && /* @__PURE__ */ React.createElement("div", {
-        className: "nut-popover-menu-item-action-icon",
+        className: "nut-popover-item-name"
+      }, item.name), ((_item_action = item.action) === null || _item_action === void 0 ? void 0 : _item_action.icon) && /* @__PURE__ */ React.createElement("div", {
+        className: "nut-popover-item-action-icon",
         onClick: function(e2) {
-          var _item_action_onClick, _item_action;
-          return (_item_action = item.action) === null || _item_action === void 0 ? void 0 : (_item_action_onClick = _item_action.onClick) === null || _item_action_onClick === void 0 ? void 0 : _item_action_onClick.call(_item_action, e2);
+          var _item_action_onClick, _item_action2;
+          return (_item_action2 = item.action) === null || _item_action2 === void 0 ? void 0 : (_item_action_onClick = _item_action2.onClick) === null || _item_action_onClick === void 0 ? void 0 : _item_action_onClick.call(_item_action2, e2);
         }
       }, item.action.icon));
     })))), document.body));
@@ -39389,57 +39369,50 @@ Please add \`${key2}Action\` when creating your handler.`);
       expanded,
       rotate
     ]);
-    var handleClick = function() {
-      if (!disabled) {
-        context2.updateValue(name2);
-      }
-    };
-    var onTransitionEnd = function() {
-      if (expanded) {
-        if (wrapperRef.current) {
-          wrapperRef.current.style.height = "";
-        }
-      }
-    };
-    var getOffsetHeight = function() {
-      var _contentRef_current;
-      var height2 = (_contentRef_current = contentRef.current) === null || _contentRef_current === void 0 ? void 0 : _contentRef_current.offsetHeight;
-      return height2 ? "".concat(height2, "px") : "";
-    };
-    var toggle = function() {
-      var start2 = expanded ? "0px" : getOffsetHeight();
-      if (wrapperRef.current) {
-        wrapperRef.current.style.height = start2;
-      }
-      requestAnimationFrame(function() {
-        requestAnimationFrame(function() {
-          var end = expanded ? getOffsetHeight() : "0px";
-          if (wrapperRef.current) {
-            wrapperRef.current.style.height = end;
-          }
+    var _useState = _sliced_to_array(React.useState(0), 2), tran = _useState[0], setTran = _useState[1];
+    var _useRefState = _sliced_to_array(useRefState(0), 2), currentHeight = _useRefState[0], setCurrentHeight = _useRefState[1];
+    var _useState1 = _sliced_to_array(React.useState(0), 2), wrapperHeight = _useState1[0], setWrapperHeight = _useState1[1];
+    var updateRectHeight = /* @__PURE__ */ function() {
+      var _ref2 = _async_to_generator(function() {
+        var height2;
+        return __generator(this, function(_state) {
+          height2 = contentRef.current.offsetHeight;
+          setCurrentHeight(height2);
+          setWrapperHeight(expanded ? height2 : 0);
+          setTimeout(function() {
+            setTran(1);
+          });
+          return [
+            2
+          ];
         });
       });
-    };
-    var init = React.useRef(true);
+      return function updateRectHeight2() {
+        return _ref2.apply(this, arguments);
+      };
+    }();
     React.useEffect(function() {
-      if (init.current) {
-        init.current = false;
-        if (!expanded) {
-          wrapperRef.current.style.height = "0px";
-        }
-      } else {
-        toggle();
-      }
+      updateRectHeight();
     }, [
+      children,
       expanded
     ]);
+    var toggle = function() {
+      var end = !expanded ? currentHeight.current : 0;
+      setWrapperHeight(end);
+    };
+    var handleClick = function() {
+      if (!disabled) {
+        context2.updateValue(name2);
+        toggle();
+      }
+    };
+    var _obj;
     return /* @__PURE__ */ React.createElement("div", _object_spread({
       className: classNames(classPrefix2, className),
       style
     }, rest), /* @__PURE__ */ React.createElement("div", {
-      className: classNames("".concat(classPrefix2, "-header"), {
-        disabled
-      }),
+      className: classNames("".concat(classPrefix2, "-header"), _define_property({}, "".concat(classPrefix2, "-header-disabled"), disabled)),
       onClick: handleClick
     }, /* @__PURE__ */ React.createElement("div", {
       className: "".concat(classPrefix2, "-title")
@@ -39451,13 +39424,17 @@ Please add \`${key2}Action\` when creating your handler.`);
       className: "".concat(classPrefix2, "-icon"),
       style: iconStyle
     }, expandIcon || context2.expandIcon))), /* @__PURE__ */ React.createElement("div", {
-      className: "".concat(classPrefix2, "-content"),
-      onTransitionEnd,
+      className: classNames((_obj = {}, _define_property(_obj, "".concat(classPrefix2, "-content-wrapper"), true), _define_property(_obj, "".concat(classPrefix2, "-content-wrapper-tran"), true), _obj)),
+      style: tran ? {
+        height: wrapperHeight
+      } : {},
       ref: wrapperRef
+    }, /* @__PURE__ */ React.createElement("div", {
+      className: "".concat(classPrefix2, "-content")
     }, /* @__PURE__ */ React.createElement("div", {
       ref: contentRef,
       className: "".concat(classPrefix2, "-content-text")
-    }, children)));
+    }, children))));
   };
   CollapseItem.displayName = "NutCollapseItem";
   var defaultProps$n = _object_spread_props(_object_spread({}, ComponentDefaults), {
@@ -42863,6 +42840,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   exports.Video = Video;
   exports.VirtualList = VirtualList;
   exports.WaterMark = WaterMark;
+  exports.destroyList = destroyList;
   exports.getDefaultConfig = getDefaultConfig;
   exports.setDefaultConfig = setDefaultConfig;
   exports.useConfig = useConfig;