Fix spring + delay producing NaN for string keyframes

[mattgperry]

Summary

• Bug: When using type: 'spring' with delay on elements with string keyframes (e.g., SVG attributes like width: "90%"), the initial state was not respected during the delay period. The element would render with NaN% values, causing it to fill the entire viewport instead of showing the initial state.
• Cause: In JSAnimation.tick(), during the delay phase, keyframes[0] is the original string value (e.g., "90%"). For spring animations with non-numeric keyframes, a mixKeyframes function maps numbers in [0, 100] to interpolated string values. During delay, the original string was incorrectly passed through mixKeyframes, which divided it by 100, producing NaN.
• Fix: Skip the mixKeyframes transformation during the delay phase, since keyframes[0] already contains the correct original string value.

Fixes #3351

Test plan

• Added unit test: spring animation with string keyframes and delay returns correct initial value during delay phase
• yarn build passes
• yarn test passes (all 760 tests)

🤖 Generated with Claude Code

[greptile-apps]

Greptile Summary

Fixes a bug where spring animations with delay and string keyframes (e.g., SVG attributes like width: "90%") produced NaN values during the delay period, causing elements to incorrectly fill the viewport. The root cause was that mixKeyframes was being applied to the original string value during delay, attempting to divide it by 100. The fix adds a condition to skip the mixKeyframes transformation when in the delay phase, since keyframes[0] already contains the correct initial string value.

• Single-line fix that guards mixKeyframes application with !isInDelayPhase condition
• Includes comprehensive unit test covering multiple time points during delay phase
• Fix is minimal, targeted, and preserves post-delay animation behavior

Confidence Score: 5/5

• This PR is safe to merge with minimal risk
• The fix is a single-line conditional change that's well-tested and addresses a specific bug without affecting other code paths. The logic is sound: during delay, the initial keyframe value should be returned as-is without transformation. The test verifies the fix works correctly.
• No files require special attention

Important Files Changed

Filename	Overview
packages/motion-dom/src/animation/JSAnimation.ts	Added condition to skip mixKeyframes transformation during delay phase, preventing NaN values for string keyframes
packages/motion-dom/src/animation/tests/JSAnimation.test.ts	Added unit test verifying spring animations with delay and string keyframes return correct initial value during delay

_{Last reviewed commit: f11e74d}