hp-context-menu

Right-click triggered menu. Wraps a target region; right-click (or long-press on touch) inside opens an <hp-menu-item> menu positioned at the cursor. Otherwise identical to <hp-dropdown-menu>.

Examples

API

Intent

Changelog

right-click anywhere in this box

cut

copy

paste

<body> <hp-context-menu> <div class="my-target">Right-click me</div> <hp-menu-item slot="content">cut</hp-menu-item> <hp-menu-item slot="content">copy</hp-menu-item> <hp-menu-item slot="content">paste</hp-menu-item> </hp-context-menu> </body>

Install

bun add @hexpunk/core lit

import "@hexpunk/core";

Properties

Property	Attribute	Type	Default	Description
`open`	`open`	`boolean`	`false`

Events

Event	Type	Description
`hp-context-menu-open`	`CustomEvent`	When the menu opens
`hp-context-menu-close`	`CustomEvent`	When the menu closes
`hp-menu-select`	`Event`	When a menuitem is activated (bubbles from hp-menu-item)

Slots

Slot	Description
`(default)`	Target region (everything not slotted into "content")
`content`	hp-menu-item children

CSS Parts

Part	Description
`menu`	The floating menu container

Accessibility

Menu exposes role="menu"; items role="menuitem". Arrow / Home / End / Enter / Space all work; Escape dismisses; focus returns to the previously focused element on close. Shift + right-click falls through to the native browser context menu (escape hatch for power users).