Field

A comprehensive field system with support for labels, descriptions, errors, and complex form layouts.

import { Field, FieldContent, FieldDescription, FieldLabel } from "@/components/ui/interfaces-field"
import { Input } from "@/components/ui/input"

export default function DemoSimpleField() {
  return (
    <div className="flex w-full min-h-screen items-center justify-center bg-background p-8 overflow-hidden">
      <div className="w-full max-w-md">
        <Field>
          <FieldLabel htmlFor="username">Username</FieldLabel>
          <FieldContent>
            <Input id="username" placeholder="Enter username" />
            <FieldDescription>This is your public display name.</FieldDescription>
          </FieldContent>
        </Field>
      </div>
    </div>
  )
}