import * as React from "react"; import { Slot } from "@radix-ui/react-slot"; import { cva, type VariantProps } from "class-variance-authority"; import { cn } from "@/lib/utils"; const buttonVariants = cva( "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 active:scale-[0.98]", { variants: { variant: { default: "bg-primary text-primary-foreground shadow-sm hover:bg-primary/90 hover:shadow-md", destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90 hover:shadow-md", outline: "border border-border bg-background text-foreground hover:bg-muted hover:border-primary/40", secondary: "bg-muted text-foreground hover:bg-muted/80", ghost: "text-foreground hover:bg-muted hover:text-foreground", link: "text-primary underline-offset-4 hover:underline p-0 h-auto", accent: "bg-accent text-accent-foreground shadow-sm hover:bg-accent/90 hover:shadow-md", }, size: { default: "h-10 px-5 py-2.5", sm: "h-8 rounded-md px-3 text-xs", lg: "h-11 rounded-lg px-8 text-base", xl: "h-12 rounded-lg px-10 text-base font-semibold", icon: "h-10 w-10", "icon-sm": "h-8 w-8", }, }, defaultVariants: { variant: "default", size: "default", }, } ); export interface ButtonProps extends React.ButtonHTMLAttributes, VariantProps { asChild?: boolean; } const Button = React.forwardRef( ({ className, variant, size, asChild = false, ...props }, ref) => { const Comp = asChild ? Slot : "button"; return ( ); } ); Button.displayName = "Button"; export { Button, buttonVariants };