🚨 Active Supply Chain Attack:node-ipc Package Compromised.Learn More →
@tanstack/react-form
Advanced tools
@tanstack/react-form - npm Package Compare versions
@@ -46,6 +46,3 @@ "use client"; | ||
| const AppField2 = (({ children, ...props2 }) => { | ||
| return /* @__PURE__ */ jsxRuntime.jsx(form.Field, { ...props2, children: (field) => ( | ||
| // eslint-disable-next-line @eslint-react/no-context-provider | ||
| /* @__PURE__ */ jsxRuntime.jsx(fieldContext2.Provider, { value: field, children: children(Object.assign(field, fieldComponents)) }) | ||
| ) }); | ||
| return /* @__PURE__ */ jsxRuntime.jsx(form.Field, { ...props2, children: (field) => /* @__PURE__ */ jsxRuntime.jsx(fieldContext2.Provider, { value: field, children: children(Object.assign(field, fieldComponents)) }) }); | ||
| }); | ||
@@ -52,0 +49,0 @@ return AppField2; |
@@ -1,1 +0,1 @@ | ||
| {"version":3,"file":"createFormHook.cjs","sources":["../../src/createFormHook.tsx"],"sourcesContent":["'use client'\n/* eslint-disable @eslint-react/no-context-provider */\nimport { createContext, useContext, useMemo } from 'react'\nimport { useForm } from './useForm'\nimport { useFieldGroup } from './useFieldGroup'\nimport type {\n AnyFieldApi,\n AnyFormApi,\n BaseFormOptions,\n DeepKeysOfType,\n FieldApi,\n FieldsMap,\n FormAsyncValidateOrFn,\n FormOptions,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type {\n ComponentType,\n Context,\n FunctionComponent,\n PropsWithChildren,\n} from 'react'\nimport type { FieldComponent } from './useField'\nimport type { ReactFormExtendedApi } from './useForm'\nimport type { AppFieldExtendedReactFieldGroupApi } from './useFieldGroup'\n\n// We should never hit the `null` case here\nconst fieldContext = createContext<AnyFieldApi>(null as never)\nconst formContext = createContext<AnyFormApi>(null as never)\n\n/**\n * TypeScript inferencing is weird.\n *\n * If you have:\n *\n * @example\n *\n * interface Args<T> {\n * arg?: T\n * }\n *\n * function test<T>(arg?: Partial<Args<T>>): T {\n * return 0 as any;\n * }\n *\n * const a = test({});\n *\n * Then `T` will default to `unknown`.\n *\n * However, if we change `test` to be:\n *\n * @example\n *\n * function test<T extends undefined>(arg?: Partial<Args<T>>): T;\n *\n * Then `T` becomes `undefined`.\n *\n * Here, we are checking if the passed type `T` extends `DefaultT` and **only**\n * `DefaultT`, as if that's the case we assume that inferencing has not occurred.\n */\ntype UnwrapOrAny<T> = [unknown] extends [T] ? any : T\ntype UnwrapDefaultOrAny<DefaultT, T> = [DefaultT] extends [T]\n ? [T] extends [DefaultT]\n ? any\n : T\n : T\n\nfunction useFormContext() {\n const form = useContext(formContext)\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n if (!form) {\n throw new Error(\n '`formContext` only works when within a `formComponent` passed to `createFormHook`',\n )\n }\n\n return form as ReactFormExtendedApi<\n // If you need access to the form data, you need to use `withForm` instead\n Record<string, never>,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any\n >\n}\n\nexport function createFormHookContexts() {\n function useFieldContext<TData>() {\n const field = useContext(fieldContext)\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n if (!field) {\n throw new Error(\n '`fieldContext` only works when within a `fieldComponent` passed to `createFormHook`',\n )\n }\n\n return field as FieldApi<\n any,\n string,\n TData,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any\n >\n }\n\n return { fieldContext, useFieldContext, useFormContext, formContext }\n}\n\ninterface CreateFormHookProps<\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n> {\n fieldComponents: TFieldComponents\n fieldContext: Context<AnyFieldApi>\n formComponents: TFormComponents\n formContext: Context<AnyFormApi>\n}\n\n/**\n * @private\n */\nexport type AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n> = ReactFormExtendedApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n> &\n NoInfer<TFormComponents> & {\n AppField: FieldComponent<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n NoInfer<TFieldComponents>\n >\n AppForm: ComponentType<\n // PropsWithChildren<P> is not optional in React 17\n PropsWithChildren<{}>\n >\n }\n\nexport interface WithFormProps<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n TRenderProps extends object = Record<string, never>,\n> extends FormOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n> {\n // Optional, but adds props to the `render` function outside of `form`\n props?: TRenderProps\n render: FunctionComponent<\n PropsWithChildren<\n NoInfer<TRenderProps> & {\n form: AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TFieldComponents,\n TFormComponents\n >\n }\n >\n >\n}\n\nexport interface WithFieldGroupProps<\n TFieldGroupData,\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n TSubmitMeta,\n TRenderProps extends object = Record<string, never>,\n> extends BaseFormOptions<TFieldGroupData, TSubmitMeta> {\n // Optional, but adds props to the `render` function outside of `form`\n props?: TRenderProps\n render: FunctionComponent<\n PropsWithChildren<\n NoInfer<TRenderProps> & {\n group: AppFieldExtendedReactFieldGroupApi<\n unknown,\n TFieldGroupData,\n string | FieldsMap<unknown, TFieldGroupData>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n // this types it as 'never' in the render prop. It should prevent any\n // untyped meta passed to the handleSubmit by accident.\n unknown extends TSubmitMeta ? never : TSubmitMeta,\n TFieldComponents,\n TFormComponents\n >\n }\n >\n >\n}\n\nexport function createFormHook<\n const TComponents extends Record<string, ComponentType<any>>,\n const TFormComponents extends Record<string, ComponentType<any>>,\n>({\n fieldComponents,\n fieldContext,\n formContext,\n formComponents,\n}: CreateFormHookProps<TComponents, TFormComponents>) {\n function useAppForm<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n >(\n props: FormOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >,\n ): AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n > {\n const form = useForm(props)\n\n // PropsWithChildren<P> is not optional in React 17\n const AppForm = useMemo<ComponentType<PropsWithChildren<{}>>>(() => {\n return ({ children }) => {\n return (\n <formContext.Provider value={form}>{children}</formContext.Provider>\n )\n }\n }, [form])\n\n const AppField = useMemo(() => {\n const AppField = (({ children, ...props }) => {\n return (\n <form.Field {...props}>\n {(field) => (\n // eslint-disable-next-line @eslint-react/no-context-provider\n <fieldContext.Provider value={field}>\n {children(Object.assign(field, fieldComponents))}\n </fieldContext.Provider>\n )}\n </form.Field>\n )\n }) as FieldComponent<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents\n >\n return AppField\n }, [form])\n\n const extendedForm = useMemo(() => {\n return Object.assign(form, {\n AppField,\n AppForm,\n ...formComponents,\n })\n }, [form, AppField, AppForm])\n\n return extendedForm\n }\n\n function withForm<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n TRenderProps extends object = {},\n >({\n render,\n props,\n }: WithFormProps<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents,\n TRenderProps\n >): WithFormProps<\n UnwrapOrAny<TFormData>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnMount>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnChange>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnChangeAsync>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnBlur>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnBlurAsync>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnSubmit>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnSubmitAsync>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnDynamic>,\n UnwrapDefaultOrAny<\n undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync\n >,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnServer>,\n UnwrapOrAny<TSubmitMeta>,\n UnwrapOrAny<TComponents>,\n UnwrapOrAny<TFormComponents>,\n UnwrapOrAny<TRenderProps>\n >['render'] {\n return function Render(innerProps) {\n return render({ ...props, ...innerProps })\n }\n }\n\n function withFieldGroup<\n TFieldGroupData,\n TSubmitMeta,\n TRenderProps extends object = {},\n >({\n render,\n props,\n defaultValues,\n }: WithFieldGroupProps<\n TFieldGroupData,\n TComponents,\n TFormComponents,\n TSubmitMeta,\n TRenderProps\n >): <\n TFormData,\n TFields extends\n | DeepKeysOfType<TFormData, TFieldGroupData | null | undefined>\n | FieldsMap<TFormData, TFieldGroupData>,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TFormSubmitMeta,\n >(\n params: PropsWithChildren<\n NoInfer<TRenderProps> & {\n form:\n | AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n unknown extends TSubmitMeta ? TFormSubmitMeta : TSubmitMeta,\n TComponents,\n TFormComponents\n >\n | AppFieldExtendedReactFieldGroupApi<\n // Since this only occurs if you nest it within other field groups, it can be more\n // lenient with the types.\n unknown,\n TFormData,\n string | FieldsMap<unknown, TFormData>,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n unknown extends TSubmitMeta ? TFormSubmitMeta : TSubmitMeta,\n TComponents,\n TFormComponents\n >\n fields: TFields\n }\n >,\n ) => ReturnType<FunctionComponent> {\n return function Render(innerProps) {\n const fieldGroupProps = useMemo(() => {\n return {\n form: innerProps.form,\n fields: innerProps.fields,\n defaultValues,\n formComponents,\n }\n }, [innerProps.form, innerProps.fields])\n const fieldGroupApi = useFieldGroup(fieldGroupProps as any)\n\n return render({ ...props, ...innerProps, group: fieldGroupApi as any })\n }\n }\n\n /**\n * ⚠️ **Use withForm whenever possible.**\n *\n * Gets a typed form from the `<form.AppForm />` context.\n */\n function useTypedAppFormContext<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n >(\n _props: FormOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >,\n ): AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n > {\n const form = useFormContext()\n\n return form as never\n }\n\n function extendForm<\n const TNewField extends Record<string, ComponentType<any>> & {\n [K in keyof TComponents]?: 'Error: field component names must be unique — this key already exists in the base form'\n },\n const TNewForm extends Record<string, ComponentType<any>> & {\n [K in keyof TFormComponents]?: 'Error: form component names must be unique — this key already exists in the base form'\n },\n >(extension: { fieldComponents?: TNewField; formComponents?: TNewForm }) {\n return createFormHook({\n fieldContext,\n formContext,\n fieldComponents: {\n ...fieldComponents,\n ...extension.fieldComponents,\n } as TComponents & TNewField,\n formComponents: {\n ...formComponents,\n ...extension.formComponents,\n } as TFormComponents & TNewForm,\n })\n }\n\n return {\n useAppForm,\n withForm,\n withFieldGroup,\n useTypedAppFormContext,\n extendForm,\n }\n}\n"],"names":["fieldContext","formContext","AppField"],"mappings":";;;;;;;AA2BA;AACA;AAuCA;AACE;AAGA;AACE;AAAU;AACR;AAAA;AAIJ;AAeF;AAEO;AACL;AACE;AAGA;AACE;AAAU;AACR;AAAA;AAIJ;AAAO;AA2BT;AACF;AA+JO;AAGL;AACA;AACAA;AACAC;AAEF;AACE;AA4CE;AAGA;AACE;AACE;AAC+C;AAEjD;AAGF;AACE;AACE;AAEM;AAAA;AAIA;AAEJ;AAiBJ;AAAOC;AAGT;AACE;AAA2B;AACzB;AACA;AACG;AACJ;AAGH;AAAO;AAGT;AAcE;AACA;AACA;AAqCA;AACE;AAAyC;AAC3C;AAGF;AAIE;AACA;AACA;AACA;AAmEA;AACE;AACE;AAAO;AACY;AACE;AACnB;AACA;AAAA;AAGJ;AAEA;AAAsE;AACxE;AAQF;AA4CE;AAEA;AAAO;AAGT;AAQE;AAAsB;AACpBF;AACAC;AACiB;AACZ;AACU;AAAA;AAEC;AACX;AACU;AAAA;AAEhB;AAGH;AAAO;AACL;AACA;AACA;AACA;AACA;AAEJ;;;"} | ||
| {"version":3,"file":"createFormHook.cjs","sources":["../../src/createFormHook.tsx"],"sourcesContent":["'use client'\n/* eslint-disable @eslint-react/no-context-provider */\nimport { createContext, useContext, useMemo } from 'react'\nimport { useForm } from './useForm'\nimport { useFieldGroup } from './useFieldGroup'\nimport type {\n AnyFieldApi,\n AnyFormApi,\n BaseFormOptions,\n DeepKeysOfType,\n FieldApi,\n FieldsMap,\n FormAsyncValidateOrFn,\n FormOptions,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type {\n ComponentType,\n Context,\n FunctionComponent,\n PropsWithChildren,\n} from 'react'\nimport type { FieldComponent } from './useField'\nimport type { ReactFormExtendedApi } from './useForm'\nimport type { AppFieldExtendedReactFieldGroupApi } from './useFieldGroup'\n\n// We should never hit the `null` case here\nconst fieldContext = createContext<AnyFieldApi>(null as never)\nconst formContext = createContext<AnyFormApi>(null as never)\n\n/**\n * TypeScript inferencing is weird.\n *\n * If you have:\n *\n * @example\n *\n * interface Args<T> {\n * arg?: T\n * }\n *\n * function test<T>(arg?: Partial<Args<T>>): T {\n * return 0 as any;\n * }\n *\n * const a = test({});\n *\n * Then `T` will default to `unknown`.\n *\n * However, if we change `test` to be:\n *\n * @example\n *\n * function test<T extends undefined>(arg?: Partial<Args<T>>): T;\n *\n * Then `T` becomes `undefined`.\n *\n * Here, we are checking if the passed type `T` extends `DefaultT` and **only**\n * `DefaultT`, as if that's the case we assume that inferencing has not occurred.\n */\ntype UnwrapOrAny<T> = [unknown] extends [T] ? any : T\ntype UnwrapDefaultOrAny<DefaultT, T> = [DefaultT] extends [T]\n ? [T] extends [DefaultT]\n ? any\n : T\n : T\n\nfunction useFormContext() {\n const form = useContext(formContext)\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n if (!form) {\n throw new Error(\n '`formContext` only works when within a `formComponent` passed to `createFormHook`',\n )\n }\n\n return form as ReactFormExtendedApi<\n // If you need access to the form data, you need to use `withForm` instead\n Record<string, never>,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any\n >\n}\n\nexport function createFormHookContexts() {\n function useFieldContext<TData>() {\n const field = useContext(fieldContext)\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n if (!field) {\n throw new Error(\n '`fieldContext` only works when within a `fieldComponent` passed to `createFormHook`',\n )\n }\n\n return field as FieldApi<\n any,\n string,\n TData,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any\n >\n }\n\n return { fieldContext, useFieldContext, useFormContext, formContext }\n}\n\ninterface CreateFormHookProps<\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n> {\n fieldComponents: TFieldComponents\n fieldContext: Context<AnyFieldApi>\n formComponents: TFormComponents\n formContext: Context<AnyFormApi>\n}\n\n/**\n * @private\n */\nexport type AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n> = ReactFormExtendedApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n> &\n NoInfer<TFormComponents> & {\n AppField: FieldComponent<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n NoInfer<TFieldComponents>\n >\n AppForm: ComponentType<\n // PropsWithChildren<P> is not optional in React 17\n PropsWithChildren<{}>\n >\n }\n\nexport interface WithFormProps<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n TRenderProps extends object = Record<string, never>,\n> extends FormOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n> {\n // Optional, but adds props to the `render` function outside of `form`\n props?: TRenderProps\n render: FunctionComponent<\n PropsWithChildren<\n NoInfer<TRenderProps> & {\n form: AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TFieldComponents,\n TFormComponents\n >\n }\n >\n >\n}\n\nexport interface WithFieldGroupProps<\n TFieldGroupData,\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n TSubmitMeta,\n TRenderProps extends object = Record<string, never>,\n> extends BaseFormOptions<TFieldGroupData, TSubmitMeta> {\n // Optional, but adds props to the `render` function outside of `form`\n props?: TRenderProps\n render: FunctionComponent<\n PropsWithChildren<\n NoInfer<TRenderProps> & {\n group: AppFieldExtendedReactFieldGroupApi<\n unknown,\n TFieldGroupData,\n string | FieldsMap<unknown, TFieldGroupData>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n // this types it as 'never' in the render prop. It should prevent any\n // untyped meta passed to the handleSubmit by accident.\n unknown extends TSubmitMeta ? never : TSubmitMeta,\n TFieldComponents,\n TFormComponents\n >\n }\n >\n >\n}\n\nexport function createFormHook<\n const TComponents extends Record<string, ComponentType<any>>,\n const TFormComponents extends Record<string, ComponentType<any>>,\n>({\n fieldComponents,\n fieldContext,\n formContext,\n formComponents,\n}: CreateFormHookProps<TComponents, TFormComponents>) {\n function useAppForm<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n >(\n props: FormOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >,\n ): AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n > {\n const form = useForm(props)\n\n // PropsWithChildren<P> is not optional in React 17\n const AppForm = useMemo<ComponentType<PropsWithChildren<{}>>>(() => {\n return ({ children }) => {\n return (\n <formContext.Provider value={form}>{children}</formContext.Provider>\n )\n }\n }, [form])\n\n const AppField = useMemo(() => {\n const AppField = (({ children, ...props }) => {\n return (\n <form.Field {...props}>\n {(field) => (\n <fieldContext.Provider value={field}>\n {children(Object.assign(field, fieldComponents))}\n </fieldContext.Provider>\n )}\n </form.Field>\n )\n }) as FieldComponent<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents\n >\n return AppField\n }, [form])\n\n const extendedForm = useMemo(() => {\n return Object.assign(form, {\n AppField,\n AppForm,\n ...formComponents,\n })\n }, [form, AppField, AppForm])\n\n return extendedForm\n }\n\n function withForm<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n TRenderProps extends object = {},\n >({\n render,\n props,\n }: WithFormProps<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents,\n TRenderProps\n >): WithFormProps<\n UnwrapOrAny<TFormData>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnMount>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnChange>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnChangeAsync>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnBlur>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnBlurAsync>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnSubmit>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnSubmitAsync>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnDynamic>,\n UnwrapDefaultOrAny<\n undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync\n >,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnServer>,\n UnwrapOrAny<TSubmitMeta>,\n UnwrapOrAny<TComponents>,\n UnwrapOrAny<TFormComponents>,\n UnwrapOrAny<TRenderProps>\n >['render'] {\n return function Render(innerProps) {\n return render({ ...props, ...innerProps })\n }\n }\n\n function withFieldGroup<\n TFieldGroupData,\n TSubmitMeta,\n TRenderProps extends object = {},\n >({\n render,\n props,\n defaultValues,\n }: WithFieldGroupProps<\n TFieldGroupData,\n TComponents,\n TFormComponents,\n TSubmitMeta,\n TRenderProps\n >): <\n TFormData,\n TFields extends\n | DeepKeysOfType<TFormData, TFieldGroupData | null | undefined>\n | FieldsMap<TFormData, TFieldGroupData>,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TFormSubmitMeta,\n >(\n params: PropsWithChildren<\n NoInfer<TRenderProps> & {\n form:\n | AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n unknown extends TSubmitMeta ? TFormSubmitMeta : TSubmitMeta,\n TComponents,\n TFormComponents\n >\n | AppFieldExtendedReactFieldGroupApi<\n // Since this only occurs if you nest it within other field groups, it can be more\n // lenient with the types.\n unknown,\n TFormData,\n string | FieldsMap<unknown, TFormData>,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n unknown extends TSubmitMeta ? TFormSubmitMeta : TSubmitMeta,\n TComponents,\n TFormComponents\n >\n fields: TFields\n }\n >,\n ) => ReturnType<FunctionComponent> {\n return function Render(innerProps) {\n const fieldGroupProps = useMemo(() => {\n return {\n form: innerProps.form,\n fields: innerProps.fields,\n defaultValues,\n formComponents,\n }\n }, [innerProps.form, innerProps.fields])\n const fieldGroupApi = useFieldGroup(fieldGroupProps as any)\n\n return render({ ...props, ...innerProps, group: fieldGroupApi as any })\n }\n }\n\n /**\n * ⚠️ **Use withForm whenever possible.**\n *\n * Gets a typed form from the `<form.AppForm />` context.\n */\n function useTypedAppFormContext<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n >(\n _props: FormOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >,\n ): AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n > {\n const form = useFormContext()\n\n return form as never\n }\n\n function extendForm<\n const TNewField extends Record<string, ComponentType<any>> & {\n [K in keyof TComponents]?: 'Error: field component names must be unique — this key already exists in the base form'\n },\n const TNewForm extends Record<string, ComponentType<any>> & {\n [K in keyof TFormComponents]?: 'Error: form component names must be unique — this key already exists in the base form'\n },\n >(extension: { fieldComponents?: TNewField; formComponents?: TNewForm }) {\n return createFormHook({\n fieldContext,\n formContext,\n fieldComponents: {\n ...fieldComponents,\n ...extension.fieldComponents,\n } as TComponents & TNewField,\n formComponents: {\n ...formComponents,\n ...extension.formComponents,\n } as TFormComponents & TNewForm,\n })\n }\n\n return {\n useAppForm,\n withForm,\n withFieldGroup,\n useTypedAppFormContext,\n extendForm,\n }\n}\n"],"names":["fieldContext","formContext","AppField"],"mappings":";;;;;;;AA2BA;AACA;AAuCA;AACE;AAGA;AACE;AAAU;AACR;AAAA;AAIJ;AAeF;AAEO;AACL;AACE;AAGA;AACE;AAAU;AACR;AAAA;AAIJ;AAAO;AA2BT;AACF;AA+JO;AAGL;AACA;AACAA;AACAC;AAEF;AACE;AA4CE;AAGA;AACE;AACE;AAC+C;AAEjD;AAGF;AACE;AACE;AAOE;AAiBJ;AAAOC;AAGT;AACE;AAA2B;AACzB;AACA;AACG;AACJ;AAGH;AAAO;AAGT;AAcE;AACA;AACA;AAqCA;AACE;AAAyC;AAC3C;AAGF;AAIE;AACA;AACA;AACA;AAmEA;AACE;AACE;AAAO;AACY;AACE;AACnB;AACA;AAAA;AAGJ;AAEA;AAAsE;AACxE;AAQF;AA4CE;AAEA;AAAO;AAGT;AAQE;AAAsB;AACpBF;AACAC;AACiB;AACZ;AACU;AAAA;AAEC;AACX;AACU;AAAA;AAEhB;AAGH;AAAO;AACL;AACA;AACA;AACA;AACA;AAEJ;;;"} |
@@ -78,3 +78,2 @@ "use client"; | ||
| const extendedApi = reactiveFieldApi; | ||
| extendedApi.Field = Field; | ||
| return extendedApi; | ||
@@ -81,0 +80,0 @@ }, [ |
@@ -1,1 +0,1 @@ | ||
| {"version":3,"file":"useField.cjs","sources":["../../src/useField.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo, useRef, useState } from 'react'\nimport { useStore } from '@tanstack/react-store'\nimport { FieldApi, functionalUpdate } from '@tanstack/form-core'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\nimport type {\n AnyFieldApi,\n AnyFieldMeta,\n DeepKeys,\n DeepValue,\n FieldAsyncValidateOrFn,\n FieldValidateOrFn,\n FieldValidators,\n FormAsyncValidateOrFn,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type { FunctionComponent, ReactElement, ReactNode } from 'react'\nimport type { UseFieldOptions, UseFieldOptionsBound } from './types'\n\ninterface ReactFieldApi<\n TParentData,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n> {\n /**\n * A pre-bound and type-safe sub-field component using this field as a root.\n */\n Field: FieldComponent<\n TParentData,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n >\n}\n\n/**\n * A type representing a hook for using a field in a form with the given form data type.\n *\n * A function that takes an optional object with a `name` property and field options, and returns a `FieldApi` instance for the specified field.\n */\nexport type UseField<\n TParentData,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n> = <\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n>(\n opts: UseFieldOptionsBound<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n >,\n) => FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n>\n\n/**\n * A hook for managing a field in a form.\n * @param opts An object with field options.\n *\n * @returns The `FieldApi` instance for the specified field.\n */\nexport function useField<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n>(\n opts: UseFieldOptions<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n >,\n) {\n // Keep a snapshot of options so that React Compiler doesn't\n // wrongly optimize fieldApi.\n const [prevOptions, setPrevOptions] = useState(() => ({\n form: opts.form,\n name: opts.name,\n }))\n\n const [fieldApi, setFieldApi] = useState(() => {\n return new FieldApi({\n ...opts,\n })\n })\n\n // We only want to\n // update on name changes since those are at risk of becoming stale. The field\n // state must be up to date for the internal JSX render.\n // The other options can freely be in `fieldApi.update`\n if (prevOptions.form !== opts.form || prevOptions.name !== opts.name) {\n setFieldApi(\n new FieldApi({\n ...opts,\n }),\n )\n setPrevOptions({ form: opts.form, name: opts.name })\n }\n\n // For array mode, only track length changes to avoid re-renders when child properties change\n // See: https://github.com/TanStack/form/issues/1925\n const reactiveStateValue = useStore(\n fieldApi.store,\n (opts.mode === 'array'\n ? (state) => Object.keys((state.value as unknown) ?? []).length\n : (state) => state.value) as (\n state: typeof fieldApi.state,\n ) => TData | number,\n )\n const reactiveMetaIsTouched = useStore(\n fieldApi.store,\n (state) => state.meta.isTouched,\n )\n const reactiveMetaIsBlurred = useStore(\n fieldApi.store,\n (state) => state.meta.isBlurred,\n )\n const reactiveMetaIsDirty = useStore(\n fieldApi.store,\n (state) => state.meta.isDirty,\n )\n const reactiveMetaErrorMap = useStore(\n fieldApi.store,\n (state) => state.meta.errorMap,\n )\n const reactiveMetaErrorSourceMap = useStore(\n fieldApi.store,\n (state) => state.meta.errorSourceMap,\n )\n const reactiveMetaIsValidating = useStore(\n fieldApi.store,\n (state) => state.meta.isValidating,\n )\n\n // This makes me sad, but if I understand correctly, this is what we have to do for reactivity to work properly with React compiler.\n const extendedFieldApi = useMemo(() => {\n const reactiveFieldApi = {\n ...fieldApi,\n get state() {\n return {\n // For array mode, reactiveStateValue is the length (for reactivity tracking),\n // so we need to get the actual value from fieldApi\n value:\n opts.mode === 'array' ? fieldApi.state.value : reactiveStateValue,\n get meta() {\n return {\n ...fieldApi.state.meta,\n isTouched: reactiveMetaIsTouched,\n isBlurred: reactiveMetaIsBlurred,\n isDirty: reactiveMetaIsDirty,\n errorMap: reactiveMetaErrorMap,\n errorSourceMap: reactiveMetaErrorSourceMap,\n isValidating: reactiveMetaIsValidating,\n } satisfies AnyFieldMeta\n },\n } satisfies AnyFieldApi['state']\n },\n }\n\n const extendedApi: FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > &\n ReactFieldApi<\n TParentData,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > = reactiveFieldApi as never\n\n extendedApi.Field = Field as never\n\n return extendedApi\n }, [\n fieldApi,\n opts.mode,\n reactiveStateValue,\n reactiveMetaIsTouched,\n reactiveMetaIsBlurred,\n reactiveMetaIsDirty,\n reactiveMetaErrorMap,\n reactiveMetaErrorSourceMap,\n reactiveMetaIsValidating,\n ])\n\n useIsomorphicLayoutEffect(fieldApi.mount, [fieldApi])\n\n /**\n * fieldApi.update should not have any side effects. Think of it like a `useRef`\n * that we need to keep updated every render with the most up-to-date information.\n */\n useIsomorphicLayoutEffect(() => {\n fieldApi.update(opts)\n })\n\n return extendedFieldApi\n}\n\n/**\n * @param children A render function that takes a field API instance and returns a React element.\n */\ninterface FieldComponentProps<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n ExtendedApi = {},\n> extends UseFieldOptions<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n> {\n children: (\n fieldApi: FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > &\n ExtendedApi,\n ) => ReactNode\n}\n\ninterface FieldComponentBoundProps<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n ExtendedApi = {},\n> extends UseFieldOptionsBound<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n> {\n children: (\n fieldApi: FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > &\n ExtendedApi,\n ) => ReactNode\n}\n\n/**\n * A type alias representing a field component for a specific form data type.\n */\nexport type FieldComponent<\n in out TParentData,\n in out TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnChangeAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnBlurAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnSubmitAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnDynamicAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n in out TPatentSubmitMeta,\n in out ExtendedApi = {},\n> = <\n const TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n>({\n children,\n ...fieldOptions\n}: FieldComponentBoundProps<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta,\n ExtendedApi\n>) => ReturnType<FunctionComponent>\n\n/**\n * A type alias representing a field component for a form lens data type.\n */\nexport type LensFieldComponent<\n in out TLensData,\n in out TParentSubmitMeta,\n in out ExtendedApi = {},\n> = <\n const TName extends DeepKeys<TLensData>,\n TData extends DeepValue<TLensData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnChange extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n>({\n children,\n ...fieldOptions\n}: Omit<\n FieldComponentBoundProps<\n unknown,\n string,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n TParentSubmitMeta,\n ExtendedApi\n >,\n 'name' | 'validators'\n> & {\n name: TName\n validators?: Omit<\n FieldValidators<\n unknown,\n string,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n >,\n 'onChangeListenTo' | 'onBlurListenTo'\n > & {\n /**\n * An optional list of field names that should trigger this field's `onChange` and `onChangeAsync` events when its value changes\n */\n onChangeListenTo?: DeepKeys<TLensData>[]\n /**\n * An optional list of field names that should trigger this field's `onBlur` and `onBlurAsync` events when its value changes\n */\n onBlurListenTo?: DeepKeys<TLensData>[]\n }\n}) => ReturnType<FunctionComponent>\n\n/**\n * A function component that takes field options and a render function as children and returns a React component.\n *\n * The `Field` component uses the `useField` hook internally to manage the field instance.\n */\nexport const Field = (<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n>({\n children,\n ...fieldOptions\n}: FieldComponentProps<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n>): ReturnType<FunctionComponent> => {\n const fieldApi = useField(fieldOptions as any)\n\n const jsxToDisplay = useMemo(\n () => functionalUpdate(children, fieldApi as any),\n [children, fieldApi],\n )\n return (<>{jsxToDisplay}</>) as never\n}) satisfies FunctionComponent<\n FieldComponentProps<\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any\n >\n>\n"],"names":["useStore","useIsomorphicLayoutEffect","useMemo"],"mappings":";;;;;;;;AA0IO;AA6DL;AAAsD;AACzC;AACA;AAGb;AACE;AAAoB;AACf;AACJ;AAOH;AACE;AAAA;AACe;AACR;AACJ;AAEH;AAAmD;AAKrD;AAA2BA;AAChB;AAGY;AAIvB;AAA8BA;AACnB;AACa;AAExB;AAA8BA;AACnB;AACa;AAExB;AAA4BA;AACjB;AACa;AAExB;AAA6BA;AAClB;AACa;AAExB;AAAmCA;AACxB;AACa;AAExB;AAAiCA;AACtB;AACa;AAIxB;AACE;AAAyB;AACpB;AAED;AAAO;AAAA;AAAA;AAI4C;AAE/C;AAAO;AACa;AACP;AACA;AACF;AACC;AACM;AACF;AAAA;AAElB;AAAA;AAEJ;AAGF;AAwCA;AAEA;AAAO;AACN;AACD;AACK;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AAGFC;AAMAA;AACE;AAAoB;AAGtB;AACF;AAkVO;AAgCL;AACA;AAEF;AAyBE;AAEA;AAAqBC;AAC6B;AAC7B;AAErB;AACF;;;"} | ||
| {"version":3,"file":"useField.cjs","sources":["../../src/useField.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo, useState } from 'react'\nimport { useStore } from '@tanstack/react-store'\nimport { FieldApi, functionalUpdate } from '@tanstack/form-core'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\nimport type {\n AnyFieldApi,\n AnyFieldMeta,\n DeepKeys,\n DeepValue,\n FieldAsyncValidateOrFn,\n FieldValidateOrFn,\n FieldValidators,\n FormAsyncValidateOrFn,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type { FunctionComponent, ReactNode } from 'react'\nimport type { UseFieldOptions, UseFieldOptionsBound } from './types'\n\n/**\n * A type representing a hook for using a field in a form with the given form data type.\n *\n * A function that takes an optional object with a `name` property and field options, and returns a `FieldApi` instance for the specified field.\n */\nexport type UseField<\n TParentData,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n> = <\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n>(\n opts: UseFieldOptionsBound<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n >,\n) => FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n>\n\n/**\n * A hook for managing a field in a form.\n * @param opts An object with field options.\n *\n * @returns The `FieldApi` instance for the specified field.\n */\nexport function useField<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n>(\n opts: UseFieldOptions<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n >,\n) {\n // Keep a snapshot of options so that React Compiler doesn't\n // wrongly optimize fieldApi.\n const [prevOptions, setPrevOptions] = useState(() => ({\n form: opts.form,\n name: opts.name,\n }))\n\n const [fieldApi, setFieldApi] = useState(() => {\n return new FieldApi({\n ...opts,\n })\n })\n\n // We only want to\n // update on name changes since those are at risk of becoming stale. The field\n // state must be up to date for the internal JSX render.\n // The other options can freely be in `fieldApi.update`\n if (prevOptions.form !== opts.form || prevOptions.name !== opts.name) {\n setFieldApi(\n new FieldApi({\n ...opts,\n }),\n )\n setPrevOptions({ form: opts.form, name: opts.name })\n }\n\n // For array mode, only track length changes to avoid re-renders when child properties change\n // See: https://github.com/TanStack/form/issues/1925\n const reactiveStateValue = useStore(\n fieldApi.store,\n (opts.mode === 'array'\n ? (state) => Object.keys((state.value as unknown) ?? []).length\n : (state) => state.value) as (\n state: typeof fieldApi.state,\n ) => TData | number,\n )\n const reactiveMetaIsTouched = useStore(\n fieldApi.store,\n (state) => state.meta.isTouched,\n )\n const reactiveMetaIsBlurred = useStore(\n fieldApi.store,\n (state) => state.meta.isBlurred,\n )\n const reactiveMetaIsDirty = useStore(\n fieldApi.store,\n (state) => state.meta.isDirty,\n )\n const reactiveMetaErrorMap = useStore(\n fieldApi.store,\n (state) => state.meta.errorMap,\n )\n const reactiveMetaErrorSourceMap = useStore(\n fieldApi.store,\n (state) => state.meta.errorSourceMap,\n )\n const reactiveMetaIsValidating = useStore(\n fieldApi.store,\n (state) => state.meta.isValidating,\n )\n\n // This makes me sad, but if I understand correctly, this is what we have to do for reactivity to work properly with React compiler.\n const extendedFieldApi = useMemo(() => {\n const reactiveFieldApi = {\n ...fieldApi,\n get state() {\n return {\n // For array mode, reactiveStateValue is the length (for reactivity tracking),\n // so we need to get the actual value from fieldApi\n value:\n opts.mode === 'array' ? fieldApi.state.value : reactiveStateValue,\n get meta() {\n return {\n ...fieldApi.state.meta,\n isTouched: reactiveMetaIsTouched,\n isBlurred: reactiveMetaIsBlurred,\n isDirty: reactiveMetaIsDirty,\n errorMap: reactiveMetaErrorMap,\n errorSourceMap: reactiveMetaErrorSourceMap,\n isValidating: reactiveMetaIsValidating,\n } satisfies AnyFieldMeta\n },\n } satisfies AnyFieldApi['state']\n },\n }\n\n const extendedApi: FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > = reactiveFieldApi as never\n\n return extendedApi\n }, [\n fieldApi,\n opts.mode,\n reactiveStateValue,\n reactiveMetaIsTouched,\n reactiveMetaIsBlurred,\n reactiveMetaIsDirty,\n reactiveMetaErrorMap,\n reactiveMetaErrorSourceMap,\n reactiveMetaIsValidating,\n ])\n\n useIsomorphicLayoutEffect(fieldApi.mount, [fieldApi])\n\n /**\n * fieldApi.update should not have any side effects. Think of it like a `useRef`\n * that we need to keep updated every render with the most up-to-date information.\n */\n useIsomorphicLayoutEffect(() => {\n fieldApi.update(opts)\n })\n\n return extendedFieldApi\n}\n\n/**\n * @param children A render function that takes a field API instance and returns a React element.\n */\ninterface FieldComponentProps<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n ExtendedApi = {},\n> extends UseFieldOptions<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n> {\n children: (\n fieldApi: FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > &\n ExtendedApi,\n ) => ReactNode\n}\n\ninterface FieldComponentBoundProps<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n ExtendedApi = {},\n> extends UseFieldOptionsBound<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n> {\n children: (\n fieldApi: FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > &\n ExtendedApi,\n ) => ReactNode\n}\n\n/**\n * A type alias representing a field component for a specific form data type.\n */\nexport type FieldComponent<\n in out TParentData,\n in out TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnChangeAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnBlurAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnSubmitAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnDynamicAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n in out TPatentSubmitMeta,\n in out ExtendedApi = {},\n> = <\n const TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n>({\n children,\n ...fieldOptions\n}: FieldComponentBoundProps<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta,\n ExtendedApi\n>) => ReturnType<FunctionComponent>\n\n/**\n * A type alias representing a field component for a form lens data type.\n */\nexport type LensFieldComponent<\n in out TLensData,\n in out TParentSubmitMeta,\n in out ExtendedApi = {},\n> = <\n const TName extends DeepKeys<TLensData>,\n TData extends DeepValue<TLensData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnChange extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n>({\n children,\n ...fieldOptions\n}: Omit<\n FieldComponentBoundProps<\n unknown,\n string,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n TParentSubmitMeta,\n ExtendedApi\n >,\n 'name' | 'validators'\n> & {\n name: TName\n validators?: Omit<\n FieldValidators<\n unknown,\n string,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n >,\n 'onChangeListenTo' | 'onBlurListenTo'\n > & {\n /**\n * An optional list of field names that should trigger this field's `onChange` and `onChangeAsync` events when its value changes\n */\n onChangeListenTo?: DeepKeys<TLensData>[]\n /**\n * An optional list of field names that should trigger this field's `onBlur` and `onBlurAsync` events when its value changes\n */\n onBlurListenTo?: DeepKeys<TLensData>[]\n }\n}) => ReturnType<FunctionComponent>\n\n/**\n * A function component that takes field options and a render function as children and returns a React component.\n *\n * The `Field` component uses the `useField` hook internally to manage the field instance.\n */\nexport const Field = (<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n>({\n children,\n ...fieldOptions\n}: FieldComponentProps<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n>): ReturnType<FunctionComponent> => {\n const fieldApi = useField(fieldOptions as any)\n\n const jsxToDisplay = useMemo(\n () => functionalUpdate(children, fieldApi as any),\n [children, fieldApi],\n )\n return (<>{jsxToDisplay}</>) as never\n}) satisfies FunctionComponent<\n FieldComponentProps<\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any\n >\n>\n"],"names":["useStore","useIsomorphicLayoutEffect","useMemo"],"mappings":";;;;;;;;AAyGO;AA6DL;AAAsD;AACzC;AACA;AAGb;AACE;AAAoB;AACf;AACJ;AAOH;AACE;AAAA;AACe;AACR;AACJ;AAEH;AAAmD;AAKrD;AAA2BA;AAChB;AAGY;AAIvB;AAA8BA;AACnB;AACa;AAExB;AAA8BA;AACnB;AACa;AAExB;AAA4BA;AACjB;AACa;AAExB;AAA6BA;AAClB;AACa;AAExB;AAAmCA;AACxB;AACa;AAExB;AAAiCA;AACtB;AACa;AAIxB;AACE;AAAyB;AACpB;AAED;AAAO;AAAA;AAAA;AAI4C;AAE/C;AAAO;AACa;AACP;AACA;AACF;AACC;AACM;AACF;AAAA;AAElB;AAAA;AAEJ;AAGF;AA0BA;AAAO;AACN;AACD;AACK;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AAGFC;AAMAA;AACE;AAAoB;AAGtB;AACF;AAkVO;AAgCL;AACA;AAEF;AAyBE;AAEA;AAAqBC;AAC6B;AAC7B;AAErB;AACF;;;"} |
| import { FieldApi, DeepKeys, DeepValue, FieldAsyncValidateOrFn, FieldValidateOrFn, FieldValidators, FormAsyncValidateOrFn, FormValidateOrFn } from '@tanstack/form-core'; | ||
| import { FunctionComponent, ReactNode } from 'react'; | ||
| import { UseFieldOptions, UseFieldOptionsBound } from './types.cjs'; | ||
| interface ReactFieldApi<TParentData, TFormOnMount extends undefined | FormValidateOrFn<TParentData>, TFormOnChange extends undefined | FormValidateOrFn<TParentData>, TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnBlur extends undefined | FormValidateOrFn<TParentData>, TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>, TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>, TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>, TPatentSubmitMeta> { | ||
| /** | ||
| * A pre-bound and type-safe sub-field component using this field as a root. | ||
| */ | ||
| Field: FieldComponent<TParentData, TFormOnMount, TFormOnChange, TFormOnChangeAsync, TFormOnBlur, TFormOnBlurAsync, TFormOnSubmit, TFormOnSubmitAsync, TFormOnDynamic, TFormOnDynamicAsync, TFormOnServer, TPatentSubmitMeta>; | ||
| } | ||
| /** | ||
@@ -22,3 +16,3 @@ * A type representing a hook for using a field in a form with the given form data type. | ||
| */ | ||
| export declare function useField<TParentData, TName extends DeepKeys<TParentData>, TData extends DeepValue<TParentData, TName>, TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnChangeAsync extends undefined | FieldAsyncValidateOrFn<TParentData, TName, TData>, TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnBlurAsync extends undefined | FieldAsyncValidateOrFn<TParentData, TName, TData>, TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnSubmitAsync extends undefined | FieldAsyncValidateOrFn<TParentData, TName, TData>, TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnDynamicAsync extends undefined | FieldAsyncValidateOrFn<TParentData, TName, TData>, TFormOnMount extends undefined | FormValidateOrFn<TParentData>, TFormOnChange extends undefined | FormValidateOrFn<TParentData>, TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnBlur extends undefined | FormValidateOrFn<TParentData>, TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>, TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>, TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>, TPatentSubmitMeta>(opts: UseFieldOptions<TParentData, TName, TData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnDynamic, TOnDynamicAsync, TFormOnMount, TFormOnChange, TFormOnChangeAsync, TFormOnBlur, TFormOnBlurAsync, TFormOnSubmit, TFormOnSubmitAsync, TFormOnDynamic, TFormOnDynamicAsync, TFormOnServer, TPatentSubmitMeta>): FieldApi<TParentData, TName, TData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnDynamic, TOnDynamicAsync, TFormOnMount, TFormOnChange, TFormOnChangeAsync, TFormOnBlur, TFormOnBlurAsync, TFormOnSubmit, TFormOnSubmitAsync, TFormOnDynamic, TFormOnDynamicAsync, TFormOnServer, TPatentSubmitMeta> & ReactFieldApi<TParentData, TFormOnMount, TFormOnChange, TFormOnChangeAsync, TFormOnBlur, TFormOnBlurAsync, TFormOnSubmit, TFormOnSubmitAsync, TFormOnDynamic, TFormOnDynamicAsync, TFormOnServer, TPatentSubmitMeta>; | ||
| export declare function useField<TParentData, TName extends DeepKeys<TParentData>, TData extends DeepValue<TParentData, TName>, TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnChangeAsync extends undefined | FieldAsyncValidateOrFn<TParentData, TName, TData>, TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnBlurAsync extends undefined | FieldAsyncValidateOrFn<TParentData, TName, TData>, TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnSubmitAsync extends undefined | FieldAsyncValidateOrFn<TParentData, TName, TData>, TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnDynamicAsync extends undefined | FieldAsyncValidateOrFn<TParentData, TName, TData>, TFormOnMount extends undefined | FormValidateOrFn<TParentData>, TFormOnChange extends undefined | FormValidateOrFn<TParentData>, TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnBlur extends undefined | FormValidateOrFn<TParentData>, TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>, TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>, TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>, TPatentSubmitMeta>(opts: UseFieldOptions<TParentData, TName, TData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnDynamic, TOnDynamicAsync, TFormOnMount, TFormOnChange, TFormOnChangeAsync, TFormOnBlur, TFormOnBlurAsync, TFormOnSubmit, TFormOnSubmitAsync, TFormOnDynamic, TFormOnDynamicAsync, TFormOnServer, TPatentSubmitMeta>): FieldApi<TParentData, TName, TData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnDynamic, TOnDynamicAsync, TFormOnMount, TFormOnChange, TFormOnChangeAsync, TFormOnBlur, TFormOnBlurAsync, TFormOnSubmit, TFormOnSubmitAsync, TFormOnDynamic, TFormOnDynamicAsync, TFormOnServer, TPatentSubmitMeta>; | ||
| /** | ||
@@ -25,0 +19,0 @@ * @param children A render function that takes a field API instance and returns a React element. |
@@ -44,6 +44,3 @@ "use client"; | ||
| const AppField2 = (({ children, ...props2 }) => { | ||
| return /* @__PURE__ */ jsx(form.Field, { ...props2, children: (field) => ( | ||
| // eslint-disable-next-line @eslint-react/no-context-provider | ||
| /* @__PURE__ */ jsx(fieldContext2.Provider, { value: field, children: children(Object.assign(field, fieldComponents)) }) | ||
| ) }); | ||
| return /* @__PURE__ */ jsx(form.Field, { ...props2, children: (field) => /* @__PURE__ */ jsx(fieldContext2.Provider, { value: field, children: children(Object.assign(field, fieldComponents)) }) }); | ||
| }); | ||
@@ -50,0 +47,0 @@ return AppField2; |
@@ -1,1 +0,1 @@ | ||
| {"version":3,"file":"createFormHook.js","sources":["../../src/createFormHook.tsx"],"sourcesContent":["'use client'\n/* eslint-disable @eslint-react/no-context-provider */\nimport { createContext, useContext, useMemo } from 'react'\nimport { useForm } from './useForm'\nimport { useFieldGroup } from './useFieldGroup'\nimport type {\n AnyFieldApi,\n AnyFormApi,\n BaseFormOptions,\n DeepKeysOfType,\n FieldApi,\n FieldsMap,\n FormAsyncValidateOrFn,\n FormOptions,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type {\n ComponentType,\n Context,\n FunctionComponent,\n PropsWithChildren,\n} from 'react'\nimport type { FieldComponent } from './useField'\nimport type { ReactFormExtendedApi } from './useForm'\nimport type { AppFieldExtendedReactFieldGroupApi } from './useFieldGroup'\n\n// We should never hit the `null` case here\nconst fieldContext = createContext<AnyFieldApi>(null as never)\nconst formContext = createContext<AnyFormApi>(null as never)\n\n/**\n * TypeScript inferencing is weird.\n *\n * If you have:\n *\n * @example\n *\n * interface Args<T> {\n * arg?: T\n * }\n *\n * function test<T>(arg?: Partial<Args<T>>): T {\n * return 0 as any;\n * }\n *\n * const a = test({});\n *\n * Then `T` will default to `unknown`.\n *\n * However, if we change `test` to be:\n *\n * @example\n *\n * function test<T extends undefined>(arg?: Partial<Args<T>>): T;\n *\n * Then `T` becomes `undefined`.\n *\n * Here, we are checking if the passed type `T` extends `DefaultT` and **only**\n * `DefaultT`, as if that's the case we assume that inferencing has not occurred.\n */\ntype UnwrapOrAny<T> = [unknown] extends [T] ? any : T\ntype UnwrapDefaultOrAny<DefaultT, T> = [DefaultT] extends [T]\n ? [T] extends [DefaultT]\n ? any\n : T\n : T\n\nfunction useFormContext() {\n const form = useContext(formContext)\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n if (!form) {\n throw new Error(\n '`formContext` only works when within a `formComponent` passed to `createFormHook`',\n )\n }\n\n return form as ReactFormExtendedApi<\n // If you need access to the form data, you need to use `withForm` instead\n Record<string, never>,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any\n >\n}\n\nexport function createFormHookContexts() {\n function useFieldContext<TData>() {\n const field = useContext(fieldContext)\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n if (!field) {\n throw new Error(\n '`fieldContext` only works when within a `fieldComponent` passed to `createFormHook`',\n )\n }\n\n return field as FieldApi<\n any,\n string,\n TData,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any\n >\n }\n\n return { fieldContext, useFieldContext, useFormContext, formContext }\n}\n\ninterface CreateFormHookProps<\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n> {\n fieldComponents: TFieldComponents\n fieldContext: Context<AnyFieldApi>\n formComponents: TFormComponents\n formContext: Context<AnyFormApi>\n}\n\n/**\n * @private\n */\nexport type AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n> = ReactFormExtendedApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n> &\n NoInfer<TFormComponents> & {\n AppField: FieldComponent<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n NoInfer<TFieldComponents>\n >\n AppForm: ComponentType<\n // PropsWithChildren<P> is not optional in React 17\n PropsWithChildren<{}>\n >\n }\n\nexport interface WithFormProps<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n TRenderProps extends object = Record<string, never>,\n> extends FormOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n> {\n // Optional, but adds props to the `render` function outside of `form`\n props?: TRenderProps\n render: FunctionComponent<\n PropsWithChildren<\n NoInfer<TRenderProps> & {\n form: AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TFieldComponents,\n TFormComponents\n >\n }\n >\n >\n}\n\nexport interface WithFieldGroupProps<\n TFieldGroupData,\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n TSubmitMeta,\n TRenderProps extends object = Record<string, never>,\n> extends BaseFormOptions<TFieldGroupData, TSubmitMeta> {\n // Optional, but adds props to the `render` function outside of `form`\n props?: TRenderProps\n render: FunctionComponent<\n PropsWithChildren<\n NoInfer<TRenderProps> & {\n group: AppFieldExtendedReactFieldGroupApi<\n unknown,\n TFieldGroupData,\n string | FieldsMap<unknown, TFieldGroupData>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n // this types it as 'never' in the render prop. It should prevent any\n // untyped meta passed to the handleSubmit by accident.\n unknown extends TSubmitMeta ? never : TSubmitMeta,\n TFieldComponents,\n TFormComponents\n >\n }\n >\n >\n}\n\nexport function createFormHook<\n const TComponents extends Record<string, ComponentType<any>>,\n const TFormComponents extends Record<string, ComponentType<any>>,\n>({\n fieldComponents,\n fieldContext,\n formContext,\n formComponents,\n}: CreateFormHookProps<TComponents, TFormComponents>) {\n function useAppForm<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n >(\n props: FormOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >,\n ): AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n > {\n const form = useForm(props)\n\n // PropsWithChildren<P> is not optional in React 17\n const AppForm = useMemo<ComponentType<PropsWithChildren<{}>>>(() => {\n return ({ children }) => {\n return (\n <formContext.Provider value={form}>{children}</formContext.Provider>\n )\n }\n }, [form])\n\n const AppField = useMemo(() => {\n const AppField = (({ children, ...props }) => {\n return (\n <form.Field {...props}>\n {(field) => (\n // eslint-disable-next-line @eslint-react/no-context-provider\n <fieldContext.Provider value={field}>\n {children(Object.assign(field, fieldComponents))}\n </fieldContext.Provider>\n )}\n </form.Field>\n )\n }) as FieldComponent<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents\n >\n return AppField\n }, [form])\n\n const extendedForm = useMemo(() => {\n return Object.assign(form, {\n AppField,\n AppForm,\n ...formComponents,\n })\n }, [form, AppField, AppForm])\n\n return extendedForm\n }\n\n function withForm<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n TRenderProps extends object = {},\n >({\n render,\n props,\n }: WithFormProps<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents,\n TRenderProps\n >): WithFormProps<\n UnwrapOrAny<TFormData>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnMount>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnChange>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnChangeAsync>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnBlur>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnBlurAsync>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnSubmit>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnSubmitAsync>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnDynamic>,\n UnwrapDefaultOrAny<\n undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync\n >,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnServer>,\n UnwrapOrAny<TSubmitMeta>,\n UnwrapOrAny<TComponents>,\n UnwrapOrAny<TFormComponents>,\n UnwrapOrAny<TRenderProps>\n >['render'] {\n return function Render(innerProps) {\n return render({ ...props, ...innerProps })\n }\n }\n\n function withFieldGroup<\n TFieldGroupData,\n TSubmitMeta,\n TRenderProps extends object = {},\n >({\n render,\n props,\n defaultValues,\n }: WithFieldGroupProps<\n TFieldGroupData,\n TComponents,\n TFormComponents,\n TSubmitMeta,\n TRenderProps\n >): <\n TFormData,\n TFields extends\n | DeepKeysOfType<TFormData, TFieldGroupData | null | undefined>\n | FieldsMap<TFormData, TFieldGroupData>,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TFormSubmitMeta,\n >(\n params: PropsWithChildren<\n NoInfer<TRenderProps> & {\n form:\n | AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n unknown extends TSubmitMeta ? TFormSubmitMeta : TSubmitMeta,\n TComponents,\n TFormComponents\n >\n | AppFieldExtendedReactFieldGroupApi<\n // Since this only occurs if you nest it within other field groups, it can be more\n // lenient with the types.\n unknown,\n TFormData,\n string | FieldsMap<unknown, TFormData>,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n unknown extends TSubmitMeta ? TFormSubmitMeta : TSubmitMeta,\n TComponents,\n TFormComponents\n >\n fields: TFields\n }\n >,\n ) => ReturnType<FunctionComponent> {\n return function Render(innerProps) {\n const fieldGroupProps = useMemo(() => {\n return {\n form: innerProps.form,\n fields: innerProps.fields,\n defaultValues,\n formComponents,\n }\n }, [innerProps.form, innerProps.fields])\n const fieldGroupApi = useFieldGroup(fieldGroupProps as any)\n\n return render({ ...props, ...innerProps, group: fieldGroupApi as any })\n }\n }\n\n /**\n * ⚠️ **Use withForm whenever possible.**\n *\n * Gets a typed form from the `<form.AppForm />` context.\n */\n function useTypedAppFormContext<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n >(\n _props: FormOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >,\n ): AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n > {\n const form = useFormContext()\n\n return form as never\n }\n\n function extendForm<\n const TNewField extends Record<string, ComponentType<any>> & {\n [K in keyof TComponents]?: 'Error: field component names must be unique — this key already exists in the base form'\n },\n const TNewForm extends Record<string, ComponentType<any>> & {\n [K in keyof TFormComponents]?: 'Error: form component names must be unique — this key already exists in the base form'\n },\n >(extension: { fieldComponents?: TNewField; formComponents?: TNewForm }) {\n return createFormHook({\n fieldContext,\n formContext,\n fieldComponents: {\n ...fieldComponents,\n ...extension.fieldComponents,\n } as TComponents & TNewField,\n formComponents: {\n ...formComponents,\n ...extension.formComponents,\n } as TFormComponents & TNewForm,\n })\n }\n\n return {\n useAppForm,\n withForm,\n withFieldGroup,\n useTypedAppFormContext,\n extendForm,\n }\n}\n"],"names":["fieldContext","formContext","AppField"],"mappings":";;;;;AA2BA;AACA;AAuCA;AACE;AAGA;AACE;AAAU;AACR;AAAA;AAIJ;AAeF;AAEO;AACL;AACE;AAGA;AACE;AAAU;AACR;AAAA;AAIJ;AAAO;AA2BT;AACF;AA+JO;AAGL;AACA;AACAA;AACAC;AAEF;AACE;AA4CE;AAGA;AACE;AACE;AAC+C;AAEjD;AAGF;AACE;AACE;AAEM;AAAA;AAIA;AAEJ;AAiBJ;AAAOC;AAGT;AACE;AAA2B;AACzB;AACA;AACG;AACJ;AAGH;AAAO;AAGT;AAcE;AACA;AACA;AAqCA;AACE;AAAyC;AAC3C;AAGF;AAIE;AACA;AACA;AACA;AAmEA;AACE;AACE;AAAO;AACY;AACE;AACnB;AACA;AAAA;AAGJ;AAEA;AAAsE;AACxE;AAQF;AA4CE;AAEA;AAAO;AAGT;AAQE;AAAsB;AACpBF;AACAC;AACiB;AACZ;AACU;AAAA;AAEC;AACX;AACU;AAAA;AAEhB;AAGH;AAAO;AACL;AACA;AACA;AACA;AACA;AAEJ;;;;;"} | ||
| {"version":3,"file":"createFormHook.js","sources":["../../src/createFormHook.tsx"],"sourcesContent":["'use client'\n/* eslint-disable @eslint-react/no-context-provider */\nimport { createContext, useContext, useMemo } from 'react'\nimport { useForm } from './useForm'\nimport { useFieldGroup } from './useFieldGroup'\nimport type {\n AnyFieldApi,\n AnyFormApi,\n BaseFormOptions,\n DeepKeysOfType,\n FieldApi,\n FieldsMap,\n FormAsyncValidateOrFn,\n FormOptions,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type {\n ComponentType,\n Context,\n FunctionComponent,\n PropsWithChildren,\n} from 'react'\nimport type { FieldComponent } from './useField'\nimport type { ReactFormExtendedApi } from './useForm'\nimport type { AppFieldExtendedReactFieldGroupApi } from './useFieldGroup'\n\n// We should never hit the `null` case here\nconst fieldContext = createContext<AnyFieldApi>(null as never)\nconst formContext = createContext<AnyFormApi>(null as never)\n\n/**\n * TypeScript inferencing is weird.\n *\n * If you have:\n *\n * @example\n *\n * interface Args<T> {\n * arg?: T\n * }\n *\n * function test<T>(arg?: Partial<Args<T>>): T {\n * return 0 as any;\n * }\n *\n * const a = test({});\n *\n * Then `T` will default to `unknown`.\n *\n * However, if we change `test` to be:\n *\n * @example\n *\n * function test<T extends undefined>(arg?: Partial<Args<T>>): T;\n *\n * Then `T` becomes `undefined`.\n *\n * Here, we are checking if the passed type `T` extends `DefaultT` and **only**\n * `DefaultT`, as if that's the case we assume that inferencing has not occurred.\n */\ntype UnwrapOrAny<T> = [unknown] extends [T] ? any : T\ntype UnwrapDefaultOrAny<DefaultT, T> = [DefaultT] extends [T]\n ? [T] extends [DefaultT]\n ? any\n : T\n : T\n\nfunction useFormContext() {\n const form = useContext(formContext)\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n if (!form) {\n throw new Error(\n '`formContext` only works when within a `formComponent` passed to `createFormHook`',\n )\n }\n\n return form as ReactFormExtendedApi<\n // If you need access to the form data, you need to use `withForm` instead\n Record<string, never>,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any\n >\n}\n\nexport function createFormHookContexts() {\n function useFieldContext<TData>() {\n const field = useContext(fieldContext)\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n if (!field) {\n throw new Error(\n '`fieldContext` only works when within a `fieldComponent` passed to `createFormHook`',\n )\n }\n\n return field as FieldApi<\n any,\n string,\n TData,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any\n >\n }\n\n return { fieldContext, useFieldContext, useFormContext, formContext }\n}\n\ninterface CreateFormHookProps<\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n> {\n fieldComponents: TFieldComponents\n fieldContext: Context<AnyFieldApi>\n formComponents: TFormComponents\n formContext: Context<AnyFormApi>\n}\n\n/**\n * @private\n */\nexport type AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n> = ReactFormExtendedApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n> &\n NoInfer<TFormComponents> & {\n AppField: FieldComponent<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n NoInfer<TFieldComponents>\n >\n AppForm: ComponentType<\n // PropsWithChildren<P> is not optional in React 17\n PropsWithChildren<{}>\n >\n }\n\nexport interface WithFormProps<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n TRenderProps extends object = Record<string, never>,\n> extends FormOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n> {\n // Optional, but adds props to the `render` function outside of `form`\n props?: TRenderProps\n render: FunctionComponent<\n PropsWithChildren<\n NoInfer<TRenderProps> & {\n form: AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TFieldComponents,\n TFormComponents\n >\n }\n >\n >\n}\n\nexport interface WithFieldGroupProps<\n TFieldGroupData,\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n TSubmitMeta,\n TRenderProps extends object = Record<string, never>,\n> extends BaseFormOptions<TFieldGroupData, TSubmitMeta> {\n // Optional, but adds props to the `render` function outside of `form`\n props?: TRenderProps\n render: FunctionComponent<\n PropsWithChildren<\n NoInfer<TRenderProps> & {\n group: AppFieldExtendedReactFieldGroupApi<\n unknown,\n TFieldGroupData,\n string | FieldsMap<unknown, TFieldGroupData>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n // this types it as 'never' in the render prop. It should prevent any\n // untyped meta passed to the handleSubmit by accident.\n unknown extends TSubmitMeta ? never : TSubmitMeta,\n TFieldComponents,\n TFormComponents\n >\n }\n >\n >\n}\n\nexport function createFormHook<\n const TComponents extends Record<string, ComponentType<any>>,\n const TFormComponents extends Record<string, ComponentType<any>>,\n>({\n fieldComponents,\n fieldContext,\n formContext,\n formComponents,\n}: CreateFormHookProps<TComponents, TFormComponents>) {\n function useAppForm<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n >(\n props: FormOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >,\n ): AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n > {\n const form = useForm(props)\n\n // PropsWithChildren<P> is not optional in React 17\n const AppForm = useMemo<ComponentType<PropsWithChildren<{}>>>(() => {\n return ({ children }) => {\n return (\n <formContext.Provider value={form}>{children}</formContext.Provider>\n )\n }\n }, [form])\n\n const AppField = useMemo(() => {\n const AppField = (({ children, ...props }) => {\n return (\n <form.Field {...props}>\n {(field) => (\n <fieldContext.Provider value={field}>\n {children(Object.assign(field, fieldComponents))}\n </fieldContext.Provider>\n )}\n </form.Field>\n )\n }) as FieldComponent<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents\n >\n return AppField\n }, [form])\n\n const extendedForm = useMemo(() => {\n return Object.assign(form, {\n AppField,\n AppForm,\n ...formComponents,\n })\n }, [form, AppField, AppForm])\n\n return extendedForm\n }\n\n function withForm<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n TRenderProps extends object = {},\n >({\n render,\n props,\n }: WithFormProps<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents,\n TRenderProps\n >): WithFormProps<\n UnwrapOrAny<TFormData>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnMount>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnChange>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnChangeAsync>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnBlur>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnBlurAsync>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnSubmit>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnSubmitAsync>,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnDynamic>,\n UnwrapDefaultOrAny<\n undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync\n >,\n UnwrapDefaultOrAny<undefined | FormValidateOrFn<TFormData>, TOnServer>,\n UnwrapOrAny<TSubmitMeta>,\n UnwrapOrAny<TComponents>,\n UnwrapOrAny<TFormComponents>,\n UnwrapOrAny<TRenderProps>\n >['render'] {\n return function Render(innerProps) {\n return render({ ...props, ...innerProps })\n }\n }\n\n function withFieldGroup<\n TFieldGroupData,\n TSubmitMeta,\n TRenderProps extends object = {},\n >({\n render,\n props,\n defaultValues,\n }: WithFieldGroupProps<\n TFieldGroupData,\n TComponents,\n TFormComponents,\n TSubmitMeta,\n TRenderProps\n >): <\n TFormData,\n TFields extends\n | DeepKeysOfType<TFormData, TFieldGroupData | null | undefined>\n | FieldsMap<TFormData, TFieldGroupData>,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TFormSubmitMeta,\n >(\n params: PropsWithChildren<\n NoInfer<TRenderProps> & {\n form:\n | AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n unknown extends TSubmitMeta ? TFormSubmitMeta : TSubmitMeta,\n TComponents,\n TFormComponents\n >\n | AppFieldExtendedReactFieldGroupApi<\n // Since this only occurs if you nest it within other field groups, it can be more\n // lenient with the types.\n unknown,\n TFormData,\n string | FieldsMap<unknown, TFormData>,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n unknown extends TSubmitMeta ? TFormSubmitMeta : TSubmitMeta,\n TComponents,\n TFormComponents\n >\n fields: TFields\n }\n >,\n ) => ReturnType<FunctionComponent> {\n return function Render(innerProps) {\n const fieldGroupProps = useMemo(() => {\n return {\n form: innerProps.form,\n fields: innerProps.fields,\n defaultValues,\n formComponents,\n }\n }, [innerProps.form, innerProps.fields])\n const fieldGroupApi = useFieldGroup(fieldGroupProps as any)\n\n return render({ ...props, ...innerProps, group: fieldGroupApi as any })\n }\n }\n\n /**\n * ⚠️ **Use withForm whenever possible.**\n *\n * Gets a typed form from the `<form.AppForm />` context.\n */\n function useTypedAppFormContext<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n >(\n _props: FormOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >,\n ): AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n > {\n const form = useFormContext()\n\n return form as never\n }\n\n function extendForm<\n const TNewField extends Record<string, ComponentType<any>> & {\n [K in keyof TComponents]?: 'Error: field component names must be unique — this key already exists in the base form'\n },\n const TNewForm extends Record<string, ComponentType<any>> & {\n [K in keyof TFormComponents]?: 'Error: form component names must be unique — this key already exists in the base form'\n },\n >(extension: { fieldComponents?: TNewField; formComponents?: TNewForm }) {\n return createFormHook({\n fieldContext,\n formContext,\n fieldComponents: {\n ...fieldComponents,\n ...extension.fieldComponents,\n } as TComponents & TNewField,\n formComponents: {\n ...formComponents,\n ...extension.formComponents,\n } as TFormComponents & TNewForm,\n })\n }\n\n return {\n useAppForm,\n withForm,\n withFieldGroup,\n useTypedAppFormContext,\n extendForm,\n }\n}\n"],"names":["fieldContext","formContext","AppField"],"mappings":";;;;;AA2BA;AACA;AAuCA;AACE;AAGA;AACE;AAAU;AACR;AAAA;AAIJ;AAeF;AAEO;AACL;AACE;AAGA;AACE;AAAU;AACR;AAAA;AAIJ;AAAO;AA2BT;AACF;AA+JO;AAGL;AACA;AACAA;AACAC;AAEF;AACE;AA4CE;AAGA;AACE;AACE;AAC+C;AAEjD;AAGF;AACE;AACE;AAOE;AAiBJ;AAAOC;AAGT;AACE;AAA2B;AACzB;AACA;AACG;AACJ;AAGH;AAAO;AAGT;AAcE;AACA;AACA;AAqCA;AACE;AAAyC;AAC3C;AAGF;AAIE;AACA;AACA;AACA;AAmEA;AACE;AACE;AAAO;AACY;AACE;AACnB;AACA;AAAA;AAGJ;AAEA;AAAsE;AACxE;AAQF;AA4CE;AAEA;AAAO;AAGT;AAQE;AAAsB;AACpBF;AACAC;AACiB;AACZ;AACU;AAAA;AAEC;AACX;AACU;AAAA;AAEhB;AAGH;AAAO;AACL;AACA;AACA;AACA;AACA;AAEJ;;;;;"} |
| import { FieldApi, DeepKeys, DeepValue, FieldAsyncValidateOrFn, FieldValidateOrFn, FieldValidators, FormAsyncValidateOrFn, FormValidateOrFn } from '@tanstack/form-core'; | ||
| import { FunctionComponent, ReactNode } from 'react'; | ||
| import { UseFieldOptions, UseFieldOptionsBound } from './types.js'; | ||
| interface ReactFieldApi<TParentData, TFormOnMount extends undefined | FormValidateOrFn<TParentData>, TFormOnChange extends undefined | FormValidateOrFn<TParentData>, TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnBlur extends undefined | FormValidateOrFn<TParentData>, TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>, TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>, TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>, TPatentSubmitMeta> { | ||
| /** | ||
| * A pre-bound and type-safe sub-field component using this field as a root. | ||
| */ | ||
| Field: FieldComponent<TParentData, TFormOnMount, TFormOnChange, TFormOnChangeAsync, TFormOnBlur, TFormOnBlurAsync, TFormOnSubmit, TFormOnSubmitAsync, TFormOnDynamic, TFormOnDynamicAsync, TFormOnServer, TPatentSubmitMeta>; | ||
| } | ||
| /** | ||
@@ -22,3 +16,3 @@ * A type representing a hook for using a field in a form with the given form data type. | ||
| */ | ||
| export declare function useField<TParentData, TName extends DeepKeys<TParentData>, TData extends DeepValue<TParentData, TName>, TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnChangeAsync extends undefined | FieldAsyncValidateOrFn<TParentData, TName, TData>, TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnBlurAsync extends undefined | FieldAsyncValidateOrFn<TParentData, TName, TData>, TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnSubmitAsync extends undefined | FieldAsyncValidateOrFn<TParentData, TName, TData>, TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnDynamicAsync extends undefined | FieldAsyncValidateOrFn<TParentData, TName, TData>, TFormOnMount extends undefined | FormValidateOrFn<TParentData>, TFormOnChange extends undefined | FormValidateOrFn<TParentData>, TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnBlur extends undefined | FormValidateOrFn<TParentData>, TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>, TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>, TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>, TPatentSubmitMeta>(opts: UseFieldOptions<TParentData, TName, TData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnDynamic, TOnDynamicAsync, TFormOnMount, TFormOnChange, TFormOnChangeAsync, TFormOnBlur, TFormOnBlurAsync, TFormOnSubmit, TFormOnSubmitAsync, TFormOnDynamic, TFormOnDynamicAsync, TFormOnServer, TPatentSubmitMeta>): FieldApi<TParentData, TName, TData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnDynamic, TOnDynamicAsync, TFormOnMount, TFormOnChange, TFormOnChangeAsync, TFormOnBlur, TFormOnBlurAsync, TFormOnSubmit, TFormOnSubmitAsync, TFormOnDynamic, TFormOnDynamicAsync, TFormOnServer, TPatentSubmitMeta> & ReactFieldApi<TParentData, TFormOnMount, TFormOnChange, TFormOnChangeAsync, TFormOnBlur, TFormOnBlurAsync, TFormOnSubmit, TFormOnSubmitAsync, TFormOnDynamic, TFormOnDynamicAsync, TFormOnServer, TPatentSubmitMeta>; | ||
| export declare function useField<TParentData, TName extends DeepKeys<TParentData>, TData extends DeepValue<TParentData, TName>, TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnChangeAsync extends undefined | FieldAsyncValidateOrFn<TParentData, TName, TData>, TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnBlurAsync extends undefined | FieldAsyncValidateOrFn<TParentData, TName, TData>, TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnSubmitAsync extends undefined | FieldAsyncValidateOrFn<TParentData, TName, TData>, TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>, TOnDynamicAsync extends undefined | FieldAsyncValidateOrFn<TParentData, TName, TData>, TFormOnMount extends undefined | FormValidateOrFn<TParentData>, TFormOnChange extends undefined | FormValidateOrFn<TParentData>, TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnBlur extends undefined | FormValidateOrFn<TParentData>, TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>, TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>, TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>, TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>, TPatentSubmitMeta>(opts: UseFieldOptions<TParentData, TName, TData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnDynamic, TOnDynamicAsync, TFormOnMount, TFormOnChange, TFormOnChangeAsync, TFormOnBlur, TFormOnBlurAsync, TFormOnSubmit, TFormOnSubmitAsync, TFormOnDynamic, TFormOnDynamicAsync, TFormOnServer, TPatentSubmitMeta>): FieldApi<TParentData, TName, TData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnDynamic, TOnDynamicAsync, TFormOnMount, TFormOnChange, TFormOnChangeAsync, TFormOnBlur, TFormOnBlurAsync, TFormOnSubmit, TFormOnSubmitAsync, TFormOnDynamic, TFormOnDynamicAsync, TFormOnServer, TPatentSubmitMeta>; | ||
| /** | ||
@@ -25,0 +19,0 @@ * @param children A render function that takes a field API instance and returns a React element. |
@@ -76,3 +76,2 @@ "use client"; | ||
| const extendedApi = reactiveFieldApi; | ||
| extendedApi.Field = Field; | ||
| return extendedApi; | ||
@@ -79,0 +78,0 @@ }, [ |
@@ -1,1 +0,1 @@ | ||
| {"version":3,"file":"useField.js","sources":["../../src/useField.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo, useRef, useState } from 'react'\nimport { useStore } from '@tanstack/react-store'\nimport { FieldApi, functionalUpdate } from '@tanstack/form-core'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\nimport type {\n AnyFieldApi,\n AnyFieldMeta,\n DeepKeys,\n DeepValue,\n FieldAsyncValidateOrFn,\n FieldValidateOrFn,\n FieldValidators,\n FormAsyncValidateOrFn,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type { FunctionComponent, ReactElement, ReactNode } from 'react'\nimport type { UseFieldOptions, UseFieldOptionsBound } from './types'\n\ninterface ReactFieldApi<\n TParentData,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n> {\n /**\n * A pre-bound and type-safe sub-field component using this field as a root.\n */\n Field: FieldComponent<\n TParentData,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n >\n}\n\n/**\n * A type representing a hook for using a field in a form with the given form data type.\n *\n * A function that takes an optional object with a `name` property and field options, and returns a `FieldApi` instance for the specified field.\n */\nexport type UseField<\n TParentData,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n> = <\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n>(\n opts: UseFieldOptionsBound<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n >,\n) => FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n>\n\n/**\n * A hook for managing a field in a form.\n * @param opts An object with field options.\n *\n * @returns The `FieldApi` instance for the specified field.\n */\nexport function useField<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n>(\n opts: UseFieldOptions<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n >,\n) {\n // Keep a snapshot of options so that React Compiler doesn't\n // wrongly optimize fieldApi.\n const [prevOptions, setPrevOptions] = useState(() => ({\n form: opts.form,\n name: opts.name,\n }))\n\n const [fieldApi, setFieldApi] = useState(() => {\n return new FieldApi({\n ...opts,\n })\n })\n\n // We only want to\n // update on name changes since those are at risk of becoming stale. The field\n // state must be up to date for the internal JSX render.\n // The other options can freely be in `fieldApi.update`\n if (prevOptions.form !== opts.form || prevOptions.name !== opts.name) {\n setFieldApi(\n new FieldApi({\n ...opts,\n }),\n )\n setPrevOptions({ form: opts.form, name: opts.name })\n }\n\n // For array mode, only track length changes to avoid re-renders when child properties change\n // See: https://github.com/TanStack/form/issues/1925\n const reactiveStateValue = useStore(\n fieldApi.store,\n (opts.mode === 'array'\n ? (state) => Object.keys((state.value as unknown) ?? []).length\n : (state) => state.value) as (\n state: typeof fieldApi.state,\n ) => TData | number,\n )\n const reactiveMetaIsTouched = useStore(\n fieldApi.store,\n (state) => state.meta.isTouched,\n )\n const reactiveMetaIsBlurred = useStore(\n fieldApi.store,\n (state) => state.meta.isBlurred,\n )\n const reactiveMetaIsDirty = useStore(\n fieldApi.store,\n (state) => state.meta.isDirty,\n )\n const reactiveMetaErrorMap = useStore(\n fieldApi.store,\n (state) => state.meta.errorMap,\n )\n const reactiveMetaErrorSourceMap = useStore(\n fieldApi.store,\n (state) => state.meta.errorSourceMap,\n )\n const reactiveMetaIsValidating = useStore(\n fieldApi.store,\n (state) => state.meta.isValidating,\n )\n\n // This makes me sad, but if I understand correctly, this is what we have to do for reactivity to work properly with React compiler.\n const extendedFieldApi = useMemo(() => {\n const reactiveFieldApi = {\n ...fieldApi,\n get state() {\n return {\n // For array mode, reactiveStateValue is the length (for reactivity tracking),\n // so we need to get the actual value from fieldApi\n value:\n opts.mode === 'array' ? fieldApi.state.value : reactiveStateValue,\n get meta() {\n return {\n ...fieldApi.state.meta,\n isTouched: reactiveMetaIsTouched,\n isBlurred: reactiveMetaIsBlurred,\n isDirty: reactiveMetaIsDirty,\n errorMap: reactiveMetaErrorMap,\n errorSourceMap: reactiveMetaErrorSourceMap,\n isValidating: reactiveMetaIsValidating,\n } satisfies AnyFieldMeta\n },\n } satisfies AnyFieldApi['state']\n },\n }\n\n const extendedApi: FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > &\n ReactFieldApi<\n TParentData,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > = reactiveFieldApi as never\n\n extendedApi.Field = Field as never\n\n return extendedApi\n }, [\n fieldApi,\n opts.mode,\n reactiveStateValue,\n reactiveMetaIsTouched,\n reactiveMetaIsBlurred,\n reactiveMetaIsDirty,\n reactiveMetaErrorMap,\n reactiveMetaErrorSourceMap,\n reactiveMetaIsValidating,\n ])\n\n useIsomorphicLayoutEffect(fieldApi.mount, [fieldApi])\n\n /**\n * fieldApi.update should not have any side effects. Think of it like a `useRef`\n * that we need to keep updated every render with the most up-to-date information.\n */\n useIsomorphicLayoutEffect(() => {\n fieldApi.update(opts)\n })\n\n return extendedFieldApi\n}\n\n/**\n * @param children A render function that takes a field API instance and returns a React element.\n */\ninterface FieldComponentProps<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n ExtendedApi = {},\n> extends UseFieldOptions<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n> {\n children: (\n fieldApi: FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > &\n ExtendedApi,\n ) => ReactNode\n}\n\ninterface FieldComponentBoundProps<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n ExtendedApi = {},\n> extends UseFieldOptionsBound<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n> {\n children: (\n fieldApi: FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > &\n ExtendedApi,\n ) => ReactNode\n}\n\n/**\n * A type alias representing a field component for a specific form data type.\n */\nexport type FieldComponent<\n in out TParentData,\n in out TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnChangeAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnBlurAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnSubmitAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnDynamicAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n in out TPatentSubmitMeta,\n in out ExtendedApi = {},\n> = <\n const TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n>({\n children,\n ...fieldOptions\n}: FieldComponentBoundProps<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta,\n ExtendedApi\n>) => ReturnType<FunctionComponent>\n\n/**\n * A type alias representing a field component for a form lens data type.\n */\nexport type LensFieldComponent<\n in out TLensData,\n in out TParentSubmitMeta,\n in out ExtendedApi = {},\n> = <\n const TName extends DeepKeys<TLensData>,\n TData extends DeepValue<TLensData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnChange extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n>({\n children,\n ...fieldOptions\n}: Omit<\n FieldComponentBoundProps<\n unknown,\n string,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n TParentSubmitMeta,\n ExtendedApi\n >,\n 'name' | 'validators'\n> & {\n name: TName\n validators?: Omit<\n FieldValidators<\n unknown,\n string,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n >,\n 'onChangeListenTo' | 'onBlurListenTo'\n > & {\n /**\n * An optional list of field names that should trigger this field's `onChange` and `onChangeAsync` events when its value changes\n */\n onChangeListenTo?: DeepKeys<TLensData>[]\n /**\n * An optional list of field names that should trigger this field's `onBlur` and `onBlurAsync` events when its value changes\n */\n onBlurListenTo?: DeepKeys<TLensData>[]\n }\n}) => ReturnType<FunctionComponent>\n\n/**\n * A function component that takes field options and a render function as children and returns a React component.\n *\n * The `Field` component uses the `useField` hook internally to manage the field instance.\n */\nexport const Field = (<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n>({\n children,\n ...fieldOptions\n}: FieldComponentProps<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n>): ReturnType<FunctionComponent> => {\n const fieldApi = useField(fieldOptions as any)\n\n const jsxToDisplay = useMemo(\n () => functionalUpdate(children, fieldApi as any),\n [children, fieldApi],\n )\n return (<>{jsxToDisplay}</>) as never\n}) satisfies FunctionComponent<\n FieldComponentProps<\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any\n >\n>\n"],"names":[],"mappings":";;;;;;AA0IO;AA6DL;AAAsD;AACzC;AACA;AAGb;AACE;AAAoB;AACf;AACJ;AAOH;AACE;AAAA;AACe;AACR;AACJ;AAEH;AAAmD;AAKrD;AAA2B;AAChB;AAGY;AAIvB;AAA8B;AACnB;AACa;AAExB;AAA8B;AACnB;AACa;AAExB;AAA4B;AACjB;AACa;AAExB;AAA6B;AAClB;AACa;AAExB;AAAmC;AACxB;AACa;AAExB;AAAiC;AACtB;AACa;AAIxB;AACE;AAAyB;AACpB;AAED;AAAO;AAAA;AAAA;AAI4C;AAE/C;AAAO;AACa;AACP;AACA;AACF;AACC;AACM;AACF;AAAA;AAElB;AAAA;AAEJ;AAGF;AAwCA;AAEA;AAAO;AACN;AACD;AACK;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AAGF;AAMA;AACE;AAAoB;AAGtB;AACF;AAkVO;AAgCL;AACA;AAEF;AAyBE;AAEA;AAAqB;AAC6B;AAC7B;AAErB;AACF;;;;;"} | ||
| {"version":3,"file":"useField.js","sources":["../../src/useField.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo, useState } from 'react'\nimport { useStore } from '@tanstack/react-store'\nimport { FieldApi, functionalUpdate } from '@tanstack/form-core'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\nimport type {\n AnyFieldApi,\n AnyFieldMeta,\n DeepKeys,\n DeepValue,\n FieldAsyncValidateOrFn,\n FieldValidateOrFn,\n FieldValidators,\n FormAsyncValidateOrFn,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type { FunctionComponent, ReactNode } from 'react'\nimport type { UseFieldOptions, UseFieldOptionsBound } from './types'\n\n/**\n * A type representing a hook for using a field in a form with the given form data type.\n *\n * A function that takes an optional object with a `name` property and field options, and returns a `FieldApi` instance for the specified field.\n */\nexport type UseField<\n TParentData,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n> = <\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n>(\n opts: UseFieldOptionsBound<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n >,\n) => FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n>\n\n/**\n * A hook for managing a field in a form.\n * @param opts An object with field options.\n *\n * @returns The `FieldApi` instance for the specified field.\n */\nexport function useField<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n>(\n opts: UseFieldOptions<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n >,\n) {\n // Keep a snapshot of options so that React Compiler doesn't\n // wrongly optimize fieldApi.\n const [prevOptions, setPrevOptions] = useState(() => ({\n form: opts.form,\n name: opts.name,\n }))\n\n const [fieldApi, setFieldApi] = useState(() => {\n return new FieldApi({\n ...opts,\n })\n })\n\n // We only want to\n // update on name changes since those are at risk of becoming stale. The field\n // state must be up to date for the internal JSX render.\n // The other options can freely be in `fieldApi.update`\n if (prevOptions.form !== opts.form || prevOptions.name !== opts.name) {\n setFieldApi(\n new FieldApi({\n ...opts,\n }),\n )\n setPrevOptions({ form: opts.form, name: opts.name })\n }\n\n // For array mode, only track length changes to avoid re-renders when child properties change\n // See: https://github.com/TanStack/form/issues/1925\n const reactiveStateValue = useStore(\n fieldApi.store,\n (opts.mode === 'array'\n ? (state) => Object.keys((state.value as unknown) ?? []).length\n : (state) => state.value) as (\n state: typeof fieldApi.state,\n ) => TData | number,\n )\n const reactiveMetaIsTouched = useStore(\n fieldApi.store,\n (state) => state.meta.isTouched,\n )\n const reactiveMetaIsBlurred = useStore(\n fieldApi.store,\n (state) => state.meta.isBlurred,\n )\n const reactiveMetaIsDirty = useStore(\n fieldApi.store,\n (state) => state.meta.isDirty,\n )\n const reactiveMetaErrorMap = useStore(\n fieldApi.store,\n (state) => state.meta.errorMap,\n )\n const reactiveMetaErrorSourceMap = useStore(\n fieldApi.store,\n (state) => state.meta.errorSourceMap,\n )\n const reactiveMetaIsValidating = useStore(\n fieldApi.store,\n (state) => state.meta.isValidating,\n )\n\n // This makes me sad, but if I understand correctly, this is what we have to do for reactivity to work properly with React compiler.\n const extendedFieldApi = useMemo(() => {\n const reactiveFieldApi = {\n ...fieldApi,\n get state() {\n return {\n // For array mode, reactiveStateValue is the length (for reactivity tracking),\n // so we need to get the actual value from fieldApi\n value:\n opts.mode === 'array' ? fieldApi.state.value : reactiveStateValue,\n get meta() {\n return {\n ...fieldApi.state.meta,\n isTouched: reactiveMetaIsTouched,\n isBlurred: reactiveMetaIsBlurred,\n isDirty: reactiveMetaIsDirty,\n errorMap: reactiveMetaErrorMap,\n errorSourceMap: reactiveMetaErrorSourceMap,\n isValidating: reactiveMetaIsValidating,\n } satisfies AnyFieldMeta\n },\n } satisfies AnyFieldApi['state']\n },\n }\n\n const extendedApi: FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > = reactiveFieldApi as never\n\n return extendedApi\n }, [\n fieldApi,\n opts.mode,\n reactiveStateValue,\n reactiveMetaIsTouched,\n reactiveMetaIsBlurred,\n reactiveMetaIsDirty,\n reactiveMetaErrorMap,\n reactiveMetaErrorSourceMap,\n reactiveMetaIsValidating,\n ])\n\n useIsomorphicLayoutEffect(fieldApi.mount, [fieldApi])\n\n /**\n * fieldApi.update should not have any side effects. Think of it like a `useRef`\n * that we need to keep updated every render with the most up-to-date information.\n */\n useIsomorphicLayoutEffect(() => {\n fieldApi.update(opts)\n })\n\n return extendedFieldApi\n}\n\n/**\n * @param children A render function that takes a field API instance and returns a React element.\n */\ninterface FieldComponentProps<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n ExtendedApi = {},\n> extends UseFieldOptions<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n> {\n children: (\n fieldApi: FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > &\n ExtendedApi,\n ) => ReactNode\n}\n\ninterface FieldComponentBoundProps<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n ExtendedApi = {},\n> extends UseFieldOptionsBound<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n> {\n children: (\n fieldApi: FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > &\n ExtendedApi,\n ) => ReactNode\n}\n\n/**\n * A type alias representing a field component for a specific form data type.\n */\nexport type FieldComponent<\n in out TParentData,\n in out TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnChangeAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnBlurAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnSubmitAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnDynamicAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n in out TPatentSubmitMeta,\n in out ExtendedApi = {},\n> = <\n const TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n>({\n children,\n ...fieldOptions\n}: FieldComponentBoundProps<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta,\n ExtendedApi\n>) => ReturnType<FunctionComponent>\n\n/**\n * A type alias representing a field component for a form lens data type.\n */\nexport type LensFieldComponent<\n in out TLensData,\n in out TParentSubmitMeta,\n in out ExtendedApi = {},\n> = <\n const TName extends DeepKeys<TLensData>,\n TData extends DeepValue<TLensData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnChange extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n>({\n children,\n ...fieldOptions\n}: Omit<\n FieldComponentBoundProps<\n unknown,\n string,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n TParentSubmitMeta,\n ExtendedApi\n >,\n 'name' | 'validators'\n> & {\n name: TName\n validators?: Omit<\n FieldValidators<\n unknown,\n string,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n >,\n 'onChangeListenTo' | 'onBlurListenTo'\n > & {\n /**\n * An optional list of field names that should trigger this field's `onChange` and `onChangeAsync` events when its value changes\n */\n onChangeListenTo?: DeepKeys<TLensData>[]\n /**\n * An optional list of field names that should trigger this field's `onBlur` and `onBlurAsync` events when its value changes\n */\n onBlurListenTo?: DeepKeys<TLensData>[]\n }\n}) => ReturnType<FunctionComponent>\n\n/**\n * A function component that takes field options and a render function as children and returns a React component.\n *\n * The `Field` component uses the `useField` hook internally to manage the field instance.\n */\nexport const Field = (<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n>({\n children,\n ...fieldOptions\n}: FieldComponentProps<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n>): ReturnType<FunctionComponent> => {\n const fieldApi = useField(fieldOptions as any)\n\n const jsxToDisplay = useMemo(\n () => functionalUpdate(children, fieldApi as any),\n [children, fieldApi],\n )\n return (<>{jsxToDisplay}</>) as never\n}) satisfies FunctionComponent<\n FieldComponentProps<\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any\n >\n>\n"],"names":[],"mappings":";;;;;;AAyGO;AA6DL;AAAsD;AACzC;AACA;AAGb;AACE;AAAoB;AACf;AACJ;AAOH;AACE;AAAA;AACe;AACR;AACJ;AAEH;AAAmD;AAKrD;AAA2B;AAChB;AAGY;AAIvB;AAA8B;AACnB;AACa;AAExB;AAA8B;AACnB;AACa;AAExB;AAA4B;AACjB;AACa;AAExB;AAA6B;AAClB;AACa;AAExB;AAAmC;AACxB;AACa;AAExB;AAAiC;AACtB;AACa;AAIxB;AACE;AAAyB;AACpB;AAED;AAAO;AAAA;AAAA;AAI4C;AAE/C;AAAO;AACa;AACP;AACA;AACF;AACC;AACM;AACF;AAAA;AAElB;AAAA;AAEJ;AAGF;AA0BA;AAAO;AACN;AACD;AACK;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AAGF;AAMA;AACE;AAAoB;AAGtB;AACF;AAkVO;AAgCL;AACA;AAEF;AAyBE;AAEA;AAAqB;AAC6B;AAC7B;AAErB;AACF;;;;;"} |
+2
-2
| { | ||
| "name": "@tanstack/react-form", | ||
| "version": "1.29.1", | ||
| "version": "1.29.2", | ||
| "description": "Powerful, type-safe forms for React.", | ||
@@ -41,3 +41,3 @@ "author": "tannerlinsley", | ||
| "@tanstack/react-store": "^0.9.1", | ||
| "@tanstack/form-core": "1.29.1" | ||
| "@tanstack/form-core": "1.29.2" | ||
| }, | ||
@@ -44,0 +44,0 @@ "devDependencies": { |
@@ -362,3 +362,2 @@ 'use client' | ||
| {(field) => ( | ||
| // eslint-disable-next-line @eslint-react/no-context-provider | ||
| <fieldContext.Provider value={field}> | ||
@@ -365,0 +364,0 @@ {children(Object.assign(field, fieldComponents))} |
+3
-52
| 'use client' | ||
| import { useMemo, useRef, useState } from 'react' | ||
| import { useMemo, useState } from 'react' | ||
| import { useStore } from '@tanstack/react-store' | ||
@@ -18,38 +18,5 @@ import { FieldApi, functionalUpdate } from '@tanstack/form-core' | ||
| } from '@tanstack/form-core' | ||
| import type { FunctionComponent, ReactElement, ReactNode } from 'react' | ||
| import type { FunctionComponent, ReactNode } from 'react' | ||
| import type { UseFieldOptions, UseFieldOptionsBound } from './types' | ||
| interface ReactFieldApi< | ||
| TParentData, | ||
| TFormOnMount extends undefined | FormValidateOrFn<TParentData>, | ||
| TFormOnChange extends undefined | FormValidateOrFn<TParentData>, | ||
| TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>, | ||
| TFormOnBlur extends undefined | FormValidateOrFn<TParentData>, | ||
| TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>, | ||
| TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>, | ||
| TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>, | ||
| TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>, | ||
| TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>, | ||
| TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>, | ||
| TPatentSubmitMeta, | ||
| > { | ||
| /** | ||
| * A pre-bound and type-safe sub-field component using this field as a root. | ||
| */ | ||
| Field: FieldComponent< | ||
| TParentData, | ||
| TFormOnMount, | ||
| TFormOnChange, | ||
| TFormOnChangeAsync, | ||
| TFormOnBlur, | ||
| TFormOnBlurAsync, | ||
| TFormOnSubmit, | ||
| TFormOnSubmitAsync, | ||
| TFormOnDynamic, | ||
| TFormOnDynamicAsync, | ||
| TFormOnServer, | ||
| TPatentSubmitMeta | ||
| > | ||
| } | ||
| /** | ||
@@ -309,20 +276,4 @@ * A type representing a hook for using a field in a form with the given form data type. | ||
| TPatentSubmitMeta | ||
| > & | ||
| ReactFieldApi< | ||
| TParentData, | ||
| TFormOnMount, | ||
| TFormOnChange, | ||
| TFormOnChangeAsync, | ||
| TFormOnBlur, | ||
| TFormOnBlurAsync, | ||
| TFormOnSubmit, | ||
| TFormOnSubmitAsync, | ||
| TFormOnDynamic, | ||
| TFormOnDynamicAsync, | ||
| TFormOnServer, | ||
| TPatentSubmitMeta | ||
| > = reactiveFieldApi as never | ||
| > = reactiveFieldApi as never | ||
| extendedApi.Field = Field as never | ||
| return extendedApi | ||
@@ -329,0 +280,0 @@ }, [ |
New alerts
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
Fixed alerts
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
Worsened metrics
- Total package byte prevSize
455703
-1.68%- Lines of code
3479
-1.81%Dependency changes
+ Added
@tanstack/form-core@1.29.2(transitive)- Removed
@tanstack/form-core@1.29.1(transitive)Updated
@tanstack/form-core@1.29.2