rsuite 5.60.1 → 5.61.0

package/dist/rsuite.js

@@ -2758,6 +2758,17 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n  value: true\n}));
 
 /***/ }),
 
+/***/ "./node_modules/@rsuite/icons/ArrowLeft.js":
+/*!*************************************************!*\
+  !*** ./node_modules/@rsuite/icons/ArrowLeft.js ***!
+  \*************************************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n  value: true\n}));\nObject.defineProperty(exports, \"default\", ({\n  enumerable: true,\n  get: function get() {\n    return _ArrowLeft[\"default\"];\n  }\n}));\n\nvar _ArrowLeft = _interopRequireDefault(__webpack_require__(/*! ./lib/icons/ArrowLeft */ \"./node_modules/@rsuite/icons/lib/icons/ArrowLeft.js\"));\n\nfunction _interopRequireDefault(obj) {\n  return obj && obj.__esModule ? obj : { default: obj };\n}\n\n\n//# sourceURL=webpack://rsuite/./node_modules/@rsuite/icons/ArrowLeft.js?");
+
+/***/ }),
+
 /***/ "./node_modules/@rsuite/icons/ArrowLeftLine.js":
 /*!*****************************************************!*\
   !*** ./node_modules/@rsuite/icons/ArrowLeftLine.js ***!
@@ -5475,6 +5486,17 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 
 /***/ }),
 
+/***/ "./node_modules/@rsuite/icons/lib/icons/ArrowLeft.js":
+/*!***********************************************************!*\
+  !*** ./node_modules/@rsuite/icons/lib/icons/ArrowLeft.js ***!
+  \***********************************************************/
+/***/ (function(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 _createSvgIcon = _interopRequireDefault(__webpack_require__(/*! ../createSvgIcon */ \"./node_modules/@rsuite/icons/lib/createSvgIcon.js\"));\n\nvar _ArrowLeft = _interopRequireDefault(__webpack_require__(/*! @rsuite/icon-font/lib/direction/ArrowLeft */ \"./node_modules/@rsuite/icon-font/lib/direction/ArrowLeft.js\"));\n\n// Generated by script, don't edit it please.\nvar ArrowLeft = (0, _createSvgIcon[\"default\"])({\n  as: _ArrowLeft[\"default\"],\n  ariaLabel: 'arrow left',\n  category: 'direction',\n  displayName: 'ArrowLeft'\n});\nvar _default = ArrowLeft;\nexports[\"default\"] = _default;\nmodule.exports = exports.default;\n\n//# sourceURL=webpack://rsuite/./node_modules/@rsuite/icons/lib/icons/ArrowLeft.js?");
+
+/***/ }),
+
 /***/ "./node_modules/@rsuite/icons/lib/icons/ArrowLeftLine.js":
 /*!***************************************************************!*\
   !*** ./node_modules/@rsuite/icons/lib/icons/ArrowLeftLine.js ***!
@@ -5988,7 +6010,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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../Animation/utils */ \"./src/Animation/utils.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _Plaintext = _interopRequireDefault(__webpack_require__(/*! ../internals/Plaintext */ \"./src/internals/Plaintext/index.tsx\"));\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _utils3 = __webpack_require__(/*! ./utils */ \"./src/AutoComplete/utils.ts\");\nvar _Combobox = _interopRequireDefault(__webpack_require__(/*! ./Combobox */ \"./src/AutoComplete/Combobox.tsx\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/AutoComplete/AutoComplete.tsx\",\n  _this = void 0;\n/**\n * Autocomplete function of input field.\n * @see https://rsuitejs.com/components/auto-complete\n *\n * TODO: Remove unnecessary .rs-auto-complete element\n * TODO: role=combobox and aria-autocomplete on input element\n */\nvar AutoComplete = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n    Component = _props$as === void 0 ? 'div' : _props$as,\n    disabled = props.disabled,\n    className = props.className,\n    _props$placement = props.placement,\n    placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n    _props$selectOnEnter = props.selectOnEnter,\n    selectOnEnter = _props$selectOnEnter === void 0 ? true : _props$selectOnEnter,\n    _props$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'auto-complete' : _props$classPrefix,\n    _props$defaultValue = props.defaultValue,\n    defaultValue = _props$defaultValue === void 0 ? '' : _props$defaultValue,\n    _props$menuAutoWidth = props.menuAutoWidth,\n    menuAutoWidth = _props$menuAutoWidth === void 0 ? true : _props$menuAutoWidth,\n    data = props.data,\n    valueProp = props.value,\n    open = props.open,\n    style = props.style,\n    size = props.size,\n    menuClassName = props.menuClassName,\n    id = props.id,\n    readOnly = props.readOnly,\n    plaintext = props.plaintext,\n    renderMenu = props.renderMenu,\n    renderMenuItem = props.renderMenuItem,\n    onSelect = props.onSelect,\n    filterBy = props.filterBy,\n    onKeyDown = props.onKeyDown,\n    onChange = props.onChange,\n    onClose = props.onClose,\n    onOpen = props.onOpen,\n    onFocus = props.onFocus,\n    onBlur = props.onBlur,\n    onMenuFocus = props.onMenuFocus,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"disabled\", \"className\", \"placement\", \"selectOnEnter\", \"classPrefix\", \"defaultValue\", \"menuAutoWidth\", \"data\", \"value\", \"open\", \"style\", \"size\", \"menuClassName\", \"id\", \"readOnly\", \"plaintext\", \"renderMenu\", \"renderMenuItem\", \"onSelect\", \"filterBy\", \"onKeyDown\", \"onChange\", \"onClose\", \"onOpen\", \"onFocus\", \"onBlur\", \"onMenuFocus\"]);\n  var datalist = (0, _utils3.transformData)(data);\n  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue),\n    value = _useControlled[0],\n    setValue = _useControlled[1];\n  var _useState = (0, _react.useState)(false),\n    focus = _useState[0],\n    setFocus = _useState[1];\n  var items = (datalist === null || datalist === void 0 ? void 0 : datalist.filter((0, _utils3.shouldDisplay)(filterBy, value))) || [];\n  var hasItems = items.length > 0;\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    overlay = _usePickerRef.overlay,\n    root = _usePickerRef.root;\n  var isMounted = (0, _utils.useIsMounted)();\n\n  // Used to hover the focuse item  when trigger `onKeydown`\n  var _useFocusItemValue = (0, _Picker.useFocusItemValue)(value, {\n      data: datalist,\n      focusToOption: false,\n      callback: onMenuFocus,\n      target: function target() {\n        return overlay.current;\n      }\n    }),\n    focusItemValue = _useFocusItemValue.focusItemValue,\n    setFocusItemValue = _useFocusItemValue.setFocusItemValue,\n    handleKeyDown = _useFocusItemValue.onKeyDown;\n  var handleKeyDownEvent = function handleKeyDownEvent(event) {\n    if (!overlay.current) {\n      return;\n    }\n    (0, _Picker.onMenuKeyDown)(event, {\n      enter: selectOnEnter ? selectFocusMenuItem : undefined,\n      esc: handleClose\n    });\n    handleKeyDown(event);\n    onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);\n  };\n  var selectFocusMenuItem = function selectFocusMenuItem(event) {\n    if (!focusItemValue) {\n      return;\n    }\n    var focusItem = datalist.find(function (item) {\n      return (item === null || item === void 0 ? void 0 : item.value) === focusItemValue;\n    });\n    setValue(focusItemValue);\n    setFocusItemValue(focusItemValue);\n    handleSelect(focusItem, event);\n    if (value !== focusItemValue) {\n      handleChangeValue(focusItemValue, event);\n    }\n    handleClose();\n  };\n  var handleSelect = (0, _utils.useEventCallback)(function (item, event) {\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(item.value, item, event);\n  });\n  var handleChangeValue = (0, _utils.useEventCallback)(function (value, event) {\n    onChange === null || onChange === void 0 ? void 0 : onChange(value, event);\n  });\n  var handleChange = function handleChange(value, event) {\n    setFocusItemValue('');\n    setValue(value);\n    setFocus(true);\n    handleChangeValue(value, event);\n  };\n  var handleClose = (0, _utils.useEventCallback)(function () {\n    if (isMounted()) {\n      setFocus(false);\n      onClose === null || onClose === void 0 ? void 0 : onClose();\n    }\n  });\n  var handleOpen = (0, _utils.useEventCallback)(function () {\n    setFocus(true);\n    onOpen === null || onOpen === void 0 ? void 0 : onOpen();\n  });\n  var handleItemSelect = (0, _utils.useEventCallback)(function (nextItemValue, item, event) {\n    setValue(nextItemValue);\n    setFocusItemValue(nextItemValue);\n    handleSelect(item, event);\n    if (value !== nextItemValue) {\n      handleChangeValue(nextItemValue, event);\n    }\n    handleClose();\n  });\n  var handleInputFocus = (0, _utils.useEventCallback)(function (event) {\n    onFocus === null || onFocus === void 0 ? void 0 : onFocus(event);\n    handleOpen();\n  });\n  var handleInputBlur = (0, _utils.useEventCallback)(function (event) {\n    setTimeout(handleClose, 300);\n    onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);\n  });\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    withClassPrefix = _useClassNames.withClassPrefix,\n    merge = _useClassNames.merge;\n  var classes = merge(className, withClassPrefix({\n    disabled: disabled\n  }));\n  var _partitionHTMLProps = (0, _utils.partitionHTMLProps)((0, _omit.default)(rest, _Picker.pickTriggerPropKeys)),\n    htmlInputProps = _partitionHTMLProps[0],\n    restProps = _partitionHTMLProps[1];\n  var renderPopup = function renderPopup(positionProps, speakerRef) {\n    var left = positionProps.left,\n      top = positionProps.top,\n      className = positionProps.className;\n    var styles = {\n      left: left,\n      top: top\n    };\n    var menu = /*#__PURE__*/_react.default.createElement(_Picker.Listbox, {\n      classPrefix: \"auto-complete-menu\",\n      listItemClassPrefix: \"auto-complete-item\",\n      listItemAs: _Picker.ListItem,\n      focusItemValue: focusItemValue,\n      onSelect: handleItemSelect,\n      renderMenuItem: renderMenuItem,\n      data: items,\n      className: menuClassName,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 248,\n        columnNumber: 9\n      }\n    });\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      style: styles,\n      className: className,\n      onKeyDown: handleKeyDownEvent,\n      target: trigger,\n      autoWidth: menuAutoWidth,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 261,\n        columnNumber: 9\n      }\n    }, renderMenu ? renderMenu(menu) : menu);\n  };\n  if (plaintext) {\n    return /*#__PURE__*/_react.default.createElement(_Plaintext.default, {\n      ref: ref,\n      localeKey: \"unfilled\",\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 276,\n        columnNumber: 9\n      }\n    }, typeof value === 'undefined' ? defaultValue : value);\n  }\n  var expanded = open || focus && hasItems;\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    id: id,\n    ref: trigger,\n    placement: placement,\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    trigger: ['click', 'focus'],\n    open: expanded,\n    speaker: renderPopup,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 285,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n    className: classes,\n    style: style,\n    ref: root\n  }, restProps, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 294,\n      columnNumber: 9\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Combobox.default, (0, _extends2.default)({}, htmlInputProps, {\n    disabled: disabled,\n    value: value,\n    size: size,\n    readOnly: readOnly,\n    expanded: expanded,\n    focusItemValue: focusItemValue,\n    onBlur: handleInputBlur,\n    onFocus: handleInputFocus,\n    onChange: handleChange,\n    onKeyDown: handleKeyDownEvent,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 295,\n      columnNumber: 11\n    }\n  }))));\n});\nAutoComplete.displayName = 'AutoComplete';\nAutoComplete.propTypes = (0, _extends2.default)({}, _utils2.animationPropTypes, {\n  data: _propTypes.default.array,\n  disabled: _propTypes.default.bool,\n  onSelect: _propTypes.default.func,\n  onChange: _propTypes.default.func,\n  classPrefix: _propTypes.default.string,\n  value: _propTypes.default.string,\n  defaultValue: _propTypes.default.string,\n  className: _propTypes.default.string,\n  menuClassName: _propTypes.default.string,\n  menuAutoWidth: _propTypes.default.bool,\n  placement: (0, _propTypes2.oneOf)(_utils.PLACEMENT),\n  onFocus: _propTypes.default.func,\n  onMenuFocus: _propTypes.default.func,\n  onBlur: _propTypes.default.func,\n  onKeyDown: _propTypes.default.func,\n  onOpen: _propTypes.default.func,\n  onClose: _propTypes.default.func,\n  readOnly: _propTypes.default.bool,\n  renderMenu: _propTypes.default.func,\n  renderMenuItem: _propTypes.default.func,\n  style: _propTypes.default.object,\n  size: (0, _propTypes2.oneOf)(['lg', 'md', 'sm', 'xs']),\n  open: _propTypes.default.bool,\n  selectOnEnter: _propTypes.default.bool,\n  filterBy: _propTypes.default.func\n});\nvar _default = AutoComplete;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/AutoComplete/AutoComplete.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../Animation/utils */ \"./src/Animation/utils.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _Plaintext = _interopRequireDefault(__webpack_require__(/*! ../internals/Plaintext */ \"./src/internals/Plaintext/index.tsx\"));\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _utils3 = __webpack_require__(/*! ./utils */ \"./src/AutoComplete/utils.ts\");\nvar _Combobox = _interopRequireDefault(__webpack_require__(/*! ./Combobox */ \"./src/AutoComplete/Combobox.tsx\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/AutoComplete/AutoComplete.tsx\",\n  _this = void 0;\n/**\n * Autocomplete function of input field.\n * @see https://rsuitejs.com/components/auto-complete\n *\n * TODO: Remove unnecessary .rs-auto-complete element\n * TODO: role=combobox and aria-autocomplete on input element\n */\nvar AutoComplete = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n    Component = _props$as === void 0 ? 'div' : _props$as,\n    disabled = props.disabled,\n    className = props.className,\n    _props$placement = props.placement,\n    placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n    _props$selectOnEnter = props.selectOnEnter,\n    selectOnEnter = _props$selectOnEnter === void 0 ? true : _props$selectOnEnter,\n    _props$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'auto-complete' : _props$classPrefix,\n    _props$defaultValue = props.defaultValue,\n    defaultValue = _props$defaultValue === void 0 ? '' : _props$defaultValue,\n    _props$menuAutoWidth = props.menuAutoWidth,\n    menuAutoWidth = _props$menuAutoWidth === void 0 ? true : _props$menuAutoWidth,\n    data = props.data,\n    valueProp = props.value,\n    open = props.open,\n    style = props.style,\n    size = props.size,\n    menuClassName = props.menuClassName,\n    id = props.id,\n    readOnly = props.readOnly,\n    plaintext = props.plaintext,\n    renderMenu = props.renderMenu,\n    renderMenuItem = props.renderMenuItem,\n    onSelect = props.onSelect,\n    filterBy = props.filterBy,\n    onKeyDown = props.onKeyDown,\n    onChange = props.onChange,\n    onClose = props.onClose,\n    onOpen = props.onOpen,\n    onFocus = props.onFocus,\n    onBlur = props.onBlur,\n    onMenuFocus = props.onMenuFocus,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"disabled\", \"className\", \"placement\", \"selectOnEnter\", \"classPrefix\", \"defaultValue\", \"menuAutoWidth\", \"data\", \"value\", \"open\", \"style\", \"size\", \"menuClassName\", \"id\", \"readOnly\", \"plaintext\", \"renderMenu\", \"renderMenuItem\", \"onSelect\", \"filterBy\", \"onKeyDown\", \"onChange\", \"onClose\", \"onOpen\", \"onFocus\", \"onBlur\", \"onMenuFocus\"]);\n  var datalist = (0, _utils3.transformData)(data);\n  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue),\n    value = _useControlled[0],\n    setValue = _useControlled[1];\n  var _useState = (0, _react.useState)(false),\n    focus = _useState[0],\n    setFocus = _useState[1];\n  var items = (datalist === null || datalist === void 0 ? void 0 : datalist.filter((0, _utils3.shouldDisplay)(filterBy, value))) || [];\n  var hasItems = items.length > 0;\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    overlay = _usePickerRef.overlay,\n    root = _usePickerRef.root;\n  var isMounted = (0, _utils.useIsMounted)();\n\n  // Used to hover the focuse item  when trigger `onKeydown`\n  var _useFocusItemValue = (0, _Picker.useFocusItemValue)(value, {\n      data: datalist,\n      focusToOption: false,\n      callback: onMenuFocus,\n      target: function target() {\n        return overlay.current;\n      }\n    }),\n    focusItemValue = _useFocusItemValue.focusItemValue,\n    setFocusItemValue = _useFocusItemValue.setFocusItemValue,\n    handleKeyDown = _useFocusItemValue.onKeyDown;\n  var handleKeyDownEvent = function handleKeyDownEvent(event) {\n    if (!overlay.current) {\n      return;\n    }\n    (0, _Picker.onMenuKeyDown)(event, {\n      enter: selectOnEnter ? selectFocusMenuItem : undefined,\n      esc: handleClose\n    });\n    handleKeyDown(event);\n    onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);\n  };\n  var selectFocusMenuItem = function selectFocusMenuItem(event) {\n    if (!focusItemValue) {\n      return;\n    }\n    var focusItem = datalist.find(function (item) {\n      return (item === null || item === void 0 ? void 0 : item.value) === focusItemValue;\n    });\n    setValue(focusItemValue);\n    setFocusItemValue(focusItemValue);\n    handleSelect(focusItem, event);\n    if (value !== focusItemValue) {\n      handleChangeValue(focusItemValue, event);\n    }\n    handleClose();\n  };\n  var handleSelect = (0, _utils.useEventCallback)(function (item, event) {\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(item.value, item, event);\n  });\n  var handleChangeValue = (0, _utils.useEventCallback)(function (value, event) {\n    onChange === null || onChange === void 0 ? void 0 : onChange(value, event);\n  });\n  var handleChange = function handleChange(value, event) {\n    setFocusItemValue('');\n    setValue(value);\n    setFocus(true);\n    handleChangeValue(value, event);\n  };\n  var handleClose = (0, _utils.useEventCallback)(function () {\n    if (isMounted()) {\n      setFocus(false);\n      onClose === null || onClose === void 0 ? void 0 : onClose();\n    }\n  });\n  var handleOpen = (0, _utils.useEventCallback)(function () {\n    setFocus(true);\n    onOpen === null || onOpen === void 0 ? void 0 : onOpen();\n  });\n  var handleItemSelect = (0, _utils.useEventCallback)(function (nextItemValue, item, event) {\n    setValue(nextItemValue);\n    setFocusItemValue(nextItemValue);\n    handleSelect(item, event);\n    if (value !== nextItemValue) {\n      handleChangeValue(nextItemValue, event);\n    }\n    handleClose();\n  });\n  var handleInputFocus = (0, _utils.useEventCallback)(function (event) {\n    onFocus === null || onFocus === void 0 ? void 0 : onFocus(event);\n    handleOpen();\n  });\n  var handleInputBlur = (0, _utils.useEventCallback)(function (event) {\n    setTimeout(handleClose, 300);\n    onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);\n  });\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    withClassPrefix = _useClassNames.withClassPrefix,\n    merge = _useClassNames.merge;\n  var classes = merge(className, withClassPrefix({\n    disabled: disabled\n  }));\n  var _partitionHTMLProps = (0, _utils.partitionHTMLProps)((0, _omit.default)(rest, _Picker.pickTriggerPropKeys)),\n    htmlInputProps = _partitionHTMLProps[0],\n    restProps = _partitionHTMLProps[1];\n  var renderPopup = function renderPopup(positionProps, speakerRef) {\n    var left = positionProps.left,\n      top = positionProps.top,\n      className = positionProps.className;\n    var styles = {\n      left: left,\n      top: top\n    };\n    var menu = /*#__PURE__*/_react.default.createElement(_Picker.Listbox, {\n      classPrefix: \"auto-complete-menu\",\n      listItemClassPrefix: \"auto-complete-item\",\n      listItemAs: _Picker.ListItem,\n      focusItemValue: focusItemValue,\n      onSelect: handleItemSelect,\n      renderMenuItem: renderMenuItem,\n      data: items,\n      className: menuClassName,\n      query: value,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 248,\n        columnNumber: 9\n      }\n    });\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      style: styles,\n      className: className,\n      onKeyDown: handleKeyDownEvent,\n      target: trigger,\n      autoWidth: menuAutoWidth,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 262,\n        columnNumber: 9\n      }\n    }, renderMenu ? renderMenu(menu) : menu);\n  };\n  if (plaintext) {\n    return /*#__PURE__*/_react.default.createElement(_Plaintext.default, {\n      ref: ref,\n      localeKey: \"unfilled\",\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 277,\n        columnNumber: 9\n      }\n    }, typeof value === 'undefined' ? defaultValue : value);\n  }\n  var expanded = open || focus && hasItems;\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    id: id,\n    ref: trigger,\n    placement: placement,\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    trigger: ['click', 'focus'],\n    open: expanded,\n    speaker: renderPopup,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 286,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n    className: classes,\n    style: style,\n    ref: root\n  }, restProps, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 295,\n      columnNumber: 9\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Combobox.default, (0, _extends2.default)({}, htmlInputProps, {\n    disabled: disabled,\n    value: value,\n    size: size,\n    readOnly: readOnly,\n    expanded: expanded,\n    focusItemValue: focusItemValue,\n    onBlur: handleInputBlur,\n    onFocus: handleInputFocus,\n    onChange: handleChange,\n    onKeyDown: handleKeyDownEvent,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 296,\n      columnNumber: 11\n    }\n  }))));\n});\nAutoComplete.displayName = 'AutoComplete';\nAutoComplete.propTypes = (0, _extends2.default)({}, _utils2.animationPropTypes, {\n  data: _propTypes.default.array,\n  disabled: _propTypes.default.bool,\n  onSelect: _propTypes.default.func,\n  onChange: _propTypes.default.func,\n  classPrefix: _propTypes.default.string,\n  value: _propTypes.default.string,\n  defaultValue: _propTypes.default.string,\n  className: _propTypes.default.string,\n  menuClassName: _propTypes.default.string,\n  menuAutoWidth: _propTypes.default.bool,\n  placement: (0, _propTypes2.oneOf)(_utils.PLACEMENT),\n  onFocus: _propTypes.default.func,\n  onMenuFocus: _propTypes.default.func,\n  onBlur: _propTypes.default.func,\n  onKeyDown: _propTypes.default.func,\n  onOpen: _propTypes.default.func,\n  onClose: _propTypes.default.func,\n  readOnly: _propTypes.default.bool,\n  renderMenu: _propTypes.default.func,\n  renderMenuItem: _propTypes.default.func,\n  style: _propTypes.default.object,\n  size: (0, _propTypes2.oneOf)(['lg', 'md', 'sm', 'xs']),\n  open: _propTypes.default.bool,\n  selectOnEnter: _propTypes.default.bool,\n  filterBy: _propTypes.default.func\n});\nvar _default = AutoComplete;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/AutoComplete/AutoComplete.tsx?");
 
 /***/ }),
 
@@ -6428,7 +6450,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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _useMap = __webpack_require__(/*! ../utils/useMap */ \"./src/utils/useMap.ts\");\nvar _TreeView = _interopRequireDefault(__webpack_require__(/*! ./TreeView */ \"./src/CascadeTree/TreeView.tsx\"));\nvar _SearchView = _interopRequireDefault(__webpack_require__(/*! ./SearchView */ \"./src/CascadeTree/SearchView.tsx\"));\nvar _hooks = __webpack_require__(/*! ./hooks */ \"./src/CascadeTree/hooks/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CascadeTree/CascadeTree.tsx\",\n  _this = void 0;\n/**\n * CascadeTree is a component that displays tree-structured data in columns.\n *\n * @see https://rsuitejs.com/components/cascade-tree\n */\nvar CascadeTree = /*#__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 ? [] : _props$data,\n    defaultValue = props.defaultValue,\n    className = props.className,\n    _props$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'cascade-tree' : _props$classPrefix,\n    _props$childrenKey = props.childrenKey,\n    childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,\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$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? [] : _props$disabledItemVa,\n    columnWidth = props.columnWidth,\n    columnHeight = props.columnHeight,\n    searchable = props.searchable,\n    renderTreeNode = props.renderTreeNode,\n    renderColumn = props.renderColumn,\n    onSelect = props.onSelect,\n    onSearch = props.onSearch,\n    onChange = props.onChange,\n    getChildren = props.getChildren,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"data\", \"defaultValue\", \"className\", \"classPrefix\", \"childrenKey\", \"valueKey\", \"labelKey\", \"value\", \"disabledItemValues\", \"columnWidth\", \"columnHeight\", \"searchable\", \"renderTreeNode\", \"renderColumn\", \"onSelect\", \"onSearch\", \"onChange\", \"getChildren\"]);\n  var _ref = (0, _utils.useControlled)(valueProp, defaultValue),\n    value = _ref[0],\n    setValue = _ref[1]; // Store the children of each node\n  var childrenMap = (0, _useMap.useMap)();\n\n  // Store the parent of each node\n  var parentMap = (0, _react.useMemo)(function () {\n    return (0, _treeUtils.getParentMap)(data, function (item) {\n      var _childrenMap$get;\n      return (_childrenMap$get = childrenMap.get(item)) !== null && _childrenMap$get !== void 0 ? _childrenMap$get : item[childrenKey];\n    });\n  }, [childrenMap, childrenKey, data]);\n\n  // Flatten the tree data\n  var flattenedData = (0, _react.useMemo)(function () {\n    return (0, _treeUtils.flattenTree)(data, function (item) {\n      var _childrenMap$get2;\n      return (_childrenMap$get2 = childrenMap.get(item)) !== null && _childrenMap$get2 !== void 0 ? _childrenMap$get2 : item[childrenKey];\n    });\n  }, [childrenMap, childrenKey, data]);\n\n  // The selected item\n  var selectedItem = flattenedData.find(function (item) {\n    return item[valueKey] === value;\n  });\n\n  // Callback function after selecting the node\n  var onSelectCallback = function onSelectCallback(node, event) {\n    var isLeafNode = node.isLeafNode,\n      cascadePaths = node.cascadePaths,\n      itemData = node.itemData;\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(itemData, cascadePaths, event);\n    if (isLeafNode) {\n      var nextValue = itemData[valueKey];\n      setValue(nextValue);\n    }\n  };\n  var _useSelect = (0, _hooks.useSelect)({\n      value: value,\n      valueKey: valueKey,\n      childrenKey: childrenKey,\n      childrenMap: childrenMap,\n      selectedItem: selectedItem,\n      getChildren: getChildren,\n      onChange: onChange,\n      onSelect: onSelectCallback\n    }),\n    activeItem = _useSelect.activeItem,\n    loadingItemsSet = _useSelect.loadingItemsSet,\n    handleSelect = _useSelect.handleSelect;\n  var _usePaths = (0, _hooks.usePaths)({\n      data: data,\n      activeItem: activeItem,\n      selectedItem: selectedItem,\n      getParent: function getParent(item) {\n        return parentMap.get(item);\n      },\n      getChildren: function getChildren(item) {\n        var _childrenMap$get3;\n        return (_childrenMap$get3 = childrenMap.get(item)) !== null && _childrenMap$get3 !== void 0 ? _childrenMap$get3 : item[childrenKey];\n      }\n    }),\n    columns = _usePaths.columns,\n    pathTowardsActiveItem = _usePaths.pathTowardsActiveItem;\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    withClassPrefix = _useClassNames.withClassPrefix,\n    merge = _useClassNames.merge;\n  var classes = merge(className, withClassPrefix());\n  var onSearchCallback = (0, _react.useCallback)(function (value, _items, event) {\n    return onSearch === null || onSearch === void 0 ? void 0 : onSearch(value, event);\n  }, [onSearch]);\n  var _useSearch = (0, _hooks.useSearch)({\n      labelKey: labelKey,\n      childrenKey: childrenKey,\n      parentMap: parentMap,\n      flattenedData: flattenedData,\n      onSearch: onSearchCallback\n    }),\n    items = _useSearch.items,\n    searchKeyword = _useSearch.searchKeyword,\n    setSearchKeyword = _useSearch.setSearchKeyword,\n    handleSearch = _useSearch.handleSearch;\n  var handleSearchRowSelect = (0, _utils.useEventCallback)(function (item, items, event) {\n    var _item$childrenKey;\n    var node = {\n      itemData: item,\n      cascadePaths: items,\n      isLeafNode: !((_item$childrenKey = item[childrenKey]) !== null && _item$childrenKey !== void 0 && _item$childrenKey.length)\n    };\n    handleSelect(node, event);\n    setSearchKeyword('');\n  });\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n    className: classes\n  }, rest, {\n    ref: ref,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 133,\n      columnNumber: 5\n    }\n  }), searchable && /*#__PURE__*/_react.default.createElement(_SearchView.default, {\n    data: items,\n    searchKeyword: searchKeyword,\n    valueKey: valueKey,\n    labelKey: labelKey,\n    parentMap: parentMap,\n    disabledItemValues: disabledItemValues,\n    onSelect: handleSearchRowSelect,\n    onSearch: handleSearch,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 135,\n      columnNumber: 9\n    }\n  }), !searchKeyword && /*#__PURE__*/_react.default.createElement(_TreeView.default, {\n    columnWidth: columnWidth,\n    columnHeight: columnHeight,\n    disabledItemValues: disabledItemValues,\n    loadingItemsSet: loadingItemsSet,\n    valueKey: valueKey,\n    labelKey: labelKey,\n    childrenKey: childrenKey,\n    classPrefix: classPrefix,\n    data: columns,\n    cascadePaths: pathTowardsActiveItem,\n    activeItemValue: value,\n    onSelect: handleSelect,\n    renderColumn: renderColumn,\n    renderTreeNode: renderTreeNode,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 147,\n      columnNumber: 9\n    }\n  }));\n});\nCascadeTree.displayName = 'CascadeTree';\nvar _default = CascadeTree;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CascadeTree/CascadeTree.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _utils = __webpack_require__(/*! ../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../Tree/utils */ \"./src/Tree/utils/index.ts\");\nvar _utils3 = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _useMap = __webpack_require__(/*! ../utils/useMap */ \"./src/utils/useMap.ts\");\nvar _TreeView = _interopRequireDefault(__webpack_require__(/*! ./TreeView */ \"./src/CascadeTree/TreeView.tsx\"));\nvar _SearchView = _interopRequireDefault(__webpack_require__(/*! ./SearchView */ \"./src/CascadeTree/SearchView.tsx\"));\nvar _hooks = __webpack_require__(/*! ./hooks */ \"./src/CascadeTree/hooks/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CascadeTree/CascadeTree.tsx\",\n  _this = void 0;\n/**\n * CascadeTree is a component that displays tree-structured data in columns.\n *\n * @see https://rsuitejs.com/components/cascade-tree\n */\nvar CascadeTree = /*#__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 ? [] : _props$data,\n    defaultValue = props.defaultValue,\n    className = props.className,\n    _props$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'cascade-tree' : _props$classPrefix,\n    _props$childrenKey = props.childrenKey,\n    childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,\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$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? [] : _props$disabledItemVa,\n    columnWidth = props.columnWidth,\n    columnHeight = props.columnHeight,\n    searchable = props.searchable,\n    renderTreeNode = props.renderTreeNode,\n    renderColumn = props.renderColumn,\n    onSelect = props.onSelect,\n    onSearch = props.onSearch,\n    onChange = props.onChange,\n    getChildren = props.getChildren,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"data\", \"defaultValue\", \"className\", \"classPrefix\", \"childrenKey\", \"valueKey\", \"labelKey\", \"value\", \"disabledItemValues\", \"columnWidth\", \"columnHeight\", \"searchable\", \"renderTreeNode\", \"renderColumn\", \"onSelect\", \"onSearch\", \"onChange\", \"getChildren\"]);\n  var _ref = (0, _utils3.useControlled)(valueProp, defaultValue),\n    value = _ref[0],\n    setValue = _ref[1]; // Store the children of each node\n  var childrenMap = (0, _useMap.useMap)();\n\n  // Store the parent of each node\n  var parentMap = (0, _react.useMemo)(function () {\n    return (0, _utils.getParentMap)(data, function (item) {\n      var _childrenMap$get;\n      return (_childrenMap$get = childrenMap.get(item)) !== null && _childrenMap$get !== void 0 ? _childrenMap$get : item[childrenKey];\n    });\n  }, [childrenMap, childrenKey, data]);\n\n  // Flatten the tree data\n  var flattenedData = (0, _react.useMemo)(function () {\n    return (0, _utils2.flattenTree)(data, function (item) {\n      var _childrenMap$get2;\n      return (_childrenMap$get2 = childrenMap.get(item)) !== null && _childrenMap$get2 !== void 0 ? _childrenMap$get2 : item[childrenKey];\n    });\n  }, [childrenMap, childrenKey, data]);\n\n  // The selected item\n  var selectedItem = flattenedData.find(function (item) {\n    return item[valueKey] === value;\n  });\n\n  // Callback function after selecting the node\n  var onSelectCallback = function onSelectCallback(node, event) {\n    var isLeafNode = node.isLeafNode,\n      cascadePaths = node.cascadePaths,\n      itemData = node.itemData;\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(itemData, cascadePaths, event);\n    if (isLeafNode) {\n      var nextValue = itemData[valueKey];\n      setValue(nextValue);\n    }\n  };\n  var _useSelect = (0, _hooks.useSelect)({\n      value: value,\n      valueKey: valueKey,\n      childrenKey: childrenKey,\n      childrenMap: childrenMap,\n      selectedItem: selectedItem,\n      getChildren: getChildren,\n      onChange: onChange,\n      onSelect: onSelectCallback\n    }),\n    activeItem = _useSelect.activeItem,\n    loadingItemsSet = _useSelect.loadingItemsSet,\n    handleSelect = _useSelect.handleSelect;\n  var _usePaths = (0, _hooks.usePaths)({\n      data: data,\n      activeItem: activeItem,\n      selectedItem: selectedItem,\n      getParent: function getParent(item) {\n        return parentMap.get(item);\n      },\n      getChildren: function getChildren(item) {\n        var _childrenMap$get3;\n        return (_childrenMap$get3 = childrenMap.get(item)) !== null && _childrenMap$get3 !== void 0 ? _childrenMap$get3 : item[childrenKey];\n      }\n    }),\n    columns = _usePaths.columns,\n    pathTowardsActiveItem = _usePaths.pathTowardsActiveItem;\n  var _useClassNames = (0, _utils3.useClassNames)(classPrefix),\n    withClassPrefix = _useClassNames.withClassPrefix,\n    merge = _useClassNames.merge;\n  var classes = merge(className, withClassPrefix());\n  var onSearchCallback = (0, _react.useCallback)(function (value, _items, event) {\n    return onSearch === null || onSearch === void 0 ? void 0 : onSearch(value, event);\n  }, [onSearch]);\n  var _useSearch = (0, _hooks.useSearch)({\n      labelKey: labelKey,\n      childrenKey: childrenKey,\n      parentMap: parentMap,\n      flattenedData: flattenedData,\n      onSearch: onSearchCallback\n    }),\n    items = _useSearch.items,\n    searchKeyword = _useSearch.searchKeyword,\n    setSearchKeyword = _useSearch.setSearchKeyword,\n    handleSearch = _useSearch.handleSearch;\n  var handleSearchRowSelect = (0, _utils3.useEventCallback)(function (item, items, event) {\n    var _item$childrenKey;\n    var node = {\n      itemData: item,\n      cascadePaths: items,\n      isLeafNode: !((_item$childrenKey = item[childrenKey]) !== null && _item$childrenKey !== void 0 && _item$childrenKey.length)\n    };\n    handleSelect(node, event);\n    setSearchKeyword('');\n  });\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n    className: classes\n  }, rest, {\n    ref: ref,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 134,\n      columnNumber: 5\n    }\n  }), searchable && /*#__PURE__*/_react.default.createElement(_SearchView.default, {\n    data: items,\n    searchKeyword: searchKeyword,\n    valueKey: valueKey,\n    labelKey: labelKey,\n    parentMap: parentMap,\n    disabledItemValues: disabledItemValues,\n    onSelect: handleSearchRowSelect,\n    onSearch: handleSearch,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 136,\n      columnNumber: 9\n    }\n  }), !searchKeyword && /*#__PURE__*/_react.default.createElement(_TreeView.default, {\n    columnWidth: columnWidth,\n    columnHeight: columnHeight,\n    disabledItemValues: disabledItemValues,\n    loadingItemsSet: loadingItemsSet,\n    valueKey: valueKey,\n    labelKey: labelKey,\n    childrenKey: childrenKey,\n    classPrefix: classPrefix,\n    data: columns,\n    cascadePaths: pathTowardsActiveItem,\n    activeItemValue: value,\n    onSelect: handleSelect,\n    renderColumn: renderColumn,\n    renderTreeNode: renderTreeNode,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 148,\n      columnNumber: 9\n    }\n  }));\n});\nCascadeTree.displayName = 'CascadeTree';\nvar _default = CascadeTree;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CascadeTree/CascadeTree.tsx?");
 
 /***/ }),
 
@@ -6439,7 +6461,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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends3 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/CascadeTree/utils.ts\");\nvar _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CascadeTree/SearchView.tsx\";\nfunction SearchView(props) {\n  var _this = this;\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 ? 'cascade-search-view' : _props$classPrefix,\n    className = props.className,\n    searchKeyword = props.searchKeyword,\n    labelKey = props.labelKey,\n    valueKey = props.valueKey,\n    parentMap = props.parentMap,\n    data = props.data,\n    focusItemValue = props.focusItemValue,\n    disabledItemValues = props.disabledItemValues,\n    inputRef = props.inputRef,\n    renderSearchItem = props.renderSearchItem,\n    onSearch = props.onSearch,\n    onSelect = props.onSelect,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"className\", \"searchKeyword\", \"labelKey\", \"valueKey\", \"parentMap\", \"data\", \"focusItemValue\", \"disabledItemValues\", \"inputRef\", \"renderSearchItem\", \"onSearch\", \"onSelect\"]);\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    merge = _useClassNames.merge,\n    prefix = _useClassNames.prefix,\n    withClassPrefix = _useClassNames.withClassPrefix,\n    rootPrefix = _useClassNames.rootPrefix;\n  var classes = merge(className, withClassPrefix());\n  var _useCustom = (0, _utils.useCustom)('Picker'),\n    locale = _useCustom.locale;\n  var renderSearchRow = function renderSearchRow(item, key) {\n    var items = (0, _treeUtils.getPathTowardsItem)(item, function (item) {\n      return parentMap.get(item);\n    });\n    var formattedNodes = items.map(function (itemData) {\n      var _extends2;\n      var label = (0, _utils2.highlightLabel)({\n        item: itemData,\n        labelKey: labelKey,\n        searchKeyword: searchKeyword,\n        render: function render(patch, index) {\n          return /*#__PURE__*/_react.default.createElement(\"span\", {\n            key: index,\n            className: prefix('match'),\n            __self: _this,\n            __source: {\n              fileName: _jsxFileName,\n              lineNumber: 54,\n              columnNumber: 11\n            }\n          }, patch);\n        }\n      });\n      return (0, _extends3.default)({}, itemData, (_extends2 = {}, _extends2[labelKey] = label, _extends2));\n    });\n    var disabled = disabledItemValues.some(function (value) {\n      return formattedNodes.some(function (itemData) {\n        return itemData[valueKey] === value;\n      });\n    });\n    var itemClasses = prefix('row', {\n      'row-disabled': disabled,\n      'row-focus': item[valueKey] === focusItemValue\n    });\n    var label = formattedNodes.map(function (itemData, index) {\n      return /*#__PURE__*/_react.default.createElement(\"span\", {\n        key: \"col-\" + index,\n        className: prefix('col'),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 72,\n          columnNumber: 7\n        }\n      }, itemData[labelKey]);\n    });\n    var handleCheck = function handleCheck(event) {\n      if (!disabled) {\n        onSelect(item, items, event);\n      }\n    };\n    return /*#__PURE__*/_react.default.createElement(\"div\", {\n      role: \"treeitem\",\n      \"aria-disabled\": disabled,\n      \"aria-label\": item[labelKey],\n      key: key,\n      \"data-key\": item[valueKey],\n      className: itemClasses,\n      tabIndex: -1,\n      onClick: handleCheck,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 84,\n        columnNumber: 7\n      }\n    }, renderSearchItem ? renderSearchItem(label, items) : label);\n  };\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends3.default)({\n    className: classes\n  }, rest, {\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 100,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(_SearchBox.default, {\n    placeholder: locale === null || locale === void 0 ? void 0 : locale.searchPlaceholder,\n    onChange: onSearch,\n    value: searchKeyword,\n    inputRef: inputRef,\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 101,\n      columnNumber: 7\n    }\n  }), searchKeyword !== '' && /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('panel'),\n    \"data-layer\": 0,\n    role: \"tree\",\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 108,\n      columnNumber: 9\n    }\n  }, data.length ? data.map(renderSearchRow) : /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: merge(prefix('none'), rootPrefix('picker-none')),\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 112,\n      columnNumber: 13\n    }\n  }, locale.noResultsText)));\n}\nvar _default = SearchView;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CascadeTree/SearchView.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends3 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _Highlight = _interopRequireDefault(__webpack_require__(/*! ../Highlight */ \"./src/Highlight/index.tsx\"));\nvar _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CascadeTree/SearchView.tsx\";\nfunction SearchView(props) {\n  var _this = this;\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 ? 'cascade-search-view' : _props$classPrefix,\n    className = props.className,\n    searchKeyword = props.searchKeyword,\n    labelKey = props.labelKey,\n    valueKey = props.valueKey,\n    parentMap = props.parentMap,\n    data = props.data,\n    focusItemValue = props.focusItemValue,\n    disabledItemValues = props.disabledItemValues,\n    inputRef = props.inputRef,\n    renderSearchItem = props.renderSearchItem,\n    onSearch = props.onSearch,\n    onSelect = props.onSelect,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"className\", \"searchKeyword\", \"labelKey\", \"valueKey\", \"parentMap\", \"data\", \"focusItemValue\", \"disabledItemValues\", \"inputRef\", \"renderSearchItem\", \"onSearch\", \"onSelect\"]);\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    merge = _useClassNames.merge,\n    prefix = _useClassNames.prefix,\n    withClassPrefix = _useClassNames.withClassPrefix,\n    rootPrefix = _useClassNames.rootPrefix;\n  var classes = merge(className, withClassPrefix());\n  var _useCustom = (0, _utils.useCustom)('Picker'),\n    locale = _useCustom.locale;\n  var renderSearchRow = function renderSearchRow(item, key) {\n    var items = (0, _utils2.getPathTowardsItem)(item, function (item) {\n      return parentMap.get(item);\n    });\n    var formattedNodes = items.map(function (itemData) {\n      var _extends2;\n      var label = /*#__PURE__*/_react.default.createElement(_Highlight.default, {\n        as: \"span\",\n        query: searchKeyword,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 50,\n          columnNumber: 9\n        }\n      }, itemData[labelKey]);\n      return (0, _extends3.default)({}, itemData, (_extends2 = {}, _extends2[labelKey] = label, _extends2));\n    });\n    var disabled = disabledItemValues.some(function (value) {\n      return formattedNodes.some(function (itemData) {\n        return itemData[valueKey] === value;\n      });\n    });\n    var itemClasses = prefix('row', {\n      'row-disabled': disabled,\n      'row-focus': item[valueKey] === focusItemValue\n    });\n    var label = formattedNodes.map(function (itemData, index) {\n      return /*#__PURE__*/_react.default.createElement(\"span\", {\n        key: \"col-\" + index,\n        className: prefix('col'),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 67,\n          columnNumber: 7\n        }\n      }, itemData[labelKey]);\n    });\n    var handleCheck = function handleCheck(event) {\n      if (!disabled) {\n        onSelect(item, items, event);\n      }\n    };\n    return /*#__PURE__*/_react.default.createElement(\"div\", {\n      role: \"treeitem\",\n      \"aria-disabled\": disabled,\n      \"aria-label\": item[labelKey],\n      key: key,\n      \"data-key\": item[valueKey],\n      className: itemClasses,\n      tabIndex: -1,\n      onClick: handleCheck,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 79,\n        columnNumber: 7\n      }\n    }, renderSearchItem ? renderSearchItem(label, items) : label);\n  };\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends3.default)({\n    className: classes\n  }, rest, {\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 95,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(_SearchBox.default, {\n    placeholder: locale === null || locale === void 0 ? void 0 : locale.searchPlaceholder,\n    onChange: onSearch,\n    value: searchKeyword,\n    inputRef: inputRef,\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 96,\n      columnNumber: 7\n    }\n  }), searchKeyword !== '' && /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('panel'),\n    \"data-layer\": 0,\n    role: \"tree\",\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 103,\n      columnNumber: 9\n    }\n  }, data.length ? data.map(renderSearchRow) : /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: merge(prefix('none'), rootPrefix('picker-none')),\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 107,\n      columnNumber: 13\n    }\n  }, locale.noResultsText)));\n}\nvar _default = SearchView;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CascadeTree/SearchView.tsx?");
 
 /***/ }),
 
@@ -6472,7 +6494,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nexports.__esModule = true;\nexports.usePaths = usePaths;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _treeUtils = __webpack_require__(/*! ../../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/CascadeTree/utils.ts\");\n/**\n * A Hook to get the selected path of Tree.\n *\n * - The columns of items to be displayed\n * - The path towards the current focused item\n * - The path towards the current selected item (referred to by Cascader's value)\n *\n */\nfunction usePaths(_ref) {\n  var data = _ref.data,\n    activeItem = _ref.activeItem,\n    selectedItem = _ref.selectedItem,\n    getParent = _ref.getParent,\n    getChildren = _ref.getChildren;\n  var pathTowardsSelectedItem = (0, _react.useMemo)(function () {\n    return (0, _treeUtils.getPathTowardsItem)(selectedItem, getParent);\n  }, [getParent, selectedItem]);\n  var _useMemo = (0, _react.useMemo)(function () {\n      return (0, _utils.getColumnsAndPaths)(data, activeItem, {\n        getParent: getParent,\n        getChildren: getChildren\n      });\n    }, [data, activeItem, getParent, getChildren]),\n    columns = _useMemo.columns,\n    pathTowardsActiveItem = _useMemo.path;\n  return {\n    columns: columns,\n    pathTowardsSelectedItem: pathTowardsSelectedItem,\n    pathTowardsActiveItem: pathTowardsActiveItem\n  };\n}\nvar _default = usePaths;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CascadeTree/hooks/usePaths.ts?");
+eval("\n\nexports.__esModule = true;\nexports.usePaths = usePaths;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _utils = __webpack_require__(/*! ../../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/CascadeTree/utils.ts\");\n/**\n * A Hook to get the selected path of Tree.\n *\n * - The columns of items to be displayed\n * - The path towards the current focused item\n * - The path towards the current selected item (referred to by Cascader's value)\n *\n */\nfunction usePaths(_ref) {\n  var data = _ref.data,\n    activeItem = _ref.activeItem,\n    selectedItem = _ref.selectedItem,\n    getParent = _ref.getParent,\n    getChildren = _ref.getChildren;\n  var pathTowardsSelectedItem = (0, _react.useMemo)(function () {\n    return (0, _utils.getPathTowardsItem)(selectedItem, getParent);\n  }, [getParent, selectedItem]);\n  var _useMemo = (0, _react.useMemo)(function () {\n      return (0, _utils2.getColumnsAndPaths)(data, activeItem, {\n        getParent: getParent,\n        getChildren: getChildren\n      });\n    }, [data, activeItem, getParent, getChildren]),\n    columns = _useMemo.columns,\n    pathTowardsActiveItem = _useMemo.path;\n  return {\n    columns: columns,\n    pathTowardsSelectedItem: pathTowardsSelectedItem,\n    pathTowardsActiveItem: pathTowardsActiveItem\n  };\n}\nvar _default = usePaths;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CascadeTree/hooks/usePaths.ts?");
 
 /***/ }),
 
@@ -6483,7 +6505,7 @@ eval("\n\nexports.__esModule = true;\nexports.usePaths = usePaths;\nexports[\"de
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nfunction useSearch(props) {\n  var _useState = (0, _react.useState)(''),\n    searchKeyword = _useState[0],\n    setSearchKeyword = _useState[1];\n  var labelKey = props.labelKey,\n    childrenKey = props.childrenKey,\n    parentMap = props.parentMap,\n    flattenedData = props.flattenedData,\n    parentSelectable = props.parentSelectable,\n    onSearch = props.onSearch;\n  var someKeyword = function someKeyword(item, keyword) {\n    if (item[labelKey].match(new RegExp((0, _utils.getSafeRegExpString)(keyword || searchKeyword), 'i'))) {\n      return true;\n    }\n    var parent = parentMap.get(item);\n    if (parent && someKeyword(parent)) {\n      return true;\n    }\n    return false;\n  };\n  var getSearchResult = function getSearchResult(keyword) {\n    var items = [];\n    var result = flattenedData.filter(function (item) {\n      if (!parentSelectable && item[childrenKey]) {\n        return false;\n      }\n      return someKeyword(item, keyword);\n    });\n    for (var i = 0; i < result.length; i++) {\n      items.push(result[i]);\n\n      // A maximum of 100 search results are returned.\n      if (i === 99) {\n        return items;\n      }\n    }\n    return items;\n  };\n  var handleSearch = (0, _utils.useEventCallback)(function (value, event) {\n    var items = getSearchResult(value);\n    setSearchKeyword(value);\n    onSearch === null || onSearch === void 0 ? void 0 : onSearch(value, items, event);\n  });\n  return {\n    searchKeyword: searchKeyword,\n    setSearchKeyword: setSearchKeyword,\n    items: getSearchResult(),\n    handleSearch: handleSearch\n  };\n}\nvar _default = useSearch;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CascadeTree/hooks/useSearch.ts?");
+eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../../internals/utils */ \"./src/internals/utils/index.ts\");\nfunction useSearch(props) {\n  var _useState = (0, _react.useState)(''),\n    searchKeyword = _useState[0],\n    setSearchKeyword = _useState[1];\n  var labelKey = props.labelKey,\n    childrenKey = props.childrenKey,\n    parentMap = props.parentMap,\n    flattenedData = props.flattenedData,\n    parentSelectable = props.parentSelectable,\n    onSearch = props.onSearch;\n  var someKeyword = function someKeyword(item, keyword) {\n    if (item[labelKey].match(new RegExp((0, _utils2.getSafeRegExpString)(keyword || searchKeyword), 'i'))) {\n      return true;\n    }\n    var parent = parentMap.get(item);\n    if (parent && someKeyword(parent)) {\n      return true;\n    }\n    return false;\n  };\n  var getSearchResult = function getSearchResult(keyword) {\n    var items = [];\n    var result = flattenedData.filter(function (item) {\n      if (!parentSelectable && item[childrenKey]) {\n        return false;\n      }\n      return someKeyword(item, keyword);\n    });\n    for (var i = 0; i < result.length; i++) {\n      items.push(result[i]);\n\n      // A maximum of 100 search results are returned.\n      if (i === 99) {\n        return items;\n      }\n    }\n    return items;\n  };\n  var handleSearch = (0, _utils.useEventCallback)(function (value, event) {\n    var items = getSearchResult(value);\n    setSearchKeyword(value);\n    onSearch === null || onSearch === void 0 ? void 0 : onSearch(value, items, event);\n  });\n  return {\n    searchKeyword: searchKeyword,\n    setSearchKeyword: setSearchKeyword,\n    items: getSearchResult(),\n    handleSearch: handleSearch\n  };\n}\nvar _default = useSearch;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CascadeTree/hooks/useSearch.ts?");
 
 /***/ }),
 
@@ -6513,10 +6535,10 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /*!**********************************!*\
   !*** ./src/CascadeTree/utils.ts ***!
   \**********************************/
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+/***/ (function(__unused_webpack_module, exports) {
 
 "use strict";
-eval("\n\nexports.__esModule = true;\nexports.getColumnsAndPaths = getColumnsAndPaths;\nexports.highlightLabel = highlightLabel;\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n/**\n * Calculate columns to be displayed:\n *\n * - Every ancestor level of activeItem should be displayed\n * - The level that activeItem is at should be displayed\n * - If activeItem is a parent node, its child level should be displayed\n *\n * @param items\n * @param value\n * @param options\n * @returns\n */\nfunction getColumnsAndPaths(items, pathTarget, options) {\n  var getParent = options.getParent,\n    getChildren = options.getChildren;\n  if (!pathTarget) {\n    return {\n      columns: [items],\n      path: []\n    };\n  }\n  var columns = [];\n  var path = [pathTarget];\n  var children = getChildren(pathTarget);\n  if (children && children.length > 0) {\n    columns.unshift(children);\n  }\n  for (var parent = getParent(pathTarget); !!parent; parent = getParent(parent)) {\n    var _getChildren;\n    columns.unshift((_getChildren = getChildren(parent)) !== null && _getChildren !== void 0 ? _getChildren : []);\n    path.unshift(parent);\n  }\n  columns.unshift(items);\n  return {\n    columns: columns,\n    path: path\n  };\n}\n\n/**\n * Highlight the search keyword in the label\n */\nfunction highlightLabel(props) {\n  var item = props.item,\n    searchKeyword = props.searchKeyword,\n    labelKey = props.labelKey,\n    render = props.render;\n  var regx = new RegExp((0, _utils.getSafeRegExpString)(searchKeyword), 'ig');\n  var labelElements = [];\n  var strArr = item[labelKey].split(regx);\n  var highStrArr = item[labelKey].match(regx);\n  for (var i = 0; i < strArr.length; i++) {\n    labelElements.push(strArr[i]);\n    if (highStrArr !== null && highStrArr !== void 0 && highStrArr[i]) {\n      labelElements.push(render(highStrArr[i], i));\n    }\n  }\n  return labelElements;\n}\n\n//# sourceURL=webpack://rsuite/./src/CascadeTree/utils.ts?");
+eval("\n\nexports.__esModule = true;\nexports.getColumnsAndPaths = getColumnsAndPaths;\n/**\n * Calculate columns to be displayed:\n *\n * - Every ancestor level of activeItem should be displayed\n * - The level that activeItem is at should be displayed\n * - If activeItem is a parent node, its child level should be displayed\n *\n * @param items\n * @param value\n * @param options\n * @returns\n */\nfunction getColumnsAndPaths(items, pathTarget, options) {\n  var getParent = options.getParent,\n    getChildren = options.getChildren;\n  if (!pathTarget) {\n    return {\n      columns: [items],\n      path: []\n    };\n  }\n  var columns = [];\n  var path = [pathTarget];\n  var children = getChildren(pathTarget);\n  if (children && children.length > 0) {\n    columns.unshift(children);\n  }\n  for (var parent = getParent(pathTarget); !!parent; parent = getParent(parent)) {\n    var _getChildren;\n    columns.unshift((_getChildren = getChildren(parent)) !== null && _getChildren !== void 0 ? _getChildren : []);\n    path.unshift(parent);\n  }\n  columns.unshift(items);\n  return {\n    columns: columns,\n    path: path\n  };\n}\n\n//# sourceURL=webpack://rsuite/./src/CascadeTree/utils.ts?");
 
 /***/ }),
 
@@ -6527,7 +6549,7 @@ eval("\n\nexports.__esModule = true;\nexports.getColumnsAndPaths = getColumnsAnd
 /***/ (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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _TreeView = _interopRequireDefault(__webpack_require__(/*! ../CascadeTree/TreeView */ \"./src/CascadeTree/TreeView.tsx\"));\nvar _SearchView = _interopRequireDefault(__webpack_require__(/*! ../CascadeTree/SearchView */ \"./src/CascadeTree/SearchView.tsx\"));\nvar _hooks = __webpack_require__(/*! ../CascadeTree/hooks */ \"./src/CascadeTree/hooks/index.ts\");\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _useMap = __webpack_require__(/*! ../utils/useMap */ \"./src/utils/useMap.ts\");\nvar _useActive2 = _interopRequireDefault(__webpack_require__(/*! ./useActive */ \"./src/Cascader/useActive.ts\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Cascader/Cascader.tsx\",\n  _this = void 0;\nvar emptyArray = [];\n\n/**\n * The `Cascader` component displays a hierarchical list of options.\n * @see https://rsuitejs.com/components/cascader\n */\nvar Cascader = /*#__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$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n    _props$childrenKey = props.childrenKey,\n    childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,\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    defaultValue = props.defaultValue,\n    placeholder = props.placeholder,\n    disabled = props.disabled,\n    _props$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,\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    overrideLocale = props.locale,\n    toggleAs = props.toggleAs,\n    style = props.style,\n    valueProp = props.value,\n    popupClassName = props.popupClassName,\n    popupStyle = props.popupStyle,\n    columnHeight = props.columnHeight,\n    columnWidth = props.columnWidth,\n    _props$searchable = props.searchable,\n    searchable = _props$searchable === void 0 ? true : _props$searchable,\n    parentSelectable = props.parentSelectable,\n    _props$placement = props.placement,\n    placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n    id = props.id,\n    renderColumn = props.renderColumn,\n    renderTreeNode = props.renderTreeNode,\n    renderSearchItem = props.renderSearchItem,\n    renderValue = props.renderValue,\n    renderExtraFooter = props.renderExtraFooter,\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    getChildren = props.getChildren,\n    DEPRECATED_menuClassName = props.menuClassName,\n    DEPRECATED_menuStyle = props.menuStyle,\n    DEPRECATED_menuWidth = props.menuWidth,\n    DEPRECATED_menuHeight = props.menuHeight,\n    DEPRECATED_renderMenuItem = props.renderMenuItem,\n    DEPRECATED_renderMenu = props.renderMenu,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"data\", \"classPrefix\", \"childrenKey\", \"valueKey\", \"labelKey\", \"defaultValue\", \"placeholder\", \"disabled\", \"disabledItemValues\", \"appearance\", \"cleanable\", \"locale\", \"toggleAs\", \"style\", \"value\", \"popupClassName\", \"popupStyle\", \"columnHeight\", \"columnWidth\", \"searchable\", \"parentSelectable\", \"placement\", \"id\", \"renderColumn\", \"renderTreeNode\", \"renderSearchItem\", \"renderValue\", \"renderExtraFooter\", \"onEntered\", \"onExited\", \"onClean\", \"onChange\", \"onSelect\", \"onSearch\", \"getChildren\", \"menuClassName\", \"menuStyle\", \"menuWidth\", \"menuHeight\", \"renderMenuItem\", \"renderMenu\"]);\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay,\n    searchInput = _usePickerRef.searchInput;\n  var _ref = (0, _utils.useControlled)(valueProp, defaultValue),\n    value = _ref[0],\n    setValue = _ref[1]; // Store the children of each node\n  var childrenMap = (0, _useMap.useMap)();\n\n  // Store the parent of each node\n  var parentMap = (0, _react.useMemo)(function () {\n    return (0, _treeUtils.getParentMap)(data, function (item) {\n      var _childrenMap$get;\n      return (_childrenMap$get = childrenMap.get(item)) !== null && _childrenMap$get !== void 0 ? _childrenMap$get : item[childrenKey];\n    });\n  }, [childrenMap, childrenKey, data]);\n\n  // Flatten the tree data\n  var flattenedData = (0, _react.useMemo)(function () {\n    return (0, _treeUtils.flattenTree)(data, function (item) {\n      var _childrenMap$get2;\n      return (_childrenMap$get2 = childrenMap.get(item)) !== null && _childrenMap$get2 !== void 0 ? _childrenMap$get2 : item[childrenKey];\n    });\n  }, [childrenMap, childrenKey, data]);\n\n  // The selected item\n  var selectedItem = flattenedData.find(function (item) {\n    return item[valueKey] === value;\n  });\n\n  // Callback function after selecting the node\n  var onSelectCallback = function onSelectCallback(node, event) {\n    var _trigger$current;\n    var isLeafNode = node.isLeafNode,\n      cascadePaths = node.cascadePaths,\n      itemData = node.itemData;\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(itemData, cascadePaths, event);\n    var nextValue = itemData[valueKey];\n    if (isLeafNode) {\n      // Determines whether the option is a leaf node, and if so, closes the picker.\n      handleClose();\n      setValue(nextValue);\n      return;\n    }\n\n    //  When the parent is optional, the value and the displayed path are updated.\n    if (parentSelectable && !(0, _utils.shallowEqual)(value, nextValue)) {\n      setValue(nextValue);\n      onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n    }\n\n    // Update menu position\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : _trigger$current.updatePosition();\n  };\n  var _useSelect = (0, _hooks.useSelect)({\n      value: value,\n      valueKey: valueKey,\n      childrenKey: childrenKey,\n      childrenMap: childrenMap,\n      selectedItem: selectedItem,\n      getChildren: getChildren,\n      onChange: onChange,\n      onSelect: onSelectCallback\n    }),\n    activeItem = _useSelect.activeItem,\n    setActiveItem = _useSelect.setActiveItem,\n    loadingItemsSet = _useSelect.loadingItemsSet,\n    handleSelect = _useSelect.handleSelect;\n  var _usePaths = (0, _hooks.usePaths)({\n      data: data,\n      activeItem: activeItem,\n      selectedItem: selectedItem,\n      getParent: function getParent(item) {\n        return parentMap.get(item);\n      },\n      getChildren: function getChildren(item) {\n        var _childrenMap$get3;\n        return (_childrenMap$get3 = childrenMap.get(item)) !== null && _childrenMap$get3 !== void 0 ? _childrenMap$get3 : item[childrenKey];\n      }\n    }),\n    columns = _usePaths.columns,\n    pathTowardsActiveItem = _usePaths.pathTowardsActiveItem,\n    pathTowardsSelectedItem = _usePaths.pathTowardsSelectedItem;\n  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),\n    locale = _useCustom.locale,\n    rtl = _useCustom.rtl;\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  var hasValue = pathTowardsSelectedItem.length > 0 || !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue);\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge;\n  var onFocusItemCallback = (0, _react.useCallback)(function (value) {\n    setActiveItem(flattenedData.find(function (item) {\n      return item[valueKey] === value;\n    }));\n  }, [flattenedData, setActiveItem, valueKey]);\n\n  // Used to hover the focuse item  when trigger `onKeydown`\n  var _useFocusItemValue = (0, _Picker.useFocusItemValue)(value, {\n      rtl: rtl,\n      data: flattenedData,\n      valueKey: valueKey,\n      defaultLayer: pathTowardsSelectedItem !== null && pathTowardsSelectedItem !== void 0 && pathTowardsSelectedItem.length ? pathTowardsSelectedItem.length - 1 : 0,\n      target: function target() {\n        return overlay.current;\n      },\n      getParent: function getParent(item) {\n        return parentMap.get(item);\n      },\n      callback: onFocusItemCallback\n    }),\n    focusItemValue = _useFocusItemValue.focusItemValue,\n    setFocusItemValue = _useFocusItemValue.setFocusItemValue,\n    setLayer = _useFocusItemValue.setLayer,\n    setKeys = _useFocusItemValue.setKeys,\n    onFocusItem = _useFocusItemValue.onKeyDown;\n  var onSearchCallback = function onSearchCallback(value, items, event) {\n    onSearch === null || onSearch === void 0 ? void 0 : onSearch(value, event);\n    if (!value || items.length === 0) {\n      setFocusItemValue(undefined);\n      return;\n    }\n    if (items.length > 0) {\n      setFocusItemValue(items[0][valueKey]);\n      setLayer(0);\n      setKeys([]);\n    }\n  };\n  var _useSearch = (0, _hooks.useSearch)({\n      labelKey: labelKey,\n      childrenKey: childrenKey,\n      parentMap: parentMap,\n      flattenedData: flattenedData,\n      parentSelectable: parentSelectable,\n      onSearch: onSearchCallback\n    }),\n    items = _useSearch.items,\n    searchKeyword = _useSearch.searchKeyword,\n    setSearchKeyword = _useSearch.setSearchKeyword,\n    handleSearch = _useSearch.handleSearch;\n  var _useActive = (0, _useActive2.default)({\n      onEntered: onEntered,\n      onExited: onExited,\n      target: target,\n      setSearchKeyword: setSearchKeyword\n    }),\n    active = _useActive.active,\n    handleEntered = _useActive.handleEntered,\n    handleExited = _useActive.handleExited;\n  var handleClose = (0, _utils.useEventCallback)(function () {\n    var _trigger$current2, _target$current, _target$current$focus;\n    (_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : _trigger$current2.close();\n\n    // The focus is on the trigger button after closing\n    (_target$current = target.current) === null || _target$current === void 0 ? void 0 : (_target$current$focus = _target$current.focus) === null || _target$current$focus === void 0 ? void 0 : _target$current$focus.call(_target$current);\n  });\n  var handleClean = (0, _utils.useEventCallback)(function (event) {\n    if (disabled || !target.current) {\n      return;\n    }\n    setValue(null);\n    onChange === null || onChange === void 0 ? void 0 : onChange(null, event);\n  });\n  var handleMenuPressEnter = (0, _utils.useEventCallback)(function (event) {\n    var focusItem = (0, _treeUtils.findNodeOfTree)(data, function (item) {\n      return item[valueKey] === focusItemValue;\n    });\n    var isLeafNode = focusItem && !focusItem[childrenKey];\n    if (isLeafNode) {\n      setValue(focusItemValue);\n      if (pathTowardsActiveItem.length) {\n        setLayer(pathTowardsActiveItem.length - 1);\n      }\n      if (!(0, _utils.shallowEqual)(value, focusItemValue)) {\n        onSelect === null || onSelect === void 0 ? void 0 : onSelect(focusItem, pathTowardsActiveItem, event);\n        onChange === null || onChange === void 0 ? void 0 : onChange(focusItemValue !== null && focusItemValue !== void 0 ? focusItemValue : null, event);\n      }\n      handleClose();\n    }\n  });\n  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !focusItemValue || !active,\n    trigger: trigger,\n    target: target,\n    overlay: overlay,\n    searchInput: searchInput,\n    active: active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter\n  }, rest));\n\n  /**\n   * The search structure option is processed after being selected.\n   */\n  var handleSearchRowSelect = (0, _utils.useEventCallback)(function (itemData, nodes, event) {\n    var nextValue = itemData[valueKey];\n    handleClose();\n    setSearchKeyword('');\n    setValue(nextValue);\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(itemData, nodes, event);\n    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n  });\n  var renderCascadeColumn = function renderCascadeColumn(childNodes, column) {\n    var items = column.items,\n      parentItem = column.parentItem,\n      layer = column.layer;\n    if (typeof renderColumn === 'function') {\n      return renderColumn(childNodes, column);\n    } else if (typeof DEPRECATED_renderMenu === 'function') {\n      return DEPRECATED_renderMenu(items, childNodes, parentItem, layer);\n    }\n    return childNodes;\n  };\n  var renderCascadeTreeNode = function renderCascadeTreeNode(node, itemData) {\n    var render = typeof renderTreeNode === 'function' ? renderTreeNode : DEPRECATED_renderMenuItem;\n    if (typeof render === 'function') {\n      return render(node, itemData);\n    }\n    return node;\n  };\n  var renderTreeView = function renderTreeView(positionProps, speakerRef) {\n    var _ref2 = positionProps || {},\n      left = _ref2.left,\n      top = _ref2.top,\n      className = _ref2.className;\n    var styles = (0, _extends2.default)({}, DEPRECATED_menuStyle, popupStyle, {\n      left: left,\n      top: top\n    });\n    var classes = merge(className, DEPRECATED_menuClassName, popupClassName, prefix('popup-cascader'));\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      className: classes,\n      style: styles,\n      target: trigger,\n      onKeyDown: onPickerKeyDown,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 431,\n        columnNumber: 7\n      }\n    }, searchable && /*#__PURE__*/_react.default.createElement(_SearchView.default, {\n      data: items,\n      searchKeyword: searchKeyword,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      parentMap: parentMap,\n      disabledItemValues: disabledItemValues,\n      focusItemValue: focusItemValue,\n      inputRef: searchInput,\n      renderSearchItem: renderSearchItem,\n      onSelect: handleSearchRowSelect,\n      onSearch: handleSearch,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 439,\n        columnNumber: 11\n      }\n    }), searchKeyword === '' && /*#__PURE__*/_react.default.createElement(_TreeView.default, {\n      columnWidth: columnWidth !== null && columnWidth !== void 0 ? columnWidth : DEPRECATED_menuWidth,\n      columnHeight: columnHeight !== null && columnHeight !== void 0 ? columnHeight : DEPRECATED_menuHeight,\n      disabledItemValues: disabledItemValues,\n      loadingItemsSet: loadingItemsSet,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      childrenKey: childrenKey,\n      classPrefix: 'cascade-tree',\n      data: columns,\n      cascadePaths: pathTowardsActiveItem,\n      activeItemValue: value,\n      onSelect: handleSelect,\n      renderColumn: renderCascadeColumn,\n      renderTreeNode: renderCascadeTreeNode,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 455,\n        columnNumber: 11\n      }\n    }), renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  var selectedElement = placeholder;\n  if (pathTowardsSelectedItem.length > 0) {\n    selectedElement = [];\n    pathTowardsSelectedItem.forEach(function (item, index) {\n      var key = item[valueKey] || item[labelKey];\n      selectedElement.push( /*#__PURE__*/_react.default.createElement(\"span\", {\n        key: key,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 484,\n          columnNumber: 28\n        }\n      }, item[labelKey]));\n      if (index < pathTowardsSelectedItem.length - 1) {\n        selectedElement.push( /*#__PURE__*/_react.default.createElement(\"span\", {\n          className: \"separator\",\n          key: key + \"-separator\",\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 487,\n            columnNumber: 11\n          }\n        }, ' / '));\n      }\n    });\n  }\n  if (!(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue)) {\n    selectedElement = renderValue(value, pathTowardsSelectedItem, selectedElement);\n    // If renderValue returns null or undefined, hasValue is false.\n    if ((0, _isNil.default)(selectedElement)) {\n      hasValue = false;\n    }\n  }\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n      classPrefix: classPrefix,\n      hasValue: hasValue,\n      name: 'cascader',\n      appearance: appearance,\n      cleanable: cleanable\n    })),\n    classes = _usePickerClassName[0],\n    usedClassNamePropKeys = _usePickerClassName[1];\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    id: id,\n    popupType: \"tree\",\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: trigger,\n    placement: placement,\n    onEntered: handleEntered,\n    onExited: handleExited,\n    speaker: renderTreeView,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 513,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    ref: root,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 523,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys)), {\n    ref: target,\n    as: toggleAs,\n    appearance: appearance,\n    disabled: disabled,\n    onClean: (0, _utils.createChainedFunction)(handleClean, onClean),\n    onKeyDown: onPickerKeyDown,\n    cleanable: cleanable && !disabled,\n    hasValue: hasValue,\n    active: active,\n    placement: placement,\n    inputValue: value !== null && value !== void 0 ? value : '',\n    focusItemValue: focusItemValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 524,\n      columnNumber: 9\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder))));\n});\nCascader.displayName = 'Cascader';\nCascader.propTypes = (0, _extends2.default)({}, _Picker.listPickerPropTypes, {\n  disabledItemValues: _propTypes.default.array,\n  locale: _propTypes.default.any,\n  appearance: (0, _propTypes2.oneOf)(['default', 'subtle']),\n  onSelect: _propTypes.default.func,\n  onSearch: _propTypes.default.func,\n  cleanable: _propTypes.default.bool,\n  renderColumn: _propTypes.default.func,\n  renderTreeNode: _propTypes.default.func,\n  renderSearchItem: _propTypes.default.func,\n  columnWidth: _propTypes.default.number,\n  columnHeight: _propTypes.default.number,\n  searchable: _propTypes.default.bool,\n  parentSelectable: _propTypes.default.bool,\n  inline: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.bool, 'Use `<CascadeTree>` instead.'),\n  renderMenu: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.func, 'Use \"renderColumn\" property instead.'),\n  renderMenuItem: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.func, 'Use \"renderTreeNode\" property instead.'),\n  menuWidth: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.number, 'Use \"columnWidth\" property instead.'),\n  menuHeight: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.number, 'Use \"columnHeight\" property instead.')\n});\nvar _default = Cascader;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/Cascader/Cascader.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _TreeView = _interopRequireDefault(__webpack_require__(/*! ../CascadeTree/TreeView */ \"./src/CascadeTree/TreeView.tsx\"));\nvar _SearchView = _interopRequireDefault(__webpack_require__(/*! ../CascadeTree/SearchView */ \"./src/CascadeTree/SearchView.tsx\"));\nvar _hooks = __webpack_require__(/*! ../CascadeTree/hooks */ \"./src/CascadeTree/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../Tree/utils */ \"./src/Tree/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _utils3 = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _useMap = __webpack_require__(/*! ../utils/useMap */ \"./src/utils/useMap.ts\");\nvar _useActive2 = _interopRequireDefault(__webpack_require__(/*! ./useActive */ \"./src/Cascader/useActive.ts\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Cascader/Cascader.tsx\",\n  _this = void 0;\nvar emptyArray = [];\n\n/**\n * The `Cascader` component displays a hierarchical list of options.\n * @see https://rsuitejs.com/components/cascader\n */\nvar Cascader = /*#__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$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n    _props$childrenKey = props.childrenKey,\n    childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,\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    defaultValue = props.defaultValue,\n    placeholder = props.placeholder,\n    disabled = props.disabled,\n    _props$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,\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    overrideLocale = props.locale,\n    toggleAs = props.toggleAs,\n    style = props.style,\n    valueProp = props.value,\n    popupClassName = props.popupClassName,\n    popupStyle = props.popupStyle,\n    columnHeight = props.columnHeight,\n    columnWidth = props.columnWidth,\n    _props$searchable = props.searchable,\n    searchable = _props$searchable === void 0 ? true : _props$searchable,\n    parentSelectable = props.parentSelectable,\n    _props$placement = props.placement,\n    placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n    id = props.id,\n    renderColumn = props.renderColumn,\n    renderTreeNode = props.renderTreeNode,\n    renderSearchItem = props.renderSearchItem,\n    renderValue = props.renderValue,\n    renderExtraFooter = props.renderExtraFooter,\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    getChildren = props.getChildren,\n    DEPRECATED_menuClassName = props.menuClassName,\n    DEPRECATED_menuStyle = props.menuStyle,\n    DEPRECATED_menuWidth = props.menuWidth,\n    DEPRECATED_menuHeight = props.menuHeight,\n    DEPRECATED_renderMenuItem = props.renderMenuItem,\n    DEPRECATED_renderMenu = props.renderMenu,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"data\", \"classPrefix\", \"childrenKey\", \"valueKey\", \"labelKey\", \"defaultValue\", \"placeholder\", \"disabled\", \"disabledItemValues\", \"appearance\", \"cleanable\", \"locale\", \"toggleAs\", \"style\", \"value\", \"popupClassName\", \"popupStyle\", \"columnHeight\", \"columnWidth\", \"searchable\", \"parentSelectable\", \"placement\", \"id\", \"renderColumn\", \"renderTreeNode\", \"renderSearchItem\", \"renderValue\", \"renderExtraFooter\", \"onEntered\", \"onExited\", \"onClean\", \"onChange\", \"onSelect\", \"onSearch\", \"getChildren\", \"menuClassName\", \"menuStyle\", \"menuWidth\", \"menuHeight\", \"renderMenuItem\", \"renderMenu\"]);\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay,\n    searchInput = _usePickerRef.searchInput;\n  var _ref = (0, _utils3.useControlled)(valueProp, defaultValue),\n    value = _ref[0],\n    setValue = _ref[1]; // Store the children of each node\n  var childrenMap = (0, _useMap.useMap)();\n\n  // Store the parent of each node\n  var parentMap = (0, _react.useMemo)(function () {\n    return (0, _utils2.getParentMap)(data, function (item) {\n      var _childrenMap$get;\n      return (_childrenMap$get = childrenMap.get(item)) !== null && _childrenMap$get !== void 0 ? _childrenMap$get : item[childrenKey];\n    });\n  }, [childrenMap, childrenKey, data]);\n\n  // Flatten the tree data\n  var flattenedData = (0, _react.useMemo)(function () {\n    return (0, _utils.flattenTree)(data, function (item) {\n      var _childrenMap$get2;\n      return (_childrenMap$get2 = childrenMap.get(item)) !== null && _childrenMap$get2 !== void 0 ? _childrenMap$get2 : item[childrenKey];\n    });\n  }, [childrenMap, childrenKey, data]);\n\n  // The selected item\n  var selectedItem = flattenedData.find(function (item) {\n    return item[valueKey] === value;\n  });\n\n  // Callback function after selecting the node\n  var onSelectCallback = function onSelectCallback(node, event) {\n    var _trigger$current;\n    var isLeafNode = node.isLeafNode,\n      cascadePaths = node.cascadePaths,\n      itemData = node.itemData;\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(itemData, cascadePaths, event);\n    var nextValue = itemData[valueKey];\n    if (isLeafNode) {\n      // Determines whether the option is a leaf node, and if so, closes the picker.\n      handleClose();\n      setValue(nextValue);\n      return;\n    }\n\n    //  When the parent is optional, the value and the displayed path are updated.\n    if (parentSelectable && !(0, _utils3.shallowEqual)(value, nextValue)) {\n      setValue(nextValue);\n      onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n    }\n\n    // Update menu position\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : _trigger$current.updatePosition();\n  };\n  var _useSelect = (0, _hooks.useSelect)({\n      value: value,\n      valueKey: valueKey,\n      childrenKey: childrenKey,\n      childrenMap: childrenMap,\n      selectedItem: selectedItem,\n      getChildren: getChildren,\n      onChange: onChange,\n      onSelect: onSelectCallback\n    }),\n    activeItem = _useSelect.activeItem,\n    setActiveItem = _useSelect.setActiveItem,\n    loadingItemsSet = _useSelect.loadingItemsSet,\n    handleSelect = _useSelect.handleSelect;\n  var _usePaths = (0, _hooks.usePaths)({\n      data: data,\n      activeItem: activeItem,\n      selectedItem: selectedItem,\n      getParent: function getParent(item) {\n        return parentMap.get(item);\n      },\n      getChildren: function getChildren(item) {\n        var _childrenMap$get3;\n        return (_childrenMap$get3 = childrenMap.get(item)) !== null && _childrenMap$get3 !== void 0 ? _childrenMap$get3 : item[childrenKey];\n      }\n    }),\n    columns = _usePaths.columns,\n    pathTowardsActiveItem = _usePaths.pathTowardsActiveItem,\n    pathTowardsSelectedItem = _usePaths.pathTowardsSelectedItem;\n  var _useCustom = (0, _utils3.useCustom)('Picker', overrideLocale),\n    locale = _useCustom.locale,\n    rtl = _useCustom.rtl;\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  var hasValue = pathTowardsSelectedItem.length > 0 || !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue);\n  var _useClassNames = (0, _utils3.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge;\n  var onFocusItemCallback = (0, _react.useCallback)(function (value) {\n    setActiveItem(flattenedData.find(function (item) {\n      return item[valueKey] === value;\n    }));\n  }, [flattenedData, setActiveItem, valueKey]);\n\n  // Used to hover the focuse item  when trigger `onKeydown`\n  var _useFocusItemValue = (0, _Picker.useFocusItemValue)(value, {\n      rtl: rtl,\n      data: flattenedData,\n      valueKey: valueKey,\n      defaultLayer: pathTowardsSelectedItem !== null && pathTowardsSelectedItem !== void 0 && pathTowardsSelectedItem.length ? pathTowardsSelectedItem.length - 1 : 0,\n      target: function target() {\n        return overlay.current;\n      },\n      getParent: function getParent(item) {\n        return parentMap.get(item);\n      },\n      callback: onFocusItemCallback\n    }),\n    focusItemValue = _useFocusItemValue.focusItemValue,\n    setFocusItemValue = _useFocusItemValue.setFocusItemValue,\n    setLayer = _useFocusItemValue.setLayer,\n    setKeys = _useFocusItemValue.setKeys,\n    onFocusItem = _useFocusItemValue.onKeyDown;\n  var onSearchCallback = function onSearchCallback(value, items, event) {\n    onSearch === null || onSearch === void 0 ? void 0 : onSearch(value, event);\n    if (!value || items.length === 0) {\n      setFocusItemValue(undefined);\n      return;\n    }\n    if (items.length > 0) {\n      setFocusItemValue(items[0][valueKey]);\n      setLayer(0);\n      setKeys([]);\n    }\n  };\n  var _useSearch = (0, _hooks.useSearch)({\n      labelKey: labelKey,\n      childrenKey: childrenKey,\n      parentMap: parentMap,\n      flattenedData: flattenedData,\n      parentSelectable: parentSelectable,\n      onSearch: onSearchCallback\n    }),\n    items = _useSearch.items,\n    searchKeyword = _useSearch.searchKeyword,\n    setSearchKeyword = _useSearch.setSearchKeyword,\n    handleSearch = _useSearch.handleSearch;\n  var _useActive = (0, _useActive2.default)({\n      onEntered: onEntered,\n      onExited: onExited,\n      target: target,\n      setSearchKeyword: setSearchKeyword\n    }),\n    active = _useActive.active,\n    handleEntered = _useActive.handleEntered,\n    handleExited = _useActive.handleExited;\n  var handleClose = (0, _utils3.useEventCallback)(function () {\n    var _trigger$current2, _target$current, _target$current$focus;\n    (_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : _trigger$current2.close();\n\n    // The focus is on the trigger button after closing\n    (_target$current = target.current) === null || _target$current === void 0 ? void 0 : (_target$current$focus = _target$current.focus) === null || _target$current$focus === void 0 ? void 0 : _target$current$focus.call(_target$current);\n  });\n  var handleClean = (0, _utils3.useEventCallback)(function (event) {\n    if (disabled || !target.current) {\n      return;\n    }\n    setValue(null);\n    onChange === null || onChange === void 0 ? void 0 : onChange(null, event);\n  });\n  var handleMenuPressEnter = (0, _utils3.useEventCallback)(function (event) {\n    var focusItem = (0, _utils2.findNodeOfTree)(data, function (item) {\n      return item[valueKey] === focusItemValue;\n    });\n    var isLeafNode = focusItem && !focusItem[childrenKey];\n    if (isLeafNode) {\n      setValue(focusItemValue);\n      if (pathTowardsActiveItem.length) {\n        setLayer(pathTowardsActiveItem.length - 1);\n      }\n      if (!(0, _utils3.shallowEqual)(value, focusItemValue)) {\n        onSelect === null || onSelect === void 0 ? void 0 : onSelect(focusItem, pathTowardsActiveItem, event);\n        onChange === null || onChange === void 0 ? void 0 : onChange(focusItemValue !== null && focusItemValue !== void 0 ? focusItemValue : null, event);\n      }\n      handleClose();\n    }\n  });\n  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !focusItemValue || !active,\n    trigger: trigger,\n    target: target,\n    overlay: overlay,\n    searchInput: searchInput,\n    active: active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter\n  }, rest));\n\n  /**\n   * The search structure option is processed after being selected.\n   */\n  var handleSearchRowSelect = (0, _utils3.useEventCallback)(function (itemData, nodes, event) {\n    var nextValue = itemData[valueKey];\n    handleClose();\n    setSearchKeyword('');\n    setValue(nextValue);\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(itemData, nodes, event);\n    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n  });\n  var renderCascadeColumn = function renderCascadeColumn(childNodes, column) {\n    var items = column.items,\n      parentItem = column.parentItem,\n      layer = column.layer;\n    if (typeof renderColumn === 'function') {\n      return renderColumn(childNodes, column);\n    } else if (typeof DEPRECATED_renderMenu === 'function') {\n      return DEPRECATED_renderMenu(items, childNodes, parentItem, layer);\n    }\n    return childNodes;\n  };\n  var renderCascadeTreeNode = function renderCascadeTreeNode(node, itemData) {\n    var render = typeof renderTreeNode === 'function' ? renderTreeNode : DEPRECATED_renderMenuItem;\n    if (typeof render === 'function') {\n      return render(node, itemData);\n    }\n    return node;\n  };\n  var renderTreeView = function renderTreeView(positionProps, speakerRef) {\n    var _ref2 = positionProps || {},\n      left = _ref2.left,\n      top = _ref2.top,\n      className = _ref2.className;\n    var styles = (0, _extends2.default)({}, DEPRECATED_menuStyle, popupStyle, {\n      left: left,\n      top: top\n    });\n    var classes = merge(className, DEPRECATED_menuClassName, popupClassName, prefix('popup-cascader'));\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils3.mergeRefs)(overlay, speakerRef),\n      className: classes,\n      style: styles,\n      target: trigger,\n      onKeyDown: onPickerKeyDown,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 432,\n        columnNumber: 7\n      }\n    }, searchable && /*#__PURE__*/_react.default.createElement(_SearchView.default, {\n      data: items,\n      searchKeyword: searchKeyword,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      parentMap: parentMap,\n      disabledItemValues: disabledItemValues,\n      focusItemValue: focusItemValue,\n      inputRef: searchInput,\n      renderSearchItem: renderSearchItem,\n      onSelect: handleSearchRowSelect,\n      onSearch: handleSearch,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 440,\n        columnNumber: 11\n      }\n    }), searchKeyword === '' && /*#__PURE__*/_react.default.createElement(_TreeView.default, {\n      columnWidth: columnWidth !== null && columnWidth !== void 0 ? columnWidth : DEPRECATED_menuWidth,\n      columnHeight: columnHeight !== null && columnHeight !== void 0 ? columnHeight : DEPRECATED_menuHeight,\n      disabledItemValues: disabledItemValues,\n      loadingItemsSet: loadingItemsSet,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      childrenKey: childrenKey,\n      classPrefix: 'cascade-tree',\n      data: columns,\n      cascadePaths: pathTowardsActiveItem,\n      activeItemValue: value,\n      onSelect: handleSelect,\n      renderColumn: renderCascadeColumn,\n      renderTreeNode: renderCascadeTreeNode,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 456,\n        columnNumber: 11\n      }\n    }), renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  var selectedElement = placeholder;\n  if (pathTowardsSelectedItem.length > 0) {\n    selectedElement = [];\n    pathTowardsSelectedItem.forEach(function (item, index) {\n      var key = item[valueKey] || item[labelKey];\n      selectedElement.push( /*#__PURE__*/_react.default.createElement(\"span\", {\n        key: key,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 485,\n          columnNumber: 28\n        }\n      }, item[labelKey]));\n      if (index < pathTowardsSelectedItem.length - 1) {\n        selectedElement.push( /*#__PURE__*/_react.default.createElement(\"span\", {\n          className: \"separator\",\n          key: key + \"-separator\",\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 488,\n            columnNumber: 11\n          }\n        }, ' / '));\n      }\n    });\n  }\n  if (!(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue)) {\n    selectedElement = renderValue(value, pathTowardsSelectedItem, selectedElement);\n    // If renderValue returns null or undefined, hasValue is false.\n    if ((0, _isNil.default)(selectedElement)) {\n      hasValue = false;\n    }\n  }\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n      classPrefix: classPrefix,\n      hasValue: hasValue,\n      name: 'cascader',\n      appearance: appearance,\n      cleanable: cleanable\n    })),\n    classes = _usePickerClassName[0],\n    usedClassNamePropKeys = _usePickerClassName[1];\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    id: id,\n    popupType: \"tree\",\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: trigger,\n    placement: placement,\n    onEntered: handleEntered,\n    onExited: handleExited,\n    speaker: renderTreeView,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 514,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    ref: root,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 524,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys)), {\n    ref: target,\n    as: toggleAs,\n    appearance: appearance,\n    disabled: disabled,\n    onClean: (0, _utils3.createChainedFunction)(handleClean, onClean),\n    onKeyDown: onPickerKeyDown,\n    cleanable: cleanable && !disabled,\n    hasValue: hasValue,\n    active: active,\n    placement: placement,\n    inputValue: value !== null && value !== void 0 ? value : '',\n    focusItemValue: focusItemValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 525,\n      columnNumber: 9\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder))));\n});\nCascader.displayName = 'Cascader';\nCascader.propTypes = (0, _extends2.default)({}, _Picker.listPickerPropTypes, {\n  disabledItemValues: _propTypes.default.array,\n  locale: _propTypes.default.any,\n  appearance: (0, _propTypes2.oneOf)(['default', 'subtle']),\n  onSelect: _propTypes.default.func,\n  onSearch: _propTypes.default.func,\n  cleanable: _propTypes.default.bool,\n  renderColumn: _propTypes.default.func,\n  renderTreeNode: _propTypes.default.func,\n  renderSearchItem: _propTypes.default.func,\n  columnWidth: _propTypes.default.number,\n  columnHeight: _propTypes.default.number,\n  searchable: _propTypes.default.bool,\n  parentSelectable: _propTypes.default.bool,\n  inline: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.bool, 'Use `<CascadeTree>` instead.'),\n  renderMenu: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.func, 'Use \"renderColumn\" property instead.'),\n  renderMenuItem: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.func, 'Use \"renderTreeNode\" property instead.'),\n  menuWidth: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.number, 'Use \"columnWidth\" property instead.'),\n  menuHeight: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.number, 'Use \"columnHeight\" property instead.')\n});\nvar _default = Cascader;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/Cascader/Cascader.tsx?");
 
 /***/ }),
 
@@ -6560,7 +6582,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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _clone = _interopRequireDefault(__webpack_require__(/*! lodash/clone */ \"./node_modules/lodash/clone.js\"));\nvar _isUndefined = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _remove = _interopRequireDefault(__webpack_require__(/*! lodash/remove */ \"./node_modules/lodash/remove.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _getDataGroupBy = __webpack_require__(/*! ../utils/getDataGroupBy */ \"./src/utils/getDataGroupBy.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckPicker/CheckPicker.tsx\",\n  _this = void 0,\n  _templateObject;\nvar emptyArray = [];\n/**\n * A component for selecting checkable items in a dropdown list.\n * @see https://rsuitejs.com/components/check-picker\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    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\"]);\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay,\n    list = _usePickerRef.list,\n    searchInput = _usePickerRef.searchInput;\n  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),\n    locale = _useCustom.locale;\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  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 overlay.current;\n      }\n    }),\n    focusItemValue = _useFocusItemValue.focusItemValue,\n    setFocusItemValue = _useFocusItemValue.setFocusItemValue,\n    onFocusItem = _useFocusItemValue.onKeyDown;\n  var handleSearchCallback = (0, _utils.useEventCallback)(function (searchKeyword, filteredData, event) {\n    var _filteredData$;\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  // Use search keywords to filter options.\n  var _useSearch = (0, _Picker.useSearch)(data, {\n      labelKey: labelKey,\n      searchBy: searchBy,\n      callback: handleSearchCallback\n    }),\n    searchKeyword = _useSearch.searchKeyword,\n    filteredData = _useSearch.filteredData,\n    handleSearch = _useSearch.handleSearch,\n    resetSearch = _useSearch.resetSearch,\n    checkShouldDisplay = _useSearch.checkShouldDisplay; // Use component active state to support keyboard events.\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  var _useState2 = (0, _react.useState)([]),\n    stickyItems = _useState2[0],\n    setStickyItems = _useState2[1];\n  var initStickyItems = function initStickyItems() {\n    if (!sticky) {\n      return;\n    }\n    var nextStickyItems = [];\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    setStickyItems(nextStickyItems);\n  };\n  var handleChangeValue = (0, _utils.useEventCallback)(function (value, event) {\n    onChange === null || onChange === void 0 ? void 0 : onChange(value, event);\n  });\n  var handleClean = (0, _utils.useEventCallback)(function (event) {\n    if (disabled || !cleanable) {\n      return;\n    }\n    setValue([]);\n    onClean === null || onClean === void 0 ? void 0 : onClean(event);\n    handleChangeValue([], event);\n  });\n  var handleMenuPressEnter = function handleMenuPressEnter(event) {\n    var nextValue = (0, _clone.default)(value);\n    if (!focusItemValue) {\n      return;\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    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  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !focusItemValue || !active,\n    trigger: trigger,\n    target: target,\n    overlay: overlay,\n    searchInput: searchInput,\n    active: active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter,\n    onMenuPressBackspace: handleClean\n  }, rest));\n  var handleSelect = (0, _utils.useEventCallback)(function (nextItemValue, item, event) {\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(nextItemValue, item, event);\n  });\n  var handleItemSelect = (0, _utils.useEventCallback)(function (nextItemValue, item, event, checked) {\n    var nextValue = (0, _clone.default)(value);\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    setValue(nextValue);\n    setFocusItemValue(nextItemValue);\n    handleSelect(nextValue, item, event);\n    handleChangeValue(nextValue, event);\n  });\n  var handleEntered = (0, _utils.useEventCallback)(function () {\n    setActive(true);\n  });\n  var handleExited = (0, _utils.useEventCallback)(function () {\n    resetSearch();\n    setFocusItemValue(null);\n    setActive(false);\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  /**\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  var hasValue = selectedItems.length > 0 || (value === null || value === void 0 ? void 0 : value.length) > 0 && (0, _isFunction.default)(renderValue);\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge;\n  var selectedElement = placeholder;\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: 273,\n        columnNumber: 9\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);\n    // If renderValue returns null or undefined, hasValue is false.\n    if ((0, _isNil.default)(selectedElement)) {\n      hasValue = false;\n    }\n  }\n  var renderPopup = function renderPopup(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    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    }\n\n    // Create a tree structure data when set `groupBy`\n    if (groupBy) {\n      items = (0, _getDataGroupBy.getDataGroupBy)(items, groupBy, sort);\n    } else if (typeof sort === 'function') {\n      items = items.sort(sort(false));\n    }\n    var menu = items.length || filteredStickyItems.length ? /*#__PURE__*/_react.default.createElement(_Picker.Listbox, {\n      listProps: listProps,\n      listRef: list,\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      renderMenuGroup: renderMenuGroup,\n      renderMenuItem: renderMenuItem,\n      maxHeight: menuMaxHeight,\n      classPrefix: 'picker-check-menu',\n      listItemAs: _Picker.ListCheckItem,\n      activeItemValues: value,\n      focusItemValue: focusItemValue,\n      data: [].concat(filteredStickyItems, items)\n      // `group` is redundant so long as `groupBy` exists\n      ,\n      group: !(0, _isUndefined.default)(groupBy),\n      groupBy: groupBy,\n      onSelect: handleItemSelect,\n      onGroupTitleClick: onGroupTitleClick,\n      virtualized: virtualized,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 316,\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: 338,\n        columnNumber: 11\n      }\n    }, locale === null || locale === void 0 ? void 0 : locale.noResultsText);\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      autoWidth: menuAutoWidth,\n      className: classes,\n      style: styles,\n      onKeyDown: onPickerKeyDown,\n      target: trigger,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 342,\n        columnNumber: 9\n      }\n    }, searchable && /*#__PURE__*/_react.default.createElement(_SearchBox.default, {\n      placeholder: locale === null || locale === void 0 ? void 0 : locale.searchPlaceholder,\n      onChange: handleSearch,\n      value: searchKeyword,\n      inputRef: searchInput,\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  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  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    id: id,\n    multiple: true,\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: trigger,\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: renderPopup,\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    ref: root,\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    ref: target,\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    focusItemValue: focusItemValue,\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});\nCheckPicker.displayName = 'CheckPicker';\nCheckPicker.propTypes = (0, _extends2.default)({}, _Picker.listPickerPropTypes, {\n  locale: _propTypes.default.any,\n  appearance: (0, _propTypes2.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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _clone = _interopRequireDefault(__webpack_require__(/*! lodash/clone */ \"./node_modules/lodash/clone.js\"));\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _remove = _interopRequireDefault(__webpack_require__(/*! lodash/remove */ \"./node_modules/lodash/remove.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _utils = __webpack_require__(/*! ../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _getDataGroupBy = __webpack_require__(/*! ../utils/getDataGroupBy */ \"./src/utils/getDataGroupBy.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckPicker/CheckPicker.tsx\",\n  _this = void 0,\n  _templateObject;\nvar emptyArray = [];\n/**\n * A component for selecting checkable items in a dropdown list.\n * @see https://rsuitejs.com/components/check-picker\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    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\"]);\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay,\n    list = _usePickerRef.list,\n    searchInput = _usePickerRef.searchInput;\n  var _useCustom = (0, _utils2.useCustom)('Picker', overrideLocale),\n    locale = _useCustom.locale;\n  var _useControlled = (0, _utils2.useControlled)(valueProp, defaultValue || []),\n    value = _useControlled[0],\n    setValue = _useControlled[1]; // Used to hover the focuse item  when trigger `onKeydown`\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 overlay.current;\n      }\n    }),\n    focusItemValue = _useFocusItemValue.focusItemValue,\n    setFocusItemValue = _useFocusItemValue.setFocusItemValue,\n    onFocusItem = _useFocusItemValue.onKeyDown;\n  var handleSearchCallback = (0, _utils2.useEventCallback)(function (searchKeyword, filteredData, event) {\n    var _filteredData$;\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  // Use search keywords to filter options.\n  var _useSearch = (0, _Picker.useSearch)(data, {\n      labelKey: labelKey,\n      searchBy: searchBy,\n      callback: handleSearchCallback\n    }),\n    searchKeyword = _useSearch.searchKeyword,\n    filteredData = _useSearch.filteredData,\n    handleSearch = _useSearch.handleSearch,\n    resetSearch = _useSearch.resetSearch,\n    checkShouldDisplay = _useSearch.checkShouldDisplay; // Use component active state to support keyboard events.\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  var _useState2 = (0, _react.useState)([]),\n    stickyItems = _useState2[0],\n    setStickyItems = _useState2[1];\n  var initStickyItems = function initStickyItems() {\n    if (!sticky) {\n      return;\n    }\n    var nextStickyItems = [];\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    setStickyItems(nextStickyItems);\n  };\n  var handleChangeValue = (0, _utils2.useEventCallback)(function (value, event) {\n    onChange === null || onChange === void 0 ? void 0 : onChange(value, event);\n  });\n  var handleClean = (0, _utils2.useEventCallback)(function (event) {\n    if (disabled || !cleanable) {\n      return;\n    }\n    setValue([]);\n    onClean === null || onClean === void 0 ? void 0 : onClean(event);\n    handleChangeValue([], event);\n  });\n  var handleMenuPressEnter = function handleMenuPressEnter(event) {\n    var nextValue = (0, _clone.default)(value);\n    if (!focusItemValue) {\n      return;\n    }\n    if (!nextValue.some(function (v) {\n      return (0, _utils2.shallowEqual)(v, focusItemValue);\n    })) {\n      nextValue.push(focusItemValue);\n    } else {\n      (0, _remove.default)(nextValue, function (itemVal) {\n        return (0, _utils2.shallowEqual)(itemVal, focusItemValue);\n      });\n    }\n    var focusItem = data.find(function (item) {\n      return (0, _utils2.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  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !focusItemValue || !active,\n    trigger: trigger,\n    target: target,\n    overlay: overlay,\n    searchInput: searchInput,\n    active: active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter,\n    onMenuPressBackspace: handleClean\n  }, rest));\n  var handleSelect = (0, _utils2.useEventCallback)(function (nextItemValue, item, event) {\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(nextItemValue, item, event);\n  });\n  var handleItemSelect = (0, _utils2.useEventCallback)(function (nextItemValue, item, event, checked) {\n    var nextValue = (0, _clone.default)(value);\n    if (checked) {\n      nextValue.push(nextItemValue);\n    } else {\n      (0, _remove.default)(nextValue, function (itemVal) {\n        return (0, _utils2.shallowEqual)(itemVal, nextItemValue);\n      });\n    }\n    setValue(nextValue);\n    setFocusItemValue(nextItemValue);\n    handleSelect(nextValue, item, event);\n    handleChangeValue(nextValue, event);\n  });\n  var handleEntered = (0, _utils2.useEventCallback)(function () {\n    setActive(true);\n  });\n  var handleExited = (0, _utils2.useEventCallback)(function () {\n    resetSearch();\n    setFocusItemValue(null);\n    setActive(false);\n  });\n  var selectedItems = data.filter(function (item) {\n    return value === null || value === void 0 ? void 0 : value.some(function (val) {\n      return (0, _utils2.shallowEqual)(item[valueKey], val);\n    });\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  var hasValue = selectedItems.length > 0 || (value === null || value === void 0 ? void 0 : value.length) > 0 && (0, _isFunction.default)(renderValue);\n  var _useClassNames = (0, _utils2.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge;\n  var selectedElement = placeholder;\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: 271,\n        columnNumber: 9\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);\n    // If renderValue returns null or undefined, hasValue is false.\n    if ((0, _isNil.default)(selectedElement)) {\n      hasValue = false;\n    }\n  }\n  var renderPopup = function renderPopup(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    if (stickyItems) {\n      filteredStickyItems = (0, _utils.filterNodesOfTree)(stickyItems, function (item) {\n        return checkShouldDisplay(item);\n      });\n      items = (0, _utils.filterNodesOfTree)(data, function (item) {\n        return checkShouldDisplay(item) && !stickyItems.some(function (v) {\n          return v[valueKey] === item[valueKey];\n        });\n      });\n    }\n\n    // Create a tree structure data when set `groupBy`\n    if (groupBy) {\n      items = (0, _getDataGroupBy.getDataGroupBy)(items, groupBy, sort);\n    } else if (typeof sort === 'function') {\n      items = items.sort(sort(false));\n    }\n    var menu = items.length || filteredStickyItems.length ? /*#__PURE__*/_react.default.createElement(_Picker.Listbox, {\n      listProps: listProps,\n      listRef: list,\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      renderMenuGroup: renderMenuGroup,\n      renderMenuItem: renderMenuItem,\n      maxHeight: menuMaxHeight,\n      classPrefix: 'picker-check-menu',\n      listItemAs: _Picker.ListCheckItem,\n      activeItemValues: value,\n      focusItemValue: focusItemValue,\n      data: [].concat(filteredStickyItems, items),\n      groupBy: groupBy,\n      onSelect: handleItemSelect,\n      onGroupTitleClick: onGroupTitleClick,\n      virtualized: virtualized,\n      query: searchKeyword,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 314,\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: 335,\n        columnNumber: 11\n      }\n    }, locale === null || locale === void 0 ? void 0 : locale.noResultsText);\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils2.mergeRefs)(overlay, speakerRef),\n      autoWidth: menuAutoWidth,\n      className: classes,\n      style: styles,\n      onKeyDown: onPickerKeyDown,\n      target: trigger,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 339,\n        columnNumber: 9\n      }\n    }, searchable && /*#__PURE__*/_react.default.createElement(_SearchBox.default, {\n      placeholder: locale === null || locale === void 0 ? void 0 : locale.searchPlaceholder,\n      onChange: handleSearch,\n      value: searchKeyword,\n      inputRef: searchInput,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 348,\n        columnNumber: 13\n      }\n    }), renderMenu ? renderMenu(menu) : menu, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\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  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    id: id,\n    multiple: true,\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: trigger,\n    placement: placement,\n    onEnter: (0, _utils2.createChainedFunction)(initStickyItems, onEnter),\n    onEntered: (0, _utils2.createChainedFunction)(handleEntered, onEntered),\n    onExited: (0, _utils2.createChainedFunction)(handleExited, onExited),\n    speaker: renderPopup,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 372,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    ref: root,\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    ref: target,\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    focusItemValue: focusItemValue,\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});\nCheckPicker.displayName = 'CheckPicker';\nCheckPicker.propTypes = (0, _extends2.default)({}, _Picker.listPickerPropTypes, {\n  locale: _propTypes.default.any,\n  appearance: (0, _propTypes2.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?");
 
 /***/ }),
 
@@ -6575,6 +6597,72 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 
 /***/ }),
 
+/***/ "./src/CheckTree/CheckTree.tsx":
+/*!*************************************!*\
+  !*** ./src/CheckTree/CheckTree.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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _useTreeValue2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useTreeValue */ \"./src/CheckTree/hooks/useTreeValue.ts\"));\nvar _CheckTreeView = _interopRequireDefault(__webpack_require__(/*! ./CheckTreeView */ \"./src/CheckTree/CheckTreeView.tsx\"));\nvar _useFlattenTree = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useFlattenTree */ \"./src/Tree/hooks/useFlattenTree.ts\"));\nvar _useTreeWithChildren2 = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useTreeWithChildren */ \"./src/Tree/hooks/useTreeWithChildren.ts\"));\nvar _useExpandTree2 = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useExpandTree */ \"./src/Tree/hooks/useExpandTree.ts\"));\nvar _TreeProvider = __webpack_require__(/*! ../Tree/TreeProvider */ \"./src/Tree/TreeProvider.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckTree/CheckTree.tsx\",\n  _this = void 0;\n/**\n * The `CheckTree` component is used for selecting multiple options which are organized in a tree structure.\n * @see https://rsuitejs.com/components/check-tree\n */\nvar CheckTree = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var controlledValue = props.value,\n    data = props.data,\n    defaultValue = props.defaultValue,\n    _props$defaultExpandA = props.defaultExpandAll,\n    defaultExpandAll = _props$defaultExpandA === void 0 ? false : _props$defaultExpandA,\n    _props$defaultExpandI = props.defaultExpandItemValues,\n    defaultExpandItemValues = _props$defaultExpandI === void 0 ? [] : _props$defaultExpandI,\n    uncheckableItemValues = props.uncheckableItemValues,\n    controlledExpandItemValues = props.expandItemValues,\n    _props$childrenKey = props.childrenKey,\n    childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,\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    virtualized = props.virtualized,\n    _props$cascade = props.cascade,\n    cascade = _props$cascade === void 0 ? true : _props$cascade,\n    renderTreeIcon = props.renderTreeIcon,\n    renderTreeNode = props.renderTreeNode,\n    getChildren = props.getChildren,\n    onExpand = props.onExpand,\n    onChange = props.onChange,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"value\", \"data\", \"defaultValue\", \"defaultExpandAll\", \"defaultExpandItemValues\", \"uncheckableItemValues\", \"expandItemValues\", \"childrenKey\", \"labelKey\", \"valueKey\", \"virtualized\", \"cascade\", \"renderTreeIcon\", \"renderTreeNode\", \"getChildren\", \"onExpand\", \"onChange\"]);\n  var _useTreeValue = (0, _useTreeValue2.default)(controlledValue, {\n      defaultValue: defaultValue,\n      uncheckableItemValues: uncheckableItemValues\n    }),\n    value = _useTreeValue[0],\n    setValue = _useTreeValue[1];\n  var itemDataKeys = {\n    childrenKey: childrenKey,\n    labelKey: labelKey,\n    valueKey: valueKey\n  };\n  var _useTreeWithChildren = (0, _useTreeWithChildren2.default)(data, itemDataKeys),\n    treeData = _useTreeWithChildren.treeData,\n    loadingNodeValues = _useTreeWithChildren.loadingNodeValues,\n    appendChild = _useTreeWithChildren.appendChild;\n  var _useExpandTree = (0, _useExpandTree2.default)(data, (0, _extends2.default)({}, itemDataKeys, {\n      defaultExpandAll: defaultExpandAll,\n      defaultExpandItemValues: defaultExpandItemValues,\n      controlledExpandItemValues: controlledExpandItemValues,\n      onExpand: onExpand,\n      getChildren: getChildren,\n      appendChild: appendChild\n    })),\n    expandItemValues = _useExpandTree.expandItemValues,\n    handleExpandTreeNode = _useExpandTree.handleExpandTreeNode;\n  var flattenedNodes = (0, _useFlattenTree.default)(treeData, (0, _extends2.default)({}, itemDataKeys, {\n    uncheckableItemValues: uncheckableItemValues,\n    multiple: true,\n    cascade: cascade,\n    value: value\n  }));\n  var handleChange = (0, _utils.useEventCallback)(function (nextValue, event) {\n    setValue(nextValue);\n    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n  });\n  var treeContext = (0, _react.useMemo)(function () {\n    return {\n      props: {\n        labelKey: labelKey,\n        valueKey: valueKey,\n        childrenKey: childrenKey,\n        virtualized: virtualized,\n        renderTreeIcon: renderTreeIcon,\n        renderTreeNode: renderTreeNode\n      }\n    };\n  }, [childrenKey, labelKey, valueKey, virtualized, renderTreeIcon, renderTreeNode]);\n  return /*#__PURE__*/_react.default.createElement(_TreeProvider.TreeProvider, {\n    value: treeContext,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 86,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_CheckTreeView.default, (0, _extends2.default)({}, rest, {\n    ref: ref,\n    value: value,\n    cascade: cascade,\n    data: treeData,\n    virtualized: virtualized,\n    loadingNodeValues: loadingNodeValues,\n    flattenedNodes: flattenedNodes,\n    uncheckableItemValues: uncheckableItemValues,\n    expandItemValues: expandItemValues,\n    onChange: handleChange,\n    onExpand: handleExpandTreeNode,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 87,\n      columnNumber: 9\n    }\n  })));\n});\nCheckTree.displayName = 'CheckTree';\nvar _default = CheckTree;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/CheckTree.tsx?");
+
+/***/ }),
+
+/***/ "./src/CheckTree/CheckTreeNode.tsx":
+/*!*****************************************!*\
+  !*** ./src/CheckTree/CheckTreeNode.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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _ListCheckItem = _interopRequireDefault(__webpack_require__(/*! ../internals/Picker/ListCheckItem */ \"./src/internals/Picker/ListCheckItem.tsx\"));\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../Tree/utils */ \"./src/Tree/utils/index.ts\");\nvar _utils3 = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../Tree/TreeProvider */ \"./src/Tree/TreeProvider.tsx\");\nvar _TreeNodeToggle = _interopRequireDefault(__webpack_require__(/*! ../Tree/TreeNodeToggle */ \"./src/Tree/TreeNodeToggle.tsx\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckTree/CheckTreeNode.tsx\",\n  _this = void 0;\nvar CheckTreeNode = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {\n  var _props$as = props.as,\n    Component = _props$as === void 0 ? 'div' : _props$as,\n    style = props.style,\n    className = props.className,\n    _props$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'check-tree-node' : _props$classPrefix,\n    _props$visible = props.visible,\n    visible = _props$visible === void 0 ? true : _props$visible,\n    layer = props.layer,\n    disabled = props.disabled,\n    allUncheckable = props.allUncheckable,\n    loading = props.loading,\n    expanded = props.expanded,\n    hasChildren = props.hasChildren,\n    nodeData = props.nodeData,\n    focus = props.focus,\n    label = props.label,\n    uncheckable = props.uncheckable,\n    checkState = props.checkState,\n    value = props.value,\n    treeItemRef = props.treeItemRef,\n    onExpand = props.onExpand,\n    onSelect = props.onSelect,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"style\", \"className\", \"classPrefix\", \"visible\", \"layer\", \"disabled\", \"allUncheckable\", \"loading\", \"expanded\", \"hasChildren\", \"nodeData\", \"focus\", \"label\", \"uncheckable\", \"checkState\", \"value\", \"treeItemRef\", \"onExpand\", \"onSelect\"]);\n  var _useCustom = (0, _utils3.useCustom)(),\n    rtl = _useCustom.rtl;\n  var _useTreeContextProps = (0, _TreeProvider.useTreeContextProps)(),\n    renderTreeNode = _useTreeContextProps.renderTreeNode,\n    virtualized = _useTreeContextProps.virtualized;\n  var _useClassNames = (0, _utils3.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge,\n    withClassPrefix = _useClassNames.withClassPrefix;\n  var labelStr = (0, _react.useMemo)(function () {\n    return (0, _utils.stringifyReactNode)(label);\n  }, [label]);\n  var handleExpand = (0, _utils3.useEventCallback)(function (event) {\n    var _event$nativeEvent, _event$nativeEvent$st;\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, expanded);\n  });\n  var handleSelect = (0, _utils3.useEventCallback)(function (_value, event) {\n    var isChecked = false;\n    if (checkState === _utils3.CHECK_STATE.UNCHECK || checkState === _utils3.CHECK_STATE.INDETERMINATE) {\n      isChecked = true;\n    }\n    if (checkState === _utils3.CHECK_STATE.CHECK) {\n      isChecked = false;\n    }\n    var nextNodeData = (0, _extends2.default)({}, nodeData, {\n      check: isChecked\n    });\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(nextNodeData, event);\n  });\n  var classes = merge(className, withClassPrefix({\n    disabled: disabled,\n    'all-uncheckable': !!allUncheckable,\n    'text-muted': disabled,\n    focus: focus\n  }));\n  var styles = virtualized ? (0, _extends2.default)({}, style, (0, _utils2.indentTreeNode)(rtl, layer - 1)) : style;\n  var itemRef = (0, _hooks.useFoucsVirtualListItem)(focus);\n  return visible ? /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    style: styles,\n    className: classes,\n    ref: ref,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 162,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(_TreeNodeToggle.default, {\n    \"aria-label\": (expanded ? 'Collapse' : 'Expand') + (\" \" + labelStr),\n    data: nodeData,\n    expanded: expanded,\n    loading: loading,\n    hasChildren: hasChildren,\n    onClick: handleExpand,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 163,\n      columnNumber: 7\n    }\n  }), /*#__PURE__*/_react.default.createElement(_ListCheckItem.default, {\n    as: \"div\",\n    role: \"treeitem\",\n    ref: (0, _utils3.mergeRefs)(itemRef, treeItemRef),\n    \"aria-label\": labelStr,\n    \"aria-expanded\": expanded,\n    \"aria-checked\": checkState === _utils3.CHECK_STATE.CHECK,\n    \"aria-selected\": focus,\n    \"aria-disabled\": disabled,\n    \"aria-level\": layer,\n    \"data-layer\": layer,\n    active: checkState === _utils3.CHECK_STATE.CHECK,\n    indeterminate: checkState === _utils3.CHECK_STATE.INDETERMINATE,\n    focus: focus,\n    checkable: !uncheckable,\n    disabled: disabled,\n    value: nodeData.refKey || value,\n    className: prefix('content'),\n    title: labelStr,\n    onSelect: handleSelect,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 171,\n      columnNumber: 7\n    }\n  }, typeof renderTreeNode === 'function' ? renderTreeNode(nodeData) : label)) : null;\n});\nCheckTreeNode.displayName = 'CheckTreeNode';\nvar _default = CheckTreeNode;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/CheckTreeNode.tsx?");
+
+/***/ }),
+
+/***/ "./src/CheckTree/CheckTreeView.tsx":
+/*!*****************************************!*\
+  !*** ./src/CheckTree/CheckTreeView.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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _Windowing = __webpack_require__(/*! ../internals/Windowing */ \"./src/internals/Windowing/index.ts\");\nvar _CheckTreeNode = _interopRequireDefault(__webpack_require__(/*! ./CheckTreeNode */ \"./src/CheckTree/CheckTreeNode.tsx\"));\nvar _IndentLine = _interopRequireDefault(__webpack_require__(/*! ../Tree/IndentLine */ \"./src/Tree/IndentLine.tsx\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _Tree = __webpack_require__(/*! ../internals/Tree */ \"./src/internals/Tree/index.ts\");\nvar _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _utils3 = __webpack_require__(/*! ./utils */ \"./src/CheckTree/utils.ts\");\nvar _utils4 = __webpack_require__(/*! ../Tree/utils */ \"./src/Tree/utils/index.ts\");\nvar _useTreeSearch2 = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useTreeSearch */ \"./src/Tree/hooks/useTreeSearch.ts\"));\nvar _useFocusTree2 = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useFocusTree */ \"./src/Tree/hooks/useFocusTree.ts\"));\nvar _useVirtualizedTreeData = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useVirtualizedTreeData */ \"./src/Tree/hooks/useVirtualizedTreeData.ts\"));\nvar _useTreeCheckState2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useTreeCheckState */ \"./src/CheckTree/hooks/useTreeCheckState.ts\"));\nvar _useTreeNodeProps = _interopRequireDefault(__webpack_require__(/*! ./hooks/useTreeNodeProps */ \"./src/CheckTree/hooks/useTreeNodeProps.tsx\"));\nvar _TreeProvider = __webpack_require__(/*! ../Tree/TreeProvider */ \"./src/Tree/TreeProvider.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckTree/CheckTreeView.tsx\",\n  _this = void 0;\n/**\n * Props for the CheckTreeView component.\n */\n\nvar CheckTreeView = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _merge2;\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 ? 'check-tree' : _props$classPrefix,\n    _props$cascade = props.cascade,\n    cascade = _props$cascade === void 0 ? true : _props$cascade,\n    _props$data = props.data,\n    data = _props$data === void 0 ? [] : _props$data,\n    _props$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? [] : _props$disabledItemVa,\n    _props$expandItemValu = props.expandItemValues,\n    expandItemValues = _props$expandItemValu === void 0 ? [] : _props$expandItemValu,\n    _props$height = props.height,\n    height = _props$height === void 0 ? 360 : _props$height,\n    overrideLocale = props.locale,\n    listProps = props.listProps,\n    listRef = props.listRef,\n    style = props.style,\n    searchKeyword = props.searchKeyword,\n    showIndentLine = props.showIndentLine,\n    searchable = props.searchable,\n    searchInputRef = props.searchInputRef,\n    _props$uncheckableIte = props.uncheckableItemValues,\n    uncheckableItemValues = _props$uncheckableIte === void 0 ? [] : _props$uncheckableIte,\n    _props$virtualized = props.virtualized,\n    virtualized = _props$virtualized === void 0 ? false : _props$virtualized,\n    _props$loadingNodeVal = props.loadingNodeValues,\n    loadingNodeValues = _props$loadingNodeVal === void 0 ? [] : _props$loadingNodeVal,\n    _props$flattenedNodes = props.flattenedNodes,\n    flattenedNodes = _props$flattenedNodes === void 0 ? {} : _props$flattenedNodes,\n    searchBy = props.searchBy,\n    onChange = props.onChange,\n    onSearch = props.onSearch,\n    onSelect = props.onSelect,\n    onSelectItem = props.onSelectItem,\n    onScroll = props.onScroll,\n    onExpand = props.onExpand,\n    onFocusItem = props.onFocusItem,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\", \"cascade\", \"data\", \"disabledItemValues\", \"expandItemValues\", \"height\", \"locale\", \"listProps\", \"listRef\", \"style\", \"searchKeyword\", \"showIndentLine\", \"searchable\", \"searchInputRef\", \"uncheckableItemValues\", \"virtualized\", \"loadingNodeValues\", \"flattenedNodes\", \"searchBy\", \"onChange\", \"onSearch\", \"onSelect\", \"onSelectItem\", \"onScroll\", \"onExpand\", \"onFocusItem\"]);\n  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),\n    locale = _useCustom.locale;\n  var _useItemDataKeys = (0, _TreeProvider.useItemDataKeys)(),\n    childrenKey = _useItemDataKeys.childrenKey,\n    valueKey = _useItemDataKeys.valueKey;\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge,\n    withClassPrefix = _useClassNames.withClassPrefix;\n  var _useTreeCheckState = (0, _useTreeCheckState2.default)({\n      cascade: cascade,\n      flattenedNodes: flattenedNodes,\n      uncheckableItemValues: uncheckableItemValues\n    }),\n    getCheckedValues = _useTreeCheckState.getCheckedValues;\n  var handleSearchCallback = function handleSearchCallback(value, _data, event) {\n    onSearch === null || onSearch === void 0 ? void 0 : onSearch(value, event);\n  };\n  var _useTreeSearch = (0, _useTreeSearch2.default)({\n      callback: handleSearchCallback,\n      data: data,\n      searchKeyword: searchKeyword,\n      searchBy: searchBy\n    }),\n    filteredData = _useTreeSearch.filteredData,\n    keyword = _useTreeSearch.keyword,\n    setFilteredData = _useTreeSearch.setFilteredData,\n    handleSearch = _useTreeSearch.handleSearch;\n  var _useFocusTree = (0, _useFocusTree2.default)({\n      filteredData: filteredData,\n      disabledItemValues: disabledItemValues,\n      expandItemValues: expandItemValues,\n      searchKeyword: keyword,\n      flattenedNodes: flattenedNodes,\n      onFocused: onFocusItem,\n      onExpand: onExpand\n    }),\n    focusItemValue = _useFocusTree.focusItemValue,\n    setFocusItemValue = _useFocusTree.setFocusItemValue,\n    onTreeKeydown = _useFocusTree.onTreeKeydown,\n    saveTreeNodeRef = _useFocusTree.saveTreeNodeRef;\n  var transformation = (0, _useVirtualizedTreeData.default)(flattenedNodes, filteredData, {\n    cascade: cascade,\n    expandItemValues: expandItemValues,\n    searchKeyword: keyword\n  });\n\n  /**\n   * Get formatted nodes for render tree\n   * @params render - renderNode function. only used when virtualized setting false\n   */\n  var getFormattedNodes = function getFormattedNodes(render) {\n    if (virtualized) {\n      return transformation().filter(function (item) {\n        return item.visible;\n      });\n    }\n    return (0, _utils3.getFormattedTree)(flattenedNodes, filteredData, {\n      childrenKey: childrenKey,\n      cascade: cascade\n    }).map(function (node) {\n      return render === null || render === void 0 ? void 0 : render(node, 1);\n    }).filter(function (item) {\n      return item;\n    });\n  };\n  var getTreeNodeProps = (0, _useTreeNodeProps.default)({\n    uncheckableItemValues: uncheckableItemValues,\n    disabledItemValues: disabledItemValues,\n    loadingNodeValues: loadingNodeValues,\n    focusItemValue: focusItemValue,\n    flattenedNodes: flattenedNodes,\n    keyword: keyword\n  });\n  (0, _react.useEffect)(function () {\n    setFilteredData(data, keyword);\n  }, [data, keyword, setFilteredData]);\n\n  // TODO-Doma\n  // Replace `getKeyParentMap` with `getParentMap`\n  var itemParentMap = (0, _react.useMemo)(function () {\n    return (0, _utils2.getKeyParentMap)(data, function (node) {\n      return node[valueKey];\n    }, function (node) {\n      return node[childrenKey];\n    });\n  }, [childrenKey, data, valueKey]);\n  var handleSelect = (0, _utils.useEventCallback)(function (node, event) {\n    var currentNode = node.refKey ? flattenedNodes[node.refKey] : null;\n    if (!node || !currentNode) {\n      return;\n    }\n    var checkedValues = getCheckedValues(node, !currentNode.check);\n    var path = (0, _utils2.getPathTowardsItem)(node, function (item) {\n      return itemParentMap.get(item[valueKey]);\n    });\n    setFocusItemValue(node[valueKey]);\n    onChange === null || onChange === void 0 ? void 0 : onChange(checkedValues, event);\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(node, checkedValues, event);\n    onSelectItem === null || onSelectItem === void 0 ? void 0 : onSelectItem(node, path);\n  });\n  var selectActiveItem = function selectActiveItem(event) {\n    if ((0, _isNil.default)(focusItemValue)) return;\n    var activeItem = (0, _utils4.getActiveItem)(focusItemValue, flattenedNodes, valueKey);\n    if (!(0, _utils3.isNodeUncheckable)(activeItem, {\n      uncheckableItemValues: uncheckableItemValues,\n      valueKey: valueKey\n    }) && activeItem !== null) {\n      handleSelect(activeItem, event);\n    }\n  };\n  var handleTreeKeyDown = (0, _utils.useEventCallback)(function (event) {\n    onTreeKeydown(event);\n    (0, _Picker.onMenuKeyDown)(event, {\n      enter: selectActiveItem\n    });\n  });\n  var renderNode = function renderNode(node, layer) {\n    var visible = node.visible,\n      refKey = node.refKey,\n      parent = node.parent; // when searching, all nodes should be expand\n    var expanded = (0, _utils4.isExpand)(keyword, expandItemValues.includes(node[valueKey]));\n    if (!visible) {\n      return null;\n    }\n    var children = node[childrenKey];\n    var hasChildren = keyword ? (0, _utils4.hasVisibleChildren)(node, childrenKey) : Boolean(children);\n    var treeNodeProps = (0, _extends2.default)({}, getTreeNodeProps((0, _extends2.default)({}, node, {\n      parent: parent\n    })), {\n      layer: layer,\n      expanded: expanded,\n      hasChildren: hasChildren,\n      onSelect: handleSelect,\n      onExpand: onExpand\n    });\n    if (hasChildren) {\n      var _merge;\n      layer += 1;\n      var childClassName = merge(prefix('node-children'), (_merge = {}, _merge[prefix('node-expanded')] = expanded, _merge));\n      var nodes = children || [];\n      return /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: childClassName,\n        key: node[valueKey],\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 284,\n          columnNumber: 11\n        }\n      }, /*#__PURE__*/_react.default.createElement(_CheckTreeNode.default, (0, _extends2.default)({}, treeNodeProps, {\n        treeItemRef: function treeItemRef(ref) {\n          return saveTreeNodeRef(ref, refKey);\n        },\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 285,\n          columnNumber: 13\n        }\n      })), /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: prefix('group'),\n        role: \"group\",\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 286,\n          columnNumber: 13\n        }\n      }, nodes.map(function (child) {\n        return renderNode(child, layer);\n      }), showIndentLine && /*#__PURE__*/_react.default.createElement(_IndentLine.default, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 288,\n          columnNumber: 34\n        }\n      })));\n    }\n    return /*#__PURE__*/_react.default.createElement(_CheckTreeNode.default, (0, _extends2.default)({\n      key: node[valueKey],\n      treeItemRef: function treeItemRef(ref) {\n        return saveTreeNodeRef(ref, refKey);\n      }\n    }, treeNodeProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 295,\n        columnNumber: 9\n      }\n    }));\n  };\n  var renderVirtualListNode = function renderVirtualListNode(_ref) {\n    var index = _ref.index,\n      style = _ref.style,\n      data = _ref.data;\n    var node = data[index];\n    var layer = node.layer,\n      refKey = node.refKey,\n      visible = node.visible,\n      hasChildren = node.hasChildren,\n      parent = node.parent;\n    var expanded = (0, _utils4.isExpand)(keyword, expandItemValues.includes(node[valueKey]));\n    var treeNodeProps = (0, _extends2.default)({}, getTreeNodeProps((0, _extends2.default)({}, node, {\n      parent: parent\n    })), {\n      onSelect: handleSelect,\n      onExpand: onExpand,\n      expanded: expanded,\n      layer: layer,\n      hasChildren: hasChildren\n    });\n    return visible && /*#__PURE__*/_react.default.createElement(_CheckTreeNode.default, (0, _extends2.default)({\n      style: style,\n      ref: function ref(_ref2) {\n        return saveTreeNodeRef(_ref2, refKey);\n      }\n    }, treeNodeProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 321,\n        columnNumber: 11\n      }\n    }));\n  };\n  var classes = merge(className, withClassPrefix({\n    'without-children': !(0, _utils3.hasGrandchild)(data, childrenKey),\n    virtualized: virtualized\n  }));\n  var formattedNodes = getFormattedNodes(renderNode);\n  var treeNodesClass = merge(prefix('root'), (_merge2 = {}, _merge2[prefix('all-uncheckable')] = (0, _utils3.isEveryFirstLevelNodeUncheckable)(flattenedNodes, uncheckableItemValues, valueKey), _merge2));\n  return /*#__PURE__*/_react.default.createElement(Component, {\n    ref: ref,\n    className: classes,\n    style: style,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 349,\n      columnNumber: 7\n    }\n  }, searchable ? /*#__PURE__*/_react.default.createElement(_SearchBox.default, {\n    placeholder: locale.searchPlaceholder,\n    onChange: handleSearch,\n    value: keyword,\n    inputRef: searchInputRef,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 351,\n      columnNumber: 11\n    }\n  }) : null, keyword && formattedNodes.length === 0 ? /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('empty'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 360,\n      columnNumber: 11\n    }\n  }, locale.noResultsText) : null, /*#__PURE__*/_react.default.createElement(_Tree.TreeView, (0, _extends2.default)({}, rest, {\n    multiselectable: true,\n    treeRootClassName: treeNodesClass,\n    className: prefix('view'),\n    onScroll: onScroll,\n    onKeyDown: handleTreeKeyDown,\n    style: virtualized ? undefined : {\n      height: height\n    },\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 363,\n      columnNumber: 9\n    }\n  }), virtualized ? /*#__PURE__*/_react.default.createElement(_Windowing.AutoSizer, {\n    defaultHeight: height,\n    style: {\n      width: 'auto',\n      height: 'auto'\n    },\n    className: prefix('virt-auto-sizer'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 373,\n      columnNumber: 13\n    }\n  }, function (_ref3) {\n    var height = _ref3.height;\n    return /*#__PURE__*/_react.default.createElement(_Windowing.List, (0, _extends2.default)({\n      ref: listRef,\n      height: height,\n      itemSize: _Windowing.defaultItemSize,\n      itemCount: formattedNodes.length,\n      itemData: formattedNodes,\n      className: prefix('virt-list')\n    }, listProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 379,\n        columnNumber: 17\n      }\n    }), renderVirtualListNode);\n  }) : formattedNodes));\n});\nCheckTreeView.displayName = 'CheckTreeView';\nvar _default = CheckTreeView;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/CheckTreeView.tsx?");
+
+/***/ }),
+
+/***/ "./src/CheckTree/hooks/useTreeCheckState.ts":
+/*!**************************************************!*\
+  !*** ./src/CheckTree/hooks/useTreeCheckState.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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _cloneDeep = _interopRequireDefault(__webpack_require__(/*! lodash/cloneDeep */ \"./node_modules/lodash/cloneDeep.js\"));\nvar _TreeProvider = __webpack_require__(/*! ../../Tree/TreeProvider */ \"./src/Tree/TreeProvider.tsx\");\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/CheckTree/utils.ts\");\nfunction useTreeCheckState(props) {\n  var cascade = props.cascade,\n    flattenedNodes = props.flattenedNodes,\n    uncheckableItemValues = props.uncheckableItemValues;\n  var _useItemDataKeys = (0, _TreeProvider.useItemDataKeys)(),\n    valueKey = _useItemDataKeys.valueKey,\n    childrenKey = _useItemDataKeys.childrenKey;\n  var checkParentNode = (0, _utils.useEventCallback)(function (nodes, node, checked) {\n    var currentNode = node.refKey ? nodes[node.refKey] : null;\n    if (cascade && currentNode) {\n      if (!checked) {\n        currentNode.check = checked;\n        currentNode.checkAll = checked;\n      } else {\n        if ((0, _utils2.isEveryChildChecked)(currentNode, {\n          nodes: nodes,\n          childrenKey: childrenKey\n        })) {\n          currentNode.check = true;\n          currentNode.checkAll = true;\n        } else {\n          currentNode.check = false;\n          currentNode.checkAll = false;\n        }\n      }\n      if (currentNode.parent) {\n        checkParentNode(nodes, currentNode.parent, checked);\n      }\n    }\n  });\n  var checkChildNode = (0, _utils.useEventCallback)(function (nodes, node, isChecked) {\n    var currentNode = node.refKey ? nodes[node.refKey] : null;\n    if (!currentNode) {\n      return;\n    }\n    currentNode.check = isChecked;\n    if (!currentNode[childrenKey] || !currentNode[childrenKey].length || !cascade) {\n      currentNode.checkAll = false;\n    } else {\n      currentNode.checkAll = isChecked;\n      currentNode[childrenKey].forEach(function (child) {\n        checkChildNode(nodes, child, isChecked);\n      });\n    }\n  });\n  var getCheckedValuesByParent = (0, _react.useCallback)(function (nodes) {\n    var values = [];\n    for (var key in nodes) {\n      var currentNode = nodes[key];\n      if (!(0, _isNil.default)(currentNode.parent) && !(0, _isNil.default)(currentNode.parent.refKey)) {\n        var parentNode = nodes[currentNode.parent.refKey];\n        if (currentNode.check) {\n          if (!(parentNode !== null && parentNode !== void 0 && parentNode.checkAll)) {\n            values.push(currentNode[valueKey]);\n          } else if (parentNode !== null && parentNode !== void 0 && parentNode.uncheckable) {\n            values.push(currentNode[valueKey]);\n          }\n        }\n      } else if (currentNode.check) {\n        values.push(currentNode[valueKey]);\n      }\n    }\n    return values;\n  }, [valueKey]);\n  var getCheckedValues = (0, _utils.useEventCallback)(function (node, isChecked) {\n    var nodes = (0, _cloneDeep.default)(flattenedNodes);\n    checkChildNode(nodes, node, isChecked);\n    if (node.parent) {\n      checkParentNode(nodes, node.parent, isChecked);\n    }\n    var values = getCheckedValuesByParent(nodes);\n    return values.filter(function (v) {\n      return !uncheckableItemValues.includes(v);\n    });\n  });\n  return {\n    getCheckedValues: getCheckedValues\n  };\n}\nvar _default = useTreeCheckState;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/hooks/useTreeCheckState.ts?");
+
+/***/ }),
+
+/***/ "./src/CheckTree/hooks/useTreeNodeProps.tsx":
+/*!**************************************************!*\
+  !*** ./src/CheckTree/hooks/useTreeNodeProps.tsx ***!
+  \**************************************************/
+/***/ (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\");\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/CheckTree/utils.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../../Tree/TreeProvider */ \"./src/Tree/TreeProvider.tsx\");\nvar _Highlight = _interopRequireDefault(__webpack_require__(/*! ../../Highlight */ \"./src/Highlight/index.tsx\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckTree/hooks/useTreeNodeProps.tsx\";\nfunction useTreeNodeProps(props) {\n  var _this = this;\n  var _useItemDataKeys = (0, _TreeProvider.useItemDataKeys)(),\n    valueKey = _useItemDataKeys.valueKey,\n    labelKey = _useItemDataKeys.labelKey;\n  var uncheckableItemValues = props.uncheckableItemValues,\n    disabledItemValues = props.disabledItemValues,\n    loadingNodeValues = props.loadingNodeValues,\n    focusItemValue = props.focusItemValue,\n    flattenedNodes = props.flattenedNodes,\n    keyword = props.keyword;\n  return (0, _react.useCallback)(function (nodeData) {\n    var visible = nodeData.visible,\n      checkState = nodeData.checkState;\n    var value = nodeData[valueKey];\n    var nodeLabel = nodeData[labelKey];\n    var allUncheckable = (0, _utils.isAllSiblingNodeUncheckable)(nodeData, flattenedNodes, uncheckableItemValues, valueKey);\n    var label = keyword ? /*#__PURE__*/_react.default.createElement(_Highlight.default, {\n      as: \"span\",\n      query: keyword,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 40,\n        columnNumber: 9\n      }\n    }, nodeLabel) : nodeLabel;\n    var disabled = (0, _utils.getDisabledState)(flattenedNodes, nodeData, {\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey\n    });\n    var uncheckable = (0, _utils.isNodeUncheckable)(nodeData, {\n      uncheckableItemValues: uncheckableItemValues,\n      valueKey: valueKey\n    });\n    var loading = loadingNodeValues.some(function (item) {\n      return item === nodeData[valueKey];\n    });\n    var focus = focusItemValue === value;\n    return {\n      value: value,\n      label: label,\n      visible: visible,\n      loading: loading,\n      disabled: disabled,\n      nodeData: nodeData,\n      checkState: checkState,\n      uncheckable: uncheckable,\n      allUncheckable: allUncheckable,\n      focus: focus\n    };\n  }, [valueKey, flattenedNodes, uncheckableItemValues, keyword, labelKey, disabledItemValues, loadingNodeValues, focusItemValue]);\n}\nvar _default = useTreeNodeProps;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/hooks/useTreeNodeProps.tsx?");
+
+/***/ }),
+
+/***/ "./src/CheckTree/hooks/useTreeValue.ts":
+/*!*********************************************!*\
+  !*** ./src/CheckTree/hooks/useTreeValue.ts ***!
+  \*********************************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/CheckTree/utils.ts\");\nfunction useTreeValue(controlledValue, _ref) {\n  var defaultValue = _ref.defaultValue,\n    uncheckableItemValues = _ref.uncheckableItemValues;\n  var _useControlled = (0, _utils.useControlled)(controlledValue, defaultValue),\n    value = _useControlled[0],\n    setValue = _useControlled[1],\n    isControlled = _useControlled[2];\n  (0, _utils.useMount)(function () {\n    setValue((0, _utils2.getCheckTreeDefaultValue)(value, uncheckableItemValues));\n  });\n  return [value, setValue, isControlled];\n}\nvar _default = useTreeValue;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/hooks/useTreeValue.ts?");
+
+/***/ }),
+
 /***/ "./src/CheckTree/index.tsx":
 /*!*********************************!*\
   !*** ./src/CheckTree/index.tsx ***!
@@ -6582,18 +6670,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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _CheckTreePicker = _interopRequireDefault(__webpack_require__(/*! ../CheckTreePicker */ \"./src/CheckTreePicker/index.tsx\"));\nvar _TreeContext = _interopRequireDefault(__webpack_require__(/*! ../Tree/TreeContext */ \"./src/Tree/TreeContext.ts\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckTree/index.tsx\",\n  _this = void 0;\n/**\n * The `CheckTree` component is used for selecting multiple options which are organized in a tree structure.\n * @see https://rsuitejs.com/components/check-tree\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: 26,\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: 27,\n      columnNumber: 9\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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _CheckTree = _interopRequireDefault(__webpack_require__(/*! ./CheckTree */ \"./src/CheckTree/CheckTree.tsx\"));\nvar _default = _CheckTree.default;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/index.tsx?");
 
 /***/ }),
 
-/***/ "./src/CheckTreePicker/CheckTreeNode.tsx":
-/*!***********************************************!*\
-  !*** ./src/CheckTreePicker/CheckTreeNode.tsx ***!
-  \***********************************************/
+/***/ "./src/CheckTree/utils.ts":
+/*!********************************!*\
+  !*** ./src/CheckTree/utils.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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _ArrowDown = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/ArrowDown */ \"./node_modules/@rsuite/icons/legacy/ArrowDown.js\"));\nvar _Spinner = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/Spinner */ \"./node_modules/@rsuite/icons/legacy/Spinner.js\"));\nvar _ListCheckItem = _interopRequireDefault(__webpack_require__(/*! ../internals/Picker/ListCheckItem */ \"./src/internals/Picker/ListCheckItem.tsx\"));\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckTreePicker/CheckTreeNode.tsx\",\n  _this = void 0;\nvar CheckTreeNode = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {\n  var _ref$as = _ref.as,\n    Component = _ref$as === void 0 ? 'div' : _ref$as,\n    style = _ref.style,\n    className = _ref.className,\n    _ref$classPrefix = _ref.classPrefix,\n    classPrefix = _ref$classPrefix === void 0 ? 'check-tree-node' : _ref$classPrefix,\n    _ref$visible = _ref.visible,\n    visible = _ref$visible === void 0 ? true : _ref$visible,\n    layer = _ref.layer,\n    disabled = _ref.disabled,\n    allUncheckable = _ref.allUncheckable,\n    rtl = _ref.rtl,\n    loading = _ref.loading,\n    expand = _ref.expand,\n    hasChildren = _ref.hasChildren,\n    nodeData = _ref.nodeData,\n    focus = _ref.focus,\n    label = _ref.label,\n    uncheckable = _ref.uncheckable,\n    checkState = _ref.checkState,\n    value = _ref.value,\n    onExpand = _ref.onExpand,\n    onSelect = _ref.onSelect,\n    renderTreeIcon = _ref.renderTreeIcon,\n    renderTreeNode = _ref.renderTreeNode,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, [\"as\", \"style\", \"className\", \"classPrefix\", \"visible\", \"layer\", \"disabled\", \"allUncheckable\", \"rtl\", \"loading\", \"expand\", \"hasChildren\", \"nodeData\", \"focus\", \"label\", \"uncheckable\", \"checkState\", \"value\", \"onExpand\", \"onSelect\", \"renderTreeIcon\", \"renderTreeNode\"]);\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge,\n    withClassPrefix = _useClassNames.withClassPrefix;\n  var getTitle = function getTitle() {\n    if (typeof label === 'string') {\n      return label;\n    } else if ( /*#__PURE__*/_react.default.isValidElement(label)) {\n      var nodes = (0, _utils.reactToString)(label);\n      return nodes.join('');\n    }\n  };\n  var handleExpand = (0, _utils.useEventCallback)(function (event) {\n    var _event$nativeEvent, _event$nativeEvent$st;\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  });\n  var handleSelect = (0, _utils.useEventCallback)(function (_value, event) {\n    if (disabled || uncheckable) {\n      return;\n    }\n    var isChecked = false;\n    if (checkState === _utils.CHECK_STATE.UNCHECK || checkState === _utils.CHECK_STATE.INDETERMINATE) {\n      isChecked = true;\n    }\n    if (checkState === _utils.CHECK_STATE.CHECK) {\n      isChecked = false;\n    }\n    var nextNodeData = (0, _extends2.default)({}, nodeData, {\n      check: isChecked\n    });\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(nextNodeData, event);\n  });\n  var renderIcon = function renderIcon() {\n    var expandIconClasses = prefix('expand-icon', 'icon', {\n      expanded: expand\n    });\n    var expandIcon = /*#__PURE__*/_react.default.createElement(_ArrowDown.default, {\n      className: expandIconClasses,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 114,\n        columnNumber: 24\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: 118,\n          columnNumber: 11\n        }\n      }, /*#__PURE__*/_react.default.createElement(_Spinner.default, {\n        spin: true,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 119,\n          columnNumber: 13\n        }\n      }));\n    }\n    if (typeof renderTreeIcon === 'function') {\n      var customIcon = renderTreeIcon(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: 128,\n          columnNumber: 13\n        }\n      }, customIcon) : expandIcon;\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: 134,\n        columnNumber: 9\n      }\n    }, expandIcon) : null;\n  };\n  var classes = merge(className, withClassPrefix({\n    disabled: disabled,\n    'all-uncheckable': !!allUncheckable,\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)({}, rest, {\n    style: styles,\n    className: classes,\n    ref: ref,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 158,\n      columnNumber: 7\n    }\n  }), renderIcon(), /*#__PURE__*/_react.default.createElement(_ListCheckItem.default, {\n    as: \"div\",\n    role: \"treeitem\",\n    \"aria-label\": label,\n    \"aria-expanded\": expand,\n    \"aria-selected\": checkState === _utils.CHECK_STATE.CHECK,\n    \"aria-disabled\": disabled,\n    \"aria-level\": layer,\n    active: checkState === _utils.CHECK_STATE.CHECK,\n    indeterminate: checkState === _utils.CHECK_STATE.INDETERMINATE,\n    focus: focus,\n    checkable: !uncheckable,\n    disabled: disabled,\n    \"data-layer\": layer,\n    value: nodeData.refKey || value,\n    className: prefix('label'),\n    title: getTitle(),\n    onSelect: handleSelect,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 160,\n      columnNumber: 9\n    }\n  }, /*#__PURE__*/_react.default.createElement(\"span\", {\n    className: prefix('label-content'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 179,\n      columnNumber: 11\n    }\n  }, typeof renderTreeNode === 'function' ? renderTreeNode(nodeData) : label))) : null;\n});\nCheckTreeNode.displayName = 'CheckTreeNode';\nvar _default = CheckTreeNode;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CheckTreePicker/CheckTreeNode.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports.isEveryChildChecked = isEveryChildChecked;\nexports.isSomeChildChecked = isSomeChildChecked;\nexports.hasGrandchild = hasGrandchild;\nexports.isAllSiblingNodeUncheckable = isAllSiblingNodeUncheckable;\nexports.isEveryFirstLevelNodeUncheckable = isEveryFirstLevelNodeUncheckable;\nexports.isNodeUncheckable = isNodeUncheckable;\nexports.getFormattedTree = getFormattedTree;\nexports.getDisabledState = getDisabledState;\nexports.getCheckTreeDefaultValue = getCheckTreeDefaultValue;\nexports.getSelectedItems = getSelectedItems;\nexports.getNodeCheckState = getNodeCheckState;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _isUndefined2 = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\nvar _isNil2 = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../Tree/utils */ \"./src/Tree/utils/index.ts\");\nvar _attachParent = __webpack_require__(/*! ../utils/attachParent */ \"./src/utils/attachParent.ts\");\n/**\n * Retrieves the children of a given parent node from a flattened node map.\n */\nfunction getChildrenByFlattenNodes(nodes, parent) {\n  if (!(0, _isNil2.default)(parent.refKey) && (0, _isNil2.default)(nodes[parent.refKey])) {\n    return [];\n  }\n  return Object.values(nodes).filter(function (item) {\n    var _item$parent;\n    return (item === null || item === void 0 ? void 0 : (_item$parent = item.parent) === null || _item$parent === void 0 ? void 0 : _item$parent.refKey) === parent.refKey && item.refKey && !nodes[item.refKey].uncheckable;\n  });\n}\n\n/**\n * Checks if every child of a given parent node is checked.\n */\nfunction isEveryChildChecked(parent, options) {\n  var nodes = options.nodes,\n    childrenKey = options.childrenKey;\n  if ((0, _isNil2.default)(parent.refKey) || (0, _isNil2.default)(nodes[parent.refKey])) {\n    return false;\n  }\n  var children = getChildrenByFlattenNodes(nodes, parent);\n  if (!children.length) {\n    var _nodes$parent$refKey$;\n    return (_nodes$parent$refKey$ = nodes[parent.refKey].check) !== null && _nodes$parent$refKey$ !== void 0 ? _nodes$parent$refKey$ : false;\n  }\n  return children.every(function (child) {\n    var _child$childrenKey;\n    if ((child === null || child === void 0 ? void 0 : (_child$childrenKey = child[childrenKey]) === null || _child$childrenKey === void 0 ? void 0 : _child$childrenKey.length) > 0) {\n      // fix: #3559\n      return isEveryChildChecked(child, {\n        nodes: nodes,\n        childrenKey: childrenKey\n      });\n    }\n    return !(0, _isNil2.default)(child.refKey) && nodes[child.refKey].check;\n  });\n}\n\n/**\n * Checks if any child node is checked.\n */\nfunction isSomeChildChecked(nodes, parent, childrenKey) {\n  if (!(0, _isNil2.default)(parent.refKey) && (0, _isNil2.default)(nodes[parent.refKey])) {\n    return false;\n  }\n  var children = getChildrenByFlattenNodes(nodes, parent);\n  return children.some(function (child) {\n    var _child$childrenKey2;\n    if ((child === null || child === void 0 ? void 0 : (_child$childrenKey2 = child[childrenKey]) === null || _child$childrenKey2 === void 0 ? void 0 : _child$childrenKey2.length) > 0) {\n      return isSomeChildChecked(nodes, child, childrenKey);\n    }\n    return !(0, _isNil2.default)(child.refKey) && nodes[child.refKey].check;\n  });\n}\n\n/**\n * Checks if any node in the data has a grandchild.\n */\nfunction hasGrandchild(data, childrenKey) {\n  return data.some(function (node) {\n    return Array.isArray(node[childrenKey]);\n  });\n}\n\n/**\n * Checks if all sibling nodes of a given node are uncheckable.\n */\nfunction isAllSiblingNodeUncheckable(node, nodes, uncheckableItemValues, valueKey) {\n  var list = [];\n  var parentNodeRefKey = node.parent ? node.parent.refKey : '';\n  Object.keys(nodes).forEach(function (refKey) {\n    var _curNode$parent;\n    var curNode = nodes[refKey];\n    if ((0, _isNil2.default)(node.parent) && (0, _isNil2.default)(curNode.parent)) {\n      list.push(curNode);\n    } else if (((_curNode$parent = curNode.parent) === null || _curNode$parent === void 0 ? void 0 : _curNode$parent.refKey) === parentNodeRefKey) {\n      list.push(curNode);\n    }\n  });\n  return list.every(function (node) {\n    return isNodeUncheckable(node, {\n      uncheckableItemValues: uncheckableItemValues,\n      valueKey: valueKey\n    });\n  });\n}\n\n/**\n * Checks if every first-level node is uncheckable based on the provided criteria.\n */\nfunction isEveryFirstLevelNodeUncheckable(nodes, uncheckableItemValues, valueKey) {\n  var list = [];\n  Object.keys(nodes).forEach(function (refKey) {\n    var curNode = nodes[refKey];\n    if (!curNode.parent) {\n      list.push(curNode);\n    }\n  });\n  return list.every(function (node) {\n    return isNodeUncheckable(node, {\n      uncheckableItemValues: uncheckableItemValues,\n      valueKey: valueKey\n    });\n  });\n}\n\n/**\n * Checks if a node is uncheckable.\n */\nfunction isNodeUncheckable(node, props) {\n  var _props$uncheckableIte = props.uncheckableItemValues,\n    uncheckableItemValues = _props$uncheckableIte === void 0 ? [] : _props$uncheckableIte,\n    valueKey = props.valueKey;\n  return uncheckableItemValues.some(function (value) {\n    return node[valueKey] === value;\n  });\n}\nfunction getFormattedTree(nodes, data, props) {\n  var childrenKey = props.childrenKey,\n    cascade = props.cascade;\n  return data.map(function (node) {\n    var formatted = (0, _extends2.default)({}, node);\n    var curNode = nodes[node.refKey];\n    if (curNode) {\n      var _node$childrenKey;\n      var checkState = !(0, _isUndefined2.default)(cascade) ? getNodeCheckState(curNode, {\n        cascade: cascade,\n        nodes: nodes,\n        childrenKey: childrenKey\n      }) : undefined;\n      formatted.check = curNode.check;\n      formatted.uncheckable = curNode.uncheckable;\n      (0, _attachParent.attachParent)(formatted, curNode.parent);\n      formatted.checkState = checkState;\n      if (((_node$childrenKey = node[childrenKey]) === null || _node$childrenKey === void 0 ? void 0 : _node$childrenKey.length) > 0) {\n        formatted[childrenKey] = getFormattedTree(nodes, formatted[childrenKey], props);\n      }\n    }\n    return formatted;\n  });\n}\n\n/**\n * Determines the disabled state of a tree node.\n */\nfunction getDisabledState(nodes, node, props) {\n  var _props$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? [] : _props$disabledItemVa,\n    valueKey = props.valueKey;\n  if (!(0, _isNil2.default)(node.refKey) && (0, _isNil2.default)(nodes[node.refKey])) {\n    return false;\n  }\n  return disabledItemValues.some(function (value) {\n    return node.refKey && nodes[node.refKey][valueKey] === value;\n  });\n}\n\n/**\n * Returns the default value for the check tree.\n */\nfunction getCheckTreeDefaultValue(value, uncheckableItemValues) {\n  if (Array.isArray(value) && Array.isArray(uncheckableItemValues)) {\n    return value.filter(function (v) {\n      return !uncheckableItemValues.includes(v);\n    });\n  }\n  return [];\n}\n\n/**\n * Retrieves the selected items from the given nodes.\n */\nfunction getSelectedItems(nodes, values) {\n  var checkedItems = [];\n  values.forEach(function (value) {\n    var refKey = (0, _utils2.formatNodeRefKey)(value);\n    var node = nodes[refKey];\n    if (!(0, _isNil2.default)(node)) {\n      checkedItems.push(node);\n    }\n  });\n  return checkedItems;\n}\n/**\n * Calculates the check state of a node in a check tree.\n */\nfunction getNodeCheckState(node, options) {\n  var nodes = options.nodes,\n    cascade = options.cascade,\n    childrenKey = options.childrenKey;\n  if (node.refKey === undefined) {\n    return _utils.CHECK_STATE.UNCHECK;\n  }\n  if ((0, _isNil2.default)(nodes[node.refKey])) {\n    return _utils.CHECK_STATE.UNCHECK;\n  }\n  if (!node[childrenKey] || !node[childrenKey].length || !cascade) {\n    nodes[node.refKey].checkAll = false;\n    return node.check ? _utils.CHECK_STATE.CHECK : _utils.CHECK_STATE.UNCHECK;\n  }\n  if (isEveryChildChecked(node, {\n    nodes: nodes,\n    childrenKey: childrenKey\n  })) {\n    nodes[node.refKey].checkAll = true;\n    nodes[node.refKey].check = true;\n    return _utils.CHECK_STATE.CHECK;\n  }\n  if (isSomeChildChecked(nodes, node, childrenKey)) {\n    nodes[node.refKey].checkAll = false;\n    return _utils.CHECK_STATE.INDETERMINATE;\n  }\n  return _utils.CHECK_STATE.UNCHECK;\n}\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/utils.ts?");
 
 /***/ }),
 
@@ -6604,29 +6692,29 @@ 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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _isUndefined2 = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\nvar _cloneDeep2 = _interopRequireDefault(__webpack_require__(/*! lodash/cloneDeep */ \"./node_modules/lodash/cloneDeep.js\"));\nvar _omit2 = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _isFunction2 = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _pick2 = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _isNil2 = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ \"./node_modules/classnames/index.js\"));\nvar _Windowing = __webpack_require__(/*! ../internals/Windowing */ \"./src/internals/Windowing/index.ts\");\nvar _CheckTreeNode = _interopRequireDefault(__webpack_require__(/*! ./CheckTreeNode */ \"./src/CheckTreePicker/CheckTreeNode.tsx\"));\nvar _TreeContext = _interopRequireDefault(__webpack_require__(/*! ../Tree/TreeContext */ \"./src/Tree/TreeContext.ts\"));\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/CheckTreePicker/utils.ts\");\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckTreePicker/CheckTreePicker.tsx\",\n  _this = void 0;\nvar emptyArray = [];\nvar itemSize = function itemSize() {\n  return 36;\n};\n\n/**\n * The `CheckTreePicker` component is used for selecting multiple options which are organized in a tree structure.\n *\n * @see https://rsuitejs.com/components/check-tree-picker\n */\nvar CheckTreePicker = /*#__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    style = props.style,\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$countable = props.countable,\n    countable = _props$countable === void 0 ? true : _props$countable,\n    searchBy = props.searchBy,\n    toggleAs = props.toggleAs,\n    searchKeyword = props.searchKeyword,\n    showIndentLine = props.showIndentLine,\n    overrideLocale = props.locale,\n    _props$cascade = props.cascade,\n    cascade = _props$cascade === void 0 ? true : _props$cascade,\n    disabled = props.disabled,\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$placement = props.placement,\n    placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n    _props$childrenKey = props.childrenKey,\n    childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,\n    placeholder = props.placeholder,\n    controlledValue = props.value,\n    _props$defaultValue = props.defaultValue,\n    defaultValue = _props$defaultValue === void 0 ? emptyArray : _props$defaultValue,\n    _props$defaultExpandA = props.defaultExpandAll,\n    defaultExpandAll = _props$defaultExpandA === void 0 ? false : _props$defaultExpandA,\n    _props$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,\n    controlledExpandItemValues = props.expandItemValues,\n    _props$defaultExpandI = props.defaultExpandItemValues,\n    defaultExpandItemValues = _props$defaultExpandI === void 0 ? emptyArray : _props$defaultExpandI,\n    _props$height = props.height,\n    height = _props$height === void 0 ? 360 : _props$height,\n    _props$menuMaxHeight = props.menuMaxHeight,\n    menuMaxHeight = _props$menuMaxHeight === void 0 ? 320 : _props$menuMaxHeight,\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    className = props.className,\n    _props$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n    menuClassName = props.menuClassName,\n    _props$menuAutoWidth = props.menuAutoWidth,\n    menuAutoWidth = _props$menuAutoWidth === void 0 ? true : _props$menuAutoWidth,\n    _props$uncheckableIte = props.uncheckableItemValues,\n    uncheckableItemValues = _props$uncheckableIte === void 0 ? emptyArray : _props$uncheckableIte,\n    id = props.id,\n    listProps = props.listProps,\n    renderMenu = props.renderMenu,\n    getChildren = props.getChildren,\n    renderExtraFooter = props.renderExtraFooter,\n    onEntered = props.onEntered,\n    onChange = props.onChange,\n    onClean = props.onClean,\n    onExited = props.onExited,\n    onSearch = props.onSearch,\n    onSelect = props.onSelect,\n    onSelectItem = props.onSelectItem,\n    onScroll = props.onScroll,\n    onExpand = props.onExpand,\n    renderValue = props.renderValue,\n    renderTreeIcon = props.renderTreeIcon,\n    renderTreeNode = props.renderTreeNode,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"data\", \"style\", \"appearance\", \"cleanable\", \"countable\", \"searchBy\", \"toggleAs\", \"searchKeyword\", \"showIndentLine\", \"locale\", \"cascade\", \"disabled\", \"valueKey\", \"labelKey\", \"placement\", \"childrenKey\", \"placeholder\", \"value\", \"defaultValue\", \"defaultExpandAll\", \"disabledItemValues\", \"expandItemValues\", \"defaultExpandItemValues\", \"height\", \"menuMaxHeight\", \"menuStyle\", \"searchable\", \"virtualized\", \"className\", \"classPrefix\", \"menuClassName\", \"menuAutoWidth\", \"uncheckableItemValues\", \"id\", \"listProps\", \"renderMenu\", \"getChildren\", \"renderExtraFooter\", \"onEntered\", \"onChange\", \"onClean\", \"onExited\", \"onSearch\", \"onSelect\", \"onSelectItem\", \"onScroll\", \"onExpand\", \"renderValue\", \"renderTreeIcon\", \"renderTreeNode\"]);\n  var _useContext = (0, _react.useContext)(_TreeContext.default),\n    inline = _useContext.inline;\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref, {\n      inline: inline\n    }),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay,\n    list = _usePickerRef.list,\n    searchInput = _usePickerRef.searchInput,\n    treeView = _usePickerRef.treeView;\n  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),\n    rtl = _useCustom.rtl,\n    locale = _useCustom.locale;\n  var _useState = (0, _react.useState)(false),\n    active = _useState[0],\n    setActive = _useState[1];\n  var _useState2 = (0, _react.useState)(null),\n    activeNode = _useState2[0],\n    setActiveNode = _useState2[1];\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge;\n  var _useClassNames2 = (0, _utils.useClassNames)(inline && classPrefix !== 'picker' ? classPrefix : 'check-tree'),\n    checkTreePrefix = _useClassNames2.prefix,\n    withCheckTreeClassPrefix = _useClassNames2.withClassPrefix;\n  var _useControlled = (0, _utils.useControlled)(controlledValue, defaultValue),\n    value = _useControlled[0],\n    setValue = _useControlled[1],\n    isControlled = _useControlled[2];\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  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  var _useState3 = (0, _react.useState)(null),\n    focusItemValue = _useState3[0],\n    setFocusItemValue = _useState3[1];\n  var _useFlattenTreeData = (0, _treeUtils.useFlattenTreeData)({\n      data: treeData,\n      labelKey: labelKey,\n      valueKey: valueKey,\n      childrenKey: childrenKey,\n      uncheckableItemValues: uncheckableItemValues,\n      callback: function callback(nodes) {\n        // after flattenData, always unSerialize check property value\n        unSerializeList({\n          nodes: nodes,\n          key: 'check',\n          value: value,\n          cascade: cascade,\n          uncheckableItemValues: uncheckableItemValues\n        });\n        forceUpdate();\n      }\n    }),\n    flattenNodes = _useFlattenTreeData.flattenNodes,\n    forceUpdate = _useFlattenTreeData.forceUpdate,\n    formatVirtualizedTreeData = _useFlattenTreeData.formatVirtualizedTreeData,\n    serializeListOnlyParent = _useFlattenTreeData.serializeListOnlyParent,\n    unSerializeList = _useFlattenTreeData.unSerializeList;\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  var _useTreeNodeRefs = (0, _treeUtils.useTreeNodeRefs)(),\n    treeNodesRefs = _useTreeNodeRefs.treeNodesRefs,\n    saveTreeNodeRef = _useTreeNodeRefs.saveTreeNodeRef;\n  /**\n   * get formatted nodes for render tree\n   * @params render - renderNode function. only used when virtualized setting false\n   */\n  var getFormattedNodes = function getFormattedNodes(render) {\n    if (virtualized) {\n      return formatVirtualizedTreeData(flattenNodes, filteredData, expandItemValues, {\n        cascade: cascade,\n        searchKeyword: searchKeywordState\n      }).filter(function (item) {\n        return item.visible;\n      });\n    }\n    return (0, _utils2.getFormattedTree)(flattenNodes, filteredData, {\n      childrenKey: childrenKey,\n      cascade: cascade\n    }).map(function (node) {\n      return render === null || render === void 0 ? void 0 : render(node, 1);\n    });\n  };\n  var getTreeNodeProps = function getTreeNodeProps(node, layer) {\n    return {\n      as: Component,\n      rtl: rtl,\n      value: node[valueKey],\n      label: node[labelKey],\n      layer: layer,\n      focus: focusItemValue === node[valueKey],\n      expand: node.expand,\n      visible: node.visible,\n      loading: loadingNodeValues.some(function (item) {\n        return item === node[valueKey];\n      }),\n      disabled: (0, _utils2.getDisabledState)(flattenNodes, node, {\n        disabledItemValues: disabledItemValues,\n        valueKey: valueKey\n      }),\n      nodeData: node,\n      checkState: node.checkState,\n      uncheckable: (0, _utils2.isNodeUncheckable)(node, {\n        uncheckableItemValues: uncheckableItemValues,\n        valueKey: valueKey\n      }),\n      allUncheckable: (0, _utils2.isAllSiblingNodeUncheckable)(node, flattenNodes, uncheckableItemValues, valueKey),\n      onSelect: handleSelect,\n      onExpand: handleExpand,\n      renderTreeNode: renderTreeNode,\n      renderTreeIcon: renderTreeIcon\n    };\n  };\n  var focusActiveNode = function focusActiveNode() {\n    if (list.current) {\n      (0, _treeUtils.focusToActiveTreeNode)({\n        list: list.current,\n        valueKey: valueKey,\n        selector: \".\" + checkTreePrefix('node-active'),\n        activeNode: activeNode,\n        virtualized: virtualized,\n        container: treeView.current,\n        formattedNodes: getFormattedNodes()\n      });\n    }\n  };\n  (0, _react.useEffect)(function () {\n    setValue((0, _utils2.getCheckTreePickerDefaultValue)(value, uncheckableItemValues));\n  }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\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    unSerializeList({\n      nodes: flattenNodes,\n      key: 'check',\n      value: value,\n      cascade: cascade,\n      uncheckableItemValues: uncheckableItemValues\n    });\n    forceUpdate();\n  }, [cascade, value, uncheckableItemValues, unSerializeList, flattenNodes, forceUpdate]);\n  var toggleUpChecked = (0, _utils.useEventCallback)(function (nodes, node, checked) {\n    var currentNode = node.refKey ? nodes[node.refKey] : null;\n    if (cascade && currentNode) {\n      if (!checked) {\n        currentNode.check = checked;\n        currentNode.checkAll = checked;\n      } else {\n        if ((0, _utils2.isEveryChildChecked)(nodes, currentNode)) {\n          currentNode.check = true;\n          currentNode.checkAll = true;\n        } else {\n          currentNode.check = false;\n          currentNode.checkAll = false;\n        }\n      }\n      if (currentNode.parent) {\n        toggleUpChecked(nodes, currentNode.parent, checked);\n      }\n    }\n  });\n  var toggleDownChecked = (0, _utils.useEventCallback)(function (nodes, node, isChecked) {\n    var currentNode = node.refKey ? nodes[node.refKey] : null;\n    if (!currentNode) {\n      return;\n    }\n    currentNode.check = isChecked;\n    if (!currentNode[childrenKey] || !currentNode[childrenKey].length || !cascade) {\n      currentNode.checkAll = false;\n    } else {\n      currentNode.checkAll = isChecked;\n      currentNode[childrenKey].forEach(function (child) {\n        toggleDownChecked(nodes, child, isChecked);\n      });\n    }\n  });\n  var toggleChecked = (0, _utils.useEventCallback)(function (node, isChecked) {\n    var nodes = (0, _cloneDeep2.default)(flattenNodes);\n    toggleDownChecked(nodes, node, isChecked);\n    node.parent && toggleUpChecked(nodes, node.parent, isChecked);\n    var values = serializeListOnlyParent(nodes, 'check');\n    // filter uncheckableItemValues\n    return values.filter(function (v) {\n      return !uncheckableItemValues.includes(v);\n    });\n  });\n\n  // TODO-Doma\n  // Replace `getKeyParentMap` with `getParentMap`\n  var itemParentMap = (0, _react.useMemo)(function () {\n    return (0, _treeUtils.getKeyParentMap)(data, function (node) {\n      return node[valueKey];\n    }, function (node) {\n      return node[childrenKey];\n    });\n  }, [childrenKey, data, valueKey]);\n  var handleSelect = (0, _utils.useEventCallback)(function (node, event) {\n    var currentNode = node.refKey ? flattenNodes[node.refKey] : null;\n    if (!node || !currentNode) {\n      return;\n    }\n    var selectedValues = toggleChecked(node, !currentNode.check);\n    if (!isControlled) {\n      unSerializeList({\n        nodes: flattenNodes,\n        key: 'check',\n        value: selectedValues,\n        cascade: cascade,\n        uncheckableItemValues: uncheckableItemValues\n      });\n      setValue(selectedValues);\n    }\n    setActiveNode(node);\n    setFocusItemValue(node[valueKey]);\n    onChange === null || onChange === void 0 ? void 0 : onChange(selectedValues, event);\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(node, selectedValues, event);\n    onSelectItem === null || onSelectItem === void 0 ? void 0 : onSelectItem(node, (0, _treeUtils.getPathTowardsItem)(node, function (item) {\n      return itemParentMap.get(item[valueKey]);\n    }));\n  });\n  var handleOpen = (0, _utils.useEventCallback)(function () {\n    setFocusItemValue(activeNode === null || activeNode === void 0 ? void 0 : activeNode[valueKey]);\n    focusActiveNode();\n    setActive(true);\n  });\n  var handleClose = (0, _utils.useEventCallback)(function () {\n    var _target$current;\n    setSearchKeyword('');\n    setFocusItemValue(null);\n    setActive(false);\n\n    /**\n     * when using keyboard toggle picker, should refocus on PickerToggle Component after close picker menu\n     */\n    (_target$current = target.current) === null || _target$current === void 0 ? void 0 : _target$current.focus();\n  });\n  var handleExpand = (0, _utils.useEventCallback)(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    if ((0, _isFunction2.default)(getChildren) && !node.expand && Array.isArray(node[childrenKey]) && node[childrenKey].length === 0) {\n      loadChildren(node, getChildren);\n    }\n  });\n  var handleClean = (0, _utils.useEventCallback)(function (event) {\n    var target = event.target;\n    // exclude searchbox\n    if (target.matches('input[role=\"searchbox\"]') || disabled || !cleanable) {\n      return;\n    }\n    setActiveNode(null);\n    setFocusItemValue(null);\n    if (!isControlled) {\n      setValue([]);\n      unSerializeList({\n        nodes: flattenNodes,\n        key: 'check',\n        value: [],\n        cascade: cascade,\n        uncheckableItemValues: uncheckableItemValues\n      });\n    }\n    onChange === null || onChange === void 0 ? void 0 : onChange([], event);\n  });\n  var handleFocusItem = (0, _utils.useEventCallback)(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 = \".\" + checkTreePrefix('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    if (key === _utils.KEY_VALUES.DOWN) {\n      (0, _treeUtils.focusNextItem)(focusProps);\n      return;\n    }\n    if (key === _utils.KEY_VALUES.UP) {\n      (0, _treeUtils.focusPreviousItem)(focusProps);\n    }\n  });\n  var handleLeftArrow = (0, _utils.useEventCallback)(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        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, \".\" + checkTreePrefix('node-label'));\n      }\n    });\n  });\n  var handleRightArrow = (0, _utils.useEventCallback)(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  });\n  var selectActiveItem = function selectActiveItem(event) {\n    if ((0, _isNil2.default)(focusItemValue)) return;\n    var activeItem = (0, _treeUtils.getActiveItem)(focusItemValue, flattenNodes, valueKey);\n    if (!(0, _utils2.isNodeUncheckable)(activeItem, {\n      uncheckableItemValues: uncheckableItemValues,\n      valueKey: valueKey\n    }) && activeItem !== null) {\n      handleSelect(activeItem, event);\n    }\n  };\n  var onPickerKeydown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !focusItemValue || !active,\n    trigger: trigger,\n    target: target,\n    overlay: overlay,\n    searchInput: searchInput,\n    active: active,\n    onExit: handleClean,\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, _utils.useEventCallback)(function (event) {\n    if (!treeView.current) {\n      return;\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  });\n  var renderNode = function renderNode(node, layer) {\n    var visible = node.visible,\n      refKey = node.refKey; // when searching, all nodes should be expand\n    var expand = (0, _treeUtils.getExpandWhenSearching)(searchKeywordState, expandItemValues.includes(node[valueKey]));\n    if (!visible) {\n      return null;\n    }\n    var children = node[childrenKey];\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      /**\n       * spread operator don't copy unenumerable properties\n       * so we need to copy them manually\n       */\n      parent: node.parent,\n      expand: expand\n    }), layer), {\n      hasChildren: visibleChildren\n    });\n    if (nodeProps.hasChildren) {\n      var _merge;\n      layer += 1;\n      var openClass = checkTreePrefix('open');\n      var childrenClass = merge(checkTreePrefix('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: 644,\n          columnNumber: 9\n        }\n      }, /*#__PURE__*/_react.default.createElement(_CheckTreeNode.default, (0, _extends2.default)({}, nodeProps, {\n        ref: function ref(_ref) {\n          return saveTreeNodeRef(_ref, refKey);\n        },\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 645,\n          columnNumber: 11\n        }\n      })), /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: checkTreePrefix('group'),\n        role: \"group\",\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 646,\n          columnNumber: 11\n        }\n      }, nodes.map(function (child) {\n        return renderNode(child, layer);\n      }), showIndentLine && /*#__PURE__*/_react.default.createElement(\"span\", {\n        className: checkTreePrefix('indent-line'),\n        style: (0, _treeUtils.getTreeNodeIndent)(rtl, layer - 1, true),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 649,\n          columnNumber: 15\n        }\n      })));\n    }\n    return /*#__PURE__*/_react.default.createElement(_CheckTreeNode.default, (0, _extends2.default)({\n      key: node[valueKey],\n      ref: function ref(_ref2) {\n        return saveTreeNodeRef(_ref2, refKey);\n      }\n    }, nodeProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 660,\n        columnNumber: 7\n      }\n    }));\n  };\n  var renderVirtualListNode = function renderVirtualListNode(_ref3) {\n    var index = _ref3.index,\n      style = _ref3.style,\n      data = _ref3.data;\n    var node = data[index];\n    var layer = node.layer,\n      refKey = node.refKey,\n      visible = node.visible;\n    var expand = (0, _treeUtils.getExpandWhenSearching)(searchKeywordState, expandItemValues.includes(node[valueKey]));\n    var nodeProps = (0, _extends2.default)({}, getTreeNodeProps((0, _extends2.default)({}, node, {\n      /**\n       * spread operator don't copy unenumerable properties\n       * so we need to copy them manually\n       */\n      parent: node.parent,\n      expand: expand\n    }), layer), {\n      hasChildren: node.hasChildren\n    });\n    return visible && /*#__PURE__*/_react.default.createElement(_CheckTreeNode.default, (0, _extends2.default)({\n      style: style,\n      ref: function ref(_ref4) {\n        return saveTreeNodeRef(_ref4, refKey);\n      }\n    }, nodeProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 693,\n        columnNumber: 9\n      }\n    }));\n  };\n  var renderCheckTree = function renderCheckTree() {\n    var _merge2, _merge3;\n    var classes = merge(withCheckTreeClassPrefix({\n      'without-children': !(0, _utils2.isSomeNodeHasChildren)(data, childrenKey),\n      virtualized: virtualized\n    }), (_merge2 = {}, _merge2[className !== null && className !== void 0 ? className : ''] = inline, _merge2));\n    var formattedNodes = getFormattedNodes(renderNode);\n    if (!formattedNodes.some(function (v) {\n      return v !== null;\n    })) {\n      return /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: prefix('none'),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 710,\n          columnNumber: 14\n        }\n      }, locale.noResultsText);\n    }\n    var treeNodesClass = merge(checkTreePrefix('root'), (_merge3 = {}, _merge3[checkTreePrefix('all-uncheckable')] = (0, _utils2.isEveryFirstLevelNodeUncheckable)(flattenNodes, uncheckableItemValues, valueKey), _merge3));\n    var treeViewProps = {\n      ref: treeView\n    };\n    if (inline) {\n      treeViewProps = (0, _extends2.default)({\n        ref: root,\n        style: (0, _extends2.default)({\n          height: height\n        }, style)\n      }, rest);\n    }\n    return /*#__PURE__*/_react.default.createElement(_Picker.TreeView, (0, _extends2.default)({}, treeViewProps, {\n      multiselectable: true,\n      treeRootClassName: treeNodesClass,\n      className: classes,\n      onScroll: onScroll,\n      onKeyDown: inline ? handleTreeKeydown : undefined,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 734,\n        columnNumber: 7\n      }\n    }), virtualized ? /*#__PURE__*/_react.default.createElement(_Windowing.AutoSizer, {\n      defaultHeight: inline ? height : menuMaxHeight,\n      style: {\n        width: 'auto',\n        height: 'auto'\n      },\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 743,\n        columnNumber: 11\n      }\n    }, function (_ref5) {\n      var height = _ref5.height;\n      return /*#__PURE__*/_react.default.createElement(_Windowing.List, (0, _extends2.default)({\n        ref: list,\n        height: height,\n        itemSize: itemSize,\n        itemCount: formattedNodes.length,\n        itemData: formattedNodes\n      }, listProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 748,\n          columnNumber: 15\n        }\n      }), renderVirtualListNode);\n    }) : formattedNodes);\n  };\n  var renderDropdownMenu = function renderDropdownMenu(positionProps, speakerRef) {\n    var left = positionProps.left,\n      top = positionProps.top,\n      className = positionProps.className;\n    var classes = (0, _classnames.default)(className, menuClassName, prefix('check-tree-menu'));\n    var mergedMenuStyle = (0, _extends2.default)({}, menuStyle, {\n      left: left,\n      top: top\n    });\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      autoWidth: menuAutoWidth,\n      className: classes,\n      style: mergedMenuStyle,\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      onKeyDown: onPickerKeydown,\n      target: trigger,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 773,\n        columnNumber: 7\n      }\n    }, searchable ? /*#__PURE__*/_react.default.createElement(_SearchBox.default, {\n      placeholder: locale.searchPlaceholder,\n      onChange: handleSearch,\n      value: searchKeywordState,\n      inputRef: searchInput,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 782,\n        columnNumber: 11\n      }\n    }) : null, renderMenu ? renderMenu(renderCheckTree()) : renderCheckTree(), renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  var selectedItems = (0, _react.useMemo)(function () {\n    return (0, _utils2.getSelectedItems)(flattenNodes, value);\n  }, [flattenNodes, value]);\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  var hasValidValue = selectedItems.length > 0 || value.length > 0 && (0, _isFunction2.default)(renderValue);\n  var selectedElement = placeholder;\n  if (hasValidValue) {\n    selectedElement = /*#__PURE__*/_react.default.createElement(_Picker.SelectedElement, {\n      selectedItems: selectedItems,\n      countable: countable,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      childrenKey: childrenKey,\n      prefix: prefix,\n      cascade: cascade,\n      locale: locale,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 805,\n        columnNumber: 7\n      }\n    });\n    if ((0, _isFunction2.default)(renderValue)) {\n      selectedElement = renderValue(value, selectedItems, selectedElement);\n      if ((0, _isNil2.default)(selectedElement)) {\n        hasValidValue = false;\n      }\n    }\n  }\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n      classPrefix: classPrefix,\n      appearance: appearance,\n      countable: countable,\n      cleanable: cleanable,\n      disabled: disabled,\n      hasValue: hasValidValue,\n      name: 'check-tree'\n    })),\n    classes = _usePickerClassName[0],\n    usedClassNamePropKeys = _usePickerClassName[1];\n  if (inline) {\n    return renderCheckTree();\n  }\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    id: id,\n    popupType: \"tree\",\n    multiple: true,\n    pickerProps: (0, _pick2.default)(props, _Picker.pickTriggerPropKeys),\n    ref: trigger,\n    placement: placement,\n    onEnter: handleOpen,\n    onEntered: onEntered,\n    onExited: (0, _utils.createChainedFunction)(handleClose, onExited),\n    speaker: renderDropdownMenu,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 840,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    ref: root,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 852,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit2.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys)), {\n    ref: target,\n    appearance: appearance,\n    onKeyDown: onPickerKeydown,\n    onClean: (0, _utils.createChainedFunction)(handleClean, onClean),\n    cleanable: cleanable && !disabled,\n    disabled: disabled,\n    as: toggleAs,\n    hasValue: hasValidValue,\n    active: active,\n    placement: placement,\n    inputValue: value,\n    focusItemValue: focusItemValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 853,\n      columnNumber: 9\n    }\n  }), selectedElement || locale.placeholder)));\n});\nCheckTreePicker.displayName = 'CheckTreePicker';\nCheckTreePicker.propTypes = (0, _extends2.default)({}, _Picker.listPickerPropTypes, {\n  height: _propTypes.default.number,\n  appearance: (0, _propTypes2.oneOf)(['default', 'subtle']),\n  locale: _propTypes.default.any,\n  cascade: _propTypes.default.bool,\n  countable: _propTypes.default.bool,\n  searchable: _propTypes.default.bool,\n  virtualized: _propTypes.default.bool,\n  searchKeyword: _propTypes.default.string,\n  menuAutoWidth: _propTypes.default.bool,\n  defaultExpandAll: _propTypes.default.bool,\n  containerPadding: _propTypes.default.number,\n  disabledItemValues: _propTypes.default.array,\n  expandItemValues: _propTypes.default.array,\n  defaultExpandItemValues: _propTypes.default.array,\n  uncheckableItemValues: _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  searchBy: _propTypes.default.func,\n  onScroll: _propTypes.default.func\n});\nvar _default = CheckTreePicker;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CheckTreePicker/CheckTreePicker.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _omit2 = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _isFunction2 = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _pick2 = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _isNil2 = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ \"./node_modules/classnames/index.js\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _CheckTreeView = _interopRequireDefault(__webpack_require__(/*! ../CheckTree/CheckTreeView */ \"./src/CheckTree/CheckTreeView.tsx\"));\nvar _utils2 = __webpack_require__(/*! ../CheckTree/utils */ \"./src/CheckTree/utils.ts\");\nvar _useTreeValue2 = _interopRequireDefault(__webpack_require__(/*! ../CheckTree/hooks/useTreeValue */ \"./src/CheckTree/hooks/useTreeValue.ts\"));\nvar _useFlattenTree = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useFlattenTree */ \"./src/Tree/hooks/useFlattenTree.ts\"));\nvar _useTreeWithChildren2 = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useTreeWithChildren */ \"./src/Tree/hooks/useTreeWithChildren.ts\"));\nvar _useExpandTree2 = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useExpandTree */ \"./src/Tree/hooks/useExpandTree.ts\"));\nvar _useFocusState2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFocusState */ \"./src/CheckTreePicker/hooks/useFocusState.ts\"));\nvar _TreeProvider = __webpack_require__(/*! ../Tree/TreeProvider */ \"./src/Tree/TreeProvider.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckTreePicker/CheckTreePicker.tsx\",\n  _this = void 0;\n/**\n * The `CheckTreePicker` component is used for selecting multiple options which are organized in a tree structure.\n *\n * @see https://rsuitejs.com/components/check-tree-picker\n */\nvar CheckTreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$as = props.as,\n    Component = _props$as === void 0 ? 'div' : _props$as,\n    id = props.id,\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$countable = props.countable,\n    countable = _props$countable === void 0 ? true : _props$countable,\n    _props$cascade = props.cascade,\n    cascade = _props$cascade === void 0 ? true : _props$cascade,\n    _props$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n    _props$childrenKey = props.childrenKey,\n    childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,\n    disabled = props.disabled,\n    _props$data = props.data,\n    data = _props$data === void 0 ? [] : _props$data,\n    _props$defaultValue = props.defaultValue,\n    defaultValue = _props$defaultValue === void 0 ? [] : _props$defaultValue,\n    _props$defaultExpandA = props.defaultExpandAll,\n    defaultExpandAll = _props$defaultExpandA === void 0 ? false : _props$defaultExpandA,\n    _props$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? [] : _props$disabledItemVa,\n    controlledExpandItemValues = props.expandItemValues,\n    _props$defaultExpandI = props.defaultExpandItemValues,\n    defaultExpandItemValues = _props$defaultExpandI === void 0 ? [] : _props$defaultExpandI,\n    placeholder = props.placeholder,\n    popupClassName = props.popupClassName,\n    popupStyle = props.popupStyle,\n    _props$popupAutoWidth = props.popupAutoWidth,\n    popupAutoWidth = _props$popupAutoWidth === void 0 ? true : _props$popupAutoWidth,\n    _props$placement = props.placement,\n    placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n    _props$treeHeight = props.treeHeight,\n    treeHeight = _props$treeHeight === void 0 ? 320 : _props$treeHeight,\n    toggleAs = props.toggleAs,\n    _props$menuAutoWidth = props.menuAutoWidth,\n    menuAutoWidth = _props$menuAutoWidth === void 0 ? popupAutoWidth : _props$menuAutoWidth,\n    DEPRECATED_menuClassName = props.menuClassName,\n    DEPRECATED_menuStyle = props.menuStyle,\n    style = props.style,\n    searchBy = props.searchBy,\n    searchKeyword = props.searchKeyword,\n    showIndentLine = props.showIndentLine,\n    _props$searchable = props.searchable,\n    searchable = _props$searchable === void 0 ? true : _props$searchable,\n    _props$valueKey = props.valueKey,\n    valueKey = _props$valueKey === void 0 ? 'value' : _props$valueKey,\n    controlledValue = props.value,\n    _props$virtualized = props.virtualized,\n    virtualized = _props$virtualized === void 0 ? false : _props$virtualized,\n    _props$uncheckableIte = props.uncheckableItemValues,\n    uncheckableItemValues = _props$uncheckableIte === void 0 ? [] : _props$uncheckableIte,\n    overrideLocale = props.locale,\n    _props$labelKey = props.labelKey,\n    labelKey = _props$labelKey === void 0 ? 'label' : _props$labelKey,\n    listProps = props.listProps,\n    getChildren = props.getChildren,\n    renderExtraFooter = props.renderExtraFooter,\n    onEnter = props.onEnter,\n    onChange = props.onChange,\n    onClean = props.onClean,\n    onExit = props.onExit,\n    onSearch = props.onSearch,\n    onSelect = props.onSelect,\n    onSelectItem = props.onSelectItem,\n    onScroll = props.onScroll,\n    onExpand = props.onExpand,\n    renderValue = props.renderValue,\n    DEPRECATED_renderMenu = props.renderMenu,\n    _props$renderTree = props.renderTree,\n    renderTree = _props$renderTree === void 0 ? DEPRECATED_renderMenu : _props$renderTree,\n    renderTreeIcon = props.renderTreeIcon,\n    renderTreeNode = props.renderTreeNode,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"id\", \"appearance\", \"cleanable\", \"countable\", \"cascade\", \"classPrefix\", \"childrenKey\", \"disabled\", \"data\", \"defaultValue\", \"defaultExpandAll\", \"disabledItemValues\", \"expandItemValues\", \"defaultExpandItemValues\", \"placeholder\", \"popupClassName\", \"popupStyle\", \"popupAutoWidth\", \"placement\", \"treeHeight\", \"toggleAs\", \"menuAutoWidth\", \"menuClassName\", \"menuStyle\", \"style\", \"searchBy\", \"searchKeyword\", \"showIndentLine\", \"searchable\", \"valueKey\", \"value\", \"virtualized\", \"uncheckableItemValues\", \"locale\", \"labelKey\", \"listProps\", \"getChildren\", \"renderExtraFooter\", \"onEnter\", \"onChange\", \"onClean\", \"onExit\", \"onSearch\", \"onSelect\", \"onSelectItem\", \"onScroll\", \"onExpand\", \"renderValue\", \"renderMenu\", \"renderTree\", \"renderTreeIcon\", \"renderTreeNode\"]);\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay,\n    list = _usePickerRef.list,\n    searchInput = _usePickerRef.searchInput,\n    treeView = _usePickerRef.treeView;\n  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),\n    locale = _useCustom.locale;\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix;\n  var _useTreeValue = (0, _useTreeValue2.default)(controlledValue, {\n      defaultValue: defaultValue,\n      uncheckableItemValues: uncheckableItemValues\n    }),\n    value = _useTreeValue[0],\n    setValue = _useTreeValue[1];\n  var itemDataKeys = {\n    childrenKey: childrenKey,\n    labelKey: labelKey,\n    valueKey: valueKey\n  };\n  var _useTreeWithChildren = (0, _useTreeWithChildren2.default)(data, itemDataKeys),\n    treeData = _useTreeWithChildren.treeData,\n    loadingNodeValues = _useTreeWithChildren.loadingNodeValues,\n    appendChild = _useTreeWithChildren.appendChild;\n  var _useExpandTree = (0, _useExpandTree2.default)(data, (0, _extends2.default)({}, itemDataKeys, {\n      defaultExpandAll: defaultExpandAll,\n      defaultExpandItemValues: defaultExpandItemValues,\n      controlledExpandItemValues: controlledExpandItemValues,\n      onExpand: onExpand,\n      getChildren: getChildren,\n      appendChild: appendChild\n    })),\n    expandItemValues = _useExpandTree.expandItemValues,\n    handleExpandTreeNode = _useExpandTree.handleExpandTreeNode;\n  var flattenedNodes = (0, _useFlattenTree.default)(treeData, (0, _extends2.default)({}, itemDataKeys, {\n    uncheckableItemValues: uncheckableItemValues,\n    multiple: true,\n    cascade: cascade,\n    value: value\n  }));\n  var selectedNodes = (0, _utils2.getSelectedItems)(flattenedNodes, value);\n  var _useTreeImperativeHan = (0, _TreeProvider.useTreeImperativeHandle)(),\n    register = _useTreeImperativeHan.register,\n    focusFirstNode = _useTreeImperativeHan.focusFirstNode;\n  var _useFocusState = (0, _useFocusState2.default)({\n      target: target,\n      onEnter: onEnter,\n      onExit: onExit\n    }),\n    focusItemValue = _useFocusState.focusItemValue,\n    setFocusItemValue = _useFocusState.setFocusItemValue,\n    active = _useFocusState.active,\n    triggerProps = _useFocusState.triggerProps;\n  var handleClean = (0, _utils.useEventCallback)(function (event) {\n    var target = event.target;\n    // exclude searchbox\n    if (target.matches('input[role=\"searchbox\"]') || disabled || !cleanable) {\n      return;\n    }\n    setFocusItemValue(null);\n    setValue([]);\n    onChange === null || onChange === void 0 ? void 0 : onChange([], event);\n  });\n  var handleTreeKeyDown = (0, _utils.useEventCallback)(function (event) {\n    (0, _Picker.onMenuKeyDown)(event, {\n      del: handleClean,\n      down: function down() {\n        return focusFirstNode();\n      }\n    });\n  });\n  var onPickerKeydown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !focusItemValue || !active,\n    trigger: trigger,\n    target: target,\n    overlay: overlay,\n    searchInput: searchInput,\n    active: active,\n    onExit: handleClean,\n    onMenuKeyDown: handleTreeKeyDown\n  }, rest));\n  var handleChange = (0, _utils.useEventCallback)(function (nextValue, event) {\n    setValue(nextValue);\n    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n  });\n  var treeContext = (0, _react.useMemo)(function () {\n    return {\n      register: register,\n      props: {\n        labelKey: labelKey,\n        valueKey: valueKey,\n        childrenKey: childrenKey,\n        virtualized: virtualized,\n        renderTreeIcon: renderTreeIcon,\n        renderTreeNode: renderTreeNode\n      }\n    };\n  }, [childrenKey, labelKey, valueKey, virtualized, register, renderTreeIcon, renderTreeNode]);\n  var checkTreeView = /*#__PURE__*/_react.default.createElement(_TreeProvider.TreeProvider, {\n    value: treeContext,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 228,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(_CheckTreeView.default, {\n    ref: treeView,\n    disabledItemValues: disabledItemValues,\n    expandItemValues: expandItemValues,\n    uncheckableItemValues: uncheckableItemValues,\n    cascade: cascade,\n    virtualized: virtualized,\n    data: treeData,\n    height: treeHeight,\n    showIndentLine: showIndentLine,\n    listProps: listProps,\n    listRef: list,\n    searchBy: searchBy,\n    searchable: searchable,\n    searchKeyword: searchKeyword,\n    searchInputRef: searchInput,\n    onScroll: onScroll,\n    onSelect: onSelect,\n    onSelectItem: onSelectItem,\n    onExpand: handleExpandTreeNode,\n    onSearch: onSearch,\n    onChange: handleChange,\n    onFocusItem: setFocusItemValue,\n    value: value,\n    loadingNodeValues: loadingNodeValues,\n    flattenedNodes: flattenedNodes,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 229,\n      columnNumber: 7\n    }\n  }));\n  var renderTreeView = function renderTreeView(positionProps, speakerRef) {\n    var left = positionProps.left,\n      top = positionProps.top,\n      className = positionProps.className;\n    var classes = (0, _classnames.default)(className, popupClassName, DEPRECATED_menuClassName, prefix('check-tree-menu'));\n    var mergedMenuStyle = (0, _extends2.default)({}, popupStyle, DEPRECATED_menuStyle, {\n      left: left,\n      top: top\n    });\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      autoWidth: menuAutoWidth,\n      className: classes,\n      style: mergedMenuStyle,\n      onKeyDown: onPickerKeydown,\n      target: trigger,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 270,\n        columnNumber: 7\n      }\n    }, renderTree ? renderTree(checkTreeView) : checkTreeView, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\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  var hasValidValue = selectedNodes.length > 0 || value.length > 0 && (0, _isFunction2.default)(renderValue);\n  var selectedElement = placeholder;\n  if (hasValidValue) {\n    selectedElement = /*#__PURE__*/_react.default.createElement(_Picker.SelectedElement, {\n      selectedItems: selectedNodes,\n      countable: countable,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      childrenKey: childrenKey,\n      prefix: prefix,\n      cascade: cascade,\n      locale: locale,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 293,\n        columnNumber: 7\n      }\n    });\n    if ((0, _isFunction2.default)(renderValue)) {\n      selectedElement = renderValue(value, selectedNodes, selectedElement);\n      if ((0, _isNil2.default)(selectedElement)) {\n        hasValidValue = false;\n      }\n    }\n  }\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n      classPrefix: classPrefix,\n      appearance: appearance,\n      countable: countable,\n      cleanable: cleanable,\n      disabled: disabled,\n      hasValue: hasValidValue,\n      name: 'check-tree'\n    })),\n    classes = _usePickerClassName[0],\n    usedClassNamePropKeys = _usePickerClassName[1];\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, (0, _extends2.default)({\n    id: id,\n    popupType: \"tree\",\n    multiple: true,\n    pickerProps: (0, _pick2.default)(props, _Picker.pickTriggerPropKeys),\n    ref: trigger,\n    placement: placement,\n    speaker: renderTreeView\n  }, triggerProps, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 324,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    ref: root,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 334,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit2.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys)), {\n    ref: target,\n    appearance: appearance,\n    onKeyDown: onPickerKeydown,\n    onClean: (0, _utils.createChainedFunction)(handleClean, onClean),\n    cleanable: cleanable && !disabled,\n    disabled: disabled,\n    as: toggleAs,\n    hasValue: hasValidValue,\n    active: active,\n    placement: placement,\n    inputValue: value,\n    focusItemValue: focusItemValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 335,\n      columnNumber: 9\n    }\n  }), selectedElement || locale.placeholder)));\n});\nCheckTreePicker.displayName = 'CheckTreePicker';\nvar _default = CheckTreePicker;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CheckTreePicker/CheckTreePicker.tsx?");
 
 /***/ }),
 
-/***/ "./src/CheckTreePicker/index.tsx":
-/*!***************************************!*\
-  !*** ./src/CheckTreePicker/index.tsx ***!
-  \***************************************/
+/***/ "./src/CheckTreePicker/hooks/useFocusState.ts":
+/*!****************************************************!*\
+  !*** ./src/CheckTreePicker/hooks/useFocusState.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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _CheckTreePicker = _interopRequireDefault(__webpack_require__(/*! ./CheckTreePicker */ \"./src/CheckTreePicker/CheckTreePicker.tsx\"));\nvar _default = _CheckTreePicker.default;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CheckTreePicker/index.tsx?");
+eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nfunction useFocusState(props) {\n  var target = props.target;\n  var _useState = (0, _react.useState)(false),\n    active = _useState[0],\n    setActive = _useState[1];\n  var _useState2 = (0, _react.useState)(null),\n    focusItemValue = _useState2[0],\n    setFocusItemValue = _useState2[1];\n  var focusTarget = (0, _utils.useEventCallback)(function () {\n    var _target$current;\n    (_target$current = target.current) === null || _target$current === void 0 ? void 0 : _target$current.focus();\n  });\n  var onEnter = (0, _utils.useEventCallback)(function (node) {\n    var _props$onEnter;\n    setActive(true);\n    (_props$onEnter = props.onEnter) === null || _props$onEnter === void 0 ? void 0 : _props$onEnter.call(props, node);\n  });\n  var onExit = (0, _utils.useEventCallback)(function (node) {\n    var _props$onExit;\n    setActive(false);\n    focusTarget();\n    (_props$onExit = props.onExit) === null || _props$onExit === void 0 ? void 0 : _props$onExit.call(props, node);\n  });\n  return {\n    active: active,\n    focusItemValue: focusItemValue,\n    setFocusItemValue: setFocusItemValue,\n    triggerProps: {\n      onEnter: onEnter,\n      onExit: onExit\n    }\n  };\n}\nvar _default = useFocusState;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CheckTreePicker/hooks/useFocusState.ts?");
 
 /***/ }),
 
-/***/ "./src/CheckTreePicker/utils.ts":
-/*!**************************************!*\
-  !*** ./src/CheckTreePicker/utils.ts ***!
-  \**************************************/
+/***/ "./src/CheckTreePicker/index.tsx":
+/*!***************************************!*\
+  !*** ./src/CheckTreePicker/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\");\nexports.__esModule = true;\nexports.isEveryChildChecked = isEveryChildChecked;\nexports.isSomeChildChecked = isSomeChildChecked;\nexports.isSomeNodeHasChildren = isSomeNodeHasChildren;\nexports.isAllSiblingNodeUncheckable = isAllSiblingNodeUncheckable;\nexports.isEveryFirstLevelNodeUncheckable = isEveryFirstLevelNodeUncheckable;\nexports.isNodeUncheckable = isNodeUncheckable;\nexports.getFormattedTree = getFormattedTree;\nexports.getDisabledState = getDisabledState;\nexports.getCheckTreePickerDefaultValue = getCheckTreePickerDefaultValue;\nexports.getSelectedItems = getSelectedItems;\nexports.getNodeCheckState = getNodeCheckState;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _isUndefined2 = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\nvar _isNil2 = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\nvar _attachParent = __webpack_require__(/*! ../utils/attachParent */ \"./src/utils/attachParent.ts\");\nfunction isEveryChildChecked(nodes, parent) {\n  if ((0, _isNil2.default)(parent.refKey) || (0, _isNil2.default)(nodes[parent.refKey])) {\n    return false;\n  }\n  var children = (0, _treeUtils.getChildrenByFlattenNodes)(nodes, parent);\n  if (!children.length) {\n    var _nodes$parent$refKey$;\n    return (_nodes$parent$refKey$ = nodes[parent.refKey].check) !== null && _nodes$parent$refKey$ !== void 0 ? _nodes$parent$refKey$ : false;\n  }\n  return children.every(function (child) {\n    return !(0, _isNil2.default)(child.refKey) && nodes[child.refKey].check;\n  });\n}\nfunction isSomeChildChecked(nodes, parent, childrenKey) {\n  if (!(0, _isNil2.default)(parent.refKey) && (0, _isNil2.default)(nodes[parent.refKey])) {\n    return false;\n  }\n  var children = (0, _treeUtils.getChildrenByFlattenNodes)(nodes, parent);\n  return children.some(function (child) {\n    var _child$childrenKey;\n    if ((child === null || child === void 0 ? void 0 : (_child$childrenKey = child[childrenKey]) === null || _child$childrenKey === void 0 ? void 0 : _child$childrenKey.length) > 0) {\n      return isSomeChildChecked(nodes, child, childrenKey);\n    }\n    return !(0, _isNil2.default)(child.refKey) && nodes[child.refKey].check;\n  });\n}\nfunction isSomeNodeHasChildren(data, childrenKey) {\n  return data.some(function (node) {\n    return Array.isArray(node[childrenKey]);\n  });\n}\n\n/**\n * is all siblings nodes is uncheckable\n * @param {*} node\n */\nfunction isAllSiblingNodeUncheckable(node, nodes, uncheckableItemValues, valueKey) {\n  var list = [];\n  var parentNodeRefKey = node.parent ? node.parent.refKey : '';\n  Object.keys(nodes).forEach(function (refKey) {\n    var _curNode$parent;\n    var curNode = nodes[refKey];\n    if ((0, _isNil2.default)(node.parent) && (0, _isNil2.default)(curNode.parent)) {\n      list.push(curNode);\n    } else if (((_curNode$parent = curNode.parent) === null || _curNode$parent === void 0 ? void 0 : _curNode$parent.refKey) === parentNodeRefKey) {\n      list.push(curNode);\n    }\n  });\n  return list.every(function (node) {\n    return isNodeUncheckable(node, {\n      uncheckableItemValues: uncheckableItemValues,\n      valueKey: valueKey\n    });\n  });\n}\n\n/**\n * get each first level node uncheckable state\n */\nfunction isEveryFirstLevelNodeUncheckable(nodes, uncheckableItemValues, valueKey) {\n  var list = [];\n  Object.keys(nodes).forEach(function (refKey) {\n    var curNode = nodes[refKey];\n    if (!curNode.parent) {\n      list.push(curNode);\n    }\n  });\n  return list.every(function (node) {\n    return isNodeUncheckable(node, {\n      uncheckableItemValues: uncheckableItemValues,\n      valueKey: valueKey\n    });\n  });\n}\n\n/**\n * get node uncheckable state\n * @param {*} node\n */\nfunction isNodeUncheckable(node, props) {\n  var _props$uncheckableIte = props.uncheckableItemValues,\n    uncheckableItemValues = _props$uncheckableIte === void 0 ? [] : _props$uncheckableIte,\n    valueKey = props.valueKey;\n  return uncheckableItemValues.some(function (value) {\n    return node[valueKey] === value;\n  });\n}\nfunction getFormattedTree(nodes, data, props) {\n  var childrenKey = props.childrenKey,\n    cascade = props.cascade;\n  return data.map(function (node) {\n    var formatted = (0, _extends2.default)({}, node);\n    var curNode = nodes[node.refKey];\n    if (curNode) {\n      var _node$childrenKey;\n      var checkState = !(0, _isUndefined2.default)(cascade) ? getNodeCheckState({\n        node: curNode,\n        cascade: cascade,\n        nodes: nodes,\n        childrenKey: childrenKey\n      }) : undefined;\n      formatted.check = curNode.check;\n      formatted.expand = curNode.expand;\n      formatted.uncheckable = curNode.uncheckable;\n      (0, _attachParent.attachParent)(formatted, curNode.parent);\n      formatted.checkState = checkState;\n      if (((_node$childrenKey = node[childrenKey]) === null || _node$childrenKey === void 0 ? void 0 : _node$childrenKey.length) > 0) {\n        formatted[childrenKey] = getFormattedTree(nodes, formatted[childrenKey], props);\n      }\n    }\n    return formatted;\n  });\n}\nfunction getDisabledState(nodes, node, props) {\n  var _props$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? [] : _props$disabledItemVa,\n    valueKey = props.valueKey;\n  if (!(0, _isNil2.default)(node.refKey) && (0, _isNil2.default)(nodes[node.refKey])) {\n    return false;\n  }\n  return disabledItemValues.some(function (value) {\n    return node.refKey && nodes[node.refKey][valueKey] === value;\n  });\n}\nfunction getCheckTreePickerDefaultValue(value, uncheckableItemValues) {\n  if (Array.isArray(value)) {\n    return value.filter(function (v) {\n      return !uncheckableItemValues.includes(v);\n    });\n  }\n  return [];\n}\nfunction getSelectedItems(nodes, values) {\n  var checkedItems = [];\n  values.forEach(function (value) {\n    var refKey = (0, _treeUtils.getNodeFormattedRefKey)(value);\n    var node = nodes[refKey];\n    if (!(0, _isNil2.default)(node)) {\n      checkedItems.push(node);\n    }\n  });\n  return checkedItems;\n}\nfunction getNodeCheckState(_ref) {\n  var nodes = _ref.nodes,\n    node = _ref.node,\n    cascade = _ref.cascade,\n    childrenKey = _ref.childrenKey;\n  if ((0, _isNil2.default)(nodes[node.refKey])) {\n    return _utils.CHECK_STATE.UNCHECK;\n  }\n  if (!node[childrenKey] || !node[childrenKey].length || !cascade) {\n    nodes[node.refKey].checkAll = false;\n    return node.check ? _utils.CHECK_STATE.CHECK : _utils.CHECK_STATE.UNCHECK;\n  }\n  if (isEveryChildChecked(nodes, node)) {\n    nodes[node.refKey].checkAll = true;\n    nodes[node.refKey].check = true;\n    return _utils.CHECK_STATE.CHECK;\n  }\n  if (isSomeChildChecked(nodes, node, childrenKey)) {\n    nodes[node.refKey].checkAll = false;\n    return _utils.CHECK_STATE.INDETERMINATE;\n  }\n  return _utils.CHECK_STATE.UNCHECK;\n}\n\n//# sourceURL=webpack://rsuite/./src/CheckTreePicker/utils.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _CheckTreePicker = _interopRequireDefault(__webpack_require__(/*! ./CheckTreePicker */ \"./src/CheckTreePicker/CheckTreePicker.tsx\"));\nvar _default = _CheckTreePicker.default;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/CheckTreePicker/index.tsx?");
 
 /***/ }),
 
@@ -6813,7 +6901,7 @@ eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar isElem
 /***/ (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\");\nexports.__esModule = true;\nexports.useDateField = exports.DateField = exports.patternMap = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _inheritsLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/inheritsLoose */ \"./node_modules/@babel/runtime/helpers/inheritsLoose.js\"));\nvar _wrapNativeSuper2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/wrapNativeSuper */ \"./node_modules/@babel/runtime/helpers/wrapNativeSuper.js\"));\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _isValid = _interopRequireDefault(__webpack_require__(/*! date-fns/isValid */ \"./node_modules/date-fns/esm/isValid/index.js\"));\nvar _utils = __webpack_require__(/*! ./utils */ \"./src/DateInput/utils.ts\");\nvar patternMap = {\n  y: 'year',\n  M: 'month',\n  d: 'day',\n  H: 'hour',\n  h: 'hour',\n  m: 'minute',\n  s: 'second',\n  a: 'meridian'\n};\nexports.patternMap = patternMap;\nvar DateField = /*#__PURE__*/function (_Object) {\n  (0, _inheritsLoose2.default)(DateField, _Object);\n  function DateField(format, value) {\n    var _this;\n    _this = _Object.call(this) || this;\n    _this.format = void 0;\n    _this.patternArray = [];\n    _this.year = null;\n    _this.month = null;\n    _this.day = null;\n    _this.hour = null;\n    _this.minute = null;\n    _this.second = null;\n    _this.format = format;\n    var formatArray = format.match(new RegExp('([y|d|M|H|h|m|s|a])+', 'ig')) || [];\n    _this.patternArray = formatArray.map(function (pattern) {\n      return {\n        pattern: pattern,\n        key: patternMap[pattern[0]]\n      };\n    });\n    if (value && (0, _isValid.default)(value)) {\n      _this.year = value.getFullYear();\n      _this.month = value.getMonth() + 1;\n      _this.day = value.getDate();\n      _this.hour = value.getHours();\n      _this.minute = value.getMinutes();\n      _this.second = value.getSeconds();\n    }\n    return _this;\n  }\n  return DateField;\n}( /*#__PURE__*/(0, _wrapNativeSuper2.default)(Object));\n/**\n * Pad a number with zeros to the left.\n */\nexports.DateField = DateField;\nfunction padNumber(number, length) {\n  var numberString = String(number);\n  if (numberString.length >= length) {\n    return numberString;\n  }\n  var paddingCount = length - numberString.length;\n  for (var i = 0; i < paddingCount; i++) {\n    numberString = '0' + numberString;\n  }\n  return numberString;\n}\nvar useDateField = function useDateField(format, localize, date) {\n  var _useReducer = (0, _react.useReducer)(function (state, action) {\n      switch (action.type) {\n        case 'setYear':\n          return (0, _extends2.default)({}, state, {\n            year: action.value\n          });\n        case 'setMonth':\n          return (0, _extends2.default)({}, state, {\n            month: action.value\n          });\n        case 'setDay':\n          return (0, _extends2.default)({}, state, {\n            day: action.value\n          });\n        case 'setHour':\n          return (0, _extends2.default)({}, state, {\n            hour: action.value\n          });\n        case 'setMinute':\n          return (0, _extends2.default)({}, state, {\n            minute: action.value\n          });\n        case 'setSecond':\n          return (0, _extends2.default)({}, state, {\n            second: action.value\n          });\n        case 'setNewDate':\n          return new DateField(format, action.value);\n        default:\n          return state;\n      }\n    }, new DateField(format, date)),\n    dateField = _useReducer[0],\n    dispatch = _useReducer[1];\n  var toDateString = function toDateString() {\n    var str = format;\n    dateField.patternArray.forEach(function (item) {\n      var key = item.key,\n        pattern = item.pattern;\n      var hour = dateField.hour;\n      var value = dateField[key];\n      if (value !== null) {\n        if (pattern === 'MMM' && typeof value === 'number') {\n          value = localize === null || localize === void 0 ? void 0 : localize.month(value - 1, {\n            width: 'abbreviated'\n          });\n        } else if (pattern === 'MMMM' && typeof value === 'number') {\n          value = localize === null || localize === void 0 ? void 0 : localize.month(value - 1, {\n            width: 'wide'\n          });\n        } else if (pattern === 'aa') {\n          if (typeof hour === 'number') {\n            value = hour > 12 ? 'PM' : 'AM';\n          } else {\n            value = 'aa';\n          }\n        } else if (pattern === 'hh' && typeof value === 'number') {\n          value = value === 0 ? 12 : value > 12 ? value - 12 : value;\n        }\n        if (typeof value === 'number') {\n          value = padNumber(value, pattern.length);\n        }\n        str = str.replace(pattern, value);\n      }\n    });\n    return str;\n  };\n\n  // Check if the field value is valid.\n  var validFieldValue = function validFieldValue(type, value) {\n    var _format$match;\n    var isValid = true;\n    (_format$match = format.match(new RegExp('([y|d|M|H|h|m|s])+', 'ig'))) === null || _format$match === void 0 ? void 0 : _format$match.forEach(function (pattern) {\n      var key = patternMap[pattern[0]];\n      var fieldValue = type === key ? value : dateField[key];\n      if (fieldValue === null) {\n        isValid = false;\n        return;\n      }\n    });\n    return isValid;\n  };\n  var isEmptyValue = function isEmptyValue(type, value) {\n    var _format$match2;\n    var checkValueArray = (_format$match2 = format.match(new RegExp('([y|d|M|H|h|m|s])+', 'ig'))) === null || _format$match2 === void 0 ? void 0 : _format$match2.map(function (pattern) {\n      var key = patternMap[pattern[0]];\n      var fieldValue = type === key ? value : dateField[key];\n      return fieldValue !== null;\n    });\n    return checkValueArray === null || checkValueArray === void 0 ? void 0 : checkValueArray.every(function (item) {\n      return item === false;\n    });\n  };\n  var toDate = function toDate(type, value) {\n    var year = dateField.year,\n      month = dateField.month,\n      day = dateField.day,\n      hour = dateField.hour,\n      minute = dateField.minute,\n      second = dateField.second;\n    var date = new Date(year || 0, typeof month === 'number' ? month - 1 : 0,\n    // The default day is 1 when the value is null, otherwise it becomes the last day of the month.\n    day || 1, hour || 0, minute || 0, second || 0);\n    if (typeof type === 'undefined' || typeof value === 'undefined') {\n      return date;\n    }\n    if (value === null || !validFieldValue(type, value)) {\n      if (isEmptyValue(type, value)) {\n        return null;\n      }\n\n      // Invalid Date\n      return new Date('');\n    } else if (type === 'day' && value === 0) {\n      // Invalid Date. If the type is day and the value is 0, it is considered an invalid date.\n      return new Date('');\n    }\n    if (type === 'meridian' && typeof hour === 'number') {\n      var newHour = hour > 12 ? hour - 12 : hour + 12;\n      type = 'hour';\n      value = newHour;\n    }\n    return (0, _utils.modifyDate)(date, type, value);\n  };\n  return {\n    dateField: dateField,\n    dispatch: dispatch,\n    toDate: toDate,\n    toDateString: toDateString,\n    isEmptyValue: isEmptyValue\n  };\n};\nexports.useDateField = useDateField;\n\n//# sourceURL=webpack://rsuite/./src/DateInput/DateField.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports.useDateField = exports.DateField = exports.patternMap = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _inheritsLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/inheritsLoose */ \"./node_modules/@babel/runtime/helpers/inheritsLoose.js\"));\nvar _wrapNativeSuper2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/wrapNativeSuper */ \"./node_modules/@babel/runtime/helpers/wrapNativeSuper.js\"));\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _isValid = _interopRequireDefault(__webpack_require__(/*! date-fns/isValid */ \"./node_modules/date-fns/esm/isValid/index.js\"));\nvar _utils = __webpack_require__(/*! ./utils */ \"./src/DateInput/utils.ts\");\nvar patternMap = {\n  y: 'year',\n  M: 'month',\n  d: 'day',\n  H: 'hour',\n  h: 'hour',\n  m: 'minute',\n  s: 'second',\n  a: 'meridian'\n};\nexports.patternMap = patternMap;\nvar DateField = /*#__PURE__*/function (_Object) {\n  (0, _inheritsLoose2.default)(DateField, _Object);\n  function DateField(format, value) {\n    var _this;\n    _this = _Object.call(this) || this;\n    _this.format = void 0;\n    _this.patternArray = [];\n    _this.year = null;\n    _this.month = null;\n    _this.day = null;\n    _this.hour = null;\n    _this.minute = null;\n    _this.second = null;\n    _this.format = format;\n    var formatArray = format.match(new RegExp('([y|d|M|H|h|m|s|a])+', 'ig')) || [];\n    _this.patternArray = formatArray.map(function (pattern) {\n      return {\n        pattern: pattern,\n        key: patternMap[pattern[0]]\n      };\n    });\n    if (value && (0, _isValid.default)(value)) {\n      _this.year = value.getFullYear();\n      _this.month = value.getMonth() + 1;\n      _this.day = value.getDate();\n      _this.hour = value.getHours();\n      _this.minute = value.getMinutes();\n      _this.second = value.getSeconds();\n    }\n    return _this;\n  }\n  return DateField;\n}( /*#__PURE__*/(0, _wrapNativeSuper2.default)(Object));\n/**\n * Pad a number with zeros to the left.\n */\nexports.DateField = DateField;\nfunction padNumber(number, length) {\n  var numberString = String(number);\n  if (numberString.length >= length) {\n    return numberString;\n  }\n  var paddingCount = length - numberString.length;\n  for (var i = 0; i < paddingCount; i++) {\n    numberString = '0' + numberString;\n  }\n  return numberString;\n}\nvar useDateField = function useDateField(format, localize, date) {\n  var _useReducer = (0, _react.useReducer)(function (state, action) {\n      switch (action.type) {\n        case 'setYear':\n          return (0, _extends2.default)({}, state, {\n            year: action.value\n          });\n        case 'setMonth':\n          return (0, _extends2.default)({}, state, {\n            month: action.value\n          });\n        case 'setDay':\n          return (0, _extends2.default)({}, state, {\n            day: action.value\n          });\n        case 'setHour':\n          return (0, _extends2.default)({}, state, {\n            hour: action.value\n          });\n        case 'setMinute':\n          return (0, _extends2.default)({}, state, {\n            minute: action.value\n          });\n        case 'setSecond':\n          return (0, _extends2.default)({}, state, {\n            second: action.value\n          });\n        case 'setNewDate':\n          return new DateField(format, action.value);\n        default:\n          return state;\n      }\n    }, new DateField(format, date)),\n    dateField = _useReducer[0],\n    dispatch = _useReducer[1];\n  var toDateString = function toDateString() {\n    var str = format;\n    dateField.patternArray.forEach(function (item) {\n      var key = item.key,\n        pattern = item.pattern;\n      var hour = dateField.hour;\n      var value = dateField[key];\n      if (value !== null) {\n        if (pattern === 'MMM' && typeof value === 'number') {\n          value = localize === null || localize === void 0 ? void 0 : localize.month(value - 1, {\n            width: 'abbreviated'\n          });\n        } else if (pattern === 'MMMM' && typeof value === 'number') {\n          value = localize === null || localize === void 0 ? void 0 : localize.month(value - 1, {\n            width: 'wide'\n          });\n        } else if (pattern === 'aa') {\n          if (typeof hour === 'number') {\n            value = hour > 12 ? 'PM' : 'AM';\n          } else {\n            value = 'aa';\n          }\n        } else if (pattern === 'hh' && typeof value === 'number') {\n          value = value === 0 ? 12 : value > 12 ? value - 12 : value;\n        }\n        if (typeof value === 'number') {\n          value = padNumber(value, pattern.length);\n        }\n        if (typeof value !== 'undefined') {\n          str = str.replace(pattern, value);\n        }\n      }\n    });\n    return str;\n  };\n\n  // Check if the field value is valid.\n  var validFieldValue = function validFieldValue(type, value) {\n    var _format$match;\n    var isValid = true;\n    (_format$match = format.match(new RegExp('([y|d|M|H|h|m|s])+', 'ig'))) === null || _format$match === void 0 ? void 0 : _format$match.forEach(function (pattern) {\n      var key = patternMap[pattern[0]];\n      var fieldValue = type === key ? value : dateField[key];\n      if (fieldValue === null) {\n        isValid = false;\n        return;\n      }\n    });\n    return isValid;\n  };\n  var isEmptyValue = function isEmptyValue(type, value) {\n    var _format$match2;\n    var checkValueArray = (_format$match2 = format.match(new RegExp('([y|d|M|H|h|m|s])+', 'ig'))) === null || _format$match2 === void 0 ? void 0 : _format$match2.map(function (pattern) {\n      var key = patternMap[pattern[0]];\n      var fieldValue = type === key ? value : dateField[key];\n      return fieldValue !== null;\n    });\n    return checkValueArray === null || checkValueArray === void 0 ? void 0 : checkValueArray.every(function (item) {\n      return item === false;\n    });\n  };\n  var toDate = function toDate(type, value) {\n    var year = dateField.year,\n      month = dateField.month,\n      day = dateField.day,\n      hour = dateField.hour,\n      minute = dateField.minute,\n      second = dateField.second;\n    var date = new Date(year || 0, typeof month === 'number' ? month - 1 : 0,\n    // The default day is 1 when the value is null, otherwise it becomes the last day of the month.\n    day || 1, hour || 0, minute || 0, second || 0);\n    if (typeof type === 'undefined' || typeof value === 'undefined') {\n      return date;\n    }\n    if (value === null || !validFieldValue(type, value)) {\n      if (isEmptyValue(type, value)) {\n        return null;\n      }\n\n      // Invalid Date\n      return new Date('');\n    } else if (type === 'day' && value === 0) {\n      // Invalid Date. If the type is day and the value is 0, it is considered an invalid date.\n      return new Date('');\n    }\n    if (type === 'meridian' && typeof hour === 'number') {\n      var newHour = hour > 12 ? hour - 12 : hour + 12;\n      type = 'hour';\n      value = newHour;\n    }\n    return (0, _utils.modifyDate)(date, type, value);\n  };\n  return {\n    dateField: dateField,\n    dispatch: dispatch,\n    toDate: toDate,\n    toDateString: toDateString,\n    isEmptyValue: isEmptyValue\n  };\n};\nexports.useDateField = useDateField;\n\n//# sourceURL=webpack://rsuite/./src/DateInput/DateField.ts?");
 
 /***/ }),
 
@@ -6824,51 +6912,73 @@ 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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _Input = _interopRequireDefault(__webpack_require__(/*! ../Input */ \"./src/Input/index.tsx\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/DateInput/utils.ts\");\nvar _useDateInputState2 = _interopRequireDefault(__webpack_require__(/*! ./useDateInputState */ \"./src/DateInput/useDateInputState.ts\"));\nvar _useKeyboardInputEvent = _interopRequireDefault(__webpack_require__(/*! ./useKeyboardInputEvent */ \"./src/DateInput/useKeyboardInputEvent.ts\"));\nvar _useIsFocused2 = _interopRequireDefault(__webpack_require__(/*! ./useIsFocused */ \"./src/DateInput/useIsFocused.ts\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DateInput/DateInput.tsx\",\n  _this = void 0;\n/**\n * The DateInput component lets users select a date with the keyboard.\n * @version 5.58.0\n * @see https://rsuitejs.com/components/date-input/\n */\nvar DateInput = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$format = props.format,\n    formatStr = _props$format === void 0 ? 'yyyy-MM-dd' : _props$format,\n    valueProp = props.value,\n    defaultValue = props.defaultValue,\n    placeholder = props.placeholder,\n    onChange = props.onChange,\n    onKeyDown = props.onKeyDown,\n    onBlur = props.onBlur,\n    onFocus = props.onFocus,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"format\", \"value\", \"defaultValue\", \"placeholder\", \"onChange\", \"onKeyDown\", \"onBlur\", \"onFocus\"]);\n  var inputRef = (0, _react.useRef)();\n  var _useState = (0, _react.useState)({\n      selectedPattern: 'y',\n      selectionStart: 0,\n      selectionEnd: 0\n    }),\n    selectedState = _useState[0],\n    setSelectedState = _useState[1];\n  var _useCustom = (0, _utils.useCustom)('Calendar'),\n    locale = _useCustom.locale;\n  var dateLocale = locale.dateLocale;\n  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue),\n    value = _useControlled[0],\n    setValue = _useControlled[1],\n    isControlled = _useControlled[2];\n  var _useDateInputState = (0, _useDateInputState2.default)({\n      formatStr: formatStr,\n      locale: dateLocale,\n      date: value,\n      isControlledDate: isControlled\n    }),\n    dateField = _useDateInputState.dateField,\n    setDateOffset = _useDateInputState.setDateOffset,\n    setDateField = _useDateInputState.setDateField,\n    getDateField = _useDateInputState.getDateField,\n    toDateString = _useDateInputState.toDateString,\n    isEmptyValue = _useDateInputState.isEmptyValue;\n  var dateString = toDateString();\n  var keyPressOptions = (0, _react.useMemo)(function () {\n    return {\n      formatStr: formatStr,\n      localize: dateLocale.localize,\n      selectedMonth: dateField.month,\n      dateString: dateString\n    };\n  }, [dateField, dateString, formatStr, dateLocale]);\n  var handleChange = (0, _utils.useEventCallback)(function (value, event) {\n    onChange === null || onChange === void 0 ? void 0 : onChange(value, event);\n    setValue(value);\n  });\n  var setSelectionRange = (0, _utils2.useInputSelection)(inputRef);\n  var onSegmentChange = (0, _utils.useEventCallback)(function (event, nextDirection) {\n    var input = event.target;\n    var key = event.key;\n    var direction = nextDirection || (key === 'ArrowRight' ? 'right' : 'left');\n    var state = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n      input: input,\n      direction: direction\n    }));\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n    setSelectedState(state);\n  });\n  var onSegmentValueChange = (0, _utils.useEventCallback)(function (event) {\n    var input = event.target;\n    var key = event.key;\n    var offset = key === 'ArrowUp' ? 1 : -1;\n    var state = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n      input: input,\n      valueOffset: offset\n    }));\n    setSelectedState(state);\n    setDateOffset(state.selectedPattern, offset, function (date) {\n      return handleChange(date, event);\n    });\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n  });\n  var onSegmentValueChangeWithNumericKeys = (0, _utils.useEventCallback)(function (event) {\n    var input = event.target;\n    var key = event.key;\n    var pattern = selectedState.selectedPattern;\n    if (!pattern) {\n      return;\n    }\n    var field = getDateField(pattern);\n    var value = parseInt(key, 10);\n    var padValue = parseInt(\"\" + (field.value || '') + key, 10);\n    var newValue = value;\n\n    // Check if the value entered by the user is a valid date\n    if ((0, _utils2.validateDateTime)(field.name, padValue)) {\n      newValue = padValue;\n    }\n    if (pattern === 'M') {\n      // Month cannot be less than 1.\n      newValue = Math.max(1, newValue);\n    }\n    setDateField(pattern, newValue, function (date) {\n      return handleChange(date, event);\n    });\n\n    // The currently selected month will be retained as a parameter of getInputSelectedState,\n    // but if the user enters a month, the month value will be replaced with the value entered by the user.\n    var selectedMonth = pattern === 'M' ? newValue : dateField.month;\n    var nextState = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n      input: input,\n      selectedMonth: selectedMonth\n    }));\n    setSelectedState(nextState);\n    setSelectionRange(nextState.selectionStart, nextState.selectionEnd);\n\n    // If the field is full value, move the cursor to the next field\n    if ((0, _utils2.isFieldFullValue)(formatStr, newValue, pattern) && input.selectionEnd !== input.value.length) {\n      onSegmentChange(event, 'right');\n    }\n  });\n  var onSegmentValueRemove = (0, _utils.useEventCallback)(function (event) {\n    var input = event.target;\n    if (selectedState.selectedPattern) {\n      var nextState = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n        input: input,\n        valueOffset: null\n      }));\n      setSelectedState(nextState);\n      setSelectionRange(nextState.selectionStart, nextState.selectionEnd);\n      setDateField(selectedState.selectedPattern, null, function (date) {\n        return handleChange(date, event);\n      });\n    }\n  });\n  var handleClick = (0, _utils.useEventCallback)(function (event) {\n    var input = event.target;\n    var state = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n      input: input\n    }));\n    setSelectedState(state);\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n  });\n  var onKeyboardInput = (0, _useKeyboardInputEvent.default)({\n    onSegmentChange: onSegmentChange,\n    onSegmentValueChange: onSegmentValueChange,\n    onSegmentValueChangeWithNumericKeys: onSegmentValueChangeWithNumericKeys,\n    onSegmentValueRemove: onSegmentValueRemove,\n    onKeyDown: onKeyDown\n  });\n  var _useIsFocused = (0, _useIsFocused2.default)({\n      onBlur: onBlur,\n      onFocus: onFocus\n    }),\n    focused = _useIsFocused[0],\n    focusEventProps = _useIsFocused[1];\n  var renderedValue = (0, _react.useMemo)(function () {\n    if (!isEmptyValue()) {\n      return dateString;\n    }\n    return !focused ? '' : dateString;\n  }, [dateString, focused, isEmptyValue]);\n  return /*#__PURE__*/_react.default.createElement(_Input.default, (0, _extends2.default)({\n    inputMode: focused ? 'numeric' : 'text',\n    autoComplete: \"off\",\n    autoCorrect: \"off\",\n    spellCheck: false,\n    ref: (0, _utils.mergeRefs)(inputRef, ref),\n    onKeyDown: onKeyboardInput,\n    onClick: handleClick,\n    value: renderedValue,\n    placeholder: placeholder || formatStr\n  }, focusEventProps, rest, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 206,\n      columnNumber: 5\n    }\n  }));\n});\nDateInput.displayName = 'DateInput';\nDateInput.propTypes = {\n  defaultValue: _propTypes.default.instanceOf(Date),\n  format: _propTypes.default.string,\n  value: _propTypes.default.instanceOf(Date),\n  placeholder: _propTypes.default.string,\n  onChange: _propTypes.default.func,\n  onKeyDown: _propTypes.default.func,\n  onBlur: _propTypes.default.func,\n  onFocus: _propTypes.default.func\n};\nvar _default = DateInput;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/DateInput/DateInput.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _Input = _interopRequireDefault(__webpack_require__(/*! ../Input */ \"./src/Input/index.tsx\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/DateInput/utils.ts\");\nvar _useDateInputState2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useDateInputState */ \"./src/DateInput/hooks/useDateInputState.ts\"));\nvar _useKeyboardInputEvent = _interopRequireDefault(__webpack_require__(/*! ./hooks/useKeyboardInputEvent */ \"./src/DateInput/hooks/useKeyboardInputEvent.ts\"));\nvar _useIsFocused2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useIsFocused */ \"./src/DateInput/hooks/useIsFocused.ts\"));\nvar _useFieldCursor2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFieldCursor */ \"./src/DateInput/hooks/useFieldCursor.ts\"));\nvar _useSelectedState2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useSelectedState */ \"./src/DateInput/hooks/useSelectedState.ts\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DateInput/DateInput.tsx\",\n  _this = void 0;\n/**\n * The DateInput component lets users select a date with the keyboard.\n * @version 5.58.0\n * @see https://rsuitejs.com/components/date-input/\n */\nvar DateInput = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$format = props.format,\n    formatStr = _props$format === void 0 ? 'yyyy-MM-dd' : _props$format,\n    valueProp = props.value,\n    defaultValue = props.defaultValue,\n    placeholder = props.placeholder,\n    onChange = props.onChange,\n    onKeyDown = props.onKeyDown,\n    onBlur = props.onBlur,\n    onFocus = props.onFocus,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"format\", \"value\", \"defaultValue\", \"placeholder\", \"onChange\", \"onKeyDown\", \"onBlur\", \"onFocus\"]);\n  var inputRef = (0, _react.useRef)();\n  var _useSelectedState = (0, _useSelectedState2.default)(),\n    selectedState = _useSelectedState.selectedState,\n    setSelectedState = _useSelectedState.setSelectedState;\n  var _useCustom = (0, _utils.useCustom)('Calendar'),\n    locale = _useCustom.locale;\n  var dateLocale = locale.dateLocale;\n  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue),\n    value = _useControlled[0],\n    setValue = _useControlled[1],\n    isControlled = _useControlled[2];\n  var _useDateInputState = (0, _useDateInputState2.default)({\n      formatStr: formatStr,\n      locale: dateLocale,\n      date: value,\n      isControlledDate: isControlled\n    }),\n    dateField = _useDateInputState.dateField,\n    setDateOffset = _useDateInputState.setDateOffset,\n    setDateField = _useDateInputState.setDateField,\n    getDateField = _useDateInputState.getDateField,\n    toDateString = _useDateInputState.toDateString,\n    isEmptyValue = _useDateInputState.isEmptyValue;\n  var _useFieldCursor = (0, _useFieldCursor2.default)(formatStr, valueProp),\n    isMoveCursor = _useFieldCursor.isMoveCursor,\n    increment = _useFieldCursor.increment,\n    reset = _useFieldCursor.reset;\n  var dateString = toDateString();\n  var keyPressOptions = (0, _react.useMemo)(function () {\n    return {\n      formatStr: formatStr,\n      localize: dateLocale.localize,\n      selectedMonth: dateField.month,\n      dateString: dateString\n    };\n  }, [dateField, dateString, formatStr, dateLocale]);\n  var handleChange = (0, _utils.useEventCallback)(function (value, event) {\n    onChange === null || onChange === void 0 ? void 0 : onChange(value, event);\n    setValue(value);\n  });\n  var setSelectionRange = (0, _utils2.useInputSelection)(inputRef);\n  var onSegmentChange = (0, _utils.useEventCallback)(function (event, nextDirection) {\n    var input = event.target;\n    var key = event.key;\n    var direction = nextDirection || (key === 'ArrowRight' ? 'right' : 'left');\n    var state = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n      input: input,\n      direction: direction\n    }));\n    setSelectedState(state);\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n    reset();\n  });\n  var onSegmentValueChange = (0, _utils.useEventCallback)(function (event) {\n    var input = event.target;\n    var key = event.key;\n    var offset = key === 'ArrowUp' ? 1 : -1;\n    var state = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n      input: input,\n      valueOffset: offset\n    }));\n    setSelectedState(state);\n    setDateOffset(state.selectedPattern, offset, function (date) {\n      return handleChange(date, event);\n    });\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n  });\n  var onSegmentValueChangeWithNumericKeys = (0, _utils.useEventCallback)(function (event) {\n    var input = event.target;\n    var key = event.key;\n    var pattern = selectedState.selectedPattern;\n    if (!pattern) {\n      return;\n    }\n    increment();\n    var field = getDateField(pattern);\n    var value = parseInt(key, 10);\n    var padValue = parseInt(\"\" + (field.value || '') + key, 10);\n    var newValue = value;\n\n    // Check if the value entered by the user is a valid date\n    if ((0, _utils2.validateDateTime)(field.name, padValue)) {\n      newValue = padValue;\n    }\n    setDateField(pattern, newValue, function (date) {\n      return handleChange(date, event);\n    });\n\n    // The currently selected month will be retained as a parameter of getInputSelectedState,\n    // but if the user enters a month, the month value will be replaced with the value entered by the user.\n    var selectedMonth = pattern === 'M' ? newValue : dateField.month;\n    var nextState = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n      input: input,\n      selectedMonth: selectedMonth\n    }));\n    setSelectedState(nextState);\n    setSelectionRange(nextState.selectionStart, nextState.selectionEnd);\n\n    // If the field is full value, move the cursor to the next field\n    if (isMoveCursor(newValue, pattern) && input.selectionEnd !== input.value.length) {\n      onSegmentChange(event, 'right');\n    }\n  });\n  var onSegmentValueRemove = (0, _utils.useEventCallback)(function (event) {\n    var input = event.target;\n    if (selectedState.selectedPattern) {\n      var nextState = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n        input: input,\n        valueOffset: null\n      }));\n      setSelectedState(nextState);\n      setSelectionRange(nextState.selectionStart, nextState.selectionEnd);\n      setDateField(selectedState.selectedPattern, null, function (date) {\n        return handleChange(date, event);\n      });\n      reset();\n    }\n  });\n  var handleClick = (0, _utils.useEventCallback)(function (event) {\n    var input = event.target;\n    var state = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n      input: input\n    }));\n    setSelectedState(state);\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n  });\n  var onKeyboardInput = (0, _useKeyboardInputEvent.default)({\n    onSegmentChange: onSegmentChange,\n    onSegmentValueChange: onSegmentValueChange,\n    onSegmentValueChangeWithNumericKeys: onSegmentValueChangeWithNumericKeys,\n    onSegmentValueRemove: onSegmentValueRemove,\n    onKeyDown: onKeyDown\n  });\n  var _useIsFocused = (0, _useIsFocused2.default)({\n      onBlur: onBlur,\n      onFocus: onFocus\n    }),\n    focused = _useIsFocused[0],\n    focusEventProps = _useIsFocused[1];\n  var renderedValue = (0, _react.useMemo)(function () {\n    if (!isEmptyValue()) {\n      return dateString;\n    }\n    return !focused ? '' : dateString;\n  }, [dateString, focused, isEmptyValue]);\n  return /*#__PURE__*/_react.default.createElement(_Input.default, (0, _extends2.default)({\n    inputMode: focused ? 'numeric' : 'text',\n    autoComplete: \"off\",\n    autoCorrect: \"off\",\n    spellCheck: false,\n    ref: (0, _utils.mergeRefs)(inputRef, ref),\n    onKeyDown: onKeyboardInput,\n    onClick: handleClick,\n    value: renderedValue,\n    placeholder: placeholder || formatStr\n  }, focusEventProps, rest, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 194,\n      columnNumber: 5\n    }\n  }));\n});\nDateInput.displayName = 'DateInput';\nDateInput.propTypes = {\n  defaultValue: _propTypes.default.instanceOf(Date),\n  format: _propTypes.default.string,\n  value: _propTypes.default.instanceOf(Date),\n  placeholder: _propTypes.default.string,\n  onChange: _propTypes.default.func,\n  onKeyDown: _propTypes.default.func,\n  onBlur: _propTypes.default.func,\n  onFocus: _propTypes.default.func\n};\nvar _default = DateInput;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/DateInput/DateInput.tsx?");
 
 /***/ }),
 
-/***/ "./src/DateInput/index.tsx":
-/*!*********************************!*\
-  !*** ./src/DateInput/index.tsx ***!
-  \*********************************/
+/***/ "./src/DateInput/hooks/useDateInputState.ts":
+/*!**************************************************!*\
+  !*** ./src/DateInput/hooks/useDateInputState.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\");\nexports.__esModule = true;\nvar _exportNames = {\n  useDateInputState: true,\n  useKeyboardInputEvent: true,\n  useIsFocused: true\n};\nexports[\"default\"] = exports.useIsFocused = exports.useKeyboardInputEvent = exports.useDateInputState = void 0;\nvar _DateInput = _interopRequireDefault(__webpack_require__(/*! ./DateInput */ \"./src/DateInput/DateInput.tsx\"));\nvar _useDateInputState = __webpack_require__(/*! ./useDateInputState */ \"./src/DateInput/useDateInputState.ts\");\nexports.useDateInputState = _useDateInputState.useDateInputState;\nvar _useKeyboardInputEvent = __webpack_require__(/*! ./useKeyboardInputEvent */ \"./src/DateInput/useKeyboardInputEvent.ts\");\nexports.useKeyboardInputEvent = _useKeyboardInputEvent.useKeyboardInputEvent;\nvar _useIsFocused = __webpack_require__(/*! ./useIsFocused */ \"./src/DateInput/useIsFocused.ts\");\nexports.useIsFocused = _useIsFocused.useIsFocused;\nvar _utils = __webpack_require__(/*! ./utils */ \"./src/DateInput/utils.ts\");\nObject.keys(_utils).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] === _utils[key]) return;\n  exports[key] = _utils[key];\n});\nvar _default = _DateInput.default;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/DateInput/index.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports.useDateInputState = useDateInputState;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _startCase = _interopRequireDefault(__webpack_require__(/*! lodash/startCase */ \"./node_modules/lodash/startCase.js\"));\nvar _dateUtils = __webpack_require__(/*! ../../utils/dateUtils */ \"./src/utils/dateUtils.ts\");\nvar _DateField = __webpack_require__(/*! ../DateField */ \"./src/DateInput/DateField.ts\");\nfunction useDateInputState(_ref) {\n  var formatStr = _ref.formatStr,\n    locale = _ref.locale,\n    date = _ref.date,\n    isControlledDate = _ref.isControlledDate;\n  var _useDateField = (0, _DateField.useDateField)(formatStr, locale.localize, date),\n    dateField = _useDateField.dateField,\n    dispatch = _useDateField.dispatch,\n    toDateString = _useDateField.toDateString,\n    toDate = _useDateField.toDate,\n    isEmptyValue = _useDateField.isEmptyValue;\n  var setDateOffset = function setDateOffset(pattern, offset, callback) {\n    var currentDate = new Date();\n    var year = dateField.year || currentDate.getFullYear();\n    var month = dateField.month ? dateField.month - 1 : currentDate.getMonth();\n    var day = dateField.day || 0;\n    var hour = dateField.hour || 0;\n    var minute = dateField.minute || 0;\n    var second = dateField.second || 0;\n    var actionName;\n    var value;\n    switch (pattern) {\n      case 'y':\n        actionName = 'setYear';\n        value = (0, _dateUtils.addYears)(new Date(year, 0), offset).getFullYear();\n        break;\n      case 'M':\n        actionName = 'setMonth';\n        value = (0, _dateUtils.addMonths)(new Date(year, month), offset).getMonth() + 1;\n        break;\n      case 'd':\n        actionName = 'setDay';\n        var prevDate = new Date(year, month, day);\n        value = (0, _dateUtils.addDays)(prevDate, offset).getDate();\n        if (offset > 0) {\n          value = (0, _dateUtils.isLastDayOfMonth)(prevDate) ? 1 : value;\n        } else {\n          value = prevDate.getDate() === 1 ? (0, _dateUtils.lastDayOfMonth)(prevDate).getDate() : value;\n        }\n        break;\n      case 'H':\n      case 'h':\n        actionName = 'setHour';\n        value = (0, _dateUtils.addHours)(new Date(year, month, day, hour), offset).getHours();\n        break;\n      case 'm':\n        actionName = 'setMinute';\n        value = (0, _dateUtils.addMinutes)(new Date(year, month, day, hour, minute), offset).getMinutes();\n        break;\n      case 's':\n        actionName = 'setSecond';\n        value = (0, _dateUtils.addSeconds)(new Date(year, month, day, hour, minute, second), offset).getSeconds();\n        break;\n      case 'a':\n        actionName = 'setHour';\n        value = hour >= 12 ? hour - 12 : hour + 12;\n        break;\n    }\n    if (actionName && value) {\n      dispatch({\n        type: actionName,\n        value: value\n      });\n      var field = _DateField.patternMap[pattern];\n      callback === null || callback === void 0 ? void 0 : callback(toDate(field, value));\n    }\n  };\n  var setDateField = function setDateField(pattern, value, callback) {\n    var field = _DateField.patternMap[pattern];\n    var actionName = \"set\" + (0, _startCase.default)(field);\n    dispatch({\n      type: actionName,\n      value: value\n    });\n    callback === null || callback === void 0 ? void 0 : callback(toDate(field, value));\n  };\n  var getDateField = function getDateField(pattern) {\n    var fieldName = _DateField.patternMap[pattern];\n    return {\n      name: fieldName,\n      value: dateField[fieldName]\n    };\n  };\n  var toControlledDateString = function toControlledDateString() {\n    if (date && (0, _dateUtils.isValid)(date)) {\n      return (0, _dateUtils.format)(date, formatStr, {\n        locale: locale\n      });\n    }\n    // if date is not valid, return uncontrolled date string\n    return toDateString();\n  };\n  (0, _react.useEffect)(function () {\n    if (isControlledDate) {\n      if (date && (0, _dateUtils.isValid)(date)) {\n        dispatch({\n          type: 'setNewDate',\n          value: date\n        });\n      } else if (date === null) {\n        dispatch({\n          type: 'setNewDate',\n          value: null\n        });\n      }\n    }\n  }, [date, dispatch, isControlledDate]);\n  return {\n    dateField: dateField,\n    setDateOffset: setDateOffset,\n    setDateField: setDateField,\n    getDateField: getDateField,\n    toDateString: isControlledDate ? toControlledDateString : toDateString,\n    isEmptyValue: isEmptyValue\n  };\n}\nvar _default = useDateInputState;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/DateInput/hooks/useDateInputState.ts?");
 
 /***/ }),
 
-/***/ "./src/DateInput/useDateInputState.ts":
-/*!********************************************!*\
-  !*** ./src/DateInput/useDateInputState.ts ***!
-  \********************************************/
+/***/ "./src/DateInput/hooks/useFieldCursor.ts":
+/*!***********************************************!*\
+  !*** ./src/DateInput/hooks/useFieldCursor.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\");\nexports.__esModule = true;\nexports.useDateInputState = useDateInputState;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _startCase = _interopRequireDefault(__webpack_require__(/*! lodash/startCase */ \"./node_modules/lodash/startCase.js\"));\nvar _dateUtils = __webpack_require__(/*! ../utils/dateUtils */ \"./src/utils/dateUtils.ts\");\nvar _DateField = __webpack_require__(/*! ./DateField */ \"./src/DateInput/DateField.ts\");\nfunction useDateInputState(_ref) {\n  var formatStr = _ref.formatStr,\n    locale = _ref.locale,\n    date = _ref.date,\n    isControlledDate = _ref.isControlledDate;\n  var _useDateField = (0, _DateField.useDateField)(formatStr, locale.localize, date),\n    dateField = _useDateField.dateField,\n    dispatch = _useDateField.dispatch,\n    toDateString = _useDateField.toDateString,\n    toDate = _useDateField.toDate,\n    isEmptyValue = _useDateField.isEmptyValue;\n  var setDateOffset = function setDateOffset(pattern, offset, callback) {\n    var currentDate = new Date();\n    var year = dateField.year || currentDate.getFullYear();\n    var month = dateField.month ? dateField.month - 1 : currentDate.getMonth();\n    var day = dateField.day || 0;\n    var hour = dateField.hour || 0;\n    var minute = dateField.minute || 0;\n    var second = dateField.second || 0;\n    var actionName;\n    var value;\n    switch (pattern) {\n      case 'y':\n        actionName = 'setYear';\n        value = (0, _dateUtils.addYears)(new Date(year, 0), offset).getFullYear();\n        break;\n      case 'M':\n        actionName = 'setMonth';\n        value = (0, _dateUtils.addMonths)(new Date(year, month), offset).getMonth() + 1;\n        break;\n      case 'd':\n        actionName = 'setDay';\n        var prevDate = new Date(year, month, day);\n        value = (0, _dateUtils.addDays)(prevDate, offset).getDate();\n        if (offset > 0) {\n          value = (0, _dateUtils.isLastDayOfMonth)(prevDate) ? 1 : value;\n        } else {\n          value = prevDate.getDate() === 1 ? (0, _dateUtils.lastDayOfMonth)(prevDate).getDate() : value;\n        }\n        break;\n      case 'H':\n      case 'h':\n        actionName = 'setHour';\n        value = (0, _dateUtils.addHours)(new Date(year, month, day, hour), offset).getHours();\n        break;\n      case 'm':\n        actionName = 'setMinute';\n        value = (0, _dateUtils.addMinutes)(new Date(year, month, day, hour, minute), offset).getMinutes();\n        break;\n      case 's':\n        actionName = 'setSecond';\n        value = (0, _dateUtils.addSeconds)(new Date(year, month, day, hour, minute, second), offset).getSeconds();\n        break;\n      case 'a':\n        actionName = 'setHour';\n        value = hour >= 12 ? hour - 12 : hour + 12;\n        break;\n    }\n    if (actionName && value) {\n      dispatch({\n        type: actionName,\n        value: value\n      });\n      var field = _DateField.patternMap[pattern];\n      callback === null || callback === void 0 ? void 0 : callback(toDate(field, value));\n    }\n  };\n  var setDateField = function setDateField(pattern, value, callback) {\n    var field = _DateField.patternMap[pattern];\n    var actionName = \"set\" + (0, _startCase.default)(field);\n    dispatch({\n      type: actionName,\n      value: value\n    });\n    callback === null || callback === void 0 ? void 0 : callback(toDate(field, value));\n  };\n  var getDateField = function getDateField(pattern) {\n    var fieldName = _DateField.patternMap[pattern];\n    return {\n      name: fieldName,\n      value: dateField[fieldName]\n    };\n  };\n  var toControlledDateString = function toControlledDateString() {\n    if (date && (0, _dateUtils.isValid)(date)) {\n      return (0, _dateUtils.format)(date, formatStr, {\n        locale: locale\n      });\n    }\n    // if date is not valid, return uncontrolled date string\n    return toDateString();\n  };\n  (0, _react.useEffect)(function () {\n    if (isControlledDate) {\n      if (date && (0, _dateUtils.isValid)(date)) {\n        dispatch({\n          type: 'setNewDate',\n          value: date\n        });\n      } else if (date === null) {\n        dispatch({\n          type: 'setNewDate',\n          value: null\n        });\n      }\n    }\n  }, [date, dispatch, isControlledDate]);\n  return {\n    dateField: dateField,\n    setDateOffset: setDateOffset,\n    setDateField: setDateField,\n    getDateField: getDateField,\n    toDateString: isControlledDate ? toControlledDateString : toDateString,\n    isEmptyValue: isEmptyValue\n  };\n}\nvar _default = useDateInputState;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/DateInput/useDateInputState.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports.useFieldCursor = useFieldCursor;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/DateInput/utils.ts\");\nvar _useUpdateEffect = _interopRequireDefault(__webpack_require__(/*! ../../utils/useUpdateEffect */ \"./src/utils/useUpdateEffect.ts\"));\nfunction useFieldCursor(format, value) {\n  var typeCount = (0, _react.useRef)(0);\n  var increment = function increment() {\n    typeCount.current += 1;\n  };\n  var reset = function reset() {\n    typeCount.current = 0;\n  };\n  var isMoveCursor = (0, _react.useCallback)(function (value, pattern) {\n    var patternGroup = (0, _utils.getPatternGroups)(format, pattern);\n    if (value.toString().length === patternGroup.length) {\n      return true;\n    } else if (pattern === 'y' && typeCount.current === 4) {\n      return true;\n    } else if (pattern !== 'y' && typeCount.current === 2) {\n      return true;\n    }\n    switch (pattern) {\n      case 'M':\n        return parseInt(value + \"0\") > 12;\n      case 'd':\n        return parseInt(value + \"0\") > 31;\n      case 'H':\n        return parseInt(value + \"0\") > 23;\n      case 'h':\n        return parseInt(value + \"0\") > 12;\n      case 'm':\n      case 's':\n        return parseInt(value + \"0\") > 59;\n      default:\n        return false;\n    }\n  }, [format]);\n  (0, _useUpdateEffect.default)(function () {\n    if (!value) {\n      reset();\n    }\n  }, [value]);\n  return {\n    increment: increment,\n    reset: reset,\n    isMoveCursor: isMoveCursor\n  };\n}\nvar _default = useFieldCursor;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/DateInput/hooks/useFieldCursor.ts?");
 
 /***/ }),
 
-/***/ "./src/DateInput/useIsFocused.ts":
-/*!***************************************!*\
-  !*** ./src/DateInput/useIsFocused.ts ***!
-  \***************************************/
+/***/ "./src/DateInput/hooks/useIsFocused.ts":
+/*!*********************************************!*\
+  !*** ./src/DateInput/hooks/useIsFocused.ts ***!
+  \*********************************************/
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nexports.__esModule = true;\nexports.useIsFocused = useIsFocused;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nfunction useIsFocused(_ref) {\n  var onFocusProp = _ref.onFocus,\n    onBlurProp = _ref.onBlur;\n  var _useState = (0, _react.useState)(false),\n    isFocused = _useState[0],\n    setIsFocused = _useState[1];\n  var onFocus = (0, _react.useCallback)(function (event) {\n    setIsFocused(true);\n    onFocusProp === null || onFocusProp === void 0 ? void 0 : onFocusProp(event);\n  }, [onFocusProp]);\n  var onBlur = (0, _react.useCallback)(function (event) {\n    setIsFocused(false);\n    onBlurProp === null || onBlurProp === void 0 ? void 0 : onBlurProp(event);\n  }, [onBlurProp]);\n  return [isFocused, {\n    onFocus: onFocus,\n    onBlur: onBlur\n  }];\n}\nvar _default = useIsFocused;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/DateInput/useIsFocused.ts?");
+eval("\n\nexports.__esModule = true;\nexports.useIsFocused = useIsFocused;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nfunction useIsFocused(_ref) {\n  var onFocusProp = _ref.onFocus,\n    onBlurProp = _ref.onBlur;\n  var _useState = (0, _react.useState)(false),\n    isFocused = _useState[0],\n    setIsFocused = _useState[1];\n  var onFocus = (0, _react.useCallback)(function (event) {\n    setIsFocused(true);\n    onFocusProp === null || onFocusProp === void 0 ? void 0 : onFocusProp(event);\n  }, [onFocusProp]);\n  var onBlur = (0, _react.useCallback)(function (event) {\n    setIsFocused(false);\n    onBlurProp === null || onBlurProp === void 0 ? void 0 : onBlurProp(event);\n  }, [onBlurProp]);\n  return [isFocused, {\n    onFocus: onFocus,\n    onBlur: onBlur\n  }];\n}\nvar _default = useIsFocused;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/DateInput/hooks/useIsFocused.ts?");
 
 /***/ }),
 
-/***/ "./src/DateInput/useKeyboardInputEvent.ts":
-/*!************************************************!*\
-  !*** ./src/DateInput/useKeyboardInputEvent.ts ***!
-  \************************************************/
+/***/ "./src/DateInput/hooks/useKeyboardInputEvent.ts":
+/*!******************************************************!*\
+  !*** ./src/DateInput/hooks/useKeyboardInputEvent.ts ***!
+  \******************************************************/
 /***/ (function(__unused_webpack_module, exports) {
 
 "use strict";
-eval("\n\nexports.__esModule = true;\nexports.useKeyboardInputEvent = useKeyboardInputEvent;\nexports[\"default\"] = void 0;\nfunction useKeyboardInputEvent(_ref) {\n  var onSegmentChange = _ref.onSegmentChange,\n    onSegmentValueChange = _ref.onSegmentValueChange,\n    onSegmentValueChangeWithNumericKeys = _ref.onSegmentValueChangeWithNumericKeys,\n    onSegmentValueRemove = _ref.onSegmentValueRemove,\n    onKeyDown = _ref.onKeyDown;\n  return function (event) {\n    var _key$match, _key$match2;\n    var key = event.key;\n    switch (key) {\n      case 'ArrowRight':\n      case 'ArrowLeft':\n        onSegmentChange === null || onSegmentChange === void 0 ? void 0 : onSegmentChange(event);\n        event.preventDefault();\n        break;\n      case 'ArrowUp':\n      case 'ArrowDown':\n        onSegmentValueChange === null || onSegmentValueChange === void 0 ? void 0 : onSegmentValueChange(event);\n        event.preventDefault();\n        break;\n      case 'Backspace':\n        onSegmentValueRemove === null || onSegmentValueRemove === void 0 ? void 0 : onSegmentValueRemove(event);\n        event.preventDefault();\n        break;\n      case (_key$match = key.match(/\\d/)) === null || _key$match === void 0 ? void 0 : _key$match.input:\n        // Allow numeric keys to be entered\n        onSegmentValueChangeWithNumericKeys === null || onSegmentValueChangeWithNumericKeys === void 0 ? void 0 : onSegmentValueChangeWithNumericKeys(event);\n        event.preventDefault();\n      case (_key$match2 = key.match(/[a-z]/)) === null || _key$match2 === void 0 ? void 0 : _key$match2[0]:\n        // Prevent letters from being entered\n        event.preventDefault();\n        break;\n    }\n    onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);\n  };\n}\nvar _default = useKeyboardInputEvent;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/DateInput/useKeyboardInputEvent.ts?");
+eval("\n\nexports.__esModule = true;\nexports.useKeyboardInputEvent = useKeyboardInputEvent;\nexports[\"default\"] = void 0;\nfunction useKeyboardInputEvent(_ref) {\n  var onSegmentChange = _ref.onSegmentChange,\n    onSegmentValueChange = _ref.onSegmentValueChange,\n    onSegmentValueChangeWithNumericKeys = _ref.onSegmentValueChangeWithNumericKeys,\n    onSegmentValueRemove = _ref.onSegmentValueRemove,\n    onKeyDown = _ref.onKeyDown;\n  return function (event) {\n    var _key$match, _key$match2;\n    var key = event.key;\n    switch (key) {\n      case 'ArrowRight':\n      case 'ArrowLeft':\n        onSegmentChange === null || onSegmentChange === void 0 ? void 0 : onSegmentChange(event);\n        event.preventDefault();\n        break;\n      case 'ArrowUp':\n      case 'ArrowDown':\n        onSegmentValueChange === null || onSegmentValueChange === void 0 ? void 0 : onSegmentValueChange(event);\n        event.preventDefault();\n        break;\n      case 'Backspace':\n        onSegmentValueRemove === null || onSegmentValueRemove === void 0 ? void 0 : onSegmentValueRemove(event);\n        event.preventDefault();\n        break;\n      case (_key$match = key.match(/\\d/)) === null || _key$match === void 0 ? void 0 : _key$match.input:\n        // Allow numeric keys to be entered\n        onSegmentValueChangeWithNumericKeys === null || onSegmentValueChangeWithNumericKeys === void 0 ? void 0 : onSegmentValueChangeWithNumericKeys(event);\n        event.preventDefault();\n      case (_key$match2 = key.match(/[a-z]/)) === null || _key$match2 === void 0 ? void 0 : _key$match2[0]:\n        // Prevent letters from being entered\n        event.preventDefault();\n        break;\n    }\n    onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);\n  };\n}\nvar _default = useKeyboardInputEvent;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/DateInput/hooks/useKeyboardInputEvent.ts?");
+
+/***/ }),
+
+/***/ "./src/DateInput/hooks/useSelectedState.ts":
+/*!*************************************************!*\
+  !*** ./src/DateInput/hooks/useSelectedState.ts ***!
+  \*************************************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.useSelectedState = useSelectedState;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar defaultSelectedState = {\n  selectedPattern: 'y',\n  selectionStart: 0,\n  selectionEnd: 0\n};\nfunction useSelectedState() {\n  var _useState = (0, _react.useState)(defaultSelectedState),\n    selectedState = _useState[0],\n    setSelectedState = _useState[1];\n  return {\n    selectedState: selectedState,\n    setSelectedState: setSelectedState\n  };\n}\nvar _default = useSelectedState;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/DateInput/hooks/useSelectedState.ts?");
+
+/***/ }),
+
+/***/ "./src/DateInput/index.tsx":
+/*!*********************************!*\
+  !*** ./src/DateInput/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\");\nexports.__esModule = true;\nvar _exportNames = {\n  useDateInputState: true,\n  useKeyboardInputEvent: true,\n  useIsFocused: true,\n  useSelectedState: true,\n  useFieldCursor: true\n};\nexports[\"default\"] = exports.useFieldCursor = exports.useSelectedState = exports.useIsFocused = exports.useKeyboardInputEvent = exports.useDateInputState = void 0;\nvar _DateInput = _interopRequireDefault(__webpack_require__(/*! ./DateInput */ \"./src/DateInput/DateInput.tsx\"));\nvar _useDateInputState = __webpack_require__(/*! ./hooks/useDateInputState */ \"./src/DateInput/hooks/useDateInputState.ts\");\nexports.useDateInputState = _useDateInputState.useDateInputState;\nvar _useKeyboardInputEvent = __webpack_require__(/*! ./hooks/useKeyboardInputEvent */ \"./src/DateInput/hooks/useKeyboardInputEvent.ts\");\nexports.useKeyboardInputEvent = _useKeyboardInputEvent.useKeyboardInputEvent;\nvar _useIsFocused = __webpack_require__(/*! ./hooks/useIsFocused */ \"./src/DateInput/hooks/useIsFocused.ts\");\nexports.useIsFocused = _useIsFocused.useIsFocused;\nvar _useSelectedState = __webpack_require__(/*! ./hooks/useSelectedState */ \"./src/DateInput/hooks/useSelectedState.ts\");\nexports.useSelectedState = _useSelectedState.useSelectedState;\nvar _useFieldCursor = __webpack_require__(/*! ./hooks/useFieldCursor */ \"./src/DateInput/hooks/useFieldCursor.ts\");\nexports.useFieldCursor = _useFieldCursor.useFieldCursor;\nvar _utils = __webpack_require__(/*! ./utils */ \"./src/DateInput/utils.ts\");\nObject.keys(_utils).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] === _utils[key]) return;\n  exports[key] = _utils[key];\n});\nvar _default = _DateInput.default;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/DateInput/index.tsx?");
 
 /***/ }),
 
@@ -6879,7 +6989,7 @@ eval("\n\nexports.__esModule = true;\nexports.useKeyboardInputEvent = useKeyboar
 /***/ (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\");\nexports.__esModule = true;\nexports.getPatternGroups = getPatternGroups;\nexports.getSelectIndexGap = getSelectIndexGap;\nexports.getDatePattern = getDatePattern;\nexports.isCursorAfterMonth = isCursorAfterMonth;\nexports.getInputSelectedState = getInputSelectedState;\nexports.validateDateTime = validateDateTime;\nexports.modifyDate = modifyDate;\nexports.isFieldFullValue = isFieldFullValue;\nexports.useInputSelection = useInputSelection;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _dateUtils = __webpack_require__(/*! ../utils/dateUtils */ \"./src/utils/dateUtils.ts\");\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nfunction getPatternGroups(format, pattern) {\n  var _format$match;\n  return ((_format$match = format.match(new RegExp(\"(\" + pattern + \")+\"))) === null || _format$match === void 0 ? void 0 : _format$match[0]) || '';\n}\nfunction getSelectIndexGap(options) {\n  var pattern = options.pattern,\n    formatStr = options.formatStr,\n    valueOffset = options.valueOffset,\n    selectedMonth = options.selectedMonth,\n    localize = options.localize;\n  var gap = 0;\n  var monthIsAbbreviated = formatStr.includes('MMM');\n  var monthIsFull = formatStr.includes('MMMM');\n\n  // If the month is abbreviated or full, the gap needs to be adjusted.\n  if (monthIsAbbreviated || monthIsFull) {\n    var isSelectedMonth = pattern === 'M';\n\n    // If the selected is the month, and the valueOffset is null,\n    // it means that the delete key is pressed, and the default pattern is displayed, and the gap is 0 at this time.\n    if (isSelectedMonth && valueOffset === null) {\n      return 0;\n    }\n\n    // If the month is null and the valueOffset is 0, the month will not be updated, and the gap is 0 at this time.\n    if (selectedMonth === null && valueOffset === 0) {\n      return 0;\n    }\n    var month = selectedMonth ? selectedMonth + (isSelectedMonth ? valueOffset || 0 : 0) : 1;\n    if (month > 12) {\n      month = 1;\n    } else if (month === 0) {\n      month = 12;\n    }\n    var monthStr = localize === null || localize === void 0 ? void 0 : localize.month(month - 1, {\n      width: monthIsFull ? 'wide' : 'abbreviated'\n    });\n    gap = monthStr.length - (monthIsFull ? 4 : 3);\n  }\n  return gap;\n}\nfunction getDatePattern(options) {\n  var selectionIndex = options.selectionIndex,\n    _options$positionOffs = options.positionOffset,\n    positionOffset = _options$positionOffs === void 0 ? -1 : _options$positionOffs,\n    formatStr = options.formatStr,\n    dateString = options.dateString,\n    valueOffset = options.valueOffset,\n    selectedMonth = options.selectedMonth,\n    localize = options.localize;\n  var pattern = formatStr.charAt(selectionIndex || 0);\n  if (selectionIndex < 0 || selectionIndex > dateString.length - 1) {\n    pattern = formatStr.trim().charAt(0);\n    return pattern;\n  }\n  var gap = 0;\n  if (isCursorAfterMonth(selectionIndex, formatStr)) {\n    gap = getSelectIndexGap({\n      pattern: pattern,\n      formatStr: formatStr,\n      valueOffset: valueOffset,\n      selectedMonth: selectedMonth,\n      localize: localize\n    });\n  }\n  pattern = formatStr.charAt(selectionIndex - gap);\n\n  // If the pattern is not a letter, then get the pattern from the previous or next letter.\n  if (!pattern.match(/[y|d|M|H|h|m|s|a]/)) {\n    var nextIndex = selectionIndex + positionOffset;\n    pattern = getDatePattern((0, _extends2.default)({}, options, {\n      selectionIndex: nextIndex\n    }));\n  }\n  return pattern;\n}\n\n// Determine whether the cursor is after the month.\n// If the currently operated field is after the month, the selected field needs to be moved backward.\nfunction isCursorAfterMonth(cursorIndex, formatStr) {\n  return cursorIndex > formatStr.indexOf('M');\n}\nfunction getInputSelectedState(options) {\n  var input = options.input,\n    direction = options.direction,\n    formatStr = options.formatStr,\n    localize = options.localize,\n    selectedMonth = options.selectedMonth,\n    dateString = options.dateString,\n    _options$valueOffset = options.valueOffset,\n    valueOffset = _options$valueOffset === void 0 ? 0 : _options$valueOffset;\n  var getPatternSelectedIndexes = function getPatternSelectedIndexes(pattern) {\n    var selectionStart = formatStr.indexOf(pattern);\n    var selectionEnd = formatStr.lastIndexOf(pattern) + 1;\n    var gap = getSelectIndexGap({\n      pattern: pattern,\n      formatStr: formatStr,\n      valueOffset: valueOffset,\n      selectedMonth: selectedMonth,\n      localize: localize\n    });\n    var isSelectedMonth = pattern === 'M';\n    var isNullMonth = selectedMonth === null && !(isSelectedMonth && valueOffset !== 0);\n\n    // If the month is null and the valueOffset is 0, the month will not be updated, and the gap is 0 at this time.\n    if (isNullMonth) {\n      return {\n        selectionStart: selectionStart,\n        selectionEnd: selectionEnd\n      };\n    }\n    if (isSelectedMonth) {\n      return {\n        selectionStart: selectionStart,\n        selectionEnd: selectionEnd + gap\n      };\n    }\n    if (isCursorAfterMonth(selectionStart, formatStr)) {\n      return {\n        selectionStart: selectionStart + gap,\n        selectionEnd: selectionEnd + gap\n      };\n    }\n    return {\n      selectionStart: selectionStart,\n      selectionEnd: selectionEnd\n    };\n  };\n  if (typeof input.selectionEnd === 'number' && typeof input.selectionStart === 'number') {\n    var selectionIndex = input.selectionStart;\n    var positionOffset = -1;\n    if (direction === 'left') {\n      selectionIndex = input.selectionStart - 1;\n    } else if (direction === 'right') {\n      selectionIndex = input.selectionEnd + 1;\n      positionOffset = 1;\n    }\n    var datePattern = getDatePattern({\n      selectionIndex: selectionIndex,\n      positionOffset: positionOffset,\n      formatStr: formatStr,\n      dateString: dateString,\n      valueOffset: valueOffset,\n      selectedMonth: selectedMonth,\n      localize: localize\n    });\n    var indexes = getPatternSelectedIndexes(datePattern);\n    return (0, _extends2.default)({\n      selectedPattern: datePattern\n    }, indexes);\n  }\n  return {\n    selectedPattern: 'y',\n    selectionStart: 0,\n    selectionEnd: 0\n  };\n}\nfunction validateDateTime(type, value) {\n  switch (type) {\n    case 'year':\n      if (value < 1 || value > 9999) {\n        return false;\n      }\n      break;\n    case 'month':\n      if (value < 1 || value > 12) {\n        return false;\n      }\n      break;\n    case 'day':\n      if (value < 1 || value > 31) {\n        return false;\n      }\n      break;\n    case 'hour':\n      if (value < 0 || value > 23) {\n        return false;\n      }\n      break;\n    case 'minute':\n      if (value < 0 || value > 59) {\n        return false;\n      }\n      break;\n    case 'second':\n      if (value < 0 || value > 59) {\n        return false;\n      }\n      break;\n    default:\n      return false;\n    // Invalid type\n  }\n\n  return true;\n}\nfunction modifyDate(date, type, value) {\n  switch (type) {\n    case 'year':\n      return (0, _dateUtils.setYear)(date, value);\n    case 'month':\n      return (0, _dateUtils.setMonth)(date, value - 1);\n    case 'day':\n      return (0, _dateUtils.setDate)(date, value);\n    case 'hour':\n      return (0, _dateUtils.setHours)(date, value);\n    case 'minute':\n      return (0, _dateUtils.setMinutes)(date, value);\n    case 'second':\n      return (0, _dateUtils.setSeconds)(date, value);\n  }\n  return date;\n}\nfunction isFieldFullValue(formatStr, value, pattern) {\n  var patternGroup = getPatternGroups(formatStr, pattern);\n  if (value.toString().length === patternGroup.length) {\n    return true;\n  }\n  switch (pattern) {\n    case 'M':\n      return parseInt(value + \"0\") > 12;\n    case 'd':\n      return parseInt(value + \"0\") > 31;\n    case 'H':\n      return parseInt(value + \"0\") > 23;\n    case 'h':\n      return parseInt(value + \"0\") > 12;\n    case 'm':\n    case 's':\n      return parseInt(value + \"0\") > 59;\n    default:\n      return false;\n  }\n}\nvar isTestEnvironment = typeof process !== 'undefined' && undefined === 'test';\nfunction useInputSelection(input) {\n  return function setSelectionRange(selectionStart, selectionEnd) {\n    if (isTestEnvironment) {\n      (0, _utils.safeSetSelection)(input.current, selectionStart, selectionEnd);\n      return;\n    }\n    requestAnimationFrame(function () {\n      (0, _utils.safeSetSelection)(input.current, selectionStart, selectionEnd);\n    });\n  };\n}\n\n//# sourceURL=webpack://rsuite/./src/DateInput/utils.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports.getPatternGroups = getPatternGroups;\nexports.getSelectIndexGap = getSelectIndexGap;\nexports.getDatePattern = getDatePattern;\nexports.isCursorAfterMonth = isCursorAfterMonth;\nexports.getInputSelectedState = getInputSelectedState;\nexports.validateDateTime = validateDateTime;\nexports.modifyDate = modifyDate;\nexports.useInputSelection = useInputSelection;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _dateUtils = __webpack_require__(/*! ../utils/dateUtils */ \"./src/utils/dateUtils.ts\");\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nfunction getPatternGroups(format, pattern) {\n  var _format$match;\n  return ((_format$match = format.match(new RegExp(\"(\" + pattern + \")+\"))) === null || _format$match === void 0 ? void 0 : _format$match[0]) || '';\n}\nfunction getSelectIndexGap(options) {\n  var pattern = options.pattern,\n    formatStr = options.formatStr,\n    valueOffset = options.valueOffset,\n    selectedMonth = options.selectedMonth,\n    localize = options.localize;\n  var gap = 0;\n  var monthIsAbbreviated = formatStr.includes('MMM');\n  var monthIsFull = formatStr.includes('MMMM');\n\n  // If the month is abbreviated or full, the gap needs to be adjusted.\n  if (monthIsAbbreviated || monthIsFull) {\n    var isSelectedMonth = pattern === 'M';\n\n    // If the selected is the month, and the valueOffset is null,\n    // it means that the delete key is pressed, and the default pattern is displayed, and the gap is 0 at this time.\n    if (isSelectedMonth && valueOffset === null) {\n      return 0;\n    }\n\n    // If the month is null and the valueOffset is 0, the month will not be updated, and the gap is 0 at this time.\n    if (selectedMonth === null && valueOffset === 0) {\n      return 0;\n    }\n    var month = selectedMonth ? selectedMonth + (isSelectedMonth ? valueOffset || 0 : 0) : 1;\n    if (month > 12) {\n      month = 1;\n    } else if (month === 0) {\n      month = 12;\n    }\n    var monthStr = localize === null || localize === void 0 ? void 0 : localize.month(month - 1, {\n      width: monthIsFull ? 'wide' : 'abbreviated'\n    });\n    gap = monthStr.length - (monthIsFull ? 4 : 3);\n  }\n  return gap;\n}\nfunction getDatePattern(options) {\n  var selectionIndex = options.selectionIndex,\n    _options$positionOffs = options.positionOffset,\n    positionOffset = _options$positionOffs === void 0 ? -1 : _options$positionOffs,\n    formatStr = options.formatStr,\n    dateString = options.dateString,\n    valueOffset = options.valueOffset,\n    selectedMonth = options.selectedMonth,\n    localize = options.localize;\n  var pattern = formatStr.charAt(selectionIndex || 0);\n  if (selectionIndex < 0 || selectionIndex > dateString.length - 1) {\n    pattern = formatStr.trim().charAt(0);\n    return pattern;\n  }\n  var gap = 0;\n  if (isCursorAfterMonth(selectionIndex, formatStr)) {\n    gap = getSelectIndexGap({\n      pattern: pattern,\n      formatStr: formatStr,\n      valueOffset: valueOffset,\n      selectedMonth: selectedMonth,\n      localize: localize\n    });\n  }\n  pattern = formatStr.charAt(selectionIndex - gap);\n\n  // If the pattern is not a letter, then get the pattern from the previous or next letter.\n  if (!pattern.match(/[y|d|M|H|h|m|s|a]/)) {\n    var nextIndex = selectionIndex + positionOffset;\n    pattern = getDatePattern((0, _extends2.default)({}, options, {\n      selectionIndex: nextIndex\n    }));\n  }\n  return pattern;\n}\n\n// Determine whether the cursor is after the month.\n// If the currently operated field is after the month, the selected field needs to be moved backward.\nfunction isCursorAfterMonth(cursorIndex, formatStr) {\n  return cursorIndex > formatStr.indexOf('M');\n}\nfunction getInputSelectedState(options) {\n  var input = options.input,\n    direction = options.direction,\n    formatStr = options.formatStr,\n    localize = options.localize,\n    selectedMonth = options.selectedMonth,\n    dateString = options.dateString,\n    _options$valueOffset = options.valueOffset,\n    valueOffset = _options$valueOffset === void 0 ? 0 : _options$valueOffset;\n  var getPatternSelectedIndexes = function getPatternSelectedIndexes(pattern) {\n    var selectionStart = formatStr.indexOf(pattern);\n    var selectionEnd = formatStr.lastIndexOf(pattern) + 1;\n    var gap = getSelectIndexGap({\n      pattern: pattern,\n      formatStr: formatStr,\n      valueOffset: valueOffset,\n      selectedMonth: selectedMonth,\n      localize: localize\n    });\n    var isSelectedMonth = pattern === 'M';\n    var isNullMonth = selectedMonth === null && !(isSelectedMonth && valueOffset !== 0);\n\n    // If the month is null and the valueOffset is 0, the month will not be updated, and the gap is 0 at this time.\n    if (isNullMonth) {\n      return {\n        selectionStart: selectionStart,\n        selectionEnd: selectionEnd\n      };\n    }\n    if (isSelectedMonth) {\n      return {\n        selectionStart: selectionStart,\n        selectionEnd: selectionEnd + gap\n      };\n    }\n    if (isCursorAfterMonth(selectionStart, formatStr)) {\n      return {\n        selectionStart: selectionStart + gap,\n        selectionEnd: selectionEnd + gap\n      };\n    }\n    return {\n      selectionStart: selectionStart,\n      selectionEnd: selectionEnd\n    };\n  };\n  if (typeof input.selectionEnd === 'number' && typeof input.selectionStart === 'number') {\n    var selectionIndex = input.selectionStart;\n    var positionOffset = -1;\n    if (direction === 'left') {\n      selectionIndex = input.selectionStart - 1;\n    } else if (direction === 'right') {\n      selectionIndex = input.selectionEnd + 1;\n      positionOffset = 1;\n    }\n    var datePattern = getDatePattern({\n      selectionIndex: selectionIndex,\n      positionOffset: positionOffset,\n      formatStr: formatStr,\n      dateString: dateString,\n      valueOffset: valueOffset,\n      selectedMonth: selectedMonth,\n      localize: localize\n    });\n    var indexes = getPatternSelectedIndexes(datePattern);\n    return (0, _extends2.default)({\n      selectedPattern: datePattern\n    }, indexes);\n  }\n  return {\n    selectedPattern: 'y',\n    selectionStart: 0,\n    selectionEnd: 0\n  };\n}\nfunction validateDateTime(type, value) {\n  switch (type) {\n    case 'year':\n      if (value < 1 || value > 9999) {\n        return false;\n      }\n      break;\n    case 'month':\n      if (value < 1 || value > 12) {\n        return false;\n      }\n      break;\n    case 'day':\n      if (value < 1 || value > 31) {\n        return false;\n      }\n      break;\n    case 'hour':\n      if (value < 0 || value > 23) {\n        return false;\n      }\n      break;\n    case 'minute':\n      if (value < 0 || value > 59) {\n        return false;\n      }\n      break;\n    case 'second':\n      if (value < 0 || value > 59) {\n        return false;\n      }\n      break;\n    default:\n      return false;\n    // Invalid type\n  }\n\n  return true;\n}\nfunction modifyDate(date, type, value) {\n  switch (type) {\n    case 'year':\n      return (0, _dateUtils.setYear)(date, value);\n    case 'month':\n      return (0, _dateUtils.setMonth)(date, value - 1);\n    case 'day':\n      return (0, _dateUtils.setDate)(date, value);\n    case 'hour':\n      return (0, _dateUtils.setHours)(date, value);\n    case 'minute':\n      return (0, _dateUtils.setMinutes)(date, value);\n    case 'second':\n      return (0, _dateUtils.setSeconds)(date, value);\n  }\n  return date;\n}\nfunction useInputSelection(input) {\n  return function setSelectionRange(selectionStart, selectionEnd) {\n    var isTest = input.current.dataset.test === 'true';\n    if (isTest) {\n      (0, _utils.safeSetSelection)(input.current, selectionStart, selectionEnd);\n      return;\n    }\n    requestAnimationFrame(function () {\n      (0, _utils.safeSetSelection)(input.current, selectionStart, selectionEnd);\n    });\n  };\n}\n\n//# sourceURL=webpack://rsuite/./src/DateInput/utils.ts?");
 
 /***/ }),
 
@@ -6890,7 +7000,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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _mapValues = _interopRequireDefault(__webpack_require__(/*! lodash/mapValues */ \"./node_modules/lodash/mapValues.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _Calendar = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/Calendar */ \"./node_modules/@rsuite/icons/legacy/Calendar.js\"));\nvar _ClockO = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/ClockO */ \"./node_modules/@rsuite/icons/legacy/ClockO.js\"));\nvar _CalendarContainer = _interopRequireDefault(__webpack_require__(/*! ../Calendar/CalendarContainer */ \"./src/Calendar/CalendarContainer.tsx\"));\nvar _useCalendarDate2 = _interopRequireDefault(__webpack_require__(/*! ../Calendar/useCalendarDate */ \"./src/Calendar/useCalendarDate.ts\"));\nvar _MonthDropdown = __webpack_require__(/*! ../Calendar/MonthDropdown */ \"./src/Calendar/MonthDropdown.tsx\");\nvar _Toolbar = _interopRequireDefault(__webpack_require__(/*! ./Toolbar */ \"./src/DatePicker/Toolbar.tsx\"));\nvar _Stack = _interopRequireDefault(__webpack_require__(/*! ../Stack */ \"./src/Stack/index.tsx\"));\nvar _PredefinedRanges = _interopRequireDefault(__webpack_require__(/*! ./PredefinedRanges */ \"./src/DatePicker/PredefinedRanges.tsx\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _dateUtils = __webpack_require__(/*! ../utils/dateUtils */ \"./src/utils/dateUtils.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _OverlayTrigger = __webpack_require__(/*! ../internals/Overlay/OverlayTrigger */ \"./src/internals/Overlay/OverlayTrigger.tsx\");\nvar _DateInput = _interopRequireDefault(__webpack_require__(/*! ../DateInput */ \"./src/DateInput/index.tsx\"));\nvar _InputGroup = _interopRequireDefault(__webpack_require__(/*! ../InputGroup */ \"./src/InputGroup/index.tsx\"));\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/DatePicker/utils.ts\");\nvar _useMonthView2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useMonthView */ \"./src/DatePicker/hooks/useMonthView.ts\"));\nvar _useFocus2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFocus */ \"./src/DatePicker/hooks/useFocus.ts\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DatePicker/DatePicker.tsx\",\n  _this = void 0,\n  _templateObject;\n/**\n * A date picker allows users to select a date from a calendar.\n *\n * @see https://rsuitejs.com/components/date-picker\n */\nvar DatePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _merge;\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    _props$editable = props.editable,\n    editable = _props$editable === void 0 ? true : _props$editable,\n    defaultValue = props.defaultValue,\n    disabled = props.disabled,\n    readOnly = props.readOnly,\n    plaintext = props.plaintext,\n    _props$format = props.format,\n    formatStr = _props$format === void 0 ? 'yyyy-MM-dd' : _props$format,\n    idProp = props.id,\n    isoWeek = props.isoWeek,\n    _props$limitEndYear = props.limitEndYear,\n    limitEndYear = _props$limitEndYear === void 0 ? 1000 : _props$limitEndYear,\n    limitStartYear = props.limitStartYear,\n    overrideLocale = props.locale,\n    loading = props.loading,\n    label = props.label,\n    menuClassName = props.menuClassName,\n    menuStyle = props.menuStyle,\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    size = props.size,\n    caretAsProp = props.caretAs,\n    shouldDisableDate = props.shouldDisableDate,\n    shouldDisableHour = props.shouldDisableHour,\n    shouldDisableMinute = props.shouldDisableMinute,\n    shouldDisableSecond = props.shouldDisableSecond,\n    onChange = props.onChange,\n    onChangeCalendarDate = props.onChangeCalendarDate,\n    onClean = props.onClean,\n    onEntered = props.onEntered,\n    onExited = props.onExited,\n    onNextMonth = props.onNextMonth,\n    onOk = props.onOk,\n    onPrevMonth = props.onPrevMonth,\n    onSelect = props.onSelect,\n    onToggleMonthDropdown = props.onToggleMonthDropdown,\n    onToggleTimeDropdown = props.onToggleTimeDropdown,\n    onShortcutClick = props.onShortcutClick,\n    renderCell = props.renderCell,\n    DEPRECATED_disabledDate = props.disabledDate,\n    DEPRECATED_disabledHours = props.disabledHours,\n    DEPRECATED_disabledMinutes = props.disabledMinutes,\n    DEPRECATED_disabledSeconds = props.disabledSeconds,\n    restProps = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\", \"calendarDefaultDate\", \"cleanable\", \"editable\", \"defaultValue\", \"disabled\", \"readOnly\", \"plaintext\", \"format\", \"id\", \"isoWeek\", \"limitEndYear\", \"limitStartYear\", \"locale\", \"loading\", \"label\", \"menuClassName\", \"menuStyle\", \"appearance\", \"placement\", \"oneTap\", \"placeholder\", \"ranges\", \"value\", \"showMeridian\", \"showWeekNumbers\", \"style\", \"size\", \"caretAs\", \"shouldDisableDate\", \"shouldDisableHour\", \"shouldDisableMinute\", \"shouldDisableSecond\", \"onChange\", \"onChangeCalendarDate\", \"onClean\", \"onEntered\", \"onExited\", \"onNextMonth\", \"onOk\", \"onPrevMonth\", \"onSelect\", \"onToggleMonthDropdown\", \"onToggleTimeDropdown\", \"onShortcutClick\", \"renderCell\", \"disabledDate\", \"disabledHours\", \"disabledMinutes\", \"disabledSeconds\"]);\n  var id = (0, _utils.useUniqueId)('rs-', idProp);\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay;\n  var _useCustom = (0, _utils.useCustom)('DatePicker', overrideLocale),\n    locale = _useCustom.locale;\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    merge = _useClassNames.merge,\n    prefix = _useClassNames.prefix;\n  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue),\n    value = _useControlled[0],\n    setValue = _useControlled[1];\n  var _useCalendarDate = (0, _useCalendarDate2.default)(value, calendarDefaultDate),\n    calendarDate = _useCalendarDate.calendarDate,\n    setCalendarDate = _useCalendarDate.setCalendarDate,\n    resetCalendarDate = _useCalendarDate.resetCalendarDate;\n  var _useMonthView = (0, _useMonthView2.default)({\n      onToggleMonthDropdown: onToggleMonthDropdown\n    }),\n    setMonthView = _useMonthView.setMonthView,\n    monthView = _useMonthView.monthView,\n    toggleMonthView = _useMonthView.toggleMonthView; // Show only the calendar month panel. formatStr = 'yyyy-MM'\n  var onlyShowMonth = (0, _dateUtils.shouldRenderMonth)(formatStr) && !(0, _dateUtils.shouldRenderDate)(formatStr);\n  var showMonth = onlyShowMonth || monthView;\n  var _useFocus = (0, _useFocus2.default)({\n      target: target,\n      showMonth: showMonth,\n      id: id,\n      locale: locale\n    }),\n    focusInput = _useFocus.focusInput,\n    focusSelectedDate = _useFocus.focusSelectedDate,\n    onKeyFocusEvent = _useFocus.onKeyFocusEvent;\n  /**\n   * Check whether the date is disabled.\n   */\n  var isDateDisabled = function isDateDisabled(date) {\n    if (typeof shouldDisableDate === 'function') {\n      return shouldDisableDate(date);\n    }\n    if (typeof DEPRECATED_disabledDate === 'function') {\n      return DEPRECATED_disabledDate(date);\n    }\n    return false;\n  };\n\n  /**\n   * Check whether the time is within the time range of the shortcut option in the toolbar.\n   */\n  var isDatetimeDisabled = function isDatetimeDisabled(date) {\n    return (isDateDisabled === null || isDateDisabled === void 0 ? void 0 : isDateDisabled(date)) || (0, _dateUtils.disableTime)(props, date);\n  };\n\n  /**\n   * Check whether the month is disabled.\n   * If any day in the month is disabled, the entire month is disabled\n   */\n  var isMonthDisabled = function isMonthDisabled(date) {\n    return (0, _MonthDropdown.isEveryDateInMonth)(date.getFullYear(), date.getMonth(), isDateDisabled);\n  };\n\n  /**\n   * Whether \"OK\" button is disabled\n   *\n   * - If format is date, disable ok button if selected date is disabled\n   * - If format is month, disable ok button if all dates in the month of selected date are disabled\n   */\n  var isOkButtonDisabled = function isOkButtonDisabled(selectedDate) {\n    if ((0, _dateUtils.shouldRenderMonth)(formatStr) && !(0, _dateUtils.shouldRenderDate)(formatStr)) {\n      return isMonthDisabled(selectedDate);\n    }\n    return isDatetimeDisabled(selectedDate);\n  };\n  var isErrorValue = function isErrorValue(value) {\n    if (!(0, _dateUtils.isValid)(value)) {\n      return true;\n    } else if (value && isDateDisabled(value)) {\n      return true;\n    }\n    return false;\n  };\n\n  /**\n   * Switch to the callback triggered after the next month.\n   */\n  var handleMoveForward = (0, _utils.useEventCallback)(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  });\n\n  /**\n   * Switch to the callback triggered after the previous month.\n   */\n  var handleMoveBackward = (0, _utils.useEventCallback)(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  });\n\n  /**\n   * The callback triggered when the date changes.\n   */\n  var handleDateChange = (0, _utils.useEventCallback)(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  });\n\n  /**\n   *  A callback triggered when the time on the calendar changes.\n   */\n  var handleChangeTime = (0, _utils.useEventCallback)(function (nextPageTime) {\n    setCalendarDate(nextPageTime);\n    handleDateChange(nextPageTime);\n  });\n\n  /**\n   * Close the calendar panel.\n   */\n  var handleClose = (0, _utils.useEventCallback)(function () {\n    var _trigger$current, _trigger$current$clos;\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 ? void 0 : _trigger$current$clos.call(_trigger$current);\n  });\n\n  /**\n   * The callback triggered when PM/AM is switched.\n   */\n  var handleToggleMeridian = (0, _utils.useEventCallback)(function () {\n    var hours = (0, _dateUtils.getHours)(calendarDate);\n    var nextHours = hours >= 12 ? hours - 12 : hours + 12;\n    var nextDate = (0, _dateUtils.setHours)(calendarDate, nextHours);\n    handleChangeTime(nextDate);\n  });\n  var updateValue = function updateValue(event, date, closeOverlay) {\n    if (closeOverlay === void 0) {\n      closeOverlay = true;\n    }\n    var nextValue = typeof date !== 'undefined' ? date : calendarDate;\n    setCalendarDate(nextValue || new Date());\n    setValue(nextValue);\n    if (nextValue !== value) {\n      onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n    }\n\n    // `closeOverlay` default value is `true`\n    if (closeOverlay !== false) {\n      handleClose();\n    }\n  };\n\n  /**\n   * The callback triggered after the date in the shortcut area is clicked.\n   */\n  var handleShortcutPageDate = (0, _utils.useEventCallback)(function (range, closeOverlay, event) {\n    var value = range.value;\n    updateValue(event, value, closeOverlay);\n    handleDateChange(value, event);\n    onShortcutClick === null || onShortcutClick === void 0 ? void 0 : onShortcutClick(range, event);\n  });\n\n  /**\n   * The callback triggered after clicking the OK button.\n   */\n  var handleOK = (0, _utils.useEventCallback)(function (event) {\n    updateValue(event);\n    onOk === null || onOk === void 0 ? void 0 : onOk(calendarDate, event);\n    focusInput();\n  });\n\n  /**\n   * Callback after clicking the clear button.\n   */\n\n  var handleClean = (0, _utils.useEventCallback)(function (event) {\n    event === null || event === void 0 ? void 0 : event.stopPropagation();\n    updateValue(event, null);\n    resetCalendarDate(null);\n    onClean === null || onClean === void 0 ? void 0 : onClean(event);\n  });\n  var handlePickerPopupKeyDown = (0, _utils.useEventCallback)(function (event) {\n    onKeyFocusEvent(event, {\n      date: calendarDate,\n      callback: setCalendarDate\n    });\n    if (event.key === 'Enter') {\n      handleOK(event);\n    }\n  });\n  var handleClick = (0, _utils.useEventCallback)(function () {\n    if (editable) {\n      return;\n    }\n    focusSelectedDate();\n  });\n\n  /**\n   * Callback after the date is selected.\n   */\n  var handleSelect = (0, _utils.useEventCallback)(function (nextValue, event, updatableValue) {\n    if (updatableValue === void 0) {\n      updatableValue = true;\n    }\n    setCalendarDate(\n    // Determine whether the current value contains time, if not, use calendarDate.\n    (0, _dateUtils.shouldRenderTime)(formatStr) ? nextValue : (0, _dateUtils.copyTime)({\n      from: calendarDate,\n      to: nextValue\n    }));\n    handleDateChange(nextValue);\n    if (oneTap && updatableValue) {\n      updateValue(event, nextValue);\n      focusInput();\n    }\n  });\n\n  /**\n   *  A callback triggered when the date on the calendar changes.\n   */\n  var handleChangeMonth = (0, _utils.useEventCallback)(function (nextPageDate, event) {\n    setCalendarDate(nextPageDate);\n    handleDateChange(nextPageDate);\n    focusSelectedDate();\n    if (oneTap && onlyShowMonth) {\n      updateValue(event, nextPageDate);\n      focusInput();\n    }\n  });\n\n  /**\n   * Callback after the input box value is changed.\n   */\n  var handleInputChange = (0, _utils.useEventCallback)(function (value, event) {\n    if (!isErrorValue(value)) {\n      handleSelect(value, event);\n    }\n    updateValue(event, value, false);\n  });\n  var handleInputKeyDown = (0, _utils.useEventCallback)(function (event) {\n    (0, _Picker.onMenuKeyDown)(event, {\n      esc: handleClose,\n      enter: function enter() {\n        var _trigger$current2;\n        var _ref = ((_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : _trigger$current2.getState()) || {},\n          open = _ref.open;\n        if (open) {\n          if ((0, _dateUtils.isValid)(calendarDate) && !isDateDisabled(calendarDate)) {\n            updateValue(event);\n            focusInput();\n          }\n        } else {\n          var _trigger$current3;\n          (_trigger$current3 = trigger.current) === null || _trigger$current3 === void 0 ? void 0 : _trigger$current3.open();\n        }\n      }\n    });\n  });\n  var calendarProps = (0, _mapValues.default)((0, _pick.default)(props, _dateUtils.calendarOnlyProps), function (func) {\n    return function (next, date) {\n      var _func;\n      return (_func = func === null || func === void 0 ? void 0 : func(next, date)) !== null && _func !== void 0 ? _func : false;\n    };\n  });\n  var _splitRanges = (0, _utils2.splitRanges)(ranges),\n    sideRanges = _splitRanges.sideRanges,\n    bottomRanges = _splitRanges.bottomRanges;\n  var renderCalendarOverlay = function renderCalendarOverlay(positionProps, speakerRef) {\n    var left = positionProps.left,\n      top = positionProps.top,\n      className = positionProps.className;\n    var classes = merge(menuClassName, className, prefix('popup-date'));\n    var styles = (0, _extends2.default)({}, menuStyle, {\n      left: left,\n      top: top\n    });\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      role: \"dialog\",\n      \"aria-labelledby\": label ? id + \"-label\" : undefined,\n      tabIndex: -1,\n      className: classes,\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      style: styles,\n      target: trigger,\n      onKeyDown: handlePickerPopupKeyDown,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 517,\n        columnNumber: 9\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Stack.default, {\n      alignItems: \"flex-start\",\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 527,\n        columnNumber: 11\n      }\n    }, sideRanges.length > 0 && /*#__PURE__*/_react.default.createElement(_PredefinedRanges.default, {\n      direction: \"column\",\n      spacing: 0,\n      className: prefix('date-predefined'),\n      ranges: sideRanges,\n      calendarDate: calendarDate,\n      locale: locale,\n      disableShortcut: isDatetimeDisabled,\n      onShortcutClick: handleShortcutPageDate,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 529,\n        columnNumber: 15\n      }\n    }), /*#__PURE__*/_react.default.createElement(_Stack.default.Item, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 541,\n        columnNumber: 13\n      }\n    }, /*#__PURE__*/_react.default.createElement(_CalendarContainer.default, (0, _extends2.default)({}, calendarProps, {\n      targetId: id,\n      locale: locale,\n      showWeekNumbers: showWeekNumbers,\n      showMeridian: showMeridian,\n      disabledDate: isDateDisabled,\n      disabledHours: shouldDisableHour !== null && shouldDisableHour !== void 0 ? shouldDisableHour : DEPRECATED_disabledHours,\n      disabledMinutes: shouldDisableMinute !== null && shouldDisableMinute !== void 0 ? shouldDisableMinute : DEPRECATED_disabledMinutes,\n      disabledSeconds: shouldDisableSecond !== null && shouldDisableSecond !== void 0 ? shouldDisableSecond : DEPRECATED_disabledSeconds,\n      limitEndYear: limitEndYear,\n      limitStartYear: limitStartYear,\n      format: formatStr,\n      isoWeek: isoWeek,\n      calendarDate: calendarDate,\n      renderCellOnPicker: renderCell,\n      onMoveForward: handleMoveForward,\n      onMoveBackward: handleMoveBackward,\n      onSelect: handleSelect,\n      onToggleMonthDropdown: toggleMonthView,\n      onToggleTimeDropdown: onToggleTimeDropdown,\n      onChangeMonth: handleChangeMonth,\n      onChangeTime: handleChangeTime,\n      onToggleMeridian: handleToggleMeridian,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 542,\n        columnNumber: 15\n      }\n    })), /*#__PURE__*/_react.default.createElement(_Toolbar.default, {\n      locale: locale,\n      ranges: bottomRanges,\n      calendarDate: calendarDate,\n      disableOkBtn: isOkButtonDisabled,\n      disableShortcut: isDatetimeDisabled,\n      onShortcutClick: handleShortcutPageDate,\n      onOk: handleOK,\n      hideOkBtn: oneTap,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 567,\n        columnNumber: 15\n      }\n    }))));\n  };\n  var hasValue = (0, _dateUtils.isValid)(value);\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  var caretAs = (0, _react.useMemo)(function () {\n    if (caretAsProp === null) {\n      return null;\n    }\n    return caretAsProp || ((0, _dateUtils.shouldOnlyRenderTime)(formatStr) ? _ClockO.default : _Calendar.default);\n  }, [caretAsProp, formatStr]);\n  var handleTriggerClose = (0, _utils.useEventCallback)(function (cause) {\n    var _props$onClose;\n    // Unless overlay is closing on user clicking \"OK\" button,\n    // reset the selected date on calendar panel\n    if (cause !== _OverlayTrigger.OverlayCloseCause.ImperativeHandle) {\n      resetCalendarDate();\n    }\n    setMonthView(false);\n    (_props$onClose = props.onClose) === null || _props$onClose === void 0 ? void 0 : _props$onClose.call(props);\n  });\n  var showCleanButton = cleanable && hasValue && !readOnly;\n  var _partitionHTMLProps = (0, _utils.partitionHTMLProps)(restProps, {\n      htmlProps: [],\n      includeAria: true\n    }),\n    ariaProps = _partitionHTMLProps[0],\n    rest = _partitionHTMLProps[1];\n  var invalidValue = value && isErrorValue(value);\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    trigger: \"active\",\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: trigger,\n    placement: placement,\n    onClose: handleTriggerClose,\n    onEntered: onEntered,\n    onExited: onExited,\n    speaker: renderCalendarOverlay,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 617,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: merge(className, classes, (_merge = {}, _merge[prefix('error')] = invalidValue, _merge)),\n    style: style,\n    ref: root,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 627,\n      columnNumber: 9\n    }\n  }, plaintext ? /*#__PURE__*/_react.default.createElement(_DateInput.default, {\n    value: value,\n    format: formatStr,\n    plaintext: plaintext,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 633,\n      columnNumber: 13\n    }\n  }) : /*#__PURE__*/_react.default.createElement(_InputGroup.default, (0, _extends2.default)({}, (0, _utils2.getRestProps)(rest, usedClassNamePropKeys), {\n    inside: true,\n    size: size,\n    onClick: handleClick,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 635,\n      columnNumber: 13\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Picker.PickerLabel, {\n    className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)([\"label\"]))),\n    id: id + \"-label\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 641,\n      columnNumber: 15\n    }\n  }, label), /*#__PURE__*/_react.default.createElement(_DateInput.default, (0, _extends2.default)({\n    \"aria-haspopup\": \"dialog\",\n    \"aria-invalid\": invalidValue,\n    \"aria-labelledby\": label ? id + \"-label\" : undefined\n  }, ariaProps, {\n    ref: target,\n    id: id,\n    value: value,\n    format: formatStr,\n    placeholder: placeholder ? placeholder : formatStr,\n    disabled: disabled,\n    onChange: handleInputChange,\n    readOnly: readOnly || !editable || loading,\n    plaintext: plaintext,\n    onKeyDown: handleInputKeyDown,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 644,\n      columnNumber: 15\n    }\n  })), /*#__PURE__*/_react.default.createElement(_Picker.PickerIndicator, {\n    loading: loading,\n    caretAs: caretAs,\n    onClose: handleClean,\n    showCleanButton: showCleanButton,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 660,\n      columnNumber: 15\n    }\n  }))));\n});\nDatePicker.displayName = 'DatePicker';\nDatePicker.propTypes = (0, _extends2.default)({}, _Picker.pickerPropTypes, _utils2.deprecatedPropTypes, {\n  calendarDefaultDate: _propTypes.default.instanceOf(Date),\n  defaultValue: _propTypes.default.instanceOf(Date),\n  shouldDisableDate: _propTypes.default.func,\n  shouldDisableHour: _propTypes.default.func,\n  shouldDisableMinute: _propTypes.default.func,\n  shouldDisableSecond: _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  limitStartYear: _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  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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _mapValues = _interopRequireDefault(__webpack_require__(/*! lodash/mapValues */ \"./node_modules/lodash/mapValues.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _Calendar = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/Calendar */ \"./node_modules/@rsuite/icons/legacy/Calendar.js\"));\nvar _ClockO = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/ClockO */ \"./node_modules/@rsuite/icons/legacy/ClockO.js\"));\nvar _CalendarContainer = _interopRequireDefault(__webpack_require__(/*! ../Calendar/CalendarContainer */ \"./src/Calendar/CalendarContainer.tsx\"));\nvar _useCalendarDate2 = _interopRequireDefault(__webpack_require__(/*! ../Calendar/useCalendarDate */ \"./src/Calendar/useCalendarDate.ts\"));\nvar _MonthDropdown = __webpack_require__(/*! ../Calendar/MonthDropdown */ \"./src/Calendar/MonthDropdown.tsx\");\nvar _Toolbar = _interopRequireDefault(__webpack_require__(/*! ./Toolbar */ \"./src/DatePicker/Toolbar.tsx\"));\nvar _Stack = _interopRequireDefault(__webpack_require__(/*! ../Stack */ \"./src/Stack/index.tsx\"));\nvar _PredefinedRanges = _interopRequireDefault(__webpack_require__(/*! ./PredefinedRanges */ \"./src/DatePicker/PredefinedRanges.tsx\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _dateUtils = __webpack_require__(/*! ../utils/dateUtils */ \"./src/utils/dateUtils.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _OverlayTrigger = __webpack_require__(/*! ../internals/Overlay/OverlayTrigger */ \"./src/internals/Overlay/OverlayTrigger.tsx\");\nvar _Input = _interopRequireDefault(__webpack_require__(/*! ../Input */ \"./src/Input/index.tsx\"));\nvar _DateInput = _interopRequireDefault(__webpack_require__(/*! ../DateInput */ \"./src/DateInput/index.tsx\"));\nvar _InputGroup = _interopRequireDefault(__webpack_require__(/*! ../InputGroup */ \"./src/InputGroup/index.tsx\"));\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/DatePicker/utils.ts\");\nvar _useMonthView2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useMonthView */ \"./src/DatePicker/hooks/useMonthView.ts\"));\nvar _useFocus2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFocus */ \"./src/DatePicker/hooks/useFocus.ts\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DatePicker/DatePicker.tsx\",\n  _this = void 0,\n  _templateObject;\n/**\n * A date picker allows users to select a date from a calendar.\n *\n * @see https://rsuitejs.com/components/date-picker\n */\nvar DatePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _merge;\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    _props$editable = props.editable,\n    editable = _props$editable === void 0 ? true : _props$editable,\n    defaultValue = props.defaultValue,\n    disabled = props.disabled,\n    readOnly = props.readOnly,\n    plaintext = props.plaintext,\n    _props$format = props.format,\n    formatStr = _props$format === void 0 ? 'yyyy-MM-dd' : _props$format,\n    idProp = props.id,\n    isoWeek = props.isoWeek,\n    _props$limitEndYear = props.limitEndYear,\n    limitEndYear = _props$limitEndYear === void 0 ? 1000 : _props$limitEndYear,\n    limitStartYear = props.limitStartYear,\n    overrideLocale = props.locale,\n    loading = props.loading,\n    label = props.label,\n    menuClassName = props.menuClassName,\n    menuStyle = props.menuStyle,\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    size = props.size,\n    caretAsProp = props.caretAs,\n    shouldDisableDate = props.shouldDisableDate,\n    shouldDisableHour = props.shouldDisableHour,\n    shouldDisableMinute = props.shouldDisableMinute,\n    shouldDisableSecond = props.shouldDisableSecond,\n    onChange = props.onChange,\n    onChangeCalendarDate = props.onChangeCalendarDate,\n    onClean = props.onClean,\n    onEntered = props.onEntered,\n    onExited = props.onExited,\n    onNextMonth = props.onNextMonth,\n    onOk = props.onOk,\n    onPrevMonth = props.onPrevMonth,\n    onSelect = props.onSelect,\n    onToggleMonthDropdown = props.onToggleMonthDropdown,\n    onToggleTimeDropdown = props.onToggleTimeDropdown,\n    onShortcutClick = props.onShortcutClick,\n    renderCell = props.renderCell,\n    renderValue = props.renderValue,\n    DEPRECATED_disabledDate = props.disabledDate,\n    DEPRECATED_disabledHours = props.disabledHours,\n    DEPRECATED_disabledMinutes = props.disabledMinutes,\n    DEPRECATED_disabledSeconds = props.disabledSeconds,\n    restProps = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"className\", \"classPrefix\", \"calendarDefaultDate\", \"cleanable\", \"editable\", \"defaultValue\", \"disabled\", \"readOnly\", \"plaintext\", \"format\", \"id\", \"isoWeek\", \"limitEndYear\", \"limitStartYear\", \"locale\", \"loading\", \"label\", \"menuClassName\", \"menuStyle\", \"appearance\", \"placement\", \"oneTap\", \"placeholder\", \"ranges\", \"value\", \"showMeridian\", \"showWeekNumbers\", \"style\", \"size\", \"caretAs\", \"shouldDisableDate\", \"shouldDisableHour\", \"shouldDisableMinute\", \"shouldDisableSecond\", \"onChange\", \"onChangeCalendarDate\", \"onClean\", \"onEntered\", \"onExited\", \"onNextMonth\", \"onOk\", \"onPrevMonth\", \"onSelect\", \"onToggleMonthDropdown\", \"onToggleTimeDropdown\", \"onShortcutClick\", \"renderCell\", \"renderValue\", \"disabledDate\", \"disabledHours\", \"disabledMinutes\", \"disabledSeconds\"]);\n  var id = (0, _utils.useUniqueId)('rs-', idProp);\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay;\n  var _useCustom = (0, _utils.useCustom)('DatePicker', overrideLocale),\n    locale = _useCustom.locale;\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    merge = _useClassNames.merge,\n    prefix = _useClassNames.prefix;\n  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue),\n    value = _useControlled[0],\n    setValue = _useControlled[1];\n  var _useCalendarDate = (0, _useCalendarDate2.default)(value, calendarDefaultDate),\n    calendarDate = _useCalendarDate.calendarDate,\n    setCalendarDate = _useCalendarDate.setCalendarDate,\n    resetCalendarDate = _useCalendarDate.resetCalendarDate;\n  var _useMonthView = (0, _useMonthView2.default)({\n      onToggleMonthDropdown: onToggleMonthDropdown\n    }),\n    setMonthView = _useMonthView.setMonthView,\n    monthView = _useMonthView.monthView,\n    toggleMonthView = _useMonthView.toggleMonthView; // Show only the calendar month panel. formatStr = 'yyyy-MM'\n  var onlyShowMonth = (0, _dateUtils.shouldRenderMonth)(formatStr) && !(0, _dateUtils.shouldRenderDate)(formatStr);\n  var showMonth = onlyShowMonth || monthView;\n  var _useFocus = (0, _useFocus2.default)({\n      target: target,\n      showMonth: showMonth,\n      id: id,\n      locale: locale\n    }),\n    focusInput = _useFocus.focusInput,\n    focusSelectedDate = _useFocus.focusSelectedDate,\n    onKeyFocusEvent = _useFocus.onKeyFocusEvent;\n  /**\n   * Check whether the date is disabled.\n   */\n  var isDateDisabled = function isDateDisabled(date) {\n    if (typeof shouldDisableDate === 'function') {\n      return shouldDisableDate(date);\n    }\n    if (typeof DEPRECATED_disabledDate === 'function') {\n      return DEPRECATED_disabledDate(date);\n    }\n    return false;\n  };\n\n  /**\n   * Check whether the time is within the time range of the shortcut option in the toolbar.\n   */\n  var isDatetimeDisabled = function isDatetimeDisabled(date) {\n    return (isDateDisabled === null || isDateDisabled === void 0 ? void 0 : isDateDisabled(date)) || (0, _dateUtils.disableTime)(props, date);\n  };\n\n  /**\n   * Check whether the month is disabled.\n   * If any day in the month is disabled, the entire month is disabled\n   */\n  var isMonthDisabled = function isMonthDisabled(date) {\n    return (0, _MonthDropdown.isEveryDateInMonth)(date.getFullYear(), date.getMonth(), isDateDisabled);\n  };\n\n  /**\n   * Whether \"OK\" button is disabled\n   *\n   * - If format is date, disable ok button if selected date is disabled\n   * - If format is month, disable ok button if all dates in the month of selected date are disabled\n   */\n  var isOkButtonDisabled = function isOkButtonDisabled(selectedDate) {\n    if ((0, _dateUtils.shouldRenderMonth)(formatStr) && !(0, _dateUtils.shouldRenderDate)(formatStr)) {\n      return isMonthDisabled(selectedDate);\n    }\n    return isDatetimeDisabled(selectedDate);\n  };\n  var isErrorValue = function isErrorValue(value) {\n    if (!(0, _dateUtils.isValid)(value)) {\n      return true;\n    } else if (value && isDateDisabled(value)) {\n      return true;\n    }\n    return false;\n  };\n\n  /**\n   * Switch to the callback triggered after the next month.\n   */\n  var handleMoveForward = (0, _utils.useEventCallback)(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  });\n\n  /**\n   * Switch to the callback triggered after the previous month.\n   */\n  var handleMoveBackward = (0, _utils.useEventCallback)(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  });\n\n  /**\n   * The callback triggered when the date changes.\n   */\n  var handleDateChange = (0, _utils.useEventCallback)(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  });\n\n  /**\n   *  A callback triggered when the time on the calendar changes.\n   */\n  var handleChangeTime = (0, _utils.useEventCallback)(function (nextPageTime) {\n    setCalendarDate(nextPageTime);\n    handleDateChange(nextPageTime);\n  });\n\n  /**\n   * Close the calendar panel.\n   */\n  var handleClose = (0, _utils.useEventCallback)(function () {\n    var _trigger$current, _trigger$current$clos;\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 ? void 0 : _trigger$current$clos.call(_trigger$current);\n  });\n\n  /**\n   * The callback triggered when PM/AM is switched.\n   */\n  var handleToggleMeridian = (0, _utils.useEventCallback)(function () {\n    var hours = (0, _dateUtils.getHours)(calendarDate);\n    var nextHours = hours >= 12 ? hours - 12 : hours + 12;\n    var nextDate = (0, _dateUtils.setHours)(calendarDate, nextHours);\n    handleChangeTime(nextDate);\n  });\n  var updateValue = function updateValue(event, date, closeOverlay) {\n    if (closeOverlay === void 0) {\n      closeOverlay = true;\n    }\n    var nextValue = typeof date !== 'undefined' ? date : calendarDate;\n    setCalendarDate(nextValue || new Date());\n    setValue(nextValue);\n    if (nextValue !== value) {\n      onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n    }\n\n    // `closeOverlay` default value is `true`\n    if (closeOverlay !== false) {\n      handleClose();\n    }\n  };\n\n  /**\n   * The callback triggered after the date in the shortcut area is clicked.\n   */\n  var handleShortcutPageDate = (0, _utils.useEventCallback)(function (range, closeOverlay, event) {\n    var value = range.value;\n    updateValue(event, value, closeOverlay);\n    handleDateChange(value, event);\n    onShortcutClick === null || onShortcutClick === void 0 ? void 0 : onShortcutClick(range, event);\n  });\n\n  /**\n   * The callback triggered after clicking the OK button.\n   */\n  var handleOK = (0, _utils.useEventCallback)(function (event) {\n    updateValue(event);\n    onOk === null || onOk === void 0 ? void 0 : onOk(calendarDate, event);\n    focusInput();\n  });\n\n  /**\n   * Callback after clicking the clear button.\n   */\n\n  var handleClean = (0, _utils.useEventCallback)(function (event) {\n    event === null || event === void 0 ? void 0 : event.stopPropagation();\n    updateValue(event, null);\n    resetCalendarDate(null);\n    onClean === null || onClean === void 0 ? void 0 : onClean(event);\n  });\n  var handlePickerPopupKeyDown = (0, _utils.useEventCallback)(function (event) {\n    onKeyFocusEvent(event, {\n      date: calendarDate,\n      callback: setCalendarDate\n    });\n    if (event.key === 'Enter') {\n      handleOK(event);\n    }\n  });\n  var handleClick = (0, _utils.useEventCallback)(function () {\n    if (editable) {\n      return;\n    }\n    focusSelectedDate();\n  });\n\n  /**\n   * Callback after the date is selected.\n   */\n  var handleSelect = (0, _utils.useEventCallback)(function (nextValue, event, updatableValue) {\n    if (updatableValue === void 0) {\n      updatableValue = true;\n    }\n    setCalendarDate(\n    // Determine whether the current value contains time, if not, use calendarDate.\n    (0, _dateUtils.shouldRenderTime)(formatStr) ? nextValue : (0, _dateUtils.copyTime)({\n      from: calendarDate,\n      to: nextValue\n    }));\n    handleDateChange(nextValue);\n    if (oneTap && updatableValue) {\n      updateValue(event, nextValue);\n      focusInput();\n    }\n  });\n\n  /**\n   *  A callback triggered when the date on the calendar changes.\n   */\n  var handleChangeMonth = (0, _utils.useEventCallback)(function (nextPageDate, event) {\n    setCalendarDate(nextPageDate);\n    handleDateChange(nextPageDate);\n    focusSelectedDate();\n    if (oneTap && onlyShowMonth) {\n      updateValue(event, nextPageDate);\n      focusInput();\n    }\n  });\n\n  /**\n   * Callback after the input box value is changed.\n   */\n  var handleInputChange = (0, _utils.useEventCallback)(function (value, event) {\n    if (!isErrorValue(value)) {\n      handleSelect(value, event);\n    }\n    updateValue(event, value, false);\n  });\n  var handleInputKeyDown = (0, _utils.useEventCallback)(function (event) {\n    (0, _Picker.onMenuKeyDown)(event, {\n      esc: handleClose,\n      enter: function enter() {\n        var _trigger$current2;\n        var _ref = ((_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : _trigger$current2.getState()) || {},\n          open = _ref.open;\n        if (open) {\n          if ((0, _dateUtils.isValid)(calendarDate) && !isDateDisabled(calendarDate)) {\n            updateValue(event);\n            focusInput();\n          }\n        } else {\n          var _trigger$current3;\n          (_trigger$current3 = trigger.current) === null || _trigger$current3 === void 0 ? void 0 : _trigger$current3.open();\n        }\n      }\n    });\n  });\n  var calendarProps = (0, _mapValues.default)((0, _pick.default)(props, _dateUtils.calendarOnlyProps), function (func) {\n    return function (next, date) {\n      var _func;\n      return (_func = func === null || func === void 0 ? void 0 : func(next, date)) !== null && _func !== void 0 ? _func : false;\n    };\n  });\n  var _splitRanges = (0, _utils2.splitRanges)(ranges),\n    sideRanges = _splitRanges.sideRanges,\n    bottomRanges = _splitRanges.bottomRanges;\n  var renderCalendarOverlay = function renderCalendarOverlay(positionProps, speakerRef) {\n    var left = positionProps.left,\n      top = positionProps.top,\n      className = positionProps.className;\n    var classes = merge(menuClassName, className, prefix('popup-date'));\n    var styles = (0, _extends2.default)({}, menuStyle, {\n      left: left,\n      top: top\n    });\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      role: \"dialog\",\n      \"aria-labelledby\": label ? id + \"-label\" : undefined,\n      tabIndex: -1,\n      className: classes,\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      style: styles,\n      target: trigger,\n      onKeyDown: handlePickerPopupKeyDown,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 524,\n        columnNumber: 9\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Stack.default, {\n      alignItems: \"flex-start\",\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 534,\n        columnNumber: 11\n      }\n    }, sideRanges.length > 0 && /*#__PURE__*/_react.default.createElement(_PredefinedRanges.default, {\n      direction: \"column\",\n      spacing: 0,\n      className: prefix('date-predefined'),\n      ranges: sideRanges,\n      calendarDate: calendarDate,\n      locale: locale,\n      disableShortcut: isDatetimeDisabled,\n      onShortcutClick: handleShortcutPageDate,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 536,\n        columnNumber: 15\n      }\n    }), /*#__PURE__*/_react.default.createElement(_Stack.default.Item, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 548,\n        columnNumber: 13\n      }\n    }, /*#__PURE__*/_react.default.createElement(_CalendarContainer.default, (0, _extends2.default)({}, calendarProps, {\n      targetId: id,\n      locale: locale,\n      showWeekNumbers: showWeekNumbers,\n      showMeridian: showMeridian,\n      disabledDate: isDateDisabled,\n      disabledHours: shouldDisableHour !== null && shouldDisableHour !== void 0 ? shouldDisableHour : DEPRECATED_disabledHours,\n      disabledMinutes: shouldDisableMinute !== null && shouldDisableMinute !== void 0 ? shouldDisableMinute : DEPRECATED_disabledMinutes,\n      disabledSeconds: shouldDisableSecond !== null && shouldDisableSecond !== void 0 ? shouldDisableSecond : DEPRECATED_disabledSeconds,\n      limitEndYear: limitEndYear,\n      limitStartYear: limitStartYear,\n      format: formatStr,\n      isoWeek: isoWeek,\n      calendarDate: calendarDate,\n      renderCellOnPicker: renderCell,\n      onMoveForward: handleMoveForward,\n      onMoveBackward: handleMoveBackward,\n      onSelect: handleSelect,\n      onToggleMonthDropdown: toggleMonthView,\n      onToggleTimeDropdown: onToggleTimeDropdown,\n      onChangeMonth: handleChangeMonth,\n      onChangeTime: handleChangeTime,\n      onToggleMeridian: handleToggleMeridian,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 549,\n        columnNumber: 15\n      }\n    })), /*#__PURE__*/_react.default.createElement(_Toolbar.default, {\n      locale: locale,\n      ranges: bottomRanges,\n      calendarDate: calendarDate,\n      disableOkBtn: isOkButtonDisabled,\n      disableShortcut: isDatetimeDisabled,\n      onShortcutClick: handleShortcutPageDate,\n      onOk: handleOK,\n      hideOkBtn: oneTap,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 574,\n        columnNumber: 15\n      }\n    }))));\n  };\n  var hasValue = (0, _dateUtils.isValid)(value);\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  var caretAs = (0, _react.useMemo)(function () {\n    if (caretAsProp === null) {\n      return null;\n    }\n    return caretAsProp || ((0, _dateUtils.shouldOnlyRenderTime)(formatStr) ? _ClockO.default : _Calendar.default);\n  }, [caretAsProp, formatStr]);\n  var handleTriggerClose = (0, _utils.useEventCallback)(function (cause) {\n    var _props$onClose;\n    // Unless overlay is closing on user clicking \"OK\" button,\n    // reset the selected date on calendar panel\n    if (cause !== _OverlayTrigger.OverlayCloseCause.ImperativeHandle) {\n      resetCalendarDate();\n    }\n    setMonthView(false);\n    (_props$onClose = props.onClose) === null || _props$onClose === void 0 ? void 0 : _props$onClose.call(props);\n  });\n  var showCleanButton = cleanable && hasValue && !readOnly;\n  var _partitionHTMLProps = (0, _utils.partitionHTMLProps)(restProps, {\n      htmlProps: [],\n      includeAria: true\n    }),\n    ariaProps = _partitionHTMLProps[0],\n    rest = _partitionHTMLProps[1];\n  var invalidValue = value && isErrorValue(value);\n\n  // Custom rendering of the selected value\n  var customValue = null;\n\n  // Input box is read-only when the component is uneditable or loading state\n  var inputReadOnly = readOnly || !editable || loading || false;\n  if (typeof renderValue === 'function' && value) {\n    customValue = renderValue(value, formatStr);\n\n    // If the custom rendering value, the input box is read-only\n    inputReadOnly = true;\n  }\n  var TargetInput = customValue ? _Input.default : _DateInput.default;\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    trigger: \"active\",\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: trigger,\n    placement: placement,\n    onClose: handleTriggerClose,\n    onEntered: onEntered,\n    onExited: onExited,\n    speaker: renderCalendarOverlay,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 639,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: merge(className, classes, (_merge = {}, _merge[prefix('error')] = invalidValue, _merge)),\n    style: style,\n    ref: root,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 649,\n      columnNumber: 9\n    }\n  }, plaintext ? /*#__PURE__*/_react.default.createElement(_DateInput.default, {\n    value: value,\n    format: formatStr,\n    plaintext: plaintext,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 655,\n      columnNumber: 13\n    }\n  }) : /*#__PURE__*/_react.default.createElement(_InputGroup.default, (0, _extends2.default)({}, (0, _utils2.getRestProps)(rest, usedClassNamePropKeys), {\n    inside: true,\n    size: size,\n    disabled: disabled,\n    onClick: handleClick,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 657,\n      columnNumber: 13\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Picker.PickerLabel, {\n    className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)([\"label\"]))),\n    id: id + \"-label\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 664,\n      columnNumber: 15\n    }\n  }, label), /*#__PURE__*/_react.default.createElement(TargetInput, (0, _extends2.default)({\n    \"aria-haspopup\": \"dialog\",\n    \"aria-invalid\": invalidValue,\n    \"aria-labelledby\": label ? id + \"-label\" : undefined\n  }, ariaProps, {\n    ref: target,\n    id: id,\n    value: customValue || value,\n    format: formatStr,\n    placeholder: placeholder ? placeholder : formatStr,\n    disabled: disabled,\n    onChange: handleInputChange,\n    readOnly: inputReadOnly,\n    onKeyDown: handleInputKeyDown,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 667,\n      columnNumber: 15\n    }\n  })), /*#__PURE__*/_react.default.createElement(_Picker.PickerIndicator, {\n    loading: loading,\n    caretAs: caretAs,\n    onClose: handleClean,\n    showCleanButton: showCleanButton,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 683,\n      columnNumber: 15\n    }\n  }))));\n});\nDatePicker.displayName = 'DatePicker';\nDatePicker.propTypes = (0, _extends2.default)({}, _Picker.pickerPropTypes, _utils2.deprecatedPropTypes, {\n  calendarDefaultDate: _propTypes.default.instanceOf(Date),\n  defaultValue: _propTypes.default.instanceOf(Date),\n  shouldDisableDate: _propTypes.default.func,\n  shouldDisableHour: _propTypes.default.func,\n  shouldDisableMinute: _propTypes.default.func,\n  shouldDisableSecond: _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  limitStartYear: _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  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?");
 
 /***/ }),
 
@@ -6967,7 +7077,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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _Input = _interopRequireDefault(__webpack_require__(/*! ../Input */ \"./src/Input/index.tsx\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _DateInput = __webpack_require__(/*! ../DateInput */ \"./src/DateInput/index.tsx\");\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/DateRangeInput/utils.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DateRangeInput/DateRangeInput.tsx\",\n  _this = void 0;\n/**\n * The DateRangeInput component lets users select a date with the keyboard.\n * @version 5.59.0\n * @see https://rsuitejs.com/components/date-range-input/\n */\nvar DateRangeInput = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var className = props.className,\n    _props$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'date-range-input' : _props$classPrefix,\n    _props$character = props.character,\n    character = _props$character === void 0 ? ' ~ ' : _props$character,\n    _props$format = props.format,\n    formatStr = _props$format === void 0 ? 'yyyy-MM-dd' : _props$format,\n    valueProp = props.value,\n    _props$defaultValue = props.defaultValue,\n    defaultValue = _props$defaultValue === void 0 ? [] : _props$defaultValue,\n    placeholder = props.placeholder,\n    onChange = props.onChange,\n    onKeyDown = props.onKeyDown,\n    onBlur = props.onBlur,\n    onFocus = props.onFocus,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"className\", \"classPrefix\", \"character\", \"format\", \"value\", \"defaultValue\", \"placeholder\", \"onChange\", \"onKeyDown\", \"onBlur\", \"onFocus\"]);\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    withClassPrefix = _useClassNames.withClassPrefix,\n    merge = _useClassNames.merge;\n  var classes = merge(className, withClassPrefix());\n  var inputRef = (0, _react.useRef)();\n  var _useState = (0, _react.useState)({\n      selectedPattern: 'y',\n      selectionStart: 0,\n      selectionEnd: 0\n    }),\n    selectedState = _useState[0],\n    setSelectedState = _useState[1];\n  var _useCustom = (0, _utils.useCustom)('Calendar'),\n    locale = _useCustom.locale;\n  var rangeFormatStr = \"\" + formatStr + character + formatStr;\n  var dateLocale = locale.dateLocale;\n  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue),\n    value = _useControlled[0],\n    setValue = _useControlled[1],\n    isControlled = _useControlled[2];\n  var _useState2 = (0, _react.useState)(_utils2.DateType.Start),\n    dateType = _useState2[0],\n    setDateType = _useState2[1];\n  var dateInputOptions = {\n    formatStr: formatStr,\n    locale: dateLocale,\n    isControlledDate: isControlled\n  };\n  var startDateState = (0, _DateInput.useDateInputState)((0, _extends2.default)({}, dateInputOptions, {\n    date: (value === null || value === void 0 ? void 0 : value[0]) || null\n  }));\n  var endDateState = (0, _DateInput.useDateInputState)((0, _extends2.default)({}, dateInputOptions, {\n    date: (value === null || value === void 0 ? void 0 : value[1]) || null\n  }));\n  var getActiveState = function getActiveState(type) {\n    if (type === void 0) {\n      type = dateType;\n    }\n    return type === _utils2.DateType.Start ? startDateState : endDateState;\n  };\n  var _useIsFocused = (0, _DateInput.useIsFocused)({\n      onBlur: onBlur,\n      onFocus: onFocus\n    }),\n    focused = _useIsFocused[0],\n    focusEventProps = _useIsFocused[1];\n  var renderedValue = (0, _react.useMemo)(function () {\n    var dateString = startDateState.toDateString() + character + endDateState.toDateString();\n    if (!startDateState.isEmptyValue() || !endDateState.isEmptyValue()) {\n      return dateString;\n    }\n    return !focused ? '' : dateString;\n  }, [character, endDateState, focused, startDateState]);\n  var keyPressOptions = {\n    formatStr: formatStr,\n    rangeFormatStr: rangeFormatStr,\n    localize: dateLocale.localize,\n    selectedMonth: getActiveState().dateField.month,\n    dateString: renderedValue,\n    dateType: dateType,\n    character: character\n  };\n  var setSelectionRange = (0, _DateInput.useInputSelection)(inputRef);\n  var handleChange = (0, _utils.useEventCallback)(function (date, event) {\n    var nextValue = dateType === _utils2.DateType.Start ? [date, value === null || value === void 0 ? void 0 : value[1]] : [value === null || value === void 0 ? void 0 : value[0], date];\n    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n    setValue(nextValue);\n  });\n  var onSegmentChange = (0, _utils.useEventCallback)(function (event, nextDirection) {\n    var input = event.target;\n    var key = event.key;\n    var direction = nextDirection || (key === 'ArrowRight' ? 'right' : 'left');\n    if (input.selectionEnd === null || input.selectionStart === null) {\n      return;\n    }\n    var cursorIndex = direction === 'right' ? input.selectionEnd : input.selectionStart;\n    var nextDateType = dateType;\n    if ((0, _utils2.isSwitchDateType)(renderedValue, character, cursorIndex, direction)) {\n      nextDateType = dateType === _utils2.DateType.Start ? _utils2.DateType.End : _utils2.DateType.Start;\n      setDateType(nextDateType);\n    }\n    var state = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n      dateType: nextDateType,\n      selectedMonth: getActiveState(nextDateType).dateField.month,\n      input: input,\n      direction: direction\n    }));\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n    setSelectedState(state);\n  });\n  var onSegmentValueChange = (0, _utils.useEventCallback)(function (event) {\n    var input = event.target;\n    var key = event.key;\n    var offset = key === 'ArrowUp' ? 1 : -1;\n    var state = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n      input: input,\n      valueOffset: offset\n    }));\n    setSelectedState(state);\n    getActiveState().setDateOffset(state.selectedPattern, offset, function (date) {\n      return handleChange(date, event);\n    });\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n  });\n  var onSegmentValueChangeWithNumericKeys = (0, _utils.useEventCallback)(function (event) {\n    var input = event.target;\n    var key = event.key;\n    var pattern = selectedState.selectedPattern;\n    if (!pattern) {\n      return;\n    }\n    var field = getActiveState().getDateField(pattern);\n    var value = parseInt(key, 10);\n    var padValue = parseInt(\"\" + (field.value || '') + key, 10);\n    var newValue = value;\n\n    // Check if the value entered by the user is a valid date\n    if ((0, _DateInput.validateDateTime)(field.name, padValue)) {\n      newValue = padValue;\n    }\n    if (pattern === 'M') {\n      // Month cannot be less than 1.\n      newValue = Math.max(1, newValue);\n    }\n    getActiveState().setDateField(pattern, newValue, function (date) {\n      return handleChange(date, event);\n    });\n\n    // The currently selected month will be retained as a parameter of getInputSelectedState,\n    // but if the user enters a month, the month value will be replaced with the value entered by the user.\n    var selectedMonth = pattern === 'M' ? newValue : getActiveState().dateField.month;\n    var nextState = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n      input: input,\n      selectedMonth: selectedMonth\n    }));\n    setSelectedState(nextState);\n    setSelectionRange(nextState.selectionStart, nextState.selectionEnd);\n\n    // If the field is full value, move the cursor to the next field\n    if ((0, _DateInput.isFieldFullValue)(formatStr, newValue, pattern) && input.selectionEnd !== input.value.length) {\n      onSegmentChange(event, 'right');\n    }\n  });\n  var onSegmentValueRemove = (0, _utils.useEventCallback)(function (event) {\n    var input = event.target;\n    if (selectedState.selectedPattern) {\n      var nextState = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n        input: input,\n        valueOffset: null\n      }));\n      setSelectedState(nextState);\n      setSelectionRange(nextState.selectionStart, nextState.selectionEnd);\n      getActiveState().setDateField(selectedState.selectedPattern, null, function (date) {\n        return handleChange(date, event);\n      });\n    }\n  });\n  var handleClick = (0, _utils.useEventCallback)(function (event) {\n    var input = event.target;\n    if (input.selectionStart === null) {\n      return;\n    }\n    var cursorIndex = input.selectionStart === renderedValue.length ? 0 : input.selectionStart;\n    var dateType = (0, _utils2.getDateType)(renderedValue, character, cursorIndex);\n    var state = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n      dateType: dateType,\n      selectedMonth: getActiveState(dateType).dateField.month,\n      input: input\n    }));\n    setDateType(dateType);\n    setSelectedState(state);\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n  });\n  var onKeyboardInput = (0, _DateInput.useKeyboardInputEvent)({\n    onSegmentChange: onSegmentChange,\n    onSegmentValueChange: onSegmentValueChange,\n    onSegmentValueChangeWithNumericKeys: onSegmentValueChangeWithNumericKeys,\n    onSegmentValueRemove: onSegmentValueRemove,\n    onKeyDown: onKeyDown\n  });\n  return /*#__PURE__*/_react.default.createElement(_Input.default, (0, _extends2.default)({\n    inputMode: focused ? 'numeric' : 'text',\n    autoComplete: \"off\",\n    autoCorrect: \"off\",\n    spellCheck: false,\n    className: classes,\n    ref: (0, _utils.mergeRefs)(inputRef, ref),\n    onKeyDown: onKeyboardInput,\n    onClick: handleClick,\n    value: renderedValue,\n    placeholder: placeholder || rangeFormatStr\n  }, focusEventProps, rest, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 264,\n      columnNumber: 5\n    }\n  }));\n});\nDateRangeInput.displayName = 'DateRangeInput';\nDateRangeInput.propTypes = {\n  character: _propTypes.default.string,\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string,\n  format: _propTypes.default.string,\n  placeholder: _propTypes.default.string,\n  onChange: _propTypes.default.func,\n  onKeyDown: _propTypes.default.func,\n  onFocus: _propTypes.default.func,\n  onBlur: _propTypes.default.func\n};\nvar _default = DateRangeInput;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/DateRangeInput/DateRangeInput.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _Input = _interopRequireDefault(__webpack_require__(/*! ../Input */ \"./src/Input/index.tsx\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _DateInput = __webpack_require__(/*! ../DateInput */ \"./src/DateInput/index.tsx\");\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/DateRangeInput/utils.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DateRangeInput/DateRangeInput.tsx\",\n  _this = void 0;\n/**\n * The DateRangeInput component lets users select a date with the keyboard.\n * @version 5.59.0\n * @see https://rsuitejs.com/components/date-range-input/\n */\nvar DateRangeInput = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var className = props.className,\n    _props$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'date-range-input' : _props$classPrefix,\n    _props$character = props.character,\n    character = _props$character === void 0 ? ' ~ ' : _props$character,\n    _props$format = props.format,\n    formatStr = _props$format === void 0 ? 'yyyy-MM-dd' : _props$format,\n    valueProp = props.value,\n    _props$defaultValue = props.defaultValue,\n    defaultValue = _props$defaultValue === void 0 ? [] : _props$defaultValue,\n    placeholder = props.placeholder,\n    onChange = props.onChange,\n    onKeyDown = props.onKeyDown,\n    onBlur = props.onBlur,\n    onFocus = props.onFocus,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"className\", \"classPrefix\", \"character\", \"format\", \"value\", \"defaultValue\", \"placeholder\", \"onChange\", \"onKeyDown\", \"onBlur\", \"onFocus\"]);\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    withClassPrefix = _useClassNames.withClassPrefix,\n    merge = _useClassNames.merge;\n  var classes = merge(className, withClassPrefix());\n  var inputRef = (0, _react.useRef)();\n  var _useSelectedState = (0, _DateInput.useSelectedState)(),\n    selectedState = _useSelectedState.selectedState,\n    setSelectedState = _useSelectedState.setSelectedState;\n  var _useCustom = (0, _utils.useCustom)('Calendar'),\n    locale = _useCustom.locale;\n  var rangeFormatStr = \"\" + formatStr + character + formatStr;\n  var dateLocale = locale.dateLocale;\n  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue),\n    value = _useControlled[0],\n    setValue = _useControlled[1],\n    isControlled = _useControlled[2];\n  var _useState = (0, _react.useState)(_utils2.DateType.Start),\n    dateType = _useState[0],\n    setDateType = _useState[1];\n  var dateInputOptions = {\n    formatStr: formatStr,\n    locale: dateLocale,\n    isControlledDate: isControlled\n  };\n  var startDateState = (0, _DateInput.useDateInputState)((0, _extends2.default)({}, dateInputOptions, {\n    date: (value === null || value === void 0 ? void 0 : value[0]) || null\n  }));\n  var endDateState = (0, _DateInput.useDateInputState)((0, _extends2.default)({}, dateInputOptions, {\n    date: (value === null || value === void 0 ? void 0 : value[1]) || null\n  }));\n  var _useFieldCursor = (0, _DateInput.useFieldCursor)(formatStr, valueProp),\n    isMoveCursor = _useFieldCursor.isMoveCursor,\n    increment = _useFieldCursor.increment,\n    reset = _useFieldCursor.reset;\n  var getActiveState = function getActiveState(type) {\n    if (type === void 0) {\n      type = dateType;\n    }\n    return type === _utils2.DateType.Start ? startDateState : endDateState;\n  };\n  var _useIsFocused = (0, _DateInput.useIsFocused)({\n      onBlur: onBlur,\n      onFocus: onFocus\n    }),\n    focused = _useIsFocused[0],\n    focusEventProps = _useIsFocused[1];\n  var renderedValue = (0, _react.useMemo)(function () {\n    var dateString = startDateState.toDateString() + character + endDateState.toDateString();\n    if (!startDateState.isEmptyValue() || !endDateState.isEmptyValue()) {\n      return dateString;\n    }\n    return !focused ? '' : dateString;\n  }, [character, endDateState, focused, startDateState]);\n  var keyPressOptions = {\n    formatStr: formatStr,\n    rangeFormatStr: rangeFormatStr,\n    localize: dateLocale.localize,\n    selectedMonth: getActiveState().dateField.month,\n    dateString: renderedValue,\n    dateType: dateType,\n    character: character\n  };\n  var setSelectionRange = (0, _DateInput.useInputSelection)(inputRef);\n  var handleChange = (0, _utils.useEventCallback)(function (date, event) {\n    var nextValue = dateType === _utils2.DateType.Start ? [date, value === null || value === void 0 ? void 0 : value[1]] : [value === null || value === void 0 ? void 0 : value[0], date];\n    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n    setValue(nextValue);\n  });\n  var onSegmentChange = (0, _utils.useEventCallback)(function (event, nextDirection) {\n    var input = event.target;\n    var key = event.key;\n    var direction = nextDirection || (key === 'ArrowRight' ? 'right' : 'left');\n    if (input.selectionEnd === null || input.selectionStart === null) {\n      return;\n    }\n    var cursorIndex = direction === 'right' ? input.selectionEnd : input.selectionStart;\n    var nextDateType = dateType;\n    if ((0, _utils2.isSwitchDateType)(renderedValue, character, cursorIndex, direction)) {\n      nextDateType = dateType === _utils2.DateType.Start ? _utils2.DateType.End : _utils2.DateType.Start;\n      setDateType(nextDateType);\n    }\n    var state = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n      dateType: nextDateType,\n      selectedMonth: getActiveState(nextDateType).dateField.month,\n      input: input,\n      direction: direction\n    }));\n    setSelectedState(state);\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n    reset();\n  });\n  var onSegmentValueChange = (0, _utils.useEventCallback)(function (event) {\n    var input = event.target;\n    var key = event.key;\n    var offset = key === 'ArrowUp' ? 1 : -1;\n    var state = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n      input: input,\n      valueOffset: offset\n    }));\n    setSelectedState(state);\n    getActiveState().setDateOffset(state.selectedPattern, offset, function (date) {\n      return handleChange(date, event);\n    });\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n  });\n  var onSegmentValueChangeWithNumericKeys = (0, _utils.useEventCallback)(function (event) {\n    var input = event.target;\n    var key = event.key;\n    var pattern = selectedState.selectedPattern;\n    if (!pattern) {\n      return;\n    }\n    increment();\n    var field = getActiveState().getDateField(pattern);\n    var value = parseInt(key, 10);\n    var padValue = parseInt(\"\" + (field.value || '') + key, 10);\n    var newValue = value;\n\n    // Check if the value entered by the user is a valid date\n    if ((0, _DateInput.validateDateTime)(field.name, padValue)) {\n      newValue = padValue;\n    }\n    getActiveState().setDateField(pattern, newValue, function (date) {\n      return handleChange(date, event);\n    });\n\n    // The currently selected month will be retained as a parameter of getInputSelectedState,\n    // but if the user enters a month, the month value will be replaced with the value entered by the user.\n    var selectedMonth = pattern === 'M' ? newValue : getActiveState().dateField.month;\n    var nextState = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n      input: input,\n      selectedMonth: selectedMonth\n    }));\n    setSelectedState(nextState);\n    setSelectionRange(nextState.selectionStart, nextState.selectionEnd);\n\n    // If the field is full value, move the cursor to the next field\n    if (isMoveCursor(newValue, pattern) && input.selectionEnd !== input.value.length) {\n      onSegmentChange(event, 'right');\n    }\n  });\n  var onSegmentValueRemove = (0, _utils.useEventCallback)(function (event) {\n    var input = event.target;\n    if (selectedState.selectedPattern) {\n      var nextState = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n        input: input,\n        valueOffset: null\n      }));\n      setSelectedState(nextState);\n      setSelectionRange(nextState.selectionStart, nextState.selectionEnd);\n      getActiveState().setDateField(selectedState.selectedPattern, null, function (date) {\n        return handleChange(date, event);\n      });\n      reset();\n    }\n  });\n  var handleClick = (0, _utils.useEventCallback)(function (event) {\n    var input = event.target;\n    if (input.selectionStart === null) {\n      return;\n    }\n    var cursorIndex = input.selectionStart === renderedValue.length ? 0 : input.selectionStart;\n    var dateType = (0, _utils2.getDateType)(renderedValue || rangeFormatStr, character, cursorIndex);\n    var state = (0, _utils2.getInputSelectedState)((0, _extends2.default)({}, keyPressOptions, {\n      dateType: dateType,\n      selectedMonth: getActiveState(dateType).dateField.month,\n      input: input\n    }));\n    setDateType(dateType);\n    setSelectedState(state);\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n  });\n  var onKeyboardInput = (0, _DateInput.useKeyboardInputEvent)({\n    onSegmentChange: onSegmentChange,\n    onSegmentValueChange: onSegmentValueChange,\n    onSegmentValueChangeWithNumericKeys: onSegmentValueChangeWithNumericKeys,\n    onSegmentValueRemove: onSegmentValueRemove,\n    onKeyDown: onKeyDown\n  });\n  return /*#__PURE__*/_react.default.createElement(_Input.default, (0, _extends2.default)({\n    inputMode: focused ? 'numeric' : 'text',\n    autoComplete: \"off\",\n    autoCorrect: \"off\",\n    spellCheck: false,\n    className: classes,\n    ref: (0, _utils.mergeRefs)(inputRef, ref),\n    onKeyDown: onKeyboardInput,\n    onClick: handleClick,\n    value: renderedValue,\n    placeholder: placeholder || rangeFormatStr\n  }, focusEventProps, rest, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 257,\n      columnNumber: 5\n    }\n  }));\n});\nDateRangeInput.displayName = 'DateRangeInput';\nDateRangeInput.propTypes = {\n  character: _propTypes.default.string,\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string,\n  format: _propTypes.default.string,\n  placeholder: _propTypes.default.string,\n  onChange: _propTypes.default.func,\n  onKeyDown: _propTypes.default.func,\n  onFocus: _propTypes.default.func,\n  onBlur: _propTypes.default.func\n};\nvar _default = DateRangeInput;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/DateRangeInput/DateRangeInput.tsx?");
 
 /***/ }),
 
@@ -7011,7 +7121,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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _partial = _interopRequireDefault(__webpack_require__(/*! lodash/partial */ \"./node_modules/lodash/partial.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _Calendar = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/Calendar */ \"./node_modules/@rsuite/icons/legacy/Calendar.js\"));\nvar _ClockO = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/ClockO */ \"./node_modules/@rsuite/icons/legacy/ClockO.js\"));\nvar _Toolbar = _interopRequireDefault(__webpack_require__(/*! ../DatePicker/Toolbar */ \"./src/DatePicker/Toolbar.tsx\"));\nvar _PredefinedRanges = _interopRequireDefault(__webpack_require__(/*! ../DatePicker/PredefinedRanges */ \"./src/DatePicker/PredefinedRanges.tsx\"));\nvar _Stack = _interopRequireDefault(__webpack_require__(/*! ../Stack */ \"./src/Stack/index.tsx\"));\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _dateUtils = __webpack_require__(/*! ../utils/dateUtils */ \"./src/utils/dateUtils.ts\");\nvar _Calendar2 = _interopRequireDefault(__webpack_require__(/*! ./Calendar */ \"./src/DateRangePicker/Calendar.tsx\"));\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/DateRangePicker/utils.ts\");\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _DateRangePickerContext = _interopRequireDefault(__webpack_require__(/*! ./DateRangePickerContext */ \"./src/DateRangePicker/DateRangePickerContext.ts\"));\nvar _DateRangeInput = _interopRequireDefault(__webpack_require__(/*! ../DateRangeInput */ \"./src/DateRangeInput/index.tsx\"));\nvar _InputGroup = _interopRequireDefault(__webpack_require__(/*! ../InputGroup */ \"./src/InputGroup/index.tsx\"));\nvar _Header = _interopRequireDefault(__webpack_require__(/*! ./Header */ \"./src/DateRangePicker/Header.tsx\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DateRangePicker/DateRangePicker.tsx\",\n  _this = void 0,\n  _templateObject;\n/**\n * A date range picker allows you to select a date range from a calendar.\n *\n * @see https://rsuitejs.com/components/date-range-picker\n */\nvar DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _ref, _ref2, _merge;\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$editable = props.editable,\n    editable = _props$editable === void 0 ? true : _props$editable,\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    plaintext = props.plaintext,\n    disabled = props.disabled,\n    DEPRECATED_disabledDateProp = props.disabledDate,\n    shouldDisableDate = props.shouldDisableDate,\n    _props$format = props.format,\n    formatStr = _props$format === void 0 ? 'yyyy-MM-dd' : _props$format,\n    hoverRange = props.hoverRange,\n    idProp = props.id,\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    limitStartYear = props.limitStartYear,\n    overrideLocale = props.locale,\n    loading = props.loading,\n    label = props.label,\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    readOnly = props.readOnly,\n    _props$showOneCalenda = props.showOneCalendar,\n    showOneCalendar = _props$showOneCalenda === void 0 ? false : _props$showOneCalenda,\n    showWeekNumbers = props.showWeekNumbers,\n    showMeridian = props.showMeridian,\n    _props$showHeader = props.showHeader,\n    showHeader = _props$showHeader === void 0 ? true : _props$showHeader,\n    style = props.style,\n    size = props.size,\n    caretAsProp = props.caretAs,\n    valueProp = props.value,\n    onChange = props.onChange,\n    onClean = props.onClean,\n    onEnter = props.onEnter,\n    onEntered = props.onEntered,\n    onExited = props.onExited,\n    onOk = props.onOk,\n    onSelect = props.onSelect,\n    onShortcutClick = props.onShortcutClick,\n    renderTitle = props.renderTitle,\n    restProps = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"className\", \"appearance\", \"editable\", \"cleanable\", \"character\", \"defaultCalendarValue\", \"defaultValue\", \"plaintext\", \"disabled\", \"disabledDate\", \"shouldDisableDate\", \"format\", \"hoverRange\", \"id\", \"isoWeek\", \"limitEndYear\", \"limitStartYear\", \"locale\", \"loading\", \"label\", \"menuClassName\", \"menuStyle\", \"oneTap\", \"placeholder\", \"placement\", \"ranges\", \"readOnly\", \"showOneCalendar\", \"showWeekNumbers\", \"showMeridian\", \"showHeader\", \"style\", \"size\", \"caretAs\", \"value\", \"onChange\", \"onClean\", \"onEnter\", \"onEntered\", \"onExited\", \"onOk\", \"onSelect\", \"onShortcutClick\", \"renderTitle\"]);\n  var id = (0, _utils.useUniqueId)('rs-', idProp);\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay;\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    merge = _useClassNames.merge,\n    prefix = _useClassNames.prefix;\n  var _useCustom = (0, _utils.useCustom)('DateRangePicker', overrideLocale),\n    locale = _useCustom.locale,\n    formatDate = _useCustom.formatDate; // Default gap between two calendars, if `showOneCalendar` is set, the gap is 0\n  var calendarGap = showOneCalendar ? 0 : 1;\n  var rangeFormatStr = \"\" + formatStr + character + formatStr;\n  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue !== null && defaultValue !== void 0 ? defaultValue : null),\n    value = _useControlled[0],\n    setValue = _useControlled[1]; // Show only the calendar month panel. formatStr = 'yyyy-MM'\n  var onlyShowMonth = (0, _dateUtils.shouldRenderMonth)(formatStr) && !(0, _dateUtils.shouldRenderDate)(formatStr);\n\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  var _useState = (0, _react.useState)(true),\n    isSelectedIdle = _useState[0],\n    setSelectedIdle = _useState[1];\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  var _useState2 = (0, _react.useState)((_ref = valueProp !== null && valueProp !== void 0 ? valueProp : defaultValue) !== null && _ref !== void 0 ? _ref : []),\n    selectedDates = _useState2[0],\n    setSelectedDates = _useState2[1]; // The date of the current hover, used to reduce the calculation of `handleMouseMove`\n  var _useState3 = (0, _react.useState)(value),\n    hoverDateRange = _useState3[0],\n    setHoverDateRange = _useState3[1]; // The displayed calendar panel is rendered based on this value.\n  var _useState4 = (0, _react.useState)((0, _utils2.getSafeCalendarDate)({\n      value: (_ref2 = value !== null && value !== void 0 ? value : defaultCalendarValue) !== null && _ref2 !== void 0 ? _ref2 : null\n    })),\n    calendarDate = _useState4[0],\n    setCalendarDate = _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  var selectRangeValueRef = (0, _react.useRef)(null);\n  var _useState5 = (0, _react.useState)(),\n    activeCalendarKey = _useState5[0],\n    setActiveCalendarKey = _useState5[1];\n  /**\n   * Get the time on the calendar.\n   */\n  var getCalendarDatetime = function getCalendarDatetime(calendarKey) {\n    var index = calendarKey === 'start' ? 0 : 1;\n    return (calendarDate === null || calendarDate === void 0 ? void 0 : calendarDate[index]) || (defaultCalendarValue === null || defaultCalendarValue === void 0 ? void 0 : defaultCalendarValue[index]);\n  };\n\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  var setCalendarDateRange = function setCalendarDateRange(_ref3) {\n    var dateRange = _ref3.dateRange,\n      calendarKey = _ref3.calendarKey,\n      eventName = _ref3.eventName;\n    var nextValue = dateRange;\n\n    // The time should remain the same when the dates in the date range are changed.\n    if ((0, _dateUtils.shouldRenderTime)(formatStr) && dateRange !== null && dateRange !== void 0 && dateRange.length && (eventName === 'changeDate' || eventName === 'changeMonth')) {\n      var _startDate = (0, _dateUtils.copyTime)({\n        from: getCalendarDatetime('start'),\n        to: dateRange[0]\n      });\n      var _endDate = (0, _dateUtils.copyTime)({\n        from: getCalendarDatetime('end'),\n        to: dateRange.length === 1 ? (0, _dateUtils.addMonths)(_startDate, calendarGap) : dateRange[1]\n      });\n      nextValue = [_startDate, _endDate];\n    } else if (dateRange === null && typeof defaultCalendarValue !== 'undefined') {\n      // Make the calendar render the value of defaultCalendarValue after clearing the value.\n      nextValue = defaultCalendarValue;\n    }\n    var nextCalendarDate = (0, _utils2.getSafeCalendarDate)({\n      value: nextValue,\n      calendarKey: calendarKey,\n      // When only the month is displayed and only one calendar is displayed,\n      // there is no need to add a month and two calendar panels are allowed to display the same month\n      allowSameMonth: onlyShowMonth || showOneCalendar\n    });\n    setCalendarDate(nextCalendarDate);\n    if (onlyShowMonth && eventName === 'changeMonth') {\n      setSelectedDates(nextCalendarDate);\n    }\n  };\n\n  // if valueProp changed then update selectValue/hoverValue\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  var getInputHtmlSize = function getInputHtmlSize() {\n    var padding = 4;\n    var strings = rangeFormatStr;\n    if (value) {\n      var _startDate2 = value[0],\n        _endDate2 = value[1];\n      strings = \"\" + formatDate(_startDate2, formatStr) + character + formatDate(_endDate2, formatStr);\n    }\n    return (0, _utils.getStringLength)(strings) + padding;\n  };\n\n  /**\n   * preset hover range\n   */\n  var getHoverRangeValue = function getHoverRangeValue(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      return hoverRange;\n    }\n    var hoverRangeFunc = getHoverRangeFunc();\n    if ((0, _isNil.default)(hoverRangeFunc)) {\n      return null;\n    }\n    var hoverValues = hoverRangeFunc(date);\n    var isHoverRangeValid = hoverValues instanceof Array && hoverValues.length === 2;\n    if (!isHoverRangeValid) {\n      return null;\n    }\n    if ((0, _dateUtils.isAfter)(hoverValues[0], hoverValues[1])) {\n      hoverValues = (0, _dateUtils.reverseDateRangeOmitTime)(hoverValues);\n    }\n    return hoverValues;\n  };\n  var setDateRange = function setDateRange(event, nextValue, closeOverlay) {\n    if (closeOverlay === void 0) {\n      closeOverlay = true;\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    setValue(nextValue);\n    if (!(0, _utils2.isSameRange)(nextValue, value, formatStr)) {\n      onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n    }\n\n    // `closeOverlay` default value is `true`\n    if (closeOverlay !== false) {\n      handleClose();\n    }\n  };\n\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  var onMouseMove = (0, _utils.useEventCallback)(function (date) {\n    var nextHoverDateRange = getHoverRangeValue(date);\n\n    // 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    if (!isSelectedIdle) {\n      // If `hoverRange` is set, you need to change the value of hoverDateRange according to the rules\n      if (!(0, _isNil.default)(nextHoverDateRange) && !(0, _isNil.default)(selectRangeValueRef.current)) {\n        var nextSelectedDates = [selectRangeValueRef.current[0], nextHoverDateRange[1]];\n        if ((0, _dateUtils.isBefore)(nextHoverDateRange[0], selectRangeValueRef.current[0])) {\n          nextSelectedDates = [nextHoverDateRange[0], selectRangeValueRef.current[1]];\n        }\n        setSelectedDates(nextSelectedDates);\n      } else {\n        setHoverDateRange(function (prevHoverValue) {\n          return (0, _isNil.default)(prevHoverValue) ? null : [prevHoverValue[0], date];\n        });\n      }\n\n      // Before the first click, if nextHoverDateRange has a value, hoverDateRange needs to be updated\n    } else if (!(0, _isNil.default)(nextHoverDateRange)) {\n      setHoverDateRange(nextHoverDateRange);\n    }\n  });\n\n  /**\n   * Callback for selecting a date cell in the calendar grid\n   */\n  var handleSelectDate = (0, _utils.useEventCallback)(function (index, date, event) {\n    var calendarKey = index === 0 ? 'start' : 'end';\n    var nextSelectDates = hoverDateRange !== null && hoverDateRange !== void 0 ? hoverDateRange : [];\n    var hoverRangeValue = getHoverRangeValue(date);\n    var noHoverRangeValid = (0, _isNil.default)(hoverRangeValue);\n\n    // in `oneTap` mode\n    if (oneTap) {\n      setDateRange(event, noHoverRangeValid ? [(0, _dateUtils.startOfDay)(date), (0, _dateUtils.endOfDay)(date)] : hoverRangeValue);\n      onSelect === null || onSelect === void 0 ? void 0 : onSelect(date, event);\n      return;\n    }\n\n    // no preset hover range can use\n    if (noHoverRangeValid) {\n      // start select\n      if (isSelectedIdle) {\n        nextSelectDates = [date];\n      } else {\n        // finish select\n        nextSelectDates[1] = date;\n      }\n    } else {\n      if (!isSelectedIdle) {\n        nextSelectDates = selectedDates;\n        selectRangeValueRef.current = null;\n      } else {\n        nextSelectDates = hoverRangeValue;\n        selectRangeValueRef.current = hoverRangeValue;\n      }\n    }\n    if (nextSelectDates.length === 2) {\n      // If user have completed the selection, then sort the selected dates.\n      if ((0, _dateUtils.isAfter)(nextSelectDates[0], nextSelectDates[1])) {\n        nextSelectDates = (0, _dateUtils.reverseDateRangeOmitTime)(nextSelectDates);\n      }\n      if ((0, _dateUtils.shouldRenderTime)(formatStr)) {\n        nextSelectDates = [(0, _dateUtils.copyTime)({\n          from: getCalendarDatetime('start'),\n          to: nextSelectDates[0]\n        }), (0, _dateUtils.copyTime)({\n          from: getCalendarDatetime('end'),\n          to: nextSelectDates[1]\n        })];\n      }\n      setHoverDateRange(nextSelectDates);\n    } else {\n      setHoverDateRange([nextSelectDates[0], nextSelectDates[0]]);\n    }\n    if (isSelectedIdle) {\n      setActiveCalendarKey('end');\n    } else {\n      setActiveCalendarKey('start');\n    }\n    setSelectedDates(nextSelectDates);\n    setCalendarDateRange({\n      dateRange: nextSelectDates,\n      calendarKey: calendarKey,\n      eventName: 'changeDate'\n    });\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(date, event);\n    setSelectedIdle(!isSelectedIdle);\n  });\n\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  (0, _react.useEffect)(function () {\n    var selectValueLength = selectedDates.length;\n    var doneSelected = selectValueLength === 0 || selectValueLength === 2;\n    doneSelected && setHoverDateRange(null);\n  }, [selectedDates]);\n  var onChangeCalendarMonth = (0, _utils.useEventCallback)(function (index, date) {\n    var calendarKey = index === 0 ? 'start' : 'end';\n    var nextCalendarDate = Array.from(calendarDate);\n    nextCalendarDate[index] = date;\n    setCalendarDateRange({\n      dateRange: nextCalendarDate,\n      calendarKey: calendarKey,\n      eventName: 'changeMonth'\n    });\n  });\n  var onChangeCalendarTime = (0, _utils.useEventCallback)(function (index, date) {\n    var calendarKey = index === 0 ? 'start' : 'end';\n    var nextCalendarDate = Array.from(calendarDate);\n    nextCalendarDate[index] = date;\n    setCalendarDateRange({\n      dateRange: nextCalendarDate,\n      calendarKey: calendarKey,\n      eventName: 'changeTime'\n    });\n    setSelectedDates(function (prev) {\n      var next = [].concat(prev);\n\n      // if next[index] is not empty, only update the time after aligning the year, month and day\n      next[index] = next[index] ? (0, _dateUtils.copyTime)({\n        from: date,\n        to: next[index]\n      }) : new Date(date.valueOf());\n      return next;\n    });\n  });\n\n  /**\n   * The callback triggered when PM/AM is switched.\n   */\n  var onToggleMeridian = (0, _utils.useEventCallback)(function (index) {\n    var nextCalendarDate = Array.from(calendarDate);\n    nextCalendarDate[index] = (0, _dateUtils.getReversedTimeMeridian)(nextCalendarDate[index]);\n    setCalendarDate(nextCalendarDate);\n\n    // If the value already exists, update the value again.\n    if (selectedDates.length === 2) {\n      var nextSelectedDates = Array.from(selectedDates);\n      nextSelectedDates[index] = (0, _dateUtils.getReversedTimeMeridian)(nextSelectedDates[index]);\n      setSelectedDates(nextSelectedDates);\n    }\n  });\n  var handleEnter = (0, _utils.useEventCallback)(function () {\n    var nextCalendarDate;\n    if (value && value.length) {\n      var _startDate3 = value[0],\n        endData = value[1];\n      nextCalendarDate = [_startDate3, (0, _dateUtils.isSameMonth)(_startDate3, endData) ? (0, _dateUtils.addMonths)(endData, calendarGap) : endData];\n    } else {\n      // Reset the date on the calendar to the default date\n      nextCalendarDate = (0, _utils2.getSafeCalendarDate)({\n        value: defaultCalendarValue !== null && defaultCalendarValue !== void 0 ? defaultCalendarValue : null\n      });\n    }\n    setSelectedDates(value !== null && value !== void 0 ? value : []);\n    setCalendarDateRange({\n      dateRange: nextCalendarDate\n    });\n  });\n\n  /**\n   * Toolbar operation callback function\n   */\n  var handleShortcutPageDate = (0, _utils.useEventCallback)(function (range, closeOverlay, event) {\n    if (closeOverlay === void 0) {\n      closeOverlay = false;\n    }\n    var value = range.value;\n    setCalendarDateRange({\n      dateRange: value,\n      eventName: 'shortcutSelection'\n    });\n    if (closeOverlay) {\n      setDateRange(event, value, closeOverlay);\n    } else {\n      setSelectedDates(value !== null && value !== void 0 ? value : []);\n    }\n    onShortcutClick === null || onShortcutClick === void 0 ? void 0 : onShortcutClick(range, event);\n\n    // End unfinished selections.\n    setSelectedIdle(true);\n  });\n  var handleOK = (0, _utils.useEventCallback)(function (event) {\n    setDateRange(event, selectedDates);\n    onOk === null || onOk === void 0 ? void 0 : onOk(selectedDates, event);\n  });\n  var handleClean = (0, _utils.useEventCallback)(function (event) {\n    setCalendarDateRange({\n      dateRange: null\n    });\n    setDateRange(event, null);\n    onClean === null || onClean === void 0 ? void 0 : onClean(event);\n    event.stopPropagation();\n  });\n\n  /**\n   * Callback after the input box value is changed.\n   */\n  var handleInputChange = (0, _utils.useEventCallback)(function (value, event) {\n    if (!value) {\n      return;\n    }\n    var startDate = value[0],\n      endDate = value[1];\n    var selectValue = [startDate, endDate];\n    setHoverDateRange(selectValue);\n    setSelectedDates(selectValue);\n    setCalendarDateRange({\n      dateRange: selectValue\n    });\n    setDateRange(event, selectValue);\n  });\n  var isDateDisabled = function isDateDisabled(date, options) {\n    var selectDate = options.selectDate,\n      selectedDone = options.selectedDone,\n      target = options.target;\n    if (typeof shouldDisableDate === 'function') {\n      return shouldDisableDate(date, selectDate, selectedDone, target);\n    }\n    if (typeof DEPRECATED_disabledDateProp === 'function') {\n      return DEPRECATED_disabledDateProp(date, selectDate, selectedDone, target);\n    }\n    return false;\n  };\n  var disableByBetween = function disableByBetween(start, end, type) {\n    // If the date is between the start and the end\n    // the button is disabled\n    while ((0, _dateUtils.isBefore)(start, end) || (0, _dateUtils.isSameDay)(start, end)) {\n      if (isDateDisabled(start, {\n        selectDate: selectedDates,\n        selectedDone: isSelectedIdle,\n        target: type\n      })) {\n        return true;\n      }\n      start = (0, _dateUtils.addDays)(start, 1);\n    }\n    return false;\n  };\n  var disableOkButton = function disableOkButton() {\n    var start = selectedDates[0],\n      end = selectedDates[1];\n    if (!start || !end || !isSelectedIdle) {\n      return true;\n    }\n    return disableByBetween(start, end, _utils.DATERANGE_DISABLED_TARGET.TOOLBAR_BUTTON_OK);\n  };\n  var disableShortcut = function disableShortcut(value) {\n    if (value === void 0) {\n      value = [];\n    }\n    var _value = value,\n      start = _value[0],\n      end = _value[1];\n    if (!start || !end) {\n      return true;\n    }\n    return disableByBetween(start, end, _utils.DATERANGE_DISABLED_TARGET.TOOLBAR_SHORTCUT);\n  };\n  var handleClose = (0, _utils.useEventCallback)(function () {\n    var _trigger$current, _trigger$current$clos;\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 ? void 0 : _trigger$current$clos.call(_trigger$current);\n  });\n  var handleInputKeyDown = (0, _utils.useEventCallback)(function (event) {\n    (0, _Picker.onMenuKeyDown)(event, {\n      esc: handleClose,\n      enter: function enter() {\n        var _trigger$current2;\n        var _ref4 = ((_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : _trigger$current2.getState()) || {},\n          open = _ref4.open;\n        if (!open) {\n          var _trigger$current3;\n          (_trigger$current3 = trigger.current) === null || _trigger$current3 === void 0 ? void 0 : _trigger$current3.open();\n        }\n      }\n    });\n  });\n  var renderCalendarOverlay = function renderCalendarOverlay(positionProps, speakerRef) {\n    var left = positionProps.left,\n      top = positionProps.top,\n      className = positionProps.className;\n    var classes = merge(className, menuClassName, prefix('popup-daterange'));\n    var panelClasses = prefix('daterange-panel', {\n      'daterange-panel-show-one-calendar': showOneCalendar\n    });\n\n    /**\n     * Set a min-width (528px) when there are two calendars\n     * @see https://github.com/rsuite/rsuite/issues/3522\n     */\n    var panelStyles = {\n      minWidth: showOneCalendar ? 'auto' : 528\n    };\n    var styles = (0, _extends2.default)({}, menuStyle, {\n      left: left,\n      top: top\n    });\n    var disabledDate = function disabledDate(date, values, type) {\n      return isDateDisabled(date, {\n        selectDate: values,\n        selectedDone: isSelectedIdle,\n        target: type\n      });\n    };\n    var calendarProps = {\n      locale: locale,\n      isoWeek: isoWeek,\n      limitEndYear: limitEndYear,\n      showMeridian: showMeridian,\n      calendarDate: calendarDate,\n      limitStartYear: limitStartYear,\n      showWeekNumbers: showWeekNumbers,\n      format: formatStr,\n      value: selectedDates,\n      hoverRangeValue: hoverDateRange !== null && hoverDateRange !== void 0 ? hoverDateRange : undefined,\n      onSelect: handleSelectDate,\n      onChangeCalendarMonth: onChangeCalendarMonth,\n      onChangeCalendarTime: onChangeCalendarTime,\n      onToggleMeridian: onToggleMeridian,\n      onMouseMove: onMouseMove,\n      disabledDate: disabledDate,\n      renderTitle: renderTitle\n    };\n    var getCalendars = function getCalendars() {\n      if (showOneCalendar) {\n        return /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n          index: activeCalendarKey === 'end' ? 1 : 0\n        }, calendarProps, {\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 785,\n            columnNumber: 16\n          }\n        }));\n      }\n      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n        index: 0\n      }, calendarProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 790,\n          columnNumber: 11\n        }\n      })), /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n        index: 1\n      }, calendarProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 791,\n          columnNumber: 11\n        }\n      })));\n    };\n    var sideRanges = (ranges === null || ranges === void 0 ? void 0 : ranges.filter(function (range) {\n      return (range === null || range === void 0 ? void 0 : range.placement) === 'left';\n    })) || [];\n    var bottomRanges = ranges === null || ranges === void 0 ? void 0 : ranges.filter(function (range) {\n      return (range === null || range === void 0 ? void 0 : range.placement) === 'bottom' || (range === null || range === void 0 ? void 0 : range.placement) === undefined;\n    });\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      role: \"dialog\",\n      \"aria-labelledby\": label ? id + \"-label\" : undefined,\n      tabIndex: -1,\n      className: classes,\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      target: trigger,\n      style: styles,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 802,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: panelClasses,\n      style: panelStyles,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 811,\n        columnNumber: 9\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Stack.default, {\n      alignItems: \"flex-start\",\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 812,\n        columnNumber: 11\n      }\n    }, sideRanges.length > 0 && /*#__PURE__*/_react.default.createElement(_PredefinedRanges.default, {\n      direction: \"column\",\n      spacing: 0,\n      className: prefix('daterange-predefined'),\n      ranges: sideRanges,\n      calendarDate: calendarDate,\n      locale: locale,\n      disableShortcut: disableShortcut,\n      onShortcutClick: handleShortcutPageDate,\n      \"data-testid\": \"daterange-predefined-side\",\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 814,\n        columnNumber: 15\n      }\n    }), /*#__PURE__*/_react.default.createElement(_Stack.default.Item, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 827,\n        columnNumber: 13\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix('daterange-content'),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 828,\n        columnNumber: 15\n      }\n    }, showHeader && /*#__PURE__*/_react.default.createElement(_Header.default, {\n      value: isSelectedIdle ? selectedDates : hoverDateRange,\n      formatStr: formatStr,\n      character: character,\n      clickable: showOneCalendar,\n      activeKey: activeCalendarKey,\n      onSelect: setActiveCalendarKey,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 830,\n        columnNumber: 19\n      }\n    }), /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix(\"daterange-calendar-\" + (showOneCalendar ? 'single' : 'group')),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 840,\n        columnNumber: 17\n      }\n    }, /*#__PURE__*/_react.default.createElement(_DateRangePickerContext.default.Provider, {\n      value: {\n        isSelectedIdle: isSelectedIdle\n      },\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 843,\n        columnNumber: 19\n      }\n    }, getCalendars()))), /*#__PURE__*/_react.default.createElement(_Toolbar.default, {\n      locale: locale,\n      calendarDate: selectedDates,\n      disableOkBtn: disableOkButton,\n      disableShortcut: disableShortcut,\n      hideOkBtn: oneTap,\n      onOk: handleOK,\n      onShortcutClick: handleShortcutPageDate,\n      ranges: bottomRanges,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 848,\n        columnNumber: 15\n      }\n    })))));\n  };\n  var hasValue = !(0, _isNil.default)(value) && value.length > 1;\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  var caretAs = (0, _react.useMemo)(function () {\n    if (caretAsProp === null) {\n      return null;\n    }\n    return caretAsProp || ((0, _dateUtils.shouldOnlyRenderTime)(formatStr) ? _ClockO.default : _Calendar.default);\n  }, [caretAsProp, formatStr]);\n  var isErrorValue = function isErrorValue(value) {\n    if (!value) {\n      return false;\n    }\n\n    // If the value is an empty array, it is not an error value.\n    if (Array.isArray(value) && value.length === 0) {\n      return false;\n    }\n    var startDate = value[0],\n      endDate = value[1];\n    if (!(0, _dateUtils.isValid)(startDate) || !(0, _dateUtils.isValid)(endDate)) {\n      return true;\n    }\n    if ((0, _dateUtils.isBefore)(endDate, startDate)) {\n      return true;\n    }\n    var disabledOptions = {\n      selectDate: value,\n      selectedDone: isSelectedIdle,\n      target: _utils.DATERANGE_DISABLED_TARGET.INPUT\n    };\n    if (isDateDisabled(startDate, disabledOptions) || isDateDisabled(endDate, disabledOptions)) {\n      return true;\n    }\n    return false;\n  };\n  var _partitionHTMLProps = (0, _utils.partitionHTMLProps)(restProps, {\n      htmlProps: [],\n      includeAria: true\n    }),\n    ariaProps = _partitionHTMLProps[0],\n    rest = _partitionHTMLProps[1];\n  var showCleanButton = cleanable && hasValue && !readOnly;\n  var invalidValue = value && isErrorValue(value);\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    trigger: \"active\",\n    ref: trigger,\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    placement: placement,\n    onEnter: (0, _utils.createChainedFunction)(handleEnter, onEnter),\n    onEntered: onEntered,\n    onExited: onExited,\n    speaker: renderCalendarOverlay,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 920,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    ref: root,\n    className: merge(className, classes, (_merge = {}, _merge[prefix('error')] = invalidValue, _merge)),\n    style: style,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 930,\n      columnNumber: 7\n    }\n  }, plaintext ? /*#__PURE__*/_react.default.createElement(_DateRangeInput.default, {\n    value: value,\n    format: formatStr,\n    plaintext: plaintext,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 936,\n      columnNumber: 11\n    }\n  }) : /*#__PURE__*/_react.default.createElement(_InputGroup.default, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys, _dateUtils.calendarOnlyProps)), {\n    inside: true,\n    size: size,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 938,\n      columnNumber: 11\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Picker.PickerLabel, {\n    className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)([\"label\"]))),\n    id: id + \"-label\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 947,\n      columnNumber: 13\n    }\n  }, label), /*#__PURE__*/_react.default.createElement(_DateRangeInput.default, (0, _extends2.default)({\n    \"aria-haspopup\": \"dialog\",\n    \"aria-invalid\": invalidValue,\n    \"aria-labelledby\": label ? id + \"-label\" : undefined\n  }, ariaProps, {\n    ref: target,\n    id: id,\n    value: value,\n    character: character,\n    format: formatStr,\n    placeholder: placeholder ? placeholder : rangeFormatStr,\n    disabled: disabled,\n    readOnly: readOnly || !editable || loading,\n    plaintext: plaintext,\n    htmlSize: getInputHtmlSize(),\n    onChange: handleInputChange,\n    onKeyDown: handleInputKeyDown,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 950,\n      columnNumber: 13\n    }\n  })), /*#__PURE__*/_react.default.createElement(_Picker.PickerIndicator, {\n    loading: loading,\n    caretAs: caretAs,\n    onClose: handleClean,\n    showCleanButton: showCleanButton,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 968,\n      columnNumber: 13\n    }\n  }))));\n});\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([(0, _propTypes2.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  limitStartYear: _propTypes.default.number,\n  onChange: _propTypes.default.func,\n  onOk: _propTypes.default.func,\n  disabledDate: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.func, 'Use \"shouldDisableDate\" property instead.'),\n  shouldDisableDate: _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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _partial = _interopRequireDefault(__webpack_require__(/*! lodash/partial */ \"./node_modules/lodash/partial.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _Calendar = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/Calendar */ \"./node_modules/@rsuite/icons/legacy/Calendar.js\"));\nvar _ClockO = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/ClockO */ \"./node_modules/@rsuite/icons/legacy/ClockO.js\"));\nvar _Toolbar = _interopRequireDefault(__webpack_require__(/*! ../DatePicker/Toolbar */ \"./src/DatePicker/Toolbar.tsx\"));\nvar _PredefinedRanges = _interopRequireDefault(__webpack_require__(/*! ../DatePicker/PredefinedRanges */ \"./src/DatePicker/PredefinedRanges.tsx\"));\nvar _Stack = _interopRequireDefault(__webpack_require__(/*! ../Stack */ \"./src/Stack/index.tsx\"));\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _dateUtils = __webpack_require__(/*! ../utils/dateUtils */ \"./src/utils/dateUtils.ts\");\nvar _Calendar2 = _interopRequireDefault(__webpack_require__(/*! ./Calendar */ \"./src/DateRangePicker/Calendar.tsx\"));\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/DateRangePicker/utils.ts\");\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _DateRangePickerContext = _interopRequireDefault(__webpack_require__(/*! ./DateRangePickerContext */ \"./src/DateRangePicker/DateRangePickerContext.ts\"));\nvar _DateRangeInput = _interopRequireDefault(__webpack_require__(/*! ../DateRangeInput */ \"./src/DateRangeInput/index.tsx\"));\nvar _Input = _interopRequireDefault(__webpack_require__(/*! ../Input */ \"./src/Input/index.tsx\"));\nvar _InputGroup = _interopRequireDefault(__webpack_require__(/*! ../InputGroup */ \"./src/InputGroup/index.tsx\"));\nvar _Header = _interopRequireDefault(__webpack_require__(/*! ./Header */ \"./src/DateRangePicker/Header.tsx\"));\nvar _useDateDisabled = _interopRequireDefault(__webpack_require__(/*! ./hooks/useDateDisabled */ \"./src/DateRangePicker/hooks/useDateDisabled.ts\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DateRangePicker/DateRangePicker.tsx\",\n  _this = void 0,\n  _templateObject;\n/**\n * A date range picker allows you to select a date range from a calendar.\n *\n * @see https://rsuitejs.com/components/date-range-picker\n */\nvar DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _ref, _ref2, _merge;\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$editable = props.editable,\n    editable = _props$editable === void 0 ? true : _props$editable,\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    plaintext = props.plaintext,\n    disabled = props.disabled,\n    DEPRECATED_disabledDate = props.disabledDate,\n    shouldDisableDate = props.shouldDisableDate,\n    _props$format = props.format,\n    formatStr = _props$format === void 0 ? 'yyyy-MM-dd' : _props$format,\n    hoverRange = props.hoverRange,\n    idProp = props.id,\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    limitStartYear = props.limitStartYear,\n    overrideLocale = props.locale,\n    loading = props.loading,\n    label = props.label,\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    readOnly = props.readOnly,\n    _props$showOneCalenda = props.showOneCalendar,\n    showOneCalendar = _props$showOneCalenda === void 0 ? false : _props$showOneCalenda,\n    showWeekNumbers = props.showWeekNumbers,\n    showMeridian = props.showMeridian,\n    _props$showHeader = props.showHeader,\n    showHeader = _props$showHeader === void 0 ? true : _props$showHeader,\n    style = props.style,\n    size = props.size,\n    caretAsProp = props.caretAs,\n    valueProp = props.value,\n    onChange = props.onChange,\n    onClean = props.onClean,\n    onEnter = props.onEnter,\n    onEntered = props.onEntered,\n    onExited = props.onExited,\n    onOk = props.onOk,\n    onSelect = props.onSelect,\n    onShortcutClick = props.onShortcutClick,\n    renderTitle = props.renderTitle,\n    renderValue = props.renderValue,\n    restProps = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"className\", \"appearance\", \"editable\", \"cleanable\", \"character\", \"defaultCalendarValue\", \"defaultValue\", \"plaintext\", \"disabled\", \"disabledDate\", \"shouldDisableDate\", \"format\", \"hoverRange\", \"id\", \"isoWeek\", \"limitEndYear\", \"limitStartYear\", \"locale\", \"loading\", \"label\", \"menuClassName\", \"menuStyle\", \"oneTap\", \"placeholder\", \"placement\", \"ranges\", \"readOnly\", \"showOneCalendar\", \"showWeekNumbers\", \"showMeridian\", \"showHeader\", \"style\", \"size\", \"caretAs\", \"value\", \"onChange\", \"onClean\", \"onEnter\", \"onEntered\", \"onExited\", \"onOk\", \"onSelect\", \"onShortcutClick\", \"renderTitle\", \"renderValue\"]);\n  var id = (0, _utils.useUniqueId)('rs-', idProp);\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay;\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    merge = _useClassNames.merge,\n    prefix = _useClassNames.prefix;\n  var _useCustom = (0, _utils.useCustom)('DateRangePicker', overrideLocale),\n    locale = _useCustom.locale,\n    formatDate = _useCustom.formatDate; // Default gap between two calendars, if `showOneCalendar` is set, the gap is 0\n  var calendarGap = showOneCalendar ? 0 : 1;\n  var rangeFormatStr = \"\" + formatStr + character + formatStr;\n  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue !== null && defaultValue !== void 0 ? defaultValue : null),\n    value = _useControlled[0],\n    setValue = _useControlled[1]; // Show only the calendar month panel. formatStr = 'yyyy-MM'\n  var onlyShowMonth = (0, _dateUtils.shouldRenderMonth)(formatStr) && !(0, _dateUtils.shouldRenderDate)(formatStr);\n\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  var _useState = (0, _react.useState)(true),\n    isSelectedIdle = _useState[0],\n    setSelectedIdle = _useState[1];\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  var _useState2 = (0, _react.useState)((_ref = valueProp !== null && valueProp !== void 0 ? valueProp : defaultValue) !== null && _ref !== void 0 ? _ref : []),\n    selectedDates = _useState2[0],\n    setSelectedDates = _useState2[1]; // The date of the current hover, used to reduce the calculation of `handleMouseMove`\n  var _useState3 = (0, _react.useState)(value),\n    hoverDateRange = _useState3[0],\n    setHoverDateRange = _useState3[1]; // The displayed calendar panel is rendered based on this value.\n  var _useState4 = (0, _react.useState)((0, _utils2.getSafeCalendarDate)({\n      value: (_ref2 = value !== null && value !== void 0 ? value : defaultCalendarValue) !== null && _ref2 !== void 0 ? _ref2 : null\n    })),\n    calendarDate = _useState4[0],\n    setCalendarDate = _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  var selectRangeValueRef = (0, _react.useRef)(null);\n\n  /**\n   *\n   * The key of the currently active calendar panel.\n   * Used to switch when only one calendar panel is displayed.\n   */\n  var _useState5 = (0, _react.useState)(),\n    activeCalendarKey = _useState5[0],\n    setActiveCalendarKey = _useState5[1];\n  /**\n   * Get the time on the calendar.\n   */\n  var getCalendarDatetime = function getCalendarDatetime(calendarKey) {\n    var index = calendarKey === 'start' ? 0 : 1;\n    return (calendarDate === null || calendarDate === void 0 ? void 0 : calendarDate[index]) || (defaultCalendarValue === null || defaultCalendarValue === void 0 ? void 0 : defaultCalendarValue[index]);\n  };\n\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  var setCalendarDateRange = function setCalendarDateRange(_ref3) {\n    var dateRange = _ref3.dateRange,\n      calendarKey = _ref3.calendarKey,\n      eventName = _ref3.eventName;\n    var nextValue = dateRange;\n\n    // The time should remain the same when the dates in the date range are changed.\n    if ((0, _dateUtils.shouldRenderTime)(formatStr) && dateRange !== null && dateRange !== void 0 && dateRange.length && (eventName === 'changeDate' || eventName === 'changeMonth')) {\n      var _startDate = (0, _dateUtils.copyTime)({\n        from: getCalendarDatetime('start'),\n        to: dateRange[0]\n      });\n      var _endDate = (0, _dateUtils.copyTime)({\n        from: getCalendarDatetime('end'),\n        to: dateRange.length === 1 ? (0, _dateUtils.addMonths)(_startDate, calendarGap) : dateRange[1]\n      });\n      nextValue = [_startDate, _endDate];\n    } else if (dateRange === null && typeof defaultCalendarValue !== 'undefined') {\n      // Make the calendar render the value of defaultCalendarValue after clearing the value.\n      nextValue = defaultCalendarValue;\n    }\n    var nextCalendarDate = (0, _utils2.getSafeCalendarDate)({\n      value: nextValue,\n      calendarKey: calendarKey,\n      // When only the month is displayed and only one calendar is displayed,\n      // there is no need to add a month and two calendar panels are allowed to display the same month\n      allowSameMonth: onlyShowMonth || showOneCalendar\n    });\n    setCalendarDate(nextCalendarDate);\n    if (onlyShowMonth && eventName === 'changeMonth') {\n      setSelectedDates(nextCalendarDate);\n    }\n  };\n  (0, _react.useEffect)(function () {\n    // If value changes, update the selected and hover date values on the calendar panel.\n    setSelectedDates(valueProp !== null && valueProp !== void 0 ? valueProp : []);\n    setHoverDateRange(valueProp !== null && valueProp !== void 0 ? valueProp : null);\n  }, [valueProp]);\n  var getInputHtmlSize = function getInputHtmlSize() {\n    var padding = 4;\n    var strings = rangeFormatStr;\n    if (value) {\n      var _startDate2 = value[0],\n        _endDate2 = value[1];\n      strings = \"\" + formatDate(_startDate2, formatStr) + character + formatDate(_endDate2, formatStr);\n    }\n    return (0, _utils.getStringLength)(strings) + padding;\n  };\n\n  /**\n   * preset hover range\n   */\n  var getHoverRangeValue = function getHoverRangeValue(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      return hoverRange;\n    }\n    var hoverRangeFunc = getHoverRangeFunc();\n    if ((0, _isNil.default)(hoverRangeFunc)) {\n      return null;\n    }\n    var hoverValues = hoverRangeFunc(date);\n    var isHoverRangeValid = hoverValues instanceof Array && hoverValues.length === 2;\n    if (!isHoverRangeValid) {\n      return null;\n    }\n    if ((0, _dateUtils.isAfter)(hoverValues[0], hoverValues[1])) {\n      hoverValues = (0, _dateUtils.reverseDateRangeOmitTime)(hoverValues);\n    }\n    return hoverValues;\n  };\n  var setDateRange = function setDateRange(event, nextValue, closeOverlay) {\n    if (closeOverlay === void 0) {\n      closeOverlay = true;\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    setValue(nextValue);\n    if (!(0, _utils2.isSameRange)(nextValue, value, formatStr)) {\n      onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n    }\n\n    // `closeOverlay` default value is `true`\n    if (closeOverlay !== false) {\n      handleClose();\n    }\n  };\n\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  var onMouseMove = (0, _utils.useEventCallback)(function (date) {\n    var nextHoverDateRange = getHoverRangeValue(date);\n\n    // 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    if (!isSelectedIdle) {\n      // If `hoverRange` is set, you need to change the value of hoverDateRange according to the rules\n      if (!(0, _isNil.default)(nextHoverDateRange) && !(0, _isNil.default)(selectRangeValueRef.current)) {\n        var nextSelectedDates = [selectRangeValueRef.current[0], nextHoverDateRange[1]];\n        if ((0, _dateUtils.isBefore)(nextHoverDateRange[0], selectRangeValueRef.current[0])) {\n          nextSelectedDates = [nextHoverDateRange[0], selectRangeValueRef.current[1]];\n        }\n        setSelectedDates(nextSelectedDates);\n      } else {\n        setHoverDateRange(function (prevHoverValue) {\n          return (0, _isNil.default)(prevHoverValue) ? null : [prevHoverValue[0], date];\n        });\n      }\n\n      // Before the first click, if nextHoverDateRange has a value, hoverDateRange needs to be updated\n    } else if (!(0, _isNil.default)(nextHoverDateRange)) {\n      setHoverDateRange(nextHoverDateRange);\n    }\n  });\n\n  /**\n   * Callback for selecting a date cell in the calendar grid\n   */\n  var handleSelectDate = (0, _utils.useEventCallback)(function (index, date, event) {\n    var calendarKey = index === 0 ? 'start' : 'end';\n    var nextSelectDates = hoverDateRange !== null && hoverDateRange !== void 0 ? hoverDateRange : [];\n    var hoverRangeValue = getHoverRangeValue(date);\n    var noHoverRangeValid = (0, _isNil.default)(hoverRangeValue);\n\n    // in `oneTap` mode\n    if (oneTap) {\n      setDateRange(event, noHoverRangeValid ? [(0, _dateUtils.startOfDay)(date), (0, _dateUtils.endOfDay)(date)] : hoverRangeValue);\n      onSelect === null || onSelect === void 0 ? void 0 : onSelect(date, event);\n      return;\n    }\n\n    // no preset hover range can use\n    if (noHoverRangeValid) {\n      // start select\n      if (isSelectedIdle) {\n        nextSelectDates = [date];\n      } else {\n        // finish select\n        nextSelectDates[1] = date;\n      }\n    } else {\n      if (!isSelectedIdle) {\n        nextSelectDates = selectedDates;\n        selectRangeValueRef.current = null;\n      } else {\n        nextSelectDates = hoverRangeValue;\n        selectRangeValueRef.current = hoverRangeValue;\n      }\n    }\n    if (nextSelectDates.length === 2) {\n      // If user have completed the selection, then sort the selected dates.\n      if ((0, _dateUtils.isAfter)(nextSelectDates[0], nextSelectDates[1])) {\n        nextSelectDates = (0, _dateUtils.reverseDateRangeOmitTime)(nextSelectDates);\n      }\n      if ((0, _dateUtils.shouldRenderTime)(formatStr)) {\n        nextSelectDates = [(0, _dateUtils.copyTime)({\n          from: getCalendarDatetime('start'),\n          to: nextSelectDates[0]\n        }), (0, _dateUtils.copyTime)({\n          from: getCalendarDatetime('end'),\n          to: nextSelectDates[1]\n        })];\n      }\n      setHoverDateRange(nextSelectDates);\n    } else {\n      setHoverDateRange([nextSelectDates[0], nextSelectDates[0]]);\n    }\n    if (isSelectedIdle) {\n      setActiveCalendarKey('end');\n    } else {\n      setActiveCalendarKey('start');\n    }\n    setSelectedDates(nextSelectDates);\n    setCalendarDateRange({\n      dateRange: nextSelectDates,\n      calendarKey: calendarKey,\n      eventName: 'changeDate'\n    });\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(date, event);\n    setSelectedIdle(!isSelectedIdle);\n  });\n\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  (0, _react.useEffect)(function () {\n    var selectValueLength = selectedDates.length;\n    var doneSelected = selectValueLength === 0 || selectValueLength === 2;\n    doneSelected && setHoverDateRange(null);\n  }, [selectedDates]);\n  var onChangeCalendarMonth = (0, _utils.useEventCallback)(function (index, date) {\n    var calendarKey = index === 0 ? 'start' : 'end';\n    var nextCalendarDate = Array.from(calendarDate);\n    nextCalendarDate[index] = date;\n    setCalendarDateRange({\n      dateRange: nextCalendarDate,\n      calendarKey: calendarKey,\n      eventName: 'changeMonth'\n    });\n  });\n  var onChangeCalendarTime = (0, _utils.useEventCallback)(function (index, date) {\n    var calendarKey = index === 0 ? 'start' : 'end';\n    var nextCalendarDate = Array.from(calendarDate);\n    nextCalendarDate[index] = date;\n    setCalendarDateRange({\n      dateRange: nextCalendarDate,\n      calendarKey: calendarKey,\n      eventName: 'changeTime'\n    });\n    setSelectedDates(function (prev) {\n      var next = [].concat(prev);\n\n      // if next[index] is not empty, only update the time after aligning the year, month and day\n      next[index] = next[index] ? (0, _dateUtils.copyTime)({\n        from: date,\n        to: next[index]\n      }) : new Date(date.valueOf());\n      return next;\n    });\n  });\n\n  /**\n   * The callback triggered when PM/AM is switched.\n   */\n  var onToggleMeridian = (0, _utils.useEventCallback)(function (index) {\n    var nextCalendarDate = Array.from(calendarDate);\n    nextCalendarDate[index] = (0, _dateUtils.getReversedTimeMeridian)(nextCalendarDate[index]);\n    setCalendarDate(nextCalendarDate);\n\n    // If the value already exists, update the value again.\n    if (selectedDates.length === 2) {\n      var nextSelectedDates = Array.from(selectedDates);\n      nextSelectedDates[index] = (0, _dateUtils.getReversedTimeMeridian)(nextSelectedDates[index]);\n      setSelectedDates(nextSelectedDates);\n    }\n  });\n  var handleEnter = (0, _utils.useEventCallback)(function () {\n    var nextCalendarDate;\n    if (value && value.length) {\n      var _startDate3 = value[0],\n        endData = value[1];\n      nextCalendarDate = [_startDate3, (0, _dateUtils.isSameMonth)(_startDate3, endData) ? (0, _dateUtils.addMonths)(endData, calendarGap) : endData];\n    } else {\n      // Reset the date on the calendar to the default date\n      nextCalendarDate = (0, _utils2.getSafeCalendarDate)({\n        value: defaultCalendarValue !== null && defaultCalendarValue !== void 0 ? defaultCalendarValue : null\n      });\n    }\n    setSelectedDates(value !== null && value !== void 0 ? value : []);\n    setCalendarDateRange({\n      dateRange: nextCalendarDate\n    });\n  });\n\n  /**\n   * Toolbar operation callback function\n   */\n  var handleShortcutPageDate = (0, _utils.useEventCallback)(function (range, closeOverlay, event) {\n    if (closeOverlay === void 0) {\n      closeOverlay = false;\n    }\n    var value = range.value;\n    setCalendarDateRange({\n      dateRange: value,\n      eventName: 'shortcutSelection'\n    });\n    if (closeOverlay) {\n      setDateRange(event, value, closeOverlay);\n    } else {\n      setSelectedDates(value !== null && value !== void 0 ? value : []);\n    }\n    onShortcutClick === null || onShortcutClick === void 0 ? void 0 : onShortcutClick(range, event);\n\n    // End unfinished selections.\n    setSelectedIdle(true);\n  });\n  var handleOK = (0, _utils.useEventCallback)(function (event) {\n    setDateRange(event, selectedDates);\n    onOk === null || onOk === void 0 ? void 0 : onOk(selectedDates, event);\n  });\n  var handleClean = (0, _utils.useEventCallback)(function (event) {\n    setCalendarDateRange({\n      dateRange: null\n    });\n    setDateRange(event, null);\n    onClean === null || onClean === void 0 ? void 0 : onClean(event);\n    event.stopPropagation();\n  });\n\n  /**\n   * Callback after the input box value is changed.\n   */\n  var handleInputChange = (0, _utils.useEventCallback)(function (value, event) {\n    if (!value) {\n      return;\n    }\n    var startDate = value[0],\n      endDate = value[1];\n    var selectValue = [startDate, endDate];\n    setHoverDateRange(selectValue);\n    setSelectedDates(selectValue);\n    setCalendarDateRange({\n      dateRange: selectValue\n    });\n    setDateRange(event, selectValue);\n  });\n  var isDateDisabled = (0, _useDateDisabled.default)({\n    shouldDisableDate: shouldDisableDate,\n    DEPRECATED_disabledDate: DEPRECATED_disabledDate\n  });\n  var disableByRange = function disableByRange(start, end, target) {\n    if (isDateDisabled) {\n      // If the date is between the start and the end the button is disabled\n      while ((0, _dateUtils.isBefore)(start, end) || (0, _dateUtils.isSameDay)(start, end)) {\n        if (isDateDisabled(start, {\n          selectDate: selectedDates,\n          selectedDone: isSelectedIdle,\n          target: target\n        })) {\n          return true;\n        }\n        start = (0, _dateUtils.addDays)(start, 1);\n      }\n    }\n    return false;\n  };\n  var disableOkButton = function disableOkButton() {\n    var _trigger$current;\n    var _ref4 = ((_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : _trigger$current.getState()) || {},\n      open = _ref4.open;\n    if (open) {\n      var start = selectedDates[0],\n        end = selectedDates[1];\n      if (!start || !end || !isSelectedIdle) {\n        return true;\n      }\n    }\n    return false;\n  };\n  var disableShortcut = function disableShortcut(value) {\n    if (value === void 0) {\n      value = [];\n    }\n    var _value = value,\n      start = _value[0],\n      end = _value[1];\n    if (!start || !end) {\n      return true;\n    }\n    return disableByRange(start, end, _utils.DATERANGE_DISABLED_TARGET.TOOLBAR_SHORTCUT);\n  };\n  var handleClose = (0, _utils.useEventCallback)(function () {\n    var _trigger$current2, _trigger$current2$clo;\n    (_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : (_trigger$current2$clo = _trigger$current2.close) === null || _trigger$current2$clo === void 0 ? void 0 : _trigger$current2$clo.call(_trigger$current2);\n  });\n  var handleInputKeyDown = (0, _utils.useEventCallback)(function (event) {\n    (0, _Picker.onMenuKeyDown)(event, {\n      esc: handleClose,\n      enter: function enter() {\n        var _trigger$current3;\n        var _ref5 = ((_trigger$current3 = trigger.current) === null || _trigger$current3 === void 0 ? void 0 : _trigger$current3.getState()) || {},\n          open = _ref5.open;\n        if (!open) {\n          var _trigger$current4;\n          (_trigger$current4 = trigger.current) === null || _trigger$current4 === void 0 ? void 0 : _trigger$current4.open();\n        }\n      }\n    });\n  });\n  var disableCalendarDate = isDateDisabled ? function (date, values, type) {\n    return isDateDisabled(date, {\n      selectDate: values,\n      selectedDone: isSelectedIdle,\n      target: type\n    });\n  } : undefined;\n  var renderCalendarOverlay = function renderCalendarOverlay(positionProps, speakerRef) {\n    var left = positionProps.left,\n      top = positionProps.top,\n      className = positionProps.className;\n    var classes = merge(className, menuClassName, prefix('popup-daterange'));\n    var panelClasses = prefix('daterange-panel', {\n      'daterange-panel-show-one-calendar': showOneCalendar\n    });\n\n    /**\n     * Set a min-width (528px) when there are two calendars\n     * @see https://github.com/rsuite/rsuite/issues/3522\n     */\n    var panelStyles = {\n      minWidth: showOneCalendar ? 'auto' : 528\n    };\n    var styles = (0, _extends2.default)({}, menuStyle, {\n      left: left,\n      top: top\n    });\n    var calendarProps = {\n      locale: locale,\n      isoWeek: isoWeek,\n      limitEndYear: limitEndYear,\n      showMeridian: showMeridian,\n      calendarDate: calendarDate,\n      limitStartYear: limitStartYear,\n      showWeekNumbers: showWeekNumbers,\n      format: formatStr,\n      value: selectedDates,\n      hoverRangeValue: hoverDateRange !== null && hoverDateRange !== void 0 ? hoverDateRange : undefined,\n      disabledDate: disableCalendarDate,\n      onSelect: handleSelectDate,\n      onChangeCalendarMonth: onChangeCalendarMonth,\n      onChangeCalendarTime: onChangeCalendarTime,\n      onToggleMeridian: onToggleMeridian,\n      onMouseMove: onMouseMove,\n      renderTitle: renderTitle\n    };\n    var getCalendars = function getCalendars() {\n      if (showOneCalendar) {\n        return /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n          index: activeCalendarKey === 'end' ? 1 : 0\n        }, calendarProps, {\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 812,\n            columnNumber: 16\n          }\n        }));\n      }\n      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n        index: 0\n      }, calendarProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 817,\n          columnNumber: 11\n        }\n      })), /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n        index: 1\n      }, calendarProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 818,\n          columnNumber: 11\n        }\n      })));\n    };\n    var sideRanges = (ranges === null || ranges === void 0 ? void 0 : ranges.filter(function (range) {\n      return (range === null || range === void 0 ? void 0 : range.placement) === 'left';\n    })) || [];\n    var bottomRanges = ranges === null || ranges === void 0 ? void 0 : ranges.filter(function (range) {\n      return (range === null || range === void 0 ? void 0 : range.placement) === 'bottom' || (range === null || range === void 0 ? void 0 : range.placement) === undefined;\n    });\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      role: \"dialog\",\n      \"aria-labelledby\": label ? id + \"-label\" : undefined,\n      tabIndex: -1,\n      className: classes,\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      target: trigger,\n      style: styles,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 829,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: panelClasses,\n      style: panelStyles,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 838,\n        columnNumber: 9\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Stack.default, {\n      alignItems: \"flex-start\",\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 839,\n        columnNumber: 11\n      }\n    }, sideRanges.length > 0 && /*#__PURE__*/_react.default.createElement(_PredefinedRanges.default, {\n      direction: \"column\",\n      spacing: 0,\n      className: prefix('daterange-predefined'),\n      ranges: sideRanges,\n      calendarDate: calendarDate,\n      locale: locale,\n      disableShortcut: disableShortcut,\n      onShortcutClick: handleShortcutPageDate,\n      \"data-testid\": \"daterange-predefined-side\",\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 841,\n        columnNumber: 15\n      }\n    }), /*#__PURE__*/_react.default.createElement(_Stack.default.Item, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 854,\n        columnNumber: 13\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix('daterange-content'),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 855,\n        columnNumber: 15\n      }\n    }, showHeader && /*#__PURE__*/_react.default.createElement(_Header.default, {\n      value: isSelectedIdle ? selectedDates : hoverDateRange,\n      formatStr: formatStr,\n      character: character,\n      clickable: showOneCalendar,\n      activeKey: activeCalendarKey,\n      onSelect: setActiveCalendarKey,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 857,\n        columnNumber: 19\n      }\n    }), /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix(\"daterange-calendar-\" + (showOneCalendar ? 'single' : 'group')),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 867,\n        columnNumber: 17\n      }\n    }, /*#__PURE__*/_react.default.createElement(_DateRangePickerContext.default.Provider, {\n      value: {\n        isSelectedIdle: isSelectedIdle\n      },\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 870,\n        columnNumber: 19\n      }\n    }, getCalendars()))), /*#__PURE__*/_react.default.createElement(_Toolbar.default, {\n      locale: locale,\n      calendarDate: selectedDates,\n      disableOkBtn: disableOkButton,\n      disableShortcut: disableShortcut,\n      hideOkBtn: oneTap,\n      onOk: handleOK,\n      onShortcutClick: handleShortcutPageDate,\n      ranges: bottomRanges,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 875,\n        columnNumber: 15\n      }\n    })))));\n  };\n  var hasValue = !(0, _isNil.default)(value) && value.length > 1;\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  var caretAs = (0, _react.useMemo)(function () {\n    if (caretAsProp === null) {\n      return null;\n    }\n    return caretAsProp || ((0, _dateUtils.shouldOnlyRenderTime)(formatStr) ? _ClockO.default : _Calendar.default);\n  }, [caretAsProp, formatStr]);\n  var isErrorValue = function isErrorValue(value) {\n    if (!value) {\n      return false;\n    }\n\n    // If the value is an empty array, it is not an error value.\n    if (Array.isArray(value) && value.length === 0) {\n      return false;\n    }\n    var startDate = value[0],\n      endDate = value[1];\n    if (!(0, _dateUtils.isValid)(startDate) || !(0, _dateUtils.isValid)(endDate)) {\n      return true;\n    }\n    if ((0, _dateUtils.isBefore)(endDate, startDate)) {\n      return true;\n    }\n    var disabledOptions = {\n      selectDate: value,\n      selectedDone: isSelectedIdle,\n      target: _utils.DATERANGE_DISABLED_TARGET.INPUT\n    };\n    if (isDateDisabled !== null && isDateDisabled !== void 0 && isDateDisabled(startDate, disabledOptions) || isDateDisabled !== null && isDateDisabled !== void 0 && isDateDisabled(endDate, disabledOptions)) {\n      return true;\n    }\n    return false;\n  };\n  var _partitionHTMLProps = (0, _utils.partitionHTMLProps)(restProps, {\n      htmlProps: [],\n      includeAria: true\n    }),\n    ariaProps = _partitionHTMLProps[0],\n    rest = _partitionHTMLProps[1];\n  var showCleanButton = cleanable && hasValue && !readOnly;\n  var invalidValue = value && isErrorValue(value);\n\n  // Custom rendering of the selected value\n  var customValue = null;\n\n  // Input box is read-only when the component is uneditable or loading state\n  var inputReadOnly = readOnly || !editable || loading || false;\n  if (typeof renderValue === 'function' && value) {\n    customValue = renderValue(value, formatStr);\n\n    // If the custom rendering value, the input box is read-only\n    inputReadOnly = true;\n  }\n  var TargetInput = customValue ? _Input.default : _DateRangeInput.default;\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    trigger: \"active\",\n    ref: trigger,\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    placement: placement,\n    onEnter: (0, _utils.createChainedFunction)(handleEnter, onEnter),\n    onEntered: onEntered,\n    onExited: onExited,\n    speaker: renderCalendarOverlay,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 965,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    ref: root,\n    className: merge(className, classes, (_merge = {}, _merge[prefix('error')] = invalidValue, _merge)),\n    style: style,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 975,\n      columnNumber: 7\n    }\n  }, plaintext ? /*#__PURE__*/_react.default.createElement(_DateRangeInput.default, {\n    value: value,\n    format: formatStr,\n    plaintext: plaintext,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 981,\n      columnNumber: 11\n    }\n  }) : /*#__PURE__*/_react.default.createElement(_InputGroup.default, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys, _dateUtils.calendarOnlyProps)), {\n    inside: true,\n    disabled: disabled,\n    size: size,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 983,\n      columnNumber: 11\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Picker.PickerLabel, {\n    className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)([\"label\"]))),\n    id: id + \"-label\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 993,\n      columnNumber: 13\n    }\n  }, label), /*#__PURE__*/_react.default.createElement(TargetInput, (0, _extends2.default)({\n    \"aria-haspopup\": \"dialog\",\n    \"aria-invalid\": invalidValue,\n    \"aria-labelledby\": label ? id + \"-label\" : undefined\n  }, ariaProps, {\n    ref: target,\n    id: id,\n    value: customValue || value,\n    character: character,\n    format: formatStr,\n    placeholder: placeholder ? placeholder : rangeFormatStr,\n    disabled: disabled,\n    readOnly: inputReadOnly,\n    plaintext: plaintext,\n    htmlSize: getInputHtmlSize(),\n    onChange: handleInputChange,\n    onKeyDown: handleInputKeyDown,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 996,\n      columnNumber: 13\n    }\n  })), /*#__PURE__*/_react.default.createElement(_Picker.PickerIndicator, {\n    loading: loading,\n    caretAs: caretAs,\n    onClose: handleClean,\n    showCleanButton: showCleanButton,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1014,\n      columnNumber: 13\n    }\n  }))));\n});\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([(0, _propTypes2.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  limitStartYear: _propTypes.default.number,\n  onChange: _propTypes.default.func,\n  onOk: _propTypes.default.func,\n  disabledDate: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.func, 'Use \"shouldDisableDate\" property instead.'),\n  shouldDisableDate: _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?");
 
 /***/ }),
 
@@ -7048,6 +7158,17 @@ eval("\n\nexports.__esModule = true;\nexports.allowedMaxDays = allowedMaxDays;\n
 
 /***/ }),
 
+/***/ "./src/DateRangePicker/hooks/useDateDisabled.ts":
+/*!******************************************************!*\
+  !*** ./src/DateRangePicker/hooks/useDateDisabled.ts ***!
+  \******************************************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\n/**\n * Returns a function that determines whether a date is disabled and is compatible with the deprecated `disabledDate` prop.\n */\nfunction useDateDisabled(props) {\n  var shouldDisableDate = props.shouldDisableDate,\n    DEPRECATED_disabledDate = props.DEPRECATED_disabledDate;\n  var isDateDisabled = (0, _react.useCallback)(function (date, options) {\n    var selectDate = options.selectDate,\n      selectedDone = options.selectedDone,\n      target = options.target;\n    if (typeof shouldDisableDate === 'function') {\n      return shouldDisableDate(date, selectDate, selectedDone, target);\n    }\n    if (typeof DEPRECATED_disabledDate === 'function') {\n      return DEPRECATED_disabledDate(date, selectDate, selectedDone, target);\n    }\n    return false;\n  }, [shouldDisableDate, DEPRECATED_disabledDate]);\n  if (shouldDisableDate || DEPRECATED_disabledDate) {\n    return isDateDisabled;\n  }\n  return undefined;\n}\nvar _default = useDateDisabled;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/DateRangePicker/hooks/useDateDisabled.ts?");
+
+/***/ }),
+
 /***/ "./src/DateRangePicker/index.tsx":
 /*!***************************************!*\
   !*** ./src/DateRangePicker/index.tsx ***!
@@ -7598,6 +7719,39 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 
 /***/ }),
 
+/***/ "./src/Highlight/Highlight.tsx":
+/*!*************************************!*\
+  !*** ./src/Highlight/Highlight.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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _highlightText = __webpack_require__(/*! ./utils/highlightText */ \"./src/Highlight/utils/highlightText.ts\");\nvar _utils2 = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Highlight/Highlight.tsx\",\n  _this = void 0;\nfunction defaultRenderMark(match, index) {\n  return /*#__PURE__*/_react.default.createElement(\"mark\", {\n    key: index,\n    className: \"rs-highlight-mark\",\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 15,\n      columnNumber: 5\n    }\n  }, match);\n}\n\n/**\n *\n * Highlight the matching text in the content.\n *\n * @see https://rsuitejs.com/components/highlight\n */\nvar Highlight = /*#__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 ? 'highlight' : _props$classPrefix,\n    className = props.className,\n    children = props.children,\n    query = props.query,\n    _props$renderMark = props.renderMark,\n    renderMark = _props$renderMark === void 0 ? defaultRenderMark : _props$renderMark,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"className\", \"children\", \"query\", \"renderMark\"]);\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    withClassPrefix = _useClassNames.withClassPrefix,\n    merge = _useClassNames.merge;\n  var classes = merge(className, withClassPrefix());\n  var text = (0, _utils2.stringifyReactNode)(children);\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n    ref: ref,\n    className: classes\n  }, rest, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 44,\n      columnNumber: 7\n    }\n  }), (0, _highlightText.highlightText)(text, {\n    query: query,\n    renderMark: renderMark\n  }));\n});\nHighlight.displayName = 'Highlight';\nHighlight.propTypes = {\n  className: _propTypes.default.string,\n  classPrefix: _propTypes.default.string,\n  as: _propTypes.default.elementType\n};\nvar _default = Highlight;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/Highlight/Highlight.tsx?");
+
+/***/ }),
+
+/***/ "./src/Highlight/index.tsx":
+/*!*********************************!*\
+  !*** ./src/Highlight/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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _Highlight = _interopRequireDefault(__webpack_require__(/*! ./Highlight */ \"./src/Highlight/Highlight.tsx\"));\nvar _default = _Highlight.default;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/Highlight/index.tsx?");
+
+/***/ }),
+
+/***/ "./src/Highlight/utils/highlightText.ts":
+/*!**********************************************!*\
+  !*** ./src/Highlight/utils/highlightText.ts ***!
+  \**********************************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.highlightText = highlightText;\nvar _utils = __webpack_require__(/*! ../../internals/utils */ \"./src/internals/utils/index.ts\");\nfunction highlightText(text, props) {\n  var query = props.query,\n    renderMark = props.renderMark;\n  if (!query || !text) {\n    return text;\n  }\n  var queries = Array.isArray(query) ? query : [query];\n  var regx = new RegExp(queries.map(function (q) {\n    return (0, _utils.getSafeRegExpString)(q);\n  }).join('|'), 'ig');\n  var texts = [];\n  var strArr = text.split(regx);\n  var highStrArr = text.match(regx);\n  for (var i = 0; i < strArr.length; i++) {\n    if (strArr[i]) {\n      texts.push(strArr[i]);\n    }\n    if (highStrArr !== null && highStrArr !== void 0 && highStrArr[i]) {\n      texts.push(renderMark(highStrArr[i], i));\n    }\n  }\n  return texts;\n}\n\n//# sourceURL=webpack://rsuite/./src/Highlight/utils/highlightText.ts?");
+
+/***/ }),
+
 /***/ "./src/IconButton/IconButton.tsx":
 /*!***************************************!*\
   !*** ./src/IconButton/IconButton.tsx ***!
@@ -7792,7 +7946,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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\nvar _extends3 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _isUndefined = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _remove = _interopRequireDefault(__webpack_require__(/*! lodash/remove */ \"./node_modules/lodash/remove.js\"));\nvar _clone = _interopRequireDefault(__webpack_require__(/*! lodash/clone */ \"./node_modules/lodash/clone.js\"));\nvar _isArray = _interopRequireDefault(__webpack_require__(/*! lodash/isArray */ \"./node_modules/lodash/isArray.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _shallowEqual = _interopRequireDefault(__webpack_require__(/*! ../utils/shallowEqual */ \"./src/utils/shallowEqual.ts\"));\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\nvar _Plaintext = _interopRequireDefault(__webpack_require__(/*! ../internals/Plaintext */ \"./src/internals/Plaintext/index.tsx\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _getDataGroupBy = __webpack_require__(/*! ../utils/getDataGroupBy */ \"./src/utils/getDataGroupBy.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _Tag = _interopRequireDefault(__webpack_require__(/*! ../Tag */ \"./src/Tag/index.tsx\"));\nvar _TextBox = _interopRequireDefault(__webpack_require__(/*! ./TextBox */ \"./src/InputPicker/TextBox.tsx\"));\nvar _InputPickerContext = __webpack_require__(/*! ./InputPickerContext */ \"./src/InputPicker/InputPickerContext.tsx\");\nvar _Stack = _interopRequireDefault(__webpack_require__(/*! ../Stack */ \"./src/Stack/index.tsx\"));\nvar _useInput2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useInput */ \"./src/InputPicker/hooks/useInput.ts\"));\nvar _useData2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useData */ \"./src/InputPicker/hooks/useData.ts\"));\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/InputPicker/utils.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/InputPicker/InputPicker.tsx\",\n  _this = void 0,\n  _templateObject,\n  _templateObject2,\n  _templateObject3,\n  _templateObject4;\n/**\n * Single item selector with text box input.\n *\n * @see https://rsuitejs.com/components/input-picker\n */\nvar InputPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _merge;\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$cleanable = props.cleanable,\n    cleanable = _props$cleanable === void 0 ? true : _props$cleanable,\n    _props$cacheData = props.cacheData,\n    cacheData = _props$cacheData === void 0 ? [] : _props$cacheData,\n    _props$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n    _props$data = props.data,\n    controlledData = _props$data === void 0 ? [] : _props$data,\n    disabled = props.disabled,\n    readOnly = props.readOnly,\n    plaintext = props.plaintext,\n    defaultValue = props.defaultValue,\n    _props$defaultOpen = props.defaultOpen,\n    defaultOpen = _props$defaultOpen === void 0 ? false : _props$defaultOpen,\n    _props$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? [] : _props$disabledItemVa,\n    overrideLocale = props.locale,\n    toggleAs = props.toggleAs,\n    style = props.style,\n    size = props.size,\n    _props$searchable = props.searchable,\n    searchable = _props$searchable === void 0 ? true : _props$searchable,\n    controlledOpen = props.open,\n    placeholder = props.placeholder,\n    _props$placement = props.placement,\n    placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n    groupBy = props.groupBy,\n    menuClassName = props.menuClassName,\n    menuStyle = props.menuStyle,\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    creatable = props.creatable,\n    shouldDisplayCreateOption = props.shouldDisplayCreateOption,\n    valueProp = props.value,\n    _props$valueKey = props.valueKey,\n    valueKey = _props$valueKey === void 0 ? 'value' : _props$valueKey,\n    virtualized = props.virtualized,\n    _props$labelKey = props.labelKey,\n    labelKey = _props$labelKey === void 0 ? 'label' : _props$labelKey,\n    listProps = props.listProps,\n    id = props.id,\n    tabIndex = props.tabIndex,\n    sort = props.sort,\n    renderMenu = props.renderMenu,\n    renderExtraFooter = props.renderExtraFooter,\n    renderValue = props.renderValue,\n    renderMenuItem = props.renderMenuItem,\n    renderMenuGroup = props.renderMenuGroup,\n    onEnter = props.onEnter,\n    onEntered = props.onEntered,\n    onExit = props.onExit,\n    onExited = props.onExited,\n    onChange = props.onChange,\n    onClean = props.onClean,\n    onCreate = props.onCreate,\n    onSearch = props.onSearch,\n    onSelect = props.onSelect,\n    onBlur = props.onBlur,\n    onFocus = props.onFocus,\n    searchBy = props.searchBy,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"appearance\", \"cleanable\", \"cacheData\", \"classPrefix\", \"data\", \"disabled\", \"readOnly\", \"plaintext\", \"defaultValue\", \"defaultOpen\", \"disabledItemValues\", \"locale\", \"toggleAs\", \"style\", \"size\", \"searchable\", \"open\", \"placeholder\", \"placement\", \"groupBy\", \"menuClassName\", \"menuStyle\", \"menuAutoWidth\", \"menuMaxHeight\", \"creatable\", \"shouldDisplayCreateOption\", \"value\", \"valueKey\", \"virtualized\", \"labelKey\", \"listProps\", \"id\", \"tabIndex\", \"sort\", \"renderMenu\", \"renderExtraFooter\", \"renderValue\", \"renderMenuItem\", \"renderMenuGroup\", \"onEnter\", \"onEntered\", \"onExit\", \"onExited\", \"onChange\", \"onClean\", \"onCreate\", \"onSearch\", \"onSelect\", \"onBlur\", \"onFocus\", \"searchBy\"]);\n  var _useTagContext = (0, _InputPickerContext.useTagContext)(),\n    multi = _useTagContext.multi,\n    tagProps = _useTagContext.tagProps,\n    trigger = _useTagContext.trigger,\n    disabledOptions = _useTagContext.disabledOptions,\n    onTagRemove = _useTagContext.onTagRemove,\n    renderCheckbox = _useTagContext.renderCheckbox;\n  if (groupBy === valueKey || groupBy === labelKey) {\n    throw Error('`groupBy` can not be equal to `valueKey` and `labelKey`');\n  }\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    triggerRef = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay,\n    list = _usePickerRef.list;\n  var _useCustom = (0, _utils.useCustom)(['Picker', 'InputPicker'], overrideLocale),\n    locale = _useCustom.locale;\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge;\n  var _useControlled = (0, _utils.useControlled)(controlledOpen, defaultOpen),\n    open = _useControlled[0],\n    setOpen = _useControlled[1];\n  var _useInput = (0, _useInput2.default)({\n      multi: multi,\n      triggerRef: triggerRef\n    }),\n    inputRef = _useInput.inputRef,\n    inputProps = _useInput.inputProps,\n    focus = _useInput.focus,\n    blur = _useInput.blur;\n  var handleDataChange = function handleDataChange(data) {\n    var _data$;\n    setFocusItemValue(data === null || data === void 0 ? void 0 : (_data$ = data[0]) === null || _data$ === void 0 ? void 0 : _data$[valueKey]);\n  };\n  var _useData = (0, _useData2.default)({\n      controlledData: controlledData,\n      cacheData: cacheData,\n      onChange: handleDataChange\n    }),\n    data = _useData.data,\n    dataWithCache = _useData.dataWithCache,\n    newData = _useData.newData,\n    setNewData = _useData.setNewData;\n  var _useControlled2 = (0, _utils.useControlled)(valueProp, multi ? defaultValue || [] : defaultValue),\n    value = _useControlled2[0],\n    setValue = _useControlled2[1],\n    isControlled = _useControlled2[2];\n  var cloneValue = function cloneValue() {\n    return multi ? (0, _clone.default)(value) || [] : value;\n  };\n  var handleClose = (0, _utils.useEventCallback)(function () {\n    var _triggerRef$current, _target$current, _target$current$focus;\n    triggerRef === null || triggerRef === void 0 ? void 0 : (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : _triggerRef$current.close();\n\n    // The focus is on the trigger button after closing\n    (_target$current = target.current) === null || _target$current === void 0 ? void 0 : (_target$current$focus = _target$current.focus) === null || _target$current$focus === void 0 ? void 0 : _target$current$focus.call(_target$current);\n  });\n  var focusItemValueOptions = {\n    data: dataWithCache,\n    valueKey: valueKey,\n    target: function target() {\n      return overlay.current;\n    }\n  };\n\n  // Used to hover the focuse item  when trigger `onKeydown`\n  var _useFocusItemValue = (0, _Picker.useFocusItemValue)(multi ? value === null || value === void 0 ? void 0 : value[0] : value, focusItemValueOptions),\n    focusItemValue = _useFocusItemValue.focusItemValue,\n    setFocusItemValue = _useFocusItemValue.setFocusItemValue,\n    onKeyDown = _useFocusItemValue.onKeyDown;\n  var onSearchCallback = (0, _utils.useEventCallback)(function (searchKeyword, filteredData, event) {\n    if (!disabledOptions) {\n      var _filteredData$;\n      // The first option after filtering is the focus.\n      var firstItemValue = filteredData === null || filteredData === void 0 ? void 0 : (_filteredData$ = filteredData[0]) === null || _filteredData$ === void 0 ? void 0 : _filteredData$[valueKey];\n\n      // If there is no value in the option and new options are supported, the search keyword is the first option\n      if (!firstItemValue && creatable) {\n        firstItemValue = searchKeyword;\n      }\n      setFocusItemValue(firstItemValue);\n    }\n    onSearch === null || onSearch === void 0 ? void 0 : onSearch(searchKeyword, event);\n  });\n  var searchOptions = {\n    labelKey: labelKey,\n    searchBy: searchBy,\n    callback: onSearchCallback\n  };\n\n  // Use search keywords to filter options.\n  var _useSearch = (0, _Picker.useSearch)(data, searchOptions),\n    searchKeyword = _useSearch.searchKeyword,\n    resetSearch = _useSearch.resetSearch,\n    checkShouldDisplay = _useSearch.checkShouldDisplay,\n    handleSearch = _useSearch.handleSearch; // Update the position of the menu when the search keyword and value change\n  (0, _react.useEffect)(function () {\n    var _triggerRef$current2, _triggerRef$current2$;\n    (_triggerRef$current2 = triggerRef.current) === null || _triggerRef$current2 === void 0 ? void 0 : (_triggerRef$current2$ = _triggerRef$current2.updatePosition) === null || _triggerRef$current2$ === void 0 ? void 0 : _triggerRef$current2$.call(_triggerRef$current2);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [searchKeyword, value]);\n  var getDataItem = function getDataItem(value) {\n    // Find active `MenuItem` by `value`\n    var activeItem = dataWithCache.find(function (item) {\n      return (0, _shallowEqual.default)(item[valueKey], value);\n    });\n    var itemNode = placeholder;\n    if (activeItem !== null && activeItem !== void 0 && activeItem[labelKey]) {\n      itemNode = activeItem === null || activeItem === void 0 ? void 0 : activeItem[labelKey];\n    }\n    return {\n      isValid: !!activeItem,\n      activeItem: activeItem,\n      itemNode: itemNode\n    };\n  };\n\n  /**\n   * Convert the string of the newly created option into an object.\n   */\n  var createOption = function createOption(value) {\n    var _option;\n    var option = (_option = {\n      create: true\n    }, _option[valueKey] = value, _option[labelKey] = value, _option);\n    if (groupBy) {\n      var _extends2;\n      return (0, _extends3.default)((_extends2 = {}, _extends2[groupBy] = locale === null || locale === void 0 ? void 0 : locale.newItem, _extends2), option);\n    }\n    return option;\n  };\n  var handleChange = (0, _utils.useEventCallback)(function (value, event) {\n    onChange === null || onChange === void 0 ? void 0 : onChange(value, event);\n  });\n  var handleRemoveItemByTag = (0, _utils.useEventCallback)(function (tag, event) {\n    event.stopPropagation();\n    var val = cloneValue();\n    (0, _remove.default)(val, function (itemVal) {\n      return (0, _shallowEqual.default)(itemVal, tag);\n    });\n    setValue(val);\n    handleChange(val, event);\n    onTagRemove === null || onTagRemove === void 0 ? void 0 : onTagRemove(tag, event);\n  });\n  var handleSelect = (0, _utils.useEventCallback)(function (value, item, event) {\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(value, item, event);\n    if (creatable && item.create) {\n      delete item.create;\n      onCreate === null || onCreate === void 0 ? void 0 : onCreate(value, item, event);\n      setNewData(newData.concat(item));\n    }\n  });\n\n  /**\n   * Callback triggered by single selection\n   * @param value\n   * @param item\n   * @param event\n   */\n  var handleSelectItem = (0, _utils.useEventCallback)(function (value, item, event) {\n    setValue(value);\n    setFocusItemValue(value);\n    resetSearch();\n    handleSelect(value, item, event);\n    handleChange(value, event);\n    handleClose();\n  });\n\n  /**\n   * Callback triggered by multiple selection\n   * @param nextItemValue\n   * @param item\n   * @param event\n   * @param checked\n   */\n  var handleCheckTag = (0, _utils.useEventCallback)(function (nextItemValue, item, event, checked) {\n    var val = cloneValue();\n    if (checked) {\n      val.push(nextItemValue);\n    } else {\n      (0, _remove.default)(val, function (itemVal) {\n        return (0, _shallowEqual.default)(itemVal, nextItemValue);\n      });\n    }\n    setValue(val);\n    resetSearch();\n    setFocusItemValue(nextItemValue);\n    handleSelect(val, item, event);\n    handleChange(val, event);\n    focus();\n  });\n  var handleTagKeyPress = (0, _utils.useEventCallback)(function (event) {\n    // When composing, ignore the keypress event.\n    if (event.nativeEvent.isComposing) {\n      return;\n    }\n    var val = cloneValue();\n    var newItemValue = focusItemValue || '';\n\n    // In TagInput\n    if (multi && disabledOptions) {\n      newItemValue = searchKeyword;\n    }\n    if (!newItemValue || !data) {\n      return;\n    }\n\n    // If the value is disabled in this option, it is returned.\n    if (disabledItemValues !== null && disabledItemValues !== void 0 && disabledItemValues.some(function (item) {\n      return item === newItemValue;\n    })) {\n      return;\n    }\n    if (!val.some(function (v) {\n      return (0, _shallowEqual.default)(v, newItemValue);\n    })) {\n      val.push(newItemValue);\n    } else if (!disabledOptions) {\n      (0, _remove.default)(val, function (itemVal) {\n        return (0, _shallowEqual.default)(itemVal, newItemValue);\n      });\n    }\n    var focusItem = data.find(function (item) {\n      return (0, _shallowEqual.default)(item === null || item === void 0 ? void 0 : item[valueKey], newItemValue);\n    });\n    if (!focusItem) {\n      focusItem = createOption(newItemValue);\n    }\n    setValue(val);\n    resetSearch();\n    handleSelect(val, focusItem, event);\n    handleChange(val, event);\n  });\n  var handleMenuItemKeyPress = (0, _utils.useEventCallback)(function (event) {\n    if (!focusItemValue || !controlledData) {\n      return;\n    }\n\n    // If the value is disabled in this option, it is returned.\n    if (disabledItemValues !== null && disabledItemValues !== void 0 && disabledItemValues.some(function (item) {\n      return item === focusItemValue;\n    })) {\n      return;\n    }\n\n    // Find active `MenuItem` by `value`\n    var focusItem = data.find(function (item) {\n      return (0, _shallowEqual.default)(item[valueKey], focusItemValue);\n    });\n\n    // FIXME Bad state flow\n    if (!focusItem && focusItemValue === searchKeyword) {\n      focusItem = createOption(searchKeyword);\n    }\n    setValue(focusItemValue);\n    resetSearch();\n    if (focusItem) {\n      handleSelect(focusItemValue, focusItem, event);\n    }\n    handleChange(focusItemValue, event);\n    handleClose();\n  });\n\n  /**\n   * Remove the last item, after pressing the back key on the keyboard.\n   * @param event\n   */\n  var removeLastItem = (0, _utils.useEventCallback)(function (event) {\n    var target = event === null || event === void 0 ? void 0 : event.target;\n    if ((target === null || target === void 0 ? void 0 : target.tagName) !== 'INPUT') {\n      focus();\n      return;\n    }\n    if ((target === null || target === void 0 ? void 0 : target.tagName) === 'INPUT' && target !== null && target !== void 0 && target.value) {\n      return;\n    }\n    var val = cloneValue();\n    val.pop();\n    setValue(val);\n    handleChange(val, event);\n  });\n  var handleClean = (0, _utils.useEventCallback)(function (event) {\n    if (disabled || searchKeyword !== '') {\n      return;\n    }\n    setValue(null);\n    setFocusItemValue(null);\n    resetSearch();\n    if (multi) {\n      handleChange([], event);\n    } else {\n      handleChange(null, event);\n    }\n    onClean === null || onClean === void 0 ? void 0 : onClean(event);\n  });\n  var events = {\n    onMenuPressBackspace: multi ? removeLastItem : handleClean,\n    onMenuKeyDown: onKeyDown,\n    onMenuPressEnter: undefined,\n    onKeyDown: undefined\n  };\n  var handleKeyPress = (0, _utils.useEventCallback)(function (event) {\n    // When typing a space, create a tag.\n    if ((0, _utils.isOneOf)('Space', trigger) && event.key === _utils.KEY_VALUES.SPACE) {\n      handleTagKeyPress(event);\n      event.preventDefault();\n    }\n\n    // When typing a comma, create a tag.\n    if ((0, _utils.isOneOf)('Comma', trigger) && event.key === _utils.KEY_VALUES.COMMA) {\n      handleTagKeyPress(event);\n      event.preventDefault();\n    }\n  });\n  if (multi) {\n    if ((0, _utils.isOneOf)('Enter', trigger)) {\n      events.onMenuPressEnter = handleTagKeyPress;\n    }\n    if (creatable) {\n      events.onKeyDown = handleKeyPress;\n    }\n  } else {\n    events.onMenuPressEnter = handleMenuItemKeyPress;\n  }\n  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends3.default)({\n    trigger: triggerRef,\n    target: target,\n    overlay: overlay\n  }, events, rest));\n  var handleExited = (0, _utils.useEventCallback)(function () {\n    setFocusItemValue(multi ? value === null || value === void 0 ? void 0 : value[0] : value);\n    resetSearch();\n  });\n  var handleFocus = (0, _utils.useEventCallback)(function (event) {\n    if (!readOnly) {\n      var _triggerRef$current3;\n      setOpen(true);\n      (_triggerRef$current3 = triggerRef.current) === null || _triggerRef$current3 === void 0 ? void 0 : _triggerRef$current3.open();\n    }\n    onFocus === null || onFocus === void 0 ? void 0 : onFocus(event);\n  });\n  var handleEnter = (0, _utils.useEventCallback)(function () {\n    focus();\n    setOpen(true);\n  });\n  var handleExit = (0, _utils.useEventCallback)(function () {\n    blur();\n    setOpen(false);\n  });\n  var renderListItem = function renderListItem(label, item) {\n    // 'Create option \"{0}\"' =>  Create option \"xxxxx\"\n    var newLabel = item.create ? /*#__PURE__*/_react.default.createElement(\"span\", {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 513,\n        columnNumber: 9\n      }\n    }, (0, _utils.tplTransform)(locale.createOption, label)) : label;\n    return renderMenuItem ? renderMenuItem(newLabel, item) : newLabel;\n  };\n  var checkValue = function checkValue() {\n    if (multi) {\n      return {\n        isValid: false,\n        itemNode: null\n      };\n    }\n    var dataItem = getDataItem(value);\n    var itemNode = dataItem.itemNode;\n    if (!(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue)) {\n      itemNode = renderValue(value, dataItem.activeItem, itemNode);\n    }\n    return {\n      isValid: dataItem.isValid,\n      itemNode: itemNode\n    };\n  };\n  var renderMultiValue = function renderMultiValue() {\n    if (!multi) {\n      return null;\n    }\n    var _tagProps$closable = tagProps.closable,\n      closable = _tagProps$closable === void 0 ? true : _tagProps$closable,\n      onClose = tagProps.onClose,\n      tagRest = (0, _objectWithoutPropertiesLoose2.default)(tagProps, [\"closable\", \"onClose\"]);\n    var tags = value || [];\n    var items = [];\n    var tagElements = tags.map(function (tag) {\n      var _getDataItem = getDataItem(tag),\n        isValid = _getDataItem.isValid,\n        itemNode = _getDataItem.itemNode,\n        activeItem = _getDataItem.activeItem;\n      items.push(activeItem);\n      if (!isValid) {\n        return null;\n      }\n      return /*#__PURE__*/_react.default.createElement(_Tag.default, (0, _extends3.default)({\n        role: \"option\"\n      }, tagRest, {\n        key: tag,\n        size: (0, _utils2.convertSize)(size),\n        closable: !disabled && closable && !readOnly && !plaintext,\n        title: typeof itemNode === 'string' ? itemNode : undefined,\n        onClose: (0, _utils.createChainedFunction)(handleRemoveItemByTag.bind(null, tag), onClose),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 558,\n          columnNumber: 13\n        }\n      }), itemNode);\n    }).filter(function (item) {\n      return item !== null;\n    });\n    if ((tags.length > 0 || isControlled) && (0, _isFunction.default)(renderValue)) {\n      return renderValue(value, items, tagElements);\n    }\n    return tagElements;\n  };\n  var renderPopup = function renderPopup(positionProps, speakerRef) {\n    var left = positionProps.left,\n      top = positionProps.top,\n      className = positionProps.className;\n    var menuClassPrefix = multi ? 'picker-check-menu' : 'picker-select-menu';\n    var classes = merge(className, menuClassName, prefix(multi ? 'check-menu' : 'select-menu'));\n    var styles = (0, _extends3.default)({}, menuStyle, {\n      left: left,\n      top: top\n    });\n    var items = (0, _treeUtils.filterNodesOfTree)(data, checkShouldDisplay);\n    if (creatable && (typeof shouldDisplayCreateOption === 'function' ? shouldDisplayCreateOption(searchKeyword, items) : searchKeyword && !items.find(function (item) {\n      return item[valueKey] === searchKeyword;\n    }))) {\n      items = [].concat(items, [createOption(searchKeyword)]);\n    }\n\n    // Create a tree structure data when set `groupBy`\n    if (groupBy) {\n      items = (0, _getDataGroupBy.getDataGroupBy)(items, groupBy, sort);\n    } else if (typeof sort === 'function') {\n      items = items.sort(sort(false));\n    }\n    if (disabledOptions) {\n      return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n        ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 605,\n          columnNumber: 16\n        }\n      });\n    }\n    var menu = items.length ? /*#__PURE__*/_react.default.createElement(_Picker.Listbox, {\n      listProps: listProps,\n      listRef: list,\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      classPrefix: menuClassPrefix,\n      listItemClassPrefix: multi ? undefined : menuClassPrefix + \"-item\",\n      listItemAs: multi ? _Picker.ListCheckItem : _Picker.ListItem,\n      listItemProps: {\n        renderCheckbox: renderCheckbox\n      },\n      activeItemValues: multi ? value : [value],\n      focusItemValue: focusItemValue,\n      maxHeight: menuMaxHeight,\n      data: items\n      // FIXME-Doma\n      // `group` is redundant so long as `groupBy` exists\n      ,\n      group: !(0, _isUndefined.default)(groupBy),\n      groupBy: groupBy,\n      onSelect: multi ? handleCheckTag : handleSelectItem,\n      renderMenuGroup: renderMenuGroup,\n      renderMenuItem: renderListItem,\n      virtualized: virtualized,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 609,\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: 633,\n        columnNumber: 9\n      }\n    }, locale === null || locale === void 0 ? void 0 : locale.noResultsText);\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      autoWidth: menuAutoWidth,\n      className: classes,\n      style: styles,\n      target: triggerRef,\n      onKeyDown: onPickerKeyDown,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 637,\n        columnNumber: 9\n      }\n    }, renderMenu ? renderMenu(menu) : menu, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  var _checkValue = checkValue(),\n    isValid = _checkValue.isValid,\n    itemNode = _checkValue.itemNode;\n  var tagElements = renderMultiValue();\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   * 3.If renderValue returns null or undefined, hasValue is false.\n   */\n  var hasSingleValue = !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue) && !(0, _isNil.default)(itemNode);\n  var hasMultiValue = (0, _isArray.default)(value) && value.length > 0 && (0, _isFunction.default)(renderValue) && !(0, _isNil.default)(tagElements);\n  var hasValue = multi ? !!(tagElements !== null && tagElements !== void 0 && tagElements.length) || hasMultiValue : isValid || hasSingleValue;\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends3.default)({}, props, {\n      classPrefix: classPrefix,\n      appearance: appearance,\n      hasValue: hasValue,\n      name: 'input',\n      cleanable: cleanable\n    })),\n    pickerClasses = _usePickerClassName[0],\n    usedClassNamePropKeys = _usePickerClassName[1];\n  var classes = merge(pickerClasses, (_merge = {}, _merge[prefix(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)([\"tag\"])))] = multi, _merge[prefix((multi ? 'tag' : 'input') + \"-\" + size)] = size, _merge[prefix(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)([\"focused\"])))] = open, _merge[prefix(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)([\"disabled-options\"])))] = disabledOptions, _merge));\n  var searching = !!searchKeyword && open;\n  var editable = searchable && !disabled && !rest.loading;\n  if (plaintext) {\n    var plaintextProps = {};\n\n    // When multiple selection, the tag is displayed in a stack layout.\n    if (multi && hasValue) {\n      plaintextProps.as = _Stack.default;\n      plaintextProps.spacing = 6;\n      plaintextProps.wrap = true;\n      plaintextProps.childrenRenderMode = 'clone';\n    }\n    return /*#__PURE__*/_react.default.createElement(_Plaintext.default, (0, _extends3.default)({\n      localeKey: \"notSelected\",\n      ref: target\n    }, plaintextProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 694,\n        columnNumber: 9\n      }\n    }), itemNode || (tagElements !== null && tagElements !== void 0 && tagElements.length ? tagElements : null) || placeholder);\n  }\n  var placeholderNode = placeholder || (disabledOptions ? null : locale === null || locale === void 0 ? void 0 : locale.placeholder);\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    id: id,\n    multiple: multi,\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: triggerRef,\n    trigger: \"active\",\n    onEnter: (0, _utils.createChainedFunction)(handleEnter, onEnter),\n    onEntered: onEntered,\n    onExit: (0, _utils.createChainedFunction)(handleExit, onExit),\n    onExited: (0, _utils.createChainedFunction)(handleExited, onExited),\n    speaker: renderPopup,\n    placement: placement,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 703,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    onClick: focus,\n    onKeyDown: onPickerKeyDown,\n    ref: root,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 716,\n      columnNumber: 9\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends3.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys)), {\n    appearance: appearance,\n    readOnly: readOnly,\n    plaintext: plaintext,\n    ref: target,\n    as: toggleAs,\n    tabIndex: tabIndex,\n    onClean: handleClean,\n    cleanable: cleanable && !disabled,\n    hasValue: hasValue,\n    active: open,\n    disabled: disabled,\n    placement: placement,\n    inputValue: value,\n    focusItemValue: focusItemValue,\n    caret: !disabledOptions,\n    size: size,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 723,\n      columnNumber: 11\n    }\n  }), searching || multi && hasValue ? null : itemNode || placeholderNode), /*#__PURE__*/_react.default.createElement(_TextBox.default, {\n    showTagList: hasValue && multi,\n    inputRef: inputRef,\n    inputValue: open ? searchKeyword : '',\n    inputProps: inputProps,\n    tags: tagElements,\n    editable: editable,\n    readOnly: readOnly,\n    disabled: disabled,\n    multiple: multi,\n    onBlur: onBlur,\n    onFocus: handleFocus,\n    onChange: handleSearch,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 744,\n      columnNumber: 11\n    }\n  })));\n});\nInputPicker.displayName = 'InputPicker';\nInputPicker.propTypes = (0, _extends3.default)({}, _Picker.listPickerPropTypes, {\n  locale: _propTypes.default.any,\n  appearance: (0, _propTypes2.oneOf)(['default', 'subtle']),\n  cacheData: _propTypes.default.array,\n  menuAutoWidth: _propTypes.default.bool,\n  menuMaxHeight: _propTypes.default.number,\n  searchable: _propTypes.default.bool,\n  creatable: _propTypes.default.bool,\n  groupBy: _propTypes.default.any,\n  sort: _propTypes.default.func,\n  renderMenu: _propTypes.default.func,\n  renderMenuItem: _propTypes.default.func,\n  renderMenuGroup: _propTypes.default.func,\n  onCreate: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  onGroupTitleClick: _propTypes.default.func,\n  onSearch: _propTypes.default.func,\n  virtualized: _propTypes.default.bool,\n  searchBy: _propTypes.default.func\n});\nvar _default = InputPicker;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/InputPicker/InputPicker.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\nvar _extends3 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _remove = _interopRequireDefault(__webpack_require__(/*! lodash/remove */ \"./node_modules/lodash/remove.js\"));\nvar _clone = _interopRequireDefault(__webpack_require__(/*! lodash/clone */ \"./node_modules/lodash/clone.js\"));\nvar _isArray = _interopRequireDefault(__webpack_require__(/*! lodash/isArray */ \"./node_modules/lodash/isArray.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _shallowEqual = _interopRequireDefault(__webpack_require__(/*! ../utils/shallowEqual */ \"./src/utils/shallowEqual.ts\"));\nvar _utils = __webpack_require__(/*! ../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _Plaintext = _interopRequireDefault(__webpack_require__(/*! ../internals/Plaintext */ \"./src/internals/Plaintext/index.tsx\"));\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _getDataGroupBy = __webpack_require__(/*! ../utils/getDataGroupBy */ \"./src/utils/getDataGroupBy.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _Tag = _interopRequireDefault(__webpack_require__(/*! ../Tag */ \"./src/Tag/index.tsx\"));\nvar _TextBox = _interopRequireDefault(__webpack_require__(/*! ./TextBox */ \"./src/InputPicker/TextBox.tsx\"));\nvar _InputPickerContext = __webpack_require__(/*! ./InputPickerContext */ \"./src/InputPicker/InputPickerContext.tsx\");\nvar _Stack = _interopRequireDefault(__webpack_require__(/*! ../Stack */ \"./src/Stack/index.tsx\"));\nvar _useInput2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useInput */ \"./src/InputPicker/hooks/useInput.ts\"));\nvar _useData2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useData */ \"./src/InputPicker/hooks/useData.ts\"));\nvar _utils3 = __webpack_require__(/*! ./utils */ \"./src/InputPicker/utils.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/InputPicker/InputPicker.tsx\",\n  _this = void 0,\n  _templateObject,\n  _templateObject2,\n  _templateObject3,\n  _templateObject4;\n/**\n * Single item selector with text box input.\n *\n * @see https://rsuitejs.com/components/input-picker\n */\nvar InputPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _merge;\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$cleanable = props.cleanable,\n    cleanable = _props$cleanable === void 0 ? true : _props$cleanable,\n    _props$cacheData = props.cacheData,\n    cacheData = _props$cacheData === void 0 ? [] : _props$cacheData,\n    _props$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n    _props$data = props.data,\n    controlledData = _props$data === void 0 ? [] : _props$data,\n    disabled = props.disabled,\n    readOnly = props.readOnly,\n    plaintext = props.plaintext,\n    defaultValue = props.defaultValue,\n    _props$defaultOpen = props.defaultOpen,\n    defaultOpen = _props$defaultOpen === void 0 ? false : _props$defaultOpen,\n    _props$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? [] : _props$disabledItemVa,\n    overrideLocale = props.locale,\n    toggleAs = props.toggleAs,\n    style = props.style,\n    size = props.size,\n    _props$searchable = props.searchable,\n    searchable = _props$searchable === void 0 ? true : _props$searchable,\n    controlledOpen = props.open,\n    placeholder = props.placeholder,\n    _props$placement = props.placement,\n    placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n    groupBy = props.groupBy,\n    menuClassName = props.menuClassName,\n    menuStyle = props.menuStyle,\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    creatable = props.creatable,\n    shouldDisplayCreateOption = props.shouldDisplayCreateOption,\n    valueProp = props.value,\n    _props$valueKey = props.valueKey,\n    valueKey = _props$valueKey === void 0 ? 'value' : _props$valueKey,\n    virtualized = props.virtualized,\n    _props$labelKey = props.labelKey,\n    labelKey = _props$labelKey === void 0 ? 'label' : _props$labelKey,\n    listProps = props.listProps,\n    id = props.id,\n    tabIndex = props.tabIndex,\n    sort = props.sort,\n    renderMenu = props.renderMenu,\n    renderExtraFooter = props.renderExtraFooter,\n    renderValue = props.renderValue,\n    renderMenuItem = props.renderMenuItem,\n    renderMenuGroup = props.renderMenuGroup,\n    onEnter = props.onEnter,\n    onEntered = props.onEntered,\n    onExit = props.onExit,\n    onExited = props.onExited,\n    onChange = props.onChange,\n    onClean = props.onClean,\n    onCreate = props.onCreate,\n    onSearch = props.onSearch,\n    onSelect = props.onSelect,\n    onBlur = props.onBlur,\n    onFocus = props.onFocus,\n    searchBy = props.searchBy,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"appearance\", \"cleanable\", \"cacheData\", \"classPrefix\", \"data\", \"disabled\", \"readOnly\", \"plaintext\", \"defaultValue\", \"defaultOpen\", \"disabledItemValues\", \"locale\", \"toggleAs\", \"style\", \"size\", \"searchable\", \"open\", \"placeholder\", \"placement\", \"groupBy\", \"menuClassName\", \"menuStyle\", \"menuAutoWidth\", \"menuMaxHeight\", \"creatable\", \"shouldDisplayCreateOption\", \"value\", \"valueKey\", \"virtualized\", \"labelKey\", \"listProps\", \"id\", \"tabIndex\", \"sort\", \"renderMenu\", \"renderExtraFooter\", \"renderValue\", \"renderMenuItem\", \"renderMenuGroup\", \"onEnter\", \"onEntered\", \"onExit\", \"onExited\", \"onChange\", \"onClean\", \"onCreate\", \"onSearch\", \"onSelect\", \"onBlur\", \"onFocus\", \"searchBy\"]);\n  var _useTagContext = (0, _InputPickerContext.useTagContext)(),\n    multi = _useTagContext.multi,\n    tagProps = _useTagContext.tagProps,\n    trigger = _useTagContext.trigger,\n    disabledOptions = _useTagContext.disabledOptions,\n    onTagRemove = _useTagContext.onTagRemove,\n    renderCheckbox = _useTagContext.renderCheckbox;\n  if (groupBy === valueKey || groupBy === labelKey) {\n    throw Error('`groupBy` can not be equal to `valueKey` and `labelKey`');\n  }\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    triggerRef = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay,\n    list = _usePickerRef.list;\n  var _useCustom = (0, _utils2.useCustom)(['Picker', 'InputPicker'], overrideLocale),\n    locale = _useCustom.locale;\n  var _useClassNames = (0, _utils2.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge;\n  var _useControlled = (0, _utils2.useControlled)(controlledOpen, defaultOpen),\n    open = _useControlled[0],\n    setOpen = _useControlled[1];\n  var _useInput = (0, _useInput2.default)({\n      multi: multi,\n      triggerRef: triggerRef\n    }),\n    inputRef = _useInput.inputRef,\n    inputProps = _useInput.inputProps,\n    focus = _useInput.focus,\n    blur = _useInput.blur;\n  var handleDataChange = function handleDataChange(data) {\n    var _data$;\n    setFocusItemValue(data === null || data === void 0 ? void 0 : (_data$ = data[0]) === null || _data$ === void 0 ? void 0 : _data$[valueKey]);\n  };\n  var _useData = (0, _useData2.default)({\n      controlledData: controlledData,\n      cacheData: cacheData,\n      onChange: handleDataChange\n    }),\n    data = _useData.data,\n    dataWithCache = _useData.dataWithCache,\n    newData = _useData.newData,\n    setNewData = _useData.setNewData;\n  var _useControlled2 = (0, _utils2.useControlled)(valueProp, multi ? defaultValue || [] : defaultValue),\n    value = _useControlled2[0],\n    setValue = _useControlled2[1],\n    isControlled = _useControlled2[2];\n  var cloneValue = function cloneValue() {\n    return multi ? (0, _clone.default)(value) || [] : value;\n  };\n  var handleClose = (0, _utils2.useEventCallback)(function () {\n    var _triggerRef$current, _target$current, _target$current$focus;\n    triggerRef === null || triggerRef === void 0 ? void 0 : (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : _triggerRef$current.close();\n\n    // The focus is on the trigger button after closing\n    (_target$current = target.current) === null || _target$current === void 0 ? void 0 : (_target$current$focus = _target$current.focus) === null || _target$current$focus === void 0 ? void 0 : _target$current$focus.call(_target$current);\n  });\n  var focusItemValueOptions = {\n    data: dataWithCache,\n    valueKey: valueKey,\n    target: function target() {\n      return overlay.current;\n    }\n  };\n\n  // Used to hover the focuse item  when trigger `onKeydown`\n  var _useFocusItemValue = (0, _Picker.useFocusItemValue)(multi ? value === null || value === void 0 ? void 0 : value[0] : value, focusItemValueOptions),\n    focusItemValue = _useFocusItemValue.focusItemValue,\n    setFocusItemValue = _useFocusItemValue.setFocusItemValue,\n    onKeyDown = _useFocusItemValue.onKeyDown;\n  var onSearchCallback = (0, _utils2.useEventCallback)(function (searchKeyword, filteredData, event) {\n    if (!disabledOptions) {\n      var _filteredData$;\n      // The first option after filtering is the focus.\n      var firstItemValue = filteredData === null || filteredData === void 0 ? void 0 : (_filteredData$ = filteredData[0]) === null || _filteredData$ === void 0 ? void 0 : _filteredData$[valueKey];\n\n      // If there is no value in the option and new options are supported, the search keyword is the first option\n      if (!firstItemValue && creatable) {\n        firstItemValue = searchKeyword;\n      }\n      setFocusItemValue(firstItemValue);\n    }\n    onSearch === null || onSearch === void 0 ? void 0 : onSearch(searchKeyword, event);\n  });\n  var searchOptions = {\n    labelKey: labelKey,\n    searchBy: searchBy,\n    callback: onSearchCallback\n  };\n\n  // Use search keywords to filter options.\n  var _useSearch = (0, _Picker.useSearch)(data, searchOptions),\n    searchKeyword = _useSearch.searchKeyword,\n    resetSearch = _useSearch.resetSearch,\n    checkShouldDisplay = _useSearch.checkShouldDisplay,\n    handleSearch = _useSearch.handleSearch; // Update the position of the menu when the search keyword and value change\n  (0, _react.useEffect)(function () {\n    var _triggerRef$current2, _triggerRef$current2$;\n    (_triggerRef$current2 = triggerRef.current) === null || _triggerRef$current2 === void 0 ? void 0 : (_triggerRef$current2$ = _triggerRef$current2.updatePosition) === null || _triggerRef$current2$ === void 0 ? void 0 : _triggerRef$current2$.call(_triggerRef$current2);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [searchKeyword, value]);\n  var getDataItem = function getDataItem(value) {\n    // Find active `MenuItem` by `value`\n    var activeItem = dataWithCache.find(function (item) {\n      return (0, _shallowEqual.default)(item[valueKey], value);\n    });\n    var itemNode = placeholder;\n    if (activeItem !== null && activeItem !== void 0 && activeItem[labelKey]) {\n      itemNode = activeItem === null || activeItem === void 0 ? void 0 : activeItem[labelKey];\n    }\n    return {\n      isValid: !!activeItem,\n      activeItem: activeItem,\n      itemNode: itemNode\n    };\n  };\n\n  /**\n   * Convert the string of the newly created option into an object.\n   */\n  var createOption = function createOption(value) {\n    var _option;\n    var option = (_option = {\n      create: true\n    }, _option[valueKey] = value, _option[labelKey] = value, _option);\n    if (groupBy) {\n      var _extends2;\n      return (0, _extends3.default)((_extends2 = {}, _extends2[groupBy] = locale === null || locale === void 0 ? void 0 : locale.newItem, _extends2), option);\n    }\n    return option;\n  };\n  var handleChange = (0, _utils2.useEventCallback)(function (value, event) {\n    onChange === null || onChange === void 0 ? void 0 : onChange(value, event);\n  });\n  var handleRemoveItemByTag = (0, _utils2.useEventCallback)(function (tag, event) {\n    event.stopPropagation();\n    var val = cloneValue();\n    (0, _remove.default)(val, function (itemVal) {\n      return (0, _shallowEqual.default)(itemVal, tag);\n    });\n    setValue(val);\n    handleChange(val, event);\n    onTagRemove === null || onTagRemove === void 0 ? void 0 : onTagRemove(tag, event);\n  });\n  var handleSelect = (0, _utils2.useEventCallback)(function (value, item, event) {\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(value, item, event);\n    if (creatable && item.create) {\n      delete item.create;\n      onCreate === null || onCreate === void 0 ? void 0 : onCreate(value, item, event);\n      setNewData(newData.concat(item));\n    }\n  });\n\n  /**\n   * Callback triggered by single selection\n   * @param value\n   * @param item\n   * @param event\n   */\n  var handleSelectItem = (0, _utils2.useEventCallback)(function (value, item, event) {\n    setValue(value);\n    setFocusItemValue(value);\n    resetSearch();\n    handleSelect(value, item, event);\n    handleChange(value, event);\n    handleClose();\n  });\n\n  /**\n   * Callback triggered by multiple selection\n   * @param nextItemValue\n   * @param item\n   * @param event\n   * @param checked\n   */\n  var handleCheckTag = (0, _utils2.useEventCallback)(function (nextItemValue, item, event, checked) {\n    var val = cloneValue();\n    if (checked) {\n      val.push(nextItemValue);\n    } else {\n      (0, _remove.default)(val, function (itemVal) {\n        return (0, _shallowEqual.default)(itemVal, nextItemValue);\n      });\n    }\n    setValue(val);\n    resetSearch();\n    setFocusItemValue(nextItemValue);\n    handleSelect(val, item, event);\n    handleChange(val, event);\n    focus();\n  });\n  var handleTagKeyPress = (0, _utils2.useEventCallback)(function (event) {\n    // When composing, ignore the keypress event.\n    if (event.nativeEvent.isComposing) {\n      return;\n    }\n    var val = cloneValue();\n    var newItemValue = focusItemValue || '';\n\n    // In TagInput\n    if (multi && disabledOptions) {\n      newItemValue = searchKeyword;\n    }\n    if (!newItemValue || !data) {\n      return;\n    }\n\n    // If the value is disabled in this option, it is returned.\n    if (disabledItemValues !== null && disabledItemValues !== void 0 && disabledItemValues.some(function (item) {\n      return item === newItemValue;\n    })) {\n      return;\n    }\n    if (!val.some(function (v) {\n      return (0, _shallowEqual.default)(v, newItemValue);\n    })) {\n      val.push(newItemValue);\n    } else if (!disabledOptions) {\n      (0, _remove.default)(val, function (itemVal) {\n        return (0, _shallowEqual.default)(itemVal, newItemValue);\n      });\n    }\n    var focusItem = data.find(function (item) {\n      return (0, _shallowEqual.default)(item === null || item === void 0 ? void 0 : item[valueKey], newItemValue);\n    });\n    if (!focusItem) {\n      focusItem = createOption(newItemValue);\n    }\n    setValue(val);\n    resetSearch();\n    handleSelect(val, focusItem, event);\n    handleChange(val, event);\n  });\n  var handleMenuItemKeyPress = (0, _utils2.useEventCallback)(function (event) {\n    if (!focusItemValue || !controlledData) {\n      return;\n    }\n\n    // If the value is disabled in this option, it is returned.\n    if (disabledItemValues !== null && disabledItemValues !== void 0 && disabledItemValues.some(function (item) {\n      return item === focusItemValue;\n    })) {\n      return;\n    }\n\n    // Find active `MenuItem` by `value`\n    var focusItem = data.find(function (item) {\n      return (0, _shallowEqual.default)(item[valueKey], focusItemValue);\n    });\n\n    // FIXME Bad state flow\n    if (!focusItem && focusItemValue === searchKeyword) {\n      focusItem = createOption(searchKeyword);\n    }\n    setValue(focusItemValue);\n    resetSearch();\n    if (focusItem) {\n      handleSelect(focusItemValue, focusItem, event);\n    }\n    handleChange(focusItemValue, event);\n    handleClose();\n  });\n\n  /**\n   * Remove the last item, after pressing the back key on the keyboard.\n   * @param event\n   */\n  var removeLastItem = (0, _utils2.useEventCallback)(function (event) {\n    var target = event === null || event === void 0 ? void 0 : event.target;\n    if ((target === null || target === void 0 ? void 0 : target.tagName) !== 'INPUT') {\n      focus();\n      return;\n    }\n    if ((target === null || target === void 0 ? void 0 : target.tagName) === 'INPUT' && target !== null && target !== void 0 && target.value) {\n      return;\n    }\n    var val = cloneValue();\n    val.pop();\n    setValue(val);\n    handleChange(val, event);\n  });\n  var handleClean = (0, _utils2.useEventCallback)(function (event) {\n    if (disabled || searchKeyword !== '') {\n      return;\n    }\n    setValue(null);\n    setFocusItemValue(null);\n    resetSearch();\n    if (multi) {\n      handleChange([], event);\n    } else {\n      handleChange(null, event);\n    }\n    onClean === null || onClean === void 0 ? void 0 : onClean(event);\n  });\n  var events = {\n    onMenuPressBackspace: multi ? removeLastItem : handleClean,\n    onMenuKeyDown: onKeyDown,\n    onMenuPressEnter: undefined,\n    onKeyDown: undefined\n  };\n  var handleKeyPress = (0, _utils2.useEventCallback)(function (event) {\n    // When typing a space, create a tag.\n    if ((0, _utils2.isOneOf)('Space', trigger) && event.key === _utils2.KEY_VALUES.SPACE) {\n      handleTagKeyPress(event);\n      event.preventDefault();\n    }\n\n    // When typing a comma, create a tag.\n    if ((0, _utils2.isOneOf)('Comma', trigger) && event.key === _utils2.KEY_VALUES.COMMA) {\n      handleTagKeyPress(event);\n      event.preventDefault();\n    }\n  });\n  if (multi) {\n    if ((0, _utils2.isOneOf)('Enter', trigger)) {\n      events.onMenuPressEnter = handleTagKeyPress;\n    }\n    if (creatable) {\n      events.onKeyDown = handleKeyPress;\n    }\n  } else {\n    events.onMenuPressEnter = handleMenuItemKeyPress;\n  }\n  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends3.default)({\n    trigger: triggerRef,\n    target: target,\n    overlay: overlay\n  }, events, rest));\n  var handleExited = (0, _utils2.useEventCallback)(function () {\n    setFocusItemValue(multi ? value === null || value === void 0 ? void 0 : value[0] : value);\n    resetSearch();\n  });\n  var handleFocus = (0, _utils2.useEventCallback)(function (event) {\n    if (!readOnly) {\n      var _triggerRef$current3;\n      setOpen(true);\n      (_triggerRef$current3 = triggerRef.current) === null || _triggerRef$current3 === void 0 ? void 0 : _triggerRef$current3.open();\n    }\n    onFocus === null || onFocus === void 0 ? void 0 : onFocus(event);\n  });\n  var handleEnter = (0, _utils2.useEventCallback)(function () {\n    focus();\n    setOpen(true);\n  });\n  var handleExit = (0, _utils2.useEventCallback)(function () {\n    blur();\n    setOpen(false);\n  });\n  var renderListItem = function renderListItem(label, item) {\n    // 'Create option \"{0}\"' =>  Create option \"xxxxx\"\n    var newLabel = item.create ? /*#__PURE__*/_react.default.createElement(\"span\", {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 512,\n        columnNumber: 9\n      }\n    }, (0, _utils2.tplTransform)(locale.createOption, label)) : label;\n    return renderMenuItem ? renderMenuItem(newLabel, item) : newLabel;\n  };\n  var checkValue = function checkValue() {\n    if (multi) {\n      return {\n        isValid: false,\n        itemNode: null\n      };\n    }\n    var dataItem = getDataItem(value);\n    var itemNode = dataItem.itemNode;\n    if (!(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue)) {\n      itemNode = renderValue(value, dataItem.activeItem, itemNode);\n    }\n    return {\n      isValid: dataItem.isValid,\n      itemNode: itemNode\n    };\n  };\n  var renderMultiValue = function renderMultiValue() {\n    if (!multi) {\n      return null;\n    }\n    var _tagProps$closable = tagProps.closable,\n      closable = _tagProps$closable === void 0 ? true : _tagProps$closable,\n      onClose = tagProps.onClose,\n      tagRest = (0, _objectWithoutPropertiesLoose2.default)(tagProps, [\"closable\", \"onClose\"]);\n    var tags = value || [];\n    var items = [];\n    var tagElements = tags.map(function (tag) {\n      var _getDataItem = getDataItem(tag),\n        isValid = _getDataItem.isValid,\n        itemNode = _getDataItem.itemNode,\n        activeItem = _getDataItem.activeItem;\n      items.push(activeItem);\n      if (!isValid) {\n        return null;\n      }\n      return /*#__PURE__*/_react.default.createElement(_Tag.default, (0, _extends3.default)({\n        role: \"option\"\n      }, tagRest, {\n        key: tag,\n        size: (0, _utils3.convertSize)(size),\n        closable: !disabled && closable && !readOnly && !plaintext,\n        title: typeof itemNode === 'string' ? itemNode : undefined,\n        onClose: (0, _utils2.createChainedFunction)(handleRemoveItemByTag.bind(null, tag), onClose),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 557,\n          columnNumber: 13\n        }\n      }), itemNode);\n    }).filter(function (item) {\n      return item !== null;\n    });\n    if ((tags.length > 0 || isControlled) && (0, _isFunction.default)(renderValue)) {\n      return renderValue(value, items, tagElements);\n    }\n    return tagElements;\n  };\n  var renderPopup = function renderPopup(positionProps, speakerRef) {\n    var left = positionProps.left,\n      top = positionProps.top,\n      className = positionProps.className;\n    var menuClassPrefix = multi ? 'picker-check-menu' : 'picker-select-menu';\n    var classes = merge(className, menuClassName, prefix(multi ? 'check-menu' : 'select-menu'));\n    var styles = (0, _extends3.default)({}, menuStyle, {\n      left: left,\n      top: top\n    });\n    var items = (0, _utils.filterNodesOfTree)(data, checkShouldDisplay);\n    if (creatable && (typeof shouldDisplayCreateOption === 'function' ? shouldDisplayCreateOption(searchKeyword, items) : searchKeyword && !items.find(function (item) {\n      return item[valueKey] === searchKeyword;\n    }))) {\n      items = [].concat(items, [createOption(searchKeyword)]);\n    }\n\n    // Create a tree structure data when set `groupBy`\n    if (groupBy) {\n      items = (0, _getDataGroupBy.getDataGroupBy)(items, groupBy, sort);\n    } else if (typeof sort === 'function') {\n      items = items.sort(sort(false));\n    }\n    if (disabledOptions) {\n      return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n        ref: (0, _utils2.mergeRefs)(overlay, speakerRef),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 604,\n          columnNumber: 16\n        }\n      });\n    }\n    var menu = items.length ? /*#__PURE__*/_react.default.createElement(_Picker.Listbox, {\n      listProps: listProps,\n      listRef: list,\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      classPrefix: menuClassPrefix,\n      listItemClassPrefix: multi ? undefined : menuClassPrefix + \"-item\",\n      listItemAs: multi ? _Picker.ListCheckItem : _Picker.ListItem,\n      listItemProps: {\n        renderCheckbox: renderCheckbox\n      },\n      activeItemValues: multi ? value : [value],\n      focusItemValue: focusItemValue,\n      maxHeight: menuMaxHeight,\n      data: items,\n      query: searchKeyword,\n      groupBy: groupBy,\n      onSelect: multi ? handleCheckTag : handleSelectItem,\n      renderMenuGroup: renderMenuGroup,\n      renderMenuItem: renderListItem,\n      virtualized: virtualized,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 608,\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: 630,\n        columnNumber: 9\n      }\n    }, locale === null || locale === void 0 ? void 0 : locale.noResultsText);\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils2.mergeRefs)(overlay, speakerRef),\n      autoWidth: menuAutoWidth,\n      className: classes,\n      style: styles,\n      target: triggerRef,\n      onKeyDown: onPickerKeyDown,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 634,\n        columnNumber: 9\n      }\n    }, renderMenu ? renderMenu(menu) : menu, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  var _checkValue = checkValue(),\n    isValid = _checkValue.isValid,\n    itemNode = _checkValue.itemNode;\n  var tagElements = renderMultiValue();\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   * 3.If renderValue returns null or undefined, hasValue is false.\n   */\n  var hasSingleValue = !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue) && !(0, _isNil.default)(itemNode);\n  var hasMultiValue = (0, _isArray.default)(value) && value.length > 0 && (0, _isFunction.default)(renderValue) && !(0, _isNil.default)(tagElements);\n  var hasValue = multi ? !!(tagElements !== null && tagElements !== void 0 && tagElements.length) || hasMultiValue : isValid || hasSingleValue;\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends3.default)({}, props, {\n      classPrefix: classPrefix,\n      appearance: appearance,\n      hasValue: hasValue,\n      name: 'input',\n      cleanable: cleanable\n    })),\n    pickerClasses = _usePickerClassName[0],\n    usedClassNamePropKeys = _usePickerClassName[1];\n  var classes = merge(pickerClasses, (_merge = {}, _merge[prefix(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)([\"tag\"])))] = multi, _merge[prefix((multi ? 'tag' : 'input') + \"-\" + size)] = size, _merge[prefix(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)([\"focused\"])))] = open, _merge[prefix(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)([\"disabled-options\"])))] = disabledOptions, _merge));\n  var searching = !!searchKeyword && open;\n  var editable = searchable && !disabled && !rest.loading;\n  if (plaintext) {\n    var plaintextProps = {};\n\n    // When multiple selection, the tag is displayed in a stack layout.\n    if (multi && hasValue) {\n      plaintextProps.as = _Stack.default;\n      plaintextProps.spacing = 6;\n      plaintextProps.wrap = true;\n      plaintextProps.childrenRenderMode = 'clone';\n    }\n    return /*#__PURE__*/_react.default.createElement(_Plaintext.default, (0, _extends3.default)({\n      localeKey: \"notSelected\",\n      ref: target\n    }, plaintextProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 691,\n        columnNumber: 9\n      }\n    }), itemNode || (tagElements !== null && tagElements !== void 0 && tagElements.length ? tagElements : null) || placeholder);\n  }\n  var placeholderNode = placeholder || (disabledOptions ? null : locale === null || locale === void 0 ? void 0 : locale.placeholder);\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    id: id,\n    multiple: multi,\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: triggerRef,\n    trigger: \"active\",\n    onEnter: (0, _utils2.createChainedFunction)(handleEnter, onEnter),\n    onEntered: onEntered,\n    onExit: (0, _utils2.createChainedFunction)(handleExit, onExit),\n    onExited: (0, _utils2.createChainedFunction)(handleExited, onExited),\n    speaker: renderPopup,\n    placement: placement,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 700,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    onClick: focus,\n    onKeyDown: onPickerKeyDown,\n    ref: root,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 713,\n      columnNumber: 9\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends3.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys)), {\n    appearance: appearance,\n    readOnly: readOnly,\n    plaintext: plaintext,\n    ref: target,\n    as: toggleAs,\n    tabIndex: tabIndex,\n    onClean: handleClean,\n    cleanable: cleanable && !disabled,\n    hasValue: hasValue,\n    active: open,\n    disabled: disabled,\n    placement: placement,\n    inputValue: value,\n    focusItemValue: focusItemValue,\n    caret: !disabledOptions,\n    size: size,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 720,\n      columnNumber: 11\n    }\n  }), searching || multi && hasValue ? null : itemNode || placeholderNode), /*#__PURE__*/_react.default.createElement(_TextBox.default, {\n    showTagList: hasValue && multi,\n    inputRef: inputRef,\n    inputValue: open ? searchKeyword : '',\n    inputProps: inputProps,\n    tags: tagElements,\n    editable: editable,\n    readOnly: readOnly,\n    disabled: disabled,\n    multiple: multi,\n    onBlur: onBlur,\n    onFocus: handleFocus,\n    onChange: handleSearch,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 741,\n      columnNumber: 11\n    }\n  })));\n});\nInputPicker.displayName = 'InputPicker';\nInputPicker.propTypes = (0, _extends3.default)({}, _Picker.listPickerPropTypes, {\n  locale: _propTypes.default.any,\n  appearance: (0, _propTypes2.oneOf)(['default', 'subtle']),\n  cacheData: _propTypes.default.array,\n  menuAutoWidth: _propTypes.default.bool,\n  menuMaxHeight: _propTypes.default.number,\n  searchable: _propTypes.default.bool,\n  creatable: _propTypes.default.bool,\n  groupBy: _propTypes.default.any,\n  sort: _propTypes.default.func,\n  renderMenu: _propTypes.default.func,\n  renderMenuItem: _propTypes.default.func,\n  renderMenuGroup: _propTypes.default.func,\n  onCreate: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  onGroupTitleClick: _propTypes.default.func,\n  onSearch: _propTypes.default.func,\n  virtualized: _propTypes.default.bool,\n  searchBy: _propTypes.default.func\n});\nvar _default = InputPicker;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/InputPicker/InputPicker.tsx?");
 
 /***/ }),
 
@@ -8221,7 +8375,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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends3 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\nvar _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _Checkbox = _interopRequireDefault(__webpack_require__(/*! ../Checkbox */ \"./src/Checkbox/index.tsx\"));\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/MultiCascadeTree/utils.ts\");\nvar _utils3 = __webpack_require__(/*! ../CascadeTree/utils */ \"./src/CascadeTree/utils.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/MultiCascadeTree/SearchView.tsx\";\nfunction SearchView(props) {\n  var _this = this;\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 ? 'cascade-search-view' : _props$classPrefix,\n    className = props.className,\n    searchKeyword = props.searchKeyword,\n    childrenKey = props.childrenKey,\n    labelKey = props.labelKey,\n    valueKey = props.valueKey,\n    value = props.value,\n    data = props.data,\n    disabledItemValues = props.disabledItemValues,\n    inputRef = props.inputRef,\n    cascade = props.cascade,\n    onSearch = props.onSearch,\n    onCheck = props.onCheck,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"className\", \"searchKeyword\", \"childrenKey\", \"labelKey\", \"valueKey\", \"value\", \"data\", \"disabledItemValues\", \"inputRef\", \"cascade\", \"onSearch\", \"onCheck\"]);\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    merge = _useClassNames.merge,\n    prefix = _useClassNames.prefix,\n    withClassPrefix = _useClassNames.withClassPrefix,\n    rootPrefix = _useClassNames.rootPrefix;\n  var classes = merge(className, withClassPrefix());\n  var _useCustom = (0, _utils.useCustom)('Picker'),\n    locale = _useCustom.locale;\n  var renderSearchRow = function renderSearchRow(item, key) {\n    var _extends2;\n    var nodes = (0, _treeUtils.getNodeParents)(item);\n    var label = (0, _utils3.highlightLabel)({\n      item: item,\n      labelKey: labelKey,\n      searchKeyword: searchKeyword,\n      render: function render(patch, index) {\n        return /*#__PURE__*/_react.default.createElement(\"span\", {\n          key: index,\n          className: prefix('match'),\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 54,\n            columnNumber: 9\n          }\n        }, patch);\n      }\n    });\n    nodes.push((0, _extends3.default)({}, item, (_extends2 = {}, _extends2[labelKey] = label, _extends2)));\n    var active = value.some(function (value) {\n      if (cascade) {\n        return nodes.some(function (node) {\n          return node[valueKey] === value;\n        });\n      }\n      return item[valueKey] === value;\n    });\n    var disabled = disabledItemValues.some(function (value) {\n      return nodes.some(function (node) {\n        return node[valueKey] === value;\n      });\n    });\n    var rowClasses = prefix('row', {\n      'row-disabled': disabled\n    });\n    var indeterminate = cascade && !active && (0, _utils2.isSomeChildChecked)(item, value, {\n      valueKey: valueKey,\n      childrenKey: childrenKey\n    });\n    var handleChange = function handleChange(_value, checked, event) {\n      onCheck === null || onCheck === void 0 ? void 0 : onCheck(item, event, checked);\n    };\n    return /*#__PURE__*/_react.default.createElement(\"div\", {\n      role: \"treeitem\",\n      \"aria-disabled\": disabled,\n      key: key,\n      className: rowClasses,\n      \"data-key\": item[valueKey],\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 79,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Checkbox.default, {\n      disabled: disabled,\n      checked: active,\n      value: item[valueKey],\n      indeterminate: indeterminate,\n      onChange: handleChange,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 86,\n        columnNumber: 9\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"span\", {\n      className: prefix('col-group'),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 93,\n        columnNumber: 11\n      }\n    }, nodes.map(function (node, index) {\n      return /*#__PURE__*/_react.default.createElement(\"span\", {\n        key: \"col-\" + index,\n        className: prefix('col'),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 95,\n          columnNumber: 15\n        }\n      }, node[labelKey]);\n    }))));\n  };\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends3.default)({\n    className: classes\n  }, rest, {\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 106,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(_SearchBox.default, {\n    placeholder: locale === null || locale === void 0 ? void 0 : locale.searchPlaceholder,\n    onChange: onSearch,\n    value: searchKeyword,\n    inputRef: inputRef,\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 107,\n      columnNumber: 7\n    }\n  }), searchKeyword !== '' && /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('panel'),\n    \"data-layer\": 0,\n    role: \"tree\",\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 114,\n      columnNumber: 9\n    }\n  }, data.length ? data.map(renderSearchRow) : /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: merge(prefix('none'), rootPrefix('picker-none')),\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 118,\n      columnNumber: 13\n    }\n  }, locale.noResultsText)));\n}\nvar _default = SearchView;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/MultiCascadeTree/SearchView.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends3 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _Checkbox = _interopRequireDefault(__webpack_require__(/*! ../Checkbox */ \"./src/Checkbox/index.tsx\"));\nvar _Highlight = _interopRequireDefault(__webpack_require__(/*! ../Highlight */ \"./src/Highlight/index.tsx\"));\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/MultiCascadeTree/utils.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/MultiCascadeTree/SearchView.tsx\";\nfunction SearchView(props) {\n  var _this = this;\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 ? 'cascade-search-view' : _props$classPrefix,\n    className = props.className,\n    searchKeyword = props.searchKeyword,\n    childrenKey = props.childrenKey,\n    labelKey = props.labelKey,\n    valueKey = props.valueKey,\n    value = props.value,\n    data = props.data,\n    disabledItemValues = props.disabledItemValues,\n    inputRef = props.inputRef,\n    cascade = props.cascade,\n    onSearch = props.onSearch,\n    onCheck = props.onCheck,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"classPrefix\", \"className\", \"searchKeyword\", \"childrenKey\", \"labelKey\", \"valueKey\", \"value\", \"data\", \"disabledItemValues\", \"inputRef\", \"cascade\", \"onSearch\", \"onCheck\"]);\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    merge = _useClassNames.merge,\n    prefix = _useClassNames.prefix,\n    withClassPrefix = _useClassNames.withClassPrefix,\n    rootPrefix = _useClassNames.rootPrefix;\n  var classes = merge(className, withClassPrefix());\n  var _useCustom = (0, _utils.useCustom)('Picker'),\n    locale = _useCustom.locale;\n  var renderSearchRow = function renderSearchRow(item, key) {\n    var _extends2;\n    var nodes = (0, _utils2.getNodeParents)(item);\n    var label = /*#__PURE__*/_react.default.createElement(_Highlight.default, {\n      as: \"span\",\n      query: searchKeyword,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 49,\n        columnNumber: 7\n      }\n    }, item[labelKey]);\n    nodes.push((0, _extends3.default)({}, item, (_extends2 = {}, _extends2[labelKey] = label, _extends2)));\n    var active = value.some(function (value) {\n      if (cascade) {\n        return nodes.some(function (node) {\n          return node[valueKey] === value;\n        });\n      }\n      return item[valueKey] === value;\n    });\n    var disabled = disabledItemValues.some(function (value) {\n      return nodes.some(function (node) {\n        return node[valueKey] === value;\n      });\n    });\n    var rowClasses = prefix('row', {\n      'row-disabled': disabled\n    });\n    var indeterminate = cascade && !active && (0, _utils2.isSomeChildChecked)(item, value, {\n      valueKey: valueKey,\n      childrenKey: childrenKey\n    });\n    var handleChange = function handleChange(_value, checked, event) {\n      onCheck === null || onCheck === void 0 ? void 0 : onCheck(item, event, checked);\n    };\n    return /*#__PURE__*/_react.default.createElement(\"div\", {\n      role: \"treeitem\",\n      \"aria-disabled\": disabled,\n      key: key,\n      className: rowClasses,\n      \"data-key\": item[valueKey],\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 73,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Checkbox.default, {\n      disabled: disabled,\n      checked: active,\n      value: item[valueKey],\n      indeterminate: indeterminate,\n      onChange: handleChange,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 80,\n        columnNumber: 9\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"span\", {\n      className: prefix('col-group'),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 87,\n        columnNumber: 11\n      }\n    }, nodes.map(function (node, index) {\n      return /*#__PURE__*/_react.default.createElement(\"span\", {\n        key: \"col-\" + index,\n        className: prefix('col'),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 89,\n          columnNumber: 15\n        }\n      }, node[labelKey]);\n    }))));\n  };\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends3.default)({\n    className: classes\n  }, rest, {\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 100,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(_SearchBox.default, {\n    placeholder: locale === null || locale === void 0 ? void 0 : locale.searchPlaceholder,\n    onChange: onSearch,\n    value: searchKeyword,\n    inputRef: inputRef,\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 101,\n      columnNumber: 7\n    }\n  }), searchKeyword !== '' && /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('panel'),\n    \"data-layer\": 0,\n    role: \"tree\",\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 108,\n      columnNumber: 9\n    }\n  }, data.length ? data.map(renderSearchRow) : /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: merge(prefix('none'), rootPrefix('picker-none')),\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 112,\n      columnNumber: 13\n    }\n  }, locale.noResultsText)));\n}\nvar _default = SearchView;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/MultiCascadeTree/SearchView.tsx?");
 
 /***/ }),
 
@@ -8254,7 +8408,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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _uniq = _interopRequireDefault(__webpack_require__(/*! lodash/uniq */ \"./node_modules/lodash/uniq.js\"));\nvar _remove = _interopRequireDefault(__webpack_require__(/*! lodash/remove */ \"./node_modules/lodash/remove.js\"));\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/MultiCascadeTree/utils.ts\");\n/**\n * A hook that converts the value into a cascading value\n * @param props\n * @param flattenData\n */\nfunction useCascadeValue(props, flattenData) {\n  var valueKey = props.valueKey,\n    childrenKey = props.childrenKey,\n    uncheckableItemValues = props.uncheckableItemValues,\n    cascade = props.cascade,\n    valueProp = props.value,\n    onChange = props.onChange,\n    onCheck = props.onCheck;\n  /**\n   * Get the values of all children\n   */\n  var getChildrenValue = (0, _react.useCallback)(function (item) {\n    var values = [];\n    if (!item[childrenKey]) {\n      return values;\n    }\n    item[childrenKey].forEach(function (n) {\n      if (uncheckableItemValues && !uncheckableItemValues.some(function (v) {\n        return v === n[valueKey];\n      })) {\n        values.push(n[valueKey]);\n      }\n      values = values.concat(getChildrenValue(n));\n    });\n    return values;\n  }, [childrenKey, uncheckableItemValues, valueKey]);\n  var splitValue = (0, _react.useCallback)(function (item, checked, value) {\n    var itemValue = item[valueKey];\n    var childrenValue = getChildrenValue(item);\n    var parents = (0, _utils2.getParents)(item);\n    var nextValue = [].concat(value);\n    var removedValue = [];\n    if (checked) {\n      nextValue.push(itemValue);\n\n      // Delete all values under the current node\n      removedValue = removedValue.concat((0, _utils2.removeAllChildrenValue)(nextValue, item, {\n        valueKey: valueKey,\n        childrenKey: childrenKey\n      }) || []);\n\n      // Traverse all ancestor nodes of the current node\n      // Then determine whether all the child nodes of these nodes are selected, and then they themselves must be selected\n      var _loop = function _loop(i) {\n        // Whether the parent node can be selected\n        var isCheckableParent = !(uncheckableItemValues !== null && uncheckableItemValues !== void 0 && uncheckableItemValues.some(function (v) {\n          return v === parents[i][valueKey];\n        }));\n        if (isCheckableParent) {\n          var isCheckAll = parents[i][childrenKey]\n          // Filter out options that are marked as not selectable\n          .filter(function (n) {\n            return !(uncheckableItemValues !== null && uncheckableItemValues !== void 0 && uncheckableItemValues.some(function (v) {\n              return v === n[valueKey];\n            }));\n          })\n          // Check if all nodes are selected\n          .every(function (n) {\n            return nextValue.some(function (v) {\n              return v === n[valueKey];\n            });\n          });\n          if (isCheckAll) {\n            // Add parent node value\n            nextValue.push(parents[i][valueKey]);\n\n            // Delete all values under the parent node\n            removedValue = removedValue.concat((0, _utils2.removeAllChildrenValue)(nextValue, parents[i], {\n              valueKey: valueKey,\n              childrenKey: childrenKey\n            }) || []);\n          }\n        }\n      };\n      for (var i = 0; i < parents.length; i++) {\n        _loop(i);\n      }\n    } else {\n      var tempValue = childrenValue.concat(parents.map(function (item) {\n        return item[valueKey];\n      }));\n      nextValue = nextValue.concat((0, _utils2.getOtherItemValuesByUnselectChild)(item, nextValue, {\n        valueKey: valueKey,\n        childrenKey: childrenKey\n      }));\n\n      // Delete related child and parent nodes\n      removedValue = (0, _remove.default)(nextValue, function (v) {\n        // Delete yourself\n        if (v === itemValue) {\n          return true;\n        }\n        return tempValue.some(function (n) {\n          return n === v;\n        });\n      });\n    }\n    var uniqValue = (0, _uniq.default)(nextValue);\n    var uniqRemovedValue = (0, _uniq.default)(removedValue);\n    return {\n      value: uniqValue,\n      removedValue: uniqRemovedValue\n    };\n  }, [valueKey, childrenKey, uncheckableItemValues, getChildrenValue]);\n  var transformValue = (0, _react.useCallback)(function (value) {\n    if (value === void 0) {\n      value = [];\n    }\n    if (!cascade) {\n      return value;\n    }\n    var tempRemovedValue = [];\n    var nextValue = [];\n    var _loop2 = function _loop2(i) {\n      // If the value in the current value is already in the deleted list, it will not be processed\n      if (tempRemovedValue.some(function (v) {\n        return v === value[i];\n      })) {\n        return \"continue\";\n      }\n      var item = flattenData.find(function (v) {\n        return v[valueKey] === value[i];\n      });\n      if (!item) {\n        return \"continue\";\n      }\n      var sv = splitValue(item, true, value);\n      tempRemovedValue = (0, _uniq.default)(tempRemovedValue.concat(sv.removedValue));\n\n      // Get all relevant values\n      nextValue = (0, _uniq.default)(nextValue.concat(sv.value));\n    };\n    for (var i = 0; i < value.length; i++) {\n      var _ret = _loop2(i);\n      if (_ret === \"continue\") continue;\n    }\n\n    // Finally traverse all nextValue, and delete if its parent node is also nextValue\n    return nextValue.filter(function (v) {\n      var item = flattenData.find(function (n) {\n        return n[valueKey] === v;\n      });\n      if (item !== null && item !== void 0 && item.parent && nextValue.some(function (v) {\n        var _item$parent;\n        return v === ((_item$parent = item.parent) === null || _item$parent === void 0 ? void 0 : _item$parent[valueKey]);\n      })) {\n        return false;\n      }\n      return true;\n    });\n  }, [cascade, flattenData, splitValue, valueKey]);\n  var _useState = (0, _react.useState)(transformValue(valueProp) || []),\n    value = _useState[0],\n    setValue = _useState[1];\n  (0, _react.useEffect)(function () {\n    // Update value when valueProp is updated.\n    setValue(transformValue(valueProp) || []);\n  }, [transformValue, valueProp]);\n  var handleCheck = (0, _utils.useEventCallback)(function (node, event, checked) {\n    var nodeValue = node[valueKey];\n    var nextValue = [];\n    if (cascade) {\n      nextValue = splitValue(node, checked, value).value;\n    } else {\n      nextValue = [].concat(value);\n      if (checked) {\n        nextValue.push(nodeValue);\n      } else {\n        nextValue = nextValue.filter(function (n) {\n          return n !== nodeValue;\n        });\n      }\n    }\n    setValue(nextValue);\n    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n    onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextValue, node, checked, event);\n  });\n  return {\n    value: value,\n    setValue: setValue,\n    splitValue: splitValue,\n    handleCheck: handleCheck\n  };\n}\nvar _default = useCascadeValue;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/MultiCascadeTree/hooks/useCascadeValue.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _uniq = _interopRequireDefault(__webpack_require__(/*! lodash/uniq */ \"./node_modules/lodash/uniq.js\"));\nvar _remove = _interopRequireDefault(__webpack_require__(/*! lodash/remove */ \"./node_modules/lodash/remove.js\"));\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/MultiCascadeTree/utils.ts\");\n/**\n * Get all parents of a node\n * @param node\n */\nvar getParents = function getParents(node) {\n  var parents = [];\n  if (!node.parent) {\n    return parents;\n  }\n  parents.push(node.parent);\n  parents = parents.concat(getParents(node.parent));\n  return parents;\n};\n\n/**\n * A hook that converts the value into a cascading value\n * @param props\n * @param flattenData\n */\nfunction useCascadeValue(props, flattenData) {\n  var valueKey = props.valueKey,\n    childrenKey = props.childrenKey,\n    uncheckableItemValues = props.uncheckableItemValues,\n    cascade = props.cascade,\n    valueProp = props.value,\n    onChange = props.onChange,\n    onCheck = props.onCheck;\n  /**\n   * Get the values of all children\n   */\n  var getChildrenValue = (0, _react.useCallback)(function (item) {\n    var values = [];\n    if (!item[childrenKey]) {\n      return values;\n    }\n    item[childrenKey].forEach(function (n) {\n      if (uncheckableItemValues && !uncheckableItemValues.some(function (v) {\n        return v === n[valueKey];\n      })) {\n        values.push(n[valueKey]);\n      }\n      values = values.concat(getChildrenValue(n));\n    });\n    return values;\n  }, [childrenKey, uncheckableItemValues, valueKey]);\n  var splitValue = (0, _react.useCallback)(function (item, checked, value) {\n    var itemValue = item[valueKey];\n    var childrenValue = getChildrenValue(item);\n    var parents = getParents(item);\n    var nextValue = [].concat(value);\n    var removedValue = [];\n    if (checked) {\n      nextValue.push(itemValue);\n\n      // Delete all values under the current node\n      removedValue = removedValue.concat((0, _utils2.removeAllChildrenValue)(nextValue, item, {\n        valueKey: valueKey,\n        childrenKey: childrenKey\n      }) || []);\n\n      // Traverse all ancestor nodes of the current node\n      // Then determine whether all the child nodes of these nodes are selected, and then they themselves must be selected\n      var _loop = function _loop(i) {\n        // Whether the parent node can be selected\n        var isCheckableParent = !(uncheckableItemValues !== null && uncheckableItemValues !== void 0 && uncheckableItemValues.some(function (v) {\n          return v === parents[i][valueKey];\n        }));\n        if (isCheckableParent) {\n          var isCheckAll = parents[i][childrenKey]\n          // Filter out options that are marked as not selectable\n          .filter(function (n) {\n            return !(uncheckableItemValues !== null && uncheckableItemValues !== void 0 && uncheckableItemValues.some(function (v) {\n              return v === n[valueKey];\n            }));\n          })\n          // Check if all nodes are selected\n          .every(function (n) {\n            return nextValue.some(function (v) {\n              return v === n[valueKey];\n            });\n          });\n          if (isCheckAll) {\n            // Add parent node value\n            nextValue.push(parents[i][valueKey]);\n\n            // Delete all values under the parent node\n            removedValue = removedValue.concat((0, _utils2.removeAllChildrenValue)(nextValue, parents[i], {\n              valueKey: valueKey,\n              childrenKey: childrenKey\n            }) || []);\n          }\n        }\n      };\n      for (var i = 0; i < parents.length; i++) {\n        _loop(i);\n      }\n    } else {\n      var tempValue = childrenValue.concat(parents.map(function (item) {\n        return item[valueKey];\n      }));\n      nextValue = nextValue.concat((0, _utils2.getOtherItemValuesByUnselectChild)(item, nextValue, {\n        valueKey: valueKey,\n        childrenKey: childrenKey\n      }));\n\n      // Delete related child and parent nodes\n      removedValue = (0, _remove.default)(nextValue, function (v) {\n        // Delete yourself\n        if (v === itemValue) {\n          return true;\n        }\n        return tempValue.some(function (n) {\n          return n === v;\n        });\n      });\n    }\n    var uniqValue = (0, _uniq.default)(nextValue);\n    var uniqRemovedValue = (0, _uniq.default)(removedValue);\n    return {\n      value: uniqValue,\n      removedValue: uniqRemovedValue\n    };\n  }, [valueKey, childrenKey, uncheckableItemValues, getChildrenValue]);\n  var transformValue = (0, _react.useCallback)(function (value) {\n    if (value === void 0) {\n      value = [];\n    }\n    if (!cascade) {\n      return value;\n    }\n    var tempRemovedValue = [];\n    var nextValue = [];\n    var _loop2 = function _loop2(i) {\n      // If the value in the current value is already in the deleted list, it will not be processed\n      if (tempRemovedValue.some(function (v) {\n        return v === value[i];\n      })) {\n        return \"continue\";\n      }\n      var item = flattenData.find(function (v) {\n        return v[valueKey] === value[i];\n      });\n      if (!item) {\n        return \"continue\";\n      }\n      var sv = splitValue(item, true, value);\n      tempRemovedValue = (0, _uniq.default)(tempRemovedValue.concat(sv.removedValue));\n\n      // Get all relevant values\n      nextValue = (0, _uniq.default)(nextValue.concat(sv.value));\n    };\n    for (var i = 0; i < value.length; i++) {\n      var _ret = _loop2(i);\n      if (_ret === \"continue\") continue;\n    }\n\n    // Finally traverse all nextValue, and delete if its parent node is also nextValue\n    return nextValue.filter(function (v) {\n      var item = flattenData.find(function (n) {\n        return n[valueKey] === v;\n      });\n      if (item !== null && item !== void 0 && item.parent && nextValue.some(function (v) {\n        var _item$parent;\n        return v === ((_item$parent = item.parent) === null || _item$parent === void 0 ? void 0 : _item$parent[valueKey]);\n      })) {\n        return false;\n      }\n      return true;\n    });\n  }, [cascade, flattenData, splitValue, valueKey]);\n  var _useState = (0, _react.useState)(transformValue(valueProp) || []),\n    value = _useState[0],\n    setValue = _useState[1];\n  (0, _react.useEffect)(function () {\n    // Update value when valueProp is updated.\n    setValue(transformValue(valueProp) || []);\n  }, [transformValue, valueProp]);\n  var handleCheck = (0, _utils.useEventCallback)(function (node, event, checked) {\n    var nodeValue = node[valueKey];\n    var nextValue = [];\n    if (cascade) {\n      nextValue = splitValue(node, checked, value).value;\n    } else {\n      nextValue = [].concat(value);\n      if (checked) {\n        nextValue.push(nodeValue);\n      } else {\n        nextValue = nextValue.filter(function (n) {\n          return n !== nodeValue;\n        });\n      }\n    }\n    setValue(nextValue);\n    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n    onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextValue, node, checked, event);\n  });\n  return {\n    value: value,\n    setValue: setValue,\n    splitValue: splitValue,\n    handleCheck: handleCheck\n  };\n}\nvar _default = useCascadeValue;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/MultiCascadeTree/hooks/useCascadeValue.ts?");
 
 /***/ }),
 
@@ -8265,7 +8419,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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _slice = _interopRequireDefault(__webpack_require__(/*! lodash/slice */ \"./node_modules/lodash/slice.js\"));\nvar _treeUtils = __webpack_require__(/*! ../../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\n/**\n * A hook for column data\n * @param flattenData\n */\nfunction useColumnData(flattenData) {\n  // The columns displayed in the cascading panel.\n  var _useState = (0, _react.useState)([flattenData.filter(function (item) {\n      return !item.parent;\n    })]),\n    columnData = _useState[0],\n    setColumnData = _useState[1];\n  /**\n   * Add a list of options to the cascading panel. Used for lazy loading options.\n   * @param column\n   * @param index The index of the current column.\n   */\n  function addColumn(column, index) {\n    setColumnData([].concat((0, _slice.default)(columnData, 0, index), [column]));\n  }\n\n  /**\n   * Remove subsequent columns of the specified column\n   * @param index\n   */\n  function removeColumnByIndex(index) {\n    setColumnData([].concat((0, _slice.default)(columnData, 0, index)));\n  }\n  function enforceUpdateColumnData(nextData) {\n    var nextFlattenData = (0, _treeUtils.UNSAFE_flattenTree)(nextData);\n    setColumnData([nextFlattenData.filter(function (item) {\n      return !item.parent;\n    })]);\n  }\n  return {\n    columnData: columnData,\n    addColumn: addColumn,\n    removeColumnByIndex: removeColumnByIndex,\n    setColumnData: setColumnData,\n    enforceUpdateColumnData: enforceUpdateColumnData\n  };\n}\nvar _default = useColumnData;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/MultiCascadeTree/hooks/useColumnData.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _slice = _interopRequireDefault(__webpack_require__(/*! lodash/slice */ \"./node_modules/lodash/slice.js\"));\nvar _utils = __webpack_require__(/*! ../../Tree/utils */ \"./src/Tree/utils/index.ts\");\n/**\n * A hook for column data\n * @param flattenData\n */\nfunction useColumnData(flattenData) {\n  // The columns displayed in the cascading panel.\n  var _useState = (0, _react.useState)([flattenData.filter(function (item) {\n      return !item.parent;\n    })]),\n    columnData = _useState[0],\n    setColumnData = _useState[1];\n  /**\n   * Add a list of options to the cascading panel. Used for lazy loading options.\n   * @param column\n   * @param index The index of the current column.\n   */\n  function addColumn(column, index) {\n    setColumnData([].concat((0, _slice.default)(columnData, 0, index), [column]));\n  }\n\n  /**\n   * Remove subsequent columns of the specified column\n   * @param index\n   */\n  function removeColumnByIndex(index) {\n    setColumnData([].concat((0, _slice.default)(columnData, 0, index)));\n  }\n  function enforceUpdateColumnData(nextData) {\n    var nextFlattenData = (0, _utils.UNSAFE_flattenTree)(nextData);\n    setColumnData([nextFlattenData.filter(function (item) {\n      return !item.parent;\n    })]);\n  }\n  return {\n    columnData: columnData,\n    addColumn: addColumn,\n    removeColumnByIndex: removeColumnByIndex,\n    setColumnData: setColumnData,\n    enforceUpdateColumnData: enforceUpdateColumnData\n  };\n}\nvar _default = useColumnData;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/MultiCascadeTree/hooks/useColumnData.ts?");
 
 /***/ }),
 
@@ -8276,7 +8430,7 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _treeUtils = __webpack_require__(/*! ../../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\nvar _attachParent = __webpack_require__(/*! ../../utils/attachParent */ \"./src/utils/attachParent.ts\");\n/**\n * A hook to flatten tree structure data\n */\nfunction useFlattenData(data, itemKeys) {\n  var childrenKey = itemKeys.childrenKey;\n  var _useState = (0, _react.useState)((0, _treeUtils.UNSAFE_flattenTree)(data, itemKeys.childrenKey)),\n    flattenData = _useState[0],\n    setFlattenData = _useState[1];\n  var addFlattenData = (0, _react.useCallback)(function (children, parent) {\n    var nodes = children.map(function (child) {\n      return (0, _attachParent.attachParent)(child, parent);\n    });\n    parent[childrenKey] = nodes;\n    setFlattenData([].concat(flattenData, nodes));\n  }, [childrenKey, flattenData]);\n  (0, _react.useEffect)(function () {\n    setFlattenData((0, _treeUtils.UNSAFE_flattenTree)(data, itemKeys.childrenKey));\n  }, [data, itemKeys.childrenKey]);\n  return {\n    addFlattenData: addFlattenData,\n    flattenData: flattenData\n  };\n}\nvar _default = useFlattenData;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/MultiCascadeTree/hooks/useFlattenData.ts?");
+eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _utils = __webpack_require__(/*! ../../Tree/utils */ \"./src/Tree/utils/index.ts\");\nvar _attachParent = __webpack_require__(/*! ../../utils/attachParent */ \"./src/utils/attachParent.ts\");\n/**\n * A hook to flatten tree structure data\n */\nfunction useFlattenData(data, itemKeys) {\n  var childrenKey = itemKeys.childrenKey;\n  var _useState = (0, _react.useState)((0, _utils.UNSAFE_flattenTree)(data, itemKeys.childrenKey)),\n    flattenData = _useState[0],\n    setFlattenData = _useState[1];\n  var addFlattenData = (0, _react.useCallback)(function (children, parent) {\n    var nodes = children.map(function (child) {\n      return (0, _attachParent.attachParent)(child, parent);\n    });\n    parent[childrenKey] = nodes;\n    setFlattenData([].concat(flattenData, nodes));\n  }, [childrenKey, flattenData]);\n  (0, _react.useEffect)(function () {\n    setFlattenData((0, _utils.UNSAFE_flattenTree)(data, itemKeys.childrenKey));\n  }, [data, itemKeys.childrenKey]);\n  return {\n    addFlattenData: addFlattenData,\n    flattenData: flattenData\n  };\n}\nvar _default = useFlattenData;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/MultiCascadeTree/hooks/useFlattenData.ts?");
 
 /***/ }),
 
@@ -8287,7 +8441,7 @@ eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nfunction useSearch(props) {\n  var _useState = (0, _react.useState)(''),\n    searchKeyword = _useState[0],\n    setSearchKeyword = _useState[1];\n  var labelKey = props.labelKey,\n    valueKey = props.valueKey,\n    flattenedData = props.flattenedData,\n    uncheckableItemValues = props.uncheckableItemValues,\n    onSearch = props.onSearch;\n  var getSearchResult = function getSearchResult() {\n    var items = [];\n    var result = flattenedData.filter(function (item) {\n      if (uncheckableItemValues !== null && uncheckableItemValues !== void 0 && uncheckableItemValues.some(function (value) {\n        return item[valueKey] === value;\n      })) {\n        return false;\n      }\n      if (item[labelKey].match(new RegExp((0, _utils.getSafeRegExpString)(searchKeyword), 'i'))) {\n        return true;\n      }\n      return false;\n    });\n    for (var i = 0; i < result.length; i++) {\n      items.push(result[i]);\n\n      // A maximum of 100 search results are returned.\n      if (i === 99) {\n        return items;\n      }\n    }\n    return items;\n  };\n  var handleSearch = (0, _utils.useEventCallback)(function (value, event) {\n    setSearchKeyword(value);\n    onSearch === null || onSearch === void 0 ? void 0 : onSearch(value, event);\n  });\n  return {\n    searchKeyword: searchKeyword,\n    setSearchKeyword: setSearchKeyword,\n    items: getSearchResult(),\n    handleSearch: handleSearch\n  };\n}\nvar _default = useSearch;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/MultiCascadeTree/hooks/useSearch.ts?");
+eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../../internals/utils */ \"./src/internals/utils/index.ts\");\nfunction useSearch(props) {\n  var _useState = (0, _react.useState)(''),\n    searchKeyword = _useState[0],\n    setSearchKeyword = _useState[1];\n  var labelKey = props.labelKey,\n    valueKey = props.valueKey,\n    flattenedData = props.flattenedData,\n    uncheckableItemValues = props.uncheckableItemValues,\n    onSearch = props.onSearch;\n  var getSearchResult = function getSearchResult() {\n    var items = [];\n    var result = flattenedData.filter(function (item) {\n      if (uncheckableItemValues !== null && uncheckableItemValues !== void 0 && uncheckableItemValues.some(function (value) {\n        return item[valueKey] === value;\n      })) {\n        return false;\n      }\n      if (item[labelKey].match(new RegExp((0, _utils2.getSafeRegExpString)(searchKeyword), 'i'))) {\n        return true;\n      }\n      return false;\n    });\n    for (var i = 0; i < result.length; i++) {\n      items.push(result[i]);\n\n      // A maximum of 100 search results are returned.\n      if (i === 99) {\n        return items;\n      }\n    }\n    return items;\n  };\n  var handleSearch = (0, _utils.useEventCallback)(function (value, event) {\n    setSearchKeyword(value);\n    onSearch === null || onSearch === void 0 ? void 0 : onSearch(value, event);\n  });\n  return {\n    searchKeyword: searchKeyword,\n    setSearchKeyword: setSearchKeyword,\n    items: getSearchResult(),\n    handleSearch: handleSearch\n  };\n}\nvar _default = useSearch;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/MultiCascadeTree/hooks/useSearch.ts?");
 
 /***/ }),
 
@@ -8320,7 +8474,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\");\nexports.__esModule = true;\nexports.removeAllChildrenValue = exports.getOtherItemValuesByUnselectChild = exports.isSomeParentChecked = exports.isSomeChildChecked = exports.getParents = void 0;\nvar _remove = _interopRequireDefault(__webpack_require__(/*! lodash/remove */ \"./node_modules/lodash/remove.js\"));\n/**\n * Get all parents of a node\n * @param node\n */\nvar getParents = function getParents(node) {\n  var parents = [];\n  if (!node.parent) {\n    return parents;\n  }\n  parents.push(node.parent);\n  parents = parents.concat(getParents(node.parent));\n  return parents;\n};\n\n/**\n * Check if any child nodes are selected.\n * @param node\n * @param value\n * @param itemKeys\n */\nexports.getParents = getParents;\nvar isSomeChildChecked = function isSomeChildChecked(node, value, itemKeys) {\n  var childrenKey = itemKeys.childrenKey,\n    valueKey = itemKeys.valueKey;\n  if (!node[childrenKey] || !value) {\n    return false;\n  }\n  return node[childrenKey].some(function (child) {\n    var _child$childrenKey;\n    if (value.some(function (n) {\n      return n === child[valueKey];\n    })) {\n      return true;\n    }\n    if ((_child$childrenKey = child[childrenKey]) !== null && _child$childrenKey !== void 0 && _child$childrenKey.length) {\n      return isSomeChildChecked(child, value, itemKeys);\n    }\n    return false;\n  });\n};\n\n/**\n * Check if the parent is selected.\n * @param node\n * @param value\n * @param itemKeys\n */\nexports.isSomeChildChecked = isSomeChildChecked;\nvar isSomeParentChecked = function isSomeParentChecked(node, value, itemKeys) {\n  var valueKey = itemKeys.valueKey;\n  if (!value) {\n    return false;\n  }\n  if (value.some(function (n) {\n    return n === node[valueKey];\n  })) {\n    return true;\n  }\n  if (node.parent) {\n    return isSomeParentChecked(node.parent, value, itemKeys);\n  }\n  return false;\n};\nexports.isSomeParentChecked = isSomeParentChecked;\nvar getOtherItemValuesByUnselectChild = function getOtherItemValuesByUnselectChild(itemNode, value, itemKeys) {\n  var valueKey = itemKeys.valueKey,\n    childrenKey = itemKeys.childrenKey;\n  var parentValues = [];\n  var itemValues = [];\n\n  // Find the parent node of the current node by value\n  function findParent(item) {\n    parentValues.push(item[valueKey]);\n    if (value.some(function (v) {\n      return v === item[valueKey];\n    })) {\n      return item;\n    }\n    if (item.parent) {\n      var p = findParent(item.parent);\n      if (p) {\n        return p;\n      }\n    }\n    return null;\n  }\n\n  // Get child nodes through parent node\n  function pushChildValue(item) {\n    if (!item[childrenKey]) {\n      return;\n    }\n    item[childrenKey].forEach(function (n) {\n      // Determine whether it is a direct parent\n      if (parentValues.some(function (v) {\n        return v === n[valueKey];\n      }) && n[childrenKey]) {\n        pushChildValue(n);\n      } else if (n[valueKey] !== itemNode[valueKey]) {\n        itemValues.push(n[valueKey]);\n      }\n    });\n  }\n  var parent = findParent(itemNode);\n  if (!parent) {\n    return [];\n  }\n  pushChildValue(parent);\n  return itemValues;\n};\n\n/**\n * Remove the values of all children.\n */\nexports.getOtherItemValuesByUnselectChild = getOtherItemValuesByUnselectChild;\nvar removeAllChildrenValue = function removeAllChildrenValue(value, item, itemKeys) {\n  var valueKey = itemKeys.valueKey,\n    childrenKey = itemKeys.childrenKey;\n  var removedValue = [];\n  if (!item[childrenKey]) {\n    return;\n  }\n  item[childrenKey].forEach(function (n) {\n    removedValue = removedValue.concat((0, _remove.default)(value, function (v) {\n      return v === n[valueKey];\n    }));\n    if (n[childrenKey]) {\n      removeAllChildrenValue(value, n, itemKeys);\n    }\n  });\n  return removedValue;\n};\nexports.removeAllChildrenValue = removeAllChildrenValue;\n\n//# sourceURL=webpack://rsuite/./src/MultiCascadeTree/utils.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports.getNodeParents = getNodeParents;\nexports.removeAllChildrenValue = exports.getOtherItemValuesByUnselectChild = exports.isSomeParentChecked = exports.isSomeChildChecked = void 0;\nvar _remove = _interopRequireDefault(__webpack_require__(/*! lodash/remove */ \"./node_modules/lodash/remove.js\"));\n/**\n * get all ancestor nodes of given node\n * @param {*} node\n */\nfunction getNodeParents(node, parentKey, valueKey) {\n  if (parentKey === void 0) {\n    parentKey = 'parent';\n  }\n  var parents = [];\n  var traverse = function traverse(node) {\n    if (node !== null && node !== void 0 && node[parentKey]) {\n      traverse(node[parentKey]);\n      if (valueKey) {\n        parents.push(node[parentKey][valueKey]);\n      } else {\n        parents.push(node[parentKey]);\n      }\n    }\n  };\n  traverse(node);\n  return parents;\n}\n\n/**\n * Check if any child nodes are selected.\n * @param node\n * @param value\n * @param itemKeys\n */\nvar isSomeChildChecked = function isSomeChildChecked(node, value, itemKeys) {\n  var childrenKey = itemKeys.childrenKey,\n    valueKey = itemKeys.valueKey;\n  if (!node[childrenKey] || !value) {\n    return false;\n  }\n  return node[childrenKey].some(function (child) {\n    var _child$childrenKey;\n    if (value.some(function (n) {\n      return n === child[valueKey];\n    })) {\n      return true;\n    }\n    if ((_child$childrenKey = child[childrenKey]) !== null && _child$childrenKey !== void 0 && _child$childrenKey.length) {\n      return isSomeChildChecked(child, value, itemKeys);\n    }\n    return false;\n  });\n};\n\n/**\n * Check if the parent is selected.\n * @param node\n * @param value\n * @param itemKeys\n */\nexports.isSomeChildChecked = isSomeChildChecked;\nvar isSomeParentChecked = function isSomeParentChecked(node, value, itemKeys) {\n  var valueKey = itemKeys.valueKey;\n  if (!value) {\n    return false;\n  }\n  if (value.some(function (n) {\n    return n === node[valueKey];\n  })) {\n    return true;\n  }\n  if (node.parent) {\n    return isSomeParentChecked(node.parent, value, itemKeys);\n  }\n  return false;\n};\nexports.isSomeParentChecked = isSomeParentChecked;\nvar getOtherItemValuesByUnselectChild = function getOtherItemValuesByUnselectChild(itemNode, value, itemKeys) {\n  var valueKey = itemKeys.valueKey,\n    childrenKey = itemKeys.childrenKey;\n  var parentValues = [];\n  var itemValues = [];\n\n  // Find the parent node of the current node by value\n  function findParent(item) {\n    parentValues.push(item[valueKey]);\n    if (value.some(function (v) {\n      return v === item[valueKey];\n    })) {\n      return item;\n    }\n    if (item.parent) {\n      var p = findParent(item.parent);\n      if (p) {\n        return p;\n      }\n    }\n    return null;\n  }\n\n  // Get child nodes through parent node\n  function pushChildValue(item) {\n    if (!item[childrenKey]) {\n      return;\n    }\n    item[childrenKey].forEach(function (n) {\n      // Determine whether it is a direct parent\n      if (parentValues.some(function (v) {\n        return v === n[valueKey];\n      }) && n[childrenKey]) {\n        pushChildValue(n);\n      } else if (n[valueKey] !== itemNode[valueKey]) {\n        itemValues.push(n[valueKey]);\n      }\n    });\n  }\n  var parent = findParent(itemNode);\n  if (!parent) {\n    return [];\n  }\n  pushChildValue(parent);\n  return itemValues;\n};\n\n/**\n * Remove the values of all children.\n */\nexports.getOtherItemValuesByUnselectChild = getOtherItemValuesByUnselectChild;\nvar removeAllChildrenValue = function removeAllChildrenValue(value, item, itemKeys) {\n  var valueKey = itemKeys.valueKey,\n    childrenKey = itemKeys.childrenKey;\n  var removedValue = [];\n  if (!item[childrenKey]) {\n    return;\n  }\n  item[childrenKey].forEach(function (n) {\n    removedValue = removedValue.concat((0, _remove.default)(value, function (v) {\n      return v === n[valueKey];\n    }));\n    if (n[childrenKey]) {\n      removeAllChildrenValue(value, n, itemKeys);\n    }\n  });\n  return removedValue;\n};\nexports.removeAllChildrenValue = removeAllChildrenValue;\n\n//# sourceURL=webpack://rsuite/./src/MultiCascadeTree/utils.ts?");
 
 /***/ }),
 
@@ -8331,7 +8485,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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\nvar _utils = __webpack_require__(/*! ../CascadeTree/utils */ \"./src/CascadeTree/utils.ts\");\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _hooks = __webpack_require__(/*! ../MultiCascadeTree/hooks */ \"./src/MultiCascadeTree/hooks/index.ts\");\nvar _TreeView = _interopRequireDefault(__webpack_require__(/*! ../MultiCascadeTree/TreeView */ \"./src/MultiCascadeTree/TreeView.tsx\"));\nvar _SearchView = _interopRequireDefault(__webpack_require__(/*! ../MultiCascadeTree/SearchView */ \"./src/MultiCascadeTree/SearchView.tsx\"));\nvar _useActive2 = _interopRequireDefault(__webpack_require__(/*! ../Cascader/useActive */ \"./src/Cascader/useActive.ts\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/MultiCascader/MultiCascader.tsx\",\n  _this = void 0;\nvar emptyArray = [];\n\n/**\n * The `MultiCascader` component is used to select multiple values from cascading options.\n * @see https://rsuitejs.com/components/multi-cascader/\n */\nvar MultiCascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _selectedPaths;\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    defaultValue = props.defaultValue,\n    columnHeight = props.columnHeight,\n    columnWidth = props.columnWidth,\n    _props$childrenKey = props.childrenKey,\n    childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,\n    _props$cleanable = props.cleanable,\n    cleanable = _props$cleanable === void 0 ? true : _props$cleanable,\n    _props$data = props.data,\n    data = _props$data === void 0 ? emptyArray : _props$data,\n    disabled = props.disabled,\n    _props$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,\n    valueProp = props.value,\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    overrideLocale = props.locale,\n    toggleAs = props.toggleAs,\n    style = props.style,\n    _props$countable = props.countable,\n    countable = _props$countable === void 0 ? true : _props$countable,\n    _props$cascade = props.cascade,\n    cascade = _props$cascade === void 0 ? true : _props$cascade,\n    placeholder = props.placeholder,\n    _props$placement = props.placement,\n    placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n    popupClassName = props.popupClassName,\n    popupStyle = props.popupStyle,\n    _props$searchable = props.searchable,\n    searchable = _props$searchable === void 0 ? true : _props$searchable,\n    _props$uncheckableIte = props.uncheckableItemValues,\n    uncheckableItemValues = _props$uncheckableIte === void 0 ? emptyArray : _props$uncheckableIte,\n    id = props.id,\n    getChildren = props.getChildren,\n    renderValue = props.renderValue,\n    renderExtraFooter = props.renderExtraFooter,\n    renderColumn = props.renderColumn,\n    renderTreeNode = props.renderTreeNode,\n    onEntered = props.onEntered,\n    onExited = props.onExited,\n    onClean = props.onClean,\n    onSearch = props.onSearch,\n    onSelect = props.onSelect,\n    onChange = props.onChange,\n    onCheck = props.onCheck,\n    DEPRECATED_menuClassName = props.menuClassName,\n    DEPRECATED_menuStyle = props.menuStyle,\n    DEPRECATED_menuWidth = props.menuWidth,\n    DEPRECATED_menuHeight = props.menuHeight,\n    DEPRECATED_renderMenu = props.renderMenu,\n    DEPRECATED_renderMenuItem = props.renderMenuItem,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"appearance\", \"classPrefix\", \"defaultValue\", \"columnHeight\", \"columnWidth\", \"childrenKey\", \"cleanable\", \"data\", \"disabled\", \"disabledItemValues\", \"value\", \"valueKey\", \"labelKey\", \"locale\", \"toggleAs\", \"style\", \"countable\", \"cascade\", \"placeholder\", \"placement\", \"popupClassName\", \"popupStyle\", \"searchable\", \"uncheckableItemValues\", \"id\", \"getChildren\", \"renderValue\", \"renderExtraFooter\", \"renderColumn\", \"renderTreeNode\", \"onEntered\", \"onExited\", \"onClean\", \"onSearch\", \"onSelect\", \"onChange\", \"onCheck\", \"menuClassName\", \"menuStyle\", \"menuWidth\", \"menuHeight\", \"renderMenu\", \"renderMenuItem\"]);\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay,\n    searchInput = _usePickerRef.searchInput;\n  var _useCustom = (0, _utils2.useCustom)('Picker', overrideLocale),\n    locale = _useCustom.locale,\n    rtl = _useCustom.rtl;\n  var _useClassNames = (0, _utils2.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge;\n  var onSelectCallback = (0, _react.useCallback)(function (node, cascadePaths, event) {\n    var _trigger$current, _trigger$current$upda;\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(node, cascadePaths, event);\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : (_trigger$current$upda = _trigger$current.updatePosition) === null || _trigger$current$upda === void 0 ? void 0 : _trigger$current$upda.call(_trigger$current);\n  }, [onSelect, trigger]);\n  var _useSelect = (0, _hooks.useSelect)({\n      data: data,\n      childrenKey: childrenKey,\n      labelKey: labelKey,\n      valueKey: valueKey,\n      onSelect: onSelectCallback,\n      getChildren: getChildren\n    }),\n    selectedPaths = _useSelect.selectedPaths,\n    flattenData = _useSelect.flattenData,\n    columnData = _useSelect.columnData,\n    setColumnData = _useSelect.setColumnData,\n    setSelectedPaths = _useSelect.setSelectedPaths,\n    handleSelect = _useSelect.handleSelect;\n  var _useControlled = (0, _utils2.useControlled)(valueProp, defaultValue),\n    controlledValue = _useControlled[0];\n  var itemKeys = {\n    childrenKey: childrenKey,\n    labelKey: labelKey,\n    valueKey: valueKey\n  };\n  var cascadeValueProps = (0, _extends2.default)({}, itemKeys, {\n    uncheckableItemValues: uncheckableItemValues,\n    cascade: cascade,\n    value: controlledValue,\n    onCheck: onCheck,\n    onChange: onChange\n  });\n  var _useCascadeValue = (0, _hooks.useCascadeValue)(cascadeValueProps, flattenData),\n    value = _useCascadeValue.value,\n    setValue = _useCascadeValue.setValue,\n    handleCheck = _useCascadeValue.handleCheck;\n  var selectedItems = flattenData.filter(function (item) {\n    return value.some(function (v) {\n      return v === item[valueKey];\n    });\n  }) || [];\n  var onFocusItemCallback = (0, _react.useCallback)(function (value) {\n    var _getColumnsAndPaths = (0, _utils.getColumnsAndPaths)(data, flattenData.find(function (item) {\n        return item[valueKey] === value;\n      }), {\n        getParent: function getParent() {\n          return undefined;\n        },\n        getChildren: function getChildren(item) {\n          return item[childrenKey];\n        }\n      }),\n      columns = _getColumnsAndPaths.columns,\n      path = _getColumnsAndPaths.path;\n    setColumnData(columns);\n    setSelectedPaths(path);\n  }, [childrenKey, data, flattenData, setColumnData, setSelectedPaths, valueKey]);\n\n  // Used to hover the focuse item  when trigger `onKeydown`\n  var _useFocusItemValue = (0, _Picker.useFocusItemValue)(selectedPaths === null || selectedPaths === void 0 ? void 0 : (_selectedPaths = selectedPaths[selectedPaths.length - 1]) === null || _selectedPaths === void 0 ? void 0 : _selectedPaths[valueKey], {\n      rtl: rtl,\n      data: flattenData,\n      valueKey: valueKey,\n      defaultLayer: selectedPaths !== null && selectedPaths !== void 0 && selectedPaths.length ? selectedPaths.length - 1 : 0,\n      target: function target() {\n        return overlay.current;\n      },\n      callback: onFocusItemCallback\n    }),\n    focusItemValue = _useFocusItemValue.focusItemValue,\n    setLayer = _useFocusItemValue.setLayer,\n    setKeys = _useFocusItemValue.setKeys,\n    onFocusItem = _useFocusItemValue.onKeyDown;\n  var onSearchCallback = function onSearchCallback(value, event) {\n    if (value) {\n      setLayer(0);\n    } else if (selectedPaths !== null && selectedPaths !== void 0 && selectedPaths.length) {\n      setLayer(selectedPaths.length - 1);\n    }\n    setKeys([]);\n    onSearch === null || onSearch === void 0 ? void 0 : onSearch(value, event);\n  };\n  var _useSearch = (0, _hooks.useSearch)({\n      labelKey: labelKey,\n      valueKey: valueKey,\n      childrenKey: childrenKey,\n      flattenedData: flattenData,\n      uncheckableItemValues: uncheckableItemValues,\n      onSearch: onSearchCallback\n    }),\n    items = _useSearch.items,\n    searchKeyword = _useSearch.searchKeyword,\n    setSearchKeyword = _useSearch.setSearchKeyword,\n    handleSearch = _useSearch.handleSearch;\n  var _useActive = (0, _useActive2.default)({\n      onEntered: onEntered,\n      onExited: onExited,\n      target: target,\n      setSearchKeyword: setSearchKeyword\n    }),\n    active = _useActive.active,\n    handleEntered = _useActive.handleEntered,\n    handleExited = _useActive.handleExited;\n  var handleClean = (0, _utils2.useEventCallback)(function (event) {\n    if (disabled || !target.current) {\n      return;\n    }\n    setSelectedPaths([]);\n    setValue([]);\n    setColumnData([data]);\n    onChange === null || onChange === void 0 ? void 0 : onChange([], event);\n  });\n  var handleMenuPressEnter = (0, _utils2.useEventCallback)(function (event) {\n    var _overlay$current;\n    var focusItem = (0, _treeUtils.findNodeOfTree)(data, function (item) {\n      return item[valueKey] === focusItemValue;\n    });\n    var checkbox = (_overlay$current = overlay.current) === null || _overlay$current === void 0 ? void 0 : _overlay$current.querySelector(\"[data-key=\\\"\" + focusItemValue + \"\\\"] [type=\\\"checkbox\\\"]\");\n    if (checkbox) {\n      handleCheck(focusItem, event, (checkbox === null || checkbox === void 0 ? void 0 : checkbox.getAttribute('aria-checked')) !== 'true');\n    }\n  });\n  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !focusItemValue || !active,\n    trigger: trigger,\n    target: target,\n    overlay: overlay,\n    searchInput: searchInput,\n    active: active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter\n  }, rest));\n  var renderCascadeColumn = function renderCascadeColumn(childNodes, column) {\n    var items = column.items,\n      parentItem = column.parentItem,\n      layer = column.layer;\n    if (typeof renderColumn === 'function') {\n      return renderColumn(childNodes, column);\n    } else if (typeof DEPRECATED_renderMenu === 'function') {\n      return DEPRECATED_renderMenu(items, childNodes, parentItem, layer);\n    }\n    return childNodes;\n  };\n  var renderCascadeTreeNode = function renderCascadeTreeNode(node, itemData) {\n    var render = typeof renderTreeNode === 'function' ? renderTreeNode : DEPRECATED_renderMenuItem;\n    if (typeof render === 'function') {\n      return render(node, itemData);\n    }\n    return node;\n  };\n  var renderTreeView = function renderTreeView(positionProps, speakerRef) {\n    var _ref = positionProps || {},\n      left = _ref.left,\n      top = _ref.top,\n      className = _ref.className;\n    var styles = (0, _extends2.default)({}, DEPRECATED_menuStyle, popupStyle, {\n      left: left,\n      top: top\n    });\n    var classes = merge(className, DEPRECATED_menuClassName, popupClassName, prefix('popup-multi-cascader'));\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils2.mergeRefs)(overlay, speakerRef),\n      className: classes,\n      style: styles,\n      target: trigger,\n      onKeyDown: onPickerKeyDown,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 356,\n        columnNumber: 9\n      }\n    }, searchable && /*#__PURE__*/_react.default.createElement(_SearchView.default, {\n      data: items,\n      value: value,\n      searchKeyword: searchKeyword,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      childrenKey: childrenKey,\n      disabledItemValues: disabledItemValues,\n      onCheck: handleCheck,\n      onSearch: handleSearch,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 364,\n        columnNumber: 13\n      }\n    }), !searchKeyword && /*#__PURE__*/_react.default.createElement(_TreeView.default, {\n      cascade: cascade,\n      columnWidth: columnWidth !== null && columnWidth !== void 0 ? columnWidth : DEPRECATED_menuWidth,\n      columnHeight: columnHeight !== null && columnHeight !== void 0 ? columnHeight : DEPRECATED_menuHeight,\n      classPrefix: \"cascade-tree\",\n      uncheckableItemValues: uncheckableItemValues,\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      childrenKey: childrenKey,\n      cascadeData: columnData,\n      cascadePaths: selectedPaths,\n      value: value,\n      onSelect: handleSelect,\n      onCheck: handleCheck,\n      renderColumn: renderCascadeColumn,\n      renderTreeNode: renderCascadeTreeNode,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 378,\n        columnNumber: 13\n      }\n    }), renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  var selectedElement = placeholder;\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      childrenKey: childrenKey,\n      prefix: prefix,\n      cascade: cascade,\n      locale: locale,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 407,\n        columnNumber: 9\n      }\n    });\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  var hasValue = selectedItems.length > 0 || Number(valueProp === null || valueProp === void 0 ? void 0 : valueProp.length) > 0 && (0, _isFunction.default)(renderValue);\n  if (hasValue && (0, _isFunction.default)(renderValue)) {\n    selectedElement = renderValue(value.length ? value : valueProp !== null && valueProp !== void 0 ? valueProp : [], selectedItems, selectedElement);\n    // If renderValue returns null or undefined, hasValue is false.\n    if ((0, _isNil.default)(selectedElement)) {\n      hasValue = false;\n    }\n  }\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n      classPrefix: classPrefix,\n      hasValue: hasValue,\n      countable: countable,\n      name: 'cascader',\n      appearance: appearance,\n      cleanable: cleanable\n    })),\n    classes = _usePickerClassName[0],\n    usedClassNamePropKeys = _usePickerClassName[1];\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    id: id,\n    popupType: \"tree\",\n    multiple: true,\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: trigger,\n    placement: placement,\n    onEnter: handleEntered,\n    onExited: handleExited,\n    speaker: renderTreeView,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 450,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    ref: root,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 461,\n      columnNumber: 9\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys)), {\n    as: toggleAs,\n    appearance: appearance,\n    disabled: disabled,\n    ref: target,\n    onClean: (0, _utils2.createChainedFunction)(handleClean, onClean),\n    onKeyDown: onPickerKeyDown,\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: 462,\n      columnNumber: 11\n    }\n  }), selectedElement || locale.placeholder)));\n});\nMultiCascader.displayName = 'MultiCascader';\nMultiCascader.propTypes = (0, _extends2.default)({}, _Picker.listPickerPropTypes, {\n  value: _propTypes.default.array,\n  disabledItemValues: _propTypes.default.array,\n  locale: _propTypes.default.any,\n  appearance: (0, _propTypes2.oneOf)(['default', 'subtle']),\n  cascade: _propTypes.default.bool,\n  countable: _propTypes.default.bool,\n  uncheckableItemValues: _propTypes.default.array,\n  searchable: _propTypes.default.bool,\n  onSearch: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  onCheck: _propTypes.default.func,\n  inline: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.bool, 'Use `<MultiCascadeTree>` instead.'),\n  renderMenu: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.func, 'Use \"renderColumn\" property instead.'),\n  renderMenuItem: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.func, 'Use \"renderTreeNode\" property instead.'),\n  menuWidth: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.number, 'Use \"columnWidth\" property instead.'),\n  menuHeight: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.number, 'Use \"columnHeight\" property instead.')\n});\nvar _default = MultiCascader;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/MultiCascader/MultiCascader.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _utils = __webpack_require__(/*! ../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../CascadeTree/utils */ \"./src/CascadeTree/utils.ts\");\nvar _utils3 = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _hooks = __webpack_require__(/*! ../MultiCascadeTree/hooks */ \"./src/MultiCascadeTree/hooks/index.ts\");\nvar _TreeView = _interopRequireDefault(__webpack_require__(/*! ../MultiCascadeTree/TreeView */ \"./src/MultiCascadeTree/TreeView.tsx\"));\nvar _SearchView = _interopRequireDefault(__webpack_require__(/*! ../MultiCascadeTree/SearchView */ \"./src/MultiCascadeTree/SearchView.tsx\"));\nvar _useActive2 = _interopRequireDefault(__webpack_require__(/*! ../Cascader/useActive */ \"./src/Cascader/useActive.ts\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/MultiCascader/MultiCascader.tsx\",\n  _this = void 0;\nvar emptyArray = [];\n\n/**\n * The `MultiCascader` component is used to select multiple values from cascading options.\n * @see https://rsuitejs.com/components/multi-cascader/\n */\nvar MultiCascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _selectedPaths;\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    defaultValue = props.defaultValue,\n    columnHeight = props.columnHeight,\n    columnWidth = props.columnWidth,\n    _props$childrenKey = props.childrenKey,\n    childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,\n    _props$cleanable = props.cleanable,\n    cleanable = _props$cleanable === void 0 ? true : _props$cleanable,\n    _props$data = props.data,\n    data = _props$data === void 0 ? emptyArray : _props$data,\n    disabled = props.disabled,\n    _props$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,\n    valueProp = props.value,\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    overrideLocale = props.locale,\n    toggleAs = props.toggleAs,\n    style = props.style,\n    _props$countable = props.countable,\n    countable = _props$countable === void 0 ? true : _props$countable,\n    _props$cascade = props.cascade,\n    cascade = _props$cascade === void 0 ? true : _props$cascade,\n    placeholder = props.placeholder,\n    _props$placement = props.placement,\n    placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n    popupClassName = props.popupClassName,\n    popupStyle = props.popupStyle,\n    _props$searchable = props.searchable,\n    searchable = _props$searchable === void 0 ? true : _props$searchable,\n    _props$uncheckableIte = props.uncheckableItemValues,\n    uncheckableItemValues = _props$uncheckableIte === void 0 ? emptyArray : _props$uncheckableIte,\n    id = props.id,\n    getChildren = props.getChildren,\n    renderValue = props.renderValue,\n    renderExtraFooter = props.renderExtraFooter,\n    renderColumn = props.renderColumn,\n    renderTreeNode = props.renderTreeNode,\n    onEntered = props.onEntered,\n    onExited = props.onExited,\n    onClean = props.onClean,\n    onSearch = props.onSearch,\n    onSelect = props.onSelect,\n    onChange = props.onChange,\n    onCheck = props.onCheck,\n    DEPRECATED_menuClassName = props.menuClassName,\n    DEPRECATED_menuStyle = props.menuStyle,\n    DEPRECATED_menuWidth = props.menuWidth,\n    DEPRECATED_menuHeight = props.menuHeight,\n    DEPRECATED_renderMenu = props.renderMenu,\n    DEPRECATED_renderMenuItem = props.renderMenuItem,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"appearance\", \"classPrefix\", \"defaultValue\", \"columnHeight\", \"columnWidth\", \"childrenKey\", \"cleanable\", \"data\", \"disabled\", \"disabledItemValues\", \"value\", \"valueKey\", \"labelKey\", \"locale\", \"toggleAs\", \"style\", \"countable\", \"cascade\", \"placeholder\", \"placement\", \"popupClassName\", \"popupStyle\", \"searchable\", \"uncheckableItemValues\", \"id\", \"getChildren\", \"renderValue\", \"renderExtraFooter\", \"renderColumn\", \"renderTreeNode\", \"onEntered\", \"onExited\", \"onClean\", \"onSearch\", \"onSelect\", \"onChange\", \"onCheck\", \"menuClassName\", \"menuStyle\", \"menuWidth\", \"menuHeight\", \"renderMenu\", \"renderMenuItem\"]);\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay,\n    searchInput = _usePickerRef.searchInput;\n  var _useCustom = (0, _utils3.useCustom)('Picker', overrideLocale),\n    locale = _useCustom.locale,\n    rtl = _useCustom.rtl;\n  var _useClassNames = (0, _utils3.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge;\n  var onSelectCallback = (0, _react.useCallback)(function (node, cascadePaths, event) {\n    var _trigger$current, _trigger$current$upda;\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(node, cascadePaths, event);\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : (_trigger$current$upda = _trigger$current.updatePosition) === null || _trigger$current$upda === void 0 ? void 0 : _trigger$current$upda.call(_trigger$current);\n  }, [onSelect, trigger]);\n  var _useSelect = (0, _hooks.useSelect)({\n      data: data,\n      childrenKey: childrenKey,\n      labelKey: labelKey,\n      valueKey: valueKey,\n      onSelect: onSelectCallback,\n      getChildren: getChildren\n    }),\n    selectedPaths = _useSelect.selectedPaths,\n    flattenData = _useSelect.flattenData,\n    columnData = _useSelect.columnData,\n    setColumnData = _useSelect.setColumnData,\n    setSelectedPaths = _useSelect.setSelectedPaths,\n    handleSelect = _useSelect.handleSelect;\n  var _useControlled = (0, _utils3.useControlled)(valueProp, defaultValue),\n    controlledValue = _useControlled[0];\n  var itemKeys = {\n    childrenKey: childrenKey,\n    labelKey: labelKey,\n    valueKey: valueKey\n  };\n  var cascadeValueProps = (0, _extends2.default)({}, itemKeys, {\n    uncheckableItemValues: uncheckableItemValues,\n    cascade: cascade,\n    value: controlledValue,\n    onCheck: onCheck,\n    onChange: onChange\n  });\n  var _useCascadeValue = (0, _hooks.useCascadeValue)(cascadeValueProps, flattenData),\n    value = _useCascadeValue.value,\n    setValue = _useCascadeValue.setValue,\n    handleCheck = _useCascadeValue.handleCheck;\n  var selectedItems = flattenData.filter(function (item) {\n    return value.some(function (v) {\n      return v === item[valueKey];\n    });\n  }) || [];\n  var onFocusItemCallback = (0, _react.useCallback)(function (value) {\n    var _getColumnsAndPaths = (0, _utils2.getColumnsAndPaths)(data, flattenData.find(function (item) {\n        return item[valueKey] === value;\n      }), {\n        getParent: function getParent() {\n          return undefined;\n        },\n        getChildren: function getChildren(item) {\n          return item[childrenKey];\n        }\n      }),\n      columns = _getColumnsAndPaths.columns,\n      path = _getColumnsAndPaths.path;\n    setColumnData(columns);\n    setSelectedPaths(path);\n  }, [childrenKey, data, flattenData, setColumnData, setSelectedPaths, valueKey]);\n\n  // Used to hover the focuse item  when trigger `onKeydown`\n  var _useFocusItemValue = (0, _Picker.useFocusItemValue)(selectedPaths === null || selectedPaths === void 0 ? void 0 : (_selectedPaths = selectedPaths[selectedPaths.length - 1]) === null || _selectedPaths === void 0 ? void 0 : _selectedPaths[valueKey], {\n      rtl: rtl,\n      data: flattenData,\n      valueKey: valueKey,\n      defaultLayer: selectedPaths !== null && selectedPaths !== void 0 && selectedPaths.length ? selectedPaths.length - 1 : 0,\n      target: function target() {\n        return overlay.current;\n      },\n      callback: onFocusItemCallback\n    }),\n    focusItemValue = _useFocusItemValue.focusItemValue,\n    setLayer = _useFocusItemValue.setLayer,\n    setKeys = _useFocusItemValue.setKeys,\n    onFocusItem = _useFocusItemValue.onKeyDown;\n  var onSearchCallback = function onSearchCallback(value, event) {\n    if (value) {\n      setLayer(0);\n    } else if (selectedPaths !== null && selectedPaths !== void 0 && selectedPaths.length) {\n      setLayer(selectedPaths.length - 1);\n    }\n    setKeys([]);\n    onSearch === null || onSearch === void 0 ? void 0 : onSearch(value, event);\n  };\n  var _useSearch = (0, _hooks.useSearch)({\n      labelKey: labelKey,\n      valueKey: valueKey,\n      childrenKey: childrenKey,\n      flattenedData: flattenData,\n      uncheckableItemValues: uncheckableItemValues,\n      onSearch: onSearchCallback\n    }),\n    items = _useSearch.items,\n    searchKeyword = _useSearch.searchKeyword,\n    setSearchKeyword = _useSearch.setSearchKeyword,\n    handleSearch = _useSearch.handleSearch;\n  var _useActive = (0, _useActive2.default)({\n      onEntered: onEntered,\n      onExited: onExited,\n      target: target,\n      setSearchKeyword: setSearchKeyword\n    }),\n    active = _useActive.active,\n    handleEntered = _useActive.handleEntered,\n    handleExited = _useActive.handleExited;\n  var handleClean = (0, _utils3.useEventCallback)(function (event) {\n    if (disabled || !target.current) {\n      return;\n    }\n    setSelectedPaths([]);\n    setValue([]);\n    setColumnData([data]);\n    onChange === null || onChange === void 0 ? void 0 : onChange([], event);\n  });\n  var handleMenuPressEnter = (0, _utils3.useEventCallback)(function (event) {\n    var _overlay$current;\n    var focusItem = (0, _utils.findNodeOfTree)(data, function (item) {\n      return item[valueKey] === focusItemValue;\n    });\n    var checkbox = (_overlay$current = overlay.current) === null || _overlay$current === void 0 ? void 0 : _overlay$current.querySelector(\"[data-key=\\\"\" + focusItemValue + \"\\\"] [type=\\\"checkbox\\\"]\");\n    if (checkbox) {\n      handleCheck(focusItem, event, (checkbox === null || checkbox === void 0 ? void 0 : checkbox.getAttribute('aria-checked')) !== 'true');\n    }\n  });\n  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !focusItemValue || !active,\n    trigger: trigger,\n    target: target,\n    overlay: overlay,\n    searchInput: searchInput,\n    active: active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter\n  }, rest));\n  var renderCascadeColumn = function renderCascadeColumn(childNodes, column) {\n    var items = column.items,\n      parentItem = column.parentItem,\n      layer = column.layer;\n    if (typeof renderColumn === 'function') {\n      return renderColumn(childNodes, column);\n    } else if (typeof DEPRECATED_renderMenu === 'function') {\n      return DEPRECATED_renderMenu(items, childNodes, parentItem, layer);\n    }\n    return childNodes;\n  };\n  var renderCascadeTreeNode = function renderCascadeTreeNode(node, itemData) {\n    var render = typeof renderTreeNode === 'function' ? renderTreeNode : DEPRECATED_renderMenuItem;\n    if (typeof render === 'function') {\n      return render(node, itemData);\n    }\n    return node;\n  };\n  var renderTreeView = function renderTreeView(positionProps, speakerRef) {\n    var _ref = positionProps || {},\n      left = _ref.left,\n      top = _ref.top,\n      className = _ref.className;\n    var styles = (0, _extends2.default)({}, DEPRECATED_menuStyle, popupStyle, {\n      left: left,\n      top: top\n    });\n    var classes = merge(className, DEPRECATED_menuClassName, popupClassName, prefix('popup-multi-cascader'));\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils3.mergeRefs)(overlay, speakerRef),\n      className: classes,\n      style: styles,\n      target: trigger,\n      onKeyDown: onPickerKeyDown,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 356,\n        columnNumber: 9\n      }\n    }, searchable && /*#__PURE__*/_react.default.createElement(_SearchView.default, {\n      data: items,\n      value: value,\n      searchKeyword: searchKeyword,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      childrenKey: childrenKey,\n      disabledItemValues: disabledItemValues,\n      onCheck: handleCheck,\n      onSearch: handleSearch,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 364,\n        columnNumber: 13\n      }\n    }), !searchKeyword && /*#__PURE__*/_react.default.createElement(_TreeView.default, {\n      cascade: cascade,\n      columnWidth: columnWidth !== null && columnWidth !== void 0 ? columnWidth : DEPRECATED_menuWidth,\n      columnHeight: columnHeight !== null && columnHeight !== void 0 ? columnHeight : DEPRECATED_menuHeight,\n      classPrefix: \"cascade-tree\",\n      uncheckableItemValues: uncheckableItemValues,\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      childrenKey: childrenKey,\n      cascadeData: columnData,\n      cascadePaths: selectedPaths,\n      value: value,\n      onSelect: handleSelect,\n      onCheck: handleCheck,\n      renderColumn: renderCascadeColumn,\n      renderTreeNode: renderCascadeTreeNode,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 378,\n        columnNumber: 13\n      }\n    }), renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  var selectedElement = placeholder;\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      childrenKey: childrenKey,\n      prefix: prefix,\n      cascade: cascade,\n      locale: locale,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 407,\n        columnNumber: 9\n      }\n    });\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  var hasValue = selectedItems.length > 0 || Number(valueProp === null || valueProp === void 0 ? void 0 : valueProp.length) > 0 && (0, _isFunction.default)(renderValue);\n  if (hasValue && (0, _isFunction.default)(renderValue)) {\n    selectedElement = renderValue(value.length ? value : valueProp !== null && valueProp !== void 0 ? valueProp : [], selectedItems, selectedElement);\n    // If renderValue returns null or undefined, hasValue is false.\n    if ((0, _isNil.default)(selectedElement)) {\n      hasValue = false;\n    }\n  }\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n      classPrefix: classPrefix,\n      hasValue: hasValue,\n      countable: countable,\n      name: 'cascader',\n      appearance: appearance,\n      cleanable: cleanable\n    })),\n    classes = _usePickerClassName[0],\n    usedClassNamePropKeys = _usePickerClassName[1];\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    id: id,\n    popupType: \"tree\",\n    multiple: true,\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: trigger,\n    placement: placement,\n    onEnter: handleEntered,\n    onExited: handleExited,\n    speaker: renderTreeView,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 450,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    ref: root,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 461,\n      columnNumber: 9\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys)), {\n    as: toggleAs,\n    appearance: appearance,\n    disabled: disabled,\n    ref: target,\n    onClean: (0, _utils3.createChainedFunction)(handleClean, onClean),\n    onKeyDown: onPickerKeyDown,\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: 462,\n      columnNumber: 11\n    }\n  }), selectedElement || locale.placeholder)));\n});\nMultiCascader.displayName = 'MultiCascader';\nMultiCascader.propTypes = (0, _extends2.default)({}, _Picker.listPickerPropTypes, {\n  value: _propTypes.default.array,\n  disabledItemValues: _propTypes.default.array,\n  locale: _propTypes.default.any,\n  appearance: (0, _propTypes2.oneOf)(['default', 'subtle']),\n  cascade: _propTypes.default.bool,\n  countable: _propTypes.default.bool,\n  uncheckableItemValues: _propTypes.default.array,\n  searchable: _propTypes.default.bool,\n  onSearch: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  onCheck: _propTypes.default.func,\n  inline: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.bool, 'Use `<MultiCascadeTree>` instead.'),\n  renderMenu: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.func, 'Use \"renderColumn\" property instead.'),\n  renderMenuItem: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.func, 'Use \"renderTreeNode\" property instead.'),\n  menuWidth: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.number, 'Use \"columnWidth\" property instead.'),\n  menuHeight: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.number, 'Use \"columnHeight\" property instead.')\n});\nvar _default = MultiCascader;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/MultiCascader/MultiCascader.tsx?");
 
 /***/ }),
 
@@ -9035,7 +9189,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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _isUndefined = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _getDataGroupBy = __webpack_require__(/*! ../utils/getDataGroupBy */ \"./src/utils/getDataGroupBy.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/SelectPicker/SelectPicker.tsx\",\n  _this = void 0,\n  _templateObject;\nvar emptyArray = [];\n/**\n * The `SelectPicker` component is used to select an item from a list of data.\n * @see https://rsuitejs.com/components/select-picker/\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    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\", \"sort\", \"renderValue\", \"renderMenu\", \"renderMenuGroup\", \"renderMenuItem\", \"renderExtraFooter\"]);\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay,\n    list = _usePickerRef.list,\n    searchInput = _usePickerRef.searchInput;\n  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),\n    locale = _useCustom.locale;\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  var _useFocusItemValue = (0, _Picker.useFocusItemValue)(value, {\n      data: data,\n      valueKey: valueKey,\n      target: function target() {\n        return overlay.current;\n      }\n    }),\n    focusItemValue = _useFocusItemValue.focusItemValue,\n    setFocusItemValue = _useFocusItemValue.setFocusItemValue,\n    onFocusItem = _useFocusItemValue.onKeyDown; // Use search keywords to filter options.\n  var _useSearch = (0, _Picker.useSearch)(data, {\n      labelKey: labelKey,\n      searchBy: searchBy,\n      callback: function callback(searchKeyword, filteredData, event) {\n        var _filteredData$;\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    resetSearch = _useSearch.resetSearch,\n    handleSearch = _useSearch.handleSearch; // Use component active state to support keyboard events.\n  var _useState = (0, _react.useState)(false),\n    active = _useState[0],\n    setActive = _useState[1];\n  var handleClose = (0, _utils.useEventCallback)(function () {\n    var _trigger$current, _trigger$current$clos;\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 ? void 0 : _trigger$current$clos.call(_trigger$current);\n  });\n  var handleSelect = (0, _utils.useEventCallback)(function (value, item, event) {\n    var _target$current;\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(value, item, event);\n    (_target$current = target.current) === null || _target$current === void 0 ? void 0 : _target$current.focus();\n  });\n  var handleChangeValue = (0, _utils.useEventCallback)(function (value, event) {\n    onChange === null || onChange === void 0 ? void 0 : onChange(value, event);\n  });\n  var handleMenuPressEnter = (0, _utils.useEventCallback)(function (event) {\n    if (!focusItemValue) {\n      return;\n    }\n\n    // Find active `MenuItem` by `value`\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  });\n  var handleItemSelect = (0, _utils.useEventCallback)(function (value, item, event) {\n    setValue(value);\n    setFocusItemValue(value);\n    handleSelect(value, item, event);\n    handleChangeValue(value, event);\n    handleClose();\n  });\n  var handleClean = (0, _utils.useEventCallback)(function (event) {\n    if (disabled || !cleanable) {\n      return;\n    }\n    setValue(null);\n    setFocusItemValue(value);\n    handleChangeValue(null, event);\n  });\n  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !focusItemValue || !active,\n    trigger: trigger,\n    target: target,\n    overlay: overlay,\n    searchInput: searchInput,\n    active: active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter\n  }, rest));\n  var handleExited = (0, _utils.useEventCallback)(function () {\n    resetSearch();\n    setActive(false);\n    onSearch === null || onSearch === void 0 ? void 0 : onSearch('');\n    setFocusItemValue(null);\n  });\n  var handleEntered = (0, _utils.useEventCallback)(function () {\n    setActive(true);\n    setFocusItemValue(value);\n  });\n\n  // Find active `MenuItem` by `value`\n  var activeItem = data.find(function (item) {\n    return (0, _utils.shallowEqual)(item[valueKey], value);\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  var hasValue = !!activeItem || !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue);\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge;\n  var selectedElement = placeholder;\n  if (activeItem !== null && activeItem !== void 0 && activeItem[labelKey]) {\n    selectedElement = activeItem[labelKey];\n  }\n  if (!(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue)) {\n    selectedElement = renderValue(value, activeItem, selectedElement);\n    // If renderValue returns null or undefined, hasValue is false.\n    if ((0, _isNil.default)(selectedElement)) {\n      hasValue = false;\n    }\n  }\n  var renderPopup = function renderPopup(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;\n\n    // Create a tree structure data when set `groupBy`\n    if (groupBy) {\n      items = (0, _getDataGroupBy.getDataGroupBy)(items, groupBy, sort);\n    } else if (typeof sort === 'function') {\n      items = items.sort(sort(false));\n    }\n    var menu = items.length ? /*#__PURE__*/_react.default.createElement(_Picker.Listbox, {\n      listProps: listProps,\n      listRef: list,\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      renderMenuGroup: renderMenuGroup,\n      renderMenuItem: renderMenuItem,\n      maxHeight: menuMaxHeight,\n      classPrefix: 'picker-select-menu',\n      listItemClassPrefix: 'picker-select-menu-item',\n      listItemAs: _Picker.ListItem,\n      activeItemValues: [value],\n      focusItemValue: focusItemValue,\n      data: items\n      // FIXME-Doma\n      // `group` is redundant so long as `groupBy` exists\n      ,\n      group: !(0, _isUndefined.default)(groupBy),\n      groupBy: groupBy,\n      onSelect: handleItemSelect,\n      onGroupTitleClick: onGroupTitleClick,\n      virtualized: virtualized,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 331,\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: 355,\n        columnNumber: 9\n      }\n    }, locale === null || locale === void 0 ? void 0 : locale.noResultsText);\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      autoWidth: menuAutoWidth,\n      className: classes,\n      style: styles,\n      onKeyDown: onPickerKeyDown,\n      target: trigger,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 359,\n        columnNumber: 9\n      }\n    }, searchable && /*#__PURE__*/_react.default.createElement(_SearchBox.default, {\n      placeholder: locale === null || locale === void 0 ? void 0 : locale.searchPlaceholder,\n      onChange: handleSearch,\n      value: searchKeyword,\n      inputRef: searchInput,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 368,\n        columnNumber: 13\n      }\n    }), renderMenu ? renderMenu(menu) : menu, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\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  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    id: id,\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: trigger,\n    placement: placement,\n    onEntered: (0, _utils.createChainedFunction)(handleEntered, onEntered),\n    onExited: (0, _utils.createChainedFunction)(handleExited, onExited),\n    speaker: renderPopup,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 392,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    ref: root,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 401,\n      columnNumber: 9\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys)), {\n    ref: target,\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    focusItemValue: focusItemValue,\n    active: active,\n    placement: placement,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 402,\n      columnNumber: 11\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder))));\n});\nSelectPicker.displayName = 'SelectPicker';\nSelectPicker.propTypes = (0, _extends2.default)({}, _Picker.listPickerPropTypes, {\n  locale: _propTypes.default.any,\n  appearance: (0, _propTypes2.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   * 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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _getDataGroupBy = __webpack_require__(/*! ../utils/getDataGroupBy */ \"./src/utils/getDataGroupBy.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/SelectPicker/SelectPicker.tsx\",\n  _this = void 0,\n  _templateObject;\nvar emptyArray = [];\n/**\n * The `SelectPicker` component is used to select an item from a list of data.\n * @see https://rsuitejs.com/components/select-picker/\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    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\", \"sort\", \"renderValue\", \"renderMenu\", \"renderMenuGroup\", \"renderMenuItem\", \"renderExtraFooter\"]);\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay,\n    list = _usePickerRef.list,\n    searchInput = _usePickerRef.searchInput;\n  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),\n    locale = _useCustom.locale;\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  var _useFocusItemValue = (0, _Picker.useFocusItemValue)(value, {\n      data: data,\n      valueKey: valueKey,\n      target: function target() {\n        return overlay.current;\n      }\n    }),\n    focusItemValue = _useFocusItemValue.focusItemValue,\n    setFocusItemValue = _useFocusItemValue.setFocusItemValue,\n    onFocusItem = _useFocusItemValue.onKeyDown; // Use search keywords to filter options.\n  var _useSearch = (0, _Picker.useSearch)(data, {\n      labelKey: labelKey,\n      searchBy: searchBy,\n      callback: function callback(searchKeyword, filteredData, event) {\n        var _filteredData$;\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    resetSearch = _useSearch.resetSearch,\n    handleSearch = _useSearch.handleSearch; // Use component active state to support keyboard events.\n  var _useState = (0, _react.useState)(false),\n    active = _useState[0],\n    setActive = _useState[1];\n  var handleClose = (0, _utils.useEventCallback)(function () {\n    var _trigger$current, _trigger$current$clos;\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 ? void 0 : _trigger$current$clos.call(_trigger$current);\n  });\n  var handleSelect = (0, _utils.useEventCallback)(function (value, item, event) {\n    var _target$current;\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(value, item, event);\n    (_target$current = target.current) === null || _target$current === void 0 ? void 0 : _target$current.focus();\n  });\n  var handleChangeValue = (0, _utils.useEventCallback)(function (value, event) {\n    onChange === null || onChange === void 0 ? void 0 : onChange(value, event);\n  });\n  var handleMenuPressEnter = (0, _utils.useEventCallback)(function (event) {\n    if (!focusItemValue) {\n      return;\n    }\n\n    // Find active `MenuItem` by `value`\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  });\n  var handleItemSelect = (0, _utils.useEventCallback)(function (value, item, event) {\n    setValue(value);\n    setFocusItemValue(value);\n    handleSelect(value, item, event);\n    handleChangeValue(value, event);\n    handleClose();\n  });\n  var handleClean = (0, _utils.useEventCallback)(function (event) {\n    if (disabled || !cleanable) {\n      return;\n    }\n    setValue(null);\n    setFocusItemValue(value);\n    handleChangeValue(null, event);\n  });\n  var onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !focusItemValue || !active,\n    trigger: trigger,\n    target: target,\n    overlay: overlay,\n    searchInput: searchInput,\n    active: active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter\n  }, rest));\n  var handleExited = (0, _utils.useEventCallback)(function () {\n    resetSearch();\n    setActive(false);\n    onSearch === null || onSearch === void 0 ? void 0 : onSearch('');\n    setFocusItemValue(null);\n  });\n  var handleEntered = (0, _utils.useEventCallback)(function () {\n    setActive(true);\n    setFocusItemValue(value);\n  });\n\n  // Find active `MenuItem` by `value`\n  var activeItem = data.find(function (item) {\n    return (0, _utils.shallowEqual)(item[valueKey], value);\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  var hasValue = !!activeItem || !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue);\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge;\n  var selectedElement = placeholder;\n  if (activeItem !== null && activeItem !== void 0 && activeItem[labelKey]) {\n    selectedElement = activeItem[labelKey];\n  }\n  if (!(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue)) {\n    selectedElement = renderValue(value, activeItem, selectedElement);\n    // If renderValue returns null or undefined, hasValue is false.\n    if ((0, _isNil.default)(selectedElement)) {\n      hasValue = false;\n    }\n  }\n  var renderPopup = function renderPopup(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;\n\n    // Create a tree structure data when set `groupBy`\n    if (groupBy) {\n      items = (0, _getDataGroupBy.getDataGroupBy)(items, groupBy, sort);\n    } else if (typeof sort === 'function') {\n      items = items.sort(sort(false));\n    }\n    var menu = items.length ? /*#__PURE__*/_react.default.createElement(_Picker.Listbox, {\n      listProps: listProps,\n      listRef: list,\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      renderMenuGroup: renderMenuGroup,\n      renderMenuItem: renderMenuItem,\n      maxHeight: menuMaxHeight,\n      classPrefix: 'picker-select-menu',\n      listItemClassPrefix: 'picker-select-menu-item',\n      listItemAs: _Picker.ListItem,\n      activeItemValues: [value],\n      focusItemValue: focusItemValue,\n      data: items,\n      query: searchKeyword,\n      groupBy: groupBy,\n      onSelect: handleItemSelect,\n      onGroupTitleClick: onGroupTitleClick,\n      virtualized: virtualized,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 330,\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: 352,\n        columnNumber: 9\n      }\n    }, locale === null || locale === void 0 ? void 0 : locale.noResultsText);\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      autoWidth: menuAutoWidth,\n      className: classes,\n      style: styles,\n      onKeyDown: onPickerKeyDown,\n      target: trigger,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 356,\n        columnNumber: 9\n      }\n    }, searchable && /*#__PURE__*/_react.default.createElement(_SearchBox.default, {\n      placeholder: locale === null || locale === void 0 ? void 0 : locale.searchPlaceholder,\n      onChange: handleSearch,\n      value: searchKeyword,\n      inputRef: searchInput,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 365,\n        columnNumber: 13\n      }\n    }), renderMenu ? renderMenu(menu) : menu, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\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  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    id: id,\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    ref: trigger,\n    placement: placement,\n    onEntered: (0, _utils.createChainedFunction)(handleEntered, onEntered),\n    onExited: (0, _utils.createChainedFunction)(handleExited, onExited),\n    speaker: renderPopup,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 389,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    ref: root,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 398,\n      columnNumber: 9\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys)), {\n    ref: target,\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    focusItemValue: focusItemValue,\n    active: active,\n    placement: placement,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 399,\n      columnNumber: 11\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder))));\n});\nSelectPicker.displayName = 'SelectPicker';\nSelectPicker.propTypes = (0, _extends2.default)({}, _Picker.listPickerPropTypes, {\n  locale: _propTypes.default.any,\n  appearance: (0, _propTypes2.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   * 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?");
 
 /***/ }),
 
@@ -9622,6 +9776,17 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 
 /***/ }),
 
+/***/ "./src/Tree/IndentLine.tsx":
+/*!*********************************!*\
+  !*** ./src/Tree/IndentLine.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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Tree/IndentLine.tsx\",\n  _this = void 0;\nvar IndentLine = function IndentLine() {\n  var _useClassNames = (0, _utils.useClassNames)('tree'),\n    prefix = _useClassNames.prefix;\n  return /*#__PURE__*/_react.default.createElement(\"span\", {\n    className: prefix('indent-line'),\n    \"data-testid\": \"indent-line\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 6,\n      columnNumber: 10\n    }\n  });\n};\nvar _default = IndentLine;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/Tree/IndentLine.tsx?");
+
+/***/ }),
+
 /***/ "./src/Tree/Tree.tsx":
 /*!***************************!*\
   !*** ./src/Tree/Tree.tsx ***!
@@ -9629,18 +9794,161 @@ 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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = exports.TREE_NODE_DROP_POSITION = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _TreePicker = _interopRequireDefault(__webpack_require__(/*! ../TreePicker */ \"./src/TreePicker/index.tsx\"));\nvar _TreeContext = _interopRequireDefault(__webpack_require__(/*! ./TreeContext */ \"./src/Tree/TreeContext.ts\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Tree/Tree.tsx\",\n  _this = void 0;\n/**\n * Tree Node Drag Type\n */\nvar TREE_NODE_DROP_POSITION;\nexports.TREE_NODE_DROP_POSITION = TREE_NODE_DROP_POSITION;\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/**\n * The `Tree` component is used to display hierarchical data.\n *\n * @see https://rsuitejs.com/components/tree\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: 155,\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: 156,\n      columnNumber: 9\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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _TreeView = _interopRequireDefault(__webpack_require__(/*! ./TreeView */ \"./src/Tree/TreeView.tsx\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _useFlattenTree = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFlattenTree */ \"./src/Tree/hooks/useFlattenTree.ts\"));\nvar _useTreeWithChildren2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useTreeWithChildren */ \"./src/Tree/hooks/useTreeWithChildren.ts\"));\nvar _useExpandTree2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useExpandTree */ \"./src/Tree/hooks/useExpandTree.ts\"));\nvar _TreeProvider = __webpack_require__(/*! ./TreeProvider */ \"./src/Tree/TreeProvider.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Tree/Tree.tsx\",\n  _this = void 0;\n/**\n * The `Tree` component is used to display hierarchical data.\n *\n * @see https://rsuitejs.com/components/tree\n */\nvar Tree = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var controlledValue = props.value,\n    defaultValue = props.defaultValue,\n    _props$childrenKey = props.childrenKey,\n    childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,\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    data = props.data,\n    _props$defaultExpandA = props.defaultExpandAll,\n    defaultExpandAll = _props$defaultExpandA === void 0 ? false : _props$defaultExpandA,\n    _props$defaultExpandI = props.defaultExpandItemValues,\n    defaultExpandItemValues = _props$defaultExpandI === void 0 ? [] : _props$defaultExpandI,\n    controlledExpandItemValues = props.expandItemValues,\n    virtualized = props.virtualized,\n    renderTreeIcon = props.renderTreeIcon,\n    renderTreeNode = props.renderTreeNode,\n    getChildren = props.getChildren,\n    onChange = props.onChange,\n    onExpand = props.onExpand,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"value\", \"defaultValue\", \"childrenKey\", \"labelKey\", \"valueKey\", \"data\", \"defaultExpandAll\", \"defaultExpandItemValues\", \"expandItemValues\", \"virtualized\", \"renderTreeIcon\", \"renderTreeNode\", \"getChildren\", \"onChange\", \"onExpand\"]);\n  var _useControlled = (0, _utils.useControlled)(controlledValue, defaultValue),\n    value = _useControlled[0],\n    setValue = _useControlled[1];\n  var itemDataKeys = {\n    childrenKey: childrenKey,\n    labelKey: labelKey,\n    valueKey: valueKey\n  };\n  var _useTreeWithChildren = (0, _useTreeWithChildren2.default)(data, itemDataKeys),\n    treeData = _useTreeWithChildren.treeData,\n    loadingNodeValues = _useTreeWithChildren.loadingNodeValues,\n    appendChild = _useTreeWithChildren.appendChild;\n  var flattenedNodes = (0, _useFlattenTree.default)(treeData, (0, _extends2.default)({}, itemDataKeys));\n  var _useExpandTree = (0, _useExpandTree2.default)(data, (0, _extends2.default)({}, itemDataKeys, {\n      defaultExpandAll: defaultExpandAll,\n      defaultExpandItemValues: defaultExpandItemValues,\n      controlledExpandItemValues: controlledExpandItemValues,\n      onExpand: onExpand,\n      getChildren: getChildren,\n      appendChild: appendChild\n    })),\n    expandItemValues = _useExpandTree.expandItemValues,\n    handleExpandTreeNode = _useExpandTree.handleExpandTreeNode;\n  var handleChange = (0, _utils.useEventCallback)(function (nextValue, event) {\n    setValue(nextValue);\n    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n  });\n  var treeContext = (0, _react.useMemo)(function () {\n    return {\n      props: {\n        childrenKey: childrenKey,\n        labelKey: labelKey,\n        valueKey: valueKey,\n        virtualized: virtualized,\n        renderTreeIcon: renderTreeIcon,\n        renderTreeNode: renderTreeNode\n      }\n    };\n  }, [childrenKey, labelKey, valueKey, virtualized, renderTreeIcon, renderTreeNode]);\n  return /*#__PURE__*/_react.default.createElement(_TreeProvider.TreeProvider, {\n    value: treeContext,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 75,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_TreeView.default, (0, _extends2.default)({\n    ref: ref\n  }, rest, {\n    value: value,\n    data: treeData,\n    virtualized: virtualized,\n    loadingNodeValues: loadingNodeValues,\n    flattenedNodes: flattenedNodes,\n    expandItemValues: expandItemValues,\n    onChange: handleChange,\n    onExpand: handleExpandTreeNode,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 76,\n      columnNumber: 9\n    }\n  })));\n});\nTree.displayName = 'Tree';\nvar _default = Tree;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/Tree/Tree.tsx?");
 
 /***/ }),
 
-/***/ "./src/Tree/TreeContext.ts":
-/*!*********************************!*\
-  !*** ./src/Tree/TreeContext.ts ***!
-  \*********************************/
+/***/ "./src/Tree/TreeNode.tsx":
+/*!*******************************!*\
+  !*** ./src/Tree/TreeNode.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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _TreeNodeToggle = _interopRequireDefault(__webpack_require__(/*! ./TreeNodeToggle */ \"./src/Tree/TreeNodeToggle.tsx\"));\nvar _TreeProvider = __webpack_require__(/*! ./TreeProvider */ \"./src/Tree/TreeProvider.tsx\");\nvar _utils3 = __webpack_require__(/*! ./utils */ \"./src/Tree/utils/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Tree/TreeNode.tsx\",\n  _this = void 0;\n/**\n * Props for the TreeNode component.\n */\n\nvar TreeNode = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {\n  var _props$as = props.as,\n    Component = _props$as === void 0 ? 'div' : _props$as,\n    label = props.label,\n    layer = props.layer,\n    active = props.active,\n    loading = props.loading,\n    nodeData = props.nodeData,\n    className = props.className,\n    _props$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'tree-node' : _props$classPrefix,\n    disabled = props.disabled,\n    _props$visible = props.visible,\n    visible = _props$visible === void 0 ? true : _props$visible,\n    draggable = props.draggable,\n    expanded = props.expanded,\n    focus = props.focus,\n    style = props.style,\n    hasChildren = props.hasChildren,\n    dragging = props.dragging,\n    dragStatus = props.dragStatus,\n    onSelect = props.onSelect,\n    onDragStart = props.onDragStart,\n    onDragOver = props.onDragOver,\n    onDragEnter = props.onDragEnter,\n    onDragLeave = props.onDragLeave,\n    onDragEnd = props.onDragEnd,\n    onDrop = props.onDrop,\n    onExpand = props.onExpand,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"label\", \"layer\", \"active\", \"loading\", \"nodeData\", \"className\", \"classPrefix\", \"disabled\", \"visible\", \"draggable\", \"expanded\", \"focus\", \"style\", \"hasChildren\", \"dragging\", \"dragStatus\", \"onSelect\", \"onDragStart\", \"onDragOver\", \"onDragEnter\", \"onDragLeave\", \"onDragEnd\", \"onDrop\", \"onExpand\"]);\n  var _useCustom = (0, _utils.useCustom)(),\n    rtl = _useCustom.rtl;\n  var _useTreeContextProps = (0, _TreeProvider.useTreeContextProps)(),\n    renderTreeNode = _useTreeContextProps.renderTreeNode,\n    virtualized = _useTreeContextProps.virtualized;\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge,\n    withClassPrefix = _useClassNames.withClassPrefix;\n  var labelStr = (0, _react.useMemo)(function () {\n    return (0, _utils2.stringifyReactNode)(label);\n  }, [label]);\n  var handleExpand = (0, _utils.useEventCallback)(function (event) {\n    var _event$nativeEvent, _event$nativeEvent$st;\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    event.stopPropagation();\n    onExpand === null || onExpand === void 0 ? void 0 : onExpand(nodeData, expanded);\n  });\n  var handleSelect = (0, _utils.useEventCallback)(function (event) {\n    if (disabled) {\n      return;\n    }\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(nodeData, event);\n  });\n  var handleDragStart = (0, _utils.useEventCallback)(function (event) {\n    onDragStart === null || onDragStart === void 0 ? void 0 : onDragStart(nodeData, event);\n  });\n  var handleDragEnter = (0, _utils.useEventCallback)(function (event) {\n    event.preventDefault();\n    event.stopPropagation();\n    onDragEnter === null || onDragEnter === void 0 ? void 0 : onDragEnter(nodeData, event);\n  });\n  var handleDragOver = (0, _utils.useEventCallback)(function (event) {\n    event.preventDefault();\n    event.stopPropagation();\n    onDragOver === null || onDragOver === void 0 ? void 0 : onDragOver(nodeData, event);\n  });\n  var handleDragLeave = (0, _utils.useEventCallback)(function (event) {\n    event.stopPropagation();\n    onDragLeave === null || onDragLeave === void 0 ? void 0 : onDragLeave(nodeData, event);\n  });\n  var handleDragEnd = (0, _utils.useEventCallback)(function (event) {\n    event.stopPropagation();\n    onDragEnd === null || onDragEnd === void 0 ? void 0 : onDragEnd(nodeData, event);\n  });\n  var handleDrop = (0, _utils.useEventCallback)(function (event) {\n    event.preventDefault();\n    event.stopPropagation();\n    onDrop === null || onDrop === void 0 ? void 0 : onDrop(nodeData, event);\n  });\n  var classes = merge(className, withClassPrefix({\n    disabled: disabled,\n    active: active,\n    'text-muted': disabled,\n    focus: focus\n  }));\n  var treeItemRef = (0, _hooks.useFoucsVirtualListItem)(focus);\n  var styles = virtualized ? (0, _extends2.default)({}, style, (0, _utils3.indentTreeNode)(rtl, layer - 1)) : style;\n  return visible ? /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {\n    ref: (0, _utils.mergeRefs)(treeItemRef, ref),\n    role: \"treeitem\",\n    tabIndex: -1,\n    \"aria-expanded\": expanded,\n    \"aria-label\": labelStr,\n    \"aria-level\": layer,\n    \"aria-disabled\": disabled,\n    \"aria-selected\": active,\n    \"data-layer\": layer,\n    \"data-key\": (nodeData === null || nodeData === void 0 ? void 0 : nodeData.refKey) || '',\n    title: labelStr,\n    className: classes,\n    style: styles,\n    draggable: draggable,\n    onClick: handleSelect,\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: 208,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(_TreeNodeToggle.default, {\n    \"aria-label\": (expanded ? 'Collapse' : 'Expand') + (\" \" + labelStr),\n    data: nodeData,\n    loading: loading,\n    expanded: expanded,\n    hasChildren: hasChildren,\n    onClick: handleExpand,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 232,\n      columnNumber: 7\n    }\n  }), /*#__PURE__*/_react.default.createElement(\"span\", {\n    className: prefix('label', dragStatus, {\n      dragging: dragging\n    }),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 240,\n      columnNumber: 7\n    }\n  }, renderTreeNode ? renderTreeNode(nodeData) : label)) : null;\n});\nTreeNode.displayName = 'TreeNode';\nvar _default = TreeNode;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/Tree/TreeNode.tsx?");
+
+/***/ }),
+
+/***/ "./src/Tree/TreeNodeToggle.tsx":
+/*!*************************************!*\
+  !*** ./src/Tree/TreeNodeToggle.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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _ArrowDown = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/ArrowDown */ \"./node_modules/@rsuite/icons/ArrowDown.js\"));\nvar _ArrowRight = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/ArrowRight */ \"./node_modules/@rsuite/icons/ArrowRight.js\"));\nvar _ArrowLeft = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/ArrowLeft */ \"./node_modules/@rsuite/icons/ArrowLeft.js\"));\nvar _Spinner = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/Spinner */ \"./node_modules/@rsuite/icons/legacy/Spinner.js\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _TreeProvider = __webpack_require__(/*! ./TreeProvider */ \"./src/Tree/TreeProvider.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Tree/TreeNodeToggle.tsx\";\nfunction TreeNodeToggle(props) {\n  var data = props.data,\n    loading = props.loading,\n    expanded = props.expanded,\n    hasChildren = props.hasChildren,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"data\", \"loading\", \"expanded\", \"hasChildren\"]);\n  var _useCustom = (0, _utils.useCustom)(),\n    rtl = _useCustom.rtl;\n  var _useTreeCustomRendere = (0, _TreeProvider.useTreeCustomRenderer)(),\n    renderTreeIcon = _useTreeCustomRendere.renderTreeIcon;\n  var _useClassNames = (0, _utils.useClassNames)('tree-node'),\n    prefix = _useClassNames.prefix;\n  var IconElementType = expanded ? _ArrowDown.default : rtl ? _ArrowLeft.default : _ArrowRight.default;\n  var icon = /*#__PURE__*/_react.default.createElement(IconElementType, {\n    className: prefix('toggle-icon'),\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 23,\n      columnNumber: 14\n    }\n  });\n  if (loading) {\n    icon = /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix('loading-icon'),\n      __self: this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 27,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Spinner.default, {\n      spin: true,\n      __self: this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 28,\n        columnNumber: 9\n      }\n    }));\n  }\n  if (data !== undefined && typeof renderTreeIcon === 'function') {\n    var customIcon = renderTreeIcon(data, expanded);\n    icon = customIcon !== null ? /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix('custom-icon'),\n      __self: this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 34,\n        columnNumber: 34\n      }\n    }, customIcon) : icon;\n  }\n  return hasChildren ? /*#__PURE__*/_react.default.createElement(\"div\", (0, _extends2.default)({\n    tabIndex: -1,\n    role: \"button\",\n    \"aria-busy\": loading ? true : undefined,\n    \"data-ref\": data.refKey,\n    className: prefix('toggle')\n  }, rest, {\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 38,\n      columnNumber: 5\n    }\n  }), icon) : /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('toggle-placeholder'),\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 49,\n      columnNumber: 5\n    }\n  });\n}\nvar _default = TreeNodeToggle;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/Tree/TreeNodeToggle.tsx?");
+
+/***/ }),
+
+/***/ "./src/Tree/TreeProvider.tsx":
+/*!***********************************!*\
+  !*** ./src/Tree/TreeProvider.tsx ***!
+  \***********************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.useTreeImperativeHandle = exports.useTreeContextProps = exports.useItemDataKeys = exports.useTreeCustomRenderer = exports.useRegisterTreeMethods = exports.TreeProvider = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar defaultItemDataKeys = {\n  labelKey: 'label',\n  valueKey: 'value',\n  childrenKey: 'children',\n  virtualized: false\n};\nvar TreeContext = /*#__PURE__*/(0, _react.createContext)({\n  props: defaultItemDataKeys\n});\nvar TreeProvider = TreeContext.Provider;\nexports.TreeProvider = TreeProvider;\nvar useRegisterTreeMethods = function useRegisterTreeMethods() {\n  var _useContext = (0, _react.useContext)(TreeContext),\n    register = _useContext.register;\n  return register;\n};\nexports.useRegisterTreeMethods = useRegisterTreeMethods;\nvar useTreeCustomRenderer = function useTreeCustomRenderer() {\n  var _useContext2 = (0, _react.useContext)(TreeContext),\n    _useContext2$props = _useContext2.props,\n    renderTreeIcon = _useContext2$props.renderTreeIcon,\n    renderTreeNode = _useContext2$props.renderTreeNode;\n  return {\n    renderTreeIcon: renderTreeIcon,\n    renderTreeNode: renderTreeNode\n  };\n};\nexports.useTreeCustomRenderer = useTreeCustomRenderer;\nvar useItemDataKeys = function useItemDataKeys() {\n  var _useContext3 = (0, _react.useContext)(TreeContext),\n    _useContext3$props = _useContext3.props;\n  _useContext3$props = _useContext3$props === void 0 ? defaultItemDataKeys : _useContext3$props;\n  var labelKey = _useContext3$props.labelKey,\n    valueKey = _useContext3$props.valueKey,\n    childrenKey = _useContext3$props.childrenKey;\n  return {\n    labelKey: labelKey,\n    valueKey: valueKey,\n    childrenKey: childrenKey\n  };\n};\nexports.useItemDataKeys = useItemDataKeys;\nvar useTreeContextProps = function useTreeContextProps() {\n  var _useContext4 = (0, _react.useContext)(TreeContext),\n    props = _useContext4.props;\n  return props;\n};\n\n/**\n * Custom hook that provides imperative handle for the Tree component.\n */\nexports.useTreeContextProps = useTreeContextProps;\nvar useTreeImperativeHandle = function useTreeImperativeHandle() {\n  var focusFirstNodeRef = (0, _react.useRef)(null);\n  var focusActiveNodeRef = (0, _react.useRef)(null);\n  var register = (0, _react.useCallback)(function (_ref) {\n    var focusTreeFirstNode = _ref.focusTreeFirstNode,\n      focusTreeActiveNode = _ref.focusTreeActiveNode;\n    focusFirstNodeRef.current = focusTreeFirstNode;\n    focusActiveNodeRef.current = focusTreeActiveNode;\n    return function () {\n      focusFirstNodeRef.current = null;\n      focusActiveNodeRef.current = null;\n    };\n  }, []);\n  return {\n    register: register,\n    focusFirstNode: function focusFirstNode() {\n      var _focusFirstNodeRef$cu;\n      return (_focusFirstNodeRef$cu = focusFirstNodeRef.current) === null || _focusFirstNodeRef$cu === void 0 ? void 0 : _focusFirstNodeRef$cu.call(focusFirstNodeRef);\n    },\n    focusActiveNode: function focusActiveNode() {\n      var _focusActiveNodeRef$c;\n      return (_focusActiveNodeRef$c = focusActiveNodeRef.current) === null || _focusActiveNodeRef$c === void 0 ? void 0 : _focusActiveNodeRef$c.call(focusActiveNodeRef);\n    }\n  };\n};\nexports.useTreeImperativeHandle = useTreeImperativeHandle;\n\n//# sourceURL=webpack://rsuite/./src/Tree/TreeProvider.tsx?");
+
+/***/ }),
+
+/***/ "./src/Tree/TreeView.tsx":
+/*!*******************************!*\
+  !*** ./src/Tree/TreeView.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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _Windowing = __webpack_require__(/*! ../internals/Windowing */ \"./src/internals/Windowing/index.ts\");\nvar _TreeNode = _interopRequireDefault(__webpack_require__(/*! ./TreeNode */ \"./src/Tree/TreeNode.tsx\"));\nvar _IndentLine = _interopRequireDefault(__webpack_require__(/*! ./IndentLine */ \"./src/Tree/IndentLine.tsx\"));\nvar _utils = __webpack_require__(/*! ../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _utils3 = __webpack_require__(/*! ./utils */ \"./src/Tree/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _Tree = __webpack_require__(/*! ../internals/Tree */ \"./src/internals/Tree/index.ts\");\nvar _useTreeSearch2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useTreeSearch */ \"./src/Tree/hooks/useTreeSearch.ts\"));\nvar _useTreeDrag2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useTreeDrag */ \"./src/Tree/hooks/useTreeDrag.ts\"));\nvar _useFocusTree2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFocusTree */ \"./src/Tree/hooks/useFocusTree.ts\"));\nvar _useVirtualizedTreeData = _interopRequireDefault(__webpack_require__(/*! ./hooks/useVirtualizedTreeData */ \"./src/Tree/hooks/useVirtualizedTreeData.ts\"));\nvar _useTreeNodeProps = _interopRequireDefault(__webpack_require__(/*! ./hooks/useTreeNodeProps */ \"./src/Tree/hooks/useTreeNodeProps.tsx\"));\nvar _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _TreeProvider = __webpack_require__(/*! ./TreeProvider */ \"./src/Tree/TreeProvider.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Tree/TreeView.tsx\",\n  _this = void 0;\n/**\n * Props for the TreeViewInner component.\n */\n/**\n * Represents the props for the TreeView component.\n */\nvar TreeView = /*#__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 ? [] : _props$data,\n    style = props.style,\n    showIndentLine = props.showIndentLine,\n    valueProp = 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    _props$searchable = props.searchable,\n    searchable = _props$searchable === void 0 ? false : _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 ? 'tree' : _props$classPrefix,\n    searchKeyword = props.searchKeyword,\n    searchBy = props.searchBy,\n    draggable = props.draggable,\n    _props$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? [] : _props$disabledItemVa,\n    _props$loadingNodeVal = props.loadingNodeValues,\n    loadingNodeValues = _props$loadingNodeVal === void 0 ? [] : _props$loadingNodeVal,\n    _props$flattenedNodes = props.flattenedNodes,\n    flattenedNodes = _props$flattenedNodes === void 0 ? {} : _props$flattenedNodes,\n    listProps = props.listProps,\n    listRef = props.listRef,\n    searchInputRef = props.searchInputRef,\n    _props$expandItemValu = props.expandItemValues,\n    expandItemValues = _props$expandItemValu === void 0 ? [] : _props$expandItemValu,\n    onSearch = props.onSearch,\n    onSelect = props.onSelect,\n    onSelectItem = props.onSelectItem,\n    onChange = props.onChange,\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    onFocusItem = props.onFocusItem,\n    onScroll = props.onScroll,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"data\", \"style\", \"showIndentLine\", \"value\", \"locale\", \"height\", \"className\", \"searchable\", \"virtualized\", \"classPrefix\", \"searchKeyword\", \"searchBy\", \"draggable\", \"disabledItemValues\", \"loadingNodeValues\", \"flattenedNodes\", \"listProps\", \"listRef\", \"searchInputRef\", \"expandItemValues\", \"onSearch\", \"onSelect\", \"onSelectItem\", \"onChange\", \"onDragEnd\", \"onDragStart\", \"onDragEnter\", \"onDragLeave\", \"onDragOver\", \"onDrop\", \"onExpand\", \"onFocusItem\", \"onScroll\"]);\n  var _useCustom = (0, _utils2.useCustom)('Picker', overrideLocale),\n    locale = _useCustom.locale;\n  var _useItemDataKeys = (0, _TreeProvider.useItemDataKeys)(),\n    valueKey = _useItemDataKeys.valueKey,\n    childrenKey = _useItemDataKeys.childrenKey;\n  var _useClassNames = (0, _utils2.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge,\n    withClassPrefix = _useClassNames.withClassPrefix;\n  var handleSearchCallback = (0, _utils2.useEventCallback)(function (value, _data, event) {\n    onSearch === null || onSearch === void 0 ? void 0 : onSearch(value, event);\n  });\n  var _useTreeSearch = (0, _useTreeSearch2.default)({\n      callback: handleSearchCallback,\n      searchKeyword: searchKeyword,\n      data: data,\n      searchBy: searchBy\n    }),\n    filteredData = _useTreeSearch.filteredData,\n    keyword = _useTreeSearch.keyword,\n    setFilteredData = _useTreeSearch.setFilteredData,\n    handleSearch = _useTreeSearch.handleSearch;\n  var transformation = (0, _useVirtualizedTreeData.default)(flattenedNodes, filteredData, {\n    expandItemValues: expandItemValues,\n    searchKeyword: keyword\n  });\n  var getFormattedNodes = function getFormattedNodes(render) {\n    if (virtualized) {\n      return transformation().filter(function (n) {\n        return n.visible;\n      });\n    }\n    return filteredData.map(function (dataItem, index) {\n      return render === null || render === void 0 ? void 0 : render(dataItem, index, 1);\n    }).filter(function (n) {\n      return n;\n    });\n  };\n  (0, _react.useEffect)(function () {\n    setFilteredData(data, keyword);\n  }, [data, keyword, setFilteredData]);\n\n  // TODO-Doma\n  // Replace `getKeyParentMap` with `getParentMap`\n  var itemParentMap = (0, _react.useMemo)(function () {\n    return (0, _utils.getKeyParentMap)(data, function (node) {\n      return node[valueKey];\n    }, function (node) {\n      return node[childrenKey];\n    });\n  }, [childrenKey, data, valueKey]);\n  var _useFocusTree = (0, _useFocusTree2.default)({\n      filteredData: filteredData,\n      disabledItemValues: disabledItemValues,\n      expandItemValues: expandItemValues,\n      searchKeyword: keyword,\n      flattenedNodes: flattenedNodes,\n      onFocused: onFocusItem,\n      onExpand: onExpand\n    }),\n    focusItemValue = _useFocusTree.focusItemValue,\n    setFocusItemValue = _useFocusTree.setFocusItemValue,\n    onTreeKeydown = _useFocusTree.onTreeKeydown,\n    treeNodesRefs = _useFocusTree.treeNodesRefs,\n    saveTreeNodeRef = _useFocusTree.saveTreeNodeRef,\n    treeViewRef = _useFocusTree.treeViewRef;\n  var _useTreeDrag = (0, _useTreeDrag2.default)({\n      flattenedNodes: flattenedNodes,\n      treeNodesRefs: treeNodesRefs,\n      draggable: draggable,\n      onDragStart: onDragStart,\n      onDragEnter: onDragEnter,\n      onDragOver: onDragOver,\n      onDragLeave: onDragLeave,\n      onDragEnd: onDragEnd,\n      onDrop: onDrop,\n      prefix: prefix\n    }),\n    dragNode = _useTreeDrag.dragNode,\n    dragOverNodeKey = _useTreeDrag.dragOverNodeKey,\n    dropNodePosition = _useTreeDrag.dropNodePosition,\n    dragEvents = _useTreeDrag.dragEvents;\n  var getTreeNodeProps = (0, _useTreeNodeProps.default)({\n    value: valueProp,\n    disabledItemValues: disabledItemValues,\n    loadingNodeValues: loadingNodeValues,\n    focusItemValue: focusItemValue,\n    keyword: keyword,\n    dragNode: dragNode,\n    dragOverNodeKey: dragOverNodeKey,\n    dropNodePosition: dropNodePosition\n  });\n  var handleSelect = (0, _utils2.useEventCallback)(function (nodeData, event) {\n    if (!nodeData) {\n      return;\n    }\n    var nextValue = nodeData[valueKey];\n    var path = (0, _utils.getPathTowardsItem)(nodeData, function (item) {\n      return itemParentMap.get(item[valueKey]);\n    });\n    setFocusItemValue(nextValue);\n    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(nodeData, nextValue, event);\n    onSelectItem === null || onSelectItem === void 0 ? void 0 : onSelectItem(nodeData, path);\n  });\n  var selectActiveItem = (0, _utils2.useEventCallback)(function (event) {\n    if ((0, _isNil.default)(focusItemValue)) return;\n    var activeItem = (0, _utils3.getActiveItem)(focusItemValue, flattenedNodes, valueKey);\n    handleSelect(activeItem, event);\n  });\n  var handleTreeKeyDown = (0, _utils2.useEventCallback)(function (event) {\n    onTreeKeydown(event);\n    (0, _Picker.onMenuKeyDown)(event, {\n      enter: selectActiveItem\n    });\n  });\n  var renderNode = function renderNode(node, index, layer) {\n    var visible = node.visible;\n    if (!visible) {\n      return null;\n    }\n    var children = node[childrenKey];\n    var expanded = (0, _utils3.isExpand)(keyword, expandItemValues.includes(node[valueKey]));\n    var hasChildren = keyword ? (0, _utils3.hasVisibleChildren)(node, childrenKey) : Boolean(children);\n    var nodeProps = (0, _extends2.default)({}, getTreeNodeProps(node, layer, index), dragEvents, {\n      expanded: expanded,\n      draggable: draggable,\n      onExpand: onExpand,\n      onSelect: handleSelect,\n      hasChildren: hasChildren\n    });\n    if (hasChildren) {\n      var _merge;\n      layer += 1;\n      var childClassName = merge(prefix('node-children'), (_merge = {}, _merge[prefix('node-expanded')] = expanded, _merge));\n      return /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: childClassName,\n        key: node[valueKey],\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 285,\n          columnNumber: 11\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: 286,\n          columnNumber: 13\n        }\n      })), /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: prefix('group'),\n        role: \"group\",\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 287,\n          columnNumber: 13\n        }\n      }, children === null || children === void 0 ? void 0 : children.map(function (child, i) {\n        return renderNode(child, i, layer);\n      }), showIndentLine && /*#__PURE__*/_react.default.createElement(_IndentLine.default, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 289,\n          columnNumber: 34\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: 295,\n        columnNumber: 9\n      }\n    }));\n  };\n  var renderVirtualListNode = function renderVirtualListNode(_ref3) {\n    var index = _ref3.index,\n      style = _ref3.style,\n      data = _ref3.data;\n    var node = data[index];\n    var layer = node.layer,\n      visible = node.visible,\n      hasChildren = node.hasChildren;\n    var expanded = (0, _utils3.isExpand)(keyword, expandItemValues.includes(node[valueKey]));\n    if (!visible) {\n      return null;\n    }\n    var treeNodeProps = (0, _extends2.default)({}, getTreeNodeProps(node, layer), dragEvents, {\n      expanded: expanded,\n      style: style,\n      onExpand: onExpand,\n      onSelect: handleSelect,\n      hasChildren: 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    }, treeNodeProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 325,\n        columnNumber: 11\n      }\n    }));\n  };\n  var classes = merge(withClassPrefix({\n    virtualized: virtualized\n  }), className);\n  var formattedNodes = getFormattedNodes(renderNode);\n  return /*#__PURE__*/_react.default.createElement(Component, {\n    ref: ref,\n    className: classes,\n    style: style,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 334,\n      columnNumber: 7\n    }\n  }, searchable ? /*#__PURE__*/_react.default.createElement(_SearchBox.default, {\n    placeholder: locale.searchPlaceholder,\n    onChange: handleSearch,\n    value: keyword,\n    inputRef: searchInputRef,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 336,\n      columnNumber: 11\n    }\n  }) : null, keyword && formattedNodes.length === 0 ? /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('empty'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 345,\n      columnNumber: 11\n    }\n  }, locale.noResultsText) : null, /*#__PURE__*/_react.default.createElement(_Tree.TreeView, (0, _extends2.default)({}, rest, {\n    ref: treeViewRef,\n    treeRootClassName: prefix('root'),\n    onScroll: onScroll,\n    onKeyDown: handleTreeKeyDown,\n    className: prefix('view'),\n    style: virtualized ? undefined : {\n      height: height\n    },\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 348,\n      columnNumber: 9\n    }\n  }), virtualized ? /*#__PURE__*/_react.default.createElement(_Windowing.AutoSizer, {\n    defaultHeight: height,\n    style: {\n      width: 'auto',\n      height: 'auto'\n    },\n    className: prefix('virt-auto-sizer'),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 358,\n      columnNumber: 13\n    }\n  }, function (_ref5) {\n    var height = _ref5.height;\n    return /*#__PURE__*/_react.default.createElement(_Windowing.List, (0, _extends2.default)({\n      ref: listRef,\n      height: height,\n      itemSize: _Windowing.defaultItemSize,\n      itemCount: formattedNodes.length,\n      itemData: formattedNodes,\n      className: prefix('virt-list')\n    }, listProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 364,\n        columnNumber: 17\n      }\n    }), renderVirtualListNode);\n  }) : formattedNodes));\n});\nTreeView.displayName = 'TreeView';\nvar _default = TreeView;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/Tree/TreeView.tsx?");
+
+/***/ }),
+
+/***/ "./src/Tree/hooks/useExpandTree.ts":
+/*!*****************************************!*\
+  !*** ./src/Tree/hooks/useExpandTree.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\");\nexports.__esModule = true;\nexports.getDefaultExpandItemValues = getDefaultExpandItemValues;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/Tree/utils/index.ts\");\nfunction getDefaultExpandItemValues(data, options) {\n  var valueKey = options.valueKey,\n    defaultExpandAll = options.defaultExpandAll,\n    childrenKey = options.childrenKey,\n    _options$defaultExpan = options.defaultExpandItemValues,\n    defaultExpandItemValues = _options$defaultExpan === void 0 ? [] : _options$defaultExpan;\n  if (defaultExpandAll) {\n    return (0, _utils2.flattenTree)(data, function (item) {\n      return item[childrenKey] || [];\n    }).filter(function (item) {\n      return Array.isArray(item[childrenKey]) && item[childrenKey].length > 0;\n    }).map(function (item) {\n      return item[valueKey];\n    });\n  }\n  return defaultExpandItemValues;\n}\n/**\n * Custom hook for managing tree expansion state.\n */\nfunction useExpandTree(data, props) {\n  var defaultExpandAll = props.defaultExpandAll,\n    valueKey = props.valueKey,\n    childrenKey = props.childrenKey,\n    defaultExpandItemValues = props.defaultExpandItemValues,\n    controlledExpandItemValues = props.controlledExpandItemValues,\n    onExpand = props.onExpand,\n    getChildren = props.getChildren,\n    appendChild = props.appendChild;\n  var _useControlled = (0, _utils.useControlled)(controlledExpandItemValues, getDefaultExpandItemValues(data, {\n      defaultExpandAll: defaultExpandAll,\n      valueKey: valueKey,\n      childrenKey: childrenKey,\n      defaultExpandItemValues: defaultExpandItemValues\n    })),\n    expandItemValues = _useControlled[0],\n    setExpandItemValues = _useControlled[1];\n  (0, _react.useEffect)(function () {\n    if (Array.isArray(controlledExpandItemValues)) {\n      setExpandItemValues(controlledExpandItemValues);\n    }\n  }, [controlledExpandItemValues, setExpandItemValues]);\n  var handleExpandTreeNode = (0, _utils.useEventCallback)(function (node, expanded) {\n    var nextExpandItemValues = (0, _utils2.getExpandItemValues)({\n      node: node,\n      isExpand: !expanded,\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    if ((0, _isFunction.default)(getChildren) && !node.expand && Array.isArray(node[childrenKey]) && node[childrenKey].length === 0) {\n      appendChild(node, getChildren);\n    }\n  });\n  return {\n    expandItemValues: expandItemValues,\n    handleExpandTreeNode: handleExpandTreeNode\n  };\n}\nvar _default = useExpandTree;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/Tree/hooks/useExpandTree.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/hooks/useFlattenTree.ts":
+/*!******************************************!*\
+  !*** ./src/Tree/hooks/useFlattenTree.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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends3 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _shallowEqual = _interopRequireDefault(__webpack_require__(/*! ../../utils/shallowEqual */ \"./src/utils/shallowEqual.ts\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/Tree/utils/index.ts\");\nvar _useForceUpdate = _interopRequireDefault(__webpack_require__(/*! ./useForceUpdate */ \"./src/Tree/hooks/useForceUpdate.ts\"));\n/**\n * Custom hook that flattens a tree data structure into a map of nodes.\n *\n */\nfunction useFlattenTree(data, options) {\n  var value = options.value,\n    labelKey = options.labelKey,\n    valueKey = options.valueKey,\n    childrenKey = options.childrenKey,\n    _options$uncheckableI = options.uncheckableItemValues,\n    uncheckableItemValues = _options$uncheckableI === void 0 ? [] : _options$uncheckableI,\n    cascade = options.cascade,\n    multiple = options.multiple,\n    callback = options.callback;\n  var forceUpdate = (0, _useForceUpdate.default)();\n  var flattenedNodes = (0, _react.useRef)({});\n  var updateTreeNodeCheckState = (0, _react.useCallback)(function (value) {\n    if (value === void 0) {\n      value = [];\n    }\n    // Reset values to false\n    Object.keys(flattenedNodes.current).forEach(function (refKey) {\n      var node = flattenedNodes.current[refKey];\n      if (cascade && !(0, _isNil.default)(node.parent) && !(0, _isNil.default)(node.parent.refKey)) {\n        node.check = flattenedNodes.current[node.parent.refKey].check;\n      } else {\n        node.check = false;\n      }\n      value.forEach(function (nodeVal) {\n        if ((0, _shallowEqual.default)(flattenedNodes.current[refKey][valueKey], nodeVal) && !uncheckableItemValues.some(function (uncheckableValue) {\n          return (0, _shallowEqual.default)(nodeVal, uncheckableValue);\n        })) {\n          flattenedNodes.current[refKey].check = true;\n        }\n      });\n    });\n  }, [cascade, uncheckableItemValues, valueKey]);\n  var flattenTreeData = (0, _react.useCallback)(function (treeData, parent, layer) {\n    if (layer === void 0) {\n      layer = 1;\n    }\n    if (!Array.isArray(treeData) || treeData.length === 0) {\n      return [];\n    }\n    treeData.map(function (node) {\n      var _extends2;\n      var value = node[valueKey];\n      /**\n       * because the value of the node's type is string or number,\n       * so it can used as the key of the object directly\n       * to avoid number value is converted to string. 1 and '1' will be convert to '1'\n       * we used `String_` or `Number_` prefix\n       */\n      var refKey = (0, _utils.formatNodeRefKey)(value);\n      node.refKey = refKey;\n      flattenedNodes.current[refKey] = (0, _extends3.default)((_extends2 = {\n        layer: layer\n      }, _extends2[labelKey] = node[labelKey], _extends2[valueKey] = node[valueKey], _extends2.uncheckable = uncheckableItemValues.some(function (value) {\n        return (0, _shallowEqual.default)(node[valueKey], value);\n      }), _extends2), node);\n      if (parent) {\n        flattenedNodes.current[refKey].parent = (0, _omit.default)(parent, 'parent', 'children');\n      }\n      flattenTreeData(node[childrenKey], node, layer + 1);\n    });\n    callback === null || callback === void 0 ? void 0 : callback(flattenedNodes.current);\n    forceUpdate();\n  }, [callback, forceUpdate, valueKey, labelKey, uncheckableItemValues, childrenKey]);\n  (0, _react.useEffect)(function () {\n    // when data is changed, should clear the flattenedNodes, avoid duplicate keys\n    flattenedNodes.current = {};\n    flattenTreeData(data);\n  }, [data]); // eslint-disable-line react-hooks/exhaustive-deps\n\n  (0, _react.useEffect)(function () {\n    if (multiple) {\n      updateTreeNodeCheckState(value);\n      forceUpdate();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [value]);\n  return flattenedNodes.current;\n}\nvar _default = useFlattenTree;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/Tree/hooks/useFlattenTree.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/hooks/useFocusTree.ts":
+/*!****************************************!*\
+  !*** ./src/Tree/hooks/useFocusTree.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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _constants = __webpack_require__(/*! ../../utils/constants */ \"./src/utils/constants.ts\");\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../TreeProvider */ \"./src/Tree/TreeProvider.tsx\");\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/Tree/utils/index.ts\");\nvar _useTreeNodeRefs2 = _interopRequireDefault(__webpack_require__(/*! ./useTreeNodeRefs */ \"./src/Tree/hooks/useTreeNodeRefs.ts\"));\n/**\n * Custom hook that manages the focus behavior of a tree component.\n */\nfunction useFocusTree(props) {\n  var filteredData = props.filteredData,\n    searchKeyword = props.searchKeyword,\n    flattenedNodes = props.flattenedNodes,\n    expandItemValues = props.expandItemValues,\n    disabledItemValues = props.disabledItemValues,\n    onExpand = props.onExpand,\n    onFocused = props.onFocused;\n  var _useCustom = (0, _utils.useCustom)(),\n    rtl = _useCustom.rtl;\n  var _useItemDataKeys = (0, _TreeProvider.useItemDataKeys)(),\n    valueKey = _useItemDataKeys.valueKey,\n    childrenKey = _useItemDataKeys.childrenKey;\n  var _useTreeNodeRefs = (0, _useTreeNodeRefs2.default)(),\n    treeNodesRefs = _useTreeNodeRefs.treeNodesRefs,\n    saveTreeNodeRef = _useTreeNodeRefs.saveTreeNodeRef;\n  var treeViewRef = (0, _react.useRef)(null);\n  var _useState = (0, _react.useState)(null),\n    focusItemValue = _useState[0],\n    setFocusItemValue = _useState[1];\n  var register = (0, _TreeProvider.useRegisterTreeMethods)();\n  var flattenedNodesRef = (0, _react.useRef)(flattenedNodes);\n  var getFocusProps = function getFocusProps(value) {\n    var options = {\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey,\n      childrenKey: childrenKey,\n      expandItemValues: expandItemValues\n    };\n    var focusableItems = (0, _utils2.getFocusableItems)(filteredData, options, (0, _utils2.isSearching)(searchKeyword));\n    return {\n      focusItemValue: value || focusItemValue,\n      valueKey: valueKey,\n      focusableItems: focusableItems,\n      treeNodesRefs: treeNodesRefs\n    };\n  };\n  var handleFocusItem = (0, _utils.useEventCallback)(function (key) {\n    var focusProps = getFocusProps();\n    var focusedValue = null;\n    if (key === _constants.KEY_VALUES.DOWN) {\n      focusedValue = (0, _utils2.focusNextItem)(focusProps);\n    } else if (key === _constants.KEY_VALUES.UP) {\n      focusedValue = (0, _utils2.focusPreviousItem)(focusProps);\n    }\n    if (focusedValue) {\n      setFocusItemValue(focusedValue);\n      onFocused === null || onFocused === void 0 ? void 0 : onFocused(focusedValue);\n    }\n  });\n  var handleLeftArrowEvent = (0, _utils.useEventCallback)(function () {\n    if ((0, _isNil.default)(focusItemValue)) {\n      return;\n    }\n    var focusItem = (0, _utils2.getActiveItem)(focusItemValue, flattenedNodes, valueKey);\n    var expand = expandItemValues.includes(focusItem === null || focusItem === void 0 ? void 0 : focusItem[valueKey]);\n    var onFocusItem = function onFocusItem() {\n      var _focusItem$parent, _focusItem$parent2;\n      var focusedValue = focusItem === null || focusItem === void 0 ? void 0 : (_focusItem$parent = focusItem.parent) === null || _focusItem$parent === void 0 ? void 0 : _focusItem$parent[valueKey];\n      setFocusItemValue(focusedValue);\n      onFocused === null || onFocused === void 0 ? void 0 : onFocused(focusedValue);\n      (0, _utils2.focusTreeNode)(focusItem === null || focusItem === void 0 ? void 0 : (_focusItem$parent2 = focusItem.parent) === null || _focusItem$parent2 === void 0 ? void 0 : _focusItem$parent2.refKey, treeNodesRefs);\n    };\n    (0, _utils2.handleLeftArrow)({\n      focusItem: focusItem,\n      expand: expand,\n      onExpand: onExpand,\n      childrenKey: childrenKey,\n      onFocusItem: onFocusItem\n    });\n  });\n  var handleRightArrowEvent = (0, _utils.useEventCallback)(function () {\n    if ((0, _isNil.default)(focusItemValue)) {\n      return;\n    }\n    var focusItem = (0, _utils2.getActiveItem)(focusItemValue, flattenedNodes, valueKey);\n    var expand = expandItemValues.includes(focusItem === null || focusItem === void 0 ? void 0 : focusItem[valueKey]);\n    var onFocusItem = function onFocusItem() {\n      return handleFocusItem(_constants.KEY_VALUES.DOWN);\n    };\n    (0, _utils2.handleRightArrow)({\n      focusItem: focusItem,\n      expand: expand,\n      childrenKey: childrenKey,\n      onExpand: onExpand,\n      onFocusItem: onFocusItem\n    });\n  });\n  var onTreeKeydown = (0, _utils.useEventCallback)(function (event) {\n    (0, _Picker.onMenuKeyDown)(event, {\n      down: function down() {\n        return handleFocusItem(_constants.KEY_VALUES.DOWN);\n      },\n      up: function up() {\n        return handleFocusItem(_constants.KEY_VALUES.UP);\n      },\n      left: rtl ? handleRightArrowEvent : handleLeftArrowEvent,\n      right: rtl ? handleLeftArrowEvent : handleRightArrowEvent\n    });\n  });\n  var focusTreeFirstNode = (0, _utils.useEventCallback)(function () {\n    handleFocusItem(_constants.KEY_VALUES.DOWN);\n  });\n  var focusTreeActiveNode = (0, _react.useCallback)(function () {\n    var refKey = (0, _utils2.focusCurrentItem)({\n      container: treeViewRef.current\n    });\n    if (refKey) {\n      var _flattenedNodesRef$cu;\n      var node = (_flattenedNodesRef$cu = flattenedNodesRef.current) === null || _flattenedNodesRef$cu === void 0 ? void 0 : _flattenedNodesRef$cu[refKey];\n      if (node) {\n        setFocusItemValue(node[valueKey]);\n        onFocused === null || onFocused === void 0 ? void 0 : onFocused(node[valueKey]);\n      }\n    }\n  }, [onFocused, valueKey]);\n  (0, _react.useEffect)(function () {\n    var unregister = register === null || register === void 0 ? void 0 : register({\n      focusTreeFirstNode: focusTreeFirstNode,\n      focusTreeActiveNode: focusTreeActiveNode\n    });\n    return function () {\n      unregister === null || unregister === void 0 ? void 0 : unregister();\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n  (0, _react.useEffect)(function () {\n    flattenedNodesRef.current = flattenedNodes;\n  }, [flattenedNodes]);\n  return {\n    treeViewRef: treeViewRef,\n    focusTreeFirstNode: focusTreeFirstNode,\n    focusItemValue: focusItemValue,\n    treeNodesRefs: treeNodesRefs,\n    saveTreeNodeRef: saveTreeNodeRef,\n    setFocusItemValue: setFocusItemValue,\n    onTreeKeydown: onTreeKeydown\n  };\n}\nvar _default = useFocusTree;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/Tree/hooks/useFocusTree.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/hooks/useForceUpdate.ts":
+/*!******************************************!*\
+  !*** ./src/Tree/hooks/useForceUpdate.ts ***!
+  \******************************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nfunction useForceUpdate() {\n  var _useState = (0, _react.useState)(Object.create(null)),\n    dispatch = _useState[1];\n  var forceUpdate = (0, _react.useCallback)(function () {\n    dispatch(Object.create(null));\n  }, [dispatch]);\n  return forceUpdate;\n}\nvar _default = useForceUpdate;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/Tree/hooks/useForceUpdate.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/hooks/useTreeDrag.ts":
+/*!***************************************!*\
+  !*** ./src/Tree/hooks/useTreeDrag.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\");\nexports.__esModule = true;\nexports[\"default\"] = useTreeDrag;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../TreeProvider */ \"./src/Tree/TreeProvider.tsx\");\n/**\n * The gap between tree nodes.\n */\nvar TREE_NODE_GAP = 4;\n\n/**\n * Calculates the drop position of a tree node based on the clientY coordinate of a drag event\n * and the bounding rectangle of the tree node element.\n *\n * @param event - The drag event.\n * @param treeNodeElement - The element representing the tree node.\n * @returns The drop position of the tree node.\n */\nfunction calDropNodePosition(event, treeNodeElement) {\n  var clientY = event.clientY;\n  var _treeNodeElement$getB = treeNodeElement.getBoundingClientRect(),\n    top = _treeNodeElement$getB.top,\n    bottom = _treeNodeElement$getB.bottom;\n  var gap = TREE_NODE_GAP;\n\n  // bottom of node\n  if (clientY >= bottom - gap && clientY <= bottom) {\n    return _utils.TREE_NODE_DROP_POSITION.DRAG_OVER_BOTTOM;\n  }\n\n  // top of node\n  if (clientY <= top + gap && clientY >= top) {\n    return _utils.TREE_NODE_DROP_POSITION.DRAG_OVER_TOP;\n  }\n  if (clientY >= top + gap && clientY <= bottom - gap) {\n    return _utils.TREE_NODE_DROP_POSITION.DRAG_OVER;\n  }\n  return -1;\n}\n\n/**\n * Creates a drag preview element for tree nodes.\n */\nfunction createDragPreview(name, className) {\n  var dragPreview = document.createElement('div');\n  dragPreview.id = 'rs-tree-drag-preview';\n  dragPreview.dataset.testid = 'drag-preview';\n  dragPreview.innerHTML = name;\n  dragPreview.classList.add(className);\n  document.body.appendChild(dragPreview);\n  return dragPreview;\n}\n\n/**\n * Removes the drag preview element from the DOM.\n */\nfunction removeDragPreview() {\n  var _dragPreview$parentNo, _dragPreview$parentNo2;\n  var dragPreview = document.getElementById('rs-tree-drag-preview');\n  dragPreview === null || dragPreview === void 0 ? void 0 : (_dragPreview$parentNo = dragPreview.parentNode) === null || _dragPreview$parentNo === void 0 ? void 0 : (_dragPreview$parentNo2 = _dragPreview$parentNo.removeChild) === null || _dragPreview$parentNo2 === void 0 ? void 0 : _dragPreview$parentNo2.call(_dragPreview$parentNo, dragPreview);\n}\n/**\n * Custom hook for handling tree node dragging.\n */\nfunction useTreeDrag(props) {\n  var _useItemDataKeys = (0, _TreeProvider.useItemDataKeys)(),\n    childrenKey = _useItemDataKeys.childrenKey,\n    valueKey = _useItemDataKeys.valueKey,\n    labelKey = _useItemDataKeys.labelKey;\n  var draggable = props.draggable,\n    flattenedNodes = props.flattenedNodes,\n    treeNodesRefs = props.treeNodesRefs,\n    onDragStart = props.onDragStart,\n    onDragEnter = props.onDragEnter,\n    onDragOver = props.onDragOver,\n    onDragLeave = props.onDragLeave,\n    onDragEnd = props.onDragEnd,\n    onDrop = props.onDrop,\n    prefix = props.prefix; // current dragging node\n  var dragNode = (0, _react.useRef)(null);\n  var _useState = (0, _react.useState)(null),\n    dragOverNodeKey = _useState[0],\n    setDragOverNodeKey = _useState[1]; // drag node and it's children nodes key\n  var _useState2 = (0, _react.useState)([]),\n    dragNodeKeys = _useState2[0],\n    setDragNodeKeys = _useState2[1];\n  var _useState3 = (0, _react.useState)(null),\n    dropNodePosition = _useState3[0],\n    setDropNodePosition = _useState3[1];\n  var setDragNode = (0, _react.useCallback)(function (node) {\n    dragNode.current = node;\n  }, []);\n\n  /**\n   * Retrieves an array of keys for the nodes in a tree starting from the specified drag node.\n   */\n  var getDragNodeKeys = (0, _react.useCallback)(function (dragNode) {\n    var dragNodeKeys = [dragNode[valueKey]];\n    var traverse = function traverse(data) {\n      if ((data === null || data === void 0 ? void 0 : data.length) > 0) {\n        data.forEach(function (node) {\n          dragNodeKeys = dragNodeKeys.concat([node[valueKey]]);\n          if (node[childrenKey]) {\n            traverse(node[childrenKey]);\n          }\n        });\n      }\n    };\n    traverse(dragNode[childrenKey]);\n    return dragNodeKeys;\n  }, [childrenKey, valueKey]);\n\n  /**\n   * Removes the drag node from the data array.\n   *\n   */\n  var removeDragNode = (0, _react.useCallback)(function (data, params) {\n    var dragNode = params.dragNode;\n    var traverse = function traverse(items, parent) {\n      for (var index = 0; index < items.length; index += 1) {\n        var item = items[index];\n        if ((0, _utils.shallowEqual)(item[valueKey], dragNode[valueKey])) {\n          items.splice(index, 1);\n          // when children is empty, delete children prop for hidden anchor\n          if (items.length === 0 && parent) {\n            delete parent.children;\n          }\n          break;\n        }\n        if (Array.isArray(item[childrenKey])) {\n          traverse(item[childrenKey], item);\n        }\n      }\n    };\n    traverse(data);\n  }, [childrenKey, valueKey]);\n\n  /**\n   * Creates a function that modifies a tree data structure based on drag and drop parameters.\n   */\n  var createDragTreeDataFunction = (0, _react.useCallback)(function (params) {\n    return function (tree) {\n      var data = [].concat(tree);\n      var dragNode = params.dragNode,\n        dropNode = params.dropNode,\n        dropNodePosition = params.dropNodePosition;\n      var cloneDragNode = (0, _extends2.default)({}, dragNode);\n      removeDragNode(data, params);\n      var updateTree = function updateTree(items) {\n        for (var index = 0; index < items.length; index += 1) {\n          var item = items[index];\n          if ((0, _utils.shallowEqual)(item[valueKey], dropNode[valueKey])) {\n            // drag to node inside\n            if (dropNodePosition === _utils.TREE_NODE_DROP_POSITION.DRAG_OVER) {\n              item[childrenKey] = (0, _isNil.default)(item[childrenKey]) ? [] : item[childrenKey];\n              item[childrenKey].push(cloneDragNode);\n              break;\n            } else if (dropNodePosition === _utils.TREE_NODE_DROP_POSITION.DRAG_OVER_TOP) {\n              // drag to top of node\n              items.splice(index, 0, cloneDragNode);\n              break;\n            } else if (dropNodePosition === _utils.TREE_NODE_DROP_POSITION.DRAG_OVER_BOTTOM) {\n              // drag to bottom of node\n              items.splice(index + 1, 0, cloneDragNode);\n              break;\n            }\n          }\n          if (Array.isArray(item[childrenKey]) && item[childrenKey].length > 0) {\n            updateTree(item[childrenKey]);\n          }\n        }\n      };\n      updateTree(data);\n      return [].concat(data);\n    };\n  }, [childrenKey, removeDragNode, valueKey]);\n  var getDropData = (0, _react.useCallback)(function (nodeData) {\n    var dragParams = {\n      dragNode: dragNode.current,\n      dropNode: nodeData,\n      dropNodePosition: dropNodePosition\n    };\n    return (0, _extends2.default)({}, dragParams, {\n      createUpdateDataFunction: createDragTreeDataFunction(dragParams)\n    });\n  }, [createDragTreeDataFunction, dropNodePosition]);\n  var handleDragStart = (0, _utils.useEventCallback)(function (nodeData, event) {\n    if (draggable) {\n      var _event$dataTransfer;\n      var dragMoverNode = createDragPreview((0, _utils2.stringifyReactNode)(nodeData[labelKey]), prefix('drag-preview'));\n      (_event$dataTransfer = event.dataTransfer) === null || _event$dataTransfer === void 0 ? void 0 : _event$dataTransfer.setDragImage(dragMoverNode, 0, 0);\n      setDragNodeKeys(getDragNodeKeys(nodeData));\n      setDragNode(flattenedNodes[nodeData.refKey]);\n      onDragStart === null || onDragStart === void 0 ? void 0 : onDragStart(nodeData, event);\n    }\n  });\n  var handleDragEnter = (0, _utils.useEventCallback)(function (nodeData, event) {\n    if (dragNodeKeys.some(function (d) {\n      return (0, _utils.shallowEqual)(d, nodeData[valueKey]);\n    })) {\n      return;\n    }\n    if (dragNode.current) {\n      setDragOverNodeKey(nodeData[valueKey]);\n      setDropNodePosition(calDropNodePosition(event, treeNodesRefs[nodeData.refKey]));\n    }\n    onDragEnter === null || onDragEnter === void 0 ? void 0 : onDragEnter(nodeData, event);\n  });\n  var handleDragOver = (0, _utils.useEventCallback)(function (nodeData, event) {\n    if (dragNodeKeys.some(function (d) {\n      return (0, _utils.shallowEqual)(d, nodeData[valueKey]);\n    })) {\n      event.dataTransfer.dropEffect = 'none';\n      return;\n    }\n    if (dragNode.current && (0, _utils.shallowEqual)(nodeData[valueKey], dragOverNodeKey)) {\n      var lastDropNodePosition = calDropNodePosition(event, treeNodesRefs[nodeData.refKey]);\n      if (lastDropNodePosition === dropNodePosition) return;\n      setDropNodePosition(lastDropNodePosition);\n    }\n    onDragOver === null || onDragOver === void 0 ? void 0 : onDragOver(nodeData, event);\n  });\n  var handleDragLeave = (0, _utils.useEventCallback)(function (nodeData, event) {\n    onDragLeave === null || onDragLeave === void 0 ? void 0 : onDragLeave(nodeData, event);\n  });\n  var handleDragEnd = (0, _utils.useEventCallback)(function (nodeData, event) {\n    removeDragPreview();\n    setDragNode(null);\n    setDragNodeKeys([]);\n    setDragOverNodeKey(null);\n    onDragEnd === null || onDragEnd === void 0 ? void 0 : onDragEnd(nodeData, event);\n  });\n  var handleDrop = (0, _utils.useEventCallback)(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    removeDragPreview();\n    setDragNode(null);\n    setDragNodeKeys([]);\n    setDragOverNodeKey(null);\n  });\n  var dragEvents = {\n    onDragStart: handleDragStart,\n    onDragEnter: handleDragEnter,\n    onDragOver: handleDragOver,\n    onDragLeave: handleDragLeave,\n    onDragEnd: handleDragEnd,\n    onDrop: handleDrop\n  };\n  return {\n    dragNode: dragNode === null || dragNode === void 0 ? void 0 : dragNode.current,\n    dragOverNodeKey: dragOverNodeKey,\n    dropNodePosition: dropNodePosition,\n    dragEvents: dragEvents\n  };\n}\n\n//# sourceURL=webpack://rsuite/./src/Tree/hooks/useTreeDrag.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/hooks/useTreeNodeProps.tsx":
+/*!*********************************************!*\
+  !*** ./src/Tree/hooks/useTreeNodeProps.tsx ***!
+  \*********************************************/
+/***/ (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\");\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar _hooks = __webpack_require__(/*! ../../internals/Picker/hooks */ \"./src/internals/Picker/hooks/index.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../TreeProvider */ \"./src/Tree/TreeProvider.tsx\");\nvar _Highlight = _interopRequireDefault(__webpack_require__(/*! ../../Highlight */ \"./src/Highlight/index.tsx\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Tree/hooks/useTreeNodeProps.tsx\";\nfunction useTreeNodeProps(props) {\n  var _this = this;\n  var _useItemDataKeys = (0, _TreeProvider.useItemDataKeys)(),\n    valueKey = _useItemDataKeys.valueKey,\n    labelKey = _useItemDataKeys.labelKey,\n    childrenKey = _useItemDataKeys.childrenKey;\n  var _useCombobox = (0, _hooks.useCombobox)(),\n    id = _useCombobox.id;\n  var value = props.value,\n    disabledItemValues = props.disabledItemValues,\n    loadingNodeValues = props.loadingNodeValues,\n    focusItemValue = props.focusItemValue,\n    keyword = props.keyword,\n    dragNode = props.dragNode,\n    dragOverNodeKey = props.dragOverNodeKey,\n    dropNodePosition = props.dropNodePosition;\n  return (0, _react.useCallback)(function (nodeData, layer, index) {\n    var DRAG_OVER = _utils.TREE_NODE_DROP_POSITION.DRAG_OVER,\n      DRAG_OVER_TOP = _utils.TREE_NODE_DROP_POSITION.DRAG_OVER_TOP,\n      DRAG_OVER_BOTTOM = _utils.TREE_NODE_DROP_POSITION.DRAG_OVER_BOTTOM;\n    var visible = nodeData.visible;\n    var draggingNode = dragNode !== null && dragNode !== void 0 ? dragNode : {};\n    var nodeValue = nodeData[valueKey];\n    var nodeLabel = nodeData[labelKey];\n    var children = nodeData[childrenKey];\n    var label = keyword ? /*#__PURE__*/_react.default.createElement(_Highlight.default, {\n      as: \"span\",\n      query: keyword,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 45,\n        columnNumber: 9\n      }\n    }, nodeLabel) : nodeLabel;\n    var dragging = (0, _utils.shallowEqual)(nodeValue, draggingNode[valueKey]);\n    var dragStatus;\n    if ((0, _utils.shallowEqual)(nodeValue, dragOverNodeKey)) {\n      switch (dropNodePosition) {\n        case DRAG_OVER:\n          dragStatus = 'drag-over';\n          break;\n        case DRAG_OVER_TOP:\n          dragStatus = 'drag-over-top';\n          break;\n        case DRAG_OVER_BOTTOM:\n          dragStatus = 'drag-over-bottom';\n          break;\n      }\n    }\n    var disabled = disabledItemValues.some(function (disabledItem) {\n      return (0, _utils.shallowEqual)(disabledItem, nodeValue);\n    });\n    var loading = loadingNodeValues.some(function (item) {\n      return (0, _utils.shallowEqual)(item, nodeValue);\n    });\n    var active = (0, _utils.shallowEqual)(nodeValue, value);\n    var focus = (0, _utils.shallowEqual)(nodeValue, focusItemValue);\n    return {\n      id: id ? id + \"-opt-\" + nodeValue : undefined,\n      value: nodeValue,\n      label: label,\n      index: index,\n      layer: layer,\n      loading: loading,\n      active: active,\n      focus: focus,\n      visible: visible,\n      children: children,\n      nodeData: nodeData,\n      disabled: disabled,\n      dragging: dragging,\n      dragStatus: dragStatus\n    };\n  }, [childrenKey, disabledItemValues, dragNode, dragOverNodeKey, dropNodePosition, focusItemValue, id, keyword, labelKey, loadingNodeValues, value, valueKey]);\n}\nvar _default = useTreeNodeProps;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/Tree/hooks/useTreeNodeProps.tsx?");
+
+/***/ }),
+
+/***/ "./src/Tree/hooks/useTreeNodeRefs.ts":
+/*!*******************************************!*\
+  !*** ./src/Tree/hooks/useTreeNodeRefs.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\");\nexports.__esModule = true;\nexports[\"default\"] = useTreeNodeRefs;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\n/**\n * Custom hook that manages references to tree nodes. */\nfunction useTreeNodeRefs() {\n  var treeNodeRefs = (0, _react.useRef)({});\n  var saveTreeNodeRef = function saveTreeNodeRef(ref, refKey) {\n    if (!(0, _isNil.default)(refKey)) {\n      treeNodeRefs.current[refKey] = ref;\n    }\n  };\n  return {\n    treeNodesRefs: treeNodeRefs.current,\n    saveTreeNodeRef: saveTreeNodeRef\n  };\n}\n\n//# sourceURL=webpack://rsuite/./src/Tree/hooks/useTreeNodeRefs.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/hooks/useTreeSearch.ts":
+/*!*****************************************!*\
+  !*** ./src/Tree/hooks/useTreeSearch.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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar TreeContext = /*#__PURE__*/_react.default.createContext({});\nvar _default = TreeContext;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/Tree/TreeContext.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports[\"default\"] = useTreeSearch;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _isArray = _interopRequireDefault(__webpack_require__(/*! lodash/isArray */ \"./node_modules/lodash/isArray.js\"));\nvar _Picker = __webpack_require__(/*! ../../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../TreeProvider */ \"./src/Tree/TreeProvider.tsx\");\n/**\n * Custom hook for searching and filtering data in a tree structure.\n */\nfunction useTreeSearch(props) {\n  var _useItemDataKeys = (0, _TreeProvider.useItemDataKeys)(),\n    labelKey = _useItemDataKeys.labelKey,\n    childrenKey = _useItemDataKeys.childrenKey;\n  var searchKeyword = props.searchKeyword,\n    data = props.data,\n    searchBy = props.searchBy,\n    callback = props.callback;\n  var filterVisibleData = (0, _react.useCallback)(function (data, searchKeyword) {\n    var setVisible = function setVisible(nodes) {\n      return nodes.forEach(function (item) {\n        item.visible = searchBy ? searchBy(searchKeyword, item[labelKey], item) : (0, _Picker.shouldDisplay)(item[labelKey], searchKeyword);\n        if ((0, _isArray.default)(item[childrenKey])) {\n          filterVisibleData(item[childrenKey], searchKeyword);\n          item[childrenKey].forEach(function (child) {\n            if (child.visible) {\n              item.visible = child.visible;\n            }\n          });\n        }\n      });\n    };\n    setVisible(data);\n    return data;\n  }, [childrenKey, labelKey, searchBy]);\n\n  // Use search keywords to filter options.\n  var _useState = (0, _react.useState)(searchKeyword !== null && searchKeyword !== void 0 ? searchKeyword : ''),\n    keyword = _useState[0],\n    setSearchKeyword = _useState[1];\n  var _useState2 = (0, _react.useState)(function () {\n      return filterVisibleData(data, keyword);\n    }),\n    filteredData = _useState2[0],\n    setFilteredData = _useState2[1];\n  var handleSearch = function handleSearch(searchKeyword, event) {\n    var filteredData = filterVisibleData(data, searchKeyword);\n    setFilteredData(filteredData);\n    setSearchKeyword(searchKeyword);\n    if (event) {\n      callback === null || callback === void 0 ? void 0 : callback(searchKeyword, filteredData, event);\n    }\n  };\n  (0, _react.useEffect)(function () {\n    handleSearch(searchKeyword !== null && searchKeyword !== void 0 ? searchKeyword : '');\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [searchKeyword]);\n  (0, _react.useEffect)(function () {\n    setSearchKeyword(searchKeyword !== null && searchKeyword !== void 0 ? searchKeyword : '');\n  }, [searchKeyword, setSearchKeyword]);\n  var setVisibleData = (0, _react.useCallback)(function (data, searchKeyword) {\n    setFilteredData(filterVisibleData(data, searchKeyword));\n  }, [filterVisibleData]);\n  return {\n    keyword: keyword,\n    filteredData: filteredData,\n    setFilteredData: setVisibleData,\n    setSearchKeyword: setSearchKeyword,\n    handleSearch: handleSearch\n  };\n}\n\n//# sourceURL=webpack://rsuite/./src/Tree/hooks/useTreeSearch.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/hooks/useTreeWithChildren.ts":
+/*!***********************************************!*\
+  !*** ./src/Tree/hooks/useTreeWithChildren.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\");\nexports.__esModule = true;\nexports[\"default\"] = useTreeWithChildren;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _shallowEqual = _interopRequireDefault(__webpack_require__(/*! ../../utils/shallowEqual */ \"./src/utils/shallowEqual.ts\"));\nvar _utils = __webpack_require__(/*! ../../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\n/**\n * Custom hook that provides functionality for managing a tree structure with children.\n */\nfunction useTreeWithChildren(data, options) {\n  var valueKey = options.valueKey,\n    childrenKey = options.childrenKey;\n  var _useState = (0, _react.useState)([]),\n    loadingNodeValues = _useState[0],\n    setLoadingNodeValues = _useState[1];\n  var _useState2 = (0, _react.useState)(data),\n    treeData = _useState2[0],\n    setTreeData = _useState2[1];\n  (0, _react.useEffect)(function () {\n    setTreeData(data);\n  }, [data]);\n  var concatChildren = (0, _react.useCallback)(function (treeNode, children) {\n    var value = treeNode[valueKey];\n    treeNode = (0, _utils.findNodeOfTree)(data, function (item) {\n      return value === item[valueKey];\n    });\n    treeNode[childrenKey] = children;\n    var newData = data.concat([]);\n    setTreeData(newData);\n    return newData;\n  }, [data, valueKey, childrenKey]);\n  var appendChild = (0, _react.useCallback)(function (node, getChildren) {\n    setLoadingNodeValues(function (prev) {\n      return prev.concat(node[valueKey]);\n    });\n    var children = getChildren(node);\n    if (children instanceof Promise) {\n      children.then(function (res) {\n        var newData = concatChildren(node, res);\n        setTreeData(newData);\n        setLoadingNodeValues(function (prev) {\n          return prev.filter(function (item) {\n            return !(0, _shallowEqual.default)(item, node[valueKey]);\n          });\n        });\n      });\n    } else {\n      setTreeData(concatChildren(node, children));\n      setLoadingNodeValues(function (prev) {\n        return prev.filter(function (item) {\n          return !(0, _shallowEqual.default)(item, node[valueKey]);\n        });\n      });\n    }\n  }, [concatChildren, valueKey]);\n  return {\n    treeData: treeData,\n    loadingNodeValues: loadingNodeValues,\n    appendChild: appendChild\n  };\n}\n\n//# sourceURL=webpack://rsuite/./src/Tree/hooks/useTreeWithChildren.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/hooks/useVirtualizedTreeData.ts":
+/*!**************************************************!*\
+  !*** ./src/Tree/hooks/useVirtualizedTreeData.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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _intersection = _interopRequireDefault(__webpack_require__(/*! lodash/intersection */ \"./node_modules/lodash/intersection.js\"));\nvar _isUndefined = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\nvar _getNodeParentKeys = __webpack_require__(/*! ../utils/getNodeParentKeys */ \"./src/Tree/utils/getNodeParentKeys.ts\");\nvar _isSearching = __webpack_require__(/*! ../utils/isSearching */ \"./src/Tree/utils/isSearching.ts\");\nvar _flattenTree = __webpack_require__(/*! ../utils/flattenTree */ \"./src/Tree/utils/flattenTree.ts\");\nvar _utils = __webpack_require__(/*! ../../CheckTree/utils */ \"./src/CheckTree/utils.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../TreeProvider */ \"./src/Tree/TreeProvider.tsx\");\n/**\n * Determines whether a node should be shown based on the expanded state of its parent nodes.\n */\nfunction shouldShowNodeByParentExpanded(expandItemValues, parentKeys) {\n  if (expandItemValues === void 0) {\n    expandItemValues = [];\n  }\n  if (parentKeys === void 0) {\n    parentKeys = [];\n  }\n  var intersectionKeys = (0, _intersection.default)(expandItemValues, parentKeys);\n  if (intersectionKeys.length === parentKeys.length) {\n    return true;\n  }\n  return false;\n}\nfunction useVirtualizedTreeData(nodes, data, options) {\n  var _useItemDataKeys = (0, _TreeProvider.useItemDataKeys)(),\n    childrenKey = _useItemDataKeys.childrenKey,\n    valueKey = _useItemDataKeys.valueKey;\n  /**\n   * Formats the virtualized tree data.\n   */\n  return (0, _react.useCallback)(function () {\n    var cascade = options.cascade,\n      searchKeyword = options.searchKeyword,\n      expandItemValues = options.expandItemValues;\n    return (0, _flattenTree.UNSAFE_flattenTree)(data, childrenKey, function (node) {\n      var formatted = {};\n      var curNode = nodes === null || nodes === void 0 ? void 0 : nodes[node.refKey];\n      var parentKeys = (0, _getNodeParentKeys.getNodeParentKeys)(nodes, curNode, valueKey);\n      /**\n       * When using virtualized,\n       * if the parent node is collapsed, the child nodes should be hidden\n       * avoid component height calculation errors\n       */\n      var visible = curNode !== null && curNode !== void 0 && curNode.parent ? shouldShowNodeByParentExpanded(expandItemValues, parentKeys) : true;\n\n      /**\n       * when searching, every node default expand\n       * the node's visible should follow the original state\n       */\n      if ((0, _isSearching.isSearching)(searchKeyword)) {\n        visible = node.visible;\n      }\n      if (curNode) {\n        var checkState = !(0, _isUndefined.default)(cascade) ? (0, _utils.getNodeCheckState)(curNode, {\n          cascade: cascade,\n          nodes: nodes,\n          childrenKey: childrenKey\n        }) : undefined;\n        formatted = (0, _extends2.default)({}, node, {\n          check: curNode.check,\n          uncheckable: curNode.uncheckable,\n          hasChildren: !!node[childrenKey],\n          layer: curNode.layer,\n          parent: curNode.parent,\n          checkState: checkState,\n          visible: visible\n        });\n      }\n      return formatted;\n    });\n  }, [childrenKey, data, nodes, options, valueKey]);\n}\nvar _default = useVirtualizedTreeData;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/Tree/hooks/useVirtualizedTreeData.ts?");
 
 /***/ }),
 
@@ -9655,14 +9963,135 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 
 /***/ }),
 
-/***/ "./src/TreePicker/TreeNode.tsx":
-/*!*************************************!*\
-  !*** ./src/TreePicker/TreeNode.tsx ***!
-  \*************************************/
+/***/ "./src/Tree/utils/flattenTree.ts":
+/*!***************************************!*\
+  !*** ./src/Tree/utils/flattenTree.ts ***!
+  \***************************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.flattenTree = flattenTree;\nexports.walkTreeBfs = walkTreeBfs;\nexports.walkTreeDfs = walkTreeDfs;\nexports.UNSAFE_flattenTree = UNSAFE_flattenTree;\nexports.WalkTreeStrategy = void 0;\nvar _attachParent = __webpack_require__(/*! ../../utils/attachParent */ \"./src/utils/attachParent.ts\");\nfunction _createForOfIteratorHelperLoose(o, allowArrayLike) { var it = typeof Symbol !== \"undefined\" && o[Symbol.iterator] || o[\"@@iterator\"]; if (it) return (it = it.call(o)).next.bind(it); if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === \"number\") { if (it) o = it; var i = 0; return function () { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }; } throw new TypeError(\"Invalid attempt to iterate non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n/**\n * Strategy for walking the tree.\n */\nvar WalkTreeStrategy;\n/**\n * Flattens a tree structure into an array.\n */\nexports.WalkTreeStrategy = WalkTreeStrategy;\n(function (WalkTreeStrategy) {\n  WalkTreeStrategy[WalkTreeStrategy[\"DFS\"] = 0] = \"DFS\";\n  WalkTreeStrategy[WalkTreeStrategy[\"BFS\"] = 1] = \"BFS\";\n})(WalkTreeStrategy || (exports.WalkTreeStrategy = WalkTreeStrategy = {}));\nfunction flattenTree(rootNodes, getChildren, walkStrategy) {\n  if (walkStrategy === void 0) {\n    walkStrategy = WalkTreeStrategy.BFS;\n  }\n  var result = [];\n  if (walkStrategy === WalkTreeStrategy.BFS) {\n    walkTreeBfs(rootNodes, getChildren, function (node) {\n      return result.push(node);\n    });\n  } else if (walkStrategy === WalkTreeStrategy.DFS) {\n    walkTreeDfs(rootNodes, getChildren, function (node) {\n      return result.push(node);\n    });\n  }\n  return result;\n}\n\n/**\n * Walks the tree in a breadth-first search (BFS) manner.\n */\nfunction walkTreeBfs(rootNodes, getChildren, callback) {\n  for (var queue = [].concat(rootNodes); queue.length > 0;) {\n    var _node = queue.shift();\n    callback(_node);\n    var children = getChildren(_node);\n    if (children) {\n      queue.push.apply(queue, children);\n    }\n  }\n}\n\n/**\n * Walks the tree in a depth-first search (DFS) manner.\n */\nfunction walkTreeDfs(rootNodes, getChildren, callback) {\n  for (var _iterator = _createForOfIteratorHelperLoose(rootNodes), _step; !(_step = _iterator()).done;) {\n    var _node2 = _step.value;\n    callback(_node2);\n    var children = getChildren(_node2);\n    if (children) {\n      walkTreeDfs(children, getChildren, callback);\n    }\n  }\n}\n\n/**\n * Flattens a tree structure to an array (deprecated).\n * @deprecated This function is considered unsafe because it mutates the `tree` argument in-place.\n *             Use the `flattenTree` function instead.\n */\nfunction UNSAFE_flattenTree(tree, childrenKey, executor) {\n  if (childrenKey === void 0) {\n    childrenKey = 'children';\n  }\n  var flattenData = [];\n  var traverse = function traverse(data, parent) {\n    if (!Array.isArray(data)) {\n      return;\n    }\n    data.forEach(function (item, index) {\n      var node = typeof executor === 'function' ? executor(item, index) : item;\n      flattenData.push((0, _attachParent.attachParent)(node, parent));\n      if (item[childrenKey]) {\n        traverse(item[childrenKey], item);\n      }\n    });\n  };\n  traverse(tree, null);\n  return flattenData;\n}\n\n//# sourceURL=webpack://rsuite/./src/Tree/utils/flattenTree.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/utils/focusableTree.ts":
+/*!*****************************************!*\
+  !*** ./src/Tree/utils/focusableTree.ts ***!
+  \*****************************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.scrollToActiveTreeNode = scrollToActiveTreeNode;\nexports.focusCurrentItem = exports.focusPreviousItem = exports.focusNextItem = exports.focusTreeNode = exports.getActiveItem = exports.getFocusableItems = void 0;\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\n// Active tree node selector\nvar SELECTED_TREEITEM_SELECTOR = '[role=\"treeitem\"][aria-selected=\"true\"]';\n\n/**\n * Retrieves the focusable items from the filtered data based on the provided props.\n * Excludes nodes that are not visible or are disabled.\n */\nvar getFocusableItems = function getFocusableItems(filteredData, props, isSearching) {\n  var disabledItemValues = props.disabledItemValues,\n    valueKey = props.valueKey,\n    childrenKey = props.childrenKey,\n    expandItemValues = props.expandItemValues;\n  var items = [];\n  var loop = function loop(nodes) {\n    nodes.forEach(function (node) {\n      var disabled = disabledItemValues.some(function (disabledItem) {\n        return (0, _utils.shallowEqual)(disabledItem, node[valueKey]);\n      });\n      if (!disabled && node.visible) {\n        items.push(node);\n      }\n      // always expand when searching\n      var expand = isSearching ? true : expandItemValues.includes(node[valueKey]);\n      if (node[childrenKey] && expand) {\n        loop(node[childrenKey]);\n      }\n    });\n  };\n  loop(filteredData);\n  return items;\n};\n\n/**\n * Returns the index of the active item in the focusItems array.\n *\n */\nexports.getFocusableItems = getFocusableItems;\nvar getActiveIndex = function getActiveIndex(focusItemValue, focusItems, valueKey) {\n  var activeIndex = -1;\n  focusItems.forEach(function (item, index) {\n    if ((0, _utils.shallowEqual)(item[valueKey], focusItemValue)) {\n      activeIndex = index;\n    }\n  });\n  return activeIndex;\n};\n\n/**\n * Retrieves the active item from the flattened nodes based on the provided focus item value.\n */\nvar getActiveItem = function getActiveItem(focusItemValue, flattenedNodes, valueKey) {\n  var nodeData = null;\n  var activeNode = Object.values(flattenedNodes).find(function (node) {\n    return (0, _utils.shallowEqual)(node[valueKey], focusItemValue);\n  });\n  if (activeNode) {\n    nodeData = activeNode;\n  }\n  return nodeData;\n};\n\n/**\n * Focuses on a specific tree node element.\n *\n */\nexports.getActiveItem = getActiveItem;\nvar focusTreeNode = function focusTreeNode(refKey, treeNodeRefs) {\n  var _treeItem$focus;\n  var treeItem = treeNodeRefs[refKey];\n  treeItem === null || treeItem === void 0 ? void 0 : (_treeItem$focus = treeItem.focus) === null || _treeItem$focus === void 0 ? void 0 : _treeItem$focus.call(treeItem);\n};\nexports.focusTreeNode = focusTreeNode;\n/**\n * Focuses on the next item in a tree.\n */\nvar focusNextItem = function focusNextItem(props) {\n  var focusItemValue = props.focusItemValue,\n    focusableItems = props.focusableItems,\n    treeNodesRefs = props.treeNodesRefs,\n    valueKey = props.valueKey;\n  var activeIndex = getActiveIndex(focusItemValue, focusableItems, valueKey);\n  if (focusableItems.length === 0) {\n    return;\n  }\n  var nextIndex = activeIndex === focusableItems.length - 1 ? 0 : activeIndex + 1;\n  var value = focusableItems[nextIndex][valueKey];\n  focusTreeNode(focusableItems[nextIndex].refKey, treeNodesRefs);\n  return value;\n};\n\n/**\n * Focuses on the previous item in a tree.\n */\nexports.focusNextItem = focusNextItem;\nvar focusPreviousItem = function focusPreviousItem(props) {\n  var focusItemValue = props.focusItemValue,\n    focusableItems = props.focusableItems,\n    treeNodesRefs = props.treeNodesRefs,\n    valueKey = props.valueKey;\n  var activeIndex = getActiveIndex(focusItemValue, focusableItems, valueKey);\n  if (focusableItems.length === 0) {\n    return;\n  }\n  var prevIndex = activeIndex === 0 ? focusableItems.length - 1 : activeIndex - 1;\n  prevIndex = prevIndex >= 0 ? prevIndex : 0;\n  var value = focusableItems[prevIndex][valueKey];\n  focusTreeNode(focusableItems[prevIndex].refKey, treeNodesRefs);\n  return value;\n};\n\n/**\n * Returns the index of the first visible node in the tree that matches the given value.\n */\nexports.focusPreviousItem = focusPreviousItem;\nvar getScrollToIndex = function getScrollToIndex(nodes, value, valueKey) {\n  return nodes.filter(function (n) {\n    return n.visible;\n  }).findIndex(function (item) {\n    return item[valueKey] === value;\n  });\n};\n/**\n * Scrolls the list to the active tree node.\n *\n * @param props - The props object containing the necessary parameters.\n */\nfunction scrollToActiveTreeNode(props) {\n  var list = props.list,\n    value = props.value,\n    valueKey = props.valueKey,\n    virtualized = props.virtualized,\n    formattedNodes = props.formattedNodes;\n  if (virtualized && value) {\n    var _list$scrollToItem;\n    var scrollIndex = getScrollToIndex(formattedNodes, value, valueKey);\n    list === null || list === void 0 ? void 0 : (_list$scrollToItem = list.scrollToItem) === null || _list$scrollToItem === void 0 ? void 0 : _list$scrollToItem.call(list, scrollIndex);\n  }\n}\nvar focusCurrentItem = function focusCurrentItem(props) {\n  var _props$selector = props.selector,\n    selector = _props$selector === void 0 ? SELECTED_TREEITEM_SELECTOR : _props$selector,\n    container = props.container;\n  var activeItem = container === null || container === void 0 ? void 0 : container.querySelector(selector);\n  if (activeItem) {\n    var _activeItem$focus, _activeItem$dataset;\n    activeItem === null || activeItem === void 0 ? void 0 : (_activeItem$focus = activeItem.focus) === null || _activeItem$focus === void 0 ? void 0 : _activeItem$focus.call(activeItem);\n    return (_activeItem$dataset = activeItem.dataset) === null || _activeItem$dataset === void 0 ? void 0 : _activeItem$dataset.key;\n  }\n};\nexports.focusCurrentItem = focusCurrentItem;\n\n//# sourceURL=webpack://rsuite/./src/Tree/utils/focusableTree.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/utils/formatNodeRefKey.ts":
+/*!********************************************!*\
+  !*** ./src/Tree/utils/formatNodeRefKey.ts ***!
+  \********************************************/
+/***/ (function(__unused_webpack_module, exports) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.formatNodeRefKey = formatNodeRefKey;\n/**\n * Formats the reference key for a tree node.\n */\nfunction formatNodeRefKey(value) {\n  return \"\" + (typeof value === 'number' ? 'Number_' : 'String_') + value;\n}\n\n//# sourceURL=webpack://rsuite/./src/Tree/utils/formatNodeRefKey.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/utils/getExpandItemValues.ts":
+/*!***********************************************!*\
+  !*** ./src/Tree/utils/getExpandItemValues.ts ***!
+  \***********************************************/
+/***/ (function(__unused_webpack_module, exports) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.getExpandItemValues = getExpandItemValues;\n/**\n * Returns an array of expanded item values.\n */\nfunction getExpandItemValues(_ref) {\n  var node = _ref.node,\n    isExpand = _ref.isExpand,\n    expandItemValues = _ref.expandItemValues,\n    valueKey = _ref.valueKey;\n  var newExpandItemValues = new Set(expandItemValues);\n  if (isExpand) {\n    newExpandItemValues.add(node[valueKey]);\n  } else {\n    newExpandItemValues.delete(node[valueKey]);\n  }\n  return Array.from(newExpandItemValues);\n}\n\n//# sourceURL=webpack://rsuite/./src/Tree/utils/getExpandItemValues.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/utils/getNodeParentKeys.ts":
+/*!*********************************************!*\
+  !*** ./src/Tree/utils/getNodeParentKeys.ts ***!
+  \*********************************************/
+/***/ (function(__unused_webpack_module, exports) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.getNodeParentKeys = getNodeParentKeys;\n/**\n * Retrieves an array of parent keys for a given node in a tree.\n */\nfunction getNodeParentKeys(nodes, node, valueKey) {\n  var parentKeys = [];\n  var traverse = function traverse(node) {\n    var _node$parent;\n    if (node !== null && node !== void 0 && (_node$parent = node.parent) !== null && _node$parent !== void 0 && _node$parent.refKey) {\n      var _node$parent2;\n      traverse(nodes[node.parent.refKey]);\n      parentKeys.push(node === null || node === void 0 ? void 0 : (_node$parent2 = node.parent) === null || _node$parent2 === void 0 ? void 0 : _node$parent2[valueKey]);\n    }\n  };\n  traverse(node);\n  return parentKeys;\n}\n\n//# sourceURL=webpack://rsuite/./src/Tree/utils/getNodeParentKeys.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/utils/getTreeActiveNode.ts":
+/*!*********************************************!*\
+  !*** ./src/Tree/utils/getTreeActiveNode.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\");\nexports.__esModule = true;\nexports.getTreeActiveNode = getTreeActiveNode;\nvar _shallowEqual = _interopRequireDefault(__webpack_require__(/*! ../../utils/shallowEqual */ \"./src/utils/shallowEqual.ts\"));\n/**\n * Retrieves the active node from a tree based on the provided value and value key.\n */\nfunction getTreeActiveNode(nodes, value, valueKey) {\n  if (typeof value === 'undefined') {\n    return;\n  }\n  for (var refKey in nodes) {\n    var node = nodes[refKey];\n    if ((0, _shallowEqual.default)(node[valueKey], value)) {\n      return node;\n    }\n  }\n}\n\n//# sourceURL=webpack://rsuite/./src/Tree/utils/getTreeActiveNode.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/utils/hasVisibleChildren.ts":
+/*!**********************************************!*\
+  !*** ./src/Tree/utils/hasVisibleChildren.ts ***!
+  \**********************************************/
+/***/ (function(__unused_webpack_module, exports) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.hasVisibleChildren = hasVisibleChildren;\n/**\n * Checks if a node has visible children.\n */\nfunction hasVisibleChildren(node, childrenKey) {\n  if (!Array.isArray(node[childrenKey])) {\n    return false;\n  }\n  return node[childrenKey].some(function (child) {\n    return child.visible;\n  });\n}\n\n//# sourceURL=webpack://rsuite/./src/Tree/utils/hasVisibleChildren.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/utils/indentTreeNode.ts":
+/*!******************************************!*\
+  !*** ./src/Tree/utils/indentTreeNode.ts ***!
+  \******************************************/
+/***/ (function(__unused_webpack_module, exports) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.indentTreeNode = indentTreeNode;\nfunction indentTreeNode(rtl, layer, absolute) {\n  var _ref2;\n  if (absolute === void 0) {\n    absolute = false;\n  }\n  // layer start from 1\n  var offset = layer * 26;\n  if (absolute) {\n    var _ref;\n    return _ref = {}, _ref[rtl ? 'right' : 'left'] = offset, _ref;\n  }\n  return _ref2 = {}, _ref2[rtl ? 'paddingRight' : 'paddingLeft'] = offset, _ref2;\n}\n\n//# sourceURL=webpack://rsuite/./src/Tree/utils/indentTreeNode.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/utils/index.ts":
+/*!*********************************!*\
+  !*** ./src/Tree/utils/index.ts ***!
+  \*********************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.handleRightArrow = exports.handleLeftArrow = exports.focusCurrentItem = exports.focusTreeNode = exports.focusPreviousItem = exports.focusNextItem = exports.getActiveItem = exports.getFocusableItems = exports.isExpand = exports.isSearching = exports.indentTreeNode = exports.formatNodeRefKey = exports.getTreeActiveNode = exports.getExpandItemValues = exports.hasVisibleChildren = exports.WalkTreeStrategy = exports.flattenTree = exports.UNSAFE_flattenTree = exports.getNodeParentKeys = void 0;\nvar _getNodeParentKeys = __webpack_require__(/*! ./getNodeParentKeys */ \"./src/Tree/utils/getNodeParentKeys.ts\");\nexports.getNodeParentKeys = _getNodeParentKeys.getNodeParentKeys;\nvar _flattenTree = __webpack_require__(/*! ./flattenTree */ \"./src/Tree/utils/flattenTree.ts\");\nexports.UNSAFE_flattenTree = _flattenTree.UNSAFE_flattenTree;\nexports.flattenTree = _flattenTree.flattenTree;\nexports.WalkTreeStrategy = _flattenTree.WalkTreeStrategy;\nvar _hasVisibleChildren = __webpack_require__(/*! ./hasVisibleChildren */ \"./src/Tree/utils/hasVisibleChildren.ts\");\nexports.hasVisibleChildren = _hasVisibleChildren.hasVisibleChildren;\nvar _getExpandItemValues = __webpack_require__(/*! ./getExpandItemValues */ \"./src/Tree/utils/getExpandItemValues.ts\");\nexports.getExpandItemValues = _getExpandItemValues.getExpandItemValues;\nvar _getTreeActiveNode = __webpack_require__(/*! ./getTreeActiveNode */ \"./src/Tree/utils/getTreeActiveNode.ts\");\nexports.getTreeActiveNode = _getTreeActiveNode.getTreeActiveNode;\nvar _formatNodeRefKey = __webpack_require__(/*! ./formatNodeRefKey */ \"./src/Tree/utils/formatNodeRefKey.ts\");\nexports.formatNodeRefKey = _formatNodeRefKey.formatNodeRefKey;\nvar _indentTreeNode = __webpack_require__(/*! ./indentTreeNode */ \"./src/Tree/utils/indentTreeNode.ts\");\nexports.indentTreeNode = _indentTreeNode.indentTreeNode;\nvar _isSearching = __webpack_require__(/*! ./isSearching */ \"./src/Tree/utils/isSearching.ts\");\nexports.isSearching = _isSearching.isSearching;\nvar _isExpand = __webpack_require__(/*! ./isExpand */ \"./src/Tree/utils/isExpand.ts\");\nexports.isExpand = _isExpand.isExpand;\nvar _focusableTree = __webpack_require__(/*! ./focusableTree */ \"./src/Tree/utils/focusableTree.ts\");\nexports.getFocusableItems = _focusableTree.getFocusableItems;\nexports.getActiveItem = _focusableTree.getActiveItem;\nexports.focusNextItem = _focusableTree.focusNextItem;\nexports.focusPreviousItem = _focusableTree.focusPreviousItem;\nexports.focusTreeNode = _focusableTree.focusTreeNode;\nexports.focusCurrentItem = _focusableTree.focusCurrentItem;\nvar _treeKeyboardInteractions = __webpack_require__(/*! ./treeKeyboardInteractions */ \"./src/Tree/utils/treeKeyboardInteractions.ts\");\nexports.handleLeftArrow = _treeKeyboardInteractions.handleLeftArrow;\nexports.handleRightArrow = _treeKeyboardInteractions.handleRightArrow;\n\n//# sourceURL=webpack://rsuite/./src/Tree/utils/index.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/utils/isExpand.ts":
+/*!************************************!*\
+  !*** ./src/Tree/utils/isExpand.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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _hasClass = _interopRequireDefault(__webpack_require__(/*! dom-lib/hasClass */ \"./node_modules/dom-lib/esm/hasClass.js\"));\nvar _ArrowDown = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/ArrowDown */ \"./node_modules/@rsuite/icons/legacy/ArrowDown.js\"));\nvar _Spinner = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/Spinner */ \"./node_modules/@rsuite/icons/legacy/Spinner.js\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/TreePicker/TreeNode.tsx\",\n  _this = void 0;\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    renderTreeIcon = _ref.renderTreeIcon,\n    renderTreeNode = _ref.renderTreeNode,\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\", \"renderTreeIcon\", \"renderTreeNode\"]);\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge,\n    withClassPrefix = _useClassNames.withClassPrefix;\n  var handleExpand = (0, _utils.useEventCallback)(function (event) {\n    var _event$nativeEvent, _event$nativeEvent$st;\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  });\n  var handleSelect = (0, _utils.useEventCallback)(function (event) {\n    if (disabled) {\n      return;\n    }\n    if (event.target instanceof HTMLElement) {\n      if ((0, _hasClass.default)(event.target.parentNode, prefix('expand-icon-wrapper'))) {\n        return;\n      }\n    }\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(nodeData, event);\n  });\n  var handleDragStart = (0, _utils.useEventCallback)(function (event) {\n    onDragStart === null || onDragStart === void 0 ? void 0 : onDragStart(nodeData, event);\n  });\n  var handleDragEnter = (0, _utils.useEventCallback)(function (event) {\n    event.preventDefault();\n    event.stopPropagation();\n    onDragEnter === null || onDragEnter === void 0 ? void 0 : onDragEnter(nodeData, event);\n  });\n  var handleDragOver = (0, _utils.useEventCallback)(function (event) {\n    event.preventDefault();\n    event.stopPropagation();\n    onDragOver === null || onDragOver === void 0 ? void 0 : onDragOver(nodeData, event);\n  });\n  var handleDragLeave = (0, _utils.useEventCallback)(function (event) {\n    event.stopPropagation();\n    onDragLeave === null || onDragLeave === void 0 ? void 0 : onDragLeave(nodeData, event);\n  });\n  var handleDragEnd = (0, _utils.useEventCallback)(function (event) {\n    event.stopPropagation();\n    onDragEnd === null || onDragEnd === void 0 ? void 0 : onDragEnd(nodeData, event);\n  });\n  var handleDrop = (0, _utils.useEventCallback)(function (event) {\n    event.preventDefault();\n    event.stopPropagation();\n    onDrop === null || onDrop === void 0 ? void 0 : onDrop(nodeData, event);\n  });\n  var renderIcon = function renderIcon() {\n    var classes = prefix('expand-icon', 'icon', {\n      expanded: expand\n    });\n    var expandIcon = /*#__PURE__*/_react.default.createElement(_ArrowDown.default, {\n      className: classes,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 141,\n        columnNumber: 24\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: 144,\n          columnNumber: 11\n        }\n      }, /*#__PURE__*/_react.default.createElement(_Spinner.default, {\n        spin: true,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 145,\n          columnNumber: 13\n        }\n      }));\n    }\n    if (nodeData !== undefined && typeof renderTreeIcon === 'function') {\n      var customIcon = renderTreeIcon(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: 153,\n          columnNumber: 13\n        }\n      }, customIcon) : expandIcon;\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: 160,\n        columnNumber: 9\n      }\n    }, expandIcon) : null;\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: (0, _treeUtils.stringifyTreeNodeLabel)(label),\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: 180,\n        columnNumber: 9\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"span\", {\n      className: contentClasses,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 189,\n        columnNumber: 11\n      }\n    }, renderTreeNode ? renderTreeNode(nodeData) : label));\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: 204,\n      columnNumber: 7\n    }\n  }), renderIcon(), renderLabel()) : null;\n});\nTreeNode.displayName = 'TreePickerNode';\nvar _default = TreeNode;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/TreePicker/TreeNode.tsx?");
+eval("\n\nexports.__esModule = true;\nexports.isExpand = isExpand;\nvar _isSearching = __webpack_require__(/*! ./isSearching */ \"./src/Tree/utils/isSearching.ts\");\n/**\n * Determines whether the tree node should be expanded based on the search keyword and expand flag.\n * If a search keyword is provided, the node is always expanded.\n * Otherwise, the node is expanded if the expand flag is true.\n */\nfunction isExpand(searchKeyword, expand) {\n  return (0, _isSearching.isSearching)(searchKeyword) ? true : expand;\n}\n\n//# sourceURL=webpack://rsuite/./src/Tree/utils/isExpand.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/utils/isSearching.ts":
+/*!***************************************!*\
+  !*** ./src/Tree/utils/isSearching.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\");\nexports.__esModule = true;\nexports.isSearching = isSearching;\nvar _isEmpty = _interopRequireDefault(__webpack_require__(/*! lodash/isEmpty */ \"./node_modules/lodash/isEmpty.js\"));\nfunction isSearching(searchKeyword) {\n  return !(0, _isEmpty.default)(searchKeyword);\n}\n\n//# sourceURL=webpack://rsuite/./src/Tree/utils/isSearching.ts?");
+
+/***/ }),
+
+/***/ "./src/Tree/utils/treeKeyboardInteractions.ts":
+/*!****************************************************!*\
+  !*** ./src/Tree/utils/treeKeyboardInteractions.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\");\nexports.__esModule = true;\nexports.handleLeftArrow = handleLeftArrow;\nexports.handleRightArrow = handleRightArrow;\nvar _isEmpty = _interopRequireDefault(__webpack_require__(/*! lodash/isEmpty */ \"./node_modules/lodash/isEmpty.js\"));\n/**\n * Handles the left arrow key press event for tree navigation.\n * If the focus item is expanded, it collapses it. If the focus item is not expanded and has a parent,\n * it moves the focus to the parent item.\n */\nfunction handleLeftArrow(props) {\n  var focusItem = props.focusItem,\n    expand = props.expand,\n    onExpand = props.onExpand,\n    onFocusItem = props.onFocusItem;\n  if ((0, _isEmpty.default)(focusItem)) {\n    return;\n  }\n  if (expand) {\n    onExpand === null || onExpand === void 0 ? void 0 : onExpand(focusItem, expand);\n  } else if (focusItem !== null && focusItem !== void 0 && focusItem.parent) {\n    onFocusItem();\n  }\n}\n\n/**\n * Handles the right arrow key press event for tree navigation.\n * If the focused item has children and is collapsed, it expands the item.\n * If the focused item has children and is expanded, it moves the focus to the next sibling.\n * If the focused item does not have children, it does nothing.\n */\nfunction handleRightArrow(props) {\n  var focusItem = props.focusItem,\n    expand = props.expand,\n    childrenKey = props.childrenKey,\n    onExpand = props.onExpand,\n    onFocusItem = props.onFocusItem;\n  if ((0, _isEmpty.default)(focusItem) || !Array.isArray(focusItem[childrenKey])) {\n    return;\n  }\n  if (!expand) {\n    onExpand === null || onExpand === void 0 ? void 0 : onExpand(focusItem, expand);\n  } else {\n    onFocusItem();\n  }\n}\n\n//# sourceURL=webpack://rsuite/./src/Tree/utils/treeKeyboardInteractions.ts?");
 
 /***/ }),
 
@@ -9673,7 +10102,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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _isFunction2 = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _isNil2 = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _isUndefined2 = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\nvar _omit2 = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _pick2 = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _Windowing = __webpack_require__(/*! ../internals/Windowing */ \"./src/internals/Windowing/index.ts\");\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _TreeNode = _interopRequireDefault(__webpack_require__(/*! ./TreeNode */ \"./src/TreePicker/TreeNode.tsx\"));\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _TreeContext = _interopRequireDefault(__webpack_require__(/*! ../Tree/TreeContext */ \"./src/Tree/TreeContext.ts\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/TreePicker/TreePicker.tsx\",\n  _this = void 0;\nvar emptyArray = [];\nvar itemSize = function itemSize() {\n  return 36;\n};\n\n/**\n * The `TreePicker` component is used for selecting single options which are organized in a tree structure.\n *\n * @see https://rsuitejs.com/components/tree-picker/\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    _props$menuMaxHeight = props.menuMaxHeight,\n    menuMaxHeight = _props$menuMaxHeight === void 0 ? 320 : _props$menuMaxHeight,\n    menuStyle = props.menuStyle,\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    _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    _props$defaultExpandA = props.defaultExpandAll,\n    defaultExpandAll = _props$defaultExpandA === void 0 ? false : _props$defaultExpandA,\n    _props$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,\n    controlledExpandItemValues = props.expandItemValues,\n    _props$defaultExpandI = props.defaultExpandItemValues,\n    defaultExpandItemValues = _props$defaultExpandI === void 0 ? emptyArray : _props$defaultExpandI,\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    onSearch = props.onSearch,\n    onSelect = props.onSelect,\n    onSelectItem = props.onSelectItem,\n    onChange = props.onChange,\n    onEntered = props.onEntered,\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\", \"menuMaxHeight\", \"menuStyle\", \"className\", \"disabled\", \"placement\", \"cleanable\", \"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\", \"onSearch\", \"onSelect\", \"onSelectItem\", \"onChange\", \"onEntered\", \"onDragEnd\", \"onDragStart\", \"onDragEnter\", \"onDragLeave\", \"onDragOver\", \"onDrop\", \"onExpand\", \"renderExtraFooter\", \"renderMenu\", \"renderValue\"]);\n  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),\n    rtl = _useCustom.rtl,\n    locale = _useCustom.locale;\n  var _useContext = (0, _react.useContext)(_TreeContext.default),\n    inline = _useContext.inline;\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref, {\n      inline: inline\n    }),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay,\n    list = _usePickerRef.list,\n    searchInput = _usePickerRef.searchInput,\n    treeView = _usePickerRef.treeView;\n  var _useControlled = (0, _utils.useControlled)(controlledValue, defaultValue),\n    value = _useControlled[0],\n    setValue = _useControlled[1],\n    isControlled = _useControlled[2];\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  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  var _useState = (0, _react.useState)(false),\n    active = _useState[0],\n    setActive = _useState[1];\n  var _useState2 = (0, _react.useState)(null),\n    focusItemValue = _useState2[0],\n    setFocusItemValue = _useState2[1];\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  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge;\n  var _useClassNames2 = (0, _utils.useClassNames)(inline && classPrefix !== 'picker' ? classPrefix : 'tree'),\n    treePrefix = _useClassNames2.prefix,\n    withTreeClassPrefix = _useClassNames2.withClassPrefix;\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  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  var _useTreeNodeRefs = (0, _treeUtils.useTreeNodeRefs)(),\n    treeNodesRefs = _useTreeNodeRefs.treeNodesRefs,\n    saveTreeNodeRef = _useTreeNodeRefs.saveTreeNodeRef;\n  var activeNode = (0, _treeUtils.getTreeActiveNode)(flattenNodes, value, valueKey);\n  var getFormattedNodes = function getFormattedNodes(render) {\n    if (virtualized) {\n      return formatVirtualizedTreeData(flattenNodes, filteredData, expandItemValues, {\n        searchKeyword: searchKeywordState\n      }).filter(function (n) {\n        return n.visible;\n      });\n    }\n    return filteredData.map(function (dataItem, index) {\n      return render === null || render === void 0 ? void 0 : render(dataItem, index, 1);\n    });\n  };\n  var focusActiveNode = function focusActiveNode() {\n    if (list.current) {\n      (0, _treeUtils.focusToActiveTreeNode)({\n        list: list.current,\n        valueKey: valueKey,\n        selector: \".\" + treePrefix('node-active'),\n        activeNode: activeNode,\n        virtualized: virtualized,\n        container: treeView.current,\n        formattedNodes: getFormattedNodes()\n      });\n    }\n  };\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 = function getDropData(nodeData) {\n    var options = {\n      valueKey: valueKey,\n      childrenKey: childrenKey\n    };\n    return {\n      /** draggingNode */\n      dragNode: dragNode,\n      /** dropNode */\n      dropNode: nodeData,\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  };\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      renderTreeNode: renderTreeNode,\n      renderTreeIcon: renderTreeIcon\n    };\n  };\n\n  // TODO-Doma\n  // Replace `getKeyParentMap` with `getParentMap`\n  var itemParentMap = (0, _react.useMemo)(function () {\n    return (0, _treeUtils.getKeyParentMap)(data, function (node) {\n      return node[valueKey];\n    }, function (node) {\n      return node[childrenKey];\n    });\n  }, [childrenKey, data, valueKey]);\n  var handleSelect = (0, _utils.useEventCallback)(function (nodeData, event) {\n    var _target$current, _trigger$current, _trigger$current$clos;\n    if (!nodeData) {\n      return;\n    }\n    var nodeValue = nodeData[valueKey];\n    if (!isControlled) {\n      setValue(nodeValue);\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    onSelectItem === null || onSelectItem === void 0 ? void 0 : onSelectItem(nodeData, (0, _treeUtils.getPathTowardsItem)(nodeData, function (item) {\n      return itemParentMap.get(item[valueKey]);\n    }));\n    (_target$current = target.current) === null || _target$current === void 0 ? void 0 : _target$current.focus();\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 ? void 0 : _trigger$current$clos.call(_trigger$current);\n  });\n  var handleExpand = (0, _utils.useEventCallback)(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    if ((0, _isFunction2.default)(getChildren) && !node.expand && Array.isArray(node[childrenKey]) && node[childrenKey].length === 0) {\n      loadChildren(node, getChildren);\n    }\n  });\n  var handleDragStart = (0, _utils.useEventCallback)(function (nodeData, event) {\n    if (draggable) {\n      var _event$dataTransfer;\n      var dragMoverNode = (0, _treeUtils.createDragPreview)((0, _treeUtils.stringifyTreeNodeLabel)(nodeData[labelKey]), treePrefix('drag-preview'));\n      (_event$dataTransfer = event.dataTransfer) === null || _event$dataTransfer === void 0 ? void 0 : _event$dataTransfer.setDragImage(dragMoverNode, 0, 0);\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  });\n  var handleDragEnter = (0, _utils.useEventCallback)(function (nodeData, event) {\n    if (dragNodeKeys.some(function (d) {\n      return (0, _utils.shallowEqual)(d, nodeData[valueKey]);\n    })) {\n      return;\n    }\n    if (dragNode) {\n      setDragOverNodeKey(nodeData[valueKey]);\n      setDropNodePosition((0, _treeUtils.calDropNodePosition)(event, treeNodesRefs[nodeData.refKey]));\n    }\n    onDragEnter === null || onDragEnter === void 0 ? void 0 : onDragEnter(nodeData, event);\n  });\n  var handleDragOver = (0, _utils.useEventCallback)(function (nodeData, event) {\n    if (dragNodeKeys.some(function (d) {\n      return (0, _utils.shallowEqual)(d, nodeData[valueKey]);\n    })) {\n      event.dataTransfer.dropEffect = 'none';\n      return;\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    onDragOver === null || onDragOver === void 0 ? void 0 : onDragOver(nodeData, event);\n  });\n  var handleDragLeave = (0, _utils.useEventCallback)(function (nodeData, event) {\n    onDragLeave === null || onDragLeave === void 0 ? void 0 : onDragLeave(nodeData, event);\n  });\n  var handleDragEnd = (0, _utils.useEventCallback)(function (nodeData, event) {\n    (0, _treeUtils.removeDragPreview)();\n    setDragNode(null);\n    setDragNodeKeys([]);\n    setDragOverNodeKey(null);\n    onDragEnd === null || onDragEnd === void 0 ? void 0 : onDragEnd(nodeData, event);\n  });\n  var handleDrop = (0, _utils.useEventCallback)(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    (0, _treeUtils.removeDragPreview)();\n    setDragNode(null);\n    setDragNodeKeys([]);\n    setDragOverNodeKey(null);\n  });\n  var handleOpen = (0, _utils.useEventCallback)(function () {\n    focusActiveNode();\n    setActive(true);\n  });\n  var handleClose = (0, _utils.useEventCallback)(function () {\n    var _target$current2;\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    (_target$current2 = target.current) === null || _target$current2 === void 0 ? void 0 : _target$current2.focus();\n  });\n  var handleFocusItem = (0, _utils.useEventCallback)(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    if (key === _utils.KEY_VALUES.DOWN) {\n      (0, _treeUtils.focusNextItem)(focusProps);\n      return;\n    }\n    if (key === _utils.KEY_VALUES.UP) {\n      (0, _treeUtils.focusPreviousItem)(focusProps);\n    }\n  });\n  var handleLeftArrow = (0, _utils.useEventCallback)(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        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  });\n  var handleRightArrow = (0, _utils.useEventCallback)(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  });\n  var selectActiveItem = (0, _utils.useEventCallback)(function (event) {\n    if ((0, _isNil2.default)(focusItemValue)) return;\n    var activeItem = (0, _treeUtils.getActiveItem)(focusItemValue, flattenNodes, valueKey);\n    handleSelect(activeItem, event);\n  });\n  var handleClean = (0, _utils.useEventCallback)(function (event) {\n    var nullValue = null;\n    var target = event.target;\n    // exclude searchbox\n    if (target.matches('input[role=\"searchbox\"]') || disabled || !cleanable) {\n      return;\n    }\n    if (!isControlled) {\n      setValue(null);\n    }\n    onChange === null || onChange === void 0 ? void 0 : onChange(nullValue, event);\n  });\n  var onPickerKeydown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !activeNode || !active,\n    trigger: trigger,\n    target: target,\n    overlay: overlay,\n    searchInput: searchInput,\n    active: active,\n    onExit: handleClean,\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, _utils.useEventCallback)(function (event) {\n    if (!treeView.current) {\n      return;\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  });\n  var renderNode = function renderNode(node, index, layer) {\n    if (!node.visible) {\n      return null;\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    if (nodeProps.hasChildren) {\n      var _merge;\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: 636,\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: 637,\n          columnNumber: 11\n        }\n      })), /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: treePrefix('group'),\n        role: \"group\",\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 638,\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: 641,\n          columnNumber: 15\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: 651,\n        columnNumber: 7\n      }\n    }));\n  };\n  var renderVirtualListNode = function renderVirtualListNode(_ref3) {\n    var index = _ref3.index,\n      style = _ref3.style,\n      data = _ref3.data;\n    var node = data[index];\n    var layer = node.layer,\n      visible = node.visible;\n    var expand = (0, _treeUtils.getExpandWhenSearching)(searchKeywordState, expandItemValues.includes(node[valueKey]));\n    if (!node.visible) {\n      return null;\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    }, nodeProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 677,\n        columnNumber: 23\n      }\n    }));\n  };\n  var renderTree = function renderTree() {\n    var _merge2;\n    var classes = merge(withTreeClassPrefix({\n      virtualized: virtualized\n    }), (_merge2 = {}, _merge2[className !== null && className !== void 0 ? className : ''] = inline, _merge2));\n    var formattedNodes = getFormattedNodes(renderNode);\n    var treeViewProps = {\n      ref: treeView\n    };\n    if (inline) {\n      treeViewProps = (0, _extends2.default)({\n        ref: root,\n        style: (0, _extends2.default)({\n          height: height\n        }, style),\n        onKeyDown: handleTreeKeyDown\n      }, rest);\n    }\n    return /*#__PURE__*/_react.default.createElement(_Picker.TreeView, (0, _extends2.default)({}, treeViewProps, {\n      treeRootClassName: treePrefix('root'),\n      className: classes,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 698,\n        columnNumber: 7\n      }\n    }), virtualized ? /*#__PURE__*/_react.default.createElement(_Windowing.AutoSizer, {\n      defaultHeight: inline ? height : menuMaxHeight,\n      style: {\n        width: 'auto',\n        height: 'auto'\n      },\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 700,\n        columnNumber: 11\n      }\n    }, function (_ref5) {\n      var height = _ref5.height;\n      return /*#__PURE__*/_react.default.createElement(_Windowing.List, (0, _extends2.default)({\n        ref: list,\n        height: height,\n        itemSize: itemSize,\n        itemCount: formattedNodes.length,\n        itemData: formattedNodes\n      }, listProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 705,\n          columnNumber: 15\n        }\n      }), renderVirtualListNode);\n    }) : formattedNodes);\n  };\n  var renderTreeView = function renderTreeView(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    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      autoWidth: menuAutoWidth,\n      className: classes,\n      style: mergedMenuStyle,\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      onKeyDown: onPickerKeydown,\n      target: trigger,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 730,\n        columnNumber: 7\n      }\n    }, searchable ? /*#__PURE__*/_react.default.createElement(_SearchBox.default, {\n      placeholder: locale.searchPlaceholder,\n      onChange: handleSearch,\n      value: searchKeywordState,\n      inputRef: searchInput,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 739,\n        columnNumber: 11\n      }\n    }) : null, renderMenu ? renderMenu(renderTree()) : renderTree(), renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\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  var hasValidValue = !(0, _isNil2.default)(activeNode) || !(0, _isNil2.default)(value) && (0, _isFunction2.default)(renderValue);\n  var selectedElement = placeholder;\n  if (hasValidValue) {\n    var node = activeNode !== null && activeNode !== void 0 ? activeNode : {};\n    selectedElement = node[labelKey];\n    if ((0, _isFunction2.default)(renderValue) && value) {\n      selectedElement = renderValue(value, node, selectedElement);\n      if ((0, _isNil2.default)(selectedElement)) {\n        hasValidValue = false;\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  if (inline) {\n    return renderTree();\n  }\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    id: id,\n    popupType: \"tree\",\n    pickerProps: (0, _pick2.default)(props, _Picker.pickTriggerPropKeys),\n    ref: trigger,\n    placement: placement,\n    onEnter: handleOpen,\n    onEntered: onEntered,\n    onExit: onExit,\n    onExited: (0, _utils.createChainedFunction)(handleClose, onExited),\n    speaker: renderTreeView,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 784,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    ref: root,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 796,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit2.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys, ['cascade'])), {\n    ref: target,\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    focusItemValue: focusItemValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 797,\n      columnNumber: 9\n    }\n  }), selectedElement || locale.placeholder)));\n});\nTreePicker.displayName = 'TreePicker';\nTreePicker.propTypes = (0, _extends2.default)({}, _Picker.listPickerPropTypes, {\n  locale: _propTypes.default.any,\n  appearance: (0, _propTypes2.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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _isFunction2 = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _isNil2 = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _omit2 = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _pick2 = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../Tree/utils */ \"./src/Tree/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _useTreeWithChildren2 = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useTreeWithChildren */ \"./src/Tree/hooks/useTreeWithChildren.ts\"));\nvar _useFlattenTree = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useFlattenTree */ \"./src/Tree/hooks/useFlattenTree.ts\"));\nvar _useFocusState2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFocusState */ \"./src/TreePicker/hooks/useFocusState.ts\"));\nvar _useExpandTree2 = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useExpandTree */ \"./src/Tree/hooks/useExpandTree.ts\"));\nvar _TreeView = _interopRequireDefault(__webpack_require__(/*! ../Tree/TreeView */ \"./src/Tree/TreeView.tsx\"));\nvar _TreeProvider = __webpack_require__(/*! ../Tree/TreeProvider */ \"./src/Tree/TreeProvider.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/TreePicker/TreePicker.tsx\",\n  _this = void 0;\n/**\n * The `TreePicker` component is used for selecting single options which are organized in a tree structure.\n *\n * @see https://rsuitejs.com/components/tree-picker/\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$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$cleanable = props.cleanable,\n    cleanable = _props$cleanable === void 0 ? true : _props$cleanable,\n    _props$childrenKey = props.childrenKey,\n    childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,\n    _props$data = props.data,\n    data = _props$data === void 0 ? [] : _props$data,\n    disabled = props.disabled,\n    defaultValue = props.defaultValue,\n    _props$defaultExpandA = props.defaultExpandAll,\n    defaultExpandAll = _props$defaultExpandA === void 0 ? false : _props$defaultExpandA,\n    _props$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? [] : _props$disabledItemVa,\n    _props$defaultExpandI = props.defaultExpandItemValues,\n    defaultExpandItemValues = _props$defaultExpandI === void 0 ? [] : _props$defaultExpandI,\n    controlledExpandItemValues = props.expandItemValues,\n    id = props.id,\n    overrideLocale = props.locale,\n    _props$labelKey = props.labelKey,\n    labelKey = _props$labelKey === void 0 ? 'label' : _props$labelKey,\n    placeholder = props.placeholder,\n    _props$placement = props.placement,\n    placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n    style = props.style,\n    searchKeyword = props.searchKeyword,\n    _props$searchable = props.searchable,\n    searchable = _props$searchable === void 0 ? true : _props$searchable,\n    showIndentLine = props.showIndentLine,\n    DEPRECATED_menuClassName = props.menuClassName,\n    DEPRECATED_menuStyle = props.menuStyle,\n    popupClassName = props.popupClassName,\n    popupStyle = props.popupStyle,\n    _props$popupAutoWidth = props.popupAutoWidth,\n    popupAutoWidth = _props$popupAutoWidth === void 0 ? true : _props$popupAutoWidth,\n    _props$treeHeight = props.treeHeight,\n    treeHeight = _props$treeHeight === void 0 ? 320 : _props$treeHeight,\n    _props$menuAutoWidth = props.menuAutoWidth,\n    menuAutoWidth = _props$menuAutoWidth === void 0 ? popupAutoWidth : _props$menuAutoWidth,\n    _props$valueKey = props.valueKey,\n    valueKey = _props$valueKey === void 0 ? 'value' : _props$valueKey,\n    _props$virtualized = props.virtualized,\n    virtualized = _props$virtualized === void 0 ? false : _props$virtualized,\n    controlledValue = props.value,\n    listProps = props.listProps,\n    toggleAs = props.toggleAs,\n    searchBy = props.searchBy,\n    getChildren = props.getChildren,\n    onClean = props.onClean,\n    onSearch = props.onSearch,\n    onSelect = props.onSelect,\n    onSelectItem = props.onSelectItem,\n    onChange = props.onChange,\n    onExpand = props.onExpand,\n    onEnter = props.onEnter,\n    onExit = props.onExit,\n    onEntered = props.onEntered,\n    renderValue = props.renderValue,\n    DEPRECATED_renderMenu = props.renderMenu,\n    _props$renderTree = props.renderTree,\n    renderTree = _props$renderTree === void 0 ? DEPRECATED_renderMenu : _props$renderTree,\n    renderTreeIcon = props.renderTreeIcon,\n    renderTreeNode = props.renderTreeNode,\n    renderExtraFooter = props.renderExtraFooter,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"as\", \"appearance\", \"classPrefix\", \"cleanable\", \"childrenKey\", \"data\", \"disabled\", \"defaultValue\", \"defaultExpandAll\", \"disabledItemValues\", \"defaultExpandItemValues\", \"expandItemValues\", \"id\", \"locale\", \"labelKey\", \"placeholder\", \"placement\", \"style\", \"searchKeyword\", \"searchable\", \"showIndentLine\", \"menuClassName\", \"menuStyle\", \"popupClassName\", \"popupStyle\", \"popupAutoWidth\", \"treeHeight\", \"menuAutoWidth\", \"valueKey\", \"virtualized\", \"value\", \"listProps\", \"toggleAs\", \"searchBy\", \"getChildren\", \"onClean\", \"onSearch\", \"onSelect\", \"onSelectItem\", \"onChange\", \"onExpand\", \"onEnter\", \"onExit\", \"onEntered\", \"renderValue\", \"renderMenu\", \"renderTree\", \"renderTreeIcon\", \"renderTreeNode\", \"renderExtraFooter\"]);\n  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),\n    locale = _useCustom.locale;\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay,\n    list = _usePickerRef.list,\n    searchInput = _usePickerRef.searchInput,\n    treeView = _usePickerRef.treeView;\n  var _useControlled = (0, _utils.useControlled)(controlledValue, defaultValue),\n    value = _useControlled[0],\n    setValue = _useControlled[1];\n  var itemDataKeys = {\n    childrenKey: childrenKey,\n    labelKey: labelKey,\n    valueKey: valueKey\n  };\n  var _useTreeWithChildren = (0, _useTreeWithChildren2.default)(data, itemDataKeys),\n    treeData = _useTreeWithChildren.treeData,\n    loadingNodeValues = _useTreeWithChildren.loadingNodeValues,\n    appendChild = _useTreeWithChildren.appendChild;\n  var flattenedNodes = (0, _useFlattenTree.default)(treeData, (0, _extends2.default)({}, itemDataKeys));\n  var _useExpandTree = (0, _useExpandTree2.default)(data, (0, _extends2.default)({}, itemDataKeys, {\n      defaultExpandAll: defaultExpandAll,\n      defaultExpandItemValues: defaultExpandItemValues,\n      controlledExpandItemValues: controlledExpandItemValues,\n      onExpand: onExpand,\n      getChildren: getChildren,\n      appendChild: appendChild\n    })),\n    expandItemValues = _useExpandTree.expandItemValues,\n    handleExpandTreeNode = _useExpandTree.handleExpandTreeNode;\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge;\n  var activeNode = (0, _utils2.getTreeActiveNode)(flattenedNodes, value, valueKey);\n  var _useTreeImperativeHan = (0, _TreeProvider.useTreeImperativeHandle)(),\n    register = _useTreeImperativeHan.register,\n    focusFirstNode = _useTreeImperativeHan.focusFirstNode,\n    focusActiveNode = _useTreeImperativeHan.focusActiveNode;\n  var _useFocusState = (0, _useFocusState2.default)({\n      focusActiveNode: focusActiveNode,\n      target: target,\n      value: value,\n      onEnter: onEnter,\n      onExit: onExit,\n      onEntered: onEntered\n    }),\n    active = _useFocusState.active,\n    focusItemValue = _useFocusState.focusItemValue,\n    setFocusItemValue = _useFocusState.setFocusItemValue,\n    triggerProps = _useFocusState.triggerProps;\n  var handleSelect = (0, _utils.useEventCallback)(function (treeNode, value, event) {\n    var _target$current, _trigger$current, _trigger$current$clos;\n    setFocusItemValue(value);\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(treeNode, value, event);\n    (_target$current = target.current) === null || _target$current === void 0 ? void 0 : _target$current.focus();\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 ? void 0 : _trigger$current$clos.call(_trigger$current);\n  });\n  var handleClean = (0, _utils.useEventCallback)(function (event) {\n    var target = event.target;\n    // exclude searchbox\n    if (target.matches('input[role=\"searchbox\"]') || disabled || !cleanable) {\n      return;\n    }\n    setValue(null);\n    onChange === null || onChange === void 0 ? void 0 : onChange(null, event);\n  });\n  var handleTreePressEnter = (0, _utils.useEventCallback)(function (event) {\n    if ((0, _isNil2.default)(focusItemValue)) {\n      return;\n    }\n    var activeItem = (0, _utils2.getActiveItem)(focusItemValue, flattenedNodes, valueKey);\n    handleSelect(activeItem, event);\n  });\n  var handleTreeKeyDown = (0, _utils.useEventCallback)(function (event) {\n    (0, _Picker.onMenuKeyDown)(event, {\n      del: handleClean,\n      down: function down() {\n        return focusFirstNode();\n      },\n      enter: handleTreePressEnter\n    });\n  });\n  var onPickerKeydown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({\n    toggle: !activeNode || !active,\n    trigger: trigger,\n    target: target,\n    overlay: overlay,\n    searchInput: searchInput,\n    active: active,\n    onExit: handleClean,\n    onMenuKeyDown: handleTreeKeyDown\n  }, rest));\n  var handleChange = (0, _utils.useEventCallback)(function (nextValue, event) {\n    setValue(nextValue);\n    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n  });\n  var treeContext = (0, _react.useMemo)(function () {\n    return {\n      register: register,\n      props: {\n        labelKey: labelKey,\n        valueKey: valueKey,\n        childrenKey: childrenKey,\n        virtualized: virtualized,\n        renderTreeIcon: renderTreeIcon,\n        renderTreeNode: renderTreeNode\n      }\n    };\n  }, [childrenKey, labelKey, valueKey, virtualized, register, renderTreeIcon, renderTreeNode]);\n  var tree = /*#__PURE__*/_react.default.createElement(_TreeProvider.TreeProvider, {\n    value: treeContext,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 234,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(_TreeView.default, {\n    ref: treeView,\n    virtualized: virtualized,\n    value: value,\n    data: treeData,\n    disabledItemValues: disabledItemValues,\n    expandItemValues: expandItemValues,\n    showIndentLine: showIndentLine,\n    searchable: searchable,\n    searchKeyword: searchKeyword,\n    searchBy: searchBy,\n    loadingNodeValues: loadingNodeValues,\n    flattenedNodes: flattenedNodes,\n    listProps: listProps,\n    listRef: list,\n    height: treeHeight,\n    onExpand: handleExpandTreeNode,\n    onSearch: onSearch,\n    onChange: handleChange,\n    onSelect: handleSelect,\n    onSelectItem: onSelectItem,\n    onFocusItem: setFocusItemValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 235,\n      columnNumber: 7\n    }\n  }));\n  var renderTreeView = function renderTreeView(positionProps, speakerRef) {\n    var left = positionProps.left,\n      top = positionProps.top,\n      className = positionProps.className;\n    var classes = merge(className, DEPRECATED_menuClassName, popupClassName, prefix('tree-menu'));\n    var mergedMenuStyle = (0, _extends2.default)({}, DEPRECATED_menuStyle, popupStyle, {\n      left: left,\n      top: top\n    });\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      autoWidth: menuAutoWidth,\n      className: classes,\n      style: mergedMenuStyle,\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      onKeyDown: onPickerKeydown,\n      target: trigger,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 267,\n        columnNumber: 7\n      }\n    }, renderTree ? renderTree(tree) : tree, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\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  var hasValidValue = !(0, _isNil2.default)(activeNode) || !(0, _isNil2.default)(value) && (0, _isFunction2.default)(renderValue);\n  var selectedElement = placeholder;\n  if (hasValidValue) {\n    var node = activeNode !== null && activeNode !== void 0 ? activeNode : {};\n    selectedElement = node[labelKey];\n    if ((0, _isFunction2.default)(renderValue) && value) {\n      selectedElement = renderValue(value, node, selectedElement);\n      if ((0, _isNil2.default)(selectedElement)) {\n        hasValidValue = false;\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  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, (0, _extends2.default)({\n    id: id,\n    popupType: \"tree\",\n    pickerProps: (0, _pick2.default)(props, _Picker.pickTriggerPropKeys),\n    ref: trigger,\n    placement: placement,\n    speaker: renderTreeView\n  }, triggerProps, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 309,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(Component, {\n    className: classes,\n    style: style,\n    ref: root,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 318,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit2.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys, ['cascade'])), {\n    ref: target,\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    focusItemValue: focusItemValue,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 319,\n      columnNumber: 9\n    }\n  }), selectedElement || locale.placeholder)));\n});\nTreePicker.displayName = 'TreePicker';\nvar _default = TreePicker;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/TreePicker/TreePicker.tsx?");
+
+/***/ }),
+
+/***/ "./src/TreePicker/hooks/useFocusState.ts":
+/*!***********************************************!*\
+  !*** ./src/TreePicker/hooks/useFocusState.ts ***!
+  \***********************************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nfunction useFocusState(props) {\n  var target = props.target,\n    value = props.value,\n    focusActiveNode = props.focusActiveNode;\n  var _useState = (0, _react.useState)(false),\n    active = _useState[0],\n    setActive = _useState[1];\n  var _useState2 = (0, _react.useState)(null),\n    focusItemValue = _useState2[0],\n    setFocusItemValue = _useState2[1];\n  var focusTarget = (0, _utils.useEventCallback)(function () {\n    var _target$current;\n    (_target$current = target.current) === null || _target$current === void 0 ? void 0 : _target$current.focus();\n  });\n  var onEnter = (0, _utils.useEventCallback)(function (node) {\n    var _props$onEnter;\n    setActive(true);\n    (_props$onEnter = props.onEnter) === null || _props$onEnter === void 0 ? void 0 : _props$onEnter.call(props, node);\n  });\n  var onExit = (0, _utils.useEventCallback)(function (node) {\n    var _props$onExit;\n    setActive(false);\n    focusTarget();\n    (_props$onExit = props.onExit) === null || _props$onExit === void 0 ? void 0 : _props$onExit.call(props, node);\n  });\n  var onEntered = (0, _utils.useEventCallback)(function (node) {\n    var _props$onEntered;\n    if (value) {\n      setFocusItemValue(value);\n      focusActiveNode();\n    }\n    (_props$onEntered = props.onEntered) === null || _props$onEntered === void 0 ? void 0 : _props$onEntered.call(props, node);\n  });\n  return {\n    active: active,\n    focusItemValue: focusItemValue,\n    setFocusItemValue: setFocusItemValue,\n    triggerProps: {\n      onEnter: onEnter,\n      onExit: onExit,\n      onEntered: onEntered\n    }\n  };\n}\nvar _default = useFocusState;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/TreePicker/hooks/useFocusState.ts?");
 
 /***/ }),
 
@@ -9783,7 +10223,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\");\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports.useFormClassNames = exports.Accordion = exports.Tabs = exports.VisuallyHidden = exports.useMediaQuery = exports.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.Table = exports.PanelGroup = exports.Panel = exports.MultiCascadeTree = exports.CascadeTree = exports.CheckTree = exports.Tree = exports.InlineEdit = exports.Rate = exports.RangeSlider = exports.Slider = exports.Uploader = exports.AutoComplete = exports.DateRangePicker = exports.DateRangeInput = exports.DatePicker = exports.DateInput = exports.MultiCascader = exports.Cascader = exports.CheckTreePicker = exports.TreePicker = exports.TagInput = exports.TagPicker = exports.InputPicker = exports.CheckPicker = exports.SelectPicker = exports.RadioTileGroup = exports.RadioTile = exports.RadioGroup = exports.Radio = exports.CheckboxGroup = exports.Checkbox = exports.InputGroup = exports.InputNumber = exports.MaskedInput = exports.Input = exports.Toggle = exports.Form = exports.Steps = exports.Pagination = exports.Breadcrumb = exports.Sidenav = exports.Navbar = exports.Nav = exports.AvatarGroup = exports.Avatar = exports.Progress = exports.useToaster = exports.toaster = exports.Badge = exports.Placeholder = exports.Loader = exports.Message = exports.Notification = exports.Dropdown = exports.Drawer = exports.Modal = exports.Popover = exports.Tooltip = exports.Whisper = exports.ButtonGroup = exports.ButtonToolbar = exports.IconButton = exports.Button = exports.SafeAnchor = exports.HeadingGroup = exports.Heading = exports.Text = void 0;\nvar _Text = _interopRequireDefault(__webpack_require__(/*! ./Text */ \"./src/Text/index.tsx\"));\nexports.Text = _Text.default;\nvar _Heading = _interopRequireDefault(__webpack_require__(/*! ./Heading */ \"./src/Heading/index.tsx\"));\nexports.Heading = _Heading.default;\nvar _HeadingGroup = _interopRequireDefault(__webpack_require__(/*! ./HeadingGroup */ \"./src/HeadingGroup/index.tsx\"));\nexports.HeadingGroup = _HeadingGroup.default;\nvar _SafeAnchor = _interopRequireDefault(__webpack_require__(/*! ./SafeAnchor */ \"./src/SafeAnchor/index.tsx\"));\nexports.SafeAnchor = _SafeAnchor.default;\nvar _Button = _interopRequireDefault(__webpack_require__(/*! ./Button */ \"./src/Button/index.tsx\"));\nexports.Button = _Button.default;\nvar _IconButton = _interopRequireDefault(__webpack_require__(/*! ./IconButton */ \"./src/IconButton/index.tsx\"));\nexports.IconButton = _IconButton.default;\nvar _ButtonToolbar = _interopRequireDefault(__webpack_require__(/*! ./ButtonToolbar */ \"./src/ButtonToolbar/index.tsx\"));\nexports.ButtonToolbar = _ButtonToolbar.default;\nvar _ButtonGroup = _interopRequireDefault(__webpack_require__(/*! ./ButtonGroup */ \"./src/ButtonGroup/index.tsx\"));\nexports.ButtonGroup = _ButtonGroup.default;\nvar _Whisper = _interopRequireDefault(__webpack_require__(/*! ./Whisper */ \"./src/Whisper/index.tsx\"));\nexports.Whisper = _Whisper.default;\nvar _Tooltip = _interopRequireDefault(__webpack_require__(/*! ./Tooltip */ \"./src/Tooltip/index.tsx\"));\nexports.Tooltip = _Tooltip.default;\nvar _Popover = _interopRequireDefault(__webpack_require__(/*! ./Popover */ \"./src/Popover/index.tsx\"));\nexports.Popover = _Popover.default;\nvar _Modal = _interopRequireDefault(__webpack_require__(/*! ./Modal */ \"./src/Modal/index.tsx\"));\nexports.Modal = _Modal.default;\nvar _Drawer = _interopRequireDefault(__webpack_require__(/*! ./Drawer */ \"./src/Drawer/index.tsx\"));\nexports.Drawer = _Drawer.default;\nvar _Dropdown = _interopRequireDefault(__webpack_require__(/*! ./Dropdown */ \"./src/Dropdown/index.tsx\"));\nexports.Dropdown = _Dropdown.default;\nvar _Notification = _interopRequireDefault(__webpack_require__(/*! ./Notification */ \"./src/Notification/index.tsx\"));\nexports.Notification = _Notification.default;\nvar _Message = _interopRequireDefault(__webpack_require__(/*! ./Message */ \"./src/Message/index.tsx\"));\nexports.Message = _Message.default;\nvar _Loader = _interopRequireDefault(__webpack_require__(/*! ./Loader */ \"./src/Loader/index.tsx\"));\nexports.Loader = _Loader.default;\nvar _Placeholder = _interopRequireDefault(__webpack_require__(/*! ./Placeholder */ \"./src/Placeholder/index.tsx\"));\nexports.Placeholder = _Placeholder.default;\nvar _Badge = _interopRequireDefault(__webpack_require__(/*! ./Badge */ \"./src/Badge/index.tsx\"));\nexports.Badge = _Badge.default;\nvar _toaster = _interopRequireDefault(__webpack_require__(/*! ./toaster */ \"./src/toaster/index.tsx\"));\nexports.toaster = _toaster.default;\nvar _useToaster = _interopRequireDefault(__webpack_require__(/*! ./useToaster */ \"./src/useToaster/index.tsx\"));\nexports.useToaster = _useToaster.default;\nvar _Progress = _interopRequireDefault(__webpack_require__(/*! ./Progress */ \"./src/Progress/index.tsx\"));\nexports.Progress = _Progress.default;\nvar _Avatar = _interopRequireDefault(__webpack_require__(/*! ./Avatar */ \"./src/Avatar/index.tsx\"));\nexports.Avatar = _Avatar.default;\nvar _AvatarGroup = _interopRequireDefault(__webpack_require__(/*! ./AvatarGroup */ \"./src/AvatarGroup/index.tsx\"));\nexports.AvatarGroup = _AvatarGroup.default;\nvar _Nav = _interopRequireDefault(__webpack_require__(/*! ./Nav */ \"./src/Nav/index.tsx\"));\nexports.Nav = _Nav.default;\nvar _Navbar = _interopRequireDefault(__webpack_require__(/*! ./Navbar */ \"./src/Navbar/index.tsx\"));\nexports.Navbar = _Navbar.default;\nvar _Sidenav = _interopRequireDefault(__webpack_require__(/*! ./Sidenav */ \"./src/Sidenav/index.tsx\"));\nexports.Sidenav = _Sidenav.default;\nvar _Breadcrumb = _interopRequireDefault(__webpack_require__(/*! ./Breadcrumb */ \"./src/Breadcrumb/index.tsx\"));\nexports.Breadcrumb = _Breadcrumb.default;\nvar _Pagination = _interopRequireDefault(__webpack_require__(/*! ./Pagination */ \"./src/Pagination/index.tsx\"));\nexports.Pagination = _Pagination.default;\nvar _Steps = _interopRequireDefault(__webpack_require__(/*! ./Steps */ \"./src/Steps/index.tsx\"));\nexports.Steps = _Steps.default;\nvar _Form = _interopRequireWildcard(__webpack_require__(/*! ./Form */ \"./src/Form/index.tsx\"));\nexports.Form = _Form.default;\nexports.useFormClassNames = _Form.useFormClassNames;\nvar _Toggle = _interopRequireDefault(__webpack_require__(/*! ./Toggle */ \"./src/Toggle/index.tsx\"));\nexports.Toggle = _Toggle.default;\nvar _Input = _interopRequireDefault(__webpack_require__(/*! ./Input */ \"./src/Input/index.tsx\"));\nexports.Input = _Input.default;\nvar _MaskedInput = _interopRequireDefault(__webpack_require__(/*! ./MaskedInput */ \"./src/MaskedInput/index.tsx\"));\nexports.MaskedInput = _MaskedInput.default;\nvar _InputNumber = _interopRequireDefault(__webpack_require__(/*! ./InputNumber */ \"./src/InputNumber/index.tsx\"));\nexports.InputNumber = _InputNumber.default;\nvar _InputGroup = _interopRequireDefault(__webpack_require__(/*! ./InputGroup */ \"./src/InputGroup/index.tsx\"));\nexports.InputGroup = _InputGroup.default;\nvar _Checkbox = _interopRequireDefault(__webpack_require__(/*! ./Checkbox */ \"./src/Checkbox/index.tsx\"));\nexports.Checkbox = _Checkbox.default;\nvar _CheckboxGroup = _interopRequireDefault(__webpack_require__(/*! ./CheckboxGroup */ \"./src/CheckboxGroup/index.tsx\"));\nexports.CheckboxGroup = _CheckboxGroup.default;\nvar _Radio = _interopRequireDefault(__webpack_require__(/*! ./Radio */ \"./src/Radio/index.tsx\"));\nexports.Radio = _Radio.default;\nvar _RadioGroup = _interopRequireDefault(__webpack_require__(/*! ./RadioGroup */ \"./src/RadioGroup/index.tsx\"));\nexports.RadioGroup = _RadioGroup.default;\nvar _RadioTile = _interopRequireDefault(__webpack_require__(/*! ./RadioTile */ \"./src/RadioTile/index.tsx\"));\nexports.RadioTile = _RadioTile.default;\nvar _RadioTileGroup = _interopRequireDefault(__webpack_require__(/*! ./RadioTileGroup */ \"./src/RadioTileGroup/index.tsx\"));\nexports.RadioTileGroup = _RadioTileGroup.default;\nvar _SelectPicker = _interopRequireDefault(__webpack_require__(/*! ./SelectPicker */ \"./src/SelectPicker/index.tsx\"));\nexports.SelectPicker = _SelectPicker.default;\nvar _CheckPicker = _interopRequireDefault(__webpack_require__(/*! ./CheckPicker */ \"./src/CheckPicker/index.tsx\"));\nexports.CheckPicker = _CheckPicker.default;\nvar _InputPicker = _interopRequireDefault(__webpack_require__(/*! ./InputPicker */ \"./src/InputPicker/index.tsx\"));\nexports.InputPicker = _InputPicker.default;\nvar _TagPicker = _interopRequireDefault(__webpack_require__(/*! ./TagPicker */ \"./src/TagPicker/index.tsx\"));\nexports.TagPicker = _TagPicker.default;\nvar _TagInput = _interopRequireDefault(__webpack_require__(/*! ./TagInput */ \"./src/TagInput/index.tsx\"));\nexports.TagInput = _TagInput.default;\nvar _TreePicker = _interopRequireDefault(__webpack_require__(/*! ./TreePicker */ \"./src/TreePicker/index.tsx\"));\nexports.TreePicker = _TreePicker.default;\nvar _CheckTreePicker = _interopRequireDefault(__webpack_require__(/*! ./CheckTreePicker */ \"./src/CheckTreePicker/index.tsx\"));\nexports.CheckTreePicker = _CheckTreePicker.default;\nvar _Cascader = _interopRequireDefault(__webpack_require__(/*! ./Cascader */ \"./src/Cascader/index.tsx\"));\nexports.Cascader = _Cascader.default;\nvar _MultiCascader = _interopRequireDefault(__webpack_require__(/*! ./MultiCascader */ \"./src/MultiCascader/index.tsx\"));\nexports.MultiCascader = _MultiCascader.default;\nvar _DateInput = _interopRequireDefault(__webpack_require__(/*! ./DateInput */ \"./src/DateInput/index.tsx\"));\nexports.DateInput = _DateInput.default;\nvar _DatePicker = _interopRequireDefault(__webpack_require__(/*! ./DatePicker */ \"./src/DatePicker/index.tsx\"));\nexports.DatePicker = _DatePicker.default;\nvar _DateRangeInput = _interopRequireDefault(__webpack_require__(/*! ./DateRangeInput */ \"./src/DateRangeInput/index.tsx\"));\nexports.DateRangeInput = _DateRangeInput.default;\nvar _DateRangePicker = _interopRequireDefault(__webpack_require__(/*! ./DateRangePicker */ \"./src/DateRangePicker/index.tsx\"));\nexports.DateRangePicker = _DateRangePicker.default;\nvar _AutoComplete = _interopRequireDefault(__webpack_require__(/*! ./AutoComplete */ \"./src/AutoComplete/index.tsx\"));\nexports.AutoComplete = _AutoComplete.default;\nvar _Uploader = _interopRequireDefault(__webpack_require__(/*! ./Uploader */ \"./src/Uploader/index.tsx\"));\nexports.Uploader = _Uploader.default;\nvar _Slider = _interopRequireDefault(__webpack_require__(/*! ./Slider */ \"./src/Slider/index.tsx\"));\nexports.Slider = _Slider.default;\nvar _RangeSlider = _interopRequireDefault(__webpack_require__(/*! ./RangeSlider */ \"./src/RangeSlider/index.tsx\"));\nexports.RangeSlider = _RangeSlider.default;\nvar _Rate = _interopRequireDefault(__webpack_require__(/*! ./Rate */ \"./src/Rate/index.tsx\"));\nexports.Rate = _Rate.default;\nvar _InlineEdit = _interopRequireDefault(__webpack_require__(/*! ./InlineEdit */ \"./src/InlineEdit/index.tsx\"));\nexports.InlineEdit = _InlineEdit.default;\nvar _Tree = _interopRequireDefault(__webpack_require__(/*! ./Tree */ \"./src/Tree/index.tsx\"));\nexports.Tree = _Tree.default;\nvar _CheckTree = _interopRequireDefault(__webpack_require__(/*! ./CheckTree */ \"./src/CheckTree/index.tsx\"));\nexports.CheckTree = _CheckTree.default;\nvar _CascadeTree = _interopRequireDefault(__webpack_require__(/*! ./CascadeTree */ \"./src/CascadeTree/index.tsx\"));\nexports.CascadeTree = _CascadeTree.default;\nvar _MultiCascadeTree = _interopRequireDefault(__webpack_require__(/*! ./MultiCascadeTree */ \"./src/MultiCascadeTree/index.tsx\"));\nexports.MultiCascadeTree = _MultiCascadeTree.default;\nvar _Panel = _interopRequireDefault(__webpack_require__(/*! ./Panel */ \"./src/Panel/index.tsx\"));\nexports.Panel = _Panel.default;\nvar _PanelGroup = _interopRequireDefault(__webpack_require__(/*! ./PanelGroup */ \"./src/PanelGroup/index.tsx\"));\nexports.PanelGroup = _PanelGroup.default;\nvar _Table = _interopRequireDefault(__webpack_require__(/*! ./Table */ \"./src/Table/index.tsx\"));\nexports.Table = _Table.default;\nvar _Timeline = _interopRequireDefault(__webpack_require__(/*! ./Timeline */ \"./src/Timeline/index.tsx\"));\nexports.Timeline = _Timeline.default;\nvar _Tag = _interopRequireDefault(__webpack_require__(/*! ./Tag */ \"./src/Tag/index.tsx\"));\nexports.Tag = _Tag.default;\nvar _TagGroup = _interopRequireDefault(__webpack_require__(/*! ./TagGroup */ \"./src/TagGroup/index.tsx\"));\nexports.TagGroup = _TagGroup.default;\nvar _List = _interopRequireDefault(__webpack_require__(/*! ./List */ \"./src/List/index.tsx\"));\nexports.List = _List.default;\nvar _Calendar = _interopRequireDefault(__webpack_require__(/*! ./Calendar */ \"./src/Calendar/index.tsx\"));\nexports.Calendar = _Calendar.default;\nvar _Carousel = _interopRequireDefault(__webpack_require__(/*! ./Carousel */ \"./src/Carousel/index.tsx\"));\nexports.Carousel = _Carousel.default;\nvar _Grid = _interopRequireDefault(__webpack_require__(/*! ./Grid */ \"./src/Grid/index.tsx\"));\nexports.Grid = _Grid.default;\nvar _Row = _interopRequireDefault(__webpack_require__(/*! ./Row */ \"./src/Row/index.tsx\"));\nexports.Row = _Row.default;\nvar _Col = _interopRequireDefault(__webpack_require__(/*! ./Col */ \"./src/Col/index.tsx\"));\nexports.Col = _Col.default;\nvar _FlexboxGrid = _interopRequireDefault(__webpack_require__(/*! ./FlexboxGrid */ \"./src/FlexboxGrid/index.tsx\"));\nexports.FlexboxGrid = _FlexboxGrid.default;\nvar _Container = _interopRequireDefault(__webpack_require__(/*! ./Container */ \"./src/Container/index.tsx\"));\nexports.Container = _Container.default;\nvar _Content = _interopRequireDefault(__webpack_require__(/*! ./Content */ \"./src/Content/index.tsx\"));\nexports.Content = _Content.default;\nvar _Header = _interopRequireDefault(__webpack_require__(/*! ./Header */ \"./src/Header/index.tsx\"));\nexports.Header = _Header.default;\nvar _Sidebar = _interopRequireDefault(__webpack_require__(/*! ./Sidebar */ \"./src/Sidebar/index.tsx\"));\nexports.Sidebar = _Sidebar.default;\nvar _Footer = _interopRequireDefault(__webpack_require__(/*! ./Footer */ \"./src/Footer/index.tsx\"));\nexports.Footer = _Footer.default;\nvar _Divider = _interopRequireDefault(__webpack_require__(/*! ./Divider */ \"./src/Divider/index.tsx\"));\nexports.Divider = _Divider.default;\nvar _Stack = _interopRequireDefault(__webpack_require__(/*! ./Stack */ \"./src/Stack/index.tsx\"));\nexports.Stack = _Stack.default;\nvar _Schema = _interopRequireDefault(__webpack_require__(/*! ./Schema */ \"./src/Schema/index.ts\"));\nexports.Schema = _Schema.default;\nvar _Animation = _interopRequireDefault(__webpack_require__(/*! ./Animation */ \"./src/Animation/index.tsx\"));\nexports.Animation = _Animation.default;\nvar _DOMHelper = _interopRequireDefault(__webpack_require__(/*! ./DOMHelper */ \"./src/DOMHelper/index.ts\"));\nexports.DOMHelper = _DOMHelper.default;\nvar _Affix = _interopRequireDefault(__webpack_require__(/*! ./Affix */ \"./src/Affix/index.tsx\"));\nexports.Affix = _Affix.default;\nvar _CustomProvider = _interopRequireDefault(__webpack_require__(/*! ./CustomProvider */ \"./src/CustomProvider/index.tsx\"));\nexports.CustomProvider = _CustomProvider.default;\nvar _useMediaQuery = _interopRequireDefault(__webpack_require__(/*! ./useMediaQuery */ \"./src/useMediaQuery/index.ts\"));\nexports.useMediaQuery = _useMediaQuery.default;\nvar _VisuallyHidden = _interopRequireDefault(__webpack_require__(/*! ./VisuallyHidden */ \"./src/VisuallyHidden/index.tsx\"));\nexports.VisuallyHidden = _VisuallyHidden.default;\nvar _Tabs = _interopRequireDefault(__webpack_require__(/*! ./Tabs */ \"./src/Tabs/index.tsx\"));\nexports.Tabs = _Tabs.default;\nvar _Accordion = _interopRequireDefault(__webpack_require__(/*! ./Accordion */ \"./src/Accordion/index.tsx\"));\nexports.Accordion = _Accordion.default;\n\n//# sourceURL=webpack://rsuite/./src/index.tsx?");
+eval("\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports.useFormClassNames = exports.Accordion = exports.Tabs = exports.VisuallyHidden = exports.useMediaQuery = exports.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.Table = exports.PanelGroup = exports.Panel = exports.MultiCascadeTree = exports.CascadeTree = exports.CheckTree = exports.Tree = exports.InlineEdit = exports.Rate = exports.RangeSlider = exports.Slider = exports.Uploader = exports.AutoComplete = exports.DateRangePicker = exports.DateRangeInput = exports.DatePicker = exports.DateInput = exports.MultiCascader = exports.Cascader = exports.CheckTreePicker = exports.TreePicker = exports.TagInput = exports.TagPicker = exports.InputPicker = exports.CheckPicker = exports.SelectPicker = exports.RadioTileGroup = exports.RadioTile = exports.RadioGroup = exports.Radio = exports.CheckboxGroup = exports.Checkbox = exports.InputGroup = exports.InputNumber = exports.MaskedInput = exports.Input = exports.Toggle = exports.Form = exports.Steps = exports.Pagination = exports.Breadcrumb = exports.Sidenav = exports.Navbar = exports.Nav = exports.AvatarGroup = exports.Avatar = exports.Progress = exports.useToaster = exports.toaster = exports.Badge = exports.Placeholder = exports.Loader = exports.Message = exports.Notification = exports.Dropdown = exports.Drawer = exports.Modal = exports.Popover = exports.Tooltip = exports.Whisper = exports.ButtonGroup = exports.ButtonToolbar = exports.IconButton = exports.Button = exports.SafeAnchor = exports.Highlight = exports.HeadingGroup = exports.Heading = exports.Text = void 0;\nvar _Text = _interopRequireDefault(__webpack_require__(/*! ./Text */ \"./src/Text/index.tsx\"));\nexports.Text = _Text.default;\nvar _Heading = _interopRequireDefault(__webpack_require__(/*! ./Heading */ \"./src/Heading/index.tsx\"));\nexports.Heading = _Heading.default;\nvar _HeadingGroup = _interopRequireDefault(__webpack_require__(/*! ./HeadingGroup */ \"./src/HeadingGroup/index.tsx\"));\nexports.HeadingGroup = _HeadingGroup.default;\nvar _Highlight = _interopRequireDefault(__webpack_require__(/*! ./Highlight */ \"./src/Highlight/index.tsx\"));\nexports.Highlight = _Highlight.default;\nvar _SafeAnchor = _interopRequireDefault(__webpack_require__(/*! ./SafeAnchor */ \"./src/SafeAnchor/index.tsx\"));\nexports.SafeAnchor = _SafeAnchor.default;\nvar _Button = _interopRequireDefault(__webpack_require__(/*! ./Button */ \"./src/Button/index.tsx\"));\nexports.Button = _Button.default;\nvar _IconButton = _interopRequireDefault(__webpack_require__(/*! ./IconButton */ \"./src/IconButton/index.tsx\"));\nexports.IconButton = _IconButton.default;\nvar _ButtonToolbar = _interopRequireDefault(__webpack_require__(/*! ./ButtonToolbar */ \"./src/ButtonToolbar/index.tsx\"));\nexports.ButtonToolbar = _ButtonToolbar.default;\nvar _ButtonGroup = _interopRequireDefault(__webpack_require__(/*! ./ButtonGroup */ \"./src/ButtonGroup/index.tsx\"));\nexports.ButtonGroup = _ButtonGroup.default;\nvar _Whisper = _interopRequireDefault(__webpack_require__(/*! ./Whisper */ \"./src/Whisper/index.tsx\"));\nexports.Whisper = _Whisper.default;\nvar _Tooltip = _interopRequireDefault(__webpack_require__(/*! ./Tooltip */ \"./src/Tooltip/index.tsx\"));\nexports.Tooltip = _Tooltip.default;\nvar _Popover = _interopRequireDefault(__webpack_require__(/*! ./Popover */ \"./src/Popover/index.tsx\"));\nexports.Popover = _Popover.default;\nvar _Modal = _interopRequireDefault(__webpack_require__(/*! ./Modal */ \"./src/Modal/index.tsx\"));\nexports.Modal = _Modal.default;\nvar _Drawer = _interopRequireDefault(__webpack_require__(/*! ./Drawer */ \"./src/Drawer/index.tsx\"));\nexports.Drawer = _Drawer.default;\nvar _Dropdown = _interopRequireDefault(__webpack_require__(/*! ./Dropdown */ \"./src/Dropdown/index.tsx\"));\nexports.Dropdown = _Dropdown.default;\nvar _Notification = _interopRequireDefault(__webpack_require__(/*! ./Notification */ \"./src/Notification/index.tsx\"));\nexports.Notification = _Notification.default;\nvar _Message = _interopRequireDefault(__webpack_require__(/*! ./Message */ \"./src/Message/index.tsx\"));\nexports.Message = _Message.default;\nvar _Loader = _interopRequireDefault(__webpack_require__(/*! ./Loader */ \"./src/Loader/index.tsx\"));\nexports.Loader = _Loader.default;\nvar _Placeholder = _interopRequireDefault(__webpack_require__(/*! ./Placeholder */ \"./src/Placeholder/index.tsx\"));\nexports.Placeholder = _Placeholder.default;\nvar _Badge = _interopRequireDefault(__webpack_require__(/*! ./Badge */ \"./src/Badge/index.tsx\"));\nexports.Badge = _Badge.default;\nvar _toaster = _interopRequireDefault(__webpack_require__(/*! ./toaster */ \"./src/toaster/index.tsx\"));\nexports.toaster = _toaster.default;\nvar _useToaster = _interopRequireDefault(__webpack_require__(/*! ./useToaster */ \"./src/useToaster/index.tsx\"));\nexports.useToaster = _useToaster.default;\nvar _Progress = _interopRequireDefault(__webpack_require__(/*! ./Progress */ \"./src/Progress/index.tsx\"));\nexports.Progress = _Progress.default;\nvar _Avatar = _interopRequireDefault(__webpack_require__(/*! ./Avatar */ \"./src/Avatar/index.tsx\"));\nexports.Avatar = _Avatar.default;\nvar _AvatarGroup = _interopRequireDefault(__webpack_require__(/*! ./AvatarGroup */ \"./src/AvatarGroup/index.tsx\"));\nexports.AvatarGroup = _AvatarGroup.default;\nvar _Nav = _interopRequireDefault(__webpack_require__(/*! ./Nav */ \"./src/Nav/index.tsx\"));\nexports.Nav = _Nav.default;\nvar _Navbar = _interopRequireDefault(__webpack_require__(/*! ./Navbar */ \"./src/Navbar/index.tsx\"));\nexports.Navbar = _Navbar.default;\nvar _Sidenav = _interopRequireDefault(__webpack_require__(/*! ./Sidenav */ \"./src/Sidenav/index.tsx\"));\nexports.Sidenav = _Sidenav.default;\nvar _Breadcrumb = _interopRequireDefault(__webpack_require__(/*! ./Breadcrumb */ \"./src/Breadcrumb/index.tsx\"));\nexports.Breadcrumb = _Breadcrumb.default;\nvar _Pagination = _interopRequireDefault(__webpack_require__(/*! ./Pagination */ \"./src/Pagination/index.tsx\"));\nexports.Pagination = _Pagination.default;\nvar _Steps = _interopRequireDefault(__webpack_require__(/*! ./Steps */ \"./src/Steps/index.tsx\"));\nexports.Steps = _Steps.default;\nvar _Form = _interopRequireWildcard(__webpack_require__(/*! ./Form */ \"./src/Form/index.tsx\"));\nexports.Form = _Form.default;\nexports.useFormClassNames = _Form.useFormClassNames;\nvar _Toggle = _interopRequireDefault(__webpack_require__(/*! ./Toggle */ \"./src/Toggle/index.tsx\"));\nexports.Toggle = _Toggle.default;\nvar _Input = _interopRequireDefault(__webpack_require__(/*! ./Input */ \"./src/Input/index.tsx\"));\nexports.Input = _Input.default;\nvar _MaskedInput = _interopRequireDefault(__webpack_require__(/*! ./MaskedInput */ \"./src/MaskedInput/index.tsx\"));\nexports.MaskedInput = _MaskedInput.default;\nvar _InputNumber = _interopRequireDefault(__webpack_require__(/*! ./InputNumber */ \"./src/InputNumber/index.tsx\"));\nexports.InputNumber = _InputNumber.default;\nvar _InputGroup = _interopRequireDefault(__webpack_require__(/*! ./InputGroup */ \"./src/InputGroup/index.tsx\"));\nexports.InputGroup = _InputGroup.default;\nvar _Checkbox = _interopRequireDefault(__webpack_require__(/*! ./Checkbox */ \"./src/Checkbox/index.tsx\"));\nexports.Checkbox = _Checkbox.default;\nvar _CheckboxGroup = _interopRequireDefault(__webpack_require__(/*! ./CheckboxGroup */ \"./src/CheckboxGroup/index.tsx\"));\nexports.CheckboxGroup = _CheckboxGroup.default;\nvar _Radio = _interopRequireDefault(__webpack_require__(/*! ./Radio */ \"./src/Radio/index.tsx\"));\nexports.Radio = _Radio.default;\nvar _RadioGroup = _interopRequireDefault(__webpack_require__(/*! ./RadioGroup */ \"./src/RadioGroup/index.tsx\"));\nexports.RadioGroup = _RadioGroup.default;\nvar _RadioTile = _interopRequireDefault(__webpack_require__(/*! ./RadioTile */ \"./src/RadioTile/index.tsx\"));\nexports.RadioTile = _RadioTile.default;\nvar _RadioTileGroup = _interopRequireDefault(__webpack_require__(/*! ./RadioTileGroup */ \"./src/RadioTileGroup/index.tsx\"));\nexports.RadioTileGroup = _RadioTileGroup.default;\nvar _SelectPicker = _interopRequireDefault(__webpack_require__(/*! ./SelectPicker */ \"./src/SelectPicker/index.tsx\"));\nexports.SelectPicker = _SelectPicker.default;\nvar _CheckPicker = _interopRequireDefault(__webpack_require__(/*! ./CheckPicker */ \"./src/CheckPicker/index.tsx\"));\nexports.CheckPicker = _CheckPicker.default;\nvar _InputPicker = _interopRequireDefault(__webpack_require__(/*! ./InputPicker */ \"./src/InputPicker/index.tsx\"));\nexports.InputPicker = _InputPicker.default;\nvar _TagPicker = _interopRequireDefault(__webpack_require__(/*! ./TagPicker */ \"./src/TagPicker/index.tsx\"));\nexports.TagPicker = _TagPicker.default;\nvar _TagInput = _interopRequireDefault(__webpack_require__(/*! ./TagInput */ \"./src/TagInput/index.tsx\"));\nexports.TagInput = _TagInput.default;\nvar _TreePicker = _interopRequireDefault(__webpack_require__(/*! ./TreePicker */ \"./src/TreePicker/index.tsx\"));\nexports.TreePicker = _TreePicker.default;\nvar _CheckTreePicker = _interopRequireDefault(__webpack_require__(/*! ./CheckTreePicker */ \"./src/CheckTreePicker/index.tsx\"));\nexports.CheckTreePicker = _CheckTreePicker.default;\nvar _Cascader = _interopRequireDefault(__webpack_require__(/*! ./Cascader */ \"./src/Cascader/index.tsx\"));\nexports.Cascader = _Cascader.default;\nvar _MultiCascader = _interopRequireDefault(__webpack_require__(/*! ./MultiCascader */ \"./src/MultiCascader/index.tsx\"));\nexports.MultiCascader = _MultiCascader.default;\nvar _DateInput = _interopRequireDefault(__webpack_require__(/*! ./DateInput */ \"./src/DateInput/index.tsx\"));\nexports.DateInput = _DateInput.default;\nvar _DatePicker = _interopRequireDefault(__webpack_require__(/*! ./DatePicker */ \"./src/DatePicker/index.tsx\"));\nexports.DatePicker = _DatePicker.default;\nvar _DateRangeInput = _interopRequireDefault(__webpack_require__(/*! ./DateRangeInput */ \"./src/DateRangeInput/index.tsx\"));\nexports.DateRangeInput = _DateRangeInput.default;\nvar _DateRangePicker = _interopRequireDefault(__webpack_require__(/*! ./DateRangePicker */ \"./src/DateRangePicker/index.tsx\"));\nexports.DateRangePicker = _DateRangePicker.default;\nvar _AutoComplete = _interopRequireDefault(__webpack_require__(/*! ./AutoComplete */ \"./src/AutoComplete/index.tsx\"));\nexports.AutoComplete = _AutoComplete.default;\nvar _Uploader = _interopRequireDefault(__webpack_require__(/*! ./Uploader */ \"./src/Uploader/index.tsx\"));\nexports.Uploader = _Uploader.default;\nvar _Slider = _interopRequireDefault(__webpack_require__(/*! ./Slider */ \"./src/Slider/index.tsx\"));\nexports.Slider = _Slider.default;\nvar _RangeSlider = _interopRequireDefault(__webpack_require__(/*! ./RangeSlider */ \"./src/RangeSlider/index.tsx\"));\nexports.RangeSlider = _RangeSlider.default;\nvar _Rate = _interopRequireDefault(__webpack_require__(/*! ./Rate */ \"./src/Rate/index.tsx\"));\nexports.Rate = _Rate.default;\nvar _InlineEdit = _interopRequireDefault(__webpack_require__(/*! ./InlineEdit */ \"./src/InlineEdit/index.tsx\"));\nexports.InlineEdit = _InlineEdit.default;\nvar _Tree = _interopRequireDefault(__webpack_require__(/*! ./Tree */ \"./src/Tree/index.tsx\"));\nexports.Tree = _Tree.default;\nvar _CheckTree = _interopRequireDefault(__webpack_require__(/*! ./CheckTree */ \"./src/CheckTree/index.tsx\"));\nexports.CheckTree = _CheckTree.default;\nvar _CascadeTree = _interopRequireDefault(__webpack_require__(/*! ./CascadeTree */ \"./src/CascadeTree/index.tsx\"));\nexports.CascadeTree = _CascadeTree.default;\nvar _MultiCascadeTree = _interopRequireDefault(__webpack_require__(/*! ./MultiCascadeTree */ \"./src/MultiCascadeTree/index.tsx\"));\nexports.MultiCascadeTree = _MultiCascadeTree.default;\nvar _Panel = _interopRequireDefault(__webpack_require__(/*! ./Panel */ \"./src/Panel/index.tsx\"));\nexports.Panel = _Panel.default;\nvar _PanelGroup = _interopRequireDefault(__webpack_require__(/*! ./PanelGroup */ \"./src/PanelGroup/index.tsx\"));\nexports.PanelGroup = _PanelGroup.default;\nvar _Table = _interopRequireDefault(__webpack_require__(/*! ./Table */ \"./src/Table/index.tsx\"));\nexports.Table = _Table.default;\nvar _Timeline = _interopRequireDefault(__webpack_require__(/*! ./Timeline */ \"./src/Timeline/index.tsx\"));\nexports.Timeline = _Timeline.default;\nvar _Tag = _interopRequireDefault(__webpack_require__(/*! ./Tag */ \"./src/Tag/index.tsx\"));\nexports.Tag = _Tag.default;\nvar _TagGroup = _interopRequireDefault(__webpack_require__(/*! ./TagGroup */ \"./src/TagGroup/index.tsx\"));\nexports.TagGroup = _TagGroup.default;\nvar _List = _interopRequireDefault(__webpack_require__(/*! ./List */ \"./src/List/index.tsx\"));\nexports.List = _List.default;\nvar _Calendar = _interopRequireDefault(__webpack_require__(/*! ./Calendar */ \"./src/Calendar/index.tsx\"));\nexports.Calendar = _Calendar.default;\nvar _Carousel = _interopRequireDefault(__webpack_require__(/*! ./Carousel */ \"./src/Carousel/index.tsx\"));\nexports.Carousel = _Carousel.default;\nvar _Grid = _interopRequireDefault(__webpack_require__(/*! ./Grid */ \"./src/Grid/index.tsx\"));\nexports.Grid = _Grid.default;\nvar _Row = _interopRequireDefault(__webpack_require__(/*! ./Row */ \"./src/Row/index.tsx\"));\nexports.Row = _Row.default;\nvar _Col = _interopRequireDefault(__webpack_require__(/*! ./Col */ \"./src/Col/index.tsx\"));\nexports.Col = _Col.default;\nvar _FlexboxGrid = _interopRequireDefault(__webpack_require__(/*! ./FlexboxGrid */ \"./src/FlexboxGrid/index.tsx\"));\nexports.FlexboxGrid = _FlexboxGrid.default;\nvar _Container = _interopRequireDefault(__webpack_require__(/*! ./Container */ \"./src/Container/index.tsx\"));\nexports.Container = _Container.default;\nvar _Content = _interopRequireDefault(__webpack_require__(/*! ./Content */ \"./src/Content/index.tsx\"));\nexports.Content = _Content.default;\nvar _Header = _interopRequireDefault(__webpack_require__(/*! ./Header */ \"./src/Header/index.tsx\"));\nexports.Header = _Header.default;\nvar _Sidebar = _interopRequireDefault(__webpack_require__(/*! ./Sidebar */ \"./src/Sidebar/index.tsx\"));\nexports.Sidebar = _Sidebar.default;\nvar _Footer = _interopRequireDefault(__webpack_require__(/*! ./Footer */ \"./src/Footer/index.tsx\"));\nexports.Footer = _Footer.default;\nvar _Divider = _interopRequireDefault(__webpack_require__(/*! ./Divider */ \"./src/Divider/index.tsx\"));\nexports.Divider = _Divider.default;\nvar _Stack = _interopRequireDefault(__webpack_require__(/*! ./Stack */ \"./src/Stack/index.tsx\"));\nexports.Stack = _Stack.default;\nvar _Schema = _interopRequireDefault(__webpack_require__(/*! ./Schema */ \"./src/Schema/index.ts\"));\nexports.Schema = _Schema.default;\nvar _Animation = _interopRequireDefault(__webpack_require__(/*! ./Animation */ \"./src/Animation/index.tsx\"));\nexports.Animation = _Animation.default;\nvar _DOMHelper = _interopRequireDefault(__webpack_require__(/*! ./DOMHelper */ \"./src/DOMHelper/index.ts\"));\nexports.DOMHelper = _DOMHelper.default;\nvar _Affix = _interopRequireDefault(__webpack_require__(/*! ./Affix */ \"./src/Affix/index.tsx\"));\nexports.Affix = _Affix.default;\nvar _CustomProvider = _interopRequireDefault(__webpack_require__(/*! ./CustomProvider */ \"./src/CustomProvider/index.tsx\"));\nexports.CustomProvider = _CustomProvider.default;\nvar _useMediaQuery = _interopRequireDefault(__webpack_require__(/*! ./useMediaQuery */ \"./src/useMediaQuery/index.ts\"));\nexports.useMediaQuery = _useMediaQuery.default;\nvar _VisuallyHidden = _interopRequireDefault(__webpack_require__(/*! ./VisuallyHidden */ \"./src/VisuallyHidden/index.tsx\"));\nexports.VisuallyHidden = _VisuallyHidden.default;\nvar _Tabs = _interopRequireDefault(__webpack_require__(/*! ./Tabs */ \"./src/Tabs/index.tsx\"));\nexports.Tabs = _Tabs.default;\nvar _Accordion = _interopRequireDefault(__webpack_require__(/*! ./Accordion */ \"./src/Accordion/index.tsx\"));\nexports.Accordion = _Accordion.default;\n\n//# sourceURL=webpack://rsuite/./src/index.tsx?");
 
 /***/ }),
 
@@ -10047,7 +10487,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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _isUndefined = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\nvar _isString = _interopRequireDefault(__webpack_require__(/*! lodash/isString */ \"./node_modules/lodash/isString.js\"));\nvar _isNumber = _interopRequireDefault(__webpack_require__(/*! lodash/isNumber */ \"./node_modules/lodash/isNumber.js\"));\nvar _findIndex = _interopRequireDefault(__webpack_require__(/*! lodash/findIndex */ \"./node_modules/lodash/findIndex.js\"));\nvar _pickBy = _interopRequireDefault(__webpack_require__(/*! lodash/pickBy */ \"./node_modules/lodash/pickBy.js\"));\nvar _getPosition = _interopRequireDefault(__webpack_require__(/*! dom-lib/getPosition */ \"./node_modules/dom-lib/esm/getPosition.js\"));\nvar _scrollTop = _interopRequireDefault(__webpack_require__(/*! dom-lib/scrollTop */ \"./node_modules/dom-lib/esm/scrollTop.js\"));\nvar _getHeight = _interopRequireDefault(__webpack_require__(/*! dom-lib/getHeight */ \"./node_modules/dom-lib/esm/getHeight.js\"));\nvar _get = _interopRequireDefault(__webpack_require__(/*! lodash/get */ \"./node_modules/lodash/get.js\"));\nvar _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ \"./node_modules/classnames/index.js\"));\nvar _Windowing = __webpack_require__(/*! ../../internals/Windowing */ \"./src/internals/Windowing/index.ts\");\nvar _shallowEqual = _interopRequireDefault(__webpack_require__(/*! ../../utils/shallowEqual */ \"./src/utils/shallowEqual.ts\"));\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar _ListItemGroup = _interopRequireDefault(__webpack_require__(/*! ./ListItemGroup */ \"./src/internals/Picker/ListItemGroup.tsx\"));\nvar _getDataGroupBy = __webpack_require__(/*! ../../utils/getDataGroupBy */ \"./src/utils/getDataGroupBy.ts\");\nvar _useCombobox2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useCombobox */ \"./src/internals/Picker/hooks/useCombobox.ts\"));\nvar _symbols = __webpack_require__(/*! ../../internals/symbols */ \"./src/internals/symbols.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/internals/Picker/Listbox.tsx\",\n  _this = void 0;\nvar Listbox = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$data = props.data,\n    data = _props$data === void 0 ? [] : _props$data,\n    group = props.group,\n    groupBy = props.groupBy,\n    _props$maxHeight = props.maxHeight,\n    maxHeight = _props$maxHeight === void 0 ? 320 : _props$maxHeight,\n    _props$activeItemValu = props.activeItemValues,\n    activeItemValues = _props$activeItemValu === void 0 ? [] : _props$activeItemValu,\n    _props$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? [] : _props$disabledItemVa,\n    _props$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'listbox' : _props$classPrefix,\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    virtualized = props.virtualized,\n    listProps = props.listProps,\n    virtualizedListRef = props.listRef,\n    className = props.className,\n    style = props.style,\n    focusItemValue = props.focusItemValue,\n    listItemClassPrefix = props.listItemClassPrefix,\n    ListItem = props.listItemAs,\n    listItemProps = props.listItemProps,\n    _props$rowHeight = props.rowHeight,\n    rowHeight = _props$rowHeight === void 0 ? 36 : _props$rowHeight,\n    _props$rowGroupHeight = props.rowGroupHeight,\n    rowGroupHeight = _props$rowGroupHeight === void 0 ? 48 : _props$rowGroupHeight,\n    renderMenuGroup = props.renderMenuGroup,\n    renderMenuItem = props.renderMenuItem,\n    onGroupTitleClick = props.onGroupTitleClick,\n    onSelect = props.onSelect,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"data\", \"group\", \"groupBy\", \"maxHeight\", \"activeItemValues\", \"disabledItemValues\", \"classPrefix\", \"valueKey\", \"labelKey\", \"virtualized\", \"listProps\", \"listRef\", \"className\", \"style\", \"focusItemValue\", \"listItemClassPrefix\", \"listItemAs\", \"listItemProps\", \"rowHeight\", \"rowGroupHeight\", \"renderMenuGroup\", \"renderMenuItem\", \"onGroupTitleClick\", \"onSelect\"]);\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    withClassPrefix = _useClassNames.withClassPrefix,\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge;\n  var classes = merge(className, withClassPrefix('items', {\n    grouped: group\n  }));\n  var _useCombobox = (0, _useCombobox2.default)(),\n    id = _useCombobox.id,\n    labelId = _useCombobox.labelId,\n    popupType = _useCombobox.popupType,\n    multiple = _useCombobox.multiple;\n  var menuBodyContainerRef = (0, _react.useRef)(null);\n  var listRef = (0, _react.useRef)(null);\n  var _useState = (0, _react.useState)([]),\n    foldedGroupKeys = _useState[0],\n    setFoldedGroupKeys = _useState[1];\n  var handleGroupTitleClick = (0, _utils.useEventCallback)(function (key, event) {\n    var nextGroupKeys = foldedGroupKeys.filter(function (item) {\n      return item !== key;\n    });\n    if (nextGroupKeys.length === foldedGroupKeys.length) {\n      nextGroupKeys.push(key);\n    }\n    setFoldedGroupKeys(nextGroupKeys);\n    onGroupTitleClick === null || onGroupTitleClick === void 0 ? void 0 : onGroupTitleClick(event);\n  });\n  var handleSelect = (0, _utils.useEventCallback)(function (item, value, event, checked) {\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(value, item, event, checked);\n  });\n  var getRowHeight = function getRowHeight(list, index) {\n    var item = list[index];\n    if (group && item[_symbols.RSUITE_PICKER_GROUP_KEY] && index !== 0) {\n      return rowGroupHeight;\n    }\n    return rowHeight;\n  };\n  (0, _react.useEffect)(function () {\n    var container = menuBodyContainerRef.current;\n    if (!container) {\n      return;\n    }\n    var activeItem = container.querySelector(\".\" + prefix('item-focus'));\n    if (!activeItem) {\n      activeItem = container.querySelector(\".\" + prefix('item-active'));\n    }\n    if (!activeItem) {\n      return;\n    }\n    var position = (0, _getPosition.default)(activeItem, container);\n    var sTop = (0, _scrollTop.default)(container);\n    var sHeight = (0, _getHeight.default)(container);\n    if (sTop > position.top) {\n      (0, _scrollTop.default)(container, Math.max(0, position.top - 20));\n    } else if (position.top > sTop + sHeight) {\n      (0, _scrollTop.default)(container, Math.max(0, position.top - sHeight + 32));\n    }\n  }, [focusItemValue, menuBodyContainerRef, prefix]);\n  var filteredItems = group ? data.filter(function (item) {\n    var _item$parent;\n    // Display group title items\n    if (item[_symbols.RSUITE_PICKER_GROUP_KEY]) return true;\n\n    // Display items under the unfolded group\n    // FIXME-Doma\n    // `groupBy` is bound to be string when `group` is true\n    // because `group` is actually redundant as a prop\n    // It could simply be derived from `groupBy` value\n    var groupValue = (0, _get.default)(item, groupBy, '') || ( // FIXME-Doma\n    // Usage of `item.parent` is strongly discouraged\n    // It's only here for legacy support\n    // Remove once `item.parent` is completely removed across related components\n    (_item$parent = item.parent) === null || _item$parent === void 0 ? void 0 : _item$parent[_getDataGroupBy.KEY_GROUP_TITLE]);\n    return !foldedGroupKeys.includes(groupValue);\n  }) : data;\n  var rowCount = filteredItems.length;\n  var renderItem = function renderItem(_ref) {\n    var _ref$index = _ref.index,\n      index = _ref$index === void 0 ? 0 : _ref$index,\n      style = _ref.style,\n      data = _ref.data,\n      itemData = _ref.item;\n    var item = itemData || data[index];\n    var value = item[valueKey];\n    var label = item[labelKey];\n    if ((0, _isUndefined.default)(label) && !item[_symbols.RSUITE_PICKER_GROUP_KEY]) {\n      throw Error(\"labelKey \\\"\" + labelKey + \"\\\" is not defined in \\\"data\\\" : \" + index);\n    }\n\n    // Use `value` in keys when If `value` is string or number\n    var itemKey = (0, _isString.default)(value) || (0, _isNumber.default)(value) ? value : index;\n\n    /**\n     * Render <ListboxGroup>\n     * when if `group` is enabled\n     */\n    if (group && item[_symbols.RSUITE_PICKER_GROUP_KEY]) {\n      var groupValue = item[_getDataGroupBy.KEY_GROUP_TITLE];\n      // TODO: grouped options should be owned by group\n      return /*#__PURE__*/_react.default.createElement(_ListItemGroup.default, {\n        style: style,\n        classPrefix: 'picker-menu-group',\n        className: (0, _classnames.default)({\n          folded: foldedGroupKeys.some(function (key) {\n            return key === groupValue;\n          })\n        }),\n        key: \"group-\" + groupValue,\n        onClick: handleGroupTitleClick.bind(null, groupValue),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 209,\n          columnNumber: 11\n        }\n      }, renderMenuGroup ? renderMenuGroup(groupValue, item) : groupValue);\n    } else if ((0, _isUndefined.default)(value) && !(0, _isUndefined.default)(item[_symbols.RSUITE_PICKER_GROUP_KEY])) {\n      throw Error(\"valueKey \\\"\" + valueKey + \"\\\" is not defined in \\\"data\\\" : \" + index + \" \");\n    }\n    var disabled = disabledItemValues === null || disabledItemValues === void 0 ? void 0 : disabledItemValues.some(function (disabledValue) {\n      return (0, _shallowEqual.default)(disabledValue, value);\n    });\n    var active = activeItemValues === null || activeItemValues === void 0 ? void 0 : activeItemValues.some(function (v) {\n      return (0, _shallowEqual.default)(v, value);\n    });\n    var focus = !(0, _isUndefined.default)(focusItemValue) && (0, _shallowEqual.default)(focusItemValue, value);\n    return /*#__PURE__*/_react.default.createElement(ListItem, (0, _extends2.default)({\n      \"aria-posinset\": index + 1,\n      \"aria-setsize\": rowCount,\n      style: style,\n      key: itemKey,\n      disabled: disabled,\n      active: active,\n      focus: focus,\n      value: value,\n      classPrefix: listItemClassPrefix,\n      onSelect: handleSelect.bind(null, item)\n    }, (0, _pickBy.default)(listItemProps, function (v) {\n      return v !== undefined;\n    }), {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 232,\n        columnNumber: 9\n      }\n    }), renderMenuItem ? renderMenuItem(label, item) : label);\n  };\n  (0, _utils.useMount)(function () {\n    var _listRef$current, _listRef$current$scro;\n    var itemIndex = (0, _findIndex.default)(filteredItems, function (item) {\n      return item[valueKey] === (activeItemValues === null || activeItemValues === void 0 ? void 0 : activeItemValues[0]);\n    });\n    (_listRef$current = listRef.current) === null || _listRef$current === void 0 ? void 0 : (_listRef$current$scro = _listRef$current.scrollToItem) === null || _listRef$current$scro === void 0 ? void 0 : _listRef$current$scro.call(_listRef$current, itemIndex);\n  });\n  return /*#__PURE__*/_react.default.createElement(\"div\", (0, _extends2.default)({\n    role: \"listbox\",\n    id: id + \"-\" + popupType,\n    \"aria-labelledby\": labelId,\n    \"aria-multiselectable\": multiple\n  }, rest, {\n    className: classes,\n    ref: (0, _utils.mergeRefs)(menuBodyContainerRef, ref),\n    style: (0, _extends2.default)({}, style, {\n      maxHeight: maxHeight\n    }),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 256,\n      columnNumber: 7\n    }\n  }), virtualized ? /*#__PURE__*/_react.default.createElement(_Windowing.AutoSizer, {\n    defaultHeight: maxHeight,\n    style: {\n      width: 'auto',\n      height: 'auto'\n    },\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 267,\n      columnNumber: 11\n    }\n  }, function (_ref2) {\n    var height = _ref2.height;\n    return /*#__PURE__*/_react.default.createElement(_Windowing.List, (0, _extends2.default)({\n      as: _Windowing.VariableSizeList,\n      ref: (0, _utils.mergeRefs)(listRef, virtualizedListRef),\n      height: height || maxHeight,\n      itemCount: rowCount,\n      itemData: filteredItems,\n      itemSize: getRowHeight.bind(_this, filteredItems)\n    }, listProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 269,\n        columnNumber: 15\n      }\n    }), renderItem);\n  }) : filteredItems.map(function (item, index) {\n    return renderItem({\n      index: index,\n      item: item\n    });\n  }));\n});\nListbox.displayName = 'Listbox';\nvar _default = Listbox;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/internals/Picker/Listbox.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _isUndefined = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\nvar _isString = _interopRequireDefault(__webpack_require__(/*! lodash/isString */ \"./node_modules/lodash/isString.js\"));\nvar _isNumber = _interopRequireDefault(__webpack_require__(/*! lodash/isNumber */ \"./node_modules/lodash/isNumber.js\"));\nvar _findIndex = _interopRequireDefault(__webpack_require__(/*! lodash/findIndex */ \"./node_modules/lodash/findIndex.js\"));\nvar _pickBy = _interopRequireDefault(__webpack_require__(/*! lodash/pickBy */ \"./node_modules/lodash/pickBy.js\"));\nvar _getPosition = _interopRequireDefault(__webpack_require__(/*! dom-lib/getPosition */ \"./node_modules/dom-lib/esm/getPosition.js\"));\nvar _scrollTop = _interopRequireDefault(__webpack_require__(/*! dom-lib/scrollTop */ \"./node_modules/dom-lib/esm/scrollTop.js\"));\nvar _getHeight = _interopRequireDefault(__webpack_require__(/*! dom-lib/getHeight */ \"./node_modules/dom-lib/esm/getHeight.js\"));\nvar _get = _interopRequireDefault(__webpack_require__(/*! lodash/get */ \"./node_modules/lodash/get.js\"));\nvar _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ \"./node_modules/classnames/index.js\"));\nvar _Windowing = __webpack_require__(/*! ../../internals/Windowing */ \"./src/internals/Windowing/index.ts\");\nvar _shallowEqual = _interopRequireDefault(__webpack_require__(/*! ../../utils/shallowEqual */ \"./src/utils/shallowEqual.ts\"));\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar _ListItemGroup = _interopRequireDefault(__webpack_require__(/*! ./ListItemGroup */ \"./src/internals/Picker/ListItemGroup.tsx\"));\nvar _getDataGroupBy = __webpack_require__(/*! ../../utils/getDataGroupBy */ \"./src/utils/getDataGroupBy.ts\");\nvar _useCombobox2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useCombobox */ \"./src/internals/Picker/hooks/useCombobox.ts\"));\nvar _Highlight = _interopRequireDefault(__webpack_require__(/*! ../../Highlight */ \"./src/Highlight/index.tsx\"));\nvar _symbols = __webpack_require__(/*! ../../internals/symbols */ \"./src/internals/symbols.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/internals/Picker/Listbox.tsx\",\n  _this = void 0;\n/**\n * Props for the Listbox component.\n */\n/**\n * Props for the Listbox component.\n * @template Multiple - Whether multiple selection is enabled.\n */\nvar Listbox = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _props$data = props.data,\n    data = _props$data === void 0 ? [] : _props$data,\n    groupBy = props.groupBy,\n    _props$maxHeight = props.maxHeight,\n    maxHeight = _props$maxHeight === void 0 ? 320 : _props$maxHeight,\n    _props$activeItemValu = props.activeItemValues,\n    activeItemValues = _props$activeItemValu === void 0 ? [] : _props$activeItemValu,\n    _props$disabledItemVa = props.disabledItemValues,\n    disabledItemValues = _props$disabledItemVa === void 0 ? [] : _props$disabledItemVa,\n    _props$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'listbox' : _props$classPrefix,\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    virtualized = props.virtualized,\n    listProps = props.listProps,\n    virtualizedListRef = props.listRef,\n    className = props.className,\n    style = props.style,\n    focusItemValue = props.focusItemValue,\n    listItemClassPrefix = props.listItemClassPrefix,\n    ListItem = props.listItemAs,\n    listItemProps = props.listItemProps,\n    _props$rowHeight = props.rowHeight,\n    rowHeight = _props$rowHeight === void 0 ? 36 : _props$rowHeight,\n    _props$rowGroupHeight = props.rowGroupHeight,\n    rowGroupHeight = _props$rowGroupHeight === void 0 ? 48 : _props$rowGroupHeight,\n    query = props.query,\n    renderMenuGroup = props.renderMenuGroup,\n    renderMenuItem = props.renderMenuItem,\n    onGroupTitleClick = props.onGroupTitleClick,\n    onSelect = props.onSelect,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"data\", \"groupBy\", \"maxHeight\", \"activeItemValues\", \"disabledItemValues\", \"classPrefix\", \"valueKey\", \"labelKey\", \"virtualized\", \"listProps\", \"listRef\", \"className\", \"style\", \"focusItemValue\", \"listItemClassPrefix\", \"listItemAs\", \"listItemProps\", \"rowHeight\", \"rowGroupHeight\", \"query\", \"renderMenuGroup\", \"renderMenuItem\", \"onGroupTitleClick\", \"onSelect\"]);\n  var _useClassNames = (0, _utils.useClassNames)(classPrefix),\n    withClassPrefix = _useClassNames.withClassPrefix,\n    prefix = _useClassNames.prefix,\n    merge = _useClassNames.merge;\n  var groupable = typeof groupBy !== 'undefined';\n  var classes = merge(className, withClassPrefix('items', {\n    grouped: groupable\n  }));\n  var _useCombobox = (0, _useCombobox2.default)(),\n    id = _useCombobox.id,\n    labelId = _useCombobox.labelId,\n    popupType = _useCombobox.popupType,\n    multiple = _useCombobox.multiple;\n  var menuBodyContainerRef = (0, _react.useRef)(null);\n  var listRef = (0, _react.useRef)(null);\n  var _useState = (0, _react.useState)([]),\n    foldedGroupKeys = _useState[0],\n    setFoldedGroupKeys = _useState[1];\n  var handleGroupTitleClick = (0, _utils.useEventCallback)(function (key, event) {\n    var nextGroupKeys = foldedGroupKeys.filter(function (item) {\n      return item !== key;\n    });\n    if (nextGroupKeys.length === foldedGroupKeys.length) {\n      nextGroupKeys.push(key);\n    }\n    setFoldedGroupKeys(nextGroupKeys);\n    onGroupTitleClick === null || onGroupTitleClick === void 0 ? void 0 : onGroupTitleClick(event);\n  });\n  var handleSelect = (0, _utils.useEventCallback)(function (item, value, event, checked) {\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(value, item, event, checked);\n  });\n  var getRowHeight = function getRowHeight(list, index) {\n    var item = list[index];\n    if (groupable && item[_symbols.RSUITE_PICKER_GROUP_KEY] && index !== 0) {\n      return rowGroupHeight;\n    }\n    return rowHeight;\n  };\n  (0, _react.useEffect)(function () {\n    var container = menuBodyContainerRef.current;\n    if (!container) {\n      return;\n    }\n    var activeItem = container.querySelector(\".\" + prefix('item-focus'));\n    if (!activeItem) {\n      activeItem = container.querySelector(\".\" + prefix('item-active'));\n    }\n    if (!activeItem) {\n      return;\n    }\n    var position = (0, _getPosition.default)(activeItem, container);\n    var sTop = (0, _scrollTop.default)(container);\n    var sHeight = (0, _getHeight.default)(container);\n    if (sTop > position.top) {\n      (0, _scrollTop.default)(container, Math.max(0, position.top - 20));\n    } else if (position.top > sTop + sHeight) {\n      (0, _scrollTop.default)(container, Math.max(0, position.top - sHeight + 32));\n    }\n  }, [focusItemValue, menuBodyContainerRef, prefix]);\n  var filteredItems = groupable ? data.filter(function (item) {\n    var _item$parent;\n    // Display group title items\n    if (item[_symbols.RSUITE_PICKER_GROUP_KEY]) return true;\n\n    // Display items under the unfolded group\n    var groupValue = (0, _get.default)(item, groupBy, '') || ( // FIXME-Doma\n    // Usage of `item.parent` is strongly discouraged\n    // It's only here for legacy support\n    // Remove once `item.parent` is completely removed across related components\n    (_item$parent = item.parent) === null || _item$parent === void 0 ? void 0 : _item$parent[_getDataGroupBy.KEY_GROUP_TITLE]);\n    return !foldedGroupKeys.includes(groupValue);\n  }) : data;\n  var rowCount = filteredItems.length;\n  var renderItem = function renderItem(_ref) {\n    var _ref$index = _ref.index,\n      index = _ref$index === void 0 ? 0 : _ref$index,\n      style = _ref.style,\n      data = _ref.data,\n      itemData = _ref.item;\n    var item = itemData || data[index];\n    var value = item[valueKey];\n    var itemLabel = item[labelKey];\n    var label = query ? /*#__PURE__*/_react.default.createElement(_Highlight.default, {\n      query: query,\n      as: \"span\",\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 228,\n        columnNumber: 9\n      }\n    }, itemLabel) : itemLabel;\n    if ((0, _isUndefined.default)(label) && !item[_symbols.RSUITE_PICKER_GROUP_KEY]) {\n      throw Error(\"labelKey \\\"\" + labelKey + \"\\\" is not defined in \\\"data\\\" : \" + index);\n    }\n\n    // Use `value` in keys when If `value` is string or number\n    var itemKey = (0, _isString.default)(value) || (0, _isNumber.default)(value) ? value : index;\n\n    //  Render <ListboxGroup> component when `groupBy` is defined\n    if (groupable && item[_symbols.RSUITE_PICKER_GROUP_KEY]) {\n      var groupValue = item[_getDataGroupBy.KEY_GROUP_TITLE];\n      return /*#__PURE__*/_react.default.createElement(_ListItemGroup.default, {\n        style: style,\n        classPrefix: 'picker-menu-group',\n        className: (0, _classnames.default)({\n          folded: foldedGroupKeys.some(function (key) {\n            return key === groupValue;\n          })\n        }),\n        key: \"group-\" + groupValue,\n        onClick: handleGroupTitleClick.bind(null, groupValue),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 246,\n          columnNumber: 11\n        }\n      }, renderMenuGroup ? renderMenuGroup(groupValue, item) : groupValue);\n    } else if ((0, _isUndefined.default)(value) && !(0, _isUndefined.default)(item[_symbols.RSUITE_PICKER_GROUP_KEY])) {\n      throw Error(\"valueKey \\\"\" + valueKey + \"\\\" is not defined in \\\"data\\\" : \" + index + \" \");\n    }\n    var disabled = disabledItemValues === null || disabledItemValues === void 0 ? void 0 : disabledItemValues.some(function (disabledValue) {\n      return (0, _shallowEqual.default)(disabledValue, value);\n    });\n    var active = activeItemValues === null || activeItemValues === void 0 ? void 0 : activeItemValues.some(function (v) {\n      return (0, _shallowEqual.default)(v, value);\n    });\n    var focus = !(0, _isUndefined.default)(focusItemValue) && (0, _shallowEqual.default)(focusItemValue, value);\n    return /*#__PURE__*/_react.default.createElement(ListItem, (0, _extends2.default)({\n      \"aria-posinset\": index + 1,\n      \"aria-setsize\": rowCount,\n      style: style,\n      key: itemKey,\n      disabled: disabled,\n      active: active,\n      focus: focus,\n      value: value,\n      classPrefix: listItemClassPrefix,\n      onSelect: handleSelect.bind(null, item)\n    }, (0, _pickBy.default)(listItemProps, function (v) {\n      return v !== undefined;\n    }), {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 269,\n        columnNumber: 9\n      }\n    }), renderMenuItem ? renderMenuItem(label, item) : label);\n  };\n  (0, _utils.useMount)(function () {\n    var _listRef$current, _listRef$current$scro;\n    var itemIndex = (0, _findIndex.default)(filteredItems, function (item) {\n      return item[valueKey] === (activeItemValues === null || activeItemValues === void 0 ? void 0 : activeItemValues[0]);\n    });\n    (_listRef$current = listRef.current) === null || _listRef$current === void 0 ? void 0 : (_listRef$current$scro = _listRef$current.scrollToItem) === null || _listRef$current$scro === void 0 ? void 0 : _listRef$current$scro.call(_listRef$current, itemIndex);\n  });\n  return /*#__PURE__*/_react.default.createElement(\"div\", (0, _extends2.default)({\n    role: \"listbox\",\n    id: id + \"-\" + popupType,\n    \"aria-labelledby\": labelId,\n    \"aria-multiselectable\": multiple\n  }, rest, {\n    className: classes,\n    ref: (0, _utils.mergeRefs)(menuBodyContainerRef, ref),\n    style: (0, _extends2.default)({}, style, {\n      maxHeight: maxHeight\n    }),\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 293,\n      columnNumber: 7\n    }\n  }), virtualized ? /*#__PURE__*/_react.default.createElement(_Windowing.AutoSizer, {\n    defaultHeight: maxHeight,\n    style: {\n      width: 'auto',\n      height: 'auto'\n    },\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 304,\n      columnNumber: 11\n    }\n  }, function (_ref2) {\n    var height = _ref2.height;\n    return /*#__PURE__*/_react.default.createElement(_Windowing.List, (0, _extends2.default)({\n      as: _Windowing.VariableSizeList,\n      ref: (0, _utils.mergeRefs)(listRef, virtualizedListRef),\n      height: height || maxHeight,\n      itemCount: rowCount,\n      itemData: filteredItems,\n      itemSize: getRowHeight.bind(_this, filteredItems)\n    }, listProps, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 306,\n        columnNumber: 15\n      }\n    }), renderItem);\n  }) : filteredItems.map(function (item, index) {\n    return renderItem({\n      index: index,\n      item: item\n    });\n  }));\n});\nListbox.displayName = 'Listbox';\nvar _default = Listbox;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/internals/Picker/Listbox.tsx?");
 
 /***/ }),
 
@@ -10058,7 +10498,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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _icons = __webpack_require__(/*! @rsuite/icons */ \"./node_modules/@rsuite/icons/es/index.js\");\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar _InputGroup = _interopRequireDefault(__webpack_require__(/*! ../../InputGroup */ \"./src/InputGroup/index.tsx\"));\nvar _CloseButton = _interopRequireDefault(__webpack_require__(/*! ../CloseButton */ \"./src/internals/CloseButton/index.tsx\"));\nvar _Loader = _interopRequireDefault(__webpack_require__(/*! ../../Loader */ \"./src/Loader/index.tsx\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/internals/Picker/PickerIndicator.tsx\",\n  _this = void 0;\nvar PickerIndicator = function PickerIndicator(_ref) {\n  var loading = _ref.loading,\n    caretAs = _ref.caretAs,\n    onClose = _ref.onClose,\n    showCleanButton = _ref.showCleanButton,\n    _ref$as = _ref.as,\n    Component = _ref$as === void 0 ? _InputGroup.default.Addon : _ref$as;\n  var _useCustom = (0, _utils.useCustom)(),\n    locale = _useCustom.locale;\n  var _useClassNames = (0, _utils.useClassNames)('picker'),\n    prefix = _useClassNames.prefix;\n  var addon = function addon() {\n    if (loading) {\n      return /*#__PURE__*/_react.default.createElement(_Loader.default, {\n        className: prefix('loader'),\n        \"data-testid\": \"spinner\",\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 28,\n          columnNumber: 14\n        }\n      });\n    }\n    if (showCleanButton) {\n      return /*#__PURE__*/_react.default.createElement(_CloseButton.default, {\n        className: prefix('clean'),\n        tabIndex: -1,\n        locale: {\n          closeLabel: locale === null || locale === void 0 ? void 0 : locale.clear\n        },\n        onClick: onClose,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 32,\n          columnNumber: 9\n        }\n      });\n    }\n    return caretAs && /*#__PURE__*/_react.default.createElement(_icons.Icon, {\n      as: caretAs,\n      className: prefix('caret-icon'),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 40,\n        columnNumber: 23\n      }\n    });\n  };\n  return /*#__PURE__*/_react.default.createElement(Component, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 43,\n      columnNumber: 10\n    }\n  }, addon());\n};\nvar _default = PickerIndicator;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/internals/Picker/PickerIndicator.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _icons = __webpack_require__(/*! @rsuite/icons */ \"./node_modules/@rsuite/icons/es/index.js\");\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar _InputGroup = _interopRequireDefault(__webpack_require__(/*! ../../InputGroup */ \"./src/InputGroup/index.tsx\"));\nvar _CloseButton = _interopRequireDefault(__webpack_require__(/*! ../CloseButton */ \"./src/internals/CloseButton/index.tsx\"));\nvar _Loader = _interopRequireDefault(__webpack_require__(/*! ../../Loader */ \"./src/Loader/index.tsx\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/internals/Picker/PickerIndicator.tsx\",\n  _this = void 0;\nvar PickerIndicator = function PickerIndicator(_ref) {\n  var loading = _ref.loading,\n    caretAs = _ref.caretAs,\n    onClose = _ref.onClose,\n    showCleanButton = _ref.showCleanButton,\n    _ref$as = _ref.as,\n    Component = _ref$as === void 0 ? _InputGroup.default.Addon : _ref$as,\n    disabled = _ref.disabled;\n  var _useCustom = (0, _utils.useCustom)(),\n    locale = _useCustom.locale;\n  var _useClassNames = (0, _utils.useClassNames)('picker'),\n    prefix = _useClassNames.prefix;\n  var addon = function addon() {\n    if (loading) {\n      return /*#__PURE__*/_react.default.createElement(_Loader.default, {\n        className: prefix('loader'),\n        \"data-testid\": \"spinner\",\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 30,\n          columnNumber: 14\n        }\n      });\n    }\n    if (showCleanButton && !disabled) {\n      return /*#__PURE__*/_react.default.createElement(_CloseButton.default, {\n        className: prefix('clean'),\n        tabIndex: -1,\n        locale: {\n          closeLabel: locale === null || locale === void 0 ? void 0 : locale.clear\n        },\n        onClick: onClose,\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 34,\n          columnNumber: 9\n        }\n      });\n    }\n    return caretAs && /*#__PURE__*/_react.default.createElement(_icons.Icon, {\n      as: caretAs,\n      className: prefix('caret-icon'),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 42,\n        columnNumber: 23\n      }\n    });\n  };\n  var props = Component === _InputGroup.default.Addon ? {\n    disabled: disabled\n  } : undefined;\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, props, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 47,\n      columnNumber: 10\n    }\n  }), addon());\n};\nvar _default = PickerIndicator;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/internals/Picker/PickerIndicator.tsx?");
 
 /***/ }),
 
@@ -10128,17 +10568,6 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 
 /***/ }),
 
-/***/ "./src/internals/Picker/TreeView.tsx":
-/*!*******************************************!*\
-  !*** ./src/internals/Picker/TreeView.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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _useCombobox2 = _interopRequireDefault(__webpack_require__(/*! ./hooks/useCombobox */ \"./src/internals/Picker/hooks/useCombobox.ts\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/internals/Picker/TreeView.tsx\",\n  _this = void 0;\nvar TreeView = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var children = props.children,\n    treeRootClassName = props.treeRootClassName,\n    multiselectable = props.multiselectable,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"children\", \"treeRootClassName\", \"multiselectable\"]);\n  var _useCombobox = (0, _useCombobox2.default)(),\n    id = _useCombobox.id,\n    labelId = _useCombobox.labelId,\n    popupType = _useCombobox.popupType;\n  return /*#__PURE__*/_react.default.createElement(\"div\", (0, _extends2.default)({\n    role: \"tree\",\n    id: id ? id + \"-\" + popupType : undefined,\n    \"aria-multiselectable\": multiselectable,\n    \"aria-labelledby\": labelId,\n    ref: ref\n  }, rest, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 14,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: treeRootClassName,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 22,\n      columnNumber: 7\n    }\n  }, children));\n});\nvar _default = TreeView;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/internals/Picker/TreeView.tsx?");
-
-/***/ }),
-
 /***/ "./src/internals/Picker/hooks/index.ts":
 /*!*********************************************!*\
   !*** ./src/internals/Picker/hooks/index.ts ***!
@@ -10168,7 +10597,7 @@ eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react
 /***/ (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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _isUndefined = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\nvar _find = _interopRequireDefault(__webpack_require__(/*! lodash/find */ \"./node_modules/lodash/find.js\"));\nvar _domLib = __webpack_require__(/*! dom-lib */ \"./node_modules/dom-lib/esm/index.js\");\nvar _utils = __webpack_require__(/*! ../../../utils */ \"./src/utils/index.ts\");\nvar _treeUtils = __webpack_require__(/*! ../../../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/internals/Picker/utils.ts\");\n/**\n * A hook that manages the focus state of the option.\n * @param defaultFocusItemValue\n * @param props\n */\nvar useFocusItemValue = function useFocusItemValue(defaultFocusItemValue, props) {\n  var _props$valueKey = props.valueKey,\n    valueKey = _props$valueKey === void 0 ? 'value' : _props$valueKey,\n    _props$focusableQuery = props.focusableQueryKey,\n    focusableQueryKey = _props$focusableQuery === void 0 ? '[data-key][aria-disabled=\"false\"]' : _props$focusableQuery,\n    _props$defaultLayer = props.defaultLayer,\n    defaultLayer = _props$defaultLayer === void 0 ? 0 : _props$defaultLayer,\n    _props$focusToOption = props.focusToOption,\n    focusToOption = _props$focusToOption === void 0 ? true : _props$focusToOption,\n    data = props.data,\n    target = props.target,\n    rtl = props.rtl,\n    callback = props.callback,\n    _props$getParent = props.getParent,\n    getParent = _props$getParent === void 0 ? function (item) {\n      return item === null || item === void 0 ? void 0 : item.parent;\n    } : _props$getParent;\n  var _useState = (0, _react.useState)(defaultFocusItemValue),\n    focusItemValue = _useState[0],\n    setFocusItemValue = _useState[1];\n  var _useState2 = (0, _react.useState)(defaultLayer),\n    layer = _useState2[0],\n    setLayer = _useState2[1];\n  var _useState3 = (0, _react.useState)([]),\n    keys = _useState3[0],\n    setKeys = _useState3[1];\n  var focusCallback = (0, _utils.useEventCallback)(function (value, event) {\n    if (focusToOption) {\n      var menu = (0, _isFunction.default)(target) ? target() : target;\n      var focusElement = menu === null || menu === void 0 ? void 0 : menu.querySelector(\"[data-key=\\\"\" + value + \"\\\"]\");\n      focusElement === null || focusElement === void 0 ? void 0 : focusElement.focus();\n    }\n    callback === null || callback === void 0 ? void 0 : callback(value, event);\n  });\n  var getScrollContainer = (0, _utils.useEventCallback)(function () {\n    var menu = (0, _isFunction.default)(target) ? target() : target;\n\n    // For Cascader and MutiCascader\n    var subMenu = menu === null || menu === void 0 ? void 0 : menu.querySelector(\"[data-layer=\\\"\" + layer + \"\\\"]\");\n    if (subMenu) {\n      return subMenu;\n    }\n\n    // For SelectPicker、CheckPicker、Autocomplete、InputPicker、TagPicker\n    return menu === null || menu === void 0 ? void 0 : menu.querySelector('[role=\"listbox\"]');\n  });\n\n  /**\n   * Get the elements visible in all options.\n   */\n  var getFocusableMenuItems = function getFocusableMenuItems() {\n    if (!target) {\n      return [];\n    }\n    var currentKeys = keys;\n    if (layer < 1) {\n      var popup = (0, _isFunction.default)(target) ? target() : target;\n      var rootMenu = popup === null || popup === void 0 ? void 0 : popup.querySelector('[data-layer=\"0\"]');\n      if (rootMenu) {\n        var _rootMenu$querySelect;\n        currentKeys = Array.from((_rootMenu$querySelect = rootMenu.querySelectorAll(focusableQueryKey)) !== null && _rootMenu$querySelect !== void 0 ? _rootMenu$querySelect : []).map(function (item) {\n          var _item$dataset;\n          return (_item$dataset = item.dataset) === null || _item$dataset === void 0 ? void 0 : _item$dataset.key;\n        });\n      } else {\n        var _popup$querySelectorA;\n        currentKeys = Array.from((_popup$querySelectorA = popup === null || popup === void 0 ? void 0 : popup.querySelectorAll(focusableQueryKey)) !== null && _popup$querySelectorA !== void 0 ? _popup$querySelectorA : []).map(function (item) {\n          var _item$dataset2;\n          return (_item$dataset2 = item.dataset) === null || _item$dataset2 === void 0 ? void 0 : _item$dataset2.key;\n        });\n      }\n    }\n\n    // 1. It is necessary to traverse the `keys` instead of `data` here to preserve the order of the array.\n    // 2. The values ​​in `keys` are all string, so the corresponding value of `data` should also be converted to string\n    return currentKeys.map(function (key) {\n      return (0, _find.default)(data, function (i) {\n        return \"\" + i[valueKey] === key;\n      });\n    });\n  };\n\n  /**\n   * Get the index of the focus item.\n   */\n  var findFocusItemIndex = (0, _utils.useEventCallback)(function (callback) {\n    var items = getFocusableMenuItems();\n    for (var i = 0; i < items.length; i += 1) {\n      var _items$i;\n      if ((0, _utils.shallowEqual)(focusItemValue, (_items$i = items[i]) === null || _items$i === void 0 ? void 0 : _items$i[valueKey])) {\n        callback(items, i);\n        return;\n      }\n    }\n    callback(items, -1);\n  });\n  var scrollListItem = (0, _utils.useEventCallback)(function (direction, itemValue, willOverflow) {\n    var container = getScrollContainer();\n    var item = container === null || container === void 0 ? void 0 : container.querySelector(\"[data-key=\\\"\" + itemValue + \"\\\"]\");\n    if (willOverflow && container) {\n      var scrollHeight = container.scrollHeight,\n        clientHeight = container.clientHeight;\n      container.scrollTop = direction === 'top' ? scrollHeight - clientHeight : 0;\n      return;\n    }\n    if (item && container) {\n      if (!isVisible(item, container, direction)) {\n        var height = (0, _domLib.getHeight)(item);\n        scrollTo(container, direction, height);\n      }\n    }\n  });\n  var focusNextMenuItem = (0, _utils.useEventCallback)(function (event) {\n    findFocusItemIndex(function (items, index) {\n      var willOverflow = index + 2 > items.length;\n      var nextIndex = willOverflow ? 0 : index + 1;\n      var focusItem = items[nextIndex];\n      if (!(0, _isUndefined.default)(focusItem)) {\n        setFocusItemValue(focusItem[valueKey]);\n        focusCallback(focusItem[valueKey], event);\n        scrollListItem('bottom', focusItem[valueKey], willOverflow);\n      }\n    });\n  });\n  var focusPrevMenuItem = (0, _utils.useEventCallback)(function (event) {\n    findFocusItemIndex(function (items, index) {\n      var willOverflow = index === 0;\n      var nextIndex = willOverflow ? items.length - 1 : index - 1;\n      var focusItem = items[nextIndex];\n      if (!(0, _isUndefined.default)(focusItem)) {\n        setFocusItemValue(focusItem[valueKey]);\n        focusCallback(focusItem[valueKey], event);\n        scrollListItem('top', focusItem[valueKey], willOverflow);\n      }\n    });\n  });\n  var getSubMenuKeys = function getSubMenuKeys(nextLayer) {\n    var menu = (0, _isFunction.default)(target) ? target() : target;\n    var subMenu = menu === null || menu === void 0 ? void 0 : menu.querySelector(\"[data-layer=\\\"\" + nextLayer + \"\\\"]\");\n    if (subMenu) {\n      var _Array$from;\n      return (_Array$from = Array.from(subMenu.querySelectorAll(focusableQueryKey))) === null || _Array$from === void 0 ? void 0 : _Array$from.map(function (item) {\n        var _item$dataset3;\n        return (_item$dataset3 = item.dataset) === null || _item$dataset3 === void 0 ? void 0 : _item$dataset3.key;\n      });\n    }\n    return null;\n  };\n  var focusNextLevelMenu = (0, _utils.useEventCallback)(function (event) {\n    var nextLayer = layer + 1;\n    var nextKeys = getSubMenuKeys(nextLayer);\n    if (nextKeys) {\n      setKeys(nextKeys);\n      setLayer(nextLayer);\n      setFocusItemValue(nextKeys[0]);\n      focusCallback(nextKeys[0], event);\n    }\n  });\n  var focusPrevLevelMenu = (0, _utils.useEventCallback)(function (event) {\n    var nextLayer = layer - 1;\n    var nextKeys = getSubMenuKeys(nextLayer);\n    if (nextKeys) {\n      var _getParent;\n      setKeys(nextKeys);\n      setLayer(nextLayer);\n      var focusItem = (0, _treeUtils.findNodeOfTree)(data, function (item) {\n        return item[valueKey] === focusItemValue;\n      });\n      var parentItemValue = (_getParent = getParent(focusItem)) === null || _getParent === void 0 ? void 0 : _getParent[valueKey];\n      if (parentItemValue) {\n        setFocusItemValue(parentItemValue);\n        focusCallback(parentItemValue, event);\n      }\n    }\n  });\n  var handleKeyDown = (0, _utils.useEventCallback)(function (event) {\n    var _onMenuKeyDown;\n    (0, _utils2.onMenuKeyDown)(event, (_onMenuKeyDown = {\n      down: focusNextMenuItem,\n      up: focusPrevMenuItem\n    }, _onMenuKeyDown[rtl ? 'left' : 'right'] = focusNextLevelMenu, _onMenuKeyDown[rtl ? 'right' : 'left'] = focusPrevLevelMenu, _onMenuKeyDown));\n  });\n  return {\n    focusItemValue: focusItemValue,\n    setFocusItemValue: setFocusItemValue,\n    layer: layer,\n    setLayer: setLayer,\n    keys: keys,\n    setKeys: setKeys,\n    onKeyDown: handleKeyDown\n  };\n};\nfunction scrollTo(container, direction, step) {\n  var scrollTop = container.scrollTop;\n  container.scrollTop = direction === 'top' ? scrollTop - step : scrollTop + step;\n}\n\n/**\n * Checks if the element has a vertical scrollbar.\n */\nfunction hasVerticalScroll(element) {\n  var scrollHeight = element.scrollHeight,\n    clientHeight = element.clientHeight;\n  return scrollHeight > clientHeight;\n}\n\n/**\n * Checks if the element is within the visible area of the container\n */\nfunction isVisible(element, container, direction) {\n  if (!hasVerticalScroll(container)) {\n    return true;\n  }\n  var _element$getBoundingC = element.getBoundingClientRect(),\n    top = _element$getBoundingC.top,\n    bottom = _element$getBoundingC.bottom,\n    height = _element$getBoundingC.height;\n  var _container$getBoundin = container.getBoundingClientRect(),\n    containerTop = _container$getBoundin.top,\n    containerBottom = _container$getBoundin.bottom;\n  if (direction === 'top') {\n    return top + height > containerTop;\n  }\n  return bottom - height < containerBottom;\n}\nvar _default = useFocusItemValue;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/internals/Picker/hooks/useFocusItemValue.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _isUndefined = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\nvar _find = _interopRequireDefault(__webpack_require__(/*! lodash/find */ \"./node_modules/lodash/find.js\"));\nvar _domLib = __webpack_require__(/*! dom-lib */ \"./node_modules/dom-lib/esm/index.js\");\nvar _utils = __webpack_require__(/*! ../../../utils */ \"./src/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../../Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _utils3 = __webpack_require__(/*! ../utils */ \"./src/internals/Picker/utils.ts\");\n/**\n * A hook that manages the focus state of the option.\n * @param defaultFocusItemValue\n * @param props\n */\nvar useFocusItemValue = function useFocusItemValue(defaultFocusItemValue, props) {\n  var _props$valueKey = props.valueKey,\n    valueKey = _props$valueKey === void 0 ? 'value' : _props$valueKey,\n    _props$focusableQuery = props.focusableQueryKey,\n    focusableQueryKey = _props$focusableQuery === void 0 ? '[data-key][aria-disabled=\"false\"]' : _props$focusableQuery,\n    _props$defaultLayer = props.defaultLayer,\n    defaultLayer = _props$defaultLayer === void 0 ? 0 : _props$defaultLayer,\n    _props$focusToOption = props.focusToOption,\n    focusToOption = _props$focusToOption === void 0 ? true : _props$focusToOption,\n    data = props.data,\n    target = props.target,\n    rtl = props.rtl,\n    callback = props.callback,\n    _props$getParent = props.getParent,\n    getParent = _props$getParent === void 0 ? function (item) {\n      return item === null || item === void 0 ? void 0 : item.parent;\n    } : _props$getParent;\n  var _useState = (0, _react.useState)(defaultFocusItemValue),\n    focusItemValue = _useState[0],\n    setFocusItemValue = _useState[1];\n  var _useState2 = (0, _react.useState)(defaultLayer),\n    layer = _useState2[0],\n    setLayer = _useState2[1];\n  var _useState3 = (0, _react.useState)([]),\n    keys = _useState3[0],\n    setKeys = _useState3[1];\n  var focusCallback = (0, _utils.useEventCallback)(function (value, event) {\n    if (focusToOption) {\n      var menu = (0, _isFunction.default)(target) ? target() : target;\n      var focusElement = menu === null || menu === void 0 ? void 0 : menu.querySelector(\"[data-key=\\\"\" + value + \"\\\"]\");\n      focusElement === null || focusElement === void 0 ? void 0 : focusElement.focus();\n    }\n    callback === null || callback === void 0 ? void 0 : callback(value, event);\n  });\n  var getScrollContainer = (0, _utils.useEventCallback)(function () {\n    var menu = (0, _isFunction.default)(target) ? target() : target;\n\n    // For Cascader and MutiCascader\n    var subMenu = menu === null || menu === void 0 ? void 0 : menu.querySelector(\"[data-layer=\\\"\" + layer + \"\\\"]\");\n    if (subMenu) {\n      return subMenu;\n    }\n\n    // For SelectPicker、CheckPicker、Autocomplete、InputPicker、TagPicker\n    return menu === null || menu === void 0 ? void 0 : menu.querySelector('[role=\"listbox\"]');\n  });\n\n  /**\n   * Get the elements visible in all options.\n   */\n  var getFocusableMenuItems = function getFocusableMenuItems() {\n    if (!target) {\n      return [];\n    }\n    var currentKeys = keys;\n    if (layer < 1) {\n      var popup = (0, _isFunction.default)(target) ? target() : target;\n      var rootMenu = popup === null || popup === void 0 ? void 0 : popup.querySelector('[data-layer=\"0\"]');\n      if (rootMenu) {\n        var _rootMenu$querySelect;\n        currentKeys = Array.from((_rootMenu$querySelect = rootMenu.querySelectorAll(focusableQueryKey)) !== null && _rootMenu$querySelect !== void 0 ? _rootMenu$querySelect : []).map(function (item) {\n          var _item$dataset;\n          return (_item$dataset = item.dataset) === null || _item$dataset === void 0 ? void 0 : _item$dataset.key;\n        });\n      } else {\n        var _popup$querySelectorA;\n        currentKeys = Array.from((_popup$querySelectorA = popup === null || popup === void 0 ? void 0 : popup.querySelectorAll(focusableQueryKey)) !== null && _popup$querySelectorA !== void 0 ? _popup$querySelectorA : []).map(function (item) {\n          var _item$dataset2;\n          return (_item$dataset2 = item.dataset) === null || _item$dataset2 === void 0 ? void 0 : _item$dataset2.key;\n        });\n      }\n    }\n\n    // 1. It is necessary to traverse the `keys` instead of `data` here to preserve the order of the array.\n    // 2. The values ​​in `keys` are all string, so the corresponding value of `data` should also be converted to string\n    return currentKeys.map(function (key) {\n      return (0, _find.default)(data, function (i) {\n        return \"\" + i[valueKey] === key;\n      });\n    });\n  };\n\n  /**\n   * Get the index of the focus item.\n   */\n  var findFocusItemIndex = (0, _utils.useEventCallback)(function (callback) {\n    var items = getFocusableMenuItems();\n    for (var i = 0; i < items.length; i += 1) {\n      var _items$i;\n      if ((0, _utils.shallowEqual)(focusItemValue, (_items$i = items[i]) === null || _items$i === void 0 ? void 0 : _items$i[valueKey])) {\n        callback(items, i);\n        return;\n      }\n    }\n    callback(items, -1);\n  });\n  var scrollListItem = (0, _utils.useEventCallback)(function (direction, itemValue, willOverflow) {\n    var container = getScrollContainer();\n    var item = container === null || container === void 0 ? void 0 : container.querySelector(\"[data-key=\\\"\" + itemValue + \"\\\"]\");\n    if (willOverflow && container) {\n      var scrollHeight = container.scrollHeight,\n        clientHeight = container.clientHeight;\n      container.scrollTop = direction === 'top' ? scrollHeight - clientHeight : 0;\n      return;\n    }\n    if (item && container) {\n      if (!isVisible(item, container, direction)) {\n        var height = (0, _domLib.getHeight)(item);\n        scrollTo(container, direction, height);\n      }\n    }\n  });\n  var focusNextMenuItem = (0, _utils.useEventCallback)(function (event) {\n    findFocusItemIndex(function (items, index) {\n      var willOverflow = index + 2 > items.length;\n      var nextIndex = willOverflow ? 0 : index + 1;\n      var focusItem = items[nextIndex];\n      if (!(0, _isUndefined.default)(focusItem)) {\n        setFocusItemValue(focusItem[valueKey]);\n        focusCallback(focusItem[valueKey], event);\n        scrollListItem('bottom', focusItem[valueKey], willOverflow);\n      }\n    });\n  });\n  var focusPrevMenuItem = (0, _utils.useEventCallback)(function (event) {\n    findFocusItemIndex(function (items, index) {\n      var willOverflow = index === 0;\n      var nextIndex = willOverflow ? items.length - 1 : index - 1;\n      var focusItem = items[nextIndex];\n      if (!(0, _isUndefined.default)(focusItem)) {\n        setFocusItemValue(focusItem[valueKey]);\n        focusCallback(focusItem[valueKey], event);\n        scrollListItem('top', focusItem[valueKey], willOverflow);\n      }\n    });\n  });\n  var getSubMenuKeys = function getSubMenuKeys(nextLayer) {\n    var menu = (0, _isFunction.default)(target) ? target() : target;\n    var subMenu = menu === null || menu === void 0 ? void 0 : menu.querySelector(\"[data-layer=\\\"\" + nextLayer + \"\\\"]\");\n    if (subMenu) {\n      var _Array$from;\n      return (_Array$from = Array.from(subMenu.querySelectorAll(focusableQueryKey))) === null || _Array$from === void 0 ? void 0 : _Array$from.map(function (item) {\n        var _item$dataset3;\n        return (_item$dataset3 = item.dataset) === null || _item$dataset3 === void 0 ? void 0 : _item$dataset3.key;\n      });\n    }\n    return null;\n  };\n  var focusNextLevelMenu = (0, _utils.useEventCallback)(function (event) {\n    var nextLayer = layer + 1;\n    var nextKeys = getSubMenuKeys(nextLayer);\n    if (nextKeys) {\n      setKeys(nextKeys);\n      setLayer(nextLayer);\n      setFocusItemValue(nextKeys[0]);\n      focusCallback(nextKeys[0], event);\n    }\n  });\n  var focusPrevLevelMenu = (0, _utils.useEventCallback)(function (event) {\n    var nextLayer = layer - 1;\n    var nextKeys = getSubMenuKeys(nextLayer);\n    if (nextKeys) {\n      var _getParent;\n      setKeys(nextKeys);\n      setLayer(nextLayer);\n      var focusItem = (0, _utils2.findNodeOfTree)(data, function (item) {\n        return item[valueKey] === focusItemValue;\n      });\n      var parentItemValue = (_getParent = getParent(focusItem)) === null || _getParent === void 0 ? void 0 : _getParent[valueKey];\n      if (parentItemValue) {\n        setFocusItemValue(parentItemValue);\n        focusCallback(parentItemValue, event);\n      }\n    }\n  });\n  var handleKeyDown = (0, _utils.useEventCallback)(function (event) {\n    var _onMenuKeyDown;\n    (0, _utils3.onMenuKeyDown)(event, (_onMenuKeyDown = {\n      down: focusNextMenuItem,\n      up: focusPrevMenuItem\n    }, _onMenuKeyDown[rtl ? 'left' : 'right'] = focusNextLevelMenu, _onMenuKeyDown[rtl ? 'right' : 'left'] = focusPrevLevelMenu, _onMenuKeyDown));\n  });\n  return {\n    focusItemValue: focusItemValue,\n    setFocusItemValue: setFocusItemValue,\n    layer: layer,\n    setLayer: setLayer,\n    keys: keys,\n    setKeys: setKeys,\n    onKeyDown: handleKeyDown\n  };\n};\nfunction scrollTo(container, direction, step) {\n  var scrollTop = container.scrollTop;\n  container.scrollTop = direction === 'top' ? scrollTop - step : scrollTop + step;\n}\n\n/**\n * Checks if the element has a vertical scrollbar.\n */\nfunction hasVerticalScroll(element) {\n  var scrollHeight = element.scrollHeight,\n    clientHeight = element.clientHeight;\n  return scrollHeight > clientHeight;\n}\n\n/**\n * Checks if the element is within the visible area of the container\n */\nfunction isVisible(element, container, direction) {\n  if (!hasVerticalScroll(container)) {\n    return true;\n  }\n  var _element$getBoundingC = element.getBoundingClientRect(),\n    top = _element$getBoundingC.top,\n    bottom = _element$getBoundingC.bottom,\n    height = _element$getBoundingC.height;\n  var _container$getBoundin = container.getBoundingClientRect(),\n    containerTop = _container$getBoundin.top,\n    containerBottom = _container$getBoundin.bottom;\n  if (direction === 'top') {\n    return top + height > containerTop;\n  }\n  return bottom - height < containerBottom;\n}\nvar _default = useFocusItemValue;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/internals/Picker/hooks/useFocusItemValue.ts?");
 
 /***/ }),
 
@@ -10190,7 +10619,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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _useEventCallback = _interopRequireDefault(__webpack_require__(/*! ../../../utils/useEventCallback */ \"./src/utils/useEventCallback.ts\"));\nvar _symbols = __webpack_require__(/*! ../../../internals/symbols */ \"./src/internals/symbols.ts\");\n/**\n * A hook of the exposed method of Picker\n */\nfunction usePickerRef(ref, parmas) {\n  var trigger = (0, _react.useRef)(null);\n  var root = (0, _react.useRef)(null);\n  var target = (0, _react.useRef)(null);\n  var overlay = (0, _react.useRef)(null);\n  var list = (0, _react.useRef)(null);\n  var searchInput = (0, _react.useRef)(null);\n  var treeView = (0, _react.useRef)(null);\n  var _ref = parmas || {},\n    inline = _ref.inline;\n  var handleOpen = (0, _useEventCallback.default)(function () {\n    var _trigger$current;\n    trigger === null || trigger === void 0 ? void 0 : (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : _trigger$current.open();\n  });\n  var handleClose = (0, _useEventCallback.default)(function () {\n    var _trigger$current2;\n    trigger === null || trigger === void 0 ? void 0 : (_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : _trigger$current2.close();\n  });\n  var handleUpdatePosition = (0, _useEventCallback.default)(function () {\n    var _trigger$current3;\n    trigger === null || trigger === void 0 ? void 0 : (_trigger$current3 = trigger.current) === null || _trigger$current3 === void 0 ? void 0 : _trigger$current3.updatePosition();\n  });\n  (0, _react.useImperativeHandle)(ref, function () {\n    // Tree and CheckTree\n    if (inline) {\n      return {\n        get root() {\n          var _trigger$current$root, _trigger$current4;\n          return root !== null && root !== void 0 && root.current ? root === null || root === void 0 ? void 0 : root.current : (_trigger$current$root = trigger === null || trigger === void 0 ? void 0 : (_trigger$current4 = trigger.current) === null || _trigger$current4 === void 0 ? void 0 : _trigger$current4.root) !== null && _trigger$current$root !== void 0 ? _trigger$current$root : null;\n        },\n        get list() {\n          if (!(list !== null && list !== void 0 && list.current)) {\n            throw new Error('The list is not found, please set `virtualized` for the component.');\n          }\n          return list === null || list === void 0 ? void 0 : list.current;\n        }\n      };\n    }\n    return {\n      get root() {\n        var _ref2, _trigger$current5;\n        return (_ref2 = (root === null || root === void 0 ? void 0 : root.current) || (trigger === null || trigger === void 0 ? void 0 : (_trigger$current5 = trigger.current) === null || _trigger$current5 === void 0 ? void 0 : _trigger$current5.root)) !== null && _ref2 !== void 0 ? _ref2 : null;\n      },\n      get overlay() {\n        var _overlay$current;\n        if (!(overlay !== null && overlay !== void 0 && overlay.current)) {\n          throw new Error('The overlay is not found. Please confirm whether the picker is open.');\n        }\n        return (_overlay$current = overlay === null || overlay === void 0 ? void 0 : overlay.current) !== null && _overlay$current !== void 0 ? _overlay$current : null;\n      },\n      get target() {\n        var _target$current;\n        return (_target$current = target === null || target === void 0 ? void 0 : target.current) !== null && _target$current !== void 0 ? _target$current : null;\n      },\n      get list() {\n        if (!(list !== null && list !== void 0 && list.current)) {\n          throw new Error(\"\\n            The list is not found.\\n            1.Please set virtualized for the component.\\n            2.Please confirm whether the picker is open.\\n          \");\n        }\n        return list === null || list === void 0 ? void 0 : list.current;\n      },\n      type: _symbols.RSUITE_PICKER_TYPE,\n      updatePosition: handleUpdatePosition,\n      open: handleOpen,\n      close: handleClose\n    };\n  });\n  return {\n    trigger: trigger,\n    root: root,\n    overlay: overlay,\n    target: target,\n    list: list,\n    searchInput: searchInput,\n    treeView: treeView\n  };\n}\nvar _default = usePickerRef;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/internals/Picker/hooks/usePickerRef.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _useEventCallback = _interopRequireDefault(__webpack_require__(/*! ../../../utils/useEventCallback */ \"./src/utils/useEventCallback.ts\"));\nvar _symbols = __webpack_require__(/*! ../../../internals/symbols */ \"./src/internals/symbols.ts\");\n/**\n * A hook of the exposed method of Picker\n */\nfunction usePickerRef(ref) {\n  var trigger = (0, _react.useRef)(null);\n  var root = (0, _react.useRef)(null);\n  var target = (0, _react.useRef)(null);\n  var overlay = (0, _react.useRef)(null);\n  var list = (0, _react.useRef)(null);\n  var searchInput = (0, _react.useRef)(null);\n  var treeView = (0, _react.useRef)(null);\n  var handleOpen = (0, _useEventCallback.default)(function () {\n    var _trigger$current;\n    trigger === null || trigger === void 0 ? void 0 : (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : _trigger$current.open();\n  });\n  var handleClose = (0, _useEventCallback.default)(function () {\n    var _trigger$current2;\n    trigger === null || trigger === void 0 ? void 0 : (_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : _trigger$current2.close();\n  });\n  var handleUpdatePosition = (0, _useEventCallback.default)(function () {\n    var _trigger$current3;\n    trigger === null || trigger === void 0 ? void 0 : (_trigger$current3 = trigger.current) === null || _trigger$current3 === void 0 ? void 0 : _trigger$current3.updatePosition();\n  });\n  (0, _react.useImperativeHandle)(ref, function () {\n    return {\n      get root() {\n        var _ref, _trigger$current4;\n        return (_ref = (root === null || root === void 0 ? void 0 : root.current) || (trigger === null || trigger === void 0 ? void 0 : (_trigger$current4 = trigger.current) === null || _trigger$current4 === void 0 ? void 0 : _trigger$current4.root)) !== null && _ref !== void 0 ? _ref : null;\n      },\n      get overlay() {\n        var _overlay$current;\n        if (!(overlay !== null && overlay !== void 0 && overlay.current)) {\n          throw new Error('The overlay is not found. Please confirm whether the picker is open.');\n        }\n        return (_overlay$current = overlay === null || overlay === void 0 ? void 0 : overlay.current) !== null && _overlay$current !== void 0 ? _overlay$current : null;\n      },\n      get target() {\n        var _target$current;\n        return (_target$current = target === null || target === void 0 ? void 0 : target.current) !== null && _target$current !== void 0 ? _target$current : null;\n      },\n      get list() {\n        if (!(list !== null && list !== void 0 && list.current)) {\n          throw new Error(\"\\n            The list is not found.\\n            1.Please set virtualized for the component.\\n            2.Please confirm whether the picker is open.\\n          \");\n        }\n        return list === null || list === void 0 ? void 0 : list.current;\n      },\n      type: _symbols.RSUITE_PICKER_TYPE,\n      updatePosition: handleUpdatePosition,\n      open: handleOpen,\n      close: handleClose\n    };\n  });\n  return {\n    trigger: trigger,\n    root: root,\n    overlay: overlay,\n    target: target,\n    list: list,\n    searchInput: searchInput,\n    treeView: treeView\n  };\n}\nvar _default = usePickerRef;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/internals/Picker/hooks/usePickerRef.ts?");
 
 /***/ }),
 
@@ -10223,7 +10652,7 @@ eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _utils
 /***/ (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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nvar _exportNames = {\n  TreeView: true,\n  Listbox: true,\n  ListItem: true,\n  ListItemGroup: true,\n  ListCheckItem: true,\n  PickerPopup: true,\n  PickerToggle: true,\n  PickerLabel: true,\n  PickerIndicator: true,\n  PickerToggleTrigger: true,\n  SelectedElement: true,\n  pickTriggerPropKeys: true,\n  omitTriggerPropKeys: true\n};\nexports.SelectedElement = exports.PickerToggleTrigger = exports.PickerIndicator = exports.PickerLabel = exports.PickerToggle = exports.PickerPopup = exports.ListCheckItem = exports.ListItemGroup = exports.ListItem = exports.Listbox = exports.TreeView = void 0;\nvar _PickerToggleTrigger = _interopRequireWildcard(__webpack_require__(/*! ./PickerToggleTrigger */ \"./src/internals/Picker/PickerToggleTrigger.tsx\"));\nexports.pickTriggerPropKeys = _PickerToggleTrigger.pickTriggerPropKeys;\nexports.omitTriggerPropKeys = _PickerToggleTrigger.omitTriggerPropKeys;\nexports.PickerToggleTrigger = _PickerToggleTrigger.default;\nvar _TreeView = _interopRequireDefault(__webpack_require__(/*! ./TreeView */ \"./src/internals/Picker/TreeView.tsx\"));\nexports.TreeView = _TreeView.default;\nvar _Listbox = _interopRequireDefault(__webpack_require__(/*! ./Listbox */ \"./src/internals/Picker/Listbox.tsx\"));\nexports.Listbox = _Listbox.default;\nvar _ListItem = _interopRequireDefault(__webpack_require__(/*! ./ListItem */ \"./src/internals/Picker/ListItem.tsx\"));\nexports.ListItem = _ListItem.default;\nvar _ListItemGroup = _interopRequireDefault(__webpack_require__(/*! ./ListItemGroup */ \"./src/internals/Picker/ListItemGroup.tsx\"));\nexports.ListItemGroup = _ListItemGroup.default;\nvar _ListCheckItem = _interopRequireDefault(__webpack_require__(/*! ./ListCheckItem */ \"./src/internals/Picker/ListCheckItem.tsx\"));\nexports.ListCheckItem = _ListCheckItem.default;\nvar _PickerPopup = _interopRequireDefault(__webpack_require__(/*! ./PickerPopup */ \"./src/internals/Picker/PickerPopup.tsx\"));\nexports.PickerPopup = _PickerPopup.default;\nvar _PickerToggle = _interopRequireDefault(__webpack_require__(/*! ./PickerToggle */ \"./src/internals/Picker/PickerToggle.tsx\"));\nexports.PickerToggle = _PickerToggle.default;\nvar _PickerLabel = _interopRequireDefault(__webpack_require__(/*! ./PickerLabel */ \"./src/internals/Picker/PickerLabel.tsx\"));\nexports.PickerLabel = _PickerLabel.default;\nvar _PickerIndicator = _interopRequireDefault(__webpack_require__(/*! ./PickerIndicator */ \"./src/internals/Picker/PickerIndicator.tsx\"));\nexports.PickerIndicator = _PickerIndicator.default;\nvar _SelectedElement = _interopRequireDefault(__webpack_require__(/*! ./SelectedElement */ \"./src/internals/Picker/SelectedElement.tsx\"));\nexports.SelectedElement = _SelectedElement.default;\nvar _hooks = __webpack_require__(/*! ./hooks */ \"./src/internals/Picker/hooks/index.ts\");\nObject.keys(_hooks).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] === _hooks[key]) return;\n  exports[key] = _hooks[key];\n});\nvar _utils = __webpack_require__(/*! ./utils */ \"./src/internals/Picker/utils.ts\");\nObject.keys(_utils).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] === _utils[key]) return;\n  exports[key] = _utils[key];\n});\nvar _propTypes = __webpack_require__(/*! ./propTypes */ \"./src/internals/Picker/propTypes.ts\");\nObject.keys(_propTypes).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] === _propTypes[key]) return;\n  exports[key] = _propTypes[key];\n});\n\n//# sourceURL=webpack://rsuite/./src/internals/Picker/index.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nvar _exportNames = {\n  Listbox: true,\n  ListItem: true,\n  ListItemGroup: true,\n  ListCheckItem: true,\n  PickerPopup: true,\n  PickerToggle: true,\n  PickerLabel: true,\n  PickerIndicator: true,\n  PickerToggleTrigger: true,\n  SelectedElement: true,\n  pickTriggerPropKeys: true,\n  omitTriggerPropKeys: true\n};\nexports.SelectedElement = exports.PickerToggleTrigger = exports.PickerIndicator = exports.PickerLabel = exports.PickerToggle = exports.PickerPopup = exports.ListCheckItem = exports.ListItemGroup = exports.ListItem = exports.Listbox = void 0;\nvar _PickerToggleTrigger = _interopRequireWildcard(__webpack_require__(/*! ./PickerToggleTrigger */ \"./src/internals/Picker/PickerToggleTrigger.tsx\"));\nexports.pickTriggerPropKeys = _PickerToggleTrigger.pickTriggerPropKeys;\nexports.omitTriggerPropKeys = _PickerToggleTrigger.omitTriggerPropKeys;\nexports.PickerToggleTrigger = _PickerToggleTrigger.default;\nvar _Listbox = _interopRequireDefault(__webpack_require__(/*! ./Listbox */ \"./src/internals/Picker/Listbox.tsx\"));\nexports.Listbox = _Listbox.default;\nvar _ListItem = _interopRequireDefault(__webpack_require__(/*! ./ListItem */ \"./src/internals/Picker/ListItem.tsx\"));\nexports.ListItem = _ListItem.default;\nvar _ListItemGroup = _interopRequireDefault(__webpack_require__(/*! ./ListItemGroup */ \"./src/internals/Picker/ListItemGroup.tsx\"));\nexports.ListItemGroup = _ListItemGroup.default;\nvar _ListCheckItem = _interopRequireDefault(__webpack_require__(/*! ./ListCheckItem */ \"./src/internals/Picker/ListCheckItem.tsx\"));\nexports.ListCheckItem = _ListCheckItem.default;\nvar _PickerPopup = _interopRequireDefault(__webpack_require__(/*! ./PickerPopup */ \"./src/internals/Picker/PickerPopup.tsx\"));\nexports.PickerPopup = _PickerPopup.default;\nvar _PickerToggle = _interopRequireDefault(__webpack_require__(/*! ./PickerToggle */ \"./src/internals/Picker/PickerToggle.tsx\"));\nexports.PickerToggle = _PickerToggle.default;\nvar _PickerLabel = _interopRequireDefault(__webpack_require__(/*! ./PickerLabel */ \"./src/internals/Picker/PickerLabel.tsx\"));\nexports.PickerLabel = _PickerLabel.default;\nvar _PickerIndicator = _interopRequireDefault(__webpack_require__(/*! ./PickerIndicator */ \"./src/internals/Picker/PickerIndicator.tsx\"));\nexports.PickerIndicator = _PickerIndicator.default;\nvar _SelectedElement = _interopRequireDefault(__webpack_require__(/*! ./SelectedElement */ \"./src/internals/Picker/SelectedElement.tsx\"));\nexports.SelectedElement = _SelectedElement.default;\nvar _hooks = __webpack_require__(/*! ./hooks */ \"./src/internals/Picker/hooks/index.ts\");\nObject.keys(_hooks).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] === _hooks[key]) return;\n  exports[key] = _hooks[key];\n});\nvar _utils = __webpack_require__(/*! ./utils */ \"./src/internals/Picker/utils.ts\");\nObject.keys(_utils).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] === _utils[key]) return;\n  exports[key] = _utils[key];\n});\nvar _propTypes = __webpack_require__(/*! ./propTypes */ \"./src/internals/Picker/propTypes.ts\");\nObject.keys(_propTypes).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] === _propTypes[key]) return;\n  exports[key] = _propTypes[key];\n});\n\n//# sourceURL=webpack://rsuite/./src/internals/Picker/index.ts?");
 
 /***/ }),
 
@@ -10245,7 +10674,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\");\nexports.__esModule = true;\nexports.createConcatChildrenFunction = createConcatChildrenFunction;\nexports.shouldDisplay = shouldDisplay;\nexports.onMenuKeyDown = onMenuKeyDown;\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _trim = _interopRequireDefault(__webpack_require__(/*! lodash/trim */ \"./node_modules/lodash/trim.js\"));\nvar _treeUtils = __webpack_require__(/*! ../../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar defaultNodeKeys = {\n  valueKey: 'value',\n  childrenKey: 'children'\n};\nfunction createConcatChildrenFunction(node, nodeValue, nodeKeys) {\n  if (nodeKeys === void 0) {\n    nodeKeys = defaultNodeKeys;\n  }\n  var _nodeKeys = nodeKeys,\n    valueKey = _nodeKeys.valueKey,\n    childrenKey = _nodeKeys.childrenKey;\n  return function (data, children) {\n    if (nodeValue) {\n      node = (0, _treeUtils.findNodeOfTree)(data, function (item) {\n        return nodeValue === item[valueKey];\n      });\n    }\n    node[childrenKey] = children;\n    return data.concat([]);\n  };\n}\nfunction shouldDisplay(label, searchKeyword) {\n  if (!(0, _trim.default)(searchKeyword)) {\n    return true;\n  }\n  var keyword = searchKeyword.toLocaleLowerCase();\n  if (typeof label === 'string' || typeof label === 'number') {\n    return (\"\" + label).toLocaleLowerCase().indexOf(keyword) >= 0;\n  } else if ( /*#__PURE__*/_react.default.isValidElement(label)) {\n    var nodes = (0, _utils.reactToString)(label);\n    return nodes.join('').toLocaleLowerCase().indexOf(keyword) >= 0;\n  }\n  return false;\n}\n/**\n * Handling keyboard events...\n * @param event Keyboard event object\n * @param events Event callback functions\n */\nfunction onMenuKeyDown(event, events) {\n  var down = events.down,\n    up = events.up,\n    enter = events.enter,\n    del = events.del,\n    esc = events.esc,\n    right = events.right,\n    left = events.left;\n  switch (event.key) {\n    // down\n    case _utils.KEY_VALUES.DOWN:\n      down === null || down === void 0 ? void 0 : down(event);\n      event.preventDefault();\n      break;\n    // up\n    case _utils.KEY_VALUES.UP:\n      up === null || up === void 0 ? void 0 : up(event);\n      event.preventDefault();\n      break;\n    // enter\n    case _utils.KEY_VALUES.ENTER:\n      enter === null || enter === void 0 ? void 0 : enter(event);\n      event.preventDefault();\n      break;\n    // delete\n    case _utils.KEY_VALUES.BACKSPACE:\n      del === null || del === void 0 ? void 0 : del(event);\n      break;\n    // esc | tab\n    case _utils.KEY_VALUES.ESC:\n    case _utils.KEY_VALUES.TAB:\n      esc === null || esc === void 0 ? void 0 : esc(event);\n      break;\n    // left arrow\n    case _utils.KEY_VALUES.LEFT:\n      left === null || left === void 0 ? void 0 : left(event);\n      break;\n    // right arrow\n    case _utils.KEY_VALUES.RIGHT:\n      right === null || right === void 0 ? void 0 : right(event);\n      break;\n    default:\n  }\n}\n\n//# sourceURL=webpack://rsuite/./src/internals/Picker/utils.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports.createConcatChildrenFunction = createConcatChildrenFunction;\nexports.shouldDisplay = shouldDisplay;\nexports.onMenuKeyDown = onMenuKeyDown;\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _trim = _interopRequireDefault(__webpack_require__(/*! lodash/trim */ \"./node_modules/lodash/trim.js\"));\nvar _utils = __webpack_require__(/*! ../Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar defaultNodeKeys = {\n  valueKey: 'value',\n  childrenKey: 'children'\n};\nfunction createConcatChildrenFunction(node, nodeValue, nodeKeys) {\n  if (nodeKeys === void 0) {\n    nodeKeys = defaultNodeKeys;\n  }\n  var _nodeKeys = nodeKeys,\n    valueKey = _nodeKeys.valueKey,\n    childrenKey = _nodeKeys.childrenKey;\n  return function (data, children) {\n    if (nodeValue) {\n      node = (0, _utils.findNodeOfTree)(data, function (item) {\n        return nodeValue === item[valueKey];\n      });\n    }\n    node[childrenKey] = children;\n    return data.concat([]);\n  };\n}\nfunction shouldDisplay(label, searchKeyword) {\n  if (!(0, _trim.default)(searchKeyword)) {\n    return true;\n  }\n  var keyword = searchKeyword.toLocaleLowerCase();\n  if (typeof label === 'string' || typeof label === 'number') {\n    return (\"\" + label).toLocaleLowerCase().indexOf(keyword) >= 0;\n  } else if ( /*#__PURE__*/_react.default.isValidElement(label)) {\n    var nodes = (0, _utils2.reactToString)(label);\n    return nodes.join('').toLocaleLowerCase().indexOf(keyword) >= 0;\n  }\n  return false;\n}\n/**\n * Handling keyboard events...\n * @param event Keyboard event object\n * @param events Event callback functions\n */\nfunction onMenuKeyDown(event, events) {\n  var down = events.down,\n    up = events.up,\n    enter = events.enter,\n    del = events.del,\n    esc = events.esc,\n    right = events.right,\n    left = events.left;\n  switch (event.key) {\n    // down\n    case _utils2.KEY_VALUES.DOWN:\n      down === null || down === void 0 ? void 0 : down(event);\n      event.preventDefault();\n      break;\n    // up\n    case _utils2.KEY_VALUES.UP:\n      up === null || up === void 0 ? void 0 : up(event);\n      event.preventDefault();\n      break;\n    // enter\n    case _utils2.KEY_VALUES.ENTER:\n      enter === null || enter === void 0 ? void 0 : enter(event);\n      event.preventDefault();\n      break;\n    // delete\n    case _utils2.KEY_VALUES.BACKSPACE:\n      del === null || del === void 0 ? void 0 : del(event);\n      break;\n    // esc | tab\n    case _utils2.KEY_VALUES.ESC:\n    case _utils2.KEY_VALUES.TAB:\n      esc === null || esc === void 0 ? void 0 : esc(event);\n      break;\n    // left arrow\n    case _utils2.KEY_VALUES.LEFT:\n      left === null || left === void 0 ? void 0 : left(event);\n      break;\n    // right arrow\n    case _utils2.KEY_VALUES.RIGHT:\n      right === null || right === void 0 ? void 0 : right(event);\n      break;\n    default:\n  }\n}\n\n//# sourceURL=webpack://rsuite/./src/internals/Picker/utils.ts?");
 
 /***/ }),
 
@@ -10315,6 +10744,83 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 
 /***/ }),
 
+/***/ "./src/internals/Tree/TreeView.tsx":
+/*!*****************************************!*\
+  !*** ./src/internals/Tree/TreeView.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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _useCombobox2 = _interopRequireDefault(__webpack_require__(/*! ../Picker/hooks/useCombobox */ \"./src/internals/Picker/hooks/useCombobox.ts\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/internals/Tree/TreeView.tsx\",\n  _this = void 0;\nvar TreeView = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var children = props.children,\n    treeRootClassName = props.treeRootClassName,\n    multiselectable = props.multiselectable,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"children\", \"treeRootClassName\", \"multiselectable\"]);\n  var _useCombobox = (0, _useCombobox2.default)(),\n    id = _useCombobox.id,\n    labelId = _useCombobox.labelId,\n    popupType = _useCombobox.popupType;\n  return /*#__PURE__*/_react.default.createElement(\"div\", (0, _extends2.default)({\n    role: \"tree\",\n    id: id ? id + \"-\" + popupType : undefined,\n    \"aria-multiselectable\": multiselectable,\n    \"aria-labelledby\": labelId,\n    ref: ref\n  }, rest, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 14,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: treeRootClassName,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 22,\n      columnNumber: 7\n    }\n  }, children));\n});\nvar _default = TreeView;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/internals/Tree/TreeView.tsx?");
+
+/***/ }),
+
+/***/ "./src/internals/Tree/index.ts":
+/*!*************************************!*\
+  !*** ./src/internals/Tree/index.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\");\nexports.__esModule = true;\nexports.TreeView = void 0;\nvar _TreeView = _interopRequireDefault(__webpack_require__(/*! ./TreeView */ \"./src/internals/Tree/TreeView.tsx\"));\nexports.TreeView = _TreeView.default;\n\n//# sourceURL=webpack://rsuite/./src/internals/Tree/index.ts?");
+
+/***/ }),
+
+/***/ "./src/internals/Tree/utils/filterNodesOfTree.ts":
+/*!*******************************************************!*\
+  !*** ./src/internals/Tree/utils/filterNodesOfTree.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\");\nexports.__esModule = true;\nexports.filterNodesOfTree = filterNodesOfTree;\nvar _clone = _interopRequireDefault(__webpack_require__(/*! lodash/clone */ \"./node_modules/lodash/clone.js\"));\nfunction filterNodesOfTree(data, check) {\n  var findNodes = function findNodes(nodes) {\n    if (nodes === void 0) {\n      nodes = [];\n    }\n    var nextNodes = [];\n    for (var i = 0; i < nodes.length; i += 1) {\n      if (Array.isArray(nodes[i].children)) {\n        var nextChildren = findNodes(nodes[i].children);\n        if (nextChildren.length) {\n          var _item = (0, _clone.default)(nodes[i]);\n          _item.children = nextChildren;\n          nextNodes.push(_item);\n          continue;\n        }\n      }\n      if (check(nodes[i])) {\n        nextNodes.push(nodes[i]);\n      }\n    }\n    return nextNodes;\n  };\n  return findNodes(data);\n}\n\n//# sourceURL=webpack://rsuite/./src/internals/Tree/utils/filterNodesOfTree.ts?");
+
+/***/ }),
+
+/***/ "./src/internals/Tree/utils/findNodeOfTree.ts":
+/*!****************************************************!*\
+  !*** ./src/internals/Tree/utils/findNodeOfTree.ts ***!
+  \****************************************************/
+/***/ (function(__unused_webpack_module, exports) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.findNodeOfTree = findNodeOfTree;\nfunction findNodeOfTree(data, check) {\n  var findNode = function findNode(nodes) {\n    if (nodes === void 0) {\n      nodes = [];\n    }\n    for (var i = 0; i < nodes.length; i += 1) {\n      var item = nodes[i];\n      if (Array.isArray(item.children)) {\n        var node = findNode(item.children);\n        if (node) {\n          return node;\n        }\n      }\n      if (check(item)) {\n        return item;\n      }\n    }\n    return undefined;\n  };\n  return findNode(data);\n}\n\n//# sourceURL=webpack://rsuite/./src/internals/Tree/utils/findNodeOfTree.ts?");
+
+/***/ }),
+
+/***/ "./src/internals/Tree/utils/getParentMap.ts":
+/*!**************************************************!*\
+  !*** ./src/internals/Tree/utils/getParentMap.ts ***!
+  \**************************************************/
+/***/ (function(__unused_webpack_module, exports) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.getParentMap = getParentMap;\nexports.getKeyParentMap = getKeyParentMap;\nfunction _createForOfIteratorHelperLoose(o, allowArrayLike) { var it = typeof Symbol !== \"undefined\" && o[Symbol.iterator] || o[\"@@iterator\"]; if (it) return (it = it.call(o)).next.bind(it); if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === \"number\") { if (it) o = it; var i = 0; return function () { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }; } throw new TypeError(\"Invalid attempt to iterate non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n/**\n * Returns a WeakMap that maps each item in `items` to its parent\n * indicated by `getChildren` function\n */\nfunction getParentMap(items, getChildren) {\n  var map = new WeakMap();\n  for (var queue = [].concat(items); queue.length > 0;) {\n    var _item = queue.shift();\n    var children = getChildren(_item);\n    if (children) {\n      for (var _iterator = _createForOfIteratorHelperLoose(children), _step; !(_step = _iterator()).done;) {\n        var child = _step.value;\n        map.set(child, _item);\n        queue.push(child);\n      }\n    }\n  }\n  return map;\n}\n\n/**\n * Returns a Map that maps each item's \"key\", indicated by `getKey` function,\n * to its parent indicated by `getChildren` function\n *\n * NOTICE:\n * Using this function is discouraged.\n * Use {@link getParentMap} whenever possible.\n */\nfunction getKeyParentMap(items, getKey, getChildren) {\n  var map = new Map();\n  for (var queue = [].concat(items); queue.length > 0;) {\n    var _item2 = queue.shift();\n    var children = getChildren(_item2);\n    if (children) {\n      for (var _iterator2 = _createForOfIteratorHelperLoose(children), _step2; !(_step2 = _iterator2()).done;) {\n        var child = _step2.value;\n        map.set(getKey(child), _item2);\n        queue.push(child);\n      }\n    }\n  }\n  return map;\n}\n\n//# sourceURL=webpack://rsuite/./src/internals/Tree/utils/getParentMap.ts?");
+
+/***/ }),
+
+/***/ "./src/internals/Tree/utils/getPathTowardsItem.ts":
+/*!********************************************************!*\
+  !*** ./src/internals/Tree/utils/getPathTowardsItem.ts ***!
+  \********************************************************/
+/***/ (function(__unused_webpack_module, exports) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.getPathTowardsItem = getPathTowardsItem;\n/**\n * Returns an array indicating the hierarchy path from root towards `target` item\n */\nfunction getPathTowardsItem(target, getParent) {\n  if (!target) return [];\n  var path = [target];\n  for (var parent = getParent(target); !!parent; parent = getParent(parent)) {\n    path.unshift(parent);\n  }\n  return path;\n}\n\n//# sourceURL=webpack://rsuite/./src/internals/Tree/utils/getPathTowardsItem.ts?");
+
+/***/ }),
+
+/***/ "./src/internals/Tree/utils/index.ts":
+/*!*******************************************!*\
+  !*** ./src/internals/Tree/utils/index.ts ***!
+  \*******************************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.getKeyParentMap = exports.getParentMap = exports.getPathTowardsItem = exports.filterNodesOfTree = exports.findNodeOfTree = void 0;\nvar _findNodeOfTree = __webpack_require__(/*! ./findNodeOfTree */ \"./src/internals/Tree/utils/findNodeOfTree.ts\");\nexports.findNodeOfTree = _findNodeOfTree.findNodeOfTree;\nvar _filterNodesOfTree = __webpack_require__(/*! ./filterNodesOfTree */ \"./src/internals/Tree/utils/filterNodesOfTree.ts\");\nexports.filterNodesOfTree = _filterNodesOfTree.filterNodesOfTree;\nvar _getPathTowardsItem = __webpack_require__(/*! ./getPathTowardsItem */ \"./src/internals/Tree/utils/getPathTowardsItem.ts\");\nexports.getPathTowardsItem = _getPathTowardsItem.getPathTowardsItem;\nvar _getParentMap = __webpack_require__(/*! ./getParentMap */ \"./src/internals/Tree/utils/getParentMap.ts\");\nexports.getParentMap = _getParentMap.getParentMap;\nexports.getKeyParentMap = _getParentMap.getKeyParentMap;\n\n//# sourceURL=webpack://rsuite/./src/internals/Tree/utils/index.ts?");
+
+/***/ }),
+
 /***/ "./src/internals/Windowing/AutoSizer.tsx":
 /*!***********************************************!*\
   !*** ./src/internals/Windowing/AutoSizer.tsx ***!
@@ -10333,7 +10839,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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _reactWindow = __webpack_require__(/*! react-window */ \"./node_modules/react-window/dist/index.esm.js\");\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/internals/Windowing/List.tsx\",\n  _this = void 0;\n/**\n * This component renders a virtualized list of elements with either fixed or dynamic heights.\n *\n * @private\n */\nvar List = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var rowHeight = props.rowHeight,\n    _props$as = props.as,\n    Component = _props$as === void 0 ? _reactWindow.VariableSizeList : _props$as,\n    itemSizeProp = props.itemSize,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"rowHeight\", \"as\", \"itemSize\"]);\n  var listRef = (0, _react.useRef)(null);\n  var _useCustom = (0, _utils.useCustom)(),\n    rtl = _useCustom.rtl;\n  (0, _react.useImperativeHandle)(ref, function () {\n    return {\n      resetAfterIndex: function resetAfterIndex(index, shouldForceUpdate) {\n        var _listRef$current, _listRef$current$rese;\n        (_listRef$current = listRef.current) === null || _listRef$current === void 0 ? void 0 : (_listRef$current$rese = _listRef$current.resetAfterIndex) === null || _listRef$current$rese === void 0 ? void 0 : _listRef$current$rese.call(_listRef$current, index, shouldForceUpdate);\n      },\n      scrollTo: function scrollTo(scrollOffset) {\n        var _listRef$current2, _listRef$current2$scr;\n        (_listRef$current2 = listRef.current) === null || _listRef$current2 === void 0 ? void 0 : (_listRef$current2$scr = _listRef$current2.scrollTo) === null || _listRef$current2$scr === void 0 ? void 0 : _listRef$current2$scr.call(_listRef$current2, scrollOffset);\n      },\n      scrollToItem: function scrollToItem(index, align) {\n        var _listRef$current3, _listRef$current3$scr;\n        (_listRef$current3 = listRef.current) === null || _listRef$current3 === void 0 ? void 0 : (_listRef$current3$scr = _listRef$current3.scrollToItem) === null || _listRef$current3$scr === void 0 ? void 0 : _listRef$current3$scr.call(_listRef$current3, index, align);\n      },\n      scrollToRow: function scrollToRow(index) {\n        var _listRef$current4, _listRef$current4$scr;\n        (_listRef$current4 = listRef.current) === null || _listRef$current4 === void 0 ? void 0 : (_listRef$current4$scr = _listRef$current4.scrollToItem) === null || _listRef$current4$scr === void 0 ? void 0 : _listRef$current4$scr.call(_listRef$current4, index);\n      }\n    };\n  });\n  var setRowHeight = (0, _react.useCallback)(function (index) {\n    return typeof rowHeight === 'function' ? rowHeight({\n      index: index\n    }) : rowHeight || 0;\n  }, [rowHeight]);\n  var itemSize = (0, _react.useMemo)(function () {\n    if (typeof itemSizeProp === 'function') return itemSizeProp;\n    return function () {\n      return itemSizeProp;\n    };\n  }, [itemSizeProp]);\n  var compatibleProps = (0, _extends2.default)({\n    itemSize: itemSize\n  }, rest);\n  if (rowHeight) {\n    compatibleProps.itemSize = Component === _reactWindow.VariableSizeList ? setRowHeight : rowHeight;\n  }\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n    ref: listRef,\n    direction: rtl ? 'rtl' : 'ltr'\n  }, compatibleProps, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 102,\n      columnNumber: 10\n    }\n  }));\n});\nvar _default = List;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/internals/Windowing/List.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nexports.__esModule = true;\nexports[\"default\"] = exports.defaultItemSize = void 0;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _reactWindow = __webpack_require__(/*! react-window */ \"./node_modules/react-window/dist/index.esm.js\");\nvar _utils = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/internals/Windowing/List.tsx\",\n  _this = void 0;\nvar defaultItemSize = function defaultItemSize() {\n  return 36;\n};\nexports.defaultItemSize = defaultItemSize;\n/**\n * This component renders a virtualized list of elements with either fixed or dynamic heights.\n *\n * @private\n */\nvar List = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var rowHeight = props.rowHeight,\n    _props$as = props.as,\n    Component = _props$as === void 0 ? _reactWindow.VariableSizeList : _props$as,\n    itemSizeProp = props.itemSize,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(props, [\"rowHeight\", \"as\", \"itemSize\"]);\n  var listRef = (0, _react.useRef)(null);\n  var _useCustom = (0, _utils.useCustom)(),\n    rtl = _useCustom.rtl;\n  (0, _react.useImperativeHandle)(ref, function () {\n    return {\n      resetAfterIndex: function resetAfterIndex(index, shouldForceUpdate) {\n        var _listRef$current, _listRef$current$rese;\n        (_listRef$current = listRef.current) === null || _listRef$current === void 0 ? void 0 : (_listRef$current$rese = _listRef$current.resetAfterIndex) === null || _listRef$current$rese === void 0 ? void 0 : _listRef$current$rese.call(_listRef$current, index, shouldForceUpdate);\n      },\n      scrollTo: function scrollTo(scrollOffset) {\n        var _listRef$current2, _listRef$current2$scr;\n        (_listRef$current2 = listRef.current) === null || _listRef$current2 === void 0 ? void 0 : (_listRef$current2$scr = _listRef$current2.scrollTo) === null || _listRef$current2$scr === void 0 ? void 0 : _listRef$current2$scr.call(_listRef$current2, scrollOffset);\n      },\n      scrollToItem: function scrollToItem(index, align) {\n        var _listRef$current3, _listRef$current3$scr;\n        (_listRef$current3 = listRef.current) === null || _listRef$current3 === void 0 ? void 0 : (_listRef$current3$scr = _listRef$current3.scrollToItem) === null || _listRef$current3$scr === void 0 ? void 0 : _listRef$current3$scr.call(_listRef$current3, index, align);\n      },\n      scrollToRow: function scrollToRow(index) {\n        var _listRef$current4, _listRef$current4$scr;\n        (_listRef$current4 = listRef.current) === null || _listRef$current4 === void 0 ? void 0 : (_listRef$current4$scr = _listRef$current4.scrollToItem) === null || _listRef$current4$scr === void 0 ? void 0 : _listRef$current4$scr.call(_listRef$current4, index);\n      }\n    };\n  });\n  var setRowHeight = (0, _react.useCallback)(function (index) {\n    return typeof rowHeight === 'function' ? rowHeight({\n      index: index\n    }) : rowHeight || 0;\n  }, [rowHeight]);\n  var itemSize = (0, _react.useMemo)(function () {\n    if (typeof itemSizeProp === 'function') return itemSizeProp;\n    return function () {\n      return itemSizeProp;\n    };\n  }, [itemSizeProp]);\n  var compatibleProps = (0, _extends2.default)({\n    itemSize: itemSize\n  }, rest);\n  if (rowHeight) {\n    compatibleProps.itemSize = Component === _reactWindow.VariableSizeList ? setRowHeight : rowHeight;\n  }\n  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n    ref: listRef,\n    direction: rtl ? 'rtl' : 'ltr'\n  }, compatibleProps, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 104,\n      columnNumber: 10\n    }\n  }));\n});\nvar _default = List;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/internals/Windowing/List.tsx?");
 
 /***/ }),
 
@@ -10344,7 +10850,29 @@ 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\");\nexports.__esModule = true;\nexports.VariableSizeList = exports.FixedSizeList = exports.List = exports.AutoSizer = void 0;\nvar _AutoSizer = _interopRequireDefault(__webpack_require__(/*! ./AutoSizer */ \"./src/internals/Windowing/AutoSizer.tsx\"));\nexports.AutoSizer = _AutoSizer.default;\nvar _List = _interopRequireDefault(__webpack_require__(/*! ./List */ \"./src/internals/Windowing/List.tsx\"));\nexports.List = _List.default;\nvar _reactWindow = __webpack_require__(/*! react-window */ \"./node_modules/react-window/dist/index.esm.js\");\nexports.FixedSizeList = _reactWindow.FixedSizeList;\nexports.VariableSizeList = _reactWindow.VariableSizeList;\n\n//# sourceURL=webpack://rsuite/./src/internals/Windowing/index.ts?");
+eval("\n\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports.VariableSizeList = exports.FixedSizeList = exports.defaultItemSize = exports.List = exports.AutoSizer = void 0;\nvar _AutoSizer = _interopRequireDefault(__webpack_require__(/*! ./AutoSizer */ \"./src/internals/Windowing/AutoSizer.tsx\"));\nexports.AutoSizer = _AutoSizer.default;\nvar _List = _interopRequireWildcard(__webpack_require__(/*! ./List */ \"./src/internals/Windowing/List.tsx\"));\nexports.List = _List.default;\nexports.defaultItemSize = _List.defaultItemSize;\nvar _reactWindow = __webpack_require__(/*! react-window */ \"./node_modules/react-window/dist/index.esm.js\");\nexports.FixedSizeList = _reactWindow.FixedSizeList;\nexports.VariableSizeList = _reactWindow.VariableSizeList;\n\n//# sourceURL=webpack://rsuite/./src/internals/Windowing/index.ts?");
+
+/***/ }),
+
+/***/ "./src/internals/hooks/index.ts":
+/*!**************************************!*\
+  !*** ./src/internals/hooks/index.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\");\nexports.__esModule = true;\nexports.useFoucsVirtualListItem = void 0;\nvar _useFoucsVirtualListItem = _interopRequireDefault(__webpack_require__(/*! ./useFoucsVirtualListItem */ \"./src/internals/hooks/useFoucsVirtualListItem.ts\"));\nexports.useFoucsVirtualListItem = _useFoucsVirtualListItem.default;\n\n//# sourceURL=webpack://rsuite/./src/internals/hooks/index.ts?");
+
+/***/ }),
+
+/***/ "./src/internals/hooks/useFoucsVirtualListItem.ts":
+/*!********************************************************!*\
+  !*** ./src/internals/hooks/useFoucsVirtualListItem.ts ***!
+  \********************************************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _react = __webpack_require__(/*! react */ \"react\");\n/**\n * Virtualized list loses focus when scrolling or clicking options, causing the component to re-render.\n * To solve this problem, we need to refocus on the selected option after the component is re-rendered.\n */\nfunction useFoucsVirtualListItem(focused) {\n  var itemRef = (0, _react.useRef)(null);\n  (0, _react.useEffect)(function () {\n    if (!focused) {\n      return;\n    }\n    if (document.activeElement !== itemRef.current) {\n      var _itemRef$current;\n      // Focus on the selected option.\n      (_itemRef$current = itemRef.current) === null || _itemRef$current === void 0 ? void 0 : _itemRef$current.focus();\n    }\n  }, [focused]);\n  return itemRef;\n}\nvar _default = useFoucsVirtualListItem;\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/internals/hooks/useFoucsVirtualListItem.ts?");
 
 /***/ }),
 
@@ -10392,6 +10920,39 @@ eval("\n\nexports.__esModule = true;\nexports.RSUITE_PICKER_GROUP_KEY = exports.
 
 /***/ }),
 
+/***/ "./src/internals/utils/getSafeRegExpString.ts":
+/*!****************************************************!*\
+  !*** ./src/internals/utils/getSafeRegExpString.ts ***!
+  \****************************************************/
+/***/ (function(__unused_webpack_module, exports) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.getSafeRegExpString = getSafeRegExpString;\n/**\n * @description escape Regular_Expressions special_characters '^$.|*+?{\\\\[()'\n */\nfunction getSafeRegExpString(str) {\n  return str.replace(/([\\^\\$\\.\\|\\*\\+\\?\\{\\\\\\[\\(\\)])/g, '\\\\$1');\n}\n\n//# sourceURL=webpack://rsuite/./src/internals/utils/getSafeRegExpString.ts?");
+
+/***/ }),
+
+/***/ "./src/internals/utils/index.ts":
+/*!**************************************!*\
+  !*** ./src/internals/utils/index.ts ***!
+  \**************************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.getSafeRegExpString = exports.stringifyReactNode = void 0;\nvar _stringifyReactNode = __webpack_require__(/*! ./stringifyReactNode */ \"./src/internals/utils/stringifyReactNode.ts\");\nexports.stringifyReactNode = _stringifyReactNode.stringifyReactNode;\nvar _getSafeRegExpString = __webpack_require__(/*! ./getSafeRegExpString */ \"./src/internals/utils/getSafeRegExpString.ts\");\nexports.getSafeRegExpString = _getSafeRegExpString.getSafeRegExpString;\n\n//# sourceURL=webpack://rsuite/./src/internals/utils/index.ts?");
+
+/***/ }),
+
+/***/ "./src/internals/utils/stringifyReactNode.ts":
+/*!***************************************************!*\
+  !*** ./src/internals/utils/stringifyReactNode.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\");\nexports.__esModule = true;\nexports.stringifyReactNode = stringifyReactNode;\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _reactToString = _interopRequireDefault(__webpack_require__(/*! ../../utils/reactToString */ \"./src/utils/reactToString.ts\"));\nfunction stringifyReactNode(node) {\n  if (typeof node === 'string') {\n    return node;\n  } else if ( /*#__PURE__*/_react.default.isValidElement(node)) {\n    var nodes = (0, _reactToString.default)(node);\n    return nodes.join('');\n  }\n  return '';\n}\n\n//# sourceURL=webpack://rsuite/./src/internals/utils/stringifyReactNode.ts?");
+
+/***/ }),
+
 /***/ "./src/locales/default.ts":
 /*!********************************!*\
   !*** ./src/locales/default.ts ***!
@@ -10524,17 +11085,6 @@ eval("\n\nexports.__esModule = true;\nexports[\"default\"] = ajaxUpload;\nfuncti
 
 /***/ }),
 
-/***/ "./src/utils/appendTooltip.tsx":
-/*!*************************************!*\
-  !*** ./src/utils/appendTooltip.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\");\nexports.__esModule = true;\nexports[\"default\"] = appendTooltip;\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _Tooltip = _interopRequireDefault(__webpack_require__(/*! ../Tooltip */ \"./src/Tooltip/index.tsx\"));\nvar _Whisper = _interopRequireDefault(__webpack_require__(/*! ../Whisper */ \"./src/Whisper/index.tsx\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/utils/appendTooltip.tsx\";\nfunction appendTooltip(_ref) {\n  var message = _ref.message,\n    ref = _ref.ref,\n    rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, [\"message\", \"ref\"]);\n  return /*#__PURE__*/_react.default.createElement(_Whisper.default, (0, _extends2.default)({\n    ref: ref,\n    speaker: /*#__PURE__*/_react.default.createElement(_Tooltip.default, {\n      __self: this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 14,\n        columnNumber: 38\n      }\n    }, message)\n  }, rest, {\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 14,\n      columnNumber: 10\n    }\n  }));\n}\n\n//# sourceURL=webpack://rsuite/./src/utils/appendTooltip.tsx?");
-
-/***/ }),
-
 /***/ "./src/utils/attachParent.ts":
 /*!***********************************!*\
   !*** ./src/utils/attachParent.ts ***!
@@ -10575,7 +11125,7 @@ eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _defau
 /***/ (function(__unused_webpack_module, exports) {
 
 "use strict";
-eval("\n\nexports.__esModule = true;\nexports.DATERANGE_DISABLED_TARGET = exports.KEY_VALUES = exports.TREE_NODE_DROP_POSITION = exports.TREE_NODE_ROOT_PADDING = exports.TREE_NODE_PADDING = exports.CHECK_STATE = exports.PLACEMENT = exports.PLACEMENT_AUTO = exports.PLACEMENT_8 = exports.PLACEMENT_4 = exports.COLOR = exports.STATUS = exports.COLUMN_SIZE = exports.SIZE = void 0;\nvar SIZE = ['lg', 'md', 'sm', 'xs'];\nexports.SIZE = SIZE;\nvar COLUMN_SIZE = ['xxl', 'xl', 'lg', 'md', 'sm', 'xs'];\nexports.COLUMN_SIZE = COLUMN_SIZE;\nvar STATUS = ['success', 'warning', 'error', 'info'];\nexports.STATUS = STATUS;\nvar COLOR = ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'violet'];\nexports.COLOR = COLOR;\nvar PLACEMENT_4 = ['top', 'bottom', 'right', 'left'];\nexports.PLACEMENT_4 = PLACEMENT_4;\nvar PLACEMENT_8 = ['bottomStart', 'bottomEnd', 'topStart', 'topEnd', 'leftStart', 'rightStart', 'leftEnd', 'rightEnd'];\nexports.PLACEMENT_8 = PLACEMENT_8;\nvar PLACEMENT_AUTO = ['auto', 'autoVertical', 'autoVerticalStart', 'autoVerticalEnd', 'autoHorizontal', 'autoHorizontalStart', 'autoHorizontalEnd'];\nexports.PLACEMENT_AUTO = PLACEMENT_AUTO;\nvar PLACEMENT = [].concat(PLACEMENT_4, PLACEMENT_8, PLACEMENT_AUTO);\n\n/**\n *  Check Tree Node State\n */\nexports.PLACEMENT = PLACEMENT;\nvar CHECK_STATE;\nexports.CHECK_STATE = CHECK_STATE;\n(function (CHECK_STATE) {\n  CHECK_STATE[CHECK_STATE[\"UNCHECK\"] = 0] = \"UNCHECK\";\n  CHECK_STATE[CHECK_STATE[\"CHECK\"] = 1] = \"CHECK\";\n  CHECK_STATE[CHECK_STATE[\"INDETERMINATE\"] = 2] = \"INDETERMINATE\";\n})(CHECK_STATE || (exports.CHECK_STATE = CHECK_STATE = {}));\nvar TREE_NODE_PADDING = 16;\nexports.TREE_NODE_PADDING = TREE_NODE_PADDING;\nvar TREE_NODE_ROOT_PADDING = 12;\n\n/**\n * Tree Node Drag Type\n */\nexports.TREE_NODE_ROOT_PADDING = TREE_NODE_ROOT_PADDING;\nvar TREE_NODE_DROP_POSITION;\n/**\n * UI Events KeyboardEvent key Values\n * https://www.w3.org/TR/uievents-key\n */\nexports.TREE_NODE_DROP_POSITION = TREE_NODE_DROP_POSITION;\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 = {}));\nvar KEY_VALUES = {\n  // Navigation Keys\n  LEFT: 'ArrowLeft',\n  UP: 'ArrowUp',\n  RIGHT: 'ArrowRight',\n  DOWN: 'ArrowDown',\n  END: 'End',\n  HOME: 'Home',\n  PAGE_DOWN: 'PageDown',\n  PAGE_UP: 'PageUp',\n  // Whitespace Keys\n  ENTER: 'Enter',\n  TAB: 'Tab',\n  SPACE: ' ',\n  // Editing Keys\n  BACKSPACE: 'Backspace',\n  DELETE: 'Delete',\n  COMMA: ',',\n  // UI Keys\n  ESC: 'Escape'\n};\nexports.KEY_VALUES = KEY_VALUES;\nvar DATERANGE_DISABLED_TARGET;\nexports.DATERANGE_DISABLED_TARGET = DATERANGE_DISABLED_TARGET;\n(function (DATERANGE_DISABLED_TARGET) {\n  DATERANGE_DISABLED_TARGET[\"CALENDAR\"] = \"CALENDAR\";\n  DATERANGE_DISABLED_TARGET[\"TOOLBAR_BUTTON_OK\"] = \"TOOLBAR_BUTTON_OK\";\n  DATERANGE_DISABLED_TARGET[\"TOOLBAR_SHORTCUT\"] = \"TOOLBAR_SHORTCUT\";\n  DATERANGE_DISABLED_TARGET[\"INPUT\"] = \"INPUT\";\n})(DATERANGE_DISABLED_TARGET || (exports.DATERANGE_DISABLED_TARGET = DATERANGE_DISABLED_TARGET = {}));\n\n//# sourceURL=webpack://rsuite/./src/utils/constants.ts?");
+eval("\n\nexports.__esModule = true;\nexports.DATERANGE_DISABLED_TARGET = exports.KEY_VALUES = exports.TREE_NODE_DROP_POSITION = exports.CHECK_STATE = exports.PLACEMENT = exports.PLACEMENT_AUTO = exports.PLACEMENT_8 = exports.PLACEMENT_4 = exports.COLOR = exports.STATUS = exports.COLUMN_SIZE = exports.SIZE = void 0;\nvar SIZE = ['lg', 'md', 'sm', 'xs'];\nexports.SIZE = SIZE;\nvar COLUMN_SIZE = ['xxl', 'xl', 'lg', 'md', 'sm', 'xs'];\nexports.COLUMN_SIZE = COLUMN_SIZE;\nvar STATUS = ['success', 'warning', 'error', 'info'];\nexports.STATUS = STATUS;\nvar COLOR = ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'violet'];\nexports.COLOR = COLOR;\nvar PLACEMENT_4 = ['top', 'bottom', 'right', 'left'];\nexports.PLACEMENT_4 = PLACEMENT_4;\nvar PLACEMENT_8 = ['bottomStart', 'bottomEnd', 'topStart', 'topEnd', 'leftStart', 'rightStart', 'leftEnd', 'rightEnd'];\nexports.PLACEMENT_8 = PLACEMENT_8;\nvar PLACEMENT_AUTO = ['auto', 'autoVertical', 'autoVerticalStart', 'autoVerticalEnd', 'autoHorizontal', 'autoHorizontalStart', 'autoHorizontalEnd'];\nexports.PLACEMENT_AUTO = PLACEMENT_AUTO;\nvar PLACEMENT = [].concat(PLACEMENT_4, PLACEMENT_8, PLACEMENT_AUTO);\n\n/**\n *  Check Tree Node State\n */\nexports.PLACEMENT = PLACEMENT;\nvar CHECK_STATE;\nexports.CHECK_STATE = CHECK_STATE;\n(function (CHECK_STATE) {\n  CHECK_STATE[CHECK_STATE[\"UNCHECK\"] = 0] = \"UNCHECK\";\n  CHECK_STATE[CHECK_STATE[\"CHECK\"] = 1] = \"CHECK\";\n  CHECK_STATE[CHECK_STATE[\"INDETERMINATE\"] = 2] = \"INDETERMINATE\";\n})(CHECK_STATE || (exports.CHECK_STATE = CHECK_STATE = {}));\n/**\n * Tree Node Drag Type\n */\nvar TREE_NODE_DROP_POSITION;\n/**\n * UI Events KeyboardEvent key Values\n * https://www.w3.org/TR/uievents-key\n */\nexports.TREE_NODE_DROP_POSITION = TREE_NODE_DROP_POSITION;\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 = {}));\nvar KEY_VALUES = {\n  // Navigation Keys\n  LEFT: 'ArrowLeft',\n  UP: 'ArrowUp',\n  RIGHT: 'ArrowRight',\n  DOWN: 'ArrowDown',\n  END: 'End',\n  HOME: 'Home',\n  PAGE_DOWN: 'PageDown',\n  PAGE_UP: 'PageUp',\n  // Whitespace Keys\n  ENTER: 'Enter',\n  TAB: 'Tab',\n  SPACE: ' ',\n  // Editing Keys\n  BACKSPACE: 'Backspace',\n  DELETE: 'Delete',\n  COMMA: ',',\n  // UI Keys\n  ESC: 'Escape'\n};\nexports.KEY_VALUES = KEY_VALUES;\nvar DATERANGE_DISABLED_TARGET;\nexports.DATERANGE_DISABLED_TARGET = DATERANGE_DISABLED_TARGET;\n(function (DATERANGE_DISABLED_TARGET) {\n  DATERANGE_DISABLED_TARGET[\"CALENDAR\"] = \"CALENDAR\";\n  DATERANGE_DISABLED_TARGET[\"TOOLBAR_BUTTON_OK\"] = \"TOOLBAR_BUTTON_OK\";\n  DATERANGE_DISABLED_TARGET[\"TOOLBAR_SHORTCUT\"] = \"TOOLBAR_SHORTCUT\";\n  DATERANGE_DISABLED_TARGET[\"INPUT\"] = \"INPUT\";\n})(DATERANGE_DISABLED_TARGET || (exports.DATERANGE_DISABLED_TARGET = DATERANGE_DISABLED_TARGET = {}));\n\n//# sourceURL=webpack://rsuite/./src/utils/constants.ts?");
 
 /***/ }),
 
@@ -10663,18 +11213,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\");\nexports.__esModule = true;\nexports.getDataGroupBy = getDataGroupBy;\nexports.KEY_GROUP_TITLE = void 0;\nvar _groupBy2 = _interopRequireDefault(__webpack_require__(/*! lodash/groupBy */ \"./node_modules/lodash/groupBy.js\"));\nvar _treeUtils = __webpack_require__(/*! ../utils/treeUtils */ \"./src/utils/treeUtils.ts\");\nvar _symbols = __webpack_require__(/*! ../internals/symbols */ \"./src/internals/symbols.ts\");\nvar KEY_GROUP_TITLE = 'groupTitle';\nexports.KEY_GROUP_TITLE = KEY_GROUP_TITLE;\nfunction getDataGroupBy(data, key, sort) {\n  var groupMap = (0, _groupBy2.default)(data, key);\n  var isSort = typeof sort === 'function';\n  var groups = Object.entries(groupMap).map(function (_ref) {\n    var _ref2;\n    var groupTitle = _ref[0],\n      children = _ref[1];\n    return _ref2 = {\n      children: isSort ? children.sort(sort(false)) : children\n    }, _ref2[KEY_GROUP_TITLE] = groupTitle, _ref2[_symbols.RSUITE_PICKER_GROUP_KEY] = true, _ref2;\n  });\n  if (isSort) {\n    groups.sort(sort(true));\n  }\n\n  // Use DFS traverse\n  // Because I want the result to be [group, child, child, group, child, child]\n  // rather than [group, group, child, child, child, child]\n  return (0, _treeUtils.flattenTree)(groups, function (group) {\n    return group.children;\n  }, _treeUtils.WalkTreeStrategy.DFS);\n}\n\n//# sourceURL=webpack://rsuite/./src/utils/getDataGroupBy.ts?");
-
-/***/ }),
-
-/***/ "./src/utils/getSafeRegExpString.ts":
-/*!******************************************!*\
-  !*** ./src/utils/getSafeRegExpString.ts ***!
-  \******************************************/
-/***/ (function(__unused_webpack_module, exports) {
-
-"use strict";
-eval("\n\nexports.__esModule = true;\nexports[\"default\"] = getSafeRegExpString;\n/**\n * @description escape Regular_Expressions special_characters '^$.|*+?{\\\\[()'\n */\nfunction getSafeRegExpString(str) {\n  return str.replace(/([\\^\\$\\.\\|\\*\\+\\?\\{\\\\\\[\\(\\)])/g, '\\\\$1');\n}\n\n//# sourceURL=webpack://rsuite/./src/utils/getSafeRegExpString.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports.getDataGroupBy = getDataGroupBy;\nexports.KEY_GROUP_TITLE = void 0;\nvar _groupBy2 = _interopRequireDefault(__webpack_require__(/*! lodash/groupBy */ \"./node_modules/lodash/groupBy.js\"));\nvar _utils = __webpack_require__(/*! ../Tree/utils */ \"./src/Tree/utils/index.ts\");\nvar _symbols = __webpack_require__(/*! ../internals/symbols */ \"./src/internals/symbols.ts\");\nvar KEY_GROUP_TITLE = 'groupTitle';\nexports.KEY_GROUP_TITLE = KEY_GROUP_TITLE;\nfunction getDataGroupBy(data, key, sort) {\n  var groupMap = (0, _groupBy2.default)(data, key);\n  var isSort = typeof sort === 'function';\n  var groups = Object.entries(groupMap).map(function (_ref) {\n    var _ref2;\n    var groupTitle = _ref[0],\n      children = _ref[1];\n    return _ref2 = {\n      children: isSort ? children.sort(sort(false)) : children\n    }, _ref2[KEY_GROUP_TITLE] = groupTitle, _ref2[_symbols.RSUITE_PICKER_GROUP_KEY] = true, _ref2;\n  });\n  if (isSort) {\n    groups.sort(sort(true));\n  }\n\n  // Use DFS traverse\n  // Because I want the result to be [group, child, child, group, child, child]\n  // rather than [group, group, child, child, child, child]\n  return (0, _utils.flattenTree)(groups, function (group) {\n    return group.children;\n  }, _utils.WalkTreeStrategy.DFS);\n}\n\n//# sourceURL=webpack://rsuite/./src/utils/getDataGroupBy.ts?");
 
 /***/ }),
 
@@ -10718,7 +11257,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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\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  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  render: true,\n  safeSetSelection: true,\n  getStringLength: 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  useUniqueId: true,\n  useIsomorphicLayoutEffect: true,\n  useInternalId: true,\n  useEnsuredRef: true,\n  defaultClassPrefix: true,\n  getClassNamePrefix: true,\n  globalKey: true,\n  useMap: true,\n  DateUtils: true\n};\nexports.DateUtils = exports.useMap = exports.globalKey = exports.getClassNamePrefix = exports.defaultClassPrefix = exports.useEnsuredRef = exports.useInternalId = exports.useIsomorphicLayoutEffect = exports.useUniqueId = 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.getStringLength = exports.safeSetSelection = exports.render = exports.appendTooltip = exports.scrollTopAnimation = exports.reactToString = exports.composeFunctions = exports.shallowEqualArray = exports.shallowEqual = exports.mergeRefs = exports.getDOMNode = exports.placementPolyfill = exports.clone = exports.previewFile = exports.ajaxUpload = exports.tplTransform = exports.ReactChildren = exports.isOneOf = exports.createChainedFunction = exports.prefix = exports.guid = void 0;\nvar _BrowserDetection = __webpack_require__(/*! ./BrowserDetection */ \"./src/utils/BrowserDetection.ts\");\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});\nvar _htmlPropsUtils = __webpack_require__(/*! ./htmlPropsUtils */ \"./src/utils/htmlPropsUtils.ts\");\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});\nvar _constants = __webpack_require__(/*! ./constants */ \"./src/utils/constants.ts\");\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});\nvar _DateUtils = _interopRequireWildcard(__webpack_require__(/*! ./dateUtils */ \"./src/utils/dateUtils.ts\"));\nexports.DateUtils = _DateUtils;\nvar _statusIcons = __webpack_require__(/*! ./statusIcons */ \"./src/utils/statusIcons.tsx\");\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});\nvar _guid = _interopRequireDefault(__webpack_require__(/*! ./guid */ \"./src/utils/guid.ts\"));\nexports.guid = _guid.default;\nvar _prefix = _interopRequireWildcard(__webpack_require__(/*! ./prefix */ \"./src/utils/prefix.ts\"));\nexports.prefix = _prefix.default;\nexports.defaultClassPrefix = _prefix.defaultClassPrefix;\nexports.getClassNamePrefix = _prefix.getClassNamePrefix;\nexports.globalKey = _prefix.globalKey;\nvar _createChainedFunction = _interopRequireDefault(__webpack_require__(/*! ./createChainedFunction */ \"./src/utils/createChainedFunction.ts\"));\nexports.createChainedFunction = _createChainedFunction.default;\nvar _isOneOf = _interopRequireDefault(__webpack_require__(/*! ./isOneOf */ \"./src/utils/isOneOf.ts\"));\nexports.isOneOf = _isOneOf.default;\nvar _ReactChildren = _interopRequireDefault(__webpack_require__(/*! ./ReactChildren */ \"./src/utils/ReactChildren.tsx\"));\nexports.ReactChildren = _ReactChildren.default;\nvar _tplTransform = _interopRequireDefault(__webpack_require__(/*! ./tplTransform */ \"./src/utils/tplTransform.tsx\"));\nexports.tplTransform = _tplTransform.default;\nvar _ajaxUpload = _interopRequireDefault(__webpack_require__(/*! ./ajaxUpload */ \"./src/utils/ajaxUpload.ts\"));\nexports.ajaxUpload = _ajaxUpload.default;\nvar _previewFile = _interopRequireDefault(__webpack_require__(/*! ./previewFile */ \"./src/utils/previewFile.ts\"));\nexports.previewFile = _previewFile.default;\nvar _clone = _interopRequireDefault(__webpack_require__(/*! ./clone */ \"./src/utils/clone.ts\"));\nexports.clone = _clone.default;\nvar _placementPolyfill = _interopRequireDefault(__webpack_require__(/*! ./placementPolyfill */ \"./src/utils/placementPolyfill.ts\"));\nexports.placementPolyfill = _placementPolyfill.default;\nvar _getDOMNode = _interopRequireDefault(__webpack_require__(/*! ./getDOMNode */ \"./src/utils/getDOMNode.ts\"));\nexports.getDOMNode = _getDOMNode.default;\nvar _mergeRefs = _interopRequireDefault(__webpack_require__(/*! ./mergeRefs */ \"./src/utils/mergeRefs.ts\"));\nexports.mergeRefs = _mergeRefs.default;\nvar _shallowEqual = _interopRequireDefault(__webpack_require__(/*! ./shallowEqual */ \"./src/utils/shallowEqual.ts\"));\nexports.shallowEqual = _shallowEqual.default;\nvar _shallowEqualArray = _interopRequireDefault(__webpack_require__(/*! ./shallowEqualArray */ \"./src/utils/shallowEqualArray.ts\"));\nexports.shallowEqualArray = _shallowEqualArray.default;\nvar _composeFunctions = _interopRequireDefault(__webpack_require__(/*! ./composeFunctions */ \"./src/utils/composeFunctions.ts\"));\nexports.composeFunctions = _composeFunctions.default;\nvar _reactToString = _interopRequireDefault(__webpack_require__(/*! ./reactToString */ \"./src/utils/reactToString.ts\"));\nexports.reactToString = _reactToString.default;\nvar _scrollTopAnimation = _interopRequireDefault(__webpack_require__(/*! ./scrollTopAnimation */ \"./src/utils/scrollTopAnimation.ts\"));\nexports.scrollTopAnimation = _scrollTopAnimation.default;\nvar _appendTooltip = _interopRequireDefault(__webpack_require__(/*! ./appendTooltip */ \"./src/utils/appendTooltip.tsx\"));\nexports.appendTooltip = _appendTooltip.default;\nvar _render = _interopRequireDefault(__webpack_require__(/*! ./render */ \"./src/utils/render.ts\"));\nexports.render = _render.default;\nvar _safeSetSelection = _interopRequireDefault(__webpack_require__(/*! ./safeSetSelection */ \"./src/utils/safeSetSelection.ts\"));\nexports.safeSetSelection = _safeSetSelection.default;\nvar _getStringLength = _interopRequireDefault(__webpack_require__(/*! ./getStringLength */ \"./src/utils/getStringLength.ts\"));\nexports.getStringLength = _getStringLength.default;\nvar _useClassNames = _interopRequireDefault(__webpack_require__(/*! ./useClassNames */ \"./src/utils/useClassNames.ts\"));\nexports.useClassNames = _useClassNames.default;\nvar _useEventListener = _interopRequireDefault(__webpack_require__(/*! ./useEventListener */ \"./src/utils/useEventListener.ts\"));\nexports.useEventListener = _useEventListener.default;\nvar _useElementResize = _interopRequireDefault(__webpack_require__(/*! ./useElementResize */ \"./src/utils/useElementResize.ts\"));\nexports.useElementResize = _useElementResize.default;\nvar _useCustom = _interopRequireDefault(__webpack_require__(/*! ./useCustom */ \"./src/utils/useCustom.ts\"));\nexports.useCustom = _useCustom.default;\nvar _usePortal = _interopRequireDefault(__webpack_require__(/*! ./usePortal */ \"./src/utils/usePortal.tsx\"));\nexports.usePortal = _usePortal.default;\nvar _createComponent = _interopRequireDefault(__webpack_require__(/*! ./createComponent */ \"./src/utils/createComponent.tsx\"));\nexports.createComponent = _createComponent.default;\nvar _useTimeout = _interopRequireDefault(__webpack_require__(/*! ./useTimeout */ \"./src/utils/useTimeout.ts\"));\nexports.useTimeout = _useTimeout.default;\nvar _useControlled = _interopRequireDefault(__webpack_require__(/*! ./useControlled */ \"./src/utils/useControlled.ts\"));\nexports.useControlled = _useControlled.default;\nvar _useRootClose = _interopRequireDefault(__webpack_require__(/*! ./useRootClose */ \"./src/utils/useRootClose.ts\"));\nexports.useRootClose = _useRootClose.default;\nvar _getSafeRegExpString = _interopRequireDefault(__webpack_require__(/*! ./getSafeRegExpString */ \"./src/utils/getSafeRegExpString.ts\"));\nexports.getSafeRegExpString = _getSafeRegExpString.default;\nvar _stringToObject = _interopRequireDefault(__webpack_require__(/*! ./stringToObject */ \"./src/utils/stringToObject.ts\"));\nexports.stringToObject = _stringToObject.default;\nvar _useEventCallback = _interopRequireDefault(__webpack_require__(/*! ./useEventCallback */ \"./src/utils/useEventCallback.ts\"));\nexports.useEventCallback = _useEventCallback.default;\nvar _useUpdatedRef = _interopRequireDefault(__webpack_require__(/*! ./useUpdatedRef */ \"./src/utils/useUpdatedRef.ts\"));\nexports.useUpdatedRef = _useUpdatedRef.default;\nvar _useWillUnmount = _interopRequireDefault(__webpack_require__(/*! ./useWillUnmount */ \"./src/utils/useWillUnmount.ts\"));\nexports.useWillUnmount = _useWillUnmount.default;\nvar _useUpdateEffect = _interopRequireDefault(__webpack_require__(/*! ./useUpdateEffect */ \"./src/utils/useUpdateEffect.ts\"));\nexports.useUpdateEffect = _useUpdateEffect.default;\nvar _useIsMounted = _interopRequireDefault(__webpack_require__(/*! ./useIsMounted */ \"./src/utils/useIsMounted.ts\"));\nexports.useIsMounted = _useIsMounted.default;\nvar _useMount = _interopRequireDefault(__webpack_require__(/*! ./useMount */ \"./src/utils/useMount.ts\"));\nexports.useMount = _useMount.default;\nvar _useUniqueId = _interopRequireDefault(__webpack_require__(/*! ./useUniqueId */ \"./src/utils/useUniqueId.ts\"));\nexports.useUniqueId = _useUniqueId.default;\nvar _useIsomorphicLayoutEffect = _interopRequireDefault(__webpack_require__(/*! ./useIsomorphicLayoutEffect */ \"./src/utils/useIsomorphicLayoutEffect.ts\"));\nexports.useIsomorphicLayoutEffect = _useIsomorphicLayoutEffect.default;\nvar _useInternalId = _interopRequireDefault(__webpack_require__(/*! ./useInternalId */ \"./src/utils/useInternalId.ts\"));\nexports.useInternalId = _useInternalId.default;\nvar _useEnsuredRef = _interopRequireDefault(__webpack_require__(/*! ./useEnsuredRef */ \"./src/utils/useEnsuredRef.ts\"));\nexports.useEnsuredRef = _useEnsuredRef.default;\nvar _useMap = __webpack_require__(/*! ./useMap */ \"./src/utils/useMap.ts\");\nexports.useMap = _useMap.useMap;\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\");\nvar _interopRequireWildcard = __webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ \"./node_modules/@babel/runtime/helpers/interopRequireWildcard.js\");\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  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  render: true,\n  safeSetSelection: true,\n  getStringLength: 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  useEventCallback: true,\n  useUpdatedRef: true,\n  useWillUnmount: true,\n  useUpdateEffect: true,\n  useIsMounted: true,\n  useMount: true,\n  useUniqueId: true,\n  useIsomorphicLayoutEffect: true,\n  useInternalId: true,\n  useEnsuredRef: true,\n  defaultClassPrefix: true,\n  getClassNamePrefix: true,\n  globalKey: true,\n  useMap: true,\n  DateUtils: true\n};\nexports.DateUtils = exports.useMap = exports.globalKey = exports.getClassNamePrefix = exports.defaultClassPrefix = exports.useEnsuredRef = exports.useInternalId = exports.useIsomorphicLayoutEffect = exports.useUniqueId = exports.useMount = exports.useIsMounted = exports.useUpdateEffect = exports.useWillUnmount = exports.useUpdatedRef = exports.useEventCallback = exports.useRootClose = exports.useControlled = exports.useTimeout = exports.createComponent = exports.usePortal = exports.useCustom = exports.useElementResize = exports.useEventListener = exports.useClassNames = exports.getStringLength = exports.safeSetSelection = exports.render = exports.scrollTopAnimation = exports.reactToString = exports.composeFunctions = exports.shallowEqualArray = exports.shallowEqual = exports.mergeRefs = exports.getDOMNode = exports.placementPolyfill = exports.clone = exports.previewFile = exports.ajaxUpload = exports.tplTransform = exports.ReactChildren = exports.isOneOf = exports.createChainedFunction = exports.prefix = exports.guid = void 0;\nvar _BrowserDetection = __webpack_require__(/*! ./BrowserDetection */ \"./src/utils/BrowserDetection.ts\");\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});\nvar _htmlPropsUtils = __webpack_require__(/*! ./htmlPropsUtils */ \"./src/utils/htmlPropsUtils.ts\");\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});\nvar _constants = __webpack_require__(/*! ./constants */ \"./src/utils/constants.ts\");\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});\nvar _DateUtils = _interopRequireWildcard(__webpack_require__(/*! ./dateUtils */ \"./src/utils/dateUtils.ts\"));\nexports.DateUtils = _DateUtils;\nvar _statusIcons = __webpack_require__(/*! ./statusIcons */ \"./src/utils/statusIcons.tsx\");\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});\nvar _guid = _interopRequireDefault(__webpack_require__(/*! ./guid */ \"./src/utils/guid.ts\"));\nexports.guid = _guid.default;\nvar _prefix = _interopRequireWildcard(__webpack_require__(/*! ./prefix */ \"./src/utils/prefix.ts\"));\nexports.prefix = _prefix.default;\nexports.defaultClassPrefix = _prefix.defaultClassPrefix;\nexports.getClassNamePrefix = _prefix.getClassNamePrefix;\nexports.globalKey = _prefix.globalKey;\nvar _createChainedFunction = _interopRequireDefault(__webpack_require__(/*! ./createChainedFunction */ \"./src/utils/createChainedFunction.ts\"));\nexports.createChainedFunction = _createChainedFunction.default;\nvar _isOneOf = _interopRequireDefault(__webpack_require__(/*! ./isOneOf */ \"./src/utils/isOneOf.ts\"));\nexports.isOneOf = _isOneOf.default;\nvar _ReactChildren = _interopRequireDefault(__webpack_require__(/*! ./ReactChildren */ \"./src/utils/ReactChildren.tsx\"));\nexports.ReactChildren = _ReactChildren.default;\nvar _tplTransform = _interopRequireDefault(__webpack_require__(/*! ./tplTransform */ \"./src/utils/tplTransform.tsx\"));\nexports.tplTransform = _tplTransform.default;\nvar _ajaxUpload = _interopRequireDefault(__webpack_require__(/*! ./ajaxUpload */ \"./src/utils/ajaxUpload.ts\"));\nexports.ajaxUpload = _ajaxUpload.default;\nvar _previewFile = _interopRequireDefault(__webpack_require__(/*! ./previewFile */ \"./src/utils/previewFile.ts\"));\nexports.previewFile = _previewFile.default;\nvar _clone = _interopRequireDefault(__webpack_require__(/*! ./clone */ \"./src/utils/clone.ts\"));\nexports.clone = _clone.default;\nvar _placementPolyfill = _interopRequireDefault(__webpack_require__(/*! ./placementPolyfill */ \"./src/utils/placementPolyfill.ts\"));\nexports.placementPolyfill = _placementPolyfill.default;\nvar _getDOMNode = _interopRequireDefault(__webpack_require__(/*! ./getDOMNode */ \"./src/utils/getDOMNode.ts\"));\nexports.getDOMNode = _getDOMNode.default;\nvar _mergeRefs = _interopRequireDefault(__webpack_require__(/*! ./mergeRefs */ \"./src/utils/mergeRefs.ts\"));\nexports.mergeRefs = _mergeRefs.default;\nvar _shallowEqual = _interopRequireDefault(__webpack_require__(/*! ./shallowEqual */ \"./src/utils/shallowEqual.ts\"));\nexports.shallowEqual = _shallowEqual.default;\nvar _shallowEqualArray = _interopRequireDefault(__webpack_require__(/*! ./shallowEqualArray */ \"./src/utils/shallowEqualArray.ts\"));\nexports.shallowEqualArray = _shallowEqualArray.default;\nvar _composeFunctions = _interopRequireDefault(__webpack_require__(/*! ./composeFunctions */ \"./src/utils/composeFunctions.ts\"));\nexports.composeFunctions = _composeFunctions.default;\nvar _reactToString = _interopRequireDefault(__webpack_require__(/*! ./reactToString */ \"./src/utils/reactToString.ts\"));\nexports.reactToString = _reactToString.default;\nvar _scrollTopAnimation = _interopRequireDefault(__webpack_require__(/*! ./scrollTopAnimation */ \"./src/utils/scrollTopAnimation.ts\"));\nexports.scrollTopAnimation = _scrollTopAnimation.default;\nvar _render = _interopRequireDefault(__webpack_require__(/*! ./render */ \"./src/utils/render.ts\"));\nexports.render = _render.default;\nvar _safeSetSelection = _interopRequireDefault(__webpack_require__(/*! ./safeSetSelection */ \"./src/utils/safeSetSelection.ts\"));\nexports.safeSetSelection = _safeSetSelection.default;\nvar _getStringLength = _interopRequireDefault(__webpack_require__(/*! ./getStringLength */ \"./src/utils/getStringLength.ts\"));\nexports.getStringLength = _getStringLength.default;\nvar _useClassNames = _interopRequireDefault(__webpack_require__(/*! ./useClassNames */ \"./src/utils/useClassNames.ts\"));\nexports.useClassNames = _useClassNames.default;\nvar _useEventListener = _interopRequireDefault(__webpack_require__(/*! ./useEventListener */ \"./src/utils/useEventListener.ts\"));\nexports.useEventListener = _useEventListener.default;\nvar _useElementResize = _interopRequireDefault(__webpack_require__(/*! ./useElementResize */ \"./src/utils/useElementResize.ts\"));\nexports.useElementResize = _useElementResize.default;\nvar _useCustom = _interopRequireDefault(__webpack_require__(/*! ./useCustom */ \"./src/utils/useCustom.ts\"));\nexports.useCustom = _useCustom.default;\nvar _usePortal = _interopRequireDefault(__webpack_require__(/*! ./usePortal */ \"./src/utils/usePortal.tsx\"));\nexports.usePortal = _usePortal.default;\nvar _createComponent = _interopRequireDefault(__webpack_require__(/*! ./createComponent */ \"./src/utils/createComponent.tsx\"));\nexports.createComponent = _createComponent.default;\nvar _useTimeout = _interopRequireDefault(__webpack_require__(/*! ./useTimeout */ \"./src/utils/useTimeout.ts\"));\nexports.useTimeout = _useTimeout.default;\nvar _useControlled = _interopRequireDefault(__webpack_require__(/*! ./useControlled */ \"./src/utils/useControlled.ts\"));\nexports.useControlled = _useControlled.default;\nvar _useRootClose = _interopRequireDefault(__webpack_require__(/*! ./useRootClose */ \"./src/utils/useRootClose.ts\"));\nexports.useRootClose = _useRootClose.default;\nvar _useEventCallback = _interopRequireDefault(__webpack_require__(/*! ./useEventCallback */ \"./src/utils/useEventCallback.ts\"));\nexports.useEventCallback = _useEventCallback.default;\nvar _useUpdatedRef = _interopRequireDefault(__webpack_require__(/*! ./useUpdatedRef */ \"./src/utils/useUpdatedRef.ts\"));\nexports.useUpdatedRef = _useUpdatedRef.default;\nvar _useWillUnmount = _interopRequireDefault(__webpack_require__(/*! ./useWillUnmount */ \"./src/utils/useWillUnmount.ts\"));\nexports.useWillUnmount = _useWillUnmount.default;\nvar _useUpdateEffect = _interopRequireDefault(__webpack_require__(/*! ./useUpdateEffect */ \"./src/utils/useUpdateEffect.ts\"));\nexports.useUpdateEffect = _useUpdateEffect.default;\nvar _useIsMounted = _interopRequireDefault(__webpack_require__(/*! ./useIsMounted */ \"./src/utils/useIsMounted.ts\"));\nexports.useIsMounted = _useIsMounted.default;\nvar _useMount = _interopRequireDefault(__webpack_require__(/*! ./useMount */ \"./src/utils/useMount.ts\"));\nexports.useMount = _useMount.default;\nvar _useUniqueId = _interopRequireDefault(__webpack_require__(/*! ./useUniqueId */ \"./src/utils/useUniqueId.ts\"));\nexports.useUniqueId = _useUniqueId.default;\nvar _useIsomorphicLayoutEffect = _interopRequireDefault(__webpack_require__(/*! ./useIsomorphicLayoutEffect */ \"./src/utils/useIsomorphicLayoutEffect.ts\"));\nexports.useIsomorphicLayoutEffect = _useIsomorphicLayoutEffect.default;\nvar _useInternalId = _interopRequireDefault(__webpack_require__(/*! ./useInternalId */ \"./src/utils/useInternalId.ts\"));\nexports.useInternalId = _useInternalId.default;\nvar _useEnsuredRef = _interopRequireDefault(__webpack_require__(/*! ./useEnsuredRef */ \"./src/utils/useEnsuredRef.ts\"));\nexports.useEnsuredRef = _useEnsuredRef.default;\nvar _useMap = __webpack_require__(/*! ./useMap */ \"./src/utils/useMap.ts\");\nexports.useMap = _useMap.useMap;\n\n//# sourceURL=webpack://rsuite/./src/utils/index.ts?");
 
 /***/ }),
 
@@ -10854,17 +11393,6 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 
 /***/ }),
 
-/***/ "./src/utils/stringToObject.ts":
-/*!*************************************!*\
-  !*** ./src/utils/stringToObject.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\");\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nvar _isObject = _interopRequireDefault(__webpack_require__(/*! lodash/isObject */ \"./node_modules/lodash/isObject.js\"));\n// FIXME Never used\nvar _default = function _default(value, labelKey, valueKey) {\n  if ((0, _isObject.default)(value)) {\n    return value;\n  }\n  if (labelKey && valueKey) {\n    var _ref;\n    return _ref = {}, _ref[labelKey] = value, _ref[valueKey] = value, _ref;\n  }\n  return null;\n};\nexports[\"default\"] = _default;\n\n//# sourceURL=webpack://rsuite/./src/utils/stringToObject.ts?");
-
-/***/ }),
-
 /***/ "./src/utils/tplTransform.tsx":
 /*!************************************!*\
   !*** ./src/utils/tplTransform.tsx ***!
@@ -10876,17 +11404,6 @@ eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/he
 
 /***/ }),
 
-/***/ "./src/utils/treeUtils.ts":
-/*!********************************!*\
-  !*** ./src/utils/treeUtils.ts ***!
-  \********************************/
-/***/ (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\");\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports.shouldShowNodeByParentExpanded = shouldShowNodeByParentExpanded;\nexports.UNSAFE_flattenTree = UNSAFE_flattenTree;\nexports.flattenTree = flattenTree;\nexports.walkTreeBfs = walkTreeBfs;\nexports.walkTreeDfs = walkTreeDfs;\nexports.getNodeParents = getNodeParents;\nexports.getNodeParentKeys = getNodeParentKeys;\nexports.hasVisibleChildren = hasVisibleChildren;\nexports.compareArray = compareArray;\nexports.getDefaultExpandItemValues = getDefaultExpandItemValues;\nexports.getExpandItemValues = getExpandItemValues;\nexports.getDragNodeKeys = getDragNodeKeys;\nexports.calDropNodePosition = calDropNodePosition;\nexports.removeDragNode = removeDragNode;\nexports.createUpdateTreeDataFunction = createUpdateTreeDataFunction;\nexports.findNodeOfTree = findNodeOfTree;\nexports.filterNodesOfTree = filterNodesOfTree;\nexports.leftArrowHandler = leftArrowHandler;\nexports.rightArrowHandler = rightArrowHandler;\nexports.getExpandWhenSearching = getExpandWhenSearching;\nexports.getTreeActiveNode = getTreeActiveNode;\nexports.toggleExpand = toggleExpand;\nexports.getTreeNodeTitle = getTreeNodeTitle;\nexports.getChildrenByFlattenNodes = getChildrenByFlattenNodes;\nexports.useTreeDrag = useTreeDrag;\nexports.useFlattenTreeData = useFlattenTreeData;\nexports.useTreeNodeRefs = useTreeNodeRefs;\nexports.useTreeSearch = useTreeSearch;\nexports.useGetTreeNodeChildren = useGetTreeNodeChildren;\nexports.focusToActiveTreeNode = focusToActiveTreeNode;\nexports.isSearching = isSearching;\nexports.getTreeNodeIndent = getTreeNodeIndent;\nexports.getNodeFormattedRefKey = getNodeFormattedRefKey;\nexports.createDragPreview = createDragPreview;\nexports.removeDragPreview = removeDragPreview;\nexports.stringifyTreeNodeLabel = stringifyTreeNodeLabel;\nexports.getParentMap = getParentMap;\nexports.getKeyParentMap = getKeyParentMap;\nexports.getPathTowardsItem = getPathTowardsItem;\nexports.getScrollToIndex = exports.focusPreviousItem = exports.focusNextItem = exports.focusTreeNode = exports.getElementByDataKey = exports.getActiveItem = exports.getActiveIndex = exports.getFocusableItems = exports.WalkTreeStrategy = void 0;\nvar _extends3 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _isEmpty2 = _interopRequireDefault(__webpack_require__(/*! lodash/isEmpty */ \"./node_modules/lodash/isEmpty.js\"));\nvar _clone2 = _interopRequireDefault(__webpack_require__(/*! lodash/clone */ \"./node_modules/lodash/clone.js\"));\nvar _isNil2 = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _isArray2 = _interopRequireDefault(__webpack_require__(/*! lodash/isArray */ \"./node_modules/lodash/isArray.js\"));\nvar _omit2 = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _isUndefined2 = _interopRequireDefault(__webpack_require__(/*! lodash/isUndefined */ \"./node_modules/lodash/isUndefined.js\"));\nvar _intersection2 = _interopRequireDefault(__webpack_require__(/*! lodash/intersection */ \"./node_modules/lodash/intersection.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _shallowEqualArray = _interopRequireDefault(__webpack_require__(/*! ../utils/shallowEqualArray */ \"./src/utils/shallowEqualArray.ts\"));\nvar _utils = __webpack_require__(/*! ../CheckTreePicker/utils */ \"./src/CheckTreePicker/utils.ts\");\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _reactToString = _interopRequireDefault(__webpack_require__(/*! ./reactToString */ \"./src/utils/reactToString.ts\"));\nvar _constants = __webpack_require__(/*! ./constants */ \"./src/utils/constants.ts\");\nvar _attachParent = __webpack_require__(/*! ./attachParent */ \"./src/utils/attachParent.ts\");\nfunction _createForOfIteratorHelperLoose(o, allowArrayLike) { var it = typeof Symbol !== \"undefined\" && o[Symbol.iterator] || o[\"@@iterator\"]; if (it) return (it = it.call(o)).next.bind(it); if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === \"number\") { if (it) o = it; var i = 0; return function () { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }; } throw new TypeError(\"Invalid attempt to iterate non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n// gap of tree node\nvar TREE_NODE_GAP = 4;\n\n/**\n * according node parentNode expand state decide node whether to show\n * @param {*} expandItemValues\n * @param {*} parentKeys\n */\nfunction shouldShowNodeByParentExpanded(expandItemValues, parentKeys) {\n  if (expandItemValues === void 0) {\n    expandItemValues = [];\n  }\n  if (parentKeys === void 0) {\n    parentKeys = [];\n  }\n  var intersectionKeys = (0, _intersection2.default)(expandItemValues, parentKeys);\n  if (intersectionKeys.length === parentKeys.length) {\n    return true;\n  }\n  return false;\n}\n\n/**\n * flatten tree structure to array\n * @param {*} tree\n * @param {*} childrenKey\n * @param {*} executor\n *\n * @deprecated This {@link UNSAFE_flattenTree} function is considered unsafe because it mutates `tree` argument in-place\n *             Use {@link flattenTree} instead.\n */\nfunction UNSAFE_flattenTree(tree, childrenKey, executor) {\n  if (childrenKey === void 0) {\n    childrenKey = 'children';\n  }\n  var flattenData = [];\n  var traverse = function traverse(data, parent) {\n    if (!(0, _isArray2.default)(data)) {\n      return;\n    }\n    data.forEach(function (item, index) {\n      var node = typeof executor === 'function' ? executor(item, index) : item;\n      flattenData.push((0, _attachParent.attachParent)(node, parent));\n      if (item[childrenKey]) {\n        traverse(item[childrenKey], item);\n      }\n    });\n  };\n  traverse(tree, null);\n  return flattenData;\n}\nvar WalkTreeStrategy;\nexports.WalkTreeStrategy = WalkTreeStrategy;\n(function (WalkTreeStrategy) {\n  WalkTreeStrategy[WalkTreeStrategy[\"DFS\"] = 0] = \"DFS\";\n  WalkTreeStrategy[WalkTreeStrategy[\"BFS\"] = 1] = \"BFS\";\n})(WalkTreeStrategy || (exports.WalkTreeStrategy = WalkTreeStrategy = {}));\nfunction flattenTree(rootNodes, getChildren, walkStrategy) {\n  if (walkStrategy === void 0) {\n    walkStrategy = WalkTreeStrategy.BFS;\n  }\n  var result = [];\n  if (walkStrategy === WalkTreeStrategy.BFS) {\n    walkTreeBfs(rootNodes, getChildren, function (node) {\n      return result.push(node);\n    });\n  } else if (walkStrategy === WalkTreeStrategy.DFS) {\n    walkTreeDfs(rootNodes, getChildren, function (node) {\n      return result.push(node);\n    });\n  }\n  return result;\n}\nfunction walkTreeBfs(rootNodes, getChildren, callback) {\n  for (var queue = [].concat(rootNodes); queue.length > 0;) {\n    var _node = queue.shift();\n    callback(_node);\n    var children = getChildren(_node);\n    if (children) {\n      queue.push.apply(queue, children);\n    }\n  }\n}\nfunction walkTreeDfs(rootNodes, getChildren, callback) {\n  for (var _iterator = _createForOfIteratorHelperLoose(rootNodes), _step; !(_step = _iterator()).done;) {\n    var _node2 = _step.value;\n    callback(_node2);\n    var children = getChildren(_node2);\n    if (children) {\n      walkTreeDfs(children, getChildren, callback);\n    }\n  }\n}\n\n/**\n * get all ancestor nodes of given node\n * @param {*} node\n */\nfunction getNodeParents(node, parentKey, valueKey) {\n  if (parentKey === void 0) {\n    parentKey = 'parent';\n  }\n  var parents = [];\n  var traverse = function traverse(node) {\n    if (node !== null && node !== void 0 && node[parentKey]) {\n      traverse(node[parentKey]);\n      if (valueKey) {\n        parents.push(node[parentKey][valueKey]);\n      } else {\n        parents.push(node[parentKey]);\n      }\n    }\n  };\n  traverse(node);\n  return parents;\n}\n\n/**\n * get all parentKeys of given node\n * @param nodes\n * @param node\n * @param valueKey\n */\nfunction getNodeParentKeys(nodes, node, valueKey) {\n  var parentKeys = [];\n  var traverse = function traverse(node) {\n    var _node$parent;\n    if (node !== null && node !== void 0 && (_node$parent = node.parent) !== null && _node$parent !== void 0 && _node$parent.refKey) {\n      var _node$parent2;\n      traverse(nodes[node.parent.refKey]);\n      parentKeys.push(node === null || node === void 0 ? void 0 : (_node$parent2 = node.parent) === null || _node$parent2 === void 0 ? void 0 : _node$parent2[valueKey]);\n    }\n  };\n  traverse(node);\n  return parentKeys;\n}\nfunction hasVisibleChildren(node, childrenKey) {\n  if (!Array.isArray(node[childrenKey])) {\n    return false;\n  }\n  return node[childrenKey].some(function (child) {\n    return child.visible;\n  });\n}\n\n/**\n * shallow equal array\n * @param a\n * @param b\n */\nfunction compareArray(a, b) {\n  return (0, _isArray2.default)(a) && (0, _isArray2.default)(b) && !(0, _shallowEqualArray.default)(a, b);\n}\nfunction getDefaultExpandItemValues(data, props) {\n  var valueKey = props.valueKey,\n    defaultExpandAll = props.defaultExpandAll,\n    childrenKey = props.childrenKey,\n    _props$defaultExpandI = props.defaultExpandItemValues,\n    defaultExpandItemValues = _props$defaultExpandI === void 0 ? [] : _props$defaultExpandI;\n  if (defaultExpandAll) {\n    return UNSAFE_flattenTree(data, childrenKey).filter(function (item) {\n      return Array.isArray(item[childrenKey]) && item[childrenKey].length > 0;\n    }).map(function (item) {\n      return item[valueKey];\n    });\n  }\n  return defaultExpandItemValues;\n}\n\n/**\n * 获取 expandItemValues 的 value\n * @param props\n */\nfunction getExpandItemValues(props) {\n  var expandItemValues = props.expandItemValues,\n    defaultExpandItemValues = props.defaultExpandItemValues;\n  if (!(0, _isUndefined2.default)(expandItemValues) && Array.isArray(expandItemValues)) {\n    return expandItemValues;\n  }\n  if (!(0, _isUndefined2.default)(defaultExpandItemValues) && Array.isArray(defaultExpandItemValues)) {\n    return defaultExpandItemValues;\n  }\n  return [];\n}\n\n/**\n * get dragNode and it's children node keys\n * @param node\n * @param childrenKey\n * @param valueKey\n */\nfunction getDragNodeKeys(dragNode, childrenKey, valueKey) {\n  var dragNodeKeys = [dragNode[valueKey]];\n  var traverse = function traverse(data) {\n    if ((data === null || data === void 0 ? void 0 : data.length) > 0) {\n      data.forEach(function (node) {\n        dragNodeKeys = dragNodeKeys.concat([node[valueKey]]);\n        if (node[childrenKey]) {\n          traverse(node[childrenKey]);\n        }\n      });\n    }\n  };\n  traverse(dragNode[childrenKey]);\n  return dragNodeKeys;\n}\nfunction calDropNodePosition(event, treeNodeElement) {\n  var clientY = event.clientY;\n  var _treeNodeElement$getB = treeNodeElement.getBoundingClientRect(),\n    top = _treeNodeElement$getB.top,\n    bottom = _treeNodeElement$getB.bottom;\n  var gap = TREE_NODE_GAP;\n\n  // bottom of node\n  if (clientY >= bottom - gap && clientY <= bottom) {\n    return _utils2.TREE_NODE_DROP_POSITION.DRAG_OVER_BOTTOM;\n  }\n\n  // top of node\n  if (clientY <= top + gap && clientY >= top) {\n    return _utils2.TREE_NODE_DROP_POSITION.DRAG_OVER_TOP;\n  }\n  if (clientY >= top + gap && clientY <= bottom - gap) {\n    return _utils2.TREE_NODE_DROP_POSITION.DRAG_OVER;\n  }\n  return -1;\n}\nfunction removeDragNode(data, params, _ref) {\n  var valueKey = _ref.valueKey,\n    childrenKey = _ref.childrenKey;\n  var dragNode = params.dragNode;\n  var traverse = function traverse(items, parent) {\n    for (var _index = 0; _index < items.length; _index += 1) {\n      var _item = items[_index];\n      if ((0, _utils2.shallowEqual)(_item[valueKey], dragNode[valueKey])) {\n        items.splice(_index, 1);\n        // when children is empty, delete children prop for hidden anchor\n        if (items.length === 0 && parent) {\n          delete parent.children;\n        }\n        break;\n      }\n      if (Array.isArray(_item[childrenKey])) {\n        traverse(_item[childrenKey], _item);\n      }\n    }\n  };\n  traverse(data);\n}\nfunction createUpdateTreeDataFunction(params, _ref2) {\n  var valueKey = _ref2.valueKey,\n    childrenKey = _ref2.childrenKey;\n  return function (tree) {\n    var data = [].concat(tree);\n    var dragNode = params.dragNode,\n      dropNode = params.dropNode,\n      dropNodePosition = params.dropNodePosition;\n    var cloneDragNode = (0, _extends3.default)({}, dragNode);\n    removeDragNode(data, params, {\n      valueKey: valueKey,\n      childrenKey: childrenKey\n    });\n    var updateTree = function updateTree(items) {\n      for (var _index2 = 0; _index2 < items.length; _index2 += 1) {\n        var _item2 = items[_index2];\n        if ((0, _utils2.shallowEqual)(_item2[valueKey], dropNode[valueKey])) {\n          // drag to node inside\n          if (dropNodePosition === _utils2.TREE_NODE_DROP_POSITION.DRAG_OVER) {\n            _item2[childrenKey] = (0, _isNil2.default)(_item2[childrenKey]) ? [] : _item2[childrenKey];\n            _item2[childrenKey].push(cloneDragNode);\n            break;\n          } else if (dropNodePosition === _utils2.TREE_NODE_DROP_POSITION.DRAG_OVER_TOP) {\n            // drag to top of node\n            items.splice(_index2, 0, cloneDragNode);\n            break;\n          } else if (dropNodePosition === _utils2.TREE_NODE_DROP_POSITION.DRAG_OVER_BOTTOM) {\n            // drag to bottom of node\n            items.splice(_index2 + 1, 0, cloneDragNode);\n            break;\n          }\n        }\n        if (Array.isArray(_item2[childrenKey]) && _item2[childrenKey].length > 0) {\n          updateTree(_item2[childrenKey]);\n        }\n      }\n    };\n    updateTree(data);\n    return [].concat(data);\n  };\n}\nfunction findNodeOfTree(data, check) {\n  var findNode = function findNode(nodes) {\n    if (nodes === void 0) {\n      nodes = [];\n    }\n    for (var i = 0; i < nodes.length; i += 1) {\n      var _item3 = nodes[i];\n      if ((0, _isArray2.default)(_item3.children)) {\n        var _node3 = findNode(_item3.children);\n        if (_node3) {\n          return _node3;\n        }\n      }\n      if (check(_item3)) {\n        return _item3;\n      }\n    }\n    return undefined;\n  };\n  return findNode(data);\n}\nfunction filterNodesOfTree(data, check) {\n  var findNodes = function findNodes(nodes) {\n    if (nodes === void 0) {\n      nodes = [];\n    }\n    var nextNodes = [];\n    for (var i = 0; i < nodes.length; i += 1) {\n      if ((0, _isArray2.default)(nodes[i].children)) {\n        var nextChildren = findNodes(nodes[i].children);\n        if (nextChildren.length) {\n          var _item4 = (0, _clone2.default)(nodes[i]);\n          _item4.children = nextChildren;\n          nextNodes.push(_item4);\n          continue;\n        }\n      }\n      if (check(nodes[i])) {\n        nextNodes.push(nodes[i]);\n      }\n    }\n    return nextNodes;\n  };\n  return findNodes(data);\n}\n\n/**\n * get all focusable items\n * exclude not visible and disabled node\n * @param filteredData - filtered tree data\n * @param props - TreeProps\n * @param isSearching - component is in Searching\n * @returns\n */\nvar getFocusableItems = function getFocusableItems(filteredData, props, isSearching) {\n  var disabledItemValues = props.disabledItemValues,\n    valueKey = props.valueKey,\n    childrenKey = props.childrenKey,\n    expandItemValues = props.expandItemValues;\n  var items = [];\n  var loop = function loop(nodes) {\n    nodes.forEach(function (node) {\n      var disabled = disabledItemValues.some(function (disabledItem) {\n        return (0, _utils2.shallowEqual)(disabledItem, node[valueKey]);\n      });\n      if (!disabled && node.visible) {\n        items.push(node);\n      }\n      // always expand when searching\n      var expand = isSearching ? true : expandItemValues.includes(node[valueKey]);\n      if (node[childrenKey] && expand) {\n        loop(node[childrenKey]);\n      }\n    });\n  };\n  loop(filteredData);\n  return items;\n};\n\n/**\n * return all focusable Item and active Element index\n * @param focusItemValue\n * @param focusableItems items\n */\nexports.getFocusableItems = getFocusableItems;\nvar getActiveIndex = function getActiveIndex(focusItemValue, focusItems, valueKey) {\n  var activeIndex = -1;\n  focusItems.forEach(function (item, index) {\n    if ((0, _utils2.shallowEqual)(item[valueKey], focusItemValue)) {\n      activeIndex = index;\n    }\n  });\n  return activeIndex;\n};\n\n/**\n * get current active element and node data\n * @param flattenNodes - flattenData\n */\nexports.getActiveIndex = getActiveIndex;\nvar getActiveItem = function getActiveItem(focusItemValue, flattenNodes, valueKey) {\n  var nodeData = null;\n  var activeNode = Object.values(flattenNodes).find(function (node) {\n    return (0, _utils2.shallowEqual)(node[valueKey], focusItemValue);\n  });\n  if (activeNode) {\n    nodeData = activeNode;\n  }\n  return nodeData;\n};\nexports.getActiveItem = getActiveItem;\nvar getElementByDataKey = function getElementByDataKey(dataKey, treeNodesRefs, selector) {\n  var ele = treeNodesRefs[dataKey];\n  if (ele instanceof Element) {\n    return ele.querySelector(selector);\n  }\n  return null;\n};\n\n/**\n * focus to specify tree node\n * @param refKey - target node refKey\n * @param treeNodeRefs - all tree node refs object\n * @param selector - node css selector\n */\nexports.getElementByDataKey = getElementByDataKey;\nvar focusTreeNode = function focusTreeNode(refKey, treeNodeRefs, selector) {\n  var _node$focus;\n  var node = getElementByDataKey(refKey, treeNodeRefs, selector);\n  node === null || node === void 0 ? void 0 : (_node$focus = node.focus) === null || _node$focus === void 0 ? void 0 : _node$focus.call(node);\n};\nexports.focusTreeNode = focusTreeNode;\n/**\n * focus next item with keyboard\n * @param param\n */\nvar focusNextItem = function focusNextItem(_ref3) {\n  var focusItemValue = _ref3.focusItemValue,\n    focusableItems = _ref3.focusableItems,\n    treeNodesRefs = _ref3.treeNodesRefs,\n    selector = _ref3.selector,\n    valueKey = _ref3.valueKey,\n    callback = _ref3.callback;\n  var activeIndex = getActiveIndex(focusItemValue, focusableItems, valueKey);\n  if (focusableItems.length === 0) {\n    return;\n  }\n  var nextIndex = activeIndex === focusableItems.length - 1 ? 0 : activeIndex + 1;\n  var nextFocusItemValue = focusableItems[nextIndex][valueKey];\n  callback === null || callback === void 0 ? void 0 : callback(nextFocusItemValue);\n  focusTreeNode(focusableItems[nextIndex].refKey, treeNodesRefs, selector);\n};\n\n/**\n * focus prev item with keyboard\n * @param param\n */\nexports.focusNextItem = focusNextItem;\nvar focusPreviousItem = function focusPreviousItem(_ref4) {\n  var focusItemValue = _ref4.focusItemValue,\n    focusableItems = _ref4.focusableItems,\n    treeNodesRefs = _ref4.treeNodesRefs,\n    selector = _ref4.selector,\n    valueKey = _ref4.valueKey,\n    callback = _ref4.callback;\n  var activeIndex = getActiveIndex(focusItemValue, focusableItems, valueKey);\n  if (focusableItems.length === 0) {\n    return;\n  }\n  var prevIndex = activeIndex === 0 ? focusableItems.length - 1 : activeIndex - 1;\n  prevIndex = prevIndex >= 0 ? prevIndex : 0;\n  var prevFocusItemValue = focusableItems[prevIndex][valueKey];\n  callback === null || callback === void 0 ? void 0 : callback(prevFocusItemValue);\n  focusTreeNode(focusableItems[prevIndex].refKey, treeNodesRefs, selector);\n};\nexports.focusPreviousItem = focusPreviousItem;\n/**\n * Left arrow keyboard event handler\n * When focus is on an open node, closes the node.\n * When focus is on a child node that is also either an end node or a closed node, moves focus to its parent node.\n * When focus is on a root node that is also either an end node or a closed node, does nothing.\n * @see https://www.w3.org/TR/wai-aria-practices/#TreeView\n */\nfunction leftArrowHandler(_ref5) {\n  var focusItem = _ref5.focusItem,\n    expand = _ref5.expand,\n    onExpand = _ref5.onExpand,\n    onFocusItem = _ref5.onFocusItem;\n  if ((0, _isEmpty2.default)(focusItem)) {\n    return;\n  }\n  if (expand) {\n    onExpand((0, _extends3.default)({}, focusItem, {\n      expand: expand\n    }));\n  } else if (focusItem !== null && focusItem !== void 0 && focusItem.parent) {\n    onFocusItem();\n  }\n}\n\n/**\n * Right arrow keyboard event handler\n * When focus is on a closed node, opens the node; focus does not move.\n * When focus is on a open node, moves focus to the first child node.\n * When focus is on an end node, does nothing.\n * @see https://www.w3.org/TR/wai-aria-practices/#TreeView\n */\nfunction rightArrowHandler(_ref6) {\n  var focusItem = _ref6.focusItem,\n    expand = _ref6.expand,\n    childrenKey = _ref6.childrenKey,\n    onExpand = _ref6.onExpand,\n    onFocusItem = _ref6.onFocusItem;\n  if ((0, _isEmpty2.default)(focusItem) || !Array.isArray(focusItem[childrenKey])) {\n    return;\n  }\n  if (!expand) {\n    onExpand((0, _extends3.default)({}, focusItem, {\n      expand: expand\n    }));\n  } else {\n    onFocusItem();\n  }\n}\n\n/**\n * get scrollIndex in virtualized list\n * @param nodes - data\n * @param value - activeItem value\n * @param valueKey\n */\nvar getScrollToIndex = function getScrollToIndex(nodes, value, valueKey) {\n  return nodes.filter(function (n) {\n    return n.visible;\n  }).findIndex(function (item) {\n    return item[valueKey] === value;\n  });\n};\n\n/**\n * when searching, expand state always return true\n * @param searchKeyword\n * @param expand\n */\nexports.getScrollToIndex = getScrollToIndex;\nfunction getExpandWhenSearching(searchKeyword, expand) {\n  return isSearching(searchKeyword) ? true : expand;\n}\nfunction getTreeActiveNode(nodes, value, valueKey) {\n  if ((0, _isUndefined2.default)(value)) {\n    return undefined;\n  }\n  for (var refKey in nodes) {\n    if ((0, _utils2.shallowEqual)(nodes[refKey][valueKey], value)) {\n      return nodes[refKey];\n    }\n  }\n}\n/**\n * toggle tree node\n * @param param0\n */\nfunction toggleExpand(_ref7) {\n  var node = _ref7.node,\n    isExpand = _ref7.isExpand,\n    expandItemValues = _ref7.expandItemValues,\n    valueKey = _ref7.valueKey;\n  var newExpandItemValues = new Set(expandItemValues);\n  if (isExpand) {\n    newExpandItemValues.add(node[valueKey]);\n  } else {\n    newExpandItemValues.delete(node[valueKey]);\n  }\n  return Array.from(newExpandItemValues);\n}\nfunction getTreeNodeTitle(label) {\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}\n\n/**\n * get all children from flattenNodes object by given parent node\n * @param nodes\n * @param parent\n */\nfunction getChildrenByFlattenNodes(nodes, parent) {\n  if (!(0, _isNil2.default)(parent.refKey) && (0, _isNil2.default)(nodes[parent.refKey])) {\n    return [];\n  }\n  return Object.values(nodes).filter(function (item) {\n    var _item$parent;\n    return (item === null || item === void 0 ? void 0 : (_item$parent = item.parent) === null || _item$parent === void 0 ? void 0 : _item$parent.refKey) === parent.refKey && item.refKey && !nodes[item.refKey].uncheckable;\n  });\n}\nfunction useTreeDrag() {\n  // current dragging node\n  var dragNode = (0, _react.useRef)(null);\n  var _useState = (0, _react.useState)(null),\n    dragOverNodeKey = _useState[0],\n    setDragOverNodeKey = _useState[1]; // drag node and it's children nodes key\n  var _useState2 = (0, _react.useState)([]),\n    dragNodeKeys = _useState2[0],\n    setDragNodeKeys = _useState2[1];\n  var _useState3 = (0, _react.useState)(null),\n    dropNodePosition = _useState3[0],\n    setDropNodePosition = _useState3[1];\n  var setDragNode = function setDragNode(node) {\n    dragNode.current = node;\n  };\n  return {\n    dragNode: dragNode === null || dragNode === void 0 ? void 0 : dragNode.current,\n    dragOverNodeKey: dragOverNodeKey,\n    dragNodeKeys: dragNodeKeys,\n    dropNodePosition: dropNodePosition,\n    setDragNode: setDragNode,\n    setDragOverNodeKey: setDragOverNodeKey,\n    setDragNodeKeys: setDragNodeKeys,\n    setDropNodePosition: setDropNodePosition\n  };\n}\n/**\n * hooks for flatten tree structure\n * @param param0\n */\nfunction useFlattenTreeData(_ref8) {\n  var data = _ref8.data,\n    labelKey = _ref8.labelKey,\n    valueKey = _ref8.valueKey,\n    childrenKey = _ref8.childrenKey,\n    _ref8$uncheckableItem = _ref8.uncheckableItemValues,\n    uncheckableItemValues = _ref8$uncheckableItem === void 0 ? [] : _ref8$uncheckableItem,\n    callback = _ref8.callback;\n  var _useState4 = (0, _react.useState)(Object.create(null)),\n    dispatch = _useState4[1];\n  var forceUpdate = (0, _react.useCallback)(function () {\n    dispatch(Object.create(null));\n  }, [dispatch]);\n  var flattenNodes = (0, _react.useRef)({});\n  var flattenTreeData = (0, _react.useCallback)(function (treeData, parent, layer) {\n    if (layer === void 0) {\n      layer = 1;\n    }\n    if (!Array.isArray(treeData) || treeData.length === 0) {\n      return [];\n    }\n    treeData.map(function (node) {\n      var _extends2;\n      var value = node[valueKey];\n      /**\n       * because the value of the node's type is string or number,\n       * so it can used as the key of the object directly\n       * to avoid number value is converted to string. 1 and '1' will be convert to '1'\n       *  we used `String_` or `Number_` prefix\n       */\n      var refKey = getNodeFormattedRefKey(value);\n      node.refKey = refKey;\n      flattenNodes.current[refKey] = (0, _extends3.default)((_extends2 = {\n        layer: layer\n      }, _extends2[labelKey] = node[labelKey], _extends2[valueKey] = node[valueKey], _extends2.uncheckable = uncheckableItemValues.some(function (value) {\n        return (0, _utils2.shallowEqual)(node[valueKey], value);\n      }), _extends2), node);\n      if (parent) {\n        flattenNodes.current[refKey].parent = (0, _omit2.default)(parent, 'parent', 'children');\n      }\n      flattenTreeData(node[childrenKey], node, layer + 1);\n    });\n    callback === null || callback === void 0 ? void 0 : callback(flattenNodes.current);\n  }, [childrenKey, valueKey, labelKey, callback, uncheckableItemValues]);\n  var serializeListOnlyParent = (0, _react.useCallback)(function (nodes, key) {\n    var list = [];\n    Object.keys(nodes).forEach(function (refKey) {\n      var currentNode = nodes[refKey];\n      if (!(0, _isNil2.default)(currentNode.parent) && !(0, _isNil2.default)(currentNode.parent.refKey)) {\n        var parentNode = nodes[currentNode.parent.refKey];\n        if (currentNode[key]) {\n          if (!(parentNode !== null && parentNode !== void 0 && parentNode.checkAll)) {\n            list.push(nodes[refKey][valueKey]);\n          } else if (parentNode !== null && parentNode !== void 0 && parentNode.uncheckable) {\n            list.push(nodes[refKey][valueKey]);\n          }\n        }\n      } else {\n        if (currentNode[key]) {\n          list.push(nodes[refKey][valueKey]);\n        }\n      }\n    });\n    return list;\n  }, [valueKey]);\n\n  /**\n   * using in CheckTreePicker, to unSerializeList check property\n   */\n  var unSerializeList = (0, _react.useCallback)(function (_ref9) {\n    var nodes = _ref9.nodes,\n      key = _ref9.key,\n      _ref9$value = _ref9.value,\n      value = _ref9$value === void 0 ? [] : _ref9$value,\n      cascade = _ref9.cascade,\n      uncheckableItemValues = _ref9.uncheckableItemValues;\n    // Reset values to false\n    Object.keys(nodes).forEach(function (refKey) {\n      var node = nodes[refKey];\n      if (cascade && !(0, _isNil2.default)(node.parent) && !(0, _isNil2.default)(node.parent.refKey)) {\n        node[key] = nodes[node.parent.refKey][key];\n      } else {\n        node[key] = false;\n      }\n      value.forEach(function (value) {\n        if ((0, _utils2.shallowEqual)(nodes[refKey][valueKey], value) && !uncheckableItemValues.some(function (uncheckableValue) {\n          return (0, _utils2.shallowEqual)(value, uncheckableValue);\n        })) {\n          nodes[refKey][key] = true;\n        }\n      });\n    });\n  }, [valueKey]);\n  var formatVirtualizedTreeData = function formatVirtualizedTreeData(nodes, data, expandItemValues, options) {\n    var cascade = options.cascade,\n      searchKeyword = options.searchKeyword;\n    return UNSAFE_flattenTree(data, childrenKey, function (node) {\n      var formatted = {};\n      var curNode = nodes === null || nodes === void 0 ? void 0 : nodes[node.refKey];\n      var parentKeys = getNodeParentKeys(nodes, curNode, valueKey);\n      /**\n       * When using virtualized,\n       * if the parent node is collapsed, the child nodes should be hidden\n       * avoid component height calculation errors\n       */\n      var visible = curNode !== null && curNode !== void 0 && curNode.parent ? shouldShowNodeByParentExpanded(expandItemValues, parentKeys) : true;\n\n      /**\n       * when searching, every node default expand\n       * the node's visible should follow the original state\n       */\n      if (isSearching(searchKeyword)) {\n        visible = node.visible;\n      }\n      if (curNode) {\n        var checkState = !(0, _isUndefined2.default)(cascade) ? (0, _utils.getNodeCheckState)({\n          node: curNode,\n          cascade: cascade,\n          nodes: nodes,\n          childrenKey: childrenKey\n        }) : undefined;\n        formatted = (0, _extends3.default)({}, node, {\n          check: curNode.check,\n          uncheckable: curNode.uncheckable,\n          hasChildren: !!node[childrenKey],\n          layer: curNode.layer,\n          parent: curNode.parent,\n          checkState: checkState,\n          visible: visible\n        });\n      }\n      return formatted;\n    });\n  };\n  (0, _react.useEffect)(function () {\n    // when data is changed, should clear the flattenNodes, avoid duplicate keys\n    flattenNodes.current = {};\n    flattenTreeData(data);\n  }, [data]); // eslint-disable-line react-hooks/exhaustive-deps\n\n  return {\n    forceUpdate: forceUpdate,\n    flattenNodes: flattenNodes.current,\n    flattenTreeData: flattenTreeData,\n    serializeListOnlyParent: serializeListOnlyParent,\n    unSerializeList: unSerializeList,\n    formatVirtualizedTreeData: formatVirtualizedTreeData\n  };\n}\n\n/**\n * A hook that saving every tree node ref\n */\nfunction useTreeNodeRefs() {\n  var treeNodeRefs = (0, _react.useRef)({});\n  var saveTreeNodeRef = function saveTreeNodeRef(ref, refKey) {\n    if (!(0, _isNil2.default)(refKey)) {\n      treeNodeRefs.current[refKey] = ref;\n    }\n  };\n  return {\n    treeNodesRefs: treeNodeRefs.current,\n    saveTreeNodeRef: saveTreeNodeRef\n  };\n}\n/**\n * A hook that handles tree search filter options\n * @param props\n */\nfunction useTreeSearch(props) {\n  var labelKey = props.labelKey,\n    childrenKey = props.childrenKey,\n    searchKeyword = props.searchKeyword,\n    data = props.data,\n    searchBy = props.searchBy,\n    callback = props.callback;\n  var filterVisibleData = (0, _react.useCallback)(function (data, searchKeyword) {\n    var setVisible = function setVisible(nodes) {\n      return nodes.forEach(function (item) {\n        item.visible = searchBy ? searchBy(searchKeyword, item[labelKey], item) : (0, _Picker.shouldDisplay)(item[labelKey], searchKeyword);\n        if ((0, _isArray2.default)(item[childrenKey])) {\n          filterVisibleData(item[childrenKey], searchKeyword);\n          item[childrenKey].forEach(function (child) {\n            if (child.visible) {\n              item.visible = child.visible;\n            }\n          });\n        }\n      });\n    };\n    setVisible(data);\n    return data;\n  }, [childrenKey, labelKey, searchBy]);\n\n  // Use search keywords to filter options.\n  var _useState5 = (0, _react.useState)(searchKeyword !== null && searchKeyword !== void 0 ? searchKeyword : ''),\n    searchKeywordState = _useState5[0],\n    setSearchKeyword = _useState5[1];\n  var _useState6 = (0, _react.useState)(function () {\n      return filterVisibleData(data, searchKeywordState);\n    }),\n    filteredData = _useState6[0],\n    setFilteredData = _useState6[1];\n  var handleSearch = function handleSearch(searchKeyword, event) {\n    var filteredData = filterVisibleData(data, searchKeyword);\n    setFilteredData(filteredData);\n    setSearchKeyword(searchKeyword);\n    event && (callback === null || callback === void 0 ? void 0 : callback(searchKeyword, filteredData, event));\n  };\n  (0, _react.useEffect)(function () {\n    handleSearch(searchKeyword !== null && searchKeyword !== void 0 ? searchKeyword : '');\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [searchKeyword]);\n  var handleSetFilteredData = (0, _react.useCallback)(function (data, searchKeyword) {\n    setFilteredData(filterVisibleData(data, searchKeyword));\n  }, [filterVisibleData]);\n  return {\n    searchKeywordState: searchKeywordState,\n    filteredData: filteredData,\n    setFilteredData: handleSetFilteredData,\n    setSearchKeyword: setSearchKeyword,\n    handleSearch: handleSearch\n  };\n}\nfunction useGetTreeNodeChildren(treeData, valueKey, childrenKey) {\n  var _useState7 = (0, _react.useState)([]),\n    loadingNodeValues = _useState7[0],\n    setLoadingNodeValues = _useState7[1];\n  var _useState8 = (0, _react.useState)(treeData),\n    data = _useState8[0],\n    setData = _useState8[1];\n  var concatChildren = (0, _react.useCallback)(function (treeNode, children) {\n    var value = treeNode[valueKey];\n    treeNode = findNodeOfTree(data, function (item) {\n      return value === item[valueKey];\n    });\n    treeNode[childrenKey] = children;\n    var newData = data.concat([]);\n    setData(newData);\n    return newData;\n  }, [data, valueKey, childrenKey]);\n  var loadChildren = (0, _react.useCallback)(function (node, getChildren) {\n    setLoadingNodeValues(function (prev) {\n      return prev.concat(node[valueKey]);\n    });\n    var children = getChildren(node);\n    if (children instanceof Promise) {\n      children.then(function (res) {\n        var newData = concatChildren(node, res);\n        setData(newData);\n        setLoadingNodeValues(function (prev) {\n          return prev.filter(function (item) {\n            return !(0, _utils2.shallowEqual)(item, node[valueKey]);\n          });\n        });\n      });\n    } else {\n      setData(concatChildren(node, children));\n      setLoadingNodeValues(function (prev) {\n        return prev.filter(function (item) {\n          return !(0, _utils2.shallowEqual)(item, node[valueKey]);\n        });\n      });\n    }\n  }, [concatChildren, valueKey]);\n  return {\n    data: data,\n    setData: setData,\n    loadingNodeValues: loadingNodeValues,\n    loadChildren: loadChildren\n  };\n}\n/**\n * Focus to active tree node.\n * @param param0\n */\nfunction focusToActiveTreeNode(_ref10) {\n  var _activeItem$focus;\n  var list = _ref10.list,\n    valueKey = _ref10.valueKey,\n    activeNode = _ref10.activeNode,\n    virtualized = _ref10.virtualized,\n    container = _ref10.container,\n    selector = _ref10.selector,\n    formattedNodes = _ref10.formattedNodes;\n  if (!container) return;\n  if (virtualized && activeNode) {\n    var _list$scrollToRow;\n    var scrollIndex = getScrollToIndex(formattedNodes, activeNode === null || activeNode === void 0 ? void 0 : activeNode[valueKey], valueKey);\n    (_list$scrollToRow = list.scrollToRow) === null || _list$scrollToRow === void 0 ? void 0 : _list$scrollToRow.call(list, scrollIndex);\n    return;\n  }\n  var activeItem = container.querySelector(selector);\n  if (!activeItem) {\n    return;\n  }\n  activeItem === null || activeItem === void 0 ? void 0 : (_activeItem$focus = activeItem.focus) === null || _activeItem$focus === void 0 ? void 0 : _activeItem$focus.call(activeItem);\n}\nfunction isSearching(searchKeyword) {\n  return !(0, _isEmpty2.default)(searchKeyword);\n}\nfunction getTreeNodeIndent(rtl, layer, absolute) {\n  var _ref12;\n  if (absolute === void 0) {\n    absolute = false;\n  }\n  // layer start from 1\n  var offset = layer * _constants.TREE_NODE_PADDING + _constants.TREE_NODE_ROOT_PADDING;\n  if (absolute) {\n    var _ref11;\n    return _ref11 = {}, _ref11[rtl ? 'right' : 'left'] = offset, _ref11;\n  }\n  return _ref12 = {}, _ref12[rtl ? 'paddingRight' : 'paddingLeft'] = offset, _ref12;\n}\n\n/**\n * according to the value type to get the formatted valueKey of the node\n * @param value\n * @returns\n */\nfunction getNodeFormattedRefKey(value) {\n  return \"\" + (typeof value === 'number' ? 'Number_' : 'String_') + value;\n}\n\n/**\n * create drag preview when tree node start drag\n * @param name\n * @param className\n * @returns\n */\nfunction createDragPreview(name, className) {\n  var dragPreview = document.createElement('div');\n  dragPreview.id = 'rs-tree-drag-preview';\n  dragPreview.innerHTML = name;\n  dragPreview.classList.add(className);\n  document.body.appendChild(dragPreview);\n  return dragPreview;\n}\n\n/**\n * remove drag preview when tree node drop\n */\nfunction removeDragPreview() {\n  var _dragPreview$parentNo, _dragPreview$parentNo2;\n  var dragPreview = document.getElementById('rs-tree-drag-preview');\n  dragPreview === null || dragPreview === void 0 ? void 0 : (_dragPreview$parentNo = dragPreview.parentNode) === null || _dragPreview$parentNo === void 0 ? void 0 : (_dragPreview$parentNo2 = _dragPreview$parentNo.removeChild) === null || _dragPreview$parentNo2 === void 0 ? void 0 : _dragPreview$parentNo2.call(_dragPreview$parentNo, dragPreview);\n}\nfunction stringifyTreeNodeLabel(label) {\n  if (typeof label === 'string') {\n    return label;\n  } else if ( /*#__PURE__*/_react.default.isValidElement(label)) {\n    var _nodes2 = (0, _reactToString.default)(label);\n    return _nodes2.join('');\n  }\n  return '';\n}\n\n/**\n * Returns a WeakMap that maps each item in `items` to its parent\n * indicated by `getChildren` function\n */\nfunction getParentMap(items, getChildren) {\n  var map = new WeakMap();\n  for (var queue = [].concat(items); queue.length > 0;) {\n    var _item5 = queue.shift();\n    var children = getChildren(_item5);\n    if (children) {\n      for (var _iterator2 = _createForOfIteratorHelperLoose(children), _step2; !(_step2 = _iterator2()).done;) {\n        var child = _step2.value;\n        map.set(child, _item5);\n        queue.push(child);\n      }\n    }\n  }\n  return map;\n}\n\n/**\n * Returns a Map that maps each item's \"key\", indicated by `getKey` function,\n * to its parent indicated by `getChildren` function\n *\n * NOTICE:\n * Using this function is discouraged.\n * Use {@link getParentMap} whenever possible.\n */\nfunction getKeyParentMap(items, getKey, getChildren) {\n  var map = new Map();\n  for (var queue = [].concat(items); queue.length > 0;) {\n    var _item6 = queue.shift();\n    var children = getChildren(_item6);\n    if (children) {\n      for (var _iterator3 = _createForOfIteratorHelperLoose(children), _step3; !(_step3 = _iterator3()).done;) {\n        var child = _step3.value;\n        map.set(getKey(child), _item6);\n        queue.push(child);\n      }\n    }\n  }\n  return map;\n}\n\n/**\n * Returns an array indicating the hierarchy path from root towards `target` item\n */\nfunction getPathTowardsItem(target, getParent) {\n  if (!target) return [];\n  var path = [target];\n  for (var parent = getParent(target); !!parent; parent = getParent(parent)) {\n    path.unshift(parent);\n  }\n  return path;\n}\n\n//# sourceURL=webpack://rsuite/./src/utils/treeUtils.ts?");
-
-/***/ }),
-
 /***/ "./src/utils/useClassNames.ts":
 /*!************************************!*\
   !*** ./src/utils/useClassNames.ts ***!