chore: some more missing generics

Author: Harry Whorlow

packages/form-core/src/formOptions.ts

@@ -4,6 +4,7 @@ import type { FormOptions } from './FormApi'
 export function formOptions<
   TFormData,
   TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,
->(defaultOpts?: FormOptions<TFormData, TFormValidator>) {
+  TFormSubmitMeta extends object = never,
+>(defaultOpts?: FormOptions<TFormData, TFormValidator, TFormSubmitMeta>) {
   return defaultOpts
 }

packages/form-core/src/mergeForm.ts

@@ -36,9 +36,14 @@ export function mutateMergeDeep(target: object, source: object): object {
 export function mergeForm<
   TFormData,
   TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,
+  TFormSubmitMeta extends object = never,
 >(
-  baseForm: FormApi<NoInfer<TFormData>, NoInfer<TFormValidator>>,
-  state: Partial<FormApi<TFormData, TFormValidator>['state']>,
+  baseForm: FormApi<
+    NoInfer<TFormData>,
+    NoInfer<TFormValidator>,
+    NoInfer<TFormSubmitMeta>
+  >,
+  state: Partial<FormApi<TFormData, TFormValidator, TFormSubmitMeta>['state']>,
 ) {
   mutateMergeDeep(baseForm.state, state)
   return baseForm

packages/form-core/tests/FieldApi.spec.ts

@@ -1744,6 +1744,10 @@ describe('field api', () => {
       defaultValues: {
         name: '',
       },
+      onSubmitMeta: {} as { dino: string },
+      onSubmit: async ({ meta }) => {
+        expect(meta.dino).toEqual('Stegosaurus')
+      },
     })
     form.mount()
 
@@ -1758,6 +1762,7 @@ describe('field api', () => {
     })
 
     nameField.mount()
+
     expect(nameField.getMeta().errors).toEqual(['THERE IS AN ERROR'])
   })
 })

packages/react-form/src/useField.tsx

@@ -11,11 +11,12 @@ interface ReactFieldApi<
   TFormValidator extends
     | Validator<TParentData, unknown>
     | undefined = undefined,
+  TParentMetaExtension extends object = never,
 > {
   /**
    * A pre-bound and type-safe sub-field component using this field as a root.
    */
-  Field: FieldComponent<TParentData, TFormValidator>
+  Field: FieldComponent<TParentData, TFormValidator, TParentMetaExtension>
 }
 
 /**
@@ -28,6 +29,7 @@ export type UseField<
   TFormValidator extends
     | Validator<TParentData, unknown>
     | undefined = undefined,
+  TParentMetaExtension extends object = never,
 > = <
   TName extends DeepKeys<TParentData>,
   TFieldValidator extends
@@ -36,10 +38,24 @@ export type UseField<
   TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>,
 >(
   opts: Omit<
-    UseFieldOptions<TParentData, TName, TFieldValidator, TFormValidator, TData>,
+    UseFieldOptions<
+      TParentData,
+      TName,
+      TFieldValidator,
+      TFormValidator,
+      TData,
+      TParentMetaExtension
+    >,
     'form'
   >,
-) => FieldApi<TParentData, TName, TFieldValidator, TFormValidator, TData>
+) => FieldApi<
+  TParentData,
+  TName,
+  TFieldValidator,
+  TFormValidator,
+  TData,
+  TParentMetaExtension
+>
 
 /**
  * A hook for managing a field in a form.
@@ -57,13 +73,15 @@ export function useField<
     | Validator<TParentData, unknown>
     | undefined = undefined,
   TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>,
+  TParentMetaExtension extends object = never,
 >(
   opts: UseFieldOptions<
     TParentData,
     TName,
     TFieldValidator,
     TFormValidator,
-    TData
+    TData,
+    TParentMetaExtension
   >,
 ) {
   const [fieldApi] = useState(() => {
@@ -73,7 +91,8 @@ export function useField<
       name: opts.name,
     })
 
-    const extendedApi: typeof api & ReactFieldApi<TParentData, TFormValidator> =
+    const extendedApi: typeof api &
+      ReactFieldApi<TParentData, TFormValidator, TParentMetaExtension> =
       api as never
 
     extendedApi.Field = Field as never
@@ -207,4 +226,6 @@ export const Field = (<
     [children, fieldApi, fieldApi.state.value, fieldApi.state.meta],
   )
   return (<>{jsxToDisplay}</>) as never
-}) satisfies FunctionComponent<FieldComponentProps<any, any, any, any, any>>
+}) satisfies FunctionComponent<
+  FieldComponentProps<any, any, any, any, any, any>
+>

packages/react-form/src/useForm.tsx

@@ -14,12 +14,12 @@ import type { FormOptions, FormState, Validator } from '@tanstack/form-core'
 export interface ReactFormApi<
   TFormData,
   TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,
-  TParentMetaExtension extends object = never,
+  TFormSubmitMeta extends object = never,
 > {
   /**
    * A React component to render form fields. With this, you can render and manage individual form fields.
    */
-  Field: FieldComponent<TFormData, TFormValidator, TParentMetaExtension>
+  Field: FieldComponent<TFormData, TFormValidator, TFormSubmitMeta>
   /**
    * A `Subscribe` function that allows you to listen and react to changes in the form's state. It's especially useful when you need to execute side effects or render specific components in response to state updates.
    */

packages/react-form/src/useTransform.ts

@@ -3,10 +3,13 @@ import type { FormApi, FormTransform, Validator } from '@tanstack/form-core'
 export function useTransform<
   TFormData,
   TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,
+  TFormSubmitMeta extends object = never,
 >(
-  fn: (formBase: FormApi<any, any>) => FormApi<TFormData, TFormValidator>,
+  fn: (
+    formBase: FormApi<any, any, any>,
+  ) => FormApi<TFormData, TFormValidator, TFormSubmitMeta>,
   deps: unknown[],
-): FormTransform<TFormData, TFormValidator> {
+): FormTransform<TFormData, TFormValidator, TFormSubmitMeta> {
   return {
     fn,
     deps,