rsuite 5.0.0-beta.7 → 5.0.2

package/cjs/DateRangePicker/Calendar.d.ts

@@ -13,7 +13,8 @@ export interface CalendarProps extends WithAsProps, Omit<CalendarCoreProps, Omit
     isoWeek?: boolean;
     limitEndYear?: number;
     locale?: DatePickerLocale;
-    onChangeCalendarDate?: (index: number, nextPageDate: Date) => void;
+    onChangeCalendarDate?: (index: number, date: Date) => void;
+    onChangeCalendarTime?: (index: number, date: Date) => void;
     onMouseMove?: (date: Date) => void;
     onSelect?: (date: Date, event?: React.SyntheticEvent<any>) => void;
     showOneCalendar?: boolean;

package/cjs/DateRangePicker/Calendar.js

@@ -21,24 +21,23 @@ var _Calendar = _interopRequireWildcard(require("../Calendar/Calendar"));
 
 var _utils = require("../utils");
 
-var defaultProps = {
-  as: _Calendar.default,
-  calendarDate: [new Date(), (0, _dateUtils.addMonths)(new Date(), 1)],
-  format: 'yyyy-MM-dd',
-  index: 0,
-  value: []
-};
-
 var Calendar = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  var Component = props.as,
-      calendarDate = props.calendarDate,
+  var _props$as = props.as,
+      Component = _props$as === void 0 ? _Calendar.default : _props$as,
+      _props$calendarDate = props.calendarDate,
+      calendarDate = _props$calendarDate === void 0 ? [new Date(), (0, _dateUtils.addMonths)(new Date(), 1)] : _props$calendarDate,
+      _props$format = props.format,
+      format = _props$format === void 0 ? 'yyyy-MM-dd' : _props$format,
       disabledDate = props.disabledDate,
-      index = props.index,
+      _props$index = props.index,
+      index = _props$index === void 0 ? 0 : _props$index,
       limitEndYear = props.limitEndYear,
       onChangeCalendarDate = props.onChangeCalendarDate,
+      onChangeCalendarTime = props.onChangeCalendarTime,
       showOneCalendar = props.showOneCalendar,
-      value = props.value,
-      rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "calendarDate", "disabledDate", "index", "limitEndYear", "onChangeCalendarDate", "showOneCalendar", "value"]);
+      _props$value = props.value,
+      value = _props$value === void 0 ? [] : _props$value,
+      rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "calendarDate", "format", "disabledDate", "index", "limitEndYear", "onChangeCalendarDate", "onChangeCalendarTime", "showOneCalendar", "value"]);
 
   var _useState = (0, _react.useState)(),
       calendarState = _useState[0],
@@ -55,8 +54,8 @@ var Calendar = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     setCalendarState(undefined);
   }, [index, onChangeCalendarDate]);
   var handleChangePageTime = (0, _react.useCallback)(function (nextPageDate) {
-    onChangeCalendarDate(index, nextPageDate);
-  }, [index, onChangeCalendarDate]);
+    onChangeCalendarTime(index, nextPageDate);
+  }, [index, onChangeCalendarTime]);
   var toggleMonthDropdown = (0, _react.useCallback)(function () {
     setCalendarState(calendarState === _Calendar.CalendarState.DROP_MONTH ? undefined : _Calendar.CalendarState.DROP_MONTH);
   }, [calendarState]);
@@ -112,6 +111,7 @@ var Calendar = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     return !after;
   }, [calendarDate, disabledDate, index, showOneCalendar, value]);
   return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {
+    format: format,
     calendarState: calendarState,
     dateRange: value,
     disabledBackward: disabledBackward(),
@@ -132,7 +132,6 @@ var Calendar = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
 });
 
 Calendar.displayName = 'DateRangePicker.Calendar';
-Calendar.defaultProps = defaultProps;
 Calendar.propTypes = {
   value: _propTypes.default.arrayOf(_propTypes.default.instanceOf(Date)),
   hoverValue: _propTypes.default.arrayOf(_propTypes.default.instanceOf(Date)),

package/cjs/DateRangePicker/DateRangePicker.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import { PickerComponent } from '../Picker';
 import { FormControlBaseProps, PickerBaseProps } from '../@types/common';
+import { PickerComponent } from '../Picker';
 import { DisabledDateFunction, RangeType, ValueType } from './types';
 export interface DateRangePickerProps extends PickerBaseProps, FormControlBaseProps<ValueType> {
     /** Configure shortcut options */

package/cjs/DateRangePicker/DateRangePicker.js

@@ -7,78 +7,76 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 exports.__esModule = true;
 exports.default = void 0;
 
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
-var _react = _interopRequireWildcard(require("react"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
+var _Calendar = _interopRequireDefault(require("@rsuite/icons/legacy/Calendar"));
+
+var _isUndefined = _interopRequireDefault(require("lodash/isUndefined"));
 
 var _omit = _interopRequireDefault(require("lodash/omit"));
 
-var _pick = _interopRequireDefault(require("lodash/pick"));
+var _partial = _interopRequireDefault(require("lodash/partial"));
 
-var _isUndefined = _interopRequireDefault(require("lodash/isUndefined"));
+var _pick = _interopRequireDefault(require("lodash/pick"));
 
-var _dateUtils = require("../utils/dateUtils");
+var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var disabledDateUtils = _interopRequireWildcard(require("./disabledDateUtils"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _CustomProvider = require("../CustomProvider");
 
 var _Toolbar = _interopRequireDefault(require("../DatePicker/Toolbar"));
 
-var _Calendar = _interopRequireDefault(require("./Calendar"));
+var _Picker = require("../Picker");
 
-var _utils = require("./utils");
+var _utils = require("../utils");
 
-var _utils2 = require("../utils");
+var _dateUtils = require("../utils/dateUtils");
 
-var _Picker = require("../Picker");
+var _Calendar2 = _interopRequireDefault(require("./Calendar"));
 
-var _partial = _interopRequireDefault(require("lodash/partial"));
+var disabledDateUtils = _interopRequireWildcard(require("./disabledDateUtils"));
 
-var _Calendar2 = _interopRequireDefault(require("@rsuite/icons/legacy/Calendar"));
-
-var defaultProps = (0, _extends2.default)({}, _Picker.pickerDefaultProps, {
-  as: 'div',
-  classPrefix: 'picker',
-  cleanable: true,
-  placement: 'bottomStart',
-  appearance: 'default',
-  format: 'yyyy-MM-dd',
-  limitEndYear: 1000,
-  placeholder: '',
-  showOneCalendar: false,
-  character: ' ~ '
-});
+var _utils2 = require("./utils");
 
 var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _ref, _merge;
 
-  var Component = props.as,
-      classPrefix = props.classPrefix,
+  var _props$as = props.as,
+      Component = _props$as === void 0 ? 'div' : _props$as,
+      _props$classPrefix = props.classPrefix,
+      classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,
       className = props.className,
-      cleanable = props.cleanable,
-      character = props.character,
+      _props$appearance = props.appearance,
+      appearance = _props$appearance === void 0 ? 'default' : _props$appearance,
+      _props$cleanable = props.cleanable,
+      cleanable = _props$cleanable === void 0 ? true : _props$cleanable,
+      _props$character = props.character,
+      character = _props$character === void 0 ? ' ~ ' : _props$character,
       defaultCalendarValue = props.defaultCalendarValue,
       defaultValue = props.defaultValue,
       disabled = props.disabled,
       disabledDateProp = props.disabledDate,
-      formatStr = props.format,
+      _props$format = props.format,
+      formatStr = _props$format === void 0 ? 'yyyy-MM-dd' : _props$format,
       hoverRange = props.hoverRange,
       isoWeek = props.isoWeek,
-      limitEndYear = props.limitEndYear,
+      _props$limitEndYear = props.limitEndYear,
+      limitEndYear = _props$limitEndYear === void 0 ? 1000 : _props$limitEndYear,
       overrideLocale = props.locale,
       menuClassName = props.menuClassName,
       menuStyle = props.menuStyle,
       oneTap = props.oneTap,
-      placeholder = props.placeholder,
-      placement = props.placement,
+      _props$placeholder = props.placeholder,
+      placeholder = _props$placeholder === void 0 ? '' : _props$placeholder,
+      _props$placement = props.placement,
+      placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,
       ranges = props.ranges,
       renderValue = props.renderValue,
-      showOneCalendar = props.showOneCalendar,
+      _props$showOneCalenda = props.showOneCalendar,
+      showOneCalendar = _props$showOneCalenda === void 0 ? false : _props$showOneCalenda,
       showWeekNumbers = props.showWeekNumbers,
       style = props.style,
       toggleAs = props.toggleAs,
@@ -92,19 +90,20 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
       onOk = props.onOk,
       onOpen = props.onOpen,
       onSelect = props.onSelect,
-      rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "classPrefix", "className", "cleanable", "character", "defaultCalendarValue", "defaultValue", "disabled", "disabledDate", "format", "hoverRange", "isoWeek", "limitEndYear", "locale", "menuClassName", "menuStyle", "oneTap", "placeholder", "placement", "ranges", "renderValue", "showOneCalendar", "showWeekNumbers", "style", "toggleAs", "value", "onChange", "onClean", "onClose", "onEnter", "onEntered", "onExited", "onOk", "onOpen", "onSelect"]);
+      rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "classPrefix", "className", "appearance", "cleanable", "character", "defaultCalendarValue", "defaultValue", "disabled", "disabledDate", "format", "hoverRange", "isoWeek", "limitEndYear", "locale", "menuClassName", "menuStyle", "oneTap", "placeholder", "placement", "ranges", "renderValue", "showOneCalendar", "showWeekNumbers", "style", "toggleAs", "value", "onChange", "onClean", "onClose", "onEnter", "onEntered", "onExited", "onOk", "onOpen", "onSelect"]);
 
-  var _useClassNames = (0, _utils2.useClassNames)(classPrefix),
+  var _useClassNames = (0, _utils.useClassNames)(classPrefix),
       merge = _useClassNames.merge,
       prefix = _useClassNames.prefix;
 
-  var _useCustom = (0, _utils2.useCustom)('DateRangePicker', overrideLocale),
+  var _useCustom = (0, _utils.useCustom)('DateRangePicker', overrideLocale),
       locale = _useCustom.locale,
-      formatDate = _useCustom.formatDate;
+      formatDate = _useCustom.formatDate,
+      parseDate = _useCustom.parseDate;
 
   var rangeFormatStr = "" + formatStr + character + formatStr;
 
-  var _useControlled = (0, _utils2.useControlled)(valueProp, defaultValue !== null && defaultValue !== void 0 ? defaultValue : []),
+  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue !== null && defaultValue !== void 0 ? defaultValue : []),
       value = _useControlled[0],
       setValue = _useControlled[1];
   /**
@@ -135,7 +134,7 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
       setHoverValue = _useState2[1]; // The displayed calendar panel is rendered based on this value.
 
 
-  var _useState3 = (0, _react.useState)((0, _utils.getCalendarDate)({
+  var _useState3 = (0, _react.useState)((0, _utils2.getCalendarDate)({
     value: valueProp !== null && valueProp !== void 0 ? valueProp : defaultCalendarValue
   })),
       calendarDate = _useState3[0],
@@ -158,7 +157,7 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
    */
 
   var updateCalendarDate = (0, _react.useCallback)(function (value) {
-    setCalendarDate((0, _utils.getCalendarDate)({
+    setCalendarDate((0, _utils2.getCalendarDate)({
       value: value
     }));
   }, []); // if valueProp changed then update selectValue/hoverValue
@@ -227,11 +226,11 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
     var hoverRangeFunc = hoverRange;
 
     if (hoverRange === 'week') {
-      hoverRangeFunc = (0, _partial.default)(_utils.getWeekHoverRange, isoWeek);
+      hoverRangeFunc = (0, _partial.default)(_utils2.getWeekHoverRange, isoWeek);
     }
 
     if (hoverRangeFunc === 'month') {
-      hoverRangeFunc = _utils.getMonthHoverRange;
+      hoverRangeFunc = _utils2.getMonthHoverRange;
     }
 
     if (typeof hoverRangeFunc !== 'function') {
@@ -245,7 +244,7 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
       return [];
     }
 
-    if (_utils2.DateUtils.isAfter(hoverValues[0], hoverValues[1])) {
+    if (_utils.DateUtils.isAfter(hoverValues[0], hoverValues[1])) {
       hoverValues.reverse();
     }
 
@@ -259,7 +258,7 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
     var nextValue = !(0, _isUndefined.default)(nextSelectValue) ? nextSelectValue : selectValue;
     setSelectValue(nextValue || []);
 
-    if (!(0, _dateUtils.isSameDay)(nextValue[0], value[0]) || !(0, _dateUtils.isSameDay)(nextValue[1], value[1])) {
+    if (!(0, _utils2.isSameRange)(nextValue, value, formatStr)) {
       setValue(nextValue);
       onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
     } // `closeOverlay` default value is `true`
@@ -268,7 +267,7 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
     if (closeOverlay !== false) {
       handleCloseDropdown();
     }
-  }, [handleCloseDropdown, onChange, selectValue, setSelectValue, setValue, value]);
+  }, [formatStr, handleCloseDropdown, onChange, selectValue, setValue, value]);
   /**
    * Select the date range. If oneTap is not set, you need to click twice to select the start time and end time.
    * The MouseMove event is called between the first click and the second click to update the selection state.
@@ -282,7 +281,7 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
       if (hoverRange) {
         var nextHoverValue = [selectRangeValueRef.current[0], hoverRangeValue[1]];
 
-        if (_utils2.DateUtils.isBefore(hoverRangeValue[0], selectRangeValueRef.current[0])) {
+        if (_utils.DateUtils.isBefore(hoverRangeValue[0], selectRangeValueRef.current[0])) {
           nextHoverValue[0] = hoverRangeValue[0];
           nextHoverValue[1] = selectRangeValueRef.current[1];
         }
@@ -304,7 +303,7 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
     var noHoverRangeValid = hoverRangeValue.length !== 2; // in `oneTap` mode
 
     if (hasDoneSelect.current && oneTap) {
-      handleValueUpdate(event, noHoverRangeValid ? [(0, _utils.setTimingMargin)(date), (0, _utils.setTimingMargin)(date, 'right')] : hoverRangeValue);
+      handleValueUpdate(event, noHoverRangeValid ? [(0, _utils2.setTimingMargin)(date), (0, _utils2.setTimingMargin)(date, 'right')] : hoverRangeValue);
       hasDoneSelect.current = false;
       return;
     } // no preset hover range can use
@@ -329,7 +328,7 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
     } // If user have completed the selection, then sort
 
 
-    if (nextSelectValue.length === 2 && _utils2.DateUtils.isAfter(nextSelectValue[0], nextSelectValue[1])) {
+    if (nextSelectValue.length === 2 && _utils.DateUtils.isAfter(nextSelectValue[0], nextSelectValue[1])) {
       nextSelectValue.reverse();
     }
 
@@ -357,6 +356,20 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
     nextCalendarDate[index] = date;
     updateCalendarDate(nextCalendarDate);
   }, [calendarDate, updateCalendarDate]);
+  var handleChangeCalendarTime = (0, _react.useCallback)(function (index, date) {
+    setSelectValue(function (prev) {
+      var next = [].concat(prev);
+      var clonedDate = new Date(date.valueOf()); // if next[index] is not empty, only update the time after aligning the year, month and day
+
+      if (next[index]) {
+        clonedDate.setFullYear(next[index].getFullYear(), next[index].getMonth(), next[index].getDate());
+      }
+
+      next[index] = clonedDate;
+      return next;
+    });
+    handleChangeCalendarDate(index, date);
+  }, [handleChangeCalendarDate]);
   /**
    * Toolbar operation callback function
    */
@@ -381,21 +394,25 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
     var rangeValue = value.split(character); // isMatch('01/11/2020', 'MM/dd/yyyy') ==> true
     // isMatch('2020-11-01', 'MM/dd/yyyy') ==> false
 
-    if (!_utils2.DateUtils.isMatch(rangeValue[0], formatStr) || !_utils2.DateUtils.isMatch(rangeValue[1], formatStr)) {
+    if (!_utils.DateUtils.isMatch(rangeValue[0], formatStr, {
+      locale: locale.dateLocale
+    }) || !_utils.DateUtils.isMatch(rangeValue[1], formatStr, {
+      locale: locale.dateLocale
+    })) {
       setInputState('Error');
       return;
     }
 
-    var startDate = new Date(rangeValue[0]);
-    var endDate = new Date(rangeValue[1]);
+    var startDate = parseDate(rangeValue[0], formatStr);
+    var endDate = parseDate(rangeValue[1], formatStr);
     var selectValue = [startDate, endDate];
 
-    if (!_utils2.DateUtils.isValid(startDate) || !_utils2.DateUtils.isValid(endDate)) {
+    if (!_utils.DateUtils.isValid(startDate) || !_utils.DateUtils.isValid(endDate)) {
       setInputState('Error');
       return;
     }
 
-    if (disabledDate(startDate, selectValue, true, _utils2.DATERANGE_DISABLED_TARGET.CALENDAR)) {
+    if (disabledDate(startDate, selectValue, true, _utils.DATERANGE_DISABLED_TARGET.CALENDAR)) {
       setInputState('Error');
       return;
     }
@@ -424,7 +441,7 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
           endData = value[1];
       nextCalendarDate = [_startDate, (0, _dateUtils.isSameMonth)(_startDate, endData) ? (0, _dateUtils.addMonths)(endData, 1) : endData];
     } else {
-      nextCalendarDate = (0, _utils.getCalendarDate)({
+      nextCalendarDate = (0, _utils2.getCalendarDate)({
         value: defaultCalendarValue
       });
     }
@@ -450,12 +467,12 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
     var nextSelectValue = [selectStartDate, selectEndDate]; // If the date is between the start and the end
     // the button is disabled
 
-    while (_utils2.DateUtils.isBefore(start, end) || _utils2.DateUtils.isSameDay(start, end)) {
+    while (_utils.DateUtils.isBefore(start, end) || _utils.DateUtils.isSameDay(start, end)) {
       if (disabledDate(start, nextSelectValue, hasDoneSelect.current, type)) {
         return true;
       }
 
-      start = _utils2.DateUtils.addDays(start, 1);
+      start = _utils.DateUtils.addDays(start, 1);
     }
 
     return false;
@@ -468,7 +485,7 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
       return true;
     }
 
-    return disabledByBetween(start, end, _utils2.DATERANGE_DISABLED_TARGET.TOOLBAR_BUTTON_OK);
+    return disabledByBetween(start, end, _utils.DATERANGE_DISABLED_TARGET.TOOLBAR_BUTTON_OK);
   }, [disabledByBetween, selectValue]);
   var disabledShortcutButton = (0, _react.useCallback)(function (value) {
     if (value === void 0) {
@@ -483,7 +500,7 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
       return true;
     }
 
-    return disabledByBetween(start, end, _utils2.DATERANGE_DISABLED_TARGET.TOOLBAR_SHORTCUT);
+    return disabledByBetween(start, end, _utils.DATERANGE_DISABLED_TARGET.TOOLBAR_SHORTCUT);
   }, [disabledByBetween]);
   var handleDisabledDate = (0, _react.useCallback)(function (date, values, type) {
     return disabledDate(date, values, hasDoneSelect.current, type);
@@ -519,12 +536,13 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
       showWeekNumbers: showWeekNumbers,
       value: selectValue,
       onChangeCalendarDate: handleChangeCalendarDate,
+      onChangeCalendarTime: handleChangeCalendarTime,
       onMouseMove: handleMouseMove,
       onSelect: handleSelectValueChange
     };
     return /*#__PURE__*/_react.default.createElement(_Picker.PickerOverlay, {
       className: classes,
-      ref: (0, _utils2.mergeRefs)(overlayRef, speakerRef),
+      ref: (0, _utils.mergeRefs)(overlayRef, speakerRef),
       target: triggerRef,
       style: styles
     }, /*#__PURE__*/_react.default.createElement("div", {
@@ -535,9 +553,9 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
       className: prefix('daterange-header')
     }, getDisplayString(selectValue)), /*#__PURE__*/_react.default.createElement("div", {
       className: prefix("daterange-calendar-" + (showOneCalendar ? 'single' : 'group'))
-    }, /*#__PURE__*/_react.default.createElement(_Calendar.default, (0, _extends2.default)({
+    }, /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({
       index: 0
-    }, panelProps)), !showOneCalendar && /*#__PURE__*/_react.default.createElement(_Calendar.default, (0, _extends2.default)({
+    }, panelProps)), !showOneCalendar && /*#__PURE__*/_react.default.createElement(_Calendar2.default, (0, _extends2.default)({
       index: 1
     }, panelProps)))), /*#__PURE__*/_react.default.createElement(_Toolbar.default, {
       locale: locale,
@@ -554,8 +572,10 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
   var hasValue = value && value.length > 1;
 
   var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {
+    classPrefix: classPrefix,
     name: 'daterange',
-    hasValue: hasValue
+    hasValue: hasValue,
+    cleanable: cleanable
   })),
       classes = _usePickerClassName[0],
       usedClassNamePropKeys = _usePickerClassName[1];
@@ -564,30 +584,31 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
     pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),
     ref: triggerRef,
     placement: placement,
-    onEnter: (0, _utils2.createChainedFunction)(handleEnter, onEnter),
-    onEntered: (0, _utils2.createChainedFunction)(handleEntered, onEntered),
-    onExited: (0, _utils2.createChainedFunction)(handleExited, onExited),
+    onEnter: (0, _utils.createChainedFunction)(handleEnter, onEnter),
+    onEntered: (0, _utils.createChainedFunction)(handleEntered, onEntered),
+    onExited: (0, _utils.createChainedFunction)(handleExited, onExited),
     speaker: renderDropdownMenu
   }, /*#__PURE__*/_react.default.createElement(Component, {
     ref: rootRef,
     className: merge(className, classes, (_merge = {}, _merge[prefix('error')] = inputState === 'Error', _merge)),
     style: style
-  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys, _utils2.DateUtils.calendarOnlyProps)), {
+  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys, _utils.DateUtils.calendarOnlyProps)), {
     as: toggleAs,
     ref: targetRef,
+    appearance: appearance,
     input: true,
-    inputMask: _utils2.DateUtils.getDateMask(rangeFormatStr),
+    inputMask: _utils.DateUtils.getDateMask(rangeFormatStr),
     inputValue: value ? getDisplayString(value, true) : '',
     inputPlaceholder: typeof placeholder === 'string' && placeholder ? placeholder : rangeFormatStr,
     onInputChange: handleInputChange,
     onInputBlur: handleInputBlur,
     onKeyDown: onPickerKeyDown,
-    onClean: (0, _utils2.createChainedFunction)(handleClean, onClean),
+    onClean: (0, _utils.createChainedFunction)(handleClean, onClean),
     cleanable: cleanable && !disabled,
     hasValue: hasValue,
     active: isPickerToggleActive,
     placement: placement,
-    caretComponent: _Calendar2.default,
+    caretComponent: _Calendar.default,
     disabled: disabled
   }), getDisplayString())));
 });
@@ -601,7 +622,6 @@ DateRangePicker.before = disabledDateUtils.before;
 DateRangePicker.beforeToday = disabledDateUtils.beforeToday;
 DateRangePicker.combine = disabledDateUtils.combine;
 DateRangePicker.displayName = 'DateRangePicker';
-DateRangePicker.defaultProps = defaultProps;
 DateRangePicker.propTypes = (0, _extends2.default)({}, _Picker.pickerPropTypes, {
   ranges: _propTypes.default.array,
   value: _propTypes.default.arrayOf(_propTypes.default.instanceOf(Date)),

package/cjs/DateRangePicker/utils.d.ts

@@ -4,6 +4,6 @@ export declare function getCalendarDate({ value }: {
     value?: ValueType;
 }): ValueType;
 export declare const getDefaultRanges: () => RangeType[];
-export declare const isSameValueType: (source: ValueType, dest: ValueType) => boolean;
+export declare const isSameRange: (source: ValueType, dest: ValueType, format: string) => boolean;
 export declare const getMonthHoverRange: (date: Date) => ValueType;
 export declare const getWeekHoverRange: (isoWeek: boolean, date: Date) => ValueType;

package/cjs/DateRangePicker/utils.js

@@ -2,7 +2,7 @@
 
 exports.__esModule = true;
 exports.getCalendarDate = getCalendarDate;
-exports.getWeekHoverRange = exports.getMonthHoverRange = exports.isSameValueType = exports.getDefaultRanges = exports.setTimingMargin = void 0;
+exports.getWeekHoverRange = exports.getMonthHoverRange = exports.isSameRange = exports.getDefaultRanges = exports.setTimingMargin = void 0;
 
 var _utils = require("../utils");
 
@@ -51,13 +51,17 @@ var getDefaultRanges = function getDefaultRanges() {
 
 exports.getDefaultRanges = getDefaultRanges;
 
-var isSameValueType = function isSameValueType(source, dest) {
-  var _source$, _dest$, _source$2, _dest$2;
+var isSameRange = function isSameRange(source, dest, format) {
+  var result = _utils.DateUtils.isSameDay(source === null || source === void 0 ? void 0 : source[0], dest === null || dest === void 0 ? void 0 : dest[0]) && _utils.DateUtils.isSameDay(source === null || source === void 0 ? void 0 : source[1], dest === null || dest === void 0 ? void 0 : dest[1]);
 
-  return (source === null || source === void 0 ? void 0 : (_source$ = source[0]) === null || _source$ === void 0 ? void 0 : _source$.valueOf()) === (dest === null || dest === void 0 ? void 0 : (_dest$ = dest[0]) === null || _dest$ === void 0 ? void 0 : _dest$.valueOf()) && (source === null || source === void 0 ? void 0 : (_source$2 = source[1]) === null || _source$2 === void 0 ? void 0 : _source$2.valueOf()) === (dest === null || dest === void 0 ? void 0 : (_dest$2 = dest[1]) === null || _dest$2 === void 0 ? void 0 : _dest$2.valueOf());
+  if (_utils.DateUtils.shouldTime(format)) {
+    result && (result = _utils.DateUtils.isSameSecond(source === null || source === void 0 ? void 0 : source[0], dest === null || dest === void 0 ? void 0 : dest[0]) && _utils.DateUtils.isSameSecond(source === null || source === void 0 ? void 0 : source[1], dest === null || dest === void 0 ? void 0 : dest[1]));
+  }
+
+  return result;
 };
 
-exports.isSameValueType = isSameValueType;
+exports.isSameRange = isSameRange;
 
 var getMonthHoverRange = function getMonthHoverRange(date) {
   return [_utils.DateUtils.startOfMonth(date), _utils.DateUtils.endOfMonth(date)];

package/cjs/Divider/Divider.js

@@ -15,15 +15,12 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _utils = require("../utils");
 
-var defaultProps = {
-  classPrefix: 'divider',
-  as: 'div'
-};
-
 var Divider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  var Component = props.as,
+  var _props$as = props.as,
+      Component = _props$as === void 0 ? 'div' : _props$as,
       className = props.className,
-      classPrefix = props.classPrefix,
+      _props$classPrefix = props.classPrefix,
+      classPrefix = _props$classPrefix === void 0 ? 'divider' : _props$classPrefix,
       children = props.children,
       vertical = props.vertical,
       rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "className", "classPrefix", "children", "vertical"]);
@@ -48,7 +45,6 @@ var Divider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
 });
 
 Divider.displayName = 'Divider';
-Divider.defaultProps = defaultProps;
 Divider.propTypes = {
   as: _propTypes.default.elementType,
   className: _propTypes.default.string,

package/cjs/Drawer/Drawer.js

@@ -21,12 +21,6 @@ var _utils = require("../utils");
 
 var _deprecateComponent = _interopRequireDefault(require("../utils/deprecateComponent"));
 
-var defaultProps = {
-  classPrefix: 'drawer',
-  placement: 'right',
-  animation: _Slide.default
-};
-
 var DrawerBody = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   return /*#__PURE__*/_react.default.createElement(_Modal.default.Body, (0, _extends2.default)({
     classPrefix: "drawer-body"
@@ -69,9 +63,13 @@ var DrawerTitle = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
 
 var Drawer = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var className = props.className,
-      placement = props.placement,
-      classPrefix = props.classPrefix,
-      rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["className", "placement", "classPrefix"]);
+      _props$placement = props.placement,
+      placement = _props$placement === void 0 ? 'right' : _props$placement,
+      _props$classPrefix = props.classPrefix,
+      classPrefix = _props$classPrefix === void 0 ? 'drawer' : _props$classPrefix,
+      _props$animation = props.animation,
+      animation = _props$animation === void 0 ? _Slide.default : _props$animation,
+      rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["className", "placement", "classPrefix", "animation"]);
 
   var _useClassNames = (0, _utils.useClassNames)(classPrefix),
       merge = _useClassNames.merge,
@@ -86,6 +84,7 @@ var Drawer = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     drawer: true,
     classPrefix: classPrefix,
     className: classes,
+    animation: animation,
     animationProps: animationProps
   }));
 });
@@ -101,7 +100,6 @@ Drawer.Actions = DrawerActions;
 Drawer.Footer = (0, _deprecateComponent.default)(DrawerFooter, '<Drawer.Footer> has been deprecated, use <Drawer.Actions> instead.');
 Drawer.Title = DrawerTitle;
 Drawer.displayName = 'Drawer';
-Drawer.defaultProps = defaultProps;
 Drawer.propTypes = {
   classPrefix: _propTypes.default.string,
   placement: _propTypes.default.oneOf(['top', 'right', 'bottom', 'left']),