motion-react

To add declarative animations to React components, you use motion primitives to animate HTML and SVG elements by passing properties directly to motion components, enabling smooth transitions without manual timeline management.

AnimatePresence handles component entrance and exit transitions in React by tracking mounted elements and triggering exit animations before they are removed from the DOM, ensuring polished UI lifecycles.

Yes, you can use drag and tap gestures to drive React UI animations by attaching gesture recognizers to motion components, which automatically map pointer interactions to dynamic animation states.

The best way to compose reusable animation states in React is by defining variants, which are named animation objects that components can switch between dynamically to create complex sequences and orchestrate parent-child interactions.

Layout animations automatically animate element position and size changes when React UI states update dynamically, smoothly transitioning elements between layout states without manual coordinate calculations.

To animate scroll-driven interactions in a React app, you need an existing React project environment where you can install the motion library and import motion components to bind animation properties to scroll progress.