# Marking Menu

A radial menu for people who learn it. Hold for eight targets, or flick the same way to pick without looking.

Tier: Free

## Installation

```bash
npx shadcn add @fetaui/marking-menu
```

## Usage

```tsx
import { MarkingMenu } from '@/components/fetaui/marking-menu'

export function Example() {
  return <MarkingMenu items={items} onPick={run}><Canvas /></MarkingMenu>
}
```

## API

| Prop | Type | Default |
|---|---|---|
| items | MarkingItem[] | required |
| onPick | (id) => void |  |
| children | ReactNode |  |
| label | string | Canvas |
| defaultOpen | boolean | false |
| animated | boolean | true |

## When to use

- For frequent commands in canvas and power tools.
- Keep eight or fewer targets, and keep their positions stable.

## When not to use

- As the only way to reach a command. Offer each one elsewhere too.

## Accessibility

- The disc is a menu with items in clockwise order.
- The picked command is announced.
- Every command should also exist elsewhere.

## Motion

- Press and hold 250 ms, and the disc grows from the pointer in 180 ms.
- Targets fan out 15 ms apart, and the wedge snaps to 45° sectors.
- A flick faster than 0.6 px per ms leaves a trail that fades over 400 ms, then a chip confirms.
- With reduced motion, the disc appears, the wedge jumps, and there is no trail.