import { cn } from '@/lib/utils';
import { Link } from '@inertiajs/react';

type Variant = 'default'|'outline'|'ghost'|'destructive';
type Size = 'sm'|'md'|'lg';

const base = 'inline-flex items-center gap-2 font-medium rounded-md transition-colors focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none';
const variants: Record<Variant,string> = {
    default: 'bg-primary text-primary-foreground hover:bg-primary/90 focus:ring-primary',
    outline: 'border border-border bg-white text-foreground hover:bg-muted focus:ring-primary',
    ghost: 'text-foreground hover:bg-muted focus:ring-primary',
    destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90 focus:ring-destructive',
};
const sizes: Record<Size,string> = { sm:'px-3 py-1.5 text-sm', md:'px-4 py-2 text-sm', lg:'px-5 py-2.5 text-base' };

export function Button({ variant='default', size='md', className, children, ...props }: React.ButtonHTMLAttributes<HTMLButtonElement> & { variant?: Variant; size?: Size }) {
    return <button className={cn(base, variants[variant], sizes[size], className)} {...props}>{children}</button>;
}
export function LinkButton({ href, variant='default', size='md', className, children }: { href: string; variant?: Variant; size?: Size; className?: string; children: React.ReactNode }) {
    return <Link href={href} className={cn(base, variants[variant], sizes[size], className)}>{children}</Link>;
}