@react-three/fiber 8.7.0 → 8.7.1

package/dist/declarations/src/web/Canvas.d.ts

@@ -1,11 +1,11 @@
-import * as React from 'react';
-import type { Options as ResizeOptions } from 'react-use-measure';
-import { RenderProps } from '../core';
-export interface Props extends Omit<RenderProps<HTMLCanvasElement>, 'size'>, React.HTMLAttributes<HTMLDivElement> {
-    children: React.ReactNode;
-    fallback?: React.ReactNode;
-    resize?: ResizeOptions;
-    eventSource?: HTMLElement;
-    eventPrefix?: 'offset' | 'client' | 'page' | 'layer' | 'screen';
-}
-export declare const Canvas: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLCanvasElement>>;
+import * as React from 'react';
+import type { Options as ResizeOptions } from 'react-use-measure';
+import { RenderProps } from '../core';
+export interface Props extends Omit<RenderProps<HTMLCanvasElement>, 'size'>, React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+    fallback?: React.ReactNode;
+    resize?: ResizeOptions;
+    eventSource?: HTMLElement | React.MutableRefObject<HTMLElement>;
+    eventPrefix?: 'offset' | 'client' | 'page' | 'layer' | 'screen';
+}
+export declare const Canvas: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLCanvasElement>>;

package/dist/declarations/src/web/events.d.ts

@@ -1,4 +1,4 @@
-import { UseBoundStore } from 'zustand';
-import { RootState } from '../core/store';
-import { EventManager } from '../core/events';
-export declare function createPointerEvents(store: UseBoundStore<RootState>): EventManager<HTMLElement>;
+import { UseBoundStore } from 'zustand';
+import { RootState } from '../core/store';
+import { EventManager } from '../core/events';
+export declare function createPointerEvents(store: UseBoundStore<RootState>): EventManager<HTMLElement>;

package/dist/{index-3b3bed95.esm.js → index-44001bdc.esm.js}

@@ -12,6 +12,7 @@ var threeTypes = /*#__PURE__*/Object.freeze({
 
 var _window$document, _window$navigator;
 const isOrthographicCamera = def => def && def.isOrthographicCamera;
+const isRef = obj => obj && obj.hasOwnProperty('current');
 /**
  * An SSR-friendly useLayoutEffect.
  *
@@ -2129,4 +2130,4 @@ reconciler.injectIntoDevTools({
 });
 const act = React.unstable_act;
 
-export { useLoader as A, Block as B, ErrorBoundary as E, createRoot as a, useIsomorphicLayoutEffect as b, createEvents as c, unmountComponentAtNode as d, extend as e, context as f, createPortal as g, reconciler as h, applyProps as i, dispose as j, invalidate as k, advance as l, addEffect as m, addAfterEffect as n, addTail as o, getRootState as p, act as q, render as r, roots as s, threeTypes as t, useMutableCallback as u, useInstanceHandle as v, useStore as w, useThree as x, useFrame as y, useGraph as z };
+export { useGraph as A, Block as B, useLoader as C, ErrorBoundary as E, createRoot as a, useIsomorphicLayoutEffect as b, createEvents as c, unmountComponentAtNode as d, extend as e, context as f, createPortal as g, reconciler as h, isRef as i, applyProps as j, dispose as k, invalidate as l, advance as m, addEffect as n, addAfterEffect as o, addTail as p, getRootState as q, render as r, act as s, threeTypes as t, useMutableCallback as u, roots as v, useInstanceHandle as w, useStore as x, useThree as y, useFrame as z };

package/dist/{index-846c69c6.cjs.prod.js → index-af0d582a.cjs.prod.js}

@@ -39,6 +39,7 @@ var threeTypes = /*#__PURE__*/Object.freeze({
 
 var _window$document, _window$navigator;
 const isOrthographicCamera = def => def && def.isOrthographicCamera;
+const isRef = obj => obj && obj.hasOwnProperty('current');
 /**
  * An SSR-friendly useLayoutEffect.
  *
@@ -2172,6 +2173,7 @@ exports.dispose = dispose;
 exports.extend = extend;
 exports.getRootState = getRootState;
 exports.invalidate = invalidate;
+exports.isRef = isRef;
 exports.reconciler = reconciler;
 exports.render = render;
 exports.roots = roots;

package/dist/{index-b3d1f4d2.cjs.dev.js → index-f9709241.cjs.dev.js}

@@ -39,6 +39,7 @@ var threeTypes = /*#__PURE__*/Object.freeze({
 
 var _window$document, _window$navigator;
 const isOrthographicCamera = def => def && def.isOrthographicCamera;
+const isRef = obj => obj && obj.hasOwnProperty('current');
 /**
  * An SSR-friendly useLayoutEffect.
  *
@@ -2172,6 +2173,7 @@ exports.dispose = dispose;
 exports.extend = extend;
 exports.getRootState = getRootState;
 exports.invalidate = invalidate;
+exports.isRef = isRef;
 exports.reconciler = reconciler;
 exports.render = render;
 exports.roots = roots;

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('./index-b3d1f4d2.cjs.dev.js');
+var index = require('./index-f9709241.cjs.dev.js');
 var _extends = require('@babel/runtime/helpers/extends');
 var React = require('react');
 var THREE = require('three');
@@ -187,7 +187,7 @@ const Canvas = /*#__PURE__*/React__namespace.forwardRef(function Canvas({
       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 ? eventSource : divRef.current); // Set up compute function
+        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({

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('./index-846c69c6.cjs.prod.js');
+var index = require('./index-af0d582a.cjs.prod.js');
 var _extends = require('@babel/runtime/helpers/extends');
 var React = require('react');
 var THREE = require('three');
@@ -187,7 +187,7 @@ const Canvas = /*#__PURE__*/React__namespace.forwardRef(function Canvas({
       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 ? eventSource : divRef.current); // Set up compute function
+        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({

package/dist/react-three-fiber.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, b as useIsomorphicLayoutEffect, d as unmountComponentAtNode } from './index-3b3bed95.esm.js';
-export { t as ReactThreeFiber, s as _roots, q as act, n as addAfterEffect, m as addEffect, o as addTail, l as advance, i as applyProps, f as context, c as createEvents, g as createPortal, a as createRoot, j as dispose, e as extend, p as getRootState, k as invalidate, h as reconciler, r as render, d as unmountComponentAtNode, y as useFrame, z as useGraph, v as useInstanceHandle, A as useLoader, w as useStore, x as useThree } from './index-3b3bed95.esm.js';
+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-44001bdc.esm.js';
+export { t as ReactThreeFiber, v as _roots, s 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 getRootState, l as invalidate, h as reconciler, r as render, d as unmountComponentAtNode, z as useFrame, A as useGraph, w as useInstanceHandle, C as useLoader, x as useStore, y as useThree } from './index-44001bdc.esm.js';
 import _extends from '@babel/runtime/helpers/esm/extends';
 import * as React from 'react';
 import * as THREE from 'three';
@@ -160,7 +160,7 @@ const Canvas = /*#__PURE__*/React.forwardRef(function Canvas({
       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 ? eventSource : divRef.current); // Set up compute function
+        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({

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-b3d1f4d2.cjs.dev.js');
+var index = require('../../dist/index-f9709241.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-846c69c6.cjs.prod.js');
+var index = require('../../dist/index-af0d582a.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-3b3bed95.esm.js';
-export { t as ReactThreeFiber, s as _roots, q as act, n as addAfterEffect, m as addEffect, o as addTail, l as advance, i as applyProps, f as context, g as createPortal, a as createRoot, j as dispose, e as extend, p as getRootState, k as invalidate, h as reconciler, r as render, d as unmountComponentAtNode, y as useFrame, z as useGraph, v as useInstanceHandle, A as useLoader, w as useStore, x as useThree } from '../../dist/index-3b3bed95.esm.js';
+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-44001bdc.esm.js';
+export { t as ReactThreeFiber, v as _roots, s as act, o as addAfterEffect, n as addEffect, p as addTail, m as advance, j as applyProps, f as context, g as createPortal, a as createRoot, k as dispose, e as extend, q as getRootState, l as invalidate, h as reconciler, r as render, d as unmountComponentAtNode, z as useFrame, A as useGraph, w as useInstanceHandle, C as useLoader, x as useStore, y as useThree } from '../../dist/index-44001bdc.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.7.0",
+  "version": "8.7.1",
   "description": "A React renderer for Threejs",
   "keywords": [
     "react",