Six sequences
Cascade, fan, draw, flip, reveal, or orbit actions into a stable list.
Menus & navigation
Menu Transition
Sequence compact navigation without turning it into a spectacle. Tune direction, rhythm, spacing, and material with complete keyboard dismissal.
Navigation that arrives in order
A menu should reveal choices and preserve orientation.
All six presets share a finite four-item model, roving keyboard focus, explicit expanded state, outside dismissal, and runtime cleanup.
Roving focus
Arrow keys, Home, End, and Escape follow the expected menu keyboard pattern.
Clean lifecycle
Document-level outside listeners are removed by the exported destroy hook.
Three-step workflow
How to use the Menu Transition studio
- Choose an entrance direction
Align movement with the trigger position and available screen edge.
- Keep the item set bounded
Menus are for concise choices; move deep structures into persistent navigation.
- Test every exit
Select an item, press Escape, click outside, and reopen with the keyboard.
Questions, answered.
Does the menu close after selection?
Yes, then focus returns to its trigger and the current selection is announced.
Can two menus coexist?
Yes. IDs, selection, listeners, and destroy hooks are scoped per root.
What is cleaned up?
Click, keydown, and document-level pointer listeners are all removed.