damus.io

damus.io website
git clone git://jb55.com/damus.io
Log | Files | Refs | README | LICENSE

Button.tsx (1789B)


      1 import * as React from "react"
      2 import { Slot } from "@radix-ui/react-slot"
      3 import { cva, type VariantProps } from "class-variance-authority"
      4 
      5 import { cn } from "@/lib/utils"
      6 
      7 const buttonVariants = cva(
      8   "inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background active:scale-95 transition focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
      9   {
     10     variants: {
     11       variant: {
     12         default: "bg-white text-gray-800 hover:text-gray-700",
     13         accent: "bg-gradient-to-r from-damuspink-600 to-damuspink-500 hover:brightness-110 text-white",
     14         destructive:
     15           "bg-red-500 text-white hover:bg-red-500/90",
     16         secondary: "rounded-full bg-white/10 text-white hover:bg-white/20 hover:scale-105 active:bg-white/5 active:scale-95",
     17         link: "text-transparent bg-clip-text bg-gradient-to-r from-damuspink-500 to-damuspink-600",
     18       },
     19       size: {
     20         default: "h-10 px-4 py-2",
     21         sm: "h-9 rounded-md px-3",
     22         lg: "h-11 rounded-md px-8",
     23         icon: "h-10 w-10",
     24       },
     25     },
     26     defaultVariants: {
     27       variant: "default",
     28       size: "default",
     29     },
     30   }
     31 )
     32 
     33 export interface ButtonProps
     34   extends React.ButtonHTMLAttributes<HTMLButtonElement>,
     35     VariantProps<typeof buttonVariants> {
     36   asChild?: boolean
     37 }
     38 
     39 const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
     40   ({ className, variant, size, asChild = false, ...props }, ref) => {
     41     const Comp = asChild ? Slot : "button"
     42     return (
     43       <Comp
     44         className={cn(buttonVariants({ variant, size, className }))}
     45         ref={ref}
     46         {...props}
     47       />
     48     )
     49   }
     50 )
     51 Button.displayName = "Button"
     52 
     53 export { Button, buttonVariants }