AutoAnimate（@formkit/auto-animate）是一个零配置的动画库，用于为界面中元素的添加、移除和重新排序提供平滑过渡，适用于 React、Vue、Svelte 及原生 JS。
用途：列表增删与排序过渡、折叠面板展开收起、Toast 提示淡入淡出、表单校验消息出现与消失等。适合偏好零配置、重视小体积或需给已有/第三方代码加动画的场景；复杂编排、手势、滚动、弹簧物理或 SVG 路径动画则应考虑 Motion 等库。
主要能力：自动动画化添加、移除与重排；默认零配置；约 3.28 KB gzip，无依赖；框架无关；自动遵循 prefers-reduced-motion。
使用方式：安装 bun add @formkit/auto-animate。React 中从 "@formkit/auto-animate/react" 导入 useAutoAnimate，取得 ref 并挂到包含动画子元素的父元素，例如 <ul ref={parent}>。可选配置 duration（默认 250 毫秒）、easing（默认 ease-in-out），建议保持默认并勿将 disrespectUserMotionPreference 设为 true。SSR 环境（如 Cloudflare Workers、Next.js）需用动态导入的客户端专用方式引入。
关键限制与已知问题：列表项必须使用唯一且稳定的 key（不要用 index）；父元素必须始终渲染，不能条件渲染；父元素会被自动加上 position: relative，可能影响布局；避免对动画元素使用 flex-grow: 1，改用显式宽度；表格应对 <tbody> 应用而非单个 <tr>；Jest、esbuild、Vue/Nuxt、Angular 等环境存在对应配置问题需处理。
已验证版本为 ^0.10.0，配合 React ^19.2.0、Vite ^7.3.0。官方站点 https://auto-animate.formkit.com，GitHub https://github.com/formkit/auto-animate，npm https://www.npmjs.com/package/@formkit/auto-animate。