Menu
Items, checkbox and radio items, a submenu and shortcuts, opening out of its button.
Features
- Items with shortcuts, checkbox and radio items, labels, separators, submenus.
- Opens out of its button.
Use it for
- Overflow and context actions.
Installation
- Get runets.
git clone https://github.com/ziyam-khan/runets - Copy these files into your project, keeping their folders.
- Install what they use.
pnpm add react @base-ui/react motion lucide-react - Load the styles once. Bring your own base tokens, or use runets’ default theme.
import 'runets/styles/theme.css' import 'runets/styles/kit.css'
Usage
import { Menu } from 'runets'
<Menu trigger="Options" items={[{ kind: 'item', label: 'New file', keys: ['⌘', 'N'] }, { kind: 'sep' }, { kind: 'check', label: 'Word wrap', checked, onChange }]} />API
| Prop | Type | What it does |
|---|---|---|
trigger | ReactNode | Button content. |
items | MenuEntry[] | The entries. |
Accessibility
- Menu semantics; arrows, typeahead, Escape; focus returns to the button.
Source
The code is in src/kit/overlays.tsx in runets, MIT licensed.