Component · C-006

Field

A form unit that groups label, control, description and error. Field does not draw the control: it wraps it so state, help text and accessible validation are inherited.

Install

Install koten-theme first when the project has no Koten tokens yet.

npx shadcn@latest add https://koten.codehive.com.co/r/field.json

Accessibility

• Field associates the label with the control; do not add a second <label> or use the placeholder as the name.
• description and error are linked with aria-describedby; the error also activates aria-invalid.
• required adds the attribute to the control and an aria-hidden asterisk; the label text must still read clearly without it.
• disabled propagates to the control; when the value must remain readable and copyable, use readOnly instead.

Read the whole page

• Markdown page
• Agent index (llms.txt)
• Full documentation (llms-full.txt)

Koten UI · llms.txt · llms-full.txt · Markdown