@react-three/fiber 9.2.0 → 9.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (28) hide show
  1. package/CHANGELOG.md +1168 -1160
  2. package/dist/declarations/src/core/events.d.ts +92 -92
  3. package/dist/declarations/src/core/hooks.d.ts +53 -53
  4. package/dist/declarations/src/core/index.d.ts +13 -13
  5. package/dist/declarations/src/core/loop.d.ts +31 -31
  6. package/dist/declarations/src/core/reconciler.d.ts +50 -50
  7. package/dist/declarations/src/core/renderer.d.ts +89 -89
  8. package/dist/declarations/src/core/store.d.ts +130 -130
  9. package/dist/declarations/src/core/utils.d.ts +191 -191
  10. package/dist/declarations/src/index.d.ts +6 -6
  11. package/dist/declarations/src/native/Canvas.d.ts +13 -13
  12. package/dist/declarations/src/native/events.d.ts +4 -4
  13. package/dist/declarations/src/native.d.ts +6 -6
  14. package/dist/declarations/src/three-types.d.ts +68 -68
  15. package/dist/declarations/src/web/Canvas.d.ts +23 -23
  16. package/dist/declarations/src/web/events.d.ts +4 -4
  17. package/dist/{events-e63d28a3.cjs.dev.js → events-d0449b76.cjs.dev.js} +91 -91
  18. package/dist/{events-59fae97e.cjs.prod.js → events-d0a20a9c.cjs.prod.js} +91 -91
  19. package/dist/{events-cf57b220.esm.js → events-e3cb66e2.esm.js} +90 -90
  20. package/dist/react-three-fiber.cjs.dev.js +5 -5
  21. package/dist/react-three-fiber.cjs.prod.js +5 -5
  22. package/dist/react-three-fiber.esm.js +6 -6
  23. package/native/dist/react-three-fiber-native.cjs.dev.js +8 -6
  24. package/native/dist/react-three-fiber-native.cjs.prod.js +8 -6
  25. package/native/dist/react-three-fiber-native.esm.js +9 -7
  26. package/native/package.json +5 -5
  27. package/package.json +2 -2
  28. package/readme.md +253 -253
@@ -1,10 +1,10 @@
1
- import * as THREE from 'three';
2
1
  import * as React from 'react';
3
2
  import { DefaultEventPriority, ContinuousEventPriority, DiscreteEventPriority, ConcurrentRoot } from 'react-reconciler/constants';
3
+ import * as THREE from 'three';
4
4
  import { createWithEqualityFn } from 'zustand/traditional';
5
+ import { suspend, preload, clear } from 'suspend-react';
5
6
  import Reconciler from 'react-reconciler';
6
7
  import { unstable_scheduleCallback, unstable_IdlePriority } from 'scheduler';
7
- import { suspend, preload, clear } from 'suspend-react';
8
8
  import { jsx, Fragment } from 'react/jsx-runtime';
9
9
  import { useFiber, useContextBridge, traverseFiber } from 'its-fine';
10
10
 
@@ -12,17 +12,17 @@ var threeTypes = /*#__PURE__*/Object.freeze({
12
12
  __proto__: null
13
13
  });
14
14
 
15
- /**
16
- * Returns the instance's initial (outmost) root.
15
+ /**
16
+ * Returns the instance's initial (outmost) root.
17
17
  */
18
18
  function findInitialRoot(instance) {
19
19
  let root = instance.root;
20
20
  while (root.getState().previousRoot) root = root.getState().previousRoot;
21
21
  return root;
22
22
  }
23
- /**
24
- * Safely flush async effects when testing, simulating a legacy root.
25
- * @deprecated Import from React instead. import { act } from 'react'
23
+ /**
24
+ * Safely flush async effects when testing, simulating a legacy root.
25
+ * @deprecated Import from React instead. import { act } from 'react'
26
26
  */
27
27
  // Reference with computed key to break Webpack static analysis
28
28
  // https://github.com/webpack/webpack/issues/14814
@@ -31,14 +31,14 @@ const isOrthographicCamera = def => def && def.isOrthographicCamera;
31
31
  const isRef = obj => obj && obj.hasOwnProperty('current');
32
32
  const isColorRepresentation = value => value != null && (typeof value === 'string' || typeof value === 'number' || value.isColor);
33
33
 
34
- /**
35
- * An SSR-friendly useLayoutEffect.
36
- *
37
- * React currently throws a warning when using useLayoutEffect on the server.
38
- * To get around it, we can conditionally useEffect on the server (no-op) and
39
- * useLayoutEffect elsewhere.
40
- *
41
- * @see https://github.com/facebook/react/issues/14927
34
+ /**
35
+ * An SSR-friendly useLayoutEffect.
36
+ *
37
+ * React currently throws a warning when using useLayoutEffect on the server.
38
+ * To get around it, we can conditionally useEffect on the server (no-op) and
39
+ * useLayoutEffect elsewhere.
40
+ *
41
+ * @see https://github.com/facebook/react/issues/14927
42
42
  */
43
43
  const useIsomorphicLayoutEffect = /* @__PURE__ */((_window$document, _window$navigator) => typeof window !== 'undefined' && (((_window$document = window.document) == null ? void 0 : _window$document.createElement) || ((_window$navigator = window.navigator) == null ? void 0 : _window$navigator.product) === 'ReactNative'))() ? React.useLayoutEffect : React.useEffect;
44
44
  function useMutableCallback(fn) {
@@ -46,8 +46,8 @@ function useMutableCallback(fn) {
46
46
  useIsomorphicLayoutEffect(() => void (ref.current = fn), [fn]);
47
47
  return ref;
48
48
  }
49
- /**
50
- * Bridges renderer Context and StrictMode from a primary renderer.
49
+ /**
50
+ * Bridges renderer Context and StrictMode from a primary renderer.
51
51
  */
52
52
  function useBridge() {
53
53
  const fiber = useFiber();
@@ -99,8 +99,8 @@ function calculateDpr(dpr) {
99
99
  return Array.isArray(dpr) ? Math.min(Math.max(dpr[0], target), dpr[1]) : dpr;
100
100
  }
101
101
 
102
- /**
103
- * Returns instance root state
102
+ /**
103
+ * Returns instance root state
104
104
  */
105
105
  function getRootState(obj) {
106
106
  var _r3f;
@@ -463,9 +463,9 @@ function makeId(event) {
463
463
  return (event.eventObject || event.object).uuid + '/' + event.index + event.instanceId;
464
464
  }
465
465
 
466
- /**
467
- * Release pointer captures.
468
- * This is called by releasePointerCapture in the API, and when an object is removed.
466
+ /**
467
+ * Release pointer captures.
468
+ * This is called by releasePointerCapture in the API, and when an object is removed.
469
469
  */
470
470
  function releaseInternalPointerCapture(capturedMap, obj, captures, pointerId) {
471
471
  const captureData = captures.get(obj);
@@ -812,19 +812,19 @@ function createEvents(store) {
812
812
  if (!(instance != null && instance.eventCount)) return;
813
813
  const handlers = instance.handlers;
814
814
 
815
- /*
816
- MAYBE TODO, DELETE IF NOT:
817
- Check if the object is captured, captured events should not have intersects running in parallel
818
- But wouldn't it be better to just replace capturedMap with a single entry?
819
- Also, are we OK with straight up making picking up multiple objects impossible?
820
-
821
- const pointerId = (data as ThreeEvent<PointerEvent>).pointerId
822
- if (pointerId !== undefined) {
823
- const capturedMeshSet = internal.capturedMap.get(pointerId)
824
- if (capturedMeshSet) {
825
- const captured = capturedMeshSet.get(eventObject)
826
- if (captured && captured.localState.stopped) return
827
- }
815
+ /*
816
+ MAYBE TODO, DELETE IF NOT:
817
+ Check if the object is captured, captured events should not have intersects running in parallel
818
+ But wouldn't it be better to just replace capturedMap with a single entry?
819
+ Also, are we OK with straight up making picking up multiple objects impossible?
820
+
821
+ const pointerId = (data as ThreeEvent<PointerEvent>).pointerId
822
+ if (pointerId !== undefined) {
823
+ const capturedMeshSet = internal.capturedMap.get(pointerId)
824
+ if (capturedMeshSet) {
825
+ const captured = capturedMeshSet.get(eventObject)
826
+ if (captured && captured.localState.stopped) return
827
+ }
828
828
  }*/
829
829
 
830
830
  if (isPointerMove) {
@@ -1115,11 +1115,11 @@ const createStore = (invalidate, advance) => {
1115
1115
  return rootStore;
1116
1116
  };
1117
1117
 
1118
- /**
1119
- * Exposes an object's {@link Instance}.
1120
- * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#useInstanceHandle
1121
- *
1122
- * **Note**: this is an escape hatch to react-internal fields. Expect this to change significantly between versions.
1118
+ /**
1119
+ * Exposes an object's {@link Instance}.
1120
+ * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#useInstanceHandle
1121
+ *
1122
+ * **Note**: this is an escape hatch to react-internal fields. Expect this to change significantly between versions.
1123
1123
  */
1124
1124
  function useInstanceHandle(ref) {
1125
1125
  const instance = React.useRef(null);
@@ -1127,9 +1127,9 @@ function useInstanceHandle(ref) {
1127
1127
  return instance;
1128
1128
  }
1129
1129
 
1130
- /**
1131
- * Returns the R3F Canvas' Zustand store. Useful for [transient updates](https://github.com/pmndrs/zustand#transient-updates-for-often-occurring-state-changes).
1132
- * @see https://docs.pmnd.rs/react-three-fiber/api/hooks#usestore
1130
+ /**
1131
+ * Returns the R3F Canvas' Zustand store. Useful for [transient updates](https://github.com/pmndrs/zustand#transient-updates-for-often-occurring-state-changes).
1132
+ * @see https://docs.pmnd.rs/react-three-fiber/api/hooks#usestore
1133
1133
  */
1134
1134
  function useStore() {
1135
1135
  const store = React.useContext(context);
@@ -1137,18 +1137,18 @@ function useStore() {
1137
1137
  return store;
1138
1138
  }
1139
1139
 
1140
- /**
1141
- * Accesses R3F's internal state, containing renderer, canvas, scene, etc.
1142
- * @see https://docs.pmnd.rs/react-three-fiber/api/hooks#usethree
1140
+ /**
1141
+ * Accesses R3F's internal state, containing renderer, canvas, scene, etc.
1142
+ * @see https://docs.pmnd.rs/react-three-fiber/api/hooks#usethree
1143
1143
  */
1144
1144
  function useThree(selector = state => state, equalityFn) {
1145
1145
  return useStore()(selector, equalityFn);
1146
1146
  }
1147
1147
 
1148
- /**
1149
- * Executes a callback before render in a shared frame loop.
1150
- * Can order effects with render priority or manually render with a positive priority.
1151
- * @see https://docs.pmnd.rs/react-three-fiber/api/hooks#useframe
1148
+ /**
1149
+ * Executes a callback before render in a shared frame loop.
1150
+ * Can order effects with render priority or manually render with a positive priority.
1151
+ * @see https://docs.pmnd.rs/react-three-fiber/api/hooks#useframe
1152
1152
  */
1153
1153
  function useFrame(callback, renderPriority = 0) {
1154
1154
  const store = useStore();
@@ -1160,9 +1160,9 @@ function useFrame(callback, renderPriority = 0) {
1160
1160
  return null;
1161
1161
  }
1162
1162
 
1163
- /**
1164
- * Returns a node graph of an object with named nodes & materials.
1165
- * @see https://docs.pmnd.rs/react-three-fiber/api/hooks#usegraph
1163
+ /**
1164
+ * Returns a node graph of an object with named nodes & materials.
1165
+ * @see https://docs.pmnd.rs/react-three-fiber/api/hooks#usegraph
1166
1166
  */
1167
1167
  function useGraph(object) {
1168
1168
  return React.useMemo(() => buildGraph(object), [object]);
@@ -1198,11 +1198,11 @@ function loadingFn(extensions, onProgress) {
1198
1198
  };
1199
1199
  }
1200
1200
 
1201
- /**
1202
- * Synchronously loads and caches assets with a three loader.
1203
- *
1204
- * Note: this hook's caller must be wrapped with `React.Suspense`
1205
- * @see https://docs.pmnd.rs/react-three-fiber/api/hooks#useloader
1201
+ /**
1202
+ * Synchronously loads and caches assets with a three loader.
1203
+ *
1204
+ * Note: this hook's caller must be wrapped with `React.Suspense`
1205
+ * @see https://docs.pmnd.rs/react-three-fiber/api/hooks#useloader
1206
1206
  */
1207
1207
  function useLoader(loader, input, extensions, onProgress) {
1208
1208
  // Use suspense to load async assets
@@ -1214,25 +1214,22 @@ function useLoader(loader, input, extensions, onProgress) {
1214
1214
  return Array.isArray(input) ? results : results[0];
1215
1215
  }
1216
1216
 
1217
- /**
1218
- * Preloads an asset into cache as a side-effect.
1217
+ /**
1218
+ * Preloads an asset into cache as a side-effect.
1219
1219
  */
1220
1220
  useLoader.preload = function (loader, input, extensions) {
1221
1221
  const keys = Array.isArray(input) ? input : [input];
1222
1222
  return preload(loadingFn(extensions), [loader, ...keys]);
1223
1223
  };
1224
1224
 
1225
- /**
1226
- * Removes a loaded asset from cache.
1225
+ /**
1226
+ * Removes a loaded asset from cache.
1227
1227
  */
1228
1228
  useLoader.clear = function (loader, input) {
1229
1229
  const keys = Array.isArray(input) ? input : [input];
1230
1230
  return clear([loader, ...keys]);
1231
1231
  };
1232
1232
 
1233
- // TODO: upstream to DefinitelyTyped for React 19
1234
- // https://github.com/facebook/react/issues/28956
1235
-
1236
1233
  function createReconciler(config) {
1237
1234
  const reconciler = Reconciler(config);
1238
1235
  reconciler.injectIntoDevTools({
@@ -1630,6 +1627,8 @@ const reconciler = /* @__PURE__ */createReconciler({
1630
1627
  suspendInstance() {},
1631
1628
  waitForCommitToBeReady: () => null,
1632
1629
  NotPendingTransition: null,
1630
+ // The reconciler types use the internal ReactContext with all the hidden properties
1631
+ // so we have to cast from the public React.Context type
1633
1632
  HostTransitionContext: /* @__PURE__ */React.createContext(null),
1634
1633
  setCurrentUpdatePriority(newPriority) {
1635
1634
  currentUpdatePriority = newPriority;
@@ -2057,10 +2056,10 @@ function Portal({
2057
2056
  children,
2058
2057
  container
2059
2058
  }) {
2060
- /** This has to be a component because it would not be able to call useThree/useStore otherwise since
2061
- * if this is our environment, then we are not in r3f's renderer but in react-dom, it would trigger
2062
- * the "R3F hooks can only be used within the Canvas component!" warning:
2063
- * <Canvas>
2059
+ /** This has to be a component because it would not be able to call useThree/useStore otherwise since
2060
+ * if this is our environment, then we are not in r3f's renderer but in react-dom, it would trigger
2061
+ * the "R3F hooks can only be used within the Canvas component!" warning:
2062
+ * <Canvas>
2064
2063
  * {createPortal(...)} */
2065
2064
  const {
2066
2065
  events,
@@ -2141,14 +2140,15 @@ function Portal({
2141
2140
  );
2142
2141
  }
2143
2142
 
2144
- /**
2145
- * Force React to flush any updates inside the provided callback synchronously and immediately.
2146
- * All the same caveats documented for react-dom's `flushSync` apply here (see https://react.dev/reference/react-dom/flushSync).
2147
- * Nevertheless, sometimes one needs to render synchronously, for example to keep DOM and 3D changes in lock-step without
2148
- * having to revert to a non-React solution.
2143
+ /**
2144
+ * Force React to flush any updates inside the provided callback synchronously and immediately.
2145
+ * All the same caveats documented for react-dom's `flushSync` apply here (see https://react.dev/reference/react-dom/flushSync).
2146
+ * Nevertheless, sometimes one needs to render synchronously, for example to keep DOM and 3D changes in lock-step without
2147
+ * having to revert to a non-React solution. Note: this will only flush updates within the `Canvas` root.
2149
2148
  */
2150
2149
  function flushSync(fn) {
2151
- return reconciler.flushSync(fn);
2150
+ // @ts-ignore - reconciler types are not maintained
2151
+ return reconciler.flushSyncFromReconciler(fn);
2152
2152
  }
2153
2153
 
2154
2154
  function createSubs(callback, subs) {
@@ -2162,21 +2162,21 @@ const globalEffects = new Set();
2162
2162
  const globalAfterEffects = new Set();
2163
2163
  const globalTailEffects = new Set();
2164
2164
 
2165
- /**
2166
- * Adds a global render callback which is called each frame.
2167
- * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#addEffect
2165
+ /**
2166
+ * Adds a global render callback which is called each frame.
2167
+ * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#addEffect
2168
2168
  */
2169
2169
  const addEffect = callback => createSubs(callback, globalEffects);
2170
2170
 
2171
- /**
2172
- * Adds a global after-render callback which is called each frame.
2173
- * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#addAfterEffect
2171
+ /**
2172
+ * Adds a global after-render callback which is called each frame.
2173
+ * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#addAfterEffect
2174
2174
  */
2175
2175
  const addAfterEffect = callback => createSubs(callback, globalAfterEffects);
2176
2176
 
2177
- /**
2178
- * Adds a global callback which is called when rendering stops.
2179
- * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#addTail
2177
+ /**
2178
+ * Adds a global callback which is called when rendering stops.
2179
+ * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#addTail
2180
2180
  */
2181
2181
  const addTail = callback => createSubs(callback, globalTailEffects);
2182
2182
  function run(effects, timestamp) {
@@ -2264,9 +2264,9 @@ function loop(timestamp) {
2264
2264
  }
2265
2265
  }
2266
2266
 
2267
- /**
2268
- * Invalidates the view, requesting a frame to be rendered. Will globally invalidate unless passed a root's state.
2269
- * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#invalidate
2267
+ /**
2268
+ * Invalidates the view, requesting a frame to be rendered. Will globally invalidate unless passed a root's state.
2269
+ * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#invalidate
2270
2270
  */
2271
2271
  function invalidate(state, frames = 1) {
2272
2272
  var _state$gl$xr2;
@@ -2293,9 +2293,9 @@ function invalidate(state, frames = 1) {
2293
2293
  }
2294
2294
  }
2295
2295
 
2296
- /**
2297
- * Advances the frameloop and runs render effects, useful for when manually rendering via `frameloop="never"`.
2298
- * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#advance
2296
+ /**
2297
+ * Advances the frameloop and runs render effects, useful for when manually rendering via `frameloop="never"`.
2298
+ * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#advance
2299
2299
  */
2300
2300
  function advance(timestamp, runGlobalEffects = true, state, frame) {
2301
2301
  if (runGlobalEffects) flushGlobalEffects('before', timestamp);
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var events = require('./events-e63d28a3.cjs.dev.js');
5
+ var events = require('./events-d0449b76.cjs.dev.js');
6
6
  var React = require('react');
7
7
  var THREE = require('three');
8
8
  var useMeasure = require('react-use-measure');
@@ -10,9 +10,9 @@ var itsFine = require('its-fine');
10
10
  var jsxRuntime = require('react/jsx-runtime');
11
11
  require('react-reconciler/constants');
12
12
  require('zustand/traditional');
13
+ require('suspend-react');
13
14
  require('react-reconciler');
14
15
  require('scheduler');
15
- require('suspend-react');
16
16
 
17
17
  function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
18
18
 
@@ -179,9 +179,9 @@ function CanvasImpl({
179
179
  });
180
180
  }
181
181
 
182
- /**
183
- * A DOM canvas which accepts threejs elements as children.
184
- * @see https://docs.pmnd.rs/react-three-fiber/api/canvas
182
+ /**
183
+ * A DOM canvas which accepts threejs elements as children.
184
+ * @see https://docs.pmnd.rs/react-three-fiber/api/canvas
185
185
  */
186
186
  function Canvas(props) {
187
187
  return /*#__PURE__*/jsxRuntime.jsx(itsFine.FiberProvider, {
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var events = require('./events-59fae97e.cjs.prod.js');
5
+ var events = require('./events-d0a20a9c.cjs.prod.js');
6
6
  var React = require('react');
7
7
  var THREE = require('three');
8
8
  var useMeasure = require('react-use-measure');
@@ -10,9 +10,9 @@ var itsFine = require('its-fine');
10
10
  var jsxRuntime = require('react/jsx-runtime');
11
11
  require('react-reconciler/constants');
12
12
  require('zustand/traditional');
13
+ require('suspend-react');
13
14
  require('react-reconciler');
14
15
  require('scheduler');
15
- require('suspend-react');
16
16
 
17
17
  function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
18
18
 
@@ -179,9 +179,9 @@ function CanvasImpl({
179
179
  });
180
180
  }
181
181
 
182
- /**
183
- * A DOM canvas which accepts threejs elements as children.
184
- * @see https://docs.pmnd.rs/react-three-fiber/api/canvas
182
+ /**
183
+ * A DOM canvas which accepts threejs elements as children.
184
+ * @see https://docs.pmnd.rs/react-three-fiber/api/canvas
185
185
  */
186
186
  function Canvas(props) {
187
187
  return /*#__PURE__*/jsxRuntime.jsx(itsFine.FiberProvider, {
@@ -1,5 +1,5 @@
1
- import { e as extend, u as useBridge, a as useMutableCallback, b as useIsomorphicLayoutEffect, c as createRoot, i as isRef, E as ErrorBoundary, B as Block, d as unmountComponentAtNode, f as createPointerEvents } from './events-cf57b220.esm.js';
2
- export { t as ReactThreeFiber, _ as _roots, x as act, k as addAfterEffect, j as addEffect, l as addTail, n as advance, s as applyProps, y as buildGraph, q as context, g as createEvents, o as createPortal, c as createRoot, w as dispose, f as events, e as extend, h as flushGlobalEffects, p as flushSync, v as getRootState, m as invalidate, r as reconciler, d as unmountComponentAtNode, D as useFrame, F as useGraph, z as useInstanceHandle, G as useLoader, A as useStore, C as useThree } from './events-cf57b220.esm.js';
1
+ import { e as extend, u as useBridge, a as useMutableCallback, b as useIsomorphicLayoutEffect, c as createRoot, i as isRef, E as ErrorBoundary, B as Block, d as unmountComponentAtNode, f as createPointerEvents } from './events-e3cb66e2.esm.js';
2
+ export { t as ReactThreeFiber, _ as _roots, x as act, k as addAfterEffect, j as addEffect, l as addTail, n as advance, s as applyProps, y as buildGraph, q as context, g as createEvents, o as createPortal, c as createRoot, w as dispose, f as events, e as extend, h as flushGlobalEffects, p as flushSync, v as getRootState, m as invalidate, r as reconciler, d as unmountComponentAtNode, D as useFrame, F as useGraph, z as useInstanceHandle, G as useLoader, A as useStore, C as useThree } from './events-e3cb66e2.esm.js';
3
3
  import * as React from 'react';
4
4
  import * as THREE from 'three';
5
5
  import useMeasure from 'react-use-measure';
@@ -7,9 +7,9 @@ import { FiberProvider } from 'its-fine';
7
7
  import { jsx } from 'react/jsx-runtime';
8
8
  import 'react-reconciler/constants';
9
9
  import 'zustand/traditional';
10
+ import 'suspend-react';
10
11
  import 'react-reconciler';
11
12
  import 'scheduler';
12
- import 'suspend-react';
13
13
 
14
14
  function CanvasImpl({
15
15
  ref,
@@ -152,9 +152,9 @@ function CanvasImpl({
152
152
  });
153
153
  }
154
154
 
155
- /**
156
- * A DOM canvas which accepts threejs elements as children.
157
- * @see https://docs.pmnd.rs/react-three-fiber/api/canvas
155
+ /**
156
+ * A DOM canvas which accepts threejs elements as children.
157
+ * @see https://docs.pmnd.rs/react-three-fiber/api/canvas
158
158
  */
159
159
  function Canvas(props) {
160
160
  return /*#__PURE__*/jsx(FiberProvider, {
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var events = require('../../dist/events-e63d28a3.cjs.dev.js');
5
+ var events = require('../../dist/events-d0449b76.cjs.dev.js');
6
6
  var React = require('react');
7
7
  var THREE = require('three');
8
8
  var reactNative = require('react-native');
@@ -15,9 +15,9 @@ var base64Js = require('base64-js');
15
15
  var buffer = require('buffer');
16
16
  require('react-reconciler/constants');
17
17
  require('zustand/traditional');
18
+ require('suspend-react');
18
19
  require('react-reconciler');
19
20
  require('scheduler');
20
- require('suspend-react');
21
21
 
22
22
  function _interopNamespace(e) {
23
23
  if (e && e.__esModule) return e;
@@ -273,9 +273,9 @@ function CanvasImpl({
273
273
  });
274
274
  }
275
275
 
276
- /**
277
- * A native canvas which accepts threejs elements as children.
278
- * @see https://docs.pmnd.rs/react-three-fiber/api/canvas
276
+ /**
277
+ * A native canvas which accepts threejs elements as children.
278
+ * @see https://docs.pmnd.rs/react-three-fiber/api/canvas
279
279
  */
280
280
  function Canvas(props) {
281
281
  return /*#__PURE__*/jsxRuntime.jsx(itsFine.FiberProvider, {
@@ -438,7 +438,9 @@ function polyfills() {
438
438
  const url = URL.createObjectURL(blob);
439
439
  URL.revokeObjectURL(url);
440
440
  } catch (_) {
441
- const BlobManager = require('react-native/Libraries/Blob/BlobManager.js');
441
+ var _BlobManagerModule$de;
442
+ const BlobManagerModule = require('react-native/Libraries/Blob/BlobManager.js');
443
+ const BlobManager = (_BlobManagerModule$de = BlobManagerModule.default) != null ? _BlobManagerModule$de : BlobManagerModule;
442
444
  const createObjectURL = URL.createObjectURL;
443
445
  URL.createObjectURL = function (blob) {
444
446
  if (blob.data._base64) {
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var events = require('../../dist/events-59fae97e.cjs.prod.js');
5
+ var events = require('../../dist/events-d0a20a9c.cjs.prod.js');
6
6
  var React = require('react');
7
7
  var THREE = require('three');
8
8
  var reactNative = require('react-native');
@@ -15,9 +15,9 @@ var base64Js = require('base64-js');
15
15
  var buffer = require('buffer');
16
16
  require('react-reconciler/constants');
17
17
  require('zustand/traditional');
18
+ require('suspend-react');
18
19
  require('react-reconciler');
19
20
  require('scheduler');
20
- require('suspend-react');
21
21
 
22
22
  function _interopNamespace(e) {
23
23
  if (e && e.__esModule) return e;
@@ -273,9 +273,9 @@ function CanvasImpl({
273
273
  });
274
274
  }
275
275
 
276
- /**
277
- * A native canvas which accepts threejs elements as children.
278
- * @see https://docs.pmnd.rs/react-three-fiber/api/canvas
276
+ /**
277
+ * A native canvas which accepts threejs elements as children.
278
+ * @see https://docs.pmnd.rs/react-three-fiber/api/canvas
279
279
  */
280
280
  function Canvas(props) {
281
281
  return /*#__PURE__*/jsxRuntime.jsx(itsFine.FiberProvider, {
@@ -438,7 +438,9 @@ function polyfills() {
438
438
  const url = URL.createObjectURL(blob);
439
439
  URL.revokeObjectURL(url);
440
440
  } catch (_) {
441
- const BlobManager = require('react-native/Libraries/Blob/BlobManager.js');
441
+ var _BlobManagerModule$de;
442
+ const BlobManagerModule = require('react-native/Libraries/Blob/BlobManager.js');
443
+ const BlobManager = (_BlobManagerModule$de = BlobManagerModule.default) != null ? _BlobManagerModule$de : BlobManagerModule;
442
444
  const createObjectURL = URL.createObjectURL;
443
445
  URL.createObjectURL = function (blob) {
444
446
  if (blob.data._base64) {
@@ -1,5 +1,5 @@
1
- import { e as extend, u as useBridge, a as useMutableCallback, c as createRoot, b as useIsomorphicLayoutEffect, E as ErrorBoundary, B as Block, d as unmountComponentAtNode, f as createPointerEvents, g as createEvents } from '../../dist/events-cf57b220.esm.js';
2
- export { t as ReactThreeFiber, _ as _roots, x as act, k as addAfterEffect, j as addEffect, l as addTail, n as advance, s as applyProps, y as buildGraph, q as context, g as createEvents, o as createPortal, c as createRoot, w as dispose, e as extend, h as flushGlobalEffects, p as flushSync, v as getRootState, m as invalidate, r as reconciler, d as unmountComponentAtNode, D as useFrame, F as useGraph, z as useInstanceHandle, G as useLoader, A as useStore, C as useThree } from '../../dist/events-cf57b220.esm.js';
1
+ import { e as extend, u as useBridge, a as useMutableCallback, c as createRoot, b as useIsomorphicLayoutEffect, E as ErrorBoundary, B as Block, d as unmountComponentAtNode, f as createPointerEvents, g as createEvents } from '../../dist/events-e3cb66e2.esm.js';
2
+ export { t as ReactThreeFiber, _ as _roots, x as act, k as addAfterEffect, j as addEffect, l as addTail, n as advance, s as applyProps, y as buildGraph, q as context, g as createEvents, o as createPortal, c as createRoot, w as dispose, e as extend, h as flushGlobalEffects, p as flushSync, v as getRootState, m as invalidate, r as reconciler, d as unmountComponentAtNode, D as useFrame, F as useGraph, z as useInstanceHandle, G as useLoader, A as useStore, C as useThree } from '../../dist/events-e3cb66e2.esm.js';
3
3
  import * as React from 'react';
4
4
  import * as THREE from 'three';
5
5
  import { PanResponder, PixelRatio, StyleSheet, View, Platform, Image, NativeModules } from 'react-native';
@@ -12,9 +12,9 @@ import { fromByteArray } from 'base64-js';
12
12
  import { Buffer } from 'buffer';
13
13
  import 'react-reconciler/constants';
14
14
  import 'zustand/traditional';
15
+ import 'suspend-react';
15
16
  import 'react-reconciler';
16
17
  import 'scheduler';
17
- import 'suspend-react';
18
18
 
19
19
  // TODO: React 19 needs support from react-native
20
20
  const _View = View;
@@ -248,9 +248,9 @@ function CanvasImpl({
248
248
  });
249
249
  }
250
250
 
251
- /**
252
- * A native canvas which accepts threejs elements as children.
253
- * @see https://docs.pmnd.rs/react-three-fiber/api/canvas
251
+ /**
252
+ * A native canvas which accepts threejs elements as children.
253
+ * @see https://docs.pmnd.rs/react-three-fiber/api/canvas
254
254
  */
255
255
  function Canvas(props) {
256
256
  return /*#__PURE__*/jsx(FiberProvider, {
@@ -413,7 +413,9 @@ function polyfills() {
413
413
  const url = URL.createObjectURL(blob);
414
414
  URL.revokeObjectURL(url);
415
415
  } catch (_) {
416
- const BlobManager = require('react-native/Libraries/Blob/BlobManager.js');
416
+ var _BlobManagerModule$de;
417
+ const BlobManagerModule = require('react-native/Libraries/Blob/BlobManager.js');
418
+ const BlobManager = (_BlobManagerModule$de = BlobManagerModule.default) != null ? _BlobManagerModule$de : BlobManagerModule;
417
419
  const createObjectURL = URL.createObjectURL;
418
420
  URL.createObjectURL = function (blob) {
419
421
  if (blob.data._base64) {
@@ -1,5 +1,5 @@
1
- {
2
- "main": "dist/react-three-fiber-native.cjs.js",
3
- "module": "dist/react-three-fiber-native.esm.js",
4
- "types": "dist/react-three-fiber-native.cjs.d.ts"
5
- }
1
+ {
2
+ "main": "dist/react-three-fiber-native.cjs.js",
3
+ "module": "dist/react-three-fiber-native.esm.js",
4
+ "types": "dist/react-three-fiber-native.cjs.d.ts"
5
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@react-three/fiber",
3
- "version": "9.2.0",
3
+ "version": "9.3.0",
4
4
  "description": "A React renderer for Threejs",
5
5
  "keywords": [
6
6
  "react",
@@ -44,7 +44,7 @@
44
44
  },
45
45
  "dependencies": {
46
46
  "@babel/runtime": "^7.17.8",
47
- "@types/react-reconciler": "^0.28.9",
47
+ "@types/react-reconciler": "^0.32.0",
48
48
  "@types/webxr": "*",
49
49
  "base64-js": "^1.5.1",
50
50
  "buffer": "^6.0.3",