Component registry
Menu motion
The navigation menu entrance tied to its trigger.
Live web demo
Web source: openvibe-shared/navbar · OpenVibeNavbar menu motion
Anatomy
- panelnavigation
- triggermenu button
Props
open- boolean
Behavior and accessibility
- States
- closed · opening · open · closing
- Tokens
- --ov-dur-2 · --ov-ease-out
- Keyboard
- Standard focus order
- Outside tap
- Closes the surface
- Scroll lock
- Page remains scrollable
- Reduced motion
- Reveal immediately without translation.
- Accessibility
- Menu motion. Visible keyboard focus; follow reading order. At least 44 × 44 dp or pt for every touch action.
Android · Jetpack Compose
Use ModalNavigationDrawer animation; reduce motion when requested.
Material 3 container: SurfaceContainerHigh
iOS · SwiftUI
Use a sheet presentation with reduced-motion support.
Example definition
{
"schema": "design.component@1",
"name": "menu-motion",
"props": {
"open": true
}
}