Props

Name	Type	Default	Description
items	MoreMenuOption[]	-	What the menu holds: actions (MoreMenuItem), hairlines ({ type: 'divider' }), and groups ({ type: 'section', title, items }). Required.
label	string	'More options'	The trigger's accessible name, which is also the name of the menu itself and the text of its tooltip.
variant	ButtonVariant	'ghost'	Visual variant of the trigger button: primary, secondary, ghost, or destructive.
size	ButtonSize	'md'	Size of the trigger button: sm, md, or lg. The density of every menu row follows it.
isDisabled	boolean	false	Whether the trigger is disabled. A disabled trigger is dimmed, announces itself as disabled, and opens nothing from a click or the keyboard.
placement	'above' | 'below' | 'start' | 'end'	'below'	Where the anchored surface sits relative to the trigger. The direction is logical: start and end resolve against the menu's own direction, so RTL mirrors them. The surface flips when there is no room.
alignment	'start' | 'center' | 'end'	'start'	Alignment along the placement axis. An overflow menu usually wants end, so the surface lines up with the trigger's trailing edge.
presentation	'popover' | 'bottom-sheet' | 'adaptive'	'popover'	Shape the actions arrive in. popover anchors the surface to the trigger; bottom-sheet is a modal panel at the bottom of the screen; adaptive uses the bottom panel at 768px and below when the primary pointer is coarse, and the anchored surface otherwise.
isMenuOpen	boolean	-	Controlled open state, meant for v-model:isMenuOpen. Leave it unbound to let the component own its state.
isInline	boolean	false	Renders the surface in place instead of moving it to the top of the document. It then flows with the page and is not positioned against the viewport. Intended for documentation previews and for surfaces that must not escape their container.

MoreMenuItem

An action entry in items carries:

Name	Type	Default	Description
label	string	-	The row's primary text. Required.
id	string	-	Stable identity of the row within its level. Omit it and the row is matched by position; set it when items can reorder, filter, or grow, so a row keeps its DOM node — and its keyboard focus — as the array changes.
icon	string | Component	-	Icon shown before the label: a CSS icon class (an UnoCSS class such as i-carbon-copy, or one of your own), or a component that draws the SVG. astryx-vue ships no icons.
description	string	-	A supporting line below the label, for telling near neighbours apart.
isDisabled	boolean	false	Whether the row is unavailable. A disabled row is dimmed, announces itself as disabled, and is skipped by the arrow keys and by type-ahead.
variant	'default' | 'destructive'	'default'	destructive paints the label, description, and icon in the error color for dangerous actions such as deletion.
href	string	-	Address the row navigates to. With it the row is a real link, so a modified click and a middle click keep their browser meaning, such as opening a new tab.
target	'_blank' | '_self'	-	Where the link opens. Only used with href.
rel	string	-	Link relationship tokens. noopener noreferrer is added when target is _blank.
endContent	string	-	Trailing content of the row, such as a shortcut hint.
hasCloseOnSelect	boolean	true	Whether activating the row closes the menu. Set it to false for an action that reports its result on the row itself, such as a copy row that swaps to "Copied".
items	MoreMenuOption[]	-	Nested entries. With them the row becomes a submenu entry: it opens a flyout on a pointer layout and shows its own view in the bottom panel.
onClick	(event: MouseEvent) => void	-	The row's action. On a link row it runs before the browser navigates, and is skipped for a modified click, which belongs to the browser.

Events

Name	Payload	Description
openChange	(isOpen: boolean) => void	Fired whenever an open or close is requested. In uncontrolled usage it reports the change; in controlled usage it is the request to update the bound state.
update:isMenuOpen	(isOpen: boolean) => void	The update event of v-model:isMenuOpen in controlled usage.

Slots

Name	Description
icon	Artwork of the trigger, replacing the default three-dot icon. The trigger stays icon-only and takes its accessible name from label.

Exposed

Name	Type	Description
element	HTMLElement | null	The trigger button element.
focus	(options?: FocusOptions) => void	Moves focus onto the trigger button.
blur	() => void	Removes focus from the trigger button.

Native attributes

The root element is a <span>, and the trigger button is the <button> inside it.

Attributes passed to the component — class, style, data-*, and the rest — fall through to the root element. The trigger button takes its accessible name from label, and its aria-expanded, aria-haspopup, and aria-controls are maintained by the component from the open state and the presentation.

While the menu is open its surface moves to the end of the document, under <body>, and is presented as a floating layer. Set is-inline to keep it where it is.