# TransportButton

A persistent surface control: icon · micro-label · printed key · pressed tone. Density-aware — compacts to a 32px icon under data-density="bench". Held keys sit physically sunken.

Install: `npx candlelight-ds add transport-button`

Category: instrument · Grammar: G2, G7

## Use when

Always-visible surface-level controls — console zones, transport rows.

## Don't use when

One-off form/header actions (Button) or one-shots (Pad).

## States

- resting
- pressed/held (sunken)
- danger pressed (the stop family)
- disabled (dark, honest)
- bench density (icon only)

## Keyboard

- (none — pointer/semantic only)

## Acceptance tests

- hotkey is optional — never print a key that doesn't work (G2).
- Only the stop family wears danger.
- A held toggle sits sunken (edge-sunken), not tinted.

## Files

- components/instruments/TransportButton.tsx

npm dependencies: @candlelight-ds/tokens, clsx, tailwind-merge

Rendered twin: https://candlelight-docs.vercel.app/components/transport-button · Full spec: https://candlelight-docs.vercel.app/spec.md