@connect-soft/form-generator 1.0.0-alpha → 1.1.0-alpha10
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/README.md +1102 -28
- package/dist/index.js +1184 -391
- package/dist/index.js.map +1 -1
- package/dist/{index.m.js → index.mjs} +1163 -389
- package/dist/index.mjs.map +1 -0
- package/dist/types/components/form/array-field-renderer.d.ts +39 -0
- package/dist/types/components/form/array-field-renderer.d.ts.map +1 -0
- package/dist/types/components/form/create-template-fields.d.ts +3 -0
- package/dist/types/components/form/create-template-fields.d.ts.map +1 -0
- package/dist/types/components/form/field-renderer.d.ts +1 -6
- package/dist/types/components/form/field-renderer.d.ts.map +1 -1
- package/dist/types/components/form/fields-context.d.ts +26 -0
- package/dist/types/components/form/fields-context.d.ts.map +1 -0
- package/dist/types/components/form/form-generator-typed.d.ts +47 -0
- package/dist/types/components/form/form-generator-typed.d.ts.map +1 -0
- package/dist/types/components/form/form-generator.d.ts +43 -6
- package/dist/types/components/form/form-generator.d.ts.map +1 -1
- package/dist/types/components/form/form-utils.d.ts +47 -0
- package/dist/types/components/form/form-utils.d.ts.map +1 -0
- package/dist/types/components/form/index.d.ts +5 -3
- package/dist/types/components/form/index.d.ts.map +1 -1
- package/dist/types/index.d.ts +13 -6
- package/dist/types/index.d.ts.map +1 -1
- package/dist/types/lib/field-registry.d.ts +19 -59
- package/dist/types/lib/field-registry.d.ts.map +1 -1
- package/dist/types/lib/field-types.d.ts +127 -26
- package/dist/types/lib/field-types.d.ts.map +1 -1
- package/dist/types/lib/index.d.ts +3 -4
- package/dist/types/lib/index.d.ts.map +1 -1
- package/dist/types/lib/template-types.d.ts +55 -0
- package/dist/types/lib/template-types.d.ts.map +1 -0
- package/package.json +11 -25
- package/MIGRATION.md +0 -503
- package/dist/index.m.js.map +0 -1
- package/dist/styles/globals.css +0 -2
package/dist/index.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var compilerRuntime = require('react/compiler-runtime');
|
|
4
3
|
var jsxRuntime = require('react/jsx-runtime');
|
|
5
4
|
var React = require('react');
|
|
6
5
|
var n$1 = require('zod/v4/core');
|
|
6
|
+
var compilerRuntime = require('react/compiler-runtime');
|
|
7
7
|
var zod = require('zod');
|
|
8
8
|
|
|
9
9
|
function _interopNamespaceDefault(e) {
|
|
@@ -2792,52 +2792,56 @@ const r=(t,r,o)=>{if(t&&"reportValidity"in t){const s=get(o,r);t.setCustomValidi
|
|
|
2792
2792
|
|
|
2793
2793
|
function t(r,e){try{var o=r();}catch(r){return e(r)}return o&&o.then?o.then(void 0,e):o}function s(r,e){for(var n={};r.length;){var t=r[0],s=t.code,i=t.message,a=t.path.join(".");if(!n[a])if("unionErrors"in t){var u=t.unionErrors[0].errors[0];n[a]={message:u.message,type:u.code};}else n[a]={message:i,type:s};if("unionErrors"in t&&t.unionErrors.forEach(function(e){return e.errors.forEach(function(e){return r.push(e)})}),e){var c=n[a].types,f=c&&c[t.code];n[a]=appendErrors(a,e,n,s,f?[].concat(f,t.message):t.message);}r.shift();}return n}function i(r,e){for(var n={};r.length;){var t=r[0],s=t.code,i=t.message,a=t.path.join(".");if(!n[a])if("invalid_union"===t.code&&t.errors.length>0){var u=t.errors[0][0];n[a]={message:u.message,type:u.code};}else n[a]={message:i,type:s};if("invalid_union"===t.code&&t.errors.forEach(function(e){return e.forEach(function(e){return r.push(e)})}),e){var c=n[a].types,f=c&&c[t.code];n[a]=appendErrors(a,e,n,s,f?[].concat(f,t.message):t.message);}r.shift();}return n}function a(o$1,a,u){if(void 0===u&&(u={}),function(r){return "_def"in r&&"object"==typeof r._def&&"typeName"in r._def}(o$1))return function(n,i,c){try{return Promise.resolve(t(function(){return Promise.resolve(o$1["sync"===u.mode?"parse":"parseAsync"](n,a)).then(function(e){return c.shouldUseNativeValidation&&o({},c),{errors:{},values:u.raw?Object.assign({},n):e}})},function(r){if(function(r){return Array.isArray(null==r?void 0:r.issues)}(r))return {values:{},errors:s$1(s(r.errors,!c.shouldUseNativeValidation&&"all"===c.criteriaMode),c)};throw r}))}catch(r){return Promise.reject(r)}};if(function(r){return "_zod"in r&&"object"==typeof r._zod}(o$1))return function(s,c,f){try{return Promise.resolve(t(function(){return Promise.resolve(("sync"===u.mode?n__namespace.parse:n__namespace.parseAsync)(o$1,s,a)).then(function(e){return f.shouldUseNativeValidation&&o({},f),{errors:{},values:u.raw?Object.assign({},s):e}})},function(r){if(function(r){return r instanceof n__namespace.$ZodError}(r))return {values:{},errors:s$1(i(r.issues,!f.shouldUseNativeValidation&&"all"===f.criteriaMode),f)};throw r}))}catch(r){return Promise.reject(r)}};throw new Error("Invalid input: not a Zod schema")}
|
|
2794
2794
|
|
|
2795
|
-
function
|
|
2796
|
-
return
|
|
2795
|
+
function isArrayField(field) {
|
|
2796
|
+
return field.type === 'array' && 'fields' in field;
|
|
2797
|
+
}
|
|
2798
|
+
function createField(field) {
|
|
2799
|
+
return field;
|
|
2800
|
+
}
|
|
2801
|
+
function createArrayField(field) {
|
|
2802
|
+
return {
|
|
2803
|
+
...field,
|
|
2804
|
+
type: 'array'
|
|
2805
|
+
};
|
|
2806
|
+
}
|
|
2807
|
+
function strictFields(fields) {
|
|
2808
|
+
return fields;
|
|
2809
|
+
}
|
|
2810
|
+
function validateFieldType(type, registeredTypes) {
|
|
2811
|
+
if (!registeredTypes.includes(type) && type !== 'array') {
|
|
2812
|
+
throw new Error(`Unregistered field type: "${type}". ` + `Registered types: ${registeredTypes.join(', ')}. ` + `Use registerField("${type}", YourComponent) to register it.`);
|
|
2813
|
+
}
|
|
2814
|
+
return type;
|
|
2815
|
+
}
|
|
2816
|
+
function validateFieldTypes(fields, registeredTypes, options = {}) {
|
|
2817
|
+
const {
|
|
2818
|
+
throwOnError = false,
|
|
2819
|
+
warn = true
|
|
2820
|
+
} = options;
|
|
2821
|
+
const invalidTypes = [];
|
|
2822
|
+
const checkField = field => {
|
|
2823
|
+
if (field.type === 'array' && 'fields' in field) {
|
|
2824
|
+
field.fields.forEach(checkField);
|
|
2825
|
+
} else if (!registeredTypes.includes(field.type) && field.type !== 'array') {
|
|
2826
|
+
invalidTypes.push(field.type);
|
|
2827
|
+
}
|
|
2828
|
+
};
|
|
2829
|
+
fields.forEach(checkField);
|
|
2830
|
+
if (invalidTypes.length > 0) {
|
|
2831
|
+
const uniqueInvalid = [...new Set(invalidTypes)];
|
|
2832
|
+
const message = `Unregistered field type(s): ${uniqueInvalid.map(t => `"${t}"`).join(', ')}. ` + `Registered types: ${registeredTypes.join(', ')}. ` + 'Register custom types with registerField() or use module augmentation for TypeScript support.';
|
|
2833
|
+
if (throwOnError) {
|
|
2834
|
+
throw new Error(message);
|
|
2835
|
+
} else if (warn && typeof console !== 'undefined') {
|
|
2836
|
+
console.warn(`[FormGenerator] ${message}`);
|
|
2837
|
+
}
|
|
2838
|
+
}
|
|
2839
|
+
return fields;
|
|
2797
2840
|
}
|
|
2798
2841
|
|
|
2799
2842
|
const fieldRegistry = new Map();
|
|
2800
2843
|
const componentRegistry = {};
|
|
2801
|
-
const layoutRegistry = {};
|
|
2802
2844
|
const defaultFormComponents = {
|
|
2803
|
-
FormItem: ({
|
|
2804
|
-
className,
|
|
2805
|
-
children
|
|
2806
|
-
}) => /*#__PURE__*/React.createElement('div', {
|
|
2807
|
-
className: className !== null && className !== void 0 ? className : 'form-item'
|
|
2808
|
-
}, children),
|
|
2809
|
-
FormInputLabelWrapper: ({
|
|
2810
|
-
className,
|
|
2811
|
-
orientation,
|
|
2812
|
-
children
|
|
2813
|
-
}) => /*#__PURE__*/React.createElement('div', {
|
|
2814
|
-
'className': className !== null && className !== void 0 ? className : 'form-input-label-wrapper',
|
|
2815
|
-
'data-orientation': orientation !== null && orientation !== void 0 ? orientation : 'vertical'
|
|
2816
|
-
}, children),
|
|
2817
|
-
FormLabel: ({
|
|
2818
|
-
className,
|
|
2819
|
-
children,
|
|
2820
|
-
required,
|
|
2821
|
-
htmlFor
|
|
2822
|
-
}) => /*#__PURE__*/React.createElement('label', {
|
|
2823
|
-
className: className !== null && className !== void 0 ? className : 'form-label',
|
|
2824
|
-
htmlFor
|
|
2825
|
-
}, children, required && /*#__PURE__*/React.createElement('span', {
|
|
2826
|
-
className: 'required-indicator'
|
|
2827
|
-
}, ' *')),
|
|
2828
|
-
FormDescription: ({
|
|
2829
|
-
className,
|
|
2830
|
-
children
|
|
2831
|
-
}) => /*#__PURE__*/React.createElement('p', {
|
|
2832
|
-
className: className !== null && className !== void 0 ? className : 'form-description'
|
|
2833
|
-
}, children),
|
|
2834
|
-
FormMessage: ({
|
|
2835
|
-
className,
|
|
2836
|
-
name
|
|
2837
|
-
}) => /*#__PURE__*/React.createElement('p', {
|
|
2838
|
-
'className': className !== null && className !== void 0 ? className : 'form-message',
|
|
2839
|
-
'data-field': name
|
|
2840
|
-
}),
|
|
2841
2845
|
SubmitButton: ({
|
|
2842
2846
|
className,
|
|
2843
2847
|
children,
|
|
@@ -2847,7 +2851,13 @@ const defaultFormComponents = {
|
|
|
2847
2851
|
type: 'submit',
|
|
2848
2852
|
className: className !== null && className !== void 0 ? className : 'form-submit',
|
|
2849
2853
|
disabled: disabled || isSubmitting
|
|
2850
|
-
}, isSubmitting ? 'Submitting...' : children)
|
|
2854
|
+
}, isSubmitting ? 'Submitting...' : children),
|
|
2855
|
+
FieldWrapper: ({
|
|
2856
|
+
children
|
|
2857
|
+
}) => /*#__PURE__*/React.createElement(React.Fragment, null, children),
|
|
2858
|
+
FieldsWrapper: ({
|
|
2859
|
+
children
|
|
2860
|
+
}) => /*#__PURE__*/React.createElement(React.Fragment, null, children)
|
|
2851
2861
|
};
|
|
2852
2862
|
const htmlInputTypes = {
|
|
2853
2863
|
text: 'text',
|
|
@@ -2990,27 +3000,15 @@ function createDefaultFieldComponent(type) {
|
|
|
2990
3000
|
};
|
|
2991
3001
|
return FallbackComponent;
|
|
2992
3002
|
}
|
|
2993
|
-
function registerField(type, component, options = {}
|
|
2994
|
-
const {
|
|
2995
|
-
override = true
|
|
2996
|
-
} = config;
|
|
2997
|
-
const exists = fieldRegistry.has(type);
|
|
2998
|
-
if (override === 'only' && !exists) return;
|
|
2999
|
-
if (override === false && exists) return;
|
|
3003
|
+
function registerField(type, component, options = {}) {
|
|
3000
3004
|
fieldRegistry.set(type, {
|
|
3001
3005
|
component,
|
|
3002
3006
|
options
|
|
3003
3007
|
});
|
|
3004
3008
|
}
|
|
3005
|
-
function registerFields(fields
|
|
3006
|
-
const {
|
|
3007
|
-
override = true
|
|
3008
|
-
} = config;
|
|
3009
|
+
function registerFields(fields) {
|
|
3009
3010
|
Object.entries(fields).forEach(([type, definition]) => {
|
|
3010
3011
|
var _a;
|
|
3011
|
-
const exists = fieldRegistry.has(type);
|
|
3012
|
-
if (override === 'only' && !exists) return;
|
|
3013
|
-
if (override === false && exists) return;
|
|
3014
3012
|
if (typeof definition === 'function') {
|
|
3015
3013
|
fieldRegistry.set(type, {
|
|
3016
3014
|
component: definition,
|
|
@@ -3032,10 +3030,6 @@ function getFieldComponent(type) {
|
|
|
3032
3030
|
}
|
|
3033
3031
|
return createDefaultFieldComponent(type);
|
|
3034
3032
|
}
|
|
3035
|
-
function getFieldOptions(type) {
|
|
3036
|
-
var _a;
|
|
3037
|
-
return (_a = fieldRegistry.get(type)) === null || _a === void 0 ? void 0 : _a.options;
|
|
3038
|
-
}
|
|
3039
3033
|
function getFieldValidator(type) {
|
|
3040
3034
|
var _a;
|
|
3041
3035
|
return (_a = fieldRegistry.get(type)) === null || _a === void 0 ? void 0 : _a.options.validator;
|
|
@@ -3049,24 +3043,12 @@ function unregisterField(type) {
|
|
|
3049
3043
|
function getRegisteredFieldTypes() {
|
|
3050
3044
|
return Array.from(fieldRegistry.keys());
|
|
3051
3045
|
}
|
|
3052
|
-
function registerFormComponents(components
|
|
3053
|
-
const {
|
|
3054
|
-
override = true
|
|
3055
|
-
} = config;
|
|
3046
|
+
function registerFormComponents(components) {
|
|
3056
3047
|
Object.keys(components).forEach(key => {
|
|
3057
|
-
const exists = key in componentRegistry;
|
|
3058
|
-
if (override === 'only' && !exists) return;
|
|
3059
|
-
if (override === false && exists) return;
|
|
3060
3048
|
componentRegistry[key] = components[key];
|
|
3061
3049
|
});
|
|
3062
3050
|
}
|
|
3063
|
-
function registerFormComponent(name, component
|
|
3064
|
-
const {
|
|
3065
|
-
override = true
|
|
3066
|
-
} = config;
|
|
3067
|
-
const exists = name in componentRegistry;
|
|
3068
|
-
if (override === 'only' && !exists) return;
|
|
3069
|
-
if (override === false && exists) return;
|
|
3051
|
+
function registerFormComponent(name, component) {
|
|
3070
3052
|
componentRegistry[name] = component;
|
|
3071
3053
|
}
|
|
3072
3054
|
function getFormComponent(name) {
|
|
@@ -3081,37 +3063,6 @@ function getFormComponents() {
|
|
|
3081
3063
|
...componentRegistry
|
|
3082
3064
|
};
|
|
3083
3065
|
}
|
|
3084
|
-
function registerLayoutComponents(components, config = {}) {
|
|
3085
|
-
const {
|
|
3086
|
-
override = true
|
|
3087
|
-
} = config;
|
|
3088
|
-
Object.keys(components).forEach(key => {
|
|
3089
|
-
const exists = key in layoutRegistry;
|
|
3090
|
-
if (override === 'only' && !exists) return;
|
|
3091
|
-
if (override === false && exists) return;
|
|
3092
|
-
layoutRegistry[key] = components[key];
|
|
3093
|
-
});
|
|
3094
|
-
}
|
|
3095
|
-
function registerLayoutComponent(name, component, config = {}) {
|
|
3096
|
-
const {
|
|
3097
|
-
override = true
|
|
3098
|
-
} = config;
|
|
3099
|
-
const exists = name in layoutRegistry;
|
|
3100
|
-
if (override === 'only' && !exists) return;
|
|
3101
|
-
if (override === false && exists) return;
|
|
3102
|
-
layoutRegistry[name] = component;
|
|
3103
|
-
}
|
|
3104
|
-
function getLayoutComponent(name) {
|
|
3105
|
-
return layoutRegistry[name];
|
|
3106
|
-
}
|
|
3107
|
-
function hasLayoutComponent(name) {
|
|
3108
|
-
return name in layoutRegistry;
|
|
3109
|
-
}
|
|
3110
|
-
function clearLayoutRegistry() {
|
|
3111
|
-
Object.keys(layoutRegistry).forEach(key => {
|
|
3112
|
-
delete layoutRegistry[key];
|
|
3113
|
-
});
|
|
3114
|
-
}
|
|
3115
3066
|
function clearFieldRegistry() {
|
|
3116
3067
|
fieldRegistry.clear();
|
|
3117
3068
|
}
|
|
@@ -3127,7 +3078,6 @@ function resetFormComponentRegistry() {
|
|
|
3127
3078
|
function clearAllRegistries() {
|
|
3128
3079
|
clearFieldRegistry();
|
|
3129
3080
|
clearFormComponentRegistry();
|
|
3130
|
-
clearLayoutRegistry();
|
|
3131
3081
|
}
|
|
3132
3082
|
|
|
3133
3083
|
const FieldRenderer = /*#__PURE__*/React.memo(t0 => {
|
|
@@ -3140,6 +3090,10 @@ const FieldRenderer = /*#__PURE__*/React.memo(t0 => {
|
|
|
3140
3090
|
if (field.hidden) {
|
|
3141
3091
|
return null;
|
|
3142
3092
|
}
|
|
3093
|
+
if (!field.name) {
|
|
3094
|
+
console.error(`Field is missing required "name" property. Field type: "${field.type}". ` + "Every field must have a unique name for form state management.");
|
|
3095
|
+
return null;
|
|
3096
|
+
}
|
|
3143
3097
|
let t1;
|
|
3144
3098
|
let t2;
|
|
3145
3099
|
if ($[0] !== field || $[1] !== form || $[2] !== namePrefix) {
|
|
@@ -3151,18 +3105,6 @@ const FieldRenderer = /*#__PURE__*/React.memo(t0 => {
|
|
|
3151
3105
|
t2 = null;
|
|
3152
3106
|
break bb0;
|
|
3153
3107
|
}
|
|
3154
|
-
const FormItemComponent = getFormComponent("FormItem");
|
|
3155
|
-
const FormLabelComponent = getFormComponent("FormLabel");
|
|
3156
|
-
const FormInputLabelWrapper = getFormComponent("FormInputLabelWrapper");
|
|
3157
|
-
const FormDescriptionComponent = getFormComponent("FormDescription");
|
|
3158
|
-
const FormMessageComponent = getFormComponent("FormMessage");
|
|
3159
|
-
if (!FormItemComponent) {
|
|
3160
|
-
console.warn("FormItem component not registered. Use registerFormComponent(\"FormItem\", Component) to register one.");
|
|
3161
|
-
t2 = null;
|
|
3162
|
-
break bb0;
|
|
3163
|
-
}
|
|
3164
|
-
const fieldOptions = getFieldOptions(field.type);
|
|
3165
|
-
const itemClassName = [`form-field-${field.type}`, fieldOptions === null || fieldOptions === void 0 ? void 0 : fieldOptions.className, field.className].filter(Boolean).join(" ");
|
|
3166
3108
|
const fieldName = namePrefix ? `${namePrefix}.${field.name}` : field.name;
|
|
3167
3109
|
t1 = jsxRuntime.jsx(Controller, {
|
|
3168
3110
|
control: form.control,
|
|
@@ -3172,36 +3114,18 @@ const FieldRenderer = /*#__PURE__*/React.memo(t0 => {
|
|
|
3172
3114
|
field: formField,
|
|
3173
3115
|
fieldState
|
|
3174
3116
|
} = t3;
|
|
3175
|
-
return jsxRuntime.
|
|
3176
|
-
|
|
3177
|
-
|
|
3178
|
-
orientation: fieldOptions === null || fieldOptions === void 0 ? void 0 : fieldOptions.inputLabelWrapperOrientation,
|
|
3179
|
-
className: fieldOptions === null || fieldOptions === void 0 ? void 0 : fieldOptions.inputLabelWrapper,
|
|
3180
|
-
children: [field.label && FormLabelComponent && jsxRuntime.jsx(FormLabelComponent, {
|
|
3181
|
-
className: fieldOptions === null || fieldOptions === void 0 ? void 0 : fieldOptions.labelClassName,
|
|
3182
|
-
required: field.required,
|
|
3183
|
-
htmlFor: fieldName,
|
|
3184
|
-
children: field.label
|
|
3185
|
-
}), jsxRuntime.jsx(FieldComponent, {
|
|
3186
|
-
field: {
|
|
3187
|
-
...field,
|
|
3188
|
-
name: fieldName
|
|
3189
|
-
},
|
|
3190
|
-
formField,
|
|
3191
|
-
fieldState: {
|
|
3192
|
-
invalid: fieldState.invalid,
|
|
3193
|
-
error: fieldState.error,
|
|
3194
|
-
isDirty: fieldState.isDirty,
|
|
3195
|
-
isTouched: fieldState.isTouched
|
|
3196
|
-
}
|
|
3197
|
-
})]
|
|
3198
|
-
}), field.description && FormDescriptionComponent && jsxRuntime.jsx(FormDescriptionComponent, {
|
|
3199
|
-
className: fieldOptions === null || fieldOptions === void 0 ? void 0 : fieldOptions.descriptionClassName,
|
|
3200
|
-
children: field.description
|
|
3201
|
-
}), FormMessageComponent && jsxRuntime.jsx(FormMessageComponent, {
|
|
3202
|
-
className: fieldOptions === null || fieldOptions === void 0 ? void 0 : fieldOptions.messageClassName,
|
|
3117
|
+
return jsxRuntime.jsx(FieldComponent, {
|
|
3118
|
+
field: {
|
|
3119
|
+
...field,
|
|
3203
3120
|
name: fieldName
|
|
3204
|
-
}
|
|
3121
|
+
},
|
|
3122
|
+
formField,
|
|
3123
|
+
fieldState: {
|
|
3124
|
+
invalid: fieldState.invalid,
|
|
3125
|
+
error: fieldState.error,
|
|
3126
|
+
isDirty: fieldState.isDirty,
|
|
3127
|
+
isTouched: fieldState.isTouched
|
|
3128
|
+
}
|
|
3205
3129
|
});
|
|
3206
3130
|
}
|
|
3207
3131
|
});
|
|
@@ -3221,135 +3145,655 @@ const FieldRenderer = /*#__PURE__*/React.memo(t0 => {
|
|
|
3221
3145
|
return t1;
|
|
3222
3146
|
});
|
|
3223
3147
|
FieldRenderer.displayName = 'FieldRenderer';
|
|
3224
|
-
|
|
3225
|
-
|
|
3148
|
+
|
|
3149
|
+
function useArrayField(field) {
|
|
3226
3150
|
const {
|
|
3227
|
-
|
|
3228
|
-
|
|
3151
|
+
control
|
|
3152
|
+
} = useFormContext();
|
|
3153
|
+
const fieldArray = useFieldArray({
|
|
3154
|
+
control,
|
|
3155
|
+
name: field.name
|
|
3156
|
+
});
|
|
3157
|
+
const {
|
|
3158
|
+
fields: items,
|
|
3159
|
+
append,
|
|
3160
|
+
prepend,
|
|
3161
|
+
remove,
|
|
3162
|
+
move,
|
|
3163
|
+
swap,
|
|
3164
|
+
insert
|
|
3165
|
+
} = fieldArray;
|
|
3166
|
+
const buildEmptyItem = React.useCallback(() => {
|
|
3167
|
+
const item = {};
|
|
3168
|
+
field.fields.forEach(f => {
|
|
3169
|
+
var _a;
|
|
3170
|
+
item[f.name] = (_a = f.defaultValue) !== null && _a !== void 0 ? _a : '';
|
|
3171
|
+
});
|
|
3172
|
+
return item;
|
|
3173
|
+
}, [field.fields]);
|
|
3174
|
+
const handleAppend = React.useCallback(() => {
|
|
3175
|
+
append(buildEmptyItem());
|
|
3176
|
+
}, [append, buildEmptyItem]);
|
|
3177
|
+
const handleAppendWith = React.useCallback(values => {
|
|
3178
|
+
append(values);
|
|
3179
|
+
}, [append]);
|
|
3180
|
+
const handlePrepend = React.useCallback(() => {
|
|
3181
|
+
prepend(buildEmptyItem());
|
|
3182
|
+
}, [prepend, buildEmptyItem]);
|
|
3183
|
+
const handleInsert = React.useCallback((index, values_0) => {
|
|
3184
|
+
insert(index, values_0 !== null && values_0 !== void 0 ? values_0 : buildEmptyItem());
|
|
3185
|
+
}, [insert, buildEmptyItem]);
|
|
3186
|
+
const canAppend = field.maxItems === undefined || items.length < field.maxItems;
|
|
3187
|
+
const canRemove = field.minItems === undefined || items.length > field.minItems;
|
|
3188
|
+
const renderField = React.useCallback((index_0, fieldName) => {
|
|
3189
|
+
const childField = field.fields.find(f_0 => f_0.name === fieldName);
|
|
3190
|
+
if (!childField) {
|
|
3191
|
+
console.warn(`Field "${fieldName}" not found in array field "${field.name}"`);
|
|
3192
|
+
return jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
3193
|
+
}
|
|
3194
|
+
return jsxRuntime.jsx(FieldRenderer, {
|
|
3195
|
+
field: childField,
|
|
3196
|
+
namePrefix: `${field.name}.${index_0}`
|
|
3197
|
+
}, `${field.name}.${index_0}.${fieldName}`);
|
|
3198
|
+
}, [field]);
|
|
3199
|
+
const renderItem = React.useCallback(index_1 => {
|
|
3200
|
+
const result = {};
|
|
3201
|
+
field.fields.forEach(childField_0 => {
|
|
3202
|
+
result[childField_0.name] = jsxRuntime.jsx(FieldRenderer, {
|
|
3203
|
+
field: childField_0,
|
|
3204
|
+
namePrefix: `${field.name}.${index_1}`
|
|
3205
|
+
}, `${field.name}.${index_1}.${childField_0.name}`);
|
|
3206
|
+
});
|
|
3207
|
+
return result;
|
|
3208
|
+
}, [field]);
|
|
3209
|
+
return {
|
|
3210
|
+
fieldArray,
|
|
3211
|
+
append: handleAppend,
|
|
3212
|
+
appendWith: handleAppendWith,
|
|
3213
|
+
prepend: handlePrepend,
|
|
3214
|
+
remove,
|
|
3215
|
+
move,
|
|
3216
|
+
swap,
|
|
3217
|
+
insert: handleInsert,
|
|
3218
|
+
field,
|
|
3219
|
+
items: items.map((item_0, index_2) => ({
|
|
3220
|
+
id: item_0.id,
|
|
3221
|
+
index: index_2
|
|
3222
|
+
})),
|
|
3223
|
+
canAppend,
|
|
3224
|
+
canRemove,
|
|
3225
|
+
renderField,
|
|
3226
|
+
renderItem
|
|
3227
|
+
};
|
|
3228
|
+
}
|
|
3229
|
+
const ArrayFieldRenderer = /*#__PURE__*/React.memo(t0 => {
|
|
3230
|
+
const $ = compilerRuntime.c(28);
|
|
3231
|
+
const {
|
|
3232
|
+
field,
|
|
3233
|
+
children
|
|
3229
3234
|
} = t0;
|
|
3230
|
-
|
|
3231
|
-
|
|
3232
|
-
|
|
3233
|
-
|
|
3234
|
-
|
|
3235
|
-
|
|
3236
|
-
|
|
3237
|
-
|
|
3238
|
-
|
|
3239
|
-
|
|
3240
|
-
|
|
3241
|
-
|
|
3242
|
-
|
|
3243
|
-
|
|
3244
|
-
|
|
3245
|
-
|
|
3246
|
-
|
|
3247
|
-
|
|
3248
|
-
|
|
3249
|
-
|
|
3235
|
+
const {
|
|
3236
|
+
items,
|
|
3237
|
+
append,
|
|
3238
|
+
remove,
|
|
3239
|
+
move,
|
|
3240
|
+
canAppend,
|
|
3241
|
+
renderItem,
|
|
3242
|
+
field: arrayField
|
|
3243
|
+
} = useArrayField(field);
|
|
3244
|
+
if (field.hidden) {
|
|
3245
|
+
return null;
|
|
3246
|
+
}
|
|
3247
|
+
if (!children) {
|
|
3248
|
+
let t1;
|
|
3249
|
+
if ($[0] !== append || $[1] !== canAppend || $[2] !== field.className || $[3] !== field.description || $[4] !== field.label || $[5] !== items || $[6] !== renderItem) {
|
|
3250
|
+
let t2;
|
|
3251
|
+
if ($[8] !== renderItem) {
|
|
3252
|
+
t2 = t3 => {
|
|
3253
|
+
const {
|
|
3254
|
+
id,
|
|
3255
|
+
index
|
|
3256
|
+
} = t3;
|
|
3257
|
+
return jsxRuntime.jsx("div", {
|
|
3258
|
+
"data-array-item-index": index,
|
|
3259
|
+
children: Object.values(renderItem(index))
|
|
3260
|
+
}, id);
|
|
3261
|
+
};
|
|
3262
|
+
$[8] = renderItem;
|
|
3263
|
+
$[9] = t2;
|
|
3250
3264
|
} else {
|
|
3251
|
-
|
|
3265
|
+
t2 = $[9];
|
|
3252
3266
|
}
|
|
3253
|
-
|
|
3254
|
-
|
|
3255
|
-
|
|
3256
|
-
|
|
3267
|
+
t1 = jsxRuntime.jsxs("div", {
|
|
3268
|
+
className: field.className,
|
|
3269
|
+
children: [field.label && jsxRuntime.jsx("label", {
|
|
3270
|
+
children: field.label
|
|
3271
|
+
}), field.description && jsxRuntime.jsx("p", {
|
|
3272
|
+
children: field.description
|
|
3273
|
+
}), items.map(t2), canAppend && jsxRuntime.jsx("button", {
|
|
3274
|
+
type: "button",
|
|
3275
|
+
onClick: append,
|
|
3276
|
+
children: "Add Item"
|
|
3277
|
+
})]
|
|
3257
3278
|
});
|
|
3279
|
+
$[0] = append;
|
|
3280
|
+
$[1] = canAppend;
|
|
3281
|
+
$[2] = field.className;
|
|
3282
|
+
$[3] = field.description;
|
|
3283
|
+
$[4] = field.label;
|
|
3284
|
+
$[5] = items;
|
|
3285
|
+
$[6] = renderItem;
|
|
3286
|
+
$[7] = t1;
|
|
3287
|
+
} else {
|
|
3288
|
+
t1 = $[7];
|
|
3258
3289
|
}
|
|
3259
|
-
|
|
3260
|
-
$[1] = namePrefix;
|
|
3261
|
-
$[2] = t1;
|
|
3262
|
-
$[3] = t2;
|
|
3263
|
-
} else {
|
|
3264
|
-
t1 = $[2];
|
|
3265
|
-
t2 = $[3];
|
|
3290
|
+
return t1;
|
|
3266
3291
|
}
|
|
3267
|
-
|
|
3268
|
-
|
|
3292
|
+
let t1;
|
|
3293
|
+
if ($[10] !== arrayField || $[11] !== children || $[12] !== field.className || $[13] !== field.description || $[14] !== field.label || $[15] !== field.name || $[16] !== items || $[17] !== move || $[18] !== remove || $[19] !== renderItem) {
|
|
3294
|
+
let t2;
|
|
3295
|
+
if ($[21] !== arrayField || $[22] !== children || $[23] !== field.name || $[24] !== move || $[25] !== remove || $[26] !== renderItem) {
|
|
3296
|
+
t2 = t3 => {
|
|
3297
|
+
const {
|
|
3298
|
+
id: id_0,
|
|
3299
|
+
index: index_0
|
|
3300
|
+
} = t3;
|
|
3301
|
+
return children({
|
|
3302
|
+
index: index_0,
|
|
3303
|
+
id: id_0,
|
|
3304
|
+
remove: () => remove(index_0),
|
|
3305
|
+
move: toIndex => move(index_0, toIndex),
|
|
3306
|
+
fields: renderItem(index_0),
|
|
3307
|
+
fieldNames: arrayField.fields.map(_temp),
|
|
3308
|
+
namePrefix: `${field.name}.${index_0}`
|
|
3309
|
+
});
|
|
3310
|
+
};
|
|
3311
|
+
$[21] = arrayField;
|
|
3312
|
+
$[22] = children;
|
|
3313
|
+
$[23] = field.name;
|
|
3314
|
+
$[24] = move;
|
|
3315
|
+
$[25] = remove;
|
|
3316
|
+
$[26] = renderItem;
|
|
3317
|
+
$[27] = t2;
|
|
3318
|
+
} else {
|
|
3319
|
+
t2 = $[27];
|
|
3320
|
+
}
|
|
3321
|
+
t1 = jsxRuntime.jsxs("div", {
|
|
3322
|
+
className: field.className,
|
|
3323
|
+
children: [field.label && jsxRuntime.jsx("label", {
|
|
3324
|
+
children: field.label
|
|
3325
|
+
}), field.description && jsxRuntime.jsx("p", {
|
|
3326
|
+
children: field.description
|
|
3327
|
+
}), items.map(t2)]
|
|
3328
|
+
});
|
|
3329
|
+
$[10] = arrayField;
|
|
3330
|
+
$[11] = children;
|
|
3331
|
+
$[12] = field.className;
|
|
3332
|
+
$[13] = field.description;
|
|
3333
|
+
$[14] = field.label;
|
|
3334
|
+
$[15] = field.name;
|
|
3335
|
+
$[16] = items;
|
|
3336
|
+
$[17] = move;
|
|
3337
|
+
$[18] = remove;
|
|
3338
|
+
$[19] = renderItem;
|
|
3339
|
+
$[20] = t1;
|
|
3340
|
+
} else {
|
|
3341
|
+
t1 = $[20];
|
|
3269
3342
|
}
|
|
3270
3343
|
return t1;
|
|
3271
3344
|
});
|
|
3272
|
-
|
|
3273
|
-
|
|
3274
|
-
|
|
3345
|
+
ArrayFieldRenderer.displayName = 'ArrayFieldRenderer';
|
|
3346
|
+
function _temp(f) {
|
|
3347
|
+
return f.name;
|
|
3348
|
+
}
|
|
3349
|
+
|
|
3350
|
+
const RESERVED_PROPS = new Set(['all', 'remaining', 'names', 'has', 'render']);
|
|
3351
|
+
function createTemplateFields(fieldEntries) {
|
|
3352
|
+
const accessedFields = new Set();
|
|
3353
|
+
const handler = {
|
|
3354
|
+
get(_, prop) {
|
|
3355
|
+
if (typeof prop === 'symbol') {
|
|
3356
|
+
return undefined;
|
|
3357
|
+
}
|
|
3358
|
+
if (prop === 'all') {
|
|
3359
|
+
return Array.from(fieldEntries.values()).map(entry => entry.element);
|
|
3360
|
+
}
|
|
3361
|
+
if (prop === 'remaining') {
|
|
3362
|
+
return Array.from(fieldEntries.entries()).filter(([name]) => !accessedFields.has(name)).map(([, entry]) => entry.element);
|
|
3363
|
+
}
|
|
3364
|
+
if (prop === 'names') {
|
|
3365
|
+
return Array.from(fieldEntries.keys());
|
|
3366
|
+
}
|
|
3367
|
+
if (prop === 'has') {
|
|
3368
|
+
return name => fieldEntries.has(name);
|
|
3369
|
+
}
|
|
3370
|
+
if (prop === 'render') {
|
|
3371
|
+
return (...names) => {
|
|
3372
|
+
return names.filter(name => fieldEntries.has(name)).map(name => {
|
|
3373
|
+
accessedFields.add(name);
|
|
3374
|
+
return fieldEntries.get(name).element;
|
|
3375
|
+
});
|
|
3376
|
+
};
|
|
3377
|
+
}
|
|
3378
|
+
if (fieldEntries.has(prop)) {
|
|
3379
|
+
accessedFields.add(prop);
|
|
3380
|
+
return fieldEntries.get(prop).element;
|
|
3381
|
+
}
|
|
3382
|
+
return undefined;
|
|
3383
|
+
},
|
|
3384
|
+
has(_, prop) {
|
|
3385
|
+
if (typeof prop === 'symbol') {
|
|
3386
|
+
return false;
|
|
3387
|
+
}
|
|
3388
|
+
return RESERVED_PROPS.has(prop) || fieldEntries.has(prop);
|
|
3389
|
+
},
|
|
3390
|
+
ownKeys() {
|
|
3391
|
+
return [...RESERVED_PROPS, ...fieldEntries.keys()];
|
|
3392
|
+
},
|
|
3393
|
+
getOwnPropertyDescriptor(_, prop) {
|
|
3394
|
+
if (typeof prop === 'symbol') {
|
|
3395
|
+
return undefined;
|
|
3396
|
+
}
|
|
3397
|
+
if (RESERVED_PROPS.has(prop) || fieldEntries.has(prop)) {
|
|
3398
|
+
return {
|
|
3399
|
+
configurable: true,
|
|
3400
|
+
enumerable: true,
|
|
3401
|
+
value: this.get(_, prop, {})
|
|
3402
|
+
};
|
|
3403
|
+
}
|
|
3404
|
+
return undefined;
|
|
3405
|
+
}
|
|
3406
|
+
};
|
|
3407
|
+
return new Proxy({}, handler);
|
|
3408
|
+
}
|
|
3409
|
+
|
|
3410
|
+
const FieldsContext = /*#__PURE__*/React.createContext(null);
|
|
3411
|
+
function FieldsProvider(t0) {
|
|
3412
|
+
const $ = compilerRuntime.c(9);
|
|
3275
3413
|
const {
|
|
3276
|
-
|
|
3414
|
+
children,
|
|
3415
|
+
fields,
|
|
3277
3416
|
namePrefix
|
|
3278
3417
|
} = t0;
|
|
3418
|
+
let map;
|
|
3419
|
+
if ($[0] !== fields || $[1] !== namePrefix) {
|
|
3420
|
+
map = new Map();
|
|
3421
|
+
const addFields = (items, prefix) => {
|
|
3422
|
+
items.forEach(item => {
|
|
3423
|
+
if ("fields" in item && Array.isArray(item.fields)) {
|
|
3424
|
+
const arrayPrefix = prefix ? `${prefix}.${item.name}` : item.name;
|
|
3425
|
+
addFields(item.fields, arrayPrefix);
|
|
3426
|
+
} else {
|
|
3427
|
+
const fieldName = prefix ? `${prefix}.${item.name}` : item.name;
|
|
3428
|
+
map.set(fieldName, item);
|
|
3429
|
+
if (prefix) {
|
|
3430
|
+
map.set(item.name, item);
|
|
3431
|
+
}
|
|
3432
|
+
}
|
|
3433
|
+
});
|
|
3434
|
+
};
|
|
3435
|
+
addFields(fields, namePrefix);
|
|
3436
|
+
$[0] = fields;
|
|
3437
|
+
$[1] = namePrefix;
|
|
3438
|
+
$[2] = map;
|
|
3439
|
+
} else {
|
|
3440
|
+
map = $[2];
|
|
3441
|
+
}
|
|
3442
|
+
const fieldsMap = map;
|
|
3279
3443
|
let t1;
|
|
3444
|
+
if ($[3] !== fieldsMap || $[4] !== namePrefix) {
|
|
3445
|
+
t1 = {
|
|
3446
|
+
fields: fieldsMap,
|
|
3447
|
+
namePrefix
|
|
3448
|
+
};
|
|
3449
|
+
$[3] = fieldsMap;
|
|
3450
|
+
$[4] = namePrefix;
|
|
3451
|
+
$[5] = t1;
|
|
3452
|
+
} else {
|
|
3453
|
+
t1 = $[5];
|
|
3454
|
+
}
|
|
3455
|
+
const value = t1;
|
|
3280
3456
|
let t2;
|
|
3281
|
-
if ($[
|
|
3282
|
-
t2 =
|
|
3283
|
-
|
|
3284
|
-
|
|
3285
|
-
|
|
3286
|
-
|
|
3287
|
-
|
|
3288
|
-
|
|
3289
|
-
|
|
3290
|
-
|
|
3291
|
-
|
|
3292
|
-
|
|
3293
|
-
|
|
3294
|
-
|
|
3295
|
-
|
|
3296
|
-
|
|
3297
|
-
|
|
3298
|
-
|
|
3299
|
-
|
|
3300
|
-
|
|
3457
|
+
if ($[6] !== children || $[7] !== value) {
|
|
3458
|
+
t2 = jsxRuntime.jsx(FieldsContext.Provider, {
|
|
3459
|
+
value,
|
|
3460
|
+
children
|
|
3461
|
+
});
|
|
3462
|
+
$[6] = children;
|
|
3463
|
+
$[7] = value;
|
|
3464
|
+
$[8] = t2;
|
|
3465
|
+
} else {
|
|
3466
|
+
t2 = $[8];
|
|
3467
|
+
}
|
|
3468
|
+
return t2;
|
|
3469
|
+
}
|
|
3470
|
+
function useFieldProps(name) {
|
|
3471
|
+
const $ = compilerRuntime.c(23);
|
|
3472
|
+
const context = React.useContext(FieldsContext);
|
|
3473
|
+
const form = useFormContext();
|
|
3474
|
+
if (!context) {
|
|
3475
|
+
throw new Error("useFieldProps must be used within FormGenerator or FieldsProvider");
|
|
3476
|
+
}
|
|
3477
|
+
if (!form) {
|
|
3478
|
+
throw new Error("useFieldProps must be used within a FormProvider context");
|
|
3479
|
+
}
|
|
3480
|
+
const {
|
|
3481
|
+
fields,
|
|
3482
|
+
namePrefix
|
|
3483
|
+
} = context;
|
|
3484
|
+
const fullName = namePrefix ? `${namePrefix}.${name}` : name;
|
|
3485
|
+
let t0;
|
|
3486
|
+
if ($[0] !== fields || $[1] !== fullName || $[2] !== name) {
|
|
3487
|
+
t0 = fields.get(fullName) || fields.get(name);
|
|
3488
|
+
$[0] = fields;
|
|
3489
|
+
$[1] = fullName;
|
|
3490
|
+
$[2] = name;
|
|
3491
|
+
$[3] = t0;
|
|
3492
|
+
} else {
|
|
3493
|
+
t0 = $[3];
|
|
3494
|
+
}
|
|
3495
|
+
const field = t0;
|
|
3496
|
+
if (!field) {
|
|
3497
|
+
throw new Error(`Field "${name}" not found in form fields. ` + `Available fields: ${Array.from(fields.keys()).join(", ")}`);
|
|
3498
|
+
}
|
|
3499
|
+
let t1;
|
|
3500
|
+
if ($[4] !== form.control || $[5] !== fullName) {
|
|
3501
|
+
t1 = {
|
|
3502
|
+
control: form.control,
|
|
3503
|
+
name: fullName
|
|
3504
|
+
};
|
|
3505
|
+
$[4] = form.control;
|
|
3506
|
+
$[5] = fullName;
|
|
3507
|
+
$[6] = t1;
|
|
3508
|
+
} else {
|
|
3509
|
+
t1 = $[6];
|
|
3510
|
+
}
|
|
3511
|
+
const {
|
|
3512
|
+
field: controllerField,
|
|
3513
|
+
fieldState
|
|
3514
|
+
} = useController(t1);
|
|
3515
|
+
let t2;
|
|
3516
|
+
if ($[7] !== field || $[8] !== fullName) {
|
|
3517
|
+
t2 = {
|
|
3518
|
+
...field,
|
|
3519
|
+
name: fullName
|
|
3520
|
+
};
|
|
3521
|
+
$[7] = field;
|
|
3522
|
+
$[8] = fullName;
|
|
3523
|
+
$[9] = t2;
|
|
3524
|
+
} else {
|
|
3525
|
+
t2 = $[9];
|
|
3526
|
+
}
|
|
3527
|
+
let t3;
|
|
3528
|
+
if ($[10] !== fieldState.error || $[11] !== fieldState.invalid || $[12] !== fieldState.isDirty || $[13] !== fieldState.isTouched) {
|
|
3529
|
+
t3 = {
|
|
3530
|
+
invalid: fieldState.invalid,
|
|
3531
|
+
error: fieldState.error,
|
|
3532
|
+
isDirty: fieldState.isDirty,
|
|
3533
|
+
isTouched: fieldState.isTouched
|
|
3534
|
+
};
|
|
3535
|
+
$[10] = fieldState.error;
|
|
3536
|
+
$[11] = fieldState.invalid;
|
|
3537
|
+
$[12] = fieldState.isDirty;
|
|
3538
|
+
$[13] = fieldState.isTouched;
|
|
3539
|
+
$[14] = t3;
|
|
3540
|
+
} else {
|
|
3541
|
+
t3 = $[14];
|
|
3542
|
+
}
|
|
3543
|
+
let t4;
|
|
3544
|
+
if ($[15] !== controllerField.name || $[16] !== controllerField.onBlur || $[17] !== controllerField.onChange || $[18] !== controllerField.ref || $[19] !== controllerField.value || $[20] !== t2 || $[21] !== t3) {
|
|
3545
|
+
t4 = {
|
|
3546
|
+
name: controllerField.name,
|
|
3547
|
+
value: controllerField.value,
|
|
3548
|
+
onChange: controllerField.onChange,
|
|
3549
|
+
onBlur: controllerField.onBlur,
|
|
3550
|
+
ref: controllerField.ref,
|
|
3551
|
+
field: t2,
|
|
3552
|
+
fieldState: t3
|
|
3553
|
+
};
|
|
3554
|
+
$[15] = controllerField.name;
|
|
3555
|
+
$[16] = controllerField.onBlur;
|
|
3556
|
+
$[17] = controllerField.onChange;
|
|
3557
|
+
$[18] = controllerField.ref;
|
|
3558
|
+
$[19] = controllerField.value;
|
|
3559
|
+
$[20] = t2;
|
|
3560
|
+
$[21] = t3;
|
|
3561
|
+
$[22] = t4;
|
|
3562
|
+
} else {
|
|
3563
|
+
t4 = $[22];
|
|
3564
|
+
}
|
|
3565
|
+
return t4;
|
|
3566
|
+
}
|
|
3567
|
+
function useFieldsContext() {
|
|
3568
|
+
return React.useContext(FieldsContext);
|
|
3569
|
+
}
|
|
3570
|
+
|
|
3571
|
+
function isSchemaRequired(schema) {
|
|
3572
|
+
return !schema.isOptional() && !schema.isNullable();
|
|
3573
|
+
}
|
|
3574
|
+
function unwrapSchema(schema) {
|
|
3575
|
+
let current = schema;
|
|
3576
|
+
while (current instanceof zod.z.ZodOptional || current instanceof zod.z.ZodNullable) {
|
|
3577
|
+
current = current.unwrap();
|
|
3578
|
+
}
|
|
3579
|
+
if (current instanceof zod.z.ZodDefault) {
|
|
3580
|
+
current = current._def.innerType;
|
|
3581
|
+
}
|
|
3582
|
+
return current;
|
|
3583
|
+
}
|
|
3584
|
+
function getSchemaTypeName(schema) {
|
|
3585
|
+
const unwrapped = unwrapSchema(schema);
|
|
3586
|
+
if (unwrapped instanceof zod.z.ZodString) return 'string';
|
|
3587
|
+
if (unwrapped instanceof zod.z.ZodNumber) return 'number';
|
|
3588
|
+
if (unwrapped instanceof zod.z.ZodBoolean) return 'boolean';
|
|
3589
|
+
if (unwrapped instanceof zod.z.ZodDate) return 'date';
|
|
3590
|
+
if (unwrapped instanceof zod.z.ZodArray) return 'array';
|
|
3591
|
+
if (unwrapped instanceof zod.z.ZodObject) return 'object';
|
|
3592
|
+
if (unwrapped instanceof zod.z.ZodEnum) return 'enum';
|
|
3593
|
+
return 'unknown';
|
|
3594
|
+
}
|
|
3595
|
+
function getCheckDef(check) {
|
|
3596
|
+
var _a;
|
|
3597
|
+
if ((_a = check._zod) === null || _a === void 0 ? void 0 : _a.def) {
|
|
3598
|
+
const def = check._zod.def;
|
|
3599
|
+
return {
|
|
3600
|
+
type: def.check,
|
|
3601
|
+
value: def.value,
|
|
3602
|
+
minimum: def.minimum,
|
|
3603
|
+
maximum: def.maximum,
|
|
3604
|
+
length: def.length,
|
|
3605
|
+
regex: def.pattern || def.regex,
|
|
3606
|
+
format: def.format,
|
|
3607
|
+
inclusive: def.inclusive
|
|
3608
|
+
};
|
|
3609
|
+
}
|
|
3610
|
+
if (check.kind) {
|
|
3611
|
+
return {
|
|
3612
|
+
type: check.kind,
|
|
3613
|
+
value: check.value,
|
|
3614
|
+
regex: check.regex
|
|
3615
|
+
};
|
|
3616
|
+
}
|
|
3617
|
+
return null;
|
|
3618
|
+
}
|
|
3619
|
+
function getNumberConstraints(schema) {
|
|
3620
|
+
const unwrapped = unwrapSchema(schema);
|
|
3621
|
+
if (!(unwrapped instanceof zod.z.ZodNumber)) {
|
|
3622
|
+
return {};
|
|
3623
|
+
}
|
|
3624
|
+
const constraints = {};
|
|
3625
|
+
const checks = unwrapped._def.checks;
|
|
3626
|
+
if (checks) {
|
|
3627
|
+
for (const check of checks) {
|
|
3628
|
+
const def = getCheckDef(check);
|
|
3629
|
+
if (!def) continue;
|
|
3630
|
+
if (def.type === 'greater_than' || def.type === 'min') {
|
|
3631
|
+
constraints.min = def.value;
|
|
3632
|
+
} else if (def.type === 'less_than' || def.type === 'max') {
|
|
3633
|
+
constraints.max = def.value;
|
|
3634
|
+
} else if (def.type === 'multiple_of' || def.type === 'multipleOf') {
|
|
3635
|
+
constraints.step = def.value;
|
|
3636
|
+
} else if (def.type === 'number_format' && (def.format === 'safeint' || def.format === 'int')) {
|
|
3637
|
+
constraints.step = 1;
|
|
3638
|
+
} else if (def.type === 'int' || def.type === 'integer') {
|
|
3639
|
+
constraints.step = 1;
|
|
3301
3640
|
}
|
|
3302
|
-
const renderItem = t3;
|
|
3303
|
-
t1 = jsxRuntime.jsx(SectionComponent, {
|
|
3304
|
-
layout,
|
|
3305
|
-
renderItem
|
|
3306
|
-
});
|
|
3307
3641
|
}
|
|
3308
|
-
$[0] = layout;
|
|
3309
|
-
$[1] = namePrefix;
|
|
3310
|
-
$[2] = t1;
|
|
3311
|
-
$[3] = t2;
|
|
3312
|
-
} else {
|
|
3313
|
-
t1 = $[2];
|
|
3314
|
-
t2 = $[3];
|
|
3315
3642
|
}
|
|
3316
|
-
|
|
3317
|
-
|
|
3643
|
+
return constraints;
|
|
3644
|
+
}
|
|
3645
|
+
function getStringConstraints(schema) {
|
|
3646
|
+
const unwrapped = unwrapSchema(schema);
|
|
3647
|
+
if (!(unwrapped instanceof zod.z.ZodString)) {
|
|
3648
|
+
return {};
|
|
3318
3649
|
}
|
|
3319
|
-
|
|
3320
|
-
|
|
3321
|
-
|
|
3322
|
-
const
|
|
3323
|
-
|
|
3324
|
-
|
|
3325
|
-
|
|
3326
|
-
|
|
3327
|
-
|
|
3650
|
+
const constraints = {};
|
|
3651
|
+
const checks = unwrapped._def.checks;
|
|
3652
|
+
if (checks) {
|
|
3653
|
+
for (const check of checks) {
|
|
3654
|
+
const def = getCheckDef(check);
|
|
3655
|
+
if (!def) continue;
|
|
3656
|
+
if (def.type === 'min_length' && def.minimum !== undefined) {
|
|
3657
|
+
constraints.minLength = def.minimum;
|
|
3658
|
+
} else if (def.type === 'min' && def.value !== undefined) {
|
|
3659
|
+
constraints.minLength = def.value;
|
|
3660
|
+
} else if (def.type === 'max_length' && def.maximum !== undefined) {
|
|
3661
|
+
constraints.maxLength = def.maximum;
|
|
3662
|
+
} else if (def.type === 'max' && def.value !== undefined) {
|
|
3663
|
+
constraints.maxLength = def.value;
|
|
3664
|
+
} else if (def.type === 'length_equals' && def.length !== undefined) {
|
|
3665
|
+
constraints.minLength = def.length;
|
|
3666
|
+
constraints.maxLength = def.length;
|
|
3667
|
+
} else if (def.type === 'length' && def.value !== undefined) {
|
|
3668
|
+
constraints.minLength = def.value;
|
|
3669
|
+
constraints.maxLength = def.value;
|
|
3670
|
+
} else if (def.type === 'string_format' && def.regex) {
|
|
3671
|
+
constraints.pattern = def.regex.source;
|
|
3672
|
+
} else if (def.type === 'regex' && def.regex) {
|
|
3673
|
+
constraints.pattern = def.regex.source;
|
|
3674
|
+
}
|
|
3675
|
+
}
|
|
3328
3676
|
}
|
|
3329
|
-
|
|
3330
|
-
|
|
3331
|
-
|
|
3332
|
-
|
|
3333
|
-
|
|
3334
|
-
|
|
3335
|
-
|
|
3336
|
-
|
|
3337
|
-
|
|
3338
|
-
|
|
3339
|
-
|
|
3340
|
-
|
|
3341
|
-
|
|
3342
|
-
|
|
3343
|
-
|
|
3677
|
+
return constraints;
|
|
3678
|
+
}
|
|
3679
|
+
function getDateConstraints(schema) {
|
|
3680
|
+
const unwrapped = unwrapSchema(schema);
|
|
3681
|
+
if (!(unwrapped instanceof zod.z.ZodDate)) {
|
|
3682
|
+
return {};
|
|
3683
|
+
}
|
|
3684
|
+
const constraints = {};
|
|
3685
|
+
const checks = unwrapped._def.checks;
|
|
3686
|
+
if (checks) {
|
|
3687
|
+
for (const check of checks) {
|
|
3688
|
+
const def = getCheckDef(check);
|
|
3689
|
+
if (!def) continue;
|
|
3690
|
+
if (def.type === 'greater_than' || def.type === 'min') {
|
|
3691
|
+
const value = def.value;
|
|
3692
|
+
constraints.min = value instanceof Date ? value : new Date(value);
|
|
3693
|
+
} else if (def.type === 'less_than' || def.type === 'max') {
|
|
3694
|
+
const value = def.value;
|
|
3695
|
+
constraints.max = value instanceof Date ? value : new Date(value);
|
|
3696
|
+
}
|
|
3344
3697
|
}
|
|
3345
3698
|
}
|
|
3346
|
-
return
|
|
3347
|
-
|
|
3348
|
-
|
|
3699
|
+
return constraints;
|
|
3700
|
+
}
|
|
3701
|
+
function getSchemaRequirements(schema) {
|
|
3702
|
+
const result = {};
|
|
3703
|
+
const shape = schema.shape;
|
|
3704
|
+
for (const key in shape) {
|
|
3705
|
+
result[key] = isSchemaRequired(shape[key]);
|
|
3706
|
+
}
|
|
3707
|
+
return result;
|
|
3708
|
+
}
|
|
3709
|
+
function analyzeSchema(schema) {
|
|
3710
|
+
const shape = schema.shape;
|
|
3711
|
+
return Object.entries(shape).map(([name, fieldSchema]) => {
|
|
3712
|
+
const type = getSchemaTypeName(fieldSchema);
|
|
3713
|
+
const info = {
|
|
3714
|
+
name,
|
|
3715
|
+
required: isSchemaRequired(fieldSchema),
|
|
3716
|
+
type,
|
|
3717
|
+
schema: fieldSchema
|
|
3718
|
+
};
|
|
3719
|
+
if (type === 'number') {
|
|
3720
|
+
const constraints = getNumberConstraints(fieldSchema);
|
|
3721
|
+
if (constraints.min !== undefined) info.min = constraints.min;
|
|
3722
|
+
if (constraints.max !== undefined) info.max = constraints.max;
|
|
3723
|
+
if (constraints.step !== undefined) info.step = constraints.step;
|
|
3724
|
+
} else if (type === 'string') {
|
|
3725
|
+
const constraints = getStringConstraints(fieldSchema);
|
|
3726
|
+
if (constraints.minLength !== undefined) info.minLength = constraints.minLength;
|
|
3727
|
+
if (constraints.maxLength !== undefined) info.maxLength = constraints.maxLength;
|
|
3728
|
+
if (constraints.pattern !== undefined) info.pattern = constraints.pattern;
|
|
3729
|
+
} else if (type === 'date') {
|
|
3730
|
+
const constraints = getDateConstraints(fieldSchema);
|
|
3731
|
+
if (constraints.min !== undefined) info.minDate = constraints.min;
|
|
3732
|
+
if (constraints.max !== undefined) info.maxDate = constraints.max;
|
|
3733
|
+
}
|
|
3734
|
+
return info;
|
|
3349
3735
|
});
|
|
3350
|
-
}
|
|
3351
|
-
|
|
3352
|
-
|
|
3736
|
+
}
|
|
3737
|
+
function mergeSchemaRequirements(schema, fields) {
|
|
3738
|
+
const requirements = getSchemaRequirements(schema);
|
|
3739
|
+
return fields.map(field => {
|
|
3740
|
+
const schemaRequired = requirements[field.name];
|
|
3741
|
+
if (schemaRequired !== undefined) {
|
|
3742
|
+
return {
|
|
3743
|
+
...field,
|
|
3744
|
+
required: schemaRequired
|
|
3745
|
+
};
|
|
3746
|
+
}
|
|
3747
|
+
return field;
|
|
3748
|
+
});
|
|
3749
|
+
}
|
|
3750
|
+
function mergeSchemaConstraints(schema, fields) {
|
|
3751
|
+
const fieldInfoMap = new Map();
|
|
3752
|
+
analyzeSchema(schema).forEach(info => {
|
|
3753
|
+
fieldInfoMap.set(info.name, info);
|
|
3754
|
+
});
|
|
3755
|
+
return fields.map(field => {
|
|
3756
|
+
const schemaInfo = fieldInfoMap.get(field.name);
|
|
3757
|
+
if (!schemaInfo) {
|
|
3758
|
+
return field;
|
|
3759
|
+
}
|
|
3760
|
+
const merged = {
|
|
3761
|
+
...field,
|
|
3762
|
+
required: schemaInfo.required
|
|
3763
|
+
};
|
|
3764
|
+
if (schemaInfo.type === 'number') {
|
|
3765
|
+
if (schemaInfo.min !== undefined) {
|
|
3766
|
+
merged.min = schemaInfo.min;
|
|
3767
|
+
}
|
|
3768
|
+
if (schemaInfo.max !== undefined) {
|
|
3769
|
+
merged.max = schemaInfo.max;
|
|
3770
|
+
}
|
|
3771
|
+
if (schemaInfo.step !== undefined) {
|
|
3772
|
+
merged.step = schemaInfo.step;
|
|
3773
|
+
}
|
|
3774
|
+
}
|
|
3775
|
+
if (schemaInfo.type === 'string') {
|
|
3776
|
+
if (schemaInfo.minLength !== undefined) {
|
|
3777
|
+
merged.minLength = schemaInfo.minLength;
|
|
3778
|
+
}
|
|
3779
|
+
if (schemaInfo.maxLength !== undefined) {
|
|
3780
|
+
merged.maxLength = schemaInfo.maxLength;
|
|
3781
|
+
}
|
|
3782
|
+
if (schemaInfo.pattern !== undefined) {
|
|
3783
|
+
merged.pattern = schemaInfo.pattern;
|
|
3784
|
+
}
|
|
3785
|
+
}
|
|
3786
|
+
if (schemaInfo.type === 'date') {
|
|
3787
|
+
if (schemaInfo.minDate !== undefined) {
|
|
3788
|
+
merged.min = schemaInfo.minDate.toISOString().split('T')[0];
|
|
3789
|
+
}
|
|
3790
|
+
if (schemaInfo.maxDate !== undefined) {
|
|
3791
|
+
merged.max = schemaInfo.maxDate.toISOString().split('T')[0];
|
|
3792
|
+
}
|
|
3793
|
+
}
|
|
3794
|
+
return merged;
|
|
3795
|
+
});
|
|
3796
|
+
}
|
|
3353
3797
|
function deepMerge(target, source) {
|
|
3354
3798
|
const result = {
|
|
3355
3799
|
...target
|
|
@@ -3375,8 +3819,9 @@ const defaultValidators = {
|
|
|
3375
3819
|
tel: stringValidator,
|
|
3376
3820
|
number: field => {
|
|
3377
3821
|
let schema = zod.z.coerce.number();
|
|
3378
|
-
|
|
3379
|
-
if (
|
|
3822
|
+
const numberField = field;
|
|
3823
|
+
if (numberField.min !== undefined) schema = schema.min(numberField.min);
|
|
3824
|
+
if (numberField.max !== undefined) schema = schema.max(numberField.max);
|
|
3380
3825
|
return schema;
|
|
3381
3826
|
},
|
|
3382
3827
|
checkbox: () => zod.z.coerce.boolean(),
|
|
@@ -3403,205 +3848,553 @@ function getValidatorForField(field) {
|
|
|
3403
3848
|
}
|
|
3404
3849
|
return zod.z.any();
|
|
3405
3850
|
}
|
|
3406
|
-
function
|
|
3851
|
+
function buildArrayItemSchema(arrayField) {
|
|
3852
|
+
const itemShape = {};
|
|
3853
|
+
for (const field of arrayField.fields) {
|
|
3854
|
+
const validator = getValidatorForField(field);
|
|
3855
|
+
itemShape[field.name] = field.required ? validator : validator.optional();
|
|
3856
|
+
}
|
|
3857
|
+
return zod.z.object(itemShape);
|
|
3858
|
+
}
|
|
3859
|
+
function buildSchema(fields) {
|
|
3407
3860
|
const shape = {};
|
|
3408
|
-
for (const
|
|
3409
|
-
if (
|
|
3410
|
-
let
|
|
3411
|
-
if (
|
|
3412
|
-
|
|
3413
|
-
childItems.push(...column.children);
|
|
3414
|
-
}
|
|
3415
|
-
} else if (item.type === 'section') {
|
|
3416
|
-
childItems = item.children;
|
|
3861
|
+
for (const field of fields) {
|
|
3862
|
+
if (isArrayField(field)) {
|
|
3863
|
+
let arraySchema = zod.z.array(buildArrayItemSchema(field));
|
|
3864
|
+
if (field.minItems !== undefined) {
|
|
3865
|
+
arraySchema = arraySchema.min(field.minItems);
|
|
3417
3866
|
}
|
|
3418
|
-
if (
|
|
3419
|
-
|
|
3420
|
-
} else {
|
|
3421
|
-
const childSchema = buildSchema(childItems);
|
|
3422
|
-
if (childSchema instanceof zod.z.ZodObject) {
|
|
3423
|
-
Object.assign(shape, childSchema.shape);
|
|
3424
|
-
}
|
|
3867
|
+
if (field.maxItems !== undefined) {
|
|
3868
|
+
arraySchema = arraySchema.max(field.maxItems);
|
|
3425
3869
|
}
|
|
3870
|
+
shape[field.name] = arraySchema;
|
|
3426
3871
|
} else {
|
|
3427
|
-
const field = item;
|
|
3428
3872
|
const validator = getValidatorForField(field);
|
|
3429
3873
|
shape[field.name] = field.required ? validator : validator.optional();
|
|
3430
3874
|
}
|
|
3431
3875
|
}
|
|
3432
3876
|
return zod.z.object(shape);
|
|
3433
3877
|
}
|
|
3434
|
-
function
|
|
3878
|
+
function buildArrayItemDefaults(arrayField) {
|
|
3879
|
+
var _a;
|
|
3880
|
+
const item = {};
|
|
3881
|
+
for (const field of arrayField.fields) {
|
|
3882
|
+
item[field.name] = (_a = field.defaultValue) !== null && _a !== void 0 ? _a : '';
|
|
3883
|
+
}
|
|
3884
|
+
return item;
|
|
3885
|
+
}
|
|
3886
|
+
function buildDefaultValues(fields) {
|
|
3435
3887
|
var _a;
|
|
3436
3888
|
const values = {};
|
|
3437
|
-
for (const
|
|
3438
|
-
if (
|
|
3439
|
-
|
|
3440
|
-
|
|
3441
|
-
|
|
3442
|
-
|
|
3443
|
-
|
|
3444
|
-
|
|
3445
|
-
childItems = item.children;
|
|
3446
|
-
}
|
|
3447
|
-
if (item.wrapFieldNames && item.name) {
|
|
3448
|
-
values[item.name] = buildDefaultValues(childItems);
|
|
3889
|
+
for (const field of fields) {
|
|
3890
|
+
if (isArrayField(field)) {
|
|
3891
|
+
if (field.defaultValue && field.defaultValue.length > 0) {
|
|
3892
|
+
values[field.name] = field.defaultValue;
|
|
3893
|
+
} else if (field.minItems && field.minItems > 0) {
|
|
3894
|
+
values[field.name] = Array.from({
|
|
3895
|
+
length: field.minItems
|
|
3896
|
+
}, () => buildArrayItemDefaults(field));
|
|
3449
3897
|
} else {
|
|
3450
|
-
|
|
3898
|
+
values[field.name] = [];
|
|
3451
3899
|
}
|
|
3452
3900
|
} else {
|
|
3453
|
-
const field = item;
|
|
3454
3901
|
values[field.name] = (_a = field.defaultValue) !== null && _a !== void 0 ? _a : '';
|
|
3455
3902
|
}
|
|
3456
3903
|
}
|
|
3457
3904
|
return values;
|
|
3458
3905
|
}
|
|
3459
|
-
|
|
3460
|
-
|
|
3461
|
-
return `layout-${item.type}-${index}`;
|
|
3462
|
-
}
|
|
3463
|
-
return item.name;
|
|
3464
|
-
}
|
|
3465
|
-
function FormGenerator(t0) {
|
|
3466
|
-
const $ = compilerRuntime.c(20);
|
|
3906
|
+
|
|
3907
|
+
function FormGenerator(props) {
|
|
3467
3908
|
const {
|
|
3468
3909
|
fields,
|
|
3469
|
-
onSubmit,
|
|
3470
3910
|
defaultValues,
|
|
3471
|
-
schema: userSchema,
|
|
3472
3911
|
className,
|
|
3473
|
-
submitText
|
|
3912
|
+
submitText = 'Submit',
|
|
3474
3913
|
disabled,
|
|
3475
|
-
mode
|
|
3476
|
-
|
|
3477
|
-
|
|
3478
|
-
|
|
3479
|
-
|
|
3480
|
-
|
|
3481
|
-
|
|
3482
|
-
|
|
3483
|
-
|
|
3484
|
-
|
|
3485
|
-
|
|
3486
|
-
|
|
3487
|
-
|
|
3488
|
-
|
|
3489
|
-
|
|
3490
|
-
|
|
3491
|
-
|
|
3914
|
+
mode = 'onChange',
|
|
3915
|
+
title,
|
|
3916
|
+
description,
|
|
3917
|
+
showReset = false,
|
|
3918
|
+
resetText = 'Reset',
|
|
3919
|
+
children,
|
|
3920
|
+
ref,
|
|
3921
|
+
validateTypes
|
|
3922
|
+
} = props;
|
|
3923
|
+
const onSubmit = props.onSubmit;
|
|
3924
|
+
const formRef = React.useRef(null);
|
|
3925
|
+
React.useMemo(() => {
|
|
3926
|
+
if (validateTypes) {
|
|
3927
|
+
const registeredTypes = getRegisteredFieldTypes();
|
|
3928
|
+
const options = typeof validateTypes === 'object' ? validateTypes : {
|
|
3929
|
+
throwOnError: false,
|
|
3930
|
+
warn: true
|
|
3931
|
+
};
|
|
3932
|
+
validateFieldTypes(fields, registeredTypes, options);
|
|
3492
3933
|
}
|
|
3493
|
-
|
|
3494
|
-
|
|
3495
|
-
const
|
|
3496
|
-
let t4;
|
|
3497
|
-
if ($[2] !== defaultValues || $[3] !== fields) {
|
|
3934
|
+
}, [fields, validateTypes]);
|
|
3935
|
+
const schema = React.useMemo(() => buildSchema(fields), [fields]);
|
|
3936
|
+
const mergedDefaultValues = React.useMemo(() => {
|
|
3498
3937
|
const builtDefaults = buildDefaultValues(fields);
|
|
3499
|
-
|
|
3500
|
-
|
|
3501
|
-
|
|
3502
|
-
|
|
3503
|
-
|
|
3504
|
-
|
|
3505
|
-
}
|
|
3506
|
-
const
|
|
3507
|
-
|
|
3508
|
-
|
|
3509
|
-
|
|
3510
|
-
|
|
3511
|
-
|
|
3512
|
-
|
|
3513
|
-
|
|
3514
|
-
|
|
3515
|
-
let t6;
|
|
3516
|
-
if ($[7] !== mergedDefaultValues || $[8] !== mode || $[9] !== t5) {
|
|
3517
|
-
t6 = {
|
|
3518
|
-
resolver: t5,
|
|
3938
|
+
return defaultValues ? deepMerge(builtDefaults, defaultValues) : builtDefaults;
|
|
3939
|
+
}, [fields, defaultValues]);
|
|
3940
|
+
const form = useForm({
|
|
3941
|
+
resolver: a(schema),
|
|
3942
|
+
defaultValues: mergedDefaultValues,
|
|
3943
|
+
mode
|
|
3944
|
+
});
|
|
3945
|
+
const handleSubmit = form.handleSubmit(async data => {
|
|
3946
|
+
const context = {
|
|
3947
|
+
isDirty: form.formState.isDirty,
|
|
3948
|
+
dirtyFields: form.formState.dirtyFields,
|
|
3949
|
+
isValid: form.formState.isValid,
|
|
3950
|
+
errors: form.formState.errors,
|
|
3951
|
+
touchedFields: form.formState.touchedFields,
|
|
3952
|
+
isSubmitting: form.formState.isSubmitting,
|
|
3953
|
+
submitCount: form.formState.submitCount,
|
|
3519
3954
|
defaultValues: mergedDefaultValues,
|
|
3520
|
-
|
|
3955
|
+
form: form
|
|
3521
3956
|
};
|
|
3522
|
-
|
|
3523
|
-
|
|
3524
|
-
|
|
3525
|
-
|
|
3526
|
-
}
|
|
3527
|
-
|
|
3957
|
+
await onSubmit(data, context);
|
|
3958
|
+
});
|
|
3959
|
+
const handleReset = React.useCallback(() => {
|
|
3960
|
+
form.reset(mergedDefaultValues);
|
|
3961
|
+
}, [form, mergedDefaultValues]);
|
|
3962
|
+
React.useImperativeHandle(ref, () => ({
|
|
3963
|
+
setValues: values => {
|
|
3964
|
+
Object.entries(values).forEach(([key, value]) => {
|
|
3965
|
+
form.setValue(key, value, {
|
|
3966
|
+
shouldValidate: true,
|
|
3967
|
+
shouldDirty: true
|
|
3968
|
+
});
|
|
3969
|
+
});
|
|
3970
|
+
},
|
|
3971
|
+
getValues: () => form.getValues(),
|
|
3972
|
+
reset: values_0 => {
|
|
3973
|
+
if (values_0) {
|
|
3974
|
+
form.reset(deepMerge(mergedDefaultValues, values_0));
|
|
3975
|
+
} else {
|
|
3976
|
+
form.reset(mergedDefaultValues);
|
|
3977
|
+
}
|
|
3978
|
+
},
|
|
3979
|
+
submit: async () => {
|
|
3980
|
+
await handleSubmit();
|
|
3981
|
+
},
|
|
3982
|
+
clearErrors: () => form.clearErrors(),
|
|
3983
|
+
setError: (name, error) => form.setError(name, error),
|
|
3984
|
+
isValid: () => form.formState.isValid,
|
|
3985
|
+
isDirty: () => form.formState.isDirty,
|
|
3986
|
+
form: form
|
|
3987
|
+
}), [form, handleSubmit, mergedDefaultValues]);
|
|
3988
|
+
const SubmitButton = getFormComponent('SubmitButton');
|
|
3989
|
+
const FieldWrapper = getFormComponent('FieldWrapper');
|
|
3990
|
+
const FieldsWrapper = getFormComponent('FieldsWrapper');
|
|
3991
|
+
const {
|
|
3992
|
+
regularFields,
|
|
3993
|
+
arrayFields
|
|
3994
|
+
} = React.useMemo(() => {
|
|
3995
|
+
const regular = [];
|
|
3996
|
+
const arrays = [];
|
|
3997
|
+
fields.forEach(field => {
|
|
3998
|
+
if (isArrayField(field)) {
|
|
3999
|
+
arrays.push(field);
|
|
4000
|
+
} else {
|
|
4001
|
+
regular.push(field);
|
|
4002
|
+
}
|
|
4003
|
+
});
|
|
4004
|
+
return {
|
|
4005
|
+
regularFields: regular,
|
|
4006
|
+
arrayFields: arrays
|
|
4007
|
+
};
|
|
4008
|
+
}, [fields]);
|
|
4009
|
+
const fieldEntries = React.useMemo(() => {
|
|
4010
|
+
const entries = new Map();
|
|
4011
|
+
regularFields.forEach((field_0, index) => {
|
|
4012
|
+
if (!field_0.hidden) {
|
|
4013
|
+
const element = jsxRuntime.jsx(FieldWrapper, {
|
|
4014
|
+
name: field_0.name,
|
|
4015
|
+
type: field_0.type,
|
|
4016
|
+
className: field_0.className,
|
|
4017
|
+
children: jsxRuntime.jsx(FieldRenderer, {
|
|
4018
|
+
field: field_0
|
|
4019
|
+
})
|
|
4020
|
+
}, field_0.name || `field-${index}`);
|
|
4021
|
+
entries.set(field_0.name, {
|
|
4022
|
+
field: field_0,
|
|
4023
|
+
element,
|
|
4024
|
+
accessed: false
|
|
4025
|
+
});
|
|
4026
|
+
}
|
|
4027
|
+
});
|
|
4028
|
+
return entries;
|
|
4029
|
+
}, [regularFields, FieldWrapper]);
|
|
4030
|
+
const templateFields = React.useMemo(() => createTemplateFields(fieldEntries), [fieldEntries]);
|
|
4031
|
+
const buttons = React.useMemo(() => {
|
|
4032
|
+
const result = {
|
|
4033
|
+
submit: jsxRuntime.jsx(SubmitButton, {
|
|
4034
|
+
disabled: disabled || form.formState.isSubmitting,
|
|
4035
|
+
isSubmitting: form.formState.isSubmitting,
|
|
4036
|
+
children: submitText
|
|
4037
|
+
}, "submit")
|
|
4038
|
+
};
|
|
4039
|
+
if (showReset) {
|
|
4040
|
+
result.reset = jsxRuntime.jsx("button", {
|
|
4041
|
+
type: "button",
|
|
4042
|
+
onClick: handleReset,
|
|
4043
|
+
disabled: disabled,
|
|
4044
|
+
children: resetText
|
|
4045
|
+
}, "reset");
|
|
4046
|
+
}
|
|
4047
|
+
return result;
|
|
4048
|
+
}, [SubmitButton, disabled, form.formState.isSubmitting, submitText, showReset, resetText, handleReset]);
|
|
4049
|
+
const renderField = React.useCallback((field_1, options_0) => {
|
|
4050
|
+
return jsxRuntime.jsx(FieldRenderer, {
|
|
4051
|
+
field: field_1,
|
|
4052
|
+
namePrefix: options_0 === null || options_0 === void 0 ? void 0 : options_0.namePrefix
|
|
4053
|
+
});
|
|
4054
|
+
}, []);
|
|
4055
|
+
if (!children) {
|
|
4056
|
+
return jsxRuntime.jsx(FormProvider, {
|
|
4057
|
+
...form,
|
|
4058
|
+
children: jsxRuntime.jsx(FieldsProvider, {
|
|
4059
|
+
fields: fields,
|
|
4060
|
+
children: jsxRuntime.jsxs("form", {
|
|
4061
|
+
ref: formRef,
|
|
4062
|
+
onSubmit: handleSubmit,
|
|
4063
|
+
className: className,
|
|
4064
|
+
children: [jsxRuntime.jsxs(FieldsWrapper, {
|
|
4065
|
+
children: [regularFields.map((field_2, index_0) => jsxRuntime.jsx(FieldWrapper, {
|
|
4066
|
+
name: field_2.name,
|
|
4067
|
+
type: field_2.type,
|
|
4068
|
+
className: field_2.className,
|
|
4069
|
+
children: jsxRuntime.jsx(FieldRenderer, {
|
|
4070
|
+
field: field_2
|
|
4071
|
+
})
|
|
4072
|
+
}, field_2.name || `field-${index_0}`)), arrayFields.map(arrayField => jsxRuntime.jsx(FieldWrapper, {
|
|
4073
|
+
name: arrayField.name,
|
|
4074
|
+
type: "array",
|
|
4075
|
+
className: arrayField.className,
|
|
4076
|
+
children: jsxRuntime.jsx(ArrayFieldRenderer, {
|
|
4077
|
+
field: arrayField
|
|
4078
|
+
})
|
|
4079
|
+
}, arrayField.name))]
|
|
4080
|
+
}), jsxRuntime.jsx(SubmitButton, {
|
|
4081
|
+
disabled: disabled || form.formState.isSubmitting,
|
|
4082
|
+
isSubmitting: form.formState.isSubmitting,
|
|
4083
|
+
children: submitText
|
|
4084
|
+
})]
|
|
4085
|
+
})
|
|
4086
|
+
})
|
|
4087
|
+
});
|
|
3528
4088
|
}
|
|
3529
|
-
const
|
|
3530
|
-
|
|
3531
|
-
|
|
3532
|
-
|
|
3533
|
-
|
|
3534
|
-
|
|
3535
|
-
|
|
4089
|
+
const renderProps = {
|
|
4090
|
+
fields: templateFields,
|
|
4091
|
+
arrays: Object.fromEntries(arrayFields.map(arrayField_0 => [arrayField_0.name, {
|
|
4092
|
+
field: arrayField_0
|
|
4093
|
+
}])),
|
|
4094
|
+
buttons,
|
|
4095
|
+
title,
|
|
4096
|
+
description,
|
|
4097
|
+
form: form,
|
|
4098
|
+
isSubmitting: form.formState.isSubmitting,
|
|
4099
|
+
isValid: form.formState.isValid,
|
|
4100
|
+
isDirty: form.formState.isDirty,
|
|
4101
|
+
renderField,
|
|
4102
|
+
FieldWrapper,
|
|
4103
|
+
FieldsWrapper
|
|
4104
|
+
};
|
|
4105
|
+
const renderFn = children;
|
|
4106
|
+
return jsxRuntime.jsx(FormProvider, {
|
|
4107
|
+
...form,
|
|
4108
|
+
children: jsxRuntime.jsx(FieldsProvider, {
|
|
4109
|
+
fields: fields,
|
|
4110
|
+
children: jsxRuntime.jsx("form", {
|
|
4111
|
+
ref: formRef,
|
|
4112
|
+
onSubmit: handleSubmit,
|
|
4113
|
+
className: className,
|
|
4114
|
+
children: renderFn(renderProps)
|
|
4115
|
+
})
|
|
4116
|
+
})
|
|
4117
|
+
});
|
|
4118
|
+
}
|
|
4119
|
+
|
|
4120
|
+
function typedField() {
|
|
4121
|
+
return field => field;
|
|
4122
|
+
}
|
|
4123
|
+
function typedFields(fields) {
|
|
4124
|
+
return fields;
|
|
4125
|
+
}
|
|
4126
|
+
function StrictFormGenerator(props) {
|
|
4127
|
+
const {
|
|
4128
|
+
schema,
|
|
4129
|
+
fields,
|
|
4130
|
+
onSubmit,
|
|
4131
|
+
defaultValues,
|
|
4132
|
+
className,
|
|
4133
|
+
submitText = 'Submit',
|
|
4134
|
+
disabled,
|
|
4135
|
+
mode = 'onChange',
|
|
4136
|
+
title,
|
|
4137
|
+
description,
|
|
4138
|
+
showReset = false,
|
|
4139
|
+
resetText = 'Reset',
|
|
4140
|
+
children,
|
|
4141
|
+
ref,
|
|
4142
|
+
validateTypes
|
|
4143
|
+
} = props;
|
|
4144
|
+
const formRef = React.useRef(null);
|
|
4145
|
+
const fieldsWithRequirements = React.useMemo(() => {
|
|
4146
|
+
if (schema && typeof schema === 'object' && 'shape' in schema) {
|
|
4147
|
+
return mergeSchemaConstraints(schema, fields);
|
|
4148
|
+
}
|
|
4149
|
+
return fields;
|
|
4150
|
+
}, [schema, fields]);
|
|
4151
|
+
React.useMemo(() => {
|
|
4152
|
+
if (validateTypes) {
|
|
4153
|
+
const registeredTypes = getRegisteredFieldTypes();
|
|
4154
|
+
const options = typeof validateTypes === 'object' ? validateTypes : {
|
|
4155
|
+
throwOnError: false,
|
|
4156
|
+
warn: true
|
|
3536
4157
|
};
|
|
3537
|
-
|
|
3538
|
-
$[19] = t8;
|
|
3539
|
-
} else {
|
|
3540
|
-
t8 = $[19];
|
|
4158
|
+
validateFieldTypes(fieldsWithRequirements, registeredTypes, options);
|
|
3541
4159
|
}
|
|
3542
|
-
|
|
3543
|
-
|
|
3544
|
-
|
|
4160
|
+
}, [fieldsWithRequirements, validateTypes]);
|
|
4161
|
+
const mergedDefaultValues = React.useMemo(() => {
|
|
4162
|
+
const builtDefaults = buildDefaultValues(fieldsWithRequirements);
|
|
4163
|
+
return defaultValues ? deepMerge(builtDefaults, defaultValues) : builtDefaults;
|
|
4164
|
+
}, [fieldsWithRequirements, defaultValues]);
|
|
4165
|
+
const form = useForm({
|
|
4166
|
+
resolver: a(schema),
|
|
4167
|
+
defaultValues: mergedDefaultValues,
|
|
4168
|
+
mode
|
|
4169
|
+
});
|
|
4170
|
+
const handleSubmit = form.handleSubmit(async data => {
|
|
4171
|
+
const context = {
|
|
4172
|
+
isDirty: form.formState.isDirty,
|
|
4173
|
+
dirtyFields: form.formState.dirtyFields,
|
|
4174
|
+
isValid: form.formState.isValid,
|
|
4175
|
+
errors: form.formState.errors,
|
|
4176
|
+
touchedFields: form.formState.touchedFields,
|
|
4177
|
+
isSubmitting: form.formState.isSubmitting,
|
|
4178
|
+
submitCount: form.formState.submitCount,
|
|
4179
|
+
defaultValues: mergedDefaultValues,
|
|
4180
|
+
form: form
|
|
4181
|
+
};
|
|
4182
|
+
await onSubmit(data, context);
|
|
4183
|
+
});
|
|
4184
|
+
const handleReset = React.useCallback(() => {
|
|
4185
|
+
form.reset(mergedDefaultValues);
|
|
4186
|
+
}, [form, mergedDefaultValues]);
|
|
4187
|
+
React.useImperativeHandle(ref, () => ({
|
|
4188
|
+
setValues: values => {
|
|
4189
|
+
Object.entries(values).forEach(([key, value]) => {
|
|
4190
|
+
form.setValue(key, value, {
|
|
4191
|
+
shouldValidate: true,
|
|
4192
|
+
shouldDirty: true
|
|
4193
|
+
});
|
|
4194
|
+
});
|
|
4195
|
+
},
|
|
4196
|
+
getValues: () => form.getValues(),
|
|
4197
|
+
reset: values_0 => {
|
|
4198
|
+
if (values_0) {
|
|
4199
|
+
form.reset(deepMerge(mergedDefaultValues, values_0));
|
|
4200
|
+
} else {
|
|
4201
|
+
form.reset(mergedDefaultValues);
|
|
4202
|
+
}
|
|
4203
|
+
},
|
|
4204
|
+
submit: async () => {
|
|
4205
|
+
await handleSubmit();
|
|
4206
|
+
},
|
|
4207
|
+
clearErrors: () => form.clearErrors(),
|
|
4208
|
+
setError: (name, error) => form.setError(name, error),
|
|
4209
|
+
isValid: () => form.formState.isValid,
|
|
4210
|
+
isDirty: () => form.formState.isDirty,
|
|
4211
|
+
form: form
|
|
4212
|
+
}), [form, handleSubmit, mergedDefaultValues]);
|
|
4213
|
+
const SubmitButton = getFormComponent('SubmitButton');
|
|
4214
|
+
const FieldWrapper = getFormComponent('FieldWrapper');
|
|
4215
|
+
const FieldsWrapper = getFormComponent('FieldsWrapper');
|
|
4216
|
+
const {
|
|
4217
|
+
regularFields,
|
|
4218
|
+
arrayFields
|
|
4219
|
+
} = React.useMemo(() => {
|
|
4220
|
+
const regular = [];
|
|
4221
|
+
const arrays = [];
|
|
4222
|
+
fieldsWithRequirements.forEach(field => {
|
|
4223
|
+
if (isArrayField(field)) {
|
|
4224
|
+
arrays.push(field);
|
|
4225
|
+
} else {
|
|
4226
|
+
regular.push(field);
|
|
4227
|
+
}
|
|
4228
|
+
});
|
|
4229
|
+
return {
|
|
4230
|
+
regularFields: regular,
|
|
4231
|
+
arrayFields: arrays
|
|
4232
|
+
};
|
|
4233
|
+
}, [fieldsWithRequirements]);
|
|
4234
|
+
const fieldEntries = React.useMemo(() => {
|
|
4235
|
+
const entries = new Map();
|
|
4236
|
+
regularFields.forEach((field_0, index) => {
|
|
4237
|
+
if (!field_0.hidden) {
|
|
4238
|
+
const element = jsxRuntime.jsx(FieldWrapper, {
|
|
4239
|
+
name: field_0.name,
|
|
4240
|
+
type: field_0.type,
|
|
4241
|
+
className: field_0.className,
|
|
4242
|
+
children: jsxRuntime.jsx(FieldRenderer, {
|
|
4243
|
+
field: field_0
|
|
4244
|
+
})
|
|
4245
|
+
}, field_0.name || `field-${index}`);
|
|
4246
|
+
entries.set(field_0.name, {
|
|
4247
|
+
field: field_0,
|
|
4248
|
+
element,
|
|
4249
|
+
accessed: false
|
|
4250
|
+
});
|
|
4251
|
+
}
|
|
4252
|
+
});
|
|
4253
|
+
return entries;
|
|
4254
|
+
}, [regularFields, FieldWrapper]);
|
|
4255
|
+
const templateFields = React.useMemo(() => createTemplateFields(fieldEntries), [fieldEntries]);
|
|
4256
|
+
const buttons = React.useMemo(() => {
|
|
4257
|
+
const result = {
|
|
4258
|
+
submit: jsxRuntime.jsx(SubmitButton, {
|
|
4259
|
+
disabled: disabled || form.formState.isSubmitting,
|
|
4260
|
+
isSubmitting: form.formState.isSubmitting,
|
|
4261
|
+
children: submitText
|
|
4262
|
+
}, "submit")
|
|
4263
|
+
};
|
|
4264
|
+
if (showReset) {
|
|
4265
|
+
result.reset = jsxRuntime.jsx("button", {
|
|
4266
|
+
type: "button",
|
|
4267
|
+
onClick: handleReset,
|
|
4268
|
+
disabled: disabled,
|
|
4269
|
+
children: resetText
|
|
4270
|
+
}, "reset");
|
|
4271
|
+
}
|
|
4272
|
+
return result;
|
|
4273
|
+
}, [SubmitButton, disabled, form.formState.isSubmitting, submitText, showReset, resetText, handleReset]);
|
|
4274
|
+
const renderField = React.useCallback((field_1, options_0) => {
|
|
4275
|
+
return jsxRuntime.jsx(FieldRenderer, {
|
|
4276
|
+
field: field_1,
|
|
4277
|
+
namePrefix: options_0 === null || options_0 === void 0 ? void 0 : options_0.namePrefix
|
|
4278
|
+
});
|
|
4279
|
+
}, []);
|
|
4280
|
+
if (!children) {
|
|
4281
|
+
return jsxRuntime.jsx(FormProvider, {
|
|
3545
4282
|
...form,
|
|
3546
|
-
children: jsxRuntime.
|
|
3547
|
-
|
|
3548
|
-
|
|
3549
|
-
|
|
3550
|
-
|
|
3551
|
-
|
|
3552
|
-
children:
|
|
3553
|
-
|
|
4283
|
+
children: jsxRuntime.jsx(FieldsProvider, {
|
|
4284
|
+
fields: fieldsWithRequirements,
|
|
4285
|
+
children: jsxRuntime.jsxs("form", {
|
|
4286
|
+
ref: formRef,
|
|
4287
|
+
onSubmit: handleSubmit,
|
|
4288
|
+
className: className,
|
|
4289
|
+
children: [jsxRuntime.jsxs(FieldsWrapper, {
|
|
4290
|
+
children: [regularFields.map((field_2, index_0) => jsxRuntime.jsx(FieldWrapper, {
|
|
4291
|
+
name: field_2.name,
|
|
4292
|
+
type: field_2.type,
|
|
4293
|
+
className: field_2.className,
|
|
4294
|
+
children: jsxRuntime.jsx(FieldRenderer, {
|
|
4295
|
+
field: field_2
|
|
4296
|
+
})
|
|
4297
|
+
}, field_2.name || `field-${index_0}`)), arrayFields.map(arrayField => jsxRuntime.jsx(FieldWrapper, {
|
|
4298
|
+
name: arrayField.name,
|
|
4299
|
+
type: "array",
|
|
4300
|
+
className: arrayField.className,
|
|
4301
|
+
children: jsxRuntime.jsx(ArrayFieldRenderer, {
|
|
4302
|
+
field: arrayField
|
|
4303
|
+
})
|
|
4304
|
+
}, arrayField.name))]
|
|
4305
|
+
}), jsxRuntime.jsx(SubmitButton, {
|
|
4306
|
+
disabled: disabled || form.formState.isSubmitting,
|
|
4307
|
+
isSubmitting: form.formState.isSubmitting,
|
|
4308
|
+
children: submitText
|
|
4309
|
+
})]
|
|
4310
|
+
})
|
|
3554
4311
|
})
|
|
3555
4312
|
});
|
|
3556
|
-
$[11] = className;
|
|
3557
|
-
$[12] = disabled;
|
|
3558
|
-
$[13] = fields;
|
|
3559
|
-
$[14] = form;
|
|
3560
|
-
$[15] = onSubmit;
|
|
3561
|
-
$[16] = submitText;
|
|
3562
|
-
$[17] = t7;
|
|
3563
|
-
} else {
|
|
3564
|
-
t7 = $[17];
|
|
3565
4313
|
}
|
|
3566
|
-
|
|
4314
|
+
const renderProps = {
|
|
4315
|
+
fields: templateFields,
|
|
4316
|
+
arrays: Object.fromEntries(arrayFields.map(arrayField_0 => [arrayField_0.name, {
|
|
4317
|
+
field: arrayField_0
|
|
4318
|
+
}])),
|
|
4319
|
+
buttons,
|
|
4320
|
+
title,
|
|
4321
|
+
description,
|
|
4322
|
+
form: form,
|
|
4323
|
+
isSubmitting: form.formState.isSubmitting,
|
|
4324
|
+
isValid: form.formState.isValid,
|
|
4325
|
+
isDirty: form.formState.isDirty,
|
|
4326
|
+
renderField,
|
|
4327
|
+
FieldWrapper,
|
|
4328
|
+
FieldsWrapper
|
|
4329
|
+
};
|
|
4330
|
+
const renderFn = children;
|
|
4331
|
+
return jsxRuntime.jsx(FormProvider, {
|
|
4332
|
+
...form,
|
|
4333
|
+
children: jsxRuntime.jsx(FieldsProvider, {
|
|
4334
|
+
fields: fieldsWithRequirements,
|
|
4335
|
+
children: jsxRuntime.jsx("form", {
|
|
4336
|
+
ref: formRef,
|
|
4337
|
+
onSubmit: handleSubmit,
|
|
4338
|
+
className: className,
|
|
4339
|
+
children: renderFn(renderProps)
|
|
4340
|
+
})
|
|
4341
|
+
})
|
|
4342
|
+
});
|
|
3567
4343
|
}
|
|
3568
|
-
function
|
|
3569
|
-
return
|
|
3570
|
-
item
|
|
3571
|
-
}, getItemKey(item, index));
|
|
4344
|
+
function createFieldFactory(_schema) {
|
|
4345
|
+
return field => field;
|
|
3572
4346
|
}
|
|
3573
4347
|
|
|
3574
4348
|
Object.defineProperty(exports, "z", {
|
|
3575
4349
|
enumerable: true,
|
|
3576
4350
|
get: function () { return zod.z; }
|
|
3577
4351
|
});
|
|
4352
|
+
exports.ArrayFieldRenderer = ArrayFieldRenderer;
|
|
3578
4353
|
exports.Controller = Controller;
|
|
3579
4354
|
exports.FieldRenderer = FieldRenderer;
|
|
4355
|
+
exports.FieldsProvider = FieldsProvider;
|
|
3580
4356
|
exports.FormGenerator = FormGenerator;
|
|
3581
4357
|
exports.FormProvider = FormProvider;
|
|
4358
|
+
exports.StrictFormGenerator = StrictFormGenerator;
|
|
4359
|
+
exports.analyzeSchema = analyzeSchema;
|
|
3582
4360
|
exports.clearAllRegistries = clearAllRegistries;
|
|
3583
4361
|
exports.clearFieldRegistry = clearFieldRegistry;
|
|
3584
4362
|
exports.clearFormComponentRegistry = clearFormComponentRegistry;
|
|
3585
|
-
exports.
|
|
4363
|
+
exports.createArrayField = createArrayField;
|
|
4364
|
+
exports.createField = createField;
|
|
4365
|
+
exports.createFieldFactory = createFieldFactory;
|
|
4366
|
+
exports.getDateConstraints = getDateConstraints;
|
|
3586
4367
|
exports.getFieldComponent = getFieldComponent;
|
|
3587
4368
|
exports.getFormComponent = getFormComponent;
|
|
3588
4369
|
exports.getFormComponents = getFormComponents;
|
|
3589
|
-
exports.
|
|
4370
|
+
exports.getNumberConstraints = getNumberConstraints;
|
|
3590
4371
|
exports.getRegisteredFieldTypes = getRegisteredFieldTypes;
|
|
4372
|
+
exports.getSchemaRequirements = getSchemaRequirements;
|
|
4373
|
+
exports.getSchemaTypeName = getSchemaTypeName;
|
|
4374
|
+
exports.getStringConstraints = getStringConstraints;
|
|
3591
4375
|
exports.hasFieldType = hasFieldType;
|
|
3592
4376
|
exports.hasFormComponent = hasFormComponent;
|
|
3593
|
-
exports.
|
|
3594
|
-
exports.
|
|
4377
|
+
exports.isArrayField = isArrayField;
|
|
4378
|
+
exports.isSchemaRequired = isSchemaRequired;
|
|
4379
|
+
exports.mergeSchemaConstraints = mergeSchemaConstraints;
|
|
4380
|
+
exports.mergeSchemaRequirements = mergeSchemaRequirements;
|
|
3595
4381
|
exports.registerField = registerField;
|
|
3596
4382
|
exports.registerFields = registerFields;
|
|
3597
4383
|
exports.registerFormComponent = registerFormComponent;
|
|
3598
4384
|
exports.registerFormComponents = registerFormComponents;
|
|
3599
|
-
exports.registerLayoutComponent = registerLayoutComponent;
|
|
3600
|
-
exports.registerLayoutComponents = registerLayoutComponents;
|
|
3601
4385
|
exports.resetFormComponentRegistry = resetFormComponentRegistry;
|
|
4386
|
+
exports.strictFields = strictFields;
|
|
4387
|
+
exports.typedField = typedField;
|
|
4388
|
+
exports.typedFields = typedFields;
|
|
3602
4389
|
exports.unregisterField = unregisterField;
|
|
4390
|
+
exports.unwrapSchema = unwrapSchema;
|
|
4391
|
+
exports.useArrayField = useArrayField;
|
|
3603
4392
|
exports.useFieldArray = useFieldArray;
|
|
4393
|
+
exports.useFieldProps = useFieldProps;
|
|
4394
|
+
exports.useFieldsContext = useFieldsContext;
|
|
3604
4395
|
exports.useForm = useForm;
|
|
3605
4396
|
exports.useFormContext = useFormContext;
|
|
3606
4397
|
exports.useWatch = useWatch;
|
|
4398
|
+
exports.validateFieldType = validateFieldType;
|
|
4399
|
+
exports.validateFieldTypes = validateFieldTypes;
|
|
3607
4400
|
//# sourceMappingURL=index.js.map
|