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