rsuite 5.4.4 → 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 +48 -0
- package/Carousel/styles/index.less +1 -0
- package/CheckTreePicker/styles/index.less +51 -50
- package/Modal/styles/mixin.less +1 -0
- package/Picker/styles/mixin.less +3 -2
- package/README.md +1 -1
- package/Sidenav/styles/index.less +54 -59
- package/TreePicker/styles/index.less +3 -3
- 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/Cascader.js +2 -2
- 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/Calendar.js +2 -16
- package/cjs/DateRangePicker/DateRangePicker.js +1 -1
- package/cjs/Dropdown/Dropdown.d.ts +5 -0
- package/cjs/Dropdown/test/Dropdown.test.d.ts +1 -0
- package/cjs/Dropdown/test/Dropdown.test.js +30 -0
- package/cjs/InputNumber/InputNumber.d.ts +1 -1
- package/cjs/InputNumber/InputNumber.js +36 -6
- package/cjs/InputNumber/test/InputNumber.test.d.ts +1 -0
- package/cjs/InputNumber/test/InputNumber.test.js +14 -0
- 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/MultiCascader/MultiCascader.js +1 -0
- package/cjs/Picker/PickerOverlay.js +4 -1
- package/cjs/RangeSlider/RangeSlider.d.ts +12 -2
- package/cjs/RangeSlider/RangeSlider.js +35 -12
- 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/treeUtils.js +4 -3
- package/cjs/utils/useElementResize.d.ts +1 -1
- package/cjs/utils/useElementResize.js +5 -2
- package/dist/rsuite-rtl.css +114 -123
- package/dist/rsuite-rtl.min.css +1 -1
- package/dist/rsuite-rtl.min.css.map +1 -1
- package/dist/rsuite.css +114 -123
- package/dist/rsuite.js +372 -53
- 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/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/Cascader.js +2 -2
- 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/Calendar.js +2 -16
- package/esm/DateRangePicker/DateRangePicker.js +1 -1
- package/esm/Dropdown/Dropdown.d.ts +5 -0
- package/esm/Dropdown/test/Dropdown.test.d.ts +1 -0
- package/esm/Dropdown/test/Dropdown.test.js +22 -0
- package/esm/InputNumber/InputNumber.d.ts +1 -1
- package/esm/InputNumber/InputNumber.js +38 -7
- package/esm/InputNumber/test/InputNumber.test.d.ts +1 -0
- package/esm/InputNumber/test/InputNumber.test.js +7 -0
- 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/MultiCascader/MultiCascader.js +1 -0
- package/esm/Picker/PickerOverlay.js +4 -1
- package/esm/RangeSlider/RangeSlider.d.ts +12 -2
- package/esm/RangeSlider/RangeSlider.js +35 -12
- 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/treeUtils.js +6 -3
- package/esm/utils/useElementResize.d.ts +1 -1
- package/esm/utils/useElementResize.js +5 -2
- package/package.json +3 -3
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
|
|
|
@@ -114,22 +114,8 @@ var Calendar = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
114
114
|
return !after;
|
|
115
115
|
}, [calendarDate, index, showOneCalendar]);
|
|
116
116
|
var disabledMonth = (0, _react.useCallback)(function (date) {
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
if (disabledDate !== null && disabledDate !== void 0 && disabledDate(date, value, _utils.DATERANGE_DISABLED_TARGET.CALENDAR)) {
|
|
120
|
-
return true;
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
if (showOneCalendar) return false;
|
|
124
|
-
|
|
125
|
-
if (index === 1) {
|
|
126
|
-
after = (0, _dateUtils.isAfter)(date, calendarDate[0]);
|
|
127
|
-
return !after;
|
|
128
|
-
}
|
|
129
|
-
|
|
130
|
-
after = (0, _dateUtils.isAfter)(calendarDate[1], date);
|
|
131
|
-
return !after;
|
|
132
|
-
}, [calendarDate, disabledDate, index, showOneCalendar, value]);
|
|
117
|
+
return disabledDate === null || disabledDate === void 0 ? void 0 : disabledDate(date, value, _utils.DATERANGE_DISABLED_TARGET.CALENDAR);
|
|
118
|
+
}, [disabledDate, value]);
|
|
133
119
|
return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {
|
|
134
120
|
format: format,
|
|
135
121
|
calendarState: calendarState,
|
|
@@ -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])) {
|
|
@@ -3,6 +3,7 @@ import DropdownMenu from './DropdownMenu';
|
|
|
3
3
|
import { TypeAttributes, WithAsProps, RsRefForwardingComponent } from '../@types/common';
|
|
4
4
|
import { IconProps } from '@rsuite/icons/lib/Icon';
|
|
5
5
|
import DropdownItem from './DropdownItem';
|
|
6
|
+
import Button from '../Button';
|
|
6
7
|
export declare type DropdownTrigger = 'click' | 'hover' | 'contextMenu';
|
|
7
8
|
export interface DropdownProps<T = any> extends WithAsProps, Omit<React.HTMLAttributes<HTMLElement>, 'onSelect' | 'title'> {
|
|
8
9
|
/** Define the title as a submenu */
|
|
@@ -48,6 +49,10 @@ export interface DropdownProps<T = any> extends WithAsProps, Omit<React.HTMLAttr
|
|
|
48
49
|
onSelect?: (eventKey: T | undefined, event: React.SyntheticEvent) => void;
|
|
49
50
|
}
|
|
50
51
|
export interface DropdownComponent extends RsRefForwardingComponent<'div', DropdownProps> {
|
|
52
|
+
<ToggleAs extends React.ElementType = typeof Button>(props: DropdownProps & {
|
|
53
|
+
ref?: React.Ref<any>;
|
|
54
|
+
toggleAs?: ToggleAs;
|
|
55
|
+
} & React.ComponentProps<ToggleAs>, context: any): JSX.Element | null;
|
|
51
56
|
Item: typeof DropdownItem;
|
|
52
57
|
Menu: typeof DropdownMenu;
|
|
53
58
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
var _react = _interopRequireDefault(require("react"));
|
|
6
|
+
|
|
7
|
+
var _Dropdown = _interopRequireDefault(require("../Dropdown"));
|
|
8
|
+
|
|
9
|
+
var ref = /*#__PURE__*/_react.default.createRef(); // Infer `toggleAs` props (defaults to Button)
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
/*#__PURE__*/
|
|
13
|
+
_react.default.createElement(_Dropdown.default, {
|
|
14
|
+
ref: ref,
|
|
15
|
+
appearance: "subtle",
|
|
16
|
+
size: "sm"
|
|
17
|
+
});
|
|
18
|
+
/* eslint-disable @typescript-eslint/no-unused-vars */
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
var CustomToggle = function CustomToggle(_props) {
|
|
22
|
+
return null;
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
/*#__PURE__*/
|
|
26
|
+
_react.default.createElement(_Dropdown.default, {
|
|
27
|
+
ref: ref,
|
|
28
|
+
toggleAs: CustomToggle,
|
|
29
|
+
myProp: "myValue"
|
|
30
|
+
});
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { WithAsProps, TypeAttributes, FormControlBaseProps } from '../@types/common';
|
|
3
|
-
export interface InputNumberProps<T = number | string> extends WithAsProps, FormControlBaseProps<T> {
|
|
3
|
+
export interface InputNumberProps<T = number | string> extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'value' | 'defaultValue' | 'onChange' | 'size' | 'prefix'>, WithAsProps, FormControlBaseProps<T> {
|
|
4
4
|
/** Button can have different appearances */
|
|
5
5
|
buttonAppearance?: TypeAttributes.Appearance;
|
|
6
6
|
/** An input can show that it is disabled */
|
|
@@ -114,15 +114,15 @@ var InputNumber = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
114
114
|
step = _props$step === void 0 ? 1 : _props$step,
|
|
115
115
|
_props$buttonAppearan = props.buttonAppearance,
|
|
116
116
|
buttonAppearance = _props$buttonAppearan === void 0 ? 'subtle' : _props$buttonAppearan,
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
_props$max = props.max,
|
|
120
|
-
max = _props$max === void 0 ? Infinity : _props$max,
|
|
117
|
+
minProp = props.min,
|
|
118
|
+
maxProp = props.max,
|
|
121
119
|
_props$scrollable = props.scrollable,
|
|
122
120
|
scrollable = _props$scrollable === void 0 ? true : _props$scrollable,
|
|
123
121
|
onChange = props.onChange,
|
|
124
122
|
onWheel = props.onWheel,
|
|
125
123
|
restProps = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "className", "classPrefix", "disabled", "readOnly", "plaintext", "value", "defaultValue", "size", "prefix", "postfix", "step", "buttonAppearance", "min", "max", "scrollable", "onChange", "onWheel"]);
|
|
124
|
+
var min = minProp !== null && minProp !== void 0 ? minProp : -Infinity;
|
|
125
|
+
var max = maxProp !== null && maxProp !== void 0 ? maxProp : Infinity;
|
|
126
126
|
|
|
127
127
|
var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue),
|
|
128
128
|
value = _useControlled[0],
|
|
@@ -187,6 +187,35 @@ var InputNumber = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
187
187
|
var bit = decimals(val, step);
|
|
188
188
|
handleChangeValue(getSafeValue((val - step).toFixed(bit)), event);
|
|
189
189
|
}, [getSafeValue, handleChangeValue, step, value]);
|
|
190
|
+
var handleKeyDown = (0, _react.useCallback)(function (event) {
|
|
191
|
+
switch (event.key) {
|
|
192
|
+
case _utils.KEY_VALUES.UP:
|
|
193
|
+
event.preventDefault();
|
|
194
|
+
handlePlus(event);
|
|
195
|
+
break;
|
|
196
|
+
|
|
197
|
+
case _utils.KEY_VALUES.DOWN:
|
|
198
|
+
event.preventDefault();
|
|
199
|
+
handleMinus(event);
|
|
200
|
+
break;
|
|
201
|
+
|
|
202
|
+
case _utils.KEY_VALUES.HOME:
|
|
203
|
+
if (typeof minProp !== 'undefined') {
|
|
204
|
+
event.preventDefault();
|
|
205
|
+
handleChangeValue(getSafeValue(minProp), event);
|
|
206
|
+
}
|
|
207
|
+
|
|
208
|
+
break;
|
|
209
|
+
|
|
210
|
+
case _utils.KEY_VALUES.END:
|
|
211
|
+
if (typeof maxProp !== 'undefined') {
|
|
212
|
+
event.preventDefault();
|
|
213
|
+
handleChangeValue(getSafeValue(maxProp), event);
|
|
214
|
+
}
|
|
215
|
+
|
|
216
|
+
break;
|
|
217
|
+
}
|
|
218
|
+
}, [handlePlus, handleMinus, minProp, maxProp, handleChangeValue, getSafeValue]);
|
|
190
219
|
var handleWheel = (0, _react.useCallback)(function (event) {
|
|
191
220
|
if (!disabled && !readOnly && event.target === document.activeElement) {
|
|
192
221
|
event.preventDefault();
|
|
@@ -233,7 +262,7 @@ var InputNumber = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
233
262
|
}, [handleWheel, scrollable]);
|
|
234
263
|
|
|
235
264
|
var input = /*#__PURE__*/_react.default.createElement(_Input.default, (0, _extends2.default)({}, htmlInputProps, {
|
|
236
|
-
type: "
|
|
265
|
+
type: "number",
|
|
237
266
|
autoComplete: "off",
|
|
238
267
|
step: step,
|
|
239
268
|
inputRef: inputRef,
|
|
@@ -243,7 +272,8 @@ var InputNumber = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
243
272
|
disabled: disabled,
|
|
244
273
|
readOnly: readOnly,
|
|
245
274
|
plaintext: plaintext,
|
|
246
|
-
ref: plaintext ? ref : undefined
|
|
275
|
+
ref: plaintext ? ref : undefined,
|
|
276
|
+
onKeyDown: handleKeyDown
|
|
247
277
|
}));
|
|
248
278
|
|
|
249
279
|
if (plaintext) {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
var _react = _interopRequireDefault(require("react"));
|
|
6
|
+
|
|
7
|
+
var _InputNumber = _interopRequireDefault(require("../InputNumber"));
|
|
8
|
+
|
|
9
|
+
// Inherits <input type="number" /> attributes
|
|
10
|
+
|
|
11
|
+
/*#__PURE__*/
|
|
12
|
+
_react.default.createElement(_InputNumber.default, {
|
|
13
|
+
placeholder: "Enter number"
|
|
14
|
+
});
|
|
@@ -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,
|
|
@@ -482,6 +482,7 @@ var MultiCascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
|
|
|
482
482
|
var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends3.default)({}, props, {
|
|
483
483
|
classPrefix: classPrefix,
|
|
484
484
|
hasValue: hasValue,
|
|
485
|
+
countable: countable,
|
|
485
486
|
name: 'cascader',
|
|
486
487
|
appearance: appearance,
|
|
487
488
|
cleanable: cleanable
|
|
@@ -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
|
|
|
@@ -1,6 +1,16 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { SliderProps } from '../Slider';
|
|
3
3
|
export declare type Range = [number, number];
|
|
4
|
-
export declare type RangeSliderProps = SliderProps<Range
|
|
5
|
-
|
|
4
|
+
export declare type RangeSliderProps = SliderProps<Range> & {
|
|
5
|
+
/**
|
|
6
|
+
* Add constraint to validate before onChange is dispatched
|
|
7
|
+
*/
|
|
8
|
+
constraint?: (range: Range) => boolean;
|
|
9
|
+
};
|
|
10
|
+
declare const RangeSlider: React.ForwardRefExoticComponent<SliderProps<Range> & {
|
|
11
|
+
/**
|
|
12
|
+
* Add constraint to validate before onChange is dispatched
|
|
13
|
+
*/
|
|
14
|
+
constraint?: ((range: Range) => boolean) | undefined;
|
|
15
|
+
} & React.RefAttributes<unknown>>;
|
|
6
16
|
export default RangeSlider;
|
|
@@ -45,6 +45,7 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
45
45
|
Component = _props$as === void 0 ? 'div' : _props$as,
|
|
46
46
|
barClassName = props.barClassName,
|
|
47
47
|
className = props.className,
|
|
48
|
+
constraint = props.constraint,
|
|
48
49
|
_props$defaultValue = props.defaultValue,
|
|
49
50
|
defaultValue = _props$defaultValue === void 0 ? defaultDefaultValue : _props$defaultValue,
|
|
50
51
|
graduated = props.graduated,
|
|
@@ -71,7 +72,7 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
71
72
|
renderMark = props.renderMark,
|
|
72
73
|
onChange = props.onChange,
|
|
73
74
|
onChangeCommitted = props.onChangeCommitted,
|
|
74
|
-
rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["aria-label", "aria-labelledby", "aria-valuetext", "as", "barClassName", "className", "defaultValue", "graduated", "progress", "vertical", "disabled", "classPrefix", "min", "max", "step", "value", "handleClassName", "handleStyle", "handleTitle", "tooltip", "getAriaValueText", "renderTooltip", "renderMark", "onChange", "onChangeCommitted"]);
|
|
75
|
+
rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["aria-label", "aria-labelledby", "aria-valuetext", "as", "barClassName", "className", "constraint", "defaultValue", "graduated", "progress", "vertical", "disabled", "classPrefix", "min", "max", "step", "value", "handleClassName", "handleStyle", "handleTitle", "tooltip", "getAriaValueText", "renderTooltip", "renderMark", "onChange", "onChangeCommitted"]);
|
|
75
76
|
var barRef = (0, _react.useRef)(null); // Define the parameter position of the handle
|
|
76
77
|
|
|
77
78
|
var handleIndexs = (0, _react.useRef)([0, 1]);
|
|
@@ -180,14 +181,27 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
180
181
|
|
|
181
182
|
return nextValue;
|
|
182
183
|
}, [getRangeValue, getValidValue]);
|
|
184
|
+
/**
|
|
185
|
+
* Whether a range is valid against given constraint (if any)
|
|
186
|
+
* Should check before every `setValue` calls
|
|
187
|
+
*/
|
|
188
|
+
|
|
189
|
+
var isRangeMatchingConstraint = (0, _react.useCallback)(function (range) {
|
|
190
|
+
// If no constraint is defined, any range is valid
|
|
191
|
+
if (!constraint) return true;
|
|
192
|
+
return constraint(range);
|
|
193
|
+
}, [constraint]);
|
|
183
194
|
/**
|
|
184
195
|
* Callback function that is fired when the mousemove is triggered
|
|
185
196
|
*/
|
|
186
197
|
|
|
187
198
|
var handleDragMove = (0, _utils.useEventCallback)(function (event, dataset) {
|
|
188
199
|
var nextValue = getNextValue(event, dataset);
|
|
189
|
-
|
|
190
|
-
|
|
200
|
+
|
|
201
|
+
if (isRangeMatchingConstraint(nextValue)) {
|
|
202
|
+
setValue(nextValue);
|
|
203
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
|
|
204
|
+
}
|
|
191
205
|
});
|
|
192
206
|
/**
|
|
193
207
|
* Callback function that is fired when the mouseup is triggered
|
|
@@ -195,9 +209,12 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
195
209
|
|
|
196
210
|
var handleChangeCommitted = (0, _react.useCallback)(function (event, dataset) {
|
|
197
211
|
var nextValue = getNextValue(event, dataset);
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
212
|
+
|
|
213
|
+
if (isRangeMatchingConstraint(nextValue)) {
|
|
214
|
+
setValue(nextValue);
|
|
215
|
+
onChangeCommitted === null || onChangeCommitted === void 0 ? void 0 : onChangeCommitted(nextValue, event);
|
|
216
|
+
}
|
|
217
|
+
}, [getNextValue, onChangeCommitted, isRangeMatchingConstraint, setValue]);
|
|
201
218
|
var handleKeyDown = (0, _react.useCallback)(function (event) {
|
|
202
219
|
var _event$target;
|
|
203
220
|
|
|
@@ -240,9 +257,12 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
240
257
|
|
|
241
258
|
|
|
242
259
|
event.preventDefault();
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
260
|
+
|
|
261
|
+
if (isRangeMatchingConstraint(nextValue)) {
|
|
262
|
+
setValue(nextValue);
|
|
263
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
|
|
264
|
+
}
|
|
265
|
+
}, [max, min, onChange, rtl, isRangeMatchingConstraint, setValue, step, value]);
|
|
246
266
|
var handleClick = (0, _react.useCallback)(function (event) {
|
|
247
267
|
if (disabled) {
|
|
248
268
|
return;
|
|
@@ -259,9 +279,12 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
259
279
|
}
|
|
260
280
|
|
|
261
281
|
var nextValue = getValidValue([start, end].sort());
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
282
|
+
|
|
283
|
+
if (isRangeMatchingConstraint(nextValue)) {
|
|
284
|
+
setValue(nextValue);
|
|
285
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
|
|
286
|
+
}
|
|
287
|
+
}, [disabled, getValidValue, getValueByPosition, isRangeMatchingConstraint, onChange, setValue, value]);
|
|
265
288
|
var handleProps = (0, _react.useMemo)(function () {
|
|
266
289
|
return [{
|
|
267
290
|
value: value[0],
|
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
|
}
|