rsuite 5.59.0 → 5.59.2
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/AvatarGroup/styles/index.css +2 -0
- package/AvatarGroup/styles/index.less +2 -0
- package/CHANGELOG.md +26 -0
- package/CheckPicker/styles/index.css +2 -0
- package/CheckTree/styles/index.css +2 -0
- package/CheckTreePicker/styles/index.css +2 -0
- package/Checkbox/styles/index.css +2 -0
- package/Checkbox/styles/index.less +2 -0
- package/DateRangePicker/styles/index.css +27 -0
- package/DateRangePicker/styles/index.less +27 -0
- package/MultiCascadeTree/styles/index.css +2 -0
- package/MultiCascader/styles/index.css +2 -0
- package/Placeholder/styles/index.css +42 -6
- package/Placeholder/styles/index.less +18 -9
- package/Placeholder/styles/mixin.less +7 -0
- package/Sidenav/styles/index.css +3 -0
- package/Sidenav/styles/index.less +4 -0
- package/TagInput/styles/index.css +2 -0
- package/TagPicker/styles/index.css +2 -0
- package/cjs/@types/common.d.ts +1 -1
- package/cjs/Avatar/Avatar.js +16 -8
- package/cjs/Avatar/useImage.js +0 -1
- package/cjs/AvatarGroup/AvatarGroup.d.ts +1 -0
- package/cjs/AvatarGroup/AvatarGroup.js +12 -12
- package/cjs/Calendar/CalendarContainer.js +4 -4
- package/cjs/Checkbox/Checkbox.js +1 -1
- package/cjs/DatePicker/DatePicker.d.ts +3 -38
- package/cjs/DatePicker/DatePicker.js +86 -137
- package/cjs/DatePicker/PredefinedRanges.d.ts +1 -1
- package/cjs/DatePicker/PredefinedRanges.js +3 -3
- package/cjs/DatePicker/Toolbar.d.ts +1 -1
- package/cjs/DatePicker/Toolbar.js +13 -12
- package/cjs/DatePicker/hooks/useFocus.d.ts +13 -0
- package/cjs/DatePicker/hooks/useFocus.js +96 -0
- package/cjs/DatePicker/hooks/useMonthView.d.ts +10 -0
- package/cjs/DatePicker/hooks/useMonthView.js +28 -0
- package/cjs/DatePicker/index.d.ts +2 -1
- package/cjs/DatePicker/types.d.ts +37 -0
- package/cjs/DatePicker/utils.d.ts +9 -0
- package/cjs/DatePicker/utils.js +20 -2
- package/cjs/DateRangePicker/DateRangePicker.d.ts +15 -3
- package/cjs/DateRangePicker/DateRangePicker.js +58 -68
- package/cjs/DateRangePicker/DateRangePickerContext.d.ts +4 -1
- package/cjs/DateRangePicker/DateRangePickerContext.js +4 -4
- package/cjs/DateRangePicker/Header.d.ts +11 -0
- package/cjs/DateRangePicker/Header.js +65 -0
- package/cjs/DateRangePicker/disabledDateUtils.d.ts +1 -1
- package/cjs/DateRangePicker/disabledDateUtils.js +1 -1
- package/cjs/DateRangePicker/index.js +5 -0
- package/cjs/Form/Form.d.ts +56 -39
- package/cjs/Form/Form.js +70 -208
- package/cjs/Form/FormContext.d.ts +13 -10
- package/cjs/Form/FormContext.js +11 -5
- package/cjs/Form/{useFormClassNames.d.ts → hooks/useFormClassNames.d.ts} +2 -2
- package/cjs/Form/{useFormClassNames.js → hooks/useFormClassNames.js} +2 -2
- package/cjs/Form/hooks/useFormRef.d.ts +55 -0
- package/cjs/Form/hooks/useFormRef.js +45 -0
- package/cjs/Form/hooks/useFormValidate.d.ts +19 -0
- package/cjs/Form/hooks/useFormValidate.js +157 -0
- package/cjs/Form/hooks/useFormValue.d.ts +7 -0
- package/cjs/Form/hooks/useFormValue.js +42 -0
- package/cjs/Form/{useSchemaModel.js → hooks/useSchemaModel.js} +5 -0
- package/cjs/Form/index.d.ts +3 -2
- package/cjs/Form/index.js +3 -9
- package/cjs/FormControl/FormControl.d.ts +1 -1
- package/cjs/FormControl/FormControl.js +51 -69
- package/cjs/FormControl/hooks/useField.d.ts +18 -0
- package/cjs/FormControl/hooks/useField.js +54 -0
- package/cjs/FormControl/hooks/useRegisterModel.d.ts +3 -0
- package/cjs/FormControl/hooks/useRegisterModel.js +22 -0
- package/cjs/FormControl/utils.d.ts +1 -0
- package/cjs/FormControl/utils.js +8 -0
- package/cjs/FormControlLabel/FormControlLabel.js +12 -9
- package/cjs/FormErrorMessage/FormErrorMessage.js +2 -5
- package/cjs/FormGroup/FormGroup.d.ts +18 -4
- package/cjs/FormGroup/FormGroup.js +28 -2
- package/cjs/FormGroup/index.d.ts +1 -0
- package/cjs/FormGroup/index.js +4 -3
- package/cjs/FormHelpText/FormHelpText.d.ts +2 -1
- package/cjs/FormHelpText/FormHelpText.js +16 -9
- package/cjs/Input/Input.js +4 -5
- package/cjs/Placeholder/PlaceholderGraph.d.ts +13 -1
- package/cjs/Placeholder/PlaceholderGrid.d.ts +27 -1
- package/cjs/Placeholder/PlaceholderGrid.js +10 -13
- package/cjs/Placeholder/PlaceholderParagraph.d.ts +24 -1
- package/cjs/Placeholder/PlaceholderParagraph.js +13 -9
- package/cjs/utils/dateUtils.d.ts +72 -10
- package/cjs/utils/dateUtils.js +88 -29
- package/dist/rsuite-no-reset-rtl.css +76 -6
- 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 +76 -6
- package/dist/rsuite-no-reset.min.css +1 -1
- package/dist/rsuite-no-reset.min.css.map +1 -1
- package/dist/rsuite-rtl.css +76 -6
- package/dist/rsuite-rtl.min.css +1 -1
- package/dist/rsuite-rtl.min.css.map +1 -1
- package/dist/rsuite.css +76 -6
- package/dist/rsuite.js +221 -57
- 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.LICENSE.txt +35 -0
- package/dist/rsuite.min.js.map +1 -1
- package/esm/@types/common.d.ts +1 -1
- package/esm/Avatar/Avatar.js +12 -4
- package/esm/Avatar/useImage.js +0 -1
- package/esm/AvatarGroup/AvatarGroup.d.ts +1 -0
- package/esm/AvatarGroup/AvatarGroup.js +12 -12
- package/esm/Calendar/CalendarContainer.js +5 -5
- package/esm/Checkbox/Checkbox.js +1 -1
- package/esm/DatePicker/DatePicker.d.ts +3 -38
- package/esm/DatePicker/DatePicker.js +88 -139
- package/esm/DatePicker/PredefinedRanges.d.ts +1 -1
- package/esm/DatePicker/PredefinedRanges.js +3 -3
- package/esm/DatePicker/Toolbar.d.ts +1 -1
- package/esm/DatePicker/Toolbar.js +13 -12
- package/esm/DatePicker/hooks/useFocus.d.ts +13 -0
- package/esm/DatePicker/hooks/useFocus.js +90 -0
- package/esm/DatePicker/hooks/useMonthView.d.ts +10 -0
- package/esm/DatePicker/hooks/useMonthView.js +22 -0
- package/esm/DatePicker/index.d.ts +2 -1
- package/esm/DatePicker/types.d.ts +37 -0
- package/esm/DatePicker/utils.d.ts +9 -0
- package/esm/DatePicker/utils.js +18 -2
- package/esm/DateRangePicker/DateRangePicker.d.ts +15 -3
- package/esm/DateRangePicker/DateRangePicker.js +61 -71
- package/esm/DateRangePicker/DateRangePickerContext.d.ts +4 -1
- package/esm/DateRangePicker/DateRangePickerContext.js +2 -2
- package/esm/DateRangePicker/Header.d.ts +11 -0
- package/esm/DateRangePicker/Header.js +59 -0
- package/esm/DateRangePicker/disabledDateUtils.d.ts +1 -1
- package/esm/DateRangePicker/disabledDateUtils.js +1 -1
- package/esm/DateRangePicker/index.js +4 -0
- package/esm/Form/Form.d.ts +56 -39
- package/esm/Form/Form.js +68 -205
- package/esm/Form/FormContext.d.ts +13 -10
- package/esm/Form/FormContext.js +6 -2
- package/esm/Form/{useFormClassNames.d.ts → hooks/useFormClassNames.d.ts} +2 -2
- package/esm/Form/{useFormClassNames.js → hooks/useFormClassNames.js} +2 -2
- package/esm/Form/hooks/useFormRef.d.ts +55 -0
- package/esm/Form/hooks/useFormRef.js +40 -0
- package/esm/Form/hooks/useFormValidate.d.ts +19 -0
- package/esm/Form/hooks/useFormValidate.js +152 -0
- package/esm/Form/hooks/useFormValue.d.ts +7 -0
- package/esm/Form/hooks/useFormValue.js +37 -0
- package/esm/Form/{useSchemaModel.js → hooks/useSchemaModel.js} +5 -0
- package/esm/Form/index.d.ts +3 -2
- package/esm/Form/index.js +1 -1
- package/esm/FormControl/FormControl.d.ts +1 -1
- package/esm/FormControl/FormControl.js +49 -67
- package/esm/FormControl/hooks/useField.d.ts +18 -0
- package/esm/FormControl/hooks/useField.js +48 -0
- package/esm/FormControl/hooks/useRegisterModel.d.ts +3 -0
- package/esm/FormControl/hooks/useRegisterModel.js +17 -0
- package/esm/FormControl/utils.d.ts +1 -0
- package/esm/FormControl/utils.js +4 -0
- package/esm/FormControlLabel/FormControlLabel.js +12 -8
- package/esm/FormErrorMessage/FormErrorMessage.js +2 -5
- package/esm/FormGroup/FormGroup.d.ts +18 -4
- package/esm/FormGroup/FormGroup.js +27 -1
- package/esm/FormGroup/index.d.ts +1 -0
- package/esm/FormGroup/index.js +1 -0
- package/esm/FormHelpText/FormHelpText.d.ts +2 -1
- package/esm/FormHelpText/FormHelpText.js +17 -9
- package/esm/Input/Input.js +4 -5
- package/esm/Placeholder/PlaceholderGraph.d.ts +13 -1
- package/esm/Placeholder/PlaceholderGrid.d.ts +27 -1
- package/esm/Placeholder/PlaceholderGrid.js +10 -13
- package/esm/Placeholder/PlaceholderParagraph.d.ts +24 -1
- package/esm/Placeholder/PlaceholderParagraph.js +12 -8
- package/esm/utils/dateUtils.d.ts +72 -10
- package/esm/utils/dateUtils.js +86 -28
- package/package.json +2 -2
- package/cjs/FormControl/useRegisterModel.d.ts +0 -4
- package/cjs/FormControl/useRegisterModel.js +0 -18
- package/esm/FormControl/useRegisterModel.d.ts +0 -4
- package/esm/FormControl/useRegisterModel.js +0 -13
- /package/cjs/Form/{useSchemaModel.d.ts → hooks/useSchemaModel.d.ts} +0 -0
- /package/esm/Form/{useSchemaModel.d.ts → hooks/useSchemaModel.d.ts} +0 -0
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
1
|
import { WithAsProps, RsRefForwardingComponent } from '../@types/common';
|
|
3
2
|
export interface FormGroupProps extends WithAsProps {
|
|
4
3
|
/**
|
|
@@ -7,9 +6,24 @@ export interface FormGroupProps extends WithAsProps {
|
|
|
7
6
|
*/
|
|
8
7
|
controlId?: string;
|
|
9
8
|
}
|
|
10
|
-
export declare const
|
|
11
|
-
|
|
12
|
-
|
|
9
|
+
export declare const useFormGroup: (controlId?: string) => {
|
|
10
|
+
/**
|
|
11
|
+
* The `id` of the `<Form.Control>` component.
|
|
12
|
+
*/
|
|
13
|
+
controlId: string;
|
|
14
|
+
/**
|
|
15
|
+
* The `id` of the `<Form.HelpText>` component.
|
|
16
|
+
*/
|
|
17
|
+
helpTextId: string;
|
|
18
|
+
/**
|
|
19
|
+
* The `id` of the `<Form.ControlLabel>` component.
|
|
20
|
+
*/
|
|
21
|
+
labelId: string;
|
|
22
|
+
/**
|
|
23
|
+
* The `id` of the `<Form.ErrorMessage>` component.
|
|
24
|
+
*/
|
|
25
|
+
errorMessageId: string;
|
|
26
|
+
};
|
|
13
27
|
/**
|
|
14
28
|
* The `<Form.Group>` component is the easiest way to add some structure to forms.
|
|
15
29
|
* @see https://rsuitejs.com/components/form/
|
|
@@ -4,19 +4,45 @@
|
|
|
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.default = exports.
|
|
7
|
+
exports.default = exports.useFormGroup = void 0;
|
|
8
8
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
9
|
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
|
|
10
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
11
11
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
12
12
|
var _utils = require("../utils");
|
|
13
13
|
var FormGroupContext = /*#__PURE__*/_react.default.createContext({});
|
|
14
|
+
var useFormGroup = function useFormGroup(controlId) {
|
|
15
|
+
var context = _react.default.useContext(FormGroupContext);
|
|
16
|
+
var fallbackId = (0, _utils.useUniqueId)('rs-');
|
|
17
|
+
var id = controlId || context.controlId || fallbackId;
|
|
18
|
+
var helpTextId = id + "-help-text";
|
|
19
|
+
var labelId = id + "-label";
|
|
20
|
+
var errorMessageId = id + "-error-message";
|
|
21
|
+
return {
|
|
22
|
+
/**
|
|
23
|
+
* The `id` of the `<Form.Control>` component.
|
|
24
|
+
*/
|
|
25
|
+
controlId: id,
|
|
26
|
+
/**
|
|
27
|
+
* The `id` of the `<Form.HelpText>` component.
|
|
28
|
+
*/
|
|
29
|
+
helpTextId: helpTextId,
|
|
30
|
+
/**
|
|
31
|
+
* The `id` of the `<Form.ControlLabel>` component.
|
|
32
|
+
*/
|
|
33
|
+
labelId: labelId,
|
|
34
|
+
/**
|
|
35
|
+
* The `id` of the `<Form.ErrorMessage>` component.
|
|
36
|
+
*/
|
|
37
|
+
errorMessageId: errorMessageId
|
|
38
|
+
};
|
|
39
|
+
};
|
|
14
40
|
|
|
15
41
|
/**
|
|
16
42
|
* The `<Form.Group>` component is the easiest way to add some structure to forms.
|
|
17
43
|
* @see https://rsuitejs.com/components/form/
|
|
18
44
|
*/
|
|
19
|
-
exports.
|
|
45
|
+
exports.useFormGroup = useFormGroup;
|
|
20
46
|
var FormGroup = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
21
47
|
var _props$as = props.as,
|
|
22
48
|
Component = _props$as === void 0 ? 'div' : _props$as,
|
package/cjs/FormGroup/index.d.ts
CHANGED
package/cjs/FormGroup/index.js
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
"use strict";
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
|
5
5
|
exports.__esModule = true;
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
var _FormGroup =
|
|
6
|
+
exports.default = exports.useFormGroup = void 0;
|
|
7
|
+
var _FormGroup = _interopRequireWildcard(require("./FormGroup"));
|
|
8
|
+
exports.useFormGroup = _FormGroup.useFormGroup;
|
|
8
9
|
var _default = _FormGroup.default;
|
|
9
10
|
exports.default = _default;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
+
import React from 'react';
|
|
1
2
|
import { WithAsProps, RsRefForwardingComponent } from '../@types/common';
|
|
2
|
-
export interface FormHelpTextProps extends WithAsProps {
|
|
3
|
+
export interface FormHelpTextProps extends WithAsProps, React.HTMLAttributes<HTMLSpanElement> {
|
|
3
4
|
/** Whether to show through the Tooltip component */
|
|
4
5
|
tooltip?: boolean;
|
|
5
6
|
}
|
|
@@ -1,24 +1,25 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
"use strict";
|
|
3
3
|
|
|
4
|
-
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
|
5
4
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
6
5
|
exports.__esModule = true;
|
|
7
6
|
exports.default = void 0;
|
|
8
7
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
8
|
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
|
|
10
|
-
var _react =
|
|
9
|
+
var _react = _interopRequireDefault(require("react"));
|
|
11
10
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
12
11
|
var _Tooltip = _interopRequireDefault(require("../Tooltip"));
|
|
13
12
|
var _Whisper = _interopRequireDefault(require("../Whisper"));
|
|
14
13
|
var _utils = require("../utils");
|
|
15
|
-
var _FormGroup = require("../FormGroup
|
|
14
|
+
var _FormGroup = require("../FormGroup");
|
|
16
15
|
var _HelpO = _interopRequireDefault(require("@rsuite/icons/legacy/HelpO"));
|
|
17
16
|
/**
|
|
18
17
|
* The `<Form.HelpText>` component is used to display help information in the form.
|
|
19
18
|
* @see https://rsuitejs.com/components/form/
|
|
20
19
|
*/
|
|
21
20
|
var FormHelpText = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
21
|
+
var _useFormGroup = (0, _FormGroup.useFormGroup)(),
|
|
22
|
+
helpTextId = _useFormGroup.helpTextId;
|
|
22
23
|
var _props$as = props.as,
|
|
23
24
|
Component = _props$as === void 0 ? 'span' : _props$as,
|
|
24
25
|
_props$classPrefix = props.classPrefix,
|
|
@@ -26,9 +27,9 @@ var FormHelpText = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
|
|
|
26
27
|
className = props.className,
|
|
27
28
|
tooltip = props.tooltip,
|
|
28
29
|
children = props.children,
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
30
|
+
_props$id = props.id,
|
|
31
|
+
id = _props$id === void 0 ? helpTextId : _props$id,
|
|
32
|
+
rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "classPrefix", "className", "tooltip", "children", "id"]);
|
|
32
33
|
var _useClassNames = (0, _utils.useClassNames)(classPrefix),
|
|
33
34
|
withClassPrefix = _useClassNames.withClassPrefix,
|
|
34
35
|
merge = _useClassNames.merge;
|
|
@@ -39,13 +40,19 @@ var FormHelpText = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
|
|
|
39
40
|
return /*#__PURE__*/_react.default.createElement(_Whisper.default, {
|
|
40
41
|
ref: ref,
|
|
41
42
|
placement: "topEnd",
|
|
42
|
-
speaker: /*#__PURE__*/_react.default.createElement(_Tooltip.default,
|
|
43
|
+
speaker: /*#__PURE__*/_react.default.createElement(_Tooltip.default, (0, _extends2.default)({
|
|
44
|
+
id: id
|
|
45
|
+
}, rest), children)
|
|
43
46
|
}, /*#__PURE__*/_react.default.createElement(Component, {
|
|
47
|
+
role: "img",
|
|
48
|
+
"aria-label": "help",
|
|
44
49
|
className: classes
|
|
45
|
-
}, /*#__PURE__*/_react.default.createElement(_HelpO.default,
|
|
50
|
+
}, /*#__PURE__*/_react.default.createElement(_HelpO.default, {
|
|
51
|
+
"aria-hidden": true
|
|
52
|
+
})));
|
|
46
53
|
}
|
|
47
54
|
return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
|
|
48
|
-
id:
|
|
55
|
+
id: id
|
|
49
56
|
}, rest, {
|
|
50
57
|
ref: ref,
|
|
51
58
|
className: classes
|
package/cjs/Input/Input.js
CHANGED
|
@@ -9,7 +9,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
|
|
|
9
9
|
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
|
|
10
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
11
11
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
12
|
-
var _FormGroup = require("../FormGroup
|
|
12
|
+
var _FormGroup = require("../FormGroup");
|
|
13
13
|
var _InputGroup = require("../InputGroup/InputGroup");
|
|
14
14
|
var _Plaintext = _interopRequireDefault(require("../internals/Plaintext"));
|
|
15
15
|
var _utils = require("../utils");
|
|
@@ -60,9 +60,8 @@ var Input = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
60
60
|
plaintext: plaintext
|
|
61
61
|
}));
|
|
62
62
|
var inputGroupContext = (0, _react.useContext)(_InputGroup.InputGroupContext);
|
|
63
|
-
var
|
|
64
|
-
|
|
65
|
-
// Make the Input component display in plain text,
|
|
63
|
+
var _useFormGroup = (0, _FormGroup.useFormGroup)(),
|
|
64
|
+
controlId = _useFormGroup.controlId; // Make the Input component display in plain text,
|
|
66
65
|
// and display default characters when there is no value.
|
|
67
66
|
if (plaintext) {
|
|
68
67
|
return /*#__PURE__*/_react.default.createElement(_Plaintext.default, {
|
|
@@ -83,7 +82,7 @@ var Input = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
83
82
|
ref: (0, _utils.mergeRefs)(ref, inputRef),
|
|
84
83
|
className: classes,
|
|
85
84
|
type: type,
|
|
86
|
-
id: id ||
|
|
85
|
+
id: id || controlId,
|
|
87
86
|
value: value,
|
|
88
87
|
defaultValue: defaultValue,
|
|
89
88
|
disabled: disabled,
|
|
@@ -1,8 +1,20 @@
|
|
|
1
1
|
import { WithAsProps, RsRefForwardingComponent } from '../@types/common';
|
|
2
2
|
export interface PlaceholderGraphProps extends WithAsProps {
|
|
3
|
+
/**
|
|
4
|
+
* The height of the graph.
|
|
5
|
+
*
|
|
6
|
+
* @default 200
|
|
7
|
+
*/
|
|
3
8
|
height?: number;
|
|
9
|
+
/**
|
|
10
|
+
* The width of the graph.
|
|
11
|
+
*
|
|
12
|
+
* @default 100%
|
|
13
|
+
*/
|
|
4
14
|
width?: number;
|
|
5
|
-
/**
|
|
15
|
+
/**
|
|
16
|
+
* Placeholder status, display the loading state.
|
|
17
|
+
*/
|
|
6
18
|
active?: boolean;
|
|
7
19
|
}
|
|
8
20
|
/**
|
|
@@ -1,10 +1,36 @@
|
|
|
1
1
|
import { WithAsProps, RsRefForwardingComponent } from '../@types/common';
|
|
2
2
|
export interface PlaceholderGridProps extends WithAsProps {
|
|
3
|
+
/**
|
|
4
|
+
* The number of rows.
|
|
5
|
+
*
|
|
6
|
+
* @default 5
|
|
7
|
+
*/
|
|
3
8
|
rows?: number;
|
|
9
|
+
/**
|
|
10
|
+
* The height of the row.
|
|
11
|
+
*
|
|
12
|
+
* @default 10
|
|
13
|
+
*/
|
|
4
14
|
rowHeight?: number;
|
|
15
|
+
/**
|
|
16
|
+
* @deprecated Use `rowSpacing` instead.
|
|
17
|
+
*/
|
|
5
18
|
rowMargin?: number;
|
|
19
|
+
/**
|
|
20
|
+
* The spacing between rows.
|
|
21
|
+
*
|
|
22
|
+
* @default 20
|
|
23
|
+
* @version 5.59.1
|
|
24
|
+
*/
|
|
25
|
+
rowSpacing?: number;
|
|
26
|
+
/**
|
|
27
|
+
* The number of columns.
|
|
28
|
+
* @default 5
|
|
29
|
+
*/
|
|
6
30
|
columns?: number;
|
|
7
|
-
/**
|
|
31
|
+
/**
|
|
32
|
+
* Placeholder status, display the loading state.
|
|
33
|
+
*/
|
|
8
34
|
active?: boolean;
|
|
9
35
|
}
|
|
10
36
|
/**
|
|
@@ -5,11 +5,13 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
5
5
|
exports.__esModule = true;
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
8
|
+
var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
|
|
8
9
|
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
|
|
9
10
|
var _react = _interopRequireDefault(require("react"));
|
|
10
11
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
11
12
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
12
13
|
var _utils = require("../utils");
|
|
14
|
+
var _templateObject;
|
|
13
15
|
/**
|
|
14
16
|
* The `Placeholder.Grid` component is used to display the loading state of the block.
|
|
15
17
|
* @see https://rsuitejs.com/components/placeholder
|
|
@@ -28,8 +30,10 @@ var PlaceholderGrid = /*#__PURE__*/_react.default.forwardRef(function (props, re
|
|
|
28
30
|
rowHeight = _props$rowHeight === void 0 ? 10 : _props$rowHeight,
|
|
29
31
|
_props$rowMargin = props.rowMargin,
|
|
30
32
|
rowMargin = _props$rowMargin === void 0 ? 20 : _props$rowMargin,
|
|
33
|
+
_props$rowSpacing = props.rowSpacing,
|
|
34
|
+
rowSpacing = _props$rowSpacing === void 0 ? rowMargin : _props$rowSpacing,
|
|
31
35
|
active = props.active,
|
|
32
|
-
rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "className", "classPrefix", "rows", "columns", "rowHeight", "rowMargin", "active"]);
|
|
36
|
+
rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "className", "classPrefix", "rows", "columns", "rowHeight", "rowMargin", "rowSpacing", "active"]);
|
|
33
37
|
var _useClassNames = (0, _utils.useClassNames)(classPrefix),
|
|
34
38
|
merge = _useClassNames.merge,
|
|
35
39
|
prefix = _useClassNames.prefix,
|
|
@@ -38,23 +42,16 @@ var PlaceholderGrid = /*#__PURE__*/_react.default.forwardRef(function (props, re
|
|
|
38
42
|
active: active
|
|
39
43
|
}));
|
|
40
44
|
var colItems = [];
|
|
41
|
-
var firstRowItemWidth = Math.random() * 30 + 30;
|
|
42
|
-
var itemWidth = firstRowItemWidth / 2;
|
|
43
45
|
for (var i = 0; i < columns; i++) {
|
|
44
46
|
var rowItems = [];
|
|
45
47
|
for (var j = 0; j < rows; j++) {
|
|
46
|
-
|
|
47
|
-
if (i > 0) {
|
|
48
|
-
// when other columns
|
|
49
|
-
widthPercent = j > 0 ? itemWidth : firstRowItemWidth;
|
|
50
|
-
}
|
|
51
|
-
rowItems.push( /*#__PURE__*/_react.default.createElement("p", {
|
|
48
|
+
rowItems.push( /*#__PURE__*/_react.default.createElement("div", {
|
|
52
49
|
key: j,
|
|
53
50
|
style: {
|
|
54
|
-
width: widthPercent + "%",
|
|
55
51
|
height: rowHeight,
|
|
56
|
-
marginTop: j > 0 ?
|
|
57
|
-
}
|
|
52
|
+
marginTop: j > 0 ? rowSpacing : undefined
|
|
53
|
+
},
|
|
54
|
+
className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["row"])))
|
|
58
55
|
}));
|
|
59
56
|
}
|
|
60
57
|
colItems.push( /*#__PURE__*/_react.default.createElement("div", {
|
|
@@ -74,7 +71,7 @@ PlaceholderGrid.propTypes = {
|
|
|
74
71
|
rows: _propTypes.default.number,
|
|
75
72
|
columns: _propTypes.default.number,
|
|
76
73
|
rowHeight: _propTypes.default.number,
|
|
77
|
-
|
|
74
|
+
rowSpacing: _propTypes.default.number,
|
|
78
75
|
active: _propTypes.default.bool
|
|
79
76
|
};
|
|
80
77
|
var _default = PlaceholderGrid;
|
|
@@ -1,10 +1,33 @@
|
|
|
1
1
|
import { WithAsProps, RsRefForwardingComponent } from '../@types/common';
|
|
2
2
|
export interface PlaceholderParagraphProps extends WithAsProps {
|
|
3
|
+
/**
|
|
4
|
+
* The number of rows.
|
|
5
|
+
* @default 2
|
|
6
|
+
*/
|
|
3
7
|
rows?: number;
|
|
8
|
+
/**
|
|
9
|
+
* The height of the row.
|
|
10
|
+
* @default 10
|
|
11
|
+
*/
|
|
4
12
|
rowHeight?: number;
|
|
13
|
+
/**
|
|
14
|
+
* @deprecated Use `rowSpacing` instead.
|
|
15
|
+
*/
|
|
5
16
|
rowMargin?: number;
|
|
17
|
+
/**
|
|
18
|
+
* The spacing between rows.
|
|
19
|
+
* @default 20
|
|
20
|
+
* @version 5.59.1
|
|
21
|
+
*/
|
|
22
|
+
rowSpacing?: number;
|
|
23
|
+
/**
|
|
24
|
+
* The shape of the graph.
|
|
25
|
+
* @default false
|
|
26
|
+
*/
|
|
6
27
|
graph?: boolean | 'circle' | 'square' | 'image';
|
|
7
|
-
/**
|
|
28
|
+
/**
|
|
29
|
+
* Placeholder status, display the loading state.
|
|
30
|
+
*/
|
|
8
31
|
active?: boolean;
|
|
9
32
|
}
|
|
10
33
|
/**
|
|
@@ -1,16 +1,18 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
"use strict";
|
|
3
3
|
|
|
4
|
-
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
|
5
4
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
5
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
|
6
6
|
exports.__esModule = true;
|
|
7
7
|
exports.default = void 0;
|
|
8
8
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
|
+
var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
|
|
9
10
|
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
|
|
10
11
|
var _react = _interopRequireWildcard(require("react"));
|
|
11
12
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
12
13
|
var _utils = require("../utils");
|
|
13
14
|
var _propTypes2 = require("../internals/propTypes");
|
|
15
|
+
var _templateObject;
|
|
14
16
|
/**
|
|
15
17
|
* The `Placeholder.Paragraph` component is used to display the loading state of the block.
|
|
16
18
|
* @see https://rsuitejs.com/components/placeholder
|
|
@@ -25,11 +27,13 @@ var PlaceholderParagraph = /*#__PURE__*/_react.default.forwardRef(function (prop
|
|
|
25
27
|
rowHeight = _props$rowHeight === void 0 ? 10 : _props$rowHeight,
|
|
26
28
|
_props$rowMargin = props.rowMargin,
|
|
27
29
|
rowMargin = _props$rowMargin === void 0 ? 20 : _props$rowMargin,
|
|
30
|
+
_props$rowSpacing = props.rowSpacing,
|
|
31
|
+
rowSpacing = _props$rowSpacing === void 0 ? rowMargin : _props$rowSpacing,
|
|
28
32
|
graph = props.graph,
|
|
29
33
|
active = props.active,
|
|
30
34
|
_props$classPrefix = props.classPrefix,
|
|
31
35
|
classPrefix = _props$classPrefix === void 0 ? 'placeholder' : _props$classPrefix,
|
|
32
|
-
rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "className", "rows", "rowHeight", "rowMargin", "graph", "active", "classPrefix"]);
|
|
36
|
+
rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "className", "rows", "rowHeight", "rowMargin", "rowSpacing", "graph", "active", "classPrefix"]);
|
|
33
37
|
var _useClassNames = (0, _utils.useClassNames)(classPrefix),
|
|
34
38
|
merge = _useClassNames.merge,
|
|
35
39
|
prefix = _useClassNames.prefix,
|
|
@@ -39,17 +43,17 @@ var PlaceholderParagraph = /*#__PURE__*/_react.default.forwardRef(function (prop
|
|
|
39
43
|
var rowArr = [];
|
|
40
44
|
for (var i = 0; i < rows; i++) {
|
|
41
45
|
var styles = {
|
|
42
|
-
width: Math.random() * 75 + 25 + "%",
|
|
43
46
|
height: rowHeight,
|
|
44
|
-
marginTop: i > 0 ?
|
|
47
|
+
marginTop: i > 0 ? rowSpacing : Number(rowSpacing) / 2
|
|
45
48
|
};
|
|
46
|
-
rowArr.push( /*#__PURE__*/_react.default.createElement("
|
|
49
|
+
rowArr.push( /*#__PURE__*/_react.default.createElement("div", {
|
|
47
50
|
key: i,
|
|
48
|
-
style: styles
|
|
51
|
+
style: styles,
|
|
52
|
+
className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["row"])))
|
|
49
53
|
}));
|
|
50
54
|
}
|
|
51
55
|
return rowArr;
|
|
52
|
-
}, [rowHeight,
|
|
56
|
+
}, [prefix, rowHeight, rowSpacing, rows]);
|
|
53
57
|
var classes = merge(className, withClassPrefix('paragraph', {
|
|
54
58
|
active: active
|
|
55
59
|
}));
|
|
@@ -62,7 +66,7 @@ var PlaceholderParagraph = /*#__PURE__*/_react.default.forwardRef(function (prop
|
|
|
62
66
|
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
63
67
|
className: prefix('paragraph-graph-inner')
|
|
64
68
|
})), /*#__PURE__*/_react.default.createElement("div", {
|
|
65
|
-
className: prefix('paragraph-
|
|
69
|
+
className: prefix('paragraph-group')
|
|
66
70
|
}, rowElements));
|
|
67
71
|
});
|
|
68
72
|
PlaceholderParagraph.displayName = 'PlaceholderParagraph';
|
|
@@ -71,7 +75,7 @@ PlaceholderParagraph.propTypes = {
|
|
|
71
75
|
classPrefix: _propTypes.default.string,
|
|
72
76
|
rows: _propTypes.default.number,
|
|
73
77
|
rowHeight: _propTypes.default.number,
|
|
74
|
-
|
|
78
|
+
rowSpacing: _propTypes.default.number,
|
|
75
79
|
graph: _propTypes.default.oneOfType([_propTypes.default.bool, (0, _propTypes2.oneOf)(['circle', 'square', 'image'])]),
|
|
76
80
|
active: _propTypes.default.bool
|
|
77
81
|
};
|
package/cjs/utils/dateUtils.d.ts
CHANGED
|
@@ -43,28 +43,84 @@ export { default as set } from 'date-fns/set';
|
|
|
43
43
|
export { default as differenceInCalendarMonths } from 'date-fns/differenceInCalendarMonths';
|
|
44
44
|
export { default as isLastDayOfMonth } from 'date-fns/isLastDayOfMonth';
|
|
45
45
|
export { default as lastDayOfMonth } from 'date-fns/lastDayOfMonth';
|
|
46
|
-
|
|
47
|
-
|
|
46
|
+
declare enum TimeProp {
|
|
47
|
+
DisabledHours = "disabledHours",
|
|
48
|
+
DisabledMinutes = "disabledMinutes",
|
|
49
|
+
DisabledSeconds = "disabledSeconds",
|
|
50
|
+
ShouldDisableHour = "shouldDisableHour",
|
|
51
|
+
ShouldDisableMinute = "shouldDisableMinute",
|
|
52
|
+
ShouldDisableSecond = "shouldDisableSecond",
|
|
53
|
+
HideHours = "hideHours",
|
|
54
|
+
HideMinutes = "hideMinutes",
|
|
55
|
+
HideSeconds = "hideSeconds"
|
|
56
|
+
}
|
|
57
|
+
export declare type CalendarOnlyPropsType = TimeProp;
|
|
58
|
+
export declare const calendarOnlyProps: readonly [TimeProp.DisabledHours, TimeProp.DisabledMinutes, TimeProp.DisabledSeconds, TimeProp.HideHours, TimeProp.HideMinutes, TimeProp.HideSeconds];
|
|
59
|
+
interface CalendarProps {
|
|
60
|
+
[TimeProp.DisabledHours]?: (hours: number, date: Date) => boolean;
|
|
61
|
+
[TimeProp.DisabledMinutes]?: (minutes: number, date: Date) => boolean;
|
|
62
|
+
[TimeProp.DisabledSeconds]?: (seconds: number, date: Date) => boolean;
|
|
63
|
+
[TimeProp.HideHours]?: (hours: number, date: Date) => boolean;
|
|
64
|
+
[TimeProp.HideMinutes]?: (minutes: number, date: Date) => boolean;
|
|
65
|
+
[TimeProp.HideSeconds]?: (seconds: number, date: Date) => boolean;
|
|
66
|
+
}
|
|
48
67
|
/**
|
|
49
68
|
* Verify that the time is valid.
|
|
50
69
|
*
|
|
51
|
-
* @param props
|
|
52
|
-
* @param date
|
|
70
|
+
* @param props - The calendar props.
|
|
71
|
+
* @param date - The date to check.
|
|
72
|
+
* @returns Whether the time is disabled.
|
|
73
|
+
*/
|
|
74
|
+
export declare function disableTime(props: CalendarProps, date: Date): boolean;
|
|
75
|
+
/**
|
|
76
|
+
* Omit the calendar-only props from an object.
|
|
77
|
+
*
|
|
78
|
+
* @param props - The object to omit props from.
|
|
79
|
+
* @returns The object with calendar-only props omitted.
|
|
80
|
+
*/
|
|
81
|
+
export declare const omitHideDisabledProps: <T extends Record<string, any>>(props: T) => Partial<Omit<T, TimeProp>>;
|
|
82
|
+
/**
|
|
83
|
+
* Check if the time should be rendered based on the format.
|
|
84
|
+
*
|
|
85
|
+
* @param format - The format string.
|
|
86
|
+
* @returns Whether the time should be rendered.
|
|
53
87
|
*/
|
|
54
|
-
export declare function disabledTime(props: any, date: Date): boolean;
|
|
55
|
-
export declare const omitHideDisabledProps: <T extends Record<string, any>>(props: T) => Partial<Omit<T, CalendarOnlyPropsType>>;
|
|
56
88
|
export declare const shouldRenderTime: (format: string) => boolean;
|
|
89
|
+
/**
|
|
90
|
+
* Check if the month should be rendered based on the format.
|
|
91
|
+
*
|
|
92
|
+
* @param format - The format string.
|
|
93
|
+
* @returns Whether the month should be rendered.
|
|
94
|
+
*/
|
|
57
95
|
export declare const shouldRenderMonth: (format: string) => boolean;
|
|
96
|
+
/**
|
|
97
|
+
* Check if the date should be rendered based on the format.
|
|
98
|
+
*
|
|
99
|
+
* @param format - The format string.
|
|
100
|
+
* @returns Whether the date should be rendered.
|
|
101
|
+
*/
|
|
58
102
|
export declare const shouldRenderDate: (format: string) => boolean;
|
|
103
|
+
/**
|
|
104
|
+
* Check if only the time should be rendered based on the format.
|
|
105
|
+
*
|
|
106
|
+
* @param format - The format string.
|
|
107
|
+
* @returns Whether only the time should be rendered.
|
|
108
|
+
*/
|
|
59
109
|
export declare const shouldOnlyRenderTime: (format: string) => boolean;
|
|
60
110
|
/**
|
|
61
|
-
* Get all weeks of
|
|
62
|
-
*
|
|
63
|
-
* @
|
|
111
|
+
* Get all weeks of a month.
|
|
112
|
+
*
|
|
113
|
+
* @param monthDate - The date of the month.
|
|
114
|
+
* @param isoWeek - Whether to use ISO week numbering.
|
|
115
|
+
* @returns An array of weeks in the month.
|
|
64
116
|
*/
|
|
65
117
|
export declare function getMonthView(monthDate: Date, isoWeek: boolean): Date[];
|
|
66
118
|
/**
|
|
67
|
-
* Copy the time
|
|
119
|
+
* Copy the time from one date to another.
|
|
120
|
+
*
|
|
121
|
+
* @param from - The source date.
|
|
122
|
+
* @param to - The target date.
|
|
123
|
+
* @returns The target date with the time copied from the source date.
|
|
68
124
|
*/
|
|
69
125
|
export declare function copyTime({ from, to }: {
|
|
70
126
|
from: Date;
|
|
@@ -72,9 +128,15 @@ export declare function copyTime({ from, to }: {
|
|
|
72
128
|
}): Date;
|
|
73
129
|
/**
|
|
74
130
|
* Swap two dates without swapping the time.
|
|
131
|
+
*
|
|
132
|
+
* @param dateRange - The date range to reverse.
|
|
133
|
+
* @returns The reversed date range.
|
|
75
134
|
*/
|
|
76
135
|
export declare function reverseDateRangeOmitTime(dateRange: [Date, Date]): [Date, Date];
|
|
77
136
|
/**
|
|
78
137
|
* Get the time with AM and PM reversed.
|
|
138
|
+
*
|
|
139
|
+
* @param date - The date to reverse the time meridian.
|
|
140
|
+
* @returns The date with the time meridian reversed.
|
|
79
141
|
*/
|
|
80
142
|
export declare const getReversedTimeMeridian: (date: Date) => Date;
|