rsuite 5.4.4 → 5.6.0

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 (91) hide show
  1. package/CHANGELOG.md +48 -0
  2. package/Carousel/styles/index.less +1 -0
  3. package/CheckTreePicker/styles/index.less +51 -50
  4. package/Modal/styles/mixin.less +1 -0
  5. package/Picker/styles/mixin.less +3 -2
  6. package/README.md +1 -1
  7. package/Sidenav/styles/index.less +54 -59
  8. package/TreePicker/styles/index.less +3 -3
  9. package/cjs/Affix/Affix.js +1 -0
  10. package/cjs/Calendar/TimeDropdown.js +7 -4
  11. package/cjs/Carousel/Carousel.d.ts +5 -1
  12. package/cjs/Carousel/Carousel.js +22 -16
  13. package/cjs/Cascader/Cascader.js +2 -2
  14. package/cjs/Cascader/DropdownMenu.js +1 -1
  15. package/cjs/CheckTreePicker/CheckTreePicker.js +17 -12
  16. package/cjs/CheckTreePicker/utils.d.ts +3 -3
  17. package/cjs/CheckTreePicker/utils.js +2 -2
  18. package/cjs/DOMHelper/index.d.ts +4 -4
  19. package/cjs/DatePicker/DatePicker.js +15 -9
  20. package/cjs/DateRangePicker/Calendar.js +2 -16
  21. package/cjs/DateRangePicker/DateRangePicker.js +1 -1
  22. package/cjs/Dropdown/Dropdown.d.ts +5 -0
  23. package/cjs/Dropdown/test/Dropdown.test.d.ts +1 -0
  24. package/cjs/Dropdown/test/Dropdown.test.js +30 -0
  25. package/cjs/InputNumber/InputNumber.d.ts +1 -1
  26. package/cjs/InputNumber/InputNumber.js +36 -6
  27. package/cjs/InputNumber/test/InputNumber.test.d.ts +1 -0
  28. package/cjs/InputNumber/test/InputNumber.test.js +14 -0
  29. package/cjs/InputPicker/InputAutosize.js +3 -1
  30. package/cjs/InputPicker/InputPicker.js +6 -2
  31. package/cjs/List/ListItem.js +13 -11
  32. package/cjs/Menu/MenuItem.js +14 -11
  33. package/cjs/MultiCascader/MultiCascader.js +1 -0
  34. package/cjs/Picker/PickerOverlay.js +4 -1
  35. package/cjs/RangeSlider/RangeSlider.d.ts +12 -2
  36. package/cjs/RangeSlider/RangeSlider.js +35 -12
  37. package/cjs/Ripple/Ripple.js +17 -9
  38. package/cjs/TreePicker/TreePicker.js +15 -11
  39. package/cjs/Uploader/UploadTrigger.js +3 -1
  40. package/cjs/Uploader/Uploader.js +3 -1
  41. package/cjs/utils/treeUtils.d.ts +3 -3
  42. package/cjs/utils/treeUtils.js +4 -3
  43. package/cjs/utils/useElementResize.d.ts +1 -1
  44. package/cjs/utils/useElementResize.js +5 -2
  45. package/dist/rsuite-rtl.css +114 -123
  46. package/dist/rsuite-rtl.min.css +1 -1
  47. package/dist/rsuite-rtl.min.css.map +1 -1
  48. package/dist/rsuite.css +114 -123
  49. package/dist/rsuite.js +372 -53
  50. package/dist/rsuite.js.map +1 -1
  51. package/dist/rsuite.min.css +1 -1
  52. package/dist/rsuite.min.css.map +1 -1
  53. package/dist/rsuite.min.js +1 -1
  54. package/dist/rsuite.min.js.map +1 -1
  55. package/esm/Affix/Affix.js +1 -0
  56. package/esm/Calendar/TimeDropdown.js +7 -4
  57. package/esm/Carousel/Carousel.d.ts +5 -1
  58. package/esm/Carousel/Carousel.js +23 -17
  59. package/esm/Cascader/Cascader.js +2 -2
  60. package/esm/Cascader/DropdownMenu.js +1 -1
  61. package/esm/CheckTreePicker/CheckTreePicker.js +17 -12
  62. package/esm/CheckTreePicker/utils.d.ts +3 -3
  63. package/esm/CheckTreePicker/utils.js +2 -2
  64. package/esm/DOMHelper/index.d.ts +4 -4
  65. package/esm/DatePicker/DatePicker.js +15 -9
  66. package/esm/DateRangePicker/Calendar.js +2 -16
  67. package/esm/DateRangePicker/DateRangePicker.js +1 -1
  68. package/esm/Dropdown/Dropdown.d.ts +5 -0
  69. package/esm/Dropdown/test/Dropdown.test.d.ts +1 -0
  70. package/esm/Dropdown/test/Dropdown.test.js +22 -0
  71. package/esm/InputNumber/InputNumber.d.ts +1 -1
  72. package/esm/InputNumber/InputNumber.js +38 -7
  73. package/esm/InputNumber/test/InputNumber.test.d.ts +1 -0
  74. package/esm/InputNumber/test/InputNumber.test.js +7 -0
  75. package/esm/InputPicker/InputAutosize.js +3 -1
  76. package/esm/InputPicker/InputPicker.js +6 -2
  77. package/esm/List/ListItem.js +13 -11
  78. package/esm/Menu/MenuItem.js +14 -11
  79. package/esm/MultiCascader/MultiCascader.js +1 -0
  80. package/esm/Picker/PickerOverlay.js +4 -1
  81. package/esm/RangeSlider/RangeSlider.d.ts +12 -2
  82. package/esm/RangeSlider/RangeSlider.js +35 -12
  83. package/esm/Ripple/Ripple.js +17 -9
  84. package/esm/TreePicker/TreePicker.js +15 -11
  85. package/esm/Uploader/UploadTrigger.js +3 -1
  86. package/esm/Uploader/Uploader.js +3 -1
  87. package/esm/utils/treeUtils.d.ts +3 -3
  88. package/esm/utils/treeUtils.js +6 -3
  89. package/esm/utils/useElementResize.d.ts +1 -1
  90. package/esm/utils/useElementResize.js +5 -2
  91. package/package.json +3 -3
@@ -13,15 +13,15 @@ declare const DOMHelper: {
13
13
  cancelAnimationFramePolyfill: typeof clearTimeout;
14
14
  requestAnimationFramePolyfill: typeof requestAnimationFrame;
15
15
  getAnimationEnd: typeof helpers.getAnimationEnd;
16
- ownerDocument: (node: Element) => Document;
16
+ ownerDocument: (node: Element | null) => Document;
17
17
  ownerWindow: (componentOrElement: Element) => Window;
18
18
  getWindow: (node: any) => Window;
19
- getContainer: (container: Element | (() => Element), defaultContainer?: Element | undefined) => Element;
19
+ getContainer: (container: Element | (() => Element | null) | null, defaultContainer?: Element | undefined) => Element;
20
20
  canUseDOM: boolean;
21
21
  contains: (context: Element, node: Node & ParentNode) => boolean;
22
22
  scrollTop: (node: Element, val?: number | undefined) => number;
23
23
  scrollLeft: (node: Element, val?: number | undefined) => number;
24
- getOffset: (node: Element) => {
24
+ getOffset: (node: Element | null) => {
25
25
  top: number;
26
26
  left: number;
27
27
  height: number;
@@ -42,7 +42,7 @@ declare const DOMHelper: {
42
42
  isFocusable: typeof helpers.isFocusable;
43
43
  getStyle: (node: Element, property?: string | undefined) => string | CSSStyleDeclaration;
44
44
  removeStyle: (node: Element, keys: string | string[]) => void;
45
- addStyle: (node: Element, property: string | import("dom-lib/esm/addStyle").CSSProperty, value?: string | number | undefined) => void;
45
+ addStyle: (node: Element, property: string | Partial<import("dom-lib/esm/addStyle").CSSProperty>, value?: string | number | undefined) => void;
46
46
  translateDOMPositionXY: (style: CSSStyleDeclaration, x?: number | undefined, y?: number | undefined) => CSSStyleDeclaration;
47
47
  };
48
48
  export default DOMHelper;
@@ -152,15 +152,6 @@ var DatePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
152
152
  onSelect === null || onSelect === void 0 ? void 0 : onSelect(nextValue, event);
153
153
  onChangeCalendarDate === null || onChangeCalendarDate === void 0 ? void 0 : onChangeCalendarDate(nextValue, event);
154
154
  }, [onChangeCalendarDate, onSelect]);
155
- /**
156
- * A callback triggered when the date on the calendar changes.
157
- */
158
-
159
- var handleChangePageDate = (0, _react.useCallback)(function (nextPageDate) {
160
- setCalendarDate(nextPageDate);
161
- reset();
162
- handleDateChange(nextPageDate);
163
- }, [handleDateChange, reset, setCalendarDate]);
164
155
  /**
165
156
  * A callback triggered when the time on the calendar changes.
166
157
  */
@@ -288,6 +279,21 @@ var DatePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
288
279
  updateValue(event, nextValue);
289
280
  }
290
281
  }, [formatStr, handleDateChange, oneTap, calendarDate, setCalendarDate, updateValue]);
282
+ /**
283
+ * A callback triggered when the date on the calendar changes.
284
+ */
285
+
286
+ var handleChangePageDate = (0, _react.useCallback)(function (nextPageDate, event) {
287
+ setCalendarDate(nextPageDate);
288
+ reset();
289
+ handleDateChange(nextPageDate); // Show only the calendar month panel. formatStr = 'yyyy-MM'
290
+
291
+ var onlyShowMonth = _utils.DateUtils.shouldMonth(formatStr) && !_utils.DateUtils.shouldDate(formatStr);
292
+
293
+ if (oneTap && onlyShowMonth) {
294
+ updateValue(event, nextPageDate);
295
+ }
296
+ }, [formatStr, handleDateChange, oneTap, reset, setCalendarDate, updateValue]);
291
297
  var disabledDate = (0, _react.useCallback)(function (date) {
292
298
  var _disabledDateProp;
293
299
 
@@ -114,22 +114,8 @@ var Calendar = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
114
114
  return !after;
115
115
  }, [calendarDate, index, showOneCalendar]);
116
116
  var disabledMonth = (0, _react.useCallback)(function (date) {
117
- var after;
118
-
119
- if (disabledDate !== null && disabledDate !== void 0 && disabledDate(date, value, _utils.DATERANGE_DISABLED_TARGET.CALENDAR)) {
120
- return true;
121
- }
122
-
123
- if (showOneCalendar) return false;
124
-
125
- if (index === 1) {
126
- after = (0, _dateUtils.isAfter)(date, calendarDate[0]);
127
- return !after;
128
- }
129
-
130
- after = (0, _dateUtils.isAfter)(calendarDate[1], date);
131
- return !after;
132
- }, [calendarDate, disabledDate, index, showOneCalendar, value]);
117
+ return disabledDate === null || disabledDate === void 0 ? void 0 : disabledDate(date, value, _utils.DATERANGE_DISABLED_TARGET.CALENDAR);
118
+ }, [disabledDate, value]);
133
119
  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {
134
120
  format: format,
135
121
  calendarState: calendarState,
@@ -276,7 +276,7 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
276
276
 
277
277
  if (!hasDoneSelect.current) {
278
278
  // If `hoverRange` is set, you need to change the value of hoverDateRange according to the rules
279
- if (!(0, _isNil.default)(nextHoverDateRange)) {
279
+ if (!(0, _isNil.default)(nextHoverDateRange) && !(0, _isNil.default)(selectRangeValueRef.current)) {
280
280
  var nextSelectedDates = [selectRangeValueRef.current[0], nextHoverDateRange[1]];
281
281
 
282
282
  if (_utils.DateUtils.isBefore(nextHoverDateRange[0], selectRangeValueRef.current[0])) {
@@ -3,6 +3,7 @@ import DropdownMenu from './DropdownMenu';
3
3
  import { TypeAttributes, WithAsProps, RsRefForwardingComponent } from '../@types/common';
4
4
  import { IconProps } from '@rsuite/icons/lib/Icon';
5
5
  import DropdownItem from './DropdownItem';
6
+ import Button from '../Button';
6
7
  export declare type DropdownTrigger = 'click' | 'hover' | 'contextMenu';
7
8
  export interface DropdownProps<T = any> extends WithAsProps, Omit<React.HTMLAttributes<HTMLElement>, 'onSelect' | 'title'> {
8
9
  /** Define the title as a submenu */
@@ -48,6 +49,10 @@ export interface DropdownProps<T = any> extends WithAsProps, Omit<React.HTMLAttr
48
49
  onSelect?: (eventKey: T | undefined, event: React.SyntheticEvent) => void;
49
50
  }
50
51
  export interface DropdownComponent extends RsRefForwardingComponent<'div', DropdownProps> {
52
+ <ToggleAs extends React.ElementType = typeof Button>(props: DropdownProps & {
53
+ ref?: React.Ref<any>;
54
+ toggleAs?: ToggleAs;
55
+ } & React.ComponentProps<ToggleAs>, context: any): JSX.Element | null;
51
56
  Item: typeof DropdownItem;
52
57
  Menu: typeof DropdownMenu;
53
58
  }
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,30 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ var _react = _interopRequireDefault(require("react"));
6
+
7
+ var _Dropdown = _interopRequireDefault(require("../Dropdown"));
8
+
9
+ var ref = /*#__PURE__*/_react.default.createRef(); // Infer `toggleAs` props (defaults to Button)
10
+
11
+
12
+ /*#__PURE__*/
13
+ _react.default.createElement(_Dropdown.default, {
14
+ ref: ref,
15
+ appearance: "subtle",
16
+ size: "sm"
17
+ });
18
+ /* eslint-disable @typescript-eslint/no-unused-vars */
19
+
20
+
21
+ var CustomToggle = function CustomToggle(_props) {
22
+ return null;
23
+ };
24
+
25
+ /*#__PURE__*/
26
+ _react.default.createElement(_Dropdown.default, {
27
+ ref: ref,
28
+ toggleAs: CustomToggle,
29
+ myProp: "myValue"
30
+ });
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import { WithAsProps, TypeAttributes, FormControlBaseProps } from '../@types/common';
3
- export interface InputNumberProps<T = number | string> extends WithAsProps, FormControlBaseProps<T> {
3
+ export interface InputNumberProps<T = number | string> extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'value' | 'defaultValue' | 'onChange' | 'size' | 'prefix'>, WithAsProps, FormControlBaseProps<T> {
4
4
  /** Button can have different appearances */
5
5
  buttonAppearance?: TypeAttributes.Appearance;
6
6
  /** An input can show that it is disabled */
@@ -114,15 +114,15 @@ var InputNumber = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
114
114
  step = _props$step === void 0 ? 1 : _props$step,
115
115
  _props$buttonAppearan = props.buttonAppearance,
116
116
  buttonAppearance = _props$buttonAppearan === void 0 ? 'subtle' : _props$buttonAppearan,
117
- _props$min = props.min,
118
- min = _props$min === void 0 ? -Infinity : _props$min,
119
- _props$max = props.max,
120
- max = _props$max === void 0 ? Infinity : _props$max,
117
+ minProp = props.min,
118
+ maxProp = props.max,
121
119
  _props$scrollable = props.scrollable,
122
120
  scrollable = _props$scrollable === void 0 ? true : _props$scrollable,
123
121
  onChange = props.onChange,
124
122
  onWheel = props.onWheel,
125
123
  restProps = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "className", "classPrefix", "disabled", "readOnly", "plaintext", "value", "defaultValue", "size", "prefix", "postfix", "step", "buttonAppearance", "min", "max", "scrollable", "onChange", "onWheel"]);
124
+ var min = minProp !== null && minProp !== void 0 ? minProp : -Infinity;
125
+ var max = maxProp !== null && maxProp !== void 0 ? maxProp : Infinity;
126
126
 
127
127
  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue),
128
128
  value = _useControlled[0],
@@ -187,6 +187,35 @@ var InputNumber = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
187
187
  var bit = decimals(val, step);
188
188
  handleChangeValue(getSafeValue((val - step).toFixed(bit)), event);
189
189
  }, [getSafeValue, handleChangeValue, step, value]);
190
+ var handleKeyDown = (0, _react.useCallback)(function (event) {
191
+ switch (event.key) {
192
+ case _utils.KEY_VALUES.UP:
193
+ event.preventDefault();
194
+ handlePlus(event);
195
+ break;
196
+
197
+ case _utils.KEY_VALUES.DOWN:
198
+ event.preventDefault();
199
+ handleMinus(event);
200
+ break;
201
+
202
+ case _utils.KEY_VALUES.HOME:
203
+ if (typeof minProp !== 'undefined') {
204
+ event.preventDefault();
205
+ handleChangeValue(getSafeValue(minProp), event);
206
+ }
207
+
208
+ break;
209
+
210
+ case _utils.KEY_VALUES.END:
211
+ if (typeof maxProp !== 'undefined') {
212
+ event.preventDefault();
213
+ handleChangeValue(getSafeValue(maxProp), event);
214
+ }
215
+
216
+ break;
217
+ }
218
+ }, [handlePlus, handleMinus, minProp, maxProp, handleChangeValue, getSafeValue]);
190
219
  var handleWheel = (0, _react.useCallback)(function (event) {
191
220
  if (!disabled && !readOnly && event.target === document.activeElement) {
192
221
  event.preventDefault();
@@ -233,7 +262,7 @@ var InputNumber = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
233
262
  }, [handleWheel, scrollable]);
234
263
 
235
264
  var input = /*#__PURE__*/_react.default.createElement(_Input.default, (0, _extends2.default)({}, htmlInputProps, {
236
- type: "text",
265
+ type: "number",
237
266
  autoComplete: "off",
238
267
  step: step,
239
268
  inputRef: inputRef,
@@ -243,7 +272,8 @@ var InputNumber = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
243
272
  disabled: disabled,
244
273
  readOnly: readOnly,
245
274
  plaintext: plaintext,
246
- ref: plaintext ? ref : undefined
275
+ ref: plaintext ? ref : undefined,
276
+ onKeyDown: handleKeyDown
247
277
  }));
248
278
 
249
279
  if (plaintext) {
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,14 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ var _react = _interopRequireDefault(require("react"));
6
+
7
+ var _InputNumber = _interopRequireDefault(require("../InputNumber"));
8
+
9
+ // Inherits <input type="number" /> attributes
10
+
11
+ /*#__PURE__*/
12
+ _react.default.createElement(_InputNumber.default, {
13
+ placeholder: "Enter number"
14
+ });
@@ -128,7 +128,9 @@ var InputAutosize = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
128
128
  return;
129
129
  }
130
130
 
131
- copyStyles(inputStyles, sizerRef.current);
131
+ if (sizerRef.current) {
132
+ copyStyles(inputStyles, sizerRef.current);
133
+ }
132
134
 
133
135
  if (placeholderRef.current) {
134
136
  copyStyles(inputStyles, placeholderRef.current);
@@ -417,7 +417,7 @@ var InputPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
417
417
  var allData = getAllData();
418
418
  var focusItem = allData.find(function (item) {
419
419
  return (0, _shallowEqual.default)(item[valueKey], focusItemValue);
420
- });
420
+ }); // FIXME Bad state flow
421
421
 
422
422
  if (!focusItem && focusItemValue === searchKeyword) {
423
423
  focusItem = createOption(searchKeyword);
@@ -425,7 +425,11 @@ var InputPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
425
425
 
426
426
  setValue(focusItemValue);
427
427
  setSearchKeyword('');
428
- handleSelect(focusItemValue, focusItem, event);
428
+
429
+ if (focusItem) {
430
+ handleSelect(focusItemValue, focusItem, event);
431
+ }
432
+
429
433
  handleChange(focusItemValue, event);
430
434
  handleClose();
431
435
  }, [setValue, disabledItemValues, controlledData, focusItemValue, valueKey, searchKeyword, handleClose, setSearchKeyword, createOption, getAllData, handleChange, handleSelect]);
@@ -43,18 +43,20 @@ var ListItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
43
43
 
44
44
  var listItemRef = (0, _react.useRef)(null);
45
45
  (0, _react.useEffect)(function () {
46
- var _register = register({
47
- node: listItemRef.current,
48
- edgeOffset: null,
49
- info: {
50
- collection: collection,
51
- disabled: disabled,
52
- index: index
53
- }
54
- }),
55
- unregister = _register.unregister;
46
+ if (listItemRef.current) {
47
+ var _register = register({
48
+ node: listItemRef.current,
49
+ edgeOffset: null,
50
+ info: {
51
+ collection: collection,
52
+ disabled: disabled,
53
+ index: index
54
+ }
55
+ }),
56
+ unregister = _register.unregister;
56
57
 
57
- return unregister;
58
+ return unregister;
59
+ }
58
60
  }, [collection, disabled, index, register]);
59
61
  var classes = merge(className, withClassPrefix(size, {
60
62
  disabled: disabled,
@@ -74,19 +74,22 @@ function MenuItem(props) {
74
74
  }, [dispatch]);
75
75
  (0, _react.useEffect)(function () {
76
76
  var menuitemElement = menuitemRef.current;
77
- dispatch({
78
- type: _MenuContext.MenuActionTypes.RegisterItem,
79
- element: menuitemElement,
80
- props: {
81
- disabled: disabled
82
- }
83
- });
84
- return function () {
77
+
78
+ if (menuitemElement) {
85
79
  dispatch({
86
- type: _MenuContext.MenuActionTypes.UnregisterItem,
87
- id: menuitemElement.id
80
+ type: _MenuContext.MenuActionTypes.RegisterItem,
81
+ element: menuitemElement,
82
+ props: {
83
+ disabled: disabled
84
+ }
88
85
  });
89
- };
86
+ return function () {
87
+ dispatch({
88
+ type: _MenuContext.MenuActionTypes.UnregisterItem,
89
+ id: menuitemElement.id
90
+ });
91
+ };
92
+ }
90
93
  }, [menuitemRef, disabled, dispatch]);
91
94
  var menuitemProps = {
92
95
  id: menuitemId,
@@ -482,6 +482,7 @@ var MultiCascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
482
482
  var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends3.default)({}, props, {
483
483
  classPrefix: classPrefix,
484
484
  hasValue: hasValue,
485
+ countable: countable,
485
486
  name: 'cascader',
486
487
  appearance: appearance,
487
488
  cleanable: cleanable
@@ -53,7 +53,10 @@ var PickerOverlay = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
53
53
  // Get the width value of the button,
54
54
  // and then set it to the menu to make their width consistent.
55
55
  var width = (0, _getWidth.default)((0, _utils.getDOMNode)(toggle.root));
56
- (0, _addStyle.default)(overlayRef.current, 'min-width', width + "px");
56
+
57
+ if (overlayRef.current) {
58
+ (0, _addStyle.default)(overlayRef.current, 'min-width', width + "px");
59
+ }
57
60
  }
58
61
  }, [autoWidth, target, overlayRef]);
59
62
 
@@ -1,6 +1,16 @@
1
1
  import React from 'react';
2
2
  import { SliderProps } from '../Slider';
3
3
  export declare type Range = [number, number];
4
- export declare type RangeSliderProps = SliderProps<Range>;
5
- declare const RangeSlider: React.ForwardRefExoticComponent<RangeSliderProps & React.RefAttributes<unknown>>;
4
+ export declare type RangeSliderProps = SliderProps<Range> & {
5
+ /**
6
+ * Add constraint to validate before onChange is dispatched
7
+ */
8
+ constraint?: (range: Range) => boolean;
9
+ };
10
+ declare const RangeSlider: React.ForwardRefExoticComponent<SliderProps<Range> & {
11
+ /**
12
+ * Add constraint to validate before onChange is dispatched
13
+ */
14
+ constraint?: ((range: Range) => boolean) | undefined;
15
+ } & React.RefAttributes<unknown>>;
6
16
  export default RangeSlider;
@@ -45,6 +45,7 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
45
45
  Component = _props$as === void 0 ? 'div' : _props$as,
46
46
  barClassName = props.barClassName,
47
47
  className = props.className,
48
+ constraint = props.constraint,
48
49
  _props$defaultValue = props.defaultValue,
49
50
  defaultValue = _props$defaultValue === void 0 ? defaultDefaultValue : _props$defaultValue,
50
51
  graduated = props.graduated,
@@ -71,7 +72,7 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
71
72
  renderMark = props.renderMark,
72
73
  onChange = props.onChange,
73
74
  onChangeCommitted = props.onChangeCommitted,
74
- rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["aria-label", "aria-labelledby", "aria-valuetext", "as", "barClassName", "className", "defaultValue", "graduated", "progress", "vertical", "disabled", "classPrefix", "min", "max", "step", "value", "handleClassName", "handleStyle", "handleTitle", "tooltip", "getAriaValueText", "renderTooltip", "renderMark", "onChange", "onChangeCommitted"]);
75
+ rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["aria-label", "aria-labelledby", "aria-valuetext", "as", "barClassName", "className", "constraint", "defaultValue", "graduated", "progress", "vertical", "disabled", "classPrefix", "min", "max", "step", "value", "handleClassName", "handleStyle", "handleTitle", "tooltip", "getAriaValueText", "renderTooltip", "renderMark", "onChange", "onChangeCommitted"]);
75
76
  var barRef = (0, _react.useRef)(null); // Define the parameter position of the handle
76
77
 
77
78
  var handleIndexs = (0, _react.useRef)([0, 1]);
@@ -180,14 +181,27 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
180
181
 
181
182
  return nextValue;
182
183
  }, [getRangeValue, getValidValue]);
184
+ /**
185
+ * Whether a range is valid against given constraint (if any)
186
+ * Should check before every `setValue` calls
187
+ */
188
+
189
+ var isRangeMatchingConstraint = (0, _react.useCallback)(function (range) {
190
+ // If no constraint is defined, any range is valid
191
+ if (!constraint) return true;
192
+ return constraint(range);
193
+ }, [constraint]);
183
194
  /**
184
195
  * Callback function that is fired when the mousemove is triggered
185
196
  */
186
197
 
187
198
  var handleDragMove = (0, _utils.useEventCallback)(function (event, dataset) {
188
199
  var nextValue = getNextValue(event, dataset);
189
- setValue(nextValue);
190
- onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
200
+
201
+ if (isRangeMatchingConstraint(nextValue)) {
202
+ setValue(nextValue);
203
+ onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
204
+ }
191
205
  });
192
206
  /**
193
207
  * Callback function that is fired when the mouseup is triggered
@@ -195,9 +209,12 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
195
209
 
196
210
  var handleChangeCommitted = (0, _react.useCallback)(function (event, dataset) {
197
211
  var nextValue = getNextValue(event, dataset);
198
- setValue(nextValue);
199
- onChangeCommitted === null || onChangeCommitted === void 0 ? void 0 : onChangeCommitted(nextValue, event);
200
- }, [getNextValue, onChangeCommitted, setValue]);
212
+
213
+ if (isRangeMatchingConstraint(nextValue)) {
214
+ setValue(nextValue);
215
+ onChangeCommitted === null || onChangeCommitted === void 0 ? void 0 : onChangeCommitted(nextValue, event);
216
+ }
217
+ }, [getNextValue, onChangeCommitted, isRangeMatchingConstraint, setValue]);
201
218
  var handleKeyDown = (0, _react.useCallback)(function (event) {
202
219
  var _event$target;
203
220
 
@@ -240,9 +257,12 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
240
257
 
241
258
 
242
259
  event.preventDefault();
243
- setValue(nextValue);
244
- onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
245
- }, [max, min, onChange, rtl, setValue, step, value]);
260
+
261
+ if (isRangeMatchingConstraint(nextValue)) {
262
+ setValue(nextValue);
263
+ onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
264
+ }
265
+ }, [max, min, onChange, rtl, isRangeMatchingConstraint, setValue, step, value]);
246
266
  var handleClick = (0, _react.useCallback)(function (event) {
247
267
  if (disabled) {
248
268
  return;
@@ -259,9 +279,12 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
259
279
  }
260
280
 
261
281
  var nextValue = getValidValue([start, end].sort());
262
- setValue(nextValue);
263
- onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
264
- }, [disabled, getValidValue, getValueByPosition, onChange, setValue, value]);
282
+
283
+ if (isRangeMatchingConstraint(nextValue)) {
284
+ setValue(nextValue);
285
+ onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
286
+ }
287
+ }, [disabled, getValidValue, getValueByPosition, isRangeMatchingConstraint, onChange, setValue, value]);
265
288
  var handleProps = (0, _react.useMemo)(function () {
266
289
  return [{
267
290
  value: value[0],
@@ -68,17 +68,25 @@ var Ripple = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
68
68
  };
69
69
 
70
70
  var handleMouseDown = (0, _react.useCallback)(function (event) {
71
- var position = getPosition(triggerRef.current, event);
72
- setRippling(true);
73
- setPosition(position);
74
- onMouseDown === null || onMouseDown === void 0 ? void 0 : onMouseDown(position, event);
71
+ if (triggerRef.current) {
72
+ var _position = getPosition(triggerRef.current, event);
73
+
74
+ setRippling(true);
75
+ setPosition(_position);
76
+ onMouseDown === null || onMouseDown === void 0 ? void 0 : onMouseDown(_position, event);
77
+ }
75
78
  }, [onMouseDown]);
76
79
  (0, _react.useEffect)(function () {
77
- var parentNode = triggerRef.current.parentNode;
78
- var mousedownListener = (0, _on.default)(parentNode, 'mousedown', handleMouseDown);
79
- return function () {
80
- mousedownListener === null || mousedownListener === void 0 ? void 0 : mousedownListener.off();
81
- };
80
+ var _triggerRef$current;
81
+
82
+ var parentNode = (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : _triggerRef$current.parentNode;
83
+
84
+ if (parentNode) {
85
+ var mousedownListener = (0, _on.default)(parentNode, 'mousedown', handleMouseDown);
86
+ return function () {
87
+ mousedownListener === null || mousedownListener === void 0 ? void 0 : mousedownListener.off();
88
+ };
89
+ }
82
90
  }, [handleMouseDown]);
83
91
  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {
84
92
  className: classes,
@@ -83,11 +83,13 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
83
83
  _props$childrenKey = props.childrenKey,
84
84
  childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,
85
85
  draggable = props.draggable,
86
- defaultExpandAll = props.defaultExpandAll,
86
+ _props$defaultExpandA = props.defaultExpandAll,
87
+ defaultExpandAll = _props$defaultExpandA === void 0 ? false : _props$defaultExpandA,
87
88
  _props$disabledItemVa = props.disabledItemValues,
88
89
  disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,
89
90
  controlledExpandItemValues = props.expandItemValues,
90
- defaultExpandItemValues = props.defaultExpandItemValues,
91
+ _props$defaultExpandI = props.defaultExpandItemValues,
92
+ defaultExpandItemValues = _props$defaultExpandI === void 0 ? emptyArray : _props$defaultExpandI,
91
93
  id = props.id,
92
94
  listProps = props.listProps,
93
95
  getChildren = props.getChildren,
@@ -222,15 +224,17 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
222
224
  });
223
225
  }, [searchKeywordState, expandItemValues, filteredData, flattenNodes, formatVirtualizedTreeData, virtualized]);
224
226
  var focusActiveNode = (0, _react.useCallback)(function () {
225
- (0, _treeUtils.focusToActiveTreeNode)({
226
- list: listRef.current,
227
- valueKey: valueKey,
228
- selector: "." + treePrefix('node-active'),
229
- activeNode: activeNode,
230
- virtualized: virtualized,
231
- container: treeViewRef.current,
232
- formattedNodes: getFormattedNodes()
233
- });
227
+ if (listRef.current) {
228
+ (0, _treeUtils.focusToActiveTreeNode)({
229
+ list: listRef.current,
230
+ valueKey: valueKey,
231
+ selector: "." + treePrefix('node-active'),
232
+ activeNode: activeNode,
233
+ virtualized: virtualized,
234
+ container: treeViewRef.current,
235
+ formattedNodes: getFormattedNodes()
236
+ });
237
+ }
234
238
  }, [treePrefix, activeNode, getFormattedNodes, valueKey, virtualized]);
235
239
  (0, _react.useEffect)(function () {
236
240
  setFilteredData(data, searchKeywordState);
@@ -69,7 +69,9 @@ var UploadTrigger = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
69
69
  (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.click();
70
70
  }, []);
71
71
  var handleClearInput = (0, _react.useCallback)(function () {
72
- inputRef.current.value = '';
72
+ if (inputRef.current) {
73
+ inputRef.current.value = '';
74
+ }
73
75
  }, []);
74
76
  var handleDragEnter = (0, _react.useCallback)(function (event) {
75
77
  if (draggable) {
@@ -205,7 +205,9 @@ var Uploader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
205
205
  */
206
206
 
207
207
  var cleanInputValue = (0, _react.useCallback)(function () {
208
- trigger.current.clearInput();
208
+ var _trigger$current;
209
+
210
+ (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : _trigger$current.clearInput();
209
211
  }, []);
210
212
  /**
211
213
  * Callback for successful file upload.
@@ -38,7 +38,7 @@ export declare function hasVisibleChildren(node: TreeNodeType, childrenKey: stri
38
38
  * @param b
39
39
  */
40
40
  export declare function compareArray(a: any[], b: any[]): boolean;
41
- export declare function getDefaultExpandItemValues(data: ItemDataType[], props: Pick<TreePickerProps, 'defaultExpandAll' | 'valueKey' | 'childrenKey' | 'defaultExpandItemValues'>): any[];
41
+ export declare function getDefaultExpandItemValues(data: ItemDataType[], props: Required<Pick<TreePickerProps, 'defaultExpandAll' | 'valueKey' | 'childrenKey' | 'defaultExpandItemValues'>>): any[];
42
42
  /**
43
43
  * 获取 expandItemValues 的 value
44
44
  * @param props
@@ -70,7 +70,7 @@ export declare function filterNodesOfTree(data: any, check: any): TreeNodeType[]
70
70
  * @param isSearching - component is in Searching
71
71
  * @returns
72
72
  */
73
- export declare const getFocusableItems: (filteredData: ItemDataType[], props: PartialTreeProps, isSearching?: boolean | undefined) => TreeNodeType[];
73
+ export declare const getFocusableItems: (filteredData: ItemDataType[], props: Required<Pick<PartialTreeProps, 'disabledItemValues' | 'valueKey' | 'childrenKey' | 'expandItemValues'>>, isSearching?: boolean | undefined) => TreeNodeType[];
74
74
  /**
75
75
  * return all focusable Item and active Element index
76
76
  * @param focusItemValue
@@ -235,7 +235,7 @@ export interface FocusToTreeNodeProps {
235
235
  valueKey: string;
236
236
  activeNode: any;
237
237
  virtualized: boolean;
238
- container: HTMLDivElement;
238
+ container: HTMLElement | null;
239
239
  list: ListInstance;
240
240
  formattedNodes: TreeNodeType[];
241
241
  }