Field component composition
A Field is composed of: FieldLabel, Input/Textarea/Switch/Select, FieldDescription, and FieldError. FieldContent is a flex column that groups label and description and is not required if there is no description.
shadcn/ui · Components · all subjects
field/composition
7 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.
Field basic anatomy
A typical Field is structured with FieldLabel, a control element (Input, Select, Switch, etc.), FieldDescription for optional helper text, and FieldError for validation messages.
FieldGroup composition structure
FieldGroup contains multiple Field components and can use FieldSeparator between sections. Structure: FieldGroup contains Field items, which each contain FieldLabel, Input/Textarea/Switch/Select, FieldDescription, and FieldError.
Field composition structure
A single Field is composed of: FieldLabel, a control (Input/Textarea/Switch/Select), FieldDescription, and FieldError.
FieldGroup composition structure
FieldGroup groups related Field components and can use FieldSeparator between sections. Structure: FieldGroup contains multiple Field components with optional FieldSeparator elements between them.
FieldSet composition structure
FieldSet provides semantic grouping with FieldLegend and FieldDescription, usually containing a FieldGroup. Structure: FieldSet contains FieldLegend, FieldDescription, and FieldGroup with nested Fields.
Field anatomy and core structure
A Field contains: Field wrapper, FieldLabel with htmlFor attribute, a control (Input/Select/Switch), optional FieldDescription for helper text, and optional FieldError for validation messages. FieldContent is a flex column that groups label and description, not required if there is no description.