ComponentsDropdownMenu

overlaystexulinot agent-emittableapp

DropdownMenu

dropdown-menu

Menu button pattern with items, checkboxes, radios and submenus.

Live examples

Actions menu

Actions menu

Loading demo…

Props

Public props for DropdownMenu
NameKindRequiredDefaultDescription
openbooleannofalse—
classstringno——
childrenslotno——

Keyboard

Keyboard behavior for DropdownMenu
KeyAction
EscapeAPG menu button: arrow keys, typeahead, Escape closes and restores focus.

Accessibility

  • APG menu button: arrow keys, typeahead, Escape closes and restores focus.

Evidence for dropdown-menu

Latest committed gates for dropdown-menu (as of 2026-10-23). Static snapshot — not live CI.

Behavior

checkedscenario dropdown-menu

8 checks

Rows in tests/behavior/scenarios/dropdown-menu.spec.ts, held to the WAI-ARIA APG pattern, run on Chromium, WebKit and the Pixel 7.

Size (gzip)

@texuli/primitives/dropdown-menu · budget 4.00 KiB

Budget from texuli.budgets.json; re-measure with `pnpm size --filter <entry>`.

Axe

documented

  • tests/e2e/site-component-pages.spec.ts
  • docs/quality (a11y-*)

Site component pages axe gate; package-level a11y docs under docs/quality when present.

Browsers

  • chromium
  • webkit
  • mobile

Playwright projects: Desktop Chrome, Desktop Safari, Pixel 7. Firefox is a known gap on this host.

When to use

Use when

  • Actions behind a button trigger
  • Menus with keyboard typeahead

Don’t use when

Prefer another component

  • Top-level app menus (use menubar)
  • Pointer-anchored region menus (use context-menu)