rsuite 5.48.1 → 5.49.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 +14 -0
- package/Cascader/styles/index.less +1 -0
- package/DatePicker/styles/index.less +18 -11
- package/DateRangeInput/package.json +7 -0
- package/DateRangePicker/styles/index.less +10 -0
- package/InputGroup/styles/index.less +1 -0
- package/Picker/styles/index.less +20 -0
- package/README.md +32 -22
- package/Sidenav/styles/index.less +2 -0
- package/cjs/Calendar/CalendarContainer.d.ts +2 -0
- package/cjs/Calendar/CalendarContainer.js +11 -4
- package/cjs/Calendar/CalendarHeader.js +2 -0
- package/cjs/Calendar/MonthDropdown.js +7 -2
- package/cjs/Calendar/MonthDropdownItem.js +2 -2
- package/cjs/Calendar/Table.js +6 -1
- package/cjs/Calendar/TimeDropdown.js +17 -10
- package/cjs/Calendar/types.d.ts +1 -0
- package/cjs/CustomProvider/CustomProvider.d.ts +13 -0
- package/cjs/CustomProvider/CustomProvider.js +2 -2
- package/cjs/DateInput/DateField.d.ts +9 -31
- package/cjs/DateInput/DateField.js +61 -12
- package/cjs/DateInput/DateInput.d.ts +7 -2
- package/cjs/DateInput/DateInput.js +74 -92
- package/cjs/DateInput/index.d.ts +4 -0
- package/cjs/DateInput/index.js +19 -1
- package/cjs/DateInput/useDateInputState.d.ts +7 -31
- package/cjs/DateInput/useDateInputState.js +39 -15
- package/cjs/DateInput/useIsFocused.d.ts +7 -0
- package/cjs/DateInput/useIsFocused.js +28 -0
- package/cjs/DateInput/useKeyboardInputEvent.d.ts +10 -0
- package/cjs/DateInput/useKeyboardInputEvent.js +44 -0
- package/cjs/DateInput/utils.d.ts +23 -1
- package/cjs/DateInput/utils.js +155 -51
- package/cjs/DatePicker/DatePicker.d.ts +20 -7
- package/cjs/DatePicker/DatePicker.js +210 -241
- package/cjs/DatePicker/PickerIndicator.d.ts +10 -0
- package/cjs/DatePicker/PickerIndicator.js +48 -0
- package/cjs/DatePicker/PickerLabel.d.ts +9 -0
- package/cjs/DatePicker/PickerLabel.js +23 -0
- package/cjs/DatePicker/Toolbar.js +3 -21
- package/cjs/DatePicker/utils.d.ts +5 -1
- package/cjs/DatePicker/utils.js +17 -1
- package/cjs/DateRangeInput/DateRangeInput.d.ts +29 -0
- package/cjs/DateRangeInput/DateRangeInput.js +244 -0
- package/cjs/DateRangeInput/index.d.ts +3 -0
- package/cjs/DateRangeInput/index.js +9 -0
- package/cjs/DateRangeInput/utils.d.ts +61 -0
- package/cjs/DateRangeInput/utils.js +146 -0
- package/cjs/DateRangePicker/DateRangePicker.js +12 -2
- package/cjs/Input/Input.d.ts +11 -0
- package/cjs/Input/Input.js +11 -8
- package/cjs/Overlay/OverlayTrigger.d.ts +3 -0
- package/cjs/Overlay/OverlayTrigger.js +5 -0
- package/cjs/Picker/usePickerRef.d.ts +17 -0
- package/cjs/Picker/usePickerRef.js +82 -0
- package/cjs/index.d.ts +2 -0
- package/cjs/index.js +3 -1
- package/cjs/locales/index.d.ts +2 -2
- package/cjs/utils/index.d.ts +2 -0
- package/cjs/utils/index.js +8 -2
- package/cjs/utils/useCustom.js +1 -1
- package/cjs/utils/useIsomorphicLayoutEffect.d.ts +3 -0
- package/cjs/utils/useIsomorphicLayoutEffect.js +9 -0
- package/dist/rsuite-no-reset-rtl.css +51 -141
- package/dist/rsuite-no-reset-rtl.min.css +1 -1
- package/dist/rsuite-no-reset-rtl.min.css.map +1 -1
- package/dist/rsuite-no-reset.css +51 -141
- package/dist/rsuite-no-reset.min.css +1 -1
- package/dist/rsuite-no-reset.min.css.map +1 -1
- package/dist/rsuite-rtl.css +51 -9
- package/dist/rsuite-rtl.min.css +1 -1
- package/dist/rsuite-rtl.min.css.map +1 -1
- package/dist/rsuite.css +51 -9
- package/dist/rsuite.js +4800 -246
- 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/Calendar/CalendarContainer.d.ts +2 -0
- package/esm/Calendar/CalendarContainer.js +12 -5
- package/esm/Calendar/CalendarHeader.js +2 -0
- package/esm/Calendar/MonthDropdown.js +7 -2
- package/esm/Calendar/MonthDropdownItem.js +2 -2
- package/esm/Calendar/Table.js +6 -1
- package/esm/Calendar/TimeDropdown.js +17 -10
- package/esm/Calendar/types.d.ts +1 -0
- package/esm/CustomProvider/CustomProvider.d.ts +13 -0
- package/esm/CustomProvider/CustomProvider.js +3 -3
- package/esm/DateInput/DateField.d.ts +9 -31
- package/esm/DateInput/DateField.js +61 -12
- package/esm/DateInput/DateInput.d.ts +7 -2
- package/esm/DateInput/DateInput.js +77 -95
- package/esm/DateInput/index.d.ts +4 -0
- package/esm/DateInput/index.js +4 -0
- package/esm/DateInput/useDateInputState.d.ts +7 -31
- package/esm/DateInput/useDateInputState.js +41 -18
- package/esm/DateInput/useIsFocused.d.ts +7 -0
- package/esm/DateInput/useIsFocused.js +22 -0
- package/esm/DateInput/useKeyboardInputEvent.d.ts +10 -0
- package/esm/DateInput/useKeyboardInputEvent.js +38 -0
- package/esm/DateInput/utils.d.ts +23 -1
- package/esm/DateInput/utils.js +150 -51
- package/esm/DatePicker/DatePicker.d.ts +20 -7
- package/esm/DatePicker/DatePicker.js +213 -244
- package/esm/DatePicker/PickerIndicator.d.ts +10 -0
- package/esm/DatePicker/PickerIndicator.js +42 -0
- package/esm/DatePicker/PickerLabel.d.ts +9 -0
- package/esm/DatePicker/PickerLabel.js +17 -0
- package/esm/DatePicker/Toolbar.js +3 -21
- package/esm/DatePicker/utils.d.ts +5 -1
- package/esm/DatePicker/utils.js +16 -1
- package/esm/DateRangeInput/DateRangeInput.d.ts +29 -0
- package/esm/DateRangeInput/DateRangeInput.js +237 -0
- package/esm/DateRangeInput/index.d.ts +3 -0
- package/esm/DateRangeInput/index.js +3 -0
- package/esm/DateRangeInput/utils.d.ts +61 -0
- package/esm/DateRangeInput/utils.js +137 -0
- package/esm/DateRangePicker/DateRangePicker.js +12 -2
- package/esm/Input/Input.d.ts +11 -0
- package/esm/Input/Input.js +12 -9
- package/esm/Overlay/OverlayTrigger.d.ts +3 -0
- package/esm/Overlay/OverlayTrigger.js +5 -0
- package/esm/Picker/usePickerRef.d.ts +17 -0
- package/esm/Picker/usePickerRef.js +77 -0
- package/esm/index.d.ts +2 -0
- package/esm/index.js +1 -0
- package/esm/locales/index.d.ts +2 -2
- package/esm/utils/index.d.ts +2 -0
- package/esm/utils/index.js +3 -1
- package/esm/utils/useCustom.js +2 -2
- package/esm/utils/useIsomorphicLayoutEffect.d.ts +3 -0
- package/esm/utils/useIsomorphicLayoutEffect.js +4 -0
- package/package.json +1 -1
- 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/normalize.less +230 -231
|
@@ -0,0 +1,146 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
"use strict";
|
|
3
|
+
|
|
4
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
5
|
+
exports.__esModule = true;
|
|
6
|
+
exports.getInputSelectedState = getInputSelectedState;
|
|
7
|
+
exports.getDateType = getDateType;
|
|
8
|
+
exports.isSwitchDateType = isSwitchDateType;
|
|
9
|
+
exports.DateType = void 0;
|
|
10
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
11
|
+
var _DateInput = require("../DateInput");
|
|
12
|
+
var DateType;
|
|
13
|
+
exports.DateType = DateType;
|
|
14
|
+
(function (DateType) {
|
|
15
|
+
DateType["Start"] = "Start";
|
|
16
|
+
DateType["End"] = "End";
|
|
17
|
+
})(DateType || (exports.DateType = DateType = {}));
|
|
18
|
+
function getInputSelectedState(options) {
|
|
19
|
+
var input = options.input,
|
|
20
|
+
direction = options.direction,
|
|
21
|
+
formatStr = options.formatStr,
|
|
22
|
+
rangeFormatStr = options.rangeFormatStr,
|
|
23
|
+
localize = options.localize,
|
|
24
|
+
selectedMonth = options.selectedMonth,
|
|
25
|
+
_options$valueOffset = options.valueOffset,
|
|
26
|
+
valueOffset = _options$valueOffset === void 0 ? 0 : _options$valueOffset,
|
|
27
|
+
character = options.character,
|
|
28
|
+
dateType = options.dateType,
|
|
29
|
+
dateString = options.dateString;
|
|
30
|
+
var getPatternSelectedIndexes = function getPatternSelectedIndexes(pattern) {
|
|
31
|
+
var selectionStart = 0;
|
|
32
|
+
var selectionEnd = 0;
|
|
33
|
+
if (dateType === DateType.Start) {
|
|
34
|
+
selectionStart = rangeFormatStr.indexOf(pattern);
|
|
35
|
+
selectionEnd = rangeFormatStr.split(character)[0].lastIndexOf(pattern) + 1;
|
|
36
|
+
} else if (dateType === DateType.End) {
|
|
37
|
+
var position = rangeFormatStr.indexOf(character) + character.length;
|
|
38
|
+
selectionStart = rangeFormatStr.indexOf(pattern, position);
|
|
39
|
+
selectionEnd = rangeFormatStr.lastIndexOf(pattern) + 1;
|
|
40
|
+
}
|
|
41
|
+
var endDateGap = dateString.indexOf(character) - rangeFormatStr.indexOf(character);
|
|
42
|
+
|
|
43
|
+
// If the date type is end, and the end date is not selected, the selection range needs to be adjusted.
|
|
44
|
+
if (dateType === DateType.End && endDateGap > 0) {
|
|
45
|
+
selectionStart += endDateGap;
|
|
46
|
+
selectionEnd += endDateGap;
|
|
47
|
+
}
|
|
48
|
+
var gap = (0, _DateInput.getSelectIndexGap)({
|
|
49
|
+
pattern: pattern,
|
|
50
|
+
formatStr: formatStr,
|
|
51
|
+
valueOffset: valueOffset,
|
|
52
|
+
selectedMonth: selectedMonth,
|
|
53
|
+
localize: localize
|
|
54
|
+
});
|
|
55
|
+
var isSelectedMonth = pattern === 'M';
|
|
56
|
+
var isNullMonth = selectedMonth === null && !(isSelectedMonth && valueOffset !== 0);
|
|
57
|
+
|
|
58
|
+
// If the month is null and the valueOffset is 0, the month will not be updated, and the gap is 0 at this time.
|
|
59
|
+
if (isNullMonth) {
|
|
60
|
+
return {
|
|
61
|
+
selectionStart: selectionStart,
|
|
62
|
+
selectionEnd: selectionEnd
|
|
63
|
+
};
|
|
64
|
+
}
|
|
65
|
+
if (isSelectedMonth) {
|
|
66
|
+
return {
|
|
67
|
+
selectionStart: selectionStart,
|
|
68
|
+
selectionEnd: selectionEnd + gap
|
|
69
|
+
};
|
|
70
|
+
}
|
|
71
|
+
if ((0, _DateInput.isCursorAfterMonth)(selectionStart, formatStr)) {
|
|
72
|
+
return {
|
|
73
|
+
selectionStart: selectionStart + gap,
|
|
74
|
+
selectionEnd: selectionEnd + gap
|
|
75
|
+
};
|
|
76
|
+
}
|
|
77
|
+
return {
|
|
78
|
+
selectionStart: selectionStart,
|
|
79
|
+
selectionEnd: selectionEnd
|
|
80
|
+
};
|
|
81
|
+
};
|
|
82
|
+
if (typeof input.selectionEnd === 'number' && typeof input.selectionStart === 'number') {
|
|
83
|
+
var index = input.selectionStart;
|
|
84
|
+
var positionOffset = -1;
|
|
85
|
+
if (direction === 'left') {
|
|
86
|
+
index = input.selectionStart - 1;
|
|
87
|
+
} else if (direction === 'right') {
|
|
88
|
+
index = input.selectionEnd + 1;
|
|
89
|
+
positionOffset = 1;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
// The start position of the index of the end date
|
|
93
|
+
var endDateIndex = dateString.indexOf(character) + character.length;
|
|
94
|
+
var datePattern = (0, _DateInput.getDatePattern)({
|
|
95
|
+
selectionIndex: dateType === DateType.End ? index - endDateIndex : index,
|
|
96
|
+
positionOffset: positionOffset,
|
|
97
|
+
formatStr: formatStr,
|
|
98
|
+
dateString: dateString,
|
|
99
|
+
valueOffset: valueOffset,
|
|
100
|
+
selectedMonth: selectedMonth,
|
|
101
|
+
localize: localize
|
|
102
|
+
});
|
|
103
|
+
var indexes = getPatternSelectedIndexes(datePattern);
|
|
104
|
+
return (0, _extends2.default)({
|
|
105
|
+
selectedPattern: datePattern
|
|
106
|
+
}, indexes);
|
|
107
|
+
}
|
|
108
|
+
return {
|
|
109
|
+
selectedPattern: 'y',
|
|
110
|
+
selectionStart: 0,
|
|
111
|
+
selectionEnd: 0
|
|
112
|
+
};
|
|
113
|
+
}
|
|
114
|
+
function getDateType(dateString, character, cursorIndex) {
|
|
115
|
+
var splitIndex = dateString.indexOf(character);
|
|
116
|
+
if (cursorIndex > splitIndex) {
|
|
117
|
+
return DateType.End;
|
|
118
|
+
}
|
|
119
|
+
return DateType.Start;
|
|
120
|
+
}
|
|
121
|
+
function isSwitchDateType(dateString, character, cursorIndex, direction) {
|
|
122
|
+
var characterIndex = dateString.indexOf(character);
|
|
123
|
+
var startIndex = cursorIndex;
|
|
124
|
+
var endIndex = startIndex + character.length;
|
|
125
|
+
if (direction === 'left') {
|
|
126
|
+
endIndex = cursorIndex;
|
|
127
|
+
startIndex = endIndex - character.length;
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
// Check whether the cursor is a separator before and after
|
|
131
|
+
if (dateString.substring(startIndex, endIndex) === character) {
|
|
132
|
+
return true;
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
// Check whether the cursor is a number or letter before and after. If not, switch the date type.
|
|
136
|
+
// eg: `2020年12月01日`, the cursor is behind 01, press the right key, and switch to the end date.
|
|
137
|
+
if (direction === 'right') {
|
|
138
|
+
if (!dateString.substring(cursorIndex, characterIndex).match(/[0-9a-zA-Z]/)) {
|
|
139
|
+
return true;
|
|
140
|
+
}
|
|
141
|
+
}
|
|
142
|
+
if (!dateString.substring(characterIndex, cursorIndex).match(/[0-9a-zA-Z]/)) {
|
|
143
|
+
return true;
|
|
144
|
+
}
|
|
145
|
+
return false;
|
|
146
|
+
}
|
|
@@ -581,6 +581,14 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
|
|
|
581
581
|
var panelClasses = prefix('daterange-panel', {
|
|
582
582
|
'daterange-panel-show-one-calendar': showOneCalendar
|
|
583
583
|
});
|
|
584
|
+
|
|
585
|
+
/**
|
|
586
|
+
* Set a min-width (528px) when there are two calendars
|
|
587
|
+
* @see https://github.com/rsuite/rsuite/issues/3522
|
|
588
|
+
*/
|
|
589
|
+
var panelStyles = {
|
|
590
|
+
minWidth: showOneCalendar ? 'auto' : 528
|
|
591
|
+
};
|
|
584
592
|
var styles = (0, _extends2.default)({}, menuStyle, {
|
|
585
593
|
left: left,
|
|
586
594
|
top: top
|
|
@@ -617,7 +625,8 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
|
|
|
617
625
|
target: triggerRef,
|
|
618
626
|
style: styles
|
|
619
627
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
620
|
-
className: panelClasses
|
|
628
|
+
className: panelClasses,
|
|
629
|
+
style: panelStyles
|
|
621
630
|
}, /*#__PURE__*/_react.default.createElement(_Stack.default, {
|
|
622
631
|
alignItems: "flex-start"
|
|
623
632
|
}, sideRanges.length > 0 && /*#__PURE__*/_react.default.createElement(_PredefinedRanges.default, {
|
|
@@ -632,7 +641,8 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
|
|
|
632
641
|
}), /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
|
|
633
642
|
className: prefix('daterange-content')
|
|
634
643
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
635
|
-
className: prefix('daterange-header')
|
|
644
|
+
className: prefix('daterange-header'),
|
|
645
|
+
"data-testid": "daterange-header"
|
|
636
646
|
}, getDisplayString(selectedDates)), /*#__PURE__*/_react.default.createElement("div", {
|
|
637
647
|
className: prefix("daterange-calendar-" + (showOneCalendar ? 'single' : 'group'))
|
|
638
648
|
}, /*#__PURE__*/_react.default.createElement(_DateRangePickerContext.default.Provider, {
|
package/cjs/Input/Input.d.ts
CHANGED
|
@@ -13,12 +13,23 @@ export interface InputProps extends WithAsProps, Omit<React.InputHTMLAttributes<
|
|
|
13
13
|
size?: TypeAttributes.Size;
|
|
14
14
|
/** Ref of input element */
|
|
15
15
|
inputRef?: React.Ref<any>;
|
|
16
|
+
/**
|
|
17
|
+
* The htmlSize attribute defines the width of the <input> element.
|
|
18
|
+
*
|
|
19
|
+
* @see MDN https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/size
|
|
20
|
+
* @version 5.49.0
|
|
21
|
+
*/
|
|
22
|
+
htmlSize?: number;
|
|
23
|
+
/**
|
|
24
|
+
* The callback function in which value is changed.
|
|
25
|
+
*/
|
|
16
26
|
onChange?: PrependParameters<React.ChangeEventHandler<HTMLInputElement>, [value: string]>;
|
|
17
27
|
/** Called on press enter */
|
|
18
28
|
onPressEnter?: React.KeyboardEventHandler<HTMLInputElement>;
|
|
19
29
|
}
|
|
20
30
|
/**
|
|
21
31
|
* The `<Input>` component is used to get user input in a text field.
|
|
32
|
+
*
|
|
22
33
|
* @see https://rsuitejs.com/components/input
|
|
23
34
|
*/
|
|
24
35
|
declare const Input: RsRefForwardingComponent<'input', InputProps>;
|
package/cjs/Input/Input.js
CHANGED
|
@@ -15,6 +15,7 @@ var _Plaintext = _interopRequireDefault(require("../Plaintext"));
|
|
|
15
15
|
var _utils = require("../utils");
|
|
16
16
|
/**
|
|
17
17
|
* The `<Input>` component is used to get user input in a text field.
|
|
18
|
+
*
|
|
18
19
|
* @see https://rsuitejs.com/components/input
|
|
19
20
|
*/
|
|
20
21
|
var Input = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
@@ -31,6 +32,7 @@ var Input = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
31
32
|
inputRef = props.inputRef,
|
|
32
33
|
id = props.id,
|
|
33
34
|
size = props.size,
|
|
35
|
+
htmlSize = props.htmlSize,
|
|
34
36
|
plaintext = props.plaintext,
|
|
35
37
|
readOnly = props.readOnly,
|
|
36
38
|
onPressEnter = props.onPressEnter,
|
|
@@ -38,17 +40,17 @@ var Input = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
38
40
|
onBlur = props.onBlur,
|
|
39
41
|
onKeyDown = props.onKeyDown,
|
|
40
42
|
onChange = props.onChange,
|
|
41
|
-
rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["className", "classPrefix", "as", "type", "disabled", "value", "defaultValue", "inputRef", "id", "size", "plaintext", "readOnly", "onPressEnter", "onFocus", "onBlur", "onKeyDown", "onChange"]);
|
|
42
|
-
var handleKeyDown =
|
|
43
|
+
rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["className", "classPrefix", "as", "type", "disabled", "value", "defaultValue", "inputRef", "id", "size", "htmlSize", "plaintext", "readOnly", "onPressEnter", "onFocus", "onBlur", "onKeyDown", "onChange"]);
|
|
44
|
+
var handleKeyDown = function handleKeyDown(event) {
|
|
43
45
|
if (event.key === _utils.KEY_VALUES.ENTER) {
|
|
44
46
|
onPressEnter === null || onPressEnter === void 0 ? void 0 : onPressEnter(event);
|
|
45
47
|
}
|
|
46
48
|
onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
|
|
47
|
-
}
|
|
48
|
-
var handleChange =
|
|
49
|
+
};
|
|
50
|
+
var handleChange = function handleChange(event) {
|
|
49
51
|
var _event$target;
|
|
50
52
|
onChange === null || onChange === void 0 ? void 0 : onChange((_event$target = event.target) === null || _event$target === void 0 ? void 0 : _event$target.value, event);
|
|
51
|
-
}
|
|
53
|
+
};
|
|
52
54
|
var _useClassNames = (0, _utils.useClassNames)(classPrefix),
|
|
53
55
|
withClassPrefix = _useClassNames.withClassPrefix,
|
|
54
56
|
merge = _useClassNames.merge;
|
|
@@ -66,9 +68,9 @@ var Input = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
66
68
|
localeKey: "unfilled"
|
|
67
69
|
}, typeof value === 'undefined' ? defaultValue : value);
|
|
68
70
|
}
|
|
69
|
-
var
|
|
71
|
+
var inputable = !disabled && !readOnly;
|
|
70
72
|
var eventProps = {};
|
|
71
|
-
if (
|
|
73
|
+
if (inputable) {
|
|
72
74
|
eventProps.onChange = handleChange;
|
|
73
75
|
eventProps.onKeyDown = handleKeyDown;
|
|
74
76
|
eventProps.onFocus = (0, _utils.createChainedFunction)(onFocus, inputGroupContext === null || inputGroupContext === void 0 ? void 0 : inputGroupContext.onFocus);
|
|
@@ -82,7 +84,8 @@ var Input = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
82
84
|
value: value,
|
|
83
85
|
defaultValue: defaultValue,
|
|
84
86
|
disabled: disabled,
|
|
85
|
-
readOnly: readOnly
|
|
87
|
+
readOnly: readOnly,
|
|
88
|
+
size: htmlSize
|
|
86
89
|
}));
|
|
87
90
|
});
|
|
88
91
|
Input.displayName = 'Input';
|
|
@@ -77,6 +77,9 @@ export interface OverlayTriggerHandle {
|
|
|
77
77
|
updatePosition: () => void;
|
|
78
78
|
open: (delay?: number) => void;
|
|
79
79
|
close: (delay?: number) => void;
|
|
80
|
+
getState: () => {
|
|
81
|
+
open?: boolean;
|
|
82
|
+
};
|
|
80
83
|
}
|
|
81
84
|
/**
|
|
82
85
|
* OverlayTrigger is used to display floating elements on another component.
|
|
@@ -171,6 +171,11 @@ var OverlayTrigger = /*#__PURE__*/_react.default.forwardRef(function (props, ref
|
|
|
171
171
|
var _overlayRef$current;
|
|
172
172
|
return (_overlayRef$current = overlayRef.current) === null || _overlayRef$current === void 0 ? void 0 : _overlayRef$current.child;
|
|
173
173
|
},
|
|
174
|
+
getState: function getState() {
|
|
175
|
+
return {
|
|
176
|
+
open: open
|
|
177
|
+
};
|
|
178
|
+
},
|
|
174
179
|
open: handleOpen,
|
|
175
180
|
close: function close(delay) {
|
|
176
181
|
return handleClose(delay, function () {
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import type { OverlayTriggerHandle } from './PickerToggleTrigger';
|
|
3
|
+
import type { ListHandle } from '../Windowing';
|
|
4
|
+
export interface PickerDependentParameters {
|
|
5
|
+
inline?: boolean;
|
|
6
|
+
}
|
|
7
|
+
/**
|
|
8
|
+
* A hook of the exposed method of Picker
|
|
9
|
+
*/
|
|
10
|
+
declare function usePickerRef(ref: any, parmas?: PickerDependentParameters): {
|
|
11
|
+
trigger: import("react").RefObject<OverlayTriggerHandle>;
|
|
12
|
+
root: import("react").RefObject<HTMLElement>;
|
|
13
|
+
overlay: import("react").RefObject<HTMLElement>;
|
|
14
|
+
target: import("react").RefObject<HTMLElement>;
|
|
15
|
+
list: import("react").RefObject<ListHandle>;
|
|
16
|
+
};
|
|
17
|
+
export default usePickerRef;
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
"use strict";
|
|
3
|
+
|
|
4
|
+
exports.__esModule = true;
|
|
5
|
+
exports.default = void 0;
|
|
6
|
+
var _react = require("react");
|
|
7
|
+
/**
|
|
8
|
+
* A hook of the exposed method of Picker
|
|
9
|
+
*/
|
|
10
|
+
function usePickerRef(ref, parmas) {
|
|
11
|
+
var trigger = (0, _react.useRef)(null);
|
|
12
|
+
var root = (0, _react.useRef)(null);
|
|
13
|
+
var target = (0, _react.useRef)(null);
|
|
14
|
+
var overlay = (0, _react.useRef)(null);
|
|
15
|
+
var list = (0, _react.useRef)(null);
|
|
16
|
+
var _ref = parmas || {},
|
|
17
|
+
inline = _ref.inline;
|
|
18
|
+
var handleOpen = (0, _react.useCallback)(function () {
|
|
19
|
+
var _trigger$current;
|
|
20
|
+
trigger === null || trigger === void 0 ? void 0 : (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : _trigger$current.open();
|
|
21
|
+
}, [trigger]);
|
|
22
|
+
var handleClose = (0, _react.useCallback)(function () {
|
|
23
|
+
var _trigger$current2;
|
|
24
|
+
trigger === null || trigger === void 0 ? void 0 : (_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : _trigger$current2.close();
|
|
25
|
+
}, [trigger]);
|
|
26
|
+
var handleUpdatePosition = (0, _react.useCallback)(function () {
|
|
27
|
+
var _trigger$current3;
|
|
28
|
+
trigger === null || trigger === void 0 ? void 0 : (_trigger$current3 = trigger.current) === null || _trigger$current3 === void 0 ? void 0 : _trigger$current3.updatePosition();
|
|
29
|
+
}, [trigger]);
|
|
30
|
+
(0, _react.useImperativeHandle)(ref, function () {
|
|
31
|
+
// Tree and CheckTree
|
|
32
|
+
if (inline) {
|
|
33
|
+
return {
|
|
34
|
+
get root() {
|
|
35
|
+
var _trigger$current$root, _trigger$current4;
|
|
36
|
+
return root !== null && root !== void 0 && root.current ? root === null || root === void 0 ? void 0 : root.current : (_trigger$current$root = trigger === null || trigger === void 0 ? void 0 : (_trigger$current4 = trigger.current) === null || _trigger$current4 === void 0 ? void 0 : _trigger$current4.root) !== null && _trigger$current$root !== void 0 ? _trigger$current$root : null;
|
|
37
|
+
},
|
|
38
|
+
get list() {
|
|
39
|
+
if (!(list !== null && list !== void 0 && list.current)) {
|
|
40
|
+
throw new Error('The list is not found, please set `virtualized` for the component.');
|
|
41
|
+
}
|
|
42
|
+
return list === null || list === void 0 ? void 0 : list.current;
|
|
43
|
+
}
|
|
44
|
+
};
|
|
45
|
+
}
|
|
46
|
+
return {
|
|
47
|
+
get root() {
|
|
48
|
+
var _ref2, _trigger$current5;
|
|
49
|
+
return (_ref2 = (root === null || root === void 0 ? void 0 : root.current) || (trigger === null || trigger === void 0 ? void 0 : (_trigger$current5 = trigger.current) === null || _trigger$current5 === void 0 ? void 0 : _trigger$current5.root)) !== null && _ref2 !== void 0 ? _ref2 : null;
|
|
50
|
+
},
|
|
51
|
+
get overlay() {
|
|
52
|
+
var _overlay$current;
|
|
53
|
+
if (!(overlay !== null && overlay !== void 0 && overlay.current)) {
|
|
54
|
+
throw new Error('The overlay is not found. Please confirm whether the picker is open.');
|
|
55
|
+
}
|
|
56
|
+
return (_overlay$current = overlay === null || overlay === void 0 ? void 0 : overlay.current) !== null && _overlay$current !== void 0 ? _overlay$current : null;
|
|
57
|
+
},
|
|
58
|
+
get target() {
|
|
59
|
+
var _target$current;
|
|
60
|
+
return (_target$current = target === null || target === void 0 ? void 0 : target.current) !== null && _target$current !== void 0 ? _target$current : null;
|
|
61
|
+
},
|
|
62
|
+
get list() {
|
|
63
|
+
if (!(list !== null && list !== void 0 && list.current)) {
|
|
64
|
+
throw new Error("\n The list is not found.\n 1.Please set virtualized for the component.\n 2.Please confirm whether the picker is open.\n ");
|
|
65
|
+
}
|
|
66
|
+
return list === null || list === void 0 ? void 0 : list.current;
|
|
67
|
+
},
|
|
68
|
+
updatePosition: handleUpdatePosition,
|
|
69
|
+
open: handleOpen,
|
|
70
|
+
close: handleClose
|
|
71
|
+
};
|
|
72
|
+
});
|
|
73
|
+
return {
|
|
74
|
+
trigger: trigger,
|
|
75
|
+
root: root,
|
|
76
|
+
overlay: overlay,
|
|
77
|
+
target: target,
|
|
78
|
+
list: list
|
|
79
|
+
};
|
|
80
|
+
}
|
|
81
|
+
var _default = usePickerRef;
|
|
82
|
+
exports.default = _default;
|
package/cjs/index.d.ts
CHANGED
|
@@ -94,6 +94,8 @@ export { default as DateInput } from './DateInput';
|
|
|
94
94
|
export type { DateInputProps } from './DateInput';
|
|
95
95
|
export { default as DatePicker } from './DatePicker';
|
|
96
96
|
export type { DatePickerProps } from './DatePicker';
|
|
97
|
+
export { default as DateRangeInput } from './DateRangeInput';
|
|
98
|
+
export type { DateRangeInputProps } from './DateRangeInput';
|
|
97
99
|
export { default as DateRangePicker } from './DateRangePicker';
|
|
98
100
|
export type { DateRangePickerProps } from './DateRangePicker';
|
|
99
101
|
export { default as AutoComplete } from './AutoComplete';
|
package/cjs/index.js
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
|
5
5
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
6
6
|
exports.__esModule = true;
|
|
7
|
-
exports.useFormClassNames = exports.useToaster = exports.useMediaQuery = exports.CustomProvider = exports.Affix = exports.DOMHelper = exports.Animation = exports.Schema = exports.Stack = exports.Divider = exports.Footer = exports.Sidebar = exports.Header = exports.Content = exports.Container = exports.FlexboxGrid = exports.Col = exports.Row = exports.Grid = exports.Carousel = exports.Calendar = exports.List = exports.TagGroup = exports.Tag = exports.Timeline = exports.Progress = exports.Table = exports.PanelGroup = exports.Panel = exports.CheckTree = exports.Tree = exports.Rate = exports.RangeSlider = exports.Slider = exports.Uploader = exports.AutoComplete = exports.DateRangePicker = exports.DatePicker = exports.DateInput = exports.MultiCascader = exports.Cascader = exports.CheckTreePicker = exports.TreePicker = exports.TagInput = exports.TagPicker = exports.InputPicker = exports.CheckPicker = exports.SelectPicker = exports.RadioTileGroup = exports.RadioTile = exports.RadioGroup = exports.Radio = exports.CheckboxGroup = exports.Checkbox = exports.InputGroup = exports.InputNumber = exports.MaskedInput = exports.Input = exports.Form = exports.Toggle = exports.Steps = exports.Pagination = exports.Breadcrumb = exports.Sidenav = exports.Navbar = exports.Nav = exports.Dropdown = exports.toaster = exports.AvatarGroup = exports.Avatar = exports.Badge = exports.Placeholder = exports.SafeAnchor = exports.Loader = exports.Drawer = exports.Message = exports.Notification = exports.Modal = exports.Popover = exports.Tooltip = exports.Whisper = exports.ButtonGroup = exports.ButtonToolbar = exports.IconButton = exports.Button = void 0;
|
|
7
|
+
exports.useFormClassNames = exports.useToaster = exports.useMediaQuery = exports.CustomProvider = exports.Affix = exports.DOMHelper = exports.Animation = exports.Schema = exports.Stack = exports.Divider = exports.Footer = exports.Sidebar = exports.Header = exports.Content = exports.Container = exports.FlexboxGrid = exports.Col = exports.Row = exports.Grid = exports.Carousel = exports.Calendar = exports.List = exports.TagGroup = exports.Tag = exports.Timeline = exports.Progress = exports.Table = exports.PanelGroup = exports.Panel = exports.CheckTree = exports.Tree = exports.Rate = exports.RangeSlider = exports.Slider = exports.Uploader = exports.AutoComplete = exports.DateRangePicker = exports.DateRangeInput = exports.DatePicker = exports.DateInput = exports.MultiCascader = exports.Cascader = exports.CheckTreePicker = exports.TreePicker = exports.TagInput = exports.TagPicker = exports.InputPicker = exports.CheckPicker = exports.SelectPicker = exports.RadioTileGroup = exports.RadioTile = exports.RadioGroup = exports.Radio = exports.CheckboxGroup = exports.Checkbox = exports.InputGroup = exports.InputNumber = exports.MaskedInput = exports.Input = exports.Form = exports.Toggle = exports.Steps = exports.Pagination = exports.Breadcrumb = exports.Sidenav = exports.Navbar = exports.Nav = exports.Dropdown = exports.toaster = exports.AvatarGroup = exports.Avatar = exports.Badge = exports.Placeholder = exports.SafeAnchor = exports.Loader = exports.Drawer = exports.Message = exports.Notification = exports.Modal = exports.Popover = exports.Tooltip = exports.Whisper = exports.ButtonGroup = exports.ButtonToolbar = exports.IconButton = exports.Button = void 0;
|
|
8
8
|
var _Button = _interopRequireDefault(require("./Button"));
|
|
9
9
|
exports.Button = _Button.default;
|
|
10
10
|
var _IconButton = _interopRequireDefault(require("./IconButton"));
|
|
@@ -103,6 +103,8 @@ var _DateInput = _interopRequireDefault(require("./DateInput"));
|
|
|
103
103
|
exports.DateInput = _DateInput.default;
|
|
104
104
|
var _DatePicker = _interopRequireDefault(require("./DatePicker"));
|
|
105
105
|
exports.DatePicker = _DatePicker.default;
|
|
106
|
+
var _DateRangeInput = _interopRequireDefault(require("./DateRangeInput"));
|
|
107
|
+
exports.DateRangeInput = _DateRangeInput.default;
|
|
106
108
|
var _DateRangePicker = _interopRequireDefault(require("./DateRangePicker"));
|
|
107
109
|
exports.DateRangePicker = _DateRangePicker.default;
|
|
108
110
|
var _AutoComplete = _interopRequireDefault(require("./AutoComplete"));
|
package/cjs/locales/index.d.ts
CHANGED
|
@@ -31,8 +31,8 @@ export declare type CalendarLocale = PickKeys<typeof defaultLocale.Calendar>;
|
|
|
31
31
|
export declare type PlaintextLocale = PickKeys<typeof defaultLocale.Plaintext>;
|
|
32
32
|
export declare type PaginationLocale = PickKeys<typeof defaultLocale.Pagination>;
|
|
33
33
|
export declare type TableLocale = CommonLocale;
|
|
34
|
-
export declare type DatePickerLocale = PickKeys<typeof defaultLocale.DatePicker
|
|
35
|
-
export declare type DateRangePickerLocale = PickKeys<typeof defaultLocale.DateRangePicker
|
|
34
|
+
export declare type DatePickerLocale = PickKeys<typeof defaultLocale.DatePicker> & CommonLocale;
|
|
35
|
+
export declare type DateRangePickerLocale = PickKeys<typeof defaultLocale.DateRangePicker> & CommonLocale;
|
|
36
36
|
export declare type PickerLocale = typeof defaultLocale.Picker & CommonLocale;
|
|
37
37
|
export declare type InputPickerLocale = PickerLocale & typeof defaultLocale.InputPicker;
|
|
38
38
|
export declare type UploaderLocale = PickKeys<typeof defaultLocale.Uploader> & CommonLocale;
|
package/cjs/utils/index.d.ts
CHANGED
|
@@ -42,3 +42,5 @@ export { default as useWillUnmount } from './useWillUnmount';
|
|
|
42
42
|
export { default as useUpdateEffect } from './useUpdateEffect';
|
|
43
43
|
export { default as useIsMounted } from './useIsMounted';
|
|
44
44
|
export { default as useMount } from './useMount';
|
|
45
|
+
export { default as useUniqueId } from './useUniqueId';
|
|
46
|
+
export { default as useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';
|
package/cjs/utils/index.js
CHANGED
|
@@ -42,13 +42,15 @@ var _exportNames = {
|
|
|
42
42
|
useUpdateEffect: true,
|
|
43
43
|
useIsMounted: true,
|
|
44
44
|
useMount: true,
|
|
45
|
+
useUniqueId: true,
|
|
46
|
+
useIsomorphicLayoutEffect: true,
|
|
45
47
|
defaultClassPrefix: true,
|
|
46
48
|
getClassNamePrefix: true,
|
|
47
49
|
globalKey: true,
|
|
48
50
|
DateUtils: true,
|
|
49
51
|
TypeChecker: true
|
|
50
52
|
};
|
|
51
|
-
exports.TypeChecker = exports.DateUtils = exports.globalKey = exports.getClassNamePrefix = exports.defaultClassPrefix = exports.useMount = exports.useIsMounted = exports.useUpdateEffect = exports.useWillUnmount = exports.useUpdatedRef = exports.useEventCallback = exports.stringToObject = exports.getSafeRegExpString = exports.useRootClose = exports.useControlled = exports.useTimeout = exports.createComponent = exports.usePortal = exports.useCustom = exports.useElementResize = exports.useEventListener = exports.useClassNames = exports.safeSetSelection = exports.render = exports.appendTooltip = exports.scrollTopAnimation = exports.reactToString = exports.composeFunctions = exports.shallowEqualArray = exports.shallowEqual = exports.mergeRefs = exports.getDOMNode = exports.placementPolyfill = exports.clone = exports.previewFile = exports.ajaxUpload = exports.tplTransform = exports.ReactChildren = exports.isOneOf = exports.createChainedFunction = exports.prefix = exports.guid = void 0;
|
|
53
|
+
exports.TypeChecker = exports.DateUtils = exports.globalKey = exports.getClassNamePrefix = exports.defaultClassPrefix = exports.useIsomorphicLayoutEffect = exports.useUniqueId = exports.useMount = exports.useIsMounted = exports.useUpdateEffect = exports.useWillUnmount = exports.useUpdatedRef = exports.useEventCallback = exports.stringToObject = exports.getSafeRegExpString = exports.useRootClose = exports.useControlled = exports.useTimeout = exports.createComponent = exports.usePortal = exports.useCustom = exports.useElementResize = exports.useEventListener = exports.useClassNames = exports.safeSetSelection = exports.render = exports.appendTooltip = exports.scrollTopAnimation = exports.reactToString = exports.composeFunctions = exports.shallowEqualArray = exports.shallowEqual = exports.mergeRefs = exports.getDOMNode = exports.placementPolyfill = exports.clone = exports.previewFile = exports.ajaxUpload = exports.tplTransform = exports.ReactChildren = exports.isOneOf = exports.createChainedFunction = exports.prefix = exports.guid = void 0;
|
|
52
54
|
var _BrowserDetection = require("./BrowserDetection");
|
|
53
55
|
Object.keys(_BrowserDetection).forEach(function (key) {
|
|
54
56
|
if (key === "default" || key === "__esModule") return;
|
|
@@ -157,4 +159,8 @@ exports.useUpdateEffect = _useUpdateEffect.default;
|
|
|
157
159
|
var _useIsMounted = _interopRequireDefault(require("./useIsMounted"));
|
|
158
160
|
exports.useIsMounted = _useIsMounted.default;
|
|
159
161
|
var _useMount = _interopRequireDefault(require("./useMount"));
|
|
160
|
-
exports.useMount = _useMount.default;
|
|
162
|
+
exports.useMount = _useMount.default;
|
|
163
|
+
var _useUniqueId = _interopRequireDefault(require("./useUniqueId"));
|
|
164
|
+
exports.useUniqueId = _useUniqueId.default;
|
|
165
|
+
var _useIsomorphicLayoutEffect = _interopRequireDefault(require("./useIsomorphicLayoutEffect"));
|
|
166
|
+
exports.useIsomorphicLayoutEffect = _useIsomorphicLayoutEffect.default;
|
package/cjs/utils/useCustom.js
CHANGED
|
@@ -44,7 +44,7 @@ function useCustom(keys, overrideLocale) {
|
|
|
44
44
|
}
|
|
45
45
|
var defaultFormatDate = (0, _react.useCallback)(function (date, formatStr) {
|
|
46
46
|
var _locale$Calendar;
|
|
47
|
-
return (0, _dateUtils.format)(date, formatStr, {
|
|
47
|
+
return (0, _dateUtils.format)((0, _dateUtils.isValid)(date) ? date : new Date(), formatStr, {
|
|
48
48
|
locale: locale === null || locale === void 0 ? void 0 : (_locale$Calendar = locale.Calendar) === null || _locale$Calendar === void 0 ? void 0 : _locale$Calendar.dateLocale
|
|
49
49
|
});
|
|
50
50
|
}, [(_locale$Calendar2 = locale.Calendar) === null || _locale$Calendar2 === void 0 ? void 0 : _locale$Calendar2.dateLocale]);
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
"use strict";
|
|
3
|
+
|
|
4
|
+
exports.__esModule = true;
|
|
5
|
+
exports.default = void 0;
|
|
6
|
+
var _react = require("react");
|
|
7
|
+
var useIsomorphicLayoutEffect = typeof window !== 'undefined' ? _react.useLayoutEffect : _react.useEffect;
|
|
8
|
+
var _default = useIsomorphicLayoutEffect;
|
|
9
|
+
exports.default = _default;
|