Fieldset

Fieldset groups related fields inside a bordered <fieldset> with an optional legend and description. It lays its children out with a FormGrid, so the columns prop controls how many fields sit per row. Use it to break a long form into labeled sections like "Billing address" or "Notification settings".

Example

import { Fieldset, Field, Input } from '@officina/ui';

<Fieldset legend="Contact" description="How we reach you." columns={2}>
  <Field label="Name">
    <Input />
  </Field>
  <Field label="Region">
    <Input />
  </Field>
</Fieldset>;

API