import { type ButtonHTMLAttributes, forwardRef } from 'react'

export type ButtonVariant = 'primary' | 'secondary' | 'ghost' | 'danger'
export type ButtonSize = 'default' | 'lg'

export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
  variant?: ButtonVariant
  size?: ButtonSize
}

const variantClasses: Record<ButtonVariant, string> = {
  primary: 'btn btn-primary font-mono font-bold tracking-[0.4px]',
  secondary: 'btn btn-outline border-border bg-card text-foreground font-sans font-medium hover:bg-muted',
  ghost: 'btn btn-ghost text-foreground',
  danger: 'btn btn-error bg-[#f23f43] text-white hover:bg-[#d9363a]',
}

const sizeClasses: Record<ButtonSize, string> = {
  default: 'btn-sm h-9 gap-2 rounded-field px-4 text-sm',
  lg: 'btn-lg h-12 gap-[9px] rounded-field px-6 text-sm',
}

/** Business-free UI kit primitive: no domain logic, no store, no requests. */
export const Button = forwardRef<HTMLButtonElement, ButtonProps>(function Button(
  { variant = 'primary', size = 'default', className = '', type = 'button', ...props },
  ref,
) {
  return (
    <button
      ref={ref}
      type={type}
      className={`${variantClasses[variant]} ${sizeClasses[size]} transition-[filter,background-color] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 ${className}`}
      {...props}
    />
  )
})