rsuite 5.5.2 → 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 (53) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/README.md +1 -1
  3. package/cjs/Affix/Affix.js +1 -0
  4. package/cjs/Calendar/TimeDropdown.js +7 -4
  5. package/cjs/Carousel/Carousel.d.ts +5 -1
  6. package/cjs/Carousel/Carousel.js +22 -16
  7. package/cjs/Cascader/DropdownMenu.js +1 -1
  8. package/cjs/CheckTreePicker/CheckTreePicker.js +17 -12
  9. package/cjs/CheckTreePicker/utils.d.ts +3 -3
  10. package/cjs/CheckTreePicker/utils.js +2 -2
  11. package/cjs/DOMHelper/index.d.ts +4 -4
  12. package/cjs/DatePicker/DatePicker.js +15 -9
  13. package/cjs/DateRangePicker/DateRangePicker.js +1 -1
  14. package/cjs/InputPicker/InputAutosize.js +3 -1
  15. package/cjs/InputPicker/InputPicker.js +6 -2
  16. package/cjs/List/ListItem.js +13 -11
  17. package/cjs/Menu/MenuItem.js +14 -11
  18. package/cjs/Picker/PickerOverlay.js +4 -1
  19. package/cjs/Ripple/Ripple.js +17 -9
  20. package/cjs/TreePicker/TreePicker.js +15 -11
  21. package/cjs/Uploader/UploadTrigger.js +3 -1
  22. package/cjs/Uploader/Uploader.js +3 -1
  23. package/cjs/utils/treeUtils.d.ts +3 -3
  24. package/cjs/utils/useElementResize.d.ts +1 -1
  25. package/cjs/utils/useElementResize.js +5 -2
  26. package/dist/rsuite.js +365 -46
  27. package/dist/rsuite.js.map +1 -1
  28. package/dist/rsuite.min.js +1 -1
  29. package/dist/rsuite.min.js.map +1 -1
  30. package/esm/Affix/Affix.js +1 -0
  31. package/esm/Calendar/TimeDropdown.js +7 -4
  32. package/esm/Carousel/Carousel.d.ts +5 -1
  33. package/esm/Carousel/Carousel.js +23 -17
  34. package/esm/Cascader/DropdownMenu.js +1 -1
  35. package/esm/CheckTreePicker/CheckTreePicker.js +17 -12
  36. package/esm/CheckTreePicker/utils.d.ts +3 -3
  37. package/esm/CheckTreePicker/utils.js +2 -2
  38. package/esm/DOMHelper/index.d.ts +4 -4
  39. package/esm/DatePicker/DatePicker.js +15 -9
  40. package/esm/DateRangePicker/DateRangePicker.js +1 -1
  41. package/esm/InputPicker/InputAutosize.js +3 -1
  42. package/esm/InputPicker/InputPicker.js +6 -2
  43. package/esm/List/ListItem.js +13 -11
  44. package/esm/Menu/MenuItem.js +14 -11
  45. package/esm/Picker/PickerOverlay.js +4 -1
  46. package/esm/Ripple/Ripple.js +17 -9
  47. package/esm/TreePicker/TreePicker.js +15 -11
  48. package/esm/Uploader/UploadTrigger.js +3 -1
  49. package/esm/Uploader/Uploader.js +3 -1
  50. package/esm/utils/treeUtils.d.ts +3 -3
  51. package/esm/utils/useElementResize.d.ts +1 -1
  52. package/esm/utils/useElementResize.js +5 -2
  53. package/package.json +3 -3
@@ -14,6 +14,7 @@ function useOffset(mountRef) {
14
14
  setOffset = _useState[1];
15
15
 
16
16
  var updateOffset = useCallback(function () {
17
+ // FIXME upgrade dom-lib
17
18
  setOffset(getOffset(mountRef.current));
18
19
  }, [mountRef]); // Update after the element size changes
19
20
 
@@ -78,10 +78,11 @@ var scrollTo = function scrollTo(time, row) {
78
78
  var node = container === null || container === void 0 ? void 0 : container.querySelector("[data-key=\"" + type + "-" + value + "\"]");
79
79
 
80
80
  if (node && container) {
81
- var _ref2 = getPosition(node, container),
82
- top = _ref2.top;
81
+ var position = getPosition(node, container);
83
82
 
84
- scrollTopAnimation(container, top, scrollTop(container) !== 0);
83
+ if (position) {
84
+ scrollTopAnimation(container, position.top, scrollTop(container) !== 0);
85
+ }
85
86
  }
86
87
  });
87
88
  };
@@ -111,7 +112,9 @@ var TimeDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
111
112
  showMeridian: showMeridian
112
113
  }); // The currently selected time scrolls to the visible range.
113
114
 
114
- show && scrollTo(time, rowRef.current);
115
+ if (show && rowRef.current) {
116
+ scrollTo(time, rowRef.current);
117
+ }
115
118
  }, [date, format, show, showMeridian]);
116
119
 
117
120
  var handleClick = function handleClick(type, d, event) {
@@ -9,7 +9,11 @@ export interface CarouselProps extends WithAsProps {
9
9
  placement?: 'top' | 'bottom' | 'left' | 'right';
10
10
  /** Button shape */
11
11
  shape?: 'dot' | 'bar';
12
- /** Callback fired when the active item changes */
12
+ /** Active element index */
13
+ activeIndex?: number;
14
+ /** Defaul initial index */
15
+ defaultActiveIndex?: number;
16
+ /** Callback fired when the active item manually changes */
13
17
  onSelect?: (index: number, event: React.ChangeEvent<HTMLInputElement>) => void;
14
18
  /** Callback fired when a slide transition starts */
15
19
  onSlideStart?: (index: number, event?: React.ChangeEvent<HTMLInputElement>) => void;
@@ -3,7 +3,7 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
3
3
  import React, { useState, useMemo, useCallback, useRef } from 'react';
4
4
  import PropTypes from 'prop-types';
5
5
  import classNames from 'classnames';
6
- import { useClassNames, useCustom, guid, ReactChildren, useTimeout, mergeRefs } from '../utils';
6
+ import { useClassNames, useCustom, guid, ReactChildren, useTimeout, mergeRefs, useControlled } from '../utils';
7
7
  var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
8
8
  var _sliderStyles, _ref;
9
9
 
@@ -20,10 +20,13 @@ var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
20
20
  autoplay = props.autoplay,
21
21
  _props$autoplayInterv = props.autoplayInterval,
22
22
  autoplayInterval = _props$autoplayInterv === void 0 ? 4000 : _props$autoplayInterv,
23
+ activeIndexProp = props.activeIndex,
24
+ _props$defaultActiveI = props.defaultActiveIndex,
25
+ defaultActiveIndex = _props$defaultActiveI === void 0 ? 0 : _props$defaultActiveI,
23
26
  onSelect = props.onSelect,
24
27
  onSlideStart = props.onSlideStart,
25
28
  onSlideEnd = props.onSlideEnd,
26
- rest = _objectWithoutPropertiesLoose(props, ["as", "children", "classPrefix", "className", "placement", "shape", "autoplay", "autoplayInterval", "onSelect", "onSlideStart", "onSlideEnd"]);
29
+ rest = _objectWithoutPropertiesLoose(props, ["as", "children", "classPrefix", "className", "placement", "shape", "autoplay", "autoplayInterval", "activeIndex", "defaultActiveIndex", "onSelect", "onSlideStart", "onSlideEnd"]);
27
30
 
28
31
  var _useCustom = useCustom('Carousel'),
29
32
  rtl = _useCustom.rtl;
@@ -38,17 +41,24 @@ var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
38
41
  var vertical = placement === 'left' || placement === 'right';
39
42
  var lengthKey = vertical ? 'height' : 'width';
40
43
 
44
+ var _useControlled = useControlled(activeIndexProp, defaultActiveIndex),
45
+ activeIndex = _useControlled[0],
46
+ setActiveIndex = _useControlled[1];
47
+
41
48
  var _useState = useState(0),
42
- activeIndex = _useState[0],
43
- setActiveIndex = _useState[1];
49
+ lastIndex = _useState[0],
50
+ setLastIndex = _useState[1];
44
51
 
45
- var _useState2 = useState(0),
46
- lastIndex = _useState2[0],
47
- setLastIndex = _useState2[1];
52
+ var rootRef = useRef(null); // Set a timer for automatic playback.
53
+ // `autoplay` needs to be cast to boolean type to avoid undefined parameters.
48
54
 
49
- var rootRef = useRef(null);
55
+ var _useTimeout = useTimeout(function () {
56
+ return handleSlide();
57
+ }, autoplayInterval, !!autoplay && count > 1),
58
+ clear = _useTimeout.clear,
59
+ reset = _useTimeout.reset;
50
60
 
51
- var handleSlide = function handleSlide(nextActiveIndex, event) {
61
+ var handleSlide = useCallback(function (nextActiveIndex, event) {
52
62
  if (!rootRef.current) {
53
63
  return;
54
64
  }
@@ -61,7 +71,7 @@ var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
61
71
  onSlideStart === null || onSlideStart === void 0 ? void 0 : onSlideStart(nextIndex, event);
62
72
  setLastIndex(nextActiveIndex == null ? activeIndex : nextIndex);
63
73
  reset();
64
- };
74
+ }, [activeIndex, count, setActiveIndex, clear, onSlideStart, reset]);
65
75
 
66
76
  var handleChange = function handleChange(event) {
67
77
  var activeIndex = +event.target.value;
@@ -71,13 +81,7 @@ var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
71
81
 
72
82
  var handleTransitionEnd = useCallback(function (event) {
73
83
  onSlideEnd === null || onSlideEnd === void 0 ? void 0 : onSlideEnd(activeIndex, event);
74
- }, [activeIndex, onSlideEnd]); // Set a timer for automatic playback.
75
- // `autoplay` needs to be cast to boolean type to avoid undefined parameters.
76
-
77
- var _useTimeout = useTimeout(handleSlide, autoplayInterval, !!autoplay && count > 1),
78
- clear = _useTimeout.clear,
79
- reset = _useTimeout.reset;
80
-
84
+ }, [activeIndex, onSlideEnd]);
81
85
  var uniqueId = useMemo(function () {
82
86
  return guid();
83
87
  }, []);
@@ -146,6 +150,8 @@ Carousel.propTypes = {
146
150
  as: PropTypes.elementType,
147
151
  className: PropTypes.string,
148
152
  classPrefix: PropTypes.string,
153
+ activeIndex: PropTypes.number,
154
+ defaultActiveIndex: PropTypes.number,
149
155
  autoplay: PropTypes.bool,
150
156
  autoplayInterval: PropTypes.number,
151
157
  placement: PropTypes.oneOf(['top', 'bottom', 'left', 'right']),
@@ -64,7 +64,7 @@ var DropdownMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
64
64
  if (activeItem) {
65
65
  var position = getPosition(activeItem, column); // Let the active option scroll into view.
66
66
 
67
- scrollTop(column, position.top);
67
+ scrollTop(column, position === null || position === void 0 ? void 0 : position.top);
68
68
  }
69
69
  });
70
70
  }, [prefix]);
@@ -51,17 +51,20 @@ var CheckTreePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
51
51
  controlledValue = props.value,
52
52
  _props$defaultValue = props.defaultValue,
53
53
  defaultValue = _props$defaultValue === void 0 ? emptyArray : _props$defaultValue,
54
- defaultExpandAll = props.defaultExpandAll,
54
+ _props$defaultExpandA = props.defaultExpandAll,
55
+ defaultExpandAll = _props$defaultExpandA === void 0 ? false : _props$defaultExpandA,
55
56
  _props$disabledItemVa = props.disabledItemValues,
56
57
  disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,
57
58
  controlledExpandItemValues = props.expandItemValues,
58
- defaultExpandItemValues = props.defaultExpandItemValues,
59
+ _props$defaultExpandI = props.defaultExpandItemValues,
60
+ defaultExpandItemValues = _props$defaultExpandI === void 0 ? emptyArray : _props$defaultExpandI,
59
61
  _props$height = props.height,
60
62
  height = _props$height === void 0 ? 360 : _props$height,
61
63
  menuStyle = props.menuStyle,
62
64
  _props$searchable = props.searchable,
63
65
  searchable = _props$searchable === void 0 ? true : _props$searchable,
64
- virtualized = props.virtualized,
66
+ _props$virtualized = props.virtualized,
67
+ virtualized = _props$virtualized === void 0 ? false : _props$virtualized,
65
68
  className = props.className,
66
69
  _props$classPrefix = props.classPrefix,
67
70
  classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,
@@ -243,15 +246,17 @@ var CheckTreePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
243
246
  };
244
247
 
245
248
  var focusActiveNode = useCallback(function () {
246
- focusToActiveTreeNode({
247
- list: listRef.current,
248
- valueKey: valueKey,
249
- selector: "." + checkTreePrefix('node-active'),
250
- activeNode: activeNode,
251
- virtualized: virtualized,
252
- container: treeViewRef.current,
253
- formattedNodes: getFormattedNodes()
254
- });
249
+ if (listRef.current) {
250
+ focusToActiveTreeNode({
251
+ list: listRef.current,
252
+ valueKey: valueKey,
253
+ selector: "." + checkTreePrefix('node-active'),
254
+ activeNode: activeNode,
255
+ virtualized: virtualized,
256
+ container: treeViewRef.current,
257
+ formattedNodes: getFormattedNodes()
258
+ });
259
+ }
255
260
  }, [checkTreePrefix, activeNode, getFormattedNodes, valueKey, virtualized]);
256
261
  useEffect(function () {
257
262
  setValue(getCheckTreePickerDefaultValue(value, uncheckableItemValues));
@@ -36,9 +36,9 @@ export declare function isEveryFirstLevelNodeUncheckable(nodes: TreeNodesType, u
36
36
  * get node uncheckable state
37
37
  * @param {*} node
38
38
  */
39
- export declare function isNodeUncheckable(node: any, props: Partial<CheckTreePickerProps>): boolean;
40
- export declare function getFormattedTree(data: any[], nodes: TreeNodesType, props: Partial<CheckTreePickerProps>): any[];
41
- export declare function getDisabledState(nodes: TreeNodesType, node: TreeNodeType, props: Partial<CheckTreePickerProps>): boolean;
39
+ export declare function isNodeUncheckable(node: any, props: Required<Pick<CheckTreePickerProps, 'uncheckableItemValues' | 'valueKey'>>): boolean;
40
+ export declare function getFormattedTree(data: any[], nodes: TreeNodesType, props: Required<Pick<CheckTreePickerProps, 'childrenKey' | 'cascade'>>): any[];
41
+ export declare function getDisabledState(nodes: TreeNodesType, node: TreeNodeType, props: Required<Pick<CheckTreePickerProps, 'disabledItemValues' | 'valueKey'>>): boolean;
42
42
  export declare function getCheckTreePickerDefaultValue(value: any[], uncheckableItemValues: any[]): any[];
43
43
  export declare function getSelectedItems(nodes: TreeNodesType, value: (string | number)[], valueKey: string): TreeNodeType[];
44
44
  export declare function getNodeCheckState({ nodes, node, cascade, childrenKey }: any): CheckStateType;
@@ -109,7 +109,7 @@ export function getFormattedTree(data, nodes, props) {
109
109
  var curNode = nodes[node.refKey];
110
110
 
111
111
  if (curNode) {
112
- var _node;
112
+ var _node$childrenKey;
113
113
 
114
114
  var checkState = !_isUndefined(cascade) ? getNodeCheckState({
115
115
  node: curNode,
@@ -123,7 +123,7 @@ export function getFormattedTree(data, nodes, props) {
123
123
  formatted.parent = curNode.parent;
124
124
  formatted.checkState = checkState;
125
125
 
126
- if (((_node = node[childrenKey]) === null || _node === void 0 ? void 0 : _node.length) > 0) {
126
+ if (((_node$childrenKey = node[childrenKey]) === null || _node$childrenKey === void 0 ? void 0 : _node$childrenKey.length) > 0) {
127
127
  formatted[childrenKey] = getFormattedTree(formatted[childrenKey], nodes, props);
128
128
  }
129
129
  }
@@ -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;
@@ -128,15 +128,6 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
128
128
  onSelect === null || onSelect === void 0 ? void 0 : onSelect(nextValue, event);
129
129
  onChangeCalendarDate === null || onChangeCalendarDate === void 0 ? void 0 : onChangeCalendarDate(nextValue, event);
130
130
  }, [onChangeCalendarDate, onSelect]);
131
- /**
132
- * A callback triggered when the date on the calendar changes.
133
- */
134
-
135
- var handleChangePageDate = useCallback(function (nextPageDate) {
136
- setCalendarDate(nextPageDate);
137
- reset();
138
- handleDateChange(nextPageDate);
139
- }, [handleDateChange, reset, setCalendarDate]);
140
131
  /**
141
132
  * A callback triggered when the time on the calendar changes.
142
133
  */
@@ -261,6 +252,21 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
261
252
  updateValue(event, nextValue);
262
253
  }
263
254
  }, [formatStr, handleDateChange, oneTap, calendarDate, setCalendarDate, updateValue]);
255
+ /**
256
+ * A callback triggered when the date on the calendar changes.
257
+ */
258
+
259
+ var handleChangePageDate = useCallback(function (nextPageDate, event) {
260
+ setCalendarDate(nextPageDate);
261
+ reset();
262
+ handleDateChange(nextPageDate); // Show only the calendar month panel. formatStr = 'yyyy-MM'
263
+
264
+ var onlyShowMonth = DateUtils.shouldMonth(formatStr) && !DateUtils.shouldDate(formatStr);
265
+
266
+ if (oneTap && onlyShowMonth) {
267
+ updateValue(event, nextPageDate);
268
+ }
269
+ }, [formatStr, handleDateChange, oneTap, reset, setCalendarDate, updateValue]);
264
270
  var disabledDate = useCallback(function (date) {
265
271
  var _disabledDateProp;
266
272
 
@@ -250,7 +250,7 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
250
250
 
251
251
  if (!hasDoneSelect.current) {
252
252
  // If `hoverRange` is set, you need to change the value of hoverDateRange according to the rules
253
- if (!isNil(nextHoverDateRange)) {
253
+ if (!isNil(nextHoverDateRange) && !isNil(selectRangeValueRef.current)) {
254
254
  var nextSelectedDates = [selectRangeValueRef.current[0], nextHoverDateRange[1]];
255
255
 
256
256
  if (DateUtils.isBefore(nextHoverDateRange[0], selectRangeValueRef.current[0])) {
@@ -118,7 +118,9 @@ var InputAutosize = /*#__PURE__*/React.forwardRef(function (props, ref) {
118
118
  return;
119
119
  }
120
120
 
121
- copyStyles(inputStyles, sizerRef.current);
121
+ if (sizerRef.current) {
122
+ copyStyles(inputStyles, sizerRef.current);
123
+ }
122
124
 
123
125
  if (placeholderRef.current) {
124
126
  copyStyles(inputStyles, placeholderRef.current);
@@ -384,7 +384,7 @@ var InputPicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
384
384
  var allData = getAllData();
385
385
  var focusItem = allData.find(function (item) {
386
386
  return shallowEqual(item[valueKey], focusItemValue);
387
- });
387
+ }); // FIXME Bad state flow
388
388
 
389
389
  if (!focusItem && focusItemValue === searchKeyword) {
390
390
  focusItem = createOption(searchKeyword);
@@ -392,7 +392,11 @@ var InputPicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
392
392
 
393
393
  setValue(focusItemValue);
394
394
  setSearchKeyword('');
395
- handleSelect(focusItemValue, focusItem, event);
395
+
396
+ if (focusItem) {
397
+ handleSelect(focusItemValue, focusItem, event);
398
+ }
399
+
396
400
  handleChange(focusItemValue, event);
397
401
  handleClose();
398
402
  }, [setValue, disabledItemValues, controlledData, focusItemValue, valueKey, searchKeyword, handleClose, setSearchKeyword, createOption, getAllData, handleChange, handleSelect]);
@@ -29,18 +29,20 @@ var ListItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
29
29
 
30
30
  var listItemRef = useRef(null);
31
31
  useEffect(function () {
32
- var _register = register({
33
- node: listItemRef.current,
34
- edgeOffset: null,
35
- info: {
36
- collection: collection,
37
- disabled: disabled,
38
- index: index
39
- }
40
- }),
41
- unregister = _register.unregister;
32
+ if (listItemRef.current) {
33
+ var _register = register({
34
+ node: listItemRef.current,
35
+ edgeOffset: null,
36
+ info: {
37
+ collection: collection,
38
+ disabled: disabled,
39
+ index: index
40
+ }
41
+ }),
42
+ unregister = _register.unregister;
42
43
 
43
- return unregister;
44
+ return unregister;
45
+ }
44
46
  }, [collection, disabled, index, register]);
45
47
  var classes = merge(className, withClassPrefix(size, {
46
48
  disabled: disabled,
@@ -61,19 +61,22 @@ function MenuItem(props) {
61
61
  }, [dispatch]);
62
62
  useEffect(function () {
63
63
  var menuitemElement = menuitemRef.current;
64
- dispatch({
65
- type: MenuActionTypes.RegisterItem,
66
- element: menuitemElement,
67
- props: {
68
- disabled: disabled
69
- }
70
- });
71
- return function () {
64
+
65
+ if (menuitemElement) {
72
66
  dispatch({
73
- type: MenuActionTypes.UnregisterItem,
74
- id: menuitemElement.id
67
+ type: MenuActionTypes.RegisterItem,
68
+ element: menuitemElement,
69
+ props: {
70
+ disabled: disabled
71
+ }
75
72
  });
76
- };
73
+ return function () {
74
+ dispatch({
75
+ type: MenuActionTypes.UnregisterItem,
76
+ id: menuitemElement.id
77
+ });
78
+ };
79
+ }
77
80
  }, [menuitemRef, disabled, dispatch]);
78
81
  var menuitemProps = {
79
82
  id: menuitemId,
@@ -37,7 +37,10 @@ var PickerOverlay = /*#__PURE__*/React.forwardRef(function (props, ref) {
37
37
  // Get the width value of the button,
38
38
  // and then set it to the menu to make their width consistent.
39
39
  var width = getWidth(getDOMNode(toggle.root));
40
- addStyle(overlayRef.current, 'min-width', width + "px");
40
+
41
+ if (overlayRef.current) {
42
+ addStyle(overlayRef.current, 'min-width', width + "px");
43
+ }
41
44
  }
42
45
  }, [autoWidth, target, overlayRef]);
43
46
 
@@ -52,17 +52,25 @@ var Ripple = /*#__PURE__*/React.forwardRef(function (props, ref) {
52
52
  };
53
53
 
54
54
  var handleMouseDown = useCallback(function (event) {
55
- var position = getPosition(triggerRef.current, event);
56
- setRippling(true);
57
- setPosition(position);
58
- onMouseDown === null || onMouseDown === void 0 ? void 0 : onMouseDown(position, event);
55
+ if (triggerRef.current) {
56
+ var _position = getPosition(triggerRef.current, event);
57
+
58
+ setRippling(true);
59
+ setPosition(_position);
60
+ onMouseDown === null || onMouseDown === void 0 ? void 0 : onMouseDown(_position, event);
61
+ }
59
62
  }, [onMouseDown]);
60
63
  useEffect(function () {
61
- var parentNode = triggerRef.current.parentNode;
62
- var mousedownListener = on(parentNode, 'mousedown', handleMouseDown);
63
- return function () {
64
- mousedownListener === null || mousedownListener === void 0 ? void 0 : mousedownListener.off();
65
- };
64
+ var _triggerRef$current;
65
+
66
+ var parentNode = (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : _triggerRef$current.parentNode;
67
+
68
+ if (parentNode) {
69
+ var mousedownListener = on(parentNode, 'mousedown', handleMouseDown);
70
+ return function () {
71
+ mousedownListener === null || mousedownListener === void 0 ? void 0 : mousedownListener.off();
72
+ };
73
+ }
66
74
  }, [handleMouseDown]);
67
75
  return /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
68
76
  className: classes,
@@ -58,11 +58,13 @@ var TreePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
58
58
  _props$childrenKey = props.childrenKey,
59
59
  childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,
60
60
  draggable = props.draggable,
61
- defaultExpandAll = props.defaultExpandAll,
61
+ _props$defaultExpandA = props.defaultExpandAll,
62
+ defaultExpandAll = _props$defaultExpandA === void 0 ? false : _props$defaultExpandA,
62
63
  _props$disabledItemVa = props.disabledItemValues,
63
64
  disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,
64
65
  controlledExpandItemValues = props.expandItemValues,
65
- defaultExpandItemValues = props.defaultExpandItemValues,
66
+ _props$defaultExpandI = props.defaultExpandItemValues,
67
+ defaultExpandItemValues = _props$defaultExpandI === void 0 ? emptyArray : _props$defaultExpandI,
66
68
  id = props.id,
67
69
  listProps = props.listProps,
68
70
  getChildren = props.getChildren,
@@ -198,15 +200,17 @@ var TreePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
198
200
  });
199
201
  }, [searchKeywordState, expandItemValues, filteredData, flattenNodes, formatVirtualizedTreeData, virtualized]);
200
202
  var focusActiveNode = useCallback(function () {
201
- focusToActiveTreeNode({
202
- list: listRef.current,
203
- valueKey: valueKey,
204
- selector: "." + treePrefix('node-active'),
205
- activeNode: activeNode,
206
- virtualized: virtualized,
207
- container: treeViewRef.current,
208
- formattedNodes: getFormattedNodes()
209
- });
203
+ if (listRef.current) {
204
+ focusToActiveTreeNode({
205
+ list: listRef.current,
206
+ valueKey: valueKey,
207
+ selector: "." + treePrefix('node-active'),
208
+ activeNode: activeNode,
209
+ virtualized: virtualized,
210
+ container: treeViewRef.current,
211
+ formattedNodes: getFormattedNodes()
212
+ });
213
+ }
210
214
  }, [treePrefix, activeNode, getFormattedNodes, valueKey, virtualized]);
211
215
  useEffect(function () {
212
216
  setFilteredData(data, searchKeywordState);
@@ -56,7 +56,9 @@ var UploadTrigger = /*#__PURE__*/React.forwardRef(function (props, ref) {
56
56
  (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.click();
57
57
  }, []);
58
58
  var handleClearInput = useCallback(function () {
59
- inputRef.current.value = '';
59
+ if (inputRef.current) {
60
+ inputRef.current.value = '';
61
+ }
60
62
  }, []);
61
63
  var handleDragEnter = useCallback(function (event) {
62
64
  if (draggable) {
@@ -188,7 +188,9 @@ var Uploader = /*#__PURE__*/React.forwardRef(function (props, ref) {
188
188
  */
189
189
 
190
190
  var cleanInputValue = useCallback(function () {
191
- trigger.current.clearInput();
191
+ var _trigger$current;
192
+
193
+ (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : _trigger$current.clearInput();
192
194
  }, []);
193
195
  /**
194
196
  * 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
  }
@@ -5,4 +5,4 @@
5
5
  * @param eventTarget The target to listen for events on
6
6
  * @param listener An event handler
7
7
  */
8
- export default function useElementResize(eventTarget: Element | (() => Element), listener: ResizeObserverCallback): void;
8
+ export default function useElementResize(eventTarget: Element | null | (() => Element | null), listener: ResizeObserverCallback): void;
@@ -13,8 +13,11 @@ export default function useElementResize(eventTarget, listener) {
13
13
  useEffect(function () {
14
14
  if (!resizeObserver.current) {
15
15
  var target = typeof eventTarget === 'function' ? eventTarget() : eventTarget;
16
- resizeObserver.current = new ResizeObserver(listener);
17
- resizeObserver.current.observe(target);
16
+
17
+ if (target) {
18
+ resizeObserver.current = new ResizeObserver(listener);
19
+ resizeObserver.current.observe(target);
20
+ }
18
21
  }
19
22
 
20
23
  return function () {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "rsuite",
3
- "version": "5.5.2",
3
+ "version": "5.6.0",
4
4
  "description": "A suite of react components",
5
5
  "main": "cjs/index.js",
6
6
  "module": "esm/index.js",
@@ -33,11 +33,11 @@
33
33
  "@types/react-virtualized": "^9.21.11",
34
34
  "classnames": "^2.3.1",
35
35
  "date-fns": "^2.13.0",
36
- "dom-lib": "^3.0.0",
36
+ "dom-lib": "^3.1.2",
37
37
  "lodash": "^4.17.11",
38
38
  "prop-types": "^15.7.2",
39
39
  "react-virtualized": "^9.22.3",
40
- "rsuite-table": "^5.3.2",
40
+ "rsuite-table": "^5.3.3",
41
41
  "schema-typed": "^2.0.2"
42
42
  },
43
43
  "peerDependencies": {