<!-- source-hash: ae09312a4100bb1a98fd84f799794547 -->
A compound button component with two independently interactive halves — a main action area and a trailing icon action area — separated by a 1px variant-colored divider seam.

## Key Components

- **`SplitButton`** — Primary exported component (`React.forwardRef<HTMLDivElement, SplitButtonProps>`). Renders a `role="group"` div containing two `Half` instances sharing the same variant and size.
- **`Half`** — Internal helper that renders either a `<button>` or a Next.js `<Link>` depending on whether an `href` is provided, applying `splitHalfVariants` classes.
- **`splitHalfVariants`** — `cva`-powered class builder with `variant` (`accent` | `outline` | `transparent` | `destructive`), `size` (`default` | `small`), and `side` (`main` | `icon`) axes. Compound variants handle rounded corners, divider borders, and icon-half width overrides.
- **`SplitButtonIconAction`** — Interface describing the icon half: requires `icon` and `aria-label`; optionally accepts `onClick`, `href`, `openInNewTab`, `prefetch`, and `disabled`.
- **`SplitButtonProps`** — Full prop surface for `SplitButton`, including `fullWidth`, `mainDisabled` (disables only the main half), `groupAriaLabel`, and the required `iconAction`.

## Usage Example

```typescript
import { SplitButton } from "./split-button"
import { ChevronDownIcon, PlusIcon } from "lucide-react"

// Accent split button: main action navigates, icon half opens a dropdown
<SplitButton
  variant="accent"
  size="default"
  href="/tickets/new"
  leftIcon={<PlusIcon />}
  groupAriaLabel="Create ticket actions"
  iconAction={{
    icon: <ChevronDownIcon />,
    "aria-label": "More create options",
    onClick: () => setDropdownOpen(true),
  }}
>
  New Ticket
</SplitButton>

// Destructive split with main disabled independently
<SplitButton
  variant="destructive"
  mainDisabled
  iconAction={{
    icon: <ChevronDownIcon />,
    "aria-label": "Delete options",
    onClick: handleIconClick,
  }}
>
  Delete
</SplitButton>
```

> **Accessibility note:** The icon half has no visible text, so `iconAction["aria-label"]` is required. Use `groupAriaLabel` to label the wrapping `role="group"` when both halves share a semantic context.