co-menu

Dropdown menu. Wraps co-popover with menu-specific UX: - Default placement="bottom-end" (typical for “more actions” 3-dot triggers) - auto-close on leaf-item selection (bubbled coMenuSelect event) - Renders role="menu" on the panel - Keyboard nav: Arrow Up/Down to move between leaf items in the active panel, Enter to select, Esc/Left to close the current submenu (or the whole menu if at top level), Right to open a submenu under the focused item. Pair with co-menu-item (rows) and co-menu-divider (separators).

Demo

Ver código

<co-menu></co-menu>

API

Props

Prop	Atributo	Tipo	Default	Descripción
autoClose	auto-close	boolean	true	Close the menu after a leaf item is selected.
offset	offset	number	4	Gap in px between trigger and panel.
open	open	boolean	false	Whether the menu panel is visible. Reflected to attribute.
placement	placement	"bottom" | "bottom-end" | "bottom-start" | "left" | "left-end" | "left-start" | "right" | "right-end" | "right-start" | "top" | "top-end" | "top-start"	'bottom-end'	Where the panel appears relative to the trigger.
width	width	string | undefined	—	Fixes the panel to an exact width (e.g. `'210px'`). When unset, the panel keeps its intrinsic auto width (min-width 200px). Also tune padding with the `--co-menu-padding` CSS var (default 4px; design uses 6px).

Eventos

Evento	Detail	Bubbles	Cancelable	Descripción
coClose	void	—	✓
coOpen	void	—	✓

Slots

Este componente no expone slots.

CSS Parts

Este componente no expone CSS parts.

CSS Custom Properties

Este componente no expone CSS custom properties.