Getting started
Foundations
Integrations
Form19
Display5
Layout4
Navigation4
Overlay8
Feedback4
Motion19
Field
A form field component that provides structure for labels, controls, descriptions, and error messages. Handles validation and accessibility automatically.
#Installation
npx @dinachi/cli@latest add field#Usage
tsx
import { Field, FieldLabel, FieldControl, FieldDescription, FieldError, FieldValidity } from '@/components/ui/field'#Examples
#API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| name | string | — | The name of the field (required) |
| disabled | boolean | false | Whether the field is disabled |
| invalid | boolean | false | Whether the field is in an invalid state |
| required | boolean | false | Whether the field is required |
| validate | (value: any) => string | undefined | — | Custom validation function that returns an error message or undefined |