UNPKG

@conform-to/react

Version:

Conform view adapter for react

770 lines (769 loc) 74.4 kB
import { FieldName } from '@conform-to/dom'; import { StandardSchemaV1 } from './standard-schema'; import { FormRef, FormsConfig, FormContext, FormMetadata, FormOptions, FieldMetadata, InferOutput, IntentDispatcher, InferFormShape, RequireKey, FormHandle } from './types'; export declare function configureForms<BaseErrorShape = any, BaseSchema = StandardSchemaV1, SchemaErrorShape = string[], CustomFormMetadata extends Record<string, unknown> = {}, CustomFieldMetadata extends Record<string, unknown> = {}>(config?: Partial<FormsConfig<BaseErrorShape, BaseSchema, SchemaErrorShape, CustomFormMetadata, CustomFieldMetadata>>): { FormProvider: (props: { context: FormContext<BaseErrorShape>; children: React.ReactNode; }) => React.ReactElement; useForm: { <Schema extends BaseSchema, ErrorShape extends BaseErrorShape, Value = InferOutput<Schema>>(schema: Schema, options: RequireKey<FormOptions<InferFormShape<Schema>, ErrorShape, Value, Schema, SchemaErrorShape>, "onValidate">): FormHandle<InferFormShape<Schema>, ErrorShape, CustomFormMetadata, CustomFieldMetadata>; <Schema extends BaseSchema, ErrorShape extends BaseErrorShape = SchemaErrorShape extends BaseErrorShape ? SchemaErrorShape : BaseErrorShape, Value = InferOutput<Schema>>(schema: Schema, options: RequireKey<FormOptions<InferFormShape<Schema>, ErrorShape, Value, Schema, SchemaErrorShape>, SchemaErrorShape extends BaseErrorShape ? never : "onValidate">): FormHandle<InferFormShape<Schema>, ErrorShape, CustomFormMetadata, CustomFieldMetadata>; <FormShape extends Record<string, any> = Record<string, any>, ErrorShape extends BaseErrorShape = BaseErrorShape, Value = undefined>(options: RequireKey<FormOptions<FormShape, ErrorShape, Value, undefined, SchemaErrorShape>, "onValidate">): FormHandle<FormShape, ErrorShape, CustomFormMetadata, CustomFieldMetadata>; }; useFormMetadata: (options?: { formId?: string; }) => FormMetadata<BaseErrorShape, CustomFormMetadata, CustomFieldMetadata>; useField: <FieldShape = any>(name: FieldName<FieldShape>, options?: { formId?: string; }) => FieldMetadata<FieldShape, BaseErrorShape, CustomFieldMetadata>; useIntent: <FormShape extends Record<string, any>>(formRef: FormRef) => IntentDispatcher<FormShape>; config: FormsConfig<BaseErrorShape, BaseSchema, SchemaErrorShape, CustomFormMetadata, CustomFieldMetadata>; }; /** * Provides form context to child components. * Stacks contexts to support nested forms, with latest context taking priority. */ export declare const FormProvider: (props: { context: FormContext<any>; children: React.ReactNode; }) => React.ReactElement; /** * The main React hook for form management. Handles form state, validation, and submission * while providing access to form metadata, field objects, and form actions. * * It can be called in two ways: * - **Schema first**: Pass a schema as the first argument for automatic validation with type inference * - **Manual configuration**: Pass options with custom `onValidate` handler for manual validation * * See https://conform.guide/api/react/future/useForm * * **Schema first setup with zod:** * * ```tsx * const { form, fields } = useForm(zodSchema, { * lastResult, * shouldValidate: 'onBlur', * }); * * return ( * <form {...form.props}> * <input name={fields.email.name} defaultValue={fields.email.defaultValue} /> * <div>{fields.email.errors}</div> * </form> * ); * ``` * * **Manual configuration setup with custom validation:** * * ```tsx * const { form, fields } = useForm({ * onValidate({ payload, error }) { * if (!payload.email) { * error.fieldErrors.email = ['Required']; * } * return error; * } * }); * * return ( * <form {...form.props}> * <input name={fields.email.name} defaultValue={fields.email.defaultValue} /> * <div>{fields.email.errors}</div> * </form> * ); * ``` */ export declare const useForm: { <Schema extends StandardSchemaV1<unknown, unknown>, ErrorShape extends any, Value = InferOutput<Schema>>(schema: Schema, options: { id?: string | undefined | undefined; key?: string | undefined | undefined; defaultValue?: import("./types").DefaultValue<InferFormShape<Schema>> | undefined; onInput?: import("./types").InputHandler | undefined; onBlur?: import("./types").BlurHandler | undefined; constraint?: Record<string, import("@conform-to/dom/future").ValidationAttributes> | undefined; lastResult?: import("@conform-to/dom/future").SubmissionResult<ErrorShape> | null | undefined; shouldValidate?: "onSubmit" | "onBlur" | "onInput" | undefined | undefined; shouldRevalidate?: "onSubmit" | "onBlur" | "onInput" | undefined | undefined; onSubmit?: import("./types").SubmitHandler<InferFormShape<Schema>, NoInfer<ErrorShape>, NoInfer<Value>> | undefined; onError?: import("./types").ErrorHandler<NoInfer<ErrorShape>> | undefined; serialize?: import("@conform-to/dom/future").CustomSerialize | undefined; schemaOptions?: import("./types").InferOptions<Schema> | undefined; onValidate: import("./types").ValidateHandler<ErrorShape, Value, InferOutput<Schema>, string[]>; }): FormHandle<InferFormShape<Schema>, ErrorShape, {}, {}>; <Schema extends StandardSchemaV1<unknown, unknown>, ErrorShape extends any = string[], Value = InferOutput<Schema>>(schema: Schema, options: { id?: string | undefined | undefined; key?: string | undefined | undefined; defaultValue?: import("./types").DefaultValue<InferFormShape<Schema>> | undefined; onInput?: import("./types").InputHandler | undefined; onBlur?: import("./types").BlurHandler | undefined; constraint?: Record<string, import("@conform-to/dom/future").ValidationAttributes> | undefined; lastResult?: import("@conform-to/dom/future").SubmissionResult<ErrorShape> | null | undefined; shouldValidate?: "onSubmit" | "onBlur" | "onInput" | undefined | undefined; shouldRevalidate?: "onSubmit" | "onBlur" | "onInput" | undefined | undefined; onValidate?: import("./types").ValidateHandler<ErrorShape, Value, InferOutput<Schema>, string[]> | undefined; onSubmit?: import("./types").SubmitHandler<InferFormShape<Schema>, NoInfer<ErrorShape>, NoInfer<Value>> | undefined; onError?: import("./types").ErrorHandler<NoInfer<ErrorShape>> | undefined; serialize?: import("@conform-to/dom/future").CustomSerialize | undefined; schemaOptions?: import("./types").InferOptions<Schema> | undefined; }): FormHandle<InferFormShape<Schema>, ErrorShape, {}, {}>; <FormShape extends Record<string, any> = Record<string, any>, ErrorShape extends any = any, Value = undefined>(options: { id?: string | undefined | undefined; key?: string | undefined | undefined; defaultValue?: import("./types").DefaultValue<FormShape> | undefined; onInput?: import("./types").InputHandler | undefined; onBlur?: import("./types").BlurHandler | undefined; constraint?: Record<string, import("@conform-to/dom/future").ValidationAttributes> | undefined; lastResult?: import("@conform-to/dom/future").SubmissionResult<ErrorShape> | null | undefined; shouldValidate?: "onSubmit" | "onBlur" | "onInput" | undefined | undefined; shouldRevalidate?: "onSubmit" | "onBlur" | "onInput" | undefined | undefined; onSubmit?: import("./types").SubmitHandler<FormShape, NoInfer<ErrorShape>, NoInfer<Value>> | undefined; onError?: import("./types").ErrorHandler<NoInfer<ErrorShape>> | undefined; serialize?: import("@conform-to/dom/future").CustomSerialize | undefined; schemaOptions?: undefined; onValidate: import("./types").ValidateHandler<ErrorShape, Value, undefined, string[]>; }): FormHandle<FormShape, ErrorShape, {}, {}>; }; /** * A React hook that provides access to form-level metadata and state. * Requires `FormProvider` context when used in child components. * * See https://conform.guide/api/react/future/useFormMetadata * * **Example:** * ```tsx * function ErrorSummary() { * const form = useFormMetadata(); * * if (form.valid) return null; * * return ( * <div>Please fix {Object.keys(form.fieldErrors).length} errors</div> * ); * } * ``` */ export declare const useFormMetadata: (options?: { formId?: string; }) => Readonly<{ key: string; id: string; descriptionId: string; errorId: string; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; defaultValue: Record<string, unknown>; props: Readonly<{ id: string; onSubmit: React.FormEventHandler<HTMLFormElement>; onBlur: React.FocusEventHandler<HTMLFormElement>; onInput: React.FormEventHandler<HTMLFormElement>; noValidate: boolean; }>; context: FormContext<any>; getField<FieldShape>(name: import("@conform-to/dom/future").FieldName<FieldShape>): Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldShape>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldShape> extends never ? unknown : FieldShape>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape = [FieldShape] extends [(infer ItemShape)[] | null | undefined] ? ItemShape : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape> extends never ? unknown : FieldItemShape>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_1 = [FieldItemShape] extends [(infer ItemShape)[] | null | undefined] ? ItemShape : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape_1>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape_1> extends never ? unknown : FieldItemShape_1>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_2 = [FieldItemShape_1] extends [(infer ItemShape)[] | null | undefined] ? ItemShape : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape_2>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape_2> extends never ? unknown : FieldItemShape_2>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_3 = [FieldItemShape_2] extends [(infer ItemShape)[] | null | undefined] ? ItemShape : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape_3>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape_3> extends never ? unknown : FieldItemShape_3>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_4 = [FieldItemShape_3] extends [(infer ItemShape)[] | null | undefined] ? ItemShape : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape_4>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape_4> extends never ? unknown : FieldItemShape_4>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_5 = [FieldItemShape_4] extends [(infer ItemShape)[] | null | undefined] ? ItemShape : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape_5>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape_5> extends never ? unknown : FieldItemShape_5>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_6 = [FieldItemShape_5] extends [(infer ItemShape)[] | null | undefined] ? ItemShape : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape_6>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape_6> extends never ? unknown : FieldItemShape_6>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_7 = [FieldItemShape_6] extends [(infer ItemShape)[] | null | undefined] ? ItemShape : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape_7>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape_7> extends never ? unknown : FieldItemShape_7>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_8 = [FieldItemShape_7] extends [(infer ItemShape)[] | null | undefined] ? ItemShape : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape_8>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape_8> extends never ? unknown : FieldItemShape_8>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_9 = [FieldItemShape_8] extends [(infer ItemShape)[] | null | undefined] ? ItemShape : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape_9>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape_9> extends never ? unknown : FieldItemShape_9>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_10 = [FieldItemShape_9] extends [(infer ItemShape)[] | null | undefined] ? ItemShape : unknown>() => Readonly</*elided*/ any>[]; }>[]; }>[]; }>[]; }>[]; }>[]; }>[]; }>[]; }>[]; }>[]; }>[]; }>; getFieldset<FieldShape>(name?: import("@conform-to/dom/future").FieldName<FieldShape> | undefined): import("./types").Fieldset<keyof NonNullable<FieldShape> extends never ? unknown : FieldShape, any, {}>; getFieldList<FieldShape>(name: import("@conform-to/dom/future").FieldName<FieldShape>): Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<[FieldShape] extends [(infer ItemShape)[] | null | undefined] ? ItemShape : unknown>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<[FieldShape] extends [(infer ItemShape)[] | null | undefined] ? ItemShape : unknown> extends never ? unknown : [FieldShape] extends [(infer ItemShape)[] | null | undefined] ? ItemShape : unknown>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape = [[FieldShape] extends [(infer ItemShape)[] | null | undefined] ? ItemShape : unknown] extends [(infer ItemShape_1)[] | null | undefined] ? ItemShape_1 : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape> extends never ? unknown : FieldItemShape>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_1 = [FieldItemShape] extends [(infer ItemShape_1)[] | null | undefined] ? ItemShape_1 : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape_1>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape_1> extends never ? unknown : FieldItemShape_1>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_2 = [FieldItemShape_1] extends [(infer ItemShape_1)[] | null | undefined] ? ItemShape_1 : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape_2>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape_2> extends never ? unknown : FieldItemShape_2>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_3 = [FieldItemShape_2] extends [(infer ItemShape_1)[] | null | undefined] ? ItemShape_1 : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape_3>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape_3> extends never ? unknown : FieldItemShape_3>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_4 = [FieldItemShape_3] extends [(infer ItemShape_1)[] | null | undefined] ? ItemShape_1 : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape_4>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape_4> extends never ? unknown : FieldItemShape_4>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_5 = [FieldItemShape_4] extends [(infer ItemShape_1)[] | null | undefined] ? ItemShape_1 : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape_5>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape_5> extends never ? unknown : FieldItemShape_5>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_6 = [FieldItemShape_5] extends [(infer ItemShape_1)[] | null | undefined] ? ItemShape_1 : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape_6>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape_6> extends never ? unknown : FieldItemShape_6>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_7 = [FieldItemShape_6] extends [(infer ItemShape_1)[] | null | undefined] ? ItemShape_1 : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape_7>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape_7> extends never ? unknown : FieldItemShape_7>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_8 = [FieldItemShape_7] extends [(infer ItemShape_1)[] | null | undefined] ? ItemShape_1 : unknown>() => Readonly<{ required?: boolean | undefined | undefined; minLength?: number | undefined | undefined; maxLength?: number | undefined | undefined; min?: string | number | undefined | undefined; max?: string | number | undefined | undefined; step?: string | number | undefined | undefined; multiple?: boolean | undefined | undefined; pattern?: string | undefined | undefined; accept?: string | undefined | undefined; key: string | undefined; name: import("@conform-to/dom/future").FieldName<FieldItemShape_8>; id: string; descriptionId: string; errorId: string; formId: string; defaultValue: string; defaultOptions: string[]; defaultChecked: boolean; defaultPayload: unknown; touched: boolean; valid: boolean; invalid: boolean; errors: any; fieldErrors: Record<string, any>; ariaInvalid: boolean | undefined; ariaDescribedBy: string | undefined; getFieldset: <FieldsetShape = keyof NonNullable<FieldItemShape_8> extends never ? unknown : FieldItemShape_8>() => import("./types").Fieldset<FieldsetShape, any, {}>; getFieldList: <FieldItemShape_9 = [FieldItemShape_8] extends [(infer ItemShape_1)[] | null | undefined] ? ItemShape_1 : unknown>() => Readonly<{ required?: boolean | undefined | undefined;