Railbase
GPTClaude

Dropdown Menu

A menu of actions or options triggered by a button.

Updated

Default
<DropdownMenu>
  <DropdownMenuTrigger asChild><Button variant="outline">Open</Button></DropdownMenuTrigger>
  <DropdownMenuContent>
    <DropdownMenuLabel>My account</DropdownMenuLabel>
    <DropdownMenuSeparator />
    <DropdownMenuItem>Profile</DropdownMenuItem>
    <DropdownMenuItem>Billing</DropdownMenuItem>
    <DropdownMenuItem>Sign out</DropdownMenuItem>
  </DropdownMenuContent>
</DropdownMenu>

A menu of actions or options triggered by a button.

Installation

railbase ui add dropdown-menu

Note

railbase ui add also copies shared primitives — they ship alongside this component automatically.

Usage

import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuItem } from "@/lib/ui/dropdown-menu";

<DropdownMenu>
  <DropdownMenuTrigger>Open</DropdownMenuTrigger>
  <DropdownMenuContent>
    <DropdownMenuLabel>My account</DropdownMenuLabel>
    <DropdownMenuSeparator />
    <DropdownMenuItem>Profile</DropdownMenuItem>
    <DropdownMenuItem>Sign out</DropdownMenuItem>
  </DropdownMenuContent>
</DropdownMenu>

Anatomy

Exported parts: DropdownMenu · DropdownMenuTrigger · DropdownMenuContent · DropdownMenuItem · DropdownMenuCheckboxItem · DropdownMenuRadioGroup · DropdownMenuRadioItem · DropdownMenuLabel · DropdownMenuSeparator · DropdownMenuShortcut · DropdownMenuGroup · DropdownMenuPortal · DropdownMenuSub · DropdownMenuSubTrigger · DropdownMenuSubContent