Forms
Fieldset
A group for related form controls built on a native fieldset and legend. The disabled prop turns off every control inside, and an optional description sits under the legend.
ReactVueWeb Components
View in Storybook Playground
Examples
<Fieldset legend="Shipping address" description="Where should we send your order?">
<FormField label="Street"><Input /></FormField>
<FormField label="City"><Input /></FormField>
</Fieldset>Props
| Name | Type | Default | Description |
|---|---|---|---|
legend required | ReactNode | — | Legend text — the accessible group name, rendered inside `<legend>`. |
description | ReactNode | — | Optional description displayed below the legend. |
disabled | boolean | — | Disabled state propagated natively to all descendant form controls via the HTML `disabled` attribute on `<fieldset>`. |
children required | ReactNode | — | Form controls to group. |
Accessibility
- Body/background contrast is ≥ 7:1 (AAA) in both light and dark.
- Every interaction works with the keyboard alone.
- The focus ring is always visible.
- Respects prefers-reduced-motion and stops excessive motion.
Every component is designed to meet WCAG 2.1 AAA.