Field

Label, control, and description layout for forms.

shadcn/ui · new-york-v4 · synced Aug 29, 2026shadcn/uinew-york-v4 · synced Aug 29, 2026

Installation

import { FieldSet, FieldLegend, FieldGroup, Field, FieldLabel, FieldDescription } from "@aspyn-io/kit";

Field group

Field lays out a label, control, and description with consistent spacing; FieldGroup stacks them.

Shown on your public profile.

Horizontal field

orientation="horizontal" puts the control beside the label — ideal for toggles.

Fieldset with legend

Billing period

Notes

  • Field is layout-only and pairs with any control (Input, Select, Switch, Checkbox). For react-hook-form wiring and validation messages, use Form/FormField; FieldError also accepts an errors array.
  • orientation supports "vertical" (default), "horizontal", and "responsive" (stacks on small screens, inline at @md).