Motion v13 是一个面向 React 的动画库，前身为 framer-motion。其 npm 包名为 motion，版本为 ^13。使用时需从 motion/react 导入，而不是从 framer-motion 导入。
用途 Motion v13 用于实现 React 应用中的动画效果，包括手势、滚动联动、布局动画、共享元素过渡和 SVG 动画。典型使用场景包括拖拽、滚动动画、模态框、轮播、视差效果以及 AnimatePresence 等。该技能建议优先使用 CSS 或 tw-animate-css 实现动画，仅在需要上述复杂交互时使用 Motion。
主要能力
- 手势支持：拖拽等交互。
- 滚动联动动画：随滚动位置触发的动画。
- 布局动画：元素布局变化时的平滑过渡。
- 共享元素过渡：不同视图间元素的连续动画。
- SVG 动画。
- AnimatePresence：用于处理组件挂载与卸载时的动画。
使用方式 安装命令：pnpm add motion 导入方式：import { motion, AnimatePresence } from "motion/react"
注意事项 Motion 13 移除了对 @emotion/is-prop-valid 的可选依赖。如果样式化 motion 组件将 CSS-in-JS 属性泄漏到 DOM，可通过 MotionConfig 注入 isValidProp，或使用 motion.create(StyledDiv) 进行组合。更多信息可参考官方升级指南：https://motion.dev/docs/react-upgrade-guide
相关参考
- 与旧版 Framer Motion API 的差异修正：rules/motion.md
- 常见模式：references/common-patterns.md
- Next.js 中的 'use client' 集成：references/nextjs-integration.md
- 性能优化：references/performance-optimization.md
限制 该技能仓库可能未在 package.json 中列出 motion（优先使用 CSS/tw-animate-css），但保留 motion-v13 以保持 pnpm add motion 的对齐。不要为已有 npm 主版本的库虚构 -v1 后缀。