Spaces:
Paused
Paused
| import * as React from "react"; | |
| import { cn } from "@/lib/utils"; | |
| export type ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & { | |
| variant?: "default" | "ghost" | "outline" | "danger"; | |
| size?: "sm" | "md" | "lg"; | |
| }; | |
| const base = | |
| "inline-flex items-center justify-center rounded-full font-medium transition focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ember/70 disabled:opacity-50"; | |
| const variants: Record<string, string> = { | |
| default: "bg-ink text-white hover:bg-ink/90", | |
| ghost: "bg-transparent text-ink hover:bg-black/5", | |
| outline: "border border-ink/20 text-ink hover:bg-black/5", | |
| danger: "bg-red-600 text-white hover:bg-red-500", | |
| }; | |
| const sizes: Record<string, string> = { | |
| sm: "h-9 px-4 text-sm", | |
| md: "h-11 px-6 text-sm", | |
| lg: "h-12 px-8 text-base", | |
| }; | |
| export const Button = React.forwardRef<HTMLButtonElement, ButtonProps>( | |
| ({ className, variant = "default", size = "md", ...props }, ref) => ( | |
| <button ref={ref} className={cn(base, variants[variant], sizes[size], className)} {...props} /> | |
| ) | |
| ); | |
| Button.displayName = "Button"; | |