rsuite 5.7.1 → 5.9.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 +26 -0
- package/Table/styles/index.less +2 -10
- package/cjs/Button/Button.d.ts +1 -1
- package/cjs/Cascader/Cascader.d.ts +12 -3
- package/cjs/Cascader/Cascader.js +17 -14
- package/cjs/Cascader/test/Cascader.test.d.ts +1 -0
- package/cjs/Cascader/test/Cascader.test.js +70 -0
- package/cjs/DateRangePicker/index.d.ts +1 -0
- package/cjs/Dropdown/Dropdown.d.ts +5 -2
- package/cjs/Dropdown/Dropdown.js +5 -1
- package/cjs/InputNumber/InputNumber.js +27 -34
- package/cjs/Menu/Menu.d.ts +10 -2
- package/cjs/Menu/Menu.js +18 -11
- package/cjs/Menu/MenuItem.js +1 -0
- package/cjs/Modal/Modal.d.ts +6 -2
- package/cjs/Modal/Modal.js +6 -2
- package/cjs/RangeSlider/RangeSlider.js +3 -1
- package/cjs/SelectPicker/SelectPicker.d.ts +1 -1
- package/cjs/SelectPicker/SelectPicker.js +2 -1
- package/cjs/Toggle/Toggle.js +7 -2
- package/dist/rsuite-rtl.css +4 -11
- package/dist/rsuite-rtl.min.css +1 -1
- package/dist/rsuite-rtl.min.css.map +1 -1
- package/dist/rsuite.css +4 -11
- package/dist/rsuite.js +16 -16
- 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/Button/Button.d.ts +1 -1
- package/esm/Cascader/Cascader.d.ts +12 -3
- package/esm/Cascader/Cascader.js +17 -14
- package/esm/Cascader/test/Cascader.test.d.ts +1 -0
- package/esm/Cascader/test/Cascader.test.js +59 -0
- package/esm/DateRangePicker/index.d.ts +1 -0
- package/esm/Dropdown/Dropdown.d.ts +5 -2
- package/esm/Dropdown/Dropdown.js +5 -1
- package/esm/InputNumber/InputNumber.js +28 -35
- package/esm/Menu/Menu.d.ts +10 -2
- package/esm/Menu/Menu.js +18 -11
- package/esm/Menu/MenuItem.js +1 -0
- package/esm/Modal/Modal.d.ts +6 -2
- package/esm/Modal/Modal.js +5 -3
- package/esm/RangeSlider/RangeSlider.js +3 -1
- package/esm/SelectPicker/SelectPicker.d.ts +1 -1
- package/esm/SelectPicker/SelectPicker.js +2 -1
- package/esm/Toggle/Toggle.js +8 -3
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,29 @@
|
|
|
1
|
+
# [5.9.0](https://github.com/rsuite/rsuite/compare/v5.8.1...v5.9.0) (2022-04-21)
|
|
2
|
+
|
|
3
|
+
### Features
|
|
4
|
+
|
|
5
|
+
- **Dropdown:** add `open` and `defaultOpen` props ([#2442](https://github.com/rsuite/rsuite/issues/2442)) ([ab13d63](https://github.com/rsuite/rsuite/commit/ab13d6368676c19f8a4fb041e84a423b1a810914))
|
|
6
|
+
|
|
7
|
+
## [5.8.1](https://github.com/rsuite/rsuite/compare/v5.8.0...v5.8.1) (2022-04-15)
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
- **Cascader:** infer value and onChange types from data ([#2449](https://github.com/rsuite/rsuite/issues/2449)) ([2a8ef48](https://github.com/rsuite/rsuite/commit/2a8ef481e49dec2570868982e0dbbba808efbc03))
|
|
12
|
+
- **Dropdown.Menu:** de-highlight item when mouse leaving ([#2443](https://github.com/rsuite/rsuite/issues/2443)) ([0d7b963](https://github.com/rsuite/rsuite/commit/0d7b96350b79a41557d1a7b67140c9654755194e))
|
|
13
|
+
|
|
14
|
+
# [5.8.0](https://github.com/rsuite/rsuite/compare/v5.7.1...v5.8.0) (2022-04-07)
|
|
15
|
+
|
|
16
|
+
### Bug Fixes
|
|
17
|
+
|
|
18
|
+
- **RangeSlider:** fix RangeSlider progress bar misalignment ([#2435](https://github.com/rsuite/rsuite/issues/2435)) ([e612ee3](https://github.com/rsuite/rsuite/commit/e612ee3b6bb97217ad08744c6b57b47e21397944))
|
|
19
|
+
- **SelectPicker:** call onSearch with empty string when closed ([#2411](https://github.com/rsuite/rsuite/issues/2411)) ([c6e5d54](https://github.com/rsuite/rsuite/commit/c6e5d54bdda0cdc61b65fbed78518ccef5d7672f))
|
|
20
|
+
- **Toggle:** add missing properties to onChange event target ([#2422](https://github.com/rsuite/rsuite/issues/2422)) ([5d1d5a2](https://github.com/rsuite/rsuite/commit/5d1d5a29a03f642c88aa66851163c9bb20d69684))
|
|
21
|
+
|
|
22
|
+
### Features
|
|
23
|
+
|
|
24
|
+
- **Cascader:** add `renderSearchItem` for customizing search result ([#2427](https://github.com/rsuite/rsuite/issues/2427)) ([e1b1dbd](https://github.com/rsuite/rsuite/commit/e1b1dbd2fd6cde10dfb1e041d9483b6748a0855f))
|
|
25
|
+
- **DateRangePicker:** export type definition ([#2434](https://github.com/rsuite/rsuite/issues/2434)) ([76e4bc3](https://github.com/rsuite/rsuite/commit/76e4bc38e8e939ae6ffbcf5bc154281b4ec9360c))
|
|
26
|
+
|
|
1
27
|
## [5.7.1](https://github.com/rsuite/rsuite/compare/v5.7.0...v5.7.1) (2022-04-02)
|
|
2
28
|
|
|
3
29
|
### Bug Fixes
|
package/Table/styles/index.less
CHANGED
|
@@ -22,17 +22,12 @@
|
|
|
22
22
|
height: 36px;
|
|
23
23
|
width: 100%;
|
|
24
24
|
top: 0;
|
|
25
|
-
border-bottom: 1px solid var(--rs-border-secondary);
|
|
26
25
|
|
|
27
26
|
&.virtualized {
|
|
28
27
|
.pointer-event-none();
|
|
29
28
|
}
|
|
30
29
|
}
|
|
31
30
|
|
|
32
|
-
&-row-rowspan + &-row {
|
|
33
|
-
border-top: 1px solid var(--rs-border-secondary);
|
|
34
|
-
}
|
|
35
|
-
|
|
36
31
|
&-row-expanded {
|
|
37
32
|
position: absolute;
|
|
38
33
|
height: 46px;
|
|
@@ -167,14 +162,12 @@
|
|
|
167
162
|
|
|
168
163
|
&-cell {
|
|
169
164
|
height: 36px;
|
|
170
|
-
border-style: solid;
|
|
171
|
-
border-width: 0;
|
|
172
|
-
border-color: var(--rs-border-secondary);
|
|
173
165
|
display: block;
|
|
174
166
|
overflow: hidden;
|
|
175
167
|
position: absolute;
|
|
176
168
|
white-space: normal;
|
|
177
169
|
background-color: var(--rs-bg-card);
|
|
170
|
+
border-bottom: 1px solid var(--rs-border-secondary);
|
|
178
171
|
|
|
179
172
|
&.first {
|
|
180
173
|
border-left-width: 0;
|
|
@@ -195,7 +188,6 @@
|
|
|
195
188
|
|
|
196
189
|
&-content {
|
|
197
190
|
padding: @table-cell-padding-y @table-cell-padding-x;
|
|
198
|
-
|
|
199
191
|
.ellipsis();
|
|
200
192
|
}
|
|
201
193
|
|
|
@@ -318,7 +310,7 @@
|
|
|
318
310
|
}
|
|
319
311
|
|
|
320
312
|
&-cell-bordered &-cell {
|
|
321
|
-
border-
|
|
313
|
+
border-right: 1px solid var(--rs-border-secondary);
|
|
322
314
|
}
|
|
323
315
|
|
|
324
316
|
&-column-group {
|
package/cjs/Button/Button.d.ts
CHANGED
|
@@ -9,7 +9,7 @@ export interface ButtonProps extends WithAsProps, React.HTMLAttributes<HTMLEleme
|
|
|
9
9
|
size?: TypeAttributes.Size;
|
|
10
10
|
/** A button can have different colors */
|
|
11
11
|
color?: TypeAttributes.Color;
|
|
12
|
-
/** Format button to appear inside a content
|
|
12
|
+
/** Format button to appear inside a content block */
|
|
13
13
|
block?: boolean;
|
|
14
14
|
/** Providing a `href` will render an `<a>` element, _styled_ as a button */
|
|
15
15
|
href?: string;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { PickerLocale } from '../locales';
|
|
3
|
-
import {
|
|
3
|
+
import { PickerInstance } from '../Picker';
|
|
4
4
|
import { ItemDataType, FormControlPickerProps } from '../@types/common';
|
|
5
5
|
export declare type ValueType = number | string;
|
|
6
|
-
export interface CascaderProps<T = ValueType> extends FormControlPickerProps<T | null, PickerLocale, ItemDataType
|
|
6
|
+
export interface CascaderProps<T = ValueType> extends FormControlPickerProps<T | null, PickerLocale, ItemDataType<T>> {
|
|
7
7
|
/** Sets the width of the menu */
|
|
8
8
|
menuWidth?: number;
|
|
9
9
|
/** Sets the height of the menu */
|
|
@@ -18,6 +18,8 @@ export interface CascaderProps<T = ValueType> extends FormControlPickerProps<T |
|
|
|
18
18
|
renderMenu?: (items: ItemDataType[], menu: React.ReactNode, parentNode?: any, layer?: number) => React.ReactNode;
|
|
19
19
|
/** Custom render menu items */
|
|
20
20
|
renderMenuItem?: (itemLabel: React.ReactNode, item: ItemDataType) => React.ReactNode;
|
|
21
|
+
/** Custom render search items */
|
|
22
|
+
renderSearchItem?: (itemLabel: React.ReactNode, items: ItemDataType[]) => React.ReactNode;
|
|
21
23
|
/** Custom render selected items */
|
|
22
24
|
renderValue?: (value: T, selectedPaths: ItemDataType[], selectedElement: React.ReactNode) => React.ReactNode;
|
|
23
25
|
/** Called when the option is selected */
|
|
@@ -29,5 +31,12 @@ export interface CascaderProps<T = ValueType> extends FormControlPickerProps<T |
|
|
|
29
31
|
/** Asynchronously load the children of the tree node. */
|
|
30
32
|
getChildren?: (node: ItemDataType) => ItemDataType[] | Promise<ItemDataType[]>;
|
|
31
33
|
}
|
|
32
|
-
|
|
34
|
+
export interface CascaderComponent {
|
|
35
|
+
<T>(props: CascaderProps<T> & {
|
|
36
|
+
ref?: React.Ref<PickerInstance>;
|
|
37
|
+
}): JSX.Element | null;
|
|
38
|
+
displayName?: string;
|
|
39
|
+
propTypes?: React.WeakValidationMap<CascaderProps<any>>;
|
|
40
|
+
}
|
|
41
|
+
declare const Cascader: CascaderComponent;
|
|
33
42
|
export default Cascader;
|
package/cjs/Cascader/Cascader.js
CHANGED
|
@@ -75,6 +75,7 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
75
75
|
placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,
|
|
76
76
|
id = props.id,
|
|
77
77
|
renderMenuItem = props.renderMenuItem,
|
|
78
|
+
renderSearchItem = props.renderSearchItem,
|
|
78
79
|
renderValue = props.renderValue,
|
|
79
80
|
renderMenu = props.renderMenu,
|
|
80
81
|
renderExtraFooter = props.renderExtraFooter,
|
|
@@ -87,7 +88,7 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
87
88
|
onClose = props.onClose,
|
|
88
89
|
onOpen = props.onOpen,
|
|
89
90
|
getChildren = props.getChildren,
|
|
90
|
-
rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "data", "classPrefix", "childrenKey", "valueKey", "labelKey", "defaultValue", "placeholder", "disabled", "disabledItemValues", "appearance", "cleanable", "locale", "toggleAs", "style", "value", "inline", "menuClassName", "menuStyle", "menuWidth", "menuHeight", "searchable", "parentSelectable", "placement", "id", "renderMenuItem", "renderValue", "renderMenu", "renderExtraFooter", "onEnter", "onExited", "onClean", "onChange", "onSelect", "onSearch", "onClose", "onOpen", "getChildren"]); // Use component active state to support keyboard events.
|
|
91
|
+
rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "data", "classPrefix", "childrenKey", "valueKey", "labelKey", "defaultValue", "placeholder", "disabled", "disabledItemValues", "appearance", "cleanable", "locale", "toggleAs", "style", "value", "inline", "menuClassName", "menuStyle", "menuWidth", "menuHeight", "searchable", "parentSelectable", "placement", "id", "renderMenuItem", "renderSearchItem", "renderValue", "renderMenu", "renderExtraFooter", "onEnter", "onExited", "onClean", "onChange", "onSelect", "onSearch", "onClose", "onOpen", "getChildren"]); // Use component active state to support keyboard events.
|
|
91
92
|
|
|
92
93
|
var _useState = (0, _react.useState)(false),
|
|
93
94
|
active = _useState[0],
|
|
@@ -102,9 +103,9 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
102
103
|
var targetRef = (0, _react.useRef)(null);
|
|
103
104
|
var searchInputRef = (0, _react.useRef)(null);
|
|
104
105
|
|
|
105
|
-
var
|
|
106
|
-
value =
|
|
107
|
-
setValue =
|
|
106
|
+
var _ref = (0, _utils2.useControlled)(valueProp, defaultValue),
|
|
107
|
+
value = _ref[0],
|
|
108
|
+
setValue = _ref[1];
|
|
108
109
|
|
|
109
110
|
var _usePaths = (0, _utils.usePaths)({
|
|
110
111
|
data: data,
|
|
@@ -380,6 +381,12 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
380
381
|
'cascader-row-disabled': disabled,
|
|
381
382
|
'cascader-row-focus': item[valueKey] === focusItemValue
|
|
382
383
|
});
|
|
384
|
+
var label = formattedNodes.map(function (node, index) {
|
|
385
|
+
return /*#__PURE__*/_react.default.createElement("span", {
|
|
386
|
+
key: "col-" + index,
|
|
387
|
+
className: prefix('cascader-col')
|
|
388
|
+
}, node[labelKey]);
|
|
389
|
+
});
|
|
383
390
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
384
391
|
key: key,
|
|
385
392
|
"aria-disabled": disabled,
|
|
@@ -390,12 +397,7 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
390
397
|
handleSearchRowSelect(item, nodes, event);
|
|
391
398
|
}
|
|
392
399
|
}
|
|
393
|
-
},
|
|
394
|
-
return /*#__PURE__*/_react.default.createElement("span", {
|
|
395
|
-
key: "col-" + index,
|
|
396
|
-
className: prefix('cascader-col')
|
|
397
|
-
}, node[labelKey]);
|
|
398
|
-
}));
|
|
400
|
+
}, renderSearchItem ? renderSearchItem(label, nodes) : label);
|
|
399
401
|
};
|
|
400
402
|
|
|
401
403
|
var renderSearchResultPanel = function renderSearchResultPanel() {
|
|
@@ -413,10 +415,10 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
413
415
|
};
|
|
414
416
|
|
|
415
417
|
var renderDropdownMenu = function renderDropdownMenu(positionProps, speakerRef) {
|
|
416
|
-
var
|
|
417
|
-
left =
|
|
418
|
-
top =
|
|
419
|
-
className =
|
|
418
|
+
var _ref2 = positionProps || {},
|
|
419
|
+
left = _ref2.left,
|
|
420
|
+
top = _ref2.top,
|
|
421
|
+
className = _ref2.className;
|
|
420
422
|
|
|
421
423
|
var styles = (0, _extends3.default)({}, menuStyle, {
|
|
422
424
|
left: left,
|
|
@@ -533,6 +535,7 @@ Cascader.propTypes = (0, _extends3.default)({}, _Picker.listPickerPropTypes, {
|
|
|
533
535
|
onSearch: _propTypes.default.func,
|
|
534
536
|
cleanable: _propTypes.default.bool,
|
|
535
537
|
renderMenuItem: _propTypes.default.func,
|
|
538
|
+
renderSearchItem: _propTypes.default.func,
|
|
536
539
|
menuWidth: _propTypes.default.number,
|
|
537
540
|
menuHeight: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
|
|
538
541
|
searchable: _propTypes.default.bool,
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
var _react = _interopRequireDefault(require("react"));
|
|
6
|
+
|
|
7
|
+
var _tsExpect = require("ts-expect");
|
|
8
|
+
|
|
9
|
+
var _Cascader = _interopRequireDefault(require("../Cascader"));
|
|
10
|
+
|
|
11
|
+
// Infer value and onChange types from data
|
|
12
|
+
var numberValuedData = [{
|
|
13
|
+
label: 'One',
|
|
14
|
+
value: 1
|
|
15
|
+
}];
|
|
16
|
+
|
|
17
|
+
/*#__PURE__*/
|
|
18
|
+
_react.default.createElement(_Cascader.default, {
|
|
19
|
+
data: numberValuedData,
|
|
20
|
+
value: 1
|
|
21
|
+
}); // @ts-expect-error should not accept string value
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
/*#__PURE__*/
|
|
25
|
+
_react.default.createElement(_Cascader.default, {
|
|
26
|
+
data: numberValuedData,
|
|
27
|
+
value: "1"
|
|
28
|
+
});
|
|
29
|
+
|
|
30
|
+
/*#__PURE__*/
|
|
31
|
+
_react.default.createElement(_Cascader.default, {
|
|
32
|
+
data: numberValuedData,
|
|
33
|
+
onChange: function onChange(newValue) {
|
|
34
|
+
(0, _tsExpect.expectType)(newValue);
|
|
35
|
+
}
|
|
36
|
+
});
|
|
37
|
+
|
|
38
|
+
var stringValuedData = [{
|
|
39
|
+
label: 'One',
|
|
40
|
+
value: 'One'
|
|
41
|
+
}];
|
|
42
|
+
|
|
43
|
+
/*#__PURE__*/
|
|
44
|
+
_react.default.createElement(_Cascader.default, {
|
|
45
|
+
data: stringValuedData,
|
|
46
|
+
value: "1"
|
|
47
|
+
}); // @ts-expect-error should not accept number value
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
/*#__PURE__*/
|
|
51
|
+
_react.default.createElement(_Cascader.default, {
|
|
52
|
+
data: stringValuedData,
|
|
53
|
+
value: 1
|
|
54
|
+
});
|
|
55
|
+
|
|
56
|
+
/*#__PURE__*/
|
|
57
|
+
_react.default.createElement(_Cascader.default, {
|
|
58
|
+
data: stringValuedData,
|
|
59
|
+
onChange: function onChange(newValue) {
|
|
60
|
+
(0, _tsExpect.expectType)(newValue);
|
|
61
|
+
}
|
|
62
|
+
});
|
|
63
|
+
|
|
64
|
+
var pickerRef = /*#__PURE__*/_react.default.createRef();
|
|
65
|
+
|
|
66
|
+
/*#__PURE__*/
|
|
67
|
+
_react.default.createElement(_Cascader.default, {
|
|
68
|
+
ref: pickerRef,
|
|
69
|
+
data: []
|
|
70
|
+
});
|
|
@@ -29,10 +29,13 @@ export interface DropdownProps<T = any> extends WithAsProps, Omit<React.HTMLAttr
|
|
|
29
29
|
/** No caret variation */
|
|
30
30
|
noCaret?: boolean;
|
|
31
31
|
/**
|
|
32
|
-
*
|
|
33
|
-
* @deprecated
|
|
32
|
+
* Controlled open state
|
|
34
33
|
*/
|
|
35
34
|
open?: boolean;
|
|
35
|
+
/**
|
|
36
|
+
* Whether dropdown is initially open
|
|
37
|
+
*/
|
|
38
|
+
defaultOpen?: boolean;
|
|
36
39
|
/**
|
|
37
40
|
* @deprecated
|
|
38
41
|
*/
|
package/cjs/Dropdown/Dropdown.js
CHANGED
|
@@ -73,6 +73,8 @@ var Dropdown = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
73
73
|
placement = _rest$placement === void 0 ? 'bottomStart' : _rest$placement,
|
|
74
74
|
toggleAs = rest.toggleAs,
|
|
75
75
|
toggleClassName = rest.toggleClassName,
|
|
76
|
+
open = rest.open,
|
|
77
|
+
defaultOpen = rest.defaultOpen,
|
|
76
78
|
_rest$classPrefix = rest.classPrefix,
|
|
77
79
|
classPrefix = _rest$classPrefix === void 0 ? 'dropdown' : _rest$classPrefix,
|
|
78
80
|
className = rest.className,
|
|
@@ -80,7 +82,7 @@ var Dropdown = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
80
82
|
children = rest.children,
|
|
81
83
|
menuStyle = rest.menuStyle,
|
|
82
84
|
style = rest.style,
|
|
83
|
-
toggleProps = (0, _objectWithoutPropertiesLoose2.default)(rest, ["as", "title", "onClose", "onOpen", "onToggle", "eventKey", "trigger", "placement", "toggleAs", "toggleClassName", "classPrefix", "className", "disabled", "children", "menuStyle", "style"]);
|
|
85
|
+
toggleProps = (0, _objectWithoutPropertiesLoose2.default)(rest, ["as", "title", "onClose", "onOpen", "onToggle", "eventKey", "trigger", "placement", "toggleAs", "toggleClassName", "open", "defaultOpen", "classPrefix", "className", "disabled", "children", "menuStyle", "style"]);
|
|
84
86
|
|
|
85
87
|
var _useContext = (0, _react.useContext)(_NavContext.default),
|
|
86
88
|
onSelectFromNav = _useContext.onSelect;
|
|
@@ -220,6 +222,8 @@ var Dropdown = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
220
222
|
return /*#__PURE__*/_react.default.createElement(_DropdownContext.default.Provider, {
|
|
221
223
|
value: dropdownContextValue
|
|
222
224
|
}, /*#__PURE__*/_react.default.createElement(_Menu.default, {
|
|
225
|
+
open: open,
|
|
226
|
+
defaultOpen: defaultOpen,
|
|
223
227
|
menuButtonText: title,
|
|
224
228
|
renderMenuButton: renderMenuButton,
|
|
225
229
|
openMenuOn: menuButtonTriggers,
|
|
@@ -74,7 +74,7 @@ function decimals() {
|
|
|
74
74
|
*/
|
|
75
75
|
|
|
76
76
|
|
|
77
|
-
function
|
|
77
|
+
function valueReachesMax(value, max) {
|
|
78
78
|
if (!(0, _isNil.default)(value)) {
|
|
79
79
|
return +value >= max;
|
|
80
80
|
}
|
|
@@ -88,7 +88,7 @@ function disableMaxValue(value, max) {
|
|
|
88
88
|
*/
|
|
89
89
|
|
|
90
90
|
|
|
91
|
-
function
|
|
91
|
+
function valueReachesMin(value, min) {
|
|
92
92
|
if (!(0, _isNil.default)(value)) {
|
|
93
93
|
return +value <= min;
|
|
94
94
|
}
|
|
@@ -128,18 +128,6 @@ var InputNumber = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
128
128
|
value = _useControlled[0],
|
|
129
129
|
setValue = _useControlled[1];
|
|
130
130
|
|
|
131
|
-
var _useState = (0, _react.useState)(function () {
|
|
132
|
-
return disableMaxValue(value, max);
|
|
133
|
-
}),
|
|
134
|
-
disabledUpButton = _useState[0],
|
|
135
|
-
setDisabledUpButton = _useState[1];
|
|
136
|
-
|
|
137
|
-
var _useState2 = (0, _react.useState)(function () {
|
|
138
|
-
return disableMinValue(value, min);
|
|
139
|
-
}),
|
|
140
|
-
disabledDownButton = _useState2[0],
|
|
141
|
-
setDisabledDownButton = _useState2[1];
|
|
142
|
-
|
|
143
131
|
var _useClassNames = (0, _utils.useClassNames)(classPrefix),
|
|
144
132
|
withClassPrefix = _useClassNames.withClassPrefix,
|
|
145
133
|
merge = _useClassNames.merge,
|
|
@@ -154,14 +142,10 @@ var InputNumber = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
154
142
|
var inputRef = (0, _react.useRef)();
|
|
155
143
|
var handleChangeValue = (0, _react.useCallback)(function (currentValue, event) {
|
|
156
144
|
if (currentValue !== value) {
|
|
157
|
-
// Disable the up button when the value is greater than the maximum value.
|
|
158
|
-
setDisabledUpButton(disableMaxValue(currentValue, max)); // Disable the down button when the value is greater than the minimum value.
|
|
159
|
-
|
|
160
|
-
setDisabledDownButton(disableMinValue(currentValue, min));
|
|
161
145
|
setValue(currentValue);
|
|
162
146
|
onChange === null || onChange === void 0 ? void 0 : onChange(currentValue, event);
|
|
163
147
|
}
|
|
164
|
-
}, [
|
|
148
|
+
}, [onChange, setValue, value]);
|
|
165
149
|
var getSafeValue = (0, _react.useCallback)(function (value) {
|
|
166
150
|
if (!Number.isNaN(value)) {
|
|
167
151
|
if (+value > max) {
|
|
@@ -176,27 +160,34 @@ var InputNumber = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
176
160
|
}
|
|
177
161
|
|
|
178
162
|
return value.toString();
|
|
179
|
-
}, [max, min]);
|
|
180
|
-
|
|
163
|
+
}, [max, min]); // Increment value by step
|
|
164
|
+
|
|
165
|
+
var handleStepUp = (0, _react.useCallback)(function (event) {
|
|
181
166
|
var val = +(value || 0);
|
|
182
167
|
var bit = decimals(val, step);
|
|
183
168
|
handleChangeValue(getSafeValue((val + step).toFixed(bit)), event);
|
|
184
|
-
}, [getSafeValue, handleChangeValue, step, value]);
|
|
185
|
-
|
|
169
|
+
}, [getSafeValue, handleChangeValue, step, value]); // Decrement value by step
|
|
170
|
+
|
|
171
|
+
var handleStepDown = (0, _react.useCallback)(function (event) {
|
|
186
172
|
var val = +(value || 0);
|
|
187
173
|
var bit = decimals(val, step);
|
|
188
174
|
handleChangeValue(getSafeValue((val - step).toFixed(bit)), event);
|
|
189
|
-
}, [getSafeValue, handleChangeValue, step, value]);
|
|
175
|
+
}, [getSafeValue, handleChangeValue, step, value]); // Disables step up/down button when
|
|
176
|
+
// - InputNumber is disabled/readonly
|
|
177
|
+
// - value reaches max/min limits
|
|
178
|
+
|
|
179
|
+
var stepUpDisabled = disabled || readOnly || valueReachesMax(value, max);
|
|
180
|
+
var stepDownDisabled = disabled || readOnly || valueReachesMin(value, min);
|
|
190
181
|
var handleKeyDown = (0, _react.useCallback)(function (event) {
|
|
191
182
|
switch (event.key) {
|
|
192
183
|
case _utils.KEY_VALUES.UP:
|
|
193
184
|
event.preventDefault();
|
|
194
|
-
|
|
185
|
+
handleStepUp(event);
|
|
195
186
|
break;
|
|
196
187
|
|
|
197
188
|
case _utils.KEY_VALUES.DOWN:
|
|
198
189
|
event.preventDefault();
|
|
199
|
-
|
|
190
|
+
handleStepDown(event);
|
|
200
191
|
break;
|
|
201
192
|
|
|
202
193
|
case _utils.KEY_VALUES.HOME:
|
|
@@ -215,23 +206,23 @@ var InputNumber = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
215
206
|
|
|
216
207
|
break;
|
|
217
208
|
}
|
|
218
|
-
}, [
|
|
209
|
+
}, [handleStepUp, handleStepDown, minProp, maxProp, handleChangeValue, getSafeValue]);
|
|
219
210
|
var handleWheel = (0, _react.useCallback)(function (event) {
|
|
220
211
|
if (!disabled && !readOnly && event.target === document.activeElement) {
|
|
221
212
|
event.preventDefault();
|
|
222
213
|
var delta = event['wheelDelta'] || -event.deltaY || -(event === null || event === void 0 ? void 0 : event.detail);
|
|
223
214
|
|
|
224
215
|
if (delta > 0) {
|
|
225
|
-
|
|
216
|
+
handleStepDown(event);
|
|
226
217
|
}
|
|
227
218
|
|
|
228
219
|
if (delta < 0) {
|
|
229
|
-
|
|
220
|
+
handleStepUp(event);
|
|
230
221
|
}
|
|
231
222
|
}
|
|
232
223
|
|
|
233
224
|
onWheel === null || onWheel === void 0 ? void 0 : onWheel(event);
|
|
234
|
-
}, [disabled,
|
|
225
|
+
}, [disabled, handleStepDown, handleStepUp, onWheel, readOnly]);
|
|
235
226
|
var handleChange = (0, _react.useCallback)(function (value, event) {
|
|
236
227
|
if (!/^-?(?:\d+)?(\.)?\d*$/.test(value) && value !== '') {
|
|
237
228
|
return;
|
|
@@ -291,14 +282,16 @@ var InputNumber = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
291
282
|
tabIndex: -1,
|
|
292
283
|
appearance: buttonAppearance,
|
|
293
284
|
className: prefix('touchspin-up'),
|
|
294
|
-
onClick:
|
|
295
|
-
disabled:
|
|
285
|
+
onClick: handleStepUp,
|
|
286
|
+
disabled: stepUpDisabled,
|
|
287
|
+
"aria-label": "Increment"
|
|
296
288
|
}, /*#__PURE__*/_react.default.createElement(_AngleUp.default, null)), /*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
297
289
|
tabIndex: -1,
|
|
298
290
|
appearance: buttonAppearance,
|
|
299
291
|
className: prefix('touchspin-down'),
|
|
300
|
-
onClick:
|
|
301
|
-
disabled:
|
|
292
|
+
onClick: handleStepDown,
|
|
293
|
+
disabled: stepDownDisabled,
|
|
294
|
+
"aria-label": "Decrement"
|
|
302
295
|
}, /*#__PURE__*/_react.default.createElement(_AngleDown.default, null))), postfix && /*#__PURE__*/_react.default.createElement(_InputGroupAddon.default, null, postfix));
|
|
303
296
|
});
|
|
304
297
|
|
package/cjs/Menu/Menu.d.ts
CHANGED
|
@@ -2,12 +2,20 @@ import React from 'react';
|
|
|
2
2
|
import PropTypes from 'prop-types';
|
|
3
3
|
import { MenuContextProps } from './MenuContext';
|
|
4
4
|
export interface MenuProps {
|
|
5
|
+
/**
|
|
6
|
+
* Whether dropdown is initially open
|
|
7
|
+
*/
|
|
8
|
+
defaultOpen?: boolean;
|
|
9
|
+
/**
|
|
10
|
+
* Controlled open state
|
|
11
|
+
*/
|
|
12
|
+
open?: boolean;
|
|
5
13
|
disabled?: boolean;
|
|
6
14
|
children: (props: React.HTMLAttributes<HTMLDivElement> & MenuRenderProps, ref: React.Ref<HTMLDivElement>) => React.ReactElement<React.HTMLAttributes<HTMLDivElement>>;
|
|
7
15
|
menuButtonText?: React.ReactNode;
|
|
8
16
|
renderMenuButton?: (props: React.ButtonHTMLAttributes<HTMLButtonElement> & MenuButtonRenderProps, ref: React.Ref<HTMLButtonElement>) => React.ReactElement<React.ButtonHTMLAttributes<HTMLButtonElement>>;
|
|
9
17
|
renderMenuPopup?: (props: React.HTMLAttributes<HTMLUListElement> & MenuPopupRenderProps, ref: React.Ref<HTMLUListElement>) => React.ReactElement<React.HTMLAttributes<HTMLUListElement>>;
|
|
10
|
-
openMenuOn?: MenuButtonTrigger[];
|
|
18
|
+
openMenuOn?: readonly MenuButtonTrigger[];
|
|
11
19
|
onToggleMenu?: (open: boolean, event: React.SyntheticEvent) => void;
|
|
12
20
|
}
|
|
13
21
|
export declare type MenuButtonTrigger = 'mouseover' | 'click' | 'contextmenu';
|
|
@@ -26,7 +34,7 @@ export interface MenuHandle {
|
|
|
26
34
|
/**
|
|
27
35
|
* Headless ARIA `menu`
|
|
28
36
|
*/
|
|
29
|
-
declare function Menu(
|
|
37
|
+
declare function Menu({ disabled, children, openMenuOn, defaultOpen, open: openProp, menuButtonText, renderMenuButton, renderMenuPopup, onToggleMenu }: MenuProps & React.HTMLAttributes<HTMLUListElement>): React.ReactElement<React.HTMLAttributes<HTMLDivElement>, string | React.JSXElementConstructor<any>>;
|
|
30
38
|
declare namespace Menu {
|
|
31
39
|
var displayName: string;
|
|
32
40
|
var propTypes: {
|
package/cjs/Menu/Menu.js
CHANGED
|
@@ -36,27 +36,34 @@ var defaultOpenMenuOn = ['click'];
|
|
|
36
36
|
* Headless ARIA `menu`
|
|
37
37
|
*/
|
|
38
38
|
|
|
39
|
-
function Menu(
|
|
39
|
+
function Menu(_ref) {
|
|
40
40
|
var _items$activeItemInde;
|
|
41
41
|
|
|
42
|
-
var disabled =
|
|
43
|
-
children =
|
|
44
|
-
|
|
45
|
-
openMenuOn =
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
42
|
+
var disabled = _ref.disabled,
|
|
43
|
+
children = _ref.children,
|
|
44
|
+
_ref$openMenuOn = _ref.openMenuOn,
|
|
45
|
+
openMenuOn = _ref$openMenuOn === void 0 ? defaultOpenMenuOn : _ref$openMenuOn,
|
|
46
|
+
_ref$defaultOpen = _ref.defaultOpen,
|
|
47
|
+
defaultOpen = _ref$defaultOpen === void 0 ? false : _ref$defaultOpen,
|
|
48
|
+
openProp = _ref.open,
|
|
49
|
+
menuButtonText = _ref.menuButtonText,
|
|
50
|
+
renderMenuButton = _ref.renderMenuButton,
|
|
51
|
+
renderMenuPopup = _ref.renderMenuPopup,
|
|
52
|
+
onToggleMenu = _ref.onToggleMenu;
|
|
50
53
|
var buttonElementRef = (0, _react.useRef)(null);
|
|
51
54
|
var menuElementRef = (0, _react.useRef)(null);
|
|
52
55
|
var parentMenu = (0, _react.useContext)(_MenuContext.default);
|
|
53
56
|
var isSubmenu = !!parentMenu;
|
|
54
|
-
var menu = (0, _useMenu.default)(
|
|
57
|
+
var menu = (0, _useMenu.default)({
|
|
58
|
+
open: defaultOpen
|
|
59
|
+
});
|
|
55
60
|
var _menu$ = menu[0],
|
|
56
|
-
|
|
61
|
+
openState = _menu$.open,
|
|
57
62
|
items = _menu$.items,
|
|
58
63
|
activeItemIndex = _menu$.activeItemIndex,
|
|
59
64
|
dispatch = menu[1];
|
|
65
|
+
var openControlled = typeof openProp !== 'undefined';
|
|
66
|
+
var open = openControlled ? openProp : openState;
|
|
60
67
|
|
|
61
68
|
var _useCustom = (0, _utils.useCustom)('Menu'),
|
|
62
69
|
rtl = _useCustom.rtl;
|
package/cjs/Menu/MenuItem.js
CHANGED
|
@@ -112,6 +112,7 @@ function MenuItem(props) {
|
|
|
112
112
|
if ((menuState === null || menuState === void 0 ? void 0 : menuState.role) === 'menubar') {
|
|
113
113
|
menuitemProps.onMouseDown = handleMouseDown;
|
|
114
114
|
menuitemProps.onMouseOver = handleMouseMove;
|
|
115
|
+
menuitemProps.onMouseLeave = handleMouseLeave;
|
|
115
116
|
}
|
|
116
117
|
|
|
117
118
|
return children(menuitemProps, menuitemRef);
|
package/cjs/Modal/Modal.d.ts
CHANGED
|
@@ -6,9 +6,10 @@ import ModalHeader from './ModalHeader';
|
|
|
6
6
|
import ModalTitle from './ModalTitle';
|
|
7
7
|
import ModalFooter from './ModalFooter';
|
|
8
8
|
import { TypeAttributes, RsRefForwardingComponent } from '../@types/common';
|
|
9
|
+
export declare type ModalSize = TypeAttributes.Size | 'full';
|
|
9
10
|
export interface ModalProps extends BaseModalProps, Pick<React.HTMLAttributes<HTMLElement>, 'role' | 'id' | 'aria-labelledby' | 'aria-describedby'> {
|
|
10
11
|
/** A modal can have different sizes */
|
|
11
|
-
size?:
|
|
12
|
+
size?: ModalSize;
|
|
12
13
|
/** Set the duration of the animation */
|
|
13
14
|
animationTimeout?: number;
|
|
14
15
|
/** Set an animation effect for Modal, the default is Bounce. */
|
|
@@ -17,7 +18,10 @@ export interface ModalProps extends BaseModalProps, Pick<React.HTMLAttributes<HT
|
|
|
17
18
|
dialogClassName?: string;
|
|
18
19
|
/** CSS style applied to dialog DOM nodes */
|
|
19
20
|
dialogStyle?: React.CSSProperties;
|
|
20
|
-
/**
|
|
21
|
+
/**
|
|
22
|
+
* Full screen
|
|
23
|
+
* @deprecated Use size="full" instead.
|
|
24
|
+
*/
|
|
21
25
|
full?: boolean;
|
|
22
26
|
/** You can use a custom element type for Dialog */
|
|
23
27
|
dialogAs?: React.ElementType;
|
package/cjs/Modal/Modal.js
CHANGED
|
@@ -45,8 +45,12 @@ var _utils2 = require("./utils");
|
|
|
45
45
|
|
|
46
46
|
var _useUniqueId = _interopRequireDefault(require("../utils/useUniqueId"));
|
|
47
47
|
|
|
48
|
+
var _deprecatePropType = _interopRequireDefault(require("../utils/deprecatePropType"));
|
|
49
|
+
|
|
48
50
|
var _templateObject, _templateObject2;
|
|
49
51
|
|
|
52
|
+
var modalSizes = ['xs', 'sm', 'md', 'lg', 'full'];
|
|
53
|
+
|
|
50
54
|
var Modal = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
51
55
|
var className = props.className,
|
|
52
56
|
children = props.children,
|
|
@@ -219,10 +223,10 @@ Modal.propTypes = (0, _extends2.default)({}, _Modal.modalPropTypes, {
|
|
|
219
223
|
animationTimeout: _propTypes.default.number,
|
|
220
224
|
classPrefix: _propTypes.default.string,
|
|
221
225
|
dialogClassName: _propTypes.default.string,
|
|
222
|
-
size: _propTypes.default.oneOf(
|
|
226
|
+
size: _propTypes.default.oneOf(modalSizes),
|
|
223
227
|
dialogStyle: _propTypes.default.object,
|
|
224
228
|
dialogAs: _propTypes.default.elementType,
|
|
225
|
-
full: _propTypes.default.bool,
|
|
229
|
+
full: (0, _deprecatePropType.default)(_propTypes.default.bool, 'Use size="full" instead.'),
|
|
226
230
|
overflow: _propTypes.default.bool,
|
|
227
231
|
drawer: _propTypes.default.bool
|
|
228
232
|
});
|
|
@@ -278,7 +278,9 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
278
278
|
end = v;
|
|
279
279
|
}
|
|
280
280
|
|
|
281
|
-
var nextValue = getValidValue([start, end].sort()
|
|
281
|
+
var nextValue = getValidValue([start, end].sort(function (a, b) {
|
|
282
|
+
return a - b;
|
|
283
|
+
}));
|
|
282
284
|
|
|
283
285
|
if (isRangeMatchingConstraint(nextValue)) {
|
|
284
286
|
setValue(nextValue);
|
|
@@ -32,7 +32,7 @@ export interface SelectProps<T> {
|
|
|
32
32
|
/** Called after clicking the group title */
|
|
33
33
|
onGroupTitleClick?: (event: React.SyntheticEvent) => void;
|
|
34
34
|
/** Called when searching */
|
|
35
|
-
onSearch?: (searchKeyword: string, event
|
|
35
|
+
onSearch?: (searchKeyword: string, event?: React.SyntheticEvent) => void;
|
|
36
36
|
/** Called when clean */
|
|
37
37
|
onClean?: (event: React.SyntheticEvent) => void;
|
|
38
38
|
}
|
|
@@ -202,8 +202,9 @@ var SelectPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
|
|
|
202
202
|
var handleExited = (0, _react.useCallback)(function () {
|
|
203
203
|
setSearchKeyword('');
|
|
204
204
|
setActive(false);
|
|
205
|
+
onSearch === null || onSearch === void 0 ? void 0 : onSearch('');
|
|
205
206
|
onClose === null || onClose === void 0 ? void 0 : onClose();
|
|
206
|
-
}, [onClose, setSearchKeyword]);
|
|
207
|
+
}, [onClose, setSearchKeyword, onSearch]);
|
|
207
208
|
var handleEntered = (0, _react.useCallback)(function () {
|
|
208
209
|
setActive(true);
|
|
209
210
|
setFocusItemValue(value);
|