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
package/CHANGELOG.md CHANGED
@@ -1,3 +1,14 @@
1
+ # [5.6.0](https://github.com/rsuite/rsuite/compare/v5.5.2...v5.6.0) (2022-02-10)
2
+
3
+ ### Bug Fixes
4
+
5
+ - **DatePicker:** fixed oneTap to work in month view ([#2342](https://github.com/rsuite/rsuite/issues/2342)) ([d5368cd](https://github.com/rsuite/rsuite/commit/d5368cdfb2a6386bfb509a6316520e450f35f2b4))
6
+ - handle some null value branch ([#2323](https://github.com/rsuite/rsuite/issues/2323)) ([3ffd1d9](https://github.com/rsuite/rsuite/commit/3ffd1d966d5fd7f0a4f42bb8b08bf0cb65955fef))
7
+
8
+ ### Features
9
+
10
+ - **Carousel:** Expose active index ([#2338](https://github.com/rsuite/rsuite/issues/2338)) ([beac483](https://github.com/rsuite/rsuite/commit/beac48395c9fc7c30efb3f49f81e8969cd3ee71d))
11
+
1
12
  ## [5.5.2](https://github.com/rsuite/rsuite/compare/v5.5.1...v5.5.2) (2022-01-27)
2
13
 
3
14
  ### Features
package/README.md CHANGED
@@ -147,7 +147,7 @@ React Suite is [MIT licensed][license]. Copyright (c) 2016-present, HYPERS.
147
147
  [rsuite-design]: https://rsuitejs.com/design/default
148
148
  [live-preview-on-codesandbox]: https://codesandbox.io/s/rsuite-template-5vq6zo2z5l
149
149
  [rsuite-doc-guide]: https://rsuitejs.com/en/guide/introduction
150
- [rsuite-doc-guide-themes]: https://rsuitejs.com/en/guide/themes
150
+ [rsuite-doc-guide-themes]: https://rsuitejs.com/en/guide/customization
151
151
  [rsuite-doc-guide-intl]: https://rsuitejs.com/en/guide/intl
152
152
  [rsuite-doc-guide-rtl]: https://rsuitejs.com/en/guide/rtl
153
153
  [rsuite-components-overview]: https://rsuitejs.com/en/components/overview
@@ -28,6 +28,7 @@ function useOffset(mountRef) {
28
28
  setOffset = _useState[1];
29
29
 
30
30
  var updateOffset = (0, _react.useCallback)(function () {
31
+ // FIXME upgrade dom-lib
31
32
  setOffset((0, _getOffset.default)(mountRef.current));
32
33
  }, [mountRef]); // Update after the element size changes
33
34
 
@@ -101,10 +101,11 @@ var scrollTo = function scrollTo(time, row) {
101
101
  var node = container === null || container === void 0 ? void 0 : container.querySelector("[data-key=\"" + type + "-" + value + "\"]");
102
102
 
103
103
  if (node && container) {
104
- var _ref2 = (0, _getPosition.default)(node, container),
105
- top = _ref2.top;
104
+ var position = (0, _getPosition.default)(node, container);
106
105
 
107
- (0, _utils.scrollTopAnimation)(container, top, (0, _scrollTop.default)(container) !== 0);
106
+ if (position) {
107
+ (0, _utils.scrollTopAnimation)(container, position.top, (0, _scrollTop.default)(container) !== 0);
108
+ }
108
109
  }
109
110
  });
110
111
  };
@@ -134,7 +135,9 @@ var TimeDropdown = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
134
135
  showMeridian: showMeridian
135
136
  }); // The currently selected time scrolls to the visible range.
136
137
 
137
- show && scrollTo(time, rowRef.current);
138
+ if (show && rowRef.current) {
139
+ scrollTo(time, rowRef.current);
140
+ }
138
141
  }, [date, format, show, showMeridian]);
139
142
 
140
143
  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;
@@ -35,10 +35,13 @@ var Carousel = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
35
35
  autoplay = props.autoplay,
36
36
  _props$autoplayInterv = props.autoplayInterval,
37
37
  autoplayInterval = _props$autoplayInterv === void 0 ? 4000 : _props$autoplayInterv,
38
+ activeIndexProp = props.activeIndex,
39
+ _props$defaultActiveI = props.defaultActiveIndex,
40
+ defaultActiveIndex = _props$defaultActiveI === void 0 ? 0 : _props$defaultActiveI,
38
41
  onSelect = props.onSelect,
39
42
  onSlideStart = props.onSlideStart,
40
43
  onSlideEnd = props.onSlideEnd,
41
- rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "children", "classPrefix", "className", "placement", "shape", "autoplay", "autoplayInterval", "onSelect", "onSlideStart", "onSlideEnd"]);
44
+ rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "children", "classPrefix", "className", "placement", "shape", "autoplay", "autoplayInterval", "activeIndex", "defaultActiveIndex", "onSelect", "onSlideStart", "onSlideEnd"]);
42
45
 
43
46
  var _useCustom = (0, _utils.useCustom)('Carousel'),
44
47
  rtl = _useCustom.rtl;
@@ -54,17 +57,24 @@ var Carousel = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
54
57
  var vertical = placement === 'left' || placement === 'right';
55
58
  var lengthKey = vertical ? 'height' : 'width';
56
59
 
60
+ var _useControlled = (0, _utils.useControlled)(activeIndexProp, defaultActiveIndex),
61
+ activeIndex = _useControlled[0],
62
+ setActiveIndex = _useControlled[1];
63
+
57
64
  var _useState = (0, _react.useState)(0),
58
- activeIndex = _useState[0],
59
- setActiveIndex = _useState[1];
65
+ lastIndex = _useState[0],
66
+ setLastIndex = _useState[1];
60
67
 
61
- var _useState2 = (0, _react.useState)(0),
62
- lastIndex = _useState2[0],
63
- setLastIndex = _useState2[1];
68
+ var rootRef = (0, _react.useRef)(null); // Set a timer for automatic playback.
69
+ // `autoplay` needs to be cast to boolean type to avoid undefined parameters.
64
70
 
65
- var rootRef = (0, _react.useRef)(null);
71
+ var _useTimeout = (0, _utils.useTimeout)(function () {
72
+ return handleSlide();
73
+ }, autoplayInterval, !!autoplay && count > 1),
74
+ clear = _useTimeout.clear,
75
+ reset = _useTimeout.reset;
66
76
 
67
- var handleSlide = function handleSlide(nextActiveIndex, event) {
77
+ var handleSlide = (0, _react.useCallback)(function (nextActiveIndex, event) {
68
78
  if (!rootRef.current) {
69
79
  return;
70
80
  }
@@ -77,7 +87,7 @@ var Carousel = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
77
87
  onSlideStart === null || onSlideStart === void 0 ? void 0 : onSlideStart(nextIndex, event);
78
88
  setLastIndex(nextActiveIndex == null ? activeIndex : nextIndex);
79
89
  reset();
80
- };
90
+ }, [activeIndex, count, setActiveIndex, clear, onSlideStart, reset]);
81
91
 
82
92
  var handleChange = function handleChange(event) {
83
93
  var activeIndex = +event.target.value;
@@ -87,13 +97,7 @@ var Carousel = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
87
97
 
88
98
  var handleTransitionEnd = (0, _react.useCallback)(function (event) {
89
99
  onSlideEnd === null || onSlideEnd === void 0 ? void 0 : onSlideEnd(activeIndex, event);
90
- }, [activeIndex, onSlideEnd]); // Set a timer for automatic playback.
91
- // `autoplay` needs to be cast to boolean type to avoid undefined parameters.
92
-
93
- var _useTimeout = (0, _utils.useTimeout)(handleSlide, autoplayInterval, !!autoplay && count > 1),
94
- clear = _useTimeout.clear,
95
- reset = _useTimeout.reset;
96
-
100
+ }, [activeIndex, onSlideEnd]);
97
101
  var uniqueId = (0, _react.useMemo)(function () {
98
102
  return (0, _utils.guid)();
99
103
  }, []);
@@ -165,6 +169,8 @@ Carousel.propTypes = {
165
169
  as: _propTypes.default.elementType,
166
170
  className: _propTypes.default.string,
167
171
  classPrefix: _propTypes.default.string,
172
+ activeIndex: _propTypes.default.number,
173
+ defaultActiveIndex: _propTypes.default.number,
168
174
  autoplay: _propTypes.default.bool,
169
175
  autoplayInterval: _propTypes.default.number,
170
176
  placement: _propTypes.default.oneOf(['top', 'bottom', 'left', 'right']),
@@ -87,7 +87,7 @@ var DropdownMenu = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
87
87
  if (activeItem) {
88
88
  var position = (0, _getPosition.default)(activeItem, column); // Let the active option scroll into view.
89
89
 
90
- (0, _scrollTop.default)(column, position.top);
90
+ (0, _scrollTop.default)(column, position === null || position === void 0 ? void 0 : position.top);
91
91
  }
92
92
  });
93
93
  }, [prefix]);
@@ -79,17 +79,20 @@ var CheckTreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
79
79
  controlledValue = props.value,
80
80
  _props$defaultValue = props.defaultValue,
81
81
  defaultValue = _props$defaultValue === void 0 ? emptyArray : _props$defaultValue,
82
- defaultExpandAll = props.defaultExpandAll,
82
+ _props$defaultExpandA = props.defaultExpandAll,
83
+ defaultExpandAll = _props$defaultExpandA === void 0 ? false : _props$defaultExpandA,
83
84
  _props$disabledItemVa = props.disabledItemValues,
84
85
  disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,
85
86
  controlledExpandItemValues = props.expandItemValues,
86
- defaultExpandItemValues = props.defaultExpandItemValues,
87
+ _props$defaultExpandI = props.defaultExpandItemValues,
88
+ defaultExpandItemValues = _props$defaultExpandI === void 0 ? emptyArray : _props$defaultExpandI,
87
89
  _props$height = props.height,
88
90
  height = _props$height === void 0 ? 360 : _props$height,
89
91
  menuStyle = props.menuStyle,
90
92
  _props$searchable = props.searchable,
91
93
  searchable = _props$searchable === void 0 ? true : _props$searchable,
92
- virtualized = props.virtualized,
94
+ _props$virtualized = props.virtualized,
95
+ virtualized = _props$virtualized === void 0 ? false : _props$virtualized,
93
96
  className = props.className,
94
97
  _props$classPrefix = props.classPrefix,
95
98
  classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,
@@ -271,15 +274,17 @@ var CheckTreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
271
274
  };
272
275
 
273
276
  var focusActiveNode = (0, _react.useCallback)(function () {
274
- (0, _treeUtils.focusToActiveTreeNode)({
275
- list: listRef.current,
276
- valueKey: valueKey,
277
- selector: "." + checkTreePrefix('node-active'),
278
- activeNode: activeNode,
279
- virtualized: virtualized,
280
- container: treeViewRef.current,
281
- formattedNodes: getFormattedNodes()
282
- });
277
+ if (listRef.current) {
278
+ (0, _treeUtils.focusToActiveTreeNode)({
279
+ list: listRef.current,
280
+ valueKey: valueKey,
281
+ selector: "." + checkTreePrefix('node-active'),
282
+ activeNode: activeNode,
283
+ virtualized: virtualized,
284
+ container: treeViewRef.current,
285
+ formattedNodes: getFormattedNodes()
286
+ });
287
+ }
283
288
  }, [checkTreePrefix, activeNode, getFormattedNodes, valueKey, virtualized]);
284
289
  (0, _react.useEffect)(function () {
285
290
  setValue((0, _utils2.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;
@@ -136,7 +136,7 @@ function getFormattedTree(data, nodes, props) {
136
136
  var curNode = nodes[node.refKey];
137
137
 
138
138
  if (curNode) {
139
- var _node;
139
+ var _node$childrenKey;
140
140
 
141
141
  var checkState = !(0, _isUndefined2.default)(cascade) ? getNodeCheckState({
142
142
  node: curNode,
@@ -150,7 +150,7 @@ function getFormattedTree(data, nodes, props) {
150
150
  formatted.parent = curNode.parent;
151
151
  formatted.checkState = checkState;
152
152
 
153
- if (((_node = node[childrenKey]) === null || _node === void 0 ? void 0 : _node.length) > 0) {
153
+ if (((_node$childrenKey = node[childrenKey]) === null || _node$childrenKey === void 0 ? void 0 : _node$childrenKey.length) > 0) {
154
154
  formatted[childrenKey] = getFormattedTree(formatted[childrenKey], nodes, props);
155
155
  }
156
156
  }
@@ -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
 
@@ -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])) {
@@ -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,
@@ -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
 
@@ -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
  }
@@ -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;
@@ -19,8 +19,11 @@ function useElementResize(eventTarget, listener) {
19
19
  (0, _react.useEffect)(function () {
20
20
  if (!resizeObserver.current) {
21
21
  var target = typeof eventTarget === 'function' ? eventTarget() : eventTarget;
22
- resizeObserver.current = new _resizeObserver.ResizeObserver(listener);
23
- resizeObserver.current.observe(target);
22
+
23
+ if (target) {
24
+ resizeObserver.current = new _resizeObserver.ResizeObserver(listener);
25
+ resizeObserver.current.observe(target);
26
+ }
24
27
  }
25
28
 
26
29
  return function () {