rsuite 6.0.0 → 6.1.0

package/dist/rsuite.js

@@ -1346,7 +1346,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 _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _SafeAnchor = _interopRequireDefault(__webpack_require__(/*! ../internals/SafeAnchor */ \"./src/internals/SafeAnchor/index.tsx\"));\nvar _Box = _interopRequireDefault(__webpack_require__(/*! ../internals/Box */ \"./src/internals/Box/index.tsx\"));\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Breadcrumb/BreadcrumbItem.tsx\";\n/**\n * The `<Breadcrumb.Item>` component is used to specify each section of the Breadcrumb.\n * @see https://rsuitejs.com/components/breadcrumb\n */\nconst BreadcrumbItem = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    wrapperAs = 'li',\n    href,\n    as: Component = href ? _SafeAnchor.default : 'span',\n    classPrefix = 'breadcrumb-item',\n    title,\n    target,\n    className,\n    style,\n    active,\n    children,\n    separator,\n    icon,\n    ...rest\n  } = props;\n  const {\n    merge,\n    withPrefix\n  } = (0, _hooks.useStyles)(classPrefix);\n  const classes = merge(className, withPrefix());\n  return /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({\n    as: wrapperAs,\n    style: style,\n    className: classes,\n    ref: ref,\n    \"data-active\": active\n  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 70,\n      columnNumber: 7\n    }\n  }), icon, active ? /*#__PURE__*/_react.default.createElement(\"span\", {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 80,\n      columnNumber: 11\n    }\n  }, children) : /*#__PURE__*/_react.default.createElement(Component, {\n    href: href,\n    title: title,\n    target: target,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 82,\n      columnNumber: 11\n    }\n  }, children), separator);\n});\nBreadcrumbItem.displayName = 'BreadcrumbItem';\nvar _default = exports[\"default\"] = BreadcrumbItem;\n\n//# sourceURL=webpack://rsuite/./src/Breadcrumb/BreadcrumbItem.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 _SafeAnchor = _interopRequireDefault(__webpack_require__(/*! ../internals/SafeAnchor */ \"./src/internals/SafeAnchor/index.tsx\"));\nvar _Box = _interopRequireDefault(__webpack_require__(/*! ../internals/Box */ \"./src/internals/Box/index.tsx\"));\nvar _utils = __webpack_require__(/*! ../internals/Box/utils */ \"./src/internals/Box/utils.ts\");\nvar _utils2 = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Breadcrumb/BreadcrumbItem.tsx\";\n/**\n * The `<Breadcrumb.Item>` component is used to specify each section of the Breadcrumb.\n * @see https://rsuitejs.com/components/breadcrumb\n */\nconst BreadcrumbItem = (0, _utils2.forwardRef)((props, ref) => {\n  const {\n    wrapperAs: Wrapper = 'li',\n    href,\n    as: Component = href ? _SafeAnchor.default : 'span',\n    classPrefix = 'breadcrumb-item',\n    title,\n    target,\n    className,\n    style,\n    active,\n    children,\n    separator,\n    icon,\n    ...rest\n  } = props;\n  const {\n    merge,\n    withPrefix\n  } = (0, _hooks.useStyles)(classPrefix);\n  const classes = merge(className, withPrefix());\n\n  // Separate BoxProps for wrapper and other props for inner component\n  const boxProps = (0, _utils.extractBoxProps)(rest);\n  const componentProps = (0, _utils.omitBoxProps)(rest);\n  return /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({\n    as: Wrapper,\n    style: style,\n    className: classes,\n    \"data-active\": active\n  }, boxProps, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 75,\n      columnNumber: 7\n    }\n  }), icon, active ? /*#__PURE__*/_react.default.createElement(\"span\", {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 78,\n      columnNumber: 11\n    }\n  }, children) : /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({\n    ref: ref,\n    href: href,\n    title: title,\n    target: target\n  }, componentProps, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 80,\n      columnNumber: 11\n    }\n  }), children), separator);\n});\nBreadcrumbItem.displayName = 'BreadcrumbItem';\nvar _default = exports[\"default\"] = BreadcrumbItem;\n\n//# sourceURL=webpack://rsuite/./src/Breadcrumb/BreadcrumbItem.tsx?");
 
 /***/ }),
 
@@ -1962,7 +1962,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\");\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 _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 _hooks2 = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils3 = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _useActive = _interopRequireDefault(__webpack_require__(/*! ./useActive */ \"./src/Cascader/useActive.ts\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Cascader/Cascader.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\nconst emptyArray = [];\n/**\n * The `Cascader` component displays a hierarchical list of options.\n * @see https://rsuitejs.com/components/cascader\n */\nconst Cascader = (0, _utils3.forwardRef)((props, ref) => {\n  const {\n    rtl,\n    propsWithDefaults\n  } = (0, _hooks2.useCustom)('Cascader', props);\n  const {\n    appearance = 'default',\n    as,\n    block,\n    className,\n    cleanable = true,\n    classPrefix = 'picker',\n    columnHeight,\n    columnWidth,\n    data = emptyArray,\n    defaultValue,\n    disabled,\n    disabledItemValues = emptyArray,\n    childrenKey = 'children',\n    id,\n    labelKey = 'label',\n    locale,\n    parentSelectable,\n    placeholder,\n    placement = 'bottomStart',\n    popupClassName,\n    popupStyle,\n    renderColumn,\n    renderExtraFooter,\n    renderSearchItem,\n    renderTreeNode,\n    renderValue,\n    searchable = true,\n    style,\n    toggleAs,\n    value: valueProp,\n    valueKey = 'value',\n    onClean,\n    onChange,\n    onEnter,\n    onExit,\n    onSearch,\n    onSelect,\n    getChildren,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    trigger,\n    root,\n    target,\n    overlay,\n    searchInput\n  } = (0, _Picker.usePickerRef)(ref);\n  const [value, setValue] = (0, _hooks2.useControlled)(valueProp, defaultValue);\n\n  // Store the children of each node\n  const childrenMap = (0, _hooks2.useMap)();\n\n  // Store the parent of each node\n  const parentMap = (0, _react.useMemo)(() => (0, _utils2.getParentMap)(data, item => {\n    var _childrenMap$get;\n    return (_childrenMap$get = childrenMap.get(item)) !== null && _childrenMap$get !== void 0 ? _childrenMap$get : item[childrenKey];\n  }), [childrenMap, childrenKey, data]);\n\n  // Flatten the tree data\n  const flattenedData = (0, _react.useMemo)(() => (0, _utils.flattenTree)(data, item => {\n    var _childrenMap$get2;\n    return (_childrenMap$get2 = childrenMap.get(item)) !== null && _childrenMap$get2 !== void 0 ? _childrenMap$get2 : item[childrenKey];\n  }), [childrenMap, childrenKey, data]);\n\n  // The selected item\n  const selectedItem = flattenedData.find(item => item[valueKey] === value);\n\n  // Callback function after selecting the node\n  const onSelectCallback = (node, event) => {\n    var _trigger$current;\n    const {\n      isLeafNode,\n      cascadePaths,\n      itemData\n    } = node;\n    onSelect === null || onSelect === void 0 || onSelect(itemData, cascadePaths, event);\n    const 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 || onChange(nextValue, event);\n    }\n\n    // Update menu position\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 || _trigger$current.updatePosition();\n  };\n  const {\n    activeItem,\n    setActiveItem,\n    loadingItemsSet,\n    handleSelect\n  } = (0, _hooks.useSelect)({\n    value,\n    valueKey,\n    childrenKey,\n    childrenMap,\n    selectedItem,\n    getChildren,\n    onChange,\n    onSelect: onSelectCallback\n  });\n  const {\n    columns,\n    pathTowardsActiveItem,\n    pathTowardsSelectedItem\n  } = (0, _hooks.usePaths)({\n    data,\n    activeItem,\n    selectedItem,\n    getParent: item => parentMap.get(item),\n    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\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  let hasValue = pathTowardsSelectedItem.length > 0 || !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue);\n  const {\n    prefix,\n    merge\n  } = (0, _hooks2.useStyles)(classPrefix);\n  const onFocusItemCallback = (0, _react.useCallback)(value => {\n    setActiveItem(flattenedData.find(item => item[valueKey] === value));\n  }, [flattenedData, setActiveItem, valueKey]);\n\n  // Used to hover the focuse item  when trigger `onKeydown`\n  const {\n    focusItemValue,\n    setFocusItemValue,\n    setLayer,\n    setKeys,\n    onKeyDown: onFocusItem\n  } = (0, _Picker.useFocusItemValue)(value, {\n    rtl,\n    data: flattenedData,\n    valueKey,\n    defaultLayer: pathTowardsSelectedItem !== null && pathTowardsSelectedItem !== void 0 && pathTowardsSelectedItem.length ? pathTowardsSelectedItem.length - 1 : 0,\n    target: () => overlay.current,\n    getParent: item => parentMap.get(item),\n    callback: onFocusItemCallback\n  });\n  const onSearchCallback = (value, items, event) => {\n    onSearch === null || onSearch === 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  const {\n    items,\n    searchKeyword,\n    setSearchKeyword,\n    handleSearch\n  } = (0, _hooks.useSearch)({\n    labelKey,\n    childrenKey,\n    parentMap,\n    flattenedData,\n    parentSelectable,\n    onSearch: onSearchCallback\n  });\n  const {\n    active,\n    events\n  } = (0, _useActive.default)({\n    onEnter,\n    onExit,\n    target,\n    setSearchKeyword\n  });\n  const handleClose = (0, _hooks2.useEventCallback)(() => {\n    var _trigger$current2, _target$current, _target$current$focus;\n    (_trigger$current2 = trigger.current) === null || _trigger$current2 === 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 || (_target$current$focus = _target$current.focus) === null || _target$current$focus === void 0 || _target$current$focus.call(_target$current);\n  });\n  const handleClean = (0, _hooks2.useEventCallback)(event => {\n    if (disabled || !target.current) {\n      return;\n    }\n    setValue(null);\n    onChange === null || onChange === void 0 || onChange(null, event);\n  });\n  const handleMenuPressEnter = (0, _hooks2.useEventCallback)(event => {\n    const focusItem = (0, _utils2.findNodeOfTree)(data, item => item[valueKey] === focusItemValue);\n    const 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 || onSelect(focusItem, pathTowardsActiveItem, event);\n        onChange === null || onChange === void 0 || onChange(focusItemValue !== null && focusItemValue !== void 0 ? focusItemValue : null, event);\n      }\n      handleClose();\n    }\n  });\n  const onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)({\n    toggle: !focusItemValue || !active,\n    trigger,\n    target,\n    overlay,\n    searchInput,\n    active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter,\n    ...rest\n  });\n\n  /**\n   * The search structure option is processed after being selected.\n   */\n  const handleSearchRowSelect = (0, _hooks2.useEventCallback)((itemData, nodes, event) => {\n    const nextValue = itemData[valueKey];\n    handleClose();\n    setSearchKeyword('');\n    setValue(nextValue);\n    onSelect === null || onSelect === void 0 || onSelect(itemData, nodes, event);\n    onChange === null || onChange === void 0 || onChange(nextValue, event);\n  });\n  const renderCascadeColumn = (childNodes, column) => {\n    if (typeof renderColumn === 'function') {\n      return renderColumn(childNodes, column);\n    }\n    return childNodes;\n  };\n  const renderCascadeTreeNode = (node, itemData) => {\n    if (typeof renderTreeNode === 'function') {\n      return renderTreeNode(node, itemData);\n    }\n    return node;\n  };\n  const renderTreeView = (positionProps, speakerRef) => {\n    const {\n      className\n    } = positionProps || {};\n    const classes = merge(className, popupClassName, prefix('popup-cascader'));\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils3.mergeRefs)(overlay, speakerRef),\n      className: classes,\n      style: popupStyle,\n      target: trigger,\n      onKeyDown: onPickerKeyDown,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 345,\n        columnNumber: 9\n      }\n    }, searchable && /*#__PURE__*/_react.default.createElement(_SearchView.default, {\n      data: items,\n      searchKeyword: searchKeyword,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      locale: locale,\n      parentMap: parentMap,\n      disabledItemValues: disabledItemValues,\n      focusItemValue: focusItemValue,\n      inputRef: searchInput,\n      renderSearchItem: renderSearchItem,\n      onSelect: handleSearchRowSelect,\n      onSearch: handleSearch,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 353,\n        columnNumber: 13\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: 'cascade-tree',\n      data: columns,\n      cascadePaths: pathTowardsActiveItem,\n      activeItemValue: value,\n      onSelect: handleSelect,\n      renderColumn: renderCascadeColumn,\n      renderTreeNode: renderCascadeTreeNode,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 370,\n        columnNumber: 13\n      }\n    }), renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  let selectedElement = placeholder;\n  if (pathTowardsSelectedItem.length > 0) {\n    selectedElement = [];\n    pathTowardsSelectedItem.forEach((item, index) => {\n      const key = item[valueKey] || item[labelKey];\n      selectedElement.push(/*#__PURE__*/_react.default.createElement(\"span\", {\n        key: key,\n        __self: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 399,\n          columnNumber: 30\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: void 0,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 402,\n            columnNumber: 13\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  const triggerProps = {\n    ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n    ...events\n  };\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    as: as,\n    id: id,\n    name: \"cascader\",\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    popupType: \"tree\",\n    triggerProps: triggerProps,\n    ref: trigger,\n    placement: placement,\n    speaker: renderTreeView,\n    rootRef: root,\n    style: style,\n    classPrefix: classPrefix,\n    className: className,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 424,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({\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  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 441,\n      columnNumber: 9\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder)));\n});\nCascader.displayName = 'Cascader';\nvar _default = exports[\"default\"] = Cascader;\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\");\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 _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 _hooks2 = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils3 = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _useActive = _interopRequireDefault(__webpack_require__(/*! ./useActive */ \"./src/Cascader/useActive.ts\"));\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Cascader/Cascader.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\nconst emptyArray = [];\n/**\n * The `Cascader` component displays a hierarchical list of options.\n * @see https://rsuitejs.com/components/cascader\n */\nconst Cascader = (0, _utils3.forwardRef)((props, ref) => {\n  const {\n    rtl,\n    propsWithDefaults\n  } = (0, _hooks2.useCustom)('Cascader', props);\n  const {\n    appearance = 'default',\n    as,\n    block,\n    className,\n    cleanable = true,\n    classPrefix = 'picker',\n    columnHeight,\n    columnWidth,\n    data = emptyArray,\n    defaultValue,\n    disabled,\n    disabledItemValues = emptyArray,\n    childrenKey = 'children',\n    id,\n    labelKey = 'label',\n    locale,\n    parentSelectable,\n    placeholder,\n    placement = 'bottomStart',\n    popupClassName,\n    popupStyle,\n    renderColumn,\n    renderExtraFooter,\n    renderSearchItem,\n    renderTreeNode,\n    renderValue,\n    searchable = true,\n    style,\n    toggleAs,\n    value: valueProp,\n    valueKey = 'value',\n    onClean,\n    onChange,\n    onEnter,\n    onExit,\n    onSearch,\n    onSelect,\n    getChildren,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    trigger,\n    root,\n    target,\n    overlay,\n    searchInput\n  } = (0, _Picker.usePickerRef)(ref);\n  const [value, setValue] = (0, _hooks2.useControlled)(valueProp, defaultValue);\n\n  // Store the children of each node\n  const childrenMap = (0, _hooks2.useMap)();\n\n  // Store the parent of each node\n  const parentMap = (0, _react.useMemo)(() => (0, _utils2.getParentMap)(data, item => {\n    var _childrenMap$get;\n    return (_childrenMap$get = childrenMap.get(item)) !== null && _childrenMap$get !== void 0 ? _childrenMap$get : item[childrenKey];\n  }), [childrenMap, childrenKey, data]);\n\n  // Flatten the tree data\n  const flattenedData = (0, _react.useMemo)(() => (0, _utils.flattenTree)(data, item => {\n    var _childrenMap$get2;\n    return (_childrenMap$get2 = childrenMap.get(item)) !== null && _childrenMap$get2 !== void 0 ? _childrenMap$get2 : item[childrenKey];\n  }), [childrenMap, childrenKey, data]);\n\n  // The selected item\n  const selectedItem = flattenedData.find(item => item[valueKey] === value);\n\n  // Callback function after selecting the node\n  const onSelectCallback = (node, event) => {\n    var _trigger$current;\n    const {\n      isLeafNode,\n      cascadePaths,\n      itemData\n    } = node;\n    onSelect === null || onSelect === void 0 || onSelect(itemData, cascadePaths, event);\n    const 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 || onChange(nextValue, event);\n    }\n\n    // Update menu position\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 || _trigger$current.updatePosition();\n  };\n  const {\n    activeItem,\n    setActiveItem,\n    loadingItemsSet,\n    handleSelect\n  } = (0, _hooks.useSelect)({\n    value,\n    valueKey,\n    childrenKey,\n    childrenMap,\n    selectedItem,\n    getChildren,\n    onChange,\n    onSelect: onSelectCallback\n  });\n  const {\n    columns,\n    pathTowardsActiveItem,\n    pathTowardsSelectedItem\n  } = (0, _hooks.usePaths)({\n    data,\n    activeItem,\n    selectedItem,\n    getParent: item => parentMap.get(item),\n    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\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  let hasValue = pathTowardsSelectedItem.length > 0 || !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue);\n  const {\n    prefix,\n    merge\n  } = (0, _hooks2.useStyles)(classPrefix);\n  const onFocusItemCallback = (0, _react.useCallback)(value => {\n    setActiveItem(flattenedData.find(item => item[valueKey] === value));\n  }, [flattenedData, setActiveItem, valueKey]);\n\n  // Used to hover the focuse item  when trigger `onKeydown`\n  const {\n    focusItemValue,\n    setFocusItemValue,\n    setLayer,\n    setKeys,\n    onKeyDown: onFocusItem\n  } = (0, _Picker.useFocusItemValue)(value, {\n    rtl,\n    data: flattenedData,\n    valueKey,\n    defaultLayer: pathTowardsSelectedItem !== null && pathTowardsSelectedItem !== void 0 && pathTowardsSelectedItem.length ? pathTowardsSelectedItem.length - 1 : 0,\n    target: () => overlay.current,\n    getParent: item => parentMap.get(item),\n    callback: onFocusItemCallback\n  });\n  const onSearchCallback = (value, items, event) => {\n    onSearch === null || onSearch === 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  const {\n    items,\n    searchKeyword,\n    setSearchKeyword,\n    handleSearch\n  } = (0, _hooks.useSearch)({\n    labelKey,\n    childrenKey,\n    parentMap,\n    flattenedData,\n    parentSelectable,\n    onSearch: onSearchCallback\n  });\n  const {\n    active,\n    events\n  } = (0, _useActive.default)({\n    onEnter,\n    onExit,\n    target,\n    setSearchKeyword\n  });\n  const handleClose = (0, _hooks2.useEventCallback)(() => {\n    var _trigger$current2, _target$current, _target$current$focus;\n    (_trigger$current2 = trigger.current) === null || _trigger$current2 === 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 || (_target$current$focus = _target$current.focus) === null || _target$current$focus === void 0 || _target$current$focus.call(_target$current);\n  });\n  const handleClean = (0, _hooks2.useEventCallback)(event => {\n    if (disabled || !target.current) {\n      return;\n    }\n    setValue(null);\n    onChange === null || onChange === void 0 || onChange(null, event);\n  });\n  const handleMenuPressEnter = (0, _hooks2.useEventCallback)(event => {\n    const focusItem = (0, _utils2.findNodeOfTree)(data, item => item[valueKey] === focusItemValue);\n    const 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 || onSelect(focusItem, pathTowardsActiveItem, event);\n        onChange === null || onChange === void 0 || onChange(focusItemValue !== null && focusItemValue !== void 0 ? focusItemValue : null, event);\n      }\n      handleClose();\n    }\n  });\n  const onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)({\n    toggle: !focusItemValue || !active,\n    trigger,\n    target,\n    overlay,\n    searchInput,\n    active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter,\n    ...rest\n  });\n\n  /**\n   * The search structure option is processed after being selected.\n   */\n  const handleSearchRowSelect = (0, _hooks2.useEventCallback)((itemData, nodes, event) => {\n    const nextValue = itemData[valueKey];\n    handleClose();\n    setSearchKeyword('');\n    setValue(nextValue);\n    onSelect === null || onSelect === void 0 || onSelect(itemData, nodes, event);\n    onChange === null || onChange === void 0 || onChange(nextValue, event);\n  });\n  const renderCascadeColumn = (childNodes, column) => {\n    if (typeof renderColumn === 'function') {\n      return renderColumn(childNodes, column);\n    }\n    return childNodes;\n  };\n  const renderCascadeTreeNode = (node, itemData) => {\n    if (typeof renderTreeNode === 'function') {\n      return renderTreeNode(node, itemData);\n    }\n    return node;\n  };\n  const renderTreeView = (positionProps, speakerRef) => {\n    const {\n      className\n    } = positionProps || {};\n    const classes = merge(className, popupClassName, prefix('popup-cascader'));\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils3.mergeRefs)(overlay, speakerRef),\n      className: classes,\n      style: popupStyle,\n      target: trigger,\n      onKeyDown: onPickerKeyDown,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 345,\n        columnNumber: 9\n      }\n    }, searchable && /*#__PURE__*/_react.default.createElement(_SearchView.default, {\n      data: items,\n      searchKeyword: searchKeyword,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      locale: locale,\n      parentMap: parentMap,\n      disabledItemValues: disabledItemValues,\n      focusItemValue: focusItemValue,\n      inputRef: searchInput,\n      renderSearchItem: renderSearchItem,\n      onSelect: handleSearchRowSelect,\n      onSearch: handleSearch,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 353,\n        columnNumber: 13\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: 'cascade-tree',\n      data: columns,\n      cascadePaths: pathTowardsActiveItem,\n      activeItemValue: value,\n      onSelect: handleSelect,\n      renderColumn: renderCascadeColumn,\n      renderTreeNode: renderCascadeTreeNode,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 370,\n        columnNumber: 13\n      }\n    }), renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  let selectedElement = placeholder;\n  if (pathTowardsSelectedItem.length > 0) {\n    selectedElement = [];\n    pathTowardsSelectedItem.forEach((item, index) => {\n      const key = item[valueKey] || item[labelKey];\n      selectedElement.push(/*#__PURE__*/_react.default.createElement(\"span\", {\n        key: key,\n        __self: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 399,\n          columnNumber: 30\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: void 0,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 402,\n            columnNumber: 13\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  const triggerProps = {\n    ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n    ...events\n  };\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    as: as,\n    id: id,\n    pickerType: \"cascader\",\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    popupType: \"tree\",\n    triggerProps: triggerProps,\n    ref: trigger,\n    placement: placement,\n    speaker: renderTreeView,\n    rootRef: root,\n    style: style,\n    classPrefix: classPrefix,\n    className: className,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 424,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({\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  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 441,\n      columnNumber: 9\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder)));\n});\nCascader.displayName = 'Cascader';\nvar _default = exports[\"default\"] = Cascader;\n\n//# sourceURL=webpack://rsuite/./src/Cascader/Cascader.tsx?");
 
 /***/ }),
 
@@ -2017,7 +2017,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 _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\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 _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _utils = __webpack_require__(/*! ../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckPicker/CheckPicker.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\nconst emptyArray = [];\n/**\n * A component for selecting checkable items in a dropdown list.\n * @see https://rsuitejs.com/components/check-picker\n */\nconst CheckPicker = (0, _utils2.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('CheckPicker', props);\n  const {\n    appearance = 'default',\n    as,\n    block,\n    className,\n    cleanable = true,\n    classPrefix = 'picker',\n    countable = true,\n    data = emptyArray,\n    defaultValue,\n    disabled,\n    disabledItemValues = emptyArray,\n    groupBy,\n    id,\n    labelKey = 'label',\n    listProps,\n    listboxMaxHeight = 320,\n    locale,\n    placeholder,\n    placement = 'bottomStart',\n    popupAutoWidth = true,\n    popupClassName,\n    popupStyle,\n    searchable = true,\n    sticky,\n    style,\n    size,\n    toggleAs,\n    value: valueProp,\n    valueKey = 'value',\n    virtualized,\n    sort,\n    searchBy,\n    renderOption,\n    renderOptionGroup,\n    renderListbox,\n    renderValue,\n    renderExtraFooter,\n    onGroupTitleClick,\n    onSearch,\n    onEnter,\n    onExit,\n    onClean,\n    onChange,\n    onSelect,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    trigger,\n    root,\n    target,\n    overlay,\n    list,\n    searchInput\n  } = (0, _Picker.usePickerRef)(ref);\n  const [value, setValue] = (0, _hooks.useControlled)(valueProp, defaultValue || []);\n\n  // Used to hover the focuse item  when trigger `onKeydown`\n  const {\n    focusItemValue,\n    setFocusItemValue,\n    onKeyDown: onFocusItem\n  } = (0, _Picker.useFocusItemValue)(value === null || value === void 0 ? void 0 : value[0], {\n    data,\n    valueKey,\n    target: () => overlay.current\n  });\n  const handleSearchCallback = (0, _hooks.useEventCallback)((searchKeyword, filteredData, event) => {\n    var _filteredData$;\n    // The first option after filtering is the focus.\n    setFocusItemValue(filteredData === null || filteredData === void 0 || (_filteredData$ = filteredData[0]) === null || _filteredData$ === void 0 ? void 0 : _filteredData$[valueKey]);\n    onSearch === null || onSearch === void 0 || onSearch(searchKeyword, event);\n  });\n\n  // Use search keywords to filter options.\n  const {\n    searchKeyword,\n    filteredData,\n    handleSearch,\n    resetSearch,\n    checkShouldDisplay\n  } = (0, _Picker.useSearch)(data, {\n    labelKey,\n    searchBy,\n    callback: handleSearchCallback\n  });\n\n  // Use component active state to support keyboard events.\n  const [active, setActive] = (0, _react.useState)(false);\n\n  // A list of shortcut options.\n  // when opened again, the selected options are displayed at the top.\n  const [stickyItems, setStickyItems] = (0, _react.useState)([]);\n  const initStickyItems = () => {\n    if (!sticky) {\n      return;\n    }\n    let nextStickyItems = [];\n    if (data && value.length) {\n      nextStickyItems = data.filter(item => {\n        return value.some(v => v === item[valueKey]);\n      });\n    }\n    setStickyItems(nextStickyItems);\n  };\n  const handleChangeValue = (0, _hooks.useEventCallback)((value, event) => {\n    onChange === null || onChange === void 0 || onChange(value, event);\n  });\n  const handleClean = (0, _hooks.useEventCallback)(event => {\n    if (disabled || !cleanable) {\n      return;\n    }\n    setValue([]);\n    onClean === null || onClean === void 0 || onClean(event);\n    handleChangeValue([], event);\n  });\n  const handleMenuPressEnter = event => {\n    const nextValue = (0, _clone.default)(value);\n    if (!focusItemValue) {\n      return;\n    }\n    if (!nextValue.some(v => (0, _utils2.shallowEqual)(v, focusItemValue))) {\n      nextValue.push(focusItemValue);\n    } else {\n      (0, _remove.default)(nextValue, itemVal => (0, _utils2.shallowEqual)(itemVal, focusItemValue));\n    }\n    const focusItem = data.find(item => (0, _utils2.shallowEqual)(item === null || item === void 0 ? void 0 : item[valueKey], focusItemValue));\n    setValue(nextValue);\n    handleSelect(nextValue, focusItem, event);\n    handleChangeValue(nextValue, event);\n  };\n  const onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)({\n    toggle: !focusItemValue || !active,\n    trigger,\n    target,\n    overlay,\n    searchInput,\n    active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter,\n    onMenuPressBackspace: handleClean,\n    ...rest\n  });\n  const handleSelect = (0, _hooks.useEventCallback)((nextItemValue, item, event) => {\n    onSelect === null || onSelect === void 0 || onSelect(nextItemValue, item, event);\n  });\n  const handleItemSelect = (0, _hooks.useEventCallback)((nextItemValue, item, event, checked) => {\n    const nextValue = (0, _clone.default)(value);\n    if (checked) {\n      nextValue.push(nextItemValue);\n    } else {\n      (0, _remove.default)(nextValue, itemVal => (0, _utils2.shallowEqual)(itemVal, nextItemValue));\n    }\n    setValue(nextValue);\n    setFocusItemValue(nextItemValue);\n    handleSelect(nextValue, item, event);\n    handleChangeValue(nextValue, event);\n  });\n  const handleEnter = (0, _hooks.useEventCallback)(() => {\n    setActive(true);\n  });\n  const handleExit = (0, _hooks.useEventCallback)(() => {\n    resetSearch();\n    setFocusItemValue(null);\n    setActive(false);\n  });\n  const selectedItems = data.filter(item => value === null || value === void 0 ? void 0 : value.some(val => (0, _utils2.shallowEqual)(item[valueKey], val))) || [];\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  let hasValue = selectedItems.length > 0 || (value === null || value === void 0 ? void 0 : value.length) > 0 && (0, _isFunction.default)(renderValue);\n  const {\n    prefix,\n    merge\n  } = (0, _hooks.useStyles)(classPrefix);\n  let 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      badgeSize: size,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 266,\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  const renderPopup = (positionProps, speakerRef) => {\n    const {\n      className\n    } = positionProps;\n    const classes = merge(className, popupClassName, prefix('check-menu'));\n    let items = filteredData;\n    let filteredStickyItems = [];\n    if (stickyItems) {\n      filteredStickyItems = (0, _utils.filterNodesOfTree)(stickyItems, item => checkShouldDisplay(item));\n      items = (0, _utils.filterNodesOfTree)(data, item => {\n        return checkShouldDisplay(item) && !stickyItems.some(v => v[valueKey] === item[valueKey]);\n      });\n    }\n\n    // Create a tree structure data when set `groupBy`\n    if (groupBy) {\n      items = (0, _utils2.getDataGroupBy)(items, groupBy, sort);\n    } else if (typeof sort === 'function') {\n      items = items.sort(sort(false));\n    }\n    const listbox = 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      renderOptionGroup: renderOptionGroup,\n      renderOption: renderOption,\n      maxHeight: listboxMaxHeight,\n      classPrefix: 'picker-check-menu',\n      listItemAs: _Picker.ListCheckItem,\n      activeItemValues: value,\n      focusItemValue: focusItemValue,\n      data: [...filteredStickyItems, ...items],\n      groupBy: groupBy,\n      onSelect: handleItemSelect,\n      onGroupTitleClick: onGroupTitleClick,\n      virtualized: virtualized,\n      query: searchKeyword,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 309,\n        columnNumber: 11\n      }\n    }) : /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix`none`,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 330,\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: popupAutoWidth,\n      className: classes,\n      style: popupStyle,\n      onKeyDown: onPickerKeyDown,\n      target: trigger,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 334,\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: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 343,\n        columnNumber: 13\n      }\n    }), renderListbox ? renderListbox(listbox) : listbox, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  const triggerProps = {\n    ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n    onEnter: (0, _utils2.createChainedFunction)(initStickyItems, handleEnter, onEnter),\n    onExit: (0, _utils2.createChainedFunction)(handleExit, onExit)\n  };\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    as: as,\n    id: id,\n    multiple: true,\n    name: \"check\",\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    triggerProps: triggerProps,\n    ref: trigger,\n    placement: placement,\n    speaker: renderPopup,\n    rootRef: root,\n    style: style,\n    classPrefix: classPrefix,\n    className: className,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 363,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({\n    ref: target,\n    appearance: appearance,\n    disabled: disabled,\n    onClean: handleClean,\n    onKeyDown: onPickerKeyDown,\n    as: toggleAs,\n    cleanable: cleanable && !disabled,\n    countable: countable,\n    hasValue: hasValue,\n    active: active,\n    placement: placement,\n    inputValue: value,\n    focusItemValue: focusItemValue,\n    size: size\n  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 380,\n      columnNumber: 9\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder)));\n});\nCheckPicker.displayName = 'CheckPicker';\nvar _default = exports[\"default\"] = CheckPicker;\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\");\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 _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 _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _utils = __webpack_require__(/*! ../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckPicker/CheckPicker.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\nconst emptyArray = [];\n/**\n * A component for selecting checkable items in a dropdown list.\n * @see https://rsuitejs.com/components/check-picker\n */\nconst CheckPicker = (0, _utils2.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('CheckPicker', props);\n  const {\n    appearance = 'default',\n    as,\n    block,\n    className,\n    cleanable = true,\n    classPrefix = 'picker',\n    countable = true,\n    data = emptyArray,\n    defaultValue,\n    disabled,\n    disabledItemValues = emptyArray,\n    groupBy,\n    id,\n    labelKey = 'label',\n    listProps,\n    listboxMaxHeight = 320,\n    locale,\n    placeholder,\n    placement = 'bottomStart',\n    popupAutoWidth = true,\n    popupClassName,\n    popupStyle,\n    searchable = true,\n    sticky,\n    style,\n    size,\n    toggleAs,\n    value: valueProp,\n    valueKey = 'value',\n    virtualized,\n    sort,\n    searchBy,\n    renderOption,\n    renderOptionGroup,\n    renderListbox,\n    renderValue,\n    renderExtraFooter,\n    onGroupTitleClick,\n    onSearch,\n    onEnter,\n    onExit,\n    onClean,\n    onChange,\n    onSelect,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    trigger,\n    root,\n    target,\n    overlay,\n    list,\n    searchInput\n  } = (0, _Picker.usePickerRef)(ref);\n  const [value, setValue] = (0, _hooks.useControlled)(valueProp, defaultValue || []);\n\n  // Used to hover the focuse item  when trigger `onKeydown`\n  const {\n    focusItemValue,\n    setFocusItemValue,\n    onKeyDown: onFocusItem\n  } = (0, _Picker.useFocusItemValue)(value === null || value === void 0 ? void 0 : value[0], {\n    data,\n    valueKey,\n    target: () => overlay.current\n  });\n  const handleSearchCallback = (0, _hooks.useEventCallback)((searchKeyword, filteredData, event) => {\n    var _filteredData$;\n    // The first option after filtering is the focus.\n    setFocusItemValue(filteredData === null || filteredData === void 0 || (_filteredData$ = filteredData[0]) === null || _filteredData$ === void 0 ? void 0 : _filteredData$[valueKey]);\n    onSearch === null || onSearch === void 0 || onSearch(searchKeyword, event);\n  });\n\n  // Use search keywords to filter options.\n  const {\n    searchKeyword,\n    filteredData,\n    handleSearch,\n    resetSearch,\n    checkShouldDisplay\n  } = (0, _Picker.useSearch)(data, {\n    labelKey,\n    searchBy,\n    callback: handleSearchCallback\n  });\n\n  // Use component active state to support keyboard events.\n  const [active, setActive] = (0, _react.useState)(false);\n\n  // A list of shortcut options.\n  // when opened again, the selected options are displayed at the top.\n  const [stickyItems, setStickyItems] = (0, _react.useState)([]);\n  const initStickyItems = () => {\n    if (!sticky) {\n      return;\n    }\n    let nextStickyItems = [];\n    if (data && value.length) {\n      nextStickyItems = data.filter(item => {\n        return value.some(v => v === item[valueKey]);\n      });\n    }\n    setStickyItems(nextStickyItems);\n  };\n  const handleChangeValue = (0, _hooks.useEventCallback)((value, event) => {\n    onChange === null || onChange === void 0 || onChange(value, event);\n  });\n  const handleClean = (0, _hooks.useEventCallback)(event => {\n    if (disabled || !cleanable) {\n      return;\n    }\n    setValue([]);\n    onClean === null || onClean === void 0 || onClean(event);\n    handleChangeValue([], event);\n  });\n  const handleMenuPressEnter = event => {\n    const nextValue = (0, _clone.default)(value);\n    if (!focusItemValue) {\n      return;\n    }\n    if (!nextValue.some(v => (0, _utils2.shallowEqual)(v, focusItemValue))) {\n      nextValue.push(focusItemValue);\n    } else {\n      (0, _remove.default)(nextValue, itemVal => (0, _utils2.shallowEqual)(itemVal, focusItemValue));\n    }\n    const focusItem = data.find(item => (0, _utils2.shallowEqual)(item === null || item === void 0 ? void 0 : item[valueKey], focusItemValue));\n    setValue(nextValue);\n    handleSelect(nextValue, focusItem, event);\n    handleChangeValue(nextValue, event);\n  };\n  const onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)({\n    toggle: !focusItemValue || !active,\n    trigger,\n    target,\n    overlay,\n    searchInput,\n    active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter,\n    onMenuPressBackspace: handleClean,\n    ...rest\n  });\n  const handleSelect = (0, _hooks.useEventCallback)((nextItemValue, item, event) => {\n    onSelect === null || onSelect === void 0 || onSelect(nextItemValue, item, event);\n  });\n  const handleItemSelect = (0, _hooks.useEventCallback)((nextItemValue, item, event, checked) => {\n    const nextValue = (0, _clone.default)(value);\n    if (checked) {\n      nextValue.push(nextItemValue);\n    } else {\n      (0, _remove.default)(nextValue, itemVal => (0, _utils2.shallowEqual)(itemVal, nextItemValue));\n    }\n    setValue(nextValue);\n    setFocusItemValue(nextItemValue);\n    handleSelect(nextValue, item, event);\n    handleChangeValue(nextValue, event);\n  });\n  const handleEnter = (0, _hooks.useEventCallback)(() => {\n    setActive(true);\n  });\n  const handleExit = (0, _hooks.useEventCallback)(() => {\n    resetSearch();\n    setFocusItemValue(null);\n    setActive(false);\n  });\n  const selectedItems = data.filter(item => value === null || value === void 0 ? void 0 : value.some(val => (0, _utils2.shallowEqual)(item[valueKey], val))) || [];\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  let hasValue = selectedItems.length > 0 || (value === null || value === void 0 ? void 0 : value.length) > 0 && (0, _isFunction.default)(renderValue);\n  const {\n    prefix,\n    merge\n  } = (0, _hooks.useStyles)(classPrefix);\n  let 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      badgeSize: size,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 266,\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  const renderPopup = (positionProps, speakerRef) => {\n    const {\n      className\n    } = positionProps;\n    const classes = merge(className, popupClassName, prefix('check-menu'));\n    let items = filteredData;\n    let filteredStickyItems = [];\n    if (stickyItems) {\n      filteredStickyItems = (0, _utils.filterNodesOfTree)(stickyItems, item => checkShouldDisplay(item));\n      items = (0, _utils.filterNodesOfTree)(data, item => {\n        return checkShouldDisplay(item) && !stickyItems.some(v => v[valueKey] === item[valueKey]);\n      });\n    }\n\n    // Create a tree structure data when set `groupBy`\n    if (groupBy) {\n      items = (0, _utils2.getDataGroupBy)(items, groupBy, sort);\n    } else if (typeof sort === 'function') {\n      items = items.sort(sort(false));\n    }\n    const listbox = 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      renderOptionGroup: renderOptionGroup,\n      renderOption: renderOption,\n      maxHeight: listboxMaxHeight,\n      classPrefix: 'picker-check-menu',\n      listItemAs: _Picker.ListCheckItem,\n      activeItemValues: value,\n      focusItemValue: focusItemValue,\n      data: [...filteredStickyItems, ...items],\n      groupBy: groupBy,\n      onSelect: handleItemSelect,\n      onGroupTitleClick: onGroupTitleClick,\n      virtualized: virtualized,\n      query: searchKeyword,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 309,\n        columnNumber: 11\n      }\n    }) : /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix`none`,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 330,\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: popupAutoWidth,\n      className: classes,\n      style: popupStyle,\n      onKeyDown: onPickerKeyDown,\n      target: trigger,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 334,\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: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 343,\n        columnNumber: 13\n      }\n    }), renderListbox ? renderListbox(listbox) : listbox, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  const triggerProps = {\n    ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n    onEnter: (0, _utils2.createChainedFunction)(initStickyItems, handleEnter, onEnter),\n    onExit: (0, _utils2.createChainedFunction)(handleExit, onExit)\n  };\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    as: as,\n    id: id,\n    multiple: true,\n    pickerType: \"check\",\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    triggerProps: triggerProps,\n    ref: trigger,\n    placement: placement,\n    speaker: renderPopup,\n    rootRef: root,\n    style: style,\n    classPrefix: classPrefix,\n    className: className,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 363,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({\n    ref: target,\n    appearance: appearance,\n    disabled: disabled,\n    onClean: handleClean,\n    onKeyDown: onPickerKeyDown,\n    as: toggleAs,\n    cleanable: cleanable && !disabled,\n    countable: countable,\n    hasValue: hasValue,\n    active: active,\n    placement: placement,\n    inputValue: value,\n    focusItemValue: focusItemValue,\n    size: size\n  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 380,\n      columnNumber: 9\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder)));\n});\nCheckPicker.displayName = 'CheckPicker';\nvar _default = exports[\"default\"] = CheckPicker;\n\n//# sourceURL=webpack://rsuite/./src/CheckPicker/CheckPicker.tsx?");
 
 /***/ }),
 
@@ -2039,7 +2039,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 _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _useTreeValue = _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 _useTreeWithChildren = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useTreeWithChildren */ \"./src/Tree/hooks/useTreeWithChildren.ts\"));\nvar _useExpandTree = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useExpandTree */ \"./src/Tree/hooks/useExpandTree.ts\"));\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../internals/Tree/TreeProvider */ \"./src/internals/Tree/TreeProvider.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckTree/CheckTree.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\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 */\nconst CheckTree = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('CheckTree', props);\n  const {\n    value: controlledValue,\n    data,\n    defaultValue,\n    defaultExpandAll = false,\n    defaultExpandItemValues = [],\n    uncheckableItemValues,\n    expandItemValues: controlledExpandItemValues,\n    childrenKey = 'children',\n    labelKey = 'label',\n    valueKey = 'value',\n    virtualized,\n    cascade = true,\n    scrollShadow,\n    renderTreeIcon,\n    renderTreeNode,\n    getChildren,\n    onExpand,\n    onChange,\n    ...rest\n  } = propsWithDefaults;\n  const [value, setValue] = (0, _useTreeValue.default)(controlledValue, {\n    defaultValue,\n    uncheckableItemValues\n  });\n  const itemDataKeys = {\n    childrenKey,\n    labelKey,\n    valueKey\n  };\n  const {\n    treeData,\n    loadingNodeValues,\n    appendChild\n  } = (0, _useTreeWithChildren.default)(data, itemDataKeys);\n  const {\n    expandItemValues,\n    handleExpandTreeNode\n  } = (0, _useExpandTree.default)(data, {\n    ...itemDataKeys,\n    defaultExpandAll,\n    defaultExpandItemValues,\n    controlledExpandItemValues,\n    onExpand,\n    getChildren,\n    appendChild\n  });\n  const flattenedNodes = (0, _useFlattenTree.default)(treeData, {\n    ...itemDataKeys,\n    uncheckableItemValues,\n    multiple: true,\n    cascade,\n    value\n  });\n  const handleChange = (0, _hooks.useEventCallback)((nextValue, event) => {\n    setValue(nextValue);\n    onChange === null || onChange === void 0 || onChange(nextValue, event);\n  });\n  const treeContext = (0, _react.useMemo)(() => ({\n    props: {\n      labelKey,\n      valueKey,\n      childrenKey,\n      virtualized,\n      scrollShadow,\n      renderTreeIcon,\n      renderTreeNode\n    }\n  }), [childrenKey, labelKey, valueKey, virtualized, scrollShadow, renderTreeIcon, renderTreeNode]);\n  return /*#__PURE__*/_react.default.createElement(_TreeProvider.TreeProvider, {\n    value: treeContext,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 100,\n      columnNumber: 5\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    loadingNodeValues: loadingNodeValues,\n    flattenedNodes: flattenedNodes,\n    uncheckableItemValues: uncheckableItemValues,\n    expandItemValues: expandItemValues,\n    onChange: handleChange,\n    onExpand: handleExpandTreeNode,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 101,\n      columnNumber: 7\n    }\n  })));\n});\nCheckTree.displayName = 'CheckTree';\nvar _default = exports[\"default\"] = CheckTree;\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/CheckTree.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 = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _useTreeValue = _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 _useTreeWithChildren = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useTreeWithChildren */ \"./src/Tree/hooks/useTreeWithChildren.ts\"));\nvar _useExpandTree = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useExpandTree */ \"./src/Tree/hooks/useExpandTree.ts\"));\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../internals/Tree/TreeProvider */ \"./src/internals/Tree/TreeProvider.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckTree/CheckTree.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\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 */\nconst CheckTree = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('CheckTree', props);\n  const {\n    value: controlledValue,\n    data,\n    defaultValue,\n    defaultExpandAll = false,\n    defaultExpandItemValues = [],\n    uncheckableItemValues,\n    disabledItemValues,\n    expandItemValues: controlledExpandItemValues,\n    childrenKey = 'children',\n    labelKey = 'label',\n    valueKey = 'value',\n    virtualized,\n    cascade = true,\n    scrollShadow,\n    renderTreeIcon,\n    renderTreeNode,\n    getChildren,\n    onExpand,\n    onChange,\n    ...rest\n  } = propsWithDefaults;\n  const [value, setValue] = (0, _useTreeValue.default)(controlledValue, {\n    defaultValue,\n    uncheckableItemValues\n  });\n  const itemDataKeys = {\n    childrenKey,\n    labelKey,\n    valueKey\n  };\n  const {\n    treeData,\n    loadingNodeValues,\n    appendChild\n  } = (0, _useTreeWithChildren.default)(data, itemDataKeys);\n  const {\n    expandItemValues,\n    handleExpandTreeNode\n  } = (0, _useExpandTree.default)(data, {\n    ...itemDataKeys,\n    defaultExpandAll,\n    defaultExpandItemValues,\n    controlledExpandItemValues,\n    onExpand,\n    getChildren,\n    appendChild\n  });\n  const flattenedNodes = (0, _useFlattenTree.default)(treeData, {\n    ...itemDataKeys,\n    uncheckableItemValues,\n    disabledItemValues,\n    multiple: true,\n    cascade,\n    value\n  });\n  const handleChange = (0, _hooks.useEventCallback)((nextValue, event) => {\n    setValue(nextValue);\n    onChange === null || onChange === void 0 || onChange(nextValue, event);\n  });\n  const treeContext = (0, _react.useMemo)(() => ({\n    props: {\n      labelKey,\n      valueKey,\n      childrenKey,\n      virtualized,\n      scrollShadow,\n      renderTreeIcon,\n      renderTreeNode\n    }\n  }), [childrenKey, labelKey, valueKey, virtualized, scrollShadow, renderTreeIcon, renderTreeNode]);\n  return /*#__PURE__*/_react.default.createElement(_TreeProvider.TreeProvider, {\n    value: treeContext,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 102,\n      columnNumber: 5\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    loadingNodeValues: loadingNodeValues,\n    flattenedNodes: flattenedNodes,\n    uncheckableItemValues: uncheckableItemValues,\n    disabledItemValues: disabledItemValues,\n    expandItemValues: expandItemValues,\n    onChange: handleChange,\n    onExpand: handleExpandTreeNode,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 103,\n      columnNumber: 7\n    }\n  })));\n});\nCheckTree.displayName = 'CheckTree';\nvar _default = exports[\"default\"] = CheckTree;\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/CheckTree.tsx?");
 
 /***/ }),
 
@@ -2061,7 +2061,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 _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _CheckTreeNode = _interopRequireDefault(__webpack_require__(/*! ./CheckTreeNode */ \"./src/CheckTree/CheckTreeNode.tsx\"));\nvar _IndentLine = _interopRequireDefault(__webpack_require__(/*! ../Tree/IndentLine */ \"./src/Tree/IndentLine.tsx\"));\nvar _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _Box = _interopRequireDefault(__webpack_require__(/*! ../internals/Box */ \"./src/internals/Box/index.tsx\"));\nvar _useTreeSearch = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useTreeSearch */ \"./src/Tree/hooks/useTreeSearch.ts\"));\nvar _useFocusTree = _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 _useTreeCheckState = _interopRequireDefault(__webpack_require__(/*! ./hooks/useTreeCheckState */ \"./src/CheckTree/hooks/useTreeCheckState.ts\"));\nvar _useTreeNodeProps = _interopRequireDefault(__webpack_require__(/*! ./hooks/useTreeNodeProps */ \"./src/CheckTree/hooks/useTreeNodeProps.tsx\"));\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _Windowing = __webpack_require__(/*! ../internals/Windowing */ \"./src/internals/Windowing/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/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 _utils3 = __webpack_require__(/*! ./utils */ \"./src/CheckTree/utils.ts\");\nvar _utils4 = __webpack_require__(/*! ../Tree/utils */ \"./src/Tree/utils/index.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../internals/Tree/TreeProvider */ \"./src/internals/Tree/TreeProvider.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckTree/CheckTreeView.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\n/**\n * Props for the CheckTreeView component.\n */\n\nconst CheckTreeView = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    as,\n    className,\n    classPrefix = 'check-tree',\n    cascade = true,\n    data = [],\n    disabledItemValues = [],\n    expandItemValues = [],\n    height = 360,\n    locale: overrideLocale,\n    listProps,\n    listRef,\n    style,\n    searchKeyword,\n    showIndentLine,\n    searchable,\n    searchInputRef,\n    uncheckableItemValues = [],\n    loadingNodeValues = [],\n    flattenedNodes = {},\n    searchBy,\n    onChange,\n    onSearch,\n    onSelect,\n    onSelectItem,\n    onScroll,\n    onExpand,\n    onFocusItem,\n    ...rest\n  } = props;\n  const {\n    getLocale\n  } = (0, _hooks.useCustom)();\n  const {\n    searchPlaceholder,\n    noResultsText\n  } = getLocale('Combobox', overrideLocale);\n  const {\n    childrenKey,\n    valueKey,\n    virtualized,\n    scrollShadow\n  } = (0, _TreeProvider.useTreeContextProps)();\n  const {\n    prefix,\n    merge,\n    withPrefix\n  } = (0, _hooks.useStyles)(classPrefix);\n  const {\n    getCheckedValues\n  } = (0, _useTreeCheckState.default)({\n    cascade,\n    flattenedNodes,\n    uncheckableItemValues\n  });\n  const handleSearchCallback = (value, _data, event) => {\n    onSearch === null || onSearch === void 0 || onSearch(value, event);\n  };\n  const {\n    filteredData,\n    keyword,\n    setFilteredData,\n    handleSearch\n  } = (0, _useTreeSearch.default)({\n    callback: handleSearchCallback,\n    data,\n    searchKeyword,\n    searchBy\n  });\n  const {\n    focusItemValue,\n    setFocusItemValue,\n    onTreeKeydown,\n    saveTreeNodeRef\n  } = (0, _useFocusTree.default)({\n    filteredData,\n    disabledItemValues,\n    expandItemValues,\n    searchKeyword: keyword,\n    flattenedNodes,\n    onFocused: onFocusItem,\n    onExpand\n  });\n  const transformation = (0, _useVirtualizedTreeData.default)(flattenedNodes, filteredData, {\n    cascade,\n    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  const getFormattedNodes = render => {\n    if (virtualized) {\n      return transformation().filter(item => item.visible);\n    }\n    return (0, _utils3.getFormattedTree)(flattenedNodes, filteredData, {\n      childrenKey,\n      cascade\n    }).map(node => render === null || render === void 0 ? void 0 : render(node, 1)).filter(item => item);\n  };\n  const getTreeNodeProps = (0, _useTreeNodeProps.default)({\n    uncheckableItemValues,\n    disabledItemValues,\n    loadingNodeValues,\n    focusItemValue,\n    flattenedNodes,\n    keyword\n  });\n  (0, _react.useEffect)(() => {\n    setFilteredData(data, keyword);\n  }, [data, keyword, setFilteredData]);\n\n  // TODO-Doma\n  // Replace `getKeyParentMap` with `getParentMap`\n  const itemParentMap = (0, _react.useMemo)(() => (0, _utils2.getKeyParentMap)(data, node => node[valueKey], node => node[childrenKey]), [childrenKey, data, valueKey]);\n  const handleSelect = (0, _hooks.useEventCallback)((node, event) => {\n    const currentNode = node.refKey ? flattenedNodes[node.refKey] : null;\n    if (!node || !currentNode) {\n      return;\n    }\n    const checkedValues = getCheckedValues(node, !currentNode.check);\n    const path = (0, _utils2.getPathTowardsItem)(node, item => itemParentMap.get(item[valueKey]));\n    setFocusItemValue(node[valueKey]);\n    onChange === null || onChange === void 0 || onChange(checkedValues, event);\n    onSelect === null || onSelect === void 0 || onSelect(node, checkedValues, event);\n    onSelectItem === null || onSelectItem === void 0 || onSelectItem(node, path);\n  });\n  const selectActiveItem = event => {\n    if ((0, _isNil.default)(focusItemValue)) return;\n    const activeItem = (0, _utils4.getActiveItem)(focusItemValue, flattenedNodes, valueKey);\n    if (!(0, _utils3.isNodeUncheckable)(activeItem, {\n      uncheckableItemValues,\n      valueKey\n    }) && activeItem !== null) {\n      handleSelect(activeItem, event);\n    }\n  };\n  const handleTreeKeyDown = (0, _hooks.useEventCallback)(event => {\n    onTreeKeydown(event);\n    (0, _Picker.onMenuKeyDown)(event, {\n      enter: selectActiveItem\n    });\n  });\n  const renderNode = (node, layer) => {\n    const {\n      visible,\n      refKey,\n      parent\n    } = node;\n\n    // when searching, all nodes should be expand\n    const expanded = (0, _utils4.isExpand)(keyword, expandItemValues.includes(node[valueKey]));\n    if (!visible) {\n      return null;\n    }\n    const children = node[childrenKey];\n    const hasChildren = keyword ? (0, _utils4.hasVisibleChildren)(node, childrenKey) : Boolean(children);\n    const treeNodeProps = {\n      // The spread operator does not copy non-enumerable properties,\n      // so we need to copy the `parent` property manually.\n      ...getTreeNodeProps({\n        ...node,\n        parent\n      }),\n      layer,\n      expanded,\n      hasChildren,\n      onSelect: handleSelect,\n      onExpand\n    };\n    if (hasChildren) {\n      layer += 1;\n      const childClassName = merge(prefix('node-children'), {\n        [prefix('node-expanded')]: expanded\n      });\n      const nodes = children || [];\n      return /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: childClassName,\n        key: node[valueKey],\n        __self: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 287,\n          columnNumber: 9\n        }\n      }, /*#__PURE__*/_react.default.createElement(_CheckTreeNode.default, (0, _extends2.default)({}, treeNodeProps, {\n        treeItemRef: ref => saveTreeNodeRef(ref, refKey),\n        __self: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 288,\n          columnNumber: 11\n        }\n      })), /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: prefix('group'),\n        role: \"group\",\n        __self: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 289,\n          columnNumber: 11\n        }\n      }, nodes.map(child => renderNode(child, layer)), showIndentLine && /*#__PURE__*/_react.default.createElement(_IndentLine.default, {\n        __self: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 291,\n          columnNumber: 32\n        }\n      })));\n    }\n    return /*#__PURE__*/_react.default.createElement(_CheckTreeNode.default, (0, _extends2.default)({\n      key: node[valueKey],\n      treeItemRef: ref => saveTreeNodeRef(ref, refKey)\n    }, treeNodeProps, {\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 298,\n        columnNumber: 7\n      }\n    }));\n  };\n  const renderVirtualListNode = ({\n    index,\n    style,\n    data\n  }) => {\n    const node = data[index];\n    const {\n      layer,\n      refKey,\n      visible,\n      hasChildren,\n      parent\n    } = node;\n    const expanded = (0, _utils4.isExpand)(keyword, expandItemValues.includes(node[valueKey]));\n    const treeNodeProps = {\n      // The spread operator does not copy non-enumerable properties,\n      // so we need to copy the `parent` property manually.\n      ...getTreeNodeProps({\n        ...node,\n        parent\n      }),\n      onSelect: handleSelect,\n      onExpand,\n      expanded,\n      layer,\n      hasChildren\n    };\n    return visible && /*#__PURE__*/_react.default.createElement(_CheckTreeNode.default, (0, _extends2.default)({\n      style: style,\n      ref: ref => saveTreeNodeRef(ref, refKey)\n    }, treeNodeProps, {\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 324,\n        columnNumber: 9\n      }\n    }));\n  };\n  const classes = merge(className, withPrefix({\n    'without-children': !(0, _utils3.hasGrandchild)(data, childrenKey),\n    virtualized\n  }));\n  const formattedNodes = getFormattedNodes(renderNode);\n  const treeNodesClass = merge(prefix('root'), {\n    [prefix('all-uncheckable')]: (0, _utils3.isEveryFirstLevelNodeUncheckable)(flattenedNodes, uncheckableItemValues, valueKey)\n  });\n  return /*#__PURE__*/_react.default.createElement(_Box.default, {\n    as: as,\n    ref: ref,\n    className: classes,\n    style: style,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 348,\n      columnNumber: 5\n    }\n  }, searchable ? /*#__PURE__*/_react.default.createElement(_SearchBox.default, {\n    placeholder: searchPlaceholder,\n    onChange: handleSearch,\n    value: keyword,\n    inputRef: searchInputRef,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 350,\n      columnNumber: 9\n    }\n  }) : null, keyword && formattedNodes.length === 0 ? /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('empty'),\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 359,\n      columnNumber: 9\n    }\n  }, 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    height: height,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 362,\n      columnNumber: 7\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: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 372,\n      columnNumber: 11\n    }\n  }, ({\n    height\n  }) => /*#__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    scrollShadow: scrollShadow\n  }, listProps, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 378,\n      columnNumber: 15\n    }\n  }), renderVirtualListNode)) : formattedNodes));\n});\nCheckTreeView.displayName = 'CheckTreeView';\nvar _default = exports[\"default\"] = CheckTreeView;\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/CheckTreeView.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 = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _CheckTreeNode = _interopRequireDefault(__webpack_require__(/*! ./CheckTreeNode */ \"./src/CheckTree/CheckTreeNode.tsx\"));\nvar _IndentLine = _interopRequireDefault(__webpack_require__(/*! ../Tree/IndentLine */ \"./src/Tree/IndentLine.tsx\"));\nvar _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _Box = _interopRequireDefault(__webpack_require__(/*! ../internals/Box */ \"./src/internals/Box/index.tsx\"));\nvar _useTreeSearch = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useTreeSearch */ \"./src/Tree/hooks/useTreeSearch.ts\"));\nvar _useFocusTree = _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 _useTreeCheckState = _interopRequireDefault(__webpack_require__(/*! ./hooks/useTreeCheckState */ \"./src/CheckTree/hooks/useTreeCheckState.ts\"));\nvar _useTreeNodeProps = _interopRequireDefault(__webpack_require__(/*! ./hooks/useTreeNodeProps */ \"./src/CheckTree/hooks/useTreeNodeProps.tsx\"));\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _Windowing = __webpack_require__(/*! ../internals/Windowing */ \"./src/internals/Windowing/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/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 _utils3 = __webpack_require__(/*! ./utils */ \"./src/CheckTree/utils.ts\");\nvar _utils4 = __webpack_require__(/*! ../Tree/utils */ \"./src/Tree/utils/index.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../internals/Tree/TreeProvider */ \"./src/internals/Tree/TreeProvider.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckTree/CheckTreeView.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\n/**\n * Props for the CheckTreeView component.\n */\n\nconst CheckTreeView = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    as,\n    className,\n    classPrefix = 'check-tree',\n    cascade = true,\n    data = [],\n    disabledItemValues = [],\n    expandItemValues = [],\n    height = 360,\n    locale: overrideLocale,\n    listProps,\n    listRef,\n    style,\n    searchKeyword,\n    showIndentLine,\n    searchable,\n    searchInputRef,\n    uncheckableItemValues = [],\n    loadingNodeValues = [],\n    flattenedNodes = {},\n    searchBy,\n    onChange,\n    onSearch,\n    onSelect,\n    onSelectItem,\n    onScroll,\n    onExpand,\n    onFocusItem,\n    ...rest\n  } = props;\n  const {\n    getLocale\n  } = (0, _hooks.useCustom)();\n  const {\n    searchPlaceholder,\n    noResultsText\n  } = getLocale('Combobox', overrideLocale);\n  const {\n    childrenKey,\n    valueKey,\n    virtualized,\n    scrollShadow\n  } = (0, _TreeProvider.useTreeContextProps)();\n  const {\n    prefix,\n    merge,\n    withPrefix\n  } = (0, _hooks.useStyles)(classPrefix);\n  const {\n    getCheckedValues\n  } = (0, _useTreeCheckState.default)({\n    cascade,\n    flattenedNodes,\n    uncheckableItemValues,\n    disabledItemValues\n  });\n  const handleSearchCallback = (value, _data, event) => {\n    onSearch === null || onSearch === void 0 || onSearch(value, event);\n  };\n  const {\n    filteredData,\n    keyword,\n    setFilteredData,\n    handleSearch\n  } = (0, _useTreeSearch.default)({\n    callback: handleSearchCallback,\n    data,\n    searchKeyword,\n    searchBy\n  });\n  const {\n    focusItemValue,\n    setFocusItemValue,\n    onTreeKeydown,\n    saveTreeNodeRef\n  } = (0, _useFocusTree.default)({\n    filteredData,\n    disabledItemValues,\n    expandItemValues,\n    searchKeyword: keyword,\n    flattenedNodes,\n    onFocused: onFocusItem,\n    onExpand\n  });\n  const transformation = (0, _useVirtualizedTreeData.default)(flattenedNodes, filteredData, {\n    cascade,\n    expandItemValues,\n    searchKeyword: keyword,\n    disabledItemValues\n  });\n\n  /**\n   * Get formatted nodes for render tree\n   * @params render - renderNode function. only used when virtualized setting false\n   */\n  const getFormattedNodes = render => {\n    if (virtualized) {\n      return transformation().filter(item => item.visible);\n    }\n    return (0, _utils3.getFormattedTree)(flattenedNodes, filteredData, {\n      childrenKey,\n      cascade,\n      disabledItemValues,\n      valueKey\n    }).map(node => render === null || render === void 0 ? void 0 : render(node, 1)).filter(item => item);\n  };\n  const getTreeNodeProps = (0, _useTreeNodeProps.default)({\n    uncheckableItemValues,\n    disabledItemValues,\n    loadingNodeValues,\n    focusItemValue,\n    flattenedNodes,\n    keyword\n  });\n  (0, _react.useEffect)(() => {\n    setFilteredData(data, keyword);\n  }, [data, keyword, setFilteredData]);\n\n  // TODO-Doma\n  // Replace `getKeyParentMap` with `getParentMap`\n  const itemParentMap = (0, _react.useMemo)(() => (0, _utils2.getKeyParentMap)(data, node => node[valueKey], node => node[childrenKey]), [childrenKey, data, valueKey]);\n  const handleSelect = (0, _hooks.useEventCallback)((node, event) => {\n    const currentNode = node.refKey ? flattenedNodes[node.refKey] : null;\n    if (!node || !currentNode) {\n      return;\n    }\n    const checkedValues = getCheckedValues(node, !currentNode.check);\n    const path = (0, _utils2.getPathTowardsItem)(node, item => itemParentMap.get(item[valueKey]));\n    setFocusItemValue(node[valueKey]);\n    onChange === null || onChange === void 0 || onChange(checkedValues, event);\n    onSelect === null || onSelect === void 0 || onSelect(node, checkedValues, event);\n    onSelectItem === null || onSelectItem === void 0 || onSelectItem(node, path);\n  });\n  const selectActiveItem = event => {\n    if ((0, _isNil.default)(focusItemValue)) return;\n    const activeItem = (0, _utils4.getActiveItem)(focusItemValue, flattenedNodes, valueKey);\n    if (!(0, _utils3.isNodeUncheckable)(activeItem, {\n      uncheckableItemValues,\n      valueKey\n    }) && activeItem !== null) {\n      handleSelect(activeItem, event);\n    }\n  };\n  const handleTreeKeyDown = (0, _hooks.useEventCallback)(event => {\n    onTreeKeydown(event);\n    (0, _Picker.onMenuKeyDown)(event, {\n      enter: selectActiveItem\n    });\n  });\n  const renderNode = (node, layer) => {\n    const {\n      visible,\n      refKey,\n      parent\n    } = node;\n\n    // when searching, all nodes should be expand\n    const expanded = (0, _utils4.isExpand)(keyword, expandItemValues.includes(node[valueKey]));\n    if (!visible) {\n      return null;\n    }\n    const children = node[childrenKey];\n    const hasChildren = keyword ? (0, _utils4.hasVisibleChildren)(node, childrenKey) : Boolean(children);\n    const treeNodeProps = {\n      // The spread operator does not copy non-enumerable properties,\n      // so we need to copy the `parent` property manually.\n      ...getTreeNodeProps({\n        ...node,\n        parent\n      }),\n      layer,\n      expanded,\n      hasChildren,\n      onSelect: handleSelect,\n      onExpand\n    };\n    if (hasChildren) {\n      layer += 1;\n      const childClassName = merge(prefix('node-children'), {\n        [prefix('node-expanded')]: expanded\n      });\n      const nodes = children || [];\n      return /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: childClassName,\n        key: node[valueKey],\n        __self: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 294,\n          columnNumber: 9\n        }\n      }, /*#__PURE__*/_react.default.createElement(_CheckTreeNode.default, (0, _extends2.default)({}, treeNodeProps, {\n        treeItemRef: ref => saveTreeNodeRef(ref, refKey),\n        __self: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 295,\n          columnNumber: 11\n        }\n      })), /*#__PURE__*/_react.default.createElement(\"div\", {\n        className: prefix('group'),\n        role: \"group\",\n        __self: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 296,\n          columnNumber: 11\n        }\n      }, nodes.map(child => renderNode(child, layer)), showIndentLine && /*#__PURE__*/_react.default.createElement(_IndentLine.default, {\n        __self: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 298,\n          columnNumber: 32\n        }\n      })));\n    }\n    return /*#__PURE__*/_react.default.createElement(_CheckTreeNode.default, (0, _extends2.default)({\n      key: node[valueKey],\n      treeItemRef: ref => saveTreeNodeRef(ref, refKey)\n    }, treeNodeProps, {\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 305,\n        columnNumber: 7\n      }\n    }));\n  };\n  const renderVirtualListNode = ({\n    index,\n    style,\n    data\n  }) => {\n    const node = data[index];\n    const {\n      layer,\n      refKey,\n      visible,\n      hasChildren,\n      parent\n    } = node;\n    const expanded = (0, _utils4.isExpand)(keyword, expandItemValues.includes(node[valueKey]));\n    const treeNodeProps = {\n      // The spread operator does not copy non-enumerable properties,\n      // so we need to copy the `parent` property manually.\n      ...getTreeNodeProps({\n        ...node,\n        parent\n      }),\n      onSelect: handleSelect,\n      onExpand,\n      expanded,\n      layer,\n      hasChildren\n    };\n    return visible && /*#__PURE__*/_react.default.createElement(_CheckTreeNode.default, (0, _extends2.default)({\n      style: style,\n      ref: ref => saveTreeNodeRef(ref, refKey)\n    }, treeNodeProps, {\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 331,\n        columnNumber: 9\n      }\n    }));\n  };\n  const classes = merge(className, withPrefix({\n    'without-children': !(0, _utils3.hasGrandchild)(data, childrenKey),\n    virtualized\n  }));\n  const formattedNodes = getFormattedNodes(renderNode);\n  const treeNodesClass = merge(prefix('root'), {\n    [prefix('all-uncheckable')]: (0, _utils3.isEveryFirstLevelNodeUncheckable)(flattenedNodes, uncheckableItemValues, valueKey)\n  });\n  return /*#__PURE__*/_react.default.createElement(_Box.default, {\n    as: as,\n    ref: ref,\n    className: classes,\n    style: style,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 355,\n      columnNumber: 5\n    }\n  }, searchable ? /*#__PURE__*/_react.default.createElement(_SearchBox.default, {\n    placeholder: searchPlaceholder,\n    onChange: handleSearch,\n    value: keyword,\n    inputRef: searchInputRef,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 357,\n      columnNumber: 9\n    }\n  }) : null, keyword && formattedNodes.length === 0 ? /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix('empty'),\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 366,\n      columnNumber: 9\n    }\n  }, 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    height: height,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 369,\n      columnNumber: 7\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: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 379,\n      columnNumber: 11\n    }\n  }, ({\n    height\n  }) => /*#__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    scrollShadow: scrollShadow\n  }, listProps, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 385,\n      columnNumber: 15\n    }\n  }), renderVirtualListNode)) : formattedNodes));\n});\nCheckTreeView.displayName = 'CheckTreeView';\nvar _default = exports[\"default\"] = CheckTreeView;\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/CheckTreeView.tsx?");
 
 /***/ }),
 
@@ -2072,7 +2072,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 _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _cloneDeep = _interopRequireDefault(__webpack_require__(/*! lodash/cloneDeep */ \"./node_modules/lodash/cloneDeep.js\"));\nvar _hooks = __webpack_require__(/*! ../../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../../internals/Tree/TreeProvider */ \"./src/internals/Tree/TreeProvider.tsx\");\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/CheckTree/utils.ts\");\nfunction useTreeCheckState(props) {\n  const {\n    cascade,\n    flattenedNodes,\n    uncheckableItemValues\n  } = props;\n  const {\n    valueKey,\n    childrenKey\n  } = (0, _TreeProvider.useItemDataKeys)();\n  const checkParentNode = (0, _hooks.useEventCallback)((nodes, node, checked) => {\n    const 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, _utils.isEveryChildChecked)(currentNode, {\n          nodes,\n          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  const checkChildNode = (0, _hooks.useEventCallback)((nodes, node, isChecked) => {\n    const 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(child => {\n        checkChildNode(nodes, child, isChecked);\n      });\n    }\n  });\n  const getCheckedValuesByParent = (0, _react.useCallback)(nodes => {\n    const values = [];\n    for (const key in nodes) {\n      const currentNode = nodes[key];\n      if (!(0, _isNil.default)(currentNode.parent) && !(0, _isNil.default)(currentNode.parent.refKey)) {\n        const 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  const getCheckedValues = (0, _hooks.useEventCallback)((node, isChecked) => {\n    const nodes = (0, _cloneDeep.default)(flattenedNodes);\n    checkChildNode(nodes, node, isChecked);\n    if (node.parent) {\n      checkParentNode(nodes, node.parent, isChecked);\n    }\n    const values = getCheckedValuesByParent(nodes);\n    return values.filter(v => !uncheckableItemValues.includes(v));\n  });\n  return {\n    getCheckedValues\n  };\n}\nvar _default = exports[\"default\"] = useTreeCheckState;\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/hooks/useTreeCheckState.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 _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _cloneDeep = _interopRequireDefault(__webpack_require__(/*! lodash/cloneDeep */ \"./node_modules/lodash/cloneDeep.js\"));\nvar _hooks = __webpack_require__(/*! ../../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../../internals/Tree/TreeProvider */ \"./src/internals/Tree/TreeProvider.tsx\");\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/CheckTree/utils.ts\");\nfunction useTreeCheckState(props) {\n  const {\n    cascade,\n    flattenedNodes,\n    uncheckableItemValues,\n    disabledItemValues = []\n  } = props;\n  const {\n    valueKey,\n    childrenKey\n  } = (0, _TreeProvider.useItemDataKeys)();\n  const checkParentNode = (0, _hooks.useEventCallback)((nodes, node, checked) => {\n    const 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, _utils.isEveryChildChecked)(currentNode, {\n          nodes,\n          childrenKey,\n          disabledItemValues,\n          valueKey\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\n  /**\n   * Recursively checks if a node has any disabled descendants.\n   * This is used to determine if a parent node's checkAll state should be true.\n   * If any descendant is disabled, checkAll must be false because not all descendants can be checked.\n   * @param nodes - The flattened tree node map\n   * @param node - The node to check for disabled descendants\n   * @returns true if any descendant (at any depth) is disabled, false otherwise\n   */\n  const hasDisabledDescendant = (0, _hooks.useEventCallback)((nodes, node) => {\n    if (!node[childrenKey] || !node[childrenKey].length) {\n      return false;\n    }\n    return node[childrenKey].some(child => {\n      const isChildDisabled = (0, _utils.getDisabledState)(nodes, child, {\n        disabledItemValues,\n        valueKey\n      });\n      if (isChildDisabled) {\n        return true;\n      }\n      // Recursively check descendants\n      return hasDisabledDescendant(nodes, child);\n    });\n  });\n  const checkChildNode = (0, _hooks.useEventCallback)((nodes, node, isChecked) => {\n    const currentNode = node.refKey ? nodes[node.refKey] : null;\n    if (!currentNode) {\n      return;\n    }\n\n    // Check if the current node is disabled\n    const isDisabled = (0, _utils.getDisabledState)(nodes, node, {\n      disabledItemValues,\n      valueKey\n    });\n\n    // Skip checking disabled nodes\n    if (isDisabled) {\n      return;\n    }\n    currentNode.check = isChecked;\n    if (!currentNode[childrenKey] || !currentNode[childrenKey].length || !cascade) {\n      currentNode.checkAll = false;\n    } else {\n      // Check if any descendant (not just direct children) is disabled\n      const hasDisabledDesc = hasDisabledDescendant(nodes, currentNode);\n\n      // Only set checkAll to true if all descendants will be checked\n      // If there are any disabled descendants, checkAll should be false\n      currentNode.checkAll = isChecked && !hasDisabledDesc;\n      currentNode[childrenKey].forEach(child => {\n        checkChildNode(nodes, child, isChecked);\n      });\n    }\n  });\n  const getCheckedValuesByParent = (0, _react.useCallback)(nodes => {\n    const values = [];\n    for (const key in nodes) {\n      const currentNode = nodes[key];\n      if (!(0, _isNil.default)(currentNode.parent) && !(0, _isNil.default)(currentNode.parent.refKey)) {\n        const parentNode = nodes[currentNode.parent.refKey];\n        if (currentNode.check) {\n          // Optimization: When a parent node is checked with checkAll=true, it represents\n          // the entire checked subtree. If the current node also has checkAll=true and its\n          // parent is checked, skip adding this node's value to avoid redundant representation.\n          // The parent's value already implies all descendants are checked.\n          if (currentNode.checkAll && parentNode.check) {\n            continue;\n          }\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  const getCheckedValues = (0, _hooks.useEventCallback)((node, isChecked) => {\n    const nodes = (0, _cloneDeep.default)(flattenedNodes);\n    checkChildNode(nodes, node, isChecked);\n    if (node.parent) {\n      checkParentNode(nodes, node.parent, isChecked);\n    }\n    const values = getCheckedValuesByParent(nodes);\n    return values.filter(v => !uncheckableItemValues.includes(v));\n  });\n  return {\n    getCheckedValues\n  };\n}\nvar _default = exports[\"default\"] = useTreeCheckState;\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/hooks/useTreeCheckState.ts?");
 
 /***/ }),
 
@@ -2116,7 +2116,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.getCheckTreeDefaultValue = getCheckTreeDefaultValue;\nexports.getDisabledState = getDisabledState;\nexports.getFormattedTree = getFormattedTree;\nexports.getNodeCheckState = getNodeCheckState;\nexports.getSelectedItems = getSelectedItems;\nexports.hasGrandchild = hasGrandchild;\nexports.isAllSiblingNodeUncheckable = isAllSiblingNodeUncheckable;\nexports.isEveryChildChecked = isEveryChildChecked;\nexports.isEveryFirstLevelNodeUncheckable = isEveryFirstLevelNodeUncheckable;\nexports.isNodeUncheckable = isNodeUncheckable;\nexports.isSomeChildChecked = isSomeChildChecked;\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 _constants = __webpack_require__(/*! ../internals/constants */ \"./src/internals/constants/index.ts\");\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../Tree/utils */ \"./src/Tree/utils/index.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(item => {\n    var _item$parent;\n    return (item === null || item === 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  const {\n    nodes,\n    childrenKey\n  } = options;\n  if ((0, _isNil2.default)(parent.refKey) || (0, _isNil2.default)(nodes[parent.refKey])) {\n    return false;\n  }\n  const 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(child => {\n    var _child$childrenKey;\n    if ((child === null || child === 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,\n        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  const children = getChildrenByFlattenNodes(nodes, parent);\n  return children.some(child => {\n    var _child$childrenKey2;\n    if ((child === null || child === 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(node => Array.isArray(node[childrenKey]));\n}\n\n/**\n * Checks if all sibling nodes of a given node are uncheckable.\n */\nfunction isAllSiblingNodeUncheckable(node, nodes, uncheckableItemValues, valueKey) {\n  const list = [];\n  const parentNodeRefKey = node.parent ? node.parent.refKey : '';\n  Object.keys(nodes).forEach(refKey => {\n    var _curNode$parent;\n    const 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(node => isNodeUncheckable(node, {\n    uncheckableItemValues,\n    valueKey\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  const list = [];\n  Object.keys(nodes).forEach(refKey => {\n    const curNode = nodes[refKey];\n    if (!curNode.parent) {\n      list.push(curNode);\n    }\n  });\n  return list.every(node => isNodeUncheckable(node, {\n    uncheckableItemValues,\n    valueKey\n  }));\n}\n\n/**\n * Checks if a node is uncheckable.\n */\nfunction isNodeUncheckable(node, props) {\n  const {\n    uncheckableItemValues = [],\n    valueKey\n  } = props;\n  return uncheckableItemValues.some(value => node[valueKey] === value);\n}\nfunction getFormattedTree(nodes, data, props) {\n  const {\n    childrenKey,\n    cascade\n  } = props;\n  return data.map(node => {\n    const formatted = {\n      ...node\n    };\n    const curNode = nodes[node.refKey];\n    if (curNode) {\n      var _node$childrenKey;\n      const checkState = !(0, _isUndefined2.default)(cascade) ? getNodeCheckState(curNode, {\n        cascade,\n        nodes,\n        childrenKey\n      }) : undefined;\n      formatted.check = curNode.check;\n      formatted.uncheckable = curNode.uncheckable;\n      (0, _utils.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  const {\n    disabledItemValues = [],\n    valueKey\n  } = props;\n  if (!(0, _isNil2.default)(node.refKey) && (0, _isNil2.default)(nodes[node.refKey])) {\n    return false;\n  }\n  return disabledItemValues.some(value => node.refKey && nodes[node.refKey][valueKey] === value);\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(v => !uncheckableItemValues.includes(v));\n  }\n  return value;\n}\n\n/**\n * Retrieves the selected items from the given nodes.\n */\nfunction getSelectedItems(nodes, values) {\n  const checkedItems = [];\n  values.forEach(value => {\n    const refKey = (0, _utils2.formatNodeRefKey)(value);\n    const 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  const {\n    nodes,\n    cascade,\n    childrenKey\n  } = options;\n  if (node.refKey === undefined) {\n    return _constants.CHECK_STATE.UNCHECK;\n  }\n  if ((0, _isNil2.default)(nodes[node.refKey])) {\n    return _constants.CHECK_STATE.UNCHECK;\n  }\n  if (!node[childrenKey] || !node[childrenKey].length || !cascade) {\n    nodes[node.refKey].checkAll = false;\n    return node.check ? _constants.CHECK_STATE.CHECK : _constants.CHECK_STATE.UNCHECK;\n  }\n  if (isEveryChildChecked(node, {\n    nodes,\n    childrenKey\n  })) {\n    nodes[node.refKey].checkAll = true;\n    nodes[node.refKey].check = true;\n    return _constants.CHECK_STATE.CHECK;\n  }\n  if (isSomeChildChecked(nodes, node, childrenKey)) {\n    nodes[node.refKey].checkAll = false;\n    return _constants.CHECK_STATE.INDETERMINATE;\n  }\n  return _constants.CHECK_STATE.UNCHECK;\n}\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/utils.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports.getCheckTreeDefaultValue = getCheckTreeDefaultValue;\nexports.getDisabledState = getDisabledState;\nexports.getFormattedTree = getFormattedTree;\nexports.getNodeCheckState = getNodeCheckState;\nexports.getSelectedItems = getSelectedItems;\nexports.hasGrandchild = hasGrandchild;\nexports.isAllSiblingNodeUncheckable = isAllSiblingNodeUncheckable;\nexports.isEveryChildChecked = isEveryChildChecked;\nexports.isEveryFirstLevelNodeUncheckable = isEveryFirstLevelNodeUncheckable;\nexports.isNodeUncheckable = isNodeUncheckable;\nexports.isSomeChildChecked = isSomeChildChecked;\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 _constants = __webpack_require__(/*! ../internals/constants */ \"./src/internals/constants/index.ts\");\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../Tree/utils */ \"./src/Tree/utils/index.ts\");\n/**\n * Retrieves the children of a given parent node from a flattened node map.\n * Filters out uncheckable children.\n * Note: Does NOT filter disabled children - disabled children are still considered in check state calculations\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(item => {\n    var _item$parent;\n    return (item === null || item === 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 * Disabled children are ignored in this check.\n */\nfunction isEveryChildChecked(parent, options) {\n  const {\n    nodes,\n    childrenKey,\n    disabledItemValues = [],\n    valueKey = 'value'\n  } = options;\n  if ((0, _isNil2.default)(parent.refKey) || (0, _isNil2.default)(nodes[parent.refKey])) {\n    return false;\n  }\n  const 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\n  // Filter out disabled children\n  const enabledChildren = children.filter(child => {\n    const isDisabled = getDisabledState(nodes, child, {\n      disabledItemValues,\n      valueKey\n    });\n    return !isDisabled;\n  });\n\n  // If all children are disabled, return the parent's own check state\n  if (enabledChildren.length === 0) {\n    var _nodes$parent$refKey$2;\n    return (_nodes$parent$refKey$2 = nodes[parent.refKey].check) !== null && _nodes$parent$refKey$2 !== void 0 ? _nodes$parent$refKey$2 : false;\n  }\n\n  // Check if all enabled children are checked\n  return enabledChildren.every(child => {\n    var _child$childrenKey;\n    if ((child === null || child === 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,\n        childrenKey,\n        disabledItemValues,\n        valueKey\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 * Disabled children are ignored in this check.\n */\nfunction isSomeChildChecked(nodes, parent, childrenKey, disabledItemValues = [], valueKey = 'value') {\n  if (!(0, _isNil2.default)(parent.refKey) && (0, _isNil2.default)(nodes[parent.refKey])) {\n    return false;\n  }\n  const children = getChildrenByFlattenNodes(nodes, parent);\n  return children.some(child => {\n    var _child$childrenKey2;\n    // Skip disabled children\n    const isDisabled = getDisabledState(nodes, child, {\n      disabledItemValues,\n      valueKey\n    });\n    if (isDisabled) {\n      return false; // Disabled children don't count as \"some checked\"\n    }\n    if ((child === null || child === void 0 || (_child$childrenKey2 = child[childrenKey]) === null || _child$childrenKey2 === void 0 ? void 0 : _child$childrenKey2.length) > 0) {\n      return isSomeChildChecked(nodes, child, childrenKey, disabledItemValues, valueKey);\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(node => Array.isArray(node[childrenKey]));\n}\n\n/**\n * Checks if all sibling nodes of a given node are uncheckable.\n */\nfunction isAllSiblingNodeUncheckable(node, nodes, uncheckableItemValues, valueKey) {\n  const list = [];\n  const parentNodeRefKey = node.parent ? node.parent.refKey : '';\n  Object.keys(nodes).forEach(refKey => {\n    var _curNode$parent;\n    const 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(node => isNodeUncheckable(node, {\n    uncheckableItemValues,\n    valueKey\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  const list = [];\n  Object.keys(nodes).forEach(refKey => {\n    const curNode = nodes[refKey];\n    if (!curNode.parent) {\n      list.push(curNode);\n    }\n  });\n  return list.every(node => isNodeUncheckable(node, {\n    uncheckableItemValues,\n    valueKey\n  }));\n}\n\n/**\n * Checks if a node is uncheckable.\n */\nfunction isNodeUncheckable(node, props) {\n  const {\n    uncheckableItemValues = [],\n    valueKey\n  } = props;\n  return uncheckableItemValues.some(value => node[valueKey] === value);\n}\nfunction getFormattedTree(nodes, data, props) {\n  const {\n    childrenKey,\n    cascade,\n    disabledItemValues,\n    valueKey\n  } = props;\n  return data.map(node => {\n    const formatted = {\n      ...node\n    };\n    const curNode = nodes[node.refKey];\n    if (curNode) {\n      var _node$childrenKey;\n      const checkState = !(0, _isUndefined2.default)(cascade) ? getNodeCheckState(curNode, {\n        cascade,\n        nodes,\n        childrenKey,\n        disabledItemValues,\n        valueKey\n      }) : undefined;\n      formatted.check = curNode.check;\n      formatted.uncheckable = curNode.uncheckable;\n      (0, _utils.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 * If a parent node is disabled, all its children should also be disabled.\n */\nfunction getDisabledState(nodes, node, props) {\n  const {\n    disabledItemValues = [],\n    valueKey\n  } = props;\n  if (!(0, _isNil2.default)(node.refKey) && (0, _isNil2.default)(nodes[node.refKey])) {\n    return false;\n  }\n\n  // Check if the current node is disabled\n  const isCurrentNodeDisabled = disabledItemValues.some(value => node.refKey && (0, _utils.shallowEqual)(nodes[node.refKey][valueKey], value));\n  if (isCurrentNodeDisabled) {\n    return true;\n  }\n\n  // Check if any parent node is disabled\n  let currentNode = node;\n  while (currentNode.parent) {\n    const parentNode = currentNode.parent;\n    const parentRefKey = parentNode.refKey;\n    if (!(0, _isNil2.default)(parentRefKey) && !(0, _isNil2.default)(nodes[parentRefKey]) && disabledItemValues.some(value => (0, _utils.shallowEqual)(nodes[parentRefKey][valueKey], value))) {\n      return true;\n    }\n    currentNode = parentNode;\n  }\n  return false;\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(v => !uncheckableItemValues.includes(v));\n  }\n  return value;\n}\n\n/**\n * Retrieves the selected items from the given nodes.\n */\nfunction getSelectedItems(nodes, values) {\n  const checkedItems = [];\n  values.forEach(value => {\n    const refKey = (0, _utils2.formatNodeRefKey)(value);\n    const 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  const {\n    nodes,\n    cascade,\n    childrenKey,\n    disabledItemValues = [],\n    valueKey = 'value'\n  } = options;\n  if (node.refKey === undefined) {\n    return _constants.CHECK_STATE.UNCHECK;\n  }\n  if ((0, _isNil2.default)(nodes[node.refKey])) {\n    return _constants.CHECK_STATE.UNCHECK;\n  }\n  if (!node[childrenKey] || !node[childrenKey].length || !cascade) {\n    nodes[node.refKey].checkAll = false;\n    return node.check ? _constants.CHECK_STATE.CHECK : _constants.CHECK_STATE.UNCHECK;\n  }\n  if (isEveryChildChecked(node, {\n    nodes,\n    childrenKey,\n    disabledItemValues,\n    valueKey\n  })) {\n    nodes[node.refKey].checkAll = true;\n    nodes[node.refKey].check = true;\n    return _constants.CHECK_STATE.CHECK;\n  }\n  if (isSomeChildChecked(nodes, node, childrenKey, disabledItemValues, valueKey)) {\n    nodes[node.refKey].checkAll = false;\n    return _constants.CHECK_STATE.INDETERMINATE;\n  }\n  return _constants.CHECK_STATE.UNCHECK;\n}\n\n//# sourceURL=webpack://rsuite/./src/CheckTree/utils.ts?");
 
 /***/ }),
 
@@ -2127,7 +2127,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 _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ \"./node_modules/classnames/index.js\"));\nvar _CheckTreeView = _interopRequireDefault(__webpack_require__(/*! ../CheckTree/CheckTreeView */ \"./src/CheckTree/CheckTreeView.tsx\"));\nvar _useTreeValue = _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 _useTreeWithChildren = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useTreeWithChildren */ \"./src/Tree/hooks/useTreeWithChildren.ts\"));\nvar _useExpandTree = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useExpandTree */ \"./src/Tree/hooks/useExpandTree.ts\"));\nvar _useFocusState = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFocusState */ \"./src/CheckTreePicker/hooks/useFocusState.ts\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../CheckTree/utils */ \"./src/CheckTree/utils.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../internals/Tree/TreeProvider */ \"./src/internals/Tree/TreeProvider.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckTreePicker/CheckTreePicker.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\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 */\nconst CheckTreePicker = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('CheckTreePicker', props);\n  const {\n    as,\n    id,\n    appearance = 'default',\n    block,\n    cleanable = true,\n    countable = true,\n    cascade = true,\n    className,\n    classPrefix = 'picker',\n    childrenKey = 'children',\n    disabled,\n    data = [],\n    defaultValue = [],\n    defaultExpandAll = false,\n    disabledItemValues = [],\n    expandItemValues: controlledExpandItemValues,\n    defaultExpandItemValues = [],\n    placeholder,\n    popupClassName,\n    popupStyle,\n    popupAutoWidth = true,\n    placement = 'bottomStart',\n    treeHeight = 320,\n    toggleAs,\n    searchBy,\n    searchKeyword,\n    showIndentLine,\n    searchable = true,\n    style,\n    size,\n    valueKey = 'value',\n    value: controlledValue,\n    virtualized = false,\n    uncheckableItemValues = [],\n    locale,\n    labelKey = 'label',\n    listProps,\n    getChildren,\n    renderExtraFooter,\n    onEnter,\n    onChange,\n    onClean,\n    onExit,\n    onSearch,\n    onSelect,\n    onSelectItem,\n    onScroll,\n    onExpand,\n    renderValue,\n    renderTree,\n    renderTreeIcon,\n    renderTreeNode,\n    onCascadeChange,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    trigger,\n    root,\n    target,\n    overlay,\n    list,\n    searchInput,\n    treeView\n  } = (0, _Picker.usePickerRef)(ref);\n  const {\n    prefix\n  } = (0, _hooks.useStyles)(classPrefix);\n  const [value, setValue] = (0, _useTreeValue.default)(controlledValue, {\n    defaultValue,\n    uncheckableItemValues\n  });\n  const itemDataKeys = {\n    childrenKey,\n    labelKey,\n    valueKey\n  };\n  const {\n    treeData,\n    loadingNodeValues,\n    appendChild\n  } = (0, _useTreeWithChildren.default)(data, itemDataKeys);\n  const {\n    expandItemValues,\n    handleExpandTreeNode\n  } = (0, _useExpandTree.default)(data, {\n    ...itemDataKeys,\n    defaultExpandAll,\n    defaultExpandItemValues,\n    controlledExpandItemValues,\n    onExpand,\n    getChildren,\n    appendChild\n  });\n  const flattenedNodes = (0, _useFlattenTree.default)(treeData, {\n    ...itemDataKeys,\n    uncheckableItemValues,\n    multiple: true,\n    cascade,\n    value\n  });\n  const selectedNodes = (0, _utils2.getSelectedItems)(flattenedNodes, value);\n  const {\n    register,\n    focusFirstNode\n  } = (0, _TreeProvider.useTreeImperativeHandle)();\n  const {\n    focusItemValue,\n    setFocusItemValue,\n    active,\n    triggerProps\n  } = (0, _useFocusState.default)({\n    target,\n    onEnter,\n    onExit\n  });\n  const handleClean = (0, _hooks.useEventCallback)(event => {\n    const 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 || onChange([], event);\n    onCascadeChange === null || onCascadeChange === void 0 || onCascadeChange([], event);\n  });\n  const handleTreeKeyDown = (0, _hooks.useEventCallback)(event => {\n    (0, _Picker.onMenuKeyDown)(event, {\n      del: handleClean,\n      down: () => focusFirstNode()\n    });\n  });\n  const onPickerKeydown = (0, _Picker.useToggleKeyDownEvent)({\n    toggle: !focusItemValue || !active,\n    trigger,\n    target,\n    overlay,\n    searchInput,\n    active,\n    onExit: handleClean,\n    onMenuKeyDown: handleTreeKeyDown,\n    ...rest\n  });\n\n  // transform the parent node value to the leaf node value\n  const handleTransValue2Children = (0, _hooks.useEventCallback)(nextSelectedNodes => {\n    return nextSelectedNodes.map(node => {\n      const currentNode = node.refKey ? flattenedNodes[node.refKey] : null;\n      if (currentNode && currentNode[childrenKey] && currentNode[childrenKey].length) {\n        const childNodes = currentNode[childrenKey].filter(child => {\n          const childValue = child[valueKey];\n          return !disabledItemValues.includes(childValue) && !uncheckableItemValues.includes(childValue);\n        });\n        return handleTransValue2Children(childNodes);\n      }\n      return node;\n    }).flat();\n  });\n  const handleChangeCascade = (0, _hooks.useEventCallback)((nextValue, event) => {\n    if (!cascade) {\n      onCascadeChange === null || onCascadeChange === void 0 || onCascadeChange(nextValue, event);\n    } else {\n      const nextSelectedNodes = (0, _utils2.getSelectedItems)(flattenedNodes, nextValue);\n      const childrenNodes = handleTransValue2Children(nextSelectedNodes);\n      const childrenValue = childrenNodes.map(node => node[valueKey]);\n      onCascadeChange === null || onCascadeChange === void 0 || onCascadeChange(childrenValue, event);\n    }\n  });\n  const handleChange = (0, _hooks.useEventCallback)((nextValue, event) => {\n    setValue(nextValue);\n    onChange === null || onChange === void 0 || onChange(nextValue, event);\n    handleChangeCascade(nextValue, event);\n  });\n  const treeContext = (0, _react.useMemo)(() => ({\n    register,\n    props: {\n      labelKey,\n      valueKey,\n      childrenKey,\n      virtualized,\n      renderTreeIcon,\n      renderTreeNode\n    }\n  }), [childrenKey, labelKey, valueKey, virtualized, register, renderTreeIcon, renderTreeNode]);\n  const checkTreeView = /*#__PURE__*/_react.default.createElement(_TreeProvider.TreeProvider, {\n    value: treeContext,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 250,\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    data: treeData,\n    height: treeHeight,\n    showIndentLine: showIndentLine,\n    listProps: listProps,\n    listRef: list,\n    locale: locale,\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: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 251,\n      columnNumber: 7\n    }\n  }));\n  const renderTreeView = (positionProps, speakerRef) => {\n    const {\n      className\n    } = positionProps;\n    const classes = (0, _classnames.default)(className, popupClassName, prefix('check-tree-menu'));\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      autoWidth: popupAutoWidth,\n      className: classes,\n      style: popupStyle,\n      onKeyDown: onPickerKeydown,\n      target: trigger,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 285,\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  let hasValidValue = selectedNodes.length > 0 || value.length > 0 && (0, _isFunction.default)(renderValue);\n  let 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      badgeSize: size,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 308,\n        columnNumber: 7\n      }\n    });\n    if ((0, _isFunction.default)(renderValue)) {\n      selectedElement = renderValue(value, selectedNodes, selectedElement);\n      if ((0, _isNil.default)(selectedElement)) {\n        hasValidValue = false;\n      }\n    }\n  }\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    as: as,\n    id: id,\n    name: \"check-tree\",\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    popupType: \"tree\",\n    multiple: true,\n    triggerProps: {\n      ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n      ...triggerProps\n    },\n    ref: trigger,\n    placement: placement,\n    speaker: renderTreeView,\n    rootRef: root,\n    style: style,\n    classPrefix: classPrefix,\n    className: className,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 329,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({\n    ref: target,\n    appearance: appearance,\n    onKeyDown: onPickerKeydown,\n    onClean: (0, _utils.createChainedFunction)(handleClean, onClean),\n    cleanable: cleanable && !disabled,\n    countable: countable,\n    disabled: disabled,\n    as: toggleAs,\n    hasValue: hasValidValue,\n    active: active,\n    placement: placement,\n    inputValue: value,\n    focusItemValue: focusItemValue,\n    size: size\n  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 350,\n      columnNumber: 7\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder)));\n});\nCheckTreePicker.displayName = 'CheckTreePicker';\nvar _default = exports[\"default\"] = CheckTreePicker;\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\");\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 _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ \"./node_modules/classnames/index.js\"));\nvar _CheckTreeView = _interopRequireDefault(__webpack_require__(/*! ../CheckTree/CheckTreeView */ \"./src/CheckTree/CheckTreeView.tsx\"));\nvar _useTreeValue = _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 _useTreeWithChildren = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useTreeWithChildren */ \"./src/Tree/hooks/useTreeWithChildren.ts\"));\nvar _useExpandTree = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useExpandTree */ \"./src/Tree/hooks/useExpandTree.ts\"));\nvar _useFocusState = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFocusState */ \"./src/CheckTreePicker/hooks/useFocusState.ts\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _isFunction = _interopRequireDefault(__webpack_require__(/*! lodash/isFunction */ \"./node_modules/lodash/isFunction.js\"));\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../CheckTree/utils */ \"./src/CheckTree/utils.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../internals/Tree/TreeProvider */ \"./src/internals/Tree/TreeProvider.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/CheckTreePicker/CheckTreePicker.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\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 */\nconst CheckTreePicker = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('CheckTreePicker', props);\n  const {\n    as,\n    id,\n    appearance = 'default',\n    block,\n    cleanable = true,\n    countable = true,\n    cascade = true,\n    className,\n    classPrefix = 'picker',\n    childrenKey = 'children',\n    disabled,\n    data = [],\n    defaultValue = [],\n    defaultExpandAll = false,\n    disabledItemValues = [],\n    expandItemValues: controlledExpandItemValues,\n    defaultExpandItemValues = [],\n    placeholder,\n    popupClassName,\n    popupStyle,\n    popupAutoWidth = true,\n    placement = 'bottomStart',\n    treeHeight = 320,\n    toggleAs,\n    searchBy,\n    searchKeyword,\n    showIndentLine,\n    searchable = true,\n    style,\n    size,\n    valueKey = 'value',\n    value: controlledValue,\n    virtualized = false,\n    uncheckableItemValues = [],\n    locale,\n    labelKey = 'label',\n    listProps,\n    getChildren,\n    renderExtraFooter,\n    onEnter,\n    onChange,\n    onClean,\n    onExit,\n    onSearch,\n    onSelect,\n    onSelectItem,\n    onScroll,\n    onExpand,\n    renderValue,\n    renderTree,\n    renderTreeIcon,\n    renderTreeNode,\n    onCascadeChange,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    trigger,\n    root,\n    target,\n    overlay,\n    list,\n    searchInput,\n    treeView\n  } = (0, _Picker.usePickerRef)(ref);\n  const {\n    prefix\n  } = (0, _hooks.useStyles)(classPrefix);\n  const [value, setValue] = (0, _useTreeValue.default)(controlledValue, {\n    defaultValue,\n    uncheckableItemValues\n  });\n  const itemDataKeys = {\n    childrenKey,\n    labelKey,\n    valueKey\n  };\n  const {\n    treeData,\n    loadingNodeValues,\n    appendChild\n  } = (0, _useTreeWithChildren.default)(data, itemDataKeys);\n  const {\n    expandItemValues,\n    handleExpandTreeNode\n  } = (0, _useExpandTree.default)(data, {\n    ...itemDataKeys,\n    defaultExpandAll,\n    defaultExpandItemValues,\n    controlledExpandItemValues,\n    onExpand,\n    getChildren,\n    appendChild\n  });\n  const flattenedNodes = (0, _useFlattenTree.default)(treeData, {\n    ...itemDataKeys,\n    uncheckableItemValues,\n    disabledItemValues,\n    multiple: true,\n    cascade,\n    value\n  });\n  const selectedNodes = (0, _utils2.getSelectedItems)(flattenedNodes, value);\n  const {\n    register,\n    focusFirstNode\n  } = (0, _TreeProvider.useTreeImperativeHandle)();\n  const {\n    focusItemValue,\n    setFocusItemValue,\n    active,\n    triggerProps\n  } = (0, _useFocusState.default)({\n    target,\n    onEnter,\n    onExit\n  });\n  const handleClean = (0, _hooks.useEventCallback)(event => {\n    const 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 || onChange([], event);\n    onCascadeChange === null || onCascadeChange === void 0 || onCascadeChange([], event);\n  });\n  const handleTreeKeyDown = (0, _hooks.useEventCallback)(event => {\n    (0, _Picker.onMenuKeyDown)(event, {\n      del: handleClean,\n      down: () => focusFirstNode()\n    });\n  });\n  const onPickerKeydown = (0, _Picker.useToggleKeyDownEvent)({\n    toggle: !focusItemValue || !active,\n    trigger,\n    target,\n    overlay,\n    searchInput,\n    active,\n    onExit: handleClean,\n    onMenuKeyDown: handleTreeKeyDown,\n    ...rest\n  });\n\n  // transform the parent node value to the leaf node value\n  const handleTransValue2Children = (0, _hooks.useEventCallback)(nextSelectedNodes => {\n    return nextSelectedNodes.map(node => {\n      const currentNode = node.refKey ? flattenedNodes[node.refKey] : null;\n      if (currentNode && currentNode[childrenKey] && currentNode[childrenKey].length) {\n        const childNodes = currentNode[childrenKey].filter(child => {\n          const childValue = child[valueKey];\n          return !disabledItemValues.includes(childValue) && !uncheckableItemValues.includes(childValue);\n        });\n        return handleTransValue2Children(childNodes);\n      }\n      return node;\n    }).flat();\n  });\n  const handleChangeCascade = (0, _hooks.useEventCallback)((nextValue, event) => {\n    if (!cascade) {\n      onCascadeChange === null || onCascadeChange === void 0 || onCascadeChange(nextValue, event);\n    } else {\n      const nextSelectedNodes = (0, _utils2.getSelectedItems)(flattenedNodes, nextValue);\n      const childrenNodes = handleTransValue2Children(nextSelectedNodes);\n      const childrenValue = childrenNodes.map(node => node[valueKey]);\n      onCascadeChange === null || onCascadeChange === void 0 || onCascadeChange(childrenValue, event);\n    }\n  });\n  const handleChange = (0, _hooks.useEventCallback)((nextValue, event) => {\n    setValue(nextValue);\n    onChange === null || onChange === void 0 || onChange(nextValue, event);\n    handleChangeCascade(nextValue, event);\n  });\n  const treeContext = (0, _react.useMemo)(() => ({\n    register,\n    props: {\n      labelKey,\n      valueKey,\n      childrenKey,\n      virtualized,\n      renderTreeIcon,\n      renderTreeNode\n    }\n  }), [childrenKey, labelKey, valueKey, virtualized, register, renderTreeIcon, renderTreeNode]);\n  const checkTreeView = /*#__PURE__*/_react.default.createElement(_TreeProvider.TreeProvider, {\n    value: treeContext,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 251,\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    data: treeData,\n    height: treeHeight,\n    showIndentLine: showIndentLine,\n    listProps: listProps,\n    listRef: list,\n    locale: locale,\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: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 252,\n      columnNumber: 7\n    }\n  }));\n  const renderTreeView = (positionProps, speakerRef) => {\n    const {\n      className\n    } = positionProps;\n    const classes = (0, _classnames.default)(className, popupClassName, prefix('check-tree-menu'));\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      autoWidth: popupAutoWidth,\n      className: classes,\n      style: popupStyle,\n      onKeyDown: onPickerKeydown,\n      target: trigger,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 286,\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  let hasValidValue = selectedNodes.length > 0 || value.length > 0 && (0, _isFunction.default)(renderValue);\n  let 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      badgeSize: size,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 309,\n        columnNumber: 7\n      }\n    });\n    if ((0, _isFunction.default)(renderValue)) {\n      selectedElement = renderValue(value, selectedNodes, selectedElement);\n      if ((0, _isNil.default)(selectedElement)) {\n        hasValidValue = false;\n      }\n    }\n  }\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    as: as,\n    id: id,\n    pickerType: \"check-tree\",\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    popupType: \"tree\",\n    multiple: true,\n    triggerProps: {\n      ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n      ...triggerProps\n    },\n    ref: trigger,\n    placement: placement,\n    speaker: renderTreeView,\n    rootRef: root,\n    style: style,\n    classPrefix: classPrefix,\n    className: className,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 330,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({\n    ref: target,\n    appearance: appearance,\n    onKeyDown: onPickerKeydown,\n    onClean: (0, _utils.createChainedFunction)(handleClean, onClean),\n    cleanable: cleanable && !disabled,\n    countable: countable,\n    disabled: disabled,\n    as: toggleAs,\n    hasValue: hasValidValue,\n    active: active,\n    placement: placement,\n    inputValue: value,\n    focusItemValue: focusItemValue,\n    size: size\n  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 351,\n      columnNumber: 7\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder)));\n});\nCheckTreePicker.displayName = 'CheckTreePicker';\nvar _default = exports[\"default\"] = CheckTreePicker;\n\n//# sourceURL=webpack://rsuite/./src/CheckTreePicker/CheckTreePicker.tsx?");
 
 /***/ }),
 
@@ -2160,7 +2160,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\");\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 _Box = _interopRequireDefault(__webpack_require__(/*! ../internals/Box */ \"./src/internals/Box/index.tsx\"));\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _CheckboxGroup = __webpack_require__(/*! ../CheckboxGroup */ \"./src/CheckboxGroup/index.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Checkbox/Checkbox.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\n/**\n * The Checkbox component is used for selecting multiple options from a set.\n * @see https://rsuitejs.com/components/checkbox\n */\nconst Checkbox = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('Checkbox', props);\n  const checkboxGroupContext = (0, _react.useContext)(_CheckboxGroup.CheckboxGroupContext);\n  const {\n    inline: inlineContext,\n    name: nameContext,\n    disabled: disabledContext,\n    readOnly: readOnlyContext,\n    plaintext: plaintextContext,\n    onChange: onGroupChange\n  } = checkboxGroupContext !== null && checkboxGroupContext !== void 0 ? checkboxGroupContext : {};\n  const {\n    as,\n    checked: controlledChecked,\n    className,\n    children,\n    classPrefix = 'checkbox',\n    checkable = true,\n    color,\n    defaultChecked = false,\n    title,\n    inputRef,\n    inputProps,\n    indeterminate,\n    labelClickable = true,\n    tabIndex = 0,\n    disabled = disabledContext,\n    readOnly = readOnlyContext,\n    plaintext = plaintextContext,\n    inline = inlineContext,\n    name = nameContext,\n    value,\n    onClick,\n    onCheckboxClick,\n    onChange,\n    ...rest\n  } = propsWithDefaults;\n  const [selfChecked, setSelfChecked, selfControlled] = (0, _hooks.useControlled)(controlledChecked, defaultChecked);\n\n  // Either <Checkbox> is checked itself or by parent <CheckboxGroup>\n  const checked = (0, _react.useMemo)(() => {\n    var _checkboxGroupContext, _checkboxGroupContext2;\n    if (!checkboxGroupContext) {\n      return selfChecked;\n    }\n\n    // fixme value from group should not be nullable\n    return (_checkboxGroupContext = (_checkboxGroupContext2 = checkboxGroupContext.value) === null || _checkboxGroupContext2 === void 0 ? void 0 : _checkboxGroupContext2.some(checkedValue => checkedValue === value)) !== null && _checkboxGroupContext !== void 0 ? _checkboxGroupContext : false;\n  }, [checkboxGroupContext, selfChecked, value]);\n  const {\n    merge,\n    prefix,\n    withPrefix\n  } = (0, _hooks.useStyles)(classPrefix);\n  const classes = merge(className, withPrefix());\n  const [htmlInputProps, restProps] = (0, _utils.partitionHTMLProps)(rest);\n\n  // If <Checkbox> is within a <CheckboxGroup>, it's bound to be controlled\n  // because its checked state is inferred from group's value, not retrieved from the DOM\n  const controlled = checkboxGroupContext ? true : selfControlled;\n  if (typeof controlled !== 'undefined') {\n    // In uncontrolled situations, use defaultChecked instead of checked\n    htmlInputProps[controlled ? 'checked' : 'defaultChecked'] = checked;\n  }\n  const checkboxRef = (0, _react.useRef)(null);\n  const handleChange = (0, _hooks.useEventCallback)(event => {\n    const nextChecked = event.target.checked;\n    if (disabled || readOnly) {\n      return;\n    }\n    setSelfChecked(nextChecked);\n    onChange === null || onChange === void 0 || onChange(value, nextChecked, event);\n    onGroupChange === null || onGroupChange === void 0 || onGroupChange(value, nextChecked, event);\n  });\n  const handleLabelClick = (0, _hooks.useEventCallback)(event => {\n    // Prevent check when label is not clickable\n    if (!labelClickable && event.target !== checkboxRef.current) {\n      event.preventDefault();\n    }\n  });\n  const labelId = (0, _hooks.useUniqueId)('label-');\n  if (plaintext) {\n    return checked ? /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({\n      as: as\n    }, restProps, {\n      ref: ref,\n      className: classes,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 214,\n        columnNumber: 7\n      }\n    }), children) : null;\n  }\n  const control = /*#__PURE__*/_react.default.createElement(\"span\", {\n    className: prefix`control`,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 221,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(\"input\", (0, _extends2.default)({}, htmlInputProps, inputProps, {\n    \"aria-disabled\": disabled,\n    \"aria-checked\": indeterminate ? 'mixed' : checked,\n    \"aria-labelledby\": labelId,\n    name: name,\n    value: value,\n    type: \"checkbox\",\n    ref: (0, _utils.mergeRefs)(checkboxRef, inputRef),\n    tabIndex: tabIndex,\n    readOnly: readOnly,\n    disabled: disabled,\n    onClick: onCheckboxClick,\n    onChange: handleChange,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 222,\n      columnNumber: 7\n    }\n  })), /*#__PURE__*/_react.default.createElement(\"span\", {\n    className: prefix`inner`,\n    \"aria-hidden\": true,\n    \"data-testid\": \"checkbox-control-inner\",\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 238,\n      columnNumber: 7\n    }\n  }));\n  return /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({\n    as: as\n  }, restProps, {\n    ref: ref,\n    onClick: onClick,\n    className: classes,\n    \"data-color\": color,\n    \"data-checked\": indeterminate ? 'mixed' : checked,\n    \"data-disabled\": disabled,\n    \"data-inline\": inline,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 243,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix`checker`,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 254,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(\"label\", {\n    title: title,\n    onClick: handleLabelClick,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 255,\n      columnNumber: 9\n    }\n  }, checkable ? control : null, /*#__PURE__*/_react.default.createElement(\"span\", {\n    className: prefix`label`,\n    id: labelId,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 257,\n      columnNumber: 11\n    }\n  }, children))));\n});\nCheckbox.displayName = 'Checkbox';\nvar _default = exports[\"default\"] = Checkbox;\n\n//# sourceURL=webpack://rsuite/./src/Checkbox/Checkbox.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 = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _Box = _interopRequireDefault(__webpack_require__(/*! ../internals/Box */ \"./src/internals/Box/index.tsx\"));\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _useIndeterminateCheckbox = __webpack_require__(/*! ./hooks/useIndeterminateCheckbox */ \"./src/Checkbox/hooks/useIndeterminateCheckbox.ts\");\nvar _CheckboxGroup = __webpack_require__(/*! ../CheckboxGroup */ \"./src/CheckboxGroup/index.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Checkbox/Checkbox.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\n/**\n * The Checkbox component is used for selecting multiple options from a set.\n * @see https://rsuitejs.com/components/checkbox\n */\nconst Checkbox = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('Checkbox', props);\n  const checkboxGroupContext = (0, _react.useContext)(_CheckboxGroup.CheckboxGroupContext);\n  const {\n    inline: inlineContext,\n    name: nameContext,\n    disabled: disabledContext,\n    readOnly: readOnlyContext,\n    plaintext: plaintextContext,\n    onChange: onGroupChange\n  } = checkboxGroupContext !== null && checkboxGroupContext !== void 0 ? checkboxGroupContext : {};\n  const {\n    as,\n    checked: controlledChecked,\n    className,\n    children,\n    classPrefix = 'checkbox',\n    checkable = true,\n    color,\n    defaultChecked = false,\n    title,\n    inputRef,\n    inputProps,\n    indeterminate,\n    labelClickable = true,\n    tabIndex = 0,\n    disabled = disabledContext,\n    readOnly = readOnlyContext,\n    plaintext = plaintextContext,\n    inline = inlineContext,\n    name = nameContext,\n    value,\n    onClick,\n    onCheckboxClick,\n    onChange,\n    ...rest\n  } = propsWithDefaults;\n  const [selfChecked, setSelfChecked, selfControlled] = (0, _hooks.useControlled)(controlledChecked, defaultChecked);\n\n  // Either <Checkbox> is checked itself or by parent <CheckboxGroup>\n  const checked = (0, _react.useMemo)(() => {\n    var _checkboxGroupContext, _checkboxGroupContext2;\n    if (!checkboxGroupContext) {\n      return selfChecked;\n    }\n\n    // fixme value from group should not be nullable\n    return (_checkboxGroupContext = (_checkboxGroupContext2 = checkboxGroupContext.value) === null || _checkboxGroupContext2 === void 0 ? void 0 : _checkboxGroupContext2.some(checkedValue => checkedValue === value)) !== null && _checkboxGroupContext !== void 0 ? _checkboxGroupContext : false;\n  }, [checkboxGroupContext, selfChecked, value]);\n  const {\n    merge,\n    prefix,\n    withPrefix\n  } = (0, _hooks.useStyles)(classPrefix);\n  const classes = merge(className, withPrefix());\n  const [htmlInputProps, restProps] = (0, _utils.partitionHTMLProps)(rest);\n\n  // If <Checkbox> is within a <CheckboxGroup>, it's bound to be controlled\n  // because its checked state is inferred from group's value, not retrieved from the DOM\n  const controlled = checkboxGroupContext ? true : selfControlled;\n  if (typeof controlled !== 'undefined') {\n    // In uncontrolled situations, use defaultChecked instead of checked\n    htmlInputProps[controlled ? 'checked' : 'defaultChecked'] = checked;\n  }\n  const checkboxRef = (0, _useIndeterminateCheckbox.useIndeterminateCheckbox)(indeterminate);\n  const handleChange = (0, _hooks.useEventCallback)(event => {\n    const nextChecked = event.target.checked;\n    if (disabled || readOnly) {\n      return;\n    }\n    setSelfChecked(nextChecked);\n    onChange === null || onChange === void 0 || onChange(value, nextChecked, event);\n    onGroupChange === null || onGroupChange === void 0 || onGroupChange(value, nextChecked, event);\n  });\n  const handleLabelClick = (0, _hooks.useEventCallback)(event => {\n    // Prevent check when label is not clickable\n    if (!labelClickable && event.target !== checkboxRef.current) {\n      event.preventDefault();\n    }\n  });\n  const labelId = (0, _hooks.useUniqueId)('label-');\n  if (plaintext) {\n    return checked ? /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({\n      as: as\n    }, restProps, {\n      ref: ref,\n      className: classes,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 215,\n        columnNumber: 7\n      }\n    }), children) : null;\n  }\n  const control = /*#__PURE__*/_react.default.createElement(\"span\", {\n    className: prefix`control`,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 222,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(\"input\", (0, _extends2.default)({}, htmlInputProps, inputProps, {\n    \"aria-disabled\": disabled,\n    \"aria-checked\": indeterminate ? 'mixed' : checked,\n    \"aria-labelledby\": labelId,\n    name: name,\n    value: value,\n    type: \"checkbox\",\n    ref: (0, _utils.mergeRefs)(checkboxRef, inputRef),\n    tabIndex: tabIndex,\n    readOnly: readOnly,\n    disabled: disabled,\n    onClick: onCheckboxClick,\n    onChange: handleChange,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 223,\n      columnNumber: 7\n    }\n  })), /*#__PURE__*/_react.default.createElement(\"span\", {\n    className: prefix`inner`,\n    \"aria-hidden\": true,\n    \"data-testid\": \"checkbox-control-inner\",\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 239,\n      columnNumber: 7\n    }\n  }));\n  return /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({\n    as: as\n  }, restProps, {\n    ref: ref,\n    onClick: onClick,\n    className: classes,\n    \"data-color\": color,\n    \"data-checked\": indeterminate ? 'mixed' : checked,\n    \"data-disabled\": disabled,\n    \"data-inline\": inline,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 244,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: prefix`checker`,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 255,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(\"label\", {\n    title: title,\n    onClick: handleLabelClick,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 256,\n      columnNumber: 9\n    }\n  }, checkable ? control : null, /*#__PURE__*/_react.default.createElement(\"span\", {\n    className: prefix`label`,\n    id: labelId,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 258,\n      columnNumber: 11\n    }\n  }, children))));\n});\nCheckbox.displayName = 'Checkbox';\nvar _default = exports[\"default\"] = Checkbox;\n\n//# sourceURL=webpack://rsuite/./src/Checkbox/Checkbox.tsx?");
+
+/***/ }),
+
+/***/ "./src/Checkbox/hooks/useIndeterminateCheckbox.ts":
+/*!********************************************************!*\
+  !*** ./src/Checkbox/hooks/useIndeterminateCheckbox.ts ***!
+  \********************************************************/
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nexports.__esModule = true;\nexports.useIndeterminateCheckbox = useIndeterminateCheckbox;\nvar _react = __webpack_require__(/*! react */ \"react\");\n/**\n * A hook that manages the indeterminate state of a checkbox input element.\n *\n * The indeterminate state is a visual and accessibility state that cannot be set via HTML attributes.\n * It must be set via JavaScript on the DOM element itself. This is required for proper\n * screen reader support, as assistive technologies rely on the native DOM property\n * rather than ARIA attributes for native checkboxes.\n *\n * @param indeterminate - Whether the checkbox should be in an indeterminate state\n * @returns A ref object to be attached to the checkbox input element\n *\n * @example\n * ```tsx\n * const checkboxRef = useIndeterminateCheckbox(isIndeterminate);\n * return <input type=\"checkbox\" ref={checkboxRef} />;\n * ```\n */\nfunction useIndeterminateCheckbox(indeterminate) {\n  const ref = (0, _react.useRef)(null);\n  (0, _react.useLayoutEffect)(() => {\n    if (ref.current) {\n      ref.current.indeterminate = indeterminate !== null && indeterminate !== void 0 ? indeterminate : false;\n    }\n  }, [indeterminate]);\n  return ref;\n}\n\n//# sourceURL=webpack://rsuite/./src/Checkbox/hooks/useIndeterminateCheckbox.ts?");
 
 /***/ }),
 
@@ -2314,7 +2325,7 @@ eval("\n\nexports.__esModule = true;\nexports.useDateField = exports.patternMap
 /***/ (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 = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _Input = _interopRequireDefault(__webpack_require__(/*! ../Input */ \"./src/Input/index.tsx\"));\nvar _useDateInputState = _interopRequireDefault(__webpack_require__(/*! ./hooks/useDateInputState */ \"./src/DateInput/hooks/useDateInputState.ts\"));\nvar _useKeyboardInputEvent = _interopRequireDefault(__webpack_require__(/*! ./hooks/useKeyboardInputEvent */ \"./src/DateInput/hooks/useKeyboardInputEvent.ts\"));\nvar _useIsFocused = _interopRequireDefault(__webpack_require__(/*! ./hooks/useIsFocused */ \"./src/DateInput/hooks/useIsFocused.ts\"));\nvar _useFieldCursor = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFieldCursor */ \"./src/DateInput/hooks/useFieldCursor.ts\"));\nvar _useSelectedState = _interopRequireDefault(__webpack_require__(/*! ./hooks/useSelectedState */ \"./src/DateInput/hooks/useSelectedState.ts\"));\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _date = __webpack_require__(/*! ../internals/utils/date */ \"./src/internals/utils/date/index.ts\");\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/DateInput/utils.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DateInput/DateInput.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\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 */\nconst DateInput = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults,\n    parseDate,\n    getLocale\n  } = (0, _hooks.useCustom)('DateInput', props);\n  const {\n    dateLocale,\n    shortDateFormat\n  } = getLocale('DateTimeFormats');\n  const {\n    format: formatStr = shortDateFormat,\n    value: valueProp,\n    defaultValue,\n    placeholder,\n    onChange,\n    onKeyDown,\n    onBlur,\n    onFocus,\n    onPaste,\n    ...rest\n  } = propsWithDefaults;\n  const inputRef = (0, _react.useRef)(null);\n  const {\n    selectedState,\n    setSelectedState\n  } = (0, _useSelectedState.default)();\n  const [value, setValue, isControlled] = (0, _hooks.useControlled)(valueProp, defaultValue);\n  const {\n    dateField,\n    setDateOffset,\n    setDateField,\n    setNewDate,\n    getDateField,\n    toDateString,\n    isEmptyValue\n  } = (0, _useDateInputState.default)({\n    formatStr,\n    locale: dateLocale,\n    date: value,\n    isControlledDate: isControlled\n  });\n  const {\n    isMoveCursor,\n    isResetValue,\n    increment,\n    reset\n  } = (0, _useFieldCursor.default)(formatStr, valueProp);\n  const dateString = toDateString();\n  const keyPressOptions = (0, _react.useMemo)(() => ({\n    formatStr,\n    localize: dateLocale.localize,\n    selectedMonth: dateField.month,\n    dateString\n  }), [dateField, dateString, formatStr, dateLocale]);\n  const setSelectionRange = (0, _utils2.useInputSelection)(inputRef);\n  const handleChange = (0, _hooks.useEventCallback)((value, event) => {\n    onChange === null || onChange === void 0 || onChange(value, event);\n    setValue(value);\n  });\n  const handleClear = (0, _hooks.useEventCallback)(event => {\n    handleChange(null, event);\n    setNewDate(null);\n    setSelectionRange(0, 0);\n    reset();\n  });\n  const onSegmentChange = (0, _hooks.useEventCallback)((event, nextDirection) => {\n    const input = event.target;\n    const key = event.key;\n    const direction = nextDirection || (key === 'ArrowRight' ? 'right' : 'left');\n    const state = (0, _utils2.getInputSelectedState)({\n      ...keyPressOptions,\n      input,\n      direction\n    });\n    setSelectedState(state);\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n\n    // If the selected field changes, reset the input state\n    if (selectedState.selectedPattern !== state.selectedPattern) {\n      reset();\n    }\n  });\n  const onSegmentValueChange = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    const key = event.key;\n    const offset = key === 'ArrowUp' ? 1 : -1;\n    const state = (0, _utils2.getInputSelectedState)({\n      ...keyPressOptions,\n      input,\n      valueOffset: offset\n    });\n    setSelectedState(state);\n    setDateOffset(state.selectedPattern, offset, date => handleChange(date, event));\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n  });\n  const onSegmentValueChangeWithNumericKeys = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    const key = event.key;\n    const isFunctionKey = key.startsWith('F') && !isNaN(Number(key.slice(1)));\n    if (isFunctionKey) {\n      return;\n    }\n    const pattern = selectedState.selectedPattern;\n    if (!pattern) {\n      return;\n    }\n    const field = getDateField(pattern);\n    const value = parseInt(key, 10);\n    const padValue = parseInt(`${field.value || ''}${key}`, 10);\n    let newValue = value;\n    if ((0, _utils2.validateDateTime)(field.name, padValue) && !isResetValue()) {\n      // Check if the value entered by the user is a valid date\n      newValue = padValue;\n    }\n    setDateField(pattern, newValue, date => handleChange(date, event));\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    const selectedMonth = pattern === 'M' ? newValue : dateField.month;\n    const nextState = (0, _utils2.getInputSelectedState)({\n      ...keyPressOptions,\n      input,\n      selectedMonth\n    });\n    setSelectedState(nextState);\n    setSelectionRange(nextState.selectionStart, nextState.selectionEnd);\n    increment();\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  const onSegmentValueRemove = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    const value = input.value;\n\n    // If the text is all selected, clear the value\n    if (input.selectionStart === 0 && value && input.selectionEnd === value.length) {\n      handleClear(event);\n    } else if (selectedState.selectedPattern) {\n      const nextState = (0, _utils2.getInputSelectedState)({\n        ...keyPressOptions,\n        input,\n        valueOffset: null\n      });\n      setSelectedState(nextState);\n      setSelectionRange(nextState.selectionStart, nextState.selectionEnd);\n      setDateField(selectedState.selectedPattern, null, date => handleChange(date, event));\n      reset();\n    }\n  });\n  const handleClick = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    const state = (0, _utils2.getInputSelectedState)({\n      ...keyPressOptions,\n      input\n    });\n    setSelectedState(state);\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n    if (selectedState.selectedPattern !== state.selectedPattern) {\n      reset();\n    }\n  });\n  const handlePaste = (0, _hooks.useEventCallback)(event => {\n    var _event$clipboardData;\n    event.preventDefault();\n    const pasteText = (_event$clipboardData = event.clipboardData) === null || _event$clipboardData === void 0 ? void 0 : _event$clipboardData.getData('text');\n    const nextDate = parseDate(pasteText, formatStr);\n    if ((0, _date.isValid)(nextDate)) {\n      handleChange(nextDate, event);\n      setNewDate(nextDate);\n    }\n    onPaste === null || onPaste === void 0 || onPaste(event);\n  });\n  const onKeyboardInput = (0, _useKeyboardInputEvent.default)({\n    onSegmentChange,\n    onSegmentValueChange,\n    onSegmentValueChangeWithNumericKeys,\n    onSegmentValueRemove,\n    onKeyDown\n  });\n  const [focused, focusEventProps] = (0, _useIsFocused.default)({\n    onBlur,\n    onFocus\n  });\n  const renderedValue = (0, _react.useMemo)(() => {\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    onPaste: handlePaste,\n    value: renderedValue,\n    placeholder: placeholder || formatStr\n  }, focusEventProps, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 239,\n      columnNumber: 5\n    }\n  }));\n});\nDateInput.displayName = 'DateInput';\nvar _default = exports[\"default\"] = DateInput;\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\");\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 _Input = _interopRequireDefault(__webpack_require__(/*! ../Input */ \"./src/Input/index.tsx\"));\nvar _useDateInputState = _interopRequireDefault(__webpack_require__(/*! ./hooks/useDateInputState */ \"./src/DateInput/hooks/useDateInputState.ts\"));\nvar _useKeyboardInputEvent = _interopRequireDefault(__webpack_require__(/*! ./hooks/useKeyboardInputEvent */ \"./src/DateInput/hooks/useKeyboardInputEvent.ts\"));\nvar _useIsFocused = _interopRequireDefault(__webpack_require__(/*! ./hooks/useIsFocused */ \"./src/DateInput/hooks/useIsFocused.ts\"));\nvar _useFieldCursor = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFieldCursor */ \"./src/DateInput/hooks/useFieldCursor.ts\"));\nvar _useSelectedState = _interopRequireDefault(__webpack_require__(/*! ./hooks/useSelectedState */ \"./src/DateInput/hooks/useSelectedState.ts\"));\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _date = __webpack_require__(/*! ../internals/utils/date */ \"./src/internals/utils/date/index.ts\");\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/DateInput/utils.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DateInput/DateInput.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\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 */\nconst DateInput = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults,\n    parseDate,\n    getLocale\n  } = (0, _hooks.useCustom)('DateInput', props);\n  const {\n    dateLocale,\n    shortDateFormat\n  } = getLocale('DateTimeFormats');\n  const {\n    format: formatStr = shortDateFormat,\n    value: valueProp,\n    defaultValue,\n    placeholder,\n    onChange,\n    onKeyDown,\n    onBlur,\n    onFocus,\n    onPaste,\n    ...rest\n  } = propsWithDefaults;\n  const inputRef = (0, _react.useRef)(null);\n  const {\n    selectedState,\n    setSelectedState\n  } = (0, _useSelectedState.default)();\n  const [value, setValue, isControlled] = (0, _hooks.useControlled)(valueProp, defaultValue);\n  const {\n    dateField,\n    setDateOffset,\n    setDateField,\n    setNewDate,\n    getDateField,\n    toDateString,\n    isEmptyValue\n  } = (0, _useDateInputState.default)({\n    formatStr,\n    locale: dateLocale,\n    date: value,\n    isControlledDate: isControlled\n  });\n  const {\n    isMoveCursor,\n    isResetValue,\n    increment,\n    reset\n  } = (0, _useFieldCursor.default)(formatStr, valueProp);\n  const dateString = toDateString();\n  const keyPressOptions = (0, _react.useMemo)(() => ({\n    formatStr,\n    localize: dateLocale.localize,\n    selectedMonth: dateField.month,\n    dateString\n  }), [dateField, dateString, formatStr, dateLocale]);\n  const setSelectionRange = (0, _utils2.useInputSelection)(inputRef);\n  const handleChange = (0, _hooks.useEventCallback)((value, event) => {\n    onChange === null || onChange === void 0 || onChange(value, event);\n    setValue(value);\n  });\n  const handleClear = (0, _hooks.useEventCallback)(event => {\n    handleChange(null, event);\n    setNewDate(null);\n    setSelectionRange(0, 0);\n    reset();\n  });\n  const onSegmentChange = (0, _hooks.useEventCallback)((event, nextDirection) => {\n    const input = event.target;\n    const key = event.key;\n    const direction = nextDirection || (key === 'ArrowRight' ? 'right' : 'left');\n    const state = (0, _utils2.getInputSelectedState)({\n      ...keyPressOptions,\n      input,\n      direction\n    });\n    setSelectedState(state);\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n\n    // If the selected field changes, reset the input state\n    if (selectedState.selectedPattern !== state.selectedPattern) {\n      reset();\n    }\n  });\n  const onSegmentValueChange = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    const key = event.key;\n    const offset = key === 'ArrowUp' ? 1 : -1;\n    const state = (0, _utils2.getInputSelectedState)({\n      ...keyPressOptions,\n      input,\n      valueOffset: offset\n    });\n    setSelectedState(state);\n    setDateOffset(state.selectedPattern, offset, date => handleChange(date, event));\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n  });\n  const onSegmentValueChangeWithNumericKeys = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    const key = event.key;\n    const isFunctionKey = key.startsWith('F') && !isNaN(Number(key.slice(1)));\n    if (isFunctionKey) {\n      return;\n    }\n    const pattern = selectedState.selectedPattern;\n    if (!pattern) {\n      return;\n    }\n    const field = getDateField(pattern);\n    const value = parseInt(key, 10);\n    const padValue = parseInt(`${field.value || ''}${key}`, 10);\n    let newValue = value;\n    if ((0, _utils2.validateDateTime)(field.name, padValue) && !isResetValue()) {\n      // Check if the value entered by the user is a valid date\n      newValue = padValue;\n    }\n    setDateField(pattern, newValue, date => handleChange(date, event));\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    const selectedMonth = pattern === 'M' ? newValue : dateField.month;\n    const nextState = (0, _utils2.getInputSelectedState)({\n      ...keyPressOptions,\n      input,\n      selectedMonth\n    });\n    setSelectedState(nextState);\n    setSelectionRange(nextState.selectionStart, nextState.selectionEnd);\n    increment();\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  const onSegmentValueRemove = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    const value = input.value;\n\n    // If the text is all selected, clear the value\n    if (input.selectionStart === 0 && value && input.selectionEnd === value.length) {\n      handleClear(event);\n    } else if (selectedState.selectedPattern) {\n      const nextState = (0, _utils2.getInputSelectedState)({\n        ...keyPressOptions,\n        input,\n        valueOffset: null\n      });\n      setSelectedState(nextState);\n      setSelectionRange(nextState.selectionStart, nextState.selectionEnd);\n      setDateField(selectedState.selectedPattern, null, date => handleChange(date, event));\n      reset();\n    }\n  });\n  const onAmPmToggle = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    const key = event.key.toLowerCase();\n\n    // Only handle 'a' or 'p' keys when the selected pattern is 'a' (AM/PM)\n    if (selectedState.selectedPattern === 'a' && (key === 'a' || key === 'p')) {\n      const currentHour = dateField.hour || 0;\n      const isAM = currentHour < 12;\n      const isPM = currentHour >= 12;\n\n      // Toggle AM/PM based on the key pressed\n      // 'a' key -> set to AM, 'p' key -> set to PM\n      if (key === 'a' && isPM || key === 'p' && isAM) {\n        const state = (0, _utils2.getInputSelectedState)({\n          ...keyPressOptions,\n          input\n        });\n        setSelectedState(state);\n        setDateOffset('a', 1, date => handleChange(date, event));\n        setSelectionRange(state.selectionStart, state.selectionEnd);\n      }\n    }\n  });\n  const handleClick = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    const state = (0, _utils2.getInputSelectedState)({\n      ...keyPressOptions,\n      input\n    });\n    setSelectedState(state);\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n    if (selectedState.selectedPattern !== state.selectedPattern) {\n      reset();\n    }\n  });\n  const handlePaste = (0, _hooks.useEventCallback)(event => {\n    var _event$clipboardData;\n    event.preventDefault();\n    const pasteText = (_event$clipboardData = event.clipboardData) === null || _event$clipboardData === void 0 ? void 0 : _event$clipboardData.getData('text');\n    const nextDate = parseDate(pasteText, formatStr);\n    if ((0, _date.isValid)(nextDate)) {\n      handleChange(nextDate, event);\n      setNewDate(nextDate);\n    }\n    onPaste === null || onPaste === void 0 || onPaste(event);\n  });\n  const onKeyboardInput = (0, _useKeyboardInputEvent.default)({\n    onSegmentChange,\n    onSegmentValueChange,\n    onSegmentValueChangeWithNumericKeys,\n    onSegmentValueRemove,\n    onAmPmToggle,\n    onKeyDown\n  });\n  const [focused, focusEventProps] = (0, _useIsFocused.default)({\n    onBlur,\n    onFocus\n  });\n  const renderedValue = (0, _react.useMemo)(() => {\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    onPaste: handlePaste,\n    value: renderedValue,\n    placeholder: placeholder || formatStr\n  }, focusEventProps, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 261,\n      columnNumber: 5\n    }\n  }));\n});\nDateInput.displayName = 'DateInput';\nvar _default = exports[\"default\"] = DateInput;\n\n//# sourceURL=webpack://rsuite/./src/DateInput/DateInput.tsx?");
 
 /***/ }),
 
@@ -2358,7 +2369,7 @@ eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nexports.us
 /***/ (function(__unused_webpack_module, exports) {
 
 "use strict";
-eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nexports.useKeyboardInputEvent = useKeyboardInputEvent;\nfunction useKeyboardInputEvent({\n  onSegmentChange,\n  onSegmentValueChange,\n  onSegmentValueChangeWithNumericKeys,\n  onSegmentValueRemove,\n  onKeyDown\n}) {\n  return event => {\n    var _key$match, _key$match2;\n    const key = event.key;\n    switch (key) {\n      case 'ArrowRight':\n      case 'ArrowLeft':\n        onSegmentChange === null || onSegmentChange === void 0 || onSegmentChange(event);\n        event.preventDefault();\n        break;\n      case 'ArrowUp':\n      case 'ArrowDown':\n        onSegmentValueChange === null || onSegmentValueChange === void 0 || onSegmentValueChange(event);\n        event.preventDefault();\n        break;\n      case 'Backspace':\n        onSegmentValueRemove === null || onSegmentValueRemove === 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 || onSegmentValueChangeWithNumericKeys(event);\n        event.preventDefault();\n        break;\n      case (_key$match2 = key.match(/[a-z]/)) === null || _key$match2 === void 0 ? void 0 : _key$match2[0]:\n        // Determine whether the Ctrl or Command key is pressed, does not affect user copy and paste\n        if (event.ctrlKey || event.metaKey) {\n          break;\n        }\n\n        // Prevent letters from being entered\n        event.preventDefault();\n        break;\n    }\n    onKeyDown === null || onKeyDown === void 0 || onKeyDown(event);\n  };\n}\nvar _default = exports[\"default\"] = useKeyboardInputEvent;\n\n//# sourceURL=webpack://rsuite/./src/DateInput/hooks/useKeyboardInputEvent.ts?");
+eval("\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\nexports.useKeyboardInputEvent = useKeyboardInputEvent;\nfunction useKeyboardInputEvent({\n  onSegmentChange,\n  onSegmentValueChange,\n  onSegmentValueChangeWithNumericKeys,\n  onSegmentValueRemove,\n  onAmPmToggle,\n  onKeyDown\n}) {\n  return event => {\n    var _key$match, _key$match2;\n    const key = event.key;\n    switch (key) {\n      case 'ArrowRight':\n      case 'ArrowLeft':\n        onSegmentChange === null || onSegmentChange === void 0 || onSegmentChange(event);\n        event.preventDefault();\n        break;\n      case 'ArrowUp':\n      case 'ArrowDown':\n        onSegmentValueChange === null || onSegmentValueChange === void 0 || onSegmentValueChange(event);\n        event.preventDefault();\n        break;\n      case 'Backspace':\n        onSegmentValueRemove === null || onSegmentValueRemove === 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 || onSegmentValueChangeWithNumericKeys(event);\n        event.preventDefault();\n        break;\n      case 'a':\n      case 'p':\n      case 'A':\n      case 'P':\n        // Determine whether the Ctrl or Command key is pressed, does not affect user copy and paste\n        if (event.ctrlKey || event.metaKey) {\n          break;\n        }\n\n        // Handle AM/PM toggle with 'a' or 'p' keys\n        onAmPmToggle === null || onAmPmToggle === void 0 || onAmPmToggle(event);\n        event.preventDefault();\n        break;\n      case (_key$match2 = key.match(/[a-z]/)) === null || _key$match2 === void 0 ? void 0 : _key$match2[0]:\n        // Determine whether the Ctrl or Command key is pressed, does not affect user copy and paste\n        if (event.ctrlKey || event.metaKey) {\n          break;\n        }\n\n        // Prevent letters from being entered\n        event.preventDefault();\n        break;\n    }\n    onKeyDown === null || onKeyDown === void 0 || onKeyDown(event);\n  };\n}\nvar _default = exports[\"default\"] = useKeyboardInputEvent;\n\n//# sourceURL=webpack://rsuite/./src/DateInput/hooks/useKeyboardInputEvent.ts?");
 
 /***/ }),
 
@@ -2402,7 +2413,7 @@ eval("\n\nexports.__esModule = true;\nexports.getDatePattern = getDatePattern;\n
 /***/ (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 = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\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 _CalenderSimple = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/CalenderSimple */ \"./node_modules/@rsuite/icons/esm/react/CalenderSimple.js\"));\nvar _Time = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/Time */ \"./node_modules/@rsuite/icons/esm/react/Time.js\"));\nvar _CalendarContainer = _interopRequireDefault(__webpack_require__(/*! ../Calendar/CalendarContainer */ \"./src/Calendar/CalendarContainer.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 _DateInput = _interopRequireDefault(__webpack_require__(/*! ../DateInput */ \"./src/DateInput/index.tsx\"));\nvar _InputGroup = _interopRequireDefault(__webpack_require__(/*! ../InputGroup */ \"./src/InputGroup/index.tsx\"));\nvar _useMonthView = _interopRequireDefault(__webpack_require__(/*! ./hooks/useMonthView */ \"./src/DatePicker/hooks/useMonthView.ts\"));\nvar _useFocus = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFocus */ \"./src/DatePicker/hooks/useFocus.ts\"));\nvar _useCustomizedInput = _interopRequireDefault(__webpack_require__(/*! ./hooks/useCustomizedInput */ \"./src/DatePicker/hooks/useCustomizedInput.ts\"));\nvar _Box = _interopRequireDefault(__webpack_require__(/*! ../internals/Box */ \"./src/internals/Box/index.tsx\"));\nvar _hooks = __webpack_require__(/*! ../Calendar/hooks */ \"./src/Calendar/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../Calendar/utils */ \"./src/Calendar/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _hooks2 = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _date = __webpack_require__(/*! ../internals/utils/date */ \"./src/internals/utils/date/index.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 _utils3 = __webpack_require__(/*! ./utils */ \"./src/DatePicker/utils.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DatePicker/DatePicker.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\n/**\n * A date picker allows users to select a date from a calendar.\n *\n * @see https://rsuitejs.com/components/date-picker\n */\nconst DatePicker = (0, _utils2.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks2.useCustom)('DatePicker', props);\n  const {\n    as,\n    block,\n    className,\n    classPrefix = 'picker',\n    calendarDefaultDate,\n    cleanable = true,\n    caretAs: caretAsProp,\n    editable = true,\n    defaultValue,\n    disabled,\n    readOnly: readOnly,\n    plaintext,\n    format,\n    id: idProp,\n    isoWeek,\n    weekStart,\n    limitEndYear = 1000,\n    limitStartYear,\n    locale,\n    loading,\n    label,\n    popupClassName,\n    popupStyle,\n    appearance = 'default',\n    placement = 'bottomStart',\n    oneTap,\n    placeholder = '',\n    ranges,\n    value: valueProp,\n    showMeridiem,\n    showWeekNumbers,\n    style,\n    size,\n    monthDropdownProps,\n    shouldDisableDate,\n    shouldDisableHour,\n    shouldDisableMinute,\n    shouldDisableSecond,\n    onChange,\n    onChangeCalendarDate,\n    onClean,\n    onEnter,\n    onExit,\n    onNextMonth,\n    onOk,\n    onPrevMonth,\n    onSelect,\n    onToggleMonthDropdown,\n    onToggleTimeDropdown,\n    onShortcutClick,\n    renderCell,\n    renderValue,\n    ...restProps\n  } = propsWithDefaults;\n  const id = (0, _hooks2.useUniqueId)('rs-', idProp);\n  const {\n    trigger,\n    root,\n    target,\n    overlay\n  } = (0, _Picker.usePickerRef)(ref);\n  const formatStr = format || (locale === null || locale === void 0 ? void 0 : locale.shortDateFormat) || 'yyyy-MM-dd';\n  const {\n    merge,\n    prefix\n  } = (0, _hooks2.useStyles)(classPrefix);\n  const [value, setValue] = (0, _hooks2.useControlled)(valueProp, defaultValue);\n  const {\n    calendarDate,\n    setCalendarDate,\n    resetCalendarDate\n  } = (0, _hooks.useCalendarDate)(value, calendarDefaultDate);\n  const {\n    setMonthView,\n    monthView,\n    toggleMonthView\n  } = (0, _useMonthView.default)({\n    onToggleMonthDropdown\n  });\n  const {\n    mode\n  } = (0, _date.useDateMode)(formatStr);\n\n  // Show only the calendar month panel. formatStr = 'yyyy-MM'\n  const showMonth = mode === _date.DateMode.Month || monthView;\n  const {\n    focusInput,\n    focusSelectedDate,\n    onKeyFocusEvent\n  } = (0, _useFocus.default)({\n    target,\n    showMonth,\n    id,\n    locale\n  });\n\n  /**\n   * Check whether the date is disabled.\n   */\n  const isDateDisabled = date => {\n    if (typeof shouldDisableDate === 'function') {\n      return shouldDisableDate(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  const isDatetimeDisabled = date => {\n    return (isDateDisabled === null || isDateDisabled === void 0 ? void 0 : isDateDisabled(date)) || (0, _date.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  const isMonthDisabled = date => {\n    return (0, _utils.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  const isOkButtonDisabled = selectedDate => {\n    if (mode === _date.DateMode.Month) {\n      return isMonthDisabled(selectedDate);\n    }\n    return isDatetimeDisabled(selectedDate);\n  };\n  const isErrorValue = value => {\n    if (!(0, _date.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  const handleMoveForward = (0, _hooks2.useEventCallback)(nextPageDate => {\n    setCalendarDate(nextPageDate);\n    onNextMonth === null || onNextMonth === void 0 || onNextMonth(nextPageDate);\n    onChangeCalendarDate === null || onChangeCalendarDate === void 0 || onChangeCalendarDate(nextPageDate);\n  });\n\n  /**\n   * Switch to the callback triggered after the previous month.\n   */\n  const handleMoveBackward = (0, _hooks2.useEventCallback)(nextPageDate => {\n    setCalendarDate(nextPageDate);\n    onPrevMonth === null || onPrevMonth === void 0 || onPrevMonth(nextPageDate);\n    onChangeCalendarDate === null || onChangeCalendarDate === void 0 || onChangeCalendarDate(nextPageDate);\n  });\n\n  /**\n   * The callback triggered when the date changes.\n   */\n  const handleDateChange = (0, _hooks2.useEventCallback)((nextValue, event) => {\n    onSelect === null || onSelect === void 0 || onSelect(nextValue, event);\n    onChangeCalendarDate === null || onChangeCalendarDate === void 0 || onChangeCalendarDate(nextValue, event);\n  });\n\n  /**\n   *  A callback triggered when the time on the calendar changes.\n   */\n  const handleChangeTime = (0, _hooks2.useEventCallback)(nextPageTime => {\n    setCalendarDate(nextPageTime);\n    handleDateChange(nextPageTime);\n  });\n\n  /**\n   * Close the calendar panel.\n   */\n  const handleClose = (0, _hooks2.useEventCallback)(() => {\n    var _trigger$current, _trigger$current$clos;\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 || (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 || _trigger$current$clos.call(_trigger$current);\n  });\n  const updateValue = (event, date, closeOverlay = true) => {\n    const nextValue = typeof date !== 'undefined' ? date : calendarDate;\n    setCalendarDate(nextValue || (0, _date.startOfToday)());\n    setValue(nextValue);\n    if (nextValue !== value) {\n      onChange === null || onChange === 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  const handleShortcutPageDate = (0, _hooks2.useEventCallback)((range, closeOverlay, event) => {\n    const value = range.value;\n    updateValue(event, value, closeOverlay);\n    handleDateChange(value, event);\n    onShortcutClick === null || onShortcutClick === void 0 || onShortcutClick(range, event);\n  });\n\n  /**\n   * The callback triggered after clicking the OK button.\n   */\n  const handleOK = (0, _hooks2.useEventCallback)(event => {\n    updateValue(event);\n    onOk === null || onOk === void 0 || onOk(calendarDate, event);\n    focusInput();\n  });\n\n  /**\n   * Callback after clicking the clear button.\n   */\n\n  const handleClean = (0, _hooks2.useEventCallback)(event => {\n    event === null || event === void 0 || event.stopPropagation();\n    updateValue(event, null);\n    resetCalendarDate(null);\n    onClean === null || onClean === void 0 || onClean(event);\n  });\n  const handlePickerPopupKeyDown = (0, _hooks2.useEventCallback)(event => {\n    onKeyFocusEvent(event, {\n      date: calendarDate,\n      callback: setCalendarDate\n    });\n    if (event.key === 'Enter') {\n      handleOK(event);\n    }\n  });\n  const handleClick = (0, _hooks2.useEventCallback)(() => {\n    if (editable) {\n      return;\n    }\n    focusSelectedDate();\n  });\n\n  /**\n   * Callback after the date is selected.\n   */\n  const handleCalendarSelect = (0, _hooks2.useEventCallback)((date, event, updatableValue = true) => {\n    const nextValue = (0, _date.copyTime)({\n      from: calendarDate,\n      to: date\n    });\n    setCalendarDate(nextValue);\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  const handleChangeMonth = (0, _hooks2.useEventCallback)((nextPageDate, event) => {\n    setCalendarDate(nextPageDate);\n    handleDateChange(nextPageDate);\n    focusSelectedDate();\n    if (oneTap && mode === _date.DateMode.Month) {\n      updateValue(event, nextPageDate);\n      focusInput();\n    }\n  });\n\n  /**\n   * Callback after the input box value is changed.\n   */\n  const handleInputChange = (0, _hooks2.useEventCallback)((value, event) => {\n    if (!isErrorValue(value)) {\n      handleCalendarSelect(value, event);\n    }\n    updateValue(event, value, false);\n  });\n  const handleInputKeyDown = (0, _hooks2.useEventCallback)(event => {\n    (0, _Picker.onMenuKeyDown)(event, {\n      esc: handleClose,\n      enter: () => {\n        var _trigger$current2;\n        const {\n          open\n        } = ((_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : _trigger$current2.getState()) || {};\n        if (open) {\n          if ((0, _date.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 || _trigger$current3.open();\n        }\n      }\n    });\n  });\n  const calendarProps = (0, _mapValues.default)((0, _pick.default)(props, _date.calendarOnlyProps), func => (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  const {\n    sideRanges,\n    bottomRanges\n  } = (0, _utils3.splitRanges)(ranges);\n  const renderCalendarOverlay = (positionProps, speakerRef) => {\n    const {\n      className\n    } = positionProps;\n    const classes = merge(popupClassName, className, prefix('popup-date'));\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, _utils2.mergeRefs)(overlay, speakerRef),\n      style: popupStyle,\n      target: trigger,\n      onKeyDown: handlePickerPopupKeyDown,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 572,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Stack.default, {\n      align: \"flex-start\",\n      h: \"100%\",\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 582,\n        columnNumber: 9\n      }\n    }, sideRanges && 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: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 584,\n        columnNumber: 13\n      }\n    }), /*#__PURE__*/_react.default.createElement(_Box.default, {\n      className: prefix('box'),\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 596,\n        columnNumber: 11\n      }\n    }, /*#__PURE__*/_react.default.createElement(_CalendarContainer.default, (0, _extends2.default)({}, calendarProps, {\n      targetId: id,\n      locale: locale,\n      showWeekNumbers: showWeekNumbers,\n      showMeridiem: showMeridiem,\n      disabledDate: isDateDisabled,\n      disabledHours: shouldDisableHour,\n      disabledMinutes: shouldDisableMinute,\n      disabledSeconds: shouldDisableSecond,\n      limitEndYear: limitEndYear,\n      limitStartYear: limitStartYear,\n      format: formatStr,\n      isoWeek: isoWeek,\n      weekStart: weekStart,\n      calendarDate: calendarDate,\n      monthDropdownProps: monthDropdownProps,\n      renderCellOnPicker: renderCell,\n      onMoveForward: handleMoveForward,\n      onMoveBackward: handleMoveBackward,\n      onSelect: handleCalendarSelect,\n      onToggleMonthDropdown: toggleMonthView,\n      onToggleTimeDropdown: onToggleTimeDropdown,\n      onChangeMonth: handleChangeMonth,\n      onChangeTime: handleChangeTime,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 597,\n        columnNumber: 13\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: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 623,\n        columnNumber: 13\n      }\n    }))));\n  };\n  const hasValue = (0, _date.isValid)(value);\n  const caretAs = (0, _react.useMemo)(() => {\n    if (caretAsProp === null) {\n      return null;\n    }\n    return caretAsProp || (mode === _date.DateMode.Time ? _Time.default : _CalenderSimple.default);\n  }, [caretAsProp, mode]);\n  const handleTriggerClose = (0, _hooks2.useEventCallback)(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 || _props$onClose.call(props);\n  });\n  const showCleanButton = cleanable && hasValue && !readOnly;\n  const [ariaProps, rest] = (0, _utils2.partitionHTMLProps)(restProps, {\n    htmlProps: [],\n    includeAria: true\n  });\n  const invalidValue = value && isErrorValue(value);\n  const customizedProps = {\n    value,\n    formatStr,\n    renderValue,\n    readOnly,\n    editable,\n    loading\n  };\n  const {\n    customValue,\n    inputReadOnly,\n    Input,\n    events\n  } = (0, _useCustomizedInput.default)(customizedProps);\n  const triggerProps = {\n    ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n    onClose: handleTriggerClose,\n    onEnter: (0, _utils2.createChainedFunction)(events.onActive, onEnter),\n    onExit: (0, _utils2.createChainedFunction)(events.onInactive, onExit)\n  };\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    as: as,\n    name: \"date\",\n    classPrefix: classPrefix,\n    className: merge(className, {\n      [prefix('error')]: invalidValue\n    }),\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    style: style,\n    rootRef: root,\n    trigger: \"active\",\n    triggerProps: triggerProps,\n    ref: trigger,\n    placement: placement,\n    speaker: renderCalendarOverlay,\n    \"data-cleanable\": cleanable,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 675,\n      columnNumber: 5\n    }\n  }, plaintext ? /*#__PURE__*/_react.default.createElement(_DateInput.default, {\n    value: value,\n    format: formatStr,\n    plaintext: plaintext,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 693,\n      columnNumber: 9\n    }\n  }) : /*#__PURE__*/_react.default.createElement(_InputGroup.default, (0, _extends2.default)({}, (0, _utils3.getRestProps)(rest), {\n    inside: true,\n    size: size,\n    disabled: disabled,\n    className: prefix`input-group`,\n    onClick: handleClick,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 695,\n      columnNumber: 9\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Picker.PickerLabel, {\n    className: prefix`label`,\n    id: `${id}-label`,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 703,\n      columnNumber: 11\n    }\n  }, label), /*#__PURE__*/_react.default.createElement(Input, (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    readOnly: inputReadOnly,\n    onChange: handleInputChange,\n    onKeyDown: handleInputKeyDown,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 706,\n      columnNumber: 11\n    }\n  })), /*#__PURE__*/_react.default.createElement(_Picker.PickerIndicator, {\n    size: size,\n    loading: loading,\n    caretAs: caretAs,\n    onClose: handleClean,\n    showCleanButton: showCleanButton,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 722,\n      columnNumber: 11\n    }\n  })));\n});\nDatePicker.displayName = 'DatePicker';\nvar _default = exports[\"default\"] = DatePicker;\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\");\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 _mapValues = _interopRequireDefault(__webpack_require__(/*! lodash/mapValues */ \"./node_modules/lodash/mapValues.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _CalenderSimple = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/CalenderSimple */ \"./node_modules/@rsuite/icons/esm/react/CalenderSimple.js\"));\nvar _Time = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/Time */ \"./node_modules/@rsuite/icons/esm/react/Time.js\"));\nvar _CalendarContainer = _interopRequireDefault(__webpack_require__(/*! ../Calendar/CalendarContainer */ \"./src/Calendar/CalendarContainer.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 _DateInput = _interopRequireDefault(__webpack_require__(/*! ../DateInput */ \"./src/DateInput/index.tsx\"));\nvar _InputGroup = _interopRequireDefault(__webpack_require__(/*! ../InputGroup */ \"./src/InputGroup/index.tsx\"));\nvar _useMonthView = _interopRequireDefault(__webpack_require__(/*! ./hooks/useMonthView */ \"./src/DatePicker/hooks/useMonthView.ts\"));\nvar _useFocus = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFocus */ \"./src/DatePicker/hooks/useFocus.ts\"));\nvar _useCustomizedInput = _interopRequireDefault(__webpack_require__(/*! ./hooks/useCustomizedInput */ \"./src/DatePicker/hooks/useCustomizedInput.ts\"));\nvar _Box = _interopRequireDefault(__webpack_require__(/*! ../internals/Box */ \"./src/internals/Box/index.tsx\"));\nvar _hooks = __webpack_require__(/*! ../Calendar/hooks */ \"./src/Calendar/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../Calendar/utils */ \"./src/Calendar/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _hooks2 = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _date = __webpack_require__(/*! ../internals/utils/date */ \"./src/internals/utils/date/index.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 _utils3 = __webpack_require__(/*! ./utils */ \"./src/DatePicker/utils.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DatePicker/DatePicker.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\n/**\n * A date picker allows users to select a date from a calendar.\n *\n * @see https://rsuitejs.com/components/date-picker\n */\nconst DatePicker = (0, _utils2.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks2.useCustom)('DatePicker', props);\n  const {\n    as,\n    block,\n    className,\n    classPrefix = 'picker',\n    calendarDefaultDate,\n    cleanable = true,\n    caretAs: caretAsProp,\n    editable = true,\n    defaultValue,\n    disabled,\n    readOnly: readOnly,\n    plaintext,\n    format,\n    id: idProp,\n    isoWeek,\n    weekStart,\n    limitEndYear = 1000,\n    limitStartYear,\n    locale,\n    loading,\n    label,\n    popupClassName,\n    popupStyle,\n    appearance = 'default',\n    placement = 'bottomStart',\n    oneTap,\n    placeholder = '',\n    ranges,\n    value: valueProp,\n    showMeridiem,\n    showWeekNumbers,\n    style,\n    size,\n    monthDropdownProps,\n    shouldDisableDate,\n    shouldDisableHour,\n    shouldDisableMinute,\n    shouldDisableSecond,\n    onChange,\n    onChangeCalendarDate,\n    onClean,\n    onEnter,\n    onExit,\n    onNextMonth,\n    onOk,\n    onPrevMonth,\n    onSelect,\n    onToggleMonthDropdown,\n    onToggleTimeDropdown,\n    onShortcutClick,\n    renderCell,\n    renderValue,\n    ...restProps\n  } = propsWithDefaults;\n  const id = (0, _hooks2.useUniqueId)('rs-', idProp);\n  const {\n    trigger,\n    root,\n    target,\n    overlay\n  } = (0, _Picker.usePickerRef)(ref);\n  const formatStr = format || (locale === null || locale === void 0 ? void 0 : locale.shortDateFormat) || 'yyyy-MM-dd';\n  const {\n    merge,\n    prefix\n  } = (0, _hooks2.useStyles)(classPrefix);\n  const [value, setValue] = (0, _hooks2.useControlled)(valueProp, defaultValue);\n  const {\n    calendarDate,\n    setCalendarDate,\n    resetCalendarDate\n  } = (0, _hooks.useCalendarDate)(value, calendarDefaultDate);\n  const {\n    setMonthView,\n    monthView,\n    toggleMonthView\n  } = (0, _useMonthView.default)({\n    onToggleMonthDropdown\n  });\n  const {\n    mode\n  } = (0, _date.useDateMode)(formatStr);\n\n  // Show only the calendar month panel. formatStr = 'yyyy-MM'\n  const showMonth = mode === _date.DateMode.Month || monthView;\n  const {\n    focusInput,\n    focusSelectedDate,\n    onKeyFocusEvent\n  } = (0, _useFocus.default)({\n    target,\n    showMonth,\n    id,\n    locale\n  });\n\n  /**\n   * Check whether the date is disabled.\n   */\n  const isDateDisabled = date => {\n    if (typeof shouldDisableDate === 'function') {\n      return shouldDisableDate(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  const isDatetimeDisabled = date => {\n    return (isDateDisabled === null || isDateDisabled === void 0 ? void 0 : isDateDisabled(date)) || (0, _date.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  const isMonthDisabled = date => {\n    return (0, _utils.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  const isOkButtonDisabled = selectedDate => {\n    if (mode === _date.DateMode.Month) {\n      return isMonthDisabled(selectedDate);\n    }\n    return isDatetimeDisabled(selectedDate);\n  };\n  const isErrorValue = value => {\n    if (!(0, _date.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  const handleMoveForward = (0, _hooks2.useEventCallback)(nextPageDate => {\n    setCalendarDate(nextPageDate);\n    onNextMonth === null || onNextMonth === void 0 || onNextMonth(nextPageDate);\n    onChangeCalendarDate === null || onChangeCalendarDate === void 0 || onChangeCalendarDate(nextPageDate);\n  });\n\n  /**\n   * Switch to the callback triggered after the previous month.\n   */\n  const handleMoveBackward = (0, _hooks2.useEventCallback)(nextPageDate => {\n    setCalendarDate(nextPageDate);\n    onPrevMonth === null || onPrevMonth === void 0 || onPrevMonth(nextPageDate);\n    onChangeCalendarDate === null || onChangeCalendarDate === void 0 || onChangeCalendarDate(nextPageDate);\n  });\n\n  /**\n   * The callback triggered when the date changes.\n   */\n  const handleDateChange = (0, _hooks2.useEventCallback)((nextValue, event) => {\n    onSelect === null || onSelect === void 0 || onSelect(nextValue, event);\n    onChangeCalendarDate === null || onChangeCalendarDate === void 0 || onChangeCalendarDate(nextValue, event);\n  });\n\n  /**\n   *  A callback triggered when the time on the calendar changes.\n   */\n  const handleChangeTime = (0, _hooks2.useEventCallback)(nextPageTime => {\n    setCalendarDate(nextPageTime);\n    handleDateChange(nextPageTime);\n  });\n\n  /**\n   * Close the calendar panel.\n   */\n  const handleClose = (0, _hooks2.useEventCallback)(() => {\n    var _trigger$current, _trigger$current$clos;\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 || (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 || _trigger$current$clos.call(_trigger$current);\n  });\n  const updateValue = (event, date, closeOverlay = true) => {\n    const nextValue = typeof date !== 'undefined' ? date : calendarDate;\n    setCalendarDate(nextValue || (0, _date.startOfToday)());\n    setValue(nextValue);\n    if (nextValue !== value) {\n      onChange === null || onChange === 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  const handleShortcutPageDate = (0, _hooks2.useEventCallback)((range, closeOverlay, event) => {\n    const value = range.value;\n    updateValue(event, value, closeOverlay);\n    handleDateChange(value, event);\n    onShortcutClick === null || onShortcutClick === void 0 || onShortcutClick(range, event);\n  });\n\n  /**\n   * The callback triggered after clicking the OK button.\n   */\n  const handleOK = (0, _hooks2.useEventCallback)(event => {\n    updateValue(event);\n    onOk === null || onOk === void 0 || onOk(calendarDate, event);\n    focusInput();\n  });\n\n  /**\n   * Callback after clicking the clear button.\n   */\n\n  const handleClean = (0, _hooks2.useEventCallback)(event => {\n    event === null || event === void 0 || event.stopPropagation();\n    updateValue(event, null);\n    resetCalendarDate(null);\n    onClean === null || onClean === void 0 || onClean(event);\n  });\n  const handlePickerPopupKeyDown = (0, _hooks2.useEventCallback)(event => {\n    onKeyFocusEvent(event, {\n      date: calendarDate,\n      callback: setCalendarDate\n    });\n    if (event.key === 'Enter') {\n      handleOK(event);\n    }\n  });\n  const handleClick = (0, _hooks2.useEventCallback)(() => {\n    if (editable) {\n      return;\n    }\n    focusSelectedDate();\n  });\n\n  /**\n   * Callback after the date is selected.\n   */\n  const handleCalendarSelect = (0, _hooks2.useEventCallback)((date, event, updatableValue = true) => {\n    const nextValue = (0, _date.copyTime)({\n      from: calendarDate,\n      to: date\n    });\n    setCalendarDate(nextValue);\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  const handleChangeMonth = (0, _hooks2.useEventCallback)((nextPageDate, event) => {\n    setCalendarDate(nextPageDate);\n    handleDateChange(nextPageDate);\n    focusSelectedDate();\n    if (oneTap && mode === _date.DateMode.Month) {\n      updateValue(event, nextPageDate);\n      focusInput();\n    }\n  });\n\n  /**\n   * Callback after the input box value is changed.\n   */\n  const handleInputChange = (0, _hooks2.useEventCallback)((value, event) => {\n    if (!isErrorValue(value)) {\n      handleCalendarSelect(value, event);\n    }\n    updateValue(event, value, false);\n  });\n  const handleInputKeyDown = (0, _hooks2.useEventCallback)(event => {\n    (0, _Picker.onMenuKeyDown)(event, {\n      esc: handleClose,\n      enter: () => {\n        var _trigger$current2;\n        const {\n          open\n        } = ((_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : _trigger$current2.getState()) || {};\n        if (open) {\n          if ((0, _date.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 || _trigger$current3.open();\n        }\n      }\n    });\n  });\n  const calendarProps = (0, _mapValues.default)((0, _pick.default)(props, _date.calendarOnlyProps), func => (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  const {\n    sideRanges,\n    bottomRanges\n  } = (0, _utils3.splitRanges)(ranges);\n  const renderCalendarOverlay = (positionProps, speakerRef) => {\n    const {\n      className\n    } = positionProps;\n    const classes = merge(popupClassName, className, prefix('popup-date'));\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, _utils2.mergeRefs)(overlay, speakerRef),\n      style: popupStyle,\n      target: trigger,\n      onKeyDown: handlePickerPopupKeyDown,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 572,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Stack.default, {\n      align: \"flex-start\",\n      h: \"100%\",\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 582,\n        columnNumber: 9\n      }\n    }, sideRanges && 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: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 584,\n        columnNumber: 13\n      }\n    }), /*#__PURE__*/_react.default.createElement(_Box.default, {\n      className: prefix('box'),\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 596,\n        columnNumber: 11\n      }\n    }, /*#__PURE__*/_react.default.createElement(_CalendarContainer.default, (0, _extends2.default)({}, calendarProps, {\n      targetId: id,\n      locale: locale,\n      showWeekNumbers: showWeekNumbers,\n      showMeridiem: showMeridiem,\n      disabledDate: isDateDisabled,\n      disabledHours: shouldDisableHour,\n      disabledMinutes: shouldDisableMinute,\n      disabledSeconds: shouldDisableSecond,\n      limitEndYear: limitEndYear,\n      limitStartYear: limitStartYear,\n      format: formatStr,\n      isoWeek: isoWeek,\n      weekStart: weekStart,\n      calendarDate: calendarDate,\n      monthDropdownProps: monthDropdownProps,\n      renderCellOnPicker: renderCell,\n      onMoveForward: handleMoveForward,\n      onMoveBackward: handleMoveBackward,\n      onSelect: handleCalendarSelect,\n      onToggleMonthDropdown: toggleMonthView,\n      onToggleTimeDropdown: onToggleTimeDropdown,\n      onChangeMonth: handleChangeMonth,\n      onChangeTime: handleChangeTime,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 597,\n        columnNumber: 13\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: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 623,\n        columnNumber: 13\n      }\n    }))));\n  };\n  const hasValue = (0, _date.isValid)(value);\n  const caretAs = (0, _react.useMemo)(() => {\n    if (caretAsProp === null) {\n      return null;\n    }\n    return caretAsProp || (mode === _date.DateMode.Time ? _Time.default : _CalenderSimple.default);\n  }, [caretAsProp, mode]);\n  const handleTriggerClose = (0, _hooks2.useEventCallback)(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 || _props$onClose.call(props);\n  });\n  const showCleanButton = cleanable && hasValue && !readOnly;\n  const [ariaProps, rest] = (0, _utils2.partitionHTMLProps)(restProps, {\n    htmlProps: [],\n    includeAria: true\n  });\n  const invalidValue = value && isErrorValue(value);\n  const customizedProps = {\n    value,\n    formatStr,\n    renderValue,\n    readOnly,\n    editable,\n    loading\n  };\n  const {\n    customValue,\n    inputReadOnly,\n    Input,\n    events\n  } = (0, _useCustomizedInput.default)(customizedProps);\n  const triggerProps = {\n    ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n    onClose: handleTriggerClose,\n    onEnter: (0, _utils2.createChainedFunction)(events.onActive, onEnter),\n    onExit: (0, _utils2.createChainedFunction)(events.onInactive, onExit)\n  };\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    as: as,\n    pickerType: \"date\",\n    classPrefix: classPrefix,\n    className: merge(className, {\n      [prefix('error')]: invalidValue\n    }),\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    style: style,\n    rootRef: root,\n    trigger: \"active\",\n    triggerProps: triggerProps,\n    ref: trigger,\n    placement: placement,\n    speaker: renderCalendarOverlay,\n    \"data-cleanable\": cleanable,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 675,\n      columnNumber: 5\n    }\n  }, plaintext ? /*#__PURE__*/_react.default.createElement(_DateInput.default, {\n    value: value,\n    format: formatStr,\n    plaintext: plaintext,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 693,\n      columnNumber: 9\n    }\n  }) : /*#__PURE__*/_react.default.createElement(_InputGroup.default, (0, _extends2.default)({}, (0, _utils3.getRestProps)(rest), {\n    inside: true,\n    size: size,\n    disabled: disabled,\n    className: prefix`input-group`,\n    onClick: handleClick,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 695,\n      columnNumber: 9\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Picker.PickerLabel, {\n    className: prefix`label`,\n    id: `${id}-label`,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 703,\n      columnNumber: 11\n    }\n  }, label), /*#__PURE__*/_react.default.createElement(Input, (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    readOnly: inputReadOnly,\n    onChange: handleInputChange,\n    onKeyDown: handleInputKeyDown,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 706,\n      columnNumber: 11\n    }\n  })), /*#__PURE__*/_react.default.createElement(_Picker.PickerIndicator, {\n    size: size,\n    loading: loading,\n    caretAs: caretAs,\n    onClose: handleClean,\n    showCleanButton: showCleanButton,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 722,\n      columnNumber: 11\n    }\n  })));\n});\nDatePicker.displayName = 'DatePicker';\nvar _default = exports[\"default\"] = DatePicker;\n\n//# sourceURL=webpack://rsuite/./src/DatePicker/DatePicker.tsx?");
 
 /***/ }),
 
@@ -2490,7 +2501,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 _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _Input = _interopRequireDefault(__webpack_require__(/*! ../Input */ \"./src/Input/index.tsx\"));\nvar _date = __webpack_require__(/*! ../internals/utils/date */ \"./src/internals/utils/date/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/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\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\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 */\nconst DateRangeInput = /*#__PURE__*/_react.default.forwardRef((props, ref) => {\n  const {\n    propsWithDefaults,\n    parseDate,\n    getLocale\n  } = (0, _hooks.useCustom)('Calendar', props);\n  const {\n    shortDateFormat,\n    dateLocale\n  } = getLocale('DateTimeFormats');\n  const {\n    className,\n    classPrefix = 'date-range-input',\n    character = ' ~ ',\n    format: formatStr = shortDateFormat,\n    value: valueProp,\n    defaultValue = [],\n    placeholder,\n    onChange,\n    onKeyDown,\n    onBlur,\n    onFocus,\n    onPaste,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    withPrefix,\n    merge\n  } = (0, _hooks.useStyles)(classPrefix);\n  const classes = merge(className, withPrefix());\n  const inputRef = (0, _react.useRef)(null);\n  const {\n    selectedState,\n    setSelectedState\n  } = (0, _DateInput.useSelectedState)();\n  const rangeFormatStr = `${formatStr}${character}${formatStr}`;\n  const [value, setValue, isControlled] = (0, _hooks.useControlled)(valueProp, defaultValue);\n  const [dateType, setDateType] = (0, _react.useState)(_utils2.DateType.Start);\n  const dateInputOptions = {\n    formatStr,\n    locale: dateLocale,\n    isControlledDate: isControlled\n  };\n  const startDateState = (0, _DateInput.useDateInputState)({\n    ...dateInputOptions,\n    date: (value === null || value === void 0 ? void 0 : value[0]) || null\n  });\n  const endDateState = (0, _DateInput.useDateInputState)({\n    ...dateInputOptions,\n    date: (value === null || value === void 0 ? void 0 : value[1]) || null\n  });\n  const {\n    isMoveCursor,\n    isResetValue,\n    increment,\n    reset\n  } = (0, _DateInput.useFieldCursor)(formatStr, valueProp);\n  const getActiveState = (type = dateType) => {\n    return type === _utils2.DateType.Start ? startDateState : endDateState;\n  };\n  const [focused, focusEventProps] = (0, _DateInput.useIsFocused)({\n    onBlur,\n    onFocus\n  });\n  const renderedValue = (0, _react.useMemo)(() => {\n    const 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  const keyPressOptions = {\n    formatStr,\n    rangeFormatStr,\n    localize: dateLocale.localize,\n    selectedMonth: getActiveState().dateField.month,\n    dateString: renderedValue,\n    dateType,\n    character\n  };\n  const setSelectionRange = (0, _DateInput.useInputSelection)(inputRef);\n  const handleChange = (0, _hooks.useEventCallback)((date, event) => {\n    const 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 || onChange(nextValue, event);\n    setValue(nextValue);\n  });\n  const handleClear = (0, _hooks.useEventCallback)(event => {\n    startDateState.setNewDate(null);\n    endDateState.setNewDate(null);\n    setSelectionRange(0, 0);\n    reset();\n    setValue(null);\n    onChange === null || onChange === void 0 || onChange(null, event);\n  });\n  const onSegmentChange = (0, _hooks.useEventCallback)((event, nextDirection) => {\n    const input = event.target;\n    const key = event.key;\n    const direction = nextDirection || (key === 'ArrowRight' ? 'right' : 'left');\n    if (input.selectionEnd === null || input.selectionStart === null) {\n      return;\n    }\n    const cursorIndex = direction === 'right' ? input.selectionEnd : input.selectionStart;\n    let 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    const state = (0, _utils2.getInputSelectedState)({\n      ...keyPressOptions,\n      dateType: nextDateType,\n      selectedMonth: getActiveState(nextDateType).dateField.month,\n      input,\n      direction\n    });\n    setSelectedState(state);\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n\n    // If the selected field changes, reset the input state\n    if (selectedState.selectedPattern !== state.selectedPattern) {\n      reset();\n    }\n  });\n  const onSegmentValueChange = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    const key = event.key;\n    const offset = key === 'ArrowUp' ? 1 : -1;\n    const state = (0, _utils2.getInputSelectedState)({\n      ...keyPressOptions,\n      input,\n      valueOffset: offset\n    });\n    setSelectedState(state);\n    getActiveState().setDateOffset(state.selectedPattern, offset, date => handleChange(date, event));\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n  });\n  const onSegmentValueChangeWithNumericKeys = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    const key = event.key;\n    const pattern = selectedState.selectedPattern;\n    const isFunctionKey = key.startsWith('F') && !isNaN(Number(key.slice(1)));\n    if (isFunctionKey) {\n      return;\n    }\n    if (!pattern) {\n      return;\n    }\n    const field = getActiveState().getDateField(pattern);\n    const value = parseInt(key, 10);\n    const padValue = parseInt(`${field.value || ''}${key}`, 10);\n    let newValue = value;\n\n    // Check if the value entered by the user is a valid date\n    if ((0, _DateInput.validateDateTime)(field.name, padValue) && !isResetValue()) {\n      newValue = padValue;\n    }\n    getActiveState().setDateField(pattern, newValue, date => handleChange(date, event));\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    const selectedMonth = pattern === 'M' ? newValue : getActiveState().dateField.month;\n    const nextState = (0, _utils2.getInputSelectedState)({\n      ...keyPressOptions,\n      input,\n      selectedMonth\n    });\n    setSelectedState(nextState);\n    setSelectionRange(nextState.selectionStart, nextState.selectionEnd);\n    increment();\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  const onSegmentValueRemove = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    const value = input.value;\n    if (input.selectionStart === 0 && value && input.selectionEnd === value.length) {\n      handleClear(event);\n    } else if (selectedState.selectedPattern) {\n      const nextState = (0, _utils2.getInputSelectedState)({\n        ...keyPressOptions,\n        input,\n        valueOffset: null\n      });\n      setSelectedState(nextState);\n      setSelectionRange(nextState.selectionStart, nextState.selectionEnd);\n      getActiveState().setDateField(selectedState.selectedPattern, null, date => handleChange(date, event));\n      reset();\n    }\n  });\n  const handleClick = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    if (input.selectionStart === null) {\n      return;\n    }\n    const cursorIndex = input.selectionStart === renderedValue.length ? 0 : input.selectionStart;\n    const dateType = (0, _utils2.getDateType)(renderedValue || rangeFormatStr, character, cursorIndex);\n    const state = (0, _utils2.getInputSelectedState)({\n      ...keyPressOptions,\n      dateType,\n      selectedMonth: getActiveState(dateType).dateField.month,\n      input\n    });\n    setDateType(dateType);\n    setSelectedState(state);\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n    if (selectedState.selectedPattern !== state.selectedPattern) {\n      reset();\n    }\n  });\n  const handlePaste = (0, _hooks.useEventCallback)(event => {\n    var _event$clipboardData;\n    event.preventDefault();\n    const pasteText = (_event$clipboardData = event.clipboardData) === null || _event$clipboardData === void 0 ? void 0 : _event$clipboardData.getData('text');\n    const [start, end] = pasteText.split(character).map(date => parseDate(date, formatStr));\n    if ((0, _date.isValid)(start) && (0, _date.isValid)(end)) {\n      const nextValue = [start, end];\n      onChange === null || onChange === void 0 || onChange(nextValue, event);\n      setValue(nextValue);\n      startDateState.setNewDate(start);\n      endDateState.setNewDate(end);\n    }\n    onPaste === null || onPaste === void 0 || onPaste(event);\n  });\n  const onKeyboardInput = (0, _DateInput.useKeyboardInputEvent)({\n    onSegmentChange,\n    onSegmentValueChange,\n    onSegmentValueChangeWithNumericKeys,\n    onSegmentValueRemove,\n    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    onPaste: handlePaste,\n    value: renderedValue,\n    placeholder: placeholder || rangeFormatStr\n  }, focusEventProps, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 313,\n      columnNumber: 5\n    }\n  }));\n});\nDateRangeInput.displayName = 'DateRangeInput';\nvar _default = exports[\"default\"] = DateRangeInput;\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\");\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 _Input = _interopRequireDefault(__webpack_require__(/*! ../Input */ \"./src/Input/index.tsx\"));\nvar _date = __webpack_require__(/*! ../internals/utils/date */ \"./src/internals/utils/date/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/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\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\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 */\nconst DateRangeInput = /*#__PURE__*/_react.default.forwardRef((props, ref) => {\n  const {\n    propsWithDefaults,\n    parseDate,\n    getLocale\n  } = (0, _hooks.useCustom)('Calendar', props);\n  const {\n    shortDateFormat,\n    dateLocale\n  } = getLocale('DateTimeFormats');\n  const {\n    className,\n    classPrefix = 'date-range-input',\n    character = ' ~ ',\n    format: formatStr = shortDateFormat,\n    value: valueProp,\n    defaultValue = [],\n    placeholder,\n    onChange,\n    onKeyDown,\n    onBlur,\n    onFocus,\n    onPaste,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    withPrefix,\n    merge\n  } = (0, _hooks.useStyles)(classPrefix);\n  const classes = merge(className, withPrefix());\n  const inputRef = (0, _react.useRef)(null);\n  const {\n    selectedState,\n    setSelectedState\n  } = (0, _DateInput.useSelectedState)();\n  const rangeFormatStr = `${formatStr}${character}${formatStr}`;\n  const [value, setValue, isControlled] = (0, _hooks.useControlled)(valueProp, defaultValue);\n  const [dateType, setDateType] = (0, _react.useState)(_utils2.DateType.Start);\n  const dateInputOptions = {\n    formatStr,\n    locale: dateLocale,\n    isControlledDate: isControlled\n  };\n  const startDateState = (0, _DateInput.useDateInputState)({\n    ...dateInputOptions,\n    date: (value === null || value === void 0 ? void 0 : value[0]) || null\n  });\n  const endDateState = (0, _DateInput.useDateInputState)({\n    ...dateInputOptions,\n    date: (value === null || value === void 0 ? void 0 : value[1]) || null\n  });\n  const {\n    isMoveCursor,\n    isResetValue,\n    increment,\n    reset\n  } = (0, _DateInput.useFieldCursor)(formatStr, valueProp);\n  const getActiveState = (type = dateType) => {\n    return type === _utils2.DateType.Start ? startDateState : endDateState;\n  };\n  const [focused, focusEventProps] = (0, _DateInput.useIsFocused)({\n    onBlur,\n    onFocus\n  });\n  const renderedValue = (0, _react.useMemo)(() => {\n    const 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  const keyPressOptions = {\n    formatStr,\n    rangeFormatStr,\n    localize: dateLocale.localize,\n    selectedMonth: getActiveState().dateField.month,\n    dateString: renderedValue,\n    dateType,\n    character\n  };\n  const setSelectionRange = (0, _DateInput.useInputSelection)(inputRef);\n  const handleChange = (0, _hooks.useEventCallback)((date, event) => {\n    const 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 || onChange(nextValue, event);\n    setValue(nextValue);\n  });\n  const handleClear = (0, _hooks.useEventCallback)(event => {\n    startDateState.setNewDate(null);\n    endDateState.setNewDate(null);\n    setSelectionRange(0, 0);\n    reset();\n    setValue(null);\n    onChange === null || onChange === void 0 || onChange(null, event);\n  });\n  const onSegmentChange = (0, _hooks.useEventCallback)((event, nextDirection) => {\n    const input = event.target;\n    const key = event.key;\n    const direction = nextDirection || (key === 'ArrowRight' ? 'right' : 'left');\n    if (input.selectionEnd === null || input.selectionStart === null) {\n      return;\n    }\n    const cursorIndex = direction === 'right' ? input.selectionEnd : input.selectionStart;\n    let 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    const state = (0, _utils2.getInputSelectedState)({\n      ...keyPressOptions,\n      dateType: nextDateType,\n      selectedMonth: getActiveState(nextDateType).dateField.month,\n      input,\n      direction\n    });\n    setSelectedState(state);\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n\n    // If the selected field changes, reset the input state\n    if (selectedState.selectedPattern !== state.selectedPattern) {\n      reset();\n    }\n  });\n  const onSegmentValueChange = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    const key = event.key;\n    const offset = key === 'ArrowUp' ? 1 : -1;\n    const state = (0, _utils2.getInputSelectedState)({\n      ...keyPressOptions,\n      input,\n      valueOffset: offset\n    });\n    setSelectedState(state);\n    getActiveState().setDateOffset(state.selectedPattern, offset, date => handleChange(date, event));\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n  });\n  const onSegmentValueChangeWithNumericKeys = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    const key = event.key;\n    const pattern = selectedState.selectedPattern;\n    const isFunctionKey = key.startsWith('F') && !isNaN(Number(key.slice(1)));\n    if (isFunctionKey) {\n      return;\n    }\n    if (!pattern) {\n      return;\n    }\n    const field = getActiveState().getDateField(pattern);\n    const value = parseInt(key, 10);\n    const padValue = parseInt(`${field.value || ''}${key}`, 10);\n    let newValue = value;\n\n    // Check if the value entered by the user is a valid date\n    if ((0, _DateInput.validateDateTime)(field.name, padValue) && !isResetValue()) {\n      newValue = padValue;\n    }\n    getActiveState().setDateField(pattern, newValue, date => handleChange(date, event));\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    const selectedMonth = pattern === 'M' ? newValue : getActiveState().dateField.month;\n    const nextState = (0, _utils2.getInputSelectedState)({\n      ...keyPressOptions,\n      input,\n      selectedMonth\n    });\n    setSelectedState(nextState);\n    setSelectionRange(nextState.selectionStart, nextState.selectionEnd);\n    increment();\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  const onSegmentValueRemove = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    const value = input.value;\n    if (input.selectionStart === 0 && value && input.selectionEnd === value.length) {\n      handleClear(event);\n    } else if (selectedState.selectedPattern) {\n      const nextState = (0, _utils2.getInputSelectedState)({\n        ...keyPressOptions,\n        input,\n        valueOffset: null\n      });\n      setSelectedState(nextState);\n      setSelectionRange(nextState.selectionStart, nextState.selectionEnd);\n      getActiveState().setDateField(selectedState.selectedPattern, null, date => handleChange(date, event));\n      reset();\n    }\n  });\n  const onAmPmToggle = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    const key = event.key.toLowerCase();\n\n    // Only handle 'a' or 'p' keys when the selected pattern is 'a' (AM/PM)\n    if (selectedState.selectedPattern === 'a' && (key === 'a' || key === 'p')) {\n      const currentHour = getActiveState().dateField.hour || 0;\n      const isAM = currentHour < 12;\n      const isPM = currentHour >= 12;\n\n      // Toggle AM/PM based on the key pressed\n      // 'a' key -> set to AM, 'p' key -> set to PM\n      if (key === 'a' && isPM || key === 'p' && isAM) {\n        const state = (0, _utils2.getInputSelectedState)({\n          ...keyPressOptions,\n          input\n        });\n        setSelectedState(state);\n        getActiveState().setDateOffset('a', 1, date => handleChange(date, event));\n        setSelectionRange(state.selectionStart, state.selectionEnd);\n      }\n    }\n  });\n  const handleClick = (0, _hooks.useEventCallback)(event => {\n    const input = event.target;\n    if (input.selectionStart === null) {\n      return;\n    }\n    const cursorIndex = input.selectionStart === renderedValue.length ? 0 : input.selectionStart;\n    const dateType = (0, _utils2.getDateType)(renderedValue || rangeFormatStr, character, cursorIndex);\n    const state = (0, _utils2.getInputSelectedState)({\n      ...keyPressOptions,\n      dateType,\n      selectedMonth: getActiveState(dateType).dateField.month,\n      input\n    });\n    setDateType(dateType);\n    setSelectedState(state);\n    setSelectionRange(state.selectionStart, state.selectionEnd);\n    if (selectedState.selectedPattern !== state.selectedPattern) {\n      reset();\n    }\n  });\n  const handlePaste = (0, _hooks.useEventCallback)(event => {\n    var _event$clipboardData;\n    event.preventDefault();\n    const pasteText = (_event$clipboardData = event.clipboardData) === null || _event$clipboardData === void 0 ? void 0 : _event$clipboardData.getData('text');\n    const [start, end] = pasteText.split(character).map(date => parseDate(date, formatStr));\n    if ((0, _date.isValid)(start) && (0, _date.isValid)(end)) {\n      const nextValue = [start, end];\n      onChange === null || onChange === void 0 || onChange(nextValue, event);\n      setValue(nextValue);\n      startDateState.setNewDate(start);\n      endDateState.setNewDate(end);\n    }\n    onPaste === null || onPaste === void 0 || onPaste(event);\n  });\n  const onKeyboardInput = (0, _DateInput.useKeyboardInputEvent)({\n    onSegmentChange,\n    onSegmentValueChange,\n    onSegmentValueChangeWithNumericKeys,\n    onSegmentValueRemove,\n    onAmPmToggle,\n    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    onPaste: handlePaste,\n    value: renderedValue,\n    placeholder: placeholder || rangeFormatStr\n  }, focusEventProps, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 335,\n      columnNumber: 5\n    }\n  }));\n});\nDateRangeInput.displayName = 'DateRangeInput';\nvar _default = exports[\"default\"] = DateRangeInput;\n\n//# sourceURL=webpack://rsuite/./src/DateRangeInput/DateRangeInput.tsx?");
 
 /***/ }),
 
@@ -2534,7 +2545,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 _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.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 _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _Calendar = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/Calendar */ \"./node_modules/@rsuite/icons/esm/react/Calendar.js\"));\nvar _Time = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/Time */ \"./node_modules/@rsuite/icons/esm/react/Time.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 _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 _useDateDisabled = _interopRequireDefault(__webpack_require__(/*! ./hooks/useDateDisabled */ \"./src/DateRangePicker/hooks/useDateDisabled.ts\"));\nvar _useCustomizedInput = _interopRequireDefault(__webpack_require__(/*! ../DatePicker/hooks/useCustomizedInput */ \"./src/DatePicker/hooks/useCustomizedInput.ts\"));\nvar _Box = _interopRequireDefault(__webpack_require__(/*! ../internals/Box */ \"./src/internals/Box/index.tsx\"));\nvar _Calendar2 = _interopRequireDefault(__webpack_require__(/*! ./Calendar */ \"./src/DateRangePicker/Calendar.tsx\"));\nvar StaticMethods = _interopRequireWildcard(__webpack_require__(/*! ./disabledDateUtils */ \"./src/DateRangePicker/disabledDateUtils.ts\"));\nvar _DateRangePickerProvider = __webpack_require__(/*! ./DateRangePickerProvider */ \"./src/DateRangePicker/DateRangePickerProvider.ts\");\nvar _utils = __webpack_require__(/*! ./utils */ \"./src/DateRangePicker/utils.ts\");\nvar _constants = __webpack_require__(/*! ../internals/constants */ \"./src/internals/constants/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../DatePicker/utils */ \"./src/DatePicker/utils.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _utils3 = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _date = __webpack_require__(/*! ../internals/utils/date */ \"./src/internals/utils/date/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DateRangePicker/DateRangePicker.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\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 */\nconst DateRangePicker = (0, _utils3.forwardRef)((props, ref) => {\n  var _ref, _ref2;\n  const {\n    formatDate,\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('DateRangePicker', props);\n  const {\n    as,\n    block,\n    classPrefix = 'picker',\n    className,\n    appearance = 'default',\n    editable = true,\n    cleanable = true,\n    character = ' ~ ',\n    calendarSnapping,\n    defaultCalendarValue,\n    defaultValue,\n    plaintext,\n    disabled,\n    shouldDisableDate,\n    shouldDisableHour,\n    shouldDisableMinute,\n    shouldDisableSecond,\n    format,\n    hoverRange,\n    id: idProp,\n    isoWeek = false,\n    weekStart,\n    limitEndYear = 1000,\n    limitStartYear,\n    locale,\n    loading,\n    label,\n    popupClassName,\n    popupStyle,\n    oneTap,\n    placeholder = '',\n    placement = 'bottomStart',\n    ranges,\n    readOnly,\n    showOneCalendar = false,\n    showWeekNumbers,\n    showMeridiem,\n    showHeader = true,\n    style,\n    size,\n    caretAs: caretAsProp,\n    value: valueProp,\n    monthDropdownProps,\n    hideHours,\n    hideMinutes,\n    hideSeconds,\n    onChange,\n    onClean,\n    onEnter,\n    onExit,\n    onOk,\n    onSelect,\n    onShortcutClick,\n    renderTitle,\n    renderValue,\n    renderCell,\n    ...restProps\n  } = propsWithDefaults;\n  const id = (0, _hooks.useUniqueId)('rs-', idProp);\n  const {\n    trigger,\n    root,\n    target,\n    overlay\n  } = (0, _Picker.usePickerRef)(ref);\n  const {\n    merge,\n    prefix\n  } = (0, _hooks.useStyles)(classPrefix);\n  const formatStr = format || (locale === null || locale === void 0 ? void 0 : locale.shortDateFormat) || 'yyyy-MM-dd';\n  const rangeFormatStr = `${formatStr}${character}${formatStr}`;\n  const [value, setValue] = (0, _hooks.useControlled)(valueProp, defaultValue !== null && defaultValue !== void 0 ? defaultValue : null);\n  const {\n    mode,\n    has\n  } = (0, _date.useDateMode)(formatStr);\n\n  // Show only the calendar month panel. formatStr = 'yyyy-MM'\n  const onlyShowMonth = mode === _date.DateMode.Month;\n\n  // Only show the time panel. formatStr = 'HH:mm:ss'\n  const onlyShowTime = mode === _date.DateMode.Time;\n\n  // Allows two calendar panels to display the same month.\n  const allowSameMonth = onlyShowMonth || showOneCalendar || onlyShowTime;\n\n  // Default gap between two calendars, if `showOneCalendar` is set, the gap is 0\n  const calendarGap = allowSameMonth ? 0 : 1;\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  const [isSelectedIdle, setSelectedIdle] = (0, _react.useState)(true);\n\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  const [selectedDates, setSelectedDates] = (0, _react.useState)((_ref = valueProp !== null && valueProp !== void 0 ? valueProp : defaultValue) !== null && _ref !== void 0 ? _ref : []);\n\n  // The date of the current hover, used to reduce the calculation of `handleMouseMove`\n  const [hoverDateRange, setHoverDateRange] = (0, _react.useState)(value);\n\n  // The displayed calendar panel is rendered based on this value.\n  const [calendarDateRange, setCalendarDateRangeValue] = (0, _react.useState)((0, _utils.getSafeCalendarDate)({\n    value: (_ref2 = value !== null && value !== void 0 ? value : defaultCalendarValue) !== null && _ref2 !== void 0 ? _ref2 : null,\n    allowSameMonth\n  }));\n\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  const 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  const [activeCalendarKey, setActiveCalendarKey] = (0, _react.useState)();\n\n  /**\n   * Get the time on the calendar.\n   */\n  const getCalendarDatetime = calendarKey => {\n    const index = calendarKey === 'start' ? 0 : 1;\n    return (calendarDateRange === null || calendarDateRange === void 0 ? void 0 : calendarDateRange[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  const setCalendarDateRange = ({\n    dateRange,\n    calendarKey,\n    eventName\n  }) => {\n    let nextValue = dateRange;\n\n    // The time should remain the same when the dates in the date range are changed.\n    if (has('time') && dateRange !== null && dateRange !== void 0 && dateRange.length && (eventName === 'changeDate' || eventName === 'changeMonth')) {\n      const startDate = (0, _date.copyTime)({\n        from: getCalendarDatetime('start'),\n        to: dateRange[0]\n      });\n      const endDate = (0, _date.copyTime)({\n        from: getCalendarDatetime('end'),\n        to: dateRange.length === 1 ? (0, _date.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    const nextCalendarDate = (0, _utils.getSafeCalendarDate)({\n      value: nextValue,\n      calendarKey,\n      allowSameMonth\n    });\n    setCalendarDateRangeValue(nextCalendarDate);\n    if (onlyShowMonth && eventName === 'changeMonth') {\n      setSelectedDates(nextCalendarDate);\n    }\n  };\n  (0, _react.useEffect)(() => {\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  const getInputHtmlSize = () => {\n    const padding = 4;\n    let strings = rangeFormatStr;\n    if (value) {\n      const [startDate, endDate] = value;\n      strings = `${formatDate(startDate, formatStr)}${character}${formatDate(endDate, formatStr)}`;\n    }\n    return (0, _utils3.getStringLength)(strings) + padding;\n  };\n\n  /**\n   * preset hover range\n   */\n  const getHoverRangeValue = date => {\n    function getHoverRangeFunc() {\n      if (hoverRange === 'week') {\n        return date => (0, _utils.getWeekHoverRange)(date, {\n          isoWeek,\n          weekStart,\n          locale: locale === null || locale === void 0 ? void 0 : locale.dateLocale\n        });\n      } else if (hoverRange === 'month') {\n        return _utils.getMonthHoverRange;\n      }\n      return hoverRange;\n    }\n    const hoverRangeFunc = getHoverRangeFunc();\n    if ((0, _isNil.default)(hoverRangeFunc)) {\n      return null;\n    }\n    let hoverValues = hoverRangeFunc(date);\n    const isHoverRangeValid = hoverValues instanceof Array && hoverValues.length === 2;\n    if (!isHoverRangeValid) {\n      return null;\n    }\n    if ((0, _date.isAfter)(hoverValues[0], hoverValues[1])) {\n      hoverValues = (0, _date.reverseDateRangeOmitTime)(hoverValues);\n    }\n    return hoverValues;\n  };\n  const setDateRange = (event, nextValue, closeOverlay = true) => {\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, _utils.isSameRange)(nextValue, value, formatStr)) {\n      onChange === null || onChange === 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  const onMouseMove = (0, _hooks.useEventCallback)(date => {\n    const 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        let nextSelectedDates = [selectRangeValueRef.current[0], nextHoverDateRange[1]];\n        if ((0, _date.isBefore)(nextHoverDateRange[0], selectRangeValueRef.current[0])) {\n          nextSelectedDates = [nextHoverDateRange[0], selectRangeValueRef.current[1]];\n        }\n        setSelectedDates(nextSelectedDates);\n      } else {\n        setHoverDateRange(prevHoverValue => (0, _isNil.default)(prevHoverValue) ? null : [prevHoverValue[0], date]);\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  const handleSelectDate = (0, _hooks.useEventCallback)((index, date, event) => {\n    const calendarKey = index === 0 ? 'start' : 'end';\n    let nextSelectDates = hoverDateRange !== null && hoverDateRange !== void 0 ? hoverDateRange : [];\n    const hoverRangeValue = getHoverRangeValue(date);\n    const noHoverRangeValid = (0, _isNil.default)(hoverRangeValue);\n\n    // in `oneTap` mode\n    if (oneTap) {\n      setDateRange(event, noHoverRangeValid ? [(0, _date.startOfDay)(date), (0, _date.endOfDay)(date)] : hoverRangeValue);\n      onSelect === null || onSelect === 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, _date.isAfter)(nextSelectDates[0], nextSelectDates[1])) {\n        nextSelectDates = (0, _date.reverseDateRangeOmitTime)(nextSelectDates);\n      }\n      if (has('time')) {\n        nextSelectDates = [(0, _date.copyTime)({\n          from: getCalendarDatetime('start'),\n          to: nextSelectDates[0]\n        }), (0, _date.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    if (!(0, _date.isSameMonth)(calendarDateRange[index], date) || calendarSnapping) {\n      setCalendarDateRange({\n        dateRange: nextSelectDates,\n        calendarKey,\n        eventName: 'changeDate'\n      });\n    }\n    onSelect === null || onSelect === 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)(() => {\n    const selectValueLength = selectedDates.length;\n    const doneSelected = selectValueLength === 0 || selectValueLength === 2;\n    doneSelected && setHoverDateRange(null);\n  }, [selectedDates]);\n  const onChangeCalendarMonth = (0, _hooks.useEventCallback)((index, date) => {\n    const calendarKey = index === 0 ? 'start' : 'end';\n    const nextCalendarDate = Array.from(calendarDateRange);\n    nextCalendarDate[index] = date;\n    setCalendarDateRange({\n      dateRange: nextCalendarDate,\n      calendarKey,\n      eventName: 'changeMonth'\n    });\n  });\n  const onChangeCalendarTime = (0, _hooks.useEventCallback)((index, date) => {\n    const calendarKey = index === 0 ? 'start' : 'end';\n    const nextCalendarDate = Array.from(calendarDateRange);\n    nextCalendarDate[index] = date;\n    setCalendarDateRange({\n      dateRange: nextCalendarDate,\n      calendarKey,\n      eventName: 'changeTime'\n    });\n    setSelectedDates(prev => {\n      const next = [...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, _date.copyTime)({\n        from: date,\n        to: next[index]\n      }) : new Date(date.valueOf());\n      return next;\n    });\n  });\n  const handleEnter = (0, _hooks.useEventCallback)(() => {\n    let nextCalendarDate;\n    if (value && value.length) {\n      const [startDate, endData] = value;\n      nextCalendarDate = [startDate, (0, _date.isSameMonth)(startDate, endData) ? (0, _date.addMonths)(endData, calendarGap) : endData];\n    } else {\n      // Reset the date on the calendar to the default date\n      nextCalendarDate = (0, _utils.getSafeCalendarDate)({\n        value: defaultCalendarValue !== null && defaultCalendarValue !== void 0 ? defaultCalendarValue : null,\n        allowSameMonth\n      });\n    }\n    setSelectedDates(value !== null && value !== void 0 ? value : []);\n    setCalendarDateRange({\n      dateRange: nextCalendarDate\n    });\n  });\n  const handleExit = (0, _hooks.useEventCallback)(() => {\n    setSelectedIdle(true);\n  });\n\n  /**\n   * Toolbar operation callback function\n   */\n  const handleShortcutPageDate = (0, _hooks.useEventCallback)((range, closeOverlay = false, event) => {\n    const 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 || onShortcutClick(range, event);\n\n    // End unfinished selections.\n    setSelectedIdle(true);\n  });\n  const calculateDateRange = () => {\n    const [start = calendarDateRange[0], end = calendarDateRange[1]] = selectedDates;\n    if (onlyShowTime) {\n      return [start, end];\n    }\n    return selectedDates;\n  };\n  const handleClickOK = (0, _hooks.useEventCallback)(event => {\n    const nextValue = calculateDateRange();\n    setDateRange(event, nextValue);\n    onOk === null || onOk === void 0 || onOk(nextValue, event);\n  });\n  const handleClean = (0, _hooks.useEventCallback)(event => {\n    setCalendarDateRange({\n      dateRange: null\n    });\n    setDateRange(event, null);\n    onClean === null || onClean === void 0 || onClean(event);\n    event.stopPropagation();\n  });\n\n  /**\n   * Callback after the input box value is changed.\n   */\n  const handleInputChange = (0, _hooks.useEventCallback)((value, event) => {\n    if (!value) {\n      return;\n    }\n    const [startDate, endDate] = value;\n    const selectValue = [startDate, endDate];\n    setHoverDateRange(selectValue);\n    setSelectedDates(selectValue);\n    setCalendarDateRange({\n      dateRange: selectValue\n    });\n    setDateRange(event, selectValue, false);\n  });\n\n  /**\n   * Check if the date is disabled\n   */\n  const isDateDisabled = (0, _useDateDisabled.default)({\n    shouldDisableDate\n  });\n\n  /**\n   * Check if a date range is disabled\n   */\n  const isRangeDisabled = (start, end, target) => {\n    if (isDateDisabled) {\n      // If the date is between the start and the end the button is disabled\n      while ((0, _date.isBefore)(start, end) || (0, _date.isSameDay)(start, end)) {\n        if (isDateDisabled(start, {\n          selectDate: selectedDates,\n          selectedDone: isSelectedIdle,\n          target\n        })) {\n          return true;\n        }\n        start = (0, _date.addDays)(start, 1);\n      }\n    }\n    return false;\n  };\n\n  /**\n   * Determine if the OK button should be disabled\n   */\n  const shouldDisableOkButton = () => {\n    const [startDate, endDate] = calculateDateRange();\n\n    // Check if start or end dates are missing\n    if (!startDate || !endDate) {\n      return true;\n    }\n\n    // Additional condition if only showing time\n    if (!onlyShowTime && !isSelectedIdle) {\n      return true;\n    }\n\n    // Check if there is any error in the selected date range\n    if (isErrorValue([startDate, endDate])) {\n      return true;\n    }\n    return false;\n  };\n\n  /**\n   * Check if a shortcut is disabled based on the selected date range\n   */\n  const shouldDisableShortcut = (selectedDates = []) => {\n    if (selectedDates === null) {\n      return false;\n    }\n    const [startDate, endDate] = selectedDates;\n\n    // Disable if either start or end date is missing\n    if (!startDate || !endDate) {\n      return true;\n    }\n\n    // Check if the date range is disabled for the shortcut\n    return isRangeDisabled(startDate, endDate, _constants.DATERANGE_DISABLED_TARGET.TOOLBAR_SHORTCUT);\n  };\n  const handleClose = (0, _hooks.useEventCallback)(() => {\n    var _trigger$current, _trigger$current$clos;\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 || (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 || _trigger$current$clos.call(_trigger$current);\n  });\n  const handleInputKeyDown = (0, _hooks.useEventCallback)(event => {\n    (0, _Picker.onMenuKeyDown)(event, {\n      esc: handleClose,\n      enter: () => {\n        var _trigger$current2;\n        const {\n          open\n        } = ((_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : _trigger$current2.getState()) || {};\n        if (!open) {\n          var _trigger$current3;\n          (_trigger$current3 = trigger.current) === null || _trigger$current3 === void 0 || _trigger$current3.open();\n        }\n      }\n    });\n  });\n  const disableCalendarDate = isDateDisabled ? (date, values, type) => {\n    return isDateDisabled(date, {\n      selectDate: values,\n      selectedDone: isSelectedIdle,\n      target: type\n    });\n  } : undefined;\n  const renderCalendarOverlay = (positionProps, speakerRef) => {\n    const {\n      className\n    } = positionProps;\n    const classes = merge(className, popupClassName, prefix('popup-daterange'));\n    const panelClasses = prefix('daterange-panel', {\n      'daterange-panel-show-one-calendar': showOneCalendar,\n      'daterange-panel-only-time': onlyShowTime\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    const panelStyles = {\n      minWidth: showOneCalendar || onlyShowTime ? 'auto' : 528\n    };\n    const calendarProps = {\n      locale,\n      isoWeek,\n      weekStart,\n      limitEndYear,\n      showMeridiem,\n      calendarDateRange,\n      limitStartYear,\n      showWeekNumbers,\n      format: formatStr,\n      value: selectedDates,\n      monthDropdownProps,\n      hoverRangeValue: hoverDateRange !== null && hoverDateRange !== void 0 ? hoverDateRange : undefined,\n      hideHours,\n      hideMinutes,\n      hideSeconds,\n      disabledHours: shouldDisableHour,\n      disabledMinutes: shouldDisableMinute,\n      disabledSeconds: shouldDisableSecond,\n      disabledDate: disableCalendarDate,\n      onSelect: handleSelectDate,\n      onChangeCalendarMonth,\n      onChangeCalendarTime,\n      onMouseMove,\n      renderTitle,\n      renderCellOnPicker: renderCell\n    };\n    const 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: void 0,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 918,\n            columnNumber: 18\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: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 923,\n          columnNumber: 13\n        }\n      })), /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n        index: 1\n      }, calendarProps, {\n        __self: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 924,\n          columnNumber: 13\n        }\n      })));\n    };\n    const {\n      sideRanges,\n      bottomRanges\n    } = (0, _utils2.splitRanges)(ranges);\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, _utils3.mergeRefs)(overlay, speakerRef),\n      target: trigger,\n      style: popupStyle,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 932,\n        columnNumber: 9\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: panelClasses,\n      style: panelStyles,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 941,\n        columnNumber: 11\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Stack.default, {\n      align: \"flex-start\",\n      h: \"100%\",\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 942,\n        columnNumber: 13\n      }\n    }, sideRanges && 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: calendarDateRange,\n      locale: locale,\n      disableShortcut: shouldDisableShortcut,\n      onShortcutClick: handleShortcutPageDate,\n      \"data-testid\": \"daterange-predefined-side\",\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 944,\n        columnNumber: 17\n      }\n    }), /*#__PURE__*/_react.default.createElement(_Box.default, {\n      className: prefix('box'),\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 957,\n        columnNumber: 15\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix('daterange-content'),\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 958,\n        columnNumber: 17\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: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 960,\n        columnNumber: 21\n      }\n    }), /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix(`daterange-calendar-${showOneCalendar ? 'single' : 'group'}`),\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 970,\n        columnNumber: 19\n      }\n    }, /*#__PURE__*/_react.default.createElement(_DateRangePickerProvider.DateRangePickerProvider, {\n      value: {\n        isSelectedIdle\n      },\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 973,\n        columnNumber: 21\n      }\n    }, getCalendars()))), /*#__PURE__*/_react.default.createElement(_Toolbar.default, {\n      locale: locale,\n      calendarDate: selectedDates,\n      disableOkBtn: shouldDisableOkButton,\n      disableShortcut: shouldDisableShortcut,\n      hideOkBtn: oneTap,\n      onOk: handleClickOK,\n      onShortcutClick: handleShortcutPageDate,\n      ranges: bottomRanges,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 978,\n        columnNumber: 17\n      }\n    })))));\n  };\n  const hasValue = !(0, _isNil.default)(value) && value.length > 1;\n  const caretAs = (0, _react.useMemo)(() => {\n    if (caretAsProp === null) {\n      return null;\n    }\n    return caretAsProp || (onlyShowTime ? _Time.default : _Calendar.default);\n  }, [caretAsProp, onlyShowTime]);\n  const 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    const [startDate, endDate] = value;\n    if (!(0, _date.isValid)(startDate) || !(0, _date.isValid)(endDate)) {\n      return true;\n    }\n    if ((0, _date.isBefore)(endDate, startDate)) {\n      return true;\n    }\n    const disabledOptions = {\n      selectDate: value,\n      selectedDone: isSelectedIdle,\n      target: _constants.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  const [ariaProps, rest] = (0, _utils3.partitionHTMLProps)(restProps, {\n    htmlProps: [],\n    includeAria: true\n  });\n  const showCleanButton = cleanable && hasValue && !readOnly;\n  const invalidValue = value && isErrorValue(value);\n  const {\n    customValue,\n    inputReadOnly,\n    Input,\n    events\n  } = (0, _useCustomizedInput.default)({\n    mode: 'dateRange',\n    value,\n    formatStr,\n    renderValue,\n    readOnly,\n    editable,\n    loading\n  });\n  const triggerProps = {\n    ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n    onEnter: (0, _utils3.createChainedFunction)(events.onActive, handleEnter, onEnter),\n    onExit: (0, _utils3.createChainedFunction)(events.onInactive, handleExit, onExit)\n  };\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    as: as,\n    name: \"date-range\",\n    classPrefix: classPrefix,\n    className: merge(className, {\n      [prefix('error')]: invalidValue\n    }),\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    style: style,\n    rootRef: root,\n    ref: trigger,\n    placement: placement,\n    trigger: \"active\",\n    triggerProps: triggerProps,\n    speaker: renderCalendarOverlay,\n    \"data-cleanable\": cleanable,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1061,\n      columnNumber: 7\n    }\n  }, plaintext ? /*#__PURE__*/_react.default.createElement(_DateRangeInput.default, {\n    value: value,\n    format: formatStr,\n    plaintext: plaintext,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1079,\n      columnNumber: 11\n    }\n  }) : /*#__PURE__*/_react.default.createElement(_InputGroup.default, (0, _extends2.default)({}, (0, _omit.default)(rest, [..._date.calendarOnlyProps, ..._Picker.triggerPropKeys]), {\n    inside: true,\n    className: prefix`input-group`,\n    disabled: disabled,\n    size: size,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1081,\n      columnNumber: 11\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Picker.PickerLabel, {\n    className: prefix`label`,\n    id: `${id}-label`,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1088,\n      columnNumber: 13\n    }\n  }, label), /*#__PURE__*/_react.default.createElement(Input, (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    htmlSize: getInputHtmlSize(),\n    onChange: handleInputChange,\n    onKeyDown: handleInputKeyDown,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1091,\n      columnNumber: 13\n    }\n  })), /*#__PURE__*/_react.default.createElement(_Picker.PickerIndicator, {\n    size: size,\n    loading: loading,\n    caretAs: caretAs,\n    onClose: handleClean,\n    showCleanButton: showCleanButton,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1108,\n      columnNumber: 13\n    }\n  })));\n}, StaticMethods);\nDateRangePicker.displayName = 'DateRangePicker';\nvar _default = exports[\"default\"] = DateRangePicker;\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\");\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 _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.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 _Calendar = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/Calendar */ \"./node_modules/@rsuite/icons/esm/react/Calendar.js\"));\nvar _Time = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/Time */ \"./node_modules/@rsuite/icons/esm/react/Time.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 _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 _useDateDisabled = _interopRequireDefault(__webpack_require__(/*! ./hooks/useDateDisabled */ \"./src/DateRangePicker/hooks/useDateDisabled.ts\"));\nvar _useCustomizedInput = _interopRequireDefault(__webpack_require__(/*! ../DatePicker/hooks/useCustomizedInput */ \"./src/DatePicker/hooks/useCustomizedInput.ts\"));\nvar _Box = _interopRequireDefault(__webpack_require__(/*! ../internals/Box */ \"./src/internals/Box/index.tsx\"));\nvar _Calendar2 = _interopRequireDefault(__webpack_require__(/*! ./Calendar */ \"./src/DateRangePicker/Calendar.tsx\"));\nvar StaticMethods = _interopRequireWildcard(__webpack_require__(/*! ./disabledDateUtils */ \"./src/DateRangePicker/disabledDateUtils.ts\"));\nvar _DateRangePickerProvider = __webpack_require__(/*! ./DateRangePickerProvider */ \"./src/DateRangePicker/DateRangePickerProvider.ts\");\nvar _utils = __webpack_require__(/*! ./utils */ \"./src/DateRangePicker/utils.ts\");\nvar _constants = __webpack_require__(/*! ../internals/constants */ \"./src/internals/constants/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../DatePicker/utils */ \"./src/DatePicker/utils.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _utils3 = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _date = __webpack_require__(/*! ../internals/utils/date */ \"./src/internals/utils/date/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DateRangePicker/DateRangePicker.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\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 */\nconst DateRangePicker = (0, _utils3.forwardRef)((props, ref) => {\n  var _ref, _ref2;\n  const {\n    formatDate,\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('DateRangePicker', props);\n  const {\n    as,\n    block,\n    classPrefix = 'picker',\n    className,\n    appearance = 'default',\n    editable = true,\n    cleanable = true,\n    character = ' ~ ',\n    calendarSnapping,\n    defaultCalendarValue,\n    defaultValue,\n    plaintext,\n    disabled,\n    shouldDisableDate,\n    shouldDisableHour,\n    shouldDisableMinute,\n    shouldDisableSecond,\n    format,\n    hoverRange,\n    id: idProp,\n    isoWeek = false,\n    weekStart,\n    limitEndYear = 1000,\n    limitStartYear,\n    locale,\n    loading,\n    label,\n    popupClassName,\n    popupStyle,\n    oneTap,\n    placeholder = '',\n    placement = 'bottomStart',\n    ranges,\n    readOnly,\n    showOneCalendar = false,\n    showWeekNumbers,\n    showMeridiem,\n    showHeader = true,\n    style,\n    size,\n    caretAs: caretAsProp,\n    value: valueProp,\n    monthDropdownProps,\n    hideHours,\n    hideMinutes,\n    hideSeconds,\n    onChange,\n    onClean,\n    onEnter,\n    onExit,\n    onOk,\n    onSelect,\n    onShortcutClick,\n    renderTitle,\n    renderValue,\n    renderCell,\n    ...restProps\n  } = propsWithDefaults;\n  const id = (0, _hooks.useUniqueId)('rs-', idProp);\n  const {\n    trigger,\n    root,\n    target,\n    overlay\n  } = (0, _Picker.usePickerRef)(ref);\n  const {\n    merge,\n    prefix\n  } = (0, _hooks.useStyles)(classPrefix);\n  const formatStr = format || (locale === null || locale === void 0 ? void 0 : locale.shortDateFormat) || 'yyyy-MM-dd';\n  const rangeFormatStr = `${formatStr}${character}${formatStr}`;\n  const [value, setValue] = (0, _hooks.useControlled)(valueProp, defaultValue !== null && defaultValue !== void 0 ? defaultValue : null);\n  const {\n    mode,\n    has\n  } = (0, _date.useDateMode)(formatStr);\n\n  // Show only the calendar month panel. formatStr = 'yyyy-MM'\n  const onlyShowMonth = mode === _date.DateMode.Month;\n\n  // Only show the time panel. formatStr = 'HH:mm:ss'\n  const onlyShowTime = mode === _date.DateMode.Time;\n\n  // Allows two calendar panels to display the same month.\n  const allowSameMonth = onlyShowMonth || showOneCalendar || onlyShowTime;\n\n  // Default gap between two calendars, if `showOneCalendar` is set, the gap is 0\n  const calendarGap = allowSameMonth ? 0 : 1;\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  const [isSelectedIdle, setSelectedIdle] = (0, _react.useState)(true);\n\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  const [selectedDates, setSelectedDates] = (0, _react.useState)((_ref = valueProp !== null && valueProp !== void 0 ? valueProp : defaultValue) !== null && _ref !== void 0 ? _ref : []);\n\n  // The date of the current hover, used to reduce the calculation of `handleMouseMove`\n  const [hoverDateRange, setHoverDateRange] = (0, _react.useState)(value);\n\n  // The displayed calendar panel is rendered based on this value.\n  const [calendarDateRange, setCalendarDateRangeValue] = (0, _react.useState)((0, _utils.getSafeCalendarDate)({\n    value: (_ref2 = value !== null && value !== void 0 ? value : defaultCalendarValue) !== null && _ref2 !== void 0 ? _ref2 : null,\n    allowSameMonth\n  }));\n\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  const 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  const [activeCalendarKey, setActiveCalendarKey] = (0, _react.useState)();\n\n  /**\n   * Get the time on the calendar.\n   */\n  const getCalendarDatetime = calendarKey => {\n    const index = calendarKey === 'start' ? 0 : 1;\n    return (calendarDateRange === null || calendarDateRange === void 0 ? void 0 : calendarDateRange[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  const setCalendarDateRange = ({\n    dateRange,\n    calendarKey,\n    eventName\n  }) => {\n    let nextValue = dateRange;\n\n    // The time should remain the same when the dates in the date range are changed.\n    if (has('time') && dateRange !== null && dateRange !== void 0 && dateRange.length && (eventName === 'changeDate' || eventName === 'changeMonth')) {\n      const startDate = (0, _date.copyTime)({\n        from: getCalendarDatetime('start'),\n        to: dateRange[0]\n      });\n      const endDate = (0, _date.copyTime)({\n        from: getCalendarDatetime('end'),\n        to: dateRange.length === 1 ? (0, _date.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    const nextCalendarDate = (0, _utils.getSafeCalendarDate)({\n      value: nextValue,\n      calendarKey,\n      allowSameMonth\n    });\n    setCalendarDateRangeValue(nextCalendarDate);\n    if (onlyShowMonth && eventName === 'changeMonth') {\n      setSelectedDates(nextCalendarDate);\n    }\n  };\n  (0, _react.useEffect)(() => {\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  const getInputHtmlSize = () => {\n    const padding = 4;\n    let strings = rangeFormatStr;\n    if (value) {\n      const [startDate, endDate] = value;\n      strings = `${formatDate(startDate, formatStr)}${character}${formatDate(endDate, formatStr)}`;\n    }\n    return (0, _utils3.getStringLength)(strings) + padding;\n  };\n\n  /**\n   * preset hover range\n   */\n  const getHoverRangeValue = date => {\n    function getHoverRangeFunc() {\n      if (hoverRange === 'week') {\n        return date => (0, _utils.getWeekHoverRange)(date, {\n          isoWeek,\n          weekStart,\n          locale: locale === null || locale === void 0 ? void 0 : locale.dateLocale\n        });\n      } else if (hoverRange === 'month') {\n        return _utils.getMonthHoverRange;\n      }\n      return hoverRange;\n    }\n    const hoverRangeFunc = getHoverRangeFunc();\n    if ((0, _isNil.default)(hoverRangeFunc)) {\n      return null;\n    }\n    let hoverValues = hoverRangeFunc(date);\n    const isHoverRangeValid = hoverValues instanceof Array && hoverValues.length === 2;\n    if (!isHoverRangeValid) {\n      return null;\n    }\n    if ((0, _date.isAfter)(hoverValues[0], hoverValues[1])) {\n      hoverValues = (0, _date.reverseDateRangeOmitTime)(hoverValues);\n    }\n    return hoverValues;\n  };\n  const setDateRange = (event, nextValue, closeOverlay = true) => {\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, _utils.isSameRange)(nextValue, value, formatStr)) {\n      onChange === null || onChange === 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  const onMouseMove = (0, _hooks.useEventCallback)(date => {\n    const 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        let nextSelectedDates = [selectRangeValueRef.current[0], nextHoverDateRange[1]];\n        if ((0, _date.isBefore)(nextHoverDateRange[0], selectRangeValueRef.current[0])) {\n          nextSelectedDates = [nextHoverDateRange[0], selectRangeValueRef.current[1]];\n        }\n        setSelectedDates(nextSelectedDates);\n      } else {\n        setHoverDateRange(prevHoverValue => (0, _isNil.default)(prevHoverValue) ? null : [prevHoverValue[0], date]);\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  const handleSelectDate = (0, _hooks.useEventCallback)((index, date, event) => {\n    const calendarKey = index === 0 ? 'start' : 'end';\n    let nextSelectDates = hoverDateRange !== null && hoverDateRange !== void 0 ? hoverDateRange : [];\n    const hoverRangeValue = getHoverRangeValue(date);\n    const noHoverRangeValid = (0, _isNil.default)(hoverRangeValue);\n\n    // in `oneTap` mode\n    if (oneTap) {\n      setDateRange(event, noHoverRangeValid ? [(0, _date.startOfDay)(date), (0, _date.endOfDay)(date)] : hoverRangeValue);\n      onSelect === null || onSelect === 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, _date.isAfter)(nextSelectDates[0], nextSelectDates[1])) {\n        nextSelectDates = (0, _date.reverseDateRangeOmitTime)(nextSelectDates);\n      }\n      if (has('time')) {\n        nextSelectDates = [(0, _date.copyTime)({\n          from: getCalendarDatetime('start'),\n          to: nextSelectDates[0]\n        }), (0, _date.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    if (!(0, _date.isSameMonth)(calendarDateRange[index], date) || calendarSnapping) {\n      setCalendarDateRange({\n        dateRange: nextSelectDates,\n        calendarKey,\n        eventName: 'changeDate'\n      });\n    }\n    onSelect === null || onSelect === 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)(() => {\n    const selectValueLength = selectedDates.length;\n    const doneSelected = selectValueLength === 0 || selectValueLength === 2;\n    doneSelected && setHoverDateRange(null);\n  }, [selectedDates]);\n  const onChangeCalendarMonth = (0, _hooks.useEventCallback)((index, date) => {\n    const calendarKey = index === 0 ? 'start' : 'end';\n    const nextCalendarDate = Array.from(calendarDateRange);\n    nextCalendarDate[index] = date;\n    setCalendarDateRange({\n      dateRange: nextCalendarDate,\n      calendarKey,\n      eventName: 'changeMonth'\n    });\n  });\n  const onChangeCalendarTime = (0, _hooks.useEventCallback)((index, date) => {\n    const calendarKey = index === 0 ? 'start' : 'end';\n    const nextCalendarDate = Array.from(calendarDateRange);\n    nextCalendarDate[index] = date;\n    setCalendarDateRange({\n      dateRange: nextCalendarDate,\n      calendarKey,\n      eventName: 'changeTime'\n    });\n    setSelectedDates(prev => {\n      const next = [...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, _date.copyTime)({\n        from: date,\n        to: next[index]\n      }) : new Date(date.valueOf());\n      return next;\n    });\n  });\n  const handleEnter = (0, _hooks.useEventCallback)(() => {\n    let nextCalendarDate;\n    if (value && value.length) {\n      const [startDate, endData] = value;\n      nextCalendarDate = [startDate, (0, _date.isSameMonth)(startDate, endData) ? (0, _date.addMonths)(endData, calendarGap) : endData];\n    } else {\n      // Reset the date on the calendar to the default date\n      nextCalendarDate = (0, _utils.getSafeCalendarDate)({\n        value: defaultCalendarValue !== null && defaultCalendarValue !== void 0 ? defaultCalendarValue : null,\n        allowSameMonth\n      });\n    }\n    setSelectedDates(value !== null && value !== void 0 ? value : []);\n    setCalendarDateRange({\n      dateRange: nextCalendarDate\n    });\n  });\n  const handleExit = (0, _hooks.useEventCallback)(() => {\n    setSelectedIdle(true);\n  });\n\n  /**\n   * Toolbar operation callback function\n   */\n  const handleShortcutPageDate = (0, _hooks.useEventCallback)((range, closeOverlay = false, event) => {\n    const 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 || onShortcutClick(range, event);\n\n    // End unfinished selections.\n    setSelectedIdle(true);\n  });\n  const calculateDateRange = () => {\n    const [start = calendarDateRange[0], end = calendarDateRange[1]] = selectedDates;\n    if (onlyShowTime) {\n      return [start, end];\n    }\n    return selectedDates;\n  };\n  const handleClickOK = (0, _hooks.useEventCallback)(event => {\n    const nextValue = calculateDateRange();\n    setDateRange(event, nextValue);\n    onOk === null || onOk === void 0 || onOk(nextValue, event);\n  });\n  const handleClean = (0, _hooks.useEventCallback)(event => {\n    setCalendarDateRange({\n      dateRange: null\n    });\n    setDateRange(event, null);\n    onClean === null || onClean === void 0 || onClean(event);\n    event.stopPropagation();\n  });\n\n  /**\n   * Callback after the input box value is changed.\n   */\n  const handleInputChange = (0, _hooks.useEventCallback)((value, event) => {\n    if (!value) {\n      return;\n    }\n    const [startDate, endDate] = value;\n    const selectValue = [startDate, endDate];\n    setHoverDateRange(selectValue);\n    setSelectedDates(selectValue);\n    setCalendarDateRange({\n      dateRange: selectValue\n    });\n    setDateRange(event, selectValue, false);\n  });\n\n  /**\n   * Check if the date is disabled\n   */\n  const isDateDisabled = (0, _useDateDisabled.default)({\n    shouldDisableDate\n  });\n\n  /**\n   * Check if a date range is disabled\n   */\n  const isRangeDisabled = (start, end, target) => {\n    if (isDateDisabled) {\n      // If the date is between the start and the end the button is disabled\n      while ((0, _date.isBefore)(start, end) || (0, _date.isSameDay)(start, end)) {\n        if (isDateDisabled(start, {\n          selectDate: selectedDates,\n          selectedDone: isSelectedIdle,\n          target\n        })) {\n          return true;\n        }\n        start = (0, _date.addDays)(start, 1);\n      }\n    }\n    return false;\n  };\n\n  /**\n   * Determine if the OK button should be disabled\n   */\n  const shouldDisableOkButton = () => {\n    const [startDate, endDate] = calculateDateRange();\n\n    // Check if start or end dates are missing\n    if (!startDate || !endDate) {\n      return true;\n    }\n\n    // Additional condition if only showing time\n    if (!onlyShowTime && !isSelectedIdle) {\n      return true;\n    }\n\n    // Check if there is any error in the selected date range\n    if (isErrorValue([startDate, endDate])) {\n      return true;\n    }\n    return false;\n  };\n\n  /**\n   * Check if a shortcut is disabled based on the selected date range\n   */\n  const shouldDisableShortcut = (selectedDates = []) => {\n    if (selectedDates === null) {\n      return false;\n    }\n    const [startDate, endDate] = selectedDates;\n\n    // Disable if either start or end date is missing\n    if (!startDate || !endDate) {\n      return true;\n    }\n\n    // Check if the date range is disabled for the shortcut\n    return isRangeDisabled(startDate, endDate, _constants.DATERANGE_DISABLED_TARGET.TOOLBAR_SHORTCUT);\n  };\n  const handleClose = (0, _hooks.useEventCallback)(() => {\n    var _trigger$current, _trigger$current$clos;\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 || (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 || _trigger$current$clos.call(_trigger$current);\n  });\n  const handleInputKeyDown = (0, _hooks.useEventCallback)(event => {\n    (0, _Picker.onMenuKeyDown)(event, {\n      esc: handleClose,\n      enter: () => {\n        var _trigger$current2;\n        const {\n          open\n        } = ((_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : _trigger$current2.getState()) || {};\n        if (!open) {\n          var _trigger$current3;\n          (_trigger$current3 = trigger.current) === null || _trigger$current3 === void 0 || _trigger$current3.open();\n        }\n      }\n    });\n  });\n  const disableCalendarDate = isDateDisabled ? (date, values, type) => {\n    return isDateDisabled(date, {\n      selectDate: values,\n      selectedDone: isSelectedIdle,\n      target: type\n    });\n  } : undefined;\n  const renderCalendarOverlay = (positionProps, speakerRef) => {\n    const {\n      className\n    } = positionProps;\n    const classes = merge(className, popupClassName, prefix('popup-daterange'));\n    const panelClasses = prefix('daterange-panel', {\n      'daterange-panel-show-one-calendar': showOneCalendar,\n      'daterange-panel-only-time': onlyShowTime\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    const panelStyles = {\n      minWidth: showOneCalendar || onlyShowTime ? 'auto' : 528\n    };\n    const calendarProps = {\n      locale,\n      isoWeek,\n      weekStart,\n      limitEndYear,\n      showMeridiem,\n      calendarDateRange,\n      limitStartYear,\n      showWeekNumbers,\n      format: formatStr,\n      value: selectedDates,\n      monthDropdownProps,\n      hoverRangeValue: hoverDateRange !== null && hoverDateRange !== void 0 ? hoverDateRange : undefined,\n      hideHours,\n      hideMinutes,\n      hideSeconds,\n      disabledHours: shouldDisableHour,\n      disabledMinutes: shouldDisableMinute,\n      disabledSeconds: shouldDisableSecond,\n      disabledDate: disableCalendarDate,\n      onSelect: handleSelectDate,\n      onChangeCalendarMonth,\n      onChangeCalendarTime,\n      onMouseMove,\n      renderTitle,\n      renderCellOnPicker: renderCell\n    };\n    const 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: void 0,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 918,\n            columnNumber: 18\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: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 923,\n          columnNumber: 13\n        }\n      })), /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n        index: 1\n      }, calendarProps, {\n        __self: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 924,\n          columnNumber: 13\n        }\n      })));\n    };\n    const {\n      sideRanges,\n      bottomRanges\n    } = (0, _utils2.splitRanges)(ranges);\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, _utils3.mergeRefs)(overlay, speakerRef),\n      target: trigger,\n      style: popupStyle,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 932,\n        columnNumber: 9\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: panelClasses,\n      style: panelStyles,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 941,\n        columnNumber: 11\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Stack.default, {\n      align: \"flex-start\",\n      h: \"100%\",\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 942,\n        columnNumber: 13\n      }\n    }, sideRanges && 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: calendarDateRange,\n      locale: locale,\n      disableShortcut: shouldDisableShortcut,\n      onShortcutClick: handleShortcutPageDate,\n      \"data-testid\": \"daterange-predefined-side\",\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 944,\n        columnNumber: 17\n      }\n    }), /*#__PURE__*/_react.default.createElement(_Box.default, {\n      className: prefix('box'),\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 957,\n        columnNumber: 15\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix('daterange-content'),\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 958,\n        columnNumber: 17\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: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 960,\n        columnNumber: 21\n      }\n    }), /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix(`daterange-calendar-${showOneCalendar ? 'single' : 'group'}`),\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 970,\n        columnNumber: 19\n      }\n    }, /*#__PURE__*/_react.default.createElement(_DateRangePickerProvider.DateRangePickerProvider, {\n      value: {\n        isSelectedIdle\n      },\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 973,\n        columnNumber: 21\n      }\n    }, getCalendars()))), /*#__PURE__*/_react.default.createElement(_Toolbar.default, {\n      locale: locale,\n      calendarDate: selectedDates,\n      disableOkBtn: shouldDisableOkButton,\n      disableShortcut: shouldDisableShortcut,\n      hideOkBtn: oneTap,\n      onOk: handleClickOK,\n      onShortcutClick: handleShortcutPageDate,\n      ranges: bottomRanges,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 978,\n        columnNumber: 17\n      }\n    })))));\n  };\n  const hasValue = !(0, _isNil.default)(value) && value.length > 1;\n  const caretAs = (0, _react.useMemo)(() => {\n    if (caretAsProp === null) {\n      return null;\n    }\n    return caretAsProp || (onlyShowTime ? _Time.default : _Calendar.default);\n  }, [caretAsProp, onlyShowTime]);\n  const 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    const [startDate, endDate] = value;\n    if (!(0, _date.isValid)(startDate) || !(0, _date.isValid)(endDate)) {\n      return true;\n    }\n    if ((0, _date.isBefore)(endDate, startDate)) {\n      return true;\n    }\n    const disabledOptions = {\n      selectDate: value,\n      selectedDone: isSelectedIdle,\n      target: _constants.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  const [ariaProps, rest] = (0, _utils3.partitionHTMLProps)(restProps, {\n    htmlProps: [],\n    includeAria: true\n  });\n  const showCleanButton = cleanable && hasValue && !readOnly;\n  const invalidValue = value && isErrorValue(value);\n  const {\n    customValue,\n    inputReadOnly,\n    Input,\n    events\n  } = (0, _useCustomizedInput.default)({\n    mode: 'dateRange',\n    value,\n    formatStr,\n    renderValue,\n    readOnly,\n    editable,\n    loading\n  });\n  const triggerProps = {\n    ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n    onEnter: (0, _utils3.createChainedFunction)(events.onActive, handleEnter, onEnter),\n    onExit: (0, _utils3.createChainedFunction)(events.onInactive, handleExit, onExit)\n  };\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    as: as,\n    pickerType: \"date-range\",\n    classPrefix: classPrefix,\n    className: merge(className, {\n      [prefix('error')]: invalidValue\n    }),\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    style: style,\n    rootRef: root,\n    ref: trigger,\n    placement: placement,\n    trigger: \"active\",\n    triggerProps: triggerProps,\n    speaker: renderCalendarOverlay,\n    \"data-cleanable\": cleanable,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1061,\n      columnNumber: 7\n    }\n  }, plaintext ? /*#__PURE__*/_react.default.createElement(_DateRangeInput.default, {\n    value: value,\n    format: formatStr,\n    plaintext: plaintext,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1079,\n      columnNumber: 11\n    }\n  }) : /*#__PURE__*/_react.default.createElement(_InputGroup.default, (0, _extends2.default)({}, (0, _omit.default)(rest, [..._date.calendarOnlyProps, ..._Picker.triggerPropKeys]), {\n    inside: true,\n    className: prefix`input-group`,\n    disabled: disabled,\n    size: size,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1081,\n      columnNumber: 11\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Picker.PickerLabel, {\n    className: prefix`label`,\n    id: `${id}-label`,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1088,\n      columnNumber: 13\n    }\n  }, label), /*#__PURE__*/_react.default.createElement(Input, (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    htmlSize: getInputHtmlSize(),\n    onChange: handleInputChange,\n    onKeyDown: handleInputKeyDown,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1091,\n      columnNumber: 13\n    }\n  })), /*#__PURE__*/_react.default.createElement(_Picker.PickerIndicator, {\n    size: size,\n    loading: loading,\n    caretAs: caretAs,\n    onClose: handleClean,\n    showCleanButton: showCleanButton,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1108,\n      columnNumber: 13\n    }\n  })));\n}, StaticMethods);\nDateRangePicker.displayName = 'DateRangePicker';\nvar _default = exports[\"default\"] = DateRangePicker;\n\n//# sourceURL=webpack://rsuite/./src/DateRangePicker/DateRangePicker.tsx?");
 
 /***/ }),
 
@@ -2886,7 +2897,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 _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _FormControl = _interopRequireDefault(__webpack_require__(/*! ../FormControl */ \"./src/FormControl/index.tsx\"));\nvar _FormControlLabel = _interopRequireDefault(__webpack_require__(/*! ../FormControlLabel */ \"./src/FormControlLabel/index.tsx\"));\nvar _FormErrorMessage = _interopRequireDefault(__webpack_require__(/*! ../FormErrorMessage */ \"./src/FormErrorMessage/index.tsx\"));\nvar _FormGroup = _interopRequireDefault(__webpack_require__(/*! ../FormGroup */ \"./src/FormGroup/index.tsx\"));\nvar _FormHelpText = _interopRequireDefault(__webpack_require__(/*! ../FormHelpText */ \"./src/FormHelpText/index.tsx\"));\nvar _FormStack = _interopRequireDefault(__webpack_require__(/*! ../FormStack */ \"./src/FormStack/index.tsx\"));\nvar _Box = _interopRequireDefault(__webpack_require__(/*! ../internals/Box */ \"./src/internals/Box/index.tsx\"));\nvar _useSchemaModel = _interopRequireDefault(__webpack_require__(/*! ./hooks/useSchemaModel */ \"./src/Form/hooks/useSchemaModel.ts\"));\nvar _useFormValidate = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFormValidate */ \"./src/Form/hooks/useFormValidate.ts\"));\nvar _useFormValue = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFormValue */ \"./src/Form/hooks/useFormValue.ts\"));\nvar _useFormRef = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFormRef */ \"./src/Form/hooks/useFormRef.ts\"));\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _schemaTyped = __webpack_require__(/*! schema-typed */ \"./node_modules/schema-typed/es/index.js\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _FormContext = __webpack_require__(/*! ./FormContext */ \"./src/Form/FormContext.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Form/Form.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\nconst defaultSchema = (0, _schemaTyped.SchemaModel)({});\nconst Subcomponents = {\n  Stack: _FormStack.default,\n  Control: _FormControl.default,\n  Label: _FormControlLabel.default,\n  ErrorMessage: _FormErrorMessage.default,\n  Group: _FormGroup.default,\n  Text: _FormHelpText.default,\n  /**\n   * @deprecated Use `Form.Label` instead\n   */\n  ControlLabel: _FormControlLabel.default,\n  /**\n   * @deprecated Use `Form.Text` instead\n   */\n  HelpText: _FormHelpText.default\n};\n\n/**\n * The `Form` component is a form interface for collecting and validating user input.\n * @see https://rsuitejs.com/components/form\n */\nconst Form = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('Form', props);\n  const {\n    checkTrigger = 'change',\n    errorFromContext = true,\n    formDefaultValue = {},\n    formValue: controlledFormValue,\n    formError: controlledFormError,\n    nestedField = false,\n    fluid,\n    layout,\n    model: formModel = defaultSchema,\n    readOnly,\n    plaintext,\n    children,\n    disabled,\n    onSubmit,\n    onReset,\n    onCheck,\n    onError,\n    onChange,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    getCombinedModel,\n    pushFieldRule,\n    removeFieldRule\n  } = (0, _useSchemaModel.default)(formModel, nestedField);\n  const {\n    formValue,\n    onRemoveValue,\n    setFieldValue,\n    resetFormValue\n  } = (0, _useFormValue.default)(controlledFormValue, {\n    formDefaultValue,\n    nestedField\n  });\n  const formValidateProps = {\n    formValue,\n    getCombinedModel,\n    onCheck,\n    onError,\n    nestedField\n  };\n  const {\n    formError,\n    onRemoveError,\n    check,\n    checkAsync,\n    checkForField,\n    checkFieldForNextValue,\n    checkForFieldAsync,\n    checkFieldAsyncForNextValue,\n    cleanErrors,\n    resetErrors,\n    cleanErrorForField\n  } = (0, _useFormValidate.default)(controlledFormError, formValidateProps);\n  const submit = (0, _hooks.useEventCallback)(event => {\n    // Check the form before submitting\n    if (check()) {\n      onSubmit === null || onSubmit === void 0 || onSubmit(formValue, event);\n    }\n  });\n  const reset = (0, _hooks.useEventCallback)(event => {\n    resetErrors();\n    onReset === null || onReset === void 0 || onReset(resetFormValue(), event);\n  });\n  const handleSubmit = (0, _hooks.useEventCallback)(event => {\n    var _event$preventDefault, _event$stopPropagatio;\n    event === null || event === void 0 || (_event$preventDefault = event.preventDefault) === null || _event$preventDefault === void 0 || _event$preventDefault.call(event);\n    event === null || event === void 0 || (_event$stopPropagatio = event.stopPropagation) === null || _event$stopPropagatio === void 0 || _event$stopPropagatio.call(event);\n\n    // Prevent submission when the form is disabled, readOnly, or plaintext\n    if (disabled || readOnly || plaintext) {\n      return;\n    }\n    submit(event);\n  });\n  const handleReset = (0, _hooks.useEventCallback)(event => {\n    var _event$preventDefault2, _event$stopPropagatio2;\n    event === null || event === void 0 || (_event$preventDefault2 = event.preventDefault) === null || _event$preventDefault2 === void 0 || _event$preventDefault2.call(event);\n    event === null || event === void 0 || (_event$stopPropagatio2 = event.stopPropagation) === null || _event$stopPropagatio2 === void 0 || _event$stopPropagatio2.call(event);\n\n    // Prevent reset when the form is disabled, readOnly, or plaintext\n    if (disabled || readOnly || plaintext) {\n      return;\n    }\n    reset(event);\n  });\n  const imperativeMethods = {\n    check,\n    checkForField,\n    checkAsync,\n    checkForFieldAsync,\n    cleanErrors,\n    cleanErrorForField,\n    reset,\n    resetErrors,\n    submit\n  };\n  const formRef = (0, _useFormRef.default)(ref, {\n    imperativeMethods\n  });\n  const removeFieldValue = (0, _hooks.useEventCallback)(name => {\n    const formValue = onRemoveValue(name);\n    onChange === null || onChange === void 0 || onChange(formValue);\n  });\n  const removeFieldError = (0, _hooks.useEventCallback)(name => {\n    onRemoveError(name);\n  });\n  const onFieldChange = (0, _hooks.useEventCallback)((name, value, event) => {\n    const nextFormValue = setFieldValue(name, value);\n    onChange === null || onChange === void 0 || onChange(nextFormValue, event);\n  });\n  const formContextValue = {\n    errorFromContext,\n    checkTrigger,\n    plaintext,\n    readOnly,\n    disabled,\n    formError,\n    nestedField,\n    pushFieldRule,\n    removeFieldValue,\n    removeFieldError,\n    removeFieldRule,\n    onFieldChange,\n    checkFieldForNextValue,\n    checkFieldAsyncForNextValue\n  };\n  const formChild = (0, _react.useMemo)(() => {\n    return fluid || layout ? /*#__PURE__*/_react.default.createElement(_FormStack.default, {\n      fluid: fluid,\n      layout: layout,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 293,\n        columnNumber: 7\n      }\n    }, children) : children;\n  }, [fluid, children, layout]);\n  return /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({\n    as: \"form\",\n    \"data-rs\": \"form\",\n    \"data-disabled\": disabled,\n    \"data-readonly\": readOnly,\n    \"data-plaintext\": plaintext,\n    ref: formRef,\n    onSubmit: handleSubmit,\n    onReset: handleReset\n  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 302,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(_FormContext.FormProvider, {\n    value: formContextValue,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 313,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_FormContext.FormValueProvider, {\n    value: formValue,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 314,\n      columnNumber: 9\n    }\n  }, formChild)));\n}, Subcomponents);\nForm.displayName = 'Form';\nvar _default = exports[\"default\"] = Form;\n\n//# sourceURL=webpack://rsuite/./src/Form/Form.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 = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _FormControl = _interopRequireDefault(__webpack_require__(/*! ../FormControl */ \"./src/FormControl/index.tsx\"));\nvar _FormControlLabel = _interopRequireDefault(__webpack_require__(/*! ../FormControlLabel */ \"./src/FormControlLabel/index.tsx\"));\nvar _FormErrorMessage = _interopRequireDefault(__webpack_require__(/*! ../FormErrorMessage */ \"./src/FormErrorMessage/index.tsx\"));\nvar _FormGroup = _interopRequireDefault(__webpack_require__(/*! ../FormGroup */ \"./src/FormGroup/index.tsx\"));\nvar _FormHelpText = _interopRequireDefault(__webpack_require__(/*! ../FormHelpText */ \"./src/FormHelpText/index.tsx\"));\nvar _FormStack = _interopRequireDefault(__webpack_require__(/*! ../FormStack */ \"./src/FormStack/index.tsx\"));\nvar _Box = _interopRequireDefault(__webpack_require__(/*! ../internals/Box */ \"./src/internals/Box/index.tsx\"));\nvar _useSchemaModel = _interopRequireDefault(__webpack_require__(/*! ./hooks/useSchemaModel */ \"./src/Form/hooks/useSchemaModel.ts\"));\nvar _useFormValidate = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFormValidate */ \"./src/Form/hooks/useFormValidate.ts\"));\nvar _useFormValue = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFormValue */ \"./src/Form/hooks/useFormValue.ts\"));\nvar _useFormRef = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFormRef */ \"./src/Form/hooks/useFormRef.ts\"));\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _schemaTyped = __webpack_require__(/*! schema-typed */ \"./node_modules/schema-typed/es/index.js\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _FormContext = __webpack_require__(/*! ./FormContext */ \"./src/Form/FormContext.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Form/Form.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\nconst defaultSchema = (0, _schemaTyped.SchemaModel)({});\nconst Subcomponents = {\n  Stack: _FormStack.default,\n  Control: _FormControl.default,\n  Label: _FormControlLabel.default,\n  ErrorMessage: _FormErrorMessage.default,\n  Group: _FormGroup.default,\n  Text: _FormHelpText.default,\n  /**\n   * @deprecated Use `Form.Label` instead\n   */\n  ControlLabel: _FormControlLabel.default,\n  /**\n   * @deprecated Use `Form.Text` instead\n   */\n  HelpText: _FormHelpText.default\n};\n\n/**\n * The `Form` component is a form interface for collecting and validating user input.\n * @see https://rsuitejs.com/components/form\n */\nconst Form = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('Form', props);\n  const {\n    checkTrigger = 'change',\n    errorFromContext = true,\n    formDefaultValue = {},\n    formValue: controlledFormValue,\n    formError: controlledFormError,\n    nestedField = false,\n    fluid,\n    layout,\n    model: formModel = defaultSchema,\n    readOnly,\n    plaintext,\n    children,\n    disabled,\n    onSubmit,\n    onReset,\n    onCheck,\n    onError,\n    onChange,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    getCombinedModel,\n    pushFieldRule,\n    removeFieldRule\n  } = (0, _useSchemaModel.default)(formModel, nestedField);\n  const {\n    formValue,\n    onRemoveValue,\n    setFieldValue,\n    resetFormValue\n  } = (0, _useFormValue.default)(controlledFormValue, {\n    formDefaultValue,\n    nestedField\n  });\n  const formValidateProps = {\n    formValue,\n    getCombinedModel,\n    onCheck,\n    onError,\n    nestedField\n  };\n  const {\n    formError,\n    onRemoveError,\n    check,\n    checkAsync,\n    checkForField,\n    checkFieldForNextValue,\n    checkForFieldAsync,\n    checkFieldAsyncForNextValue,\n    cleanErrors,\n    resetErrors,\n    cleanErrorForField\n  } = (0, _useFormValidate.default)(controlledFormError, formValidateProps);\n  const submit = (0, _hooks.useEventCallback)(event => {\n    // Check the form before submitting\n    if (check()) {\n      onSubmit === null || onSubmit === void 0 || onSubmit(formValue, event);\n    }\n  });\n  const reset = (0, _hooks.useEventCallback)(event => {\n    resetErrors();\n    const resetValue = resetFormValue();\n    if (resetValue) {\n      onChange === null || onChange === void 0 || onChange(resetValue);\n    }\n    onReset === null || onReset === void 0 || onReset(resetValue, event);\n  });\n  const handleSubmit = (0, _hooks.useEventCallback)(event => {\n    var _event$preventDefault, _event$stopPropagatio;\n    event === null || event === void 0 || (_event$preventDefault = event.preventDefault) === null || _event$preventDefault === void 0 || _event$preventDefault.call(event);\n    event === null || event === void 0 || (_event$stopPropagatio = event.stopPropagation) === null || _event$stopPropagatio === void 0 || _event$stopPropagatio.call(event);\n\n    // Prevent submission when the form is disabled, readOnly, or plaintext\n    if (disabled || readOnly || plaintext) {\n      return;\n    }\n    submit(event);\n  });\n  const handleReset = (0, _hooks.useEventCallback)(event => {\n    var _event$preventDefault2, _event$stopPropagatio2;\n    event === null || event === void 0 || (_event$preventDefault2 = event.preventDefault) === null || _event$preventDefault2 === void 0 || _event$preventDefault2.call(event);\n    event === null || event === void 0 || (_event$stopPropagatio2 = event.stopPropagation) === null || _event$stopPropagatio2 === void 0 || _event$stopPropagatio2.call(event);\n\n    // Prevent reset when the form is disabled, readOnly, or plaintext\n    if (disabled || readOnly || plaintext) {\n      return;\n    }\n    reset(event);\n  });\n  const imperativeMethods = {\n    check,\n    checkForField,\n    checkAsync,\n    checkForFieldAsync,\n    cleanErrors,\n    cleanErrorForField,\n    reset,\n    resetErrors,\n    submit\n  };\n  const formRef = (0, _useFormRef.default)(ref, {\n    imperativeMethods\n  });\n  const removeFieldValue = (0, _hooks.useEventCallback)(name => {\n    const formValue = onRemoveValue(name);\n    onChange === null || onChange === void 0 || onChange(formValue);\n  });\n  const removeFieldError = (0, _hooks.useEventCallback)(name => {\n    onRemoveError(name);\n  });\n  const onFieldChange = (0, _hooks.useEventCallback)((name, value, event) => {\n    const nextFormValue = setFieldValue(name, value);\n    onChange === null || onChange === void 0 || onChange(nextFormValue, event);\n  });\n  const formContextValue = {\n    errorFromContext,\n    checkTrigger,\n    plaintext,\n    readOnly,\n    disabled,\n    formError,\n    nestedField,\n    pushFieldRule,\n    removeFieldValue,\n    removeFieldError,\n    removeFieldRule,\n    onFieldChange,\n    checkFieldForNextValue,\n    checkFieldAsyncForNextValue\n  };\n  const formChild = (0, _react.useMemo)(() => {\n    return fluid || layout ? /*#__PURE__*/_react.default.createElement(_FormStack.default, {\n      fluid: fluid,\n      layout: layout,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 297,\n        columnNumber: 7\n      }\n    }, children) : children;\n  }, [fluid, children, layout]);\n  return /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({\n    as: \"form\",\n    \"data-rs\": \"form\",\n    \"data-disabled\": disabled,\n    \"data-readonly\": readOnly,\n    \"data-plaintext\": plaintext,\n    ref: formRef,\n    onSubmit: handleSubmit,\n    onReset: handleReset\n  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 306,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(_FormContext.FormProvider, {\n    value: formContextValue,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 317,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_FormContext.FormValueProvider, {\n    value: formValue,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 318,\n      columnNumber: 9\n    }\n  }, formChild)));\n}, Subcomponents);\nForm.displayName = 'Form';\nvar _default = exports[\"default\"] = Form;\n\n//# sourceURL=webpack://rsuite/./src/Form/Form.tsx?");
 
 /***/ }),
 
@@ -3513,7 +3524,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 _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\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 _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _Tag = _interopRequireDefault(__webpack_require__(/*! ../Tag */ \"./src/Tag/index.tsx\"));\nvar _TextBox = _interopRequireDefault(__webpack_require__(/*! ./TextBox */ \"./src/InputPicker/TextBox.tsx\"));\nvar _Stack = _interopRequireDefault(__webpack_require__(/*! ../Stack */ \"./src/Stack/index.tsx\"));\nvar _useInput = _interopRequireDefault(__webpack_require__(/*! ./hooks/useInput */ \"./src/InputPicker/hooks/useInput.ts\"));\nvar _useData = _interopRequireDefault(__webpack_require__(/*! ./hooks/useData */ \"./src/InputPicker/hooks/useData.ts\"));\nvar _Plaintext = _interopRequireDefault(__webpack_require__(/*! ../internals/Plaintext */ \"./src/internals/Plaintext/index.tsx\"));\nvar _utils = __webpack_require__(/*! ../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _constants = __webpack_require__(/*! ../internals/constants */ \"./src/internals/constants/index.ts\");\nvar _InputPickerContext = __webpack_require__(/*! ./InputPickerContext */ \"./src/InputPicker/InputPickerContext.tsx\");\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/InputPicker/utils.ts\");\nvar _utils3 = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _Position = __webpack_require__(/*! ../internals/Overlay/Position */ \"./src/internals/Overlay/Position.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/InputPicker/InputPicker.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\n/**\n * Single item selector with text box input.\n *\n * @see https://rsuitejs.com/components/input-picker\n */\nconst InputPicker = (0, _utils3.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('InputPicker', props);\n  const {\n    as,\n    appearance = 'default',\n    block,\n    cleanable = true,\n    cacheData = [],\n    className,\n    classPrefix = 'picker',\n    caretAs,\n    data: controlledData = [],\n    disabled,\n    readOnly,\n    plaintext,\n    defaultValue,\n    defaultOpen = false,\n    disabledItemValues = [],\n    locale,\n    toggleAs,\n    style,\n    size = 'md',\n    searchable = true,\n    open: controlledOpen,\n    placeholder,\n    placement = 'bottomStart',\n    groupBy,\n    popupClassName,\n    popupStyle,\n    popupAutoWidth = true,\n    listboxMaxHeight = 320,\n    creatable,\n    shouldDisplayCreateOption,\n    value: valueProp,\n    valueKey = 'value',\n    virtualized,\n    labelKey = 'label',\n    listProps,\n    id,\n    tabIndex,\n    loading,\n    label,\n    sort,\n    renderListbox,\n    renderExtraFooter,\n    renderValue,\n    renderOption,\n    renderOptionGroup,\n    onEnter,\n    onEntered,\n    onExit,\n    onExited,\n    onChange,\n    onClean,\n    onCreate,\n    onSearch,\n    onSelect,\n    onBlur,\n    onFocus,\n    searchBy,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    multi,\n    tagProps,\n    trigger,\n    disabledOptions,\n    onTagRemove,\n    renderCheckbox\n  } = (0, _InputPickerContext.useTagContext)();\n  if (groupBy === valueKey || groupBy === labelKey) {\n    throw Error('`groupBy` can not be equal to `valueKey` and `labelKey`');\n  }\n  const {\n    trigger: triggerRef,\n    root,\n    target,\n    overlay,\n    list\n  } = (0, _Picker.usePickerRef)(ref);\n  const {\n    prefix,\n    merge\n  } = (0, _hooks.useStyles)(classPrefix);\n  const [open, setOpen] = (0, _hooks.useControlled)(controlledOpen, defaultOpen);\n  const {\n    inputRef,\n    inputProps,\n    focus,\n    blur\n  } = (0, _useInput.default)({\n    multi,\n    triggerRef\n  });\n  const handleDataChange = data => {\n    var _data$;\n    setFocusItemValue(data === null || data === void 0 || (_data$ = data[0]) === null || _data$ === void 0 ? void 0 : _data$[valueKey]);\n  };\n  const {\n    data,\n    dataWithCache,\n    newData,\n    setNewData\n  } = (0, _useData.default)({\n    controlledData,\n    cacheData,\n    onChange: handleDataChange\n  });\n  const [value, setValue, isControlled] = (0, _hooks.useControlled)(valueProp, multi ? defaultValue || [] : defaultValue);\n  const cloneValue = () => multi ? (0, _clone.default)(value) || [] : value;\n  const handleClose = (0, _hooks.useEventCallback)(() => {\n    var _triggerRef$current, _target$current, _target$current$focus;\n    triggerRef === null || triggerRef === void 0 || (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === 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 || (_target$current$focus = _target$current.focus) === null || _target$current$focus === void 0 || _target$current$focus.call(_target$current);\n  });\n  const focusItemValueOptions = {\n    data: dataWithCache,\n    valueKey,\n    target: () => overlay.current\n  };\n\n  // Used to hover the focuse item  when trigger `onKeydown`\n  const {\n    focusItemValue,\n    setFocusItemValue,\n    onKeyDown\n  } = (0, _Picker.useFocusItemValue)(multi ? value === null || value === void 0 ? void 0 : value[0] : value, focusItemValueOptions);\n  const onSearchCallback = (0, _hooks.useEventCallback)((searchKeyword, filteredData, event) => {\n    if (!disabledOptions) {\n      var _filteredData$;\n      // The first option after filtering is the focus.\n      let firstItemValue = filteredData === null || filteredData === 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 || onSearch(searchKeyword, event);\n  });\n  const searchOptions = {\n    labelKey,\n    searchBy,\n    callback: onSearchCallback\n  };\n\n  // Use search keywords to filter options.\n  const {\n    searchKeyword,\n    resetSearch,\n    checkShouldDisplay,\n    handleSearch\n  } = (0, _Picker.useSearch)(data, searchOptions);\n\n  // Update the position of the menu when the search keyword and value change\n  (0, _react.useEffect)(() => {\n    var _triggerRef$current2, _triggerRef$current2$;\n    (_triggerRef$current2 = triggerRef.current) === null || _triggerRef$current2 === void 0 || (_triggerRef$current2$ = _triggerRef$current2.updatePosition) === null || _triggerRef$current2$ === void 0 || _triggerRef$current2$.call(_triggerRef$current2);\n  }, [searchKeyword, value]);\n  const getDataItem = value => {\n    // Find active `MenuItem` by `value`\n    const activeItem = dataWithCache.find(item => (0, _utils3.shallowEqual)(item[valueKey], value));\n    let 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,\n      itemNode\n    };\n  };\n\n  /**\n   * Convert the string of the newly created option into an object.\n   */\n  const createOption = value => {\n    const option = {\n      create: true,\n      [valueKey]: value,\n      [labelKey]: value\n    };\n    if (groupBy) {\n      return {\n        [groupBy]: locale === null || locale === void 0 ? void 0 : locale.newItem,\n        ...option\n      };\n    }\n    return option;\n  };\n  const handleChange = (0, _hooks.useEventCallback)((value, event) => {\n    onChange === null || onChange === void 0 || onChange(value, event);\n  });\n  const handleRemoveItemByTag = (0, _hooks.useEventCallback)((tag, event) => {\n    event.stopPropagation();\n    const val = cloneValue();\n    (0, _remove.default)(val, itemVal => (0, _utils3.shallowEqual)(itemVal, tag));\n    setValue(val);\n    handleChange(val, event);\n    onTagRemove === null || onTagRemove === void 0 || onTagRemove(tag, event);\n  });\n  const handleSelect = (0, _hooks.useEventCallback)((value, item, event) => {\n    onSelect === null || onSelect === void 0 || onSelect(value, item, event);\n    if (creatable && item.create) {\n      delete item.create;\n      onCreate === null || onCreate === 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  const handleSelectItem = (0, _hooks.useEventCallback)((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  const handleCheckTag = (0, _hooks.useEventCallback)((nextItemValue, item, event, checked) => {\n    const val = cloneValue();\n    if (checked) {\n      val.push(nextItemValue);\n    } else {\n      (0, _remove.default)(val, itemVal => (0, _utils3.shallowEqual)(itemVal, nextItemValue));\n    }\n    setValue(val);\n    resetSearch();\n    setFocusItemValue(nextItemValue);\n    handleSelect(val, item, event);\n    handleChange(val, event);\n    focus();\n  });\n  const handleTagKeyPress = (0, _hooks.useEventCallback)(event => {\n    // When composing, ignore the keypress event.\n    if (event.nativeEvent.isComposing) {\n      return;\n    }\n    const val = cloneValue();\n    let 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(item => item === newItemValue)) {\n      return;\n    }\n    if (!val.some(v => (0, _utils3.shallowEqual)(v, newItemValue))) {\n      val.push(newItemValue);\n    } else if (!disabledOptions) {\n      (0, _remove.default)(val, itemVal => (0, _utils3.shallowEqual)(itemVal, newItemValue));\n    }\n    let focusItem = data.find(item => (0, _utils3.shallowEqual)(item === null || item === void 0 ? void 0 : item[valueKey], newItemValue));\n    if (!focusItem) {\n      focusItem = createOption(newItemValue);\n    }\n    setValue(val);\n    resetSearch();\n    handleSelect(val, focusItem, event);\n    handleChange(val, event);\n  });\n  const handleMenuItemKeyPress = (0, _hooks.useEventCallback)(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(item => item === focusItemValue)) {\n      return;\n    }\n\n    // Find active `MenuItem` by `value`\n    let focusItem = data.find(item => (0, _utils3.shallowEqual)(item[valueKey], focusItemValue));\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  const removeLastItem = (0, _hooks.useEventCallback)(event => {\n    const 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    const val = cloneValue();\n    val.pop();\n    setValue(val);\n    handleChange(val, event);\n  });\n  const handleClean = (0, _hooks.useEventCallback)(event => {\n    if (disabled) {\n      return;\n    }\n\n    // When there is a value in the search box and the user presses the delete key on the keyboard,\n    // do not trigger clearing\n    if (inputRef.current === event.target && 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 || onClean(event);\n  });\n  const events = {\n    onMenuPressBackspace: multi ? removeLastItem : handleClean,\n    onMenuKeyDown: onKeyDown,\n    onMenuPressEnter: undefined,\n    onKeyDown: undefined\n  };\n  const handleKeyPress = (0, _hooks.useEventCallback)(event => {\n    // When typing a space, create a tag.\n    if ((0, _utils3.isOneOf)('Space', trigger) && event.key === _constants.KEY_VALUES.SPACE) {\n      handleTagKeyPress(event);\n      event.preventDefault();\n    }\n\n    // When typing a comma, create a tag.\n    if ((0, _utils3.isOneOf)('Comma', trigger) && event.key === _constants.KEY_VALUES.COMMA) {\n      handleTagKeyPress(event);\n      event.preventDefault();\n    }\n  });\n  if (multi) {\n    if ((0, _utils3.isOneOf)('Enter', trigger)) {\n      events.onMenuPressEnter = handleTagKeyPress;\n    }\n    if (creatable) {\n      events.onKeyDown = handleKeyPress;\n    }\n  } else {\n    events.onMenuPressEnter = handleMenuItemKeyPress;\n  }\n  const onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)({\n    trigger: triggerRef,\n    target,\n    overlay,\n    loading,\n    ...events,\n    ...rest\n  });\n  const handleExited = (0, _hooks.useEventCallback)(() => {\n    setFocusItemValue(multi ? value === null || value === void 0 ? void 0 : value[0] : value);\n    resetSearch();\n  });\n  const handleFocus = (0, _hooks.useEventCallback)(event => {\n    if (!readOnly) {\n      var _triggerRef$current3;\n      setOpen(true);\n      (_triggerRef$current3 = triggerRef.current) === null || _triggerRef$current3 === void 0 || _triggerRef$current3.open();\n    }\n    onFocus === null || onFocus === void 0 || onFocus(event);\n  });\n  const handleEnter = (0, _hooks.useEventCallback)(() => {\n    focus();\n    setOpen(true);\n  });\n  const handleExit = (0, _hooks.useEventCallback)(() => {\n    blur();\n    setOpen(false);\n  });\n  const renderListItem = (label, item) => {\n    // 'Create option \"{0}\"' =>  Create option \"xxxxx\"\n    const newLabel = item.create ? /*#__PURE__*/_react.default.createElement(\"span\", {\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 507,\n        columnNumber: 7\n      }\n    }, (0, _utils3.tplTransform)((locale === null || locale === void 0 ? void 0 : locale.createOption) || '', label)) : label;\n    return renderOption ? renderOption(newLabel, item) : newLabel;\n  };\n  const checkValue = () => {\n    if (multi) {\n      return {\n        isValid: false,\n        itemNode: null\n      };\n    }\n    const dataItem = getDataItem(value);\n    let 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\n    };\n  };\n  const renderMultiValue = () => {\n    if (!multi) {\n      return null;\n    }\n    const {\n      closable = true,\n      onClose,\n      ...tagRest\n    } = tagProps;\n    const tags = value || [];\n    const items = [];\n    const tagElements = tags.map(tag => {\n      const {\n        isValid,\n        itemNode,\n        activeItem\n      } = getDataItem(tag);\n      items.push(activeItem);\n      if (!isValid) {\n        return null;\n      }\n      return /*#__PURE__*/_react.default.createElement(_Tag.default, (0, _extends2.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, _utils3.createChainedFunction)(handleRemoveItemByTag.bind(null, tag), onClose),\n        __self: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 548,\n          columnNumber: 11\n        }\n      }), itemNode);\n    }).filter(item => item !== null);\n    if ((tags.length > 0 || isControlled) && (0, _isFunction.default)(renderValue)) {\n      return renderValue(value, items, tagElements);\n    }\n    return tagElements;\n  };\n  const renderPopup = (positionProps, speakerRef) => {\n    const {\n      className,\n      left,\n      top\n    } = positionProps;\n    const menuClassPrefix = multi ? 'picker-check-menu' : 'picker-select-menu';\n    const classes = merge(className, popupClassName, prefix(multi ? 'check-menu' : 'select-menu'));\n    const mergedPopupStyle = (0, _utils3.mergeStyles)((0, _Position.getPositionStyle)(left, top), popupStyle);\n    let items = (0, _utils.filterNodesOfTree)(data, checkShouldDisplay);\n    if (creatable && (typeof shouldDisplayCreateOption === 'function' ? shouldDisplayCreateOption(searchKeyword, items) : searchKeyword && !items.find(item => item[valueKey] === searchKeyword))) {\n      items = [...items, createOption(searchKeyword)];\n    }\n\n    // Create a tree structure data when set `groupBy`\n    if (groupBy) {\n      items = (0, _utils3.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, _utils3.mergeRefs)(overlay, speakerRef),\n        __self: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 595,\n          columnNumber: 14\n        }\n      });\n    }\n    const listbox = 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\n      },\n      activeItemValues: multi ? value : [value],\n      focusItemValue: focusItemValue,\n      maxHeight: listboxMaxHeight,\n      data: items,\n      query: searchKeyword,\n      groupBy: groupBy,\n      onSelect: multi ? handleCheckTag : handleSelectItem,\n      renderOptionGroup: renderOptionGroup,\n      renderOption: renderListItem,\n      virtualized: virtualized,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 599,\n        columnNumber: 7\n      }\n    }) : /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix`none`,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 621,\n        columnNumber: 7\n      }\n    }, locale === null || locale === void 0 ? void 0 : locale.noResultsText);\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils3.mergeRefs)(overlay, speakerRef),\n      autoWidth: popupAutoWidth,\n      className: classes,\n      style: mergedPopupStyle,\n      target: triggerRef,\n      onKeyDown: onPickerKeyDown,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 625,\n        columnNumber: 7\n      }\n    }, renderListbox ? renderListbox(listbox) : listbox, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  const {\n    isValid,\n    itemNode\n  } = checkValue();\n  const 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  const hasSingleValue = !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue) && !(0, _isNil.default)(itemNode);\n  const hasMultiValue = (0, _isArray.default)(value) && value.length > 0 && (0, _isFunction.default)(renderValue) && !(0, _isNil.default)(tagElements);\n  const hasValue = multi ? !!(tagElements !== null && tagElements !== void 0 && tagElements.length) || hasMultiValue : isValid || hasSingleValue;\n  const searching = !!searchKeyword && open;\n  const editable = searchable && !disabled && !loading;\n  if (plaintext) {\n    const 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    }\n    return /*#__PURE__*/_react.default.createElement(_Plaintext.default, (0, _extends2.default)({\n      localeKey: \"notSelected\",\n      ref: target\n    }, plaintextProps, {\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 665,\n        columnNumber: 7\n      }\n    }), itemNode || (tagElements !== null && tagElements !== void 0 && tagElements.length ? tagElements : null) || placeholder);\n  }\n  const placeholderNode = placeholder || (disabledOptions ? null : locale === null || locale === void 0 ? void 0 : locale.placeholder);\n  const triggerProps = {\n    ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n    onEnter: (0, _utils3.createChainedFunction)(handleEnter, onEnter),\n    onEntered: onEntered,\n    onExit: (0, _utils3.createChainedFunction)(handleExit, onExit),\n    onExited: (0, _utils3.createChainedFunction)(handleExited, onExited)\n  };\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, (0, _extends2.default)({\n    id: id,\n    multiple: multi,\n    name: multi ? 'tag' : 'input',\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    as: as,\n    triggerProps: triggerProps,\n    ref: triggerRef,\n    trigger: \"active\",\n    speaker: renderPopup,\n    placement: placement,\n    rootRef: root,\n    style: style,\n    size: size,\n    classPrefix: classPrefix,\n    className: className,\n    responsive: searchable === false,\n    onClick: focus,\n    onKeyDown: onPickerKeyDown,\n    \"data-focus\": open,\n    \"data-disabled-options\": disabledOptions\n  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 681,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, {\n    loading: loading,\n    label: label,\n    appearance: appearance,\n    readOnly: readOnly,\n    plaintext: plaintext,\n    ref: target,\n    as: toggleAs,\n    caretAs: caretAs,\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: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 706,\n      columnNumber: 7\n    }\n  }, searching || multi && hasValue ? null : itemNode || placeholderNode), /*#__PURE__*/_react.default.createElement(_TextBox.default, {\n    showTagList: 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: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 729,\n      columnNumber: 7\n    }\n  }));\n});\nInputPicker.displayName = 'InputPicker';\nvar _default = exports[\"default\"] = InputPicker;\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\");\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 _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 _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _Tag = _interopRequireDefault(__webpack_require__(/*! ../Tag */ \"./src/Tag/index.tsx\"));\nvar _TextBox = _interopRequireDefault(__webpack_require__(/*! ./TextBox */ \"./src/InputPicker/TextBox.tsx\"));\nvar _Stack = _interopRequireDefault(__webpack_require__(/*! ../Stack */ \"./src/Stack/index.tsx\"));\nvar _useInput = _interopRequireDefault(__webpack_require__(/*! ./hooks/useInput */ \"./src/InputPicker/hooks/useInput.ts\"));\nvar _useData = _interopRequireDefault(__webpack_require__(/*! ./hooks/useData */ \"./src/InputPicker/hooks/useData.ts\"));\nvar _Plaintext = _interopRequireDefault(__webpack_require__(/*! ../internals/Plaintext */ \"./src/internals/Plaintext/index.tsx\"));\nvar _utils = __webpack_require__(/*! ../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _constants = __webpack_require__(/*! ../internals/constants */ \"./src/internals/constants/index.ts\");\nvar _InputPickerContext = __webpack_require__(/*! ./InputPickerContext */ \"./src/InputPicker/InputPickerContext.tsx\");\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/InputPicker/utils.ts\");\nvar _utils3 = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _Position = __webpack_require__(/*! ../internals/Overlay/Position */ \"./src/internals/Overlay/Position.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/InputPicker/InputPicker.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\n/**\n * Single item selector with text box input.\n *\n * @see https://rsuitejs.com/components/input-picker\n */\nconst InputPicker = (0, _utils3.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('InputPicker', props);\n  const {\n    as,\n    appearance = 'default',\n    block,\n    cleanable = true,\n    cacheData = [],\n    className,\n    classPrefix = 'picker',\n    caretAs,\n    data: controlledData = [],\n    disabled,\n    readOnly,\n    plaintext,\n    defaultValue,\n    defaultOpen = false,\n    disabledItemValues = [],\n    locale,\n    toggleAs,\n    style,\n    size = 'md',\n    searchable = true,\n    open: controlledOpen,\n    placeholder,\n    placement = 'bottomStart',\n    groupBy,\n    popupClassName,\n    popupStyle,\n    popupAutoWidth = true,\n    listboxMaxHeight = 320,\n    creatable,\n    shouldDisplayCreateOption,\n    value: valueProp,\n    valueKey = 'value',\n    virtualized,\n    labelKey = 'label',\n    listProps,\n    id,\n    tabIndex,\n    loading,\n    label,\n    sort,\n    renderListbox,\n    renderExtraFooter,\n    renderValue,\n    renderOption,\n    renderOptionGroup,\n    onEnter,\n    onEntered,\n    onExit,\n    onExited,\n    onChange,\n    onClean,\n    onCreate,\n    onSearch,\n    onSelect,\n    onBlur,\n    onFocus,\n    searchBy,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    multi,\n    tagProps,\n    trigger,\n    disabledOptions,\n    onTagRemove,\n    renderCheckbox\n  } = (0, _InputPickerContext.useTagContext)();\n  if (groupBy === valueKey || groupBy === labelKey) {\n    throw Error('`groupBy` can not be equal to `valueKey` and `labelKey`');\n  }\n  const {\n    trigger: triggerRef,\n    root,\n    target,\n    overlay,\n    list\n  } = (0, _Picker.usePickerRef)(ref);\n  const {\n    prefix,\n    merge\n  } = (0, _hooks.useStyles)(classPrefix);\n  const [open, setOpen] = (0, _hooks.useControlled)(controlledOpen, defaultOpen);\n  const {\n    inputRef,\n    inputProps,\n    focus,\n    blur\n  } = (0, _useInput.default)({\n    multi,\n    triggerRef\n  });\n  const handleDataChange = data => {\n    var _data$;\n    setFocusItemValue(data === null || data === void 0 || (_data$ = data[0]) === null || _data$ === void 0 ? void 0 : _data$[valueKey]);\n  };\n  const {\n    data,\n    dataWithCache,\n    newData,\n    setNewData\n  } = (0, _useData.default)({\n    controlledData,\n    cacheData,\n    onChange: handleDataChange\n  });\n  const [value, setValue, isControlled] = (0, _hooks.useControlled)(valueProp, multi ? defaultValue || [] : defaultValue);\n  const cloneValue = () => multi ? (0, _clone.default)(value) || [] : value;\n  const handleClose = (0, _hooks.useEventCallback)(() => {\n    var _triggerRef$current, _target$current, _target$current$focus;\n    triggerRef === null || triggerRef === void 0 || (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === 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 || (_target$current$focus = _target$current.focus) === null || _target$current$focus === void 0 || _target$current$focus.call(_target$current);\n  });\n  const focusItemValueOptions = {\n    data: dataWithCache,\n    valueKey,\n    target: () => overlay.current\n  };\n\n  // Used to hover the focuse item  when trigger `onKeydown`\n  const {\n    focusItemValue,\n    setFocusItemValue,\n    onKeyDown\n  } = (0, _Picker.useFocusItemValue)(multi ? value === null || value === void 0 ? void 0 : value[0] : value, focusItemValueOptions);\n  const onSearchCallback = (0, _hooks.useEventCallback)((searchKeyword, filteredData, event) => {\n    if (!disabledOptions) {\n      var _filteredData$;\n      // The first option after filtering is the focus.\n      let firstItemValue = filteredData === null || filteredData === 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 || onSearch(searchKeyword, event);\n  });\n  const searchOptions = {\n    labelKey,\n    searchBy,\n    callback: onSearchCallback\n  };\n\n  // Use search keywords to filter options.\n  const {\n    searchKeyword,\n    resetSearch,\n    checkShouldDisplay,\n    handleSearch\n  } = (0, _Picker.useSearch)(data, searchOptions);\n\n  // Update the position of the menu when the search keyword and value change\n  (0, _react.useEffect)(() => {\n    var _triggerRef$current2, _triggerRef$current2$;\n    (_triggerRef$current2 = triggerRef.current) === null || _triggerRef$current2 === void 0 || (_triggerRef$current2$ = _triggerRef$current2.updatePosition) === null || _triggerRef$current2$ === void 0 || _triggerRef$current2$.call(_triggerRef$current2);\n  }, [searchKeyword, value]);\n  const getDataItem = value => {\n    // Find active `MenuItem` by `value`\n    const activeItem = dataWithCache.find(item => (0, _utils3.shallowEqual)(item[valueKey], value));\n    let 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,\n      itemNode\n    };\n  };\n\n  /**\n   * Convert the string of the newly created option into an object.\n   */\n  const createOption = value => {\n    const option = {\n      create: true,\n      [valueKey]: value,\n      [labelKey]: value\n    };\n    if (groupBy) {\n      return {\n        [groupBy]: locale === null || locale === void 0 ? void 0 : locale.newItem,\n        ...option\n      };\n    }\n    return option;\n  };\n  const handleChange = (0, _hooks.useEventCallback)((value, event) => {\n    onChange === null || onChange === void 0 || onChange(value, event);\n  });\n  const handleRemoveItemByTag = (0, _hooks.useEventCallback)((tag, event) => {\n    event.stopPropagation();\n    const val = cloneValue();\n    (0, _remove.default)(val, itemVal => (0, _utils3.shallowEqual)(itemVal, tag));\n    setValue(val);\n    handleChange(val, event);\n    onTagRemove === null || onTagRemove === void 0 || onTagRemove(tag, event);\n  });\n  const handleSelect = (0, _hooks.useEventCallback)((value, item, event) => {\n    onSelect === null || onSelect === void 0 || onSelect(value, item, event);\n    if (creatable && item.create) {\n      delete item.create;\n      onCreate === null || onCreate === 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  const handleSelectItem = (0, _hooks.useEventCallback)((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  const handleCheckTag = (0, _hooks.useEventCallback)((nextItemValue, item, event, checked) => {\n    const val = cloneValue();\n    if (checked) {\n      val.push(nextItemValue);\n    } else {\n      (0, _remove.default)(val, itemVal => (0, _utils3.shallowEqual)(itemVal, nextItemValue));\n    }\n    setValue(val);\n    resetSearch();\n    setFocusItemValue(nextItemValue);\n    handleSelect(val, item, event);\n    handleChange(val, event);\n    focus();\n  });\n  const handleTagKeyPress = (0, _hooks.useEventCallback)(event => {\n    // When composing, ignore the keypress event.\n    if (event.nativeEvent.isComposing) {\n      return;\n    }\n    const val = cloneValue();\n    let 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(item => item === newItemValue)) {\n      return;\n    }\n    if (!val.some(v => (0, _utils3.shallowEqual)(v, newItemValue))) {\n      val.push(newItemValue);\n    } else if (!disabledOptions) {\n      (0, _remove.default)(val, itemVal => (0, _utils3.shallowEqual)(itemVal, newItemValue));\n    }\n    let focusItem = data.find(item => (0, _utils3.shallowEqual)(item === null || item === void 0 ? void 0 : item[valueKey], newItemValue));\n    if (!focusItem) {\n      focusItem = createOption(newItemValue);\n    }\n    setValue(val);\n    resetSearch();\n    handleSelect(val, focusItem, event);\n    handleChange(val, event);\n  });\n  const handleMenuItemKeyPress = (0, _hooks.useEventCallback)(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(item => item === focusItemValue)) {\n      return;\n    }\n\n    // Find active `MenuItem` by `value`\n    let focusItem = data.find(item => (0, _utils3.shallowEqual)(item[valueKey], focusItemValue));\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  const removeLastItem = (0, _hooks.useEventCallback)(event => {\n    const 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    const val = cloneValue();\n    val.pop();\n    setValue(val);\n    handleChange(val, event);\n  });\n  const handleClean = (0, _hooks.useEventCallback)(event => {\n    if (disabled) {\n      return;\n    }\n\n    // When there is a value in the search box and the user presses the delete key on the keyboard,\n    // do not trigger clearing\n    if (inputRef.current === event.target && 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 || onClean(event);\n  });\n  const events = {\n    onMenuPressBackspace: multi ? removeLastItem : handleClean,\n    onMenuKeyDown: onKeyDown,\n    onMenuPressEnter: undefined,\n    onKeyDown: undefined\n  };\n  const handleKeyPress = (0, _hooks.useEventCallback)(event => {\n    // When typing a space, create a tag.\n    if ((0, _utils3.isOneOf)('Space', trigger) && event.key === _constants.KEY_VALUES.SPACE) {\n      handleTagKeyPress(event);\n      event.preventDefault();\n    }\n\n    // When typing a comma, create a tag.\n    if ((0, _utils3.isOneOf)('Comma', trigger) && event.key === _constants.KEY_VALUES.COMMA) {\n      handleTagKeyPress(event);\n      event.preventDefault();\n    }\n  });\n  if (multi) {\n    if ((0, _utils3.isOneOf)('Enter', trigger)) {\n      events.onMenuPressEnter = handleTagKeyPress;\n    }\n    if (creatable) {\n      events.onKeyDown = handleKeyPress;\n    }\n  } else {\n    events.onMenuPressEnter = handleMenuItemKeyPress;\n  }\n  const onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)({\n    trigger: triggerRef,\n    target,\n    overlay,\n    loading,\n    ...events,\n    ...rest\n  });\n  const handleExited = (0, _hooks.useEventCallback)(() => {\n    setFocusItemValue(multi ? value === null || value === void 0 ? void 0 : value[0] : value);\n    resetSearch();\n  });\n  const handleFocus = (0, _hooks.useEventCallback)(event => {\n    if (!readOnly) {\n      var _triggerRef$current3;\n      setOpen(true);\n      (_triggerRef$current3 = triggerRef.current) === null || _triggerRef$current3 === void 0 || _triggerRef$current3.open();\n    }\n    onFocus === null || onFocus === void 0 || onFocus(event);\n  });\n  const handleEnter = (0, _hooks.useEventCallback)(() => {\n    focus();\n    setOpen(true);\n  });\n  const handleExit = (0, _hooks.useEventCallback)(() => {\n    blur();\n    setOpen(false);\n  });\n  const renderListItem = (label, item) => {\n    // 'Create option \"{0}\"' =>  Create option \"xxxxx\"\n    const newLabel = item.create ? /*#__PURE__*/_react.default.createElement(\"span\", {\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 507,\n        columnNumber: 7\n      }\n    }, (0, _utils3.tplTransform)((locale === null || locale === void 0 ? void 0 : locale.createOption) || '', label)) : label;\n    return renderOption ? renderOption(newLabel, item) : newLabel;\n  };\n  const checkValue = () => {\n    if (multi) {\n      return {\n        isValid: false,\n        itemNode: null\n      };\n    }\n    const dataItem = getDataItem(value);\n    let 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\n    };\n  };\n  const renderMultiValue = () => {\n    if (!multi) {\n      return null;\n    }\n    const {\n      closable = true,\n      onClose,\n      ...tagRest\n    } = tagProps;\n    const tags = value || [];\n    const items = [];\n    const tagElements = tags.map(tag => {\n      const {\n        isValid,\n        itemNode,\n        activeItem\n      } = getDataItem(tag);\n      items.push(activeItem);\n      if (!isValid) {\n        return null;\n      }\n      return /*#__PURE__*/_react.default.createElement(_Tag.default, (0, _extends2.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, _utils3.createChainedFunction)(handleRemoveItemByTag.bind(null, tag), onClose),\n        __self: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 548,\n          columnNumber: 11\n        }\n      }), itemNode);\n    }).filter(item => item !== null);\n    if ((tags.length > 0 || isControlled) && (0, _isFunction.default)(renderValue)) {\n      return renderValue(value, items, tagElements);\n    }\n    return tagElements;\n  };\n  const renderPopup = (positionProps, speakerRef) => {\n    const {\n      className,\n      left,\n      top\n    } = positionProps;\n    const menuClassPrefix = multi ? 'picker-check-menu' : 'picker-select-menu';\n    const classes = merge(className, popupClassName, prefix(multi ? 'check-menu' : 'select-menu'));\n    const mergedPopupStyle = (0, _utils3.mergeStyles)((0, _Position.getPositionStyle)(left, top), popupStyle);\n    let items = (0, _utils.filterNodesOfTree)(data, checkShouldDisplay);\n    if (creatable && (typeof shouldDisplayCreateOption === 'function' ? shouldDisplayCreateOption(searchKeyword, items) : searchKeyword && !items.find(item => item[valueKey] === searchKeyword))) {\n      items = [...items, createOption(searchKeyword)];\n    }\n\n    // Create a tree structure data when set `groupBy`\n    if (groupBy) {\n      items = (0, _utils3.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, _utils3.mergeRefs)(overlay, speakerRef),\n        __self: void 0,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 595,\n          columnNumber: 14\n        }\n      });\n    }\n    const listbox = 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\n      },\n      activeItemValues: multi ? value : [value],\n      focusItemValue: focusItemValue,\n      maxHeight: listboxMaxHeight,\n      data: items,\n      query: searchKeyword,\n      groupBy: groupBy,\n      onSelect: multi ? handleCheckTag : handleSelectItem,\n      renderOptionGroup: renderOptionGroup,\n      renderOption: renderListItem,\n      virtualized: virtualized,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 599,\n        columnNumber: 7\n      }\n    }) : /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix`none`,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 621,\n        columnNumber: 7\n      }\n    }, locale === null || locale === void 0 ? void 0 : locale.noResultsText);\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      ref: (0, _utils3.mergeRefs)(overlay, speakerRef),\n      autoWidth: popupAutoWidth,\n      className: classes,\n      style: mergedPopupStyle,\n      target: triggerRef,\n      onKeyDown: onPickerKeyDown,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 625,\n        columnNumber: 7\n      }\n    }, renderListbox ? renderListbox(listbox) : listbox, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  const {\n    isValid,\n    itemNode\n  } = checkValue();\n  const 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  const hasSingleValue = !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue) && !(0, _isNil.default)(itemNode);\n  const hasMultiValue = (0, _isArray.default)(value) && value.length > 0 && (0, _isFunction.default)(renderValue) && !(0, _isNil.default)(tagElements);\n  const hasValue = multi ? !!(tagElements !== null && tagElements !== void 0 && tagElements.length) || hasMultiValue : isValid || hasSingleValue;\n  const searching = !!searchKeyword && open;\n  const editable = searchable && !disabled && !loading;\n  if (plaintext) {\n    const 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    }\n    return /*#__PURE__*/_react.default.createElement(_Plaintext.default, (0, _extends2.default)({\n      localeKey: \"notSelected\",\n      ref: target\n    }, plaintextProps, {\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 665,\n        columnNumber: 7\n      }\n    }), itemNode || (tagElements !== null && tagElements !== void 0 && tagElements.length ? tagElements : null) || placeholder);\n  }\n  const placeholderNode = placeholder || (disabledOptions ? null : locale === null || locale === void 0 ? void 0 : locale.placeholder);\n  const triggerProps = {\n    ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n    onEnter: (0, _utils3.createChainedFunction)(handleEnter, onEnter),\n    onEntered: onEntered,\n    onExit: (0, _utils3.createChainedFunction)(handleExit, onExit),\n    onExited: (0, _utils3.createChainedFunction)(handleExited, onExited)\n  };\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, (0, _extends2.default)({\n    id: id,\n    multiple: multi,\n    pickerType: multi ? 'tag' : 'input',\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    as: as,\n    triggerProps: triggerProps,\n    ref: triggerRef,\n    trigger: \"active\",\n    speaker: renderPopup,\n    placement: placement,\n    rootRef: root,\n    style: style,\n    size: size,\n    classPrefix: classPrefix,\n    className: className,\n    responsive: searchable === false,\n    onClick: focus,\n    onKeyDown: onPickerKeyDown,\n    \"data-focus\": open,\n    \"data-disabled-options\": disabledOptions\n  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 681,\n      columnNumber: 5\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, {\n    loading: loading,\n    label: label,\n    appearance: appearance,\n    readOnly: readOnly,\n    plaintext: plaintext,\n    ref: target,\n    as: toggleAs,\n    caretAs: caretAs,\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: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 706,\n      columnNumber: 7\n    }\n  }, searching || multi && hasValue ? null : itemNode || placeholderNode), /*#__PURE__*/_react.default.createElement(_TextBox.default, {\n    showTagList: 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: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 729,\n      columnNumber: 7\n    }\n  }));\n});\nInputPicker.displayName = 'InputPicker';\nvar _default = exports[\"default\"] = InputPicker;\n\n//# sourceURL=webpack://rsuite/./src/InputPicker/InputPicker.tsx?");
 
 /***/ }),
 
@@ -4162,7 +4173,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 _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.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 _TreeView = _interopRequireDefault(__webpack_require__(/*! ../MultiCascadeTree/TreeView */ \"./src/MultiCascadeTree/TreeView.tsx\"));\nvar _SearchView = _interopRequireDefault(__webpack_require__(/*! ../MultiCascadeTree/SearchView */ \"./src/MultiCascadeTree/SearchView.tsx\"));\nvar _useActive = _interopRequireDefault(__webpack_require__(/*! ../Cascader/useActive */ \"./src/Cascader/useActive.ts\"));\nvar _utils = __webpack_require__(/*! ../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../CascadeTree/utils */ \"./src/CascadeTree/utils.ts\");\nvar _utils3 = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _hooks2 = __webpack_require__(/*! ../MultiCascadeTree/hooks */ \"./src/MultiCascadeTree/hooks/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/MultiCascader/MultiCascader.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\nconst 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 */\nconst MultiCascader = (0, _utils3.forwardRef)((props, ref) => {\n  var _selectedPaths;\n  const {\n    propsWithDefaults,\n    rtl\n  } = (0, _hooks.useCustom)('MultiCascader', props);\n  const {\n    as,\n    appearance = 'default',\n    block,\n    className,\n    cleanable = true,\n    classPrefix = 'picker',\n    columnHeight,\n    columnWidth,\n    childrenKey = 'children',\n    countable = true,\n    cascade = true,\n    data = emptyArray,\n    defaultValue,\n    disabled,\n    disabledItemValues = emptyArray,\n    id,\n    labelKey = 'label',\n    locale,\n    placeholder,\n    placement = 'bottomStart',\n    popupClassName,\n    popupStyle,\n    renderColumn,\n    renderExtraFooter,\n    renderTreeNode,\n    renderValue,\n    searchable = true,\n    style,\n    size,\n    toggleAs,\n    uncheckableItemValues = emptyArray,\n    value: valueProp,\n    valueKey = 'value',\n    getChildren,\n    onClean,\n    onChange,\n    onCheck,\n    onEnter,\n    onExit,\n    onSearch,\n    onSelect,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    trigger,\n    root,\n    target,\n    overlay,\n    searchInput\n  } = (0, _Picker.usePickerRef)(ref);\n  const {\n    prefix,\n    merge\n  } = (0, _hooks.useStyles)(classPrefix);\n  const onSelectCallback = (0, _react.useCallback)((node, cascadePaths, event) => {\n    var _trigger$current, _trigger$current$upda;\n    onSelect === null || onSelect === void 0 || onSelect(node, cascadePaths, event);\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 || (_trigger$current$upda = _trigger$current.updatePosition) === null || _trigger$current$upda === void 0 || _trigger$current$upda.call(_trigger$current);\n  }, [onSelect, trigger]);\n  const {\n    selectedPaths,\n    flattenData,\n    columnData,\n    setColumnData,\n    setSelectedPaths,\n    handleSelect\n  } = (0, _hooks2.useSelect)({\n    data,\n    childrenKey,\n    labelKey,\n    valueKey,\n    onSelect: onSelectCallback,\n    getChildren\n  });\n  const [controlledValue] = (0, _hooks.useControlled)(valueProp, defaultValue);\n  const itemKeys = {\n    childrenKey,\n    labelKey,\n    valueKey\n  };\n  const cascadeValueProps = {\n    ...itemKeys,\n    uncheckableItemValues,\n    cascade,\n    value: controlledValue,\n    onCheck,\n    onChange\n  };\n  const {\n    value,\n    setValue,\n    handleCheck\n  } = (0, _hooks2.useCascadeValue)(cascadeValueProps, flattenData);\n  const selectedItems = flattenData.filter(item => value.some(v => v === item[valueKey])) || [];\n  const onFocusItemCallback = (0, _react.useCallback)(value => {\n    const {\n      columns,\n      path\n    } = (0, _utils2.getColumnsAndPaths)(data, flattenData.find(item => item[valueKey] === value), {\n      getParent: () => undefined,\n      getChildren: item => item[childrenKey]\n    });\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  const {\n    focusItemValue,\n    setLayer,\n    setKeys,\n    onKeyDown: onFocusItem\n  } = (0, _Picker.useFocusItemValue)(selectedPaths === null || selectedPaths === void 0 || (_selectedPaths = selectedPaths[selectedPaths.length - 1]) === null || _selectedPaths === void 0 ? void 0 : _selectedPaths[valueKey], {\n    rtl,\n    data: flattenData,\n    valueKey,\n    defaultLayer: selectedPaths !== null && selectedPaths !== void 0 && selectedPaths.length ? selectedPaths.length - 1 : 0,\n    target: () => overlay.current,\n    callback: onFocusItemCallback\n  });\n  const 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 || onSearch(value, event);\n  };\n  const {\n    items,\n    searchKeyword,\n    setSearchKeyword,\n    handleSearch\n  } = (0, _hooks2.useSearch)({\n    labelKey,\n    valueKey,\n    childrenKey,\n    flattenedData: flattenData,\n    uncheckableItemValues,\n    onSearch: onSearchCallback\n  });\n  const {\n    active,\n    events\n  } = (0, _useActive.default)({\n    onEnter,\n    onExit,\n    target,\n    setSearchKeyword\n  });\n  const handleClean = (0, _hooks.useEventCallback)(event => {\n    if (disabled || !target.current) {\n      return;\n    }\n    setSelectedPaths([]);\n    setValue([]);\n    setColumnData([data]);\n    onChange === null || onChange === void 0 || onChange([], event);\n  });\n  const handleMenuPressEnter = (0, _hooks.useEventCallback)(event => {\n    var _overlay$current;\n    const focusItem = (0, _utils.findNodeOfTree)(data, item => item[valueKey] === focusItemValue);\n    const 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  const onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)({\n    toggle: !focusItemValue || !active,\n    trigger,\n    target,\n    overlay,\n    searchInput,\n    active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter,\n    ...rest\n  });\n  const renderCascadeColumn = (childNodes, column) => {\n    if (typeof renderColumn === 'function') {\n      return renderColumn(childNodes, column);\n    }\n    return childNodes;\n  };\n  const renderCascadeTreeNode = (node, itemData) => {\n    if (typeof renderTreeNode === 'function') {\n      return renderTreeNode(node, itemData);\n    }\n    return node;\n  };\n  const renderTreeView = (positionProps, speakerRef) => {\n    const {\n      className\n    } = positionProps || {};\n    const classes = merge(className, 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: popupStyle,\n      target: trigger,\n      onKeyDown: onPickerKeyDown,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 279,\n        columnNumber: 9\n      }\n    }, searchable && /*#__PURE__*/_react.default.createElement(_SearchView.default, {\n      locale: locale,\n      cascade: cascade,\n      data: items,\n      value: value,\n      searchKeyword: searchKeyword,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      childrenKey: childrenKey,\n      disabledItemValues: disabledItemValues,\n      inputRef: searchInput,\n      onCheck: handleCheck,\n      onSearch: handleSearch,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 287,\n        columnNumber: 13\n      }\n    }), !searchKeyword && /*#__PURE__*/_react.default.createElement(_TreeView.default, {\n      cascade: cascade,\n      columnWidth: columnWidth,\n      columnHeight: columnHeight,\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: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 304,\n        columnNumber: 13\n      }\n    }), renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  let 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      badgeSize: size,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 333,\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  let 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  const triggerProps = {\n    ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n    ...events\n  };\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    as: as,\n    id: id,\n    name: \"multi-cascader\",\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    popupType: \"tree\",\n    multiple: true,\n    triggerProps: triggerProps,\n    ref: trigger,\n    placement: placement,\n    speaker: renderTreeView,\n    rootRef: root,\n    style: style,\n    classPrefix: classPrefix,\n    className: className,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 372,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({\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    countable: countable,\n    hasValue: hasValue,\n    active: active,\n    placement: placement,\n    inputValue: value,\n    size: size\n  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 390,\n      columnNumber: 9\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder)));\n});\nMultiCascader.displayName = 'MultiCascader';\nvar _default = exports[\"default\"] = MultiCascader;\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\");\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 _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.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 _TreeView = _interopRequireDefault(__webpack_require__(/*! ../MultiCascadeTree/TreeView */ \"./src/MultiCascadeTree/TreeView.tsx\"));\nvar _SearchView = _interopRequireDefault(__webpack_require__(/*! ../MultiCascadeTree/SearchView */ \"./src/MultiCascadeTree/SearchView.tsx\"));\nvar _useActive = _interopRequireDefault(__webpack_require__(/*! ../Cascader/useActive */ \"./src/Cascader/useActive.ts\"));\nvar _utils = __webpack_require__(/*! ../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../CascadeTree/utils */ \"./src/CascadeTree/utils.ts\");\nvar _utils3 = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _hooks2 = __webpack_require__(/*! ../MultiCascadeTree/hooks */ \"./src/MultiCascadeTree/hooks/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/MultiCascader/MultiCascader.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\nconst 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 */\nconst MultiCascader = (0, _utils3.forwardRef)((props, ref) => {\n  var _selectedPaths;\n  const {\n    propsWithDefaults,\n    rtl\n  } = (0, _hooks.useCustom)('MultiCascader', props);\n  const {\n    as,\n    appearance = 'default',\n    block,\n    className,\n    cleanable = true,\n    classPrefix = 'picker',\n    columnHeight,\n    columnWidth,\n    childrenKey = 'children',\n    countable = true,\n    cascade = true,\n    data = emptyArray,\n    defaultValue,\n    disabled,\n    disabledItemValues = emptyArray,\n    id,\n    labelKey = 'label',\n    locale,\n    placeholder,\n    placement = 'bottomStart',\n    popupClassName,\n    popupStyle,\n    renderColumn,\n    renderExtraFooter,\n    renderTreeNode,\n    renderValue,\n    searchable = true,\n    style,\n    size,\n    toggleAs,\n    uncheckableItemValues = emptyArray,\n    value: valueProp,\n    valueKey = 'value',\n    getChildren,\n    onClean,\n    onChange,\n    onCheck,\n    onEnter,\n    onExit,\n    onSearch,\n    onSelect,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    trigger,\n    root,\n    target,\n    overlay,\n    searchInput\n  } = (0, _Picker.usePickerRef)(ref);\n  const {\n    prefix,\n    merge\n  } = (0, _hooks.useStyles)(classPrefix);\n  const onSelectCallback = (0, _react.useCallback)((node, cascadePaths, event) => {\n    var _trigger$current, _trigger$current$upda;\n    onSelect === null || onSelect === void 0 || onSelect(node, cascadePaths, event);\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 || (_trigger$current$upda = _trigger$current.updatePosition) === null || _trigger$current$upda === void 0 || _trigger$current$upda.call(_trigger$current);\n  }, [onSelect, trigger]);\n  const {\n    selectedPaths,\n    flattenData,\n    columnData,\n    setColumnData,\n    setSelectedPaths,\n    handleSelect\n  } = (0, _hooks2.useSelect)({\n    data,\n    childrenKey,\n    labelKey,\n    valueKey,\n    onSelect: onSelectCallback,\n    getChildren\n  });\n  const [controlledValue] = (0, _hooks.useControlled)(valueProp, defaultValue);\n  const itemKeys = {\n    childrenKey,\n    labelKey,\n    valueKey\n  };\n  const cascadeValueProps = {\n    ...itemKeys,\n    uncheckableItemValues,\n    cascade,\n    value: controlledValue,\n    onCheck,\n    onChange\n  };\n  const {\n    value,\n    setValue,\n    handleCheck\n  } = (0, _hooks2.useCascadeValue)(cascadeValueProps, flattenData);\n  const selectedItems = flattenData.filter(item => value.some(v => v === item[valueKey])) || [];\n  const onFocusItemCallback = (0, _react.useCallback)(value => {\n    const {\n      columns,\n      path\n    } = (0, _utils2.getColumnsAndPaths)(data, flattenData.find(item => item[valueKey] === value), {\n      getParent: () => undefined,\n      getChildren: item => item[childrenKey]\n    });\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  const {\n    focusItemValue,\n    setLayer,\n    setKeys,\n    onKeyDown: onFocusItem\n  } = (0, _Picker.useFocusItemValue)(selectedPaths === null || selectedPaths === void 0 || (_selectedPaths = selectedPaths[selectedPaths.length - 1]) === null || _selectedPaths === void 0 ? void 0 : _selectedPaths[valueKey], {\n    rtl,\n    data: flattenData,\n    valueKey,\n    defaultLayer: selectedPaths !== null && selectedPaths !== void 0 && selectedPaths.length ? selectedPaths.length - 1 : 0,\n    target: () => overlay.current,\n    callback: onFocusItemCallback\n  });\n  const 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 || onSearch(value, event);\n  };\n  const {\n    items,\n    searchKeyword,\n    setSearchKeyword,\n    handleSearch\n  } = (0, _hooks2.useSearch)({\n    labelKey,\n    valueKey,\n    childrenKey,\n    flattenedData: flattenData,\n    uncheckableItemValues,\n    onSearch: onSearchCallback\n  });\n  const {\n    active,\n    events\n  } = (0, _useActive.default)({\n    onEnter,\n    onExit,\n    target,\n    setSearchKeyword\n  });\n  const handleClean = (0, _hooks.useEventCallback)(event => {\n    if (disabled || !target.current) {\n      return;\n    }\n    setSelectedPaths([]);\n    setValue([]);\n    setColumnData([data]);\n    onChange === null || onChange === void 0 || onChange([], event);\n  });\n  const handleMenuPressEnter = (0, _hooks.useEventCallback)(event => {\n    var _overlay$current;\n    const focusItem = (0, _utils.findNodeOfTree)(data, item => item[valueKey] === focusItemValue);\n    const 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  const onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)({\n    toggle: !focusItemValue || !active,\n    trigger,\n    target,\n    overlay,\n    searchInput,\n    active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter,\n    ...rest\n  });\n  const renderCascadeColumn = (childNodes, column) => {\n    if (typeof renderColumn === 'function') {\n      return renderColumn(childNodes, column);\n    }\n    return childNodes;\n  };\n  const renderCascadeTreeNode = (node, itemData) => {\n    if (typeof renderTreeNode === 'function') {\n      return renderTreeNode(node, itemData);\n    }\n    return node;\n  };\n  const renderTreeView = (positionProps, speakerRef) => {\n    const {\n      className\n    } = positionProps || {};\n    const classes = merge(className, 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: popupStyle,\n      target: trigger,\n      onKeyDown: onPickerKeyDown,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 279,\n        columnNumber: 9\n      }\n    }, searchable && /*#__PURE__*/_react.default.createElement(_SearchView.default, {\n      locale: locale,\n      cascade: cascade,\n      data: items,\n      value: value,\n      searchKeyword: searchKeyword,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      childrenKey: childrenKey,\n      disabledItemValues: disabledItemValues,\n      inputRef: searchInput,\n      onCheck: handleCheck,\n      onSearch: handleSearch,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 287,\n        columnNumber: 13\n      }\n    }), !searchKeyword && /*#__PURE__*/_react.default.createElement(_TreeView.default, {\n      cascade: cascade,\n      columnWidth: columnWidth,\n      columnHeight: columnHeight,\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: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 304,\n        columnNumber: 13\n      }\n    }), renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  let 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      badgeSize: size,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 333,\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  let 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  const triggerProps = {\n    ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n    ...events\n  };\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    as: as,\n    id: id,\n    pickerType: \"multi-cascader\",\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    popupType: \"tree\",\n    multiple: true,\n    triggerProps: triggerProps,\n    ref: trigger,\n    placement: placement,\n    speaker: renderTreeView,\n    rootRef: root,\n    style: style,\n    classPrefix: classPrefix,\n    className: className,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 372,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({\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    countable: countable,\n    hasValue: hasValue,\n    active: active,\n    placement: placement,\n    inputValue: value,\n    size: size\n  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 390,\n      columnNumber: 9\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder)));\n});\nMultiCascader.displayName = 'MultiCascader';\nvar _default = exports[\"default\"] = MultiCascader;\n\n//# sourceURL=webpack://rsuite/./src/MultiCascader/MultiCascader.tsx?");
 
 /***/ }),
 
@@ -4624,7 +4635,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 _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _get = _interopRequireDefault(__webpack_require__(/*! lodash/get */ \"./node_modules/lodash/get.js\"));\nvar _Heading = _interopRequireDefault(__webpack_require__(/*! ../Heading */ \"./src/Heading/index.tsx\"));\nvar _AccordionButton = _interopRequireDefault(__webpack_require__(/*! ./AccordionButton */ \"./src/Panel/AccordionButton.tsx\"));\nvar _Box = _interopRequireDefault(__webpack_require__(/*! ../internals/Box */ \"./src/internals/Box/index.tsx\"));\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Panel/PanelHeader.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\nconst PanelHeader = props => {\n  const {\n    as = _Heading.default,\n    classPrefix = 'panel',\n    className,\n    children,\n    collapsible,\n    caretAs,\n    disabled,\n    expanded,\n    role,\n    bodyId,\n    buttonId,\n    onClickButton,\n    ...rest\n  } = props;\n  const {\n    merge,\n    prefix\n  } = (0, _hooks.useStyles)(classPrefix);\n  let headerElement;\n  if (! /*#__PURE__*/(0, _react.isValidElement)(children) || Array.isArray(children)) {\n    headerElement = /*#__PURE__*/_react.default.createElement(\"span\", {\n      className: prefix('title'),\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 43,\n        columnNumber: 21\n      }\n    }, children);\n  } else {\n    const className = merge(prefix('title'), (0, _get.default)(children, 'props.className'));\n    headerElement = /*#__PURE__*/(0, _react.cloneElement)(children, {\n      className\n    });\n  }\n  return /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({\n    as: as,\n    level: 2,\n    className: merge(className, prefix('header'))\n  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 50,\n      columnNumber: 5\n    }\n  }), collapsible ? /*#__PURE__*/_react.default.createElement(_AccordionButton.default, {\n    id: buttonId,\n    role: role,\n    caretAs: caretAs,\n    controlId: bodyId,\n    disabled: disabled,\n    expanded: expanded,\n    onClick: onClickButton,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 52,\n      columnNumber: 9\n    }\n  }, headerElement) : headerElement);\n};\nvar _default = exports[\"default\"] = PanelHeader;\n\n//# sourceURL=webpack://rsuite/./src/Panel/PanelHeader.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 = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _get = _interopRequireDefault(__webpack_require__(/*! lodash/get */ \"./node_modules/lodash/get.js\"));\nvar _AccordionButton = _interopRequireDefault(__webpack_require__(/*! ./AccordionButton */ \"./src/Panel/AccordionButton.tsx\"));\nvar _Box = _interopRequireDefault(__webpack_require__(/*! ../internals/Box */ \"./src/internals/Box/index.tsx\"));\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Panel/PanelHeader.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\nconst PanelHeader = props => {\n  const {\n    as = 'div',\n    classPrefix = 'panel',\n    className,\n    children,\n    collapsible,\n    caretAs,\n    disabled,\n    expanded,\n    role,\n    bodyId,\n    buttonId,\n    onClickButton,\n    ...rest\n  } = props;\n  const {\n    merge,\n    prefix\n  } = (0, _hooks.useStyles)(classPrefix);\n  let headerElement;\n  if (! /*#__PURE__*/(0, _react.isValidElement)(children) || Array.isArray(children) || (0, _utils.isFragment)(children)) {\n    headerElement = /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix('title'),\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 43,\n        columnNumber: 21\n      }\n    }, children);\n  } else {\n    const className = merge(prefix('title'), (0, _get.default)(children, 'props.className'));\n    headerElement = /*#__PURE__*/(0, _react.cloneElement)(children, {\n      className\n    });\n  }\n  return /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({\n    as: as,\n    className: merge(className, prefix('header'))\n  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 50,\n      columnNumber: 5\n    }\n  }), collapsible ? /*#__PURE__*/_react.default.createElement(_AccordionButton.default, {\n    id: buttonId,\n    role: role,\n    caretAs: caretAs,\n    controlId: bodyId,\n    disabled: disabled,\n    expanded: expanded,\n    onClick: onClickButton,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 52,\n      columnNumber: 9\n    }\n  }, headerElement) : headerElement);\n};\nvar _default = exports[\"default\"] = PanelHeader;\n\n//# sourceURL=webpack://rsuite/./src/Panel/PanelHeader.tsx?");
 
 /***/ }),
 
@@ -5075,7 +5086,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 _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _Star = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/Star */ \"./node_modules/@rsuite/icons/esm/react/Star.js\"));\nvar _Character = _interopRequireDefault(__webpack_require__(/*! ./Character */ \"./src/Rate/Character.tsx\"));\nvar _Plaintext = _interopRequireDefault(__webpack_require__(/*! ../internals/Plaintext */ \"./src/internals/Plaintext/index.tsx\"));\nvar _StyledBox = _interopRequireDefault(__webpack_require__(/*! ../internals/StyledBox */ \"./src/internals/StyledBox/index.tsx\"));\nvar _constants = __webpack_require__(/*! ../internals/constants */ \"./src/internals/constants/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/Rate/utils.ts\");\nvar _useRatingStates = __webpack_require__(/*! ./useRatingStates */ \"./src/Rate/useRatingStates.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Rate/Rate.tsx\";\n/**\n * The `Rate` component is used for rating. It can be used to evaluate the quality of the content.\n * @see https://rsuitejs.com/components/rate/\n */\nconst Rate = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('Rate', props);\n  const {\n    as = 'ul',\n    character = /*#__PURE__*/_react.default.createElement(_Star.default, {\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 56,\n        columnNumber: 17\n      }\n    }),\n    className,\n    classPrefix = 'rate',\n    disabled,\n    max = 5,\n    readOnly,\n    vertical,\n    size,\n    color,\n    allowHalf = false,\n    value: valueProp,\n    defaultValue = 0,\n    cleanable = true,\n    plaintext,\n    style,\n    onChange,\n    renderCharacter,\n    onChangeActive,\n    ...rest\n  } = propsWithDefaults;\n  const [value, setValue] = (0, _hooks.useControlled)(valueProp, defaultValue);\n  const {\n    merge,\n    withPrefix\n  } = (0, _hooks.useStyles)(classPrefix);\n  const classes = merge(className, withPrefix());\n\n  // Use the custom hook to manage rating star states\n  const {\n    starStates,\n    setStarStates,\n    resetStarStates,\n    hoverValue,\n    getStarStates\n  } = (0, _useRatingStates.useRatingStates)({\n    value,\n    max,\n    allowHalf,\n    valueProp\n  });\n  const handleMouseLeave = (0, _hooks.useEventCallback)(event => {\n    resetStarStates();\n    onChangeActive === null || onChangeActive === void 0 || onChangeActive(value, event);\n  });\n  const handleChangeValue = (0, _hooks.useEventCallback)((index, event) => {\n    let nextValue = (0, _utils2.transformStarStatusToValue)(starStates);\n    if (cleanable && value === nextValue && getStarStates(value)[index] === starStates[index]) {\n      nextValue = 0;\n    }\n    if (nextValue !== value) {\n      setValue(nextValue);\n      setStarStates(getStarStates(nextValue));\n      onChange === null || onChange === void 0 || onChange(nextValue, event);\n    }\n  });\n  const handleKeyDown = (0, _hooks.useEventCallback)((index, event) => {\n    const {\n      key\n    } = event;\n    let nextValue = (0, _utils2.transformStarStatusToValue)(starStates);\n    if (key === _constants.KEY_VALUES.RIGHT && nextValue < max) {\n      nextValue = allowHalf ? nextValue + 0.5 : nextValue + 1;\n    } else if (key === _constants.KEY_VALUES.LEFT && nextValue > 0) {\n      nextValue = allowHalf ? nextValue - 0.5 : nextValue - 1;\n    }\n    setStarStates(getStarStates(nextValue));\n    if (key === _constants.KEY_VALUES.ENTER) {\n      handleChangeValue(index, event);\n    }\n  });\n  const handleChangeStarStates = (0, _hooks.useEventCallback)((index, key, event) => {\n    const nextStarStates = starStates.map((_item, i) => {\n      if (i === index && key === 'before' && allowHalf) {\n        return 0.5;\n      }\n      return index >= i ? 1 : 0;\n    });\n    if (!(0, _utils.shallowEqualArray)(starStates, nextStarStates)) {\n      setStarStates(nextStarStates);\n      onChangeActive === null || onChangeActive === void 0 || onChangeActive((0, _utils2.transformStarStatusToValue)(nextStarStates), event);\n    }\n  });\n  const handleClick = (0, _hooks.useEventCallback)((index, key, event) => {\n    handleChangeStarStates(index, key, event);\n    handleChangeValue(index, event);\n  });\n  if (plaintext) {\n    return /*#__PURE__*/_react.default.createElement(_Plaintext.default, {\n      localeKey: \"notSelected\",\n      className: className,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 150,\n        columnNumber: 7\n      }\n    }, !(0, _isNil.default)(value) ? `${value}/${max}` : null);\n  }\n  const mergedStyle = (0, _utils.mergeStyles)(style, {\n    '--rs-rate-before-size': (0, _utils2.getFractionalValue)(value)\n  });\n  return /*#__PURE__*/_react.default.createElement(_StyledBox.default, (0, _extends2.default)({\n    as: as,\n    name: \"rate\",\n    size: size,\n    color: color,\n    role: \"radiogroup\",\n    tabIndex: disabled ? -1 : 0,\n    ref: ref,\n    className: classes,\n    style: mergedStyle,\n    onMouseLeave: handleMouseLeave,\n    \"data-disabled\": disabled,\n    \"data-readonly\": readOnly\n  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 161,\n      columnNumber: 5\n    }\n  }), starStates.map((status, index) => /*#__PURE__*/_react.default.createElement(_Character.default, {\n    role: \"radio\",\n    \"aria-posinset\": index + 1,\n    \"aria-setsize\": max,\n    \"aria-checked\": value === index + 1,\n    key: index,\n    status: status,\n    disabled: disabled || readOnly,\n    vertical: vertical,\n    onClick: (key, event) => handleClick(index, key, event),\n    onKeyDown: event => handleKeyDown(index, event),\n    onMouseMove: (key, event) => handleChangeStarStates(index, key, event),\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 177,\n      columnNumber: 9\n    }\n  }, renderCharacter ? renderCharacter(hoverValue, index) : character)));\n});\nRate.displayName = 'Rate';\nvar _default = exports[\"default\"] = Rate;\n\n//# sourceURL=webpack://rsuite/./src/Rate/Rate.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 _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _Star = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/Star */ \"./node_modules/@rsuite/icons/esm/react/Star.js\"));\nvar _Character = _interopRequireDefault(__webpack_require__(/*! ./Character */ \"./src/Rate/Character.tsx\"));\nvar _Plaintext = _interopRequireDefault(__webpack_require__(/*! ../internals/Plaintext */ \"./src/internals/Plaintext/index.tsx\"));\nvar _StyledBox = _interopRequireDefault(__webpack_require__(/*! ../internals/StyledBox */ \"./src/internals/StyledBox/index.tsx\"));\nvar _constants = __webpack_require__(/*! ../internals/constants */ \"./src/internals/constants/index.ts\");\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ./utils */ \"./src/Rate/utils.ts\");\nvar _useRatingStates = __webpack_require__(/*! ./useRatingStates */ \"./src/Rate/useRatingStates.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/Rate/Rate.tsx\";\n/**\n * The `Rate` component is used for rating. It can be used to evaluate the quality of the content.\n * @see https://rsuitejs.com/components/rate/\n */\nconst Rate = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('Rate', props);\n  const {\n    as = 'ul',\n    character = /*#__PURE__*/_react.default.createElement(_Star.default, {\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 66,\n        columnNumber: 17\n      }\n    }),\n    className,\n    classPrefix = 'rate',\n    disabled,\n    max = 5,\n    name,\n    readOnly,\n    vertical,\n    size,\n    color,\n    allowHalf = false,\n    value: valueProp,\n    defaultValue = 0,\n    cleanable = true,\n    plaintext,\n    style,\n    onChange,\n    renderCharacter,\n    onChangeActive,\n    ...rest\n  } = propsWithDefaults;\n  const [value, setValue] = (0, _hooks.useControlled)(valueProp, defaultValue);\n  const {\n    merge,\n    withPrefix\n  } = (0, _hooks.useStyles)(classPrefix);\n  const classes = merge(className, withPrefix());\n\n  // Use the custom hook to manage rating star states\n  const {\n    starStates,\n    setStarStates,\n    resetStarStates,\n    hoverValue,\n    getStarStates\n  } = (0, _useRatingStates.useRatingStates)({\n    value,\n    max,\n    allowHalf,\n    valueProp\n  });\n  const handleMouseLeave = (0, _hooks.useEventCallback)(event => {\n    resetStarStates();\n    onChangeActive === null || onChangeActive === void 0 || onChangeActive(value, event);\n  });\n  const handleChangeValue = (0, _hooks.useEventCallback)((index, event) => {\n    let nextValue = (0, _utils2.transformStarStatusToValue)(starStates);\n    if (cleanable && value === nextValue && getStarStates(value)[index] === starStates[index]) {\n      nextValue = 0;\n    }\n    if (nextValue !== value) {\n      setValue(nextValue);\n      setStarStates(getStarStates(nextValue));\n      onChange === null || onChange === void 0 || onChange(nextValue, event);\n    }\n  });\n  const handleKeyDown = (0, _hooks.useEventCallback)((index, event) => {\n    const {\n      key\n    } = event;\n    let nextValue = (0, _utils2.transformStarStatusToValue)(starStates);\n    if (key === _constants.KEY_VALUES.RIGHT && nextValue < max) {\n      nextValue = allowHalf ? nextValue + 0.5 : nextValue + 1;\n    } else if (key === _constants.KEY_VALUES.LEFT && nextValue > 0) {\n      nextValue = allowHalf ? nextValue - 0.5 : nextValue - 1;\n    }\n    setStarStates(getStarStates(nextValue));\n    if (key === _constants.KEY_VALUES.ENTER) {\n      handleChangeValue(index, event);\n    }\n  });\n  const handleChangeStarStates = (0, _hooks.useEventCallback)((index, key, event) => {\n    const nextStarStates = starStates.map((_item, i) => {\n      if (i === index && key === 'before' && allowHalf) {\n        return 0.5;\n      }\n      return index >= i ? 1 : 0;\n    });\n    if (!(0, _utils.shallowEqualArray)(starStates, nextStarStates)) {\n      setStarStates(nextStarStates);\n      onChangeActive === null || onChangeActive === void 0 || onChangeActive((0, _utils2.transformStarStatusToValue)(nextStarStates), event);\n    }\n  });\n  const handleClick = (0, _hooks.useEventCallback)((index, key, event) => {\n    handleChangeStarStates(index, key, event);\n    handleChangeValue(index, event);\n  });\n  if (plaintext) {\n    return /*#__PURE__*/_react.default.createElement(_Plaintext.default, {\n      localeKey: \"notSelected\",\n      className: className,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 161,\n        columnNumber: 7\n      }\n    }, !(0, _isNil.default)(value) ? `${value}/${max}` : null);\n  }\n  const mergedStyle = (0, _utils.mergeStyles)(style, {\n    '--rs-rate-before-size': (0, _utils2.getFractionalValue)(value)\n  });\n  return /*#__PURE__*/_react.default.createElement(_StyledBox.default, (0, _extends2.default)({\n    as: as,\n    name: \"rate\",\n    size: size,\n    color: color,\n    role: \"radiogroup\",\n    tabIndex: disabled ? -1 : 0,\n    ref: ref,\n    className: classes,\n    style: mergedStyle,\n    onMouseLeave: handleMouseLeave,\n    \"data-disabled\": disabled,\n    \"data-readonly\": readOnly,\n    \"data-name\": name\n  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 172,\n      columnNumber: 5\n    }\n  }), starStates.map((status, index) => /*#__PURE__*/_react.default.createElement(_Character.default, {\n    role: \"radio\",\n    \"aria-posinset\": index + 1,\n    \"aria-setsize\": max,\n    \"aria-checked\": value === index + 1,\n    key: index,\n    status: status,\n    disabled: disabled || readOnly,\n    vertical: vertical,\n    onClick: (key, event) => handleClick(index, key, event),\n    onKeyDown: event => handleKeyDown(index, event),\n    onMouseMove: (key, event) => handleChangeStarStates(index, key, event),\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 189,\n      columnNumber: 9\n    }\n  }, renderCharacter ? renderCharacter(hoverValue, index) : character)));\n});\nRate.displayName = 'Rate';\nvar _default = exports[\"default\"] = Rate;\n\n//# sourceURL=webpack://rsuite/./src/Rate/Rate.tsx?");
 
 /***/ }),
 
@@ -5196,7 +5207,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 _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\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 _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/SelectPicker/SelectPicker.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\nconst 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 */\nconst SelectPicker = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('SelectPicker', props);\n  const {\n    appearance = 'default',\n    as,\n    block,\n    className,\n    cleanable = true,\n    classPrefix = 'picker',\n    data = emptyArray,\n    defaultValue,\n    disabled,\n    disabledItemValues = emptyArray,\n    groupBy,\n    id,\n    labelKey = 'label',\n    listProps,\n    listboxMaxHeight = 320,\n    locale,\n    placeholder,\n    placement = 'bottomStart',\n    popupAutoWidth = true,\n    popupClassName,\n    popupStyle,\n    searchable = true,\n    style,\n    toggleAs,\n    value: valueProp,\n    valueKey = 'value',\n    virtualized,\n    sort,\n    searchBy,\n    renderValue,\n    renderListbox,\n    renderOptionGroup,\n    renderOption,\n    renderExtraFooter,\n    onGroupTitleClick,\n    onEnter,\n    onExit,\n    onClean,\n    onChange,\n    onSelect,\n    onSearch,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    trigger,\n    root,\n    target,\n    overlay,\n    list,\n    searchInput\n  } = (0, _Picker.usePickerRef)(ref);\n  const [value, setValue] = (0, _hooks.useControlled)(valueProp, defaultValue);\n\n  // Used to hover the focus item  when trigger `onKeydown`\n  const {\n    focusItemValue,\n    setFocusItemValue,\n    onKeyDown: onFocusItem\n  } = (0, _Picker.useFocusItemValue)(value, {\n    data,\n    valueKey,\n    target: () => overlay.current\n  });\n\n  // Use search keywords to filter options.\n  const {\n    searchKeyword,\n    filteredData,\n    resetSearch,\n    handleSearch\n  } = (0, _Picker.useSearch)(data, {\n    labelKey,\n    searchBy,\n    callback: (searchKeyword, filteredData, event) => {\n      var _filteredData$;\n      // The first option after filtering is the focus.\n      setFocusItemValue(filteredData === null || filteredData === void 0 || (_filteredData$ = filteredData[0]) === null || _filteredData$ === void 0 ? void 0 : _filteredData$[valueKey]);\n      onSearch === null || onSearch === void 0 || onSearch(searchKeyword, event);\n    }\n  });\n\n  // Use component active state to support keyboard events.\n  const [active, setActive] = (0, _react.useState)(false);\n  const handleClose = (0, _hooks.useEventCallback)(() => {\n    var _trigger$current, _trigger$current$clos;\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 || (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 || _trigger$current$clos.call(_trigger$current);\n  });\n  const handleSelect = (0, _hooks.useEventCallback)((value, item, event) => {\n    var _target$current;\n    onSelect === null || onSelect === void 0 || onSelect(value, item, event);\n    (_target$current = target.current) === null || _target$current === void 0 || _target$current.focus();\n  });\n  const handleChangeValue = (0, _hooks.useEventCallback)((value, event) => {\n    onChange === null || onChange === void 0 || onChange(value, event);\n  });\n  const handleMenuPressEnter = (0, _hooks.useEventCallback)(event => {\n    if (!focusItemValue) {\n      return;\n    }\n\n    // Find active `MenuItem` by `value`\n    const focusItem = data.find(item => (0, _utils.shallowEqual)(item[valueKey], focusItemValue));\n    setValue(focusItemValue);\n    handleSelect(focusItemValue, focusItem, event);\n    handleChangeValue(focusItemValue, event);\n    handleClose();\n  });\n  const handleItemSelect = (0, _hooks.useEventCallback)((value, item, event) => {\n    setValue(value);\n    setFocusItemValue(value);\n    handleSelect(value, item, event);\n    handleChangeValue(value, event);\n    handleClose();\n  });\n  const handleClean = (0, _hooks.useEventCallback)(event => {\n    if (disabled || !cleanable) {\n      return;\n    }\n    setValue(null);\n    setFocusItemValue(value);\n    handleChangeValue(null, event);\n  });\n  const onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)({\n    toggle: !focusItemValue || !active,\n    trigger,\n    target,\n    overlay,\n    searchInput,\n    active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter,\n    ...rest\n  });\n  const handleExit = (0, _hooks.useEventCallback)(() => {\n    resetSearch();\n    setActive(false);\n    onSearch === null || onSearch === void 0 || onSearch('');\n    setFocusItemValue(null);\n  });\n  const handleEnter = (0, _hooks.useEventCallback)(() => {\n    setActive(true);\n    setFocusItemValue(value);\n  });\n\n  // Find active `MenuItem` by `value`\n  const activeItem = data.find(item => (0, _utils.shallowEqual)(item[valueKey], value));\n\n  /**\n   * 1.Have a value and the value is valid.\n   * 2.Regardless of whether the value is valid, as long as renderValue is set, it is judged to have a value.\n   */\n  let hasValue = !!activeItem || !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue);\n  const {\n    prefix,\n    merge\n  } = (0, _hooks.useStyles)(classPrefix);\n  let 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  const renderPopup = (positionProps, speakerRef) => {\n    const {\n      className\n    } = positionProps;\n    const classes = merge(className, popupClassName, prefix('select-menu'));\n    let items = filteredData;\n\n    // Create a tree structure data when set `groupBy`\n    if (groupBy) {\n      items = (0, _utils.getDataGroupBy)(items, groupBy, sort);\n    } else if (typeof sort === 'function') {\n      items = items.sort(sort(false));\n    }\n    const listbox = items.length ? /*#__PURE__*/_react.default.createElement(_Picker.Listbox, {\n      listProps: listProps,\n      listRef: list,\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      renderOptionGroup: renderOptionGroup,\n      renderOption: renderOption,\n      maxHeight: listboxMaxHeight,\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: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 295,\n        columnNumber: 9\n      }\n    }) : /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix`none`,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 317,\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: popupAutoWidth,\n      className: classes,\n      style: popupStyle,\n      onKeyDown: onPickerKeyDown,\n      target: trigger,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 321,\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: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 330,\n        columnNumber: 13\n      }\n    }), renderListbox ? renderListbox(listbox) : listbox, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  const triggerProps = {\n    ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n    onEnter: (0, _utils.createChainedFunction)(handleEnter, onEnter),\n    onExit: (0, _utils.createChainedFunction)(handleExit, onExit)\n  };\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    as: as,\n    id: id,\n    name: \"select\",\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    triggerProps: triggerProps,\n    ref: trigger,\n    placement: placement,\n    speaker: renderPopup,\n    rootRef: root,\n    style: style,\n    classPrefix: classPrefix,\n    className: className,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 351,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({\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  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 367,\n      columnNumber: 9\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder)));\n});\nSelectPicker.displayName = 'SelectPicker';\nvar _default = exports[\"default\"] = SelectPicker;\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\");\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 _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 _SearchBox = _interopRequireDefault(__webpack_require__(/*! ../internals/SearchBox */ \"./src/internals/SearchBox/index.tsx\"));\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/SelectPicker/SelectPicker.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\nconst 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 */\nconst SelectPicker = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('SelectPicker', props);\n  const {\n    appearance = 'default',\n    as,\n    block,\n    className,\n    cleanable = true,\n    classPrefix = 'picker',\n    data = emptyArray,\n    defaultValue,\n    disabled,\n    disabledItemValues = emptyArray,\n    groupBy,\n    id,\n    labelKey = 'label',\n    listProps,\n    listboxMaxHeight = 320,\n    locale,\n    placeholder,\n    placement = 'bottomStart',\n    popupAutoWidth = true,\n    popupClassName,\n    popupStyle,\n    searchable = true,\n    style,\n    toggleAs,\n    value: valueProp,\n    valueKey = 'value',\n    virtualized,\n    sort,\n    searchBy,\n    renderValue,\n    renderListbox,\n    renderOptionGroup,\n    renderOption,\n    renderExtraFooter,\n    onGroupTitleClick,\n    onEnter,\n    onExit,\n    onClean,\n    onChange,\n    onSelect,\n    onSearch,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    trigger,\n    root,\n    target,\n    overlay,\n    list,\n    searchInput\n  } = (0, _Picker.usePickerRef)(ref);\n  const [value, setValue] = (0, _hooks.useControlled)(valueProp, defaultValue);\n\n  // Used to hover the focus item  when trigger `onKeydown`\n  const {\n    focusItemValue,\n    setFocusItemValue,\n    onKeyDown: onFocusItem\n  } = (0, _Picker.useFocusItemValue)(value, {\n    data,\n    valueKey,\n    target: () => overlay.current\n  });\n\n  // Use search keywords to filter options.\n  const {\n    searchKeyword,\n    filteredData,\n    resetSearch,\n    handleSearch\n  } = (0, _Picker.useSearch)(data, {\n    labelKey,\n    searchBy,\n    callback: (searchKeyword, filteredData, event) => {\n      var _filteredData$;\n      // The first option after filtering is the focus.\n      setFocusItemValue(filteredData === null || filteredData === void 0 || (_filteredData$ = filteredData[0]) === null || _filteredData$ === void 0 ? void 0 : _filteredData$[valueKey]);\n      onSearch === null || onSearch === void 0 || onSearch(searchKeyword, event);\n    }\n  });\n\n  // Use component active state to support keyboard events.\n  const [active, setActive] = (0, _react.useState)(false);\n  const handleClose = (0, _hooks.useEventCallback)(() => {\n    var _trigger$current, _trigger$current$clos;\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 || (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 || _trigger$current$clos.call(_trigger$current);\n  });\n  const handleSelect = (0, _hooks.useEventCallback)((value, item, event) => {\n    var _target$current;\n    onSelect === null || onSelect === void 0 || onSelect(value, item, event);\n    (_target$current = target.current) === null || _target$current === void 0 || _target$current.focus();\n  });\n  const handleChangeValue = (0, _hooks.useEventCallback)((value, event) => {\n    onChange === null || onChange === void 0 || onChange(value, event);\n  });\n  const handleMenuPressEnter = (0, _hooks.useEventCallback)(event => {\n    if (!focusItemValue) {\n      return;\n    }\n\n    // Find active `MenuItem` by `value`\n    const focusItem = data.find(item => (0, _utils.shallowEqual)(item[valueKey], focusItemValue));\n    setValue(focusItemValue);\n    handleSelect(focusItemValue, focusItem, event);\n    handleChangeValue(focusItemValue, event);\n    handleClose();\n  });\n  const handleItemSelect = (0, _hooks.useEventCallback)((value, item, event) => {\n    setValue(value);\n    setFocusItemValue(value);\n    handleSelect(value, item, event);\n    handleChangeValue(value, event);\n    handleClose();\n  });\n  const handleClean = (0, _hooks.useEventCallback)(event => {\n    if (disabled || !cleanable) {\n      return;\n    }\n    setValue(null);\n    setFocusItemValue(value);\n    handleChangeValue(null, event);\n  });\n  const onPickerKeyDown = (0, _Picker.useToggleKeyDownEvent)({\n    toggle: !focusItemValue || !active,\n    trigger,\n    target,\n    overlay,\n    searchInput,\n    active,\n    onExit: handleClean,\n    onMenuKeyDown: onFocusItem,\n    onMenuPressEnter: handleMenuPressEnter,\n    ...rest\n  });\n  const handleExit = (0, _hooks.useEventCallback)(() => {\n    resetSearch();\n    setActive(false);\n    onSearch === null || onSearch === void 0 || onSearch('');\n    setFocusItemValue(null);\n  });\n  const handleEnter = (0, _hooks.useEventCallback)(() => {\n    setActive(true);\n    setFocusItemValue(value);\n  });\n\n  // Find active `MenuItem` by `value`\n  const activeItem = data.find(item => (0, _utils.shallowEqual)(item[valueKey], value));\n\n  /**\n   * 1.Have a value and the value is valid.\n   * 2.Regardless of whether the value is valid, as long as renderValue is set, it is judged to have a value.\n   */\n  let hasValue = !!activeItem || !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue);\n  const {\n    prefix,\n    merge\n  } = (0, _hooks.useStyles)(classPrefix);\n  let 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  const renderPopup = (positionProps, speakerRef) => {\n    const {\n      className\n    } = positionProps;\n    const classes = merge(className, popupClassName, prefix('select-menu'));\n    let items = filteredData;\n\n    // Create a tree structure data when set `groupBy`\n    if (groupBy) {\n      items = (0, _utils.getDataGroupBy)(items, groupBy, sort);\n    } else if (typeof sort === 'function') {\n      items = items.sort(sort(false));\n    }\n    const listbox = items.length ? /*#__PURE__*/_react.default.createElement(_Picker.Listbox, {\n      listProps: listProps,\n      listRef: list,\n      disabledItemValues: disabledItemValues,\n      valueKey: valueKey,\n      labelKey: labelKey,\n      renderOptionGroup: renderOptionGroup,\n      renderOption: renderOption,\n      maxHeight: listboxMaxHeight,\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: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 295,\n        columnNumber: 9\n      }\n    }) : /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix`none`,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 317,\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: popupAutoWidth,\n      className: classes,\n      style: popupStyle,\n      onKeyDown: onPickerKeyDown,\n      target: trigger,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 321,\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: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 330,\n        columnNumber: 13\n      }\n    }), renderListbox ? renderListbox(listbox) : listbox, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());\n  };\n  const triggerProps = {\n    ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n    onEnter: (0, _utils.createChainedFunction)(handleEnter, onEnter),\n    onExit: (0, _utils.createChainedFunction)(handleExit, onExit)\n  };\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    as: as,\n    id: id,\n    pickerType: \"select\",\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    triggerProps: triggerProps,\n    ref: trigger,\n    placement: placement,\n    speaker: renderPopup,\n    rootRef: root,\n    style: style,\n    classPrefix: classPrefix,\n    className: className,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 351,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({\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  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 367,\n      columnNumber: 9\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder)));\n});\nSelectPicker.displayName = 'SelectPicker';\nvar _default = exports[\"default\"] = SelectPicker;\n\n//# sourceURL=webpack://rsuite/./src/SelectPicker/SelectPicker.tsx?");
 
 /***/ }),
 
@@ -6120,7 +6131,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 _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _useForceUpdate = _interopRequireDefault(__webpack_require__(/*! ./useForceUpdate */ \"./src/Tree/hooks/useForceUpdate.ts\"));\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _utils = __webpack_require__(/*! ../../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/Tree/utils/index.ts\");\n/**\n * Custom hook that flattens a tree data structure into a map of nodes.\n *\n */\nfunction useFlattenTree(data, options) {\n  const {\n    value,\n    labelKey,\n    valueKey,\n    childrenKey,\n    uncheckableItemValues = [],\n    cascade,\n    multiple,\n    callback\n  } = options;\n  const forceUpdate = (0, _useForceUpdate.default)();\n  const flattenedNodes = (0, _react.useRef)({});\n  const seenValues = (0, _react.useRef)(new Set());\n  const updateTreeNodeCheckState = (0, _react.useCallback)((value = []) => {\n    // Reset values to false\n    Object.keys(flattenedNodes.current).forEach(refKey => {\n      const 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(nodeVal => {\n        if ((0, _utils.shallowEqual)(flattenedNodes.current[refKey][valueKey], nodeVal) && !uncheckableItemValues.some(uncheckableValue => (0, _utils.shallowEqual)(nodeVal, uncheckableValue))) {\n          flattenedNodes.current[refKey].check = true;\n        }\n      });\n    });\n  }, [cascade, uncheckableItemValues, valueKey]);\n  const flattenTreeData = (0, _react.useCallback)((treeData, parent, layer = 1) => {\n    if (!Array.isArray(treeData) || treeData.length === 0) {\n      return [];\n    }\n    treeData.map(node => {\n      const value = node[valueKey];\n\n      // Check for duplicate values\n      if (seenValues.current.has(value)) {\n        console.error(`[rsuite] The value '${value}' is duplicated. Each node in the tree data must have a unique value.`);\n      }\n      seenValues.current.add(value);\n      const refKey = (0, _utils2.formatNodeRefKey)(value);\n      node.refKey = refKey;\n      flattenedNodes.current[refKey] = {\n        layer,\n        [labelKey]: node[labelKey],\n        [valueKey]: node[valueKey],\n        uncheckable: uncheckableItemValues.some(value => (0, _utils.shallowEqual)(node[valueKey], value)),\n        ...node\n      };\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 || callback(flattenedNodes.current);\n    forceUpdate();\n  }, [callback, forceUpdate, valueKey, labelKey, uncheckableItemValues, childrenKey]);\n  (0, _react.useEffect)(() => {\n    // when data is changed, should clear the flattenedNodes, avoid duplicate keys\n    flattenedNodes.current = {};\n    seenValues.current.clear();\n    flattenTreeData(data);\n  }, [data]);\n  (0, _react.useEffect)(() => {\n    if (multiple) {\n      updateTreeNodeCheckState(value);\n      forceUpdate();\n    }\n\n    /**\n     * Add a dependency on data, because when loading data asynchronously through getChildren,\n     * data may change and the node status needs to be updated.\n     * @see https://github.com/rsuite/rsuite/issues/3973\n     */\n  }, [value, data]);\n  return flattenedNodes.current;\n}\nvar _default = exports[\"default\"] = useFlattenTree;\n\n//# sourceURL=webpack://rsuite/./src/Tree/hooks/useFlattenTree.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 _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _useForceUpdate = _interopRequireDefault(__webpack_require__(/*! ./useForceUpdate */ \"./src/Tree/hooks/useForceUpdate.ts\"));\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _utils = __webpack_require__(/*! ../../internals/utils */ \"./src/internals/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/Tree/utils/index.ts\");\n/**\n * Custom hook that flattens a tree data structure into a map of nodes.\n *\n */\nfunction useFlattenTree(data, options) {\n  const {\n    value,\n    labelKey,\n    valueKey,\n    childrenKey,\n    uncheckableItemValues = [],\n    disabledItemValues = [],\n    cascade,\n    multiple,\n    callback\n  } = options;\n  const forceUpdate = (0, _useForceUpdate.default)();\n  const flattenedNodes = (0, _react.useRef)({});\n  const seenValues = (0, _react.useRef)(new Set());\n  const updateTreeNodeCheckState = (0, _react.useCallback)((value = []) => {\n    // Reset values to false\n    Object.keys(flattenedNodes.current).forEach(refKey => {\n      const node = flattenedNodes.current[refKey];\n\n      // Check if this node or any of its parents is disabled\n      const isNodeDisabled = disabledItemValues.some(disabledValue => (0, _utils.shallowEqual)(node[valueKey], disabledValue));\n      let hasDisabledParent = false;\n      let currentNode = node;\n      while (currentNode.parent && !hasDisabledParent) {\n        const parentRefKey = currentNode.parent.refKey;\n        if (parentRefKey && flattenedNodes.current[parentRefKey]) {\n          const parentValue = flattenedNodes.current[parentRefKey][valueKey];\n          if (disabledItemValues.some(disabledValue => (0, _utils.shallowEqual)(parentValue, disabledValue))) {\n            hasDisabledParent = true;\n          }\n        }\n        currentNode = currentNode.parent;\n      }\n\n      // Skip disabled nodes - they should not be affected by cascade or value changes\n      if (isNodeDisabled || hasDisabledParent) {\n        return;\n      }\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(nodeVal => {\n        if ((0, _utils.shallowEqual)(flattenedNodes.current[refKey][valueKey], nodeVal) && !uncheckableItemValues.some(uncheckableValue => (0, _utils.shallowEqual)(nodeVal, uncheckableValue))) {\n          flattenedNodes.current[refKey].check = true;\n        }\n      });\n    });\n  }, [cascade, uncheckableItemValues, disabledItemValues, valueKey]);\n  const flattenTreeData = (0, _react.useCallback)((treeData, parent, layer = 1) => {\n    if (!Array.isArray(treeData) || treeData.length === 0) {\n      return [];\n    }\n    treeData.map(node => {\n      const value = node[valueKey];\n\n      // Check for duplicate values\n      if (seenValues.current.has(value)) {\n        console.error(`[rsuite] The value '${value}' is duplicated. Each node in the tree data must have a unique value.`);\n      }\n      seenValues.current.add(value);\n      const refKey = (0, _utils2.formatNodeRefKey)(value);\n      node.refKey = refKey;\n      flattenedNodes.current[refKey] = {\n        layer,\n        [labelKey]: node[labelKey],\n        [valueKey]: node[valueKey],\n        uncheckable: uncheckableItemValues.some(value => (0, _utils.shallowEqual)(node[valueKey], value)),\n        ...node\n      };\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 || callback(flattenedNodes.current);\n    forceUpdate();\n  }, [callback, forceUpdate, valueKey, labelKey, uncheckableItemValues, childrenKey]);\n  (0, _react.useEffect)(() => {\n    // when data is changed, should clear the flattenedNodes, avoid duplicate keys\n    flattenedNodes.current = {};\n    seenValues.current.clear();\n    flattenTreeData(data);\n  }, [data]);\n  (0, _react.useEffect)(() => {\n    if (multiple) {\n      updateTreeNodeCheckState(value);\n      forceUpdate();\n    }\n\n    /**\n     * Add a dependency on data, because when loading data asynchronously through getChildren,\n     * data may change and the node status needs to be updated.\n     * @see https://github.com/rsuite/rsuite/issues/3973\n     */\n  }, [value, data]);\n  return flattenedNodes.current;\n}\nvar _default = exports[\"default\"] = useFlattenTree;\n\n//# sourceURL=webpack://rsuite/./src/Tree/hooks/useFlattenTree.ts?");
 
 /***/ }),
 
@@ -6131,7 +6142,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 _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _constants = __webpack_require__(/*! ../../internals/constants */ \"./src/internals/constants/index.ts\");\nvar _hooks = __webpack_require__(/*! ../../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _Picker = __webpack_require__(/*! ../../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../../internals/Tree/TreeProvider */ \"./src/internals/Tree/TreeProvider.tsx\");\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/Tree/utils/index.ts\");\nvar _useTreeNodeRefs = _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  const {\n    filteredData,\n    searchKeyword,\n    flattenedNodes,\n    expandItemValues,\n    disabledItemValues,\n    onExpand,\n    onFocused\n  } = props;\n  const {\n    rtl\n  } = (0, _hooks.useCustom)();\n  const {\n    valueKey,\n    childrenKey\n  } = (0, _TreeProvider.useItemDataKeys)();\n  const {\n    treeNodesRefs,\n    saveTreeNodeRef\n  } = (0, _useTreeNodeRefs.default)();\n  const treeViewRef = (0, _react.useRef)(null);\n  const [focusItemValue, setFocusItemValue] = (0, _react.useState)(null);\n  const register = (0, _TreeProvider.useRegisterTreeMethods)();\n  const flattenedNodesRef = (0, _react.useRef)(flattenedNodes);\n  const getFocusProps = value => {\n    const options = {\n      disabledItemValues,\n      valueKey,\n      childrenKey,\n      expandItemValues\n    };\n    const focusableItems = (0, _utils.getFocusableItems)(filteredData, options, (0, _utils.isSearching)(searchKeyword));\n    return {\n      focusItemValue: value || focusItemValue,\n      valueKey,\n      focusableItems,\n      treeNodesRefs\n    };\n  };\n  const handleFocusItem = (0, _hooks.useEventCallback)(key => {\n    const focusProps = getFocusProps();\n    let focusedValue = null;\n    if (key === _constants.KEY_VALUES.DOWN) {\n      focusedValue = (0, _utils.focusNextItem)(focusProps);\n    } else if (key === _constants.KEY_VALUES.UP) {\n      focusedValue = (0, _utils.focusPreviousItem)(focusProps);\n    }\n    if (focusedValue) {\n      setFocusItemValue(focusedValue);\n      onFocused === null || onFocused === void 0 || onFocused(focusedValue);\n    }\n  });\n  const handleLeftArrowEvent = (0, _hooks.useEventCallback)(() => {\n    if ((0, _isNil.default)(focusItemValue)) {\n      return;\n    }\n    const focusItem = (0, _utils.getActiveItem)(focusItemValue, flattenedNodes, valueKey);\n    const expand = expandItemValues.includes(focusItem === null || focusItem === void 0 ? void 0 : focusItem[valueKey]);\n    const onFocusItem = () => {\n      var _focusItem$parent, _focusItem$parent2;\n      const focusedValue = focusItem === null || focusItem === 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 || onFocused(focusedValue);\n      (0, _utils.focusTreeNode)(focusItem === null || focusItem === void 0 || (_focusItem$parent2 = focusItem.parent) === null || _focusItem$parent2 === void 0 ? void 0 : _focusItem$parent2.refKey, treeNodesRefs);\n    };\n    (0, _utils.handleLeftArrow)({\n      focusItem,\n      expand,\n      onExpand,\n      childrenKey,\n      onFocusItem\n    });\n  });\n  const handleRightArrowEvent = (0, _hooks.useEventCallback)(() => {\n    if ((0, _isNil.default)(focusItemValue)) {\n      return;\n    }\n    const focusItem = (0, _utils.getActiveItem)(focusItemValue, flattenedNodes, valueKey);\n    const expand = expandItemValues.includes(focusItem === null || focusItem === void 0 ? void 0 : focusItem[valueKey]);\n    const onFocusItem = () => handleFocusItem(_constants.KEY_VALUES.DOWN);\n    (0, _utils.handleRightArrow)({\n      focusItem,\n      expand,\n      childrenKey,\n      onExpand,\n      onFocusItem\n    });\n  });\n  const onTreeKeydown = (0, _hooks.useEventCallback)(event => {\n    (0, _Picker.onMenuKeyDown)(event, {\n      down: () => handleFocusItem(_constants.KEY_VALUES.DOWN),\n      up: () => handleFocusItem(_constants.KEY_VALUES.UP),\n      left: rtl ? handleRightArrowEvent : handleLeftArrowEvent,\n      right: rtl ? handleLeftArrowEvent : handleRightArrowEvent\n    });\n  });\n  const focusTreeFirstNode = (0, _hooks.useEventCallback)(() => {\n    handleFocusItem(_constants.KEY_VALUES.DOWN);\n  });\n  const focusTreeActiveNode = (0, _react.useCallback)(() => {\n    const refKey = (0, _utils.focusCurrentItem)({\n      container: treeViewRef.current\n    });\n    if (refKey) {\n      var _flattenedNodesRef$cu;\n      const 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 || onFocused(node[valueKey]);\n      }\n    }\n  }, [onFocused, valueKey]);\n  (0, _react.useEffect)(() => {\n    const unregister = register === null || register === void 0 ? void 0 : register({\n      focusTreeFirstNode,\n      focusTreeActiveNode\n    });\n    return () => {\n      unregister === null || unregister === void 0 || unregister();\n    };\n  }, []);\n  (0, _react.useEffect)(() => {\n    flattenedNodesRef.current = flattenedNodes;\n  }, [flattenedNodes]);\n  return {\n    treeViewRef,\n    focusTreeFirstNode,\n    focusItemValue,\n    treeNodesRefs,\n    saveTreeNodeRef,\n    setFocusItemValue,\n    onTreeKeydown\n  };\n}\nvar _default = exports[\"default\"] = useFocusTree;\n\n//# sourceURL=webpack://rsuite/./src/Tree/hooks/useFocusTree.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 _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _constants = __webpack_require__(/*! ../../internals/constants */ \"./src/internals/constants/index.ts\");\nvar _hooks = __webpack_require__(/*! ../../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _Picker = __webpack_require__(/*! ../../internals/Picker */ \"./src/internals/Picker/index.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../../internals/Tree/TreeProvider */ \"./src/internals/Tree/TreeProvider.tsx\");\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/Tree/utils/index.ts\");\nvar _useTreeNodeRefs = _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  const {\n    filteredData,\n    searchKeyword,\n    flattenedNodes,\n    expandItemValues,\n    disabledItemValues,\n    onExpand,\n    onFocused\n  } = props;\n  const {\n    rtl\n  } = (0, _hooks.useCustom)();\n  const {\n    valueKey,\n    childrenKey\n  } = (0, _TreeProvider.useItemDataKeys)();\n  const {\n    treeNodesRefs,\n    saveTreeNodeRef\n  } = (0, _useTreeNodeRefs.default)();\n  const treeViewRef = (0, _react.useRef)(null);\n  const [focusItemValue, setFocusItemValue] = (0, _react.useState)(null);\n  const register = (0, _TreeProvider.useRegisterTreeMethods)();\n  const flattenedNodesRef = (0, _react.useRef)(flattenedNodes);\n  const getFocusProps = value => {\n    const options = {\n      disabledItemValues,\n      valueKey,\n      childrenKey,\n      expandItemValues\n    };\n    const focusableItems = (0, _utils.getFocusableItems)(filteredData, options, (0, _utils.isSearching)(searchKeyword));\n    return {\n      focusItemValue: value || focusItemValue,\n      valueKey,\n      focusableItems,\n      treeNodesRefs\n    };\n  };\n  const handleFocusItem = (0, _hooks.useEventCallback)(key => {\n    const focusProps = getFocusProps();\n    let focusedValue = null;\n    if (key === _constants.KEY_VALUES.DOWN) {\n      focusedValue = (0, _utils.focusNextItem)(focusProps);\n    } else if (key === _constants.KEY_VALUES.UP) {\n      focusedValue = (0, _utils.focusPreviousItem)(focusProps);\n    }\n    if (focusedValue) {\n      setFocusItemValue(focusedValue);\n      onFocused === null || onFocused === void 0 || onFocused(focusedValue);\n    }\n  });\n  const handleLeftArrowEvent = (0, _hooks.useEventCallback)(() => {\n    if ((0, _isNil.default)(focusItemValue)) {\n      return;\n    }\n    const focusItem = (0, _utils.getActiveItem)(focusItemValue, flattenedNodes, valueKey);\n    const expand = expandItemValues.includes(focusItem === null || focusItem === void 0 ? void 0 : focusItem[valueKey]);\n    const onFocusItem = () => {\n      var _focusItem$parent, _focusItem$parent2;\n      const focusedValue = focusItem === null || focusItem === 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 || onFocused(focusedValue);\n      (0, _utils.focusTreeNode)(focusItem === null || focusItem === void 0 || (_focusItem$parent2 = focusItem.parent) === null || _focusItem$parent2 === void 0 ? void 0 : _focusItem$parent2.refKey, treeNodesRefs);\n    };\n    (0, _utils.handleLeftArrow)({\n      focusItem,\n      expand,\n      onExpand,\n      childrenKey,\n      onFocusItem\n    });\n  });\n  const handleRightArrowEvent = (0, _hooks.useEventCallback)(() => {\n    if ((0, _isNil.default)(focusItemValue)) {\n      return;\n    }\n    const focusItem = (0, _utils.getActiveItem)(focusItemValue, flattenedNodes, valueKey);\n    const expand = expandItemValues.includes(focusItem === null || focusItem === void 0 ? void 0 : focusItem[valueKey]);\n    const onFocusItem = () => handleFocusItem(_constants.KEY_VALUES.DOWN);\n    (0, _utils.handleRightArrow)({\n      focusItem,\n      expand,\n      childrenKey,\n      onExpand,\n      onFocusItem\n    });\n  });\n  const handleHomeKey = (0, _hooks.useEventCallback)(() => {\n    const focusProps = getFocusProps();\n    const focusedValue = (0, _utils.focusFirstItem)(focusProps);\n    if (focusedValue) {\n      setFocusItemValue(focusedValue);\n      onFocused === null || onFocused === void 0 || onFocused(focusedValue);\n    }\n  });\n  const handleEndKey = (0, _hooks.useEventCallback)(() => {\n    const focusProps = getFocusProps();\n    const focusedValue = (0, _utils.focusLastItem)(focusProps);\n    if (focusedValue) {\n      setFocusItemValue(focusedValue);\n      onFocused === null || onFocused === void 0 || onFocused(focusedValue);\n    }\n  });\n  const onTreeKeydown = (0, _hooks.useEventCallback)(event => {\n    (0, _Picker.onMenuKeyDown)(event, {\n      down: () => handleFocusItem(_constants.KEY_VALUES.DOWN),\n      up: () => handleFocusItem(_constants.KEY_VALUES.UP),\n      left: rtl ? handleRightArrowEvent : handleLeftArrowEvent,\n      right: rtl ? handleLeftArrowEvent : handleRightArrowEvent,\n      home: handleHomeKey,\n      end: handleEndKey\n    });\n  });\n  const focusTreeFirstNode = (0, _hooks.useEventCallback)(() => {\n    handleFocusItem(_constants.KEY_VALUES.DOWN);\n  });\n  const focusTreeActiveNode = (0, _react.useCallback)(() => {\n    const refKey = (0, _utils.focusCurrentItem)({\n      container: treeViewRef.current\n    });\n    if (refKey) {\n      var _flattenedNodesRef$cu;\n      const 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 || onFocused(node[valueKey]);\n      }\n    }\n  }, [onFocused, valueKey]);\n  (0, _react.useEffect)(() => {\n    const unregister = register === null || register === void 0 ? void 0 : register({\n      focusTreeFirstNode,\n      focusTreeActiveNode\n    });\n    return () => {\n      unregister === null || unregister === void 0 || unregister();\n    };\n  }, []);\n  (0, _react.useEffect)(() => {\n    flattenedNodesRef.current = flattenedNodes;\n  }, [flattenedNodes]);\n  return {\n    treeViewRef,\n    focusTreeFirstNode,\n    focusItemValue,\n    treeNodesRefs,\n    saveTreeNodeRef,\n    setFocusItemValue,\n    onTreeKeydown\n  };\n}\nvar _default = exports[\"default\"] = useFocusTree;\n\n//# sourceURL=webpack://rsuite/./src/Tree/hooks/useFocusTree.ts?");
 
 /***/ }),
 
@@ -6208,7 +6219,7 @@ eval("\n\nexports.__esModule = true;\nexports[\"default\"] = useTreeWithChildren
 /***/ (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 _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__(/*! ../../internals/Tree/TreeProvider */ \"./src/internals/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  const 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  const {\n    childrenKey,\n    valueKey\n  } = (0, _TreeProvider.useItemDataKeys)();\n\n  /**\n   * Formats the virtualized tree data.\n   */\n  return (0, _react.useCallback)(() => {\n    const {\n      cascade,\n      searchKeyword,\n      expandItemValues\n    } = options;\n    return (0, _flattenTree.UNSAFE_flattenTree)(data, childrenKey, node => {\n      let formatted = {};\n      const curNode = nodes === null || nodes === void 0 ? void 0 : nodes[node.refKey];\n      const 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      let 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        const checkState = !(0, _isUndefined.default)(cascade) ? (0, _utils.getNodeCheckState)(curNode, {\n          cascade,\n          nodes,\n          childrenKey\n        }) : undefined;\n        formatted = {\n          ...node,\n          check: curNode.check,\n          uncheckable: curNode.uncheckable,\n          hasChildren: !!node[childrenKey],\n          layer: curNode.layer,\n          parent: curNode.parent,\n          checkState,\n          visible\n        };\n      }\n      return formatted;\n    });\n  }, [childrenKey, data, nodes, options, valueKey]);\n}\nvar _default = exports[\"default\"] = useVirtualizedTreeData;\n\n//# sourceURL=webpack://rsuite/./src/Tree/hooks/useVirtualizedTreeData.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 _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__(/*! ../../internals/Tree/TreeProvider */ \"./src/internals/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  const 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  const {\n    childrenKey,\n    valueKey\n  } = (0, _TreeProvider.useItemDataKeys)();\n\n  /**\n   * Formats the virtualized tree data.\n   */\n  return (0, _react.useCallback)(() => {\n    const {\n      cascade,\n      searchKeyword,\n      expandItemValues,\n      disabledItemValues = []\n    } = options;\n    return (0, _flattenTree.UNSAFE_flattenTree)(data, childrenKey, node => {\n      let formatted = {};\n      const curNode = nodes === null || nodes === void 0 ? void 0 : nodes[node.refKey];\n      const 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      let 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        const checkState = !(0, _isUndefined.default)(cascade) ? (0, _utils.getNodeCheckState)(curNode, {\n          cascade,\n          nodes,\n          childrenKey,\n          disabledItemValues,\n          valueKey\n        }) : undefined;\n        formatted = {\n          ...node,\n          check: curNode.check,\n          uncheckable: curNode.uncheckable,\n          hasChildren: !!node[childrenKey],\n          layer: curNode.layer,\n          parent: curNode.parent,\n          checkState,\n          visible\n        };\n      }\n      return formatted;\n    });\n  }, [childrenKey, data, nodes, options, valueKey]);\n}\nvar _default = exports[\"default\"] = useVirtualizedTreeData;\n\n//# sourceURL=webpack://rsuite/./src/Tree/hooks/useVirtualizedTreeData.ts?");
 
 /***/ }),
 
@@ -6241,7 +6252,7 @@ eval("\n\nexports.__esModule = true;\nexports.UNSAFE_flattenTree = UNSAFE_flatte
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nexports.__esModule = true;\nexports.getFocusableItems = exports.getActiveItem = exports.focusTreeNode = exports.focusPreviousItem = exports.focusNextItem = exports.focusCurrentItem = void 0;\nexports.scrollToActiveTreeNode = scrollToActiveTreeNode;\nvar _utils = __webpack_require__(/*! ../../internals/utils */ \"./src/internals/utils/index.ts\");\n// Active tree node selector\nconst 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 */\nconst getFocusableItems = (filteredData, props, isSearching) => {\n  const {\n    disabledItemValues,\n    valueKey,\n    childrenKey,\n    expandItemValues\n  } = props;\n  const items = [];\n  const loop = nodes => {\n    nodes.forEach(node => {\n      const disabled = disabledItemValues.some(disabledItem => (0, _utils.shallowEqual)(disabledItem, node[valueKey]));\n      if (!disabled && node.visible) {\n        items.push(node);\n      }\n      // always expand when searching\n      const 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;\nconst getActiveIndex = (focusItemValue, focusItems, valueKey) => {\n  let activeIndex = -1;\n  focusItems.forEach((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 */\nconst getActiveItem = (focusItemValue, flattenedNodes, valueKey) => {\n  let nodeData = null;\n  const activeNode = Object.values(flattenedNodes).find(node => (0, _utils.shallowEqual)(node[valueKey], focusItemValue));\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;\nconst focusTreeNode = (refKey, treeNodeRefs) => {\n  var _treeItem$focus;\n  const treeItem = treeNodeRefs[refKey];\n  treeItem === null || treeItem === void 0 || (_treeItem$focus = treeItem.focus) === null || _treeItem$focus === void 0 || _treeItem$focus.call(treeItem);\n};\nexports.focusTreeNode = focusTreeNode;\n/**\n * Focuses on the next item in a tree.\n */\nconst focusNextItem = props => {\n  const {\n    focusItemValue,\n    focusableItems,\n    treeNodesRefs,\n    valueKey\n  } = props;\n  const activeIndex = getActiveIndex(focusItemValue, focusableItems, valueKey);\n  if (focusableItems.length === 0) {\n    return;\n  }\n  const nextIndex = activeIndex === focusableItems.length - 1 ? 0 : activeIndex + 1;\n  const 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;\nconst focusPreviousItem = props => {\n  const {\n    focusItemValue,\n    focusableItems,\n    treeNodesRefs,\n    valueKey\n  } = props;\n  const activeIndex = getActiveIndex(focusItemValue, focusableItems, valueKey);\n  if (focusableItems.length === 0) {\n    return;\n  }\n  let prevIndex = activeIndex === 0 ? focusableItems.length - 1 : activeIndex - 1;\n  prevIndex = prevIndex >= 0 ? prevIndex : 0;\n  const 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;\nconst getScrollToIndex = (nodes, value, valueKey) => {\n  return nodes.filter(n => n.visible).findIndex(item => item[valueKey] === value);\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  const {\n    list,\n    value,\n    valueKey,\n    virtualized,\n    formattedNodes\n  } = props;\n  if (virtualized && value) {\n    var _list$scrollToItem;\n    const scrollIndex = getScrollToIndex(formattedNodes, value, valueKey);\n    list === null || list === void 0 || (_list$scrollToItem = list.scrollToItem) === null || _list$scrollToItem === void 0 || _list$scrollToItem.call(list, scrollIndex);\n  }\n}\nconst focusCurrentItem = props => {\n  const {\n    selector = SELECTED_TREEITEM_SELECTOR,\n    container\n  } = props;\n  const 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 || (_activeItem$focus = activeItem.focus) === null || _activeItem$focus === 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?");
+eval("\n\nexports.__esModule = true;\nexports.getFocusableItems = exports.getActiveItem = exports.focusTreeNode = exports.focusPreviousItem = exports.focusNextItem = exports.focusLastItem = exports.focusFirstItem = exports.focusCurrentItem = void 0;\nexports.scrollToActiveTreeNode = scrollToActiveTreeNode;\nvar _utils = __webpack_require__(/*! ../../internals/utils */ \"./src/internals/utils/index.ts\");\n// Active tree node selector\nconst 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 */\nconst getFocusableItems = (filteredData, props, isSearching) => {\n  const {\n    disabledItemValues,\n    valueKey,\n    childrenKey,\n    expandItemValues\n  } = props;\n  const items = [];\n  const loop = nodes => {\n    nodes.forEach(node => {\n      const disabled = disabledItemValues.some(disabledItem => (0, _utils.shallowEqual)(disabledItem, node[valueKey]));\n      if (!disabled && node.visible) {\n        items.push(node);\n      }\n      // always expand when searching\n      const 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;\nconst getActiveIndex = (focusItemValue, focusItems, valueKey) => {\n  let activeIndex = -1;\n  focusItems.forEach((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 */\nconst getActiveItem = (focusItemValue, flattenedNodes, valueKey) => {\n  let nodeData = null;\n  const activeNode = Object.values(flattenedNodes).find(node => (0, _utils.shallowEqual)(node[valueKey], focusItemValue));\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;\nconst focusTreeNode = (refKey, treeNodeRefs) => {\n  var _treeItem$focus;\n  const treeItem = treeNodeRefs[refKey];\n  treeItem === null || treeItem === void 0 || (_treeItem$focus = treeItem.focus) === null || _treeItem$focus === void 0 || _treeItem$focus.call(treeItem);\n};\nexports.focusTreeNode = focusTreeNode;\n/**\n * Focuses on the next item in a tree.\n */\nconst focusNextItem = props => {\n  const {\n    focusItemValue,\n    focusableItems,\n    treeNodesRefs,\n    valueKey\n  } = props;\n  const activeIndex = getActiveIndex(focusItemValue, focusableItems, valueKey);\n  if (focusableItems.length === 0) {\n    return;\n  }\n  const nextIndex = activeIndex === focusableItems.length - 1 ? 0 : activeIndex + 1;\n  const 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;\nconst focusPreviousItem = props => {\n  const {\n    focusItemValue,\n    focusableItems,\n    treeNodesRefs,\n    valueKey\n  } = props;\n  const activeIndex = getActiveIndex(focusItemValue, focusableItems, valueKey);\n  if (focusableItems.length === 0) {\n    return;\n  }\n  let prevIndex = activeIndex === 0 ? focusableItems.length - 1 : activeIndex - 1;\n  prevIndex = prevIndex >= 0 ? prevIndex : 0;\n  const value = focusableItems[prevIndex][valueKey];\n  focusTreeNode(focusableItems[prevIndex].refKey, treeNodesRefs);\n  return value;\n};\n\n/**\n * Focuses on the first item in a tree.\n */\nexports.focusPreviousItem = focusPreviousItem;\nconst focusFirstItem = props => {\n  const {\n    focusableItems,\n    treeNodesRefs,\n    valueKey\n  } = props;\n  if (focusableItems.length === 0) {\n    return;\n  }\n  const firstItem = focusableItems[0];\n  const value = firstItem[valueKey];\n  focusTreeNode(firstItem.refKey, treeNodesRefs);\n  return value;\n};\n\n/**\n * Focuses on the last item in a tree.\n */\nexports.focusFirstItem = focusFirstItem;\nconst focusLastItem = props => {\n  const {\n    focusableItems,\n    treeNodesRefs,\n    valueKey\n  } = props;\n  if (focusableItems.length === 0) {\n    return;\n  }\n  const lastItem = focusableItems[focusableItems.length - 1];\n  const value = lastItem[valueKey];\n  focusTreeNode(lastItem.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.focusLastItem = focusLastItem;\nconst getScrollToIndex = (nodes, value, valueKey) => {\n  return nodes.filter(n => n.visible).findIndex(item => item[valueKey] === value);\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  const {\n    list,\n    value,\n    valueKey,\n    virtualized,\n    formattedNodes\n  } = props;\n  if (virtualized && value) {\n    var _list$scrollToItem;\n    const scrollIndex = getScrollToIndex(formattedNodes, value, valueKey);\n    list === null || list === void 0 || (_list$scrollToItem = list.scrollToItem) === null || _list$scrollToItem === void 0 || _list$scrollToItem.call(list, scrollIndex);\n  }\n}\nconst focusCurrentItem = props => {\n  const {\n    selector = SELECTED_TREEITEM_SELECTOR,\n    container\n  } = props;\n  const 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 || (_activeItem$focus = activeItem.focus) === null || _activeItem$focus === 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?");
 
 /***/ }),
 
@@ -6318,7 +6329,7 @@ eval("\n\nexports.__esModule = true;\nexports.indentTreeNode = indentTreeNode;\n
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nexports.__esModule = true;\nexports.isSearching = exports.isExpand = exports.indentTreeNode = exports.hasVisibleChildren = exports.handleRightArrow = exports.handleLeftArrow = exports.getTreeActiveNode = exports.getNodeParentKeys = exports.getFocusableItems = exports.getExpandItemValues = exports.getActiveItem = exports.formatNodeRefKey = exports.focusTreeNode = exports.focusPreviousItem = exports.focusNextItem = exports.focusCurrentItem = exports.flattenTree = exports.WalkTreeStrategy = exports.UNSAFE_flattenTree = 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?");
+eval("\n\nexports.__esModule = true;\nexports.isSearching = exports.isExpand = exports.indentTreeNode = exports.hasVisibleChildren = exports.handleRightArrow = exports.handleLeftArrow = exports.getTreeActiveNode = exports.getNodeParentKeys = exports.getFocusableItems = exports.getExpandItemValues = exports.getActiveItem = exports.formatNodeRefKey = exports.focusTreeNode = exports.focusPreviousItem = exports.focusNextItem = exports.focusLastItem = exports.focusFirstItem = exports.focusCurrentItem = exports.flattenTree = exports.WalkTreeStrategy = exports.UNSAFE_flattenTree = 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.focusFirstItem = _focusableTree.focusFirstItem;\nexports.focusLastItem = _focusableTree.focusLastItem;\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?");
 
 /***/ }),
 
@@ -6362,7 +6373,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 _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\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 _useTreeWithChildren = _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 _useFocusState = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFocusState */ \"./src/TreePicker/hooks/useFocusState.ts\"));\nvar _useExpandTree = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useExpandTree */ \"./src/Tree/hooks/useExpandTree.ts\"));\nvar _TreeView = _interopRequireDefault(__webpack_require__(/*! ../Tree/TreeView */ \"./src/Tree/TreeView.tsx\"));\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/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 _utils3 = __webpack_require__(/*! ../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../internals/Tree/TreeProvider */ \"./src/internals/Tree/TreeProvider.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/TreePicker/TreePicker.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\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 */\nconst TreePicker = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('TreePicker', props);\n  const {\n    as,\n    appearance = 'default',\n    classPrefix = 'picker',\n    cleanable = true,\n    childrenKey = 'children',\n    data = [],\n    disabled,\n    defaultValue,\n    defaultExpandAll = false,\n    disabledItemValues = [],\n    defaultExpandItemValues = [],\n    expandItemValues: controlledExpandItemValues,\n    id,\n    block,\n    className,\n    locale,\n    labelKey = 'label',\n    onlyLeafSelectable,\n    placeholder,\n    placement = 'bottomStart',\n    style,\n    searchKeyword,\n    searchable = true,\n    showIndentLine,\n    popupClassName,\n    popupStyle,\n    popupAutoWidth = true,\n    treeHeight = 320,\n    valueKey = 'value',\n    virtualized = false,\n    value: controlledValue,\n    listProps,\n    toggleAs,\n    searchBy,\n    getChildren,\n    onClean,\n    onSearch,\n    onSelect,\n    onSelectItem,\n    onChange,\n    onExpand,\n    onEnter,\n    onExit,\n    onEntered,\n    renderValue,\n    renderTree,\n    renderTreeIcon,\n    renderTreeNode,\n    renderExtraFooter,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    trigger,\n    root,\n    target,\n    overlay,\n    list,\n    searchInput,\n    treeView\n  } = (0, _Picker.usePickerRef)(ref);\n  const [value, setValue] = (0, _hooks.useControlled)(controlledValue, defaultValue);\n  const itemDataKeys = {\n    childrenKey,\n    labelKey,\n    valueKey\n  };\n  const {\n    treeData,\n    loadingNodeValues,\n    appendChild\n  } = (0, _useTreeWithChildren.default)(data, itemDataKeys);\n  const flattenedNodes = (0, _useFlattenTree.default)(treeData, {\n    ...itemDataKeys\n  });\n  const {\n    expandItemValues,\n    handleExpandTreeNode\n  } = (0, _useExpandTree.default)(data, {\n    ...itemDataKeys,\n    defaultExpandAll,\n    defaultExpandItemValues,\n    controlledExpandItemValues,\n    onExpand,\n    getChildren,\n    appendChild\n  });\n  const {\n    prefix,\n    merge\n  } = (0, _hooks.useStyles)(classPrefix);\n  const activeNode = (0, _utils2.getTreeActiveNode)(flattenedNodes, value, valueKey);\n  const {\n    register,\n    focusFirstNode,\n    focusActiveNode\n  } = (0, _TreeProvider.useTreeImperativeHandle)();\n  const {\n    active,\n    focusItemValue,\n    setFocusItemValue,\n    triggerProps\n  } = (0, _useFocusState.default)({\n    focusActiveNode,\n    target,\n    value,\n    onEnter,\n    onExit,\n    onEntered\n  });\n  const handleSelect = (0, _hooks.useEventCallback)((treeNode, value, event) => {\n    var _target$current, _trigger$current, _trigger$current$clos;\n    onSelect === null || onSelect === void 0 || onSelect(treeNode, value, event);\n\n    // Only leaf nodes can update the value and close the picker.\n    if (onlyLeafSelectable && !(0, _utils3.isLeafNode)(treeNode)) {\n      return;\n    }\n    setFocusItemValue(value);\n    handleChange(value, event);\n    (_target$current = target.current) === null || _target$current === void 0 || _target$current.focus();\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 || (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 || _trigger$current$clos.call(_trigger$current);\n  });\n  const handleClean = (0, _hooks.useEventCallback)(event => {\n    const 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 || onChange(null, event);\n  });\n  const handleTreePressEnter = (0, _hooks.useEventCallback)(event => {\n    if ((0, _isNil.default)(focusItemValue)) {\n      return;\n    }\n    const activeItem = (0, _utils2.getActiveItem)(focusItemValue, flattenedNodes, valueKey);\n    handleSelect(activeItem, focusItemValue, event);\n  });\n  const handleTreeKeyDown = (0, _hooks.useEventCallback)(event => {\n    (0, _Picker.onMenuKeyDown)(event, {\n      del: handleClean,\n      down: () => focusFirstNode(),\n      enter: handleTreePressEnter\n    });\n  });\n  const onPickerKeydown = (0, _Picker.useToggleKeyDownEvent)({\n    toggle: !activeNode || !active,\n    trigger,\n    target,\n    overlay,\n    searchInput,\n    active,\n    onExit: handleClean,\n    onMenuKeyDown: handleTreeKeyDown,\n    ...rest\n  });\n  const handleChange = (0, _hooks.useEventCallback)((nextValue, event) => {\n    setValue(nextValue);\n    onChange === null || onChange === void 0 || onChange(nextValue, event);\n  });\n  const treeContext = (0, _react.useMemo)(() => ({\n    register,\n    props: {\n      labelKey,\n      valueKey,\n      childrenKey,\n      virtualized,\n      renderTreeIcon,\n      renderTreeNode\n    }\n  }), [childrenKey, labelKey, valueKey, virtualized, register, renderTreeIcon, renderTreeNode]);\n  const tree = /*#__PURE__*/_react.default.createElement(_TreeProvider.TreeProvider, {\n    value: treeContext,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 229,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(_TreeView.default, {\n    ref: treeView,\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    searchInputRef: searchInput,\n    loadingNodeValues: loadingNodeValues,\n    flattenedNodes: flattenedNodes,\n    listProps: listProps,\n    listRef: list,\n    locale: locale,\n    height: treeHeight,\n    onExpand: handleExpandTreeNode,\n    onSearch: onSearch,\n    onSelect: handleSelect,\n    onSelectItem: onSelectItem,\n    onFocusItem: setFocusItemValue,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 230,\n      columnNumber: 7\n    }\n  }));\n  const renderTreeView = (positionProps, speakerRef) => {\n    const {\n      className\n    } = positionProps;\n    const classes = merge(className, popupClassName, prefix('tree-menu'));\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      autoWidth: popupAutoWidth,\n      className: classes,\n      style: popupStyle,\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      onKeyDown: onPickerKeydown,\n      target: trigger,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 261,\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  let hasValidValue = !(0, _isNil.default)(activeNode) || !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue);\n  let selectedElement = placeholder;\n  if (hasValidValue) {\n    const node = activeNode !== null && activeNode !== void 0 ? activeNode : {};\n    selectedElement = node[labelKey];\n    if ((0, _isFunction.default)(renderValue) && value) {\n      selectedElement = renderValue(value, node, selectedElement);\n      if ((0, _isNil.default)(selectedElement)) {\n        hasValidValue = false;\n      }\n    }\n  }\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    as: as,\n    id: id,\n    name: \"tree\",\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    popupType: \"tree\",\n    triggerProps: {\n      ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n      ...triggerProps\n    },\n    ref: trigger,\n    placement: placement,\n    speaker: renderTreeView,\n    rootRef: root,\n    style: style,\n    classPrefix: classPrefix,\n    className: className,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 294,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({\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  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 314,\n      columnNumber: 7\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder)));\n});\nTreePicker.displayName = 'TreePicker';\nvar _default = exports[\"default\"] = TreePicker;\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\");\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 _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 _useTreeWithChildren = _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 _useFocusState = _interopRequireDefault(__webpack_require__(/*! ./hooks/useFocusState */ \"./src/TreePicker/hooks/useFocusState.ts\"));\nvar _useExpandTree = _interopRequireDefault(__webpack_require__(/*! ../Tree/hooks/useExpandTree */ \"./src/Tree/hooks/useExpandTree.ts\"));\nvar _TreeView = _interopRequireDefault(__webpack_require__(/*! ../Tree/TreeView */ \"./src/Tree/TreeView.tsx\"));\nvar _hooks = __webpack_require__(/*! ../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../internals/utils */ \"./src/internals/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 _utils3 = __webpack_require__(/*! ../internals/Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _TreeProvider = __webpack_require__(/*! ../internals/Tree/TreeProvider */ \"./src/internals/Tree/TreeProvider.tsx\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/TreePicker/TreePicker.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\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 */\nconst TreePicker = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    propsWithDefaults\n  } = (0, _hooks.useCustom)('TreePicker', props);\n  const {\n    as,\n    appearance = 'default',\n    classPrefix = 'picker',\n    cleanable = true,\n    childrenKey = 'children',\n    data = [],\n    disabled,\n    defaultValue,\n    defaultExpandAll = false,\n    disabledItemValues = [],\n    defaultExpandItemValues = [],\n    expandItemValues: controlledExpandItemValues,\n    id,\n    block,\n    className,\n    locale,\n    labelKey = 'label',\n    onlyLeafSelectable,\n    placeholder,\n    placement = 'bottomStart',\n    style,\n    searchKeyword,\n    searchable = true,\n    showIndentLine,\n    popupClassName,\n    popupStyle,\n    popupAutoWidth = true,\n    treeHeight = 320,\n    valueKey = 'value',\n    virtualized = false,\n    value: controlledValue,\n    listProps,\n    toggleAs,\n    searchBy,\n    getChildren,\n    onClean,\n    onSearch,\n    onSelect,\n    onSelectItem,\n    onChange,\n    onExpand,\n    onEnter,\n    onExit,\n    onEntered,\n    renderValue,\n    renderTree,\n    renderTreeIcon,\n    renderTreeNode,\n    renderExtraFooter,\n    ...rest\n  } = propsWithDefaults;\n  const {\n    trigger,\n    root,\n    target,\n    overlay,\n    list,\n    searchInput,\n    treeView\n  } = (0, _Picker.usePickerRef)(ref);\n  const [value, setValue] = (0, _hooks.useControlled)(controlledValue, defaultValue);\n  const itemDataKeys = {\n    childrenKey,\n    labelKey,\n    valueKey\n  };\n  const {\n    treeData,\n    loadingNodeValues,\n    appendChild\n  } = (0, _useTreeWithChildren.default)(data, itemDataKeys);\n  const flattenedNodes = (0, _useFlattenTree.default)(treeData, {\n    ...itemDataKeys\n  });\n  const {\n    expandItemValues,\n    handleExpandTreeNode\n  } = (0, _useExpandTree.default)(data, {\n    ...itemDataKeys,\n    defaultExpandAll,\n    defaultExpandItemValues,\n    controlledExpandItemValues,\n    onExpand,\n    getChildren,\n    appendChild\n  });\n  const {\n    prefix,\n    merge\n  } = (0, _hooks.useStyles)(classPrefix);\n  const activeNode = (0, _utils2.getTreeActiveNode)(flattenedNodes, value, valueKey);\n  const {\n    register,\n    focusFirstNode,\n    focusActiveNode\n  } = (0, _TreeProvider.useTreeImperativeHandle)();\n  const {\n    active,\n    focusItemValue,\n    setFocusItemValue,\n    triggerProps\n  } = (0, _useFocusState.default)({\n    focusActiveNode,\n    target,\n    value,\n    onEnter,\n    onExit,\n    onEntered\n  });\n  const handleSelect = (0, _hooks.useEventCallback)((treeNode, value, event) => {\n    var _target$current, _trigger$current, _trigger$current$clos;\n    onSelect === null || onSelect === void 0 || onSelect(treeNode, value, event);\n\n    // Only leaf nodes can update the value and close the picker.\n    if (onlyLeafSelectable && !(0, _utils3.isLeafNode)(treeNode)) {\n      return;\n    }\n    setFocusItemValue(value);\n    handleChange(value, event);\n    (_target$current = target.current) === null || _target$current === void 0 || _target$current.focus();\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 || (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 || _trigger$current$clos.call(_trigger$current);\n  });\n  const handleClean = (0, _hooks.useEventCallback)(event => {\n    const 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 || onChange(null, event);\n  });\n  const handleTreePressEnter = (0, _hooks.useEventCallback)(event => {\n    if ((0, _isNil.default)(focusItemValue)) {\n      return;\n    }\n    const activeItem = (0, _utils2.getActiveItem)(focusItemValue, flattenedNodes, valueKey);\n    handleSelect(activeItem, focusItemValue, event);\n  });\n  const handleTreeKeyDown = (0, _hooks.useEventCallback)(event => {\n    (0, _Picker.onMenuKeyDown)(event, {\n      del: handleClean,\n      down: () => focusFirstNode(),\n      enter: handleTreePressEnter\n    });\n  });\n  const onPickerKeydown = (0, _Picker.useToggleKeyDownEvent)({\n    toggle: !activeNode || !active,\n    trigger,\n    target,\n    overlay,\n    searchInput,\n    active,\n    onExit: handleClean,\n    onMenuKeyDown: handleTreeKeyDown,\n    ...rest\n  });\n  const handleChange = (0, _hooks.useEventCallback)((nextValue, event) => {\n    setValue(nextValue);\n    onChange === null || onChange === void 0 || onChange(nextValue, event);\n  });\n  const treeContext = (0, _react.useMemo)(() => ({\n    register,\n    props: {\n      labelKey,\n      valueKey,\n      childrenKey,\n      virtualized,\n      renderTreeIcon,\n      renderTreeNode\n    }\n  }), [childrenKey, labelKey, valueKey, virtualized, register, renderTreeIcon, renderTreeNode]);\n  const tree = /*#__PURE__*/_react.default.createElement(_TreeProvider.TreeProvider, {\n    value: treeContext,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 229,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(_TreeView.default, {\n    ref: treeView,\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    searchInputRef: searchInput,\n    loadingNodeValues: loadingNodeValues,\n    flattenedNodes: flattenedNodes,\n    listProps: listProps,\n    listRef: list,\n    locale: locale,\n    height: treeHeight,\n    onExpand: handleExpandTreeNode,\n    onSearch: onSearch,\n    onSelect: handleSelect,\n    onSelectItem: onSelectItem,\n    onFocusItem: setFocusItemValue,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 230,\n      columnNumber: 7\n    }\n  }));\n  const renderTreeView = (positionProps, speakerRef) => {\n    const {\n      className\n    } = positionProps;\n    const classes = merge(className, popupClassName, prefix('tree-menu'));\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      autoWidth: popupAutoWidth,\n      className: classes,\n      style: popupStyle,\n      ref: (0, _utils.mergeRefs)(overlay, speakerRef),\n      onKeyDown: onPickerKeydown,\n      target: trigger,\n      __self: void 0,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 261,\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  let hasValidValue = !(0, _isNil.default)(activeNode) || !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue);\n  let selectedElement = placeholder;\n  if (hasValidValue) {\n    const node = activeNode !== null && activeNode !== void 0 ? activeNode : {};\n    selectedElement = node[labelKey];\n    if ((0, _isFunction.default)(renderValue) && value) {\n      selectedElement = renderValue(value, node, selectedElement);\n      if ((0, _isNil.default)(selectedElement)) {\n        hasValidValue = false;\n      }\n    }\n  }\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    as: as,\n    id: id,\n    pickerType: \"tree\",\n    block: block,\n    disabled: disabled,\n    appearance: appearance,\n    popupType: \"tree\",\n    triggerProps: {\n      ...(0, _pick.default)(props, _Picker.triggerPropKeys),\n      ...triggerProps\n    },\n    ref: trigger,\n    placement: placement,\n    speaker: renderTreeView,\n    rootRef: root,\n    style: style,\n    classPrefix: classPrefix,\n    className: className,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 294,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({\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  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 314,\n      columnNumber: 7\n    }\n  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder)));\n});\nTreePicker.displayName = 'TreePicker';\nvar _default = exports[\"default\"] = TreePicker;\n\n//# sourceURL=webpack://rsuite/./src/TreePicker/TreePicker.tsx?");
 
 /***/ }),
 
@@ -6923,7 +6934,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.triggerPropKeys = exports.pickerCommonPropKeys = exports.overlayPropKeys = exports[\"default\"] = exports.PickerToggleTrigger = exports.ComboboxContext = 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 _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _Box = _interopRequireDefault(__webpack_require__(/*! ../Box */ \"./src/internals/Box/index.tsx\"));\nvar _PickerDrawer = _interopRequireDefault(__webpack_require__(/*! ./PickerDrawer */ \"./src/internals/Picker/PickerDrawer.tsx\"));\nvar _OverlayTrigger = _interopRequireDefault(__webpack_require__(/*! ../Overlay/OverlayTrigger */ \"./src/internals/Overlay/OverlayTrigger.tsx\"));\nvar _hooks = __webpack_require__(/*! ../hooks */ \"./src/internals/hooks/index.ts\");\nvar _useBreakpointValue = __webpack_require__(/*! ../../useBreakpointValue */ \"./src/useBreakpointValue/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/internals/Picker/PickerToggleTrigger.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\nconst overlayPropKeys = exports.overlayPropKeys = ['onEntered', 'onExited', 'onEnter', 'onEntering', 'onExit', 'onExiting', 'open', 'onOpen', 'defaultOpen', 'onClose', 'container', 'containerPadding', 'preventOverflow'];\nconst pickerCommonPropKeys = exports.pickerCommonPropKeys = ['disabled', 'plaintext', 'readOnly', 'loading', 'label'];\nconst triggerPropKeys = exports.triggerPropKeys = [...overlayPropKeys, ...pickerCommonPropKeys];\nconst ComboboxContext = exports.ComboboxContext = /*#__PURE__*/_react.default.createContext({\n  popupType: 'listbox'\n});\nconst PickerToggleTrigger = exports.PickerToggleTrigger = /*#__PURE__*/_react.default.forwardRef((props, ref) => {\n  const {\n    appearance,\n    as,\n    block,\n    children,\n    className,\n    classPrefix = 'picker',\n    disabled,\n    id,\n    multiple,\n    name,\n    triggerProps,\n    placement,\n    popupType = 'listbox',\n    rootRef,\n    speaker,\n    style,\n    size,\n    trigger = 'click',\n    responsive = true,\n    onKeyDown,\n    onClick,\n    ...rest\n  } = props;\n  const pickerTriggerProps = (0, _pick.default)(triggerProps, triggerPropKeys);\n  const pickerId = (0, _hooks.useUniqueId)('rs-', id);\n  const breakpoint = (0, _useBreakpointValue.useBreakpointValue)({\n    xsOnly: 'xs'\n  }, {\n    enabled: responsive\n  });\n  // Only use the breakpoint value if not disabled\n  const effectiveBreakpoint = disabled ? undefined : breakpoint;\n  const comboboxContext = (0, _react.useMemo)(() => ({\n    id: pickerId,\n    hasLabel: typeof pickerTriggerProps.label !== 'undefined',\n    multiple,\n    placement,\n    breakpoint: effectiveBreakpoint,\n    popupType\n  }), [pickerId, multiple, placement, effectiveBreakpoint, popupType]);\n  const {\n    withPrefix,\n    merge\n  } = (0, _hooks.useStyles)(classPrefix);\n  const classes = merge(className, withPrefix());\n  return /*#__PURE__*/_react.default.createElement(ComboboxContext.Provider, {\n    value: comboboxContext,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 152,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_OverlayTrigger.default, (0, _extends2.default)({}, pickerTriggerProps, {\n    disabled: pickerTriggerProps.disabled || pickerTriggerProps.loading,\n    ref: ref,\n    trigger: trigger,\n    placement: placement,\n    speaker: speaker,\n    overlayAs: effectiveBreakpoint === 'xs' ? _PickerDrawer.default : undefined,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 153,\n      columnNumber: 9\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({\n    as: as,\n    className: classes,\n    style: style,\n    ref: rootRef,\n    \"data-picker\": name,\n    \"data-appearance\": appearance,\n    \"data-size\": size,\n    \"data-disabled\": disabled || undefined,\n    \"data-block\": block || undefined,\n    \"data-testid\": \"picker\",\n    onKeyDown: onKeyDown,\n    onClick: onClick\n  }, (0, _omit.default)(rest, [...triggerPropKeys]), {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 162,\n      columnNumber: 11\n    }\n  }), children)));\n});\nPickerToggleTrigger.displayName = 'PickerToggleTrigger';\nvar _default = exports[\"default\"] = PickerToggleTrigger;\n\n//# sourceURL=webpack://rsuite/./src/internals/Picker/PickerToggleTrigger.tsx?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports.triggerPropKeys = exports.pickerCommonPropKeys = exports.overlayPropKeys = exports[\"default\"] = exports.PickerToggleTrigger = exports.ComboboxContext = 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 _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _Box = _interopRequireDefault(__webpack_require__(/*! ../Box */ \"./src/internals/Box/index.tsx\"));\nvar _PickerDrawer = _interopRequireDefault(__webpack_require__(/*! ./PickerDrawer */ \"./src/internals/Picker/PickerDrawer.tsx\"));\nvar _OverlayTrigger = _interopRequireDefault(__webpack_require__(/*! ../Overlay/OverlayTrigger */ \"./src/internals/Overlay/OverlayTrigger.tsx\"));\nvar _hooks = __webpack_require__(/*! ../hooks */ \"./src/internals/hooks/index.ts\");\nvar _useBreakpointValue = __webpack_require__(/*! ../../useBreakpointValue */ \"./src/useBreakpointValue/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/internals/Picker/PickerToggleTrigger.tsx\";\nfunction _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\nconst overlayPropKeys = exports.overlayPropKeys = ['onEntered', 'onExited', 'onEnter', 'onEntering', 'onExit', 'onExiting', 'open', 'onOpen', 'defaultOpen', 'onClose', 'container', 'containerPadding', 'preventOverflow'];\nconst pickerCommonPropKeys = exports.pickerCommonPropKeys = ['disabled', 'plaintext', 'readOnly', 'loading', 'label'];\nconst triggerPropKeys = exports.triggerPropKeys = [...overlayPropKeys, ...pickerCommonPropKeys];\nconst ComboboxContext = exports.ComboboxContext = /*#__PURE__*/_react.default.createContext({\n  popupType: 'listbox'\n});\nconst PickerToggleTrigger = exports.PickerToggleTrigger = /*#__PURE__*/_react.default.forwardRef((props, ref) => {\n  const {\n    appearance,\n    as,\n    block,\n    children,\n    className,\n    classPrefix = 'picker',\n    disabled,\n    id,\n    multiple,\n    name,\n    pickerType,\n    triggerProps,\n    placement,\n    popupType = 'listbox',\n    rootRef,\n    speaker,\n    style,\n    size,\n    trigger = 'click',\n    responsive = true,\n    onKeyDown,\n    onClick,\n    ...rest\n  } = props;\n  const pickerTriggerProps = (0, _pick.default)(triggerProps, triggerPropKeys);\n  const pickerId = (0, _hooks.useUniqueId)('rs-', id);\n  const breakpoint = (0, _useBreakpointValue.useBreakpointValue)({\n    xsOnly: 'xs'\n  }, {\n    enabled: responsive\n  });\n  // Only use the breakpoint value if not disabled\n  const effectiveBreakpoint = disabled ? undefined : breakpoint;\n  const comboboxContext = (0, _react.useMemo)(() => ({\n    id: pickerId,\n    hasLabel: typeof pickerTriggerProps.label !== 'undefined',\n    multiple,\n    placement,\n    breakpoint: effectiveBreakpoint,\n    popupType\n  }), [pickerId, multiple, placement, effectiveBreakpoint, popupType]);\n  const {\n    withPrefix,\n    merge\n  } = (0, _hooks.useStyles)(classPrefix);\n  const classes = merge(className, withPrefix());\n  return /*#__PURE__*/_react.default.createElement(ComboboxContext.Provider, {\n    value: comboboxContext,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 155,\n      columnNumber: 7\n    }\n  }, /*#__PURE__*/_react.default.createElement(_OverlayTrigger.default, (0, _extends2.default)({}, pickerTriggerProps, {\n    disabled: pickerTriggerProps.disabled || pickerTriggerProps.loading,\n    ref: ref,\n    trigger: trigger,\n    placement: placement,\n    speaker: speaker,\n    overlayAs: effectiveBreakpoint === 'xs' ? _PickerDrawer.default : undefined,\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 156,\n      columnNumber: 9\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({\n    as: as,\n    className: classes,\n    style: style,\n    ref: rootRef,\n    name: name,\n    \"data-picker\": pickerType,\n    \"data-appearance\": appearance,\n    \"data-size\": size,\n    \"data-disabled\": disabled || undefined,\n    \"data-block\": block || undefined,\n    \"data-testid\": \"picker\",\n    onKeyDown: onKeyDown,\n    onClick: onClick\n  }, (0, _omit.default)(rest, [...triggerPropKeys]), {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 165,\n      columnNumber: 11\n    }\n  }), children)));\n});\nPickerToggleTrigger.displayName = 'PickerToggleTrigger';\nvar _default = exports[\"default\"] = PickerToggleTrigger;\n\n//# sourceURL=webpack://rsuite/./src/internals/Picker/PickerToggleTrigger.tsx?");
 
 /***/ }),
 
@@ -7033,7 +7044,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.onMenuKeyDown = onMenuKeyDown;\nexports.shouldDisplay = shouldDisplay;\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _trim = _interopRequireDefault(__webpack_require__(/*! lodash/trim */ \"./node_modules/lodash/trim.js\"));\nvar _constants = __webpack_require__(/*! ../constants */ \"./src/internals/constants/index.ts\");\nvar _utils = __webpack_require__(/*! ../Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/internals/utils/index.ts\");\nconst defaultNodeKeys = {\n  valueKey: 'value',\n  childrenKey: 'children'\n};\nfunction createConcatChildrenFunction(node, nodeValue, nodeKeys = defaultNodeKeys) {\n  const {\n    valueKey,\n    childrenKey\n  } = nodeKeys;\n  return (data, children) => {\n    if (nodeValue) {\n      node = (0, _utils.findNodeOfTree)(data, item => nodeValue === item[valueKey]);\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  const 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    const 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  const {\n    down,\n    up,\n    enter,\n    del,\n    esc,\n    right,\n    left\n  } = events;\n  switch (event.key) {\n    // down\n    case _constants.KEY_VALUES.DOWN:\n      down === null || down === void 0 || down(event);\n      event.preventDefault();\n      break;\n    // up\n    case _constants.KEY_VALUES.UP:\n      up === null || up === void 0 || up(event);\n      event.preventDefault();\n      break;\n    // enter\n    case _constants.KEY_VALUES.ENTER:\n      enter === null || enter === void 0 || enter(event);\n      event.preventDefault();\n      break;\n    // delete\n    case _constants.KEY_VALUES.BACKSPACE:\n      del === null || del === void 0 || del(event);\n      break;\n    // esc | tab\n    case _constants.KEY_VALUES.ESC:\n    case _constants.KEY_VALUES.TAB:\n      esc === null || esc === void 0 || esc(event);\n      break;\n    // left arrow\n    case _constants.KEY_VALUES.LEFT:\n      left === null || left === void 0 || left(event);\n      break;\n    // right arrow\n    case _constants.KEY_VALUES.RIGHT:\n      right === null || right === 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.onMenuKeyDown = onMenuKeyDown;\nexports.shouldDisplay = shouldDisplay;\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _trim = _interopRequireDefault(__webpack_require__(/*! lodash/trim */ \"./node_modules/lodash/trim.js\"));\nvar _constants = __webpack_require__(/*! ../constants */ \"./src/internals/constants/index.ts\");\nvar _utils = __webpack_require__(/*! ../Tree/utils */ \"./src/internals/Tree/utils/index.ts\");\nvar _utils2 = __webpack_require__(/*! ../utils */ \"./src/internals/utils/index.ts\");\nconst defaultNodeKeys = {\n  valueKey: 'value',\n  childrenKey: 'children'\n};\nfunction createConcatChildrenFunction(node, nodeValue, nodeKeys = defaultNodeKeys) {\n  const {\n    valueKey,\n    childrenKey\n  } = nodeKeys;\n  return (data, children) => {\n    if (nodeValue) {\n      node = (0, _utils.findNodeOfTree)(data, item => nodeValue === item[valueKey]);\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  const 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    const 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  const {\n    down,\n    up,\n    enter,\n    del,\n    esc,\n    right,\n    left,\n    home,\n    end\n  } = events;\n  switch (event.key) {\n    // down\n    case _constants.KEY_VALUES.DOWN:\n      down === null || down === void 0 || down(event);\n      event.preventDefault();\n      break;\n    // up\n    case _constants.KEY_VALUES.UP:\n      up === null || up === void 0 || up(event);\n      event.preventDefault();\n      break;\n    // enter\n    case _constants.KEY_VALUES.ENTER:\n      enter === null || enter === void 0 || enter(event);\n      event.preventDefault();\n      break;\n    // delete\n    case _constants.KEY_VALUES.BACKSPACE:\n      del === null || del === void 0 || del(event);\n      break;\n    // esc | tab\n    case _constants.KEY_VALUES.ESC:\n    case _constants.KEY_VALUES.TAB:\n      esc === null || esc === void 0 || esc(event);\n      break;\n    // left arrow\n    case _constants.KEY_VALUES.LEFT:\n      left === null || left === void 0 || left(event);\n      break;\n    // right arrow\n    case _constants.KEY_VALUES.RIGHT:\n      right === null || right === void 0 || right(event);\n      break;\n    // home\n    case _constants.KEY_VALUES.HOME:\n      home === null || home === void 0 || home(event);\n      event.preventDefault();\n      break;\n    // end\n    case _constants.KEY_VALUES.END:\n      end === null || end === void 0 || end(event);\n      event.preventDefault();\n      break;\n    default:\n  }\n}\n\n//# sourceURL=webpack://rsuite/./src/internals/Picker/utils.ts?");
 
 /***/ }),
 
@@ -7176,7 +7187,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 _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = _interopRequireDefault(__webpack_require__(/*! react */ \"react\"));\nvar _Box = _interopRequireDefault(__webpack_require__(/*! ../Box */ \"./src/internals/Box/index.tsx\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/internals/utils/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/internals/StyledBox/StyledBox.tsx\";\nconst StyledBox = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    as,\n    color,\n    name,\n    style,\n    size,\n    ...rest\n  } = props;\n  const boxStyle = (0, _utils.mergeStyles)(style, (0, _utils.getSizeStyle)(size, name), (0, _utils.getColorStyle)(color, name));\n  return /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({\n    as: as,\n    ref: ref,\n    style: boxStyle\n  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 21,\n      columnNumber: 10\n    }\n  }));\n});\nStyledBox.displayName = 'StyledBox';\nvar _default = exports[\"default\"] = StyledBox;\n\n//# sourceURL=webpack://rsuite/./src/internals/StyledBox/StyledBox.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 _Box = _interopRequireDefault(__webpack_require__(/*! ../Box */ \"./src/internals/Box/index.tsx\"));\nvar _utils = __webpack_require__(/*! ../utils */ \"./src/internals/utils/index.ts\");\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/internals/StyledBox/StyledBox.tsx\";\nconst StyledBox = (0, _utils.forwardRef)((props, ref) => {\n  const {\n    as,\n    color,\n    name: componentName,\n    style,\n    size,\n    ...rest\n  } = props;\n  const boxStyle = (0, _utils.mergeStyles)(style, (0, _utils.getSizeStyle)(size, componentName), (0, _utils.getColorStyle)(color, componentName));\n  return /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({\n    as: as,\n    ref: ref,\n    style: boxStyle\n  }, rest, {\n    __self: void 0,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 25,\n      columnNumber: 10\n    }\n  }));\n});\nStyledBox.displayName = 'StyledBox';\nvar _default = exports[\"default\"] = StyledBox;\n\n//# sourceURL=webpack://rsuite/./src/internals/StyledBox/StyledBox.tsx?");
 
 /***/ }),