@react-three/fiber 8.0.5 → 8.0.8

package/dist/{index-1ff856c3.cjs.prod.js → index-c4e0ac66.cjs.prod.js}

@@ -39,6 +39,47 @@ var threeTypes = /*#__PURE__*/Object.freeze({
   __proto__: null
 });
 
+// React currently throws a warning when using useLayoutEffect on the server.
+// To get around it, we can conditionally useEffect on the server (no-op) and
+// useLayoutEffect on the client.
+const isSSR = typeof window === 'undefined' || !window.navigator || /ServerSideRendering|^Deno\//.test(window.navigator.userAgent);
+const useIsomorphicLayoutEffect = isSSR ? React__namespace.useEffect : React__namespace.useLayoutEffect;
+function Block({
+  set
+}) {
+  useIsomorphicLayoutEffect(() => {
+    set(new Promise(() => null));
+    return () => set(false);
+  }, [set]);
+  return null;
+}
+class ErrorBoundary extends React__namespace.Component {
+  constructor(...args) {
+    super(...args);
+    this.state = {
+      error: false
+    };
+  }
+
+  componentDidCatch(error) {
+    this.props.set(error);
+  }
+
+  render() {
+    return this.state.error ? null : this.props.children;
+  }
+
+}
+
+ErrorBoundary.getDerivedStateFromError = () => ({
+  error: true
+});
+
+function useMemoizedFn(fn) {
+  const fnRef = React__namespace.useRef(fn);
+  useIsomorphicLayoutEffect(() => void (fnRef.current = fn), [fn]);
+  return (...args) => fnRef.current == null ? void 0 : fnRef.current(...args);
+}
 const DEFAULT = '__default';
 const isDiffSet = def => def && !!def.memoized && !!def.changes;
 function calculateDpr(dpr) {
@@ -860,8 +901,10 @@ function createRenderer(roots, getEventPriority) {
     let added = false;
 
     if (child) {
+      var _child$__r3f, _parentInstance$__r3f;
+
       // The attach attribute implies that the object attaches itself on the parent
-      if (child.__r3f.attach) {
+      if ((_child$__r3f = child.__r3f) != null && _child$__r3f.attach) {
         attach(parentInstance, child, child.__r3f.attach);
       } else if (child.isObject3D && parentInstance.isObject3D) {
         // add in the usual parent-child way
@@ -871,7 +914,7 @@ function createRenderer(roots, getEventPriority) {
       // that is, anything that's a child in React but not a child in the scenegraph.
 
 
-      if (!added) parentInstance.__r3f.objects.push(child);
+      if (!added) (_parentInstance$__r3f = parentInstance.__r3f) == null ? void 0 : _parentInstance$__r3f.objects.push(child);
       if (!child.__r3f) prepare(child, {});
       child.__r3f.parent = parentInstance;
       updateInstance(child);
@@ -883,7 +926,9 @@ function createRenderer(roots, getEventPriority) {
     let added = false;
 
     if (child) {
-      if (child.__r3f.attach) {
+      var _child$__r3f2, _parentInstance$__r3f2;
+
+      if ((_child$__r3f2 = child.__r3f) != null && _child$__r3f2.attach) {
         attach(parentInstance, child, child.__r3f.attach);
       } else if (child.isObject3D && parentInstance.isObject3D) {
         child.parent = parentInstance;
@@ -896,7 +941,7 @@ function createRenderer(roots, getEventPriority) {
         added = true;
       }
 
-      if (!added) parentInstance.__r3f.objects.push(child);
+      if (!added) (_parentInstance$__r3f2 = parentInstance.__r3f) == null ? void 0 : _parentInstance$__r3f2.objects.push(child);
       if (!child.__r3f) prepare(child, {});
       child.__r3f.parent = parentInstance;
       updateInstance(child);
@@ -910,21 +955,21 @@ function createRenderer(roots, getEventPriority) {
 
   function removeChild(parentInstance, child, dispose) {
     if (child) {
-      var _parentInstance$__r3f, _child$__r3f2;
+      var _parentInstance$__r3f3, _child$__r3f3, _child$__r3f5;
 
       // Clear the parent reference
       if (child.__r3f) child.__r3f.parent = null; // Remove child from the parents objects
 
-      if ((_parentInstance$__r3f = parentInstance.__r3f) != null && _parentInstance$__r3f.objects) parentInstance.__r3f.objects = parentInstance.__r3f.objects.filter(x => x !== child); // Remove attachment
+      if ((_parentInstance$__r3f3 = parentInstance.__r3f) != null && _parentInstance$__r3f3.objects) parentInstance.__r3f.objects = parentInstance.__r3f.objects.filter(x => x !== child); // Remove attachment
 
-      if (child.__r3f.attach) {
+      if ((_child$__r3f3 = child.__r3f) != null && _child$__r3f3.attach) {
         detach(parentInstance, child, child.__r3f.attach);
       } else if (child.isObject3D && parentInstance.isObject3D) {
-        var _child$__r3f;
+        var _child$__r3f4;
 
         parentInstance.remove(child); // Remove interactivity
 
-        if ((_child$__r3f = child.__r3f) != null && _child$__r3f.root) {
+        if ((_child$__r3f4 = child.__r3f) != null && _child$__r3f4.root) {
           removeInteractivity(child.__r3f.root, child);
         }
       } // Allow objects to bail out of recursive dispose alltogether by passing dispose={null}
@@ -938,14 +983,14 @@ function createRenderer(roots, getEventPriority) {
       // when the reconciler calls it, but then carry our own check recursively
 
 
-      const isPrimitive = (_child$__r3f2 = child.__r3f) == null ? void 0 : _child$__r3f2.primitive;
+      const isPrimitive = (_child$__r3f5 = child.__r3f) == null ? void 0 : _child$__r3f5.primitive;
       const shouldDispose = dispose === undefined ? child.dispose !== null && !isPrimitive : dispose; // Remove nested child objects. Primitives should not have objects and children that are
       // attached to them declaratively ...
 
       if (!isPrimitive) {
-        var _child$__r3f3;
+        var _child$__r3f6;
 
-        removeRecursive((_child$__r3f3 = child.__r3f) == null ? void 0 : _child$__r3f3.objects, child, shouldDispose);
+        removeRecursive((_child$__r3f6 = child.__r3f) == null ? void 0 : _child$__r3f6.objects, child, shouldDispose);
         removeRecursive(child.children, child, shouldDispose);
       } // Remove references
 
@@ -1303,7 +1348,7 @@ const createStore = (invalidate, advance) => {
         initialClick: [0, 0],
         initialHits: [],
         capturedMap: new Map(),
-        subscribe: (ref, priority = 0) => {
+        subscribe: (ref, priority, store) => {
           set(({
             internal
           }) => ({
@@ -1317,7 +1362,8 @@ const createStore = (invalidate, advance) => {
               // highest priority renders last (on top of the other frames)
               subscribers: [...internal.subscribers, {
                 ref,
-                priority
+                priority,
+                store
               }].sort((a, b) => a.priority - b.priority)
             }
           }));
@@ -1391,8 +1437,23 @@ let i;
 let globalEffects = [];
 let globalAfterEffects = [];
 let globalTailEffects = [];
+/**
+ * Adds a global render callback which is called each frame.
+ * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#addEffect
+ */
+
 const addEffect = callback => createSubs(callback, globalEffects);
+/**
+ * Adds a global after-render callback which is called each frame.
+ * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#addAfterEffect
+ */
+
 const addAfterEffect = callback => createSubs(callback, globalAfterEffects);
+/**
+ * Adds a global callback which is called when rendering stops.
+ * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#addTail
+ */
+
 const addTail = callback => createSubs(callback, globalTailEffects);
 
 function run(effects, timestamp) {
@@ -1400,6 +1461,7 @@ function run(effects, timestamp) {
 }
 
 let subscribers;
+let subscription;
 
 function render$1(timestamp, state, frame) {
   // Run local effects
@@ -1414,7 +1476,10 @@ function render$1(timestamp, state, frame) {
 
   subscribers = state.internal.subscribers;
 
-  for (i = 0; i < subscribers.length; i++) subscribers[i].ref.current(state, delta, frame); // Render content
+  for (i = 0; i < subscribers.length; i++) {
+    subscription = subscribers[i];
+    subscription.ref.current(subscription.store.getState(), delta, frame);
+  } // Render content
 
 
   if (!state.internal.priority && state.gl.render) state.gl.render(state.scene, state.camera); // Decrease frame count
@@ -1479,7 +1544,17 @@ function createLoop(roots) {
 
   return {
     loop,
+
+    /**
+     * Invalidates the view, requesting a frame to be rendered. Will globally invalidate unless passed a root's state.
+     * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#invalidate
+     */
     invalidate,
+
+    /**
+     * Advances the frameloop and runs render effects, useful for when manually rendering via `frameloop="never"`.
+     * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#advance
+     */
     advance
   };
 }
@@ -1489,18 +1564,35 @@ function useStore() {
   if (!store) throw `R3F hooks can only be used within the Canvas component!`;
   return store;
 }
+/**
+ * Accesses R3F's internal state, containing renderer, canvas, scene, etc.
+ * @see https://docs.pmnd.rs/react-three-fiber/api/hooks#usethree
+ */
+
 function useThree(selector = state => state, equalityFn) {
   return useStore()(selector, equalityFn);
 }
+/**
+ * Executes a callback before render in a shared frame loop.
+ * Can order effects with render priority or manually render with a positive priority.
+ * @see https://docs.pmnd.rs/react-three-fiber/api/hooks#useframe
+ */
+
 function useFrame(callback, renderPriority = 0) {
-  const subscribe = useStore().getState().internal.subscribe; // Update ref
+  const store = useStore();
+  const subscribe = store.getState().internal.subscribe; // Update ref
 
   const ref = React__namespace.useRef(callback);
   React__namespace.useLayoutEffect(() => void (ref.current = callback), [callback]); // Subscribe on mount, unsubscribe on unmount
 
-  React__namespace.useLayoutEffect(() => subscribe(ref, renderPriority), [renderPriority, subscribe]);
+  React__namespace.useLayoutEffect(() => subscribe(ref, renderPriority, store), [renderPriority, subscribe, store]);
   return null;
 }
+/**
+ * Returns a node graph of an object with named nodes & materials.
+ * @see https://docs.pmnd.rs/react-three-fiber/api/hooks#usegraph
+ */
+
 function useGraph(object) {
   return React__namespace.useMemo(() => buildGraph(object), [object]);
 }
@@ -1517,12 +1609,14 @@ function loadingFn(extensions, onProgress) {
     }, onProgress, error => reject(`Could not load ${input}: ${error.message}`)))));
   };
 }
+/**
+ * Synchronously loads and caches assets with a three loader.
+ *
+ * Note: this hook's caller must be wrapped with `React.Suspense`
+ * @see https://docs.pmnd.rs/react-three-fiber/api/hooks#useloader
+ */
+
 
-function useMemoizedFn(fn) {
-  const fnRef = React__namespace.useRef(fn);
-  React__namespace.useLayoutEffect(() => void (fnRef.current = fn), [fn]);
-  return (...args) => fnRef.current == null ? void 0 : fnRef.current(...args);
-}
 function useLoader(Proto, input, extensions, onProgress) {
   // Use suspense to load async assets
   const keys = Array.isArray(input) ? input : [input];
@@ -1532,11 +1626,18 @@ function useLoader(Proto, input, extensions, onProgress) {
 
   return Array.isArray(input) ? results : results[0];
 }
+/**
+ * Preloads an asset into cache as a side-effect.
+ */
 
 useLoader.preload = function (Proto, input, extensions) {
   const keys = Array.isArray(input) ? input : [input];
   return suspendReact.preload(loadingFn(extensions), [Proto, ...keys]);
 };
+/**
+ * Removes a loaded asset from cache.
+ */
+
 
 useLoader.clear = function (Proto, input) {
   const keys = Array.isArray(input) ? input : [input];
@@ -1783,7 +1884,7 @@ function Provider({
   onCreated,
   rootElement
 }) {
-  React__namespace.useLayoutEffect(() => {
+  useIsomorphicLayoutEffect(() => {
     const state = store.getState(); // Flag the canvas active, rendering will now begin
 
     state.set(state => ({
@@ -1833,6 +1934,7 @@ function unmountComponentAtNode(canvas, callback) {
 
 function createPortal(children, container, state) {
   return /*#__PURE__*/React__namespace.createElement(Portal, {
+    key: container.uuid,
     children: children,
     container: container,
     state: state
@@ -1910,6 +2012,8 @@ reconciler.injectIntoDevTools({
 });
 const act = React__namespace.unstable_act;
 
+exports.Block = Block;
+exports.ErrorBoundary = ErrorBoundary;
 exports.act = act;
 exports.addAfterEffect = addAfterEffect;
 exports.addEffect = addEffect;
@@ -1933,6 +2037,7 @@ exports.threeTypes = threeTypes;
 exports.unmountComponentAtNode = unmountComponentAtNode;
 exports.useFrame = useFrame;
 exports.useGraph = useGraph;
+exports.useIsomorphicLayoutEffect = useIsomorphicLayoutEffect;
 exports.useLoader = useLoader;
 exports.useMemoizedFn = useMemoizedFn;
 exports.useStore = useStore;

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('./index-28a77253.cjs.dev.js');
+var index = require('./index-b8ee55f0.cjs.dev.js');
 var _extends = require('@babel/runtime/helpers/extends');
 var React = require('react');
 var THREE = require('three');
@@ -53,6 +53,8 @@ const DOM_EVENTS = {
   onPointerCancel: ['pointercancel', true],
   onLostPointerCapture: ['lostpointercapture', true]
 };
+/** Default R3F event manager for web */
+
 function createPointerEvents(store) {
   const {
     handlePointer
@@ -118,38 +120,10 @@ function createPointerEvents(store) {
 }
 
 const CANVAS_PROPS = ['gl', 'events', 'shadows', 'linear', 'flat', 'legacy', 'orthographic', 'frameloop', 'dpr', 'performance', 'raycaster', 'camera', 'onPointerMissed', 'onCreated'];
-
-function Block({
-  set
-}) {
-  React__namespace.useLayoutEffect(() => {
-    set(new Promise(() => null));
-    return () => set(false);
-  }, [set]);
-  return null;
-}
-
-class ErrorBoundary extends React__namespace.Component {
-  constructor(...args) {
-    super(...args);
-    this.state = {
-      error: false
-    };
-  }
-
-  componentDidCatch(error) {
-    this.props.set(error);
-  }
-
-  render() {
-    return this.state.error ? null : this.props.children;
-  }
-
-}
-
-ErrorBoundary.getDerivedStateFromError = () => ({
-  error: true
-});
+/**
+ * A DOM canvas which accepts threejs elements as children.
+ * @see https://docs.pmnd.rs/react-three-fiber/api/canvas
+ */
 
 const Canvas = /*#__PURE__*/React__namespace.forwardRef(function Canvas({
   children,
@@ -205,21 +179,20 @@ const Canvas = /*#__PURE__*/React__namespace.forwardRef(function Canvas({
       },
       events
     });
-    root.current.render( /*#__PURE__*/React__namespace.createElement(ErrorBoundary, {
+    root.current.render( /*#__PURE__*/React__namespace.createElement(index.ErrorBoundary, {
       set: setError
     }, /*#__PURE__*/React__namespace.createElement(React__namespace.Suspense, {
-      fallback: /*#__PURE__*/React__namespace.createElement(Block, {
+      fallback: /*#__PURE__*/React__namespace.createElement(index.Block, {
         set: setBlock
       })
     }, children)));
   }
 
-  React__namespace.useLayoutEffect(() => {
-    setCanvas(canvasRef.current);
-  }, []);
-  React__namespace.useEffect(() => {
+  index.useIsomorphicLayoutEffect(() => {
+    const canvas = canvasRef.current;
+    setCanvas(canvas);
     return () => index.unmountComponentAtNode(canvas);
-  }, [canvas]);
+  }, []);
   return /*#__PURE__*/React__namespace.createElement("div", _extends({
     ref: mergeRefs__default['default']([meshRef, containerRef]),
     style: {
@@ -258,7 +231,6 @@ exports.unmountComponentAtNode = index.unmountComponentAtNode;
 exports.useFrame = index.useFrame;
 exports.useGraph = index.useGraph;
 exports.useLoader = index.useLoader;
-exports.useMemoizedFn = index.useMemoizedFn;
 exports.useStore = index.useStore;
 exports.useThree = index.useThree;
 exports.Canvas = Canvas;

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('./index-1ff856c3.cjs.prod.js');
+var index = require('./index-c4e0ac66.cjs.prod.js');
 var _extends = require('@babel/runtime/helpers/extends');
 var React = require('react');
 var THREE = require('three');
@@ -53,6 +53,8 @@ const DOM_EVENTS = {
   onPointerCancel: ['pointercancel', true],
   onLostPointerCapture: ['lostpointercapture', true]
 };
+/** Default R3F event manager for web */
+
 function createPointerEvents(store) {
   const {
     handlePointer
@@ -118,38 +120,10 @@ function createPointerEvents(store) {
 }
 
 const CANVAS_PROPS = ['gl', 'events', 'shadows', 'linear', 'flat', 'legacy', 'orthographic', 'frameloop', 'dpr', 'performance', 'raycaster', 'camera', 'onPointerMissed', 'onCreated'];
-
-function Block({
-  set
-}) {
-  React__namespace.useLayoutEffect(() => {
-    set(new Promise(() => null));
-    return () => set(false);
-  }, [set]);
-  return null;
-}
-
-class ErrorBoundary extends React__namespace.Component {
-  constructor(...args) {
-    super(...args);
-    this.state = {
-      error: false
-    };
-  }
-
-  componentDidCatch(error) {
-    this.props.set(error);
-  }
-
-  render() {
-    return this.state.error ? null : this.props.children;
-  }
-
-}
-
-ErrorBoundary.getDerivedStateFromError = () => ({
-  error: true
-});
+/**
+ * A DOM canvas which accepts threejs elements as children.
+ * @see https://docs.pmnd.rs/react-three-fiber/api/canvas
+ */
 
 const Canvas = /*#__PURE__*/React__namespace.forwardRef(function Canvas({
   children,
@@ -205,21 +179,20 @@ const Canvas = /*#__PURE__*/React__namespace.forwardRef(function Canvas({
       },
       events
     });
-    root.current.render( /*#__PURE__*/React__namespace.createElement(ErrorBoundary, {
+    root.current.render( /*#__PURE__*/React__namespace.createElement(index.ErrorBoundary, {
       set: setError
     }, /*#__PURE__*/React__namespace.createElement(React__namespace.Suspense, {
-      fallback: /*#__PURE__*/React__namespace.createElement(Block, {
+      fallback: /*#__PURE__*/React__namespace.createElement(index.Block, {
         set: setBlock
       })
     }, children)));
   }
 
-  React__namespace.useLayoutEffect(() => {
-    setCanvas(canvasRef.current);
-  }, []);
-  React__namespace.useEffect(() => {
+  index.useIsomorphicLayoutEffect(() => {
+    const canvas = canvasRef.current;
+    setCanvas(canvas);
     return () => index.unmountComponentAtNode(canvas);
-  }, [canvas]);
+  }, []);
   return /*#__PURE__*/React__namespace.createElement("div", _extends({
     ref: mergeRefs__default['default']([meshRef, containerRef]),
     style: {
@@ -258,7 +231,6 @@ exports.unmountComponentAtNode = index.unmountComponentAtNode;
 exports.useFrame = index.useFrame;
 exports.useGraph = index.useGraph;
 exports.useLoader = index.useLoader;
-exports.useMemoizedFn = index.useMemoizedFn;
 exports.useStore = index.useStore;
 exports.useThree = index.useThree;
 exports.Canvas = Canvas;

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

@@ -1,5 +1,5 @@
-import { c as createEvents, e as extend, u as useMemoizedFn, p as pick, o as omit, a as createRoot, b as unmountComponentAtNode } from './index-635ddfb2.esm.js';
-export { t as ReactThreeFiber, v as _roots, s as act, m as addAfterEffect, l as addEffect, n as addTail, k as advance, h as applyProps, d as context, f as createPortal, a as createRoot, i as dispose, e as extend, q as getRootState, j as invalidate, g as reconciler, r as render, b as unmountComponentAtNode, y as useFrame, z as useGraph, A as useLoader, u as useMemoizedFn, w as useStore, x as useThree } from './index-635ddfb2.esm.js';
+import { c as createEvents, e as extend, u as useMemoizedFn, p as pick, o as omit, a as createRoot, E as ErrorBoundary, B as Block, b as useIsomorphicLayoutEffect, d as unmountComponentAtNode } from './index-548cf96a.esm.js';
+export { t as ReactThreeFiber, w as _roots, v as act, n as addAfterEffect, m as addEffect, q as addTail, l as advance, i as applyProps, f as context, g as createPortal, a as createRoot, j as dispose, e as extend, s as getRootState, k as invalidate, h as reconciler, r as render, d as unmountComponentAtNode, z as useFrame, A as useGraph, C as useLoader, x as useStore, y as useThree } from './index-548cf96a.esm.js';
 import _extends from '@babel/runtime/helpers/esm/extends';
 import * as React from 'react';
 import * as THREE from 'three';
@@ -23,6 +23,8 @@ const DOM_EVENTS = {
   onPointerCancel: ['pointercancel', true],
   onLostPointerCapture: ['lostpointercapture', true]
 };
+/** Default R3F event manager for web */
+
 function createPointerEvents(store) {
   const {
     handlePointer
@@ -88,38 +90,10 @@ function createPointerEvents(store) {
 }
 
 const CANVAS_PROPS = ['gl', 'events', 'shadows', 'linear', 'flat', 'legacy', 'orthographic', 'frameloop', 'dpr', 'performance', 'raycaster', 'camera', 'onPointerMissed', 'onCreated'];
-
-function Block({
-  set
-}) {
-  React.useLayoutEffect(() => {
-    set(new Promise(() => null));
-    return () => set(false);
-  }, [set]);
-  return null;
-}
-
-class ErrorBoundary extends React.Component {
-  constructor(...args) {
-    super(...args);
-    this.state = {
-      error: false
-    };
-  }
-
-  componentDidCatch(error) {
-    this.props.set(error);
-  }
-
-  render() {
-    return this.state.error ? null : this.props.children;
-  }
-
-}
-
-ErrorBoundary.getDerivedStateFromError = () => ({
-  error: true
-});
+/**
+ * A DOM canvas which accepts threejs elements as children.
+ * @see https://docs.pmnd.rs/react-three-fiber/api/canvas
+ */
 
 const Canvas = /*#__PURE__*/React.forwardRef(function Canvas({
   children,
@@ -184,12 +158,11 @@ const Canvas = /*#__PURE__*/React.forwardRef(function Canvas({
     }, children)));
   }
 
-  React.useLayoutEffect(() => {
-    setCanvas(canvasRef.current);
-  }, []);
-  React.useEffect(() => {
+  useIsomorphicLayoutEffect(() => {
+    const canvas = canvasRef.current;
+    setCanvas(canvas);
     return () => unmountComponentAtNode(canvas);
-  }, [canvas]);
+  }, []);
   return /*#__PURE__*/React.createElement("div", _extends({
     ref: mergeRefs([meshRef, containerRef]),
     style: {

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

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var THREE = require('three');
 var expoAsset = require('expo-asset');
-var index = require('../../dist/index-28a77253.cjs.dev.js');
+var index = require('../../dist/index-b8ee55f0.cjs.dev.js');
 var _extends = require('@babel/runtime/helpers/extends');
 var React = require('react');
 var mergeRefs = require('react-merge-refs');
@@ -62,6 +62,8 @@ const DOM_EVENTS = {
   [EVENTS.HOVEROUT]: 'onPointerOut',
   [EVENTS.PRESSMOVE]: 'onPointerMove'
 };
+/** Default R3F event manager for react-native */
+
 function createTouchEvents(store) {
   const {
     handlePointer
@@ -126,42 +128,13 @@ function createTouchEvents(store) {
 }
 
 const CANVAS_PROPS = ['gl', 'events', 'shadows', 'linear', 'flat', 'legacy', 'orthographic', 'frameloop', 'performance', 'raycaster', 'camera', 'onPointerMissed', 'onCreated'];
-
-function Block({
-  set
-}) {
-  React__namespace.useLayoutEffect(() => {
-    set(new Promise(() => null));
-    return () => set(false);
-  }, [set]);
-  return null;
-}
-
-class ErrorBoundary extends React__namespace.Component {
-  constructor(...args) {
-    super(...args);
-    this.state = {
-      error: false
-    };
-  }
-
-  componentDidCatch(error) {
-    this.props.set(error);
-  }
-
-  render() {
-    return this.state.error ? null : this.props.children;
-  }
-
-}
-
-ErrorBoundary.getDerivedStateFromError = () => ({
-  error: true
-});
+/**
+ * A native canvas which accepts threejs elements as children.
+ * @see https://docs.pmnd.rs/react-three-fiber/api/canvas
+ */
 
 const Canvas = /*#__PURE__*/React__namespace.forwardRef(({
   children,
-  fallback,
   style,
   events,
   ...props
@@ -247,10 +220,10 @@ const Canvas = /*#__PURE__*/React__namespace.forwardRef(({
       events: events || createTouchEvents,
       onCreated
     });
-    root.current.render( /*#__PURE__*/React__namespace.createElement(ErrorBoundary, {
+    root.current.render( /*#__PURE__*/React__namespace.createElement(index.ErrorBoundary, {
       set: setError
     }, /*#__PURE__*/React__namespace.createElement(React__namespace.Suspense, {
-      fallback: /*#__PURE__*/React__namespace.createElement(Block, {
+      fallback: /*#__PURE__*/React__namespace.createElement(index.Block, {
         set: setBlock
       })
     }, children)));
@@ -376,7 +349,6 @@ exports.unmountComponentAtNode = index.unmountComponentAtNode;
 exports.useFrame = index.useFrame;
 exports.useGraph = index.useGraph;
 exports.useLoader = index.useLoader;
-exports.useMemoizedFn = index.useMemoizedFn;
 exports.useStore = index.useStore;
 exports.useThree = index.useThree;
 exports.Canvas = Canvas;