Installnpx shadcn@latest add https://motion-lexicon.pages.dev/r/primitive-page-transition.json
- Purpose
- Preserve context across page or route changes and explain the new page's hierarchical source.
- Trigger
- Trigger after route intent is confirmed, managing data waiting separately from visual transition.
- Interruptibility
- New navigation replaces the previous target immediately, and browser back resumes from current transition state.
- Reduced motion
- Use immediate routing with a short content fade while preserving loading and focus feedback.
page-transitionPage transitionRoute navigation is accompanied by coordinated exit and entrance states for page-level content.
view-transitionView transitionThe browser captures old and new render states, then animates their snapshots and designated shared elements.