Basic actions
With icons
With shortcuts
Icon-only trigger
Icon toolbar
Compact
Animation variants
animationVariant — click each control to compare press feedback.
API
| Prop | Required | Type | Default | Description |
|---|---|---|---|---|
| theme | Optional | SiteTheme | atelier | Visual theme. |
| trigger | Optional | ReactNode | — | Menu trigger control — button or IconButton. |
| items | Optional | MenuItem[] | — | id, label, icon?, iconOnly?, shortcut?, disabled?, destructive?, onSelect? |
| layout | Optional | "vertical" | "horizontal" | vertical | Vertical list or horizontal icon toolbar. |
| density | Optional | "default" | "compact" | default | Row padding scale. |
| menuSeparatorItem | Optional | helper | — | Returns a separator row for items array. |
| open / onOpenChange | Optional | boolean + callback | — | Controlled visibility. |
| animationVariant | Optional | PressAnimationVariant | default | Press animation on menu items — default, none, ripple, scale, sink, lift, pulse, or glow. |
| enterAnimationVariant | Optional | EnterAnimationVariant | default | Panel enter/exit — default and spring use fluid spring physics (Animate UI–style); zoom is a stronger pop; subtle keeps legacy ease motion; fade, slide-*, scale, or none. |