DropdownMenu

Preview

Actions and groups

Checkbox and radio items

Submenu

Installation

$ pnpm dlx shadcn@latest add https://ui.ketyap.me/r/dropdown-menu.json

Usage

Copyimport { Button } from "@/components/ui/button";
import {
  DropdownMenu,
  DropdownMenuTrigger,
  DropdownMenuContent,
  DropdownMenuGroup,
  DropdownMenuItem,
} from "@/components/ui/dropdown-menu";
 
<DropdownMenu>
  <DropdownMenuTrigger render={<Button />}>Actions</DropdownMenuTrigger>
  <DropdownMenuContent>
    <DropdownMenuGroup>
      <DropdownMenuItem>New book</DropdownMenuItem>
    </DropdownMenuGroup>
  </DropdownMenuContent>
</DropdownMenu>;

API Reference

Root accepts Base UI Menu props, including controlled open and onOpenChange. Content supports side, align, sideOffset (6px), alignOffset, collisionPadding, and anchor. Exports include Group, Label, Item, Shortcut, Separator, CheckboxItem, RadioGroup, RadioItem, Sub, SubTrigger and SubContent. Items support disabled; regular items also support variant="destructive". Shortcuts are display hints, not global key bindings. Base UI owns dismiss, focus restoration and submenu navigation.