Introduction
How the form, its inputs and the schema helpers fit together.
For TanStack Form, Zod v4 and shadcn/ui on Base UI, Radix or React Aria.
schema.ts
email: emailField({ blockDisposable: true }),signup-form.tsx
<FormEmail name="email" />Use a permanent email address
Sign-up form
One schema, one line per field
New account
What's inside
- FormHolds values, runs the Zod schema, and handles create and edit.
- 22 inputsFrom FormText to FormFile. Label, control and error in one line.
- Name presetsName a field email or phone and it gets its label and autocomplete.
- Schema helpersZod v4 schemas with plain errors. Inputs read their rules.
- Source you ownCopy the files into your project, like shadcn/ui.