chore!: drop support for TypeScript 5.0 and below

Author: crutchcorn

docs/typescript.md

@@ -8,7 +8,7 @@ TanStack Form is written 100% in **TypeScript** with the highest quality generic
 Things to keep in mind:
 
 - `strict: true` is required in your `tsconfig.json` to get the most out of TanStack Form's types
-- Types currently require using TypeScript v4.8 or greater
+- Types currently require using TypeScript v5.1 or greater
 - Changes to types in this repository are considered **non-breaking** and are usually released as **patch** semver changes (otherwise every type enhancement would be a major version!).
 - It is **highly recommended that you lock your react-form package version to a specific patch release and upgrade with the expectation that types may be fixed or upgraded between any release**
 - The non-type-related public API of TanStack Form still follows semver very strictly.

package.json

@@ -62,8 +62,6 @@
     "sherif": "^1.0.1",
     "solid-js": "^1.9.3",
     "typescript": "5.4.5",
-    "typescript49": "npm:[email protected]",
-    "typescript50": "npm:[email protected]",
     "typescript51": "npm:[email protected]",
     "typescript52": "npm:[email protected]",
     "typescript53": "npm:[email protected]",

packages/form-core/package.json

@@ -18,8 +18,6 @@
     "clean": "rimraf ./dist && rimraf ./coverage",
     "test:eslint": "eslint ./src ./tests",
     "test:types": "pnpm run \"/^test:types:ts[0-9]{2}$/\"",
-    "test:types:ts49": "node ../../node_modules/typescript49/lib/tsc.js -p tsconfig.legacy.json",
-    "test:types:ts50": "node ../../node_modules/typescript50/lib/tsc.js",
     "test:types:ts51": "node ../../node_modules/typescript51/lib/tsc.js",
     "test:types:ts52": "node ../../node_modules/typescript52/lib/tsc.js",
     "test:types:ts53": "node ../../node_modules/typescript53/lib/tsc.js",

packages/form-core/tsconfig.legacy.json

@@ -18,7 +18,6 @@
     "clean": "rimraf ./build && rimraf ./coverage",
     "test:eslint": "eslint ./src ./tests",
     "test:types": "pnpm run \"/^test:types:ts[0-9]{2}$/\"",
-    "test:types:ts50": "node ../../node_modules/typescript50/lib/tsc.js",
     "test:types:ts51": "node ../../node_modules/typescript51/lib/tsc.js",
     "test:types:ts52": "node ../../node_modules/typescript52/lib/tsc.js",
     "test:types:ts53": "node ../../node_modules/typescript53/lib/tsc.js",

packages/lit-form/package.json

@@ -18,8 +18,6 @@
     "clean": "rimraf ./dist && rimraf ./coverage",
     "test:eslint": "eslint ./src ./tests",
     "test:types": "pnpm run \"/^test:types:ts[0-9]{2}$/\"",
-    "test:types:ts49": "node ../../node_modules/typescript49/lib/tsc.js -p tsconfig.legacy.json",
-    "test:types:ts50": "node ../../node_modules/typescript50/lib/tsc.js -p tsconfig.legacy.json",
     "test:types:ts51": "node ../../node_modules/typescript51/lib/tsc.js",
     "test:types:ts52": "node ../../node_modules/typescript52/lib/tsc.js",
     "test:types:ts53": "node ../../node_modules/typescript53/lib/tsc.js",

packages/react-form/package.json

@@ -28,11 +28,3 @@ export type UseFieldOptions<
 > & {
   mode?: 'value' | 'array'
 }
-
-/**
- * The return type of React.ReactNode appears to change between React 4.9 and 5.0
- *
- * This means that if we replace this type with React.ReactNode, there will be
- * random typings the fail between React 4.9 and 5.0. This is a hack that resolves this issue.
- */
-export type NodeType = ReturnType<FunctionComponent>

packages/react-form/src/types.ts

@@ -1,9 +1,9 @@
-import React, { useState } from 'react'
+import React, { ReactNode, useState } from 'react'
 import { useStore } from '@tanstack/react-store'
 import { FieldApi, functionalUpdate } from '@tanstack/form-core'
 import { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'
 import type { FunctionComponent } from 'react'
-import type { NodeType, UseFieldOptions } from './types'
+import type { UseFieldOptions } from './types'
 import type { DeepKeys, DeepValue, Validator } from '@tanstack/form-core'
 
 interface ReactFieldApi<
@@ -125,7 +125,7 @@ type FieldComponentProps<
       TFormValidator,
       TData
     >,
-  ) => NodeType
+  ) => ReactNode
 } & UseFieldOptions<TParentData, TName, TFieldValidator, TFormValidator, TData>
 
 /**
@@ -154,7 +154,7 @@ export type FieldComponent<
     TData
   >,
   'form'
->) => NodeType
+>) => ReactNode
 
 /**
  * A function component that takes field options and a render function as children and returns a React component.
@@ -180,7 +180,7 @@ export const Field = (<
   TFieldValidator,
   TFormValidator,
   TData
->): NodeType => {
+>): ReactNode => {
   const fieldApi = useField(fieldOptions as any)
 
   return (<>{functionalUpdate(children, fieldApi as any)}</>) as never

packages/react-form/src/useField.tsx

@@ -3,10 +3,10 @@ import { useStore } from '@tanstack/react-store'
 import React, { useState } from 'react'
 import { Field, useField } from './useField'
 import { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'
+import type { ReactNode } from 'react'
 import type { FieldComponent, UseField } from './useField'
 import type { NoInfer } from '@tanstack/react-store'
 import type { FormOptions, FormState, Validator } from '@tanstack/form-core'
-import type { NodeType } from './types'
 
 /**
  * Fields that are added onto the `FormAPI` from `@tanstack/form-core` and returned from `useForm`
@@ -33,20 +33,9 @@ export interface ReactFormApi<
    * 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.
    */
   Subscribe: <TSelected = NoInfer<FormState<TFormData>>>(props: {
-    /**
-      TypeScript versions <=5.0.4 have a bug that prevents
-      the type of the `TSelected` generic from being inferred
-      from the return type of this method.
-
-      In these versions, `TSelected` will fall back to the default
-      type (or `unknown` if that's not defined).
-
-      @see {@link https://github.com/TanStack/form/pull/606/files#r1506715714 | This discussion on GitHub for the details}
-      @see {@link https://github.com/microsoft/TypeScript/issues/52786 | The bug report in `microsoft/TypeScript`}
-      */
     selector?: (state: NoInfer<FormState<TFormData>>) => TSelected
-    children: ((state: NoInfer<TSelected>) => NodeType) | NodeType
-  }) => NodeType
+    children: ((state: NoInfer<TSelected>) => ReactNode) | ReactNode
+  }) => ReactNode
 }
 
 /**