Label
optics/labelFreeComponent
Renders an accessible label associated with controls.
See it running
Open the demo on optics
optics.agusmayol.com.ar/components/labelInstall it
npx shadcn@latest add https://optics.agusmayol.com.ar/r/label.jsonSource
1"use client";23import * as React from "react";45import { cn } from "@/lib/utils";67function Label({ className = "", ...props }) {8 return (9 <label10 data-slot="label"11 className={cn(12 "gap-2 text-xs/relaxed leading-none font-medium group-data-[disabled=true]:opacity-50 peer-disabled:opacity-50 flex items-center select-none group-data-[disabled=true]:pointer-events-none peer-disabled:cursor-not-allowed",13 className,14 )}15 {...props}16 />17 );18}1920Label.displayName = "Label";2122export { Label };
What it pulls in
npm packages
Other registry items
Files it writes
More from optics
All 79 items| Component | Registry | Kind | Access | Installs | Command |
|---|---|---|---|---|---|
| Accordionaccordion | optics | Components | Free | 5 deps | |
| Alertalert | optics | Components | Free | 4 deps | |
| Alert Dialogalert-dialog | optics | Components | Free | 4 deps | |
| Aspect Ratioaspect-ratio | optics | Components | Free | 2 deps | |
| Auto Heightauto-height | optics | Components | Free | 3 deps | |
| Avataravatar | optics | Components | Free | 3 deps | |
| Badgebadge | optics | Components | Free | 4 deps | |
| Breadcrumbbreadcrumb | optics | Components | Free | 4 deps |
