Repository navigation
fix(ripple-button): clean up overlapping ripples independently - #1020
Merged
Yeom-JinHo merged 2 commits intoOct 17, 2026
Merged
Conversation
Give each ripple its own cleanup timer so later clicks do not cancel earlier removals. Regenerate the installable registry payload.
|
@xpeng5278-web 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
self-requested a review
October 11, 2026 11:34
Yeom-JinHo
approved these changes
Oct 17, 2026
Yeom-JinHo
left a comment
Member
There was a problem hiding this comment.
@xpeng5278-web
Thanks for the fix and the thorough repro! Confirmed the behavior locally.
I pushed one small commit on top (2b2a676) renaming the internal Ripple component to ButtonRipple to avoid confusion with the exported Ripple background component. No behavior change.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Fixes #1019
Summary
Fixes the RippleButton cleanup backlog: each new click was canceling the previous ripple's removal timer, so expired nodes accumulated during rapid clicks and then drained one-per-duration after input stopped.
What
useEffecttimeout with a small internalRipplechild that owns its own cleanup timer and calls a stableremoveRipple(key)callback.Date.now()so rapid clicks in the same millisecond do not collide.apps/www/public/r/ripple-button.jsonandapps/www/public/llms-full.txtviapnpm build:registry.Why
With default
duration="600ms", click at t=0 and t=100 ms: both animations finish by t=700 ms, but main retained 1 node. Twenty clicks spaced 100 ms apart left 19 expired nodes after one more duration. #909 fixed missing--durationfor animation; cleanup scheduling was unchanged.How tested
Against unmodified
main(cdb348cb):With this branch:
vi.getTimerCount() === 0)onClickstill fires once per clickRepo gates:
pnpm check(lint, typecheck, format:check, registry-deps:check) ✅pnpm build:registry✅pnpm build✅Notes
Distinct from #908/#909 (animation duration CSS variable). No changes to the background
Ripplecomponent or button styling API.