Skip to content

Commit

Permalink
More cleanup of CanvasDOMOverlay
Browse files Browse the repository at this point in the history
  • Loading branch information
gkjohnson committed Jan 15, 2025
1 parent e42119b commit 2e4f80e
Showing 1 changed file with 5 additions and 18 deletions.
23 changes: 5 additions & 18 deletions src/r3f/components/CanvasDOMOverlay.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,37 +10,24 @@ export function CanvasDOMOverlay( { children, ...rest } ) {
const container = useMemo( () => document.createElement( 'div' ), [] );
const root = useMemo( () => createRoot( container ), [ container ] );

// watch for canvas resize
const observer = useMemo( () => {

const observer = new ResizeObserver( ( [ { contentRect } ] ) => {

container.style.top = `${ contentRect.top }px`;
container.style.left = `${ contentRect.left }px`;
container.style.width = `${ contentRect.width }px`;
container.style.height = `${ contentRect.height }px`;

} );
observer.observe( gl.domElement );
return observer;

}, [ gl, container ] );

// position the container
useEffect( () => {

container.style.pointerEvents = 'none';
container.style.position = 'absolute';
container.style.width = '100%';
container.style.height = '100%';
container.style.left = 0;
container.style.top = 0;
gl.domElement.parentNode.appendChild( container );

return () => {

container.remove();
observer.disconnect();

};

}, [ observer, container ] );
}, [ container ] );

Check warning on line 30 in src/r3f/components/CanvasDOMOverlay.jsx

View workflow job for this annotation

GitHub Actions / build (18.x)

React Hook useEffect has a missing dependency: 'gl.domElement.parentNode'. Either include it or remove the dependency array

Check warning on line 30 in src/r3f/components/CanvasDOMOverlay.jsx

View workflow job for this annotation

GitHub Actions / build (20.x)

React Hook useEffect has a missing dependency: 'gl.domElement.parentNode'. Either include it or remove the dependency array

// render the children into the container
root.render(
Expand Down

0 comments on commit 2e4f80e

Please sign in to comment.