fix: Fix ref as prop causing circular reference in useMemo in React 19
Description
Starting React 19, refs passed as props
This caused the wrapEffect function to not work anymore as the ref ended up being passed accidentally as a dependency of useMemo causing a circular reference issue.
Not sure what's the overall strategy regarding backwards compatibility with React 18.x, and whether any future version of @react-three dependencies plan on supporting older versions of React. Let me know / feel free to adjust this PR based on that.
How to reproduce the issue
- Be on React 19 + React Three Fiber v9
- Create a scene using this package with an effect composer and an effect that depends on
wrapEffector using a custom effect withwrapEffect - Pass a ref to a custom effect or to any effect bundled in the package that rely on
wrapEffect-> you should see the circular reference issue and the scene will not render anymore
How was it tested
Forked the repo and tested the fix for this function by moving it into my own repo with my own custom effect example
Note: As this package still relies on yarn and all my project are on pnpm, I was not able to do further testing building the package locally and linking it.
Issues this addresses
Fixes:
- #334
- #333
- #332