@react-three/fiber 10.0.0-canary.87166dc → 10.0.0-canary.932f901

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.
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- const textureStaging = require('./shared/fiber.CsZ092z_.cjs');
3
+ const textureStaging = require('./shared/fiber.DfiCufha.cjs');
4
4
 
5
5
 
6
6
 
@@ -1 +1 @@
1
- export { c as context, g as getTextureView, r as registerRootExtension, s as setRenderOverride, b as useFrame, u as useStore, a as useThree } from './shared/fiber.DlH05gco.mjs';
1
+ export { c as context, g as getTextureView, r as registerRootExtension, s as setRenderOverride, b as useFrame, u as useStore, a as useThree } from './shared/fiber.Biz9olEe.mjs';
package/dist/index.cjs CHANGED
@@ -1,8 +1,8 @@
1
1
  'use strict';
2
2
 
3
3
  const jsxRuntime = require('react/jsx-runtime');
4
- const Canvas$1 = require('./shared/fiber.BybcfIwy.cjs');
5
- const textureStaging = require('./shared/fiber.CsZ092z_.cjs');
4
+ const Canvas$1 = require('./shared/fiber.Cd8-yZqM.cjs');
5
+ const textureStaging = require('./shared/fiber.DfiCufha.cjs');
6
6
  const scheduler = require('@pmndrs/scheduler');
7
7
 
8
8
  const R3F_BUILD_LEGACY = false;
package/dist/index.mjs CHANGED
@@ -1,7 +1,7 @@
1
1
  import { jsx } from 'react/jsx-runtime';
2
- import { c as createRoot$1, C as Canvas$1 } from './shared/fiber.BC5FRLu-.mjs';
3
- export { s as Environment, p as EnvironmentCube, E as EnvironmentMap, q as EnvironmentPortal, ai as FROM_REF, I as IsObject, al as ONCE, P as Portal, U as REACT_INTERNAL_PROPS, a1 as RESERVED_PROPS, T as Texture, _ as _roots, d as addAfterEffect, b as addEffect, e as addTail, f as advance, a6 as applyProps, a3 as attach, X as buildGraph, O as calculateDpr, y as createEvents, a as createPointerEvents, N as createPortal, l as createStore, a4 as detach, a5 as diffProps, Y as dispose, a as events, J as extend, V as findInitialRoot, L as flushSync, aj as fromRef, Z as getInstanceProps, h as getPrimary, k as getPrimaryIds, W as getRootState, m as getThree, Q as getUuidPrefix, ah as hasConstructor, j as hasPrimary, n as hasThree, i as invalidate, a0 as invalidateInstance, a7 as is, aa as isColorRepresentation, ag as isCopyable, ak as isFromRef, ad as isLayers, ab as isObject3D, an as isOnce, a8 as isOrthographicCamera, a9 as isRef, g as isRenderer, ac as isTexture, ae as isUniform, af as isVectorLike, am as once, $ as prepare, t as presetsObj, K as reconciler, r as registerPrimary, x as removeInteractivity, a2 as resolve, v as swapInteractivity, M as unmountComponentAtNode, u as unregisterPrimary, R as updateCamera, S as updateFrustum, H as useEnvironment, A as useGraph, z as useInstanceHandle, B as useLoader, G as useRenderTarget, D as useTexture, F as useTextures, w as waitForPrimary, o as whenThree } from './shared/fiber.BC5FRLu-.mjs';
4
- export { B as Block, E as ErrorBoundary, c as context, r as registerRootExtension, s as setRenderOverride, f as useBridge, b as useFrame, d as useIsomorphicLayoutEffect, e as useMutableCallback, u as useStore, a as useThree } from './shared/fiber.DlH05gco.mjs';
2
+ import { c as createRoot$1, C as Canvas$1 } from './shared/fiber.BLt8Cx7Z.mjs';
3
+ export { s as Environment, p as EnvironmentCube, E as EnvironmentMap, q as EnvironmentPortal, ai as FROM_REF, I as IsObject, al as ONCE, P as Portal, U as REACT_INTERNAL_PROPS, a1 as RESERVED_PROPS, T as Texture, _ as _roots, d as addAfterEffect, b as addEffect, e as addTail, f as advance, a6 as applyProps, a3 as attach, X as buildGraph, O as calculateDpr, y as createEvents, a as createPointerEvents, N as createPortal, l as createStore, a4 as detach, a5 as diffProps, Y as dispose, a as events, J as extend, V as findInitialRoot, L as flushSync, aj as fromRef, Z as getInstanceProps, h as getPrimary, k as getPrimaryIds, W as getRootState, m as getThree, Q as getUuidPrefix, ah as hasConstructor, j as hasPrimary, n as hasThree, i as invalidate, a0 as invalidateInstance, a7 as is, aa as isColorRepresentation, ag as isCopyable, ak as isFromRef, ad as isLayers, ab as isObject3D, an as isOnce, a8 as isOrthographicCamera, a9 as isRef, g as isRenderer, ac as isTexture, ae as isUniform, af as isVectorLike, am as once, $ as prepare, t as presetsObj, K as reconciler, r as registerPrimary, x as removeInteractivity, a2 as resolve, v as swapInteractivity, M as unmountComponentAtNode, u as unregisterPrimary, R as updateCamera, S as updateFrustum, H as useEnvironment, A as useGraph, z as useInstanceHandle, B as useLoader, G as useRenderTarget, D as useTexture, F as useTextures, w as waitForPrimary, o as whenThree } from './shared/fiber.BLt8Cx7Z.mjs';
4
+ export { B as Block, E as ErrorBoundary, c as context, r as registerRootExtension, s as setRenderOverride, f as useBridge, b as useFrame, d as useIsomorphicLayoutEffect, e as useMutableCallback, u as useStore, a as useThree } from './shared/fiber.Biz9olEe.mjs';
5
5
  export { Scheduler, getScheduler } from '@pmndrs/scheduler';
6
6
 
7
7
  const R3F_BUILD_LEGACY = false;
package/dist/legacy.cjs CHANGED
@@ -1,9 +1,9 @@
1
1
  'use strict';
2
2
 
3
3
  const jsxRuntime = require('react/jsx-runtime');
4
- const Canvas$1 = require('./shared/fiber.BybcfIwy.cjs');
4
+ const Canvas$1 = require('./shared/fiber.Cd8-yZqM.cjs');
5
5
  const THREE = require('three');
6
- const textureStaging = require('./shared/fiber.CsZ092z_.cjs');
6
+ const textureStaging = require('./shared/fiber.DfiCufha.cjs');
7
7
  const scheduler = require('@pmndrs/scheduler');
8
8
 
9
9
  function _interopNamespaceCompat(e) {
package/dist/legacy.mjs CHANGED
@@ -1,9 +1,9 @@
1
1
  import { jsx } from 'react/jsx-runtime';
2
- import { G as useRenderTarget$1, c as createRoot$1, C as Canvas$1 } from './shared/fiber.BC5FRLu-.mjs';
3
- export { s as Environment, p as EnvironmentCube, E as EnvironmentMap, q as EnvironmentPortal, ai as FROM_REF, I as IsObject, al as ONCE, P as Portal, U as REACT_INTERNAL_PROPS, a1 as RESERVED_PROPS, T as Texture, _ as _roots, d as addAfterEffect, b as addEffect, e as addTail, f as advance, a6 as applyProps, a3 as attach, X as buildGraph, O as calculateDpr, y as createEvents, a as createPointerEvents, N as createPortal, l as createStore, a4 as detach, a5 as diffProps, Y as dispose, a as events, J as extend, V as findInitialRoot, L as flushSync, aj as fromRef, Z as getInstanceProps, h as getPrimary, k as getPrimaryIds, W as getRootState, m as getThree, Q as getUuidPrefix, ah as hasConstructor, j as hasPrimary, n as hasThree, i as invalidate, a0 as invalidateInstance, a7 as is, aa as isColorRepresentation, ag as isCopyable, ak as isFromRef, ad as isLayers, ab as isObject3D, an as isOnce, a8 as isOrthographicCamera, a9 as isRef, g as isRenderer, ac as isTexture, ae as isUniform, af as isVectorLike, am as once, $ as prepare, t as presetsObj, K as reconciler, r as registerPrimary, x as removeInteractivity, a2 as resolve, v as swapInteractivity, M as unmountComponentAtNode, u as unregisterPrimary, R as updateCamera, S as updateFrustum, H as useEnvironment, A as useGraph, z as useInstanceHandle, B as useLoader, D as useTexture, F as useTextures, w as waitForPrimary, o as whenThree } from './shared/fiber.BC5FRLu-.mjs';
2
+ import { G as useRenderTarget$1, c as createRoot$1, C as Canvas$1 } from './shared/fiber.BLt8Cx7Z.mjs';
3
+ export { s as Environment, p as EnvironmentCube, E as EnvironmentMap, q as EnvironmentPortal, ai as FROM_REF, I as IsObject, al as ONCE, P as Portal, U as REACT_INTERNAL_PROPS, a1 as RESERVED_PROPS, T as Texture, _ as _roots, d as addAfterEffect, b as addEffect, e as addTail, f as advance, a6 as applyProps, a3 as attach, X as buildGraph, O as calculateDpr, y as createEvents, a as createPointerEvents, N as createPortal, l as createStore, a4 as detach, a5 as diffProps, Y as dispose, a as events, J as extend, V as findInitialRoot, L as flushSync, aj as fromRef, Z as getInstanceProps, h as getPrimary, k as getPrimaryIds, W as getRootState, m as getThree, Q as getUuidPrefix, ah as hasConstructor, j as hasPrimary, n as hasThree, i as invalidate, a0 as invalidateInstance, a7 as is, aa as isColorRepresentation, ag as isCopyable, ak as isFromRef, ad as isLayers, ab as isObject3D, an as isOnce, a8 as isOrthographicCamera, a9 as isRef, g as isRenderer, ac as isTexture, ae as isUniform, af as isVectorLike, am as once, $ as prepare, t as presetsObj, K as reconciler, r as registerPrimary, x as removeInteractivity, a2 as resolve, v as swapInteractivity, M as unmountComponentAtNode, u as unregisterPrimary, R as updateCamera, S as updateFrustum, H as useEnvironment, A as useGraph, z as useInstanceHandle, B as useLoader, D as useTexture, F as useTextures, w as waitForPrimary, o as whenThree } from './shared/fiber.BLt8Cx7Z.mjs';
4
4
  import * as THREE from 'three';
5
- import { a as useThree$1, b as useFrame$1 } from './shared/fiber.DlH05gco.mjs';
6
- export { B as Block, E as ErrorBoundary, c as context, r as registerRootExtension, s as setRenderOverride, f as useBridge, d as useIsomorphicLayoutEffect, e as useMutableCallback, u as useStore } from './shared/fiber.DlH05gco.mjs';
5
+ import { a as useThree$1, b as useFrame$1 } from './shared/fiber.Biz9olEe.mjs';
6
+ export { B as Block, E as ErrorBoundary, c as context, r as registerRootExtension, s as setRenderOverride, f as useBridge, d as useIsomorphicLayoutEffect, e as useMutableCallback, u as useStore } from './shared/fiber.Biz9olEe.mjs';
7
7
  export { Scheduler, getScheduler } from '@pmndrs/scheduler';
8
8
 
9
9
  const webglSupport = {
@@ -1,5 +1,5 @@
1
1
  import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
2
- import { i as isDevelopment, n as notifyDepreciated, h as detachRootExtensions, j as attachRootExtensions, d as useIsomorphicLayoutEffect, c as context, a as useThree, u as useStore, k as unstageTextures, l as stageTextures, e as useMutableCallback, b as useFrame, f as useBridge, m as useGate, o as notifyAlpha, E as ErrorBoundary, B as Block, p as notifyRootExtensionsHmr } from './fiber.DlH05gco.mjs';
2
+ import { i as isDevelopment, n as notifyDepreciated, p as preserveAccessors, h as defineRendererAccessors, j as detachRootExtensions, k as attachRootExtensions, d as useIsomorphicLayoutEffect, c as context, a as useThree, u as useStore, l as unstageTextures, m as stageTextures, e as useMutableCallback, o as isAccessor, q as cloneState, t as keepAccessors, b as useFrame, f as useBridge, v as useGate, w as notifyAlpha, E as ErrorBoundary, B as Block, x as notifyRootExtensionsHmr } from './fiber.Biz9olEe.mjs';
3
3
  import * as React from 'react';
4
4
  import React__default, { useRef, useMemo, useLayoutEffect, useEffect, useImperativeHandle, useCallback, useState } from 'react';
5
5
  import useMeasure from 'react-use-measure';
@@ -680,13 +680,6 @@ function applyProps(object, props) {
680
680
  return object;
681
681
  }
682
682
 
683
- const INTERNAL_LIB_MARKERS = ["zustand", "setState", "Object.assign"];
684
- function isInternalRendererAccess(stack, callerDepth = 2) {
685
- if (!stack) return false;
686
- const caller = stack.split("\n")[callerDepth] ?? "";
687
- return INTERNAL_LIB_MARKERS.some((m) => caller.includes(m));
688
- }
689
-
690
683
  function updateSize(state, size, imperative) {
691
684
  state.set((current) => ({
692
685
  size,
@@ -701,7 +694,8 @@ function configureSize(store, size) {
701
694
  updateSize(state, size, false);
702
695
  }
703
696
  const createStore = (invalidate, advance) => {
704
- const rootStore = createWithEqualityFn((set, get) => {
697
+ const rootStore = createWithEqualityFn((rawSet, get, api) => {
698
+ const set = api.setState = preserveAccessors(rawSet, get);
705
699
  let position;
706
700
  let defaultTarget;
707
701
  let tempTarget;
@@ -794,7 +788,7 @@ const createStore = (invalidate, advance) => {
794
788
  factor: 0,
795
789
  getCurrentViewport
796
790
  },
797
- setEvents: (events) => set((state2) => ({ ...state2, events: { ...state2.events, ...events } })),
791
+ setEvents: (events) => set((state2) => ({ events: { ...state2.events, ...events } })),
798
792
  setSize: (width, height, top, left) => {
799
793
  const state2 = get();
800
794
  if (width === void 0) {
@@ -890,37 +884,7 @@ const createStore = (invalidate, advance) => {
890
884
  return rootState;
891
885
  });
892
886
  const state = rootStore.getState();
893
- Object.defineProperty(state, "gl", {
894
- get() {
895
- const currentState = rootStore.getState();
896
- if (!currentState.isLegacy && currentState.internal.actualRenderer) {
897
- const stack = new Error().stack || "";
898
- if (!isInternalRendererAccess(stack)) {
899
- const cleanedStack = stack.split("\n").slice(2).join("\n") || "Stack trace unavailable";
900
- notifyDepreciated({
901
- heading: "Accessing state.gl in WebGPU mode",
902
- body: "Please use state.renderer instead. state.gl is deprecated and will be removed in future versions.\n\nFor backwards compatibility, state.gl currently maps to state.renderer, but this may cause issues with libraries expecting WebGLRenderer.\n\nAccessed from:\n" + cleanedStack
903
- });
904
- }
905
- }
906
- return currentState.internal.actualRenderer;
907
- },
908
- set(value) {
909
- rootStore.getState().internal.actualRenderer = value;
910
- },
911
- enumerable: true,
912
- configurable: true
913
- });
914
- Object.defineProperty(state, "renderer", {
915
- get() {
916
- return rootStore.getState().internal.actualRenderer;
917
- },
918
- set(value) {
919
- rootStore.getState().internal.actualRenderer = value;
920
- },
921
- enumerable: true,
922
- configurable: true
923
- });
887
+ defineRendererAccessors(state);
924
888
  let oldScene = state.scene;
925
889
  rootStore.subscribe(() => {
926
890
  const currentState = rootStore.getState();
@@ -1370,7 +1334,6 @@ function initializeRenderer(canvas, provider, store, props) {
1370
1334
  state.set((prev) => ({
1371
1335
  webGPUSupported: primaryEntry.store.getState().webGPUSupported,
1372
1336
  renderer,
1373
- gl: renderer,
1374
1337
  primaryStore: primaryEntry.store,
1375
1338
  internal: {
1376
1339
  ...prev.internal,
@@ -1401,7 +1364,6 @@ function initializeRenderer(canvas, provider, store, props) {
1401
1364
  state.set((prev) => ({
1402
1365
  webGPUSupported: isWebGPUBackend,
1403
1366
  renderer,
1404
- gl: renderer,
1405
1367
  primaryStore: store,
1406
1368
  internal: {
1407
1369
  ...prev.internal,
@@ -1421,12 +1383,7 @@ function initializeRenderer(canvas, provider, store, props) {
1421
1383
  const isWebGPUBackend = backend && "isWebGPUBackend" in backend;
1422
1384
  state.internal.actualRenderer = renderer;
1423
1385
  state.internal.releaseRenderer = leaseRenderer(renderer, resolved.owned);
1424
- state.set({
1425
- webGPUSupported: isWebGPUBackend,
1426
- renderer,
1427
- gl: renderer,
1428
- primaryStore: store
1429
- });
1386
+ state.set({ webGPUSupported: isWebGPUBackend, renderer, primaryStore: store });
1430
1387
  if (primary) {
1431
1388
  const canvasTarget = renderer.getCanvasTarget?.();
1432
1389
  (_a = state.internal).pendingRootId ?? (_a.pendingRootId = canvasId || getScheduler().generateRootId());
@@ -1858,14 +1815,12 @@ function createRootConfiguration(store, canvas) {
1858
1815
  };
1859
1816
  const xr = {
1860
1817
  connect() {
1861
- const { gl, renderer: renderer2 } = store.getState();
1862
- const xrManager = (renderer2 || gl).xr;
1818
+ const xrManager = store.getState().renderer.xr;
1863
1819
  xrManager.addEventListener("sessionstart", handleSessionChange);
1864
1820
  xrManager.addEventListener("sessionend", handleSessionChange);
1865
1821
  },
1866
1822
  disconnect() {
1867
- const { gl, renderer: renderer2 } = store.getState();
1868
- const xrManager = (renderer2 || gl).xr;
1823
+ const xrManager = store.getState().renderer.xr;
1869
1824
  xrManager.removeEventListener("sessionstart", handleSessionChange);
1870
1825
  xrManager.removeEventListener("sessionend", handleSessionChange);
1871
1826
  }
@@ -15972,6 +15927,7 @@ function PortalInner({ state = {}, children, container }) {
15972
15927
  const lastRoot = lastRootState.current;
15973
15928
  if (lastRoot) {
15974
15929
  for (const key in rootState) {
15930
+ if (isAccessor(rootState, key)) continue;
15975
15931
  const field = key;
15976
15932
  const changed = rootState[field] !== lastRoot[field];
15977
15933
  const inherited = !(key in rest) && injectState[field] === lastRoot[field];
@@ -15988,11 +15944,7 @@ function PortalInner({ state = {}, children, container }) {
15988
15944
  if (camera !== rootState.camera) updateCamera(camera, resolvedSize);
15989
15945
  }
15990
15946
  const set = injectState.set;
15991
- return {
15992
- // The intersect consists of the previous root state
15993
- ...rootState,
15994
- ...injectState,
15995
- ...followed,
15947
+ return Object.assign(cloneState(rootState, injectState, followed), {
15996
15948
  // Portals have their own scene - always a real THREE.Scene (injected if needed)
15997
15949
  scene: portalScene,
15998
15950
  // rootScene always points to the actual THREE.Scene, even inside portals
@@ -16007,13 +15959,19 @@ function PortalInner({ state = {}, children, container }) {
16007
15959
  size: resolvedSize,
16008
15960
  viewport: { ...rootState.viewport, ...viewport },
16009
15961
  // Layers are allowed to override events
16010
- setEvents: (events2) => set((state2) => ({ ...state2, events: { ...state2.events, ...events2 } })),
16011
- // Container for child attachment - the portalScene (injected or container itself)
16012
- internal: { ...rootState.internal, ...injectState.internal, container: portalScene }
16013
- };
15962
+ setEvents: (events2) => set((state2) => ({ events: { ...state2.events, ...events2 } })),
15963
+ // Container for child attachment - the portalScene (injected or container itself). A portal
15964
+ // renders with its parent's renderer, which `renderer` / `gl` read from `actualRenderer`
15965
+ internal: {
15966
+ ...rootState.internal,
15967
+ ...injectState.internal,
15968
+ actualRenderer: rootState.internal.actualRenderer,
15969
+ container: portalScene
15970
+ }
15971
+ });
16014
15972
  });
16015
15973
  const usePortalStore = useMemo(() => {
16016
- const store = createWithEqualityFn((set, get) => ({ ...rest, set, get }));
15974
+ const store = createWithEqualityFn(keepAccessors((set, get) => ({ ...rest, set, get })));
16017
15975
  const onMutate = (prev) => store.setState((state2) => inject.current(prev, state2));
16018
15976
  onMutate(previousRoot.getState());
16019
15977
  return store;
@@ -131,6 +131,99 @@ function isDevelopment() {
131
131
  }
132
132
  }
133
133
 
134
+ const INTERNAL_LIB_MARKERS = [
135
+ "zustand",
136
+ "setState",
137
+ "Object.assign",
138
+ "@pmndrs/scheduler",
139
+ "Scheduler.tickRoot",
140
+ "Scheduler.stepJob"
141
+ ];
142
+ function isInternalRendererAccess(stack, callerDepth = 2) {
143
+ if (!stack) return false;
144
+ const caller = stack.split("\n")[callerDepth] ?? "";
145
+ return INTERNAL_LIB_MARKERS.some((m) => caller.includes(m));
146
+ }
147
+
148
+ const isAccessorDescriptor = (descriptor) => !!descriptor && (descriptor.get !== void 0 || descriptor.set !== void 0);
149
+ const isAccessor = (object, key) => isAccessorDescriptor(Object.getOwnPropertyDescriptor(object, key));
150
+ function cloneState(...sources) {
151
+ const target = {};
152
+ for (const source of sources) {
153
+ if (source) Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
154
+ }
155
+ return target;
156
+ }
157
+ function preserveAccessors(rawSet, get) {
158
+ return ((partial, replace) => {
159
+ const previous = get();
160
+ const patch = typeof partial === "function" ? partial(previous) : partial;
161
+ if (replace || !previous || patch == null || Object.is(patch, previous)) {
162
+ return rawSet(patch, replace);
163
+ }
164
+ const next = cloneState(previous);
165
+ const viaSetter = [];
166
+ for (const key of Reflect.ownKeys(patch)) {
167
+ const descriptor = Object.getOwnPropertyDescriptor(patch, key);
168
+ if (!descriptor.enumerable) continue;
169
+ if (isAccessorDescriptor(descriptor)) {
170
+ Object.defineProperty(next, key, descriptor);
171
+ } else if (isAccessor(next, key)) {
172
+ viaSetter.push(key);
173
+ } else {
174
+ Object.defineProperty(next, key, {
175
+ value: descriptor.value,
176
+ writable: true,
177
+ enumerable: true,
178
+ configurable: true
179
+ });
180
+ }
181
+ }
182
+ for (const key of viaSetter) next[key] = patch[key];
183
+ rawSet(next, true);
184
+ });
185
+ }
186
+ const keepAccessors = (initializer) => (rawSet, get, api) => {
187
+ const set = preserveAccessors(rawSet, get);
188
+ api.setState = set;
189
+ return initializer(set, get, api);
190
+ };
191
+ let glNoticeShown = false;
192
+ function defineRendererAccessors(state) {
193
+ Object.defineProperty(state, "gl", {
194
+ get() {
195
+ const renderer = this.internal?.actualRenderer;
196
+ if (!glNoticeShown && renderer && !this.isLegacy) {
197
+ const stack = new Error().stack || "";
198
+ if (!isInternalRendererAccess(stack)) {
199
+ glNoticeShown = true;
200
+ const cleanedStack = stack.split("\n").slice(2).join("\n") || "Stack trace unavailable";
201
+ notifyDepreciated({
202
+ heading: "Accessing state.gl in WebGPU mode",
203
+ body: "Please use state.renderer instead. state.gl is deprecated and will be removed in future versions.\n\nFor backwards compatibility, state.gl currently maps to state.renderer, but this may cause issues with libraries expecting WebGLRenderer.\n\nAccessed from:\n" + cleanedStack
204
+ });
205
+ }
206
+ }
207
+ return renderer;
208
+ },
209
+ set(value) {
210
+ this.internal.actualRenderer = value;
211
+ },
212
+ enumerable: true,
213
+ configurable: true
214
+ });
215
+ Object.defineProperty(state, "renderer", {
216
+ get() {
217
+ return this.internal?.actualRenderer;
218
+ },
219
+ set(value) {
220
+ this.internal.actualRenderer = value;
221
+ },
222
+ enumerable: true,
223
+ configurable: true
224
+ });
225
+ }
226
+
134
227
  const R3F_CONTEXT = Symbol.for("@react-three/fiber.context");
135
228
  const context = globalThis[R3F_CONTEXT] ?? (globalThis[R3F_CONTEXT] = React.createContext(null));
136
229
 
@@ -242,15 +335,12 @@ function useFrame(callback, priorityOrOptions) {
242
335
  });
243
336
  }
244
337
  const wrappedCallback = (frameState, delta) => {
245
- const localState = store.getState();
246
- const mergedState = {
247
- ...localState,
248
- time: frameState.time,
249
- delta: frameState.delta,
250
- elapsed: frameState.elapsed,
251
- frame: frameState.frame,
252
- overstep: frameState.overstep
253
- };
338
+ const mergedState = cloneState(store.getState());
339
+ mergedState.time = frameState.time;
340
+ mergedState.delta = frameState.delta;
341
+ mergedState.elapsed = frameState.elapsed;
342
+ mergedState.frame = frameState.frame;
343
+ mergedState.overstep = frameState.overstep;
254
344
  callbackRef.current?.(mergedState, delta);
255
345
  };
256
346
  const unregister = scheduler.register(wrappedCallback, {
@@ -388,4 +478,4 @@ function getTextureView(store) {
388
478
  return view;
389
479
  }
390
480
 
391
- export { Block as B, ErrorBoundary as E, useThree as a, useFrame as b, context as c, useIsomorphicLayoutEffect as d, useMutableCallback as e, useBridge as f, getTextureView as g, detachRootExtensions as h, isDevelopment as i, attachRootExtensions as j, unstageTextures as k, stageTextures as l, useGate as m, notifyDepreciated as n, notifyAlpha as o, notifyRootExtensionsHmr as p, registerRootExtension as r, setRenderOverride as s, useStore as u };
481
+ export { Block as B, ErrorBoundary as E, useThree as a, useFrame as b, context as c, useIsomorphicLayoutEffect as d, useMutableCallback as e, useBridge as f, getTextureView as g, defineRendererAccessors as h, isDevelopment as i, detachRootExtensions as j, attachRootExtensions as k, unstageTextures as l, stageTextures as m, notifyDepreciated as n, isAccessor as o, preserveAccessors as p, cloneState as q, registerRootExtension as r, setRenderOverride as s, keepAccessors as t, useStore as u, useGate as v, notifyAlpha as w, notifyRootExtensionsHmr as x };
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
3
  const jsxRuntime = require('react/jsx-runtime');
4
- const textureStaging = require('./fiber.CsZ092z_.cjs');
4
+ const textureStaging = require('./fiber.DfiCufha.cjs');
5
5
  const React = require('react');
6
6
  const useMeasure = require('react-use-measure');
7
7
  const itsFine = require('its-fine');
@@ -701,13 +701,6 @@ function applyProps(object, props) {
701
701
  return object;
702
702
  }
703
703
 
704
- const INTERNAL_LIB_MARKERS = ["zustand", "setState", "Object.assign"];
705
- function isInternalRendererAccess(stack, callerDepth = 2) {
706
- if (!stack) return false;
707
- const caller = stack.split("\n")[callerDepth] ?? "";
708
- return INTERNAL_LIB_MARKERS.some((m) => caller.includes(m));
709
- }
710
-
711
704
  function updateSize(state, size, imperative) {
712
705
  state.set((current) => ({
713
706
  size,
@@ -722,7 +715,8 @@ function configureSize(store, size) {
722
715
  updateSize(state, size, false);
723
716
  }
724
717
  const createStore = (invalidate, advance) => {
725
- const rootStore = traditional.createWithEqualityFn((set, get) => {
718
+ const rootStore = traditional.createWithEqualityFn((rawSet, get, api) => {
719
+ const set = api.setState = textureStaging.preserveAccessors(rawSet, get);
726
720
  let position;
727
721
  let defaultTarget;
728
722
  let tempTarget;
@@ -815,7 +809,7 @@ const createStore = (invalidate, advance) => {
815
809
  factor: 0,
816
810
  getCurrentViewport
817
811
  },
818
- setEvents: (events) => set((state2) => ({ ...state2, events: { ...state2.events, ...events } })),
812
+ setEvents: (events) => set((state2) => ({ events: { ...state2.events, ...events } })),
819
813
  setSize: (width, height, top, left) => {
820
814
  const state2 = get();
821
815
  if (width === void 0) {
@@ -911,37 +905,7 @@ const createStore = (invalidate, advance) => {
911
905
  return rootState;
912
906
  });
913
907
  const state = rootStore.getState();
914
- Object.defineProperty(state, "gl", {
915
- get() {
916
- const currentState = rootStore.getState();
917
- if (!currentState.isLegacy && currentState.internal.actualRenderer) {
918
- const stack = new Error().stack || "";
919
- if (!isInternalRendererAccess(stack)) {
920
- const cleanedStack = stack.split("\n").slice(2).join("\n") || "Stack trace unavailable";
921
- textureStaging.notifyDepreciated({
922
- heading: "Accessing state.gl in WebGPU mode",
923
- body: "Please use state.renderer instead. state.gl is deprecated and will be removed in future versions.\n\nFor backwards compatibility, state.gl currently maps to state.renderer, but this may cause issues with libraries expecting WebGLRenderer.\n\nAccessed from:\n" + cleanedStack
924
- });
925
- }
926
- }
927
- return currentState.internal.actualRenderer;
928
- },
929
- set(value) {
930
- rootStore.getState().internal.actualRenderer = value;
931
- },
932
- enumerable: true,
933
- configurable: true
934
- });
935
- Object.defineProperty(state, "renderer", {
936
- get() {
937
- return rootStore.getState().internal.actualRenderer;
938
- },
939
- set(value) {
940
- rootStore.getState().internal.actualRenderer = value;
941
- },
942
- enumerable: true,
943
- configurable: true
944
- });
908
+ textureStaging.defineRendererAccessors(state);
945
909
  let oldScene = state.scene;
946
910
  rootStore.subscribe(() => {
947
911
  const currentState = rootStore.getState();
@@ -1391,7 +1355,6 @@ function initializeRenderer(canvas, provider, store, props) {
1391
1355
  state.set((prev) => ({
1392
1356
  webGPUSupported: primaryEntry.store.getState().webGPUSupported,
1393
1357
  renderer,
1394
- gl: renderer,
1395
1358
  primaryStore: primaryEntry.store,
1396
1359
  internal: {
1397
1360
  ...prev.internal,
@@ -1422,7 +1385,6 @@ function initializeRenderer(canvas, provider, store, props) {
1422
1385
  state.set((prev) => ({
1423
1386
  webGPUSupported: isWebGPUBackend,
1424
1387
  renderer,
1425
- gl: renderer,
1426
1388
  primaryStore: store,
1427
1389
  internal: {
1428
1390
  ...prev.internal,
@@ -1442,12 +1404,7 @@ function initializeRenderer(canvas, provider, store, props) {
1442
1404
  const isWebGPUBackend = backend && "isWebGPUBackend" in backend;
1443
1405
  state.internal.actualRenderer = renderer;
1444
1406
  state.internal.releaseRenderer = leaseRenderer(renderer, resolved.owned);
1445
- state.set({
1446
- webGPUSupported: isWebGPUBackend,
1447
- renderer,
1448
- gl: renderer,
1449
- primaryStore: store
1450
- });
1407
+ state.set({ webGPUSupported: isWebGPUBackend, renderer, primaryStore: store });
1451
1408
  if (primary) {
1452
1409
  const canvasTarget = renderer.getCanvasTarget?.();
1453
1410
  (_a = state.internal).pendingRootId ?? (_a.pendingRootId = canvasId || scheduler.getScheduler().generateRootId());
@@ -1879,14 +1836,12 @@ function createRootConfiguration(store, canvas) {
1879
1836
  };
1880
1837
  const xr = {
1881
1838
  connect() {
1882
- const { gl, renderer: renderer2 } = store.getState();
1883
- const xrManager = (renderer2 || gl).xr;
1839
+ const xrManager = store.getState().renderer.xr;
1884
1840
  xrManager.addEventListener("sessionstart", handleSessionChange);
1885
1841
  xrManager.addEventListener("sessionend", handleSessionChange);
1886
1842
  },
1887
1843
  disconnect() {
1888
- const { gl, renderer: renderer2 } = store.getState();
1889
- const xrManager = (renderer2 || gl).xr;
1844
+ const xrManager = store.getState().renderer.xr;
1890
1845
  xrManager.removeEventListener("sessionstart", handleSessionChange);
1891
1846
  xrManager.removeEventListener("sessionend", handleSessionChange);
1892
1847
  }
@@ -15993,6 +15948,7 @@ function PortalInner({ state = {}, children, container }) {
15993
15948
  const lastRoot = lastRootState.current;
15994
15949
  if (lastRoot) {
15995
15950
  for (const key in rootState) {
15951
+ if (textureStaging.isAccessor(rootState, key)) continue;
15996
15952
  const field = key;
15997
15953
  const changed = rootState[field] !== lastRoot[field];
15998
15954
  const inherited = !(key in rest) && injectState[field] === lastRoot[field];
@@ -16009,11 +15965,7 @@ function PortalInner({ state = {}, children, container }) {
16009
15965
  if (camera !== rootState.camera) updateCamera(camera, resolvedSize);
16010
15966
  }
16011
15967
  const set = injectState.set;
16012
- return {
16013
- // The intersect consists of the previous root state
16014
- ...rootState,
16015
- ...injectState,
16016
- ...followed,
15968
+ return Object.assign(textureStaging.cloneState(rootState, injectState, followed), {
16017
15969
  // Portals have their own scene - always a real THREE.Scene (injected if needed)
16018
15970
  scene: portalScene,
16019
15971
  // rootScene always points to the actual THREE.Scene, even inside portals
@@ -16028,13 +15980,19 @@ function PortalInner({ state = {}, children, container }) {
16028
15980
  size: resolvedSize,
16029
15981
  viewport: { ...rootState.viewport, ...viewport },
16030
15982
  // Layers are allowed to override events
16031
- setEvents: (events2) => set((state2) => ({ ...state2, events: { ...state2.events, ...events2 } })),
16032
- // Container for child attachment - the portalScene (injected or container itself)
16033
- internal: { ...rootState.internal, ...injectState.internal, container: portalScene }
16034
- };
15983
+ setEvents: (events2) => set((state2) => ({ events: { ...state2.events, ...events2 } })),
15984
+ // Container for child attachment - the portalScene (injected or container itself). A portal
15985
+ // renders with its parent's renderer, which `renderer` / `gl` read from `actualRenderer`
15986
+ internal: {
15987
+ ...rootState.internal,
15988
+ ...injectState.internal,
15989
+ actualRenderer: rootState.internal.actualRenderer,
15990
+ container: portalScene
15991
+ }
15992
+ });
16035
15993
  });
16036
15994
  const usePortalStore = React.useMemo(() => {
16037
- const store = traditional.createWithEqualityFn((set, get) => ({ ...rest, set, get }));
15995
+ const store = traditional.createWithEqualityFn(textureStaging.keepAccessors((set, get) => ({ ...rest, set, get })));
16038
15996
  const onMutate = (prev) => store.setState((state2) => inject.current(prev, state2));
16039
15997
  onMutate(previousRoot.getState());
16040
15998
  return store;
@@ -16517,7 +16475,7 @@ function CanvasImpl({
16517
16475
  if (rootEntry?.store) textureStaging.notifyRootExtensionsHmr(rootEntry.store);
16518
16476
  });
16519
16477
  };
16520
- if (typeof ({ url: (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.tagName.toUpperCase() === 'SCRIPT' && _documentCurrentScript.src || new URL('shared/fiber.BybcfIwy.cjs', document.baseURI).href)) }) !== "undefined" && undefined) {
16478
+ if (typeof ({ url: (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.tagName.toUpperCase() === 'SCRIPT' && _documentCurrentScript.src || new URL('shared/fiber.Cd8-yZqM.cjs', document.baseURI).href)) }) !== "undefined" && undefined) {
16521
16479
  const hot = undefined;
16522
16480
  hot.on("vite:afterUpdate", handleHMR);
16523
16481
  return () => hot.off?.("vite:afterUpdate", handleHMR);
@@ -146,6 +146,99 @@ function isDevelopment() {
146
146
  }
147
147
  }
148
148
 
149
+ const INTERNAL_LIB_MARKERS = [
150
+ "zustand",
151
+ "setState",
152
+ "Object.assign",
153
+ "@pmndrs/scheduler",
154
+ "Scheduler.tickRoot",
155
+ "Scheduler.stepJob"
156
+ ];
157
+ function isInternalRendererAccess(stack, callerDepth = 2) {
158
+ if (!stack) return false;
159
+ const caller = stack.split("\n")[callerDepth] ?? "";
160
+ return INTERNAL_LIB_MARKERS.some((m) => caller.includes(m));
161
+ }
162
+
163
+ const isAccessorDescriptor = (descriptor) => !!descriptor && (descriptor.get !== void 0 || descriptor.set !== void 0);
164
+ const isAccessor = (object, key) => isAccessorDescriptor(Object.getOwnPropertyDescriptor(object, key));
165
+ function cloneState(...sources) {
166
+ const target = {};
167
+ for (const source of sources) {
168
+ if (source) Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
169
+ }
170
+ return target;
171
+ }
172
+ function preserveAccessors(rawSet, get) {
173
+ return ((partial, replace) => {
174
+ const previous = get();
175
+ const patch = typeof partial === "function" ? partial(previous) : partial;
176
+ if (replace || !previous || patch == null || Object.is(patch, previous)) {
177
+ return rawSet(patch, replace);
178
+ }
179
+ const next = cloneState(previous);
180
+ const viaSetter = [];
181
+ for (const key of Reflect.ownKeys(patch)) {
182
+ const descriptor = Object.getOwnPropertyDescriptor(patch, key);
183
+ if (!descriptor.enumerable) continue;
184
+ if (isAccessorDescriptor(descriptor)) {
185
+ Object.defineProperty(next, key, descriptor);
186
+ } else if (isAccessor(next, key)) {
187
+ viaSetter.push(key);
188
+ } else {
189
+ Object.defineProperty(next, key, {
190
+ value: descriptor.value,
191
+ writable: true,
192
+ enumerable: true,
193
+ configurable: true
194
+ });
195
+ }
196
+ }
197
+ for (const key of viaSetter) next[key] = patch[key];
198
+ rawSet(next, true);
199
+ });
200
+ }
201
+ const keepAccessors = (initializer) => (rawSet, get, api) => {
202
+ const set = preserveAccessors(rawSet, get);
203
+ api.setState = set;
204
+ return initializer(set, get, api);
205
+ };
206
+ let glNoticeShown = false;
207
+ function defineRendererAccessors(state) {
208
+ Object.defineProperty(state, "gl", {
209
+ get() {
210
+ const renderer = this.internal?.actualRenderer;
211
+ if (!glNoticeShown && renderer && !this.isLegacy) {
212
+ const stack = new Error().stack || "";
213
+ if (!isInternalRendererAccess(stack)) {
214
+ glNoticeShown = true;
215
+ const cleanedStack = stack.split("\n").slice(2).join("\n") || "Stack trace unavailable";
216
+ notifyDepreciated({
217
+ heading: "Accessing state.gl in WebGPU mode",
218
+ body: "Please use state.renderer instead. state.gl is deprecated and will be removed in future versions.\n\nFor backwards compatibility, state.gl currently maps to state.renderer, but this may cause issues with libraries expecting WebGLRenderer.\n\nAccessed from:\n" + cleanedStack
219
+ });
220
+ }
221
+ }
222
+ return renderer;
223
+ },
224
+ set(value) {
225
+ this.internal.actualRenderer = value;
226
+ },
227
+ enumerable: true,
228
+ configurable: true
229
+ });
230
+ Object.defineProperty(state, "renderer", {
231
+ get() {
232
+ return this.internal?.actualRenderer;
233
+ },
234
+ set(value) {
235
+ this.internal.actualRenderer = value;
236
+ },
237
+ enumerable: true,
238
+ configurable: true
239
+ });
240
+ }
241
+
149
242
  const R3F_CONTEXT = Symbol.for("@react-three/fiber.context");
150
243
  const context = globalThis[R3F_CONTEXT] ?? (globalThis[R3F_CONTEXT] = React__namespace.createContext(null));
151
244
 
@@ -257,15 +350,12 @@ function useFrame(callback, priorityOrOptions) {
257
350
  });
258
351
  }
259
352
  const wrappedCallback = (frameState, delta) => {
260
- const localState = store.getState();
261
- const mergedState = {
262
- ...localState,
263
- time: frameState.time,
264
- delta: frameState.delta,
265
- elapsed: frameState.elapsed,
266
- frame: frameState.frame,
267
- overstep: frameState.overstep
268
- };
353
+ const mergedState = cloneState(store.getState());
354
+ mergedState.time = frameState.time;
355
+ mergedState.delta = frameState.delta;
356
+ mergedState.elapsed = frameState.elapsed;
357
+ mergedState.frame = frameState.frame;
358
+ mergedState.overstep = frameState.overstep;
269
359
  callbackRef.current?.(mergedState, delta);
270
360
  };
271
361
  const unregister = scheduler$1.register(wrappedCallback, {
@@ -406,13 +496,18 @@ function getTextureView(store) {
406
496
  exports.Block = Block;
407
497
  exports.ErrorBoundary = ErrorBoundary;
408
498
  exports.attachRootExtensions = attachRootExtensions;
499
+ exports.cloneState = cloneState;
409
500
  exports.context = context;
501
+ exports.defineRendererAccessors = defineRendererAccessors;
410
502
  exports.detachRootExtensions = detachRootExtensions;
411
503
  exports.getTextureView = getTextureView;
504
+ exports.isAccessor = isAccessor;
412
505
  exports.isDevelopment = isDevelopment;
506
+ exports.keepAccessors = keepAccessors;
413
507
  exports.notifyAlpha = notifyAlpha;
414
508
  exports.notifyDepreciated = notifyDepreciated;
415
509
  exports.notifyRootExtensionsHmr = notifyRootExtensionsHmr;
510
+ exports.preserveAccessors = preserveAccessors;
416
511
  exports.registerRootExtension = registerRootExtension;
417
512
  exports.setRenderOverride = setRenderOverride;
418
513
  exports.stageTextures = stageTextures;
@@ -1,9 +1,9 @@
1
1
  'use strict';
2
2
 
3
3
  const jsxRuntime = require('react/jsx-runtime');
4
- const Canvas$1 = require('../shared/fiber.BybcfIwy.cjs');
4
+ const Canvas$1 = require('../shared/fiber.Cd8-yZqM.cjs');
5
5
  const webgpu = require('../chunks/webgpu.cjs');
6
- const textureStaging = require('../shared/fiber.CsZ092z_.cjs');
6
+ const textureStaging = require('../shared/fiber.DfiCufha.cjs');
7
7
  const scheduler = require('@pmndrs/scheduler');
8
8
 
9
9
  function addTexture(set, key, value) {
@@ -1,9 +1,9 @@
1
1
  import { jsx } from 'react/jsx-runtime';
2
- import { G as useRenderTarget$1, c as createRoot$1, C as Canvas$1 } from '../shared/fiber.BC5FRLu-.mjs';
3
- export { s as Environment, p as EnvironmentCube, E as EnvironmentMap, q as EnvironmentPortal, ai as FROM_REF, I as IsObject, al as ONCE, P as Portal, U as REACT_INTERNAL_PROPS, a1 as RESERVED_PROPS, T as Texture, _ as _roots, d as addAfterEffect, b as addEffect, e as addTail, f as advance, a6 as applyProps, a3 as attach, X as buildGraph, O as calculateDpr, y as createEvents, a as createPointerEvents, N as createPortal, l as createStore, a4 as detach, a5 as diffProps, Y as dispose, a as events, J as extend, V as findInitialRoot, L as flushSync, aj as fromRef, Z as getInstanceProps, h as getPrimary, k as getPrimaryIds, W as getRootState, m as getThree, Q as getUuidPrefix, ah as hasConstructor, j as hasPrimary, n as hasThree, i as invalidate, a0 as invalidateInstance, a7 as is, aa as isColorRepresentation, ag as isCopyable, ak as isFromRef, ad as isLayers, ab as isObject3D, an as isOnce, a8 as isOrthographicCamera, a9 as isRef, g as isRenderer, ac as isTexture, ae as isUniform, af as isVectorLike, am as once, $ as prepare, t as presetsObj, K as reconciler, r as registerPrimary, x as removeInteractivity, a2 as resolve, v as swapInteractivity, M as unmountComponentAtNode, u as unregisterPrimary, R as updateCamera, S as updateFrustum, H as useEnvironment, A as useGraph, z as useInstanceHandle, B as useLoader, D as useTexture, F as useTextures, w as waitForPrimary, o as whenThree } from '../shared/fiber.BC5FRLu-.mjs';
2
+ import { G as useRenderTarget$1, c as createRoot$1, C as Canvas$1 } from '../shared/fiber.BLt8Cx7Z.mjs';
3
+ export { s as Environment, p as EnvironmentCube, E as EnvironmentMap, q as EnvironmentPortal, ai as FROM_REF, I as IsObject, al as ONCE, P as Portal, U as REACT_INTERNAL_PROPS, a1 as RESERVED_PROPS, T as Texture, _ as _roots, d as addAfterEffect, b as addEffect, e as addTail, f as advance, a6 as applyProps, a3 as attach, X as buildGraph, O as calculateDpr, y as createEvents, a as createPointerEvents, N as createPortal, l as createStore, a4 as detach, a5 as diffProps, Y as dispose, a as events, J as extend, V as findInitialRoot, L as flushSync, aj as fromRef, Z as getInstanceProps, h as getPrimary, k as getPrimaryIds, W as getRootState, m as getThree, Q as getUuidPrefix, ah as hasConstructor, j as hasPrimary, n as hasThree, i as invalidate, a0 as invalidateInstance, a7 as is, aa as isColorRepresentation, ag as isCopyable, ak as isFromRef, ad as isLayers, ab as isObject3D, an as isOnce, a8 as isOrthographicCamera, a9 as isRef, g as isRenderer, ac as isTexture, ae as isUniform, af as isVectorLike, am as once, $ as prepare, t as presetsObj, K as reconciler, r as registerPrimary, x as removeInteractivity, a2 as resolve, v as swapInteractivity, M as unmountComponentAtNode, u as unregisterPrimary, R as updateCamera, S as updateFrustum, H as useEnvironment, A as useGraph, z as useInstanceHandle, B as useLoader, D as useTexture, F as useTextures, w as waitForPrimary, o as whenThree } from '../shared/fiber.BLt8Cx7Z.mjs';
4
4
  import { webgpuSupport } from '../chunks/webgpu.mjs';
5
- import { a as useThree$1, b as useFrame$1 } from '../shared/fiber.DlH05gco.mjs';
6
- export { B as Block, E as ErrorBoundary, c as context, r as registerRootExtension, s as setRenderOverride, f as useBridge, d as useIsomorphicLayoutEffect, e as useMutableCallback, u as useStore } from '../shared/fiber.DlH05gco.mjs';
5
+ import { a as useThree$1, b as useFrame$1 } from '../shared/fiber.Biz9olEe.mjs';
6
+ export { B as Block, E as ErrorBoundary, c as context, r as registerRootExtension, s as setRenderOverride, f as useBridge, d as useIsomorphicLayoutEffect, e as useMutableCallback, u as useStore } from '../shared/fiber.Biz9olEe.mjs';
7
7
  export { Scheduler, getScheduler } from '@pmndrs/scheduler';
8
8
 
9
9
  function addTexture(set, key, value) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@react-three/fiber",
3
- "version": "10.0.0-canary.87166dc",
3
+ "version": "10.0.0-canary.932f901",
4
4
  "description": "A React renderer for Threejs",
5
5
  "keywords": [
6
6
  "react",