Dropdown Menu

Compare Dropdown Menu for React and React Native in VLLNT UI 0.4.0. Explore source, dependencies and native capabilities. Native is source-only; npm publication is pending.

Supported platforms:WebNative
Report a bug

What it is and when to use

Dropdown Menu is an accessible menu triggered by a button, built on Radix UI's dropdown-menu primitive. It supports plain items, checkbox items, radio groups, nested submenus, labels, separators, and keyboard shortcuts, with optional inset spacing for alignment. Use it for action menus, account switchers, and command surfaces where users pick an option. Radix provides keyboard navigation, typeahead, focus management, and correct ARIA roles out of the box.

Overlay

Preview

Switch between light and dark to inspect the embedded Storybook preview.

Accessible dropdown menu with items, checkboxes, radio groups, and submenus. Part of the overlay family in VLLNT UI, it ships as a machine-readable registry entry — copy the source directly into your app with the shadcn CLI and own it, no runtime dependency on a component library.

Platform comparison

PlatformDependenciesCapabilities
Web@vllnt/ui@^0.3.0Browser rendering, DOM events, and ARIA semantics
Native@vllnt/ui-native, react-nativeNative-adapted interaction and accessibility

Installation

Add Dropdown Menu to your project with the shadcn CLI. The source lands in your codebase, ready to adapt:

pnpm dlx shadcn@latest add https://ui.vllnt.com/r/dropdown-menu.json

Source

Stories

Explore every variant and state in the interactive Storybook:

FAQ

What is Dropdown Menu?
Dropdown Menu is an accessible menu component for React that opens from a trigger button. Built on Radix UI, it supports items, checkbox items, radio groups, submenus, labels, separators, and shortcuts.
How do I add Dropdown Menu?
Run `pnpm dlx shadcn@latest add https://ui.vllnt.com/r/dropdown-menu.json` to install it into your project via the shadcn CLI.
Is Dropdown Menu keyboard accessible?
Yes. It is built on Radix UI's dropdown-menu primitive, which handles keyboard navigation, typeahead, focus management, and ARIA roles, including nested submenus and checkbox and radio items.