fix(form-core): fix typing for formOptions so they don't override additional args passed to form (#1239)

* fix(form-core): fix typing for formOptions so they don't override additional args passed to form

* ci: apply automated fixes and generate docs

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

Author: pavle99

docs/framework/react/reference/functions/createformhook.md

@@ -11,7 +11,7 @@ title: createFormHook
 function createFormHook<TComponents, TFormComponents>(__namedParameters): object
 ```
 
-Defined in: [packages/react-form/src/createFormHook.tsx:186](https://github.com/TanStack/form/blob/main/packages/react-form/src/createFormHook.tsx#L186)
+Defined in: [packages/react-form/src/createFormHook.tsx:188](https://github.com/TanStack/form/blob/main/packages/react-form/src/createFormHook.tsx#L188)
 
 ## Type Parameters
 
@@ -111,7 +111,7 @@ withForm: <TFormData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync
 
 ###### props
 
-`PropsWithChildren`\<`NoInfer`\<`TRenderProps`\> & `object`\>
+`PropsWithChildren`\<`NoInfer`\<`UnwrapOrAny`\<`TRenderProps`\>\> & `object`\>
 
 ##### Returns
 

docs/framework/react/reference/functions/createformhookcontexts.md

@@ -11,7 +11,7 @@ title: createFormHookContexts
 function createFormHookContexts(): object
 ```
 
-Defined in: [packages/react-form/src/createFormHook.tsx:16](https://github.com/TanStack/form/blob/main/packages/react-form/src/createFormHook.tsx#L16)
+Defined in: [packages/react-form/src/createFormHook.tsx:18](https://github.com/TanStack/form/blob/main/packages/react-form/src/createFormHook.tsx#L18)
 
 ## Returns
 

docs/framework/react/reference/functions/usetransform.md

@@ -8,43 +8,21 @@ title: useTransform
 # Function: useTransform()
 
 ```ts
-function useTransform<TFormData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnServer, TSubmitMeta>(fn, deps): FormTransform<TFormData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnServer, TSubmitMeta>
+function useTransform(fn, deps): FormTransform<any, any, any, any, any, any, any, any, any, any>
 ```
 
-Defined in: [packages/react-form/src/useTransform.ts:8](https://github.com/TanStack/form/blob/main/packages/react-form/src/useTransform.ts#L8)
-
-## Type Parameters
-
-• **TFormData**
-
-• **TOnMount** *extends* `undefined` \| `FormValidateOrFn`\<`TFormData`\>
-
-• **TOnChange** *extends* `undefined` \| `FormValidateOrFn`\<`TFormData`\>
-
-• **TOnChangeAsync** *extends* `undefined` \| `FormAsyncValidateOrFn`\<`TFormData`\>
-
-• **TOnBlur** *extends* `undefined` \| `FormValidateOrFn`\<`TFormData`\>
-
-• **TOnBlurAsync** *extends* `undefined` \| `FormAsyncValidateOrFn`\<`TFormData`\>
-
-• **TOnSubmit** *extends* `undefined` \| `FormValidateOrFn`\<`TFormData`\>
-
-• **TOnSubmitAsync** *extends* `undefined` \| `FormAsyncValidateOrFn`\<`TFormData`\>
-
-• **TOnServer** *extends* `undefined` \| `FormAsyncValidateOrFn`\<`TFormData`\>
-
-• **TSubmitMeta**
+Defined in: [packages/react-form/src/useTransform.ts:9](https://github.com/TanStack/form/blob/main/packages/react-form/src/useTransform.ts#L9)
 
 ## Parameters
 
 ### fn
 
-(`formBase`) => `FormApi`\<`TFormData`, `TOnMount`, `TOnChange`, `TOnChangeAsync`, `TOnBlur`, `TOnBlurAsync`, `TOnSubmit`, `TOnSubmitAsync`, `TOnServer`, `TSubmitMeta`\>
+(`formBase`) => `AnyFormApi`
 
 ### deps
 
 `unknown`[]
 
 ## Returns
 
-`FormTransform`\<`TFormData`, `TOnMount`, `TOnChange`, `TOnChangeAsync`, `TOnBlur`, `TOnBlurAsync`, `TOnSubmit`, `TOnSubmitAsync`, `TOnServer`, `TSubmitMeta`\>
+`FormTransform`\<`any`, `any`, `any`, `any`, `any`, `any`, `any`, `any`, `any`, `any`\>

docs/framework/react/reference/interfaces/withformprops.md

@@ -7,7 +7,7 @@ title: WithFormProps
 
 # Interface: WithFormProps\<TFormData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnServer, TSubmitMeta, TFieldComponents, TFormComponents, TRenderProps\>
 
-Defined in: [packages/react-form/src/createFormHook.tsx:136](https://github.com/TanStack/form/blob/main/packages/react-form/src/createFormHook.tsx#L136)
+Defined in: [packages/react-form/src/createFormHook.tsx:138](https://github.com/TanStack/form/blob/main/packages/react-form/src/createFormHook.tsx#L138)
 
 ## Extends
 
@@ -49,7 +49,7 @@ Defined in: [packages/react-form/src/createFormHook.tsx:136](https://github.com/
 optional props: TRenderProps;
 ```
 
-Defined in: [packages/react-form/src/createFormHook.tsx:163](https://github.com/TanStack/form/blob/main/packages/react-form/src/createFormHook.tsx#L163)
+Defined in: [packages/react-form/src/createFormHook.tsx:165](https://github.com/TanStack/form/blob/main/packages/react-form/src/createFormHook.tsx#L165)
 
 ***
 
@@ -59,7 +59,7 @@ Defined in: [packages/react-form/src/createFormHook.tsx:163](https://github.com/
 render: (props) => Element;
 ```
 
-Defined in: [packages/react-form/src/createFormHook.tsx:164](https://github.com/TanStack/form/blob/main/packages/react-form/src/createFormHook.tsx#L164)
+Defined in: [packages/react-form/src/createFormHook.tsx:166](https://github.com/TanStack/form/blob/main/packages/react-form/src/createFormHook.tsx#L166)
 
 #### Parameters
 

docs/reference/functions/formoptions.md

@@ -8,42 +8,21 @@ title: formOptions
 # Function: formOptions()
 
 ```ts
-function formOptions<TFormData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnServer, TSubmitMeta>(defaultOpts?): 
-  | undefined
-| FormOptions<TFormData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnServer, TSubmitMeta>
+function formOptions<T>(defaultOpts): T
 ```
 
 Defined in: [packages/form-core/src/formOptions.ts:7](https://github.com/TanStack/form/blob/main/packages/form-core/src/formOptions.ts#L7)
 
 ## Type Parameters
 
-• **TFormData**
-
-• **TOnMount** *extends* `undefined` \| `FormValidateOrFn`\<`TFormData`\>
-
-• **TOnChange** *extends* `undefined` \| `FormValidateOrFn`\<`TFormData`\>
-
-• **TOnChangeAsync** *extends* `undefined` \| `FormAsyncValidateOrFn`\<`TFormData`\>
-
-• **TOnBlur** *extends* `undefined` \| `FormValidateOrFn`\<`TFormData`\>
-
-• **TOnBlurAsync** *extends* `undefined` \| `FormAsyncValidateOrFn`\<`TFormData`\>
-
-• **TOnSubmit** *extends* `undefined` \| `FormValidateOrFn`\<`TFormData`\>
-
-• **TOnSubmitAsync** *extends* `undefined` \| `FormAsyncValidateOrFn`\<`TFormData`\>
-
-• **TOnServer** *extends* `undefined` \| `FormAsyncValidateOrFn`\<`TFormData`\>
-
-• **TSubmitMeta**
+• **T** *extends* `Partial`\<[`FormOptions`](../interfaces/formoptions.md)\<`any`, `any`, `any`, `any`, `any`, `any`, `any`, `any`, `any`, `any`\>\>
 
 ## Parameters
 
-### defaultOpts?
+### defaultOpts
 
-[`FormOptions`](../interfaces/formoptions.md)\<`TFormData`, `TOnMount`, `TOnChange`, `TOnChangeAsync`, `TOnBlur`, `TOnBlurAsync`, `TOnSubmit`, `TOnSubmitAsync`, `TOnServer`, `TSubmitMeta`\>
+`T`
 
 ## Returns
 
-  \| `undefined`
-  \| [`FormOptions`](../interfaces/formoptions.md)\<`TFormData`, `TOnMount`, `TOnChange`, `TOnChangeAsync`, `TOnBlur`, `TOnBlurAsync`, `TOnSubmit`, `TOnSubmitAsync`, `TOnServer`, `TSubmitMeta`\>
+`T`

docs/reference/interfaces/formoptions.md

@@ -158,7 +158,7 @@ onSubmitMeta, the data passed from the handleSubmit handler, to the onSubmit fun
 ### transform?
 
 ```ts
-optional transform: FormTransform<TFormData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnServer, TSubmitMeta>;
+optional transform: FormTransform<NoInfer<TFormData>, NoInfer<TOnMount>, NoInfer<TOnChange>, NoInfer<TOnChangeAsync>, NoInfer<TOnBlur>, NoInfer<TOnBlurAsync>, NoInfer<TOnSubmit>, NoInfer<TOnSubmitAsync>, NoInfer<TOnServer>, NoInfer<TSubmitMeta>>;
 ```
 
 Defined in: [packages/form-core/src/FormApi.ts:333](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L333)

packages/form-core/src/FormApi.ts

@@ -331,16 +331,16 @@ export interface FormOptions<
     >
   }) => void
   transform?: FormTransform<
-    TFormData,
-    TOnMount,
-    TOnChange,
-    TOnChangeAsync,
-    TOnBlur,
-    TOnBlurAsync,
-    TOnSubmit,
-    TOnSubmitAsync,
-    TOnServer,
-    TSubmitMeta
+    NoInfer<TFormData>,
+    NoInfer<TOnMount>,
+    NoInfer<TOnChange>,
+    NoInfer<TOnChangeAsync>,
+    NoInfer<TOnBlur>,
+    NoInfer<TOnBlurAsync>,
+    NoInfer<TOnSubmit>,
+    NoInfer<TOnSubmitAsync>,
+    NoInfer<TOnServer>,
+    NoInfer<TSubmitMeta>
   >
 }
 

packages/form-core/src/formOptions.ts

@@ -5,29 +5,9 @@ import type {
 } from './FormApi'
 
 export function formOptions<
-  TFormData,
-  TOnMount extends undefined | FormValidateOrFn<TFormData>,
-  TOnChange extends undefined | FormValidateOrFn<TFormData>,
-  TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
-  TOnBlur extends undefined | FormValidateOrFn<TFormData>,
-  TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
-  TOnSubmit extends undefined | FormValidateOrFn<TFormData>,
-  TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
-  TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,
-  TSubmitMeta,
->(
-  defaultOpts?: FormOptions<
-    TFormData,
-    TOnMount,
-    TOnChange,
-    TOnChangeAsync,
-    TOnBlur,
-    TOnBlurAsync,
-    TOnSubmit,
-    TOnSubmitAsync,
-    TOnServer,
-    TSubmitMeta
+  T extends Partial<
+    FormOptions<any, any, any, any, any, any, any, any, any, any>
   >,
-) {
+>(defaultOpts: T) {
   return defaultOpts
 }

packages/form-core/tests/formOptions.test-d.ts

@@ -0,0 +1,78 @@
+import { assertType, describe, expect, it } from 'vitest'
+import { FormApi, formOptions } from '../src/index'
+
+describe('formOptions', () => {
+  it('types should be properly inferred', () => {
+    type Person = {
+      firstName: string
+      lastName: string
+    }
+
+    const formOpts = formOptions({
+      defaultValues: {
+        firstName: 'FirstName',
+        lastName: 'LastName',
+      } as Person,
+    })
+
+    const form = new FormApi({
+      ...formOpts,
+    })
+
+    assertType<Person>(form.state.values)
+  })
+
+  it('types should be properly inferred when passing args alongside formOptions', () => {
+    type Person = {
+      firstName: string
+      lastName: string
+    }
+
+    const formOpts = formOptions({
+      defaultValues: {
+        firstName: 'FirstName',
+        lastName: 'LastName',
+      } as Person,
+    })
+
+    const form = new FormApi({
+      ...formOpts,
+      onSubmitMeta: {
+        test: 'test',
+      },
+    })
+
+    assertType<(submitMeta: { test: string }) => Promise<void>>(
+      form.handleSubmit,
+    )
+  })
+
+  it('types should be properly inferred when formOptions are being overridden', () => {
+    type Person = {
+      firstName: string
+      lastName: string
+    }
+
+    type PersonWithAge = Person & {
+      age: number
+    }
+
+    const formOpts = formOptions({
+      defaultValues: {
+        firstName: 'FirstName',
+        lastName: 'LastName',
+      } as Person,
+    })
+
+    const form = new FormApi({
+      ...formOpts,
+      defaultValues: {
+        firstName: 'FirstName',
+        lastName: 'LastName',
+        age: 10,
+      },
+    })
+
+    assertType<PersonWithAge>(form.state.values)
+  })
+})

packages/react-form/src/createFormHook.tsx

@@ -13,6 +13,8 @@ import type { ComponentType, Context, JSX, PropsWithChildren } from 'react'
 import type { FieldComponent } from './useField'
 import type { ReactFormExtendedApi } from './useForm'
 
+type UnwrapOrAny<T> = [T] extends [unknown] ? any : T
+
 export function createFormHookContexts() {
   // We should never hit the `null` case here
   const fieldContext = createContext<AnyFieldApi>(null as never)
@@ -308,19 +310,19 @@ export function createFormHook<
     TFormComponents,
     TRenderProps
   >): WithFormProps<
-    TFormData,
-    TOnMount,
-    TOnChange,
-    TOnChangeAsync,
-    TOnBlur,
-    TOnBlurAsync,
-    TOnSubmit,
-    TOnSubmitAsync,
-    TOnServer,
-    TSubmitMeta,
-    TComponents,
-    TFormComponents,
-    TRenderProps
+    UnwrapOrAny<TFormData>,
+    UnwrapOrAny<TOnMount>,
+    UnwrapOrAny<TOnChange>,
+    UnwrapOrAny<TOnChangeAsync>,
+    UnwrapOrAny<TOnBlur>,
+    UnwrapOrAny<TOnBlurAsync>,
+    UnwrapOrAny<TOnSubmit>,
+    UnwrapOrAny<TOnSubmitAsync>,
+    UnwrapOrAny<TOnServer>,
+    UnwrapOrAny<TSubmitMeta>,
+    UnwrapOrAny<TComponents>,
+    UnwrapOrAny<TFormComponents>,
+    UnwrapOrAny<TRenderProps>
   >['render'] {
     return (innerProps) => render({ ...props, ...innerProps })
   }

packages/react-form/src/useTransform.ts

@@ -1,49 +1,15 @@
 import type {
+  AnyFormApi,
   FormApi,
   FormAsyncValidateOrFn,
   FormTransform,
   FormValidateOrFn,
 } from '@tanstack/form-core'
 
-export function useTransform<
-  TFormData,
-  TOnMount extends undefined | FormValidateOrFn<TFormData>,
-  TOnChange extends undefined | FormValidateOrFn<TFormData>,
-  TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
-  TOnBlur extends undefined | FormValidateOrFn<TFormData>,
-  TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
-  TOnSubmit extends undefined | FormValidateOrFn<TFormData>,
-  TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
-  TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,
-  TSubmitMeta,
->(
-  fn: (
-    formBase: FormApi<any, any, any, any, any, any, any, any, any, any>,
-  ) => FormApi<
-    TFormData,
-    TOnMount,
-    TOnChange,
-    TOnChangeAsync,
-    TOnBlur,
-    TOnBlurAsync,
-    TOnSubmit,
-    TOnSubmitAsync,
-    TOnServer,
-    TSubmitMeta
-  >,
+export function useTransform(
+  fn: (formBase: AnyFormApi) => AnyFormApi,
   deps: unknown[],
-): FormTransform<
-  TFormData,
-  TOnMount,
-  TOnChange,
-  TOnChangeAsync,
-  TOnBlur,
-  TOnBlurAsync,
-  TOnSubmit,
-  TOnSubmitAsync,
-  TOnServer,
-  TSubmitMeta
-> {
+): FormTransform<any, any, any, any, any, any, any, any, any, any> {
   return {
     fn,
     deps,