Field

Field wraps a single form control with a label, required indicator, and validation message area.

Child controls like Input and Select inherit id and name through context, while validation rules live on the control — not on Field — so Leptos signals drive error state reactively. Compose Field inside Leptos ActionForm or router Form roots; Orbital does not ship a separate Form component.

Pick a Leptos form root, then compose Orbital inside it:

| Root | When | |---|---| | leptos_router::components::Form | GET navigation — filters/search in URL (?q=) | | leptos::form::ActionForm | Server action POST with progressive enhancement | | <form on:submit> + Action::dispatch | SPA controlled submit from Store |

Typical stack: form root → FieldContextProvider → Field → Input / Select → Button. Form values live in a Leptos Store (store.field()) or standalone RwSignals. Native Orbital inputs use FormBind (RwSignal | store field | plain initial value for previews).

• Any labeled control: Input, Select, checkbox groups
• Forms where validation errors should appear below the control
• Horizontal label layouts in compact settings rows

• Wrap each control in <Field label="…"> (set name when posting native forms).
• Place the control as the child — e.g. Input or Select.
• Add rules on the child control (InputRule, SelectRule, …) to drive validation messages — for example Input bind=InputBind { value: signal.into(), rules: vec![InputRule::required(required)], ..Default::default() }.
• Set required=true when the label should show a required indicator.
• For multi-control forms, use FieldContextProvider at the form root.