import React from 'react';
import { clsx } from 'clsx';

export interface LabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
  children: React.ReactNode;
  required?: boolean;
  error?: boolean;
}

/**
 * Standalone label component
 */
export const Label = React.forwardRef<HTMLLabelElement, LabelProps>(
  ({ children, required, error, className, ...props }, ref) => {
    return (
      <label
        ref={ref}
        className={clsx(
          'text-sm font-medium',
          {
            'text-foreground': !error,
            'text-destructive': error,
            "after:content-['*'] after:ml-1 after:text-destructive": required,
          },
          className
        )}
        {...props}
      >
        {children}
      </label>
    );
  }
);
Label.displayName = 'Label';
