Dropdown Menu

A menu of actions triggered by a button. Rises with overlay depth; items highlight on hover and keyboard navigation.

tsx
import { Button } from "@/registry/seam/ui/button"
import {
  DropdownMenu,
  DropdownMenuContent,
  DropdownMenuItem,
  DropdownMenuLabel,
  DropdownMenuSeparator,
  DropdownMenuTrigger,
} from "@/registry/seam/ui/dropdown-menu"

export default function DropdownMenuDemo() {
  return (
    <DropdownMenu>
      <DropdownMenuTrigger
        render={<Button variant="outline">Open menu</Button>}
      />
      <DropdownMenuContent>
        <DropdownMenuLabel>My Account</DropdownMenuLabel>
        <DropdownMenuSeparator />
        <DropdownMenuItem>Profile</DropdownMenuItem>
        <DropdownMenuItem>Settings</DropdownMenuItem>
        <DropdownMenuItem>Team</DropdownMenuItem>
        <DropdownMenuSeparator />
        <DropdownMenuItem>Log out</DropdownMenuItem>
      </DropdownMenuContent>
    </DropdownMenu>
  )
}
bunx --bun @seamui/cli@latest add dropdown-menu

Notes

  • Full keyboard support — arrows, Home/End, typeahead, Escape — with role="menu" semantics; Base UI handles positioning and collision.
  • Submenus animate from their own trigger origin, same as the root menu.
  • Checkbox and radio items ship in the same file when a menu needs selectable state.

Press feedback, reduced motion, and haptics follow the global policy — see Motion and Haptics.