@react-three/fiber 10.0.0-canary.ba354c7 → 10.0.0-canary.c385e9f

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.
package/dist/legacy.cjs CHANGED
@@ -50,11 +50,9 @@ const Tb__default = /*#__PURE__*/_interopDefaultCompat(Tb);
50
50
 
51
51
  const R3F_BUILD_LEGACY = true;
52
52
  const R3F_BUILD_WEBGPU = false;
53
- const Inspector = class Inspector2 {
54
- constructor() {
55
- throw new Error("Inspector is not available in legacy builds. Use @react-three/fiber/webgpu instead.");
56
- }
57
- };
53
+ async function loadInspector() {
54
+ throw new Error("Inspector is not available in legacy builds. Use @react-three/fiber/webgpu instead.");
55
+ }
58
56
  const WebGPURenderer = class WebGPURenderer2 {
59
57
  constructor() {
60
58
  throw new Error("WebGPURenderer is not available in legacy builds. Use @react-three/fiber/webgpu instead.");
@@ -67,12 +65,12 @@ const THREE = /*#__PURE__*/_mergeNamespaces({
67
65
  __proto__: null,
68
66
  CubeRenderTarget: CubeRenderTarget,
69
67
  CubeRenderTargetCompat: three.WebGLCubeRenderTarget,
70
- Inspector: Inspector,
71
68
  R3F_BUILD_LEGACY: R3F_BUILD_LEGACY,
72
69
  R3F_BUILD_WEBGPU: R3F_BUILD_WEBGPU,
73
70
  RenderTarget: RenderTarget,
74
71
  RenderTargetCompat: three.WebGLRenderTarget,
75
- WebGPURenderer: WebGPURenderer
72
+ WebGPURenderer: WebGPURenderer,
73
+ loadInspector: loadInspector
76
74
  }, [three__namespace]);
77
75
 
78
76
  const primaryRegistry = /* @__PURE__ */ new Map();
@@ -931,7 +929,7 @@ const createStore = (invalidate, advance) => {
931
929
  size: newSize,
932
930
  viewport: { ...s.viewport, ...getCurrentViewport(state2.camera, defaultTarget, newSize) }
933
931
  }));
934
- scheduler.getScheduler().invalidate();
932
+ get().invalidate();
935
933
  }
936
934
  }
937
935
  return;
@@ -946,15 +944,16 @@ const createStore = (invalidate, advance) => {
946
944
  viewport: { ...s.viewport, ...getCurrentViewport(state2.camera, defaultTarget, size) },
947
945
  _sizeImperative: true
948
946
  }));
949
- scheduler.getScheduler().invalidate();
947
+ get().invalidate();
950
948
  },
951
949
  setDpr: (dpr) => set((state2) => {
952
950
  const resolved = calculateDpr(dpr);
953
951
  return { viewport: { ...state2.viewport, dpr: resolved, initialDpr: state2.viewport.initialDpr || resolved } };
954
952
  }),
955
953
  setFrameloop: (frameloop = "always") => {
954
+ const rootId = get().internal.rootId;
955
+ if (rootId) scheduler.getScheduler().setRootFrameloop(rootId, frameloop);
956
956
  set(() => ({ frameloop }));
957
- scheduler.getScheduler().frameloop = frameloop;
958
957
  },
959
958
  setError: (error) => set(() => ({ error })),
960
959
  error: null,
@@ -1070,17 +1069,10 @@ const createStore = (invalidate, advance) => {
1070
1069
  oldSize = size;
1071
1070
  oldDpr = viewport.dpr;
1072
1071
  updateCamera(camera, size);
1073
- if (internal.isSecondary && canvasTarget) {
1074
- if (viewport.dpr > 0) canvasTarget.setPixelRatio(viewport.dpr);
1075
- canvasTarget.setSize(size.width, size.height, false);
1076
- } else {
1077
- if (viewport.dpr > 0) actualRenderer.setPixelRatio(viewport.dpr);
1078
- actualRenderer.setSize(size.width, size.height, false);
1079
- if (canvasTarget) {
1080
- if (viewport.dpr > 0) canvasTarget.setPixelRatio(viewport.dpr);
1081
- canvasTarget.setSize(size.width, size.height, false);
1082
- }
1083
- }
1072
+ const resizeTarget = canvasTarget ?? actualRenderer;
1073
+ if (viewport.dpr > 0) resizeTarget.setPixelRatio(viewport.dpr);
1074
+ resizeTarget.setSize(size.width, size.height, false);
1075
+ internal.canvasTargetSizeDirty = true;
1084
1076
  }
1085
1077
  if (camera !== oldCamera) {
1086
1078
  oldCamera = camera;
@@ -1142,7 +1134,11 @@ function useLoader(loader, input, extensions, onProgress, cacheKey) {
1142
1134
  const results = cacheKeys.map(
1143
1135
  (key, index) => suspendReact.suspend(() => fn(loader, inputs[index]), [loader, key], { equal: is.equ })
1144
1136
  );
1145
- return Array.isArray(input) ? results : results[0];
1137
+ const stableRef = React.useRef(null);
1138
+ const previous = stableRef.current;
1139
+ const stable = previous !== null && previous.length === results.length && previous.every((value, i) => value === results[i]) ? previous : results;
1140
+ stableRef.current = stable;
1141
+ return Array.isArray(input) ? stable : stable[0];
1146
1142
  }
1147
1143
  useLoader.preload = function(loader, input, extensions, onProgress, cacheKey) {
1148
1144
  const inputs = Array.isArray(input) ? input : [input];
@@ -1262,6 +1258,13 @@ function useFrame(callback, priorityOrOptions) {
1262
1258
  * Use for controlling the entire frame loop, adding phases, etc.
1263
1259
  */
1264
1260
  scheduler: scheduler2,
1261
+ /**
1262
+ * The root that currently owns this job. Resolve on access because ambient
1263
+ * jobs can be adopted by a Canvas after the controls object is created.
1264
+ */
1265
+ get rootId() {
1266
+ return scheduler.getScheduler().getJobRootId(id);
1267
+ },
1265
1268
  /**
1266
1269
  * Manually step this job only.
1267
1270
  * Bypasses FPS limiting - always runs.
@@ -1278,6 +1281,14 @@ function useFrame(callback, priorityOrOptions) {
1278
1281
  stepAll: (timestamp) => {
1279
1282
  scheduler.getScheduler().step(timestamp);
1280
1283
  },
1284
+ /**
1285
+ * Request frames for this job's owning root without waking sibling roots.
1286
+ */
1287
+ invalidate: (frames, stackFrames) => {
1288
+ const scheduler3 = scheduler.getScheduler();
1289
+ const rootId = scheduler3.getJobRootId(id);
1290
+ if (rootId) scheduler3.invalidateRoot(rootId, frames, stackFrames);
1291
+ },
1281
1292
  /**
1282
1293
  * Pause this job (set enabled=false).
1283
1294
  * Job remains registered but won't run.
@@ -1307,6 +1318,11 @@ function getUrls(input) {
1307
1318
  if (Array.isArray(input)) return input;
1308
1319
  return Object.values(input);
1309
1320
  }
1321
+ function inputSignature(input) {
1322
+ if (typeof input === "string") return input;
1323
+ if (Array.isArray(input)) return input.join("\0");
1324
+ return Object.keys(input).sort().map((key) => `${key}\0${input[key]}`).join("");
1325
+ }
1310
1326
  function allUrlsCached(urls, textureCache) {
1311
1327
  return urls.every((url) => textureCache.has(url));
1312
1328
  }
@@ -1332,18 +1348,19 @@ function useTexture(input, optionsOrOnLoad) {
1332
1348
  const onLoadRef = React.useRef(onLoad);
1333
1349
  onLoadRef.current = onLoad;
1334
1350
  const onLoadCalledForRef = React.useRef(null);
1335
- const urls = React.useMemo(() => getUrls(input), [input]);
1351
+ const inputKey = React.useMemo(() => inputSignature(input), [input]);
1352
+ const stableInput = React.useMemo(() => input, [inputKey]);
1353
+ const urls = React.useMemo(() => getUrls(stableInput), [stableInput]);
1336
1354
  const cachedResult = React.useMemo(() => {
1337
1355
  if (!cache) return null;
1338
1356
  const textures = store.getState().textures;
1339
1357
  if (!allUrlsCached(urls, textures)) return null;
1340
- return buildFromCache(input, textures);
1341
- }, [cache, urls, input, store]);
1358
+ return buildFromCache(stableInput, textures);
1359
+ }, [cache, urls, stableInput, store]);
1342
1360
  const loadedTextures = useLoader(
1343
1361
  three.TextureLoader,
1344
- IsObject(input) ? Object.values(input) : input
1362
+ IsObject(stableInput) ? Object.values(stableInput) : stableInput
1345
1363
  );
1346
- const inputKey = urls.join("\0");
1347
1364
  React.useLayoutEffect(() => {
1348
1365
  if (cachedResult) return;
1349
1366
  if (onLoadCalledForRef.current === inputKey) return;
@@ -1370,28 +1387,28 @@ function useTexture(input, optionsOrOnLoad) {
1370
1387
  }, [renderer, loadedTextures, cachedResult]);
1371
1388
  const mappedTextures = React.useMemo(() => {
1372
1389
  if (cachedResult) return cachedResult;
1373
- if (IsObject(input)) {
1390
+ if (IsObject(stableInput)) {
1374
1391
  const keyed = {};
1375
1392
  const textureArray = loadedTextures;
1376
1393
  let i = 0;
1377
- for (const key in input) keyed[key] = textureArray[i++];
1394
+ for (const key in stableInput) keyed[key] = textureArray[i++];
1378
1395
  return keyed;
1379
1396
  } else {
1380
1397
  return loadedTextures;
1381
1398
  }
1382
- }, [input, loadedTextures, cachedResult]);
1399
+ }, [stableInput, loadedTextures, cachedResult]);
1383
1400
  React.useEffect(() => {
1384
1401
  if (!cache) return;
1385
1402
  const urlTextureMap = [];
1386
- if (typeof input === "string") {
1387
- urlTextureMap.push([input, mappedTextures]);
1388
- } else if (Array.isArray(input)) {
1403
+ if (typeof stableInput === "string") {
1404
+ urlTextureMap.push([stableInput, mappedTextures]);
1405
+ } else if (Array.isArray(stableInput)) {
1389
1406
  const textureArray = mappedTextures;
1390
- input.forEach((url, i) => urlTextureMap.push([url, textureArray[i]]));
1391
- } else if (IsObject(input)) {
1407
+ stableInput.forEach((url, i) => urlTextureMap.push([url, textureArray[i]]));
1408
+ } else if (IsObject(stableInput)) {
1392
1409
  const textureRecord = mappedTextures;
1393
- for (const key in input) {
1394
- const url = input[key];
1410
+ for (const key in stableInput) {
1411
+ const url = stableInput[key];
1395
1412
  urlTextureMap.push([url, textureRecord[key]]);
1396
1413
  }
1397
1414
  }
@@ -1420,7 +1437,7 @@ function useTexture(input, optionsOrOnLoad) {
1420
1437
  }
1421
1438
  return { _textureRefs: refs };
1422
1439
  });
1423
- }, [cache, input, mappedTextures, store]);
1440
+ }, [cache, stableInput, mappedTextures, store]);
1424
1441
  return mappedTextures;
1425
1442
  }
1426
1443
  useTexture.preload = (url) => useLoader.preload(three.TextureLoader, url);
@@ -1689,13 +1706,19 @@ function addTail(callback) {
1689
1706
  return scheduler.getScheduler().onIdle(callback);
1690
1707
  }
1691
1708
  function invalidate(state, frames = 1, stackFrames = false) {
1692
- scheduler.getScheduler().invalidate(frames, stackFrames);
1709
+ const rootId = state?.internal?.rootId;
1710
+ const scheduler$1 = scheduler.getScheduler();
1711
+ if (rootId) scheduler$1.invalidateRoot(rootId, frames, stackFrames);
1712
+ else scheduler$1.invalidate(frames, stackFrames);
1693
1713
  }
1694
- function advance(timestamp) {
1695
- scheduler.getScheduler().step(timestamp);
1714
+ function advance(timestamp, runGlobalEffects, state) {
1715
+ const rootId = state?.internal?.rootId;
1716
+ const scheduler$1 = scheduler.getScheduler();
1717
+ if (rootId) scheduler$1.stepRoot(rootId, timestamp);
1718
+ else scheduler$1.step(timestamp);
1696
1719
  }
1697
1720
 
1698
- const version = "10.0.0-alpha.3";
1721
+ const version = "10.0.0-alpha.4";
1699
1722
  const packageData = {
1700
1723
  version: version};
1701
1724
 
@@ -14307,7 +14330,7 @@ function createRoot(canvas) {
14307
14330
  const handleXRFrame = (timestamp, _frame) => {
14308
14331
  const state2 = store.getState();
14309
14332
  if (state2.frameloop === "never") return;
14310
- advance(timestamp);
14333
+ advance(timestamp, true, state2);
14311
14334
  };
14312
14335
  const actualRenderer = state.internal.actualRenderer;
14313
14336
  const handleSessionChange = () => {
@@ -14315,7 +14338,7 @@ function createRoot(canvas) {
14315
14338
  const renderer2 = state2.internal.actualRenderer;
14316
14339
  actualRenderer.xr.enabled = actualRenderer.xr.isPresenting;
14317
14340
  renderer2.xr.setAnimationLoop(renderer2.xr.isPresenting ? handleXRFrame : null);
14318
- if (!renderer2.xr.isPresenting) invalidate();
14341
+ if (!renderer2.xr.isPresenting) invalidate(state2);
14319
14342
  };
14320
14343
  const xr = {
14321
14344
  connect() {
@@ -14397,7 +14420,11 @@ function createRoot(canvas) {
14397
14420
  const newRootId = canvasId || scheduler$1.generateRootId();
14398
14421
  const unregisterRoot = scheduler$1.registerRoot(newRootId, {
14399
14422
  getState: () => store.getState(),
14400
- onError: (err) => store.getState().setError(err)
14423
+ onError: (err) => store.getState().setError(err),
14424
+ frameloop: store.getState().frameloop,
14425
+ before: schedulerConfig?.before,
14426
+ after: schedulerConfig?.after,
14427
+ order: schedulerConfig?.order
14401
14428
  });
14402
14429
  const unregisterCanvasTarget = scheduler$1.register(
14403
14430
  () => {
@@ -14405,6 +14432,10 @@ function createRoot(canvas) {
14405
14432
  if (state2.internal.isMultiCanvas && state2.internal.canvasTarget) {
14406
14433
  const renderer2 = state2.internal.actualRenderer;
14407
14434
  renderer2.setCanvasTarget(state2.internal.canvasTarget);
14435
+ if (state2.internal.canvasTargetSizeDirty) {
14436
+ state2.internal.canvasTargetSizeDirty = false;
14437
+ renderer2.backend?.updateSize?.();
14438
+ }
14408
14439
  }
14409
14440
  },
14410
14441
  {
@@ -14473,8 +14504,7 @@ function createRoot(canvas) {
14473
14504
  phase: "render",
14474
14505
  system: true,
14475
14506
  // Internal flag: this is a system job, not user-controlled
14476
- // Apply scheduler config for render ordering and rate limiting
14477
- ...schedulerConfig?.after && { after: schedulerConfig.after },
14507
+ // FPS throttles only the default render job; Canvas ordering belongs to the root.
14478
14508
  ...schedulerConfig?.fps && { fps: schedulerConfig.fps }
14479
14509
  }
14480
14510
  );
@@ -14493,8 +14523,21 @@ function createRoot(canvas) {
14493
14523
  scheduler: scheduler$1
14494
14524
  }
14495
14525
  }));
14526
+ } else {
14527
+ const constraintsChanged = !is.equ(schedulerConfig?.before, lastConfiguredProps.schedulerBefore, shallowLoose) || !is.equ(schedulerConfig?.after, lastConfiguredProps.schedulerAfter, shallowLoose);
14528
+ if (constraintsChanged) {
14529
+ scheduler$1.setRootConstraints(rootId, {
14530
+ before: schedulerConfig?.before,
14531
+ after: schedulerConfig?.after
14532
+ });
14533
+ }
14534
+ if (schedulerConfig?.order !== lastConfiguredProps.schedulerOrder) {
14535
+ scheduler$1.setRootOrder(rootId, schedulerConfig?.order ?? 0);
14536
+ }
14496
14537
  }
14497
- scheduler$1.frameloop = frameloop;
14538
+ lastConfiguredProps.schedulerBefore = schedulerConfig?.before;
14539
+ lastConfiguredProps.schedulerAfter = schedulerConfig?.after;
14540
+ lastConfiguredProps.schedulerOrder = schedulerConfig?.order;
14498
14541
  onCreated = onCreatedCallback;
14499
14542
  configured = true;
14500
14543
  resolve();
@@ -14536,14 +14579,19 @@ function unmountComponentAtNode(canvas, callback) {
14536
14579
  const fiber = root?.fiber;
14537
14580
  if (fiber) {
14538
14581
  const state = root?.store.getState();
14539
- if (state) state.internal.active = false;
14582
+ if (state) {
14583
+ state.internal.active = false;
14584
+ const unregisterRoot = state.internal.unregisterRoot;
14585
+ if (unregisterRoot) {
14586
+ unregisterRoot();
14587
+ state.internal.unregisterRoot = void 0;
14588
+ }
14589
+ }
14540
14590
  reconciler.updateContainer(null, fiber, null, () => {
14541
14591
  if (state) {
14542
14592
  setTimeout(() => {
14543
14593
  try {
14544
14594
  const renderer = state.internal.actualRenderer;
14545
- const unregisterRoot = state.internal.unregisterRoot;
14546
- if (unregisterRoot) unregisterRoot();
14547
14595
  const unregisterPrimary = state.internal.unregisterPrimary;
14548
14596
  if (unregisterPrimary) unregisterPrimary();
14549
14597
  const canvasTarget = state.internal.canvasTarget;
@@ -14991,9 +15039,9 @@ function CanvasImpl({
14991
15039
  React__namespace.useMemo(() => extend(THREE), []);
14992
15040
  const Bridge = useBridge();
14993
15041
  const backgroundProps = React__namespace.useMemo(() => parseBackground(background), [background]);
14994
- const hasInitialSizeRef = React__namespace.useRef(false);
15042
+ const [hasInitialSize, setHasInitialSize] = React__namespace.useState(false);
14995
15043
  const measureConfig = React__namespace.useMemo(() => {
14996
- if (!hasInitialSizeRef.current) {
15044
+ if (!hasInitialSize) {
14997
15045
  return {
14998
15046
  ...resize,
14999
15047
  scroll: resize?.scroll ?? true,
@@ -15005,7 +15053,7 @@ function CanvasImpl({
15005
15053
  debounce: { scroll: 50, resize: 0 },
15006
15054
  ...resize
15007
15055
  };
15008
- }, [resize, hasInitialSizeRef.current]);
15056
+ }, [hasInitialSize, resize]);
15009
15057
  const [containerRef, containerRect] = useMeasure__default(measureConfig);
15010
15058
  const effectiveSize = React__namespace.useMemo(() => {
15011
15059
  let w = width ?? containerRect.width;
@@ -15021,9 +15069,7 @@ function CanvasImpl({
15021
15069
  left: containerRect.left
15022
15070
  };
15023
15071
  }, [width, height, containerRect, forceEven]);
15024
- if (!hasInitialSizeRef.current && effectiveSize.width > 0 && effectiveSize.height > 0) {
15025
- hasInitialSizeRef.current = true;
15026
- }
15072
+ if (!hasInitialSize && effectiveSize.width > 0 && effectiveSize.height > 0) setHasInitialSize(true);
15027
15073
  const canvasRef = React__namespace.useRef(null);
15028
15074
  const divRef = React__namespace.useRef(null);
15029
15075
  React__namespace.useImperativeHandle(ref, () => canvasRef.current);
@@ -15137,6 +15183,7 @@ function CanvasImpl({
15137
15183
  const canvas = canvasRef.current;
15138
15184
  if (canvas) {
15139
15185
  return () => {
15186
+ if (canvas.isConnected) return;
15140
15187
  unmountComponentAtNode(canvas);
15141
15188
  root.current = null;
15142
15189
  };
package/dist/legacy.d.cts CHANGED
@@ -38,9 +38,9 @@ function _mergeNamespaces(n, m) {
38
38
  declare const R3F_BUILD_LEGACY = true;
39
39
  declare const R3F_BUILD_WEBGPU = false;
40
40
 
41
- declare const Inspector: {
42
- new (): {};
43
- };
41
+ type Inspector = never;
42
+ /** Not available on the legacy (WebGL-only) entry. */
43
+ declare function loadInspector(): Promise<never>;
44
44
  declare const WebGPURenderer: {
45
45
  new (): {};
46
46
  };
@@ -58,7 +58,8 @@ var THREE = /*#__PURE__*/_mergeNamespaces({
58
58
  R3F_BUILD_WEBGPU: R3F_BUILD_WEBGPU,
59
59
  RenderTarget: RenderTarget,
60
60
  RenderTargetCompat: WebGLRenderTarget,
61
- WebGPURenderer: WebGPURenderer
61
+ WebGPURenderer: WebGPURenderer,
62
+ loadInspector: loadInspector
62
63
  }, [THREE$1]);
63
64
 
64
65
  //* Utility Types ==============================
@@ -358,6 +359,33 @@ type BufferRecord = Record<string, BufferLike>
358
359
  */
359
360
  type BufferStore = Record<string, BufferLike | BufferRecord>
360
361
 
362
+ //* Node Types (useNodes) ========================================
363
+
364
+ /**
365
+ * Structural shape of a TSL node as stored on `state.nodes`.
366
+ *
367
+ * Deliberately minimal rather than three's nominal `Node`: in @types/three several node classes
368
+ * TSL hands back (OperatorNode, ConstNode, ...) do not extend `Node` cleanly, so a `Node` bound
369
+ * would reject values `useNodes` creators legitimately return. This is the same shape
370
+ * `useNodes` already constrains creators to (`TSLNodeLike`).
371
+ */
372
+ interface NodeLike {
373
+ uuid?: string
374
+ nodeType?: string | null
375
+ /** label method for chaining - sets the node's label and returns self */
376
+ label?: ((label: string) => NodeLike) | string
377
+ setName?: (name: string) => this
378
+ }
379
+
380
+ /** Flat record of TSL nodes (no nested scopes) */
381
+ type NodeRecord = Record<string, NodeLike>
382
+
383
+ /**
384
+ * Node store that can contain both root-level nodes and scoped node objects.
385
+ * Structure: { wobble: OperatorNode, fx: { blur: ShaderCallable } }
386
+ */
387
+ type NodeStore = Record<string, NodeLike | NodeRecord>
388
+
361
389
  //* Storage Types (useGPUStorage) ========================================
362
390
 
363
391
  /**
@@ -496,6 +524,18 @@ interface InternalState {
496
524
  * @see https://threejs.org/docs/#api/en/renderers/common/CanvasTarget
497
525
  */
498
526
  canvasTarget?: CanvasTarget
527
+ /**
528
+ * Set when this root's canvas target has been resized and the backend's cached render pass
529
+ * descriptor (which holds a depth-stencil view built once per canvas) is therefore stale.
530
+ *
531
+ * Flushed by the canvas-target job in the `start` phase, which is the only place this root's
532
+ * target is guaranteed to be the renderer's active one — `backend.updateSize()` operates on
533
+ * whatever `getCanvasTarget()` returns, so calling it from the resize subscription would
534
+ * invalidate some other canvas's descriptor instead.
535
+ *
536
+ * @see https://github.com/pmndrs/react-three-fiber/issues/3847
537
+ */
538
+ canvasTargetSizeDirty?: boolean
499
539
  /**
500
540
  * Whether multi-canvas rendering is active.
501
541
  * True when any canvas uses `renderer={{ primaryCanvas: 'id' }}` to share a renderer.
@@ -605,7 +645,7 @@ interface RootState {
605
645
  /** Global TSL uniform nodes - root-level uniforms + scoped sub-objects. Use useUniforms() hook */
606
646
  uniforms: UniformStore
607
647
  /** Global TSL nodes - root-level nodes + scoped sub-objects. Use useNodes() hook */
608
- nodes: Record<string, any>
648
+ nodes: NodeStore
609
649
  /** Global TSL buffer nodes - root-level buffers + scoped sub-objects. Use useBuffers() hook */
610
650
  buffers: BufferStore
611
651
  /** Global GPU storage (textures, etc.) - root-level storage + scoped sub-objects. Use useGPUStorage() hook */
@@ -617,7 +657,7 @@ interface RootState {
617
657
  /** WebGPU RenderPipeline instance - use useRenderPipeline() hook */
618
658
  renderPipeline: ThreeRenderPipeline | null
619
659
  /** Global TSL pass nodes for render pipeline - use useRenderPipeline() hook */
620
- passes: Record<string, any>
660
+ passes: PassRecord
621
661
  /** Internal version counter for HMR - incremented by rebuildNodes/rebuildUniforms to bust memoization */
622
662
  _hmrVersion: number
623
663
  /** Internal: whether setSize() has taken ownership of canvas dimensions */
@@ -705,12 +745,19 @@ type DefaultRendererProps = {
705
745
  */
706
746
  interface CanvasSchedulerConfig {
707
747
  /**
708
- * Render this canvas after another canvas completes.
709
- * Pass the `id` of another canvas.
748
+ * Run this Canvas root before the referenced Canvas root id(s).
749
+ */
750
+ before?: string | string[]
751
+ /**
752
+ * Run this Canvas root after the referenced Canvas root id(s).
710
753
  */
711
- after?: string
754
+ after?: string | string[]
712
755
  /**
713
- * Limit this canvas's render rate (frames per second).
756
+ * Numeric root order. Lower values run first.
757
+ */
758
+ order?: number
759
+ /**
760
+ * Limit this Canvas's default render job (frames per second).
714
761
  */
715
762
  fps?: number
716
763
  }
@@ -1158,7 +1205,33 @@ declare global {
1158
1205
  * ergonomics. The result is three's structural type, so members stay in sync with the
1159
1206
  * installed three instead of needing to be mirrored by hand.
1160
1207
  */
1161
- type UniformNode<T = unknown> = three_webgpu.UniformNode<unknown, T>
1208
+ type UniformNode<T = unknown> = three_webgpu.UniformNode<UniformNodeTypeFor<T>, T>
1209
+
1210
+ /**
1211
+ * three's node type name for a uniform value type, mirroring the `uniform()` overloads.
1212
+ * A `UniformNode<number>` is a `Node<'float'>`, so TSL math (`.mul`, `.add`, ...) accepts it.
1213
+ * Unknown or unlisted value types resolve to `unknown`, which TSL math rejects: narrow with
1214
+ * `as UniformNode<number>` (or the matching value type) at the call site.
1215
+ */
1216
+ type UniformNodeTypeFor<T> = T extends number
1217
+ ? 'float'
1218
+ : T extends boolean
1219
+ ? 'bool'
1220
+ : T extends three_webgpu.Color
1221
+ ? 'color'
1222
+ : T extends three_webgpu.Vector2
1223
+ ? 'vec2'
1224
+ : T extends three_webgpu.Vector3
1225
+ ? 'vec3'
1226
+ : T extends three_webgpu.Vector4
1227
+ ? 'vec4'
1228
+ : T extends three_webgpu.Matrix2
1229
+ ? 'mat2'
1230
+ : T extends three_webgpu.Matrix3
1231
+ ? 'mat3'
1232
+ : T extends three_webgpu.Matrix4
1233
+ ? 'mat4'
1234
+ : unknown
1162
1235
 
1163
1236
  /**
1164
1237
  * ShaderCallable - the return type of Fn()
@@ -1311,30 +1384,97 @@ declare global {
1311
1384
  */
1312
1385
  type ThreeRenderPipeline = three_webgpu.RenderPipeline
1313
1386
 
1314
- /** Pass record - stores TSL pass nodes for render pipeline */
1315
- type PassRecord = Record<string, any>
1387
+ /**
1388
+ * The pass `useRenderPipeline` creates for you: three's own `PassNode`, as returned by
1389
+ * `pass(scene, camera)` from `three/tsl`. Referenced from three so members like
1390
+ * `getTextureNode`, `setMRT` and `dispose` track the installed version.
1391
+ */
1392
+ type ScenePassNode = three_webgpu.PassNode
1393
+
1394
+ /**
1395
+ * Pass record - stores TSL pass nodes for render pipeline.
1396
+ *
1397
+ * `scenePass` is the only key the library owns. It is optional here because this is also the
1398
+ * shape of `state.passes`, which is `{}` before the pipeline exists and again after `reset()`
1399
+ * or `clearPasses()`. Inside the callbacks it is always present; see
1400
+ * {@link RenderPipelineCallbackState}.
1401
+ *
1402
+ * Every other key is user-registered, via a callback's return value. Those are TSL nodes of
1403
+ * any kind, not only passes: texture reads of an MRT attachment, effect nodes, extra
1404
+ * `pass()` instances. `Node` is the common base, so that is the bound. Narrow at the call
1405
+ * site when you need a member, e.g. `passes.velocity as TextureNode`.
1406
+ */
1407
+ interface PassRecord {
1408
+ scenePass?: ScenePassNode
1409
+ [key: string]: three_webgpu.Node
1410
+ }
1411
+
1412
+ /**
1413
+ * State passed to pipeline callbacks after the active pipeline has been created.
1414
+ *
1415
+ * `passes.scenePass` is required here: the hook installs the default scene pass before either
1416
+ * callback runs, so callbacks can use it without a guard or a cast.
1417
+ *
1418
+ * `renderer` is narrowed to `WebGPURenderer` and `isLegacy` to `false`: the hook throws under
1419
+ * the legacy renderer before either callback can run, so a callback never sees WebGL.
1420
+ */
1421
+ type RenderPipelineCallbackState = RootState & {
1422
+ renderPipeline: ThreeRenderPipeline
1423
+ passes: PassRecord & { scenePass: ScenePassNode }
1424
+ renderer: three_webgpu.WebGPURenderer
1425
+ isLegacy: false
1426
+ }
1427
+
1428
+ /**
1429
+ * What a callback may return to register entries into `state.passes`.
1430
+ *
1431
+ * `scenePass` is reserved. The hook owns that entry and its lifecycle: it caches the pass it
1432
+ * created, and `rebuild()` / `reset()` dispose that cached pass. A callback overwriting the
1433
+ * store entry would leave the store pointing at a node the hook never disposes, and the hook
1434
+ * disposing a pass nothing references. So returning it is a type error.
1435
+ */
1436
+ type RegisteredPasses = Record<string, three_webgpu.Node> & { scenePass?: never }
1316
1437
 
1317
1438
  /** Setup callback - runs first to configure MRT, create additional passes */
1318
- type RenderPipelineSetupCallback = (state: RootState) => PassRecord | void
1439
+ type RenderPipelineSetupCallback = (state: RenderPipelineCallbackState) => RegisteredPasses | void
1319
1440
 
1320
1441
  /** Main callback - runs second to configure outputNode, create effect passes */
1321
- type RenderPipelineMainCallback = (state: RootState) => PassRecord | void
1442
+ type RenderPipelineMainCallback = (state: RenderPipelineCallbackState) => RegisteredPasses | void
1322
1443
 
1323
- /** Return type for useRenderPipeline hook */
1324
- interface UseRenderPipelineReturn {
1444
+ /** The imperative half of useRenderPipeline's return value, present in every state */
1445
+ interface UseRenderPipelineActions {
1325
1446
  /** Current passes from state */
1326
1447
  passes: PassRecord
1327
- /** RenderPipeline instance (null if not initialized) */
1328
- renderPipeline: ThreeRenderPipeline | null
1329
1448
  /** Clear all passes from state */
1330
1449
  clearPasses: () => void
1331
1450
  /** Reset RenderPipeline entirely (clears PP + passes) */
1332
1451
  reset: () => void
1333
1452
  /** Re-run setup/main callbacks with current closure values */
1334
1453
  rebuild: () => void
1335
- /** True when RenderPipeline is configured and ready */
1336
- isReady: boolean
1337
1454
  }
1455
+
1456
+ /**
1457
+ * Return type for useRenderPipeline hook, discriminated on `isReady`.
1458
+ *
1459
+ * `if (isReady)` narrows `renderPipeline` to non-null, which is what the docs already tell
1460
+ * callers to check. `passes.scenePass` deliberately stays optional in the ready branch:
1461
+ * `clearPasses()` empties the record while leaving the pipeline in place.
1462
+ */
1463
+ type UseRenderPipelineReturn = UseRenderPipelineActions &
1464
+ (
1465
+ | {
1466
+ /** True when RenderPipeline is configured and ready */
1467
+ isReady: true
1468
+ /** RenderPipeline instance */
1469
+ renderPipeline: ThreeRenderPipeline
1470
+ }
1471
+ | {
1472
+ /** False until the pipeline has been created */
1473
+ isReady: false
1474
+ /** Not initialized yet, or torn down by reset() */
1475
+ renderPipeline: null
1476
+ }
1477
+ )
1338
1478
  }
1339
1479
 
1340
1480
  type MutableOrReadonlyParameters<T extends (...args: any) => any> = Parameters<T> | Readonly<Parameters<T>>
@@ -1878,7 +2018,7 @@ declare namespace useLoader {
1878
2018
  *
1879
2019
  * @param callback - Function called each frame with (state, delta). Optional if you only need scheduler access.
1880
2020
  * @param priorityOrOptions - Either a priority number (backwards compat) or options object
1881
- * @returns Controls object with step(), stepAll(), pause(), resume(), isPaused, id, scheduler
2021
+ * @returns Controls object with step(), stepAll(), invalidate(), pause(), resume(), isPaused, id, rootId, scheduler
1882
2022
  *
1883
2023
  * @example
1884
2024
  * // Simple priority (backwards compat)
@@ -2174,7 +2314,10 @@ declare function addTail(callback: GlobalRenderCallback): () => void;
2174
2314
  * Invalidates the view, requesting a frame to be rendered.
2175
2315
  * In demand mode, this triggers the scheduler to run frames.
2176
2316
  *
2177
- * @param state - Optional root state (ignored in new scheduler, kept for backwards compat)
2317
+ * With a state argument, only that root's jobs run on the requested frames; other
2318
+ * roots on 'demand' stay idle. Without one, every registered root is invalidated.
2319
+ *
2320
+ * @param state - Optional root state; targets the invalidation at that root
2178
2321
  * @param frames - Number of frames to request (default: 1)
2179
2322
  * @param stackFrames - If false, sets pendingFrames to frames. If true, adds to existing pendingFrames (default: false)
2180
2323
  *
@@ -2185,14 +2328,16 @@ declare function invalidate(state?: RootState, frames?: number, stackFrames?: bo
2185
2328
  * Advances the frameloop and runs render effects.
2186
2329
  * Useful for when manually rendering via `frameloop="never"`.
2187
2330
  *
2331
+ * With a state argument, only that root is stepped. Without one, every
2332
+ * registered root is stepped for backwards compatibility.
2333
+ *
2188
2334
  * @param timestamp - The timestamp to use for this frame
2189
2335
  * @param runGlobalEffects - Ignored (kept for backwards compat, global effects always run)
2190
- * @param state - Ignored (kept for backwards compat)
2191
- * @param frame - Ignored (kept for backwards compat)
2336
+ * @param state - Optional root state; targets the manual step at that root
2192
2337
  *
2193
2338
  * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#advance
2194
2339
  */
2195
- declare function advance(timestamp: number): void;
2340
+ declare function advance(timestamp: number, runGlobalEffects?: boolean, state?: RootState): void;
2196
2341
 
2197
2342
  /* eslint-disable @definitelytyped/no-unnecessary-generics */
2198
2343
  declare function ReactReconciler<
@@ -3747,4 +3892,4 @@ declare function isOnce(value: unknown): value is {
3747
3892
  declare function Canvas(props: CanvasProps): react_jsx_runtime.JSX.Element;
3748
3893
 
3749
3894
  export { Block, Canvas, Environment, EnvironmentCube, EnvironmentMap, EnvironmentPortal, ErrorBoundary, FROM_REF, IsObject, ONCE, Portal, R3F_BUILD_LEGACY, R3F_BUILD_WEBGPU, REACT_INTERNAL_PROPS, RESERVED_PROPS, three_d as ReactThreeFiber, Texture, _roots, addAfterEffect, addEffect, addTail, advance, applyProps, attach, buildGraph, calculateDpr, context, createEvents, createPointerEvents, createPortal, createRoot, createStore, 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, isRenderer, isTexture, isVectorLike, once, prepare, presetsObj, reconciler, registerPrimary, removeInteractivity, resolve, swapInteractivity, unmountComponentAtNode, unregisterPrimary, updateCamera, updateFrustum, useBridge, useEnvironment, useFrame, useGraph, useInstanceHandle, useIsomorphicLayoutEffect, useLoader, useMutableCallback, useRenderTarget, useStore, useTexture, useTextures, useThree, waitForPrimary };
3750
- export type { Act, Args, ArgsProp, AttachFnType, AttachType, BackgroundConfig, BackgroundProp, BaseRendererProps, Bridge, BufferLike, BufferRecord, BufferStore, Camera, CameraProps, CanvasProps, CanvasSchedulerConfig, Catalogue, Color, ColorManagementConfig, ComputeFunction, ConstructorRepresentation, DefaultGLProps, DefaultRendererProps, Disposable, DisposeOptions, DomEvent, Dpr, ElementProps, EnvironmentLoaderProps, EnvironmentProps, EquConfig, Euler, EventHandlers, EventManager, EventProps, Events, Extensions, FiberRoot, FilterFunction, FrameCallback, FrameNextCallback, FrameNextState, FrameState, Frameloop, GLProps, GLTFLike, GeometryProps, GeometryTransformProps, GlobalEffectType, GlobalRenderCallback, HostConfig, InferLoadResult, InjectState, InputLike, Instance, InstanceProps, LegacyInternalState as InternalState, Intersection, IntersectionEvent, IsAllOptional, IsOptional, Layers, LegacyInternalState, LegacyRenderer, LegacyRootState, LoaderInstance, LoaderLike, LoaderResult, MappedTextureType, MathProps, MathRepresentation, MathType, MathTypes, Matrix3, Matrix4, Mutable, MutableOrReadonlyParameters, NodeProps, NonFunctionKeys, ObjectMap, OffscreenCanvas$1 as OffscreenCanvas, Overwrite, Performance, PointerCaptureTarget, PointerState, PresetsType, PrimaryCanvasEntry, Properties, Quaternion, LegacyRenderer as R3FRenderer, RaycastableRepresentation, ReactProps, ReconcilerRoot, RenderCallback, RenderProps, RenderTargetOptions, Renderer, RendererConfigExtended, RendererFactory, RendererProps, Root, LegacyRootState as RootState, RootStore, SetBlock, Size, StorageLike, StorageRecord, StorageStore, Subscription, TSLNodeInput, TextureInput, TextureResult, ThreeCamera, ThreeElement, ThreeElements, ThreeElementsImpl, ThreeEvent, ThreeExports, ThreeToJSXElements, UnblockProps, UseTextureOptions, UseTexturesReturn, Vector2, Vector3, Vector4, VectorRepresentation, Viewport, VisibilityEntry, WebGLDefaultProps, WebGLProps, WebGLShadowConfig, XRManager, XRPointerConfig };
3895
+ export type { Act, Args, ArgsProp, AttachFnType, AttachType, BackgroundConfig, BackgroundProp, BaseRendererProps, Bridge, BufferLike, BufferRecord, BufferStore, Camera, CameraProps, CanvasProps, CanvasSchedulerConfig, Catalogue, Color, ColorManagementConfig, ComputeFunction, ConstructorRepresentation, DefaultGLProps, DefaultRendererProps, Disposable, DisposeOptions, DomEvent, Dpr, ElementProps, EnvironmentLoaderProps, EnvironmentProps, EquConfig, Euler, EventHandlers, EventManager, EventProps, Events, Extensions, FiberRoot, FilterFunction, FrameCallback, FrameNextCallback, FrameNextState, FrameState, Frameloop, GLProps, GLTFLike, GeometryProps, GeometryTransformProps, GlobalEffectType, GlobalRenderCallback, HostConfig, InferLoadResult, InjectState, InputLike, Instance, InstanceProps, LegacyInternalState as InternalState, Intersection, IntersectionEvent, IsAllOptional, IsOptional, Layers, LegacyInternalState, LegacyRenderer, LegacyRootState, LoaderInstance, LoaderLike, LoaderResult, MappedTextureType, MathProps, MathRepresentation, MathType, MathTypes, Matrix3, Matrix4, Mutable, MutableOrReadonlyParameters, NodeLike, NodeProps, NodeRecord, NodeStore, NonFunctionKeys, ObjectMap, OffscreenCanvas$1 as OffscreenCanvas, Overwrite, Performance, PointerCaptureTarget, PointerState, PresetsType, PrimaryCanvasEntry, Properties, Quaternion, LegacyRenderer as R3FRenderer, RaycastableRepresentation, ReactProps, ReconcilerRoot, RenderCallback, RenderProps, RenderTargetOptions, Renderer, RendererConfigExtended, RendererFactory, RendererProps, Root, LegacyRootState as RootState, RootStore, SetBlock, Size, StorageLike, StorageRecord, StorageStore, Subscription, TSLNodeInput, TextureInput, TextureResult, ThreeCamera, ThreeElement, ThreeElements, ThreeElementsImpl, ThreeEvent, ThreeExports, ThreeToJSXElements, UnblockProps, UseTextureOptions, UseTexturesReturn, Vector2, Vector3, Vector4, VectorRepresentation, Viewport, VisibilityEntry, WebGLDefaultProps, WebGLProps, WebGLShadowConfig, XRManager, XRPointerConfig };