TanStack Form Data Loading and Submission UX

Use this skill when the task is about how a form loads data, submits data, or recovers UX after invalid submission.

Scope

• async initial values and TanStack Query hydration
• branching submit behavior with metadata
• transformed schema output handling during submit
• focus-first-error flows after invalid submit

Routing cues

• fetched defaults, TanStack Query, loading states around form defaults, onSubmitMeta, handleSubmit({ ... }), onSubmitInvalid, or focusing the first invalid field -> this skill
• validator timing, custom errors, or disableErrorFlat -> tanstack-form-validation-and-errors
• arrays, linked fields, form.Subscribe, or listeners -> tanstack-form-dynamic-fields-and-reactivity
• Next.js, Remix, TanStack Start, or server-state merging with mergeForm -> tanstack-form-react-runtime-integrations

Workflow