Skyler Grey | 7177bbd | 2023-06-01 03:26:31 +0200 | [diff] [blame] | 1 | import { cva } from "class-variance-authority"; |
| 2 | |
| 3 | export { default as Button } from "./Button.svelte"; |
| 4 | |
| 5 | export const buttonVariants = cva( |
| 6 | "inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none ring-offset-background", |
| 7 | { |
| 8 | variants: { |
| 9 | variant: { |
| 10 | default: |
| 11 | "bg-primary text-primary-foreground hover:bg-primary/90", |
| 12 | destructive: |
| 13 | "bg-destructive text-destructive-foreground hover:bg-destructive/90", |
| 14 | outline: |
| 15 | "border border-input hover:bg-accent hover:text-accent-foreground", |
| 16 | secondary: |
| 17 | "bg-secondary text-secondary-foreground hover:bg-secondary/80", |
| 18 | ghost: "hover:bg-accent hover:text-accent-foreground", |
| 19 | link: "underline-offset-4 hover:underline text-primary" |
| 20 | }, |
| 21 | size: { |
| 22 | default: "h-10 py-2 px-4", |
| 23 | sm: "h-9 px-3 rounded-md", |
| 24 | lg: "h-11 px-8 rounded-md" |
| 25 | } |
| 26 | }, |
| 27 | defaultVariants: { |
| 28 | variant: "default", |
| 29 | size: "default" |
| 30 | } |
| 31 | } |
| 32 | ); |