DropdownMenu

An optional arrow that points from the content back toward the trigger. Render it inside the content; it tracks the trigger as the menu repositions.

No props or events — renders its element and forwards attributes.

A menu item that toggles a boolean (or indeterminate) state. Bind `v-model:checked` to track the value; pair it with DropdownMenuItemIndicator to render a check mark when active.

No props or events — renders its element and forwards attributes.

The floating surface that holds the menu items, positioned relative to the trigger. Handles focus management, typeahead, and dismissal on outside click or Escape; render it inside a portal so it escapes overflow clipping.

No props or events — renders its element and forwards attributes.

Groups related items so assistive tech announces them together. Pair it with a DropdownMenuLabel to give the group an accessible name.

No props or events — renders its element and forwards attributes.

A single actionable row in the menu. Emits `select` on click or Enter/Space and closes the menu afterwards unless the event is prevented.

No props or events — renders its element and forwards attributes.

Renders its content only when the enclosing checkbox or radio item is checked. Put a check mark or dot inside it as the selection marker.

No props or events — renders its element and forwards attributes.

A non-interactive heading that titles a section of the menu. It is skipped by keyboard navigation and is not selectable.

No props or events — renders its element and forwards attributes.

Teleports the menu content into the document body (or a chosen target) so it renders above other content and escapes any `overflow: hidden` ancestor.

No props or events — renders its element and forwards attributes.

Groups DropdownMenuRadioItems into a single-choice set. Bind `v-model` to track the selected item's value across the group.

No props or events — renders its element and forwards attributes.

One option within a DropdownMenuRadioGroup. Selecting it sets the group's value to this item's `value`; pair it with DropdownMenuItemIndicator to show which option is active.

No props or events — renders its element and forwards attributes.

A button-triggered menu of actions, opened on click and built on top of Menu, so it inherits keyboard navigation, typeahead, nested submenus, and checkbox/radio items. Unlike a context menu, it is anchored to a persistent trigger button rather than the pointer. Use it for action menus on a toolbar, an avatar, or a "more" button — settings, row actions, account menus, and the like. The root owns open state and provides context to every part; bind `v-model:open` (or listen to `update:open`) to control or observe whether the menu is open.

A horizontal divider used to visually separate groups of items. Decorative and skipped by keyboard navigation.

No props or events — renders its element and forwards attributes.

Wraps a nested submenu, pairing a DropdownMenuSubTrigger with its DropdownMenuSubContent. Owns the submenu's open state; bind `v-model:open` to control or observe it, or leave it unbound and set `defaultOpen` to run uncontrolled. The default slot also exposes the current `open` value.

The floating surface for a submenu's items, positioned alongside its DropdownMenuSubTrigger. Place it inside a DropdownMenuSub.

No props or events — renders its element and forwards attributes.

The item that opens its submenu on hover or ArrowRight and closes it on ArrowLeft. Renders like a regular item but opens DropdownMenuSubContent instead of emitting `select`.

No props or events — renders its element and forwards attributes.

The button that toggles the menu open on click, Enter, Space, or the arrow keys, and serves as the anchor the content is positioned against. Renders a `<button>` by default and wires up the `aria-haspopup`/`aria-expanded` accessibility attributes.