@react-three/fiber 10.0.0-alpha.4 → 10.0.0-alpha.5

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.
@@ -11,6 +11,7 @@ export { Scheduler, getScheduler } from '@pmndrs/scheduler';
11
11
  import Tb, { unstable_getCurrentPriorityLevel, unstable_IdlePriority, unstable_LowPriority, unstable_NormalPriority, unstable_UserBlockingPriority, unstable_ImmediatePriority, unstable_scheduleCallback } from 'scheduler';
12
12
  import { GroundedSkybox } from 'three/examples/jsm/objects/GroundedSkybox.js';
13
13
  import { HDRLoader } from 'three/examples/jsm/loaders/HDRLoader.js';
14
+ import { HDRCubeTextureLoader } from 'three/examples/jsm/loaders/HDRCubeTextureLoader.js';
14
15
  import { EXRLoader } from 'three/examples/jsm/loaders/EXRLoader.js';
15
16
  import { UltraHDRLoader } from 'three/examples/jsm/loaders/UltraHDRLoader.js';
16
17
  import { GainMapLoader } from '@monogrid/gainmap-js';
@@ -519,8 +520,10 @@ function hasVisibilityHandlers(handlers) {
519
520
  }
520
521
 
521
522
  const FROM_REF = Symbol.for("@react-three/fiber.fromRef");
522
- function fromRef(ref) {
523
- return { [FROM_REF]: ref };
523
+ function fromRef(ref, transform) {
524
+ const marker = { [FROM_REF]: ref };
525
+ if (transform) marker.transform = transform;
526
+ return marker;
524
527
  }
525
528
  function isFromRef(value) {
526
529
  return value !== null && typeof value === "object" && FROM_REF in value;
@@ -621,11 +624,9 @@ function diffProps(instance, newProps) {
621
624
  for (const prop in instance.props) {
622
625
  if (RESERVED_PROPS.includes(prop) || newProps.hasOwnProperty(prop)) continue;
623
626
  const { root, key } = resolve(instance.object, prop);
624
- if (root.constructor && root.constructor.length === 0) {
627
+ if (typeof root?.constructor === "function") {
625
628
  const ctor = getMemoizedPrototype(root);
626
629
  if (!is.und(ctor)) changedProps[prop] = ctor[key];
627
- } else {
628
- changedProps[prop] = 0;
629
630
  }
630
631
  }
631
632
  return changedProps;
@@ -1058,7 +1059,8 @@ const createStore = (invalidate, advance) => {
1058
1059
  const resizeTarget = canvasTarget ?? actualRenderer;
1059
1060
  if (viewport.dpr > 0) resizeTarget.setPixelRatio(viewport.dpr);
1060
1061
  resizeTarget.setSize(size.width, size.height, false);
1061
- internal.canvasTargetSizeDirty = true;
1062
+ const activeTarget = actualRenderer.getCanvasTarget?.();
1063
+ if (!canvasTarget || activeTarget !== canvasTarget) internal.canvasTargetSizeDirty = true;
1062
1064
  }
1063
1065
  if (camera !== oldCamera) {
1064
1066
  oldCamera = camera;
@@ -1347,12 +1349,24 @@ function useTexture(input, optionsOrOnLoad) {
1347
1349
  TextureLoader,
1348
1350
  IsObject(stableInput) ? Object.values(stableInput) : stableInput
1349
1351
  );
1352
+ const mappedTextures = useMemo(() => {
1353
+ if (cachedResult) return cachedResult;
1354
+ if (IsObject(stableInput)) {
1355
+ const keyed = {};
1356
+ const textureArray = loadedTextures;
1357
+ let i = 0;
1358
+ for (const key in stableInput) keyed[key] = textureArray[i++];
1359
+ return keyed;
1360
+ } else {
1361
+ return loadedTextures;
1362
+ }
1363
+ }, [stableInput, loadedTextures, cachedResult]);
1350
1364
  useLayoutEffect(() => {
1351
1365
  if (cachedResult) return;
1352
1366
  if (onLoadCalledForRef.current === inputKey) return;
1353
1367
  onLoadCalledForRef.current = inputKey;
1354
- onLoadRef.current?.(loadedTextures);
1355
- }, [cachedResult, loadedTextures, inputKey]);
1368
+ onLoadRef.current?.(mappedTextures);
1369
+ }, [cachedResult, mappedTextures, inputKey]);
1356
1370
  useEffect(() => {
1357
1371
  if (cachedResult) return;
1358
1372
  if ("initTexture" in renderer) {
@@ -1371,18 +1385,6 @@ function useTexture(input, optionsOrOnLoad) {
1371
1385
  });
1372
1386
  }
1373
1387
  }, [renderer, loadedTextures, cachedResult]);
1374
- const mappedTextures = useMemo(() => {
1375
- if (cachedResult) return cachedResult;
1376
- if (IsObject(stableInput)) {
1377
- const keyed = {};
1378
- const textureArray = loadedTextures;
1379
- let i = 0;
1380
- for (const key in stableInput) keyed[key] = textureArray[i++];
1381
- return keyed;
1382
- } else {
1383
- return loadedTextures;
1384
- }
1385
- }, [stableInput, loadedTextures, cachedResult]);
1386
1388
  useEffect(() => {
1387
1389
  if (!cache) return;
1388
1390
  const urlTextureMap = [];
@@ -1584,7 +1586,7 @@ function useEnvironment({
1584
1586
  texture = texture.renderTarget?.texture;
1585
1587
  }
1586
1588
  texture.mapping = isCubemap ? CubeReflectionMapping : EquirectangularReflectionMapping;
1587
- texture.colorSpace = colorSpace ?? (isCubemap ? "srgb" : "srgb-linear");
1589
+ texture.colorSpace = colorSpace ?? (isCubemap && extension !== "hdr-cube" ? "srgb" : "srgb-linear");
1588
1590
  return texture;
1589
1591
  }
1590
1592
  const preloadDefaultOptions = {
@@ -1637,11 +1639,12 @@ function getExtension(files) {
1637
1639
  const isCubemap = isArray(files) && files.length === 6;
1638
1640
  const isGainmap = isArray(files) && files.length === 3 && files.some((file) => file.endsWith("json"));
1639
1641
  const firstEntry = isArray(files) ? files[0] : files;
1640
- const extension = isCubemap ? "cube" : isGainmap ? "webp" : firstEntry.startsWith("data:application/exr") ? "exr" : firstEntry.startsWith("data:application/hdr") ? "hdr" : firstEntry.startsWith("data:image/jpeg") ? "jpg" : firstEntry.split(".").pop()?.split("?")?.shift()?.toLowerCase();
1642
+ const firstExtension = firstEntry.split(".").pop()?.split("?")?.shift()?.toLowerCase();
1643
+ const extension = isCubemap ? firstExtension === "hdr" ? "hdr-cube" : "cube" : isGainmap ? "webp" : firstEntry.startsWith("data:application/exr") ? "exr" : firstEntry.startsWith("data:application/hdr") ? "hdr" : firstEntry.startsWith("data:image/jpeg") ? "jpg" : firstExtension;
1641
1644
  return { extension, isCubemap, isGainmap };
1642
1645
  }
1643
1646
  function getLoader(extension) {
1644
- const loader = extension === "cube" ? CubeTextureLoader : extension === "hdr" ? HDRLoader : extension === "exr" ? EXRLoader : extension === "jpg" || extension === "jpeg" ? UltraHDRLoader : extension === "webp" ? GainMapLoader : null;
1647
+ const loader = extension === "cube" ? CubeTextureLoader : extension === "hdr-cube" ? HDRCubeTextureLoader : extension === "hdr" ? HDRLoader : extension === "exr" ? EXRLoader : extension === "jpg" || extension === "jpeg" ? UltraHDRLoader : extension === "webp" ? GainMapLoader : null;
1645
1648
  return loader;
1646
1649
  }
1647
1650
 
@@ -1704,16 +1707,16 @@ function advance(timestamp, runGlobalEffects, state) {
1704
1707
  else scheduler.step(timestamp);
1705
1708
  }
1706
1709
 
1707
- const version = "10.0.0-alpha.4";
1710
+ const version = "10.0.0-alpha.5";
1708
1711
  const packageData = {
1709
1712
  version: version};
1710
1713
 
1711
1714
  function Xb(Tt) {
1712
1715
  return Tt && Tt.__esModule && Object.prototype.hasOwnProperty.call(Tt, "default") ? Tt.default : Tt;
1713
1716
  }
1714
- var Rm = { exports: {} }, Og = { exports: {} }, _b;
1717
+ var Rm = { exports: {} }, Og = { exports: {} }, _b$1;
1715
1718
  function Kb() {
1716
- return _b || (_b = 1, (function(Tt) {
1719
+ return _b$1 || (_b$1 = 1, (function(Tt) {
1717
1720
  Tt.exports = function(m) {
1718
1721
  function Yn(t, r, a, l) {
1719
1722
  return new uc(t, r, a, l);
@@ -13563,7 +13566,10 @@ function extend(objects) {
13563
13566
  catalogue[Component] = objects;
13564
13567
  return Component;
13565
13568
  } else {
13566
- Object.assign(catalogue, objects);
13569
+ for (const name in objects) {
13570
+ const object = objects[name];
13571
+ if (isConstructor(object)) catalogue[name] = object;
13572
+ }
13567
13573
  }
13568
13574
  }
13569
13575
  function validateInstance(type, props) {
@@ -13911,7 +13917,7 @@ const reconciler = /* @__PURE__ */ createReconciler({
13911
13917
  getRootHostContext: () => NO_CONTEXT,
13912
13918
  getChildHostContext: () => NO_CONTEXT,
13913
13919
  commitUpdate(instance, type, oldProps, newProps, fiber) {
13914
- validateInstance(type, newProps);
13920
+ validateInstance(instance.type, newProps);
13915
13921
  let reconstruct = false;
13916
13922
  if (instance.type === "primitive" && oldProps.object !== newProps.object) reconstruct = true;
13917
13923
  else if (newProps.args?.length !== oldProps.args?.length) reconstruct = true;
@@ -13938,8 +13944,8 @@ const reconciler = /* @__PURE__ */ createReconciler({
13938
13944
  for (const prop in instance.props) {
13939
13945
  const value = instance.props[prop];
13940
13946
  if (isFromRef(value)) {
13941
- const ref = value[FROM_REF];
13942
- if (ref.current != null) resolved[prop] = ref.current;
13947
+ const { [FROM_REF]: ref, transform } = value;
13948
+ if (ref.current != null) resolved[prop] = transform ? transform(ref.current) : ref.current;
13943
13949
  }
13944
13950
  }
13945
13951
  if (Object.keys(resolved).length) applyProps(instance.object, resolved);
@@ -14220,9 +14226,8 @@ function createRoot(canvas) {
14220
14226
  if (!renderer.hasInitialized?.()) {
14221
14227
  const size2 = computeInitialSize(canvas, propsSize);
14222
14228
  if (size2.width > 0 && size2.height > 0) {
14223
- const pixelRatio = calculateDpr(dpr);
14224
- canvas.width = size2.width * pixelRatio;
14225
- canvas.height = size2.height * pixelRatio;
14229
+ renderer.setPixelRatio(calculateDpr(dpr));
14230
+ renderer.setSize(size2.width, size2.height, false);
14226
14231
  }
14227
14232
  await renderer.init();
14228
14233
  }
@@ -14231,7 +14236,7 @@ function createRoot(canvas) {
14231
14236
  state.internal.actualRenderer = renderer;
14232
14237
  state.set({ webGPUSupported: isWebGPUBackend, renderer, primaryStore: store });
14233
14238
  if (canvasId && !state.internal.isSecondary) {
14234
- const canvasTarget = new CanvasTarget(canvas);
14239
+ const canvasTarget = renderer.getCanvasTarget?.();
14235
14240
  const unregisterPrimary = registerPrimary(canvasId, renderer, store);
14236
14241
  state.set((prev) => ({
14237
14242
  internal: {
@@ -14444,9 +14449,10 @@ function createRoot(canvas) {
14444
14449
  const unregisterCanvasTarget = scheduler.register(
14445
14450
  () => {
14446
14451
  const state2 = store.getState();
14447
- if (state2.internal.isMultiCanvas && state2.internal.canvasTarget) {
14452
+ const canvasTarget = state2.internal.canvasTarget;
14453
+ if (canvasTarget) {
14448
14454
  const renderer2 = state2.internal.actualRenderer;
14449
- renderer2.setCanvasTarget(state2.internal.canvasTarget);
14455
+ if (renderer2.getCanvasTarget() !== canvasTarget) renderer2.setCanvasTarget(canvasTarget);
14450
14456
  if (state2.internal.canvasTargetSizeDirty) {
14451
14457
  state2.internal.canvasTargetSizeDirty = false;
14452
14458
  renderer2.backend?.updateSize?.();
@@ -14610,7 +14616,7 @@ function unmountComponentAtNode(canvas, callback) {
14610
14616
  const unregisterPrimary = state.internal.unregisterPrimary;
14611
14617
  if (unregisterPrimary) unregisterPrimary();
14612
14618
  const canvasTarget = state.internal.canvasTarget;
14613
- if (canvasTarget?.dispose) canvasTarget.dispose();
14619
+ if (state.internal.isSecondary && canvasTarget?.dispose) canvasTarget.dispose();
14614
14620
  state.events.disconnect?.();
14615
14621
  cleanupHelperGroup(root.store);
14616
14622
  if (state.isLegacy && renderer) {
@@ -14751,16 +14757,11 @@ function setEnvProps(background, scene, defaultScene, texture, sceneProps = {})
14751
14757
  const oldbg = target.background;
14752
14758
  const oldenv = target.environment;
14753
14759
  const oldSceneProps = {
14754
- // @ts-ignore
14755
14760
  backgroundBlurriness: target.backgroundBlurriness,
14756
- // @ts-ignore
14757
14761
  backgroundIntensity: target.backgroundIntensity,
14758
- // @ts-ignore
14759
- backgroundRotation: target.backgroundRotation?.clone?.() ?? [0, 0, 0],
14760
- // @ts-ignore
14762
+ backgroundRotation: target.backgroundRotation.clone(),
14761
14763
  environmentIntensity: target.environmentIntensity,
14762
- // @ts-ignore
14763
- environmentRotation: target.environmentRotation?.clone?.() ?? [0, 0, 0]
14764
+ environmentRotation: target.environmentRotation.clone()
14764
14765
  };
14765
14766
  if (background !== "only") target.environment = texture;
14766
14767
  if (background) target.background = texture;
@@ -15151,9 +15152,9 @@ function CanvasImpl({
15151
15152
  React.useMemo(() => extend(THREE), []);
15152
15153
  const Bridge = useBridge();
15153
15154
  const backgroundProps = React.useMemo(() => parseBackground(background), [background]);
15154
- const hasInitialSizeRef = React.useRef(false);
15155
+ const [hasInitialSize, setHasInitialSize] = React.useState(false);
15155
15156
  const measureConfig = React.useMemo(() => {
15156
- if (!hasInitialSizeRef.current) {
15157
+ if (!hasInitialSize) {
15157
15158
  return {
15158
15159
  ...resize,
15159
15160
  scroll: resize?.scroll ?? true,
@@ -15165,7 +15166,7 @@ function CanvasImpl({
15165
15166
  debounce: { scroll: 50, resize: 0 },
15166
15167
  ...resize
15167
15168
  };
15168
- }, [resize, hasInitialSizeRef.current]);
15169
+ }, [hasInitialSize, resize]);
15169
15170
  const [containerRef, containerRect] = useMeasure(measureConfig);
15170
15171
  const effectiveSize = React.useMemo(() => {
15171
15172
  let w = width ?? containerRect.width;
@@ -15181,9 +15182,7 @@ function CanvasImpl({
15181
15182
  left: containerRect.left
15182
15183
  };
15183
15184
  }, [width, height, containerRect, forceEven]);
15184
- if (!hasInitialSizeRef.current && effectiveSize.width > 0 && effectiveSize.height > 0) {
15185
- hasInitialSizeRef.current = true;
15186
- }
15185
+ if (!hasInitialSize && effectiveSize.width > 0 && effectiveSize.height > 0) setHasInitialSize(true);
15187
15186
  const canvasRef = React.useRef(null);
15188
15187
  const divRef = React.useRef(null);
15189
15188
  React.useImperativeHandle(ref, () => canvasRef.current);
@@ -15356,20 +15355,36 @@ function CanvasImpl({
15356
15355
  }
15357
15356
  );
15358
15357
  }
15359
- function Canvas(props) {
15358
+ function Canvas$1(props) {
15360
15359
  return /* @__PURE__ */ jsx(FiberProvider, { children: /* @__PURE__ */ jsx(CanvasImpl, { ...props }) });
15361
15360
  }
15362
15361
 
15362
+ const isObjectLike = (value) => value !== null && (typeof value === "object" || typeof value === "function");
15363
+ const hasValidLegacyNodeMarkers = (value) => {
15364
+ const hasUuid = "uuid" in value;
15365
+ const hasNodeType = "nodeType" in value;
15366
+ const uuid = Reflect.get(value, "uuid");
15367
+ const nodeType = Reflect.get(value, "nodeType");
15368
+ return (hasUuid || hasNodeType) && (!hasUuid || uuid === void 0 || typeof uuid === "string") && (!hasNodeType || nodeType === void 0 || nodeType === null || typeof nodeType === "string");
15369
+ };
15370
+ const isUniformNode = (value) => isObjectLike(value) && "isUniformNode" in value && value.isUniformNode === true;
15371
+ const isTSLNode = (value) => isObjectLike(value) && (Reflect.get(value, "isNode") === true || Reflect.get(value, "shaderNode") !== void 0 && typeof Reflect.get(value, "id") === "number" || hasValidLegacyNodeMarkers(value));
15372
+ const isBufferLike = (value) => ArrayBuffer.isView(value) && !(value instanceof DataView) || isObjectLike(value) && ("isBufferAttribute" in value || "isInterleavedBufferAttribute" in value || isTSLNode(value));
15373
+ const isStorageLike = (value) => isObjectLike(value) && ("isTexture" in value || "isData3DTexture" in value || isTSLNode(value));
15374
+
15363
15375
  var __defProp = Object.defineProperty;
15364
15376
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
15365
15377
  var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
15366
- var _a;
15378
+ var _a, _b;
15367
15379
  const INTERNAL_DATA = Symbol("ScopedStore.data");
15368
- _a = INTERNAL_DATA;
15380
+ const INTERNAL_IS_LEAF = Symbol("ScopedStore.isLeaf");
15381
+ _b = INTERNAL_DATA, _a = INTERNAL_IS_LEAF;
15369
15382
  const _ScopedStore = class _ScopedStore {
15370
- constructor(data) {
15383
+ constructor(data, isLeaf) {
15384
+ __publicField(this, _b);
15371
15385
  __publicField(this, _a);
15372
15386
  this[INTERNAL_DATA] = data;
15387
+ this[INTERNAL_IS_LEAF] = isLeaf;
15373
15388
  return new Proxy(this, {
15374
15389
  get(target, prop, receiver) {
15375
15390
  if (typeof prop === "string") {
@@ -15403,10 +15418,10 @@ const _ScopedStore = class _ScopedStore {
15403
15418
  * If the key doesn't exist or isn't a scope object, returns an empty ScopedStore.
15404
15419
  */
15405
15420
  scope(key) {
15406
- const data = this[INTERNAL_DATA][key];
15407
- return new _ScopedStore(
15408
- data && typeof data === "object" ? data : {}
15409
- );
15421
+ const value = this[INTERNAL_DATA][key];
15422
+ const isLeaf = this[INTERNAL_IS_LEAF];
15423
+ const scope = value && typeof value === "object" && !isLeaf(value) ? value : {};
15424
+ return new _ScopedStore(scope, isLeaf);
15410
15425
  }
15411
15426
  /**
15412
15427
  * Check if a key exists in the store.
@@ -15422,8 +15437,8 @@ const _ScopedStore = class _ScopedStore {
15422
15437
  }
15423
15438
  };
15424
15439
  let ScopedStore = _ScopedStore;
15425
- function createScopedStore(data) {
15426
- return new ScopedStore(data);
15440
+ function createScopedStore(data, isLeaf) {
15441
+ return new ScopedStore(data, isLeaf);
15427
15442
  }
15428
15443
  function createLazyCreatorState(state, store) {
15429
15444
  let _uniforms = null;
@@ -15434,22 +15449,22 @@ function createLazyCreatorState(state, store) {
15434
15449
  return Object.create(state, {
15435
15450
  uniforms: {
15436
15451
  get() {
15437
- return _uniforms ?? (_uniforms = createScopedStore(view("uniforms")));
15452
+ return _uniforms ?? (_uniforms = createScopedStore(view("uniforms"), isUniformNode));
15438
15453
  }
15439
15454
  },
15440
15455
  nodes: {
15441
15456
  get() {
15442
- return _nodes ?? (_nodes = createScopedStore(view("nodes")));
15457
+ return _nodes ?? (_nodes = createScopedStore(view("nodes"), isTSLNode));
15443
15458
  }
15444
15459
  },
15445
15460
  buffers: {
15446
15461
  get() {
15447
- return _buffers ?? (_buffers = createScopedStore(view("buffers")));
15462
+ return _buffers ?? (_buffers = createScopedStore(view("buffers"), isBufferLike));
15448
15463
  }
15449
15464
  },
15450
15465
  gpuStorage: {
15451
15466
  get() {
15452
- return _gpuStorage ?? (_gpuStorage = createScopedStore(view("gpuStorage")));
15467
+ return _gpuStorage ?? (_gpuStorage = createScopedStore(view("gpuStorage"), isStorageLike));
15453
15468
  }
15454
15469
  }
15455
15470
  });
@@ -15550,7 +15565,7 @@ function vectorize(inObject) {
15550
15565
  return extractTSLValue(inObject);
15551
15566
  }
15552
15567
  if (obj.isVector2 || obj.isVector3 || obj.isVector4) return inObject;
15553
- if (obj.isMatrix3 || obj.isMatrix4) return inObject;
15568
+ if (obj.isMatrix2 || obj.isMatrix3 || obj.isMatrix4) return inObject;
15554
15569
  if (obj.isColor || obj.isEuler || obj.isQuaternion || obj.isSpherical) return inObject;
15555
15570
  if ("r" in obj && "g" in obj && "b" in obj && typeof obj.r === "number" && typeof obj.g === "number" && typeof obj.b === "number") {
15556
15571
  const scale = obj.r > 1 || obj.g > 1 || obj.b > 1 ? 1 / 255 : 1;
@@ -15608,22 +15623,21 @@ function useScopedResource(options) {
15608
15623
  return entries;
15609
15624
  }
15610
15625
 
15611
- const isUniformNode$1 = (value) => value !== null && typeof value === "object" && "value" in value && "uuid" in value;
15612
15626
  function useUniforms(creatorOrScope, scope) {
15613
15627
  const store = usePrimaryStore();
15614
15628
  const removeUniforms2 = useCallback(
15615
- (names, targetScope) => removeResourceEntries(store, "uniforms", Array.isArray(names) ? names : [names], targetScope, isUniformNode$1),
15629
+ (names, targetScope) => removeResourceEntries(store, "uniforms", Array.isArray(names) ? names : [names], targetScope, isUniformNode),
15616
15630
  [store]
15617
15631
  );
15618
15632
  const clearUniforms = useCallback(
15619
- (targetScope) => clearResourceEntries(store, "uniforms", targetScope, isUniformNode$1),
15633
+ (targetScope) => clearResourceEntries(store, "uniforms", targetScope, isUniformNode),
15620
15634
  [store]
15621
15635
  );
15622
15636
  const rebuildUniforms = useCallback(
15623
15637
  (targetScope) => rebuildResource(store, "uniforms", targetScope),
15624
15638
  [store]
15625
15639
  );
15626
- const inputForMemoization = useMemo(() => {
15640
+ const processedInput = useMemo(() => {
15627
15641
  let raw = creatorOrScope;
15628
15642
  if (is.fun(creatorOrScope)) {
15629
15643
  const wrappedState = createLazyCreatorState(store.getState(), store);
@@ -15634,23 +15648,24 @@ function useUniforms(creatorOrScope, scope) {
15634
15648
  for (const [key, value] of Object.entries(raw)) {
15635
15649
  normalized[key] = vectorize(value);
15636
15650
  }
15637
- return normalized;
15651
+ return { candidates: raw, normalized };
15638
15652
  }
15639
- return raw;
15653
+ return { candidates: raw, normalized: raw };
15640
15654
  }, [creatorOrScope, store]);
15641
- const memoizedInput = useCompareMemoize(inputForMemoization);
15655
+ const memoizedInput = useCompareMemoize(processedInput.normalized);
15642
15656
  const isReader = memoizedInput === void 0 || typeof memoizedInput === "string";
15643
15657
  const storeUniforms = usePrimaryThree((s) => s.uniforms);
15644
15658
  const created = useScopedResource({
15645
15659
  store,
15646
15660
  kind: "uniforms",
15647
15661
  scope: isReader ? void 0 : scope,
15648
- isLeaf: isUniformNode$1,
15662
+ isLeaf: isUniformNode,
15649
15663
  input: memoizedInput,
15650
15664
  create: () => {
15651
15665
  if (isReader) return {};
15652
- if (typeof memoizedInput !== "object" || memoizedInput === null) throw new Error("Invalid uniform input");
15653
- return memoizedInput;
15666
+ if (typeof processedInput.candidates !== "object" || processedInput.candidates === null)
15667
+ throw new Error("Invalid uniform input");
15668
+ return processedInput.candidates;
15654
15669
  },
15655
15670
  prepare: (name, candidate) => createUniform(name, candidate, scope),
15656
15671
  reconcile: (existing, candidate) => {
@@ -15672,7 +15687,7 @@ function useUniforms(creatorOrScope, scope) {
15672
15687
  uniforms = storeUniforms;
15673
15688
  } else if (typeof memoizedInput === "string") {
15674
15689
  const scopeData = storeUniforms[memoizedInput];
15675
- uniforms = scopeData && !isUniformNode$1(scopeData) ? scopeData : {};
15690
+ uniforms = scopeData && !isUniformNode(scopeData) ? scopeData : {};
15676
15691
  }
15677
15692
  return { ...uniforms, removeUniforms: removeUniforms2, clearUniforms, rebuildUniforms };
15678
15693
  }
@@ -15687,7 +15702,7 @@ function removeUniforms(set, names, scope) {
15687
15702
  return { uniforms: { ...state.uniforms, [scope]: currentScope } };
15688
15703
  }
15689
15704
  const uniforms = { ...state.uniforms };
15690
- for (const name of names) if (isUniformNode$1(uniforms[name])) delete uniforms[name];
15705
+ for (const name of names) if (isUniformNode(uniforms[name])) delete uniforms[name];
15691
15706
  return { uniforms };
15692
15707
  });
15693
15708
  }
@@ -15701,7 +15716,7 @@ function clearRootUniforms(set) {
15701
15716
  set((state) => {
15702
15717
  const uniforms = {};
15703
15718
  for (const [key, value] of Object.entries(state.uniforms)) {
15704
- if (!isUniformNode$1(value)) uniforms[key] = value;
15719
+ if (!isUniformNode(value)) uniforms[key] = value;
15705
15720
  }
15706
15721
  return { uniforms };
15707
15722
  });
@@ -15737,12 +15752,10 @@ function hasEqualsMethod(value) {
15737
15752
  function isSameThreeType(a, b) {
15738
15753
  const obj_a = a;
15739
15754
  const obj_b = b;
15740
- return obj_a.isColor && obj_b.isColor || obj_a.isMatrix3 && obj_b.isMatrix3 || obj_a.isMatrix4 && obj_b.isMatrix4 || obj_a.isEuler && obj_b.isEuler || obj_a.isQuaternion && obj_b.isQuaternion;
15755
+ return obj_a.isColor && obj_b.isColor || obj_a.isMatrix2 && obj_b.isMatrix2 || obj_a.isMatrix3 && obj_b.isMatrix3 || obj_a.isMatrix4 && obj_b.isMatrix4 || obj_a.isEuler && obj_b.isEuler || obj_a.isQuaternion && obj_b.isQuaternion;
15741
15756
  }
15742
15757
 
15743
15758
  const uniformOf = uniform;
15744
- const isUniformNode = (value) => value !== null && typeof value === "object" && "value" in value && "uuid" in value;
15745
- const isTSLNode$1 = (value) => value !== null && typeof value === "object" && "uuid" in value && "nodeType" in value;
15746
15759
  function useUniform(name, value) {
15747
15760
  const store = useStore();
15748
15761
  const registered = useScopedResource({
@@ -15754,7 +15767,7 @@ function useUniform(name, value) {
15754
15767
  create: () => value === void 0 ? {} : { [name]: value },
15755
15768
  prepare: createNamedUniform,
15756
15769
  reconcile: (existing2) => {
15757
- if (value !== void 0 && !isTSLNode$1(value) && !isUniformNode(value)) {
15770
+ if (value !== void 0 && !isTSLNode(value) && !isUniformNode(value)) {
15758
15771
  existing2.value = typeof value === "string" ? new Color(value) : value;
15759
15772
  }
15760
15773
  }
@@ -15770,7 +15783,7 @@ function createNamedUniform(name, value) {
15770
15783
  let node;
15771
15784
  if (isUniformNode(value)) {
15772
15785
  node = value;
15773
- } else if (isTSLNode$1(value)) {
15786
+ } else if (isTSLNode(value)) {
15774
15787
  node = uniformOf(value);
15775
15788
  } else if (typeof value === "string") {
15776
15789
  node = uniform(new Color(value));
@@ -15783,7 +15796,6 @@ function createNamedUniform(name, value) {
15783
15796
  return node;
15784
15797
  }
15785
15798
 
15786
- const isTSLNode = (value) => value !== null && typeof value === "object" && ("uuid" in value || "nodeType" in value);
15787
15799
  function useNodes(creatorOrScope, scope) {
15788
15800
  const store = usePrimaryStore();
15789
15801
  const removeNodes2 = useCallback(
@@ -15810,7 +15822,8 @@ function useNodes(creatorOrScope, scope) {
15810
15822
  return creatorOrScope(createLazyCreatorState(store.getState(), store));
15811
15823
  },
15812
15824
  prepare: (name, node) => {
15813
- node.setName?.(scopedNodeName(scope, name));
15825
+ const setName = Reflect.get(node, "setName");
15826
+ if (typeof setName === "function") setName.call(node, scopedNodeName(scope, name));
15814
15827
  return node;
15815
15828
  }
15816
15829
  });
@@ -15865,13 +15878,6 @@ function useLocalNodes(creator) {
15865
15878
  }, [store, creator, uniforms, nodes, textures, hmrVersion]);
15866
15879
  }
15867
15880
 
15868
- const isBufferLike = (value) => {
15869
- if (value === null || typeof value !== "object") return false;
15870
- if (ArrayBuffer.isView(value)) return true;
15871
- if ("isBufferAttribute" in value) return true;
15872
- if ("uuid" in value || "nodeType" in value) return true;
15873
- return false;
15874
- };
15875
15881
  const disposeBuffer = (buffer) => {
15876
15882
  if (buffer === null || typeof buffer !== "object") return;
15877
15883
  if ("dispose" in buffer && typeof buffer.dispose === "function") {
@@ -15918,9 +15924,8 @@ function useBuffers(creatorOrScope, scope) {
15918
15924
  return creatorOrScope(createLazyCreatorState(store.getState(), store));
15919
15925
  },
15920
15926
  prepare: (name, buffer) => {
15921
- if ("setName" in buffer && typeof buffer.setName === "function") {
15922
- buffer.setName(scopedNodeName(scope, name));
15923
- }
15927
+ const setName = Reflect.get(buffer, "setName");
15928
+ if (typeof setName === "function") setName.call(buffer, scopedNodeName(scope, name));
15924
15929
  return buffer;
15925
15930
  }
15926
15931
  });
@@ -15937,13 +15942,6 @@ function rebuildAllBuffers(store, scope) {
15937
15942
  rebuildResource(store, "buffers", scope);
15938
15943
  }
15939
15944
 
15940
- const isStorageLike = (value) => {
15941
- if (value === null || typeof value !== "object") return false;
15942
- if ("isTexture" in value) return true;
15943
- if ("isData3DTexture" in value) return true;
15944
- if ("uuid" in value || "nodeType" in value) return true;
15945
- return false;
15946
- };
15947
15945
  const disposeStorage = (storage) => {
15948
15946
  if (storage === null || typeof storage !== "object") return;
15949
15947
  if ("dispose" in storage && typeof storage.dispose === "function") {
@@ -15991,9 +15989,8 @@ function useGPUStorage(creatorOrScope, scope) {
15991
15989
  },
15992
15990
  prepare: (name, storage) => {
15993
15991
  const label = scopedNodeName(scope, name);
15994
- if ("setName" in storage && typeof storage.setName === "function") {
15995
- storage.setName(label);
15996
- }
15992
+ const setName = Reflect.get(storage, "setName");
15993
+ if (typeof setName === "function") setName.call(storage, label);
15997
15994
  if ("name" in storage && typeof storage.name === "string") {
15998
15995
  storage.name = label;
15999
15996
  }
@@ -16042,7 +16039,7 @@ function useRenderPipeline(mainCB, setupCB) {
16042
16039
  renderPipeline: null,
16043
16040
  passes: {}
16044
16041
  });
16045
- scenePassCacheRef.current?.scenePass?.dispose?.();
16042
+ scenePassCacheRef.current?.scenePass.dispose();
16046
16043
  callbacksRanRef.current = false;
16047
16044
  scenePassCacheRef.current = null;
16048
16045
  forceScenePassRebuildRef.current = false;
@@ -16057,6 +16054,9 @@ function useRenderPipeline(mainCB, setupCB) {
16057
16054
  throw new Error("useRenderPipeline is only available with WebGPU renderer. Set renderer prop on Canvas.");
16058
16055
  }
16059
16056
  if (!renderer || !scene || !camera) return;
16057
+ if (!("isWebGPURenderer" in renderer)) {
16058
+ throw new Error("useRenderPipeline: renderer is not a WebGPURenderer but isLegacy is false.");
16059
+ }
16060
16060
  const state = store.getState();
16061
16061
  const set = store.setState;
16062
16062
  try {
@@ -16090,7 +16090,9 @@ function useRenderPipeline(mainCB, setupCB) {
16090
16090
  if (setupCBRef.current) {
16091
16091
  const freshState = Object.assign({}, store.getState(), {
16092
16092
  renderPipeline: pipeline,
16093
- passes: currentPasses
16093
+ passes: { ...currentPasses, scenePass },
16094
+ renderer,
16095
+ isLegacy: false
16094
16096
  });
16095
16097
  const setupResult = setupCBRef.current(freshState);
16096
16098
  if (setupResult && typeof setupResult === "object") {
@@ -16101,7 +16103,9 @@ function useRenderPipeline(mainCB, setupCB) {
16101
16103
  if (mainCBRef.current) {
16102
16104
  const freshState = Object.assign({}, store.getState(), {
16103
16105
  renderPipeline: pipeline,
16104
- passes: currentPasses
16106
+ passes: { ...currentPasses, scenePass },
16107
+ renderer,
16108
+ isLegacy: false
16105
16109
  });
16106
16110
  const mainResult = mainCBRef.current(freshState);
16107
16111
  if (mainResult && typeof mainResult === "object") {
@@ -16113,26 +16117,21 @@ function useRenderPipeline(mainCB, setupCB) {
16113
16117
  callbacksRanRef.current = true;
16114
16118
  }
16115
16119
  if (outputNodeChanged) pipeline.needsUpdate = true;
16116
- if (outgoingScenePass && outgoingScenePass !== scenePass) outgoingScenePass.dispose?.();
16120
+ if (outgoingScenePass && outgoingScenePass !== scenePass) outgoingScenePass.dispose();
16117
16121
  } catch (error) {
16118
16122
  console.warn("[useRenderPipeline] Setup failed; the render pipeline was not configured:", error);
16119
16123
  }
16120
16124
  }, [store, renderer, scene, camera, isLegacy, rebuildVersion]);
16121
16125
  const passes = useThree$1((s) => s.passes);
16122
16126
  const renderPipeline = useThree$1((s) => s.renderPipeline);
16123
- return {
16124
- passes,
16125
- renderPipeline,
16126
- clearPasses,
16127
- reset,
16128
- rebuild,
16129
- // isReady indicates if RenderPipeline is configured and ready for rendering
16130
- isReady: renderPipeline !== null
16131
- };
16127
+ const actions = { passes, clearPasses, reset, rebuild };
16128
+ if (renderPipeline) return { ...actions, isReady: true, renderPipeline };
16129
+ return { ...actions, isReady: false, renderPipeline: null };
16132
16130
  }
16133
16131
 
16134
16132
  extend(THREE);
16135
16133
  const useThree = useThree$1;
16136
16134
  const useFrame = useFrame$1;
16135
+ const Canvas = Canvas$1;
16137
16136
 
16138
16137
  export { Block, Canvas, Environment, EnvironmentCube, EnvironmentMap, EnvironmentPortal, ErrorBoundary, FROM_REF, IsObject, ONCE, Portal, R3F_BUILD_LEGACY, R3F_BUILD_WEBGPU, REACT_INTERNAL_PROPS, RESERVED_PROPS, Texture, _roots, addAfterEffect, addEffect, addTail, advance, applyProps, attach, buildGraph, calculateDpr, clearNodeScope, clearRootNodes, clearRootUniforms, clearScope, context, createEvents, createPointerEvents, createPortal, createRoot, createScopedStore, createStore, createTextureOperations, detach, diffProps, dispose, createPointerEvents as events, extend, findInitialRoot, flushSync, fromRef, getInstanceProps, getPrimary, getPrimaryIds, getRootState, getUuidPrefix, hasConstructor, hasPrimary, invalidate, invalidateInstance, is, isColorRepresentation, isCopyable, isFromRef, isObject3D, isOnce, isOrthographicCamera, isRef$1 as isRef, isRenderer, isTexture, isVectorLike, once, prepare, presetsObj, rebuildAllBuffers, rebuildAllNodes, rebuildAllStorage, rebuildAllUniforms, reconciler, registerPrimary, removeInteractivity, removeNodes, removeUniforms, resolve, swapInteractivity, unmountComponentAtNode, unregisterPrimary, updateCamera, updateFrustum, useBridge, useBuffers, useEnvironment, useFrame, useGPUStorage, useGraph, useInstanceHandle, useIsomorphicLayoutEffect, useLoader, useLocalNodes, useMutableCallback, useNodes, useRenderPipeline, useRenderTarget, useStore, useTexture, useTextures, useThree, useUniform, useUniforms, waitForPrimary };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@react-three/fiber",
3
- "version": "10.0.0-alpha.4",
3
+ "version": "10.0.0-alpha.5",
4
4
  "description": "A React renderer for Threejs",
5
5
  "keywords": [
6
6
  "react",