import * as React from 'react';
import { cn } from '@/lib/utils';

/**
 * LabelProps - Propriétés du composant Label
 *
 * @interface LabelProps
 * @extends React.LabelHTMLAttributes<HTMLLabelElement>
 */
export interface LabelProps
  extends React.LabelHTMLAttributes<HTMLLabelElement> {}

/**
 * Label - Composant de label avec design system Kodo
 *
 * Composant de label pour associer du texte à des champs de formulaire.
 * Utilise le design system Kodo avec des styles cohérents et support pour les états disabled.
 *
 * @example
 * ```tsx
 * // Label simple
 * <Label htmlFor="email">Email</Label>
 * <Input id="email" />
 *
 * // Label avec classe personnalisée
 * <Label className="text-lg" htmlFor="name">
 *   Nom complet
 * </Label>
 * ```
 *
 * @component
 * @param {LabelProps} props - Propriétés du composant (toutes les props HTML standard de label)
 * @returns {JSX.Element} Élément label stylisé
 */

const Label = React.forwardRef<HTMLLabelElement, LabelProps>(
  ({ className, ...props }, ref) => (
    <label
      ref={ref}
      className={cn(
        'text-sm font-medium leading-none text-muted-foreground peer-disabled:cursor-not-allowed peer-disabled:opacity-70',
        className,
      )}
      {...props}
    />
  ),
);
Label.displayName = 'Label';

export { Label };