Installnpx shadcn@latest add https://motion-lexicon.pages.dev/r/primitive-slide-in.json
- Purpose
- Use direction to explain where content came from and how it relates spatially to the current layout.
- Trigger
- Trigger when opening a panel, adding content, or entering deeper navigation, with direction matching the source.
- Interruptibility
- A reversing action takes over at the current position and changes direction immediately.
- Reduced motion
- Remove large travel and keep a short fade with a clear layer boundary.
slide-inSlide inA positional transition moves content from beyond an edge into its resting location.
enter-exitEnter / ExitLifecycle motion communicates when an element joins or leaves the rendered interface.