rsuite 5.48.1 → 5.50.0

package/cjs/DateRangePicker/Calendar.js

@@ -1,14 +1,13 @@
 'use client';
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.__esModule = true;
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _react = _interopRequireWildcard(require("react"));
 var _dateUtils = require("../utils/dateUtils");
 var _CalendarContainer = _interopRequireDefault(require("../Calendar/CalendarContainer"));
 var _utils = require("../utils");
@@ -31,37 +30,39 @@ var Calendar = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     _props$value = props.value,
     value = _props$value === void 0 ? [] : _props$value,
     rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "calendarDate", "format", "disabledDate", "index", "limitEndYear", "limitStartYear", "onChangeCalendarMonth", "onChangeCalendarTime", "onToggleMeridian", "onSelect", "value"]);
-  var onMoveForward = (0, _react.useCallback)(function (nextPageDate) {
+  var onMoveForward = (0, _utils.useEventCallback)(function (nextPageDate) {
     onChangeCalendarMonth === null || onChangeCalendarMonth === void 0 ? void 0 : onChangeCalendarMonth(index, nextPageDate);
-  }, [index, onChangeCalendarMonth]);
-  var onMoveBackward = (0, _react.useCallback)(function (nextPageDate) {
+  });
+  var onMoveBackward = (0, _utils.useEventCallback)(function (nextPageDate) {
     onChangeCalendarMonth === null || onChangeCalendarMonth === void 0 ? void 0 : onChangeCalendarMonth(index, nextPageDate);
-  }, [index, onChangeCalendarMonth]);
-  var handleSelect = (0, _react.useCallback)(function (date, event) {
+  });
+  var handleSelect = (0, _utils.useEventCallback)(function (date, event) {
     onSelect === null || onSelect === void 0 ? void 0 : onSelect(index, date, event);
-  }, [index, onSelect]);
-  var handleChangeMonth = (0, _react.useCallback)(function (nextPageDate) {
+  });
+  var handleChangeMonth = (0, _utils.useEventCallback)(function (nextPageDate) {
     onChangeCalendarMonth === null || onChangeCalendarMonth === void 0 ? void 0 : onChangeCalendarMonth(index, nextPageDate);
-  }, [index, onChangeCalendarMonth]);
-  var handleChangeTime = (0, _react.useCallback)(function (nextPageDate) {
+  });
+  var handleChangeTime = (0, _utils.useEventCallback)(function (nextPageDate) {
     onChangeCalendarTime === null || onChangeCalendarTime === void 0 ? void 0 : onChangeCalendarTime(index, nextPageDate);
-  }, [index, onChangeCalendarTime]);
-  var handleToggleMeridian = (0, _react.useCallback)(function (event) {
+  });
+  var handleToggleMeridian = (0, _utils.useEventCallback)(function (event) {
     onToggleMeridian(index, event);
-  }, [index, onToggleMeridian]);
-  var getCalendarDate = (0, _react.useCallback)(function () {
+  });
+  var getCalendarDate = function getCalendarDate() {
     return calendarDate[index];
-  }, [calendarDate, index]);
-  var handleMoveForward = (0, _react.useCallback)(function () {
+  };
+  var handleMoveForward = (0, _utils.useEventCallback)(function () {
     onMoveForward === null || onMoveForward === void 0 ? void 0 : onMoveForward((0, _dateUtils.addMonths)(getCalendarDate(), 1));
-  }, [getCalendarDate, onMoveForward]);
-  var handleMoveBackward = (0, _react.useCallback)(function () {
+  });
+  var handleMoveBackward = (0, _utils.useEventCallback)(function () {
     onMoveBackward === null || onMoveBackward === void 0 ? void 0 : onMoveBackward((0, _dateUtils.addMonths)(getCalendarDate(), -1));
-  }, [getCalendarDate, onMoveBackward]);
-  var disabledMonth = (0, _react.useCallback)(function (date) {
+  });
+  var disabledMonth = function disabledMonth(date) {
     return disabledDate === null || disabledDate === void 0 ? void 0 : disabledDate(date, value, _utils.DATERANGE_DISABLED_TARGET.CALENDAR);
-  }, [disabledDate, value]);
-  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {
+  };
+  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
+    "data-testid": "calendar-" + (index === 0 ? 'start' : 'end')
+  }, rest, {
     format: format,
     dateRange: value,
     disabledDate: disabledMonth,

package/cjs/DateRangePicker/DateRangePicker.d.ts

@@ -1,8 +1,11 @@
 import React from 'react';
 import { FormControlBaseProps, PickerBaseProps } from '../@types/common';
-import { PickerComponent, PickerToggleProps } from '../Picker';
+import { DateRangePickerLocale } from '../locales';
+import { PickerComponent } from '../Picker';
 import { DisabledDateFunction, RangeType, DateRange } from './types';
-export interface DateRangePickerProps extends PickerBaseProps, FormControlBaseProps<DateRange | null>, Pick<PickerToggleProps, 'caretAs' | 'readOnly' | 'plaintext' | 'loading'> {
+export interface DateRangePickerProps extends PickerBaseProps<DateRangePickerLocale>, FormControlBaseProps<DateRange | null> {
+    /** Custom caret component */
+    caretAs?: React.ElementType | null;
     /** Predefined date ranges */
     ranges?: RangeType[];
     /** Format date */
@@ -13,12 +16,20 @@ export interface DateRangePickerProps extends PickerBaseProps, FormControlBasePr
     hoverRange?: 'week' | 'month' | ((date: Date) => DateRange);
     /** Whether to click once on selected date range，Can be used with hoverRange */
     oneTap?: boolean;
-    /** ISO 8601 standard, each calendar week begins on Monday and Sunday on the seventh day */
+    /**
+     * ISO 8601 standard, each calendar week begins on Monday and Sunday on the seventh day
+     *
+     * @see https://en.wikipedia.org/wiki/ISO_week_date
+     */
     isoWeek?: boolean;
+    /** A label displayed at the beginning of toggle button */
+    label?: React.ReactNode;
     /** Set the upper limit of the available year relative to the current selection date */
     limitEndYear?: number;
     /** Set the lower limit of the available year relative to the current selection date */
     limitStartYear?: number;
+    /** Whether to display a loading state indicator */
+    loading?: boolean;
     /** Whether to show week numbers */
     showWeekNumbers?: boolean;
     /** Show only one calendar select */
@@ -47,7 +58,10 @@ export interface DateRangePickerProps extends PickerBaseProps, FormControlBasePr
     onShortcutClick?: (range: RangeType, event: React.MouseEvent) => void;
     /** Called when clean */
     onClean?: (event: React.MouseEvent) => void;
-    /** Custom render value */
+    /**
+     * Custom render value
+     * @deprecated
+     */
     renderValue?: (value: DateRange, format: string) => React.ReactNode;
     /** Custom render for calendar title */
     renderTitle?: (date: Date) => React.ReactNode;