Button

Reusable button component with variants.

Overview

The Button component provides styled buttons using class-variance-authority (CVA) for variant management.

Usage

<Button variant="default" size="default">Click me</Button>
<Button variant="destructive" size="sm">Delete</Button>
<Button variant="outline" size="lg">Cancel</Button>
<Button variant="ghost" size="icon">
  <Icon />
</Button>

Variants

Variant	Description
default	Primary filled button
destructive	Red destructive action
outline	Outlined button
secondary	Secondary filled
ghost	Transparent background
link	Styled as a link

Sizes

Size	Description
default	Standard size
sm	Small
lg	Large
icon	Square icon button

Source

app/components/ui/button/Button.vue