diff --git a/docs/framework/react/reference/formApi.md b/docs/framework/react/reference/formApi.md index e1d93401d..1a966802c 100644 --- a/docs/framework/react/reference/formApi.md +++ b/docs/framework/react/reference/formApi.md @@ -32,3 +32,4 @@ When using `@tanstack/react-form`, the [core form API](../../reference/formApi) }) => JSX.Element ``` - 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. + > Note that TypeScript `5.0.4` and older versions will incorrectly complain if the `selector` method doesn't return the form's full state (`state`). This is caused by a [bug in TypeScript](https://github.com/TanStack/form/pull/606#discussion_r1506715714), and you can safely ignore it with `//@ts-expect-error` directive. diff --git a/packages/react-form/package.json b/packages/react-form/package.json index 51037d277..3bfaa11ae 100644 --- a/packages/react-form/package.json +++ b/packages/react-form/package.json @@ -15,7 +15,7 @@ "clean": "rimraf ./dist && rimraf ./coverage", "test:eslint": "eslint --ext .ts,.tsx ./src", "test:types:versions49": "node ../../node_modules/typescript49/lib/tsc.js --project tsconfig.legacy.json", - "test:types:versions50": "node ../../node_modules/typescript50/lib/tsc.js", + "test:types:versions50": "node ../../node_modules/typescript50/lib/tsc.js --project tsconfig.50.json", "test:types:versions51": "node ../../node_modules/typescript51/lib/tsc.js", "test:types:versions52": "tsc", "test:types": "pnpm run \"/^test:types:versions.*/\"", diff --git a/packages/react-form/src/useForm.tsx b/packages/react-form/src/useForm.tsx index e69d72db2..a79d24ca7 100644 --- a/packages/react-form/src/useForm.tsx +++ b/packages/react-form/src/useForm.tsx @@ -22,6 +22,17 @@ declare module '@tanstack/form-core' { selector?: (state: NoInfer>) => TSelected, ) => TSelected Subscribe: >>(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>) => TSelected children: ((state: NoInfer) => ReactNode) | ReactNode }) => JSX.Element diff --git a/packages/react-form/tsconfig.50.json b/packages/react-form/tsconfig.50.json new file mode 100644 index 000000000..7eb52de1e --- /dev/null +++ b/packages/react-form/tsconfig.50.json @@ -0,0 +1,4 @@ +{ + "extends": "./tsconfig.json", + "exclude": ["src/tests/**"] +}