Browse the docs
Dropdown Menu
Action menu on a trigger, following the WAI-ARIA menu-button pattern: arrow keys move (skipping disabled items), Home/End jump, typing jumps to a matching item, Enter selects, Escape closes and returns focus to the trigger.
This component needs the menu primitive — two ways to get it:
- Copy: fetch
/r/primitives/dropdown-menu.txt— one file with the shared core embedded — and save it asprimitives/dropdown-menu.js. - Install:
npm install @presetui/ui— the primitives are bundled, no second package — then use the Source · npm tab below, whose import already points at@presetui/ui/primitives/dropdown-menu.
Props
| Prop | Values | Default | Description |
|---|---|---|---|
trigger | element | required | A single element — the menu-button behavior merges onto it. |
items | array | required | { label, onSelect, disabled?, danger? }, { type: "separator" }, or { type: "label", label }. |
side / align | position | "bottom" / "start" | Where the panel opens. |
className | string | "" | Applied to the panel. |
Notes
An item's onSelect(event) may call event.preventDefault() to keep the
menu open. For checkbox items, radio groups, or custom item markup, compose
the primitive directly: Menu, MenuTrigger, MenuContent, MenuItem,
MenuGroup, MenuLabel, MenuSeparator.