DropdownMenu

Contextual action menus

OverlayStable

Preview

Interactive preview of the DropdownMenu component with different variants.

Installation

Install the package via npm:

bash
npm install apex-design-system

Import

tsx
import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from 'apex-design-system';

Basic Usage

tsx
<DropdownMenu>
  <DropdownMenuTrigger asChild>
    <Button>Open menu</Button>
  </DropdownMenuTrigger>
  <DropdownMenuContent>
    <DropdownMenuItem>Profile</DropdownMenuItem>
    <DropdownMenuItem>Settings</DropdownMenuItem>
    <DropdownMenuItem>Logout</DropdownMenuItem>
  </DropdownMenuContent>
</DropdownMenu>

Accessibility

This component follows WAI-ARIA best practices and is WCAG 2.1 AA compliant. It includes proper keyboard navigation, focus management, and screen reader support.

View in StorybookView source