rsuite 5.59.1 → 5.59.3-alpha.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.
Files changed (141) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/DateRangePicker/styles/index.css +27 -0
  3. package/DateRangePicker/styles/index.less +27 -0
  4. package/cjs/@types/common.d.ts +1 -1
  5. package/cjs/Calendar/CalendarContainer.js +4 -4
  6. package/cjs/DatePicker/DatePicker.d.ts +3 -38
  7. package/cjs/DatePicker/DatePicker.js +86 -137
  8. package/cjs/DatePicker/PredefinedRanges.d.ts +1 -1
  9. package/cjs/DatePicker/PredefinedRanges.js +3 -3
  10. package/cjs/DatePicker/Toolbar.d.ts +1 -1
  11. package/cjs/DatePicker/Toolbar.js +13 -12
  12. package/cjs/DatePicker/hooks/useFocus.d.ts +13 -0
  13. package/cjs/DatePicker/hooks/useFocus.js +96 -0
  14. package/cjs/DatePicker/hooks/useMonthView.d.ts +10 -0
  15. package/cjs/DatePicker/hooks/useMonthView.js +28 -0
  16. package/cjs/DatePicker/index.d.ts +2 -1
  17. package/cjs/DatePicker/types.d.ts +37 -0
  18. package/cjs/DatePicker/utils.d.ts +9 -0
  19. package/cjs/DatePicker/utils.js +20 -2
  20. package/cjs/DateRangePicker/DateRangePicker.d.ts +15 -3
  21. package/cjs/DateRangePicker/DateRangePicker.js +58 -68
  22. package/cjs/DateRangePicker/DateRangePickerContext.d.ts +4 -1
  23. package/cjs/DateRangePicker/DateRangePickerContext.js +4 -4
  24. package/cjs/DateRangePicker/Header.d.ts +11 -0
  25. package/cjs/DateRangePicker/Header.js +65 -0
  26. package/cjs/DateRangePicker/disabledDateUtils.d.ts +1 -1
  27. package/cjs/DateRangePicker/disabledDateUtils.js +1 -1
  28. package/cjs/DateRangePicker/index.js +5 -0
  29. package/cjs/Form/Form.d.ts +56 -39
  30. package/cjs/Form/Form.js +64 -186
  31. package/cjs/Form/FormContext.d.ts +12 -9
  32. package/cjs/Form/FormContext.js +11 -5
  33. package/cjs/Form/hooks/useFormRef.d.ts +55 -0
  34. package/cjs/Form/hooks/useFormRef.js +45 -0
  35. package/cjs/Form/hooks/useFormValidate.d.ts +19 -0
  36. package/cjs/Form/hooks/useFormValidate.js +157 -0
  37. package/cjs/Form/hooks/useFormValue.d.ts +2 -1
  38. package/cjs/Form/hooks/useFormValue.js +12 -1
  39. package/cjs/Form/hooks/useSchemaModel.js +5 -0
  40. package/cjs/Form/index.d.ts +2 -1
  41. package/cjs/FormControl/FormControl.d.ts +1 -1
  42. package/cjs/FormControl/FormControl.js +50 -68
  43. package/cjs/FormControl/hooks/useField.d.ts +18 -0
  44. package/cjs/FormControl/hooks/useField.js +54 -0
  45. package/cjs/FormControl/hooks/useRegisterModel.d.ts +3 -0
  46. package/cjs/FormControl/hooks/useRegisterModel.js +22 -0
  47. package/cjs/FormControl/utils.d.ts +1 -0
  48. package/cjs/FormControl/utils.js +8 -0
  49. package/cjs/FormControlLabel/FormControlLabel.js +12 -9
  50. package/cjs/FormErrorMessage/FormErrorMessage.js +2 -5
  51. package/cjs/FormGroup/FormGroup.d.ts +18 -4
  52. package/cjs/FormGroup/FormGroup.js +28 -2
  53. package/cjs/FormGroup/index.d.ts +1 -0
  54. package/cjs/FormGroup/index.js +4 -3
  55. package/cjs/FormHelpText/FormHelpText.d.ts +2 -1
  56. package/cjs/FormHelpText/FormHelpText.js +16 -9
  57. package/cjs/Input/Input.js +4 -5
  58. package/cjs/utils/dateUtils.d.ts +72 -10
  59. package/cjs/utils/dateUtils.js +88 -29
  60. package/dist/rsuite-no-reset-rtl.css +27 -0
  61. package/dist/rsuite-no-reset-rtl.min.css +1 -1
  62. package/dist/rsuite-no-reset-rtl.min.css.map +1 -1
  63. package/dist/rsuite-no-reset.css +27 -0
  64. package/dist/rsuite-no-reset.min.css +1 -1
  65. package/dist/rsuite-no-reset.min.css.map +1 -1
  66. package/dist/rsuite-rtl.css +27 -0
  67. package/dist/rsuite-rtl.min.css +1 -1
  68. package/dist/rsuite-rtl.min.css.map +1 -1
  69. package/dist/rsuite.css +27 -0
  70. package/dist/rsuite.js +144 -44
  71. package/dist/rsuite.js.map +1 -1
  72. package/dist/rsuite.min.css +1 -1
  73. package/dist/rsuite.min.css.map +1 -1
  74. package/dist/rsuite.min.js +1 -1
  75. package/dist/rsuite.min.js.LICENSE.txt +35 -0
  76. package/dist/rsuite.min.js.map +1 -1
  77. package/esm/@types/common.d.ts +1 -1
  78. package/esm/Calendar/CalendarContainer.js +5 -5
  79. package/esm/DatePicker/DatePicker.d.ts +3 -38
  80. package/esm/DatePicker/DatePicker.js +88 -139
  81. package/esm/DatePicker/PredefinedRanges.d.ts +1 -1
  82. package/esm/DatePicker/PredefinedRanges.js +3 -3
  83. package/esm/DatePicker/Toolbar.d.ts +1 -1
  84. package/esm/DatePicker/Toolbar.js +13 -12
  85. package/esm/DatePicker/hooks/useFocus.d.ts +13 -0
  86. package/esm/DatePicker/hooks/useFocus.js +90 -0
  87. package/esm/DatePicker/hooks/useMonthView.d.ts +10 -0
  88. package/esm/DatePicker/hooks/useMonthView.js +22 -0
  89. package/esm/DatePicker/index.d.ts +2 -1
  90. package/esm/DatePicker/types.d.ts +37 -0
  91. package/esm/DatePicker/utils.d.ts +9 -0
  92. package/esm/DatePicker/utils.js +18 -2
  93. package/esm/DateRangePicker/DateRangePicker.d.ts +15 -3
  94. package/esm/DateRangePicker/DateRangePicker.js +61 -71
  95. package/esm/DateRangePicker/DateRangePickerContext.d.ts +4 -1
  96. package/esm/DateRangePicker/DateRangePickerContext.js +2 -2
  97. package/esm/DateRangePicker/Header.d.ts +11 -0
  98. package/esm/DateRangePicker/Header.js +59 -0
  99. package/esm/DateRangePicker/disabledDateUtils.d.ts +1 -1
  100. package/esm/DateRangePicker/disabledDateUtils.js +1 -1
  101. package/esm/DateRangePicker/index.js +4 -0
  102. package/esm/Form/Form.d.ts +56 -39
  103. package/esm/Form/Form.js +62 -183
  104. package/esm/Form/FormContext.d.ts +12 -9
  105. package/esm/Form/FormContext.js +6 -2
  106. package/esm/Form/hooks/useFormRef.d.ts +55 -0
  107. package/esm/Form/hooks/useFormRef.js +40 -0
  108. package/esm/Form/hooks/useFormValidate.d.ts +19 -0
  109. package/esm/Form/hooks/useFormValidate.js +152 -0
  110. package/esm/Form/hooks/useFormValue.d.ts +2 -1
  111. package/esm/Form/hooks/useFormValue.js +12 -1
  112. package/esm/Form/hooks/useSchemaModel.js +5 -0
  113. package/esm/Form/index.d.ts +2 -1
  114. package/esm/FormControl/FormControl.d.ts +1 -1
  115. package/esm/FormControl/FormControl.js +48 -66
  116. package/esm/FormControl/hooks/useField.d.ts +18 -0
  117. package/esm/FormControl/hooks/useField.js +48 -0
  118. package/esm/FormControl/hooks/useRegisterModel.d.ts +3 -0
  119. package/esm/FormControl/hooks/useRegisterModel.js +17 -0
  120. package/esm/FormControl/utils.d.ts +1 -0
  121. package/esm/FormControl/utils.js +4 -0
  122. package/esm/FormControlLabel/FormControlLabel.js +12 -8
  123. package/esm/FormErrorMessage/FormErrorMessage.js +2 -5
  124. package/esm/FormGroup/FormGroup.d.ts +18 -4
  125. package/esm/FormGroup/FormGroup.js +27 -1
  126. package/esm/FormGroup/index.d.ts +1 -0
  127. package/esm/FormGroup/index.js +1 -0
  128. package/esm/FormHelpText/FormHelpText.d.ts +2 -1
  129. package/esm/FormHelpText/FormHelpText.js +17 -9
  130. package/esm/Input/Input.js +4 -5
  131. package/esm/utils/dateUtils.d.ts +72 -10
  132. package/esm/utils/dateUtils.js +86 -28
  133. package/package.json +2 -2
  134. package/cjs/Form/hooks/useFormError.d.ts +0 -6
  135. package/cjs/Form/hooks/useFormError.js +0 -31
  136. package/cjs/FormControl/useRegisterModel.d.ts +0 -4
  137. package/cjs/FormControl/useRegisterModel.js +0 -18
  138. package/esm/Form/hooks/useFormError.d.ts +0 -6
  139. package/esm/Form/hooks/useFormError.js +0 -26
  140. package/esm/FormControl/useRegisterModel.d.ts +0 -4
  141. package/esm/FormControl/useRegisterModel.js +0 -13
@@ -1,36 +1,64 @@
1
1
  import React from 'react';
2
2
  import { Schema } from 'schema-typed';
3
- import type { CheckResult } from 'schema-typed';
4
3
  import FormControl from '../FormControl';
5
4
  import FormControlLabel from '../FormControlLabel';
6
5
  import FormErrorMessage from '../FormErrorMessage';
7
6
  import FormGroup from '../FormGroup';
8
7
  import FormHelpText from '../FormHelpText';
9
8
  import { WithAsProps, TypeAttributes, RsRefForwardingComponent } from '../@types/common';
9
+ import { FormInstance } from './hooks/useFormRef';
10
10
  export interface FormProps<T = Record<string, any>, errorMsgType = any, E = {
11
11
  [P in keyof T]?: errorMsgType;
12
12
  }> extends WithAsProps, Omit<React.FormHTMLAttributes<HTMLFormElement>, 'onChange' | 'onSubmit' | 'onError'> {
13
- /** Set the left and right columns of the layout of the elements within the form */
13
+ /**
14
+ * Set the left and right columns of the layout of the elements within the form。
15
+ *
16
+ * @default 'vertical'
17
+ */
14
18
  layout?: 'horizontal' | 'vertical' | 'inline';
15
- /** The fluid property allows the Input 100% of the form to fill the container, valid only in vertical layouts. */
19
+ /**
20
+ * The fluid property allows the Input 100% of the form to fill the container, valid only in vertical layouts.
21
+ */
16
22
  fluid?: boolean;
17
- /** Current value of the input. Creates a controlled component */
18
- formValue?: T;
19
- /** Initial value */
20
- formDefaultValue?: T;
21
- /** Error message of form */
22
- formError?: E;
23
- /** Trigger the type of form validation */
23
+ /**
24
+ * Current value of the input. Creates a controlled component
25
+ */
26
+ formValue?: T | null;
27
+ /**
28
+ * Initial value
29
+ */
30
+ formDefaultValue?: T | null;
31
+ /**
32
+ * Error message of form
33
+ */
34
+ formError?: E | null;
35
+ /**
36
+ * Trigger the type of form validation.
37
+ *
38
+ * @default 'change'
39
+ */
24
40
  checkTrigger?: TypeAttributes.CheckTrigger;
25
- /** SchemaModel object */
41
+ /**
42
+ * SchemaModel object
43
+ *
44
+ * @see https://github.com/rsuite/schema-typed
45
+ */
26
46
  model?: Schema;
27
- /** Make the form readonly */
47
+ /**
48
+ * Make the form readonly
49
+ */
28
50
  readOnly?: boolean;
29
- /** Render the form as plain text */
51
+ /**
52
+ * Render the form as plain text
53
+ */
30
54
  plaintext?: boolean;
31
- /** Disable the form. */
55
+ /**
56
+ * Disable the form
57
+ */
32
58
  disabled?: boolean;
33
- /** The error message comes from context */
59
+ /**
60
+ * The error message comes from context
61
+ */
34
62
  errorFromContext?: boolean;
35
63
  /**
36
64
  * The form data is nested.
@@ -46,33 +74,22 @@ export interface FormProps<T = Record<string, any>, errorMsgType = any, E = {
46
74
  * ```
47
75
  */
48
76
  nestedField?: boolean;
49
- /** Callback fired when data changing */
77
+ /**
78
+ * Callback fired when data changing
79
+ */
50
80
  onChange?: (formValue: T, event?: React.SyntheticEvent) => void;
51
- /** Callback fired when error checking */
81
+ /**
82
+ * Callback fired when error checking
83
+ */
52
84
  onError?: (formError: E) => void;
53
- /** Callback fired when data cheking */
85
+ /**
86
+ * Callback fired when data cheking
87
+ */
54
88
  onCheck?: (formError: E) => void;
55
- /** Callback fired when form submit */
56
- onSubmit?: (checkStatus: boolean, event: React.FormEvent<HTMLFormElement>) => void;
57
- }
58
- export interface FormInstance<T = Record<string, any>, errorMsg = string, E = {
59
- [P in keyof T]?: errorMsg;
60
- }> {
61
- root: HTMLFormElement | null;
62
- /** Verify form data */
63
- check: (callback?: (formError: E) => void) => boolean;
64
- /** Asynchronously check form data */
65
- checkAsync: () => Promise<any>;
66
- /** Check the data field */
67
- checkForField: (fieldName: keyof T, callback?: (checkResult: CheckResult<errorMsg>) => void) => boolean;
68
- /** Asynchronous verification as a data field */
69
- checkForFieldAsync: (fieldName: keyof T) => Promise<CheckResult>;
70
- /** Clear all error messages */
71
- cleanErrors: (callback?: () => void) => void;
72
- /** Clear the error message of the specified field */
73
- cleanErrorForField: (fieldName: keyof E, callback?: () => void) => void;
74
- /** All error messages are reset, and an initial value can be set */
75
- resetErrors: (formError: E, callback?: () => void) => void;
89
+ /**
90
+ * Callback fired when form submit
91
+ */
92
+ onSubmit?: (checkPassed: boolean, event: React.FormEvent<HTMLFormElement>) => void;
76
93
  }
77
94
  export interface FormComponent extends RsRefForwardingComponent<'form', FormProps & {
78
95
  ref?: React.Ref<FormInstance>;
package/esm/Form/Form.js CHANGED
@@ -1,12 +1,10 @@
1
1
  'use client';
2
2
  import _extends from "@babel/runtime/helpers/esm/extends";
3
3
  import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
4
- import React, { useMemo, useImperativeHandle, useRef } from 'react';
4
+ import React from 'react';
5
5
  import PropTypes from 'prop-types';
6
- import omit from 'lodash/omit';
7
- import set from 'lodash/set';
8
6
  import { SchemaModel } from 'schema-typed';
9
- import FormContext, { FormValueContext } from './FormContext';
7
+ import { FormValueProvider, FormProvider } from './FormContext';
10
8
  import FormControl from '../FormControl';
11
9
  import FormControlLabel from '../FormControlLabel';
12
10
  import FormErrorMessage from '../FormErrorMessage';
@@ -15,9 +13,11 @@ import FormHelpText from '../FormHelpText';
15
13
  import { useEventCallback } from '../utils';
16
14
  import { oneOf } from '../internals/propTypes';
17
15
  import useSchemaModel from './hooks/useSchemaModel';
18
- import useFormError from './hooks/useFormError';
16
+ import useFormValidate from './hooks/useFormValidate';
19
17
  import useFormValue from './hooks/useFormValue';
20
18
  import useFormClassNames from './hooks/useFormClassNames';
19
+ var defaultSchema = SchemaModel({});
20
+
21
21
  /**
22
22
  * The `Form` component is a form interface for collecting and validating user input.
23
23
  * @see https://rsuitejs.com/components/form
@@ -31,15 +31,15 @@ var Form = /*#__PURE__*/React.forwardRef(function (props, ref) {
31
31
  errorFromContext = _props$errorFromConte === void 0 ? true : _props$errorFromConte,
32
32
  _props$formDefaultVal = props.formDefaultValue,
33
33
  formDefaultValue = _props$formDefaultVal === void 0 ? {} : _props$formDefaultVal,
34
- formValueProp = props.formValue,
35
- formErrorProp = props.formError,
34
+ controlledFormValue = props.formValue,
35
+ controlledFormError = props.formError,
36
36
  fluid = props.fluid,
37
37
  _props$nestedField = props.nestedField,
38
38
  nestedField = _props$nestedField === void 0 ? false : _props$nestedField,
39
39
  _props$layout = props.layout,
40
40
  layout = _props$layout === void 0 ? 'vertical' : _props$layout,
41
41
  _props$model = props.model,
42
- formModel = _props$model === void 0 ? SchemaModel({}) : _props$model,
42
+ formModel = _props$model === void 0 ? defaultSchema : _props$model,
43
43
  readOnly = props.readOnly,
44
44
  plaintext = props.plaintext,
45
45
  className = props.className,
@@ -54,6 +54,27 @@ var Form = /*#__PURE__*/React.forwardRef(function (props, ref) {
54
54
  getCombinedModel = _useSchemaModel.getCombinedModel,
55
55
  pushFieldRule = _useSchemaModel.pushFieldRule,
56
56
  removeFieldRule = _useSchemaModel.removeFieldRule;
57
+ var _useFormValue = useFormValue(controlledFormValue, {
58
+ formDefaultValue: formDefaultValue,
59
+ nestedField: nestedField
60
+ }),
61
+ formValue = _useFormValue.formValue,
62
+ onRemoveValue = _useFormValue.onRemoveValue,
63
+ setFieldValue = _useFormValue.setFieldValue;
64
+ var formValidateProps = {
65
+ ref: ref,
66
+ formValue: formValue,
67
+ getCombinedModel: getCombinedModel,
68
+ onCheck: onCheck,
69
+ onError: onError,
70
+ nestedField: nestedField
71
+ };
72
+ var _useFormValidate = useFormValidate(controlledFormError, formValidateProps),
73
+ formError = _useFormValidate.formError,
74
+ setFieldError = _useFormValidate.setFieldError,
75
+ onRemoveError = _useFormValidate.onRemoveError,
76
+ check = _useFormValidate.check,
77
+ formRef = _useFormValidate.formRef;
57
78
  var classes = useFormClassNames({
58
79
  classPrefix: classPrefix,
59
80
  className: className,
@@ -63,199 +84,57 @@ var Form = /*#__PURE__*/React.forwardRef(function (props, ref) {
63
84
  plaintext: plaintext,
64
85
  disabled: disabled
65
86
  });
66
- var _useFormValue = useFormValue(formValueProp, formDefaultValue),
67
- formValue = _useFormValue.formValue,
68
- setFormValue = _useFormValue.setFormValue,
69
- onRemoveValue = _useFormValue.onRemoveValue;
70
- var _useFormError = useFormError(formErrorProp),
71
- formError = _useFormError.formError,
72
- setFormError = _useFormError.setFormError,
73
- onRemoveError = _useFormError.onRemoveError;
74
- /**
75
- * Validate the form data and return a boolean.
76
- * The error message after verification is returned in the callback.
77
- * @param callback
78
- */
79
- var check = useEventCallback(function (callback) {
80
- var formError = {};
81
- var errorCount = 0;
82
- var model = getCombinedModel();
83
- Object.keys(model.getSchemaSpec()).forEach(function (key) {
84
- var checkResult = model.checkForField(key, formValue || {});
85
- if (checkResult.hasError === true) {
86
- errorCount += 1;
87
- formError[key] = (checkResult === null || checkResult === void 0 ? void 0 : checkResult.errorMessage) || checkResult;
88
- }
89
- });
90
- setFormError(formError);
91
- onCheck === null || onCheck === void 0 ? void 0 : onCheck(formError);
92
- callback === null || callback === void 0 ? void 0 : callback(formError);
93
- if (errorCount > 0) {
94
- onError === null || onError === void 0 ? void 0 : onError(formError);
95
- return false;
96
- }
97
- return true;
98
- });
99
-
100
- /**
101
- * Check the data field
102
- * @param fieldName
103
- * @param callback
104
- */
105
- var checkForField = useEventCallback(function (fieldName, callback) {
106
- var _extends2;
107
- var model = getCombinedModel();
108
- var checkResult = model.checkForField(fieldName, formValue || {});
109
- var nextFormError = _extends({}, formError, (_extends2 = {}, _extends2[fieldName] = (checkResult === null || checkResult === void 0 ? void 0 : checkResult.errorMessage) || checkResult, _extends2));
110
- setFormError(nextFormError);
111
- onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);
112
- callback === null || callback === void 0 ? void 0 : callback(checkResult);
113
- if (checkResult.hasError) {
114
- onError === null || onError === void 0 ? void 0 : onError(nextFormError);
115
- }
116
- return !checkResult.hasError;
117
- });
118
-
119
- /**
120
- * Check form data asynchronously and return a Promise
121
- */
122
- var checkAsync = useEventCallback(function () {
123
- var promises = [];
124
- var keys = [];
125
- var model = getCombinedModel();
126
- Object.keys(model.getSchemaSpec()).forEach(function (key) {
127
- keys.push(key);
128
- promises.push(model.checkForFieldAsync(key, formValue || {}));
129
- });
130
- return Promise.all(promises).then(function (values) {
131
- var formError = {};
132
- var errorCount = 0;
133
- for (var i = 0; i < values.length; i++) {
134
- if (values[i].hasError) {
135
- errorCount += 1;
136
- formError[keys[i]] = values[i].errorMessage;
137
- }
138
- }
139
- onCheck === null || onCheck === void 0 ? void 0 : onCheck(formError);
140
- setFormError(formError);
141
- if (errorCount > 0) {
142
- onError === null || onError === void 0 ? void 0 : onError(formError);
143
- }
144
- return {
145
- hasError: errorCount > 0,
146
- formError: formError
147
- };
148
- });
149
- });
150
-
151
- /**
152
- * Asynchronously check form fields and return Promise
153
- * @param fieldName
154
- */
155
- var checkForFieldAsync = useEventCallback(function (fieldName) {
156
- var model = getCombinedModel();
157
- return model.checkForFieldAsync(fieldName, formValue || {}).then(function (checkResult) {
158
- var _extends3;
159
- var nextFormError = _extends({}, formError, (_extends3 = {}, _extends3[fieldName] = checkResult.errorMessage, _extends3));
160
- onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);
161
- setFormError(nextFormError);
162
- if (checkResult.hasError) {
163
- onError === null || onError === void 0 ? void 0 : onError(nextFormError);
164
- }
165
- return checkResult;
166
- });
167
- });
168
- var cleanErrors = useEventCallback(function () {
169
- setFormError({});
170
- });
171
- var cleanErrorForField = useEventCallback(function (fieldName) {
172
- setFormError(omit(formError, [fieldName]));
173
- });
174
- var resetErrors = useEventCallback(function (formError) {
175
- if (formError === void 0) {
176
- formError = {};
177
- }
178
- setFormError(formError);
179
- });
180
- useImperativeHandle(ref, function () {
181
- return {
182
- root: rootRef.current,
183
- check: check,
184
- checkForField: checkForField,
185
- checkAsync: checkAsync,
186
- checkForFieldAsync: checkForFieldAsync,
187
- cleanErrors: cleanErrors,
188
- cleanErrorForField: cleanErrorForField,
189
- resetErrors: resetErrors
190
- };
191
- });
192
- var removeFieldError = useEventCallback(function (name) {
193
- var formError = onRemoveError(name);
194
- setFormError(formError);
195
- onCheck === null || onCheck === void 0 ? void 0 : onCheck(formError);
196
- });
197
87
  var removeFieldValue = useEventCallback(function (name) {
198
88
  var formValue = onRemoveValue(name);
199
89
  onChange === null || onChange === void 0 ? void 0 : onChange(formValue);
200
90
  });
91
+ var removeFieldError = useEventCallback(function (name) {
92
+ onRemoveError(name);
93
+ });
201
94
  var handleSubmit = useEventCallback(function (event) {
95
+ var _event$preventDefault, _event$stopPropagatio;
96
+ event === null || event === void 0 ? void 0 : (_event$preventDefault = event.preventDefault) === null || _event$preventDefault === void 0 ? void 0 : _event$preventDefault.call(event);
97
+ event === null || event === void 0 ? void 0 : (_event$stopPropagatio = event.stopPropagation) === null || _event$stopPropagatio === void 0 ? void 0 : _event$stopPropagatio.call(event);
202
98
  if (disabled || readOnly || plaintext) {
203
99
  return;
204
100
  }
205
- event.preventDefault();
206
- event.stopPropagation();
207
- var checkStatus = check();
208
- onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(checkStatus, event);
101
+ var checkResult = check();
102
+ onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(checkResult, event);
209
103
  });
210
- var handleFieldError = useEventCallback(function (name, errorMessage) {
211
- var _extends4;
212
- var nextFormError = _extends({}, formError, (_extends4 = {}, _extends4[name] = errorMessage, _extends4));
213
- setFormError(nextFormError);
214
- onError === null || onError === void 0 ? void 0 : onError(nextFormError);
215
- onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);
104
+ var onFieldError = useEventCallback(function (name, checkResult) {
105
+ setFieldError(name, checkResult);
216
106
  });
217
- var handleFieldSuccess = useEventCallback(function (name) {
107
+ var onFieldSuccess = useEventCallback(function (name) {
218
108
  removeFieldError(name);
219
109
  });
220
- var setFieldValue = function setFieldValue(formValue, fieldName, fieldValue) {
221
- var _extends5;
222
- if (nestedField) {
223
- return set(_extends({}, formValue), fieldName, fieldValue);
224
- }
225
- return _extends({}, formValue, (_extends5 = {}, _extends5[fieldName] = fieldValue, _extends5));
226
- };
227
- var handleFieldChange = useEventCallback(function (name, value, event) {
228
- var nextFormValue = setFieldValue(formValue, name, value);
229
- setFormValue(nextFormValue);
110
+ var onFieldChange = useEventCallback(function (name, value, event) {
111
+ var nextFormValue = setFieldValue(name, value);
230
112
  onChange === null || onChange === void 0 ? void 0 : onChange(nextFormValue, event);
231
113
  });
232
- var rootRef = useRef(null);
233
- var formContextValue = useMemo(function () {
234
- return {
235
- getCombinedModel: getCombinedModel,
236
- checkTrigger: checkTrigger,
237
- errorFromContext: errorFromContext,
238
- readOnly: readOnly,
239
- plaintext: plaintext,
240
- disabled: disabled,
241
- formError: formError,
242
- nestedField: nestedField,
243
- removeFieldValue: removeFieldValue,
244
- removeFieldError: removeFieldError,
245
- pushFieldRule: pushFieldRule,
246
- removeFieldRule: removeFieldRule,
247
- onFieldChange: handleFieldChange,
248
- onFieldError: handleFieldError,
249
- onFieldSuccess: handleFieldSuccess
250
- };
251
- }, [getCombinedModel, checkTrigger, errorFromContext, readOnly, plaintext, disabled, formError, nestedField, removeFieldValue, removeFieldError, pushFieldRule, removeFieldRule, handleFieldChange, handleFieldError, handleFieldSuccess]);
114
+ var formContextValue = {
115
+ errorFromContext: errorFromContext,
116
+ checkTrigger: checkTrigger,
117
+ plaintext: plaintext,
118
+ readOnly: readOnly,
119
+ disabled: disabled,
120
+ formError: formError,
121
+ nestedField: nestedField,
122
+ pushFieldRule: pushFieldRule,
123
+ getCombinedModel: getCombinedModel,
124
+ removeFieldValue: removeFieldValue,
125
+ removeFieldError: removeFieldError,
126
+ removeFieldRule: removeFieldRule,
127
+ onFieldSuccess: onFieldSuccess,
128
+ onFieldChange: onFieldChange,
129
+ onFieldError: onFieldError
130
+ };
252
131
  return /*#__PURE__*/React.createElement("form", _extends({}, rest, {
253
- ref: rootRef,
132
+ ref: formRef,
254
133
  onSubmit: handleSubmit,
255
134
  className: classes
256
- }), /*#__PURE__*/React.createElement(FormContext.Provider, {
135
+ }), /*#__PURE__*/React.createElement(FormProvider, {
257
136
  value: formContextValue
258
- }, /*#__PURE__*/React.createElement(FormValueContext.Provider, {
137
+ }, /*#__PURE__*/React.createElement(FormValueProvider, {
259
138
  value: formValue
260
139
  }, children)));
261
140
  });
@@ -1,19 +1,20 @@
1
1
  import React from 'react';
2
2
  import { TypeAttributes } from '../@types/common';
3
- import type { Schema } from 'schema-typed';
3
+ import type { Schema, CheckResult } from 'schema-typed';
4
4
  import type { FieldRuleType } from './hooks/useSchemaModel';
5
- interface TrulyFormContextValue<T = Record<string, any>, errorMsgType = any, E = {
5
+ declare type RecordAny = Record<string, any>;
6
+ interface TrulyFormContextValue<T = RecordAny, errorMsgType = any, E = {
6
7
  [P in keyof T]?: errorMsgType;
7
8
  }> {
8
- getCombinedModel: () => Schema;
9
9
  formError: E;
10
10
  nestedField: boolean;
11
+ getCombinedModel: () => Schema;
11
12
  removeFieldValue: (name: string) => void;
12
13
  removeFieldError: (name: string) => void;
13
- pushFieldRule: (name: string, fieldRule: FieldRuleType) => void;
14
14
  removeFieldRule: (name: string) => void;
15
+ pushFieldRule: (name: string, fieldRule: FieldRuleType) => void;
16
+ onFieldError: (name: string, fieldError: string | CheckResult) => void;
15
17
  onFieldChange: (name: string, value: any, event: React.SyntheticEvent) => void;
16
- onFieldError: (name: string, errorMessage: string) => void;
17
18
  onFieldSuccess: (name: string) => void;
18
19
  }
19
20
  declare type ExternalPropsContextValue = {
@@ -24,8 +25,10 @@ declare type ExternalPropsContextValue = {
24
25
  disabled?: boolean;
25
26
  };
26
27
  declare type InitialContextType = Partial<Record<keyof TrulyFormContextValue, undefined>>;
27
- export declare type FormContextValue<T = Record<string, any>, errorMsgType = any> = (TrulyFormContextValue<T, errorMsgType> | InitialContextType) & ExternalPropsContextValue;
28
- export declare const FormContext: React.Context<FormContextValue<Record<string, any>, any>>;
29
- export declare const FormValueContext: React.Context<Record<string, any> | undefined>;
30
- export declare const FormPlaintextContext: React.Context<boolean>;
28
+ export declare type FormContextValue<T = RecordAny, errorMsgType = any> = (TrulyFormContextValue<T, errorMsgType> | InitialContextType) & ExternalPropsContextValue;
29
+ export declare const FormContext: React.Context<FormContextValue<RecordAny, any>>;
30
+ export declare const FormValueContext: React.Context<RecordAny | undefined>;
31
+ export declare const FormProvider: React.Provider<FormContextValue<RecordAny, any>>;
32
+ export declare const FormValueProvider: React.Provider<RecordAny | undefined>;
33
+ export declare function useFormContext<T = RecordAny, E = any>(): FormContextValue<T, E>;
31
34
  export default FormContext;
@@ -1,6 +1,10 @@
1
1
  'use client';
2
- import React from 'react';
2
+ import React, { useContext } from 'react';
3
3
  export var FormContext = /*#__PURE__*/React.createContext({});
4
4
  export var FormValueContext = /*#__PURE__*/React.createContext({});
5
- export var FormPlaintextContext = /*#__PURE__*/React.createContext(false);
5
+ export var FormProvider = FormContext.Provider;
6
+ export var FormValueProvider = FormValueContext.Provider;
7
+ export function useFormContext() {
8
+ return useContext(FormContext);
9
+ }
6
10
  export default FormContext;
@@ -0,0 +1,55 @@
1
+ /// <reference types="react" />
2
+ import type { CheckResult } from 'schema-typed';
3
+ export interface FormImperativeMethods<T = Record<string, any>, M = string, E = {
4
+ [P in keyof T]?: M;
5
+ }> {
6
+ /**
7
+ * Verify form data
8
+ */
9
+ check: (callback?: (formError: E) => void) => boolean;
10
+ /**
11
+ * Asynchronously check form data
12
+ */
13
+ checkAsync: () => Promise<any>;
14
+ /**
15
+ * Check the data field
16
+ */
17
+ checkForField: (fieldName: keyof T, callback?: (checkResult: CheckResult<M>) => void) => boolean;
18
+ /**
19
+ * Asynchronous verification as a data field
20
+ */
21
+ checkForFieldAsync: (fieldName: keyof T) => Promise<CheckResult>;
22
+ /**
23
+ * Clear all error messages
24
+ */
25
+ cleanErrors: (callback?: () => void) => void;
26
+ /**
27
+ * Clear the error message of the specified field
28
+ */
29
+ cleanErrorForField: (fieldName: keyof E, callback?: () => void) => void;
30
+ /**
31
+ * All error messages are reset, and an initial value can be set
32
+ */
33
+ resetErrors: (formError?: E) => void;
34
+ }
35
+ export interface FormInstance<T = Record<string, any>, M = string, E = {
36
+ [P in keyof T]?: M;
37
+ }> extends FormImperativeMethods<T, M, E> {
38
+ /**
39
+ * Form root element
40
+ */
41
+ root: HTMLFormElement | null;
42
+ }
43
+ interface FormRefProps<T = Record<string, any>, M = string, E = {
44
+ [P in keyof T]?: M;
45
+ }> {
46
+ formError: E;
47
+ nestedField?: boolean;
48
+ setFormError: (formError: E) => void;
49
+ check: (callback?: (formError: E) => void) => boolean;
50
+ checkForField: (fieldName: keyof T, callback?: (checkResult: CheckResult<M>) => void) => boolean;
51
+ checkAsync: () => Promise<any>;
52
+ checkForFieldAsync: (fieldName: keyof T) => Promise<CheckResult>;
53
+ }
54
+ export default function useFormRef(ref: React.Ref<FormInstance>, props: FormRefProps): import("react").RefObject<HTMLFormElement>;
55
+ export {};
@@ -0,0 +1,40 @@
1
+ 'use client';
2
+ import { useRef, useImperativeHandle } from 'react';
3
+ import omit from 'lodash/omit';
4
+ import useEventCallback from '../../utils/useEventCallback';
5
+ import { nameToPath } from '../../FormControl/utils';
6
+ export default function useFormRef(ref, props) {
7
+ var rootRef = useRef(null);
8
+ var formError = props.formError,
9
+ setFormError = props.setFormError,
10
+ nestedField = props.nestedField,
11
+ check = props.check,
12
+ checkForField = props.checkForField,
13
+ checkAsync = props.checkAsync,
14
+ checkForFieldAsync = props.checkForFieldAsync;
15
+ var cleanErrors = useEventCallback(function () {
16
+ setFormError({});
17
+ });
18
+ var resetErrors = useEventCallback(function (formError) {
19
+ if (formError === void 0) {
20
+ formError = {};
21
+ }
22
+ setFormError(formError);
23
+ });
24
+ var cleanErrorForField = useEventCallback(function (fieldName) {
25
+ setFormError(omit(formError, [nestedField ? nameToPath(fieldName) : fieldName]));
26
+ });
27
+ useImperativeHandle(ref, function () {
28
+ return {
29
+ root: rootRef.current,
30
+ check: check,
31
+ checkForField: checkForField,
32
+ checkAsync: checkAsync,
33
+ checkForFieldAsync: checkForFieldAsync,
34
+ cleanErrors: cleanErrors,
35
+ cleanErrorForField: cleanErrorForField,
36
+ resetErrors: resetErrors
37
+ };
38
+ });
39
+ return rootRef;
40
+ }
@@ -0,0 +1,19 @@
1
+ /// <reference types="react" />
2
+ /// <reference types="lodash" />
3
+ import type { CheckResult } from 'schema-typed';
4
+ import { FormInstance } from './useFormRef';
5
+ export interface FormErrorProps {
6
+ ref: React.Ref<FormInstance>;
7
+ formValue: any;
8
+ getCombinedModel: () => any;
9
+ onCheck?: (formError: any) => void;
10
+ onError?: (formError: any) => void;
11
+ nestedField?: boolean;
12
+ }
13
+ export default function useFormValidate(formError: any, props: FormErrorProps): {
14
+ formRef: import("react").RefObject<HTMLFormElement>;
15
+ formError: any;
16
+ check: (...args: any[]) => any;
17
+ setFieldError: (fieldName: string, checkResult: string | CheckResult) => any;
18
+ onRemoveError: (name: string) => import("lodash").Omit<any, string>;
19
+ };