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.
- package/CHANGELOG.md +11 -0
- package/README.md +1 -1
- package/cjs/Affix/Affix.js +1 -0
- package/cjs/Calendar/TimeDropdown.js +7 -4
- package/cjs/Carousel/Carousel.d.ts +5 -1
- package/cjs/Carousel/Carousel.js +22 -16
- package/cjs/Cascader/DropdownMenu.js +1 -1
- package/cjs/CheckTreePicker/CheckTreePicker.js +17 -12
- package/cjs/CheckTreePicker/utils.d.ts +3 -3
- package/cjs/CheckTreePicker/utils.js +2 -2
- package/cjs/DOMHelper/index.d.ts +4 -4
- package/cjs/DatePicker/DatePicker.js +15 -9
- package/cjs/DateRangePicker/DateRangePicker.js +1 -1
- package/cjs/InputPicker/InputAutosize.js +3 -1
- package/cjs/InputPicker/InputPicker.js +6 -2
- package/cjs/List/ListItem.js +13 -11
- package/cjs/Menu/MenuItem.js +14 -11
- package/cjs/Picker/PickerOverlay.js +4 -1
- package/cjs/Ripple/Ripple.js +17 -9
- package/cjs/TreePicker/TreePicker.js +15 -11
- package/cjs/Uploader/UploadTrigger.js +3 -1
- package/cjs/Uploader/Uploader.js +3 -1
- package/cjs/utils/treeUtils.d.ts +3 -3
- package/cjs/utils/useElementResize.d.ts +1 -1
- package/cjs/utils/useElementResize.js +5 -2
- package/dist/rsuite.js +365 -46
- package/dist/rsuite.js.map +1 -1
- package/dist/rsuite.min.js +1 -1
- package/dist/rsuite.min.js.map +1 -1
- package/esm/Affix/Affix.js +1 -0
- package/esm/Calendar/TimeDropdown.js +7 -4
- package/esm/Carousel/Carousel.d.ts +5 -1
- package/esm/Carousel/Carousel.js +23 -17
- package/esm/Cascader/DropdownMenu.js +1 -1
- package/esm/CheckTreePicker/CheckTreePicker.js +17 -12
- package/esm/CheckTreePicker/utils.d.ts +3 -3
- package/esm/CheckTreePicker/utils.js +2 -2
- package/esm/DOMHelper/index.d.ts +4 -4
- package/esm/DatePicker/DatePicker.js +15 -9
- package/esm/DateRangePicker/DateRangePicker.js +1 -1
- package/esm/InputPicker/InputAutosize.js +3 -1
- package/esm/InputPicker/InputPicker.js +6 -2
- package/esm/List/ListItem.js +13 -11
- package/esm/Menu/MenuItem.js +14 -11
- package/esm/Picker/PickerOverlay.js +4 -1
- package/esm/Ripple/Ripple.js +17 -9
- package/esm/TreePicker/TreePicker.js +15 -11
- package/esm/Uploader/UploadTrigger.js +3 -1
- package/esm/Uploader/Uploader.js +3 -1
- package/esm/utils/treeUtils.d.ts +3 -3
- package/esm/utils/useElementResize.d.ts +1 -1
- package/esm/utils/useElementResize.js +5 -2
- 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/
|
|
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
|
package/cjs/Affix/Affix.js
CHANGED
|
@@ -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
|
|
105
|
-
top = _ref2.top;
|
|
104
|
+
var position = (0, _getPosition.default)(node, container);
|
|
106
105
|
|
|
107
|
-
|
|
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 &&
|
|
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
|
-
/**
|
|
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;
|
package/cjs/Carousel/Carousel.js
CHANGED
|
@@ -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
|
-
|
|
59
|
-
|
|
65
|
+
lastIndex = _useState[0],
|
|
66
|
+
setLastIndex = _useState[1];
|
|
60
67
|
|
|
61
|
-
var
|
|
62
|
-
|
|
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
|
|
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
|
|
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]);
|
|
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
|
-
|
|
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
|
-
|
|
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
|
-
(
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
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:
|
|
40
|
-
export declare function getFormattedTree(data: any[], nodes: TreeNodesType, props:
|
|
41
|
-
export declare function getDisabledState(nodes: TreeNodesType, node: TreeNodeType, props:
|
|
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
|
}
|
package/cjs/DOMHelper/index.d.ts
CHANGED
|
@@ -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
|
|
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
|
-
|
|
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
|
-
|
|
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]);
|
package/cjs/List/ListItem.js
CHANGED
|
@@ -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
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
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
|
-
|
|
58
|
+
return unregister;
|
|
59
|
+
}
|
|
58
60
|
}, [collection, disabled, index, register]);
|
|
59
61
|
var classes = merge(className, withClassPrefix(size, {
|
|
60
62
|
disabled: disabled,
|
package/cjs/Menu/MenuItem.js
CHANGED
|
@@ -74,19 +74,22 @@ function MenuItem(props) {
|
|
|
74
74
|
}, [dispatch]);
|
|
75
75
|
(0, _react.useEffect)(function () {
|
|
76
76
|
var menuitemElement = menuitemRef.current;
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
element: menuitemElement,
|
|
80
|
-
props: {
|
|
81
|
-
disabled: disabled
|
|
82
|
-
}
|
|
83
|
-
});
|
|
84
|
-
return function () {
|
|
77
|
+
|
|
78
|
+
if (menuitemElement) {
|
|
85
79
|
dispatch({
|
|
86
|
-
type: _MenuContext.MenuActionTypes.
|
|
87
|
-
|
|
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
|
-
|
|
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
|
|
package/cjs/Ripple/Ripple.js
CHANGED
|
@@ -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
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
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
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
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
|
-
|
|
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
|
-
|
|
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
|
-
(
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
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
|
|
72
|
+
if (inputRef.current) {
|
|
73
|
+
inputRef.current.value = '';
|
|
74
|
+
}
|
|
73
75
|
}, []);
|
|
74
76
|
var handleDragEnter = (0, _react.useCallback)(function (event) {
|
|
75
77
|
if (draggable) {
|
package/cjs/Uploader/Uploader.js
CHANGED
|
@@ -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
|
-
|
|
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.
|
package/cjs/utils/treeUtils.d.ts
CHANGED
|
@@ -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'
|
|
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:
|
|
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
|
-
|
|
23
|
-
|
|
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 () {
|