@agala-labs/ui
Dropdown Menu
Offers contextual commands in a top-layer menu that flips and shifts around viewport collisions.
Examples
Default
Activations: 0
| Member | Role | |
|---|---|---|
| Team member 1 | Contributor | |
| Team member 2 | Contributor | |
| Team member 3 | Contributor | |
| Team member 4 | Contributor | |
| Team member 5 | Contributor | |
| Team member 6 | Contributor | |
| Team member 7 | Final row |
<AgalaDropdownMenu :items="actions"><template #trigger><AgalaButton variant="outline">Actions</AgalaButton></template></AgalaDropdownMenu>Import
import { AgalaDropdownMenu } from '@agala-labs/ui'API
| Prop | Type | Default | Description |
|---|---|---|---|
items | DropdownMenuItem[] | — | Required command collection. |
placement | 'bottom-start' | 'bottom-end' | 'bottom-end' | Preferred menu alignment; the vertical side flips when needed. |
class | string | — | Consumer override class. |
Slots
trigger
Accessibility
Supports Arrow keys, Enter, Escape, outside click, and disabled menu items. Focus stays trapped inside an open menu — Tab cycles within it rather than closing it, matching the WAI-ARIA menu button pattern.