mirror of
https://github.com/storytold/artcraft.git
synced 2026-11-05 17:58:55 +00:00
Tanish Manku
e6be45f3d4
Reveal/RevealGroup called `motion(as)` inside the render body. Unlike the cached `motion.div` accessor, calling `motion()` as a function returns a brand-new component type on every invocation. So each re-render produced a different element type at that position, React unmounted and remounted the whole subtree, and any focused <input> inside (the login/signup/forgot-password forms) lost focus on every keystroke — you could only type one character at a time. Cache one motion component per element type via a module-level map so the component reference stays stable across renders. React now reconciles in place and focus is preserved. Verified with a Playwright A/B test on the login form: before the fix typing "test@example.com" left only "t" with focus on <body> (1 blur mid-type); after the fix the full value is retained, focus stays on the input, zero blurs.