@react-three/fiber 8.11.7 → 8.11.9

package/dist/react-three-fiber.cjs.dev.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('./index-baacab10.cjs.dev.js');
+var index = require('./index-4073a042.cjs.dev.js');
 var _extends = require('@babel/runtime/helpers/extends');
 var React = require('react');
 var THREE = require('three');
@@ -160,7 +160,6 @@ const CanvasImpl = /*#__PURE__*/React__namespace.forwardRef(function Canvas({
   });
   const canvasRef = React__namespace.useRef(null);
   const divRef = React__namespace.useRef(null);
-  const [canvas, setCanvas] = React__namespace.useState(null);
   React__namespace.useImperativeHandle(forwardedRef, () => canvasRef.current);
   const handlePointerMissed = index.useMutableCallback(onPointerMissed);
   const [block, setBlock] = React__namespace.useState(false);
@@ -171,56 +170,57 @@ const CanvasImpl = /*#__PURE__*/React__namespace.forwardRef(function Canvas({
   // Throw exception outwards if anything within canvas throws
   if (error) throw error;
   const root = React__namespace.useRef(null);
-  if (containerRect.width > 0 && containerRect.height > 0 && canvas) {
-    if (!root.current) root.current = index.createRoot(canvas);
-    root.current.configure({
-      gl,
-      events,
-      shadows,
-      linear,
-      flat,
-      legacy,
-      orthographic,
-      frameloop,
-      dpr,
-      performance,
-      raycaster,
-      camera,
-      size: containerRect,
-      // Pass mutable reference to onPointerMissed so it's free to update
-      onPointerMissed: (...args) => handlePointerMissed.current == null ? void 0 : handlePointerMissed.current(...args),
-      onCreated: state => {
-        // Connect to event source
-        state.events.connect == null ? void 0 : state.events.connect(eventSource ? index.isRef(eventSource) ? eventSource.current : eventSource : divRef.current);
-        // Set up compute function
-        if (eventPrefix) {
-          state.setEvents({
-            compute: (event, state) => {
-              const x = event[eventPrefix + 'X'];
-              const y = event[eventPrefix + 'Y'];
-              state.pointer.set(x / state.size.width * 2 - 1, -(y / state.size.height) * 2 + 1);
-              state.raycaster.setFromCamera(state.pointer, state.camera);
-            }
-          });
-        }
-        // Call onCreated callback
-        onCreated == null ? void 0 : onCreated(state);
-      }
-    });
-    root.current.render( /*#__PURE__*/React__namespace.createElement(Bridge, null, /*#__PURE__*/React__namespace.createElement(index.ErrorBoundary, {
-      set: setError
-    }, /*#__PURE__*/React__namespace.createElement(React__namespace.Suspense, {
-      fallback: /*#__PURE__*/React__namespace.createElement(index.Block, {
-        set: setBlock
-      })
-    }, children))));
-  }
   index.useIsomorphicLayoutEffect(() => {
-    setCanvas(canvasRef.current);
-  }, []);
+    const canvas = canvasRef.current;
+    if (containerRect.width > 0 && containerRect.height > 0 && canvas) {
+      if (!root.current) root.current = index.createRoot(canvas);
+      root.current.configure({
+        gl,
+        events,
+        shadows,
+        linear,
+        flat,
+        legacy,
+        orthographic,
+        frameloop,
+        dpr,
+        performance,
+        raycaster,
+        camera,
+        size: containerRect,
+        // Pass mutable reference to onPointerMissed so it's free to update
+        onPointerMissed: (...args) => handlePointerMissed.current == null ? void 0 : handlePointerMissed.current(...args),
+        onCreated: state => {
+          // Connect to event source
+          state.events.connect == null ? void 0 : state.events.connect(eventSource ? index.isRef(eventSource) ? eventSource.current : eventSource : divRef.current);
+          // Set up compute function
+          if (eventPrefix) {
+            state.setEvents({
+              compute: (event, state) => {
+                const x = event[eventPrefix + 'X'];
+                const y = event[eventPrefix + 'Y'];
+                state.pointer.set(x / state.size.width * 2 - 1, -(y / state.size.height) * 2 + 1);
+                state.raycaster.setFromCamera(state.pointer, state.camera);
+              }
+            });
+          }
+          // Call onCreated callback
+          onCreated == null ? void 0 : onCreated(state);
+        }
+      });
+      root.current.render( /*#__PURE__*/React__namespace.createElement(Bridge, null, /*#__PURE__*/React__namespace.createElement(index.ErrorBoundary, {
+        set: setError
+      }, /*#__PURE__*/React__namespace.createElement(React__namespace.Suspense, {
+        fallback: /*#__PURE__*/React__namespace.createElement(index.Block, {
+          set: setBlock
+        })
+      }, children))));
+    }
+  });
   React__namespace.useEffect(() => {
+    const canvas = canvasRef.current;
     if (canvas) return () => index.unmountComponentAtNode(canvas);
-  }, [canvas]);
+  }, []);
 
   // When the event source is not this div, we need to set pointer-events to none
   // Or else the canvas will block events from reaching the event source

package/dist/react-three-fiber.cjs.prod.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('./index-ae10f2b1.cjs.prod.js');
+var index = require('./index-a47b404f.cjs.prod.js');
 var _extends = require('@babel/runtime/helpers/extends');
 var React = require('react');
 var THREE = require('three');
@@ -160,7 +160,6 @@ const CanvasImpl = /*#__PURE__*/React__namespace.forwardRef(function Canvas({
   });
   const canvasRef = React__namespace.useRef(null);
   const divRef = React__namespace.useRef(null);
-  const [canvas, setCanvas] = React__namespace.useState(null);
   React__namespace.useImperativeHandle(forwardedRef, () => canvasRef.current);
   const handlePointerMissed = index.useMutableCallback(onPointerMissed);
   const [block, setBlock] = React__namespace.useState(false);
@@ -171,56 +170,57 @@ const CanvasImpl = /*#__PURE__*/React__namespace.forwardRef(function Canvas({
   // Throw exception outwards if anything within canvas throws
   if (error) throw error;
   const root = React__namespace.useRef(null);
-  if (containerRect.width > 0 && containerRect.height > 0 && canvas) {
-    if (!root.current) root.current = index.createRoot(canvas);
-    root.current.configure({
-      gl,
-      events,
-      shadows,
-      linear,
-      flat,
-      legacy,
-      orthographic,
-      frameloop,
-      dpr,
-      performance,
-      raycaster,
-      camera,
-      size: containerRect,
-      // Pass mutable reference to onPointerMissed so it's free to update
-      onPointerMissed: (...args) => handlePointerMissed.current == null ? void 0 : handlePointerMissed.current(...args),
-      onCreated: state => {
-        // Connect to event source
-        state.events.connect == null ? void 0 : state.events.connect(eventSource ? index.isRef(eventSource) ? eventSource.current : eventSource : divRef.current);
-        // Set up compute function
-        if (eventPrefix) {
-          state.setEvents({
-            compute: (event, state) => {
-              const x = event[eventPrefix + 'X'];
-              const y = event[eventPrefix + 'Y'];
-              state.pointer.set(x / state.size.width * 2 - 1, -(y / state.size.height) * 2 + 1);
-              state.raycaster.setFromCamera(state.pointer, state.camera);
-            }
-          });
-        }
-        // Call onCreated callback
-        onCreated == null ? void 0 : onCreated(state);
-      }
-    });
-    root.current.render( /*#__PURE__*/React__namespace.createElement(Bridge, null, /*#__PURE__*/React__namespace.createElement(index.ErrorBoundary, {
-      set: setError
-    }, /*#__PURE__*/React__namespace.createElement(React__namespace.Suspense, {
-      fallback: /*#__PURE__*/React__namespace.createElement(index.Block, {
-        set: setBlock
-      })
-    }, children))));
-  }
   index.useIsomorphicLayoutEffect(() => {
-    setCanvas(canvasRef.current);
-  }, []);
+    const canvas = canvasRef.current;
+    if (containerRect.width > 0 && containerRect.height > 0 && canvas) {
+      if (!root.current) root.current = index.createRoot(canvas);
+      root.current.configure({
+        gl,
+        events,
+        shadows,
+        linear,
+        flat,
+        legacy,
+        orthographic,
+        frameloop,
+        dpr,
+        performance,
+        raycaster,
+        camera,
+        size: containerRect,
+        // Pass mutable reference to onPointerMissed so it's free to update
+        onPointerMissed: (...args) => handlePointerMissed.current == null ? void 0 : handlePointerMissed.current(...args),
+        onCreated: state => {
+          // Connect to event source
+          state.events.connect == null ? void 0 : state.events.connect(eventSource ? index.isRef(eventSource) ? eventSource.current : eventSource : divRef.current);
+          // Set up compute function
+          if (eventPrefix) {
+            state.setEvents({
+              compute: (event, state) => {
+                const x = event[eventPrefix + 'X'];
+                const y = event[eventPrefix + 'Y'];
+                state.pointer.set(x / state.size.width * 2 - 1, -(y / state.size.height) * 2 + 1);
+                state.raycaster.setFromCamera(state.pointer, state.camera);
+              }
+            });
+          }
+          // Call onCreated callback
+          onCreated == null ? void 0 : onCreated(state);
+        }
+      });
+      root.current.render( /*#__PURE__*/React__namespace.createElement(Bridge, null, /*#__PURE__*/React__namespace.createElement(index.ErrorBoundary, {
+        set: setError
+      }, /*#__PURE__*/React__namespace.createElement(React__namespace.Suspense, {
+        fallback: /*#__PURE__*/React__namespace.createElement(index.Block, {
+          set: setBlock
+        })
+      }, children))));
+    }
+  });
   React__namespace.useEffect(() => {
+    const canvas = canvasRef.current;
     if (canvas) return () => index.unmountComponentAtNode(canvas);
-  }, [canvas]);
+  }, []);
 
   // When the event source is not this div, we need to set pointer-events to none
   // Or else the canvas will block events from reaching the event source

package/dist/react-three-fiber.esm.js

@@ -1,5 +1,5 @@
-import { c as createEvents, e as extend, u as useMutableCallback, a as createRoot, i as isRef, E as ErrorBoundary, B as Block, b as useIsomorphicLayoutEffect, d as unmountComponentAtNode } from './index-947d20f1.esm.js';
-export { t as ReactThreeFiber, w as _roots, v as act, o as addAfterEffect, n as addEffect, p as addTail, m as advance, j as applyProps, f as context, c as createEvents, g as createPortal, a as createRoot, k as dispose, e as extend, q as flushGlobalEffects, s as getRootState, l as invalidate, h as reconciler, r as render, d as unmountComponentAtNode, A as useFrame, C as useGraph, x as useInstanceHandle, D as useLoader, y as useStore, z as useThree } from './index-947d20f1.esm.js';
+import { c as createEvents, e as extend, u as useMutableCallback, a as useIsomorphicLayoutEffect, b as createRoot, i as isRef, E as ErrorBoundary, B as Block, d as unmountComponentAtNode } from './index-6b130504.esm.js';
+export { t as ReactThreeFiber, w as _roots, v as act, o as addAfterEffect, n as addEffect, p as addTail, m as advance, j as applyProps, f as context, c as createEvents, g as createPortal, b as createRoot, k as dispose, e as extend, q as flushGlobalEffects, s as getRootState, l as invalidate, h as reconciler, r as render, d as unmountComponentAtNode, A as useFrame, C as useGraph, x as useInstanceHandle, D as useLoader, y as useStore, z as useThree } from './index-6b130504.esm.js';
 import _extends from '@babel/runtime/helpers/esm/extends';
 import * as React from 'react';
 import * as THREE from 'three';
@@ -133,7 +133,6 @@ const CanvasImpl = /*#__PURE__*/React.forwardRef(function Canvas({
   });
   const canvasRef = React.useRef(null);
   const divRef = React.useRef(null);
-  const [canvas, setCanvas] = React.useState(null);
   React.useImperativeHandle(forwardedRef, () => canvasRef.current);
   const handlePointerMissed = useMutableCallback(onPointerMissed);
   const [block, setBlock] = React.useState(false);
@@ -144,56 +143,57 @@ const CanvasImpl = /*#__PURE__*/React.forwardRef(function Canvas({
   // Throw exception outwards if anything within canvas throws
   if (error) throw error;
   const root = React.useRef(null);
-  if (containerRect.width > 0 && containerRect.height > 0 && canvas) {
-    if (!root.current) root.current = createRoot(canvas);
-    root.current.configure({
-      gl,
-      events,
-      shadows,
-      linear,
-      flat,
-      legacy,
-      orthographic,
-      frameloop,
-      dpr,
-      performance,
-      raycaster,
-      camera,
-      size: containerRect,
-      // Pass mutable reference to onPointerMissed so it's free to update
-      onPointerMissed: (...args) => handlePointerMissed.current == null ? void 0 : handlePointerMissed.current(...args),
-      onCreated: state => {
-        // Connect to event source
-        state.events.connect == null ? void 0 : state.events.connect(eventSource ? isRef(eventSource) ? eventSource.current : eventSource : divRef.current);
-        // Set up compute function
-        if (eventPrefix) {
-          state.setEvents({
-            compute: (event, state) => {
-              const x = event[eventPrefix + 'X'];
-              const y = event[eventPrefix + 'Y'];
-              state.pointer.set(x / state.size.width * 2 - 1, -(y / state.size.height) * 2 + 1);
-              state.raycaster.setFromCamera(state.pointer, state.camera);
-            }
-          });
-        }
-        // Call onCreated callback
-        onCreated == null ? void 0 : onCreated(state);
-      }
-    });
-    root.current.render( /*#__PURE__*/React.createElement(Bridge, null, /*#__PURE__*/React.createElement(ErrorBoundary, {
-      set: setError
-    }, /*#__PURE__*/React.createElement(React.Suspense, {
-      fallback: /*#__PURE__*/React.createElement(Block, {
-        set: setBlock
-      })
-    }, children))));
-  }
   useIsomorphicLayoutEffect(() => {
-    setCanvas(canvasRef.current);
-  }, []);
+    const canvas = canvasRef.current;
+    if (containerRect.width > 0 && containerRect.height > 0 && canvas) {
+      if (!root.current) root.current = createRoot(canvas);
+      root.current.configure({
+        gl,
+        events,
+        shadows,
+        linear,
+        flat,
+        legacy,
+        orthographic,
+        frameloop,
+        dpr,
+        performance,
+        raycaster,
+        camera,
+        size: containerRect,
+        // Pass mutable reference to onPointerMissed so it's free to update
+        onPointerMissed: (...args) => handlePointerMissed.current == null ? void 0 : handlePointerMissed.current(...args),
+        onCreated: state => {
+          // Connect to event source
+          state.events.connect == null ? void 0 : state.events.connect(eventSource ? isRef(eventSource) ? eventSource.current : eventSource : divRef.current);
+          // Set up compute function
+          if (eventPrefix) {
+            state.setEvents({
+              compute: (event, state) => {
+                const x = event[eventPrefix + 'X'];
+                const y = event[eventPrefix + 'Y'];
+                state.pointer.set(x / state.size.width * 2 - 1, -(y / state.size.height) * 2 + 1);
+                state.raycaster.setFromCamera(state.pointer, state.camera);
+              }
+            });
+          }
+          // Call onCreated callback
+          onCreated == null ? void 0 : onCreated(state);
+        }
+      });
+      root.current.render( /*#__PURE__*/React.createElement(Bridge, null, /*#__PURE__*/React.createElement(ErrorBoundary, {
+        set: setError
+      }, /*#__PURE__*/React.createElement(React.Suspense, {
+        fallback: /*#__PURE__*/React.createElement(Block, {
+          set: setBlock
+        })
+      }, children))));
+    }
+  });
   React.useEffect(() => {
+    const canvas = canvasRef.current;
     if (canvas) return () => unmountComponentAtNode(canvas);
-  }, [canvas]);
+  }, []);
 
   // When the event source is not this div, we need to set pointer-events to none
   // Or else the canvas will block events from reaching the event source

package/native/dist/react-three-fiber-native.cjs.dev.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('../../dist/index-baacab10.cjs.dev.js');
+var index = require('../../dist/index-4073a042.cjs.dev.js');
 var _extends = require('@babel/runtime/helpers/extends');
 var React = require('react');
 var THREE = require('three');

package/native/dist/react-three-fiber-native.cjs.prod.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('../../dist/index-ae10f2b1.cjs.prod.js');
+var index = require('../../dist/index-a47b404f.cjs.prod.js');
 var _extends = require('@babel/runtime/helpers/extends');
 var React = require('react');
 var THREE = require('three');

package/native/dist/react-three-fiber-native.esm.js

@@ -1,5 +1,5 @@
-import { c as createEvents, e as extend, u as useMutableCallback, a as createRoot, E as ErrorBoundary, B as Block, d as unmountComponentAtNode } from '../../dist/index-947d20f1.esm.js';
-export { t as ReactThreeFiber, w as _roots, v as act, o as addAfterEffect, n as addEffect, p as addTail, m as advance, j as applyProps, f as context, c as createEvents, g as createPortal, a as createRoot, k as dispose, e as extend, q as flushGlobalEffects, s as getRootState, l as invalidate, h as reconciler, r as render, d as unmountComponentAtNode, A as useFrame, C as useGraph, x as useInstanceHandle, D as useLoader, y as useStore, z as useThree } from '../../dist/index-947d20f1.esm.js';
+import { c as createEvents, e as extend, u as useMutableCallback, b as createRoot, E as ErrorBoundary, B as Block, d as unmountComponentAtNode } from '../../dist/index-6b130504.esm.js';
+export { t as ReactThreeFiber, w as _roots, v as act, o as addAfterEffect, n as addEffect, p as addTail, m as advance, j as applyProps, f as context, c as createEvents, g as createPortal, b as createRoot, k as dispose, e as extend, q as flushGlobalEffects, s as getRootState, l as invalidate, h as reconciler, r as render, d as unmountComponentAtNode, A as useFrame, C as useGraph, x as useInstanceHandle, D as useLoader, y as useStore, z as useThree } from '../../dist/index-6b130504.esm.js';
 import _extends from '@babel/runtime/helpers/esm/extends';
 import * as React from 'react';
 import * as THREE from 'three';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-three/fiber",
-  "version": "8.11.7",
+  "version": "8.11.9",
   "description": "A React renderer for Threejs",
   "keywords": [
     "react",