rsuite 5.49.0 → 5.50.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 (115) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/Cascader/styles/index.less +4 -4
  3. package/DateRangePicker/styles/index.less +15 -5
  4. package/Dropdown/styles/index.less +5 -4
  5. package/Dropdown/styles/mixin.less +0 -11
  6. package/Picker/styles/index.less +31 -24
  7. package/Picker/styles/mixin.less +17 -13
  8. package/README.md +4 -4
  9. package/TagInput/styles/index.less +1 -1
  10. package/cjs/AutoComplete/AutoComplete.js +25 -26
  11. package/cjs/Calendar/Calendar.d.ts +5 -1
  12. package/cjs/Calendar/CalendarContainer.d.ts +5 -1
  13. package/cjs/Cascader/Cascader.js +46 -48
  14. package/cjs/CheckPicker/CheckPicker.d.ts +2 -2
  15. package/cjs/CheckPicker/CheckPicker.js +33 -36
  16. package/cjs/CheckTreePicker/CheckTreePicker.js +61 -64
  17. package/cjs/DatePicker/DatePicker.d.ts +5 -1
  18. package/cjs/DatePicker/DatePicker.js +2 -4
  19. package/cjs/DatePicker/Toolbar.js +2 -1
  20. package/cjs/DateRangeInput/DateRangeInput.js +2 -2
  21. package/cjs/DateRangePicker/Calendar.js +24 -23
  22. package/cjs/DateRangePicker/DateRangePicker.d.ts +18 -4
  23. package/cjs/DateRangePicker/DateRangePicker.js +239 -201
  24. package/cjs/DateRangePicker/types.d.ts +11 -3
  25. package/cjs/DateRangePicker/utils.d.ts +2 -1
  26. package/cjs/DateRangePicker/utils.js +7 -5
  27. package/cjs/FormControl/FormControl.d.ts +11 -1
  28. package/cjs/FormControl/FormControl.js +6 -5
  29. package/cjs/InputPicker/InputPicker.js +62 -63
  30. package/cjs/MultiCascader/MultiCascader.js +40 -42
  31. package/cjs/{DatePicker → Picker}/PickerIndicator.d.ts +1 -1
  32. package/cjs/{DatePicker → Picker}/PickerIndicator.js +2 -1
  33. package/cjs/{DatePicker → Picker}/PickerLabel.d.ts +1 -1
  34. package/cjs/Picker/PickerToggle.d.ts +17 -22
  35. package/cjs/Picker/PickerToggle.js +52 -177
  36. package/cjs/Picker/index.d.ts +3 -0
  37. package/cjs/Picker/index.js +10 -1
  38. package/cjs/Picker/usePickerRef.d.ts +3 -1
  39. package/cjs/Picker/usePickerRef.js +13 -7
  40. package/cjs/Picker/utils.d.ts +5 -9
  41. package/cjs/Picker/utils.js +22 -89
  42. package/cjs/SelectPicker/SelectPicker.d.ts +2 -2
  43. package/cjs/SelectPicker/SelectPicker.js +39 -42
  44. package/cjs/TreePicker/TreePicker.js +72 -75
  45. package/cjs/utils/constants.d.ts +2 -1
  46. package/cjs/utils/constants.js +1 -0
  47. package/cjs/utils/dateUtils.d.ts +0 -1
  48. package/cjs/utils/dateUtils.js +0 -6
  49. package/cjs/utils/getStringLength.d.ts +2 -0
  50. package/cjs/utils/getStringLength.js +18 -0
  51. package/cjs/utils/index.d.ts +1 -0
  52. package/cjs/utils/index.js +4 -1
  53. package/dist/rsuite-no-reset-rtl.css +92 -69
  54. package/dist/rsuite-no-reset-rtl.min.css +1 -1
  55. package/dist/rsuite-no-reset-rtl.min.css.map +1 -1
  56. package/dist/rsuite-no-reset.css +92 -69
  57. package/dist/rsuite-no-reset.min.css +1 -1
  58. package/dist/rsuite-no-reset.min.css.map +1 -1
  59. package/dist/rsuite-rtl.css +92 -69
  60. package/dist/rsuite-rtl.min.css +1 -1
  61. package/dist/rsuite-rtl.min.css.map +1 -1
  62. package/dist/rsuite.css +92 -69
  63. package/dist/rsuite.js +67 -46
  64. package/dist/rsuite.js.map +1 -1
  65. package/dist/rsuite.min.css +1 -1
  66. package/dist/rsuite.min.css.map +1 -1
  67. package/dist/rsuite.min.js +1 -1
  68. package/dist/rsuite.min.js.map +1 -1
  69. package/esm/AutoComplete/AutoComplete.js +28 -29
  70. package/esm/Calendar/Calendar.d.ts +5 -1
  71. package/esm/Calendar/CalendarContainer.d.ts +5 -1
  72. package/esm/Cascader/Cascader.js +49 -51
  73. package/esm/CheckPicker/CheckPicker.d.ts +2 -2
  74. package/esm/CheckPicker/CheckPicker.js +36 -39
  75. package/esm/CheckTreePicker/CheckTreePicker.js +64 -67
  76. package/esm/DatePicker/DatePicker.d.ts +5 -1
  77. package/esm/DatePicker/DatePicker.js +1 -3
  78. package/esm/DatePicker/Toolbar.js +2 -1
  79. package/esm/DateRangeInput/DateRangeInput.js +2 -2
  80. package/esm/DateRangePicker/Calendar.js +25 -23
  81. package/esm/DateRangePicker/DateRangePicker.d.ts +18 -4
  82. package/esm/DateRangePicker/DateRangePicker.js +241 -203
  83. package/esm/DateRangePicker/types.d.ts +11 -3
  84. package/esm/DateRangePicker/utils.d.ts +2 -1
  85. package/esm/DateRangePicker/utils.js +7 -5
  86. package/esm/FormControl/FormControl.d.ts +11 -1
  87. package/esm/FormControl/FormControl.js +4 -3
  88. package/esm/InputPicker/InputPicker.js +64 -65
  89. package/esm/MultiCascader/MultiCascader.js +43 -45
  90. package/esm/{DatePicker → Picker}/PickerIndicator.d.ts +1 -1
  91. package/esm/{DatePicker → Picker}/PickerIndicator.js +2 -1
  92. package/esm/{DatePicker → Picker}/PickerLabel.d.ts +1 -1
  93. package/esm/Picker/PickerToggle.d.ts +17 -22
  94. package/esm/Picker/PickerToggle.js +54 -179
  95. package/esm/Picker/index.d.ts +3 -0
  96. package/esm/Picker/index.js +3 -0
  97. package/esm/Picker/usePickerRef.d.ts +3 -1
  98. package/esm/Picker/usePickerRef.js +13 -8
  99. package/esm/Picker/utils.d.ts +5 -9
  100. package/esm/Picker/utils.js +24 -90
  101. package/esm/SelectPicker/SelectPicker.d.ts +2 -2
  102. package/esm/SelectPicker/SelectPicker.js +42 -45
  103. package/esm/TreePicker/TreePicker.js +75 -78
  104. package/esm/utils/constants.d.ts +2 -1
  105. package/esm/utils/constants.js +1 -0
  106. package/esm/utils/dateUtils.d.ts +0 -1
  107. package/esm/utils/dateUtils.js +0 -5
  108. package/esm/utils/getStringLength.d.ts +2 -0
  109. package/esm/utils/getStringLength.js +13 -0
  110. package/esm/utils/index.d.ts +1 -0
  111. package/esm/utils/index.js +1 -0
  112. package/package.json +1 -1
  113. package/styles/mixins/combobox.less +10 -0
  114. /package/cjs/{DatePicker → Picker}/PickerLabel.js +0 -0
  115. /package/esm/{DatePicker → Picker}/PickerLabel.js +0 -0
@@ -106,17 +106,21 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
106
106
  renderMenu = props.renderMenu,
107
107
  renderValue = props.renderValue,
108
108
  rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "data", "appearance", "style", "showIndentLine", "value", "locale", "height", "menuMaxHeight", "menuStyle", "className", "disabled", "placement", "cleanable", "searchable", "virtualized", "classPrefix", "defaultValue", "placeholder", "searchKeyword", "menuClassName", "menuAutoWidth", "searchBy", "toggleAs", "labelKey", "valueKey", "childrenKey", "draggable", "defaultExpandAll", "disabledItemValues", "expandItemValues", "defaultExpandItemValues", "id", "listProps", "getChildren", "renderTreeIcon", "renderTreeNode", "onExit", "onExited", "onClean", "onOpen", "onSearch", "onSelect", "onSelectItem", "onChange", "onEntered", "onClose", "onDragEnd", "onDragStart", "onDragEnter", "onDragLeave", "onDragOver", "onDrop", "onExpand", "renderExtraFooter", "renderMenu", "renderValue"]);
109
- var triggerRef = (0, _react.useRef)(null);
110
- var targetRef = (0, _react.useRef)(null);
111
- var listRef = (0, _react.useRef)(null);
112
- var overlayRef = (0, _react.useRef)(null);
113
- var searchInputRef = (0, _react.useRef)(null);
114
- var treeViewRef = (0, _react.useRef)(null);
115
109
  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),
116
110
  rtl = _useCustom.rtl,
117
111
  locale = _useCustom.locale;
118
112
  var _useContext = (0, _react.useContext)(_TreeContext.default),
119
113
  inline = _useContext.inline;
114
+ var _usePickerRef = (0, _Picker.usePickerRef)(ref, {
115
+ inline: inline
116
+ }),
117
+ trigger = _usePickerRef.trigger,
118
+ root = _usePickerRef.root,
119
+ target = _usePickerRef.target,
120
+ overlay = _usePickerRef.overlay,
121
+ list = _usePickerRef.list,
122
+ searchInput = _usePickerRef.searchInput,
123
+ treeView = _usePickerRef.treeView;
120
124
  var _useControlled = (0, _utils.useControlled)(controlledValue, defaultValue),
121
125
  value = _useControlled[0],
122
126
  setValue = _useControlled[1],
@@ -187,7 +191,7 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
187
191
  treeNodesRefs = _useTreeNodeRefs.treeNodesRefs,
188
192
  saveTreeNodeRef = _useTreeNodeRefs.saveTreeNodeRef;
189
193
  var activeNode = (0, _treeUtils.getTreeActiveNode)(flattenNodes, value, valueKey);
190
- var getFormattedNodes = (0, _react.useCallback)(function (render) {
194
+ var getFormattedNodes = function getFormattedNodes(render) {
191
195
  if (virtualized) {
192
196
  return formatVirtualizedTreeData(flattenNodes, filteredData, expandItemValues, {
193
197
  searchKeyword: searchKeywordState
@@ -198,20 +202,20 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
198
202
  return filteredData.map(function (dataItem, index) {
199
203
  return render === null || render === void 0 ? void 0 : render(dataItem, index, 1);
200
204
  });
201
- }, [searchKeywordState, expandItemValues, filteredData, flattenNodes, formatVirtualizedTreeData, virtualized]);
202
- var focusActiveNode = (0, _react.useCallback)(function () {
203
- if (listRef.current) {
205
+ };
206
+ var focusActiveNode = function focusActiveNode() {
207
+ if (list.current) {
204
208
  (0, _treeUtils.focusToActiveTreeNode)({
205
- list: listRef.current,
209
+ list: list.current,
206
210
  valueKey: valueKey,
207
211
  selector: "." + treePrefix('node-active'),
208
212
  activeNode: activeNode,
209
213
  virtualized: virtualized,
210
- container: treeViewRef.current,
214
+ container: treeView.current,
211
215
  formattedNodes: getFormattedNodes()
212
216
  });
213
217
  }
214
- }, [treePrefix, activeNode, getFormattedNodes, valueKey, virtualized]);
218
+ };
215
219
  (0, _react.useEffect)(function () {
216
220
  setFilteredData(data, searchKeywordState);
217
221
  setTreeData(data);
@@ -227,7 +231,7 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
227
231
  (0, _react.useEffect)(function () {
228
232
  setSearchKeyword(searchKeyword !== null && searchKeyword !== void 0 ? searchKeyword : '');
229
233
  }, [searchKeyword, setSearchKeyword]);
230
- var getDropData = (0, _react.useCallback)(function (nodeData) {
234
+ var getDropData = function getDropData(nodeData) {
231
235
  var options = {
232
236
  valueKey: valueKey,
233
237
  childrenKey: childrenKey
@@ -245,7 +249,7 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
245
249
  dropNodePosition: dropNodePosition
246
250
  }, options)
247
251
  };
248
- }, [dragNode, valueKey, childrenKey, dropNodePosition]);
252
+ };
249
253
  var getTreeNodeProps = function getTreeNodeProps(node, layer, index) {
250
254
  var draggingNode = dragNode !== null && dragNode !== void 0 ? dragNode : {};
251
255
  return {
@@ -294,8 +298,8 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
294
298
  return node[childrenKey];
295
299
  });
296
300
  }, [childrenKey, data, valueKey]);
297
- var handleSelect = (0, _react.useCallback)(function (nodeData, event) {
298
- var _targetRef$current, _triggerRef$current, _triggerRef$current$c;
301
+ var handleSelect = (0, _utils.useEventCallback)(function (nodeData, event) {
302
+ var _target$current, _trigger$current, _trigger$current$clos;
299
303
  if (!nodeData) {
300
304
  return;
301
305
  }
@@ -309,10 +313,10 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
309
313
  onSelectItem === null || onSelectItem === void 0 ? void 0 : onSelectItem(nodeData, (0, _treeUtils.getPathTowardsItem)(nodeData, function (item) {
310
314
  return itemParentMap.get(item[valueKey]);
311
315
  }));
312
- (_targetRef$current = targetRef.current) === null || _targetRef$current === void 0 ? void 0 : _targetRef$current.focus();
313
- (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : (_triggerRef$current$c = _triggerRef$current.close) === null || _triggerRef$current$c === void 0 ? void 0 : _triggerRef$current$c.call(_triggerRef$current);
314
- }, [valueKey, isControlled, onChange, onSelect, onSelectItem, setValue, itemParentMap]);
315
- var handleExpand = (0, _react.useCallback)(function (node) {
316
+ (_target$current = target.current) === null || _target$current === void 0 ? void 0 : _target$current.focus();
317
+ (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 ? void 0 : _trigger$current$clos.call(_trigger$current);
318
+ });
319
+ var handleExpand = (0, _utils.useEventCallback)(function (node) {
316
320
  var nextExpandItemValues = (0, _treeUtils.toggleExpand)({
317
321
  node: node,
318
322
  isExpand: !node.expand,
@@ -327,8 +331,8 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
327
331
  if ((0, _isFunction2.default)(getChildren) && !node.expand && Array.isArray(node[childrenKey]) && node[childrenKey].length === 0) {
328
332
  loadChildren(node, getChildren);
329
333
  }
330
- }, [valueKey, childrenKey, expandItemValues, getChildren, onExpand, setExpandItemValues, loadChildren]);
331
- var handleDragStart = (0, _react.useCallback)(function (nodeData, event) {
334
+ });
335
+ var handleDragStart = (0, _utils.useEventCallback)(function (nodeData, event) {
332
336
  if (draggable) {
333
337
  var _event$dataTransfer;
334
338
  var dragMoverNode = (0, _treeUtils.createDragPreview)((0, _treeUtils.stringifyTreeNodeLabel)(nodeData[labelKey]), treePrefix('drag-preview'));
@@ -337,8 +341,8 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
337
341
  setDragNode(flattenNodes[nodeData.refKey]);
338
342
  onDragStart === null || onDragStart === void 0 ? void 0 : onDragStart(nodeData, event);
339
343
  }
340
- }, [draggable, labelKey, treePrefix, setDragNodeKeys, childrenKey, valueKey, setDragNode, flattenNodes, onDragStart]);
341
- var handleDragEnter = (0, _react.useCallback)(function (nodeData, event) {
344
+ });
345
+ var handleDragEnter = (0, _utils.useEventCallback)(function (nodeData, event) {
342
346
  if (dragNodeKeys.some(function (d) {
343
347
  return (0, _utils.shallowEqual)(d, nodeData[valueKey]);
344
348
  })) {
@@ -349,8 +353,8 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
349
353
  setDropNodePosition((0, _treeUtils.calDropNodePosition)(event, treeNodesRefs[nodeData.refKey]));
350
354
  }
351
355
  onDragEnter === null || onDragEnter === void 0 ? void 0 : onDragEnter(nodeData, event);
352
- }, [dragNode, treeNodesRefs, dragNodeKeys, onDragEnter, setDragOverNodeKey, setDropNodePosition, valueKey]);
353
- var handleDragOver = (0, _react.useCallback)(function (nodeData, event) {
356
+ });
357
+ var handleDragOver = (0, _utils.useEventCallback)(function (nodeData, event) {
354
358
  if (dragNodeKeys.some(function (d) {
355
359
  return (0, _utils.shallowEqual)(d, nodeData[valueKey]);
356
360
  })) {
@@ -363,18 +367,18 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
363
367
  setDropNodePosition(lastDropNodePosition);
364
368
  }
365
369
  onDragOver === null || onDragOver === void 0 ? void 0 : onDragOver(nodeData, event);
366
- }, [dragNode, dragNodeKeys, dragOverNodeKey, dropNodePosition, onDragOver, setDropNodePosition, treeNodesRefs, valueKey]);
367
- var handleDragLeave = (0, _react.useCallback)(function (nodeData, event) {
370
+ });
371
+ var handleDragLeave = (0, _utils.useEventCallback)(function (nodeData, event) {
368
372
  onDragLeave === null || onDragLeave === void 0 ? void 0 : onDragLeave(nodeData, event);
369
- }, [onDragLeave]);
370
- var handleDragEnd = (0, _react.useCallback)(function (nodeData, event) {
373
+ });
374
+ var handleDragEnd = (0, _utils.useEventCallback)(function (nodeData, event) {
371
375
  (0, _treeUtils.removeDragPreview)();
372
376
  setDragNode(null);
373
377
  setDragNodeKeys([]);
374
378
  setDragOverNodeKey(null);
375
379
  onDragEnd === null || onDragEnd === void 0 ? void 0 : onDragEnd(nodeData, event);
376
- }, [setDragNode, setDragNodeKeys, setDragOverNodeKey, onDragEnd]);
377
- var handleDrop = (0, _react.useCallback)(function (nodeData, event) {
380
+ });
381
+ var handleDrop = (0, _utils.useEventCallback)(function (nodeData, event) {
378
382
  if (dragNodeKeys.some(function (d) {
379
383
  return (0, _utils.shallowEqual)(d, nodeData[valueKey]);
380
384
  })) {
@@ -387,34 +391,26 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
387
391
  setDragNode(null);
388
392
  setDragNodeKeys([]);
389
393
  setDragOverNodeKey(null);
390
- }, [dragNodeKeys, setDragNode, setDragOverNodeKey, setDragNodeKeys, onDrop, getDropData, valueKey]);
391
- var handleOpen = (0, _react.useCallback)(function () {
392
- var _triggerRef$current2, _triggerRef$current2$;
393
- (_triggerRef$current2 = triggerRef.current) === null || _triggerRef$current2 === void 0 ? void 0 : (_triggerRef$current2$ = _triggerRef$current2.open) === null || _triggerRef$current2$ === void 0 ? void 0 : _triggerRef$current2$.call(_triggerRef$current2);
394
+ });
395
+ var handleOpen = (0, _utils.useEventCallback)(function () {
396
+ var _trigger$current2, _trigger$current2$ope;
397
+ (_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : (_trigger$current2$ope = _trigger$current2.open) === null || _trigger$current2$ope === void 0 ? void 0 : _trigger$current2$ope.call(_trigger$current2);
394
398
  focusActiveNode();
395
399
  onOpen === null || onOpen === void 0 ? void 0 : onOpen();
396
400
  setActive(true);
397
- }, [focusActiveNode, onOpen]);
398
- var handleClose = (0, _react.useCallback)(function () {
399
- var _triggerRef$current3, _triggerRef$current3$, _targetRef$current2;
400
- (_triggerRef$current3 = triggerRef.current) === null || _triggerRef$current3 === void 0 ? void 0 : (_triggerRef$current3$ = _triggerRef$current3.close) === null || _triggerRef$current3$ === void 0 ? void 0 : _triggerRef$current3$.call(_triggerRef$current3);
401
+ });
402
+ var handleClose = (0, _utils.useEventCallback)(function () {
403
+ var _trigger$current3, _trigger$current3$clo, _target$current2;
404
+ (_trigger$current3 = trigger.current) === null || _trigger$current3 === void 0 ? void 0 : (_trigger$current3$clo = _trigger$current3.close) === null || _trigger$current3$clo === void 0 ? void 0 : _trigger$current3$clo.call(_trigger$current3);
401
405
  setSearchKeyword('');
402
406
  setActive(false);
403
407
  setFocusItemValue(activeNode === null || activeNode === void 0 ? void 0 : activeNode[valueKey]);
404
408
  /**
405
409
  * when using keyboard toggle picker, should refocus on PickerToggle Component after close picker menu
406
410
  */
407
- (_targetRef$current2 = targetRef.current) === null || _targetRef$current2 === void 0 ? void 0 : _targetRef$current2.focus();
408
- }, [activeNode, setSearchKeyword, valueKey]);
409
- (0, _Picker.usePublicMethods)(ref, {
410
- rootRef: inline ? treeViewRef : undefined,
411
- triggerRef: triggerRef,
412
- overlayRef: overlayRef,
413
- targetRef: targetRef,
414
- listRef: listRef,
415
- inline: inline
411
+ (_target$current2 = target.current) === null || _target$current2 === void 0 ? void 0 : _target$current2.focus();
416
412
  });
417
- var handleFocusItem = (0, _react.useCallback)(function (key) {
413
+ var handleFocusItem = (0, _utils.useEventCallback)(function (key) {
418
414
  var focusableItems = (0, _treeUtils.getFocusableItems)(filteredData, {
419
415
  disabledItemValues: disabledItemValues,
420
416
  valueKey: valueKey,
@@ -439,8 +435,8 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
439
435
  if (key === _utils.KEY_VALUES.UP) {
440
436
  (0, _treeUtils.focusPreviousItem)(focusProps);
441
437
  }
442
- }, [searchKeywordState, expandItemValues, filteredData, focusItemValue, treeNodesRefs, treePrefix, valueKey, childrenKey, disabledItemValues]);
443
- var handleLeftArrow = (0, _react.useCallback)(function () {
438
+ });
439
+ var handleLeftArrow = (0, _utils.useEventCallback)(function () {
444
440
  if ((0, _isNil2.default)(focusItemValue)) return;
445
441
  var focusItem = (0, _treeUtils.getActiveItem)(focusItemValue, flattenNodes, valueKey);
446
442
  (0, _treeUtils.leftArrowHandler)({
@@ -454,8 +450,8 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
454
450
  (0, _treeUtils.focusTreeNode)(focusItem === null || focusItem === void 0 ? void 0 : (_focusItem$parent2 = focusItem.parent) === null || _focusItem$parent2 === void 0 ? void 0 : _focusItem$parent2.refKey, treeNodesRefs, "." + treePrefix('node-label'));
455
451
  }
456
452
  });
457
- }, [expandItemValues, flattenNodes, focusItemValue, handleExpand, treeNodesRefs, treePrefix, valueKey, childrenKey]);
458
- var handleRightArrow = (0, _react.useCallback)(function () {
453
+ });
454
+ var handleRightArrow = (0, _utils.useEventCallback)(function () {
459
455
  if ((0, _isNil2.default)(focusItemValue)) return;
460
456
  var focusItem = (0, _treeUtils.getActiveItem)(focusItemValue, flattenNodes, valueKey);
461
457
  (0, _treeUtils.rightArrowHandler)({
@@ -467,13 +463,13 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
467
463
  handleFocusItem(_utils.KEY_VALUES.DOWN);
468
464
  }
469
465
  });
470
- }, [focusItemValue, flattenNodes, valueKey, expandItemValues, childrenKey, handleExpand, handleFocusItem]);
471
- var selectActiveItem = (0, _react.useCallback)(function (event) {
466
+ });
467
+ var selectActiveItem = (0, _utils.useEventCallback)(function (event) {
472
468
  if ((0, _isNil2.default)(focusItemValue)) return;
473
469
  var activeItem = (0, _treeUtils.getActiveItem)(focusItemValue, flattenNodes, valueKey);
474
470
  handleSelect(activeItem, event);
475
- }, [flattenNodes, valueKey, focusItemValue, handleSelect]);
476
- var handleClean = (0, _react.useCallback)(function (event) {
471
+ });
472
+ var handleClean = (0, _utils.useEventCallback)(function (event) {
477
473
  var nullValue = null;
478
474
  var target = event.target;
479
475
  // exclude searchBar
@@ -484,13 +480,13 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
484
480
  setValue(null);
485
481
  }
486
482
  onChange === null || onChange === void 0 ? void 0 : onChange(nullValue, event);
487
- }, [cleanable, disabled, onChange, setValue, isControlled]);
483
+ });
488
484
  var onPickerKeydown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({
489
485
  toggle: !activeNode || !active,
490
- triggerRef: triggerRef,
491
- targetRef: targetRef,
492
- overlayRef: overlayRef,
493
- searchInputRef: searchInputRef,
486
+ trigger: trigger,
487
+ target: target,
488
+ overlay: overlay,
489
+ searchInput: searchInput,
494
490
  active: active,
495
491
  onExit: handleClean,
496
492
  onClose: handleClose,
@@ -509,8 +505,8 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
509
505
  });
510
506
  }
511
507
  }, rest));
512
- var handleTreeKeyDown = (0, _react.useCallback)(function (event) {
513
- if (!treeViewRef.current) {
508
+ var handleTreeKeyDown = (0, _utils.useEventCallback)(function (event) {
509
+ if (!treeView.current) {
514
510
  return;
515
511
  }
516
512
  (0, _Picker.onMenuKeyDown)(event, {
@@ -524,7 +520,7 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
524
520
  right: rtl ? handleLeftArrow : handleRightArrow,
525
521
  enter: selectActiveItem
526
522
  });
527
- }, [handleFocusItem, handleLeftArrow, handleRightArrow, rtl, selectActiveItem]);
523
+ });
528
524
  var renderNode = function renderNode(node, index, layer) {
529
525
  if (!node.visible) {
530
526
  return null;
@@ -599,7 +595,7 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
599
595
  return /*#__PURE__*/_react.default.createElement("div", {
600
596
  role: "tree",
601
597
  id: id ? id + "-listbox" : undefined,
602
- ref: treeViewRef,
598
+ ref: inline ? root : treeView,
603
599
  className: classes,
604
600
  style: styles,
605
601
  onKeyDown: inline ? handleTreeKeyDown : undefined
@@ -614,7 +610,7 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
614
610
  }, function (_ref5) {
615
611
  var height = _ref5.height;
616
612
  return /*#__PURE__*/_react.default.createElement(_Windowing.List, (0, _extends2.default)({
617
- ref: listRef,
613
+ ref: list,
618
614
  height: height,
619
615
  itemSize: itemSize,
620
616
  itemCount: formattedNodes.length,
@@ -635,14 +631,14 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
635
631
  autoWidth: menuAutoWidth,
636
632
  className: classes,
637
633
  style: mergedMenuStyle,
638
- ref: (0, _utils.mergeRefs)(overlayRef, speakerRef),
634
+ ref: (0, _utils.mergeRefs)(overlay, speakerRef),
639
635
  onKeyDown: onPickerKeydown,
640
- target: triggerRef
636
+ target: trigger
641
637
  }, searchable ? /*#__PURE__*/_react.default.createElement(_Picker.SearchBar, {
642
638
  placeholder: locale.searchPlaceholder,
643
639
  onChange: handleSearch,
644
640
  value: searchKeywordState,
645
- inputRef: searchInputRef
641
+ inputRef: searchInput
646
642
  }) : null, renderMenu ? renderMenu(renderTree()) : renderTree(), renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());
647
643
  };
648
644
 
@@ -676,7 +672,7 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
676
672
  }
677
673
  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {
678
674
  pickerProps: (0, _pick2.default)(props, _Picker.pickTriggerPropKeys),
679
- ref: triggerRef,
675
+ ref: trigger,
680
676
  placement: placement,
681
677
  onEnter: handleOpen,
682
678
  onEntered: onEntered,
@@ -685,10 +681,11 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
685
681
  speaker: renderDropdownMenu
686
682
  }, /*#__PURE__*/_react.default.createElement(Component, {
687
683
  className: classes,
688
- style: style
684
+ style: style,
685
+ ref: root
689
686
  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit2.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys, ['cascade'])), {
690
687
  id: id,
691
- ref: targetRef,
688
+ ref: target,
692
689
  appearance: appearance,
693
690
  onKeyDown: onPickerKeydown,
694
691
  onClean: (0, _utils.createChainedFunction)(handleClean, onClean),
@@ -49,5 +49,6 @@ export declare const KEY_VALUES: {
49
49
  export declare enum DATERANGE_DISABLED_TARGET {
50
50
  CALENDAR = "CALENDAR",
51
51
  TOOLBAR_BUTTON_OK = "TOOLBAR_BUTTON_OK",
52
- TOOLBAR_SHORTCUT = "TOOLBAR_SHORTCUT"
52
+ TOOLBAR_SHORTCUT = "TOOLBAR_SHORTCUT",
53
+ INPUT = "INPUT"
53
54
  }
@@ -77,4 +77,5 @@ exports.DATERANGE_DISABLED_TARGET = DATERANGE_DISABLED_TARGET;
77
77
  DATERANGE_DISABLED_TARGET["CALENDAR"] = "CALENDAR";
78
78
  DATERANGE_DISABLED_TARGET["TOOLBAR_BUTTON_OK"] = "TOOLBAR_BUTTON_OK";
79
79
  DATERANGE_DISABLED_TARGET["TOOLBAR_SHORTCUT"] = "TOOLBAR_SHORTCUT";
80
+ DATERANGE_DISABLED_TARGET["INPUT"] = "INPUT";
80
81
  })(DATERANGE_DISABLED_TARGET || (exports.DATERANGE_DISABLED_TARGET = DATERANGE_DISABLED_TARGET = {}));
@@ -63,7 +63,6 @@ export declare const shouldOnlyRenderTime: (format: string) => boolean;
63
63
  * @return date[]
64
64
  */
65
65
  export declare function getMonthView(monthDate: Date, isoWeek: boolean): Date[];
66
- export declare function getDateMask(formatStr: string): (string | RegExp)[];
67
66
  /**
68
67
  * Copy the time of one date to another
69
68
  */
@@ -5,7 +5,6 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  exports.__esModule = true;
6
6
  exports.disabledTime = disabledTime;
7
7
  exports.getMonthView = getMonthView;
8
- exports.getDateMask = getDateMask;
9
8
  exports.copyTime = copyTime;
10
9
  exports.reverseDateRangeOmitTime = reverseDateRangeOmitTime;
11
10
  exports.getReversedTimeMeridian = exports.shouldOnlyRenderTime = exports.shouldRenderDate = exports.shouldRenderMonth = exports.shouldRenderTime = exports.omitHideDisabledProps = exports.calendarOnlyProps = exports.lastDayOfMonth = exports.isLastDayOfMonth = exports.differenceInCalendarMonths = exports.set = exports.isValid = exports.isMatch = exports.subDays = exports.startOfWeek = exports.startOfMonth = exports.startOfISOWeek = exports.startOfDay = exports.setYear = exports.setSeconds = exports.setMonth = exports.setMinutes = exports.setHours = exports.setDate = exports.parseISO = exports.parse = exports.isSameSecond = exports.isSameMonth = exports.isSameDay = exports.isEqual = exports.isBefore = exports.isAfter = exports.getYear = exports.getSeconds = exports.getMonth = exports.getMinutes = exports.getHours = exports.getDaysInMonth = exports.getDay = exports.getDate = exports.format = exports.endOfWeek = exports.endOfMonth = exports.endOfISOWeek = exports.endOfDay = exports.compareAsc = exports.addHours = exports.addMinutes = exports.addSeconds = exports.addYears = exports.addMonths = exports.addDays = void 0;
@@ -183,11 +182,6 @@ function getMonthView(monthDate, isoWeek) {
183
182
  }
184
183
  return weeks;
185
184
  }
186
- function getDateMask(formatStr) {
187
- return Array.from(formatStr).map(function (i) {
188
- return i.match(/[A-Za-z]/) ? /[\d|A-Za-z]/ : i;
189
- });
190
- }
191
185
 
192
186
  /**
193
187
  * Copy the time of one date to another
@@ -0,0 +1,2 @@
1
+ declare function getStringLength(str: string): number;
2
+ export default getStringLength;
@@ -0,0 +1,18 @@
1
+ 'use client';
2
+ "use strict";
3
+
4
+ exports.__esModule = true;
5
+ exports.default = void 0;
6
+ function getStringLength(str) {
7
+ var length = 0;
8
+ Array.from(str).forEach(function (char) {
9
+ if (char.charCodeAt(0) > 255) {
10
+ length += 2;
11
+ } else {
12
+ length++;
13
+ }
14
+ });
15
+ return length;
16
+ }
17
+ var _default = getStringLength;
18
+ exports.default = _default;
@@ -24,6 +24,7 @@ export { default as scrollTopAnimation } from './scrollTopAnimation';
24
24
  export { default as appendTooltip } from './appendTooltip';
25
25
  export { default as render } from './render';
26
26
  export { default as safeSetSelection } from './safeSetSelection';
27
+ export { default as getStringLength } from './getStringLength';
27
28
  /** Hooks **/
28
29
  export { default as useClassNames } from './useClassNames';
29
30
  export { default as useEventListener } from './useEventListener';
@@ -25,6 +25,7 @@ var _exportNames = {
25
25
  appendTooltip: true,
26
26
  render: true,
27
27
  safeSetSelection: true,
28
+ getStringLength: true,
28
29
  useClassNames: true,
29
30
  useEventListener: true,
30
31
  useElementResize: true,
@@ -50,7 +51,7 @@ var _exportNames = {
50
51
  DateUtils: true,
51
52
  TypeChecker: true
52
53
  };
53
- exports.TypeChecker = exports.DateUtils = exports.globalKey = exports.getClassNamePrefix = exports.defaultClassPrefix = exports.useIsomorphicLayoutEffect = exports.useUniqueId = exports.useMount = exports.useIsMounted = exports.useUpdateEffect = exports.useWillUnmount = exports.useUpdatedRef = exports.useEventCallback = exports.stringToObject = exports.getSafeRegExpString = exports.useRootClose = exports.useControlled = exports.useTimeout = exports.createComponent = exports.usePortal = exports.useCustom = exports.useElementResize = exports.useEventListener = exports.useClassNames = exports.safeSetSelection = exports.render = exports.appendTooltip = exports.scrollTopAnimation = exports.reactToString = exports.composeFunctions = exports.shallowEqualArray = exports.shallowEqual = exports.mergeRefs = exports.getDOMNode = exports.placementPolyfill = exports.clone = exports.previewFile = exports.ajaxUpload = exports.tplTransform = exports.ReactChildren = exports.isOneOf = exports.createChainedFunction = exports.prefix = exports.guid = void 0;
54
+ exports.TypeChecker = exports.DateUtils = exports.globalKey = exports.getClassNamePrefix = exports.defaultClassPrefix = exports.useIsomorphicLayoutEffect = exports.useUniqueId = exports.useMount = exports.useIsMounted = exports.useUpdateEffect = exports.useWillUnmount = exports.useUpdatedRef = exports.useEventCallback = exports.stringToObject = exports.getSafeRegExpString = exports.useRootClose = exports.useControlled = exports.useTimeout = exports.createComponent = exports.usePortal = exports.useCustom = exports.useElementResize = exports.useEventListener = exports.useClassNames = exports.getStringLength = exports.safeSetSelection = exports.render = exports.appendTooltip = exports.scrollTopAnimation = exports.reactToString = exports.composeFunctions = exports.shallowEqualArray = exports.shallowEqual = exports.mergeRefs = exports.getDOMNode = exports.placementPolyfill = exports.clone = exports.previewFile = exports.ajaxUpload = exports.tplTransform = exports.ReactChildren = exports.isOneOf = exports.createChainedFunction = exports.prefix = exports.guid = void 0;
54
55
  var _BrowserDetection = require("./BrowserDetection");
55
56
  Object.keys(_BrowserDetection).forEach(function (key) {
56
57
  if (key === "default" || key === "__esModule") return;
@@ -126,6 +127,8 @@ var _render = _interopRequireDefault(require("./render"));
126
127
  exports.render = _render.default;
127
128
  var _safeSetSelection = _interopRequireDefault(require("./safeSetSelection"));
128
129
  exports.safeSetSelection = _safeSetSelection.default;
130
+ var _getStringLength = _interopRequireDefault(require("./getStringLength"));
131
+ exports.getStringLength = _getStringLength.default;
129
132
  var _useClassNames = _interopRequireDefault(require("./useClassNames"));
130
133
  exports.useClassNames = _useClassNames.default;
131
134
  var _useEventListener = _interopRequireDefault(require("./useEventListener"));