motion-vue

What problem does it solve?

Enables advanced Vue animations by using motion-v to drive interactive UI, reducing boilerplate and ensuring smooth transitions.

Core Features & Use Cases

• Motion components for Vue (motion.div, motion.v) enable declarative animation definitions.
• Gesture and interaction animations using whileHover, whilePress, whileDrag for responsive UI.
• Scroll-linked and viewport-aware effects with useScroll, whileInView, and AnimatePresence.
• Layout animations and transitions with layout and layoutId, plus LayoutGroup for coordinated changes.
• Presence transitions and orchestration with AnimatePresence for modals and dynamic content.
• Real-world use: draggable lists, modal dialogs with transitions, parallax effects, and progressive enhancements.

Quick Start

Install motion-v in your project and import the motion components in a Vue component. For example, install with npm install motion-v, then import { motion } from 'motion-v' and use a simple motion.div with initial and animate props.