rsuite 5.61.0 → 5.62.1

package/esm/DateRangePicker/Calendar.d.ts

@@ -1,10 +1,10 @@
 import React from 'react';
+import { DATERANGE_DISABLED_TARGET } from '../internals/constants';
 import { CalendarProps as CalendarCoreProps } from '../Calendar/CalendarContainer';
 import { DateRange } from './types';
-import { RsRefForwardingComponent, WithAsProps } from '../@types/common';
+import { RsRefForwardingComponent, WithAsProps } from '../internals/types';
 import { DatePickerLocale } from '../locales';
-import { DATERANGE_DISABLED_TARGET } from '../utils';
-declare type OmitCalendarCoreTypes = 'disabledDate' | 'onSelect' | 'onMouseMove' | 'calendarDate' | 'format' | 'locale' | 'onToggleMeridian';
+type OmitCalendarCoreTypes = 'disabledDate' | 'onSelect' | 'onMouseMove' | 'calendarDate' | 'format' | 'locale' | 'onToggleMeridian';
 export interface CalendarProps extends WithAsProps, Omit<CalendarCoreProps, OmitCalendarCoreTypes> {
     calendarDate?: DateRange;
     disabledDate?: (date: Date, selectValue: [] | [Date] | [Date, Date], type: DATERANGE_DISABLED_TARGET) => boolean;
@@ -12,6 +12,7 @@ export interface CalendarProps extends WithAsProps, Omit<CalendarCoreProps, Omit
     hoverRangeValue?: DateRange;
     index: number;
     isoWeek?: boolean;
+    weekStart?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
     limitEndYear?: number;
     limitStartYear?: number;
     locale?: DatePickerLocale;

package/esm/DateRangePicker/Calendar.js

@@ -1,11 +1,12 @@
 'use client';
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+var _excluded = ["as", "calendarDate", "format", "disabledDate", "index", "limitEndYear", "limitStartYear", "onChangeCalendarMonth", "onChangeCalendarTime", "onToggleMeridian", "onSelect", "value"];
 import React from 'react';
-import PropTypes from 'prop-types';
-import { addMonths } from '../utils/dateUtils';
-import CalendarCore from '../Calendar/CalendarContainer';
-import { DATERANGE_DISABLED_TARGET, useEventCallback } from '../utils';
+import { addMonths } from "../internals/utils/date/index.js";
+import { DATERANGE_DISABLED_TARGET } from "../internals/constants/index.js";
+import { useEventCallback } from "../internals/hooks/index.js";
+import CalendarCore from "../Calendar/CalendarContainer.js";
 var Calendar = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _props$as = props.as,
     Component = _props$as === void 0 ? CalendarCore : _props$as,
@@ -24,7 +25,7 @@ var Calendar = /*#__PURE__*/React.forwardRef(function (props, ref) {
     onSelect = props.onSelect,
     _props$value = props.value,
     value = _props$value === void 0 ? [] : _props$value,
-    rest = _objectWithoutPropertiesLoose(props, ["as", "calendarDate", "format", "disabledDate", "index", "limitEndYear", "limitStartYear", "onChangeCalendarMonth", "onChangeCalendarTime", "onToggleMeridian", "onSelect", "value"]);
+    rest = _objectWithoutPropertiesLoose(props, _excluded);
   var onMoveForward = useEventCallback(function (nextPageDate) {
     onChangeCalendarMonth === null || onChangeCalendarMonth === void 0 ? void 0 : onChangeCalendarMonth(index, nextPageDate);
   });
@@ -75,19 +76,4 @@ var Calendar = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }));
 });
 Calendar.displayName = 'DateRangePicker.Calendar';
-Calendar.propTypes = {
-  value: PropTypes.arrayOf(PropTypes.instanceOf(Date)),
-  hoverValue: PropTypes.arrayOf(PropTypes.instanceOf(Date)),
-  calendarDate: PropTypes.arrayOf(PropTypes.instanceOf(Date)),
-  index: PropTypes.number,
-  format: PropTypes.string,
-  isoWeek: PropTypes.bool,
-  limitEndYear: PropTypes.number,
-  limitStartYear: PropTypes.number,
-  classPrefix: PropTypes.string,
-  disabledDate: PropTypes.func,
-  onSelect: PropTypes.func,
-  onMouseMove: PropTypes.func,
-  onChangeCalendarMonth: PropTypes.func
-};
 export default Calendar;

package/esm/DateRangePicker/DateRangePicker.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { FormControlBaseProps, PickerBaseProps } from '../@types/common';
+import { FormControlBaseProps, PickerBaseProps } from '../internals/types';
 import { DateRangePickerLocale } from '../locales';
 import { PickerComponent } from '../internals/Picker';
 import { DisabledDateFunction, RangeType, DateRange } from './types';
@@ -33,6 +33,13 @@ export interface DateRangePickerProps extends PickerBaseProps<DateRangePickerLoc
      * @see https://en.wikipedia.org/wiki/ISO_week_date
      */
     isoWeek?: boolean;
+    /**
+     * The index of the first day of the week (0 - Sunday)
+     * If `isoWeek` is `true`, the value of `weekStart` is ignored.
+     *
+     * @default 0
+     */
+    weekStart?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
     /**
      * A label displayed at the beginning of toggle button
      */

package/esm/DateRangePicker/DateRangePicker.js

@@ -3,29 +3,31 @@ import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTempla
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 var _templateObject;
+var _excluded = ["as", "classPrefix", "className", "appearance", "editable", "cleanable", "character", "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", "onChange", "onClean", "onEnter", "onExit", "onOk", "onSelect", "onShortcutClick", "renderTitle", "renderValue"];
 import React, { useEffect, useRef, useState, useMemo } from 'react';
 import isNil from 'lodash/isNil';
 import omit from 'lodash/omit';
-import partial from 'lodash/partial';
 import pick from 'lodash/pick';
 import PropTypes from 'prop-types';
 import IconCalendar from '@rsuite/icons/legacy/Calendar';
 import IconClockO from '@rsuite/icons/legacy/ClockO';
-import Toolbar from '../DatePicker/Toolbar';
-import PredefinedRanges from '../DatePicker/PredefinedRanges';
-import Stack from '../Stack';
-import { omitTriggerPropKeys, PickerPopup, pickerPropTypes, PickerToggleTrigger, PickerIndicator, PickerLabel, pickTriggerPropKeys, usePickerClassName, usePickerRef, onMenuKeyDown } from '../internals/Picker';
-import { createChainedFunction, DATERANGE_DISABLED_TARGET as TARGET, mergeRefs, useClassNames, useControlled, useCustom, useUniqueId, useEventCallback, partitionHTMLProps, getStringLength } from '../utils';
-import { addMonths, isValid, isBefore, isSameDay, addDays, startOfDay, endOfDay, shouldRenderTime, isAfter, copyTime, isSameMonth, shouldRenderMonth, shouldRenderDate, reverseDateRangeOmitTime, getReversedTimeMeridian, calendarOnlyProps, shouldOnlyRenderTime } from '../utils/dateUtils';
-import Calendar from './Calendar';
-import { getSafeCalendarDate, getMonthHoverRange, getWeekHoverRange, isSameRange } from './utils';
-import { deprecatePropTypeNew, oneOf } from '../internals/propTypes';
-import DateRangePickerContext from './DateRangePickerContext';
-import DateRangeInput from '../DateRangeInput';
-import Input from '../Input';
-import InputGroup from '../InputGroup';
-import Header from './Header';
-import useDateDisabled from './hooks/useDateDisabled';
+import Toolbar from "../DatePicker/Toolbar.js";
+import PredefinedRanges from "../DatePicker/PredefinedRanges.js";
+import Stack from "../Stack/index.js";
+import { DATERANGE_DISABLED_TARGET as TARGET } from "../internals/constants/index.js";
+import { omitTriggerPropKeys, PickerPopup, pickerPropTypes, PickerToggleTrigger, PickerIndicator, PickerLabel, pickTriggerPropKeys, usePickerClassName, usePickerRef, onMenuKeyDown } from "../internals/Picker/index.js";
+import { useClassNames, useControlled, useCustom, useUniqueId, useEventCallback } from "../internals/hooks/index.js";
+import { createChainedFunction, mergeRefs, partitionHTMLProps, getStringLength } from "../internals/utils/index.js";
+import { addMonths, isValid, isBefore, isSameDay, addDays, startOfDay, endOfDay, shouldRenderTime, isAfter, isSameMonth, shouldRenderMonth, shouldRenderDate, calendarOnlyProps, getReversedTimeMeridian, reverseDateRangeOmitTime, copyTime, shouldOnlyRenderTime } from "../internals/utils/date/index.js";
+import Calendar from "./Calendar.js";
+import { getSafeCalendarDate, getMonthHoverRange, getWeekHoverRange, isSameRange } from "./utils.js";
+import { deprecatePropTypeNew, oneOf } from "../internals/propTypes/index.js";
+import DateRangePickerContext from "./DateRangePickerContext.js";
+import DateRangeInput from "../DateRangeInput/index.js";
+import InputGroup from "../InputGroup/index.js";
+import Header from "./Header.js";
+import useDateDisabled from "./hooks/useDateDisabled.js";
+import useCustomizedInput from "../DatePicker/hooks/useCustomizedInput.js";
 /**
  * A date range picker allows you to select a date range from a calendar.
  *
@@ -58,6 +60,8 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     idProp = props.id,
     _props$isoWeek = props.isoWeek,
     isoWeek = _props$isoWeek === void 0 ? false : _props$isoWeek,
+    _props$weekStart = props.weekStart,
+    weekStart = _props$weekStart === void 0 ? 0 : _props$weekStart,
     _props$limitEndYear = props.limitEndYear,
     limitEndYear = _props$limitEndYear === void 0 ? 1000 : _props$limitEndYear,
     limitStartYear = props.limitStartYear,
@@ -86,14 +90,13 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     onChange = props.onChange,
     onClean = props.onClean,
     onEnter = props.onEnter,
-    onEntered = props.onEntered,
-    onExited = props.onExited,
+    onExit = props.onExit,
     onOk = props.onOk,
     onSelect = props.onSelect,
     onShortcutClick = props.onShortcutClick,
     renderTitle = props.renderTitle,
     renderValue = props.renderValue,
-    restProps = _objectWithoutPropertiesLoose(props, ["as", "classPrefix", "className", "appearance", "editable", "cleanable", "character", "defaultCalendarValue", "defaultValue", "plaintext", "disabled", "disabledDate", "shouldDisableDate", "format", "hoverRange", "id", "isoWeek", "limitEndYear", "limitStartYear", "locale", "loading", "label", "menuClassName", "menuStyle", "oneTap", "placeholder", "placement", "ranges", "readOnly", "showOneCalendar", "showWeekNumbers", "showMeridian", "showHeader", "style", "size", "caretAs", "value", "onChange", "onClean", "onEnter", "onEntered", "onExited", "onOk", "onSelect", "onShortcutClick", "renderTitle", "renderValue"]);
+    restProps = _objectWithoutPropertiesLoose(props, _excluded);
   var id = useUniqueId('rs-', idProp);
   var _usePickerRef = usePickerRef(ref),
     trigger = _usePickerRef.trigger,
@@ -105,12 +108,16 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     prefix = _useClassNames.prefix;
   var _useCustom = useCustom('DateRangePicker', overrideLocale),
     locale = _useCustom.locale,
-    formatDate = _useCustom.formatDate; // Default gap between two calendars, if `showOneCalendar` is set, the gap is 0
+    formatDate = _useCustom.formatDate;
+
+  // Default gap between two calendars, if `showOneCalendar` is set, the gap is 0
   var calendarGap = showOneCalendar ? 0 : 1;
   var rangeFormatStr = "" + formatStr + character + formatStr;
   var _useControlled = useControlled(valueProp, defaultValue !== null && defaultValue !== void 0 ? defaultValue : null),
     value = _useControlled[0],
-    setValue = _useControlled[1]; // Show only the calendar month panel. formatStr = 'yyyy-MM'
+    setValue = _useControlled[1];
+
+  // Show only the calendar month panel. formatStr = 'yyyy-MM'
   var onlyShowMonth = shouldRenderMonth(formatStr) && !shouldRenderDate(formatStr);
 
   /**
@@ -122,6 +129,7 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _useState = useState(true),
     isSelectedIdle = _useState[0],
     setSelectedIdle = _useState[1];
+
   /**
    * The currently selected date range.
    *
@@ -132,15 +140,20 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
    */
   var _useState2 = useState((_ref = valueProp !== null && valueProp !== void 0 ? valueProp : defaultValue) !== null && _ref !== void 0 ? _ref : []),
     selectedDates = _useState2[0],
-    setSelectedDates = _useState2[1]; // The date of the current hover, used to reduce the calculation of `handleMouseMove`
+    setSelectedDates = _useState2[1];
+
+  // The date of the current hover, used to reduce the calculation of `handleMouseMove`
   var _useState3 = useState(value),
     hoverDateRange = _useState3[0],
-    setHoverDateRange = _useState3[1]; // The displayed calendar panel is rendered based on this value.
+    setHoverDateRange = _useState3[1];
+
+  // The displayed calendar panel is rendered based on this value.
   var _useState4 = useState(getSafeCalendarDate({
       value: (_ref2 = value !== null && value !== void 0 ? value : defaultCalendarValue) !== null && _ref2 !== void 0 ? _ref2 : null
     })),
     calendarDate = _useState4[0],
     setCalendarDate = _useState4[1];
+
   /**
    * When hoverRange is set, `selectValue` will be updated during the hover process,
    * which will cause the `selectValue` to be updated after the first click,
@@ -156,6 +169,7 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _useState5 = useState(),
     activeCalendarKey = _useState5[0],
     setActiveCalendarKey = _useState5[1];
+
   /**
    * Get the time on the calendar.
    */
@@ -176,15 +190,15 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
 
     // The time should remain the same when the dates in the date range are changed.
     if (shouldRenderTime(formatStr) && dateRange !== null && dateRange !== void 0 && dateRange.length && (eventName === 'changeDate' || eventName === 'changeMonth')) {
-      var _startDate = copyTime({
+      var startDate = copyTime({
         from: getCalendarDatetime('start'),
         to: dateRange[0]
       });
-      var _endDate = copyTime({
+      var endDate = copyTime({
         from: getCalendarDatetime('end'),
-        to: dateRange.length === 1 ? addMonths(_startDate, calendarGap) : dateRange[1]
+        to: dateRange.length === 1 ? addMonths(startDate, calendarGap) : dateRange[1]
       });
-      nextValue = [_startDate, _endDate];
+      nextValue = [startDate, endDate];
     } else if (dateRange === null && typeof defaultCalendarValue !== 'undefined') {
       // Make the calendar render the value of defaultCalendarValue after clearing the value.
       nextValue = defaultCalendarValue;
@@ -210,9 +224,9 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     var padding = 4;
     var strings = rangeFormatStr;
     if (value) {
-      var _startDate2 = value[0],
-        _endDate2 = value[1];
-      strings = "" + formatDate(_startDate2, formatStr) + character + formatDate(_endDate2, formatStr);
+      var startDate = value[0],
+        endDate = value[1];
+      strings = "" + formatDate(startDate, formatStr) + character + formatDate(endDate, formatStr);
     }
     return getStringLength(strings) + padding;
   };
@@ -223,7 +237,13 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var getHoverRangeValue = function getHoverRangeValue(date) {
     function getHoverRangeFunc() {
       if (hoverRange === 'week') {
-        return partial(getWeekHoverRange, isoWeek);
+        return function (date) {
+          return getWeekHoverRange(date, {
+            isoWeek: isoWeek,
+            weekStart: weekStart,
+            locale: locale === null || locale === void 0 ? void 0 : locale.dateLocale
+          });
+        };
       } else if (hoverRange === 'month') {
         return getMonthHoverRange;
       }
@@ -416,9 +436,9 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var handleEnter = useEventCallback(function () {
     var nextCalendarDate;
     if (value && value.length) {
-      var _startDate3 = value[0],
+      var startDate = value[0],
         endData = value[1];
-      nextCalendarDate = [_startDate3, isSameMonth(_startDate3, endData) ? addMonths(endData, calendarGap) : endData];
+      nextCalendarDate = [startDate, isSameMonth(startDate, endData) ? addMonths(endData, calendarGap) : endData];
     } else {
       // Reset the date on the calendar to the default date
       nextCalendarDate = getSafeCalendarDate({
@@ -453,7 +473,7 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     // End unfinished selections.
     setSelectedIdle(true);
   });
-  var handleOK = useEventCallback(function (event) {
+  var handleClickOK = useEventCallback(function (event) {
     setDateRange(event, selectedDates);
     onOk === null || onOk === void 0 ? void 0 : onOk(selectedDates, event);
   });
@@ -481,13 +501,21 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     setCalendarDateRange({
       dateRange: selectValue
     });
-    setDateRange(event, selectValue);
+    setDateRange(event, selectValue, false);
   });
+
+  /**
+   * Check if the date is disabled
+   */
   var isDateDisabled = useDateDisabled({
     shouldDisableDate: shouldDisableDate,
     DEPRECATED_disabledDate: DEPRECATED_disabledDate
   });
-  var disableByRange = function disableByRange(start, end, target) {
+
+  /**
+   * Check if a date range is disabled
+   */
+  var isRangeDisabled = function isRangeDisabled(start, end, target) {
     if (isDateDisabled) {
       // If the date is between the start and the end the button is disabled
       while (isBefore(start, end) || isSameDay(start, end)) {
@@ -503,20 +531,26 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     }
     return false;
   };
-  var disableOkButton = function disableOkButton() {
-    var _trigger$current;
-    var _ref4 = ((_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : _trigger$current.getState()) || {},
-      open = _ref4.open;
-    if (open) {
-      var start = selectedDates[0],
-        end = selectedDates[1];
-      if (!start || !end || !isSelectedIdle) {
-        return true;
-      }
+
+  /**
+   * Check if the OK button is disabled
+   */
+  var isOkButtonDisabled = function isOkButtonDisabled() {
+    var start = selectedDates[0],
+      end = selectedDates[1];
+    if (!start || !end || !isSelectedIdle) {
+      return true;
+    }
+    if (isErrorValue([start, end])) {
+      return true;
     }
     return false;
   };
-  var disableShortcut = function disableShortcut(value) {
+
+  /**
+   * Check if the shortcut button is disabled
+   */
+  var isShortcutDisabled = function isShortcutDisabled(value) {
     if (value === void 0) {
       value = [];
     }
@@ -526,22 +560,22 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     if (!start || !end) {
       return true;
     }
-    return disableByRange(start, end, TARGET.TOOLBAR_SHORTCUT);
+    return isRangeDisabled(start, end, TARGET.TOOLBAR_SHORTCUT);
   };
   var handleClose = useEventCallback(function () {
-    var _trigger$current2, _trigger$current2$clo;
-    (_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : (_trigger$current2$clo = _trigger$current2.close) === null || _trigger$current2$clo === void 0 ? void 0 : _trigger$current2$clo.call(_trigger$current2);
+    var _trigger$current, _trigger$current$clos;
+    (_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);
   });
   var handleInputKeyDown = useEventCallback(function (event) {
     onMenuKeyDown(event, {
       esc: handleClose,
       enter: function enter() {
-        var _trigger$current3;
-        var _ref5 = ((_trigger$current3 = trigger.current) === null || _trigger$current3 === void 0 ? void 0 : _trigger$current3.getState()) || {},
-          open = _ref5.open;
+        var _trigger$current2;
+        var _ref4 = ((_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : _trigger$current2.getState()) || {},
+          open = _ref4.open;
         if (!open) {
-          var _trigger$current4;
-          (_trigger$current4 = trigger.current) === null || _trigger$current4 === void 0 ? void 0 : _trigger$current4.open();
+          var _trigger$current3;
+          (_trigger$current3 = trigger.current) === null || _trigger$current3 === void 0 ? void 0 : _trigger$current3.open();
         }
       }
     });
@@ -576,6 +610,7 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     var calendarProps = {
       locale: locale,
       isoWeek: isoWeek,
+      weekStart: weekStart,
       limitEndYear: limitEndYear,
       showMeridian: showMeridian,
       calendarDate: calendarDate,
@@ -630,7 +665,7 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
       ranges: sideRanges,
       calendarDate: calendarDate,
       locale: locale,
-      disableShortcut: disableShortcut,
+      disableShortcut: isShortcutDisabled,
       onShortcutClick: handleShortcutPageDate,
       "data-testid": "daterange-predefined-side"
     }), /*#__PURE__*/React.createElement(Stack.Item, null, /*#__PURE__*/React.createElement("div", {
@@ -651,10 +686,10 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     }, getCalendars()))), /*#__PURE__*/React.createElement(Toolbar, {
       locale: locale,
       calendarDate: selectedDates,
-      disableOkBtn: disableOkButton,
-      disableShortcut: disableShortcut,
+      disableOkBtn: isOkButtonDisabled,
+      disableShortcut: isShortcutDisabled,
       hideOkBtn: oneTap,
-      onOk: handleOK,
+      onOk: handleClickOK,
       onShortcutClick: handleShortcutPageDate,
       ranges: bottomRanges
     })))));
@@ -710,27 +745,26 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     rest = _partitionHTMLProps[1];
   var showCleanButton = cleanable && hasValue && !readOnly;
   var invalidValue = value && isErrorValue(value);
-
-  // Custom rendering of the selected value
-  var customValue = null;
-
-  // Input box is read-only when the component is uneditable or loading state
-  var inputReadOnly = readOnly || !editable || loading || false;
-  if (typeof renderValue === 'function' && value) {
-    customValue = renderValue(value, formatStr);
-
-    // If the custom rendering value, the input box is read-only
-    inputReadOnly = true;
-  }
-  var TargetInput = customValue ? Input : DateRangeInput;
+  var _useCustomizedInput = useCustomizedInput({
+      mode: 'dateRange',
+      value: value,
+      formatStr: formatStr,
+      renderValue: renderValue,
+      readOnly: readOnly,
+      editable: editable,
+      loading: loading
+    }),
+    customValue = _useCustomizedInput.customValue,
+    inputReadOnly = _useCustomizedInput.inputReadOnly,
+    Input = _useCustomizedInput.Input,
+    events = _useCustomizedInput.events;
   return /*#__PURE__*/React.createElement(PickerToggleTrigger, {
     trigger: "active",
     ref: trigger,
     pickerProps: pick(props, pickTriggerPropKeys),
     placement: placement,
-    onEnter: createChainedFunction(handleEnter, onEnter),
-    onEntered: onEntered,
-    onExited: onExited,
+    onEnter: createChainedFunction(events.onActive, handleEnter, onEnter),
+    onExit: createChainedFunction(events.onInactive, onExit),
     speaker: renderCalendarOverlay
   }, /*#__PURE__*/React.createElement(Component, {
     ref: root,
@@ -747,7 +781,7 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }), /*#__PURE__*/React.createElement(PickerLabel, {
     className: prefix(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["label"]))),
     id: id + "-label"
-  }, label), /*#__PURE__*/React.createElement(TargetInput, _extends({
+  }, label), /*#__PURE__*/React.createElement(Input, _extends({
     "aria-haspopup": "dialog",
     "aria-invalid": invalidValue,
     "aria-labelledby": label ? id + "-label" : undefined
@@ -760,7 +794,6 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     placeholder: placeholder ? placeholder : rangeFormatStr,
     disabled: disabled,
     readOnly: inputReadOnly,
-    plaintext: plaintext,
     htmlSize: getInputHtmlSize(),
     onChange: handleInputChange,
     onKeyDown: handleInputKeyDown
@@ -780,6 +813,7 @@ DateRangePicker.propTypes = _extends({}, pickerPropTypes, {
   hoverRange: PropTypes.oneOfType([oneOf(['week', 'month']), PropTypes.func]),
   format: PropTypes.string,
   isoWeek: PropTypes.bool,
+  weekStart: PropTypes.oneOf([0, 1, 2, 3, 4, 5, 6]),
   oneTap: PropTypes.bool,
   limitEndYear: PropTypes.number,
   limitStartYear: PropTypes.number,

package/esm/DateRangePicker/Header.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 interface HeaderProps {
     formatStr: string;
     character: string;
@@ -7,5 +7,5 @@ interface HeaderProps {
     onSelect?: (eventKey: 'start' | 'end') => void;
     clickable?: boolean;
 }
-declare function Header(props: HeaderProps): JSX.Element;
+declare function Header(props: HeaderProps): React.JSX.Element;
 export default Header;

package/esm/DateRangePicker/Header.js

@@ -1,9 +1,9 @@
 'use client';
 import React from 'react';
-import { useClassNames } from '../utils';
-import { compareAsc } from '../utils/dateUtils';
-import { FormattedDate } from '../CustomProvider';
-import Button from '../Button';
+import { useClassNames } from "../internals/hooks/index.js";
+import { compareAsc } from "../internals/utils/date/index.js";
+import { FormattedDate } from "../CustomProvider/index.js";
+import Button from "../Button/index.js";
 function Header(props) {
   var _prefix;
   var _useClassNames = useClassNames('picker'),

package/esm/DateRangePicker/disabledDateUtils.js

@@ -1,5 +1,6 @@
 'use client';
-import { composeFunctions, DateUtils } from '../utils';
+import { composeFunctions } from "../internals/utils/index.js";
+import * as DateUtils from "../internals/utils/date/index.js";
 function isAfterDay(date1, date2) {
   return DateUtils.isAfter(new Date(date1.getFullYear(), date1.getMonth(), date1.getDate()), new Date(date2.getFullYear(), date2.getMonth(), date2.getDate()));
 }

package/esm/DateRangePicker/hooks/useDateDisabled.d.ts

@@ -1,4 +1,4 @@
-import { DATERANGE_DISABLED_TARGET as TARGET } from '../../utils';
+import { DATERANGE_DISABLED_TARGET as TARGET } from '../../internals/constants';
 import { DisabledDateFunction, SelectedDatesState } from '../types';
 interface UseDateDisabledProps {
     shouldDisableDate?: DisabledDateFunction;

package/esm/DateRangePicker/index.js

@@ -1,6 +1,6 @@
 'use client';
-import DateRangePicker from './DateRangePicker';
-import * as utils from './disabledDateUtils';
+import DateRangePicker from "./DateRangePicker.js";
+import * as utils from "./disabledDateUtils.js";
 Object.keys(utils).forEach(function (key) {
   DateRangePicker[key] = utils[key];
 });

package/esm/DateRangePicker/types.d.ts

@@ -1,14 +1,14 @@
 import React from 'react';
-import { DATERANGE_DISABLED_TARGET } from '../utils/constants';
-export declare type ValueType = [Date?, Date?];
-export declare type DateRange = [Date, Date];
+import { DATERANGE_DISABLED_TARGET } from '../internals/constants';
+export type ValueType = [Date?, Date?];
+export type DateRange = [Date, Date];
 export interface RangeType<T = DateRange> {
     label: React.ReactNode;
     value: T | ((value?: T) => T);
     closeOverlay?: boolean;
     placement?: 'bottom' | 'left';
 }
-export declare type DisabledDateFunction = (
+export type DisabledDateFunction = (
 /**
  * Date used to determine if disabling is required.
  */
@@ -26,4 +26,4 @@ selectedDone?: boolean,
  * Call the target of the `shouldDisableDate` function.
  */
 target?: DATERANGE_DISABLED_TARGET) => boolean;
-export declare type SelectedDatesState = [] | [Date] | [Date, Date];
+export type SelectedDatesState = [] | [Date] | [Date, Date];

package/esm/DateRangePicker/types.js

@@ -1 +1,2 @@
 'use client';
+export {};

package/esm/DateRangePicker/utils.d.ts

@@ -1,4 +1,5 @@
 import { DateRange } from './types';
+import type { Locale } from 'date-fns';
 export declare function getSafeCalendarDate({ value, calendarKey, allowSameMonth }: {
     value: [] | [Date] | [Date, Date] | null;
     calendarKey?: 'start' | 'end';
@@ -6,4 +7,8 @@ export declare function getSafeCalendarDate({ value, calendarKey, allowSameMonth
 }): DateRange;
 export declare const isSameRange: (source: DateRange | null, dest: DateRange | null, format: string) => boolean;
 export declare const getMonthHoverRange: (date: Date) => DateRange;
-export declare const getWeekHoverRange: (isoWeek: boolean, date: Date) => DateRange;
+export declare const getWeekHoverRange: (date: Date, options: {
+    isoWeek: boolean;
+    weekStart: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    locale?: Locale;
+}) => DateRange;

package/esm/DateRangePicker/utils.js

@@ -1,5 +1,5 @@
 'use client';
-import { addMonths, isSameDay, shouldRenderTime, isSameSecond, startOfMonth, endOfMonth, startOfISOWeek, endOfISOWeek, startOfWeek, endOfWeek, differenceInCalendarMonths, copyTime } from '../utils/dateUtils';
+import { addMonths, isSameDay, shouldRenderTime, isSameSecond, startOfMonth, endOfMonth, startOfISOWeek, endOfISOWeek, startOfWeek, endOfWeek, differenceInCalendarMonths, copyTime } from "../internals/utils/date/index.js";
 export function getSafeCalendarDate(_ref) {
   var _value;
   var value = _ref.value,
@@ -44,10 +44,19 @@ export var isSameRange = function isSameRange(source, dest, format) {
 export var getMonthHoverRange = function getMonthHoverRange(date) {
   return [startOfMonth(date), endOfMonth(date)];
 };
-export var getWeekHoverRange = function getWeekHoverRange(isoWeek, date) {
+export var getWeekHoverRange = function getWeekHoverRange(date, options) {
+  var isoWeek = options.isoWeek,
+    weekStart = options.weekStart,
+    locale = options.locale;
   if (isoWeek) {
     // set to the first day of this week according to ISO 8601, 12:00 am
     return [startOfISOWeek(date), endOfISOWeek(date)];
   }
-  return [startOfWeek(date), endOfWeek(date)];
+  return [startOfWeek(date, {
+    weekStartsOn: weekStart,
+    locale: locale
+  }), endOfWeek(date, {
+    weekStartsOn: weekStart,
+    locale: locale
+  })];
 };

package/esm/Divider/Divider.d.ts

@@ -1,4 +1,4 @@
-import { WithAsProps, RsRefForwardingComponent } from '../@types/common';
+import { WithAsProps, RsRefForwardingComponent } from '../internals/types';
 export interface DividerProps extends WithAsProps {
     /**
      * Vertical dividing line. Cannot be used with text.

package/esm/Divider/Divider.js

@@ -1,9 +1,10 @@
 'use client';
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+var _excluded = ["as", "className", "classPrefix", "children", "vertical"];
 import React from 'react';
 import PropTypes from 'prop-types';
-import { useClassNames } from '../utils';
+import { useClassNames } from "../internals/hooks/index.js";
 /**
  * The Divider component is used to separate content.
  * @see https://rsuitejs.com/components/divider
@@ -16,7 +17,7 @@ var Divider = /*#__PURE__*/React.forwardRef(function (props, ref) {
     classPrefix = _props$classPrefix === void 0 ? 'divider' : _props$classPrefix,
     children = props.children,
     vertical = props.vertical,
-    rest = _objectWithoutPropertiesLoose(props, ["as", "className", "classPrefix", "children", "vertical"]);
+    rest = _objectWithoutPropertiesLoose(props, _excluded);
   var _useClassNames = useClassNames(classPrefix),
     prefix = _useClassNames.prefix,
     withClassPrefix = _useClassNames.withClassPrefix,