Nothing Special   »   [go: up one dir, main page]

Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Upgrade R3F #1494

Merged
merged 1 commit into from
Sep 18, 2023
Merged

Upgrade R3F #1494

merged 1 commit into from
Sep 18, 2023

Conversation

axelboc
Copy link
Contributor
@axelboc axelboc commented Sep 15, 2023

From 8.0.14 to 8.14.1 (version 8.1.0 is on page 7).

  • 8.0.17 (no release notes)
    • Extra wrapper added around the canvas to prevent it from growing indefinitely in some cases. This requires an extra .parentElement to get to r3fRoot and a change to the r3fRoot > canvas CSS selector. R3F still registers events on r3fRoot.
  • 8.2.0
    • Cleaner way of aliasing the Line element to not conflict with SVG line in JSX
    • Note also the new interface ThreeElements to access the prop types of Three objects - e.g. ThreeElements['mesh'] => MeshProps — it could come in handy: <T extends 'mesh' | 'points'>(props: ThreeElements[T]) => void
  • 8.6.0
    • R3F can now be configured to listen for events on another DOM element than gl.domElement.parentNode (i.e. r3fRoot). This is going to enable further refactoring and new features like the picking API.
  • 8.8.0
    • There's now a built-in context bridge, so children of R3F's Canvas can now access contexts provided outside of R3F, like the toolbar configs (not that we want to do that). I think this opens the door to refactoring opportunities, notably in Daiquiri.
  • 8.11.4
    • R3F can be used with an OffscreenCanvas! Maybe a way forward for #95...

*/
.canvasArea,
.r3fRoot {
pointer-events: none !important;
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

R3F now sets pointer-events: auto on r3fRoot when it registers events to it (i.e. when no custom eventSource element is provided), so I need to override that back to none so it doesn't intercept events before they reach other interactive elements.

For now, I'm basically making sure everything still works as it did before: R3F events bubble up to r3fRoot after being fired on the canvas element; they are not directly fired on r3fRoot. I have ideas on how to make the whole thing more straight-forward and resilient by decoupling stacking concerns from interaction concerns.

apps/storybook/package.json Show resolved Hide resolved
apps/storybook/package.json Show resolved Hide resolved
@axelboc axelboc merged commit 95833f9 into main Sep 18, 2023
8 checks passed
@axelboc axelboc deleted the up-r3f branch September 18, 2023 06:36
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