auto-animate

Package: @formkit/auto-animate@0.9.0 (current) Frameworks: React, Vue, Solid, Svelte, Preact Last Updated: 2026-01-21

Why this matters: Prevents Issue #1 (SSR/Next.js import errors). AutoAnimate uses DOM APIs not available on server.

Issue #1: SSR/Next.js Import Errors Error: "Can't import the named export 'useEffect' from non EcmaScript module" Source: https://github.com/formkit/auto-animate/issues/55 Why It Happens: AutoAnimate uses DOM APIs not available on server Prevention: Use dynamic imports (see templates/vite-ssr-safe.tsx)

رسوم متحركة بدون تكوين لـ React وVue وSolid وSvelte وPreact باستخدام @formkit/auto-animate (3.28 كيلو بايت). يمنع 15 خطأ موثقًا، بما في ذلك أخطاء React 19 StrictMode، وواردات SSR، والأبوين المشروطين، ومشكلات إطار العرض، وتعارضات السحب والإفلات، وأخطاء تحويل CSS. يُستخدم عندما: تحريك القوائم/الأكورديون/الخبز المحمص، أو استكشاف أخطاء الرسوم المتحركة SSR وإصلاحها، أو مشكلات React 19 StrictMode، أو الحاجة إلى انتقالات منسدلة يمكن الوصول إليها باستخدام حركة مخففة للتفضيلات التلقائية. المصدر: jezweb/claude-skills.