@react-three/fiber 8.0.24 → 8.0.27

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @react-three/fiber
 
+## 8.0.27
+
+### Patch Changes
+
+- 7940995: fix: resume on xrsession end, export internal events
+
+## 8.0.26
+
+### Patch Changes
+
+- 7b6df9df: fix: infinite loop updating cam viewport
+
+## 8.0.25
+
+### Patch Changes
+
+- b7cd0f42: update viewport on camera changes
+
 ## 8.0.24
 
 ### Patch Changes

package/dist/declarations/src/index.d.ts

@@ -6,5 +6,6 @@ export type { Intersection, Subscription, Dpr, Size, Viewport, RenderCallback, P
 export type { ThreeEvent, Events, EventManager, ComputeFunction } from './core/events';
 export type { ObjectMap, Camera } from './core/utils';
 export * from './web/Canvas';
+export { createEvents } from './core/events';
 export { createPointerEvents as events } from './web/events';
 export * from './core';

package/dist/{index-d1db558e.esm.js → index-4f1a8e2f.esm.js}

@@ -1362,25 +1362,37 @@ const createStore = (invalidate, advance) => {
       }
     };
   });
-  const state = rootState.getState(); // Resize camera and renderer on changes to size and pixelratio
-
+  const state = rootState.getState();
   let oldSize = state.size;
   let oldDpr = state.viewport.dpr;
+  let oldCamera = state.camera;
   rootState.subscribe(() => {
     const {
       camera,
       size,
       viewport,
-      gl
-    } = rootState.getState();
+      gl,
+      set
+    } = rootState.getState(); // Resize camera and renderer on changes to size and pixelratio
 
     if (size !== oldSize || viewport.dpr !== oldDpr) {
-      updateCamera(camera, size); // Update renderer
+      oldSize = size;
+      oldDpr = viewport.dpr; // Update camera & renderer
 
+      updateCamera(camera, size);
       gl.setPixelRatio(viewport.dpr);
       gl.setSize(size.width, size.height, size.updateStyle);
-      oldSize = size;
-      oldDpr = viewport.dpr;
+    } // Update viewport once the camera changes
+
+
+    if (camera !== oldCamera) {
+      oldCamera = camera; // Update viewport
+
+      set(state => ({
+        viewport: { ...state.viewport,
+          ...state.viewport.getCurrentViewport(camera)
+        }
+      }));
     }
   }); // Invalidate on any change
 
@@ -1726,12 +1738,10 @@ function createRoot(canvas) {
 
 
         const handleSessionChange = () => {
-          const gl = store.getState().gl;
-          gl.xr.enabled = gl.xr.isPresenting; // @ts-ignore
-          // WebXRManager's signature is incorrect.
-          // See: https://github.com/pmndrs/react-three-fiber/pull/2017#discussion_r790134505
-
-          gl.xr.setAnimationLoop(gl.xr.isPresenting ? handleXRFrame : null);
+          const state = store.getState();
+          state.gl.xr.enabled = state.gl.xr.isPresenting;
+          state.gl.xr.setAnimationLoop(state.gl.xr.isPresenting ? handleXRFrame : null);
+          if (!state.gl.xr.isPresenting) invalidate(state);
         }; // WebXR session manager
 
 

package/dist/{index-cc1b2b8b.cjs.dev.js → index-acc8c265.cjs.dev.js}

@@ -1389,25 +1389,37 @@ const createStore = (invalidate, advance) => {
       }
     };
   });
-  const state = rootState.getState(); // Resize camera and renderer on changes to size and pixelratio
-
+  const state = rootState.getState();
   let oldSize = state.size;
   let oldDpr = state.viewport.dpr;
+  let oldCamera = state.camera;
   rootState.subscribe(() => {
     const {
       camera,
       size,
       viewport,
-      gl
-    } = rootState.getState();
+      gl,
+      set
+    } = rootState.getState(); // Resize camera and renderer on changes to size and pixelratio
 
     if (size !== oldSize || viewport.dpr !== oldDpr) {
-      updateCamera(camera, size); // Update renderer
+      oldSize = size;
+      oldDpr = viewport.dpr; // Update camera & renderer
 
+      updateCamera(camera, size);
       gl.setPixelRatio(viewport.dpr);
       gl.setSize(size.width, size.height, size.updateStyle);
-      oldSize = size;
-      oldDpr = viewport.dpr;
+    } // Update viewport once the camera changes
+
+
+    if (camera !== oldCamera) {
+      oldCamera = camera; // Update viewport
+
+      set(state => ({
+        viewport: { ...state.viewport,
+          ...state.viewport.getCurrentViewport(camera)
+        }
+      }));
     }
   }); // Invalidate on any change
 
@@ -1753,12 +1765,10 @@ function createRoot(canvas) {
 
 
         const handleSessionChange = () => {
-          const gl = store.getState().gl;
-          gl.xr.enabled = gl.xr.isPresenting; // @ts-ignore
-          // WebXRManager's signature is incorrect.
-          // See: https://github.com/pmndrs/react-three-fiber/pull/2017#discussion_r790134505
-
-          gl.xr.setAnimationLoop(gl.xr.isPresenting ? handleXRFrame : null);
+          const state = store.getState();
+          state.gl.xr.enabled = state.gl.xr.isPresenting;
+          state.gl.xr.setAnimationLoop(state.gl.xr.isPresenting ? handleXRFrame : null);
+          if (!state.gl.xr.isPresenting) invalidate(state);
         }; // WebXR session manager
 
 

package/dist/{index-fbc2ae01.cjs.prod.js → index-c30de6b8.cjs.prod.js}

@@ -1389,25 +1389,37 @@ const createStore = (invalidate, advance) => {
       }
     };
   });
-  const state = rootState.getState(); // Resize camera and renderer on changes to size and pixelratio
-
+  const state = rootState.getState();
   let oldSize = state.size;
   let oldDpr = state.viewport.dpr;
+  let oldCamera = state.camera;
   rootState.subscribe(() => {
     const {
       camera,
       size,
       viewport,
-      gl
-    } = rootState.getState();
+      gl,
+      set
+    } = rootState.getState(); // Resize camera and renderer on changes to size and pixelratio
 
     if (size !== oldSize || viewport.dpr !== oldDpr) {
-      updateCamera(camera, size); // Update renderer
+      oldSize = size;
+      oldDpr = viewport.dpr; // Update camera & renderer
 
+      updateCamera(camera, size);
       gl.setPixelRatio(viewport.dpr);
       gl.setSize(size.width, size.height, size.updateStyle);
-      oldSize = size;
-      oldDpr = viewport.dpr;
+    } // Update viewport once the camera changes
+
+
+    if (camera !== oldCamera) {
+      oldCamera = camera; // Update viewport
+
+      set(state => ({
+        viewport: { ...state.viewport,
+          ...state.viewport.getCurrentViewport(camera)
+        }
+      }));
     }
   }); // Invalidate on any change
 
@@ -1753,12 +1765,10 @@ function createRoot(canvas) {
 
 
         const handleSessionChange = () => {
-          const gl = store.getState().gl;
-          gl.xr.enabled = gl.xr.isPresenting; // @ts-ignore
-          // WebXRManager's signature is incorrect.
-          // See: https://github.com/pmndrs/react-three-fiber/pull/2017#discussion_r790134505
-
-          gl.xr.setAnimationLoop(gl.xr.isPresenting ? handleXRFrame : null);
+          const state = store.getState();
+          state.gl.xr.enabled = state.gl.xr.isPresenting;
+          state.gl.xr.setAnimationLoop(state.gl.xr.isPresenting ? handleXRFrame : null);
+          if (!state.gl.xr.isPresenting) invalidate(state);
         }; // WebXR session manager
 
 

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('./index-cc1b2b8b.cjs.dev.js');
+var index = require('./index-acc8c265.cjs.dev.js');
 var _extends = require('@babel/runtime/helpers/extends');
 var React = require('react');
 var THREE = require('three');
@@ -241,6 +241,7 @@ exports.addTail = index.addTail;
 exports.advance = index.advance;
 exports.applyProps = index.applyProps;
 exports.context = index.context;
+exports.createEvents = index.createEvents;
 exports.createPortal = index.createPortal;
 exports.createRoot = index.createRoot;
 exports.dispose = index.dispose;

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('./index-fbc2ae01.cjs.prod.js');
+var index = require('./index-c30de6b8.cjs.prod.js');
 var _extends = require('@babel/runtime/helpers/extends');
 var React = require('react');
 var THREE = require('three');
@@ -241,6 +241,7 @@ exports.addTail = index.addTail;
 exports.advance = index.advance;
 exports.applyProps = index.applyProps;
 exports.context = index.context;
+exports.createEvents = index.createEvents;
 exports.createPortal = index.createPortal;
 exports.createRoot = index.createRoot;
 exports.dispose = index.dispose;

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-d1db558e.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, x as useFrame, y as useGraph, z as useLoader, v as useStore, w as useThree } from './index-d1db558e.esm.js';
+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-4f1a8e2f.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, x as useFrame, y as useGraph, z as useLoader, v as useStore, w as useThree } from './index-4f1a8e2f.esm.js';
 import _extends from '@babel/runtime/helpers/esm/extends';
 import * as React from 'react';
 import * as THREE from 'three';

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-cc1b2b8b.cjs.dev.js');
+var index = require('../../dist/index-acc8c265.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-fbc2ae01.cjs.prod.js');
+var index = require('../../dist/index-c30de6b8.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-d1db558e.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, x as useFrame, y as useGraph, z as useLoader, v as useStore, w as useThree } from '../../dist/index-d1db558e.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-4f1a8e2f.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, x as useFrame, y as useGraph, z as useLoader, v as useStore, w as useThree } from '../../dist/index-4f1a8e2f.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.0.24",
+  "version": "8.0.27",
   "description": "A React renderer for Threejs",
   "keywords": [
     "react",