Skip to content

fix(animated-beam): make default duration deterministic#895

Open
iharshyadav wants to merge 1 commit intomagicuidesign:mainfrom
iharshyadav:fix/issue-840-animated-beam-duration-sync
Open

fix(animated-beam): make default duration deterministic#895
iharshyadav wants to merge 1 commit intomagicuidesign:mainfrom
iharshyadav:fix/issue-840-animated-beam-duration-sync

Conversation

@iharshyadav
Copy link

Summary

This PR fixes inconsistent animation timing in Animated Beam when multiple beams are rendered without explicitly setting a duration.

Root Cause

The component used a random default duration per instance (Math.random() * 3 + 4), which made beams drift out of sync.

Fix

  • Changed the default duration to a deterministic value: 5
  • Kept behavior unchanged for users who already pass a custom duration

Files Changed

  • apps/www/registry/magicui/animated-beam.tsx
  • apps/www/public/r/animated-beam.json
  • apps/www/public/llms-full.txt

Validation

  • Ran dependency install with pnpm
  • Rebuilt registry artifacts
  • Verified lint/check flow relevant to changed files
  • Confirmed no API changes, only stable default timing behavior

Related

Closes #840

@vercel
Copy link

vercel bot commented Mar 1, 2026

@iharshyadav is attempting to deploy a commit to the product-studio Team on Vercel.

A member of the Team first needs to authorize it.

@Yeom-JinHo Yeom-JinHo self-requested a review March 1, 2026 05:51
@Yeom-JinHo
Copy link
Collaborator

Yeom-JinHo commented Mar 1, 2026

@iharshyadav
Thanks for working on this and for the quick turnaround.

I think this PR fixes the default duration randomness issue (Math.random() * 3 + 4), but it may not fully solve timing drift in cases where duration/delay are passed explicitly (for example, the server-connections repro). In those cases, changing the default duration has no effect.

The remaining drift seems to come from repeatDelay: 0 being hardcoded. Beams with different duration/delay values can look aligned in the first cycle, then gradually go out of phase.

Would you be able to add a follow-up commit in this PR to expose repeatDelay (and optionally repeat) as props so explicit timing setups can stay synchronized across cycles?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[bug]: AnimatedBeams - Inconsistent timings

2 participants