Context Menu

@sushindustries/ui

One menu, reachable by right-click, by long press, and by a button that is always there.

6 min read
View as MarkdownEdit on GitHub

Props

PropTypeDefaultDoes
stateContextMenuState-What useContextMenu returns. One hook per menu - two menus sharing one state open together.
actionsreadonly MenuAction[]-The rows, in order. Choosing one closes the menu before running it.
label?string"Actions"Named for screen readers, since the menu itself has no visible title.

Notes

state has to come from useContextMenu - one hook call per menu. Two ContextMenus sharing one hook's return value open and close together, since the state (open, position, id) is shared, not per-instance.

MenuAction.onSelect may return a promise; it is awaited with void, so a slow action does not block the menu from closing. It closes immediately on selection either way - there is no way to keep the menu open across an action, by design: a menu that lingers after a choice looks like the choice did not register.

UsesIconIconThe glyph set, generated from a Markdown table where every drawing carries its reason. One component, typed names, no icon font.@sushindustries/ui · content
Used byFolder ShelfFolder ShelfA desktop of folders that open into draggable windows, several at once, remembered between visits.@sushindustries/ui · layout