UI: ContextMenuPopover

The popover of a context menu, opened at a point of the viewport. Import the token file once (@pithyx/ui/tokens.css) and wrap the app in UiProvider; see @pithyx/ui.

Generated from the TSDoc comments of @pithyx/ui 1.0.0-rc.9 at build time; the text below the headings is the comment in the source.

Functions

ContextMenuPopover()

function ContextMenuPopover(props): Element;

The popover of a context menu, opened at a point of the viewport. A second right-click while it is open moves the menu there, or to whichever menu the element at that point opens.

Parameters

Parameter	Type	Description
props	{ x: number; y: number; onClose: () => void; children: ReactNode; }	The point and the menu.
props.x	number	Horizontal position in the viewport, in CSS pixels (the event’s clientX).
props.y	number	Vertical position in the viewport, in CSS pixels (the event’s clientY).
props.onClose	() => void	Called when the menu should close: Escape, a press outside, a picked entry.
props.children	ReactNode	The menu, usually a Menu.

Returns

Element

The popover, open until onClose removes it.

Example

{
  menuAt && (
    <ContextMenuPopover x={menuAt.x} y={menuAt.y} onClose={() => setMenuAt(null)}>
      <Menu onAction={run}>
        <MenuItem id="rename">Rename</MenuItem>
      </Menu>
    </ContextMenuPopover>
  );
}