A form field wrapper that provides labeling, description, and validation messaging for any input control. Supports required fields, disabled states, error messages, and real-time validity tracking via Base UI primitives.
import { Field, FieldLabel } from "@/components/ui/component"; import { Switch } from "@/components/ui/switch"; export default function FieldSwitchDemo() { return ( <div className="flex min-h-screen w-full items-center justify-center bg-background p-8"> <div className="w-full max-w-sm"> <Field> <FieldLabel> <Switch /> Email notifications </FieldLabel> </Field> </div> </div> ); }
Part of coss — browse the full library on 21st.dev.