rsuite 5.3.0 → 5.4.3

package/dist/rsuite.js

@@ -1506,7 +1506,7 @@ eval("\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _insertCs
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _getOffset = _interopRequireDefault(__webpack_require__(/*! dom-lib/getOffset */ \"./node_modules/dom-lib/esm/getOffset.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Affix/Affix.tsx\",\n    _this = void 0;\n\n/**\n * Get the layout size and offset of the mount element\n */\nfunction useOffset(mountRef) {\n  var _useState = (0, _react.useState)(null),\n      offset = _useState[0],\n      setOffset = _useState[1];\n\n  var updateOffset = (0, _react.useCallback)(function () {\n    setOffset((0, _getOffset.default)(mountRef.current));\n  }, [mountRef]); // Update after the element size changes\n\n  (0, _utils.useElementResize)(function () {\n    return mountRef.current;\n  }, updateOffset); // Initialize after the first render\n\n  (0, _react.useEffect)(updateOffset, [updateOffset]);\n  return offset;\n}\n/**\n * Get the layout size and offset of the container element\n * @param container\n */\n\n\nfunction useContainerOffset(container) {\n  var _useState2 = (0, _react.useState)(null),\n      offset = _useState2[0],\n      setOffset = _useState2[1];\n\n  (0, _react.useEffect)(function () {\n    var node = typeof container === 'function' ? container() : container;\n    setOffset(node ? (0, _getOffset.default)(node) : null);\n  }, [container]);\n  return offset;\n}\n/**\n * Check whether the current element should be in a fixed state.\n * @param offset\n * @param containerOffset\n * @param props\n */\n\n\nfunction useFixed(offset, containerOffset, props) {\n  var top = props.top,\n      onChange = props.onChange;\n\n  var _useState3 = (0, _react.useState)(false),\n      fixed = _useState3[0],\n      setFixed = _useState3[1];\n\n  var handleScroll = (0, _react.useCallback)(function () {\n    if (!offset) {\n      return;\n    }\n\n    var scrollY = window.scrollY || window.pageYOffset; // When the scroll distance exceeds the element's top value, it is fixed.\n\n    var nextFixed = scrollY - (Number(offset.top) - Number(top)) >= 0; // If the current element is specified in the container,\n    // add to determine whether the current container is in the window range.\n\n    if (containerOffset) {\n      nextFixed = nextFixed && scrollY < Number(containerOffset.top) + Number(containerOffset.height);\n    }\n\n    if (nextFixed !== fixed) {\n      setFixed(nextFixed);\n      onChange === null || onChange === void 0 ? void 0 : onChange(nextFixed);\n    }\n  }, [fixed, offset, containerOffset, onChange, top]); // Add scroll event to window\n\n  (0, _utils.useEventListener)(window, 'scroll', handleScroll, false);\n  return fixed;\n}\n\nvar Affix = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _merge;\n\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'affix' : _props$classPrefix,\n      className = props.className,\n      children = props.children,\n      container = props.container,\n      _props$top = props.top,\n      top = _props$top === void 0 ? 0 : _props$top,\n      onChange = props.onChange,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"className\", \"children\", \"container\", \"top\", \"onChange\"]);\n  var mountRef = (0, _react.useRef)(null);\n  var offset = useOffset(mountRef);\n  var containerOffset = useContainerOffset(container);\n  var fixed = useFixed(offset, containerOffset, {\n    top: top,\n    onChange: onChange\n  });\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var classes = merge(className, (_merge = {}, _merge[withClassPrefix()] = fixed, _merge));\n  var placeholderStyles = fixed ? {\n    width: offset === null || offset === void 0 ? void 0 : offset.width,\n    height: offset === null || offset === void 0 ? void 0 : offset.height\n  } : undefined;\n  var fixedStyles = {\n    position: 'fixed',\n    top: top,\n    left: offset === null || offset === void 0 ? void 0 : offset.left,\n    width: offset === null || offset === void 0 ? void 0 : offset.width,\n    zIndex: 10\n  };\n  var affixStyles = fixed ? fixedStyles : undefined;\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: (0, _utils.mergeRefs)(mountRef, ref),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 124,\n      columnNumber: 7\n    }\n  }), /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: classes,\n    style: affixStyles,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 125,\n      columnNumber: 9\n    }\n  }, children), fixed && /*#__PURE__*/_react.default.createElement(\"div\", {\n    \"aria-hidden\": true,\n    style: placeholderStyles,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 128,\n      columnNumber: 19\n    }\n  }));\n});\n\nAffix.displayName = 'Affix';\nAffix.propTypes = {\n  top: _propTypes.default.number,\n  onChange: _propTypes.default.func,\n  container: _propTypes.default.oneOfType([_propTypes.default.any, _propTypes.default.func])\n};\nvar _default = Affix;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Affix/Affix.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _getOffset = _interopRequireDefault(__webpack_require__(/*! dom-lib/getOffset */ \"./node_modules/dom-lib/esm/getOffset.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Affix/Affix.tsx\",\n    _this = void 0;\n\n/**\n * Get the layout size and offset of the mount element\n */\nfunction useOffset(mountRef) {\n  var _useState = (0, _react.useState)(null),\n      offset = _useState[0],\n      setOffset = _useState[1];\n\n  var updateOffset = (0, _react.useCallback)(function () {\n    setOffset((0, _getOffset.default)(mountRef.current));\n  }, [mountRef]); // Update after the element size changes\n\n  (0, _utils.useElementResize)(function () {\n    return mountRef.current;\n  }, updateOffset); // Initialize after the first render\n\n  (0, _utils.useMount)(updateOffset); // Update after window size changes\n\n  (0, _utils.useEventListener)(window, 'resize', updateOffset, false);\n  return offset;\n}\n/**\n * Get the layout size and offset of the container element\n * @param container\n */\n\n\nfunction useContainerOffset(container) {\n  var _useState2 = (0, _react.useState)(null),\n      offset = _useState2[0],\n      setOffset = _useState2[1];\n\n  (0, _react.useEffect)(function () {\n    var node = typeof container === 'function' ? container() : container;\n    setOffset(node ? (0, _getOffset.default)(node) : null);\n  }, [container]);\n  return offset;\n}\n/**\n * Check whether the current element should be in a fixed state.\n * @param offset\n * @param containerOffset\n * @param props\n */\n\n\nfunction useFixed(offset, containerOffset, props) {\n  var top = props.top,\n      onChange = props.onChange;\n\n  var _useState3 = (0, _react.useState)(false),\n      fixed = _useState3[0],\n      setFixed = _useState3[1];\n\n  var handleScroll = (0, _react.useCallback)(function () {\n    if (!offset) {\n      return;\n    }\n\n    var scrollY = window.scrollY || window.pageYOffset; // When the scroll distance exceeds the element's top value, it is fixed.\n\n    var nextFixed = scrollY - (Number(offset.top) - Number(top)) >= 0; // If the current element is specified in the container,\n    // add to determine whether the current container is in the window range.\n\n    if (containerOffset) {\n      nextFixed = nextFixed && scrollY < Number(containerOffset.top) + Number(containerOffset.height);\n    }\n\n    if (nextFixed !== fixed) {\n      setFixed(nextFixed);\n      onChange === null || onChange === void 0 ? void 0 : onChange(nextFixed);\n    }\n  }, [fixed, offset, containerOffset, onChange, top]); // Add scroll event to window\n\n  (0, _utils.useEventListener)(window, 'scroll', handleScroll, false);\n  return fixed;\n}\n\nvar Affix = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _merge;\n\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'affix' : _props$classPrefix,\n      className = props.className,\n      children = props.children,\n      container = props.container,\n      _props$top = props.top,\n      top = _props$top === void 0 ? 0 : _props$top,\n      onChange = props.onChange,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"className\", \"children\", \"container\", \"top\", \"onChange\"]);\n  var mountRef = (0, _react.useRef)(null);\n  var offset = useOffset(mountRef);\n  var containerOffset = useContainerOffset(container);\n  var fixed = useFixed(offset, containerOffset, {\n    top: top,\n    onChange: onChange\n  });\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var classes = merge(className, (_merge = {}, _merge[withClassPrefix()] = fixed, _merge));\n  var placeholderStyles = fixed ? {\n    width: offset === null || offset === void 0 ? void 0 : offset.width,\n    height: offset === null || offset === void 0 ? void 0 : offset.height\n  } : undefined;\n  var fixedStyles = {\n    position: 'fixed',\n    top: top,\n    left: offset === null || offset === void 0 ? void 0 : offset.left,\n    width: offset === null || offset === void 0 ? void 0 : offset.width,\n    zIndex: 10\n  };\n  var affixStyles = fixed ? fixedStyles : undefined;\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: (0, _utils.mergeRefs)(mountRef, ref),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 128,\n      columnNumber: 7\n    }\n  }), /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: classes,\n    style: affixStyles,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 129,\n      columnNumber: 9\n    }\n  }, children), fixed && /*#__PURE__*/_react.default.createElement(\"div\", {\n    \"aria-hidden\": true,\n    style: placeholderStyles,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 132,\n      columnNumber: 19\n    }\n  }));\n});\n\nAffix.displayName = 'Affix';\nAffix.propTypes = {\n  top: _propTypes.default.number,\n  onChange: _propTypes.default.func,\n  container: _propTypes.default.oneOfType([_propTypes.default.any, _propTypes.default.func])\n};\nvar _default = Affix;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Affix/Affix.tsx?");
 
 /***/ }),
 
@@ -1660,7 +1660,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = exports.AvatarGroupContext = void 0;\n\nvar _extends3 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/AvatarGroup/AvatarGroup.tsx\",\n    _this = void 0;\n\nvar AvatarGroupContext = /*#__PURE__*/_react.default.createContext({});\n\nexports.AvatarGroupContext = AvatarGroupContext;\n\nvar AvatarGroup = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'avatar-group' : _props$classPrefix,\n      spacing = props.spacing,\n      className = props.className,\n      children = props.children,\n      stack = props.stack,\n      size = props.size,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"spacing\", \"className\", \"children\", \"stack\", \"size\"]);\n\n  var _useCustom = (0, _utils.useCustom)('AvatarGroup'),\n      rtl = _useCustom.rtl;\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var classes = merge(className, withClassPrefix({\n    stack: stack\n  }));\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends3.default)({}, rest, {\n    ref: ref,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 37,\n      columnNumber: 7\n    }\n  }), /*#__PURE__*/_react.default.createElement(AvatarGroupContext.Provider, {\n    value: {\n      size: size\n    },\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 38,\n      columnNumber: 9\n    }\n  }, spacing ? _react.default.Children.map(children, function (child) {\n    var _extends2;\n\n    return /*#__PURE__*/_react.default.cloneElement(child, {\n      style: (0, _extends3.default)((_extends2 = {}, _extends2[rtl ? 'marginLeft' : 'marginRight'] = spacing, _extends2), child.props.style)\n    });\n  }) : children));\n});\n\nAvatarGroup.displayName = 'AvatarGroup';\nAvatarGroup.propTypes = {\n  as: _propTypes.default.elementType,\n  classPrefix: _propTypes.default.string,\n  className: _propTypes.default.string,\n  children: _propTypes.default.node,\n  stack: _propTypes.default.bool,\n  spacing: _propTypes.default.number,\n  size: _propTypes.default.oneOf(['lg', 'md', 'sm', 'xs'])\n};\nvar _default = AvatarGroup;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/AvatarGroup/AvatarGroup.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = exports.AvatarGroupContext = void 0;\n\nvar _extends3 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/AvatarGroup/AvatarGroup.tsx\",\n    _this = void 0;\n\nvar AvatarGroupContext = /*#__PURE__*/_react.default.createContext({});\n\nexports.AvatarGroupContext = AvatarGroupContext;\n\nvar AvatarGroup = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'avatar-group' : _props$classPrefix,\n      spacing = props.spacing,\n      className = props.className,\n      children = props.children,\n      stack = props.stack,\n      size = props.size,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"spacing\", \"className\", \"children\", \"stack\", \"size\"]);\n\n  var _useCustom = (0, _utils.useCustom)('AvatarGroup'),\n      rtl = _useCustom.rtl;\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var classes = merge(className, withClassPrefix({\n    stack: stack\n  }));\n  var contextValue = (0, _react.useMemo)(function () {\n    return {\n      size: size\n    };\n  }, [size]);\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends3.default)({}, rest, {\n    ref: ref,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 38,\n      columnNumber: 7\n    }\n  }), /*#__PURE__*/_react.default.createElement(AvatarGroupContext.Provider, {\n    value: contextValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 39,\n      columnNumber: 9\n    }\n  }, spacing ? _react.default.Children.map(children, function (child) {\n    var _extends2;\n\n    return /*#__PURE__*/_react.default.cloneElement(child, {\n      style: (0, _extends3.default)((_extends2 = {}, _extends2[rtl ? 'marginLeft' : 'marginRight'] = spacing, _extends2), child.props.style)\n    });\n  }) : children));\n});\n\nAvatarGroup.displayName = 'AvatarGroup';\nAvatarGroup.propTypes = {\n  as: _propTypes.default.elementType,\n  classPrefix: _propTypes.default.string,\n  className: _propTypes.default.string,\n  children: _propTypes.default.node,\n  stack: _propTypes.default.bool,\n  spacing: _propTypes.default.number,\n  size: _propTypes.default.oneOf(['lg', 'md', 'sm', 'xs'])\n};\nvar _default = AvatarGroup;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/AvatarGroup/AvatarGroup.tsx?");
 
 /***/ }),
 
@@ -1759,7 +1759,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _ButtonGroupContext = _interopRequireDefault(__webpack_require__(/*! ./ButtonGroupContext */ \"./src/ButtonGroup/ButtonGroupContext.ts\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/ButtonGroup/ButtonGroup.tsx\",\n    _this = void 0;\n\nvar ButtonGroup = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'btn-group' : _props$classPrefix,\n      _props$role = props.role,\n      role = _props$role === void 0 ? 'group' : _props$role,\n      className = props.className,\n      children = props.children,\n      block = props.block,\n      vertical = props.vertical,\n      justified = props.justified,\n      size = props.size,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"role\", \"className\", \"children\", \"block\", \"vertical\", \"justified\", \"size\"]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var classes = merge(className, withClassPrefix(size, {\n    block: block,\n    vertical: vertical,\n    justified: justified\n  }));\n  return /*#__PURE__*/_react.default.createElement(_ButtonGroupContext.default.Provider, {\n    value: {\n      size: size\n    },\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 50,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    role: role,\n    ref: ref,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 51,\n      columnNumber: 9\n    }\n  }), children));\n});\n\nButtonGroup.displayName = 'ButtonGroup';\nButtonGroup.propTypes = {\n  className: _propTypes.default.string,\n  as: _propTypes.default.elementType,\n  classPrefix: _propTypes.default.string,\n  children: _propTypes.default.node,\n  block: _propTypes.default.bool,\n  vertical: _propTypes.default.bool,\n  justified: _propTypes.default.bool,\n  role: _propTypes.default.string,\n  size: _propTypes.default.oneOf(['lg', 'md', 'sm', 'xs'])\n};\nvar _default = ButtonGroup;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/ButtonGroup/ButtonGroup.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _ButtonGroupContext = _interopRequireDefault(__webpack_require__(/*! ./ButtonGroupContext */ \"./src/ButtonGroup/ButtonGroupContext.ts\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/ButtonGroup/ButtonGroup.tsx\",\n    _this = void 0;\n\nvar ButtonGroup = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'btn-group' : _props$classPrefix,\n      _props$role = props.role,\n      role = _props$role === void 0 ? 'group' : _props$role,\n      className = props.className,\n      children = props.children,\n      block = props.block,\n      vertical = props.vertical,\n      justified = props.justified,\n      size = props.size,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"role\", \"className\", \"children\", \"block\", \"vertical\", \"justified\", \"size\"]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var classes = merge(className, withClassPrefix(size, {\n    block: block,\n    vertical: vertical,\n    justified: justified\n  }));\n  var contextValue = (0, _react.useMemo)(function () {\n    return {\n      size: size\n    };\n  }, [size]);\n  return /*#__PURE__*/_react.default.createElement(_ButtonGroupContext.default.Provider, {\n    value: contextValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 51,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    role: role,\n    ref: ref,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 52,\n      columnNumber: 9\n    }\n  }), children));\n});\n\nButtonGroup.displayName = 'ButtonGroup';\nButtonGroup.propTypes = {\n  className: _propTypes.default.string,\n  as: _propTypes.default.elementType,\n  classPrefix: _propTypes.default.string,\n  children: _propTypes.default.node,\n  block: _propTypes.default.bool,\n  vertical: _propTypes.default.bool,\n  justified: _propTypes.default.bool,\n  role: _propTypes.default.string,\n  size: _propTypes.default.oneOf(['lg', 'md', 'sm', 'xs'])\n};\nvar _default = ButtonGroup;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/ButtonGroup/ButtonGroup.tsx?");
 
 /***/ }),
 
@@ -1814,7 +1814,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = exports.CalendarState = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\n\nvar _MonthDropdown = _interopRequireDefault(__webpack_require__(/*! ./MonthDropdown */ \"./src/Calendar/MonthDropdown.tsx\"));\n\nvar _TimeDropdown = _interopRequireDefault(__webpack_require__(/*! ./TimeDropdown */ \"./src/Calendar/TimeDropdown.tsx\"));\n\nvar _View = _interopRequireDefault(__webpack_require__(/*! ./View */ \"./src/Calendar/View.tsx\"));\n\nvar _Header = _interopRequireDefault(__webpack_require__(/*! ./Header */ \"./src/Calendar/Header.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _CalendarContext = __webpack_require__(/*! ./CalendarContext */ \"./src/Calendar/CalendarContext.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Calendar/Calendar.tsx\",\n    _this = void 0;\n\nvar CalendarState;\nexports.CalendarState = CalendarState;\n\n(function (CalendarState) {\n  CalendarState[\"DROP_TIME\"] = \"DROP_TIME\";\n  CalendarState[\"DROP_MONTH\"] = \"DROP_MONTH\";\n})(CalendarState || (exports.CalendarState = CalendarState = {}));\n\nvar Calendar = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'calendar' : _props$classPrefix,\n      calendarState = props.calendarState,\n      dateRange = props.dateRange,\n      disabledBackward = props.disabledBackward,\n      disabledDate = props.disabledDate,\n      disabledForward = props.disabledForward,\n      format = props.format,\n      hoverRangeValue = props.hoverRangeValue,\n      inSameMonth = props.inSameMonth,\n      _props$isoWeek = props.isoWeek,\n      isoWeek = _props$isoWeek === void 0 ? false : _props$isoWeek,\n      limitEndYear = props.limitEndYear,\n      locale = props.locale,\n      onChangePageDate = props.onChangePageDate,\n      onChangePageTime = props.onChangePageTime,\n      onMouseMove = props.onMouseMove,\n      onMoveBackward = props.onMoveBackward,\n      onMoveForward = props.onMoveForward,\n      onSelect = props.onSelect,\n      onToggleMeridian = props.onToggleMeridian,\n      onToggleMonthDropdown = props.onToggleMonthDropdown,\n      onToggleTimeDropdown = props.onToggleTimeDropdown,\n      calendarDate = props.calendarDate,\n      renderCell = props.renderCell,\n      renderTitle = props.renderTitle,\n      renderToolbar = props.renderToolbar,\n      showMeridian = props.showMeridian,\n      showWeekNumbers = props.showWeekNumbers,\n      inline = props.inline,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\", \"calendarState\", \"dateRange\", \"disabledBackward\", \"disabledDate\", \"disabledForward\", \"format\", \"hoverRangeValue\", \"inSameMonth\", \"isoWeek\", \"limitEndYear\", \"locale\", \"onChangePageDate\", \"onChangePageTime\", \"onMouseMove\", \"onMoveBackward\", \"onMoveForward\", \"onSelect\", \"onToggleMeridian\", \"onToggleMonthDropdown\", \"onToggleTimeDropdown\", \"calendarDate\", \"renderCell\", \"renderTitle\", \"renderToolbar\", \"showMeridian\", \"showWeekNumbers\", \"inline\"]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var isDisabledDate = function isDisabledDate(date) {\n    var _disabledDate;\n\n    return (_disabledDate = disabledDate === null || disabledDate === void 0 ? void 0 : disabledDate(date)) !== null && _disabledDate !== void 0 ? _disabledDate : false;\n  };\n\n  var isTimeDisabled = function isTimeDisabled(date) {\n    return _utils.DateUtils.disabledTime(props, date);\n  };\n\n  var handleMoveForward = (0, _react.useCallback)(function () {\n    onMoveForward === null || onMoveForward === void 0 ? void 0 : onMoveForward(_utils.DateUtils.addMonths(calendarDate, 1));\n  }, [onMoveForward, calendarDate]);\n  var handleMoveBackward = (0, _react.useCallback)(function () {\n    onMoveBackward === null || onMoveBackward === void 0 ? void 0 : onMoveBackward(_utils.DateUtils.addMonths(calendarDate, -1));\n  }, [onMoveBackward, calendarDate]);\n\n  var showDate = _utils.DateUtils.shouldDate(format);\n\n  var showTime = _utils.DateUtils.shouldTime(format);\n\n  var showMonth = _utils.DateUtils.shouldMonth(format);\n\n  var onlyShowTime = showTime && !showDate && !showMonth;\n  var onlyShowMonth = showMonth && !showDate && !showTime;\n  var dropTime = calendarState === CalendarState.DROP_TIME || onlyShowTime;\n  var dropMonth = calendarState === CalendarState.DROP_MONTH || onlyShowMonth;\n  var inSameThisMonthDate = (0, _react.useCallback)(function (date) {\n    return (0, _utils.composeFunctions)(function (d) {\n      return _utils.DateUtils.setDate(d, 1);\n    }, function (d) {\n      return _utils.DateUtils.isSameMonth(d, date);\n    })(date);\n  }, []);\n  var calendarClasses = merge(className, withClassPrefix({\n    'show-time-dropdown': dropTime,\n    'show-month-dropdown': dropMonth,\n    'show-week-numbers': showWeekNumbers\n  }));\n  var timeDropdownProps = (0, _pick.default)(rest, _utils.DateUtils.calendarOnlyProps);\n  var contextValue = {\n    date: calendarDate,\n    dateRange: dateRange,\n    disabledDate: isDisabledDate,\n    format: format,\n    hoverRangeValue: hoverRangeValue,\n    inSameMonth: inSameMonth !== null && inSameMonth !== void 0 ? inSameMonth : inSameThisMonthDate,\n    isoWeek: isoWeek,\n    locale: locale,\n    onChangePageDate: onChangePageDate,\n    onChangePageTime: onChangePageTime,\n    onMouseMove: onMouseMove,\n    onSelect: onSelect,\n    renderCell: renderCell,\n    showWeekNumbers: showWeekNumbers,\n    inline: inline\n  };\n  return /*#__PURE__*/_react.default.createElement(_CalendarContext.CalendarProvider, {\n    value: contextValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 188,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, _utils.DateUtils.omitHideDisabledProps(rest), {\n    role: \"table\",\n    className: calendarClasses,\n    ref: ref,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 189,\n      columnNumber: 9\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Header.default, {\n    showMonth: showMonth,\n    showDate: showDate,\n    showTime: showTime,\n    showMeridian: showMeridian,\n    disabledTime: isTimeDisabled,\n    onMoveForward: handleMoveForward,\n    onMoveBackward: handleMoveBackward,\n    onToggleMonthDropdown: onToggleMonthDropdown,\n    onToggleTimeDropdown: onToggleTimeDropdown,\n    onToggleMeridian: onToggleMeridian,\n    renderTitle: renderTitle,\n    renderToolbar: renderToolbar,\n    disabledBackward: disabledBackward,\n    disabledForward: disabledForward,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 195,\n      columnNumber: 11\n    }\n  }), showDate && /*#__PURE__*/_react.default.createElement(_View.default, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 211,\n      columnNumber: 24\n    }\n  }), showMonth && /*#__PURE__*/_react.default.createElement(_MonthDropdown.default, {\n    show: dropMonth,\n    limitEndYear: limitEndYear,\n    disabledMonth: isDisabledDate,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 213,\n      columnNumber: 13\n    }\n  }), showTime && /*#__PURE__*/_react.default.createElement(_TimeDropdown.default, (0, _extends2.default)({}, timeDropdownProps, {\n    show: dropTime,\n    showMeridian: showMeridian,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 220,\n      columnNumber: 13\n    }\n  }))));\n});\n\nCalendar.displayName = 'Calendar';\nCalendar.propTypes = {\n  calendarState: _propTypes.default.oneOf(Object.values(CalendarState)),\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string,\n  disabledDate: _propTypes.default.func,\n  disabledHours: _propTypes.default.func,\n  disabledMinutes: _propTypes.default.func,\n  disabledSeconds: _propTypes.default.func,\n  format: _propTypes.default.string,\n  hideHours: _propTypes.default.func,\n  hideMinutes: _propTypes.default.func,\n  hideSeconds: _propTypes.default.func,\n  inSameMonth: _propTypes.default.func,\n  isoWeek: _propTypes.default.bool,\n  limitEndYear: _propTypes.default.number,\n  locale: _propTypes.default.object,\n  onChangePageDate: _propTypes.default.func,\n  onChangePageTime: _propTypes.default.func,\n  onMoveBackward: _propTypes.default.func,\n  onMoveForward: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  onToggleMeridian: _propTypes.default.func,\n  onToggleMonthDropdown: _propTypes.default.func,\n  onToggleTimeDropdown: _propTypes.default.func,\n  calendarDate: _propTypes.default.instanceOf(Date),\n  renderCell: _propTypes.default.func,\n  renderTitle: _propTypes.default.func,\n  renderToolbar: _propTypes.default.func,\n  showMeridian: _propTypes.default.bool,\n  showWeekNumbers: _propTypes.default.bool\n};\nvar _default = Calendar;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Calendar/Calendar.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = exports.CalendarState = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\n\nvar _MonthDropdown = _interopRequireDefault(__webpack_require__(/*! ./MonthDropdown */ \"./src/Calendar/MonthDropdown.tsx\"));\n\nvar _TimeDropdown = _interopRequireDefault(__webpack_require__(/*! ./TimeDropdown */ \"./src/Calendar/TimeDropdown.tsx\"));\n\nvar _View = _interopRequireDefault(__webpack_require__(/*! ./View */ \"./src/Calendar/View.tsx\"));\n\nvar _Header = _interopRequireDefault(__webpack_require__(/*! ./Header */ \"./src/Calendar/Header.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _CalendarContext = __webpack_require__(/*! ./CalendarContext */ \"./src/Calendar/CalendarContext.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Calendar/Calendar.tsx\",\n    _this = void 0;\n\nvar CalendarState;\nexports.CalendarState = CalendarState;\n\n(function (CalendarState) {\n  CalendarState[\"DROP_TIME\"] = \"DROP_TIME\";\n  CalendarState[\"DROP_MONTH\"] = \"DROP_MONTH\";\n})(CalendarState || (exports.CalendarState = CalendarState = {}));\n\nvar Calendar = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'calendar' : _props$classPrefix,\n      calendarState = props.calendarState,\n      dateRange = props.dateRange,\n      disabledBackward = props.disabledBackward,\n      disabledDate = props.disabledDate,\n      disabledForward = props.disabledForward,\n      format = props.format,\n      hoverRangeValue = props.hoverRangeValue,\n      inSameMonth = props.inSameMonth,\n      _props$isoWeek = props.isoWeek,\n      isoWeek = _props$isoWeek === void 0 ? false : _props$isoWeek,\n      limitEndYear = props.limitEndYear,\n      locale = props.locale,\n      onChangePageDate = props.onChangePageDate,\n      onChangePageTime = props.onChangePageTime,\n      onMouseMove = props.onMouseMove,\n      onMoveBackward = props.onMoveBackward,\n      onMoveForward = props.onMoveForward,\n      onSelect = props.onSelect,\n      onToggleMeridian = props.onToggleMeridian,\n      onToggleMonthDropdown = props.onToggleMonthDropdown,\n      onToggleTimeDropdown = props.onToggleTimeDropdown,\n      calendarDate = props.calendarDate,\n      renderCell = props.renderCell,\n      renderTitle = props.renderTitle,\n      renderToolbar = props.renderToolbar,\n      showMeridian = props.showMeridian,\n      showWeekNumbers = props.showWeekNumbers,\n      inline = props.inline,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\", \"calendarState\", \"dateRange\", \"disabledBackward\", \"disabledDate\", \"disabledForward\", \"format\", \"hoverRangeValue\", \"inSameMonth\", \"isoWeek\", \"limitEndYear\", \"locale\", \"onChangePageDate\", \"onChangePageTime\", \"onMouseMove\", \"onMoveBackward\", \"onMoveForward\", \"onSelect\", \"onToggleMeridian\", \"onToggleMonthDropdown\", \"onToggleTimeDropdown\", \"calendarDate\", \"renderCell\", \"renderTitle\", \"renderToolbar\", \"showMeridian\", \"showWeekNumbers\", \"inline\"]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var isDisabledDate = (0, _react.useCallback)(function (date) {\n    var _disabledDate;\n\n    return (_disabledDate = disabledDate === null || disabledDate === void 0 ? void 0 : disabledDate(date)) !== null && _disabledDate !== void 0 ? _disabledDate : false;\n  }, [disabledDate]);\n\n  var isTimeDisabled = function isTimeDisabled(date) {\n    return _utils.DateUtils.disabledTime(props, date);\n  };\n\n  var handleMoveForward = (0, _react.useCallback)(function () {\n    onMoveForward === null || onMoveForward === void 0 ? void 0 : onMoveForward(_utils.DateUtils.addMonths(calendarDate, 1));\n  }, [onMoveForward, calendarDate]);\n  var handleMoveBackward = (0, _react.useCallback)(function () {\n    onMoveBackward === null || onMoveBackward === void 0 ? void 0 : onMoveBackward(_utils.DateUtils.addMonths(calendarDate, -1));\n  }, [onMoveBackward, calendarDate]);\n\n  var showDate = _utils.DateUtils.shouldDate(format);\n\n  var showTime = _utils.DateUtils.shouldTime(format);\n\n  var showMonth = _utils.DateUtils.shouldMonth(format);\n\n  var onlyShowTime = showTime && !showDate && !showMonth;\n  var onlyShowMonth = showMonth && !showDate && !showTime;\n  var dropTime = calendarState === CalendarState.DROP_TIME || onlyShowTime;\n  var dropMonth = calendarState === CalendarState.DROP_MONTH || onlyShowMonth;\n  var inSameThisMonthDate = (0, _react.useCallback)(function (date) {\n    return (0, _utils.composeFunctions)(function (d) {\n      return _utils.DateUtils.setDate(d, 1);\n    }, function (d) {\n      return _utils.DateUtils.isSameMonth(d, date);\n    })(date);\n  }, []);\n  var calendarClasses = merge(className, withClassPrefix({\n    'show-time-dropdown': dropTime,\n    'show-month-dropdown': dropMonth,\n    'show-week-numbers': showWeekNumbers\n  }));\n  var timeDropdownProps = (0, _pick.default)(rest, _utils.DateUtils.calendarOnlyProps);\n  var contextValue = (0, _react.useMemo)(function () {\n    return {\n      date: calendarDate,\n      dateRange: dateRange,\n      disabledDate: isDisabledDate,\n      format: format,\n      hoverRangeValue: hoverRangeValue,\n      inSameMonth: inSameMonth !== null && inSameMonth !== void 0 ? inSameMonth : inSameThisMonthDate,\n      isoWeek: isoWeek,\n      locale: locale,\n      onChangePageDate: onChangePageDate,\n      onChangePageTime: onChangePageTime,\n      onMouseMove: onMouseMove,\n      onSelect: onSelect,\n      renderCell: renderCell,\n      showWeekNumbers: showWeekNumbers,\n      inline: inline\n    };\n  }, [calendarDate, dateRange, format, hoverRangeValue, inSameMonth, inSameThisMonthDate, inline, isDisabledDate, isoWeek, locale, onChangePageDate, onChangePageTime, onMouseMove, onSelect, renderCell, showWeekNumbers]);\n  return /*#__PURE__*/_react.default.createElement(_CalendarContext.CalendarProvider, {\n    value: contextValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 211,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, _utils.DateUtils.omitHideDisabledProps(rest), {\n    className: calendarClasses,\n    ref: ref,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 212,\n      columnNumber: 9\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Header.default, {\n    showMonth: showMonth,\n    showDate: showDate,\n    showTime: showTime,\n    showMeridian: showMeridian,\n    disabledTime: isTimeDisabled,\n    onMoveForward: handleMoveForward,\n    onMoveBackward: handleMoveBackward,\n    onToggleMonthDropdown: onToggleMonthDropdown,\n    onToggleTimeDropdown: onToggleTimeDropdown,\n    onToggleMeridian: onToggleMeridian,\n    renderTitle: renderTitle,\n    renderToolbar: renderToolbar,\n    disabledBackward: disabledBackward,\n    disabledForward: disabledForward,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 217,\n      columnNumber: 11\n    }\n  }), showDate && /*#__PURE__*/_react.default.createElement(_View.default, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 233,\n      columnNumber: 24\n    }\n  }), showMonth && /*#__PURE__*/_react.default.createElement(_MonthDropdown.default, {\n    show: dropMonth,\n    limitEndYear: limitEndYear,\n    disabledMonth: isDisabledDate,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 235,\n      columnNumber: 13\n    }\n  }), showTime && /*#__PURE__*/_react.default.createElement(_TimeDropdown.default, (0, _extends2.default)({}, timeDropdownProps, {\n    show: dropTime,\n    showMeridian: showMeridian,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 242,\n      columnNumber: 13\n    }\n  }))));\n});\n\nCalendar.displayName = 'Calendar';\nCalendar.propTypes = {\n  calendarState: _propTypes.default.oneOf(Object.values(CalendarState)),\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string,\n  disabledDate: _propTypes.default.func,\n  disabledHours: _propTypes.default.func,\n  disabledMinutes: _propTypes.default.func,\n  disabledSeconds: _propTypes.default.func,\n  format: _propTypes.default.string,\n  hideHours: _propTypes.default.func,\n  hideMinutes: _propTypes.default.func,\n  hideSeconds: _propTypes.default.func,\n  inSameMonth: _propTypes.default.func,\n  isoWeek: _propTypes.default.bool,\n  limitEndYear: _propTypes.default.number,\n  locale: _propTypes.default.object,\n  onChangePageDate: _propTypes.default.func,\n  onChangePageTime: _propTypes.default.func,\n  onMoveBackward: _propTypes.default.func,\n  onMoveForward: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  onToggleMeridian: _propTypes.default.func,\n  onToggleMonthDropdown: _propTypes.default.func,\n  onToggleTimeDropdown: _propTypes.default.func,\n  calendarDate: _propTypes.default.instanceOf(Date),\n  renderCell: _propTypes.default.func,\n  renderTitle: _propTypes.default.func,\n  renderToolbar: _propTypes.default.func,\n  showMeridian: _propTypes.default.bool,\n  showWeekNumbers: _propTypes.default.bool\n};\nvar _default = Calendar;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Calendar/Calendar.tsx?");
 
 /***/ }),
 
@@ -1847,7 +1847,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _AngleLeft = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/AngleLeft */ \"./node_modules/@rsuite/icons/legacy/AngleLeft.js\"));\n\nvar _AngleRight = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/AngleRight */ \"./node_modules/@rsuite/icons/legacy/AngleRight.js\"));\n\nvar _IconButton = _interopRequireDefault(__webpack_require__(/*! ../IconButton */ \"./src/IconButton/index.tsx\"));\n\nvar _Button = _interopRequireDefault(__webpack_require__(/*! ../Button */ \"./src/Button/index.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _CustomProvider = __webpack_require__(/*! ../CustomProvider */ \"./src/CustomProvider/index.tsx\");\n\nvar _CalendarContext = __webpack_require__(/*! ./CalendarContext */ \"./src/Calendar/CalendarContext.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Calendar/Header.tsx\",\n    _this = void 0;\n\nvar Header = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'calendar-header' : _props$classPrefix,\n      disabledBackward = props.disabledBackward,\n      disabledForward = props.disabledForward,\n      showDate = props.showDate,\n      showMeridian = props.showMeridian,\n      showMonth = props.showMonth,\n      showTime = props.showTime,\n      disabledTime = props.disabledTime,\n      onMoveBackward = props.onMoveBackward,\n      onMoveForward = props.onMoveForward,\n      onToggleMeridian = props.onToggleMeridian,\n      onToggleMonthDropdown = props.onToggleMonthDropdown,\n      onToggleTimeDropdown = props.onToggleTimeDropdown,\n      renderTitleProp = props.renderTitle,\n      renderToolbar = props.renderToolbar,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\", \"disabledBackward\", \"disabledForward\", \"showDate\", \"showMeridian\", \"showMonth\", \"showTime\", \"disabledTime\", \"onMoveBackward\", \"onMoveForward\", \"onToggleMeridian\", \"onToggleMonthDropdown\", \"onToggleTimeDropdown\", \"renderTitle\", \"renderToolbar\"]);\n\n  var _useCalendarContext = (0, _CalendarContext.useCalendarContext)(),\n      locale = _useCalendarContext.locale,\n      _useCalendarContext$d = _useCalendarContext.date,\n      date = _useCalendarContext$d === void 0 ? new Date() : _useCalendarContext$d,\n      format = _useCalendarContext.format,\n      inline = _useCalendarContext.inline,\n      disabledDate = _useCalendarContext.disabledDate;\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      prefix = _useClassNames.prefix,\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var btnProps = {\n    appearance: 'subtle',\n    size: inline ? 'sm' : 'xs'\n  };\n  var getTimeFormat = (0, _react.useCallback)(function () {\n    var timeFormat = [];\n\n    if (!format) {\n      return '';\n    }\n\n    if (/([Hh])/.test(format)) {\n      timeFormat.push(showMeridian ? 'hh' : 'HH');\n    }\n\n    if (/m/.test(format)) {\n      timeFormat.push('mm');\n    }\n\n    if (/s/.test(format)) {\n      timeFormat.push('ss');\n    }\n\n    return timeFormat.join(':');\n  }, [format, showMeridian]);\n  var getDateFormat = (0, _react.useCallback)(function () {\n    if (showDate) {\n      return (locale === null || locale === void 0 ? void 0 : locale.formattedDayPattern) || 'yyyy-MM-dd';\n    } else if (showMonth) {\n      return (locale === null || locale === void 0 ? void 0 : locale.formattedMonthPattern) || 'yyyy-MM';\n    }\n\n    return 'yyyy';\n  }, [locale, showDate, showMonth]);\n  var renderTitle = (0, _react.useCallback)(function () {\n    var _renderTitleProp;\n\n    return (_renderTitleProp = renderTitleProp === null || renderTitleProp === void 0 ? void 0 : renderTitleProp(date)) !== null && _renderTitleProp !== void 0 ? _renderTitleProp : date && /*#__PURE__*/_react.default.createElement(_CustomProvider.FormattedDate, {\n      date: date,\n      formatStr: getDateFormat(),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 92,\n        columnNumber: 18\n      }\n    });\n  }, [date, getDateFormat, renderTitleProp]);\n  var dateTitleClasses = prefix('title', 'title-date', {\n    error: disabledDate === null || disabledDate === void 0 ? void 0 : disabledDate(date)\n  });\n  var timeTitleClasses = prefix('title', 'title-time', {\n    error: disabledTime === null || disabledTime === void 0 ? void 0 : disabledTime(date)\n  });\n  var backwardClass = prefix('backward', {\n    'btn-disabled': disabledBackward\n  });\n  var forwardClass = prefix('forward', {\n    'btn-disabled': disabledForward\n  });\n\n  var monthToolbar = /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('month-toolbar'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 102,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_IconButton.default, (0, _extends2.default)({}, btnProps, {\n    className: backwardClass,\n    onClick: disabledBackward ? undefined : onMoveBackward,\n    icon: /*#__PURE__*/_react.default.createElement(_AngleLeft.default, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 107,\n        columnNumber: 17\n      }\n    }),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 103,\n      columnNumber: 9\n    }\n  })), /*#__PURE__*/_react.default.createElement(_Button.default, (0, _extends2.default)({}, btnProps, {\n    className: dateTitleClasses,\n    onClick: onToggleMonthDropdown,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 109,\n      columnNumber: 9\n    }\n  }), renderTitle()), /*#__PURE__*/_react.default.createElement(_IconButton.default, (0, _extends2.default)({}, btnProps, {\n    className: forwardClass,\n    onClick: disabledForward ? undefined : onMoveForward,\n    icon: /*#__PURE__*/_react.default.createElement(_AngleRight.default, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 116,\n        columnNumber: 17\n      }\n    }),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 112,\n      columnNumber: 9\n    }\n  })));\n\n  var hasMonth = showDate || showMonth;\n  var classes = merge(className, withClassPrefix({\n    'has-month': hasMonth,\n    'has-time': showTime\n  }));\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n    role: \"row\"\n  }, rest, {\n    ref: ref,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 128,\n      columnNumber: 7\n    }\n  }), hasMonth && monthToolbar, showTime && /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('time-toolbar'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 131,\n      columnNumber: 11\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Button.default, (0, _extends2.default)({}, btnProps, {\n    className: timeTitleClasses,\n    onClick: onToggleTimeDropdown,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 132,\n      columnNumber: 13\n    }\n  }), date && /*#__PURE__*/_react.default.createElement(_CustomProvider.FormattedDate, {\n    date: date,\n    formatStr: getTimeFormat(),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 133,\n      columnNumber: 24\n    }\n  })), showMeridian && /*#__PURE__*/_react.default.createElement(_Button.default, (0, _extends2.default)({}, btnProps, {\n    className: prefix('meridian'),\n    onClick: onToggleMeridian,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 137,\n      columnNumber: 15\n    }\n  }), date && /*#__PURE__*/_react.default.createElement(_CustomProvider.FormattedDate, {\n    date: date,\n    formatStr: \"a\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 138,\n      columnNumber: 26\n    }\n  }))), renderToolbar === null || renderToolbar === void 0 ? void 0 : renderToolbar(date));\n});\n\nHeader.displayName = 'Header';\nHeader.propTypes = {\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string,\n  disabledBackward: _propTypes.default.bool,\n  disabledForward: _propTypes.default.bool,\n  disabledTime: _propTypes.default.func,\n  onMoveBackward: _propTypes.default.func,\n  onMoveForward: _propTypes.default.func,\n  onToggleMeridian: _propTypes.default.func,\n  onToggleMonthDropdown: _propTypes.default.func,\n  onToggleTimeDropdown: _propTypes.default.func,\n  renderTitle: _propTypes.default.func,\n  renderToolbar: _propTypes.default.func,\n  showDate: _propTypes.default.bool,\n  showMeridian: _propTypes.default.bool,\n  showMonth: _propTypes.default.bool,\n  showTime: _propTypes.default.bool\n};\nvar _default = Header;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Calendar/Header.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _AngleLeft = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/AngleLeft */ \"./node_modules/@rsuite/icons/legacy/AngleLeft.js\"));\n\nvar _AngleRight = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/AngleRight */ \"./node_modules/@rsuite/icons/legacy/AngleRight.js\"));\n\nvar _IconButton = _interopRequireDefault(__webpack_require__(/*! ../IconButton */ \"./src/IconButton/index.tsx\"));\n\nvar _Button = _interopRequireDefault(__webpack_require__(/*! ../Button */ \"./src/Button/index.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _CustomProvider = __webpack_require__(/*! ../CustomProvider */ \"./src/CustomProvider/index.tsx\");\n\nvar _CalendarContext = __webpack_require__(/*! ./CalendarContext */ \"./src/Calendar/CalendarContext.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Calendar/Header.tsx\",\n    _this = void 0;\n\nvar Header = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'calendar-header' : _props$classPrefix,\n      disabledBackward = props.disabledBackward,\n      disabledForward = props.disabledForward,\n      showDate = props.showDate,\n      showMeridian = props.showMeridian,\n      showMonth = props.showMonth,\n      showTime = props.showTime,\n      disabledTime = props.disabledTime,\n      onMoveBackward = props.onMoveBackward,\n      onMoveForward = props.onMoveForward,\n      onToggleMeridian = props.onToggleMeridian,\n      onToggleMonthDropdown = props.onToggleMonthDropdown,\n      onToggleTimeDropdown = props.onToggleTimeDropdown,\n      renderTitleProp = props.renderTitle,\n      renderToolbar = props.renderToolbar,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\", \"disabledBackward\", \"disabledForward\", \"showDate\", \"showMeridian\", \"showMonth\", \"showTime\", \"disabledTime\", \"onMoveBackward\", \"onMoveForward\", \"onToggleMeridian\", \"onToggleMonthDropdown\", \"onToggleTimeDropdown\", \"renderTitle\", \"renderToolbar\"]);\n\n  var _useCalendarContext = (0, _CalendarContext.useCalendarContext)(),\n      locale = _useCalendarContext.locale,\n      _useCalendarContext$d = _useCalendarContext.date,\n      date = _useCalendarContext$d === void 0 ? new Date() : _useCalendarContext$d,\n      format = _useCalendarContext.format,\n      inline = _useCalendarContext.inline,\n      disabledDate = _useCalendarContext.disabledDate;\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      prefix = _useClassNames.prefix,\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var btnProps = {\n    appearance: 'subtle',\n    size: inline ? 'sm' : 'xs'\n  };\n  var getTimeFormat = (0, _react.useCallback)(function () {\n    var timeFormat = [];\n\n    if (!format) {\n      return '';\n    }\n\n    if (/([Hh])/.test(format)) {\n      timeFormat.push(showMeridian ? 'hh' : 'HH');\n    }\n\n    if (/m/.test(format)) {\n      timeFormat.push('mm');\n    }\n\n    if (/s/.test(format)) {\n      timeFormat.push('ss');\n    }\n\n    return timeFormat.join(':');\n  }, [format, showMeridian]);\n  var getDateFormat = (0, _react.useCallback)(function () {\n    if (showDate) {\n      return (locale === null || locale === void 0 ? void 0 : locale.formattedDayPattern) || 'yyyy-MM-dd';\n    } else if (showMonth) {\n      return (locale === null || locale === void 0 ? void 0 : locale.formattedMonthPattern) || 'yyyy-MM';\n    }\n\n    return 'yyyy';\n  }, [locale, showDate, showMonth]);\n  var renderTitle = (0, _react.useCallback)(function () {\n    var _renderTitleProp;\n\n    return (_renderTitleProp = renderTitleProp === null || renderTitleProp === void 0 ? void 0 : renderTitleProp(date)) !== null && _renderTitleProp !== void 0 ? _renderTitleProp : date && /*#__PURE__*/_react.default.createElement(_CustomProvider.FormattedDate, {\n      date: date,\n      formatStr: getDateFormat(),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 92,\n        columnNumber: 18\n      }\n    });\n  }, [date, getDateFormat, renderTitleProp]);\n  var dateTitleClasses = prefix('title', 'title-date', {\n    error: disabledDate === null || disabledDate === void 0 ? void 0 : disabledDate(date)\n  });\n  var timeTitleClasses = prefix('title', 'title-time', {\n    error: disabledTime === null || disabledTime === void 0 ? void 0 : disabledTime(date)\n  });\n  var backwardClass = prefix('backward', {\n    'btn-disabled': disabledBackward\n  });\n  var forwardClass = prefix('forward', {\n    'btn-disabled': disabledForward\n  });\n\n  var monthToolbar = /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('month-toolbar'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 102,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_IconButton.default, (0, _extends2.default)({}, btnProps, {\n    className: backwardClass,\n    onClick: disabledBackward ? undefined : onMoveBackward,\n    icon: /*#__PURE__*/_react.default.createElement(_AngleLeft.default, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 107,\n        columnNumber: 17\n      }\n    }),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 103,\n      columnNumber: 9\n    }\n  })), /*#__PURE__*/_react.default.createElement(_Button.default, (0, _extends2.default)({}, btnProps, {\n    className: dateTitleClasses,\n    onClick: onToggleMonthDropdown,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 109,\n      columnNumber: 9\n    }\n  }), renderTitle()), /*#__PURE__*/_react.default.createElement(_IconButton.default, (0, _extends2.default)({}, btnProps, {\n    className: forwardClass,\n    onClick: disabledForward ? undefined : onMoveForward,\n    icon: /*#__PURE__*/_react.default.createElement(_AngleRight.default, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 116,\n        columnNumber: 17\n      }\n    }),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 112,\n      columnNumber: 9\n    }\n  })));\n\n  var hasMonth = showDate || showMonth;\n  var classes = merge(className, withClassPrefix({\n    'has-month': hasMonth,\n    'has-time': showTime\n  }));\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: ref,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 128,\n      columnNumber: 7\n    }\n  }), hasMonth && monthToolbar, showTime && /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('time-toolbar'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 131,\n      columnNumber: 11\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Button.default, (0, _extends2.default)({}, btnProps, {\n    className: timeTitleClasses,\n    onClick: onToggleTimeDropdown,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 132,\n      columnNumber: 13\n    }\n  }), date && /*#__PURE__*/_react.default.createElement(_CustomProvider.FormattedDate, {\n    date: date,\n    formatStr: getTimeFormat(),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 133,\n      columnNumber: 24\n    }\n  })), showMeridian && /*#__PURE__*/_react.default.createElement(_Button.default, (0, _extends2.default)({}, btnProps, {\n    className: prefix('meridian'),\n    onClick: onToggleMeridian,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 137,\n      columnNumber: 15\n    }\n  }), date && /*#__PURE__*/_react.default.createElement(_CustomProvider.FormattedDate, {\n    date: date,\n    formatStr: \"a\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 138,\n      columnNumber: 26\n    }\n  }))), renderToolbar === null || renderToolbar === void 0 ? void 0 : renderToolbar(date));\n});\n\nHeader.displayName = 'Header';\nHeader.propTypes = {\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string,\n  disabledBackward: _propTypes.default.bool,\n  disabledForward: _propTypes.default.bool,\n  disabledTime: _propTypes.default.func,\n  onMoveBackward: _propTypes.default.func,\n  onMoveForward: _propTypes.default.func,\n  onToggleMeridian: _propTypes.default.func,\n  onToggleMonthDropdown: _propTypes.default.func,\n  onToggleTimeDropdown: _propTypes.default.func,\n  renderTitle: _propTypes.default.func,\n  renderToolbar: _propTypes.default.func,\n  showDate: _propTypes.default.bool,\n  showMeridian: _propTypes.default.bool,\n  showMonth: _propTypes.default.bool,\n  showTime: _propTypes.default.bool\n};\nvar _default = Header;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Calendar/Header.tsx?");
 
 /***/ }),
 
@@ -1880,7 +1880,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _TableRow = _interopRequireDefault(__webpack_require__(/*! ./TableRow */ \"./src/Calendar/TableRow.tsx\"));\n\nvar _TableHeaderRow = _interopRequireDefault(__webpack_require__(/*! ./TableHeaderRow */ \"./src/Calendar/TableHeaderRow.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Calendar/Table.tsx\",\n    _this = void 0;\n\nvar Table = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'calendar-table' : _props$classPrefix,\n      _props$rows = props.rows,\n      rows = _props$rows === void 0 ? [] : _props$rows,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\", \"rows\"]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      withClassPrefix = _useClassNames.withClassPrefix;\n\n  var classes = merge(className, withClassPrefix());\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n    role: \"table\"\n  }, rest, {\n    ref: ref,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 25,\n      columnNumber: 7\n    }\n  }), /*#__PURE__*/_react.default.createElement(_TableHeaderRow.default, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 26,\n      columnNumber: 9\n    }\n  }), rows.map(function (week, index) {\n    return /*#__PURE__*/_react.default.createElement(_TableRow.default, {\n      key: index,\n      weekendDate: week,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 28,\n        columnNumber: 11\n      }\n    });\n  }));\n});\n\nTable.displayName = 'Table';\nTable.propTypes = {\n  rows: _propTypes.default.array,\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string\n};\nvar _default = Table;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Calendar/Table.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _TableRow = _interopRequireDefault(__webpack_require__(/*! ./TableRow */ \"./src/Calendar/TableRow.tsx\"));\n\nvar _TableHeaderRow = _interopRequireDefault(__webpack_require__(/*! ./TableHeaderRow */ \"./src/Calendar/TableHeaderRow.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Calendar/Table.tsx\",\n    _this = void 0;\n\nvar Table = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'calendar-table' : _props$classPrefix,\n      _props$rows = props.rows,\n      rows = _props$rows === void 0 ? [] : _props$rows,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\", \"rows\"]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      withClassPrefix = _useClassNames.withClassPrefix;\n\n  var classes = merge(className, withClassPrefix());\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n    role: \"grid\"\n  }, rest, {\n    ref: ref,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 25,\n      columnNumber: 7\n    }\n  }), /*#__PURE__*/_react.default.createElement(_TableHeaderRow.default, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 26,\n      columnNumber: 9\n    }\n  }), rows.map(function (week, index) {\n    return /*#__PURE__*/_react.default.createElement(_TableRow.default, {\n      key: index,\n      weekendDate: week,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 28,\n        columnNumber: 11\n      }\n    });\n  }));\n});\n\nTable.displayName = 'Table';\nTable.propTypes = {\n  rows: _propTypes.default.array,\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string\n};\nvar _default = Table;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Calendar/Table.tsx?");
 
 /***/ }),
 
@@ -1902,7 +1902,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _partial = _interopRequireDefault(__webpack_require__(/*! lodash/partial */ \"./node_modules/lodash/partial.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _CalendarContext = __webpack_require__(/*! ./CalendarContext */ \"./src/Calendar/CalendarContext.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Calendar/TableRow.tsx\",\n    _this = void 0;\n\nvar TableRow = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'calendar-table' : _props$classPrefix,\n      _props$weekendDate = props.weekendDate,\n      weekendDate = _props$weekendDate === void 0 ? new Date() : _props$weekendDate,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\", \"weekendDate\"]);\n\n  var _useCalendarContext = (0, _CalendarContext.useCalendarContext)(),\n      _useCalendarContext$d = _useCalendarContext.date,\n      selected = _useCalendarContext$d === void 0 ? new Date() : _useCalendarContext$d,\n      dateRange = _useCalendarContext.dateRange,\n      disabledDate = _useCalendarContext.disabledDate,\n      formatDate = _useCalendarContext.formatDate,\n      hoverRangeValue = _useCalendarContext.hoverRangeValue,\n      inSameMonth = _useCalendarContext.inSameMonth,\n      isoWeek = _useCalendarContext.isoWeek,\n      onMouseMove = _useCalendarContext.onMouseMove,\n      onSelect = _useCalendarContext.onSelect,\n      renderCell = _useCalendarContext.renderCell,\n      locale = _useCalendarContext.locale,\n      showWeekNumbers = _useCalendarContext.showWeekNumbers;\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      prefix = _useClassNames.prefix,\n      merge = _useClassNames.merge;\n\n  var handleSelect = (0, _react.useCallback)(function (date, disabled, event) {\n    if (disabled) {\n      return;\n    }\n\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(date, event);\n  }, [onSelect]);\n\n  var renderDays = function renderDays() {\n    var formatStr = (locale === null || locale === void 0 ? void 0 : locale.formattedDayPattern) || 'yyyy-MM-dd';\n    var days = [];\n\n    var _ref = dateRange || [],\n        selectedStartDate = _ref[0],\n        selectedEndDate = _ref[1];\n\n    var _ref2 = hoverRangeValue !== null && hoverRangeValue !== void 0 ? hoverRangeValue : [],\n        hoverStartDate = _ref2[0],\n        hoverEndDate = _ref2[1];\n\n    var isRangeSelectionMode = typeof dateRange !== 'undefined';\n    var todayDate = new Date();\n\n    for (var i = 0; i < 7; i += 1) {\n      var thisDate = _utils.DateUtils.addDays(weekendDate, i);\n\n      var disabled = disabledDate === null || disabledDate === void 0 ? void 0 : disabledDate(thisDate, dateRange, _utils.DATERANGE_DISABLED_TARGET.CALENDAR);\n\n      var isToday = _utils.DateUtils.isSameDay(thisDate, todayDate);\n\n      var unSameMonth = !(inSameMonth !== null && inSameMonth !== void 0 && inSameMonth(thisDate));\n\n      var isStartSelected = !unSameMonth && selectedStartDate && _utils.DateUtils.isSameDay(thisDate, selectedStartDate);\n\n      var isEndSelected = !unSameMonth && selectedEndDate && _utils.DateUtils.isSameDay(thisDate, selectedEndDate);\n\n      var isSelected = isStartSelected || isEndSelected;\n      var inRange = false; // for Selected\n\n      if (selectedStartDate && selectedEndDate) {\n        if (_utils.DateUtils.isBefore(thisDate, selectedEndDate) && _utils.DateUtils.isAfter(thisDate, selectedStartDate)) {\n          inRange = true;\n        }\n\n        if (_utils.DateUtils.isBefore(thisDate, selectedStartDate) && _utils.DateUtils.isAfter(thisDate, selectedEndDate)) {\n          inRange = true;\n        }\n      } // for Hovering\n\n\n      if (!isSelected && hoverStartDate && hoverEndDate) {\n        if (!_utils.DateUtils.isAfter(thisDate, hoverEndDate) && !_utils.DateUtils.isBefore(thisDate, hoverStartDate)) {\n          inRange = true;\n        }\n\n        if (!_utils.DateUtils.isAfter(thisDate, hoverStartDate) && !_utils.DateUtils.isBefore(thisDate, hoverEndDate)) {\n          inRange = true;\n        }\n      }\n\n      var _classes = prefix('cell', {\n        'cell-un-same-month': unSameMonth,\n        'cell-is-today': isToday,\n        'cell-selected': isRangeSelectionMode ? isSelected : _utils.DateUtils.isSameDay(thisDate, selected),\n        'cell-selected-start': isStartSelected,\n        'cell-selected-end': isEndSelected,\n        'cell-in-range': !unSameMonth && inRange,\n        'cell-disabled': disabled\n      });\n\n      var title = formatDate ? formatDate(thisDate, formatStr) : _utils.DateUtils.format(thisDate, formatStr);\n      days.push( /*#__PURE__*/_react.default.createElement(\"div\", {\n        role: \"cell\",\n        key: title,\n        className: _classes,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 116,\n          columnNumber: 11\n        }\n      }, /*#__PURE__*/_react.default.createElement(\"div\", {\n        role: \"button\",\n        className: prefix('cell-content'),\n        tabIndex: -1,\n        title: isToday ? title + \" (\" + (locale === null || locale === void 0 ? void 0 : locale.today) + \")\" : title,\n        onMouseEnter: !disabled && onMouseMove ? onMouseMove.bind(null, thisDate) : undefined,\n        onClick: (0, _partial.default)(handleSelect, thisDate, disabled),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 117,\n          columnNumber: 13\n        }\n      }, /*#__PURE__*/_react.default.createElement(\"span\", {\n        className: prefix('cell-day'),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 125,\n          columnNumber: 15\n        }\n      }, _utils.DateUtils.getDate(thisDate)), renderCell && renderCell(thisDate))));\n    }\n\n    return days;\n  };\n\n  var classes = merge(className, prefix('row'));\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: ref,\n    role: \"row\",\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 137,\n      columnNumber: 7\n    }\n  }), showWeekNumbers && /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('cell-week-number'),\n    role: \"cell\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 139,\n      columnNumber: 11\n    }\n  }, _utils.DateUtils.format(weekendDate, isoWeek ? 'I' : 'w')), renderDays());\n});\n\nTableRow.displayName = 'TableRow';\nTableRow.propTypes = {\n  weekendDate: _propTypes.default.instanceOf(Date),\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string\n};\nvar _default = TableRow;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Calendar/TableRow.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _partial = _interopRequireDefault(__webpack_require__(/*! lodash/partial */ \"./node_modules/lodash/partial.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _CalendarContext = __webpack_require__(/*! ./CalendarContext */ \"./src/Calendar/CalendarContext.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Calendar/TableRow.tsx\",\n    _this = void 0;\n\nvar TableRow = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'calendar-table' : _props$classPrefix,\n      _props$weekendDate = props.weekendDate,\n      weekendDate = _props$weekendDate === void 0 ? new Date() : _props$weekendDate,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\", \"weekendDate\"]);\n\n  var _useCalendarContext = (0, _CalendarContext.useCalendarContext)(),\n      _useCalendarContext$d = _useCalendarContext.date,\n      selected = _useCalendarContext$d === void 0 ? new Date() : _useCalendarContext$d,\n      dateRange = _useCalendarContext.dateRange,\n      disabledDate = _useCalendarContext.disabledDate,\n      hoverRangeValue = _useCalendarContext.hoverRangeValue,\n      inSameMonth = _useCalendarContext.inSameMonth,\n      isoWeek = _useCalendarContext.isoWeek,\n      onMouseMove = _useCalendarContext.onMouseMove,\n      onSelect = _useCalendarContext.onSelect,\n      renderCell = _useCalendarContext.renderCell,\n      overrideLocale = _useCalendarContext.locale,\n      showWeekNumbers = _useCalendarContext.showWeekNumbers;\n\n  var _useCustom = (0, _utils.useCustom)('Calendar', overrideLocale),\n      locale = _useCustom.locale,\n      formatDate = _useCustom.formatDate;\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      prefix = _useClassNames.prefix,\n      merge = _useClassNames.merge;\n\n  var handleSelect = (0, _react.useCallback)(function (date, disabled, event) {\n    if (disabled) {\n      return;\n    }\n\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(date, event);\n  }, [onSelect]);\n\n  var renderDays = function renderDays() {\n    var formatStr = locale.formattedDayPattern;\n    var days = [];\n\n    var _ref = dateRange || [],\n        selectedStartDate = _ref[0],\n        selectedEndDate = _ref[1];\n\n    var _ref2 = hoverRangeValue !== null && hoverRangeValue !== void 0 ? hoverRangeValue : [],\n        hoverStartDate = _ref2[0],\n        hoverEndDate = _ref2[1];\n\n    var isRangeSelectionMode = typeof dateRange !== 'undefined';\n    var todayDate = new Date();\n\n    for (var i = 0; i < 7; i += 1) {\n      var thisDate = _utils.DateUtils.addDays(weekendDate, i);\n\n      var disabled = disabledDate === null || disabledDate === void 0 ? void 0 : disabledDate(thisDate, dateRange, _utils.DATERANGE_DISABLED_TARGET.CALENDAR);\n\n      var isToday = _utils.DateUtils.isSameDay(thisDate, todayDate);\n\n      var unSameMonth = !(inSameMonth !== null && inSameMonth !== void 0 && inSameMonth(thisDate));\n\n      var isStartSelected = !unSameMonth && selectedStartDate && _utils.DateUtils.isSameDay(thisDate, selectedStartDate);\n\n      var isEndSelected = !unSameMonth && selectedEndDate && _utils.DateUtils.isSameDay(thisDate, selectedEndDate);\n\n      var isSelected = isRangeSelectionMode ? isStartSelected || isEndSelected : _utils.DateUtils.isSameDay(thisDate, selected);\n      var inRange = false; // for Selected\n\n      if (selectedStartDate && selectedEndDate) {\n        if (_utils.DateUtils.isBefore(thisDate, selectedEndDate) && _utils.DateUtils.isAfter(thisDate, selectedStartDate)) {\n          inRange = true;\n        }\n\n        if (_utils.DateUtils.isBefore(thisDate, selectedStartDate) && _utils.DateUtils.isAfter(thisDate, selectedEndDate)) {\n          inRange = true;\n        }\n      } // for Hovering\n\n\n      if (!isSelected && hoverStartDate && hoverEndDate) {\n        if (!_utils.DateUtils.isAfter(thisDate, hoverEndDate) && !_utils.DateUtils.isBefore(thisDate, hoverStartDate)) {\n          inRange = true;\n        }\n\n        if (!_utils.DateUtils.isAfter(thisDate, hoverStartDate) && !_utils.DateUtils.isBefore(thisDate, hoverEndDate)) {\n          inRange = true;\n        }\n      }\n\n      var _classes = prefix('cell', {\n        'cell-un-same-month': unSameMonth,\n        'cell-is-today': isToday,\n        'cell-selected': isSelected,\n        'cell-selected-start': isStartSelected,\n        'cell-selected-end': isEndSelected,\n        'cell-in-range': !unSameMonth && inRange,\n        'cell-disabled': disabled\n      });\n\n      var title = formatDate ? formatDate(thisDate, formatStr) : _utils.DateUtils.format(thisDate, formatStr);\n      days.push( /*#__PURE__*/_react.default.createElement(\"div\", {\n        role: \"gridcell\",\n        key: title,\n        \"aria-label\": title,\n        \"aria-selected\": isSelected || undefined,\n        className: _classes,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 116,\n          columnNumber: 11\n        }\n      }, /*#__PURE__*/_react.default.createElement(\"div\", {\n        role: \"button\",\n        className: prefix('cell-content'),\n        tabIndex: -1,\n        title: isToday ? title + \" (\" + (locale === null || locale === void 0 ? void 0 : locale.today) + \")\" : title,\n        onMouseEnter: !disabled && onMouseMove ? onMouseMove.bind(null, thisDate) : undefined,\n        onClick: (0, _partial.default)(handleSelect, thisDate, disabled),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 123,\n          columnNumber: 13\n        }\n      }, /*#__PURE__*/_react.default.createElement(\"span\", {\n        className: prefix('cell-day'),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 131,\n          columnNumber: 15\n        }\n      }, _utils.DateUtils.getDate(thisDate)), renderCell && renderCell(thisDate))));\n    }\n\n    return days;\n  };\n\n  var classes = merge(className, prefix('row'));\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: ref,\n    role: \"row\",\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 143,\n      columnNumber: 7\n    }\n  }), showWeekNumbers && /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('cell-week-number'),\n    role: \"rowheader\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 145,\n      columnNumber: 11\n    }\n  }, _utils.DateUtils.format(weekendDate, isoWeek ? 'I' : 'w')), renderDays());\n});\n\nTableRow.displayName = 'TableRow';\nTableRow.propTypes = {\n  weekendDate: _propTypes.default.instanceOf(Date),\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string\n};\nvar _default = TableRow;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Calendar/TableRow.tsx?");
 
 /***/ }),
 
@@ -1924,7 +1924,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Table = _interopRequireDefault(__webpack_require__(/*! ./Table */ \"./src/Calendar/Table.tsx\"));\n\nvar _CalendarContext = __webpack_require__(/*! ./CalendarContext */ \"./src/Calendar/CalendarContext.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Calendar/View.tsx\",\n    _this = void 0;\n\nvar View = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'calendar-view' : _props$classPrefix,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\"]);\n\n  var _useCalendarContext = (0, _CalendarContext.useCalendarContext)(),\n      _useCalendarContext$d = _useCalendarContext.date,\n      date = _useCalendarContext$d === void 0 ? new Date() : _useCalendarContext$d,\n      isoWeek = _useCalendarContext.isoWeek;\n\n  var thisMonthDate = _utils.DateUtils.setDate(date, 1);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      withClassPrefix = _useClassNames.withClassPrefix;\n\n  var classes = merge(className, withClassPrefix());\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n    role: \"row\"\n  }, rest, {\n    ref: ref,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 19,\n      columnNumber: 7\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Table.default, {\n    rows: _utils.DateUtils.getMonthView(thisMonthDate, isoWeek),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 20,\n      columnNumber: 9\n    }\n  }));\n});\n\nView.displayName = 'View';\nView.propTypes = {\n  as: _propTypes.default.elementType,\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string\n};\nvar _default = View;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Calendar/View.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Table = _interopRequireDefault(__webpack_require__(/*! ./Table */ \"./src/Calendar/Table.tsx\"));\n\nvar _CalendarContext = __webpack_require__(/*! ./CalendarContext */ \"./src/Calendar/CalendarContext.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Calendar/View.tsx\",\n    _this = void 0;\n\nvar View = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'calendar-view' : _props$classPrefix,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\"]);\n\n  var _useCalendarContext = (0, _CalendarContext.useCalendarContext)(),\n      _useCalendarContext$d = _useCalendarContext.date,\n      date = _useCalendarContext$d === void 0 ? new Date() : _useCalendarContext$d,\n      isoWeek = _useCalendarContext.isoWeek,\n      overrideLocale = _useCalendarContext.locale;\n\n  var _useCustom = (0, _utils.useCustom)('Calendar', overrideLocale),\n      locale = _useCustom.locale,\n      formatDate = _useCustom.formatDate;\n\n  var thisMonthDate = _utils.DateUtils.setDate(date, 1);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      withClassPrefix = _useClassNames.withClassPrefix;\n\n  var classes = merge(className, withClassPrefix());\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: ref,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 20,\n      columnNumber: 7\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Table.default, {\n    rows: _utils.DateUtils.getMonthView(thisMonthDate, isoWeek),\n    \"aria-label\": formatDate(thisMonthDate, locale.formattedMonthPattern),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 21,\n      columnNumber: 9\n    }\n  }));\n});\n\nView.displayName = 'View';\nView.propTypes = {\n  as: _propTypes.default.elementType,\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string\n};\nvar _default = View;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Calendar/View.tsx?");
 
 /***/ }),
 
@@ -2023,7 +2023,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _clone = _interopRequireDefault(__webpack_require__(/*! lodash/clone */ \"./node_modules/lodash/clone.js\"));\n\nvar _isUndefined = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\n\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\n\nvar _remove = _interopRequireDefault(__webpack_require__(/*! lodash/remove */ \"./node_modules/lodash/remove.js\"));\n\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\n\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\n\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\n\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Picker = __webpack_require__(/*! ../Picker */ \"./src/Picker/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckPicker/CheckPicker.tsx\",\n    _this = void 0,\n    _templateObject;\n\nvar emptyArray = [];\n\nvar CheckPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$appearance = props.appearance,\n      appearance = _props$appearance === void 0 ? 'default' : _props$appearance,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n      _props$countable = props.countable,\n      countable = _props$countable === void 0 ? true : _props$countable,\n      _props$data = props.data,\n      data = _props$data === void 0 ? emptyArray : _props$data,\n      _props$disabledItemVa = props.disabledItemValues,\n      disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,\n      _props$valueKey = props.valueKey,\n      valueKey = _props$valueKey === void 0 ? 'value' : _props$valueKey,\n      _props$labelKey = props.labelKey,\n      labelKey = _props$labelKey === void 0 ? 'label' : _props$labelKey,\n      _props$searchable = props.searchable,\n      searchable = _props$searchable === void 0 ? true : _props$searchable,\n      virtualized = props.virtualized,\n      _props$cleanable = props.cleanable,\n      cleanable = _props$cleanable === void 0 ? true : _props$cleanable,\n      _props$placement = props.placement,\n      placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n      _props$menuAutoWidth = props.menuAutoWidth,\n      menuAutoWidth = _props$menuAutoWidth === void 0 ? true : _props$menuAutoWidth,\n      _props$menuMaxHeight = props.menuMaxHeight,\n      menuMaxHeight = _props$menuMaxHeight === void 0 ? 320 : _props$menuMaxHeight,\n      menuClassName = props.menuClassName,\n      menuStyle = props.menuStyle,\n      overrideLocale = props.locale,\n      placeholder = props.placeholder,\n      disabled = props.disabled,\n      toggleAs = props.toggleAs,\n      style = props.style,\n      sticky = props.sticky,\n      valueProp = props.value,\n      defaultValue = props.defaultValue,\n      groupBy = props.groupBy,\n      listProps = props.listProps,\n      id = props.id,\n      sort = props.sort,\n      searchBy = props.searchBy,\n      renderMenuItem = props.renderMenuItem,\n      renderMenuGroup = props.renderMenuGroup,\n      renderValue = props.renderValue,\n      renderExtraFooter = props.renderExtraFooter,\n      renderMenu = props.renderMenu,\n      onGroupTitleClick = props.onGroupTitleClick,\n      onSearch = props.onSearch,\n      onEnter = props.onEnter,\n      onEntered = props.onEntered,\n      onExited = props.onExited,\n      onClean = props.onClean,\n      onChange = props.onChange,\n      onSelect = props.onSelect,\n      onClose = props.onClose,\n      onOpen = props.onOpen,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"appearance\", \"classPrefix\", \"countable\", \"data\", \"disabledItemValues\", \"valueKey\", \"labelKey\", \"searchable\", \"virtualized\", \"cleanable\", \"placement\", \"menuAutoWidth\", \"menuMaxHeight\", \"menuClassName\", \"menuStyle\", \"locale\", \"placeholder\", \"disabled\", \"toggleAs\", \"style\", \"sticky\", \"value\", \"defaultValue\", \"groupBy\", \"listProps\", \"id\", \"sort\", \"searchBy\", \"renderMenuItem\", \"renderMenuGroup\", \"renderValue\", \"renderExtraFooter\", \"renderMenu\", \"onGroupTitleClick\", \"onSearch\", \"onEnter\", \"onEntered\", \"onExited\", \"onClean\", \"onChange\", \"onSelect\", \"onClose\", \"onOpen\"]);\n  var triggerRef = (0, _react.useRef)(null);\n  var targetRef = (0, _react.useRef)(null);\n  var overlayRef = (0, _react.useRef)(null);\n  var searchInputRef = (0, _react.useRef)(null);\n\n  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),\n      locale = _useCustom.locale;\n\n  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue || []),\n      value = _useControlled[0],\n      setValue = _useControlled[1]; // Used to hover the focuse item  when trigger `onKeydown`\n\n\n  var _useFocusItemValue = (0, _Picker.useFocusItemValue)(value === null || value === void 0 ? void 0 : value[0], {\n    data: data,\n    valueKey: valueKey,\n    target: function target() {\n      return overlayRef.current;\n    }\n  }),\n      focusItemValue = _useFocusItemValue.focusItemValue,\n      setFocusItemValue = _useFocusItemValue.setFocusItemValue,\n      onFocusItem = _useFocusItemValue.onKeyDown;\n\n  var handleSearchCallback = (0, _react.useCallback)(function (searchKeyword, filteredData, event) {\n    var _filteredData$;\n\n    // The first option after filtering is the focus.\n    setFocusItemValue(filteredData === null || filteredData === void 0 ? void 0 : (_filteredData$ = filteredData[0]) === null || _filteredData$ === void 0 ? void 0 : _filteredData$[valueKey]);\n    onSearch === null || onSearch === void 0 ? void 0 : onSearch(searchKeyword, event);\n  }, [setFocusItemValue, onSearch, valueKey]); // Use search keywords to filter options.\n\n  var _useSearch = (0, _Picker.useSearch)({\n    labelKey: labelKey,\n    data: data,\n    searchBy: searchBy,\n    callback: handleSearchCallback\n  }),\n      searchKeyword = _useSearch.searchKeyword,\n      filteredData = _useSearch.filteredData,\n      setSearchKeyword = _useSearch.setSearchKeyword,\n      handleSearch = _useSearch.handleSearch,\n      checkShouldDisplay = _useSearch.checkShouldDisplay; // Use component active state to support keyboard events.\n\n\n  var _useState = (0, _react.useState)(false),\n      active = _useState[0],\n      setActive = _useState[1]; // A list of shortcut options.\n  // when opened again, the selected options are displayed at the top.\n\n\n  var _useState2 = (0, _react.useState)([]),\n      stickyItems = _useState2[0],\n      setStickyItems = _useState2[1];\n\n  var initStickyItems = function initStickyItems() {\n    if (!sticky) {\n      return;\n    }\n\n    var nextStickyItems = [];\n\n    if (data && value.length) {\n      nextStickyItems = data.filter(function (item) {\n        return value.some(function (v) {\n          return v === item[valueKey];\n        });\n      });\n    }\n\n    setStickyItems(nextStickyItems);\n  };\n\n  var handleChangeValue = (0, _react.useCallback)(function (value, event) {\n    onChange === null || onChange === void 0 ? void 0 : onChange(value, event);\n  }, [onChange]);\n  var handleClean = (0, _react.useCallback)(function (event) {\n    if (disabled || !cleanable) {\n      return;\n    }\n\n    setValue([]);\n    onClean === null || onClean === void 0 ? void 0 : onClean(event);\n    handleChangeValue([], event);\n  }, [disabled, cleanable, setValue, onClean, handleChangeValue]);\n\n  var handleMenuPressEnter = function handleMenuPressEnter(event) {\n    var nextValue = (0, _clone.default)(value);\n\n    if (!focusItemValue) {\n      return;\n    }\n\n    if (!nextValue.some(function (v) {\n      return (0, _utils.shallowEqual)(v, focusItemValue);\n    })) {\n      nextValue.push(focusItemValue);\n    } else {\n      (0, _remove.default)(nextValue, function (itemVal) {\n        return (0, _utils.shallowEqual)(itemVal, focusItemValue);\n      });\n    }\n\n    var focusItem = data.find(function (item) {\n      return (0, _utils.shallowEqual)(item === null || item === void 0 ? void 0 : item[valueKey], focusItemValue);\n    });\n    setValue(nextValue);\n    handleSelect(nextValue, focusItem, event);\n    handleChangeValue(nextValue, event);\n  };\n\n  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !focusItemValue || !active,\n    triggerRef: triggerRef,\n    targetRef: targetRef,\n    overlayRef: overlayRef,\n    searchInputRef: searchInputRef,\n    active: active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter,\n    onMenuPressBackspace: handleClean,\n    onClose: function onClose() {\n      setFocusItemValue(null);\n    }\n  }, rest));\n  var handleSelect = (0, _react.useCallback)(function (nextItemValue, item, event) {\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(nextItemValue, item, event);\n  }, [onSelect]);\n  var handleItemSelect = (0, _react.useCallback)(function (nextItemValue, item, event, checked) {\n    var nextValue = (0, _clone.default)(value);\n\n    if (checked) {\n      nextValue.push(nextItemValue);\n    } else {\n      (0, _remove.default)(nextValue, function (itemVal) {\n        return (0, _utils.shallowEqual)(itemVal, nextItemValue);\n      });\n    }\n\n    setValue(nextValue);\n    setFocusItemValue(nextItemValue);\n    handleSelect(nextValue, item, event);\n    handleChangeValue(nextValue, event);\n  }, [value, setValue, handleSelect, handleChangeValue, setFocusItemValue]);\n  var handleEntered = (0, _react.useCallback)(function () {\n    setActive(true);\n    onOpen === null || onOpen === void 0 ? void 0 : onOpen();\n  }, [onOpen]);\n  var handleExited = (0, _react.useCallback)(function () {\n    setSearchKeyword('');\n    setFocusItemValue(null);\n    setActive(false);\n    onClose === null || onClose === void 0 ? void 0 : onClose();\n  }, [onClose, setFocusItemValue, setSearchKeyword]);\n  (0, _Picker.usePublicMethods)(ref, {\n    triggerRef: triggerRef,\n    overlayRef: overlayRef,\n    targetRef: targetRef\n  });\n  var selectedItems = data.filter(function (item) {\n    return value === null || value === void 0 ? void 0 : value.some(function (val) {\n      return (0, _utils.shallowEqual)(item[valueKey], val);\n    });\n  }) || [];\n  /**\n   * 1.Have a value and the value is valid.\n   * 2.Regardless of whether the value is valid, as long as renderValue is set, it is judged to have a value.\n   */\n\n  var hasValue = selectedItems.length > 0 || (value === null || value === void 0 ? void 0 : value.length) > 0 && (0, _isFunction.default)(renderValue);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      prefix = _useClassNames.prefix,\n      merge = _useClassNames.merge;\n\n  var selectedElement = placeholder;\n\n  if (selectedItems.length > 0) {\n    selectedElement = /*#__PURE__*/_react.default.createElement(_Picker.SelectedElement, {\n      selectedItems: selectedItems,\n      countable: countable,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      prefix: prefix,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 279,\n        columnNumber: 9\n      }\n    });\n  }\n\n  if ((value === null || value === void 0 ? void 0 : value.length) > 0 && (0, _isFunction.default)(renderValue)) {\n    selectedElement = renderValue(value, selectedItems, selectedElement); // If renderValue returns null or undefined, hasValue is false.\n\n    if ((0, _isNil.default)(selectedElement)) {\n      hasValue = false;\n    }\n  }\n\n  var renderDropdownMenu = function renderDropdownMenu(positionProps, speakerRef) {\n    var left = positionProps.left,\n        top = positionProps.top,\n        className = positionProps.className;\n    var classes = merge(className, menuClassName, prefix('check-menu'));\n    var styles = (0, _extends2.default)({}, menuStyle, {\n      left: left,\n      top: top\n    });\n    var items = filteredData;\n    var filteredStickyItems = [];\n\n    if (stickyItems) {\n      filteredStickyItems = (0, _treeUtils.filterNodesOfTree)(stickyItems, function (item) {\n        return checkShouldDisplay(item);\n      });\n      items = (0, _treeUtils.filterNodesOfTree)(data, function (item) {\n        return checkShouldDisplay(item) && !stickyItems.some(function (v) {\n          return v[valueKey] === item[valueKey];\n        });\n      });\n    } // Create a tree structure data when set `groupBy`\n\n\n    if (groupBy) {\n      items = (0, _utils.getDataGroupBy)(items, groupBy, sort);\n    } else if (typeof sort === 'function') {\n      items = items.sort(sort(false));\n    }\n\n    var menu = items.length || filteredStickyItems.length ? /*#__PURE__*/_react.default.createElement(_Picker.DropdownMenu, {\n      id: id ? id + \"-listbox\" : undefined,\n      listProps: listProps,\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      renderMenuGroup: renderMenuGroup,\n      renderMenuItem: renderMenuItem,\n      maxHeight: menuMaxHeight,\n      classPrefix: 'picker-check-menu',\n      dropdownMenuItemAs: _Picker.DropdownMenuCheckItem,\n      activeItemValues: value,\n      focusItemValue: focusItemValue,\n      data: [].concat(filteredStickyItems, items),\n      group: !(0, _isUndefined.default)(groupBy),\n      onSelect: handleItemSelect,\n      onGroupTitleClick: onGroupTitleClick,\n      virtualized: virtualized,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 320,\n        columnNumber: 11\n      }\n    }) : /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)([\"none\"]))),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 340,\n        columnNumber: 11\n      }\n    }, locale === null || locale === void 0 ? void 0 : locale.noResultsText);\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerOverlay, {\n      ref: (0, _utils.mergeRefs)(overlayRef, speakerRef),\n      autoWidth: menuAutoWidth,\n      className: classes,\n      style: styles,\n      onKeyDown: onPickerKeyDown,\n      target: triggerRef,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 344,\n        columnNumber: 9\n      }\n    }, searchable && /*#__PURE__*/_react.default.createElement(_Picker.SearchBar, {\n      placeholder: locale === null || locale === void 0 ? void 0 : locale.searchPlaceholder,\n      onChange: handleSearch,\n      value: searchKeyword,\n      inputRef: searchInputRef,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 353,\n        columnNumber: 13\n      }\n    }), renderMenu ? renderMenu(menu) : menu, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n    appearance: appearance,\n    classPrefix: classPrefix,\n    cleanable: cleanable,\n    countable: countable,\n    hasValue: hasValue,\n    name: 'check'\n  })),\n      classes = _usePickerClassName[0],\n      usedClassNamePropKeys = _usePickerClassName[1];\n\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: triggerRef,\n    placement: placement,\n    onEnter: (0, _utils.createChainedFunction)(initStickyItems, onEnter),\n    onEntered: (0, _utils.createChainedFunction)(handleEntered, onEntered),\n    onExited: (0, _utils.createChainedFunction)(handleExited, onExited),\n    speaker: renderDropdownMenu,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 377,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 386,\n      columnNumber: 9\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys)), {\n    id: id,\n    ref: targetRef,\n    appearance: appearance,\n    disabled: disabled,\n    onClean: handleClean,\n    onKeyDown: onPickerKeyDown,\n    as: toggleAs,\n    cleanable: cleanable && !disabled,\n    hasValue: hasValue,\n    active: active,\n    placement: placement,\n    inputValue: value,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 387,\n      columnNumber: 11\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder))));\n});\n\nCheckPicker.displayName = 'CheckPicker';\nCheckPicker.propTypes = (0, _extends2.default)({}, _Picker.listPickerPropTypes, {\n  locale: _propTypes.default.any,\n  appearance: _propTypes.default.oneOf(['default', 'subtle']),\n  menuAutoWidth: _propTypes.default.bool,\n  menuMaxHeight: _propTypes.default.number,\n  renderMenu: _propTypes.default.func,\n  renderMenuItem: _propTypes.default.func,\n  renderMenuGroup: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  onGroupTitleClick: _propTypes.default.func,\n  onSearch: _propTypes.default.func,\n  groupBy: _propTypes.default.any,\n  sort: _propTypes.default.func,\n  searchable: _propTypes.default.bool,\n  countable: _propTypes.default.bool,\n  sticky: _propTypes.default.bool,\n  virtualized: _propTypes.default.bool,\n  searchBy: _propTypes.default.func\n});\nvar _default = CheckPicker;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/CheckPicker/CheckPicker.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _clone = _interopRequireDefault(__webpack_require__(/*! lodash/clone */ \"./node_modules/lodash/clone.js\"));\n\nvar _isUndefined = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\n\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\n\nvar _remove = _interopRequireDefault(__webpack_require__(/*! lodash/remove */ \"./node_modules/lodash/remove.js\"));\n\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\n\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\n\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\n\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Picker = __webpack_require__(/*! ../Picker */ \"./src/Picker/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckPicker/CheckPicker.tsx\",\n    _this = void 0,\n    _templateObject;\n\nvar emptyArray = [];\n\nvar CheckPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$appearance = props.appearance,\n      appearance = _props$appearance === void 0 ? 'default' : _props$appearance,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n      _props$countable = props.countable,\n      countable = _props$countable === void 0 ? true : _props$countable,\n      _props$data = props.data,\n      data = _props$data === void 0 ? emptyArray : _props$data,\n      _props$disabledItemVa = props.disabledItemValues,\n      disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,\n      _props$valueKey = props.valueKey,\n      valueKey = _props$valueKey === void 0 ? 'value' : _props$valueKey,\n      _props$labelKey = props.labelKey,\n      labelKey = _props$labelKey === void 0 ? 'label' : _props$labelKey,\n      _props$searchable = props.searchable,\n      searchable = _props$searchable === void 0 ? true : _props$searchable,\n      virtualized = props.virtualized,\n      _props$cleanable = props.cleanable,\n      cleanable = _props$cleanable === void 0 ? true : _props$cleanable,\n      _props$placement = props.placement,\n      placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n      _props$menuAutoWidth = props.menuAutoWidth,\n      menuAutoWidth = _props$menuAutoWidth === void 0 ? true : _props$menuAutoWidth,\n      _props$menuMaxHeight = props.menuMaxHeight,\n      menuMaxHeight = _props$menuMaxHeight === void 0 ? 320 : _props$menuMaxHeight,\n      menuClassName = props.menuClassName,\n      menuStyle = props.menuStyle,\n      overrideLocale = props.locale,\n      placeholder = props.placeholder,\n      disabled = props.disabled,\n      toggleAs = props.toggleAs,\n      style = props.style,\n      sticky = props.sticky,\n      valueProp = props.value,\n      defaultValue = props.defaultValue,\n      groupBy = props.groupBy,\n      listProps = props.listProps,\n      id = props.id,\n      sort = props.sort,\n      searchBy = props.searchBy,\n      renderMenuItem = props.renderMenuItem,\n      renderMenuGroup = props.renderMenuGroup,\n      renderValue = props.renderValue,\n      renderExtraFooter = props.renderExtraFooter,\n      renderMenu = props.renderMenu,\n      onGroupTitleClick = props.onGroupTitleClick,\n      onSearch = props.onSearch,\n      onEnter = props.onEnter,\n      onEntered = props.onEntered,\n      onExited = props.onExited,\n      onClean = props.onClean,\n      onChange = props.onChange,\n      onSelect = props.onSelect,\n      onClose = props.onClose,\n      onOpen = props.onOpen,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"appearance\", \"classPrefix\", \"countable\", \"data\", \"disabledItemValues\", \"valueKey\", \"labelKey\", \"searchable\", \"virtualized\", \"cleanable\", \"placement\", \"menuAutoWidth\", \"menuMaxHeight\", \"menuClassName\", \"menuStyle\", \"locale\", \"placeholder\", \"disabled\", \"toggleAs\", \"style\", \"sticky\", \"value\", \"defaultValue\", \"groupBy\", \"listProps\", \"id\", \"sort\", \"searchBy\", \"renderMenuItem\", \"renderMenuGroup\", \"renderValue\", \"renderExtraFooter\", \"renderMenu\", \"onGroupTitleClick\", \"onSearch\", \"onEnter\", \"onEntered\", \"onExited\", \"onClean\", \"onChange\", \"onSelect\", \"onClose\", \"onOpen\"]);\n  var triggerRef = (0, _react.useRef)(null);\n  var targetRef = (0, _react.useRef)(null);\n  var overlayRef = (0, _react.useRef)(null);\n  var searchInputRef = (0, _react.useRef)(null);\n\n  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),\n      locale = _useCustom.locale;\n\n  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue || []),\n      value = _useControlled[0],\n      setValue = _useControlled[1]; // Used to hover the focuse item  when trigger `onKeydown`\n\n\n  var _useFocusItemValue = (0, _Picker.useFocusItemValue)(value === null || value === void 0 ? void 0 : value[0], {\n    data: data,\n    valueKey: valueKey,\n    target: function target() {\n      return overlayRef.current;\n    }\n  }),\n      focusItemValue = _useFocusItemValue.focusItemValue,\n      setFocusItemValue = _useFocusItemValue.setFocusItemValue,\n      onFocusItem = _useFocusItemValue.onKeyDown;\n\n  var handleSearchCallback = (0, _react.useCallback)(function (searchKeyword, filteredData, event) {\n    var _filteredData$;\n\n    // The first option after filtering is the focus.\n    setFocusItemValue(filteredData === null || filteredData === void 0 ? void 0 : (_filteredData$ = filteredData[0]) === null || _filteredData$ === void 0 ? void 0 : _filteredData$[valueKey]);\n    onSearch === null || onSearch === void 0 ? void 0 : onSearch(searchKeyword, event);\n  }, [setFocusItemValue, onSearch, valueKey]); // Use search keywords to filter options.\n\n  var _useSearch = (0, _Picker.useSearch)({\n    labelKey: labelKey,\n    data: data,\n    searchBy: searchBy,\n    callback: handleSearchCallback\n  }),\n      searchKeyword = _useSearch.searchKeyword,\n      filteredData = _useSearch.filteredData,\n      setSearchKeyword = _useSearch.setSearchKeyword,\n      handleSearch = _useSearch.handleSearch,\n      checkShouldDisplay = _useSearch.checkShouldDisplay; // Use component active state to support keyboard events.\n\n\n  var _useState = (0, _react.useState)(false),\n      active = _useState[0],\n      setActive = _useState[1]; // A list of shortcut options.\n  // when opened again, the selected options are displayed at the top.\n\n\n  var _useState2 = (0, _react.useState)([]),\n      stickyItems = _useState2[0],\n      setStickyItems = _useState2[1];\n\n  var initStickyItems = function initStickyItems() {\n    if (!sticky) {\n      return;\n    }\n\n    var nextStickyItems = [];\n\n    if (data && value.length) {\n      nextStickyItems = data.filter(function (item) {\n        return value.some(function (v) {\n          return v === item[valueKey];\n        });\n      });\n    }\n\n    setStickyItems(nextStickyItems);\n  };\n\n  var handleChangeValue = (0, _react.useCallback)(function (value, event) {\n    onChange === null || onChange === void 0 ? void 0 : onChange(value, event);\n  }, [onChange]);\n  var handleClean = (0, _react.useCallback)(function (event) {\n    if (disabled || !cleanable) {\n      return;\n    }\n\n    setValue([]);\n    onClean === null || onClean === void 0 ? void 0 : onClean(event);\n    handleChangeValue([], event);\n  }, [disabled, cleanable, setValue, onClean, handleChangeValue]);\n\n  var handleMenuPressEnter = function handleMenuPressEnter(event) {\n    var nextValue = (0, _clone.default)(value);\n\n    if (!focusItemValue) {\n      return;\n    }\n\n    if (!nextValue.some(function (v) {\n      return (0, _utils.shallowEqual)(v, focusItemValue);\n    })) {\n      nextValue.push(focusItemValue);\n    } else {\n      (0, _remove.default)(nextValue, function (itemVal) {\n        return (0, _utils.shallowEqual)(itemVal, focusItemValue);\n      });\n    }\n\n    var focusItem = data.find(function (item) {\n      return (0, _utils.shallowEqual)(item === null || item === void 0 ? void 0 : item[valueKey], focusItemValue);\n    });\n    setValue(nextValue);\n    handleSelect(nextValue, focusItem, event);\n    handleChangeValue(nextValue, event);\n  };\n\n  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !focusItemValue || !active,\n    triggerRef: triggerRef,\n    targetRef: targetRef,\n    overlayRef: overlayRef,\n    searchInputRef: searchInputRef,\n    active: active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter,\n    onMenuPressBackspace: handleClean,\n    onClose: function onClose() {\n      setFocusItemValue(null);\n    }\n  }, rest));\n  var handleSelect = (0, _react.useCallback)(function (nextItemValue, item, event) {\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(nextItemValue, item, event);\n  }, [onSelect]);\n  var handleItemSelect = (0, _react.useCallback)(function (nextItemValue, item, event, checked) {\n    var nextValue = (0, _clone.default)(value);\n\n    if (checked) {\n      nextValue.push(nextItemValue);\n    } else {\n      (0, _remove.default)(nextValue, function (itemVal) {\n        return (0, _utils.shallowEqual)(itemVal, nextItemValue);\n      });\n    }\n\n    setValue(nextValue);\n    setFocusItemValue(nextItemValue);\n    handleSelect(nextValue, item, event);\n    handleChangeValue(nextValue, event);\n  }, [value, setValue, handleSelect, handleChangeValue, setFocusItemValue]);\n  var handleEntered = (0, _react.useCallback)(function () {\n    setActive(true);\n    onOpen === null || onOpen === void 0 ? void 0 : onOpen();\n  }, [onOpen]);\n  var handleExited = (0, _react.useCallback)(function () {\n    setSearchKeyword('');\n    setFocusItemValue(null);\n    setActive(false);\n    onClose === null || onClose === void 0 ? void 0 : onClose();\n  }, [onClose, setFocusItemValue, setSearchKeyword]);\n  (0, _Picker.usePublicMethods)(ref, {\n    triggerRef: triggerRef,\n    overlayRef: overlayRef,\n    targetRef: targetRef\n  });\n  var selectedItems = data.filter(function (item) {\n    return value === null || value === void 0 ? void 0 : value.some(function (val) {\n      return (0, _utils.shallowEqual)(item[valueKey], val);\n    });\n  }) || [];\n  /**\n   * 1.Have a value and the value is valid.\n   * 2.Regardless of whether the value is valid, as long as renderValue is set, it is judged to have a value.\n   */\n\n  var hasValue = selectedItems.length > 0 || (value === null || value === void 0 ? void 0 : value.length) > 0 && (0, _isFunction.default)(renderValue);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      prefix = _useClassNames.prefix,\n      merge = _useClassNames.merge;\n\n  var selectedElement = placeholder;\n\n  if (selectedItems.length > 0) {\n    selectedElement = /*#__PURE__*/_react.default.createElement(_Picker.SelectedElement, {\n      selectedItems: selectedItems,\n      countable: countable,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      prefix: prefix,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 289,\n        columnNumber: 9\n      }\n    });\n  }\n\n  if ((value === null || value === void 0 ? void 0 : value.length) > 0 && (0, _isFunction.default)(renderValue)) {\n    selectedElement = renderValue(value, selectedItems, selectedElement); // If renderValue returns null or undefined, hasValue is false.\n\n    if ((0, _isNil.default)(selectedElement)) {\n      hasValue = false;\n    }\n  }\n\n  var renderDropdownMenu = function renderDropdownMenu(positionProps, speakerRef) {\n    var left = positionProps.left,\n        top = positionProps.top,\n        className = positionProps.className;\n    var classes = merge(className, menuClassName, prefix('check-menu'));\n    var styles = (0, _extends2.default)({}, menuStyle, {\n      left: left,\n      top: top\n    });\n    var items = filteredData;\n    var filteredStickyItems = [];\n\n    if (stickyItems) {\n      filteredStickyItems = (0, _treeUtils.filterNodesOfTree)(stickyItems, function (item) {\n        return checkShouldDisplay(item);\n      });\n      items = (0, _treeUtils.filterNodesOfTree)(data, function (item) {\n        return checkShouldDisplay(item) && !stickyItems.some(function (v) {\n          return v[valueKey] === item[valueKey];\n        });\n      });\n    } // Create a tree structure data when set `groupBy`\n\n\n    if (groupBy) {\n      items = (0, _utils.getDataGroupBy)(items, groupBy, sort);\n    } else if (typeof sort === 'function') {\n      items = items.sort(sort(false));\n    }\n\n    var menu = items.length || filteredStickyItems.length ? /*#__PURE__*/_react.default.createElement(_Picker.DropdownMenu, {\n      id: id ? id + \"-listbox\" : undefined,\n      listProps: listProps,\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      renderMenuGroup: renderMenuGroup,\n      renderMenuItem: renderMenuItem,\n      maxHeight: menuMaxHeight,\n      classPrefix: 'picker-check-menu',\n      dropdownMenuItemAs: _Picker.DropdownMenuCheckItem,\n      activeItemValues: value,\n      focusItemValue: focusItemValue,\n      data: [].concat(filteredStickyItems, items),\n      group: !(0, _isUndefined.default)(groupBy),\n      onSelect: handleItemSelect,\n      onGroupTitleClick: onGroupTitleClick,\n      virtualized: virtualized,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 330,\n        columnNumber: 11\n      }\n    }) : /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)([\"none\"]))),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 350,\n        columnNumber: 11\n      }\n    }, locale === null || locale === void 0 ? void 0 : locale.noResultsText);\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerOverlay, {\n      ref: (0, _utils.mergeRefs)(overlayRef, speakerRef),\n      autoWidth: menuAutoWidth,\n      className: classes,\n      style: styles,\n      onKeyDown: onPickerKeyDown,\n      target: triggerRef,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 354,\n        columnNumber: 9\n      }\n    }, searchable && /*#__PURE__*/_react.default.createElement(_Picker.SearchBar, {\n      placeholder: locale === null || locale === void 0 ? void 0 : locale.searchPlaceholder,\n      onChange: handleSearch,\n      value: searchKeyword,\n      inputRef: searchInputRef,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 363,\n        columnNumber: 13\n      }\n    }), renderMenu ? renderMenu(menu) : menu, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n    appearance: appearance,\n    classPrefix: classPrefix,\n    cleanable: cleanable,\n    countable: countable,\n    hasValue: hasValue,\n    name: 'check'\n  })),\n      classes = _usePickerClassName[0],\n      usedClassNamePropKeys = _usePickerClassName[1];\n\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: triggerRef,\n    placement: placement,\n    onEnter: (0, _utils.createChainedFunction)(initStickyItems, onEnter),\n    onEntered: (0, _utils.createChainedFunction)(handleEntered, onEntered),\n    onExited: (0, _utils.createChainedFunction)(handleExited, onExited),\n    speaker: renderDropdownMenu,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 387,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 396,\n      columnNumber: 9\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys)), {\n    id: id,\n    ref: targetRef,\n    appearance: appearance,\n    disabled: disabled,\n    onClean: handleClean,\n    onKeyDown: onPickerKeyDown,\n    as: toggleAs,\n    cleanable: cleanable && !disabled,\n    hasValue: hasValue,\n    active: active,\n    placement: placement,\n    inputValue: value,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 397,\n      columnNumber: 11\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder))));\n});\n\nCheckPicker.displayName = 'CheckPicker';\nCheckPicker.propTypes = (0, _extends2.default)({}, _Picker.listPickerPropTypes, {\n  locale: _propTypes.default.any,\n  appearance: _propTypes.default.oneOf(['default', 'subtle']),\n  menuAutoWidth: _propTypes.default.bool,\n  menuMaxHeight: _propTypes.default.number,\n  renderMenu: _propTypes.default.func,\n  renderMenuItem: _propTypes.default.func,\n  renderMenuGroup: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  onGroupTitleClick: _propTypes.default.func,\n  onSearch: _propTypes.default.func,\n  groupBy: _propTypes.default.any,\n  sort: _propTypes.default.func,\n  searchable: _propTypes.default.bool,\n  countable: _propTypes.default.bool,\n  sticky: _propTypes.default.bool,\n  virtualized: _propTypes.default.bool,\n  searchBy: _propTypes.default.func\n});\nvar _default = CheckPicker;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/CheckPicker/CheckPicker.tsx?");
 
 /***/ }),
 
@@ -2045,7 +2045,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _CheckTreePicker = _interopRequireDefault(__webpack_require__(/*! ../CheckTreePicker */ \"./src/CheckTreePicker/index.tsx\"));\n\nvar _TreeContext = _interopRequireDefault(__webpack_require__(/*! ../Tree/TreeContext */ \"./src/Tree/TreeContext.ts\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckTree/index.tsx\",\n    _this = void 0;\n\nvar CheckTree = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var dragNodeRef = (0, _react.useRef)();\n  return /*#__PURE__*/_react.default.createElement(_TreeContext.default.Provider, {\n    value: {\n      inline: true,\n      dragNodeRef: dragNodeRef\n    },\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 19,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_CheckTreePicker.default, (0, _extends2.default)({\n    ref: ref\n  }, props, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 20,\n      columnNumber: 9\n    }\n  })));\n});\n\nCheckTree.displayName = 'CheckTree';\nvar _default = CheckTree;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/index.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _CheckTreePicker = _interopRequireDefault(__webpack_require__(/*! ../CheckTreePicker */ \"./src/CheckTreePicker/index.tsx\"));\n\nvar _TreeContext = _interopRequireDefault(__webpack_require__(/*! ../Tree/TreeContext */ \"./src/Tree/TreeContext.ts\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckTree/index.tsx\",\n    _this = void 0;\n\nvar CheckTree = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var contextValue = (0, _react.useMemo)(function () {\n    return {\n      inline: true\n    };\n  }, []);\n  return /*#__PURE__*/_react.default.createElement(_TreeContext.default.Provider, {\n    value: contextValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 19,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_CheckTreePicker.default, (0, _extends2.default)({\n    ref: ref\n  }, props, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 20,\n      columnNumber: 9\n    }\n  })));\n});\n\nCheckTree.displayName = 'CheckTree';\nvar _default = CheckTree;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/index.tsx?");
 
 /***/ }),
 
@@ -2199,7 +2199,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = exports.ContainerContext = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Container/Container.tsx\",\n    _this = void 0;\n\nvar ContainerContext = /*#__PURE__*/_react.default.createContext({});\n\nexports.ContainerContext = ContainerContext;\n\nvar Container = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'section' : _props$as,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'container' : _props$classPrefix,\n      className = props.className,\n      children = props.children,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"className\", \"children\"]);\n\n  var _useState = (0, _react.useState)(false),\n      hasSidebar = _useState[0],\n      setHasSidebar = _useState[1];\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var classes = merge(className, withClassPrefix({\n    'has-sidebar': hasSidebar\n  }));\n  return /*#__PURE__*/_react.default.createElement(ContainerContext.Provider, {\n    value: {\n      setHasSidebar: setHasSidebar\n    },\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 26,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: ref,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 27,\n      columnNumber: 7\n    }\n  }), children));\n});\n\nContainer.displayName = 'Container';\nContainer.propTypes = {\n  className: _propTypes.default.string,\n  children: _propTypes.default.node,\n  classPrefix: _propTypes.default.string\n};\nvar _default = Container;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Container/Container.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = exports.ContainerContext = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Container/Container.tsx\",\n    _this = void 0;\n\nvar ContainerContext = /*#__PURE__*/_react.default.createContext({});\n\nexports.ContainerContext = ContainerContext;\n\nvar Container = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'section' : _props$as,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'container' : _props$classPrefix,\n      className = props.className,\n      children = props.children,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"className\", \"children\"]);\n\n  var _useState = (0, _react.useState)(false),\n      hasSidebar = _useState[0],\n      setHasSidebar = _useState[1];\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var classes = merge(className, withClassPrefix({\n    'has-sidebar': hasSidebar\n  }));\n  var contextValue = (0, _react.useMemo)(function () {\n    return {\n      setHasSidebar: setHasSidebar\n    };\n  }, [setHasSidebar]);\n  return /*#__PURE__*/_react.default.createElement(ContainerContext.Provider, {\n    value: contextValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 27,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: ref,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 28,\n      columnNumber: 7\n    }\n  }), children));\n});\n\nContainer.displayName = 'Container';\nContainer.propTypes = {\n  className: _propTypes.default.string,\n  children: _propTypes.default.node,\n  classPrefix: _propTypes.default.string\n};\nvar _default = Container;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Container/Container.tsx?");
 
 /***/ }),
 
@@ -2298,7 +2298,7 @@ eval("\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar isElement
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\n\nvar _mapValues = _interopRequireDefault(__webpack_require__(/*! lodash/mapValues */ \"./node_modules/lodash/mapValues.js\"));\n\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\n\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\n\nvar _Calendar = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/Calendar */ \"./node_modules/@rsuite/icons/legacy/Calendar.js\"));\n\nvar _ClockO = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/ClockO */ \"./node_modules/@rsuite/icons/legacy/ClockO.js\"));\n\nvar _Calendar2 = __webpack_require__(/*! ../Calendar */ \"./src/Calendar/index.tsx\");\n\nvar _useCalendarDate2 = _interopRequireDefault(__webpack_require__(/*! ../Calendar/useCalendarDate */ \"./src/Calendar/useCalendarDate.ts\"));\n\nvar _Toolbar = _interopRequireDefault(__webpack_require__(/*! ./Toolbar */ \"./src/DatePicker/Toolbar.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Picker = __webpack_require__(/*! ../Picker */ \"./src/Picker/index.ts\");\n\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/DatePicker/utils.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DatePicker/DatePicker.tsx\",\n    _this = void 0;\n\nvar DatePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n      calendarDefaultDate = props.calendarDefaultDate,\n      _props$cleanable = props.cleanable,\n      cleanable = _props$cleanable === void 0 ? true : _props$cleanable,\n      defaultValue = props.defaultValue,\n      disabled = props.disabled,\n      _props$format = props.format,\n      formatStr = _props$format === void 0 ? 'yyyy-MM-dd' : _props$format,\n      isoWeek = props.isoWeek,\n      _props$limitEndYear = props.limitEndYear,\n      limitEndYear = _props$limitEndYear === void 0 ? 1000 : _props$limitEndYear,\n      overrideLocale = props.locale,\n      menuClassName = props.menuClassName,\n      _props$appearance = props.appearance,\n      appearance = _props$appearance === void 0 ? 'default' : _props$appearance,\n      _props$placement = props.placement,\n      placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n      oneTap = props.oneTap,\n      _props$placeholder = props.placeholder,\n      placeholder = _props$placeholder === void 0 ? '' : _props$placeholder,\n      ranges = props.ranges,\n      valueProp = props.value,\n      showMeridian = props.showMeridian,\n      showWeekNumbers = props.showWeekNumbers,\n      style = props.style,\n      toggleAs = props.toggleAs,\n      disabledDateProp = props.disabledDate,\n      renderValue = props.renderValue,\n      onChange = props.onChange,\n      onChangeCalendarDate = props.onChangeCalendarDate,\n      onClean = props.onClean,\n      onClose = props.onClose,\n      onEntered = props.onEntered,\n      onExited = props.onExited,\n      onNextMonth = props.onNextMonth,\n      onOk = props.onOk,\n      onOpen = props.onOpen,\n      onPrevMonth = props.onPrevMonth,\n      onSelect = props.onSelect,\n      onToggleMonthDropdown = props.onToggleMonthDropdown,\n      onToggleTimeDropdown = props.onToggleTimeDropdown,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\", \"calendarDefaultDate\", \"cleanable\", \"defaultValue\", \"disabled\", \"format\", \"isoWeek\", \"limitEndYear\", \"locale\", \"menuClassName\", \"appearance\", \"placement\", \"oneTap\", \"placeholder\", \"ranges\", \"value\", \"showMeridian\", \"showWeekNumbers\", \"style\", \"toggleAs\", \"disabledDate\", \"renderValue\", \"onChange\", \"onChangeCalendarDate\", \"onClean\", \"onClose\", \"onEntered\", \"onExited\", \"onNextMonth\", \"onOk\", \"onOpen\", \"onPrevMonth\", \"onSelect\", \"onToggleMonthDropdown\", \"onToggleTimeDropdown\"]);\n\n  var _useCustom = (0, _utils.useCustom)('DatePicker', overrideLocale),\n      locale = _useCustom.locale,\n      formatDate = _useCustom.formatDate,\n      parseDate = _useCustom.parseDate;\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      prefix = _useClassNames.prefix;\n\n  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue),\n      value = _useControlled[0],\n      setValue = _useControlled[1];\n\n  var _useCalendarDate = (0, _useCalendarDate2.default)(valueProp, calendarDefaultDate),\n      calendarDate = _useCalendarDate.calendarDate,\n      setCalendarDate = _useCalendarDate.setCalendarDate;\n\n  var _useState = (0, _react.useState)(),\n      inputState = _useState[0],\n      setInputState = _useState[1];\n\n  var _useCalendarState = (0, _utils2.useCalendarState)(),\n      calendarState = _useCalendarState.calendarState,\n      reset = _useCalendarState.reset,\n      openMonth = _useCalendarState.openMonth,\n      openTime = _useCalendarState.openTime;\n\n  var _useState2 = (0, _react.useState)(false),\n      active = _useState2[0],\n      setActive = _useState2[1];\n\n  var triggerRef = (0, _react.useRef)(null);\n  var rootRef = (0, _react.useRef)(null);\n  var targetRef = (0, _react.useRef)(null);\n  var overlayRef = (0, _react.useRef)(null);\n  (0, _Picker.usePublicMethods)(ref, {\n    rootRef: rootRef,\n    triggerRef: triggerRef,\n    overlayRef: overlayRef,\n    targetRef: targetRef\n  });\n  /**\n   * Switch to the callback triggered after the next month.\n   */\n\n  var handleMoveForward = (0, _react.useCallback)(function (nextPageDate) {\n    setCalendarDate(nextPageDate);\n    onNextMonth === null || onNextMonth === void 0 ? void 0 : onNextMonth(nextPageDate);\n    onChangeCalendarDate === null || onChangeCalendarDate === void 0 ? void 0 : onChangeCalendarDate(nextPageDate);\n  }, [onChangeCalendarDate, onNextMonth, setCalendarDate]);\n  /**\n   * Switch to the callback triggered after the previous month.\n   */\n\n  var handleMoveBackward = (0, _react.useCallback)(function (nextPageDate) {\n    setCalendarDate(nextPageDate);\n    onPrevMonth === null || onPrevMonth === void 0 ? void 0 : onPrevMonth(nextPageDate);\n    onChangeCalendarDate === null || onChangeCalendarDate === void 0 ? void 0 : onChangeCalendarDate(nextPageDate);\n  }, [onChangeCalendarDate, onPrevMonth, setCalendarDate]);\n  /**\n   * The callback triggered when the date changes.\n   */\n\n  var handleDateChange = (0, _react.useCallback)(function (nextValue, event) {\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(nextValue, event);\n    onChangeCalendarDate === null || onChangeCalendarDate === void 0 ? void 0 : onChangeCalendarDate(nextValue, event);\n  }, [onChangeCalendarDate, onSelect]);\n  /**\n   *  A callback triggered when the date on the calendar changes.\n   */\n\n  var handleChangePageDate = (0, _react.useCallback)(function (nextPageDate) {\n    setCalendarDate(nextPageDate);\n    reset();\n    handleDateChange(nextPageDate);\n  }, [handleDateChange, reset, setCalendarDate]);\n  /**\n   *  A callback triggered when the time on the calendar changes.\n   */\n\n  var handleChangePageTime = (0, _react.useCallback)(function (nextPageTime) {\n    setCalendarDate(nextPageTime);\n    handleDateChange(nextPageTime);\n  }, [handleDateChange, setCalendarDate]);\n  var handleClose = (0, _react.useCallback)(function () {\n    var _triggerRef$current, _triggerRef$current$c;\n\n    (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : (_triggerRef$current$c = _triggerRef$current.close) === null || _triggerRef$current$c === void 0 ? void 0 : _triggerRef$current$c.call(_triggerRef$current);\n  }, []);\n  /**\n   * The callback triggered when PM/AM is switched.\n   */\n\n  var handleToggleMeridian = (0, _react.useCallback)(function () {\n    var hours = _utils.DateUtils.getHours(calendarDate);\n\n    var nextHours = hours >= 12 ? hours - 12 : hours + 12;\n\n    var nextDate = _utils.DateUtils.setHours(calendarDate, nextHours);\n\n    setCalendarDate(nextDate);\n  }, [calendarDate, setCalendarDate]);\n  var updateValue = (0, _react.useCallback)(function (event, nextPageDate, closeOverlay) {\n    if (closeOverlay === void 0) {\n      closeOverlay = true;\n    }\n\n    var nextValue = !(0, _isNil.default)(nextPageDate) ? nextPageDate : calendarDate;\n    setCalendarDate(nextValue || new Date());\n    setValue(nextValue);\n\n    if (nextValue !== value || !_utils.DateUtils.isSameDay(nextValue, value)) {\n      onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n    } // `closeOverlay` default value is `true`\n\n\n    if (closeOverlay !== false) {\n      handleClose();\n    }\n  }, [handleClose, onChange, calendarDate, setCalendarDate, setValue, value]);\n  /**\n   * The callback triggered after the date in the shortcut area is clicked.\n   */\n\n  var handleShortcutPageDate = (0, _react.useCallback)(function (value, closeOverlay, event) {\n    updateValue(event, value, closeOverlay);\n    handleDateChange(value, event);\n  }, [handleDateChange, updateValue]);\n  /**\n   * The callback triggered after clicking the OK button.\n   */\n\n  var handleOK = (0, _react.useCallback)(function (event) {\n    updateValue(event);\n    onOk === null || onOk === void 0 ? void 0 : onOk(calendarDate, event);\n  }, [updateValue, onOk, calendarDate]);\n  /**\n   * Toggle month selection panel\n   */\n\n  var handleMonthDropdown = (0, _react.useCallback)(function () {\n    if (calendarState === _Calendar2.CalendarState.DROP_MONTH) {\n      reset();\n    } else {\n      openMonth();\n    }\n\n    onToggleMonthDropdown === null || onToggleMonthDropdown === void 0 ? void 0 : onToggleMonthDropdown(calendarState !== _Calendar2.CalendarState.DROP_MONTH);\n  }, [calendarState, onToggleMonthDropdown, openMonth, reset]);\n  /**\n   * Switch time selection panel\n   */\n\n  var handleTimeDropdown = (0, _react.useCallback)(function () {\n    if (calendarState === _Calendar2.CalendarState.DROP_TIME) {\n      reset();\n    } else {\n      openTime();\n    }\n\n    onToggleTimeDropdown === null || onToggleTimeDropdown === void 0 ? void 0 : onToggleTimeDropdown(calendarState !== _Calendar2.CalendarState.DROP_TIME);\n  }, [calendarState, onToggleTimeDropdown, openTime, reset]);\n  /**\n   * Callback after clicking the clear button.\n   */\n\n  var handleClean = (0, _react.useCallback)(function (event) {\n    setCalendarDate(new Date());\n    updateValue(event, null);\n  }, [setCalendarDate, updateValue]);\n  /**\n   * Handle keyboard events.\n   */\n\n  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    triggerRef: triggerRef,\n    targetRef: targetRef,\n    active: active,\n    onExit: handleClean\n  }, rest));\n  /**\n   * Callback after the date is selected.\n   */\n\n  var handleSelect = (0, _react.useCallback)(function (nextValue, event, updatableValue) {\n    if (updatableValue === void 0) {\n      updatableValue = true;\n    }\n\n    setCalendarDate( // Determine whether the current value contains time, if not, use calendarDate.\n    _utils.DateUtils.shouldTime(formatStr) ? nextValue : (0, _utils.composeFunctions)(function (d) {\n      return _utils.DateUtils.setHours(d, _utils.DateUtils.getHours(calendarDate));\n    }, function (d) {\n      return _utils.DateUtils.setMinutes(d, _utils.DateUtils.getMinutes(calendarDate));\n    }, function (d) {\n      return _utils.DateUtils.setSeconds(d, _utils.DateUtils.getSeconds(calendarDate));\n    })(nextValue));\n    handleDateChange(nextValue);\n\n    if (oneTap && updatableValue) {\n      updateValue(event, nextValue);\n    }\n  }, [formatStr, handleDateChange, oneTap, calendarDate, setCalendarDate, updateValue]);\n  var disabledDate = (0, _react.useCallback)(function (date) {\n    var _disabledDateProp;\n\n    return (_disabledDateProp = disabledDateProp === null || disabledDateProp === void 0 ? void 0 : disabledDateProp(date)) !== null && _disabledDateProp !== void 0 ? _disabledDateProp : false;\n  }, [disabledDateProp]);\n  /**\n   * Callback after the input box value is changed.\n   */\n\n  var handleInputChange = (0, _react.useCallback)(function (value, event) {\n    setInputState('Typing'); // isMatch('01/11/2020', 'MM/dd/yyyy') ==> true\n    // isMatch('2020-11-01', 'MM/dd/yyyy') ==> false\n\n    if (!_utils.DateUtils.isMatch(value, formatStr, {\n      locale: locale.dateLocale\n    })) {\n      setInputState('Error');\n      return;\n    }\n\n    var date = parseDate(value, formatStr); // If only the time is included in the characters, it will default to today.\n\n    if (_utils.DateUtils.shouldOnlyTime(formatStr)) {\n      date = new Date(_utils.DateUtils.format(new Date(), 'yyyy-MM-dd') + \" \" + value);\n    }\n\n    if (!_utils.DateUtils.isValid(date)) {\n      setInputState('Error');\n      return;\n    }\n\n    if (disabledDate(date)) {\n      setInputState('Error');\n      return;\n    }\n\n    handleSelect(date, event, false);\n  }, [formatStr, locale, parseDate, disabledDate, handleSelect]);\n  /**\n   * The callback after the enter key is triggered on the input\n   */\n\n  var handleInputPressEnd = (0, _react.useCallback)(function (event) {\n    if (inputState === 'Typing') {\n      updateValue(event, calendarDate);\n    }\n\n    setInputState('Initial');\n  }, [inputState, calendarDate, updateValue]);\n  var handleEntered = (0, _react.useCallback)(function () {\n    onOpen === null || onOpen === void 0 ? void 0 : onOpen();\n    setActive(true);\n  }, [onOpen]);\n  var handleExited = (0, _react.useCallback)(function () {\n    onClose === null || onClose === void 0 ? void 0 : onClose();\n    reset();\n    setActive(false);\n  }, [onClose, reset]); // Check whether the time is within the time range of the shortcut option in the toolbar.\n\n  var disabledToolbarHandle = (0, _react.useCallback)(function (date) {\n    var _disabledDateProp2;\n\n    var allowDate = (_disabledDateProp2 = disabledDateProp === null || disabledDateProp === void 0 ? void 0 : disabledDateProp(date)) !== null && _disabledDateProp2 !== void 0 ? _disabledDateProp2 : false;\n\n    var allowTime = _utils.DateUtils.disabledTime(props, date);\n\n    return allowDate || allowTime;\n  }, [disabledDateProp, props]);\n  var calendarProps = (0, _react.useMemo)(function () {\n    return (0, _mapValues.default)((0, _pick.default)(props, _utils.DateUtils.calendarOnlyProps), function (disabledOrHiddenTimeFunc) {\n      return function (next, date) {\n        var _disabledOrHiddenTime;\n\n        return (_disabledOrHiddenTime = disabledOrHiddenTimeFunc === null || disabledOrHiddenTimeFunc === void 0 ? void 0 : disabledOrHiddenTimeFunc(next, date)) !== null && _disabledOrHiddenTime !== void 0 ? _disabledOrHiddenTime : false;\n      };\n    });\n  }, [props]);\n  var inSameMonth = (0, _react.useCallback)(function (date) {\n    return _utils.DateUtils.isSameMonth(date, calendarDate);\n  }, [calendarDate]);\n\n  var calendar = /*#__PURE__*/_react.default.createElement(_Calendar2.Calendar, (0, _extends2.default)({}, calendarProps, {\n    locale: locale,\n    showWeekNumbers: showWeekNumbers,\n    showMeridian: showMeridian,\n    disabledDate: disabledDate,\n    limitEndYear: limitEndYear,\n    format: formatStr,\n    isoWeek: isoWeek,\n    inSameMonth: inSameMonth,\n    calendarState: calendarState,\n    calendarDate: calendarDate,\n    onMoveForward: handleMoveForward,\n    onMoveBackward: handleMoveBackward,\n    onSelect: handleSelect,\n    onToggleMonthDropdown: handleMonthDropdown,\n    onToggleTimeDropdown: handleTimeDropdown,\n    onChangePageDate: handleChangePageDate,\n    onChangePageTime: handleChangePageTime,\n    onToggleMeridian: handleToggleMeridian,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 473,\n      columnNumber: 7\n    }\n  }));\n\n  var renderDropdownMenu = function renderDropdownMenu(positionProps, speakerRef) {\n    var left = positionProps.left,\n        top = positionProps.top,\n        className = positionProps.className;\n    var classes = merge(menuClassName, className, prefix('date-menu'));\n    var styles = {\n      left: left,\n      top: top\n    };\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerOverlay, {\n      className: classes,\n      ref: (0, _utils.mergeRefs)(overlayRef, speakerRef),\n      style: styles,\n      target: triggerRef,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 501,\n        columnNumber: 9\n      }\n    }, calendar, /*#__PURE__*/_react.default.createElement(_Toolbar.default, {\n      locale: locale,\n      ranges: ranges,\n      calendarDate: calendarDate,\n      disabledOkBtn: disabledToolbarHandle,\n      disabledShortcut: disabledToolbarHandle,\n      onClickShortcut: handleShortcutPageDate,\n      onOk: handleOK,\n      hideOkBtn: oneTap,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 508,\n        columnNumber: 11\n      }\n    }));\n  };\n\n  var hasValue = !!value;\n\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n    classPrefix: classPrefix,\n    name: 'date',\n    appearance: appearance,\n    hasValue: hasValue,\n    cleanable: cleanable\n  })),\n      classes = _usePickerClassName[0],\n      usedClassNamePropKeys = _usePickerClassName[1];\n\n  var renderDate = (0, _react.useCallback)(function () {\n    var _renderValue;\n\n    if (!value) {\n      return placeholder || formatStr;\n    }\n\n    return (_renderValue = renderValue === null || renderValue === void 0 ? void 0 : renderValue(value, formatStr)) !== null && _renderValue !== void 0 ? _renderValue : formatDate(value, formatStr);\n  }, [formatStr, formatDate, placeholder, renderValue, value]);\n  var caretComponent = (0, _react.useMemo)(function () {\n    return _utils.DateUtils.shouldOnlyTime(formatStr) ? _ClockO.default : _Calendar.default;\n  }, [formatStr]);\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    trigger: \"active\",\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: triggerRef,\n    placement: placement,\n    onEntered: (0, _utils.createChainedFunction)(handleEntered, onEntered),\n    onExited: (0, _utils.createChainedFunction)(handleExited, onExited),\n    speaker: renderDropdownMenu,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 547,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: merge(className, classes),\n    style: style,\n    ref: rootRef,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 556,\n      columnNumber: 9\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys, _utils.DateUtils.calendarOnlyProps)), {\n    className: prefix({\n      error: inputState === 'Error'\n    }),\n    as: toggleAs,\n    ref: targetRef,\n    appearance: appearance,\n    input: true,\n    inputValue: value ? formatDate(value, formatStr) : '',\n    inputPlaceholder: typeof placeholder === 'string' && placeholder ? placeholder : formatStr,\n    inputMask: _utils.DateUtils.getDateMask(formatStr),\n    onInputChange: handleInputChange,\n    onInputBlur: handleInputPressEnd,\n    onInputPressEnter: handleInputPressEnd,\n    onKeyDown: onPickerKeyDown,\n    onClean: (0, _utils.createChainedFunction)(handleClean, onClean),\n    cleanable: cleanable && !disabled,\n    hasValue: hasValue,\n    active: active,\n    placement: placement,\n    disabled: disabled,\n    caretComponent: caretComponent,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 557,\n      columnNumber: 11\n    }\n  }), renderDate())));\n});\n\nDatePicker.displayName = 'DatePicker';\nDatePicker.propTypes = (0, _extends2.default)({}, _Picker.pickerPropTypes, {\n  calendarDefaultDate: _propTypes.default.instanceOf(Date),\n  defaultValue: _propTypes.default.instanceOf(Date),\n  disabledDate: _propTypes.default.func,\n  disabledHours: _propTypes.default.func,\n  disabledMinutes: _propTypes.default.func,\n  disabledSeconds: _propTypes.default.func,\n  format: _propTypes.default.string,\n  hideHours: _propTypes.default.func,\n  hideMinutes: _propTypes.default.func,\n  hideSeconds: _propTypes.default.func,\n  isoWeek: _propTypes.default.bool,\n  limitEndYear: _propTypes.default.number,\n  onChange: _propTypes.default.func,\n  onChangeCalendarDate: _propTypes.default.func,\n  onNextMonth: _propTypes.default.func,\n  onOk: _propTypes.default.func,\n  onPrevMonth: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  onToggleMonthDropdown: _propTypes.default.func,\n  onToggleTimeDropdown: _propTypes.default.func,\n  oneTap: _propTypes.default.bool,\n  panelContainerRef: _propTypes.default.any,\n  ranges: _propTypes.default.array,\n  showMeridian: _propTypes.default.bool,\n  showWeekNumbers: _propTypes.default.bool,\n  value: _propTypes.default.instanceOf(Date)\n});\nvar _default = DatePicker;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/DatePicker/DatePicker.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\n\nvar _mapValues = _interopRequireDefault(__webpack_require__(/*! lodash/mapValues */ \"./node_modules/lodash/mapValues.js\"));\n\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\n\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\n\nvar _Calendar = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/Calendar */ \"./node_modules/@rsuite/icons/legacy/Calendar.js\"));\n\nvar _ClockO = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/ClockO */ \"./node_modules/@rsuite/icons/legacy/ClockO.js\"));\n\nvar _Calendar2 = __webpack_require__(/*! ../Calendar */ \"./src/Calendar/index.tsx\");\n\nvar _useCalendarDate2 = _interopRequireDefault(__webpack_require__(/*! ../Calendar/useCalendarDate */ \"./src/Calendar/useCalendarDate.ts\"));\n\nvar _Toolbar = _interopRequireDefault(__webpack_require__(/*! ./Toolbar */ \"./src/DatePicker/Toolbar.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Picker = __webpack_require__(/*! ../Picker */ \"./src/Picker/index.ts\");\n\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/DatePicker/utils.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DatePicker/DatePicker.tsx\",\n    _this = void 0;\n\nvar DatePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n      calendarDefaultDate = props.calendarDefaultDate,\n      _props$cleanable = props.cleanable,\n      cleanable = _props$cleanable === void 0 ? true : _props$cleanable,\n      defaultValue = props.defaultValue,\n      disabled = props.disabled,\n      _props$format = props.format,\n      formatStr = _props$format === void 0 ? 'yyyy-MM-dd' : _props$format,\n      isoWeek = props.isoWeek,\n      _props$limitEndYear = props.limitEndYear,\n      limitEndYear = _props$limitEndYear === void 0 ? 1000 : _props$limitEndYear,\n      overrideLocale = props.locale,\n      menuClassName = props.menuClassName,\n      _props$appearance = props.appearance,\n      appearance = _props$appearance === void 0 ? 'default' : _props$appearance,\n      _props$placement = props.placement,\n      placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n      oneTap = props.oneTap,\n      _props$placeholder = props.placeholder,\n      placeholder = _props$placeholder === void 0 ? '' : _props$placeholder,\n      ranges = props.ranges,\n      valueProp = props.value,\n      showMeridian = props.showMeridian,\n      showWeekNumbers = props.showWeekNumbers,\n      style = props.style,\n      toggleAs = props.toggleAs,\n      disabledDateProp = props.disabledDate,\n      renderValue = props.renderValue,\n      onChange = props.onChange,\n      onChangeCalendarDate = props.onChangeCalendarDate,\n      onClean = props.onClean,\n      onClose = props.onClose,\n      onEntered = props.onEntered,\n      onExited = props.onExited,\n      onNextMonth = props.onNextMonth,\n      onOk = props.onOk,\n      onOpen = props.onOpen,\n      onPrevMonth = props.onPrevMonth,\n      onSelect = props.onSelect,\n      onToggleMonthDropdown = props.onToggleMonthDropdown,\n      onToggleTimeDropdown = props.onToggleTimeDropdown,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\", \"calendarDefaultDate\", \"cleanable\", \"defaultValue\", \"disabled\", \"format\", \"isoWeek\", \"limitEndYear\", \"locale\", \"menuClassName\", \"appearance\", \"placement\", \"oneTap\", \"placeholder\", \"ranges\", \"value\", \"showMeridian\", \"showWeekNumbers\", \"style\", \"toggleAs\", \"disabledDate\", \"renderValue\", \"onChange\", \"onChangeCalendarDate\", \"onClean\", \"onClose\", \"onEntered\", \"onExited\", \"onNextMonth\", \"onOk\", \"onOpen\", \"onPrevMonth\", \"onSelect\", \"onToggleMonthDropdown\", \"onToggleTimeDropdown\"]);\n\n  var _useCustom = (0, _utils.useCustom)('DatePicker', overrideLocale),\n      locale = _useCustom.locale,\n      formatDate = _useCustom.formatDate,\n      parseDate = _useCustom.parseDate;\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      prefix = _useClassNames.prefix;\n\n  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue),\n      value = _useControlled[0],\n      setValue = _useControlled[1];\n\n  var _useCalendarDate = (0, _useCalendarDate2.default)(valueProp, calendarDefaultDate),\n      calendarDate = _useCalendarDate.calendarDate,\n      setCalendarDate = _useCalendarDate.setCalendarDate;\n\n  var _useState = (0, _react.useState)(),\n      inputState = _useState[0],\n      setInputState = _useState[1];\n\n  var _useCalendarState = (0, _utils2.useCalendarState)(),\n      calendarState = _useCalendarState.calendarState,\n      reset = _useCalendarState.reset,\n      openMonth = _useCalendarState.openMonth,\n      openTime = _useCalendarState.openTime;\n\n  var _useState2 = (0, _react.useState)(false),\n      active = _useState2[0],\n      setActive = _useState2[1];\n\n  var triggerRef = (0, _react.useRef)(null);\n  var rootRef = (0, _react.useRef)(null);\n  var targetRef = (0, _react.useRef)(null);\n  var overlayRef = (0, _react.useRef)(null);\n  (0, _Picker.usePublicMethods)(ref, {\n    rootRef: rootRef,\n    triggerRef: triggerRef,\n    overlayRef: overlayRef,\n    targetRef: targetRef\n  });\n  /**\n   * Switch to the callback triggered after the next month.\n   */\n\n  var handleMoveForward = (0, _react.useCallback)(function (nextPageDate) {\n    setCalendarDate(nextPageDate);\n    onNextMonth === null || onNextMonth === void 0 ? void 0 : onNextMonth(nextPageDate);\n    onChangeCalendarDate === null || onChangeCalendarDate === void 0 ? void 0 : onChangeCalendarDate(nextPageDate);\n  }, [onChangeCalendarDate, onNextMonth, setCalendarDate]);\n  /**\n   * Switch to the callback triggered after the previous month.\n   */\n\n  var handleMoveBackward = (0, _react.useCallback)(function (nextPageDate) {\n    setCalendarDate(nextPageDate);\n    onPrevMonth === null || onPrevMonth === void 0 ? void 0 : onPrevMonth(nextPageDate);\n    onChangeCalendarDate === null || onChangeCalendarDate === void 0 ? void 0 : onChangeCalendarDate(nextPageDate);\n  }, [onChangeCalendarDate, onPrevMonth, setCalendarDate]);\n  /**\n   * The callback triggered when the date changes.\n   */\n\n  var handleDateChange = (0, _react.useCallback)(function (nextValue, event) {\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(nextValue, event);\n    onChangeCalendarDate === null || onChangeCalendarDate === void 0 ? void 0 : onChangeCalendarDate(nextValue, event);\n  }, [onChangeCalendarDate, onSelect]);\n  /**\n   *  A callback triggered when the date on the calendar changes.\n   */\n\n  var handleChangePageDate = (0, _react.useCallback)(function (nextPageDate) {\n    setCalendarDate(nextPageDate);\n    reset();\n    handleDateChange(nextPageDate);\n  }, [handleDateChange, reset, setCalendarDate]);\n  /**\n   *  A callback triggered when the time on the calendar changes.\n   */\n\n  var handleChangePageTime = (0, _react.useCallback)(function (nextPageTime) {\n    setCalendarDate(nextPageTime);\n    handleDateChange(nextPageTime);\n  }, [handleDateChange, setCalendarDate]);\n  var handleClose = (0, _react.useCallback)(function () {\n    var _triggerRef$current, _triggerRef$current$c;\n\n    (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : (_triggerRef$current$c = _triggerRef$current.close) === null || _triggerRef$current$c === void 0 ? void 0 : _triggerRef$current$c.call(_triggerRef$current);\n  }, []);\n  /**\n   * The callback triggered when PM/AM is switched.\n   */\n\n  var handleToggleMeridian = (0, _react.useCallback)(function () {\n    var hours = _utils.DateUtils.getHours(calendarDate);\n\n    var nextHours = hours >= 12 ? hours - 12 : hours + 12;\n\n    var nextDate = _utils.DateUtils.setHours(calendarDate, nextHours);\n\n    setCalendarDate(nextDate);\n  }, [calendarDate, setCalendarDate]);\n  var updateValue = (0, _react.useCallback)(function (event, nextPageDate, closeOverlay) {\n    if (closeOverlay === void 0) {\n      closeOverlay = true;\n    }\n\n    var nextValue = !(0, _isNil.default)(nextPageDate) ? nextPageDate : calendarDate;\n    setCalendarDate(nextValue || new Date());\n    setValue(nextValue);\n\n    if (nextValue !== value || !_utils.DateUtils.isSameDay(nextValue, value)) {\n      onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n    } // `closeOverlay` default value is `true`\n\n\n    if (closeOverlay !== false) {\n      handleClose();\n    }\n  }, [handleClose, onChange, calendarDate, setCalendarDate, setValue, value]);\n  /**\n   * The callback triggered after the date in the shortcut area is clicked.\n   */\n\n  var handleShortcutPageDate = (0, _react.useCallback)(function (value, closeOverlay, event) {\n    updateValue(event, value, closeOverlay);\n    handleDateChange(value, event);\n  }, [handleDateChange, updateValue]);\n  /**\n   * The callback triggered after clicking the OK button.\n   */\n\n  var handleOK = (0, _react.useCallback)(function (event) {\n    updateValue(event);\n    onOk === null || onOk === void 0 ? void 0 : onOk(calendarDate, event);\n  }, [updateValue, onOk, calendarDate]);\n  /**\n   * Toggle month selection panel\n   */\n\n  var handleMonthDropdown = (0, _react.useCallback)(function () {\n    if (calendarState === _Calendar2.CalendarState.DROP_MONTH) {\n      reset();\n    } else {\n      openMonth();\n    }\n\n    onToggleMonthDropdown === null || onToggleMonthDropdown === void 0 ? void 0 : onToggleMonthDropdown(calendarState !== _Calendar2.CalendarState.DROP_MONTH);\n  }, [calendarState, onToggleMonthDropdown, openMonth, reset]);\n  /**\n   * Switch time selection panel\n   */\n\n  var handleTimeDropdown = (0, _react.useCallback)(function () {\n    if (calendarState === _Calendar2.CalendarState.DROP_TIME) {\n      reset();\n    } else {\n      openTime();\n    }\n\n    onToggleTimeDropdown === null || onToggleTimeDropdown === void 0 ? void 0 : onToggleTimeDropdown(calendarState !== _Calendar2.CalendarState.DROP_TIME);\n  }, [calendarState, onToggleTimeDropdown, openTime, reset]);\n  /**\n   * Callback after clicking the clear button.\n   */\n\n  var handleClean = (0, _react.useCallback)(function (event) {\n    setCalendarDate(new Date());\n    updateValue(event, null);\n  }, [setCalendarDate, updateValue]);\n  /**\n   * Handle keyboard events.\n   */\n\n  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    triggerRef: triggerRef,\n    targetRef: targetRef,\n    active: active,\n    onExit: handleClean\n  }, rest));\n  /**\n   * Callback after the date is selected.\n   */\n\n  var handleSelect = (0, _react.useCallback)(function (nextValue, event, updatableValue) {\n    if (updatableValue === void 0) {\n      updatableValue = true;\n    }\n\n    setCalendarDate( // Determine whether the current value contains time, if not, use calendarDate.\n    _utils.DateUtils.shouldTime(formatStr) ? nextValue : (0, _utils.composeFunctions)(function (d) {\n      return _utils.DateUtils.setHours(d, _utils.DateUtils.getHours(calendarDate));\n    }, function (d) {\n      return _utils.DateUtils.setMinutes(d, _utils.DateUtils.getMinutes(calendarDate));\n    }, function (d) {\n      return _utils.DateUtils.setSeconds(d, _utils.DateUtils.getSeconds(calendarDate));\n    })(nextValue));\n    handleDateChange(nextValue);\n\n    if (oneTap && updatableValue) {\n      updateValue(event, nextValue);\n    }\n  }, [formatStr, handleDateChange, oneTap, calendarDate, setCalendarDate, updateValue]);\n  var disabledDate = (0, _react.useCallback)(function (date) {\n    var _disabledDateProp;\n\n    return (_disabledDateProp = disabledDateProp === null || disabledDateProp === void 0 ? void 0 : disabledDateProp(date)) !== null && _disabledDateProp !== void 0 ? _disabledDateProp : false;\n  }, [disabledDateProp]);\n  /**\n   * Callback after the input box value is changed.\n   */\n\n  var handleInputChange = (0, _react.useCallback)(function (value, event) {\n    setInputState('Typing'); // isMatch('01/11/2020', 'MM/dd/yyyy') ==> true\n    // isMatch('2020-11-01', 'MM/dd/yyyy') ==> false\n\n    if (!_utils.DateUtils.isMatch(value, formatStr, {\n      locale: locale.dateLocale\n    })) {\n      setInputState('Error');\n      return;\n    }\n\n    var date = parseDate(value, formatStr); // If only the time is included in the characters, it will default to today.\n\n    if (_utils.DateUtils.shouldOnlyTime(formatStr)) {\n      date = new Date(_utils.DateUtils.format(new Date(), 'yyyy-MM-dd') + \" \" + value);\n    }\n\n    if (!_utils.DateUtils.isValid(date)) {\n      setInputState('Error');\n      return;\n    }\n\n    if (disabledDate(date)) {\n      setInputState('Error');\n      return;\n    }\n\n    handleSelect(date, event, false);\n  }, [formatStr, locale, parseDate, disabledDate, handleSelect]);\n  /**\n   * The callback after the enter key is triggered on the input\n   */\n\n  var handleInputPressEnd = (0, _react.useCallback)(function (event) {\n    if (inputState === 'Typing') {\n      updateValue(event, calendarDate);\n    }\n\n    setInputState('Initial');\n  }, [inputState, calendarDate, updateValue]);\n  var handleEntered = (0, _react.useCallback)(function () {\n    onOpen === null || onOpen === void 0 ? void 0 : onOpen();\n    setActive(true);\n  }, [onOpen]);\n  var handleExited = (0, _react.useCallback)(function () {\n    onClose === null || onClose === void 0 ? void 0 : onClose();\n    reset();\n    setActive(false);\n  }, [onClose, reset]); // Check whether the time is within the time range of the shortcut option in the toolbar.\n\n  var disabledToolbarHandle = (0, _react.useCallback)(function (date) {\n    var _disabledDateProp2;\n\n    var allowDate = (_disabledDateProp2 = disabledDateProp === null || disabledDateProp === void 0 ? void 0 : disabledDateProp(date)) !== null && _disabledDateProp2 !== void 0 ? _disabledDateProp2 : false;\n\n    var allowTime = _utils.DateUtils.disabledTime(props, date);\n\n    return allowDate || allowTime;\n  }, [disabledDateProp, props]);\n  var calendarProps = (0, _react.useMemo)(function () {\n    return (0, _mapValues.default)((0, _pick.default)(props, _utils.DateUtils.calendarOnlyProps), function (disabledOrHiddenTimeFunc) {\n      return function (next, date) {\n        var _disabledOrHiddenTime;\n\n        return (_disabledOrHiddenTime = disabledOrHiddenTimeFunc === null || disabledOrHiddenTimeFunc === void 0 ? void 0 : disabledOrHiddenTimeFunc(next, date)) !== null && _disabledOrHiddenTime !== void 0 ? _disabledOrHiddenTime : false;\n      };\n    });\n  }, [props]);\n  var inSameMonth = (0, _react.useCallback)(function (date) {\n    return _utils.DateUtils.isSameMonth(date, calendarDate);\n  }, [calendarDate]);\n\n  var calendar = /*#__PURE__*/_react.default.createElement(_Calendar2.Calendar, (0, _extends2.default)({}, calendarProps, {\n    locale: locale,\n    showWeekNumbers: showWeekNumbers,\n    showMeridian: showMeridian,\n    disabledDate: disabledDate,\n    limitEndYear: limitEndYear,\n    format: formatStr,\n    isoWeek: isoWeek,\n    inSameMonth: inSameMonth,\n    calendarState: calendarState,\n    calendarDate: calendarDate,\n    onMoveForward: handleMoveForward,\n    onMoveBackward: handleMoveBackward,\n    onSelect: handleSelect,\n    onToggleMonthDropdown: handleMonthDropdown,\n    onToggleTimeDropdown: handleTimeDropdown,\n    onChangePageDate: handleChangePageDate,\n    onChangePageTime: handleChangePageTime,\n    onToggleMeridian: handleToggleMeridian,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 474,\n      columnNumber: 7\n    }\n  }));\n\n  var renderDropdownMenu = function renderDropdownMenu(positionProps, speakerRef) {\n    var left = positionProps.left,\n        top = positionProps.top,\n        className = positionProps.className;\n    var classes = merge(menuClassName, className, prefix('date-menu'));\n    var styles = {\n      left: left,\n      top: top\n    };\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerOverlay, {\n      role: \"dialog\",\n      className: classes,\n      ref: (0, _utils.mergeRefs)(overlayRef, speakerRef),\n      style: styles,\n      target: triggerRef,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 502,\n        columnNumber: 9\n      }\n    }, calendar, /*#__PURE__*/_react.default.createElement(_Toolbar.default, {\n      locale: locale,\n      ranges: ranges,\n      calendarDate: calendarDate,\n      disabledOkBtn: disabledToolbarHandle,\n      disabledShortcut: disabledToolbarHandle,\n      onClickShortcut: handleShortcutPageDate,\n      onOk: handleOK,\n      hideOkBtn: oneTap,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 510,\n        columnNumber: 11\n      }\n    }));\n  };\n\n  var hasValue = !!value;\n\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n    classPrefix: classPrefix,\n    name: 'date',\n    appearance: appearance,\n    hasValue: hasValue,\n    cleanable: cleanable\n  })),\n      classes = _usePickerClassName[0],\n      usedClassNamePropKeys = _usePickerClassName[1];\n\n  var renderDate = (0, _react.useCallback)(function () {\n    var _renderValue;\n\n    if (!value) {\n      return placeholder || formatStr;\n    }\n\n    return (_renderValue = renderValue === null || renderValue === void 0 ? void 0 : renderValue(value, formatStr)) !== null && _renderValue !== void 0 ? _renderValue : formatDate(value, formatStr);\n  }, [formatStr, formatDate, placeholder, renderValue, value]);\n  var caretAs = (0, _react.useMemo)(function () {\n    return _utils.DateUtils.shouldOnlyTime(formatStr) ? _ClockO.default : _Calendar.default;\n  }, [formatStr]);\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    trigger: \"active\",\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: triggerRef,\n    placement: placement,\n    onEntered: (0, _utils.createChainedFunction)(handleEntered, onEntered),\n    onExited: (0, _utils.createChainedFunction)(handleExited, onExited),\n    speaker: renderDropdownMenu,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 549,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: merge(className, classes),\n    style: style,\n    ref: rootRef,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 558,\n      columnNumber: 9\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys, _utils.DateUtils.calendarOnlyProps)), {\n    className: prefix({\n      error: inputState === 'Error'\n    }),\n    as: toggleAs,\n    ref: targetRef,\n    appearance: appearance,\n    input: true,\n    inputValue: value ? formatDate(value, formatStr) : '',\n    inputPlaceholder: typeof placeholder === 'string' && placeholder ? placeholder : formatStr,\n    inputMask: _utils.DateUtils.getDateMask(formatStr),\n    onInputChange: handleInputChange,\n    onInputBlur: handleInputPressEnd,\n    onInputPressEnter: handleInputPressEnd,\n    onKeyDown: onPickerKeyDown,\n    onClean: (0, _utils.createChainedFunction)(handleClean, onClean),\n    cleanable: cleanable && !disabled,\n    hasValue: hasValue,\n    active: active,\n    placement: placement,\n    disabled: disabled,\n    caretAs: caretAs,\n    \"aria-haspopup\": \"dialog\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 559,\n      columnNumber: 11\n    }\n  }), renderDate())));\n});\n\nDatePicker.displayName = 'DatePicker';\nDatePicker.propTypes = (0, _extends2.default)({}, _Picker.pickerPropTypes, {\n  calendarDefaultDate: _propTypes.default.instanceOf(Date),\n  defaultValue: _propTypes.default.instanceOf(Date),\n  disabledDate: _propTypes.default.func,\n  disabledHours: _propTypes.default.func,\n  disabledMinutes: _propTypes.default.func,\n  disabledSeconds: _propTypes.default.func,\n  format: _propTypes.default.string,\n  hideHours: _propTypes.default.func,\n  hideMinutes: _propTypes.default.func,\n  hideSeconds: _propTypes.default.func,\n  isoWeek: _propTypes.default.bool,\n  limitEndYear: _propTypes.default.number,\n  onChange: _propTypes.default.func,\n  onChangeCalendarDate: _propTypes.default.func,\n  onNextMonth: _propTypes.default.func,\n  onOk: _propTypes.default.func,\n  onPrevMonth: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  onToggleMonthDropdown: _propTypes.default.func,\n  onToggleTimeDropdown: _propTypes.default.func,\n  oneTap: _propTypes.default.bool,\n  panelContainerRef: _propTypes.default.any,\n  ranges: _propTypes.default.array,\n  showMeridian: _propTypes.default.bool,\n  showWeekNumbers: _propTypes.default.bool,\n  value: _propTypes.default.instanceOf(Date)\n});\nvar _default = DatePicker;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/DatePicker/DatePicker.tsx?");
 
 /***/ }),
 
@@ -2353,7 +2353,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _Calendar = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/Calendar */ \"./node_modules/@rsuite/icons/legacy/Calendar.js\"));\n\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\n\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\n\nvar _partial = _interopRequireDefault(__webpack_require__(/*! lodash/partial */ \"./node_modules/lodash/partial.js\"));\n\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _CustomProvider = __webpack_require__(/*! ../CustomProvider */ \"./src/CustomProvider/index.tsx\");\n\nvar _Toolbar = _interopRequireDefault(__webpack_require__(/*! ../DatePicker/Toolbar */ \"./src/DatePicker/Toolbar.tsx\"));\n\nvar _Picker = __webpack_require__(/*! ../Picker */ \"./src/Picker/index.ts\");\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _dateUtils = __webpack_require__(/*! ../utils/dateUtils */ \"./src/utils/dateUtils.ts\");\n\nvar _Calendar2 = _interopRequireDefault(__webpack_require__(/*! ./Calendar */ \"./src/DateRangePicker/Calendar.tsx\"));\n\nvar disabledDateUtils = _interopRequireWildcard(__webpack_require__(/*! ./disabledDateUtils */ \"./src/DateRangePicker/disabledDateUtils.ts\"));\n\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/DateRangePicker/utils.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DateRangePicker/DateRangePicker.tsx\",\n    _this = void 0;\n\nvar DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _ref, _ref2, _merge;\n\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n      className = props.className,\n      _props$appearance = props.appearance,\n      appearance = _props$appearance === void 0 ? 'default' : _props$appearance,\n      _props$cleanable = props.cleanable,\n      cleanable = _props$cleanable === void 0 ? true : _props$cleanable,\n      _props$character = props.character,\n      character = _props$character === void 0 ? ' ~ ' : _props$character,\n      defaultCalendarValue = props.defaultCalendarValue,\n      defaultValue = props.defaultValue,\n      disabled = props.disabled,\n      disabledDateProp = props.disabledDate,\n      _props$format = props.format,\n      formatStr = _props$format === void 0 ? 'yyyy-MM-dd' : _props$format,\n      hoverRange = props.hoverRange,\n      _props$isoWeek = props.isoWeek,\n      isoWeek = _props$isoWeek === void 0 ? false : _props$isoWeek,\n      _props$limitEndYear = props.limitEndYear,\n      limitEndYear = _props$limitEndYear === void 0 ? 1000 : _props$limitEndYear,\n      overrideLocale = props.locale,\n      menuClassName = props.menuClassName,\n      menuStyle = props.menuStyle,\n      oneTap = props.oneTap,\n      _props$placeholder = props.placeholder,\n      placeholder = _props$placeholder === void 0 ? '' : _props$placeholder,\n      _props$placement = props.placement,\n      placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n      ranges = props.ranges,\n      renderValue = props.renderValue,\n      _props$showOneCalenda = props.showOneCalendar,\n      showOneCalendar = _props$showOneCalenda === void 0 ? false : _props$showOneCalenda,\n      showWeekNumbers = props.showWeekNumbers,\n      showMeridian = props.showMeridian,\n      style = props.style,\n      toggleAs = props.toggleAs,\n      valueProp = props.value,\n      onChange = props.onChange,\n      onClean = props.onClean,\n      onClose = props.onClose,\n      onEnter = props.onEnter,\n      onEntered = props.onEntered,\n      onExited = props.onExited,\n      onOk = props.onOk,\n      onOpen = props.onOpen,\n      onSelect = props.onSelect,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"className\", \"appearance\", \"cleanable\", \"character\", \"defaultCalendarValue\", \"defaultValue\", \"disabled\", \"disabledDate\", \"format\", \"hoverRange\", \"isoWeek\", \"limitEndYear\", \"locale\", \"menuClassName\", \"menuStyle\", \"oneTap\", \"placeholder\", \"placement\", \"ranges\", \"renderValue\", \"showOneCalendar\", \"showWeekNumbers\", \"showMeridian\", \"style\", \"toggleAs\", \"value\", \"onChange\", \"onClean\", \"onClose\", \"onEnter\", \"onEntered\", \"onExited\", \"onOk\", \"onOpen\", \"onSelect\"]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      prefix = _useClassNames.prefix;\n\n  var _useCustom = (0, _utils.useCustom)('DateRangePicker', overrideLocale),\n      locale = _useCustom.locale,\n      formatDate = _useCustom.formatDate,\n      parseDate = _useCustom.parseDate;\n\n  var rangeFormatStr = \"\" + formatStr + character + formatStr;\n\n  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue !== null && defaultValue !== void 0 ? defaultValue : null),\n      value = _useControlled[0],\n      setValue = _useControlled[1];\n  /**\n   * Whether to complete the selection.\n   * Everytime selection will change this value. If the value is false, it means that the selection has not been completed.\n   *\n   * In `oneTap` mode, select action will not change this value, its value should be true always.\n   */\n\n\n  var hasDoneSelect = (0, _react.useRef)(true);\n  /**\n   * The currently selected date range.\n   *\n   * The time range is selected by two clicks. After the first click,\n   * the cursor will store a temporary event date in the process until\n   * the second click to determine the end date of the date range.\n   *\n   */\n\n  var _useState = (0, _react.useState)((_ref = valueProp !== null && valueProp !== void 0 ? valueProp : defaultValue) !== null && _ref !== void 0 ? _ref : []),\n      selectedDates = _useState[0],\n      setSelectedDates = _useState[1]; // The date of the current hover, used to reduce the calculation of `handleMouseMove`\n\n\n  var _useState2 = (0, _react.useState)(null),\n      hoverDateRange = _useState2[0],\n      setHoverDateRange = _useState2[1]; // The displayed calendar panel is rendered based on this value.\n\n\n  var _useState3 = (0, _react.useState)((0, _utils2.getCalendarDate)({\n    value: (_ref2 = valueProp !== null && valueProp !== void 0 ? valueProp : defaultCalendarValue) !== null && _ref2 !== void 0 ? _ref2 : null\n  })),\n      calendarDate = _useState3[0],\n      setCalendarDate = _useState3[1];\n\n  var _useState4 = (0, _react.useState)(),\n      inputState = _useState4[0],\n      setInputState = _useState4[1];\n  /**\n   * When hoverRange is set, `selectValue` will be updated during the hover process,\n   * which will cause the `selectValue` to be updated after the first click,\n   * so declare a Ref to temporarily store the `selectValue` of the first click.\n   */\n\n\n  var selectRangeValueRef = (0, _react.useRef)(null);\n  /**\n   * Call this function to update the calendar panel rendering benchmark value.\n   * If params `value` is not passed, it defaults to [new Date(), addMonth(new Date(), 1)].\n   */\n\n  var updateCalendarDate = (0, _react.useCallback)(function (value) {\n    setCalendarDate((0, _utils2.getCalendarDate)({\n      value: value\n    }));\n  }, []); // if valueProp changed then update selectValue/hoverValue\n\n  (0, _react.useEffect)(function () {\n    setSelectedDates(valueProp !== null && valueProp !== void 0 ? valueProp : []);\n    setHoverDateRange(valueProp !== null && valueProp !== void 0 ? valueProp : null);\n  }, [valueProp]);\n\n  var _useState5 = (0, _react.useState)(false),\n      isPickerToggleActive = _useState5[0],\n      setPickerToggleActive = _useState5[1];\n\n  var rootRef = (0, _react.useRef)(null);\n  var overlayRef = (0, _react.useRef)(null);\n  var targetRef = (0, _react.useRef)(null);\n  var triggerRef = (0, _react.useRef)(null);\n  var handleCloseDropdown = (0, _react.useCallback)(function () {\n    var _triggerRef$current, _triggerRef$current$c;\n\n    (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : (_triggerRef$current$c = _triggerRef$current.close) === null || _triggerRef$current$c === void 0 ? void 0 : _triggerRef$current$c.call(_triggerRef$current);\n  }, []);\n  (0, _Picker.usePublicMethods)(ref, {\n    triggerRef: triggerRef,\n    overlayRef: overlayRef,\n    targetRef: targetRef,\n    rootRef: rootRef\n  });\n  var getDisplayString = (0, _react.useCallback)(function (nextValue, isPlaintext) {\n    var _nextValue$, _nextValue$2;\n\n    var startDate = (_nextValue$ = nextValue === null || nextValue === void 0 ? void 0 : nextValue[0]) !== null && _nextValue$ !== void 0 ? _nextValue$ : null;\n    var endDate = (_nextValue$2 = nextValue === null || nextValue === void 0 ? void 0 : nextValue[1]) !== null && _nextValue$2 !== void 0 ? _nextValue$2 : null;\n\n    if (startDate && endDate) {\n      var displayValue = [startDate, endDate].sort(_dateUtils.compareAsc);\n\n      if (isPlaintext) {\n        return formatDate(displayValue[0], formatStr) + character + formatDate(displayValue[1], formatStr);\n      }\n\n      return renderValue ? renderValue(displayValue, formatStr) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_CustomProvider.FormattedDate, {\n        date: displayValue[0],\n        formatStr: formatStr,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 268,\n          columnNumber: 13\n        }\n      }), character, /*#__PURE__*/_react.default.createElement(_CustomProvider.FormattedDate, {\n        date: displayValue[1],\n        formatStr: formatStr,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 270,\n          columnNumber: 13\n        }\n      }));\n    }\n\n    return isPlaintext ? '' : placeholder || rangeFormatStr;\n  }, [character, formatDate, formatStr, placeholder, rangeFormatStr, renderValue, value]);\n  /**\n   * preset hover range\n   */\n\n  var getHoverRangeValue = (0, _react.useCallback)(function (date) {\n    function getHoverRangeFunc() {\n      if (hoverRange === 'week') {\n        return (0, _partial.default)(_utils2.getWeekHoverRange, isoWeek);\n      } else if (hoverRange === 'month') {\n        return _utils2.getMonthHoverRange;\n      }\n\n      return hoverRange;\n    }\n\n    var hoverRangeFunc = getHoverRangeFunc();\n\n    if ((0, _isNil.default)(hoverRangeFunc)) {\n      return null;\n    }\n\n    var hoverValues = hoverRangeFunc(date);\n    var isHoverRangeValid = hoverValues instanceof Array && hoverValues.length === 2;\n\n    if (!isHoverRangeValid) {\n      return null;\n    }\n\n    if (_utils.DateUtils.isAfter(hoverValues[0], hoverValues[1])) {\n      hoverValues.reverse();\n    }\n\n    return hoverValues;\n  }, [hoverRange, isoWeek]);\n  var handleValueUpdate = (0, _react.useCallback)(function (event, nextValue, closeOverlay) {\n    if (closeOverlay === void 0) {\n      closeOverlay = true;\n    }\n\n    // If nextValue is null, it means that the user is erasing the selected dates.\n    setSelectedDates(nextValue !== null && nextValue !== void 0 ? nextValue : []);\n\n    if (!(0, _utils2.isSameRange)(nextValue, value, formatStr)) {\n      setValue(nextValue);\n      onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n    } // `closeOverlay` default value is `true`\n\n\n    if (closeOverlay !== false) {\n      handleCloseDropdown();\n    }\n  }, [formatStr, handleCloseDropdown, onChange, selectedDates, setValue, value]);\n  /**\n   * Select the date range. If oneTap is not set, you need to click twice to select the start time and end time.\n   * The MouseMove event is called between the first click and the second click to update the selection state.\n   */\n\n  var handleMouseMove = (0, _react.useCallback)(function (date) {\n    var nextHoverDateRange = getHoverRangeValue(date); // If hasDoneSelect is false,\n    // it means there's already one selected date\n    // and waiting for user to select the second date to complete the selection.\n\n    if (!hasDoneSelect.current) {\n      // If `hoverRange` is set, you need to change the value of hoverDateRange according to the rules\n      if (!(0, _isNil.default)(nextHoverDateRange)) {\n        var nextSelectedDates = [selectRangeValueRef.current[0], nextHoverDateRange[1]];\n\n        if (_utils.DateUtils.isBefore(nextHoverDateRange[0], selectRangeValueRef.current[0])) {\n          nextSelectedDates = [nextHoverDateRange[0], selectRangeValueRef.current[1]];\n        }\n\n        setSelectedDates(nextSelectedDates);\n      } else {\n        setHoverDateRange(function (prevHoverValue) {\n          return (0, _isNil.default)(prevHoverValue) ? null : [prevHoverValue[0], date];\n        });\n      } // Before the first click, if nextHoverDateRange has a value, hoverDateRange needs to be updated\n\n    } else if (!(0, _isNil.default)(nextHoverDateRange)) {\n      setHoverDateRange(nextHoverDateRange);\n    }\n  }, [getHoverRangeValue, hoverRange]);\n  var handleSelectDate = (0, _react.useCallback)(function (date, event) {\n    var nextSelectDates = hoverDateRange !== null && hoverDateRange !== void 0 ? hoverDateRange : [];\n    var hoverRangeValue = getHoverRangeValue(date);\n    var noHoverRangeValid = (0, _isNil.default)(hoverRangeValue); // in `oneTap` mode\n\n    if (hasDoneSelect.current && oneTap) {\n      handleValueUpdate(event, noHoverRangeValid ? [(0, _utils2.setTimingMargin)(date), (0, _utils2.setTimingMargin)(date, 'right')] : hoverRangeValue);\n      hasDoneSelect.current = false;\n      return;\n    } // no preset hover range can use\n\n\n    if (noHoverRangeValid) {\n      // start select\n      if (hasDoneSelect.current) {\n        nextSelectDates = [date];\n      } else {\n        // finish select\n        nextSelectDates[1] = date;\n      }\n    } else {\n      if (!hasDoneSelect.current) {\n        nextSelectDates = selectedDates;\n        selectRangeValueRef.current = null;\n      } else {\n        nextSelectDates = hoverRangeValue;\n        selectRangeValueRef.current = hoverRangeValue;\n      }\n    } // If user have completed the selection, then sort\n\n\n    if (nextSelectDates.length === 2 && _utils.DateUtils.isAfter(nextSelectDates[0], nextSelectDates[1])) {\n      nextSelectDates.reverse();\n    }\n\n    setHoverDateRange(nextSelectDates.length === 2 ? nextSelectDates : null);\n    setSelectedDates(nextSelectDates);\n    updateCalendarDate(nextSelectDates);\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(date, event);\n    hasDoneSelect.current = !hasDoneSelect.current;\n  }, [getHoverRangeValue, handleValueUpdate, hoverDateRange, onSelect, oneTap, selectedDates, updateCalendarDate]);\n  /**\n   * If `selectValue` changed, there will be the following effects.\n   * 1. Check if the selection is completed.\n   * 2. if the selection is completed, set the temporary `hoverValue` empty.\n   */\n\n  (0, _react.useEffect)(function () {\n    var selectValueLength = selectedDates.length;\n    var doneSelected = selectValueLength === 0 || selectValueLength === 2;\n    doneSelected && setHoverDateRange(null);\n  }, [selectedDates]);\n  var handleChangeCalendarDate = (0, _react.useCallback)(function (index, date) {\n    var nextCalendarDate = Array.from(calendarDate);\n    nextCalendarDate[index] = date;\n    updateCalendarDate(nextCalendarDate);\n  }, [calendarDate, updateCalendarDate]);\n  var handleChangeCalendarTime = (0, _react.useCallback)(function (index, date) {\n    setSelectedDates(function (prev) {\n      var next = [].concat(prev);\n      var clonedDate = new Date(date.valueOf()); // if next[index] is not empty, only update the time after aligning the year, month and day\n\n      if (next[index]) {\n        clonedDate.setFullYear(next[index].getFullYear(), next[index].getMonth(), next[index].getDate());\n      }\n\n      next[index] = clonedDate;\n      return next;\n    });\n    handleChangeCalendarDate(index, date);\n  }, [handleChangeCalendarDate]);\n  /**\n   * The callback triggered when PM/AM is switched.\n   */\n\n  var handleToggleMeridian = (0, _react.useCallback)(function (index) {\n    var next = Array.from(calendarDate);\n    var clonedDate = new Date(next[index].valueOf());\n\n    var hours = _utils.DateUtils.getHours(clonedDate);\n\n    var nextHours = hours >= 12 ? hours - 12 : hours + 12;\n    next[index] = _utils.DateUtils.setHours(clonedDate, nextHours);\n    setCalendarDate(next); // If the value already exists, update the value again.\n\n    if (selectedDates.length === 2) {\n      setSelectedDates(next);\n    }\n  }, [calendarDate, selectedDates]);\n  /**\n   * Toolbar operation callback function\n   */\n\n  var handleShortcutPageDate = (0, _react.useCallback)(function (value, closeOverlay, event) {\n    if (closeOverlay === void 0) {\n      closeOverlay = false;\n    }\n\n    handleValueUpdate(event, value, closeOverlay);\n  }, [handleValueUpdate]);\n  var handleOK = (0, _react.useCallback)(function (event) {\n    handleValueUpdate(event, selectedDates);\n    onOk === null || onOk === void 0 ? void 0 : onOk(selectedDates, event);\n  }, [handleValueUpdate, onOk, selectedDates]);\n  var handleClean = (0, _react.useCallback)(function (event) {\n    updateCalendarDate(null);\n    handleValueUpdate(event, null);\n  }, [handleValueUpdate, updateCalendarDate]);\n  /**\n   * Callback after the input box value is changed.\n   */\n\n  var handleInputChange = (0, _react.useCallback)(function (value) {\n    setInputState('Typing');\n    var rangeValue = value.split(character); // isMatch('01/11/2020', 'MM/dd/yyyy') ==> true\n    // isMatch('2020-11-01', 'MM/dd/yyyy') ==> false\n\n    if (!_utils.DateUtils.isMatch(rangeValue[0], formatStr, {\n      locale: locale.dateLocale\n    }) || !_utils.DateUtils.isMatch(rangeValue[1], formatStr, {\n      locale: locale.dateLocale\n    })) {\n      setInputState('Error');\n      return;\n    }\n\n    var startDate = parseDate(rangeValue[0], formatStr);\n    var endDate = parseDate(rangeValue[1], formatStr);\n    var selectValue = [startDate, endDate];\n\n    if (!_utils.DateUtils.isValid(startDate) || !_utils.DateUtils.isValid(endDate)) {\n      setInputState('Error');\n      return;\n    }\n\n    if (isDateDisabled(startDate, selectValue, true, _utils.DATERANGE_DISABLED_TARGET.CALENDAR)) {\n      setInputState('Error');\n      return;\n    }\n\n    setHoverDateRange(selectValue);\n    setSelectedDates(selectValue);\n    updateCalendarDate(selectValue);\n  }, // eslint-disable-next-line react-hooks/exhaustive-deps\n  [character, rangeFormatStr, updateCalendarDate]);\n  /**\n   * The callback after the enter key is triggered on the input\n   */\n\n  var handleInputPressEnd = (0, _react.useCallback)(function (event) {\n    if (inputState === 'Typing') {\n      handleValueUpdate(event, selectedDates.length === 2 ? selectedDates : null);\n    }\n\n    setInputState('Initial');\n  }, [handleValueUpdate, selectedDates, inputState]);\n  var handleEnter = (0, _react.useCallback)(function () {\n    var nextCalendarDate;\n\n    if (value && value.length) {\n      var _startDate = value[0],\n          endData = value[1];\n      nextCalendarDate = [_startDate, (0, _dateUtils.isSameMonth)(_startDate, endData) ? (0, _dateUtils.addMonths)(endData, 1) : endData];\n    } else {\n      nextCalendarDate = (0, _utils2.getCalendarDate)({\n        value: defaultCalendarValue !== null && defaultCalendarValue !== void 0 ? defaultCalendarValue : null\n      });\n    }\n\n    setSelectedDates(value !== null && value !== void 0 ? value : []);\n    updateCalendarDate(nextCalendarDate);\n  }, [defaultCalendarValue, updateCalendarDate, setSelectedDates, value]);\n  var handleEntered = (0, _react.useCallback)(function () {\n    onOpen === null || onOpen === void 0 ? void 0 : onOpen();\n    setPickerToggleActive(true);\n  }, [onOpen]);\n  var handleExited = (0, _react.useCallback)(function () {\n    setPickerToggleActive(false);\n    hasDoneSelect.current = true;\n    onClose === null || onClose === void 0 ? void 0 : onClose();\n  }, [onClose]);\n  var isDateDisabled = (0, _react.useCallback)(function (date, selectDate, selectedDone, target) {\n    var _disabledDateProp;\n\n    return (_disabledDateProp = disabledDateProp === null || disabledDateProp === void 0 ? void 0 : disabledDateProp(date, selectDate, selectedDone, target)) !== null && _disabledDateProp !== void 0 ? _disabledDateProp : false;\n  }, [disabledDateProp]);\n  var disabledByBetween = (0, _react.useCallback)(function (start, end, type) {\n    // If the date is between the start and the end\n    // the button is disabled\n    while (_utils.DateUtils.isBefore(start, end) || _utils.DateUtils.isSameDay(start, end)) {\n      if (isDateDisabled(start, selectedDates, hasDoneSelect.current, type)) {\n        return true;\n      }\n\n      start = _utils.DateUtils.addDays(start, 1);\n    }\n\n    return false;\n  }, [isDateDisabled, selectedDates]);\n  var disabledOkButton = (0, _react.useCallback)(function () {\n    var start = selectedDates[0],\n        end = selectedDates[1];\n\n    if (!start || !end || !hasDoneSelect.current) {\n      return true;\n    }\n\n    return disabledByBetween(start, end, _utils.DATERANGE_DISABLED_TARGET.TOOLBAR_BUTTON_OK);\n  }, [disabledByBetween, selectedDates]);\n  var disabledShortcutButton = (0, _react.useCallback)(function (value) {\n    if (value === void 0) {\n      value = [];\n    }\n\n    var _value = value,\n        start = _value[0],\n        end = _value[1];\n\n    if (!start || !end) {\n      return true;\n    }\n\n    return disabledByBetween(start, end, _utils.DATERANGE_DISABLED_TARGET.TOOLBAR_SHORTCUT);\n  }, [disabledByBetween]);\n  var handleDisabledDate = (0, _react.useCallback)(function (date, values, type) {\n    return isDateDisabled(date, values, hasDoneSelect.current, type);\n  }, [isDateDisabled]);\n  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    triggerRef: triggerRef,\n    targetRef: targetRef,\n    active: isPickerToggleActive,\n    onExit: handleClean\n  }, rest));\n\n  var renderDropdownMenu = function renderDropdownMenu(positionProps, speakerRef) {\n    var left = positionProps.left,\n        top = positionProps.top,\n        className = positionProps.className;\n    var classes = merge(className, menuClassName, prefix('daterange-menu'));\n    var panelClasses = prefix('daterange-panel', {\n      'daterange-panel-show-one-calendar': showOneCalendar\n    });\n    var styles = (0, _extends2.default)({}, menuStyle, {\n      left: left,\n      top: top\n    });\n    var panelProps = {\n      calendarDate: calendarDate,\n      disabledDate: handleDisabledDate,\n      format: formatStr,\n      hoverRangeValue: hoverDateRange !== null && hoverDateRange !== void 0 ? hoverDateRange : undefined,\n      isoWeek: isoWeek,\n      limitEndYear: limitEndYear,\n      locale: locale,\n      showOneCalendar: showOneCalendar,\n      showWeekNumbers: showWeekNumbers,\n      value: selectedDates,\n      showMeridian: showMeridian,\n      onChangeCalendarDate: handleChangeCalendarDate,\n      onChangeCalendarTime: handleChangeCalendarTime,\n      onMouseMove: handleMouseMove,\n      onSelect: handleSelectDate,\n      onToggleMeridian: handleToggleMeridian\n    };\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerOverlay, {\n      className: classes,\n      ref: (0, _utils.mergeRefs)(overlayRef, speakerRef),\n      target: triggerRef,\n      style: styles,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 702,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: panelClasses,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 708,\n        columnNumber: 9\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix('daterange-content'),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 709,\n        columnNumber: 11\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix('daterange-header'),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 710,\n        columnNumber: 13\n      }\n    }, getDisplayString(selectedDates)), /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix(\"daterange-calendar-\" + (showOneCalendar ? 'single' : 'group')),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 711,\n        columnNumber: 13\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n      index: 0\n    }, panelProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 712,\n        columnNumber: 15\n      }\n    })), !showOneCalendar && /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n      index: 1\n    }, panelProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 713,\n        columnNumber: 36\n      }\n    })))), /*#__PURE__*/_react.default.createElement(_Toolbar.default, {\n      locale: locale,\n      calendarDate: selectedDates,\n      disabledOkBtn: disabledOkButton,\n      disabledShortcut: disabledShortcutButton,\n      hideOkBtn: oneTap,\n      onOk: handleOK,\n      onClickShortcut: handleShortcutPageDate,\n      ranges: ranges,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 716,\n        columnNumber: 11\n      }\n    })));\n  };\n\n  var hasValue = !(0, _isNil.default)(value) && value.length > 1;\n\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n    classPrefix: classPrefix,\n    name: 'daterange',\n    appearance: appearance,\n    hasValue: hasValue,\n    cleanable: cleanable\n  })),\n      classes = _usePickerClassName[0],\n      usedClassNamePropKeys = _usePickerClassName[1];\n\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: triggerRef,\n    placement: placement,\n    onEnter: (0, _utils.createChainedFunction)(handleEnter, onEnter),\n    onEntered: (0, _utils.createChainedFunction)(handleEntered, onEntered),\n    onExited: (0, _utils.createChainedFunction)(handleExited, onExited),\n    speaker: renderDropdownMenu,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 742,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    ref: rootRef,\n    className: merge(className, classes, (_merge = {}, _merge[prefix('error')] = inputState === 'Error', _merge)),\n    style: style,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 751,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys, _utils.DateUtils.calendarOnlyProps)), {\n    as: toggleAs,\n    ref: targetRef,\n    appearance: appearance,\n    input: true,\n    inputMask: _utils.DateUtils.getDateMask(rangeFormatStr),\n    inputValue: value ? getDisplayString(value, true) : '',\n    inputPlaceholder: typeof placeholder === 'string' && placeholder ? placeholder : rangeFormatStr,\n    onInputChange: handleInputChange,\n    onInputBlur: handleInputPressEnd,\n    onInputPressEnter: handleInputPressEnd,\n    onKeyDown: onPickerKeyDown,\n    onClean: (0, _utils.createChainedFunction)(handleClean, onClean),\n    cleanable: cleanable && !disabled,\n    hasValue: hasValue,\n    active: isPickerToggleActive,\n    placement: placement,\n    caretComponent: _Calendar.default,\n    disabled: disabled,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 758,\n      columnNumber: 9\n    }\n  }), getDisplayString(value))));\n});\n\nDateRangePicker.after = disabledDateUtils.after;\nDateRangePicker.afterToday = disabledDateUtils.afterToday;\nDateRangePicker.allowedDays = disabledDateUtils.allowedDays;\nDateRangePicker.allowedMaxDays = disabledDateUtils.allowedMaxDays;\nDateRangePicker.allowedRange = disabledDateUtils.allowedRange;\nDateRangePicker.before = disabledDateUtils.before;\nDateRangePicker.beforeToday = disabledDateUtils.beforeToday;\nDateRangePicker.combine = disabledDateUtils.combine;\nDateRangePicker.displayName = 'DateRangePicker';\nDateRangePicker.propTypes = (0, _extends2.default)({}, _Picker.pickerPropTypes, {\n  ranges: _propTypes.default.array,\n  value: _propTypes.default.arrayOf(_propTypes.default.instanceOf(Date)),\n  defaultValue: _propTypes.default.arrayOf(_propTypes.default.instanceOf(Date)),\n  defaultCalendarValue: _propTypes.default.arrayOf(_propTypes.default.instanceOf(Date)),\n  hoverRange: _propTypes.default.oneOfType([_propTypes.default.oneOf(['week', 'month']), _propTypes.default.func]),\n  format: _propTypes.default.string,\n  isoWeek: _propTypes.default.bool,\n  oneTap: _propTypes.default.bool,\n  limitEndYear: _propTypes.default.number,\n  onChange: _propTypes.default.func,\n  onOk: _propTypes.default.func,\n  disabledDate: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  showWeekNumbers: _propTypes.default.bool,\n  showMeridian: _propTypes.default.bool,\n  showOneCalendar: _propTypes.default.bool\n});\nvar _default = DateRangePicker;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/DateRangePicker/DateRangePicker.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _Calendar = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/Calendar */ \"./node_modules/@rsuite/icons/legacy/Calendar.js\"));\n\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\n\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\n\nvar _partial = _interopRequireDefault(__webpack_require__(/*! lodash/partial */ \"./node_modules/lodash/partial.js\"));\n\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _CustomProvider = __webpack_require__(/*! ../CustomProvider */ \"./src/CustomProvider/index.tsx\");\n\nvar _Toolbar = _interopRequireDefault(__webpack_require__(/*! ../DatePicker/Toolbar */ \"./src/DatePicker/Toolbar.tsx\"));\n\nvar _Picker = __webpack_require__(/*! ../Picker */ \"./src/Picker/index.ts\");\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _dateUtils = __webpack_require__(/*! ../utils/dateUtils */ \"./src/utils/dateUtils.ts\");\n\nvar _Calendar2 = _interopRequireDefault(__webpack_require__(/*! ./Calendar */ \"./src/DateRangePicker/Calendar.tsx\"));\n\nvar disabledDateUtils = _interopRequireWildcard(__webpack_require__(/*! ./disabledDateUtils */ \"./src/DateRangePicker/disabledDateUtils.ts\"));\n\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/DateRangePicker/utils.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DateRangePicker/DateRangePicker.tsx\",\n    _this = void 0;\n\nvar DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _ref, _ref2, _merge;\n\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n      className = props.className,\n      _props$appearance = props.appearance,\n      appearance = _props$appearance === void 0 ? 'default' : _props$appearance,\n      _props$cleanable = props.cleanable,\n      cleanable = _props$cleanable === void 0 ? true : _props$cleanable,\n      _props$character = props.character,\n      character = _props$character === void 0 ? ' ~ ' : _props$character,\n      defaultCalendarValue = props.defaultCalendarValue,\n      defaultValue = props.defaultValue,\n      disabled = props.disabled,\n      disabledDateProp = props.disabledDate,\n      _props$format = props.format,\n      formatStr = _props$format === void 0 ? 'yyyy-MM-dd' : _props$format,\n      hoverRange = props.hoverRange,\n      _props$isoWeek = props.isoWeek,\n      isoWeek = _props$isoWeek === void 0 ? false : _props$isoWeek,\n      _props$limitEndYear = props.limitEndYear,\n      limitEndYear = _props$limitEndYear === void 0 ? 1000 : _props$limitEndYear,\n      overrideLocale = props.locale,\n      menuClassName = props.menuClassName,\n      menuStyle = props.menuStyle,\n      oneTap = props.oneTap,\n      _props$placeholder = props.placeholder,\n      placeholder = _props$placeholder === void 0 ? '' : _props$placeholder,\n      _props$placement = props.placement,\n      placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n      ranges = props.ranges,\n      renderValue = props.renderValue,\n      _props$showOneCalenda = props.showOneCalendar,\n      showOneCalendar = _props$showOneCalenda === void 0 ? false : _props$showOneCalenda,\n      showWeekNumbers = props.showWeekNumbers,\n      showMeridian = props.showMeridian,\n      style = props.style,\n      toggleAs = props.toggleAs,\n      valueProp = props.value,\n      onChange = props.onChange,\n      onClean = props.onClean,\n      onClose = props.onClose,\n      onEnter = props.onEnter,\n      onEntered = props.onEntered,\n      onExited = props.onExited,\n      onOk = props.onOk,\n      onOpen = props.onOpen,\n      onSelect = props.onSelect,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"className\", \"appearance\", \"cleanable\", \"character\", \"defaultCalendarValue\", \"defaultValue\", \"disabled\", \"disabledDate\", \"format\", \"hoverRange\", \"isoWeek\", \"limitEndYear\", \"locale\", \"menuClassName\", \"menuStyle\", \"oneTap\", \"placeholder\", \"placement\", \"ranges\", \"renderValue\", \"showOneCalendar\", \"showWeekNumbers\", \"showMeridian\", \"style\", \"toggleAs\", \"value\", \"onChange\", \"onClean\", \"onClose\", \"onEnter\", \"onEntered\", \"onExited\", \"onOk\", \"onOpen\", \"onSelect\"]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      prefix = _useClassNames.prefix;\n\n  var _useCustom = (0, _utils.useCustom)('DateRangePicker', overrideLocale),\n      locale = _useCustom.locale,\n      formatDate = _useCustom.formatDate,\n      parseDate = _useCustom.parseDate;\n\n  var rangeFormatStr = \"\" + formatStr + character + formatStr;\n\n  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue !== null && defaultValue !== void 0 ? defaultValue : null),\n      value = _useControlled[0],\n      setValue = _useControlled[1];\n  /**\n   * Whether to complete the selection.\n   * Everytime selection will change this value. If the value is false, it means that the selection has not been completed.\n   *\n   * In `oneTap` mode, select action will not change this value, its value should be true always.\n   */\n\n\n  var hasDoneSelect = (0, _react.useRef)(true);\n  /**\n   * The currently selected date range.\n   *\n   * The time range is selected by two clicks. After the first click,\n   * the cursor will store a temporary event date in the process until\n   * the second click to determine the end date of the date range.\n   *\n   */\n\n  var _useState = (0, _react.useState)((_ref = valueProp !== null && valueProp !== void 0 ? valueProp : defaultValue) !== null && _ref !== void 0 ? _ref : []),\n      selectedDates = _useState[0],\n      setSelectedDates = _useState[1]; // The date of the current hover, used to reduce the calculation of `handleMouseMove`\n\n\n  var _useState2 = (0, _react.useState)(null),\n      hoverDateRange = _useState2[0],\n      setHoverDateRange = _useState2[1]; // The displayed calendar panel is rendered based on this value.\n\n\n  var _useState3 = (0, _react.useState)((0, _utils2.getCalendarDate)({\n    value: (_ref2 = valueProp !== null && valueProp !== void 0 ? valueProp : defaultCalendarValue) !== null && _ref2 !== void 0 ? _ref2 : null\n  })),\n      calendarDate = _useState3[0],\n      setCalendarDate = _useState3[1];\n\n  var _useState4 = (0, _react.useState)(),\n      inputState = _useState4[0],\n      setInputState = _useState4[1];\n  /**\n   * When hoverRange is set, `selectValue` will be updated during the hover process,\n   * which will cause the `selectValue` to be updated after the first click,\n   * so declare a Ref to temporarily store the `selectValue` of the first click.\n   */\n\n\n  var selectRangeValueRef = (0, _react.useRef)(null);\n  /**\n   * Call this function to update the calendar panel rendering benchmark value.\n   * If params `value` is not passed, it defaults to [new Date(), addMonth(new Date(), 1)].\n   */\n\n  var updateCalendarDate = (0, _react.useCallback)(function (value) {\n    setCalendarDate((0, _utils2.getCalendarDate)({\n      value: value\n    }));\n  }, []); // if valueProp changed then update selectValue/hoverValue\n\n  (0, _react.useEffect)(function () {\n    setSelectedDates(valueProp !== null && valueProp !== void 0 ? valueProp : []);\n    setHoverDateRange(valueProp !== null && valueProp !== void 0 ? valueProp : null);\n  }, [valueProp]);\n\n  var _useState5 = (0, _react.useState)(false),\n      isPickerToggleActive = _useState5[0],\n      setPickerToggleActive = _useState5[1];\n\n  var rootRef = (0, _react.useRef)(null);\n  var overlayRef = (0, _react.useRef)(null);\n  var targetRef = (0, _react.useRef)(null);\n  var triggerRef = (0, _react.useRef)(null);\n  var handleCloseDropdown = (0, _react.useCallback)(function () {\n    var _triggerRef$current, _triggerRef$current$c;\n\n    (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : (_triggerRef$current$c = _triggerRef$current.close) === null || _triggerRef$current$c === void 0 ? void 0 : _triggerRef$current$c.call(_triggerRef$current);\n  }, []);\n  (0, _Picker.usePublicMethods)(ref, {\n    triggerRef: triggerRef,\n    overlayRef: overlayRef,\n    targetRef: targetRef,\n    rootRef: rootRef\n  });\n  var getDisplayString = (0, _react.useCallback)(function (nextValue, isPlaintext) {\n    var _nextValue$, _nextValue$2;\n\n    var startDate = (_nextValue$ = nextValue === null || nextValue === void 0 ? void 0 : nextValue[0]) !== null && _nextValue$ !== void 0 ? _nextValue$ : null;\n    var endDate = (_nextValue$2 = nextValue === null || nextValue === void 0 ? void 0 : nextValue[1]) !== null && _nextValue$2 !== void 0 ? _nextValue$2 : null;\n\n    if (startDate && endDate) {\n      var displayValue = [startDate, endDate].sort(_dateUtils.compareAsc);\n\n      if (isPlaintext) {\n        return formatDate(displayValue[0], formatStr) + character + formatDate(displayValue[1], formatStr);\n      }\n\n      return renderValue ? renderValue(displayValue, formatStr) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_CustomProvider.FormattedDate, {\n        date: displayValue[0],\n        formatStr: formatStr,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 268,\n          columnNumber: 13\n        }\n      }), character, /*#__PURE__*/_react.default.createElement(_CustomProvider.FormattedDate, {\n        date: displayValue[1],\n        formatStr: formatStr,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 270,\n          columnNumber: 13\n        }\n      }));\n    }\n\n    return isPlaintext ? '' : placeholder || rangeFormatStr;\n  }, [character, formatDate, formatStr, placeholder, rangeFormatStr, renderValue]);\n  /**\n   * preset hover range\n   */\n\n  var getHoverRangeValue = (0, _react.useCallback)(function (date) {\n    function getHoverRangeFunc() {\n      if (hoverRange === 'week') {\n        return (0, _partial.default)(_utils2.getWeekHoverRange, isoWeek);\n      } else if (hoverRange === 'month') {\n        return _utils2.getMonthHoverRange;\n      }\n\n      return hoverRange;\n    }\n\n    var hoverRangeFunc = getHoverRangeFunc();\n\n    if ((0, _isNil.default)(hoverRangeFunc)) {\n      return null;\n    }\n\n    var hoverValues = hoverRangeFunc(date);\n    var isHoverRangeValid = hoverValues instanceof Array && hoverValues.length === 2;\n\n    if (!isHoverRangeValid) {\n      return null;\n    }\n\n    if (_utils.DateUtils.isAfter(hoverValues[0], hoverValues[1])) {\n      hoverValues.reverse();\n    }\n\n    return hoverValues;\n  }, [hoverRange, isoWeek]);\n  var handleValueUpdate = (0, _react.useCallback)(function (event, nextValue, closeOverlay) {\n    if (closeOverlay === void 0) {\n      closeOverlay = true;\n    }\n\n    // If nextValue is null, it means that the user is erasing the selected dates.\n    setSelectedDates(nextValue !== null && nextValue !== void 0 ? nextValue : []);\n\n    if (!(0, _utils2.isSameRange)(nextValue, value, formatStr)) {\n      setValue(nextValue);\n      onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n    } // `closeOverlay` default value is `true`\n\n\n    if (closeOverlay !== false) {\n      handleCloseDropdown();\n    }\n  }, [formatStr, handleCloseDropdown, onChange, setValue, value]);\n  /**\n   * Select the date range. If oneTap is not set, you need to click twice to select the start time and end time.\n   * The MouseMove event is called between the first click and the second click to update the selection state.\n   */\n\n  var handleMouseMove = (0, _react.useCallback)(function (date) {\n    var nextHoverDateRange = getHoverRangeValue(date); // If hasDoneSelect is false,\n    // it means there's already one selected date\n    // and waiting for user to select the second date to complete the selection.\n\n    if (!hasDoneSelect.current) {\n      // If `hoverRange` is set, you need to change the value of hoverDateRange according to the rules\n      if (!(0, _isNil.default)(nextHoverDateRange)) {\n        var nextSelectedDates = [selectRangeValueRef.current[0], nextHoverDateRange[1]];\n\n        if (_utils.DateUtils.isBefore(nextHoverDateRange[0], selectRangeValueRef.current[0])) {\n          nextSelectedDates = [nextHoverDateRange[0], selectRangeValueRef.current[1]];\n        }\n\n        setSelectedDates(nextSelectedDates);\n      } else {\n        setHoverDateRange(function (prevHoverValue) {\n          return (0, _isNil.default)(prevHoverValue) ? null : [prevHoverValue[0], date];\n        });\n      } // Before the first click, if nextHoverDateRange has a value, hoverDateRange needs to be updated\n\n    } else if (!(0, _isNil.default)(nextHoverDateRange)) {\n      setHoverDateRange(nextHoverDateRange);\n    }\n  }, [getHoverRangeValue]);\n  /**\n   * Callback for selecting a date cell in the calendar grid\n   */\n\n  var handleSelectDate = (0, _react.useCallback)(function (date, event) {\n    var nextSelectDates = hoverDateRange !== null && hoverDateRange !== void 0 ? hoverDateRange : [];\n    var hoverRangeValue = getHoverRangeValue(date);\n    var noHoverRangeValid = (0, _isNil.default)(hoverRangeValue); // in `oneTap` mode\n\n    if (hasDoneSelect.current && oneTap) {\n      handleValueUpdate(event, noHoverRangeValid ? [(0, _utils2.setTimingMargin)(date), (0, _utils2.setTimingMargin)(date, 'right')] : hoverRangeValue);\n      hasDoneSelect.current = false;\n      return;\n    } // no preset hover range can use\n\n\n    if (noHoverRangeValid) {\n      // start select\n      if (hasDoneSelect.current) {\n        nextSelectDates = [date];\n      } else {\n        // finish select\n        nextSelectDates[1] = date;\n      }\n    } else {\n      if (!hasDoneSelect.current) {\n        nextSelectDates = selectedDates;\n        selectRangeValueRef.current = null;\n      } else {\n        nextSelectDates = hoverRangeValue;\n        selectRangeValueRef.current = hoverRangeValue;\n      }\n    } // If user have completed the selection, then sort\n\n\n    if (nextSelectDates.length === 2 && _utils.DateUtils.isAfter(nextSelectDates[0], nextSelectDates[1])) {\n      nextSelectDates.reverse();\n    }\n\n    setHoverDateRange(nextSelectDates.length === 2 ? nextSelectDates : [nextSelectDates[0], nextSelectDates[0]]);\n    setSelectedDates(nextSelectDates);\n    updateCalendarDate(nextSelectDates);\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(date, event);\n    hasDoneSelect.current = !hasDoneSelect.current;\n  }, [getHoverRangeValue, handleValueUpdate, hoverDateRange, onSelect, oneTap, selectedDates, updateCalendarDate]);\n  /**\n   * If `selectValue` changed, there will be the following effects.\n   * 1. Check if the selection is completed.\n   * 2. if the selection is completed, set the temporary `hoverValue` empty.\n   */\n\n  (0, _react.useEffect)(function () {\n    var selectValueLength = selectedDates.length;\n    var doneSelected = selectValueLength === 0 || selectValueLength === 2;\n    doneSelected && setHoverDateRange(null);\n  }, [selectedDates]);\n  var handleChangeCalendarDate = (0, _react.useCallback)(function (index, date) {\n    var nextCalendarDate = Array.from(calendarDate);\n    nextCalendarDate[index] = date;\n    updateCalendarDate(nextCalendarDate);\n  }, [calendarDate, updateCalendarDate]);\n  var handleChangeCalendarTime = (0, _react.useCallback)(function (index, date) {\n    setSelectedDates(function (prev) {\n      var next = [].concat(prev);\n      var clonedDate = new Date(date.valueOf()); // if next[index] is not empty, only update the time after aligning the year, month and day\n\n      if (next[index]) {\n        clonedDate.setFullYear(next[index].getFullYear(), next[index].getMonth(), next[index].getDate());\n      }\n\n      next[index] = clonedDate;\n      return next;\n    });\n    handleChangeCalendarDate(index, date);\n  }, [handleChangeCalendarDate]);\n  /**\n   * The callback triggered when PM/AM is switched.\n   */\n\n  var handleToggleMeridian = (0, _react.useCallback)(function (index) {\n    var next = Array.from(calendarDate);\n    var clonedDate = new Date(next[index].valueOf());\n\n    var hours = _utils.DateUtils.getHours(clonedDate);\n\n    var nextHours = hours >= 12 ? hours - 12 : hours + 12;\n    next[index] = _utils.DateUtils.setHours(clonedDate, nextHours);\n    setCalendarDate(next); // If the value already exists, update the value again.\n\n    if (selectedDates.length === 2) {\n      setSelectedDates(next);\n    }\n  }, [calendarDate, selectedDates]);\n  /**\n   * Toolbar operation callback function\n   */\n\n  var handleShortcutPageDate = (0, _react.useCallback)(function (value, closeOverlay, event) {\n    if (closeOverlay === void 0) {\n      closeOverlay = false;\n    }\n\n    handleValueUpdate(event, value, closeOverlay);\n  }, [handleValueUpdate]);\n  var handleOK = (0, _react.useCallback)(function (event) {\n    handleValueUpdate(event, selectedDates);\n    onOk === null || onOk === void 0 ? void 0 : onOk(selectedDates, event);\n  }, [handleValueUpdate, onOk, selectedDates]);\n  var handleClean = (0, _react.useCallback)(function (event) {\n    updateCalendarDate(null);\n    handleValueUpdate(event, null);\n  }, [handleValueUpdate, updateCalendarDate]);\n  /**\n   * Callback after the input box value is changed.\n   */\n\n  var handleInputChange = (0, _react.useCallback)(function (value) {\n    setInputState('Typing');\n    var rangeValue = value.split(character); // isMatch('01/11/2020', 'MM/dd/yyyy') ==> true\n    // isMatch('2020-11-01', 'MM/dd/yyyy') ==> false\n\n    if (!_utils.DateUtils.isMatch(rangeValue[0], formatStr, {\n      locale: locale.dateLocale\n    }) || !_utils.DateUtils.isMatch(rangeValue[1], formatStr, {\n      locale: locale.dateLocale\n    })) {\n      setInputState('Error');\n      return;\n    }\n\n    var startDate = parseDate(rangeValue[0], formatStr);\n    var endDate = parseDate(rangeValue[1], formatStr);\n    var selectValue = [startDate, endDate];\n\n    if (!_utils.DateUtils.isValid(startDate) || !_utils.DateUtils.isValid(endDate)) {\n      setInputState('Error');\n      return;\n    }\n\n    if (isDateDisabled(startDate, selectValue, true, _utils.DATERANGE_DISABLED_TARGET.CALENDAR)) {\n      setInputState('Error');\n      return;\n    }\n\n    setHoverDateRange(selectValue);\n    setSelectedDates(selectValue);\n    updateCalendarDate(selectValue);\n  }, // eslint-disable-next-line react-hooks/exhaustive-deps\n  [character, rangeFormatStr, updateCalendarDate]);\n  /**\n   * The callback after the enter key is triggered on the input\n   */\n\n  var handleInputPressEnd = (0, _react.useCallback)(function (event) {\n    if (inputState === 'Typing') {\n      handleValueUpdate(event, selectedDates.length === 2 ? selectedDates : null);\n    }\n\n    setInputState('Initial');\n  }, [handleValueUpdate, selectedDates, inputState]);\n  var handleEnter = (0, _react.useCallback)(function () {\n    var nextCalendarDate;\n\n    if (value && value.length) {\n      var _startDate = value[0],\n          endData = value[1];\n      nextCalendarDate = [_startDate, (0, _dateUtils.isSameMonth)(_startDate, endData) ? (0, _dateUtils.addMonths)(endData, 1) : endData];\n    } else {\n      nextCalendarDate = (0, _utils2.getCalendarDate)({\n        value: defaultCalendarValue !== null && defaultCalendarValue !== void 0 ? defaultCalendarValue : null\n      });\n    }\n\n    setSelectedDates(value !== null && value !== void 0 ? value : []);\n    updateCalendarDate(nextCalendarDate);\n  }, [defaultCalendarValue, updateCalendarDate, setSelectedDates, value]);\n  var handleEntered = (0, _react.useCallback)(function () {\n    onOpen === null || onOpen === void 0 ? void 0 : onOpen();\n    setPickerToggleActive(true);\n  }, [onOpen]);\n  var handleExited = (0, _react.useCallback)(function () {\n    setPickerToggleActive(false);\n    hasDoneSelect.current = true;\n    onClose === null || onClose === void 0 ? void 0 : onClose();\n  }, [onClose]);\n  var isDateDisabled = (0, _react.useCallback)(function (date, selectDate, selectedDone, target) {\n    var _disabledDateProp;\n\n    return (_disabledDateProp = disabledDateProp === null || disabledDateProp === void 0 ? void 0 : disabledDateProp(date, selectDate, selectedDone, target)) !== null && _disabledDateProp !== void 0 ? _disabledDateProp : false;\n  }, [disabledDateProp]);\n  var disabledByBetween = (0, _react.useCallback)(function (start, end, type) {\n    // If the date is between the start and the end\n    // the button is disabled\n    while (_utils.DateUtils.isBefore(start, end) || _utils.DateUtils.isSameDay(start, end)) {\n      if (isDateDisabled(start, selectedDates, hasDoneSelect.current, type)) {\n        return true;\n      }\n\n      start = _utils.DateUtils.addDays(start, 1);\n    }\n\n    return false;\n  }, [isDateDisabled, selectedDates]);\n  var disabledOkButton = (0, _react.useCallback)(function () {\n    var start = selectedDates[0],\n        end = selectedDates[1];\n\n    if (!start || !end || !hasDoneSelect.current) {\n      return true;\n    }\n\n    return disabledByBetween(start, end, _utils.DATERANGE_DISABLED_TARGET.TOOLBAR_BUTTON_OK);\n  }, [disabledByBetween, selectedDates]);\n  var disabledShortcutButton = (0, _react.useCallback)(function (value) {\n    if (value === void 0) {\n      value = [];\n    }\n\n    var _value = value,\n        start = _value[0],\n        end = _value[1];\n\n    if (!start || !end) {\n      return true;\n    }\n\n    return disabledByBetween(start, end, _utils.DATERANGE_DISABLED_TARGET.TOOLBAR_SHORTCUT);\n  }, [disabledByBetween]);\n  var handleDisabledDate = (0, _react.useCallback)(function (date, values, type) {\n    return isDateDisabled(date, values, hasDoneSelect.current, type);\n  }, [isDateDisabled]);\n  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    triggerRef: triggerRef,\n    targetRef: targetRef,\n    active: isPickerToggleActive,\n    onExit: handleClean\n  }, rest));\n\n  var renderDropdownMenu = function renderDropdownMenu(positionProps, speakerRef) {\n    var left = positionProps.left,\n        top = positionProps.top,\n        className = positionProps.className;\n    var classes = merge(className, menuClassName, prefix('daterange-menu'));\n    var panelClasses = prefix('daterange-panel', {\n      'daterange-panel-show-one-calendar': showOneCalendar\n    });\n    var styles = (0, _extends2.default)({}, menuStyle, {\n      left: left,\n      top: top\n    });\n    var panelProps = {\n      calendarDate: calendarDate,\n      disabledDate: handleDisabledDate,\n      format: formatStr,\n      hoverRangeValue: hoverDateRange !== null && hoverDateRange !== void 0 ? hoverDateRange : undefined,\n      isoWeek: isoWeek,\n      limitEndYear: limitEndYear,\n      locale: locale,\n      showOneCalendar: showOneCalendar,\n      showWeekNumbers: showWeekNumbers,\n      value: selectedDates,\n      showMeridian: showMeridian,\n      onChangeCalendarDate: handleChangeCalendarDate,\n      onChangeCalendarTime: handleChangeCalendarTime,\n      onMouseMove: handleMouseMove,\n      onSelect: handleSelectDate,\n      onToggleMeridian: handleToggleMeridian\n    };\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerOverlay, {\n      className: classes,\n      ref: (0, _utils.mergeRefs)(overlayRef, speakerRef),\n      target: triggerRef,\n      style: styles,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 707,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: panelClasses,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 713,\n        columnNumber: 9\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix('daterange-content'),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 714,\n        columnNumber: 11\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix('daterange-header'),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 715,\n        columnNumber: 13\n      }\n    }, getDisplayString(selectedDates)), /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix(\"daterange-calendar-\" + (showOneCalendar ? 'single' : 'group')),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 716,\n        columnNumber: 13\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n      index: 0\n    }, panelProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 717,\n        columnNumber: 15\n      }\n    })), !showOneCalendar && /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n      index: 1\n    }, panelProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 718,\n        columnNumber: 36\n      }\n    })))), /*#__PURE__*/_react.default.createElement(_Toolbar.default, {\n      locale: locale,\n      calendarDate: selectedDates,\n      disabledOkBtn: disabledOkButton,\n      disabledShortcut: disabledShortcutButton,\n      hideOkBtn: oneTap,\n      onOk: handleOK,\n      onClickShortcut: handleShortcutPageDate,\n      ranges: ranges,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 721,\n        columnNumber: 11\n      }\n    })));\n  };\n\n  var hasValue = !(0, _isNil.default)(value) && value.length > 1;\n\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n    classPrefix: classPrefix,\n    name: 'daterange',\n    appearance: appearance,\n    hasValue: hasValue,\n    cleanable: cleanable\n  })),\n      classes = _usePickerClassName[0],\n      usedClassNamePropKeys = _usePickerClassName[1];\n\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: triggerRef,\n    placement: placement,\n    onEnter: (0, _utils.createChainedFunction)(handleEnter, onEnter),\n    onEntered: (0, _utils.createChainedFunction)(handleEntered, onEntered),\n    onExited: (0, _utils.createChainedFunction)(handleExited, onExited),\n    speaker: renderDropdownMenu,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 747,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    ref: rootRef,\n    className: merge(className, classes, (_merge = {}, _merge[prefix('error')] = inputState === 'Error', _merge)),\n    style: style,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 756,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys, _utils.DateUtils.calendarOnlyProps)), {\n    as: toggleAs,\n    ref: targetRef,\n    appearance: appearance,\n    input: true,\n    inputMask: _utils.DateUtils.getDateMask(rangeFormatStr),\n    inputValue: value ? getDisplayString(value, true) : '',\n    inputPlaceholder: typeof placeholder === 'string' && placeholder ? placeholder : rangeFormatStr,\n    onInputChange: handleInputChange,\n    onInputBlur: handleInputPressEnd,\n    onInputPressEnter: handleInputPressEnd,\n    onKeyDown: onPickerKeyDown,\n    onClean: (0, _utils.createChainedFunction)(handleClean, onClean),\n    cleanable: cleanable && !disabled,\n    hasValue: hasValue,\n    active: isPickerToggleActive,\n    placement: placement,\n    caretAs: _Calendar.default,\n    disabled: disabled,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 763,\n      columnNumber: 9\n    }\n  }), getDisplayString(value))));\n});\n\nDateRangePicker.after = disabledDateUtils.after;\nDateRangePicker.afterToday = disabledDateUtils.afterToday;\nDateRangePicker.allowedDays = disabledDateUtils.allowedDays;\nDateRangePicker.allowedMaxDays = disabledDateUtils.allowedMaxDays;\nDateRangePicker.allowedRange = disabledDateUtils.allowedRange;\nDateRangePicker.before = disabledDateUtils.before;\nDateRangePicker.beforeToday = disabledDateUtils.beforeToday;\nDateRangePicker.combine = disabledDateUtils.combine;\nDateRangePicker.displayName = 'DateRangePicker';\nDateRangePicker.propTypes = (0, _extends2.default)({}, _Picker.pickerPropTypes, {\n  ranges: _propTypes.default.array,\n  value: _propTypes.default.arrayOf(_propTypes.default.instanceOf(Date)),\n  defaultValue: _propTypes.default.arrayOf(_propTypes.default.instanceOf(Date)),\n  defaultCalendarValue: _propTypes.default.arrayOf(_propTypes.default.instanceOf(Date)),\n  hoverRange: _propTypes.default.oneOfType([_propTypes.default.oneOf(['week', 'month']), _propTypes.default.func]),\n  format: _propTypes.default.string,\n  isoWeek: _propTypes.default.bool,\n  oneTap: _propTypes.default.bool,\n  limitEndYear: _propTypes.default.number,\n  onChange: _propTypes.default.func,\n  onOk: _propTypes.default.func,\n  disabledDate: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  showWeekNumbers: _propTypes.default.bool,\n  showMeridian: _propTypes.default.bool,\n  showOneCalendar: _propTypes.default.bool\n});\nvar _default = DateRangePicker;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/DateRangePicker/DateRangePicker.tsx?");
 
 /***/ }),
 
@@ -2397,7 +2397,7 @@ eval("\n\nexports.__esModule = true;\nexports.getCalendarDate = getCalendarDate;
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _DisclosureContext = _interopRequireWildcard(__webpack_require__(/*! ./DisclosureContext */ \"./src/Disclosure/DisclosureContext.ts\"));\n\nvar _DisclosureButton = _interopRequireDefault(__webpack_require__(/*! ./DisclosureButton */ \"./src/Disclosure/DisclosureButton.tsx\"));\n\nvar _DisclosureContent = _interopRequireDefault(__webpack_require__(/*! ./DisclosureContent */ \"./src/Disclosure/DisclosureContent.tsx\"));\n\nvar _useClickOutside = _interopRequireDefault(__webpack_require__(/*! ../utils/useClickOutside */ \"./src/utils/useClickOutside.ts\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Disclosure/Disclosure.tsx\";\nvar initialDisclosureState = {\n  open: false\n};\n\nfunction disclosureReducer(state, action) {\n  switch (action.type) {\n    case _DisclosureContext.DisclosureActionTypes.Show:\n      return (0, _extends2.default)({}, state, {\n        open: true\n      });\n\n    case _DisclosureContext.DisclosureActionTypes.Hide:\n      return (0, _extends2.default)({}, state, {\n        open: false\n      });\n  }\n\n  return state;\n}\n\nfunction Disclosure(props) {\n  var children = props.children,\n      openProp = props.open,\n      _props$defaultOpen = props.defaultOpen,\n      defaultOpen = _props$defaultOpen === void 0 ? false : _props$defaultOpen,\n      _props$hideOnClickOut = props.hideOnClickOutside,\n      hideOnClickOutside = _props$hideOnClickOut === void 0 ? false : _props$hideOnClickOut,\n      onToggle = props.onToggle;\n\n  var _useReducer = (0, _react.useReducer)(disclosureReducer, (0, _extends2.default)({}, initialDisclosureState, {\n    open: defaultOpen\n  })),\n      openState = _useReducer[0].open,\n      dispatch = _useReducer[1];\n\n  var containerElementRef = (0, _react.useRef)(null);\n  var open = openProp !== null && openProp !== void 0 ? openProp : openState;\n  (0, _useClickOutside.default)({\n    enabled: hideOnClickOutside,\n    isOutside: function isOutside(event) {\n      var _containerElementRef$;\n\n      return !((_containerElementRef$ = containerElementRef.current) !== null && _containerElementRef$ !== void 0 && _containerElementRef$.contains(event.target));\n    },\n    handle: function handle() {\n      return dispatch({\n        type: _DisclosureContext.DisclosureActionTypes.Hide\n      });\n    }\n  });\n  var context = (0, _react.useMemo)(function () {\n    return [{\n      open: open\n    }, dispatch, {\n      onToggle: onToggle\n    }];\n  }, [open, dispatch, onToggle]);\n  return /*#__PURE__*/_react.default.createElement(_DisclosureContext.default.Provider, {\n    value: context,\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 76,\n      columnNumber: 5\n    }\n  }, children({\n    open: open\n  }, containerElementRef));\n}\n\nDisclosure.Button = _DisclosureButton.default;\nDisclosure.Content = _DisclosureContent.default;\nvar _default = Disclosure;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Disclosure/Disclosure.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _DisclosureContext = _interopRequireWildcard(__webpack_require__(/*! ./DisclosureContext */ \"./src/Disclosure/DisclosureContext.ts\"));\n\nvar _DisclosureButton = _interopRequireDefault(__webpack_require__(/*! ./DisclosureButton */ \"./src/Disclosure/DisclosureButton.tsx\"));\n\nvar _DisclosureContent = _interopRequireDefault(__webpack_require__(/*! ./DisclosureContent */ \"./src/Disclosure/DisclosureContent.tsx\"));\n\nvar _useClickOutside = _interopRequireDefault(__webpack_require__(/*! ../utils/useClickOutside */ \"./src/utils/useClickOutside.ts\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Disclosure/Disclosure.tsx\",\n    _this = void 0;\n\nvar initialDisclosureState = {\n  open: false\n};\n\nfunction disclosureReducer(state, action) {\n  switch (action.type) {\n    case _DisclosureContext.DisclosureActionTypes.Show:\n      return (0, _extends2.default)({}, state, {\n        open: true\n      });\n\n    case _DisclosureContext.DisclosureActionTypes.Hide:\n      return (0, _extends2.default)({}, state, {\n        open: false\n      });\n  }\n\n  return state;\n}\n\nvar Disclosure = /*#__PURE__*/_react.default.memo(function (props) {\n  var children = props.children,\n      openProp = props.open,\n      _props$defaultOpen = props.defaultOpen,\n      defaultOpen = _props$defaultOpen === void 0 ? false : _props$defaultOpen,\n      _props$hideOnClickOut = props.hideOnClickOutside,\n      hideOnClickOutside = _props$hideOnClickOut === void 0 ? false : _props$hideOnClickOut,\n      onToggle = props.onToggle,\n      _props$trigger = props.trigger,\n      trigger = _props$trigger === void 0 ? ['click'] : _props$trigger;\n  var parentDisclosure = (0, _react.useContext)(_DisclosureContext.default);\n\n  var _useReducer = (0, _react.useReducer)(disclosureReducer, (0, _extends2.default)({}, initialDisclosureState, {\n    open: defaultOpen\n  })),\n      openState = _useReducer[0].open,\n      dispatch = _useReducer[1];\n\n  var containerElementRef = (0, _react.useRef)(null);\n  var open = openProp !== null && openProp !== void 0 ? openProp : openState;\n  (0, _useClickOutside.default)({\n    enabled: hideOnClickOutside,\n    isOutside: function isOutside(event) {\n      var _containerElementRef$;\n\n      return !((_containerElementRef$ = containerElementRef.current) !== null && _containerElementRef$ !== void 0 && _containerElementRef$.contains(event.target));\n    },\n    handle: function handle() {\n      return dispatch({\n        type: _DisclosureContext.DisclosureActionTypes.Hide\n      });\n    }\n  });\n  var onMouseOver = (0, _react.useCallback)(function (event) {\n    if (!open) {\n      dispatch({\n        type: _DisclosureContext.DisclosureActionTypes.Show\n      });\n      onToggle === null || onToggle === void 0 ? void 0 : onToggle(true, event);\n    }\n  }, [open, dispatch, onToggle]);\n  var onMouseOut = (0, _react.useCallback)(function (event) {\n    if (open) {\n      dispatch({\n        type: _DisclosureContext.DisclosureActionTypes.Hide\n      });\n      onToggle === null || onToggle === void 0 ? void 0 : onToggle(false, event);\n    }\n  }, [open, dispatch, onToggle]);\n  var contextValue = (0, _react.useMemo)(function () {\n    var cascadeDispatch = function cascadeDispatch(action) {\n      var result = dispatch(action);\n\n      if ('cascade' in action) {\n        parentDisclosure === null || parentDisclosure === void 0 ? void 0 : parentDisclosure[1](action);\n      }\n\n      return result;\n    };\n\n    return [{\n      open: open\n    }, cascadeDispatch, {\n      onToggle: onToggle,\n      trigger: trigger\n    }];\n  }, [parentDisclosure, open, dispatch, onToggle, trigger]);\n  var renderProps = (0, _react.useMemo)(function () {\n    var renderProps = {\n      open: open\n    };\n\n    if (trigger.includes('mouseover')) {\n      renderProps.onMouseOver = onMouseOver;\n      renderProps.onMouseOut = onMouseOut;\n    }\n\n    return renderProps;\n  }, [open, trigger, onMouseOver, onMouseOut]);\n  return /*#__PURE__*/_react.default.createElement(_DisclosureContext.default.Provider, {\n    value: contextValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 127,\n      columnNumber: 5\n    }\n  }, children(renderProps, containerElementRef));\n});\n\nDisclosure.Button = _DisclosureButton.default;\nDisclosure.Content = _DisclosureContent.default;\nvar _default = Disclosure;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Disclosure/Disclosure.tsx?");
 
 /***/ }),
 
@@ -2434,6 +2434,17 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 
 /***/ }),
 
+/***/ "./src/Disclosure/index.tsx":
+/*!**********************************!*\
+  !*** ./src/Disclosure/index.tsx ***!
+  \**********************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _Disclosure = _interopRequireDefault(__webpack_require__(/*! ./Disclosure */ \"./src/Disclosure/Disclosure.tsx\"));\n\nvar _default = _Disclosure.default;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Disclosure/index.tsx?");
+
+/***/ }),
+
 /***/ "./src/Disclosure/useDisclosureContext.ts":
 /*!************************************************!*\
   !*** ./src/Disclosure/useDisclosureContext.ts ***!
@@ -2496,7 +2507,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\n\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\n\nvar _DropdownMenu = _interopRequireDefault(__webpack_require__(/*! ./DropdownMenu */ \"./src/Dropdown/DropdownMenu.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Sidenav = __webpack_require__(/*! ../Sidenav/Sidenav */ \"./src/Sidenav/Sidenav.tsx\");\n\nvar _deprecatePropType = _interopRequireDefault(__webpack_require__(/*! ../utils/deprecatePropType */ \"./src/utils/deprecatePropType.ts\"));\n\nvar _DropdownItem = _interopRequireDefault(__webpack_require__(/*! ./DropdownItem */ \"./src/Dropdown/DropdownItem.tsx\"));\n\nvar _DropdownContext = _interopRequireDefault(__webpack_require__(/*! ./DropdownContext */ \"./src/Dropdown/DropdownContext.ts\"));\n\nvar _Menu = _interopRequireDefault(__webpack_require__(/*! ../Menu/Menu */ \"./src/Menu/Menu.tsx\"));\n\nvar _DropdownToggle = _interopRequireDefault(__webpack_require__(/*! ./DropdownToggle */ \"./src/Dropdown/DropdownToggle.tsx\"));\n\nvar _MenuContext = _interopRequireDefault(__webpack_require__(/*! ../Menu/MenuContext */ \"./src/Menu/MenuContext.ts\"));\n\nvar _MenuItem = _interopRequireDefault(__webpack_require__(/*! ../Menu/MenuItem */ \"./src/Menu/MenuItem.tsx\"));\n\nvar _kebabCase = _interopRequireDefault(__webpack_require__(/*! lodash/kebabCase */ \"./node_modules/lodash/kebabCase.js\"));\n\nvar _Navbar = __webpack_require__(/*! ../Navbar/Navbar */ \"./src/Navbar/Navbar.tsx\");\n\nvar _Disclosure = _interopRequireDefault(__webpack_require__(/*! ../Disclosure/Disclosure */ \"./src/Disclosure/Disclosure.tsx\"));\n\nvar _SidenavDropdown = _interopRequireDefault(__webpack_require__(/*! ../Sidenav/SidenavDropdown */ \"./src/Sidenav/SidenavDropdown.tsx\"));\n\nvar _NavContext = _interopRequireDefault(__webpack_require__(/*! ../Nav/NavContext */ \"./src/Nav/NavContext.ts\"));\n\nvar _DropdownState = __webpack_require__(/*! ./DropdownState */ \"./src/Dropdown/DropdownState.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Dropdown/Dropdown.tsx\",\n    _this = void 0;\n\n/**\n * The <Dropdown> API\n * When used inside <Sidenav>, renders a <TreeviewRootItem>;\n * Otherwise renders a <MenuRoot>\n */\nvar Dropdown = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var activeKey = props.activeKey,\n      onSelectProp = props.onSelect,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"activeKey\", \"onSelect\"]);\n  var _rest$as = rest.as,\n      Component = _rest$as === void 0 ? 'div' : _rest$as,\n      title = rest.title,\n      onClose = rest.onClose,\n      onOpen = rest.onOpen,\n      onToggle = rest.onToggle,\n      eventKey = rest.eventKey,\n      _rest$trigger = rest.trigger,\n      trigger = _rest$trigger === void 0 ? 'click' : _rest$trigger,\n      _rest$placement = rest.placement,\n      placement = _rest$placement === void 0 ? 'bottomStart' : _rest$placement,\n      toggleAs = rest.toggleAs,\n      toggleClassName = rest.toggleClassName,\n      _rest$classPrefix = rest.classPrefix,\n      classPrefix = _rest$classPrefix === void 0 ? 'dropdown' : _rest$classPrefix,\n      className = rest.className,\n      disabled = rest.disabled,\n      children = rest.children,\n      menuStyle = rest.menuStyle,\n      style = rest.style,\n      toggleProps = (0, _objectWithoutPropertiesLoose2.default)(rest, [\"as\", \"title\", \"onClose\", \"onOpen\", \"onToggle\", \"eventKey\", \"trigger\", \"placement\", \"toggleAs\", \"toggleClassName\", \"classPrefix\", \"className\", \"disabled\", \"children\", \"menuStyle\", \"style\"]);\n\n  var _useContext = (0, _react.useContext)(_NavContext.default),\n      onSelectFromNav = _useContext.onSelect;\n\n  var emitSelect = (0, _react.useCallback)(function (eventKey, event) {\n    onSelectProp === null || onSelectProp === void 0 ? void 0 : onSelectProp(eventKey, event); // If <Dropdown> is inside <Nav>, also trigger `onSelect` on <Nav>\n\n    onSelectFromNav === null || onSelectFromNav === void 0 ? void 0 : onSelectFromNav(eventKey, event);\n  }, [onSelectProp, onSelectFromNav]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      withClassPrefix = _useClassNames.withClassPrefix,\n      prefix = _useClassNames.prefix;\n\n  var _useClassNames2 = (0, _utils.useClassNames)('dropdown-menu'),\n      withMenuClassPrefix = _useClassNames2.withClassPrefix,\n      mergeMenuClassName = _useClassNames2.merge;\n\n  var _useClassNames3 = (0, _utils.useClassNames)('nav-item'),\n      withNavItemClassPrefix = _useClassNames3.withClassPrefix,\n      mergeNavItemClassNames = _useClassNames3.merge;\n\n  var menuButtonTriggers = (0, _react.useMemo)(function () {\n    if (!trigger) {\n      return undefined;\n    }\n\n    var triggerMap = {\n      hover: 'mouseover',\n      click: 'click',\n      contextMenu: 'contextmenu'\n    };\n\n    if (!Array.isArray(trigger)) {\n      return [triggerMap[trigger]];\n    }\n\n    return trigger.map(function (t) {\n      return triggerMap[t];\n    });\n  }, [trigger]);\n  var parentMenu = (0, _react.useContext)(_MenuContext.default);\n  var sidenav = (0, _react.useContext)(_Sidenav.SidenavContext);\n  var navbar = (0, _react.useContext)(_Navbar.NavbarContext);\n\n  var _useReducer = (0, _react.useReducer)(_DropdownState.reducer, _DropdownState.initialState),\n      items = _useReducer[0].items,\n      dispatch = _useReducer[1];\n\n  var hasSelectedItem = (0, _react.useMemo)(function () {\n    return items.some(function (item) {\n      return item.props.selected;\n    });\n  }, [items]);\n  var dropdownContextValue = (0, _react.useMemo)(function () {\n    return {\n      activeKey: activeKey,\n      onSelect: emitSelect,\n      hasSelectedItem: hasSelectedItem,\n      dispatch: dispatch\n    };\n  }, [activeKey, emitSelect, hasSelectedItem, dispatch]); // Render a disclosure when inside expanded <Sidenav>\n\n  if (sidenav !== null && sidenav !== void 0 && sidenav.expanded) {\n    return /*#__PURE__*/_react.default.createElement(_DropdownContext.default.Provider, {\n      value: dropdownContextValue,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 177,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(_SidenavDropdown.default, (0, _extends2.default)({\n      ref: ref\n    }, rest, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 178,\n        columnNumber: 9\n      }\n    })));\n  } // Renders a disclosure when used inside <Navbar>\n\n\n  if (navbar) {\n    return /*#__PURE__*/_react.default.createElement(_DropdownContext.default.Provider, {\n      value: dropdownContextValue,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 186,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Disclosure.default, {\n      hideOnClickOutside: true,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 187,\n        columnNumber: 9\n      }\n    }, function (_ref, containerRef) {\n      var _withClassPrefix;\n\n      var open = _ref.open;\n      var classes = merge(className, withClassPrefix((_withClassPrefix = {}, _withClassPrefix[\"placement-\" + (0, _kebabCase.default)((0, _utils.placementPolyfill)(placement))] = !!placement, _withClassPrefix.disabled = disabled, _withClassPrefix.open = open, _withClassPrefix)));\n      return /*#__PURE__*/_react.default.createElement(Component, {\n        ref: (0, _utils.mergeRefs)(ref, containerRef),\n        className: classes,\n        style: style,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 199,\n          columnNumber: 15\n        }\n      }, /*#__PURE__*/_react.default.createElement(_Disclosure.default.Button, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 200,\n          columnNumber: 17\n        }\n      }, function (buttonProps, buttonRef) {\n        return /*#__PURE__*/_react.default.createElement(_DropdownToggle.default, (0, _extends2.default)({\n          ref: buttonRef,\n          as: toggleAs,\n          className: toggleClassName,\n          placement: placement,\n          disabled: disabled\n        }, (0, _omit.default)(buttonProps, ['open']), toggleProps, {\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 202,\n            columnNumber: 21\n          }\n        }), title);\n      }), /*#__PURE__*/_react.default.createElement(_Disclosure.default.Content, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 215,\n          columnNumber: 17\n        }\n      }, function (_ref2, elementRef) {\n        var open = _ref2.open;\n        var menuClassName = mergeMenuClassName(className, withMenuClassPrefix());\n        return /*#__PURE__*/_react.default.createElement(\"ul\", {\n          ref: elementRef,\n          className: menuClassName,\n          style: menuStyle,\n          hidden: !open,\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 219,\n            columnNumber: 23\n          }\n        }, children);\n      }));\n    }));\n  }\n\n  var renderMenuButton = function renderMenuButton(menuButtonProps, menuButtonRef) {\n    return /*#__PURE__*/_react.default.createElement(_DropdownToggle.default, (0, _extends2.default)({\n      ref: menuButtonRef,\n      as: toggleAs,\n      className: toggleClassName,\n      placement: placement,\n      disabled: disabled\n    }, (0, _omit.default)(menuButtonProps, ['open']), (0, _omit.default)(toggleProps, ['data-testid']), {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 239,\n        columnNumber: 5\n      }\n    }), title);\n  };\n\n  if (parentMenu) {\n    renderMenuButton = function renderMenuButton(menuButtonProps, buttonRef) {\n      return /*#__PURE__*/_react.default.createElement(_MenuItem.default, {\n        disabled: disabled,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 254,\n          columnNumber: 7\n        }\n      }, function (_ref3, menuitemRef) {\n        var active = _ref3.active,\n            menuitemProps = (0, _objectWithoutPropertiesLoose2.default)(_ref3, [\"active\"]);\n        return /*#__PURE__*/_react.default.createElement(_DropdownToggle.default, (0, _extends2.default)({\n          ref: (0, _utils.mergeRefs)(buttonRef, menuitemRef),\n          as: toggleAs,\n          className: mergeNavItemClassNames(toggleClassName, withNavItemClassPrefix({\n            focus: active\n          }))\n        }, menuButtonProps, (0, _omit.default)(menuitemProps, ['onClick']), (0, _omit.default)(toggleProps, 'data-testid'), {\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 257,\n            columnNumber: 13\n          }\n        }), title);\n      });\n    };\n  }\n\n  return /*#__PURE__*/_react.default.createElement(_DropdownContext.default.Provider, {\n    value: dropdownContextValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 279,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Menu.default, {\n    menuButtonText: title,\n    renderMenuButton: renderMenuButton,\n    openMenuOn: menuButtonTriggers,\n    renderMenuPopup: function renderMenuPopup(_ref4, popupRef) {\n      var open = _ref4.open,\n          popupProps = (0, _objectWithoutPropertiesLoose2.default)(_ref4, [\"open\"]);\n      var menuClassName = mergeMenuClassName(className, withMenuClassPrefix({})); // When inside a collapsed <Sidenav>, render a header in menu\n\n      var showHeader = !!sidenav;\n      return /*#__PURE__*/_react.default.createElement(\"ul\", (0, _extends2.default)({\n        ref: popupRef,\n        className: menuClassName,\n        style: menuStyle,\n        hidden: !open\n      }, popupProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 290,\n          columnNumber: 13\n        }\n      }), showHeader && /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: prefix('header'),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 297,\n          columnNumber: 30\n        }\n      }, title), children);\n    },\n    onToggleMenu: function onToggleMenu(open, event) {\n      onToggle === null || onToggle === void 0 ? void 0 : onToggle(open);\n      sidenav === null || sidenav === void 0 ? void 0 : sidenav.onOpenChange(eventKey, event);\n\n      if (open) {\n        onOpen === null || onOpen === void 0 ? void 0 : onOpen();\n      } else {\n        onClose === null || onClose === void 0 ? void 0 : onClose();\n      }\n    },\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 280,\n      columnNumber: 7\n    }\n  }, function (_ref5, menuContainerRef) {\n    var _withClassPrefix2;\n\n    var open = _ref5.open,\n        menuContainer = (0, _objectWithoutPropertiesLoose2.default)(_ref5, [\"open\"]);\n    var classes = merge(className, withClassPrefix((_withClassPrefix2 = {}, _withClassPrefix2[\"placement-\" + (0, _kebabCase.default)((0, _utils.placementPolyfill)(placement))] = !!placement, _withClassPrefix2.disabled = disabled, _withClassPrefix2.open = open, _withClassPrefix2.submenu = !!parentMenu, _withClassPrefix2['selected-within'] = hasSelectedItem, _withClassPrefix2)));\n    return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n      ref: (0, _utils.mergeRefs)(ref, menuContainerRef),\n      className: classes\n    }, menuContainer, (0, _pick.default)(toggleProps, ['data-testid']), {\n      style: style,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 324,\n        columnNumber: 13\n      }\n    }));\n  }));\n});\n\nDropdown.Item = _DropdownItem.default;\nDropdown.Menu = _DropdownMenu.default;\nDropdown.displayName = 'Dropdown';\nDropdown.propTypes = {\n  activeKey: _propTypes.default.any,\n  classPrefix: _propTypes.default.string,\n  trigger: _propTypes.default.oneOfType([_propTypes.default.array, _propTypes.default.oneOf(['click', 'hover', 'contextMenu'])]),\n  placement: _propTypes.default.oneOf(_utils.PLACEMENT_8),\n  title: _propTypes.default.node,\n  disabled: _propTypes.default.bool,\n  icon: _propTypes.default.node,\n  menuStyle: _propTypes.default.object,\n  className: _propTypes.default.string,\n  toggleClassName: _propTypes.default.string,\n  children: _propTypes.default.node,\n  open: (0, _deprecatePropType.default)(_propTypes.default.bool),\n  eventKey: _propTypes.default.any,\n  as: _propTypes.default.elementType,\n  toggleAs: _propTypes.default.elementType,\n  noCaret: _propTypes.default.bool,\n  style: _propTypes.default.object,\n  onClose: _propTypes.default.func,\n  onOpen: _propTypes.default.func,\n  onToggle: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  onMouseEnter: _propTypes.default.func,\n  onMouseLeave: _propTypes.default.func,\n  onContextMenu: _propTypes.default.func,\n  onClick: _propTypes.default.func,\n  renderToggle: _propTypes.default.func\n};\nvar _default = Dropdown;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Dropdown/Dropdown.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\n\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\n\nvar _DropdownMenu = _interopRequireDefault(__webpack_require__(/*! ./DropdownMenu */ \"./src/Dropdown/DropdownMenu.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Sidenav = __webpack_require__(/*! ../Sidenav/Sidenav */ \"./src/Sidenav/Sidenav.tsx\");\n\nvar _deprecatePropType = _interopRequireDefault(__webpack_require__(/*! ../utils/deprecatePropType */ \"./src/utils/deprecatePropType.ts\"));\n\nvar _DropdownItem = _interopRequireDefault(__webpack_require__(/*! ./DropdownItem */ \"./src/Dropdown/DropdownItem.tsx\"));\n\nvar _DropdownContext = _interopRequireDefault(__webpack_require__(/*! ./DropdownContext */ \"./src/Dropdown/DropdownContext.ts\"));\n\nvar _Menu = _interopRequireDefault(__webpack_require__(/*! ../Menu/Menu */ \"./src/Menu/Menu.tsx\"));\n\nvar _DropdownToggle = _interopRequireDefault(__webpack_require__(/*! ./DropdownToggle */ \"./src/Dropdown/DropdownToggle.tsx\"));\n\nvar _MenuContext = _interopRequireDefault(__webpack_require__(/*! ../Menu/MenuContext */ \"./src/Menu/MenuContext.ts\"));\n\nvar _MenuItem = _interopRequireDefault(__webpack_require__(/*! ../Menu/MenuItem */ \"./src/Menu/MenuItem.tsx\"));\n\nvar _kebabCase = _interopRequireDefault(__webpack_require__(/*! lodash/kebabCase */ \"./node_modules/lodash/kebabCase.js\"));\n\nvar _Navbar = __webpack_require__(/*! ../Navbar */ \"./src/Navbar/index.tsx\");\n\nvar _Disclosure = _interopRequireDefault(__webpack_require__(/*! ../Disclosure/Disclosure */ \"./src/Disclosure/Disclosure.tsx\"));\n\nvar _SidenavDropdown = _interopRequireDefault(__webpack_require__(/*! ../Sidenav/SidenavDropdown */ \"./src/Sidenav/SidenavDropdown.tsx\"));\n\nvar _NavContext = _interopRequireDefault(__webpack_require__(/*! ../Nav/NavContext */ \"./src/Nav/NavContext.ts\"));\n\nvar _DropdownState = __webpack_require__(/*! ./DropdownState */ \"./src/Dropdown/DropdownState.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Dropdown/Dropdown.tsx\",\n    _this = void 0;\n\n/**\n * The <Dropdown> API\n * When used inside <Sidenav>, renders a <TreeviewRootItem>;\n * Otherwise renders a <MenuRoot>\n */\nvar Dropdown = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var activeKey = props.activeKey,\n      onSelectProp = props.onSelect,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"activeKey\", \"onSelect\"]);\n  var _rest$as = rest.as,\n      Component = _rest$as === void 0 ? 'div' : _rest$as,\n      title = rest.title,\n      onClose = rest.onClose,\n      onOpen = rest.onOpen,\n      onToggle = rest.onToggle,\n      eventKey = rest.eventKey,\n      _rest$trigger = rest.trigger,\n      trigger = _rest$trigger === void 0 ? 'click' : _rest$trigger,\n      _rest$placement = rest.placement,\n      placement = _rest$placement === void 0 ? 'bottomStart' : _rest$placement,\n      toggleAs = rest.toggleAs,\n      toggleClassName = rest.toggleClassName,\n      _rest$classPrefix = rest.classPrefix,\n      classPrefix = _rest$classPrefix === void 0 ? 'dropdown' : _rest$classPrefix,\n      className = rest.className,\n      disabled = rest.disabled,\n      children = rest.children,\n      menuStyle = rest.menuStyle,\n      style = rest.style,\n      toggleProps = (0, _objectWithoutPropertiesLoose2.default)(rest, [\"as\", \"title\", \"onClose\", \"onOpen\", \"onToggle\", \"eventKey\", \"trigger\", \"placement\", \"toggleAs\", \"toggleClassName\", \"classPrefix\", \"className\", \"disabled\", \"children\", \"menuStyle\", \"style\"]);\n\n  var _useContext = (0, _react.useContext)(_NavContext.default),\n      onSelectFromNav = _useContext.onSelect;\n\n  var emitSelect = (0, _react.useCallback)(function (eventKey, event) {\n    onSelectProp === null || onSelectProp === void 0 ? void 0 : onSelectProp(eventKey, event); // If <Dropdown> is inside <Nav>, also trigger `onSelect` on <Nav>\n\n    onSelectFromNav === null || onSelectFromNav === void 0 ? void 0 : onSelectFromNav(eventKey, event);\n  }, [onSelectProp, onSelectFromNav]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      withClassPrefix = _useClassNames.withClassPrefix,\n      prefix = _useClassNames.prefix;\n\n  var _useClassNames2 = (0, _utils.useClassNames)('dropdown-menu'),\n      withMenuClassPrefix = _useClassNames2.withClassPrefix,\n      mergeMenuClassName = _useClassNames2.merge;\n\n  var _useClassNames3 = (0, _utils.useClassNames)('nav-item'),\n      withNavItemClassPrefix = _useClassNames3.withClassPrefix,\n      mergeNavItemClassNames = _useClassNames3.merge;\n\n  var menuButtonTriggers = (0, _react.useMemo)(function () {\n    if (!trigger) {\n      return undefined;\n    }\n\n    var triggerMap = {\n      hover: 'mouseover',\n      click: 'click',\n      contextMenu: 'contextmenu'\n    };\n\n    if (!Array.isArray(trigger)) {\n      return [triggerMap[trigger]];\n    }\n\n    return trigger.map(function (t) {\n      return triggerMap[t];\n    });\n  }, [trigger]);\n  var parentMenu = (0, _react.useContext)(_MenuContext.default);\n  var sidenav = (0, _react.useContext)(_Sidenav.SidenavContext);\n  var navbar = (0, _react.useContext)(_Navbar.NavbarContext);\n\n  var _useReducer = (0, _react.useReducer)(_DropdownState.reducer, _DropdownState.initialState),\n      items = _useReducer[0].items,\n      dispatch = _useReducer[1];\n\n  var hasSelectedItem = (0, _react.useMemo)(function () {\n    return items.some(function (item) {\n      return item.props.selected;\n    });\n  }, [items]);\n  var dropdownContextValue = (0, _react.useMemo)(function () {\n    return {\n      activeKey: activeKey,\n      onSelect: emitSelect,\n      hasSelectedItem: hasSelectedItem,\n      dispatch: dispatch\n    };\n  }, [activeKey, emitSelect, hasSelectedItem, dispatch]); // Render a disclosure when inside expanded <Sidenav>\n\n  if (sidenav !== null && sidenav !== void 0 && sidenav.expanded) {\n    return /*#__PURE__*/_react.default.createElement(_DropdownContext.default.Provider, {\n      value: dropdownContextValue,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 177,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(_SidenavDropdown.default, (0, _extends2.default)({\n      ref: ref\n    }, rest, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 178,\n        columnNumber: 9\n      }\n    })));\n  } // Renders a disclosure when used inside <Navbar>\n\n\n  if (navbar) {\n    return /*#__PURE__*/_react.default.createElement(_DropdownContext.default.Provider, {\n      value: dropdownContextValue,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 186,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Disclosure.default, {\n      hideOnClickOutside: true,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 187,\n        columnNumber: 9\n      }\n    }, function (_ref, containerRef) {\n      var _withClassPrefix;\n\n      var open = _ref.open;\n      var classes = merge(className, withClassPrefix((_withClassPrefix = {}, _withClassPrefix[\"placement-\" + (0, _kebabCase.default)((0, _utils.placementPolyfill)(placement))] = !!placement, _withClassPrefix.disabled = disabled, _withClassPrefix.open = open, _withClassPrefix)));\n      return /*#__PURE__*/_react.default.createElement(Component, {\n        ref: (0, _utils.mergeRefs)(ref, containerRef),\n        className: classes,\n        style: style,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 199,\n          columnNumber: 15\n        }\n      }, /*#__PURE__*/_react.default.createElement(_Disclosure.default.Button, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 200,\n          columnNumber: 17\n        }\n      }, function (buttonProps, buttonRef) {\n        return /*#__PURE__*/_react.default.createElement(_DropdownToggle.default, (0, _extends2.default)({\n          ref: buttonRef,\n          as: toggleAs,\n          className: toggleClassName,\n          placement: placement,\n          disabled: disabled\n        }, (0, _omit.default)(buttonProps, ['open']), toggleProps, {\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 202,\n            columnNumber: 21\n          }\n        }), title);\n      }), /*#__PURE__*/_react.default.createElement(_Disclosure.default.Content, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 215,\n          columnNumber: 17\n        }\n      }, function (_ref2, elementRef) {\n        var open = _ref2.open;\n        var menuClassName = mergeMenuClassName(className, withMenuClassPrefix());\n        return /*#__PURE__*/_react.default.createElement(\"ul\", {\n          ref: elementRef,\n          className: menuClassName,\n          style: menuStyle,\n          hidden: !open,\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 219,\n            columnNumber: 23\n          }\n        }, children);\n      }));\n    }));\n  }\n\n  var renderMenuButton = function renderMenuButton(menuButtonProps, menuButtonRef) {\n    return /*#__PURE__*/_react.default.createElement(_DropdownToggle.default, (0, _extends2.default)({\n      ref: menuButtonRef,\n      as: toggleAs,\n      className: toggleClassName,\n      placement: placement,\n      disabled: disabled\n    }, (0, _omit.default)(menuButtonProps, ['open']), (0, _omit.default)(toggleProps, ['data-testid']), {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 239,\n        columnNumber: 5\n      }\n    }), title);\n  };\n\n  if (parentMenu) {\n    renderMenuButton = function renderMenuButton(menuButtonProps, buttonRef) {\n      return /*#__PURE__*/_react.default.createElement(_MenuItem.default, {\n        disabled: disabled,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 254,\n          columnNumber: 7\n        }\n      }, function (_ref3, menuitemRef) {\n        var active = _ref3.active,\n            menuitemProps = (0, _objectWithoutPropertiesLoose2.default)(_ref3, [\"active\"]);\n        return /*#__PURE__*/_react.default.createElement(_DropdownToggle.default, (0, _extends2.default)({\n          ref: (0, _utils.mergeRefs)(buttonRef, menuitemRef),\n          as: toggleAs,\n          className: mergeNavItemClassNames(toggleClassName, withNavItemClassPrefix({\n            focus: active\n          }))\n        }, menuButtonProps, (0, _omit.default)(menuitemProps, ['onClick']), (0, _omit.default)(toggleProps, 'data-testid'), {\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 257,\n            columnNumber: 13\n          }\n        }), title);\n      });\n    };\n  }\n\n  return /*#__PURE__*/_react.default.createElement(_DropdownContext.default.Provider, {\n    value: dropdownContextValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 279,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Menu.default, {\n    menuButtonText: title,\n    renderMenuButton: renderMenuButton,\n    openMenuOn: menuButtonTriggers,\n    renderMenuPopup: function renderMenuPopup(_ref4, popupRef) {\n      var open = _ref4.open,\n          popupProps = (0, _objectWithoutPropertiesLoose2.default)(_ref4, [\"open\"]);\n      var menuClassName = mergeMenuClassName(className, withMenuClassPrefix({})); // When inside a collapsed <Sidenav>, render a header in menu\n\n      var showHeader = !!sidenav;\n      return /*#__PURE__*/_react.default.createElement(\"ul\", (0, _extends2.default)({\n        ref: popupRef,\n        className: menuClassName,\n        style: menuStyle,\n        hidden: !open\n      }, popupProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 290,\n          columnNumber: 13\n        }\n      }), showHeader && /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: prefix('header'),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 297,\n          columnNumber: 30\n        }\n      }, title), children);\n    },\n    onToggleMenu: function onToggleMenu(open, event) {\n      onToggle === null || onToggle === void 0 ? void 0 : onToggle(open);\n      sidenav === null || sidenav === void 0 ? void 0 : sidenav.onOpenChange(eventKey, event);\n\n      if (open) {\n        onOpen === null || onOpen === void 0 ? void 0 : onOpen();\n      } else {\n        onClose === null || onClose === void 0 ? void 0 : onClose();\n      }\n    },\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 280,\n      columnNumber: 7\n    }\n  }, function (_ref5, menuContainerRef) {\n    var _withClassPrefix2;\n\n    var open = _ref5.open,\n        menuContainer = (0, _objectWithoutPropertiesLoose2.default)(_ref5, [\"open\"]);\n    var classes = merge(className, withClassPrefix((_withClassPrefix2 = {}, _withClassPrefix2[\"placement-\" + (0, _kebabCase.default)((0, _utils.placementPolyfill)(placement))] = !!placement, _withClassPrefix2.disabled = disabled, _withClassPrefix2.open = open, _withClassPrefix2.submenu = !!parentMenu, _withClassPrefix2['selected-within'] = hasSelectedItem, _withClassPrefix2)));\n    return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n      ref: (0, _utils.mergeRefs)(ref, menuContainerRef),\n      className: classes\n    }, menuContainer, (0, _pick.default)(toggleProps, ['data-testid']), {\n      style: style,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 324,\n        columnNumber: 13\n      }\n    }));\n  }));\n});\n\nDropdown.Item = _DropdownItem.default;\nDropdown.Menu = _DropdownMenu.default;\nDropdown.displayName = 'Dropdown';\nDropdown.propTypes = {\n  activeKey: _propTypes.default.any,\n  classPrefix: _propTypes.default.string,\n  trigger: _propTypes.default.oneOfType([_propTypes.default.array, _propTypes.default.oneOf(['click', 'hover', 'contextMenu'])]),\n  placement: _propTypes.default.oneOf(_utils.PLACEMENT_8),\n  title: _propTypes.default.node,\n  disabled: _propTypes.default.bool,\n  icon: _propTypes.default.node,\n  menuStyle: _propTypes.default.object,\n  className: _propTypes.default.string,\n  toggleClassName: _propTypes.default.string,\n  children: _propTypes.default.node,\n  open: (0, _deprecatePropType.default)(_propTypes.default.bool),\n  eventKey: _propTypes.default.any,\n  as: _propTypes.default.elementType,\n  toggleAs: _propTypes.default.elementType,\n  noCaret: _propTypes.default.bool,\n  style: _propTypes.default.object,\n  onClose: _propTypes.default.func,\n  onOpen: _propTypes.default.func,\n  onToggle: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  onMouseEnter: _propTypes.default.func,\n  onMouseLeave: _propTypes.default.func,\n  onContextMenu: _propTypes.default.func,\n  onClick: _propTypes.default.func,\n  renderToggle: _propTypes.default.func\n};\nvar _default = Dropdown;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Dropdown/Dropdown.tsx?");
 
 /***/ }),
 
@@ -2518,7 +2529,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _Sidenav = __webpack_require__(/*! ../Sidenav/Sidenav */ \"./src/Sidenav/Sidenav.tsx\");\n\nvar _deprecatePropType = _interopRequireDefault(__webpack_require__(/*! ../utils/deprecatePropType */ \"./src/utils/deprecatePropType.ts\"));\n\nvar _MenuItem = _interopRequireDefault(__webpack_require__(/*! ../Menu/MenuItem */ \"./src/Menu/MenuItem.tsx\"));\n\nvar _DropdownContext = _interopRequireDefault(__webpack_require__(/*! ./DropdownContext */ \"./src/Dropdown/DropdownContext.ts\"));\n\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Navbar = __webpack_require__(/*! ../Navbar/Navbar */ \"./src/Navbar/Navbar.tsx\");\n\nvar _SidenavDropdownItem = _interopRequireDefault(__webpack_require__(/*! ../Sidenav/SidenavDropdownItem */ \"./src/Sidenav/SidenavDropdownItem.tsx\"));\n\nvar _DisclosureContext = _interopRequireWildcard(__webpack_require__(/*! ../Disclosure/DisclosureContext */ \"./src/Disclosure/DisclosureContext.ts\"));\n\nvar _SafeAnchor = _interopRequireDefault(__webpack_require__(/*! ../SafeAnchor */ \"./src/SafeAnchor/index.tsx\"));\n\nvar _NavContext = _interopRequireDefault(__webpack_require__(/*! ../Nav/NavContext */ \"./src/Nav/NavContext.ts\"));\n\nvar _useInternalId = _interopRequireDefault(__webpack_require__(/*! ../utils/useInternalId */ \"./src/utils/useInternalId.ts\"));\n\nvar _DropdownState = __webpack_require__(/*! ./DropdownState */ \"./src/Dropdown/DropdownState.ts\");\n\nvar _useRenderDropdownItem = __webpack_require__(/*! ./useRenderDropdownItem */ \"./src/Dropdown/useRenderDropdownItem.tsx\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Dropdown/DropdownItem.tsx\",\n    _this = void 0;\n\n/**\n * The <Dropdown.Item> API\n * When used inside <Sidenav>, renders a <TreeviewItem>\n * Otherwise renders a <MenuItem>\n */\nvar DropdownItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'dropdown-item' : _props$classPrefix,\n      className = props.className,\n      activeProp = props.active,\n      eventKey = props.eventKey,\n      onSelect = props.onSelect,\n      icon = props.icon,\n      _props$as = props.as,\n      Component = _props$as === void 0 ? 'li' : _props$as,\n      divider = props.divider,\n      panel = props.panel,\n      children = props.children,\n      disabled = props.disabled,\n      restProps = (0, _objectWithoutPropertiesLoose2.default)(props, [\"classPrefix\", \"className\", \"active\", \"eventKey\", \"onSelect\", \"icon\", \"as\", \"divider\", \"panel\", \"children\", \"disabled\"]);\n  var internalId = (0, _useInternalId.default)('DropdownItem');\n  var nav = (0, _react.useContext)(_NavContext.default);\n  var dropdown = (0, _react.useContext)(_DropdownContext.default);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      withClassPrefix = _useClassNames.withClassPrefix,\n      prefix = _useClassNames.prefix;\n\n  var handleSelectItem = (0, _react.useCallback)(function (event) {\n    var _dropdown$onSelect;\n\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(eventKey, event);\n    dropdown === null || dropdown === void 0 ? void 0 : (_dropdown$onSelect = dropdown.onSelect) === null || _dropdown$onSelect === void 0 ? void 0 : _dropdown$onSelect.call(dropdown, eventKey, event);\n  }, [onSelect, eventKey, dropdown]);\n  var sidenav = (0, _react.useContext)(_Sidenav.SidenavContext);\n  var navbar = (0, _react.useContext)(_Navbar.NavbarContext);\n  var disclosure = (0, _react.useContext)(_DisclosureContext.default);\n\n  var _ref = disclosure !== null && disclosure !== void 0 ? disclosure : [],\n      dispatchDisclosure = _ref[1];\n\n  var handleClickNavbarDropdownItem = (0, _react.useCallback)(function (event) {\n    dispatchDisclosure === null || dispatchDisclosure === void 0 ? void 0 : dispatchDisclosure({\n      type: _DisclosureContext.DisclosureActionTypes.Hide\n    });\n    handleSelectItem === null || handleSelectItem === void 0 ? void 0 : handleSelectItem(event);\n  }, [dispatchDisclosure, handleSelectItem]);\n  var selected = activeProp || !(0, _isNil.default)(eventKey) && ((0, _utils.shallowEqual)(dropdown === null || dropdown === void 0 ? void 0 : dropdown.activeKey, eventKey) || (0, _utils.shallowEqual)(nav === null || nav === void 0 ? void 0 : nav.activeKey, eventKey));\n  var dispatch = dropdown === null || dropdown === void 0 ? void 0 : dropdown.dispatch;\n  (0, _react.useEffect)(function () {\n    if (dispatch) {\n      dispatch({\n        type: _DropdownState.DropdownActionType.RegisterItem,\n        payload: {\n          id: internalId,\n          props: {\n            selected: selected\n          }\n        }\n      });\n      return function () {\n        dispatch({\n          type: _DropdownState.DropdownActionType.UnregisterItem,\n          payload: {\n            id: internalId\n          }\n        });\n      };\n    }\n  }, [internalId, selected, dispatch]);\n  var renderDropdownItem = (0, _useRenderDropdownItem.useRenderDropdownItem)(Component);\n\n  if (sidenav !== null && sidenav !== void 0 && sidenav.expanded) {\n    return /*#__PURE__*/_react.default.createElement(_SidenavDropdownItem.default, (0, _extends2.default)({\n      ref: ref\n    }, props, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 150,\n        columnNumber: 14\n      }\n    }));\n  }\n\n  if (divider) {\n    return renderDropdownItem((0, _extends2.default)({\n      ref: ref,\n      role: 'separator',\n      className: merge(prefix('divider'), className)\n    }, restProps));\n  }\n\n  if (panel) {\n    return renderDropdownItem((0, _extends2.default)({\n      ref: ref,\n      className: merge(prefix('panel'), className),\n      children: children\n    }, restProps));\n  }\n\n  if (navbar) {\n    var classes = merge(className, withClassPrefix({\n      'with-icon': icon,\n      disabled: disabled,\n      divider: divider,\n      panel: panel,\n      active: selected\n    }));\n    var dataAttributes = {\n      'data-event-key': eventKey\n    };\n\n    if (!(0, _isNil.default)(eventKey) && typeof eventKey !== 'string') {\n      dataAttributes['data-event-key-type'] = typeof eventKey;\n    }\n\n    return /*#__PURE__*/_react.default.createElement(\"li\", {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 190,\n        columnNumber: 9\n      }\n    }, /*#__PURE__*/_react.default.createElement(_SafeAnchor.default, (0, _extends2.default)({\n      ref: ref,\n      className: classes,\n      \"aria-current\": selected || undefined\n    }, dataAttributes, restProps, {\n      as: Component,\n      onClick: (0, _utils.createChainedFunction)(handleClickNavbarDropdownItem, restProps.onClick),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 191,\n        columnNumber: 11\n      }\n    }), icon && /*#__PURE__*/_react.default.cloneElement(icon, {\n      className: prefix('menu-icon')\n    }), children));\n  }\n\n  return /*#__PURE__*/_react.default.createElement(_MenuItem.default, {\n    selected: selected,\n    disabled: disabled,\n    onActivate: handleSelectItem,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 208,\n      columnNumber: 7\n    }\n  }, function (_ref2, menuitemRef) {\n    var selected = _ref2.selected,\n        active = _ref2.active,\n        menuitem = (0, _objectWithoutPropertiesLoose2.default)(_ref2, [\"selected\", \"active\"]);\n    var classes = merge(className, withClassPrefix({\n      'with-icon': icon,\n      active: selected,\n      disabled: disabled,\n      focus: active,\n      divider: divider,\n      panel: panel\n    }));\n    var dataAttributes = {\n      'data-event-key': eventKey\n    };\n\n    if (!(0, _isNil.default)(eventKey) && typeof eventKey !== 'string') {\n      dataAttributes['data-event-key-type'] = typeof eventKey;\n    }\n\n    return renderDropdownItem((0, _extends2.default)({\n      ref: (0, _utils.mergeRefs)(ref, menuitemRef),\n      className: classes\n    }, menuitem, dataAttributes, restProps, {\n      children: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, icon && /*#__PURE__*/_react.default.cloneElement(icon, {\n        className: prefix('menu-icon')\n      }), children)\n    }));\n  });\n});\n\nDropdownItem.displayName = 'Dropdown.Item';\nDropdownItem.propTypes = {\n  as: _propTypes.default.elementType,\n  divider: _propTypes.default.bool,\n  panel: _propTypes.default.bool,\n  trigger: _propTypes.default.oneOfType([_propTypes.default.array, _propTypes.default.oneOf(['click', 'hover'])]),\n  open: (0, _deprecatePropType.default)(_propTypes.default.bool),\n  active: _propTypes.default.bool,\n  disabled: _propTypes.default.bool,\n  pullLeft: (0, _deprecatePropType.default)(_propTypes.default.bool),\n  submenu: _propTypes.default.element,\n  onSelect: _propTypes.default.func,\n  onClick: _propTypes.default.func,\n  icon: _propTypes.default.node,\n  eventKey: _propTypes.default.any,\n  className: _propTypes.default.string,\n  style: _propTypes.default.object,\n  children: _propTypes.default.node,\n  classPrefix: _propTypes.default.string,\n  tabIndex: _propTypes.default.number\n};\nvar _default = DropdownItem;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Dropdown/DropdownItem.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _Sidenav = __webpack_require__(/*! ../Sidenav/Sidenav */ \"./src/Sidenav/Sidenav.tsx\");\n\nvar _deprecatePropType = _interopRequireDefault(__webpack_require__(/*! ../utils/deprecatePropType */ \"./src/utils/deprecatePropType.ts\"));\n\nvar _MenuItem = _interopRequireDefault(__webpack_require__(/*! ../Menu/MenuItem */ \"./src/Menu/MenuItem.tsx\"));\n\nvar _DropdownContext = _interopRequireDefault(__webpack_require__(/*! ./DropdownContext */ \"./src/Dropdown/DropdownContext.ts\"));\n\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Navbar = __webpack_require__(/*! ../Navbar/Navbar */ \"./src/Navbar/Navbar.tsx\");\n\nvar _SidenavDropdownItem = _interopRequireDefault(__webpack_require__(/*! ../Sidenav/SidenavDropdownItem */ \"./src/Sidenav/SidenavDropdownItem.tsx\"));\n\nvar _DisclosureContext = _interopRequireWildcard(__webpack_require__(/*! ../Disclosure/DisclosureContext */ \"./src/Disclosure/DisclosureContext.ts\"));\n\nvar _NavContext = _interopRequireDefault(__webpack_require__(/*! ../Nav/NavContext */ \"./src/Nav/NavContext.ts\"));\n\nvar _useInternalId = _interopRequireDefault(__webpack_require__(/*! ../utils/useInternalId */ \"./src/utils/useInternalId.ts\"));\n\nvar _DropdownState = __webpack_require__(/*! ./DropdownState */ \"./src/Dropdown/DropdownState.ts\");\n\nvar _useRenderDropdownItem = __webpack_require__(/*! ./useRenderDropdownItem */ \"./src/Dropdown/useRenderDropdownItem.tsx\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Dropdown/DropdownItem.tsx\",\n    _this = void 0;\n\n/**\n * The <Dropdown.Item> API\n * When used inside <Sidenav>, renders a <TreeviewItem>\n * Otherwise renders a <MenuItem>\n */\nvar DropdownItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'dropdown-item' : _props$classPrefix,\n      className = props.className,\n      activeProp = props.active,\n      eventKey = props.eventKey,\n      onSelect = props.onSelect,\n      icon = props.icon,\n      _props$as = props.as,\n      Component = _props$as === void 0 ? 'li' : _props$as,\n      divider = props.divider,\n      panel = props.panel,\n      children = props.children,\n      disabled = props.disabled,\n      restProps = (0, _objectWithoutPropertiesLoose2.default)(props, [\"classPrefix\", \"className\", \"active\", \"eventKey\", \"onSelect\", \"icon\", \"as\", \"divider\", \"panel\", \"children\", \"disabled\"]);\n  var internalId = (0, _useInternalId.default)('DropdownItem');\n  var nav = (0, _react.useContext)(_NavContext.default);\n  var dropdown = (0, _react.useContext)(_DropdownContext.default);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      withClassPrefix = _useClassNames.withClassPrefix,\n      prefix = _useClassNames.prefix;\n\n  var handleSelectItem = (0, _react.useCallback)(function (event) {\n    var _dropdown$onSelect;\n\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(eventKey, event);\n    dropdown === null || dropdown === void 0 ? void 0 : (_dropdown$onSelect = dropdown.onSelect) === null || _dropdown$onSelect === void 0 ? void 0 : _dropdown$onSelect.call(dropdown, eventKey, event);\n  }, [onSelect, eventKey, dropdown]);\n  var sidenav = (0, _react.useContext)(_Sidenav.SidenavContext);\n  var navbar = (0, _react.useContext)(_Navbar.NavbarContext);\n  var disclosure = (0, _react.useContext)(_DisclosureContext.default);\n\n  var _ref = disclosure !== null && disclosure !== void 0 ? disclosure : [],\n      dispatchDisclosure = _ref[1];\n\n  var handleClickNavbarDropdownItem = (0, _react.useCallback)(function (event) {\n    dispatchDisclosure === null || dispatchDisclosure === void 0 ? void 0 : dispatchDisclosure({\n      type: _DisclosureContext.DisclosureActionTypes.Hide,\n      cascade: true\n    });\n    handleSelectItem === null || handleSelectItem === void 0 ? void 0 : handleSelectItem(event);\n  }, [dispatchDisclosure, handleSelectItem]);\n  var selected = activeProp || !(0, _isNil.default)(eventKey) && ((0, _utils.shallowEqual)(dropdown === null || dropdown === void 0 ? void 0 : dropdown.activeKey, eventKey) || (0, _utils.shallowEqual)(nav === null || nav === void 0 ? void 0 : nav.activeKey, eventKey));\n  var dispatch = dropdown === null || dropdown === void 0 ? void 0 : dropdown.dispatch;\n  (0, _react.useEffect)(function () {\n    if (dispatch) {\n      dispatch({\n        type: _DropdownState.DropdownActionType.RegisterItem,\n        payload: {\n          id: internalId,\n          props: {\n            selected: selected\n          }\n        }\n      });\n      return function () {\n        dispatch({\n          type: _DropdownState.DropdownActionType.UnregisterItem,\n          payload: {\n            id: internalId\n          }\n        });\n      };\n    }\n  }, [internalId, selected, dispatch]);\n  var renderDropdownItem = (0, _useRenderDropdownItem.useRenderDropdownItem)(Component);\n\n  if (sidenav !== null && sidenav !== void 0 && sidenav.expanded) {\n    return /*#__PURE__*/_react.default.createElement(_SidenavDropdownItem.default, (0, _extends2.default)({\n      ref: ref\n    }, props, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 149,\n        columnNumber: 14\n      }\n    }));\n  }\n\n  if (divider) {\n    return renderDropdownItem((0, _extends2.default)({\n      ref: ref,\n      role: 'separator',\n      className: merge(prefix('divider'), className)\n    }, restProps));\n  }\n\n  if (panel) {\n    return renderDropdownItem((0, _extends2.default)({\n      ref: ref,\n      className: merge(prefix('panel'), className),\n      children: children\n    }, restProps));\n  }\n\n  if (navbar) {\n    var classes = merge(className, withClassPrefix({\n      'with-icon': icon,\n      disabled: disabled,\n      divider: divider,\n      panel: panel,\n      active: selected\n    }));\n    var dataAttributes = {\n      'data-event-key': eventKey\n    };\n\n    if (!(0, _isNil.default)(eventKey) && typeof eventKey !== 'string') {\n      dataAttributes['data-event-key-type'] = typeof eventKey;\n    }\n\n    return renderDropdownItem((0, _extends2.default)({\n      ref: ref,\n      className: classes,\n      'aria-current': selected || undefined\n    }, dataAttributes, restProps, {\n      onClick: (0, _utils.createChainedFunction)(handleClickNavbarDropdownItem, restProps.onClick),\n      children: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, icon && /*#__PURE__*/_react.default.cloneElement(icon, {\n        className: prefix('menu-icon')\n      }), children)\n    }));\n  }\n\n  return /*#__PURE__*/_react.default.createElement(_MenuItem.default, {\n    selected: selected,\n    disabled: disabled,\n    onActivate: handleSelectItem,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 205,\n      columnNumber: 7\n    }\n  }, function (_ref2, menuitemRef) {\n    var selected = _ref2.selected,\n        active = _ref2.active,\n        menuitem = (0, _objectWithoutPropertiesLoose2.default)(_ref2, [\"selected\", \"active\"]);\n    var classes = merge(className, withClassPrefix({\n      'with-icon': icon,\n      active: selected,\n      disabled: disabled,\n      focus: active,\n      divider: divider,\n      panel: panel\n    }));\n    var dataAttributes = {\n      'data-event-key': eventKey\n    };\n\n    if (!(0, _isNil.default)(eventKey) && typeof eventKey !== 'string') {\n      dataAttributes['data-event-key-type'] = typeof eventKey;\n    }\n\n    return renderDropdownItem((0, _extends2.default)({\n      ref: (0, _utils.mergeRefs)(ref, menuitemRef),\n      className: classes\n    }, menuitem, dataAttributes, restProps, {\n      children: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, icon && /*#__PURE__*/_react.default.cloneElement(icon, {\n        className: prefix('menu-icon')\n      }), children)\n    }));\n  });\n});\n\nDropdownItem.displayName = 'Dropdown.Item';\nDropdownItem.propTypes = {\n  as: _propTypes.default.elementType,\n  divider: _propTypes.default.bool,\n  panel: _propTypes.default.bool,\n  trigger: _propTypes.default.oneOfType([_propTypes.default.array, _propTypes.default.oneOf(['click', 'hover'])]),\n  open: (0, _deprecatePropType.default)(_propTypes.default.bool),\n  active: _propTypes.default.bool,\n  disabled: _propTypes.default.bool,\n  pullLeft: (0, _deprecatePropType.default)(_propTypes.default.bool),\n  submenu: _propTypes.default.element,\n  onSelect: _propTypes.default.func,\n  onClick: _propTypes.default.func,\n  icon: _propTypes.default.node,\n  eventKey: _propTypes.default.any,\n  className: _propTypes.default.string,\n  style: _propTypes.default.object,\n  children: _propTypes.default.node,\n  classPrefix: _propTypes.default.string,\n  tabIndex: _propTypes.default.number\n};\nvar _default = DropdownItem;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Dropdown/DropdownItem.tsx?");
 
 /***/ }),
 
@@ -2529,7 +2540,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _omit2 = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\n\nvar _Menu = _interopRequireDefault(__webpack_require__(/*! ../Menu/Menu */ \"./src/Menu/Menu.tsx\"));\n\nvar _MenuItem = _interopRequireDefault(__webpack_require__(/*! ../Menu/MenuItem */ \"./src/Menu/MenuItem.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _Sidenav = __webpack_require__(/*! ../Sidenav/Sidenav */ \"./src/Sidenav/Sidenav.tsx\");\n\nvar _AngleLeft = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/AngleLeft */ \"./node_modules/@rsuite/icons/legacy/AngleLeft.js\"));\n\nvar _AngleRight = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/AngleRight */ \"./node_modules/@rsuite/icons/legacy/AngleRight.js\"));\n\nvar _useCustom2 = _interopRequireDefault(__webpack_require__(/*! ../utils/useCustom */ \"./src/utils/useCustom.ts\"));\n\nvar _DropdownContext = _interopRequireDefault(__webpack_require__(/*! ./DropdownContext */ \"./src/Dropdown/DropdownContext.ts\"));\n\nvar _Menubar = _interopRequireDefault(__webpack_require__(/*! ../Menu/Menubar */ \"./src/Menu/Menubar.tsx\"));\n\nvar _SidenavDropdownMenu = _interopRequireDefault(__webpack_require__(/*! ../Sidenav/SidenavDropdownMenu */ \"./src/Sidenav/SidenavDropdownMenu.tsx\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Dropdown/DropdownMenu.tsx\",\n    _this = void 0,\n    _templateObject,\n    _templateObject2;\n\n/**\n * The <Dropdown.Menu> API\n *\n * @description\n * Note the difference between this component and <Menu> component:\n * <Menu> is used for ARIA menu control logic and is used internally only.\n * This component is only used for supporting submenu syntax and is\n * assigned to Dropdown.Menu\n *\n * @example\n *\n * <Dropdown>\n *   <Dropdown.Item>Item 1</Dropdown.Item>\n *   <Dropdown.Menu title=\"Submenu\">\n *     <Dropdown.Item>Sub item</Dropdown.Item>\n *   </Dropdown.Menu>\n * </Dropdown>\n */\nvar DropdownMenu = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var onToggle = props.onToggle,\n      eventKey = props.eventKey,\n      title = props.title,\n      activeKey = props.activeKey,\n      onSelect = props.onSelect,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'dropdown-menu' : _props$classPrefix,\n      children = props.children,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"onToggle\", \"eventKey\", \"title\", \"activeKey\", \"onSelect\", \"classPrefix\", \"children\"]);\n  var dropdown = (0, _react.useContext)(_DropdownContext.default);\n  var sidenav = (0, _react.useContext)(_Sidenav.SidenavContext);\n\n  var _useCustom = (0, _useCustom2.default)('DropdownMenu'),\n      rtl = _useCustom.rtl;\n\n  var handleToggleSubmenu = (0, _react.useCallback)(function (_, event) {\n    onToggle === null || onToggle === void 0 ? void 0 : onToggle(eventKey, event);\n  }, [eventKey, onToggle]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      prefix = _useClassNames.prefix,\n      withClassPrefix = _useClassNames.withClassPrefix;\n\n  var _useClassNames2 = (0, _utils.useClassNames)('dropdown-menu'),\n      withMenuClassPrefix = _useClassNames2.withClassPrefix,\n      mergeMenuClassName = _useClassNames2.merge;\n\n  var _useClassNames3 = (0, _utils.useClassNames)('dropdown-item'),\n      mergeItemClassNames = _useClassNames3.merge,\n      withItemClassPrefix = _useClassNames3.withClassPrefix,\n      prefixItemClassName = _useClassNames3.prefix; // <Dropdown.Menu> is used outside of <Dropdown>\n  // renders a vertical `menubar`\n\n\n  if (!dropdown) {\n    var classes = merge(props.className, withClassPrefix());\n    return /*#__PURE__*/_react.default.createElement(_DropdownContext.default.Provider, {\n      value: {\n        activeKey: activeKey,\n        onSelect: onSelect\n      },\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 103,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Menubar.default, {\n      vertical: true,\n      onActivateItem: function onActivateItem(event) {\n        var _dataset = event.target.dataset,\n            eventKey = _dataset.eventKey,\n            eventKeyType = _dataset.eventKeyType; // Only cast number type for now\n\n        var eventKeyToEmit = eventKeyType === 'number' ? Number(eventKey) : eventKey;\n        onSelect === null || onSelect === void 0 ? void 0 : onSelect(eventKeyToEmit, event);\n      },\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 104,\n        columnNumber: 9\n      }\n    }, function (menubar, menubarRef) {\n      return /*#__PURE__*/_react.default.createElement(\"ul\", (0, _extends2.default)({\n        ref: (0, _utils.mergeRefs)(menubarRef, ref),\n        className: classes\n      }, menubar, rest, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 115,\n          columnNumber: 13\n        }\n      }), children);\n    }));\n  }\n\n  if (sidenav !== null && sidenav !== void 0 && sidenav.expanded) {\n    return /*#__PURE__*/_react.default.createElement(_SidenavDropdownMenu.default, (0, _extends2.default)({}, (0, _omit2.default)(props, 'classPrefix'), {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 125,\n        columnNumber: 12\n      }\n    }));\n  } // Parent menu exists. This is a submenu.\n  // Should render a `menuitem` that controls this submenu.\n\n\n  var _omit = (0, _omit2.default)(rest, ['trigger']),\n      icon = _omit.icon,\n      className = _omit.className,\n      disabled = _omit.disabled,\n      menuProps = (0, _objectWithoutPropertiesLoose2.default)(_omit, [\"icon\", \"className\", \"disabled\"]);\n\n  var Icon = rtl ? _AngleLeft.default : _AngleRight.default;\n  return /*#__PURE__*/_react.default.createElement(_Menu.default, {\n    openMenuOn: ['mouseover', 'click'],\n    renderMenuButton: function renderMenuButton(_ref, buttonRef) {\n      var open = _ref.open,\n          menuButtonProps = (0, _objectWithoutPropertiesLoose2.default)(_ref, [\"open\"]);\n      return /*#__PURE__*/_react.default.createElement(_MenuItem.default, {\n        disabled: disabled,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 138,\n          columnNumber: 9\n        }\n      }, function (_ref2, menuitemRef) {\n        var selected = _ref2.selected,\n            active = _ref2.active,\n            menuitem = (0, _objectWithoutPropertiesLoose2.default)(_ref2, [\"selected\", \"active\"]);\n        var classes = mergeItemClassNames(className, prefixItemClassName(\"pull-\" + (rtl ? 'left' : 'right')), prefixItemClassName(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)([\"toggle\"]))), // prefixItemClassName`submenu`,\n        withItemClassPrefix({\n          'with-icon': icon,\n          open: open,\n          active: selected,\n          disabled: disabled,\n          focus: active\n        }));\n        return /*#__PURE__*/_react.default.createElement(\"div\", (0, _extends2.default)({\n          ref: (0, _utils.mergeRefs)(buttonRef, menuitemRef),\n          className: classes,\n          \"data-event-key\": eventKey,\n          \"data-event-key-type\": typeof eventKey\n        }, menuitem, (0, _omit2.default)(menuButtonProps, ['role']), {\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 155,\n            columnNumber: 15\n          }\n        }), icon && /*#__PURE__*/_react.default.cloneElement(icon, {\n          className: prefix('menu-icon')\n        }), title, /*#__PURE__*/_react.default.createElement(Icon, {\n          className: prefix(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)([\"toggle-icon\"]))),\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 165,\n            columnNumber: 17\n          }\n        }));\n      });\n    },\n    renderMenuPopup: function renderMenuPopup(_ref3, popupRef) {\n      var open = _ref3.open,\n          popupProps = (0, _objectWithoutPropertiesLoose2.default)(_ref3, [\"open\"]);\n      var menuClassName = mergeMenuClassName(className, withMenuClassPrefix());\n      return /*#__PURE__*/_react.default.createElement(\"ul\", (0, _extends2.default)({\n        ref: popupRef,\n        className: menuClassName,\n        hidden: !open\n      }, popupProps, menuProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 175,\n          columnNumber: 11\n        }\n      }), children);\n    },\n    onToggleMenu: handleToggleSubmenu,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 135,\n      columnNumber: 5\n    }\n  }, function (_ref4, menuContainerRef) {\n    var open = _ref4.open,\n        menuContainer = (0, _objectWithoutPropertiesLoose2.default)(_ref4, [\"open\"]);\n    var classes = mergeItemClassNames(className, withItemClassPrefix({\n      disabled: disabled,\n      open: open,\n      submenu: true // focus: hasFocus\n\n    }));\n    return /*#__PURE__*/_react.default.createElement(\"li\", (0, _extends2.default)({\n      ref: (0, _utils.mergeRefs)(ref, menuContainerRef),\n      className: classes\n    }, menuContainer, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 199,\n        columnNumber: 11\n      }\n    }));\n  });\n});\n\nDropdownMenu.displayName = 'Dropdown.Menu';\nDropdownMenu.propTypes = {\n  active: _propTypes.default.bool,\n  activeKey: _propTypes.default.any,\n  className: _propTypes.default.string,\n  children: _propTypes.default.node,\n  icon: _propTypes.default.any,\n  classPrefix: _propTypes.default.string,\n  pullLeft: _propTypes.default.bool,\n  title: _propTypes.default.node,\n  open: _propTypes.default.bool,\n  trigger: _propTypes.default.oneOf(['click', 'hover']),\n  eventKey: _propTypes.default.any,\n  expanded: _propTypes.default.bool,\n  collapsible: _propTypes.default.bool,\n  onSelect: _propTypes.default.func,\n  onToggle: _propTypes.default.func\n};\nvar _default = DropdownMenu;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Dropdown/DropdownMenu.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _omit2 = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\n\nvar _Menu = _interopRequireDefault(__webpack_require__(/*! ../Menu/Menu */ \"./src/Menu/Menu.tsx\"));\n\nvar _MenuItem = _interopRequireDefault(__webpack_require__(/*! ../Menu/MenuItem */ \"./src/Menu/MenuItem.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _Sidenav = __webpack_require__(/*! ../Sidenav/Sidenav */ \"./src/Sidenav/Sidenav.tsx\");\n\nvar _AngleLeft = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/AngleLeft */ \"./node_modules/@rsuite/icons/legacy/AngleLeft.js\"));\n\nvar _AngleRight = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/AngleRight */ \"./node_modules/@rsuite/icons/legacy/AngleRight.js\"));\n\nvar _useCustom2 = _interopRequireDefault(__webpack_require__(/*! ../utils/useCustom */ \"./src/utils/useCustom.ts\"));\n\nvar _DropdownContext = _interopRequireDefault(__webpack_require__(/*! ./DropdownContext */ \"./src/Dropdown/DropdownContext.ts\"));\n\nvar _Navbar = __webpack_require__(/*! ../Navbar */ \"./src/Navbar/index.tsx\");\n\nvar _Menubar = _interopRequireDefault(__webpack_require__(/*! ../Menu/Menubar */ \"./src/Menu/Menubar.tsx\"));\n\nvar _SidenavDropdownMenu = _interopRequireDefault(__webpack_require__(/*! ../Sidenav/SidenavDropdownMenu */ \"./src/Sidenav/SidenavDropdownMenu.tsx\"));\n\nvar _Disclosure = _interopRequireDefault(__webpack_require__(/*! ../Disclosure */ \"./src/Disclosure/index.tsx\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Dropdown/DropdownMenu.tsx\",\n    _this = void 0,\n    _templateObject,\n    _templateObject2,\n    _templateObject3,\n    _templateObject4;\n\n/**\n * The <Dropdown.Menu> API\n *\n * @description\n * Note the difference between this component and <Menu> component:\n * <Menu> is used for ARIA menu control logic and is used internally only.\n * This component is only used for supporting submenu syntax and is\n * assigned to Dropdown.Menu\n *\n * @example\n *\n * <Dropdown>\n *   <Dropdown.Item>Item 1</Dropdown.Item>\n *   <Dropdown.Menu title=\"Submenu\">\n *     <Dropdown.Item>Sub item</Dropdown.Item>\n *   </Dropdown.Menu>\n * </Dropdown>\n */\nvar DropdownMenu = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var onToggle = props.onToggle,\n      eventKey = props.eventKey,\n      title = props.title,\n      activeKey = props.activeKey,\n      onSelect = props.onSelect,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'dropdown-menu' : _props$classPrefix,\n      children = props.children,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"onToggle\", \"eventKey\", \"title\", \"activeKey\", \"onSelect\", \"classPrefix\", \"children\"]);\n  var dropdown = (0, _react.useContext)(_DropdownContext.default);\n  var sidenav = (0, _react.useContext)(_Sidenav.SidenavContext);\n  var withinNavbar = Boolean((0, _react.useContext)(_Navbar.NavbarContext));\n\n  var _useCustom = (0, _useCustom2.default)('DropdownMenu'),\n      rtl = _useCustom.rtl;\n\n  var handleToggleSubmenu = (0, _react.useCallback)(function (_, event) {\n    onToggle === null || onToggle === void 0 ? void 0 : onToggle(eventKey, event);\n  }, [eventKey, onToggle]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      prefix = _useClassNames.prefix,\n      withClassPrefix = _useClassNames.withClassPrefix;\n\n  var _useClassNames2 = (0, _utils.useClassNames)('dropdown-menu'),\n      withMenuClassPrefix = _useClassNames2.withClassPrefix,\n      mergeMenuClassName = _useClassNames2.merge;\n\n  var _useClassNames3 = (0, _utils.useClassNames)('dropdown-item'),\n      mergeItemClassNames = _useClassNames3.merge,\n      withItemClassPrefix = _useClassNames3.withClassPrefix,\n      prefixItemClassName = _useClassNames3.prefix;\n\n  var contextValue = (0, _react.useMemo)(function () {\n    return {\n      activeKey: activeKey,\n      onSelect: onSelect\n    };\n  }, [activeKey, onSelect]); // <Dropdown.Menu> is used outside of <Dropdown>\n  // renders a vertical `menubar`\n\n  if (!dropdown) {\n    var classes = merge(props.className, withClassPrefix());\n    return /*#__PURE__*/_react.default.createElement(_DropdownContext.default.Provider, {\n      value: contextValue,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 108,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Menubar.default, {\n      vertical: true,\n      onActivateItem: function onActivateItem(event) {\n        var _dataset = event.target.dataset,\n            eventKey = _dataset.eventKey,\n            eventKeyType = _dataset.eventKeyType; // Only cast number type for now\n\n        var eventKeyToEmit = eventKeyType === 'number' ? Number(eventKey) : eventKey;\n        onSelect === null || onSelect === void 0 ? void 0 : onSelect(eventKeyToEmit, event);\n      },\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 109,\n        columnNumber: 9\n      }\n    }, function (menubar, menubarRef) {\n      return /*#__PURE__*/_react.default.createElement(\"ul\", (0, _extends2.default)({\n        ref: (0, _utils.mergeRefs)(menubarRef, ref),\n        className: classes\n      }, menubar, rest, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 120,\n          columnNumber: 13\n        }\n      }), children);\n    }));\n  }\n\n  if (sidenav !== null && sidenav !== void 0 && sidenav.expanded) {\n    return /*#__PURE__*/_react.default.createElement(_SidenavDropdownMenu.default, (0, _extends2.default)({}, (0, _omit2.default)(props, 'classPrefix'), {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 129,\n        columnNumber: 12\n      }\n    }));\n  } // Parent menu exists. This is a submenu.\n  // Should render a `menuitem` that controls this submenu.\n\n\n  var _omit = (0, _omit2.default)(rest, ['trigger']),\n      icon = _omit.icon,\n      className = _omit.className,\n      disabled = _omit.disabled,\n      menuProps = (0, _objectWithoutPropertiesLoose2.default)(_omit, [\"icon\", \"className\", \"disabled\"]);\n\n  var Icon = rtl ? _AngleLeft.default : _AngleRight.default; // Renders a disclosure when used within <Navbar>\n\n  if (withinNavbar) {\n    return /*#__PURE__*/_react.default.createElement(_Disclosure.default, {\n      hideOnClickOutside: true,\n      trigger: ['click', 'mouseover'],\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 141,\n        columnNumber: 7\n      }\n    }, function (_ref, containerRef) {\n      var open = _ref.open,\n          props = (0, _objectWithoutPropertiesLoose2.default)(_ref, [\"open\"]);\n      var classes = mergeItemClassNames(className, withItemClassPrefix({\n        disabled: disabled,\n        open: open,\n        submenu: true // focus: hasFocus\n\n      }));\n      return /*#__PURE__*/_react.default.createElement(\"li\", (0, _extends2.default)({\n        ref: (0, _utils.mergeRefs)(ref, containerRef),\n        className: classes\n      }, props, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 153,\n          columnNumber: 13\n        }\n      }), /*#__PURE__*/_react.default.createElement(_Disclosure.default.Button, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 154,\n          columnNumber: 15\n        }\n      }, function (_ref2, buttonRef) {\n        var open = _ref2.open,\n            buttonProps = (0, _objectWithoutPropertiesLoose2.default)(_ref2, [\"open\"]);\n        var classes = mergeItemClassNames(className, prefixItemClassName(\"pull-\" + (rtl ? 'left' : 'right')), prefixItemClassName(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)([\"toggle\"]))), // prefixItemClassName`submenu`,\n        withItemClassPrefix({\n          'with-icon': icon,\n          open: open,\n          // active: selected,\n          disabled: disabled // focus: active\n\n        }));\n        return /*#__PURE__*/_react.default.createElement(\"div\", (0, _extends2.default)({\n          ref: (0, _utils.mergeRefs)(buttonRef, buttonRef),\n          className: classes,\n          \"data-event-key\": eventKey,\n          \"data-event-key-type\": typeof eventKey\n        }, buttonProps, {\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 171,\n            columnNumber: 21\n          }\n        }), icon && /*#__PURE__*/_react.default.cloneElement(icon, {\n          className: prefix('menu-icon')\n        }), title, /*#__PURE__*/_react.default.createElement(Icon, {\n          className: prefix(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)([\"toggle-icon\"]))),\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 180,\n            columnNumber: 23\n          }\n        }));\n      }), /*#__PURE__*/_react.default.createElement(_Disclosure.default.Content, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 185,\n          columnNumber: 15\n        }\n      }, function (_ref3, elementRef) {\n        var open = _ref3.open;\n        var menuClassName = mergeMenuClassName(className, withMenuClassPrefix());\n        return /*#__PURE__*/_react.default.createElement(\"ul\", (0, _extends2.default)({\n          ref: elementRef,\n          className: menuClassName,\n          hidden: !open\n        }, menuProps, {\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 190,\n            columnNumber: 21\n          }\n        }), children);\n      }));\n    });\n  }\n\n  return /*#__PURE__*/_react.default.createElement(_Menu.default, {\n    openMenuOn: ['mouseover', 'click'],\n    renderMenuButton: function renderMenuButton(_ref4, buttonRef) {\n      var open = _ref4.open,\n          menuButtonProps = (0, _objectWithoutPropertiesLoose2.default)(_ref4, [\"open\"]);\n      return /*#__PURE__*/_react.default.createElement(_MenuItem.default, {\n        disabled: disabled,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 212,\n          columnNumber: 9\n        }\n      }, function (_ref5, menuitemRef) {\n        var selected = _ref5.selected,\n            active = _ref5.active,\n            menuitem = (0, _objectWithoutPropertiesLoose2.default)(_ref5, [\"selected\", \"active\"]);\n        var classes = mergeItemClassNames(className, prefixItemClassName(\"pull-\" + (rtl ? 'left' : 'right')), prefixItemClassName(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)([\"toggle\"]))), // prefixItemClassName`submenu`,\n        withItemClassPrefix({\n          'with-icon': icon,\n          open: open,\n          active: selected,\n          disabled: disabled,\n          focus: active\n        }));\n        return /*#__PURE__*/_react.default.createElement(\"div\", (0, _extends2.default)({\n          ref: (0, _utils.mergeRefs)(buttonRef, menuitemRef),\n          className: classes,\n          \"data-event-key\": eventKey,\n          \"data-event-key-type\": typeof eventKey\n        }, menuitem, (0, _omit2.default)(menuButtonProps, ['role']), {\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 229,\n            columnNumber: 15\n          }\n        }), icon && /*#__PURE__*/_react.default.cloneElement(icon, {\n          className: prefix('menu-icon')\n        }), title, /*#__PURE__*/_react.default.createElement(Icon, {\n          className: prefix(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)([\"toggle-icon\"]))),\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 239,\n            columnNumber: 17\n          }\n        }));\n      });\n    },\n    renderMenuPopup: function renderMenuPopup(_ref6, popupRef) {\n      var open = _ref6.open,\n          popupProps = (0, _objectWithoutPropertiesLoose2.default)(_ref6, [\"open\"]);\n      var menuClassName = mergeMenuClassName(className, withMenuClassPrefix());\n      return /*#__PURE__*/_react.default.createElement(\"ul\", (0, _extends2.default)({\n        ref: popupRef,\n        className: menuClassName,\n        hidden: !open\n      }, popupProps, menuProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 249,\n          columnNumber: 11\n        }\n      }), children);\n    },\n    onToggleMenu: handleToggleSubmenu,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 209,\n      columnNumber: 5\n    }\n  }, function (_ref7, menuContainerRef) {\n    var open = _ref7.open,\n        menuContainer = (0, _objectWithoutPropertiesLoose2.default)(_ref7, [\"open\"]);\n    var classes = mergeItemClassNames(className, withItemClassPrefix({\n      disabled: disabled,\n      open: open,\n      submenu: true // focus: hasFocus\n\n    }));\n    return /*#__PURE__*/_react.default.createElement(\"li\", (0, _extends2.default)({\n      ref: (0, _utils.mergeRefs)(ref, menuContainerRef),\n      className: classes\n    }, menuContainer, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 273,\n        columnNumber: 11\n      }\n    }));\n  });\n});\n\nDropdownMenu.displayName = 'Dropdown.Menu';\nDropdownMenu.propTypes = {\n  active: _propTypes.default.bool,\n  activeKey: _propTypes.default.any,\n  className: _propTypes.default.string,\n  children: _propTypes.default.node,\n  icon: _propTypes.default.any,\n  classPrefix: _propTypes.default.string,\n  pullLeft: _propTypes.default.bool,\n  title: _propTypes.default.node,\n  open: _propTypes.default.bool,\n  trigger: _propTypes.default.oneOf(['click', 'hover']),\n  eventKey: _propTypes.default.any,\n  expanded: _propTypes.default.bool,\n  collapsible: _propTypes.default.bool,\n  onSelect: _propTypes.default.func,\n  onToggle: _propTypes.default.func\n};\nvar _default = DropdownMenu;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Dropdown/DropdownMenu.tsx?");
 
 /***/ }),
 
@@ -2551,7 +2562,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _Button = _interopRequireDefault(__webpack_require__(/*! ../Button */ \"./src/Button/index.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _useToggleCaret = _interopRequireDefault(__webpack_require__(/*! ../utils/useToggleCaret */ \"./src/utils/useToggleCaret.tsx\"));\n\nvar _Sidenav = __webpack_require__(/*! ../Sidenav/Sidenav */ \"./src/Sidenav/Sidenav.tsx\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Dropdown/DropdownToggle.tsx\",\n    _this = void 0;\n\nvar DropdownToggle = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? _Button.default : _props$as,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'dropdown-toggle' : _props$classPrefix,\n      renderToggle = props.renderToggle,\n      children = props.children,\n      icon = props.icon,\n      noCaret = props.noCaret,\n      _props$placement = props.placement,\n      placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\", \"renderToggle\", \"children\", \"icon\", \"noCaret\", \"placement\"]);\n  var sidenav = (0, _react.useContext)(_Sidenav.SidenavContext);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      prefix = _useClassNames.prefix,\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var classes = merge(className, withClassPrefix({\n    'no-caret': noCaret\n  }));\n  var inSidenav = !!sidenav; // Caret icon is down by default, when Dropdown is used in Sidenav.\n\n  var Caret = (0, _useToggleCaret.default)(inSidenav ? 'bottomStart' : placement);\n\n  var toggle = /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: ref,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 41,\n      columnNumber: 7\n    }\n  }), icon && /*#__PURE__*/_react.default.cloneElement(icon, {\n    className: prefix('icon')\n  }), children, noCaret ? null : /*#__PURE__*/_react.default.createElement(Caret, {\n    className: prefix('caret'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 47,\n      columnNumber: 27\n    }\n  }));\n\n  return renderToggle ? renderToggle(rest, ref) : toggle;\n});\n\nDropdownToggle.displayName = 'DropdownToggle';\nDropdownToggle.propTypes = {\n  className: _propTypes.default.string,\n  children: _propTypes.default.node,\n  icon: _propTypes.default.node,\n  classPrefix: _propTypes.default.string,\n  noCaret: _propTypes.default.bool,\n  as: _propTypes.default.elementType,\n  renderToggle: _propTypes.default.func,\n  placement: _propTypes.default.oneOf(['bottomStart', 'bottomEnd', 'topStart', 'topEnd', 'leftStart', 'rightStart', 'leftEnd', 'rightEnd'])\n};\nvar _default = DropdownToggle;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Dropdown/DropdownToggle.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _Button = _interopRequireDefault(__webpack_require__(/*! ../Button */ \"./src/Button/index.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _useToggleCaret = _interopRequireDefault(__webpack_require__(/*! ../utils/useToggleCaret */ \"./src/utils/useToggleCaret.tsx\"));\n\nvar _Sidenav = __webpack_require__(/*! ../Sidenav/Sidenav */ \"./src/Sidenav/Sidenav.tsx\");\n\nvar _NavContext = _interopRequireDefault(__webpack_require__(/*! ../Nav/NavContext */ \"./src/Nav/NavContext.ts\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Dropdown/DropdownToggle.tsx\",\n    _this = void 0;\n\nvar DropdownToggle = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? _Button.default : _props$as,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'dropdown-toggle' : _props$classPrefix,\n      renderToggle = props.renderToggle,\n      children = props.children,\n      icon = props.icon,\n      noCaret = props.noCaret,\n      _props$placement = props.placement,\n      placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\", \"renderToggle\", \"children\", \"icon\", \"noCaret\", \"placement\"]);\n  var sidenav = (0, _react.useContext)(_Sidenav.SidenavContext);\n\n  var _useContext = (0, _react.useContext)(_NavContext.default),\n      withinNav = _useContext.withinNav;\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      prefix = _useClassNames.prefix,\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var classes = merge(className, withClassPrefix({\n    'no-caret': noCaret\n  }));\n  var inSidenav = !!sidenav; // Caret icon is down by default, when Dropdown is used in Sidenav.\n\n  var Caret = (0, _useToggleCaret.default)(inSidenav ? 'bottomStart' : placement);\n\n  var toggle = /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n    appearance: withinNav ? 'subtle' : undefined\n  }, rest, {\n    ref: ref,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 43,\n      columnNumber: 7\n    }\n  }), icon && /*#__PURE__*/_react.default.cloneElement(icon, {\n    className: prefix('icon')\n  }), children, noCaret ? null : /*#__PURE__*/_react.default.createElement(Caret, {\n    className: prefix('caret'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 54,\n      columnNumber: 27\n    }\n  }));\n\n  return renderToggle ? renderToggle(rest, ref) : toggle;\n});\n\nDropdownToggle.displayName = 'DropdownToggle';\nDropdownToggle.propTypes = {\n  className: _propTypes.default.string,\n  children: _propTypes.default.node,\n  icon: _propTypes.default.node,\n  classPrefix: _propTypes.default.string,\n  noCaret: _propTypes.default.bool,\n  as: _propTypes.default.elementType,\n  renderToggle: _propTypes.default.func,\n  placement: _propTypes.default.oneOf(['bottomStart', 'bottomEnd', 'topStart', 'topEnd', 'leftStart', 'rightStart', 'leftEnd', 'rightEnd'])\n};\nvar _default = DropdownToggle;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Dropdown/DropdownToggle.tsx?");
 
 /***/ }),
 
@@ -2738,7 +2749,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = exports.FormGroupContext = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/FormGroup/FormGroup.tsx\",\n    _this = void 0;\n\nvar FormGroupContext = /*#__PURE__*/_react.default.createContext({});\n\nexports.FormGroupContext = FormGroupContext;\n\nvar FormGroup = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'form-group' : _props$classPrefix,\n      controlId = props.controlId,\n      className = props.className,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"controlId\", \"className\"]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var classes = merge(className, withClassPrefix());\n  return /*#__PURE__*/_react.default.createElement(FormGroupContext.Provider, {\n    value: {\n      controlId: controlId\n    },\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 30,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: ref,\n    className: classes,\n    role: \"group\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 31,\n      columnNumber: 9\n    }\n  })));\n});\n\nFormGroup.displayName = 'FormGroup';\nFormGroup.propTypes = {\n  controlId: _propTypes.default.string,\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string\n};\nvar _default = FormGroup;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/FormGroup/FormGroup.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = exports.FormGroupContext = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/FormGroup/FormGroup.tsx\",\n    _this = void 0;\n\nvar FormGroupContext = /*#__PURE__*/_react.default.createContext({});\n\nexports.FormGroupContext = FormGroupContext;\n\nvar FormGroup = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'form-group' : _props$classPrefix,\n      controlId = props.controlId,\n      className = props.className,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"controlId\", \"className\"]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var classes = merge(className, withClassPrefix());\n  var contextValue = (0, _react.useMemo)(function () {\n    return {\n      controlId: controlId\n    };\n  }, [controlId]);\n  return /*#__PURE__*/_react.default.createElement(FormGroupContext.Provider, {\n    value: contextValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 31,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: ref,\n    className: classes,\n    role: \"group\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 32,\n      columnNumber: 9\n    }\n  })));\n});\n\nFormGroup.displayName = 'FormGroup';\nFormGroup.propTypes = {\n  controlId: _propTypes.default.string,\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string\n};\nvar _default = FormGroup;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/FormGroup/FormGroup.tsx?");
 
 /***/ }),
 
@@ -3189,7 +3200,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _react = __webpack_require__(/*! react */ \"react\");\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\n\nvar _useUniqueId = _interopRequireDefault(__webpack_require__(/*! ../utils/useUniqueId */ \"./src/utils/useUniqueId.ts\"));\n\nvar _MenuContext = _interopRequireWildcard(__webpack_require__(/*! ./MenuContext */ \"./src/Menu/MenuContext.ts\"));\n\n/**\n * Headless ARIA `menuitem`\n */\nfunction MenuItem(props) {\n  var children = props.children,\n      _props$selected = props.selected,\n      selected = _props$selected === void 0 ? false : _props$selected,\n      _props$disabled = props.disabled,\n      disabled = _props$disabled === void 0 ? false : _props$disabled,\n      onActivate = props.onActivate;\n  var menuitemRef = (0, _react.useRef)(null);\n  var menuitemId = (0, _useUniqueId.default)('menuitem-');\n  var menu = (0, _react.useContext)(_MenuContext.default);\n\n  if (!menu) {\n    throw new Error('<MenuItem> must be rendered within a <Menu>');\n  }\n\n  var menuState = menu[0],\n      dispatch = menu[1]; // Whether this menuitem has focus (indicated by `aria-activedescendant` from parent menu)\n\n  var hasFocus = !(0, _isNil.default)(menuitemRef.current) && !(0, _isNil.default)(menuState.activeItemIndex) && menuState.items[menuState.activeItemIndex].element === menuitemRef.current;\n  var handleClick = (0, _react.useCallback)(function (event) {\n    if (disabled) {\n      return;\n    }\n\n    onActivate === null || onActivate === void 0 ? void 0 : onActivate(event);\n  }, [disabled, onActivate]); // Gain/release focus on mousedown in `menubar`\n\n  var handleMouseDown = (0, _react.useCallback)(function () {\n    if (!(0, _isNil.default)(menuitemRef.current) && !hasFocus) {\n      dispatch({\n        type: _MenuContext.MenuActionTypes.MoveFocus,\n        to: _MenuContext.MoveFocusTo.Specific,\n        id: menuitemRef.current.id\n      });\n    }\n  }, [dispatch]); // Gain/release focus on mouseenter/mouseleave in `menu`\n\n  var handleMouseMove = (0, _react.useCallback)(function () {\n    if (!(0, _isNil.default)(menuitemRef.current) && !hasFocus) {\n      dispatch({\n        type: _MenuContext.MenuActionTypes.MoveFocus,\n        to: _MenuContext.MoveFocusTo.Specific,\n        id: menuitemRef.current.id\n      });\n    }\n  }, [hasFocus, dispatch]);\n  var handleMouseLeave = (0, _react.useCallback)(function () {\n    dispatch({\n      type: _MenuContext.MenuActionTypes.MoveFocus,\n      to: _MenuContext.MoveFocusTo.None\n    });\n  }, [dispatch]);\n  (0, _react.useEffect)(function () {\n    var menuitemElement = menuitemRef.current;\n    dispatch({\n      type: _MenuContext.MenuActionTypes.RegisterItem,\n      element: menuitemElement,\n      props: {\n        disabled: disabled\n      }\n    });\n    return function () {\n      dispatch({\n        type: _MenuContext.MenuActionTypes.UnregisterItem,\n        id: menuitemElement.id\n      });\n    };\n  }, [menuitemRef, disabled, dispatch]);\n  var menuitemProps = {\n    id: menuitemId,\n    role: 'menuitem',\n    // fixme Only use `aria-checked` on menuitemradio and menuitemcheckbox\n    'aria-checked': selected || undefined,\n    'aria-disabled': disabled,\n    tabIndex: -1,\n    onClick: handleClick,\n    // render props\n    selected: selected,\n    active: hasFocus\n  }; // Only move focus on hover in a `menu`, not `menubar`\n\n  if ((menuState === null || menuState === void 0 ? void 0 : menuState.role) === 'menu') {\n    menuitemProps.onMouseMove = handleMouseMove;\n    menuitemProps.onMouseLeave = handleMouseLeave;\n  }\n\n  if ((menuState === null || menuState === void 0 ? void 0 : menuState.role) === 'menubar') {\n    menuitemProps.onMouseDown = handleMouseDown;\n  }\n\n  return children(menuitemProps, menuitemRef);\n}\n\nMenuItem.displayName = 'MenuItem';\nMenuItem.propTypes = {\n  selected: _propTypes.default.bool,\n  disabled: _propTypes.default.bool,\n  children: _propTypes.default.func.isRequired,\n  onActivate: _propTypes.default.func\n};\nvar _default = MenuItem;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Menu/MenuItem.tsx?");
+eval("\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _react = __webpack_require__(/*! react */ \"react\");\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\n\nvar _useUniqueId = _interopRequireDefault(__webpack_require__(/*! ../utils/useUniqueId */ \"./src/utils/useUniqueId.ts\"));\n\nvar _MenuContext = _interopRequireWildcard(__webpack_require__(/*! ./MenuContext */ \"./src/Menu/MenuContext.ts\"));\n\n/**\n * Headless ARIA `menuitem`\n */\nfunction MenuItem(props) {\n  var children = props.children,\n      _props$selected = props.selected,\n      selected = _props$selected === void 0 ? false : _props$selected,\n      _props$disabled = props.disabled,\n      disabled = _props$disabled === void 0 ? false : _props$disabled,\n      onActivate = props.onActivate;\n  var menuitemRef = (0, _react.useRef)(null);\n  var menuitemId = (0, _useUniqueId.default)('menuitem-');\n  var menu = (0, _react.useContext)(_MenuContext.default);\n\n  if (!menu) {\n    throw new Error('<MenuItem> must be rendered within a <Menu>');\n  }\n\n  var menuState = menu[0],\n      dispatch = menu[1]; // Whether this menuitem has focus (indicated by `aria-activedescendant` from parent menu)\n\n  var hasFocus = !(0, _isNil.default)(menuitemRef.current) && !(0, _isNil.default)(menuState.activeItemIndex) && menuState.items[menuState.activeItemIndex].element === menuitemRef.current;\n  var handleClick = (0, _react.useCallback)(function (event) {\n    if (disabled) {\n      return;\n    }\n\n    onActivate === null || onActivate === void 0 ? void 0 : onActivate(event);\n  }, [disabled, onActivate]); // Gain/release focus on mousedown in `menubar`\n\n  var handleMouseDown = (0, _react.useCallback)(function () {\n    if (!(0, _isNil.default)(menuitemRef.current) && !hasFocus) {\n      dispatch({\n        type: _MenuContext.MenuActionTypes.MoveFocus,\n        to: _MenuContext.MoveFocusTo.Specific,\n        id: menuitemRef.current.id\n      });\n    }\n  }, [dispatch, hasFocus]); // Gain/release focus on mouseenter/mouseleave in `menu`\n\n  var handleMouseMove = (0, _react.useCallback)(function () {\n    if (!(0, _isNil.default)(menuitemRef.current) && !hasFocus) {\n      dispatch({\n        type: _MenuContext.MenuActionTypes.MoveFocus,\n        to: _MenuContext.MoveFocusTo.Specific,\n        id: menuitemRef.current.id\n      });\n    }\n  }, [hasFocus, dispatch]);\n  var handleMouseLeave = (0, _react.useCallback)(function () {\n    dispatch({\n      type: _MenuContext.MenuActionTypes.MoveFocus,\n      to: _MenuContext.MoveFocusTo.None\n    });\n  }, [dispatch]);\n  (0, _react.useEffect)(function () {\n    var menuitemElement = menuitemRef.current;\n    dispatch({\n      type: _MenuContext.MenuActionTypes.RegisterItem,\n      element: menuitemElement,\n      props: {\n        disabled: disabled\n      }\n    });\n    return function () {\n      dispatch({\n        type: _MenuContext.MenuActionTypes.UnregisterItem,\n        id: menuitemElement.id\n      });\n    };\n  }, [menuitemRef, disabled, dispatch]);\n  var menuitemProps = {\n    id: menuitemId,\n    role: 'menuitem',\n    // fixme Only use `aria-checked` on menuitemradio and menuitemcheckbox\n    'aria-checked': selected || undefined,\n    'aria-disabled': disabled,\n    tabIndex: -1,\n    onClick: handleClick,\n    // render props\n    selected: selected,\n    active: hasFocus\n  }; // Only move focus on hover in a `menu`, not `menubar`\n\n  if ((menuState === null || menuState === void 0 ? void 0 : menuState.role) === 'menu') {\n    menuitemProps.onMouseMove = handleMouseMove;\n    menuitemProps.onMouseLeave = handleMouseLeave;\n  }\n\n  if ((menuState === null || menuState === void 0 ? void 0 : menuState.role) === 'menubar') {\n    menuitemProps.onMouseDown = handleMouseDown;\n  }\n\n  return children(menuitemProps, menuitemRef);\n}\n\nMenuItem.displayName = 'MenuItem';\nMenuItem.propTypes = {\n  selected: _propTypes.default.bool,\n  disabled: _propTypes.default.bool,\n  children: _propTypes.default.func.isRequired,\n  onActivate: _propTypes.default.func\n};\nvar _default = MenuItem;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Menu/MenuItem.tsx?");
 
 /***/ }),
 
@@ -3244,7 +3255,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\n\nvar _on = _interopRequireDefault(__webpack_require__(/*! dom-lib/on */ \"./node_modules/dom-lib/esm/on.js\"));\n\nvar _getAnimationEnd = _interopRequireDefault(__webpack_require__(/*! dom-lib/getAnimationEnd */ \"./node_modules/dom-lib/esm/getAnimationEnd.js\"));\n\nvar _Modal = _interopRequireWildcard(__webpack_require__(/*! ../Overlay/Modal */ \"./src/Overlay/Modal.tsx\"));\n\nvar _Bounce = _interopRequireDefault(__webpack_require__(/*! ../Animation/Bounce */ \"./src/Animation/Bounce.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _ModalDialog = _interopRequireWildcard(__webpack_require__(/*! ./ModalDialog */ \"./src/Modal/ModalDialog.tsx\"));\n\nvar _ModalContext = __webpack_require__(/*! ./ModalContext */ \"./src/Modal/ModalContext.ts\");\n\nvar _ModalBody = _interopRequireDefault(__webpack_require__(/*! ./ModalBody */ \"./src/Modal/ModalBody.tsx\"));\n\nvar _ModalHeader = _interopRequireDefault(__webpack_require__(/*! ./ModalHeader */ \"./src/Modal/ModalHeader.tsx\"));\n\nvar _ModalTitle = _interopRequireDefault(__webpack_require__(/*! ./ModalTitle */ \"./src/Modal/ModalTitle.tsx\"));\n\nvar _ModalFooter = _interopRequireDefault(__webpack_require__(/*! ./ModalFooter */ \"./src/Modal/ModalFooter.tsx\"));\n\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/Modal/utils.ts\");\n\nvar _useUniqueId = _interopRequireDefault(__webpack_require__(/*! ../utils/useUniqueId */ \"./src/utils/useUniqueId.ts\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Modal/Modal.tsx\",\n    _this = void 0,\n    _templateObject,\n    _templateObject2;\n\nvar Modal = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var className = props.className,\n      children = props.children,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'modal' : _props$classPrefix,\n      dialogClassName = props.dialogClassName,\n      backdropClassName = props.backdropClassName,\n      _props$backdrop = props.backdrop,\n      backdrop = _props$backdrop === void 0 ? true : _props$backdrop,\n      dialogStyle = props.dialogStyle,\n      _props$animation = props.animation,\n      animation = _props$animation === void 0 ? _Bounce.default : _props$animation,\n      open = props.open,\n      _props$size = props.size,\n      size = _props$size === void 0 ? 'sm' : _props$size,\n      full = props.full,\n      _props$dialogAs = props.dialogAs,\n      Dialog = _props$dialogAs === void 0 ? _ModalDialog.default : _props$dialogAs,\n      animationProps = props.animationProps,\n      _props$animationTimeo = props.animationTimeout,\n      animationTimeout = _props$animationTimeo === void 0 ? 300 : _props$animationTimeo,\n      _props$overflow = props.overflow,\n      overflow = _props$overflow === void 0 ? true : _props$overflow,\n      _props$drawer = props.drawer,\n      drawer = _props$drawer === void 0 ? false : _props$drawer,\n      onClose = props.onClose,\n      onEntered = props.onEntered,\n      onEntering = props.onEntering,\n      onExited = props.onExited,\n      _props$role = props.role,\n      role = _props$role === void 0 ? 'dialog' : _props$role,\n      idProp = props.id,\n      ariaLabelledby = props['aria-labelledby'],\n      ariaDescribedby = props['aria-describedby'],\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"className\", \"children\", \"classPrefix\", \"dialogClassName\", \"backdropClassName\", \"backdrop\", \"dialogStyle\", \"animation\", \"open\", \"size\", \"full\", \"dialogAs\", \"animationProps\", \"animationTimeout\", \"overflow\", \"drawer\", \"onClose\", \"onEntered\", \"onEntering\", \"onExited\", \"role\", \"id\", \"aria-labelledby\", \"aria-describedby\"]);\n  var inClass = {\n    in: open && !animation\n  };\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      prefix = _useClassNames.prefix;\n\n  var classes = merge(className, prefix(size, {\n    full: full\n  }));\n  var dialogRef = (0, _react.useRef)(null);\n  var transitionEndListener = (0, _react.useRef)(); // The style of the Modal body will be updated with the size of the window or container.\n\n  var _useBodyStyles = (0, _utils2.useBodyStyles)(dialogRef, {\n    overflow: overflow,\n    drawer: drawer,\n    prefix: prefix\n  }),\n      bodyStyles = _useBodyStyles[0],\n      onChangeBodyStyles = _useBodyStyles[1],\n      onDestroyEvents = _useBodyStyles[2];\n\n  var dialogId = (0, _useUniqueId.default)('dialog-', idProp);\n  var modalContextValue = (0, _react.useMemo)(function () {\n    return {\n      dialogId: dialogId,\n      onModalClose: onClose,\n      getBodyStyles: function getBodyStyles() {\n        return bodyStyles;\n      },\n      isDrawer: drawer\n    };\n  }, [dialogId, onClose, bodyStyles, drawer]);\n\n  var _useState = (0, _react.useState)(false),\n      shake = _useState[0],\n      setShake = _useState[1];\n\n  var handleBackdropClick = (0, _react.useCallback)(function () {\n    // When the value of `backdrop` is `static`, a jitter animation will be added to the dialog when clicked.\n    if (backdrop === 'static') {\n      setShake(true);\n\n      if (!transitionEndListener.current && dialogRef.current) {\n        //fix: https://github.com/rsuite/rsuite/blob/a93d13c14fb20cc58204babe3331d3c3da3fe1fd/src/Modal/styles/index.less#L59\n        transitionEndListener.current = (0, _on.default)(dialogRef.current, (0, _getAnimationEnd.default)(), function () {\n          setShake(false);\n        });\n      }\n    }\n  }, [backdrop]);\n  var handleExited = (0, _react.useCallback)(function (node) {\n    var _transitionEndListene;\n\n    onExited === null || onExited === void 0 ? void 0 : onExited(node);\n    onDestroyEvents();\n    (_transitionEndListene = transitionEndListener.current) === null || _transitionEndListene === void 0 ? void 0 : _transitionEndListene.off();\n    transitionEndListener.current = null;\n  }, [onDestroyEvents, onExited]);\n  var handleEntered = (0, _react.useCallback)(function (node) {\n    onEntered === null || onEntered === void 0 ? void 0 : onEntered(node);\n    onChangeBodyStyles();\n  }, [onChangeBodyStyles, onEntered]);\n  var handleEntering = (0, _react.useCallback)(function (node) {\n    onEntering === null || onEntering === void 0 ? void 0 : onEntering(node);\n    onChangeBodyStyles(true);\n  }, [onChangeBodyStyles, onEntering]);\n  (0, _react.useEffect)(function () {\n    var _transitionEndListene2;\n\n    (_transitionEndListene2 = transitionEndListener.current) === null || _transitionEndListene2 === void 0 ? void 0 : _transitionEndListene2.off();\n  }, []);\n  return /*#__PURE__*/_react.default.createElement(_ModalContext.ModalContext.Provider, {\n    value: modalContextValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 149,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Modal.default, (0, _extends2.default)({}, rest, {\n    ref: ref,\n    backdrop: backdrop,\n    open: open,\n    onClose: onClose,\n    onBackdropClick: handleBackdropClick,\n    className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)([\"wrapper\"]))),\n    onEntered: handleEntered,\n    onEntering: handleEntering,\n    onExited: handleExited,\n    backdropClassName: merge(prefix(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)([\"backdrop\"]))), backdropClassName, inClass),\n    containerClassName: prefix({\n      open: open,\n      'has-backdrop': backdrop\n    }),\n    transition: animation ? animation : undefined,\n    animationProps: animationProps,\n    dialogTransitionTimeout: animationTimeout,\n    backdropTransitionTimeout: 150,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 150,\n      columnNumber: 7\n    }\n  }), function (transitionProps, transitionRef) {\n    var transitionClassName = transitionProps.className,\n        transitionRest = (0, _objectWithoutPropertiesLoose2.default)(transitionProps, [\"className\"]);\n    return /*#__PURE__*/_react.default.createElement(Dialog, (0, _extends2.default)({\n      role: role,\n      id: dialogId,\n      \"aria-labelledby\": ariaLabelledby !== null && ariaLabelledby !== void 0 ? ariaLabelledby : dialogId + \"-title\",\n      \"aria-describedby\": ariaDescribedby\n    }, transitionRest, (0, _pick.default)(rest, Object.keys(_ModalDialog.modalDialogPropTypes)), {\n      ref: (0, _utils.mergeRefs)(dialogRef, transitionRef),\n      classPrefix: classPrefix,\n      className: merge(classes, transitionClassName, prefix({\n        shake: shake\n      })),\n      dialogClassName: dialogClassName,\n      dialogStyle: dialogStyle,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 171,\n        columnNumber: 13\n      }\n    }), children);\n  }));\n});\n\nModal.Body = _ModalBody.default;\nModal.Header = _ModalHeader.default;\nModal.Title = _ModalTitle.default;\nModal.Footer = _ModalFooter.default;\nModal.Dialog = _ModalDialog.default;\nModal.displayName = 'Modal';\nModal.propTypes = (0, _extends2.default)({}, _Modal.modalPropTypes, {\n  animation: _propTypes.default.any,\n  animationTimeout: _propTypes.default.number,\n  classPrefix: _propTypes.default.string,\n  dialogClassName: _propTypes.default.string,\n  size: _propTypes.default.oneOf(_utils.SIZE),\n  dialogStyle: _propTypes.default.object,\n  dialogAs: _propTypes.default.elementType,\n  full: _propTypes.default.bool,\n  overflow: _propTypes.default.bool,\n  drawer: _propTypes.default.bool\n});\nvar _default = Modal;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Modal/Modal.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\n\nvar _on = _interopRequireDefault(__webpack_require__(/*! dom-lib/on */ \"./node_modules/dom-lib/esm/on.js\"));\n\nvar _getAnimationEnd = _interopRequireDefault(__webpack_require__(/*! dom-lib/getAnimationEnd */ \"./node_modules/dom-lib/esm/getAnimationEnd.js\"));\n\nvar _Modal = _interopRequireWildcard(__webpack_require__(/*! ../Overlay/Modal */ \"./src/Overlay/Modal.tsx\"));\n\nvar _Bounce = _interopRequireDefault(__webpack_require__(/*! ../Animation/Bounce */ \"./src/Animation/Bounce.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _ModalDialog = _interopRequireWildcard(__webpack_require__(/*! ./ModalDialog */ \"./src/Modal/ModalDialog.tsx\"));\n\nvar _ModalContext = __webpack_require__(/*! ./ModalContext */ \"./src/Modal/ModalContext.ts\");\n\nvar _ModalBody = _interopRequireDefault(__webpack_require__(/*! ./ModalBody */ \"./src/Modal/ModalBody.tsx\"));\n\nvar _ModalHeader = _interopRequireDefault(__webpack_require__(/*! ./ModalHeader */ \"./src/Modal/ModalHeader.tsx\"));\n\nvar _ModalTitle = _interopRequireDefault(__webpack_require__(/*! ./ModalTitle */ \"./src/Modal/ModalTitle.tsx\"));\n\nvar _ModalFooter = _interopRequireDefault(__webpack_require__(/*! ./ModalFooter */ \"./src/Modal/ModalFooter.tsx\"));\n\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/Modal/utils.ts\");\n\nvar _useUniqueId = _interopRequireDefault(__webpack_require__(/*! ../utils/useUniqueId */ \"./src/utils/useUniqueId.ts\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Modal/Modal.tsx\",\n    _this = void 0,\n    _templateObject,\n    _templateObject2;\n\nvar Modal = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var className = props.className,\n      children = props.children,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'modal' : _props$classPrefix,\n      dialogClassName = props.dialogClassName,\n      backdropClassName = props.backdropClassName,\n      _props$backdrop = props.backdrop,\n      backdrop = _props$backdrop === void 0 ? true : _props$backdrop,\n      dialogStyle = props.dialogStyle,\n      _props$animation = props.animation,\n      animation = _props$animation === void 0 ? _Bounce.default : _props$animation,\n      open = props.open,\n      _props$size = props.size,\n      size = _props$size === void 0 ? 'sm' : _props$size,\n      full = props.full,\n      _props$dialogAs = props.dialogAs,\n      Dialog = _props$dialogAs === void 0 ? _ModalDialog.default : _props$dialogAs,\n      animationProps = props.animationProps,\n      _props$animationTimeo = props.animationTimeout,\n      animationTimeout = _props$animationTimeo === void 0 ? 300 : _props$animationTimeo,\n      _props$overflow = props.overflow,\n      overflow = _props$overflow === void 0 ? true : _props$overflow,\n      _props$drawer = props.drawer,\n      drawer = _props$drawer === void 0 ? false : _props$drawer,\n      onClose = props.onClose,\n      onEntered = props.onEntered,\n      onEntering = props.onEntering,\n      onExited = props.onExited,\n      _props$role = props.role,\n      role = _props$role === void 0 ? 'dialog' : _props$role,\n      idProp = props.id,\n      ariaLabelledby = props['aria-labelledby'],\n      ariaDescribedby = props['aria-describedby'],\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"className\", \"children\", \"classPrefix\", \"dialogClassName\", \"backdropClassName\", \"backdrop\", \"dialogStyle\", \"animation\", \"open\", \"size\", \"full\", \"dialogAs\", \"animationProps\", \"animationTimeout\", \"overflow\", \"drawer\", \"onClose\", \"onEntered\", \"onEntering\", \"onExited\", \"role\", \"id\", \"aria-labelledby\", \"aria-describedby\"]);\n  var inClass = {\n    in: open && !animation\n  };\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      prefix = _useClassNames.prefix;\n\n  var _useState = (0, _react.useState)(false),\n      shake = _useState[0],\n      setShake = _useState[1];\n\n  var classes = merge(className, prefix(size, {\n    full: full\n  }));\n  var dialogRef = (0, _react.useRef)(null);\n  var transitionEndListener = (0, _react.useRef)(); // The style of the Modal body will be updated with the size of the window or container.\n\n  var _useBodyStyles = (0, _utils2.useBodyStyles)(dialogRef, {\n    overflow: overflow,\n    drawer: drawer,\n    prefix: prefix\n  }),\n      bodyStyles = _useBodyStyles[0],\n      onChangeBodyStyles = _useBodyStyles[1],\n      onDestroyEvents = _useBodyStyles[2];\n\n  var dialogId = (0, _useUniqueId.default)('dialog-', idProp);\n  var modalContextValue = (0, _react.useMemo)(function () {\n    return {\n      dialogId: dialogId,\n      onModalClose: onClose,\n      getBodyStyles: function getBodyStyles() {\n        return bodyStyles;\n      },\n      isDrawer: drawer\n    };\n  }, [dialogId, onClose, bodyStyles, drawer]);\n  var handleExited = (0, _react.useCallback)(function (node) {\n    var _transitionEndListene;\n\n    onExited === null || onExited === void 0 ? void 0 : onExited(node);\n    onDestroyEvents();\n    (_transitionEndListene = transitionEndListener.current) === null || _transitionEndListene === void 0 ? void 0 : _transitionEndListene.off();\n    transitionEndListener.current = null;\n  }, [onDestroyEvents, onExited]);\n  var handleEntered = (0, _react.useCallback)(function (node) {\n    onEntered === null || onEntered === void 0 ? void 0 : onEntered(node);\n    onChangeBodyStyles();\n  }, [onChangeBodyStyles, onEntered]);\n  var handleEntering = (0, _react.useCallback)(function (node) {\n    onEntering === null || onEntering === void 0 ? void 0 : onEntering(node);\n    onChangeBodyStyles(true);\n  }, [onChangeBodyStyles, onEntering]);\n  var handleBackdropClick = (0, _react.useCallback)(function (e) {\n    if (e.target !== e.currentTarget) {\n      return;\n    } // When the value of `backdrop` is `static`, a jitter animation will be added to the dialog when clicked.\n\n\n    if (backdrop === 'static') {\n      setShake(true);\n\n      if (!transitionEndListener.current && dialogRef.current) {\n        //fix: https://github.com/rsuite/rsuite/blob/a93d13c14fb20cc58204babe3331d3c3da3fe1fd/src/Modal/styles/index.less#L59\n        transitionEndListener.current = (0, _on.default)(dialogRef.current, (0, _getAnimationEnd.default)(), function () {\n          setShake(false);\n        });\n      }\n\n      return;\n    }\n\n    onClose === null || onClose === void 0 ? void 0 : onClose(e);\n  }, [backdrop, onClose]);\n  var handleClick = (0, _react.useCallback)(function (e) {\n    if (dialogRef.current && e.target !== dialogRef.current) {\n      handleBackdropClick(e);\n    }\n  }, [handleBackdropClick]);\n  (0, _utils.useWillUnmount)(function () {\n    var _transitionEndListene2;\n\n    (_transitionEndListene2 = transitionEndListener.current) === null || _transitionEndListene2 === void 0 ? void 0 : _transitionEndListene2.off();\n  });\n  return /*#__PURE__*/_react.default.createElement(_ModalContext.ModalContext.Provider, {\n    value: modalContextValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 177,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Modal.default, (0, _extends2.default)({}, rest, {\n    ref: ref,\n    backdrop: backdrop,\n    open: open,\n    onClose: onClose,\n    className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)([\"wrapper\"]))),\n    onEntered: handleEntered,\n    onEntering: handleEntering,\n    onExited: handleExited,\n    backdropClassName: merge(prefix(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)([\"backdrop\"]))), backdropClassName, inClass),\n    containerClassName: prefix({\n      open: open,\n      'has-backdrop': backdrop\n    }),\n    transition: animation ? animation : undefined,\n    animationProps: animationProps,\n    dialogTransitionTimeout: animationTimeout,\n    backdropTransitionTimeout: 150,\n    onClick: backdrop ? handleClick : undefined,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 178,\n      columnNumber: 7\n    }\n  }), function (transitionProps, transitionRef) {\n    var transitionClassName = transitionProps.className,\n        transitionRest = (0, _objectWithoutPropertiesLoose2.default)(transitionProps, [\"className\"]);\n    return /*#__PURE__*/_react.default.createElement(Dialog, (0, _extends2.default)({\n      role: role,\n      id: dialogId,\n      \"aria-labelledby\": ariaLabelledby !== null && ariaLabelledby !== void 0 ? ariaLabelledby : dialogId + \"-title\",\n      \"aria-describedby\": ariaDescribedby\n    }, transitionRest, (0, _pick.default)(rest, Object.keys(_ModalDialog.modalDialogPropTypes)), {\n      ref: (0, _utils.mergeRefs)(dialogRef, transitionRef),\n      classPrefix: classPrefix,\n      className: merge(classes, transitionClassName, prefix({\n        shake: shake\n      })),\n      dialogClassName: dialogClassName,\n      dialogStyle: dialogStyle,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 199,\n        columnNumber: 13\n      }\n    }), children);\n  }));\n});\n\nModal.Body = _ModalBody.default;\nModal.Header = _ModalHeader.default;\nModal.Title = _ModalTitle.default;\nModal.Footer = _ModalFooter.default;\nModal.Dialog = _ModalDialog.default;\nModal.displayName = 'Modal';\nModal.propTypes = (0, _extends2.default)({}, _Modal.modalPropTypes, {\n  animation: _propTypes.default.any,\n  animationTimeout: _propTypes.default.number,\n  classPrefix: _propTypes.default.string,\n  dialogClassName: _propTypes.default.string,\n  size: _propTypes.default.oneOf(_utils.SIZE),\n  dialogStyle: _propTypes.default.object,\n  dialogAs: _propTypes.default.elementType,\n  full: _propTypes.default.bool,\n  overflow: _propTypes.default.bool,\n  drawer: _propTypes.default.bool\n});\nvar _default = Modal;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Modal/Modal.tsx?");
 
 /***/ }),
 
@@ -3387,7 +3398,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _NavItem = _interopRequireDefault(__webpack_require__(/*! ./NavItem */ \"./src/Nav/NavItem.tsx\"));\n\nvar _Dropdown = _interopRequireDefault(__webpack_require__(/*! ../Dropdown */ \"./src/Dropdown/index.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Navbar = __webpack_require__(/*! ../Navbar/Navbar */ \"./src/Navbar/Navbar.tsx\");\n\nvar _Sidenav = __webpack_require__(/*! ../Sidenav/Sidenav */ \"./src/Sidenav/Sidenav.tsx\");\n\nvar _NavContext = _interopRequireDefault(__webpack_require__(/*! ./NavContext */ \"./src/Nav/NavContext.ts\"));\n\nvar _useEnsuredRef = _interopRequireDefault(__webpack_require__(/*! ../utils/useEnsuredRef */ \"./src/utils/useEnsuredRef.ts\"));\n\nvar _Menubar = _interopRequireDefault(__webpack_require__(/*! ../Menu/Menubar */ \"./src/Menu/Menubar.tsx\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Nav/Nav.tsx\",\n    _this = void 0;\n\nvar Nav = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'nav' : _props$classPrefix,\n      _props$appearance = props.appearance,\n      appearance = _props$appearance === void 0 ? 'default' : _props$appearance,\n      vertical = props.vertical,\n      justified = props.justified,\n      reversed = props.reversed,\n      pullRight = props.pullRight,\n      className = props.className,\n      children = props.children,\n      activeKeyProp = props.activeKey,\n      onSelectProp = props.onSelect,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"appearance\", \"vertical\", \"justified\", \"reversed\", \"pullRight\", \"className\", \"children\", \"activeKey\", \"onSelect\"]);\n  var sidenav = (0, _react.useContext)(_Sidenav.SidenavContext); // Whether inside a <Navbar>\n\n  var navbar = (0, _react.useContext)(_Navbar.NavbarContext);\n  var menubarRef = (0, _useEnsuredRef.default)(ref);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge,\n      rootPrefix = _useClassNames.rootPrefix,\n      prefix = _useClassNames.prefix;\n\n  var classes = merge(className, rootPrefix({\n    'navbar-nav': navbar,\n    'navbar-right': pullRight,\n    'sidenav-nav': sidenav\n  }), withClassPrefix(appearance, {\n    horizontal: navbar || !vertical && !sidenav,\n    vertical: vertical || sidenav,\n    justified: justified,\n    reversed: reversed\n  }));\n\n  var _ref = sidenav || {},\n      activeKeyFromSidenav = _ref.activeKey,\n      _ref$onSelect = _ref.onSelect,\n      onSelectFromSidenav = _ref$onSelect === void 0 ? onSelectProp : _ref$onSelect;\n\n  var activeKey = activeKeyProp !== null && activeKeyProp !== void 0 ? activeKeyProp : activeKeyFromSidenav;\n\n  if (sidenav !== null && sidenav !== void 0 && sidenav.expanded) {\n    return /*#__PURE__*/_react.default.createElement(_NavContext.default.Provider, {\n      value: {\n        activeKey: activeKey,\n        onSelect: onSelectProp !== null && onSelectProp !== void 0 ? onSelectProp : onSelectFromSidenav\n      },\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 90,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"ul\", (0, _extends2.default)({\n      ref: ref,\n      className: classes\n    }, rest, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 96,\n        columnNumber: 9\n      }\n    }), children));\n  }\n\n  var hasWaterline = appearance !== 'default'; // If inside a collapsed <Sidenav>, render an ARIA `menubar` (vertical)\n\n  if (sidenav) {\n    return /*#__PURE__*/_react.default.createElement(_NavContext.default.Provider, {\n      value: {\n        activeKey: activeKey,\n        onSelect: onSelectProp !== null && onSelectProp !== void 0 ? onSelectProp : onSelectFromSidenav\n      },\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 108,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Menubar.default, {\n      vertical: !!sidenav,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 114,\n        columnNumber: 9\n      }\n    }, function (menubar, ref) {\n      return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n        ref: ref\n      }, rest, {\n        className: classes\n      }, menubar, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 116,\n          columnNumber: 13\n        }\n      }), children);\n    }));\n  }\n\n  return /*#__PURE__*/_react.default.createElement(_NavContext.default.Provider, {\n    value: {\n      activeKey: activeKey,\n      onSelect: onSelectProp !== null && onSelectProp !== void 0 ? onSelectProp : onSelectFromSidenav\n    },\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 125,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: menubarRef,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 131,\n      columnNumber: 7\n    }\n  }), children, hasWaterline && /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('bar'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 133,\n      columnNumber: 26\n    }\n  })));\n});\n\nNav.Dropdown = _Dropdown.default;\nNav.Item = _NavItem.default;\nNav.displayName = 'Nav';\nNav.propTypes = {\n  classPrefix: _propTypes.default.string,\n  className: _propTypes.default.string,\n  children: _propTypes.default.node,\n  appearance: _propTypes.default.oneOf(['default', 'subtle', 'tabs']),\n  // Reverse Direction of tabs/subtle\n  reversed: _propTypes.default.bool,\n  justified: _propTypes.default.bool,\n  vertical: _propTypes.default.bool,\n  pullRight: _propTypes.default.bool,\n  activeKey: _propTypes.default.any,\n  onSelect: _propTypes.default.func\n};\nvar _default = Nav;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Nav/Nav.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _NavItem = _interopRequireDefault(__webpack_require__(/*! ./NavItem */ \"./src/Nav/NavItem.tsx\"));\n\nvar _Dropdown = _interopRequireDefault(__webpack_require__(/*! ../Dropdown */ \"./src/Dropdown/index.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Navbar = __webpack_require__(/*! ../Navbar/Navbar */ \"./src/Navbar/Navbar.tsx\");\n\nvar _Sidenav = __webpack_require__(/*! ../Sidenav/Sidenav */ \"./src/Sidenav/Sidenav.tsx\");\n\nvar _NavContext = _interopRequireDefault(__webpack_require__(/*! ./NavContext */ \"./src/Nav/NavContext.ts\"));\n\nvar _useEnsuredRef = _interopRequireDefault(__webpack_require__(/*! ../utils/useEnsuredRef */ \"./src/utils/useEnsuredRef.ts\"));\n\nvar _Menubar = _interopRequireDefault(__webpack_require__(/*! ../Menu/Menubar */ \"./src/Menu/Menubar.tsx\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Nav/Nav.tsx\",\n    _this = void 0;\n\nvar Nav = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'nav' : _props$classPrefix,\n      _props$appearance = props.appearance,\n      appearance = _props$appearance === void 0 ? 'default' : _props$appearance,\n      vertical = props.vertical,\n      justified = props.justified,\n      reversed = props.reversed,\n      pullRight = props.pullRight,\n      className = props.className,\n      children = props.children,\n      activeKeyProp = props.activeKey,\n      onSelectProp = props.onSelect,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"appearance\", \"vertical\", \"justified\", \"reversed\", \"pullRight\", \"className\", \"children\", \"activeKey\", \"onSelect\"]);\n  var sidenav = (0, _react.useContext)(_Sidenav.SidenavContext); // Whether inside a <Navbar>\n\n  var navbar = (0, _react.useContext)(_Navbar.NavbarContext);\n  var menubarRef = (0, _useEnsuredRef.default)(ref);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge,\n      rootPrefix = _useClassNames.rootPrefix,\n      prefix = _useClassNames.prefix;\n\n  var classes = merge(className, rootPrefix({\n    'navbar-nav': navbar,\n    'navbar-right': pullRight,\n    'sidenav-nav': sidenav\n  }), withClassPrefix(appearance, {\n    horizontal: navbar || !vertical && !sidenav,\n    vertical: vertical || sidenav,\n    justified: justified,\n    reversed: reversed\n  }));\n\n  var _ref = sidenav || {},\n      activeKeyFromSidenav = _ref.activeKey,\n      _ref$onSelect = _ref.onSelect,\n      onSelectFromSidenav = _ref$onSelect === void 0 ? onSelectProp : _ref$onSelect;\n\n  var activeKey = activeKeyProp !== null && activeKeyProp !== void 0 ? activeKeyProp : activeKeyFromSidenav;\n  var contextValue = (0, _react.useMemo)(function () {\n    return {\n      withinNav: true,\n      activeKey: activeKey,\n      onSelect: onSelectProp !== null && onSelectProp !== void 0 ? onSelectProp : onSelectFromSidenav\n    };\n  }, [activeKey, onSelectFromSidenav, onSelectProp]);\n\n  if (sidenav !== null && sidenav !== void 0 && sidenav.expanded) {\n    return /*#__PURE__*/_react.default.createElement(_NavContext.default.Provider, {\n      value: contextValue,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 98,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"ul\", (0, _extends2.default)({\n      ref: ref,\n      className: classes\n    }, rest, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 99,\n        columnNumber: 9\n      }\n    }), children));\n  }\n\n  var hasWaterline = appearance !== 'default'; // If inside a collapsed <Sidenav>, render an ARIA `menubar` (vertical)\n\n  if (sidenav) {\n    return /*#__PURE__*/_react.default.createElement(_NavContext.default.Provider, {\n      value: contextValue,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 111,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Menubar.default, {\n      vertical: !!sidenav,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 112,\n        columnNumber: 9\n      }\n    }, function (menubar, ref) {\n      return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n        ref: ref\n      }, rest, {\n        className: classes\n      }, menubar, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 114,\n          columnNumber: 13\n        }\n      }), children);\n    }));\n  }\n\n  return /*#__PURE__*/_react.default.createElement(_NavContext.default.Provider, {\n    value: contextValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 123,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: menubarRef,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 124,\n      columnNumber: 7\n    }\n  }), children, hasWaterline && /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('bar'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 126,\n      columnNumber: 26\n    }\n  })));\n});\n\nNav.Dropdown = _Dropdown.default;\nNav.Item = _NavItem.default;\nNav.displayName = 'Nav';\nNav.propTypes = {\n  classPrefix: _propTypes.default.string,\n  className: _propTypes.default.string,\n  children: _propTypes.default.node,\n  appearance: _propTypes.default.oneOf(['default', 'subtle', 'tabs']),\n  // Reverse Direction of tabs/subtle\n  reversed: _propTypes.default.bool,\n  justified: _propTypes.default.bool,\n  vertical: _propTypes.default.bool,\n  pullRight: _propTypes.default.bool,\n  activeKey: _propTypes.default.any,\n  onSelect: _propTypes.default.func\n};\nvar _default = Nav;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Nav/Nav.tsx?");
 
 /***/ }),
 
@@ -3398,7 +3409,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\n\nvar _noop = _interopRequireDefault(__webpack_require__(/*! lodash/noop */ \"./node_modules/lodash/noop.js\"));\n\nvar NavContext = /*#__PURE__*/_react.default.createContext({\n  activeKey: null,\n  onSelect: _noop.default\n});\n\nvar _default = NavContext;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Nav/NavContext.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\n\nvar _noop = _interopRequireDefault(__webpack_require__(/*! lodash/noop */ \"./node_modules/lodash/noop.js\"));\n\nvar NavContext = /*#__PURE__*/_react.default.createContext({\n  withinNav: false,\n  activeKey: null,\n  onSelect: _noop.default\n});\n\nvar _default = NavContext;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Nav/NavContext.ts?");
 
 /***/ }),
 
@@ -3486,7 +3497,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _Navbar = _interopRequireDefault(__webpack_require__(/*! ./Navbar */ \"./src/Navbar/Navbar.tsx\"));\n\nvar _default = _Navbar.default;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Navbar/index.tsx?");
+eval("\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = exports.NavbarContext = void 0;\n\nvar _Navbar = _interopRequireWildcard(__webpack_require__(/*! ./Navbar */ \"./src/Navbar/Navbar.tsx\"));\n\nexports.NavbarContext = _Navbar.NavbarContext;\nvar _default = _Navbar.default;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Navbar/index.tsx?");
 
 /***/ }),
 
@@ -3519,7 +3530,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = exports.modalPropTypes = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ \"./node_modules/classnames/index.js\"));\n\nvar _canUseDOM = _interopRequireDefault(__webpack_require__(/*! dom-lib/canUseDOM */ \"./node_modules/dom-lib/esm/canUseDOM.js\"));\n\nvar _contains = _interopRequireDefault(__webpack_require__(/*! dom-lib/contains */ \"./node_modules/dom-lib/esm/contains.js\"));\n\nvar _getContainer = _interopRequireDefault(__webpack_require__(/*! dom-lib/getContainer */ \"./node_modules/dom-lib/esm/getContainer.js\"));\n\nvar _on = _interopRequireDefault(__webpack_require__(/*! dom-lib/on */ \"./node_modules/dom-lib/esm/on.js\"));\n\nvar _ModalManager = _interopRequireDefault(__webpack_require__(/*! ./ModalManager */ \"./src/Overlay/ModalManager.ts\"));\n\nvar _Fade = _interopRequireDefault(__webpack_require__(/*! ../Animation/Fade */ \"./src/Animation/Fade.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../Animation/utils */ \"./src/Animation/utils.ts\");\n\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Overlay/Modal.tsx\",\n    _this = void 0;\n\nvar manager;\n\nfunction getManager() {\n  if (!manager) manager = new _ModalManager.default();\n  return manager;\n}\n\nvar useModalManager = function useModalManager() {\n  var modalManager = getManager();\n  var modal = (0, _react.useRef)({\n    dialog: null,\n    backdrop: null\n  });\n  return {\n    get dialog() {\n      var _modal$current;\n\n      return (_modal$current = modal.current) === null || _modal$current === void 0 ? void 0 : _modal$current.dialog;\n    },\n\n    add: function add(containerElement, containerClassName) {\n      return modalManager.add(modal.current, containerElement, containerClassName);\n    },\n    remove: function remove() {\n      return modalManager.remove(modal.current);\n    },\n    isTopModal: function isTopModal() {\n      return modalManager.isTopModal(modal.current);\n    },\n    setDialogRef: (0, _react.useCallback)(function (ref) {\n      modal.current.dialog = ref;\n    }, []),\n    setBackdropRef: (0, _react.useCallback)(function (ref) {\n      modal.current.backdrop = ref;\n    }, [])\n  };\n};\n\nvar Modal = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      children = props.children,\n      Transition = props.transition,\n      dialogTransitionTimeout = props.dialogTransitionTimeout,\n      style = props.style,\n      className = props.className,\n      container = props.container,\n      animationProps = props.animationProps,\n      containerClassName = props.containerClassName,\n      _props$keyboard = props.keyboard,\n      keyboard = _props$keyboard === void 0 ? true : _props$keyboard,\n      _props$enforceFocus = props.enforceFocus,\n      enforceFocus = _props$enforceFocus === void 0 ? true : _props$enforceFocus,\n      _props$backdrop = props.backdrop,\n      backdrop = _props$backdrop === void 0 ? true : _props$backdrop,\n      backdropTransitionTimeout = props.backdropTransitionTimeout,\n      backdropStyle = props.backdropStyle,\n      backdropClassName = props.backdropClassName,\n      open = props.open,\n      _props$autoFocus = props.autoFocus,\n      autoFocus = _props$autoFocus === void 0 ? true : _props$autoFocus,\n      onBackdropClick = props.onBackdropClick,\n      onEsc = props.onEsc,\n      onExit = props.onExit,\n      onExiting = props.onExiting,\n      onExited = props.onExited,\n      onEnter = props.onEnter,\n      onEntering = props.onEntering,\n      onEntered = props.onEntered,\n      onClose = props.onClose,\n      onOpen = props.onOpen,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"children\", \"transition\", \"dialogTransitionTimeout\", \"style\", \"className\", \"container\", \"animationProps\", \"containerClassName\", \"keyboard\", \"enforceFocus\", \"backdrop\", \"backdropTransitionTimeout\", \"backdropStyle\", \"backdropClassName\", \"open\", \"autoFocus\", \"onBackdropClick\", \"onEsc\", \"onExit\", \"onExiting\", \"onExited\", \"onEnter\", \"onEntering\", \"onEntered\", \"onClose\", \"onOpen\"]);\n\n  var _useState = (0, _react.useState)(!open),\n      exited = _useState[0],\n      setExited = _useState[1];\n\n  var _usePortal = (0, _utils2.usePortal)({\n    container: container\n  }),\n      Portal = _usePortal.Portal;\n\n  var modal = useModalManager();\n\n  if (open) {\n    if (exited) setExited(false);\n  } else if (!Transition && !exited) {\n    setExited(true);\n  }\n\n  var mountModal = open || Transition && !exited;\n  var lastFocus = (0, _react.useRef)(null);\n  var handleDocumentKeyDown = (0, _react.useCallback)(function (event) {\n    if (keyboard && event.key === _utils2.KEY_VALUES.ESC && modal.isTopModal()) {\n      onEsc === null || onEsc === void 0 ? void 0 : onEsc(event);\n      onClose === null || onClose === void 0 ? void 0 : onClose(event);\n    }\n  }, [keyboard, modal, onEsc, onClose]);\n  var restoreLastFocus = (0, _react.useCallback)(function () {\n    if (lastFocus.current) {\n      var _lastFocus$current$fo, _lastFocus$current;\n\n      (_lastFocus$current$fo = (_lastFocus$current = lastFocus.current).focus) === null || _lastFocus$current$fo === void 0 ? void 0 : _lastFocus$current$fo.call(_lastFocus$current);\n      lastFocus.current = null;\n    }\n  }, []);\n  var handleEnforceFocus = (0, _react.useCallback)(function () {\n    if (!enforceFocus || !modal.isTopModal()) {\n      return;\n    }\n\n    var currentActiveElement = document.activeElement;\n    var dialog = modal.dialog;\n\n    if (dialog && dialog !== currentActiveElement && !(0, _contains.default)(dialog, currentActiveElement)) {\n      dialog.focus();\n    }\n  }, [enforceFocus, modal]);\n  var handleBackdropClick = (0, _react.useCallback)(function (event) {\n    if (event.target !== event.currentTarget) {\n      return;\n    }\n\n    onBackdropClick === null || onBackdropClick === void 0 ? void 0 : onBackdropClick(event);\n\n    if (backdrop === true) {\n      onClose === null || onClose === void 0 ? void 0 : onClose(event);\n    }\n  }, [backdrop, onBackdropClick, onClose]);\n  var documentKeyDownListener = (0, _react.useRef)();\n  var documentFocusListener = (0, _react.useRef)();\n  var handleOpen = (0, _react.useCallback)(function () {\n    var containerElement = (0, _getContainer.default)(container, document.body);\n    modal.add(containerElement, containerClassName);\n\n    if (!documentKeyDownListener.current) {\n      documentKeyDownListener.current = (0, _on.default)(document, 'keydown', handleDocumentKeyDown);\n    }\n\n    if (!documentFocusListener.current) {\n      documentFocusListener.current = (0, _on.default)(document, 'focus', handleEnforceFocus, true);\n    }\n\n    if (_canUseDOM.default) {\n      lastFocus.current = document.activeElement;\n    }\n\n    if (autoFocus) {\n      var _modal$dialog;\n\n      (_modal$dialog = modal.dialog) === null || _modal$dialog === void 0 ? void 0 : _modal$dialog.focus();\n    }\n\n    onOpen === null || onOpen === void 0 ? void 0 : onOpen();\n  }, [autoFocus, container, containerClassName, handleDocumentKeyDown, handleEnforceFocus, modal, onOpen]);\n  var handleClose = (0, _react.useCallback)(function () {\n    var _documentKeyDownListe, _documentFocusListene;\n\n    modal.remove();\n    (_documentKeyDownListe = documentKeyDownListener.current) === null || _documentKeyDownListe === void 0 ? void 0 : _documentKeyDownListe.off();\n    documentKeyDownListener.current = null;\n    (_documentFocusListene = documentFocusListener.current) === null || _documentFocusListene === void 0 ? void 0 : _documentFocusListene.off();\n    documentFocusListener.current = null;\n    restoreLastFocus();\n  }, [modal, restoreLastFocus]);\n  (0, _react.useEffect)(function () {\n    if (!open) {\n      return;\n    }\n\n    handleOpen();\n  }, [open, handleOpen]);\n  (0, _react.useEffect)(function () {\n    if (!exited) {\n      return;\n    }\n\n    handleClose();\n  }, [exited, handleClose]);\n  (0, _utils2.useWillUnmount)(function () {\n    handleClose();\n  });\n  var handleExited = (0, _react.useCallback)(function () {\n    setExited(true);\n  }, []);\n\n  if (!mountModal) {\n    return null;\n  }\n\n  var renderBackdrop = function renderBackdrop() {\n    var backdropPorps = {\n      style: backdropStyle,\n      onClick: handleBackdropClick\n    };\n\n    if (Transition) {\n      return /*#__PURE__*/_react.default.createElement(_Fade.default, {\n        transitionAppear: true,\n        in: open,\n        timeout: backdropTransitionTimeout,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 275,\n          columnNumber: 9\n        }\n      }, function (fadeProps, ref) {\n        var className = fadeProps.className,\n            rest = (0, _objectWithoutPropertiesLoose2.default)(fadeProps, [\"className\"]);\n        return /*#__PURE__*/_react.default.createElement(\"div\", (0, _extends2.default)({\n          \"aria-hidden\": true\n        }, rest, backdropPorps, {\n          ref: (0, _utils2.mergeRefs)(modal.setBackdropRef, ref),\n          className: (0, _classnames.default)(backdropClassName, className),\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 279,\n            columnNumber: 15\n          }\n        }));\n      });\n    }\n\n    return /*#__PURE__*/_react.default.createElement(\"div\", (0, _extends2.default)({\n      \"aria-hidden\": true\n    }, backdropPorps, {\n      className: backdropClassName,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 292,\n        columnNumber: 12\n      }\n    }));\n  };\n\n  var dialogElement = Transition ? /*#__PURE__*/_react.default.createElement(Transition, (0, _extends2.default)({}, animationProps, {\n    transitionAppear: true,\n    unmountOnExit: true,\n    in: open,\n    timeout: dialogTransitionTimeout,\n    onExit: onExit,\n    onExiting: onExiting,\n    onExited: (0, _utils2.createChainedFunction)(handleExited, onExited),\n    onEnter: onEnter,\n    onEntering: onEntering,\n    onEntered: onEntered,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 296,\n      columnNumber: 5\n    }\n  }), children) : children;\n  return /*#__PURE__*/_react.default.createElement(Portal, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 316,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: (0, _utils2.mergeRefs)(modal.setDialogRef, ref),\n    style: style,\n    className: className,\n    tabIndex: -1,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 317,\n      columnNumber: 7\n    }\n  }), backdrop && renderBackdrop(), dialogElement));\n});\n\nvar modalPropTypes = {\n  as: _propTypes.default.elementType,\n  className: _propTypes.default.string,\n  backdropClassName: _propTypes.default.string,\n  style: _propTypes.default.object,\n  backdropStyle: _propTypes.default.object,\n  open: _propTypes.default.bool,\n  backdrop: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.string]),\n  keyboard: _propTypes.default.bool,\n  autoFocus: _propTypes.default.bool,\n  enforceFocus: _propTypes.default.bool,\n  animationProps: _propTypes.default.object,\n  onOpen: _propTypes.default.func,\n  onClose: _propTypes.default.func\n};\nexports.modalPropTypes = modalPropTypes;\nModal.displayName = 'OverlayModal';\nModal.propTypes = (0, _extends2.default)({}, _utils.animationPropTypes, modalPropTypes, {\n  children: _propTypes.default.func,\n  container: _propTypes.default.any,\n  containerClassName: _propTypes.default.string,\n  dialogTransitionTimeout: _propTypes.default.number,\n  backdropTransitionTimeout: _propTypes.default.number,\n  transition: _propTypes.default.any,\n  onEsc: _propTypes.default.func,\n  onBackdropClick: _propTypes.default.func\n});\nvar _default = Modal;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Overlay/Modal.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = exports.modalPropTypes = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ \"./node_modules/classnames/index.js\"));\n\nvar _contains = _interopRequireDefault(__webpack_require__(/*! dom-lib/contains */ \"./node_modules/dom-lib/esm/contains.js\"));\n\nvar _getContainer = _interopRequireDefault(__webpack_require__(/*! dom-lib/getContainer */ \"./node_modules/dom-lib/esm/getContainer.js\"));\n\nvar _on = _interopRequireDefault(__webpack_require__(/*! dom-lib/on */ \"./node_modules/dom-lib/esm/on.js\"));\n\nvar _ModalManager = _interopRequireDefault(__webpack_require__(/*! ./ModalManager */ \"./src/Overlay/ModalManager.ts\"));\n\nvar _Fade = _interopRequireDefault(__webpack_require__(/*! ../Animation/Fade */ \"./src/Animation/Fade.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../Animation/utils */ \"./src/Animation/utils.ts\");\n\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _OverlayContext = _interopRequireDefault(__webpack_require__(/*! ./OverlayContext */ \"./src/Overlay/OverlayContext.ts\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Overlay/Modal.tsx\",\n    _this = void 0;\n\nvar manager;\n\nfunction getManager() {\n  if (!manager) manager = new _ModalManager.default();\n  return manager;\n}\n\nvar useModalManager = function useModalManager() {\n  var modalManager = getManager();\n  var modal = (0, _react.useRef)({\n    dialog: null,\n    backdrop: null\n  });\n  return {\n    get dialog() {\n      var _modal$current;\n\n      return (_modal$current = modal.current) === null || _modal$current === void 0 ? void 0 : _modal$current.dialog;\n    },\n\n    add: function add(containerElement, containerClassName) {\n      return modalManager.add(modal.current, containerElement, containerClassName);\n    },\n    remove: function remove() {\n      return modalManager.remove(modal.current);\n    },\n    isTopModal: function isTopModal() {\n      return modalManager.isTopModal(modal.current);\n    },\n    setDialogRef: (0, _react.useCallback)(function (ref) {\n      modal.current.dialog = ref;\n    }, []),\n    setBackdropRef: (0, _react.useCallback)(function (ref) {\n      modal.current.backdrop = ref;\n    }, [])\n  };\n};\n\nvar Modal = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      children = props.children,\n      Transition = props.transition,\n      dialogTransitionTimeout = props.dialogTransitionTimeout,\n      style = props.style,\n      className = props.className,\n      container = props.container,\n      animationProps = props.animationProps,\n      containerClassName = props.containerClassName,\n      _props$keyboard = props.keyboard,\n      keyboard = _props$keyboard === void 0 ? true : _props$keyboard,\n      _props$enforceFocus = props.enforceFocus,\n      enforceFocus = _props$enforceFocus === void 0 ? true : _props$enforceFocus,\n      _props$backdrop = props.backdrop,\n      backdrop = _props$backdrop === void 0 ? true : _props$backdrop,\n      backdropTransitionTimeout = props.backdropTransitionTimeout,\n      backdropStyle = props.backdropStyle,\n      backdropClassName = props.backdropClassName,\n      open = props.open,\n      _props$autoFocus = props.autoFocus,\n      autoFocus = _props$autoFocus === void 0 ? true : _props$autoFocus,\n      onEsc = props.onEsc,\n      onExit = props.onExit,\n      onExiting = props.onExiting,\n      onExited = props.onExited,\n      onEnter = props.onEnter,\n      onEntering = props.onEntering,\n      onEntered = props.onEntered,\n      onClose = props.onClose,\n      onOpen = props.onOpen,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"children\", \"transition\", \"dialogTransitionTimeout\", \"style\", \"className\", \"container\", \"animationProps\", \"containerClassName\", \"keyboard\", \"enforceFocus\", \"backdrop\", \"backdropTransitionTimeout\", \"backdropStyle\", \"backdropClassName\", \"open\", \"autoFocus\", \"onEsc\", \"onExit\", \"onExiting\", \"onExited\", \"onEnter\", \"onEntering\", \"onEntered\", \"onClose\", \"onOpen\"]);\n\n  var _useState = (0, _react.useState)(!open),\n      exited = _useState[0],\n      setExited = _useState[1];\n\n  var _usePortal = (0, _utils2.usePortal)({\n    container: container\n  }),\n      Portal = _usePortal.Portal;\n\n  var modal = useModalManager();\n\n  if (open) {\n    if (exited) setExited(false);\n  } else if (!Transition && !exited) {\n    setExited(true);\n  }\n\n  var mountModal = open || Transition && !exited;\n  var lastFocus = (0, _react.useRef)(null);\n  var handleDocumentKeyDown = (0, _utils2.useEventCallback)(function (event) {\n    if (keyboard && event.key === _utils2.KEY_VALUES.ESC && modal.isTopModal()) {\n      onEsc === null || onEsc === void 0 ? void 0 : onEsc(event);\n      onClose === null || onClose === void 0 ? void 0 : onClose(event);\n    }\n  });\n  var restoreLastFocus = (0, _react.useCallback)(function () {\n    if (lastFocus.current) {\n      var _lastFocus$current$fo, _lastFocus$current;\n\n      (_lastFocus$current$fo = (_lastFocus$current = lastFocus.current).focus) === null || _lastFocus$current$fo === void 0 ? void 0 : _lastFocus$current$fo.call(_lastFocus$current);\n      lastFocus.current = null;\n    }\n  }, []);\n  /**\n   * Determines if the currently focused element is inside the dialog,\n   * and if not, returns the focus to the dialog.\n   *\n   */\n\n  var handleFocusDialog = (0, _utils2.useEventCallback)(function (onBeforeFocusCallback) {\n    var currentActiveElement = document.activeElement;\n    var dialog = modal.dialog;\n\n    if (dialog && currentActiveElement && !(0, _contains.default)(dialog, currentActiveElement)) {\n      onBeforeFocusCallback === null || onBeforeFocusCallback === void 0 ? void 0 : onBeforeFocusCallback();\n      dialog.focus();\n    }\n  });\n  var handleEnforceFocus = (0, _utils2.useEventCallback)(function () {\n    if (!enforceFocus || !modal.isTopModal()) {\n      return;\n    }\n\n    handleFocusDialog();\n  });\n  var documentKeyDownListener = (0, _react.useRef)();\n  var documentFocusListener = (0, _react.useRef)();\n  var handleOpen = (0, _utils2.useEventCallback)(function () {\n    var containerElement = (0, _getContainer.default)(container, document.body);\n    modal.add(containerElement, containerClassName);\n\n    if (!documentKeyDownListener.current) {\n      documentKeyDownListener.current = (0, _on.default)(document, 'keydown', handleDocumentKeyDown);\n    }\n\n    if (!documentFocusListener.current) {\n      documentFocusListener.current = (0, _on.default)(document, 'focus', handleEnforceFocus, true);\n    }\n\n    if (autoFocus) {\n      handleFocusDialog(function () {\n        lastFocus.current = document.activeElement;\n      });\n    }\n\n    onOpen === null || onOpen === void 0 ? void 0 : onOpen();\n  });\n  var handleClose = (0, _utils2.useEventCallback)(function () {\n    var _documentKeyDownListe, _documentFocusListene;\n\n    modal.remove();\n    (_documentKeyDownListe = documentKeyDownListener.current) === null || _documentKeyDownListe === void 0 ? void 0 : _documentKeyDownListe.off();\n    documentKeyDownListener.current = null;\n    (_documentFocusListene = documentFocusListener.current) === null || _documentFocusListene === void 0 ? void 0 : _documentFocusListene.off();\n    documentFocusListener.current = null;\n    restoreLastFocus();\n  });\n  (0, _react.useEffect)(function () {\n    if (!open) {\n      return;\n    }\n\n    handleOpen();\n  }, [open, handleOpen]);\n  (0, _react.useEffect)(function () {\n    if (!exited) {\n      return;\n    }\n\n    handleClose();\n  }, [exited, handleClose]);\n  (0, _utils2.useWillUnmount)(function () {\n    handleClose();\n  });\n  var handleExited = (0, _react.useCallback)(function () {\n    setExited(true);\n  }, []);\n  var contextValue = (0, _react.useMemo)(function () {\n    return {\n      overlayContainer: function overlayContainer() {\n        return modal.dialog;\n      }\n    };\n  }, [modal.dialog]);\n\n  if (!mountModal) {\n    return null;\n  }\n\n  var renderBackdrop = function renderBackdrop() {\n    if (Transition) {\n      return /*#__PURE__*/_react.default.createElement(_Fade.default, {\n        transitionAppear: true,\n        in: open,\n        timeout: backdropTransitionTimeout,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 270,\n          columnNumber: 9\n        }\n      }, function (fadeProps, ref) {\n        var className = fadeProps.className,\n            rest = (0, _objectWithoutPropertiesLoose2.default)(fadeProps, [\"className\"]);\n        return /*#__PURE__*/_react.default.createElement(\"div\", (0, _extends2.default)({\n          \"aria-hidden\": true\n        }, rest, {\n          style: backdropStyle,\n          ref: (0, _utils2.mergeRefs)(modal.setBackdropRef, ref),\n          className: (0, _classnames.default)(backdropClassName, className),\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 274,\n            columnNumber: 15\n          }\n        }));\n      });\n    }\n\n    return /*#__PURE__*/_react.default.createElement(\"div\", {\n      \"aria-hidden\": true,\n      style: backdropStyle,\n      className: backdropClassName,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 287,\n        columnNumber: 12\n      }\n    });\n  };\n\n  var dialogElement = Transition ? /*#__PURE__*/_react.default.createElement(Transition, (0, _extends2.default)({}, animationProps, {\n    transitionAppear: true,\n    unmountOnExit: true,\n    in: open,\n    timeout: dialogTransitionTimeout,\n    onExit: onExit,\n    onExiting: onExiting,\n    onExited: (0, _utils2.createChainedFunction)(handleExited, onExited),\n    onEnter: onEnter,\n    onEntering: onEntering,\n    onEntered: onEntered,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 291,\n      columnNumber: 5\n    }\n  }), children) : children;\n  return /*#__PURE__*/_react.default.createElement(_OverlayContext.default.Provider, {\n    value: contextValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 311,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Portal, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 312,\n      columnNumber: 7\n    }\n  }, backdrop && renderBackdrop(), /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: (0, _utils2.mergeRefs)(modal.setDialogRef, ref),\n    style: style,\n    className: className,\n    tabIndex: -1,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 314,\n      columnNumber: 9\n    }\n  }), dialogElement)));\n});\n\nvar modalPropTypes = {\n  as: _propTypes.default.elementType,\n  className: _propTypes.default.string,\n  backdropClassName: _propTypes.default.string,\n  style: _propTypes.default.object,\n  backdropStyle: _propTypes.default.object,\n  open: _propTypes.default.bool,\n  backdrop: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.string]),\n  keyboard: _propTypes.default.bool,\n  autoFocus: _propTypes.default.bool,\n  enforceFocus: _propTypes.default.bool,\n  animationProps: _propTypes.default.object,\n  onOpen: _propTypes.default.func,\n  onClose: _propTypes.default.func\n};\nexports.modalPropTypes = modalPropTypes;\nModal.displayName = 'OverlayModal';\nModal.propTypes = (0, _extends2.default)({}, _utils.animationPropTypes, modalPropTypes, {\n  children: _propTypes.default.func,\n  container: _propTypes.default.any,\n  containerClassName: _propTypes.default.string,\n  dialogTransitionTimeout: _propTypes.default.number,\n  backdropTransitionTimeout: _propTypes.default.number,\n  transition: _propTypes.default.any,\n  onEsc: _propTypes.default.func\n});\nvar _default = Modal;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Overlay/Modal.tsx?");
 
 /***/ }),
 
@@ -3541,7 +3552,18 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = exports.overlayPropTypes = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ \"./node_modules/classnames/index.js\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _Position = _interopRequireDefault(__webpack_require__(/*! ./Position */ \"./src/Overlay/Position.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Fade = _interopRequireDefault(__webpack_require__(/*! ../Animation/Fade */ \"./src/Animation/Fade.tsx\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Overlay/Overlay.tsx\",\n    _this = void 0;\n\nvar overlayPropTypes = {\n  container: _propTypes.default.any,\n  children: _propTypes.default.any,\n  childrenProps: _propTypes.default.object,\n  className: _propTypes.default.string,\n  containerPadding: _propTypes.default.number,\n  placement: _propTypes.default.any,\n  preventOverflow: _propTypes.default.bool,\n  open: _propTypes.default.bool,\n  rootClose: _propTypes.default.bool,\n  transition: _propTypes.default.any,\n  triggerTarget: _propTypes.default.any,\n  onClose: _propTypes.default.func,\n  onEnter: _propTypes.default.func,\n  onEntering: _propTypes.default.func,\n  onEntered: _propTypes.default.func,\n  onExit: _propTypes.default.func,\n  onExiting: _propTypes.default.func,\n  onExited: _propTypes.default.func\n};\nexports.overlayPropTypes = overlayPropTypes;\n\nvar Overlay = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var container = props.container,\n      containerPadding = props.containerPadding,\n      placement = props.placement,\n      rootClose = props.rootClose,\n      children = props.children,\n      childrenProps = props.childrenProps,\n      _props$transition = props.transition,\n      Transition = _props$transition === void 0 ? _Fade.default : _props$transition,\n      open = props.open,\n      preventOverflow = props.preventOverflow,\n      triggerTarget = props.triggerTarget,\n      onClose = props.onClose,\n      onExited = props.onExited,\n      onExit = props.onExit,\n      onExiting = props.onExiting,\n      onEnter = props.onEnter,\n      onEntering = props.onEntering,\n      onEntered = props.onEntered;\n\n  var _useState = (0, _react.useState)(!open),\n      exited = _useState[0],\n      setExited = _useState[1];\n\n  var overlayTarget = (0, _react.useRef)(null);\n\n  if (open) {\n    if (exited) setExited(false);\n  } else if (!Transition && !exited) {\n    setExited(true);\n  }\n\n  var mountOverlay = open || Transition && !exited;\n  var handleExited = (0, _react.useCallback)(function (args) {\n    setExited(true);\n    onExited === null || onExited === void 0 ? void 0 : onExited(args);\n  }, [onExited]);\n  (0, _utils.useRootClose)(onClose, {\n    triggerTarget: triggerTarget,\n    overlayTarget: overlayTarget,\n    disabled: !rootClose || !mountOverlay\n  });\n\n  if (!mountOverlay) {\n    return null;\n  }\n\n  var positionProps = {\n    container: container,\n    containerPadding: containerPadding,\n    triggerTarget: triggerTarget,\n    placement: placement,\n    preventOverflow: preventOverflow\n  };\n\n  var renderChildWithPosition = function renderChildWithPosition(transitionProps, transitionRef) {\n    return /*#__PURE__*/_react.default.createElement(_Position.default, (0, _extends2.default)({}, positionProps, transitionProps, {\n      ref: (0, _utils.mergeRefs)(ref, transitionRef),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 101,\n        columnNumber: 7\n      }\n    }), function (childProps, childRef) {\n      // overlayTarget is the ref on the DOM of the Overlay.\n      if (typeof children === 'function') {\n        return children(Object.assign(childProps, childrenProps), (0, _utils.mergeRefs)(childRef, overlayTarget));\n      } // Position will return coordinates and className\n\n\n      var left = childProps.left,\n          top = childProps.top,\n          className = childProps.className;\n      return /*#__PURE__*/_react.default.cloneElement(children, (0, _extends2.default)({}, childrenProps, children.props, {\n        className: (0, _classnames.default)(className, children.props.className),\n        style: (0, _extends2.default)({\n          left: left,\n          top: top\n        }, children.props.style),\n        ref: (0, _utils.mergeRefs)(childRef, overlayTarget)\n      }));\n    });\n  };\n\n  if (Transition) {\n    return /*#__PURE__*/_react.default.createElement(Transition, {\n      in: open,\n      transitionAppear: true,\n      onExit: onExit,\n      onExiting: onExiting,\n      onExited: handleExited,\n      onEnter: onEnter,\n      onEntering: onEntering,\n      onEntered: onEntered,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 127,\n        columnNumber: 7\n      }\n    }, renderChildWithPosition);\n  }\n\n  return renderChildWithPosition();\n});\n\nOverlay.displayName = 'Overlay';\nOverlay.propTypes = overlayPropTypes;\nvar _default = Overlay;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Overlay/Overlay.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = exports.overlayPropTypes = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ \"./node_modules/classnames/index.js\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _Position = _interopRequireDefault(__webpack_require__(/*! ./Position */ \"./src/Overlay/Position.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Fade = _interopRequireDefault(__webpack_require__(/*! ../Animation/Fade */ \"./src/Animation/Fade.tsx\"));\n\nvar _OverlayContext = _interopRequireDefault(__webpack_require__(/*! ./OverlayContext */ \"./src/Overlay/OverlayContext.ts\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Overlay/Overlay.tsx\",\n    _this = void 0;\n\nvar overlayPropTypes = {\n  container: _propTypes.default.any,\n  children: _propTypes.default.any,\n  childrenProps: _propTypes.default.object,\n  className: _propTypes.default.string,\n  containerPadding: _propTypes.default.number,\n  placement: _propTypes.default.any,\n  preventOverflow: _propTypes.default.bool,\n  open: _propTypes.default.bool,\n  rootClose: _propTypes.default.bool,\n  transition: _propTypes.default.any,\n  triggerTarget: _propTypes.default.any,\n  onClose: _propTypes.default.func,\n  onEnter: _propTypes.default.func,\n  onEntering: _propTypes.default.func,\n  onEntered: _propTypes.default.func,\n  onExit: _propTypes.default.func,\n  onExiting: _propTypes.default.func,\n  onExited: _propTypes.default.func\n};\nexports.overlayPropTypes = overlayPropTypes;\n\nvar Overlay = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _useContext = (0, _react.useContext)(_OverlayContext.default),\n      overlayContainer = _useContext.overlayContainer;\n\n  var _props$container = props.container,\n      container = _props$container === void 0 ? overlayContainer : _props$container,\n      containerPadding = props.containerPadding,\n      placement = props.placement,\n      rootClose = props.rootClose,\n      children = props.children,\n      childrenProps = props.childrenProps,\n      _props$transition = props.transition,\n      Transition = _props$transition === void 0 ? _Fade.default : _props$transition,\n      open = props.open,\n      preventOverflow = props.preventOverflow,\n      triggerTarget = props.triggerTarget,\n      onClose = props.onClose,\n      onExited = props.onExited,\n      onExit = props.onExit,\n      onExiting = props.onExiting,\n      onEnter = props.onEnter,\n      onEntering = props.onEntering,\n      onEntered = props.onEntered;\n\n  var _useState = (0, _react.useState)(!open),\n      exited = _useState[0],\n      setExited = _useState[1];\n\n  var overlayTarget = (0, _react.useRef)(null);\n\n  if (open) {\n    if (exited) setExited(false);\n  } else if (!Transition && !exited) {\n    setExited(true);\n  }\n\n  var mountOverlay = open || Transition && !exited;\n  var handleExited = (0, _react.useCallback)(function (args) {\n    setExited(true);\n    onExited === null || onExited === void 0 ? void 0 : onExited(args);\n  }, [onExited]);\n  (0, _utils.useRootClose)(onClose, {\n    triggerTarget: triggerTarget,\n    overlayTarget: overlayTarget,\n    disabled: !rootClose || !mountOverlay\n  });\n\n  if (!mountOverlay) {\n    return null;\n  }\n\n  var positionProps = {\n    container: container,\n    containerPadding: containerPadding,\n    triggerTarget: triggerTarget,\n    placement: placement,\n    preventOverflow: preventOverflow\n  };\n\n  var renderChildWithPosition = function renderChildWithPosition(transitionProps, transitionRef) {\n    return /*#__PURE__*/_react.default.createElement(_Position.default, (0, _extends2.default)({}, positionProps, transitionProps, {\n      ref: (0, _utils.mergeRefs)(ref, transitionRef),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 103,\n        columnNumber: 7\n      }\n    }), function (childProps, childRef) {\n      // overlayTarget is the ref on the DOM of the Overlay.\n      if (typeof children === 'function') {\n        return children(Object.assign(childProps, childrenProps), (0, _utils.mergeRefs)(childRef, overlayTarget));\n      } // Position will return coordinates and className\n\n\n      var left = childProps.left,\n          top = childProps.top,\n          className = childProps.className;\n      return /*#__PURE__*/_react.default.cloneElement(children, (0, _extends2.default)({}, childrenProps, children.props, {\n        className: (0, _classnames.default)(className, children.props.className),\n        style: (0, _extends2.default)({\n          left: left,\n          top: top\n        }, children.props.style),\n        ref: (0, _utils.mergeRefs)(childRef, overlayTarget)\n      }));\n    });\n  };\n\n  if (Transition) {\n    return /*#__PURE__*/_react.default.createElement(Transition, {\n      in: open,\n      transitionAppear: true,\n      onExit: onExit,\n      onExiting: onExiting,\n      onExited: handleExited,\n      onEnter: onEnter,\n      onEntering: onEntering,\n      onEntered: onEntered,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 129,\n        columnNumber: 7\n      }\n    }, renderChildWithPosition);\n  }\n\n  return renderChildWithPosition();\n});\n\nOverlay.displayName = 'Overlay';\nOverlay.propTypes = overlayPropTypes;\nvar _default = Overlay;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Overlay/Overlay.tsx?");
+
+/***/ }),
+
+/***/ "./src/Overlay/OverlayContext.ts":
+/*!***************************************!*\
+  !*** ./src/Overlay/OverlayContext.ts ***!
+  \***************************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\n\nvar OverlayContext = /*#__PURE__*/_react.default.createContext({});\n\nOverlayContext.displayName = 'OverlayContext';\nvar _default = OverlayContext;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Overlay/OverlayContext.ts?");
 
 /***/ }),
 
@@ -3552,7 +3574,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _isUndefined2 = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _get = _interopRequireDefault(__webpack_require__(/*! lodash/get */ \"./node_modules/lodash/get.js\"));\n\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\n\nvar _contains = _interopRequireDefault(__webpack_require__(/*! dom-lib/contains */ \"./node_modules/dom-lib/esm/contains.js\"));\n\nvar _Overlay = _interopRequireDefault(__webpack_require__(/*! ./Overlay */ \"./src/Overlay/Overlay.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _isOneOf = _interopRequireDefault(__webpack_require__(/*! ../utils/isOneOf */ \"./src/utils/isOneOf.ts\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Overlay/OverlayTrigger.tsx\",\n    _this = void 0;\n\nfunction mergeEvents(events, props) {\n  if (events === void 0) {\n    events = {};\n  }\n\n  if (props === void 0) {\n    props = {};\n  }\n\n  var nextEvents = {};\n  Object.keys(events).forEach(function (eventName) {\n    if (events[eventName]) {\n      var _props;\n\n      nextEvents[eventName] = (0, _utils.createChainedFunction)(events[eventName], (_props = props) === null || _props === void 0 ? void 0 : _props[eventName]);\n    }\n  });\n  return nextEvents;\n}\n\n/**\n * Useful for mouseover and mouseout.\n * In order to resolve the node entering the mouseover element, a mouseout event and a mouseover event will be triggered.\n * https://javascript.info/mousemove-mouseover-mouseout-mouseenter-mouseleave\n * @param handler\n * @param event\n */\nfunction onMouseEventHandler(handler, event, delay) {\n  var target = event.currentTarget;\n  var related = event.relatedTarget || (0, _get.default)(event, ['nativeEvent', 'toElement']);\n\n  if ((!related || related !== target) && !(0, _contains.default)(target, related)) {\n    handler(event, delay);\n  }\n}\n\nvar defaultTrigger = ['hover', 'focus'];\n\nvar OverlayTrigger = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var children = props.children,\n      container = props.container,\n      controlId = props.controlId,\n      defaultOpen = props.defaultOpen,\n      _props$trigger = props.trigger,\n      trigger = _props$trigger === void 0 ? defaultTrigger : _props$trigger,\n      disabled = props.disabled,\n      readOnly = props.readOnly,\n      plaintext = props.plaintext,\n      openProp = props.open,\n      delay = props.delay,\n      delayOpenProp = props.delayOpen,\n      delayCloseProp = props.delayClose,\n      enterable = props.enterable,\n      _props$placement = props.placement,\n      placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n      speaker = props.speaker,\n      _props$rootClose = props.rootClose,\n      rootClose = _props$rootClose === void 0 ? true : _props$rootClose,\n      onClick = props.onClick,\n      onMouseOver = props.onMouseOver,\n      onMouseOut = props.onMouseOut,\n      onContextMenu = props.onContextMenu,\n      onFocus = props.onFocus,\n      onBlur = props.onBlur,\n      onClose = props.onClose,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"children\", \"container\", \"controlId\", \"defaultOpen\", \"trigger\", \"disabled\", \"readOnly\", \"plaintext\", \"open\", \"delay\", \"delayOpen\", \"delayClose\", \"enterable\", \"placement\", \"speaker\", \"rootClose\", \"onClick\", \"onMouseOver\", \"onMouseOut\", \"onContextMenu\", \"onFocus\", \"onBlur\", \"onClose\"]);\n\n  var _usePortal = (0, _utils.usePortal)({\n    container: container\n  }),\n      Portal = _usePortal.Portal;\n\n  var triggerRef = (0, _react.useRef)();\n  var overlayRef = (0, _react.useRef)();\n\n  var _useControlled = (0, _utils.useControlled)(openProp, defaultOpen),\n      open = _useControlled[0],\n      setOpen = _useControlled[1]; // Delay the timer to close/open the overlay\n  // When the cursor moves from the trigger to the overlay, the overlay will be closed.\n  // In order to keep the overlay open, a timer is used to delay the closing.\n\n\n  var delayOpenTimer = (0, _react.useRef)(null);\n  var delayCloseTimer = (0, _react.useRef)(null);\n  var delayOpen = (0, _isNil.default)(delayOpenProp) ? delay : delayOpenProp;\n  var delayClose = (0, _isNil.default)(delayCloseProp) ? delay : delayCloseProp; // Whether the cursor is on the overlay\n\n  var isOnOverlay = (0, _react.useRef)(false); // Whether the cursor is on the trigger\n\n  var isOnTrigger = (0, _react.useRef)(false);\n  (0, _react.useEffect)(function () {\n    return function () {\n      if (!(0, _isNil.default)(delayOpenTimer.current)) {\n        clearTimeout(delayOpenTimer.current);\n      }\n\n      if (!(0, _isNil.default)(delayCloseTimer.current)) {\n        clearTimeout(delayCloseTimer.current);\n      }\n    };\n  }, []);\n  var handleOpen = (0, _react.useCallback)(function (delay) {\n    var ms = (0, _isUndefined2.default)(delay) ? delayOpen : delay;\n\n    if (ms && typeof ms === 'number') {\n      return delayOpenTimer.current = setTimeout(function () {\n        delayOpenTimer.current = null;\n        setOpen(true);\n      }, ms);\n    }\n\n    setOpen(true);\n  }, [delayOpen, setOpen]);\n  var handleClose = (0, _react.useCallback)(function (delay) {\n    var ms = (0, _isUndefined2.default)(delay) ? delayClose : delay;\n\n    if (ms && typeof ms === 'number') {\n      return delayCloseTimer.current = setTimeout(function () {\n        delayCloseTimer.current = null;\n        setOpen(false);\n      }, ms);\n    }\n\n    setOpen(false);\n  }, [delayClose, setOpen]);\n  (0, _react.useImperativeHandle)(ref, function () {\n    return {\n      get root() {\n        return triggerRef.current;\n      },\n\n      get overlay() {\n        var _overlayRef$current;\n\n        return (_overlayRef$current = overlayRef.current) === null || _overlayRef$current === void 0 ? void 0 : _overlayRef$current.child;\n      },\n\n      open: handleOpen,\n      close: handleClose,\n      updatePosition: function updatePosition() {\n        var _overlayRef$current2, _overlayRef$current2$;\n\n        (_overlayRef$current2 = overlayRef.current) === null || _overlayRef$current2 === void 0 ? void 0 : (_overlayRef$current2$ = _overlayRef$current2.updatePosition) === null || _overlayRef$current2$ === void 0 ? void 0 : _overlayRef$current2$.call(_overlayRef$current2);\n      }\n    };\n  });\n  /**\n   * Close after the cursor leaves.\n   */\n\n  var handleCloseWhenLeave = (0, _react.useCallback)(function () {\n    // When the cursor is not on the overlay and not on the trigger, it is closed.\n    if (!isOnOverlay.current && !isOnTrigger.current) {\n      handleClose();\n    }\n  }, [handleClose]);\n  /**\n   * Toggle open and closed state.\n   */\n\n  var handleOpenState = (0, _react.useCallback)(function () {\n    if (open) {\n      handleCloseWhenLeave();\n    } else {\n      handleOpen();\n    }\n  }, [open, handleCloseWhenLeave, handleOpen]);\n  var handleDelayedOpen = (0, _react.useCallback)(function () {\n    if (!enterable) {\n      return handleOpen();\n    }\n\n    isOnTrigger.current = true;\n\n    if (!(0, _isNil.default)(delayCloseTimer.current)) {\n      clearTimeout(delayCloseTimer.current);\n      delayCloseTimer.current = null;\n      return handleOpen();\n    }\n\n    if (open) {\n      return;\n    }\n\n    handleOpen();\n  }, [enterable, open, handleOpen]);\n  var handleDelayedClose = (0, _react.useCallback)(function () {\n    if (!enterable) {\n      handleClose();\n    }\n\n    isOnTrigger.current = false;\n\n    if (!(0, _isNil.default)(delayOpenTimer.current)) {\n      clearTimeout(delayOpenTimer.current);\n      delayOpenTimer.current = null;\n      return;\n    }\n\n    if (!open || !(0, _isNil.default)(delayCloseTimer.current)) {\n      return;\n    }\n\n    delayCloseTimer.current = setTimeout(function () {\n      if (!(0, _isNil.default)(delayCloseTimer.current)) {\n        clearTimeout(delayCloseTimer.current);\n        delayCloseTimer.current = null;\n      }\n\n      handleCloseWhenLeave();\n    }, 200);\n  }, [enterable, open, handleClose, handleCloseWhenLeave]);\n  var handleSpeakerMouseEnter = (0, _react.useCallback)(function () {\n    isOnOverlay.current = true;\n  }, []);\n  var handleSpeakerMouseLeave = (0, _react.useCallback)(function () {\n    isOnOverlay.current = false;\n\n    if (!(0, _isOneOf.default)('click', trigger) && !(0, _isOneOf.default)('contextMenu', trigger) && !(0, _isOneOf.default)('active', trigger)) {\n      handleCloseWhenLeave();\n    }\n  }, [handleCloseWhenLeave, trigger]);\n  var preventDefault = (0, _react.useCallback)(function (event) {\n    event.preventDefault();\n  }, []);\n  var triggerEvents = {\n    onClick: onClick,\n    onContextMenu: onContextMenu,\n    onMouseOver: onMouseOver,\n    onMouseOut: onMouseOut,\n    onFocus: onFocus,\n    onBlur: onBlur\n  };\n\n  if (!disabled && !readOnly && !plaintext) {\n    if ((0, _isOneOf.default)('click', trigger)) {\n      triggerEvents.onClick = (0, _utils.createChainedFunction)(handleOpenState, triggerEvents.onClick);\n    }\n\n    if ((0, _isOneOf.default)('contextMenu', trigger)) {\n      triggerEvents.onContextMenu = (0, _utils.createChainedFunction)(preventDefault, handleOpenState, triggerEvents.onContextMenu);\n    }\n\n    if ((0, _isOneOf.default)('active', trigger)) {\n      triggerEvents.onClick = (0, _utils.createChainedFunction)(handleDelayedOpen, triggerEvents.onClick);\n    }\n\n    if ((0, _isOneOf.default)('hover', trigger)) {\n      var onMouseOverListener = null;\n      var onMouseOutListener = null;\n\n      if (trigger !== 'none') {\n        onMouseOverListener = function onMouseOverListener(e) {\n          return onMouseEventHandler(handleDelayedOpen, e);\n        };\n\n        onMouseOutListener = function onMouseOutListener(e) {\n          return onMouseEventHandler(handleDelayedClose, e);\n        };\n      }\n\n      triggerEvents.onMouseOver = (0, _utils.createChainedFunction)(onMouseOverListener, onMouseOver);\n      triggerEvents.onMouseOut = (0, _utils.createChainedFunction)(onMouseOutListener, onMouseOut);\n    }\n\n    if ((0, _isOneOf.default)('focus', trigger)) {\n      triggerEvents.onFocus = (0, _utils.createChainedFunction)(handleDelayedOpen, onFocus);\n      triggerEvents.onBlur = (0, _utils.createChainedFunction)(handleDelayedClose, onBlur);\n    }\n  }\n\n  var renderOverlay = function renderOverlay() {\n    var overlayProps = (0, _extends2.default)({}, rest, {\n      rootClose: rootClose,\n      triggerTarget: triggerRef,\n      onClose: trigger !== 'none' ? (0, _utils.createChainedFunction)(handleClose, onClose) : undefined,\n      placement: placement,\n      container: container,\n      open: open\n    });\n    var speakerProps = {\n      id: controlId\n    }; // The purpose of adding mouse entry and exit events to the Overlay is to record whether the current cursor is on the Overlay.\n    // When `trigger` is equal to `hover`, if the cursor leaves the `triggerTarget` and stays on the Overlay,\n    // the Overlay will continue to remain open.\n\n    if (trigger !== 'none' && enterable) {\n      speakerProps.onMouseEnter = handleSpeakerMouseEnter;\n      speakerProps.onMouseLeave = handleSpeakerMouseLeave;\n    }\n\n    return /*#__PURE__*/_react.default.createElement(_Overlay.default, (0, _extends2.default)({}, overlayProps, {\n      ref: overlayRef,\n      childrenProps: speakerProps,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 383,\n        columnNumber: 7\n      }\n    }), typeof speaker === 'function' ? function (props, ref) {\n      return speaker((0, _extends2.default)({}, props, {\n        onClose: handleClose\n      }), ref);\n    } : speaker);\n  };\n\n  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, typeof children === 'function' ? children(triggerEvents, triggerRef) : /*#__PURE__*/_react.default.cloneElement(children, (0, _extends2.default)({\n    ref: triggerRef,\n    'aria-describedby': controlId\n  }, mergeEvents(triggerEvents, children.props))), /*#__PURE__*/_react.default.createElement(Portal, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 401,\n      columnNumber: 7\n    }\n  }, renderOverlay()));\n});\n\nOverlayTrigger.displayName = 'OverlayTrigger';\nvar _default = OverlayTrigger;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Overlay/OverlayTrigger.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _isUndefined2 = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _get = _interopRequireDefault(__webpack_require__(/*! lodash/get */ \"./node_modules/lodash/get.js\"));\n\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\n\nvar _contains = _interopRequireDefault(__webpack_require__(/*! dom-lib/contains */ \"./node_modules/dom-lib/esm/contains.js\"));\n\nvar _Overlay = _interopRequireDefault(__webpack_require__(/*! ./Overlay */ \"./src/Overlay/Overlay.tsx\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _isOneOf = _interopRequireDefault(__webpack_require__(/*! ../utils/isOneOf */ \"./src/utils/isOneOf.ts\"));\n\nvar _OverlayContext = _interopRequireDefault(__webpack_require__(/*! ./OverlayContext */ \"./src/Overlay/OverlayContext.ts\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Overlay/OverlayTrigger.tsx\",\n    _this = void 0;\n\nfunction mergeEvents(events, props) {\n  if (events === void 0) {\n    events = {};\n  }\n\n  if (props === void 0) {\n    props = {};\n  }\n\n  var nextEvents = {};\n  Object.keys(events).forEach(function (eventName) {\n    if (events[eventName]) {\n      var _props;\n\n      nextEvents[eventName] = (0, _utils.createChainedFunction)(events[eventName], (_props = props) === null || _props === void 0 ? void 0 : _props[eventName]);\n    }\n  });\n  return nextEvents;\n}\n\n/**\n * Useful for mouseover and mouseout.\n * In order to resolve the node entering the mouseover element, a mouseout event and a mouseover event will be triggered.\n * https://javascript.info/mousemove-mouseover-mouseout-mouseenter-mouseleave\n * @param handler\n * @param event\n */\nfunction onMouseEventHandler(handler, event, delay) {\n  var target = event.currentTarget;\n  var related = event.relatedTarget || (0, _get.default)(event, ['nativeEvent', 'toElement']);\n\n  if ((!related || related !== target) && !(0, _contains.default)(target, related)) {\n    handler(event, delay);\n  }\n}\n\nvar defaultTrigger = ['hover', 'focus'];\n\nvar OverlayTrigger = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _useContext = (0, _react.useContext)(_OverlayContext.default),\n      overlayContainer = _useContext.overlayContainer;\n\n  var children = props.children,\n      _props$container = props.container,\n      container = _props$container === void 0 ? overlayContainer : _props$container,\n      controlId = props.controlId,\n      defaultOpen = props.defaultOpen,\n      _props$trigger = props.trigger,\n      trigger = _props$trigger === void 0 ? defaultTrigger : _props$trigger,\n      disabled = props.disabled,\n      readOnly = props.readOnly,\n      plaintext = props.plaintext,\n      openProp = props.open,\n      delay = props.delay,\n      delayOpenProp = props.delayOpen,\n      delayCloseProp = props.delayClose,\n      enterable = props.enterable,\n      _props$placement = props.placement,\n      placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n      speaker = props.speaker,\n      _props$rootClose = props.rootClose,\n      rootClose = _props$rootClose === void 0 ? true : _props$rootClose,\n      onClick = props.onClick,\n      onMouseOver = props.onMouseOver,\n      onMouseOut = props.onMouseOut,\n      onContextMenu = props.onContextMenu,\n      onFocus = props.onFocus,\n      onBlur = props.onBlur,\n      onClose = props.onClose,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"children\", \"container\", \"controlId\", \"defaultOpen\", \"trigger\", \"disabled\", \"readOnly\", \"plaintext\", \"open\", \"delay\", \"delayOpen\", \"delayClose\", \"enterable\", \"placement\", \"speaker\", \"rootClose\", \"onClick\", \"onMouseOver\", \"onMouseOut\", \"onContextMenu\", \"onFocus\", \"onBlur\", \"onClose\"]);\n\n  var _usePortal = (0, _utils.usePortal)({\n    container: container\n  }),\n      Portal = _usePortal.Portal;\n\n  var triggerRef = (0, _react.useRef)();\n  var overlayRef = (0, _react.useRef)();\n\n  var _useControlled = (0, _utils.useControlled)(openProp, defaultOpen),\n      open = _useControlled[0],\n      setOpen = _useControlled[1]; // Delay the timer to close/open the overlay\n  // When the cursor moves from the trigger to the overlay, the overlay will be closed.\n  // In order to keep the overlay open, a timer is used to delay the closing.\n\n\n  var delayOpenTimer = (0, _react.useRef)(null);\n  var delayCloseTimer = (0, _react.useRef)(null);\n  var delayOpen = (0, _isNil.default)(delayOpenProp) ? delay : delayOpenProp;\n  var delayClose = (0, _isNil.default)(delayCloseProp) ? delay : delayCloseProp; // Whether the cursor is on the overlay\n\n  var isOnOverlay = (0, _react.useRef)(false); // Whether the cursor is on the trigger\n\n  var isOnTrigger = (0, _react.useRef)(false);\n  (0, _react.useEffect)(function () {\n    return function () {\n      if (!(0, _isNil.default)(delayOpenTimer.current)) {\n        clearTimeout(delayOpenTimer.current);\n      }\n\n      if (!(0, _isNil.default)(delayCloseTimer.current)) {\n        clearTimeout(delayCloseTimer.current);\n      }\n    };\n  }, []);\n  var handleOpen = (0, _react.useCallback)(function (delay) {\n    var ms = (0, _isUndefined2.default)(delay) ? delayOpen : delay;\n\n    if (ms && typeof ms === 'number') {\n      return delayOpenTimer.current = setTimeout(function () {\n        delayOpenTimer.current = null;\n        setOpen(true);\n      }, ms);\n    }\n\n    setOpen(true);\n  }, [delayOpen, setOpen]);\n  var handleClose = (0, _react.useCallback)(function (delay) {\n    var ms = (0, _isUndefined2.default)(delay) ? delayClose : delay;\n\n    if (ms && typeof ms === 'number') {\n      return delayCloseTimer.current = setTimeout(function () {\n        delayCloseTimer.current = null;\n        setOpen(false);\n      }, ms);\n    }\n\n    setOpen(false);\n  }, [delayClose, setOpen]);\n  (0, _react.useImperativeHandle)(ref, function () {\n    return {\n      get root() {\n        return triggerRef.current;\n      },\n\n      get overlay() {\n        var _overlayRef$current;\n\n        return (_overlayRef$current = overlayRef.current) === null || _overlayRef$current === void 0 ? void 0 : _overlayRef$current.child;\n      },\n\n      open: handleOpen,\n      close: handleClose,\n      updatePosition: function updatePosition() {\n        var _overlayRef$current2, _overlayRef$current2$;\n\n        (_overlayRef$current2 = overlayRef.current) === null || _overlayRef$current2 === void 0 ? void 0 : (_overlayRef$current2$ = _overlayRef$current2.updatePosition) === null || _overlayRef$current2$ === void 0 ? void 0 : _overlayRef$current2$.call(_overlayRef$current2);\n      }\n    };\n  });\n  /**\n   * Close after the cursor leaves.\n   */\n\n  var handleCloseWhenLeave = (0, _react.useCallback)(function () {\n    // When the cursor is not on the overlay and not on the trigger, it is closed.\n    if (!isOnOverlay.current && !isOnTrigger.current) {\n      handleClose();\n    }\n  }, [handleClose]);\n  /**\n   * Toggle open and closed state.\n   */\n\n  var handleOpenState = (0, _react.useCallback)(function () {\n    if (open) {\n      handleCloseWhenLeave();\n    } else {\n      handleOpen();\n    }\n  }, [open, handleCloseWhenLeave, handleOpen]);\n  var handleDelayedOpen = (0, _react.useCallback)(function () {\n    if (!enterable) {\n      return handleOpen();\n    }\n\n    isOnTrigger.current = true;\n\n    if (!(0, _isNil.default)(delayCloseTimer.current)) {\n      clearTimeout(delayCloseTimer.current);\n      delayCloseTimer.current = null;\n      return handleOpen();\n    }\n\n    if (open) {\n      return;\n    }\n\n    handleOpen();\n  }, [enterable, open, handleOpen]);\n  var handleDelayedClose = (0, _react.useCallback)(function () {\n    if (!enterable) {\n      handleClose();\n    }\n\n    isOnTrigger.current = false;\n\n    if (!(0, _isNil.default)(delayOpenTimer.current)) {\n      clearTimeout(delayOpenTimer.current);\n      delayOpenTimer.current = null;\n      return;\n    }\n\n    if (!open || !(0, _isNil.default)(delayCloseTimer.current)) {\n      return;\n    }\n\n    delayCloseTimer.current = setTimeout(function () {\n      if (!(0, _isNil.default)(delayCloseTimer.current)) {\n        clearTimeout(delayCloseTimer.current);\n        delayCloseTimer.current = null;\n      }\n\n      handleCloseWhenLeave();\n    }, 200);\n  }, [enterable, open, handleClose, handleCloseWhenLeave]);\n  var handleSpeakerMouseEnter = (0, _react.useCallback)(function () {\n    isOnOverlay.current = true;\n  }, []);\n  var handleSpeakerMouseLeave = (0, _react.useCallback)(function () {\n    isOnOverlay.current = false;\n\n    if (!(0, _isOneOf.default)('click', trigger) && !(0, _isOneOf.default)('contextMenu', trigger) && !(0, _isOneOf.default)('active', trigger)) {\n      handleCloseWhenLeave();\n    }\n  }, [handleCloseWhenLeave, trigger]);\n  var preventDefault = (0, _react.useCallback)(function (event) {\n    event.preventDefault();\n  }, []);\n  var triggerEvents = {\n    onClick: onClick,\n    onContextMenu: onContextMenu,\n    onMouseOver: onMouseOver,\n    onMouseOut: onMouseOut,\n    onFocus: onFocus,\n    onBlur: onBlur\n  };\n\n  if (!disabled && !readOnly && !plaintext) {\n    if ((0, _isOneOf.default)('click', trigger)) {\n      triggerEvents.onClick = (0, _utils.createChainedFunction)(handleOpenState, triggerEvents.onClick);\n    }\n\n    if ((0, _isOneOf.default)('contextMenu', trigger)) {\n      triggerEvents.onContextMenu = (0, _utils.createChainedFunction)(preventDefault, handleOpenState, triggerEvents.onContextMenu);\n    }\n\n    if ((0, _isOneOf.default)('active', trigger)) {\n      triggerEvents.onClick = (0, _utils.createChainedFunction)(handleDelayedOpen, triggerEvents.onClick);\n    }\n\n    if ((0, _isOneOf.default)('hover', trigger)) {\n      var onMouseOverListener = null;\n      var onMouseOutListener = null;\n\n      if (trigger !== 'none') {\n        onMouseOverListener = function onMouseOverListener(e) {\n          return onMouseEventHandler(handleDelayedOpen, e);\n        };\n\n        onMouseOutListener = function onMouseOutListener(e) {\n          return onMouseEventHandler(handleDelayedClose, e);\n        };\n      }\n\n      triggerEvents.onMouseOver = (0, _utils.createChainedFunction)(onMouseOverListener, onMouseOver);\n      triggerEvents.onMouseOut = (0, _utils.createChainedFunction)(onMouseOutListener, onMouseOut);\n    }\n\n    if ((0, _isOneOf.default)('focus', trigger)) {\n      triggerEvents.onFocus = (0, _utils.createChainedFunction)(handleDelayedOpen, onFocus);\n      triggerEvents.onBlur = (0, _utils.createChainedFunction)(handleDelayedClose, onBlur);\n    }\n  }\n\n  var renderOverlay = function renderOverlay() {\n    var overlayProps = (0, _extends2.default)({}, rest, {\n      rootClose: rootClose,\n      triggerTarget: triggerRef,\n      onClose: trigger !== 'none' ? (0, _utils.createChainedFunction)(handleClose, onClose) : undefined,\n      placement: placement,\n      container: container,\n      open: open\n    });\n    var speakerProps = {\n      id: controlId\n    }; // The purpose of adding mouse entry and exit events to the Overlay is to record whether the current cursor is on the Overlay.\n    // When `trigger` is equal to `hover`, if the cursor leaves the `triggerTarget` and stays on the Overlay,\n    // the Overlay will continue to remain open.\n\n    if (trigger !== 'none' && enterable) {\n      speakerProps.onMouseEnter = handleSpeakerMouseEnter;\n      speakerProps.onMouseLeave = handleSpeakerMouseLeave;\n    }\n\n    return /*#__PURE__*/_react.default.createElement(_Overlay.default, (0, _extends2.default)({}, overlayProps, {\n      ref: overlayRef,\n      childrenProps: speakerProps,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 384,\n        columnNumber: 7\n      }\n    }), typeof speaker === 'function' ? function (props, ref) {\n      return speaker((0, _extends2.default)({}, props, {\n        onClose: handleClose\n      }), ref);\n    } : speaker);\n  };\n\n  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, typeof children === 'function' ? children(triggerEvents, triggerRef) : /*#__PURE__*/_react.default.cloneElement(children, (0, _extends2.default)({\n    ref: triggerRef,\n    'aria-describedby': controlId\n  }, mergeEvents(triggerEvents, children.props))), /*#__PURE__*/_react.default.createElement(Portal, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 402,\n      columnNumber: 7\n    }\n  }, renderOverlay()));\n});\n\nOverlayTrigger.displayName = 'OverlayTrigger';\nvar _default = OverlayTrigger;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Overlay/OverlayTrigger.tsx?");
 
 /***/ }),
 
@@ -3651,7 +3673,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = exports.PanelGroupContext = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/PanelGroup/PanelGroup.tsx\",\n    _this = void 0;\n\nvar PanelGroupContext = /*#__PURE__*/_react.default.createContext({});\n\nexports.PanelGroupContext = PanelGroupContext;\n\nvar PanelGroup = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      accordion = props.accordion,\n      defaultActiveKey = props.defaultActiveKey,\n      bordered = props.bordered,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'panel-group' : _props$classPrefix,\n      children = props.children,\n      activeProp = props.activeKey,\n      onSelect = props.onSelect,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"accordion\", \"defaultActiveKey\", \"bordered\", \"className\", \"classPrefix\", \"children\", \"activeKey\", \"onSelect\"]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var _useControlled = (0, _utils.useControlled)(activeProp, defaultActiveKey),\n      activeKey = _useControlled[0],\n      setActiveKey = _useControlled[1];\n\n  var classes = merge(className, withClassPrefix({\n    accordion: accordion,\n    bordered: bordered\n  }));\n  var handleSelect = (0, _react.useCallback)(function (activeKey, event) {\n    setActiveKey(activeKey);\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(activeKey, event);\n  }, [onSelect, setActiveKey]);\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: ref,\n    role: accordion ? 'tablist' : undefined,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 67,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(PanelGroupContext.Provider, {\n    value: {\n      accordion: accordion,\n      activeKey: activeKey,\n      onGroupSelect: handleSelect\n    },\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 68,\n      columnNumber: 7\n    }\n  }, children));\n});\n\nPanelGroup.displayName = 'PanelGroup';\nPanelGroup.propTypes = {\n  accordion: _propTypes.default.bool,\n  activeKey: _propTypes.default.any,\n  bordered: _propTypes.default.bool,\n  defaultActiveKey: _propTypes.default.any,\n  className: _propTypes.default.string,\n  children: _propTypes.default.node,\n  classPrefix: _propTypes.default.string,\n  onSelect: _propTypes.default.func\n};\nvar _default = PanelGroup;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/PanelGroup/PanelGroup.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = exports.PanelGroupContext = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/PanelGroup/PanelGroup.tsx\",\n    _this = void 0;\n\nvar PanelGroupContext = /*#__PURE__*/_react.default.createContext({});\n\nexports.PanelGroupContext = PanelGroupContext;\n\nvar PanelGroup = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      accordion = props.accordion,\n      defaultActiveKey = props.defaultActiveKey,\n      bordered = props.bordered,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'panel-group' : _props$classPrefix,\n      children = props.children,\n      activeProp = props.activeKey,\n      onSelect = props.onSelect,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"accordion\", \"defaultActiveKey\", \"bordered\", \"className\", \"classPrefix\", \"children\", \"activeKey\", \"onSelect\"]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge;\n\n  var _useControlled = (0, _utils.useControlled)(activeProp, defaultActiveKey),\n      activeKey = _useControlled[0],\n      setActiveKey = _useControlled[1];\n\n  var classes = merge(className, withClassPrefix({\n    accordion: accordion,\n    bordered: bordered\n  }));\n  var handleSelect = (0, _react.useCallback)(function (activeKey, event) {\n    setActiveKey(activeKey);\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(activeKey, event);\n  }, [onSelect, setActiveKey]);\n  var contextValue = (0, _react.useMemo)(function () {\n    return {\n      accordion: accordion,\n      activeKey: activeKey,\n      onGroupSelect: handleSelect\n    };\n  }, [accordion, activeKey, handleSelect]);\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: ref,\n    role: accordion ? 'tablist' : undefined,\n    className: classes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 72,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(PanelGroupContext.Provider, {\n    value: contextValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 73,\n      columnNumber: 7\n    }\n  }, children));\n});\n\nPanelGroup.displayName = 'PanelGroup';\nPanelGroup.propTypes = {\n  accordion: _propTypes.default.bool,\n  activeKey: _propTypes.default.any,\n  bordered: _propTypes.default.bool,\n  defaultActiveKey: _propTypes.default.any,\n  className: _propTypes.default.string,\n  children: _propTypes.default.node,\n  classPrefix: _propTypes.default.string,\n  onSelect: _propTypes.default.func\n};\nvar _default = PanelGroup;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/PanelGroup/PanelGroup.tsx?");
 
 /***/ }),
 
@@ -3805,7 +3827,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.listPickerPropTypes = exports.pickerPropTypes = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _utils2 = __webpack_require__(/*! ../Animation/utils */ \"./src/Animation/utils.ts\");\n\nvar pickerPropTypes = (0, _extends2.default)({}, _utils2.animationPropTypes, {\n  classPrefix: _propTypes.default.string,\n  className: _propTypes.default.string,\n  style: _propTypes.default.object,\n  locale: _propTypes.default.any,\n  appearance: _propTypes.default.oneOf(['default', 'subtle']),\n  block: _propTypes.default.bool,\n  containerPadding: _propTypes.default.number,\n  container: _propTypes.default.oneOfType([_propTypes.default.any, _propTypes.default.func]),\n  disabled: _propTypes.default.bool,\n  toggleAs: _propTypes.default.elementType,\n  menuClassName: _propTypes.default.string,\n  menuStyle: _propTypes.default.object,\n  placeholder: _propTypes.default.node,\n  placement: _propTypes.default.oneOf(_utils.PLACEMENT),\n\n  /**\n   * Prevent floating element overflow\n   */\n  preventOverflow: _propTypes.default.bool,\n  open: _propTypes.default.bool,\n  defaultOpen: _propTypes.default.bool,\n  cleanable: _propTypes.default.bool,\n  renderExtraFooter: _propTypes.default.func,\n  renderValue: _propTypes.default.func,\n  onOpen: _propTypes.default.func,\n  onClose: _propTypes.default.func,\n  onClean: _propTypes.default.func,\n  listProps: _propTypes.default.object\n});\nexports.pickerPropTypes = pickerPropTypes;\nvar listPickerPropTypes = (0, _extends2.default)({}, pickerPropTypes, {\n  data: _propTypes.default.array,\n  valueKey: _propTypes.default.string,\n  labelKey: _propTypes.default.string,\n  childrenKey: _propTypes.default.string,\n  disabledItemValues: _propTypes.default.array,\n  value: _propTypes.default.any,\n  defaultValue: _propTypes.default.any,\n  onChange: _propTypes.default.func\n});\nexports.listPickerPropTypes = listPickerPropTypes;\n\n//# sourceURL=webpack://rsuite/./src/Picker/propTypes.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.listPickerPropTypes = exports.pickerPropTypes = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _utils2 = __webpack_require__(/*! ../Animation/utils */ \"./src/Animation/utils.ts\");\n\nvar pickerPropTypes = (0, _extends2.default)({}, _utils2.animationPropTypes, {\n  classPrefix: _propTypes.default.string,\n  className: _propTypes.default.string,\n  style: _propTypes.default.object,\n  locale: _propTypes.default.any,\n  appearance: _propTypes.default.oneOf(['default', 'subtle']),\n  block: _propTypes.default.bool,\n  containerPadding: _propTypes.default.number,\n  container: _propTypes.default.oneOfType([_propTypes.default.any, _propTypes.default.func]),\n  disabled: _propTypes.default.bool,\n  // PropTypes.elementType conflictin with React.ElementType\n  // toggleAs: PropTypes.elementType,\n  menuClassName: _propTypes.default.string,\n  menuStyle: _propTypes.default.object,\n  placeholder: _propTypes.default.node,\n  placement: _propTypes.default.oneOf(_utils.PLACEMENT),\n\n  /**\n   * Prevent floating element overflow\n   */\n  preventOverflow: _propTypes.default.bool,\n  open: _propTypes.default.bool,\n  defaultOpen: _propTypes.default.bool,\n  cleanable: _propTypes.default.bool,\n  renderExtraFooter: _propTypes.default.func,\n  renderValue: _propTypes.default.func,\n  onOpen: _propTypes.default.func,\n  onClose: _propTypes.default.func,\n  onClean: _propTypes.default.func,\n  listProps: _propTypes.default.any\n});\nexports.pickerPropTypes = pickerPropTypes;\nvar listPickerPropTypes = (0, _extends2.default)({}, pickerPropTypes, {\n  data: _propTypes.default.array.isRequired,\n  valueKey: _propTypes.default.string,\n  labelKey: _propTypes.default.string,\n  childrenKey: _propTypes.default.string,\n  disabledItemValues: _propTypes.default.array,\n  value: _propTypes.default.any,\n  defaultValue: _propTypes.default.any,\n  onChange: _propTypes.default.func\n});\nexports.listPickerPropTypes = listPickerPropTypes;\n\n//# sourceURL=webpack://rsuite/./src/Picker/propTypes.ts?");
 
 /***/ }),
 
@@ -4168,7 +4190,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\n\nvar _isUndefined = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\n\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\n\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\n\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Picker = __webpack_require__(/*! ../Picker */ \"./src/Picker/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/SelectPicker/SelectPicker.tsx\",\n    _this = void 0,\n    _templateObject;\n\nvar emptyArray = [];\n\nvar SelectPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$appearance = props.appearance,\n      appearance = _props$appearance === void 0 ? 'default' : _props$appearance,\n      _props$data = props.data,\n      data = _props$data === void 0 ? emptyArray : _props$data,\n      _props$valueKey = props.valueKey,\n      valueKey = _props$valueKey === void 0 ? 'value' : _props$valueKey,\n      _props$labelKey = props.labelKey,\n      labelKey = _props$labelKey === void 0 ? 'label' : _props$labelKey,\n      valueProp = props.value,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n      placeholder = props.placeholder,\n      defaultValue = props.defaultValue,\n      disabled = props.disabled,\n      _props$cleanable = props.cleanable,\n      cleanable = _props$cleanable === void 0 ? true : _props$cleanable,\n      _props$placement = props.placement,\n      placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n      menuClassName = props.menuClassName,\n      _props$menuAutoWidth = props.menuAutoWidth,\n      menuAutoWidth = _props$menuAutoWidth === void 0 ? true : _props$menuAutoWidth,\n      _props$menuMaxHeight = props.menuMaxHeight,\n      menuMaxHeight = _props$menuMaxHeight === void 0 ? 320 : _props$menuMaxHeight,\n      menuStyle = props.menuStyle,\n      groupBy = props.groupBy,\n      overrideLocale = props.locale,\n      toggleAs = props.toggleAs,\n      style = props.style,\n      _props$searchable = props.searchable,\n      searchable = _props$searchable === void 0 ? true : _props$searchable,\n      _props$disabledItemVa = props.disabledItemValues,\n      disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,\n      virtualized = props.virtualized,\n      listProps = props.listProps,\n      id = props.id,\n      onGroupTitleClick = props.onGroupTitleClick,\n      searchBy = props.searchBy,\n      onEntered = props.onEntered,\n      onExited = props.onExited,\n      onClean = props.onClean,\n      onChange = props.onChange,\n      onSelect = props.onSelect,\n      onSearch = props.onSearch,\n      onClose = props.onClose,\n      onOpen = props.onOpen,\n      sort = props.sort,\n      renderValue = props.renderValue,\n      renderMenu = props.renderMenu,\n      renderMenuGroup = props.renderMenuGroup,\n      renderMenuItem = props.renderMenuItem,\n      renderExtraFooter = props.renderExtraFooter,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"appearance\", \"data\", \"valueKey\", \"labelKey\", \"value\", \"classPrefix\", \"placeholder\", \"defaultValue\", \"disabled\", \"cleanable\", \"placement\", \"menuClassName\", \"menuAutoWidth\", \"menuMaxHeight\", \"menuStyle\", \"groupBy\", \"locale\", \"toggleAs\", \"style\", \"searchable\", \"disabledItemValues\", \"virtualized\", \"listProps\", \"id\", \"onGroupTitleClick\", \"searchBy\", \"onEntered\", \"onExited\", \"onClean\", \"onChange\", \"onSelect\", \"onSearch\", \"onClose\", \"onOpen\", \"sort\", \"renderValue\", \"renderMenu\", \"renderMenuGroup\", \"renderMenuItem\", \"renderExtraFooter\"]);\n  var triggerRef = (0, _react.useRef)(null);\n  var targetRef = (0, _react.useRef)(null);\n  var overlayRef = (0, _react.useRef)(null);\n  var searchInputRef = (0, _react.useRef)(null);\n\n  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),\n      locale = _useCustom.locale;\n\n  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue),\n      value = _useControlled[0],\n      setValue = _useControlled[1]; // Used to hover the focus item  when trigger `onKeydown`\n\n\n  var _useFocusItemValue = (0, _Picker.useFocusItemValue)(value, {\n    data: data,\n    valueKey: valueKey,\n    target: function target() {\n      return overlayRef.current;\n    }\n  }),\n      focusItemValue = _useFocusItemValue.focusItemValue,\n      setFocusItemValue = _useFocusItemValue.setFocusItemValue,\n      onFocusItem = _useFocusItemValue.onKeyDown; // Use search keywords to filter options.\n\n\n  var _useSearch = (0, _Picker.useSearch)({\n    labelKey: labelKey,\n    data: data,\n    searchBy: searchBy,\n    callback: function callback(searchKeyword, filteredData, event) {\n      var _filteredData$;\n\n      // The first option after filtering is the focus.\n      setFocusItemValue(filteredData === null || filteredData === void 0 ? void 0 : (_filteredData$ = filteredData[0]) === null || _filteredData$ === void 0 ? void 0 : _filteredData$[valueKey]);\n      onSearch === null || onSearch === void 0 ? void 0 : onSearch(searchKeyword, event);\n    }\n  }),\n      searchKeyword = _useSearch.searchKeyword,\n      filteredData = _useSearch.filteredData,\n      updateFilteredData = _useSearch.updateFilteredData,\n      setSearchKeyword = _useSearch.setSearchKeyword,\n      handleSearch = _useSearch.handleSearch;\n\n  (0, _react.useEffect)(function () {\n    updateFilteredData(data);\n  }, [data, updateFilteredData]); // Use component active state to support keyboard events.\n\n  var _useState = (0, _react.useState)(false),\n      active = _useState[0],\n      setActive = _useState[1];\n\n  var handleClose = (0, _react.useCallback)(function () {\n    var _triggerRef$current, _triggerRef$current$c;\n\n    (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : (_triggerRef$current$c = _triggerRef$current.close) === null || _triggerRef$current$c === void 0 ? void 0 : _triggerRef$current$c.call(_triggerRef$current);\n  }, []);\n  var handleSelect = (0, _react.useCallback)(function (value, item, event) {\n    var _targetRef$current;\n\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(value, item, event);\n    (_targetRef$current = targetRef.current) === null || _targetRef$current === void 0 ? void 0 : _targetRef$current.focus();\n  }, [onSelect]);\n  var handleChangeValue = (0, _react.useCallback)(function (value, event) {\n    onChange === null || onChange === void 0 ? void 0 : onChange(value, event);\n  }, [onChange]);\n  var handleMenuPressEnter = (0, _react.useCallback)(function (event) {\n    if (!focusItemValue) {\n      return;\n    } // Find active `MenuItem` by `value`\n\n\n    var focusItem = data.find(function (item) {\n      return (0, _utils.shallowEqual)(item[valueKey], focusItemValue);\n    });\n    setValue(focusItemValue);\n    handleSelect(focusItemValue, focusItem, event);\n    handleChangeValue(focusItemValue, event);\n    handleClose();\n  }, [data, focusItemValue, handleChangeValue, handleClose, handleSelect, setValue, valueKey]);\n  var handleItemSelect = (0, _react.useCallback)(function (value, item, event) {\n    setValue(value);\n    setFocusItemValue(value);\n    handleSelect(value, item, event);\n    handleChangeValue(value, event);\n    handleClose();\n  }, [setValue, setFocusItemValue, handleSelect, handleChangeValue, handleClose]);\n  var handleClean = (0, _react.useCallback)(function (event) {\n    if (disabled || !cleanable) {\n      return;\n    }\n\n    setValue(null);\n    setFocusItemValue(value);\n    handleChangeValue(null, event);\n  }, [value, disabled, cleanable, setValue, handleChangeValue, setFocusItemValue]);\n  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !focusItemValue || !active,\n    triggerRef: triggerRef,\n    targetRef: targetRef,\n    overlayRef: overlayRef,\n    searchInputRef: searchInputRef,\n    active: active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter,\n    onClose: function onClose() {\n      setFocusItemValue(null);\n    }\n  }, rest));\n  var handleExited = (0, _react.useCallback)(function () {\n    setSearchKeyword('');\n    setActive(false);\n    onClose === null || onClose === void 0 ? void 0 : onClose();\n  }, [onClose, setSearchKeyword]);\n  var handleEntered = (0, _react.useCallback)(function () {\n    setActive(true);\n    setFocusItemValue(value);\n    onOpen === null || onOpen === void 0 ? void 0 : onOpen();\n  }, [onOpen, setFocusItemValue, value]);\n  (0, _Picker.usePublicMethods)(ref, {\n    triggerRef: triggerRef,\n    overlayRef: overlayRef,\n    targetRef: targetRef\n  }); // Find active `MenuItem` by `value`\n\n  var activeItem = data.find(function (item) {\n    return (0, _utils.shallowEqual)(item[valueKey], value);\n  });\n  /**\n   * 1.Have a value and the value is valid.\n   * 2.Regardless of whether the value is valid, as long as renderValue is set, it is judged to have a value.\n   */\n\n  var hasValue = !!activeItem || !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      prefix = _useClassNames.prefix,\n      merge = _useClassNames.merge;\n\n  var selectedElement = placeholder;\n\n  if (activeItem !== null && activeItem !== void 0 && activeItem[labelKey]) {\n    selectedElement = activeItem[labelKey];\n  }\n\n  if (!(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue)) {\n    selectedElement = renderValue(value, activeItem, selectedElement); // If renderValue returns null or undefined, hasValue is false.\n\n    if ((0, _isNil.default)(selectedElement)) {\n      hasValue = false;\n    }\n  }\n\n  var renderDropdownMenu = function renderDropdownMenu(positionProps, speakerRef) {\n    var left = positionProps.left,\n        top = positionProps.top,\n        className = positionProps.className;\n    var classes = merge(className, menuClassName, prefix('select-menu'));\n    var styles = (0, _extends2.default)({}, menuStyle, {\n      left: left,\n      top: top\n    });\n    var items = filteredData; // Create a tree structure data when set `groupBy`\n\n    if (groupBy) {\n      items = (0, _utils.getDataGroupBy)(items, groupBy, sort);\n    } else if (typeof sort === 'function') {\n      items = items.sort(sort(false));\n    }\n\n    var menu = items.length ? /*#__PURE__*/_react.default.createElement(_Picker.DropdownMenu, {\n      id: id ? id + \"-listbox\" : undefined,\n      listProps: listProps,\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      renderMenuGroup: renderMenuGroup,\n      renderMenuItem: renderMenuItem,\n      maxHeight: menuMaxHeight,\n      classPrefix: 'picker-select-menu',\n      dropdownMenuItemClassPrefix: 'picker-select-menu-item',\n      dropdownMenuItemAs: _Picker.DropdownMenuItem,\n      activeItemValues: [value],\n      focusItemValue: focusItemValue,\n      data: items,\n      group: !(0, _isUndefined.default)(groupBy),\n      onSelect: handleItemSelect,\n      onGroupTitleClick: onGroupTitleClick,\n      virtualized: virtualized,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 317,\n        columnNumber: 9\n      }\n    }) : /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)([\"none\"]))),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 338,\n        columnNumber: 9\n      }\n    }, locale === null || locale === void 0 ? void 0 : locale.noResultsText);\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerOverlay, {\n      ref: (0, _utils.mergeRefs)(overlayRef, speakerRef),\n      autoWidth: menuAutoWidth,\n      className: classes,\n      style: styles,\n      onKeyDown: onPickerKeyDown,\n      target: triggerRef,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 342,\n        columnNumber: 9\n      }\n    }, searchable && /*#__PURE__*/_react.default.createElement(_Picker.SearchBar, {\n      placeholder: locale === null || locale === void 0 ? void 0 : locale.searchPlaceholder,\n      onChange: handleSearch,\n      value: searchKeyword,\n      inputRef: searchInputRef,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 351,\n        columnNumber: 13\n      }\n    }), renderMenu ? renderMenu(menu) : menu, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n    classPrefix: classPrefix,\n    appearance: appearance,\n    hasValue: hasValue,\n    name: 'select',\n    cleanable: cleanable\n  })),\n      classes = _usePickerClassName[0],\n      usedClassNamePropKeys = _usePickerClassName[1];\n\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: triggerRef,\n    placement: placement,\n    onEntered: (0, _utils.createChainedFunction)(handleEntered, onEntered),\n    onExited: (0, _utils.createChainedFunction)(handleExited, onExited),\n    speaker: renderDropdownMenu,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 375,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 383,\n      columnNumber: 9\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys)), {\n    id: id,\n    ref: targetRef,\n    appearance: appearance,\n    onClean: (0, _utils.createChainedFunction)(handleClean, onClean),\n    onKeyDown: onPickerKeyDown,\n    as: toggleAs,\n    disabled: disabled,\n    cleanable: cleanable && !disabled,\n    hasValue: hasValue,\n    inputValue: value,\n    active: active,\n    placement: placement,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 384,\n      columnNumber: 11\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder))));\n});\n\nSelectPicker.displayName = 'SelectPicker';\nSelectPicker.propTypes = (0, _extends2.default)({}, _Picker.listPickerPropTypes, {\n  locale: _propTypes.default.any,\n  appearance: _propTypes.default.oneOf(['default', 'subtle']),\n  menuAutoWidth: _propTypes.default.bool,\n  menuMaxHeight: _propTypes.default.number,\n  renderMenu: _propTypes.default.func,\n  renderMenuItem: _propTypes.default.func,\n  renderMenuGroup: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  onGroupTitleClick: _propTypes.default.func,\n  onSearch: _propTypes.default.func,\n\n  /**\n   * group by key in `data`\n   */\n  groupBy: _propTypes.default.any,\n  sort: _propTypes.default.func,\n  searchable: _propTypes.default.bool,\n  virtualized: _propTypes.default.bool,\n  searchBy: _propTypes.default.func\n});\nvar _default = SelectPicker;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/SelectPicker/SelectPicker.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\n\nvar _isUndefined = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\n\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\n\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\n\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Picker = __webpack_require__(/*! ../Picker */ \"./src/Picker/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/SelectPicker/SelectPicker.tsx\",\n    _this = void 0,\n    _templateObject;\n\nvar emptyArray = [];\n\nvar SelectPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$appearance = props.appearance,\n      appearance = _props$appearance === void 0 ? 'default' : _props$appearance,\n      _props$data = props.data,\n      data = _props$data === void 0 ? emptyArray : _props$data,\n      _props$valueKey = props.valueKey,\n      valueKey = _props$valueKey === void 0 ? 'value' : _props$valueKey,\n      _props$labelKey = props.labelKey,\n      labelKey = _props$labelKey === void 0 ? 'label' : _props$labelKey,\n      valueProp = props.value,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n      placeholder = props.placeholder,\n      defaultValue = props.defaultValue,\n      disabled = props.disabled,\n      _props$cleanable = props.cleanable,\n      cleanable = _props$cleanable === void 0 ? true : _props$cleanable,\n      _props$placement = props.placement,\n      placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n      menuClassName = props.menuClassName,\n      _props$menuAutoWidth = props.menuAutoWidth,\n      menuAutoWidth = _props$menuAutoWidth === void 0 ? true : _props$menuAutoWidth,\n      _props$menuMaxHeight = props.menuMaxHeight,\n      menuMaxHeight = _props$menuMaxHeight === void 0 ? 320 : _props$menuMaxHeight,\n      menuStyle = props.menuStyle,\n      groupBy = props.groupBy,\n      overrideLocale = props.locale,\n      toggleAs = props.toggleAs,\n      style = props.style,\n      _props$searchable = props.searchable,\n      searchable = _props$searchable === void 0 ? true : _props$searchable,\n      _props$disabledItemVa = props.disabledItemValues,\n      disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,\n      virtualized = props.virtualized,\n      listProps = props.listProps,\n      id = props.id,\n      onGroupTitleClick = props.onGroupTitleClick,\n      searchBy = props.searchBy,\n      onEntered = props.onEntered,\n      onExited = props.onExited,\n      onClean = props.onClean,\n      onChange = props.onChange,\n      onSelect = props.onSelect,\n      onSearch = props.onSearch,\n      onClose = props.onClose,\n      onOpen = props.onOpen,\n      sort = props.sort,\n      renderValue = props.renderValue,\n      renderMenu = props.renderMenu,\n      renderMenuGroup = props.renderMenuGroup,\n      renderMenuItem = props.renderMenuItem,\n      renderExtraFooter = props.renderExtraFooter,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"appearance\", \"data\", \"valueKey\", \"labelKey\", \"value\", \"classPrefix\", \"placeholder\", \"defaultValue\", \"disabled\", \"cleanable\", \"placement\", \"menuClassName\", \"menuAutoWidth\", \"menuMaxHeight\", \"menuStyle\", \"groupBy\", \"locale\", \"toggleAs\", \"style\", \"searchable\", \"disabledItemValues\", \"virtualized\", \"listProps\", \"id\", \"onGroupTitleClick\", \"searchBy\", \"onEntered\", \"onExited\", \"onClean\", \"onChange\", \"onSelect\", \"onSearch\", \"onClose\", \"onOpen\", \"sort\", \"renderValue\", \"renderMenu\", \"renderMenuGroup\", \"renderMenuItem\", \"renderExtraFooter\"]);\n  var triggerRef = (0, _react.useRef)(null);\n  var targetRef = (0, _react.useRef)(null);\n  var overlayRef = (0, _react.useRef)(null);\n  var searchInputRef = (0, _react.useRef)(null);\n\n  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),\n      locale = _useCustom.locale;\n\n  var _ref = (0, _utils.useControlled)(valueProp, defaultValue),\n      value = _ref[0],\n      setValue = _ref[1]; // Used to hover the focus item  when trigger `onKeydown`\n\n\n  var _useFocusItemValue = (0, _Picker.useFocusItemValue)(value, {\n    data: data,\n    valueKey: valueKey,\n    target: function target() {\n      return overlayRef.current;\n    }\n  }),\n      focusItemValue = _useFocusItemValue.focusItemValue,\n      setFocusItemValue = _useFocusItemValue.setFocusItemValue,\n      onFocusItem = _useFocusItemValue.onKeyDown; // Use search keywords to filter options.\n\n\n  var _useSearch = (0, _Picker.useSearch)({\n    labelKey: labelKey,\n    data: data,\n    searchBy: searchBy,\n    callback: function callback(searchKeyword, filteredData, event) {\n      var _filteredData$;\n\n      // The first option after filtering is the focus.\n      setFocusItemValue(filteredData === null || filteredData === void 0 ? void 0 : (_filteredData$ = filteredData[0]) === null || _filteredData$ === void 0 ? void 0 : _filteredData$[valueKey]);\n      onSearch === null || onSearch === void 0 ? void 0 : onSearch(searchKeyword, event);\n    }\n  }),\n      searchKeyword = _useSearch.searchKeyword,\n      filteredData = _useSearch.filteredData,\n      updateFilteredData = _useSearch.updateFilteredData,\n      setSearchKeyword = _useSearch.setSearchKeyword,\n      handleSearch = _useSearch.handleSearch;\n\n  (0, _react.useEffect)(function () {\n    updateFilteredData(data);\n  }, [data, updateFilteredData]); // Use component active state to support keyboard events.\n\n  var _useState = (0, _react.useState)(false),\n      active = _useState[0],\n      setActive = _useState[1];\n\n  var handleClose = (0, _react.useCallback)(function () {\n    var _triggerRef$current, _triggerRef$current$c;\n\n    (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : (_triggerRef$current$c = _triggerRef$current.close) === null || _triggerRef$current$c === void 0 ? void 0 : _triggerRef$current$c.call(_triggerRef$current);\n  }, []);\n  var handleSelect = (0, _react.useCallback)(function (value, item, event) {\n    var _targetRef$current;\n\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(value, item, event);\n    (_targetRef$current = targetRef.current) === null || _targetRef$current === void 0 ? void 0 : _targetRef$current.focus();\n  }, [onSelect]);\n  var handleChangeValue = (0, _react.useCallback)(function (value, event) {\n    onChange === null || onChange === void 0 ? void 0 : onChange(value, event);\n  }, [onChange]);\n  var handleMenuPressEnter = (0, _react.useCallback)(function (event) {\n    if (!focusItemValue) {\n      return;\n    } // Find active `MenuItem` by `value`\n\n\n    var focusItem = data.find(function (item) {\n      return (0, _utils.shallowEqual)(item[valueKey], focusItemValue);\n    });\n    setValue(focusItemValue);\n    handleSelect(focusItemValue, focusItem, event);\n    handleChangeValue(focusItemValue, event);\n    handleClose();\n  }, [data, focusItemValue, handleChangeValue, handleClose, handleSelect, setValue, valueKey]);\n  var handleItemSelect = (0, _react.useCallback)(function (value, item, event) {\n    setValue(value);\n    setFocusItemValue(value);\n    handleSelect(value, item, event);\n    handleChangeValue(value, event);\n    handleClose();\n  }, [setValue, setFocusItemValue, handleSelect, handleChangeValue, handleClose]);\n  var handleClean = (0, _react.useCallback)(function (event) {\n    if (disabled || !cleanable) {\n      return;\n    }\n\n    setValue(null);\n    setFocusItemValue(value);\n    handleChangeValue(null, event);\n  }, [value, disabled, cleanable, setValue, handleChangeValue, setFocusItemValue]);\n  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !focusItemValue || !active,\n    triggerRef: triggerRef,\n    targetRef: targetRef,\n    overlayRef: overlayRef,\n    searchInputRef: searchInputRef,\n    active: active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter,\n    onClose: function onClose() {\n      setFocusItemValue(null);\n    }\n  }, rest));\n  var handleExited = (0, _react.useCallback)(function () {\n    setSearchKeyword('');\n    setActive(false);\n    onClose === null || onClose === void 0 ? void 0 : onClose();\n  }, [onClose, setSearchKeyword]);\n  var handleEntered = (0, _react.useCallback)(function () {\n    setActive(true);\n    setFocusItemValue(value);\n    onOpen === null || onOpen === void 0 ? void 0 : onOpen();\n  }, [onOpen, setFocusItemValue, value]);\n  (0, _Picker.usePublicMethods)(ref, {\n    triggerRef: triggerRef,\n    overlayRef: overlayRef,\n    targetRef: targetRef\n  }); // Find active `MenuItem` by `value`\n\n  var activeItem = data.find(function (item) {\n    return (0, _utils.shallowEqual)(item[valueKey], value);\n  });\n  /**\n   * 1.Have a value and the value is valid.\n   * 2.Regardless of whether the value is valid, as long as renderValue is set, it is judged to have a value.\n   */\n\n  var hasValue = !!activeItem || !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      prefix = _useClassNames.prefix,\n      merge = _useClassNames.merge;\n\n  var selectedElement = placeholder;\n\n  if (activeItem !== null && activeItem !== void 0 && activeItem[labelKey]) {\n    selectedElement = activeItem[labelKey];\n  }\n\n  if (!(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue)) {\n    selectedElement = renderValue(value, activeItem, selectedElement); // If renderValue returns null or undefined, hasValue is false.\n\n    if ((0, _isNil.default)(selectedElement)) {\n      hasValue = false;\n    }\n  }\n\n  var renderDropdownMenu = function renderDropdownMenu(positionProps, speakerRef) {\n    var left = positionProps.left,\n        top = positionProps.top,\n        className = positionProps.className;\n    var classes = merge(className, menuClassName, prefix('select-menu'));\n    var styles = (0, _extends2.default)({}, menuStyle, {\n      left: left,\n      top: top\n    });\n    var items = filteredData; // Create a tree structure data when set `groupBy`\n\n    if (groupBy) {\n      items = (0, _utils.getDataGroupBy)(items, groupBy, sort);\n    } else if (typeof sort === 'function') {\n      items = items.sort(sort(false));\n    }\n\n    var menu = items.length ? /*#__PURE__*/_react.default.createElement(_Picker.DropdownMenu, {\n      id: id ? id + \"-listbox\" : undefined,\n      listProps: listProps,\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      renderMenuGroup: renderMenuGroup,\n      renderMenuItem: renderMenuItem,\n      maxHeight: menuMaxHeight,\n      classPrefix: 'picker-select-menu',\n      dropdownMenuItemClassPrefix: 'picker-select-menu-item',\n      dropdownMenuItemAs: _Picker.DropdownMenuItem,\n      activeItemValues: [value],\n      focusItemValue: focusItemValue,\n      data: items,\n      group: !(0, _isUndefined.default)(groupBy),\n      onSelect: handleItemSelect,\n      onGroupTitleClick: onGroupTitleClick,\n      virtualized: virtualized,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 339,\n        columnNumber: 9\n      }\n    }) : /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)([\"none\"]))),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 360,\n        columnNumber: 9\n      }\n    }, locale === null || locale === void 0 ? void 0 : locale.noResultsText);\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerOverlay, {\n      ref: (0, _utils.mergeRefs)(overlayRef, speakerRef),\n      autoWidth: menuAutoWidth,\n      className: classes,\n      style: styles,\n      onKeyDown: onPickerKeyDown,\n      target: triggerRef,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 364,\n        columnNumber: 9\n      }\n    }, searchable && /*#__PURE__*/_react.default.createElement(_Picker.SearchBar, {\n      placeholder: locale === null || locale === void 0 ? void 0 : locale.searchPlaceholder,\n      onChange: handleSearch,\n      value: searchKeyword,\n      inputRef: searchInputRef,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 373,\n        columnNumber: 13\n      }\n    }), renderMenu ? renderMenu(menu) : menu, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n    classPrefix: classPrefix,\n    appearance: appearance,\n    hasValue: hasValue,\n    name: 'select',\n    cleanable: cleanable\n  })),\n      classes = _usePickerClassName[0],\n      usedClassNamePropKeys = _usePickerClassName[1];\n\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: triggerRef,\n    placement: placement,\n    onEntered: (0, _utils.createChainedFunction)(handleEntered, onEntered),\n    onExited: (0, _utils.createChainedFunction)(handleExited, onExited),\n    speaker: renderDropdownMenu,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 397,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 405,\n      columnNumber: 9\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys)), {\n    id: id,\n    ref: targetRef,\n    appearance: appearance,\n    onClean: (0, _utils.createChainedFunction)(handleClean, onClean),\n    onKeyDown: onPickerKeyDown,\n    as: toggleAs,\n    disabled: disabled,\n    cleanable: cleanable && !disabled,\n    hasValue: hasValue,\n    inputValue: value !== null && value !== void 0 ? value : '',\n    active: active,\n    placement: placement,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 406,\n      columnNumber: 11\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder))));\n});\n\nSelectPicker.displayName = 'SelectPicker';\nSelectPicker.propTypes = (0, _extends2.default)({}, _Picker.listPickerPropTypes, {\n  locale: _propTypes.default.any,\n  appearance: _propTypes.default.oneOf(['default', 'subtle']),\n  menuAutoWidth: _propTypes.default.bool,\n  menuMaxHeight: _propTypes.default.number,\n  renderMenu: _propTypes.default.func,\n  renderMenuItem: _propTypes.default.func,\n  renderMenuGroup: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  onGroupTitleClick: _propTypes.default.func,\n  onSearch: _propTypes.default.func,\n\n  /**\n   * group by key in `data`\n   */\n  groupBy: _propTypes.default.any,\n  sort: _propTypes.default.func,\n  searchable: _propTypes.default.bool,\n  virtualized: _propTypes.default.bool,\n  searchBy: _propTypes.default.func\n});\nvar _default = SelectPicker;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/SelectPicker/SelectPicker.tsx?");
 
 /***/ }),
 
@@ -4403,6 +4425,28 @@ eval("\n\nexports.__esModule = true;\nexports.checkValue = checkValue;\nexports.
 
 /***/ }),
 
+/***/ "./src/Stack/Stack.tsx":
+/*!*****************************!*\
+  !*** ./src/Stack/Stack.tsx ***!
+  \*****************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Stack/Stack.tsx\",\n    _this = void 0;\n\nvar Stack = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _itemStyles;\n\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$alignItems = props.alignItems,\n      alignItems = _props$alignItems === void 0 ? 'center' : _props$alignItems,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'stack' : _props$classPrefix,\n      className = props.className,\n      children = props.children,\n      direction = props.direction,\n      justifyContent = props.justifyContent,\n      spacing = props.spacing,\n      divider = props.divider,\n      style = props.style,\n      wrap = props.wrap,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"alignItems\", \"classPrefix\", \"className\", \"children\", \"direction\", \"justifyContent\", \"spacing\", \"divider\", \"style\", \"wrap\"]);\n\n  var _useCustom = (0, _utils.useCustom)('Stack'),\n      rtl = _useCustom.rtl;\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      merge = _useClassNames.merge,\n      prefix = _useClassNames.prefix;\n\n  var classes = merge(className, withClassPrefix());\n  var isSupportGridGap = !(0, _utils.isIE)();\n\n  var count = _react.default.Children.count(children);\n\n  var gridGap = Array.isArray(spacing) ? spacing : [spacing, 0];\n  var itemStyles = (_itemStyles = {}, _itemStyles[rtl ? 'marginLeft' : 'marginRight'] = gridGap[0], _itemStyles.marginBottom = gridGap[1], _itemStyles);\n  var styles = (0, _extends2.default)({\n    alignItems: alignItems,\n    justifyContent: justifyContent,\n    flexDirection: direction,\n    flexWrap: wrap ? 'wrap' : undefined,\n    gap: isSupportGridGap ? spacing : undefined\n  }, style);\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: ref,\n    className: classes,\n    style: styles,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 72,\n      columnNumber: 5\n    }\n  }), _react.default.Children.map(children, function (child, index) {\n    var childNode = /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix('item'),\n      style: !isSupportGridGap ? itemStyles : undefined,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 75,\n        columnNumber: 11\n      }\n    }, child);\n\n    return [childNode, index < count - 1 ? divider : null];\n  }));\n});\n\nStack.displayName = 'Stack';\nStack.propTypes = {\n  className: _propTypes.default.string,\n  children: _propTypes.default.node,\n  classPrefix: _propTypes.default.string,\n  direction: _propTypes.default.oneOf(['row', 'row-reverse', 'column', 'column-reverse']),\n  alignItems: _propTypes.default.oneOf(['flex-start', 'center', 'flex-end', 'stretch', 'baseline']),\n  justifyContent: _propTypes.default.oneOf(['flex-start', 'center', 'flex-end', 'space-between', 'space-around']),\n  spacing: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string, _propTypes.default.array]),\n  divider: _propTypes.default.node,\n  wrap: _propTypes.default.bool\n};\nvar _default = Stack;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Stack/Stack.tsx?");
+
+/***/ }),
+
+/***/ "./src/Stack/index.tsx":
+/*!*****************************!*\
+  !*** ./src/Stack/index.tsx ***!
+  \*****************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _Stack = _interopRequireDefault(__webpack_require__(/*! ./Stack */ \"./src/Stack/Stack.tsx\"));\n\nvar _default = _Stack.default;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Stack/index.tsx?");
+
+/***/ }),
+
 /***/ "./src/Steps/StepItem.tsx":
 /*!********************************!*\
   !*** ./src/Steps/StepItem.tsx ***!
@@ -4410,7 +4454,7 @@ eval("\n\nexports.__esModule = true;\nexports.checkValue = checkValue;\nexports.
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _Check = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/Check */ \"./node_modules/@rsuite/icons/Check.js\"));\n\nvar _Close = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/Close */ \"./node_modules/@rsuite/icons/Close.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Steps/StepItem.tsx\",\n    _this = void 0;\n\nvar STEP_STATUS_ICON = {\n  finish: /*#__PURE__*/_react.default.createElement(_Check.default, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 11,\n      columnNumber: 11\n    }\n  }),\n  wait: null,\n  process: null,\n  error: /*#__PURE__*/_react.default.createElement(_Close.default, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 14,\n      columnNumber: 10\n    }\n  })\n};\n\nvar StepItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _withClassPrefix;\n\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'steps-item' : _props$classPrefix,\n      style = props.style,\n      itemWidth = props.itemWidth,\n      status = props.status,\n      icon = props.icon,\n      stepNumber = props.stepNumber,\n      description = props.description,\n      title = props.title,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\", \"style\", \"itemWidth\", \"status\", \"icon\", \"stepNumber\", \"description\", \"title\"]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      withClassPrefix = _useClassNames.withClassPrefix,\n      prefix = _useClassNames.prefix;\n\n  var classes = merge(className, withClassPrefix((_withClassPrefix = {\n    custom: icon\n  }, _withClassPrefix[\"status-\" + status] = status, _withClassPrefix)));\n  var styles = (0, _extends2.default)({\n    width: itemWidth\n  }, style);\n\n  var iconNode = /*#__PURE__*/_react.default.createElement(\"span\", {\n    className: prefix('icon', \"icon-\" + status),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 62,\n      columnNumber: 7\n    }\n  }, status ? STEP_STATUS_ICON[status] : stepNumber);\n\n  if (icon) {\n    iconNode = /*#__PURE__*/_react.default.createElement(\"span\", {\n      className: prefix('icon'),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 68,\n        columnNumber: 18\n      }\n    }, icon);\n  }\n\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: ref,\n    className: classes,\n    style: styles,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 72,\n      columnNumber: 7\n    }\n  }), /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('tail'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 73,\n      columnNumber: 9\n    }\n  }), /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix(['icon-wrapper', icon ? 'custom-icon' : '']),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 74,\n      columnNumber: 9\n    }\n  }, iconNode), /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('content'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 75,\n      columnNumber: 9\n    }\n  }, /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('title'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 76,\n      columnNumber: 12\n    }\n  }, title), description && /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('description'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 77,\n      columnNumber: 27\n    }\n  }, description)));\n});\n\nStepItem.displayName = 'StepItem';\nStepItem.propTypes = {\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string,\n  style: _propTypes.default.object,\n  itemWidth: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),\n  status: _propTypes.default.oneOf(['finish', 'wait', 'process', 'error']),\n  icon: _propTypes.default.object,\n  stepNumber: _propTypes.default.number,\n  description: _propTypes.default.node,\n  title: _propTypes.default.node\n};\nvar _default = StepItem;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Steps/StepItem.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _Check = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/Check */ \"./node_modules/@rsuite/icons/Check.js\"));\n\nvar _Close = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/Close */ \"./node_modules/@rsuite/icons/Close.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Steps/StepItem.tsx\",\n    _this = void 0;\n\nvar STEP_STATUS_ICON = {\n  finish: /*#__PURE__*/_react.default.createElement(_Check.default, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 13,\n      columnNumber: 11\n    }\n  }),\n  wait: null,\n  process: null,\n  error: /*#__PURE__*/_react.default.createElement(_Close.default, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 16,\n      columnNumber: 10\n    }\n  })\n};\n\nvar StepItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _withClassPrefix, _STEP_STATUS_ICON$sta;\n\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      className = props.className,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'steps-item' : _props$classPrefix,\n      style = props.style,\n      itemWidth = props.itemWidth,\n      status = props.status,\n      icon = props.icon,\n      stepNumber = props.stepNumber,\n      description = props.description,\n      title = props.title,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\", \"style\", \"itemWidth\", \"status\", \"icon\", \"stepNumber\", \"description\", \"title\"]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      withClassPrefix = _useClassNames.withClassPrefix,\n      prefix = _useClassNames.prefix;\n\n  var classes = merge(className, withClassPrefix((_withClassPrefix = {\n    custom: icon\n  }, _withClassPrefix[\"status-\" + status] = status, _withClassPrefix)));\n  var styles = (0, _extends2.default)({\n    width: itemWidth\n  }, style);\n\n  var iconNode = /*#__PURE__*/_react.default.createElement(\"span\", {\n    className: prefix('icon', \"icon-\" + status),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 64,\n      columnNumber: 7\n    }\n  }, status ? (_STEP_STATUS_ICON$sta = STEP_STATUS_ICON[status]) !== null && _STEP_STATUS_ICON$sta !== void 0 ? _STEP_STATUS_ICON$sta : stepNumber : stepNumber);\n\n  if (icon) {\n    iconNode = /*#__PURE__*/_react.default.createElement(\"span\", {\n      className: prefix('icon'),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 70,\n        columnNumber: 18\n      }\n    }, icon);\n  }\n\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: ref,\n    className: classes,\n    style: styles,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 74,\n      columnNumber: 7\n    }\n  }), /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('tail'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 75,\n      columnNumber: 9\n    }\n  }), /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix(['icon-wrapper', icon ? 'custom-icon' : '']),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 76,\n      columnNumber: 9\n    }\n  }, iconNode), /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('content'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 77,\n      columnNumber: 9\n    }\n  }, /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('title'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 78,\n      columnNumber: 12\n    }\n  }, title), description && /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('description'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 79,\n      columnNumber: 27\n    }\n  }, description)));\n});\n\nStepItem.displayName = 'StepItem';\nStepItem.propTypes = {\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string,\n  style: _propTypes.default.object,\n  itemWidth: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),\n  status: _propTypes.default.oneOf(['finish', 'wait', 'process', 'error']),\n  icon: _propTypes.default.object,\n  stepNumber: _propTypes.default.number,\n  description: _propTypes.default.node,\n  title: _propTypes.default.node\n};\nvar _default = StepItem;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Steps/StepItem.tsx?");
 
 /***/ }),
 
@@ -4564,7 +4608,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Plaintext = _interopRequireDefault(__webpack_require__(/*! ../Plaintext */ \"./src/Plaintext/index.tsx\"));\n\nvar _Loader = _interopRequireDefault(__webpack_require__(/*! ../Loader */ \"./src/Loader/index.tsx\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Toggle/Toggle.tsx\",\n    _this = void 0;\n\nvar Toggle = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'span' : _props$as,\n      disabled = props.disabled,\n      readOnly = props.readOnly,\n      _props$loading = props.loading,\n      loading = _props$loading === void 0 ? false : _props$loading,\n      plaintext = props.plaintext,\n      className = props.className,\n      checkedChildren = props.checkedChildren,\n      unCheckedChildren = props.unCheckedChildren,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'toggle' : _props$classPrefix,\n      checkedProp = props.checked,\n      defaultChecked = props.defaultChecked,\n      size = props.size,\n      localeProp = props.locale,\n      onChange = props.onChange,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"disabled\", \"readOnly\", \"loading\", \"plaintext\", \"className\", \"checkedChildren\", \"unCheckedChildren\", \"classPrefix\", \"checked\", \"defaultChecked\", \"size\", \"locale\", \"onChange\"]);\n  var inputRef = (0, _react.useRef)(null);\n\n  var _useControlled = (0, _utils.useControlled)(checkedProp, defaultChecked),\n      checked = _useControlled[0],\n      setChecked = _useControlled[1];\n\n  var _useCustom = (0, _utils.useCustom)('Toggle', localeProp),\n      locale = _useCustom.locale;\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      withClassPrefix = _useClassNames.withClassPrefix,\n      prefix = _useClassNames.prefix;\n\n  var classes = merge(className, withClassPrefix(size, {\n    checked: checked,\n    disabled: disabled,\n    loading: loading\n  }));\n  var inner = checked ? checkedChildren : unCheckedChildren;\n  var label = checked ? locale.on : locale.off;\n  var handleInputChange = (0, _react.useCallback)(function (e) {\n    if (disabled || readOnly) {\n      return;\n    }\n\n    var checked = e.target.checked;\n    setChecked(checked);\n    onChange === null || onChange === void 0 ? void 0 : onChange(checked, e);\n  }, [disabled, readOnly, setChecked, onChange]);\n\n  if (plaintext) {\n    return /*#__PURE__*/_react.default.createElement(_Plaintext.default, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 88,\n        columnNumber: 12\n      }\n    }, inner || label);\n  }\n\n  return /*#__PURE__*/_react.default.createElement(\"label\", (0, _extends2.default)({\n    ref: ref,\n    className: classes\n  }, rest, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 92,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(\"input\", {\n    ref: inputRef,\n    type: \"checkbox\",\n    checked: checked,\n    disabled: disabled,\n    readOnly: readOnly,\n    onChange: handleInputChange,\n    className: prefix('input'),\n    role: \"switch\",\n    \"aria-checked\": checked,\n    \"aria-disabled\": disabled,\n    \"aria-label\": typeof inner === 'string' ? inner : label,\n    \"aria-busy\": loading || undefined,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 93,\n      columnNumber: 7\n    }\n  }), /*#__PURE__*/_react.default.createElement(Component, {\n    className: prefix('presentation'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 107,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(\"span\", {\n    className: prefix('inner'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 108,\n      columnNumber: 9\n    }\n  }, inner), loading && /*#__PURE__*/_react.default.createElement(_Loader.default, {\n    className: prefix('loader'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 109,\n      columnNumber: 21\n    }\n  })));\n});\n\nToggle.displayName = 'Toggle';\nToggle.propTypes = {\n  disabled: _propTypes.default.bool,\n  readOnly: _propTypes.default.bool,\n  plaintext: _propTypes.default.bool,\n  checked: _propTypes.default.bool,\n  defaultChecked: _propTypes.default.bool,\n  checkedChildren: _propTypes.default.node,\n  unCheckedChildren: _propTypes.default.node,\n  loading: _propTypes.default.bool,\n  classPrefix: _propTypes.default.string,\n  className: _propTypes.default.string,\n  onChange: _propTypes.default.func,\n  as: _propTypes.default.elementType,\n  size: _propTypes.default.oneOf(['sm', 'md', 'lg']),\n  locale: _propTypes.default.shape({\n    on: _propTypes.default.string,\n    off: _propTypes.default.string\n  })\n};\nvar _default = Toggle;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Toggle/Toggle.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Plaintext = _interopRequireDefault(__webpack_require__(/*! ../Plaintext */ \"./src/Plaintext/index.tsx\"));\n\nvar _Loader = _interopRequireDefault(__webpack_require__(/*! ../Loader */ \"./src/Loader/index.tsx\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Toggle/Toggle.tsx\",\n    _this = void 0;\n\nvar Toggle = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'span' : _props$as,\n      disabled = props.disabled,\n      readOnly = props.readOnly,\n      _props$loading = props.loading,\n      loading = _props$loading === void 0 ? false : _props$loading,\n      plaintext = props.plaintext,\n      className = props.className,\n      checkedChildren = props.checkedChildren,\n      unCheckedChildren = props.unCheckedChildren,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'toggle' : _props$classPrefix,\n      checkedProp = props.checked,\n      defaultChecked = props.defaultChecked,\n      size = props.size,\n      localeProp = props.locale,\n      onChange = props.onChange,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"disabled\", \"readOnly\", \"loading\", \"plaintext\", \"className\", \"checkedChildren\", \"unCheckedChildren\", \"classPrefix\", \"checked\", \"defaultChecked\", \"size\", \"locale\", \"onChange\"]);\n  var inputRef = (0, _react.useRef)(null);\n\n  var _useControlled = (0, _utils.useControlled)(checkedProp, defaultChecked),\n      checked = _useControlled[0],\n      setChecked = _useControlled[1];\n\n  var _useCustom = (0, _utils.useCustom)('Toggle', localeProp),\n      locale = _useCustom.locale;\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      merge = _useClassNames.merge,\n      withClassPrefix = _useClassNames.withClassPrefix,\n      prefix = _useClassNames.prefix;\n\n  var classes = merge(className, withClassPrefix(size, {\n    checked: checked,\n    disabled: disabled,\n    loading: loading\n  }));\n  var inner = checked ? checkedChildren : unCheckedChildren;\n  var label = checked ? locale.on : locale.off;\n  var handleInputChange = (0, _react.useCallback)(function (e) {\n    if (disabled || readOnly || loading) {\n      return;\n    }\n\n    var checked = e.target.checked;\n    setChecked(checked);\n    onChange === null || onChange === void 0 ? void 0 : onChange(checked, e);\n  }, [disabled, readOnly, loading, setChecked, onChange]);\n\n  if (plaintext) {\n    return /*#__PURE__*/_react.default.createElement(_Plaintext.default, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 88,\n        columnNumber: 12\n      }\n    }, inner || label);\n  }\n\n  return /*#__PURE__*/_react.default.createElement(\"label\", (0, _extends2.default)({\n    ref: ref,\n    className: classes\n  }, rest, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 92,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(\"input\", {\n    ref: inputRef,\n    type: \"checkbox\",\n    checked: checkedProp,\n    defaultChecked: defaultChecked,\n    disabled: disabled,\n    readOnly: readOnly,\n    onChange: handleInputChange,\n    className: prefix('input'),\n    role: \"switch\",\n    \"aria-checked\": checked,\n    \"aria-disabled\": disabled,\n    \"aria-label\": typeof inner === 'string' ? inner : label,\n    \"aria-busy\": loading || undefined,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 93,\n      columnNumber: 7\n    }\n  }), /*#__PURE__*/_react.default.createElement(Component, {\n    className: prefix('presentation'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 108,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(\"span\", {\n    className: prefix('inner'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 109,\n      columnNumber: 9\n    }\n  }, inner), loading && /*#__PURE__*/_react.default.createElement(_Loader.default, {\n    className: prefix('loader'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 110,\n      columnNumber: 21\n    }\n  })));\n});\n\nToggle.displayName = 'Toggle';\nToggle.propTypes = {\n  disabled: _propTypes.default.bool,\n  readOnly: _propTypes.default.bool,\n  plaintext: _propTypes.default.bool,\n  checked: _propTypes.default.bool,\n  defaultChecked: _propTypes.default.bool,\n  checkedChildren: _propTypes.default.node,\n  unCheckedChildren: _propTypes.default.node,\n  loading: _propTypes.default.bool,\n  classPrefix: _propTypes.default.string,\n  className: _propTypes.default.string,\n  onChange: _propTypes.default.func,\n  as: _propTypes.default.elementType,\n  size: _propTypes.default.oneOf(['sm', 'md', 'lg']),\n  locale: _propTypes.default.shape({\n    on: _propTypes.default.string,\n    off: _propTypes.default.string\n  })\n};\nvar _default = Toggle;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Toggle/Toggle.tsx?");
 
 /***/ }),
 
@@ -4608,7 +4652,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = exports.TREE_NODE_DROP_POSITION = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _TreePicker = _interopRequireDefault(__webpack_require__(/*! ../TreePicker */ \"./src/TreePicker/index.tsx\"));\n\nvar _TreeContext = _interopRequireDefault(__webpack_require__(/*! ./TreeContext */ \"./src/Tree/TreeContext.ts\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Tree/Tree.tsx\",\n    _this = void 0;\n\n/**\n * Tree Node Drag Type\n */\nvar TREE_NODE_DROP_POSITION;\nexports.TREE_NODE_DROP_POSITION = TREE_NODE_DROP_POSITION;\n\n(function (TREE_NODE_DROP_POSITION) {\n  TREE_NODE_DROP_POSITION[TREE_NODE_DROP_POSITION[\"DRAG_OVER\"] = 0] = \"DRAG_OVER\";\n  TREE_NODE_DROP_POSITION[TREE_NODE_DROP_POSITION[\"DRAG_OVER_TOP\"] = 1] = \"DRAG_OVER_TOP\";\n  TREE_NODE_DROP_POSITION[TREE_NODE_DROP_POSITION[\"DRAG_OVER_BOTTOM\"] = 2] = \"DRAG_OVER_BOTTOM\";\n})(TREE_NODE_DROP_POSITION || (exports.TREE_NODE_DROP_POSITION = TREE_NODE_DROP_POSITION = {}));\n\nvar Tree = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var dragNodeRef = (0, _react.useRef)();\n  return /*#__PURE__*/_react.default.createElement(_TreeContext.default.Provider, {\n    value: {\n      inline: true,\n      dragNodeRef: dragNodeRef\n    },\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 151,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_TreePicker.default, (0, _extends2.default)({\n    ref: ref\n  }, props, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 152,\n      columnNumber: 9\n    }\n  })));\n});\n\nTree.displayName = 'Tree';\nvar _default = Tree;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Tree/Tree.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = exports.TREE_NODE_DROP_POSITION = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _TreePicker = _interopRequireDefault(__webpack_require__(/*! ../TreePicker */ \"./src/TreePicker/index.tsx\"));\n\nvar _TreeContext = _interopRequireDefault(__webpack_require__(/*! ./TreeContext */ \"./src/Tree/TreeContext.ts\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Tree/Tree.tsx\",\n    _this = void 0;\n\n/**\n * Tree Node Drag Type\n */\nvar TREE_NODE_DROP_POSITION;\nexports.TREE_NODE_DROP_POSITION = TREE_NODE_DROP_POSITION;\n\n(function (TREE_NODE_DROP_POSITION) {\n  TREE_NODE_DROP_POSITION[TREE_NODE_DROP_POSITION[\"DRAG_OVER\"] = 0] = \"DRAG_OVER\";\n  TREE_NODE_DROP_POSITION[TREE_NODE_DROP_POSITION[\"DRAG_OVER_TOP\"] = 1] = \"DRAG_OVER_TOP\";\n  TREE_NODE_DROP_POSITION[TREE_NODE_DROP_POSITION[\"DRAG_OVER_BOTTOM\"] = 2] = \"DRAG_OVER_BOTTOM\";\n})(TREE_NODE_DROP_POSITION || (exports.TREE_NODE_DROP_POSITION = TREE_NODE_DROP_POSITION = {}));\n\nvar Tree = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var contextValue = (0, _react.useMemo)(function () {\n    return {\n      inline: true\n    };\n  }, []);\n  return /*#__PURE__*/_react.default.createElement(_TreeContext.default.Provider, {\n    value: contextValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 150,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_TreePicker.default, (0, _extends2.default)({\n    ref: ref\n  }, props, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 151,\n      columnNumber: 9\n    }\n  })));\n});\n\nTree.displayName = 'Tree';\nvar _default = Tree;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/Tree/Tree.tsx?");
 
 /***/ }),
 
@@ -4641,7 +4685,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _hasClass = _interopRequireDefault(__webpack_require__(/*! dom-lib/hasClass */ \"./node_modules/dom-lib/esm/hasClass.js\"));\n\nvar _ArrowDown = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/ArrowDown */ \"./node_modules/@rsuite/icons/legacy/ArrowDown.js\"));\n\nvar _Spinner = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/Spinner */ \"./node_modules/@rsuite/icons/legacy/Spinner.js\"));\n\nvar _TreeContext = _interopRequireDefault(__webpack_require__(/*! ../Tree/TreeContext */ \"./src/Tree/TreeContext.ts\"));\n\nvar _reactToString = _interopRequireDefault(__webpack_require__(/*! ../utils/reactToString */ \"./src/utils/reactToString.ts\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/TreePicker/TreeNode.tsx\",\n    _this = void 0;\n\nvar TreeNode = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {\n  var _ref$as = _ref.as,\n      Component = _ref$as === void 0 ? 'div' : _ref$as,\n      rtl = _ref.rtl,\n      label = _ref.label,\n      layer = _ref.layer,\n      style = _ref.style,\n      active = _ref.active,\n      loading = _ref.loading,\n      nodeData = _ref.nodeData,\n      className = _ref.className,\n      _ref$classPrefix = _ref.classPrefix,\n      classPrefix = _ref$classPrefix === void 0 ? 'tree-node' : _ref$classPrefix,\n      disabled = _ref.disabled,\n      _ref$visible = _ref.visible,\n      visible = _ref$visible === void 0 ? true : _ref$visible,\n      draggable = _ref.draggable,\n      expand = _ref.expand,\n      focus = _ref.focus,\n      hasChildren = _ref.hasChildren,\n      dragging = _ref.dragging,\n      dragOver = _ref.dragOver,\n      dragOverTop = _ref.dragOverTop,\n      dragOverBottom = _ref.dragOverBottom,\n      onSelect = _ref.onSelect,\n      onDragStart = _ref.onDragStart,\n      onDragOver = _ref.onDragOver,\n      onDragEnter = _ref.onDragEnter,\n      onDragLeave = _ref.onDragLeave,\n      onDragEnd = _ref.onDragEnd,\n      onDrop = _ref.onDrop,\n      onExpand = _ref.onExpand,\n      onRenderTreeIcon = _ref.onRenderTreeIcon,\n      onRenderTreeNode = _ref.onRenderTreeNode,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, [\"as\", \"rtl\", \"label\", \"layer\", \"style\", \"active\", \"loading\", \"nodeData\", \"className\", \"classPrefix\", \"disabled\", \"visible\", \"draggable\", \"expand\", \"focus\", \"hasChildren\", \"dragging\", \"dragOver\", \"dragOverTop\", \"dragOverBottom\", \"onSelect\", \"onDragStart\", \"onDragOver\", \"onDragEnter\", \"onDragLeave\", \"onDragEnd\", \"onDrop\", \"onExpand\", \"onRenderTreeIcon\", \"onRenderTreeNode\"]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      prefix = _useClassNames.prefix,\n      merge = _useClassNames.merge,\n      withClassPrefix = _useClassNames.withClassPrefix;\n\n  var _useContext = (0, _react.useContext)(_TreeContext.default),\n      dragNodeRef = _useContext.dragNodeRef;\n\n  var getTitle = (0, _react.useCallback)(function () {\n    if (typeof label === 'string') {\n      return label;\n    } else if ( /*#__PURE__*/_react.default.isValidElement(label)) {\n      var nodes = (0, _reactToString.default)(label);\n      return nodes.join('');\n    }\n  }, [label]);\n  var handleExpand = (0, _react.useCallback)(function (event) {\n    var _event$nativeEvent, _event$nativeEvent$st;\n\n    // stop propagation when using custom loading icon\n    event === null || event === void 0 ? void 0 : (_event$nativeEvent = event.nativeEvent) === null || _event$nativeEvent === void 0 ? void 0 : (_event$nativeEvent$st = _event$nativeEvent.stopImmediatePropagation) === null || _event$nativeEvent$st === void 0 ? void 0 : _event$nativeEvent$st.call(_event$nativeEvent);\n    onExpand === null || onExpand === void 0 ? void 0 : onExpand(nodeData);\n  }, [nodeData, onExpand]);\n  var handleSelect = (0, _react.useCallback)(function (event) {\n    if (disabled) {\n      return;\n    }\n\n    if (event.target instanceof HTMLElement) {\n      if ((0, _hasClass.default)(event.target.parentNode, prefix('expand-icon-wrapper'))) {\n        return;\n      }\n    }\n\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(nodeData, event);\n  }, [nodeData, disabled, prefix, onSelect]);\n  var handleDragStart = (0, _react.useCallback)(function (event) {\n    var dragNode = dragNodeRef === null || dragNodeRef === void 0 ? void 0 : dragNodeRef.current;\n\n    if (dragNode) {\n      var _event$dataTransfer;\n\n      (_event$dataTransfer = event.dataTransfer) === null || _event$dataTransfer === void 0 ? void 0 : _event$dataTransfer.setDragImage(dragNode, 0, 0);\n    }\n\n    onDragStart === null || onDragStart === void 0 ? void 0 : onDragStart(nodeData, event);\n  }, [dragNodeRef, nodeData, onDragStart]);\n  var handleDragEnter = (0, _react.useCallback)(function (event) {\n    event.preventDefault();\n    event.stopPropagation();\n    onDragEnter === null || onDragEnter === void 0 ? void 0 : onDragEnter(nodeData, event);\n  }, [nodeData, onDragEnter]);\n  var handleDragOver = (0, _react.useCallback)(function (event) {\n    event.preventDefault();\n    event.stopPropagation();\n    onDragOver === null || onDragOver === void 0 ? void 0 : onDragOver(nodeData, event);\n  }, [nodeData, onDragOver]);\n  var handleDragLeave = (0, _react.useCallback)(function (event) {\n    event.stopPropagation();\n    onDragLeave === null || onDragLeave === void 0 ? void 0 : onDragLeave(nodeData, event);\n  }, [nodeData, onDragLeave]);\n  var handleDragEnd = (0, _react.useCallback)(function (event) {\n    event.stopPropagation();\n    onDragEnd === null || onDragEnd === void 0 ? void 0 : onDragEnd(nodeData, event);\n  }, [nodeData, onDragEnd]);\n  var handleDrop = (0, _react.useCallback)(function (event) {\n    event.preventDefault();\n    event.stopPropagation();\n    onDrop === null || onDrop === void 0 ? void 0 : onDrop(nodeData, event);\n  }, [nodeData, onDrop]);\n\n  var renderIcon = function renderIcon() {\n    var classes = prefix('expand-icon', 'icon', {\n      expanded: expand\n    });\n\n    var expandIcon = /*#__PURE__*/_react.default.createElement(_ArrowDown.default, {\n      className: classes,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 183,\n        columnNumber: 24\n      }\n    });\n\n    if (loading) {\n      expandIcon = /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: prefix('loading-icon'),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 186,\n          columnNumber: 11\n        }\n      }, /*#__PURE__*/_react.default.createElement(_Spinner.default, {\n        spin: true,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 187,\n          columnNumber: 13\n        }\n      }));\n    }\n\n    if (nodeData !== undefined && typeof onRenderTreeIcon === 'function') {\n      var customIcon = onRenderTreeIcon(nodeData);\n      expandIcon = customIcon !== null ? /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: prefix('custom-icon'),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 195,\n          columnNumber: 13\n        }\n      }, customIcon) : expandIcon;\n    }\n\n    return hasChildren ? /*#__PURE__*/_react.default.createElement(\"div\", {\n      role: \"button\",\n      tabIndex: -1,\n      \"data-ref\": nodeData.refKey,\n      className: prefix('expand-icon-wrapper'),\n      onClick: handleExpand,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 202,\n        columnNumber: 9\n      }\n    }, expandIcon) : null;\n  };\n\n  var renderLabel = function renderLabel() {\n    var contentClasses = prefix('label-content', {\n      dragging: dragging,\n      'drag-over': dragOver,\n      'drag-over-top': dragOverTop,\n      'drag-over-bottom': dragOverBottom\n    });\n    return /*#__PURE__*/_react.default.createElement(\"span\", {\n      className: prefix('label'),\n      title: getTitle(),\n      \"data-layer\": layer,\n      \"data-key\": (nodeData === null || nodeData === void 0 ? void 0 : nodeData.refKey) || '',\n      role: \"button\",\n      tabIndex: -1,\n      onClick: handleSelect,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 222,\n        columnNumber: 9\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"span\", {\n      className: contentClasses,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 231,\n        columnNumber: 11\n      }\n    }, onRenderTreeNode ? onRenderTreeNode(nodeData) : label));\n  };\n\n  var classes = merge(className, withClassPrefix({\n    disabled: disabled,\n    active: active,\n    'text-muted': disabled,\n    focus: focus\n  }));\n  var styles = (0, _extends2.default)({}, style, (0, _treeUtils.getTreeNodeIndent)(rtl, layer - 1));\n  return visible ? /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n    role: \"treeitem\"\n  }, rest, {\n    \"aria-expanded\": expand,\n    \"aria-label\": label,\n    \"aria-level\": layer,\n    \"aria-disabled\": disabled,\n    \"aria-selected\": active,\n    style: styles,\n    className: classes,\n    ref: ref,\n    draggable: draggable,\n    onDragStart: handleDragStart,\n    onDragEnter: handleDragEnter,\n    onDragOver: handleDragOver,\n    onDragLeave: handleDragLeave,\n    onDragEnd: handleDragEnd,\n    onDrop: handleDrop,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 246,\n      columnNumber: 7\n    }\n  }), renderIcon(), renderLabel()) : null;\n});\nTreeNode.displayName = 'TreePickerNode';\nTreeNode.propTypes = {\n  as: _propTypes.default.elementType,\n  rtl: _propTypes.default.bool,\n  focus: _propTypes.default.bool,\n  layer: _propTypes.default.number,\n  value: _propTypes.default.any,\n  label: _propTypes.default.any,\n  expand: _propTypes.default.bool,\n  active: _propTypes.default.bool,\n  loading: _propTypes.default.bool,\n  visible: _propTypes.default.bool,\n  nodeData: _propTypes.default.any,\n  disabled: _propTypes.default.bool,\n  draggable: _propTypes.default.bool,\n  dragging: _propTypes.default.bool,\n  dragOver: _propTypes.default.bool,\n  dragOverTop: _propTypes.default.bool,\n  dragOverBottom: _propTypes.default.bool,\n  hasChildren: _propTypes.default.bool,\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string,\n  style: _propTypes.default.object,\n  onExpand: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  onRenderTreeIcon: _propTypes.default.func,\n  onRenderTreeNode: _propTypes.default.func,\n  onDragStart: _propTypes.default.func,\n  onDragEnter: _propTypes.default.func,\n  onDragOver: _propTypes.default.func,\n  onDragLeave: _propTypes.default.func,\n  onDragEnd: _propTypes.default.func,\n  onDrop: _propTypes.default.func\n};\nvar _default = TreeNode;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/TreePicker/TreeNode.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _hasClass = _interopRequireDefault(__webpack_require__(/*! dom-lib/hasClass */ \"./node_modules/dom-lib/esm/hasClass.js\"));\n\nvar _ArrowDown = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/ArrowDown */ \"./node_modules/@rsuite/icons/legacy/ArrowDown.js\"));\n\nvar _Spinner = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/Spinner */ \"./node_modules/@rsuite/icons/legacy/Spinner.js\"));\n\nvar _reactToString = _interopRequireDefault(__webpack_require__(/*! ../utils/reactToString */ \"./src/utils/reactToString.ts\"));\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/TreePicker/TreeNode.tsx\",\n    _this = void 0;\n\nvar TreeNode = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {\n  var _ref$as = _ref.as,\n      Component = _ref$as === void 0 ? 'div' : _ref$as,\n      rtl = _ref.rtl,\n      label = _ref.label,\n      layer = _ref.layer,\n      style = _ref.style,\n      active = _ref.active,\n      loading = _ref.loading,\n      nodeData = _ref.nodeData,\n      className = _ref.className,\n      _ref$classPrefix = _ref.classPrefix,\n      classPrefix = _ref$classPrefix === void 0 ? 'tree-node' : _ref$classPrefix,\n      disabled = _ref.disabled,\n      _ref$visible = _ref.visible,\n      visible = _ref$visible === void 0 ? true : _ref$visible,\n      draggable = _ref.draggable,\n      expand = _ref.expand,\n      focus = _ref.focus,\n      hasChildren = _ref.hasChildren,\n      dragging = _ref.dragging,\n      dragOver = _ref.dragOver,\n      dragOverTop = _ref.dragOverTop,\n      dragOverBottom = _ref.dragOverBottom,\n      onSelect = _ref.onSelect,\n      onDragStart = _ref.onDragStart,\n      onDragOver = _ref.onDragOver,\n      onDragEnter = _ref.onDragEnter,\n      onDragLeave = _ref.onDragLeave,\n      onDragEnd = _ref.onDragEnd,\n      onDrop = _ref.onDrop,\n      onExpand = _ref.onExpand,\n      onRenderTreeIcon = _ref.onRenderTreeIcon,\n      onRenderTreeNode = _ref.onRenderTreeNode,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, [\"as\", \"rtl\", \"label\", \"layer\", \"style\", \"active\", \"loading\", \"nodeData\", \"className\", \"classPrefix\", \"disabled\", \"visible\", \"draggable\", \"expand\", \"focus\", \"hasChildren\", \"dragging\", \"dragOver\", \"dragOverTop\", \"dragOverBottom\", \"onSelect\", \"onDragStart\", \"onDragOver\", \"onDragEnter\", \"onDragLeave\", \"onDragEnd\", \"onDrop\", \"onExpand\", \"onRenderTreeIcon\", \"onRenderTreeNode\"]);\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      prefix = _useClassNames.prefix,\n      merge = _useClassNames.merge,\n      withClassPrefix = _useClassNames.withClassPrefix;\n\n  var getTitle = (0, _react.useCallback)(function () {\n    if (typeof label === 'string') {\n      return label;\n    } else if ( /*#__PURE__*/_react.default.isValidElement(label)) {\n      var nodes = (0, _reactToString.default)(label);\n      return nodes.join('');\n    }\n  }, [label]);\n  var handleExpand = (0, _react.useCallback)(function (event) {\n    var _event$nativeEvent, _event$nativeEvent$st;\n\n    // stop propagation when using custom loading icon\n    event === null || event === void 0 ? void 0 : (_event$nativeEvent = event.nativeEvent) === null || _event$nativeEvent === void 0 ? void 0 : (_event$nativeEvent$st = _event$nativeEvent.stopImmediatePropagation) === null || _event$nativeEvent$st === void 0 ? void 0 : _event$nativeEvent$st.call(_event$nativeEvent);\n    onExpand === null || onExpand === void 0 ? void 0 : onExpand(nodeData);\n  }, [nodeData, onExpand]);\n  var handleSelect = (0, _react.useCallback)(function (event) {\n    if (disabled) {\n      return;\n    }\n\n    if (event.target instanceof HTMLElement) {\n      if ((0, _hasClass.default)(event.target.parentNode, prefix('expand-icon-wrapper'))) {\n        return;\n      }\n    }\n\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(nodeData, event);\n  }, [nodeData, disabled, prefix, onSelect]);\n  var handleDragStart = (0, _react.useCallback)(function (event) {\n    onDragStart === null || onDragStart === void 0 ? void 0 : onDragStart(nodeData, event);\n  }, [nodeData, onDragStart]);\n  var handleDragEnter = (0, _react.useCallback)(function (event) {\n    event.preventDefault();\n    event.stopPropagation();\n    onDragEnter === null || onDragEnter === void 0 ? void 0 : onDragEnter(nodeData, event);\n  }, [nodeData, onDragEnter]);\n  var handleDragOver = (0, _react.useCallback)(function (event) {\n    event.preventDefault();\n    event.stopPropagation();\n    onDragOver === null || onDragOver === void 0 ? void 0 : onDragOver(nodeData, event);\n  }, [nodeData, onDragOver]);\n  var handleDragLeave = (0, _react.useCallback)(function (event) {\n    event.stopPropagation();\n    onDragLeave === null || onDragLeave === void 0 ? void 0 : onDragLeave(nodeData, event);\n  }, [nodeData, onDragLeave]);\n  var handleDragEnd = (0, _react.useCallback)(function (event) {\n    event.stopPropagation();\n    onDragEnd === null || onDragEnd === void 0 ? void 0 : onDragEnd(nodeData, event);\n  }, [nodeData, onDragEnd]);\n  var handleDrop = (0, _react.useCallback)(function (event) {\n    event.preventDefault();\n    event.stopPropagation();\n    onDrop === null || onDrop === void 0 ? void 0 : onDrop(nodeData, event);\n  }, [nodeData, onDrop]);\n\n  var renderIcon = function renderIcon() {\n    var classes = prefix('expand-icon', 'icon', {\n      expanded: expand\n    });\n\n    var expandIcon = /*#__PURE__*/_react.default.createElement(_ArrowDown.default, {\n      className: classes,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 176,\n        columnNumber: 24\n      }\n    });\n\n    if (loading) {\n      expandIcon = /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: prefix('loading-icon'),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 179,\n          columnNumber: 11\n        }\n      }, /*#__PURE__*/_react.default.createElement(_Spinner.default, {\n        spin: true,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 180,\n          columnNumber: 13\n        }\n      }));\n    }\n\n    if (nodeData !== undefined && typeof onRenderTreeIcon === 'function') {\n      var customIcon = onRenderTreeIcon(nodeData);\n      expandIcon = customIcon !== null ? /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: prefix('custom-icon'),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 188,\n          columnNumber: 13\n        }\n      }, customIcon) : expandIcon;\n    }\n\n    return hasChildren ? /*#__PURE__*/_react.default.createElement(\"div\", {\n      role: \"button\",\n      tabIndex: -1,\n      \"data-ref\": nodeData.refKey,\n      className: prefix('expand-icon-wrapper'),\n      onClick: handleExpand,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 195,\n        columnNumber: 9\n      }\n    }, expandIcon) : null;\n  };\n\n  var renderLabel = function renderLabel() {\n    var contentClasses = prefix('label-content', {\n      dragging: dragging,\n      'drag-over': dragOver,\n      'drag-over-top': dragOverTop,\n      'drag-over-bottom': dragOverBottom\n    });\n    return /*#__PURE__*/_react.default.createElement(\"span\", {\n      className: prefix('label'),\n      title: getTitle(),\n      \"data-layer\": layer,\n      \"data-key\": (nodeData === null || nodeData === void 0 ? void 0 : nodeData.refKey) || '',\n      role: \"button\",\n      tabIndex: -1,\n      onClick: handleSelect,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 215,\n        columnNumber: 9\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"span\", {\n      className: contentClasses,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 224,\n        columnNumber: 11\n      }\n    }, onRenderTreeNode ? onRenderTreeNode(nodeData) : label));\n  };\n\n  var classes = merge(className, withClassPrefix({\n    disabled: disabled,\n    active: active,\n    'text-muted': disabled,\n    focus: focus\n  }));\n  var styles = (0, _extends2.default)({}, style, (0, _treeUtils.getTreeNodeIndent)(rtl, layer - 1));\n  return visible ? /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n    role: \"treeitem\"\n  }, rest, {\n    \"aria-expanded\": expand,\n    \"aria-label\": label,\n    \"aria-level\": layer,\n    \"aria-disabled\": disabled,\n    \"aria-selected\": active,\n    style: styles,\n    className: classes,\n    ref: ref,\n    draggable: draggable,\n    onDragStart: handleDragStart,\n    onDragEnter: handleDragEnter,\n    onDragOver: handleDragOver,\n    onDragLeave: handleDragLeave,\n    onDragEnd: handleDragEnd,\n    onDrop: handleDrop,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 239,\n      columnNumber: 7\n    }\n  }), renderIcon(), renderLabel()) : null;\n});\nTreeNode.displayName = 'TreePickerNode';\nTreeNode.propTypes = {\n  as: _propTypes.default.elementType,\n  rtl: _propTypes.default.bool,\n  focus: _propTypes.default.bool,\n  layer: _propTypes.default.number,\n  value: _propTypes.default.any,\n  label: _propTypes.default.any,\n  expand: _propTypes.default.bool,\n  active: _propTypes.default.bool,\n  loading: _propTypes.default.bool,\n  visible: _propTypes.default.bool,\n  nodeData: _propTypes.default.any,\n  disabled: _propTypes.default.bool,\n  draggable: _propTypes.default.bool,\n  dragging: _propTypes.default.bool,\n  dragOver: _propTypes.default.bool,\n  dragOverTop: _propTypes.default.bool,\n  dragOverBottom: _propTypes.default.bool,\n  hasChildren: _propTypes.default.bool,\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string,\n  style: _propTypes.default.object,\n  onExpand: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  onRenderTreeIcon: _propTypes.default.func,\n  onRenderTreeNode: _propTypes.default.func,\n  onDragStart: _propTypes.default.func,\n  onDragEnter: _propTypes.default.func,\n  onDragOver: _propTypes.default.func,\n  onDragLeave: _propTypes.default.func,\n  onDragEnd: _propTypes.default.func,\n  onDrop: _propTypes.default.func\n};\nvar _default = TreeNode;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/TreePicker/TreeNode.tsx?");
 
 /***/ }),
 
@@ -4652,7 +4696,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = exports.maxTreeHeight = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _isFunction2 = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\n\nvar _isNil2 = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\n\nvar _isUndefined2 = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\n\nvar _omit2 = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\n\nvar _pick2 = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _VirtualizedList = __webpack_require__(/*! ../Picker/VirtualizedList */ \"./src/Picker/VirtualizedList.tsx\");\n\nvar _TreeNode = _interopRequireDefault(__webpack_require__(/*! ./TreeNode */ \"./src/TreePicker/TreeNode.tsx\"));\n\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Picker = __webpack_require__(/*! ../Picker */ \"./src/Picker/index.ts\");\n\nvar _TreeContext = _interopRequireDefault(__webpack_require__(/*! ../Tree/TreeContext */ \"./src/Tree/TreeContext.ts\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/TreePicker/TreePicker.tsx\",\n    _this = void 0;\n\n// default value for virtualized\nvar maxTreeHeight = 320;\nexports.maxTreeHeight = maxTreeHeight;\nvar emptyArray = [];\n\nvar TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$data = props.data,\n      data = _props$data === void 0 ? emptyArray : _props$data,\n      _props$appearance = props.appearance,\n      appearance = _props$appearance === void 0 ? 'default' : _props$appearance,\n      style = props.style,\n      showIndentLine = props.showIndentLine,\n      controlledValue = props.value,\n      overrideLocale = props.locale,\n      _props$height = props.height,\n      height = _props$height === void 0 ? 360 : _props$height,\n      className = props.className,\n      disabled = props.disabled,\n      _props$placement = props.placement,\n      placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n      _props$cleanable = props.cleanable,\n      cleanable = _props$cleanable === void 0 ? true : _props$cleanable,\n      menuStyle = props.menuStyle,\n      _props$searchable = props.searchable,\n      searchable = _props$searchable === void 0 ? true : _props$searchable,\n      _props$virtualized = props.virtualized,\n      virtualized = _props$virtualized === void 0 ? false : _props$virtualized,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n      defaultValue = props.defaultValue,\n      placeholder = props.placeholder,\n      searchKeyword = props.searchKeyword,\n      menuClassName = props.menuClassName,\n      _props$menuAutoWidth = props.menuAutoWidth,\n      menuAutoWidth = _props$menuAutoWidth === void 0 ? true : _props$menuAutoWidth,\n      searchBy = props.searchBy,\n      toggleAs = props.toggleAs,\n      _props$labelKey = props.labelKey,\n      labelKey = _props$labelKey === void 0 ? 'label' : _props$labelKey,\n      _props$valueKey = props.valueKey,\n      valueKey = _props$valueKey === void 0 ? 'value' : _props$valueKey,\n      _props$childrenKey = props.childrenKey,\n      childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,\n      draggable = props.draggable,\n      defaultExpandAll = props.defaultExpandAll,\n      _props$disabledItemVa = props.disabledItemValues,\n      disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,\n      controlledExpandItemValues = props.expandItemValues,\n      defaultExpandItemValues = props.defaultExpandItemValues,\n      id = props.id,\n      listProps = props.listProps,\n      getChildren = props.getChildren,\n      renderTreeIcon = props.renderTreeIcon,\n      renderTreeNode = props.renderTreeNode,\n      onExit = props.onExit,\n      onExited = props.onExited,\n      onClean = props.onClean,\n      onOpen = props.onOpen,\n      onSearch = props.onSearch,\n      onSelect = props.onSelect,\n      onChange = props.onChange,\n      onEntered = props.onEntered,\n      onClose = props.onClose,\n      onDragEnd = props.onDragEnd,\n      onDragStart = props.onDragStart,\n      onDragEnter = props.onDragEnter,\n      onDragLeave = props.onDragLeave,\n      onDragOver = props.onDragOver,\n      onDrop = props.onDrop,\n      onExpand = props.onExpand,\n      renderExtraFooter = props.renderExtraFooter,\n      renderMenu = props.renderMenu,\n      renderValue = props.renderValue,\n      renderDragNode = props.renderDragNode,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"data\", \"appearance\", \"style\", \"showIndentLine\", \"value\", \"locale\", \"height\", \"className\", \"disabled\", \"placement\", \"cleanable\", \"menuStyle\", \"searchable\", \"virtualized\", \"classPrefix\", \"defaultValue\", \"placeholder\", \"searchKeyword\", \"menuClassName\", \"menuAutoWidth\", \"searchBy\", \"toggleAs\", \"labelKey\", \"valueKey\", \"childrenKey\", \"draggable\", \"defaultExpandAll\", \"disabledItemValues\", \"expandItemValues\", \"defaultExpandItemValues\", \"id\", \"listProps\", \"getChildren\", \"renderTreeIcon\", \"renderTreeNode\", \"onExit\", \"onExited\", \"onClean\", \"onOpen\", \"onSearch\", \"onSelect\", \"onChange\", \"onEntered\", \"onClose\", \"onDragEnd\", \"onDragStart\", \"onDragEnter\", \"onDragLeave\", \"onDragOver\", \"onDrop\", \"onExpand\", \"renderExtraFooter\", \"renderMenu\", \"renderValue\", \"renderDragNode\"]);\n  var triggerRef = (0, _react.useRef)(null);\n  var targetRef = (0, _react.useRef)(null);\n  var listRef = (0, _react.useRef)(null);\n  var overlayRef = (0, _react.useRef)(null);\n  var searchInputRef = (0, _react.useRef)(null);\n  var treeViewRef = (0, _react.useRef)(null);\n\n  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),\n      rtl = _useCustom.rtl,\n      locale = _useCustom.locale;\n\n  var _useContext = (0, _react.useContext)(_TreeContext.default),\n      inline = _useContext.inline,\n      dragNodeRef = _useContext.dragNodeRef;\n\n  var _useControlled = (0, _utils.useControlled)(controlledValue, defaultValue),\n      value = _useControlled[0],\n      setValue = _useControlled[1],\n      isControlled = _useControlled[2];\n\n  var _useGetTreeNodeChildr = (0, _treeUtils.useGetTreeNodeChildren)(data, valueKey, childrenKey),\n      treeData = _useGetTreeNodeChildr.data,\n      setTreeData = _useGetTreeNodeChildr.setData,\n      loadingNodeValues = _useGetTreeNodeChildr.loadingNodeValues,\n      loadChildren = _useGetTreeNodeChildr.loadChildren;\n\n  var _useControlled2 = (0, _utils.useControlled)(controlledExpandItemValues, (0, _treeUtils.getDefaultExpandItemValues)(treeData, {\n    defaultExpandAll: defaultExpandAll,\n    valueKey: valueKey,\n    childrenKey: childrenKey,\n    defaultExpandItemValues: defaultExpandItemValues\n  })),\n      expandItemValues = _useControlled2[0],\n      setExpandItemValues = _useControlled2[1];\n\n  var _useState = (0, _react.useState)(false),\n      active = _useState[0],\n      setActive = _useState[1];\n\n  var _useState2 = (0, _react.useState)(null),\n      focusItemValue = _useState2[0],\n      setFocusItemValue = _useState2[1];\n\n  var _useFlattenTreeData = (0, _treeUtils.useFlattenTreeData)({\n    data: treeData,\n    labelKey: labelKey,\n    valueKey: valueKey,\n    childrenKey: childrenKey,\n    callback: function callback() {\n      // after flattenData, always trigger re-render\n      forceUpdate();\n    }\n  }),\n      flattenNodes = _useFlattenTreeData.flattenNodes,\n      forceUpdate = _useFlattenTreeData.forceUpdate,\n      formatVirtualizedTreeData = _useFlattenTreeData.formatVirtualizedTreeData;\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      prefix = _useClassNames.prefix,\n      merge = _useClassNames.merge;\n\n  var _useClassNames2 = (0, _utils.useClassNames)('tree'),\n      treePrefix = _useClassNames2.prefix,\n      withTreeClassPrefix = _useClassNames2.withClassPrefix;\n\n  var _useTreeSearch = (0, _treeUtils.useTreeSearch)({\n    labelKey: labelKey,\n    childrenKey: childrenKey,\n    searchKeyword: searchKeyword,\n    data: treeData,\n    searchBy: searchBy,\n    callback: function callback(searchKeyword, _filterData, event) {\n      onSearch === null || onSearch === void 0 ? void 0 : onSearch(searchKeyword, event);\n    }\n  }),\n      filteredData = _useTreeSearch.filteredData,\n      searchKeywordState = _useTreeSearch.searchKeywordState,\n      setSearchKeyword = _useTreeSearch.setSearchKeyword,\n      handleSearch = _useTreeSearch.handleSearch,\n      setFilteredData = _useTreeSearch.setFilteredData;\n\n  var _useTreeDrag = (0, _treeUtils.useTreeDrag)(),\n      dragNodeKeys = _useTreeDrag.dragNodeKeys,\n      dragOverNodeKey = _useTreeDrag.dragOverNodeKey,\n      dragNode = _useTreeDrag.dragNode,\n      dropNodePosition = _useTreeDrag.dropNodePosition,\n      setDragNodeKeys = _useTreeDrag.setDragNodeKeys,\n      setDragOverNodeKey = _useTreeDrag.setDragOverNodeKey,\n      setDragNode = _useTreeDrag.setDragNode,\n      setDropNodePosition = _useTreeDrag.setDropNodePosition;\n\n  var _useTreeNodeRefs = (0, _treeUtils.useTreeNodeRefs)(),\n      treeNodesRefs = _useTreeNodeRefs.treeNodesRefs,\n      saveTreeNodeRef = _useTreeNodeRefs.saveTreeNodeRef;\n\n  var activeNode = (0, _treeUtils.getTreeActiveNode)(flattenNodes, value, valueKey);\n  var getFormattedNodes = (0, _react.useCallback)(function (render) {\n    if (virtualized) {\n      return formatVirtualizedTreeData(flattenNodes, filteredData, expandItemValues, {\n        searchKeyword: searchKeywordState\n      }).filter(function (n) {\n        return n.visible;\n      });\n    }\n\n    return filteredData.map(function (dataItem, index) {\n      return render === null || render === void 0 ? void 0 : render(dataItem, index, 1);\n    });\n  }, [searchKeywordState, expandItemValues, filteredData, flattenNodes, formatVirtualizedTreeData, virtualized]);\n  var focusActiveNode = (0, _react.useCallback)(function () {\n    (0, _treeUtils.focusToActiveTreeNode)({\n      list: listRef.current,\n      valueKey: valueKey,\n      selector: \".\" + treePrefix('node-active'),\n      activeNode: activeNode,\n      virtualized: virtualized,\n      container: treeViewRef.current,\n      formattedNodes: getFormattedNodes()\n    });\n  }, [treePrefix, activeNode, getFormattedNodes, valueKey, virtualized]);\n  (0, _react.useEffect)(function () {\n    setFilteredData(data, searchKeywordState);\n    setTreeData(data);\n  }, [data, searchKeywordState, setFilteredData, setTreeData]);\n  (0, _react.useEffect)(function () {\n    setFilteredData(treeData, searchKeywordState);\n  }, [treeData, searchKeywordState, setFilteredData]);\n  (0, _react.useEffect)(function () {\n    if (Array.isArray(controlledExpandItemValues)) {\n      setExpandItemValues(controlledExpandItemValues);\n    }\n  }, [controlledExpandItemValues, setExpandItemValues]);\n  (0, _react.useEffect)(function () {\n    setSearchKeyword(searchKeyword !== null && searchKeyword !== void 0 ? searchKeyword : '');\n  }, [searchKeyword, setSearchKeyword]);\n  (0, _react.useEffect)(function () {\n    if (dragNodeRef) {\n      var _treeViewRef$current;\n\n      dragNodeRef.current = (_treeViewRef$current = treeViewRef.current) === null || _treeViewRef$current === void 0 ? void 0 : _treeViewRef$current.querySelector(\".\" + treePrefix('drag-node-mover'));\n    } // eslint-disable-next-line react-hooks/exhaustive-deps\n\n  }, []);\n  var getDropData = (0, _react.useCallback)(function (nodeData) {\n    var options = {\n      valueKey: valueKey,\n      childrenKey: childrenKey\n    };\n    return {\n      /** draggingNode */\n      dragNode: dragNode,\n\n      /** dropNode */\n      dropNode: nodeData,\n\n      /** dragAndDrop Position type */\n      dropNodePosition: dropNodePosition,\n      createUpdateDataFunction: (0, _treeUtils.createUpdateTreeDataFunction)({\n        dragNode: dragNode,\n        dropNode: nodeData,\n        dropNodePosition: dropNodePosition\n      }, options)\n    };\n  }, [dragNode, valueKey, childrenKey, dropNodePosition]);\n\n  var getTreeNodeProps = function getTreeNodeProps(node, layer, index) {\n    var draggingNode = dragNode !== null && dragNode !== void 0 ? dragNode : {};\n    return {\n      as: Component,\n      rtl: rtl,\n      value: node[valueKey],\n      label: node[labelKey],\n      index: index,\n      layer: layer,\n      loading: loadingNodeValues.some(function (item) {\n        return (0, _utils.shallowEqual)(item, node[valueKey]);\n      }),\n      expand: node.expand,\n      active: (0, _utils.shallowEqual)(node[valueKey], value),\n      focus: (0, _utils.shallowEqual)(node[valueKey], focusItemValue),\n      visible: node.visible,\n      draggable: draggable,\n      dragging: (0, _utils.shallowEqual)(node[valueKey], draggingNode[valueKey]),\n      children: node[childrenKey],\n      nodeData: node,\n      disabled: disabledItemValues.some(function (disabledItem) {\n        return (0, _utils.shallowEqual)(disabledItem, node[valueKey]);\n      }),\n      dragOver: (0, _utils.shallowEqual)(node[valueKey], dragOverNodeKey) && dropNodePosition === _utils.TREE_NODE_DROP_POSITION.DRAG_OVER,\n      dragOverTop: (0, _utils.shallowEqual)(node[valueKey], dragOverNodeKey) && dropNodePosition === _utils.TREE_NODE_DROP_POSITION.DRAG_OVER_TOP,\n      dragOverBottom: (0, _utils.shallowEqual)(node[valueKey], dragOverNodeKey) && dropNodePosition === _utils.TREE_NODE_DROP_POSITION.DRAG_OVER_BOTTOM,\n      onSelect: handleSelect,\n      onDragStart: handleDragStart,\n      onDragEnter: handleDragEnter,\n      onDragOver: handleDragOver,\n      onDragLeave: handleDragLeave,\n      onDragEnd: handleDragEnd,\n      onDrop: handleDrop,\n      onExpand: handleExpand,\n      onRenderTreeNode: renderTreeNode,\n      onRenderTreeIcon: renderTreeIcon\n    };\n  };\n\n  var handleSelect = (0, _react.useCallback)(function (nodeData, event) {\n    var _targetRef$current, _triggerRef$current, _triggerRef$current$c;\n\n    if (!nodeData) {\n      return;\n    }\n\n    var nodeValue = nodeData[valueKey];\n\n    if (!isControlled) {\n      setValue(nodeValue);\n    }\n\n    setFocusItemValue(nodeData[valueKey]);\n    onChange === null || onChange === void 0 ? void 0 : onChange(nodeValue, event);\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(nodeData, nodeValue, event);\n    (_targetRef$current = targetRef.current) === null || _targetRef$current === void 0 ? void 0 : _targetRef$current.focus();\n    (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : (_triggerRef$current$c = _triggerRef$current.close) === null || _triggerRef$current$c === void 0 ? void 0 : _triggerRef$current$c.call(_triggerRef$current);\n  }, [valueKey, isControlled, onChange, onSelect, setValue]);\n  var handleExpand = (0, _react.useCallback)(function (node) {\n    var nextExpandItemValues = (0, _treeUtils.toggleExpand)({\n      node: node,\n      isExpand: !node.expand,\n      expandItemValues: expandItemValues,\n      valueKey: valueKey\n    });\n    setExpandItemValues(nextExpandItemValues);\n    onExpand === null || onExpand === void 0 ? void 0 : onExpand(nextExpandItemValues, node, (0, _Picker.createConcatChildrenFunction)(node, node[valueKey], {\n      valueKey: valueKey,\n      childrenKey: childrenKey\n    }));\n\n    if ((0, _isFunction2.default)(getChildren) && !node.expand && Array.isArray(node[childrenKey]) && node[childrenKey].length === 0) {\n      loadChildren(node, getChildren);\n    }\n  }, [valueKey, childrenKey, expandItemValues, getChildren, onExpand, setExpandItemValues, loadChildren]);\n  var handleDragStart = (0, _react.useCallback)(function (nodeData, event) {\n    if (draggable) {\n      setDragNodeKeys((0, _treeUtils.getDragNodeKeys)(nodeData, childrenKey, valueKey));\n      setDragNode(flattenNodes[nodeData.refKey]);\n      onDragStart === null || onDragStart === void 0 ? void 0 : onDragStart(nodeData, event);\n    }\n  }, [draggable, childrenKey, flattenNodes, onDragStart, setDragNodeKeys, setDragNode, valueKey]);\n  var handleDragEnter = (0, _react.useCallback)(function (nodeData, event) {\n    if (dragNodeKeys.some(function (d) {\n      return (0, _utils.shallowEqual)(d, nodeData[valueKey]);\n    })) {\n      return;\n    }\n\n    if (dragNode) {\n      setDragOverNodeKey(nodeData[valueKey]);\n      setDropNodePosition((0, _treeUtils.calDropNodePosition)(event, treeNodesRefs[nodeData.refKey]));\n    }\n\n    onDragEnter === null || onDragEnter === void 0 ? void 0 : onDragEnter(nodeData, event);\n  }, [dragNode, treeNodesRefs, dragNodeKeys, onDragEnter, setDragOverNodeKey, setDropNodePosition, valueKey]);\n  var handleDragOver = (0, _react.useCallback)(function (nodeData, event) {\n    if (dragNodeKeys.some(function (d) {\n      return (0, _utils.shallowEqual)(d, nodeData[valueKey]);\n    })) {\n      return;\n    }\n\n    if (dragNode && (0, _utils.shallowEqual)(nodeData[valueKey], dragOverNodeKey)) {\n      var lastDropNodePosition = (0, _treeUtils.calDropNodePosition)(event, treeNodesRefs[nodeData.refKey]);\n      if (lastDropNodePosition === dropNodePosition) return;\n      setDropNodePosition(lastDropNodePosition);\n    }\n\n    onDragOver === null || onDragOver === void 0 ? void 0 : onDragOver(nodeData, event);\n  }, [dragNode, dragNodeKeys, dragOverNodeKey, dropNodePosition, onDragOver, setDropNodePosition, treeNodesRefs, valueKey]);\n  var handleDragLeave = (0, _react.useCallback)(function (nodeData, event) {\n    onDragLeave === null || onDragLeave === void 0 ? void 0 : onDragLeave(nodeData, event);\n  }, [onDragLeave]);\n  var handleDragEnd = (0, _react.useCallback)(function (nodeData, event) {\n    setDragNode(null);\n    setDragNodeKeys([]);\n    setDragOverNodeKey(null);\n    onDragEnd === null || onDragEnd === void 0 ? void 0 : onDragEnd(nodeData, event);\n  }, [setDragNode, setDragNodeKeys, setDragOverNodeKey, onDragEnd]);\n  var handleDrop = (0, _react.useCallback)(function (nodeData, event) {\n    if (dragNodeKeys.some(function (d) {\n      return (0, _utils.shallowEqual)(d, nodeData[valueKey]);\n    })) {\n      console.error('Cannot drag a node to itself and its children');\n    } else {\n      var dropData = getDropData(nodeData);\n      onDrop === null || onDrop === void 0 ? void 0 : onDrop(dropData, event);\n    }\n\n    setDragNode(null);\n    setDragNodeKeys([]);\n    setDragOverNodeKey(null);\n  }, [dragNodeKeys, setDragNode, setDragOverNodeKey, setDragNodeKeys, onDrop, getDropData, valueKey]);\n  var handleOpen = (0, _react.useCallback)(function () {\n    var _triggerRef$current2, _triggerRef$current2$;\n\n    (_triggerRef$current2 = triggerRef.current) === null || _triggerRef$current2 === void 0 ? void 0 : (_triggerRef$current2$ = _triggerRef$current2.open) === null || _triggerRef$current2$ === void 0 ? void 0 : _triggerRef$current2$.call(_triggerRef$current2);\n    focusActiveNode();\n    onOpen === null || onOpen === void 0 ? void 0 : onOpen();\n    setActive(true);\n  }, [focusActiveNode, onOpen]);\n  var handleClose = (0, _react.useCallback)(function () {\n    var _triggerRef$current3, _triggerRef$current3$, _targetRef$current2;\n\n    (_triggerRef$current3 = triggerRef.current) === null || _triggerRef$current3 === void 0 ? void 0 : (_triggerRef$current3$ = _triggerRef$current3.close) === null || _triggerRef$current3$ === void 0 ? void 0 : _triggerRef$current3$.call(_triggerRef$current3);\n    setSearchKeyword('');\n    setActive(false);\n    setFocusItemValue(activeNode === null || activeNode === void 0 ? void 0 : activeNode[valueKey]);\n    /**\n     * when using keyboard toggle picker, should refocus on PickerToggle Component after close picker menu\n     */\n\n    (_targetRef$current2 = targetRef.current) === null || _targetRef$current2 === void 0 ? void 0 : _targetRef$current2.focus();\n  }, [activeNode, setSearchKeyword, valueKey]);\n  (0, _Picker.usePublicMethods)(ref, {\n    rootRef: inline ? treeViewRef : undefined,\n    triggerRef: triggerRef,\n    overlayRef: overlayRef,\n    targetRef: targetRef,\n    listRef: listRef,\n    inline: inline\n  });\n  var handleFocusItem = (0, _react.useCallback)(function (key) {\n    var focusableItems = (0, _treeUtils.getFocusableItems)(filteredData, {\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey,\n      childrenKey: childrenKey,\n      expandItemValues: expandItemValues\n    }, (0, _treeUtils.isSearching)(searchKeywordState));\n    var selector = \".\" + treePrefix('node-label');\n    var focusProps = {\n      focusItemValue: focusItemValue,\n      focusableItems: focusableItems,\n      treeNodesRefs: treeNodesRefs,\n      selector: selector,\n      valueKey: valueKey,\n      callback: function callback(nextFocusItemValue) {\n        setFocusItemValue(nextFocusItemValue);\n      }\n    };\n\n    if (key === _utils.KEY_VALUES.DOWN) {\n      (0, _treeUtils.focusNextItem)(focusProps);\n      return;\n    }\n\n    if (key === _utils.KEY_VALUES.UP) {\n      (0, _treeUtils.focusPreviousItem)(focusProps);\n    }\n  }, [searchKeywordState, expandItemValues, filteredData, focusItemValue, treeNodesRefs, treePrefix, valueKey, childrenKey, disabledItemValues]);\n  var handleLeftArrow = (0, _react.useCallback)(function () {\n    if ((0, _isNil2.default)(focusItemValue)) return;\n    var focusItem = (0, _treeUtils.getActiveItem)(focusItemValue, flattenNodes, valueKey);\n    (0, _treeUtils.leftArrowHandler)({\n      focusItem: focusItem,\n      expand: expandItemValues.includes(focusItem === null || focusItem === void 0 ? void 0 : focusItem[valueKey]),\n      onExpand: handleExpand,\n      childrenKey: childrenKey,\n      onFocusItem: function onFocusItem() {\n        var _focusItem$parent, _focusItem$parent2;\n\n        setFocusItemValue(focusItem === null || focusItem === void 0 ? void 0 : (_focusItem$parent = focusItem.parent) === null || _focusItem$parent === void 0 ? void 0 : _focusItem$parent[valueKey]);\n        (0, _treeUtils.focusTreeNode)(focusItem === null || focusItem === void 0 ? void 0 : (_focusItem$parent2 = focusItem.parent) === null || _focusItem$parent2 === void 0 ? void 0 : _focusItem$parent2.refKey, treeNodesRefs, \".\" + treePrefix('node-label'));\n      }\n    });\n  }, [expandItemValues, flattenNodes, focusItemValue, handleExpand, treeNodesRefs, treePrefix, valueKey, childrenKey]);\n  var handleRightArrow = (0, _react.useCallback)(function () {\n    if ((0, _isNil2.default)(focusItemValue)) return;\n    var focusItem = (0, _treeUtils.getActiveItem)(focusItemValue, flattenNodes, valueKey);\n    (0, _treeUtils.rightArrowHandler)({\n      focusItem: focusItem,\n      expand: expandItemValues.includes(focusItem === null || focusItem === void 0 ? void 0 : focusItem[valueKey]),\n      childrenKey: childrenKey,\n      onExpand: handleExpand,\n      onFocusItem: function onFocusItem() {\n        handleFocusItem(_utils.KEY_VALUES.DOWN);\n      }\n    });\n  }, [focusItemValue, flattenNodes, valueKey, expandItemValues, childrenKey, handleExpand, handleFocusItem]);\n  var selectActiveItem = (0, _react.useCallback)(function (event) {\n    if ((0, _isNil2.default)(focusItemValue)) return;\n    var activeItem = (0, _treeUtils.getActiveItem)(focusItemValue, flattenNodes, valueKey);\n    handleSelect(activeItem, event);\n  }, [flattenNodes, valueKey, focusItemValue, handleSelect]);\n  var handleClean = (0, _react.useCallback)(function (event) {\n    var nullValue = null;\n    var target = event.target; // exclude searchBar\n\n    if (target.matches('div[role=\"searchbox\"] > input')) {\n      return;\n    }\n\n    setValue(null);\n    onChange === null || onChange === void 0 ? void 0 : onChange(nullValue, event);\n  }, [onChange, setValue]);\n  var onPickerKeydown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !activeNode || !active,\n    triggerRef: triggerRef,\n    targetRef: targetRef,\n    overlayRef: overlayRef,\n    searchInputRef: searchInputRef,\n    active: active,\n    onExit: handleClean,\n    onClose: handleClose,\n    onMenuKeyDown: function onMenuKeyDown(event) {\n      (0, _Picker.onMenuKeyDown)(event, {\n        down: function down() {\n          return handleFocusItem(_utils.KEY_VALUES.DOWN);\n        },\n        up: function up() {\n          return handleFocusItem(_utils.KEY_VALUES.UP);\n        },\n        left: rtl ? handleRightArrow : handleLeftArrow,\n        right: rtl ? handleLeftArrow : handleRightArrow,\n        enter: selectActiveItem,\n        del: handleClean\n      });\n    }\n  }, rest));\n  var handleTreeKeyDown = (0, _react.useCallback)(function (event) {\n    if (!treeViewRef.current) {\n      return;\n    }\n\n    (0, _Picker.onMenuKeyDown)(event, {\n      down: function down() {\n        return handleFocusItem(_utils.KEY_VALUES.DOWN);\n      },\n      up: function up() {\n        return handleFocusItem(_utils.KEY_VALUES.UP);\n      },\n      left: rtl ? handleRightArrow : handleLeftArrow,\n      right: rtl ? handleLeftArrow : handleRightArrow,\n      enter: selectActiveItem\n    });\n  }, [handleFocusItem, handleLeftArrow, handleRightArrow, rtl, selectActiveItem]);\n\n  var renderNode = function renderNode(node, index, layer) {\n    if (!node.visible) {\n      return null;\n    }\n\n    var children = node[childrenKey];\n    var expand = (0, _treeUtils.getExpandWhenSearching)(searchKeywordState, expandItemValues.includes(node[valueKey]));\n    var visibleChildren = (0, _isUndefined2.default)(searchKeywordState) || searchKeywordState.length === 0 ? !!children : (0, _treeUtils.hasVisibleChildren)(node, childrenKey);\n    var nodeProps = (0, _extends2.default)({}, getTreeNodeProps((0, _extends2.default)({}, node, {\n      expand: expand\n    }), layer, index), {\n      hasChildren: visibleChildren\n    });\n\n    if (nodeProps.hasChildren) {\n      var _merge;\n\n      layer += 1;\n      var openClass = treePrefix('open');\n      var childrenClass = merge(treePrefix('node-children'), (_merge = {}, _merge[openClass] = expand && visibleChildren, _merge));\n      var nodes = children || [];\n      return /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: childrenClass,\n        key: node[valueKey],\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 718,\n          columnNumber: 9\n        }\n      }, /*#__PURE__*/_react.default.createElement(_TreeNode.default, (0, _extends2.default)({}, nodeProps, {\n        ref: function ref(_ref) {\n          return saveTreeNodeRef(_ref, node.refKey);\n        },\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 719,\n          columnNumber: 11\n        }\n      })), /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: treePrefix('children'),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 720,\n          columnNumber: 11\n        }\n      }, nodes.map(function (child, i) {\n        return renderNode(child, i, layer);\n      }), showIndentLine && /*#__PURE__*/_react.default.createElement(\"span\", {\n        className: treePrefix('indent-line'),\n        style: (0, _treeUtils.getTreeNodeIndent)(rtl, layer - 1, true),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 723,\n          columnNumber: 15\n        }\n      })));\n    }\n\n    return /*#__PURE__*/_react.default.createElement(_TreeNode.default, (0, _extends2.default)({\n      ref: function ref(_ref2) {\n        return saveTreeNodeRef(_ref2, node.refKey);\n      },\n      key: node[valueKey]\n    }, nodeProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 733,\n        columnNumber: 7\n      }\n    }));\n  };\n\n  var renderVirtualListNode = function renderVirtualListNode(nodes) {\n    return function (_ref3) {\n      var key = _ref3.key,\n          index = _ref3.index,\n          style = _ref3.style;\n      var node = nodes[index];\n      var layer = node.layer,\n          visible = node.visible;\n      var expand = (0, _treeUtils.getExpandWhenSearching)(searchKeywordState, expandItemValues.includes(node[valueKey]));\n\n      if (!node.visible) {\n        return null;\n      }\n\n      var nodeProps = (0, _extends2.default)({}, getTreeNodeProps((0, _extends2.default)({}, node, {\n        expand: expand\n      }), layer), {\n        style: style,\n        hasChildren: node.hasChildren\n      });\n      return visible && /*#__PURE__*/_react.default.createElement(_TreeNode.default, (0, _extends2.default)({\n        ref: function ref(_ref4) {\n          return saveTreeNodeRef(_ref4, node.refKey);\n        },\n        key: key\n      }, nodeProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 763,\n          columnNumber: 11\n        }\n      }));\n    };\n  };\n\n  var renderDefaultDragNode = function renderDefaultDragNode() {\n    if (draggable && !(0, _isNil2.default)(dragNode)) {\n      var dragNodeContent = dragNode === null || dragNode === void 0 ? void 0 : dragNode[labelKey];\n\n      if ((0, _isFunction2.default)(renderDragNode)) {\n        dragNodeContent = renderDragNode(dragNode);\n      }\n\n      return /*#__PURE__*/_react.default.createElement(\"span\", {\n        className: treePrefix('drag-node-mover'),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 774,\n          columnNumber: 14\n        }\n      }, dragNodeContent);\n    }\n\n    return null;\n  };\n\n  var renderTree = function renderTree() {\n    var _withTreeClassPrefix;\n\n    var classes = withTreeClassPrefix((_withTreeClassPrefix = {}, _withTreeClassPrefix[className !== null && className !== void 0 ? className : ''] = inline, _withTreeClassPrefix.virtualized = virtualized, _withTreeClassPrefix));\n    var formattedNodes = getFormattedNodes(renderNode);\n    var styles = inline ? (0, _extends2.default)({\n      height: height\n    }, style) : {};\n    return /*#__PURE__*/_react.default.createElement(\"div\", {\n      role: \"tree\",\n      id: id ? id + \"-listbox\" : undefined,\n      ref: treeViewRef,\n      className: classes,\n      style: styles,\n      onKeyDown: inline ? handleTreeKeyDown : undefined,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 788,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: treePrefix('nodes'),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 796,\n        columnNumber: 9\n      }\n    }, virtualized ? /*#__PURE__*/_react.default.createElement(_VirtualizedList.AutoSizer, {\n      defaultHeight: inline ? height : maxTreeHeight,\n      style: {\n        width: 'auto',\n        height: 'auto'\n      },\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 798,\n        columnNumber: 13\n      }\n    }, function (_ref5) {\n      var height = _ref5.height,\n          width = _ref5.width;\n      return /*#__PURE__*/_react.default.createElement(_VirtualizedList.List, (0, _extends2.default)({\n        ref: listRef,\n        width: width,\n        height: height,\n        rowHeight: 36,\n        rowCount: formattedNodes.length,\n        rowRenderer: renderVirtualListNode(formattedNodes),\n        scrollToAlignment: \"center\"\n      }, listProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 803,\n          columnNumber: 17\n        }\n      }));\n    }) : formattedNodes), renderDefaultDragNode());\n  };\n\n  var renderDropdownMenu = function renderDropdownMenu(positionProps, speakerRef) {\n    var left = positionProps.left,\n        top = positionProps.top,\n        className = positionProps.className;\n    var classes = merge(className, menuClassName, prefix('tree-menu'));\n    var mergedMenuStyle = (0, _extends2.default)({}, menuStyle, {\n      left: left,\n      top: top\n    });\n    var styles = virtualized ? (0, _extends2.default)({\n      height: height\n    }, mergedMenuStyle) : (0, _extends2.default)({}, mergedMenuStyle);\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerOverlay, {\n      autoWidth: menuAutoWidth,\n      className: classes,\n      style: styles,\n      ref: (0, _utils.mergeRefs)(overlayRef, speakerRef),\n      onKeyDown: onPickerKeydown,\n      target: triggerRef,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 831,\n        columnNumber: 7\n      }\n    }, searchable ? /*#__PURE__*/_react.default.createElement(_Picker.SearchBar, {\n      placeholder: locale.searchPlaceholder,\n      onChange: handleSearch,\n      value: searchKeywordState,\n      inputRef: searchInputRef,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 840,\n        columnNumber: 11\n      }\n    }) : null, renderMenu ? renderMenu(renderTree()) : renderTree(), renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  /**\n   * 1.Have a value and the value is valid.\n   * 2.Regardless of whether the value is valid, as long as renderValue is set, it is judged to have a value.\n   */\n\n\n  var hasValidValue = !(0, _isNil2.default)(activeNode) || !(0, _isNil2.default)(value) && (0, _isFunction2.default)(renderValue);\n  var selectedElement = placeholder;\n\n  if (hasValidValue) {\n    var node = activeNode !== null && activeNode !== void 0 ? activeNode : {};\n    selectedElement = node[labelKey];\n\n    if ((0, _isFunction2.default)(renderValue)) {\n      selectedElement = renderValue(value, node, selectedElement);\n\n      if ((0, _isNil2.default)(selectedElement)) {\n        hasValidValue = false;\n      }\n    }\n  }\n\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n    classPrefix: classPrefix,\n    appearance: appearance,\n    hasValue: hasValidValue,\n    name: 'tree',\n    cleanable: cleanable\n  })),\n      classes = _usePickerClassName[0],\n      usedClassNamePropKeys = _usePickerClassName[1];\n\n  if (inline) {\n    return renderTree();\n  }\n\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    pickerProps: (0, _pick2.default)(props, _Picker.pickTriggerPropKeys),\n    ref: triggerRef,\n    placement: placement,\n    onEnter: handleOpen,\n    onEntered: onEntered,\n    onExit: (0, _utils.createChainedFunction)(onClose, onExit),\n    onExited: (0, _utils.createChainedFunction)(handleClose, onExited),\n    speaker: renderDropdownMenu,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 885,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 895,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit2.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys, ['cascade'])), {\n    id: id,\n    ref: targetRef,\n    appearance: appearance,\n    onKeyDown: onPickerKeydown,\n    onClean: (0, _utils.createChainedFunction)(handleClean, onClean),\n    cleanable: cleanable && !disabled,\n    as: toggleAs,\n    disabled: disabled,\n    hasValue: hasValidValue,\n    active: active,\n    placement: placement,\n    inputValue: value,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 896,\n      columnNumber: 9\n    }\n  }), selectedElement || locale.placeholder)));\n});\n\nTreePicker.displayName = 'TreePicker';\nTreePicker.propTypes = (0, _extends2.default)({}, _Picker.listPickerPropTypes, {\n  locale: _propTypes.default.any,\n  appearance: _propTypes.default.oneOf(['default', 'subtle']),\n  height: _propTypes.default.number,\n  draggable: _propTypes.default.bool,\n  virtualized: _propTypes.default.bool,\n  searchable: _propTypes.default.bool,\n  menuAutoWidth: _propTypes.default.bool,\n  searchKeyword: _propTypes.default.string,\n  defaultExpandAll: _propTypes.default.bool,\n  expandItemValues: _propTypes.default.array,\n  defaultExpandItemValues: _propTypes.default.array,\n  onSearch: _propTypes.default.func,\n  onExpand: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  renderMenu: _propTypes.default.func,\n  renderTreeNode: _propTypes.default.func,\n  renderTreeIcon: _propTypes.default.func,\n  renderExtraFooter: _propTypes.default.func,\n  renderDragNode: _propTypes.default.func,\n  searchBy: _propTypes.default.func\n});\nvar _default = TreePicker;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/TreePicker/TreePicker.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nexports.default = exports.maxTreeHeight = void 0;\n\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\n\nvar _isFunction2 = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\n\nvar _isNil2 = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\n\nvar _isUndefined2 = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\n\nvar _omit2 = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\n\nvar _pick2 = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\n\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\n\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\n\nvar _VirtualizedList = __webpack_require__(/*! ../Picker/VirtualizedList */ \"./src/Picker/VirtualizedList.tsx\");\n\nvar _TreeNode = _interopRequireDefault(__webpack_require__(/*! ./TreeNode */ \"./src/TreePicker/TreeNode.tsx\"));\n\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\n\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\nvar _Picker = __webpack_require__(/*! ../Picker */ \"./src/Picker/index.ts\");\n\nvar _TreeContext = _interopRequireDefault(__webpack_require__(/*! ../Tree/TreeContext */ \"./src/Tree/TreeContext.ts\"));\n\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/TreePicker/TreePicker.tsx\",\n    _this = void 0;\n\n// default value for virtualized\nvar maxTreeHeight = 320;\nexports.maxTreeHeight = maxTreeHeight;\nvar emptyArray = [];\n\nvar TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n      Component = _props$as === void 0 ? 'div' : _props$as,\n      _props$data = props.data,\n      data = _props$data === void 0 ? emptyArray : _props$data,\n      _props$appearance = props.appearance,\n      appearance = _props$appearance === void 0 ? 'default' : _props$appearance,\n      style = props.style,\n      showIndentLine = props.showIndentLine,\n      controlledValue = props.value,\n      overrideLocale = props.locale,\n      _props$height = props.height,\n      height = _props$height === void 0 ? 360 : _props$height,\n      className = props.className,\n      disabled = props.disabled,\n      _props$placement = props.placement,\n      placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n      _props$cleanable = props.cleanable,\n      cleanable = _props$cleanable === void 0 ? true : _props$cleanable,\n      menuStyle = props.menuStyle,\n      _props$searchable = props.searchable,\n      searchable = _props$searchable === void 0 ? true : _props$searchable,\n      _props$virtualized = props.virtualized,\n      virtualized = _props$virtualized === void 0 ? false : _props$virtualized,\n      _props$classPrefix = props.classPrefix,\n      classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n      defaultValue = props.defaultValue,\n      placeholder = props.placeholder,\n      searchKeyword = props.searchKeyword,\n      menuClassName = props.menuClassName,\n      _props$menuAutoWidth = props.menuAutoWidth,\n      menuAutoWidth = _props$menuAutoWidth === void 0 ? true : _props$menuAutoWidth,\n      searchBy = props.searchBy,\n      toggleAs = props.toggleAs,\n      _props$labelKey = props.labelKey,\n      labelKey = _props$labelKey === void 0 ? 'label' : _props$labelKey,\n      _props$valueKey = props.valueKey,\n      valueKey = _props$valueKey === void 0 ? 'value' : _props$valueKey,\n      _props$childrenKey = props.childrenKey,\n      childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,\n      draggable = props.draggable,\n      defaultExpandAll = props.defaultExpandAll,\n      _props$disabledItemVa = props.disabledItemValues,\n      disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,\n      controlledExpandItemValues = props.expandItemValues,\n      defaultExpandItemValues = props.defaultExpandItemValues,\n      id = props.id,\n      listProps = props.listProps,\n      getChildren = props.getChildren,\n      renderTreeIcon = props.renderTreeIcon,\n      renderTreeNode = props.renderTreeNode,\n      onExit = props.onExit,\n      onExited = props.onExited,\n      onClean = props.onClean,\n      onOpen = props.onOpen,\n      onSearch = props.onSearch,\n      onSelect = props.onSelect,\n      onChange = props.onChange,\n      onEntered = props.onEntered,\n      onClose = props.onClose,\n      onDragEnd = props.onDragEnd,\n      onDragStart = props.onDragStart,\n      onDragEnter = props.onDragEnter,\n      onDragLeave = props.onDragLeave,\n      onDragOver = props.onDragOver,\n      onDrop = props.onDrop,\n      onExpand = props.onExpand,\n      renderExtraFooter = props.renderExtraFooter,\n      renderMenu = props.renderMenu,\n      renderValue = props.renderValue,\n      rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"data\", \"appearance\", \"style\", \"showIndentLine\", \"value\", \"locale\", \"height\", \"className\", \"disabled\", \"placement\", \"cleanable\", \"menuStyle\", \"searchable\", \"virtualized\", \"classPrefix\", \"defaultValue\", \"placeholder\", \"searchKeyword\", \"menuClassName\", \"menuAutoWidth\", \"searchBy\", \"toggleAs\", \"labelKey\", \"valueKey\", \"childrenKey\", \"draggable\", \"defaultExpandAll\", \"disabledItemValues\", \"expandItemValues\", \"defaultExpandItemValues\", \"id\", \"listProps\", \"getChildren\", \"renderTreeIcon\", \"renderTreeNode\", \"onExit\", \"onExited\", \"onClean\", \"onOpen\", \"onSearch\", \"onSelect\", \"onChange\", \"onEntered\", \"onClose\", \"onDragEnd\", \"onDragStart\", \"onDragEnter\", \"onDragLeave\", \"onDragOver\", \"onDrop\", \"onExpand\", \"renderExtraFooter\", \"renderMenu\", \"renderValue\"]);\n  var triggerRef = (0, _react.useRef)(null);\n  var targetRef = (0, _react.useRef)(null);\n  var listRef = (0, _react.useRef)(null);\n  var overlayRef = (0, _react.useRef)(null);\n  var searchInputRef = (0, _react.useRef)(null);\n  var treeViewRef = (0, _react.useRef)(null);\n\n  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),\n      rtl = _useCustom.rtl,\n      locale = _useCustom.locale;\n\n  var _useContext = (0, _react.useContext)(_TreeContext.default),\n      inline = _useContext.inline;\n\n  var _useControlled = (0, _utils.useControlled)(controlledValue, defaultValue),\n      value = _useControlled[0],\n      setValue = _useControlled[1],\n      isControlled = _useControlled[2];\n\n  var _useGetTreeNodeChildr = (0, _treeUtils.useGetTreeNodeChildren)(data, valueKey, childrenKey),\n      treeData = _useGetTreeNodeChildr.data,\n      setTreeData = _useGetTreeNodeChildr.setData,\n      loadingNodeValues = _useGetTreeNodeChildr.loadingNodeValues,\n      loadChildren = _useGetTreeNodeChildr.loadChildren;\n\n  var _useControlled2 = (0, _utils.useControlled)(controlledExpandItemValues, (0, _treeUtils.getDefaultExpandItemValues)(treeData, {\n    defaultExpandAll: defaultExpandAll,\n    valueKey: valueKey,\n    childrenKey: childrenKey,\n    defaultExpandItemValues: defaultExpandItemValues\n  })),\n      expandItemValues = _useControlled2[0],\n      setExpandItemValues = _useControlled2[1];\n\n  var _useState = (0, _react.useState)(false),\n      active = _useState[0],\n      setActive = _useState[1];\n\n  var _useState2 = (0, _react.useState)(null),\n      focusItemValue = _useState2[0],\n      setFocusItemValue = _useState2[1];\n\n  var _useFlattenTreeData = (0, _treeUtils.useFlattenTreeData)({\n    data: treeData,\n    labelKey: labelKey,\n    valueKey: valueKey,\n    childrenKey: childrenKey,\n    callback: function callback() {\n      // after flattenData, always trigger re-render\n      forceUpdate();\n    }\n  }),\n      flattenNodes = _useFlattenTreeData.flattenNodes,\n      forceUpdate = _useFlattenTreeData.forceUpdate,\n      formatVirtualizedTreeData = _useFlattenTreeData.formatVirtualizedTreeData;\n\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n      prefix = _useClassNames.prefix,\n      merge = _useClassNames.merge;\n\n  var _useClassNames2 = (0, _utils.useClassNames)('tree'),\n      treePrefix = _useClassNames2.prefix,\n      withTreeClassPrefix = _useClassNames2.withClassPrefix;\n\n  var _useTreeSearch = (0, _treeUtils.useTreeSearch)({\n    labelKey: labelKey,\n    childrenKey: childrenKey,\n    searchKeyword: searchKeyword,\n    data: treeData,\n    searchBy: searchBy,\n    callback: function callback(searchKeyword, _filterData, event) {\n      onSearch === null || onSearch === void 0 ? void 0 : onSearch(searchKeyword, event);\n    }\n  }),\n      filteredData = _useTreeSearch.filteredData,\n      searchKeywordState = _useTreeSearch.searchKeywordState,\n      setSearchKeyword = _useTreeSearch.setSearchKeyword,\n      handleSearch = _useTreeSearch.handleSearch,\n      setFilteredData = _useTreeSearch.setFilteredData;\n\n  var _useTreeDrag = (0, _treeUtils.useTreeDrag)(),\n      dragNodeKeys = _useTreeDrag.dragNodeKeys,\n      dragOverNodeKey = _useTreeDrag.dragOverNodeKey,\n      dragNode = _useTreeDrag.dragNode,\n      dropNodePosition = _useTreeDrag.dropNodePosition,\n      setDragNodeKeys = _useTreeDrag.setDragNodeKeys,\n      setDragOverNodeKey = _useTreeDrag.setDragOverNodeKey,\n      setDragNode = _useTreeDrag.setDragNode,\n      setDropNodePosition = _useTreeDrag.setDropNodePosition;\n\n  var _useTreeNodeRefs = (0, _treeUtils.useTreeNodeRefs)(),\n      treeNodesRefs = _useTreeNodeRefs.treeNodesRefs,\n      saveTreeNodeRef = _useTreeNodeRefs.saveTreeNodeRef;\n\n  var activeNode = (0, _treeUtils.getTreeActiveNode)(flattenNodes, value, valueKey);\n  var getFormattedNodes = (0, _react.useCallback)(function (render) {\n    if (virtualized) {\n      return formatVirtualizedTreeData(flattenNodes, filteredData, expandItemValues, {\n        searchKeyword: searchKeywordState\n      }).filter(function (n) {\n        return n.visible;\n      });\n    }\n\n    return filteredData.map(function (dataItem, index) {\n      return render === null || render === void 0 ? void 0 : render(dataItem, index, 1);\n    });\n  }, [searchKeywordState, expandItemValues, filteredData, flattenNodes, formatVirtualizedTreeData, virtualized]);\n  var focusActiveNode = (0, _react.useCallback)(function () {\n    (0, _treeUtils.focusToActiveTreeNode)({\n      list: listRef.current,\n      valueKey: valueKey,\n      selector: \".\" + treePrefix('node-active'),\n      activeNode: activeNode,\n      virtualized: virtualized,\n      container: treeViewRef.current,\n      formattedNodes: getFormattedNodes()\n    });\n  }, [treePrefix, activeNode, getFormattedNodes, valueKey, virtualized]);\n  (0, _react.useEffect)(function () {\n    setFilteredData(data, searchKeywordState);\n    setTreeData(data);\n  }, [data, searchKeywordState, setFilteredData, setTreeData]);\n  (0, _react.useEffect)(function () {\n    setFilteredData(treeData, searchKeywordState);\n  }, [treeData, searchKeywordState, setFilteredData]);\n  (0, _react.useEffect)(function () {\n    if (Array.isArray(controlledExpandItemValues)) {\n      setExpandItemValues(controlledExpandItemValues);\n    }\n  }, [controlledExpandItemValues, setExpandItemValues]);\n  (0, _react.useEffect)(function () {\n    setSearchKeyword(searchKeyword !== null && searchKeyword !== void 0 ? searchKeyword : '');\n  }, [searchKeyword, setSearchKeyword]);\n  var getDropData = (0, _react.useCallback)(function (nodeData) {\n    var options = {\n      valueKey: valueKey,\n      childrenKey: childrenKey\n    };\n    return {\n      /** draggingNode */\n      dragNode: dragNode,\n\n      /** dropNode */\n      dropNode: nodeData,\n\n      /** dragAndDrop Position type */\n      dropNodePosition: dropNodePosition,\n      createUpdateDataFunction: (0, _treeUtils.createUpdateTreeDataFunction)({\n        dragNode: dragNode,\n        dropNode: nodeData,\n        dropNodePosition: dropNodePosition\n      }, options)\n    };\n  }, [dragNode, valueKey, childrenKey, dropNodePosition]);\n\n  var getTreeNodeProps = function getTreeNodeProps(node, layer, index) {\n    var draggingNode = dragNode !== null && dragNode !== void 0 ? dragNode : {};\n    return {\n      as: Component,\n      rtl: rtl,\n      value: node[valueKey],\n      label: node[labelKey],\n      index: index,\n      layer: layer,\n      loading: loadingNodeValues.some(function (item) {\n        return (0, _utils.shallowEqual)(item, node[valueKey]);\n      }),\n      expand: node.expand,\n      active: (0, _utils.shallowEqual)(node[valueKey], value),\n      focus: (0, _utils.shallowEqual)(node[valueKey], focusItemValue),\n      visible: node.visible,\n      draggable: draggable,\n      dragging: (0, _utils.shallowEqual)(node[valueKey], draggingNode[valueKey]),\n      children: node[childrenKey],\n      nodeData: node,\n      disabled: disabledItemValues.some(function (disabledItem) {\n        return (0, _utils.shallowEqual)(disabledItem, node[valueKey]);\n      }),\n      dragOver: (0, _utils.shallowEqual)(node[valueKey], dragOverNodeKey) && dropNodePosition === _utils.TREE_NODE_DROP_POSITION.DRAG_OVER,\n      dragOverTop: (0, _utils.shallowEqual)(node[valueKey], dragOverNodeKey) && dropNodePosition === _utils.TREE_NODE_DROP_POSITION.DRAG_OVER_TOP,\n      dragOverBottom: (0, _utils.shallowEqual)(node[valueKey], dragOverNodeKey) && dropNodePosition === _utils.TREE_NODE_DROP_POSITION.DRAG_OVER_BOTTOM,\n      onSelect: handleSelect,\n      onDragStart: handleDragStart,\n      onDragEnter: handleDragEnter,\n      onDragOver: handleDragOver,\n      onDragLeave: handleDragLeave,\n      onDragEnd: handleDragEnd,\n      onDrop: handleDrop,\n      onExpand: handleExpand,\n      onRenderTreeNode: renderTreeNode,\n      onRenderTreeIcon: renderTreeIcon\n    };\n  };\n\n  var handleSelect = (0, _react.useCallback)(function (nodeData, event) {\n    var _targetRef$current, _triggerRef$current, _triggerRef$current$c;\n\n    if (!nodeData) {\n      return;\n    }\n\n    var nodeValue = nodeData[valueKey];\n\n    if (!isControlled) {\n      setValue(nodeValue);\n    }\n\n    setFocusItemValue(nodeData[valueKey]);\n    onChange === null || onChange === void 0 ? void 0 : onChange(nodeValue, event);\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(nodeData, nodeValue, event);\n    (_targetRef$current = targetRef.current) === null || _targetRef$current === void 0 ? void 0 : _targetRef$current.focus();\n    (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : (_triggerRef$current$c = _triggerRef$current.close) === null || _triggerRef$current$c === void 0 ? void 0 : _triggerRef$current$c.call(_triggerRef$current);\n  }, [valueKey, isControlled, onChange, onSelect, setValue]);\n  var handleExpand = (0, _react.useCallback)(function (node) {\n    var nextExpandItemValues = (0, _treeUtils.toggleExpand)({\n      node: node,\n      isExpand: !node.expand,\n      expandItemValues: expandItemValues,\n      valueKey: valueKey\n    });\n    setExpandItemValues(nextExpandItemValues);\n    onExpand === null || onExpand === void 0 ? void 0 : onExpand(nextExpandItemValues, node, (0, _Picker.createConcatChildrenFunction)(node, node[valueKey], {\n      valueKey: valueKey,\n      childrenKey: childrenKey\n    }));\n\n    if ((0, _isFunction2.default)(getChildren) && !node.expand && Array.isArray(node[childrenKey]) && node[childrenKey].length === 0) {\n      loadChildren(node, getChildren);\n    }\n  }, [valueKey, childrenKey, expandItemValues, getChildren, onExpand, setExpandItemValues, loadChildren]);\n  var handleDragStart = (0, _react.useCallback)(function (nodeData, event) {\n    if (draggable) {\n      setDragNodeKeys((0, _treeUtils.getDragNodeKeys)(nodeData, childrenKey, valueKey));\n      setDragNode(flattenNodes[nodeData.refKey]);\n      onDragStart === null || onDragStart === void 0 ? void 0 : onDragStart(nodeData, event);\n    }\n  }, [draggable, childrenKey, flattenNodes, onDragStart, setDragNodeKeys, setDragNode, valueKey]);\n  var handleDragEnter = (0, _react.useCallback)(function (nodeData, event) {\n    if (dragNodeKeys.some(function (d) {\n      return (0, _utils.shallowEqual)(d, nodeData[valueKey]);\n    })) {\n      return;\n    }\n\n    if (dragNode) {\n      setDragOverNodeKey(nodeData[valueKey]);\n      setDropNodePosition((0, _treeUtils.calDropNodePosition)(event, treeNodesRefs[nodeData.refKey]));\n    }\n\n    onDragEnter === null || onDragEnter === void 0 ? void 0 : onDragEnter(nodeData, event);\n  }, [dragNode, treeNodesRefs, dragNodeKeys, onDragEnter, setDragOverNodeKey, setDropNodePosition, valueKey]);\n  var handleDragOver = (0, _react.useCallback)(function (nodeData, event) {\n    if (dragNodeKeys.some(function (d) {\n      return (0, _utils.shallowEqual)(d, nodeData[valueKey]);\n    })) {\n      return;\n    }\n\n    if (dragNode && (0, _utils.shallowEqual)(nodeData[valueKey], dragOverNodeKey)) {\n      var lastDropNodePosition = (0, _treeUtils.calDropNodePosition)(event, treeNodesRefs[nodeData.refKey]);\n      if (lastDropNodePosition === dropNodePosition) return;\n      setDropNodePosition(lastDropNodePosition);\n    }\n\n    onDragOver === null || onDragOver === void 0 ? void 0 : onDragOver(nodeData, event);\n  }, [dragNode, dragNodeKeys, dragOverNodeKey, dropNodePosition, onDragOver, setDropNodePosition, treeNodesRefs, valueKey]);\n  var handleDragLeave = (0, _react.useCallback)(function (nodeData, event) {\n    onDragLeave === null || onDragLeave === void 0 ? void 0 : onDragLeave(nodeData, event);\n  }, [onDragLeave]);\n  var handleDragEnd = (0, _react.useCallback)(function (nodeData, event) {\n    setDragNode(null);\n    setDragNodeKeys([]);\n    setDragOverNodeKey(null);\n    onDragEnd === null || onDragEnd === void 0 ? void 0 : onDragEnd(nodeData, event);\n  }, [setDragNode, setDragNodeKeys, setDragOverNodeKey, onDragEnd]);\n  var handleDrop = (0, _react.useCallback)(function (nodeData, event) {\n    if (dragNodeKeys.some(function (d) {\n      return (0, _utils.shallowEqual)(d, nodeData[valueKey]);\n    })) {\n      console.error('Cannot drag a node to itself and its children');\n    } else {\n      var dropData = getDropData(nodeData);\n      onDrop === null || onDrop === void 0 ? void 0 : onDrop(dropData, event);\n    }\n\n    setDragNode(null);\n    setDragNodeKeys([]);\n    setDragOverNodeKey(null);\n  }, [dragNodeKeys, setDragNode, setDragOverNodeKey, setDragNodeKeys, onDrop, getDropData, valueKey]);\n  var handleOpen = (0, _react.useCallback)(function () {\n    var _triggerRef$current2, _triggerRef$current2$;\n\n    (_triggerRef$current2 = triggerRef.current) === null || _triggerRef$current2 === void 0 ? void 0 : (_triggerRef$current2$ = _triggerRef$current2.open) === null || _triggerRef$current2$ === void 0 ? void 0 : _triggerRef$current2$.call(_triggerRef$current2);\n    focusActiveNode();\n    onOpen === null || onOpen === void 0 ? void 0 : onOpen();\n    setActive(true);\n  }, [focusActiveNode, onOpen]);\n  var handleClose = (0, _react.useCallback)(function () {\n    var _triggerRef$current3, _triggerRef$current3$, _targetRef$current2;\n\n    (_triggerRef$current3 = triggerRef.current) === null || _triggerRef$current3 === void 0 ? void 0 : (_triggerRef$current3$ = _triggerRef$current3.close) === null || _triggerRef$current3$ === void 0 ? void 0 : _triggerRef$current3$.call(_triggerRef$current3);\n    setSearchKeyword('');\n    setActive(false);\n    setFocusItemValue(activeNode === null || activeNode === void 0 ? void 0 : activeNode[valueKey]);\n    /**\n     * when using keyboard toggle picker, should refocus on PickerToggle Component after close picker menu\n     */\n\n    (_targetRef$current2 = targetRef.current) === null || _targetRef$current2 === void 0 ? void 0 : _targetRef$current2.focus();\n  }, [activeNode, setSearchKeyword, valueKey]);\n  (0, _Picker.usePublicMethods)(ref, {\n    rootRef: inline ? treeViewRef : undefined,\n    triggerRef: triggerRef,\n    overlayRef: overlayRef,\n    targetRef: targetRef,\n    listRef: listRef,\n    inline: inline\n  });\n  var handleFocusItem = (0, _react.useCallback)(function (key) {\n    var focusableItems = (0, _treeUtils.getFocusableItems)(filteredData, {\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey,\n      childrenKey: childrenKey,\n      expandItemValues: expandItemValues\n    }, (0, _treeUtils.isSearching)(searchKeywordState));\n    var selector = \".\" + treePrefix('node-label');\n    var focusProps = {\n      focusItemValue: focusItemValue,\n      focusableItems: focusableItems,\n      treeNodesRefs: treeNodesRefs,\n      selector: selector,\n      valueKey: valueKey,\n      callback: function callback(nextFocusItemValue) {\n        setFocusItemValue(nextFocusItemValue);\n      }\n    };\n\n    if (key === _utils.KEY_VALUES.DOWN) {\n      (0, _treeUtils.focusNextItem)(focusProps);\n      return;\n    }\n\n    if (key === _utils.KEY_VALUES.UP) {\n      (0, _treeUtils.focusPreviousItem)(focusProps);\n    }\n  }, [searchKeywordState, expandItemValues, filteredData, focusItemValue, treeNodesRefs, treePrefix, valueKey, childrenKey, disabledItemValues]);\n  var handleLeftArrow = (0, _react.useCallback)(function () {\n    if ((0, _isNil2.default)(focusItemValue)) return;\n    var focusItem = (0, _treeUtils.getActiveItem)(focusItemValue, flattenNodes, valueKey);\n    (0, _treeUtils.leftArrowHandler)({\n      focusItem: focusItem,\n      expand: expandItemValues.includes(focusItem === null || focusItem === void 0 ? void 0 : focusItem[valueKey]),\n      onExpand: handleExpand,\n      childrenKey: childrenKey,\n      onFocusItem: function onFocusItem() {\n        var _focusItem$parent, _focusItem$parent2;\n\n        setFocusItemValue(focusItem === null || focusItem === void 0 ? void 0 : (_focusItem$parent = focusItem.parent) === null || _focusItem$parent === void 0 ? void 0 : _focusItem$parent[valueKey]);\n        (0, _treeUtils.focusTreeNode)(focusItem === null || focusItem === void 0 ? void 0 : (_focusItem$parent2 = focusItem.parent) === null || _focusItem$parent2 === void 0 ? void 0 : _focusItem$parent2.refKey, treeNodesRefs, \".\" + treePrefix('node-label'));\n      }\n    });\n  }, [expandItemValues, flattenNodes, focusItemValue, handleExpand, treeNodesRefs, treePrefix, valueKey, childrenKey]);\n  var handleRightArrow = (0, _react.useCallback)(function () {\n    if ((0, _isNil2.default)(focusItemValue)) return;\n    var focusItem = (0, _treeUtils.getActiveItem)(focusItemValue, flattenNodes, valueKey);\n    (0, _treeUtils.rightArrowHandler)({\n      focusItem: focusItem,\n      expand: expandItemValues.includes(focusItem === null || focusItem === void 0 ? void 0 : focusItem[valueKey]),\n      childrenKey: childrenKey,\n      onExpand: handleExpand,\n      onFocusItem: function onFocusItem() {\n        handleFocusItem(_utils.KEY_VALUES.DOWN);\n      }\n    });\n  }, [focusItemValue, flattenNodes, valueKey, expandItemValues, childrenKey, handleExpand, handleFocusItem]);\n  var selectActiveItem = (0, _react.useCallback)(function (event) {\n    if ((0, _isNil2.default)(focusItemValue)) return;\n    var activeItem = (0, _treeUtils.getActiveItem)(focusItemValue, flattenNodes, valueKey);\n    handleSelect(activeItem, event);\n  }, [flattenNodes, valueKey, focusItemValue, handleSelect]);\n  var handleClean = (0, _react.useCallback)(function (event) {\n    var nullValue = null;\n    var target = event.target; // exclude searchBar\n\n    if (target.matches('div[role=\"searchbox\"] > input')) {\n      return;\n    }\n\n    setValue(null);\n    onChange === null || onChange === void 0 ? void 0 : onChange(nullValue, event);\n  }, [onChange, setValue]);\n  var onPickerKeydown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !activeNode || !active,\n    triggerRef: triggerRef,\n    targetRef: targetRef,\n    overlayRef: overlayRef,\n    searchInputRef: searchInputRef,\n    active: active,\n    onExit: handleClean,\n    onClose: handleClose,\n    onMenuKeyDown: function onMenuKeyDown(event) {\n      (0, _Picker.onMenuKeyDown)(event, {\n        down: function down() {\n          return handleFocusItem(_utils.KEY_VALUES.DOWN);\n        },\n        up: function up() {\n          return handleFocusItem(_utils.KEY_VALUES.UP);\n        },\n        left: rtl ? handleRightArrow : handleLeftArrow,\n        right: rtl ? handleLeftArrow : handleRightArrow,\n        enter: selectActiveItem,\n        del: handleClean\n      });\n    }\n  }, rest));\n  var handleTreeKeyDown = (0, _react.useCallback)(function (event) {\n    if (!treeViewRef.current) {\n      return;\n    }\n\n    (0, _Picker.onMenuKeyDown)(event, {\n      down: function down() {\n        return handleFocusItem(_utils.KEY_VALUES.DOWN);\n      },\n      up: function up() {\n        return handleFocusItem(_utils.KEY_VALUES.UP);\n      },\n      left: rtl ? handleRightArrow : handleLeftArrow,\n      right: rtl ? handleLeftArrow : handleRightArrow,\n      enter: selectActiveItem\n    });\n  }, [handleFocusItem, handleLeftArrow, handleRightArrow, rtl, selectActiveItem]);\n\n  var renderNode = function renderNode(node, index, layer) {\n    if (!node.visible) {\n      return null;\n    }\n\n    var children = node[childrenKey];\n    var expand = (0, _treeUtils.getExpandWhenSearching)(searchKeywordState, expandItemValues.includes(node[valueKey]));\n    var visibleChildren = (0, _isUndefined2.default)(searchKeywordState) || searchKeywordState.length === 0 ? !!children : (0, _treeUtils.hasVisibleChildren)(node, childrenKey);\n    var nodeProps = (0, _extends2.default)({}, getTreeNodeProps((0, _extends2.default)({}, node, {\n      expand: expand\n    }), layer, index), {\n      hasChildren: visibleChildren\n    });\n\n    if (nodeProps.hasChildren) {\n      var _merge;\n\n      layer += 1;\n      var openClass = treePrefix('open');\n      var childrenClass = merge(treePrefix('node-children'), (_merge = {}, _merge[openClass] = expand && visibleChildren, _merge));\n      var nodes = children || [];\n      return /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: childrenClass,\n        key: node[valueKey],\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 710,\n          columnNumber: 9\n        }\n      }, /*#__PURE__*/_react.default.createElement(_TreeNode.default, (0, _extends2.default)({}, nodeProps, {\n        ref: function ref(_ref) {\n          return saveTreeNodeRef(_ref, node.refKey);\n        },\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 711,\n          columnNumber: 11\n        }\n      })), /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: treePrefix('children'),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 712,\n          columnNumber: 11\n        }\n      }, nodes.map(function (child, i) {\n        return renderNode(child, i, layer);\n      }), showIndentLine && /*#__PURE__*/_react.default.createElement(\"span\", {\n        className: treePrefix('indent-line'),\n        style: (0, _treeUtils.getTreeNodeIndent)(rtl, layer - 1, true),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 715,\n          columnNumber: 15\n        }\n      })));\n    }\n\n    return /*#__PURE__*/_react.default.createElement(_TreeNode.default, (0, _extends2.default)({\n      ref: function ref(_ref2) {\n        return saveTreeNodeRef(_ref2, node.refKey);\n      },\n      key: node[valueKey]\n    }, nodeProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 725,\n        columnNumber: 7\n      }\n    }));\n  };\n\n  var renderVirtualListNode = function renderVirtualListNode(nodes) {\n    return function (_ref3) {\n      var key = _ref3.key,\n          index = _ref3.index,\n          style = _ref3.style;\n      var node = nodes[index];\n      var layer = node.layer,\n          visible = node.visible;\n      var expand = (0, _treeUtils.getExpandWhenSearching)(searchKeywordState, expandItemValues.includes(node[valueKey]));\n\n      if (!node.visible) {\n        return null;\n      }\n\n      var nodeProps = (0, _extends2.default)({}, getTreeNodeProps((0, _extends2.default)({}, node, {\n        expand: expand\n      }), layer), {\n        style: style,\n        hasChildren: node.hasChildren\n      });\n      return visible && /*#__PURE__*/_react.default.createElement(_TreeNode.default, (0, _extends2.default)({\n        ref: function ref(_ref4) {\n          return saveTreeNodeRef(_ref4, node.refKey);\n        },\n        key: key\n      }, nodeProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 755,\n          columnNumber: 11\n        }\n      }));\n    };\n  };\n\n  var renderTree = function renderTree() {\n    var _withTreeClassPrefix;\n\n    var classes = withTreeClassPrefix((_withTreeClassPrefix = {}, _withTreeClassPrefix[className !== null && className !== void 0 ? className : ''] = inline, _withTreeClassPrefix.virtualized = virtualized, _withTreeClassPrefix));\n    var formattedNodes = getFormattedNodes(renderNode);\n    var styles = inline ? (0, _extends2.default)({\n      height: height\n    }, style) : {};\n    return /*#__PURE__*/_react.default.createElement(\"div\", {\n      role: \"tree\",\n      id: id ? id + \"-listbox\" : undefined,\n      ref: treeViewRef,\n      className: classes,\n      style: styles,\n      onKeyDown: inline ? handleTreeKeyDown : undefined,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 769,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: treePrefix('nodes'),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 777,\n        columnNumber: 9\n      }\n    }, virtualized ? /*#__PURE__*/_react.default.createElement(_VirtualizedList.AutoSizer, {\n      defaultHeight: inline ? height : maxTreeHeight,\n      style: {\n        width: 'auto',\n        height: 'auto'\n      },\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 779,\n        columnNumber: 13\n      }\n    }, function (_ref5) {\n      var height = _ref5.height,\n          width = _ref5.width;\n      return /*#__PURE__*/_react.default.createElement(_VirtualizedList.List, (0, _extends2.default)({\n        ref: listRef,\n        width: width,\n        height: height,\n        rowHeight: 36,\n        rowCount: formattedNodes.length,\n        rowRenderer: renderVirtualListNode(formattedNodes),\n        scrollToAlignment: \"center\"\n      }, listProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 784,\n          columnNumber: 17\n        }\n      }));\n    }) : formattedNodes));\n  };\n\n  var renderDropdownMenu = function renderDropdownMenu(positionProps, speakerRef) {\n    var left = positionProps.left,\n        top = positionProps.top,\n        className = positionProps.className;\n    var classes = merge(className, menuClassName, prefix('tree-menu'));\n    var mergedMenuStyle = (0, _extends2.default)({}, menuStyle, {\n      left: left,\n      top: top\n    });\n    var styles = virtualized ? (0, _extends2.default)({\n      height: height\n    }, mergedMenuStyle) : (0, _extends2.default)({}, mergedMenuStyle);\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerOverlay, {\n      autoWidth: menuAutoWidth,\n      className: classes,\n      style: styles,\n      ref: (0, _utils.mergeRefs)(overlayRef, speakerRef),\n      onKeyDown: onPickerKeydown,\n      target: triggerRef,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 811,\n        columnNumber: 7\n      }\n    }, searchable ? /*#__PURE__*/_react.default.createElement(_Picker.SearchBar, {\n      placeholder: locale.searchPlaceholder,\n      onChange: handleSearch,\n      value: searchKeywordState,\n      inputRef: searchInputRef,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 820,\n        columnNumber: 11\n      }\n    }) : null, renderMenu ? renderMenu(renderTree()) : renderTree(), renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  /**\n   * 1.Have a value and the value is valid.\n   * 2.Regardless of whether the value is valid, as long as renderValue is set, it is judged to have a value.\n   */\n\n\n  var hasValidValue = !(0, _isNil2.default)(activeNode) || !(0, _isNil2.default)(value) && (0, _isFunction2.default)(renderValue);\n  var selectedElement = placeholder;\n\n  if (hasValidValue) {\n    var node = activeNode !== null && activeNode !== void 0 ? activeNode : {};\n    selectedElement = node[labelKey];\n\n    if ((0, _isFunction2.default)(renderValue)) {\n      selectedElement = renderValue(value, node, selectedElement);\n\n      if ((0, _isNil2.default)(selectedElement)) {\n        hasValidValue = false;\n      }\n    }\n  }\n\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n    classPrefix: classPrefix,\n    appearance: appearance,\n    hasValue: hasValidValue,\n    name: 'tree',\n    cleanable: cleanable\n  })),\n      classes = _usePickerClassName[0],\n      usedClassNamePropKeys = _usePickerClassName[1];\n\n  if (inline) {\n    return renderTree();\n  }\n\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    pickerProps: (0, _pick2.default)(props, _Picker.pickTriggerPropKeys),\n    ref: triggerRef,\n    placement: placement,\n    onEnter: handleOpen,\n    onEntered: onEntered,\n    onExit: (0, _utils.createChainedFunction)(onClose, onExit),\n    onExited: (0, _utils.createChainedFunction)(handleClose, onExited),\n    speaker: renderDropdownMenu,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 865,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 875,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit2.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys, ['cascade'])), {\n    id: id,\n    ref: targetRef,\n    appearance: appearance,\n    onKeyDown: onPickerKeydown,\n    onClean: (0, _utils.createChainedFunction)(handleClean, onClean),\n    cleanable: cleanable && !disabled,\n    as: toggleAs,\n    disabled: disabled,\n    hasValue: hasValidValue,\n    active: active,\n    placement: placement,\n    inputValue: value,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 876,\n      columnNumber: 9\n    }\n  }), selectedElement || locale.placeholder)));\n});\n\nTreePicker.displayName = 'TreePicker';\nTreePicker.propTypes = (0, _extends2.default)({}, _Picker.listPickerPropTypes, {\n  locale: _propTypes.default.any,\n  appearance: _propTypes.default.oneOf(['default', 'subtle']),\n  height: _propTypes.default.number,\n  draggable: _propTypes.default.bool,\n  virtualized: _propTypes.default.bool,\n  searchable: _propTypes.default.bool,\n  menuAutoWidth: _propTypes.default.bool,\n  searchKeyword: _propTypes.default.string,\n  defaultExpandAll: _propTypes.default.bool,\n  expandItemValues: _propTypes.default.array,\n  defaultExpandItemValues: _propTypes.default.array,\n  onSearch: _propTypes.default.func,\n  onExpand: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  renderMenu: _propTypes.default.func,\n  renderTreeNode: _propTypes.default.func,\n  renderTreeIcon: _propTypes.default.func,\n  renderExtraFooter: _propTypes.default.func,\n  renderDragNode: _propTypes.default.func,\n  searchBy: _propTypes.default.func\n});\nvar _default = TreePicker;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/TreePicker/TreePicker.tsx?");
 
 /***/ }),
 
@@ -4740,7 +4784,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.CustomProvider = exports.Affix = exports.DOMHelper = exports.Animation = exports.Schema = exports.Footer = exports.Sidebar = exports.Header = exports.Content = exports.Container = exports.FlexboxGrid = exports.Col = exports.Row = exports.Grid = exports.Carousel = exports.Calendar = exports.List = exports.TagGroup = exports.Tag = exports.Timeline = exports.Progress = exports.Table = exports.PanelGroup = exports.Panel = exports.CheckTree = exports.Tree = exports.Rate = exports.RangeSlider = exports.Slider = exports.Uploader = exports.AutoComplete = exports.DateRangePicker = exports.DatePicker = exports.MultiCascader = exports.Cascader = exports.CheckTreePicker = exports.TreePicker = exports.TagInput = exports.TagPicker = exports.InputPicker = exports.CheckPicker = exports.SelectPicker = exports.RadioGroup = exports.Radio = exports.CheckboxGroup = exports.Checkbox = exports.InputGroup = exports.InputNumber = exports.MaskedInput = exports.Input = exports.Form = exports.Toggle = exports.Steps = exports.Pagination = exports.Breadcrumb = exports.Sidenav = exports.Navbar = exports.Nav = exports.Dropdown = exports.toaster = exports.AvatarGroup = exports.Avatar = exports.Badge = exports.Placeholder = exports.Divider = exports.SafeAnchor = exports.Loader = exports.Drawer = exports.Message = exports.Notification = exports.Modal = exports.Popover = exports.Tooltip = exports.Whisper = exports.ButtonGroup = exports.ButtonToolbar = exports.IconButton = exports.Button = void 0;\n\nvar _Button = _interopRequireDefault(__webpack_require__(/*! ./Button */ \"./src/Button/index.tsx\"));\n\nexports.Button = _Button.default;\n\nvar _IconButton = _interopRequireDefault(__webpack_require__(/*! ./IconButton */ \"./src/IconButton/index.tsx\"));\n\nexports.IconButton = _IconButton.default;\n\nvar _ButtonToolbar = _interopRequireDefault(__webpack_require__(/*! ./ButtonToolbar */ \"./src/ButtonToolbar/index.tsx\"));\n\nexports.ButtonToolbar = _ButtonToolbar.default;\n\nvar _ButtonGroup = _interopRequireDefault(__webpack_require__(/*! ./ButtonGroup */ \"./src/ButtonGroup/index.tsx\"));\n\nexports.ButtonGroup = _ButtonGroup.default;\n\nvar _Whisper = _interopRequireDefault(__webpack_require__(/*! ./Whisper */ \"./src/Whisper/index.tsx\"));\n\nexports.Whisper = _Whisper.default;\n\nvar _Tooltip = _interopRequireDefault(__webpack_require__(/*! ./Tooltip */ \"./src/Tooltip/index.tsx\"));\n\nexports.Tooltip = _Tooltip.default;\n\nvar _Popover = _interopRequireDefault(__webpack_require__(/*! ./Popover */ \"./src/Popover/index.tsx\"));\n\nexports.Popover = _Popover.default;\n\nvar _Modal = _interopRequireDefault(__webpack_require__(/*! ./Modal */ \"./src/Modal/index.tsx\"));\n\nexports.Modal = _Modal.default;\n\nvar _Notification = _interopRequireDefault(__webpack_require__(/*! ./Notification */ \"./src/Notification/index.tsx\"));\n\nexports.Notification = _Notification.default;\n\nvar _Message = _interopRequireDefault(__webpack_require__(/*! ./Message */ \"./src/Message/index.tsx\"));\n\nexports.Message = _Message.default;\n\nvar _Drawer = _interopRequireDefault(__webpack_require__(/*! ./Drawer */ \"./src/Drawer/index.tsx\"));\n\nexports.Drawer = _Drawer.default;\n\nvar _Loader = _interopRequireDefault(__webpack_require__(/*! ./Loader */ \"./src/Loader/index.tsx\"));\n\nexports.Loader = _Loader.default;\n\nvar _SafeAnchor = _interopRequireDefault(__webpack_require__(/*! ./SafeAnchor */ \"./src/SafeAnchor/index.tsx\"));\n\nexports.SafeAnchor = _SafeAnchor.default;\n\nvar _Divider = _interopRequireDefault(__webpack_require__(/*! ./Divider */ \"./src/Divider/index.tsx\"));\n\nexports.Divider = _Divider.default;\n\nvar _Placeholder = _interopRequireDefault(__webpack_require__(/*! ./Placeholder */ \"./src/Placeholder/index.tsx\"));\n\nexports.Placeholder = _Placeholder.default;\n\nvar _Badge = _interopRequireDefault(__webpack_require__(/*! ./Badge */ \"./src/Badge/index.tsx\"));\n\nexports.Badge = _Badge.default;\n\nvar _Avatar = _interopRequireDefault(__webpack_require__(/*! ./Avatar */ \"./src/Avatar/index.tsx\"));\n\nexports.Avatar = _Avatar.default;\n\nvar _AvatarGroup = _interopRequireDefault(__webpack_require__(/*! ./AvatarGroup */ \"./src/AvatarGroup/index.tsx\"));\n\nexports.AvatarGroup = _AvatarGroup.default;\n\nvar _toaster = _interopRequireDefault(__webpack_require__(/*! ./toaster */ \"./src/toaster/index.tsx\"));\n\nexports.toaster = _toaster.default;\n\nvar _Dropdown = _interopRequireDefault(__webpack_require__(/*! ./Dropdown */ \"./src/Dropdown/index.tsx\"));\n\nexports.Dropdown = _Dropdown.default;\n\nvar _Nav = _interopRequireDefault(__webpack_require__(/*! ./Nav */ \"./src/Nav/index.tsx\"));\n\nexports.Nav = _Nav.default;\n\nvar _Navbar = _interopRequireDefault(__webpack_require__(/*! ./Navbar */ \"./src/Navbar/index.tsx\"));\n\nexports.Navbar = _Navbar.default;\n\nvar _Sidenav = _interopRequireDefault(__webpack_require__(/*! ./Sidenav */ \"./src/Sidenav/index.tsx\"));\n\nexports.Sidenav = _Sidenav.default;\n\nvar _Breadcrumb = _interopRequireDefault(__webpack_require__(/*! ./Breadcrumb */ \"./src/Breadcrumb/index.tsx\"));\n\nexports.Breadcrumb = _Breadcrumb.default;\n\nvar _Pagination = _interopRequireDefault(__webpack_require__(/*! ./Pagination */ \"./src/Pagination/index.tsx\"));\n\nexports.Pagination = _Pagination.default;\n\nvar _Steps = _interopRequireDefault(__webpack_require__(/*! ./Steps */ \"./src/Steps/index.tsx\"));\n\nexports.Steps = _Steps.default;\n\nvar _Toggle = _interopRequireDefault(__webpack_require__(/*! ./Toggle */ \"./src/Toggle/index.tsx\"));\n\nexports.Toggle = _Toggle.default;\n\nvar _Form = _interopRequireDefault(__webpack_require__(/*! ./Form */ \"./src/Form/index.tsx\"));\n\nexports.Form = _Form.default;\n\nvar _Input = _interopRequireDefault(__webpack_require__(/*! ./Input */ \"./src/Input/index.tsx\"));\n\nexports.Input = _Input.default;\n\nvar _MaskedInput = _interopRequireDefault(__webpack_require__(/*! ./MaskedInput */ \"./src/MaskedInput/index.tsx\"));\n\nexports.MaskedInput = _MaskedInput.default;\n\nvar _InputNumber = _interopRequireDefault(__webpack_require__(/*! ./InputNumber */ \"./src/InputNumber/index.tsx\"));\n\nexports.InputNumber = _InputNumber.default;\n\nvar _InputGroup = _interopRequireDefault(__webpack_require__(/*! ./InputGroup */ \"./src/InputGroup/index.tsx\"));\n\nexports.InputGroup = _InputGroup.default;\n\nvar _Checkbox = _interopRequireDefault(__webpack_require__(/*! ./Checkbox */ \"./src/Checkbox/index.tsx\"));\n\nexports.Checkbox = _Checkbox.default;\n\nvar _CheckboxGroup = _interopRequireDefault(__webpack_require__(/*! ./CheckboxGroup */ \"./src/CheckboxGroup/index.tsx\"));\n\nexports.CheckboxGroup = _CheckboxGroup.default;\n\nvar _Radio = _interopRequireDefault(__webpack_require__(/*! ./Radio */ \"./src/Radio/index.tsx\"));\n\nexports.Radio = _Radio.default;\n\nvar _RadioGroup = _interopRequireDefault(__webpack_require__(/*! ./RadioGroup */ \"./src/RadioGroup/index.tsx\"));\n\nexports.RadioGroup = _RadioGroup.default;\n\nvar _SelectPicker = _interopRequireDefault(__webpack_require__(/*! ./SelectPicker */ \"./src/SelectPicker/index.tsx\"));\n\nexports.SelectPicker = _SelectPicker.default;\n\nvar _CheckPicker = _interopRequireDefault(__webpack_require__(/*! ./CheckPicker */ \"./src/CheckPicker/index.tsx\"));\n\nexports.CheckPicker = _CheckPicker.default;\n\nvar _InputPicker = _interopRequireDefault(__webpack_require__(/*! ./InputPicker */ \"./src/InputPicker/index.tsx\"));\n\nexports.InputPicker = _InputPicker.default;\n\nvar _TagPicker = _interopRequireDefault(__webpack_require__(/*! ./TagPicker */ \"./src/TagPicker/index.tsx\"));\n\nexports.TagPicker = _TagPicker.default;\n\nvar _TagInput = _interopRequireDefault(__webpack_require__(/*! ./TagInput */ \"./src/TagInput/index.tsx\"));\n\nexports.TagInput = _TagInput.default;\n\nvar _TreePicker = _interopRequireDefault(__webpack_require__(/*! ./TreePicker */ \"./src/TreePicker/index.tsx\"));\n\nexports.TreePicker = _TreePicker.default;\n\nvar _CheckTreePicker = _interopRequireDefault(__webpack_require__(/*! ./CheckTreePicker */ \"./src/CheckTreePicker/index.tsx\"));\n\nexports.CheckTreePicker = _CheckTreePicker.default;\n\nvar _Cascader = _interopRequireDefault(__webpack_require__(/*! ./Cascader */ \"./src/Cascader/index.tsx\"));\n\nexports.Cascader = _Cascader.default;\n\nvar _MultiCascader = _interopRequireDefault(__webpack_require__(/*! ./MultiCascader */ \"./src/MultiCascader/index.tsx\"));\n\nexports.MultiCascader = _MultiCascader.default;\n\nvar _DatePicker = _interopRequireDefault(__webpack_require__(/*! ./DatePicker */ \"./src/DatePicker/index.tsx\"));\n\nexports.DatePicker = _DatePicker.default;\n\nvar _DateRangePicker = _interopRequireDefault(__webpack_require__(/*! ./DateRangePicker */ \"./src/DateRangePicker/index.tsx\"));\n\nexports.DateRangePicker = _DateRangePicker.default;\n\nvar _AutoComplete = _interopRequireDefault(__webpack_require__(/*! ./AutoComplete */ \"./src/AutoComplete/index.tsx\"));\n\nexports.AutoComplete = _AutoComplete.default;\n\nvar _Uploader = _interopRequireDefault(__webpack_require__(/*! ./Uploader */ \"./src/Uploader/index.tsx\"));\n\nexports.Uploader = _Uploader.default;\n\nvar _Slider = _interopRequireDefault(__webpack_require__(/*! ./Slider */ \"./src/Slider/index.tsx\"));\n\nexports.Slider = _Slider.default;\n\nvar _RangeSlider = _interopRequireDefault(__webpack_require__(/*! ./RangeSlider */ \"./src/RangeSlider/index.tsx\"));\n\nexports.RangeSlider = _RangeSlider.default;\n\nvar _Rate = _interopRequireDefault(__webpack_require__(/*! ./Rate */ \"./src/Rate/index.tsx\"));\n\nexports.Rate = _Rate.default;\n\nvar _Tree = _interopRequireDefault(__webpack_require__(/*! ./Tree */ \"./src/Tree/index.tsx\"));\n\nexports.Tree = _Tree.default;\n\nvar _CheckTree = _interopRequireDefault(__webpack_require__(/*! ./CheckTree */ \"./src/CheckTree/index.tsx\"));\n\nexports.CheckTree = _CheckTree.default;\n\nvar _Panel = _interopRequireDefault(__webpack_require__(/*! ./Panel */ \"./src/Panel/index.tsx\"));\n\nexports.Panel = _Panel.default;\n\nvar _PanelGroup = _interopRequireDefault(__webpack_require__(/*! ./PanelGroup */ \"./src/PanelGroup/index.tsx\"));\n\nexports.PanelGroup = _PanelGroup.default;\n\nvar _Table = _interopRequireDefault(__webpack_require__(/*! ./Table */ \"./src/Table/index.tsx\"));\n\nexports.Table = _Table.default;\n\nvar _Progress = _interopRequireDefault(__webpack_require__(/*! ./Progress */ \"./src/Progress/index.tsx\"));\n\nexports.Progress = _Progress.default;\n\nvar _Timeline = _interopRequireDefault(__webpack_require__(/*! ./Timeline */ \"./src/Timeline/index.tsx\"));\n\nexports.Timeline = _Timeline.default;\n\nvar _Tag = _interopRequireDefault(__webpack_require__(/*! ./Tag */ \"./src/Tag/index.tsx\"));\n\nexports.Tag = _Tag.default;\n\nvar _TagGroup = _interopRequireDefault(__webpack_require__(/*! ./TagGroup */ \"./src/TagGroup/index.tsx\"));\n\nexports.TagGroup = _TagGroup.default;\n\nvar _List = _interopRequireDefault(__webpack_require__(/*! ./List */ \"./src/List/index.tsx\"));\n\nexports.List = _List.default;\n\nvar _Calendar = _interopRequireDefault(__webpack_require__(/*! ./Calendar */ \"./src/Calendar/index.tsx\"));\n\nexports.Calendar = _Calendar.default;\n\nvar _Carousel = _interopRequireDefault(__webpack_require__(/*! ./Carousel */ \"./src/Carousel/index.tsx\"));\n\nexports.Carousel = _Carousel.default;\n\nvar _Grid = _interopRequireDefault(__webpack_require__(/*! ./Grid */ \"./src/Grid/index.tsx\"));\n\nexports.Grid = _Grid.default;\n\nvar _Row = _interopRequireDefault(__webpack_require__(/*! ./Row */ \"./src/Row/index.tsx\"));\n\nexports.Row = _Row.default;\n\nvar _Col = _interopRequireDefault(__webpack_require__(/*! ./Col */ \"./src/Col/index.tsx\"));\n\nexports.Col = _Col.default;\n\nvar _FlexboxGrid = _interopRequireDefault(__webpack_require__(/*! ./FlexboxGrid */ \"./src/FlexboxGrid/index.tsx\"));\n\nexports.FlexboxGrid = _FlexboxGrid.default;\n\nvar _Container = _interopRequireDefault(__webpack_require__(/*! ./Container */ \"./src/Container/index.tsx\"));\n\nexports.Container = _Container.default;\n\nvar _Content = _interopRequireDefault(__webpack_require__(/*! ./Content */ \"./src/Content/index.tsx\"));\n\nexports.Content = _Content.default;\n\nvar _Header = _interopRequireDefault(__webpack_require__(/*! ./Header */ \"./src/Header/index.tsx\"));\n\nexports.Header = _Header.default;\n\nvar _Sidebar = _interopRequireDefault(__webpack_require__(/*! ./Sidebar */ \"./src/Sidebar/index.tsx\"));\n\nexports.Sidebar = _Sidebar.default;\n\nvar _Footer = _interopRequireDefault(__webpack_require__(/*! ./Footer */ \"./src/Footer/index.tsx\"));\n\nexports.Footer = _Footer.default;\n\nvar _Schema = _interopRequireDefault(__webpack_require__(/*! ./Schema */ \"./src/Schema/index.ts\"));\n\nexports.Schema = _Schema.default;\n\nvar _Animation = _interopRequireDefault(__webpack_require__(/*! ./Animation */ \"./src/Animation/index.tsx\"));\n\nexports.Animation = _Animation.default;\n\nvar _DOMHelper = _interopRequireDefault(__webpack_require__(/*! ./DOMHelper */ \"./src/DOMHelper/index.ts\"));\n\nexports.DOMHelper = _DOMHelper.default;\n\nvar _Affix = _interopRequireDefault(__webpack_require__(/*! ./Affix */ \"./src/Affix/index.tsx\"));\n\nexports.Affix = _Affix.default;\n\nvar _CustomProvider = _interopRequireDefault(__webpack_require__(/*! ./CustomProvider */ \"./src/CustomProvider/index.tsx\"));\n\nexports.CustomProvider = _CustomProvider.default;\n\n//# sourceURL=webpack://rsuite/./src/index.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nexports.__esModule = true;\nexports.CustomProvider = exports.Affix = exports.DOMHelper = exports.Animation = exports.Schema = exports.Stack = exports.Divider = exports.Footer = exports.Sidebar = exports.Header = exports.Content = exports.Container = exports.FlexboxGrid = exports.Col = exports.Row = exports.Grid = exports.Carousel = exports.Calendar = exports.List = exports.TagGroup = exports.Tag = exports.Timeline = exports.Progress = exports.Table = exports.PanelGroup = exports.Panel = exports.CheckTree = exports.Tree = exports.Rate = exports.RangeSlider = exports.Slider = exports.Uploader = exports.AutoComplete = exports.DateRangePicker = exports.DatePicker = exports.MultiCascader = exports.Cascader = exports.CheckTreePicker = exports.TreePicker = exports.TagInput = exports.TagPicker = exports.InputPicker = exports.CheckPicker = exports.SelectPicker = exports.RadioGroup = exports.Radio = exports.CheckboxGroup = exports.Checkbox = exports.InputGroup = exports.InputNumber = exports.MaskedInput = exports.Input = exports.Form = exports.Toggle = exports.Steps = exports.Pagination = exports.Breadcrumb = exports.Sidenav = exports.Navbar = exports.Nav = exports.Dropdown = exports.toaster = exports.AvatarGroup = exports.Avatar = exports.Badge = exports.Placeholder = exports.SafeAnchor = exports.Loader = exports.Drawer = exports.Message = exports.Notification = exports.Modal = exports.Popover = exports.Tooltip = exports.Whisper = exports.ButtonGroup = exports.ButtonToolbar = exports.IconButton = exports.Button = void 0;\n\nvar _Button = _interopRequireDefault(__webpack_require__(/*! ./Button */ \"./src/Button/index.tsx\"));\n\nexports.Button = _Button.default;\n\nvar _IconButton = _interopRequireDefault(__webpack_require__(/*! ./IconButton */ \"./src/IconButton/index.tsx\"));\n\nexports.IconButton = _IconButton.default;\n\nvar _ButtonToolbar = _interopRequireDefault(__webpack_require__(/*! ./ButtonToolbar */ \"./src/ButtonToolbar/index.tsx\"));\n\nexports.ButtonToolbar = _ButtonToolbar.default;\n\nvar _ButtonGroup = _interopRequireDefault(__webpack_require__(/*! ./ButtonGroup */ \"./src/ButtonGroup/index.tsx\"));\n\nexports.ButtonGroup = _ButtonGroup.default;\n\nvar _Whisper = _interopRequireDefault(__webpack_require__(/*! ./Whisper */ \"./src/Whisper/index.tsx\"));\n\nexports.Whisper = _Whisper.default;\n\nvar _Tooltip = _interopRequireDefault(__webpack_require__(/*! ./Tooltip */ \"./src/Tooltip/index.tsx\"));\n\nexports.Tooltip = _Tooltip.default;\n\nvar _Popover = _interopRequireDefault(__webpack_require__(/*! ./Popover */ \"./src/Popover/index.tsx\"));\n\nexports.Popover = _Popover.default;\n\nvar _Modal = _interopRequireDefault(__webpack_require__(/*! ./Modal */ \"./src/Modal/index.tsx\"));\n\nexports.Modal = _Modal.default;\n\nvar _Notification = _interopRequireDefault(__webpack_require__(/*! ./Notification */ \"./src/Notification/index.tsx\"));\n\nexports.Notification = _Notification.default;\n\nvar _Message = _interopRequireDefault(__webpack_require__(/*! ./Message */ \"./src/Message/index.tsx\"));\n\nexports.Message = _Message.default;\n\nvar _Drawer = _interopRequireDefault(__webpack_require__(/*! ./Drawer */ \"./src/Drawer/index.tsx\"));\n\nexports.Drawer = _Drawer.default;\n\nvar _Loader = _interopRequireDefault(__webpack_require__(/*! ./Loader */ \"./src/Loader/index.tsx\"));\n\nexports.Loader = _Loader.default;\n\nvar _SafeAnchor = _interopRequireDefault(__webpack_require__(/*! ./SafeAnchor */ \"./src/SafeAnchor/index.tsx\"));\n\nexports.SafeAnchor = _SafeAnchor.default;\n\nvar _Placeholder = _interopRequireDefault(__webpack_require__(/*! ./Placeholder */ \"./src/Placeholder/index.tsx\"));\n\nexports.Placeholder = _Placeholder.default;\n\nvar _Badge = _interopRequireDefault(__webpack_require__(/*! ./Badge */ \"./src/Badge/index.tsx\"));\n\nexports.Badge = _Badge.default;\n\nvar _Avatar = _interopRequireDefault(__webpack_require__(/*! ./Avatar */ \"./src/Avatar/index.tsx\"));\n\nexports.Avatar = _Avatar.default;\n\nvar _AvatarGroup = _interopRequireDefault(__webpack_require__(/*! ./AvatarGroup */ \"./src/AvatarGroup/index.tsx\"));\n\nexports.AvatarGroup = _AvatarGroup.default;\n\nvar _toaster = _interopRequireDefault(__webpack_require__(/*! ./toaster */ \"./src/toaster/index.tsx\"));\n\nexports.toaster = _toaster.default;\n\nvar _Dropdown = _interopRequireDefault(__webpack_require__(/*! ./Dropdown */ \"./src/Dropdown/index.tsx\"));\n\nexports.Dropdown = _Dropdown.default;\n\nvar _Nav = _interopRequireDefault(__webpack_require__(/*! ./Nav */ \"./src/Nav/index.tsx\"));\n\nexports.Nav = _Nav.default;\n\nvar _Navbar = _interopRequireDefault(__webpack_require__(/*! ./Navbar */ \"./src/Navbar/index.tsx\"));\n\nexports.Navbar = _Navbar.default;\n\nvar _Sidenav = _interopRequireDefault(__webpack_require__(/*! ./Sidenav */ \"./src/Sidenav/index.tsx\"));\n\nexports.Sidenav = _Sidenav.default;\n\nvar _Breadcrumb = _interopRequireDefault(__webpack_require__(/*! ./Breadcrumb */ \"./src/Breadcrumb/index.tsx\"));\n\nexports.Breadcrumb = _Breadcrumb.default;\n\nvar _Pagination = _interopRequireDefault(__webpack_require__(/*! ./Pagination */ \"./src/Pagination/index.tsx\"));\n\nexports.Pagination = _Pagination.default;\n\nvar _Steps = _interopRequireDefault(__webpack_require__(/*! ./Steps */ \"./src/Steps/index.tsx\"));\n\nexports.Steps = _Steps.default;\n\nvar _Toggle = _interopRequireDefault(__webpack_require__(/*! ./Toggle */ \"./src/Toggle/index.tsx\"));\n\nexports.Toggle = _Toggle.default;\n\nvar _Form = _interopRequireDefault(__webpack_require__(/*! ./Form */ \"./src/Form/index.tsx\"));\n\nexports.Form = _Form.default;\n\nvar _Input = _interopRequireDefault(__webpack_require__(/*! ./Input */ \"./src/Input/index.tsx\"));\n\nexports.Input = _Input.default;\n\nvar _MaskedInput = _interopRequireDefault(__webpack_require__(/*! ./MaskedInput */ \"./src/MaskedInput/index.tsx\"));\n\nexports.MaskedInput = _MaskedInput.default;\n\nvar _InputNumber = _interopRequireDefault(__webpack_require__(/*! ./InputNumber */ \"./src/InputNumber/index.tsx\"));\n\nexports.InputNumber = _InputNumber.default;\n\nvar _InputGroup = _interopRequireDefault(__webpack_require__(/*! ./InputGroup */ \"./src/InputGroup/index.tsx\"));\n\nexports.InputGroup = _InputGroup.default;\n\nvar _Checkbox = _interopRequireDefault(__webpack_require__(/*! ./Checkbox */ \"./src/Checkbox/index.tsx\"));\n\nexports.Checkbox = _Checkbox.default;\n\nvar _CheckboxGroup = _interopRequireDefault(__webpack_require__(/*! ./CheckboxGroup */ \"./src/CheckboxGroup/index.tsx\"));\n\nexports.CheckboxGroup = _CheckboxGroup.default;\n\nvar _Radio = _interopRequireDefault(__webpack_require__(/*! ./Radio */ \"./src/Radio/index.tsx\"));\n\nexports.Radio = _Radio.default;\n\nvar _RadioGroup = _interopRequireDefault(__webpack_require__(/*! ./RadioGroup */ \"./src/RadioGroup/index.tsx\"));\n\nexports.RadioGroup = _RadioGroup.default;\n\nvar _SelectPicker = _interopRequireDefault(__webpack_require__(/*! ./SelectPicker */ \"./src/SelectPicker/index.tsx\"));\n\nexports.SelectPicker = _SelectPicker.default;\n\nvar _CheckPicker = _interopRequireDefault(__webpack_require__(/*! ./CheckPicker */ \"./src/CheckPicker/index.tsx\"));\n\nexports.CheckPicker = _CheckPicker.default;\n\nvar _InputPicker = _interopRequireDefault(__webpack_require__(/*! ./InputPicker */ \"./src/InputPicker/index.tsx\"));\n\nexports.InputPicker = _InputPicker.default;\n\nvar _TagPicker = _interopRequireDefault(__webpack_require__(/*! ./TagPicker */ \"./src/TagPicker/index.tsx\"));\n\nexports.TagPicker = _TagPicker.default;\n\nvar _TagInput = _interopRequireDefault(__webpack_require__(/*! ./TagInput */ \"./src/TagInput/index.tsx\"));\n\nexports.TagInput = _TagInput.default;\n\nvar _TreePicker = _interopRequireDefault(__webpack_require__(/*! ./TreePicker */ \"./src/TreePicker/index.tsx\"));\n\nexports.TreePicker = _TreePicker.default;\n\nvar _CheckTreePicker = _interopRequireDefault(__webpack_require__(/*! ./CheckTreePicker */ \"./src/CheckTreePicker/index.tsx\"));\n\nexports.CheckTreePicker = _CheckTreePicker.default;\n\nvar _Cascader = _interopRequireDefault(__webpack_require__(/*! ./Cascader */ \"./src/Cascader/index.tsx\"));\n\nexports.Cascader = _Cascader.default;\n\nvar _MultiCascader = _interopRequireDefault(__webpack_require__(/*! ./MultiCascader */ \"./src/MultiCascader/index.tsx\"));\n\nexports.MultiCascader = _MultiCascader.default;\n\nvar _DatePicker = _interopRequireDefault(__webpack_require__(/*! ./DatePicker */ \"./src/DatePicker/index.tsx\"));\n\nexports.DatePicker = _DatePicker.default;\n\nvar _DateRangePicker = _interopRequireDefault(__webpack_require__(/*! ./DateRangePicker */ \"./src/DateRangePicker/index.tsx\"));\n\nexports.DateRangePicker = _DateRangePicker.default;\n\nvar _AutoComplete = _interopRequireDefault(__webpack_require__(/*! ./AutoComplete */ \"./src/AutoComplete/index.tsx\"));\n\nexports.AutoComplete = _AutoComplete.default;\n\nvar _Uploader = _interopRequireDefault(__webpack_require__(/*! ./Uploader */ \"./src/Uploader/index.tsx\"));\n\nexports.Uploader = _Uploader.default;\n\nvar _Slider = _interopRequireDefault(__webpack_require__(/*! ./Slider */ \"./src/Slider/index.tsx\"));\n\nexports.Slider = _Slider.default;\n\nvar _RangeSlider = _interopRequireDefault(__webpack_require__(/*! ./RangeSlider */ \"./src/RangeSlider/index.tsx\"));\n\nexports.RangeSlider = _RangeSlider.default;\n\nvar _Rate = _interopRequireDefault(__webpack_require__(/*! ./Rate */ \"./src/Rate/index.tsx\"));\n\nexports.Rate = _Rate.default;\n\nvar _Tree = _interopRequireDefault(__webpack_require__(/*! ./Tree */ \"./src/Tree/index.tsx\"));\n\nexports.Tree = _Tree.default;\n\nvar _CheckTree = _interopRequireDefault(__webpack_require__(/*! ./CheckTree */ \"./src/CheckTree/index.tsx\"));\n\nexports.CheckTree = _CheckTree.default;\n\nvar _Panel = _interopRequireDefault(__webpack_require__(/*! ./Panel */ \"./src/Panel/index.tsx\"));\n\nexports.Panel = _Panel.default;\n\nvar _PanelGroup = _interopRequireDefault(__webpack_require__(/*! ./PanelGroup */ \"./src/PanelGroup/index.tsx\"));\n\nexports.PanelGroup = _PanelGroup.default;\n\nvar _Table = _interopRequireDefault(__webpack_require__(/*! ./Table */ \"./src/Table/index.tsx\"));\n\nexports.Table = _Table.default;\n\nvar _Progress = _interopRequireDefault(__webpack_require__(/*! ./Progress */ \"./src/Progress/index.tsx\"));\n\nexports.Progress = _Progress.default;\n\nvar _Timeline = _interopRequireDefault(__webpack_require__(/*! ./Timeline */ \"./src/Timeline/index.tsx\"));\n\nexports.Timeline = _Timeline.default;\n\nvar _Tag = _interopRequireDefault(__webpack_require__(/*! ./Tag */ \"./src/Tag/index.tsx\"));\n\nexports.Tag = _Tag.default;\n\nvar _TagGroup = _interopRequireDefault(__webpack_require__(/*! ./TagGroup */ \"./src/TagGroup/index.tsx\"));\n\nexports.TagGroup = _TagGroup.default;\n\nvar _List = _interopRequireDefault(__webpack_require__(/*! ./List */ \"./src/List/index.tsx\"));\n\nexports.List = _List.default;\n\nvar _Calendar = _interopRequireDefault(__webpack_require__(/*! ./Calendar */ \"./src/Calendar/index.tsx\"));\n\nexports.Calendar = _Calendar.default;\n\nvar _Carousel = _interopRequireDefault(__webpack_require__(/*! ./Carousel */ \"./src/Carousel/index.tsx\"));\n\nexports.Carousel = _Carousel.default;\n\nvar _Grid = _interopRequireDefault(__webpack_require__(/*! ./Grid */ \"./src/Grid/index.tsx\"));\n\nexports.Grid = _Grid.default;\n\nvar _Row = _interopRequireDefault(__webpack_require__(/*! ./Row */ \"./src/Row/index.tsx\"));\n\nexports.Row = _Row.default;\n\nvar _Col = _interopRequireDefault(__webpack_require__(/*! ./Col */ \"./src/Col/index.tsx\"));\n\nexports.Col = _Col.default;\n\nvar _FlexboxGrid = _interopRequireDefault(__webpack_require__(/*! ./FlexboxGrid */ \"./src/FlexboxGrid/index.tsx\"));\n\nexports.FlexboxGrid = _FlexboxGrid.default;\n\nvar _Container = _interopRequireDefault(__webpack_require__(/*! ./Container */ \"./src/Container/index.tsx\"));\n\nexports.Container = _Container.default;\n\nvar _Content = _interopRequireDefault(__webpack_require__(/*! ./Content */ \"./src/Content/index.tsx\"));\n\nexports.Content = _Content.default;\n\nvar _Header = _interopRequireDefault(__webpack_require__(/*! ./Header */ \"./src/Header/index.tsx\"));\n\nexports.Header = _Header.default;\n\nvar _Sidebar = _interopRequireDefault(__webpack_require__(/*! ./Sidebar */ \"./src/Sidebar/index.tsx\"));\n\nexports.Sidebar = _Sidebar.default;\n\nvar _Footer = _interopRequireDefault(__webpack_require__(/*! ./Footer */ \"./src/Footer/index.tsx\"));\n\nexports.Footer = _Footer.default;\n\nvar _Divider = _interopRequireDefault(__webpack_require__(/*! ./Divider */ \"./src/Divider/index.tsx\"));\n\nexports.Divider = _Divider.default;\n\nvar _Stack = _interopRequireDefault(__webpack_require__(/*! ./Stack */ \"./src/Stack/index.tsx\"));\n\nexports.Stack = _Stack.default;\n\nvar _Schema = _interopRequireDefault(__webpack_require__(/*! ./Schema */ \"./src/Schema/index.ts\"));\n\nexports.Schema = _Schema.default;\n\nvar _Animation = _interopRequireDefault(__webpack_require__(/*! ./Animation */ \"./src/Animation/index.tsx\"));\n\nexports.Animation = _Animation.default;\n\nvar _DOMHelper = _interopRequireDefault(__webpack_require__(/*! ./DOMHelper */ \"./src/DOMHelper/index.ts\"));\n\nexports.DOMHelper = _DOMHelper.default;\n\nvar _Affix = _interopRequireDefault(__webpack_require__(/*! ./Affix */ \"./src/Affix/index.tsx\"));\n\nexports.Affix = _Affix.default;\n\nvar _CustomProvider = _interopRequireDefault(__webpack_require__(/*! ./CustomProvider */ \"./src/CustomProvider/index.tsx\"));\n\nexports.CustomProvider = _CustomProvider.default;\n\n//# sourceURL=webpack://rsuite/./src/index.tsx?");
 
 /***/ }),
 
@@ -5004,7 +5048,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nvar _exportNames = {\n  guid: true,\n  prefix: true,\n  createChainedFunction: true,\n  isOneOf: true,\n  ReactChildren: true,\n  tplTransform: true,\n  ajaxUpload: true,\n  previewFile: true,\n  getDataGroupBy: true,\n  clone: true,\n  placementPolyfill: true,\n  getDOMNode: true,\n  mergeRefs: true,\n  shallowEqual: true,\n  shallowEqualArray: true,\n  composeFunctions: true,\n  reactToString: true,\n  scrollTopAnimation: true,\n  appendTooltip: true,\n  useClassNames: true,\n  useEventListener: true,\n  useElementResize: true,\n  useCustom: true,\n  usePortal: true,\n  createComponent: true,\n  useTimeout: true,\n  useControlled: true,\n  useRootClose: true,\n  getSafeRegExpString: true,\n  stringToObject: true,\n  useEventCallback: true,\n  useUpdatedRef: true,\n  useWillUnmount: true,\n  useUpdateEffect: true,\n  useIsMounted: true,\n  defaultClassPrefix: true,\n  getClassNamePrefix: true,\n  globalKey: true,\n  DateUtils: true,\n  TypeChecker: true\n};\nexports.TypeChecker = exports.DateUtils = exports.globalKey = exports.getClassNamePrefix = exports.defaultClassPrefix = exports.useIsMounted = exports.useUpdateEffect = exports.useWillUnmount = exports.useUpdatedRef = exports.useEventCallback = exports.stringToObject = exports.getSafeRegExpString = exports.useRootClose = exports.useControlled = exports.useTimeout = exports.createComponent = exports.usePortal = exports.useCustom = exports.useElementResize = exports.useEventListener = exports.useClassNames = exports.appendTooltip = exports.scrollTopAnimation = exports.reactToString = exports.composeFunctions = exports.shallowEqualArray = exports.shallowEqual = exports.mergeRefs = exports.getDOMNode = exports.placementPolyfill = exports.clone = exports.getDataGroupBy = exports.previewFile = exports.ajaxUpload = exports.tplTransform = exports.ReactChildren = exports.isOneOf = exports.createChainedFunction = exports.prefix = exports.guid = void 0;\n\nvar _BrowserDetection = __webpack_require__(/*! ./BrowserDetection */ \"./src/utils/BrowserDetection.ts\");\n\nObject.keys(_BrowserDetection).forEach(function (key) {\n  if (key === \"default\" || key === \"__esModule\") return;\n  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;\n  if (key in exports && exports[key] === _BrowserDetection[key]) return;\n  exports[key] = _BrowserDetection[key];\n});\n\nvar _htmlPropsUtils = __webpack_require__(/*! ./htmlPropsUtils */ \"./src/utils/htmlPropsUtils.ts\");\n\nObject.keys(_htmlPropsUtils).forEach(function (key) {\n  if (key === \"default\" || key === \"__esModule\") return;\n  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;\n  if (key in exports && exports[key] === _htmlPropsUtils[key]) return;\n  exports[key] = _htmlPropsUtils[key];\n});\n\nvar _constants = __webpack_require__(/*! ./constants */ \"./src/utils/constants.ts\");\n\nObject.keys(_constants).forEach(function (key) {\n  if (key === \"default\" || key === \"__esModule\") return;\n  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;\n  if (key in exports && exports[key] === _constants[key]) return;\n  exports[key] = _constants[key];\n});\n\nvar _DateUtils = _interopRequireWildcard(__webpack_require__(/*! ./dateUtils */ \"./src/utils/dateUtils.ts\"));\n\nexports.DateUtils = _DateUtils;\n\nvar _TypeChecker = _interopRequireWildcard(__webpack_require__(/*! ./propTypeChecker */ \"./src/utils/propTypeChecker.ts\"));\n\nexports.TypeChecker = _TypeChecker;\n\nvar _statusIcons = __webpack_require__(/*! ./statusIcons */ \"./src/utils/statusIcons.tsx\");\n\nObject.keys(_statusIcons).forEach(function (key) {\n  if (key === \"default\" || key === \"__esModule\") return;\n  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;\n  if (key in exports && exports[key] === _statusIcons[key]) return;\n  exports[key] = _statusIcons[key];\n});\n\nvar _guid = _interopRequireDefault(__webpack_require__(/*! ./guid */ \"./src/utils/guid.ts\"));\n\nexports.guid = _guid.default;\n\nvar _prefix = _interopRequireWildcard(__webpack_require__(/*! ./prefix */ \"./src/utils/prefix.ts\"));\n\nexports.prefix = _prefix.default;\nexports.defaultClassPrefix = _prefix.defaultClassPrefix;\nexports.getClassNamePrefix = _prefix.getClassNamePrefix;\nexports.globalKey = _prefix.globalKey;\n\nvar _createChainedFunction = _interopRequireDefault(__webpack_require__(/*! ./createChainedFunction */ \"./src/utils/createChainedFunction.ts\"));\n\nexports.createChainedFunction = _createChainedFunction.default;\n\nvar _isOneOf = _interopRequireDefault(__webpack_require__(/*! ./isOneOf */ \"./src/utils/isOneOf.ts\"));\n\nexports.isOneOf = _isOneOf.default;\n\nvar _ReactChildren = _interopRequireDefault(__webpack_require__(/*! ./ReactChildren */ \"./src/utils/ReactChildren.tsx\"));\n\nexports.ReactChildren = _ReactChildren.default;\n\nvar _tplTransform = _interopRequireDefault(__webpack_require__(/*! ./tplTransform */ \"./src/utils/tplTransform.tsx\"));\n\nexports.tplTransform = _tplTransform.default;\n\nvar _ajaxUpload = _interopRequireDefault(__webpack_require__(/*! ./ajaxUpload */ \"./src/utils/ajaxUpload.ts\"));\n\nexports.ajaxUpload = _ajaxUpload.default;\n\nvar _previewFile = _interopRequireDefault(__webpack_require__(/*! ./previewFile */ \"./src/utils/previewFile.ts\"));\n\nexports.previewFile = _previewFile.default;\n\nvar _getDataGroupBy = _interopRequireDefault(__webpack_require__(/*! ./getDataGroupBy */ \"./src/utils/getDataGroupBy.ts\"));\n\nexports.getDataGroupBy = _getDataGroupBy.default;\n\nvar _clone = _interopRequireDefault(__webpack_require__(/*! ./clone */ \"./src/utils/clone.ts\"));\n\nexports.clone = _clone.default;\n\nvar _placementPolyfill = _interopRequireDefault(__webpack_require__(/*! ./placementPolyfill */ \"./src/utils/placementPolyfill.ts\"));\n\nexports.placementPolyfill = _placementPolyfill.default;\n\nvar _getDOMNode = _interopRequireDefault(__webpack_require__(/*! ./getDOMNode */ \"./src/utils/getDOMNode.ts\"));\n\nexports.getDOMNode = _getDOMNode.default;\n\nvar _mergeRefs = _interopRequireDefault(__webpack_require__(/*! ./mergeRefs */ \"./src/utils/mergeRefs.ts\"));\n\nexports.mergeRefs = _mergeRefs.default;\n\nvar _shallowEqual = _interopRequireDefault(__webpack_require__(/*! ./shallowEqual */ \"./src/utils/shallowEqual.ts\"));\n\nexports.shallowEqual = _shallowEqual.default;\n\nvar _shallowEqualArray = _interopRequireDefault(__webpack_require__(/*! ./shallowEqualArray */ \"./src/utils/shallowEqualArray.ts\"));\n\nexports.shallowEqualArray = _shallowEqualArray.default;\n\nvar _composeFunctions = _interopRequireDefault(__webpack_require__(/*! ./composeFunctions */ \"./src/utils/composeFunctions.ts\"));\n\nexports.composeFunctions = _composeFunctions.default;\n\nvar _reactToString = _interopRequireDefault(__webpack_require__(/*! ./reactToString */ \"./src/utils/reactToString.ts\"));\n\nexports.reactToString = _reactToString.default;\n\nvar _scrollTopAnimation = _interopRequireDefault(__webpack_require__(/*! ./scrollTopAnimation */ \"./src/utils/scrollTopAnimation.ts\"));\n\nexports.scrollTopAnimation = _scrollTopAnimation.default;\n\nvar _appendTooltip = _interopRequireDefault(__webpack_require__(/*! ./appendTooltip */ \"./src/utils/appendTooltip.tsx\"));\n\nexports.appendTooltip = _appendTooltip.default;\n\nvar _useClassNames = _interopRequireDefault(__webpack_require__(/*! ./useClassNames */ \"./src/utils/useClassNames.ts\"));\n\nexports.useClassNames = _useClassNames.default;\n\nvar _useEventListener = _interopRequireDefault(__webpack_require__(/*! ./useEventListener */ \"./src/utils/useEventListener.ts\"));\n\nexports.useEventListener = _useEventListener.default;\n\nvar _useElementResize = _interopRequireDefault(__webpack_require__(/*! ./useElementResize */ \"./src/utils/useElementResize.ts\"));\n\nexports.useElementResize = _useElementResize.default;\n\nvar _useCustom = _interopRequireDefault(__webpack_require__(/*! ./useCustom */ \"./src/utils/useCustom.ts\"));\n\nexports.useCustom = _useCustom.default;\n\nvar _usePortal = _interopRequireDefault(__webpack_require__(/*! ./usePortal */ \"./src/utils/usePortal.tsx\"));\n\nexports.usePortal = _usePortal.default;\n\nvar _createComponent = _interopRequireDefault(__webpack_require__(/*! ./createComponent */ \"./src/utils/createComponent.tsx\"));\n\nexports.createComponent = _createComponent.default;\n\nvar _useTimeout = _interopRequireDefault(__webpack_require__(/*! ./useTimeout */ \"./src/utils/useTimeout.ts\"));\n\nexports.useTimeout = _useTimeout.default;\n\nvar _useControlled = _interopRequireDefault(__webpack_require__(/*! ./useControlled */ \"./src/utils/useControlled.ts\"));\n\nexports.useControlled = _useControlled.default;\n\nvar _useRootClose = _interopRequireDefault(__webpack_require__(/*! ./useRootClose */ \"./src/utils/useRootClose.ts\"));\n\nexports.useRootClose = _useRootClose.default;\n\nvar _getSafeRegExpString = _interopRequireDefault(__webpack_require__(/*! ./getSafeRegExpString */ \"./src/utils/getSafeRegExpString.ts\"));\n\nexports.getSafeRegExpString = _getSafeRegExpString.default;\n\nvar _stringToObject = _interopRequireDefault(__webpack_require__(/*! ./stringToObject */ \"./src/utils/stringToObject.ts\"));\n\nexports.stringToObject = _stringToObject.default;\n\nvar _useEventCallback = _interopRequireDefault(__webpack_require__(/*! ./useEventCallback */ \"./src/utils/useEventCallback.ts\"));\n\nexports.useEventCallback = _useEventCallback.default;\n\nvar _useUpdatedRef = _interopRequireDefault(__webpack_require__(/*! ./useUpdatedRef */ \"./src/utils/useUpdatedRef.ts\"));\n\nexports.useUpdatedRef = _useUpdatedRef.default;\n\nvar _useWillUnmount = _interopRequireDefault(__webpack_require__(/*! ./useWillUnmount */ \"./src/utils/useWillUnmount.ts\"));\n\nexports.useWillUnmount = _useWillUnmount.default;\n\nvar _useUpdateEffect = _interopRequireDefault(__webpack_require__(/*! ./useUpdateEffect */ \"./src/utils/useUpdateEffect.ts\"));\n\nexports.useUpdateEffect = _useUpdateEffect.default;\n\nvar _useIsMounted = _interopRequireDefault(__webpack_require__(/*! ./useIsMounted */ \"./src/utils/useIsMounted.ts\"));\n\nexports.useIsMounted = _useIsMounted.default;\n\n//# sourceURL=webpack://rsuite/./src/utils/index.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\n\nexports.__esModule = true;\nvar _exportNames = {\n  guid: true,\n  prefix: true,\n  createChainedFunction: true,\n  isOneOf: true,\n  ReactChildren: true,\n  tplTransform: true,\n  ajaxUpload: true,\n  previewFile: true,\n  getDataGroupBy: true,\n  clone: true,\n  placementPolyfill: true,\n  getDOMNode: true,\n  mergeRefs: true,\n  shallowEqual: true,\n  shallowEqualArray: true,\n  composeFunctions: true,\n  reactToString: true,\n  scrollTopAnimation: true,\n  appendTooltip: true,\n  useClassNames: true,\n  useEventListener: true,\n  useElementResize: true,\n  useCustom: true,\n  usePortal: true,\n  createComponent: true,\n  useTimeout: true,\n  useControlled: true,\n  useRootClose: true,\n  getSafeRegExpString: true,\n  stringToObject: true,\n  useEventCallback: true,\n  useUpdatedRef: true,\n  useWillUnmount: true,\n  useUpdateEffect: true,\n  useIsMounted: true,\n  useMount: true,\n  defaultClassPrefix: true,\n  getClassNamePrefix: true,\n  globalKey: true,\n  DateUtils: true,\n  TypeChecker: true\n};\nexports.TypeChecker = exports.DateUtils = exports.globalKey = exports.getClassNamePrefix = exports.defaultClassPrefix = exports.useMount = exports.useIsMounted = exports.useUpdateEffect = exports.useWillUnmount = exports.useUpdatedRef = exports.useEventCallback = exports.stringToObject = exports.getSafeRegExpString = exports.useRootClose = exports.useControlled = exports.useTimeout = exports.createComponent = exports.usePortal = exports.useCustom = exports.useElementResize = exports.useEventListener = exports.useClassNames = exports.appendTooltip = exports.scrollTopAnimation = exports.reactToString = exports.composeFunctions = exports.shallowEqualArray = exports.shallowEqual = exports.mergeRefs = exports.getDOMNode = exports.placementPolyfill = exports.clone = exports.getDataGroupBy = exports.previewFile = exports.ajaxUpload = exports.tplTransform = exports.ReactChildren = exports.isOneOf = exports.createChainedFunction = exports.prefix = exports.guid = void 0;\n\nvar _BrowserDetection = __webpack_require__(/*! ./BrowserDetection */ \"./src/utils/BrowserDetection.ts\");\n\nObject.keys(_BrowserDetection).forEach(function (key) {\n  if (key === \"default\" || key === \"__esModule\") return;\n  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;\n  if (key in exports && exports[key] === _BrowserDetection[key]) return;\n  exports[key] = _BrowserDetection[key];\n});\n\nvar _htmlPropsUtils = __webpack_require__(/*! ./htmlPropsUtils */ \"./src/utils/htmlPropsUtils.ts\");\n\nObject.keys(_htmlPropsUtils).forEach(function (key) {\n  if (key === \"default\" || key === \"__esModule\") return;\n  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;\n  if (key in exports && exports[key] === _htmlPropsUtils[key]) return;\n  exports[key] = _htmlPropsUtils[key];\n});\n\nvar _constants = __webpack_require__(/*! ./constants */ \"./src/utils/constants.ts\");\n\nObject.keys(_constants).forEach(function (key) {\n  if (key === \"default\" || key === \"__esModule\") return;\n  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;\n  if (key in exports && exports[key] === _constants[key]) return;\n  exports[key] = _constants[key];\n});\n\nvar _DateUtils = _interopRequireWildcard(__webpack_require__(/*! ./dateUtils */ \"./src/utils/dateUtils.ts\"));\n\nexports.DateUtils = _DateUtils;\n\nvar _TypeChecker = _interopRequireWildcard(__webpack_require__(/*! ./propTypeChecker */ \"./src/utils/propTypeChecker.ts\"));\n\nexports.TypeChecker = _TypeChecker;\n\nvar _statusIcons = __webpack_require__(/*! ./statusIcons */ \"./src/utils/statusIcons.tsx\");\n\nObject.keys(_statusIcons).forEach(function (key) {\n  if (key === \"default\" || key === \"__esModule\") return;\n  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;\n  if (key in exports && exports[key] === _statusIcons[key]) return;\n  exports[key] = _statusIcons[key];\n});\n\nvar _guid = _interopRequireDefault(__webpack_require__(/*! ./guid */ \"./src/utils/guid.ts\"));\n\nexports.guid = _guid.default;\n\nvar _prefix = _interopRequireWildcard(__webpack_require__(/*! ./prefix */ \"./src/utils/prefix.ts\"));\n\nexports.prefix = _prefix.default;\nexports.defaultClassPrefix = _prefix.defaultClassPrefix;\nexports.getClassNamePrefix = _prefix.getClassNamePrefix;\nexports.globalKey = _prefix.globalKey;\n\nvar _createChainedFunction = _interopRequireDefault(__webpack_require__(/*! ./createChainedFunction */ \"./src/utils/createChainedFunction.ts\"));\n\nexports.createChainedFunction = _createChainedFunction.default;\n\nvar _isOneOf = _interopRequireDefault(__webpack_require__(/*! ./isOneOf */ \"./src/utils/isOneOf.ts\"));\n\nexports.isOneOf = _isOneOf.default;\n\nvar _ReactChildren = _interopRequireDefault(__webpack_require__(/*! ./ReactChildren */ \"./src/utils/ReactChildren.tsx\"));\n\nexports.ReactChildren = _ReactChildren.default;\n\nvar _tplTransform = _interopRequireDefault(__webpack_require__(/*! ./tplTransform */ \"./src/utils/tplTransform.tsx\"));\n\nexports.tplTransform = _tplTransform.default;\n\nvar _ajaxUpload = _interopRequireDefault(__webpack_require__(/*! ./ajaxUpload */ \"./src/utils/ajaxUpload.ts\"));\n\nexports.ajaxUpload = _ajaxUpload.default;\n\nvar _previewFile = _interopRequireDefault(__webpack_require__(/*! ./previewFile */ \"./src/utils/previewFile.ts\"));\n\nexports.previewFile = _previewFile.default;\n\nvar _getDataGroupBy = _interopRequireDefault(__webpack_require__(/*! ./getDataGroupBy */ \"./src/utils/getDataGroupBy.ts\"));\n\nexports.getDataGroupBy = _getDataGroupBy.default;\n\nvar _clone = _interopRequireDefault(__webpack_require__(/*! ./clone */ \"./src/utils/clone.ts\"));\n\nexports.clone = _clone.default;\n\nvar _placementPolyfill = _interopRequireDefault(__webpack_require__(/*! ./placementPolyfill */ \"./src/utils/placementPolyfill.ts\"));\n\nexports.placementPolyfill = _placementPolyfill.default;\n\nvar _getDOMNode = _interopRequireDefault(__webpack_require__(/*! ./getDOMNode */ \"./src/utils/getDOMNode.ts\"));\n\nexports.getDOMNode = _getDOMNode.default;\n\nvar _mergeRefs = _interopRequireDefault(__webpack_require__(/*! ./mergeRefs */ \"./src/utils/mergeRefs.ts\"));\n\nexports.mergeRefs = _mergeRefs.default;\n\nvar _shallowEqual = _interopRequireDefault(__webpack_require__(/*! ./shallowEqual */ \"./src/utils/shallowEqual.ts\"));\n\nexports.shallowEqual = _shallowEqual.default;\n\nvar _shallowEqualArray = _interopRequireDefault(__webpack_require__(/*! ./shallowEqualArray */ \"./src/utils/shallowEqualArray.ts\"));\n\nexports.shallowEqualArray = _shallowEqualArray.default;\n\nvar _composeFunctions = _interopRequireDefault(__webpack_require__(/*! ./composeFunctions */ \"./src/utils/composeFunctions.ts\"));\n\nexports.composeFunctions = _composeFunctions.default;\n\nvar _reactToString = _interopRequireDefault(__webpack_require__(/*! ./reactToString */ \"./src/utils/reactToString.ts\"));\n\nexports.reactToString = _reactToString.default;\n\nvar _scrollTopAnimation = _interopRequireDefault(__webpack_require__(/*! ./scrollTopAnimation */ \"./src/utils/scrollTopAnimation.ts\"));\n\nexports.scrollTopAnimation = _scrollTopAnimation.default;\n\nvar _appendTooltip = _interopRequireDefault(__webpack_require__(/*! ./appendTooltip */ \"./src/utils/appendTooltip.tsx\"));\n\nexports.appendTooltip = _appendTooltip.default;\n\nvar _useClassNames = _interopRequireDefault(__webpack_require__(/*! ./useClassNames */ \"./src/utils/useClassNames.ts\"));\n\nexports.useClassNames = _useClassNames.default;\n\nvar _useEventListener = _interopRequireDefault(__webpack_require__(/*! ./useEventListener */ \"./src/utils/useEventListener.ts\"));\n\nexports.useEventListener = _useEventListener.default;\n\nvar _useElementResize = _interopRequireDefault(__webpack_require__(/*! ./useElementResize */ \"./src/utils/useElementResize.ts\"));\n\nexports.useElementResize = _useElementResize.default;\n\nvar _useCustom = _interopRequireDefault(__webpack_require__(/*! ./useCustom */ \"./src/utils/useCustom.ts\"));\n\nexports.useCustom = _useCustom.default;\n\nvar _usePortal = _interopRequireDefault(__webpack_require__(/*! ./usePortal */ \"./src/utils/usePortal.tsx\"));\n\nexports.usePortal = _usePortal.default;\n\nvar _createComponent = _interopRequireDefault(__webpack_require__(/*! ./createComponent */ \"./src/utils/createComponent.tsx\"));\n\nexports.createComponent = _createComponent.default;\n\nvar _useTimeout = _interopRequireDefault(__webpack_require__(/*! ./useTimeout */ \"./src/utils/useTimeout.ts\"));\n\nexports.useTimeout = _useTimeout.default;\n\nvar _useControlled = _interopRequireDefault(__webpack_require__(/*! ./useControlled */ \"./src/utils/useControlled.ts\"));\n\nexports.useControlled = _useControlled.default;\n\nvar _useRootClose = _interopRequireDefault(__webpack_require__(/*! ./useRootClose */ \"./src/utils/useRootClose.ts\"));\n\nexports.useRootClose = _useRootClose.default;\n\nvar _getSafeRegExpString = _interopRequireDefault(__webpack_require__(/*! ./getSafeRegExpString */ \"./src/utils/getSafeRegExpString.ts\"));\n\nexports.getSafeRegExpString = _getSafeRegExpString.default;\n\nvar _stringToObject = _interopRequireDefault(__webpack_require__(/*! ./stringToObject */ \"./src/utils/stringToObject.ts\"));\n\nexports.stringToObject = _stringToObject.default;\n\nvar _useEventCallback = _interopRequireDefault(__webpack_require__(/*! ./useEventCallback */ \"./src/utils/useEventCallback.ts\"));\n\nexports.useEventCallback = _useEventCallback.default;\n\nvar _useUpdatedRef = _interopRequireDefault(__webpack_require__(/*! ./useUpdatedRef */ \"./src/utils/useUpdatedRef.ts\"));\n\nexports.useUpdatedRef = _useUpdatedRef.default;\n\nvar _useWillUnmount = _interopRequireDefault(__webpack_require__(/*! ./useWillUnmount */ \"./src/utils/useWillUnmount.ts\"));\n\nexports.useWillUnmount = _useWillUnmount.default;\n\nvar _useUpdateEffect = _interopRequireDefault(__webpack_require__(/*! ./useUpdateEffect */ \"./src/utils/useUpdateEffect.ts\"));\n\nexports.useUpdateEffect = _useUpdateEffect.default;\n\nvar _useIsMounted = _interopRequireDefault(__webpack_require__(/*! ./useIsMounted */ \"./src/utils/useIsMounted.ts\"));\n\nexports.useIsMounted = _useIsMounted.default;\n\nvar _useMount = _interopRequireDefault(__webpack_require__(/*! ./useMount */ \"./src/utils/useMount.ts\"));\n\nexports.useMount = _useMount.default;\n\n//# sourceURL=webpack://rsuite/./src/utils/index.ts?");
 
 /***/ }),
 
@@ -5283,6 +5327,17 @@ eval("\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _react =
 
 /***/ }),
 
+/***/ "./src/utils/useMount.ts":
+/*!*******************************!*\
+  !*** ./src/utils/useMount.ts ***!
+  \*******************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _react = __webpack_require__(/*! react */ \"react\");\n\nvar useMount = function useMount(callback) {\n  var mountRef = (0, _react.useRef)(callback);\n  mountRef.current = callback;\n  (0, _react.useEffect)(function () {\n    var _mountRef$current;\n\n    (_mountRef$current = mountRef.current) === null || _mountRef$current === void 0 ? void 0 : _mountRef$current.call(mountRef);\n  }, []);\n};\n\nvar _default = useMount;\nexports.default = _default;\n\n//# sourceURL=webpack://rsuite/./src/utils/useMount.ts?");
+
+/***/ }),
+
 /***/ "./src/utils/usePortal.tsx":
 /*!*********************************!*\
   !*** ./src/utils/usePortal.tsx ***!
@@ -9002,7 +9057,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _bab
 /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/extends */ \"./node_modules/@babel/runtime/helpers/esm/extends.js\");\n/* harmony import */ var _babel_runtime_helpers_esm_objectWithoutPropertiesLoose__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var dom_lib_translateDOMPositionXY__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! dom-lib/translateDOMPositionXY */ \"./node_modules/dom-lib/esm/translateDOMPositionXY.js\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var lodash_isFunction__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\");\n/* harmony import */ var lodash_isFunction__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(lodash_isFunction__WEBPACK_IMPORTED_MODULE_5__);\n/* harmony import */ var lodash_flatten__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! lodash/flatten */ \"./node_modules/lodash/flatten.js\");\n/* harmony import */ var lodash_flatten__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(lodash_flatten__WEBPACK_IMPORTED_MODULE_6__);\n/* harmony import */ var _Row__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Row */ \"./node_modules/rsuite-table/es/Row.js\");\n/* harmony import */ var _CellGroup__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./CellGroup */ \"./node_modules/rsuite-table/es/CellGroup.js\");\n/* harmony import */ var _Scrollbar__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./Scrollbar */ \"./node_modules/rsuite-table/es/Scrollbar.js\");\n/* harmony import */ var _MouseArea__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./MouseArea */ \"./node_modules/rsuite-table/es/MouseArea.js\");\n/* harmony import */ var _Loader__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./Loader */ \"./node_modules/rsuite-table/es/Loader.js\");\n/* harmony import */ var _EmptyMessage__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./EmptyMessage */ \"./node_modules/rsuite-table/es/EmptyMessage.js\");\n/* harmony import */ var _TableContext__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./TableContext */ \"./node_modules/rsuite-table/es/TableContext.js\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./constants */ \"./node_modules/rsuite-table/es/constants.js\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./utils */ \"./node_modules/rsuite-table/es/utils/index.js\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n/**\n * Filter those expanded nodes.\n * @param data\n * @param expandedRowKeys\n * @param rowKey\n * @returns\n */\nvar filterTreeData = function filterTreeData(data, expandedRowKeys, rowKey) {\n  return (0,_utils__WEBPACK_IMPORTED_MODULE_15__.flattenData)(data).filter(function (rowData) {\n    var parents = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.findAllParents)(rowData, rowKey);\n    var expanded = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.shouldShowRowByExpanded)(expandedRowKeys, parents);\n    rowData[_constants__WEBPACK_IMPORTED_MODULE_14__.EXPANDED_KEY] = expanded;\n    rowData[_constants__WEBPACK_IMPORTED_MODULE_14__.TREE_DEPTH] = parents.length;\n    return expanded;\n  });\n};\n\nvar Table = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().forwardRef(function (props, ref) {\n  var affixHeader = props.affixHeader,\n      children = props.children,\n      classPrefix = props.classPrefix,\n      className = props.className,\n      dataProp = props.data,\n      widthProp = props.width,\n      expandedRowKeysProp = props.expandedRowKeys,\n      defaultExpandAllRows = props.defaultExpandAllRows,\n      defaultExpandedRowKeys = props.defaultExpandedRowKeys,\n      style = props.style,\n      id = props.id,\n      isTree = props.isTree,\n      hover = props.hover,\n      bordered = props.bordered,\n      cellBordered = props.cellBordered,\n      wordWrap = props.wordWrap,\n      loading = props.loading,\n      locale = props.locale,\n      showHeader = props.showHeader,\n      sortColumn = props.sortColumn,\n      rowHeightProp = props.rowHeight,\n      sortTypeProp = props.sortType,\n      defaultSortType = props.defaultSortType,\n      headerHeightProp = props.headerHeight,\n      minHeight = props.minHeight,\n      height = props.height,\n      autoHeight = props.autoHeight,\n      rtlProp = props.rtl,\n      translate3d = props.translate3d,\n      rowKey = props.rowKey,\n      virtualized = props.virtualized,\n      rowHeight = props.rowHeight,\n      rowClassName = props.rowClassName,\n      rowExpandedHeight = props.rowExpandedHeight,\n      disabledScroll = props.disabledScroll,\n      affixHorizontalScrollbar = props.affixHorizontalScrollbar,\n      loadAnimation = props.loadAnimation,\n      shouldUpdateScroll = props.shouldUpdateScroll,\n      renderRowExpandedProp = props.renderRowExpanded,\n      renderLoading = props.renderLoading,\n      renderEmpty = props.renderEmpty,\n      onSortColumn = props.onSortColumn,\n      onScroll = props.onScroll,\n      renderTreeToggle = props.renderTreeToggle,\n      onRowClick = props.onRowClick,\n      onRowContextMenu = props.onRowContextMenu,\n      onExpandChange = props.onExpandChange,\n      onTouchStart = props.onTouchStart,\n      onTouchMove = props.onTouchMove,\n      onTouchEnd = props.onTouchEnd,\n      rest = (0,_babel_runtime_helpers_esm_objectWithoutPropertiesLoose__WEBPACK_IMPORTED_MODULE_1__.default)(props, [\"affixHeader\", \"children\", \"classPrefix\", \"className\", \"data\", \"width\", \"expandedRowKeys\", \"defaultExpandAllRows\", \"defaultExpandedRowKeys\", \"style\", \"id\", \"isTree\", \"hover\", \"bordered\", \"cellBordered\", \"wordWrap\", \"loading\", \"locale\", \"showHeader\", \"sortColumn\", \"rowHeight\", \"sortType\", \"defaultSortType\", \"headerHeight\", \"minHeight\", \"height\", \"autoHeight\", \"rtl\", \"translate3d\", \"rowKey\", \"virtualized\", \"rowHeight\", \"rowClassName\", \"rowExpandedHeight\", \"disabledScroll\", \"affixHorizontalScrollbar\", \"loadAnimation\", \"shouldUpdateScroll\", \"renderRowExpanded\", \"renderLoading\", \"renderEmpty\", \"onSortColumn\", \"onScroll\", \"renderTreeToggle\", \"onRowClick\", \"onRowContextMenu\", \"onExpandChange\", \"onTouchStart\", \"onTouchMove\", \"onTouchEnd\"]);\n\n  if (isTree && !rowKey) {\n    throw new Error('The `rowKey` is required when set isTree');\n  }\n\n  var _useClassNames = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useClassNames)(classPrefix || 'table', typeof classPrefix !== 'undefined'),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      mergeCls = _useClassNames.merge,\n      prefix = _useClassNames.prefix; // Use `forceUpdate` to force the component to re-render after manipulating the DOM.\n\n\n  var _useReducer = (0,react__WEBPACK_IMPORTED_MODULE_2__.useReducer)(function (x) {\n    return x + 1;\n  }, 0),\n      forceUpdate = _useReducer[1];\n\n  var _useControlled = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useControlled)(expandedRowKeysProp, defaultExpandAllRows ? (0,_utils__WEBPACK_IMPORTED_MODULE_15__.findRowKeys)(dataProp, rowKey, lodash_isFunction__WEBPACK_IMPORTED_MODULE_5___default()(renderRowExpandedProp)) : defaultExpandedRowKeys || []),\n      expandedRowKeys = _useControlled[0],\n      setExpandedRowKeys = _useControlled[1];\n\n  var _useState = (0,react__WEBPACK_IMPORTED_MODULE_2__.useState)(function () {\n    return isTree ? filterTreeData(dataProp, expandedRowKeys, rowKey) : dataProp;\n  }),\n      data = _useState[0],\n      setData = _useState[1];\n\n  var _useTableRows = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useTableRows)({\n    data: dataProp,\n    expandedRowKeys: expandedRowKeys,\n    wordWrap: wordWrap,\n    prefix: prefix\n  }),\n      tableRowsMaxHeight = _useTableRows.tableRowsMaxHeight,\n      bindTableRowsRef = _useTableRows.bindTableRowsRef;\n\n  var headerHeight = showHeader ? headerHeightProp : 0;\n  var rtl = rtlProp || (0,_utils__WEBPACK_IMPORTED_MODULE_15__.isRTL)();\n\n  var getRowHeight = function getRowHeight(rowData) {\n    if (rowData === void 0) {\n      rowData = {};\n    }\n\n    return typeof rowHeightProp === 'function' ? rowHeightProp(rowData) : rowHeightProp;\n  };\n\n  var translateDOMPositionXY = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)((0,dom_lib_translateDOMPositionXY__WEBPACK_IMPORTED_MODULE_3__.getTranslateDOMPositionXY)({\n    enable3DTransform: translate3d\n  }));\n  var shouldFixedColumn = Array.from(lodash_flatten__WEBPACK_IMPORTED_MODULE_6___default()(children)).some(function (child) {\n    var _child$props;\n\n    return child === null || child === void 0 ? void 0 : (_child$props = child.props) === null || _child$props === void 0 ? void 0 : _child$props.fixed;\n  });\n  var visibleRows = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)([]);\n  var mouseAreaRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  var tableRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  var tableHeaderRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  var affixHeaderWrapperRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  var headerWrapperRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  var tableBodyRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  var wheelWrapperRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  var scrollbarXRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  var scrollbarYRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  /**\n   * Reset the position of the scroll bar after the table size changes.\n   */\n\n  var resetScrollbar = function resetScrollbar(event) {\n    forceUpdate();\n\n    if (typeof shouldUpdateScroll === 'function') {\n      onScrollTo(shouldUpdateScroll(event));\n    } else if (shouldUpdateScroll) {\n      var vertical = event === 'bodyHeightChanged';\n      vertical ? onScrollTop(0) : onScrollLeft(0);\n    }\n  };\n\n  var _useTableDimension = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useTableDimension)({\n    data: dataProp,\n    width: widthProp,\n    rowHeight: rowHeight,\n    tableRef: tableRef,\n    headerWrapperRef: headerWrapperRef,\n    prefix: prefix,\n    affixHeader: affixHeader,\n    affixHorizontalScrollbar: affixHorizontalScrollbar,\n    headerHeight: headerHeight,\n    height: height,\n    autoHeight: autoHeight,\n    children: children,\n    expandedRowKeys: expandedRowKeys,\n    onTableScroll: function onTableScroll(coords) {\n      onScrollTo(coords);\n    },\n    onTableContentHeightChange: function onTableContentHeightChange() {\n      resetScrollbar('bodyHeightChanged');\n    },\n    onTableContentWidthChange: function onTableContentWidthChange() {\n      resetScrollbar('bodyWidthChanged');\n    },\n    onTableWidthChange: function onTableWidthChange() {\n      resetScrollbar('widthChanged');\n    }\n  }),\n      contentHeight = _useTableDimension.contentHeight,\n      contentWidth = _useTableDimension.contentWidth,\n      minScrollY = _useTableDimension.minScrollY,\n      minScrollX = _useTableDimension.minScrollX,\n      scrollY = _useTableDimension.scrollY,\n      scrollX = _useTableDimension.scrollX,\n      tableWidth = _useTableDimension.tableWidth,\n      tableOffset = _useTableDimension.tableOffset,\n      headerOffset = _useTableDimension.headerOffset,\n      setScrollY = _useTableDimension.setScrollY,\n      setScrollX = _useTableDimension.setScrollX;\n\n  var getTableHeight = (0,react__WEBPACK_IMPORTED_MODULE_2__.useCallback)(function () {\n    if (data.length === 0 && autoHeight) {\n      return height;\n    }\n\n    return autoHeight ? Math.max(headerHeight + contentHeight.current, minHeight) : height;\n  }, [autoHeight, contentHeight, data.length, headerHeight, height, minHeight]);\n  (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useAffix)({\n    tableHeight: getTableHeight,\n    contentHeight: contentHeight,\n    affixHorizontalScrollbar: affixHorizontalScrollbar,\n    affixHeader: affixHeader,\n    tableOffset: tableOffset,\n    headerOffset: headerOffset,\n    headerHeight: headerHeight,\n    scrollbarXRef: scrollbarXRef,\n    affixHeaderWrapperRef: affixHeaderWrapperRef\n  });\n\n  var _usePosition = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.usePosition)({\n    data: dataProp,\n    height: height,\n    tableWidth: tableWidth,\n    tableRef: tableRef,\n    prefix: prefix,\n    translateDOMPositionXY: translateDOMPositionXY,\n    wheelWrapperRef: wheelWrapperRef,\n    headerWrapperRef: headerWrapperRef,\n    affixHeaderWrapperRef: affixHeaderWrapperRef,\n    tableHeaderRef: tableHeaderRef,\n    scrollX: scrollX,\n    scrollY: scrollY,\n    contentWidth: contentWidth,\n    shouldFixedColumn: shouldFixedColumn\n  }),\n      forceUpdatePosition = _usePosition.forceUpdatePosition;\n\n  var _useScrollListener = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useScrollListener)({\n    rtl: rtl,\n    data: dataProp,\n    height: height,\n    virtualized: virtualized,\n    getTableHeight: getTableHeight,\n    contentHeight: contentHeight,\n    headerHeight: headerHeight,\n    autoHeight: autoHeight,\n    tableBodyRef: tableBodyRef,\n    scrollbarXRef: scrollbarXRef,\n    scrollbarYRef: scrollbarYRef,\n    disabledScroll: disabledScroll,\n    loading: loading,\n    tableRef: tableRef,\n    contentWidth: contentWidth,\n    tableWidth: tableWidth,\n    scrollY: scrollY,\n    minScrollY: minScrollY,\n    minScrollX: minScrollX,\n    scrollX: scrollX,\n    setScrollX: setScrollX,\n    setScrollY: setScrollY,\n    forceUpdatePosition: forceUpdatePosition,\n    onScroll: onScroll,\n    onTouchStart: onTouchStart,\n    onTouchMove: onTouchMove,\n    onTouchEnd: onTouchEnd\n  }),\n      isScrolling = _useScrollListener.isScrolling,\n      onScrollHorizontal = _useScrollListener.onScrollHorizontal,\n      onScrollVertical = _useScrollListener.onScrollVertical,\n      onScrollBody = _useScrollListener.onScrollBody,\n      onScrollTop = _useScrollListener.onScrollTop,\n      onScrollLeft = _useScrollListener.onScrollLeft,\n      onScrollTo = _useScrollListener.onScrollTo;\n\n  var _useCellDescriptor = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useCellDescriptor)({\n    children: children,\n    rtl: rtl,\n    mouseAreaRef: mouseAreaRef,\n    tableRef: tableRef,\n    minScrollX: minScrollX,\n    scrollX: scrollX,\n    tableWidth: tableWidth,\n    headerHeight: headerHeight,\n    showHeader: showHeader,\n    sortType: sortTypeProp,\n    defaultSortType: defaultSortType,\n    sortColumn: sortColumn,\n    prefix: prefix,\n    onSortColumn: onSortColumn,\n    rowHeight: rowHeight\n  }),\n      headerCells = _useCellDescriptor.headerCells,\n      bodyCells = _useCellDescriptor.bodyCells,\n      allColumnsWidth = _useCellDescriptor.allColumnsWidth,\n      hasCustomTreeCol = _useCellDescriptor.hasCustomTreeCol;\n\n  var colCounts = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)((headerCells === null || headerCells === void 0 ? void 0 : headerCells.length) || 0);\n  (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useUpdateEffect)(function () {\n    setData(isTree ? filterTreeData(dataProp, expandedRowKeys, rowKey) : dataProp);\n  }, [dataProp, expandedRowKeys, rowKey, isTree]);\n  (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useUpdateEffect)(function () {\n    if ((headerCells === null || headerCells === void 0 ? void 0 : headerCells.length) !== colCounts.current) {\n      onScrollLeft(0);\n      colCounts.current = (headerCells === null || headerCells === void 0 ? void 0 : headerCells.length) || 0;\n    }\n  }, [children]);\n  (0,react__WEBPACK_IMPORTED_MODULE_2__.useImperativeHandle)(ref, function () {\n    return {\n      get root() {\n        return tableRef.current;\n      },\n\n      get body() {\n        return wheelWrapperRef.current;\n      },\n\n      scrollTop: onScrollTop,\n      scrollLeft: onScrollLeft\n    };\n  });\n  var rowWidth = allColumnsWidth > tableWidth.current ? allColumnsWidth : tableWidth.current;\n  var classes = mergeCls(className, withClassPrefix({\n    bordered: bordered,\n    hover: hover,\n    loading: loading,\n    treetable: isTree,\n    'word-wrap': wordWrap,\n    'cell-bordered': cellBordered\n  }));\n\n  var styles = (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__.default)({\n    width: widthProp || 'auto',\n    height: getTableHeight()\n  }, style);\n\n  var renderRowExpanded = (0,react__WEBPACK_IMPORTED_MODULE_2__.useCallback)(function (rowData) {\n    var styles = {\n      height: rowExpandedHeight\n    };\n\n    if (typeof renderRowExpandedProp === 'function') {\n      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n        className: prefix('row-expanded'),\n        style: styles\n      }, renderRowExpandedProp(rowData));\n    }\n\n    return null;\n  }, [prefix, renderRowExpandedProp, rowExpandedHeight]);\n\n  var renderRow = function renderRow(props, cells, shouldRenderExpandedRow, rowData) {\n    var depth = props.depth,\n        restRowProps = (0,_babel_runtime_helpers_esm_objectWithoutPropertiesLoose__WEBPACK_IMPORTED_MODULE_1__.default)(props, [\"depth\"]);\n\n    if (typeof rowClassName === 'function') {\n      restRowProps.className = rowClassName(rowData);\n    } else {\n      restRowProps.className = rowClassName;\n    }\n\n    var rowStyles = (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__.default)({}, props === null || props === void 0 ? void 0 : props.style);\n\n    var rowRight = 0;\n\n    if (rtl && contentWidth.current > tableWidth.current) {\n      rowRight = tableWidth.current - contentWidth.current;\n      rowStyles.right = rowRight;\n    } // IF there are fixed columns, add a fixed group\n\n\n    if (shouldFixedColumn && contentWidth.current > tableWidth.current) {\n      var fixedLeftCells = [];\n      var fixedRightCells = [];\n      var scrollCells = [];\n      var fixedLeftCellGroupWidth = 0;\n      var fixedRightCellGroupWidth = 0;\n\n      for (var i = 0; i < cells.length; i++) {\n        var cell = cells[i];\n        var _cell$props = cell.props,\n            fixed = _cell$props.fixed,\n            width = _cell$props.width;\n        var isFixedStart = fixed === 'left' || fixed === true;\n        var isFixedEnd = fixed === 'right';\n\n        if (rtl) {\n          isFixedStart = fixed === 'right';\n          isFixedEnd = fixed === 'left' || fixed === true;\n        }\n\n        if (isFixedStart) {\n          fixedLeftCells.push(cell);\n          fixedLeftCellGroupWidth += width;\n        } else if (isFixedEnd) {\n          fixedRightCells.push(cell);\n          fixedRightCellGroupWidth += width;\n        } else {\n          scrollCells.push(cell);\n        }\n      }\n\n      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_Row__WEBPACK_IMPORTED_MODULE_7__.default, (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__.default)({}, restRowProps, {\n        \"data-depth\": depth,\n        style: rowStyles\n      }), fixedLeftCellGroupWidth ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_CellGroup__WEBPACK_IMPORTED_MODULE_8__.default, {\n        fixed: \"left\",\n        height: props.isHeaderRow ? props.headerHeight : props.height,\n        width: fixedLeftCellGroupWidth,\n        style: rtl ? {\n          right: tableWidth.current - fixedLeftCellGroupWidth - rowRight\n        } : null\n      }, (0,_utils__WEBPACK_IMPORTED_MODULE_15__.mergeCells)((0,_utils__WEBPACK_IMPORTED_MODULE_15__.resetLeftForCells)(fixedLeftCells))) : null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_CellGroup__WEBPACK_IMPORTED_MODULE_8__.default, null, (0,_utils__WEBPACK_IMPORTED_MODULE_15__.mergeCells)(scrollCells)), fixedRightCellGroupWidth ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_CellGroup__WEBPACK_IMPORTED_MODULE_8__.default, {\n        fixed: \"right\",\n        style: rtl ? {\n          right: 0 - rowRight\n        } : {\n          left: tableWidth.current - fixedRightCellGroupWidth - _constants__WEBPACK_IMPORTED_MODULE_14__.SCROLLBAR_WIDTH\n        },\n        height: props.isHeaderRow ? props.headerHeight : props.height,\n        width: fixedRightCellGroupWidth + _constants__WEBPACK_IMPORTED_MODULE_14__.SCROLLBAR_WIDTH\n      }, (0,_utils__WEBPACK_IMPORTED_MODULE_15__.mergeCells)((0,_utils__WEBPACK_IMPORTED_MODULE_15__.resetLeftForCells)(fixedRightCells, _constants__WEBPACK_IMPORTED_MODULE_14__.SCROLLBAR_WIDTH))) : null, shouldRenderExpandedRow && renderRowExpanded(rowData));\n    }\n\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_Row__WEBPACK_IMPORTED_MODULE_7__.default, (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__.default)({}, restRowProps, {\n      \"data-depth\": depth,\n      style: rowStyles\n    }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_CellGroup__WEBPACK_IMPORTED_MODULE_8__.default, null, (0,_utils__WEBPACK_IMPORTED_MODULE_15__.mergeCells)(cells)), shouldRenderExpandedRow && renderRowExpanded(rowData));\n  };\n\n  var renderTableHeader = function renderTableHeader(headerCells, rowWidth) {\n    var top = typeof affixHeader === 'number' ? affixHeader : 0;\n    var rowProps = {\n      'aria-rowindex': 1,\n      rowRef: tableHeaderRef,\n      width: rowWidth,\n      height: getRowHeight(),\n      headerHeight: headerHeight,\n      isHeaderRow: true,\n      top: 0\n    };\n    var fixedStyle = {\n      position: 'fixed',\n      overflow: 'hidden',\n      height: headerHeight,\n      width: tableWidth.current,\n      top: top\n    }; // Affix header\n\n    var header = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n      className: prefix('affix-header'),\n      style: fixedStyle,\n      ref: affixHeaderWrapperRef\n    }, renderRow(rowProps, headerCells));\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement((react__WEBPACK_IMPORTED_MODULE_2___default().Fragment), null, (affixHeader === 0 || affixHeader) && header, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n      role: \"rowgroup\",\n      className: prefix('header-row-wrapper'),\n      ref: headerWrapperRef\n    }, renderRow(rowProps, headerCells)));\n  };\n\n  var shouldRenderExpandedRow = (0,react__WEBPACK_IMPORTED_MODULE_2__.useCallback)(function (rowData) {\n    return lodash_isFunction__WEBPACK_IMPORTED_MODULE_5___default()(renderRowExpandedProp) && !isTree && expandedRowKeys.some(function (key) {\n      return key === rowData[rowKey];\n    });\n  }, [expandedRowKeys, isTree, renderRowExpandedProp, rowKey]);\n  var bindRowClick = (0,react__WEBPACK_IMPORTED_MODULE_2__.useCallback)(function (rowData) {\n    return function (event) {\n      onRowClick === null || onRowClick === void 0 ? void 0 : onRowClick(rowData, event);\n    };\n  }, [onRowClick]);\n  var bindRowContextMenu = (0,react__WEBPACK_IMPORTED_MODULE_2__.useCallback)(function (rowData) {\n    return function (event) {\n      onRowContextMenu === null || onRowContextMenu === void 0 ? void 0 : onRowContextMenu(rowData, event);\n    };\n  }, [onRowContextMenu]);\n  var handleTreeToggle = (0,react__WEBPACK_IMPORTED_MODULE_2__.useCallback)(function (treeRowKey, _rowIndex, rowData) {\n    var open = false;\n    var nextExpandedRowKeys = [];\n\n    for (var i = 0; i < expandedRowKeys.length; i++) {\n      var key = expandedRowKeys[i];\n\n      if (key === treeRowKey) {\n        open = true;\n      } else {\n        nextExpandedRowKeys.push(key);\n      }\n    }\n\n    if (!open) {\n      nextExpandedRowKeys.push(treeRowKey);\n    }\n\n    setExpandedRowKeys(nextExpandedRowKeys);\n    onExpandChange === null || onExpandChange === void 0 ? void 0 : onExpandChange(!open, rowData);\n  }, [expandedRowKeys, onExpandChange, setExpandedRowKeys]);\n\n  var renderRowData = function renderRowData(bodyCells, rowData, props, shouldRenderExpandedRow) {\n    var hasChildren = isTree && rowData.children && Array.isArray(rowData.children);\n    var nextRowKey = typeof rowData[rowKey] !== 'undefined' ? rowData[rowKey] : props.key;\n\n    var rowProps = (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__.default)({}, props, {\n      key: nextRowKey,\n      'aria-rowindex': props.key + 2,\n      rowRef: bindTableRowsRef(props.key, rowData),\n      onClick: bindRowClick(rowData),\n      onContextMenu: bindRowContextMenu(rowData)\n    });\n\n    var expanded = expandedRowKeys.some(function (key) {\n      return key === rowData[rowKey];\n    });\n    var cells = [];\n\n    for (var i = 0; i < bodyCells.length; i++) {\n      var _cell$props2, _cell$props2$rowSpan;\n\n      var cell = bodyCells[i];\n      var rowSpan = (_cell$props2 = cell.props) === null || _cell$props2 === void 0 ? void 0 : (_cell$props2$rowSpan = _cell$props2.rowSpan) === null || _cell$props2$rowSpan === void 0 ? void 0 : _cell$props2$rowSpan.call(_cell$props2, rowData);\n\n      var _rowHeight = rowSpan ? rowSpan * props.height : props.height;\n\n      if (rowSpan) {\n        var _rowProps$style;\n\n        rowProps.rowSpan = rowSpan;\n        rowProps.style = {\n          /**\n           * In the case of multiple-column merged rows,\n           * the `zIndex` value of the previous row should be greater than the `zIndex` value of the following row.\n           * So `rowSpan` is used as the `zIndex` value.\n           */\n          zIndex: ((_rowProps$style = rowProps.style) === null || _rowProps$style === void 0 ? void 0 : _rowProps$style.zIndex) || rowSpan,\n          overflow: 'unset'\n        }; // TODO: Do not render those cells merged by `rowSpan`\n      }\n\n      cells.push( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().cloneElement(cell, {\n        hasChildren: hasChildren,\n        rowData: rowData,\n        wordWrap: wordWrap,\n        height: _rowHeight,\n        rowIndex: props.key,\n        depth: props.depth,\n        renderTreeToggle: renderTreeToggle,\n        onTreeToggle: handleTreeToggle,\n        rowKey: nextRowKey,\n        expanded: expanded,\n        rowSpan: rowSpan\n      }));\n    }\n\n    return renderRow(rowProps, cells, shouldRenderExpandedRow, rowData);\n  };\n\n  var renderScrollbar = function renderScrollbar() {\n    var height = getTableHeight();\n\n    if (disabledScroll) {\n      return null;\n    }\n\n    return [/*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_Scrollbar__WEBPACK_IMPORTED_MODULE_9__.default, {\n      key: \"scrollbar\",\n      tableId: id,\n      style: {\n        width: tableWidth.current\n      },\n      length: tableWidth.current,\n      onScroll: onScrollHorizontal,\n      scrollLength: contentWidth.current,\n      ref: scrollbarXRef\n    }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_Scrollbar__WEBPACK_IMPORTED_MODULE_9__.default, {\n      key: \"vertical-scrollbar\",\n      vertical: true,\n      tableId: id,\n      length: height - headerHeight,\n      scrollLength: contentHeight.current,\n      onScroll: onScrollVertical,\n      ref: scrollbarYRef\n    })];\n  };\n\n  var renderTableBody = function renderTableBody(bodyCells, rowWidth) {\n    var _visibleRows$current;\n\n    var height = getTableHeight();\n    var bodyHeight = height - headerHeight;\n    var bodyStyles = {\n      top: headerHeight,\n      height: bodyHeight\n    };\n    var contentHeight = 0;\n    var topHideHeight = 0;\n    var bottomHideHeight = 0;\n    visibleRows.current = [];\n\n    if (data) {\n      var top = 0; // Row position\n\n      var minTop = Math.abs(scrollY.current);\n      var maxTop = minTop + height + rowExpandedHeight;\n      var isCustomRowHeight = typeof rowHeight === 'function';\n      var isUncertainHeight = !!renderRowExpandedProp || isCustomRowHeight || wordWrap; // If virtualized is enabled and the row height in the Table is variable,\n      // you need to loop through the data to get the height of each row.\n\n      if (isUncertainHeight && virtualized || !virtualized) {\n        // Avoid white screens on the top and bottom of the table when touching and scrolling on the mobile terminal.\n        // So supplement the display data row.\n        if ((0,_utils__WEBPACK_IMPORTED_MODULE_15__.isSupportTouchEvent)()) {\n          var coveredHeight = height * 3;\n          minTop = Math.max(minTop - coveredHeight, 0);\n          maxTop = maxTop + coveredHeight;\n        }\n\n        for (var index = 0; index < data.length; index++) {\n          var _rowData = data[index];\n          var maxHeight = tableRowsMaxHeight[index];\n          var shouldRender = shouldRenderExpandedRow(_rowData);\n          var nextRowHeight = 0;\n\n          if (typeof rowHeight === 'function') {\n            nextRowHeight = rowHeight(_rowData);\n          } else {\n            nextRowHeight = maxHeight ? Math.max(maxHeight + _constants__WEBPACK_IMPORTED_MODULE_14__.CELL_PADDING_HEIGHT, rowHeight) : rowHeight;\n\n            if (shouldRender) {\n              nextRowHeight += rowExpandedHeight;\n            }\n          }\n\n          contentHeight += nextRowHeight;\n          var rowProps = {\n            key: index,\n            top: top,\n            width: rowWidth,\n            depth: _rowData[_constants__WEBPACK_IMPORTED_MODULE_14__.TREE_DEPTH],\n            height: nextRowHeight\n          };\n          top += nextRowHeight;\n\n          if (virtualized && !wordWrap) {\n            if (top + nextRowHeight < minTop) {\n              topHideHeight += nextRowHeight;\n              continue;\n            } else if (top > maxTop) {\n              bottomHideHeight += nextRowHeight;\n              continue;\n            }\n          }\n\n          visibleRows.current.push(renderRowData(bodyCells, _rowData, rowProps, shouldRender));\n        }\n      } else {\n        /** virtualized */\n        // If the row height of the Table is fixed, it is directly calculated by the row height and the number of rows,\n        // thereby reducing the performance cost of traversing all data.\n        var _nextRowHeight = getRowHeight();\n\n        var startIndex = Math.max(Math.floor(minTop / _nextRowHeight), 0);\n        var endIndex = Math.min(startIndex + Math.ceil(bodyHeight / _nextRowHeight) + 5, data.length); // Avoid white screens on the top and bottom of the table when touching and scrolling on the mobile terminal.\n        // So supplement the display data row.\n\n        if ((0,_utils__WEBPACK_IMPORTED_MODULE_15__.isSupportTouchEvent)()) {\n          var coveredCount = Math.floor(height / _nextRowHeight * 3);\n          startIndex = Math.max(startIndex - coveredCount, 0);\n          endIndex = Math.min(endIndex + coveredCount, data.length);\n        }\n\n        contentHeight = data.length * _nextRowHeight;\n        topHideHeight = startIndex * _nextRowHeight;\n        bottomHideHeight = (data.length - endIndex) * _nextRowHeight;\n\n        for (var _index = startIndex; _index < endIndex; _index++) {\n          var _rowData2 = data[_index];\n          var _rowProps = {\n            key: _index,\n            depth: _rowData2[_constants__WEBPACK_IMPORTED_MODULE_14__.TREE_DEPTH],\n            top: _index * _nextRowHeight,\n            width: rowWidth,\n            height: _nextRowHeight\n          };\n          visibleRows.current.push(renderRowData(bodyCells, _rowData2, _rowProps, false));\n        }\n      }\n    }\n\n    var wheelStyles = {\n      position: 'absolute',\n      height: contentHeight,\n      minHeight: height,\n      pointerEvents: isScrolling ? 'none' : undefined\n    };\n    var topRowStyles = {\n      height: topHideHeight\n    };\n    var bottomRowStyles = {\n      height: bottomHideHeight\n    };\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n      ref: tableBodyRef,\n      role: \"rowgroup\",\n      className: prefix('body-row-wrapper'),\n      style: bodyStyles,\n      onScroll: onScrollBody\n    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n      style: wheelStyles,\n      className: prefix('body-wheel-area'),\n      ref: wheelWrapperRef\n    }, topHideHeight ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_Row__WEBPACK_IMPORTED_MODULE_7__.default, {\n      style: topRowStyles,\n      className: \"virtualized\"\n    }) : null, visibleRows.current, bottomHideHeight ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_Row__WEBPACK_IMPORTED_MODULE_7__.default, {\n      style: bottomRowStyles,\n      className: \"virtualized\"\n    }) : null), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_EmptyMessage__WEBPACK_IMPORTED_MODULE_12__.default, {\n      locale: locale,\n      renderEmpty: renderEmpty,\n      addPrefix: prefix,\n      loading: !!((_visibleRows$current = visibleRows.current) !== null && _visibleRows$current !== void 0 && _visibleRows$current.length) || loading\n    }), renderScrollbar(), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_Loader__WEBPACK_IMPORTED_MODULE_11__.default, {\n      locale: locale,\n      loadAnimation: loadAnimation,\n      loading: loading,\n      addPrefix: prefix,\n      renderLoading: renderLoading\n    }));\n  };\n\n  var contextValue = react__WEBPACK_IMPORTED_MODULE_2___default().useMemo(function () {\n    return {\n      classPrefix: withClassPrefix(),\n      translateDOMPositionXY: translateDOMPositionXY.current,\n      rtl: rtl,\n      isTree: isTree,\n      hasCustomTreeCol: hasCustomTreeCol\n    };\n  }, [hasCustomTreeCol, isTree, rtl, withClassPrefix]);\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_TableContext__WEBPACK_IMPORTED_MODULE_13__.default.Provider, {\n    value: contextValue\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__.default)({\n    role: isTree ? 'treegrid' : 'grid' // The aria-rowcount is specified on the element with the table.\n    // Its value is an integer equal to the total number of rows available, including header rows.\n    ,\n    \"aria-rowcount\": data.length + 1,\n    \"aria-colcount\": colCounts.current,\n    \"aria-busy\": loading\n  }, rest, {\n    className: classes,\n    style: styles,\n    ref: tableRef\n  }), showHeader && renderTableHeader(headerCells, rowWidth), children && renderTableBody(bodyCells, rowWidth), showHeader && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_MouseArea__WEBPACK_IMPORTED_MODULE_10__.default, {\n    ref: mouseAreaRef,\n    addPrefix: prefix,\n    headerHeight: headerHeight,\n    height: getTableHeight()\n  })));\n});\nTable.displayName = 'Table';\nTable.defaultProps = {\n  data: [],\n  defaultSortType: _constants__WEBPACK_IMPORTED_MODULE_14__.SORT_TYPE.DESC,\n  height: 200,\n  rowHeight: 46,\n  headerHeight: 40,\n  minHeight: 0,\n  rowExpandedHeight: 100,\n  hover: true,\n  showHeader: true,\n  translate3d: true,\n  shouldUpdateScroll: true,\n  locale: {\n    emptyMessage: 'No data found',\n    loading: 'Loading...'\n  }\n};\nTable.propTypes = {\n  autoHeight: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  affixHeader: prop_types__WEBPACK_IMPORTED_MODULE_4___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool), (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number)]),\n  affixHorizontalScrollbar: prop_types__WEBPACK_IMPORTED_MODULE_4___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool), (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number)]),\n  bordered: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  className: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().string),\n  classPrefix: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().string),\n  children: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().any),\n  cellBordered: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  data: prop_types__WEBPACK_IMPORTED_MODULE_4___default().arrayOf((prop_types__WEBPACK_IMPORTED_MODULE_4___default().object)),\n  defaultExpandAllRows: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  defaultExpandedRowKeys: prop_types__WEBPACK_IMPORTED_MODULE_4___default().arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_4___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_4___default().string), (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number)])),\n  defaultSortType: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().any),\n  disabledScroll: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  expandedRowKeys: prop_types__WEBPACK_IMPORTED_MODULE_4___default().arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_4___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_4___default().string), (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number)])),\n  hover: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  height: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number),\n  headerHeight: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number),\n  locale: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().object),\n  loading: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  loadAnimation: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  minHeight: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number),\n  rowKey: prop_types__WEBPACK_IMPORTED_MODULE_4___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_4___default().string), (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number)]),\n  rowHeight: prop_types__WEBPACK_IMPORTED_MODULE_4___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_4___default().number), (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func)]),\n  renderTreeToggle: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  renderRowExpanded: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  rowExpandedHeight: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number),\n  renderEmpty: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  renderLoading: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  rowClassName: prop_types__WEBPACK_IMPORTED_MODULE_4___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_4___default().func), (prop_types__WEBPACK_IMPORTED_MODULE_4___default().string)]),\n  rtl: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  style: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().object),\n  sortColumn: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().string),\n  sortType: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().any),\n  showHeader: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  shouldUpdateScroll: prop_types__WEBPACK_IMPORTED_MODULE_4___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_4___default().func), (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool)]),\n  translate3d: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  wordWrap: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  width: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number),\n  virtualized: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  isTree: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  onRowClick: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  onRowContextMenu: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  onScroll: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  onSortColumn: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  onExpandChange: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  onTouchStart: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  onTouchMove: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  onTouchEnd: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func)\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (Table);\n\n//# sourceURL=webpack://rsuite/./node_modules/rsuite-table/es/Table.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/extends */ \"./node_modules/@babel/runtime/helpers/esm/extends.js\");\n/* harmony import */ var _babel_runtime_helpers_esm_objectWithoutPropertiesLoose__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var dom_lib_translateDOMPositionXY__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! dom-lib/translateDOMPositionXY */ \"./node_modules/dom-lib/esm/translateDOMPositionXY.js\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var lodash_isFunction__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\");\n/* harmony import */ var lodash_isFunction__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(lodash_isFunction__WEBPACK_IMPORTED_MODULE_5__);\n/* harmony import */ var lodash_flatten__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! lodash/flatten */ \"./node_modules/lodash/flatten.js\");\n/* harmony import */ var lodash_flatten__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(lodash_flatten__WEBPACK_IMPORTED_MODULE_6__);\n/* harmony import */ var _Row__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Row */ \"./node_modules/rsuite-table/es/Row.js\");\n/* harmony import */ var _CellGroup__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./CellGroup */ \"./node_modules/rsuite-table/es/CellGroup.js\");\n/* harmony import */ var _Scrollbar__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./Scrollbar */ \"./node_modules/rsuite-table/es/Scrollbar.js\");\n/* harmony import */ var _MouseArea__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./MouseArea */ \"./node_modules/rsuite-table/es/MouseArea.js\");\n/* harmony import */ var _Loader__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./Loader */ \"./node_modules/rsuite-table/es/Loader.js\");\n/* harmony import */ var _EmptyMessage__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./EmptyMessage */ \"./node_modules/rsuite-table/es/EmptyMessage.js\");\n/* harmony import */ var _TableContext__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./TableContext */ \"./node_modules/rsuite-table/es/TableContext.js\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./constants */ \"./node_modules/rsuite-table/es/constants.js\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./utils */ \"./node_modules/rsuite-table/es/utils/index.js\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n/**\n * Filter those expanded nodes.\n * @param data\n * @param expandedRowKeys\n * @param rowKey\n * @returns\n */\nvar filterTreeData = function filterTreeData(data, expandedRowKeys, rowKey) {\n  return (0,_utils__WEBPACK_IMPORTED_MODULE_15__.flattenData)(data).filter(function (rowData) {\n    var parents = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.findAllParents)(rowData, rowKey);\n    var expanded = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.shouldShowRowByExpanded)(expandedRowKeys, parents);\n    rowData[_constants__WEBPACK_IMPORTED_MODULE_14__.EXPANDED_KEY] = expanded;\n    rowData[_constants__WEBPACK_IMPORTED_MODULE_14__.TREE_DEPTH] = parents.length;\n    return expanded;\n  });\n};\n\nvar Table = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().forwardRef(function (props, ref) {\n  var affixHeader = props.affixHeader,\n      children = props.children,\n      classPrefix = props.classPrefix,\n      className = props.className,\n      dataProp = props.data,\n      widthProp = props.width,\n      expandedRowKeysProp = props.expandedRowKeys,\n      defaultExpandAllRows = props.defaultExpandAllRows,\n      defaultExpandedRowKeys = props.defaultExpandedRowKeys,\n      style = props.style,\n      id = props.id,\n      isTree = props.isTree,\n      hover = props.hover,\n      bordered = props.bordered,\n      cellBordered = props.cellBordered,\n      wordWrap = props.wordWrap,\n      loading = props.loading,\n      locale = props.locale,\n      showHeader = props.showHeader,\n      sortColumn = props.sortColumn,\n      rowHeightProp = props.rowHeight,\n      sortTypeProp = props.sortType,\n      defaultSortType = props.defaultSortType,\n      headerHeightProp = props.headerHeight,\n      minHeight = props.minHeight,\n      height = props.height,\n      autoHeight = props.autoHeight,\n      rtlProp = props.rtl,\n      translate3d = props.translate3d,\n      rowKey = props.rowKey,\n      virtualized = props.virtualized,\n      rowHeight = props.rowHeight,\n      rowClassName = props.rowClassName,\n      rowExpandedHeight = props.rowExpandedHeight,\n      disabledScroll = props.disabledScroll,\n      affixHorizontalScrollbar = props.affixHorizontalScrollbar,\n      loadAnimation = props.loadAnimation,\n      shouldUpdateScroll = props.shouldUpdateScroll,\n      renderRowProp = props.renderRow,\n      renderRowExpandedProp = props.renderRowExpanded,\n      renderLoading = props.renderLoading,\n      renderEmpty = props.renderEmpty,\n      onSortColumn = props.onSortColumn,\n      onScroll = props.onScroll,\n      renderTreeToggle = props.renderTreeToggle,\n      onRowClick = props.onRowClick,\n      onRowContextMenu = props.onRowContextMenu,\n      onExpandChange = props.onExpandChange,\n      onTouchStart = props.onTouchStart,\n      onTouchMove = props.onTouchMove,\n      onTouchEnd = props.onTouchEnd,\n      rest = (0,_babel_runtime_helpers_esm_objectWithoutPropertiesLoose__WEBPACK_IMPORTED_MODULE_1__.default)(props, [\"affixHeader\", \"children\", \"classPrefix\", \"className\", \"data\", \"width\", \"expandedRowKeys\", \"defaultExpandAllRows\", \"defaultExpandedRowKeys\", \"style\", \"id\", \"isTree\", \"hover\", \"bordered\", \"cellBordered\", \"wordWrap\", \"loading\", \"locale\", \"showHeader\", \"sortColumn\", \"rowHeight\", \"sortType\", \"defaultSortType\", \"headerHeight\", \"minHeight\", \"height\", \"autoHeight\", \"rtl\", \"translate3d\", \"rowKey\", \"virtualized\", \"rowHeight\", \"rowClassName\", \"rowExpandedHeight\", \"disabledScroll\", \"affixHorizontalScrollbar\", \"loadAnimation\", \"shouldUpdateScroll\", \"renderRow\", \"renderRowExpanded\", \"renderLoading\", \"renderEmpty\", \"onSortColumn\", \"onScroll\", \"renderTreeToggle\", \"onRowClick\", \"onRowContextMenu\", \"onExpandChange\", \"onTouchStart\", \"onTouchMove\", \"onTouchEnd\"]);\n\n  if (isTree && !rowKey) {\n    throw new Error('The `rowKey` is required when set isTree');\n  }\n\n  var _useClassNames = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useClassNames)(classPrefix || 'table', typeof classPrefix !== 'undefined'),\n      withClassPrefix = _useClassNames.withClassPrefix,\n      mergeCls = _useClassNames.merge,\n      prefix = _useClassNames.prefix; // Use `forceUpdate` to force the component to re-render after manipulating the DOM.\n\n\n  var _useReducer = (0,react__WEBPACK_IMPORTED_MODULE_2__.useReducer)(function (x) {\n    return x + 1;\n  }, 0),\n      forceUpdate = _useReducer[1];\n\n  var _useControlled = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useControlled)(expandedRowKeysProp, defaultExpandAllRows ? (0,_utils__WEBPACK_IMPORTED_MODULE_15__.findRowKeys)(dataProp, rowKey, lodash_isFunction__WEBPACK_IMPORTED_MODULE_5___default()(renderRowExpandedProp)) : defaultExpandedRowKeys || []),\n      expandedRowKeys = _useControlled[0],\n      setExpandedRowKeys = _useControlled[1];\n\n  var _useState = (0,react__WEBPACK_IMPORTED_MODULE_2__.useState)(function () {\n    return isTree ? filterTreeData(dataProp, expandedRowKeys, rowKey) : dataProp;\n  }),\n      data = _useState[0],\n      setData = _useState[1];\n\n  var _useTableRows = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useTableRows)({\n    data: dataProp,\n    expandedRowKeys: expandedRowKeys,\n    wordWrap: wordWrap,\n    prefix: prefix\n  }),\n      tableRowsMaxHeight = _useTableRows.tableRowsMaxHeight,\n      bindTableRowsRef = _useTableRows.bindTableRowsRef;\n\n  var headerHeight = showHeader ? headerHeightProp : 0;\n  var rtl = rtlProp || (0,_utils__WEBPACK_IMPORTED_MODULE_15__.isRTL)();\n\n  var getRowHeight = function getRowHeight(rowData) {\n    if (rowData === void 0) {\n      rowData = {};\n    }\n\n    return typeof rowHeightProp === 'function' ? rowHeightProp(rowData) : rowHeightProp;\n  };\n\n  var translateDOMPositionXY = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)((0,dom_lib_translateDOMPositionXY__WEBPACK_IMPORTED_MODULE_3__.getTranslateDOMPositionXY)({\n    enable3DTransform: translate3d\n  }));\n  var shouldFixedColumn = Array.from(lodash_flatten__WEBPACK_IMPORTED_MODULE_6___default()(children)).some(function (child) {\n    var _child$props;\n\n    return child === null || child === void 0 ? void 0 : (_child$props = child.props) === null || _child$props === void 0 ? void 0 : _child$props.fixed;\n  });\n  var visibleRows = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)([]);\n  var mouseAreaRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  var tableRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  var tableHeaderRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  var affixHeaderWrapperRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  var headerWrapperRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  var tableBodyRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  var wheelWrapperRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  var scrollbarXRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  var scrollbarYRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)();\n  /**\n   * Reset the position of the scroll bar after the table size changes.\n   */\n\n  var resetScrollbar = function resetScrollbar(event) {\n    forceUpdate();\n\n    if (typeof shouldUpdateScroll === 'function') {\n      onScrollTo(shouldUpdateScroll(event));\n    } else if (shouldUpdateScroll) {\n      var vertical = event === 'bodyHeightChanged';\n      vertical ? onScrollTop(0) : onScrollLeft(0);\n    }\n  };\n\n  var _useTableDimension = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useTableDimension)({\n    data: dataProp,\n    width: widthProp,\n    rowHeight: rowHeight,\n    tableRef: tableRef,\n    headerWrapperRef: headerWrapperRef,\n    prefix: prefix,\n    affixHeader: affixHeader,\n    affixHorizontalScrollbar: affixHorizontalScrollbar,\n    headerHeight: headerHeight,\n    height: height,\n    autoHeight: autoHeight,\n    children: children,\n    expandedRowKeys: expandedRowKeys,\n    onTableScroll: function onTableScroll(coords) {\n      onScrollTo(coords);\n    },\n    onTableContentHeightChange: function onTableContentHeightChange() {\n      resetScrollbar('bodyHeightChanged');\n    },\n    onTableContentWidthChange: function onTableContentWidthChange() {\n      resetScrollbar('bodyWidthChanged');\n    },\n    onTableWidthChange: function onTableWidthChange() {\n      resetScrollbar('widthChanged');\n    }\n  }),\n      contentHeight = _useTableDimension.contentHeight,\n      contentWidth = _useTableDimension.contentWidth,\n      minScrollY = _useTableDimension.minScrollY,\n      minScrollX = _useTableDimension.minScrollX,\n      scrollY = _useTableDimension.scrollY,\n      scrollX = _useTableDimension.scrollX,\n      tableWidth = _useTableDimension.tableWidth,\n      tableOffset = _useTableDimension.tableOffset,\n      headerOffset = _useTableDimension.headerOffset,\n      setScrollY = _useTableDimension.setScrollY,\n      setScrollX = _useTableDimension.setScrollX;\n\n  var getTableHeight = (0,react__WEBPACK_IMPORTED_MODULE_2__.useCallback)(function () {\n    if (data.length === 0 && autoHeight) {\n      return height;\n    }\n\n    return autoHeight ? Math.max(headerHeight + contentHeight.current, minHeight) : height;\n  }, [autoHeight, contentHeight, data.length, headerHeight, height, minHeight]);\n  (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useAffix)({\n    tableHeight: getTableHeight,\n    contentHeight: contentHeight,\n    affixHorizontalScrollbar: affixHorizontalScrollbar,\n    affixHeader: affixHeader,\n    tableOffset: tableOffset,\n    headerOffset: headerOffset,\n    headerHeight: headerHeight,\n    scrollbarXRef: scrollbarXRef,\n    affixHeaderWrapperRef: affixHeaderWrapperRef\n  });\n\n  var _usePosition = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.usePosition)({\n    data: dataProp,\n    height: height,\n    tableWidth: tableWidth,\n    tableRef: tableRef,\n    prefix: prefix,\n    translateDOMPositionXY: translateDOMPositionXY,\n    wheelWrapperRef: wheelWrapperRef,\n    headerWrapperRef: headerWrapperRef,\n    affixHeaderWrapperRef: affixHeaderWrapperRef,\n    tableHeaderRef: tableHeaderRef,\n    scrollX: scrollX,\n    scrollY: scrollY,\n    contentWidth: contentWidth,\n    shouldFixedColumn: shouldFixedColumn\n  }),\n      forceUpdatePosition = _usePosition.forceUpdatePosition;\n\n  var _useScrollListener = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useScrollListener)({\n    rtl: rtl,\n    data: dataProp,\n    height: height,\n    virtualized: virtualized,\n    getTableHeight: getTableHeight,\n    contentHeight: contentHeight,\n    headerHeight: headerHeight,\n    autoHeight: autoHeight,\n    tableBodyRef: tableBodyRef,\n    scrollbarXRef: scrollbarXRef,\n    scrollbarYRef: scrollbarYRef,\n    disabledScroll: disabledScroll,\n    loading: loading,\n    tableRef: tableRef,\n    contentWidth: contentWidth,\n    tableWidth: tableWidth,\n    scrollY: scrollY,\n    minScrollY: minScrollY,\n    minScrollX: minScrollX,\n    scrollX: scrollX,\n    setScrollX: setScrollX,\n    setScrollY: setScrollY,\n    forceUpdatePosition: forceUpdatePosition,\n    onScroll: onScroll,\n    onTouchStart: onTouchStart,\n    onTouchMove: onTouchMove,\n    onTouchEnd: onTouchEnd\n  }),\n      isScrolling = _useScrollListener.isScrolling,\n      onScrollHorizontal = _useScrollListener.onScrollHorizontal,\n      onScrollVertical = _useScrollListener.onScrollVertical,\n      onScrollBody = _useScrollListener.onScrollBody,\n      onScrollTop = _useScrollListener.onScrollTop,\n      onScrollLeft = _useScrollListener.onScrollLeft,\n      onScrollTo = _useScrollListener.onScrollTo;\n\n  var _useCellDescriptor = (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useCellDescriptor)({\n    children: children,\n    rtl: rtl,\n    mouseAreaRef: mouseAreaRef,\n    tableRef: tableRef,\n    minScrollX: minScrollX,\n    scrollX: scrollX,\n    tableWidth: tableWidth,\n    headerHeight: headerHeight,\n    showHeader: showHeader,\n    sortType: sortTypeProp,\n    defaultSortType: defaultSortType,\n    sortColumn: sortColumn,\n    prefix: prefix,\n    onSortColumn: onSortColumn,\n    rowHeight: rowHeight\n  }),\n      headerCells = _useCellDescriptor.headerCells,\n      bodyCells = _useCellDescriptor.bodyCells,\n      allColumnsWidth = _useCellDescriptor.allColumnsWidth,\n      hasCustomTreeCol = _useCellDescriptor.hasCustomTreeCol;\n\n  var colCounts = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)((headerCells === null || headerCells === void 0 ? void 0 : headerCells.length) || 0);\n  (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useUpdateEffect)(function () {\n    setData(isTree ? filterTreeData(dataProp, expandedRowKeys, rowKey) : dataProp);\n  }, [dataProp, expandedRowKeys, rowKey, isTree]);\n  (0,_utils__WEBPACK_IMPORTED_MODULE_15__.useUpdateEffect)(function () {\n    if ((headerCells === null || headerCells === void 0 ? void 0 : headerCells.length) !== colCounts.current) {\n      onScrollLeft(0);\n      colCounts.current = (headerCells === null || headerCells === void 0 ? void 0 : headerCells.length) || 0;\n    }\n  }, [children]);\n  (0,react__WEBPACK_IMPORTED_MODULE_2__.useImperativeHandle)(ref, function () {\n    return {\n      get root() {\n        return tableRef.current;\n      },\n\n      get body() {\n        return wheelWrapperRef.current;\n      },\n\n      scrollTop: onScrollTop,\n      scrollLeft: onScrollLeft\n    };\n  });\n  var rowWidth = allColumnsWidth > tableWidth.current ? allColumnsWidth : tableWidth.current;\n  var classes = mergeCls(className, withClassPrefix({\n    bordered: bordered,\n    hover: hover,\n    loading: loading,\n    treetable: isTree,\n    'word-wrap': wordWrap,\n    'cell-bordered': cellBordered\n  }));\n\n  var styles = (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__.default)({\n    width: widthProp || 'auto',\n    height: getTableHeight()\n  }, style);\n\n  var renderRowExpanded = (0,react__WEBPACK_IMPORTED_MODULE_2__.useCallback)(function (rowData) {\n    var styles = {\n      height: rowExpandedHeight\n    };\n\n    if (typeof renderRowExpandedProp === 'function') {\n      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n        className: prefix('row-expanded'),\n        style: styles\n      }, renderRowExpandedProp(rowData));\n    }\n\n    return null;\n  }, [prefix, renderRowExpandedProp, rowExpandedHeight]);\n\n  var renderRow = function renderRow(props, cells, shouldRenderExpandedRow, rowData) {\n    var depth = props.depth,\n        restRowProps = (0,_babel_runtime_helpers_esm_objectWithoutPropertiesLoose__WEBPACK_IMPORTED_MODULE_1__.default)(props, [\"depth\"]);\n\n    if (typeof rowClassName === 'function') {\n      restRowProps.className = rowClassName(rowData);\n    } else {\n      restRowProps.className = rowClassName;\n    }\n\n    var rowStyles = (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__.default)({}, props === null || props === void 0 ? void 0 : props.style);\n\n    var rowRight = 0;\n\n    if (rtl && contentWidth.current > tableWidth.current) {\n      rowRight = tableWidth.current - contentWidth.current;\n      rowStyles.right = rowRight;\n    }\n\n    var rowNode = null; // IF there are fixed columns, add a fixed group\n\n    if (shouldFixedColumn && contentWidth.current > tableWidth.current) {\n      var fixedLeftCells = [];\n      var fixedRightCells = [];\n      var scrollCells = [];\n      var fixedLeftCellGroupWidth = 0;\n      var fixedRightCellGroupWidth = 0;\n\n      for (var i = 0; i < cells.length; i++) {\n        var cell = cells[i];\n        var _cell$props = cell.props,\n            fixed = _cell$props.fixed,\n            width = _cell$props.width;\n        var isFixedStart = fixed === 'left' || fixed === true;\n        var isFixedEnd = fixed === 'right';\n\n        if (rtl) {\n          isFixedStart = fixed === 'right';\n          isFixedEnd = fixed === 'left' || fixed === true;\n        }\n\n        if (isFixedStart) {\n          fixedLeftCells.push(cell);\n          fixedLeftCellGroupWidth += width;\n        } else if (isFixedEnd) {\n          fixedRightCells.push(cell);\n          fixedRightCellGroupWidth += width;\n        } else {\n          scrollCells.push(cell);\n        }\n      }\n\n      rowNode = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement((react__WEBPACK_IMPORTED_MODULE_2___default().Fragment), null, fixedLeftCellGroupWidth ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_CellGroup__WEBPACK_IMPORTED_MODULE_8__.default, {\n        fixed: \"left\",\n        height: props.isHeaderRow ? props.headerHeight : props.height,\n        width: fixedLeftCellGroupWidth,\n        style: rtl ? {\n          right: tableWidth.current - fixedLeftCellGroupWidth - rowRight\n        } : null\n      }, (0,_utils__WEBPACK_IMPORTED_MODULE_15__.mergeCells)((0,_utils__WEBPACK_IMPORTED_MODULE_15__.resetLeftForCells)(fixedLeftCells))) : null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_CellGroup__WEBPACK_IMPORTED_MODULE_8__.default, null, (0,_utils__WEBPACK_IMPORTED_MODULE_15__.mergeCells)(scrollCells)), fixedRightCellGroupWidth ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_CellGroup__WEBPACK_IMPORTED_MODULE_8__.default, {\n        fixed: \"right\",\n        style: rtl ? {\n          right: 0 - rowRight\n        } : {\n          left: tableWidth.current - fixedRightCellGroupWidth - _constants__WEBPACK_IMPORTED_MODULE_14__.SCROLLBAR_WIDTH\n        },\n        height: props.isHeaderRow ? props.headerHeight : props.height,\n        width: fixedRightCellGroupWidth + _constants__WEBPACK_IMPORTED_MODULE_14__.SCROLLBAR_WIDTH\n      }, (0,_utils__WEBPACK_IMPORTED_MODULE_15__.mergeCells)((0,_utils__WEBPACK_IMPORTED_MODULE_15__.resetLeftForCells)(fixedRightCells, _constants__WEBPACK_IMPORTED_MODULE_14__.SCROLLBAR_WIDTH))) : null, shouldRenderExpandedRow && renderRowExpanded(rowData));\n    } else {\n      rowNode = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement((react__WEBPACK_IMPORTED_MODULE_2___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_CellGroup__WEBPACK_IMPORTED_MODULE_8__.default, null, (0,_utils__WEBPACK_IMPORTED_MODULE_15__.mergeCells)(cells)), shouldRenderExpandedRow && renderRowExpanded(rowData));\n    }\n\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_Row__WEBPACK_IMPORTED_MODULE_7__.default, (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__.default)({}, restRowProps, {\n      \"data-depth\": depth,\n      style: rowStyles\n    }), renderRowProp ? renderRowProp(rowNode, rowData) : rowNode);\n  };\n\n  var renderTableHeader = function renderTableHeader(headerCells, rowWidth) {\n    var top = typeof affixHeader === 'number' ? affixHeader : 0;\n    var rowProps = {\n      'aria-rowindex': 1,\n      rowRef: tableHeaderRef,\n      width: rowWidth,\n      height: getRowHeight(),\n      headerHeight: headerHeight,\n      isHeaderRow: true,\n      top: 0\n    };\n    var fixedStyle = {\n      position: 'fixed',\n      overflow: 'hidden',\n      height: headerHeight,\n      width: tableWidth.current,\n      top: top\n    }; // Affix header\n\n    var header = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n      className: prefix('affix-header'),\n      style: fixedStyle,\n      ref: affixHeaderWrapperRef\n    }, renderRow(rowProps, headerCells));\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement((react__WEBPACK_IMPORTED_MODULE_2___default().Fragment), null, (affixHeader === 0 || affixHeader) && header, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n      role: \"rowgroup\",\n      className: prefix('header-row-wrapper'),\n      ref: headerWrapperRef\n    }, renderRow(rowProps, headerCells)));\n  };\n\n  var shouldRenderExpandedRow = (0,react__WEBPACK_IMPORTED_MODULE_2__.useCallback)(function (rowData) {\n    return lodash_isFunction__WEBPACK_IMPORTED_MODULE_5___default()(renderRowExpandedProp) && !isTree && expandedRowKeys.some(function (key) {\n      return key === rowData[rowKey];\n    });\n  }, [expandedRowKeys, isTree, renderRowExpandedProp, rowKey]);\n  var bindRowClick = (0,react__WEBPACK_IMPORTED_MODULE_2__.useCallback)(function (rowData) {\n    return function (event) {\n      onRowClick === null || onRowClick === void 0 ? void 0 : onRowClick(rowData, event);\n    };\n  }, [onRowClick]);\n  var bindRowContextMenu = (0,react__WEBPACK_IMPORTED_MODULE_2__.useCallback)(function (rowData) {\n    return function (event) {\n      onRowContextMenu === null || onRowContextMenu === void 0 ? void 0 : onRowContextMenu(rowData, event);\n    };\n  }, [onRowContextMenu]);\n  var handleTreeToggle = (0,react__WEBPACK_IMPORTED_MODULE_2__.useCallback)(function (treeRowKey, _rowIndex, rowData) {\n    var open = false;\n    var nextExpandedRowKeys = [];\n\n    for (var i = 0; i < expandedRowKeys.length; i++) {\n      var key = expandedRowKeys[i];\n\n      if (key === treeRowKey) {\n        open = true;\n      } else {\n        nextExpandedRowKeys.push(key);\n      }\n    }\n\n    if (!open) {\n      nextExpandedRowKeys.push(treeRowKey);\n    }\n\n    setExpandedRowKeys(nextExpandedRowKeys);\n    onExpandChange === null || onExpandChange === void 0 ? void 0 : onExpandChange(!open, rowData);\n  }, [expandedRowKeys, onExpandChange, setExpandedRowKeys]);\n\n  var renderRowData = function renderRowData(bodyCells, rowData, props, shouldRenderExpandedRow) {\n    var hasChildren = isTree && rowData.children && Array.isArray(rowData.children);\n    var nextRowKey = typeof rowData[rowKey] !== 'undefined' ? rowData[rowKey] : props.key;\n\n    var rowProps = (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__.default)({}, props, {\n      key: nextRowKey,\n      'aria-rowindex': props.key + 2,\n      rowRef: bindTableRowsRef(props.key, rowData),\n      onClick: bindRowClick(rowData),\n      onContextMenu: bindRowContextMenu(rowData)\n    });\n\n    var expanded = expandedRowKeys.some(function (key) {\n      return key === rowData[rowKey];\n    });\n    var cells = [];\n\n    for (var i = 0; i < bodyCells.length; i++) {\n      var _cell$props2, _cell$props2$rowSpan;\n\n      var cell = bodyCells[i];\n      var rowSpan = (_cell$props2 = cell.props) === null || _cell$props2 === void 0 ? void 0 : (_cell$props2$rowSpan = _cell$props2.rowSpan) === null || _cell$props2$rowSpan === void 0 ? void 0 : _cell$props2$rowSpan.call(_cell$props2, rowData);\n\n      var _rowHeight = rowSpan ? rowSpan * props.height : props.height;\n\n      if (rowSpan) {\n        var _rowProps$style;\n\n        rowProps.rowSpan = rowSpan;\n        rowProps.style = {\n          /**\n           * In the case of multiple-column merged rows,\n           * the `zIndex` value of the previous row should be greater than the `zIndex` value of the following row.\n           * So `rowSpan` is used as the `zIndex` value.\n           */\n          zIndex: ((_rowProps$style = rowProps.style) === null || _rowProps$style === void 0 ? void 0 : _rowProps$style.zIndex) || rowSpan,\n          overflow: 'unset'\n        }; // TODO: Do not render those cells merged by `rowSpan`\n      }\n\n      cells.push( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().cloneElement(cell, {\n        hasChildren: hasChildren,\n        rowData: rowData,\n        wordWrap: wordWrap,\n        height: _rowHeight,\n        rowIndex: props.key,\n        depth: props.depth,\n        renderTreeToggle: renderTreeToggle,\n        onTreeToggle: handleTreeToggle,\n        rowKey: nextRowKey,\n        expanded: expanded,\n        rowSpan: rowSpan\n      }));\n    }\n\n    return renderRow(rowProps, cells, shouldRenderExpandedRow, rowData);\n  };\n\n  var renderScrollbar = function renderScrollbar() {\n    var height = getTableHeight();\n\n    if (disabledScroll) {\n      return null;\n    }\n\n    return [/*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_Scrollbar__WEBPACK_IMPORTED_MODULE_9__.default, {\n      key: \"scrollbar\",\n      tableId: id,\n      style: {\n        width: tableWidth.current\n      },\n      length: tableWidth.current,\n      onScroll: onScrollHorizontal,\n      scrollLength: contentWidth.current,\n      ref: scrollbarXRef\n    }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_Scrollbar__WEBPACK_IMPORTED_MODULE_9__.default, {\n      key: \"vertical-scrollbar\",\n      vertical: true,\n      tableId: id,\n      length: height - headerHeight,\n      scrollLength: contentHeight.current,\n      onScroll: onScrollVertical,\n      ref: scrollbarYRef\n    })];\n  };\n\n  var renderTableBody = function renderTableBody(bodyCells, rowWidth) {\n    var _visibleRows$current;\n\n    var height = getTableHeight();\n    var bodyHeight = height - headerHeight;\n    var bodyStyles = {\n      top: headerHeight,\n      height: bodyHeight\n    };\n    var contentHeight = 0;\n    var topHideHeight = 0;\n    var bottomHideHeight = 0;\n    visibleRows.current = [];\n\n    if (data) {\n      var top = 0; // Row position\n\n      var minTop = Math.abs(scrollY.current);\n      var maxTop = minTop + height + rowExpandedHeight;\n      var isCustomRowHeight = typeof rowHeight === 'function';\n      var isUncertainHeight = !!renderRowExpandedProp || isCustomRowHeight || wordWrap; // If virtualized is enabled and the row height in the Table is variable,\n      // you need to loop through the data to get the height of each row.\n\n      if (isUncertainHeight && virtualized || !virtualized) {\n        // Avoid white screens on the top and bottom of the table when touching and scrolling on the mobile terminal.\n        // So supplement the display data row.\n        if ((0,_utils__WEBPACK_IMPORTED_MODULE_15__.isSupportTouchEvent)()) {\n          var coveredHeight = height * 3;\n          minTop = Math.max(minTop - coveredHeight, 0);\n          maxTop = maxTop + coveredHeight;\n        }\n\n        for (var index = 0; index < data.length; index++) {\n          var _rowData = data[index];\n          var maxHeight = tableRowsMaxHeight[index];\n          var shouldRender = shouldRenderExpandedRow(_rowData);\n          var nextRowHeight = 0;\n\n          if (typeof rowHeight === 'function') {\n            nextRowHeight = rowHeight(_rowData);\n          } else {\n            nextRowHeight = maxHeight ? Math.max(maxHeight + _constants__WEBPACK_IMPORTED_MODULE_14__.CELL_PADDING_HEIGHT, rowHeight) : rowHeight;\n\n            if (shouldRender) {\n              nextRowHeight += rowExpandedHeight;\n            }\n          }\n\n          contentHeight += nextRowHeight;\n          var rowProps = {\n            key: index,\n            top: top,\n            width: rowWidth,\n            depth: _rowData[_constants__WEBPACK_IMPORTED_MODULE_14__.TREE_DEPTH],\n            height: nextRowHeight\n          };\n          top += nextRowHeight;\n\n          if (virtualized && !wordWrap) {\n            if (top + nextRowHeight < minTop) {\n              topHideHeight += nextRowHeight;\n              continue;\n            } else if (top > maxTop) {\n              bottomHideHeight += nextRowHeight;\n              continue;\n            }\n          }\n\n          visibleRows.current.push(renderRowData(bodyCells, _rowData, rowProps, shouldRender));\n        }\n      } else {\n        /** virtualized */\n        // If the row height of the Table is fixed, it is directly calculated by the row height and the number of rows,\n        // thereby reducing the performance cost of traversing all data.\n        var _nextRowHeight = getRowHeight();\n\n        var startIndex = Math.max(Math.floor(minTop / _nextRowHeight), 0);\n        var endIndex = Math.min(startIndex + Math.ceil(bodyHeight / _nextRowHeight) + 5, data.length); // Avoid white screens on the top and bottom of the table when touching and scrolling on the mobile terminal.\n        // So supplement the display data row.\n\n        if ((0,_utils__WEBPACK_IMPORTED_MODULE_15__.isSupportTouchEvent)()) {\n          var coveredCount = Math.floor(height / _nextRowHeight * 3);\n          startIndex = Math.max(startIndex - coveredCount, 0);\n          endIndex = Math.min(endIndex + coveredCount, data.length);\n        }\n\n        contentHeight = data.length * _nextRowHeight;\n        topHideHeight = startIndex * _nextRowHeight;\n        bottomHideHeight = (data.length - endIndex) * _nextRowHeight;\n\n        for (var _index = startIndex; _index < endIndex; _index++) {\n          var _rowData2 = data[_index];\n          var _rowProps = {\n            key: _index,\n            depth: _rowData2[_constants__WEBPACK_IMPORTED_MODULE_14__.TREE_DEPTH],\n            top: _index * _nextRowHeight,\n            width: rowWidth,\n            height: _nextRowHeight\n          };\n          visibleRows.current.push(renderRowData(bodyCells, _rowData2, _rowProps, false));\n        }\n      }\n    }\n\n    var wheelStyles = {\n      position: 'absolute',\n      height: contentHeight,\n      minHeight: height,\n      pointerEvents: isScrolling ? 'none' : undefined\n    };\n    var topRowStyles = {\n      height: topHideHeight\n    };\n    var bottomRowStyles = {\n      height: bottomHideHeight\n    };\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n      ref: tableBodyRef,\n      role: \"rowgroup\",\n      className: prefix('body-row-wrapper'),\n      style: bodyStyles,\n      onScroll: onScrollBody\n    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n      style: wheelStyles,\n      className: prefix('body-wheel-area'),\n      ref: wheelWrapperRef\n    }, topHideHeight ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_Row__WEBPACK_IMPORTED_MODULE_7__.default, {\n      style: topRowStyles,\n      className: \"virtualized\"\n    }) : null, visibleRows.current, bottomHideHeight ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_Row__WEBPACK_IMPORTED_MODULE_7__.default, {\n      style: bottomRowStyles,\n      className: \"virtualized\"\n    }) : null), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_EmptyMessage__WEBPACK_IMPORTED_MODULE_12__.default, {\n      locale: locale,\n      renderEmpty: renderEmpty,\n      addPrefix: prefix,\n      loading: !!((_visibleRows$current = visibleRows.current) !== null && _visibleRows$current !== void 0 && _visibleRows$current.length) || loading\n    }), renderScrollbar(), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_Loader__WEBPACK_IMPORTED_MODULE_11__.default, {\n      locale: locale,\n      loadAnimation: loadAnimation,\n      loading: loading,\n      addPrefix: prefix,\n      renderLoading: renderLoading\n    }));\n  };\n\n  var contextValue = react__WEBPACK_IMPORTED_MODULE_2___default().useMemo(function () {\n    return {\n      classPrefix: withClassPrefix(),\n      translateDOMPositionXY: translateDOMPositionXY.current,\n      rtl: rtl,\n      isTree: isTree,\n      hasCustomTreeCol: hasCustomTreeCol\n    };\n  }, [hasCustomTreeCol, isTree, rtl, withClassPrefix]);\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_TableContext__WEBPACK_IMPORTED_MODULE_13__.default.Provider, {\n    value: contextValue\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__.default)({\n    role: isTree ? 'treegrid' : 'grid' // The aria-rowcount is specified on the element with the table.\n    // Its value is an integer equal to the total number of rows available, including header rows.\n    ,\n    \"aria-rowcount\": data.length + 1,\n    \"aria-colcount\": colCounts.current,\n    \"aria-busy\": loading\n  }, rest, {\n    className: classes,\n    style: styles,\n    ref: tableRef\n  }), showHeader && renderTableHeader(headerCells, rowWidth), children && renderTableBody(bodyCells, rowWidth), showHeader && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_MouseArea__WEBPACK_IMPORTED_MODULE_10__.default, {\n    ref: mouseAreaRef,\n    addPrefix: prefix,\n    headerHeight: headerHeight,\n    height: getTableHeight()\n  })));\n});\nTable.displayName = 'Table';\nTable.defaultProps = {\n  data: [],\n  defaultSortType: _constants__WEBPACK_IMPORTED_MODULE_14__.SORT_TYPE.DESC,\n  height: 200,\n  rowHeight: 46,\n  headerHeight: 40,\n  minHeight: 0,\n  rowExpandedHeight: 100,\n  hover: true,\n  showHeader: true,\n  translate3d: true,\n  shouldUpdateScroll: true,\n  locale: {\n    emptyMessage: 'No data found',\n    loading: 'Loading...'\n  }\n};\nTable.propTypes = {\n  autoHeight: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  affixHeader: prop_types__WEBPACK_IMPORTED_MODULE_4___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool), (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number)]),\n  affixHorizontalScrollbar: prop_types__WEBPACK_IMPORTED_MODULE_4___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool), (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number)]),\n  bordered: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  className: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().string),\n  classPrefix: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().string),\n  children: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().any),\n  cellBordered: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  data: prop_types__WEBPACK_IMPORTED_MODULE_4___default().arrayOf((prop_types__WEBPACK_IMPORTED_MODULE_4___default().object)),\n  defaultExpandAllRows: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  defaultExpandedRowKeys: prop_types__WEBPACK_IMPORTED_MODULE_4___default().arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_4___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_4___default().string), (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number)])),\n  defaultSortType: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().any),\n  disabledScroll: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  expandedRowKeys: prop_types__WEBPACK_IMPORTED_MODULE_4___default().arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_4___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_4___default().string), (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number)])),\n  hover: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  height: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number),\n  headerHeight: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number),\n  locale: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().object),\n  loading: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  loadAnimation: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  minHeight: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number),\n  rowKey: prop_types__WEBPACK_IMPORTED_MODULE_4___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_4___default().string), (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number)]),\n  rowHeight: prop_types__WEBPACK_IMPORTED_MODULE_4___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_4___default().number), (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func)]),\n  renderTreeToggle: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  renderRowExpanded: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  renderRow: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  rowExpandedHeight: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number),\n  renderEmpty: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  renderLoading: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  rowClassName: prop_types__WEBPACK_IMPORTED_MODULE_4___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_4___default().func), (prop_types__WEBPACK_IMPORTED_MODULE_4___default().string)]),\n  rtl: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  style: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().object),\n  sortColumn: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().string),\n  sortType: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().any),\n  showHeader: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  shouldUpdateScroll: prop_types__WEBPACK_IMPORTED_MODULE_4___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_4___default().func), (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool)]),\n  translate3d: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  wordWrap: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  width: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().number),\n  virtualized: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  isTree: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool),\n  onRowClick: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  onRowContextMenu: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  onScroll: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  onSortColumn: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  onExpandChange: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  onTouchStart: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  onTouchMove: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func),\n  onTouchEnd: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func)\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (Table);\n\n//# sourceURL=webpack://rsuite/./node_modules/rsuite-table/es/Table.js?");
 
 /***/ }),
 
@@ -9255,7 +9310,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var reac
 /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/extends */ \"./node_modules/@babel/runtime/helpers/esm/extends.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var dom_lib_addStyle__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! dom-lib/addStyle */ \"./node_modules/dom-lib/esm/addStyle.js\");\n/* harmony import */ var dom_lib_addClass__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! dom-lib/addClass */ \"./node_modules/dom-lib/esm/addClass.js\");\n/* harmony import */ var dom_lib_removeClass__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! dom-lib/removeClass */ \"./node_modules/dom-lib/esm/removeClass.js\");\n/* harmony import */ var lodash_omit__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\");\n/* harmony import */ var lodash_omit__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(lodash_omit__WEBPACK_IMPORTED_MODULE_5__);\n/* harmony import */ var lodash_merge__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! lodash/merge */ \"./node_modules/lodash/merge.js\");\n/* harmony import */ var lodash_merge__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(lodash_merge__WEBPACK_IMPORTED_MODULE_6__);\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../constants */ \"./node_modules/rsuite-table/es/constants.js\");\n/* harmony import */ var _useControlled__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./useControlled */ \"./node_modules/rsuite-table/es/utils/useControlled.js\");\n/* harmony import */ var _getTableColumns__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./getTableColumns */ \"./node_modules/rsuite-table/es/utils/getTableColumns.js\");\n/* harmony import */ var _getTotalByColumns__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./getTotalByColumns */ \"./node_modules/rsuite-table/es/utils/getTotalByColumns.js\");\n/* harmony import */ var _useUpdateEffect__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./useUpdateEffect */ \"./node_modules/rsuite-table/es/utils/useUpdateEffect.js\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n//\n\n/**\n * Attach rendering-related attributes to all cells of the form and cache them.\n * @param props\n * @returns\n */\nvar useCellDescriptor = function useCellDescriptor(props) {\n  var children = props.children,\n      rtl = props.rtl,\n      mouseAreaRef = props.mouseAreaRef,\n      tableRef = props.tableRef,\n      minScrollX = props.minScrollX,\n      scrollX = props.scrollX,\n      tableWidth = props.tableWidth,\n      headerHeight = props.headerHeight,\n      showHeader = props.showHeader,\n      sortTypeProp = props.sortType,\n      defaultSortType = props.defaultSortType,\n      sortColumn = props.sortColumn,\n      rowHeight = props.rowHeight,\n      onSortColumn = props.onSortColumn,\n      prefix = props.prefix;\n\n  var _useControlled = (0,_useControlled__WEBPACK_IMPORTED_MODULE_8__.default)(sortTypeProp, defaultSortType),\n      sortType = _useControlled[0],\n      setSortType = _useControlled[1];\n\n  var _useState = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(),\n      cacheData = _useState[0],\n      setCacheData = _useState[1];\n\n  var clearCache = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function () {\n    setCacheData(null);\n  }, []);\n  var setColumnResizing = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function (resizing) {\n    if (resizing) {\n      (0,dom_lib_addClass__WEBPACK_IMPORTED_MODULE_3__.default)(tableRef.current, prefix('column-resizing'));\n    } else {\n      (0,dom_lib_removeClass__WEBPACK_IMPORTED_MODULE_4__.default)(tableRef.current, prefix('column-resizing'));\n    }\n  }, [prefix, tableRef]);\n  var columnWidths = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)({});\n  (0,_useUpdateEffect__WEBPACK_IMPORTED_MODULE_11__.default)(function () {\n    clearCache();\n  }, [children, sortColumn, sortType, tableWidth.current, scrollX.current, minScrollX.current]);\n  var handleColumnResizeEnd = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function (columnWidth, _cursorDelta, dataKey, index) {\n    columnWidths.current[dataKey + \"_\" + index + \"_width\"] = columnWidth;\n    setColumnResizing(false);\n    (0,dom_lib_addStyle__WEBPACK_IMPORTED_MODULE_2__.default)(mouseAreaRef.current, {\n      display: 'none'\n    });\n    clearCache();\n  }, [clearCache, mouseAreaRef, setColumnResizing]);\n  var handleColumnResizeMove = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function (width, left, fixed) {\n    var _addStyle;\n\n    var mouseAreaLeft = width + left;\n    var x = mouseAreaLeft;\n    var dir = 'left';\n\n    if (rtl) {\n      mouseAreaLeft += minScrollX.current + _constants__WEBPACK_IMPORTED_MODULE_7__.SCROLLBAR_WIDTH;\n      dir = 'right';\n    }\n\n    if (!fixed) {\n      x = mouseAreaLeft + (rtl ? -scrollX.current : scrollX.current);\n    }\n\n    (0,dom_lib_addStyle__WEBPACK_IMPORTED_MODULE_2__.default)(mouseAreaRef.current, (_addStyle = {\n      display: 'block'\n    }, _addStyle[dir] = x + \"px\", _addStyle));\n  }, [minScrollX, mouseAreaRef, rtl, scrollX]);\n  var handleColumnResizeStart = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function (width, left, fixed) {\n    setColumnResizing(true);\n    handleColumnResizeMove(width, left, fixed);\n  }, [handleColumnResizeMove, setColumnResizing]);\n  var handleSortColumn = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function (dataKey) {\n    var nextSortType = sortType;\n\n    if (sortColumn === dataKey) {\n      nextSortType = sortType === _constants__WEBPACK_IMPORTED_MODULE_7__.SORT_TYPE.ASC ? _constants__WEBPACK_IMPORTED_MODULE_7__.SORT_TYPE.DESC : _constants__WEBPACK_IMPORTED_MODULE_7__.SORT_TYPE.ASC;\n      setSortType(nextSortType);\n    }\n\n    onSortColumn === null || onSortColumn === void 0 ? void 0 : onSortColumn(dataKey, nextSortType);\n  }, [onSortColumn, setSortType, sortColumn, sortType]);\n\n  if (cacheData) {\n    return cacheData;\n  }\n\n  var hasCustomTreeCol = false;\n  var left = 0; // Cell left margin\n\n  var headerCells = []; // Table header cell\n\n  var bodyCells = []; // Table body cell\n\n  if (!children) {\n    var _cacheCell = {\n      columns: [],\n      headerCells: headerCells,\n      bodyCells: bodyCells,\n      hasCustomTreeCol: hasCustomTreeCol,\n      allColumnsWidth: left\n    };\n    setCacheData(_cacheCell);\n    return _cacheCell;\n  }\n\n  var columns = (0,_getTableColumns__WEBPACK_IMPORTED_MODULE_9__.default)(children);\n  var count = columns.length;\n\n  var _getTotalByColumns = (0,_getTotalByColumns__WEBPACK_IMPORTED_MODULE_10__.default)(columns),\n      totalFlexGrow = _getTotalByColumns.totalFlexGrow,\n      totalWidth = _getTotalByColumns.totalWidth;\n\n  react__WEBPACK_IMPORTED_MODULE_1___default().Children.forEach(columns, function (column, index) {\n    if ( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().isValidElement(column)) {\n      var _columnWidths$current;\n\n      var columnChildren = column.props.children;\n      var _column$props = column.props,\n          width = _column$props.width,\n          resizable = _column$props.resizable,\n          flexGrow = _column$props.flexGrow,\n          minWidth = _column$props.minWidth,\n          onResize = _column$props.onResize,\n          treeCol = _column$props.treeCol;\n\n      if (treeCol) {\n        hasCustomTreeCol = true;\n      }\n\n      if (resizable && flexGrow) {\n        console.warn(\"Cannot set 'resizable' and 'flexGrow' together in <Column>, column index: \" + index);\n      }\n\n      if (columnChildren.length !== 2) {\n        throw new Error(\"Component <HeaderCell> and <Cell> is required, column index: \" + index + \" \");\n      }\n\n      var cellWidth = ((_columnWidths$current = columnWidths.current) === null || _columnWidths$current === void 0 ? void 0 : _columnWidths$current[columnChildren[1].props.dataKey + \"_\" + index + \"_width\"]) || width || 0;\n\n      if (tableWidth.current && flexGrow && totalFlexGrow) {\n        cellWidth = Math.max((tableWidth.current - totalWidth) / totalFlexGrow * flexGrow, minWidth || 60);\n      }\n\n      var cellProps = (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__.default)({}, lodash_omit__WEBPACK_IMPORTED_MODULE_5___default()(column.props, ['children']), {\n        'aria-colindex': index + 1,\n        left: left,\n        headerHeight: headerHeight,\n        key: index,\n        width: cellWidth,\n        height: typeof rowHeight === 'function' ? rowHeight() : rowHeight,\n        firstColumn: index === 0,\n        lastColumn: index === count - 1\n      });\n\n      if (showHeader && headerHeight) {\n        var headerCellProps = {\n          // Resizable column\n          // `index` is used to define the serial number when dragging the column width\n          index: index,\n          dataKey: columnChildren[1].props.dataKey,\n          isHeaderCell: true,\n          minWidth: column.props.minWidth,\n          sortable: column.props.sortable,\n          onSortColumn: handleSortColumn,\n          sortType: sortType,\n          sortColumn: sortColumn,\n          flexGrow: flexGrow\n        };\n\n        if (resizable) {\n          lodash_merge__WEBPACK_IMPORTED_MODULE_6___default()(headerCellProps, {\n            onResize: onResize,\n            onColumnResizeEnd: handleColumnResizeEnd,\n            onColumnResizeStart: handleColumnResizeStart,\n            onColumnResizeMove: handleColumnResizeMove\n          });\n        }\n\n        headerCells.push( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().cloneElement(columnChildren[0], (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__.default)({}, cellProps, headerCellProps)));\n      }\n\n      bodyCells.push( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().cloneElement(columnChildren[1], cellProps));\n      left += cellWidth;\n    }\n  });\n  var cacheCell = {\n    columns: columns,\n    headerCells: headerCells,\n    bodyCells: bodyCells,\n    allColumnsWidth: left,\n    hasCustomTreeCol: hasCustomTreeCol\n  };\n  setCacheData(cacheCell);\n  return cacheCell;\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (useCellDescriptor);\n\n//# sourceURL=webpack://rsuite/./node_modules/rsuite-table/es/utils/useCellDescriptor.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/extends */ \"./node_modules/@babel/runtime/helpers/esm/extends.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var dom_lib_addStyle__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! dom-lib/addStyle */ \"./node_modules/dom-lib/esm/addStyle.js\");\n/* harmony import */ var dom_lib_addClass__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! dom-lib/addClass */ \"./node_modules/dom-lib/esm/addClass.js\");\n/* harmony import */ var dom_lib_removeClass__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! dom-lib/removeClass */ \"./node_modules/dom-lib/esm/removeClass.js\");\n/* harmony import */ var lodash_omit__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\");\n/* harmony import */ var lodash_omit__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(lodash_omit__WEBPACK_IMPORTED_MODULE_5__);\n/* harmony import */ var lodash_merge__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! lodash/merge */ \"./node_modules/lodash/merge.js\");\n/* harmony import */ var lodash_merge__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(lodash_merge__WEBPACK_IMPORTED_MODULE_6__);\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../constants */ \"./node_modules/rsuite-table/es/constants.js\");\n/* harmony import */ var _useControlled__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./useControlled */ \"./node_modules/rsuite-table/es/utils/useControlled.js\");\n/* harmony import */ var _getTableColumns__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./getTableColumns */ \"./node_modules/rsuite-table/es/utils/getTableColumns.js\");\n/* harmony import */ var _getTotalByColumns__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./getTotalByColumns */ \"./node_modules/rsuite-table/es/utils/getTotalByColumns.js\");\n/* harmony import */ var _useUpdateEffect__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./useUpdateEffect */ \"./node_modules/rsuite-table/es/utils/useUpdateEffect.js\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n//\n\n/**\n * Attach rendering-related attributes to all cells of the form and cache them.\n * @param props\n * @returns\n */\nvar useCellDescriptor = function useCellDescriptor(props) {\n  var children = props.children,\n      rtl = props.rtl,\n      mouseAreaRef = props.mouseAreaRef,\n      tableRef = props.tableRef,\n      minScrollX = props.minScrollX,\n      scrollX = props.scrollX,\n      tableWidth = props.tableWidth,\n      headerHeight = props.headerHeight,\n      showHeader = props.showHeader,\n      sortTypeProp = props.sortType,\n      defaultSortType = props.defaultSortType,\n      sortColumn = props.sortColumn,\n      rowHeight = props.rowHeight,\n      onSortColumn = props.onSortColumn,\n      prefix = props.prefix;\n\n  var _useControlled = (0,_useControlled__WEBPACK_IMPORTED_MODULE_8__.default)(sortTypeProp, defaultSortType),\n      sortType = _useControlled[0],\n      setSortType = _useControlled[1];\n\n  var _useState = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(),\n      cacheData = _useState[0],\n      setCacheData = _useState[1];\n\n  var clearCache = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function () {\n    setCacheData(null);\n  }, []);\n  var setColumnResizing = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function (resizing) {\n    if (resizing) {\n      (0,dom_lib_addClass__WEBPACK_IMPORTED_MODULE_3__.default)(tableRef.current, prefix('column-resizing'));\n    } else {\n      (0,dom_lib_removeClass__WEBPACK_IMPORTED_MODULE_4__.default)(tableRef.current, prefix('column-resizing'));\n    }\n  }, [prefix, tableRef]);\n  var columnWidths = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)({});\n  (0,_useUpdateEffect__WEBPACK_IMPORTED_MODULE_11__.default)(function () {\n    clearCache();\n  }, [children, sortColumn, sortType, tableWidth.current, scrollX.current, minScrollX.current]);\n  var handleColumnResizeEnd = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function (columnWidth, _cursorDelta, dataKey, index) {\n    columnWidths.current[dataKey + \"_\" + index + \"_width\"] = columnWidth;\n    setColumnResizing(false);\n    (0,dom_lib_addStyle__WEBPACK_IMPORTED_MODULE_2__.default)(mouseAreaRef.current, {\n      display: 'none'\n    });\n    clearCache();\n  }, [clearCache, mouseAreaRef, setColumnResizing]);\n  var handleColumnResizeMove = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function (width, left, fixed) {\n    var _addStyle;\n\n    var mouseAreaLeft = width + left;\n    var x = mouseAreaLeft;\n    var dir = 'left';\n\n    if (rtl) {\n      mouseAreaLeft += minScrollX.current + _constants__WEBPACK_IMPORTED_MODULE_7__.SCROLLBAR_WIDTH;\n      dir = 'right';\n    }\n\n    if (!fixed) {\n      x = mouseAreaLeft + (rtl ? -scrollX.current : scrollX.current);\n    }\n\n    (0,dom_lib_addStyle__WEBPACK_IMPORTED_MODULE_2__.default)(mouseAreaRef.current, (_addStyle = {\n      display: 'block'\n    }, _addStyle[dir] = x + \"px\", _addStyle));\n  }, [minScrollX, mouseAreaRef, rtl, scrollX]);\n  var handleColumnResizeStart = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function (width, left, fixed) {\n    setColumnResizing(true);\n    handleColumnResizeMove(width, left, fixed);\n  }, [handleColumnResizeMove, setColumnResizing]);\n  var handleSortColumn = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function (dataKey) {\n    var nextSortType = sortType;\n\n    if (sortColumn === dataKey) {\n      nextSortType = sortType === _constants__WEBPACK_IMPORTED_MODULE_7__.SORT_TYPE.ASC ? _constants__WEBPACK_IMPORTED_MODULE_7__.SORT_TYPE.DESC : _constants__WEBPACK_IMPORTED_MODULE_7__.SORT_TYPE.ASC;\n      setSortType(nextSortType);\n    }\n\n    onSortColumn === null || onSortColumn === void 0 ? void 0 : onSortColumn(dataKey, nextSortType);\n  }, [onSortColumn, setSortType, sortColumn, sortType]);\n\n  if (cacheData) {\n    return cacheData;\n  }\n\n  var hasCustomTreeCol = false;\n  var left = 0; // Cell left margin\n\n  var headerCells = []; // Table header cell\n\n  var bodyCells = []; // Table body cell\n\n  if (!children) {\n    var _cacheCell = {\n      columns: [],\n      headerCells: headerCells,\n      bodyCells: bodyCells,\n      hasCustomTreeCol: hasCustomTreeCol,\n      allColumnsWidth: left\n    };\n    setCacheData(_cacheCell);\n    return _cacheCell;\n  }\n\n  var columns = (0,_getTableColumns__WEBPACK_IMPORTED_MODULE_9__.default)(children);\n  var count = columns.length;\n\n  var _getTotalByColumns = (0,_getTotalByColumns__WEBPACK_IMPORTED_MODULE_10__.default)(columns),\n      totalFlexGrow = _getTotalByColumns.totalFlexGrow,\n      totalWidth = _getTotalByColumns.totalWidth;\n\n  react__WEBPACK_IMPORTED_MODULE_1___default().Children.forEach(columns, function (column, index) {\n    if ( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().isValidElement(column)) {\n      var _columnWidths$current;\n\n      var columnChildren = column.props.children;\n      var _column$props = column.props,\n          width = _column$props.width,\n          resizable = _column$props.resizable,\n          flexGrow = _column$props.flexGrow,\n          minWidth = _column$props.minWidth,\n          onResize = _column$props.onResize,\n          treeCol = _column$props.treeCol;\n\n      if (treeCol) {\n        hasCustomTreeCol = true;\n      }\n\n      if (resizable && flexGrow) {\n        console.warn(\"Cannot set 'resizable' and 'flexGrow' together in <Column>, column index: \" + index);\n      }\n\n      if (columnChildren.length !== 2) {\n        throw new Error(\"Component <HeaderCell> and <Cell> is required, column index: \" + index + \" \");\n      }\n\n      var headerCell = columnChildren[0];\n      var cell = columnChildren[1];\n      var cellWidth = ((_columnWidths$current = columnWidths.current) === null || _columnWidths$current === void 0 ? void 0 : _columnWidths$current[cell.props.dataKey + \"_\" + index + \"_width\"]) || width || 0;\n\n      if (tableWidth.current && flexGrow && totalFlexGrow) {\n        cellWidth = Math.max((tableWidth.current - totalWidth) / totalFlexGrow * flexGrow, minWidth || 60);\n      }\n\n      var cellProps = (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__.default)({}, lodash_omit__WEBPACK_IMPORTED_MODULE_5___default()(column.props, ['children']), {\n        'aria-colindex': index + 1,\n        left: left,\n        headerHeight: headerHeight,\n        key: index,\n        width: cellWidth,\n        height: typeof rowHeight === 'function' ? rowHeight() : rowHeight,\n        firstColumn: index === 0,\n        lastColumn: index === count - 1\n      });\n\n      if (showHeader && headerHeight) {\n        var headerCellProps = {\n          // Resizable column\n          // `index` is used to define the serial number when dragging the column width\n          index: index,\n          dataKey: cell.props.dataKey,\n          isHeaderCell: true,\n          minWidth: column.props.minWidth,\n          sortable: column.props.sortable,\n          onSortColumn: handleSortColumn,\n          sortType: sortType,\n          sortColumn: sortColumn,\n          flexGrow: flexGrow\n        };\n\n        if (resizable) {\n          lodash_merge__WEBPACK_IMPORTED_MODULE_6___default()(headerCellProps, {\n            onResize: onResize,\n            onColumnResizeEnd: handleColumnResizeEnd,\n            onColumnResizeStart: handleColumnResizeStart,\n            onColumnResizeMove: handleColumnResizeMove\n          });\n        }\n\n        headerCells.push( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().cloneElement(headerCell, (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__.default)({}, cellProps, headerCellProps)));\n      }\n\n      bodyCells.push( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().cloneElement(cell, cellProps));\n      left += cellWidth;\n    }\n  });\n  var cacheCell = {\n    columns: columns,\n    headerCells: headerCells,\n    bodyCells: bodyCells,\n    allColumnsWidth: left,\n    hasCustomTreeCol: hasCustomTreeCol\n  };\n  setCacheData(cacheCell);\n  return cacheCell;\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (useCellDescriptor);\n\n//# sourceURL=webpack://rsuite/./node_modules/rsuite-table/es/utils/useCellDescriptor.js?");
 
 /***/ }),