@univerjs/design 0.2.6 → 0.2.8

package/lib/es/index.js

@@ -650,7 +650,7 @@ const checkbox = "univer-checkbox", checkboxTargetInput = "univer-checkbox-targe
   checkboxTarget
 };
 function Checkbox(props) {
-  const { children, className, style: style2, checked = !1, indeterminate = !1, value, disabled = !1, onChange } = props, inputRef = useRef(null);
+  const { children, className, style: style2, checked = !1, indeterminate = !1, value, disabled = !1, onChange, contentClassName } = props, inputRef = useRef(null);
   function handleChange(e2) {
     var _a3, _b;
     if (e2.stopPropagation(), !(!onChange || disabled))
@@ -676,7 +676,7 @@ function Checkbox(props) {
       disabled,
       onChange: handleChange
     }
-  ), /* @__PURE__ */ React__default.createElement("span", { className: styles$q.checkboxTargetInner })), /* @__PURE__ */ React__default.createElement("span", null, children));
+  ), /* @__PURE__ */ React__default.createElement("span", { className: styles$q.checkboxTargetInner })), /* @__PURE__ */ React__default.createElement("span", { className: contentClassName }, children));
 }
 __name(Checkbox, "Checkbox");
 const checkboxGroup = "univer-checkbox-group", checkboxGroupDirectionVertical = "univer-checkbox-group-direction-vertical", styles$p = {
@@ -698,55 +698,55 @@ function CheckboxGroup(props) {
   }) : child));
 }
 __name(CheckboxGroup, "CheckboxGroup");
-function _extends$5() {
-  return _extends$5 = Object.assign ? Object.assign.bind() : function(n2) {
+function _extends$6() {
+  return _extends$6 = Object.assign ? Object.assign.bind() : function(n2) {
     for (var e2 = 1; e2 < arguments.length; e2++) {
       var t2 = arguments[e2];
       for (var r in t2) ({}).hasOwnProperty.call(t2, r) && (n2[r] = t2[r]);
     }
     return n2;
-  }, _extends$5.apply(null, arguments);
+  }, _extends$6.apply(null, arguments);
 }
-__name(_extends$5, "_extends$5");
-function _typeof$2(o) {
+__name(_extends$6, "_extends$6");
+function _typeof$3(o) {
   "@babel/helpers - typeof";
-  return _typeof$2 = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(o2) {
+  return _typeof$3 = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(o2) {
     return typeof o2;
   } : function(o2) {
     return o2 && typeof Symbol == "function" && o2.constructor === Symbol && o2 !== Symbol.prototype ? "symbol" : typeof o2;
-  }, _typeof$2(o);
+  }, _typeof$3(o);
 }
-__name(_typeof$2, "_typeof$2");
-function toPrimitive$1(t2, r) {
-  if (_typeof$2(t2) != "object" || !t2) return t2;
+__name(_typeof$3, "_typeof$3");
+function toPrimitive$2(t2, r) {
+  if (_typeof$3(t2) != "object" || !t2) return t2;
   var e2 = t2[Symbol.toPrimitive];
   if (e2 !== void 0) {
     var i = e2.call(t2, r || "default");
-    if (_typeof$2(i) != "object") return i;
+    if (_typeof$3(i) != "object") return i;
     throw new TypeError("@@toPrimitive must return a primitive value.");
   }
   return (r === "string" ? String : Number)(t2);
 }
-__name(toPrimitive$1, "toPrimitive$1");
-function toPropertyKey$1(t2) {
-  var i = toPrimitive$1(t2, "string");
-  return _typeof$2(i) == "symbol" ? i : i + "";
+__name(toPrimitive$2, "toPrimitive$2");
+function toPropertyKey$2(t2) {
+  var i = toPrimitive$2(t2, "string");
+  return _typeof$3(i) == "symbol" ? i : i + "";
 }
-__name(toPropertyKey$1, "toPropertyKey$1");
-function _defineProperty$b(e2, r, t2) {
-  return (r = toPropertyKey$1(r)) in e2 ? Object.defineProperty(e2, r, {
+__name(toPropertyKey$2, "toPropertyKey$2");
+function _defineProperty$c(e2, r, t2) {
+  return (r = toPropertyKey$2(r)) in e2 ? Object.defineProperty(e2, r, {
     value: t2,
     enumerable: !0,
     configurable: !0,
     writable: !0
   }) : e2[r] = t2, e2;
 }
-__name(_defineProperty$b, "_defineProperty$b");
-function _arrayWithHoles$1(r) {
+__name(_defineProperty$c, "_defineProperty$c");
+function _arrayWithHoles$2(r) {
   if (Array.isArray(r)) return r;
 }
-__name(_arrayWithHoles$1, "_arrayWithHoles$1");
-function _iterableToArrayLimit$1(r, l2) {
+__name(_arrayWithHoles$2, "_arrayWithHoles$2");
+function _iterableToArrayLimit$2(r, l2) {
   var t2 = r == null ? null : typeof Symbol < "u" && r[Symbol.iterator] || r["@@iterator"];
   if (t2 != null) {
     var e2, n2, i, u2, a = [], f2 = !0, o = !1;
@@ -767,31 +767,31 @@ function _iterableToArrayLimit$1(r, l2) {
     return a;
   }
 }
-__name(_iterableToArrayLimit$1, "_iterableToArrayLimit$1");
-function _arrayLikeToArray(r, a) {
+__name(_iterableToArrayLimit$2, "_iterableToArrayLimit$2");
+function _arrayLikeToArray$1(r, a) {
   (a == null || a > r.length) && (a = r.length);
   for (var e2 = 0, n2 = Array(a); e2 < a; e2++) n2[e2] = r[e2];
   return n2;
 }
-__name(_arrayLikeToArray, "_arrayLikeToArray");
-function _unsupportedIterableToArray(r, a) {
+__name(_arrayLikeToArray$1, "_arrayLikeToArray$1");
+function _unsupportedIterableToArray$1(r, a) {
   if (r) {
-    if (typeof r == "string") return _arrayLikeToArray(r, a);
+    if (typeof r == "string") return _arrayLikeToArray$1(r, a);
     var t2 = {}.toString.call(r).slice(8, -1);
-    return t2 === "Object" && r.constructor && (t2 = r.constructor.name), t2 === "Map" || t2 === "Set" ? Array.from(r) : t2 === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t2) ? _arrayLikeToArray(r, a) : void 0;
+    return t2 === "Object" && r.constructor && (t2 = r.constructor.name), t2 === "Map" || t2 === "Set" ? Array.from(r) : t2 === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t2) ? _arrayLikeToArray$1(r, a) : void 0;
   }
 }
-__name(_unsupportedIterableToArray, "_unsupportedIterableToArray");
-function _nonIterableRest$1() {
+__name(_unsupportedIterableToArray$1, "_unsupportedIterableToArray$1");
+function _nonIterableRest$2() {
   throw new TypeError(`Invalid attempt to destructure non-iterable instance.
 In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
 }
-__name(_nonIterableRest$1, "_nonIterableRest$1");
-function _slicedToArray$1(r, e2) {
-  return _arrayWithHoles$1(r) || _iterableToArrayLimit$1(r, e2) || _unsupportedIterableToArray(r, e2) || _nonIterableRest$1();
+__name(_nonIterableRest$2, "_nonIterableRest$2");
+function _slicedToArray$2(r, e2) {
+  return _arrayWithHoles$2(r) || _iterableToArrayLimit$2(r, e2) || _unsupportedIterableToArray$1(r, e2) || _nonIterableRest$2();
 }
-__name(_slicedToArray$1, "_slicedToArray$1");
-function ownKeys$8(e2, r) {
+__name(_slicedToArray$2, "_slicedToArray$2");
+function ownKeys$9(e2, r) {
   var t2 = Object.keys(e2);
   if (Object.getOwnPropertySymbols) {
     var o = Object.getOwnPropertySymbols(e2);
@@ -801,43 +801,43 @@ function ownKeys$8(e2, r) {
   }
   return t2;
 }
-__name(ownKeys$8, "ownKeys$8");
-function _objectSpread2$1(e2) {
+__name(ownKeys$9, "ownKeys$9");
+function _objectSpread2$2(e2) {
   for (var r = 1; r < arguments.length; r++) {
     var t2 = arguments[r] != null ? arguments[r] : {};
-    r % 2 ? ownKeys$8(Object(t2), !0).forEach(function(r2) {
-      _defineProperty$b(e2, r2, t2[r2]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e2, Object.getOwnPropertyDescriptors(t2)) : ownKeys$8(Object(t2)).forEach(function(r2) {
+    r % 2 ? ownKeys$9(Object(t2), !0).forEach(function(r2) {
+      _defineProperty$c(e2, r2, t2[r2]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e2, Object.getOwnPropertyDescriptors(t2)) : ownKeys$9(Object(t2)).forEach(function(r2) {
       Object.defineProperty(e2, r2, Object.getOwnPropertyDescriptor(t2, r2));
     });
   }
   return e2;
 }
-__name(_objectSpread2$1, "_objectSpread2$1");
-function _classCallCheck$1(a, n2) {
+__name(_objectSpread2$2, "_objectSpread2$2");
+function _classCallCheck$2(a, n2) {
   if (!(a instanceof n2)) throw new TypeError("Cannot call a class as a function");
 }
-__name(_classCallCheck$1, "_classCallCheck$1");
-function _defineProperties$1(e2, r) {
+__name(_classCallCheck$2, "_classCallCheck$2");
+function _defineProperties$2(e2, r) {
   for (var t2 = 0; t2 < r.length; t2++) {
     var o = r[t2];
-    o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e2, toPropertyKey$1(o.key), o);
+    o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e2, toPropertyKey$2(o.key), o);
   }
 }
-__name(_defineProperties$1, "_defineProperties$1");
-function _createClass$1(e2, r, t2) {
-  return r && _defineProperties$1(e2.prototype, r), t2 && _defineProperties$1(e2, t2), Object.defineProperty(e2, "prototype", {
+__name(_defineProperties$2, "_defineProperties$2");
+function _createClass$2(e2, r, t2) {
+  return r && _defineProperties$2(e2.prototype, r), Object.defineProperty(e2, "prototype", {
     writable: !1
   }), e2;
 }
-__name(_createClass$1, "_createClass$1");
-function _setPrototypeOf$3(t2, e2) {
-  return _setPrototypeOf$3 = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(t3, e3) {
+__name(_createClass$2, "_createClass$2");
+function _setPrototypeOf$4(t2, e2) {
+  return _setPrototypeOf$4 = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(t3, e3) {
     return t3.__proto__ = e3, t3;
-  }, _setPrototypeOf$3(t2, e2);
+  }, _setPrototypeOf$4(t2, e2);
 }
-__name(_setPrototypeOf$3, "_setPrototypeOf$3");
-function _inherits$1(t2, e2) {
+__name(_setPrototypeOf$4, "_setPrototypeOf$4");
+function _inherits$2(t2, e2) {
   if (typeof e2 != "function" && e2 !== null) throw new TypeError("Super expression must either be null or a function");
   t2.prototype = Object.create(e2 && e2.prototype, {
     constructor: {
@@ -847,69 +847,70 @@ function _inherits$1(t2, e2) {
     }
   }), Object.defineProperty(t2, "prototype", {
     writable: !1
-  }), e2 && _setPrototypeOf$3(t2, e2);
+  }), e2 && _setPrototypeOf$4(t2, e2);
 }
-__name(_inherits$1, "_inherits$1");
-function _getPrototypeOf$1(t2) {
-  return _getPrototypeOf$1 = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function(t3) {
+__name(_inherits$2, "_inherits$2");
+function _getPrototypeOf$2(t2) {
+  return _getPrototypeOf$2 = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function(t3) {
     return t3.__proto__ || Object.getPrototypeOf(t3);
-  }, _getPrototypeOf$1(t2);
+  }, _getPrototypeOf$2(t2);
 }
-__name(_getPrototypeOf$1, "_getPrototypeOf$1");
-function _isNativeReflectConstruct$1() {
+__name(_getPrototypeOf$2, "_getPrototypeOf$2");
+function _isNativeReflectConstruct$2() {
   try {
     var t2 = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {
     }));
   } catch {
   }
-  return (_isNativeReflectConstruct$1 = /* @__PURE__ */ __name(function() {
+  return (_isNativeReflectConstruct$2 = /* @__PURE__ */ __name(function() {
     return !!t2;
   }, "_isNativeReflectConstruct"))();
 }
-__name(_isNativeReflectConstruct$1, "_isNativeReflectConstruct$1");
-function _assertThisInitialized$1(e2) {
+__name(_isNativeReflectConstruct$2, "_isNativeReflectConstruct$2");
+function _assertThisInitialized$2(e2) {
   if (e2 === void 0) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
   return e2;
 }
-__name(_assertThisInitialized$1, "_assertThisInitialized$1");
-function _possibleConstructorReturn$1(t2, e2) {
-  if (e2 && (_typeof$2(e2) == "object" || typeof e2 == "function")) return e2;
+__name(_assertThisInitialized$2, "_assertThisInitialized$2");
+function _possibleConstructorReturn$2(t2, e2) {
+  if (e2 && (_typeof$3(e2) == "object" || typeof e2 == "function")) return e2;
   if (e2 !== void 0) throw new TypeError("Derived constructors may only return object or undefined");
-  return _assertThisInitialized$1(t2);
+  return _assertThisInitialized$2(t2);
 }
-__name(_possibleConstructorReturn$1, "_possibleConstructorReturn$1");
-function _createSuper$1(t2) {
-  var r = _isNativeReflectConstruct$1();
+__name(_possibleConstructorReturn$2, "_possibleConstructorReturn$2");
+function _createSuper$2(t2) {
+  var r = _isNativeReflectConstruct$2();
   return function() {
-    var e2, o = _getPrototypeOf$1(t2);
+    var e2, o = _getPrototypeOf$2(t2);
     if (r) {
-      var s = _getPrototypeOf$1(this).constructor;
+      var s = _getPrototypeOf$2(this).constructor;
       e2 = Reflect.construct(o, arguments, s);
     } else e2 = o.apply(this, arguments);
-    return _possibleConstructorReturn$1(this, e2);
+    return _possibleConstructorReturn$2(this, e2);
   };
 }
-__name(_createSuper$1, "_createSuper$1");
-function _objectWithoutPropertiesLoose$3(r, e2) {
+__name(_createSuper$2, "_createSuper$2");
+function _objectWithoutPropertiesLoose$4(r, e2) {
   if (r == null) return {};
   var t2 = {};
   for (var n2 in r) if ({}.hasOwnProperty.call(r, n2)) {
-    if (e2.indexOf(n2) >= 0) continue;
+    if (e2.includes(n2)) continue;
     t2[n2] = r[n2];
   }
   return t2;
 }
-__name(_objectWithoutPropertiesLoose$3, "_objectWithoutPropertiesLoose$3");
-function _objectWithoutProperties$1(e2, t2) {
+__name(_objectWithoutPropertiesLoose$4, "_objectWithoutPropertiesLoose$4");
+function _objectWithoutProperties$2(e2, t2) {
   if (e2 == null) return {};
-  var o, r, i = _objectWithoutPropertiesLoose$3(e2, t2);
+  var o, r, i = _objectWithoutPropertiesLoose$4(e2, t2);
   if (Object.getOwnPropertySymbols) {
-    var n2 = Object.getOwnPropertySymbols(e2);
-    for (r = 0; r < n2.length; r++) o = n2[r], t2.indexOf(o) >= 0 || {}.propertyIsEnumerable.call(e2, o) && (i[o] = e2[o]);
+    var s = Object.getOwnPropertySymbols(e2);
+    for (r = 0; r < s.length; r++) o = s[r], t2.includes(o) || {}.propertyIsEnumerable.call(e2, o) && (i[o] = e2[o]);
   }
   return i;
 }
-__name(_objectWithoutProperties$1, "_objectWithoutProperties$1");
+__name(_objectWithoutProperties$2, "_objectWithoutProperties$2");
+const round = Math.round;
 function splitColorStr(str, parseNum) {
   const match2 = str.replace(/^[^(]*\((.*)/, "$1").replace(/\).*/, "").match(/\d*\.?\d+%?/g) || [], numList = match2.map((item) => parseFloat(item));
   for (let i = 0; i < 3; i += 1)
@@ -917,67 +918,100 @@ function splitColorStr(str, parseNum) {
   return match2[3] ? numList[3] = match2[3].includes("%") ? numList[3] / 100 : numList[3] : numList[3] = 1, numList;
 }
 __name(splitColorStr, "splitColorStr");
-function inRange(val, max = 255, min = 0) {
-  return typeof val == "number" && val >= min && val <= max;
+const parseHSVorHSL = /* @__PURE__ */ __name((num, _, index2) => index2 === 0 ? num : num / 100, "parseHSVorHSL");
+function limitRange(value, max) {
+  const mergedMax = max || 255;
+  return value > mergedMax ? mergedMax : value < 0 ? 0 : value;
 }
-__name(inRange, "inRange");
-const parseHSVorHSL = /* @__PURE__ */ __name((num, _, index2) => index2 === 0 ? num : num / 100, "parseHSVorHSL"), _FastColor = class _FastColor {
+__name(limitRange, "limitRange");
+const _FastColor = class _FastColor {
   constructor(input2) {
-    if (_defineProperty$b(this, "r", void 0), _defineProperty$b(this, "g", void 0), _defineProperty$b(this, "b", void 0), _defineProperty$b(this, "a", void 0), _defineProperty$b(this, "_h", void 0), _defineProperty$b(this, "_s", void 0), _defineProperty$b(this, "_l", void 0), _defineProperty$b(this, "_v", void 0), _defineProperty$b(this, "_max", void 0), _defineProperty$b(this, "_min", void 0), _defineProperty$b(this, "_brightness", void 0), !input2)
-      this.r = 0, this.g = 0, this.b = 0, this.a = 1;
-    else if (typeof input2 == "string") {
+    _defineProperty$c(this, "isValid", !0), _defineProperty$c(this, "r", 0), _defineProperty$c(this, "g", 0), _defineProperty$c(this, "b", 0), _defineProperty$c(this, "a", 1), _defineProperty$c(this, "_h", void 0), _defineProperty$c(this, "_s", void 0), _defineProperty$c(this, "_l", void 0), _defineProperty$c(this, "_v", void 0), _defineProperty$c(this, "_max", void 0), _defineProperty$c(this, "_min", void 0), _defineProperty$c(this, "_brightness", void 0);
+    function matchFormat(str) {
+      return str[0] in input2 && str[1] in input2 && str[2] in input2;
+    }
+    if (__name(matchFormat, "matchFormat"), input2) if (typeof input2 == "string") {
       let matchPrefix = function(prefix) {
         return trimStr.startsWith(prefix);
       };
       __name(matchPrefix, "matchPrefix");
       const trimStr = input2.trim();
       /^#?[A-F\d]{3,8}$/i.test(trimStr) ? this.fromHexString(trimStr) : matchPrefix("rgb") ? this.fromRgbString(trimStr) : matchPrefix("hsl") ? this.fromHslString(trimStr) : (matchPrefix("hsv") || matchPrefix("hsb")) && this.fromHsvString(trimStr);
-    } else if ("r" in input2 && "g" in input2 && "b" in input2)
-      this.r = input2.r, this.g = input2.g, this.b = input2.b, this.a = typeof input2.a == "number" ? input2.a : 1;
-    else if ("l" in input2 && "h" in input2 && "s" in input2)
+    } else if (input2 instanceof _FastColor)
+      this.r = input2.r, this.g = input2.g, this.b = input2.b, this.a = input2.a, this._h = input2._h, this._s = input2._s, this._l = input2._l, this._v = input2._v;
+    else if (matchFormat("rgb"))
+      this.r = limitRange(input2.r), this.g = limitRange(input2.g), this.b = limitRange(input2.b), this.a = typeof input2.a == "number" ? limitRange(input2.a, 1) : 1;
+    else if (matchFormat("hsl"))
       this.fromHsl(input2);
-    else if ("v" in input2 && "h" in input2 && "s" in input2)
+    else if (matchFormat("hsv"))
       this.fromHsv(input2);
     else
       throw new Error("@ant-design/fast-color: unsupported input " + JSON.stringify(input2));
   }
-  /**
-   * Hue, H in HSL/HSV
-   */
-  get h() {
-    return this.getHue();
+  // ======================= Setter =======================
+  setR(value) {
+    return this._sc("r", value);
   }
-  /**
-   * Saturation, S in HSL/HSV
-   */
-  get s() {
-    return this.getSaturation();
+  setG(value) {
+    return this._sc("g", value);
   }
-  /**
-   * Lightness, L in HSL
-   */
-  get l() {
-    return this.getLightness();
+  setB(value) {
+    return this._sc("b", value);
   }
+  setA(value) {
+    return this._sc("a", value, 1);
+  }
+  setHue(value) {
+    const hsv = this.toHsv();
+    return hsv.h = value, this._c(hsv);
+  }
+  // ======================= Getter =======================
   /**
-   * Value, V in HSV
+   * Returns the perceived luminance of a color, from 0-1.
+   * @see http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef
    */
-  get v() {
-    return this.getValue();
+  getLuminance() {
+    function adjustGamma(raw) {
+      const val = raw / 255;
+      return val <= 0.03928 ? val / 12.92 : Math.pow((val + 0.055) / 1.055, 2.4);
+    }
+    __name(adjustGamma, "adjustGamma");
+    const R = adjustGamma(this.r), G = adjustGamma(this.g), B = adjustGamma(this.b);
+    return 0.2126 * R + 0.7152 * G + 0.0722 * B;
   }
-  get isValid() {
-    return inRange(this.r) && inRange(this.g) && inRange(this.b) && inRange(this.a, 1);
+  getHue() {
+    if (typeof this._h > "u") {
+      const delta = this.getMax() - this.getMin();
+      delta === 0 ? this._h = 0 : this._h = round(60 * (this.r === this.getMax() ? (this.g - this.b) / delta + (this.g < this.b ? 6 : 0) : this.g === this.getMax() ? (this.b - this.r) / delta + 2 : (this.r - this.g) / delta + 4));
+    }
+    return this._h;
   }
-  clone() {
-    return new _FastColor(this);
+  getSaturation() {
+    if (typeof this._s > "u") {
+      const delta = this.getMax() - this.getMin();
+      delta === 0 ? this._s = 0 : this._s = delta / this.getMax();
+    }
+    return this._s;
   }
-  equals(other) {
-    return this.r === other.r && this.g === other.g && this.b === other.b && this.a === other.a;
+  getLightness() {
+    return typeof this._l > "u" && (this._l = (this.getMax() + this.getMin()) / 510), this._l;
+  }
+  getValue() {
+    return typeof this._v > "u" && (this._v = this.getMax() / 255), this._v;
   }
+  /**
+   * Returns the perceived brightness of the color, from 0-255.
+   * Note: this is not the b of HSB
+   * @see http://www.w3.org/TR/AERT#color-contrast
+   */
+  getBrightness() {
+    return typeof this._brightness > "u" && (this._brightness = (this.r * 299 + this.g * 587 + this.b * 114) / 1e3), this._brightness;
+  }
+  // ======================== Func ========================
   darken(amount = 10) {
     const h2 = this.getHue(), s = this.getSaturation();
     let l2 = this.getLightness() - amount / 100;
-    return l2 < 0 && (l2 = 0), new _FastColor({
+    return l2 < 0 && (l2 = 0), this._c({
       h: h2,
       s,
       l: l2,
@@ -987,13 +1021,26 @@ const parseHSVorHSL = /* @__PURE__ */ __name((num, _, index2) => index2 === 0 ?
   lighten(amount = 10) {
     const h2 = this.getHue(), s = this.getSaturation();
     let l2 = this.getLightness() + amount / 100;
-    return l2 > 1 && (l2 = 1), new _FastColor({
+    return l2 > 1 && (l2 = 1), this._c({
       h: h2,
       s,
       l: l2,
       a: this.a
     });
   }
+  /**
+   * Mix the current color a given amount with another color, from 0 to 100.
+   * 0 means no mixing (return current color).
+   */
+  mix(input2, amount = 50) {
+    const color = this._c(input2), p2 = amount / 100, calc = /* @__PURE__ */ __name((key) => (color[key] - this[key]) * p2 + this[key], "calc"), rgba = {
+      r: round(calc("r")),
+      g: round(calc("g")),
+      b: round(calc("b")),
+      a: round(calc("a") * 100) / 100
+    };
+    return this._c(rgba);
+  }
   /**
    * Mix the color with pure white, from 0 to 100.
    * Providing 0 will do nothing, providing 100 will always return white.
@@ -1018,76 +1065,30 @@ const parseHSVorHSL = /* @__PURE__ */ __name((num, _, index2) => index2 === 0 ?
       a: 1
     }, amount);
   }
-  /**
-   * Mix the current color a given amount with another color, from 0 to 100.
-   * 0 means no mixing (return current color).
-   */
-  mix(color, amount = 50) {
-    const rgb1 = this.toRgb(), rgb2 = new _FastColor(color).toRgb(), p2 = amount / 100, rgba = {
-      r: (rgb2.r - rgb1.r) * p2 + rgb1.r,
-      g: (rgb2.g - rgb1.g) * p2 + rgb1.g,
-      b: (rgb2.b - rgb1.b) * p2 + rgb1.b,
-      a: (rgb2.a - rgb1.a) * p2 + rgb1.a
-    };
-    return new _FastColor(rgba);
-  }
-  getAlpha() {
-    return this.a;
-  }
-  /**
-   * Returns the perceived luminance of a color, from 0-1.
-   * @see http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef
-   */
-  getLuminance() {
-    let R, G, B;
-    const RsRGB = this.r / 255, GsRGB = this.g / 255, BsRGB = this.b / 255;
-    return RsRGB <= 0.03928 ? R = RsRGB / 12.92 : R = Math.pow((RsRGB + 0.055) / 1.055, 2.4), GsRGB <= 0.03928 ? G = GsRGB / 12.92 : G = Math.pow((GsRGB + 0.055) / 1.055, 2.4), BsRGB <= 0.03928 ? B = BsRGB / 12.92 : B = Math.pow((BsRGB + 0.055) / 1.055, 2.4), 0.2126 * R + 0.7152 * G + 0.0722 * B;
-  }
-  getHue() {
-    if (typeof this._h > "u") {
-      const delta = this.max - this.min;
-      delta === 0 ? this._h = 0 : this._h = Math.round(60 * (this.r === this.max ? (this.g - this.b) / delta + (this.g < this.b ? 6 : 0) : this.g === this.max ? (this.b - this.r) / delta + 2 : (this.r - this.g) / delta + 4));
-    }
-    return this._h;
-  }
-  getSaturation() {
-    if (typeof this._s > "u") {
-      const delta = this.max - this.min;
-      delta === 0 ? this._s = 0 : this._s = delta / this.max;
-    }
-    return this._s;
-  }
-  getLightness() {
-    return typeof this._l > "u" && (this._l = (this.max + this.min) / 510), this._l;
-  }
-  getValue() {
-    return typeof this._v > "u" && (this._v = this.max / 255), this._v;
+  onBackground(background) {
+    const bg = this._c(background), alpha = this.a + bg.a * (1 - this.a), calc = /* @__PURE__ */ __name((key) => round((this[key] * this.a + bg[key] * bg.a * (1 - this.a)) / alpha), "calc");
+    return this._c({
+      r: calc("r"),
+      g: calc("g"),
+      b: calc("b"),
+      a: alpha
+    });
   }
+  // ======================= Status =======================
   isDark() {
     return this.getBrightness() < 128;
   }
   isLight() {
     return this.getBrightness() >= 128;
   }
-  /**
-   * Returns the perceived brightness of the color, from 0-255.
-   * @see http://www.w3.org/TR/AERT#color-contrast
-   */
-  getBrightness() {
-    return typeof this._brightness > "u" && (this._brightness = (this.r * 299 + this.g * 587 + this.b * 114) / 1e3), this._brightness;
-  }
-  onBackground(background) {
-    const bg = new _FastColor(background), alpha = this.a + bg.a * (1 - this.a);
-    return new _FastColor({
-      r: Math.round((this.r * this.a + bg.r * bg.a * (1 - this.a)) / alpha),
-      g: Math.round((this.g * this.a + bg.g * bg.a * (1 - this.a)) / alpha),
-      b: Math.round((this.b * this.a + bg.b * bg.a * (1 - this.a)) / alpha),
-      a: alpha
-    });
+  // ======================== MISC ========================
+  equals(other) {
+    return this.r === other.r && this.g === other.g && this.b === other.b && this.a === other.a;
   }
-  setAlpha(alpha) {
-    return this.a = alpha, this;
+  clone() {
+    return this._c(this);
   }
+  // ======================= Format =======================
   toHexString() {
     let hex = "#";
     const rHex = (this.r || 0).toString(16);
@@ -1096,28 +1097,31 @@ const parseHSVorHSL = /* @__PURE__ */ __name((num, _, index2) => index2 === 0 ?
     hex += gHex.length === 2 ? gHex : "0" + gHex;
     const bHex = (this.b || 0).toString(16);
     if (hex += bHex.length === 2 ? bHex : "0" + bHex, typeof this.a == "number" && this.a >= 0 && this.a < 1) {
-      const aHex = Math.round(this.a * 255).toString(16);
+      const aHex = round(this.a * 255).toString(16);
       hex += aHex.length === 2 ? aHex : "0" + aHex;
     }
     return hex;
   }
+  /** CSS support color pattern */
   toHsl() {
     return {
-      h: this.h,
-      s: this.s,
-      l: this.l,
+      h: this.getHue(),
+      s: this.getSaturation(),
+      l: this.getLightness(),
       a: this.a
     };
   }
+  /** CSS support color pattern */
   toHslString() {
-    const h2 = this.h, s = Math.round(this.s * 100), l2 = Math.round(this.l * 100);
+    const h2 = this.getHue(), s = round(this.getSaturation() * 100), l2 = round(this.getLightness() * 100);
     return this.a !== 1 ? `hsla(${h2},${s}%,${l2}%,${this.a})` : `hsl(${h2},${s}%,${l2}%)`;
   }
+  /** Same as toHsb */
   toHsv() {
     return {
-      h: this.h,
-      s: this.s,
-      v: this.v,
+      h: this.getHue(),
+      s: this.getSaturation(),
+      v: this.getValue(),
       a: this.a
     };
   }
@@ -1135,10 +1139,19 @@ const parseHSVorHSL = /* @__PURE__ */ __name((num, _, index2) => index2 === 0 ?
   toString() {
     return this.toRgbString();
   }
-  get max() {
+  // ====================== Privates ======================
+  /** Return a new FastColor object with one channel changed */
+  _sc(rgb, value, max) {
+    const clone = this.clone();
+    return clone[rgb] = limitRange(value, max), clone;
+  }
+  _c(input2) {
+    return new this.constructor(input2);
+  }
+  getMax() {
     return typeof this._max > "u" && (this._max = Math.max(this.r, this.g, this.b)), this._max;
   }
-  get min() {
+  getMin() {
     return typeof this._min > "u" && (this._min = Math.min(this.r, this.g, this.b)), this._min;
   }
   fromHexString(trimStr) {
@@ -1155,13 +1168,14 @@ const parseHSVorHSL = /* @__PURE__ */ __name((num, _, index2) => index2 === 0 ?
     a
   }) {
     if (this._h = h2 % 360, this._s = s, this._l = l2, this.a = typeof a == "number" ? a : 1, s <= 0) {
-      const rgb = Math.round(l2 * 255);
+      const rgb = round(l2 * 255);
       this.r = rgb, this.g = rgb, this.b = rgb;
     }
+    let r = 0, g2 = 0, b2 = 0;
     const huePrime = h2 / 60, chroma = (1 - Math.abs(2 * l2 - 1)) * s, secondComponent = chroma * (1 - Math.abs(huePrime % 2 - 1));
-    this.r = 0, this.g = 0, this.b = 0, huePrime >= 0 && huePrime < 1 ? (this.r = chroma, this.g = secondComponent) : huePrime >= 1 && huePrime < 2 ? (this.r = secondComponent, this.g = chroma) : huePrime >= 2 && huePrime < 3 ? (this.g = chroma, this.b = secondComponent) : huePrime >= 3 && huePrime < 4 ? (this.g = secondComponent, this.b = chroma) : huePrime >= 4 && huePrime < 5 ? (this.r = secondComponent, this.b = chroma) : huePrime >= 5 && huePrime < 6 && (this.r = chroma, this.b = secondComponent);
+    huePrime >= 0 && huePrime < 1 ? (r = chroma, g2 = secondComponent) : huePrime >= 1 && huePrime < 2 ? (r = secondComponent, g2 = chroma) : huePrime >= 2 && huePrime < 3 ? (g2 = chroma, b2 = secondComponent) : huePrime >= 3 && huePrime < 4 ? (g2 = secondComponent, b2 = chroma) : huePrime >= 4 && huePrime < 5 ? (r = secondComponent, b2 = chroma) : huePrime >= 5 && huePrime < 6 && (r = chroma, b2 = secondComponent);
     const lightnessModification = l2 - chroma / 2;
-    this.r = Math.round((this.r + lightnessModification) * 255), this.g = Math.round((this.g + lightnessModification) * 255), this.b = Math.round((this.b + lightnessModification) * 255);
+    this.r = round((r + lightnessModification) * 255), this.g = round((g2 + lightnessModification) * 255), this.b = round((b2 + lightnessModification) * 255);
   }
   fromHsv({
     h: h2,
@@ -1170,10 +1184,10 @@ const parseHSVorHSL = /* @__PURE__ */ __name((num, _, index2) => index2 === 0 ?
     a
   }) {
     this._h = h2 % 360, this._s = s, this._v = v2, this.a = typeof a == "number" ? a : 1;
-    const vv = Math.round(v2 * 255);
+    const vv = round(v2 * 255);
     if (this.r = vv, this.g = vv, this.b = vv, s <= 0)
       return;
-    const hh = h2 / 60, i = Math.floor(hh), ff = hh - i, p2 = Math.round(v2 * (1 - s) * 255), q2 = Math.round(v2 * (1 - s * ff) * 255), t2 = Math.round(v2 * (1 - s * (1 - ff)) * 255);
+    const hh = h2 / 60, i = Math.floor(hh), ff = hh - i, p2 = round(v2 * (1 - s) * 255), q2 = round(v2 * (1 - s * ff) * 255), t2 = round(v2 * (1 - s * (1 - ff)) * 255);
     switch (i) {
       case 0:
         this.g = t2, this.b = p2;
@@ -1196,8 +1210,8 @@ const parseHSVorHSL = /* @__PURE__ */ __name((num, _, index2) => index2 === 0 ?
         break;
     }
   }
-  fromHsvString(trimed) {
-    const cells = splitColorStr(trimed, parseHSVorHSL);
+  fromHsvString(trimStr) {
+    const cells = splitColorStr(trimStr, parseHSVorHSL);
     this.fromHsv({
       h: cells[0],
       s: cells[1],
@@ -1205,8 +1219,8 @@ const parseHSVorHSL = /* @__PURE__ */ __name((num, _, index2) => index2 === 0 ?
       a: cells[3]
     });
   }
-  fromHslString(trimed) {
-    const cells = splitColorStr(trimed, parseHSVorHSL);
+  fromHslString(trimStr) {
+    const cells = splitColorStr(trimStr, parseHSVorHSL);
     this.fromHsl({
       h: cells[0],
       s: cells[1],
@@ -1214,10 +1228,10 @@ const parseHSVorHSL = /* @__PURE__ */ __name((num, _, index2) => index2 === 0 ?
       a: cells[3]
     });
   }
-  fromRgbString(trimed) {
-    const cells = splitColorStr(trimed, (num, txt) => (
+  fromRgbString(trimStr) {
+    const cells = splitColorStr(trimStr, (num, txt) => (
       // Convert percentage to number. e.g. 50% -> 128
-      txt.includes("%") ? Math.round(num / 100 * 255) : num
+      txt.includes("%") ? round(num / 100 * 255) : num
     ));
     this.r = cells[0], this.g = cells[1], this.b = cells[2], this.a = cells[3];
   }
@@ -1229,20 +1243,20 @@ var _excluded$x = ["b"], _excluded2$7 = ["v"], getRoundNumber = /* @__PURE__ */
 }, "getRoundNumber"), convertHsb2Hsv = /* @__PURE__ */ __name(function(color) {
   if (color instanceof FastColor)
     return color;
-  if (color && _typeof$2(color) === "object" && "h" in color && "b" in color) {
-    var _ref = color, b2 = _ref.b, resets = _objectWithoutProperties$1(_ref, _excluded$x);
-    return _objectSpread2$1(_objectSpread2$1({}, resets), {}, {
+  if (color && _typeof$3(color) === "object" && "h" in color && "b" in color) {
+    var _ref = color, b2 = _ref.b, resets = _objectWithoutProperties$2(_ref, _excluded$x);
+    return _objectSpread2$2(_objectSpread2$2({}, resets), {}, {
       v: b2
     });
   }
   return typeof color == "string" && /hsb/.test(color) ? color.replace(/hsb/, "hsv") : color;
 }, "convertHsb2Hsv"), Color = /* @__PURE__ */ function(_FastColor2) {
-  _inherits$1(Color2, _FastColor2);
-  var _super = _createSuper$1(Color2);
+  _inherits$2(Color2, _FastColor2);
+  var _super = _createSuper$2(Color2);
   function Color2(color) {
-    return _classCallCheck$1(this, Color2), _super.call(this, convertHsb2Hsv(color));
+    return _classCallCheck$2(this, Color2), _super.call(this, convertHsb2Hsv(color));
   }
-  return __name(Color2, "Color"), _createClass$1(Color2, [{
+  return __name(Color2, "Color"), _createClass$2(Color2, [{
     key: "toHsbString",
     value: /* @__PURE__ */ __name(function() {
       var hsb = this.toHsb(), saturation = getRoundNumber(hsb.s * 100), lightness = getRoundNumber(hsb.b * 100), hue = getRoundNumber(hsb.h), alpha = hsb.a, hsbString = "hsb(".concat(hue, ", ").concat(saturation, "%, ").concat(lightness, "%)"), hsbaString = "hsba(".concat(hue, ", ").concat(saturation, "%, ").concat(lightness, "%, ").concat(alpha.toFixed(alpha === 0 ? 0 : 2), ")");
@@ -1251,8 +1265,8 @@ var _excluded$x = ["b"], _excluded2$7 = ["v"], getRoundNumber = /* @__PURE__ */
   }, {
     key: "toHsb",
     value: /* @__PURE__ */ __name(function() {
-      var _this$toHsv = this.toHsv(), v2 = _this$toHsv.v, resets = _objectWithoutProperties$1(_this$toHsv, _excluded2$7);
-      return _objectSpread2$1(_objectSpread2$1({}, resets), {}, {
+      var _this$toHsv = this.toHsv(), v2 = _this$toHsv.v, resets = _objectWithoutProperties$2(_this$toHsv, _excluded2$7);
+      return _objectSpread2$2(_objectSpread2$2({}, resets), {}, {
         b: v2,
         a: this.a
       });
@@ -1265,11 +1279,11 @@ var _excluded$x = ["b"], _excluded2$7 = ["v"], getRoundNumber = /* @__PURE__ */
   if (type2)
     switch (type2) {
       case "hue":
-        return generateColor(_objectSpread2$1(_objectSpread2$1({}, hsb), {}, {
+        return generateColor(_objectSpread2$2(_objectSpread2$2({}, hsb), {}, {
           h: hueOffset <= 0 ? 0 : hueOffset
         }));
       case "alpha":
-        return generateColor(_objectSpread2$1(_objectSpread2$1({}, hsb), {}, {
+        return generateColor(_objectSpread2$2(_objectSpread2$2({}, hsb), {}, {
           a: alphaOffset <= 0 ? 0 : alphaOffset
         }));
     }
@@ -1279,28 +1293,26 @@ var _excluded$x = ["b"], _excluded2$7 = ["v"], getRoundNumber = /* @__PURE__ */
     b: bright >= 1 ? 1 : bright,
     a: hsb.a
   });
-}, "calculateColor"), calculateOffset = /* @__PURE__ */ __name(function(containerRef, targetRef, color, type2) {
-  var _containerRef$current2 = containerRef.current.getBoundingClientRect(), width2 = _containerRef$current2.width, height2 = _containerRef$current2.height, _targetRef$current$ge2 = targetRef.current.getBoundingClientRect(), targetWidth = _targetRef$current$ge2.width, targetHeight = _targetRef$current$ge2.height, centerOffsetX = targetWidth / 2, centerOffsetY = targetHeight / 2, hsb = color.toHsb();
-  if (!(targetWidth === 0 && targetHeight === 0 || targetWidth !== targetHeight)) {
-    if (type2)
-      switch (type2) {
-        case "hue":
-          return {
-            x: hsb.h / 360 * width2 - centerOffsetX,
-            y: -centerOffsetY / 3
-          };
-        case "alpha":
-          return {
-            x: hsb.a / 1 * width2 - centerOffsetX,
-            y: -centerOffsetY / 3
-          };
-      }
-    return {
-      x: hsb.s * width2 - centerOffsetX,
-      y: (1 - hsb.b) * height2 - centerOffsetY
-    };
+}, "calculateColor"), calcOffset = /* @__PURE__ */ __name(function(color, type2) {
+  var hsb = color.toHsb();
+  switch (type2) {
+    case "hue":
+      return {
+        x: hsb.h / 360 * 100,
+        y: 50
+      };
+    case "alpha":
+      return {
+        x: color.a * 100,
+        y: 50
+      };
+    default:
+      return {
+        x: hsb.s * 100,
+        y: (1 - hsb.b) * 100
+      };
   }
-}, "calculateOffset"), classnames = { exports: {} };
+}, "calcOffset"), classnames = { exports: {} };
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
@@ -1362,36 +1374,31 @@ function getPosition(e2) {
 }
 __name(getPosition, "getPosition");
 function useColorDrag(props) {
-  var offset2 = props.offset, targetRef = props.targetRef, containerRef = props.containerRef, direction = props.direction, onDragChange = props.onDragChange, onDragChangeComplete = props.onDragChangeComplete, calculate = props.calculate, color = props.color, disabledDrag = props.disabledDrag, _useState = useState(offset2 || {
+  var targetRef = props.targetRef, containerRef = props.containerRef, direction = props.direction, onDragChange = props.onDragChange, onDragChangeComplete = props.onDragChangeComplete, calculate = props.calculate, color = props.color, disabledDrag = props.disabledDrag, _useState = useState({
     x: 0,
     y: 0
-  }), _useState2 = _slicedToArray$1(_useState, 2), offsetValue = _useState2[0], setOffsetValue = _useState2[1], mouseMoveRef = useRef(null), mouseUpRef = useRef(null), dragRef = useRef({
-    flag: !1
-  });
+  }), _useState2 = _slicedToArray$2(_useState, 2), offsetValue = _useState2[0], setOffsetValue = _useState2[1], mouseMoveRef = useRef(null), mouseUpRef = useRef(null);
   useEffect(function() {
-    if (dragRef.current.flag === !1) {
-      var calcOffset = calculate == null ? void 0 : calculate(containerRef);
-      calcOffset && setOffsetValue(calcOffset);
-    }
-  }, [color, containerRef]), useEffect(function() {
+    setOffsetValue(calculate());
+  }, [color]), useEffect(function() {
     return function() {
       document.removeEventListener("mousemove", mouseMoveRef.current), document.removeEventListener("mouseup", mouseUpRef.current), document.removeEventListener("touchmove", mouseMoveRef.current), document.removeEventListener("touchend", mouseUpRef.current), mouseMoveRef.current = null, mouseUpRef.current = null;
     };
   }, []);
   var updateOffset = /* @__PURE__ */ __name(function(e2) {
-    var _getPosition = getPosition(e2), pageX = _getPosition.pageX, pageY = _getPosition.pageY, _containerRef$current = containerRef.current.getBoundingClientRect(), rectX = _containerRef$current.x, rectY = _containerRef$current.y, width2 = _containerRef$current.width, height2 = _containerRef$current.height, _targetRef$current$ge = targetRef.current.getBoundingClientRect(), targetWidth = _targetRef$current$ge.width, targetHeight = _targetRef$current$ge.height, centerOffsetX = targetWidth / 2, centerOffsetY = targetHeight / 2, offsetX = Math.max(0, Math.min(pageX - rectX, width2)) - centerOffsetX, offsetY = Math.max(0, Math.min(pageY - rectY, height2)) - centerOffsetY, calcOffset = {
+    var _getPosition = getPosition(e2), pageX = _getPosition.pageX, pageY = _getPosition.pageY, _containerRef$current = containerRef.current.getBoundingClientRect(), rectX = _containerRef$current.x, rectY = _containerRef$current.y, width2 = _containerRef$current.width, height2 = _containerRef$current.height, _targetRef$current$ge = targetRef.current.getBoundingClientRect(), targetWidth = _targetRef$current$ge.width, targetHeight = _targetRef$current$ge.height, centerOffsetX = targetWidth / 2, centerOffsetY = targetHeight / 2, offsetX = Math.max(0, Math.min(pageX - rectX, width2)) - centerOffsetX, offsetY = Math.max(0, Math.min(pageY - rectY, height2)) - centerOffsetY, calcOffset3 = {
       x: offsetX,
       y: direction === "x" ? offsetValue.y : offsetY
     };
     if (targetWidth === 0 && targetHeight === 0 || targetWidth !== targetHeight)
       return !1;
-    setOffsetValue(calcOffset), onDragChange == null || onDragChange(calcOffset);
+    onDragChange == null || onDragChange(calcOffset3);
   }, "updateOffset"), onDragMove = /* @__PURE__ */ __name(function(e2) {
     e2.preventDefault(), updateOffset(e2);
   }, "onDragMove"), onDragStop = /* @__PURE__ */ __name(function(e2) {
-    e2.preventDefault(), dragRef.current.flag = !1, document.removeEventListener("mousemove", mouseMoveRef.current), document.removeEventListener("mouseup", mouseUpRef.current), document.removeEventListener("touchmove", mouseMoveRef.current), document.removeEventListener("touchend", mouseUpRef.current), mouseMoveRef.current = null, mouseUpRef.current = null, onDragChangeComplete == null || onDragChangeComplete();
+    e2.preventDefault(), document.removeEventListener("mousemove", mouseMoveRef.current), document.removeEventListener("mouseup", mouseUpRef.current), document.removeEventListener("touchmove", mouseMoveRef.current), document.removeEventListener("touchend", mouseUpRef.current), mouseMoveRef.current = null, mouseUpRef.current = null, onDragChangeComplete == null || onDragChangeComplete();
   }, "onDragStop"), onDragStart = /* @__PURE__ */ __name(function(e2) {
-    document.removeEventListener("mousemove", mouseMoveRef.current), document.removeEventListener("mouseup", mouseUpRef.current), !disabledDrag && (updateOffset(e2), dragRef.current.flag = !0, document.addEventListener("mousemove", onDragMove), document.addEventListener("mouseup", onDragStop), document.addEventListener("touchmove", onDragMove), document.addEventListener("touchend", onDragStop), mouseMoveRef.current = onDragMove, mouseUpRef.current = onDragStop);
+    document.removeEventListener("mousemove", mouseMoveRef.current), document.removeEventListener("mouseup", mouseUpRef.current), !disabledDrag && (updateOffset(e2), document.addEventListener("mousemove", onDragMove), document.addEventListener("mouseup", onDragStop), document.addEventListener("touchmove", onDragMove), document.addEventListener("touchend", onDragStop), mouseMoveRef.current = onDragMove, mouseUpRef.current = onDragStop);
   }, "onDragStart");
   return [offsetValue, onDragStart];
 }
@@ -1407,6 +1414,55 @@ function useEvent(callback) {
   return memoFn;
 }
 __name(useEvent, "useEvent");
+function _arrayWithHoles$1(r) {
+  if (Array.isArray(r)) return r;
+}
+__name(_arrayWithHoles$1, "_arrayWithHoles$1");
+function _iterableToArrayLimit$1(r, l2) {
+  var t2 = r == null ? null : typeof Symbol < "u" && r[Symbol.iterator] || r["@@iterator"];
+  if (t2 != null) {
+    var e2, n2, i, u2, a = [], f2 = !0, o = !1;
+    try {
+      if (i = (t2 = t2.call(r)).next, l2 === 0) {
+        if (Object(t2) !== t2) return;
+        f2 = !1;
+      } else for (; !(f2 = (e2 = i.call(t2)).done) && (a.push(e2.value), a.length !== l2); f2 = !0) ;
+    } catch (r2) {
+      o = !0, n2 = r2;
+    } finally {
+      try {
+        if (!f2 && t2.return != null && (u2 = t2.return(), Object(u2) !== u2)) return;
+      } finally {
+        if (o) throw n2;
+      }
+    }
+    return a;
+  }
+}
+__name(_iterableToArrayLimit$1, "_iterableToArrayLimit$1");
+function _arrayLikeToArray(r, a) {
+  (a == null || a > r.length) && (a = r.length);
+  for (var e2 = 0, n2 = Array(a); e2 < a; e2++) n2[e2] = r[e2];
+  return n2;
+}
+__name(_arrayLikeToArray, "_arrayLikeToArray");
+function _unsupportedIterableToArray(r, a) {
+  if (r) {
+    if (typeof r == "string") return _arrayLikeToArray(r, a);
+    var t2 = {}.toString.call(r).slice(8, -1);
+    return t2 === "Object" && r.constructor && (t2 = r.constructor.name), t2 === "Map" || t2 === "Set" ? Array.from(r) : t2 === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t2) ? _arrayLikeToArray(r, a) : void 0;
+  }
+}
+__name(_unsupportedIterableToArray, "_unsupportedIterableToArray");
+function _nonIterableRest$1() {
+  throw new TypeError(`Invalid attempt to destructure non-iterable instance.
+In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
+}
+__name(_nonIterableRest$1, "_nonIterableRest$1");
+function _slicedToArray$1(r, e2) {
+  return _arrayWithHoles$1(r) || _iterableToArrayLimit$1(r, e2) || _unsupportedIterableToArray(r, e2) || _nonIterableRest$1();
+}
+__name(_slicedToArray$1, "_slicedToArray$1");
 function canUseDom() {
   return !!(typeof window < "u" && window.document && window.document.createElement);
 }
@@ -1439,19 +1495,19 @@ function useSafeState(defaultValue) {
   return __name(safeSetState, "safeSetState"), [value, safeSetState];
 }
 __name(useSafeState, "useSafeState");
-function hasValue$2(value) {
+function hasValue$1(value) {
   return value !== void 0;
 }
-__name(hasValue$2, "hasValue$2");
+__name(hasValue$1, "hasValue$1");
 function useMergedState(defaultStateValue, option) {
   var _ref = option || {}, defaultValue = _ref.defaultValue, value = _ref.value, onChange = _ref.onChange, postState = _ref.postState, _useState = useSafeState(function() {
-    return hasValue$2(value) ? value : hasValue$2(defaultValue) ? typeof defaultValue == "function" ? defaultValue() : defaultValue : typeof defaultStateValue == "function" ? defaultStateValue() : defaultStateValue;
+    return hasValue$1(value) ? value : hasValue$1(defaultValue) ? typeof defaultValue == "function" ? defaultValue() : defaultValue : typeof defaultStateValue == "function" ? defaultStateValue() : defaultStateValue;
   }), _useState2 = _slicedToArray$1(_useState, 2), innerValue = _useState2[0], setInnerValue = _useState2[1], mergedValue = value !== void 0 ? value : innerValue, postMergedValue = postState ? postState(mergedValue) : mergedValue, onChangeFn = useEvent(onChange), _useState3 = useSafeState([mergedValue]), _useState4 = _slicedToArray$1(_useState3, 2), prevValue = _useState4[0], setPrevValue = _useState4[1];
   useLayoutUpdateEffect(function() {
     var prev = prevValue[0];
     innerValue !== prev && onChangeFn(innerValue, prev);
   }, [prevValue]), useLayoutUpdateEffect(function() {
-    hasValue$2(value) || setInnerValue(value);
+    hasValue$1(value) || setInnerValue(value);
   }, [value]);
   var triggerChange = useEvent(function(updater, ignoreDestroy) {
     setInnerValue(updater, ignoreDestroy), setPrevValue([mergedValue], ignoreDestroy);
@@ -1459,6 +1515,15 @@ function useMergedState(defaultStateValue, option) {
   return [postMergedValue, triggerChange];
 }
 __name(useMergedState, "useMergedState");
+function _typeof$2(o) {
+  "@babel/helpers - typeof";
+  return _typeof$2 = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(o2) {
+    return typeof o2;
+  } : function(o2) {
+    return o2 && typeof Symbol == "function" && o2.constructor === Symbol && o2 !== Symbol.prototype ? "symbol" : typeof o2;
+  }, _typeof$2(o);
+}
+__name(_typeof$2, "_typeof$2");
 var reactIs = { exports: {} }, reactIs_production_min = {};
 /**
  * @license React
@@ -1597,25 +1662,73 @@ function isReactElement(node) {
 }
 __name(isReactElement, "isReactElement");
 Number(version$1.split(".")[0]) >= 19;
-function _arrayWithoutHoles$2(r) {
+function toPrimitive$1(t2, r) {
+  if (_typeof$2(t2) != "object" || !t2) return t2;
+  var e2 = t2[Symbol.toPrimitive];
+  if (e2 !== void 0) {
+    var i = e2.call(t2, r || "default");
+    if (_typeof$2(i) != "object") return i;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return (r === "string" ? String : Number)(t2);
+}
+__name(toPrimitive$1, "toPrimitive$1");
+function toPropertyKey$1(t2) {
+  var i = toPrimitive$1(t2, "string");
+  return _typeof$2(i) == "symbol" ? i : i + "";
+}
+__name(toPropertyKey$1, "toPropertyKey$1");
+function _defineProperty$b(e2, r, t2) {
+  return (r = toPropertyKey$1(r)) in e2 ? Object.defineProperty(e2, r, {
+    value: t2,
+    enumerable: !0,
+    configurable: !0,
+    writable: !0
+  }) : e2[r] = t2, e2;
+}
+__name(_defineProperty$b, "_defineProperty$b");
+function ownKeys$8(e2, r) {
+  var t2 = Object.keys(e2);
+  if (Object.getOwnPropertySymbols) {
+    var o = Object.getOwnPropertySymbols(e2);
+    r && (o = o.filter(function(r2) {
+      return Object.getOwnPropertyDescriptor(e2, r2).enumerable;
+    })), t2.push.apply(t2, o);
+  }
+  return t2;
+}
+__name(ownKeys$8, "ownKeys$8");
+function _objectSpread2$1(e2) {
+  for (var r = 1; r < arguments.length; r++) {
+    var t2 = arguments[r] != null ? arguments[r] : {};
+    r % 2 ? ownKeys$8(Object(t2), !0).forEach(function(r2) {
+      _defineProperty$b(e2, r2, t2[r2]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e2, Object.getOwnPropertyDescriptors(t2)) : ownKeys$8(Object(t2)).forEach(function(r2) {
+      Object.defineProperty(e2, r2, Object.getOwnPropertyDescriptor(t2, r2));
+    });
+  }
+  return e2;
+}
+__name(_objectSpread2$1, "_objectSpread2$1");
+function _arrayWithoutHoles$3(r) {
   if (Array.isArray(r)) return _arrayLikeToArray(r);
 }
-__name(_arrayWithoutHoles$2, "_arrayWithoutHoles$2");
-function _iterableToArray$2(r) {
+__name(_arrayWithoutHoles$3, "_arrayWithoutHoles$3");
+function _iterableToArray$3(r) {
   if (typeof Symbol < "u" && r[Symbol.iterator] != null || r["@@iterator"] != null) return Array.from(r);
 }
-__name(_iterableToArray$2, "_iterableToArray$2");
-function _nonIterableSpread$2() {
+__name(_iterableToArray$3, "_iterableToArray$3");
+function _nonIterableSpread$3() {
   throw new TypeError(`Invalid attempt to spread non-iterable instance.
 In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
 }
-__name(_nonIterableSpread$2, "_nonIterableSpread$2");
-function _toConsumableArray$3(r) {
-  return _arrayWithoutHoles$2(r) || _iterableToArray$2(r) || _unsupportedIterableToArray(r) || _nonIterableSpread$2();
+__name(_nonIterableSpread$3, "_nonIterableSpread$3");
+function _toConsumableArray$4(r) {
+  return _arrayWithoutHoles$3(r) || _iterableToArray$3(r) || _unsupportedIterableToArray(r) || _nonIterableSpread$3();
 }
-__name(_toConsumableArray$3, "_toConsumableArray$3");
+__name(_toConsumableArray$4, "_toConsumableArray$4");
 function _toArray(r) {
-  return _arrayWithHoles$1(r) || _iterableToArray$2(r) || _unsupportedIterableToArray(r) || _nonIterableRest$1();
+  return _arrayWithHoles$1(r) || _iterableToArray$3(r) || _unsupportedIterableToArray(r) || _nonIterableRest$1();
 }
 __name(_toArray, "_toArray");
 var warned$1 = {}, preMessage$1 = /* @__PURE__ */ __name(function(fn) {
@@ -1648,7 +1761,7 @@ warningOnce$1.noteOnce = noteOnce$1;
 var Handler = /* @__PURE__ */ __name(function(_ref) {
   var _ref$size = _ref.size, size = _ref$size === void 0 ? "default" : _ref$size, color = _ref.color, prefixCls = _ref.prefixCls;
   return /* @__PURE__ */ React__default.createElement("div", {
-    className: clsx("".concat(prefixCls, "-handler"), _defineProperty$b({}, "".concat(prefixCls, "-handler-sm"), size === "small")),
+    className: clsx("".concat(prefixCls, "-handler"), _defineProperty$c({}, "".concat(prefixCls, "-handler-sm"), size === "small")),
     style: {
       backgroundColor: color
     }
@@ -1657,19 +1770,20 @@ var Handler = /* @__PURE__ */ __name(function(_ref) {
   var children = _ref.children, style2 = _ref.style, prefixCls = _ref.prefixCls;
   return /* @__PURE__ */ React__default.createElement("div", {
     className: "".concat(prefixCls, "-palette"),
-    style: _objectSpread2$1({
+    style: _objectSpread2$2({
       position: "relative"
     }, style2)
   }, children);
 }, "Palette"), Transform = /* @__PURE__ */ forwardRef(function(props, ref) {
-  var children = props.children, offset2 = props.offset;
+  var children = props.children, x = props.x, y = props.y;
   return /* @__PURE__ */ React__default.createElement("div", {
     ref,
     style: {
       position: "absolute",
-      left: offset2.x,
-      top: offset2.y,
-      zIndex: 1
+      left: "".concat(x, "%"),
+      top: "".concat(y, "%"),
+      zIndex: 1,
+      transform: "translate(-50%, -50%)"
     }
   }, children);
 }), Picker$1 = /* @__PURE__ */ __name(function(_ref) {
@@ -1685,15 +1799,15 @@ var Handler = /* @__PURE__ */ __name(function(_ref) {
     color,
     containerRef: pickerRef,
     targetRef: transformRef,
-    calculate: /* @__PURE__ */ __name(function(containerRef) {
-      return calculateOffset(containerRef, transformRef, color);
+    calculate: /* @__PURE__ */ __name(function() {
+      return calcOffset(color);
     }, "calculate"),
     onDragChange,
     onDragChangeComplete: /* @__PURE__ */ __name(function() {
       return onChangeComplete == null ? void 0 : onChangeComplete(colorRef.current);
     }, "onDragChangeComplete"),
     disabledDrag: disabled
-  }), _useColorDrag2 = _slicedToArray$1(_useColorDrag, 2), offset2 = _useColorDrag2[0], dragStartHandle = _useColorDrag2[1];
+  }), _useColorDrag2 = _slicedToArray$2(_useColorDrag, 2), offset2 = _useColorDrag2[0], dragStartHandle = _useColorDrag2[1];
   return /* @__PURE__ */ React__default.createElement("div", {
     ref: pickerRef,
     className: "".concat(prefixCls, "-select"),
@@ -1702,7 +1816,8 @@ var Handler = /* @__PURE__ */ __name(function(_ref) {
   }, /* @__PURE__ */ React__default.createElement(Palette, {
     prefixCls
   }, /* @__PURE__ */ React__default.createElement(Transform, {
-    offset: offset2,
+    x: offset2.x,
+    y: offset2.y,
     ref: transformRef
   }, /* @__PURE__ */ React__default.createElement(Handler, {
     color: color.toRgbString(),
@@ -1714,24 +1829,18 @@ var Handler = /* @__PURE__ */ __name(function(_ref) {
       backgroundImage: "linear-gradient(0deg, #000, transparent),linear-gradient(90deg, #fff, hsla(0, 0%, 100%, 0))"
     }
   })));
-}, "Picker");
-function hasValue$1(value) {
-  return value !== void 0;
-}
-__name(hasValue$1, "hasValue$1");
-var useColorState = /* @__PURE__ */ __name(function(defaultStateValue, option) {
-  var defaultValue = option.defaultValue, value = option.value, _useState = useState(function() {
-    var mergeState;
-    return hasValue$1(value) ? mergeState = value : hasValue$1(defaultValue) ? mergeState = defaultValue : mergeState = defaultStateValue, generateColor(mergeState);
-  }), _useState2 = _slicedToArray$1(_useState, 2), colorValue = _useState2[0], setColorValue = _useState2[1];
-  return useEffect(function() {
-    value && setColorValue(generateColor(value));
-  }, [value]), [colorValue, setColorValue];
+}, "Picker"), useColorState = /* @__PURE__ */ __name(function(defaultValue, value) {
+  var _useMergedState = useMergedState(defaultValue, {
+    value
+  }), _useMergedState2 = _slicedToArray$2(_useMergedState, 2), mergedValue = _useMergedState2[0], setValue = _useMergedState2[1], color = useMemo$1(function() {
+    return generateColor(mergedValue);
+  }, [mergedValue]);
+  return [color, setValue];
 }, "useColorState"), Gradient = /* @__PURE__ */ __name(function(_ref) {
   var colors = _ref.colors, children = _ref.children, _ref$direction = _ref.direction, direction = _ref$direction === void 0 ? "to right" : _ref$direction, type2 = _ref.type, prefixCls = _ref.prefixCls, gradientColors = useMemo$1(function() {
     return colors.map(function(color, idx) {
       var result = generateColor(color);
-      return type2 === "alpha" && idx === colors.length - 1 && result.setAlpha(1), result.toRgbString();
+      return type2 === "alpha" && idx === colors.length - 1 && (result = new Color(result.setA(1))), result.toRgbString();
     }).join(",");
   }, [colors, type2]);
   return /* @__PURE__ */ React__default.createElement("div", {
@@ -1744,7 +1853,7 @@ var useColorState = /* @__PURE__ */ __name(function(defaultStateValue, option) {
   }, children);
 }, "Gradient"), Slider$1 = /* @__PURE__ */ __name(function(props) {
   var prefixCls = props.prefixCls, colors = props.colors, disabled = props.disabled, onChange = props.onChange, onChangeComplete = props.onChangeComplete, color = props.color, type2 = props.type, sliderRef = useRef(), transformRef = useRef(), colorRef = useRef(color), getValue = /* @__PURE__ */ __name(function(c2) {
-    return type2 === "hue" ? c2.getHue() : c2.getAlpha() * 100;
+    return type2 === "hue" ? c2.getHue() : c2.a * 100;
   }, "getValue"), onDragChange = useEvent(function(offsetValue) {
     var calcColor = calculateColor({
       offset: offsetValue,
@@ -1758,8 +1867,8 @@ var useColorState = /* @__PURE__ */ __name(function(defaultStateValue, option) {
     color,
     targetRef: transformRef,
     containerRef: sliderRef,
-    calculate: /* @__PURE__ */ __name(function(containerRef) {
-      return calculateOffset(containerRef, transformRef, color, type2);
+    calculate: /* @__PURE__ */ __name(function() {
+      return calcOffset(color, type2);
     }, "calculate"),
     onDragChange,
     onDragChangeComplete: /* @__PURE__ */ __name(function() {
@@ -1767,7 +1876,15 @@ var useColorState = /* @__PURE__ */ __name(function(defaultStateValue, option) {
     }, "onDragChangeComplete"),
     direction: "x",
     disabledDrag: disabled
-  }), _useColorDrag2 = _slicedToArray$1(_useColorDrag, 2), offset2 = _useColorDrag2[0], dragStartHandle = _useColorDrag2[1], gradientList = React__default.useMemo(function() {
+  }), _useColorDrag2 = _slicedToArray$2(_useColorDrag, 2), offset2 = _useColorDrag2[0], dragStartHandle = _useColorDrag2[1], handleColor = React__default.useMemo(function() {
+    if (type2 === "hue") {
+      var hsb = color.toHsb();
+      hsb.s = 1, hsb.b = 1, hsb.a = 1;
+      var lightColor = new Color(hsb);
+      return lightColor;
+    }
+    return color;
+  }, [color, type2]), gradientList = React__default.useMemo(function() {
     return colors.map(function(info) {
       return "".concat(info.color, " ").concat(info.percent, "%");
     });
@@ -1780,11 +1897,12 @@ var useColorState = /* @__PURE__ */ __name(function(defaultStateValue, option) {
   }, /* @__PURE__ */ React__default.createElement(Palette, {
     prefixCls
   }, /* @__PURE__ */ React__default.createElement(Transform, {
-    offset: offset2,
+    x: offset2.x,
+    y: offset2.y,
     ref: transformRef
   }, /* @__PURE__ */ React__default.createElement(Handler, {
     size: "small",
-    color: color.toHexString(),
+    color: handleColor.toHexString(),
     prefixCls
   })), /* @__PURE__ */ React__default.createElement(Gradient, {
     colors: gradientList,
@@ -1820,51 +1938,50 @@ var HUE_COLORS = [{
 }, {
   color: "rgb(255, 0, 0)",
   percent: 100
-}];
-const ColorPicker$1 = /* @__PURE__ */ forwardRef(function(props, ref) {
-  var value = props.value, defaultValue = props.defaultValue, _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? ColorPickerPrefixCls : _props$prefixCls, onChange = props.onChange, onChangeComplete = props.onChangeComplete, className = props.className, style2 = props.style, panelRender = props.panelRender, _props$disabledAlpha = props.disabledAlpha, disabledAlpha = _props$disabledAlpha === void 0 ? !1 : _props$disabledAlpha, _props$disabled = props.disabled, disabled = _props$disabled === void 0 ? !1 : _props$disabled, components = props.components, _useComponent = useComponent(components), _useComponent2 = _slicedToArray$1(_useComponent, 1), Slider3 = _useComponent2[0], _useColorState = useColorState(defaultColor, {
-    value,
-    defaultValue
-  }), _useColorState2 = _slicedToArray$1(_useColorState, 2), colorValue = _useColorState2[0], setColorValue = _useColorState2[1], alphaColor = useMemo$1(function() {
-    var rgb = generateColor(colorValue.toRgbString());
-    return rgb.setAlpha(1), rgb.toRgbString();
+}], ColorPicker$1 = /* @__PURE__ */ forwardRef(function(props, ref) {
+  var value = props.value, defaultValue = props.defaultValue, _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? ColorPickerPrefixCls : _props$prefixCls, onChange = props.onChange, onChangeComplete = props.onChangeComplete, className = props.className, style2 = props.style, panelRender = props.panelRender, _props$disabledAlpha = props.disabledAlpha, disabledAlpha = _props$disabledAlpha === void 0 ? !1 : _props$disabledAlpha, _props$disabled = props.disabled, disabled = _props$disabled === void 0 ? !1 : _props$disabled, components = props.components, _useComponent = useComponent(components), _useComponent2 = _slicedToArray$2(_useComponent, 1), Slider3 = _useComponent2[0], _useColorState = useColorState(defaultValue || defaultColor, value), _useColorState2 = _slicedToArray$2(_useColorState, 2), colorValue = _useColorState2[0], setColorValue = _useColorState2[1], alphaColor = useMemo$1(function() {
+    return colorValue.setA(1).toRgbString();
   }, [colorValue]), handleChange = /* @__PURE__ */ __name(function(data, type2) {
     value || setColorValue(data), onChange == null || onChange(data, type2);
-  }, "handleChange"), getHueColor = /* @__PURE__ */ __name(function(hue) {
-    var hsb = colorValue.toHsb();
-    return hsb.h = hue, new Color(hsb);
-  }, "getHueColor"), getAlphaColor = /* @__PURE__ */ __name(function(alpha) {
-    var hsb = colorValue.toHsb();
-    return hsb.a = Math.round(alpha) / 100, new Color(hsb);
-  }, "getAlphaColor"), onHueChange = /* @__PURE__ */ __name(function(hue) {
-    handleChange(getHueColor(hue), "hue");
-  }, "onHueChange"), onAlphaChange = /* @__PURE__ */ __name(function(alpha) {
-    handleChange(getAlphaColor(alpha), "alpha");
-  }, "onAlphaChange"), onHueChangeComplete = /* @__PURE__ */ __name(function(hue) {
+  }, "handleChange2"), getHueColor = /* @__PURE__ */ __name(function(hue) {
+    return new Color(colorValue.setHue(hue));
+  }, "getHueColor2"), getAlphaColor = /* @__PURE__ */ __name(function(alpha) {
+    return new Color(colorValue.setA(alpha / 100));
+  }, "getAlphaColor2"), onHueChange = /* @__PURE__ */ __name(function(hue) {
+    handleChange(getHueColor(hue), {
+      type: "hue",
+      value: hue
+    });
+  }, "onHueChange2"), onAlphaChange = /* @__PURE__ */ __name(function(alpha) {
+    handleChange(getAlphaColor(alpha), {
+      type: "alpha",
+      value: alpha
+    });
+  }, "onAlphaChange2"), onHueChangeComplete = /* @__PURE__ */ __name(function(hue) {
     onChangeComplete && onChangeComplete(getHueColor(hue));
-  }, "onHueChangeComplete"), onAlphaChangeComplete = /* @__PURE__ */ __name(function(alpha) {
+  }, "onHueChangeComplete2"), onAlphaChangeComplete = /* @__PURE__ */ __name(function(alpha) {
     onChangeComplete && onChangeComplete(getAlphaColor(alpha));
-  }, "onAlphaChangeComplete"), mergeCls = clsx("".concat(prefixCls, "-panel"), className, _defineProperty$b({}, "".concat(prefixCls, "-panel-disabled"), disabled)), sharedSliderProps = {
+  }, "onAlphaChangeComplete2"), mergeCls = clsx("".concat(prefixCls, "-panel"), className, _defineProperty$c({}, "".concat(prefixCls, "-panel-disabled"), disabled)), sharedSliderProps = {
     prefixCls,
     disabled,
     color: colorValue
-  }, defaultPanel = /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(Picker$1, _extends$5({
+  }, defaultPanel = /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(Picker$1, _extends$6({
     onChange: handleChange
   }, sharedSliderProps, {
     onChangeComplete
   })), /* @__PURE__ */ React__default.createElement("div", {
     className: "".concat(prefixCls, "-slider-container")
   }, /* @__PURE__ */ React__default.createElement("div", {
-    className: clsx("".concat(prefixCls, "-slider-group"), _defineProperty$b({}, "".concat(prefixCls, "-slider-group-disabled-alpha"), disabledAlpha))
-  }, /* @__PURE__ */ React__default.createElement(Slider3, _extends$5({}, sharedSliderProps, {
+    className: clsx("".concat(prefixCls, "-slider-group"), _defineProperty$c({}, "".concat(prefixCls, "-slider-group-disabled-alpha"), disabledAlpha))
+  }, /* @__PURE__ */ React__default.createElement(Slider3, _extends$6({}, sharedSliderProps, {
     type: "hue",
     colors: HUE_COLORS,
     min: 0,
-    max: 360,
+    max: 359,
     value: colorValue.getHue(),
     onChange: onHueChange,
     onChangeComplete: onHueChangeComplete
-  })), !disabledAlpha && /* @__PURE__ */ React__default.createElement(Slider3, _extends$5({}, sharedSliderProps, {
+  })), !disabledAlpha && /* @__PURE__ */ React__default.createElement(Slider3, _extends$6({}, sharedSliderProps, {
     type: "alpha",
     colors: [{
       percent: 0,
@@ -1875,7 +1992,7 @@ const ColorPicker$1 = /* @__PURE__ */ forwardRef(function(props, ref) {
     }],
     min: 0,
     max: 100,
-    value: colorValue.getAlpha() * 100,
+    value: colorValue.a * 100,
     onChange: onAlphaChange,
     onChangeComplete: onAlphaChangeComplete
   }))), /* @__PURE__ */ React__default.createElement(ColorBlock, {
@@ -1887,7 +2004,8 @@ const ColorPicker$1 = /* @__PURE__ */ forwardRef(function(props, ref) {
     style: style2,
     ref
   }, typeof panelRender == "function" ? panelRender(defaultPanel) : defaultPanel);
-}), colorPicker = "univer-color-picker", colorPickerHidden = "univer-color-picker-hidden", colorPickerPanel = "univer-color-picker-panel", colorPickerPanelDisabled = "univer-color-picker-panel-disabled", colorPickerSelect = "univer-color-picker-select", colorPickerPalette = "univer-color-picker-palette", colorPickerGradient = "univer-color-picker-gradient", colorPickerSaturation = "univer-color-picker-saturation", colorPickerHandler = "univer-color-picker-handler", colorPickerSlider = "univer-color-picker-slider", colorPickerColorBlocks = "univer-color-picker-color-blocks", colorPickerColorBlock = "univer-color-picker-color-block", colorPickerColorBlockInner = "univer-color-picker-color-block-inner", colorPickerSliderContainer = "univer-color-picker-slider-container", colorPickerSliderGroup = "univer-color-picker-slider-group", colorPickerSliderGroupDisabledAlpha = "univer-color-picker-slider-group-disabled-alpha", styles$o = {
+});
+const colorPicker = "univer-color-picker", colorPickerHidden = "univer-color-picker-hidden", colorPickerPanel = "univer-color-picker-panel", colorPickerPanelDisabled = "univer-color-picker-panel-disabled", colorPickerSelect = "univer-color-picker-select", colorPickerPalette = "univer-color-picker-palette", colorPickerGradient = "univer-color-picker-gradient", colorPickerSaturation = "univer-color-picker-saturation", colorPickerHandler = "univer-color-picker-handler", colorPickerSlider = "univer-color-picker-slider", colorPickerColorBlocks = "univer-color-picker-color-blocks", colorPickerColorBlock = "univer-color-picker-color-block", colorPickerColorBlockInner = "univer-color-picker-color-block-inner", colorPickerSliderContainer = "univer-color-picker-slider-container", colorPickerSliderGroup = "univer-color-picker-slider-group", colorPickerSliderGroupDisabledAlpha = "univer-color-picker-slider-group-disabled-alpha", styles$o = {
   colorPicker,
   colorPickerHidden,
   colorPickerPanel,
@@ -2018,6 +2136,16 @@ function ColorPicker(props) {
   )))), /* @__PURE__ */ React__default.createElement("section", { onClick: handleStopPropagation }, /* @__PURE__ */ React__default.createElement(ColorPicker$1, { prefixCls: styles$o.colorPicker, disabledAlpha: !0, onChangeComplete: handleChange })));
 }
 __name(ColorPicker, "ColorPicker");
+function _extends$5() {
+  return _extends$5 = Object.assign ? Object.assign.bind() : function(n2) {
+    for (var e2 = 1; e2 < arguments.length; e2++) {
+      var t2 = arguments[e2];
+      for (var r in t2) ({}).hasOwnProperty.call(t2, r) && (n2[r] = t2[r]);
+    }
+    return n2;
+  }, _extends$5.apply(null, arguments);
+}
+__name(_extends$5, "_extends$5");
 var OrderContext = /* @__PURE__ */ React$6.createContext(null), EMPTY_LIST$2 = [];
 function useDom(render2, debug) {
   var _React$useState = React$6.useState(function() {
@@ -2027,7 +2155,7 @@ function useDom(render2, debug) {
     return defaultEle;
   }), _React$useState2 = _slicedToArray$1(_React$useState, 1), ele = _React$useState2[0], appendedRef = React$6.useRef(!1), queueCreate = React$6.useContext(OrderContext), _React$useState3 = React$6.useState(EMPTY_LIST$2), _React$useState4 = _slicedToArray$1(_React$useState3, 2), queue = _React$useState4[0], setQueue = _React$useState4[1], mergedQueueCreate = queueCreate || (appendedRef.current ? void 0 : function(appendFn) {
     setQueue(function(origin) {
-      var newQueue = [appendFn].concat(_toConsumableArray$3(origin));
+      var newQueue = [appendFn].concat(_toConsumableArray$4(origin));
       return newQueue;
     });
   });
@@ -2864,7 +2992,104 @@ function findDOMNode$1(node) {
   return null;
 }
 __name(findDOMNode$1, "findDOMNode$1");
-var Context = /* @__PURE__ */ React$6.createContext({}), DomWrapper$1 = /* @__PURE__ */ function(_React$Component) {
+function _objectWithoutPropertiesLoose$3(r, e2) {
+  if (r == null) return {};
+  var t2 = {};
+  for (var n2 in r) if ({}.hasOwnProperty.call(r, n2)) {
+    if (e2.indexOf(n2) >= 0) continue;
+    t2[n2] = r[n2];
+  }
+  return t2;
+}
+__name(_objectWithoutPropertiesLoose$3, "_objectWithoutPropertiesLoose$3");
+function _objectWithoutProperties$1(e2, t2) {
+  if (e2 == null) return {};
+  var o, r, i = _objectWithoutPropertiesLoose$3(e2, t2);
+  if (Object.getOwnPropertySymbols) {
+    var n2 = Object.getOwnPropertySymbols(e2);
+    for (r = 0; r < n2.length; r++) o = n2[r], t2.indexOf(o) >= 0 || {}.propertyIsEnumerable.call(e2, o) && (i[o] = e2[o]);
+  }
+  return i;
+}
+__name(_objectWithoutProperties$1, "_objectWithoutProperties$1");
+var Context = /* @__PURE__ */ React$6.createContext({});
+function _classCallCheck$1(a, n2) {
+  if (!(a instanceof n2)) throw new TypeError("Cannot call a class as a function");
+}
+__name(_classCallCheck$1, "_classCallCheck$1");
+function _defineProperties$1(e2, r) {
+  for (var t2 = 0; t2 < r.length; t2++) {
+    var o = r[t2];
+    o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e2, toPropertyKey$1(o.key), o);
+  }
+}
+__name(_defineProperties$1, "_defineProperties$1");
+function _createClass$1(e2, r, t2) {
+  return r && _defineProperties$1(e2.prototype, r), t2 && _defineProperties$1(e2, t2), Object.defineProperty(e2, "prototype", {
+    writable: !1
+  }), e2;
+}
+__name(_createClass$1, "_createClass$1");
+function _setPrototypeOf$3(t2, e2) {
+  return _setPrototypeOf$3 = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(t3, e3) {
+    return t3.__proto__ = e3, t3;
+  }, _setPrototypeOf$3(t2, e2);
+}
+__name(_setPrototypeOf$3, "_setPrototypeOf$3");
+function _inherits$1(t2, e2) {
+  if (typeof e2 != "function" && e2 !== null) throw new TypeError("Super expression must either be null or a function");
+  t2.prototype = Object.create(e2 && e2.prototype, {
+    constructor: {
+      value: t2,
+      writable: !0,
+      configurable: !0
+    }
+  }), Object.defineProperty(t2, "prototype", {
+    writable: !1
+  }), e2 && _setPrototypeOf$3(t2, e2);
+}
+__name(_inherits$1, "_inherits$1");
+function _getPrototypeOf$1(t2) {
+  return _getPrototypeOf$1 = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function(t3) {
+    return t3.__proto__ || Object.getPrototypeOf(t3);
+  }, _getPrototypeOf$1(t2);
+}
+__name(_getPrototypeOf$1, "_getPrototypeOf$1");
+function _isNativeReflectConstruct$1() {
+  try {
+    var t2 = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {
+    }));
+  } catch {
+  }
+  return (_isNativeReflectConstruct$1 = /* @__PURE__ */ __name(function() {
+    return !!t2;
+  }, "_isNativeReflectConstruct"))();
+}
+__name(_isNativeReflectConstruct$1, "_isNativeReflectConstruct$1");
+function _assertThisInitialized$1(e2) {
+  if (e2 === void 0) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+  return e2;
+}
+__name(_assertThisInitialized$1, "_assertThisInitialized$1");
+function _possibleConstructorReturn$1(t2, e2) {
+  if (e2 && (_typeof$2(e2) == "object" || typeof e2 == "function")) return e2;
+  if (e2 !== void 0) throw new TypeError("Derived constructors may only return object or undefined");
+  return _assertThisInitialized$1(t2);
+}
+__name(_possibleConstructorReturn$1, "_possibleConstructorReturn$1");
+function _createSuper$1(t2) {
+  var r = _isNativeReflectConstruct$1();
+  return function() {
+    var e2, o = _getPrototypeOf$1(t2);
+    if (r) {
+      var s = _getPrototypeOf$1(this).constructor;
+      e2 = Reflect.construct(o, arguments, s);
+    } else e2 = o.apply(this, arguments);
+    return _possibleConstructorReturn$1(this, e2);
+  };
+}
+__name(_createSuper$1, "_createSuper$1");
+var DomWrapper$1 = /* @__PURE__ */ function(_React$Component) {
   _inherits$1(DomWrapper2, _React$Component);
   var _super = _createSuper$1(DomWrapper2);
   function DomWrapper2() {
@@ -4645,14 +4870,18 @@ function Dialog(props) {
     preservePositionOnDestroy = !1,
     footer,
     onClose,
-    mask
+    mask,
+    dialogStyles,
+    closable,
+    maskClosable
   } = props, [dragDisabled, setDragDisabled] = useState(!1), [positionOffset, setPositionOffset] = useState(null), { mountContainer } = useContext(ConfigContext), TitleIfDraggable = draggable ? /* @__PURE__ */ React__default.createElement(
     "div",
     {
       className: styles$n.dialogTitleContent,
       style: {
         width: "100%",
-        cursor: "pointer"
+        cursor: "pointer",
+        ...dialogStyles == null ? void 0 : dialogStyles.header
       },
       onMouseOver: /* @__PURE__ */ __name(() => {
         dragDisabled && setDragDisabled(!1);
@@ -4711,7 +4940,10 @@ function Dialog(props) {
       footer,
       mask: needMask,
       style: style2,
-      onClose
+      onClose,
+      styles: dialogStyles,
+      closable,
+      maskClosable
     },
     children
   );
@@ -4749,6 +4981,23 @@ function Confirm(props) {
   );
 }
 __name(Confirm, "Confirm");
+function _arrayWithoutHoles$2(r) {
+  if (Array.isArray(r)) return _arrayLikeToArray$1(r);
+}
+__name(_arrayWithoutHoles$2, "_arrayWithoutHoles$2");
+function _iterableToArray$2(r) {
+  if (typeof Symbol < "u" && r[Symbol.iterator] != null || r["@@iterator"] != null) return Array.from(r);
+}
+__name(_iterableToArray$2, "_iterableToArray$2");
+function _nonIterableSpread$2() {
+  throw new TypeError(`Invalid attempt to spread non-iterable instance.
+In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
+}
+__name(_nonIterableSpread$2, "_nonIterableSpread$2");
+function _toConsumableArray$3(r) {
+  return _arrayWithoutHoles$2(r) || _iterableToArray$2(r) || _unsupportedIterableToArray$1(r) || _nonIterableSpread$2();
+}
+__name(_toConsumableArray$3, "_toConsumableArray$3");
 function omit$2(obj, fields) {
   var clone = Object.assign({}, obj);
   return Array.isArray(fields) && fields.forEach(function(key) {
@@ -5214,7 +5463,7 @@ function Arrow(props) {
 __name(Arrow, "Arrow");
 function Mask2(props) {
   var prefixCls = props.prefixCls, open = props.open, zIndex = props.zIndex, mask = props.mask, motion = props.motion;
-  return mask ? /* @__PURE__ */ React$6.createElement(CSSMotion, _extends$5({}, motion, {
+  return mask ? /* @__PURE__ */ React$6.createElement(CSSMotion, _extends$6({}, motion, {
     motionAppear: !0,
     visible: open,
     removeOnLeave: !0
@@ -5235,7 +5484,7 @@ var PopupContent = /* @__PURE__ */ React$6.memo(function(_ref) {
 }, function(_, next) {
   return next.cache;
 }), Popup$3 = /* @__PURE__ */ React$6.forwardRef(function(props, ref) {
-  var popup2 = props.popup, className = props.className, prefixCls = props.prefixCls, style2 = props.style, target = props.target, _onVisibleChanged = props.onVisibleChanged, open = props.open, keepDom = props.keepDom, fresh = props.fresh, onClick = props.onClick, mask = props.mask, arrow = props.arrow, arrowPos = props.arrowPos, align = props.align, motion = props.motion, maskMotion = props.maskMotion, forceRender = props.forceRender, getPopupContainer = props.getPopupContainer, autoDestroy = props.autoDestroy, Portal2 = props.portal, zIndex = props.zIndex, onMouseEnter = props.onMouseEnter, onMouseLeave = props.onMouseLeave, onPointerEnter = props.onPointerEnter, ready = props.ready, offsetX = props.offsetX, offsetY = props.offsetY, offsetR = props.offsetR, offsetB = props.offsetB, onAlign = props.onAlign, onPrepare = props.onPrepare, stretch = props.stretch, targetWidth = props.targetWidth, targetHeight = props.targetHeight, childNode = typeof popup2 == "function" ? popup2() : popup2, isNodeVisible = open || keepDom, getPopupContainerNeedParams = (getPopupContainer == null ? void 0 : getPopupContainer.length) > 0, _React$useState = React$6.useState(!getPopupContainer || !getPopupContainerNeedParams), _React$useState2 = _slicedToArray$1(_React$useState, 2), show = _React$useState2[0], setShow = _React$useState2[1];
+  var popup2 = props.popup, className = props.className, prefixCls = props.prefixCls, style2 = props.style, target = props.target, _onVisibleChanged = props.onVisibleChanged, open = props.open, keepDom = props.keepDom, fresh = props.fresh, onClick = props.onClick, mask = props.mask, arrow = props.arrow, arrowPos = props.arrowPos, align = props.align, motion = props.motion, maskMotion = props.maskMotion, forceRender = props.forceRender, getPopupContainer = props.getPopupContainer, autoDestroy = props.autoDestroy, Portal2 = props.portal, zIndex = props.zIndex, onMouseEnter = props.onMouseEnter, onMouseLeave = props.onMouseLeave, onPointerEnter = props.onPointerEnter, ready = props.ready, offsetX = props.offsetX, offsetY = props.offsetY, offsetR = props.offsetR, offsetB = props.offsetB, onAlign = props.onAlign, onPrepare = props.onPrepare, stretch = props.stretch, targetWidth = props.targetWidth, targetHeight = props.targetHeight, childNode = typeof popup2 == "function" ? popup2() : popup2, isNodeVisible = open || keepDom, getPopupContainerNeedParams = (getPopupContainer == null ? void 0 : getPopupContainer.length) > 0, _React$useState = React$6.useState(!getPopupContainer || !getPopupContainerNeedParams), _React$useState2 = _slicedToArray$2(_React$useState, 2), show = _React$useState2[0], setShow = _React$useState2[1];
   if (useLayoutEffect$1(function() {
     !show && getPopupContainerNeedParams && target && setShow(!0);
   }, [show, getPopupContainerNeedParams, target]), !show)
@@ -5267,7 +5516,7 @@ var PopupContent = /* @__PURE__ */ React$6.memo(function(_ref) {
     onResize: onAlign,
     disabled: !open
   }, function(resizeObserverRef) {
-    return /* @__PURE__ */ React$6.createElement(CSSMotion, _extends$5({
+    return /* @__PURE__ */ React$6.createElement(CSSMotion, _extends$6({
       motionAppear: !0,
       motionEnter: !0,
       motionLeave: !0,
@@ -5287,7 +5536,7 @@ var PopupContent = /* @__PURE__ */ React$6.memo(function(_ref) {
       return /* @__PURE__ */ React$6.createElement("div", {
         ref: composeRef(resizeObserverRef, ref, motionRef),
         className: cls,
-        style: _objectSpread2$1(_objectSpread2$1(_objectSpread2$1(_objectSpread2$1({
+        style: _objectSpread2$2(_objectSpread2$2(_objectSpread2$2(_objectSpread2$2({
           "--arrow-x": "".concat(arrowPos.x || 0, "px"),
           "--arrow-y": "".concat(arrowPos.y || 0, "px")
         }, offsetStyle), miscStyle), motionStyle), {}, {
@@ -5392,7 +5641,7 @@ function getPxValue(val) {
 }
 __name(getPxValue, "getPxValue");
 function getVisibleArea(initArea, scrollerList) {
-  var visibleArea = _objectSpread2$1({}, initArea);
+  var visibleArea = _objectSpread2$2({}, initArea);
   return (scrollerList || []).forEach(function(ele) {
     if (!(ele instanceof HTMLBodyElement || ele instanceof HTMLHtmlElement)) {
       var _getWin$getComputedSt2 = getWin(ele).getComputedStyle(ele), overflow = _getWin$getComputedSt2.overflow, overflowClipMargin = _getWin$getComputedSt2.overflowClipMargin, borderTopWidth = _getWin$getComputedSt2.borderTopWidth, borderBottomWidth = _getWin$getComputedSt2.borderBottomWidth, borderLeftWidth = _getWin$getComputedSt2.borderLeftWidth, borderRightWidth = _getWin$getComputedSt2.borderRightWidth, eleRect = ele.getBoundingClientRect(), eleOutHeight = ele.offsetHeight, eleInnerHeight = ele.clientHeight, eleOutWidth = ele.offsetWidth, eleInnerWidth = ele.clientWidth, borderTopNum = getPxValue(borderTopWidth), borderBottomNum = getPxValue(borderBottomWidth), borderLeftNum = getPxValue(borderLeftWidth), borderRightNum = getPxValue(borderRightWidth), scaleX = toNum(Math.round(eleRect.width / eleOutWidth * 1e3) / 1e3), scaleY = toNum(Math.round(eleRect.height / eleOutHeight * 1e3) / 1e3), eleScrollWidth = (eleOutWidth - eleInnerWidth - borderLeftNum - borderRightNum) * scaleX, eleScrollHeight = (eleOutHeight - eleInnerHeight - borderTopNum - borderBottomNum) * scaleY, scaledBorderTopWidth = borderTopNum * scaleY, scaledBorderBottomWidth = borderBottomNum * scaleY, scaledBorderLeftWidth = borderLeftNum * scaleX, scaledBorderRightWidth = borderRightNum * scaleX, clipMarginWidth = 0, clipMarginHeight = 0;
@@ -5412,7 +5661,7 @@ function getUnitOffset(size) {
 }
 __name(getUnitOffset, "getUnitOffset");
 function getNumberOffset(rect, offset2) {
-  var _ref = offset2 || [], _ref2 = _slicedToArray$1(_ref, 2), offsetX = _ref2[0], offsetY = _ref2[1];
+  var _ref = offset2 || [], _ref2 = _slicedToArray$2(_ref, 2), offsetX = _ref2[0], offsetY = _ref2[1];
   return [getUnitOffset(rect.width, offsetX), getUnitOffset(rect.height, offsetY)];
 }
 __name(getNumberOffset, "getNumberOffset");
@@ -5453,7 +5702,7 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
     scaleX: 1,
     scaleY: 1,
     align: builtinPlacements[placement] || {}
-  }), _React$useState2 = _slicedToArray$1(_React$useState, 2), offsetInfo = _React$useState2[0], setOffsetInfo = _React$useState2[1], alignCountRef = React$6.useRef(0), scrollerList = React$6.useMemo(function() {
+  }), _React$useState2 = _slicedToArray$2(_React$useState, 2), offsetInfo = _React$useState2[0], setOffsetInfo = _React$useState2[1], alignCountRef = React$6.useRef(0), scrollerList = React$6.useMemo(function() {
     return popupEle ? collectScroller(popupEle) : [];
   }, [popupEle]), prevFlipRef = React$6.useRef({}), resetFlipCache = /* @__PURE__ */ __name(function() {
     prevFlipRef.current = {};
@@ -5468,7 +5717,7 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
         nextPopupY = popupRect.y + nextOffsetY, nextPopupBottom = nextPopupY + popupHeight, nextPopupX = popupRect.x + nextOffsetX, nextPopupRight = nextPopupX + popupWidth;
       };
       __name(getIntersectionVisibleArea, "getIntersectionVisibleArea"), __name(syncNextPopupPosition, "syncNextPopupPosition");
-      var _popupElement$parentE, _popupElement$parentE2, popupElement = popupEle, doc = popupElement.ownerDocument, win = getWin(popupElement), _win$getComputedStyle = win.getComputedStyle(popupElement), width2 = _win$getComputedStyle.width, height2 = _win$getComputedStyle.height, popupPosition = _win$getComputedStyle.position, originLeft = popupElement.style.left, originTop = popupElement.style.top, originRight = popupElement.style.right, originBottom = popupElement.style.bottom, originOverflow = popupElement.style.overflow, placementInfo = _objectSpread2$1(_objectSpread2$1({}, builtinPlacements[placement]), popupAlign), placeholderElement = doc.createElement("div");
+      var _popupElement$parentE, _popupElement$parentE2, popupElement = popupEle, doc = popupElement.ownerDocument, win = getWin(popupElement), _win$getComputedStyle = win.getComputedStyle(popupElement), width2 = _win$getComputedStyle.width, height2 = _win$getComputedStyle.height, popupPosition = _win$getComputedStyle.position, originLeft = popupElement.style.left, originTop = popupElement.style.top, originRight = popupElement.style.right, originBottom = popupElement.style.bottom, originOverflow = popupElement.style.overflow, placementInfo = _objectSpread2$2(_objectSpread2$2({}, builtinPlacements[placement]), popupAlign), placeholderElement = doc.createElement("div");
       (_popupElement$parentE = popupElement.parentElement) === null || _popupElement$parentE === void 0 || _popupElement$parentE.appendChild(placeholderElement), placeholderElement.style.left = "".concat(popupElement.offsetLeft, "px"), placeholderElement.style.top = "".concat(popupElement.offsetTop, "px"), placeholderElement.style.position = popupPosition, placeholderElement.style.height = "".concat(popupElement.offsetHeight, "px"), placeholderElement.style.width = "".concat(popupElement.offsetWidth, "px"), popupElement.style.left = "0", popupElement.style.top = "0", popupElement.style.right = "auto", popupElement.style.bottom = "auto", popupElement.style.overflow = "hidden";
       var targetRect;
       if (Array.isArray(target))
@@ -5506,9 +5755,9 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
       var _scaleX = toNum(Math.round(popupWidth / parseFloat(width2) * 1e3) / 1e3), _scaleY = toNum(Math.round(popupHeight / parseFloat(height2) * 1e3) / 1e3);
       if (_scaleX === 0 || _scaleY === 0 || isDOM(target) && !isVisible(target))
         return;
-      var offset2 = placementInfo.offset, targetOffset2 = placementInfo.targetOffset, _getNumberOffset = getNumberOffset(popupRect, offset2), _getNumberOffset2 = _slicedToArray$1(_getNumberOffset, 2), popupOffsetX = _getNumberOffset2[0], popupOffsetY = _getNumberOffset2[1], _getNumberOffset3 = getNumberOffset(targetRect, targetOffset2), _getNumberOffset4 = _slicedToArray$1(_getNumberOffset3, 2), targetOffsetX = _getNumberOffset4[0], targetOffsetY = _getNumberOffset4[1];
+      var offset2 = placementInfo.offset, targetOffset2 = placementInfo.targetOffset, _getNumberOffset = getNumberOffset(popupRect, offset2), _getNumberOffset2 = _slicedToArray$2(_getNumberOffset, 2), popupOffsetX = _getNumberOffset2[0], popupOffsetY = _getNumberOffset2[1], _getNumberOffset3 = getNumberOffset(targetRect, targetOffset2), _getNumberOffset4 = _slicedToArray$2(_getNumberOffset3, 2), targetOffsetX = _getNumberOffset4[0], targetOffsetY = _getNumberOffset4[1];
       targetRect.x -= targetOffsetX, targetRect.y -= targetOffsetY;
-      var _ref3 = placementInfo.points || [], _ref4 = _slicedToArray$1(_ref3, 2), popupPoint = _ref4[0], targetPoint = _ref4[1], targetPoints = splitPoints(targetPoint), popupPoints = splitPoints(popupPoint), targetAlignPoint = getAlignPoint(targetRect, targetPoints), popupAlignPoint = getAlignPoint(popupRect, popupPoints), nextAlignInfo = _objectSpread2$1({}, placementInfo), nextOffsetX = targetAlignPoint.x - popupAlignPoint.x + popupOffsetX, nextOffsetY = targetAlignPoint.y - popupAlignPoint.y + popupOffsetY, originIntersectionVisibleArea = getIntersectionVisibleArea(nextOffsetX, nextOffsetY), originIntersectionRecommendArea = getIntersectionVisibleArea(nextOffsetX, nextOffsetY, visibleRegionArea), targetAlignPointTL = getAlignPoint(targetRect, ["t", "l"]), popupAlignPointTL = getAlignPoint(popupRect, ["t", "l"]), targetAlignPointBR = getAlignPoint(targetRect, ["b", "r"]), popupAlignPointBR = getAlignPoint(popupRect, ["b", "r"]), overflow = placementInfo.overflow || {}, adjustX = overflow.adjustX, adjustY = overflow.adjustY, shiftX = overflow.shiftX, shiftY = overflow.shiftY, supportAdjust = /* @__PURE__ */ __name(function(val) {
+      var _ref3 = placementInfo.points || [], _ref4 = _slicedToArray$2(_ref3, 2), popupPoint = _ref4[0], targetPoint = _ref4[1], targetPoints = splitPoints(targetPoint), popupPoints = splitPoints(popupPoint), targetAlignPoint = getAlignPoint(targetRect, targetPoints), popupAlignPoint = getAlignPoint(popupRect, popupPoints), nextAlignInfo = _objectSpread2$2({}, placementInfo), nextOffsetX = targetAlignPoint.x - popupAlignPoint.x + popupOffsetX, nextOffsetY = targetAlignPoint.y - popupAlignPoint.y + popupOffsetY, originIntersectionVisibleArea = getIntersectionVisibleArea(nextOffsetX, nextOffsetY), originIntersectionRecommendArea = getIntersectionVisibleArea(nextOffsetX, nextOffsetY, visibleRegionArea), targetAlignPointTL = getAlignPoint(targetRect, ["t", "l"]), popupAlignPointTL = getAlignPoint(popupRect, ["t", "l"]), targetAlignPointBR = getAlignPoint(targetRect, ["b", "r"]), popupAlignPointBR = getAlignPoint(popupRect, ["b", "r"]), overflow = placementInfo.overflow || {}, adjustX = overflow.adjustX, adjustY = overflow.adjustY, shiftX = overflow.shiftX, shiftY = overflow.shiftY, supportAdjust = /* @__PURE__ */ __name(function(val) {
         return typeof val == "boolean" ? val : val >= 0;
       }, "supportAdjust"), nextPopupY, nextPopupBottom, nextPopupX, nextPopupRight;
       syncNextPopupPosition();
@@ -5577,7 +5826,7 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
     });
   }, "triggerAlign"), resetReady = /* @__PURE__ */ __name(function() {
     setOffsetInfo(function(ori) {
-      return _objectSpread2$1(_objectSpread2$1({}, ori), {}, {
+      return _objectSpread2$2(_objectSpread2$2({}, ori), {}, {
         ready: !1
       });
     });
@@ -5614,9 +5863,9 @@ function useWinClick(open, clickToHide, targetEle, popupEle, mask, maskClosable,
   var openRef = React$6.useRef(open);
   openRef.current = open, React$6.useEffect(function() {
     if (clickToHide && popupEle && (!mask || maskClosable)) {
-      var onTriggerClose = /* @__PURE__ */ __name(function(_ref) {
-        var target = _ref.target;
-        openRef.current && !inPopupOrChild(target) && triggerOpen(!1);
+      var onTriggerClose = /* @__PURE__ */ __name(function(e2) {
+        var _e$composedPath;
+        openRef.current && !inPopupOrChild(((_e$composedPath = e2.composedPath) === null || _e$composedPath === void 0 || (_e$composedPath = _e$composedPath.call(e2)) === null || _e$composedPath === void 0 ? void 0 : _e$composedPath[0]) || e2.target) && triggerOpen(!1);
       }, "onTriggerClose2"), win = getWin(popupEle);
       win.addEventListener("mousedown", onTriggerClose, !0), win.addEventListener("contextmenu", onTriggerClose, !0);
       var targetShadowRoot = getShadowRoot(targetEle);
@@ -5630,7 +5879,7 @@ __name(useWinClick, "useWinClick");
 var _excluded$v = ["prefixCls", "children", "action", "showAction", "hideAction", "popupVisible", "defaultPopupVisible", "onPopupVisibleChange", "afterPopupVisibleChange", "mouseEnterDelay", "mouseLeaveDelay", "focusDelay", "blurDelay", "mask", "maskClosable", "getPopupContainer", "forceRender", "autoDestroy", "destroyPopupOnHide", "popup", "popupClassName", "popupStyle", "popupPlacement", "builtinPlacements", "popupAlign", "zIndex", "stretch", "getPopupClassNameFromAlign", "fresh", "alignPoint", "onPopupClick", "onPopupAlign", "arrow", "popupMotion", "maskMotion", "popupTransitionName", "popupAnimation", "maskTransitionName", "maskAnimation", "className", "getTriggerDOMNode"];
 function generateTrigger() {
   var PortalComponent = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : Portal, Trigger2 = /* @__PURE__ */ React$6.forwardRef(function(props, ref) {
-    var _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "rc-trigger-popup" : _props$prefixCls, children = props.children, _props$action = props.action, action = _props$action === void 0 ? "hover" : _props$action, showAction = props.showAction, hideAction = props.hideAction, popupVisible = props.popupVisible, defaultPopupVisible = props.defaultPopupVisible, onPopupVisibleChange = props.onPopupVisibleChange, afterPopupVisibleChange = props.afterPopupVisibleChange, mouseEnterDelay = props.mouseEnterDelay, _props$mouseLeaveDela = props.mouseLeaveDelay, mouseLeaveDelay = _props$mouseLeaveDela === void 0 ? 0.1 : _props$mouseLeaveDela, focusDelay = props.focusDelay, blurDelay = props.blurDelay, mask = props.mask, _props$maskClosable = props.maskClosable, maskClosable = _props$maskClosable === void 0 ? !0 : _props$maskClosable, getPopupContainer = props.getPopupContainer, forceRender = props.forceRender, autoDestroy = props.autoDestroy, destroyPopupOnHide = props.destroyPopupOnHide, popup2 = props.popup, popupClassName = props.popupClassName, popupStyle = props.popupStyle, popupPlacement = props.popupPlacement, _props$builtinPlaceme = props.builtinPlacements, builtinPlacements = _props$builtinPlaceme === void 0 ? {} : _props$builtinPlaceme, popupAlign = props.popupAlign, zIndex = props.zIndex, stretch = props.stretch, getPopupClassNameFromAlign = props.getPopupClassNameFromAlign, fresh = props.fresh, alignPoint = props.alignPoint, onPopupClick = props.onPopupClick, onPopupAlign = props.onPopupAlign, arrow = props.arrow, popupMotion = props.popupMotion, maskMotion = props.maskMotion, popupTransitionName = props.popupTransitionName, popupAnimation = props.popupAnimation, maskTransitionName = props.maskTransitionName, maskAnimation = props.maskAnimation, className = props.className, getTriggerDOMNode = props.getTriggerDOMNode, restProps = _objectWithoutProperties$1(props, _excluded$v), mergedAutoDestroy = autoDestroy || destroyPopupOnHide || !1, _React$useState = React$6.useState(!1), _React$useState2 = _slicedToArray$1(_React$useState, 2), mobile = _React$useState2[0], setMobile = _React$useState2[1];
+    var _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "rc-trigger-popup" : _props$prefixCls, children = props.children, _props$action = props.action, action = _props$action === void 0 ? "hover" : _props$action, showAction = props.showAction, hideAction = props.hideAction, popupVisible = props.popupVisible, defaultPopupVisible = props.defaultPopupVisible, onPopupVisibleChange = props.onPopupVisibleChange, afterPopupVisibleChange = props.afterPopupVisibleChange, mouseEnterDelay = props.mouseEnterDelay, _props$mouseLeaveDela = props.mouseLeaveDelay, mouseLeaveDelay = _props$mouseLeaveDela === void 0 ? 0.1 : _props$mouseLeaveDela, focusDelay = props.focusDelay, blurDelay = props.blurDelay, mask = props.mask, _props$maskClosable = props.maskClosable, maskClosable = _props$maskClosable === void 0 ? !0 : _props$maskClosable, getPopupContainer = props.getPopupContainer, forceRender = props.forceRender, autoDestroy = props.autoDestroy, destroyPopupOnHide = props.destroyPopupOnHide, popup2 = props.popup, popupClassName = props.popupClassName, popupStyle = props.popupStyle, popupPlacement = props.popupPlacement, _props$builtinPlaceme = props.builtinPlacements, builtinPlacements = _props$builtinPlaceme === void 0 ? {} : _props$builtinPlaceme, popupAlign = props.popupAlign, zIndex = props.zIndex, stretch = props.stretch, getPopupClassNameFromAlign = props.getPopupClassNameFromAlign, fresh = props.fresh, alignPoint = props.alignPoint, onPopupClick = props.onPopupClick, onPopupAlign = props.onPopupAlign, arrow = props.arrow, popupMotion = props.popupMotion, maskMotion = props.maskMotion, popupTransitionName = props.popupTransitionName, popupAnimation = props.popupAnimation, maskTransitionName = props.maskTransitionName, maskAnimation = props.maskAnimation, className = props.className, getTriggerDOMNode = props.getTriggerDOMNode, restProps = _objectWithoutProperties$2(props, _excluded$v), mergedAutoDestroy = autoDestroy || destroyPopupOnHide || !1, _React$useState = React$6.useState(!1), _React$useState2 = _slicedToArray$2(_React$useState, 2), mobile = _React$useState2[0], setMobile = _React$useState2[1];
     useLayoutEffect$1(function() {
       setMobile(isMobile());
     }, []);
@@ -5640,16 +5889,16 @@ function generateTrigger() {
           subPopupElements.current[id2] = subPopupEle, parentContext == null || parentContext.registerSubPopup(id2, subPopupEle);
         }, "registerSubPopup")
       };
-    }, [parentContext]), id = useId$1(), _React$useState3 = React$6.useState(null), _React$useState4 = _slicedToArray$1(_React$useState3, 2), popupEle = _React$useState4[0], setPopupEle = _React$useState4[1], externalPopupRef = React$6.useRef(null), setPopupRef = useEvent(function(node) {
+    }, [parentContext]), id = useId$1(), _React$useState3 = React$6.useState(null), _React$useState4 = _slicedToArray$2(_React$useState3, 2), popupEle = _React$useState4[0], setPopupEle = _React$useState4[1], externalPopupRef = React$6.useRef(null), setPopupRef = useEvent(function(node) {
       externalPopupRef.current = node, isDOM(node) && popupEle !== node && setPopupEle(node), parentContext == null || parentContext.registerSubPopup(id, node);
-    }), _React$useState5 = React$6.useState(null), _React$useState6 = _slicedToArray$1(_React$useState5, 2), targetEle = _React$useState6[0], setTargetEle = _React$useState6[1], externalForwardRef = React$6.useRef(null), setTargetRef = useEvent(function(node) {
+    }), _React$useState5 = React$6.useState(null), _React$useState6 = _slicedToArray$2(_React$useState5, 2), targetEle = _React$useState6[0], setTargetEle = _React$useState6[1], externalForwardRef = React$6.useRef(null), setTargetRef = useEvent(function(node) {
       isDOM(node) && targetEle !== node && (setTargetEle(node), externalForwardRef.current = node);
     }), child = React$6.Children.only(children), originChildProps = (child == null ? void 0 : child.props) || {}, cloneProps = {}, inPopupOrChild = useEvent(function(ele) {
       var _getShadowRoot, _getShadowRoot2, childDOM = targetEle;
       return (childDOM == null ? void 0 : childDOM.contains(ele)) || ((_getShadowRoot = getShadowRoot(childDOM)) === null || _getShadowRoot === void 0 ? void 0 : _getShadowRoot.host) === ele || ele === childDOM || (popupEle == null ? void 0 : popupEle.contains(ele)) || ((_getShadowRoot2 = getShadowRoot(popupEle)) === null || _getShadowRoot2 === void 0 ? void 0 : _getShadowRoot2.host) === ele || ele === popupEle || Object.values(subPopupElements.current).some(function(subPopupEle) {
         return (subPopupEle == null ? void 0 : subPopupEle.contains(ele)) || ele === subPopupEle;
       });
-    }), mergePopupMotion = getMotion$1(prefixCls, popupMotion, popupAnimation, popupTransitionName), mergeMaskMotion = getMotion$1(prefixCls, maskMotion, maskAnimation, maskTransitionName), _React$useState7 = React$6.useState(defaultPopupVisible || !1), _React$useState8 = _slicedToArray$1(_React$useState7, 2), internalOpen = _React$useState8[0], setInternalOpen = _React$useState8[1], mergedOpen = popupVisible != null ? popupVisible : internalOpen, setMergedOpen = useEvent(function(nextOpen) {
+    }), mergePopupMotion = getMotion$1(prefixCls, popupMotion, popupAnimation, popupTransitionName), mergeMaskMotion = getMotion$1(prefixCls, maskMotion, maskAnimation, maskTransitionName), _React$useState7 = React$6.useState(defaultPopupVisible || !1), _React$useState8 = _slicedToArray$2(_React$useState7, 2), internalOpen = _React$useState8[0], setInternalOpen = _React$useState8[1], mergedOpen = popupVisible != null ? popupVisible : internalOpen, setMergedOpen = useEvent(function(nextOpen) {
       popupVisible === void 0 && setInternalOpen(nextOpen);
     });
     useLayoutEffect$1(function() {
@@ -5673,13 +5922,13 @@ function generateTrigger() {
     React$6.useEffect(function() {
       return clearDelay;
     }, []);
-    var _React$useState9 = React$6.useState(!1), _React$useState10 = _slicedToArray$1(_React$useState9, 2), inMotion = _React$useState10[0], setInMotion = _React$useState10[1];
+    var _React$useState9 = React$6.useState(!1), _React$useState10 = _slicedToArray$2(_React$useState9, 2), inMotion = _React$useState10[0], setInMotion = _React$useState10[1];
     useLayoutEffect$1(function(firstMount) {
       (!firstMount || mergedOpen) && setInMotion(!0);
     }, [mergedOpen]);
-    var _React$useState11 = React$6.useState(null), _React$useState12 = _slicedToArray$1(_React$useState11, 2), motionPrepareResolve = _React$useState12[0], setMotionPrepareResolve = _React$useState12[1], _React$useState13 = React$6.useState([0, 0]), _React$useState14 = _slicedToArray$1(_React$useState13, 2), mousePos = _React$useState14[0], setMousePos = _React$useState14[1], setMousePosByEvent = /* @__PURE__ */ __name(function(event) {
+    var _React$useState11 = React$6.useState(null), _React$useState12 = _slicedToArray$2(_React$useState11, 2), motionPrepareResolve = _React$useState12[0], setMotionPrepareResolve = _React$useState12[1], _React$useState13 = React$6.useState([0, 0]), _React$useState14 = _slicedToArray$2(_React$useState13, 2), mousePos = _React$useState14[0], setMousePos = _React$useState14[1], setMousePosByEvent = /* @__PURE__ */ __name(function(event) {
       setMousePos([event.clientX, event.clientY]);
-    }, "setMousePosByEvent2"), _useAlign = useAlign(mergedOpen, popupEle, alignPoint ? mousePos : targetEle, popupPlacement, builtinPlacements, popupAlign, onPopupAlign), _useAlign2 = _slicedToArray$1(_useAlign, 11), ready = _useAlign2[0], offsetX = _useAlign2[1], offsetY = _useAlign2[2], offsetR = _useAlign2[3], offsetB = _useAlign2[4], arrowX = _useAlign2[5], arrowY = _useAlign2[6], scaleX = _useAlign2[7], scaleY = _useAlign2[8], alignInfo = _useAlign2[9], onAlign = _useAlign2[10], _useAction = useAction(mobile, action, showAction, hideAction), _useAction2 = _slicedToArray$1(_useAction, 2), showActions = _useAction2[0], hideActions = _useAction2[1], clickToShow = showActions.has("click"), clickToHide = hideActions.has("click") || hideActions.has("contextMenu"), triggerAlign = useEvent(function() {
+    }, "setMousePosByEvent2"), _useAlign = useAlign(mergedOpen, popupEle, alignPoint ? mousePos : targetEle, popupPlacement, builtinPlacements, popupAlign, onPopupAlign), _useAlign2 = _slicedToArray$2(_useAlign, 11), ready = _useAlign2[0], offsetX = _useAlign2[1], offsetY = _useAlign2[2], offsetR = _useAlign2[3], offsetB = _useAlign2[4], arrowX = _useAlign2[5], arrowY = _useAlign2[6], scaleX = _useAlign2[7], scaleY = _useAlign2[8], alignInfo = _useAlign2[9], onAlign = _useAlign2[10], _useAction = useAction(mobile, action, showAction, hideAction), _useAction2 = _slicedToArray$2(_useAction, 2), showActions = _useAction2[0], hideActions = _useAction2[1], clickToShow = showActions.has("click"), clickToHide = hideActions.has("click") || hideActions.has("contextMenu"), triggerAlign = useEvent(function() {
       inMotion || onAlign();
     }), onScroll = /* @__PURE__ */ __name(function() {
       openRef.current && alignPoint && clickToHide && triggerOpen(!1);
@@ -5700,7 +5949,7 @@ function generateTrigger() {
         forceAlign: triggerAlign
       };
     });
-    var _React$useState15 = React$6.useState(0), _React$useState16 = _slicedToArray$1(_React$useState15, 2), targetWidth = _React$useState16[0], setTargetWidth = _React$useState16[1], _React$useState17 = React$6.useState(0), _React$useState18 = _slicedToArray$1(_React$useState17, 2), targetHeight = _React$useState18[0], setTargetHeight = _React$useState18[1], syncTargetSize = /* @__PURE__ */ __name(function() {
+    var _React$useState15 = React$6.useState(0), _React$useState16 = _slicedToArray$2(_React$useState15, 2), targetWidth = _React$useState16[0], setTargetWidth = _React$useState16[1], _React$useState17 = React$6.useState(0), _React$useState18 = _slicedToArray$2(_React$useState17, 2), targetHeight = _React$useState18[0], setTargetHeight = _React$useState18[1], syncTargetSize = /* @__PURE__ */ __name(function() {
       if (stretch && targetEle) {
         var rect = targetEle.getBoundingClientRect();
         setTargetWidth(rect.width), setTargetHeight(rect.height);
@@ -5754,7 +6003,7 @@ function generateTrigger() {
         args[_key3 - 1] = arguments[_key3];
       (_originChildProps$onC2 = originChildProps.onContextMenu) === null || _originChildProps$onC2 === void 0 || _originChildProps$onC2.call.apply(_originChildProps$onC2, [originChildProps, event].concat(args));
     }), className && (cloneProps.className = clsx(originChildProps.className, className));
-    var mergedChildrenProps = _objectSpread2$1(_objectSpread2$1({}, originChildProps), cloneProps), passedProps = {}, passedEventList = ["onContextMenu", "onClick", "onMouseDown", "onTouchStart", "onMouseEnter", "onMouseLeave", "onFocus", "onBlur"];
+    var mergedChildrenProps = _objectSpread2$2(_objectSpread2$2({}, originChildProps), cloneProps), passedProps = {}, passedEventList = ["onContextMenu", "onClick", "onMouseDown", "onTouchStart", "onMouseEnter", "onMouseLeave", "onFocus", "onBlur"];
     passedEventList.forEach(function(eventName) {
       restProps[eventName] && (passedProps[eventName] = function() {
         for (var _mergedChildrenProps$, _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++)
@@ -5762,10 +6011,10 @@ function generateTrigger() {
         (_mergedChildrenProps$ = mergedChildrenProps[eventName]) === null || _mergedChildrenProps$ === void 0 || _mergedChildrenProps$.call.apply(_mergedChildrenProps$, [mergedChildrenProps].concat(args)), restProps[eventName].apply(restProps, args);
       });
     });
-    var triggerNode = /* @__PURE__ */ React$6.cloneElement(child, _objectSpread2$1(_objectSpread2$1({}, mergedChildrenProps), passedProps)), arrowPos = {
+    var triggerNode = /* @__PURE__ */ React$6.cloneElement(child, _objectSpread2$2(_objectSpread2$2({}, mergedChildrenProps), passedProps)), arrowPos = {
       x: arrowX,
       y: arrowY
-    }, innerArrow = arrow ? _objectSpread2$1({}, arrow !== !0 ? arrow : {}) : null;
+    }, innerArrow = arrow ? _objectSpread2$2({}, arrow !== !0 ? arrow : {}) : null;
     return /* @__PURE__ */ React$6.createElement(React$6.Fragment, null, /* @__PURE__ */ React$6.createElement(RefResizeObserver, {
       disabled: !mergedOpen,
       ref: setTargetRef,
@@ -5873,7 +6122,7 @@ function PickerTrigger(_ref) {
     popup: popupElement,
     popupAlign,
     popupVisible: visible,
-    popupClassName: clsx(popupClassName, _defineProperty$b(_defineProperty$b({}, "".concat(dropdownPrefixCls, "-range"), range), "".concat(dropdownPrefixCls, "-rtl"), direction === "rtl")),
+    popupClassName: clsx(popupClassName, _defineProperty$c(_defineProperty$c({}, "".concat(dropdownPrefixCls, "-range"), range), "".concat(dropdownPrefixCls, "-rtl"), direction === "rtl")),
     popupStyle,
     stretch: "minWidth",
     getPopupContainer,
@@ -5937,7 +6186,7 @@ function useCellRender(cellRender, dateRender, monthCellRender, range) {
       return dateRender && info.type === "date" ? dateRender(date, info.today) : monthCellRender && info.type === "month" ? monthCellRender(date, info.locale) : info.originNode;
     };
   }, [cellRender, monthCellRender, dateRender]), onInternalCellRender = React$6.useCallback(function(date, info) {
-    return mergedCellRender(date, _objectSpread2$1(_objectSpread2$1({}, info), {}, {
+    return mergedCellRender(date, _objectSpread2$2(_objectSpread2$2({}, info), {}, {
       range
     }));
   }, [mergedCellRender, range]);
@@ -5945,7 +6194,7 @@ function useCellRender(cellRender, dateRender, monthCellRender, range) {
 }
 __name(useCellRender, "useCellRender");
 function useFieldsInvalidate(calendarValue, isInvalidateDate) {
-  var allowEmpty = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : [], _React$useState = React$6.useState([!1, !1]), _React$useState2 = _slicedToArray$1(_React$useState, 2), fieldsInvalidates = _React$useState2[0], setFieldsInvalidates = _React$useState2[1], onSelectorInvalid = /* @__PURE__ */ __name(function(invalid, index2) {
+  var allowEmpty = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : [], _React$useState = React$6.useState([!1, !1]), _React$useState2 = _slicedToArray$2(_React$useState, 2), fieldsInvalidates = _React$useState2[0], setFieldsInvalidates = _React$useState2[1], onSelectorInvalid = /* @__PURE__ */ __name(function(invalid, index2) {
     setFieldsInvalidates(function(ori) {
       return fillIndex(ori, index2, invalid);
     });
@@ -5969,7 +6218,7 @@ function fillTimeFormat(showHour, showMinute, showSecond, showMillisecond, showM
 __name(fillTimeFormat, "fillTimeFormat");
 function fillLocale(locale, showHour, showMinute, showSecond, showMillisecond, use12Hours) {
   var fieldDateTimeFormat = locale.fieldDateTimeFormat, fieldDateFormat = locale.fieldDateFormat, fieldTimeFormat = locale.fieldTimeFormat, fieldMonthFormat = locale.fieldMonthFormat, fieldYearFormat = locale.fieldYearFormat, fieldWeekFormat = locale.fieldWeekFormat, fieldQuarterFormat = locale.fieldQuarterFormat, yearFormat = locale.yearFormat, cellYearFormat = locale.cellYearFormat, cellQuarterFormat = locale.cellQuarterFormat, dayFormat = locale.dayFormat, cellDateFormat = locale.cellDateFormat, timeFormat = fillTimeFormat(showHour, showMinute, showSecond, showMillisecond, use12Hours);
-  return _objectSpread2$1(_objectSpread2$1({}, locale), {}, {
+  return _objectSpread2$2(_objectSpread2$2({}, locale), {}, {
     fieldDateTimeFormat: fieldDateTimeFormat || "YYYY-MM-DD ".concat(timeFormat),
     fieldDateFormat: fieldDateFormat || "YYYY-MM-DD",
     fieldTimeFormat: fieldTimeFormat || timeFormat,
@@ -6021,7 +6270,7 @@ var showTimeKeys = [
 ];
 function pickTimeProps(props) {
   var timeProps = pickProps(props, showTimeKeys), format2 = props.format, picker = props.picker, propFormat = null;
-  return format2 && (propFormat = format2, Array.isArray(propFormat) && (propFormat = propFormat[0]), propFormat = _typeof$2(propFormat) === "object" ? propFormat.format : propFormat), picker === "time" && (timeProps.format = propFormat), [timeProps, propFormat];
+  return format2 && (propFormat = format2, Array.isArray(propFormat) && (propFormat = propFormat[0]), propFormat = _typeof$3(propFormat) === "object" ? propFormat.format : propFormat), picker === "time" && (timeProps.format = propFormat), [timeProps, propFormat];
 }
 __name(pickTimeProps, "pickTimeProps");
 function isStringFormat(format2) {
@@ -6050,10 +6299,10 @@ function fillShowConfig(hasShowConfig, showHour, showMinute, showSecond, showMil
 }
 __name(fillShowConfig, "fillShowConfig");
 function getTimeProps(componentProps) {
-  var showTime = componentProps.showTime, _pickTimeProps = pickTimeProps(componentProps), _pickTimeProps2 = _slicedToArray$1(_pickTimeProps, 2), pickedProps = _pickTimeProps2[0], propFormat = _pickTimeProps2[1], showTimeConfig = showTime && _typeof$2(showTime) === "object" ? showTime : {}, timeConfig = _objectSpread2$1(_objectSpread2$1({
+  var showTime = componentProps.showTime, _pickTimeProps = pickTimeProps(componentProps), _pickTimeProps2 = _slicedToArray$2(_pickTimeProps, 2), pickedProps = _pickTimeProps2[0], propFormat = _pickTimeProps2[1], showTimeConfig = showTime && _typeof$3(showTime) === "object" ? showTime : {}, timeConfig = _objectSpread2$2(_objectSpread2$2({
     defaultOpenValue: showTimeConfig.defaultOpenValue || showTimeConfig.defaultValue
-  }, pickedProps), showTimeConfig), showMillisecond = timeConfig.showMillisecond, showHour = timeConfig.showHour, showMinute = timeConfig.showMinute, showSecond = timeConfig.showSecond, hasShowConfig = existShowConfig(showHour, showMinute, showSecond, showMillisecond), _fillShowConfig = fillShowConfig(hasShowConfig, showHour, showMinute, showSecond, showMillisecond), _fillShowConfig2 = _slicedToArray$1(_fillShowConfig, 3);
-  return showHour = _fillShowConfig2[0], showMinute = _fillShowConfig2[1], showSecond = _fillShowConfig2[2], [timeConfig, _objectSpread2$1(_objectSpread2$1({}, timeConfig), {}, {
+  }, pickedProps), showTimeConfig), showMillisecond = timeConfig.showMillisecond, showHour = timeConfig.showHour, showMinute = timeConfig.showMinute, showSecond = timeConfig.showSecond, hasShowConfig = existShowConfig(showHour, showMinute, showSecond, showMillisecond), _fillShowConfig = fillShowConfig(hasShowConfig, showHour, showMinute, showSecond, showMillisecond), _fillShowConfig2 = _slicedToArray$2(_fillShowConfig, 3);
+  return showHour = _fillShowConfig2[0], showMinute = _fillShowConfig2[1], showSecond = _fillShowConfig2[2], [timeConfig, _objectSpread2$2(_objectSpread2$2({}, timeConfig), {}, {
     showHour,
     showMinute,
     showSecond,
@@ -6073,10 +6322,10 @@ function fillShowTimeConfig(picker, showTimeFormat, propFormat, timeConfig, loca
     }
     var showHour = pickedProps.showHour, showMinute = pickedProps.showMinute, showSecond = pickedProps.showSecond, showMillisecond = pickedProps.showMillisecond, use12Hours = pickedProps.use12Hours, showMeridiem = checkShow(baselineFormat, ["a", "A", "LT", "LLL", "LTS"], use12Hours), hasShowConfig = existShowConfig(showHour, showMinute, showSecond, showMillisecond);
     hasShowConfig || (showHour = checkShow(baselineFormat, ["H", "h", "k", "LT", "LLL"]), showMinute = checkShow(baselineFormat, ["m", "LT", "LLL"]), showSecond = checkShow(baselineFormat, ["s", "LTS"]), showMillisecond = checkShow(baselineFormat, ["SSS"]));
-    var _fillShowConfig3 = fillShowConfig(hasShowConfig, showHour, showMinute, showSecond, showMillisecond), _fillShowConfig4 = _slicedToArray$1(_fillShowConfig3, 3);
+    var _fillShowConfig3 = fillShowConfig(hasShowConfig, showHour, showMinute, showSecond, showMillisecond), _fillShowConfig4 = _slicedToArray$2(_fillShowConfig3, 3);
     showHour = _fillShowConfig4[0], showMinute = _fillShowConfig4[1], showSecond = _fillShowConfig4[2];
     var timeFormat = showTimeFormat || fillTimeFormat(showHour, showMinute, showSecond, showMillisecond, showMeridiem);
-    return _objectSpread2$1(_objectSpread2$1({}, pickedProps), {}, {
+    return _objectSpread2$2(_objectSpread2$2({}, pickedProps), {}, {
       // Format
       format: timeFormat,
       // Show Config
@@ -6093,7 +6342,7 @@ __name(fillShowTimeConfig, "fillShowTimeConfig");
 function fillClearIcon(prefixCls, allowClear, clearIcon) {
   if (allowClear === !1)
     return null;
-  var config2 = allowClear && _typeof$2(allowClear) === "object" ? allowClear : {};
+  var config2 = allowClear && _typeof$3(allowClear) === "object" ? allowClear : {};
   return config2.clearIcon || clearIcon || /* @__PURE__ */ React$6.createElement("span", {
     className: "".concat(prefixCls, "-clear-btn")
   });
@@ -6214,7 +6463,7 @@ function useDisabledBoundary(generateConfig2, locale, disabledDate, minDate, max
 __name(useDisabledBoundary, "useDisabledBoundary");
 function useFieldFormat(picker, locale, format2) {
   return React$6.useMemo(function() {
-    var rawFormat = getRowFormat(picker, locale, format2), formatList = toArray$1(rawFormat), firstFormat = formatList[0], maskFormat = _typeof$2(firstFormat) === "object" && firstFormat.type === "mask" ? firstFormat.format : null;
+    var rawFormat = getRowFormat(picker, locale, format2), formatList = toArray$1(rawFormat), firstFormat = formatList[0], maskFormat = _typeof$3(firstFormat) === "object" && firstFormat.type === "mask" ? firstFormat.format : null;
     return [
       // Format list
       formatList.map(function(config2) {
@@ -6232,7 +6481,7 @@ function useInputReadOnly(formatList, inputReadOnly, multiple) {
 __name(useInputReadOnly, "useInputReadOnly");
 function useInvalidate(generateConfig2, picker, disabledDate, showTime) {
   var isInvalidate = useEvent(function(date, info) {
-    var outsideInfo = _objectSpread2$1({
+    var outsideInfo = _objectSpread2$2({
       type: picker
     }, info);
     if (delete outsideInfo.activeIndex, // Date object is invalid
@@ -6260,17 +6509,17 @@ function useList(value) {
 }
 __name(useList, "useList");
 function useFilledProps(props, updater) {
-  var generateConfig2 = props.generateConfig, locale = props.locale, _props$picker = props.picker, picker = _props$picker === void 0 ? "date" : _props$picker, _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "rc-picker" : _props$prefixCls, _props$styles = props.styles, styles2 = _props$styles === void 0 ? {} : _props$styles, _props$classNames = props.classNames, classNames = _props$classNames === void 0 ? {} : _props$classNames, _props$order = props.order, order = _props$order === void 0 ? !0 : _props$order, _props$components = props.components, components = _props$components === void 0 ? {} : _props$components, inputRender = props.inputRender, allowClear = props.allowClear, clearIcon = props.clearIcon, needConfirm = props.needConfirm, multiple = props.multiple, format2 = props.format, inputReadOnly = props.inputReadOnly, disabledDate = props.disabledDate, minDate = props.minDate, maxDate = props.maxDate, showTime = props.showTime, value = props.value, defaultValue = props.defaultValue, pickerValue = props.pickerValue, defaultPickerValue = props.defaultPickerValue, values3 = useList(value), defaultValues = useList(defaultValue), pickerValues = useList(pickerValue), defaultPickerValues = useList(defaultPickerValue), internalPicker = picker === "date" && showTime ? "datetime" : picker, multipleInteractivePicker = internalPicker === "time" || internalPicker === "datetime", complexPicker = multipleInteractivePicker || multiple, mergedNeedConfirm = needConfirm != null ? needConfirm : multipleInteractivePicker, _getTimeProps = getTimeProps(props), _getTimeProps2 = _slicedToArray$1(_getTimeProps, 4), timeProps = _getTimeProps2[0], localeTimeProps = _getTimeProps2[1], showTimeFormat = _getTimeProps2[2], propFormat = _getTimeProps2[3], mergedLocale = useLocale(locale, localeTimeProps), mergedShowTime = React$6.useMemo(function() {
+  var generateConfig2 = props.generateConfig, locale = props.locale, _props$picker = props.picker, picker = _props$picker === void 0 ? "date" : _props$picker, _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "rc-picker" : _props$prefixCls, _props$styles = props.styles, styles2 = _props$styles === void 0 ? {} : _props$styles, _props$classNames = props.classNames, classNames = _props$classNames === void 0 ? {} : _props$classNames, _props$order = props.order, order = _props$order === void 0 ? !0 : _props$order, _props$components = props.components, components = _props$components === void 0 ? {} : _props$components, inputRender = props.inputRender, allowClear = props.allowClear, clearIcon = props.clearIcon, needConfirm = props.needConfirm, multiple = props.multiple, format2 = props.format, inputReadOnly = props.inputReadOnly, disabledDate = props.disabledDate, minDate = props.minDate, maxDate = props.maxDate, showTime = props.showTime, value = props.value, defaultValue = props.defaultValue, pickerValue = props.pickerValue, defaultPickerValue = props.defaultPickerValue, values3 = useList(value), defaultValues = useList(defaultValue), pickerValues = useList(pickerValue), defaultPickerValues = useList(defaultPickerValue), internalPicker = picker === "date" && showTime ? "datetime" : picker, multipleInteractivePicker = internalPicker === "time" || internalPicker === "datetime", complexPicker = multipleInteractivePicker || multiple, mergedNeedConfirm = needConfirm != null ? needConfirm : multipleInteractivePicker, _getTimeProps = getTimeProps(props), _getTimeProps2 = _slicedToArray$2(_getTimeProps, 4), timeProps = _getTimeProps2[0], localeTimeProps = _getTimeProps2[1], showTimeFormat = _getTimeProps2[2], propFormat = _getTimeProps2[3], mergedLocale = useLocale(locale, localeTimeProps), mergedShowTime = React$6.useMemo(function() {
     return fillShowTimeConfig(internalPicker, showTimeFormat, propFormat, timeProps, mergedLocale);
   }, [internalPicker, showTimeFormat, propFormat, timeProps, mergedLocale]), filledProps = React$6.useMemo(function() {
-    return _objectSpread2$1(_objectSpread2$1({}, props), {}, {
+    return _objectSpread2$2(_objectSpread2$2({}, props), {}, {
       prefixCls,
       locale: mergedLocale,
       picker,
       styles: styles2,
       classNames,
       order,
-      components: _objectSpread2$1({
+      components: _objectSpread2$2({
         input: inputRender
       }, components),
       clearIcon: fillClearIcon(prefixCls, allowClear, clearIcon),
@@ -6280,8 +6529,8 @@ function useFilledProps(props, updater) {
       pickerValue: pickerValues,
       defaultPickerValue: defaultPickerValues
     }, void 0);
-  }, [props]), _useFieldFormat = useFieldFormat(internalPicker, mergedLocale, format2), _useFieldFormat2 = _slicedToArray$1(_useFieldFormat, 2), formatList = _useFieldFormat2[0], maskFormat = _useFieldFormat2[1], mergedInputReadOnly = useInputReadOnly(formatList, inputReadOnly, multiple), disabledBoundaryDate = useDisabledBoundary(generateConfig2, locale, disabledDate, minDate, maxDate), isInvalidateDate = useInvalidate(generateConfig2, picker, disabledBoundaryDate, mergedShowTime), mergedProps = React$6.useMemo(function() {
-    return _objectSpread2$1(_objectSpread2$1({}, filledProps), {}, {
+  }, [props]), _useFieldFormat = useFieldFormat(internalPicker, mergedLocale, format2), _useFieldFormat2 = _slicedToArray$2(_useFieldFormat, 2), formatList = _useFieldFormat2[0], maskFormat = _useFieldFormat2[1], mergedInputReadOnly = useInputReadOnly(formatList, inputReadOnly, multiple), disabledBoundaryDate = useDisabledBoundary(generateConfig2, locale, disabledDate, minDate, maxDate), isInvalidateDate = useInvalidate(generateConfig2, picker, disabledBoundaryDate, mergedShowTime), mergedProps = React$6.useMemo(function() {
+    return _objectSpread2$2(_objectSpread2$2({}, filledProps), {}, {
       needConfirm: mergedNeedConfirm,
       inputReadOnly: mergedInputReadOnly,
       disabledDate: disabledBoundaryDate
@@ -6293,7 +6542,7 @@ __name(useFilledProps, "useFilledProps");
 function useDelayState(value, defaultValue, onChange) {
   var _useMergedState = useMergedState(defaultValue, {
     value
-  }), _useMergedState2 = _slicedToArray$1(_useMergedState, 2), state = _useMergedState2[0], setState = _useMergedState2[1], nextValueRef = React__default.useRef(value), rafRef = React__default.useRef(), cancelRaf = /* @__PURE__ */ __name(function() {
+  }), _useMergedState2 = _slicedToArray$2(_useMergedState, 2), state = _useMergedState2[0], setState = _useMergedState2[1], nextValueRef = React__default.useRef(value), rafRef = React__default.useRef(), cancelRaf = /* @__PURE__ */ __name(function() {
     wrapperRaf.cancel(rafRef.current);
   }, "cancelRaf"), doUpdate = useEvent(function() {
     setState(nextValueRef.current), onChange && state !== nextValueRef.current && onChange(nextValueRef.current);
@@ -6308,7 +6557,7 @@ __name(useDelayState, "useDelayState");
 function useOpen(open, defaultOpen) {
   var disabledList = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : [], onOpenChange = arguments.length > 3 ? arguments[3] : void 0, mergedOpen = disabledList.every(function(disabled) {
     return disabled;
-  }) ? !1 : open, _useDelayState = useDelayState(mergedOpen, defaultOpen || !1, onOpenChange), _useDelayState2 = _slicedToArray$1(_useDelayState, 2), rafOpen = _useDelayState2[0], setRafOpen = _useDelayState2[1];
+  }) ? !1 : open, _useDelayState = useDelayState(mergedOpen, defaultOpen || !1, onOpenChange), _useDelayState2 = _slicedToArray$2(_useDelayState, 2), rafOpen = _useDelayState2[0], setRafOpen = _useDelayState2[1];
   function setOpen(next) {
     var config2 = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
     (!config2.inherit || rafOpen) && setRafOpen(next, config2.force);
@@ -6357,7 +6606,7 @@ function useLockEffect(condition, callback) {
 }
 __name(useLockEffect, "useLockEffect");
 function useRangeActive(disabled) {
-  var empty = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : [], mergedOpen = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : !1, _React$useState = React$6.useState(0), _React$useState2 = _slicedToArray$1(_React$useState, 2), activeIndex = _React$useState2[0], setActiveIndex = _React$useState2[1], _React$useState3 = React$6.useState(!1), _React$useState4 = _slicedToArray$1(_React$useState3, 2), focused = _React$useState4[0], setFocused = _React$useState4[1], activeListRef = React$6.useRef([]), lastOperationRef = React$6.useRef(null), triggerFocus2 = /* @__PURE__ */ __name(function(nextFocus) {
+  var empty = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : [], mergedOpen = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : !1, _React$useState = React$6.useState(0), _React$useState2 = _slicedToArray$2(_React$useState, 2), activeIndex = _React$useState2[0], setActiveIndex = _React$useState2[1], _React$useState3 = React$6.useState(!1), _React$useState4 = _slicedToArray$2(_React$useState3, 2), focused = _React$useState4[0], setFocused = _React$useState4[1], activeListRef = React$6.useRef([]), lastOperationRef = React$6.useRef(null), triggerFocus2 = /* @__PURE__ */ __name(function(nextFocus) {
     setFocused(nextFocus);
   }, "triggerFocus"), lastOperation = /* @__PURE__ */ __name(function(type2) {
     return type2 && (lastOperationRef.current = type2), lastOperationRef.current;
@@ -6396,15 +6645,15 @@ function useRangePickerValue(generateConfig2, locale, calendarValue, modes, open
   var defaultPickerValue = arguments.length > 8 && arguments[8] !== void 0 ? arguments[8] : EMPTY_LIST$1, pickerValue = arguments.length > 9 && arguments[9] !== void 0 ? arguments[9] : EMPTY_LIST$1, timeDefaultValue = arguments.length > 10 && arguments[10] !== void 0 ? arguments[10] : EMPTY_LIST$1, onPickerValueChange = arguments.length > 11 ? arguments[11] : void 0, minDate = arguments.length > 12 ? arguments[12] : void 0, maxDate = arguments.length > 13 ? arguments[13] : void 0, isTimePicker = pickerMode === "time", mergedActiveIndex = activeIndex || 0, getDefaultPickerValue = /* @__PURE__ */ __name(function(index2) {
     var now = generateConfig2.getNow();
     return isTimePicker && (now = fillTime(generateConfig2, now)), defaultPickerValue[index2] || calendarValue[index2] || now;
-  }, "getDefaultPickerValue"), _pickerValue = _slicedToArray$1(pickerValue, 2), startPickerValue = _pickerValue[0], endPickerValue = _pickerValue[1], _useMergedState = useMergedState(function() {
+  }, "getDefaultPickerValue"), _pickerValue = _slicedToArray$2(pickerValue, 2), startPickerValue = _pickerValue[0], endPickerValue = _pickerValue[1], _useMergedState = useMergedState(function() {
     return getDefaultPickerValue(0);
   }, {
     value: startPickerValue
-  }), _useMergedState2 = _slicedToArray$1(_useMergedState, 2), mergedStartPickerValue = _useMergedState2[0], setStartPickerValue = _useMergedState2[1], _useMergedState3 = useMergedState(function() {
+  }), _useMergedState2 = _slicedToArray$2(_useMergedState, 2), mergedStartPickerValue = _useMergedState2[0], setStartPickerValue = _useMergedState2[1], _useMergedState3 = useMergedState(function() {
     return getDefaultPickerValue(1);
   }, {
     value: endPickerValue
-  }), _useMergedState4 = _slicedToArray$1(_useMergedState3, 2), mergedEndPickerValue = _useMergedState4[0], setEndPickerValue = _useMergedState4[1], currentPickerValue = React$6.useMemo(function() {
+  }), _useMergedState4 = _slicedToArray$2(_useMergedState3, 2), mergedEndPickerValue = _useMergedState4[0], setEndPickerValue = _useMergedState4[1], currentPickerValue = React$6.useMemo(function() {
     var current = [mergedStartPickerValue, mergedEndPickerValue][mergedActiveIndex];
     return isTimePicker ? current : fillTime(generateConfig2, current, timeDefaultValue[mergedActiveIndex]);
   }, [isTimePicker, mergedStartPickerValue, mergedEndPickerValue, mergedActiveIndex, generateConfig2, timeDefaultValue]), setCurrentPickerValue = /* @__PURE__ */ __name(function(nextPickerValue) {
@@ -6436,7 +6685,7 @@ function useRangePickerValue(generateConfig2, locale, calendarValue, modes, open
 }
 __name(useRangePickerValue, "useRangePickerValue");
 function useSyncState(defaultValue, controlledValue) {
-  var valueRef = React$6.useRef(defaultValue), _React$useState = React$6.useState({}), _React$useState2 = _slicedToArray$1(_React$useState, 2), forceUpdate = _React$useState2[1], getter = /* @__PURE__ */ __name(function(useControlledValueFirst) {
+  var valueRef = React$6.useRef(defaultValue), _React$useState = React$6.useState({}), _React$useState2 = _slicedToArray$2(_React$useState, 2), forceUpdate = _React$useState2[1], getter = /* @__PURE__ */ __name(function(useControlledValueFirst) {
     return useControlledValueFirst && controlledValue !== void 0 ? controlledValue : valueRef.current;
   }, "getter"), setter = /* @__PURE__ */ __name(function(nextValue) {
     valueRef.current = nextValue, forceUpdate({});
@@ -6474,7 +6723,7 @@ function orderDates(dates, generateConfig2) {
 }
 __name(orderDates, "orderDates");
 function useCalendarValue(mergedValue) {
-  var _useSyncState = useSyncState(mergedValue), _useSyncState2 = _slicedToArray$1(_useSyncState, 2), calendarValue = _useSyncState2[0], setCalendarValue = _useSyncState2[1], syncWithValue = useEvent(function() {
+  var _useSyncState = useSyncState(mergedValue), _useSyncState2 = _slicedToArray$2(_useSyncState, 2), calendarValue = _useSyncState2[0], setCalendarValue = _useSyncState2[1], syncWithValue = useEvent(function() {
     setCalendarValue(mergedValue);
   });
   return React$6.useEffect(function() {
@@ -6485,12 +6734,12 @@ __name(useCalendarValue, "useCalendarValue");
 function useInnerValue(generateConfig2, locale, formatList, rangeValue, order, defaultValue, value, onCalendarChange, onOk) {
   var _useMergedState = useMergedState(defaultValue, {
     value
-  }), _useMergedState2 = _slicedToArray$1(_useMergedState, 2), innerValue = _useMergedState2[0], setInnerValue = _useMergedState2[1], mergedValue = innerValue || EMPTY_VALUE, _useCalendarValue = useCalendarValue(mergedValue), _useCalendarValue2 = _slicedToArray$1(_useCalendarValue, 2), calendarValue = _useCalendarValue2[0], setCalendarValue = _useCalendarValue2[1], _useUtil = useUtil(generateConfig2, locale, formatList), _useUtil2 = _slicedToArray$1(_useUtil, 2), getDateTexts = _useUtil2[0], isSameDates = _useUtil2[1], triggerCalendarChange = useEvent(function(nextCalendarValues) {
+  }), _useMergedState2 = _slicedToArray$2(_useMergedState, 2), innerValue = _useMergedState2[0], setInnerValue = _useMergedState2[1], mergedValue = innerValue || EMPTY_VALUE, _useCalendarValue = useCalendarValue(mergedValue), _useCalendarValue2 = _slicedToArray$2(_useCalendarValue, 2), calendarValue = _useCalendarValue2[0], setCalendarValue = _useCalendarValue2[1], _useUtil = useUtil(generateConfig2, locale, formatList), _useUtil2 = _slicedToArray$2(_useUtil, 2), getDateTexts = _useUtil2[0], isSameDates = _useUtil2[1], triggerCalendarChange = useEvent(function(nextCalendarValues) {
     var clone = _toConsumableArray$3(nextCalendarValues);
     order && (clone = orderDates(clone.filter(function(date) {
       return date;
     }), generateConfig2));
-    var _isSameDates = isSameDates(calendarValue(), clone), _isSameDates2 = _slicedToArray$1(_isSameDates, 2), isSameMergedDates = _isSameDates2[0], isSameStart = _isSameDates2[1];
+    var _isSameDates = isSameDates(calendarValue(), clone), _isSameDates2 = _slicedToArray$2(_isSameDates, 2), isSameMergedDates = _isSameDates2[0], isSameStart = _isSameDates2[1];
     if (!isSameMergedDates && (setCalendarValue(clone), onCalendarChange)) {
       var cellTexts = getDateTexts(clone);
       onCalendarChange(clone, cellTexts, {
@@ -6506,7 +6755,7 @@ __name(useInnerValue, "useInnerValue");
 function useRangeValue(info, mergedValue, setInnerValue, getCalendarValue, triggerCalendarChange, disabled, formatList, focused, open, isInvalidateDate) {
   var generateConfig2 = info.generateConfig, locale = info.locale, picker = info.picker, onChange = info.onChange, allowEmpty = info.allowEmpty, order = info.order, orderOnChange = disabled.some(function(d2) {
     return d2;
-  }) ? !1 : order, _useUtil3 = useUtil(generateConfig2, locale, formatList), _useUtil4 = _slicedToArray$1(_useUtil3, 2), getDateTexts = _useUtil4[0], isSameDates = _useUtil4[1], _useSyncState3 = useSyncState(mergedValue), _useSyncState4 = _slicedToArray$1(_useSyncState3, 2), submitValue = _useSyncState4[0], setSubmitValue = _useSyncState4[1], syncWithValue = useEvent(function() {
+  }) ? !1 : order, _useUtil3 = useUtil(generateConfig2, locale, formatList), _useUtil4 = _slicedToArray$2(_useUtil3, 2), getDateTexts = _useUtil4[0], isSameDates = _useUtil4[1], _useSyncState3 = useSyncState(mergedValue), _useSyncState4 = _slicedToArray$2(_useSyncState3, 2), submitValue = _useSyncState4[0], setSubmitValue = _useSyncState4[1], syncWithValue = useEvent(function() {
     setSubmitValue(mergedValue);
   });
   React$6.useEffect(function() {
@@ -6518,7 +6767,7 @@ function useRangeValue(info, mergedValue, setInnerValue, getCalendarValue, trigg
       for (var maxLen = Math.max(disabled.length, clone.length), i = 0; i < maxLen; i += 1)
         disabled[i] || (clone[i] = null);
     orderOnChange && clone[0] && clone[1] && (clone = orderDates(clone, generateConfig2)), triggerCalendarChange(clone);
-    var _clone = clone, _clone2 = _slicedToArray$1(_clone, 2), start = _clone2[0], end = _clone2[1], startEmpty = !start, endEmpty = !end, validateEmptyDateRange = allowEmpty ? (
+    var _clone = clone, _clone2 = _slicedToArray$2(_clone, 2), start = _clone2[0], end = _clone2[1], startEmpty = !start, endEmpty = !end, validateEmptyDateRange = allowEmpty ? (
       // Validate empty start
       (!startEmpty || allowEmpty[0]) && // Validate empty end
       (!endEmpty || allowEmpty[1])
@@ -6538,7 +6787,7 @@ function useRangeValue(info, mergedValue, setInnerValue, getCalendarValue, trigg
     );
     if (allPassed) {
       setInnerValue(clone);
-      var _isSameDates3 = isSameDates(clone, mergedValue), _isSameDates4 = _slicedToArray$1(_isSameDates3, 1), isSameMergedDates = _isSameDates4[0];
+      var _isSameDates3 = isSameDates(clone, mergedValue), _isSameDates4 = _slicedToArray$2(_isSameDates3, 1), isSameMergedDates = _isSameDates4[0];
       onChange && !isSameMergedDates && onChange(
         // Return null directly if all date are empty
         isNullValue && clone.every(function(val) {
@@ -6606,9 +6855,9 @@ function useTimeInfo(generateConfig2) {
     return [disabledConfig.disabledHours || disabledHours || emptyDisabled, disabledConfig.disabledMinutes || disabledMinutes || emptyDisabled, disabledConfig.disabledSeconds || disabledSeconds || emptyDisabled, disabledConfig.disabledMilliseconds || emptyDisabled];
   }, [disabledTime, disabledHours, disabledMinutes, disabledSeconds]), _React$useMemo = React$6.useMemo(function() {
     return getDisabledTimes(mergedDate);
-  }, [mergedDate, getDisabledTimes]), _React$useMemo2 = _slicedToArray$1(_React$useMemo, 4), mergedDisabledHours = _React$useMemo2[0], mergedDisabledMinutes = _React$useMemo2[1], mergedDisabledSeconds = _React$useMemo2[2], mergedDisabledMilliseconds = _React$useMemo2[3], getAllUnits = React$6.useCallback(function(getDisabledHours, getDisabledMinutes, getDisabledSeconds, getDisabledMilliseconds) {
+  }, [mergedDate, getDisabledTimes]), _React$useMemo2 = _slicedToArray$2(_React$useMemo, 4), mergedDisabledHours = _React$useMemo2[0], mergedDisabledMinutes = _React$useMemo2[1], mergedDisabledSeconds = _React$useMemo2[2], mergedDisabledMilliseconds = _React$useMemo2[3], getAllUnits = React$6.useCallback(function(getDisabledHours, getDisabledMinutes, getDisabledSeconds, getDisabledMilliseconds) {
     var hours = generateUnits(0, 23, hourStep, hideDisabledOptions, getDisabledHours()), rowHourUnits2 = use12Hours ? hours.map(function(unit) {
-      return _objectSpread2$1(_objectSpread2$1({}, unit), {}, {
+      return _objectSpread2$2(_objectSpread2$2({}, unit), {}, {
         label: leftPad(unit.value % 12 || 12, 2)
       });
     }) : hours, getMinuteUnits2 = /* @__PURE__ */ __name(function(nextHour) {
@@ -6621,12 +6870,12 @@ function useTimeInfo(generateConfig2) {
     return [rowHourUnits2, getMinuteUnits2, getSecondUnits2, getMillisecondUnits2];
   }, [hideDisabledOptions, hourStep, use12Hours, millisecondStep, minuteStep, secondStep]), _React$useMemo3 = React$6.useMemo(function() {
     return getAllUnits(mergedDisabledHours, mergedDisabledMinutes, mergedDisabledSeconds, mergedDisabledMilliseconds);
-  }, [getAllUnits, mergedDisabledHours, mergedDisabledMinutes, mergedDisabledSeconds, mergedDisabledMilliseconds]), _React$useMemo4 = _slicedToArray$1(_React$useMemo3, 4), rowHourUnits = _React$useMemo4[0], getMinuteUnits = _React$useMemo4[1], getSecondUnits = _React$useMemo4[2], getMillisecondUnits = _React$useMemo4[3], getValidTime = /* @__PURE__ */ __name(function(nextTime, certainDate) {
+  }, [getAllUnits, mergedDisabledHours, mergedDisabledMinutes, mergedDisabledSeconds, mergedDisabledMilliseconds]), _React$useMemo4 = _slicedToArray$2(_React$useMemo3, 4), rowHourUnits = _React$useMemo4[0], getMinuteUnits = _React$useMemo4[1], getSecondUnits = _React$useMemo4[2], getMillisecondUnits = _React$useMemo4[3], getValidTime = /* @__PURE__ */ __name(function(nextTime, certainDate) {
     var getCheckHourUnits = /* @__PURE__ */ __name(function() {
       return rowHourUnits;
     }, "getCheckHourUnits2"), getCheckMinuteUnits = getMinuteUnits, getCheckSecondUnits = getSecondUnits, getCheckMillisecondUnits = getMillisecondUnits;
     if (certainDate) {
-      var _getDisabledTimes = getDisabledTimes(certainDate), _getDisabledTimes2 = _slicedToArray$1(_getDisabledTimes, 4), targetDisabledHours = _getDisabledTimes2[0], targetDisabledMinutes = _getDisabledTimes2[1], targetDisabledSeconds = _getDisabledTimes2[2], targetDisabledMilliseconds = _getDisabledTimes2[3], _getAllUnits = getAllUnits(targetDisabledHours, targetDisabledMinutes, targetDisabledSeconds, targetDisabledMilliseconds), _getAllUnits2 = _slicedToArray$1(_getAllUnits, 4), targetRowHourUnits = _getAllUnits2[0], targetGetMinuteUnits = _getAllUnits2[1], targetGetSecondUnits = _getAllUnits2[2], targetGetMillisecondUnits = _getAllUnits2[3];
+      var _getDisabledTimes = getDisabledTimes(certainDate), _getDisabledTimes2 = _slicedToArray$2(_getDisabledTimes, 4), targetDisabledHours = _getDisabledTimes2[0], targetDisabledMinutes = _getDisabledTimes2[1], targetDisabledSeconds = _getDisabledTimes2[2], targetDisabledMilliseconds = _getDisabledTimes2[3], _getAllUnits = getAllUnits(targetDisabledHours, targetDisabledMinutes, targetDisabledSeconds, targetDisabledMilliseconds), _getAllUnits2 = _slicedToArray$2(_getAllUnits, 4), targetRowHourUnits = _getAllUnits2[0], targetGetMinuteUnits = _getAllUnits2[1], targetGetSecondUnits = _getAllUnits2[2], targetGetMillisecondUnits = _getAllUnits2[3];
       getCheckHourUnits = /* @__PURE__ */ __name(function() {
         return targetRowHourUnits;
       }, "getCheckHourUnits2"), getCheckMinuteUnits = targetGetMinuteUnits, getCheckSecondUnits = targetGetSecondUnits, getCheckMillisecondUnits = targetGetMillisecondUnits;
@@ -6646,7 +6895,7 @@ function useTimeInfo(generateConfig2) {
 }
 __name(useTimeInfo, "useTimeInfo");
 function Footer(props) {
-  var mode = props.mode, internalMode = props.internalMode, renderExtraFooter = props.renderExtraFooter, showNow = props.showNow, showTime = props.showTime, onSubmit = props.onSubmit, onNow = props.onNow, invalid = props.invalid, needConfirm = props.needConfirm, generateConfig2 = props.generateConfig, disabledDate = props.disabledDate, _React$useContext = React$6.useContext(PickerContext), prefixCls = _React$useContext.prefixCls, locale = _React$useContext.locale, _React$useContext$but = _React$useContext.button, Button2 = _React$useContext$but === void 0 ? "button" : _React$useContext$but, now = generateConfig2.getNow(), _useTimeInfo = useTimeInfo(generateConfig2, showTime, now), _useTimeInfo2 = _slicedToArray$1(_useTimeInfo, 1), getValidTime = _useTimeInfo2[0], extraNode = renderExtraFooter == null ? void 0 : renderExtraFooter(mode), nowDisabled = disabledDate(now, {
+  var mode = props.mode, internalMode = props.internalMode, renderExtraFooter = props.renderExtraFooter, showNow = props.showNow, showTime = props.showTime, onSubmit = props.onSubmit, onNow = props.onNow, invalid = props.invalid, needConfirm = props.needConfirm, generateConfig2 = props.generateConfig, disabledDate = props.disabledDate, _React$useContext = React$6.useContext(PickerContext), prefixCls = _React$useContext.prefixCls, locale = _React$useContext.locale, _React$useContext$but = _React$useContext.button, Button2 = _React$useContext$but === void 0 ? "button" : _React$useContext$but, now = generateConfig2.getNow(), _useTimeInfo = useTimeInfo(generateConfig2, showTime, now), _useTimeInfo2 = _slicedToArray$2(_useTimeInfo, 1), getValidTime = _useTimeInfo2[0], extraNode = renderExtraFooter == null ? void 0 : renderExtraFooter(mode), nowDisabled = disabledDate(now, {
     type: mode
   }), onInternalNow = /* @__PURE__ */ __name(function() {
     if (!nowDisabled) {
@@ -6730,10 +6979,10 @@ function PanelBody(props) {
         type: type2
       });
       col === 0 && (rowStartDate = currentDate, prefixColumn && rowNode.push(prefixColumn(rowStartDate)));
-      var inRange2 = !1, rangeStart = !1, rangeEnd = !1;
+      var inRange = !1, rangeStart = !1, rangeEnd = !1;
       if (cellSelection && hoverRangeValue) {
-        var _hoverRangeValue = _slicedToArray$1(hoverRangeValue, 2), hoverStart = _hoverRangeValue[0], hoverEnd = _hoverRangeValue[1];
-        inRange2 = isInRange(generateConfig2, hoverStart, hoverEnd, currentDate), rangeStart = isSame(generateConfig2, locale, currentDate, hoverStart, type2), rangeEnd = isSame(generateConfig2, locale, currentDate, hoverEnd, type2);
+        var _hoverRangeValue = _slicedToArray$2(hoverRangeValue, 2), hoverStart = _hoverRangeValue[0], hoverEnd = _hoverRangeValue[1];
+        inRange = isInRange(generateConfig2, hoverStart, hoverEnd, currentDate), rangeStart = isSame(generateConfig2, locale, currentDate, hoverStart, type2), rangeEnd = isSame(generateConfig2, locale, currentDate, hoverEnd, type2);
       }
       var title = titleFormat ? formatValue(currentDate, {
         locale,
@@ -6745,9 +6994,9 @@ function PanelBody(props) {
       rowNode.push(/* @__PURE__ */ React$6.createElement("td", {
         key: col,
         title,
-        className: clsx(cellPrefixCls, _objectSpread2$1(_defineProperty$b(_defineProperty$b(_defineProperty$b(_defineProperty$b(_defineProperty$b(_defineProperty$b({}, "".concat(cellPrefixCls, "-disabled"), disabled), "".concat(cellPrefixCls, "-hover"), (hoverValue || []).some(function(date) {
+        className: clsx(cellPrefixCls, _objectSpread2$2(_defineProperty$c(_defineProperty$c(_defineProperty$c(_defineProperty$c(_defineProperty$c(_defineProperty$c({}, "".concat(cellPrefixCls, "-disabled"), disabled), "".concat(cellPrefixCls, "-hover"), (hoverValue || []).some(function(date) {
           return isSame(generateConfig2, locale, currentDate, date, type2);
-        })), "".concat(cellPrefixCls, "-in-range"), inRange2 && !rangeStart && !rangeEnd), "".concat(cellPrefixCls, "-range-start"), rangeStart), "".concat(cellPrefixCls, "-range-end"), rangeEnd), "".concat(prefixCls, "-cell-selected"), !hoverRangeValue && // WeekPicker use row instead
+        })), "".concat(cellPrefixCls, "-in-range"), inRange && !rangeStart && !rangeEnd), "".concat(cellPrefixCls, "-range-start"), rangeStart), "".concat(cellPrefixCls, "-range-end"), rangeEnd), "".concat(prefixCls, "-cell-selected"), !hoverRangeValue && // WeekPicker use row instead
         type2 !== "week" && matchValues(currentDate)), getCellClassName(currentDate))),
         onClick: /* @__PURE__ */ __name(function() {
           disabled || onSelect2(currentDate);
@@ -6862,13 +7111,13 @@ function PanelHeader(props) {
 }
 __name(PanelHeader, "PanelHeader");
 function DatePanel$1(props) {
-  var prefixCls = props.prefixCls, _props$panelName = props.panelName, panelName = _props$panelName === void 0 ? "date" : _props$panelName, locale = props.locale, generateConfig2 = props.generateConfig, pickerValue = props.pickerValue, onPickerValueChange = props.onPickerValueChange, onModeChange = props.onModeChange, _props$mode = props.mode, mode = _props$mode === void 0 ? "date" : _props$mode, disabledDate = props.disabledDate, onSelect2 = props.onSelect, onHover = props.onHover, showWeek = props.showWeek, panelPrefixCls = "".concat(prefixCls, "-").concat(panelName, "-panel"), cellPrefixCls = "".concat(prefixCls, "-cell"), isWeek = mode === "week", _useInfo = useInfo(props, mode), _useInfo2 = _slicedToArray$1(_useInfo, 2), info = _useInfo2[0], now = _useInfo2[1], weekFirstDay = generateConfig2.locale.getWeekFirstDay(locale.locale), monthStartDate = generateConfig2.setDate(pickerValue, 1), baseDate = getWeekStartDate(locale.locale, generateConfig2, monthStartDate), month = generateConfig2.getMonth(pickerValue), prefixColumn = isWeek || showWeek ? function(date) {
+  var prefixCls = props.prefixCls, _props$panelName = props.panelName, panelName = _props$panelName === void 0 ? "date" : _props$panelName, locale = props.locale, generateConfig2 = props.generateConfig, pickerValue = props.pickerValue, onPickerValueChange = props.onPickerValueChange, onModeChange = props.onModeChange, _props$mode = props.mode, mode = _props$mode === void 0 ? "date" : _props$mode, disabledDate = props.disabledDate, onSelect2 = props.onSelect, onHover = props.onHover, showWeek = props.showWeek, panelPrefixCls = "".concat(prefixCls, "-").concat(panelName, "-panel"), cellPrefixCls = "".concat(prefixCls, "-cell"), isWeek = mode === "week", _useInfo = useInfo(props, mode), _useInfo2 = _slicedToArray$2(_useInfo, 2), info = _useInfo2[0], now = _useInfo2[1], weekFirstDay = generateConfig2.locale.getWeekFirstDay(locale.locale), monthStartDate = generateConfig2.setDate(pickerValue, 1), baseDate = getWeekStartDate(locale.locale, generateConfig2, monthStartDate), month = generateConfig2.getMonth(pickerValue), showPrefixColumn = showWeek === void 0 ? isWeek : showWeek, prefixColumn = showPrefixColumn ? function(date) {
     var disabled = disabledDate == null ? void 0 : disabledDate(date, {
       type: "week"
     });
     return /* @__PURE__ */ React$6.createElement("td", {
       key: "week",
-      className: clsx(cellPrefixCls, "".concat(cellPrefixCls, "-week"), _defineProperty$b({}, "".concat(cellPrefixCls, "-disabled"), disabled)),
+      className: clsx(cellPrefixCls, "".concat(cellPrefixCls, "-week"), _defineProperty$c({}, "".concat(cellPrefixCls, "-disabled"), disabled)),
       onClick: /* @__PURE__ */ __name(function() {
         disabled || onSelect2(date);
       }, "onClick"),
@@ -6899,7 +7148,7 @@ function DatePanel$1(props) {
       generateConfig: generateConfig2
     });
   }, "getCellText"), getCellClassName = /* @__PURE__ */ __name(function(date) {
-    var classObj = _defineProperty$b(_defineProperty$b({}, "".concat(prefixCls, "-cell-in-view"), isSameMonth(generateConfig2, date, pickerValue)), "".concat(prefixCls, "-cell-today"), isSameDate(generateConfig2, date, now));
+    var classObj = _defineProperty$c(_defineProperty$c({}, "".concat(prefixCls, "-cell-in-view"), isSameMonth(generateConfig2, date, pickerValue)), "".concat(prefixCls, "-cell-today"), isSameDate(generateConfig2, date, now));
     return classObj;
   }, "getCellClassName"), monthsLocale = locale.shortMonths || (generateConfig2.locale.getShortMonths ? generateConfig2.locale.getShortMonths(locale.locale) : []), yearNode = /* @__PURE__ */ React$6.createElement("button", {
     type: "button",
@@ -6947,7 +7196,7 @@ function DatePanel$1(props) {
       var clone = generateConfig2.setDate(date, 1);
       return clone = generateConfig2.addMonth(clone, 1), generateConfig2.addDate(clone, -1);
     }, "getEnd")
-  }, monthYearNodes), /* @__PURE__ */ React$6.createElement(PanelBody, _extends$5({
+  }, monthYearNodes), /* @__PURE__ */ React$6.createElement(PanelBody, _extends$6({
     titleFormat: locale.fieldDateFormat
   }, props, {
     colNum: WEEK_DAY_COUNT,
@@ -6997,9 +7246,9 @@ function useScrollTo$1(ulRef, value) {
 __name(useScrollTo$1, "useScrollTo$1");
 var SCROLL_DELAY = 300;
 function TimeColumn(props) {
-  var units = props.units, value = props.value, optionalValue = props.optionalValue, type2 = props.type, onChange = props.onChange, onDblClick = props.onDblClick, changeOnScroll = props.changeOnScroll, _usePanelContext = usePanelContext(), prefixCls = _usePanelContext.prefixCls, cellRender = _usePanelContext.cellRender, now = _usePanelContext.now, locale = _usePanelContext.locale, panelPrefixCls = "".concat(prefixCls, "-time-panel"), cellPrefixCls = "".concat(prefixCls, "-time-panel-cell"), ulRef = React$6.useRef(null), checkDelayRef = React$6.useRef(), clearDelayCheck = /* @__PURE__ */ __name(function() {
+  var units = props.units, value = props.value, optionalValue = props.optionalValue, type2 = props.type, onChange = props.onChange, onHover = props.onHover, onDblClick = props.onDblClick, changeOnScroll = props.changeOnScroll, _usePanelContext = usePanelContext(), prefixCls = _usePanelContext.prefixCls, cellRender = _usePanelContext.cellRender, now = _usePanelContext.now, locale = _usePanelContext.locale, panelPrefixCls = "".concat(prefixCls, "-time-panel"), cellPrefixCls = "".concat(prefixCls, "-time-panel-cell"), ulRef = React$6.useRef(null), checkDelayRef = React$6.useRef(), clearDelayCheck = /* @__PURE__ */ __name(function() {
     clearTimeout(checkDelayRef.current);
-  }, "clearDelayCheck"), _useScrollTo = useScrollTo$1(ulRef, value != null ? value : optionalValue), _useScrollTo2 = _slicedToArray$1(_useScrollTo, 3), syncScroll = _useScrollTo2[0], stopScroll = _useScrollTo2[1], isScrolling = _useScrollTo2[2];
+  }, "clearDelayCheck"), _useScrollTo = useScrollTo$1(ulRef, value != null ? value : optionalValue), _useScrollTo2 = _slicedToArray$2(_useScrollTo, 3), syncScroll = _useScrollTo2[0], stopScroll = _useScrollTo2[1], isScrolling = _useScrollTo2[2];
   useLayoutEffect$1(function() {
     return syncScroll(), clearDelayCheck(), function() {
       stopScroll(), clearDelayCheck();
@@ -7030,13 +7279,19 @@ function TimeColumn(props) {
     }, label);
     return /* @__PURE__ */ React$6.createElement("li", {
       key: unitValue,
-      className: clsx(cellPrefixCls, _defineProperty$b(_defineProperty$b({}, "".concat(cellPrefixCls, "-selected"), value === unitValue), "".concat(cellPrefixCls, "-disabled"), disabled)),
+      className: clsx(cellPrefixCls, _defineProperty$c(_defineProperty$c({}, "".concat(cellPrefixCls, "-selected"), value === unitValue), "".concat(cellPrefixCls, "-disabled"), disabled)),
       onClick: /* @__PURE__ */ __name(function() {
         disabled || onChange(unitValue);
       }, "onClick"),
       onDoubleClick: /* @__PURE__ */ __name(function() {
         !disabled && onDblClick && onDblClick();
       }, "onDoubleClick"),
+      onMouseEnter: /* @__PURE__ */ __name(function() {
+        onHover(unitValue);
+      }, "onMouseEnter"),
+      onMouseLeave: /* @__PURE__ */ __name(function() {
+        onHover(null);
+      }, "onMouseLeave"),
       "data-value": unitValue
     }, cellRender ? cellRender(unitValue, {
       prefixCls,
@@ -7054,10 +7309,10 @@ function isAM(hour) {
 }
 __name(isAM, "isAM");
 function TimePanelBody(props) {
-  var showHour = props.showHour, showMinute = props.showMinute, showSecond = props.showSecond, showMillisecond = props.showMillisecond, showMeridiem = props.use12Hours, changeOnScroll = props.changeOnScroll, _usePanelContext = usePanelContext(), prefixCls = _usePanelContext.prefixCls, values3 = _usePanelContext.values, generateConfig2 = _usePanelContext.generateConfig, locale = _usePanelContext.locale, onSelect2 = _usePanelContext.onSelect, pickerValue = _usePanelContext.pickerValue, value = (values3 == null ? void 0 : values3[0]) || null, _React$useContext = React$6.useContext(PickerHackContext), onCellDblClick = _React$useContext.onCellDblClick, _useTimeInfo = useTimeInfo(generateConfig2, props, value), _useTimeInfo2 = _slicedToArray$1(_useTimeInfo, 5), getValidTime = _useTimeInfo2[0], rowHourUnits = _useTimeInfo2[1], getMinuteUnits = _useTimeInfo2[2], getSecondUnits = _useTimeInfo2[3], getMillisecondUnits = _useTimeInfo2[4], getUnitValue = /* @__PURE__ */ __name(function(func) {
+  var showHour = props.showHour, showMinute = props.showMinute, showSecond = props.showSecond, showMillisecond = props.showMillisecond, showMeridiem = props.use12Hours, changeOnScroll = props.changeOnScroll, _usePanelContext = usePanelContext(), prefixCls = _usePanelContext.prefixCls, values3 = _usePanelContext.values, generateConfig2 = _usePanelContext.generateConfig, locale = _usePanelContext.locale, onSelect2 = _usePanelContext.onSelect, onHover = _usePanelContext.onHover, pickerValue = _usePanelContext.pickerValue, value = (values3 == null ? void 0 : values3[0]) || null, _React$useContext = React$6.useContext(PickerHackContext), onCellDblClick = _React$useContext.onCellDblClick, _useTimeInfo = useTimeInfo(generateConfig2, props, value), _useTimeInfo2 = _slicedToArray$2(_useTimeInfo, 5), getValidTime = _useTimeInfo2[0], rowHourUnits = _useTimeInfo2[1], getMinuteUnits = _useTimeInfo2[2], getSecondUnits = _useTimeInfo2[3], getMillisecondUnits = _useTimeInfo2[4], getUnitValue = /* @__PURE__ */ __name(function(func) {
     var valueUnitVal = value && generateConfig2[func](value), pickerUnitValue = pickerValue && generateConfig2[func](pickerValue);
     return [valueUnitVal, pickerUnitValue];
-  }, "getUnitValue"), _getUnitValue = getUnitValue("getHour"), _getUnitValue2 = _slicedToArray$1(_getUnitValue, 2), hour = _getUnitValue2[0], pickerHour = _getUnitValue2[1], _getUnitValue3 = getUnitValue("getMinute"), _getUnitValue4 = _slicedToArray$1(_getUnitValue3, 2), minute = _getUnitValue4[0], pickerMinute = _getUnitValue4[1], _getUnitValue5 = getUnitValue("getSecond"), _getUnitValue6 = _slicedToArray$1(_getUnitValue5, 2), second = _getUnitValue6[0], pickerSecond = _getUnitValue6[1], _getUnitValue7 = getUnitValue("getMillisecond"), _getUnitValue8 = _slicedToArray$1(_getUnitValue7, 2), millisecond = _getUnitValue8[0], pickerMillisecond = _getUnitValue8[1], meridiem = hour === null ? null : isAM(hour) ? "am" : "pm", hourUnits = React$6.useMemo(function() {
+  }, "getUnitValue"), _getUnitValue = getUnitValue("getHour"), _getUnitValue2 = _slicedToArray$2(_getUnitValue, 2), hour = _getUnitValue2[0], pickerHour = _getUnitValue2[1], _getUnitValue3 = getUnitValue("getMinute"), _getUnitValue4 = _slicedToArray$2(_getUnitValue3, 2), minute = _getUnitValue4[0], pickerMinute = _getUnitValue4[1], _getUnitValue5 = getUnitValue("getSecond"), _getUnitValue6 = _slicedToArray$2(_getUnitValue5, 2), second = _getUnitValue6[0], pickerSecond = _getUnitValue6[1], _getUnitValue7 = getUnitValue("getMillisecond"), _getUnitValue8 = _slicedToArray$2(_getUnitValue7, 2), millisecond = _getUnitValue8[0], pickerMillisecond = _getUnitValue8[1], meridiem = hour === null ? null : isAM(hour) ? "am" : "pm", hourUnits = React$6.useMemo(function() {
     return showMeridiem ? isAM(hour) ? rowHourUnits.filter(function(h2) {
       return isAM(h2.value);
     }) : rowHourUnits.filter(function(h2) {
@@ -7109,56 +7364,83 @@ function TimePanelBody(props) {
       return num != null;
     }, "isNotNull");
     return isNotNull(hour) ? (tmpl = generateConfig2.setHour(tmpl, hour), tmpl = generateConfig2.setMinute(tmpl, minute), tmpl = generateConfig2.setSecond(tmpl, second), tmpl = generateConfig2.setMillisecond(tmpl, millisecond)) : isNotNull(pickerHour) ? (tmpl = generateConfig2.setHour(tmpl, pickerHour), tmpl = generateConfig2.setMinute(tmpl, pickerMinute), tmpl = generateConfig2.setSecond(tmpl, pickerSecond), tmpl = generateConfig2.setMillisecond(tmpl, pickerMillisecond)) : isNotNull(validHour) && (tmpl = generateConfig2.setHour(tmpl, validHour), tmpl = generateConfig2.setMinute(tmpl, validMinute), tmpl = generateConfig2.setSecond(tmpl, validSecond), tmpl = generateConfig2.setMillisecond(tmpl, validMillisecond)), tmpl;
-  }, [value, pickerValue, hour, minute, second, millisecond, validHour, validMinute, validSecond, validMillisecond, pickerHour, pickerMinute, pickerSecond, pickerMillisecond, generateConfig2]), onHourChange = /* @__PURE__ */ __name(function(val) {
-    triggerChange(generateConfig2.setHour(triggerDateTmpl, val));
+  }, [value, pickerValue, hour, minute, second, millisecond, validHour, validMinute, validSecond, validMillisecond, pickerHour, pickerMinute, pickerSecond, pickerMillisecond, generateConfig2]), fillColumnValue = /* @__PURE__ */ __name(function(val, func) {
+    return val === null ? null : generateConfig2[func](triggerDateTmpl, val);
+  }, "fillColumnValue"), getNextHourTime = /* @__PURE__ */ __name(function(val) {
+    return fillColumnValue(val, "setHour");
+  }, "getNextHourTime"), getNextMinuteTime = /* @__PURE__ */ __name(function(val) {
+    return fillColumnValue(val, "setMinute");
+  }, "getNextMinuteTime"), getNextSecondTime = /* @__PURE__ */ __name(function(val) {
+    return fillColumnValue(val, "setSecond");
+  }, "getNextSecondTime"), getNextMillisecondTime = /* @__PURE__ */ __name(function(val) {
+    return fillColumnValue(val, "setMillisecond");
+  }, "getNextMillisecondTime"), getMeridiemTime = /* @__PURE__ */ __name(function(val) {
+    return val === null ? null : val === "am" && !isAM(hour) ? generateConfig2.setHour(triggerDateTmpl, hour - 12) : val === "pm" && isAM(hour) ? generateConfig2.setHour(triggerDateTmpl, hour + 12) : triggerDateTmpl;
+  }, "getMeridiemTime"), onHourChange = /* @__PURE__ */ __name(function(val) {
+    triggerChange(getNextHourTime(val));
   }, "onHourChange"), onMinuteChange = /* @__PURE__ */ __name(function(val) {
-    triggerChange(generateConfig2.setMinute(triggerDateTmpl, val));
+    triggerChange(getNextMinuteTime(val));
   }, "onMinuteChange"), onSecondChange = /* @__PURE__ */ __name(function(val) {
-    triggerChange(generateConfig2.setSecond(triggerDateTmpl, val));
+    triggerChange(getNextSecondTime(val));
   }, "onSecondChange"), onMillisecondChange = /* @__PURE__ */ __name(function(val) {
-    triggerChange(generateConfig2.setMillisecond(triggerDateTmpl, val));
+    triggerChange(getNextMillisecondTime(val));
   }, "onMillisecondChange"), onMeridiemChange = /* @__PURE__ */ __name(function(val) {
-    val === "am" && !isAM(hour) ? triggerChange(generateConfig2.setHour(triggerDateTmpl, hour - 12)) : val === "pm" && isAM(hour) && triggerChange(generateConfig2.setHour(triggerDateTmpl, hour + 12));
-  }, "onMeridiemChange"), sharedColumnProps = {
+    triggerChange(getMeridiemTime(val));
+  }, "onMeridiemChange"), onHourHover = /* @__PURE__ */ __name(function(val) {
+    onHover(getNextHourTime(val));
+  }, "onHourHover"), onMinuteHover = /* @__PURE__ */ __name(function(val) {
+    onHover(getNextMinuteTime(val));
+  }, "onMinuteHover"), onSecondHover = /* @__PURE__ */ __name(function(val) {
+    onHover(getNextSecondTime(val));
+  }, "onSecondHover"), onMillisecondHover = /* @__PURE__ */ __name(function(val) {
+    onHover(getNextMillisecondTime(val));
+  }, "onMillisecondHover"), onMeridiemHover = /* @__PURE__ */ __name(function(val) {
+    onHover(getMeridiemTime(val));
+  }, "onMeridiemHover"), sharedColumnProps = {
     onDblClick: onCellDblClick,
     changeOnScroll
   };
   return /* @__PURE__ */ React$6.createElement("div", {
     className: "".concat(prefixCls, "-content")
-  }, showHour && /* @__PURE__ */ React$6.createElement(TimeColumn, _extends$5({
+  }, showHour && /* @__PURE__ */ React$6.createElement(TimeColumn, _extends$6({
     units: hourUnits,
     value: hour,
     optionalValue: pickerHour,
     type: "hour",
-    onChange: onHourChange
-  }, sharedColumnProps)), showMinute && /* @__PURE__ */ React$6.createElement(TimeColumn, _extends$5({
+    onChange: onHourChange,
+    onHover: onHourHover
+  }, sharedColumnProps)), showMinute && /* @__PURE__ */ React$6.createElement(TimeColumn, _extends$6({
     units: minuteUnits,
     value: minute,
     optionalValue: pickerMinute,
     type: "minute",
-    onChange: onMinuteChange
-  }, sharedColumnProps)), showSecond && /* @__PURE__ */ React$6.createElement(TimeColumn, _extends$5({
+    onChange: onMinuteChange,
+    onHover: onMinuteHover
+  }, sharedColumnProps)), showSecond && /* @__PURE__ */ React$6.createElement(TimeColumn, _extends$6({
     units: secondUnits,
     value: second,
     optionalValue: pickerSecond,
     type: "second",
-    onChange: onSecondChange
-  }, sharedColumnProps)), showMillisecond && /* @__PURE__ */ React$6.createElement(TimeColumn, _extends$5({
+    onChange: onSecondChange,
+    onHover: onSecondHover
+  }, sharedColumnProps)), showMillisecond && /* @__PURE__ */ React$6.createElement(TimeColumn, _extends$6({
     units: millisecondUnits,
     value: millisecond,
     optionalValue: pickerMillisecond,
     type: "millisecond",
-    onChange: onMillisecondChange
-  }, sharedColumnProps)), showMeridiem && /* @__PURE__ */ React$6.createElement(TimeColumn, _extends$5({
+    onChange: onMillisecondChange,
+    onHover: onMillisecondHover
+  }, sharedColumnProps)), showMeridiem && /* @__PURE__ */ React$6.createElement(TimeColumn, _extends$6({
     units: meridiemUnits,
     value: meridiem,
     type: "meridiem",
-    onChange: onMeridiemChange
+    onChange: onMeridiemChange,
+    onHover: onMeridiemHover
   }, sharedColumnProps)));
 }
 __name(TimePanelBody, "TimePanelBody");
 function TimePanel(props) {
-  var prefixCls = props.prefixCls, value = props.value, locale = props.locale, generateConfig2 = props.generateConfig, showTime = props.showTime, _ref = showTime || {}, format2 = _ref.format, panelPrefixCls = "".concat(prefixCls, "-time-panel"), _useInfo = useInfo(props, "time"), _useInfo2 = _slicedToArray$1(_useInfo, 1), info = _useInfo2[0];
+  var prefixCls = props.prefixCls, value = props.value, locale = props.locale, generateConfig2 = props.generateConfig, showTime = props.showTime, _ref = showTime || {}, format2 = _ref.format, panelPrefixCls = "".concat(prefixCls, "-time-panel"), _useInfo = useInfo(props, "time"), _useInfo2 = _slicedToArray$2(_useInfo, 1), info = _useInfo2[0];
   return /* @__PURE__ */ React$6.createElement(PanelContext.Provider, {
     value: info
   }, /* @__PURE__ */ React$6.createElement("div", {
@@ -7171,7 +7453,7 @@ function TimePanel(props) {
 }
 __name(TimePanel, "TimePanel");
 function DateTimePanel(props) {
-  var prefixCls = props.prefixCls, generateConfig2 = props.generateConfig, showTime = props.showTime, onSelect2 = props.onSelect, value = props.value, pickerValue = props.pickerValue, onHover = props.onHover, panelPrefixCls = "".concat(prefixCls, "-datetime-panel"), _useTimeInfo = useTimeInfo(generateConfig2, showTime), _useTimeInfo2 = _slicedToArray$1(_useTimeInfo, 1), getValidTime = _useTimeInfo2[0], mergeTime = /* @__PURE__ */ __name(function(date) {
+  var prefixCls = props.prefixCls, generateConfig2 = props.generateConfig, showTime = props.showTime, onSelect2 = props.onSelect, value = props.value, pickerValue = props.pickerValue, onHover = props.onHover, panelPrefixCls = "".concat(prefixCls, "-datetime-panel"), _useTimeInfo = useTimeInfo(generateConfig2, showTime), _useTimeInfo2 = _slicedToArray$2(_useTimeInfo, 1), getValidTime = _useTimeInfo2[0], mergeTime = /* @__PURE__ */ __name(function(date) {
     return value ? fillTime(generateConfig2, date, value) : fillTime(generateConfig2, date, pickerValue);
   }, "mergeTime"), onDateHover = /* @__PURE__ */ __name(function(date) {
     onHover == null || onHover(date && mergeTime(date));
@@ -7181,14 +7463,14 @@ function DateTimePanel(props) {
   }, "onDateSelect");
   return /* @__PURE__ */ React$6.createElement("div", {
     className: panelPrefixCls
-  }, /* @__PURE__ */ React$6.createElement(DatePanel$1, _extends$5({}, props, {
+  }, /* @__PURE__ */ React$6.createElement(DatePanel$1, _extends$6({}, props, {
     onSelect: onDateSelect,
     onHover: onDateHover
   })), /* @__PURE__ */ React$6.createElement(TimePanel, props));
 }
 __name(DateTimePanel, "DateTimePanel");
 function DecadePanel(props) {
-  var prefixCls = props.prefixCls, locale = props.locale, generateConfig2 = props.generateConfig, pickerValue = props.pickerValue, disabledDate = props.disabledDate, onPickerValueChange = props.onPickerValueChange, panelPrefixCls = "".concat(prefixCls, "-decade-panel"), _useInfo = useInfo(props, "decade"), _useInfo2 = _slicedToArray$1(_useInfo, 1), info = _useInfo2[0], getStartYear = /* @__PURE__ */ __name(function(date) {
+  var prefixCls = props.prefixCls, locale = props.locale, generateConfig2 = props.generateConfig, pickerValue = props.pickerValue, disabledDate = props.disabledDate, onPickerValueChange = props.onPickerValueChange, panelPrefixCls = "".concat(prefixCls, "-decade-panel"), _useInfo = useInfo(props, "decade"), _useInfo2 = _slicedToArray$2(_useInfo, 1), info = _useInfo2[0], getStartYear = /* @__PURE__ */ __name(function(date) {
     var startYear = Math.floor(generateConfig2.getYear(pickerValue) / 100) * 100;
     return generateConfig2.setYear(date, startYear);
   }, "getStartYear"), getEndYear = /* @__PURE__ */ __name(function(date) {
@@ -7208,7 +7490,7 @@ function DecadePanel(props) {
     });
     return "".concat(startYearStr, "-").concat(endYearStr);
   }, "getCellText"), getCellClassName = /* @__PURE__ */ __name(function(date) {
-    return _defineProperty$b({}, "".concat(prefixCls, "-cell-in-view"), isSameDecade(generateConfig2, date, startYearDate) || isSameDecade(generateConfig2, date, endYearDate) || isInRange(generateConfig2, startYearDate, endYearDate, date));
+    return _defineProperty$c({}, "".concat(prefixCls, "-cell-in-view"), isSameDecade(generateConfig2, date, startYearDate) || isSameDecade(generateConfig2, date, endYearDate) || isInRange(generateConfig2, startYearDate, endYearDate, date));
   }, "getCellClassName"), mergedDisabledDate = disabledDate ? function(currentDate, disabledInfo) {
     var baseStartDate = generateConfig2.setDate(currentDate, 1), baseStartMonth = generateConfig2.setMonth(baseStartDate, 0), baseStartYear = generateConfig2.setYear(baseStartMonth, Math.floor(generateConfig2.getYear(baseStartMonth) / 10) * 10), baseEndYear = generateConfig2.addYear(baseStartYear, 10), baseEndDate = generateConfig2.addDate(baseEndYear, -1);
     return disabledDate(baseStartYear, disabledInfo) && disabledDate(baseEndDate, disabledInfo);
@@ -7232,7 +7514,7 @@ function DecadePanel(props) {
     onChange: onPickerValueChange,
     getStart: getStartYear,
     getEnd: getEndYear
-  }, yearNode), /* @__PURE__ */ React$6.createElement(PanelBody, _extends$5({}, props, {
+  }, yearNode), /* @__PURE__ */ React$6.createElement(PanelBody, _extends$6({}, props, {
     disabledDate: mergedDisabledDate,
     colNum: 3,
     rowNum: 4,
@@ -7244,7 +7526,7 @@ function DecadePanel(props) {
 }
 __name(DecadePanel, "DecadePanel");
 function MonthPanel(props) {
-  var prefixCls = props.prefixCls, locale = props.locale, generateConfig2 = props.generateConfig, pickerValue = props.pickerValue, disabledDate = props.disabledDate, onPickerValueChange = props.onPickerValueChange, onModeChange = props.onModeChange, panelPrefixCls = "".concat(prefixCls, "-month-panel"), _useInfo = useInfo(props, "month"), _useInfo2 = _slicedToArray$1(_useInfo, 1), info = _useInfo2[0], baseDate = generateConfig2.setMonth(pickerValue, 0), monthsLocale = locale.shortMonths || (generateConfig2.locale.getShortMonths ? generateConfig2.locale.getShortMonths(locale.locale) : []), getCellDate = /* @__PURE__ */ __name(function(date, offset2) {
+  var prefixCls = props.prefixCls, locale = props.locale, generateConfig2 = props.generateConfig, pickerValue = props.pickerValue, disabledDate = props.disabledDate, onPickerValueChange = props.onPickerValueChange, onModeChange = props.onModeChange, panelPrefixCls = "".concat(prefixCls, "-month-panel"), _useInfo = useInfo(props, "month"), _useInfo2 = _slicedToArray$2(_useInfo, 1), info = _useInfo2[0], baseDate = generateConfig2.setMonth(pickerValue, 0), monthsLocale = locale.shortMonths || (generateConfig2.locale.getShortMonths ? generateConfig2.locale.getShortMonths(locale.locale) : []), getCellDate = /* @__PURE__ */ __name(function(date, offset2) {
     return generateConfig2.addMonth(date, offset2);
   }, "getCellDate"), getCellText = /* @__PURE__ */ __name(function(date) {
     var month = generateConfig2.getMonth(date);
@@ -7254,7 +7536,7 @@ function MonthPanel(props) {
       generateConfig: generateConfig2
     }) : monthsLocale[month];
   }, "getCellText"), getCellClassName = /* @__PURE__ */ __name(function() {
-    return _defineProperty$b({}, "".concat(prefixCls, "-cell-in-view"), !0);
+    return _defineProperty$c({}, "".concat(prefixCls, "-cell-in-view"), !0);
   }, "getCellClassName"), mergedDisabledDate = disabledDate ? function(currentDate, disabledInfo) {
     var startDate = generateConfig2.setDate(currentDate, 1), nextMonthStartDate = generateConfig2.setMonth(startDate, generateConfig2.getMonth(startDate) + 1), endDate = generateConfig2.addDate(nextMonthStartDate, -1);
     return disabledDate(startDate, disabledInfo) && disabledDate(endDate, disabledInfo);
@@ -7287,7 +7569,7 @@ function MonthPanel(props) {
     getEnd: /* @__PURE__ */ __name(function(date) {
       return generateConfig2.setMonth(date, 11);
     }, "getEnd")
-  }, yearNode), /* @__PURE__ */ React$6.createElement(PanelBody, _extends$5({}, props, {
+  }, yearNode), /* @__PURE__ */ React$6.createElement(PanelBody, _extends$6({}, props, {
     disabledDate: mergedDisabledDate,
     titleFormat: locale.fieldMonthFormat,
     colNum: 3,
@@ -7300,7 +7582,7 @@ function MonthPanel(props) {
 }
 __name(MonthPanel, "MonthPanel");
 function QuarterPanel(props) {
-  var prefixCls = props.prefixCls, locale = props.locale, generateConfig2 = props.generateConfig, pickerValue = props.pickerValue, onPickerValueChange = props.onPickerValueChange, onModeChange = props.onModeChange, panelPrefixCls = "".concat(prefixCls, "-quarter-panel"), _useInfo = useInfo(props, "quarter"), _useInfo2 = _slicedToArray$1(_useInfo, 1), info = _useInfo2[0], baseDate = generateConfig2.setMonth(pickerValue, 0), getCellDate = /* @__PURE__ */ __name(function(date, offset2) {
+  var prefixCls = props.prefixCls, locale = props.locale, generateConfig2 = props.generateConfig, pickerValue = props.pickerValue, onPickerValueChange = props.onPickerValueChange, onModeChange = props.onModeChange, panelPrefixCls = "".concat(prefixCls, "-quarter-panel"), _useInfo = useInfo(props, "quarter"), _useInfo2 = _slicedToArray$2(_useInfo, 1), info = _useInfo2[0], baseDate = generateConfig2.setMonth(pickerValue, 0), getCellDate = /* @__PURE__ */ __name(function(date, offset2) {
     return generateConfig2.addMonth(date, offset2 * 3);
   }, "getCellDate"), getCellText = /* @__PURE__ */ __name(function(date) {
     return formatValue(date, {
@@ -7309,7 +7591,7 @@ function QuarterPanel(props) {
       generateConfig: generateConfig2
     });
   }, "getCellText"), getCellClassName = /* @__PURE__ */ __name(function() {
-    return _defineProperty$b({}, "".concat(prefixCls, "-cell-in-view"), !0);
+    return _defineProperty$c({}, "".concat(prefixCls, "-cell-in-view"), !0);
   }, "getCellClassName"), yearNode = /* @__PURE__ */ React$6.createElement("button", {
     type: "button",
     key: "year",
@@ -7339,7 +7621,7 @@ function QuarterPanel(props) {
     getEnd: /* @__PURE__ */ __name(function(date) {
       return generateConfig2.setMonth(date, 11);
     }, "getEnd")
-  }, yearNode), /* @__PURE__ */ React$6.createElement(PanelBody, _extends$5({}, props, {
+  }, yearNode), /* @__PURE__ */ React$6.createElement(PanelBody, _extends$6({}, props, {
     titleFormat: locale.fieldQuarterFormat,
     colNum: 4,
     rowNum: 1,
@@ -7354,19 +7636,19 @@ function WeekPanel(props) {
   var prefixCls = props.prefixCls, generateConfig2 = props.generateConfig, locale = props.locale, value = props.value, hoverValue = props.hoverValue, hoverRangeValue = props.hoverRangeValue, localeName = locale.locale, rowPrefixCls = "".concat(prefixCls, "-week-panel-row"), rowClassName = /* @__PURE__ */ __name(function(currentDate) {
     var rangeCls = {};
     if (hoverRangeValue) {
-      var _hoverRangeValue = _slicedToArray$1(hoverRangeValue, 2), rangeStart = _hoverRangeValue[0], rangeEnd = _hoverRangeValue[1], isRangeStart = isSameWeek(generateConfig2, localeName, rangeStart, currentDate), isRangeEnd = isSameWeek(generateConfig2, localeName, rangeEnd, currentDate);
+      var _hoverRangeValue = _slicedToArray$2(hoverRangeValue, 2), rangeStart = _hoverRangeValue[0], rangeEnd = _hoverRangeValue[1], isRangeStart = isSameWeek(generateConfig2, localeName, rangeStart, currentDate), isRangeEnd = isSameWeek(generateConfig2, localeName, rangeEnd, currentDate);
       rangeCls["".concat(rowPrefixCls, "-range-start")] = isRangeStart, rangeCls["".concat(rowPrefixCls, "-range-end")] = isRangeEnd, rangeCls["".concat(rowPrefixCls, "-range-hover")] = !isRangeStart && !isRangeEnd && isInRange(generateConfig2, rangeStart, rangeEnd, currentDate);
     }
     return hoverValue && (rangeCls["".concat(rowPrefixCls, "-hover")] = hoverValue.some(function(date) {
       return isSameWeek(generateConfig2, localeName, currentDate, date);
     })), clsx(
       rowPrefixCls,
-      _defineProperty$b({}, "".concat(rowPrefixCls, "-selected"), !hoverRangeValue && isSameWeek(generateConfig2, localeName, value, currentDate)),
+      _defineProperty$c({}, "".concat(rowPrefixCls, "-selected"), !hoverRangeValue && isSameWeek(generateConfig2, localeName, value, currentDate)),
       // Patch for hover range
       rangeCls
     );
   }, "rowClassName");
-  return /* @__PURE__ */ React$6.createElement(DatePanel$1, _extends$5({}, props, {
+  return /* @__PURE__ */ React$6.createElement(DatePanel$1, _extends$6({}, props, {
     mode: "week",
     panelName: "week",
     rowClassName
@@ -7374,7 +7656,7 @@ function WeekPanel(props) {
 }
 __name(WeekPanel, "WeekPanel");
 function YearPanel(props) {
-  var prefixCls = props.prefixCls, locale = props.locale, generateConfig2 = props.generateConfig, pickerValue = props.pickerValue, disabledDate = props.disabledDate, onPickerValueChange = props.onPickerValueChange, onModeChange = props.onModeChange, panelPrefixCls = "".concat(prefixCls, "-year-panel"), _useInfo = useInfo(props, "year"), _useInfo2 = _slicedToArray$1(_useInfo, 1), info = _useInfo2[0], getStartYear = /* @__PURE__ */ __name(function(date) {
+  var prefixCls = props.prefixCls, locale = props.locale, generateConfig2 = props.generateConfig, pickerValue = props.pickerValue, disabledDate = props.disabledDate, onPickerValueChange = props.onPickerValueChange, onModeChange = props.onModeChange, panelPrefixCls = "".concat(prefixCls, "-year-panel"), _useInfo = useInfo(props, "year"), _useInfo2 = _slicedToArray$2(_useInfo, 1), info = _useInfo2[0], getStartYear = /* @__PURE__ */ __name(function(date) {
     var startYear = Math.floor(generateConfig2.getYear(pickerValue) / 10) * 10;
     return generateConfig2.setYear(date, startYear);
   }, "getStartYear"), getEndYear = /* @__PURE__ */ __name(function(date) {
@@ -7389,10 +7671,10 @@ function YearPanel(props) {
       generateConfig: generateConfig2
     });
   }, "getCellText"), getCellClassName = /* @__PURE__ */ __name(function(date) {
-    return _defineProperty$b({}, "".concat(prefixCls, "-cell-in-view"), isSameYear(generateConfig2, date, startYearDate) || isSameYear(generateConfig2, date, endYearDate) || isInRange(generateConfig2, startYearDate, endYearDate, date));
+    return _defineProperty$c({}, "".concat(prefixCls, "-cell-in-view"), isSameYear(generateConfig2, date, startYearDate) || isSameYear(generateConfig2, date, endYearDate) || isInRange(generateConfig2, startYearDate, endYearDate, date));
   }, "getCellClassName"), mergedDisabledDate = disabledDate ? function(currentDate, disabledInfo) {
-    var startMonth = generateConfig2.setMonth(currentDate, 0), startDate = generateConfig2.setDate(startMonth, 1), endMonth = generateConfig2.setMonth(currentDate, generateConfig2.getMonth(currentDate) + 1), enDate = generateConfig2.addDate(endMonth, -1);
-    return disabledDate(startDate, disabledInfo) && disabledDate(enDate, disabledInfo);
+    var startMonth = generateConfig2.setMonth(currentDate, 0), startDate = generateConfig2.setDate(startMonth, 1), endMonth = generateConfig2.addYear(startDate, 1), endDate = generateConfig2.addDate(endMonth, -1);
+    return disabledDate(startDate, disabledInfo) && disabledDate(endDate, disabledInfo);
   } : null, yearNode = /* @__PURE__ */ React$6.createElement("button", {
     type: "button",
     key: "decade",
@@ -7422,7 +7704,7 @@ function YearPanel(props) {
     onChange: onPickerValueChange,
     getStart: getStartYear,
     getEnd: getEndYear
-  }, yearNode), /* @__PURE__ */ React$6.createElement(PanelBody, _extends$5({}, props, {
+  }, yearNode), /* @__PURE__ */ React$6.createElement(PanelBody, _extends$6({}, props, {
     disabledDate: mergedDisabledDate,
     titleFormat: locale.fieldYearFormat,
     colNum: 3,
@@ -7451,16 +7733,16 @@ function PickerPanel(props, ref) {
       nativeElement: rootRef.current
     };
   });
-  var _getTimeProps = getTimeProps(props), _getTimeProps2 = _slicedToArray$1(_getTimeProps, 4), timeProps = _getTimeProps2[0], localeTimeProps = _getTimeProps2[1], showTimeFormat = _getTimeProps2[2], propFormat = _getTimeProps2[3], filledLocale = useLocale(locale, localeTimeProps), internalPicker = picker === "date" && showTime ? "datetime" : picker, mergedShowTime = React$6.useMemo(function() {
+  var _getTimeProps = getTimeProps(props), _getTimeProps2 = _slicedToArray$2(_getTimeProps, 4), timeProps = _getTimeProps2[0], localeTimeProps = _getTimeProps2[1], showTimeFormat = _getTimeProps2[2], propFormat = _getTimeProps2[3], filledLocale = useLocale(locale, localeTimeProps), internalPicker = picker === "date" && showTime ? "datetime" : picker, mergedShowTime = React$6.useMemo(function() {
     return fillShowTimeConfig(internalPicker, showTimeFormat, propFormat, timeProps, filledLocale);
   }, [internalPicker, showTimeFormat, propFormat, timeProps, filledLocale]), now = generateConfig2.getNow(), _useMergedState = useMergedState(picker, {
     value: mode,
     postState: /* @__PURE__ */ __name(function(val) {
       return val || "date";
     }, "postState")
-  }), _useMergedState2 = _slicedToArray$1(_useMergedState, 2), mergedMode = _useMergedState2[0], setMergedMode = _useMergedState2[1], internalMode = mergedMode === "date" && mergedShowTime ? "datetime" : mergedMode, toggleDates = useToggleDates(generateConfig2, locale, internalPicker), _useMergedState3 = useMergedState(defaultValue, {
+  }), _useMergedState2 = _slicedToArray$2(_useMergedState, 2), mergedMode = _useMergedState2[0], setMergedMode = _useMergedState2[1], internalMode = mergedMode === "date" && mergedShowTime ? "datetime" : mergedMode, toggleDates = useToggleDates(generateConfig2, locale, internalPicker), _useMergedState3 = useMergedState(defaultValue, {
     value
-  }), _useMergedState4 = _slicedToArray$1(_useMergedState3, 2), innerValue = _useMergedState4[0], setMergedValue = _useMergedState4[1], mergedValue = React$6.useMemo(function() {
+  }), _useMergedState4 = _slicedToArray$2(_useMergedState3, 2), innerValue = _useMergedState4[0], setMergedValue = _useMergedState4[1], mergedValue = React$6.useMemo(function() {
     var values3 = toArray$1(innerValue).filter(function(val) {
       return val;
     });
@@ -7476,7 +7758,7 @@ function PickerPanel(props, ref) {
     }
   }), _useMergedState5 = useMergedState(defaultPickerValue || mergedValue[0] || now, {
     value: pickerValue
-  }), _useMergedState6 = _slicedToArray$1(_useMergedState5, 2), mergedPickerValue = _useMergedState6[0], setInternalPickerValue = _useMergedState6[1];
+  }), _useMergedState6 = _slicedToArray$2(_useMergedState5, 2), mergedPickerValue = _useMergedState6[0], setInternalPickerValue = _useMergedState6[1];
   React$6.useEffect(function() {
     mergedValue[0] && !pickerValue && setInternalPickerValue(mergedValue[0]);
   }, [mergedValue[0]]);
@@ -7499,13 +7781,13 @@ function PickerPanel(props, ref) {
   }, "onPanelValueSelect2"), hoverRangeDate = React$6.useMemo(function() {
     var start, end;
     if (Array.isArray(hoverRangeValue)) {
-      var _hoverRangeValue = _slicedToArray$1(hoverRangeValue, 2);
+      var _hoverRangeValue = _slicedToArray$2(hoverRangeValue, 2);
       start = _hoverRangeValue[0], end = _hoverRangeValue[1];
     } else
       start = hoverRangeValue;
     return !start && !end ? null : (start = start || end, end = end || start, generateConfig2.isAfter(start, end) ? [end, start] : [start, end]);
   }, [hoverRangeValue, generateConfig2]), onInternalCellRender = useCellRender(cellRender, dateRender, monthCellRender), PanelComponent = components[internalMode] || DefaultComponents[internalMode] || DatePanel$1, parentHackContext = React$6.useContext(PickerHackContext), pickerPanelContext = React$6.useMemo(function() {
-    return _objectSpread2$1(_objectSpread2$1({}, parentHackContext), {}, {
+    return _objectSpread2$2(_objectSpread2$2({}, parentHackContext), {}, {
       hideHeader
     });
   }, [parentHackContext, hideHeader]), panelCls = "".concat(mergedPrefixCls, "-panel"), panelProps = pickProps(props, [
@@ -7528,8 +7810,8 @@ function PickerPanel(props, ref) {
   }, /* @__PURE__ */ React$6.createElement("div", {
     ref: rootRef,
     tabIndex,
-    className: clsx(panelCls, _defineProperty$b({}, "".concat(panelCls, "-rtl"), direction === "rtl"))
-  }, /* @__PURE__ */ React$6.createElement(PanelComponent, _extends$5({}, panelProps, {
+    className: clsx(panelCls, _defineProperty$c({}, "".concat(panelCls, "-rtl"), direction === "rtl"))
+  }, /* @__PURE__ */ React$6.createElement(PanelComponent, _extends$6({}, panelProps, {
     // Time
     showTime: mergedShowTime,
     prefixCls: mergedPrefixCls,
@@ -7561,7 +7843,7 @@ function PopupPanel(props) {
     onCellDblClick: /* @__PURE__ */ __name(function() {
       needConfirm && onSubmit();
     }, "onCellDblClick")
-  }, hideHeader = picker === "time", pickerProps = _objectSpread2$1(_objectSpread2$1({}, props), {}, {
+  }, hideHeader = picker === "time", pickerProps = _objectSpread2$2(_objectSpread2$2({}, props), {}, {
     hoverValue: null,
     hoverRangeValue: null,
     hideHeader
@@ -7569,18 +7851,18 @@ function PopupPanel(props) {
   return range ? pickerProps.hoverRangeValue = hoverValue : pickerProps.hoverValue = hoverValue, multiplePanel ? /* @__PURE__ */ React$6.createElement("div", {
     className: "".concat(prefixCls, "-panels")
   }, /* @__PURE__ */ React$6.createElement(PickerHackContext.Provider, {
-    value: _objectSpread2$1(_objectSpread2$1({}, sharedContext), {}, {
+    value: _objectSpread2$2(_objectSpread2$2({}, sharedContext), {}, {
       hideNext: !0
     })
   }, /* @__PURE__ */ React$6.createElement(RefPanelPicker, pickerProps)), /* @__PURE__ */ React$6.createElement(PickerHackContext.Provider, {
-    value: _objectSpread2$1(_objectSpread2$1({}, sharedContext), {}, {
+    value: _objectSpread2$2(_objectSpread2$2({}, sharedContext), {}, {
       hidePrev: !0
     })
-  }, /* @__PURE__ */ React$6.createElement(RefPanelPicker, _extends$5({}, pickerProps, {
+  }, /* @__PURE__ */ React$6.createElement(RefPanelPicker, _extends$6({}, pickerProps, {
     pickerValue: nextPickerValue,
     onPickerValueChange: onSecondPickerValueChange
   })))) : /* @__PURE__ */ React$6.createElement(PickerHackContext.Provider, {
-    value: _objectSpread2$1({}, sharedContext)
+    value: _objectSpread2$2({}, sharedContext)
   }, /* @__PURE__ */ React$6.createElement(RefPanelPicker, pickerProps));
 }
 __name(PopupPanel, "PopupPanel");
@@ -7610,7 +7892,7 @@ function PresetPanel(props) {
 }
 __name(PresetPanel, "PresetPanel");
 function Popup$2(props) {
-  var panelRender = props.panelRender, internalMode = props.internalMode, picker = props.picker, showNow = props.showNow, range = props.range, multiple = props.multiple, _props$activeOffset = props.activeOffset, activeOffset = _props$activeOffset === void 0 ? 0 : _props$activeOffset, placement = props.placement, presets = props.presets, onPresetHover = props.onPresetHover, onPresetSubmit = props.onPresetSubmit, onFocus = props.onFocus, onBlur2 = props.onBlur, onPanelMouseDown = props.onPanelMouseDown, direction = props.direction, value = props.value, onSelect2 = props.onSelect, isInvalid = props.isInvalid, defaultOpenValue = props.defaultOpenValue, onOk = props.onOk, onSubmit = props.onSubmit, _React$useContext = React$6.useContext(PickerContext), prefixCls = _React$useContext.prefixCls, panelPrefixCls = "".concat(prefixCls, "-panel"), rtl = direction === "rtl", arrowRef = React$6.useRef(null), wrapperRef = React$6.useRef(null), _React$useState = React$6.useState(0), _React$useState2 = _slicedToArray$1(_React$useState, 2), containerWidth = _React$useState2[0], setContainerWidth = _React$useState2[1], _React$useState3 = React$6.useState(0), _React$useState4 = _slicedToArray$1(_React$useState3, 2), containerOffset = _React$useState4[0], setContainerOffset = _React$useState4[1], onResize2 = /* @__PURE__ */ __name(function(info) {
+  var panelRender = props.panelRender, internalMode = props.internalMode, picker = props.picker, showNow = props.showNow, range = props.range, multiple = props.multiple, _props$activeOffset = props.activeOffset, activeOffset = _props$activeOffset === void 0 ? 0 : _props$activeOffset, placement = props.placement, presets = props.presets, onPresetHover = props.onPresetHover, onPresetSubmit = props.onPresetSubmit, onFocus = props.onFocus, onBlur2 = props.onBlur, onPanelMouseDown = props.onPanelMouseDown, direction = props.direction, value = props.value, onSelect2 = props.onSelect, isInvalid = props.isInvalid, defaultOpenValue = props.defaultOpenValue, onOk = props.onOk, onSubmit = props.onSubmit, _React$useContext = React$6.useContext(PickerContext), prefixCls = _React$useContext.prefixCls, panelPrefixCls = "".concat(prefixCls, "-panel"), rtl = direction === "rtl", arrowRef = React$6.useRef(null), wrapperRef = React$6.useRef(null), _React$useState = React$6.useState(0), _React$useState2 = _slicedToArray$2(_React$useState, 2), containerWidth = _React$useState2[0], setContainerWidth = _React$useState2[1], _React$useState3 = React$6.useState(0), _React$useState4 = _slicedToArray$2(_React$useState3, 2), containerOffset = _React$useState4[0], setContainerOffset = _React$useState4[1], onResize2 = /* @__PURE__ */ __name(function(info) {
     info.offsetWidth && setContainerWidth(info.offsetWidth);
   }, "onResize");
   React$6.useEffect(function() {
@@ -7642,9 +7924,9 @@ function Popup$2(props) {
     presets,
     onClick: onPresetSubmit,
     onHover: onPresetHover
-  }), /* @__PURE__ */ React$6.createElement("div", null, /* @__PURE__ */ React$6.createElement(PopupPanel, _extends$5({}, props, {
+  }), /* @__PURE__ */ React$6.createElement("div", null, /* @__PURE__ */ React$6.createElement(PopupPanel, _extends$6({}, props, {
     value: popupPanelValue
-  })), /* @__PURE__ */ React$6.createElement(Footer, _extends$5({}, props, {
+  })), /* @__PURE__ */ React$6.createElement(Footer, _extends$6({}, props, {
     showNow: multiple ? !1 : showNow,
     invalid: disableSubmit,
     onSubmit: onFooterSubmit
@@ -7658,7 +7940,7 @@ function Popup$2(props) {
       // Used for Today Button style, safe to remove if no need
       "".concat(prefixCls, "-").concat(internalMode, "-panel-container")
     ),
-    style: _defineProperty$b(_defineProperty$b({}, rtl ? marginRight : marginLeft, containerOffset), rtl ? marginLeft : marginRight, "auto"),
+    style: _defineProperty$c(_defineProperty$c({}, rtl ? marginRight : marginLeft, containerOffset), rtl ? marginLeft : marginRight, "auto"),
     onFocus,
     onBlur: onBlur2
   }, mergedNodes);
@@ -7671,7 +7953,7 @@ function Popup$2(props) {
     }, /* @__PURE__ */ React$6.createElement("div", {
       ref: arrowRef,
       className: "".concat(prefixCls, "-range-arrow"),
-      style: _defineProperty$b({}, offsetUnit, activeOffset)
+      style: _defineProperty$c({}, offsetUnit, activeOffset)
     }), /* @__PURE__ */ React$6.createElement(RefResizeObserver, {
       onResize: onResize2
     }, renderNode));
@@ -7712,7 +7994,7 @@ function useInputProps(props, postProps) {
     var pickedAttrs = pickAttrs(props, {
       aria: !0,
       data: !0
-    }), inputProps = _objectSpread2$1(_objectSpread2$1({}, pickedAttrs), {}, {
+    }), inputProps = _objectSpread2$2(_objectSpread2$2({}, pickedAttrs), {}, {
       // ============== Shared ==============
       format: maskFormat,
       validateFormat: /* @__PURE__ */ __name(function(text) {
@@ -7790,15 +8072,15 @@ function useRootProps(props) {
 __name(useRootProps, "useRootProps");
 var _excluded$u = ["icon", "type"], _excluded2$5 = ["onClear"];
 function Icon$1(props) {
-  var icon = props.icon, type2 = props.type, restProps = _objectWithoutProperties$1(props, _excluded$u), _React$useContext = React$6.useContext(PickerContext), prefixCls = _React$useContext.prefixCls;
-  return icon ? /* @__PURE__ */ React$6.createElement("span", _extends$5({
+  var icon = props.icon, type2 = props.type, restProps = _objectWithoutProperties$2(props, _excluded$u), _React$useContext = React$6.useContext(PickerContext), prefixCls = _React$useContext.prefixCls;
+  return icon ? /* @__PURE__ */ React$6.createElement("span", _extends$6({
     className: "".concat(prefixCls, "-").concat(type2)
   }, restProps), icon) : null;
 }
 __name(Icon$1, "Icon$1");
 function ClearIcon(_ref) {
-  var onClear = _ref.onClear, restProps = _objectWithoutProperties$1(_ref, _excluded2$5);
-  return /* @__PURE__ */ React$6.createElement(Icon$1, _extends$5({}, restProps, {
+  var onClear = _ref.onClear, restProps = _objectWithoutProperties$2(_ref, _excluded2$5);
+  return /* @__PURE__ */ React$6.createElement(Icon$1, _extends$6({}, restProps, {
     type: "clear",
     role: "button",
     onMouseDown: /* @__PURE__ */ __name(function(e2) {
@@ -7812,7 +8094,7 @@ function ClearIcon(_ref) {
 __name(ClearIcon, "ClearIcon");
 var FORMAT_KEYS = ["YYYY", "MM", "DD", "HH", "mm", "ss", "SSS"], REPLACE_KEY = "顧", MaskFormat = /* @__PURE__ */ function() {
   function MaskFormat2(format2) {
-    _classCallCheck$1(this, MaskFormat2), _defineProperty$b(this, "format", void 0), _defineProperty$b(this, "maskFormat", void 0), _defineProperty$b(this, "cells", void 0), _defineProperty$b(this, "maskCells", void 0), this.format = format2;
+    _classCallCheck$2(this, MaskFormat2), _defineProperty$c(this, "format", void 0), _defineProperty$c(this, "maskFormat", void 0), _defineProperty$c(this, "cells", void 0), _defineProperty$c(this, "maskCells", void 0), this.format = format2;
     var replaceKeys = FORMAT_KEYS.map(function(key) {
       return "(".concat(key, ")");
     }).join("|"), replaceReg = new RegExp(replaceKeys, "g");
@@ -7838,7 +8120,7 @@ var FORMAT_KEYS = ["YYYY", "MM", "DD", "HH", "mm", "ss", "SSS"], REPLACE_KEY = "
       return cell.mask;
     });
   }
-  return __name(MaskFormat2, "MaskFormat"), _createClass$1(MaskFormat2, [{
+  return __name(MaskFormat2, "MaskFormat"), _createClass$2(MaskFormat2, [{
     key: "getSelection",
     value: /* @__PURE__ */ __name(function(maskCellIndex) {
       var _ref = this.maskCells[maskCellIndex] || {}, start = _ref.start, end = _ref.end;
@@ -7891,7 +8173,7 @@ __name(getMaskRange, "getMaskRange");
 var _excluded$t = ["active", "showActiveCls", "suffixIcon", "format", "validateFormat", "onChange", "onInput", "helped", "onHelp", "onSubmit", "onKeyDown", "preserveInvalidOnBlur", "invalid", "clearIcon"], Input$3 = /* @__PURE__ */ React$6.forwardRef(function(props, ref) {
   var active = props.active, _props$showActiveCls = props.showActiveCls, showActiveCls = _props$showActiveCls === void 0 ? !0 : _props$showActiveCls, suffixIcon = props.suffixIcon, format2 = props.format, validateFormat = props.validateFormat, onChange = props.onChange;
   props.onInput;
-  var helped = props.helped, onHelp = props.onHelp, onSubmit = props.onSubmit, onKeyDown2 = props.onKeyDown, _props$preserveInvali = props.preserveInvalidOnBlur, preserveInvalidOnBlur = _props$preserveInvali === void 0 ? !1 : _props$preserveInvali, invalid = props.invalid, clearIcon = props.clearIcon, restProps = _objectWithoutProperties$1(props, _excluded$t), value = props.value, onFocus = props.onFocus, onBlur2 = props.onBlur, onMouseUp = props.onMouseUp, _React$useContext = React$6.useContext(PickerContext), prefixCls = _React$useContext.prefixCls, _React$useContext$inp = _React$useContext.input, Component = _React$useContext$inp === void 0 ? "input" : _React$useContext$inp, inputPrefixCls = "".concat(prefixCls, "-input"), _React$useState = React$6.useState(!1), _React$useState2 = _slicedToArray$1(_React$useState, 2), focused = _React$useState2[0], setFocused = _React$useState2[1], _React$useState3 = React$6.useState(value), _React$useState4 = _slicedToArray$1(_React$useState3, 2), internalInputValue = _React$useState4[0], setInputValue = _React$useState4[1], _React$useState5 = React$6.useState(""), _React$useState6 = _slicedToArray$1(_React$useState5, 2), focusCellText = _React$useState6[0], setFocusCellText = _React$useState6[1], _React$useState7 = React$6.useState(null), _React$useState8 = _slicedToArray$1(_React$useState7, 2), focusCellIndex = _React$useState8[0], setFocusCellIndex = _React$useState8[1], _React$useState9 = React$6.useState(null), _React$useState10 = _slicedToArray$1(_React$useState9, 2), forceSelectionSyncMark = _React$useState10[0], forceSelectionSync = _React$useState10[1], inputValue = internalInputValue || "";
+  var helped = props.helped, onHelp = props.onHelp, onSubmit = props.onSubmit, onKeyDown2 = props.onKeyDown, _props$preserveInvali = props.preserveInvalidOnBlur, preserveInvalidOnBlur = _props$preserveInvali === void 0 ? !1 : _props$preserveInvali, invalid = props.invalid, clearIcon = props.clearIcon, restProps = _objectWithoutProperties$2(props, _excluded$t), value = props.value, onFocus = props.onFocus, onBlur2 = props.onBlur, onMouseUp = props.onMouseUp, _React$useContext = React$6.useContext(PickerContext), prefixCls = _React$useContext.prefixCls, _React$useContext$inp = _React$useContext.input, Component = _React$useContext$inp === void 0 ? "input" : _React$useContext$inp, inputPrefixCls = "".concat(prefixCls, "-input"), _React$useState = React$6.useState(!1), _React$useState2 = _slicedToArray$2(_React$useState, 2), focused = _React$useState2[0], setFocused = _React$useState2[1], _React$useState3 = React$6.useState(value), _React$useState4 = _slicedToArray$2(_React$useState3, 2), internalInputValue = _React$useState4[0], setInputValue = _React$useState4[1], _React$useState5 = React$6.useState(""), _React$useState6 = _slicedToArray$2(_React$useState5, 2), focusCellText = _React$useState6[0], setFocusCellText = _React$useState6[1], _React$useState7 = React$6.useState(null), _React$useState8 = _slicedToArray$2(_React$useState7, 2), focusCellIndex = _React$useState8[0], setFocusCellIndex = _React$useState8[1], _React$useState9 = React$6.useState(null), _React$useState10 = _slicedToArray$2(_React$useState9, 2), forceSelectionSyncMark = _React$useState10[0], forceSelectionSync = _React$useState10[1], inputValue = internalInputValue || "";
   React$6.useEffect(function() {
     setInputValue(value);
   }, [value]);
@@ -7912,7 +8194,7 @@ var _excluded$t = ["active", "showActiveCls", "suffixIcon", "format", "validateF
     return new MaskFormat(format2 || "");
   }, [format2]), _React$useMemo = React$6.useMemo(function() {
     return helped ? [0, 0] : maskFormat.getSelection(focusCellIndex);
-  }, [maskFormat, focusCellIndex, helped]), _React$useMemo2 = _slicedToArray$1(_React$useMemo, 2), selectionStart = _React$useMemo2[0], selectionEnd = _React$useMemo2[1], onModify = /* @__PURE__ */ __name(function(text) {
+  }, [maskFormat, focusCellIndex, helped]), _React$useMemo2 = _slicedToArray$2(_React$useMemo, 2), selectionStart = _React$useMemo2[0], selectionEnd = _React$useMemo2[1], onModify = /* @__PURE__ */ __name(function(text) {
     text && text !== format2 && text !== value && onHelp();
   }, "onModify2"), triggerInputChange = useEvent(function(text) {
     validateFormat(text) && onChange(text), setInputValue(text), onModify(text);
@@ -7949,7 +8231,7 @@ var _excluded$t = ["active", "showActiveCls", "suffixIcon", "format", "validateF
         return nextIndex = Math.max(nextIndex, 0), nextIndex = Math.min(nextIndex, maskFormat.size() - 1), nextIndex;
       });
     }, "offsetCellIndex2"), offsetCellValue = /* @__PURE__ */ __name(function(offset2) {
-      var _getMaskRange = getMaskRange(cellFormat), _getMaskRange2 = _slicedToArray$1(_getMaskRange, 3), rangeStart = _getMaskRange2[0], rangeEnd = _getMaskRange2[1], rangeDefault = _getMaskRange2[2], currentText = inputValue.slice(selectionStart, selectionEnd), currentTextNum = Number(currentText);
+      var _getMaskRange = getMaskRange(cellFormat), _getMaskRange2 = _slicedToArray$2(_getMaskRange, 3), rangeStart = _getMaskRange2[0], rangeEnd = _getMaskRange2[1], rangeDefault = _getMaskRange2[2], currentText = inputValue.slice(selectionStart, selectionEnd), currentTextNum = Number(currentText);
       if (isNaN(currentTextNum))
         return String(rangeDefault || (offset2 > 0 ? rangeStart : rangeEnd));
       var num = currentTextNum + offset2, range = rangeEnd - rangeStart + 1;
@@ -8010,8 +8292,8 @@ var _excluded$t = ["active", "showActiveCls", "suffixIcon", "format", "validateF
   } : {};
   return /* @__PURE__ */ React$6.createElement("div", {
     ref: holderRef,
-    className: clsx(inputPrefixCls, _defineProperty$b(_defineProperty$b({}, "".concat(inputPrefixCls, "-active"), active && showActiveCls), "".concat(inputPrefixCls, "-placeholder"), helped))
-  }, /* @__PURE__ */ React$6.createElement(Component, _extends$5({
+    className: clsx(inputPrefixCls, _defineProperty$c(_defineProperty$c({}, "".concat(inputPrefixCls, "-active"), active && showActiveCls), "".concat(inputPrefixCls, "-placeholder"), helped))
+  }, /* @__PURE__ */ React$6.createElement(Component, _extends$6({
     ref: inputRef,
     "aria-invalid": invalid,
     autoComplete: "off"
@@ -8320,7 +8602,7 @@ function SingleSelector$1(props, ref) {
   props.onOpenChange;
   var _onMouseDown = props.onMouseDown;
   props.required, props["aria-required"];
-  var autoFocus = props.autoFocus, removeIcon = props.removeIcon, restProps = _objectWithoutProperties$1(props, _excluded$p), rtl = direction === "rtl", _React$useContext = React$6.useContext(PickerContext), prefixCls = _React$useContext.prefixCls, rootRef = React$6.useRef(), inputRef = React$6.useRef();
+  var autoFocus = props.autoFocus, removeIcon = props.removeIcon, restProps = _objectWithoutProperties$2(props, _excluded$p), rtl = direction === "rtl", _React$useContext = React$6.useContext(PickerContext), prefixCls = _React$useContext.prefixCls, rootRef = React$6.useRef(), inputRef = React$6.useRef();
   React$6.useImperativeHandle(ref, function() {
     return {
       nativeElement: rootRef.current,
@@ -8341,7 +8623,7 @@ function SingleSelector$1(props, ref) {
       return oriDate && !isSame(generateConfig2, locale, oriDate, date, internalPicker);
     });
     onChange(nextValues), open || onSubmit();
-  }, "onMultipleRemove2"), _useInputProps = useInputProps(_objectSpread2$1(_objectSpread2$1({}, props), {}, {
+  }, "onMultipleRemove2"), _useInputProps = useInputProps(_objectSpread2$2(_objectSpread2$2({}, props), {}, {
     onChange: onSingleChange
   }), function(_ref) {
     var valueTexts = _ref.valueTexts;
@@ -8349,7 +8631,7 @@ function SingleSelector$1(props, ref) {
       value: valueTexts[0] || "",
       active: focused
     };
-  }), _useInputProps2 = _slicedToArray$1(_useInputProps, 2), getInputProps = _useInputProps2[0], getText = _useInputProps2[1], showClear = !!(clearIcon && value.length && !disabled), selectorNode = multiple ? /* @__PURE__ */ React$6.createElement(React$6.Fragment, null, /* @__PURE__ */ React$6.createElement(MultipleDates, {
+  }), _useInputProps2 = _slicedToArray$2(_useInputProps, 2), getInputProps = _useInputProps2[0], getText = _useInputProps2[1], showClear = !!(clearIcon && value.length && !disabled), selectorNode = multiple ? /* @__PURE__ */ React$6.createElement(React$6.Fragment, null, /* @__PURE__ */ React$6.createElement(MultipleDates, {
     prefixCls,
     value,
     onRemove: onMultipleRemove,
@@ -8370,7 +8652,7 @@ function SingleSelector$1(props, ref) {
   }), showClear && /* @__PURE__ */ React$6.createElement(ClearIcon, {
     icon: clearIcon,
     onClear
-  })) : /* @__PURE__ */ React$6.createElement(Input$3, _extends$5({
+  })) : /* @__PURE__ */ React$6.createElement(Input$3, _extends$6({
     ref: inputRef
   }, getInputProps(), {
     autoFocus,
@@ -8381,8 +8663,8 @@ function SingleSelector$1(props, ref) {
     }),
     showActiveCls: !1
   }));
-  return /* @__PURE__ */ React$6.createElement("div", _extends$5({}, rootProps, {
-    className: clsx(prefixCls, _defineProperty$b(_defineProperty$b(_defineProperty$b(_defineProperty$b(_defineProperty$b({}, "".concat(prefixCls, "-multiple"), multiple), "".concat(prefixCls, "-focused"), focused), "".concat(prefixCls, "-disabled"), disabled), "".concat(prefixCls, "-invalid"), invalid), "".concat(prefixCls, "-rtl"), rtl), className),
+  return /* @__PURE__ */ React$6.createElement("div", _extends$6({}, rootProps, {
+    className: clsx(prefixCls, _defineProperty$c(_defineProperty$c(_defineProperty$c(_defineProperty$c(_defineProperty$c({}, "".concat(prefixCls, "-multiple"), multiple), "".concat(prefixCls, "-focused"), focused), "".concat(prefixCls, "-disabled"), disabled), "".concat(prefixCls, "-invalid"), invalid), "".concat(prefixCls, "-rtl"), rtl), className),
     style: style2,
     ref: rootRef,
     onClick,
@@ -8395,28 +8677,28 @@ function SingleSelector$1(props, ref) {
 __name(SingleSelector$1, "SingleSelector$1");
 var RefSingleSelector = /* @__PURE__ */ React$6.forwardRef(SingleSelector$1);
 function Picker2(props, ref) {
-  var _useFilledProps = useFilledProps(props), _useFilledProps2 = _slicedToArray$1(_useFilledProps, 6), filledProps = _useFilledProps2[0], internalPicker = _useFilledProps2[1], complexPicker = _useFilledProps2[2], formatList = _useFilledProps2[3], maskFormat = _useFilledProps2[4], isInvalidateDate = _useFilledProps2[5], _ref = filledProps, prefixCls = _ref.prefixCls, styles2 = _ref.styles, classNames = _ref.classNames, order = _ref.order, defaultValue = _ref.defaultValue, value = _ref.value, needConfirm = _ref.needConfirm, onChange = _ref.onChange, onKeyDown2 = _ref.onKeyDown, disabled = _ref.disabled, disabledDate = _ref.disabledDate, minDate = _ref.minDate, maxDate = _ref.maxDate, defaultOpen = _ref.defaultOpen, open = _ref.open, onOpenChange = _ref.onOpenChange, locale = _ref.locale, generateConfig2 = _ref.generateConfig, picker = _ref.picker, showNow = _ref.showNow, showToday = _ref.showToday, showTime = _ref.showTime, mode = _ref.mode, onPanelChange = _ref.onPanelChange, onCalendarChange = _ref.onCalendarChange, onOk = _ref.onOk, multiple = _ref.multiple, defaultPickerValue = _ref.defaultPickerValue, pickerValue = _ref.pickerValue, onPickerValueChange = _ref.onPickerValueChange, inputReadOnly = _ref.inputReadOnly, suffixIcon = _ref.suffixIcon, removeIcon = _ref.removeIcon, onFocus = _ref.onFocus, onBlur2 = _ref.onBlur, presets = _ref.presets, components = _ref.components, cellRender = _ref.cellRender, dateRender = _ref.dateRender, monthCellRender = _ref.monthCellRender, onClick = _ref.onClick, selectorRef = usePickerRef(ref);
+  var _useFilledProps = useFilledProps(props), _useFilledProps2 = _slicedToArray$2(_useFilledProps, 6), filledProps = _useFilledProps2[0], internalPicker = _useFilledProps2[1], complexPicker = _useFilledProps2[2], formatList = _useFilledProps2[3], maskFormat = _useFilledProps2[4], isInvalidateDate = _useFilledProps2[5], _ref = filledProps, prefixCls = _ref.prefixCls, styles2 = _ref.styles, classNames = _ref.classNames, order = _ref.order, defaultValue = _ref.defaultValue, value = _ref.value, needConfirm = _ref.needConfirm, onChange = _ref.onChange, onKeyDown2 = _ref.onKeyDown, disabled = _ref.disabled, disabledDate = _ref.disabledDate, minDate = _ref.minDate, maxDate = _ref.maxDate, defaultOpen = _ref.defaultOpen, open = _ref.open, onOpenChange = _ref.onOpenChange, locale = _ref.locale, generateConfig2 = _ref.generateConfig, picker = _ref.picker, showNow = _ref.showNow, showToday = _ref.showToday, showTime = _ref.showTime, mode = _ref.mode, onPanelChange = _ref.onPanelChange, onCalendarChange = _ref.onCalendarChange, onOk = _ref.onOk, multiple = _ref.multiple, defaultPickerValue = _ref.defaultPickerValue, pickerValue = _ref.pickerValue, onPickerValueChange = _ref.onPickerValueChange, inputReadOnly = _ref.inputReadOnly, suffixIcon = _ref.suffixIcon, removeIcon = _ref.removeIcon, onFocus = _ref.onFocus, onBlur2 = _ref.onBlur, presets = _ref.presets, components = _ref.components, cellRender = _ref.cellRender, dateRender = _ref.dateRender, monthCellRender = _ref.monthCellRender, onClick = _ref.onClick, selectorRef = usePickerRef(ref);
   function pickerParam(values3) {
     return values3 === null ? null : multiple ? values3 : values3[0];
   }
   __name(pickerParam, "pickerParam");
-  var toggleDates = useToggleDates(generateConfig2, locale, internalPicker), _useOpen = useOpen(open, defaultOpen, [disabled], onOpenChange), _useOpen2 = _slicedToArray$1(_useOpen, 2), mergedOpen = _useOpen2[0], triggerOpen = _useOpen2[1], onInternalCalendarChange = /* @__PURE__ */ __name(function(dates, dateStrings, info) {
+  var toggleDates = useToggleDates(generateConfig2, locale, internalPicker), _useOpen = useOpen(open, defaultOpen, [disabled], onOpenChange), _useOpen2 = _slicedToArray$2(_useOpen, 2), mergedOpen = _useOpen2[0], triggerOpen = _useOpen2[1], onInternalCalendarChange = /* @__PURE__ */ __name(function(dates, dateStrings, info) {
     if (onCalendarChange) {
-      var filteredInfo = _objectSpread2$1({}, info);
+      var filteredInfo = _objectSpread2$2({}, info);
       delete filteredInfo.range, onCalendarChange(pickerParam(dates), pickerParam(dateStrings), filteredInfo);
     }
   }, "onInternalCalendarChange2"), onInternalOk = /* @__PURE__ */ __name(function(dates) {
     onOk == null || onOk(pickerParam(dates));
-  }, "onInternalOk2"), _useInnerValue = useInnerValue(generateConfig2, locale, formatList, !1, order, defaultValue, value, onInternalCalendarChange, onInternalOk), _useInnerValue2 = _slicedToArray$1(_useInnerValue, 5), mergedValue = _useInnerValue2[0], setInnerValue = _useInnerValue2[1], getCalendarValue = _useInnerValue2[2], triggerCalendarChange = _useInnerValue2[3], triggerOk = _useInnerValue2[4], calendarValue = getCalendarValue(), _useRangeActive = useRangeActive([disabled]), _useRangeActive2 = _slicedToArray$1(_useRangeActive, 4), focused = _useRangeActive2[0], triggerFocus2 = _useRangeActive2[1], lastOperation = _useRangeActive2[2], activeIndex = _useRangeActive2[3], onSharedFocus = /* @__PURE__ */ __name(function(event) {
+  }, "onInternalOk2"), _useInnerValue = useInnerValue(generateConfig2, locale, formatList, !1, order, defaultValue, value, onInternalCalendarChange, onInternalOk), _useInnerValue2 = _slicedToArray$2(_useInnerValue, 5), mergedValue = _useInnerValue2[0], setInnerValue = _useInnerValue2[1], getCalendarValue = _useInnerValue2[2], triggerCalendarChange = _useInnerValue2[3], triggerOk = _useInnerValue2[4], calendarValue = getCalendarValue(), _useRangeActive = useRangeActive([disabled]), _useRangeActive2 = _slicedToArray$2(_useRangeActive, 4), focused = _useRangeActive2[0], triggerFocus2 = _useRangeActive2[1], lastOperation = _useRangeActive2[2], activeIndex = _useRangeActive2[3], onSharedFocus = /* @__PURE__ */ __name(function(event) {
     triggerFocus2(!0), onFocus == null || onFocus(event, {});
   }, "onSharedFocus2"), onSharedBlur = /* @__PURE__ */ __name(function(event) {
     triggerFocus2(!1), onBlur2 == null || onBlur2(event, {});
   }, "onSharedBlur2"), _useMergedState = useMergedState(picker, {
     value: mode
-  }), _useMergedState2 = _slicedToArray$1(_useMergedState, 2), mergedMode = _useMergedState2[0], setMode = _useMergedState2[1], internalMode = mergedMode === "date" && showTime ? "datetime" : mergedMode, mergedShowNow = useShowNow(picker, mergedMode, showNow, showToday), onInternalChange = onChange && function(dates, dateStrings) {
+  }), _useMergedState2 = _slicedToArray$2(_useMergedState, 2), mergedMode = _useMergedState2[0], setMode = _useMergedState2[1], internalMode = mergedMode === "date" && showTime ? "datetime" : mergedMode, mergedShowNow = useShowNow(picker, mergedMode, showNow, showToday), onInternalChange = onChange && function(dates, dateStrings) {
     onChange(pickerParam(dates), pickerParam(dateStrings));
   }, _useRangeValue = useRangeValue(
-    _objectSpread2$1(_objectSpread2$1({}, filledProps), {}, {
+    _objectSpread2$2(_objectSpread2$2({}, filledProps), {}, {
       onChange: onInternalChange
     }),
     mergedValue,
@@ -8429,13 +8711,13 @@ function Picker2(props, ref) {
     focused,
     mergedOpen,
     isInvalidateDate
-  ), _useRangeValue2 = _slicedToArray$1(_useRangeValue, 2), triggerSubmitChange = _useRangeValue2[1], _useFieldsInvalidate = useFieldsInvalidate(calendarValue, isInvalidateDate), _useFieldsInvalidate2 = _slicedToArray$1(_useFieldsInvalidate, 2), submitInvalidates = _useFieldsInvalidate2[0], onSelectorInvalid = _useFieldsInvalidate2[1], submitInvalidate = React$6.useMemo(function() {
+  ), _useRangeValue2 = _slicedToArray$2(_useRangeValue, 2), triggerSubmitChange = _useRangeValue2[1], _useFieldsInvalidate = useFieldsInvalidate(calendarValue, isInvalidateDate), _useFieldsInvalidate2 = _slicedToArray$2(_useFieldsInvalidate, 2), submitInvalidates = _useFieldsInvalidate2[0], onSelectorInvalid = _useFieldsInvalidate2[1], submitInvalidate = React$6.useMemo(function() {
     return submitInvalidates.some(function(invalidated) {
       return invalidated;
     });
   }, [submitInvalidates]), onInternalPickerValueChange = /* @__PURE__ */ __name(function(dates, info) {
     if (onPickerValueChange) {
-      var cleanInfo = _objectSpread2$1(_objectSpread2$1({}, info), {}, {
+      var cleanInfo = _objectSpread2$2(_objectSpread2$2({}, info), {}, {
         mode: info.mode[0]
       });
       delete cleanInfo.range, onPickerValueChange(dates[0], cleanInfo);
@@ -8456,7 +8738,7 @@ function Picker2(props, ref) {
     onInternalPickerValueChange,
     minDate,
     maxDate
-  ), _useRangePickerValue2 = _slicedToArray$1(_useRangePickerValue, 2), currentPickerValue = _useRangePickerValue2[0], setCurrentPickerValue = _useRangePickerValue2[1], triggerModeChange = useEvent(function(nextPickerValue, nextMode, triggerEvent) {
+  ), _useRangePickerValue2 = _slicedToArray$2(_useRangePickerValue, 2), currentPickerValue = _useRangePickerValue2[0], setCurrentPickerValue = _useRangePickerValue2[1], triggerModeChange = useEvent(function(nextPickerValue, nextMode, triggerEvent) {
     if (setMode(nextMode), onPanelChange && triggerEvent !== !1) {
       var lastPickerValue = nextPickerValue || calendarValue[calendarValue.length - 1];
       onPanelChange(lastPickerValue, nextMode);
@@ -8471,7 +8753,7 @@ function Picker2(props, ref) {
     triggerSubmitChange(null), triggerOpen(!1, {
       force: !0
     });
-  }, "onSelectorClear2"), _React$useState = React$6.useState(null), _React$useState2 = _slicedToArray$1(_React$useState, 2), hoverSource = _React$useState2[0], setHoverSource = _React$useState2[1], _React$useState3 = React$6.useState(null), _React$useState4 = _slicedToArray$1(_React$useState3, 2), internalHoverValue = _React$useState4[0], setInternalHoverValue = _React$useState4[1], hoverValues = React$6.useMemo(function() {
+  }, "onSelectorClear2"), _React$useState = React$6.useState(null), _React$useState2 = _slicedToArray$2(_React$useState, 2), hoverSource = _React$useState2[0], setHoverSource = _React$useState2[1], _React$useState3 = React$6.useState(null), _React$useState4 = _slicedToArray$2(_React$useState3, 2), internalHoverValue = _React$useState4[0], setInternalHoverValue = _React$useState4[1], hoverValues = React$6.useMemo(function() {
     var values3 = [internalHoverValue].concat(_toConsumableArray$3(calendarValue)).filter(function(date) {
       return date;
     });
@@ -8505,10 +8787,10 @@ function Picker2(props, ref) {
     triggerOpen(!1);
   }, "onPopupClose2"), onInternalCellRender = useCellRender(cellRender, dateRender, monthCellRender), panelProps = React$6.useMemo(function() {
     var domProps = pickAttrs(filledProps, !1), restProps = omit$2(filledProps, [].concat(_toConsumableArray$3(Object.keys(domProps)), ["onChange", "onCalendarChange", "style", "className", "onPanelChange"]));
-    return _objectSpread2$1(_objectSpread2$1({}, restProps), {}, {
+    return _objectSpread2$2(_objectSpread2$2({}, restProps), {}, {
       multiple: filledProps.multiple
     });
-  }, [filledProps]), panel = /* @__PURE__ */ React$6.createElement(Popup$2, _extends$5({}, panelProps, {
+  }, [filledProps]), panel = /* @__PURE__ */ React$6.createElement(Popup$2, _extends$6({}, panelProps, {
     showNow: mergedShowNow,
     showTime,
     disabledDate,
@@ -8564,7 +8846,7 @@ function Picker2(props, ref) {
     !mergedOpen && lastOp === "input" && (triggerOpen(!1), triggerConfirm()), !mergedOpen && complexPicker && !needConfirm && lastOp === "panel" && (triggerOpen(!0), triggerConfirm());
   }, [mergedOpen]), /* @__PURE__ */ React$6.createElement(PickerContext.Provider, {
     value: context
-  }, /* @__PURE__ */ React$6.createElement(PickerTrigger, _extends$5({}, pickTriggerProps(filledProps), {
+  }, /* @__PURE__ */ React$6.createElement(PickerTrigger, _extends$6({}, pickTriggerProps(filledProps), {
     popupElement: panel,
     popupStyle: styles2.popup,
     popupClassName: classNames.popup,
@@ -8572,7 +8854,7 @@ function Picker2(props, ref) {
     onClose: onPopupClose
   }), /* @__PURE__ */ React$6.createElement(
     RefSingleSelector,
-    _extends$5({}, filledProps, {
+    _extends$6({}, filledProps, {
       // Ref
       ref: selectorRef,
       suffixIcon,
@@ -8604,7 +8886,7 @@ function Picker2(props, ref) {
   )));
 }
 __name(Picker2, "Picker");
-var RefPicker = /* @__PURE__ */ React$6.forwardRef(Picker2), dayjs = {}, interopRequireDefault = { exports: {} };
+var RefPicker = /* @__PURE__ */ React$6.forwardRef(Picker2), dayjs = {}, interopRequireDefault$1 = { exports: {} };
 (function(module) {
   function _interopRequireDefault2(e2) {
     return e2 && e2.__esModule ? e2 : {
@@ -8612,8 +8894,8 @@ var RefPicker = /* @__PURE__ */ React$6.forwardRef(Picker2), dayjs = {}, interop
     };
   }
   __name(_interopRequireDefault2, "_interopRequireDefault"), module.exports = _interopRequireDefault2, module.exports.__esModule = !0, module.exports.default = module.exports;
-})(interopRequireDefault);
-var interopRequireDefaultExports = interopRequireDefault.exports, warning$1 = {};
+})(interopRequireDefault$1);
+var interopRequireDefaultExports$1 = interopRequireDefault$1.exports, warning$1 = {};
 Object.defineProperty(warning$1, "__esModule", {
   value: !0
 });
@@ -8653,7 +8935,7 @@ warningOnce.preMessage = preMessage;
 warningOnce.resetWarned = resetWarned;
 warningOnce.noteOnce = noteOnce;
 warning$1.default = warningOnce;
-var _interopRequireDefault$a = interopRequireDefaultExports.default;
+var _interopRequireDefault$a = interopRequireDefaultExports$1.default;
 Object.defineProperty(dayjs, "__esModule", {
   value: !0
 });
@@ -9250,9 +9532,9 @@ var BaseInput = /* @__PURE__ */ React__default.forwardRef(function(props, ref) {
       nativeElement: groupRef.current || containerRef.current
     };
   }), hasAffix) {
-    var _clsx2, clearIcon = null;
+    var clearIcon = null;
     if (allowClear) {
-      var _clsx3, needClear = !disabled && !readOnly && value, clearIconCls = "".concat(prefixCls, "-clear-icon"), iconNode = _typeof$2(allowClear) === "object" && allowClear !== null && allowClear !== void 0 && allowClear.clearIcon ? allowClear.clearIcon : "✖";
+      var needClear = !disabled && !readOnly && value, clearIconCls = "".concat(prefixCls, "-clear-icon"), iconNode = _typeof$3(allowClear) === "object" && allowClear !== null && allowClear !== void 0 && allowClear.clearIcon ? allowClear.clearIcon : "✖";
       clearIcon = /* @__PURE__ */ React__default.createElement("span", {
         onClick: /* @__PURE__ */ __name(function(event) {
           handleReset == null || handleReset(event), onClear == null || onClear();
@@ -9260,16 +9542,16 @@ var BaseInput = /* @__PURE__ */ React__default.forwardRef(function(props, ref) {
         onMouseDown: /* @__PURE__ */ __name(function(e2) {
           return e2.preventDefault();
         }, "onMouseDown"),
-        className: clsx(clearIconCls, (_clsx3 = {}, _defineProperty$b(_clsx3, "".concat(clearIconCls, "-hidden"), !needClear), _defineProperty$b(_clsx3, "".concat(clearIconCls, "-has-suffix"), !!suffix), _clsx3)),
+        className: clsx(clearIconCls, _defineProperty$c(_defineProperty$c({}, "".concat(clearIconCls, "-hidden"), !needClear), "".concat(clearIconCls, "-has-suffix"), !!suffix)),
         role: "button",
         tabIndex: -1
       }, iconNode);
     }
-    var affixWrapperPrefixCls = "".concat(prefixCls, "-affix-wrapper"), affixWrapperCls = clsx(affixWrapperPrefixCls, (_clsx2 = {}, _defineProperty$b(_clsx2, "".concat(prefixCls, "-disabled"), disabled), _defineProperty$b(_clsx2, "".concat(affixWrapperPrefixCls, "-disabled"), disabled), _defineProperty$b(_clsx2, "".concat(affixWrapperPrefixCls, "-focused"), focused), _defineProperty$b(_clsx2, "".concat(affixWrapperPrefixCls, "-readonly"), readOnly), _defineProperty$b(_clsx2, "".concat(affixWrapperPrefixCls, "-input-with-clear-btn"), suffix && allowClear && value), _clsx2), classes == null ? void 0 : classes.affixWrapper, classNames == null ? void 0 : classNames.affixWrapper, classNames == null ? void 0 : classNames.variant), suffixNode = (suffix || allowClear) && /* @__PURE__ */ React__default.createElement("span", {
+    var affixWrapperPrefixCls = "".concat(prefixCls, "-affix-wrapper"), affixWrapperCls = clsx(affixWrapperPrefixCls, _defineProperty$c(_defineProperty$c(_defineProperty$c(_defineProperty$c(_defineProperty$c({}, "".concat(prefixCls, "-disabled"), disabled), "".concat(affixWrapperPrefixCls, "-disabled"), disabled), "".concat(affixWrapperPrefixCls, "-focused"), focused), "".concat(affixWrapperPrefixCls, "-readonly"), readOnly), "".concat(affixWrapperPrefixCls, "-input-with-clear-btn"), suffix && allowClear && value), classes == null ? void 0 : classes.affixWrapper, classNames == null ? void 0 : classNames.affixWrapper, classNames == null ? void 0 : classNames.variant), suffixNode = (suffix || allowClear) && /* @__PURE__ */ React__default.createElement("span", {
       className: clsx("".concat(prefixCls, "-suffix"), classNames == null ? void 0 : classNames.suffix),
       style: styles2 == null ? void 0 : styles2.suffix
     }, clearIcon, suffix);
-    element2 = /* @__PURE__ */ React__default.createElement(AffixWrapperComponent, _extends$5({
+    element2 = /* @__PURE__ */ React__default.createElement(AffixWrapperComponent, _extends$6({
       className: affixWrapperCls,
       style: styles2 == null ? void 0 : styles2.affixWrapper,
       onClick: onInputClick
@@ -9281,7 +9563,7 @@ var BaseInput = /* @__PURE__ */ React__default.forwardRef(function(props, ref) {
     }, prefix), element2, suffixNode);
   }
   if (hasAddon(props)) {
-    var wrapperCls = "".concat(prefixCls, "-group"), addonCls = "".concat(wrapperCls, "-addon"), groupWrapperCls = "".concat(wrapperCls, "-wrapper"), mergedWrapperClassName = clsx("".concat(prefixCls, "-wrapper"), wrapperCls, classes == null ? void 0 : classes.wrapper, classNames == null ? void 0 : classNames.wrapper), mergedGroupClassName = clsx(groupWrapperCls, _defineProperty$b({}, "".concat(groupWrapperCls, "-disabled"), disabled), classes == null ? void 0 : classes.group, classNames == null ? void 0 : classNames.groupWrapper);
+    var wrapperCls = "".concat(prefixCls, "-group"), addonCls = "".concat(wrapperCls, "-addon"), groupWrapperCls = "".concat(wrapperCls, "-wrapper"), mergedWrapperClassName = clsx("".concat(prefixCls, "-wrapper"), wrapperCls, classes == null ? void 0 : classes.wrapper, classNames == null ? void 0 : classNames.wrapper), mergedGroupClassName = clsx(groupWrapperCls, _defineProperty$c({}, "".concat(groupWrapperCls, "-disabled"), disabled), classes == null ? void 0 : classes.group, classNames == null ? void 0 : classNames.groupWrapper);
     element2 = /* @__PURE__ */ React__default.createElement(GroupWrapperComponent, {
       className: mergedGroupClassName,
       ref: groupRef
@@ -9295,16 +9577,16 @@ var BaseInput = /* @__PURE__ */ React__default.forwardRef(function(props, ref) {
   }
   return /* @__PURE__ */ React__default.cloneElement(element2, {
     className: clsx((_element$props = element2.props) === null || _element$props === void 0 ? void 0 : _element$props.className, className) || null,
-    style: _objectSpread2$1(_objectSpread2$1({}, (_element$props2 = element2.props) === null || _element$props2 === void 0 ? void 0 : _element$props2.style), style2),
+    style: _objectSpread2$2(_objectSpread2$2({}, (_element$props2 = element2.props) === null || _element$props2 === void 0 ? void 0 : _element$props2.style), style2),
     hidden
   });
 }), _excluded$n = ["show"];
 function useCount(count, showCount) {
   return React$6.useMemo(function() {
     var mergedConfig = {};
-    showCount && (mergedConfig.show = _typeof$2(showCount) === "object" && showCount.formatter ? showCount.formatter : !!showCount), mergedConfig = _objectSpread2$1(_objectSpread2$1({}, mergedConfig), count);
-    var _ref = mergedConfig, show = _ref.show, rest = _objectWithoutProperties$1(_ref, _excluded$n);
-    return _objectSpread2$1(_objectSpread2$1({}, rest), {}, {
+    showCount && (mergedConfig.show = _typeof$3(showCount) === "object" && showCount.formatter ? showCount.formatter : !!showCount), mergedConfig = _objectSpread2$2(_objectSpread2$2({}, mergedConfig), count);
+    var _ref = mergedConfig, show = _ref.show, rest = _objectWithoutProperties$2(_ref, _excluded$n);
+    return _objectSpread2$2(_objectSpread2$2({}, rest), {}, {
       show: !!show,
       showFormatter: typeof show == "function" ? show : void 0,
       strategy: rest.strategy || function(value) {
@@ -9315,11 +9597,11 @@ function useCount(count, showCount) {
 }
 __name(useCount, "useCount");
 var _excluded$m = ["autoComplete", "onChange", "onFocus", "onBlur", "onPressEnter", "onKeyDown", "onKeyUp", "prefixCls", "disabled", "htmlSize", "className", "maxLength", "suffix", "showCount", "count", "type", "classes", "classNames", "styles", "onCompositionStart", "onCompositionEnd"], Input$2 = /* @__PURE__ */ forwardRef(function(props, ref) {
-  var autoComplete = props.autoComplete, onChange = props.onChange, onFocus = props.onFocus, onBlur2 = props.onBlur, onPressEnter = props.onPressEnter, onKeyDown2 = props.onKeyDown, onKeyUp = props.onKeyUp, _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "rc-input" : _props$prefixCls, disabled = props.disabled, htmlSize = props.htmlSize, className = props.className, maxLength = props.maxLength, suffix = props.suffix, showCount = props.showCount, count = props.count, _props$type = props.type, type2 = _props$type === void 0 ? "text" : _props$type, classes = props.classes, classNames = props.classNames, styles2 = props.styles, _onCompositionStart = props.onCompositionStart, onCompositionEnd = props.onCompositionEnd, rest = _objectWithoutProperties$1(props, _excluded$m), _useState = useState(!1), _useState2 = _slicedToArray$1(_useState, 2), focused = _useState2[0], setFocused = _useState2[1], compositionRef = useRef(!1), keyLockRef = useRef(!1), inputRef = useRef(null), holderRef = useRef(null), focus = /* @__PURE__ */ __name(function(option) {
+  var autoComplete = props.autoComplete, onChange = props.onChange, onFocus = props.onFocus, onBlur2 = props.onBlur, onPressEnter = props.onPressEnter, onKeyDown2 = props.onKeyDown, onKeyUp = props.onKeyUp, _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "rc-input" : _props$prefixCls, disabled = props.disabled, htmlSize = props.htmlSize, className = props.className, maxLength = props.maxLength, suffix = props.suffix, showCount = props.showCount, count = props.count, _props$type = props.type, type2 = _props$type === void 0 ? "text" : _props$type, classes = props.classes, classNames = props.classNames, styles2 = props.styles, _onCompositionStart = props.onCompositionStart, onCompositionEnd = props.onCompositionEnd, rest = _objectWithoutProperties$2(props, _excluded$m), _useState = useState(!1), _useState2 = _slicedToArray$2(_useState, 2), focused = _useState2[0], setFocused = _useState2[1], compositionRef = useRef(!1), keyLockRef = useRef(!1), inputRef = useRef(null), holderRef = useRef(null), focus = /* @__PURE__ */ __name(function(option) {
     inputRef.current && triggerFocus(inputRef.current, option);
   }, "focus"), _useMergedState = useMergedState(props.defaultValue, {
     value: props.value
-  }), _useMergedState2 = _slicedToArray$1(_useMergedState, 2), value = _useMergedState2[0], setValue = _useMergedState2[1], formatValue2 = value == null ? "" : String(value), _useState3 = useState(null), _useState4 = _slicedToArray$1(_useState3, 2), selection = _useState4[0], setSelection = _useState4[1], countConfig = useCount(count, showCount), mergedMax = countConfig.max || maxLength, valueLength = countConfig.strategy(formatValue2), isOutOfRange = !!mergedMax && valueLength > mergedMax;
+  }), _useMergedState2 = _slicedToArray$2(_useMergedState, 2), value = _useMergedState2[0], setValue = _useMergedState2[1], formatValue2 = value == null ? "" : String(value), _useState3 = useState(null), _useState4 = _slicedToArray$2(_useState3, 2), selection = _useState4[0], setSelection = _useState4[1], countConfig = useCount(count, showCount), mergedMax = countConfig.max || maxLength, valueLength = countConfig.strategy(formatValue2), isOutOfRange = !!mergedMax && valueLength > mergedMax;
   useImperativeHandle(ref, function() {
     var _holderRef$current;
     return {
@@ -9398,9 +9680,10 @@ var _excluded$m = ["autoComplete", "onChange", "onFocus", "onBlur", "onPressEnte
       "classes",
       "htmlSize",
       "styles",
-      "classNames"
+      "classNames",
+      "onClear"
     ]);
-    return /* @__PURE__ */ React__default.createElement("input", _extends$5({
+    return /* @__PURE__ */ React__default.createElement("input", _extends$6({
       autoComplete
     }, otherProps, {
       onChange: onInternalChange,
@@ -9408,7 +9691,7 @@ var _excluded$m = ["autoComplete", "onChange", "onFocus", "onBlur", "onPressEnte
       onBlur: handleBlur,
       onKeyDown: handleKeyDown,
       onKeyUp: handleKeyUp,
-      className: clsx(prefixCls, _defineProperty$b({}, "".concat(prefixCls, "-disabled"), disabled), classNames == null ? void 0 : classNames.input),
+      className: clsx(prefixCls, _defineProperty$c({}, "".concat(prefixCls, "-disabled"), disabled), classNames == null ? void 0 : classNames.input),
       style: styles2 == null ? void 0 : styles2.input,
       ref: inputRef,
       size: htmlSize,
@@ -9427,13 +9710,13 @@ var _excluded$m = ["autoComplete", "onChange", "onFocus", "onBlur", "onPressEnte
         maxLength: mergedMax
       }) : "".concat(valueLength).concat(hasMaxLength ? " / ".concat(mergedMax) : "");
       return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, countConfig.show && /* @__PURE__ */ React__default.createElement("span", {
-        className: clsx("".concat(prefixCls, "-show-count-suffix"), _defineProperty$b({}, "".concat(prefixCls, "-show-count-has-suffix"), !!suffix), classNames == null ? void 0 : classNames.count),
-        style: _objectSpread2$1({}, styles2 == null ? void 0 : styles2.count)
+        className: clsx("".concat(prefixCls, "-show-count-suffix"), _defineProperty$c({}, "".concat(prefixCls, "-show-count-has-suffix"), !!suffix), classNames == null ? void 0 : classNames.count),
+        style: _objectSpread2$2({}, styles2 == null ? void 0 : styles2.count)
       }, dataCount), suffix);
     }
     return null;
   }, "getSuffix");
-  return /* @__PURE__ */ React__default.createElement(BaseInput, _extends$5({}, rest, {
+  return /* @__PURE__ */ React__default.createElement(BaseInput, _extends$6({}, rest, {
     prefixCls,
     className: clsx(className, outOfRangeCls),
     handleReset,
@@ -10159,8 +10442,7 @@ const inputNumber = "univer-input-number", inputNumberFocused = "univer-input-nu
   inputNumberHandlerDown,
   inputNumberHandlerDownDisabled,
   inputNumberHandlerUpDisabled
-};
-function InputNumber(props) {
+}, InputNumber = forwardRef((props, ref) => {
   const {
     className,
     value,
@@ -10193,11 +10475,11 @@ function InputNumber(props) {
       onClick,
       onKeyDown: onKeyDown2,
       onChange: handleChange,
-      onPressEnter
+      onPressEnter,
+      ref
     }
   );
-}
-__name(InputNumber, "InputNumber");
+});
 function isEqual(obj1, obj2) {
   var shallow = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : !1, refSet = /* @__PURE__ */ new Set();
   function deepEqual(a, b2) {
@@ -10268,7 +10550,7 @@ var PathTrackerContext = /* @__PURE__ */ React$6.createContext(EmptyList);
 function useFullPath(eventKey) {
   var parentKeyPath = React$6.useContext(PathTrackerContext);
   return React$6.useMemo(function() {
-    return eventKey !== void 0 ? [].concat(_toConsumableArray$3(parentKeyPath), [eventKey]) : parentKeyPath;
+    return eventKey !== void 0 ? [].concat(_toConsumableArray$4(parentKeyPath), [eventKey]) : parentKeyPath;
   }, [parentKeyPath, eventKey]);
 }
 __name(useFullPath, "useFullPath");
@@ -10288,7 +10570,7 @@ function focusable(node) {
 }
 __name(focusable, "focusable");
 function getFocusNodeList(node) {
-  var includePositive = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !1, res = _toConsumableArray$3(node.querySelectorAll("*")).filter(function(child) {
+  var includePositive = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !1, res = _toConsumableArray$4(node.querySelectorAll("*")).filter(function(child) {
     return focusable(child, includePositive);
   });
   return focusable(node, includePositive) && res.unshift(node), res;
@@ -10465,11 +10747,11 @@ function useKeyRecords() {
       return pathKeyList.includes(eventKey);
     });
   }, [getKeyPath]), getKeys = /* @__PURE__ */ __name(function() {
-    var keys4 = _toConsumableArray$3(key2pathRef.current.keys());
+    var keys4 = _toConsumableArray$4(key2pathRef.current.keys());
     return overflowKeys.length && keys4.push(OVERFLOW_KEY), keys4;
   }, "getKeys2"), getSubPathKeys = useCallback(function(key) {
     var connectedPath = "".concat(key2pathRef.current.get(key)).concat(PATH_SPLIT), pathKeys = /* @__PURE__ */ new Set();
-    return _toConsumableArray$3(path2keyRef.current.keys()).forEach(function(pathKey) {
+    return _toConsumableArray$4(path2keyRef.current.keys()).forEach(function(pathKey) {
       pathKey.startsWith(connectedPath) && pathKeys.add(path2keyRef.current.get(pathKey));
     }), pathKeys;
   }, []);
@@ -10581,7 +10863,7 @@ var _excluded$i = ["title", "attribute", "elementRef"], _excluded2$2 = ["style",
     return {
       key: eventKey,
       // Note: For legacy code is reversed which not like other antd component
-      keyPath: _toConsumableArray$3(connectedKeys).reverse(),
+      keyPath: _toConsumableArray$4(connectedKeys).reverse(),
       item: legacyMenuItemRef.current,
       domEvent: e2
     };
@@ -10651,7 +10933,7 @@ function parseChildren(children, keyPath) {
   return toArray$3(children).map(function(child, index2) {
     if (/* @__PURE__ */ React$6.isValidElement(child)) {
       var _eventKey, _child$props, key = child.key, eventKey = (_eventKey = (_child$props = child.props) === null || _child$props === void 0 ? void 0 : _child$props.eventKey) !== null && _eventKey !== void 0 ? _eventKey : key, emptyKey = eventKey == null;
-      emptyKey && (eventKey = "tmp_key-".concat([].concat(_toConsumableArray$3(keyPath), [index2]).join("-")));
+      emptyKey && (eventKey = "tmp_key-".concat([].concat(_toConsumableArray$4(keyPath), [index2]).join("-")));
       var cloneProps = {
         key: eventKey,
         eventKey
@@ -11075,7 +11357,7 @@ var _excluded$d = ["prefixCls", "rootClassName", "style", "className", "tabIndex
       var targetKey = info.key, exist = mergedSelectKeys.includes(targetKey), newSelectKeys;
       multiple ? exist ? newSelectKeys = mergedSelectKeys.filter(function(key) {
         return key !== targetKey;
-      }) : newSelectKeys = [].concat(_toConsumableArray$3(mergedSelectKeys), [targetKey]) : newSelectKeys = [targetKey], setMergedSelectKeys(newSelectKeys);
+      }) : newSelectKeys = [].concat(_toConsumableArray$4(mergedSelectKeys), [targetKey]) : newSelectKeys = [targetKey], setMergedSelectKeys(newSelectKeys);
       var selectInfo = _objectSpread2$1(_objectSpread2$1({}, info), {}, {
         selectedKeys: newSelectKeys
       });
@@ -11298,7 +11580,16 @@ var _typeofExports = _typeof$1.exports;
   }
   __name(_interopRequireWildcard2, "_interopRequireWildcard"), module.exports = _interopRequireWildcard2, module.exports.__esModule = !0, module.exports.default = module.exports;
 })(interopRequireWildcard);
-var interopRequireWildcardExports = interopRequireWildcard.exports, regeneratorRuntime = { exports: {} };
+var interopRequireWildcardExports = interopRequireWildcard.exports, interopRequireDefault = { exports: {} };
+(function(module) {
+  function _interopRequireDefault2(e2) {
+    return e2 && e2.__esModule ? e2 : {
+      default: e2
+    };
+  }
+  __name(_interopRequireDefault2, "_interopRequireDefault"), module.exports = _interopRequireDefault2, module.exports.__esModule = !0, module.exports.default = module.exports;
+})(interopRequireDefault);
+var interopRequireDefaultExports = interopRequireDefault.exports, regeneratorRuntime = { exports: {} };
 (function(module) {
   var _typeof3 = _typeofExports.default;
   function _regeneratorRuntime() {
@@ -12480,6 +12771,8 @@ function Scrollbar(props) {
   const containerRef = useRef(null), contentRef = useRef(null), [thumbHeight, setThumbHeight] = useState(0), [thumbTop, setThumbTop] = useState(0);
   useEffect(() => {
     function resize() {
+      if (!containerRef.current)
+        return;
       const { height: containerHeight } = containerRef.current.parentElement.getBoundingClientRect(), { scrollHeight } = contentRef.current;
       setThumbHeight(containerHeight / scrollHeight * 100), containerRef.current.style.height = `${containerHeight}px`;
     }
@@ -13066,7 +13359,7 @@ var getSeparatedContent = /* @__PURE__ */ __name(function(text, tokens, end) {
       return [str];
     var list2 = str.split(token);
     return match2 = match2 || list2.length > 1, list2.reduce(function(prevList, unitStr) {
-      return [].concat(_toConsumableArray$3(prevList), _toConsumableArray$3(separate2(unitStr, restTokens)));
+      return [].concat(_toConsumableArray$4(prevList), _toConsumableArray$4(separate2(unitStr, restTokens)));
     }, []).filter(Boolean);
   }, "separate"), list = separate(text, tokens);
   return match2 ? typeof end < "u" ? list.slice(0, end) : list : null;
@@ -13160,10 +13453,10 @@ var _excluded$b = ["id", "prefixCls", "className", "showSearch", "tagRender", "d
   }, [mergedOpen]), React$6.useEffect(function() {
     innerOpen && disabled && setInnerOpen(!1), disabled && !blurRef.current && setMockFocused(!1);
   }, [disabled]);
-  var _useLock = useLock(), _useLock2 = _slicedToArray$1(_useLock, 2), getClearLock = _useLock2[0], setClearLock = _useLock2[1], onInternalKeyDown = /* @__PURE__ */ __name(function(event) {
-    var clearLock = getClearLock(), which = event.which;
-    if (which === KeyCode.ENTER && (mode !== "combobox" && event.preventDefault(), mergedOpen || onToggleOpen(!0)), setClearLock(!!mergedSearchValue), which === KeyCode.BACKSPACE && !clearLock && multiple && !mergedSearchValue && displayValues.length) {
-      for (var cloneDisplayValues = _toConsumableArray$3(displayValues), removedDisplayValue = null, i = cloneDisplayValues.length - 1; i >= 0; i -= 1) {
+  var _useLock = useLock(), _useLock2 = _slicedToArray$1(_useLock, 2), getClearLock = _useLock2[0], setClearLock = _useLock2[1], keyLockRef = React$6.useRef(!1), onInternalKeyDown = /* @__PURE__ */ __name(function(event) {
+    var clearLock = getClearLock(), key = event.key, isEnterKey = key === "Enter";
+    if (isEnterKey && (mode !== "combobox" && event.preventDefault(), mergedOpen || onToggleOpen(!0)), setClearLock(!!mergedSearchValue), key === "Backspace" && !clearLock && multiple && !mergedSearchValue && displayValues.length) {
+      for (var cloneDisplayValues = _toConsumableArray$4(displayValues), removedDisplayValue = null, i = cloneDisplayValues.length - 1; i >= 0; i -= 1) {
         var current = cloneDisplayValues[i];
         if (!current.disabled) {
           cloneDisplayValues.splice(i, 1), removedDisplayValue = current;
@@ -13177,11 +13470,11 @@ var _excluded$b = ["id", "prefixCls", "className", "showSearch", "tagRender", "d
     }
     for (var _len = arguments.length, rest = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++)
       rest[_key - 1] = arguments[_key];
-    if (mergedOpen) {
+    if (mergedOpen && (!isEnterKey || !keyLockRef.current)) {
       var _listRef$current2;
       (_listRef$current2 = listRef.current) === null || _listRef$current2 === void 0 || _listRef$current2.onKeyDown.apply(_listRef$current2, [event].concat(rest));
     }
-    onKeyDown2 == null || onKeyDown2.apply(void 0, [event].concat(rest));
+    isEnterKey && (keyLockRef.current = !0), onKeyDown2 == null || onKeyDown2.apply(void 0, [event].concat(rest));
   }, "onInternalKeyDown2"), onInternalKeyUp = /* @__PURE__ */ __name(function(event) {
     for (var _len2 = arguments.length, rest = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++)
       rest[_key2 - 1] = arguments[_key2];
@@ -13189,7 +13482,7 @@ var _excluded$b = ["id", "prefixCls", "className", "showSearch", "tagRender", "d
       var _listRef$current3;
       (_listRef$current3 = listRef.current) === null || _listRef$current3 === void 0 || _listRef$current3.onKeyUp.apply(_listRef$current3, [event].concat(rest));
     }
-    onKeyUp == null || onKeyUp.apply(void 0, [event].concat(rest));
+    event.key === "Enter" && (keyLockRef.current = !1), onKeyUp == null || onKeyUp.apply(void 0, [event].concat(rest));
   }, "onInternalKeyUp2"), onSelectorRemove = /* @__PURE__ */ __name(function(val) {
     var newValues = displayValues.filter(function(i) {
       return i !== val;
@@ -13571,12 +13864,18 @@ function useMobileTouchMove(inVirtual, listRef, callback) {
   }, "onTouchMove"), onTouchEnd = /* @__PURE__ */ __name(function() {
     touchedRef.current = !1, cleanUpEvents();
   }, "onTouchEnd"), onTouchStart = /* @__PURE__ */ __name(function(e2) {
-    cleanUpEvents(), e2.touches.length === 1 && !touchedRef.current && (touchedRef.current = !0, touchXRef.current = Math.ceil(e2.touches[0].pageX), touchYRef.current = Math.ceil(e2.touches[0].pageY), elementRef.current = e2.target, elementRef.current.addEventListener("touchmove", onTouchMove), elementRef.current.addEventListener("touchend", onTouchEnd));
+    cleanUpEvents(), e2.touches.length === 1 && !touchedRef.current && (touchedRef.current = !0, touchXRef.current = Math.ceil(e2.touches[0].pageX), touchYRef.current = Math.ceil(e2.touches[0].pageY), elementRef.current = e2.target, elementRef.current.addEventListener("touchmove", onTouchMove, {
+      passive: !1
+    }), elementRef.current.addEventListener("touchend", onTouchEnd, {
+      passive: !0
+    }));
   }, "onTouchStart");
   cleanUpEvents = /* @__PURE__ */ __name(function() {
     elementRef.current && (elementRef.current.removeEventListener("touchmove", onTouchMove), elementRef.current.removeEventListener("touchend", onTouchEnd));
   }, "cleanUpEvents"), useLayoutEffect$1(function() {
-    return inVirtual && listRef.current.addEventListener("touchstart", onTouchStart), function() {
+    return inVirtual && listRef.current.addEventListener("touchstart", onTouchStart, {
+      passive: !0
+    }), function() {
       var _listRef$current;
       (_listRef$current = listRef.current) === null || _listRef$current === void 0 || _listRef$current.removeEventListener("touchstart", onTouchStart), cleanUpEvents(), clearInterval(intervalRef.current);
     };
@@ -13691,7 +13990,11 @@ var ScrollBar = /* @__PURE__ */ React$6.forwardRef(function(props, ref) {
     var onScrollbarTouchStart = /* @__PURE__ */ __name(function(e2) {
       e2.preventDefault();
     }, "onScrollbarTouchStart2"), scrollbarEle = scrollbarRef.current, thumbEle = thumbRef.current;
-    return scrollbarEle.addEventListener("touchstart", onScrollbarTouchStart), thumbEle.addEventListener("touchstart", onThumbMouseDown), function() {
+    return scrollbarEle.addEventListener("touchstart", onScrollbarTouchStart, {
+      passive: !1
+    }), thumbEle.addEventListener("touchstart", onThumbMouseDown, {
+      passive: !1
+    }), function() {
       scrollbarEle.removeEventListener("touchstart", onScrollbarTouchStart), thumbEle.removeEventListener("touchstart", onThumbMouseDown);
     };
   }, []);
@@ -13702,8 +14005,10 @@ var ScrollBar = /* @__PURE__ */ React$6.forwardRef(function(props, ref) {
     if (dragging) {
       var moveRafId, onMouseMove = /* @__PURE__ */ __name(function(e2) {
         var _stateRef$current = stateRef.current, stateDragging = _stateRef$current.dragging, statePageY = _stateRef$current.pageY, stateStartTop = _stateRef$current.startTop;
-        if (wrapperRaf.cancel(moveRafId), stateDragging) {
-          var offset2 = getPageXY(e2, horizontal) - statePageY, newTop = stateStartTop;
+        wrapperRaf.cancel(moveRafId);
+        var rect = scrollbarRef.current.getBoundingClientRect(), scale = containerSize / (horizontal ? rect.width : rect.height);
+        if (stateDragging) {
+          var offset2 = (getPageXY(e2, horizontal) - statePageY) * scale, newTop = stateStartTop;
           !isLTR && horizontal ? newTop -= offset2 : newTop += offset2;
           var tmpEnableScrollRange = enableScrollRangeRef.current, tmpEnableOffsetRange = enableOffsetRangeRef.current, ptg = tmpEnableOffsetRange ? newTop / tmpEnableOffsetRange : 0, newScrollTop = Math.ceil(ptg * tmpEnableScrollRange);
           newScrollTop = Math.max(newScrollTop, 0), newScrollTop = Math.min(newScrollTop, tmpEnableScrollRange), moveRafId = wrapperRaf(function() {
@@ -13713,12 +14018,22 @@ var ScrollBar = /* @__PURE__ */ React$6.forwardRef(function(props, ref) {
       }, "onMouseMove2"), onMouseUp = /* @__PURE__ */ __name(function() {
         setDragging(!1), onStopMove();
       }, "onMouseUp2");
-      return window.addEventListener("mousemove", onMouseMove), window.addEventListener("touchmove", onMouseMove), window.addEventListener("mouseup", onMouseUp), window.addEventListener("touchend", onMouseUp), function() {
+      return window.addEventListener("mousemove", onMouseMove, {
+        passive: !0
+      }), window.addEventListener("touchmove", onMouseMove, {
+        passive: !0
+      }), window.addEventListener("mouseup", onMouseUp, {
+        passive: !0
+      }), window.addEventListener("touchend", onMouseUp, {
+        passive: !0
+      }), function() {
         window.removeEventListener("mousemove", onMouseMove), window.removeEventListener("touchmove", onMouseMove), window.removeEventListener("mouseup", onMouseUp), window.removeEventListener("touchend", onMouseUp), wrapperRaf.cancel(moveRafId);
       };
     }
   }, [dragging]), React$6.useEffect(function() {
-    delayHidden();
+    return delayHidden(), function() {
+      clearTimeout(visibleTimeoutRef.current);
+    };
   }, [scrollOffset]), React$6.useImperativeHandle(ref, function() {
     return {
       delayHidden
@@ -13818,8 +14133,8 @@ function RawList(props, ref) {
     height: height2
   }), _React$useState2 = _slicedToArray$1(_React$useState, 2), size = _React$useState2[0], setSize = _React$useState2[1], onHolderResize = /* @__PURE__ */ __name(function(sizeInfo) {
     setSize({
-      width: sizeInfo.width || sizeInfo.offsetWidth,
-      height: sizeInfo.height || sizeInfo.offsetHeight
+      width: sizeInfo.offsetWidth,
+      height: sizeInfo.offsetHeight
     });
   }, "onHolderResize"), verticalScrollBarRef = useRef(), horizontalScrollBarRef = useRef(), horizontalScrollBarSpinSize = React$6.useMemo(function() {
     return getSpinSize(size.width, scrollWidth);
@@ -13882,7 +14197,13 @@ function RawList(props, ref) {
     }
     __name(onMozMousePixelScroll, "onMozMousePixelScroll");
     var componentEle = componentRef.current;
-    return componentEle.addEventListener("wheel", onRawWheel), componentEle.addEventListener("DOMMouseScroll", onFireFoxScroll), componentEle.addEventListener("MozMousePixelScroll", onMozMousePixelScroll), function() {
+    return componentEle.addEventListener("wheel", onRawWheel, {
+      passive: !1
+    }), componentEle.addEventListener("DOMMouseScroll", onFireFoxScroll, {
+      passive: !0
+    }), componentEle.addEventListener("MozMousePixelScroll", onMozMousePixelScroll, {
+      passive: !1
+    }), function() {
       componentEle.removeEventListener("wheel", onRawWheel), componentEle.removeEventListener("DOMMouseScroll", onFireFoxScroll), componentEle.removeEventListener("MozMousePixelScroll", onMozMousePixelScroll);
     };
   }, [useVirtual]), useLayoutEffect$1(function() {
@@ -14033,7 +14354,7 @@ var OptionList = /* @__PURE__ */ __name(function(_, ref) {
   }, [memoFlattenOptions.length, searchValue]);
   var isSelected = React$6.useCallback(function(value) {
     return rawValues.has(value) && mode !== "combobox";
-  }, [mode, _toConsumableArray$3(rawValues).toString(), rawValues.size]);
+  }, [mode, _toConsumableArray$4(rawValues).toString(), rawValues.size]);
   useEffect(function() {
     var timeoutId = setTimeout(function() {
       if (!multiple && open && rawValues.size === 1) {
@@ -14383,10 +14704,10 @@ var Select$1 = /* @__PURE__ */ React$6.forwardRef(function(props, ref) {
   }), filledTagOptions = React$6.useMemo(function() {
     if (mode !== "tags")
       return mergedOptions;
-    var cloneOptions = _toConsumableArray$3(mergedOptions), existOptions = /* @__PURE__ */ __name(function(val) {
+    var cloneOptions = _toConsumableArray$4(mergedOptions), existOptions = /* @__PURE__ */ __name(function(val) {
       return valueOptions.has(val);
     }, "existOptions2");
-    return _toConsumableArray$3(mergedValues).sort(function(a, b2) {
+    return _toConsumableArray$4(mergedValues).sort(function(a, b2) {
       return a.value < b2.value ? -1 : 1;
     }).forEach(function(item) {
       var val = item.value;
@@ -14397,9 +14718,9 @@ var Select$1 = /* @__PURE__ */ React$6.forwardRef(function(props, ref) {
       return item[optionFilterProp || "value"] === mergedSearchValue;
     }) || filteredOptions.some(function(item) {
       return item[mergedFieldNames.value] === mergedSearchValue;
-    }) ? filteredOptions : [createTagOption(mergedSearchValue)].concat(_toConsumableArray$3(filteredOptions));
+    }) ? filteredOptions : [createTagOption(mergedSearchValue)].concat(_toConsumableArray$4(filteredOptions));
   }, [createTagOption, optionFilterProp, mode, filteredOptions, mergedSearchValue, mergedFieldNames]), orderedFilteredOptions = React$6.useMemo(function() {
-    return filterSort ? _toConsumableArray$3(filledSearchOptions).sort(function(a, b2) {
+    return filterSort ? _toConsumableArray$4(filledSearchOptions).sort(function(a, b2) {
       return filterSort(a, b2, {
         searchValue: mergedSearchValue
       });
@@ -14449,7 +14770,7 @@ var Select$1 = /* @__PURE__ */ React$6.forwardRef(function(props, ref) {
     }
   }, "triggerSelect2"), onInternalSelect = useRefFunc(function(val, info) {
     var cloneValues, mergedSelect = multiple ? info.selected : !0;
-    mergedSelect ? cloneValues = multiple ? [].concat(_toConsumableArray$3(mergedValues), [val]) : [val] : cloneValues = mergedValues.filter(function(v2) {
+    mergedSelect ? cloneValues = multiple ? [].concat(_toConsumableArray$4(mergedValues), [val]) : [val] : cloneValues = mergedValues.filter(function(v2) {
       return v2.value !== val;
     }), triggerChange(cloneValues), triggerSelect(val, mergedSelect), mode === "combobox" ? setActiveValue("") : (!isMultiple || autoClearSearchValue) && (setSearchValue(""), setActiveValue(""));
   }), onDisplayValuesChange = /* @__PURE__ */ __name(function(nextValues, info) {
@@ -14462,7 +14783,7 @@ var Select$1 = /* @__PURE__ */ React$6.forwardRef(function(props, ref) {
     if (setSearchValue(searchText), setActiveValue(null), info.source === "submit") {
       var formatted = (searchText || "").trim();
       if (formatted) {
-        var newRawValues = Array.from(new Set([].concat(_toConsumableArray$3(rawValues), [formatted])));
+        var newRawValues = Array.from(new Set([].concat(_toConsumableArray$4(rawValues), [formatted])));
         triggerChange(newRawValues), triggerSelect(formatted, !0), setSearchValue("");
       }
       return;
@@ -14476,7 +14797,7 @@ var Select$1 = /* @__PURE__ */ React$6.forwardRef(function(props, ref) {
     }).filter(function(val) {
       return val !== void 0;
     }));
-    var newRawValues = Array.from(new Set([].concat(_toConsumableArray$3(rawValues), _toConsumableArray$3(patchValues))));
+    var newRawValues = Array.from(new Set([].concat(_toConsumableArray$4(rawValues), _toConsumableArray$4(patchValues))));
     triggerChange(newRawValues), newRawValues.forEach(function(newRawValue) {
       triggerSelect(newRawValue, !0);
     });
@@ -14653,10 +14974,10 @@ var calcThumbStyle = /* @__PURE__ */ __name(function(targetElement) {
   return value !== void 0 ? "".concat(value, "px") : void 0;
 }, "toPX2");
 function MotionThumb(props) {
-  var prefixCls = props.prefixCls, containerRef = props.containerRef, value = props.value, getValueIndex = props.getValueIndex, motionName = props.motionName, onMotionStart = props.onMotionStart, onMotionEnd = props.onMotionEnd, direction = props.direction, thumbRef = React$6.useRef(null), _React$useState = React$6.useState(value), _React$useState2 = _slicedToArray$1(_React$useState, 2), prevValue = _React$useState2[0], setPrevValue = _React$useState2[1], findValueElement = /* @__PURE__ */ __name(function(val) {
+  var prefixCls = props.prefixCls, containerRef = props.containerRef, value = props.value, getValueIndex = props.getValueIndex, motionName = props.motionName, onMotionStart = props.onMotionStart, onMotionEnd = props.onMotionEnd, direction = props.direction, thumbRef = React$6.useRef(null), _React$useState = React$6.useState(value), _React$useState2 = _slicedToArray$2(_React$useState, 2), prevValue = _React$useState2[0], setPrevValue = _React$useState2[1], findValueElement = /* @__PURE__ */ __name(function(val) {
     var _containerRef$current, index2 = getValueIndex(val), ele = (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.querySelectorAll(".".concat(prefixCls, "-item"))[index2];
     return (ele == null ? void 0 : ele.offsetParent) && ele;
-  }, "findValueElement2"), _React$useState3 = React$6.useState(null), _React$useState4 = _slicedToArray$1(_React$useState3, 2), prevStyle = _React$useState4[0], setPrevStyle = _React$useState4[1], _React$useState5 = React$6.useState(null), _React$useState6 = _slicedToArray$1(_React$useState5, 2), nextStyle = _React$useState6[0], setNextStyle = _React$useState6[1];
+  }, "findValueElement2"), _React$useState3 = React$6.useState(null), _React$useState4 = _slicedToArray$2(_React$useState3, 2), prevStyle = _React$useState4[0], setPrevStyle = _React$useState4[1], _React$useState5 = React$6.useState(null), _React$useState6 = _slicedToArray$2(_React$useState5, 2), nextStyle = _React$useState6[0], setNextStyle = _React$useState6[1];
   useLayoutEffect$1(function() {
     if (prevValue !== value) {
       var prev = findValueElement(prevValue), next = findValueElement(value), calcPrevStyle = calcThumbStyle(prev), calcNextStyle = calcThumbStyle(next);
@@ -14688,7 +15009,7 @@ function MotionThumb(props) {
     onAppearActive,
     onVisibleChanged
   }, function(_ref, ref) {
-    var motionClassName = _ref.className, motionStyle = _ref.style, mergedStyle = _objectSpread2$1(_objectSpread2$1({}, motionStyle), {}, {
+    var motionClassName = _ref.className, motionStyle = _ref.style, mergedStyle = _objectSpread2$2(_objectSpread2$2({}, motionStyle), {}, {
       "--thumb-start-left": thumbStart,
       "--thumb-start-width": toPX(prevStyle == null ? void 0 : prevStyle.width),
       "--thumb-active-left": thumbActive,
@@ -14706,7 +15027,7 @@ var _excluded$6 = ["prefixCls", "direction", "options", "disabled", "defaultValu
 function getValidTitle(option) {
   if (typeof option.title < "u")
     return option.title;
-  if (_typeof$2(option.label) !== "object") {
+  if (_typeof$3(option.label) !== "object") {
     var _option$label;
     return (_option$label = option.label) === null || _option$label === void 0 ? void 0 : _option$label.toString();
   }
@@ -14714,9 +15035,9 @@ function getValidTitle(option) {
 __name(getValidTitle, "getValidTitle");
 function normalizeOptions(options) {
   return options.map(function(option) {
-    if (_typeof$2(option) === "object" && option !== null) {
+    if (_typeof$3(option) === "object" && option !== null) {
       var validTitle = getValidTitle(option);
-      return _objectSpread2$1(_objectSpread2$1({}, option), {}, {
+      return _objectSpread2$2(_objectSpread2$2({}, option), {}, {
         title: validTitle
       });
     }
@@ -14733,7 +15054,7 @@ var InternalSegmentedOption = /* @__PURE__ */ __name(function(_ref) {
     disabled || onChange(event, value);
   }, "handleChange2");
   return /* @__PURE__ */ React$6.createElement("label", {
-    className: clsx(className, _defineProperty$b({}, "".concat(prefixCls, "-item-disabled"), disabled))
+    className: clsx(className, _defineProperty$c({}, "".concat(prefixCls, "-item-disabled"), disabled))
   }, /* @__PURE__ */ React$6.createElement("input", {
     className: "".concat(prefixCls, "-item-input"),
     type: "radio",
@@ -14742,21 +15063,26 @@ var InternalSegmentedOption = /* @__PURE__ */ __name(function(_ref) {
     onChange: handleChange
   }), /* @__PURE__ */ React$6.createElement("div", {
     className: "".concat(prefixCls, "-item-label"),
-    title
+    title,
+    role: "option",
+    "aria-selected": checked
   }, label));
 }, "InternalSegmentedOption2"), Segmented$1 = /* @__PURE__ */ React$6.forwardRef(function(props, ref) {
-  var _segmentedOptions$, _classNames2, _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "rc-segmented" : _props$prefixCls, direction = props.direction, _props$options = props.options, options = _props$options === void 0 ? [] : _props$options, disabled = props.disabled, defaultValue = props.defaultValue, value = props.value, onChange = props.onChange, _props$className = props.className, className = _props$className === void 0 ? "" : _props$className, _props$motionName = props.motionName, motionName = _props$motionName === void 0 ? "thumb-motion" : _props$motionName, restProps = _objectWithoutProperties$1(props, _excluded$6), containerRef = React$6.useRef(null), mergedRef = React$6.useMemo(function() {
+  var _segmentedOptions$, _classNames2, _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "rc-segmented" : _props$prefixCls, direction = props.direction, _props$options = props.options, options = _props$options === void 0 ? [] : _props$options, disabled = props.disabled, defaultValue = props.defaultValue, value = props.value, onChange = props.onChange, _props$className = props.className, className = _props$className === void 0 ? "" : _props$className, _props$motionName = props.motionName, motionName = _props$motionName === void 0 ? "thumb-motion" : _props$motionName, restProps = _objectWithoutProperties$2(props, _excluded$6), containerRef = React$6.useRef(null), mergedRef = React$6.useMemo(function() {
     return composeRef(containerRef, ref);
   }, [containerRef, ref]), segmentedOptions = React$6.useMemo(function() {
     return normalizeOptions(options);
   }, [options]), _useMergedState = useMergedState((_segmentedOptions$ = segmentedOptions[0]) === null || _segmentedOptions$ === void 0 ? void 0 : _segmentedOptions$.value, {
     value,
     defaultValue
-  }), _useMergedState2 = _slicedToArray$1(_useMergedState, 2), rawValue = _useMergedState2[0], setRawValue = _useMergedState2[1], _React$useState = React$6.useState(!1), _React$useState2 = _slicedToArray$1(_React$useState, 2), thumbShow = _React$useState2[0], setThumbShow = _React$useState2[1], handleChange = /* @__PURE__ */ __name(function(event, val) {
+  }), _useMergedState2 = _slicedToArray$2(_useMergedState, 2), rawValue = _useMergedState2[0], setRawValue = _useMergedState2[1], _React$useState = React$6.useState(!1), _React$useState2 = _slicedToArray$2(_React$useState, 2), thumbShow = _React$useState2[0], setThumbShow = _React$useState2[1], handleChange = /* @__PURE__ */ __name(function(event, val) {
     disabled || (setRawValue(val), onChange == null || onChange(val));
   }, "handleChange2"), divProps = omit$2(restProps, ["children"]);
-  return /* @__PURE__ */ React$6.createElement("div", _extends$5({}, divProps, {
-    className: clsx(prefixCls, (_classNames2 = {}, _defineProperty$b(_classNames2, "".concat(prefixCls, "-rtl"), direction === "rtl"), _defineProperty$b(_classNames2, "".concat(prefixCls, "-disabled"), disabled), _classNames2), className),
+  return /* @__PURE__ */ React$6.createElement("div", _extends$6({
+    role: "listbox",
+    "aria-label": "segmented control"
+  }, divProps, {
+    className: clsx(prefixCls, (_classNames2 = {}, _defineProperty$c(_classNames2, "".concat(prefixCls, "-rtl"), direction === "rtl"), _defineProperty$c(_classNames2, "".concat(prefixCls, "-disabled"), disabled), _classNames2), className),
     ref: mergedRef
   }), /* @__PURE__ */ React$6.createElement("div", {
     className: "".concat(prefixCls, "-group")
@@ -14778,10 +15104,10 @@ var InternalSegmentedOption = /* @__PURE__ */ __name(function(_ref) {
       setThumbShow(!1);
     }, "onMotionEnd")
   }), segmentedOptions.map(function(segmentedOption) {
-    return /* @__PURE__ */ React$6.createElement(InternalSegmentedOption, _extends$5({}, segmentedOption, {
+    return /* @__PURE__ */ React$6.createElement(InternalSegmentedOption, _extends$6({}, segmentedOption, {
       key: segmentedOption.value,
       prefixCls,
-      className: clsx(segmentedOption.className, "".concat(prefixCls, "-item"), _defineProperty$b({}, "".concat(prefixCls, "-item-selected"), segmentedOption.value === rawValue && !thumbShow)),
+      className: clsx(segmentedOption.className, "".concat(prefixCls, "-item"), _defineProperty$c({}, "".concat(prefixCls, "-item-selected"), segmentedOption.value === rawValue && !thumbShow)),
       checked: segmentedOption.value === rawValue,
       onChange: handleChange,
       disabled: !!disabled || !!segmentedOption.disabled
@@ -15341,7 +15667,7 @@ const switchWrapper = "univer-switch-wrapper", slider = "univer-slider", styles$
   return useEffect(() => {
     setChecked(defaultChecked);
   }, [defaultChecked]), /* @__PURE__ */ React__default.createElement("div", { className: styles$3.switchWrapper }, /* @__PURE__ */ React__default.createElement("label", { className: styles$3.switch }, /* @__PURE__ */ React__default.createElement("input", { type: "checkbox", checked, onChange: handleChange }), /* @__PURE__ */ React__default.createElement("span", { className: styles$3.slider })));
-}, "Switch"), red50$1 = "#fee7e7", red100$1 = "#fdcece", red200$1 = "#fb9d9d", red300$1 = "#fa7979", red400$1 = "#fe4b4b", red500$1 = "#f30b0b", red600$1 = "#e30909", red700$1 = "#cd0f0f", red800$1 = "#b20000", red900$1 = "#9d0000", orange50$1 = "#fef0e6", orange100$1 = "#fee1cd", orange200$1 = "#fdc49b", orange300$1 = "#fca669", orange400$1 = "#ff8c51", orange500$1 = "#fb8937", orange600$1 = "#f96800", orange700$1 = "#df5d00", orange800$1 = "#cc4f10", orange900$1 = "#b24000", gold50$1 = "#fef6e6", gold100$1 = "#feeecd", gold200$1 = "#fddc9b", gold300$1 = "#fccb69", gold400$1 = "#ffbd37", gold500$1 = "#faad14", gold600$1 = "#e59b07", gold700$1 = "#c68400", gold800$1 = "#a97100", gold900$1 = "#8f5f00", yellow50$1 = "#fefbe6", yellow100$1 = "#fef7cd", yellow200$1 = "#fdf09b", yellow300$1 = "#fce869", yellow400$1 = "#fbe137", yellow500$1 = "#f9d700", yellow600$1 = "#ebc301", yellow700$1 = "#d8b300", yellow800$1 = "#c5a300", yellow900$1 = "#b19401", verdancy50$1 = "#f7fde8", verdancy100$1 = "#effbd0", verdancy200$1 = "#def6a2", verdancy300$1 = "#cef273", verdancy400$1 = "#beee44", verdancy500$1 = "#a4dc16", verdancy600$1 = "#8bbb11", verdancy700$1 = "#7aa017", verdancy800$1 = "#688c0d", verdancy900$1 = "#58770a", green50$1 = "#effce8", green100$1 = "#dff9d2", green200$1 = "#bff3a5", green300$1 = "#9fed78", green400$1 = "#7fe74b", green500$1 = "#59d01e", green600$1 = "#49b811", green700$1 = "#409f11", green800$1 = "#398712", green900$1 = "#317310", jiqing50$1 = "#e5fffb", jiqing100$1 = "#ccfff7", jiqing200$1 = "#a9fff2", jiqing300$1 = "#78fce8", jiqing400$1 = "#2afede", jiqing500$1 = "#10e8c7", jiqing600$1 = "#00d2b2", jiqing700$1 = "#00b298", jiqing800$1 = "#009e87", jiqing900$1 = "#008b76", blue50$1 = "#e4f4fe", blue100$1 = "#d0edff", blue200$1 = "#9fdaff", blue300$1 = "#62c2ff", blue400$1 = "#2daeff", blue500$1 = "#0b9efb", blue600$1 = "#0493ee", blue700$1 = "#0080d2", blue800$1 = "#006cae", blue900$1 = "#005f9a", hyacinth50$1 = "#e8ecfd", hyacinth100$1 = "#d0d9fb", hyacinth200$1 = "#a2b3f6", hyacinth300$1 = "#738df2", hyacinth400$1 = "#3a60f7", hyacinth500$1 = "#274fee", hyacinth600$1 = "#143ee3", hyacinth700$1 = "#012bd2", hyacinth800$1 = "#0025b7", hyacinth900$1 = "#001f9c", purple50$1 = "#f1eafa", purple100$1 = "#e3d5f6", purple200$1 = "#c7abed", purple300$1 = "#aa82e3", purple400$1 = "#9e6de3", purple500$1 = "#894ede", purple600$1 = "#7735d4", purple700$1 = "#6721cb", purple800$1 = "#510eb0", purple900$1 = "#3f0198", magenta50$1 = "#fde8f3", magenta100$1 = "#fbd0e8", magenta200$1 = "#f6a2d0", magenta300$1 = "#f273b9", magenta400$1 = "#f248a6", magenta500$1 = "#e7258f", magenta600$1 = "#d4157e", magenta700$1 = "#c1026b", magenta800$1 = "#a1095c", magenta900$1 = "#8f0550", grey50$1 = "#f5f5f5", grey100$1 = "#ececec", grey200$1 = "#e5e5e5", grey300$1 = "#d8d8d8", grey400$1 = "#bcbcbc", grey500$1 = "#999999", grey600$1 = "#7a7a7a", grey700$1 = "#656565", grey800$1 = "#565656", grey900$1 = "#4b4b4b", colorBlack$1 = "#1e222b", colorWhite$1 = "#ffffff", boxShadowBase$1 = "0 4px 12px rgba(30, 34, 43, 0.08)", boxShadowLg$1 = "0 4px 24px 0 rgba(30, 34, 43, 0.08)", bgColor$1 = "#ececec", bgColorHover$1 = "#d8d8d8", bgColorSecondary$1 = "#ffffff", textColor$1 = "#1e222b", textColorSecondary$1 = "#7a7a7a", textColorSecondaryDarker$1 = "#4b4b4b", textColorTertiary$1 = "#bcbcbc", borderColor$1 = "#e5e5e5", scrollbarColor$1 = "#bcbcbc", scrollbarColorHover$1 = "#999999", scrollbarColorActive$1 = "#7a7a7a", borderRadiusBase$1 = "4px", borderRadiusLg$1 = "8px", borderRadiusXl$1 = "12px", marginXl$1 = "24px", marginLg$1 = "20px", marginBase$1 = "16px", marginSm$1 = "12px", marginXs$1 = "8px", marginXxs$1 = "4px", paddingXl$1 = "20px", paddingLg$1 = "16px", paddingBase$1 = "12px", paddingSm$1 = "8px", paddingXs$1 = "4px", fontSizeXxl$1 = "20px", fontSizeXl$1 = "18px", fontSizeLg$1 = "16px", fontSizeBase$1 = "15px", fontSizeSm$1 = "14px", fontSizeXs$1 = "13px", fontSizeXxs$1 = "12px", breakpointXs$1 = "768px", breakpointSm$1 = "1024px", breakpointBase$1 = "1280px", breakpointLg$1 = "1536px", infoColor$1 = "#2daeff", successColor$1 = "#59d01e", warningColor$1 = "#ffbd37", errorColor$1 = "#fe4b4b", primaryColor$1 = "#274fee", primaryColorHover$1 = "#3a60f7", linkColor$1 = "#0b9efb", loopColor1$1 = "#9e6de3", loopColor2$1 = "#49b811", loopColor3$1 = "#0b9efb", loopColor4$1 = "#ffbd37", loopColor5$1 = "#f273b9", loopColor6$1 = "#00d2b2", loopColor7$1 = "#ff8c51", loopColor8$1 = "#565656", loopColor9$1 = "#274fee", loopColor10$1 = "#fa7979", loopColor11$1 = "#8bbb11", loopColor12$1 = "#d8b300", default_module = {
+}, "Switch"), red50$1 = "#fee7e7", red100$1 = "#fdcece", red200$1 = "#fb9d9d", red300$1 = "#fa7979", red400$1 = "#fe4b4b", red500$1 = "#f30b0b", red600$1 = "#e30909", red700$1 = "#cd0f0f", red800$1 = "#b20000", red900$1 = "#9d0000", orange50$1 = "#fef0e6", orange100$1 = "#fee1cd", orange200$1 = "#fdc49b", orange300$1 = "#fca669", orange400$1 = "#ff8c51", orange500$1 = "#fb8937", orange600$1 = "#f96800", orange700$1 = "#df5d00", orange800$1 = "#cc4f10", orange900$1 = "#b24000", gold50$1 = "#fef6e6", gold100$1 = "#feeecd", gold200$1 = "#fddc9b", gold300$1 = "#fccb69", gold400$1 = "#ffbd37", gold500$1 = "#faad14", gold600$1 = "#e59b07", gold700$1 = "#c68400", gold800$1 = "#a97100", gold900$1 = "#8f5f00", yellow50$1 = "#fefbe6", yellow100$1 = "#fef7cd", yellow200$1 = "#fdf09b", yellow300$1 = "#fce869", yellow400$1 = "#fbe137", yellow500$1 = "#f9d700", yellow600$1 = "#ebc301", yellow700$1 = "#d8b300", yellow800$1 = "#c5a300", yellow900$1 = "#b19401", verdancy50$1 = "#f7fde8", verdancy100$1 = "#effbd0", verdancy200$1 = "#def6a2", verdancy300$1 = "#cef273", verdancy400$1 = "#beee44", verdancy500$1 = "#a4dc16", verdancy600$1 = "#8bbb11", verdancy700$1 = "#7aa017", verdancy800$1 = "#688c0d", verdancy900$1 = "#58770a", green50$1 = "#effce8", green100$1 = "#dff9d2", green200$1 = "#bff3a5", green300$1 = "#9fed78", green400$1 = "#7fe74b", green500$1 = "#59d01e", green600$1 = "#49b811", green700$1 = "#409f11", green800$1 = "#398712", green900$1 = "#317310", jiqing50$1 = "#e5fffb", jiqing100$1 = "#ccfff7", jiqing200$1 = "#a9fff2", jiqing300$1 = "#78fce8", jiqing400$1 = "#2afede", jiqing500$1 = "#10e8c7", jiqing600$1 = "#00d2b2", jiqing700$1 = "#00b298", jiqing800$1 = "#009e87", jiqing900$1 = "#008b76", blue50$1 = "#e4f4fe", blue100$1 = "#d0edff", blue200$1 = "#9fdaff", blue300$1 = "#62c2ff", blue400$1 = "#2daeff", blue500$1 = "#0b9efb", blue600$1 = "#0493ee", blue700$1 = "#0080d2", blue800$1 = "#006cae", blue900$1 = "#005f9a", hyacinth50$1 = "#e8ecfd", hyacinth100$1 = "#d0d9fb", hyacinth200$1 = "#a2b3f6", hyacinth300$1 = "#738df2", hyacinth400$1 = "#3a60f7", hyacinth500$1 = "#274fee", hyacinth600$1 = "#143ee3", hyacinth700$1 = "#012bd2", hyacinth800$1 = "#0025b7", hyacinth900$1 = "#001f9c", purple50$1 = "#f1eafa", purple100$1 = "#e3d5f6", purple200$1 = "#c7abed", purple300$1 = "#aa82e3", purple400$1 = "#9e6de3", purple500$1 = "#894ede", purple600$1 = "#7735d4", purple700$1 = "#6721cb", purple800$1 = "#510eb0", purple900$1 = "#3f0198", magenta50$1 = "#fde8f3", magenta100$1 = "#fbd0e8", magenta200$1 = "#f6a2d0", magenta300$1 = "#f273b9", magenta400$1 = "#f248a6", magenta500$1 = "#e7258f", magenta600$1 = "#d4157e", magenta700$1 = "#c1026b", magenta800$1 = "#a1095c", magenta900$1 = "#8f0550", grey50$1 = "#f5f5f5", grey100$1 = "#ececec", grey200$1 = "#e5e5e5", grey300$1 = "#d8d8d8", grey400$1 = "#bcbcbc", grey500$1 = "#999999", grey600$1 = "#7a7a7a", grey700$1 = "#656565", grey800$1 = "#565656", grey900$1 = "#4b4b4b", colorBlack$1 = "#1e222b", colorWhite$1 = "#ffffff", boxShadowBase$1 = "0 4px 12px rgba(30, 34, 43, 0.08)", boxShadowLg$1 = "0 4px 24px 0 rgba(30, 34, 43, 0.08)", bgColor$1 = "#ececec", bgColorHover$1 = "#d8d8d8", bgColorSecondary$1 = "#ffffff", bgColorOverlay$1 = "#ffffff", textColor$1 = "#1e222b", textColorSecondary$1 = "#7a7a7a", textColorSecondaryDarker$1 = "#4b4b4b", textColorTertiary$1 = "#bcbcbc", borderColor$1 = "#e5e5e5", scrollbarColor$1 = "#bcbcbc", scrollbarColorHover$1 = "#999999", scrollbarColorActive$1 = "#7a7a7a", borderRadiusBase$1 = "4px", borderRadiusLg$1 = "8px", borderRadiusXl$1 = "12px", marginXl$1 = "24px", marginLg$1 = "20px", marginBase$1 = "16px", marginSm$1 = "12px", marginXs$1 = "8px", marginXxs$1 = "4px", paddingXl$1 = "20px", paddingLg$1 = "16px", paddingBase$1 = "12px", paddingSm$1 = "8px", paddingXs$1 = "4px", fontSizeXxl$1 = "20px", fontSizeXl$1 = "18px", fontSizeLg$1 = "16px", fontSizeBase$1 = "15px", fontSizeSm$1 = "14px", fontSizeXs$1 = "13px", fontSizeXxs$1 = "12px", breakpointXs$1 = "768px", breakpointSm$1 = "1024px", breakpointBase$1 = "1280px", breakpointLg$1 = "1536px", infoColor$1 = "#2daeff", successColor$1 = "#59d01e", warningColor$1 = "#ffbd37", errorColor$1 = "#fe4b4b", primaryColor$1 = "#274fee", primaryColorHover$1 = "#3a60f7", linkColor$1 = "#0b9efb", loopColor1$1 = "#9e6de3", loopColor2$1 = "#49b811", loopColor3$1 = "#0b9efb", loopColor4$1 = "#ffbd37", loopColor5$1 = "#f273b9", loopColor6$1 = "#00d2b2", loopColor7$1 = "#ff8c51", loopColor8$1 = "#565656", loopColor9$1 = "#274fee", loopColor10$1 = "#fa7979", loopColor11$1 = "#8bbb11", loopColor12$1 = "#d8b300", default_module = {
   red50: red50$1,
   red100: red100$1,
   red200: red200$1,
@@ -15469,6 +15795,7 @@ const switchWrapper = "univer-switch-wrapper", slider = "univer-slider", styles$
   bgColor: bgColor$1,
   bgColorHover: bgColorHover$1,
   bgColorSecondary: bgColorSecondary$1,
+  bgColorOverlay: bgColorOverlay$1,
   textColor: textColor$1,
   textColorSecondary: textColorSecondary$1,
   textColorSecondaryDarker: textColorSecondaryDarker$1,
@@ -15521,7 +15848,7 @@ const switchWrapper = "univer-switch-wrapper", slider = "univer-slider", styles$
   loopColor10: loopColor10$1,
   loopColor11: loopColor11$1,
   loopColor12: loopColor12$1
-}, red50 = "#fee7e7", red100 = "#fdcece", red200 = "#fb9d9d", red300 = "#fa7979", red400 = "#fe4b4b", red500 = "#f30b0b", red600 = "#e30909", red700 = "#cd0f0f", red800 = "#b20000", red900 = "#9d0000", orange50 = "#fef0e6", orange100 = "#fee1cd", orange200 = "#fdc49b", orange300 = "#fca669", orange400 = "#ff8c51", orange500 = "#fb8937", orange600 = "#f96800", orange700 = "#df5d00", orange800 = "#cc4f10", orange900 = "#b24000", gold50 = "#fef6e6", gold100 = "#feeecd", gold200 = "#fddc9b", gold300 = "#fccb69", gold400 = "#ffbd37", gold500 = "#faad14", gold600 = "#e59b07", gold700 = "#c68400", gold800 = "#a97100", gold900 = "#8f5f00", yellow50 = "#fefbe6", yellow100 = "#fef7cd", yellow200 = "#fdf09b", yellow300 = "#fce869", yellow400 = "#fbe137", yellow500 = "#f9d700", yellow600 = "#ebc301", yellow700 = "#d8b300", yellow800 = "#c5a300", yellow900 = "#b19401", verdancy50 = "#f7fde8", verdancy100 = "#effbd0", verdancy200 = "#def6a2", verdancy300 = "#cef273", verdancy400 = "#beee44", verdancy500 = "#a4dc16", verdancy600 = "#8bbb11", verdancy700 = "#7aa017", verdancy800 = "#688c0d", verdancy900 = "#58770a", green50 = "#effce8", green100 = "#dff9d2", green200 = "#bff3a5", green300 = "#9fed78", green400 = "#7fe74b", green500 = "#59d01e", green600 = "#49b811", green700 = "#409f11", green800 = "#398712", green900 = "#317310", jiqing50 = "#e5fffb", jiqing100 = "#ccfff7", jiqing200 = "#a9fff2", jiqing300 = "#78fce8", jiqing400 = "#2afede", jiqing500 = "#10e8c7", jiqing600 = "#00d2b2", jiqing700 = "#00b298", jiqing800 = "#009e87", jiqing900 = "#008b76", blue50 = "#e4f4fe", blue100 = "#d0edff", blue200 = "#9fdaff", blue300 = "#62c2ff", blue400 = "#2daeff", blue500 = "#0b9efb", blue600 = "#0493ee", blue700 = "#0080d2", blue800 = "#006cae", blue900 = "#005f9a", hyacinth50 = "#e8ecfd", hyacinth100 = "#d0d9fb", hyacinth200 = "#a2b3f6", hyacinth300 = "#738df2", hyacinth400 = "#3a60f7", hyacinth500 = "#274fee", hyacinth600 = "#143ee3", hyacinth700 = "#012bd2", hyacinth800 = "#0025b7", hyacinth900 = "#001f9c", purple50 = "#f1eafa", purple100 = "#e3d5f6", purple200 = "#c7abed", purple300 = "#aa82e3", purple400 = "#9e6de3", purple500 = "#894ede", purple600 = "#7735d4", purple700 = "#6721cb", purple800 = "#510eb0", purple900 = "#3f0198", magenta50 = "#fde8f3", magenta100 = "#fbd0e8", magenta200 = "#f6a2d0", magenta300 = "#f273b9", magenta400 = "#f248a6", magenta500 = "#e7258f", magenta600 = "#d4157e", magenta700 = "#c1026b", magenta800 = "#a1095c", magenta900 = "#8f0550", grey50 = "#f5f5f5", grey100 = "#ececec", grey200 = "#e5e5e5", grey300 = "#d8d8d8", grey400 = "#bcbcbc", grey500 = "#999999", grey600 = "#7a7a7a", grey700 = "#656565", grey800 = "#565656", grey900 = "#4b4b4b", colorBlack = "#1e222b", colorWhite = "#ffffff", boxShadowBase = "0 4px 12px rgba(30, 34, 43, 0.08)", boxShadowLg = "0 4px 24px 0 rgba(30, 34, 43, 0.08)", bgColor = "#ececec", bgColorHover = "#d8d8d8", bgColorSecondary = "#ffffff", textColor = "#1e222b", textColorSecondary = "#7a7a7a", textColorSecondaryDarker = "#4b4b4b", textColorTertiary = "#bcbcbc", borderColor = "#e5e5e5", scrollbarColor = "#bcbcbc", scrollbarColorHover = "#999999", scrollbarColorActive = "#7a7a7a", borderRadiusBase = "4px", borderRadiusLg = "8px", borderRadiusXl = "12px", marginXl = "24px", marginLg = "20px", marginBase = "16px", marginSm = "12px", marginXs = "8px", marginXxs = "4px", paddingXl = "20px", paddingLg = "16px", paddingBase = "12px", paddingSm = "8px", paddingXs = "4px", fontSizeXxl = "20px", fontSizeXl = "18px", fontSizeLg = "16px", fontSizeBase = "15px", fontSizeSm = "14px", fontSizeXs = "13px", fontSizeXxs = "12px", breakpointXs = "768px", breakpointSm = "1024px", breakpointBase = "1280px", breakpointLg = "1536px", infoColor = "#2daeff", successColor = "#59d01e", warningColor = "#ffbd37", errorColor = "#fe4b4b", primaryColor = "#409f11", primaryColorHover = "#49b811", linkColor = "#0b9efb", loopColor1 = "#9e6de3", loopColor2 = "#49b811", loopColor3 = "#0b9efb", loopColor4 = "#ffbd37", loopColor5 = "#f273b9", loopColor6 = "#00d2b2", loopColor7 = "#ff8c51", loopColor8 = "#565656", loopColor9 = "#274fee", loopColor10 = "#fa7979", loopColor11 = "#8bbb11", loopColor12 = "#d8b300", green_module = {
+}, red50 = "#fee7e7", red100 = "#fdcece", red200 = "#fb9d9d", red300 = "#fa7979", red400 = "#fe4b4b", red500 = "#f30b0b", red600 = "#e30909", red700 = "#cd0f0f", red800 = "#b20000", red900 = "#9d0000", orange50 = "#fef0e6", orange100 = "#fee1cd", orange200 = "#fdc49b", orange300 = "#fca669", orange400 = "#ff8c51", orange500 = "#fb8937", orange600 = "#f96800", orange700 = "#df5d00", orange800 = "#cc4f10", orange900 = "#b24000", gold50 = "#fef6e6", gold100 = "#feeecd", gold200 = "#fddc9b", gold300 = "#fccb69", gold400 = "#ffbd37", gold500 = "#faad14", gold600 = "#e59b07", gold700 = "#c68400", gold800 = "#a97100", gold900 = "#8f5f00", yellow50 = "#fefbe6", yellow100 = "#fef7cd", yellow200 = "#fdf09b", yellow300 = "#fce869", yellow400 = "#fbe137", yellow500 = "#f9d700", yellow600 = "#ebc301", yellow700 = "#d8b300", yellow800 = "#c5a300", yellow900 = "#b19401", verdancy50 = "#f7fde8", verdancy100 = "#effbd0", verdancy200 = "#def6a2", verdancy300 = "#cef273", verdancy400 = "#beee44", verdancy500 = "#a4dc16", verdancy600 = "#8bbb11", verdancy700 = "#7aa017", verdancy800 = "#688c0d", verdancy900 = "#58770a", green50 = "#effce8", green100 = "#dff9d2", green200 = "#bff3a5", green300 = "#9fed78", green400 = "#7fe74b", green500 = "#59d01e", green600 = "#49b811", green700 = "#409f11", green800 = "#398712", green900 = "#317310", jiqing50 = "#e5fffb", jiqing100 = "#ccfff7", jiqing200 = "#a9fff2", jiqing300 = "#78fce8", jiqing400 = "#2afede", jiqing500 = "#10e8c7", jiqing600 = "#00d2b2", jiqing700 = "#00b298", jiqing800 = "#009e87", jiqing900 = "#008b76", blue50 = "#e4f4fe", blue100 = "#d0edff", blue200 = "#9fdaff", blue300 = "#62c2ff", blue400 = "#2daeff", blue500 = "#0b9efb", blue600 = "#0493ee", blue700 = "#0080d2", blue800 = "#006cae", blue900 = "#005f9a", hyacinth50 = "#e8ecfd", hyacinth100 = "#d0d9fb", hyacinth200 = "#a2b3f6", hyacinth300 = "#738df2", hyacinth400 = "#3a60f7", hyacinth500 = "#274fee", hyacinth600 = "#143ee3", hyacinth700 = "#012bd2", hyacinth800 = "#0025b7", hyacinth900 = "#001f9c", purple50 = "#f1eafa", purple100 = "#e3d5f6", purple200 = "#c7abed", purple300 = "#aa82e3", purple400 = "#9e6de3", purple500 = "#894ede", purple600 = "#7735d4", purple700 = "#6721cb", purple800 = "#510eb0", purple900 = "#3f0198", magenta50 = "#fde8f3", magenta100 = "#fbd0e8", magenta200 = "#f6a2d0", magenta300 = "#f273b9", magenta400 = "#f248a6", magenta500 = "#e7258f", magenta600 = "#d4157e", magenta700 = "#c1026b", magenta800 = "#a1095c", magenta900 = "#8f0550", grey50 = "#f5f5f5", grey100 = "#ececec", grey200 = "#e5e5e5", grey300 = "#d8d8d8", grey400 = "#bcbcbc", grey500 = "#999999", grey600 = "#7a7a7a", grey700 = "#656565", grey800 = "#565656", grey900 = "#4b4b4b", colorBlack = "#1e222b", colorWhite = "#ffffff", boxShadowBase = "0 4px 12px rgba(30, 34, 43, 0.08)", boxShadowLg = "0 4px 24px 0 rgba(30, 34, 43, 0.08)", bgColor = "#ececec", bgColorHover = "#d8d8d8", bgColorSecondary = "#ffffff", bgColorOverlay = "#ffffff", textColor = "#1e222b", textColorSecondary = "#7a7a7a", textColorSecondaryDarker = "#4b4b4b", textColorTertiary = "#bcbcbc", borderColor = "#e5e5e5", scrollbarColor = "#bcbcbc", scrollbarColorHover = "#999999", scrollbarColorActive = "#7a7a7a", borderRadiusBase = "4px", borderRadiusLg = "8px", borderRadiusXl = "12px", marginXl = "24px", marginLg = "20px", marginBase = "16px", marginSm = "12px", marginXs = "8px", marginXxs = "4px", paddingXl = "20px", paddingLg = "16px", paddingBase = "12px", paddingSm = "8px", paddingXs = "4px", fontSizeXxl = "20px", fontSizeXl = "18px", fontSizeLg = "16px", fontSizeBase = "15px", fontSizeSm = "14px", fontSizeXs = "13px", fontSizeXxs = "12px", breakpointXs = "768px", breakpointSm = "1024px", breakpointBase = "1280px", breakpointLg = "1536px", infoColor = "#2daeff", successColor = "#59d01e", warningColor = "#ffbd37", errorColor = "#fe4b4b", primaryColor = "#409f11", primaryColorHover = "#49b811", linkColor = "#0b9efb", loopColor1 = "#9e6de3", loopColor2 = "#49b811", loopColor3 = "#0b9efb", loopColor4 = "#ffbd37", loopColor5 = "#f273b9", loopColor6 = "#00d2b2", loopColor7 = "#ff8c51", loopColor8 = "#565656", loopColor9 = "#274fee", loopColor10 = "#fa7979", loopColor11 = "#8bbb11", loopColor12 = "#d8b300", green_module = {
   red50,
   red100,
   red200,
@@ -15649,6 +15976,7 @@ const switchWrapper = "univer-switch-wrapper", slider = "univer-slider", styles$
   bgColor,
   bgColorHover,
   bgColorSecondary,
+  bgColorOverlay,
   textColor,
   textColorSecondary,
   textColorSecondaryDarker,
@@ -18579,7 +18907,7 @@ var _excluded$2 = ["prefixCls", "defaultValue", "value", "autoSize", "onResize",
   React__default.useEffect(function() {
     if (selection) {
       var _getTextArea;
-      (_getTextArea = getTextArea()).setSelectionRange.apply(_getTextArea, _toConsumableArray$3(selection));
+      (_getTextArea = getTextArea()).setSelectionRange.apply(_getTextArea, _toConsumableArray$4(selection));
     }
   }, [selection]);
   var countConfig = useCount(count, showCount), mergedMax = (_countConfig$max = countConfig.max) !== null && _countConfig$max !== void 0 ? _countConfig$max : maxLength, hasMaxLength = Number(mergedMax) > 0, valueLength = countConfig.strategy(formatValue2), isOutOfRange = !!mergedMax && valueLength > mergedMax, triggerChange = /* @__PURE__ */ __name(function(e2, currentValue) {