← Назадimport * as React from 'react';
import { cn } from '../../lib/utils';
export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
variant?: 'primary' | 'secondary' | 'danger' | 'ghost';
size?: 'sm' | 'md' | 'lg';
}
const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
({ className, variant = 'primary', size = 'md', ...props }, ref) => {
const baseStyles = 'inline-flex items-center justify-center gap-2 rounded-xl font-semibold transition-all focus-visible:outline-none focus-visible:ring-2 disabled:opacity-50 disabled:pointer-events-none';
const variants = {
primary: 'bg-primary hover:bg-primary-dark text-white shadow-lg',
secondary: 'bg-white/10 hover:bg-white/20 text-white',
danger: 'bg-danger hover:bg-red-600 text-white shadow-lg',
ghost: 'hover:bg-white/10 text-white',
};
const sizes = {
sm: 'px-3 py-1.5 text-sm',
md: 'px-5 py-2.5 text-base',
lg: 'px-6 py-3 text-lg',
};
return (
<button
className={cn(baseStyles, variants[variant], sizes[size], className)}
ref={ref}
{...props}
/>
);
}
);
Button.displayName = 'Button';
export { Button };