Dropdown Menu

Shows a menu of actions from a trigger.

Installation

Install Dropdown Menu from Oros with shadcn CLI 4.13.0.

pnpm dlx shadcn@4.13.0 add @oros/dropdown-menu

Usage

import {
  DropdownMenu,
  DropdownMenuPortal,
  DropdownMenuTrigger,
  DropdownMenuContent,
  DropdownMenuGroup,
  DropdownMenuLabel,
} from "@/components/ui/dropdown-menu"

Open the Source tab in the preview for a complete working example.

Anatomy

Export	Responsibility
DropdownMenu	The root component that owns the primary structure and state.
DropdownMenuPortal	Moves overlay content to a stable document layer.
DropdownMenuTrigger	Controls opening, selection, or disclosure behavior.
DropdownMenuContent	Contains the primary visible content.
DropdownMenuGroup	Groups related items into one logical set.
DropdownMenuLabel	Provides a visible label for its related control or value.
DropdownMenuItem	Represents one option or repeated child.
DropdownMenuCheckboxItem	Represents one option or repeated child.
DropdownMenuRadioGroup	Groups related items into one logical set.
DropdownMenuRadioItem	Represents one option or repeated child.
DropdownMenuSeparator	Visually and semantically separates related groups.
DropdownMenuShortcut	A composable part of the component anatomy.
DropdownMenuSub	A composable part of the component anatomy.
DropdownMenuSubTrigger	Controls opening, selection, or disclosure behavior.
DropdownMenuSubContent	Contains the primary visible content.

API Reference

Dropdown Menu exports 15 named entries. Component exports accept the props of their underlying HTML element or Base UI component, plus an optional className, unless the source defines a more focused type.

DropdownMenu Component
DropdownMenuPortal Component
DropdownMenuTrigger Component
DropdownMenuContent Component
DropdownMenuGroup Component
DropdownMenuLabel Component
DropdownMenuItem Component
DropdownMenuCheckboxItem Component
DropdownMenuRadioGroup Component
DropdownMenuRadioItem Component
DropdownMenuSeparator Component
DropdownMenuShortcut Component
DropdownMenuSub Component
DropdownMenuSubTrigger Component
DropdownMenuSubContent Component

Accessibility

Dropdown Menu inherits focus management and keyboard support from Base UI; keep the provided trigger and content parts together.
Give icon-only triggers an accessible name, retain visible focus styles, and verify Escape and focus-return behavior in the final composition.

Source

Dropdown Menu uses the standard shadcn API and is distributed through Oros. Installing it adds the component source and required dependencies to your app. The Source tab above shows a complete usage example.

Migrating from COSS? Install dropdown-menu in place of menu.

Drawer Empty