Circuit-Forge/peregrine
2
0
Fork 0
Code Issues 22 Pull requests 2 Projects Releases 6 Packages Wiki Activity Actions

fix(vue-spa): suppress spring snap-back on processed cards

Browse source 
When a new job prop arrives after approve/reject, the watch cleared the
exit-transform inline style while the spring transition was still active,
causing the card to animate from offscreen back to center before the new
card rendered. Fix: set transition:none before clearing the style, then
restore it on the next rAF — browser paints the new position first.
This commit is contained in:
pyr0ball 2026-03-17 22:39:06 -07:00
parent 0b66959860
commit ffec6bb843
1 changed files with 9 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
web/src/components/JobCardStack.vue
View file

@ -204,8 +204,15 @@ watch(() => props.job.id, () => {
isHeld.value = false isHeld.value = false
isExpanded.value = false isExpanded.value = false
if (wrapperEl.value) { if (wrapperEl.value) {
// Suppress the spring transition for this frame — without this the card
// spring-animates from its exit position back to center before the new
// job renders (the "snap-back on processed cards" glitch).
wrapperEl.value.style.transition = 'none'
wrapperEl.value.style.transform = '' wrapperEl.value.style.transform = ''
wrapperEl.value.style.opacity = '' wrapperEl.value.style.opacity = ''
requestAnimationFrame(() => {
if (wrapperEl.value) wrapperEl.value.style.transition = ''
})
} }
}) })