x-ui-design 0.3.76 → 0.3.78
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/dist/index.esm.js +17 -7
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +17 -7
- package/dist/index.js.map +1 -1
- package/lib/components/Form/Form.tsx +6 -7
- package/lib/hooks/useForm.ts +15 -3
- package/package.json +1 -1
- package/src/app/page.tsx +120 -0
package/dist/index.js
CHANGED
|
@@ -609,6 +609,7 @@ const useForm = (initialValues = {}, onFieldsChange, onValuesChange, scrollToFir
|
|
|
609
609
|
...initialValues
|
|
610
610
|
});
|
|
611
611
|
const fieldInstancesRef = React$1.useRef({});
|
|
612
|
+
const [isSubmit, setIsSubmit] = React$1.useState(false);
|
|
612
613
|
const [isReseting, setIsReseting] = React$1.useState(false);
|
|
613
614
|
const [errors, setErrors] = React$1.useState({});
|
|
614
615
|
const fieldSubscribers = React$1.useRef({});
|
|
@@ -740,10 +741,16 @@ const useForm = (initialValues = {}, onFieldsChange, onValuesChange, scrollToFir
|
|
|
740
741
|
[name]: fieldErrors
|
|
741
742
|
}));
|
|
742
743
|
warningsRef.current[name] = fieldWarnings;
|
|
743
|
-
|
|
744
|
+
console.log({
|
|
745
|
+
isSubmit,
|
|
746
|
+
_scrollToFirstError: _scrollToFirstError.current
|
|
747
|
+
});
|
|
748
|
+
if (isSubmit || _scrollToFirstError.current) {
|
|
744
749
|
const firstErrorContent = document.querySelectorAll('.xUi-form-item-error')?.[0];
|
|
745
750
|
if (firstErrorContent) {
|
|
746
|
-
firstErrorContent.closest('.xUi-form-item')?.scrollIntoView();
|
|
751
|
+
firstErrorContent.closest('.xUi-form-item')?.closest('[data-item="first-content"]')?.scrollIntoView();
|
|
752
|
+
setIsSubmit(false);
|
|
753
|
+
setScrollToFirstError(false);
|
|
747
754
|
}
|
|
748
755
|
}
|
|
749
756
|
return fieldErrors.length === 0;
|
|
@@ -776,6 +783,7 @@ const useForm = (initialValues = {}, onFieldsChange, onValuesChange, scrollToFir
|
|
|
776
783
|
setIsReseting(prev => !prev);
|
|
777
784
|
}
|
|
778
785
|
async function submit() {
|
|
786
|
+
setIsSubmit(true);
|
|
779
787
|
return (await validateFields()) ? formRef.current : undefined;
|
|
780
788
|
}
|
|
781
789
|
function subscribeToField(name, callback) {
|
|
@@ -1108,12 +1116,12 @@ const Form$1 = ({
|
|
|
1108
1116
|
scrollToFirstError = false,
|
|
1109
1117
|
...rest
|
|
1110
1118
|
}) => {
|
|
1111
|
-
const internalForm = useForm(initialValues, onFieldsChange, onValuesChange
|
|
1119
|
+
const internalForm = useForm(initialValues, onFieldsChange, onValuesChange);
|
|
1112
1120
|
const formInstance = form || internalForm;
|
|
1113
|
-
formInstance.setScrollToFirstError(scrollToFirstError);
|
|
1114
1121
|
const formRef = React$1.useRef(null);
|
|
1115
1122
|
const handleSubmit = async e => {
|
|
1116
1123
|
e.preventDefault();
|
|
1124
|
+
formInstance.setScrollToFirstError(scrollToFirstError);
|
|
1117
1125
|
if (await formInstance.validateFields()) {
|
|
1118
1126
|
onFinish?.(formInstance.getFieldsValue());
|
|
1119
1127
|
} else if (onFinishFailed) {
|
|
@@ -1133,14 +1141,16 @@ const Form$1 = ({
|
|
|
1133
1141
|
formInstance.onValuesChange = onValuesChange;
|
|
1134
1142
|
}
|
|
1135
1143
|
}, [formInstance, onFieldsChange, onValuesChange]);
|
|
1136
|
-
const injectPropsIntoFinalLeaf = child => {
|
|
1144
|
+
const injectPropsIntoFinalLeaf = (child, key) => {
|
|
1137
1145
|
if (! /*#__PURE__*/React$1.isValidElement(child)) {
|
|
1138
1146
|
return child;
|
|
1139
1147
|
}
|
|
1140
1148
|
const childProps = child.props;
|
|
1141
1149
|
const isWrapper = typeof child.type === 'string' && !('dangerouslySetInnerHTML' in childProps) && ['div', 'span', 'label'].includes(child.type);
|
|
1142
1150
|
if (isWrapper) {
|
|
1143
|
-
return /*#__PURE__*/React$1.createElement(child.type,
|
|
1151
|
+
return /*#__PURE__*/React$1.createElement(child.type, _extends({}, childProps, {
|
|
1152
|
+
"data-item": key == 0 ? 'first-content' : ''
|
|
1153
|
+
}), React$1.Children.map(flattenChildren(childProps.children), injectPropsIntoFinalLeaf));
|
|
1144
1154
|
}
|
|
1145
1155
|
if (childProps?.__injected) {
|
|
1146
1156
|
return child;
|
|
@@ -1158,7 +1168,7 @@ const Form$1 = ({
|
|
|
1158
1168
|
ref: formRef,
|
|
1159
1169
|
onSubmit: handleSubmit,
|
|
1160
1170
|
className: `${prefixCls} ${className}`
|
|
1161
|
-
}, React$1.Children.map(childrenList, child => injectPropsIntoFinalLeaf(child))));
|
|
1171
|
+
}, React$1.Children.map(childrenList, (child, key) => injectPropsIntoFinalLeaf(child, key))));
|
|
1162
1172
|
};
|
|
1163
1173
|
Form$1.Item = FormItem$1;
|
|
1164
1174
|
|