{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "label",
  "title": "Label",
  "description": "An accessible label component for form controls with optional description and error messages.",
  "dependencies": [
    "@base-ui/react"
  ],
  "files": [
    {
      "path": "packages/ui/src/label.tsx",
      "content": "\"use client\";\n\nimport type React from \"react\";\nimport { cn } from \"./utils\";\n\nexport interface LabelProps\n  extends React.LabelHTMLAttributes<HTMLLabelElement> {\n  /**\n   * Optional additional className for the label\n   */\n  className?: string;\n}\n\nexport const Label = ({\n  className,\n  ref,\n  ...props\n}: LabelProps & React.RefAttributes<HTMLLabelElement>) => (\n  <label\n    className={cn(\n      \"select-none font-medium text-foreground text-sm leading-4\",\n      \"peer-disabled:cursor-not-allowed peer-disabled:opacity-50\",\n      className\n    )}\n    ref={ref}\n    {...props}\n  />\n);\n\nLabel.displayName = \"Label\";\n\nexport interface DescriptionProps\n  extends React.HTMLAttributes<HTMLParagraphElement> {\n  /**\n   * Optional additional className for the description\n   */\n  className?: string;\n}\n\nexport const Description = ({\n  className,\n  ref,\n  ...props\n}: DescriptionProps & React.RefAttributes<HTMLParagraphElement>) => (\n  <p\n    className={cn(\"text-[13px] text-muted-foreground\", className)}\n    ref={ref}\n    {...props}\n  />\n);\n\nDescription.displayName = \"Description\";\n\nexport interface ErrorMessageProps\n  extends React.HTMLAttributes<HTMLParagraphElement> {\n  /**\n   * Optional additional className for the error message\n   */\n  className?: string;\n}\n\nexport const ErrorMessage = ({\n  className,\n  ref,\n  ...props\n}: ErrorMessageProps & React.RefAttributes<HTMLParagraphElement>) => (\n  <p\n    className={cn(\"text-[13px] text-destructive\", className)}\n    ref={ref}\n    {...props}\n  />\n);\n\nErrorMessage.displayName = \"ErrorMessage\";\n\nexport interface FormProps extends React.FormHTMLAttributes<HTMLFormElement> {\n  /**\n   * Optional additional className for the form container\n   */\n  className?: string;\n}\n\n/**\n * Semantic `<form>` wrapper. Inputs nested inside submit on Enter.\n * Pass `onSubmit` to handle submission; remember to call `event.preventDefault()`.\n */\nexport const Form = ({\n  className,\n  ref,\n  ...props\n}: FormProps & React.RefAttributes<HTMLFormElement>) => (\n  <form\n    className={cn(\"grid w-full max-w-sm items-center gap-1.5\", className)}\n    ref={ref}\n    {...props}\n  />\n);\n\nForm.displayName = \"Form\";\n\nexport interface FieldGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Optional additional className for the field group container\n   */\n  className?: string;\n}\n\n/**\n * Non-semantic `<div>` wrapper with the same grid layout as `Form`.\n * Use when you need the layout without the `<form>` element\n * (e.g. inside an existing form, or for non-submittable field groups).\n */\nexport const FieldGroup = ({\n  className,\n  ref,\n  ...props\n}: FieldGroupProps & React.RefAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\"grid w-full max-w-sm items-center gap-1.5\", className)}\n    ref={ref}\n    {...props}\n  />\n);\n\nFieldGroup.displayName = \"FieldGroup\";\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}