button

1import { cva, type VariantProps } from "class-variance-authority"
2 
3export const buttonVariants = cva(
4  "group/button focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 inline-flex shrink-0 items-center justify-center rounded-md border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:ring-3 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:ring-3 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
5  {
6    variants: {
7      variant: {
8        default: "bg-primary text-primary-foreground hover:bg-primary/80",
9        outline:
10          "!border-border bg-background hover:bg-muted hover:text-foreground dark:!border-input dark:bg-input/30 dark:hover:bg-input/50 shadow-xs",
11        secondary:
12          "bg-secondary text-secondary-foreground hover:bg-secondary/80",
13        ghost: "hover:bg-muted hover:text-foreground dark:hover:bg-muted/50",
14        destructive:
15          "bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40",
16        link: "text-primary underline-offset-4 hover:underline",
17      },
18      size: {
19        default:
20          "h-9 gap-1.5 px-2.5 in-data-[slot=button-group]:rounded-md has-[>svg:first-child]:pl-2 has-[>svg:last-child]:pr-2",
21        xs: "h-6 gap-1 rounded-[min(var(--radius-md),8px)] px-2 text-xs in-data-[slot=button-group]:rounded-md has-[>svg:first-child]:pl-1.5 has-[>svg:last-child]:pr-1.5 [&_svg:not([class*='size-'])]:size-3",
22        sm: "h-8 gap-1 rounded-[min(var(--radius-md),10px)] px-2.5 in-data-[slot=button-group]:rounded-md has-[>svg:first-child]:pl-1.5 has-[>svg:last-child]:pr-1.5",
23        lg: "h-10 gap-1.5 px-2.5 has-[>svg:first-child]:pl-2 has-[>svg:last-child]:pr-2",
24        icon: "size-9",
25        "icon-xs":
26          "size-6 rounded-[min(var(--radius-md),8px)] in-data-[slot=button-group]:rounded-md [&_svg:not([class*='size-'])]:size-3",
27        "icon-sm":
28          "size-8 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-md",
29        "icon-lg": "size-10",
30      },
31    },
32    defaultVariants: {
33      variant: "default",
34// … truncated