rsuite 5.18.0-beta.3 → 5.18.1-beta.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (83) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/Calendar/styles/index.less +30 -11
  3. package/DateRangePicker/styles/index.less +1 -1
  4. package/Nav/styles/index.less +1 -0
  5. package/cjs/Calendar/Calendar.d.ts +20 -55
  6. package/cjs/Calendar/Calendar.js +84 -163
  7. package/cjs/Calendar/CalendarBody.d.ts +4 -0
  8. package/cjs/Calendar/{View.js → CalendarBody.js} +5 -5
  9. package/cjs/Calendar/CalendarContainer.d.ts +61 -0
  10. package/cjs/Calendar/CalendarContainer.js +233 -0
  11. package/cjs/Calendar/{Header.d.ts → CalendarHeader.d.ts} +9 -7
  12. package/cjs/Calendar/{Header.js → CalendarHeader.js} +4 -4
  13. package/cjs/Calendar/Table.js +1 -1
  14. package/cjs/Calendar/TableHeaderRow.js +1 -1
  15. package/cjs/Calendar/TableRow.js +1 -1
  16. package/cjs/Calendar/index.d.ts +6 -5
  17. package/cjs/Calendar/index.js +8 -7
  18. package/cjs/Calendar/useCalendarState.d.ts +11 -0
  19. package/cjs/Calendar/useCalendarState.js +39 -0
  20. package/cjs/DatePicker/DatePicker.js +10 -47
  21. package/cjs/DatePicker/utils.d.ts +1 -8
  22. package/cjs/DatePicker/utils.js +24 -64
  23. package/cjs/DateRangePicker/Calendar.d.ts +1 -1
  24. package/cjs/DateRangePicker/Calendar.js +2 -17
  25. package/cjs/DateRangePicker/DateRangePicker.js +3 -3
  26. package/cjs/DateRangePicker/utils.d.ts +1 -3
  27. package/cjs/DateRangePicker/utils.js +14 -42
  28. package/cjs/List/ListItem.d.ts +1 -0
  29. package/cjs/List/ListItem.js +5 -2
  30. package/cjs/Stack/Stack.js +1 -1
  31. package/cjs/index.d.ts +1 -1
  32. package/cjs/utils/BrowserDetection.d.ts +7 -0
  33. package/cjs/utils/BrowserDetection.js +52 -2
  34. package/cjs/utils/dateUtils.d.ts +4 -4
  35. package/cjs/utils/dateUtils.js +9 -9
  36. package/dist/rsuite-rtl.css +43 -20
  37. package/dist/rsuite-rtl.min.css +1 -1
  38. package/dist/rsuite-rtl.min.css.map +1 -1
  39. package/dist/rsuite.css +43 -20
  40. package/dist/rsuite.js +51 -40
  41. package/dist/rsuite.js.map +1 -1
  42. package/dist/rsuite.min.css +1 -1
  43. package/dist/rsuite.min.css.map +1 -1
  44. package/dist/rsuite.min.js +1 -1
  45. package/dist/rsuite.min.js.map +1 -1
  46. package/esm/Calendar/Calendar.d.ts +20 -55
  47. package/esm/Calendar/Calendar.js +82 -154
  48. package/esm/Calendar/CalendarBody.d.ts +4 -0
  49. package/esm/Calendar/{View.js → CalendarBody.js} +5 -5
  50. package/esm/Calendar/CalendarContainer.d.ts +61 -0
  51. package/esm/Calendar/CalendarContainer.js +208 -0
  52. package/esm/Calendar/{Header.d.ts → CalendarHeader.d.ts} +9 -7
  53. package/esm/Calendar/{Header.js → CalendarHeader.js} +4 -4
  54. package/esm/Calendar/Table.js +1 -1
  55. package/esm/Calendar/TableHeaderRow.js +1 -1
  56. package/esm/Calendar/TableRow.js +1 -1
  57. package/esm/Calendar/index.d.ts +6 -5
  58. package/esm/Calendar/index.js +5 -4
  59. package/esm/Calendar/useCalendarState.d.ts +11 -0
  60. package/esm/Calendar/useCalendarState.js +31 -0
  61. package/esm/DatePicker/DatePicker.js +10 -46
  62. package/esm/DatePicker/utils.d.ts +1 -8
  63. package/esm/DatePicker/utils.js +23 -57
  64. package/esm/DateRangePicker/Calendar.d.ts +1 -1
  65. package/esm/DateRangePicker/Calendar.js +2 -16
  66. package/esm/DateRangePicker/DateRangePicker.js +5 -5
  67. package/esm/DateRangePicker/utils.d.ts +1 -3
  68. package/esm/DateRangePicker/utils.js +13 -33
  69. package/esm/List/ListItem.d.ts +1 -0
  70. package/esm/List/ListItem.js +5 -2
  71. package/esm/Stack/Stack.js +2 -2
  72. package/esm/index.d.ts +1 -1
  73. package/esm/utils/BrowserDetection.d.ts +7 -0
  74. package/esm/utils/BrowserDetection.js +41 -0
  75. package/esm/utils/dateUtils.d.ts +4 -4
  76. package/esm/utils/dateUtils.js +4 -4
  77. package/package.json +1 -1
  78. package/cjs/Calendar/CalendarPanel.d.ts +0 -26
  79. package/cjs/Calendar/CalendarPanel.js +0 -139
  80. package/cjs/Calendar/View.d.ts +0 -4
  81. package/esm/Calendar/CalendarPanel.d.ts +0 -26
  82. package/esm/Calendar/CalendarPanel.js +0 -119
  83. package/esm/Calendar/View.d.ts +0 -4
@@ -1,20 +1,22 @@
1
1
  import React from 'react';
2
2
  import { RsRefForwardingComponent, WithAsProps } from '../@types/common';
3
- export interface HeaderProps extends WithAsProps {
3
+ export interface CalendarHeaderProps {
4
4
  disabledBackward?: boolean;
5
5
  disabledForward?: boolean;
6
- showDate?: boolean;
7
6
  showMeridian?: boolean;
7
+ onToggleMeridian?: (event: React.MouseEvent) => void;
8
+ renderTitle?: (date: Date) => React.ReactNode;
9
+ renderToolbar?: (date: Date) => React.ReactNode;
10
+ }
11
+ interface CalendarHeaderPrivateProps extends CalendarHeaderProps, WithAsProps {
12
+ showDate?: boolean;
8
13
  showMonth?: boolean;
9
14
  showTime?: boolean;
10
15
  disabledTime?: (date: Date) => boolean;
11
16
  onMoveBackward?: () => void;
12
17
  onMoveForward?: () => void;
13
- onToggleMeridian?: (event: React.MouseEvent) => void;
14
18
  onToggleMonthDropdown?: (event: React.MouseEvent) => void;
15
19
  onToggleTimeDropdown?: (event: React.MouseEvent) => void;
16
- renderTitle?: (date: Date) => React.ReactNode;
17
- renderToolbar?: (date: Date) => React.ReactNode;
18
20
  }
19
- declare const Header: RsRefForwardingComponent<'div', HeaderProps>;
20
- export default Header;
21
+ declare const CalendarHeader: RsRefForwardingComponent<'div', CalendarHeaderPrivateProps>;
22
+ export default CalendarHeader;
@@ -9,7 +9,7 @@ import Button from '../Button';
9
9
  import { useClassNames } from '../utils';
10
10
  import { FormattedDate } from '../CustomProvider';
11
11
  import { useCalendarContext } from './CalendarContext';
12
- var Header = /*#__PURE__*/React.forwardRef(function (props, ref) {
12
+ var CalendarHeader = /*#__PURE__*/React.forwardRef(function (props, ref) {
13
13
  var _props$as = props.as,
14
14
  Component = _props$as === void 0 ? 'div' : _props$as,
15
15
  className = props.className,
@@ -134,8 +134,8 @@ var Header = /*#__PURE__*/React.forwardRef(function (props, ref) {
134
134
  formatStr: "a"
135
135
  }))), renderToolbar === null || renderToolbar === void 0 ? void 0 : renderToolbar(date));
136
136
  });
137
- Header.displayName = 'Header';
138
- Header.propTypes = {
137
+ CalendarHeader.displayName = 'CalendarHeader';
138
+ CalendarHeader.propTypes = {
139
139
  className: PropTypes.string,
140
140
  classPrefix: PropTypes.string,
141
141
  disabledBackward: PropTypes.bool,
@@ -153,4 +153,4 @@ Header.propTypes = {
153
153
  showMonth: PropTypes.bool,
154
154
  showTime: PropTypes.bool
155
155
  };
156
- export default Header;
156
+ export default CalendarHeader;
@@ -32,7 +32,7 @@ var Table = /*#__PURE__*/React.forwardRef(function (props, ref) {
32
32
  });
33
33
  }));
34
34
  });
35
- Table.displayName = 'Table';
35
+ Table.displayName = 'CalendarTable';
36
36
  Table.propTypes = {
37
37
  rows: PropTypes.array,
38
38
  className: PropTypes.string,
@@ -50,7 +50,7 @@ var TableHeaderRow = /*#__PURE__*/React.forwardRef(function (props, ref) {
50
50
  }, locale === null || locale === void 0 ? void 0 : locale[key]));
51
51
  }));
52
52
  });
53
- TableHeaderRow.displayName = 'TableHeaderRow';
53
+ TableHeaderRow.displayName = 'CalendarTableHeaderRow';
54
54
  TableHeaderRow.propTypes = {
55
55
  as: PropTypes.elementType,
56
56
  className: PropTypes.string,
@@ -133,7 +133,7 @@ var TableRow = /*#__PURE__*/React.forwardRef(function (props, ref) {
133
133
  role: "rowheader"
134
134
  }, DateUtils.format(weekendDate, isoWeek ? 'I' : 'w')), renderDays());
135
135
  });
136
- TableRow.displayName = 'TableRow';
136
+ TableRow.displayName = 'CalendarTableRow';
137
137
  TableRow.propTypes = {
138
138
  weekendDate: PropTypes.instanceOf(Date),
139
139
  className: PropTypes.string,
@@ -1,8 +1,9 @@
1
- import CalendarPanel from './CalendarPanel';
2
- import Calendar, { CalendarState } from './Calendar';
1
+ import Calendar from './Calendar';
2
+ import CalendarContainer from './CalendarContainer';
3
+ import { CalendarState } from './useCalendarState';
3
4
  import CalendarContext from './CalendarContext';
4
5
  import { CalendarContextValue } from './types';
5
- export { Calendar, CalendarContext, CalendarState };
6
+ export { CalendarContainer, CalendarContext, CalendarState };
6
7
  export type { CalendarContextValue };
7
- export type { CalendarPanelProps } from './CalendarPanel';
8
- export default CalendarPanel;
8
+ export type { CalendarProps } from './Calendar';
9
+ export default Calendar;
@@ -1,5 +1,6 @@
1
- import CalendarPanel from './CalendarPanel';
2
- import Calendar, { CalendarState } from './Calendar';
1
+ import Calendar from './Calendar';
2
+ import CalendarContainer from './CalendarContainer';
3
+ import { CalendarState } from './useCalendarState';
3
4
  import CalendarContext from './CalendarContext';
4
- export { Calendar, CalendarContext, CalendarState };
5
- export default CalendarPanel;
5
+ export { CalendarContainer, CalendarContext, CalendarState };
6
+ export default Calendar;
@@ -0,0 +1,11 @@
1
+ export declare enum CalendarState {
2
+ 'TIME' = "TIME",
3
+ 'MONTH' = "MONTH"
4
+ }
5
+ declare const useCalendarState: (defaultState?: CalendarState) => {
6
+ calendarState: CalendarState | undefined;
7
+ reset: () => void;
8
+ openMonth: () => void;
9
+ openTime: () => void;
10
+ };
11
+ export default useCalendarState;
@@ -0,0 +1,31 @@
1
+ import { useCallback, useState } from 'react';
2
+ export var CalendarState;
3
+
4
+ (function (CalendarState) {
5
+ CalendarState["TIME"] = "TIME";
6
+ CalendarState["MONTH"] = "MONTH";
7
+ })(CalendarState || (CalendarState = {}));
8
+
9
+ var useCalendarState = function useCalendarState(defaultState) {
10
+ var _useState = useState(defaultState),
11
+ calendarState = _useState[0],
12
+ setCalendarState = _useState[1];
13
+
14
+ var reset = useCallback(function () {
15
+ setCalendarState(undefined);
16
+ }, []);
17
+ var openMonth = useCallback(function () {
18
+ setCalendarState(CalendarState.MONTH);
19
+ }, []);
20
+ var openTime = useCallback(function () {
21
+ setCalendarState(CalendarState.TIME);
22
+ }, []);
23
+ return {
24
+ calendarState: calendarState,
25
+ reset: reset,
26
+ openMonth: openMonth,
27
+ openTime: openTime
28
+ };
29
+ };
30
+
31
+ export default useCalendarState;
@@ -7,12 +7,11 @@ import pick from 'lodash/pick';
7
7
  import omit from 'lodash/omit';
8
8
  import IconCalendar from '@rsuite/icons/legacy/Calendar';
9
9
  import IconClockO from '@rsuite/icons/legacy/ClockO';
10
- import { Calendar, CalendarState } from '../Calendar';
10
+ import CalendarContainer from '../Calendar/CalendarContainer';
11
11
  import useCalendarDate from '../Calendar/useCalendarDate';
12
12
  import Toolbar from './Toolbar';
13
13
  import { composeFunctions, createChainedFunction, DateUtils, mergeRefs, useClassNames, useControlled, useCustom } from '../utils';
14
14
  import { PickerOverlay, pickerPropTypes, PickerToggle, PickerToggleTrigger, pickTriggerPropKeys, omitTriggerPropKeys, usePickerClassName, usePublicMethods, useToggleKeyDownEvent } from '../Picker';
15
- import { useCalendarState } from './utils';
16
15
  var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
17
16
  var _props$as = props.as,
18
17
  Component = _props$as === void 0 ? 'div' : _props$as,
@@ -86,12 +85,6 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
86
85
  inputState = _useState[0],
87
86
  setInputState = _useState[1];
88
87
 
89
- var _useCalendarState = useCalendarState(),
90
- calendarState = _useCalendarState.calendarState,
91
- reset = _useCalendarState.reset,
92
- openMonth = _useCalendarState.openMonth,
93
- openTime = _useCalendarState.openTime;
94
-
95
88
  var _useState2 = useState(false),
96
89
  active = _useState2[0],
97
90
  setActive = _useState2[1];
@@ -189,32 +182,6 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
189
182
  updateValue(event);
190
183
  onOk === null || onOk === void 0 ? void 0 : onOk(calendarDate, event);
191
184
  }, [updateValue, onOk, calendarDate]);
192
- /**
193
- * Toggle month selection panel
194
- */
195
-
196
- var handleMonthDropdown = useCallback(function () {
197
- if (calendarState === CalendarState.DROP_MONTH) {
198
- reset();
199
- } else {
200
- openMonth();
201
- }
202
-
203
- onToggleMonthDropdown === null || onToggleMonthDropdown === void 0 ? void 0 : onToggleMonthDropdown(calendarState !== CalendarState.DROP_MONTH);
204
- }, [calendarState, onToggleMonthDropdown, openMonth, reset]);
205
- /**
206
- * Switch time selection panel
207
- */
208
-
209
- var handleTimeDropdown = useCallback(function () {
210
- if (calendarState === CalendarState.DROP_TIME) {
211
- reset();
212
- } else {
213
- openTime();
214
- }
215
-
216
- onToggleTimeDropdown === null || onToggleTimeDropdown === void 0 ? void 0 : onToggleTimeDropdown(calendarState !== CalendarState.DROP_TIME);
217
- }, [calendarState, onToggleTimeDropdown, openTime, reset]);
218
185
  /**
219
186
  * Callback after clicking the clear button.
220
187
  */
@@ -243,7 +210,7 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
243
210
  }
244
211
 
245
212
  setCalendarDate( // Determine whether the current value contains time, if not, use calendarDate.
246
- DateUtils.shouldTime(formatStr) ? nextValue : composeFunctions(function (d) {
213
+ DateUtils.shouldRenderTime(formatStr) ? nextValue : composeFunctions(function (d) {
247
214
  return DateUtils.setHours(d, DateUtils.getHours(calendarDate));
248
215
  }, function (d) {
249
216
  return DateUtils.setMinutes(d, DateUtils.getMinutes(calendarDate));
@@ -262,15 +229,14 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
262
229
 
263
230
  var handleChangePageDate = useCallback(function (nextPageDate, event) {
264
231
  setCalendarDate(nextPageDate);
265
- reset();
266
232
  handleDateChange(nextPageDate); // Show only the calendar month panel. formatStr = 'yyyy-MM'
267
233
 
268
- var onlyShowMonth = DateUtils.shouldMonth(formatStr) && !DateUtils.shouldDate(formatStr);
234
+ var onlyShowMonth = DateUtils.shouldRenderMonth(formatStr) && !DateUtils.shouldRenderDate(formatStr);
269
235
 
270
236
  if (oneTap && onlyShowMonth) {
271
237
  updateValue(event, nextPageDate);
272
238
  }
273
- }, [formatStr, handleDateChange, oneTap, reset, setCalendarDate, updateValue]);
239
+ }, [formatStr, handleDateChange, oneTap, setCalendarDate, updateValue]);
274
240
  var disabledDate = useCallback(function (date) {
275
241
  var _disabledDateProp;
276
242
 
@@ -293,7 +259,7 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
293
259
 
294
260
  var date = parseDate(value, formatStr); // If only the time is included in the characters, it will default to today.
295
261
 
296
- if (DateUtils.shouldOnlyTime(formatStr)) {
262
+ if (DateUtils.shouldOnlyRenderTime(formatStr)) {
297
263
  date = new Date(DateUtils.format(new Date(), 'yyyy-MM-dd') + " " + value);
298
264
  }
299
265
 
@@ -326,9 +292,8 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
326
292
  }, [onOpen]);
327
293
  var handleExited = useCallback(function () {
328
294
  onClose === null || onClose === void 0 ? void 0 : onClose();
329
- reset();
330
295
  setActive(false);
331
- }, [onClose, reset]); // Check whether the time is within the time range of the shortcut option in the toolbar.
296
+ }, [onClose]); // Check whether the time is within the time range of the shortcut option in the toolbar.
332
297
 
333
298
  var disabledToolbarHandle = useCallback(function (date) {
334
299
  var _disabledDateProp2;
@@ -349,7 +314,7 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
349
314
  var inSameMonth = useCallback(function (date) {
350
315
  return DateUtils.isSameMonth(date, calendarDate);
351
316
  }, [calendarDate]);
352
- var calendar = /*#__PURE__*/React.createElement(Calendar, _extends({}, calendarProps, {
317
+ var calendar = /*#__PURE__*/React.createElement(CalendarContainer, _extends({}, calendarProps, {
353
318
  locale: locale,
354
319
  showWeekNumbers: showWeekNumbers,
355
320
  showMeridian: showMeridian,
@@ -358,13 +323,12 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
358
323
  format: formatStr,
359
324
  isoWeek: isoWeek,
360
325
  inSameMonth: inSameMonth,
361
- calendarState: calendarState,
362
326
  calendarDate: calendarDate,
363
327
  onMoveForward: handleMoveForward,
364
328
  onMoveBackward: handleMoveBackward,
365
329
  onSelect: handleSelect,
366
- onToggleMonthDropdown: handleMonthDropdown,
367
- onToggleTimeDropdown: handleTimeDropdown,
330
+ onToggleMonthDropdown: onToggleMonthDropdown,
331
+ onToggleTimeDropdown: onToggleTimeDropdown,
368
332
  onChangePageDate: handleChangePageDate,
369
333
  onChangePageTime: handleChangePageTime,
370
334
  onToggleMeridian: handleToggleMeridian
@@ -419,7 +383,7 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
419
383
  return (_renderValue = renderValue === null || renderValue === void 0 ? void 0 : renderValue(value, formatStr)) !== null && _renderValue !== void 0 ? _renderValue : formatDate(value, formatStr);
420
384
  }, [formatStr, formatDate, placeholder, renderValue, value]);
421
385
  var caretAs = useMemo(function () {
422
- return caretAsProp || (DateUtils.shouldOnlyTime(formatStr) ? IconClockO : IconCalendar);
386
+ return caretAsProp || (DateUtils.shouldOnlyRenderTime(formatStr) ? IconClockO : IconCalendar);
423
387
  }, [caretAsProp, formatStr]);
424
388
  return /*#__PURE__*/React.createElement(PickerToggleTrigger, {
425
389
  trigger: "active",
@@ -1,17 +1,10 @@
1
1
  import { ToolbarProps } from './Toolbar';
2
2
  import { InnerRange } from './types';
3
- import { CalendarState } from '../Calendar';
4
3
  import { DateRange } from '../DateRangePicker/types';
5
- export declare function getDefaultRanges<T extends Date | DateRange>(date: T): InnerRange<T>[];
4
+ export declare function getDefaultRanges<T extends Date | DateRange>(value: T): InnerRange<T>[];
6
5
  /**
7
6
  * get Toolbar ranges from Toolbar props
8
7
  * @param ranges
9
8
  * @param calendarDate
10
9
  */
11
10
  export declare const getRanges: <T extends Date | DateRange>({ ranges, calendarDate }: Pick<ToolbarProps<T, T>, "calendarDate" | "ranges">) => InnerRange<T>[];
12
- export declare const useCalendarState: () => {
13
- calendarState: CalendarState | undefined;
14
- reset: () => void;
15
- openMonth: () => void;
16
- openTime: () => void;
17
- };
@@ -1,45 +1,33 @@
1
- import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
2
1
  import _extends from "@babel/runtime/helpers/esm/extends";
3
- import { useCallback, useState } from 'react';
4
- import { setTimingMargin } from '../DateRangePicker/utils';
5
- import { subDays } from '../utils/dateUtils';
6
- import { CalendarState } from '../Calendar';
7
- export function getDefaultRanges(date) {
8
- var todayDate = new Date();
2
+ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3
+ import { subDays, startOfDay, endOfDay } from '../utils/dateUtils';
4
+ export function getDefaultRanges(value) {
5
+ var today = new Date();
9
6
  /**
10
- * Is Date[] type
11
7
  * If it is an array type, it returns the default shortcut key suitable for DateRangePicker Toolbar,
12
8
  * otherwise it returns the default shortcut key suitable for DatePicker Toolbar
13
9
  */
14
10
 
15
- var isRange = date instanceof Array;
16
- var rangeKeys = ['today', 'yesterday'];
17
-
18
- function rangeIterator(label) {
19
- var defaultRange = {
20
- today: isRange ? {
21
- value: [setTimingMargin(todayDate), setTimingMargin(todayDate, 'right')]
22
- } : {
23
- closeOverlay: true,
24
- value: todayDate
25
- },
26
- yesterday: isRange ? {
27
- value: [setTimingMargin(subDays(todayDate, 1)), setTimingMargin(subDays(todayDate, 1), 'right')]
28
- } : {
29
- closeOverlay: true,
30
- value: subDays(todayDate, 1)
31
- },
32
- last7Days: {
33
- value: [setTimingMargin(subDays(todayDate, 6)), setTimingMargin(todayDate, 'right')]
34
- }
35
- };
36
- return _extends({
37
- label: label
38
- }, defaultRange[label]);
11
+ if (value instanceof Array) {
12
+ return [{
13
+ label: 'today',
14
+ value: [startOfDay(today), endOfDay(today)]
15
+ }, {
16
+ label: 'yesterday',
17
+ value: [startOfDay(subDays(today, 1)), endOfDay(subDays(today, 1))]
18
+ }, {
19
+ label: 'last7Days',
20
+ value: [startOfDay(subDays(today, 6)), endOfDay(today)]
21
+ }];
39
22
  }
40
23
 
41
- isRange && rangeKeys.push('last7Days');
42
- return rangeKeys.map(rangeIterator);
24
+ return [{
25
+ label: 'today',
26
+ value: today
27
+ }, {
28
+ label: 'yesterday',
29
+ value: subDays(today, 1)
30
+ }];
43
31
  }
44
32
 
45
33
  var generateRangesIterator = function generateRangesIterator(_ref) {
@@ -48,9 +36,8 @@ var generateRangesIterator = function generateRangesIterator(_ref) {
48
36
  var value = _ref2.value,
49
37
  rest = _objectWithoutPropertiesLoose(_ref2, ["value"]);
50
38
 
51
- value = typeof value === 'function' ? value(calendarDate) : value;
52
39
  return _extends({
53
- value: value
40
+ value: typeof value === 'function' ? value(calendarDate) : value
54
41
  }, rest);
55
42
  };
56
43
  };
@@ -67,25 +54,4 @@ export var getRanges = function getRanges(_ref3) {
67
54
  return typeof ranges === 'undefined' ? getDefaultRanges(calendarDate) : ranges.map(generateRangesIterator({
68
55
  calendarDate: calendarDate
69
56
  }));
70
- };
71
- export var useCalendarState = function useCalendarState() {
72
- var _useState = useState(),
73
- calendarState = _useState[0],
74
- setCalendarState = _useState[1];
75
-
76
- var reset = useCallback(function () {
77
- setCalendarState(undefined);
78
- }, []);
79
- var openMonth = useCallback(function () {
80
- setCalendarState(CalendarState.DROP_MONTH);
81
- }, []);
82
- var openTime = useCallback(function () {
83
- setCalendarState(CalendarState.DROP_TIME);
84
- }, []);
85
- return {
86
- calendarState: calendarState,
87
- reset: reset,
88
- openMonth: openMonth,
89
- openTime: openTime
90
- };
91
57
  };
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { CalendarProps as CalendarCoreProps } from '../Calendar/Calendar';
2
+ import { CalendarProps as CalendarCoreProps } from '../Calendar/CalendarContainer';
3
3
  import { DateRange } from './types';
4
4
  import { RsRefForwardingComponent, WithAsProps } from '../@types/common';
5
5
  import { DatePickerLocale } from '../locales';
@@ -1,9 +1,9 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3
3
  import PropTypes from 'prop-types';
4
- import React, { useCallback, useState } from 'react';
4
+ import React, { useCallback } from 'react';
5
5
  import { addMonths, isSameMonth } from '../utils/dateUtils';
6
- import CalendarCore, { CalendarState } from '../Calendar/Calendar';
6
+ import CalendarCore from '../Calendar/CalendarContainer';
7
7
  import { DATERANGE_DISABLED_TARGET } from '../utils';
8
8
  var Calendar = /*#__PURE__*/React.forwardRef(function (props, ref) {
9
9
  var _props$as = props.as,
@@ -23,10 +23,6 @@ var Calendar = /*#__PURE__*/React.forwardRef(function (props, ref) {
23
23
  value = _props$value === void 0 ? [] : _props$value,
24
24
  rest = _objectWithoutPropertiesLoose(props, ["as", "calendarDate", "format", "disabledDate", "index", "limitEndYear", "onChangeCalendarDate", "onChangeCalendarTime", "onToggleMeridian", "value"]);
25
25
 
26
- var _useState = useState(),
27
- calendarState = _useState[0],
28
- setCalendarState = _useState[1];
29
-
30
26
  var onMoveForward = useCallback(function (nextPageDate) {
31
27
  onChangeCalendarDate === null || onChangeCalendarDate === void 0 ? void 0 : onChangeCalendarDate(index, nextPageDate);
32
28
  }, [index, onChangeCalendarDate]);
@@ -35,7 +31,6 @@ var Calendar = /*#__PURE__*/React.forwardRef(function (props, ref) {
35
31
  }, [index, onChangeCalendarDate]);
36
32
  var handleChangePageDate = useCallback(function (nextPageDate) {
37
33
  onChangeCalendarDate === null || onChangeCalendarDate === void 0 ? void 0 : onChangeCalendarDate(index, nextPageDate);
38
- setCalendarState(undefined);
39
34
  }, [index, onChangeCalendarDate]);
40
35
  var handleChangePageTime = useCallback(function (nextPageDate) {
41
36
  onChangeCalendarTime === null || onChangeCalendarTime === void 0 ? void 0 : onChangeCalendarTime(index, nextPageDate);
@@ -43,12 +38,6 @@ var Calendar = /*#__PURE__*/React.forwardRef(function (props, ref) {
43
38
  var handleToggleMeridian = useCallback(function (event) {
44
39
  onToggleMeridian(index, event);
45
40
  }, [index, onToggleMeridian]);
46
- var toggleMonthDropdown = useCallback(function () {
47
- setCalendarState(calendarState === CalendarState.DROP_MONTH ? undefined : CalendarState.DROP_MONTH);
48
- }, [calendarState]);
49
- var toggleTimeDropdown = useCallback(function () {
50
- setCalendarState(calendarState === CalendarState.DROP_TIME ? undefined : CalendarState.DROP_TIME);
51
- }, [calendarState]);
52
41
  var inSameMonth = useCallback(function (date) {
53
42
  return isSameMonth(date, calendarDate[index]);
54
43
  }, [calendarDate, index]);
@@ -66,7 +55,6 @@ var Calendar = /*#__PURE__*/React.forwardRef(function (props, ref) {
66
55
  }, [disabledDate, value]);
67
56
  return /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
68
57
  format: format,
69
- calendarState: calendarState,
70
58
  dateRange: value,
71
59
  disabledDate: disabledMonth,
72
60
  inSameMonth: inSameMonth,
@@ -76,8 +64,6 @@ var Calendar = /*#__PURE__*/React.forwardRef(function (props, ref) {
76
64
  onChangePageTime: handleChangePageTime,
77
65
  onMoveBackward: handleMoveBackward,
78
66
  onMoveForward: handleMoveForward,
79
- onToggleMonthDropdown: toggleMonthDropdown,
80
- onToggleTimeDropdown: toggleTimeDropdown,
81
67
  onToggleMeridian: handleToggleMeridian,
82
68
  calendarDate: getCalendarDate(),
83
69
  ref: ref
@@ -13,10 +13,10 @@ import PredefinedRanges from '../DatePicker/PredefinedRanges';
13
13
  import Stack from '../Stack';
14
14
  import { omitTriggerPropKeys, PickerOverlay, pickerPropTypes, PickerToggle, PickerToggleTrigger, pickTriggerPropKeys, usePickerClassName, usePublicMethods, useToggleKeyDownEvent } from '../Picker';
15
15
  import { createChainedFunction, DATERANGE_DISABLED_TARGET, DateUtils, mergeRefs, useClassNames, useControlled, useCustom } from '../utils';
16
- import { addMonths, compareAsc, isSameMonth } from '../utils/dateUtils';
16
+ import { addMonths, compareAsc, isSameMonth, startOfDay, endOfDay } from '../utils/dateUtils';
17
17
  import Calendar from './Calendar';
18
18
  import * as disabledDateUtils from './disabledDateUtils';
19
- import { getCalendarDate, getMonthHoverRange, getWeekHoverRange, isSameRange, setTimingMargin } from './utils';
19
+ import { getCalendarDate, getMonthHoverRange, getWeekHoverRange, isSameRange } from './utils';
20
20
  var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
21
21
  var _ref, _ref2, _merge;
22
22
 
@@ -140,13 +140,13 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
140
140
 
141
141
  var updateCalendarDateRange = useCallback(function (value, calendarKey) {
142
142
  var nextValue = value;
143
- var shouldTime = DateUtils.shouldTime,
143
+ var shouldRenderTime = DateUtils.shouldRenderTime,
144
144
  getHours = DateUtils.getHours,
145
145
  getMinutes = DateUtils.getMinutes,
146
146
  getSeconds = DateUtils.getSeconds,
147
147
  set = DateUtils.set;
148
148
 
149
- if (shouldTime(formatStr) && calendarKey === undefined && (value === null || value === void 0 ? void 0 : value.length) === 1 && (defaultCalendarValue === null || defaultCalendarValue === void 0 ? void 0 : defaultCalendarValue.length) === 2) {
149
+ if (shouldRenderTime(formatStr) && calendarKey === undefined && (value === null || value === void 0 ? void 0 : value.length) === 1 && (defaultCalendarValue === null || defaultCalendarValue === void 0 ? void 0 : defaultCalendarValue.length) === 2) {
150
150
  var calendarEndDate = (calendarDate === null || calendarDate === void 0 ? void 0 : calendarDate[1]) || defaultCalendarValue[1];
151
151
  var _startDate = value[0]; // When updating the start date, the time of the end date should keep the time set by the user by default.
152
152
 
@@ -305,7 +305,7 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
305
305
  var noHoverRangeValid = isNil(hoverRangeValue); // in `oneTap` mode
306
306
 
307
307
  if (hasDoneSelect.current && oneTap) {
308
- handleValueUpdate(event, noHoverRangeValid ? [setTimingMargin(date), setTimingMargin(date, 'right')] : hoverRangeValue);
308
+ handleValueUpdate(event, noHoverRangeValid ? [startOfDay(date), endOfDay(date)] : hoverRangeValue);
309
309
  hasDoneSelect.current = false;
310
310
  return;
311
311
  } // no preset hover range can use
@@ -1,10 +1,8 @@
1
- import { DateRange, RangeType } from './types';
2
- export declare const setTimingMargin: (date: any, way?: string) => Date;
1
+ import { DateRange } from './types';
3
2
  export declare function getCalendarDate({ value, calendarKey }: {
4
3
  value: [] | [Date] | [Date, Date] | null;
5
4
  calendarKey?: 'start' | 'end';
6
5
  }): DateRange;
7
- export declare const getDefaultRanges: () => RangeType[];
8
6
  export declare const isSameRange: (source: DateRange | null, dest: DateRange | null, format: string) => boolean;
9
7
  export declare const getMonthHoverRange: (date: Date) => DateRange;
10
8
  export declare const getWeekHoverRange: (isoWeek: boolean, date: Date) => DateRange;
@@ -1,11 +1,4 @@
1
- import { DateUtils } from '../utils';
2
- export var setTimingMargin = function setTimingMargin(date, way) {
3
- if (way === void 0) {
4
- way = 'left';
5
- }
6
-
7
- return way === 'right' ? DateUtils.endOfDay(date) : DateUtils.startOfDay(date);
8
- };
1
+ import { addMonths, getMonth, isSameDay, shouldRenderTime, isSameSecond, startOfMonth, endOfMonth, startOfISOWeek, endOfISOWeek, startOfWeek, endOfWeek } from '../utils/dateUtils';
9
2
  export function getCalendarDate(_ref) {
10
3
  var _value;
11
4
 
@@ -16,56 +9,43 @@ export function getCalendarDate(_ref) {
16
9
  value = (_value = value) !== null && _value !== void 0 ? _value : [];
17
10
 
18
11
  if (value[0] && value[1]) {
19
- var startMonth = DateUtils.getMonth(value[0]);
20
- var endMonth = DateUtils.getMonth(value[1]);
12
+ var startMonth = getMonth(value[0]);
13
+ var endMonth = getMonth(value[1]);
21
14
 
22
15
  if (calendarKey === 'start') {
23
- return [value[0], startMonth >= endMonth ? DateUtils.addMonths(value[0], 1) : value[1]];
16
+ return [value[0], startMonth >= endMonth ? addMonths(value[0], 1) : value[1]];
24
17
  } else if (calendarKey === 'end') {
25
- return [startMonth >= endMonth ? DateUtils.addMonths(value[1], -1) : value[0], value[1]];
18
+ return [startMonth >= endMonth ? addMonths(value[1], -1) : value[0], value[1]];
26
19
  } // If only the start date
27
20
 
28
21
  } else if (value[0]) {
29
- return [value[0], DateUtils.addMonths(value[0], 1)];
22
+ return [value[0], addMonths(value[0], 1)];
30
23
  }
31
24
 
32
25
  var todayDate = new Date();
33
- return [todayDate, DateUtils.addMonths(todayDate, 1)];
26
+ return [todayDate, addMonths(todayDate, 1)];
34
27
  }
35
- export var getDefaultRanges = function getDefaultRanges() {
36
- var todayDate = new Date();
37
- return [{
38
- label: 'today',
39
- value: [setTimingMargin(todayDate), setTimingMargin(todayDate, 'right')]
40
- }, {
41
- label: 'yesterday',
42
- value: [setTimingMargin(DateUtils.addDays(todayDate, -1)), setTimingMargin(DateUtils.addDays(todayDate, -1), 'right')]
43
- }, {
44
- label: 'last7Days',
45
- value: [setTimingMargin(DateUtils.subDays(todayDate, 6)), setTimingMargin(todayDate, 'right')]
46
- }];
47
- };
48
28
  export var isSameRange = function isSameRange(source, dest, format) {
49
29
  // If both are null, reguard as same
50
30
  if (null === source && null === dest) return true; // If only one is null, regard as different
51
31
 
52
32
  if (null === source || null === dest) return false;
53
- var result = DateUtils.isSameDay(source[0], dest[0]) && DateUtils.isSameDay(source[1], dest[1]);
33
+ var result = isSameDay(source[0], dest[0]) && isSameDay(source[1], dest[1]);
54
34
 
55
- if (DateUtils.shouldTime(format)) {
56
- result && (result = DateUtils.isSameSecond(source[0], dest[0]) && DateUtils.isSameSecond(source[1], dest[1]));
35
+ if (shouldRenderTime(format)) {
36
+ result && (result = isSameSecond(source[0], dest[0]) && isSameSecond(source[1], dest[1]));
57
37
  }
58
38
 
59
39
  return result;
60
40
  };
61
41
  export var getMonthHoverRange = function getMonthHoverRange(date) {
62
- return [DateUtils.startOfMonth(date), DateUtils.endOfMonth(date)];
42
+ return [startOfMonth(date), endOfMonth(date)];
63
43
  };
64
44
  export var getWeekHoverRange = function getWeekHoverRange(isoWeek, date) {
65
45
  if (isoWeek) {
66
46
  // set to the first day of this week according to ISO 8601, 12:00 am
67
- return [DateUtils.startOfISOWeek(date), DateUtils.endOfISOWeek(date)];
47
+ return [startOfISOWeek(date), endOfISOWeek(date)];
68
48
  }
69
49
 
70
- return [DateUtils.startOfWeek(date), DateUtils.endOfWeek(date)];
50
+ return [startOfWeek(date), endOfWeek(date)];
71
51
  };
@@ -5,6 +5,7 @@ export interface ListItemProps extends WithAsProps, React.HTMLAttributes<HTMLEle
5
5
  index?: number;
6
6
  collection?: Collection;
7
7
  disabled?: boolean;
8
+ size?: 'lg' | 'md' | 'sm';
8
9
  }
9
10
  declare const ListItem: React.ForwardRefExoticComponent<ListItemProps & React.RefAttributes<HTMLDivElement>>;
10
11
  export default ListItem;
@@ -16,12 +16,15 @@ var ListItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
16
16
  collection = _props$collection === void 0 ? 0 : _props$collection,
17
17
  disabled = props.disabled,
18
18
  index = props.index,
19
- rest = _objectWithoutPropertiesLoose(props, ["as", "children", "className", "classPrefix", "collection", "disabled", "index"]);
19
+ sizeProp = props.size,
20
+ rest = _objectWithoutPropertiesLoose(props, ["as", "children", "className", "classPrefix", "collection", "disabled", "index", "size"]);
20
21
 
21
22
  var _useContext = useContext(ListContext),
22
23
  bordered = _useContext.bordered,
23
24
  register = _useContext.register,
24
- size = _useContext.size;
25
+ parentSize = _useContext.size;
26
+
27
+ var size = sizeProp || parentSize;
25
28
 
26
29
  var _useClassNames = useClassNames(classPrefix),
27
30
  withClassPrefix = _useClassNames.withClassPrefix,