import { type ButtonHTMLAttributes, forwardRef } from "react";
import { cn } from "@/lib/utils";

type ButtonVariant = "primary" | "secondary" | "tertiary" | "telegram";
type ButtonSize = "sm" | "md" | "lg";

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

const variantStyles: Record<ButtonVariant, string> = {
  primary:
    "bg-gradient-to-r from-primary to-primary-container text-on-primary font-bold hover:scale-105 active:opacity-80 transition-all",
  secondary:
    "bg-surface-container-highest text-on-surface hover:bg-surface-bright transition-colors",
  tertiary: "text-primary-fixed-dim hover:opacity-80 transition-opacity",
  telegram:
    "bg-[#24A1DE] text-white hover:opacity-90 transition-opacity",
};

const sizeStyles: Record<ButtonSize, string> = {
  sm: "px-4 py-2 text-sm rounded-md",
  md: "px-6 py-2.5 rounded-lg",
  lg: "px-10 py-4 rounded-lg font-bold",
};

const Button = forwardRef<HTMLButtonElement, ButtonProps>(
  ({ variant = "primary", size = "md", className, children, ...rest }, ref) => (
    <button
      ref={ref}
      className={cn(variantStyles[variant], sizeStyles[size], className)}
      {...rest}
    >
      {children}
    </button>
  )
);

Button.displayName = "Button";
export { Button, type ButtonProps };