Direction-Aware Menu Animations

When the placement engine positions a menu, it applies a CSS class like alap-placed-se. This lets you write animations that slide the menu in from the direction it was placed. Try each trigger below.

Compass Rose (DOM adapter)

Each menu slides in from its placement direction.

Compass Rose (Web Component)

NW
N
NE
W
C
E
SW
S
SE

Web component menus use shadow DOM — animations are applied via ::part(menu).