rsuite 5.70.3 → 5.71.0

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+# [5.71.0](https://github.com/rsuite/rsuite/compare/v5.70.3...v5.71.0) (2024-09-27)
+
+
+### Bug Fixes
+
+* **Form:** fix can't get form data in addRule callback ([#3980](https://github.com/rsuite/rsuite/issues/3980)) ([26417ef](https://github.com/rsuite/rsuite/commit/26417ef93c30249a95c0b548123f1adf31b9d6a1))
+
+
+### Features
+
+* **DateRangePicker:** add support for `hideHours`, `hideMinutes`, `hideSeconds` ([#3979](https://github.com/rsuite/rsuite/issues/3979)) ([1d48589](https://github.com/rsuite/rsuite/commit/1d48589df8b54e0ae0e6cbc62b5d53b58c61cf3c))
+
+
+
 ## [5.70.3](https://github.com/rsuite/rsuite/compare/v5.70.2...v5.70.3) (2024-09-20)
 
 

package/cjs/DatePicker/DatePicker.d.ts

@@ -101,15 +101,15 @@ export interface DatePickerProps extends PickerBaseProps<DatePickerLocale>, Form
      */
     shouldDisableSecond?: (second: number, date: Date) => boolean;
     /**
-     * Hidden hours on the time view
+     * Hide specific hour options
      */
     hideHours?: (hour: number, date: Date) => boolean;
     /**
-     * Hidden minutes on the time view
+     * Hide specific minute options
      */
     hideMinutes?: (minute: number, date: Date) => boolean;
     /**
-     * Hidden seconds on the time view
+     * Hide specific second options
      */
     hideSeconds?: (second: number, date: Date) => boolean;
     /**

package/cjs/DateRangePicker/DateRangePicker.d.ts

@@ -97,6 +97,18 @@ export interface DateRangePickerProps extends PickerBaseProps<DateRangePickerLoc
      * @version 5.69.0
      */
     calendarSnapping?: boolean;
+    /**
+     * Hide specific hour options
+     */
+    hideHours?: (hour: number, date: Date) => boolean;
+    /**
+     * Hide specific minute options
+     */
+    hideMinutes?: (minute: number, date: Date) => boolean;
+    /**
+     * Hide specific second options
+     */
+    hideSeconds?: (second: number, date: Date) => boolean;
     /**
      * Disabled date
      * @deprecated Use {@link shouldDisableDate} instead

package/cjs/DateRangePicker/DateRangePicker.js

@@ -32,7 +32,7 @@ var _hooks = require("../internals/hooks");
 var _utils2 = require("../internals/utils");
 var _date = require("../internals/utils/date");
 var _templateObject, _templateObject2;
-var _excluded = ["as", "classPrefix", "className", "appearance", "editable", "cleanable", "character", "calendarSnapping", "defaultCalendarValue", "defaultValue", "plaintext", "disabled", "disabledDate", "shouldDisableDate", "format", "hoverRange", "id", "isoWeek", "weekStart", "limitEndYear", "limitStartYear", "locale", "loading", "label", "menuClassName", "menuStyle", "oneTap", "placeholder", "placement", "ranges", "readOnly", "showOneCalendar", "showWeekNumbers", "showMeridian", "showHeader", "style", "size", "caretAs", "value", "monthDropdownProps", "onChange", "onClean", "onEnter", "onExit", "onOk", "onSelect", "onShortcutClick", "renderTitle", "renderValue"];
+var _excluded = ["as", "classPrefix", "className", "appearance", "editable", "cleanable", "character", "calendarSnapping", "defaultCalendarValue", "defaultValue", "plaintext", "disabled", "disabledDate", "shouldDisableDate", "format", "hoverRange", "id", "isoWeek", "weekStart", "limitEndYear", "limitStartYear", "locale", "loading", "label", "menuClassName", "menuStyle", "oneTap", "placeholder", "placement", "ranges", "readOnly", "showOneCalendar", "showWeekNumbers", "showMeridian", "showHeader", "style", "size", "caretAs", "value", "monthDropdownProps", "hideHours", "hideMinutes", "hideSeconds", "onChange", "onClean", "onEnter", "onExit", "onOk", "onSelect", "onShortcutClick", "renderTitle", "renderValue"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /**
@@ -96,6 +96,9 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
     caretAsProp = props.caretAs,
     valueProp = props.value,
     monthDropdownProps = props.monthDropdownProps,
+    hideHours = props.hideHours,
+    hideMinutes = props.hideMinutes,
+    hideSeconds = props.hideSeconds,
     onChange = props.onChange,
     onClean = props.onClean,
     onEnter = props.onEnter,
@@ -631,6 +634,9 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
       value: selectedDates,
       monthDropdownProps: monthDropdownProps,
       hoverRangeValue: hoverDateRange !== null && hoverDateRange !== void 0 ? hoverDateRange : undefined,
+      hideHours: hideHours,
+      hideMinutes: hideMinutes,
+      hideSeconds: hideSeconds,
       disabledDate: disableCalendarDate,
       onSelect: handleSelectDate,
       onChangeCalendarMonth: onChangeCalendarMonth,
@@ -825,6 +831,9 @@ DateRangePicker.propTypes = (0, _extends2.default)({}, _Picker.pickerPropTypes,
   defaultCalendarValue: _propTypes.default.arrayOf(_propTypes.default.instanceOf(Date)),
   hoverRange: _propTypes.default.oneOfType([(0, _propTypes2.oneOf)(['week', 'month']), _propTypes.default.func]),
   format: _propTypes.default.string,
+  hideHours: _propTypes.default.func,
+  hideMinutes: _propTypes.default.func,
+  hideSeconds: _propTypes.default.func,
   isoWeek: _propTypes.default.bool,
   weekStart: _propTypes.default.oneOf([0, 1, 2, 3, 4, 5, 6]),
   oneTap: _propTypes.default.bool,

package/cjs/Form/hooks/useFormValidate.js

@@ -38,7 +38,8 @@ function useFormValidate(_formError, props) {
     var errorCount = 0;
     var model = getCombinedModel();
     var checkField = function checkField(key, type, value, formErrorObj) {
-      var checkResult = type.check(value);
+      model.setSchemaOptionsForAllType(formValue || {});
+      var checkResult = type.check(value, formValue, key);
       if (checkResult.hasError === true) {
         errorCount += 1;
         formErrorObj[key] = (checkResult === null || checkResult === void 0 ? void 0 : checkResult.errorMessage) || checkResult;

package/dist/rsuite.js

@@ -7132,7 +7132,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 _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _Calendar = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/Calendar */ \"./node_modules/@rsuite/icons/legacy/Calendar.js\"));\nvar _ClockO = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/ClockO */ \"./node_modules/@rsuite/icons/legacy/ClockO.js\"));\nvar _Toolbar = _interopRequireDefault(__webpack_require__(/*! ../DatePicker/Toolbar */ \"./src/DatePicker/Toolbar.tsx\"));\nvar _PredefinedRanges = _interopRequireDefault(__webpack_require__(/*! ../DatePicker/PredefinedRanges */ \"./src/DatePicker/PredefinedRanges.tsx\"));\nvar _Stack = _interopRequireDefault(__webpack_require__(/*! ../Stack */ \"./src/Stack/index.tsx\"));\nvar _DateRangePickerContext = _interopRequireDefault(__webpack_require__(/*! ./DateRangePickerContext */ \"./src/DateRangePicker/DateRangePickerContext.ts\"));\nvar _DateRangeInput = _interopRequireDefault(__webpack_require__(/*! ../DateRangeInput */ \"./src/DateRangeInput/index.tsx\"));\nvar _InputGroup = _interopRequireDefault(__webpack_require__(/*! ../InputGroup */ \"./src/InputGroup/index.tsx\"));\nvar _Header = _interopRequireDefault(__webpack_require__(/*! ./Header */ \"./src/DateRangePicker/Header.tsx\"));\nvar _useDateDisabled = _interopRequireDefault(__webpack_require__(/*! ./hooks/useDateDisabled */ \"./src/DateRangePicker/hooks/useDateDisabled.ts\"));\nvar _useCustomizedInput2 = _interopRequireDefault(__webpack_require__(/*! ../DatePicker/hooks/useCustomizedInput */ \"./src/DatePicker/hooks/useCustomizedInput.ts\"));\nvar _Calendar2 = _interopRequireDefault(__webpack_require__(/*! ./Calendar */ \"./src/DateRangePicker/Calendar.tsx\"));\nvar _utils = __webpack_require__(/*! ./utils */ \"./src/DateRangePicker/utils.ts\");\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _constants = __webpack_require__(/*! ../internals/constants */ \"./src/internals/constants/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/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 _date = __webpack_require__(/*! ../internals/utils/date */ \"./src/internals/utils/date/index.ts\");\nvar _excluded = [\"as\", \"classPrefix\", \"className\", \"appearance\", \"editable\", \"cleanable\", \"character\", \"calendarSnapping\", \"defaultCalendarValue\", \"defaultValue\", \"plaintext\", \"disabled\", \"disabledDate\", \"shouldDisableDate\", \"format\", \"hoverRange\", \"id\", \"isoWeek\", \"weekStart\", \"limitEndYear\", \"limitStartYear\", \"locale\", \"loading\", \"label\", \"menuClassName\", \"menuStyle\", \"oneTap\", \"placeholder\", \"placement\", \"ranges\", \"readOnly\", \"showOneCalendar\", \"showWeekNumbers\", \"showMeridian\", \"showHeader\", \"style\", \"size\", \"caretAs\", \"value\", \"monthDropdownProps\", \"onChange\", \"onClean\", \"onEnter\", \"onExit\", \"onOk\", \"onSelect\", \"onShortcutClick\", \"renderTitle\", \"renderValue\"];\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DateRangePicker/DateRangePicker.tsx\",\n  _this = void 0,\n  _templateObject,\n  _templateObject2;\nfunction _getRequireWildcardCache(e) { if (\"function\" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }\nfunction _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if (\"default\" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }\n/**\n * A date range picker allows you to select a date range from a calendar.\n *\n * @see https://rsuitejs.com/components/date-range-picker\n */\nvar DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _ref, _ref2, _merge;\n  var _props$as = props.as,\n    Component = _props$as === void 0 ? 'div' : _props$as,\n    _props$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n    className = props.className,\n    _props$appearance = props.appearance,\n    appearance = _props$appearance === void 0 ? 'default' : _props$appearance,\n    _props$editable = props.editable,\n    editable = _props$editable === void 0 ? true : _props$editable,\n    _props$cleanable = props.cleanable,\n    cleanable = _props$cleanable === void 0 ? true : _props$cleanable,\n    _props$character = props.character,\n    character = _props$character === void 0 ? ' ~ ' : _props$character,\n    calendarSnapping = props.calendarSnapping,\n    defaultCalendarValue = props.defaultCalendarValue,\n    defaultValue = props.defaultValue,\n    plaintext = props.plaintext,\n    disabled = props.disabled,\n    DEPRECATED_disabledDate = props.disabledDate,\n    shouldDisableDate = props.shouldDisableDate,\n    _props$format = props.format,\n    formatStr = _props$format === void 0 ? 'yyyy-MM-dd' : _props$format,\n    hoverRange = props.hoverRange,\n    idProp = props.id,\n    _props$isoWeek = props.isoWeek,\n    isoWeek = _props$isoWeek === void 0 ? false : _props$isoWeek,\n    _props$weekStart = props.weekStart,\n    weekStart = _props$weekStart === void 0 ? 0 : _props$weekStart,\n    _props$limitEndYear = props.limitEndYear,\n    limitEndYear = _props$limitEndYear === void 0 ? 1000 : _props$limitEndYear,\n    limitStartYear = props.limitStartYear,\n    overrideLocale = props.locale,\n    loading = props.loading,\n    label = props.label,\n    menuClassName = props.menuClassName,\n    menuStyle = props.menuStyle,\n    oneTap = props.oneTap,\n    _props$placeholder = props.placeholder,\n    placeholder = _props$placeholder === void 0 ? '' : _props$placeholder,\n    _props$placement = props.placement,\n    placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n    ranges = props.ranges,\n    readOnly = props.readOnly,\n    _props$showOneCalenda = props.showOneCalendar,\n    showOneCalendar = _props$showOneCalenda === void 0 ? false : _props$showOneCalenda,\n    showWeekNumbers = props.showWeekNumbers,\n    showMeridian = props.showMeridian,\n    _props$showHeader = props.showHeader,\n    showHeader = _props$showHeader === void 0 ? true : _props$showHeader,\n    style = props.style,\n    size = props.size,\n    caretAsProp = props.caretAs,\n    valueProp = props.value,\n    monthDropdownProps = props.monthDropdownProps,\n    onChange = props.onChange,\n    onClean = props.onClean,\n    onEnter = props.onEnter,\n    onExit = props.onExit,\n    onOk = props.onOk,\n    onSelect = props.onSelect,\n    onShortcutClick = props.onShortcutClick,\n    renderTitle = props.renderTitle,\n    renderValue = props.renderValue,\n    restProps = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);\n  var id = (0, _hooks.useUniqueId)('rs-', idProp);\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay;\n  var _useClassNames = (0, _hooks.useClassNames)(classPrefix),\n    merge = _useClassNames.merge,\n    prefix = _useClassNames.prefix;\n  var _useCustom = (0, _hooks.useCustom)('DateRangePicker', overrideLocale),\n    locale = _useCustom.locale,\n    formatDate = _useCustom.formatDate;\n\n  // Default gap between two calendars, if `showOneCalendar` is set, the gap is 0\n  var calendarGap = showOneCalendar ? 0 : 1;\n  var rangeFormatStr = \"\" + formatStr + character + formatStr;\n  var _useControlled = (0, _hooks.useControlled)(valueProp, defaultValue !== null && defaultValue !== void 0 ? defaultValue : null),\n    value = _useControlled[0],\n    setValue = _useControlled[1];\n\n  // Show only the calendar month panel. formatStr = 'yyyy-MM'\n  var onlyShowMonth = (0, _date.shouldRenderMonth)(formatStr) && !(0, _date.shouldRenderDate)(formatStr);\n\n  /**\n   * Whether to complete the selection.\n   * Everytime selection will change this value. If the value is false, it means that the selection has not been completed.\n   *\n   * In `oneTap` mode, select action will not change this value, its value should be true always.\n   */\n  var _useState = (0, _react.useState)(true),\n    isSelectedIdle = _useState[0],\n    setSelectedIdle = _useState[1];\n\n  /**\n   * The currently selected date range.\n   *\n   * The time range is selected by two clicks. After the first click,\n   * the cursor will store a temporary event date in the process until\n   * the second click to determine the end date of the date range.\n   *\n   */\n  var _useState2 = (0, _react.useState)((_ref = valueProp !== null && valueProp !== void 0 ? valueProp : defaultValue) !== null && _ref !== void 0 ? _ref : []),\n    selectedDates = _useState2[0],\n    setSelectedDates = _useState2[1];\n\n  // The date of the current hover, used to reduce the calculation of `handleMouseMove`\n  var _useState3 = (0, _react.useState)(value),\n    hoverDateRange = _useState3[0],\n    setHoverDateRange = _useState3[1];\n\n  // The displayed calendar panel is rendered based on this value.\n  var _useState4 = (0, _react.useState)((0, _utils.getSafeCalendarDate)({\n      value: (_ref2 = value !== null && value !== void 0 ? value : defaultCalendarValue) !== null && _ref2 !== void 0 ? _ref2 : null\n    })),\n    calendarDate = _useState4[0],\n    setCalendarDate = _useState4[1];\n\n  /**\n   * When hoverRange is set, `selectValue` will be updated during the hover process,\n   * which will cause the `selectValue` to be updated after the first click,\n   * so declare a Ref to temporarily store the `selectValue` of the first click.\n   */\n  var selectRangeValueRef = (0, _react.useRef)(null);\n\n  /**\n   *\n   * The key of the currently active calendar panel.\n   * Used to switch when only one calendar panel is displayed.\n   */\n  var _useState5 = (0, _react.useState)(),\n    activeCalendarKey = _useState5[0],\n    setActiveCalendarKey = _useState5[1];\n\n  /**\n   * Get the time on the calendar.\n   */\n  var getCalendarDatetime = function getCalendarDatetime(calendarKey) {\n    var index = calendarKey === 'start' ? 0 : 1;\n    return (calendarDate === null || calendarDate === void 0 ? void 0 : calendarDate[index]) || (defaultCalendarValue === null || defaultCalendarValue === void 0 ? void 0 : defaultCalendarValue[index]);\n  };\n\n  /**\n   * Call this function to update the calendar panel rendering benchmark value.\n   * If params `value` is not passed, it defaults to [new Date(), addMonth(new Date(), 1)].\n   */\n  var setCalendarDateRange = function setCalendarDateRange(_ref3) {\n    var dateRange = _ref3.dateRange,\n      calendarKey = _ref3.calendarKey,\n      eventName = _ref3.eventName;\n    var nextValue = dateRange;\n\n    // The time should remain the same when the dates in the date range are changed.\n    if ((0, _date.shouldRenderTime)(formatStr) && dateRange !== null && dateRange !== void 0 && dateRange.length && (eventName === 'changeDate' || eventName === 'changeMonth')) {\n      var startDate = (0, _date.copyTime)({\n        from: getCalendarDatetime('start'),\n        to: dateRange[0]\n      });\n      var 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    var nextCalendarDate = (0, _utils.getSafeCalendarDate)({\n      value: nextValue,\n      calendarKey: calendarKey,\n      // When only the month is displayed and only one calendar is displayed,\n      // there is no need to add a month and two calendar panels are allowed to display the same month\n      allowSameMonth: onlyShowMonth || showOneCalendar\n    });\n    setCalendarDate(nextCalendarDate);\n    if (onlyShowMonth && eventName === 'changeMonth') {\n      setSelectedDates(nextCalendarDate);\n    }\n  };\n  (0, _react.useEffect)(function () {\n    // If value changes, update the selected and hover date values on the calendar panel.\n    setSelectedDates(valueProp !== null && valueProp !== void 0 ? valueProp : []);\n    setHoverDateRange(valueProp !== null && valueProp !== void 0 ? valueProp : null);\n  }, [valueProp]);\n  var getInputHtmlSize = function getInputHtmlSize() {\n    var padding = 4;\n    var strings = rangeFormatStr;\n    if (value) {\n      var startDate = value[0],\n        endDate = value[1];\n      strings = \"\" + formatDate(startDate, formatStr) + character + formatDate(endDate, formatStr);\n    }\n    return (0, _utils2.getStringLength)(strings) + padding;\n  };\n\n  /**\n   * preset hover range\n   */\n  var getHoverRangeValue = function getHoverRangeValue(date) {\n    function getHoverRangeFunc() {\n      if (hoverRange === 'week') {\n        return function (date) {\n          return (0, _utils.getWeekHoverRange)(date, {\n            isoWeek: isoWeek,\n            weekStart: weekStart,\n            locale: locale === null || locale === void 0 ? void 0 : locale.dateLocale\n          });\n        };\n      } else if (hoverRange === 'month') {\n        return _utils.getMonthHoverRange;\n      }\n      return hoverRange;\n    }\n    var hoverRangeFunc = getHoverRangeFunc();\n    if ((0, _isNil.default)(hoverRangeFunc)) {\n      return null;\n    }\n    var hoverValues = hoverRangeFunc(date);\n    var isHoverRangeValid = hoverValues instanceof Array && hoverValues.length === 2;\n    if (!isHoverRangeValid) {\n      return null;\n    }\n    if ((0, _date.isAfter)(hoverValues[0], hoverValues[1])) {\n      hoverValues = (0, _date.reverseDateRangeOmitTime)(hoverValues);\n    }\n    return hoverValues;\n  };\n  var setDateRange = function setDateRange(event, nextValue, closeOverlay) {\n    if (closeOverlay === void 0) {\n      closeOverlay = true;\n    }\n    // If nextValue is null, it means that the user is erasing the selected dates.\n    setSelectedDates(nextValue !== null && nextValue !== void 0 ? nextValue : []);\n    setValue(nextValue);\n    if (!(0, _utils.isSameRange)(nextValue, value, formatStr)) {\n      onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n    }\n\n    // `closeOverlay` default value is `true`\n    if (closeOverlay !== false) {\n      handleClose();\n    }\n  };\n\n  /**\n   * Select the date range. If oneTap is not set, you need to click twice to select the start time and end time.\n   * The MouseMove event is called between the first click and the second click to update the selection state.\n   */\n  var onMouseMove = (0, _hooks.useEventCallback)(function (date) {\n    var nextHoverDateRange = getHoverRangeValue(date);\n\n    // If hasDoneSelect is false,\n    // it means there's already one selected date\n    // and waiting for user to select the second date to complete the selection.\n    if (!isSelectedIdle) {\n      // If `hoverRange` is set, you need to change the value of hoverDateRange according to the rules\n      if (!(0, _isNil.default)(nextHoverDateRange) && !(0, _isNil.default)(selectRangeValueRef.current)) {\n        var nextSelectedDates = [selectRangeValueRef.current[0], nextHoverDateRange[1]];\n        if ((0, _date.isBefore)(nextHoverDateRange[0], selectRangeValueRef.current[0])) {\n          nextSelectedDates = [nextHoverDateRange[0], selectRangeValueRef.current[1]];\n        }\n        setSelectedDates(nextSelectedDates);\n      } else {\n        setHoverDateRange(function (prevHoverValue) {\n          return (0, _isNil.default)(prevHoverValue) ? null : [prevHoverValue[0], date];\n        });\n      }\n\n      // Before the first click, if nextHoverDateRange has a value, hoverDateRange needs to be updated\n    } else if (!(0, _isNil.default)(nextHoverDateRange)) {\n      setHoverDateRange(nextHoverDateRange);\n    }\n  });\n\n  /**\n   * Callback for selecting a date cell in the calendar grid\n   */\n  var handleSelectDate = (0, _hooks.useEventCallback)(function (index, date, event) {\n    var calendarKey = index === 0 ? 'start' : 'end';\n    var nextSelectDates = hoverDateRange !== null && hoverDateRange !== void 0 ? hoverDateRange : [];\n    var hoverRangeValue = getHoverRangeValue(date);\n    var noHoverRangeValid = (0, _isNil.default)(hoverRangeValue);\n\n    // in `oneTap` mode\n    if (oneTap) {\n      setDateRange(event, noHoverRangeValid ? [(0, _date.startOfDay)(date), (0, _date.endOfDay)(date)] : hoverRangeValue);\n      onSelect === null || onSelect === void 0 ? void 0 : onSelect(date, event);\n      return;\n    }\n\n    // no preset hover range can use\n    if (noHoverRangeValid) {\n      // start select\n      if (isSelectedIdle) {\n        nextSelectDates = [date];\n      } else {\n        // finish select\n        nextSelectDates[1] = date;\n      }\n    } else {\n      if (!isSelectedIdle) {\n        nextSelectDates = selectedDates;\n        selectRangeValueRef.current = null;\n      } else {\n        nextSelectDates = hoverRangeValue;\n        selectRangeValueRef.current = hoverRangeValue;\n      }\n    }\n    if (nextSelectDates.length === 2) {\n      // If user have completed the selection, then sort the selected dates.\n      if ((0, _date.isAfter)(nextSelectDates[0], nextSelectDates[1])) {\n        nextSelectDates = (0, _date.reverseDateRangeOmitTime)(nextSelectDates);\n      }\n      if ((0, _date.shouldRenderTime)(formatStr)) {\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)(calendarDate[index], date) || calendarSnapping) {\n      setCalendarDateRange({\n        dateRange: nextSelectDates,\n        calendarKey: calendarKey,\n        eventName: 'changeDate'\n      });\n    }\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(date, event);\n    setSelectedIdle(!isSelectedIdle);\n  });\n\n  /**\n   * If `selectValue` changed, there will be the following effects.\n   * 1. Check if the selection is completed.\n   * 2. if the selection is completed, set the temporary `hoverValue` empty.\n   */\n  (0, _react.useEffect)(function () {\n    var selectValueLength = selectedDates.length;\n    var doneSelected = selectValueLength === 0 || selectValueLength === 2;\n    doneSelected && setHoverDateRange(null);\n  }, [selectedDates]);\n  var onChangeCalendarMonth = (0, _hooks.useEventCallback)(function (index, date) {\n    var calendarKey = index === 0 ? 'start' : 'end';\n    var nextCalendarDate = Array.from(calendarDate);\n    nextCalendarDate[index] = date;\n    setCalendarDateRange({\n      dateRange: nextCalendarDate,\n      calendarKey: calendarKey,\n      eventName: 'changeMonth'\n    });\n  });\n  var onChangeCalendarTime = (0, _hooks.useEventCallback)(function (index, date) {\n    var calendarKey = index === 0 ? 'start' : 'end';\n    var nextCalendarDate = Array.from(calendarDate);\n    nextCalendarDate[index] = date;\n    setCalendarDateRange({\n      dateRange: nextCalendarDate,\n      calendarKey: calendarKey,\n      eventName: 'changeTime'\n    });\n    setSelectedDates(function (prev) {\n      var next = [].concat(prev);\n\n      // if next[index] is not empty, only update the time after aligning the year, month and day\n      next[index] = next[index] ? (0, _date.copyTime)({\n        from: date,\n        to: next[index]\n      }) : new Date(date.valueOf());\n      return next;\n    });\n  });\n\n  /**\n   * The callback triggered when PM/AM is switched.\n   */\n  var onToggleMeridian = (0, _hooks.useEventCallback)(function (index) {\n    var nextCalendarDate = Array.from(calendarDate);\n    nextCalendarDate[index] = (0, _date.getReversedTimeMeridian)(nextCalendarDate[index]);\n    setCalendarDate(nextCalendarDate);\n\n    // If the value already exists, update the value again.\n    if (selectedDates.length === 2) {\n      var nextSelectedDates = Array.from(selectedDates);\n      nextSelectedDates[index] = (0, _date.getReversedTimeMeridian)(nextSelectedDates[index]);\n      setSelectedDates(nextSelectedDates);\n    }\n  });\n  var handleEnter = (0, _hooks.useEventCallback)(function () {\n    var nextCalendarDate;\n    if (value && value.length) {\n      var startDate = value[0],\n        endData = value[1];\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      });\n    }\n    setSelectedDates(value !== null && value !== void 0 ? value : []);\n    setCalendarDateRange({\n      dateRange: nextCalendarDate\n    });\n  });\n\n  /**\n   * Toolbar operation callback function\n   */\n  var handleShortcutPageDate = (0, _hooks.useEventCallback)(function (range, closeOverlay, event) {\n    if (closeOverlay === void 0) {\n      closeOverlay = false;\n    }\n    var value = range.value;\n    setCalendarDateRange({\n      dateRange: value,\n      eventName: 'shortcutSelection'\n    });\n    if (closeOverlay) {\n      setDateRange(event, value, closeOverlay);\n    } else {\n      setSelectedDates(value !== null && value !== void 0 ? value : []);\n    }\n    onShortcutClick === null || onShortcutClick === void 0 ? void 0 : onShortcutClick(range, event);\n\n    // End unfinished selections.\n    setSelectedIdle(true);\n  });\n  var handleClickOK = (0, _hooks.useEventCallback)(function (event) {\n    setDateRange(event, selectedDates);\n    onOk === null || onOk === void 0 ? void 0 : onOk(selectedDates, event);\n  });\n  var handleClean = (0, _hooks.useEventCallback)(function (event) {\n    setCalendarDateRange({\n      dateRange: null\n    });\n    setDateRange(event, null);\n    onClean === null || onClean === void 0 ? void 0 : onClean(event);\n    event.stopPropagation();\n  });\n\n  /**\n   * Callback after the input box value is changed.\n   */\n  var handleInputChange = (0, _hooks.useEventCallback)(function (value, event) {\n    if (!value) {\n      return;\n    }\n    var startDate = value[0],\n      endDate = value[1];\n    var selectValue = [startDate, endDate];\n    setHoverDateRange(selectValue);\n    setSelectedDates(selectValue);\n    setCalendarDateRange({\n      dateRange: selectValue\n    });\n    setDateRange(event, selectValue, false);\n  });\n\n  /**\n   * Check if the date is disabled\n   */\n  var isDateDisabled = (0, _useDateDisabled.default)({\n    shouldDisableDate: shouldDisableDate,\n    DEPRECATED_disabledDate: DEPRECATED_disabledDate\n  });\n\n  /**\n   * Check if a date range is disabled\n   */\n  var isRangeDisabled = function 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: target\n        })) {\n          return true;\n        }\n        start = (0, _date.addDays)(start, 1);\n      }\n    }\n    return false;\n  };\n\n  /**\n   * Check if the OK button is disabled\n   */\n  var isOkButtonDisabled = function isOkButtonDisabled() {\n    var start = selectedDates[0],\n      end = selectedDates[1];\n    if (!start || !end || !isSelectedIdle) {\n      return true;\n    }\n    if (isErrorValue([start, end])) {\n      return true;\n    }\n    return false;\n  };\n\n  /**\n   * Check if the shortcut button is disabled\n   */\n  var isShortcutDisabled = function isShortcutDisabled(value) {\n    if (value === void 0) {\n      value = [];\n    }\n    var _value = value,\n      start = _value[0],\n      end = _value[1];\n    if (!start || !end) {\n      return true;\n    }\n    return isRangeDisabled(start, end, _constants.DATERANGE_DISABLED_TARGET.TOOLBAR_SHORTCUT);\n  };\n  var handleClose = (0, _hooks.useEventCallback)(function () {\n    var _trigger$current, _trigger$current$clos;\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 ? void 0 : _trigger$current$clos.call(_trigger$current);\n  });\n  var handleInputKeyDown = (0, _hooks.useEventCallback)(function (event) {\n    (0, _Picker.onMenuKeyDown)(event, {\n      esc: handleClose,\n      enter: function enter() {\n        var _trigger$current2;\n        var _ref4 = ((_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : _trigger$current2.getState()) || {},\n          open = _ref4.open;\n        if (!open) {\n          var _trigger$current3;\n          (_trigger$current3 = trigger.current) === null || _trigger$current3 === void 0 ? void 0 : _trigger$current3.open();\n        }\n      }\n    });\n  });\n  var disableCalendarDate = isDateDisabled ? function (date, values, type) {\n    return isDateDisabled(date, {\n      selectDate: values,\n      selectedDone: isSelectedIdle,\n      target: type\n    });\n  } : undefined;\n  var renderCalendarOverlay = function renderCalendarOverlay(positionProps, speakerRef) {\n    var left = positionProps.left,\n      top = positionProps.top,\n      className = positionProps.className;\n    var classes = merge(className, menuClassName, prefix('popup-daterange'));\n    var panelClasses = prefix('daterange-panel', {\n      'daterange-panel-show-one-calendar': showOneCalendar\n    });\n\n    /**\n     * Set a min-width (528px) when there are two calendars\n     * @see https://github.com/rsuite/rsuite/issues/3522\n     */\n    var panelStyles = {\n      minWidth: showOneCalendar ? 'auto' : 528\n    };\n    var styles = (0, _extends2.default)({}, menuStyle, {\n      left: left,\n      top: top\n    });\n    var calendarProps = {\n      locale: locale,\n      isoWeek: isoWeek,\n      weekStart: weekStart,\n      limitEndYear: limitEndYear,\n      showMeridian: showMeridian,\n      calendarDate: calendarDate,\n      limitStartYear: limitStartYear,\n      showWeekNumbers: showWeekNumbers,\n      format: formatStr,\n      value: selectedDates,\n      monthDropdownProps: monthDropdownProps,\n      hoverRangeValue: hoverDateRange !== null && hoverDateRange !== void 0 ? hoverDateRange : undefined,\n      disabledDate: disableCalendarDate,\n      onSelect: handleSelectDate,\n      onChangeCalendarMonth: onChangeCalendarMonth,\n      onChangeCalendarTime: onChangeCalendarTime,\n      onToggleMeridian: onToggleMeridian,\n      onMouseMove: onMouseMove,\n      renderTitle: renderTitle\n    };\n    var getCalendars = function getCalendars() {\n      if (showOneCalendar) {\n        return /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n          index: activeCalendarKey === 'end' ? 1 : 0\n        }, calendarProps, {\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 857,\n            columnNumber: 16\n          }\n        }));\n      }\n      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n        index: 0\n      }, calendarProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 862,\n          columnNumber: 11\n        }\n      })), /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n        index: 1\n      }, calendarProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 863,\n          columnNumber: 11\n        }\n      })));\n    };\n    var sideRanges = (ranges === null || ranges === void 0 ? void 0 : ranges.filter(function (range) {\n      return (range === null || range === void 0 ? void 0 : range.placement) === 'left';\n    })) || [];\n    var bottomRanges = ranges === null || ranges === void 0 ? void 0 : ranges.filter(function (range) {\n      return (range === null || range === void 0 ? void 0 : range.placement) === 'bottom' || (range === null || range === void 0 ? void 0 : range.placement) === undefined;\n    });\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      role: \"dialog\",\n      \"aria-labelledby\": label ? id + \"-label\" : undefined,\n      tabIndex: -1,\n      className: classes,\n      ref: (0, _utils2.mergeRefs)(overlay, speakerRef),\n      target: trigger,\n      style: styles,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 874,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: panelClasses,\n      style: panelStyles,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 883,\n        columnNumber: 9\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Stack.default, {\n      alignItems: \"flex-start\",\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 884,\n        columnNumber: 11\n      }\n    }, sideRanges.length > 0 && /*#__PURE__*/_react.default.createElement(_PredefinedRanges.default, {\n      direction: \"column\",\n      spacing: 0,\n      className: prefix('daterange-predefined'),\n      ranges: sideRanges,\n      calendarDate: calendarDate,\n      locale: locale,\n      disableShortcut: isShortcutDisabled,\n      onShortcutClick: handleShortcutPageDate,\n      \"data-testid\": \"daterange-predefined-side\",\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 886,\n        columnNumber: 15\n      }\n    }), /*#__PURE__*/_react.default.createElement(_Stack.default.Item, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 899,\n        columnNumber: 13\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix('daterange-content'),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 900,\n        columnNumber: 15\n      }\n    }, showHeader && /*#__PURE__*/_react.default.createElement(_Header.default, {\n      value: isSelectedIdle ? selectedDates : hoverDateRange,\n      formatStr: formatStr,\n      character: character,\n      clickable: showOneCalendar,\n      activeKey: activeCalendarKey,\n      onSelect: setActiveCalendarKey,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 902,\n        columnNumber: 19\n      }\n    }), /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix(\"daterange-calendar-\" + (showOneCalendar ? 'single' : 'group')),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 912,\n        columnNumber: 17\n      }\n    }, /*#__PURE__*/_react.default.createElement(_DateRangePickerContext.default.Provider, {\n      value: {\n        isSelectedIdle: isSelectedIdle\n      },\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 915,\n        columnNumber: 19\n      }\n    }, getCalendars()))), /*#__PURE__*/_react.default.createElement(_Toolbar.default, {\n      locale: locale,\n      calendarDate: selectedDates,\n      disableOkBtn: isOkButtonDisabled,\n      disableShortcut: isShortcutDisabled,\n      hideOkBtn: oneTap,\n      onOk: handleClickOK,\n      onShortcutClick: handleShortcutPageDate,\n      ranges: bottomRanges,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 920,\n        columnNumber: 15\n      }\n    })))));\n  };\n  var hasValue = !(0, _isNil.default)(value) && value.length > 1;\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n      classPrefix: classPrefix,\n      name: 'daterange',\n      appearance: appearance,\n      hasValue: hasValue,\n      cleanable: cleanable\n    })),\n    classes = _usePickerClassName[0],\n    usedClassNamePropKeys = _usePickerClassName[1];\n  var caretAs = (0, _react.useMemo)(function () {\n    if (caretAsProp === null) {\n      return null;\n    }\n    return caretAsProp || ((0, _date.shouldOnlyRenderTime)(formatStr) ? _ClockO.default : _Calendar.default);\n  }, [caretAsProp, formatStr]);\n  var isErrorValue = function isErrorValue(value) {\n    if (!value) {\n      return false;\n    }\n\n    // If the value is an empty array, it is not an error value.\n    if (Array.isArray(value) && value.length === 0) {\n      return false;\n    }\n    var startDate = value[0],\n      endDate = value[1];\n    if (!(0, _date.isValid)(startDate) || !(0, _date.isValid)(endDate)) {\n      return true;\n    }\n    if ((0, _date.isBefore)(endDate, startDate)) {\n      return true;\n    }\n    var 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  var _partitionHTMLProps = (0, _utils2.partitionHTMLProps)(restProps, {\n      htmlProps: [],\n      includeAria: true\n    }),\n    ariaProps = _partitionHTMLProps[0],\n    rest = _partitionHTMLProps[1];\n  var showCleanButton = cleanable && hasValue && !readOnly;\n  var invalidValue = value && isErrorValue(value);\n  var _useCustomizedInput = (0, _useCustomizedInput2.default)({\n      mode: 'dateRange',\n      value: value,\n      formatStr: formatStr,\n      renderValue: renderValue,\n      readOnly: readOnly,\n      editable: editable,\n      loading: loading\n    }),\n    customValue = _useCustomizedInput.customValue,\n    inputReadOnly = _useCustomizedInput.inputReadOnly,\n    Input = _useCustomizedInput.Input,\n    events = _useCustomizedInput.events;\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    trigger: \"active\",\n    ref: trigger,\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    placement: placement,\n    onEnter: (0, _utils2.createChainedFunction)(events.onActive, handleEnter, onEnter),\n    onExit: (0, _utils2.createChainedFunction)(events.onInactive, onExit),\n    speaker: renderCalendarOverlay,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1005,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    ref: root,\n    className: merge(className, classes, (_merge = {}, _merge[prefix('error')] = invalidValue, _merge)),\n    style: style,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1014,\n      columnNumber: 7\n    }\n  }, plaintext ? /*#__PURE__*/_react.default.createElement(_DateRangeInput.default, {\n    value: value,\n    format: formatStr,\n    plaintext: plaintext,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1020,\n      columnNumber: 11\n    }\n  }) : /*#__PURE__*/_react.default.createElement(_InputGroup.default, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys, _date.calendarOnlyProps)), {\n    inside: true,\n    className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)([\"input-group\"]))),\n    disabled: disabled,\n    size: size,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1022,\n      columnNumber: 11\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Picker.PickerLabel, {\n    className: prefix(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)([\"label\"]))),\n    id: id + \"-label\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1033,\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: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1036,\n      columnNumber: 13\n    }\n  })), /*#__PURE__*/_react.default.createElement(_Picker.PickerIndicator, {\n    loading: loading,\n    caretAs: caretAs,\n    onClose: handleClean,\n    showCleanButton: showCleanButton,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1053,\n      columnNumber: 13\n    }\n  }))));\n});\nDateRangePicker.displayName = 'DateRangePicker';\nDateRangePicker.propTypes = (0, _extends2.default)({}, _Picker.pickerPropTypes, {\n  ranges: _propTypes.default.array,\n  value: _propTypes.default.arrayOf(_propTypes.default.instanceOf(Date)),\n  defaultValue: _propTypes.default.arrayOf(_propTypes.default.instanceOf(Date)),\n  defaultCalendarValue: _propTypes.default.arrayOf(_propTypes.default.instanceOf(Date)),\n  hoverRange: _propTypes.default.oneOfType([(0, _propTypes2.oneOf)(['week', 'month']), _propTypes.default.func]),\n  format: _propTypes.default.string,\n  isoWeek: _propTypes.default.bool,\n  weekStart: _propTypes.default.oneOf([0, 1, 2, 3, 4, 5, 6]),\n  oneTap: _propTypes.default.bool,\n  limitEndYear: _propTypes.default.number,\n  limitStartYear: _propTypes.default.number,\n  onChange: _propTypes.default.func,\n  onOk: _propTypes.default.func,\n  disabledDate: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.func, 'Use \"shouldDisableDate\" property instead.'),\n  shouldDisableDate: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  showWeekNumbers: _propTypes.default.bool,\n  showMeridian: _propTypes.default.bool,\n  showOneCalendar: _propTypes.default.bool\n});\nvar _default = 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 _taggedTemplateLiteralLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/taggedTemplateLiteralLoose */ \"./node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js\"));\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _react = _interopRequireWildcard(__webpack_require__(/*! react */ \"react\"));\nvar _isNil = _interopRequireDefault(__webpack_require__(/*! lodash/isNil */ \"./node_modules/lodash/isNil.js\"));\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _pick = _interopRequireDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nvar _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ \"./node_modules/prop-types/index.js\"));\nvar _Calendar = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/Calendar */ \"./node_modules/@rsuite/icons/legacy/Calendar.js\"));\nvar _ClockO = _interopRequireDefault(__webpack_require__(/*! @rsuite/icons/legacy/ClockO */ \"./node_modules/@rsuite/icons/legacy/ClockO.js\"));\nvar _Toolbar = _interopRequireDefault(__webpack_require__(/*! ../DatePicker/Toolbar */ \"./src/DatePicker/Toolbar.tsx\"));\nvar _PredefinedRanges = _interopRequireDefault(__webpack_require__(/*! ../DatePicker/PredefinedRanges */ \"./src/DatePicker/PredefinedRanges.tsx\"));\nvar _Stack = _interopRequireDefault(__webpack_require__(/*! ../Stack */ \"./src/Stack/index.tsx\"));\nvar _DateRangePickerContext = _interopRequireDefault(__webpack_require__(/*! ./DateRangePickerContext */ \"./src/DateRangePicker/DateRangePickerContext.ts\"));\nvar _DateRangeInput = _interopRequireDefault(__webpack_require__(/*! ../DateRangeInput */ \"./src/DateRangeInput/index.tsx\"));\nvar _InputGroup = _interopRequireDefault(__webpack_require__(/*! ../InputGroup */ \"./src/InputGroup/index.tsx\"));\nvar _Header = _interopRequireDefault(__webpack_require__(/*! ./Header */ \"./src/DateRangePicker/Header.tsx\"));\nvar _useDateDisabled = _interopRequireDefault(__webpack_require__(/*! ./hooks/useDateDisabled */ \"./src/DateRangePicker/hooks/useDateDisabled.ts\"));\nvar _useCustomizedInput2 = _interopRequireDefault(__webpack_require__(/*! ../DatePicker/hooks/useCustomizedInput */ \"./src/DatePicker/hooks/useCustomizedInput.ts\"));\nvar _Calendar2 = _interopRequireDefault(__webpack_require__(/*! ./Calendar */ \"./src/DateRangePicker/Calendar.tsx\"));\nvar _utils = __webpack_require__(/*! ./utils */ \"./src/DateRangePicker/utils.ts\");\nvar _propTypes2 = __webpack_require__(/*! ../internals/propTypes */ \"./src/internals/propTypes/index.ts\");\nvar _constants = __webpack_require__(/*! ../internals/constants */ \"./src/internals/constants/index.ts\");\nvar _Picker = __webpack_require__(/*! ../internals/Picker */ \"./src/internals/Picker/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 _date = __webpack_require__(/*! ../internals/utils/date */ \"./src/internals/utils/date/index.ts\");\nvar _excluded = [\"as\", \"classPrefix\", \"className\", \"appearance\", \"editable\", \"cleanable\", \"character\", \"calendarSnapping\", \"defaultCalendarValue\", \"defaultValue\", \"plaintext\", \"disabled\", \"disabledDate\", \"shouldDisableDate\", \"format\", \"hoverRange\", \"id\", \"isoWeek\", \"weekStart\", \"limitEndYear\", \"limitStartYear\", \"locale\", \"loading\", \"label\", \"menuClassName\", \"menuStyle\", \"oneTap\", \"placeholder\", \"placement\", \"ranges\", \"readOnly\", \"showOneCalendar\", \"showWeekNumbers\", \"showMeridian\", \"showHeader\", \"style\", \"size\", \"caretAs\", \"value\", \"monthDropdownProps\", \"hideHours\", \"hideMinutes\", \"hideSeconds\", \"onChange\", \"onClean\", \"onEnter\", \"onExit\", \"onOk\", \"onSelect\", \"onShortcutClick\", \"renderTitle\", \"renderValue\"];\nvar _jsxFileName = \"/home/runner/work/rsuite/rsuite/src/DateRangePicker/DateRangePicker.tsx\",\n  _this = void 0,\n  _templateObject,\n  _templateObject2;\nfunction _getRequireWildcardCache(e) { if (\"function\" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }\nfunction _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if (\"default\" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }\n/**\n * A date range picker allows you to select a date range from a calendar.\n *\n * @see https://rsuitejs.com/components/date-range-picker\n */\nvar DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var _ref, _ref2, _merge;\n  var _props$as = props.as,\n    Component = _props$as === void 0 ? 'div' : _props$as,\n    _props$classPrefix = props.classPrefix,\n    classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,\n    className = props.className,\n    _props$appearance = props.appearance,\n    appearance = _props$appearance === void 0 ? 'default' : _props$appearance,\n    _props$editable = props.editable,\n    editable = _props$editable === void 0 ? true : _props$editable,\n    _props$cleanable = props.cleanable,\n    cleanable = _props$cleanable === void 0 ? true : _props$cleanable,\n    _props$character = props.character,\n    character = _props$character === void 0 ? ' ~ ' : _props$character,\n    calendarSnapping = props.calendarSnapping,\n    defaultCalendarValue = props.defaultCalendarValue,\n    defaultValue = props.defaultValue,\n    plaintext = props.plaintext,\n    disabled = props.disabled,\n    DEPRECATED_disabledDate = props.disabledDate,\n    shouldDisableDate = props.shouldDisableDate,\n    _props$format = props.format,\n    formatStr = _props$format === void 0 ? 'yyyy-MM-dd' : _props$format,\n    hoverRange = props.hoverRange,\n    idProp = props.id,\n    _props$isoWeek = props.isoWeek,\n    isoWeek = _props$isoWeek === void 0 ? false : _props$isoWeek,\n    _props$weekStart = props.weekStart,\n    weekStart = _props$weekStart === void 0 ? 0 : _props$weekStart,\n    _props$limitEndYear = props.limitEndYear,\n    limitEndYear = _props$limitEndYear === void 0 ? 1000 : _props$limitEndYear,\n    limitStartYear = props.limitStartYear,\n    overrideLocale = props.locale,\n    loading = props.loading,\n    label = props.label,\n    menuClassName = props.menuClassName,\n    menuStyle = props.menuStyle,\n    oneTap = props.oneTap,\n    _props$placeholder = props.placeholder,\n    placeholder = _props$placeholder === void 0 ? '' : _props$placeholder,\n    _props$placement = props.placement,\n    placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,\n    ranges = props.ranges,\n    readOnly = props.readOnly,\n    _props$showOneCalenda = props.showOneCalendar,\n    showOneCalendar = _props$showOneCalenda === void 0 ? false : _props$showOneCalenda,\n    showWeekNumbers = props.showWeekNumbers,\n    showMeridian = props.showMeridian,\n    _props$showHeader = props.showHeader,\n    showHeader = _props$showHeader === void 0 ? true : _props$showHeader,\n    style = props.style,\n    size = props.size,\n    caretAsProp = props.caretAs,\n    valueProp = props.value,\n    monthDropdownProps = props.monthDropdownProps,\n    hideHours = props.hideHours,\n    hideMinutes = props.hideMinutes,\n    hideSeconds = props.hideSeconds,\n    onChange = props.onChange,\n    onClean = props.onClean,\n    onEnter = props.onEnter,\n    onExit = props.onExit,\n    onOk = props.onOk,\n    onSelect = props.onSelect,\n    onShortcutClick = props.onShortcutClick,\n    renderTitle = props.renderTitle,\n    renderValue = props.renderValue,\n    restProps = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);\n  var id = (0, _hooks.useUniqueId)('rs-', idProp);\n  var _usePickerRef = (0, _Picker.usePickerRef)(ref),\n    trigger = _usePickerRef.trigger,\n    root = _usePickerRef.root,\n    target = _usePickerRef.target,\n    overlay = _usePickerRef.overlay;\n  var _useClassNames = (0, _hooks.useClassNames)(classPrefix),\n    merge = _useClassNames.merge,\n    prefix = _useClassNames.prefix;\n  var _useCustom = (0, _hooks.useCustom)('DateRangePicker', overrideLocale),\n    locale = _useCustom.locale,\n    formatDate = _useCustom.formatDate;\n\n  // Default gap between two calendars, if `showOneCalendar` is set, the gap is 0\n  var calendarGap = showOneCalendar ? 0 : 1;\n  var rangeFormatStr = \"\" + formatStr + character + formatStr;\n  var _useControlled = (0, _hooks.useControlled)(valueProp, defaultValue !== null && defaultValue !== void 0 ? defaultValue : null),\n    value = _useControlled[0],\n    setValue = _useControlled[1];\n\n  // Show only the calendar month panel. formatStr = 'yyyy-MM'\n  var onlyShowMonth = (0, _date.shouldRenderMonth)(formatStr) && !(0, _date.shouldRenderDate)(formatStr);\n\n  /**\n   * Whether to complete the selection.\n   * Everytime selection will change this value. If the value is false, it means that the selection has not been completed.\n   *\n   * In `oneTap` mode, select action will not change this value, its value should be true always.\n   */\n  var _useState = (0, _react.useState)(true),\n    isSelectedIdle = _useState[0],\n    setSelectedIdle = _useState[1];\n\n  /**\n   * The currently selected date range.\n   *\n   * The time range is selected by two clicks. After the first click,\n   * the cursor will store a temporary event date in the process until\n   * the second click to determine the end date of the date range.\n   *\n   */\n  var _useState2 = (0, _react.useState)((_ref = valueProp !== null && valueProp !== void 0 ? valueProp : defaultValue) !== null && _ref !== void 0 ? _ref : []),\n    selectedDates = _useState2[0],\n    setSelectedDates = _useState2[1];\n\n  // The date of the current hover, used to reduce the calculation of `handleMouseMove`\n  var _useState3 = (0, _react.useState)(value),\n    hoverDateRange = _useState3[0],\n    setHoverDateRange = _useState3[1];\n\n  // The displayed calendar panel is rendered based on this value.\n  var _useState4 = (0, _react.useState)((0, _utils.getSafeCalendarDate)({\n      value: (_ref2 = value !== null && value !== void 0 ? value : defaultCalendarValue) !== null && _ref2 !== void 0 ? _ref2 : null\n    })),\n    calendarDate = _useState4[0],\n    setCalendarDate = _useState4[1];\n\n  /**\n   * When hoverRange is set, `selectValue` will be updated during the hover process,\n   * which will cause the `selectValue` to be updated after the first click,\n   * so declare a Ref to temporarily store the `selectValue` of the first click.\n   */\n  var selectRangeValueRef = (0, _react.useRef)(null);\n\n  /**\n   *\n   * The key of the currently active calendar panel.\n   * Used to switch when only one calendar panel is displayed.\n   */\n  var _useState5 = (0, _react.useState)(),\n    activeCalendarKey = _useState5[0],\n    setActiveCalendarKey = _useState5[1];\n\n  /**\n   * Get the time on the calendar.\n   */\n  var getCalendarDatetime = function getCalendarDatetime(calendarKey) {\n    var index = calendarKey === 'start' ? 0 : 1;\n    return (calendarDate === null || calendarDate === void 0 ? void 0 : calendarDate[index]) || (defaultCalendarValue === null || defaultCalendarValue === void 0 ? void 0 : defaultCalendarValue[index]);\n  };\n\n  /**\n   * Call this function to update the calendar panel rendering benchmark value.\n   * If params `value` is not passed, it defaults to [new Date(), addMonth(new Date(), 1)].\n   */\n  var setCalendarDateRange = function setCalendarDateRange(_ref3) {\n    var dateRange = _ref3.dateRange,\n      calendarKey = _ref3.calendarKey,\n      eventName = _ref3.eventName;\n    var nextValue = dateRange;\n\n    // The time should remain the same when the dates in the date range are changed.\n    if ((0, _date.shouldRenderTime)(formatStr) && dateRange !== null && dateRange !== void 0 && dateRange.length && (eventName === 'changeDate' || eventName === 'changeMonth')) {\n      var startDate = (0, _date.copyTime)({\n        from: getCalendarDatetime('start'),\n        to: dateRange[0]\n      });\n      var 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    var nextCalendarDate = (0, _utils.getSafeCalendarDate)({\n      value: nextValue,\n      calendarKey: calendarKey,\n      // When only the month is displayed and only one calendar is displayed,\n      // there is no need to add a month and two calendar panels are allowed to display the same month\n      allowSameMonth: onlyShowMonth || showOneCalendar\n    });\n    setCalendarDate(nextCalendarDate);\n    if (onlyShowMonth && eventName === 'changeMonth') {\n      setSelectedDates(nextCalendarDate);\n    }\n  };\n  (0, _react.useEffect)(function () {\n    // If value changes, update the selected and hover date values on the calendar panel.\n    setSelectedDates(valueProp !== null && valueProp !== void 0 ? valueProp : []);\n    setHoverDateRange(valueProp !== null && valueProp !== void 0 ? valueProp : null);\n  }, [valueProp]);\n  var getInputHtmlSize = function getInputHtmlSize() {\n    var padding = 4;\n    var strings = rangeFormatStr;\n    if (value) {\n      var startDate = value[0],\n        endDate = value[1];\n      strings = \"\" + formatDate(startDate, formatStr) + character + formatDate(endDate, formatStr);\n    }\n    return (0, _utils2.getStringLength)(strings) + padding;\n  };\n\n  /**\n   * preset hover range\n   */\n  var getHoverRangeValue = function getHoverRangeValue(date) {\n    function getHoverRangeFunc() {\n      if (hoverRange === 'week') {\n        return function (date) {\n          return (0, _utils.getWeekHoverRange)(date, {\n            isoWeek: isoWeek,\n            weekStart: weekStart,\n            locale: locale === null || locale === void 0 ? void 0 : locale.dateLocale\n          });\n        };\n      } else if (hoverRange === 'month') {\n        return _utils.getMonthHoverRange;\n      }\n      return hoverRange;\n    }\n    var hoverRangeFunc = getHoverRangeFunc();\n    if ((0, _isNil.default)(hoverRangeFunc)) {\n      return null;\n    }\n    var hoverValues = hoverRangeFunc(date);\n    var isHoverRangeValid = hoverValues instanceof Array && hoverValues.length === 2;\n    if (!isHoverRangeValid) {\n      return null;\n    }\n    if ((0, _date.isAfter)(hoverValues[0], hoverValues[1])) {\n      hoverValues = (0, _date.reverseDateRangeOmitTime)(hoverValues);\n    }\n    return hoverValues;\n  };\n  var setDateRange = function setDateRange(event, nextValue, closeOverlay) {\n    if (closeOverlay === void 0) {\n      closeOverlay = true;\n    }\n    // If nextValue is null, it means that the user is erasing the selected dates.\n    setSelectedDates(nextValue !== null && nextValue !== void 0 ? nextValue : []);\n    setValue(nextValue);\n    if (!(0, _utils.isSameRange)(nextValue, value, formatStr)) {\n      onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);\n    }\n\n    // `closeOverlay` default value is `true`\n    if (closeOverlay !== false) {\n      handleClose();\n    }\n  };\n\n  /**\n   * Select the date range. If oneTap is not set, you need to click twice to select the start time and end time.\n   * The MouseMove event is called between the first click and the second click to update the selection state.\n   */\n  var onMouseMove = (0, _hooks.useEventCallback)(function (date) {\n    var nextHoverDateRange = getHoverRangeValue(date);\n\n    // If hasDoneSelect is false,\n    // it means there's already one selected date\n    // and waiting for user to select the second date to complete the selection.\n    if (!isSelectedIdle) {\n      // If `hoverRange` is set, you need to change the value of hoverDateRange according to the rules\n      if (!(0, _isNil.default)(nextHoverDateRange) && !(0, _isNil.default)(selectRangeValueRef.current)) {\n        var nextSelectedDates = [selectRangeValueRef.current[0], nextHoverDateRange[1]];\n        if ((0, _date.isBefore)(nextHoverDateRange[0], selectRangeValueRef.current[0])) {\n          nextSelectedDates = [nextHoverDateRange[0], selectRangeValueRef.current[1]];\n        }\n        setSelectedDates(nextSelectedDates);\n      } else {\n        setHoverDateRange(function (prevHoverValue) {\n          return (0, _isNil.default)(prevHoverValue) ? null : [prevHoverValue[0], date];\n        });\n      }\n\n      // Before the first click, if nextHoverDateRange has a value, hoverDateRange needs to be updated\n    } else if (!(0, _isNil.default)(nextHoverDateRange)) {\n      setHoverDateRange(nextHoverDateRange);\n    }\n  });\n\n  /**\n   * Callback for selecting a date cell in the calendar grid\n   */\n  var handleSelectDate = (0, _hooks.useEventCallback)(function (index, date, event) {\n    var calendarKey = index === 0 ? 'start' : 'end';\n    var nextSelectDates = hoverDateRange !== null && hoverDateRange !== void 0 ? hoverDateRange : [];\n    var hoverRangeValue = getHoverRangeValue(date);\n    var noHoverRangeValid = (0, _isNil.default)(hoverRangeValue);\n\n    // in `oneTap` mode\n    if (oneTap) {\n      setDateRange(event, noHoverRangeValid ? [(0, _date.startOfDay)(date), (0, _date.endOfDay)(date)] : hoverRangeValue);\n      onSelect === null || onSelect === void 0 ? void 0 : onSelect(date, event);\n      return;\n    }\n\n    // no preset hover range can use\n    if (noHoverRangeValid) {\n      // start select\n      if (isSelectedIdle) {\n        nextSelectDates = [date];\n      } else {\n        // finish select\n        nextSelectDates[1] = date;\n      }\n    } else {\n      if (!isSelectedIdle) {\n        nextSelectDates = selectedDates;\n        selectRangeValueRef.current = null;\n      } else {\n        nextSelectDates = hoverRangeValue;\n        selectRangeValueRef.current = hoverRangeValue;\n      }\n    }\n    if (nextSelectDates.length === 2) {\n      // If user have completed the selection, then sort the selected dates.\n      if ((0, _date.isAfter)(nextSelectDates[0], nextSelectDates[1])) {\n        nextSelectDates = (0, _date.reverseDateRangeOmitTime)(nextSelectDates);\n      }\n      if ((0, _date.shouldRenderTime)(formatStr)) {\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)(calendarDate[index], date) || calendarSnapping) {\n      setCalendarDateRange({\n        dateRange: nextSelectDates,\n        calendarKey: calendarKey,\n        eventName: 'changeDate'\n      });\n    }\n    onSelect === null || onSelect === void 0 ? void 0 : onSelect(date, event);\n    setSelectedIdle(!isSelectedIdle);\n  });\n\n  /**\n   * If `selectValue` changed, there will be the following effects.\n   * 1. Check if the selection is completed.\n   * 2. if the selection is completed, set the temporary `hoverValue` empty.\n   */\n  (0, _react.useEffect)(function () {\n    var selectValueLength = selectedDates.length;\n    var doneSelected = selectValueLength === 0 || selectValueLength === 2;\n    doneSelected && setHoverDateRange(null);\n  }, [selectedDates]);\n  var onChangeCalendarMonth = (0, _hooks.useEventCallback)(function (index, date) {\n    var calendarKey = index === 0 ? 'start' : 'end';\n    var nextCalendarDate = Array.from(calendarDate);\n    nextCalendarDate[index] = date;\n    setCalendarDateRange({\n      dateRange: nextCalendarDate,\n      calendarKey: calendarKey,\n      eventName: 'changeMonth'\n    });\n  });\n  var onChangeCalendarTime = (0, _hooks.useEventCallback)(function (index, date) {\n    var calendarKey = index === 0 ? 'start' : 'end';\n    var nextCalendarDate = Array.from(calendarDate);\n    nextCalendarDate[index] = date;\n    setCalendarDateRange({\n      dateRange: nextCalendarDate,\n      calendarKey: calendarKey,\n      eventName: 'changeTime'\n    });\n    setSelectedDates(function (prev) {\n      var next = [].concat(prev);\n\n      // if next[index] is not empty, only update the time after aligning the year, month and day\n      next[index] = next[index] ? (0, _date.copyTime)({\n        from: date,\n        to: next[index]\n      }) : new Date(date.valueOf());\n      return next;\n    });\n  });\n\n  /**\n   * The callback triggered when PM/AM is switched.\n   */\n  var onToggleMeridian = (0, _hooks.useEventCallback)(function (index) {\n    var nextCalendarDate = Array.from(calendarDate);\n    nextCalendarDate[index] = (0, _date.getReversedTimeMeridian)(nextCalendarDate[index]);\n    setCalendarDate(nextCalendarDate);\n\n    // If the value already exists, update the value again.\n    if (selectedDates.length === 2) {\n      var nextSelectedDates = Array.from(selectedDates);\n      nextSelectedDates[index] = (0, _date.getReversedTimeMeridian)(nextSelectedDates[index]);\n      setSelectedDates(nextSelectedDates);\n    }\n  });\n  var handleEnter = (0, _hooks.useEventCallback)(function () {\n    var nextCalendarDate;\n    if (value && value.length) {\n      var startDate = value[0],\n        endData = value[1];\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      });\n    }\n    setSelectedDates(value !== null && value !== void 0 ? value : []);\n    setCalendarDateRange({\n      dateRange: nextCalendarDate\n    });\n  });\n\n  /**\n   * Toolbar operation callback function\n   */\n  var handleShortcutPageDate = (0, _hooks.useEventCallback)(function (range, closeOverlay, event) {\n    if (closeOverlay === void 0) {\n      closeOverlay = false;\n    }\n    var value = range.value;\n    setCalendarDateRange({\n      dateRange: value,\n      eventName: 'shortcutSelection'\n    });\n    if (closeOverlay) {\n      setDateRange(event, value, closeOverlay);\n    } else {\n      setSelectedDates(value !== null && value !== void 0 ? value : []);\n    }\n    onShortcutClick === null || onShortcutClick === void 0 ? void 0 : onShortcutClick(range, event);\n\n    // End unfinished selections.\n    setSelectedIdle(true);\n  });\n  var handleClickOK = (0, _hooks.useEventCallback)(function (event) {\n    setDateRange(event, selectedDates);\n    onOk === null || onOk === void 0 ? void 0 : onOk(selectedDates, event);\n  });\n  var handleClean = (0, _hooks.useEventCallback)(function (event) {\n    setCalendarDateRange({\n      dateRange: null\n    });\n    setDateRange(event, null);\n    onClean === null || onClean === void 0 ? void 0 : onClean(event);\n    event.stopPropagation();\n  });\n\n  /**\n   * Callback after the input box value is changed.\n   */\n  var handleInputChange = (0, _hooks.useEventCallback)(function (value, event) {\n    if (!value) {\n      return;\n    }\n    var startDate = value[0],\n      endDate = value[1];\n    var selectValue = [startDate, endDate];\n    setHoverDateRange(selectValue);\n    setSelectedDates(selectValue);\n    setCalendarDateRange({\n      dateRange: selectValue\n    });\n    setDateRange(event, selectValue, false);\n  });\n\n  /**\n   * Check if the date is disabled\n   */\n  var isDateDisabled = (0, _useDateDisabled.default)({\n    shouldDisableDate: shouldDisableDate,\n    DEPRECATED_disabledDate: DEPRECATED_disabledDate\n  });\n\n  /**\n   * Check if a date range is disabled\n   */\n  var isRangeDisabled = function 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: target\n        })) {\n          return true;\n        }\n        start = (0, _date.addDays)(start, 1);\n      }\n    }\n    return false;\n  };\n\n  /**\n   * Check if the OK button is disabled\n   */\n  var isOkButtonDisabled = function isOkButtonDisabled() {\n    var start = selectedDates[0],\n      end = selectedDates[1];\n    if (!start || !end || !isSelectedIdle) {\n      return true;\n    }\n    if (isErrorValue([start, end])) {\n      return true;\n    }\n    return false;\n  };\n\n  /**\n   * Check if the shortcut button is disabled\n   */\n  var isShortcutDisabled = function isShortcutDisabled(value) {\n    if (value === void 0) {\n      value = [];\n    }\n    var _value = value,\n      start = _value[0],\n      end = _value[1];\n    if (!start || !end) {\n      return true;\n    }\n    return isRangeDisabled(start, end, _constants.DATERANGE_DISABLED_TARGET.TOOLBAR_SHORTCUT);\n  };\n  var handleClose = (0, _hooks.useEventCallback)(function () {\n    var _trigger$current, _trigger$current$clos;\n    (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 ? void 0 : _trigger$current$clos.call(_trigger$current);\n  });\n  var handleInputKeyDown = (0, _hooks.useEventCallback)(function (event) {\n    (0, _Picker.onMenuKeyDown)(event, {\n      esc: handleClose,\n      enter: function enter() {\n        var _trigger$current2;\n        var _ref4 = ((_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : _trigger$current2.getState()) || {},\n          open = _ref4.open;\n        if (!open) {\n          var _trigger$current3;\n          (_trigger$current3 = trigger.current) === null || _trigger$current3 === void 0 ? void 0 : _trigger$current3.open();\n        }\n      }\n    });\n  });\n  var disableCalendarDate = isDateDisabled ? function (date, values, type) {\n    return isDateDisabled(date, {\n      selectDate: values,\n      selectedDone: isSelectedIdle,\n      target: type\n    });\n  } : undefined;\n  var renderCalendarOverlay = function renderCalendarOverlay(positionProps, speakerRef) {\n    var left = positionProps.left,\n      top = positionProps.top,\n      className = positionProps.className;\n    var classes = merge(className, menuClassName, prefix('popup-daterange'));\n    var panelClasses = prefix('daterange-panel', {\n      'daterange-panel-show-one-calendar': showOneCalendar\n    });\n\n    /**\n     * Set a min-width (528px) when there are two calendars\n     * @see https://github.com/rsuite/rsuite/issues/3522\n     */\n    var panelStyles = {\n      minWidth: showOneCalendar ? 'auto' : 528\n    };\n    var styles = (0, _extends2.default)({}, menuStyle, {\n      left: left,\n      top: top\n    });\n    var calendarProps = {\n      locale: locale,\n      isoWeek: isoWeek,\n      weekStart: weekStart,\n      limitEndYear: limitEndYear,\n      showMeridian: showMeridian,\n      calendarDate: calendarDate,\n      limitStartYear: limitStartYear,\n      showWeekNumbers: showWeekNumbers,\n      format: formatStr,\n      value: selectedDates,\n      monthDropdownProps: monthDropdownProps,\n      hoverRangeValue: hoverDateRange !== null && hoverDateRange !== void 0 ? hoverDateRange : undefined,\n      hideHours: hideHours,\n      hideMinutes: hideMinutes,\n      hideSeconds: hideSeconds,\n      disabledDate: disableCalendarDate,\n      onSelect: handleSelectDate,\n      onChangeCalendarMonth: onChangeCalendarMonth,\n      onChangeCalendarTime: onChangeCalendarTime,\n      onToggleMeridian: onToggleMeridian,\n      onMouseMove: onMouseMove,\n      renderTitle: renderTitle\n    };\n    var getCalendars = function getCalendars() {\n      if (showOneCalendar) {\n        return /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n          index: activeCalendarKey === 'end' ? 1 : 0\n        }, calendarProps, {\n          __self: _this,\n          __source: {\n            fileName: _jsxFileName,\n            lineNumber: 878,\n            columnNumber: 16\n          }\n        }));\n      }\n      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n        index: 0\n      }, calendarProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 883,\n          columnNumber: 11\n        }\n      })), /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({\n        index: 1\n      }, calendarProps, {\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 884,\n          columnNumber: 11\n        }\n      })));\n    };\n    var sideRanges = (ranges === null || ranges === void 0 ? void 0 : ranges.filter(function (range) {\n      return (range === null || range === void 0 ? void 0 : range.placement) === 'left';\n    })) || [];\n    var bottomRanges = ranges === null || ranges === void 0 ? void 0 : ranges.filter(function (range) {\n      return (range === null || range === void 0 ? void 0 : range.placement) === 'bottom' || (range === null || range === void 0 ? void 0 : range.placement) === undefined;\n    });\n    return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {\n      role: \"dialog\",\n      \"aria-labelledby\": label ? id + \"-label\" : undefined,\n      tabIndex: -1,\n      className: classes,\n      ref: (0, _utils2.mergeRefs)(overlay, speakerRef),\n      target: trigger,\n      style: styles,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 895,\n        columnNumber: 7\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: panelClasses,\n      style: panelStyles,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 904,\n        columnNumber: 9\n      }\n    }, /*#__PURE__*/_react.default.createElement(_Stack.default, {\n      alignItems: \"flex-start\",\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 905,\n        columnNumber: 11\n      }\n    }, sideRanges.length > 0 && /*#__PURE__*/_react.default.createElement(_PredefinedRanges.default, {\n      direction: \"column\",\n      spacing: 0,\n      className: prefix('daterange-predefined'),\n      ranges: sideRanges,\n      calendarDate: calendarDate,\n      locale: locale,\n      disableShortcut: isShortcutDisabled,\n      onShortcutClick: handleShortcutPageDate,\n      \"data-testid\": \"daterange-predefined-side\",\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 907,\n        columnNumber: 15\n      }\n    }), /*#__PURE__*/_react.default.createElement(_Stack.default.Item, {\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 920,\n        columnNumber: 13\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix('daterange-content'),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 921,\n        columnNumber: 15\n      }\n    }, showHeader && /*#__PURE__*/_react.default.createElement(_Header.default, {\n      value: isSelectedIdle ? selectedDates : hoverDateRange,\n      formatStr: formatStr,\n      character: character,\n      clickable: showOneCalendar,\n      activeKey: activeCalendarKey,\n      onSelect: setActiveCalendarKey,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 923,\n        columnNumber: 19\n      }\n    }), /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: prefix(\"daterange-calendar-\" + (showOneCalendar ? 'single' : 'group')),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 933,\n        columnNumber: 17\n      }\n    }, /*#__PURE__*/_react.default.createElement(_DateRangePickerContext.default.Provider, {\n      value: {\n        isSelectedIdle: isSelectedIdle\n      },\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 936,\n        columnNumber: 19\n      }\n    }, getCalendars()))), /*#__PURE__*/_react.default.createElement(_Toolbar.default, {\n      locale: locale,\n      calendarDate: selectedDates,\n      disableOkBtn: isOkButtonDisabled,\n      disableShortcut: isShortcutDisabled,\n      hideOkBtn: oneTap,\n      onOk: handleClickOK,\n      onShortcutClick: handleShortcutPageDate,\n      ranges: bottomRanges,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 941,\n        columnNumber: 15\n      }\n    })))));\n  };\n  var hasValue = !(0, _isNil.default)(value) && value.length > 1;\n  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {\n      classPrefix: classPrefix,\n      name: 'daterange',\n      appearance: appearance,\n      hasValue: hasValue,\n      cleanable: cleanable\n    })),\n    classes = _usePickerClassName[0],\n    usedClassNamePropKeys = _usePickerClassName[1];\n  var caretAs = (0, _react.useMemo)(function () {\n    if (caretAsProp === null) {\n      return null;\n    }\n    return caretAsProp || ((0, _date.shouldOnlyRenderTime)(formatStr) ? _ClockO.default : _Calendar.default);\n  }, [caretAsProp, formatStr]);\n  var isErrorValue = function isErrorValue(value) {\n    if (!value) {\n      return false;\n    }\n\n    // If the value is an empty array, it is not an error value.\n    if (Array.isArray(value) && value.length === 0) {\n      return false;\n    }\n    var startDate = value[0],\n      endDate = value[1];\n    if (!(0, _date.isValid)(startDate) || !(0, _date.isValid)(endDate)) {\n      return true;\n    }\n    if ((0, _date.isBefore)(endDate, startDate)) {\n      return true;\n    }\n    var 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  var _partitionHTMLProps = (0, _utils2.partitionHTMLProps)(restProps, {\n      htmlProps: [],\n      includeAria: true\n    }),\n    ariaProps = _partitionHTMLProps[0],\n    rest = _partitionHTMLProps[1];\n  var showCleanButton = cleanable && hasValue && !readOnly;\n  var invalidValue = value && isErrorValue(value);\n  var _useCustomizedInput = (0, _useCustomizedInput2.default)({\n      mode: 'dateRange',\n      value: value,\n      formatStr: formatStr,\n      renderValue: renderValue,\n      readOnly: readOnly,\n      editable: editable,\n      loading: loading\n    }),\n    customValue = _useCustomizedInput.customValue,\n    inputReadOnly = _useCustomizedInput.inputReadOnly,\n    Input = _useCustomizedInput.Input,\n    events = _useCustomizedInput.events;\n  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {\n    trigger: \"active\",\n    ref: trigger,\n    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),\n    placement: placement,\n    onEnter: (0, _utils2.createChainedFunction)(events.onActive, handleEnter, onEnter),\n    onExit: (0, _utils2.createChainedFunction)(events.onInactive, onExit),\n    speaker: renderCalendarOverlay,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1026,\n      columnNumber: 5\n    }\n  }, /*#__PURE__*/_react.default.createElement(Component, {\n    ref: root,\n    className: merge(className, classes, (_merge = {}, _merge[prefix('error')] = invalidValue, _merge)),\n    style: style,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1035,\n      columnNumber: 7\n    }\n  }, plaintext ? /*#__PURE__*/_react.default.createElement(_DateRangeInput.default, {\n    value: value,\n    format: formatStr,\n    plaintext: plaintext,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1041,\n      columnNumber: 11\n    }\n  }) : /*#__PURE__*/_react.default.createElement(_InputGroup.default, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys, _date.calendarOnlyProps)), {\n    inside: true,\n    className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)([\"input-group\"]))),\n    disabled: disabled,\n    size: size,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1043,\n      columnNumber: 11\n    }\n  }), /*#__PURE__*/_react.default.createElement(_Picker.PickerLabel, {\n    className: prefix(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)([\"label\"]))),\n    id: id + \"-label\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1054,\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: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1057,\n      columnNumber: 13\n    }\n  })), /*#__PURE__*/_react.default.createElement(_Picker.PickerIndicator, {\n    loading: loading,\n    caretAs: caretAs,\n    onClose: handleClean,\n    showCleanButton: showCleanButton,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 1074,\n      columnNumber: 13\n    }\n  }))));\n});\nDateRangePicker.displayName = 'DateRangePicker';\nDateRangePicker.propTypes = (0, _extends2.default)({}, _Picker.pickerPropTypes, {\n  ranges: _propTypes.default.array,\n  value: _propTypes.default.arrayOf(_propTypes.default.instanceOf(Date)),\n  defaultValue: _propTypes.default.arrayOf(_propTypes.default.instanceOf(Date)),\n  defaultCalendarValue: _propTypes.default.arrayOf(_propTypes.default.instanceOf(Date)),\n  hoverRange: _propTypes.default.oneOfType([(0, _propTypes2.oneOf)(['week', 'month']), _propTypes.default.func]),\n  format: _propTypes.default.string,\n  hideHours: _propTypes.default.func,\n  hideMinutes: _propTypes.default.func,\n  hideSeconds: _propTypes.default.func,\n  isoWeek: _propTypes.default.bool,\n  weekStart: _propTypes.default.oneOf([0, 1, 2, 3, 4, 5, 6]),\n  oneTap: _propTypes.default.bool,\n  limitEndYear: _propTypes.default.number,\n  limitStartYear: _propTypes.default.number,\n  onChange: _propTypes.default.func,\n  onOk: _propTypes.default.func,\n  disabledDate: (0, _propTypes2.deprecatePropTypeNew)(_propTypes.default.func, 'Use \"shouldDisableDate\" property instead.'),\n  shouldDisableDate: _propTypes.default.func,\n  onSelect: _propTypes.default.func,\n  showWeekNumbers: _propTypes.default.bool,\n  showMeridian: _propTypes.default.bool,\n  showOneCalendar: _propTypes.default.bool\n});\nvar _default = exports[\"default\"] = DateRangePicker;\n\n//# sourceURL=webpack://rsuite/./src/DateRangePicker/DateRangePicker.tsx?");
 
 /***/ }),
 
@@ -7517,7 +7517,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\"] = useFormValidate;\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _set = _interopRequireDefault(__webpack_require__(/*! lodash/set */ \"./node_modules/lodash/set.js\"));\nvar _hooks = __webpack_require__(/*! ../../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../../FormControl/utils */ \"./src/FormControl/utils.ts\");\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == typeof i ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != typeof i) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\nfunction useFormValidate(_formError, props) {\n  var formValue = props.formValue,\n    getCombinedModel = props.getCombinedModel,\n    onCheck = props.onCheck,\n    onError = props.onError,\n    nestedField = props.nestedField;\n  var _useControlled = (0, _hooks.useControlled)(_formError, {}),\n    realFormError = _useControlled[0],\n    setFormError = _useControlled[1];\n  var checkOptions = {\n    nestedObject: nestedField\n  };\n  var realFormErrorRef = (0, _react.useRef)(realFormError);\n  realFormErrorRef.current = realFormError;\n\n  /**\n   * Validate the form data and return a boolean.\n   * The error message after verification is returned in the callback.\n   * @param callback\n   */\n  var check = (0, _hooks.useEventCallback)(function (callback) {\n    var formError = {};\n    var errorCount = 0;\n    var model = getCombinedModel();\n    var checkField = function checkField(key, type, value, formErrorObj) {\n      var checkResult = type.check(value);\n      if (checkResult.hasError === true) {\n        errorCount += 1;\n        formErrorObj[key] = (checkResult === null || checkResult === void 0 ? void 0 : checkResult.errorMessage) || checkResult;\n      }\n\n      // Check nested object\n      if (type !== null && type !== void 0 && type.objectTypeSchemaSpec) {\n        Object.entries(type.objectTypeSchemaSpec).forEach(function (_ref) {\n          var nestedKey = _ref[0],\n            nestedType = _ref[1];\n          formErrorObj[key] = formErrorObj[key] || {\n            object: {}\n          };\n          checkField(nestedKey, nestedType, value === null || value === void 0 ? void 0 : value[nestedKey], formErrorObj[key].object);\n        });\n      }\n    };\n    Object.entries(model.getSchemaSpec()).forEach(function (_ref2) {\n      var key = _ref2[0],\n        type = _ref2[1];\n      checkField(key, type, formValue[key], formError);\n    });\n    setFormError(formError);\n    onCheck === null || onCheck === void 0 ? void 0 : onCheck(formError);\n    callback === null || callback === void 0 ? void 0 : callback(formError);\n    if (errorCount > 0) {\n      onError === null || onError === void 0 ? void 0 : onError(formError);\n      return false;\n    }\n    return true;\n  });\n  var checkFieldForNextValue = (0, _hooks.useEventCallback)(function (fieldName, nextValue, callback) {\n    var model = getCombinedModel();\n    var resultOfCurrentField = model.checkForField(fieldName, nextValue, checkOptions);\n    var nextFormError = (0, _extends2.default)({}, realFormError);\n    /**\n     * when using proxy of schema-typed, we need to use getCheckResult to get all errors,\n     * but if nestedField is used, it is impossible to distinguish whether the nested object has an error here,\n     * so nestedField does not support proxy here\n     */\n    if (nestedField) {\n      nextFormError = (0, _set.default)(nextFormError, (0, _utils.nameToPath)(fieldName), resultOfCurrentField);\n      setFormError(nextFormError);\n      onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);\n      callback === null || callback === void 0 ? void 0 : callback(resultOfCurrentField);\n      if (resultOfCurrentField.hasError) {\n        onError === null || onError === void 0 ? void 0 : onError(nextFormError);\n      }\n      return !resultOfCurrentField.hasError;\n    } else {\n      var allResults = model.getCheckResult();\n      var hasError = false;\n      Object.keys(allResults).forEach(function (key) {\n        var currentResult = allResults[key];\n        if (currentResult.hasError) {\n          nextFormError[key] = currentResult.errorMessage || currentResult;\n          hasError = true;\n        } else {\n          // eslint-disable-next-line @typescript-eslint/no-unused-vars\n          var _nextFormError = nextFormError,\n            _ = _nextFormError[key],\n            rest = (0, _objectWithoutPropertiesLoose2.default)(_nextFormError, [key].map(_toPropertyKey));\n          nextFormError = rest;\n        }\n      });\n      setFormError(nextFormError);\n      onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);\n      callback === null || callback === void 0 ? void 0 : callback(resultOfCurrentField);\n      if (hasError) {\n        onError === null || onError === void 0 ? void 0 : onError(nextFormError);\n      }\n      return !hasError;\n    }\n  });\n  /**\n   * Check the data field\n   * @param fieldName\n   * @param callback\n   */\n  var checkForField = (0, _hooks.useEventCallback)(function (fieldName, callback) {\n    return checkFieldForNextValue(fieldName, formValue || {}, callback);\n  });\n\n  /**\n   * Check form data asynchronously and return a Promise\n   */\n  var checkAsync = (0, _hooks.useEventCallback)(function () {\n    var promises = [];\n    var keys = [];\n    var model = getCombinedModel();\n    Object.keys(model.getSchemaSpec()).forEach(function (key) {\n      keys.push(key);\n      promises.push(model.checkForFieldAsync(key, formValue || {}, checkOptions));\n    });\n    return Promise.all(promises).then(function (values) {\n      var formError = {};\n      var errorCount = 0;\n      for (var i = 0; i < values.length; i++) {\n        if (values[i].hasError) {\n          errorCount += 1;\n          formError[keys[i]] = values[i].errorMessage;\n        }\n      }\n      onCheck === null || onCheck === void 0 ? void 0 : onCheck(formError);\n      setFormError(formError);\n      if (errorCount > 0) {\n        onError === null || onError === void 0 ? void 0 : onError(formError);\n      }\n      return {\n        hasError: errorCount > 0,\n        formError: formError\n      };\n    });\n  });\n  var checkFieldAsyncForNextValue = (0, _hooks.useEventCallback)(function (fieldName, nextValue) {\n    var model = getCombinedModel();\n    return model.checkForFieldAsync(fieldName, nextValue, checkOptions).then(function (resultOfCurrentField) {\n      var nextFormError = (0, _extends2.default)({}, realFormError);\n      /**\n       * when using proxy of schema-typed, we need to use getCheckResult to get all errors,\n       * but if nestedField is used, it is impossible to distinguish whether the nested object has an error here,\n       * so nestedField does not support proxy here\n       */\n\n      if (nestedField) {\n        nextFormError = (0, _set.default)(nextFormError, (0, _utils.nameToPath)(fieldName), resultOfCurrentField);\n        onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);\n        setFormError(nextFormError);\n        if (resultOfCurrentField.hasError) {\n          onError === null || onError === void 0 ? void 0 : onError(nextFormError);\n        }\n        return resultOfCurrentField;\n      } else {\n        var allResults = model.getCheckResult();\n        var hasError = false;\n        Object.keys(allResults).forEach(function (key) {\n          var currentResult = allResults[key];\n          if (currentResult.hasError) {\n            nextFormError[key] = currentResult.errorMessage || currentResult;\n            hasError = true;\n          } else {\n            // eslint-disable-next-line @typescript-eslint/no-unused-vars\n            var _nextFormError2 = nextFormError,\n              _ = _nextFormError2[key],\n              rest = (0, _objectWithoutPropertiesLoose2.default)(_nextFormError2, [key].map(_toPropertyKey));\n            nextFormError = rest;\n          }\n        });\n        setFormError(nextFormError);\n        onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);\n        if (hasError) {\n          onError === null || onError === void 0 ? void 0 : onError(nextFormError);\n        }\n        return resultOfCurrentField;\n      }\n    });\n  });\n\n  /**\n   * Asynchronously check form fields and return Promise\n   * @param fieldName\n   */\n  var checkForFieldAsync = (0, _hooks.useEventCallback)(function (fieldName) {\n    return checkFieldAsyncForNextValue(fieldName, formValue || {});\n  });\n  var onRemoveError = (0, _react.useCallback)(function (name) {\n    /**\n     * when this function is called when the children component is unmount,\n     * it's an old render frame so use Ref to get future error\n     */\n    var formError = (0, _omit.default)(realFormErrorRef.current, [nestedField ? (0, _utils.nameToPath)(name) : name]);\n    realFormErrorRef.current = formError;\n    setFormError(formError);\n    onCheck === null || onCheck === void 0 ? void 0 : onCheck(formError);\n    return formError;\n  }, [nestedField, onCheck, setFormError]);\n  var cleanErrors = (0, _hooks.useEventCallback)(function () {\n    setFormError({});\n  });\n  var resetErrors = (0, _hooks.useEventCallback)(function (formError) {\n    if (formError === void 0) {\n      formError = {};\n    }\n    setFormError(formError);\n  });\n  var cleanErrorForField = (0, _hooks.useEventCallback)(function (fieldName) {\n    setFormError((0, _omit.default)(realFormError, [nestedField ? (0, _utils.nameToPath)(fieldName) : fieldName]));\n  });\n  return {\n    formError: realFormError,\n    check: check,\n    checkForField: checkForField,\n    checkFieldForNextValue: checkFieldForNextValue,\n    checkAsync: checkAsync,\n    checkForFieldAsync: checkForFieldAsync,\n    checkFieldAsyncForNextValue: checkFieldAsyncForNextValue,\n    cleanErrors: cleanErrors,\n    resetErrors: resetErrors,\n    cleanErrorForField: cleanErrorForField,\n    onRemoveError: onRemoveError\n  };\n}\n\n//# sourceURL=webpack://rsuite/./src/Form/hooks/useFormValidate.ts?");
+eval("\n\nvar _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ \"./node_modules/@babel/runtime/helpers/interopRequireDefault.js\");\nexports.__esModule = true;\nexports[\"default\"] = useFormValidate;\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutPropertiesLoose */ \"./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js\"));\nvar _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ \"./node_modules/@babel/runtime/helpers/extends.js\"));\nvar _react = __webpack_require__(/*! react */ \"react\");\nvar _omit = _interopRequireDefault(__webpack_require__(/*! lodash/omit */ \"./node_modules/lodash/omit.js\"));\nvar _set = _interopRequireDefault(__webpack_require__(/*! lodash/set */ \"./node_modules/lodash/set.js\"));\nvar _hooks = __webpack_require__(/*! ../../internals/hooks */ \"./src/internals/hooks/index.ts\");\nvar _utils = __webpack_require__(/*! ../../FormControl/utils */ \"./src/FormControl/utils.ts\");\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == typeof i ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != typeof i) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\nfunction useFormValidate(_formError, props) {\n  var formValue = props.formValue,\n    getCombinedModel = props.getCombinedModel,\n    onCheck = props.onCheck,\n    onError = props.onError,\n    nestedField = props.nestedField;\n  var _useControlled = (0, _hooks.useControlled)(_formError, {}),\n    realFormError = _useControlled[0],\n    setFormError = _useControlled[1];\n  var checkOptions = {\n    nestedObject: nestedField\n  };\n  var realFormErrorRef = (0, _react.useRef)(realFormError);\n  realFormErrorRef.current = realFormError;\n\n  /**\n   * Validate the form data and return a boolean.\n   * The error message after verification is returned in the callback.\n   * @param callback\n   */\n  var check = (0, _hooks.useEventCallback)(function (callback) {\n    var formError = {};\n    var errorCount = 0;\n    var model = getCombinedModel();\n    var checkField = function checkField(key, type, value, formErrorObj) {\n      model.setSchemaOptionsForAllType(formValue || {});\n      var checkResult = type.check(value, formValue, key);\n      if (checkResult.hasError === true) {\n        errorCount += 1;\n        formErrorObj[key] = (checkResult === null || checkResult === void 0 ? void 0 : checkResult.errorMessage) || checkResult;\n      }\n\n      // Check nested object\n      if (type !== null && type !== void 0 && type.objectTypeSchemaSpec) {\n        Object.entries(type.objectTypeSchemaSpec).forEach(function (_ref) {\n          var nestedKey = _ref[0],\n            nestedType = _ref[1];\n          formErrorObj[key] = formErrorObj[key] || {\n            object: {}\n          };\n          checkField(nestedKey, nestedType, value === null || value === void 0 ? void 0 : value[nestedKey], formErrorObj[key].object);\n        });\n      }\n    };\n    Object.entries(model.getSchemaSpec()).forEach(function (_ref2) {\n      var key = _ref2[0],\n        type = _ref2[1];\n      checkField(key, type, formValue[key], formError);\n    });\n    setFormError(formError);\n    onCheck === null || onCheck === void 0 ? void 0 : onCheck(formError);\n    callback === null || callback === void 0 ? void 0 : callback(formError);\n    if (errorCount > 0) {\n      onError === null || onError === void 0 ? void 0 : onError(formError);\n      return false;\n    }\n    return true;\n  });\n  var checkFieldForNextValue = (0, _hooks.useEventCallback)(function (fieldName, nextValue, callback) {\n    var model = getCombinedModel();\n    var resultOfCurrentField = model.checkForField(fieldName, nextValue, checkOptions);\n    var nextFormError = (0, _extends2.default)({}, realFormError);\n    /**\n     * when using proxy of schema-typed, we need to use getCheckResult to get all errors,\n     * but if nestedField is used, it is impossible to distinguish whether the nested object has an error here,\n     * so nestedField does not support proxy here\n     */\n    if (nestedField) {\n      nextFormError = (0, _set.default)(nextFormError, (0, _utils.nameToPath)(fieldName), resultOfCurrentField);\n      setFormError(nextFormError);\n      onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);\n      callback === null || callback === void 0 ? void 0 : callback(resultOfCurrentField);\n      if (resultOfCurrentField.hasError) {\n        onError === null || onError === void 0 ? void 0 : onError(nextFormError);\n      }\n      return !resultOfCurrentField.hasError;\n    } else {\n      var allResults = model.getCheckResult();\n      var hasError = false;\n      Object.keys(allResults).forEach(function (key) {\n        var currentResult = allResults[key];\n        if (currentResult.hasError) {\n          nextFormError[key] = currentResult.errorMessage || currentResult;\n          hasError = true;\n        } else {\n          // eslint-disable-next-line @typescript-eslint/no-unused-vars\n          var _nextFormError = nextFormError,\n            _ = _nextFormError[key],\n            rest = (0, _objectWithoutPropertiesLoose2.default)(_nextFormError, [key].map(_toPropertyKey));\n          nextFormError = rest;\n        }\n      });\n      setFormError(nextFormError);\n      onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);\n      callback === null || callback === void 0 ? void 0 : callback(resultOfCurrentField);\n      if (hasError) {\n        onError === null || onError === void 0 ? void 0 : onError(nextFormError);\n      }\n      return !hasError;\n    }\n  });\n  /**\n   * Check the data field\n   * @param fieldName\n   * @param callback\n   */\n  var checkForField = (0, _hooks.useEventCallback)(function (fieldName, callback) {\n    return checkFieldForNextValue(fieldName, formValue || {}, callback);\n  });\n\n  /**\n   * Check form data asynchronously and return a Promise\n   */\n  var checkAsync = (0, _hooks.useEventCallback)(function () {\n    var promises = [];\n    var keys = [];\n    var model = getCombinedModel();\n    Object.keys(model.getSchemaSpec()).forEach(function (key) {\n      keys.push(key);\n      promises.push(model.checkForFieldAsync(key, formValue || {}, checkOptions));\n    });\n    return Promise.all(promises).then(function (values) {\n      var formError = {};\n      var errorCount = 0;\n      for (var i = 0; i < values.length; i++) {\n        if (values[i].hasError) {\n          errorCount += 1;\n          formError[keys[i]] = values[i].errorMessage;\n        }\n      }\n      onCheck === null || onCheck === void 0 ? void 0 : onCheck(formError);\n      setFormError(formError);\n      if (errorCount > 0) {\n        onError === null || onError === void 0 ? void 0 : onError(formError);\n      }\n      return {\n        hasError: errorCount > 0,\n        formError: formError\n      };\n    });\n  });\n  var checkFieldAsyncForNextValue = (0, _hooks.useEventCallback)(function (fieldName, nextValue) {\n    var model = getCombinedModel();\n    return model.checkForFieldAsync(fieldName, nextValue, checkOptions).then(function (resultOfCurrentField) {\n      var nextFormError = (0, _extends2.default)({}, realFormError);\n      /**\n       * when using proxy of schema-typed, we need to use getCheckResult to get all errors,\n       * but if nestedField is used, it is impossible to distinguish whether the nested object has an error here,\n       * so nestedField does not support proxy here\n       */\n\n      if (nestedField) {\n        nextFormError = (0, _set.default)(nextFormError, (0, _utils.nameToPath)(fieldName), resultOfCurrentField);\n        onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);\n        setFormError(nextFormError);\n        if (resultOfCurrentField.hasError) {\n          onError === null || onError === void 0 ? void 0 : onError(nextFormError);\n        }\n        return resultOfCurrentField;\n      } else {\n        var allResults = model.getCheckResult();\n        var hasError = false;\n        Object.keys(allResults).forEach(function (key) {\n          var currentResult = allResults[key];\n          if (currentResult.hasError) {\n            nextFormError[key] = currentResult.errorMessage || currentResult;\n            hasError = true;\n          } else {\n            // eslint-disable-next-line @typescript-eslint/no-unused-vars\n            var _nextFormError2 = nextFormError,\n              _ = _nextFormError2[key],\n              rest = (0, _objectWithoutPropertiesLoose2.default)(_nextFormError2, [key].map(_toPropertyKey));\n            nextFormError = rest;\n          }\n        });\n        setFormError(nextFormError);\n        onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);\n        if (hasError) {\n          onError === null || onError === void 0 ? void 0 : onError(nextFormError);\n        }\n        return resultOfCurrentField;\n      }\n    });\n  });\n\n  /**\n   * Asynchronously check form fields and return Promise\n   * @param fieldName\n   */\n  var checkForFieldAsync = (0, _hooks.useEventCallback)(function (fieldName) {\n    return checkFieldAsyncForNextValue(fieldName, formValue || {});\n  });\n  var onRemoveError = (0, _react.useCallback)(function (name) {\n    /**\n     * when this function is called when the children component is unmount,\n     * it's an old render frame so use Ref to get future error\n     */\n    var formError = (0, _omit.default)(realFormErrorRef.current, [nestedField ? (0, _utils.nameToPath)(name) : name]);\n    realFormErrorRef.current = formError;\n    setFormError(formError);\n    onCheck === null || onCheck === void 0 ? void 0 : onCheck(formError);\n    return formError;\n  }, [nestedField, onCheck, setFormError]);\n  var cleanErrors = (0, _hooks.useEventCallback)(function () {\n    setFormError({});\n  });\n  var resetErrors = (0, _hooks.useEventCallback)(function (formError) {\n    if (formError === void 0) {\n      formError = {};\n    }\n    setFormError(formError);\n  });\n  var cleanErrorForField = (0, _hooks.useEventCallback)(function (fieldName) {\n    setFormError((0, _omit.default)(realFormError, [nestedField ? (0, _utils.nameToPath)(fieldName) : fieldName]));\n  });\n  return {\n    formError: realFormError,\n    check: check,\n    checkForField: checkForField,\n    checkFieldForNextValue: checkFieldForNextValue,\n    checkAsync: checkAsync,\n    checkForFieldAsync: checkForFieldAsync,\n    checkFieldAsyncForNextValue: checkFieldAsyncForNextValue,\n    cleanErrors: cleanErrors,\n    resetErrors: resetErrors,\n    cleanErrorForField: cleanErrorForField,\n    onRemoveError: onRemoveError\n  };\n}\n\n//# sourceURL=webpack://rsuite/./src/Form/hooks/useFormValidate.ts?");
 
 /***/ }),