rsuite 5.4.2 → 5.5.1
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/Button/styles/index.less +1 -5
- package/CHANGELOG.md +47 -0
- package/Carousel/styles/index.less +1 -0
- package/CheckTreePicker/styles/index.less +51 -50
- package/Drawer/styles/index.less +3 -0
- package/Dropdown/styles/index.less +3 -19
- package/Dropdown/styles/mixin.less +0 -2
- package/Modal/styles/mixin.less +1 -0
- package/Navbar/styles/index.less +8 -3
- package/Picker/styles/mixin.less +3 -2
- package/README.md +1 -1
- package/Sidenav/styles/index.less +59 -58
- package/TreePicker/styles/index.less +3 -3
- package/cjs/Calendar/useCalendarDate.d.ts +1 -1
- package/cjs/Calendar/useCalendarDate.js +1 -1
- package/cjs/Carousel/Carousel.js +7 -1
- package/cjs/Cascader/Cascader.js +13 -2
- package/cjs/CheckPicker/CheckPicker.d.ts +5 -2
- package/cjs/CheckPicker/test/CheckPicker.test.js +8 -0
- package/cjs/CheckTreePicker/CheckTreePicker.js +1 -1
- package/cjs/CheckTreePicker/utils.js +1 -1
- package/cjs/CustomProvider/CustomProvider.d.ts +14 -14
- package/cjs/CustomProvider/CustomProvider.js +4 -3
- package/cjs/DatePicker/DatePicker.d.ts +1 -1
- package/cjs/DatePicker/DatePicker.js +2 -4
- package/cjs/DateRangePicker/Calendar.js +2 -16
- package/cjs/Dropdown/Dropdown.d.ts +5 -0
- package/cjs/Dropdown/DropdownMenu.js +5 -11
- 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/Modal/utils.js +16 -8
- package/cjs/MultiCascader/MultiCascader.js +7 -3
- package/cjs/Nav/NavItem.js +3 -1
- package/cjs/Picker/DropdownMenu.js +5 -0
- package/cjs/Picker/PickerToggle.js +2 -4
- package/cjs/RangeSlider/RangeSlider.d.ts +12 -2
- package/cjs/RangeSlider/RangeSlider.js +35 -12
- package/cjs/SelectPicker/SelectPicker.d.ts +5 -2
- package/cjs/SelectPicker/test/SelectPicker.test.js +8 -0
- package/cjs/Uploader/UploadFileItem.d.ts +1 -1
- package/cjs/Uploader/UploadFileItem.js +1 -1
- package/cjs/Uploader/Uploader.js +3 -0
- package/cjs/utils/propTypeChecker.d.ts +2 -6
- package/cjs/utils/propTypeChecker.js +7 -59
- package/cjs/utils/treeUtils.js +4 -3
- package/cjs/utils/useClickOutside.js +6 -2
- package/dist/rsuite-rtl.css +399 -252
- package/dist/rsuite-rtl.min.css +1 -1
- package/dist/rsuite-rtl.min.css.map +1 -1
- package/dist/rsuite.css +399 -252
- package/dist/rsuite.js +27 -27
- 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/Calendar/useCalendarDate.d.ts +1 -1
- package/esm/Calendar/useCalendarDate.js +1 -1
- package/esm/Carousel/Carousel.js +9 -3
- package/esm/Cascader/Cascader.js +13 -2
- package/esm/CheckPicker/CheckPicker.d.ts +5 -2
- package/esm/CheckPicker/test/CheckPicker.test.js +7 -0
- package/esm/CheckTreePicker/CheckTreePicker.js +1 -1
- package/esm/CheckTreePicker/utils.js +1 -1
- package/esm/CustomProvider/CustomProvider.d.ts +14 -14
- package/esm/CustomProvider/CustomProvider.js +2 -2
- package/esm/DatePicker/DatePicker.d.ts +1 -1
- package/esm/DatePicker/DatePicker.js +2 -3
- package/esm/DateRangePicker/Calendar.js +2 -16
- package/esm/Dropdown/Dropdown.d.ts +5 -0
- package/esm/Dropdown/DropdownMenu.js +5 -11
- 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/Modal/utils.js +16 -8
- package/esm/MultiCascader/MultiCascader.js +7 -3
- package/esm/Nav/NavItem.js +3 -1
- package/esm/Picker/DropdownMenu.js +5 -0
- package/esm/Picker/PickerToggle.js +2 -4
- package/esm/RangeSlider/RangeSlider.d.ts +12 -2
- package/esm/RangeSlider/RangeSlider.js +35 -12
- package/esm/SelectPicker/SelectPicker.d.ts +5 -2
- package/esm/SelectPicker/test/SelectPicker.test.js +7 -0
- package/esm/Uploader/UploadFileItem.d.ts +1 -1
- package/esm/Uploader/UploadFileItem.js +1 -1
- package/esm/Uploader/Uploader.js +4 -1
- package/esm/utils/propTypeChecker.d.ts +2 -6
- package/esm/utils/propTypeChecker.js +7 -59
- package/esm/utils/treeUtils.js +6 -3
- package/esm/utils/useClickOutside.js +6 -2
- package/package.json +2 -2
- package/styles/color-modes/dark.less +1 -0
- package/styles/color-modes/high-contrast.less +1 -0
- package/styles/color-modes/light.less +1 -0
- package/styles/mixins/utilities.less +17 -5
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
declare const useCalendarDate: (value: Date | undefined, defaultDate: Date | undefined) => {
|
|
1
|
+
declare const useCalendarDate: (value: Date | null | undefined, defaultDate: Date | undefined) => {
|
|
2
2
|
calendarDate: Date;
|
|
3
3
|
setCalendarDate: (date: Date | undefined) => void;
|
|
4
4
|
};
|
|
@@ -19,7 +19,7 @@ var useCalendarDate = function useCalendarDate(value, defaultDate) {
|
|
|
19
19
|
var _valueRef$current;
|
|
20
20
|
|
|
21
21
|
if ((value === null || value === void 0 ? void 0 : value.valueOf()) !== ((_valueRef$current = valueRef.current) === null || _valueRef$current === void 0 ? void 0 : _valueRef$current.valueOf())) {
|
|
22
|
-
setCalendarDate(value);
|
|
22
|
+
setCalendarDate(value !== null && value !== void 0 ? value : new Date());
|
|
23
23
|
valueRef.current = value;
|
|
24
24
|
}
|
|
25
25
|
}, [value]);
|
package/esm/Carousel/Carousel.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
2
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
3
|
-
import React, { useState, useMemo, useCallback } from 'react';
|
|
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 } from '../utils';
|
|
6
|
+
import { useClassNames, useCustom, guid, ReactChildren, useTimeout, mergeRefs } from '../utils';
|
|
7
7
|
var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
8
8
|
var _sliderStyles, _ref;
|
|
9
9
|
|
|
@@ -46,7 +46,13 @@ var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
46
46
|
lastIndex = _useState2[0],
|
|
47
47
|
setLastIndex = _useState2[1];
|
|
48
48
|
|
|
49
|
+
var rootRef = useRef(null);
|
|
50
|
+
|
|
49
51
|
var handleSlide = function handleSlide(nextActiveIndex, event) {
|
|
52
|
+
if (!rootRef.current) {
|
|
53
|
+
return;
|
|
54
|
+
}
|
|
55
|
+
|
|
50
56
|
clear();
|
|
51
57
|
var index = nextActiveIndex !== null && nextActiveIndex !== void 0 ? nextActiveIndex : activeIndex + 1; // When index is greater than count, start from 1 again.
|
|
52
58
|
|
|
@@ -111,7 +117,7 @@ var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
111
117
|
var sliderStyles = (_sliderStyles = {}, _sliderStyles[lengthKey] = count * 100 + "%", _sliderStyles.transform = vertical ? "translate3d(0, " + activeRatio + " ,0)" : "translate3d(" + activeRatio + ", 0 ,0)", _sliderStyles);
|
|
112
118
|
var showMask = count > 1 && activeIndex === 0 && activeIndex !== lastIndex;
|
|
113
119
|
return /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
|
|
114
|
-
ref: ref,
|
|
120
|
+
ref: mergeRefs(ref, rootRef),
|
|
115
121
|
className: classes
|
|
116
122
|
}), /*#__PURE__*/React.createElement("div", {
|
|
117
123
|
className: prefix('content')
|
package/esm/Cascader/Cascader.js
CHANGED
|
@@ -188,10 +188,18 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
188
188
|
}
|
|
189
189
|
}, [getSearchResult, onSearch, setFocusItemValue, setKeys, setLayer, valueKey]);
|
|
190
190
|
var handleEntered = useCallback(function () {
|
|
191
|
+
if (!targetRef.current) {
|
|
192
|
+
return;
|
|
193
|
+
}
|
|
194
|
+
|
|
191
195
|
onOpen === null || onOpen === void 0 ? void 0 : onOpen();
|
|
192
196
|
setActive(true);
|
|
193
197
|
}, [onOpen]);
|
|
194
198
|
var handleExited = useCallback(function () {
|
|
199
|
+
if (!targetRef.current) {
|
|
200
|
+
return;
|
|
201
|
+
}
|
|
202
|
+
|
|
195
203
|
onClose === null || onClose === void 0 ? void 0 : onClose();
|
|
196
204
|
setActive(false);
|
|
197
205
|
setSearchKeyword('');
|
|
@@ -202,7 +210,7 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
202
210
|
(_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : _triggerRef$current.close();
|
|
203
211
|
}, [triggerRef]);
|
|
204
212
|
var handleClean = useCallback(function (event) {
|
|
205
|
-
if (disabled) {
|
|
213
|
+
if (disabled || !targetRef.current) {
|
|
206
214
|
return;
|
|
207
215
|
}
|
|
208
216
|
|
|
@@ -260,7 +268,10 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
260
268
|
children.then(function (data) {
|
|
261
269
|
node.loading = false;
|
|
262
270
|
node[childrenKey] = data;
|
|
263
|
-
|
|
271
|
+
|
|
272
|
+
if (targetRef.current) {
|
|
273
|
+
addColumn(data, cascadePaths.length);
|
|
274
|
+
}
|
|
264
275
|
});
|
|
265
276
|
} else {
|
|
266
277
|
node.loading = false;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { Ref } from 'react';
|
|
2
2
|
import { PickerLocale } from '../locales';
|
|
3
|
+
import { PickerInstance } from '../Picker';
|
|
3
4
|
import { ItemDataType, FormControlPickerProps } from '../@types/common';
|
|
4
5
|
import type { MultipleSelectProps } from '../SelectPicker';
|
|
5
6
|
export declare type ValueType = (number | string)[];
|
|
@@ -10,7 +11,9 @@ export interface CheckPickerProps<T> extends FormControlPickerProps<T[], PickerL
|
|
|
10
11
|
countable?: boolean;
|
|
11
12
|
}
|
|
12
13
|
export interface CheckPickerComponent {
|
|
13
|
-
<T>(props: CheckPickerProps<T>
|
|
14
|
+
<T>(props: CheckPickerProps<T> & {
|
|
15
|
+
ref?: Ref<PickerInstance>;
|
|
16
|
+
}): JSX.Element | null;
|
|
14
17
|
displayName?: string;
|
|
15
18
|
propTypes?: React.WeakValidationMap<CheckPickerProps<any>>;
|
|
16
19
|
}
|
|
@@ -61,4 +61,11 @@ React.createElement(CheckPicker, {
|
|
|
61
61
|
onChange: function onChange(newValue) {
|
|
62
62
|
expectType(newValue);
|
|
63
63
|
}
|
|
64
|
+
});
|
|
65
|
+
var pickerRef = /*#__PURE__*/React.createRef();
|
|
66
|
+
|
|
67
|
+
/*#__PURE__*/
|
|
68
|
+
React.createElement(CheckPicker, {
|
|
69
|
+
ref: pickerRef,
|
|
70
|
+
data: []
|
|
64
71
|
});
|
|
@@ -621,7 +621,7 @@ var CheckTreePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
621
621
|
var renderCheckTree = function renderCheckTree() {
|
|
622
622
|
var _withCheckTreeClassPr, _merge2;
|
|
623
623
|
|
|
624
|
-
var classes = withCheckTreeClassPrefix((_withCheckTreeClassPr = {}, _withCheckTreeClassPr[className !== null && className !== void 0 ? className : ''] = inline, _withCheckTreeClassPr['without-children'] = !isSomeNodeHasChildren, _withCheckTreeClassPr.virtualized = virtualized, _withCheckTreeClassPr));
|
|
624
|
+
var classes = withCheckTreeClassPrefix((_withCheckTreeClassPr = {}, _withCheckTreeClassPr[className !== null && className !== void 0 ? className : ''] = inline, _withCheckTreeClassPr['without-children'] = !isSomeNodeHasChildren(data, childrenKey), _withCheckTreeClassPr.virtualized = virtualized, _withCheckTreeClassPr));
|
|
625
625
|
var formattedNodes = getFormattedNodes(renderNode);
|
|
626
626
|
|
|
627
627
|
if (!formattedNodes.some(function (v) {
|
|
@@ -38,7 +38,7 @@ export function isSomeChildChecked(nodes, parent, childrenKey) {
|
|
|
38
38
|
}
|
|
39
39
|
export function isSomeNodeHasChildren(data, childrenKey) {
|
|
40
40
|
return data.some(function (node) {
|
|
41
|
-
return node[childrenKey];
|
|
41
|
+
return Array.isArray(node[childrenKey]);
|
|
42
42
|
});
|
|
43
43
|
}
|
|
44
44
|
/**
|
|
@@ -72,10 +72,10 @@ declare const CustomContext: React.Context<CustomProviderProps<{
|
|
|
72
72
|
saturday: string;
|
|
73
73
|
ok: string;
|
|
74
74
|
today: string;
|
|
75
|
-
yesterday: string;
|
|
75
|
+
yesterday: string;
|
|
76
76
|
hours: string;
|
|
77
77
|
minutes: string;
|
|
78
|
-
seconds: string;
|
|
78
|
+
seconds: string; /** Support right-to-left */
|
|
79
79
|
formattedMonthPattern: string;
|
|
80
80
|
formattedDayPattern: string;
|
|
81
81
|
dateLocale: any;
|
|
@@ -90,10 +90,10 @@ declare const CustomContext: React.Context<CustomProviderProps<{
|
|
|
90
90
|
saturday: string;
|
|
91
91
|
ok: string;
|
|
92
92
|
today: string;
|
|
93
|
-
yesterday: string;
|
|
93
|
+
yesterday: string;
|
|
94
94
|
hours: string;
|
|
95
95
|
minutes: string;
|
|
96
|
-
seconds: string;
|
|
96
|
+
seconds: string; /** Support right-to-left */
|
|
97
97
|
formattedMonthPattern: string;
|
|
98
98
|
formattedDayPattern: string;
|
|
99
99
|
dateLocale: any;
|
|
@@ -109,10 +109,10 @@ declare const CustomContext: React.Context<CustomProviderProps<{
|
|
|
109
109
|
saturday: string;
|
|
110
110
|
ok: string;
|
|
111
111
|
today: string;
|
|
112
|
-
yesterday: string;
|
|
112
|
+
yesterday: string;
|
|
113
113
|
hours: string;
|
|
114
114
|
minutes: string;
|
|
115
|
-
seconds: string;
|
|
115
|
+
seconds: string; /** Support right-to-left */
|
|
116
116
|
formattedMonthPattern: string;
|
|
117
117
|
formattedDayPattern: string;
|
|
118
118
|
dateLocale: any;
|
|
@@ -120,7 +120,7 @@ declare const CustomContext: React.Context<CustomProviderProps<{
|
|
|
120
120
|
Picker?: {
|
|
121
121
|
noResultsText: string;
|
|
122
122
|
placeholder: string;
|
|
123
|
-
searchPlaceholder: string;
|
|
123
|
+
searchPlaceholder: string;
|
|
124
124
|
checkAll: string;
|
|
125
125
|
} | undefined;
|
|
126
126
|
InputPicker?: {
|
|
@@ -176,10 +176,10 @@ declare const Consumer: React.Consumer<CustomProviderProps<{
|
|
|
176
176
|
saturday: string;
|
|
177
177
|
ok: string;
|
|
178
178
|
today: string;
|
|
179
|
-
yesterday: string;
|
|
179
|
+
yesterday: string;
|
|
180
180
|
hours: string;
|
|
181
181
|
minutes: string;
|
|
182
|
-
seconds: string;
|
|
182
|
+
seconds: string; /** Support right-to-left */
|
|
183
183
|
formattedMonthPattern: string;
|
|
184
184
|
formattedDayPattern: string;
|
|
185
185
|
dateLocale: any;
|
|
@@ -194,10 +194,10 @@ declare const Consumer: React.Consumer<CustomProviderProps<{
|
|
|
194
194
|
saturday: string;
|
|
195
195
|
ok: string;
|
|
196
196
|
today: string;
|
|
197
|
-
yesterday: string;
|
|
197
|
+
yesterday: string;
|
|
198
198
|
hours: string;
|
|
199
199
|
minutes: string;
|
|
200
|
-
seconds: string;
|
|
200
|
+
seconds: string; /** Support right-to-left */
|
|
201
201
|
formattedMonthPattern: string;
|
|
202
202
|
formattedDayPattern: string;
|
|
203
203
|
dateLocale: any;
|
|
@@ -213,10 +213,10 @@ declare const Consumer: React.Consumer<CustomProviderProps<{
|
|
|
213
213
|
saturday: string;
|
|
214
214
|
ok: string;
|
|
215
215
|
today: string;
|
|
216
|
-
yesterday: string;
|
|
216
|
+
yesterday: string;
|
|
217
217
|
hours: string;
|
|
218
218
|
minutes: string;
|
|
219
|
-
seconds: string;
|
|
219
|
+
seconds: string; /** Support right-to-left */
|
|
220
220
|
formattedMonthPattern: string;
|
|
221
221
|
formattedDayPattern: string;
|
|
222
222
|
dateLocale: any;
|
|
@@ -224,7 +224,7 @@ declare const Consumer: React.Consumer<CustomProviderProps<{
|
|
|
224
224
|
Picker?: {
|
|
225
225
|
noResultsText: string;
|
|
226
226
|
placeholder: string;
|
|
227
|
-
searchPlaceholder: string;
|
|
227
|
+
searchPlaceholder: string;
|
|
228
228
|
checkAll: string;
|
|
229
229
|
} | undefined;
|
|
230
230
|
InputPicker?: {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
2
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
3
|
-
import React from 'react';
|
|
3
|
+
import React, { useEffect } from 'react';
|
|
4
4
|
import { getClassNamePrefix, prefix } from '../utils/prefix';
|
|
5
5
|
import { addClass, removeClass, canUseDOM } from '../DOMHelper';
|
|
6
6
|
var CustomContext = /*#__PURE__*/React.createContext({});
|
|
@@ -21,7 +21,7 @@ var CustomProvider = function CustomProvider(props) {
|
|
|
21
21
|
theme: theme
|
|
22
22
|
}, rest);
|
|
23
23
|
}, [classPrefix, theme, rest]);
|
|
24
|
-
|
|
24
|
+
useEffect(function () {
|
|
25
25
|
if (canUseDOM && theme) {
|
|
26
26
|
addClass(document.body, prefix(classPrefix, "theme-" + theme)); // Remove the className that will cause style conflicts
|
|
27
27
|
|
|
@@ -3,7 +3,7 @@ import { RangeType } from './Toolbar';
|
|
|
3
3
|
import { DatePickerLocale } from '../locales';
|
|
4
4
|
import { FormControlBaseProps, PickerBaseProps, RsRefForwardingComponent } from '../@types/common';
|
|
5
5
|
export type { RangeType } from './Toolbar';
|
|
6
|
-
export interface DatePickerProps extends PickerBaseProps<DatePickerLocale>, FormControlBaseProps<Date> {
|
|
6
|
+
export interface DatePickerProps extends PickerBaseProps<DatePickerLocale>, FormControlBaseProps<Date | null> {
|
|
7
7
|
/** Configure shortcut options */
|
|
8
8
|
ranges?: RangeType<Date>[];
|
|
9
9
|
/** Calendar panel default presentation date and time */
|
|
@@ -2,7 +2,6 @@ import _extends from "@babel/runtime/helpers/esm/extends";
|
|
|
2
2
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
3
3
|
import React, { useCallback, useMemo, useRef, useState } from 'react';
|
|
4
4
|
import PropTypes from 'prop-types';
|
|
5
|
-
import isNil from 'lodash/isNil';
|
|
6
5
|
import mapValues from 'lodash/mapValues';
|
|
7
6
|
import pick from 'lodash/pick';
|
|
8
7
|
import omit from 'lodash/omit';
|
|
@@ -166,11 +165,11 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
166
165
|
closeOverlay = true;
|
|
167
166
|
}
|
|
168
167
|
|
|
169
|
-
var nextValue =
|
|
168
|
+
var nextValue = typeof nextPageDate !== 'undefined' ? nextPageDate : calendarDate;
|
|
170
169
|
setCalendarDate(nextValue || new Date());
|
|
171
170
|
setValue(nextValue);
|
|
172
171
|
|
|
173
|
-
if (nextValue !== value
|
|
172
|
+
if (nextValue !== value) {
|
|
174
173
|
onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
|
|
175
174
|
} // `closeOverlay` default value is `true`
|
|
176
175
|
|
|
@@ -99,22 +99,8 @@ var Calendar = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
99
99
|
return !after;
|
|
100
100
|
}, [calendarDate, index, showOneCalendar]);
|
|
101
101
|
var disabledMonth = useCallback(function (date) {
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
if (disabledDate !== null && disabledDate !== void 0 && disabledDate(date, value, DATERANGE_DISABLED_TARGET.CALENDAR)) {
|
|
105
|
-
return true;
|
|
106
|
-
}
|
|
107
|
-
|
|
108
|
-
if (showOneCalendar) return false;
|
|
109
|
-
|
|
110
|
-
if (index === 1) {
|
|
111
|
-
after = isAfter(date, calendarDate[0]);
|
|
112
|
-
return !after;
|
|
113
|
-
}
|
|
114
|
-
|
|
115
|
-
after = isAfter(calendarDate[1], date);
|
|
116
|
-
return !after;
|
|
117
|
-
}, [calendarDate, disabledDate, index, showOneCalendar, value]);
|
|
102
|
+
return disabledDate === null || disabledDate === void 0 ? void 0 : disabledDate(date, value, DATERANGE_DISABLED_TARGET.CALENDAR);
|
|
103
|
+
}, [disabledDate, value]);
|
|
118
104
|
return /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
|
|
119
105
|
format: format,
|
|
120
106
|
calendarState: calendarState,
|
|
@@ -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
|
}
|
|
@@ -129,8 +129,7 @@ var DropdownMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
129
129
|
var classes = mergeItemClassNames(className, withItemClassPrefix({
|
|
130
130
|
disabled: disabled,
|
|
131
131
|
open: open,
|
|
132
|
-
submenu: true
|
|
133
|
-
|
|
132
|
+
submenu: true
|
|
134
133
|
}));
|
|
135
134
|
return /*#__PURE__*/React.createElement("li", _extends({
|
|
136
135
|
ref: mergeRefs(ref, containerRef),
|
|
@@ -139,13 +138,10 @@ var DropdownMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
139
138
|
var open = _ref2.open,
|
|
140
139
|
buttonProps = _objectWithoutPropertiesLoose(_ref2, ["open"]);
|
|
141
140
|
|
|
142
|
-
var classes = mergeItemClassNames(className, prefixItemClassName(
|
|
143
|
-
withItemClassPrefix({
|
|
141
|
+
var classes = mergeItemClassNames(className, prefixItemClassName(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["toggle"]))), withItemClassPrefix({
|
|
144
142
|
'with-icon': icon,
|
|
145
143
|
open: open,
|
|
146
|
-
|
|
147
|
-
disabled: disabled // focus: active
|
|
148
|
-
|
|
144
|
+
disabled: disabled
|
|
149
145
|
}));
|
|
150
146
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
151
147
|
ref: mergeRefs(buttonRef, buttonRef),
|
|
@@ -182,8 +178,7 @@ var DropdownMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
182
178
|
active = _ref5.active,
|
|
183
179
|
menuitem = _objectWithoutPropertiesLoose(_ref5, ["selected", "active"]);
|
|
184
180
|
|
|
185
|
-
var classes = mergeItemClassNames(className, prefixItemClassName(
|
|
186
|
-
withItemClassPrefix({
|
|
181
|
+
var classes = mergeItemClassNames(className, prefixItemClassName(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["toggle"]))), withItemClassPrefix({
|
|
187
182
|
'with-icon': icon,
|
|
188
183
|
open: open,
|
|
189
184
|
active: selected,
|
|
@@ -221,8 +216,7 @@ var DropdownMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
221
216
|
var classes = mergeItemClassNames(className, withItemClassPrefix({
|
|
222
217
|
disabled: disabled,
|
|
223
218
|
open: open,
|
|
224
|
-
submenu: true
|
|
225
|
-
|
|
219
|
+
submenu: true
|
|
226
220
|
}));
|
|
227
221
|
return /*#__PURE__*/React.createElement("li", _extends({
|
|
228
222
|
ref: mergeRefs(ref, menuContainerRef),
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import Dropdown from '../Dropdown';
|
|
3
|
+
var ref = /*#__PURE__*/React.createRef(); // Infer `toggleAs` props (defaults to Button)
|
|
4
|
+
|
|
5
|
+
/*#__PURE__*/
|
|
6
|
+
React.createElement(Dropdown, {
|
|
7
|
+
ref: ref,
|
|
8
|
+
appearance: "subtle",
|
|
9
|
+
size: "sm"
|
|
10
|
+
});
|
|
11
|
+
/* eslint-disable @typescript-eslint/no-unused-vars */
|
|
12
|
+
|
|
13
|
+
var CustomToggle = function CustomToggle(_props) {
|
|
14
|
+
return null;
|
|
15
|
+
};
|
|
16
|
+
|
|
17
|
+
/*#__PURE__*/
|
|
18
|
+
React.createElement(Dropdown, {
|
|
19
|
+
ref: ref,
|
|
20
|
+
toggleAs: CustomToggle,
|
|
21
|
+
myProp: "myValue"
|
|
22
|
+
});
|
|
@@ -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 */
|
|
@@ -10,7 +10,7 @@ import InputGroup from '../InputGroup/InputGroup';
|
|
|
10
10
|
import InputGroupAddon from '../InputGroup/InputGroupAddon';
|
|
11
11
|
import Input from '../Input';
|
|
12
12
|
import Button from '../Button';
|
|
13
|
-
import { partitionHTMLProps, createChainedFunction, useClassNames, useControlled } from '../utils';
|
|
13
|
+
import { partitionHTMLProps, createChainedFunction, useClassNames, useControlled, KEY_VALUES } from '../utils';
|
|
14
14
|
|
|
15
15
|
/**
|
|
16
16
|
* Check if the value is a number.
|
|
@@ -93,16 +93,17 @@ var InputNumber = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
93
93
|
step = _props$step === void 0 ? 1 : _props$step,
|
|
94
94
|
_props$buttonAppearan = props.buttonAppearance,
|
|
95
95
|
buttonAppearance = _props$buttonAppearan === void 0 ? 'subtle' : _props$buttonAppearan,
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
_props$max = props.max,
|
|
99
|
-
max = _props$max === void 0 ? Infinity : _props$max,
|
|
96
|
+
minProp = props.min,
|
|
97
|
+
maxProp = props.max,
|
|
100
98
|
_props$scrollable = props.scrollable,
|
|
101
99
|
scrollable = _props$scrollable === void 0 ? true : _props$scrollable,
|
|
102
100
|
onChange = props.onChange,
|
|
103
101
|
onWheel = props.onWheel,
|
|
104
102
|
restProps = _objectWithoutPropertiesLoose(props, ["as", "className", "classPrefix", "disabled", "readOnly", "plaintext", "value", "defaultValue", "size", "prefix", "postfix", "step", "buttonAppearance", "min", "max", "scrollable", "onChange", "onWheel"]);
|
|
105
103
|
|
|
104
|
+
var min = minProp !== null && minProp !== void 0 ? minProp : -Infinity;
|
|
105
|
+
var max = maxProp !== null && maxProp !== void 0 ? maxProp : Infinity;
|
|
106
|
+
|
|
106
107
|
var _useControlled = useControlled(valueProp, defaultValue),
|
|
107
108
|
value = _useControlled[0],
|
|
108
109
|
setValue = _useControlled[1];
|
|
@@ -166,6 +167,35 @@ var InputNumber = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
166
167
|
var bit = decimals(val, step);
|
|
167
168
|
handleChangeValue(getSafeValue((val - step).toFixed(bit)), event);
|
|
168
169
|
}, [getSafeValue, handleChangeValue, step, value]);
|
|
170
|
+
var handleKeyDown = useCallback(function (event) {
|
|
171
|
+
switch (event.key) {
|
|
172
|
+
case KEY_VALUES.UP:
|
|
173
|
+
event.preventDefault();
|
|
174
|
+
handlePlus(event);
|
|
175
|
+
break;
|
|
176
|
+
|
|
177
|
+
case KEY_VALUES.DOWN:
|
|
178
|
+
event.preventDefault();
|
|
179
|
+
handleMinus(event);
|
|
180
|
+
break;
|
|
181
|
+
|
|
182
|
+
case KEY_VALUES.HOME:
|
|
183
|
+
if (typeof minProp !== 'undefined') {
|
|
184
|
+
event.preventDefault();
|
|
185
|
+
handleChangeValue(getSafeValue(minProp), event);
|
|
186
|
+
}
|
|
187
|
+
|
|
188
|
+
break;
|
|
189
|
+
|
|
190
|
+
case KEY_VALUES.END:
|
|
191
|
+
if (typeof maxProp !== 'undefined') {
|
|
192
|
+
event.preventDefault();
|
|
193
|
+
handleChangeValue(getSafeValue(maxProp), event);
|
|
194
|
+
}
|
|
195
|
+
|
|
196
|
+
break;
|
|
197
|
+
}
|
|
198
|
+
}, [handlePlus, handleMinus, minProp, maxProp, handleChangeValue, getSafeValue]);
|
|
169
199
|
var handleWheel = useCallback(function (event) {
|
|
170
200
|
if (!disabled && !readOnly && event.target === document.activeElement) {
|
|
171
201
|
event.preventDefault();
|
|
@@ -211,7 +241,7 @@ var InputNumber = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
211
241
|
};
|
|
212
242
|
}, [handleWheel, scrollable]);
|
|
213
243
|
var input = /*#__PURE__*/React.createElement(Input, _extends({}, htmlInputProps, {
|
|
214
|
-
type: "
|
|
244
|
+
type: "number",
|
|
215
245
|
autoComplete: "off",
|
|
216
246
|
step: step,
|
|
217
247
|
inputRef: inputRef,
|
|
@@ -221,7 +251,8 @@ var InputNumber = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
221
251
|
disabled: disabled,
|
|
222
252
|
readOnly: readOnly,
|
|
223
253
|
plaintext: plaintext,
|
|
224
|
-
ref: plaintext ? ref : undefined
|
|
254
|
+
ref: plaintext ? ref : undefined,
|
|
255
|
+
onKeyDown: handleKeyDown
|
|
225
256
|
}));
|
|
226
257
|
|
|
227
258
|
if (plaintext) {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/esm/Modal/utils.js
CHANGED
|
@@ -45,20 +45,28 @@ export var useBodyStyles = function useBodyStyles(ref, options) {
|
|
|
45
45
|
|
|
46
46
|
(_windowResizeListener = windowResizeListener.current) === null || _windowResizeListener === void 0 ? void 0 : (_windowResizeListener2 = _windowResizeListener.off) === null || _windowResizeListener2 === void 0 ? void 0 : _windowResizeListener2.call(_windowResizeListener);
|
|
47
47
|
(_contentElementResize = contentElementResizeObserver.current) === null || _contentElementResize === void 0 ? void 0 : _contentElementResize.disconnect();
|
|
48
|
+
windowResizeListener.current = null;
|
|
49
|
+
contentElementResizeObserver.current = null;
|
|
48
50
|
}, []);
|
|
49
51
|
var onChangeBodyStyles = useCallback(function (entering) {
|
|
50
|
-
if (overflow && !drawer) {
|
|
52
|
+
if (overflow && !drawer && ref.current) {
|
|
51
53
|
updateBodyStyles(undefined, entering);
|
|
52
54
|
contentElement.current = ref.current.querySelector("." + prefix('content'));
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
}
|
|
57
|
-
|
|
55
|
+
|
|
56
|
+
if (!windowResizeListener.current) {
|
|
57
|
+
windowResizeListener.current = on(window, 'resize', updateBodyStyles);
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
if (contentElement.current && !contentElementResizeObserver.current) {
|
|
61
|
+
contentElementResizeObserver.current = new ResizeObserver(function () {
|
|
62
|
+
return updateBodyStyles();
|
|
63
|
+
});
|
|
64
|
+
contentElementResizeObserver.current.observe(contentElement.current);
|
|
65
|
+
}
|
|
58
66
|
}
|
|
59
67
|
}, [drawer, overflow, prefix, ref, updateBodyStyles]);
|
|
60
68
|
useEffect(function () {
|
|
61
|
-
onDestroyEvents
|
|
62
|
-
}, [
|
|
69
|
+
return onDestroyEvents; // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
70
|
+
}, []);
|
|
63
71
|
return [overflow ? bodyStyles : {}, onChangeBodyStyles, onDestroyEvents];
|
|
64
72
|
};
|
|
@@ -196,8 +196,11 @@ var MultiCascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
196
196
|
children.then(function (data) {
|
|
197
197
|
node.loading = false;
|
|
198
198
|
node[childrenKey] = data;
|
|
199
|
-
|
|
200
|
-
|
|
199
|
+
|
|
200
|
+
if (targetRef.current) {
|
|
201
|
+
addFlattenData(data, node);
|
|
202
|
+
addColumn(data, cascadePaths.length);
|
|
203
|
+
}
|
|
201
204
|
});
|
|
202
205
|
} else {
|
|
203
206
|
node.loading = false;
|
|
@@ -234,7 +237,7 @@ var MultiCascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
234
237
|
onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextValue, node, checked, event);
|
|
235
238
|
}, [cascade, onChange, onCheck, setValue, splitValue, value, valueKey]);
|
|
236
239
|
var handleClean = useCallback(function (event) {
|
|
237
|
-
if (disabled) {
|
|
240
|
+
if (disabled || !targetRef.current) {
|
|
238
241
|
return;
|
|
239
242
|
}
|
|
240
243
|
|
|
@@ -456,6 +459,7 @@ var MultiCascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
456
459
|
var _usePickerClassName = usePickerClassName(_extends({}, props, {
|
|
457
460
|
classPrefix: classPrefix,
|
|
458
461
|
hasValue: hasValue,
|
|
462
|
+
countable: countable,
|
|
459
463
|
name: 'cascader',
|
|
460
464
|
appearance: appearance,
|
|
461
465
|
cleanable: cleanable
|
package/esm/Nav/NavItem.js
CHANGED
|
@@ -83,7 +83,9 @@ var NavItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
83
83
|
}
|
|
84
84
|
|
|
85
85
|
if (navbar) {
|
|
86
|
-
return /*#__PURE__*/React.createElement(NavbarItem,
|
|
86
|
+
return /*#__PURE__*/React.createElement(NavbarItem, _extends({
|
|
87
|
+
ref: ref
|
|
88
|
+
}, props));
|
|
87
89
|
}
|
|
88
90
|
|
|
89
91
|
return /*#__PURE__*/React.createElement(Component, _extends({
|
|
@@ -99,6 +99,11 @@ var DropdownMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
99
99
|
|
|
100
100
|
useEffect(function () {
|
|
101
101
|
var container = menuBodyContainerRef.current;
|
|
102
|
+
|
|
103
|
+
if (!container) {
|
|
104
|
+
return;
|
|
105
|
+
}
|
|
106
|
+
|
|
102
107
|
var activeItem = container.querySelector("." + prefix('item-focus'));
|
|
103
108
|
|
|
104
109
|
if (!activeItem) {
|
|
@@ -90,11 +90,9 @@ var PickerToggle = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
90
90
|
}
|
|
91
91
|
}, [input, onFocus]);
|
|
92
92
|
var handleBlur = useCallback(function (event) {
|
|
93
|
-
if (document.activeElement !== inputRef.current) {
|
|
94
|
-
var _inputRef$current2;
|
|
95
|
-
|
|
93
|
+
if (inputRef.current && document.activeElement !== inputRef.current) {
|
|
96
94
|
setActive(false);
|
|
97
|
-
|
|
95
|
+
inputRef.current.blur();
|
|
98
96
|
}
|
|
99
97
|
|
|
100
98
|
onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);
|
|
@@ -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;
|