[Docs] Error display example is NOT react compiler friendly

[iPwnPancakes]

Describe the bug

When I went to try out Tanstack Form in my existing project (Vite, React 19, Zod, React Compiler), I noticed that none of my Zod errors were even displaying! I was able to reproduce the issue along with a fix, which is basically instead of passing the entire field to the error display component, pass field.state instead.

Your minimal, reproducible example

https://stackblitz.com/edit/vitejs-vite-gc5qns8x?file=src%2Fcomponents%2FFixedFieldInfo.tsx,vite.config.ts,src%2Fcomponents%2FStaleInputField.tsx,src%2Fcomponents%2FFixedInputField.tsx,src%2Fhooks%2Fform.ts,src%2FApp.tsx,src%2Fcomponents%2FStaleFieldInfo.tsx&terminal=dev

Steps to reproduce

1. Go to the stackblitz page
2. Remove characters from either s until there is less than 4 characters
3. Notice how only one shows the error

Expected behavior

I'd expect that following your examples wouldn't break if using React Compiler.

How often does this bug happen?

None

Screenshots or Videos

Platform

• OS: Ubuntu 22.04
• Browser: Chrome

TanStack Form adapter

react-form

TanStack Form version

1.3.0

TypeScript version

~5.7.2

Additional context

No response

[LeCarbonator]

Instead of passing the state, you can also utilize the useStore hook to stay updated on meta data:

https://stackblitz.com/edit/vitejs-vite-8ftamg6p?file=src%2Fcomponents%2FFixedInputField.tsx

This merely changes what to fix to close the issue. If the documentation still lists stale data, then that's a problem.