{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"button","title":"Button","description":"Triggers an action. Six emphasis levels, five sizes with icon-only counterparts and an optional count chip.","dependencies":["cn","@base-ui/react","class-variance-authority"],"files":[{"path":"components/ui/button.tsx","content":"import { Button as ButtonPrimitive } from \"@base-ui/react/button\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"cn\"\n\nconst buttonVariants = cva(\n  \"group/button inline-flex shrink-0 items-center justify-center text-xs font-medium whitespace-nowrap outline-1 -outline-offset-1 outline-transparent transition-all outline-solid select-none focus-visible:ring-2 focus-visible:ring-ring/30 focus-visible:outline-ring active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:ring-2 aria-invalid:ring-destructive/20 aria-invalid:outline-destructive dark:aria-invalid:ring-destructive/40 dark:aria-invalid:outline-destructive/50 [&_[data-badge]]:inline-flex [&_[data-badge]]:h-5 [&_[data-badge]]:min-w-5 [&_[data-badge]]:shrink-0 [&_[data-badge]]:items-center [&_[data-badge]]:justify-center [&_[data-badge]]:rounded-xs [&_[data-badge]]:px-1 [&_[data-badge]]:text-2xs [&_[data-badge]]:font-medium [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n  {\n    variants: {\n      variant: {\n        default:\n          \"bg-primary text-primary-foreground hover:bg-primary/90 disabled:bg-muted-foreground [&_[data-badge]]:bg-primary-foreground/20\",\n        outline:\n          \"bg-control text-foreground outline-control-border hover:bg-control-hover disabled:bg-control-hover aria-expanded:bg-control-hover [&_[data-badge]]:bg-fill-2\",\n        secondary:\n          \"bg-fill-2 text-foreground hover:bg-fill-3 disabled:bg-fill-2 aria-expanded:bg-fill-3 [&_[data-badge]]:bg-fill-2\",\n        ghost:\n          \"text-foreground hover:bg-fill-2 aria-expanded:bg-fill-2 [&_[data-badge]]:bg-fill-2\",\n        destructive:\n          \"text-destructive-foreground outline-destructive/50 hover:bg-fill-1 focus-visible:ring-destructive/20 focus-visible:outline-destructive disabled:bg-fill-1 aria-expanded:bg-fill-1 [&_[data-badge]]:bg-destructive/10\",\n        link: \"text-primary underline-offset-4 hover:underline [&_[data-badge]]:bg-primary/10\",\n      },\n      size: {\n        default:\n          \"h-8 gap-1.5 rounded-lg px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2\",\n        xs: \"h-6 gap-1 rounded-md px-2 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_[data-badge]]:h-4 [&_[data-badge]]:min-w-4 [&_[data-badge]]:px-0.5 [&_svg:not([class*='size-'])]:size-3.5\",\n        sm: \"h-7 gap-1.5 rounded-md px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2\",\n        lg: \"h-9 gap-1.5 rounded-lg px-3 has-data-[icon=inline-end]:pr-2.5 has-data-[icon=inline-start]:pl-2.5\",\n        xl: \"h-10 gap-2 rounded-lg px-3.5 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3\",\n        icon: \"size-8 rounded-lg\",\n        \"icon-xs\": \"size-6 rounded-md [&_svg:not([class*='size-'])]:size-3.5\",\n        \"icon-sm\": \"size-7 rounded-md\",\n        \"icon-lg\": \"size-9 rounded-lg\",\n        \"icon-xl\": \"size-10 rounded-lg\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n)\n\nfunction Button({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  ...props\n}: ButtonPrimitive.Props & VariantProps<typeof buttonVariants>) {\n  return (\n    <ButtonPrimitive\n      data-slot=\"button\"\n      className={cn(buttonVariants({ variant, size, className }))}\n      {...props}\n    />\n  )\n}\n\nexport { Button, buttonVariants }\n","type":"registry:ui"}],"cssVars":{"theme":{"color-destructive-foreground":"var(--destructive-foreground)","color-fill-1":"var(--fill-1)","color-fill-2":"var(--fill-2)","color-fill-3":"var(--fill-3)","color-control":"var(--control)","color-control-hover":"var(--control-hover)","color-control-border":"var(--control-border)","text-2xs--letter-spacing":"-0.005em","text-xs--letter-spacing":"-0.005em","text-2xs":"0.75rem","text-2xs--line-height":"calc(1 / 0.75)","text-xs":"0.8125rem","text-xs--line-height":"calc(1.25 / 0.8125)"},"light":{"destructive-foreground":"oklch(0.505 0.213 27.518)","fill-1":"oklch(0.556 0 0 / 5%)","fill-2":"oklch(0.556 0 0 / 8%)","fill-3":"oklch(0.556 0 0 / 12%)","control":"oklch(1 0 0)","control-hover":"oklch(0.9925 0 0)","control-border":"oklch(0.145 0 0 / 10%)"},"dark":{"destructive-foreground":"oklch(0.704 0.191 22.216)","fill-1":"oklch(1 0 0 / 5%)","fill-2":"oklch(1 0 0 / 10%)","fill-3":"oklch(1 0 0 / 14%)","control":"oklch(0.237 0 0)","control-hover":"oklch(0.269 0 0)","control-border":"oklch(1 0 0 / 10%)"}},"categories":["actions"],"type":"registry:ui"}