generated:catalog.entry.menu.title
generated:catalog.entry.menu.description
@xngui/components/menuimport { XMenu } from '@xngui/components/menu';chrome:demo.section
chrome:demo.preview
import { Component } from '@angular/core';
import { XButton } from '@xngui/components/button';
import { XMenu, XMenuGroup, XMenuItem, XMenuSeparator } from '@xngui/components/menu';
@Component({
selector: 'app-example',
imports: [XButton, XMenu, XMenuGroup, XMenuItem, XMenuSeparator],
templateUrl: './menu.component.html',
})
export class ExampleComponent {}
chrome:demo.events.title
chrome:demo.events.empty
chrome:demo.api.title
x-menu
chrome:demo.api.col.property
chrome:demo.api.col.type
chrome:demo.api.col.default
chrome:demo.api.col.description
placementXPlacement—Connected placement — submenus default to `end-start`; root menus fall back to XConfigService when unset.
offsetXnumber0Horizontal offset from the anchor (px).
offsetYnumberthis.parentMenu ? 0 : DEFAULT_ORIGIN_OFFSET_YVertical offset from the anchor (px).
sizeXSize—Visual size tier — nested menus inherit the parent; otherwise falls back to XConfigService when unset.
densityXDensity—Spacing offsets — orthogonal to `size`; nested menus inherit the parent resolved density when unset.
matchWidthbooleanfalseWhen true, the open panel width matches the trigger origin (overridable per open via `options.width`).
ariaLabelstring—Accessible name for the menu panel.
panelClassstring—Extra class names applied to the floating panel element.
role'menu' | 'listbox''menu'ARIA role for the panel (`menu` by default; `listbox` when used by `x-select`).
ariaMultiselectablebooleanfalseWhen `role` is `listbox`, exposes multi-select to assistive tech.