<!-- source-hash: e6cbc38937ee7e5569d78f2d7f50de6f -->
A polymorphic, variant-aware button component built on `class-variance-authority` and Radix UI's `Slot`, supporting standard buttons, link navigation, split-icon layouts, and loading states.

## Key Components

- **`Button`** — Primary export; a `forwardRef` component that renders as `<button>`, `<Link>`, or a custom element (`asChild`).
- **`buttonVariants`** — CVA config for the standard single-content layout; drives `variant`, `size`, `fullWidth`, and `noPaddingX` props.
- **`splitShellVariants` / `splitSlotVariants`** — CVA configs for the split layout (triggered by `splitIcon`), where a vertical divider separates content from a trailing icon area.
- **`Spinner`** — Internal animated SVG displayed during the `loading` state; absolutely positioned to avoid layout shift.
- **`ButtonProps`** — Full interface including `href`, `linkProps`, `leftIcon`, `rightIcon`, `splitIcon`, `loading`, and deprecated `size="small-legacy"`.

## Usage Example

```typescript
// Standard accent button
<Button variant="accent" size="default" onClick={handleClick}>
  Save
</Button>

// Link button with new-tab navigation
<Button href="https://flamingo.run" openInNewTab>
  Learn More
</Button>

// Loading state (preserves button width)
<Button loading disabled>
  Submitting...
</Button>

// Split layout with trailing icon
<Button splitIcon={<ChevronDownIcon />} variant="outline">
  Actions
</Button>

// Pre-resolved nav link (from useNavLink)
<Button linkProps={{ href: "/dashboard", target: "_blank", rel: "noopener noreferrer" }}>
  Dashboard
</Button>

// Render as child (asChild pattern)
<Button asChild variant="destructive">
  <a href="/delete">Delete Account</a>
</Button>
```

### Variants

| Prop | Options |
|---|---|
| `variant` | `accent` · `outline` · `transparent` · `destructive` |
| `size` | `default` · `small` · `icon` · `small-legacy` *(deprecated)* |
| `fullWidth` | `true` / `false` |
| `noPaddingX` | `true` / `false` |