Field

Form field primitives for building structured, accessible form layouts.

shadcn/ui docs →

Preview

Your full legal name.

We'll never share your email.

Installation

terminal
$
Other package managers 
bunx --bun shadcn@latest add https://trents.tech/r/field.json

Usage

example.tsx
import {
  Field,
  FieldLabel,
  FieldDescription,
  FieldError,
  FieldGroup,
  FieldSet,
} from "@/components/ui/field"
import { Input } from "@/components/ui/input"

<FieldSet>
  <Field>
    <FieldLabel htmlFor="name">Name</FieldLabel>
    <Input id="name" placeholder="Enter your name" />
    <FieldDescription>Your full legal name.</FieldDescription>
  </Field>
  <Field>
    <FieldLabel htmlFor="email">Email</FieldLabel>
    <Input id="email" type="email" placeholder="you@example.com" />
    <FieldError>Please enter a valid email.</FieldError>
  </Field>
</FieldSet>
0