import React from 'react'
export interface ButtonProps {
variant?: 'default' | 'destructive' | 'outline'
size?: 'default' | 'sm' | 'lg' | 'icon'
asChild?: boolean
}
export const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
({ variant = 'default', size = 'default', asChild = false, ...props }, ref) => {
return (
<button
ref={ref}
className={`btn btn-${variant} btn-${size}`}
{...props}
/>
)
}
)
Button.displayName = 'Button'
export const buttonVariants = {
variant: {
default: 'bg-primary text-primary-foreground hover:bg-primary/90',
destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90',
outline: 'border border-input bg-background hover:bg-accent'
},
size: {
default: 'h-10 px-4 py-2',
sm: 'h-9 rounded-md px-3',
lg: 'h-11 rounded-md px-8',
icon: 'h-10 w-10'
}
}
export type ButtonVariants = typeof buttonVariants