@react-three/fiber 10.0.0-canary.aecbafb → 10.0.0-canary.b6c54f2

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/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as webgpu from 'three/webgpu';
2
- import { RenderTarget, CubeReflectionMapping, EquirectangularReflectionMapping, CubeTextureLoader, Scene, WebGLCubeRenderTarget, HalfFloatType, Color, Frustum, Matrix4, Group, BoxGeometry, MeshBasicNodeMaterial, Mesh, Node, NodeUpdateType, Layers, SRGBColorSpace, RGBAFormat, UnsignedByteType, Vector3, Vector2, TextureLoader, Texture as Texture$1, CanvasTarget, Raycaster, OrthographicCamera, PerspectiveCamera, PCFSoftShadowMap, VSMShadowMap, PCFShadowMap, BasicShadowMap, ACESFilmicToneMapping, WebGPURenderer } from 'three/webgpu';
3
- import { WebGLRenderTarget, WebGLRenderer } from 'three';
2
+ import { CubeRenderTarget, RenderTarget, CubeReflectionMapping, EquirectangularReflectionMapping, CubeTextureLoader, Scene, HalfFloatType, Color, Frustum, Matrix4, Group, BoxGeometry, MeshBasicNodeMaterial, Mesh, Node, NodeUpdateType, Layers, ShaderMaterial, Uniform, SRGBColorSpace, RGBAFormat, UnsignedByteType, Vector3, Vector2, TextureLoader, Texture as Texture$1, CanvasTarget, Raycaster, OrthographicCamera, PerspectiveCamera, PCFShadowMap, VSMShadowMap, BasicShadowMap, ACESFilmicToneMapping, WebGPURenderer } from 'three/webgpu';
3
+ import { WebGLCubeRenderTarget, WebGLRenderTarget, WebGLRenderer } from 'three';
4
4
  import { Inspector } from 'three/addons/inspector/Inspector.js';
5
5
  import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
6
6
  import * as React from 'react';
@@ -15,6 +15,8 @@ import { UltraHDRLoader } from 'three/examples/jsm/loaders/UltraHDRLoader.js';
15
15
  import { GainMapLoader } from '@monogrid/gainmap-js';
16
16
  import Tb, { unstable_scheduleCallback, unstable_IdlePriority } from 'scheduler';
17
17
  import { createWithEqualityFn } from 'zustand/traditional';
18
+ import { getScheduler } from '@pmndrs/scheduler';
19
+ export { Scheduler, getScheduler } from '@pmndrs/scheduler';
18
20
  import { suspend, preload, clear } from 'suspend-react';
19
21
 
20
22
  function _mergeNamespaces(n, m) {
@@ -34,10 +36,13 @@ const R3F_BUILD_WEBGPU = true;
34
36
 
35
37
  const THREE = /*#__PURE__*/_mergeNamespaces({
36
38
  __proto__: null,
39
+ CubeRenderTarget: CubeRenderTarget,
40
+ CubeRenderTargetCompat: CubeRenderTarget,
37
41
  Inspector: Inspector,
38
42
  R3F_BUILD_LEGACY: R3F_BUILD_LEGACY,
39
43
  R3F_BUILD_WEBGPU: R3F_BUILD_WEBGPU,
40
44
  RenderTargetCompat: RenderTarget,
45
+ WebGLCubeRenderTarget: WebGLCubeRenderTarget,
41
46
  WebGLRenderTarget: WebGLRenderTarget,
42
47
  WebGLRenderer: WebGLRenderer
43
48
  }, [webgpu]);
@@ -139,7 +144,7 @@ function useEnvironment({
139
144
  useLoader$1.clear(loader, multiFile ? [files] : files);
140
145
  }
141
146
  renderer.domElement.addEventListener("webglcontextlost", clearGainmapTexture, { once: true });
142
- }, [files, renderer.domElement]);
147
+ }, [extension, files, loader, multiFile, renderer.domElement]);
143
148
  const loaderResult = useLoader$1(
144
149
  loader,
145
150
  multiFile ? [files] : files,
@@ -311,15 +316,16 @@ function EnvironmentPortal({
311
316
  preset = void 0,
312
317
  extensions
313
318
  }) {
314
- const gl = useThree$1((state) => state.gl);
319
+ const renderer = useThree$1((state) => state.renderer);
320
+ const isLegacy = useThree$1((state) => state.isLegacy);
315
321
  const defaultScene = useThree$1((state) => state.scene);
316
322
  const camera = React.useRef(null);
317
323
  const [virtualScene] = React.useState(() => new Scene());
318
324
  const fbo = React.useMemo(() => {
319
- const fbo2 = new WebGLCubeRenderTarget(resolution);
325
+ const fbo2 = isLegacy ? new WebGLCubeRenderTarget(resolution) : new CubeRenderTarget(resolution);
320
326
  fbo2.texture.type = HalfFloatType;
321
327
  return fbo2;
322
- }, [resolution]);
328
+ }, [resolution, isLegacy]);
323
329
  React.useEffect(() => {
324
330
  return () => {
325
331
  fbo.dispose();
@@ -327,10 +333,10 @@ function EnvironmentPortal({
327
333
  }, [fbo]);
328
334
  React.useLayoutEffect(() => {
329
335
  if (frames === 1) {
330
- const autoClear = gl.autoClear;
331
- gl.autoClear = true;
332
- camera.current.update(gl, virtualScene);
333
- gl.autoClear = autoClear;
336
+ const autoClear = renderer.autoClear;
337
+ renderer.autoClear = true;
338
+ camera.current.update(renderer, virtualScene);
339
+ renderer.autoClear = autoClear;
334
340
  }
335
341
  return setEnvProps(background, scene, defaultScene, fbo.texture, {
336
342
  backgroundBlurriness: blur ?? backgroundBlurriness,
@@ -339,14 +345,29 @@ function EnvironmentPortal({
339
345
  environmentIntensity,
340
346
  environmentRotation
341
347
  });
342
- }, [children, virtualScene, fbo.texture, scene, defaultScene, background, frames, gl]);
348
+ }, [
349
+ children,
350
+ virtualScene,
351
+ fbo.texture,
352
+ scene,
353
+ defaultScene,
354
+ background,
355
+ frames,
356
+ renderer,
357
+ blur,
358
+ backgroundBlurriness,
359
+ backgroundIntensity,
360
+ backgroundRotation,
361
+ environmentIntensity,
362
+ environmentRotation
363
+ ]);
343
364
  let count = 1;
344
365
  useFrame$1(() => {
345
366
  if (frames === Infinity || count < frames) {
346
- const autoClear = gl.autoClear;
347
- gl.autoClear = true;
348
- camera.current.update(gl, virtualScene);
349
- gl.autoClear = autoClear;
367
+ const autoClear = renderer.autoClear;
368
+ renderer.autoClear = true;
369
+ camera.current.update(renderer, virtualScene);
370
+ renderer.autoClear = autoClear;
350
371
  count++;
351
372
  }
352
373
  });
@@ -410,9 +431,9 @@ function Environment(props) {
410
431
  return props.ground ? /* @__PURE__ */ jsx(EnvironmentGround, { ...props }) : props.map ? /* @__PURE__ */ jsx(EnvironmentMap, { ...props }) : props.children ? /* @__PURE__ */ jsx(EnvironmentPortal, { ...props }) : /* @__PURE__ */ jsx(EnvironmentCube, { ...props });
411
432
  }
412
433
 
413
- var __defProp$2 = Object.defineProperty;
414
- var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
415
- var __publicField$2 = (obj, key, value) => __defNormalProp$2(obj, typeof key !== "symbol" ? key + "" : key, value);
434
+ var __defProp = Object.defineProperty;
435
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
436
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
416
437
  const act = React["act"];
417
438
  const useIsomorphicLayoutEffect = /* @__PURE__ */ (() => typeof window !== "undefined" && (window.document?.createElement || window.navigator?.product === "ReactNative"))() ? React.useLayoutEffect : React.useEffect;
418
439
  function useMutableCallback(fn) {
@@ -444,7 +465,7 @@ const ErrorBoundary = /* @__PURE__ */ (() => {
444
465
  return _a = class extends React.Component {
445
466
  constructor() {
446
467
  super(...arguments);
447
- __publicField$2(this, "state", { error: false });
468
+ __publicField(this, "state", { error: false });
448
469
  }
449
470
  componentDidCatch(err) {
450
471
  this.props.set(err);
@@ -452,7 +473,7 @@ const ErrorBoundary = /* @__PURE__ */ (() => {
452
473
  render() {
453
474
  return this.state.error ? null : this.props.children;
454
475
  }
455
- }, __publicField$2(_a, "getDerivedStateFromError", () => ({ error: true })), _a;
476
+ }, __publicField(_a, "getDerivedStateFromError", () => ({ error: true })), _a;
456
477
  })();
457
478
 
458
479
  const is = {
@@ -589,8 +610,7 @@ function prepare(target, root, type, props) {
589
610
  object,
590
611
  eventCount: 0,
591
612
  handlers: {},
592
- isHidden: false,
593
- deferredRefs: []
613
+ isHidden: false
594
614
  };
595
615
  if (object) object.__r3f = instance;
596
616
  }
@@ -747,6 +767,17 @@ function unregisterVisibility(store, object) {
747
767
  internal.visibilityRegistry.delete(object.uuid);
748
768
  internal.occlusionCache.delete(object);
749
769
  }
770
+ function updateVisibilityHandlers(store, object, handlers) {
771
+ const { internal } = store.getState();
772
+ const entry = internal.visibilityRegistry.get(object.uuid);
773
+ if (!entry) return false;
774
+ entry.handlers = handlers;
775
+ if ((handlers.onOccluded || handlers.onVisible) && !internal.occlusionEnabled) {
776
+ object.occlusionTest = true;
777
+ enableOcclusion(store);
778
+ }
779
+ return true;
780
+ }
750
781
  function checkVisibility(state) {
751
782
  const { internal, camera } = state;
752
783
  const registry = internal.visibilityRegistry;
@@ -934,10 +965,7 @@ function applyProps(object, props) {
934
965
  continue;
935
966
  }
936
967
  if (value === void 0) continue;
937
- if (isFromRef(value)) {
938
- instance?.deferredRefs?.push({ prop, ref: value[FROM_REF] });
939
- continue;
940
- }
968
+ if (isFromRef(value)) continue;
941
969
  if (isOnce(value)) {
942
970
  if (instance?.appliedOnce?.has(prop)) continue;
943
971
  if (instance) {
@@ -973,6 +1001,19 @@ function applyProps(object, props) {
973
1001
  } else if (isVectorLike(target) && is.num(value)) {
974
1002
  if ("setScalar" in target && typeof target.setScalar === "function") target.setScalar(value);
975
1003
  else target.set(value);
1004
+ } else if (root instanceof ShaderMaterial && key === "uniforms" && is.obj(value)) {
1005
+ if (!is.obj(root.uniforms)) root.uniforms = {};
1006
+ const uniforms = root.uniforms;
1007
+ const nextUniforms = value;
1008
+ for (const name in nextUniforms) {
1009
+ const uniform = nextUniforms[name];
1010
+ const targetUniform = uniforms[name];
1011
+ if (targetUniform) Object.assign(targetUniform, uniform);
1012
+ else {
1013
+ const nextUniform = uniform instanceof Uniform ? uniform.clone() : new Uniform(uniform.value);
1014
+ uniforms[name] = nextUniform;
1015
+ }
1016
+ }
976
1017
  } else {
977
1018
  root[key] = value;
978
1019
  if (key.endsWith("Node") && root.isMaterial) {
@@ -991,6 +1032,9 @@ function applyProps(object, props) {
991
1032
  if (instance.eventCount && object2.raycast !== null) {
992
1033
  rootState.internal.interaction.push(object2);
993
1034
  }
1035
+ }
1036
+ if (instance?.parent && rootState?.internal && instance.object?.isObject3D) {
1037
+ const object2 = instance.object;
994
1038
  const root = findInitialRoot(instance);
995
1039
  const visibilityHandlers = {
996
1040
  onFramed: instance.handlers.onFramed,
@@ -998,7 +1042,9 @@ function applyProps(object, props) {
998
1042
  onVisible: instance.handlers.onVisible
999
1043
  };
1000
1044
  if (hasVisibilityHandlers(visibilityHandlers)) {
1001
- registerVisibility(root, object2, visibilityHandlers);
1045
+ if (!updateVisibilityHandlers(root, object2, visibilityHandlers)) {
1046
+ registerVisibility(root, object2, visibilityHandlers);
1047
+ }
1002
1048
  } else {
1003
1049
  unregisterVisibility(root, object2);
1004
1050
  }
@@ -1266,7 +1312,7 @@ function createEvents(store) {
1266
1312
  }
1267
1313
  function processDeferredPointer(event, pointerId) {
1268
1314
  const state = store.getState();
1269
- const { onPointerMissed, onDragOverMissed, internal } = state;
1315
+ const { internal } = state;
1270
1316
  if (!state.events.enabled) return;
1271
1317
  const filter = filterPointerEvents;
1272
1318
  const hits = intersect(event, filter);
@@ -1501,6 +1547,7 @@ function createPointerEvents(store) {
1501
1547
  }
1502
1548
  },
1503
1549
  connect: (target) => {
1550
+ if (!target) return;
1504
1551
  const { set, events } = store.getState();
1505
1552
  events.disconnect?.();
1506
1553
  set((state) => ({ events: { ...state.events, connected: target } }));
@@ -1525,6 +1572,7 @@ function createPointerEvents(store) {
1525
1572
  set((state) => ({ events: { ...state.events, connected: void 0 } }));
1526
1573
  }
1527
1574
  },
1575
+ // PREVIEW (A8): the XR pointer registration API may change before stable.
1528
1576
  registerPointer: (config) => {
1529
1577
  const pointerId = nextXRPointerId++;
1530
1578
  xrPointers.set(pointerId, config);
@@ -1611,1036 +1659,11 @@ function notifyAlpha({ message, link }) {
1611
1659
  }
1612
1660
  }
1613
1661
 
1614
- var __defProp$1 = Object.defineProperty;
1615
- var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1616
- var __publicField$1 = (obj, key, value) => __defNormalProp$1(obj, typeof key !== "symbol" ? key + "" : key, value);
1617
- const DEFAULT_PHASES = ["start", "input", "physics", "update", "render", "finish"];
1618
- class PhaseGraph {
1619
- constructor() {
1620
- /** Ordered list of phase nodes */
1621
- __publicField$1(this, "phases", []);
1622
- /** Quick lookup by name */
1623
- __publicField$1(this, "phaseMap", /* @__PURE__ */ new Map());
1624
- /** Cached ordered names (invalidated on changes) */
1625
- __publicField$1(this, "orderedNamesCache", null);
1626
- this.initializeDefaultPhases();
1627
- }
1628
- //* Initialization --------------------------------
1629
- initializeDefaultPhases() {
1630
- for (const name of DEFAULT_PHASES) {
1631
- const node = { name, isAutoGenerated: false };
1632
- this.phases.push(node);
1633
- this.phaseMap.set(name, node);
1634
- }
1635
- this.invalidateCache();
1636
- }
1637
- //* Public API --------------------------------
1638
- /**
1639
- * Add a named phase to the graph
1640
- * @param name - Phase name (must be unique)
1641
- * @param options - Position options (before or after another phase)
1642
- */
1643
- addPhase(name, options = {}) {
1644
- if (this.phaseMap.has(name)) {
1645
- console.warn(`[useFrame] Phase "${name}" already exists`);
1646
- return;
1647
- }
1648
- const { before, after } = options;
1649
- const node = { name, isAutoGenerated: false };
1650
- let insertIndex = this.phases.length;
1651
- const targetIndex = this.getPhaseIndex(before ?? after);
1652
- if (targetIndex !== -1) {
1653
- insertIndex = before ? targetIndex : targetIndex + 1;
1654
- } else {
1655
- const constraintType = before ? "before" : "after";
1656
- console.warn(`[useFrame] Phase "${before ?? after}" not found for '${constraintType}' constraint`);
1657
- }
1658
- this.phases.splice(insertIndex, 0, node);
1659
- this.phaseMap.set(name, node);
1660
- this.invalidateCache();
1661
- }
1662
- /**
1663
- * Get ordered list of phase names
1664
- */
1665
- getOrderedPhases() {
1666
- if (this.orderedNamesCache === null) this.orderedNamesCache = this.phases.map((p) => p.name);
1667
- return this.orderedNamesCache;
1668
- }
1669
- /**
1670
- * Check if a phase exists
1671
- */
1672
- hasPhase(name) {
1673
- return this.phaseMap.has(name);
1674
- }
1675
- /**
1676
- * Get the index of a phase (-1 if not found)
1677
- */
1678
- getPhaseIndex(name) {
1679
- if (!name) return -1;
1680
- return this.phases.findIndex((p) => p.name === name);
1681
- }
1682
- /**
1683
- * Ensure a phase exists, creating an auto-generated one if needed.
1684
- * Used for resolving before/after constraints.
1685
- *
1686
- * @param name - The phase name to ensure exists
1687
- * @returns The phase name (may be auto-generated like 'before:render')
1688
- */
1689
- ensurePhase(name) {
1690
- if (this.phaseMap.has(name)) return name;
1691
- const node = { name, isAutoGenerated: true };
1692
- this.phases.push(node);
1693
- this.phaseMap.set(name, node);
1694
- this.invalidateCache();
1695
- return name;
1696
- }
1697
- /**
1698
- * Resolve where a job with before/after constraints should go.
1699
- * Creates auto-generated phases if needed.
1700
- *
1701
- * @param before - Phase(s) to run before
1702
- * @param after - Phase(s) to run after
1703
- * @returns The resolved phase name
1704
- */
1705
- resolveConstraintPhase(before, after) {
1706
- const beforeArr = before ? Array.isArray(before) ? before : [before] : [];
1707
- const afterArr = after ? Array.isArray(after) ? after : [after] : [];
1708
- if (beforeArr.length > 0) {
1709
- return this.ensureAutoPhase(beforeArr[0], "before", 0);
1710
- }
1711
- if (afterArr.length > 0) {
1712
- return this.ensureAutoPhase(afterArr[0], "after", 1);
1713
- }
1714
- return "update";
1715
- }
1716
- /**
1717
- * Ensure an auto-generated phase exists relative to a target phase.
1718
- * Creates the phase if it doesn't exist, inserting it at the correct position.
1719
- *
1720
- * @param target - The target phase name to position relative to
1721
- * @param prefix - Prefix for auto-generated phase name ('before' or 'after')
1722
- * @param offset - Insertion offset (0 for before, 1 for after)
1723
- * @returns The auto-generated phase name
1724
- */
1725
- ensureAutoPhase(target, prefix, offset) {
1726
- const autoName = `${prefix}:${target}`;
1727
- if (this.phaseMap.has(autoName)) return autoName;
1728
- const node = { name: autoName, isAutoGenerated: true };
1729
- const targetIndex = this.getPhaseIndex(target);
1730
- if (targetIndex !== -1) this.phases.splice(targetIndex + offset, 0, node);
1731
- else this.phases.push(node);
1732
- this.phaseMap.set(autoName, node);
1733
- this.invalidateCache();
1734
- return autoName;
1735
- }
1736
- // Internal --------------------------------
1737
- invalidateCache() {
1738
- this.orderedNamesCache = null;
1739
- }
1740
- }
1741
-
1742
- function rebuildSortedJobs(jobs, phaseGraph) {
1743
- const orderedPhases = phaseGraph.getOrderedPhases();
1744
- const buckets = /* @__PURE__ */ new Map();
1745
- for (const phase of orderedPhases) {
1746
- buckets.set(phase, []);
1747
- }
1748
- for (const job of jobs.values()) {
1749
- if (!job.enabled) continue;
1750
- let bucket = buckets.get(job.phase);
1751
- if (!bucket) {
1752
- bucket = [];
1753
- buckets.set(job.phase, bucket);
1754
- }
1755
- bucket.push(job);
1756
- }
1757
- const sortedBuckets = [];
1758
- for (const phase of orderedPhases) {
1759
- const bucket = buckets.get(phase);
1760
- if (!bucket || bucket.length === 0) continue;
1761
- bucket.sort((a, b) => {
1762
- if (a.priority !== b.priority) return b.priority - a.priority;
1763
- return a.index - b.index;
1764
- });
1765
- sortedBuckets.push(hasCrossJobConstraints(bucket) ? topologicalSort(bucket) : bucket);
1766
- }
1767
- for (const [phase, bucket] of buckets) {
1768
- if (!orderedPhases.includes(phase) && bucket.length > 0) {
1769
- bucket.sort((a, b) => {
1770
- if (a.priority !== b.priority) return b.priority - a.priority;
1771
- return a.index - b.index;
1772
- });
1773
- sortedBuckets.push(bucket);
1774
- }
1775
- }
1776
- return sortedBuckets.flat();
1777
- }
1778
- function hasCrossJobConstraints(bucket) {
1779
- const jobIds = new Set(bucket.map((j) => j.id));
1780
- for (const job of bucket) {
1781
- for (const ref of job.before) {
1782
- if (jobIds.has(ref)) return true;
1783
- }
1784
- for (const ref of job.after) {
1785
- if (jobIds.has(ref)) return true;
1786
- }
1787
- }
1788
- return false;
1789
- }
1790
- function topologicalSort(jobs) {
1791
- const n = jobs.length;
1792
- if (n <= 1) return jobs;
1793
- const jobMap = /* @__PURE__ */ new Map();
1794
- const inDegree = /* @__PURE__ */ new Map();
1795
- const adjacency = /* @__PURE__ */ new Map();
1796
- for (const job of jobs) {
1797
- jobMap.set(job.id, job);
1798
- inDegree.set(job.id, 0);
1799
- adjacency.set(job.id, []);
1800
- }
1801
- for (const job of jobs) {
1802
- for (const ref of job.before) {
1803
- if (jobMap.has(ref)) {
1804
- adjacency.get(job.id).push(ref);
1805
- inDegree.set(ref, inDegree.get(ref) + 1);
1806
- }
1807
- }
1808
- for (const ref of job.after) {
1809
- if (jobMap.has(ref)) {
1810
- adjacency.get(ref).push(job.id);
1811
- inDegree.set(job.id, inDegree.get(job.id) + 1);
1812
- }
1813
- }
1814
- }
1815
- const queue = [];
1816
- for (const job of jobs) {
1817
- if (inDegree.get(job.id) === 0) {
1818
- queue.push(job);
1819
- }
1820
- }
1821
- queue.sort((a, b) => {
1822
- if (a.priority !== b.priority) return b.priority - a.priority;
1823
- return a.index - b.index;
1824
- });
1825
- const result = [];
1826
- while (queue.length > 0) {
1827
- const job = queue.shift();
1828
- result.push(job);
1829
- const neighbors = adjacency.get(job.id) || [];
1830
- for (const neighborId of neighbors) {
1831
- const newDegree = inDegree.get(neighborId) - 1;
1832
- inDegree.set(neighborId, newDegree);
1833
- if (newDegree === 0) {
1834
- const neighbor = jobMap.get(neighborId);
1835
- insertSorted(queue, neighbor);
1836
- }
1837
- }
1838
- }
1839
- if (result.length !== n) {
1840
- console.warn("[useFrame] Circular dependency detected in job constraints");
1841
- const resultIds = new Set(result.map((j) => j.id));
1842
- for (const job of jobs) {
1843
- if (!resultIds.has(job.id)) result.push(job);
1844
- }
1845
- }
1846
- return result;
1847
- }
1848
- function insertSorted(arr, job) {
1849
- let i = 0;
1850
- while (i < arr.length) {
1851
- const cmp = arr[i];
1852
- if (job.priority > cmp.priority || job.priority === cmp.priority && job.index < cmp.index) {
1853
- break;
1854
- }
1855
- i++;
1856
- }
1857
- arr.splice(i, 0, job);
1858
- }
1859
-
1860
- function shouldRun(job, now) {
1861
- if (!job.enabled) return false;
1862
- if (!job.fps) return true;
1863
- const minInterval = 1e3 / job.fps;
1864
- const lastRun = job.lastRun ?? 0;
1865
- const elapsed = now - lastRun;
1866
- if (elapsed < minInterval) return false;
1867
- if (job.drop) {
1868
- job.lastRun = now;
1869
- } else {
1870
- const steps = Math.floor(elapsed / minInterval);
1871
- job.lastRun = lastRun + steps * minInterval;
1872
- if (job.lastRun < now - minInterval) {
1873
- job.lastRun = now;
1874
- }
1875
- }
1876
- return true;
1877
- }
1878
- function resetJobTiming(job) {
1879
- job.lastRun = void 0;
1880
- }
1881
-
1882
- var __defProp = Object.defineProperty;
1883
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1884
- var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
1885
- const hmrData = (() => {
1886
- if (typeof process !== "undefined" && process.env.NODE_ENV === "test") return void 0;
1887
- if (typeof import_meta_hot !== "undefined") return import_meta_hot;
1888
- try {
1889
- return (0, eval)("import.meta.hot");
1890
- } catch {
1891
- return void 0;
1892
- }
1893
- })();
1894
- const _Scheduler = class _Scheduler {
1895
- //* Constructor ================================
1896
- constructor() {
1897
- //* Critical State ================================
1898
- __publicField(this, "roots", /* @__PURE__ */ new Map());
1899
- __publicField(this, "phaseGraph");
1900
- __publicField(this, "loopState", {
1901
- running: false,
1902
- rafHandle: null,
1903
- lastTime: null,
1904
- // null = uninitialized, 0+ = valid timestamp
1905
- frameCount: 0,
1906
- elapsedTime: 0,
1907
- createdAt: performance.now()
1908
- });
1909
- __publicField(this, "stoppedTime", 0);
1910
- //* Private State ================================
1911
- __publicField(this, "nextRootIndex", 0);
1912
- __publicField(this, "globalBeforeJobs", /* @__PURE__ */ new Map());
1913
- __publicField(this, "globalAfterJobs", /* @__PURE__ */ new Map());
1914
- __publicField(this, "nextGlobalIndex", 0);
1915
- __publicField(this, "idleCallbacks", /* @__PURE__ */ new Set());
1916
- __publicField(this, "nextJobIndex", 0);
1917
- __publicField(this, "jobStateListeners", /* @__PURE__ */ new Map());
1918
- __publicField(this, "pendingFrames", 0);
1919
- __publicField(this, "_frameloop", "always");
1920
- //* Independent Mode & Error Handling State ================================
1921
- __publicField(this, "_independent", false);
1922
- __publicField(this, "errorHandler", null);
1923
- __publicField(this, "rootReadyCallbacks", /* @__PURE__ */ new Set());
1924
- //* Core Loop Execution Methods ================================
1925
- /**
1926
- * Main RAF loop callback.
1927
- * Executes frame, handles demand mode, and schedules next frame.
1928
- * @param {number} timestamp - RAF timestamp in milliseconds
1929
- * @returns {void}
1930
- * @private
1931
- */
1932
- __publicField(this, "loop", (timestamp) => {
1933
- if (!this.loopState.running) return;
1934
- this.executeFrame(timestamp);
1935
- if (this._frameloop === "demand") {
1936
- this.pendingFrames = Math.max(0, this.pendingFrames - 1);
1937
- if (this.pendingFrames === 0) {
1938
- this.notifyIdle(timestamp);
1939
- return this.stop();
1940
- }
1941
- }
1942
- this.loopState.rafHandle = requestAnimationFrame(this.loop);
1943
- });
1944
- this.phaseGraph = new PhaseGraph();
1945
- }
1946
- static get instance() {
1947
- return globalThis[_Scheduler.INSTANCE_KEY] ?? null;
1948
- }
1949
- static set instance(value) {
1950
- globalThis[_Scheduler.INSTANCE_KEY] = value;
1951
- }
1952
- /**
1953
- * Get the global scheduler instance (creates if doesn't exist).
1954
- * Uses HMR data to preserve instance across hot reloads.
1955
- * @returns {Scheduler} The singleton scheduler instance
1956
- */
1957
- static get() {
1958
- if (!_Scheduler.instance && hmrData?.data?.scheduler) {
1959
- _Scheduler.instance = hmrData.data.scheduler;
1960
- }
1961
- if (!_Scheduler.instance) {
1962
- _Scheduler.instance = new _Scheduler();
1963
- if (hmrData?.data) {
1964
- hmrData.data.scheduler = _Scheduler.instance;
1965
- }
1966
- }
1967
- return _Scheduler.instance;
1968
- }
1969
- /**
1970
- * Reset the singleton instance. Stops the loop and clears all state.
1971
- * Primarily used for testing to ensure clean state between tests.
1972
- * @returns {void}
1973
- */
1974
- static reset() {
1975
- if (_Scheduler.instance) {
1976
- _Scheduler.instance.stop();
1977
- _Scheduler.instance = null;
1978
- }
1979
- if (hmrData?.data) {
1980
- hmrData.data.scheduler = null;
1981
- }
1982
- }
1983
- //* Getters & Setters ================================
1984
- get phases() {
1985
- return this.phaseGraph.getOrderedPhases();
1986
- }
1987
- get frameloop() {
1988
- return this._frameloop;
1989
- }
1990
- set frameloop(mode) {
1991
- if (this._frameloop === mode) return;
1992
- const wasAlways = this._frameloop === "always";
1993
- this._frameloop = mode;
1994
- if (mode === "always" && !this.loopState.running && this.roots.size > 0) this.start();
1995
- else if (mode !== "always" && wasAlways) this.stop();
1996
- }
1997
- get isRunning() {
1998
- return this.loopState.running;
1999
- }
2000
- get isReady() {
2001
- return this.roots.size > 0;
2002
- }
2003
- get independent() {
2004
- return this._independent;
2005
- }
2006
- set independent(value) {
2007
- this._independent = value;
2008
- if (value) this.ensureDefaultRoot();
2009
- }
2010
- //* Root Management Methods ================================
2011
- /**
2012
- * Register a root (Canvas) with the scheduler.
2013
- * The first root to register starts the RAF loop (if frameloop='always').
2014
- * @param {string} id - Unique identifier for this root
2015
- * @param {RootOptions} [options] - Optional configuration with getState and onError callbacks
2016
- * @returns {() => void} Unsubscribe function to remove this root
2017
- */
2018
- registerRoot(id, options = {}) {
2019
- if (this.roots.has(id)) {
2020
- console.warn(`[Scheduler] Root "${id}" already registered`);
2021
- return () => this.unregisterRoot(id);
2022
- }
2023
- const entry = {
2024
- id,
2025
- getState: options.getState ?? (() => ({})),
2026
- jobs: /* @__PURE__ */ new Map(),
2027
- sortedJobs: [],
2028
- needsRebuild: false
2029
- };
2030
- if (options.onError) {
2031
- this.errorHandler = options.onError;
2032
- }
2033
- this.roots.set(id, entry);
2034
- if (this.roots.size === 1) {
2035
- this.notifyRootReady();
2036
- if (this._frameloop === "always") this.start();
2037
- }
2038
- return () => this.unregisterRoot(id);
2039
- }
2040
- /**
2041
- * Unregister a root from the scheduler.
2042
- * Cleans up all job state listeners for this root's jobs.
2043
- * The last root to unregister stops the RAF loop.
2044
- * @param {string} id - The root ID to unregister
2045
- * @returns {void}
2046
- */
2047
- unregisterRoot(id) {
2048
- const root = this.roots.get(id);
2049
- if (!root) return;
2050
- for (const jobId of root.jobs.keys()) {
2051
- this.jobStateListeners.delete(jobId);
2052
- }
2053
- this.roots.delete(id);
2054
- if (this.roots.size === 0) {
2055
- this.stop();
2056
- this.errorHandler = null;
2057
- }
2058
- }
2059
- /**
2060
- * Subscribe to be notified when a root becomes available.
2061
- * Fires immediately if a root already exists.
2062
- * @param {() => void} callback - Function called when first root registers
2063
- * @returns {() => void} Unsubscribe function
2064
- */
2065
- onRootReady(callback) {
2066
- if (this.roots.size > 0) {
2067
- callback();
2068
- return () => {
2069
- };
2070
- }
2071
- this.rootReadyCallbacks.add(callback);
2072
- return () => this.rootReadyCallbacks.delete(callback);
2073
- }
2074
- /**
2075
- * Notify all registered root-ready callbacks.
2076
- * Called when the first root registers.
2077
- * @returns {void}
2078
- * @private
2079
- */
2080
- notifyRootReady() {
2081
- for (const cb of this.rootReadyCallbacks) {
2082
- try {
2083
- cb();
2084
- } catch (error) {
2085
- console.error("[Scheduler] Error in root-ready callback:", error);
2086
- }
2087
- }
2088
- this.rootReadyCallbacks.clear();
2089
- }
2090
- /**
2091
- * Ensure a default root exists for independent mode.
2092
- * Creates a minimal root with no state provider.
2093
- * @returns {void}
2094
- * @private
2095
- */
2096
- ensureDefaultRoot() {
2097
- if (!this.roots.has("__default__")) {
2098
- this.registerRoot("__default__");
2099
- }
2100
- }
2101
- /**
2102
- * Trigger error handling for job errors.
2103
- * Uses the bound error handler if available, otherwise logs to console.
2104
- * @param {Error} error - The error to handle
2105
- * @returns {void}
2106
- */
2107
- triggerError(error) {
2108
- if (this.errorHandler) this.errorHandler(error);
2109
- else console.error("[Scheduler]", error);
2110
- }
2111
- //* Phase Management Methods ================================
2112
- /**
2113
- * Add a named phase to the scheduler's execution order.
2114
- * Marks all roots for rebuild to incorporate the new phase.
2115
- * @param {string} name - The phase name (e.g., 'physics', 'postprocess')
2116
- * @param {AddPhaseOptions} [options] - Positioning options (before/after other phases)
2117
- * @returns {void}
2118
- * @example
2119
- * scheduler.addPhase('physics', { before: 'update' });
2120
- * scheduler.addPhase('postprocess', { after: 'render' });
2121
- */
2122
- addPhase(name, options) {
2123
- this.phaseGraph.addPhase(name, options);
2124
- for (const root of this.roots.values()) {
2125
- root.needsRebuild = true;
2126
- }
2127
- }
2128
- /**
2129
- * Check if a phase exists in the scheduler.
2130
- * @param {string} name - The phase name to check
2131
- * @returns {boolean} True if the phase exists
2132
- */
2133
- hasPhase(name) {
2134
- return this.phaseGraph.hasPhase(name);
2135
- }
2136
- //* Global Job Registration Methods (Deprecated APIs) ================================
2137
- /**
2138
- * Register a global job that runs once per frame (not per-root).
2139
- * Used internally by deprecated addEffect/addAfterEffect APIs.
2140
- * @param {'before' | 'after'} phase - When to run: 'before' all roots or 'after' all roots
2141
- * @param {string} id - Unique identifier for this global job
2142
- * @param {(timestamp: number) => void} callback - Function called each frame with RAF timestamp
2143
- * @returns {() => void} Unsubscribe function to remove this global job
2144
- * @deprecated Use useFrame with phases instead
2145
- */
2146
- registerGlobal(phase, id, callback) {
2147
- const job = { id, callback };
2148
- if (phase === "before") {
2149
- this.globalBeforeJobs.set(id, job);
2150
- } else {
2151
- this.globalAfterJobs.set(id, job);
2152
- }
2153
- return () => {
2154
- if (phase === "before") this.globalBeforeJobs.delete(id);
2155
- else this.globalAfterJobs.delete(id);
2156
- };
2157
- }
2158
- //* Idle Callback Methods (Deprecated API) ================================
2159
- /**
2160
- * Register an idle callback that fires when the loop stops.
2161
- * Used internally by deprecated addTail API.
2162
- * @param {(timestamp: number) => void} callback - Function called when loop becomes idle
2163
- * @returns {() => void} Unsubscribe function to remove this idle callback
2164
- * @deprecated Use demand mode with invalidate() instead
2165
- */
2166
- onIdle(callback) {
2167
- this.idleCallbacks.add(callback);
2168
- return () => this.idleCallbacks.delete(callback);
2169
- }
2170
- /**
2171
- * Notify all registered idle callbacks.
2172
- * Called when the loop stops in demand mode.
2173
- * @param {number} timestamp - The RAF timestamp when idle occurred
2174
- * @returns {void}
2175
- * @private
2176
- */
2177
- notifyIdle(timestamp) {
2178
- for (const cb of this.idleCallbacks) {
2179
- try {
2180
- cb(timestamp);
2181
- } catch (error) {
2182
- console.error("[Scheduler] Error in idle callback:", error);
2183
- }
2184
- }
2185
- }
2186
- //* Job Registration & Management Methods ================================
2187
- /**
2188
- * Register a job (frame callback) with a specific root.
2189
- * This is the core registration method used by useFrame internally.
2190
- * @param {FrameNextCallback} callback - The function to call each frame
2191
- * @param {JobOptions & { rootId?: string; system?: boolean }} [options] - Job configuration
2192
- * @param {string} [options.rootId] - Target root ID (defaults to first registered root)
2193
- * @param {string} [options.id] - Unique job ID (auto-generated if not provided)
2194
- * @param {string} [options.phase] - Execution phase (defaults to 'update')
2195
- * @param {number} [options.priority] - Priority within phase (higher = earlier, default 0)
2196
- * @param {number} [options.fps] - FPS throttle limit
2197
- * @param {boolean} [options.drop] - Drop frames when behind (default true)
2198
- * @param {boolean} [options.enabled] - Whether job is active (default true)
2199
- * @param {boolean} [options.system] - Internal flag for system jobs (not user-facing)
2200
- * @returns {() => void} Unsubscribe function to remove this job
2201
- */
2202
- register(callback, options = {}) {
2203
- const rootId = options.rootId;
2204
- const root = rootId ? this.roots.get(rootId) : this.roots.values().next().value;
2205
- if (!root) {
2206
- console.warn("[Scheduler] No root registered. Is this inside a Canvas?");
2207
- return () => {
2208
- };
2209
- }
2210
- const id = options.id ?? this.generateJobId();
2211
- let phase = options.phase ?? "update";
2212
- if (!options.phase && (options.before || options.after)) {
2213
- phase = this.phaseGraph.resolveConstraintPhase(options.before, options.after);
2214
- }
2215
- const before = this.normalizeConstraints(options.before);
2216
- const after = this.normalizeConstraints(options.after);
2217
- const job = {
2218
- id,
2219
- callback,
2220
- phase,
2221
- before,
2222
- after,
2223
- priority: options.priority ?? 0,
2224
- index: this.nextJobIndex++,
2225
- fps: options.fps,
2226
- drop: options.drop ?? true,
2227
- enabled: options.enabled ?? true,
2228
- system: options.system ?? false
2229
- };
2230
- if (root.jobs.has(id)) {
2231
- console.warn(`[useFrame] Job with id "${id}" already exists, replacing`);
2232
- }
2233
- root.jobs.set(id, job);
2234
- root.needsRebuild = true;
2235
- return () => this.unregister(id, root.id);
2236
- }
2237
- /**
2238
- * Unregister a job by its ID.
2239
- * Searches all roots if rootId is not provided.
2240
- * @param {string} id - The job ID to unregister
2241
- * @param {string} [rootId] - Optional root ID to search (searches all if not provided)
2242
- * @returns {void}
2243
- */
2244
- unregister(id, rootId) {
2245
- const root = rootId ? this.roots.get(rootId) : Array.from(this.roots.values()).find((r) => r.jobs.has(id));
2246
- if (root?.jobs.delete(id)) {
2247
- root.needsRebuild = true;
2248
- this.jobStateListeners.delete(id);
2249
- }
2250
- }
2251
- /**
2252
- * Update a job's options dynamically.
2253
- * Searches all roots to find the job by ID.
2254
- * Phase/constraint changes trigger a rebuild of the sorted job list.
2255
- * @param {string} id - The job ID to update
2256
- * @param {Partial<JobOptions>} options - The options to update
2257
- * @returns {void}
2258
- */
2259
- updateJob(id, options) {
2260
- let job;
2261
- let root;
2262
- for (const r of this.roots.values()) {
2263
- job = r.jobs.get(id);
2264
- if (job) {
2265
- root = r;
2266
- break;
2267
- }
2268
- }
2269
- if (!job || !root) return;
2270
- if (options.priority !== void 0) job.priority = options.priority;
2271
- if (options.fps !== void 0) job.fps = options.fps;
2272
- if (options.drop !== void 0) job.drop = options.drop;
2273
- if (options.enabled !== void 0) {
2274
- const wasEnabled = job.enabled;
2275
- job.enabled = options.enabled;
2276
- if (!wasEnabled && job.enabled) resetJobTiming(job);
2277
- if (wasEnabled !== job.enabled) root.needsRebuild = true;
2278
- }
2279
- if (options.phase !== void 0 || options.before !== void 0 || options.after !== void 0) {
2280
- if (options.phase) job.phase = options.phase;
2281
- if (options.before !== void 0) job.before = this.normalizeConstraints(options.before);
2282
- if (options.after !== void 0) job.after = this.normalizeConstraints(options.after);
2283
- root.needsRebuild = true;
2284
- }
2285
- }
2286
- //* Job State Management Methods ================================
2287
- /**
2288
- * Check if a job is currently paused (disabled).
2289
- * @param {string} id - The job ID to check
2290
- * @returns {boolean} True if the job exists and is paused
2291
- */
2292
- isJobPaused(id) {
2293
- for (const root of this.roots.values()) {
2294
- const job = root.jobs.get(id);
2295
- if (job) return !job.enabled;
2296
- }
2297
- return false;
2298
- }
2299
- /**
2300
- * Subscribe to state changes for a specific job.
2301
- * Listener is called when job is paused or resumed.
2302
- * @param {string} id - The job ID to subscribe to
2303
- * @param {() => void} listener - Callback invoked on state changes
2304
- * @returns {() => void} Unsubscribe function
2305
- */
2306
- subscribeJobState(id, listener) {
2307
- if (!this.jobStateListeners.has(id)) {
2308
- this.jobStateListeners.set(id, /* @__PURE__ */ new Set());
2309
- }
2310
- this.jobStateListeners.get(id).add(listener);
2311
- return () => {
2312
- this.jobStateListeners.get(id)?.delete(listener);
2313
- if (this.jobStateListeners.get(id)?.size === 0) {
2314
- this.jobStateListeners.delete(id);
2315
- }
2316
- };
2317
- }
2318
- /**
2319
- * Notify all listeners that a job's state has changed.
2320
- * @param {string} id - The job ID that changed
2321
- * @returns {void}
2322
- * @private
2323
- */
2324
- notifyJobStateChange(id) {
2325
- this.jobStateListeners.get(id)?.forEach((listener) => listener());
2326
- }
2327
- /**
2328
- * Pause a job by ID (sets enabled=false).
2329
- * Notifies any subscribed state listeners.
2330
- * @param {string} id - The job ID to pause
2331
- * @returns {void}
2332
- */
2333
- pauseJob(id) {
2334
- this.updateJob(id, { enabled: false });
2335
- this.notifyJobStateChange(id);
2336
- }
2337
- /**
2338
- * Resume a paused job by ID (sets enabled=true).
2339
- * Resets job timing to prevent frame accumulation.
2340
- * Notifies any subscribed state listeners.
2341
- * @param {string} id - The job ID to resume
2342
- * @returns {void}
2343
- */
2344
- resumeJob(id) {
2345
- this.updateJob(id, { enabled: true });
2346
- this.notifyJobStateChange(id);
2347
- }
2348
- //* Frame Loop Control Methods ================================
2349
- /**
2350
- * Start the requestAnimationFrame loop.
2351
- * Resets timing state (elapsedTime, frameCount) on start.
2352
- * No-op if already running.
2353
- * @returns {void}
2354
- */
2355
- start() {
2356
- if (this.loopState.running) return;
2357
- const { elapsedTime, createdAt } = this.loopState;
2358
- let adjustedCreated = 0;
2359
- if (this.stoppedTime > 0) {
2360
- adjustedCreated = createdAt - (performance.now() - this.stoppedTime);
2361
- this.stoppedTime = 0;
2362
- }
2363
- Object.assign(this.loopState, {
2364
- running: true,
2365
- elapsedTime: elapsedTime ?? 0,
2366
- lastTime: performance.now(),
2367
- createdAt: adjustedCreated > 0 ? adjustedCreated : performance.now(),
2368
- frameCount: 0,
2369
- rafHandle: requestAnimationFrame(this.loop)
2370
- });
2371
- }
2372
- /**
2373
- * Stop the requestAnimationFrame loop.
2374
- * Cancels any pending RAF callback.
2375
- * No-op if not running.
2376
- * @returns {void}
2377
- */
2378
- stop() {
2379
- if (!this.loopState.running) return;
2380
- this.loopState.running = false;
2381
- if (this.loopState.rafHandle !== null) {
2382
- cancelAnimationFrame(this.loopState.rafHandle);
2383
- this.loopState.rafHandle = null;
2384
- }
2385
- this.stoppedTime = performance.now();
2386
- }
2387
- /**
2388
- * Request frames to be rendered in demand mode.
2389
- * Accumulates pending frames (capped at 60) and starts the loop if not running.
2390
- * No-op if frameloop is not 'demand'.
2391
- * @param {number} [frames=1] - Number of frames to request
2392
- * @param {boolean} [stackFrames=false] - Whether to add frames to existing pending count
2393
- * - `false` (default): Sets pending frames to the specified value (replaces existing count)
2394
- * - `true`: Adds frames to existing pending count (useful for accumulating invalidations)
2395
- * @returns {void}
2396
- * @example
2397
- * // Request a single frame render
2398
- * scheduler.invalidate();
2399
- *
2400
- * @example
2401
- * // Request 5 frames (e.g., for animations)
2402
- * scheduler.invalidate(5);
2403
- *
2404
- * @example
2405
- * // Set pending frames to exactly 3 (don't stack with existing)
2406
- * scheduler.invalidate(3, false);
2407
- *
2408
- * @example
2409
- * // Add 2 more frames to existing pending count
2410
- * scheduler.invalidate(2, true);
2411
- */
2412
- invalidate(frames = 1, stackFrames = false) {
2413
- if (this._frameloop !== "demand") return;
2414
- const baseFrames = stackFrames ? this.pendingFrames : 0;
2415
- this.pendingFrames = Math.min(60, baseFrames + frames);
2416
- if (!this.loopState.running && this.pendingFrames > 0) this.start();
2417
- }
2418
- /**
2419
- * Reset timing state for deterministic testing.
2420
- * Preserves jobs and roots but resets lastTime, frameCount, elapsedTime, etc.
2421
- * @returns {void}
2422
- */
2423
- resetTiming() {
2424
- this.loopState.lastTime = null;
2425
- this.loopState.frameCount = 0;
2426
- this.loopState.elapsedTime = 0;
2427
- this.loopState.createdAt = performance.now();
2428
- }
2429
- //* Manual Stepping Methods ================================
2430
- /**
2431
- * Manually execute a single frame for all roots.
2432
- * Useful for frameloop='never' mode or testing scenarios.
2433
- * @param {number} [timestamp] - Optional timestamp (defaults to performance.now())
2434
- * @returns {void}
2435
- * @example
2436
- * // Manual control mode
2437
- * scheduler.frameloop = 'never';
2438
- * scheduler.step(); // Execute one frame
2439
- */
2440
- step(timestamp) {
2441
- const now = timestamp ?? performance.now();
2442
- this.executeFrame(now);
2443
- }
2444
- /**
2445
- * Manually execute a single job by its ID.
2446
- * Useful for testing individual job callbacks in isolation.
2447
- * @param {string} id - The job ID to step
2448
- * @param {number} [timestamp] - Optional timestamp (defaults to performance.now())
2449
- * @returns {void}
2450
- */
2451
- stepJob(id, timestamp) {
2452
- let job;
2453
- let root;
2454
- for (const r of this.roots.values()) {
2455
- job = r.jobs.get(id);
2456
- if (job) {
2457
- root = r;
2458
- break;
2459
- }
2460
- }
2461
- if (!job || !root) {
2462
- console.warn(`[Scheduler] Job "${id}" not found`);
2463
- return;
2464
- }
2465
- const now = timestamp ?? performance.now();
2466
- const deltaMs = this.loopState.lastTime !== null ? now - this.loopState.lastTime : 0;
2467
- const delta = deltaMs / 1e3;
2468
- const elapsed = now - this.loopState.createdAt;
2469
- const providedState = root.getState?.() ?? {};
2470
- const frameState = {
2471
- ...providedState,
2472
- time: now,
2473
- delta,
2474
- elapsed,
2475
- frame: this.loopState.frameCount
2476
- };
2477
- try {
2478
- job.callback(frameState, delta);
2479
- } catch (error) {
2480
- console.error(`[Scheduler] Error in job "${job.id}":`, error);
2481
- this.triggerError(error instanceof Error ? error : new Error(String(error)));
2482
- }
2483
- }
2484
- /**
2485
- * Execute a single frame across all roots.
2486
- * Order: globalBefore → each root's jobs → globalAfter
2487
- * @param {number} timestamp - RAF timestamp in milliseconds
2488
- * @returns {void}
2489
- * @private
2490
- */
2491
- executeFrame(timestamp) {
2492
- const deltaMs = this.loopState.lastTime !== null ? timestamp - this.loopState.lastTime : 0;
2493
- const delta = deltaMs / 1e3;
2494
- this.loopState.lastTime = timestamp;
2495
- this.loopState.frameCount++;
2496
- this.loopState.elapsedTime += deltaMs;
2497
- this.runGlobalJobs(this.globalBeforeJobs, timestamp);
2498
- for (const root of this.roots.values()) {
2499
- this.tickRoot(root, timestamp, delta);
2500
- }
2501
- this.runGlobalJobs(this.globalAfterJobs, timestamp);
2502
- }
2503
- /**
2504
- * Run all global jobs from a job map.
2505
- * Catches and logs errors without stopping execution.
2506
- * @param {Map<string, GlobalJob>} jobs - The global jobs map to execute
2507
- * @param {number} timestamp - RAF timestamp in milliseconds
2508
- * @returns {void}
2509
- * @private
2510
- */
2511
- runGlobalJobs(jobs, timestamp) {
2512
- for (const job of jobs.values()) {
2513
- try {
2514
- job.callback(timestamp);
2515
- } catch (error) {
2516
- console.error(`[Scheduler] Error in global job "${job.id}":`, error);
2517
- }
2518
- }
2519
- }
2520
- /**
2521
- * Execute all jobs for a single root in sorted order.
2522
- * Rebuilds sorted job list if needed, then dispatches each job.
2523
- * Errors are caught and propagated via triggerError.
2524
- * @param {RootEntry} root - The root entry to tick
2525
- * @param {number} timestamp - RAF timestamp in milliseconds
2526
- * @param {number} delta - Time since last frame in seconds
2527
- * @returns {void}
2528
- * @private
2529
- */
2530
- tickRoot(root, timestamp, delta) {
2531
- if (root.needsRebuild) {
2532
- root.sortedJobs = rebuildSortedJobs(root.jobs, this.phaseGraph);
2533
- root.needsRebuild = false;
2534
- }
2535
- const providedState = root.getState?.() ?? {};
2536
- const frameState = {
2537
- ...providedState,
2538
- time: timestamp,
2539
- delta,
2540
- elapsed: this.loopState.elapsedTime / 1e3,
2541
- // Convert ms to seconds
2542
- frame: this.loopState.frameCount
2543
- };
2544
- for (const job of root.sortedJobs) {
2545
- if (!shouldRun(job, timestamp)) continue;
2546
- try {
2547
- job.callback(frameState, delta);
2548
- } catch (error) {
2549
- console.error(`[Scheduler] Error in job "${job.id}":`, error);
2550
- this.triggerError(error instanceof Error ? error : new Error(String(error)));
2551
- }
2552
- }
2553
- }
2554
- //* Debug & Inspection Methods ================================
2555
- /**
2556
- * Get the total number of registered jobs across all roots.
2557
- * Includes both per-root jobs and global before/after jobs.
2558
- * @returns {number} Total job count
2559
- */
2560
- getJobCount() {
2561
- let count = 0;
2562
- for (const root of this.roots.values()) {
2563
- count += root.jobs.size;
2564
- }
2565
- return count + this.globalBeforeJobs.size + this.globalAfterJobs.size;
2566
- }
2567
- /**
2568
- * Get all registered job IDs across all roots.
2569
- * Includes both per-root jobs and global before/after jobs.
2570
- * @returns {string[]} Array of all job IDs
2571
- */
2572
- getJobIds() {
2573
- const ids = [];
2574
- for (const root of this.roots.values()) {
2575
- ids.push(...root.jobs.keys());
2576
- }
2577
- ids.push(...this.globalBeforeJobs.keys());
2578
- ids.push(...this.globalAfterJobs.keys());
2579
- return ids;
2580
- }
2581
- /**
2582
- * Get the number of registered roots (Canvas instances).
2583
- * @returns {number} Number of registered roots
2584
- */
2585
- getRootCount() {
2586
- return this.roots.size;
2587
- }
2588
- /**
2589
- * Check if any user (non-system) jobs are registered in a specific phase.
2590
- * Used by the default render job to know if a user has taken over rendering.
2591
- *
2592
- * @param phase The phase to check
2593
- * @param rootId Optional root ID to check (checks all roots if not provided)
2594
- * @returns true if any user jobs exist in the phase
2595
- */
2596
- hasUserJobsInPhase(phase, rootId) {
2597
- const rootsToCheck = rootId ? [this.roots.get(rootId)].filter(Boolean) : Array.from(this.roots.values());
2598
- return rootsToCheck.some((root) => {
2599
- if (!root) return false;
2600
- for (const job of root.jobs.values()) {
2601
- if (job.phase === phase && !job.system && job.enabled) return true;
2602
- }
2603
- return false;
2604
- });
2605
- }
2606
- //* Utility Methods ================================
2607
- /**
2608
- * Generate a unique root ID for automatic root registration.
2609
- * @returns {string} A unique root ID in the format 'root_N'
2610
- */
2611
- generateRootId() {
2612
- return `root_${this.nextRootIndex++}`;
2613
- }
2614
- /**
2615
- * Generate a unique job ID.
2616
- * @returns {string} A unique job ID in the format 'job_N'
2617
- * @private
2618
- */
2619
- generateJobId() {
2620
- return `job_${this.nextJobIndex}`;
2621
- }
2622
- /**
2623
- * Normalize before/after constraints to a Set.
2624
- * Handles undefined, single string, or array inputs.
2625
- * @param {string | string[] | undefined} value - The constraint value(s)
2626
- * @returns {Set<string>} Normalized Set of constraint strings
2627
- * @private
2628
- */
2629
- normalizeConstraints(value) {
2630
- if (!value) return /* @__PURE__ */ new Set();
2631
- if (Array.isArray(value)) return new Set(value);
2632
- return /* @__PURE__ */ new Set([value]);
2633
- }
2634
- };
2635
- //* Static State & Methods (Singleton Usage) ================================
2636
- //* Cross-Bundle Singleton Key ==============================
2637
- // Use Symbol.for() to ensure scheduler is shared across bundle boundaries
2638
- // This prevents issues when mixing imports from @react-three/fiber and @react-three/fiber/webgpu
2639
- __publicField(_Scheduler, "INSTANCE_KEY", Symbol.for("@react-three/fiber.scheduler"));
2640
- let Scheduler = _Scheduler;
2641
- const getScheduler = () => Scheduler.get();
2642
- if (hmrData) {
2643
- hmrData.accept?.();
1662
+ const INTERNAL_LIB_MARKERS = ["zustand", "setState", "Object.assign"];
1663
+ function isInternalRendererAccess(stack, callerDepth = 2) {
1664
+ if (!stack) return false;
1665
+ const caller = stack.split("\n")[callerDepth] ?? "";
1666
+ return INTERNAL_LIB_MARKERS.some((m) => caller.includes(m));
2644
1667
  }
2645
1668
 
2646
1669
  const R3F_CONTEXT = Symbol.for("@react-three/fiber.context");
@@ -2775,6 +1798,7 @@ const createStore = (invalidate, advance) => {
2775
1798
  }),
2776
1799
  setFrameloop: (frameloop = "always") => {
2777
1800
  set(() => ({ frameloop }));
1801
+ getScheduler().frameloop = frameloop;
2778
1802
  },
2779
1803
  setError: (error) => set(() => ({ error })),
2780
1804
  error: null,
@@ -2784,6 +1808,7 @@ const createStore = (invalidate, advance) => {
2784
1808
  buffers: {},
2785
1809
  gpuStorage: {},
2786
1810
  textures: /* @__PURE__ */ new Map(),
1811
+ _textureRefs: /* @__PURE__ */ new Map(),
2787
1812
  renderPipeline: null,
2788
1813
  passes: {},
2789
1814
  _hmrVersion: 0,
@@ -2841,8 +1866,7 @@ const createStore = (invalidate, advance) => {
2841
1866
  const currentState = rootStore.getState();
2842
1867
  if (!currentState.isLegacy && currentState.internal.actualRenderer) {
2843
1868
  const stack = new Error().stack || "";
2844
- const isInternalAccess = stack.includes("zustand") || stack.includes("setState") || stack.includes("Object.assign") || stack.includes("react-three-fiber/packages/fiber/src/core");
2845
- if (!isInternalAccess) {
1869
+ if (!isInternalRendererAccess(stack)) {
2846
1870
  const cleanedStack = stack.split("\n").slice(2).join("\n") || "Stack trace unavailable";
2847
1871
  notifyDepreciated({
2848
1872
  heading: "Accessing state.gl in WebGPU mode",
@@ -2890,14 +1914,16 @@ const createStore = (invalidate, advance) => {
2890
1914
  oldSize = size;
2891
1915
  oldDpr = viewport.dpr;
2892
1916
  updateCamera(camera, size);
2893
- if (canvasTarget) {
1917
+ if (internal.isSecondary && canvasTarget) {
2894
1918
  if (viewport.dpr > 0) canvasTarget.setPixelRatio(viewport.dpr);
2895
- const updateStyle = typeof HTMLCanvasElement !== "undefined" && canvasTarget.domElement instanceof HTMLCanvasElement;
2896
- canvasTarget.setSize(size.width, size.height, updateStyle);
1919
+ canvasTarget.setSize(size.width, size.height, false);
2897
1920
  } else {
2898
1921
  if (viewport.dpr > 0) actualRenderer.setPixelRatio(viewport.dpr);
2899
- const updateStyle = typeof HTMLCanvasElement !== "undefined" && actualRenderer.domElement instanceof HTMLCanvasElement;
2900
- actualRenderer.setSize(size.width, size.height, updateStyle);
1922
+ actualRenderer.setSize(size.width, size.height, false);
1923
+ if (canvasTarget) {
1924
+ if (viewport.dpr > 0) canvasTarget.setPixelRatio(viewport.dpr);
1925
+ canvasTarget.setSize(size.width, size.height, false);
1926
+ }
2901
1927
  }
2902
1928
  }
2903
1929
  if (camera !== oldCamera) {
@@ -2953,19 +1979,25 @@ function loadingFn(extensions, onProgress) {
2953
1979
  );
2954
1980
  };
2955
1981
  }
2956
- function useLoader(loader, input, extensions, onProgress) {
2957
- const keys = Array.isArray(input) ? input : [input];
1982
+ function useLoader(loader, input, extensions, onProgress, cacheKey) {
1983
+ const inputs = Array.isArray(input) ? input : [input];
1984
+ const cacheKeys = Array.isArray(cacheKey ?? input) ? cacheKey ?? input : [cacheKey ?? input];
2958
1985
  const fn = loadingFn(extensions, onProgress);
2959
- const results = keys.map((key) => suspend(fn, [loader, key], { equal: is.equ }));
1986
+ const results = cacheKeys.map(
1987
+ (key, index) => suspend(() => fn(loader, inputs[index]), [loader, key], { equal: is.equ })
1988
+ );
2960
1989
  return Array.isArray(input) ? results : results[0];
2961
1990
  }
2962
- useLoader.preload = function(loader, input, extensions, onProgress) {
2963
- const keys = Array.isArray(input) ? input : [input];
2964
- keys.forEach((key) => preload(loadingFn(extensions, onProgress), [loader, key]));
1991
+ useLoader.preload = function(loader, input, extensions, onProgress, cacheKey) {
1992
+ const inputs = Array.isArray(input) ? input : [input];
1993
+ const cacheKeys = Array.isArray(cacheKey ?? input) ? cacheKey ?? input : [cacheKey ?? input];
1994
+ cacheKeys.forEach(
1995
+ (key, index) => preload(() => loadingFn(extensions, onProgress)(loader, inputs[index]), [loader, key])
1996
+ );
2965
1997
  };
2966
- useLoader.clear = function(loader, input) {
2967
- const keys = Array.isArray(input) ? input : [input];
2968
- keys.forEach((key) => clear([loader, key]));
1998
+ useLoader.clear = function(loader, input, cacheKey) {
1999
+ const cacheKeys = Array.isArray(cacheKey ?? input) ? cacheKey ?? input : [cacheKey ?? input];
2000
+ cacheKeys.forEach((key) => clear([loader, key]));
2969
2001
  };
2970
2002
  useLoader.loader = getLoader;
2971
2003
 
@@ -3041,20 +2073,14 @@ function useFrame(callback, priorityOrOptions) {
3041
2073
  }
3042
2074
  };
3043
2075
  } else {
3044
- const registerOutside = () => {
3045
- return scheduler.register((state, delta) => callbackRef.current?.(state, delta), { id, ...options });
3046
- };
3047
- if (scheduler.independent || scheduler.isReady) {
3048
- return registerOutside();
3049
- }
3050
- let unregisterJob = null;
3051
- const unsubReady = scheduler.onRootReady(() => {
3052
- unregisterJob = registerOutside();
3053
- });
3054
- return () => {
3055
- unsubReady();
3056
- unregisterJob?.();
3057
- };
2076
+ return scheduler.register(
2077
+ (state, delta) => {
2078
+ const frameState = state;
2079
+ if (!frameState.renderer) return;
2080
+ callbackRef.current?.(frameState, delta);
2081
+ },
2082
+ { id, ...options }
2083
+ );
3058
2084
  }
3059
2085
  }, [store, scheduler, id, optionsKey, isLegacyPriority, isInsideCanvas]);
3060
2086
  const isPaused = React.useSyncExternalStore(
@@ -3145,18 +2171,18 @@ function buildFromCache(input, textureCache) {
3145
2171
  function useTexture(input, optionsOrOnLoad) {
3146
2172
  const renderer = useThree((state) => state.internal.actualRenderer);
3147
2173
  const store = useStore();
3148
- const textureCache = useThree((state) => state.textures);
3149
2174
  const options = typeof optionsOrOnLoad === "function" ? { onLoad: optionsOrOnLoad } : optionsOrOnLoad ?? {};
3150
- const { onLoad, cache = false } = options;
2175
+ const { onLoad, cache = true } = options;
3151
2176
  const onLoadRef = useRef(onLoad);
3152
2177
  onLoadRef.current = onLoad;
3153
2178
  const onLoadCalledForRef = useRef(null);
3154
2179
  const urls = useMemo(() => getUrls(input), [input]);
3155
2180
  const cachedResult = useMemo(() => {
3156
2181
  if (!cache) return null;
3157
- if (!allUrlsCached(urls, textureCache)) return null;
3158
- return buildFromCache(input, textureCache);
3159
- }, [cache, urls, textureCache, input]);
2182
+ const textures = store.getState().textures;
2183
+ if (!allUrlsCached(urls, textures)) return null;
2184
+ return buildFromCache(input, textures);
2185
+ }, [cache, urls, input, store]);
3160
2186
  const loadedTextures = useLoader(
3161
2187
  TextureLoader,
3162
2188
  IsObject(input) ? Object.values(input) : input
@@ -3200,8 +2226,6 @@ function useTexture(input, optionsOrOnLoad) {
3200
2226
  }, [input, loadedTextures, cachedResult]);
3201
2227
  useEffect(() => {
3202
2228
  if (!cache) return;
3203
- if (cachedResult) return;
3204
- const set = store.setState;
3205
2229
  const urlTextureMap = [];
3206
2230
  if (typeof input === "string") {
3207
2231
  urlTextureMap.push([input, mappedTextures]);
@@ -3215,18 +2239,32 @@ function useTexture(input, optionsOrOnLoad) {
3215
2239
  urlTextureMap.push([url, textureRecord[key]]);
3216
2240
  }
3217
2241
  }
3218
- set((state) => {
3219
- const newMap = new Map(state.textures);
3220
- let changed = false;
2242
+ store.setState((state) => {
2243
+ const refs = new Map(state._textureRefs);
2244
+ let textures = state.textures;
2245
+ let added = false;
3221
2246
  for (const [url, texture] of urlTextureMap) {
3222
- if (!newMap.has(url)) {
3223
- newMap.set(url, texture);
3224
- changed = true;
2247
+ if (!textures.has(url)) {
2248
+ if (!added) {
2249
+ textures = new Map(textures);
2250
+ added = true;
2251
+ }
2252
+ textures.set(url, texture);
3225
2253
  }
2254
+ refs.set(url, (refs.get(url) ?? 0) + 1);
3226
2255
  }
3227
- return changed ? { textures: newMap } : state;
2256
+ return added ? { textures, _textureRefs: refs } : { _textureRefs: refs };
3228
2257
  });
3229
- }, [cache, input, mappedTextures, store, cachedResult]);
2258
+ return () => store.setState((state) => {
2259
+ const refs = new Map(state._textureRefs);
2260
+ for (const [url] of urlTextureMap) {
2261
+ const next = (refs.get(url) ?? 0) - 1;
2262
+ if (next <= 0) refs.delete(url);
2263
+ else refs.set(url, next);
2264
+ }
2265
+ return { _textureRefs: refs };
2266
+ });
2267
+ }, [cache, input, mappedTextures, store]);
3230
2268
  return mappedTextures;
3231
2269
  }
3232
2270
  useTexture.preload = (url) => useLoader.preload(TextureLoader, url);
@@ -3242,96 +2280,63 @@ const Texture = ({
3242
2280
  return /* @__PURE__ */ jsx(Fragment, { children: children?.(ret) });
3243
2281
  };
3244
2282
 
3245
- function getTextureValue(entry) {
3246
- if (entry instanceof Texture$1) return entry;
3247
- if (entry && typeof entry === "object" && "value" in entry && entry.value instanceof Texture$1) {
3248
- return entry.value;
3249
- }
3250
- return null;
3251
- }
3252
- function useTextures() {
2283
+ function useTextures(selector) {
3253
2284
  const store = useStore();
3254
- return useMemo(() => {
3255
- const set = store.setState;
2285
+ const registry = useMemo(() => {
3256
2286
  const getState = store.getState;
3257
- const add = (key, value) => {
3258
- set((state) => {
3259
- const newMap = new Map(state.textures);
3260
- newMap.set(key, value);
3261
- return { textures: newMap };
3262
- });
3263
- };
3264
- const addMultiple = (items) => {
3265
- set((state) => {
3266
- const newMap = new Map(state.textures);
3267
- const entries = items instanceof Map ? items.entries() : Object.entries(items);
3268
- for (const [key, value] of entries) {
3269
- newMap.set(key, value);
3270
- }
3271
- return { textures: newMap };
3272
- });
3273
- };
3274
- const remove = (key) => {
3275
- set((state) => {
3276
- const newMap = new Map(state.textures);
3277
- newMap.delete(key);
3278
- return { textures: newMap };
3279
- });
3280
- };
3281
- const removeMultiple = (keys) => {
3282
- set((state) => {
3283
- const newMap = new Map(state.textures);
3284
- for (const key of keys) newMap.delete(key);
3285
- return { textures: newMap };
3286
- });
3287
- };
3288
- const dispose = (key) => {
3289
- const entry = getState().textures.get(key);
3290
- if (entry) {
3291
- const tex = getTextureValue(entry);
3292
- tex?.dispose();
3293
- }
3294
- remove(key);
3295
- };
3296
- const disposeMultiple = (keys) => {
3297
- const textures = getState().textures;
3298
- for (const key of keys) {
3299
- const entry = textures.get(key);
3300
- if (entry) {
3301
- const tex = getTextureValue(entry);
3302
- tex?.dispose();
3303
- }
3304
- }
3305
- removeMultiple(keys);
3306
- };
3307
- const disposeAll = () => {
3308
- const textures = getState().textures;
3309
- for (const entry of textures.values()) {
3310
- const tex = getTextureValue(entry);
3311
- tex?.dispose();
3312
- }
3313
- set({ textures: /* @__PURE__ */ new Map() });
3314
- };
2287
+ const setState = store.setState;
2288
+ const getOne = (key) => getState().textures.get(key);
3315
2289
  return {
3316
- // Getter for the textures Map (reactive via getState)
3317
- get textures() {
2290
+ get all() {
3318
2291
  return getState().textures;
3319
2292
  },
3320
- // Read
3321
- get: (key) => getState().textures.get(key),
2293
+ get(input) {
2294
+ if (typeof input === "string") return getOne(input);
2295
+ if (Array.isArray(input)) return input.map(getOne);
2296
+ const out = {};
2297
+ for (const name in input) out[name] = getOne(input[name]);
2298
+ return out;
2299
+ },
3322
2300
  has: (key) => getState().textures.has(key),
3323
- // Write
3324
- add,
3325
- addMultiple,
3326
- // Remove (cache only)
3327
- remove,
3328
- removeMultiple,
3329
- // Dispose (GPU + cache)
3330
- dispose,
3331
- disposeMultiple,
3332
- disposeAll
2301
+ add(keyOrRecord, texture) {
2302
+ setState((state) => {
2303
+ const textures = new Map(state.textures);
2304
+ if (typeof keyOrRecord === "string") {
2305
+ textures.set(keyOrRecord, texture);
2306
+ } else {
2307
+ for (const key in keyOrRecord) textures.set(key, keyOrRecord[key]);
2308
+ }
2309
+ return { textures };
2310
+ });
2311
+ },
2312
+ dispose(key, options) {
2313
+ const state = getState();
2314
+ const refs = state._textureRefs.get(key) ?? 0;
2315
+ if (refs > 0 && !options?.force) {
2316
+ console.warn(
2317
+ `[useTextures] "${key}" still has ${refs} active reference(s); skipping dispose. Pass { force: true } to override.`
2318
+ );
2319
+ return false;
2320
+ }
2321
+ state.textures.get(key)?.dispose();
2322
+ setState((s) => {
2323
+ const textures = new Map(s.textures);
2324
+ textures.delete(key);
2325
+ const nextRefs = new Map(s._textureRefs);
2326
+ nextRefs.delete(key);
2327
+ return { textures, _textureRefs: nextRefs };
2328
+ });
2329
+ return true;
2330
+ },
2331
+ disposeAll() {
2332
+ for (const texture of getState().textures.values()) texture.dispose();
2333
+ setState({ textures: /* @__PURE__ */ new Map(), _textureRefs: /* @__PURE__ */ new Map() });
2334
+ }
3333
2335
  };
3334
2336
  }, [store]);
2337
+ const subscribe = selector ? () => selector(registry) : (state) => state.textures;
2338
+ const selected = useThree(subscribe);
2339
+ return selector ? selected : registry;
3335
2340
  }
3336
2341
 
3337
2342
  function useRenderTarget(widthOrOptions, heightOrOptions, options) {
@@ -3414,7 +2419,7 @@ function advance(timestamp) {
3414
2419
  getScheduler().step(timestamp);
3415
2420
  }
3416
2421
 
3417
- const version = "10.0.0-alpha.2";
2422
+ const version = "10.0.0-alpha.3";
3418
2423
  const packageData = {
3419
2424
  version: version};
3420
2425
 
@@ -14853,6 +13858,7 @@ function swapInstances() {
14853
13858
  }
14854
13859
  }
14855
13860
  if (instance.isHidden) unhideInstance(instance);
13861
+ if (isObject3D(instance.object)) removeInteractivity(findInitialRoot(instance), instance.object);
14856
13862
  if (instance.object.__r3f) delete instance.object.__r3f;
14857
13863
  if (instance.type !== "primitive") disposeOnIdle(instance.object);
14858
13864
  }
@@ -14865,6 +13871,8 @@ function swapInstances() {
14865
13871
  instance.object.__r3f = instance;
14866
13872
  setFiberRef(fiber, instance.object);
14867
13873
  delete instance.appliedOnce;
13874
+ instance.eventCount = 0;
13875
+ instance.handlers = {};
14868
13876
  applyProps(instance.object, instance.props);
14869
13877
  if (instance.props.attach) {
14870
13878
  attach(parent, instance);
@@ -15080,11 +14088,15 @@ const reconciler = /* @__PURE__ */ createReconciler({
15080
14088
  cloneMutableTextInstance(textInstance) {
15081
14089
  return textInstance;
15082
14090
  },
14091
+ // React 19.2 added these for root-level view transitions. They only run for hosts that opt into
14092
+ // view transitions by returning a container from cloneRootViewTransitionContainer; R3F renders
14093
+ // into a WebGL/WebGPU canvas, where cloning the root has no meaning, so we never opt in and
14094
+ // React never calls them. They stay as no-ops rather than throws: the host config is shared by
14095
+ // every root, and a throw here would turn a React-internal probe into a hard crash for users.
14096
+ // Guarded by a test asserting a full render + unmount never reaches them.
15083
14097
  cloneRootViewTransitionContainer(_rootContainer) {
15084
- throw new Error("Not implemented.");
15085
14098
  },
15086
14099
  removeRootViewTransitionClone(_rootContainer, _clone) {
15087
- throw new Error("Not implemented.");
15088
14100
  },
15089
14101
  // https://github.com/facebook/react/pull/32465
15090
14102
  createFragmentInstance: (_fiber) => null,
@@ -15169,6 +14181,7 @@ function createRoot(canvas) {
15169
14181
  const lastConfiguredProps = {};
15170
14182
  let configured = false;
15171
14183
  let pending = null;
14184
+ let rendererSetup = null;
15172
14185
  return {
15173
14186
  async configure(props = {}) {
15174
14187
  let resolve;
@@ -15184,7 +14197,6 @@ function createRoot(canvas) {
15184
14197
  events,
15185
14198
  onCreated: onCreatedCallback,
15186
14199
  shadows = false,
15187
- textureColorSpace = SRGBColorSpace,
15188
14200
  orthographic = false,
15189
14201
  frameloop = "always",
15190
14202
  dpr = [1, 2],
@@ -15199,7 +14211,8 @@ function createRoot(canvas) {
15199
14211
  _sizeProps,
15200
14212
  forceEven
15201
14213
  } = props;
15202
- const state = store.getState();
14214
+ const textureColorSpace = is.obj(glConfig) && !is.fun(glConfig) && !isRenderer(glConfig) && glConfig.textureColorSpace || is.obj(rendererConfig) && !is.fun(rendererConfig) && !isRenderer(rendererConfig) && rendererConfig.textureColorSpace || SRGBColorSpace;
14215
+ let state = store.getState();
15203
14216
  const defaultGLProps = {
15204
14217
  canvas,
15205
14218
  powerPreference: "high-performance",
@@ -15227,56 +14240,68 @@ function createRoot(canvas) {
15227
14240
  "The `primaryCanvas` prop for multi-canvas rendering cannot be used with WebGL. Remove the `gl` prop or use WebGPU."
15228
14241
  );
15229
14242
  }
15230
- if (wantsGL && !state.internal.actualRenderer) {
15231
- renderer = await resolveRenderer(glConfig, defaultGLProps, WebGLRenderer);
15232
- state.internal.actualRenderer = renderer;
15233
- state.set({ isLegacy: true, gl: renderer, renderer, primaryStore: store });
15234
- } else if (!wantsGL && primaryCanvas && !state.internal.actualRenderer) {
15235
- const primary = await waitForPrimary(primaryCanvas);
15236
- renderer = primary.renderer;
15237
- state.internal.actualRenderer = renderer;
15238
- const canvasTarget = new CanvasTarget(canvas);
15239
- primary.store.setState((prev) => ({
15240
- internal: { ...prev.internal, isMultiCanvas: true }
15241
- }));
15242
- state.set((prev) => ({
15243
- webGPUSupported: primary.store.getState().webGPUSupported,
15244
- renderer,
15245
- primaryStore: primary.store,
15246
- internal: {
15247
- ...prev.internal,
15248
- canvasTarget,
15249
- isMultiCanvas: true,
15250
- isSecondary: true,
15251
- targetId: primaryCanvas
15252
- }
15253
- }));
15254
- } else if (!wantsGL && !state.internal.actualRenderer) {
15255
- renderer = await resolveRenderer(rendererConfig, defaultGPUProps, WebGPURenderer);
15256
- if (!renderer.hasInitialized?.()) {
15257
- const size2 = computeInitialSize(canvas, propsSize);
15258
- if (size2.width > 0 && size2.height > 0) {
15259
- const pixelRatio = calculateDpr(dpr);
15260
- canvas.width = size2.width * pixelRatio;
15261
- canvas.height = size2.height * pixelRatio;
15262
- }
15263
- await renderer.init();
15264
- }
15265
- const backend = renderer.backend;
15266
- const isWebGPUBackend = backend && "isWebGPUBackend" in backend;
15267
- state.internal.actualRenderer = renderer;
15268
- state.set({ webGPUSupported: isWebGPUBackend, renderer, primaryStore: store });
15269
- if (canvasId && !state.internal.isSecondary) {
15270
- const canvasTarget = new CanvasTarget(canvas);
15271
- const unregisterPrimary = registerPrimary(canvasId, renderer, store);
15272
- state.set((prev) => ({
15273
- internal: {
15274
- ...prev.internal,
15275
- canvasTarget,
15276
- unregisterPrimary
14243
+ if (!state.internal.actualRenderer) {
14244
+ if (!rendererSetup) {
14245
+ rendererSetup = (async () => {
14246
+ if (wantsGL) {
14247
+ renderer = await resolveRenderer(glConfig, defaultGLProps, WebGLRenderer);
14248
+ state.internal.actualRenderer = renderer;
14249
+ state.set({ isLegacy: true, gl: renderer, renderer, primaryStore: store });
14250
+ } else if (!wantsGL && primaryCanvas) {
14251
+ const primary = await waitForPrimary(primaryCanvas);
14252
+ renderer = primary.renderer;
14253
+ state.internal.actualRenderer = renderer;
14254
+ const canvasTarget = new CanvasTarget(canvas);
14255
+ primary.store.setState((prev) => ({
14256
+ internal: { ...prev.internal, isMultiCanvas: true }
14257
+ }));
14258
+ state.set((prev) => ({
14259
+ webGPUSupported: primary.store.getState().webGPUSupported,
14260
+ renderer,
14261
+ primaryStore: primary.store,
14262
+ internal: {
14263
+ ...prev.internal,
14264
+ canvasTarget,
14265
+ isMultiCanvas: true,
14266
+ isSecondary: true,
14267
+ targetId: primaryCanvas
14268
+ }
14269
+ }));
14270
+ } else if (!wantsGL) {
14271
+ renderer = await resolveRenderer(rendererConfig, defaultGPUProps, WebGPURenderer);
14272
+ if (!renderer.hasInitialized?.()) {
14273
+ const size2 = computeInitialSize(canvas, propsSize);
14274
+ if (size2.width > 0 && size2.height > 0) {
14275
+ const pixelRatio = calculateDpr(dpr);
14276
+ canvas.width = size2.width * pixelRatio;
14277
+ canvas.height = size2.height * pixelRatio;
14278
+ }
14279
+ await renderer.init();
14280
+ }
14281
+ const backend = renderer.backend;
14282
+ const isWebGPUBackend = backend && "isWebGPUBackend" in backend;
14283
+ state.internal.actualRenderer = renderer;
14284
+ state.set({ webGPUSupported: isWebGPUBackend, renderer, primaryStore: store });
14285
+ if (canvasId && !state.internal.isSecondary) {
14286
+ const canvasTarget = new CanvasTarget(canvas);
14287
+ const unregisterPrimary = registerPrimary(canvasId, renderer, store);
14288
+ state.set((prev) => ({
14289
+ internal: {
14290
+ ...prev.internal,
14291
+ canvasTarget,
14292
+ unregisterPrimary
14293
+ }
14294
+ }));
14295
+ }
15277
14296
  }
15278
- }));
14297
+ })().catch((err) => {
14298
+ rendererSetup = null;
14299
+ throw err;
14300
+ });
15279
14301
  }
14302
+ await rendererSetup;
14303
+ state = store.getState();
14304
+ renderer = state.internal.actualRenderer;
15280
14305
  }
15281
14306
  let raycaster = state.raycaster;
15282
14307
  if (!raycaster) state.set({ raycaster: raycaster = new Raycaster() });
@@ -15369,7 +14394,7 @@ function createRoot(canvas) {
15369
14394
  lastConfiguredProps.performance = performance;
15370
14395
  }
15371
14396
  if (!state.xr) {
15372
- const handleXRFrame = (timestamp, frame) => {
14397
+ const handleXRFrame = (timestamp, _frame) => {
15373
14398
  const state2 = store.getState();
15374
14399
  if (state2.frameloop === "never") return;
15375
14400
  advance(timestamp);
@@ -15405,15 +14430,22 @@ function createRoot(canvas) {
15405
14430
  const oldType = renderer.shadowMap.type;
15406
14431
  renderer.shadowMap.enabled = !!shadows;
15407
14432
  if (is.boo(shadows)) {
15408
- renderer.shadowMap.type = PCFSoftShadowMap;
14433
+ renderer.shadowMap.type = PCFShadowMap;
15409
14434
  } else if (is.str(shadows)) {
14435
+ if (shadows === "soft") {
14436
+ notifyDepreciated({
14437
+ heading: 'shadows="soft" is deprecated',
14438
+ body: "Three has depreciated soft and improved basic PCFShadows, we converted for you.",
14439
+ link: "https://github.com/mrdoob/three.js/wiki/Migration-Guide?utm_source=chatgpt.com#181--182"
14440
+ });
14441
+ }
15410
14442
  const types = {
15411
14443
  basic: BasicShadowMap,
15412
14444
  percentage: PCFShadowMap,
15413
- soft: PCFSoftShadowMap,
14445
+ soft: PCFShadowMap,
15414
14446
  variance: VSMShadowMap
15415
14447
  };
15416
- renderer.shadowMap.type = types[shadows] ?? PCFSoftShadowMap;
14448
+ renderer.shadowMap.type = types[shadows] ?? PCFShadowMap;
15417
14449
  } else if (is.obj(shadows)) {
15418
14450
  Object.assign(renderer.shadowMap, shadows);
15419
14451
  }
@@ -15429,13 +14461,24 @@ function createRoot(canvas) {
15429
14461
  if (state.textureColorSpace !== textureColorSpace) state.set(() => ({ textureColorSpace }));
15430
14462
  lastConfiguredProps.textureColorSpace = textureColorSpace;
15431
14463
  }
14464
+ const r3fProps = ["textureColorSpace"];
14465
+ const constructorOnlyProps = ["samples", "antialias", "alpha", "canvas", "powerPreference"];
14466
+ const nonApplyProps = [...r3fProps, ...constructorOnlyProps];
15432
14467
  if (glConfig && !is.fun(glConfig) && !isRenderer(glConfig) && !is.equ(glConfig, renderer, shallowLoose)) {
15433
- applyProps(renderer, glConfig);
14468
+ const glProps = {};
14469
+ for (const key in glConfig) {
14470
+ if (!nonApplyProps.includes(key)) glProps[key] = glConfig[key];
14471
+ }
14472
+ applyProps(renderer, glProps);
15434
14473
  }
15435
14474
  if (rendererConfig && !is.fun(rendererConfig) && !isRenderer(rendererConfig) && state.renderer) {
15436
14475
  const currentRenderer = state.renderer;
15437
14476
  if (!is.equ(rendererConfig, currentRenderer, shallowLoose)) {
15438
- applyProps(currentRenderer, rendererConfig);
14477
+ const rendererProps = {};
14478
+ for (const key in rendererConfig) {
14479
+ if (!nonApplyProps.includes(key)) rendererProps[key] = rendererConfig[key];
14480
+ }
14481
+ applyProps(currentRenderer, rendererProps);
15439
14482
  }
15440
14483
  }
15441
14484
  const scheduler = getScheduler();
@@ -15483,7 +14526,7 @@ function createRoot(canvas) {
15483
14526
  {
15484
14527
  id: `${newRootId}_frustum`,
15485
14528
  rootId: newRootId,
15486
- phase: "preRender",
14529
+ before: "render",
15487
14530
  system: true
15488
14531
  }
15489
14532
  );
@@ -15495,7 +14538,7 @@ function createRoot(canvas) {
15495
14538
  {
15496
14539
  id: `${newRootId}_visibility`,
15497
14540
  rootId: newRootId,
15498
- phase: "preRender",
14541
+ before: "render",
15499
14542
  system: true,
15500
14543
  after: `${newRootId}_frustum`
15501
14544
  }
@@ -15608,7 +14651,8 @@ function unmountComponentAtNode(canvas, callback) {
15608
14651
  dispose(state.scene);
15609
14652
  _roots.delete(canvas);
15610
14653
  if (callback) callback(canvas);
15611
- } catch {
14654
+ } catch (error) {
14655
+ console.warn("[R3F] Error while unmounting root; teardown may be incomplete:", error);
15612
14656
  }
15613
14657
  }, 500);
15614
14658
  }
@@ -15671,6 +14715,7 @@ function PortalInner({ state = {}, children, container }) {
15671
14715
  viewport = rootState.viewport.getCurrentViewport(camera, new Vector3(), resolvedSize);
15672
14716
  if (camera !== rootState.camera) updateCamera(camera, resolvedSize);
15673
14717
  }
14718
+ const set = injectState.set;
15674
14719
  return {
15675
14720
  // The intersect consists of the previous root state
15676
14721
  ...rootState,
@@ -15689,7 +14734,7 @@ function PortalInner({ state = {}, children, container }) {
15689
14734
  size: resolvedSize,
15690
14735
  viewport: { ...rootState.viewport, ...viewport },
15691
14736
  // Layers are allowed to override events
15692
- setEvents: (events2) => injectState.set((state2) => ({ ...state2, events: { ...state2.events, ...events2 } })),
14737
+ setEvents: (events2) => set((state2) => ({ ...state2, events: { ...state2.events, ...events2 } })),
15693
14738
  // Container for child attachment - the portalScene (injected or container itself)
15694
14739
  internal: { ...rootState.internal, ...injectState.internal, container: portalScene }
15695
14740
  };
@@ -15718,6 +14763,81 @@ function flushSync(fn) {
15718
14763
  return reconciler.flushSyncFromReconciler(fn);
15719
14764
  }
15720
14765
 
14766
+ function parseBackground(background) {
14767
+ if (!background) return null;
14768
+ if (typeof background === "object" && !background.isColor) {
14769
+ const { backgroundMap, envMap, files, preset, ...rest } = background;
14770
+ return {
14771
+ ...rest,
14772
+ preset,
14773
+ files: envMap || files,
14774
+ backgroundFiles: backgroundMap,
14775
+ background: true
14776
+ };
14777
+ }
14778
+ if (typeof background === "number") {
14779
+ return { color: background, background: true };
14780
+ }
14781
+ if (typeof background === "string") {
14782
+ if (background in presetsObj) {
14783
+ return { preset: background, background: true };
14784
+ }
14785
+ if (/^(https?:\/\/|\/|\.\/|\.\.\/)|\.(hdr|exr|jpg|jpeg|png|webp|gif)$/i.test(background)) {
14786
+ return { files: background, background: true };
14787
+ }
14788
+ return { color: background, background: true };
14789
+ }
14790
+ if (background.isColor) {
14791
+ return { color: background, background: true };
14792
+ }
14793
+ return null;
14794
+ }
14795
+
14796
+ function parseRendererConfig(rendererProp) {
14797
+ const isRendererConfig = typeof rendererProp === "object" && rendererProp !== null && !("render" in rendererProp) && ("primaryCanvas" in rendererProp || "scheduler" in rendererProp);
14798
+ if (isRendererConfig) {
14799
+ const { primaryCanvas: pc, scheduler: sc, ...rest } = rendererProp;
14800
+ return {
14801
+ primaryCanvas: pc,
14802
+ scheduler: sc,
14803
+ renderer: Object.keys(rest).length > 0 ? rest : rendererProp
14804
+ };
14805
+ }
14806
+ return { primaryCanvas: void 0, scheduler: void 0, renderer: rendererProp };
14807
+ }
14808
+
14809
+ const RESOURCE_KINDS = ["nodes", "uniforms", "buffers", "gpuStorage"];
14810
+ const registries = /* @__PURE__ */ new WeakMap();
14811
+ function getKindRegistry(store, kind) {
14812
+ let registry = registries.get(store);
14813
+ if (!registry) {
14814
+ registry = {
14815
+ nodes: { valid: /* @__PURE__ */ new Set(), staged: /* @__PURE__ */ new Map() },
14816
+ uniforms: { valid: /* @__PURE__ */ new Set(), staged: /* @__PURE__ */ new Map() },
14817
+ buffers: { valid: /* @__PURE__ */ new Set(), staged: /* @__PURE__ */ new Map() },
14818
+ gpuStorage: { valid: /* @__PURE__ */ new Set(), staged: /* @__PURE__ */ new Map() }
14819
+ };
14820
+ registries.set(store, registry);
14821
+ }
14822
+ return registry[kind];
14823
+ }
14824
+ function invalidateResource(store, kind, scopeKey) {
14825
+ const registry = getKindRegistry(store, kind);
14826
+ {
14827
+ registry.valid.clear();
14828
+ registry.staged.clear();
14829
+ }
14830
+ }
14831
+ function invalidateAllResources(store) {
14832
+ for (const kind of RESOURCE_KINDS) invalidateResource(store, kind);
14833
+ }
14834
+
14835
+ function clearHmrCaches(store) {
14836
+ const primary = store.getState().primaryStore ?? store;
14837
+ invalidateAllResources(primary);
14838
+ primary.setState((state) => ({ _hmrVersion: state._hmrVersion + 1 }));
14839
+ }
14840
+
15721
14841
  function CanvasImpl({
15722
14842
  ref,
15723
14843
  children,
@@ -15738,6 +14858,8 @@ function CanvasImpl({
15738
14858
  raycaster,
15739
14859
  camera,
15740
14860
  scene,
14861
+ autoUpdateFrustum,
14862
+ occlusion,
15741
14863
  onPointerMissed,
15742
14864
  onDragOverMissed,
15743
14865
  onDropMissed,
@@ -15749,39 +14871,10 @@ function CanvasImpl({
15749
14871
  forceEven,
15750
14872
  ...props
15751
14873
  }) {
15752
- const { primaryCanvas, scheduler, ...rendererConfig } = typeof rendererProp === "object" && rendererProp !== null && !("render" in rendererProp) && ("primaryCanvas" in rendererProp || "scheduler" in rendererProp) ? rendererProp : { primaryCanvas: void 0, scheduler: void 0 };
15753
- const renderer = Object.keys(rendererConfig).length > 0 ? rendererConfig : rendererProp;
14874
+ const { primaryCanvas, scheduler, renderer } = parseRendererConfig(rendererProp);
15754
14875
  React.useMemo(() => extend(THREE), []);
15755
14876
  const Bridge = useBridge();
15756
- const backgroundProps = React.useMemo(() => {
15757
- if (!background) return null;
15758
- if (typeof background === "object" && !background.isColor) {
15759
- const { backgroundMap, envMap, files, preset, ...rest } = background;
15760
- return {
15761
- ...rest,
15762
- preset,
15763
- files: envMap || files,
15764
- backgroundFiles: backgroundMap,
15765
- background: true
15766
- };
15767
- }
15768
- if (typeof background === "number") {
15769
- return { color: background, background: true };
15770
- }
15771
- if (typeof background === "string") {
15772
- if (background in presetsObj) {
15773
- return { preset: background, background: true };
15774
- }
15775
- if (/^(https?:\/\/|\/|\.\/|\.\.\/)|\\.(hdr|exr|jpg|jpeg|png|webp|gif)$/i.test(background)) {
15776
- return { files: background, background: true };
15777
- }
15778
- return { color: background, background: true };
15779
- }
15780
- if (background.isColor) {
15781
- return { color: background, background: true };
15782
- }
15783
- return null;
15784
- }, [background]);
14877
+ const backgroundProps = React.useMemo(() => parseBackground(background), [background]);
15785
14878
  const hasInitialSizeRef = React.useRef(false);
15786
14879
  const measureConfig = React.useMemo(() => {
15787
14880
  if (!hasInitialSizeRef.current) {
@@ -15823,6 +14916,7 @@ function CanvasImpl({
15823
14916
  const handleDropMissed = useMutableCallback(onDropMissed);
15824
14917
  const [block, setBlock] = React.useState(false);
15825
14918
  const [error, setError] = React.useState(false);
14919
+ const [fallbackVisible, setFallbackVisible] = React.useState(false);
15826
14920
  if (block) throw block;
15827
14921
  if (error) throw error;
15828
14922
  const root = React.useRef(null);
@@ -15830,6 +14924,7 @@ function CanvasImpl({
15830
14924
  const unsubscribeErrorRef = React.useRef(null);
15831
14925
  useIsomorphicLayoutEffect(() => {
15832
14926
  effectActiveRef.current = true;
14927
+ if (fallbackVisible) return;
15833
14928
  const canvas = canvasRef.current;
15834
14929
  if (effectiveSize.width > 0 && effectiveSize.height > 0 && canvas) {
15835
14930
  if (!root.current) {
@@ -15850,7 +14945,7 @@ function CanvasImpl({
15850
14945
  }
15851
14946
  async function run() {
15852
14947
  if (!effectActiveRef.current || !root.current) return;
15853
- await root.current.configure({
14948
+ const configured = await root.current.configure({
15854
14949
  id,
15855
14950
  primaryCanvas,
15856
14951
  scheduler,
@@ -15865,6 +14960,8 @@ function CanvasImpl({
15865
14960
  performance,
15866
14961
  raycaster,
15867
14962
  camera,
14963
+ autoUpdateFrustum,
14964
+ occlusion,
15868
14965
  size: effectiveSize,
15869
14966
  // Store size props for reset functionality
15870
14967
  _sizeProps: width !== void 0 || height !== void 0 ? { width, height } : null,
@@ -15889,8 +14986,20 @@ function CanvasImpl({
15889
14986
  }
15890
14987
  onCreated?.(state);
15891
14988
  }
15892
- });
15893
- if (!effectActiveRef.current || !root.current) return;
14989
+ }).then(
14990
+ () => true,
14991
+ // Renderer setup failed (e.g. no WebGL/WebGPU support). The `fallback` prop lives
14992
+ // inside <canvas>, which browsers don't display, so surface it as visible DOM
14993
+ // instead; with no fallback, rethrow to an external error boundary. (#3757)
14994
+ (setupError) => {
14995
+ if (effectActiveRef.current) {
14996
+ if (fallback != null) setFallbackVisible(true);
14997
+ else setError(setupError);
14998
+ }
14999
+ return false;
15000
+ }
15001
+ );
15002
+ if (!configured || !effectActiveRef.current || !root.current) return;
15894
15003
  root.current.render(
15895
15004
  /* @__PURE__ */ jsx(Bridge, { children: /* @__PURE__ */ jsx(ErrorBoundary, { set: setError, children: /* @__PURE__ */ jsxs(React.Suspense, { fallback: /* @__PURE__ */ jsx(Block, { set: setBlock }), children: [
15896
15005
  backgroundProps && /* @__PURE__ */ jsx(Environment, { ...backgroundProps }),
@@ -15924,14 +15033,7 @@ function CanvasImpl({
15924
15033
  const handleHMR = () => {
15925
15034
  queueMicrotask(() => {
15926
15035
  const rootEntry = _roots.get(canvas);
15927
- if (rootEntry?.store) {
15928
- console.log("[R3F] HMR detected \u2014 rebuilding nodes/uniforms");
15929
- rootEntry.store.setState((state) => ({
15930
- nodes: {},
15931
- uniforms: {},
15932
- _hmrVersion: state._hmrVersion + 1
15933
- }));
15934
- }
15036
+ if (rootEntry?.store) clearHmrCaches(rootEntry.store);
15935
15037
  });
15936
15038
  };
15937
15039
  if (typeof import.meta !== "undefined" && import.meta.hot) {
@@ -15960,7 +15062,20 @@ function CanvasImpl({
15960
15062
  ...style
15961
15063
  },
15962
15064
  ...props,
15963
- children: /* @__PURE__ */ jsx("div", { ref: containerRef, className: "r3f-canvas-container", style: { width: "100%", height: "100%" }, children: /* @__PURE__ */ jsx("canvas", { ref: canvasRef, id, className: "r3f-canvas", style: { display: "block" }, children: fallback }) })
15065
+ children: fallbackVisible ? (
15066
+ // Renderer setup failed: render the fallback as visible DOM. Inside <canvas> (below)
15067
+ // it exists in the tree but browsers never paint it, which is the whole bug (#3757).
15068
+ fallback
15069
+ ) : /* @__PURE__ */ jsx("div", { ref: containerRef, className: "r3f-canvas-container", style: { width: "100%", height: "100%" }, children: /* @__PURE__ */ jsx(
15070
+ "canvas",
15071
+ {
15072
+ ref: canvasRef,
15073
+ id,
15074
+ className: "r3f-canvas",
15075
+ style: { display: "block", width: "100%", height: "100%" },
15076
+ children: fallback
15077
+ }
15078
+ ) })
15964
15079
  }
15965
15080
  );
15966
15081
  }
@@ -15970,4 +15085,4 @@ function Canvas(props) {
15970
15085
 
15971
15086
  extend(THREE);
15972
15087
 
15973
- export { Block, Canvas, Environment, EnvironmentCube, EnvironmentMap, EnvironmentPortal, ErrorBoundary, FROM_REF, IsObject, ONCE, Portal, R3F_BUILD_LEGACY, R3F_BUILD_WEBGPU, REACT_INTERNAL_PROPS, RESERVED_PROPS, Scheduler, Texture, _roots, act, 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, getScheduler, getUuidPrefix, hasConstructor, hasPrimary, invalidate, invalidateInstance, is, isColorRepresentation, isCopyable, isFromRef, isObject3D, isOnce, isOrthographicCamera, isRef, isRenderer, isTexture, isVectorLike, once, prepare, presetsObj, reconciler, registerPrimary, removeInteractivity, resolve, unmountComponentAtNode, unregisterPrimary, updateCamera, updateFrustum, useBridge, useEnvironment, useFrame, useGraph, useInstanceHandle, useIsomorphicLayoutEffect, useLoader, useMutableCallback, useRenderTarget, useStore, useTexture, useTextures, useThree, waitForPrimary };
15088
+ 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, act, 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, unmountComponentAtNode, unregisterPrimary, updateCamera, updateFrustum, useBridge, useEnvironment, useFrame, useGraph, useInstanceHandle, useIsomorphicLayoutEffect, useLoader, useMutableCallback, useRenderTarget, useStore, useTexture, useTextures, useThree, waitForPrimary };