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.
- package/CHANGELOG.md +13 -0
- package/Cascader/styles/index.less +4 -4
- package/DateRangePicker/styles/index.less +15 -5
- package/Dropdown/styles/index.less +5 -4
- package/Dropdown/styles/mixin.less +0 -11
- package/Picker/styles/index.less +31 -24
- package/Picker/styles/mixin.less +17 -13
- package/README.md +4 -4
- package/TagInput/styles/index.less +1 -1
- package/cjs/AutoComplete/AutoComplete.js +25 -26
- package/cjs/Calendar/Calendar.d.ts +5 -1
- package/cjs/Calendar/CalendarContainer.d.ts +5 -1
- package/cjs/Cascader/Cascader.js +46 -48
- package/cjs/CheckPicker/CheckPicker.d.ts +2 -2
- package/cjs/CheckPicker/CheckPicker.js +33 -36
- package/cjs/CheckTreePicker/CheckTreePicker.js +61 -64
- package/cjs/DatePicker/DatePicker.d.ts +5 -1
- package/cjs/DatePicker/DatePicker.js +2 -4
- package/cjs/DatePicker/Toolbar.js +2 -1
- package/cjs/DateRangeInput/DateRangeInput.js +2 -2
- package/cjs/DateRangePicker/Calendar.js +24 -23
- package/cjs/DateRangePicker/DateRangePicker.d.ts +18 -4
- package/cjs/DateRangePicker/DateRangePicker.js +239 -201
- package/cjs/DateRangePicker/types.d.ts +11 -3
- package/cjs/DateRangePicker/utils.d.ts +2 -1
- package/cjs/DateRangePicker/utils.js +7 -5
- package/cjs/FormControl/FormControl.d.ts +11 -1
- package/cjs/FormControl/FormControl.js +6 -5
- package/cjs/InputPicker/InputPicker.js +62 -63
- package/cjs/MultiCascader/MultiCascader.js +40 -42
- package/cjs/{DatePicker → Picker}/PickerIndicator.d.ts +1 -1
- package/cjs/{DatePicker → Picker}/PickerIndicator.js +2 -1
- package/cjs/{DatePicker → Picker}/PickerLabel.d.ts +1 -1
- package/cjs/Picker/PickerToggle.d.ts +17 -22
- package/cjs/Picker/PickerToggle.js +52 -177
- package/cjs/Picker/index.d.ts +3 -0
- package/cjs/Picker/index.js +10 -1
- package/cjs/Picker/usePickerRef.d.ts +3 -1
- package/cjs/Picker/usePickerRef.js +13 -7
- package/cjs/Picker/utils.d.ts +5 -9
- package/cjs/Picker/utils.js +22 -89
- package/cjs/SelectPicker/SelectPicker.d.ts +2 -2
- package/cjs/SelectPicker/SelectPicker.js +39 -42
- package/cjs/TreePicker/TreePicker.js +72 -75
- package/cjs/utils/constants.d.ts +2 -1
- package/cjs/utils/constants.js +1 -0
- package/cjs/utils/dateUtils.d.ts +0 -1
- package/cjs/utils/dateUtils.js +0 -6
- package/cjs/utils/getStringLength.d.ts +2 -0
- package/cjs/utils/getStringLength.js +18 -0
- package/cjs/utils/index.d.ts +1 -0
- package/cjs/utils/index.js +4 -1
- package/dist/rsuite-no-reset-rtl.css +92 -69
- package/dist/rsuite-no-reset-rtl.min.css +1 -1
- package/dist/rsuite-no-reset-rtl.min.css.map +1 -1
- package/dist/rsuite-no-reset.css +92 -69
- package/dist/rsuite-no-reset.min.css +1 -1
- package/dist/rsuite-no-reset.min.css.map +1 -1
- package/dist/rsuite-rtl.css +92 -69
- package/dist/rsuite-rtl.min.css +1 -1
- package/dist/rsuite-rtl.min.css.map +1 -1
- package/dist/rsuite.css +92 -69
- package/dist/rsuite.js +67 -46
- package/dist/rsuite.js.map +1 -1
- package/dist/rsuite.min.css +1 -1
- package/dist/rsuite.min.css.map +1 -1
- package/dist/rsuite.min.js +1 -1
- package/dist/rsuite.min.js.map +1 -1
- package/esm/AutoComplete/AutoComplete.js +28 -29
- package/esm/Calendar/Calendar.d.ts +5 -1
- package/esm/Calendar/CalendarContainer.d.ts +5 -1
- package/esm/Cascader/Cascader.js +49 -51
- package/esm/CheckPicker/CheckPicker.d.ts +2 -2
- package/esm/CheckPicker/CheckPicker.js +36 -39
- package/esm/CheckTreePicker/CheckTreePicker.js +64 -67
- package/esm/DatePicker/DatePicker.d.ts +5 -1
- package/esm/DatePicker/DatePicker.js +1 -3
- package/esm/DatePicker/Toolbar.js +2 -1
- package/esm/DateRangeInput/DateRangeInput.js +2 -2
- package/esm/DateRangePicker/Calendar.js +25 -23
- package/esm/DateRangePicker/DateRangePicker.d.ts +18 -4
- package/esm/DateRangePicker/DateRangePicker.js +241 -203
- package/esm/DateRangePicker/types.d.ts +11 -3
- package/esm/DateRangePicker/utils.d.ts +2 -1
- package/esm/DateRangePicker/utils.js +7 -5
- package/esm/FormControl/FormControl.d.ts +11 -1
- package/esm/FormControl/FormControl.js +4 -3
- package/esm/InputPicker/InputPicker.js +64 -65
- package/esm/MultiCascader/MultiCascader.js +43 -45
- package/esm/{DatePicker → Picker}/PickerIndicator.d.ts +1 -1
- package/esm/{DatePicker → Picker}/PickerIndicator.js +2 -1
- package/esm/{DatePicker → Picker}/PickerLabel.d.ts +1 -1
- package/esm/Picker/PickerToggle.d.ts +17 -22
- package/esm/Picker/PickerToggle.js +54 -179
- package/esm/Picker/index.d.ts +3 -0
- package/esm/Picker/index.js +3 -0
- package/esm/Picker/usePickerRef.d.ts +3 -1
- package/esm/Picker/usePickerRef.js +13 -8
- package/esm/Picker/utils.d.ts +5 -9
- package/esm/Picker/utils.js +24 -90
- package/esm/SelectPicker/SelectPicker.d.ts +2 -2
- package/esm/SelectPicker/SelectPicker.js +42 -45
- package/esm/TreePicker/TreePicker.js +75 -78
- package/esm/utils/constants.d.ts +2 -1
- package/esm/utils/constants.js +1 -0
- package/esm/utils/dateUtils.d.ts +0 -1
- package/esm/utils/dateUtils.js +0 -5
- package/esm/utils/getStringLength.d.ts +2 -0
- package/esm/utils/getStringLength.js +13 -0
- package/esm/utils/index.d.ts +1 -0
- package/esm/utils/index.js +1 -0
- package/package.json +1 -1
- package/styles/mixins/combobox.less +10 -0
- /package/cjs/{DatePicker → Picker}/PickerLabel.js +0 -0
- /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 =
|
|
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
|
-
}
|
|
202
|
-
var focusActiveNode =
|
|
203
|
-
if (
|
|
205
|
+
};
|
|
206
|
+
var focusActiveNode = function focusActiveNode() {
|
|
207
|
+
if (list.current) {
|
|
204
208
|
(0, _treeUtils.focusToActiveTreeNode)({
|
|
205
|
-
list:
|
|
209
|
+
list: list.current,
|
|
206
210
|
valueKey: valueKey,
|
|
207
211
|
selector: "." + treePrefix('node-active'),
|
|
208
212
|
activeNode: activeNode,
|
|
209
213
|
virtualized: virtualized,
|
|
210
|
-
container:
|
|
214
|
+
container: treeView.current,
|
|
211
215
|
formattedNodes: getFormattedNodes()
|
|
212
216
|
});
|
|
213
217
|
}
|
|
214
|
-
}
|
|
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 =
|
|
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
|
-
}
|
|
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,
|
|
298
|
-
var
|
|
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
|
-
(
|
|
313
|
-
(
|
|
314
|
-
}
|
|
315
|
-
var handleExpand = (0,
|
|
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
|
-
}
|
|
331
|
-
var handleDragStart = (0,
|
|
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
|
-
}
|
|
341
|
-
var handleDragEnter = (0,
|
|
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
|
-
}
|
|
353
|
-
var handleDragOver = (0,
|
|
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
|
-
}
|
|
367
|
-
var handleDragLeave = (0,
|
|
370
|
+
});
|
|
371
|
+
var handleDragLeave = (0, _utils.useEventCallback)(function (nodeData, event) {
|
|
368
372
|
onDragLeave === null || onDragLeave === void 0 ? void 0 : onDragLeave(nodeData, event);
|
|
369
|
-
}
|
|
370
|
-
var handleDragEnd = (0,
|
|
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
|
-
}
|
|
377
|
-
var handleDrop = (0,
|
|
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
|
-
}
|
|
391
|
-
var handleOpen = (0,
|
|
392
|
-
var
|
|
393
|
-
(
|
|
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
|
-
}
|
|
398
|
-
var handleClose = (0,
|
|
399
|
-
var
|
|
400
|
-
(
|
|
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
|
-
(
|
|
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,
|
|
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
|
-
}
|
|
443
|
-
var handleLeftArrow = (0,
|
|
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
|
-
}
|
|
458
|
-
var handleRightArrow = (0,
|
|
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
|
-
}
|
|
471
|
-
var selectActiveItem = (0,
|
|
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
|
-
}
|
|
476
|
-
var handleClean = (0,
|
|
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
|
-
}
|
|
483
|
+
});
|
|
488
484
|
var onPickerKeydown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({
|
|
489
485
|
toggle: !activeNode || !active,
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
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,
|
|
513
|
-
if (!
|
|
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
|
-
}
|
|
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:
|
|
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:
|
|
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)(
|
|
634
|
+
ref: (0, _utils.mergeRefs)(overlay, speakerRef),
|
|
639
635
|
onKeyDown: onPickerKeydown,
|
|
640
|
-
target:
|
|
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:
|
|
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:
|
|
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:
|
|
688
|
+
ref: target,
|
|
692
689
|
appearance: appearance,
|
|
693
690
|
onKeyDown: onPickerKeydown,
|
|
694
691
|
onClean: (0, _utils.createChainedFunction)(handleClean, onClean),
|
package/cjs/utils/constants.d.ts
CHANGED
package/cjs/utils/constants.js
CHANGED
|
@@ -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 = {}));
|
package/cjs/utils/dateUtils.d.ts
CHANGED
|
@@ -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
|
*/
|
package/cjs/utils/dateUtils.js
CHANGED
|
@@ -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,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;
|
package/cjs/utils/index.d.ts
CHANGED
|
@@ -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';
|
package/cjs/utils/index.js
CHANGED
|
@@ -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"));
|