tdesign-react 0.27.1 → 0.29.0

package/dist/tdesign.js

@@ -1,5 +1,5 @@
 /**
- * tdesign v0.27.1
+ * tdesign v0.29.0
  * (c) 2022 tdesign
  * @license MIT
  */
@@ -3020,7 +3020,7 @@
     return React.useContext(ConfigContext$1).globalConfig;
   });
 
-  var _excluded$v = ["width", "className", "style", "children"];
+  var _excluded$w = ["width", "className", "style", "children"];
 
   function ownKeys$2b(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -3031,7 +3031,7 @@
         className = props.className,
         style = props.style,
         children = props.children,
-        otherAsideProps = _objectWithoutProperties$1(props, _excluded$v);
+        otherAsideProps = _objectWithoutProperties$1(props, _excluded$w);
 
     var _useConfig = useConfig$1(),
         classPrefix = _useConfig.classPrefix;
@@ -3057,7 +3057,7 @@
   };
   Aside.displayName = "Aside";
 
-  var _excluded$u = ["className", "style", "children"],
+  var _excluded$v = ["className", "style", "children"],
       _excluded2$2 = ["className", "style", "children"],
       _excluded3 = ["className", "style", "children"],
       _excluded4 = ["direction", "className", "style", "children"];
@@ -3073,7 +3073,7 @@
     var className = props.className,
         style = props.style,
         children = props.children,
-        others = _objectWithoutProperties$1(props, _excluded$u);
+        others = _objectWithoutProperties$1(props, _excluded$v);
 
     var headerClassNames = classNames$1("".concat(classPrefix, "-layout__header"), className);
     return /* @__PURE__ */React__default["default"].createElement("header", _objectSpread$2a({
@@ -3156,7 +3156,7 @@
 
   var Layout = Layout$1;
 
-  var _excluded$t = ["flex", "offset", "order", "pull", "push", "span", "tag", "className", "children", "style"];
+  var _excluded$u = ["flex", "offset", "order", "pull", "push", "span", "tag", "className", "children", "style"];
 
   function ownKeys$29(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -3220,7 +3220,7 @@
         className = props.className,
         children = props.children,
         propStyle = props.style,
-        otherColProps = _objectWithoutProperties$1(props, _excluded$t);
+        otherColProps = _objectWithoutProperties$1(props, _excluded$u);
 
     var rowGutter = otherColProps.gutter,
         rowSize = otherColProps.size;
@@ -3524,28 +3524,38 @@
 
     return document.body;
   };
+  var getCssVarsValue = function getCssVarsValue(name, element) {
+    if (!canUseDocument) return;
+    var el = element || document.documentElement;
+    return getComputedStyle(el).getPropertyValue(name);
+  };
 
-  var _excluded$s = ["align", "gutter", "justify", "tag", "style", "className", "children"];
+  var _excluded$t = ["align", "gutter", "justify", "tag", "style", "className", "children"];
 
   function ownKeys$28(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
   function _objectSpread$28(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$28(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$28(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
   var calcSize = function calcSize(width) {
+    var smWidth = getCssVarsValue("--td-screen-sm") || 768;
+    var mdWidth = getCssVarsValue("--td-screen-md") || 992;
+    var lgWidth = getCssVarsValue("--td-screen-lg") || 1200;
+    var xlWidth = getCssVarsValue("--td-screen-xl") || 1400;
+    var xxlWidth = getCssVarsValue("--td-screen-xxl") || 1880;
     var size = "xs";
 
-    if (width < 768) {
-      size = "xs";
-    } else if (width >= 768 && width < 992) {
-      size = "sm";
-    } else if (width >= 992 && width < 1200) {
-      size = "md";
-    } else if (width >= 1200 && width < 1400) {
-      size = "lg";
-    } else if (width >= 1400 && width < 1880) {
+    if (width >= xxlWidth) {
+      size = "xxl";
+    } else if (width >= xlWidth) {
       size = "xl";
+    } else if (width >= lgWidth) {
+      size = "lg";
+    } else if (width >= mdWidth) {
+      size = "md";
+    } else if (width >= smWidth) {
+      size = "sm";
     } else {
-      size = "xxl";
+      size = "xs";
     }
 
     return size;
@@ -3619,7 +3629,7 @@
         propStyle = props.style,
         className = props.className,
         children = props.children,
-        otherRowProps = _objectWithoutProperties$1(props, _excluded$s);
+        otherRowProps = _objectWithoutProperties$1(props, _excluded$t);
 
     var _useState = React.useState(canUseDocument ? calcSize(window.innerWidth) : "md"),
         _useState2 = _slicedToArray(_useState, 2),
@@ -3688,11 +3698,16 @@
   var Portal = /*#__PURE__*/React.forwardRef(function (props, ref) {
     var attach = props.attach,
         children = props.children;
+
+    var _useConfig = useConfig$1(),
+        classPrefix = _useConfig.classPrefix;
+
     var container = React.useMemo(function () {
       if (!canUseDocument) return null;
       var el = document.createElement("div");
+      el.className = "".concat(classPrefix, "-portal-wrapper");
       return el;
-    }, []);
+    }, [classPrefix]);
     React.useEffect(function () {
       var parentElement = document.body;
       var el = null;
@@ -9359,6 +9374,37 @@
     }, [targetEl, options]);
   }
 
+  function useWindowSize() {
+    var validWindow = (typeof window === "undefined" ? "undefined" : _typeof(window)) === "object";
+    var getSize = React.useCallback(function () {
+      return {
+        width: validWindow ? window.innerWidth : void 0,
+        height: validWindow ? window.innerHeight : void 0
+      };
+    }, [validWindow]);
+
+    var _useState = React.useState(getSize()),
+        _useState2 = _slicedToArray(_useState, 2),
+        size = _useState2[0],
+        setSize = _useState2[1];
+
+    React.useEffect(function () {
+      function handleResize() {
+        setSize(getSize());
+      }
+
+      var debounceResize = debounce_1(handleResize, 400);
+
+      if (validWindow) {
+        window.addEventListener("resize", debounceResize);
+        return function () {
+          window.removeEventListener("resize", debounceResize);
+        };
+      }
+    }, [getSize, validWindow]);
+    return size;
+  }
+
   function ownKeys$24(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
   function _objectSpread$24(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$24(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$24(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -9407,6 +9453,10 @@
         visible = _useDefault2[0],
         setVisible = _useDefault2[1];
 
+    var _useWindowSize = useWindowSize(),
+        windowHeight = _useWindowSize.height,
+        windowWidth = _useWindowSize.width;
+
     var _useState = React.useState(null),
         _useState2 = _slicedToArray(_useState, 2),
         triggerRef = _useState2[0],
@@ -9491,10 +9541,8 @@
         triggerProps = _useTriggerProps2[0],
         popupProps = _useTriggerProps2[1];
 
-    var disabledClassName = classNames$1(_defineProperty$2({}, "".concat(classPrefix, "-is-disabled"), disabled));
     var triggerNode = /*#__PURE__*/React.cloneElement(triggerNodeTemp, _objectSpread$24({
-      ref: composeRefs(triggerNodeTemp.ref, setTriggerRef),
-      className: classNames$1(disabledClassName, triggerNodeTemp.props.className)
+      ref: composeRefs(triggerNodeTemp.ref, setTriggerRef)
     }, triggerProps));
 
     var handleExited = function handleExited() {
@@ -9518,7 +9566,7 @@
       var _popperRef$current$up2, _popperRef$current3;
 
       (_popperRef$current$up2 = (_popperRef$current3 = popperRef.current).update) === null || _popperRef$current$up2 === void 0 ? void 0 : _popperRef$current$up2.call(_popperRef$current3);
-    }, [content]);
+    }, [content, visible, windowHeight, windowWidth]);
     var portal = visible || overlayRef ? /* @__PURE__ */React__default["default"].createElement(CSSTransition$1, {
       appear: true,
       "in": visible,
@@ -9609,8 +9657,10 @@
 
     var rippleContainer = React.useMemo(function () {
       if (!canUseDocument) return null;
-      return document.createElement("div");
-    }, []);
+      var container = document.createElement("div");
+      container.className = "".concat(classPrefix, "-ripple");
+      return container;
+    }, [classPrefix]);
     var handleAddRipple = React.useCallback(function (e) {
       var el = ref === null || ref === void 0 ? void 0 : ref.current;
       var rippleColor = getRippleColor(el, fixedRippleColor);
@@ -9637,6 +9687,7 @@
       }
 
       var ripple = document.createElement("div");
+      ripple.className = "".concat(classPrefix, "-ripple__inner");
       setStyle(ripple, {
         marginTop: "0",
         marginLeft: "0",
@@ -9698,7 +9749,7 @@
     }, [handleAddRipple, fixedRippleColor, ref]);
   }
 
-  var _excluded$r = ["type", "theme", "variant", "icon", "disabled", "loading", "size", "block", "ghost", "shape", "children", "content", "className", "onClick"];
+  var _excluded$s = ["type", "theme", "variant", "icon", "disabled", "loading", "size", "block", "ghost", "shape", "children", "content", "className", "onClick"];
 
   function ownKeys$23(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -9724,7 +9775,7 @@
         className = _ref.className,
         _ref$onClick = _ref.onClick,
         onClick = _ref$onClick === void 0 ? noop$1 : _ref$onClick,
-        buttonProps = _objectWithoutProperties$1(_ref, _excluded$r);
+        buttonProps = _objectWithoutProperties$1(_ref, _excluded$s);
 
     var _useConfig = useConfig$1(),
         classPrefix = _useConfig.classPrefix;
@@ -9950,7 +10001,7 @@
     };
   }
 
-  var _excluded$q = ["icon", "id", "className", "size", "style"];
+  var _excluded$r = ["icon", "id", "className", "size", "style"];
 
   function ownKeys$22(object, enumerableOnly) {
     var keys = Object.keys(object);
@@ -9992,7 +10043,7 @@
         className = props.className,
         size = props.size,
         style = props.style,
-        restProps = _objectWithoutProperties(props, _excluded$q);
+        restProps = _objectWithoutProperties(props, _excluded$r);
 
     var _useSizeProps = useSizeProps(size),
         sizeClassName = _useSizeProps.className,
@@ -12838,7 +12889,7 @@
     return typeof param === "number" ? "".concat(param, "px") : param;
   }
 
-  var _excluded$p = ["separate", "children", "className"];
+  var _excluded$q = ["separate", "children", "className"];
 
   function ownKeys$1u(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -12850,7 +12901,7 @@
     var separate = props.separate,
         children = props.children,
         className = props.className,
-        wrapperProps = _objectWithoutProperties$1(props, _excluded$p);
+        wrapperProps = _objectWithoutProperties$1(props, _excluded$q);
 
     return /* @__PURE__ */React__default["default"].createElement("div", _objectSpread$1u({
       ref: ref,
@@ -12859,7 +12910,7 @@
   });
   InputGroup.displayName = "InputGroup";
 
-  var _excluded$o = ["defaultValue", "value", "onChange"];
+  var _excluded$p = ["defaultValue", "value", "onChange"];
 
   function ownKeys$1t(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -12869,7 +12920,7 @@
         value = props.value,
         _props$onChange = props.onChange,
         onChange = _props$onChange === void 0 ? noop$1 : _props$onChange,
-        restProps = _objectWithoutProperties$1(props, _excluded$o);
+        restProps = _objectWithoutProperties$1(props, _excluded$p);
 
     var _useDefault = useDefault(value, typeof defaultValue === "undefined" ? defaultDefaultValue : defaultValue, onChange),
         _useDefault2 = _slicedToArray(_useDefault, 2),
@@ -12882,7 +12933,7 @@
     }, restProps);
   }
 
-  var _excluded$n = ["type", "autoWidth", "placeholder", "disabled", "status", "size", "className", "style", "prefixIcon", "suffixIcon", "clearable", "value", "tips", "align", "maxlength", "maxcharacter", "format", "onClick", "onChange", "onClear", "onEnter", "onKeydown", "onKeyup", "onKeypress", "onFocus", "onBlur", "onPaste", "onMouseenter", "onMouseleave", "onWheel", "onCompositionstart", "onCompositionend", "showClearIconOnEmpty", "autofocus", "autocomplete", "readonly", "label", "suffix"];
+  var _excluded$o = ["type", "autoWidth", "placeholder", "disabled", "status", "size", "className", "inputClass", "style", "prefixIcon", "suffixIcon", "clearable", "value", "tips", "align", "maxlength", "maxcharacter", "format", "onClick", "onChange", "onClear", "onEnter", "onKeydown", "onKeyup", "onKeypress", "onFocus", "onBlur", "onPaste", "onMouseenter", "onMouseleave", "onWheel", "onCompositionstart", "onCompositionend", "showClearIconOnEmpty", "autofocus", "autocomplete", "readonly", "label", "suffix"];
 
   function ownKeys$1s(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -12914,6 +12965,7 @@
         status = _useDefaultValue.status,
         size = _useDefaultValue.size,
         className = _useDefaultValue.className,
+        inputClass = _useDefaultValue.inputClass,
         style = _useDefaultValue.style,
         prefixIcon = _useDefaultValue.prefixIcon,
         suffixIcon = _useDefaultValue.suffixIcon,
@@ -12945,7 +12997,7 @@
         readonly = _useDefaultValue.readonly,
         label = _useDefaultValue.label,
         suffix = _useDefaultValue.suffix,
-        restProps = _objectWithoutProperties$1(_useDefaultValue, _excluded$n);
+        restProps = _objectWithoutProperties$1(_useDefaultValue, _excluded$o);
 
     var _useConfig = useConfig$1(),
         classPrefix = _useConfig.classPrefix;
@@ -12983,7 +13035,7 @@
       onClick: handleClear
     });
 
-    if (type === "password") {
+    if (type === "password" && typeof suffixIcon === "undefined") {
       if (renderType === "password") {
         suffixIconNew = /* @__PURE__ */React__default["default"].createElement(BrowseOffIcon, {
           className: "".concat(classPrefix, "-input__suffix-clear"),
@@ -13004,6 +13056,9 @@
       if (!autoWidth) return;
       inputRef.current.style.width = "".concat(inputPreRef.current.offsetWidth, "px");
     }, [autoWidth, value, placeholder]);
+    React.useEffect(function () {
+      setRenderType(type);
+    }, [type]);
     var renderInput = /* @__PURE__ */React__default["default"].createElement("input", {
       ref: inputRef,
       placeholder: placeholder,
@@ -13026,7 +13081,7 @@
       onPaste: handlePaste
     });
     var renderInputNode = /* @__PURE__ */React__default["default"].createElement("div", {
-      className: classNames$1(className, "".concat(classPrefix, "-input"), (_classNames = {}, _defineProperty$2(_classNames, "".concat(classPrefix, "-is-readonly"), readonly), _defineProperty$2(_classNames, "".concat(classPrefix, "-is-disabled"), disabled), _defineProperty$2(_classNames, "".concat(classPrefix, "-is-focused"), isFocused), _defineProperty$2(_classNames, "".concat(classPrefix, "-size-s"), size === "small"), _defineProperty$2(_classNames, "".concat(classPrefix, "-size-l"), size === "large"), _defineProperty$2(_classNames, "".concat(classPrefix, "-align-").concat(align), align), _defineProperty$2(_classNames, "".concat(classPrefix, "-is-").concat(status), status), _defineProperty$2(_classNames, "".concat(classPrefix, "-input--prefix"), prefixIcon || labelContent), _defineProperty$2(_classNames, "".concat(classPrefix, "-input--suffix"), suffixIconContent || suffixContent), _defineProperty$2(_classNames, "".concat(classPrefix, "-input--focused"), isFocused), _classNames)),
+      className: classNames$1(inputClass, "".concat(classPrefix, "-input"), (_classNames = {}, _defineProperty$2(_classNames, "".concat(classPrefix, "-is-readonly"), readonly), _defineProperty$2(_classNames, "".concat(classPrefix, "-is-disabled"), disabled), _defineProperty$2(_classNames, "".concat(classPrefix, "-is-focused"), isFocused), _defineProperty$2(_classNames, "".concat(classPrefix, "-size-s"), size === "small"), _defineProperty$2(_classNames, "".concat(classPrefix, "-size-l"), size === "large"), _defineProperty$2(_classNames, "".concat(classPrefix, "-align-").concat(align), align), _defineProperty$2(_classNames, "".concat(classPrefix, "-is-").concat(status), status), _defineProperty$2(_classNames, "".concat(classPrefix, "-input--prefix"), prefixIcon || labelContent), _defineProperty$2(_classNames, "".concat(classPrefix, "-input--suffix"), suffixIconContent || suffixContent), _defineProperty$2(_classNames, "".concat(classPrefix, "-input--focused"), isFocused), _classNames)),
       onMouseEnter: handleMouseEnter,
       onMouseLeave: handleMouseLeave,
       onWheel: handleWheel,
@@ -13123,6 +13178,7 @@
     }
 
     function handleFocus(e) {
+      if (readonly) return;
       var value2 = e.currentTarget.value;
       onFocus === null || onFocus === void 0 ? void 0 : onFocus(value2, {
         e: e
@@ -13131,6 +13187,7 @@
     }
 
     function handleBlur(e) {
+      if (readonly) return;
       var value2 = e.currentTarget.value;
       format && onChange(format(value2), {
         e: e
@@ -13194,7 +13251,7 @@
     return /* @__PURE__ */React__default["default"].createElement("div", _objectSpread$1s({
       ref: wrapperRef,
       style: style,
-      className: classNames$1("".concat(classPrefix, "-input__wrap"), _defineProperty$2({}, "".concat(classPrefix, "-input--auto-width"), autoWidth))
+      className: classNames$1(className, "".concat(classPrefix, "-input__wrap"), _defineProperty$2({}, "".concat(classPrefix, "-input--auto-width"), autoWidth))
     }, restProps), renderInputNode, tips && /* @__PURE__ */React__default["default"].createElement("div", {
       className: classNames$1("".concat(classPrefix, "-input__tips"), "".concat(classPrefix, "-input__tips--").concat(status || "normal"))
     }, tips));
@@ -13205,7 +13262,7 @@
 
   var Input = Input$1;
 
-  var _excluded$m = ["prepend", "append", "children", "className"];
+  var _excluded$n = ["prepend", "append", "children", "className"];
 
   function ownKeys$1r(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -13239,7 +13296,7 @@
         append = props.append,
         children = props.children,
         className = props.className,
-        wrapperProps = _objectWithoutProperties$1(props, _excluded$m);
+        wrapperProps = _objectWithoutProperties$1(props, _excluded$n);
 
     return /* @__PURE__ */React__default["default"].createElement("div", _objectSpread$1r({
       ref: ref,
@@ -13353,7 +13410,7 @@
     return [componentLocale, transformLocale];
   }
 
-  var _excluded$l = ["message", "title", "operation", "theme", "icon", "close", "maxLine", "onClose", "className"];
+  var _excluded$m = ["message", "title", "operation", "theme", "icon", "close", "maxLine", "onClose", "className"];
 
   function ownKeys$1p(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -13370,7 +13427,7 @@
         _props$onClose = props.onClose,
         onClose = _props$onClose === void 0 ? noop$1 : _props$onClose,
         className = props.className,
-        alertProps = _objectWithoutProperties$1(props, _excluded$l);
+        alertProps = _objectWithoutProperties$1(props, _excluded$m);
 
     var _React$useState = React__default["default"].useState(false),
         _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -13473,7 +13530,7 @@
 
   var Alert = Alert$1;
 
-  var _excluded$k = ["color", "dot", "maxCount", "count", "size", "shape", "showZero", "offset", "className", "content", "children", "style"];
+  var _excluded$l = ["color", "dot", "maxCount", "count", "size", "shape", "showZero", "offset", "className", "content", "children", "style"];
 
   function ownKeys$1o(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -13502,7 +13559,7 @@
         children = _ref$children === void 0 ? null : _ref$children,
         _ref$style = _ref.style,
         style = _ref$style === void 0 ? {} : _ref$style,
-        restProps = _objectWithoutProperties$1(_ref, _excluded$k);
+        restProps = _objectWithoutProperties$1(_ref, _excluded$l);
 
     var _useConfig = useConfig$1(),
         classPrefix = _useConfig.classPrefix;
@@ -13556,7 +13613,7 @@
 
   var Badge = Badge$1;
 
-  var _excluded$j = ["allowUncheck", "type", "checked", "defaultChecked", "disabled", "name", "value", "onChange", "indeterminate", "children", "label", "className", "style"];
+  var _excluded$k = ["allowUncheck", "type", "checked", "defaultChecked", "disabled", "name", "value", "onChange", "indeterminate", "children", "label", "className", "style"];
 
   function ownKeys$1n(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -13583,7 +13640,7 @@
         label = props.label,
         className = props.className,
         style = props.style,
-        htmlProps = _objectWithoutProperties$1(props, _excluded$j);
+        htmlProps = _objectWithoutProperties$1(props, _excluded$k);
 
     var _useConfig = useConfig$1(),
         classPrefix = _useConfig.classPrefix;
@@ -13735,7 +13792,9 @@
     var calcBarStyle = function calcBarStyle() {
       if (!variant.includes("filled")) return;
       var checkedRadio = groupRef.current.querySelector(checkedRadioCls);
-      if (!checkedRadio) return;
+      if (!checkedRadio) return setBarStyle({
+        width: 0
+      });
       var offsetWidth = checkedRadio.offsetWidth,
           offsetLeft = checkedRadio.offsetLeft;
       setBarStyle({
@@ -13746,7 +13805,7 @@
 
     React.useEffect(function () {
       calcBarStyle();
-    }, [groupRef.current]);
+    }, [groupRef.current, internalValue]);
     useMutationObservable(groupRef.current, calcBarStyle);
 
     var renderBlock = function renderBlock() {
@@ -13981,7 +14040,7 @@
           {
             var vs = v;
             return /* @__PURE__ */React__default["default"].createElement(Checkbox$1, {
-              key: vs,
+              key: index,
               label: vs,
               value: vs
             }, v);
@@ -13991,7 +14050,7 @@
           {
             var _vs = v;
             return /* @__PURE__ */React__default["default"].createElement(Checkbox$1, {
-              key: _vs,
+              key: index,
               label: _vs,
               value: _vs
             }, v);
@@ -14004,7 +14063,7 @@
               key: "checkAll_".concat(index),
               indeterminate: indeterminate
             })) : /* @__PURE__ */React__default["default"].createElement(Checkbox$1, _objectSpread$1k(_objectSpread$1k({}, v), {}, {
-              key: _vs2.value,
+              key: index,
               disabled: _vs2.disabled || disabled
             }));
           }
@@ -14167,7 +14226,7 @@
     return Number(filterVal);
   };
 
-  var _excluded$i = ["align", "className", "style", "defaultValue", "value", "disabled", "size", "theme", "step", "max", "min", "decimalPlaces", "format", "onChange", "onBlur", "onFocus", "onEnter", "onKeydown", "onKeyup", "onKeypress"],
+  var _excluded$j = ["align", "className", "style", "defaultValue", "value", "disabled", "size", "theme", "step", "max", "min", "decimalPlaces", "format", "onChange", "onBlur", "onFocus", "onEnter", "onKeydown", "onKeyup", "onKeypress"],
       _excluded2$1 = ["value"];
 
   function ownKeys$1i(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -14202,7 +14261,7 @@
         onKeydown = props.onKeydown,
         onKeyup = props.onKeyup,
         onKeypress = props.onKeypress,
-        restInputProps = _objectWithoutProperties$1(props, _excluded$i);
+        restInputProps = _objectWithoutProperties$1(props, _excluded$j);
 
     var _useConfig = useConfig$1(),
         classPrefix = _useConfig.classPrefix;
@@ -15904,6 +15963,8 @@
   }
 
   function useSingle(props) {
+    var _props$defaultInputVa;
+
     var value = props.value,
         keys = props.keys,
         loading = props.loading,
@@ -15914,10 +15975,10 @@
 
     var inputRef = React.useRef();
 
-    var _useState = React.useState(""),
-        _useState2 = _slicedToArray(_useState, 2),
-        inputValue = _useState2[0],
-        setInputValue = _useState2[1];
+    var _useDefault = useDefault(props.inputValue, (_props$defaultInputVa = props.defaultInputValue) !== null && _props$defaultInputVa !== void 0 ? _props$defaultInputVa : "", props.onInputChange),
+        _useDefault2 = _slicedToArray(_useDefault, 2),
+        inputValue = _useDefault2[0],
+        setInputValue = _useDefault2[1];
 
     var showLoading = React.useMemo(function () {
       return !disabled && loading;
@@ -15935,34 +15996,30 @@
 
       context === null || context === void 0 ? void 0 : (_context$e = context.e) === null || _context$e === void 0 ? void 0 : _context$e.stopPropagation();
       (_props$onClear = props.onClear) === null || _props$onClear === void 0 ? void 0 : _props$onClear.call(props, context);
-      setInputValue("");
+      setInputValue("", {
+        trigger: "clear"
+      });
     };
 
     var onInnerInputChange = function onInnerInputChange(value2, context) {
       if (props.allowInput) {
-        var _props$onInputChange;
-
-        setInputValue(value2);
-        (_props$onInputChange = props.onInputChange) === null || _props$onInputChange === void 0 ? void 0 : _props$onInputChange.call(props, value2, _objectSpread$1d(_objectSpread$1d({}, context), {}, {
+        setInputValue(value2, _objectSpread$1d(_objectSpread$1d({}, context), {}, {
           trigger: "input"
         }));
       }
     };
 
-    React.useEffect(function () {
-      setInputValue(getInputValue(value, keys));
-    }, [keys, value]);
-
     var renderSelectSingle = function renderSelectSingle(popupVisible) {
       var _props$inputProps;
 
       var singleValueDisplay = !props.multiple ? props.valueDisplay : null;
+      var displayedValue = popupVisible && props.allowInput ? inputValue : getInputValue(value, keys);
       return /* @__PURE__ */React__default["default"].createElement(Input, _objectSpread$1d(_objectSpread$1d(_objectSpread$1d({
         ref: inputRef
       }, commonInputProps), {}, {
         autoWidth: props.borderless || props.autoWidth,
         placeholder: singleValueDisplay ? "" : props.placeholder,
-        value: singleValueDisplay ? void 0 : inputValue,
+        value: singleValueDisplay ? void 0 : displayedValue,
         label: /* @__PURE__ */React__default["default"].createElement(React__default["default"].Fragment, null, props.label, singleValueDisplay),
         onChange: onInnerInputChange,
         readonly: !props.allowInput,
@@ -15973,7 +16030,6 @@
           (_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 ? void 0 : _props$onBlur.call(props, value, _objectSpread$1d(_objectSpread$1d({}, context), {}, {
             inputValue: val
           }));
-          setInputValue(getInputValue(value, keys));
         },
         onFocus: function onFocus(val, context) {
           var _props$onFocus;
@@ -15981,9 +16037,19 @@
           (_props$onFocus = props.onFocus) === null || _props$onFocus === void 0 ? void 0 : _props$onFocus.call(props, value, _objectSpread$1d(_objectSpread$1d({}, context), {}, {
             inputValue: val
           }));
+          !popupVisible && setInputValue(getInputValue(value, keys), _objectSpread$1d(_objectSpread$1d({}, context), {}, {
+            trigger: "input"
+          }));
+        },
+        onEnter: function onEnter(val, context) {
+          var _props$onEnter;
+
+          (_props$onEnter = props.onEnter) === null || _props$onEnter === void 0 ? void 0 : _props$onEnter.call(props, value, _objectSpread$1d(_objectSpread$1d({}, context), {}, {
+            inputValue: val
+          }));
         }
       }, props.inputProps), {}, {
-        className: classNames$1((_props$inputProps = props.inputProps) === null || _props$inputProps === void 0 ? void 0 : _props$inputProps.className, _defineProperty$2({}, "".concat(classPrefix, "-input--focused"), popupVisible))
+        inputClass: classNames$1((_props$inputProps = props.inputProps) === null || _props$inputProps === void 0 ? void 0 : _props$inputProps.className, _defineProperty$2({}, "".concat(classPrefix, "-input--focused"), popupVisible))
       }));
     };
 
@@ -25698,7 +25764,7 @@
   freeExports._=_;}else {// Export to the global object.
   root._=_;}}).call(commonjsGlobal);})(lodash,lodash.exports);
 
-  var _excluded$h = ["checked", "content", "defaultChecked", "onChange", "onClick", "disabled", "children", "className", "size"];
+  var _excluded$i = ["checked", "content", "defaultChecked", "onChange", "onClick", "disabled", "children", "className", "size"];
 
   function ownKeys$1c(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -25717,7 +25783,7 @@
         className = props.className,
         _props$size = props.size,
         size = _props$size === void 0 ? "medium" : _props$size,
-        tagOtherProps = _objectWithoutProperties$1(props, _excluded$h);
+        tagOtherProps = _objectWithoutProperties$1(props, _excluded$i);
 
     var _useDefault = useDefault(checked, defaultChecked, onChange),
         _useDefault2 = _slicedToArray(_useDefault, 2),
@@ -25752,7 +25818,7 @@
   });
   CheckTag.displayName = "CheckTag";
 
-  var _excluded$g = ["theme", "size", "shape", "variant", "closable", "maxWidth", "icon", "content", "onClick", "onClose", "className", "style", "disabled", "children"];
+  var _excluded$h = ["theme", "size", "shape", "variant", "closable", "maxWidth", "icon", "content", "onClick", "onClose", "className", "style", "disabled", "children"];
 
   function ownKeys$1b(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -25781,7 +25847,7 @@
         style = _props$style === void 0 ? {} : _props$style,
         disabled = props.disabled,
         children = props.children,
-        otherTagProps = _objectWithoutProperties$1(props, _excluded$g);
+        otherTagProps = _objectWithoutProperties$1(props, _excluded$h);
 
     var _useConfig = useConfig$1(),
         classPrefix = _useConfig.classPrefix;
@@ -25931,7 +25997,7 @@
           value: item
         }) : tag;
         return /* @__PURE__ */React__default["default"].createElement(Tag, _objectSpread$1a(_objectSpread$1a({
-          key: item,
+          key: index,
           size: size,
           disabled: disabled,
           onClose: function onClose(context) {
@@ -26012,6 +26078,8 @@
 
   function _objectSpread$19(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$19(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$19(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
   var TagInput$1 = /*#__PURE__*/React.forwardRef(function (props, ref) {
+    var _ref;
+
     var _useConfig = useConfig$1(),
         prefix = _useConfig.classPrefix;
 
@@ -26072,9 +26140,9 @@
         renderLabel = _useTagList.renderLabel;
 
     var NAME_CLASS = "".concat(prefix, "-tag-input");
+    var WITH_SUFFIX_ICON_CLASS = "".concat(prefix, "-tag-input__with-suffix-icon");
     var CLEAR_CLASS = "".concat(prefix, "-tag-input__suffix-clear");
     var BREAK_LINE_CLASS = "".concat(prefix, "-tag-input--break-line");
-    var classes = [NAME_CLASS, _defineProperty$2({}, BREAK_LINE_CLASS, excessTagsDisplayType === "break-line"), props.className];
     var tagInputPlaceholder = !(tagValue !== null && tagValue !== void 0 && tagValue.length) ? placeholder : "";
     var showClearIcon = Boolean(!readonly && !disabled && clearable && isHover && (tagValue === null || tagValue === void 0 ? void 0 : tagValue.length));
     React.useImperativeHandle(ref, function () {
@@ -26118,6 +26186,7 @@
         });
       }
     }) : valueDisplay;
+    var classes = [NAME_CLASS, (_ref = {}, _defineProperty$2(_ref, BREAK_LINE_CLASS, excessTagsDisplayType === "break-line"), _defineProperty$2(_ref, WITH_SUFFIX_ICON_CLASS, !!suffixIconNode), _ref), props.className];
     return /* @__PURE__ */React__default["default"].createElement(Input, _objectSpread$19(_objectSpread$19({
       ref: tagInputRef
     }, inputProps), {}, {
@@ -26229,7 +26298,7 @@
       return /* @__PURE__ */React__default["default"].createElement(TagInput, _objectSpread$18(_objectSpread$18(_objectSpread$18({
         ref: tagInputRef
       }, p.commonInputProps), {}, {
-        readonly: !props.allowInput,
+        readonly: !props.allowInput || props.readonly,
         autoWidth: props.borderless || props.autoWidth,
         minCollapsedNum: props.minCollapsedNum,
         collapsedItems: props.collapsedItems,
@@ -26254,9 +26323,6 @@
           (_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 ? void 0 : _props$onBlur.call(props, props.value, _objectSpread$18(_objectSpread$18({}, context), {}, {
             tagInputValue: val
           }));
-          setTInputValue("", _objectSpread$18(_objectSpread$18({}, context), {}, {
-            trigger: "blur"
-          }));
         },
         onFocus: function onFocus(val, context) {
           var _props$onFocus;
@@ -26266,7 +26332,9 @@
           }));
         }
       }, props.tagInputProps), {}, {
-        className: classNames$1((_props$tagInputProps = props.tagInputProps) === null || _props$tagInputProps === void 0 ? void 0 : _props$tagInputProps.className, _defineProperty$2({}, "".concat(classPrefix, "-input--focused"), p.popupVisible))
+        inputProps: {
+          inputClass: classNames$1((_props$tagInputProps = props.tagInputProps) === null || _props$tagInputProps === void 0 ? void 0 : _props$tagInputProps.className, _defineProperty$2({}, "".concat(classPrefix, "-input--focused"), p.popupVisible))
+        }
       }));
     };
 
@@ -26284,7 +26352,8 @@
   var MAX_POPUP_WIDTH = 1e3;
   function useOverlayStyle(props) {
     var popupProps = props.popupProps,
-        borderless = props.borderless;
+        borderless = props.borderless,
+        autoWidth = props.autoWidth;
 
     var _useState = React.useState(false),
         _useState2 = _slicedToArray(_useState, 2),
@@ -26309,6 +26378,7 @@
     var onInnerPopupVisibleChange = function onInnerPopupVisibleChange(visible, context) {
       var _props$onPopupVisible;
 
+      if (props.readonly) return;
       var newVisible = context.trigger === "trigger-element-click" ? true : visible;
       setInnerPopupVisible(newVisible);
       (_props$onPopupVisible = props.onPopupVisibleChange) === null || _props$onPopupVisible === void 0 ? void 0 : _props$onPopupVisible.call(props, newVisible, context);
@@ -26320,7 +26390,7 @@
 
       if (isFunction_1(overlayStyle) || isObject_1(overlayStyle) && overlayStyle.width) {
         result = overlayStyle;
-      } else if (!borderless) {
+      } else if (!borderless && !autoWidth) {
         result = macthWidthFunc;
       }
 
@@ -26349,7 +26419,8 @@
         value = props.value,
         popupVisible = props.popupVisible,
         popupProps = props.popupProps,
-        borderless = props.borderless;
+        borderless = props.borderless,
+        disabled = props.disabled;
 
     var _useOverlayStyle = useOverlayStyle(props),
         tOverlayStyle = _useOverlayStyle.tOverlayStyle,
@@ -26383,6 +26454,7 @@
       hideEmptyPopup: true,
       onVisibleChange: onInnerPopupVisibleChange
     }, visibleProps), popupProps), {}, {
+      disabled: disabled,
       overlayStyle: tOverlayStyle
     }), multiple ? renderSelectMultiple({
       commonInputProps: commonInputProps,
@@ -26401,13 +26473,15 @@
 
   var SelectInput = SelectInput$1;
 
-  var _excluded$f = ["value", "label", "disabled"];
+  var _excluded$g = ["value", "label", "disabled"];
 
   function ownKeys$15(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
   function _objectSpread$15(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$15(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$15(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
   var PopupContent = function PopupContent(props) {
+    var _classNames;
+
     var onChange = props.onChange,
         value = props.value,
         size = props.size,
@@ -26503,7 +26577,7 @@
           var optionValue = _ref2.value,
               label = _ref2.label,
               disabled = _ref2.disabled,
-              restData = _objectWithoutProperties$1(_ref2, _excluded$f);
+              restData = _objectWithoutProperties$1(_ref2, _excluded$g);
 
           return /* @__PURE__ */React__default["default"].createElement(Option$1, {
             key: index,
@@ -26528,7 +26602,7 @@
 
     var isEmpty = Array.isArray(childrenWithProps) && !childrenWithProps.length || options && options.length === 0;
     return /* @__PURE__ */React__default["default"].createElement("div", {
-      className: "".concat(classPrefix, "-select__dropdown-inner")
+      className: classNames$1("".concat(classPrefix, "-select__dropdown-inner"), (_classNames = {}, _defineProperty$2(_classNames, "".concat(classPrefix, "-select__dropdown-inner--size-s"), size === "small"), _defineProperty$2(_classNames, "".concat(classPrefix, "-select__dropdown-inner--size-l"), size === "large"), _defineProperty$2(_classNames, "".concat(classPrefix, "-select__dropdown-inner--size-m"), size === "medium"), _classNames))
     }, panelTopContent, isEmpty && /* @__PURE__ */React__default["default"].createElement("div", {
       className: "".concat(classPrefix, "-select__empty")
     }, empty ? empty : /* @__PURE__ */React__default["default"].createElement("p", null, emptyText)), !isEmpty && loading && /* @__PURE__ */React__default["default"].createElement("div", {
@@ -26536,6 +26610,8 @@
     }, loadingText), !isEmpty && !loading && renderOptions(), panelBottomContent);
   };
 
+  var _excluded$f = ["overlayClassName"];
+
   function ownKeys$14(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
   function _objectSpread$14(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$14(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$14(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -26593,8 +26669,6 @@
         onVisibleChange = props.onVisibleChange,
         _props$showArrow = props.showArrow,
         showArrow = _props$showArrow === void 0 ? true : _props$showArrow,
-        inputValue = props.inputValue,
-        defaultInputValue = props.defaultInputValue,
         inputProps = props.inputProps,
         panelBottomContent = props.panelBottomContent,
         panelTopContent = props.panelTopContent,
@@ -26610,6 +26684,10 @@
     var _useConfig = useConfig$1(),
         classPrefix = _useConfig.classPrefix;
 
+    var _ref = popupProps || {},
+        overlayClassName = _ref.overlayClassName,
+        restPopupProps = _objectWithoutProperties$1(_ref, _excluded$f);
+
     var name = "".concat(classPrefix, "-select");
 
     var _useState = React.useState(popupVisible || false),
@@ -26617,30 +26695,30 @@
         showPopup = _useState2[0],
         setShowPopup = _useState2[1];
 
-    var _useState3 = React.useState(void 0),
+    var _useDefault3 = useDefault(props.inputValue, props.defaultInputValue, props.onInputChange),
+        _useDefault4 = _slicedToArray(_useDefault3, 2),
+        inputValue = _useDefault4[0],
+        onInputChange = _useDefault4[1];
+
+    var _useState3 = React.useState([]),
         _useState4 = _slicedToArray(_useState3, 2),
-        inputVal = _useState4[0],
-        setInputVal = _useState4[1];
+        currentOptions = _useState4[0],
+        setCurrentOptions = _useState4[1];
 
     var _useState5 = React.useState([]),
         _useState6 = _slicedToArray(_useState5, 2),
-        currentOptions = _useState6[0],
-        setCurrentOptions = _useState6[1];
+        tmpPropOptions = _useState6[0],
+        setTmpPropOptions = _useState6[1];
 
-    var _useState7 = React.useState([]),
+    var _useState7 = React.useState({}),
         _useState8 = _slicedToArray(_useState7, 2),
-        tmpPropOptions = _useState8[0],
-        setTmpPropOptions = _useState8[1];
+        valueToOption = _useState8[0],
+        setValueToOption = _useState8[1];
 
-    var _useState9 = React.useState({}),
+    var _useState9 = React.useState([]),
         _useState10 = _slicedToArray(_useState9, 2),
-        valueToOption = _useState10[0],
-        setValueToOption = _useState10[1];
-
-    var _useState11 = React.useState([]),
-        _useState12 = _slicedToArray(_useState11, 2),
-        selectedOptions = _useState12[0],
-        setSelectedOptions = _useState12[1];
+        selectedOptions = _useState10[0],
+        setSelectedOptions = _useState10[1];
 
     var selectedLabel = React.useMemo(function () {
       if (multiple) {
@@ -26653,7 +26731,7 @@
     }, [selectedOptions, keys, multiple]);
     React.useEffect(function () {
       if (keys) {
-        var transformedOptions = options.map(function (option) {
+        var transformedOptions = options === null || options === void 0 ? void 0 : options.map(function (option) {
           return _objectSpread$14(_objectSpread$14({}, option), {}, {
             value: get_1(option, (keys === null || keys === void 0 ? void 0 : keys.value) || "value"),
             label: get_1(option, (keys === null || keys === void 0 ? void 0 : keys.label) || "label")
@@ -26676,11 +26754,11 @@
         if (Array.isArray(value)) {
           return value.map(function (item) {
             if (valueType === "value") {
-              var _ref;
+              var _ref2;
 
               return valueToOption[item] || oldSelectedOptions.find(function (option) {
                 return get_1(option, valueKey) === item;
-              }) || (_ref = {}, _defineProperty$2(_ref, valueKey, item), _defineProperty$2(_ref, labelKey, item), _ref);
+              }) || (_ref2 = {}, _defineProperty$2(_ref2, valueKey, item), _defineProperty$2(_ref2, labelKey, item), _ref2);
             }
 
             return item;
@@ -26689,11 +26767,11 @@
 
         if (value !== void 0 && value !== null) {
           if (valueType === "value") {
-            var _ref2;
+            var _ref3;
 
             return [valueToOption[value] || oldSelectedOptions.find(function (option) {
               return get_1(option, valueKey) === value;
-            }) || (_ref2 = {}, _defineProperty$2(_ref2, valueKey, value), _defineProperty$2(_ref2, labelKey, value), _ref2)].filter(Boolean);
+            }) || (_ref3 = {}, _defineProperty$2(_ref3, valueKey, value), _defineProperty$2(_ref3, labelKey, value), _ref3)].filter(Boolean);
           }
 
           return [value];
@@ -26707,10 +26785,7 @@
       if (disabled) return;
       setShowPopup(visible);
       onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(visible);
-
-      if (!visible && !multiple && filterable) {
-        setInputVal(selectedLabel);
-      }
+      visible && onInputChange("");
     };
 
     var onTagChange = function onTagChange(currentTags, context) {
@@ -26750,11 +26825,11 @@
       }
     };
 
-    var handleChange = function handleChange(value2, _ref3) {
-      var label = _ref3.label;
-
-      if (filterable) {
-        setInputVal(!multiple || reserveKeyword && multiple ? label : "");
+    var handleChange = function handleChange(value2) {
+      if (multiple) {
+        !reserveKeyword && onInputChange("", {
+          trigger: "clear"
+        });
       }
 
       if (creatable && isFunction_1(onCreate)) {
@@ -26765,7 +26840,7 @@
         }
       }
 
-      onChange ? onChange(value2, null) : setInputVal(label);
+      onChange === null || onChange === void 0 ? void 0 : onChange(value2, null);
     };
 
     var handleFilter = function handleFilter(value2) {
@@ -26800,14 +26875,12 @@
     };
 
     var handleInputChange = function handleInputChange(value2) {
-      setInputVal(value2);
+      onInputChange(value2);
 
       if (isFunction_1(onSearch)) {
         onSearch(value2);
         return;
       }
-
-      handleFilter(value2);
     };
 
     var onClearValue = function onClearValue(context) {
@@ -26819,14 +26892,18 @@
         onChange(null, context);
       }
 
-      setInputVal(void 0);
+      onInputChange(void 0);
       onClear(context);
     };
 
+    React.useEffect(function () {
+      handleFilter(String(inputValue));
+    }, [inputValue]);
+
     var renderSuffixIcon = function renderSuffixIcon() {
       if (loading) {
         return /* @__PURE__ */React__default["default"].createElement(Loading, {
-          className: classNames$1(className, "".concat(name, "__right-icon"), "".concat(name, "__active-icon")),
+          className: classNames$1("".concat(name, "__right-icon"), "".concat(name, "__active-icon")),
           loading: true,
           size: "small"
         });
@@ -26894,8 +26971,8 @@
       } : null;
     }, [selectedLabel, collapsedItems, minCollapsedNum]);
     return /* @__PURE__ */React__default["default"].createElement("div", {
-      className: "".concat(name, "__wrap"),
-      style: _objectSpread$14({}, style)
+      className: classNames$1("".concat(name, "__wrap"), className),
+      style: style
     }, /* @__PURE__ */React__default["default"].createElement(SelectInput, _objectSpread$14({
       autoWidth: !(style !== null && style !== void 0 && style.width) && autoWidth,
       className: name,
@@ -26903,7 +26980,7 @@
       readonly: readonly,
       allowInput: multiple || filterable,
       multiple: multiple,
-      value: isString_1(inputVal) && !multiple ? inputVal : selectedLabel,
+      value: selectedLabel,
       valueDisplay: renderValueDisplay(),
       clearable: clearable,
       disabled: disabled,
@@ -26911,9 +26988,8 @@
       label: prefixIcon,
       suffixIcon: renderSuffixIcon(),
       panel: renderContent(),
-      placeholder: placeholder || t(local.placeholder),
-      inputValue: inputValue,
-      defaultInputValue: defaultInputValue,
+      placeholder: !multiple && showPopup && selectedLabel ? selectedLabel : placeholder || t(local.placeholder),
+      inputValue: showPopup ? inputValue : "",
       tagInputProps: _objectSpread$14({}, tagInputProps),
       tagProps: tagProps,
       inputProps: _objectSpread$14({
@@ -26922,8 +26998,8 @@
       minCollapsedNum: minCollapsedNum,
       collapsedItems: renderCollapsedItems,
       popupProps: _objectSpread$14({
-        overlayClassName: ["".concat(name, "__dropdown"), ["narrow-scrollbar"]]
-      }, popupProps),
+        overlayClassName: ["".concat(name, "__dropdown"), ["narrow-scrollbar"], overlayClassName]
+      }, restPopupProps),
       popupVisible: showPopup,
       onPopupVisibleChange: onPopupVisibleChange || handleShowPopup,
       onTagChange: onTagChange,
@@ -28039,7 +28115,9 @@
     getRowEventsRef.current = getRowEvents;
     var rows = React.useMemo(function () {
       return flattenVisibleData.map(function (row, index) {
-        var rowKeyValue = get_1(row, rowKey) || index;
+        var _get;
+
+        var rowKeyValue = (_get = get_1(row, rowKey)) !== null && _get !== void 0 ? _get : index;
         var rowEvents = getRowEventsRef.current(row, index);
         return /* @__PURE__ */React__default["default"].createElement(React__default["default"].Fragment, {
           key: rowKeyValue
@@ -31817,7 +31895,9 @@
         preventScrollThrough = props.preventScrollThrough,
         closeBtn = props.closeBtn,
         _props$closeOnEscKeyd = props.closeOnEscKeydown,
-        closeOnEscKeydown = _props$closeOnEscKeyd === void 0 ? true : _props$closeOnEscKeyd;
+        closeOnEscKeydown = _props$closeOnEscKeyd === void 0 ? true : _props$closeOnEscKeyd,
+        _props$closeOnOverlay = props.closeOnOverlayClick,
+        closeOnOverlayClick = _props$closeOnOverlay === void 0 ? true : _props$closeOnOverlay;
     var wrap = React.useRef();
     var dialog = React.useRef();
     var maskRef = React.useRef();
@@ -31827,7 +31907,7 @@
     var canDraggable = props.draggable && mode === "modeless";
     var dialogOpenClass = "".concat(prefixCls, "__open");
     useDialogEsc(visible, wrap);
-    React.useEffect(function () {
+    useIsomorphicLayoutEffect(function () {
       bodyOverflow.current = document.body.style.overflow;
       bodyCssTextRef.current = document.body.style.cssText;
     }, []);
@@ -31896,7 +31976,7 @@
     };
 
     var onMaskClick = function onMaskClick(e) {
-      if (e.target === e.currentTarget) {
+      if (e.target === e.currentTarget && closeOnOverlayClick) {
         onOverlayClick({
           e: e
         });
@@ -31947,9 +32027,7 @@
       var footer = props.footer ? /* @__PURE__ */React__default["default"].createElement("div", {
         className: "".concat(prefixCls, "__footer")
       }, props.footer) : null;
-      var header = /* @__PURE__ */React__default["default"].createElement("div", {
-        className: "".concat(prefixCls, "__header")
-      }, props.header);
+      var header = props.header;
       var body = /* @__PURE__ */React__default["default"].createElement("div", {
         className: "".concat(prefixCls, "__body")
       }, props.body || props.children);
@@ -35768,7 +35846,8 @@
         filter: null,
         onLoad: null,
         onReflow: null,
-        onUpdate: null
+        onUpdate: null,
+        allowFoldNodeOnFilter: false
       }, options);
 
       this.config = config;
@@ -36045,6 +36124,8 @@
 
         if (this.updateTimer) return;
         this.updateTimer = +setTimeout(function () {
+          var _this3$config;
+
           clearTimeout(_this3.updateTimer);
           _this3.updateTimer = null;
 
@@ -36054,8 +36135,7 @@
             _this3.emit("reflow");
           }
 
-          _this3.lockFilterPathNodes();
-
+          if (!((_this3$config = _this3.config) !== null && _this3$config !== void 0 && _this3$config.allowFoldNodeOnFilter)) _this3.lockFilterPathNodes();
           var updatedList = Array.from(_this3.updatedMap.keys());
 
           if (updatedList.length > 0) {
@@ -36419,7 +36499,9 @@
         lazy = props.lazy,
         valueMode = props.valueMode,
         filter = props.filter,
-        _onLoad = props.onLoad;
+        _onLoad = props.onLoad,
+        _props$allowFoldNodeO = props.allowFoldNodeOnFilter,
+        allowFoldNodeOnFilter = _props$allowFoldNodeO === void 0 ? false : _props$allowFoldNodeO;
     var handleUpdate = usePersistFn(function () {
       refresh();
     });
@@ -36461,7 +36543,8 @@
             node: node.getModel()
           });
         },
-        onUpdate: handleUpdate
+        onUpdate: handleUpdate,
+        allowFoldNodeOnFilter: allowFoldNodeOnFilter
       });
       var list = cloneDeep_1(data);
 
@@ -36831,7 +36914,7 @@
   function ownKeys$w(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
   function _objectSpread$w(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$w(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$w(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-  var useTreeSelectUtils = function useTreeSelectUtils(_ref, $tree) {
+  var useTreeSelectUtils = function useTreeSelectUtils(_ref, treeRef) {
     var data = _ref.data,
         treeProps = _ref.treeProps,
         valueType = _ref.valueType;
@@ -36843,8 +36926,8 @@
     var getNodeItem = usePersistFn(function (value) {
       var _defaultStore$getNode;
 
-      if ($tree.current) {
-        return $tree.current.getItem(value);
+      if (treeRef.current) {
+        return treeRef.current.getItem(value);
       }
 
       return (_defaultStore$getNode = defaultStore.getNode(value)) === null || _defaultStore$getNode === void 0 ? void 0 : _defaultStore$getNode.getModel();
@@ -36875,7 +36958,7 @@
     };
   };
 
-  var TreeSelectArrow = function TreeSelectArrow(_ref) {
+  var SelectArrow = function SelectArrow(_ref) {
     var _classNames;
 
     var isActive = _ref.isActive,
@@ -36892,7 +36975,7 @@
     });
   };
 
-  var SelectInputPassthroughPropsKey = ["multiple", "style", "disabled", "minCollapsedNum", "popupProps", "clearable", "loading"];
+  var SelectInputPassthroughPropsKey = ["multiple", "style", "disabled", "minCollapsedNum", "popupProps", "clearable", "loading", "autoWidth", "borderless", "readonly"];
   var useTreeSelectPassThroughProps = function useTreeSelectPassThroughProps(props) {
     return pick_1(props, SelectInputPassthroughPropsKey);
   };
@@ -36956,6 +37039,10 @@
         classPrefix = _useConfig.classPrefix;
 
     var className = props.className,
+        inputValue = props.inputValue,
+        defaultInputValue = props.defaultInputValue,
+        onInputChange = props.onInputChange,
+        readonly = props.readonly,
         disabled = props.disabled,
         multiple = props.multiple,
         prefixIcon = props.prefixIcon,
@@ -36971,6 +37058,7 @@
         onClear = props.onClear,
         valueDisplay = props.valueDisplay,
         treeProps = props.treeProps,
+        inputProps = props.inputProps,
         onBlur = props.onBlur,
         onFocus = props.onFocus,
         onSearch = props.onSearch,
@@ -36982,90 +37070,95 @@
         value = _useDefault2[0],
         onChange = _useDefault2[1];
 
+    var _useDefault3 = useDefault(props.popupVisible, false, props.onPopupVisibleChange),
+        _useDefault4 = _slicedToArray(_useDefault3, 2),
+        popupVisible = _useDefault4[0],
+        setPopupVisble = _useDefault4[1];
+
     var _useSwitch = useSwitch(),
         _useSwitch2 = _slicedToArray(_useSwitch, 2),
-        popupVisible = _useSwitch2[0],
-        popupAction = _useSwitch2[1];
+        hover = _useSwitch2[0],
+        hoverAction = _useSwitch2[1];
 
-    var _useSwitch3 = useSwitch(),
-        _useSwitch4 = _slicedToArray(_useSwitch3, 2),
-        hover = _useSwitch4[0],
-        hoverAction = _useSwitch4[1];
-
-    var _useState = React.useState(""),
-        _useState2 = _slicedToArray(_useState, 2),
-        filterInput = _useState2[0],
-        setFilterInput = _useState2[1];
+    var _useDefault5 = useDefault(inputValue, defaultInputValue, onInputChange),
+        _useDefault6 = _slicedToArray(_useDefault5, 2),
+        filterInput = _useDefault6[0],
+        setFilterInput = _useDefault6[1];
 
-    var $tree = React.useRef();
+    var treeRef = React.useRef();
 
-    var _useTreeSelectUtils = useTreeSelectUtils(props, $tree),
+    var _useTreeSelectUtils = useTreeSelectUtils(props, treeRef),
         normalizeValue = _useTreeSelectUtils.normalizeValue,
         formatValue = _useTreeSelectUtils.formatValue,
         getNodeItem = _useTreeSelectUtils.getNodeItem;
 
-    var filterable = React.useMemo(function () {
-      return rawFilterable || !!props.filter;
-    }, [props.filter, rawFilterable]);
+    var filterable = rawFilterable || !!props.filter;
     var normalizedValue = React.useMemo(function () {
-      return (multiple ? value : [value]).map(normalizeValue).filter(function (_ref) {
-        var value2 = _ref.value;
-        return value2 !== null && value2 !== void 0 ? value2 : false;
-      });
+      return (multiple ? value : [value]).reduce(function (result, value2) {
+        var normalized = normalizeValue(value2);
+        normalized.value && result.push(normalized);
+        return result;
+      }, []);
     }, [multiple, normalizeValue, value]);
-    var filterText = React.useMemo(function () {
-      return String(filterInput);
-    }, [filterInput]);
-    var inputValue = React.useMemo(function () {
+    var filterText = String(filterInput);
+    var internalInputValue = React.useMemo(function () {
       if (multiple) return normalizedValue;
       return filterable && popupVisible ? filterText : normalizedValue[0];
     }, [multiple, normalizedValue, filterable, popupVisible, filterText]);
     var inputPlaceholader = React.useMemo(function () {
       if (filterable && !multiple && popupVisible && normalizedValue.length) {
-        return typeof normalizedValue[0].label === "string" ? normalizedValue[0].label : normalizedValue[0].value;
+        return typeof normalizedValue[0].label === "string" ? normalizedValue[0].label : String(normalizedValue[0].value);
       }
 
       return placeholder;
     }, [filterable, multiple, popupVisible, normalizedValue, placeholder]);
-    var showLoading = React.useMemo(function () {
-      return !disabled && loading;
-    }, [loading, disabled]);
-    var showFakePlaceholder = React.useMemo(function () {
-      return multiple && !filterable && !normalizedValue.length;
-    }, [filterable, multiple, normalizedValue]);
+    var showLoading = !disabled && loading;
+    var showFakePlaceholder = multiple && !filterable && !normalizedValue.length;
     var handleFilter = React.useCallback(function (node) {
       return filterable ? filter(filterText, node) : true;
     }, [filter, filterText, filterable]);
     var handleSingleChange = usePersistFn(function (value2, context) {
       var $value = value2.length ? value2[0] : null;
-      onChange(formatValue($value, context.node.label), context);
-      popupAction.off();
+      onChange(formatValue($value, context.node.label), _objectSpread$v(_objectSpread$v({}, context), {}, {
+        trigger: $value === null ? "uncheck" : "check"
+      }));
+      setPopupVisble(false, {
+        trigger: "trigger-element-click"
+      });
     });
     var handleMultiChange = usePersistFn(function (value2, context) {
       (max === 0 || value2.length <= max) && onChange(value2.map(function (value3) {
         var _getNodeItem;
 
         return formatValue(value3, (_getNodeItem = getNodeItem(value3)) === null || _getNodeItem === void 0 ? void 0 : _getNodeItem.label);
-      }), context);
+      }), _objectSpread$v(_objectSpread$v({}, context), {}, {
+        trigger: value2.length > normalizedValue.length ? "check" : "uncheck"
+      }));
     });
     var handleClear = usePersistFn(function (ctx) {
       ctx.e.stopPropagation();
       onChange(multiple ? [] : formatValue(null), {
-        node: null
+        node: null,
+        trigger: "clear",
+        e: ctx.e
       });
       onClear === null || onClear === void 0 ? void 0 : onClear(ctx);
-      popupAction.off();
+      setPopupVisble(false, {
+        trigger: "trigger-element-click"
+      });
     });
     var handleRemove = usePersistFn(function (index, e) {
       var node = getNodeItem(normalizedValue[index].value);
       onChange(normalizedValue.filter(function (value2, i) {
         return i !== index;
-      }).map(function (_ref2) {
-        var value2 = _ref2.value,
-            label = _ref2.label;
+      }).map(function (_ref) {
+        var value2 = _ref.value,
+            label = _ref.label;
         return formatValue(value2, label);
       }), {
-        node: node
+        node: node,
+        trigger: "tag-remove",
+        e: e
       });
       onRemove === null || onRemove === void 0 ? void 0 : onRemove({
         value: node.value,
@@ -37107,38 +37200,40 @@
     var handleEnter = usePersistFn(function (text) {
       onSearch === null || onSearch === void 0 ? void 0 : onSearch(text);
     });
-    var handleFilterChange = usePersistFn(function (value2, _ref3) {
-      var trigger = _ref3.trigger;
-
-      if (trigger !== "blur") {
-        setFilterInput(value2);
-      }
+    var handleFilterChange = usePersistFn(function (value2) {
+      return setFilterInput(value2);
     });
     React.useEffect(function () {
       popupVisible && setFilterInput("");
     }, [popupVisible]);
+    React.useEffect(function () {
+      setFilterInput("");
+    }, [value]);
 
     var renderTree = function renderTree() {
-      return showLoading ? loadingItem : /* @__PURE__ */React__default["default"].createElement(Tree, _objectSpread$v(_objectSpread$v({
-        ref: $tree,
+      if (readonly) return empty;
+      if (showLoading) return loadingItem;
+      return /* @__PURE__ */React__default["default"].createElement(Tree, _objectSpread$v(_objectSpread$v({
+        ref: treeRef,
         hover: true,
         transition: true,
         expandAll: true,
         filter: handleFilter,
         data: data,
         disabled: disabled,
-        empty: empty
+        empty: empty,
+        allowFoldNodeOnFilter: true
       }, multiple ? {
         checkable: true,
         onChange: handleMultiChange,
-        value: normalizedValue.map(function (_ref4) {
-          var value2 = _ref4.value;
+        value: normalizedValue.map(function (_ref2) {
+          var value2 = _ref2.value;
           return value2;
         })
       } : {
         activable: true,
-        actived: normalizedValue.map(function (_ref5) {
-          var value2 = _ref5.value;
+        actived: normalizedValue.map(function (_ref3) {
+          var value2 = _ref3.value;
           return value2;
         }),
         onActive: handleSingleChange
@@ -37162,8 +37257,9 @@
     };
 
     var normalizedValueDisplay = function normalizedValueDisplay() {
-      if (multiple) return function (_ref6) {
-        var onClose = _ref6.onClose;
+      if (typeof valueDisplay === "string") return valueDisplay;
+      if (multiple) return function (_ref4) {
+        var onClose = _ref4.onClose;
         return valueDisplay({
           value: normalizedValue,
           onClose: onClose
@@ -37175,32 +37271,38 @@
       }) : "";
     };
 
-    return /* @__PURE__ */React__default["default"].createElement(SelectInput$1, _objectSpread$v(_objectSpread$v({}, selectInputProps), {}, {
+    return /* @__PURE__ */React__default["default"].createElement(SelectInput$1, _objectSpread$v(_objectSpread$v(_objectSpread$v({}, props.selectInputProps), selectInputProps), {}, {
       ref: ref,
       className: classNames$1("".concat(classPrefix, "-tree-select"), _defineProperty$2({}, "".concat(classPrefix, "-tree-select--without-input"), multiple && !filterable), className),
-      value: inputValue,
+      value: internalInputValue,
       inputValue: popupVisible ? filterText : "",
       panel: renderTree(),
       allowInput: multiple || filterable,
-      inputProps: {
+      inputProps: _objectSpread$v(_objectSpread$v({}, inputProps), {}, {
         size: size
-      },
+      }),
       tagInputProps: {
         size: size,
-        excessTagsDisplayType: "break-line"
+        excessTagsDisplayType: "break-line",
+        inputProps: inputProps,
+        tagProps: props.tagProps
       },
       placeholder: inputPlaceholader,
       popupVisible: popupVisible && !disabled,
       onInputChange: handleFilterChange,
-      onPopupVisibleChange: useMergeFn(popupAction.set),
-      onFocus: useMergeFn(handleFocus, popupAction.on),
+      onPopupVisibleChange: useMergeFn(setPopupVisble),
+      onFocus: useMergeFn(handleFocus, function () {
+        return setPopupVisble(true, {
+          trigger: "trigger-element-click"
+        });
+      }),
       onBlur: useMergeFn(handleBlur),
       onClear: handleClear,
       onTagChange: handleTagChange,
       onEnter: handleEnter,
       onMouseenter: hoverAction.on,
       onMouseleave: hoverAction.off,
-      suffixIcon: /* @__PURE__ */React__default["default"].createElement(TreeSelectArrow, {
+      suffixIcon: readonly ? null : /* @__PURE__ */React__default["default"].createElement(SelectArrow, {
         isActive: popupVisible,
         isHighlight: hover || popupVisible,
         disabled: disabled
@@ -37675,7 +37777,7 @@
     });
   }
 
-  var _excluded$8 = ["href", "title", "target", "children"];
+  var _excluded$8 = ["href", "title", "target", "children", "className"];
 
   function ownKeys$r(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -37693,6 +37795,8 @@
         target = props.target,
         _props$children = props.children,
         children = _props$children === void 0 ? [] : _props$children,
+        _props$className = props.className,
+        className = _props$className === void 0 ? "" : _props$className,
         rest = _objectWithoutProperties$1(props, _excluded$8);
 
     var _useConfig = useConfig$1(),
@@ -37713,9 +37817,9 @@
         return unregisterItem(href);
       };
     }, [href, registerItem, unregisterItem]);
-    return /* @__PURE__ */React__default["default"].createElement("div", _objectSpread$r({
-      className: classNames$1("".concat(classPrefix, "-anchor__item"), _defineProperty$2({}, "".concat(classPrefix, "-is-active"), activeItem === href))
-    }, rest), /* @__PURE__ */React__default["default"].createElement("a", {
+    return /* @__PURE__ */React__default["default"].createElement("div", _objectSpread$r(_objectSpread$r({}, rest), {}, {
+      className: classNames$1("".concat(classPrefix, "-anchor__item"), _defineProperty$2({}, "".concat(classPrefix, "-is-active"), activeItem === href), className)
+    }), /* @__PURE__ */React__default["default"].createElement("a", {
       href: href,
       className: classNames$1("".concat(classPrefix, "-anchor__item-link")),
       title: titleAttr,
@@ -38863,7 +38967,7 @@
     }, /*#__PURE__*/React__default["default"].createElement(Content));
   };
 
-  var _excluded$7 = ["affixProps", "bounds", "targetOffset", "container", "size", "children", "cursor", "onClick", "onChange"];
+  var _excluded$7 = ["affixProps", "bounds", "targetOffset", "container", "size", "children", "cursor", "onClick", "onChange", "className"];
 
   function ownKeys$q(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -38888,6 +38992,8 @@
         onClick = _props$onClick === void 0 ? noop$1 : _props$onClick,
         _props$onChange = props.onChange,
         onChange = _props$onChange === void 0 ? noop$1 : _props$onChange,
+        _props$className = props.className,
+        className = _props$className === void 0 ? "" : _props$className,
         rest = _objectWithoutProperties$1(props, _excluded$7);
 
     var _useConfig = useConfig$1(),
@@ -39011,7 +39117,7 @@
         scrollContainer.removeEventListener("scroll", handleScroll);
       };
     }, [container, handleScroll]);
-    var anchorClass = classNames$1("".concat(classPrefix, "-anchor"), (_classNames = {}, _defineProperty$2(_classNames, "".concat(classPrefix, "-size-s"), size === "small"), _defineProperty$2(_classNames, "".concat(classPrefix, "-size-m"), size === "medium"), _defineProperty$2(_classNames, "".concat(classPrefix, "-size-l"), size === "large"), _classNames));
+    var anchorClass = classNames$1("".concat(classPrefix, "-anchor"), (_classNames = {}, _defineProperty$2(_classNames, "".concat(classPrefix, "-size-s"), size === "small"), _defineProperty$2(_classNames, "".concat(classPrefix, "-size-m"), size === "medium"), _defineProperty$2(_classNames, "".concat(classPrefix, "-size-l"), size === "large"), _classNames), className);
 
     var CursorCmp = function CursorCmp() {
       if (isFunction_1(cursor)) return cursor();
@@ -39028,10 +39134,10 @@
         registerItem: registerItem,
         unregisterItem: unregisterItem
       }
-    }, /* @__PURE__ */React__default["default"].createElement("div", _objectSpread$q({
+    }, /* @__PURE__ */React__default["default"].createElement("div", _objectSpread$q(_objectSpread$q({}, rest), {}, {
       className: anchorClass,
       ref: anchorEl
-    }, rest), /* @__PURE__ */React__default["default"].createElement("div", {
+    }), /* @__PURE__ */React__default["default"].createElement("div", {
       className: "".concat(classPrefix, "-anchor__line")
     }, /* @__PURE__ */React__default["default"].createElement("div", {
       className: "".concat(classPrefix, "-anchor__line-cursor-wrapper"),
@@ -40023,6 +40129,229 @@
 
   var Calendar = Calendar$1;
 
+  function ownKeys$o(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+  function _objectSpread$o(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$o(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$o(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+  function useInstance(props, formRef, formItemsRef) {
+    var _useConfig = useConfig$1(),
+        classPrefix = _useConfig.classPrefix;
+
+    var FORM_ITEM_CLASS_PREFIX = "".concat(classPrefix, "-form-item__");
+    var scrollToFirstError = props.scrollToFirstError,
+        _props$preventSubmitD = props.preventSubmitDefault,
+        preventSubmitDefault = _props$preventSubmitD === void 0 ? true : _props$preventSubmitD,
+        onSubmit = props.onSubmit;
+
+    function getFormItemsMap() {
+      var formItemsMap = formItemsRef.current.reduce(function (acc, _ref) {
+        var currItem = _ref.current;
+
+        if (currItem !== null && currItem !== void 0 && currItem.name) {
+          var name = currItem.name;
+          return _objectSpread$o(_objectSpread$o({}, acc), {}, _defineProperty$2({}, name, currItem));
+        }
+
+        return acc;
+      }, {});
+      return formItemsMap;
+    }
+
+    function getFirstError(r) {
+      var _r$firstKey$;
+
+      if (r === true) return;
+
+      var _Object$keys = Object.keys(r),
+          _Object$keys2 = _slicedToArray(_Object$keys, 1),
+          firstKey = _Object$keys2[0];
+
+      if (scrollToFirstError) {
+        scrollTo(".".concat(FORM_ITEM_CLASS_PREFIX + firstKey));
+      }
+
+      return (_r$firstKey$ = r[firstKey][0]) === null || _r$firstKey$ === void 0 ? void 0 : _r$firstKey$.message;
+    }
+
+    function scrollTo(selector) {
+      var dom = formRef.current.querySelector(selector);
+      var behavior = scrollToFirstError;
+      dom && dom.scrollIntoView({
+        behavior: behavior
+      });
+    }
+
+    function submit(e) {
+      if (preventSubmitDefault) {
+        var _e$preventDefault, _e$stopPropagation;
+
+        e === null || e === void 0 ? void 0 : (_e$preventDefault = e.preventDefault) === null || _e$preventDefault === void 0 ? void 0 : _e$preventDefault.call(e);
+        e === null || e === void 0 ? void 0 : (_e$stopPropagation = e.stopPropagation) === null || _e$stopPropagation === void 0 ? void 0 : _e$stopPropagation.call(e);
+      }
+
+      validate().then(function (r) {
+        var firstError = getFirstError(r);
+        onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit({
+          validateResult: r,
+          firstError: firstError,
+          e: e
+        });
+      });
+    }
+
+    function validate(param) {
+      function needValidate(name, fields2) {
+        if (!fields2 || !Array.isArray(fields2)) return true;
+        return fields2.indexOf(name) !== -1;
+      }
+
+      var _ref2 = param || {},
+          fields = _ref2.fields,
+          _ref2$trigger = _ref2.trigger,
+          trigger = _ref2$trigger === void 0 ? "all" : _ref2$trigger;
+
+      var list = formItemsRef.current.filter(function (_ref3) {
+        var formItemRef = _ref3.current;
+        return formItemRef && isFunction_1(formItemRef.validate) && needValidate(formItemRef.name, fields);
+      }).map(function (_ref4) {
+        var formItemRef = _ref4.current;
+        return formItemRef.validate(trigger);
+      });
+      return new Promise(function (resolve) {
+        Promise.all(flatten_1(list)).then(function (arr) {
+          var r = arr.reduce(function (r2, err) {
+            return Object.assign(r2 || {}, err);
+          }, {});
+          Object.keys(r).forEach(function (key) {
+            if (r[key] === true) {
+              delete r[key];
+            } else {
+              r[key] = r[key].filter(function (fr) {
+                return fr.result === false;
+              });
+            }
+          });
+          resolve(isEmpty_1(r) ? true : r);
+        })["catch"](console.error);
+      });
+    }
+
+    function getFieldValue(name) {
+      var _target$current;
+
+      if (!name) return null;
+      var target = formItemsRef.current.find(function (_ref5) {
+        var formItemRef = _ref5.current;
+        return (formItemRef === null || formItemRef === void 0 ? void 0 : formItemRef.name) === name;
+      });
+      return (_target$current = target.current) === null || _target$current === void 0 ? void 0 : _target$current.value;
+    }
+
+    function getFieldsValue(nameList) {
+      var fieldsValue = {};
+      var formItemsMap = getFormItemsMap();
+
+      if (nameList === true) {
+        formItemsRef.current.forEach(function (_ref6) {
+          var formItemRef = _ref6.current;
+
+          if (formItemRef !== null && formItemRef !== void 0 && formItemRef.name) {
+            fieldsValue[formItemRef.name] = formItemRef.value;
+          }
+        });
+      } else {
+        if (!Array.isArray(nameList)) throw new Error("getFieldsValue \u53C2\u6570\u9700\u8981 Array \u7C7B\u578B");
+        nameList.forEach(function (name) {
+          if (formItemsMap[name]) fieldsValue[name] = formItemsMap[name].value;
+        });
+      }
+
+      return fieldsValue;
+    }
+
+    function setFieldsValue() {
+      var fields = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+      var formItemsMap = getFormItemsMap();
+      Object.keys(fields).forEach(function (key) {
+        var _formItemsMap$key;
+
+        (_formItemsMap$key = formItemsMap[key]) === null || _formItemsMap$key === void 0 ? void 0 : _formItemsMap$key.setValue(fields[key]);
+      });
+    }
+
+    function setFields() {
+      var fields = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+      if (!Array.isArray(fields)) throw new Error("setFields \u53C2\u6570\u9700\u8981 Array \u7C7B\u578B");
+      var formItemsMap = getFormItemsMap();
+      fields.forEach(function (field) {
+        var _formItemsMap$name;
+
+        var name = field.name,
+            value = field.value,
+            status = field.status;
+        (_formItemsMap$name = formItemsMap[name]) === null || _formItemsMap$name === void 0 ? void 0 : _formItemsMap$name.setField({
+          value: value,
+          status: status
+        });
+      });
+    }
+
+    function reset(params) {
+      if (typeof params === "undefined") {
+        formItemsRef.current.forEach(function (_ref7) {
+          var formItemRef = _ref7.current;
+          formItemRef && (formItemRef === null || formItemRef === void 0 ? void 0 : formItemRef.resetField());
+        });
+      } else {
+        var _params$type = params.type,
+            type = _params$type === void 0 ? "initial" : _params$type,
+            _params$fields = params.fields,
+            fields = _params$fields === void 0 ? [] : _params$fields;
+        var formItemsMap = getFormItemsMap();
+        fields.forEach(function (name) {
+          var _formItemsMap$name2;
+
+          (_formItemsMap$name2 = formItemsMap[name]) === null || _formItemsMap$name2 === void 0 ? void 0 : _formItemsMap$name2.resetField(type);
+        });
+      }
+    }
+
+    function clearValidate(fields) {
+      if (typeof fields === "undefined") {
+        formItemsRef.current.forEach(function (_ref8) {
+          var formItemRef = _ref8.current;
+          formItemRef && (formItemRef === null || formItemRef === void 0 ? void 0 : formItemRef.resetValidate());
+        });
+      } else {
+        if (!Array.isArray(fields)) throw new Error("clearValidate \u53C2\u6570\u9700\u8981 Array \u7C7B\u578B");
+        var formItemsMap = getFormItemsMap();
+        fields.forEach(function (name) {
+          var _formItemsMap$name3;
+
+          (_formItemsMap$name3 = formItemsMap[name]) === null || _formItemsMap$name3 === void 0 ? void 0 : _formItemsMap$name3.resetValidate();
+        });
+      }
+    }
+
+    function setValidateMessage(message) {
+      var formItemsMap = getFormItemsMap();
+      Object.keys(message).forEach(function (name) {
+        formItemsMap[name].setValidateMessage(message[name]);
+      });
+    }
+
+    return {
+      submit: submit,
+      reset: reset,
+      validate: validate,
+      clearValidate: clearValidate,
+      setFields: setFields,
+      setFieldsValue: setFieldsValue,
+      setValidateMessage: setValidateMessage,
+      getFieldValue: getFieldValue,
+      getFieldsValue: getFieldsValue
+    };
+  }
+
   var FormContext = /*#__PURE__*/React__default["default"].createContext({
     labelWidth: "calc(1 / 12 * 100%)",
     labelAlign: "right",
@@ -40044,33 +40373,6 @@
     return React__default["default"].useContext(FormContext);
   };
 
-  /**
-   * Checks if `value` is `null` or `undefined`.
-   *
-   * @static
-   * @memberOf _
-   * @since 4.0.0
-   * @category Lang
-   * @param {*} value The value to check.
-   * @returns {boolean} Returns `true` if `value` is nullish, else `false`.
-   * @example
-   *
-   * _.isNil(null);
-   * // => true
-   *
-   * _.isNil(void 0);
-   * // => true
-   *
-   * _.isNil(NaN);
-   * // => false
-   */
-
-  function isNil(value) {
-    return value == null;
-  }
-
-  var isNil_1 = isNil;
-
   var copyObject$1 = _copyObject,
       createAssigner = _createAssigner,
       keysIn = keysIn_1;
@@ -41885,7 +42187,9 @@
   };
 
   function xhr(_ref) {
-    var action = _ref.action,
+    var _ref$method = _ref.method,
+        method = _ref$method === void 0 ? "POST" : _ref$method,
+        action = _ref.action,
         _ref$withCredentials = _ref.withCredentials,
         withCredentials = _ref$withCredentials === void 0 ? false : _ref$withCredentials,
         _ref$headers = _ref.headers,
@@ -41914,7 +42218,7 @@
     innerFiles.forEach(function (f) {
       formData.append(name, f.raw);
     });
-    xhr2.open("post", action, true);
+    xhr2.open(method, action, true);
     Object.keys(headers).forEach(function (key) {
       xhr2.setRequestHeader(key, headers[key]);
     });
@@ -42411,9 +42715,9 @@
 
   var _excluded$6 = ["value", "defaultFiles", "files", "onChange"];
 
-  function ownKeys$o(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+  function ownKeys$n(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-  function _objectSpread$o(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$o(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$o(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+  function _objectSpread$n(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$n(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$n(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
   function useDefaultValue(props, defaultDefaultValue) {
     var value = props.value,
         defaultFiles = props.defaultFiles,
@@ -42432,7 +42736,7 @@
         finalValue = _useDefault2[0],
         finalOnChange = _useDefault2[1];
 
-    return _objectSpread$o({
+    return _objectSpread$n({
       files: finalValue,
       onChange: finalOnChange
     }, restProps);
@@ -42491,12 +42795,14 @@
 
   function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
-  function ownKeys$n(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+  function ownKeys$m(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-  function _objectSpread$n(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$n(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$n(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+  function _objectSpread$m(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$m(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$m(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
   var Upload$1 = function Upload(props, ref) {
     var _useDefaultValue = useDefaultValue(props, []),
+        _useDefaultValue$meth = _useDefaultValue.method,
+        method = _useDefaultValue$meth === void 0 ? "post" : _useDefaultValue$meth,
         disabled = _useDefaultValue.disabled,
         multiple = _useDefaultValue.multiple,
         accept = _useDefaultValue.accept,
@@ -42514,7 +42820,6 @@
         tips = _useDefaultValue.tips,
         format = _useDefaultValue.format,
         data = _useDefaultValue.data,
-        headers = _useDefaultValue.headers,
         withCredentials = _useDefaultValue.withCredentials,
         _useDefaultValue$auto = _useDefaultValue.autoUpload,
         autoUpload = _useDefaultValue$auto === void 0 ? true : _useDefaultValue$auto,
@@ -42537,6 +42842,8 @@
         customDraggerRender = _useDefaultValue.customDraggerRender,
         children = _useDefaultValue.children;
 
+    var headers = props.headers;
+
     var _useConfig = useConfig$1(),
         classPrefix = _useConfig.classPrefix;
 
@@ -42712,7 +43019,7 @@
           _ref3$type = _ref3.type,
           type = _ref3$type === void 0 ? "mock" : _ref3$type;
 
-      var tmpFile = _objectSpread$n({}, file);
+      var tmpFile = _objectSpread$m({}, file);
 
       tmpFile.percent = percent;
       var progressCtx = {
@@ -42747,7 +43054,7 @@
           var r = res.response || {};
           onError({
             file: file,
-            response: _objectSpread$n(_objectSpread$n({}, r), {}, {
+            response: _objectSpread$m(_objectSpread$m({}, r), {}, {
               error: res.error
             })
           });
@@ -42761,7 +43068,7 @@
           while (1) {
             switch (_context.prev = _context.next) {
               case 0:
-                file = _objectSpread$n({}, uploadFile);
+                file = _objectSpread$m({}, uploadFile);
 
                 if (!(file.status !== "waiting")) {
                   _context.next = 3;
@@ -42792,6 +43099,7 @@
 
               case 10:
                 file.xhr = xhr({
+                  method: method,
                   action: action,
                   data: data,
                   file: file,
@@ -42814,7 +43122,7 @@
       return function (_x) {
         return _ref4.apply(this, arguments);
       };
-    }(), [action, data, handleProgress, handleRequestMethod, handleSuccess, headers, name, onError, requestMethod, withCredentials]);
+    }(), [method, action, data, handleProgress, handleRequestMethod, handleSuccess, headers, name, onError, requestMethod, withCredentials]);
 
     function handleRequestMethodResponse(res) {
       if (!res) {
@@ -42846,7 +43154,7 @@
 
         var file = typeof format === "function" ? format(fileRaw) : fileRaw;
 
-        var uploadFile = _objectSpread$n({
+        var uploadFile = _objectSpread$m({
           raw: fileRaw,
           lastModified: fileRaw.lastModified,
           name: fileRaw.name,
@@ -43145,6 +43453,14 @@
 
   var Upload = _Upload;
 
+  function renderTNode(tnode, defaultNode) {
+    if (typeof tnode === "function") {
+      return tnode();
+    }
+
+    return tnode || defaultNode;
+  }
+
   var isDate$2 = {exports: {}};
 
   var merge = {exports: {}};
@@ -44131,9 +44447,9 @@
 
   var isURL = /*@__PURE__*/getDefaultExportFromCjs(isURL$1.exports);
 
-  function ownKeys$m(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+  function ownKeys$l(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-  function _objectSpread$m(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$m(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$m(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+  function _objectSpread$l(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$l(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$l(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
   function isValueEmpty(val) {
     var type = Object.prototype.toString.call(val);
     var typeMap = {
@@ -44262,7 +44578,7 @@
                 break;
               }
 
-              return _context.abrupt("return", _objectSpread$m(_objectSpread$m({}, rule), {}, {
+              return _context.abrupt("return", _objectSpread$l(_objectSpread$l({}, rule), {}, {
                 result: validateResult
               }));
 
@@ -44318,9 +44634,9 @@
     return _validate.apply(this, arguments);
   }
 
-  function ownKeys$l(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+  function ownKeys$k(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-  function _objectSpread$l(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$l(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$l(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+  function _objectSpread$k(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$k(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$k(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
   var ctrlKeyMap = /* @__PURE__ */new Map();
   ctrlKeyMap.set(Checkbox, "checked");
@@ -44335,8 +44651,8 @@
     React__default["default"].Children.forEach(children, function (child) {
       if (!child) return;
 
-      if (_typeof(child.type) === "object") {
-        defaultInitialData = initialDataMap.get(child.type) || initialData;
+      if ( /*#__PURE__*/React__default["default"].isValidElement(child) && typeof initialData === "undefined") {
+        defaultInitialData = initialDataMap.get(child.type);
       }
     });
     return defaultInitialData;
@@ -44348,27 +44664,13 @@
     var _useConfig = useConfig$1(),
         classPrefix = _useConfig.classPrefix;
 
-    var children = props.children,
-        label = props.label,
-        name = props.name,
-        help = props.help,
-        statusIconFromProp = props.statusIcon,
-        rulesFromProp = props.rules,
-        labelWidth = props.labelWidth,
-        labelAlign = props.labelAlign,
-        initialData = props.initialData,
-        requiredMark = props.requiredMark,
-        successBorder = props.successBorder,
-        className = props.className,
-        formItemStyle = props.style;
-
     var _useFormContext = useFormContext(),
         colon = _useFormContext.colon,
-        requiredMarkFromContext = _useFormContext.requiredMark,
         layout = _useFormContext.layout,
+        requiredMarkFromContext = _useFormContext.requiredMark,
         labelAlignFromContext = _useFormContext.labelAlign,
         labelWidthFromContext = _useFormContext.labelWidth,
-        showErrorMessage = _useFormContext.showErrorMessage,
+        showErrorMessageFromContext = _useFormContext.showErrorMessage,
         disabledFromContext = _useFormContext.disabled,
         resetTypeFromContext = _useFormContext.resetType,
         rulesFromContext = _useFormContext.rules,
@@ -44377,6 +44679,27 @@
         formItemsRef = _useFormContext.formItemsRef,
         onFormItemValueChange = _useFormContext.onFormItemValueChange;
 
+    var children = props.children,
+        style = props.style,
+        label = props.label,
+        name = props.name,
+        help = props.help,
+        initialData = props.initialData,
+        className = props.className,
+        successBorder = props.successBorder,
+        _props$statusIcon = props.statusIcon,
+        statusIcon = _props$statusIcon === void 0 ? statusIconFromContext : _props$statusIcon,
+        _props$rules = props.rules,
+        innerRules = _props$rules === void 0 ? (rulesFromContext === null || rulesFromContext === void 0 ? void 0 : rulesFromContext[name]) || [] : _props$rules,
+        _props$labelWidth = props.labelWidth,
+        labelWidth = _props$labelWidth === void 0 ? labelWidthFromContext : _props$labelWidth,
+        _props$labelAlign = props.labelAlign,
+        labelAlign = _props$labelAlign === void 0 ? labelAlignFromContext : _props$labelAlign,
+        _props$requiredMark = props.requiredMark,
+        requiredMark = _props$requiredMark === void 0 ? requiredMarkFromContext : _props$requiredMark,
+        _props$showErrorMessa = props.showErrorMessage,
+        showErrorMessage = _props$showErrorMessa === void 0 ? showErrorMessageFromContext : _props$showErrorMessa;
+
     var _useState = React.useState([]),
         _useState2 = _slicedToArray(_useState, 2),
         errorList = _useState2[0],
@@ -44413,14 +44736,10 @@
     var innerFormItemsRef = React.useRef([]);
     var shouldValidate = React.useRef(null);
     var isMounted = React.useRef(false);
-    var innerRules = rulesFromContext && rulesFromContext[name] || rulesFromProp || [];
-    var innerLabelWidth = isNil_1(labelWidth) ? labelWidthFromContext : labelWidth;
-    var innerLabelAlign = isNil_1(labelAlign) ? labelAlignFromContext : labelAlign;
-    var innerRequiredMark = isNil_1(requiredMark) ? requiredMarkFromContext : requiredMark;
     var formItemClass = classNames$1(className, "".concat(classPrefix, "-form__item"), (_classNames = {}, _defineProperty$2(_classNames, "".concat(classPrefix, "-form-item__").concat(name), name), _defineProperty$2(_classNames, "".concat(classPrefix, "-form__item-with-help"), help), _defineProperty$2(_classNames, "".concat(classPrefix, "-form__item-with-extra"), renderTipsInfo()), _classNames));
-    var formItemLabelClass = classNames$1("".concat(classPrefix, "-form__label"), (_classNames2 = {}, _defineProperty$2(_classNames2, "".concat(classPrefix, "-form__label--required"), innerRequiredMark && innerRules.filter(function (rule) {
+    var formItemLabelClass = classNames$1("".concat(classPrefix, "-form__label"), (_classNames2 = {}, _defineProperty$2(_classNames2, "".concat(classPrefix, "-form__label--required"), requiredMark && innerRules.filter(function (rule) {
       return rule.required;
-    }).length > 0), _defineProperty$2(_classNames2, "".concat(classPrefix, "-form__label--colon"), colon && label), _defineProperty$2(_classNames2, "".concat(classPrefix, "-form__label--top"), innerLabelAlign === "top" || !innerLabelWidth), _defineProperty$2(_classNames2, "".concat(classPrefix, "-form__label--left"), innerLabelAlign === "left" && innerLabelWidth), _defineProperty$2(_classNames2, "".concat(classPrefix, "-form__label--right"), innerLabelAlign === "right" && innerLabelWidth), _classNames2));
+    }).length > 0), _defineProperty$2(_classNames2, "".concat(classPrefix, "-form__label--colon"), colon && label), _defineProperty$2(_classNames2, "".concat(classPrefix, "-form__label--top"), labelAlign === "top" || !labelWidth), _defineProperty$2(_classNames2, "".concat(classPrefix, "-form__label--left"), labelAlign === "left" && labelWidth), _defineProperty$2(_classNames2, "".concat(classPrefix, "-form__label--right"), labelAlign === "right" && labelWidth), _classNames2));
 
     var contentClass = function contentClass() {
       var _classNames4;
@@ -44442,20 +44761,20 @@
     var labelStyle = {};
     var contentStyle = {};
 
-    if (innerLabelWidth && innerLabelAlign !== "top") {
-      if (typeof innerLabelWidth === "number") {
+    if (labelWidth && labelAlign !== "top") {
+      if (typeof labelWidth === "number") {
         labelStyle = {
-          width: "".concat(innerLabelWidth, "px")
+          width: "".concat(labelWidth, "px")
         };
         contentStyle = {
-          marginLeft: layout !== "inline" ? "".concat(innerLabelWidth, "px") : ""
+          marginLeft: layout !== "inline" ? "".concat(labelWidth, "px") : ""
         };
       } else {
         labelStyle = {
-          width: innerLabelWidth
+          width: labelWidth
         };
         contentStyle = {
-          marginLeft: layout !== "inline" ? innerLabelWidth : ""
+          marginLeft: layout !== "inline" ? labelWidth : ""
         };
       }
     }
@@ -44464,7 +44783,7 @@
       var helpNode = null;
       if (help) helpNode = /* @__PURE__ */React__default["default"].createElement("div", {
         className: "".concat(classPrefix, "-form__help")
-      }, help);
+      }, renderTNode(help));
       var list = errorList;
 
       if (showErrorMessage && list && list[0] && list[0].message) {
@@ -44483,7 +44802,7 @@
     }
 
     var renderSuffixIcon = function renderSuffixIcon() {
-      if (statusIconFromProp === false) return null;
+      if (statusIcon === false) return null;
 
       var resultIcon = function resultIcon(iconSlot) {
         return /* @__PURE__ */React__default["default"].createElement("span", {
@@ -44518,22 +44837,18 @@
         return null;
       };
 
-      if ( /*#__PURE__*/React__default["default"].isValidElement(statusIconFromProp)) {
-        return resultIcon( /*#__PURE__*/React__default["default"].cloneElement(statusIconFromProp, _objectSpread$l({
+      if ( /*#__PURE__*/React__default["default"].isValidElement(statusIcon)) {
+        return resultIcon( /*#__PURE__*/React__default["default"].cloneElement(statusIcon, _objectSpread$k({
           style: {
             color: "unset"
           }
-        }, statusIconFromProp.props)));
+        }, statusIcon.props)));
       }
 
-      if (statusIconFromContext === true) {
+      if (statusIcon === true) {
         return getDefaultIcon();
       }
 
-      if ( /*#__PURE__*/React__default["default"].isValidElement(statusIconFromContext)) {
-        return resultIcon(statusIconFromProp);
-      }
-
       return null;
     };
 
@@ -44598,8 +44913,8 @@
     }
 
     function getResetValue(resetType) {
-      if (resetType === "initial" && "initialData" in props) {
-        return initialData;
+      if (resetType === "initial") {
+        return getDefaultInitialData(children, initialData);
       }
 
       var emptyValue = "";
@@ -44716,7 +45031,7 @@
     });
     return /* @__PURE__ */React__default["default"].createElement("div", {
       className: formItemClass,
-      style: formItemStyle,
+      style: style,
       ref: ref
     }, label && /* @__PURE__ */React__default["default"].createElement("div", {
       className: formItemLabelClass,
@@ -44765,7 +45080,7 @@
           ctrlKey = ctrlKeyMap.get(child.type) || "value";
         }
 
-        return /*#__PURE__*/React__default["default"].cloneElement(child, _objectSpread$l(_objectSpread$l({
+        return /*#__PURE__*/React__default["default"].cloneElement(child, _objectSpread$k(_objectSpread$k({
           disabled: disabledFromContext
         }, child.props), {}, (_objectSpread2 = {}, _defineProperty$2(_objectSpread2, ctrlKey, formValue), _defineProperty$2(_objectSpread2, "onChange", function onChange(value) {
           onChangeFromProps.call(null, value);
@@ -44780,9 +45095,6 @@
     }), renderSuffixIcon()), renderTipsInfo()));
   });
 
-  function ownKeys$k(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-  function _objectSpread$k(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$k(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$k(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
   var Form$1 = forwardRefWithStatics(function (props, ref) {
     var _useConfig = useConfig$1(),
         classPrefix = _useConfig.classPrefix,
@@ -44815,54 +45127,40 @@
         preventSubmitDefault = _props$preventSubmitD === void 0 ? true : _props$preventSubmitD,
         disabled = props.disabled,
         children = props.children,
-        onSubmit = props.onSubmit,
         onReset = props.onReset,
         _props$onValuesChange = props.onValuesChange,
         onValuesChange = _props$onValuesChange === void 0 ? noop$1 : _props$onValuesChange;
     var formClass = classNames$1(className, "".concat(classPrefix, "-form"), _defineProperty$2({}, "".concat(classPrefix, "-form-inline"), layout === "inline"));
     var formRef = React.useRef();
     var formItemsRef = React.useRef([]);
-    var FORM_ITEM_CLASS_PREFIX = "".concat(classPrefix, "-form-item__");
-
-    function getFormItemsMap() {
-      var formItemsMap = formItemsRef.current.reduce(function (acc, _ref) {
-        var currItem = _ref.current;
-
-        if (currItem !== null && currItem !== void 0 && currItem.name) {
-          var name = currItem.name;
-          return _objectSpread$k(_objectSpread$k({}, acc), {}, _defineProperty$2({}, name, currItem));
-        }
-
-        return acc;
-      }, {});
-      return formItemsMap;
-    }
-
-    function getFirstError(r) {
-      var _r$firstKey$;
-
-      if (r === true) return;
-
-      var _Object$keys = Object.keys(r),
-          _Object$keys2 = _slicedToArray(_Object$keys, 1),
-          firstKey = _Object$keys2[0];
-
-      if (scrollToFirstError) {
-        scrollTo(".".concat(FORM_ITEM_CLASS_PREFIX + firstKey));
-      }
 
-      return (_r$firstKey$ = r[firstKey][0]) === null || _r$firstKey$ === void 0 ? void 0 : _r$firstKey$.message;
-    }
+    var _useInstance = useInstance(props, formRef, formItemsRef),
+        submit = _useInstance.submit,
+        reset = _useInstance.reset,
+        getFieldValue = _useInstance.getFieldValue,
+        getFieldsValue = _useInstance.getFieldsValue,
+        setFieldsValue = _useInstance.setFieldsValue,
+        setFields = _useInstance.setFields,
+        validate = _useInstance.validate,
+        clearValidate = _useInstance.clearValidate,
+        setValidateMessage = _useInstance.setValidateMessage;
 
-    function scrollTo(selector) {
-      var dom = formRef.current.querySelector(selector);
-      var behavior = scrollToFirstError;
-      dom && dom.scrollIntoView({
-        behavior: behavior
-      });
-    }
+    React.useImperativeHandle(ref, function () {
+      return {
+        currentElement: formRef.current,
+        submit: submit,
+        reset: reset,
+        getFieldValue: getFieldValue,
+        getFieldsValue: getFieldsValue,
+        setFieldsValue: setFieldsValue,
+        setFields: setFields,
+        validate: validate,
+        clearValidate: clearValidate,
+        setValidateMessage: setValidateMessage
+      };
+    });
 
-    function submitHandler(e) {
+    function onResetHandler(e) {
       if (preventSubmitDefault) {
         var _e$preventDefault, _e$stopPropagation;
 
@@ -44870,26 +45168,8 @@
         (_e$stopPropagation = e.stopPropagation) === null || _e$stopPropagation === void 0 ? void 0 : _e$stopPropagation.call(e);
       }
 
-      validate().then(function (r) {
-        var firstError = getFirstError(r);
-        onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit({
-          validateResult: r,
-          firstError: firstError,
-          e: e
-        });
-      });
-    }
-
-    function resetHandler(e) {
-      if (preventSubmitDefault) {
-        var _e$preventDefault2, _e$stopPropagation2;
-
-        (_e$preventDefault2 = e.preventDefault) === null || _e$preventDefault2 === void 0 ? void 0 : _e$preventDefault2.call(e);
-        (_e$stopPropagation2 = e.stopPropagation) === null || _e$stopPropagation2 === void 0 ? void 0 : _e$stopPropagation2.call(e);
-      }
-
-      formItemsRef.current.forEach(function (_ref2) {
-        var formItemRef = _ref2.current;
+      formItemsRef.current.forEach(function (_ref) {
+        var formItemRef = _ref.current;
         formItemRef && (formItemRef === null || formItemRef === void 0 ? void 0 : formItemRef.resetField());
       });
       onReset === null || onReset === void 0 ? void 0 : onReset({
@@ -44897,162 +45177,6 @@
       });
     }
 
-    function validate(param) {
-      function needValidate(name, fields2) {
-        if (!fields2 || !Array.isArray(fields2)) return true;
-        return fields2.indexOf(name) !== -1;
-      }
-
-      var _ref3 = param || {},
-          fields = _ref3.fields,
-          _ref3$trigger = _ref3.trigger,
-          trigger = _ref3$trigger === void 0 ? "all" : _ref3$trigger;
-
-      var list = formItemsRef.current.filter(function (_ref4) {
-        var formItemRef = _ref4.current;
-        return formItemRef && isFunction_1(formItemRef.validate) && needValidate(formItemRef.name, fields);
-      }).map(function (_ref5) {
-        var formItemRef = _ref5.current;
-        return formItemRef.validate(trigger);
-      });
-      return new Promise(function (resolve) {
-        Promise.all(flatten_1(list)).then(function (arr) {
-          var r = arr.reduce(function (r2, err) {
-            return Object.assign(r2 || {}, err);
-          }, {});
-          Object.keys(r).forEach(function (key) {
-            if (r[key] === true) {
-              delete r[key];
-            } else {
-              r[key] = r[key].filter(function (fr) {
-                return fr.result === false;
-              });
-            }
-          });
-          resolve(isEmpty_1(r) ? true : r);
-        })["catch"](console.error);
-      });
-    }
-
-    function getFieldValue(name) {
-      var _target$current;
-
-      if (!name) return null;
-      var target = formItemsRef.current.find(function (_ref6) {
-        var formItemRef = _ref6.current;
-        return (formItemRef === null || formItemRef === void 0 ? void 0 : formItemRef.name) === name;
-      });
-      return (_target$current = target.current) === null || _target$current === void 0 ? void 0 : _target$current.value;
-    }
-
-    function getFieldsValue(nameList) {
-      var fieldsValue = {};
-      var formItemsMap = getFormItemsMap();
-
-      if (nameList === true) {
-        formItemsRef.current.forEach(function (_ref7) {
-          var formItemRef = _ref7.current;
-
-          if (formItemRef !== null && formItemRef !== void 0 && formItemRef.name) {
-            fieldsValue[formItemRef.name] = formItemRef.value;
-          }
-        });
-      } else {
-        if (!Array.isArray(nameList)) throw new Error("getFieldsValue \u53C2\u6570\u9700\u8981 Array \u7C7B\u578B");
-        nameList.forEach(function (name) {
-          if (formItemsMap[name]) fieldsValue[name] = formItemsMap[name].value;
-        });
-      }
-
-      return fieldsValue;
-    }
-
-    function setFieldsValue() {
-      var fields = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-      var formItemsMap = getFormItemsMap();
-      Object.keys(fields).forEach(function (key) {
-        var _formItemsMap$key;
-
-        (_formItemsMap$key = formItemsMap[key]) === null || _formItemsMap$key === void 0 ? void 0 : _formItemsMap$key.setValue(fields[key]);
-      });
-    }
-
-    function setFields() {
-      var fields = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
-      if (!Array.isArray(fields)) throw new Error("setFields \u53C2\u6570\u9700\u8981 Array \u7C7B\u578B");
-      var formItemsMap = getFormItemsMap();
-      fields.forEach(function (field) {
-        var _formItemsMap$name;
-
-        var name = field.name,
-            value = field.value,
-            status = field.status;
-        (_formItemsMap$name = formItemsMap[name]) === null || _formItemsMap$name === void 0 ? void 0 : _formItemsMap$name.setField({
-          value: value,
-          status: status
-        });
-      });
-    }
-
-    function reset(params) {
-      if (typeof params === "undefined") {
-        formItemsRef.current.forEach(function (_ref8) {
-          var formItemRef = _ref8.current;
-          formItemRef && (formItemRef === null || formItemRef === void 0 ? void 0 : formItemRef.resetField());
-        });
-      } else {
-        var _params$type = params.type,
-            type = _params$type === void 0 ? "initial" : _params$type,
-            _params$fields = params.fields,
-            fields = _params$fields === void 0 ? [] : _params$fields;
-        var formItemsMap = getFormItemsMap();
-        fields.forEach(function (name) {
-          var _formItemsMap$name2;
-
-          (_formItemsMap$name2 = formItemsMap[name]) === null || _formItemsMap$name2 === void 0 ? void 0 : _formItemsMap$name2.resetField(type);
-        });
-      }
-    }
-
-    function clearValidate(fields) {
-      if (typeof fields === "undefined") {
-        formItemsRef.current.forEach(function (_ref9) {
-          var formItemRef = _ref9.current;
-          formItemRef && (formItemRef === null || formItemRef === void 0 ? void 0 : formItemRef.resetValidate());
-        });
-      } else {
-        if (!Array.isArray(fields)) throw new Error("clearValidate \u53C2\u6570\u9700\u8981 Array \u7C7B\u578B");
-        var formItemsMap = getFormItemsMap();
-        fields.forEach(function (name) {
-          var _formItemsMap$name3;
-
-          (_formItemsMap$name3 = formItemsMap[name]) === null || _formItemsMap$name3 === void 0 ? void 0 : _formItemsMap$name3.resetValidate();
-        });
-      }
-    }
-
-    function setValidateMessage(message) {
-      var formItemsMap = getFormItemsMap();
-      Object.keys(message).forEach(function (name) {
-        formItemsMap[name].setValidateMessage(message[name]);
-      });
-    }
-
-    React.useImperativeHandle(ref, function () {
-      return {
-        currentElement: formRef.current,
-        submit: submitHandler,
-        reset: reset,
-        getFieldValue: getFieldValue,
-        getFieldsValue: getFieldsValue,
-        setFieldsValue: setFieldsValue,
-        setFields: setFields,
-        validate: validate,
-        clearValidate: clearValidate,
-        setValidateMessage: setValidateMessage
-      };
-    });
-
     function onFormItemValueChange(changedValue) {
       var allFields = getFieldsValue(true);
       onValuesChange(changedValue, allFields);
@@ -45060,10 +45184,10 @@
 
     function onKeyDownHandler(e) {
       if (preventSubmitDefault && e.key === "Enter") {
-        var _e$preventDefault3, _e$stopPropagation3;
+        var _e$preventDefault2, _e$stopPropagation2;
 
-        (_e$preventDefault3 = e.preventDefault) === null || _e$preventDefault3 === void 0 ? void 0 : _e$preventDefault3.call(e);
-        (_e$stopPropagation3 = e.stopPropagation) === null || _e$stopPropagation3 === void 0 ? void 0 : _e$stopPropagation3.call(e);
+        (_e$preventDefault2 = e.preventDefault) === null || _e$preventDefault2 === void 0 ? void 0 : _e$preventDefault2.call(e);
+        (_e$stopPropagation2 = e.stopPropagation) === null || _e$stopPropagation2 === void 0 ? void 0 : _e$stopPropagation2.call(e);
       }
     }
 
@@ -45089,8 +45213,8 @@
       ref: formRef,
       style: style,
       className: formClass,
-      onSubmit: submitHandler,
-      onReset: resetHandler,
+      onSubmit: submit,
+      onReset: onResetHandler,
       onKeyDown: onKeyDownHandler
     }, children));
   }, {
@@ -45385,7 +45509,7 @@
       style: _objectSpread$j({
         zIndex: zIndex
       }, style),
-      tabIndex: 0,
+      tabIndex: -1,
       onKeyDown: onKeyDownEsc,
       onTransitionEnd: onTransitionEnd
     }, renderOverlay, /* @__PURE__ */React__default["default"].createElement("div", {
@@ -46682,7 +46806,8 @@
     var onChange = _ref.onChange,
         style = _ref.style,
         classPrefix = _ref.classPrefix,
-        toolTipProps = _ref.toolTipProps;
+        toolTipProps = _ref.toolTipProps,
+        hideTips = _ref.hideTips;
 
     var _useState = React.useState(false),
         _useState2 = _slicedToArray(_useState, 2),
@@ -46726,10 +46851,7 @@
       setPopupVisible(false);
     };
 
-    return /* @__PURE__ */React__default["default"].createElement(Tooltip$1, _objectSpread$c({
-      visible: popupVisible,
-      placement: "top"
-    }, toolTipProps), /* @__PURE__ */React__default["default"].createElement("div", {
+    var handleNode = /* @__PURE__ */React__default["default"].createElement("div", {
       style: style,
       className: "".concat(classPrefix, "-slider__button-wrapper"),
       onMouseDown: function onMouseDown(e) {
@@ -46743,7 +46865,11 @@
       }
     }, /* @__PURE__ */React__default["default"].createElement("div", {
       className: classNames$1("".concat(classPrefix, "-slider__button"), _defineProperty$2({}, "".concat(classPrefix, "-slider__button--dragging"), isDragging))
-    })));
+    }));
+    return hideTips ? handleNode : /* @__PURE__ */React__default["default"].createElement(Tooltip$1, _objectSpread$c({
+      visible: popupVisible,
+      placement: "top"
+    }, toolTipProps), handleNode);
   };
 
   function accAdd(arg1, arg2) {
@@ -46948,6 +47074,7 @@
     };
 
     var onSliderChange = function onSliderChange(event, nodeIndex) {
+      if (disabled) return;
       var clientKey = isVertical ? "clientY" : "clientX";
       var sliderPositionInfo = sliderRef.current.getBoundingClientRect();
       var sliderOffset = sliderPositionInfo[startDirection];
@@ -46962,13 +47089,17 @@
 
     var createHandleButton = function createHandleButton(nodeIndex, style2) {
       var currentValue = renderValue[nodeIndex];
-      var tipLabel = typeof label === "string" ? label.replace(/\$\{value\}/g, currentValue.toString()) : label;
-      if (tipLabel === true || !tipLabel) tipLabel = currentValue;
+      var tipLabel = currentValue;
+      if (isFunction_1(label)) tipLabel = label({
+        value: currentValue,
+        position: nodeIndex === LEFT_NODE ? "start" : "end"
+      });
+      if (isString_1(label)) tipLabel = label.replace(/\$\{value\}/g, currentValue.toString());
       return /* @__PURE__ */React__default["default"].createElement(SliderHandleButton, {
         toolTipProps: _objectSpread$b({
-          disabled: label === false,
           content: tipLabel
         }, tooltipProps),
+        hideTips: label === false,
         classPrefix: classPrefix,
         style: style2,
         onChange: function onChange(e) {
@@ -47081,7 +47212,7 @@
         setVisible(false);
       }
 
-      setValue(value2, "checked", node.getModel());
+      setValue(value2, "check", node.getModel());
     }
   }
   function valueChangeEffect(node, cascaderContext) {
@@ -47130,7 +47261,7 @@
       setFilterActive(false);
     }
 
-    setValue(checked, "checked", node.getModel());
+    setValue(checked, "check", node.getModel());
   }
 
   function getLabelIsEllipsis(node, size) {
@@ -47510,7 +47641,7 @@
         setValue = cascaderContext.setValue;
     if (disabled) return;
     var checked = node.setChecked(!node.isChecked());
-    setValue(checked, "unchecked", node.getModel());
+    setValue(checked, "uncheck", node.getModel());
 
     if (isFunction_1(onRemove)) {
       onRemove({
@@ -49303,8 +49434,6 @@
 
   dayjs.extend(customParseFormat);
   var TimePicker$1 = forwardRefWithStatics(function (props, ref) {
-    var _classNames;
-
     var TEXT_CONFIG = useTimePickerTextConfig();
 
     var _useDefaultValue = useDefaultValue$1(props),
@@ -49346,7 +49475,7 @@
         classPrefix = _useConfig.classPrefix;
 
     var name = "".concat(classPrefix, "-time-picker");
-    var inputClasses = classNames$1("".concat(name, "__group"), (_classNames = {}, _defineProperty$2(_classNames, "".concat(classPrefix, "-is-focused"), isPanelShowed), _defineProperty$2(_classNames, "".concat(classPrefix, "-input--focused"), isPanelShowed), _classNames));
+    var inputClasses = classNames$1("".concat(name, "__group"), _defineProperty$2({}, "".concat(classPrefix, "-is-focused"), isPanelShowed));
 
     var handleShowPopup = function handleShowPopup(visible, context) {
       setPanelShow(visible);
@@ -49381,7 +49510,7 @@
       trigger: "click",
       expandAnimation: true
     }, /* @__PURE__ */React__default["default"].createElement("div", {
-      className: classNames$1(name, className),
+      className: classNames$1(name, className, inputClasses),
       ref: ref,
       style: style
     }, /* @__PURE__ */React__default["default"].createElement(Input, {
@@ -49392,7 +49521,6 @@
       value: value ? " " : void 0,
       onClear: handleClear,
       placeholder: !value ? placeholder : void 0,
-      className: inputClasses,
       suffixIcon: /* @__PURE__ */React__default["default"].createElement(TimeIcon, null)
     }), value ? /* @__PURE__ */React__default["default"].createElement(TimePickerInputItems, {
       disabled: disabled,
@@ -50574,6 +50702,15 @@
   var TIME_FORMAT = "HH:mm:ss";
 
   var DatePicker$1 = function DatePicker(props) {
+    var _useLocaleReceiver = useLocaleReceiver("datePicker"),
+        _useLocaleReceiver2 = _slicedToArray(_useLocaleReceiver, 2),
+        local = _useLocaleReceiver2[0],
+        t = _useLocaleReceiver2[1];
+
+    var selectTimeText = t(local.selectTime);
+    var selectDateText = t(local.selectDate);
+    var confirmText = t(local.confirm);
+    var rangeSeparatorText = t(local.rangeSeparator);
     var className = props.className,
         style = props.style,
         allowInput = props.allowInput,
@@ -50581,32 +50718,26 @@
         disabled = props.disabled,
         disableDate = props.disableDate,
         enableTimePicker = props.enableTimePicker,
-        format = props.format,
+        _props$format = props.format,
+        format = _props$format === void 0 ? "YYYY-MM-DD" : _props$format,
         inputProps = props.inputProps,
-        mode = props.mode,
+        _props$mode = props.mode,
+        mode = _props$mode === void 0 ? "month" : _props$mode,
         popupProps = props.popupProps,
         prefixIcon = props.prefixIcon,
         presets = props.presets,
         range = props.range,
-        size = props.size,
+        _props$size = props.size,
+        size = _props$size === void 0 ? "medium" : _props$size,
         suffixIcon = props.suffixIcon,
         value = props.value,
         defaultValue = props.defaultValue,
         firstDayOfWeek = props.firstDayOfWeek,
+        _props$placeholder = props.placeholder,
+        placeholder = _props$placeholder === void 0 ? t(local.placeholder[mode]) : _props$placeholder,
         onChange = props.onChange,
         onPick = props.onPick;
 
-    var _useLocaleReceiver = useLocaleReceiver("datePicker"),
-        _useLocaleReceiver2 = _slicedToArray(_useLocaleReceiver, 2),
-        local = _useLocaleReceiver2[0],
-        t = _useLocaleReceiver2[1];
-
-    var selectTimeText = t(local.selectTime);
-    var selectDateText = t(local.selectDate);
-    var confirmText = t(local.confirm);
-    var rangeSeparatorText = t(local.rangeSeparator);
-    var placeholder = t(local.placeholder[mode]);
-
     var _useConfig = useConfig$1(),
         classPrefix = _useConfig.classPrefix;
 
@@ -51050,20 +51181,104 @@
   };
 
   DatePicker$1.displayName = "DatePicker";
-  DatePicker$1.defaultProps = {
-    format: "YYYY-MM-DD",
-    mode: "month",
-    placeholder: "\u8BF7\u9009\u62E9",
-    size: "medium"
-  };
 
   var DatePicker = DatePicker$1;
 
+  var CARD_SCALE = 210 / 332;
+  var itemWidth = 0.415;
+
+  var disposeIndex = function disposeIndex(index, currentIndex, childrenLength) {
+    if (currentIndex === 0 && index === childrenLength - 1) {
+      return -1;
+    }
+
+    if (currentIndex === childrenLength - 1 && index === 0) {
+      return childrenLength;
+    }
+
+    if (index < currentIndex - 1 && currentIndex - index >= childrenLength / 2) {
+      return childrenLength + 1;
+    }
+
+    if (index > currentIndex + 1 && index - currentIndex >= childrenLength / 2) {
+      return -2;
+    }
+
+    return index;
+  };
+
+  var calculateTranslate = function calculateTranslate(index, currentIndex, parentWidth, inStage) {
+    if (inStage) {
+      return parentWidth * ((index - currentIndex) * (1 - itemWidth * CARD_SCALE) - itemWidth + 1) / 2;
+    }
+
+    if (index < currentIndex) {
+      return -itemWidth * (1 + CARD_SCALE) * parentWidth / 2;
+    }
+
+    return (2 + itemWidth * (CARD_SCALE - 1)) * parentWidth / 2;
+  };
+
+  var getZindex = function getZindex(isActivity, inStage) {
+    if (isActivity) {
+      return 2;
+    }
+
+    if (inStage) {
+      return 1;
+    }
+
+    return 0;
+  };
+
   var SwiperItem = function SwiperItem(props) {
+    var _classnames;
+
     var children = props.children,
-        className = props.className;
+        currentIndex = props.currentIndex,
+        index = props.index,
+        animation = props.animation,
+        _props$duration = props.duration,
+        duration = _props$duration === void 0 ? 300 : _props$duration,
+        needAnimation = props.needAnimation,
+        _props$type = props.type,
+        type = _props$type === void 0 ? "default" : _props$type,
+        childrenLength = props.childrenLength,
+        getWrapAttribute = props.getWrapAttribute;
+
+    var _useConfig = useConfig$1(),
+        classPrefix = _useConfig.classPrefix;
+
+    var getSwiperItemStyle = function getSwiperItemStyle() {
+      if (animation === "fade") {
+        return {
+          opacity: currentIndex === index ? 1 : 0,
+          transition: needAnimation ? "opacity ".concat(duration / 1e3, "s") : ""
+        };
+      }
+
+      if (type === "card") {
+        var wrapWidth = getWrapAttribute("offsetWidth");
+        var translateIndex = index !== currentIndex && childrenLength > 2 ? disposeIndex(index, currentIndex, childrenLength) : index;
+        var inStage = Math.round(Math.abs(translateIndex - currentIndex)) <= 1;
+        var translate = calculateTranslate(translateIndex, currentIndex, wrapWidth, inStage).toFixed(2);
+        var isActivity = translateIndex === currentIndex;
+        var zIndex = getZindex(isActivity, inStage);
+        return {
+          msTransform: "translateX(".concat(translate, "px) scale(").concat(isActivity ? 1 : CARD_SCALE, ")"),
+          WebkitTransform: "translateX(".concat(translate, "px) scale(").concat(isActivity ? 1 : CARD_SCALE, ")"),
+          transform: "translateX(".concat(translate, "px) scale(").concat(isActivity ? 1 : CARD_SCALE, ")"),
+          transition: "transform ".concat(duration / 1e3, "s ease"),
+          zIndex: zIndex
+        };
+      }
+
+      return {};
+    };
+
     return /* @__PURE__ */React__default["default"].createElement("div", {
-      className: className
+      className: classNames$1("".concat(classPrefix, "-swiper__container__item"), (_classnames = {}, _defineProperty$2(_classnames, "".concat(classPrefix, "-swiper__card"), type === "card"), _defineProperty$2(_classnames, "".concat(classPrefix, "-is-active"), type === "card" && index === currentIndex), _defineProperty$2(_classnames, "".concat(classPrefix, "-swiper__fade"), animation === "fade"), _classnames)),
+      style: getSwiperItemStyle()
     }, children);
   };
 
@@ -51073,10 +51288,22 @@
 
   function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$4(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
+  var defaultNavigation = {
+    placement: "inside",
+    showSlideBtn: "always",
+    size: "medium",
+    type: "bars"
+  };
+
   var Swiper$1 = function Swiper(props) {
-    var _props$autoplay = props.autoplay,
+    var _classnames4, _classnames5;
+
+    var _props$animation = props.animation,
+        animation = _props$animation === void 0 ? "slide" : _props$animation,
+        _props$autoplay = props.autoplay,
         autoplay = _props$autoplay === void 0 ? true : _props$autoplay,
-        current = props.current,
+        _props$current = props.current,
+        current = _props$current === void 0 ? 0 : _props$current,
         _props$defaultCurrent = props.defaultCurrent,
         defaultCurrent = _props$defaultCurrent === void 0 ? 0 : _props$defaultCurrent,
         _props$direction = props.direction,
@@ -51085,27 +51312,59 @@
         duration = _props$duration === void 0 ? 300 : _props$duration,
         _props$interval = props.interval,
         interval = _props$interval === void 0 ? 5e3 : _props$interval,
+        _props$trigger = props.trigger,
+        trigger = _props$trigger === void 0 ? "hover" : _props$trigger,
+        height = props.height,
+        _props$loop = props.loop,
+        loop = _props$loop === void 0 ? true : _props$loop,
+        _props$stopOnHover = props.stopOnHover,
+        stopOnHover = _props$stopOnHover === void 0 ? true : _props$stopOnHover,
         _props$onChange = props.onChange,
         onChange = _props$onChange === void 0 ? noop$1 : _props$onChange,
         className = props.className,
-        children = props.children;
+        children = props.children,
+        navigation = props.navigation,
+        _props$type = props.type,
+        type = _props$type === void 0 ? "default" : _props$type;
 
     var _useConfig = useConfig$1(),
         classPrefix = _useConfig.classPrefix;
 
+    var navigationConfig = defaultNavigation;
+    var navigationNode = null;
+
+    if ( /*#__PURE__*/React.isValidElement(navigation)) {
+      navigationNode = navigation;
+    } else {
+      navigationConfig = _objectSpread$4(_objectSpread$4({}, defaultNavigation), navigation);
+    }
+
     var _useState = React.useState(defaultCurrent),
         _useState2 = _slicedToArray(_useState, 2),
         currentIndex = _useState2[0],
         setCurrentIndex = _useState2[1];
 
-    var _useState3 = React.useState(true),
+    var _useState3 = React.useState(false),
         _useState4 = _slicedToArray(_useState3, 2),
-        animation = _useState4[0],
-        setAnimation = _useState4[1];
+        needAnimation = _useState4[0],
+        setNeedAnimation = _useState4[1];
+
+    var _useState5 = React.useState(navigationConfig.showSlideBtn === "always"),
+        _useState6 = _slicedToArray(_useState5, 2),
+        arrowShow = _useState6[0],
+        setArrowShow = _useState6[1];
 
     var swiperTimer = React.useRef(null);
+    var swiperAnimationTimer = React.useRef(null);
     var isHovering = React.useRef(false);
-    var wrapperRef = React.useRef(null);
+    var swiperWrap = React.useRef(null);
+
+    var getWrapAttribute = function getWrapAttribute(attr) {
+      var _swiperWrap$current, _swiperWrap$current$p;
+
+      return (_swiperWrap$current = swiperWrap.current) === null || _swiperWrap$current === void 0 ? void 0 : (_swiperWrap$current$p = _swiperWrap$current.parentNode) === null || _swiperWrap$current$p === void 0 ? void 0 : _swiperWrap$current$p[attr];
+    };
+
     var childrenList = React.useMemo(function () {
       return React__default["default"].Children.toArray(children).filter(function (child) {
         return child.type.displayName === SwiperItem.displayName;
@@ -51113,22 +51372,28 @@
     }, [children]);
     var childrenLength = childrenList.length;
     var swiperItemList = childrenList.map(function (child, index) {
-      return /*#__PURE__*/React__default["default"].cloneElement(child, _objectSpread$4({
-        value: index
-      }, child.props));
+      return /*#__PURE__*/React__default["default"].cloneElement(child, _objectSpread$4(_objectSpread$4({
+        key: index,
+        index: index,
+        currentIndex: currentIndex,
+        needAnimation: needAnimation,
+        childrenLength: childrenLength,
+        getWrapAttribute: getWrapAttribute
+      }, props), child.props));
     });
 
-    if (childrenLength > 0) {
+    if (childrenLength > 0 && type === "default") {
       var firstEle = swiperItemList[0];
       swiperItemList.push( /*#__PURE__*/React__default["default"].cloneElement(firstEle, _objectSpread$4(_objectSpread$4({}, firstEle.props), {}, {
-        key: "".concat(firstEle.key, "-cloned")
+        key: childrenLength,
+        index: childrenLength
       })));
     }
 
     var swiperItemLength = swiperItemList.length;
     var swiperTo = React.useCallback(function (index, context) {
       onChange(index % childrenLength, context);
-      setAnimation(true);
+      setNeedAnimation(true);
       setCurrentIndex(index);
     }, [childrenLength, onChange]);
     var setTimer = React.useCallback(function () {
@@ -51146,78 +51411,241 @@
         swiperTimer.current = null;
       }
     }, []);
+    var isEnd = React.useCallback(function () {
+      if (type === "card") {
+        return !loop && currentIndex + 1 >= swiperItemLength;
+      }
+
+      return !loop && currentIndex + 2 >= swiperItemLength;
+    }, [loop, currentIndex, swiperItemLength, type]);
     React.useEffect(function () {
       if (current !== void 0) {
         swiperTo(current % childrenLength, {
-          source: ""
+          source: "autoplay"
         });
       }
     }, [current, childrenLength, swiperTo]);
     React.useEffect(function () {
-      if (!isHovering.current) {
-        clearTimer();
-        setTimer();
+      if (currentIndex + 1 > swiperItemLength && type === "card") {
+        return setCurrentIndex(0);
+      }
+
+      if (swiperAnimationTimer.current) {
+        clearTimeout(swiperAnimationTimer.current);
+        swiperAnimationTimer.current = null;
       }
-    }, [clearTimer, setTimer]);
-    React.useEffect(function () {
-      setTimeout(function () {
-        setAnimation(false);
 
-        if (currentIndex + 1 >= swiperItemLength) {
+      swiperAnimationTimer.current = setTimeout(function () {
+        setNeedAnimation(false);
+
+        if (isEnd()) {
+          clearTimer();
+        }
+
+        if (currentIndex + 1 >= swiperItemLength && type !== "card") {
           setCurrentIndex(0);
         }
       }, duration + 50);
-    }, [currentIndex, swiperItemLength, duration, direction]);
+    }, [currentIndex, swiperItemLength, duration, type, clearTimer, isEnd]);
+    React.useEffect(function () {
+      if (!isHovering.current || !stopOnHover) {
+        clearTimer();
+        setTimer();
+      }
+    }, [setTimer, clearTimer, stopOnHover]);
 
     var onMouseEnter = function onMouseEnter() {
       isHovering.current = true;
-      clearTimer();
+
+      if (stopOnHover) {
+        clearTimer();
+      }
+
+      if (navigationConfig.showSlideBtn === "hover") {
+        setArrowShow(true);
+      }
     };
 
     var onMouseLeave = function onMouseLeave() {
       isHovering.current = false;
-      setTimer();
+
+      if (!isEnd()) {
+        setTimer();
+      }
+
+      if (navigationConfig.showSlideBtn === "hover") {
+        setArrowShow(false);
+      }
     };
 
-    var wrapperStyle = {};
+    var navMouseAction = function navMouseAction(action, index) {
+      if (action === "enter"
+      /* Enter */
+      && trigger === "hover") {
+        swiperTo(index, {
+          source: "hover"
+        });
+      }
 
-    if (direction === "vertical") {
-      wrapperStyle = {
-        height: "".concat(swiperItemLength * 100, "%"),
-        top: "-".concat(currentIndex * 100, "%"),
-        transition: animation ? "top ".concat(duration / 1e3, "s") : ""
-      };
-    } else {
-      wrapperStyle = {
-        width: "".concat(swiperItemLength * 100, "%"),
-        left: "-".concat(currentIndex * 100, "%"),
-        transition: animation ? "left ".concat(duration / 1e3, "s") : ""
-      };
-    }
+      if (action === "click"
+      /* Click */
+      && trigger === "click") {
+        swiperTo(index, {
+          source: "click"
+        });
+      }
+    };
+
+    var arrowClick = function arrowClick(direction2) {
+      if (needAnimation) {
+        return false;
+      }
+
+      if (direction2 === "right"
+      /* Right */
+      ) {
+        if (type === "card") {
+          return swiperTo(currentIndex + 1 >= swiperItemLength ? 0 : currentIndex + 1, {
+            source: "click"
+          });
+        }
+
+        return swiperTo(currentIndex + 1, {
+          source: "click"
+        });
+      }
+
+      if (direction2 === "left"
+      /* Left */
+      ) {
+        if (currentIndex - 1 < 0) {
+          return swiperTo(childrenLength - 1, {
+            source: "click"
+          });
+        }
+
+        return swiperTo(currentIndex - 1, {
+          source: "click"
+        });
+      }
+    };
+
+    var createArrow = function createArrow(type2) {
+      if (!arrowShow) {
+        return "";
+      }
+
+      if (navigationConfig.type === "fraction" && type2 === "default"
+      /* Default */
+      ) {
+        return "";
+      }
+
+      var fractionIndex = currentIndex + 1 > childrenLength ? 1 : currentIndex + 1;
+      return /* @__PURE__ */React__default["default"].createElement("div", {
+        className: classNames$1("".concat(classPrefix, "-swiper__arrow"), _defineProperty$2({}, "".concat(classPrefix, "-swiper__arrow--default"), type2 === "default"))
+      }, /* @__PURE__ */React__default["default"].createElement("div", {
+        className: "".concat(classPrefix, "-swiper__arrow-left"),
+        onClick: function onClick() {
+          return arrowClick("left"
+          /* Left */
+          );
+        }
+      }, /* @__PURE__ */React__default["default"].createElement(ChevronLeftIcon, null)), type2 === "fraction"
+      /* Fraction */
+      ? /* @__PURE__ */React__default["default"].createElement("div", {
+        className: "".concat(classPrefix, "-swiper__navigation-text-fraction")
+      }, fractionIndex, "/", childrenLength) : "", /* @__PURE__ */React__default["default"].createElement("div", {
+        className: "".concat(classPrefix, "-swiper__arrow-right"),
+        onClick: function onClick() {
+          return arrowClick("right"
+          /* Right */
+          );
+        }
+      }, /* @__PURE__ */React__default["default"].createElement(ChevronRightIcon, null)));
+    };
+
+    var createNavigation = function createNavigation() {
+      if (navigationConfig.type === "fraction") {
+        return /* @__PURE__ */React__default["default"].createElement("div", {
+          className: classNames$1("".concat(classPrefix, "-swiper__navigation"), "".concat(classPrefix, "-swiper__navigation--fraction"))
+        }, createArrow("fraction"
+        /* Fraction */
+        ));
+      }
+
+      return navigationNode ? /* @__PURE__ */React__default["default"].createElement(React__default["default"].Fragment, null, navigationNode) : /* @__PURE__ */React__default["default"].createElement("ul", {
+        className: classNames$1("".concat(classPrefix, "-swiper__navigation"), _defineProperty$2({}, "".concat(classPrefix, "-swiper__navigation-bars"), navigationConfig.type === "bars"))
+      }, childrenList.map(function (_, i) {
+        return /* @__PURE__ */React__default["default"].createElement("li", {
+          key: i,
+          className: classNames$1("".concat(classPrefix, "-swiper__navigation-item"), _defineProperty$2({}, "".concat(classPrefix, "-is-active"), i === currentIndex % childrenLength)),
+          onClick: function onClick() {
+            return navMouseAction("click"
+            /* Click */
+            , i);
+          },
+          onMouseEnter: function onMouseEnter() {
+            return navMouseAction("enter"
+            /* Enter */
+            , i);
+          },
+          onMouseLeave: function onMouseLeave() {
+            return navMouseAction("leave"
+            /* Leave */
+            , i);
+          }
+        }, /* @__PURE__ */React__default["default"].createElement("span", null));
+      }));
+    };
+
+    var getWrapperStyle = function getWrapperStyle() {
+      var offsetHeight = height ? "".concat(height, "px") : "".concat(getWrapAttribute("offsetHeight"), "px");
+
+      if (type === "card" || animation === "fade") {
+        return {
+          height: offsetHeight
+        };
+      }
+
+      if (animation === "slide") {
+        if (direction === "vertical") {
+          return {
+            height: offsetHeight,
+            msTransform: "translate3d(0, -".concat(currentIndex * 100, "%, 0px)"),
+            WebkitTransform: "translate3d(0, -".concat(currentIndex * 100, "%, 0px)"),
+            transform: "translate3d(0, -".concat(currentIndex * 100, "%, 0px)"),
+            transition: needAnimation ? "transform ".concat(duration / 1e3, "s ease") : ""
+          };
+        }
+
+        return {
+          msTransform: "translate3d(-".concat(currentIndex * 100, "%, 0px, 0px)"),
+          WebkitTransform: "translate3d(-".concat(currentIndex * 100, "%, 0px, 0px)"),
+          transform: "translate3d(-".concat(currentIndex * 100, "%, 0px, 0px)"),
+          transition: needAnimation ? "transform ".concat(duration / 1e3, "s ease") : ""
+        };
+      }
+    };
 
     return /* @__PURE__ */React__default["default"].createElement("div", {
       className: classNames$1("".concat(classPrefix, "-swiper"), className),
       onMouseEnter: onMouseEnter,
-      onMouseLeave: onMouseLeave
+      onMouseLeave: onMouseLeave,
+      ref: swiperWrap
     }, /* @__PURE__ */React__default["default"].createElement("div", {
-      className: "".concat(classPrefix, "-swiper__content")
+      className: classNames$1("".concat(classPrefix, "-swiper__wrap"), (_classnames4 = {}, _defineProperty$2(_classnames4, "".concat(classPrefix, "-swiper--inside"), navigationConfig.placement === "inside"), _defineProperty$2(_classnames4, "".concat(classPrefix, "-swiper--outside"), navigationConfig.placement === "outside"), _defineProperty$2(_classnames4, "".concat(classPrefix, "-swiper--vertical"), direction === "vertical"), _defineProperty$2(_classnames4, "".concat(classPrefix, "-swiper--large"), navigationConfig.size === "large"), _defineProperty$2(_classnames4, "".concat(classPrefix, "-swiper--small"), navigationConfig.size === "small"), _classnames4))
     }, /* @__PURE__ */React__default["default"].createElement("div", {
-      ref: wrapperRef,
-      className: "".concat(classPrefix, "-swiper__swiper-wrap--").concat(direction),
-      style: wrapperStyle
-    }, swiperItemList)), /* @__PURE__ */React__default["default"].createElement("ul", {
-      className: "".concat(classPrefix, "-swiper__trigger-wrap")
-    }, childrenList.map(function (_, i) {
-      return /* @__PURE__ */React__default["default"].createElement("li", {
-        key: i,
-        className: i === currentIndex % childrenLength ? "".concat(classPrefix, "-swiper__trigger--active") : "",
-        onClick: function onClick() {
-          return swiperTo(i, {
-            source: "touch"
-          });
-        }
-      });
-    })));
+      className: classNames$1("".concat(classPrefix, "-swiper__content"), (_classnames5 = {}, _defineProperty$2(_classnames5, "".concat(classPrefix, "-swiper-fade"), animation === "fade"), _defineProperty$2(_classnames5, "".concat(classPrefix, "-swiper-card"), type === "card"), _classnames5)),
+      style: {
+        height: ""
+      }
+    }, /* @__PURE__ */React__default["default"].createElement("div", {
+      className: "".concat(classPrefix, "-swiper__container"),
+      style: getWrapperStyle()
+    }, swiperItemList)), createNavigation(), createArrow("default"
+    /* Default */
+    )));
   };
 
   Swiper$1.SwiperItem = SwiperItem;