Skip to content

DropdownMenu

Open .md
Live preview

Loading example…

DropdownMenu is part of the Overlays set, imported from @jcsoftdev/ui/overlays.

import { DropdownMenu } from "@jcsoftdev/ui/overlays";

Single-component entry points tree-shake to just this component: @jcsoftdev/ui/overlays/dropdown-menu.

export const Default: Story = {
render: (args) => (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="secondary">Acciones de la cita</Button>
</DropdownMenuTrigger>
<DropdownMenuContent {...args}>
<DropdownMenuLabel>Luis Ramírez · 11:30</DropdownMenuLabel>
<DropdownMenuItem>Reprogramar</DropdownMenuItem>
<DropdownMenuItem>Cobrar S/ 45</DropdownMenuItem>
<DropdownMenuItem disabled>Enviar recordatorio</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem className="text-danger">Anular cita</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
),
};

Source of the Storybook story.

This component declares no props of its own.

It also accepts the native props of the element or primitive it renders (for example className, id, aria-* and event handlers).

packages/ui/src/overlays/dropdown-menu/dropdown-menu.tsx