# Menu

ONE floating-menu engine for dropdown, right-click, and overflow actions: items, icons, printed keys, checkbox items, danger items, max one submenu level.

Install: `npx candlelight-ds add menu`

Category: primitive · Grammar: G2, G9

## Use when

Contextual actions on an object — dropdown, right-click, or overflow.

## Don't use when

Navigation (links) or picking data values (Select). Deeper than one submenu level (Overlay).

## States

- closed
- open
- item highlighted
- item disabled
- danger item
- checkbox item
- submenu open

## Keyboard

- `↑↓` — walk items
- `Enter` — select
- `Esc` — close
- `type` — typeahead

## Acceptance tests

- A second menu engine anywhere is a bug — dropdown and context modes share this one skin.
- closeOnSelect:false keeps the menu open for rapid-fire actions.
- Danger items wear the cold tone and pair with hold-to-strike for destruction.

## Files

- components/ui/Menu.tsx

npm dependencies: @candlelight-ds/tokens, @radix-ui/react-dropdown-menu, @radix-ui/react-context-menu, lucide-react, clsx, tailwind-merge

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