rsuite 5.4.0 → 5.4.4

package/esm/Affix/Affix.js

@@ -3,7 +3,7 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 import PropTypes from 'prop-types';
 import getOffset from 'dom-lib/getOffset';
-import { mergeRefs, useClassNames, useElementResize, useEventListener } from '../utils';
+import { mergeRefs, useClassNames, useElementResize, useEventListener, useMount } from '../utils';
 
 /**
  * Get the layout size and offset of the mount element
@@ -21,7 +21,9 @@ function useOffset(mountRef) {
     return mountRef.current;
   }, updateOffset); // Initialize after the first render
 
-  useEffect(updateOffset, [updateOffset]);
+  useMount(updateOffset); // Update after window size changes
+
+  useEventListener(window, 'resize', updateOffset, false);
   return offset;
 }
 /**

package/esm/AvatarGroup/AvatarGroup.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React from 'react';
+import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
 import { useClassNames, useCustom } from '../utils';
 export var AvatarGroupContext = /*#__PURE__*/React.createContext({});
@@ -26,13 +26,16 @@ var AvatarGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var classes = merge(className, withClassPrefix({
     stack: stack
   }));
+  var contextValue = useMemo(function () {
+    return {
+      size: size
+    };
+  }, [size]);
   return /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
     ref: ref,
     className: classes
   }), /*#__PURE__*/React.createElement(AvatarGroupContext.Provider, {
-    value: {
-      size: size
-    }
+    value: contextValue
   }, spacing ? React.Children.map(children, function (child) {
     var _extends2;
 

package/esm/ButtonGroup/ButtonGroup.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React from 'react';
+import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
 import { useClassNames } from '../utils';
 import ButtonGroupContext from './ButtonGroupContext';
@@ -28,10 +28,13 @@ var ButtonGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
     vertical: vertical,
     justified: justified
   }));
-  return /*#__PURE__*/React.createElement(ButtonGroupContext.Provider, {
-    value: {
+  var contextValue = useMemo(function () {
+    return {
       size: size
-    }
+    };
+  }, [size]);
+  return /*#__PURE__*/React.createElement(ButtonGroupContext.Provider, {
+    value: contextValue
   }, /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
     role: role,
     ref: ref,

package/esm/Calendar/Calendar.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React, { useCallback } from 'react';
+import React, { useCallback, useMemo } from 'react';
 import PropTypes from 'prop-types';
 import pick from 'lodash/pick';
 import MonthDropdown from './MonthDropdown';
@@ -56,11 +56,11 @@ var Calendar = /*#__PURE__*/React.forwardRef(function (props, ref) {
       withClassPrefix = _useClassNames.withClassPrefix,
       merge = _useClassNames.merge;
 
-  var isDisabledDate = function isDisabledDate(date) {
+  var isDisabledDate = useCallback(function (date) {
     var _disabledDate;
 
     return (_disabledDate = disabledDate === null || disabledDate === void 0 ? void 0 : disabledDate(date)) !== null && _disabledDate !== void 0 ? _disabledDate : false;
-  };
+  }, [disabledDate]);
 
   var isTimeDisabled = function isTimeDisabled(date) {
     return DateUtils.disabledTime(props, date);
@@ -92,27 +92,28 @@ var Calendar = /*#__PURE__*/React.forwardRef(function (props, ref) {
     'show-week-numbers': showWeekNumbers
   }));
   var timeDropdownProps = pick(rest, DateUtils.calendarOnlyProps);
-  var contextValue = {
-    date: calendarDate,
-    dateRange: dateRange,
-    disabledDate: isDisabledDate,
-    format: format,
-    hoverRangeValue: hoverRangeValue,
-    inSameMonth: inSameMonth !== null && inSameMonth !== void 0 ? inSameMonth : inSameThisMonthDate,
-    isoWeek: isoWeek,
-    locale: locale,
-    onChangePageDate: onChangePageDate,
-    onChangePageTime: onChangePageTime,
-    onMouseMove: onMouseMove,
-    onSelect: onSelect,
-    renderCell: renderCell,
-    showWeekNumbers: showWeekNumbers,
-    inline: inline
-  };
+  var contextValue = useMemo(function () {
+    return {
+      date: calendarDate,
+      dateRange: dateRange,
+      disabledDate: isDisabledDate,
+      format: format,
+      hoverRangeValue: hoverRangeValue,
+      inSameMonth: inSameMonth !== null && inSameMonth !== void 0 ? inSameMonth : inSameThisMonthDate,
+      isoWeek: isoWeek,
+      locale: locale,
+      onChangePageDate: onChangePageDate,
+      onChangePageTime: onChangePageTime,
+      onMouseMove: onMouseMove,
+      onSelect: onSelect,
+      renderCell: renderCell,
+      showWeekNumbers: showWeekNumbers,
+      inline: inline
+    };
+  }, [calendarDate, dateRange, format, hoverRangeValue, inSameMonth, inSameThisMonthDate, inline, isDisabledDate, isoWeek, locale, onChangePageDate, onChangePageTime, onMouseMove, onSelect, renderCell, showWeekNumbers]);
   return /*#__PURE__*/React.createElement(CalendarProvider, {
     value: contextValue
   }, /*#__PURE__*/React.createElement(Component, _extends({}, DateUtils.omitHideDisabledProps(rest), {
-    role: "table",
     className: calendarClasses,
     ref: ref
   }), /*#__PURE__*/React.createElement(Header, {

package/esm/Calendar/Header.js

@@ -117,9 +117,7 @@ var Header = /*#__PURE__*/React.forwardRef(function (props, ref) {
     'has-month': hasMonth,
     'has-time': showTime
   }));
-  return /*#__PURE__*/React.createElement(Component, _extends({
-    role: "row"
-  }, rest, {
+  return /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
     ref: ref,
     className: classes
   }), hasMonth && monthToolbar, showTime && /*#__PURE__*/React.createElement("div", {

package/esm/Calendar/Table.js

@@ -21,7 +21,7 @@ var Table = /*#__PURE__*/React.forwardRef(function (props, ref) {
 
   var classes = merge(className, withClassPrefix());
   return /*#__PURE__*/React.createElement(Component, _extends({
-    role: "table"
+    role: "grid"
   }, rest, {
     ref: ref,
     className: classes

package/esm/Calendar/TableRow.js

@@ -3,7 +3,7 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 import React, { useCallback } from 'react';
 import PropTypes from 'prop-types';
 import partial from 'lodash/partial';
-import { DateUtils, useClassNames, DATERANGE_DISABLED_TARGET } from '../utils';
+import { DateUtils, useClassNames, DATERANGE_DISABLED_TARGET, useCustom } from '../utils';
 import { useCalendarContext } from './CalendarContext';
 var TableRow = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _props$as = props.as,
@@ -20,16 +20,19 @@ var TableRow = /*#__PURE__*/React.forwardRef(function (props, ref) {
       selected = _useCalendarContext$d === void 0 ? new Date() : _useCalendarContext$d,
       dateRange = _useCalendarContext.dateRange,
       disabledDate = _useCalendarContext.disabledDate,
-      formatDate = _useCalendarContext.formatDate,
       hoverRangeValue = _useCalendarContext.hoverRangeValue,
       inSameMonth = _useCalendarContext.inSameMonth,
       isoWeek = _useCalendarContext.isoWeek,
       onMouseMove = _useCalendarContext.onMouseMove,
       onSelect = _useCalendarContext.onSelect,
       renderCell = _useCalendarContext.renderCell,
-      locale = _useCalendarContext.locale,
+      overrideLocale = _useCalendarContext.locale,
       showWeekNumbers = _useCalendarContext.showWeekNumbers;
 
+  var _useCustom = useCustom('Calendar', overrideLocale),
+      locale = _useCustom.locale,
+      formatDate = _useCustom.formatDate;
+
   var _useClassNames = useClassNames(classPrefix),
       prefix = _useClassNames.prefix,
       merge = _useClassNames.merge;
@@ -43,7 +46,7 @@ var TableRow = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }, [onSelect]);
 
   var renderDays = function renderDays() {
-    var formatStr = (locale === null || locale === void 0 ? void 0 : locale.formattedDayPattern) || 'yyyy-MM-dd';
+    var formatStr = locale.formattedDayPattern;
     var days = [];
 
     var _ref = dateRange || [],
@@ -64,7 +67,7 @@ var TableRow = /*#__PURE__*/React.forwardRef(function (props, ref) {
       var unSameMonth = !(inSameMonth !== null && inSameMonth !== void 0 && inSameMonth(thisDate));
       var isStartSelected = !unSameMonth && selectedStartDate && DateUtils.isSameDay(thisDate, selectedStartDate);
       var isEndSelected = !unSameMonth && selectedEndDate && DateUtils.isSameDay(thisDate, selectedEndDate);
-      var isSelected = isStartSelected || isEndSelected;
+      var isSelected = isRangeSelectionMode ? isStartSelected || isEndSelected : DateUtils.isSameDay(thisDate, selected);
       var inRange = false; // for Selected
 
       if (selectedStartDate && selectedEndDate) {
@@ -91,7 +94,7 @@ var TableRow = /*#__PURE__*/React.forwardRef(function (props, ref) {
       var _classes = prefix('cell', {
         'cell-un-same-month': unSameMonth,
         'cell-is-today': isToday,
-        'cell-selected': isRangeSelectionMode ? isSelected : DateUtils.isSameDay(thisDate, selected),
+        'cell-selected': isSelected,
         'cell-selected-start': isStartSelected,
         'cell-selected-end': isEndSelected,
         'cell-in-range': !unSameMonth && inRange,
@@ -100,8 +103,10 @@ var TableRow = /*#__PURE__*/React.forwardRef(function (props, ref) {
 
       var title = formatDate ? formatDate(thisDate, formatStr) : DateUtils.format(thisDate, formatStr);
       days.push( /*#__PURE__*/React.createElement("div", {
-        role: "cell",
+        role: "gridcell",
         key: title,
+        "aria-label": title,
+        "aria-selected": isSelected || undefined,
         className: _classes
       }, /*#__PURE__*/React.createElement("div", {
         role: "button",
@@ -125,7 +130,7 @@ var TableRow = /*#__PURE__*/React.forwardRef(function (props, ref) {
     className: classes
   }), showWeekNumbers && /*#__PURE__*/React.createElement("div", {
     className: prefix('cell-week-number'),
-    role: "cell"
+    role: "rowheader"
   }, DateUtils.format(weekendDate, isoWeek ? 'I' : 'w')), renderDays());
 });
 TableRow.displayName = 'TableRow';

package/esm/Calendar/View.js

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import React from 'react';
 import PropTypes from 'prop-types';
-import { DateUtils, useClassNames } from '../utils';
+import { DateUtils, useClassNames, useCustom } from '../utils';
 import Table from './Table';
 import { useCalendarContext } from './CalendarContext';
 var View = /*#__PURE__*/React.forwardRef(function (props, ref) {
@@ -16,7 +16,12 @@ var View = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _useCalendarContext = useCalendarContext(),
       _useCalendarContext$d = _useCalendarContext.date,
       date = _useCalendarContext$d === void 0 ? new Date() : _useCalendarContext$d,
-      isoWeek = _useCalendarContext.isoWeek;
+      isoWeek = _useCalendarContext.isoWeek,
+      overrideLocale = _useCalendarContext.locale;
+
+  var _useCustom = useCustom('Calendar', overrideLocale),
+      locale = _useCustom.locale,
+      formatDate = _useCustom.formatDate;
 
   var thisMonthDate = DateUtils.setDate(date, 1);
 
@@ -25,13 +30,12 @@ var View = /*#__PURE__*/React.forwardRef(function (props, ref) {
       withClassPrefix = _useClassNames.withClassPrefix;
 
   var classes = merge(className, withClassPrefix());
-  return /*#__PURE__*/React.createElement(Component, _extends({
-    role: "row"
-  }, rest, {
+  return /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
     ref: ref,
     className: classes
   }), /*#__PURE__*/React.createElement(Table, {
-    rows: DateUtils.getMonthView(thisMonthDate, isoWeek)
+    rows: DateUtils.getMonthView(thisMonthDate, isoWeek),
+    "aria-label": formatDate(thisMonthDate, locale.formattedMonthPattern)
   }));
 });
 View.displayName = 'View';

package/esm/Calendar/useCalendarDate.d.ts

@@ -1,4 +1,4 @@
-declare const useCalendarDate: (value: Date | undefined, defaultDate: Date | undefined) => {
+declare const useCalendarDate: (value: Date | null | undefined, defaultDate: Date | undefined) => {
     calendarDate: Date;
     setCalendarDate: (date: Date | undefined) => void;
 };

package/esm/Calendar/useCalendarDate.js

@@ -19,7 +19,7 @@ var useCalendarDate = function useCalendarDate(value, defaultDate) {
     var _valueRef$current;
 
     if ((value === null || value === void 0 ? void 0 : value.valueOf()) !== ((_valueRef$current = valueRef.current) === null || _valueRef$current === void 0 ? void 0 : _valueRef$current.valueOf())) {
-      setCalendarDate(value);
+      setCalendarDate(value !== null && value !== void 0 ? value : new Date());
       valueRef.current = value;
     }
   }, [value]);

package/esm/Carousel/Carousel.js

@@ -1,9 +1,9 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React, { useState, useMemo, useCallback } from 'react';
+import React, { useState, useMemo, useCallback, useRef } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
-import { useClassNames, useCustom, guid, ReactChildren, useTimeout } from '../utils';
+import { useClassNames, useCustom, guid, ReactChildren, useTimeout, mergeRefs } from '../utils';
 var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _sliderStyles, _ref;
 
@@ -46,7 +46,13 @@ var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
       lastIndex = _useState2[0],
       setLastIndex = _useState2[1];
 
+  var rootRef = useRef(null);
+
   var handleSlide = function handleSlide(nextActiveIndex, event) {
+    if (!rootRef.current) {
+      return;
+    }
+
     clear();
     var index = nextActiveIndex !== null && nextActiveIndex !== void 0 ? nextActiveIndex : activeIndex + 1; // When index is greater than count, start from 1 again.
 
@@ -111,7 +117,7 @@ var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var sliderStyles = (_sliderStyles = {}, _sliderStyles[lengthKey] = count * 100 + "%", _sliderStyles.transform = vertical ? "translate3d(0, " + activeRatio + " ,0)" : "translate3d(" + activeRatio + ", 0 ,0)", _sliderStyles);
   var showMask = count > 1 && activeIndex === 0 && activeIndex !== lastIndex;
   return /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
-    ref: ref,
+    ref: mergeRefs(ref, rootRef),
     className: classes
   }), /*#__PURE__*/React.createElement("div", {
     className: prefix('content')

package/esm/Cascader/Cascader.js

@@ -188,10 +188,18 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
     }
   }, [getSearchResult, onSearch, setFocusItemValue, setKeys, setLayer, valueKey]);
   var handleEntered = useCallback(function () {
+    if (!targetRef.current) {
+      return;
+    }
+
     onOpen === null || onOpen === void 0 ? void 0 : onOpen();
     setActive(true);
   }, [onOpen]);
   var handleExited = useCallback(function () {
+    if (!targetRef.current) {
+      return;
+    }
+
     onClose === null || onClose === void 0 ? void 0 : onClose();
     setActive(false);
     setSearchKeyword('');
@@ -202,7 +210,7 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
     (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : _triggerRef$current.close();
   }, [triggerRef]);
   var handleClean = useCallback(function (event) {
-    if (disabled) {
+    if (disabled || !targetRef.current) {
       return;
     }
 
@@ -260,7 +268,10 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
         children.then(function (data) {
           node.loading = false;
           node[childrenKey] = data;
-          addColumn(data, cascadePaths.length);
+
+          if (targetRef.current) {
+            addColumn(data, cascadePaths.length);
+          }
         });
       } else {
         node.loading = false;

package/esm/CheckPicker/CheckPicker.d.ts

@@ -1,5 +1,6 @@
-import React from 'react';
+import React, { Ref } from 'react';
 import { PickerLocale } from '../locales';
+import { PickerInstance } from '../Picker';
 import { ItemDataType, FormControlPickerProps } from '../@types/common';
 import type { MultipleSelectProps } from '../SelectPicker';
 export declare type ValueType = (number | string)[];
@@ -10,7 +11,9 @@ export interface CheckPickerProps<T> extends FormControlPickerProps<T[], PickerL
     countable?: boolean;
 }
 export interface CheckPickerComponent {
-    <T>(props: CheckPickerProps<T>): JSX.Element | null;
+    <T>(props: CheckPickerProps<T> & {
+        ref?: Ref<PickerInstance>;
+    }): JSX.Element | null;
     displayName?: string;
     propTypes?: React.WeakValidationMap<CheckPickerProps<any>>;
 }

package/esm/CheckPicker/test/CheckPicker.test.js

@@ -61,4 +61,11 @@ React.createElement(CheckPicker, {
   onChange: function onChange(newValue) {
     expectType(newValue);
   }
+});
+var pickerRef = /*#__PURE__*/React.createRef();
+
+/*#__PURE__*/
+React.createElement(CheckPicker, {
+  ref: pickerRef,
+  data: []
 });

package/esm/CheckTree/index.js

@@ -1,12 +1,15 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
-import React from 'react';
+import React, { useMemo } from 'react';
 import CheckTreePicker from '../CheckTreePicker';
 import TreeContext from '../Tree/TreeContext';
 var CheckTree = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  return /*#__PURE__*/React.createElement(TreeContext.Provider, {
-    value: {
+  var contextValue = useMemo(function () {
+    return {
       inline: true
-    }
+    };
+  }, []);
+  return /*#__PURE__*/React.createElement(TreeContext.Provider, {
+    value: contextValue
   }, /*#__PURE__*/React.createElement(CheckTreePicker, _extends({
     ref: ref
   }, props)));

package/esm/CheckTreePicker/CheckTreePicker.js

@@ -621,7 +621,7 @@ var CheckTreePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var renderCheckTree = function renderCheckTree() {
     var _withCheckTreeClassPr, _merge2;
 
-    var classes = withCheckTreeClassPrefix((_withCheckTreeClassPr = {}, _withCheckTreeClassPr[className !== null && className !== void 0 ? className : ''] = inline, _withCheckTreeClassPr['without-children'] = !isSomeNodeHasChildren, _withCheckTreeClassPr.virtualized = virtualized, _withCheckTreeClassPr));
+    var classes = withCheckTreeClassPrefix((_withCheckTreeClassPr = {}, _withCheckTreeClassPr[className !== null && className !== void 0 ? className : ''] = inline, _withCheckTreeClassPr['without-children'] = !isSomeNodeHasChildren(data, childrenKey), _withCheckTreeClassPr.virtualized = virtualized, _withCheckTreeClassPr));
     var formattedNodes = getFormattedNodes(renderNode);
 
     if (!formattedNodes.some(function (v) {

package/esm/CheckTreePicker/utils.js

@@ -38,7 +38,7 @@ export function isSomeChildChecked(nodes, parent, childrenKey) {
 }
 export function isSomeNodeHasChildren(data, childrenKey) {
   return data.some(function (node) {
-    return node[childrenKey];
+    return Array.isArray(node[childrenKey]);
   });
 }
 /**

package/esm/Container/Container.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React, { useState } from 'react';
+import React, { useState, useMemo } from 'react';
 import PropTypes from 'prop-types';
 import { useClassNames } from '../utils';
 export var ContainerContext = /*#__PURE__*/React.createContext({});
@@ -24,10 +24,13 @@ var Container = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var classes = merge(className, withClassPrefix({
     'has-sidebar': hasSidebar
   }));
-  return /*#__PURE__*/React.createElement(ContainerContext.Provider, {
-    value: {
+  var contextValue = useMemo(function () {
+    return {
       setHasSidebar: setHasSidebar
-    }
+    };
+  }, [setHasSidebar]);
+  return /*#__PURE__*/React.createElement(ContainerContext.Provider, {
+    value: contextValue
   }, /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
     ref: ref,
     className: classes

package/esm/CustomProvider/CustomProvider.d.ts

@@ -72,10 +72,10 @@ declare const CustomContext: React.Context<CustomProviderProps<{
         saturday: string;
         ok: string;
         today: string;
-        yesterday: string; /** Language configuration */
+        yesterday: string;
         hours: string;
         minutes: string;
-        seconds: string;
+        seconds: string; /** Support right-to-left */
         formattedMonthPattern: string;
         formattedDayPattern: string;
         dateLocale: any;
@@ -90,10 +90,10 @@ declare const CustomContext: React.Context<CustomProviderProps<{
         saturday: string;
         ok: string;
         today: string;
-        yesterday: string; /** Language configuration */
+        yesterday: string;
         hours: string;
         minutes: string;
-        seconds: string;
+        seconds: string; /** Support right-to-left */
         formattedMonthPattern: string;
         formattedDayPattern: string;
         dateLocale: any;
@@ -109,10 +109,10 @@ declare const CustomContext: React.Context<CustomProviderProps<{
         saturday: string;
         ok: string;
         today: string;
-        yesterday: string; /** Language configuration */
+        yesterday: string;
         hours: string;
         minutes: string;
-        seconds: string;
+        seconds: string; /** Support right-to-left */
         formattedMonthPattern: string;
         formattedDayPattern: string;
         dateLocale: any;
@@ -120,7 +120,7 @@ declare const CustomContext: React.Context<CustomProviderProps<{
     Picker?: {
         noResultsText: string;
         placeholder: string;
-        searchPlaceholder: string; /** Supported themes */
+        searchPlaceholder: string;
         checkAll: string;
     } | undefined;
     InputPicker?: {
@@ -176,10 +176,10 @@ declare const Consumer: React.Consumer<CustomProviderProps<{
         saturday: string;
         ok: string;
         today: string;
-        yesterday: string; /** Language configuration */
+        yesterday: string;
         hours: string;
         minutes: string;
-        seconds: string;
+        seconds: string; /** Support right-to-left */
         formattedMonthPattern: string;
         formattedDayPattern: string;
         dateLocale: any;
@@ -194,10 +194,10 @@ declare const Consumer: React.Consumer<CustomProviderProps<{
         saturday: string;
         ok: string;
         today: string;
-        yesterday: string; /** Language configuration */
+        yesterday: string;
         hours: string;
         minutes: string;
-        seconds: string;
+        seconds: string; /** Support right-to-left */
         formattedMonthPattern: string;
         formattedDayPattern: string;
         dateLocale: any;
@@ -213,10 +213,10 @@ declare const Consumer: React.Consumer<CustomProviderProps<{
         saturday: string;
         ok: string;
         today: string;
-        yesterday: string; /** Language configuration */
+        yesterday: string;
         hours: string;
         minutes: string;
-        seconds: string;
+        seconds: string; /** Support right-to-left */
         formattedMonthPattern: string;
         formattedDayPattern: string;
         dateLocale: any;
@@ -224,7 +224,7 @@ declare const Consumer: React.Consumer<CustomProviderProps<{
     Picker?: {
         noResultsText: string;
         placeholder: string;
-        searchPlaceholder: string; /** Supported themes */
+        searchPlaceholder: string;
         checkAll: string;
     } | undefined;
     InputPicker?: {

package/esm/CustomProvider/CustomProvider.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React from 'react';
+import React, { useEffect } from 'react';
 import { getClassNamePrefix, prefix } from '../utils/prefix';
 import { addClass, removeClass, canUseDOM } from '../DOMHelper';
 var CustomContext = /*#__PURE__*/React.createContext({});
@@ -21,7 +21,7 @@ var CustomProvider = function CustomProvider(props) {
       theme: theme
     }, rest);
   }, [classPrefix, theme, rest]);
-  React.useEffect(function () {
+  useEffect(function () {
     if (canUseDOM && theme) {
       addClass(document.body, prefix(classPrefix, "theme-" + theme)); // Remove the className that will cause style conflicts
 

package/esm/DatePicker/DatePicker.d.ts

@@ -3,7 +3,7 @@ import { RangeType } from './Toolbar';
 import { DatePickerLocale } from '../locales';
 import { FormControlBaseProps, PickerBaseProps, RsRefForwardingComponent } from '../@types/common';
 export type { RangeType } from './Toolbar';
-export interface DatePickerProps extends PickerBaseProps<DatePickerLocale>, FormControlBaseProps<Date> {
+export interface DatePickerProps extends PickerBaseProps<DatePickerLocale>, FormControlBaseProps<Date | null> {
     /** Configure shortcut options */
     ranges?: RangeType<Date>[];
     /** Calendar panel default presentation date and time */

package/esm/DatePicker/DatePicker.js

@@ -2,7 +2,6 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import React, { useCallback, useMemo, useRef, useState } from 'react';
 import PropTypes from 'prop-types';
-import isNil from 'lodash/isNil';
 import mapValues from 'lodash/mapValues';
 import pick from 'lodash/pick';
 import omit from 'lodash/omit';
@@ -166,11 +165,11 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
       closeOverlay = true;
     }
 
-    var nextValue = !isNil(nextPageDate) ? nextPageDate : calendarDate;
+    var nextValue = typeof nextPageDate !== 'undefined' ? nextPageDate : calendarDate;
     setCalendarDate(nextValue || new Date());
     setValue(nextValue);
 
-    if (nextValue !== value || !DateUtils.isSameDay(nextValue, value)) {
+    if (nextValue !== value) {
       onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
     } // `closeOverlay` default value is `true`
 
@@ -371,6 +370,7 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
       top: top
     };
     return /*#__PURE__*/React.createElement(PickerOverlay, {
+      role: "dialog",
       className: classes,
       ref: mergeRefs(overlayRef, speakerRef),
       style: styles,
@@ -444,7 +444,8 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     active: active,
     placement: placement,
     disabled: disabled,
-    caretAs: caretAs
+    caretAs: caretAs,
+    "aria-haspopup": "dialog"
   }), renderDate())));
 });
 DatePicker.displayName = 'DatePicker';