TanStack Form

Disables the field and forwards `disabled` to the control.

Renders a required `*` after the label.

Help text rendered under the control and wired via `aria-describedby`.

Label text shown above (or beside) the control.

Tooltip attached to an info trigger next to the label.

Optional-hint text after the label when not required (e.g. "(optional)").

Size variant, kept in sync with the control. `FormSelect`/`FormCheckbox` accept `sm`/`md`/`lg` (no `xs`).

Explicit tone override; defaults to error-derived `danger`, otherwise the control's own resting color.

Label/control layout direction.

When validation errors become visible: after the field is touched, after a submit attempt, or always.

Svelte / React only — the TanStack form instance (`createForm()` in Svelte, `useForm()` in React). In Astro the form is bound by the surrounding `<pindoba-form>`, so wrappers take no `form` prop.

Field name — a key of the form's data.

Per-slot escape hatch for Field styling and attributes.

Astro FormCheckbox only — initial server-rendered checked state.

Astro only — initial server-rendered value for FormInput / FormTextarea (string) / FormSelect. The form is the source of truth after hydration.

FormInput / FormTextarea / FormSelect — placeholder shown when empty.

FormSelect only — autofill hint (e.g. `"country"`) set on the hidden native `<select>` mirror, which the browser autofills and the Select syncs from. (`autoComplete` in React.) FormInput / FormTextarea forward it like any other native attribute.

FormSelect only — the options to choose from.

FormTextarea only — number of visible text rows. The Textarea's `resize` and `autoResize` props pass through the same way.

FormSelect only — `"single"` (default) or `"multiple"`.

FormInput only — HTML input type forwarded to `<Input>`.

FormCheckbox — inline text/content beside the checkbox (Svelte snippet / Astro default slot).

FormField only — Svelte / React render-prop for the control. Receives the props bag to spread plus the raw TanStack field API for value/handler binding. (Astro uses the default slot instead; `bindForm` auto-wires standard controls.)

Emphasis forwarded to the underlying `<Button>`.

Size forwarded to the underlying `<Button>`.

Also disable while the form is invalid (not just while submitting). Off by default, so submitting an invalid form surfaces its errors.

Svelte / React only — the TanStack form instance (`createForm()` in Svelte, `useForm()` in React). In Astro the surrounding `<pindoba-form>` binds it.

Button label content. Falls back to "Submit".