DropdownMenu

A contextual action menu. Built on Radix DropdownMenu.

Import

import {
  DropdownMenu,
  DropdownMenuTrigger,
  DropdownMenuContent,
  DropdownMenuItem,
  DropdownMenuLabel,
  DropdownMenuSeparator,
} from '@aspect/react';

Usage

<DropdownMenu>
  <DropdownMenuTrigger asChild>
    <Button variant="secondary">Actions</Button>
  </DropdownMenuTrigger>
  <DropdownMenuContent>
    <DropdownMenuLabel>App</DropdownMenuLabel>
    <DropdownMenuItem>Edit</DropdownMenuItem>
    <DropdownMenuItem>Duplicate</DropdownMenuItem>
    <DropdownMenuSeparator />
    <DropdownMenuItem danger>Delete</DropdownMenuItem>
  </DropdownMenuContent>
</DropdownMenu>

Destructive items

<DropdownMenuItem danger>Delete permanently</DropdownMenuItem>

Props (DropdownMenuItem)

| Prop | Type | Default | Description | | -------- | --------- | ------- | ----------------------- | | danger | boolean | false | Red destructive styling |