tanstack-form
Headless, performant, and type-safe form state management for TS/JS, React, Vue, Angular, Solid, Lit, and Svelte.
Security Assessment
Detected risks:
About tanstack-form
The tanstack-form skill documents TanStack Form, a headless, performant, and type-safe form state management library that works across TS/JS frameworks including React, Vue, Angular, Solid, Lit, and Svelte. It handles form state, validation, and reactivity with deep TypeScript integration and without imposing any UI.
It covers the core useForm hook, the form.Field component with dot-notation nested fields, validation timing (onChange, onBlur, onSubmit, onMount), synchronous and debounced asynchronous validation, schema validation via Zod and Valibot adapters, form-level and linked/dependent field validation, array fields with their mutation methods (push, insert, replace, remove, swap, move), side-effect listeners, fine-grained reactivity through form.Subscribe and useStore, and the full form and field state shapes plus FormApi methods.
It is most useful for frontend developers building typed, validated forms, from simple inputs to dynamic array and dependent-field forms, who want fine-grained reactivity and schema-adapter support.
FAQ
What is TanStack Form?
A headless, type-safe form state management library with deep TypeScript integration, usable in React, Vue, Angular, Solid, Lit, and Svelte (for example via @tanstack/react-form).
How does validation work?
Field- and form-level validators run on configurable causes (onChange, onBlur, onSubmit, onMount), support synchronous and debounced async validation, and can use schema adapters for Zod or Valibot.
Does it support dynamic and dependent fields?
Yes. Array fields offer push/insert/replace/remove/swap/move methods, and linked fields re-validate when another field changes via onChangeListenTo.
How do I read form state efficiently?
Through fine-grained subscriptions: the form.Subscribe render-prop with a selector, or the form.useStore hook, exposing state like canSubmit, isDirty, and isValidating.
How do I install it?
Run npm install @tanstack/react-form, optionally adding schema adapters like @tanstack/zod-form-adapter with zod.
Install tanstack-form
Quick Setup:
- Copy the skill folder to
.claude/skills/ - Claude will automatically detect and use the skill
Repository
tanstack-skills/tanstack-skills