Skip to content

fix(confetti): prevent canvas worker reset on re-render and fix Confe…#992

Open
Wadiou wants to merge 1 commit into
magicuidesign:mainfrom
Wadiou:fix/confetti
Open

fix(confetti): prevent canvas worker reset on re-render and fix Confe…#992
Wadiou wants to merge 1 commit into
magicuidesign:mainfrom
Wadiou:fix/confetti

Conversation

@Wadiou

@Wadiou Wadiou commented Jul 23, 2026

Copy link
Copy Markdown

fix(confetti): prevent worker reset on re-render and fix ConfettiButton ref forwarding

  • Preserve canvas worker context across parent component re-renders by storing globalOptions and options in refs.
  • Wrap ConfettiButton in forwardRef and extend ComponentPropsWithoutRef.
  • Restructure confetti.mdx documentation tables to accurately reflect manualstart, ConfettiRef, and options.

Description

This PR fixes canvas worker context resets when parent components re-render, enables proper DOM ref forwarding for ConfettiButton, and updates the prop tables in the documentation.

Changes

  • Bug Fix: Replaced fragile callback ref node resets in Confetti with stable optionsRef and globalOptionsRef to preserve WebGL/2D worker contexts across parent state updates and re-renders.
  • Refactoring: Wrapped ConfettiButton in React.forwardRef and extended React.ComponentPropsWithoutRef<typeof Button>.
  • Documentation: Updated confetti.mdx props table and usage code blocks to accurately reflect manualstart, options, globalOptions, and ConfettiRef imperative handle methods.

Motivation

Previously, inline globalOptions defaults caused Confetti's callback ref to trigger cleanup and reset() on every parent state update, permanently destroying the WebGL/2D canvas worker context mid-animation. Additionally, ConfettiButton did not forward refs, and documentation listed particle props on <Confetti /> directly instead of options/ConfettiRef.

Breaking Changes

None.

@vercel

vercel Bot commented Jul 23, 2026

Copy link
Copy Markdown

@Wadiou 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 July 23, 2026 13:51
@Yeom-JinHo

Copy link
Copy Markdown
Member

@Wadiou
Nice fix! The worker reset is a real bug, but its root cause is just the inline globalOptions default recreating the callback ref — a few-line fix. The portal-to-body change goes beyond that and regresses the main demo.

Could we scope this PR to the worker-reset fix and split the portal out as a separate, opt-in change?

…on ref forwarding

- Preserve canvas worker context across parent component re-renders
  by storing globalOptions and options in refs.
- Wrap ConfettiButton in forwardRef and extend ComponentPropsWithoutRef.
- Restructure confetti.mdx documentation tables to accurately reflect
  manualstart, ConfettiRef, and options.
@Wadiou

Wadiou commented Jul 23, 2026

Copy link
Copy Markdown
Author

@Yeom-JinHo Done.

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.

2 participants