@react-three/fiber 10.0.0-canary.c3fa45d → 10.0.0-canary.c49d4cb
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.cjs +352 -1315
- package/dist/index.d.cts +151 -795
- package/dist/index.d.mts +151 -795
- package/dist/index.d.ts +151 -795
- package/dist/index.mjs +326 -1288
- package/dist/legacy.cjs +307 -1270
- package/dist/legacy.d.cts +151 -794
- package/dist/legacy.d.mts +151 -794
- package/dist/legacy.d.ts +151 -794
- package/dist/legacy.mjs +280 -1242
- package/dist/webgpu/index.cjs +395 -1339
- package/dist/webgpu/index.d.cts +168 -794
- package/dist/webgpu/index.d.mts +168 -794
- package/dist/webgpu/index.d.ts +168 -794
- package/dist/webgpu/index.mjs +368 -1311
- package/package.json +4 -3
- package/readme.md +2 -3
package/dist/legacy.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as three from 'three';
|
|
2
|
-
import { WebGLRenderTarget, CubeReflectionMapping, EquirectangularReflectionMapping, CubeTextureLoader, Scene,
|
|
2
|
+
import { WebGLCubeRenderTarget, WebGLRenderTarget, 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, Raycaster, OrthographicCamera, PerspectiveCamera, PCFShadowMap, VSMShadowMap, BasicShadowMap, ACESFilmicToneMapping, WebGLRenderer } from 'three';
|
|
3
3
|
import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
|
|
4
4
|
import * as React from 'react';
|
|
5
5
|
import React__default, { useLayoutEffect, useRef, useMemo, useEffect, useContext, useImperativeHandle, useCallback, useState } from 'react';
|
|
@@ -13,6 +13,8 @@ import { UltraHDRLoader } from 'three/examples/jsm/loaders/UltraHDRLoader.js';
|
|
|
13
13
|
import { GainMapLoader } from '@monogrid/gainmap-js';
|
|
14
14
|
import Tb, { unstable_scheduleCallback, unstable_IdlePriority } from 'scheduler';
|
|
15
15
|
import { createWithEqualityFn } from 'zustand/traditional';
|
|
16
|
+
import { getScheduler } from '@pmndrs/scheduler';
|
|
17
|
+
export { Scheduler, getScheduler } from '@pmndrs/scheduler';
|
|
16
18
|
import { suspend, preload, clear } from 'suspend-react';
|
|
17
19
|
|
|
18
20
|
function _mergeNamespaces(n, m) {
|
|
@@ -40,9 +42,12 @@ const WebGPURenderer = class WebGPURenderer2 {
|
|
|
40
42
|
}
|
|
41
43
|
};
|
|
42
44
|
const RenderTarget = null;
|
|
45
|
+
const CubeRenderTarget = null;
|
|
43
46
|
|
|
44
47
|
const THREE = /*#__PURE__*/_mergeNamespaces({
|
|
45
48
|
__proto__: null,
|
|
49
|
+
CubeRenderTarget: CubeRenderTarget,
|
|
50
|
+
CubeRenderTargetCompat: WebGLCubeRenderTarget,
|
|
46
51
|
Inspector: Inspector,
|
|
47
52
|
R3F_BUILD_LEGACY: R3F_BUILD_LEGACY,
|
|
48
53
|
R3F_BUILD_WEBGPU: R3F_BUILD_WEBGPU,
|
|
@@ -320,15 +325,16 @@ function EnvironmentPortal({
|
|
|
320
325
|
preset = void 0,
|
|
321
326
|
extensions
|
|
322
327
|
}) {
|
|
323
|
-
const
|
|
328
|
+
const renderer = useThree$1((state) => state.renderer);
|
|
329
|
+
const isLegacy = useThree$1((state) => state.isLegacy);
|
|
324
330
|
const defaultScene = useThree$1((state) => state.scene);
|
|
325
331
|
const camera = React.useRef(null);
|
|
326
332
|
const [virtualScene] = React.useState(() => new Scene());
|
|
327
333
|
const fbo = React.useMemo(() => {
|
|
328
|
-
const fbo2 = new WebGLCubeRenderTarget(resolution);
|
|
334
|
+
const fbo2 = isLegacy ? new WebGLCubeRenderTarget(resolution) : new CubeRenderTarget(resolution);
|
|
329
335
|
fbo2.texture.type = HalfFloatType;
|
|
330
336
|
return fbo2;
|
|
331
|
-
}, [resolution]);
|
|
337
|
+
}, [resolution, isLegacy]);
|
|
332
338
|
React.useEffect(() => {
|
|
333
339
|
return () => {
|
|
334
340
|
fbo.dispose();
|
|
@@ -336,10 +342,10 @@ function EnvironmentPortal({
|
|
|
336
342
|
}, [fbo]);
|
|
337
343
|
React.useLayoutEffect(() => {
|
|
338
344
|
if (frames === 1) {
|
|
339
|
-
const autoClear =
|
|
340
|
-
|
|
341
|
-
camera.current.update(
|
|
342
|
-
|
|
345
|
+
const autoClear = renderer.autoClear;
|
|
346
|
+
renderer.autoClear = true;
|
|
347
|
+
camera.current.update(renderer, virtualScene);
|
|
348
|
+
renderer.autoClear = autoClear;
|
|
343
349
|
}
|
|
344
350
|
return setEnvProps(background, scene, defaultScene, fbo.texture, {
|
|
345
351
|
backgroundBlurriness: blur ?? backgroundBlurriness,
|
|
@@ -356,7 +362,7 @@ function EnvironmentPortal({
|
|
|
356
362
|
defaultScene,
|
|
357
363
|
background,
|
|
358
364
|
frames,
|
|
359
|
-
|
|
365
|
+
renderer,
|
|
360
366
|
blur,
|
|
361
367
|
backgroundBlurriness,
|
|
362
368
|
backgroundIntensity,
|
|
@@ -367,10 +373,10 @@ function EnvironmentPortal({
|
|
|
367
373
|
let count = 1;
|
|
368
374
|
useFrame$1(() => {
|
|
369
375
|
if (frames === Infinity || count < frames) {
|
|
370
|
-
const autoClear =
|
|
371
|
-
|
|
372
|
-
camera.current.update(
|
|
373
|
-
|
|
376
|
+
const autoClear = renderer.autoClear;
|
|
377
|
+
renderer.autoClear = true;
|
|
378
|
+
camera.current.update(renderer, virtualScene);
|
|
379
|
+
renderer.autoClear = autoClear;
|
|
374
380
|
count++;
|
|
375
381
|
}
|
|
376
382
|
});
|
|
@@ -434,9 +440,9 @@ function Environment(props) {
|
|
|
434
440
|
return props.ground ? /* @__PURE__ */ jsx(EnvironmentGround, { ...props }) : props.map ? /* @__PURE__ */ jsx(EnvironmentMap, { ...props }) : props.children ? /* @__PURE__ */ jsx(EnvironmentPortal, { ...props }) : /* @__PURE__ */ jsx(EnvironmentCube, { ...props });
|
|
435
441
|
}
|
|
436
442
|
|
|
437
|
-
var __defProp
|
|
438
|
-
var __defNormalProp
|
|
439
|
-
var __publicField
|
|
443
|
+
var __defProp = Object.defineProperty;
|
|
444
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
445
|
+
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
440
446
|
const act = React["act"];
|
|
441
447
|
const useIsomorphicLayoutEffect = /* @__PURE__ */ (() => typeof window !== "undefined" && (window.document?.createElement || window.navigator?.product === "ReactNative"))() ? React.useLayoutEffect : React.useEffect;
|
|
442
448
|
function useMutableCallback(fn) {
|
|
@@ -468,7 +474,7 @@ const ErrorBoundary = /* @__PURE__ */ (() => {
|
|
|
468
474
|
return _a = class extends React.Component {
|
|
469
475
|
constructor() {
|
|
470
476
|
super(...arguments);
|
|
471
|
-
__publicField
|
|
477
|
+
__publicField(this, "state", { error: false });
|
|
472
478
|
}
|
|
473
479
|
componentDidCatch(err) {
|
|
474
480
|
this.props.set(err);
|
|
@@ -476,7 +482,7 @@ const ErrorBoundary = /* @__PURE__ */ (() => {
|
|
|
476
482
|
render() {
|
|
477
483
|
return this.state.error ? null : this.props.children;
|
|
478
484
|
}
|
|
479
|
-
}, __publicField
|
|
485
|
+
}, __publicField(_a, "getDerivedStateFromError", () => ({ error: true })), _a;
|
|
480
486
|
})();
|
|
481
487
|
|
|
482
488
|
const is = {
|
|
@@ -613,8 +619,7 @@ function prepare(target, root, type, props) {
|
|
|
613
619
|
object,
|
|
614
620
|
eventCount: 0,
|
|
615
621
|
handlers: {},
|
|
616
|
-
isHidden: false
|
|
617
|
-
deferredRefs: []
|
|
622
|
+
isHidden: false
|
|
618
623
|
};
|
|
619
624
|
if (object) object.__r3f = instance;
|
|
620
625
|
}
|
|
@@ -771,6 +776,17 @@ function unregisterVisibility(store, object) {
|
|
|
771
776
|
internal.visibilityRegistry.delete(object.uuid);
|
|
772
777
|
internal.occlusionCache.delete(object);
|
|
773
778
|
}
|
|
779
|
+
function updateVisibilityHandlers(store, object, handlers) {
|
|
780
|
+
const { internal } = store.getState();
|
|
781
|
+
const entry = internal.visibilityRegistry.get(object.uuid);
|
|
782
|
+
if (!entry) return false;
|
|
783
|
+
entry.handlers = handlers;
|
|
784
|
+
if ((handlers.onOccluded || handlers.onVisible) && !internal.occlusionEnabled) {
|
|
785
|
+
object.occlusionTest = true;
|
|
786
|
+
enableOcclusion(store);
|
|
787
|
+
}
|
|
788
|
+
return true;
|
|
789
|
+
}
|
|
774
790
|
function checkVisibility(state) {
|
|
775
791
|
const { internal, camera } = state;
|
|
776
792
|
const registry = internal.visibilityRegistry;
|
|
@@ -958,10 +974,7 @@ function applyProps(object, props) {
|
|
|
958
974
|
continue;
|
|
959
975
|
}
|
|
960
976
|
if (value === void 0) continue;
|
|
961
|
-
if (isFromRef(value))
|
|
962
|
-
instance?.deferredRefs?.push({ prop, ref: value[FROM_REF] });
|
|
963
|
-
continue;
|
|
964
|
-
}
|
|
977
|
+
if (isFromRef(value)) continue;
|
|
965
978
|
if (isOnce(value)) {
|
|
966
979
|
if (instance?.appliedOnce?.has(prop)) continue;
|
|
967
980
|
if (instance) {
|
|
@@ -997,6 +1010,19 @@ function applyProps(object, props) {
|
|
|
997
1010
|
} else if (isVectorLike(target) && is.num(value)) {
|
|
998
1011
|
if ("setScalar" in target && typeof target.setScalar === "function") target.setScalar(value);
|
|
999
1012
|
else target.set(value);
|
|
1013
|
+
} else if (root instanceof ShaderMaterial && key === "uniforms" && is.obj(value)) {
|
|
1014
|
+
if (!is.obj(root.uniforms)) root.uniforms = {};
|
|
1015
|
+
const uniforms = root.uniforms;
|
|
1016
|
+
const nextUniforms = value;
|
|
1017
|
+
for (const name in nextUniforms) {
|
|
1018
|
+
const uniform = nextUniforms[name];
|
|
1019
|
+
const targetUniform = uniforms[name];
|
|
1020
|
+
if (targetUniform) Object.assign(targetUniform, uniform);
|
|
1021
|
+
else {
|
|
1022
|
+
const nextUniform = uniform instanceof Uniform ? uniform.clone() : new Uniform(uniform.value);
|
|
1023
|
+
uniforms[name] = nextUniform;
|
|
1024
|
+
}
|
|
1025
|
+
}
|
|
1000
1026
|
} else {
|
|
1001
1027
|
root[key] = value;
|
|
1002
1028
|
if (key.endsWith("Node") && root.isMaterial) {
|
|
@@ -1015,6 +1041,9 @@ function applyProps(object, props) {
|
|
|
1015
1041
|
if (instance.eventCount && object2.raycast !== null) {
|
|
1016
1042
|
rootState.internal.interaction.push(object2);
|
|
1017
1043
|
}
|
|
1044
|
+
}
|
|
1045
|
+
if (instance?.parent && rootState?.internal && instance.object?.isObject3D) {
|
|
1046
|
+
const object2 = instance.object;
|
|
1018
1047
|
const root = findInitialRoot(instance);
|
|
1019
1048
|
const visibilityHandlers = {
|
|
1020
1049
|
onFramed: instance.handlers.onFramed,
|
|
@@ -1022,7 +1051,9 @@ function applyProps(object, props) {
|
|
|
1022
1051
|
onVisible: instance.handlers.onVisible
|
|
1023
1052
|
};
|
|
1024
1053
|
if (hasVisibilityHandlers(visibilityHandlers)) {
|
|
1025
|
-
|
|
1054
|
+
if (!updateVisibilityHandlers(root, object2, visibilityHandlers)) {
|
|
1055
|
+
registerVisibility(root, object2, visibilityHandlers);
|
|
1056
|
+
}
|
|
1026
1057
|
} else {
|
|
1027
1058
|
unregisterVisibility(root, object2);
|
|
1028
1059
|
}
|
|
@@ -1550,6 +1581,7 @@ function createPointerEvents(store) {
|
|
|
1550
1581
|
set((state) => ({ events: { ...state.events, connected: void 0 } }));
|
|
1551
1582
|
}
|
|
1552
1583
|
},
|
|
1584
|
+
// PREVIEW (A8): the XR pointer registration API may change before stable.
|
|
1553
1585
|
registerPointer: (config) => {
|
|
1554
1586
|
const pointerId = nextXRPointerId++;
|
|
1555
1587
|
xrPointers.set(pointerId, config);
|
|
@@ -1636,1036 +1668,11 @@ function notifyAlpha({ message, link }) {
|
|
|
1636
1668
|
}
|
|
1637
1669
|
}
|
|
1638
1670
|
|
|
1639
|
-
|
|
1640
|
-
|
|
1641
|
-
|
|
1642
|
-
const
|
|
1643
|
-
|
|
1644
|
-
constructor() {
|
|
1645
|
-
/** Ordered list of phase nodes */
|
|
1646
|
-
__publicField$1(this, "phases", []);
|
|
1647
|
-
/** Quick lookup by name */
|
|
1648
|
-
__publicField$1(this, "phaseMap", /* @__PURE__ */ new Map());
|
|
1649
|
-
/** Cached ordered names (invalidated on changes) */
|
|
1650
|
-
__publicField$1(this, "orderedNamesCache", null);
|
|
1651
|
-
this.initializeDefaultPhases();
|
|
1652
|
-
}
|
|
1653
|
-
//* Initialization --------------------------------
|
|
1654
|
-
initializeDefaultPhases() {
|
|
1655
|
-
for (const name of DEFAULT_PHASES) {
|
|
1656
|
-
const node = { name, isAutoGenerated: false };
|
|
1657
|
-
this.phases.push(node);
|
|
1658
|
-
this.phaseMap.set(name, node);
|
|
1659
|
-
}
|
|
1660
|
-
this.invalidateCache();
|
|
1661
|
-
}
|
|
1662
|
-
//* Public API --------------------------------
|
|
1663
|
-
/**
|
|
1664
|
-
* Add a named phase to the graph
|
|
1665
|
-
* @param name - Phase name (must be unique)
|
|
1666
|
-
* @param options - Position options (before or after another phase)
|
|
1667
|
-
*/
|
|
1668
|
-
addPhase(name, options = {}) {
|
|
1669
|
-
if (this.phaseMap.has(name)) {
|
|
1670
|
-
console.warn(`[useFrame] Phase "${name}" already exists`);
|
|
1671
|
-
return;
|
|
1672
|
-
}
|
|
1673
|
-
const { before, after } = options;
|
|
1674
|
-
const node = { name, isAutoGenerated: false };
|
|
1675
|
-
let insertIndex = this.phases.length;
|
|
1676
|
-
const targetIndex = this.getPhaseIndex(before ?? after);
|
|
1677
|
-
if (targetIndex !== -1) {
|
|
1678
|
-
insertIndex = before ? targetIndex : targetIndex + 1;
|
|
1679
|
-
} else {
|
|
1680
|
-
const constraintType = before ? "before" : "after";
|
|
1681
|
-
console.warn(`[useFrame] Phase "${before ?? after}" not found for '${constraintType}' constraint`);
|
|
1682
|
-
}
|
|
1683
|
-
this.phases.splice(insertIndex, 0, node);
|
|
1684
|
-
this.phaseMap.set(name, node);
|
|
1685
|
-
this.invalidateCache();
|
|
1686
|
-
}
|
|
1687
|
-
/**
|
|
1688
|
-
* Get ordered list of phase names
|
|
1689
|
-
*/
|
|
1690
|
-
getOrderedPhases() {
|
|
1691
|
-
if (this.orderedNamesCache === null) this.orderedNamesCache = this.phases.map((p) => p.name);
|
|
1692
|
-
return this.orderedNamesCache;
|
|
1693
|
-
}
|
|
1694
|
-
/**
|
|
1695
|
-
* Check if a phase exists
|
|
1696
|
-
*/
|
|
1697
|
-
hasPhase(name) {
|
|
1698
|
-
return this.phaseMap.has(name);
|
|
1699
|
-
}
|
|
1700
|
-
/**
|
|
1701
|
-
* Get the index of a phase (-1 if not found)
|
|
1702
|
-
*/
|
|
1703
|
-
getPhaseIndex(name) {
|
|
1704
|
-
if (!name) return -1;
|
|
1705
|
-
return this.phases.findIndex((p) => p.name === name);
|
|
1706
|
-
}
|
|
1707
|
-
/**
|
|
1708
|
-
* Ensure a phase exists, creating an auto-generated one if needed.
|
|
1709
|
-
* Used for resolving before/after constraints.
|
|
1710
|
-
*
|
|
1711
|
-
* @param name - The phase name to ensure exists
|
|
1712
|
-
* @returns The phase name (may be auto-generated like 'before:render')
|
|
1713
|
-
*/
|
|
1714
|
-
ensurePhase(name) {
|
|
1715
|
-
if (this.phaseMap.has(name)) return name;
|
|
1716
|
-
const node = { name, isAutoGenerated: true };
|
|
1717
|
-
this.phases.push(node);
|
|
1718
|
-
this.phaseMap.set(name, node);
|
|
1719
|
-
this.invalidateCache();
|
|
1720
|
-
return name;
|
|
1721
|
-
}
|
|
1722
|
-
/**
|
|
1723
|
-
* Resolve where a job with before/after constraints should go.
|
|
1724
|
-
* Creates auto-generated phases if needed.
|
|
1725
|
-
*
|
|
1726
|
-
* @param before - Phase(s) to run before
|
|
1727
|
-
* @param after - Phase(s) to run after
|
|
1728
|
-
* @returns The resolved phase name
|
|
1729
|
-
*/
|
|
1730
|
-
resolveConstraintPhase(before, after) {
|
|
1731
|
-
const beforeArr = before ? Array.isArray(before) ? before : [before] : [];
|
|
1732
|
-
const afterArr = after ? Array.isArray(after) ? after : [after] : [];
|
|
1733
|
-
if (beforeArr.length > 0) {
|
|
1734
|
-
return this.ensureAutoPhase(beforeArr[0], "before", 0);
|
|
1735
|
-
}
|
|
1736
|
-
if (afterArr.length > 0) {
|
|
1737
|
-
return this.ensureAutoPhase(afterArr[0], "after", 1);
|
|
1738
|
-
}
|
|
1739
|
-
return "update";
|
|
1740
|
-
}
|
|
1741
|
-
/**
|
|
1742
|
-
* Ensure an auto-generated phase exists relative to a target phase.
|
|
1743
|
-
* Creates the phase if it doesn't exist, inserting it at the correct position.
|
|
1744
|
-
*
|
|
1745
|
-
* @param target - The target phase name to position relative to
|
|
1746
|
-
* @param prefix - Prefix for auto-generated phase name ('before' or 'after')
|
|
1747
|
-
* @param offset - Insertion offset (0 for before, 1 for after)
|
|
1748
|
-
* @returns The auto-generated phase name
|
|
1749
|
-
*/
|
|
1750
|
-
ensureAutoPhase(target, prefix, offset) {
|
|
1751
|
-
const autoName = `${prefix}:${target}`;
|
|
1752
|
-
if (this.phaseMap.has(autoName)) return autoName;
|
|
1753
|
-
const node = { name: autoName, isAutoGenerated: true };
|
|
1754
|
-
const targetIndex = this.getPhaseIndex(target);
|
|
1755
|
-
if (targetIndex !== -1) this.phases.splice(targetIndex + offset, 0, node);
|
|
1756
|
-
else this.phases.push(node);
|
|
1757
|
-
this.phaseMap.set(autoName, node);
|
|
1758
|
-
this.invalidateCache();
|
|
1759
|
-
return autoName;
|
|
1760
|
-
}
|
|
1761
|
-
// Internal --------------------------------
|
|
1762
|
-
invalidateCache() {
|
|
1763
|
-
this.orderedNamesCache = null;
|
|
1764
|
-
}
|
|
1765
|
-
}
|
|
1766
|
-
|
|
1767
|
-
function rebuildSortedJobs(jobs, phaseGraph) {
|
|
1768
|
-
const orderedPhases = phaseGraph.getOrderedPhases();
|
|
1769
|
-
const buckets = /* @__PURE__ */ new Map();
|
|
1770
|
-
for (const phase of orderedPhases) {
|
|
1771
|
-
buckets.set(phase, []);
|
|
1772
|
-
}
|
|
1773
|
-
for (const job of jobs.values()) {
|
|
1774
|
-
if (!job.enabled) continue;
|
|
1775
|
-
let bucket = buckets.get(job.phase);
|
|
1776
|
-
if (!bucket) {
|
|
1777
|
-
bucket = [];
|
|
1778
|
-
buckets.set(job.phase, bucket);
|
|
1779
|
-
}
|
|
1780
|
-
bucket.push(job);
|
|
1781
|
-
}
|
|
1782
|
-
const sortedBuckets = [];
|
|
1783
|
-
for (const phase of orderedPhases) {
|
|
1784
|
-
const bucket = buckets.get(phase);
|
|
1785
|
-
if (!bucket || bucket.length === 0) continue;
|
|
1786
|
-
bucket.sort((a, b) => {
|
|
1787
|
-
if (a.priority !== b.priority) return b.priority - a.priority;
|
|
1788
|
-
return a.index - b.index;
|
|
1789
|
-
});
|
|
1790
|
-
sortedBuckets.push(hasCrossJobConstraints(bucket) ? topologicalSort(bucket) : bucket);
|
|
1791
|
-
}
|
|
1792
|
-
for (const [phase, bucket] of buckets) {
|
|
1793
|
-
if (!orderedPhases.includes(phase) && bucket.length > 0) {
|
|
1794
|
-
bucket.sort((a, b) => {
|
|
1795
|
-
if (a.priority !== b.priority) return b.priority - a.priority;
|
|
1796
|
-
return a.index - b.index;
|
|
1797
|
-
});
|
|
1798
|
-
sortedBuckets.push(bucket);
|
|
1799
|
-
}
|
|
1800
|
-
}
|
|
1801
|
-
return sortedBuckets.flat();
|
|
1802
|
-
}
|
|
1803
|
-
function hasCrossJobConstraints(bucket) {
|
|
1804
|
-
const jobIds = new Set(bucket.map((j) => j.id));
|
|
1805
|
-
for (const job of bucket) {
|
|
1806
|
-
for (const ref of job.before) {
|
|
1807
|
-
if (jobIds.has(ref)) return true;
|
|
1808
|
-
}
|
|
1809
|
-
for (const ref of job.after) {
|
|
1810
|
-
if (jobIds.has(ref)) return true;
|
|
1811
|
-
}
|
|
1812
|
-
}
|
|
1813
|
-
return false;
|
|
1814
|
-
}
|
|
1815
|
-
function topologicalSort(jobs) {
|
|
1816
|
-
const n = jobs.length;
|
|
1817
|
-
if (n <= 1) return jobs;
|
|
1818
|
-
const jobMap = /* @__PURE__ */ new Map();
|
|
1819
|
-
const inDegree = /* @__PURE__ */ new Map();
|
|
1820
|
-
const adjacency = /* @__PURE__ */ new Map();
|
|
1821
|
-
for (const job of jobs) {
|
|
1822
|
-
jobMap.set(job.id, job);
|
|
1823
|
-
inDegree.set(job.id, 0);
|
|
1824
|
-
adjacency.set(job.id, []);
|
|
1825
|
-
}
|
|
1826
|
-
for (const job of jobs) {
|
|
1827
|
-
for (const ref of job.before) {
|
|
1828
|
-
if (jobMap.has(ref)) {
|
|
1829
|
-
adjacency.get(job.id).push(ref);
|
|
1830
|
-
inDegree.set(ref, inDegree.get(ref) + 1);
|
|
1831
|
-
}
|
|
1832
|
-
}
|
|
1833
|
-
for (const ref of job.after) {
|
|
1834
|
-
if (jobMap.has(ref)) {
|
|
1835
|
-
adjacency.get(ref).push(job.id);
|
|
1836
|
-
inDegree.set(job.id, inDegree.get(job.id) + 1);
|
|
1837
|
-
}
|
|
1838
|
-
}
|
|
1839
|
-
}
|
|
1840
|
-
const queue = [];
|
|
1841
|
-
for (const job of jobs) {
|
|
1842
|
-
if (inDegree.get(job.id) === 0) {
|
|
1843
|
-
queue.push(job);
|
|
1844
|
-
}
|
|
1845
|
-
}
|
|
1846
|
-
queue.sort((a, b) => {
|
|
1847
|
-
if (a.priority !== b.priority) return b.priority - a.priority;
|
|
1848
|
-
return a.index - b.index;
|
|
1849
|
-
});
|
|
1850
|
-
const result = [];
|
|
1851
|
-
while (queue.length > 0) {
|
|
1852
|
-
const job = queue.shift();
|
|
1853
|
-
result.push(job);
|
|
1854
|
-
const neighbors = adjacency.get(job.id) || [];
|
|
1855
|
-
for (const neighborId of neighbors) {
|
|
1856
|
-
const newDegree = inDegree.get(neighborId) - 1;
|
|
1857
|
-
inDegree.set(neighborId, newDegree);
|
|
1858
|
-
if (newDegree === 0) {
|
|
1859
|
-
const neighbor = jobMap.get(neighborId);
|
|
1860
|
-
insertSorted(queue, neighbor);
|
|
1861
|
-
}
|
|
1862
|
-
}
|
|
1863
|
-
}
|
|
1864
|
-
if (result.length !== n) {
|
|
1865
|
-
console.warn("[useFrame] Circular dependency detected in job constraints");
|
|
1866
|
-
const resultIds = new Set(result.map((j) => j.id));
|
|
1867
|
-
for (const job of jobs) {
|
|
1868
|
-
if (!resultIds.has(job.id)) result.push(job);
|
|
1869
|
-
}
|
|
1870
|
-
}
|
|
1871
|
-
return result;
|
|
1872
|
-
}
|
|
1873
|
-
function insertSorted(arr, job) {
|
|
1874
|
-
let i = 0;
|
|
1875
|
-
while (i < arr.length) {
|
|
1876
|
-
const cmp = arr[i];
|
|
1877
|
-
if (job.priority > cmp.priority || job.priority === cmp.priority && job.index < cmp.index) {
|
|
1878
|
-
break;
|
|
1879
|
-
}
|
|
1880
|
-
i++;
|
|
1881
|
-
}
|
|
1882
|
-
arr.splice(i, 0, job);
|
|
1883
|
-
}
|
|
1884
|
-
|
|
1885
|
-
function shouldRun(job, now) {
|
|
1886
|
-
if (!job.enabled) return false;
|
|
1887
|
-
if (!job.fps) return true;
|
|
1888
|
-
const minInterval = 1e3 / job.fps;
|
|
1889
|
-
const lastRun = job.lastRun ?? 0;
|
|
1890
|
-
const elapsed = now - lastRun;
|
|
1891
|
-
if (elapsed < minInterval - 1) return false;
|
|
1892
|
-
if (job.drop) {
|
|
1893
|
-
job.lastRun = now;
|
|
1894
|
-
} else {
|
|
1895
|
-
const steps = Math.floor(elapsed / minInterval);
|
|
1896
|
-
job.lastRun = lastRun + steps * minInterval;
|
|
1897
|
-
if (job.lastRun < now - minInterval) {
|
|
1898
|
-
job.lastRun = now;
|
|
1899
|
-
}
|
|
1900
|
-
}
|
|
1901
|
-
return true;
|
|
1902
|
-
}
|
|
1903
|
-
function resetJobTiming(job) {
|
|
1904
|
-
job.lastRun = void 0;
|
|
1905
|
-
}
|
|
1906
|
-
|
|
1907
|
-
var __defProp = Object.defineProperty;
|
|
1908
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
1909
|
-
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
1910
|
-
const hmrData = (() => {
|
|
1911
|
-
if (typeof process !== "undefined" && process.env.NODE_ENV === "test") return void 0;
|
|
1912
|
-
if (typeof import_meta_hot !== "undefined") return import_meta_hot;
|
|
1913
|
-
try {
|
|
1914
|
-
return (0, eval)("import.meta.hot");
|
|
1915
|
-
} catch {
|
|
1916
|
-
return void 0;
|
|
1917
|
-
}
|
|
1918
|
-
})();
|
|
1919
|
-
const _Scheduler = class _Scheduler {
|
|
1920
|
-
//* Constructor ================================
|
|
1921
|
-
constructor() {
|
|
1922
|
-
//* Critical State ================================
|
|
1923
|
-
__publicField(this, "roots", /* @__PURE__ */ new Map());
|
|
1924
|
-
__publicField(this, "phaseGraph");
|
|
1925
|
-
__publicField(this, "loopState", {
|
|
1926
|
-
running: false,
|
|
1927
|
-
rafHandle: null,
|
|
1928
|
-
lastTime: null,
|
|
1929
|
-
// null = uninitialized, 0+ = valid timestamp
|
|
1930
|
-
frameCount: 0,
|
|
1931
|
-
elapsedTime: 0,
|
|
1932
|
-
createdAt: performance.now()
|
|
1933
|
-
});
|
|
1934
|
-
__publicField(this, "stoppedTime", 0);
|
|
1935
|
-
//* Private State ================================
|
|
1936
|
-
__publicField(this, "nextRootIndex", 0);
|
|
1937
|
-
__publicField(this, "globalBeforeJobs", /* @__PURE__ */ new Map());
|
|
1938
|
-
__publicField(this, "globalAfterJobs", /* @__PURE__ */ new Map());
|
|
1939
|
-
__publicField(this, "nextGlobalIndex", 0);
|
|
1940
|
-
__publicField(this, "idleCallbacks", /* @__PURE__ */ new Set());
|
|
1941
|
-
__publicField(this, "nextJobIndex", 0);
|
|
1942
|
-
__publicField(this, "jobStateListeners", /* @__PURE__ */ new Map());
|
|
1943
|
-
__publicField(this, "pendingFrames", 0);
|
|
1944
|
-
__publicField(this, "_frameloop", "always");
|
|
1945
|
-
//* Independent Mode & Error Handling State ================================
|
|
1946
|
-
__publicField(this, "_independent", false);
|
|
1947
|
-
__publicField(this, "errorHandler", null);
|
|
1948
|
-
__publicField(this, "rootReadyCallbacks", /* @__PURE__ */ new Set());
|
|
1949
|
-
//* Core Loop Execution Methods ================================
|
|
1950
|
-
/**
|
|
1951
|
-
* Main RAF loop callback.
|
|
1952
|
-
* Executes frame, handles demand mode, and schedules next frame.
|
|
1953
|
-
* @param {number} timestamp - RAF timestamp in milliseconds
|
|
1954
|
-
* @returns {void}
|
|
1955
|
-
* @private
|
|
1956
|
-
*/
|
|
1957
|
-
__publicField(this, "loop", (timestamp) => {
|
|
1958
|
-
if (!this.loopState.running) return;
|
|
1959
|
-
this.executeFrame(timestamp);
|
|
1960
|
-
if (this._frameloop === "demand") {
|
|
1961
|
-
this.pendingFrames = Math.max(0, this.pendingFrames - 1);
|
|
1962
|
-
if (this.pendingFrames === 0) {
|
|
1963
|
-
this.notifyIdle(timestamp);
|
|
1964
|
-
return this.stop();
|
|
1965
|
-
}
|
|
1966
|
-
}
|
|
1967
|
-
this.loopState.rafHandle = requestAnimationFrame(this.loop);
|
|
1968
|
-
});
|
|
1969
|
-
this.phaseGraph = new PhaseGraph();
|
|
1970
|
-
}
|
|
1971
|
-
static get instance() {
|
|
1972
|
-
return globalThis[_Scheduler.INSTANCE_KEY] ?? null;
|
|
1973
|
-
}
|
|
1974
|
-
static set instance(value) {
|
|
1975
|
-
globalThis[_Scheduler.INSTANCE_KEY] = value;
|
|
1976
|
-
}
|
|
1977
|
-
/**
|
|
1978
|
-
* Get the global scheduler instance (creates if doesn't exist).
|
|
1979
|
-
* Uses HMR data to preserve instance across hot reloads.
|
|
1980
|
-
* @returns {Scheduler} The singleton scheduler instance
|
|
1981
|
-
*/
|
|
1982
|
-
static get() {
|
|
1983
|
-
if (!_Scheduler.instance && hmrData?.data?.scheduler) {
|
|
1984
|
-
_Scheduler.instance = hmrData.data.scheduler;
|
|
1985
|
-
}
|
|
1986
|
-
if (!_Scheduler.instance) {
|
|
1987
|
-
_Scheduler.instance = new _Scheduler();
|
|
1988
|
-
if (hmrData?.data) {
|
|
1989
|
-
hmrData.data.scheduler = _Scheduler.instance;
|
|
1990
|
-
}
|
|
1991
|
-
}
|
|
1992
|
-
return _Scheduler.instance;
|
|
1993
|
-
}
|
|
1994
|
-
/**
|
|
1995
|
-
* Reset the singleton instance. Stops the loop and clears all state.
|
|
1996
|
-
* Primarily used for testing to ensure clean state between tests.
|
|
1997
|
-
* @returns {void}
|
|
1998
|
-
*/
|
|
1999
|
-
static reset() {
|
|
2000
|
-
if (_Scheduler.instance) {
|
|
2001
|
-
_Scheduler.instance.stop();
|
|
2002
|
-
_Scheduler.instance = null;
|
|
2003
|
-
}
|
|
2004
|
-
if (hmrData?.data) {
|
|
2005
|
-
hmrData.data.scheduler = null;
|
|
2006
|
-
}
|
|
2007
|
-
}
|
|
2008
|
-
//* Getters & Setters ================================
|
|
2009
|
-
get phases() {
|
|
2010
|
-
return this.phaseGraph.getOrderedPhases();
|
|
2011
|
-
}
|
|
2012
|
-
get frameloop() {
|
|
2013
|
-
return this._frameloop;
|
|
2014
|
-
}
|
|
2015
|
-
set frameloop(mode) {
|
|
2016
|
-
if (this._frameloop === mode) return;
|
|
2017
|
-
const wasAlways = this._frameloop === "always";
|
|
2018
|
-
this._frameloop = mode;
|
|
2019
|
-
if (mode === "always" && !this.loopState.running && this.roots.size > 0) this.start();
|
|
2020
|
-
else if (mode !== "always" && wasAlways) this.stop();
|
|
2021
|
-
}
|
|
2022
|
-
get isRunning() {
|
|
2023
|
-
return this.loopState.running;
|
|
2024
|
-
}
|
|
2025
|
-
get isReady() {
|
|
2026
|
-
return this.roots.size > 0;
|
|
2027
|
-
}
|
|
2028
|
-
get independent() {
|
|
2029
|
-
return this._independent;
|
|
2030
|
-
}
|
|
2031
|
-
set independent(value) {
|
|
2032
|
-
this._independent = value;
|
|
2033
|
-
if (value) this.ensureDefaultRoot();
|
|
2034
|
-
}
|
|
2035
|
-
//* Root Management Methods ================================
|
|
2036
|
-
/**
|
|
2037
|
-
* Register a root (Canvas) with the scheduler.
|
|
2038
|
-
* The first root to register starts the RAF loop (if frameloop='always').
|
|
2039
|
-
* @param {string} id - Unique identifier for this root
|
|
2040
|
-
* @param {RootOptions} [options] - Optional configuration with getState and onError callbacks
|
|
2041
|
-
* @returns {() => void} Unsubscribe function to remove this root
|
|
2042
|
-
*/
|
|
2043
|
-
registerRoot(id, options = {}) {
|
|
2044
|
-
if (this.roots.has(id)) {
|
|
2045
|
-
console.warn(`[Scheduler] Root "${id}" already registered`);
|
|
2046
|
-
return () => this.unregisterRoot(id);
|
|
2047
|
-
}
|
|
2048
|
-
const entry = {
|
|
2049
|
-
id,
|
|
2050
|
-
getState: options.getState ?? (() => ({})),
|
|
2051
|
-
jobs: /* @__PURE__ */ new Map(),
|
|
2052
|
-
sortedJobs: [],
|
|
2053
|
-
needsRebuild: false
|
|
2054
|
-
};
|
|
2055
|
-
if (options.onError) {
|
|
2056
|
-
this.errorHandler = options.onError;
|
|
2057
|
-
}
|
|
2058
|
-
this.roots.set(id, entry);
|
|
2059
|
-
if (this.roots.size === 1) {
|
|
2060
|
-
this.notifyRootReady();
|
|
2061
|
-
if (this._frameloop === "always") this.start();
|
|
2062
|
-
}
|
|
2063
|
-
return () => this.unregisterRoot(id);
|
|
2064
|
-
}
|
|
2065
|
-
/**
|
|
2066
|
-
* Unregister a root from the scheduler.
|
|
2067
|
-
* Cleans up all job state listeners for this root's jobs.
|
|
2068
|
-
* The last root to unregister stops the RAF loop.
|
|
2069
|
-
* @param {string} id - The root ID to unregister
|
|
2070
|
-
* @returns {void}
|
|
2071
|
-
*/
|
|
2072
|
-
unregisterRoot(id) {
|
|
2073
|
-
const root = this.roots.get(id);
|
|
2074
|
-
if (!root) return;
|
|
2075
|
-
for (const jobId of root.jobs.keys()) {
|
|
2076
|
-
this.jobStateListeners.delete(jobId);
|
|
2077
|
-
}
|
|
2078
|
-
this.roots.delete(id);
|
|
2079
|
-
if (this.roots.size === 0) {
|
|
2080
|
-
this.stop();
|
|
2081
|
-
this.errorHandler = null;
|
|
2082
|
-
}
|
|
2083
|
-
}
|
|
2084
|
-
/**
|
|
2085
|
-
* Subscribe to be notified when a root becomes available.
|
|
2086
|
-
* Fires immediately if a root already exists.
|
|
2087
|
-
* @param {() => void} callback - Function called when first root registers
|
|
2088
|
-
* @returns {() => void} Unsubscribe function
|
|
2089
|
-
*/
|
|
2090
|
-
onRootReady(callback) {
|
|
2091
|
-
if (this.roots.size > 0) {
|
|
2092
|
-
callback();
|
|
2093
|
-
return () => {
|
|
2094
|
-
};
|
|
2095
|
-
}
|
|
2096
|
-
this.rootReadyCallbacks.add(callback);
|
|
2097
|
-
return () => this.rootReadyCallbacks.delete(callback);
|
|
2098
|
-
}
|
|
2099
|
-
/**
|
|
2100
|
-
* Notify all registered root-ready callbacks.
|
|
2101
|
-
* Called when the first root registers.
|
|
2102
|
-
* @returns {void}
|
|
2103
|
-
* @private
|
|
2104
|
-
*/
|
|
2105
|
-
notifyRootReady() {
|
|
2106
|
-
for (const cb of this.rootReadyCallbacks) {
|
|
2107
|
-
try {
|
|
2108
|
-
cb();
|
|
2109
|
-
} catch (error) {
|
|
2110
|
-
console.error("[Scheduler] Error in root-ready callback:", error);
|
|
2111
|
-
}
|
|
2112
|
-
}
|
|
2113
|
-
this.rootReadyCallbacks.clear();
|
|
2114
|
-
}
|
|
2115
|
-
/**
|
|
2116
|
-
* Ensure a default root exists for independent mode.
|
|
2117
|
-
* Creates a minimal root with no state provider.
|
|
2118
|
-
* @returns {void}
|
|
2119
|
-
* @private
|
|
2120
|
-
*/
|
|
2121
|
-
ensureDefaultRoot() {
|
|
2122
|
-
if (!this.roots.has("__default__")) {
|
|
2123
|
-
this.registerRoot("__default__");
|
|
2124
|
-
}
|
|
2125
|
-
}
|
|
2126
|
-
/**
|
|
2127
|
-
* Trigger error handling for job errors.
|
|
2128
|
-
* Uses the bound error handler if available, otherwise logs to console.
|
|
2129
|
-
* @param {Error} error - The error to handle
|
|
2130
|
-
* @returns {void}
|
|
2131
|
-
*/
|
|
2132
|
-
triggerError(error) {
|
|
2133
|
-
if (this.errorHandler) this.errorHandler(error);
|
|
2134
|
-
else console.error("[Scheduler]", error);
|
|
2135
|
-
}
|
|
2136
|
-
//* Phase Management Methods ================================
|
|
2137
|
-
/**
|
|
2138
|
-
* Add a named phase to the scheduler's execution order.
|
|
2139
|
-
* Marks all roots for rebuild to incorporate the new phase.
|
|
2140
|
-
* @param {string} name - The phase name (e.g., 'physics', 'postprocess')
|
|
2141
|
-
* @param {AddPhaseOptions} [options] - Positioning options (before/after other phases)
|
|
2142
|
-
* @returns {void}
|
|
2143
|
-
* @example
|
|
2144
|
-
* scheduler.addPhase('physics', { before: 'update' });
|
|
2145
|
-
* scheduler.addPhase('postprocess', { after: 'render' });
|
|
2146
|
-
*/
|
|
2147
|
-
addPhase(name, options) {
|
|
2148
|
-
this.phaseGraph.addPhase(name, options);
|
|
2149
|
-
for (const root of this.roots.values()) {
|
|
2150
|
-
root.needsRebuild = true;
|
|
2151
|
-
}
|
|
2152
|
-
}
|
|
2153
|
-
/**
|
|
2154
|
-
* Check if a phase exists in the scheduler.
|
|
2155
|
-
* @param {string} name - The phase name to check
|
|
2156
|
-
* @returns {boolean} True if the phase exists
|
|
2157
|
-
*/
|
|
2158
|
-
hasPhase(name) {
|
|
2159
|
-
return this.phaseGraph.hasPhase(name);
|
|
2160
|
-
}
|
|
2161
|
-
//* Global Job Registration Methods (Deprecated APIs) ================================
|
|
2162
|
-
/**
|
|
2163
|
-
* Register a global job that runs once per frame (not per-root).
|
|
2164
|
-
* Used internally by deprecated addEffect/addAfterEffect APIs.
|
|
2165
|
-
* @param {'before' | 'after'} phase - When to run: 'before' all roots or 'after' all roots
|
|
2166
|
-
* @param {string} id - Unique identifier for this global job
|
|
2167
|
-
* @param {(timestamp: number) => void} callback - Function called each frame with RAF timestamp
|
|
2168
|
-
* @returns {() => void} Unsubscribe function to remove this global job
|
|
2169
|
-
* @deprecated Use useFrame with phases instead
|
|
2170
|
-
*/
|
|
2171
|
-
registerGlobal(phase, id, callback) {
|
|
2172
|
-
const job = { id, callback };
|
|
2173
|
-
if (phase === "before") {
|
|
2174
|
-
this.globalBeforeJobs.set(id, job);
|
|
2175
|
-
} else {
|
|
2176
|
-
this.globalAfterJobs.set(id, job);
|
|
2177
|
-
}
|
|
2178
|
-
return () => {
|
|
2179
|
-
if (phase === "before") this.globalBeforeJobs.delete(id);
|
|
2180
|
-
else this.globalAfterJobs.delete(id);
|
|
2181
|
-
};
|
|
2182
|
-
}
|
|
2183
|
-
//* Idle Callback Methods (Deprecated API) ================================
|
|
2184
|
-
/**
|
|
2185
|
-
* Register an idle callback that fires when the loop stops.
|
|
2186
|
-
* Used internally by deprecated addTail API.
|
|
2187
|
-
* @param {(timestamp: number) => void} callback - Function called when loop becomes idle
|
|
2188
|
-
* @returns {() => void} Unsubscribe function to remove this idle callback
|
|
2189
|
-
* @deprecated Use demand mode with invalidate() instead
|
|
2190
|
-
*/
|
|
2191
|
-
onIdle(callback) {
|
|
2192
|
-
this.idleCallbacks.add(callback);
|
|
2193
|
-
return () => this.idleCallbacks.delete(callback);
|
|
2194
|
-
}
|
|
2195
|
-
/**
|
|
2196
|
-
* Notify all registered idle callbacks.
|
|
2197
|
-
* Called when the loop stops in demand mode.
|
|
2198
|
-
* @param {number} timestamp - The RAF timestamp when idle occurred
|
|
2199
|
-
* @returns {void}
|
|
2200
|
-
* @private
|
|
2201
|
-
*/
|
|
2202
|
-
notifyIdle(timestamp) {
|
|
2203
|
-
for (const cb of this.idleCallbacks) {
|
|
2204
|
-
try {
|
|
2205
|
-
cb(timestamp);
|
|
2206
|
-
} catch (error) {
|
|
2207
|
-
console.error("[Scheduler] Error in idle callback:", error);
|
|
2208
|
-
}
|
|
2209
|
-
}
|
|
2210
|
-
}
|
|
2211
|
-
//* Job Registration & Management Methods ================================
|
|
2212
|
-
/**
|
|
2213
|
-
* Register a job (frame callback) with a specific root.
|
|
2214
|
-
* This is the core registration method used by useFrame internally.
|
|
2215
|
-
* @param {FrameNextCallback} callback - The function to call each frame
|
|
2216
|
-
* @param {JobOptions & { rootId?: string; system?: boolean }} [options] - Job configuration
|
|
2217
|
-
* @param {string} [options.rootId] - Target root ID (defaults to first registered root)
|
|
2218
|
-
* @param {string} [options.id] - Unique job ID (auto-generated if not provided)
|
|
2219
|
-
* @param {string} [options.phase] - Execution phase (defaults to 'update')
|
|
2220
|
-
* @param {number} [options.priority] - Priority within phase (higher = earlier, default 0)
|
|
2221
|
-
* @param {number} [options.fps] - FPS throttle limit
|
|
2222
|
-
* @param {boolean} [options.drop] - Drop frames when behind (default true)
|
|
2223
|
-
* @param {boolean} [options.enabled] - Whether job is active (default true)
|
|
2224
|
-
* @param {boolean} [options.system] - Internal flag for system jobs (not user-facing)
|
|
2225
|
-
* @returns {() => void} Unsubscribe function to remove this job
|
|
2226
|
-
*/
|
|
2227
|
-
register(callback, options = {}) {
|
|
2228
|
-
const rootId = options.rootId;
|
|
2229
|
-
const root = rootId ? this.roots.get(rootId) : this.roots.values().next().value;
|
|
2230
|
-
if (!root) {
|
|
2231
|
-
console.warn("[Scheduler] No root registered. Is this inside a Canvas?");
|
|
2232
|
-
return () => {
|
|
2233
|
-
};
|
|
2234
|
-
}
|
|
2235
|
-
const id = options.id ?? this.generateJobId();
|
|
2236
|
-
let phase = options.phase ?? "update";
|
|
2237
|
-
if (!options.phase && (options.before || options.after)) {
|
|
2238
|
-
phase = this.phaseGraph.resolveConstraintPhase(options.before, options.after);
|
|
2239
|
-
}
|
|
2240
|
-
const before = this.normalizeConstraints(options.before);
|
|
2241
|
-
const after = this.normalizeConstraints(options.after);
|
|
2242
|
-
const job = {
|
|
2243
|
-
id,
|
|
2244
|
-
callback,
|
|
2245
|
-
phase,
|
|
2246
|
-
before,
|
|
2247
|
-
after,
|
|
2248
|
-
priority: options.priority ?? 0,
|
|
2249
|
-
index: this.nextJobIndex++,
|
|
2250
|
-
fps: options.fps,
|
|
2251
|
-
drop: options.drop ?? true,
|
|
2252
|
-
enabled: options.enabled ?? true,
|
|
2253
|
-
system: options.system ?? false
|
|
2254
|
-
};
|
|
2255
|
-
if (root.jobs.has(id)) {
|
|
2256
|
-
console.warn(`[useFrame] Job with id "${id}" already exists, replacing`);
|
|
2257
|
-
}
|
|
2258
|
-
root.jobs.set(id, job);
|
|
2259
|
-
root.needsRebuild = true;
|
|
2260
|
-
return () => this.unregister(id, root.id);
|
|
2261
|
-
}
|
|
2262
|
-
/**
|
|
2263
|
-
* Unregister a job by its ID.
|
|
2264
|
-
* Searches all roots if rootId is not provided.
|
|
2265
|
-
* @param {string} id - The job ID to unregister
|
|
2266
|
-
* @param {string} [rootId] - Optional root ID to search (searches all if not provided)
|
|
2267
|
-
* @returns {void}
|
|
2268
|
-
*/
|
|
2269
|
-
unregister(id, rootId) {
|
|
2270
|
-
const root = rootId ? this.roots.get(rootId) : Array.from(this.roots.values()).find((r) => r.jobs.has(id));
|
|
2271
|
-
if (root?.jobs.delete(id)) {
|
|
2272
|
-
root.needsRebuild = true;
|
|
2273
|
-
this.jobStateListeners.delete(id);
|
|
2274
|
-
}
|
|
2275
|
-
}
|
|
2276
|
-
/**
|
|
2277
|
-
* Update a job's options dynamically.
|
|
2278
|
-
* Searches all roots to find the job by ID.
|
|
2279
|
-
* Phase/constraint changes trigger a rebuild of the sorted job list.
|
|
2280
|
-
* @param {string} id - The job ID to update
|
|
2281
|
-
* @param {Partial<JobOptions>} options - The options to update
|
|
2282
|
-
* @returns {void}
|
|
2283
|
-
*/
|
|
2284
|
-
updateJob(id, options) {
|
|
2285
|
-
let job;
|
|
2286
|
-
let root;
|
|
2287
|
-
for (const r of this.roots.values()) {
|
|
2288
|
-
job = r.jobs.get(id);
|
|
2289
|
-
if (job) {
|
|
2290
|
-
root = r;
|
|
2291
|
-
break;
|
|
2292
|
-
}
|
|
2293
|
-
}
|
|
2294
|
-
if (!job || !root) return;
|
|
2295
|
-
if (options.priority !== void 0) job.priority = options.priority;
|
|
2296
|
-
if (options.fps !== void 0) job.fps = options.fps;
|
|
2297
|
-
if (options.drop !== void 0) job.drop = options.drop;
|
|
2298
|
-
if (options.enabled !== void 0) {
|
|
2299
|
-
const wasEnabled = job.enabled;
|
|
2300
|
-
job.enabled = options.enabled;
|
|
2301
|
-
if (!wasEnabled && job.enabled) resetJobTiming(job);
|
|
2302
|
-
if (wasEnabled !== job.enabled) root.needsRebuild = true;
|
|
2303
|
-
}
|
|
2304
|
-
if (options.phase !== void 0 || options.before !== void 0 || options.after !== void 0) {
|
|
2305
|
-
if (options.phase) job.phase = options.phase;
|
|
2306
|
-
if (options.before !== void 0) job.before = this.normalizeConstraints(options.before);
|
|
2307
|
-
if (options.after !== void 0) job.after = this.normalizeConstraints(options.after);
|
|
2308
|
-
root.needsRebuild = true;
|
|
2309
|
-
}
|
|
2310
|
-
}
|
|
2311
|
-
//* Job State Management Methods ================================
|
|
2312
|
-
/**
|
|
2313
|
-
* Check if a job is currently paused (disabled).
|
|
2314
|
-
* @param {string} id - The job ID to check
|
|
2315
|
-
* @returns {boolean} True if the job exists and is paused
|
|
2316
|
-
*/
|
|
2317
|
-
isJobPaused(id) {
|
|
2318
|
-
for (const root of this.roots.values()) {
|
|
2319
|
-
const job = root.jobs.get(id);
|
|
2320
|
-
if (job) return !job.enabled;
|
|
2321
|
-
}
|
|
2322
|
-
return false;
|
|
2323
|
-
}
|
|
2324
|
-
/**
|
|
2325
|
-
* Subscribe to state changes for a specific job.
|
|
2326
|
-
* Listener is called when job is paused or resumed.
|
|
2327
|
-
* @param {string} id - The job ID to subscribe to
|
|
2328
|
-
* @param {() => void} listener - Callback invoked on state changes
|
|
2329
|
-
* @returns {() => void} Unsubscribe function
|
|
2330
|
-
*/
|
|
2331
|
-
subscribeJobState(id, listener) {
|
|
2332
|
-
if (!this.jobStateListeners.has(id)) {
|
|
2333
|
-
this.jobStateListeners.set(id, /* @__PURE__ */ new Set());
|
|
2334
|
-
}
|
|
2335
|
-
this.jobStateListeners.get(id).add(listener);
|
|
2336
|
-
return () => {
|
|
2337
|
-
this.jobStateListeners.get(id)?.delete(listener);
|
|
2338
|
-
if (this.jobStateListeners.get(id)?.size === 0) {
|
|
2339
|
-
this.jobStateListeners.delete(id);
|
|
2340
|
-
}
|
|
2341
|
-
};
|
|
2342
|
-
}
|
|
2343
|
-
/**
|
|
2344
|
-
* Notify all listeners that a job's state has changed.
|
|
2345
|
-
* @param {string} id - The job ID that changed
|
|
2346
|
-
* @returns {void}
|
|
2347
|
-
* @private
|
|
2348
|
-
*/
|
|
2349
|
-
notifyJobStateChange(id) {
|
|
2350
|
-
this.jobStateListeners.get(id)?.forEach((listener) => listener());
|
|
2351
|
-
}
|
|
2352
|
-
/**
|
|
2353
|
-
* Pause a job by ID (sets enabled=false).
|
|
2354
|
-
* Notifies any subscribed state listeners.
|
|
2355
|
-
* @param {string} id - The job ID to pause
|
|
2356
|
-
* @returns {void}
|
|
2357
|
-
*/
|
|
2358
|
-
pauseJob(id) {
|
|
2359
|
-
this.updateJob(id, { enabled: false });
|
|
2360
|
-
this.notifyJobStateChange(id);
|
|
2361
|
-
}
|
|
2362
|
-
/**
|
|
2363
|
-
* Resume a paused job by ID (sets enabled=true).
|
|
2364
|
-
* Resets job timing to prevent frame accumulation.
|
|
2365
|
-
* Notifies any subscribed state listeners.
|
|
2366
|
-
* @param {string} id - The job ID to resume
|
|
2367
|
-
* @returns {void}
|
|
2368
|
-
*/
|
|
2369
|
-
resumeJob(id) {
|
|
2370
|
-
this.updateJob(id, { enabled: true });
|
|
2371
|
-
this.notifyJobStateChange(id);
|
|
2372
|
-
}
|
|
2373
|
-
//* Frame Loop Control Methods ================================
|
|
2374
|
-
/**
|
|
2375
|
-
* Start the requestAnimationFrame loop.
|
|
2376
|
-
* Resets timing state (elapsedTime, frameCount) on start.
|
|
2377
|
-
* No-op if already running.
|
|
2378
|
-
* @returns {void}
|
|
2379
|
-
*/
|
|
2380
|
-
start() {
|
|
2381
|
-
if (this.loopState.running) return;
|
|
2382
|
-
const { elapsedTime, createdAt } = this.loopState;
|
|
2383
|
-
let adjustedCreated = 0;
|
|
2384
|
-
if (this.stoppedTime > 0) {
|
|
2385
|
-
adjustedCreated = createdAt - (performance.now() - this.stoppedTime);
|
|
2386
|
-
this.stoppedTime = 0;
|
|
2387
|
-
}
|
|
2388
|
-
Object.assign(this.loopState, {
|
|
2389
|
-
running: true,
|
|
2390
|
-
elapsedTime: elapsedTime ?? 0,
|
|
2391
|
-
lastTime: performance.now(),
|
|
2392
|
-
createdAt: adjustedCreated > 0 ? adjustedCreated : performance.now(),
|
|
2393
|
-
frameCount: 0,
|
|
2394
|
-
rafHandle: requestAnimationFrame(this.loop)
|
|
2395
|
-
});
|
|
2396
|
-
}
|
|
2397
|
-
/**
|
|
2398
|
-
* Stop the requestAnimationFrame loop.
|
|
2399
|
-
* Cancels any pending RAF callback.
|
|
2400
|
-
* No-op if not running.
|
|
2401
|
-
* @returns {void}
|
|
2402
|
-
*/
|
|
2403
|
-
stop() {
|
|
2404
|
-
if (!this.loopState.running) return;
|
|
2405
|
-
this.loopState.running = false;
|
|
2406
|
-
if (this.loopState.rafHandle !== null) {
|
|
2407
|
-
cancelAnimationFrame(this.loopState.rafHandle);
|
|
2408
|
-
this.loopState.rafHandle = null;
|
|
2409
|
-
}
|
|
2410
|
-
this.stoppedTime = performance.now();
|
|
2411
|
-
}
|
|
2412
|
-
/**
|
|
2413
|
-
* Request frames to be rendered in demand mode.
|
|
2414
|
-
* Accumulates pending frames (capped at 60) and starts the loop if not running.
|
|
2415
|
-
* No-op if frameloop is not 'demand'.
|
|
2416
|
-
* @param {number} [frames=1] - Number of frames to request
|
|
2417
|
-
* @param {boolean} [stackFrames=false] - Whether to add frames to existing pending count
|
|
2418
|
-
* - `false` (default): Sets pending frames to the specified value (replaces existing count)
|
|
2419
|
-
* - `true`: Adds frames to existing pending count (useful for accumulating invalidations)
|
|
2420
|
-
* @returns {void}
|
|
2421
|
-
* @example
|
|
2422
|
-
* // Request a single frame render
|
|
2423
|
-
* scheduler.invalidate();
|
|
2424
|
-
*
|
|
2425
|
-
* @example
|
|
2426
|
-
* // Request 5 frames (e.g., for animations)
|
|
2427
|
-
* scheduler.invalidate(5);
|
|
2428
|
-
*
|
|
2429
|
-
* @example
|
|
2430
|
-
* // Set pending frames to exactly 3 (don't stack with existing)
|
|
2431
|
-
* scheduler.invalidate(3, false);
|
|
2432
|
-
*
|
|
2433
|
-
* @example
|
|
2434
|
-
* // Add 2 more frames to existing pending count
|
|
2435
|
-
* scheduler.invalidate(2, true);
|
|
2436
|
-
*/
|
|
2437
|
-
invalidate(frames = 1, stackFrames = false) {
|
|
2438
|
-
if (this._frameloop !== "demand") return;
|
|
2439
|
-
const baseFrames = stackFrames ? this.pendingFrames : 0;
|
|
2440
|
-
this.pendingFrames = Math.min(60, baseFrames + frames);
|
|
2441
|
-
if (!this.loopState.running && this.pendingFrames > 0) this.start();
|
|
2442
|
-
}
|
|
2443
|
-
/**
|
|
2444
|
-
* Reset timing state for deterministic testing.
|
|
2445
|
-
* Preserves jobs and roots but resets lastTime, frameCount, elapsedTime, etc.
|
|
2446
|
-
* @returns {void}
|
|
2447
|
-
*/
|
|
2448
|
-
resetTiming() {
|
|
2449
|
-
this.loopState.lastTime = null;
|
|
2450
|
-
this.loopState.frameCount = 0;
|
|
2451
|
-
this.loopState.elapsedTime = 0;
|
|
2452
|
-
this.loopState.createdAt = performance.now();
|
|
2453
|
-
}
|
|
2454
|
-
//* Manual Stepping Methods ================================
|
|
2455
|
-
/**
|
|
2456
|
-
* Manually execute a single frame for all roots.
|
|
2457
|
-
* Useful for frameloop='never' mode or testing scenarios.
|
|
2458
|
-
* @param {number} [timestamp] - Optional timestamp (defaults to performance.now())
|
|
2459
|
-
* @returns {void}
|
|
2460
|
-
* @example
|
|
2461
|
-
* // Manual control mode
|
|
2462
|
-
* scheduler.frameloop = 'never';
|
|
2463
|
-
* scheduler.step(); // Execute one frame
|
|
2464
|
-
*/
|
|
2465
|
-
step(timestamp) {
|
|
2466
|
-
const now = timestamp ?? performance.now();
|
|
2467
|
-
this.executeFrame(now);
|
|
2468
|
-
}
|
|
2469
|
-
/**
|
|
2470
|
-
* Manually execute a single job by its ID.
|
|
2471
|
-
* Useful for testing individual job callbacks in isolation.
|
|
2472
|
-
* @param {string} id - The job ID to step
|
|
2473
|
-
* @param {number} [timestamp] - Optional timestamp (defaults to performance.now())
|
|
2474
|
-
* @returns {void}
|
|
2475
|
-
*/
|
|
2476
|
-
stepJob(id, timestamp) {
|
|
2477
|
-
let job;
|
|
2478
|
-
let root;
|
|
2479
|
-
for (const r of this.roots.values()) {
|
|
2480
|
-
job = r.jobs.get(id);
|
|
2481
|
-
if (job) {
|
|
2482
|
-
root = r;
|
|
2483
|
-
break;
|
|
2484
|
-
}
|
|
2485
|
-
}
|
|
2486
|
-
if (!job || !root) {
|
|
2487
|
-
console.warn(`[Scheduler] Job "${id}" not found`);
|
|
2488
|
-
return;
|
|
2489
|
-
}
|
|
2490
|
-
const now = timestamp ?? performance.now();
|
|
2491
|
-
const deltaMs = this.loopState.lastTime !== null ? now - this.loopState.lastTime : 0;
|
|
2492
|
-
const delta = deltaMs / 1e3;
|
|
2493
|
-
const elapsed = now - this.loopState.createdAt;
|
|
2494
|
-
const providedState = root.getState?.() ?? {};
|
|
2495
|
-
const frameState = {
|
|
2496
|
-
...providedState,
|
|
2497
|
-
time: now,
|
|
2498
|
-
delta,
|
|
2499
|
-
elapsed,
|
|
2500
|
-
frame: this.loopState.frameCount
|
|
2501
|
-
};
|
|
2502
|
-
try {
|
|
2503
|
-
job.callback(frameState, delta);
|
|
2504
|
-
} catch (error) {
|
|
2505
|
-
console.error(`[Scheduler] Error in job "${job.id}":`, error);
|
|
2506
|
-
this.triggerError(error instanceof Error ? error : new Error(String(error)));
|
|
2507
|
-
}
|
|
2508
|
-
}
|
|
2509
|
-
/**
|
|
2510
|
-
* Execute a single frame across all roots.
|
|
2511
|
-
* Order: globalBefore → each root's jobs → globalAfter
|
|
2512
|
-
* @param {number} timestamp - RAF timestamp in milliseconds
|
|
2513
|
-
* @returns {void}
|
|
2514
|
-
* @private
|
|
2515
|
-
*/
|
|
2516
|
-
executeFrame(timestamp) {
|
|
2517
|
-
const deltaMs = this.loopState.lastTime !== null ? timestamp - this.loopState.lastTime : 0;
|
|
2518
|
-
const delta = deltaMs / 1e3;
|
|
2519
|
-
this.loopState.lastTime = timestamp;
|
|
2520
|
-
this.loopState.frameCount++;
|
|
2521
|
-
this.loopState.elapsedTime += deltaMs;
|
|
2522
|
-
this.runGlobalJobs(this.globalBeforeJobs, timestamp);
|
|
2523
|
-
for (const root of this.roots.values()) {
|
|
2524
|
-
this.tickRoot(root, timestamp, delta);
|
|
2525
|
-
}
|
|
2526
|
-
this.runGlobalJobs(this.globalAfterJobs, timestamp);
|
|
2527
|
-
}
|
|
2528
|
-
/**
|
|
2529
|
-
* Run all global jobs from a job map.
|
|
2530
|
-
* Catches and logs errors without stopping execution.
|
|
2531
|
-
* @param {Map<string, GlobalJob>} jobs - The global jobs map to execute
|
|
2532
|
-
* @param {number} timestamp - RAF timestamp in milliseconds
|
|
2533
|
-
* @returns {void}
|
|
2534
|
-
* @private
|
|
2535
|
-
*/
|
|
2536
|
-
runGlobalJobs(jobs, timestamp) {
|
|
2537
|
-
for (const job of jobs.values()) {
|
|
2538
|
-
try {
|
|
2539
|
-
job.callback(timestamp);
|
|
2540
|
-
} catch (error) {
|
|
2541
|
-
console.error(`[Scheduler] Error in global job "${job.id}":`, error);
|
|
2542
|
-
}
|
|
2543
|
-
}
|
|
2544
|
-
}
|
|
2545
|
-
/**
|
|
2546
|
-
* Execute all jobs for a single root in sorted order.
|
|
2547
|
-
* Rebuilds sorted job list if needed, then dispatches each job.
|
|
2548
|
-
* Errors are caught and propagated via triggerError.
|
|
2549
|
-
* @param {RootEntry} root - The root entry to tick
|
|
2550
|
-
* @param {number} timestamp - RAF timestamp in milliseconds
|
|
2551
|
-
* @param {number} delta - Time since last frame in seconds
|
|
2552
|
-
* @returns {void}
|
|
2553
|
-
* @private
|
|
2554
|
-
*/
|
|
2555
|
-
tickRoot(root, timestamp, delta) {
|
|
2556
|
-
if (root.needsRebuild) {
|
|
2557
|
-
root.sortedJobs = rebuildSortedJobs(root.jobs, this.phaseGraph);
|
|
2558
|
-
root.needsRebuild = false;
|
|
2559
|
-
}
|
|
2560
|
-
const providedState = root.getState?.() ?? {};
|
|
2561
|
-
const frameState = {
|
|
2562
|
-
...providedState,
|
|
2563
|
-
time: timestamp,
|
|
2564
|
-
delta,
|
|
2565
|
-
elapsed: this.loopState.elapsedTime / 1e3,
|
|
2566
|
-
// Convert ms to seconds
|
|
2567
|
-
frame: this.loopState.frameCount
|
|
2568
|
-
};
|
|
2569
|
-
for (const job of root.sortedJobs) {
|
|
2570
|
-
if (!shouldRun(job, timestamp)) continue;
|
|
2571
|
-
try {
|
|
2572
|
-
job.callback(frameState, delta);
|
|
2573
|
-
} catch (error) {
|
|
2574
|
-
console.error(`[Scheduler] Error in job "${job.id}":`, error);
|
|
2575
|
-
this.triggerError(error instanceof Error ? error : new Error(String(error)));
|
|
2576
|
-
}
|
|
2577
|
-
}
|
|
2578
|
-
}
|
|
2579
|
-
//* Debug & Inspection Methods ================================
|
|
2580
|
-
/**
|
|
2581
|
-
* Get the total number of registered jobs across all roots.
|
|
2582
|
-
* Includes both per-root jobs and global before/after jobs.
|
|
2583
|
-
* @returns {number} Total job count
|
|
2584
|
-
*/
|
|
2585
|
-
getJobCount() {
|
|
2586
|
-
let count = 0;
|
|
2587
|
-
for (const root of this.roots.values()) {
|
|
2588
|
-
count += root.jobs.size;
|
|
2589
|
-
}
|
|
2590
|
-
return count + this.globalBeforeJobs.size + this.globalAfterJobs.size;
|
|
2591
|
-
}
|
|
2592
|
-
/**
|
|
2593
|
-
* Get all registered job IDs across all roots.
|
|
2594
|
-
* Includes both per-root jobs and global before/after jobs.
|
|
2595
|
-
* @returns {string[]} Array of all job IDs
|
|
2596
|
-
*/
|
|
2597
|
-
getJobIds() {
|
|
2598
|
-
const ids = [];
|
|
2599
|
-
for (const root of this.roots.values()) {
|
|
2600
|
-
ids.push(...root.jobs.keys());
|
|
2601
|
-
}
|
|
2602
|
-
ids.push(...this.globalBeforeJobs.keys());
|
|
2603
|
-
ids.push(...this.globalAfterJobs.keys());
|
|
2604
|
-
return ids;
|
|
2605
|
-
}
|
|
2606
|
-
/**
|
|
2607
|
-
* Get the number of registered roots (Canvas instances).
|
|
2608
|
-
* @returns {number} Number of registered roots
|
|
2609
|
-
*/
|
|
2610
|
-
getRootCount() {
|
|
2611
|
-
return this.roots.size;
|
|
2612
|
-
}
|
|
2613
|
-
/**
|
|
2614
|
-
* Check if any user (non-system) jobs are registered in a specific phase.
|
|
2615
|
-
* Used by the default render job to know if a user has taken over rendering.
|
|
2616
|
-
*
|
|
2617
|
-
* @param phase The phase to check
|
|
2618
|
-
* @param rootId Optional root ID to check (checks all roots if not provided)
|
|
2619
|
-
* @returns true if any user jobs exist in the phase
|
|
2620
|
-
*/
|
|
2621
|
-
hasUserJobsInPhase(phase, rootId) {
|
|
2622
|
-
const rootsToCheck = rootId ? [this.roots.get(rootId)].filter(Boolean) : Array.from(this.roots.values());
|
|
2623
|
-
return rootsToCheck.some((root) => {
|
|
2624
|
-
if (!root) return false;
|
|
2625
|
-
for (const job of root.jobs.values()) {
|
|
2626
|
-
if (job.phase === phase && !job.system && job.enabled) return true;
|
|
2627
|
-
}
|
|
2628
|
-
return false;
|
|
2629
|
-
});
|
|
2630
|
-
}
|
|
2631
|
-
//* Utility Methods ================================
|
|
2632
|
-
/**
|
|
2633
|
-
* Generate a unique root ID for automatic root registration.
|
|
2634
|
-
* @returns {string} A unique root ID in the format 'root_N'
|
|
2635
|
-
*/
|
|
2636
|
-
generateRootId() {
|
|
2637
|
-
return `root_${this.nextRootIndex++}`;
|
|
2638
|
-
}
|
|
2639
|
-
/**
|
|
2640
|
-
* Generate a unique job ID.
|
|
2641
|
-
* @returns {string} A unique job ID in the format 'job_N'
|
|
2642
|
-
* @private
|
|
2643
|
-
*/
|
|
2644
|
-
generateJobId() {
|
|
2645
|
-
return `job_${this.nextJobIndex}`;
|
|
2646
|
-
}
|
|
2647
|
-
/**
|
|
2648
|
-
* Normalize before/after constraints to a Set.
|
|
2649
|
-
* Handles undefined, single string, or array inputs.
|
|
2650
|
-
* @param {string | string[] | undefined} value - The constraint value(s)
|
|
2651
|
-
* @returns {Set<string>} Normalized Set of constraint strings
|
|
2652
|
-
* @private
|
|
2653
|
-
*/
|
|
2654
|
-
normalizeConstraints(value) {
|
|
2655
|
-
if (!value) return /* @__PURE__ */ new Set();
|
|
2656
|
-
if (Array.isArray(value)) return new Set(value);
|
|
2657
|
-
return /* @__PURE__ */ new Set([value]);
|
|
2658
|
-
}
|
|
2659
|
-
};
|
|
2660
|
-
//* Static State & Methods (Singleton Usage) ================================
|
|
2661
|
-
//* Cross-Bundle Singleton Key ==============================
|
|
2662
|
-
// Use Symbol.for() to ensure scheduler is shared across bundle boundaries
|
|
2663
|
-
// This prevents issues when mixing imports from @react-three/fiber and @react-three/fiber/webgpu
|
|
2664
|
-
__publicField(_Scheduler, "INSTANCE_KEY", Symbol.for("@react-three/fiber.scheduler"));
|
|
2665
|
-
let Scheduler = _Scheduler;
|
|
2666
|
-
const getScheduler = () => Scheduler.get();
|
|
2667
|
-
if (hmrData) {
|
|
2668
|
-
hmrData.accept?.();
|
|
1671
|
+
const INTERNAL_LIB_MARKERS = ["zustand", "setState", "Object.assign"];
|
|
1672
|
+
function isInternalRendererAccess(stack, callerDepth = 2) {
|
|
1673
|
+
if (!stack) return false;
|
|
1674
|
+
const caller = stack.split("\n")[callerDepth] ?? "";
|
|
1675
|
+
return INTERNAL_LIB_MARKERS.some((m) => caller.includes(m));
|
|
2669
1676
|
}
|
|
2670
1677
|
|
|
2671
1678
|
const R3F_CONTEXT = Symbol.for("@react-three/fiber.context");
|
|
@@ -2800,6 +1807,7 @@ const createStore = (invalidate, advance) => {
|
|
|
2800
1807
|
}),
|
|
2801
1808
|
setFrameloop: (frameloop = "always") => {
|
|
2802
1809
|
set(() => ({ frameloop }));
|
|
1810
|
+
getScheduler().frameloop = frameloop;
|
|
2803
1811
|
},
|
|
2804
1812
|
setError: (error) => set(() => ({ error })),
|
|
2805
1813
|
error: null,
|
|
@@ -2809,6 +1817,7 @@ const createStore = (invalidate, advance) => {
|
|
|
2809
1817
|
buffers: {},
|
|
2810
1818
|
gpuStorage: {},
|
|
2811
1819
|
textures: /* @__PURE__ */ new Map(),
|
|
1820
|
+
_textureRefs: /* @__PURE__ */ new Map(),
|
|
2812
1821
|
renderPipeline: null,
|
|
2813
1822
|
passes: {},
|
|
2814
1823
|
_hmrVersion: 0,
|
|
@@ -2866,8 +1875,7 @@ const createStore = (invalidate, advance) => {
|
|
|
2866
1875
|
const currentState = rootStore.getState();
|
|
2867
1876
|
if (!currentState.isLegacy && currentState.internal.actualRenderer) {
|
|
2868
1877
|
const stack = new Error().stack || "";
|
|
2869
|
-
|
|
2870
|
-
if (!isInternalAccess) {
|
|
1878
|
+
if (!isInternalRendererAccess(stack)) {
|
|
2871
1879
|
const cleanedStack = stack.split("\n").slice(2).join("\n") || "Stack trace unavailable";
|
|
2872
1880
|
notifyDepreciated({
|
|
2873
1881
|
heading: "Accessing state.gl in WebGPU mode",
|
|
@@ -2980,19 +1988,25 @@ function loadingFn(extensions, onProgress) {
|
|
|
2980
1988
|
);
|
|
2981
1989
|
};
|
|
2982
1990
|
}
|
|
2983
|
-
function useLoader(loader, input, extensions, onProgress) {
|
|
2984
|
-
const
|
|
1991
|
+
function useLoader(loader, input, extensions, onProgress, cacheKey) {
|
|
1992
|
+
const inputs = Array.isArray(input) ? input : [input];
|
|
1993
|
+
const cacheKeys = Array.isArray(cacheKey ?? input) ? cacheKey ?? input : [cacheKey ?? input];
|
|
2985
1994
|
const fn = loadingFn(extensions, onProgress);
|
|
2986
|
-
const results =
|
|
1995
|
+
const results = cacheKeys.map(
|
|
1996
|
+
(key, index) => suspend(() => fn(loader, inputs[index]), [loader, key], { equal: is.equ })
|
|
1997
|
+
);
|
|
2987
1998
|
return Array.isArray(input) ? results : results[0];
|
|
2988
1999
|
}
|
|
2989
|
-
useLoader.preload = function(loader, input, extensions, onProgress) {
|
|
2990
|
-
const
|
|
2991
|
-
|
|
2000
|
+
useLoader.preload = function(loader, input, extensions, onProgress, cacheKey) {
|
|
2001
|
+
const inputs = Array.isArray(input) ? input : [input];
|
|
2002
|
+
const cacheKeys = Array.isArray(cacheKey ?? input) ? cacheKey ?? input : [cacheKey ?? input];
|
|
2003
|
+
cacheKeys.forEach(
|
|
2004
|
+
(key, index) => preload(() => loadingFn(extensions, onProgress)(loader, inputs[index]), [loader, key])
|
|
2005
|
+
);
|
|
2992
2006
|
};
|
|
2993
|
-
useLoader.clear = function(loader, input) {
|
|
2994
|
-
const
|
|
2995
|
-
|
|
2007
|
+
useLoader.clear = function(loader, input, cacheKey) {
|
|
2008
|
+
const cacheKeys = Array.isArray(cacheKey ?? input) ? cacheKey ?? input : [cacheKey ?? input];
|
|
2009
|
+
cacheKeys.forEach((key) => clear([loader, key]));
|
|
2996
2010
|
};
|
|
2997
2011
|
useLoader.loader = getLoader;
|
|
2998
2012
|
|
|
@@ -3068,20 +2082,14 @@ function useFrame(callback, priorityOrOptions) {
|
|
|
3068
2082
|
}
|
|
3069
2083
|
};
|
|
3070
2084
|
} else {
|
|
3071
|
-
|
|
3072
|
-
|
|
3073
|
-
|
|
3074
|
-
|
|
3075
|
-
|
|
3076
|
-
|
|
3077
|
-
|
|
3078
|
-
|
|
3079
|
-
unregisterJob = registerOutside();
|
|
3080
|
-
});
|
|
3081
|
-
return () => {
|
|
3082
|
-
unsubReady();
|
|
3083
|
-
unregisterJob?.();
|
|
3084
|
-
};
|
|
2085
|
+
return scheduler.register(
|
|
2086
|
+
(state, delta) => {
|
|
2087
|
+
const frameState = state;
|
|
2088
|
+
if (!frameState.renderer) return;
|
|
2089
|
+
callbackRef.current?.(frameState, delta);
|
|
2090
|
+
},
|
|
2091
|
+
{ id, ...options }
|
|
2092
|
+
);
|
|
3085
2093
|
}
|
|
3086
2094
|
}, [store, scheduler, id, optionsKey, isLegacyPriority, isInsideCanvas]);
|
|
3087
2095
|
const isPaused = React.useSyncExternalStore(
|
|
@@ -3172,18 +2180,18 @@ function buildFromCache(input, textureCache) {
|
|
|
3172
2180
|
function useTexture(input, optionsOrOnLoad) {
|
|
3173
2181
|
const renderer = useThree((state) => state.internal.actualRenderer);
|
|
3174
2182
|
const store = useStore();
|
|
3175
|
-
const textureCache = useThree((state) => state.textures);
|
|
3176
2183
|
const options = typeof optionsOrOnLoad === "function" ? { onLoad: optionsOrOnLoad } : optionsOrOnLoad ?? {};
|
|
3177
|
-
const { onLoad, cache =
|
|
2184
|
+
const { onLoad, cache = true } = options;
|
|
3178
2185
|
const onLoadRef = useRef(onLoad);
|
|
3179
2186
|
onLoadRef.current = onLoad;
|
|
3180
2187
|
const onLoadCalledForRef = useRef(null);
|
|
3181
2188
|
const urls = useMemo(() => getUrls(input), [input]);
|
|
3182
2189
|
const cachedResult = useMemo(() => {
|
|
3183
2190
|
if (!cache) return null;
|
|
3184
|
-
|
|
3185
|
-
|
|
3186
|
-
|
|
2191
|
+
const textures = store.getState().textures;
|
|
2192
|
+
if (!allUrlsCached(urls, textures)) return null;
|
|
2193
|
+
return buildFromCache(input, textures);
|
|
2194
|
+
}, [cache, urls, input, store]);
|
|
3187
2195
|
const loadedTextures = useLoader(
|
|
3188
2196
|
TextureLoader,
|
|
3189
2197
|
IsObject(input) ? Object.values(input) : input
|
|
@@ -3227,8 +2235,6 @@ function useTexture(input, optionsOrOnLoad) {
|
|
|
3227
2235
|
}, [input, loadedTextures, cachedResult]);
|
|
3228
2236
|
useEffect(() => {
|
|
3229
2237
|
if (!cache) return;
|
|
3230
|
-
if (cachedResult) return;
|
|
3231
|
-
const set = store.setState;
|
|
3232
2238
|
const urlTextureMap = [];
|
|
3233
2239
|
if (typeof input === "string") {
|
|
3234
2240
|
urlTextureMap.push([input, mappedTextures]);
|
|
@@ -3242,18 +2248,32 @@ function useTexture(input, optionsOrOnLoad) {
|
|
|
3242
2248
|
urlTextureMap.push([url, textureRecord[key]]);
|
|
3243
2249
|
}
|
|
3244
2250
|
}
|
|
3245
|
-
|
|
3246
|
-
const
|
|
3247
|
-
let
|
|
2251
|
+
store.setState((state) => {
|
|
2252
|
+
const refs = new Map(state._textureRefs);
|
|
2253
|
+
let textures = state.textures;
|
|
2254
|
+
let added = false;
|
|
3248
2255
|
for (const [url, texture] of urlTextureMap) {
|
|
3249
|
-
if (!
|
|
3250
|
-
|
|
3251
|
-
|
|
2256
|
+
if (!textures.has(url)) {
|
|
2257
|
+
if (!added) {
|
|
2258
|
+
textures = new Map(textures);
|
|
2259
|
+
added = true;
|
|
2260
|
+
}
|
|
2261
|
+
textures.set(url, texture);
|
|
3252
2262
|
}
|
|
2263
|
+
refs.set(url, (refs.get(url) ?? 0) + 1);
|
|
3253
2264
|
}
|
|
3254
|
-
return
|
|
2265
|
+
return added ? { textures, _textureRefs: refs } : { _textureRefs: refs };
|
|
2266
|
+
});
|
|
2267
|
+
return () => store.setState((state) => {
|
|
2268
|
+
const refs = new Map(state._textureRefs);
|
|
2269
|
+
for (const [url] of urlTextureMap) {
|
|
2270
|
+
const next = (refs.get(url) ?? 0) - 1;
|
|
2271
|
+
if (next <= 0) refs.delete(url);
|
|
2272
|
+
else refs.set(url, next);
|
|
2273
|
+
}
|
|
2274
|
+
return { _textureRefs: refs };
|
|
3255
2275
|
});
|
|
3256
|
-
}, [cache, input, mappedTextures, store
|
|
2276
|
+
}, [cache, input, mappedTextures, store]);
|
|
3257
2277
|
return mappedTextures;
|
|
3258
2278
|
}
|
|
3259
2279
|
useTexture.preload = (url) => useLoader.preload(TextureLoader, url);
|
|
@@ -3269,96 +2289,63 @@ const Texture = ({
|
|
|
3269
2289
|
return /* @__PURE__ */ jsx(Fragment, { children: children?.(ret) });
|
|
3270
2290
|
};
|
|
3271
2291
|
|
|
3272
|
-
function
|
|
3273
|
-
if (entry instanceof Texture$1) return entry;
|
|
3274
|
-
if (entry && typeof entry === "object" && "value" in entry && entry.value instanceof Texture$1) {
|
|
3275
|
-
return entry.value;
|
|
3276
|
-
}
|
|
3277
|
-
return null;
|
|
3278
|
-
}
|
|
3279
|
-
function useTextures() {
|
|
2292
|
+
function useTextures(selector) {
|
|
3280
2293
|
const store = useStore();
|
|
3281
|
-
|
|
3282
|
-
const set = store.setState;
|
|
2294
|
+
const registry = useMemo(() => {
|
|
3283
2295
|
const getState = store.getState;
|
|
3284
|
-
const
|
|
3285
|
-
|
|
3286
|
-
const newMap = new Map(state.textures);
|
|
3287
|
-
newMap.set(key, value);
|
|
3288
|
-
return { textures: newMap };
|
|
3289
|
-
});
|
|
3290
|
-
};
|
|
3291
|
-
const addMultiple = (items) => {
|
|
3292
|
-
set((state) => {
|
|
3293
|
-
const newMap = new Map(state.textures);
|
|
3294
|
-
const entries = items instanceof Map ? items.entries() : Object.entries(items);
|
|
3295
|
-
for (const [key, value] of entries) {
|
|
3296
|
-
newMap.set(key, value);
|
|
3297
|
-
}
|
|
3298
|
-
return { textures: newMap };
|
|
3299
|
-
});
|
|
3300
|
-
};
|
|
3301
|
-
const remove = (key) => {
|
|
3302
|
-
set((state) => {
|
|
3303
|
-
const newMap = new Map(state.textures);
|
|
3304
|
-
newMap.delete(key);
|
|
3305
|
-
return { textures: newMap };
|
|
3306
|
-
});
|
|
3307
|
-
};
|
|
3308
|
-
const removeMultiple = (keys) => {
|
|
3309
|
-
set((state) => {
|
|
3310
|
-
const newMap = new Map(state.textures);
|
|
3311
|
-
for (const key of keys) newMap.delete(key);
|
|
3312
|
-
return { textures: newMap };
|
|
3313
|
-
});
|
|
3314
|
-
};
|
|
3315
|
-
const dispose = (key) => {
|
|
3316
|
-
const entry = getState().textures.get(key);
|
|
3317
|
-
if (entry) {
|
|
3318
|
-
const tex = getTextureValue(entry);
|
|
3319
|
-
tex?.dispose();
|
|
3320
|
-
}
|
|
3321
|
-
remove(key);
|
|
3322
|
-
};
|
|
3323
|
-
const disposeMultiple = (keys) => {
|
|
3324
|
-
const textures = getState().textures;
|
|
3325
|
-
for (const key of keys) {
|
|
3326
|
-
const entry = textures.get(key);
|
|
3327
|
-
if (entry) {
|
|
3328
|
-
const tex = getTextureValue(entry);
|
|
3329
|
-
tex?.dispose();
|
|
3330
|
-
}
|
|
3331
|
-
}
|
|
3332
|
-
removeMultiple(keys);
|
|
3333
|
-
};
|
|
3334
|
-
const disposeAll = () => {
|
|
3335
|
-
const textures = getState().textures;
|
|
3336
|
-
for (const entry of textures.values()) {
|
|
3337
|
-
const tex = getTextureValue(entry);
|
|
3338
|
-
tex?.dispose();
|
|
3339
|
-
}
|
|
3340
|
-
set({ textures: /* @__PURE__ */ new Map() });
|
|
3341
|
-
};
|
|
2296
|
+
const setState = store.setState;
|
|
2297
|
+
const getOne = (key) => getState().textures.get(key);
|
|
3342
2298
|
return {
|
|
3343
|
-
|
|
3344
|
-
get textures() {
|
|
2299
|
+
get all() {
|
|
3345
2300
|
return getState().textures;
|
|
3346
2301
|
},
|
|
3347
|
-
|
|
3348
|
-
|
|
2302
|
+
get(input) {
|
|
2303
|
+
if (typeof input === "string") return getOne(input);
|
|
2304
|
+
if (Array.isArray(input)) return input.map(getOne);
|
|
2305
|
+
const out = {};
|
|
2306
|
+
for (const name in input) out[name] = getOne(input[name]);
|
|
2307
|
+
return out;
|
|
2308
|
+
},
|
|
3349
2309
|
has: (key) => getState().textures.has(key),
|
|
3350
|
-
|
|
3351
|
-
|
|
3352
|
-
|
|
3353
|
-
|
|
3354
|
-
|
|
3355
|
-
|
|
3356
|
-
|
|
3357
|
-
|
|
3358
|
-
|
|
3359
|
-
|
|
2310
|
+
add(keyOrRecord, texture) {
|
|
2311
|
+
setState((state) => {
|
|
2312
|
+
const textures = new Map(state.textures);
|
|
2313
|
+
if (typeof keyOrRecord === "string") {
|
|
2314
|
+
textures.set(keyOrRecord, texture);
|
|
2315
|
+
} else {
|
|
2316
|
+
for (const key in keyOrRecord) textures.set(key, keyOrRecord[key]);
|
|
2317
|
+
}
|
|
2318
|
+
return { textures };
|
|
2319
|
+
});
|
|
2320
|
+
},
|
|
2321
|
+
dispose(key, options) {
|
|
2322
|
+
const state = getState();
|
|
2323
|
+
const refs = state._textureRefs.get(key) ?? 0;
|
|
2324
|
+
if (refs > 0 && !options?.force) {
|
|
2325
|
+
console.warn(
|
|
2326
|
+
`[useTextures] "${key}" still has ${refs} active reference(s); skipping dispose. Pass { force: true } to override.`
|
|
2327
|
+
);
|
|
2328
|
+
return false;
|
|
2329
|
+
}
|
|
2330
|
+
state.textures.get(key)?.dispose();
|
|
2331
|
+
setState((s) => {
|
|
2332
|
+
const textures = new Map(s.textures);
|
|
2333
|
+
textures.delete(key);
|
|
2334
|
+
const nextRefs = new Map(s._textureRefs);
|
|
2335
|
+
nextRefs.delete(key);
|
|
2336
|
+
return { textures, _textureRefs: nextRefs };
|
|
2337
|
+
});
|
|
2338
|
+
return true;
|
|
2339
|
+
},
|
|
2340
|
+
disposeAll() {
|
|
2341
|
+
for (const texture of getState().textures.values()) texture.dispose();
|
|
2342
|
+
setState({ textures: /* @__PURE__ */ new Map(), _textureRefs: /* @__PURE__ */ new Map() });
|
|
2343
|
+
}
|
|
3360
2344
|
};
|
|
3361
2345
|
}, [store]);
|
|
2346
|
+
const subscribe = selector ? () => selector(registry) : (state) => state.textures;
|
|
2347
|
+
const selected = useThree(subscribe);
|
|
2348
|
+
return selector ? selected : registry;
|
|
3362
2349
|
}
|
|
3363
2350
|
|
|
3364
2351
|
function useRenderTarget(widthOrOptions, heightOrOptions, options) {
|
|
@@ -3439,7 +2426,7 @@ function advance(timestamp) {
|
|
|
3439
2426
|
getScheduler().step(timestamp);
|
|
3440
2427
|
}
|
|
3441
2428
|
|
|
3442
|
-
const version = "10.0.0-alpha.
|
|
2429
|
+
const version = "10.0.0-alpha.3";
|
|
3443
2430
|
const packageData = {
|
|
3444
2431
|
version: version};
|
|
3445
2432
|
|
|
@@ -14878,6 +13865,7 @@ function swapInstances() {
|
|
|
14878
13865
|
}
|
|
14879
13866
|
}
|
|
14880
13867
|
if (instance.isHidden) unhideInstance(instance);
|
|
13868
|
+
if (isObject3D(instance.object)) removeInteractivity(findInitialRoot(instance), instance.object);
|
|
14881
13869
|
if (instance.object.__r3f) delete instance.object.__r3f;
|
|
14882
13870
|
if (instance.type !== "primitive") disposeOnIdle(instance.object);
|
|
14883
13871
|
}
|
|
@@ -14890,6 +13878,8 @@ function swapInstances() {
|
|
|
14890
13878
|
instance.object.__r3f = instance;
|
|
14891
13879
|
setFiberRef(fiber, instance.object);
|
|
14892
13880
|
delete instance.appliedOnce;
|
|
13881
|
+
instance.eventCount = 0;
|
|
13882
|
+
instance.handlers = {};
|
|
14893
13883
|
applyProps(instance.object, instance.props);
|
|
14894
13884
|
if (instance.props.attach) {
|
|
14895
13885
|
attach(parent, instance);
|
|
@@ -15105,11 +14095,15 @@ const reconciler = /* @__PURE__ */ createReconciler({
|
|
|
15105
14095
|
cloneMutableTextInstance(textInstance) {
|
|
15106
14096
|
return textInstance;
|
|
15107
14097
|
},
|
|
14098
|
+
// React 19.2 added these for root-level view transitions. They only run for hosts that opt into
|
|
14099
|
+
// view transitions by returning a container from cloneRootViewTransitionContainer; R3F renders
|
|
14100
|
+
// into a WebGL/WebGPU canvas, where cloning the root has no meaning, so we never opt in and
|
|
14101
|
+
// React never calls them. They stay as no-ops rather than throws: the host config is shared by
|
|
14102
|
+
// every root, and a throw here would turn a React-internal probe into a hard crash for users.
|
|
14103
|
+
// Guarded by a test asserting a full render + unmount never reaches them.
|
|
15108
14104
|
cloneRootViewTransitionContainer(_rootContainer) {
|
|
15109
|
-
throw new Error("Not implemented.");
|
|
15110
14105
|
},
|
|
15111
14106
|
removeRootViewTransitionClone(_rootContainer, _clone) {
|
|
15112
|
-
throw new Error("Not implemented.");
|
|
15113
14107
|
},
|
|
15114
14108
|
// https://github.com/facebook/react/pull/32465
|
|
15115
14109
|
createFragmentInstance: (_fiber) => null,
|
|
@@ -15194,6 +14188,7 @@ function createRoot(canvas) {
|
|
|
15194
14188
|
const lastConfiguredProps = {};
|
|
15195
14189
|
let configured = false;
|
|
15196
14190
|
let pending = null;
|
|
14191
|
+
let rendererSetup = null;
|
|
15197
14192
|
return {
|
|
15198
14193
|
async configure(props = {}) {
|
|
15199
14194
|
let resolve;
|
|
@@ -15224,7 +14219,7 @@ function createRoot(canvas) {
|
|
|
15224
14219
|
forceEven
|
|
15225
14220
|
} = props;
|
|
15226
14221
|
const textureColorSpace = is.obj(glConfig) && !is.fun(glConfig) && !isRenderer(glConfig) && glConfig.textureColorSpace || is.obj(rendererConfig) && !is.fun(rendererConfig) && !isRenderer(rendererConfig) && rendererConfig.textureColorSpace || SRGBColorSpace;
|
|
15227
|
-
|
|
14222
|
+
let state = store.getState();
|
|
15228
14223
|
const defaultGLProps = {
|
|
15229
14224
|
canvas,
|
|
15230
14225
|
powerPreference: "high-performance",
|
|
@@ -15252,9 +14247,21 @@ function createRoot(canvas) {
|
|
|
15252
14247
|
);
|
|
15253
14248
|
}
|
|
15254
14249
|
if (!state.internal.actualRenderer) {
|
|
15255
|
-
|
|
15256
|
-
|
|
15257
|
-
|
|
14250
|
+
if (!rendererSetup) {
|
|
14251
|
+
rendererSetup = (async () => {
|
|
14252
|
+
{
|
|
14253
|
+
renderer = await resolveRenderer(glConfig, defaultGLProps, WebGLRenderer);
|
|
14254
|
+
state.internal.actualRenderer = renderer;
|
|
14255
|
+
state.set({ isLegacy: true, gl: renderer, renderer, primaryStore: store });
|
|
14256
|
+
}
|
|
14257
|
+
})().catch((err) => {
|
|
14258
|
+
rendererSetup = null;
|
|
14259
|
+
throw err;
|
|
14260
|
+
});
|
|
14261
|
+
}
|
|
14262
|
+
await rendererSetup;
|
|
14263
|
+
state = store.getState();
|
|
14264
|
+
renderer = state.internal.actualRenderer;
|
|
15258
14265
|
}
|
|
15259
14266
|
let raycaster = state.raycaster;
|
|
15260
14267
|
if (!raycaster) state.set({ raycaster: raycaster = new Raycaster() });
|
|
@@ -15479,7 +14486,7 @@ function createRoot(canvas) {
|
|
|
15479
14486
|
{
|
|
15480
14487
|
id: `${newRootId}_frustum`,
|
|
15481
14488
|
rootId: newRootId,
|
|
15482
|
-
|
|
14489
|
+
before: "render",
|
|
15483
14490
|
system: true
|
|
15484
14491
|
}
|
|
15485
14492
|
);
|
|
@@ -15491,7 +14498,7 @@ function createRoot(canvas) {
|
|
|
15491
14498
|
{
|
|
15492
14499
|
id: `${newRootId}_visibility`,
|
|
15493
14500
|
rootId: newRootId,
|
|
15494
|
-
|
|
14501
|
+
before: "render",
|
|
15495
14502
|
system: true,
|
|
15496
14503
|
after: `${newRootId}_frustum`
|
|
15497
14504
|
}
|
|
@@ -15604,7 +14611,8 @@ function unmountComponentAtNode(canvas, callback) {
|
|
|
15604
14611
|
dispose(state.scene);
|
|
15605
14612
|
_roots.delete(canvas);
|
|
15606
14613
|
if (callback) callback(canvas);
|
|
15607
|
-
} catch {
|
|
14614
|
+
} catch (error) {
|
|
14615
|
+
console.warn("[R3F] Error while unmounting root; teardown may be incomplete:", error);
|
|
15608
14616
|
}
|
|
15609
14617
|
}, 500);
|
|
15610
14618
|
}
|
|
@@ -15667,6 +14675,7 @@ function PortalInner({ state = {}, children, container }) {
|
|
|
15667
14675
|
viewport = rootState.viewport.getCurrentViewport(camera, new Vector3(), resolvedSize);
|
|
15668
14676
|
if (camera !== rootState.camera) updateCamera(camera, resolvedSize);
|
|
15669
14677
|
}
|
|
14678
|
+
const set = injectState.set;
|
|
15670
14679
|
return {
|
|
15671
14680
|
// The intersect consists of the previous root state
|
|
15672
14681
|
...rootState,
|
|
@@ -15685,7 +14694,7 @@ function PortalInner({ state = {}, children, container }) {
|
|
|
15685
14694
|
size: resolvedSize,
|
|
15686
14695
|
viewport: { ...rootState.viewport, ...viewport },
|
|
15687
14696
|
// Layers are allowed to override events
|
|
15688
|
-
setEvents: (events2) =>
|
|
14697
|
+
setEvents: (events2) => set((state2) => ({ ...state2, events: { ...state2.events, ...events2 } })),
|
|
15689
14698
|
// Container for child attachment - the portalScene (injected or container itself)
|
|
15690
14699
|
internal: { ...rootState.internal, ...injectState.internal, container: portalScene }
|
|
15691
14700
|
};
|
|
@@ -15714,6 +14723,59 @@ function flushSync(fn) {
|
|
|
15714
14723
|
return reconciler.flushSyncFromReconciler(fn);
|
|
15715
14724
|
}
|
|
15716
14725
|
|
|
14726
|
+
function parseBackground(background) {
|
|
14727
|
+
if (!background) return null;
|
|
14728
|
+
if (typeof background === "object" && !background.isColor) {
|
|
14729
|
+
const { backgroundMap, envMap, files, preset, ...rest } = background;
|
|
14730
|
+
return {
|
|
14731
|
+
...rest,
|
|
14732
|
+
preset,
|
|
14733
|
+
files: envMap || files,
|
|
14734
|
+
backgroundFiles: backgroundMap,
|
|
14735
|
+
background: true
|
|
14736
|
+
};
|
|
14737
|
+
}
|
|
14738
|
+
if (typeof background === "number") {
|
|
14739
|
+
return { color: background, background: true };
|
|
14740
|
+
}
|
|
14741
|
+
if (typeof background === "string") {
|
|
14742
|
+
if (background in presetsObj) {
|
|
14743
|
+
return { preset: background, background: true };
|
|
14744
|
+
}
|
|
14745
|
+
if (/^(https?:\/\/|\/|\.\/|\.\.\/)|\.(hdr|exr|jpg|jpeg|png|webp|gif)$/i.test(background)) {
|
|
14746
|
+
return { files: background, background: true };
|
|
14747
|
+
}
|
|
14748
|
+
return { color: background, background: true };
|
|
14749
|
+
}
|
|
14750
|
+
if (background.isColor) {
|
|
14751
|
+
return { color: background, background: true };
|
|
14752
|
+
}
|
|
14753
|
+
return null;
|
|
14754
|
+
}
|
|
14755
|
+
|
|
14756
|
+
function parseRendererConfig(rendererProp) {
|
|
14757
|
+
const isRendererConfig = typeof rendererProp === "object" && rendererProp !== null && !("render" in rendererProp) && ("primaryCanvas" in rendererProp || "scheduler" in rendererProp);
|
|
14758
|
+
if (isRendererConfig) {
|
|
14759
|
+
const { primaryCanvas: pc, scheduler: sc, ...rest } = rendererProp;
|
|
14760
|
+
return {
|
|
14761
|
+
primaryCanvas: pc,
|
|
14762
|
+
scheduler: sc,
|
|
14763
|
+
renderer: Object.keys(rest).length > 0 ? rest : rendererProp
|
|
14764
|
+
};
|
|
14765
|
+
}
|
|
14766
|
+
return { primaryCanvas: void 0, scheduler: void 0, renderer: rendererProp };
|
|
14767
|
+
}
|
|
14768
|
+
|
|
14769
|
+
function clearHmrCaches(store) {
|
|
14770
|
+
store.setState((state) => ({
|
|
14771
|
+
nodes: {},
|
|
14772
|
+
uniforms: {},
|
|
14773
|
+
buffers: {},
|
|
14774
|
+
gpuStorage: {},
|
|
14775
|
+
_hmrVersion: state._hmrVersion + 1
|
|
14776
|
+
}));
|
|
14777
|
+
}
|
|
14778
|
+
|
|
15717
14779
|
function CanvasImpl({
|
|
15718
14780
|
ref,
|
|
15719
14781
|
children,
|
|
@@ -15734,6 +14796,8 @@ function CanvasImpl({
|
|
|
15734
14796
|
raycaster,
|
|
15735
14797
|
camera,
|
|
15736
14798
|
scene,
|
|
14799
|
+
autoUpdateFrustum,
|
|
14800
|
+
occlusion,
|
|
15737
14801
|
onPointerMissed,
|
|
15738
14802
|
onDragOverMissed,
|
|
15739
14803
|
onDropMissed,
|
|
@@ -15745,49 +14809,10 @@ function CanvasImpl({
|
|
|
15745
14809
|
forceEven,
|
|
15746
14810
|
...props
|
|
15747
14811
|
}) {
|
|
15748
|
-
const
|
|
15749
|
-
let primaryCanvas;
|
|
15750
|
-
let scheduler;
|
|
15751
|
-
let renderer;
|
|
15752
|
-
if (isRendererConfig) {
|
|
15753
|
-
const { primaryCanvas: pc, scheduler: sc, ...rest } = rendererProp;
|
|
15754
|
-
primaryCanvas = pc;
|
|
15755
|
-
scheduler = sc;
|
|
15756
|
-
renderer = Object.keys(rest).length > 0 ? rest : rendererProp;
|
|
15757
|
-
} else {
|
|
15758
|
-
renderer = rendererProp;
|
|
15759
|
-
}
|
|
14812
|
+
const { primaryCanvas, scheduler, renderer } = parseRendererConfig(rendererProp);
|
|
15760
14813
|
React.useMemo(() => extend(THREE), []);
|
|
15761
14814
|
const Bridge = useBridge();
|
|
15762
|
-
const backgroundProps = React.useMemo(() =>
|
|
15763
|
-
if (!background) return null;
|
|
15764
|
-
if (typeof background === "object" && !background.isColor) {
|
|
15765
|
-
const { backgroundMap, envMap, files, preset, ...rest } = background;
|
|
15766
|
-
return {
|
|
15767
|
-
...rest,
|
|
15768
|
-
preset,
|
|
15769
|
-
files: envMap || files,
|
|
15770
|
-
backgroundFiles: backgroundMap,
|
|
15771
|
-
background: true
|
|
15772
|
-
};
|
|
15773
|
-
}
|
|
15774
|
-
if (typeof background === "number") {
|
|
15775
|
-
return { color: background, background: true };
|
|
15776
|
-
}
|
|
15777
|
-
if (typeof background === "string") {
|
|
15778
|
-
if (background in presetsObj) {
|
|
15779
|
-
return { preset: background, background: true };
|
|
15780
|
-
}
|
|
15781
|
-
if (/^(https?:\/\/|\/|\.\/|\.\.\/)|\\.(hdr|exr|jpg|jpeg|png|webp|gif)$/i.test(background)) {
|
|
15782
|
-
return { files: background, background: true };
|
|
15783
|
-
}
|
|
15784
|
-
return { color: background, background: true };
|
|
15785
|
-
}
|
|
15786
|
-
if (background.isColor) {
|
|
15787
|
-
return { color: background, background: true };
|
|
15788
|
-
}
|
|
15789
|
-
return null;
|
|
15790
|
-
}, [background]);
|
|
14815
|
+
const backgroundProps = React.useMemo(() => parseBackground(background), [background]);
|
|
15791
14816
|
const hasInitialSizeRef = React.useRef(false);
|
|
15792
14817
|
const measureConfig = React.useMemo(() => {
|
|
15793
14818
|
if (!hasInitialSizeRef.current) {
|
|
@@ -15829,6 +14854,7 @@ function CanvasImpl({
|
|
|
15829
14854
|
const handleDropMissed = useMutableCallback(onDropMissed);
|
|
15830
14855
|
const [block, setBlock] = React.useState(false);
|
|
15831
14856
|
const [error, setError] = React.useState(false);
|
|
14857
|
+
const [fallbackVisible, setFallbackVisible] = React.useState(false);
|
|
15832
14858
|
if (block) throw block;
|
|
15833
14859
|
if (error) throw error;
|
|
15834
14860
|
const root = React.useRef(null);
|
|
@@ -15836,6 +14862,7 @@ function CanvasImpl({
|
|
|
15836
14862
|
const unsubscribeErrorRef = React.useRef(null);
|
|
15837
14863
|
useIsomorphicLayoutEffect(() => {
|
|
15838
14864
|
effectActiveRef.current = true;
|
|
14865
|
+
if (fallbackVisible) return;
|
|
15839
14866
|
const canvas = canvasRef.current;
|
|
15840
14867
|
if (effectiveSize.width > 0 && effectiveSize.height > 0 && canvas) {
|
|
15841
14868
|
if (!root.current) {
|
|
@@ -15856,7 +14883,7 @@ function CanvasImpl({
|
|
|
15856
14883
|
}
|
|
15857
14884
|
async function run() {
|
|
15858
14885
|
if (!effectActiveRef.current || !root.current) return;
|
|
15859
|
-
await root.current.configure({
|
|
14886
|
+
const configured = await root.current.configure({
|
|
15860
14887
|
id,
|
|
15861
14888
|
primaryCanvas,
|
|
15862
14889
|
scheduler,
|
|
@@ -15871,6 +14898,8 @@ function CanvasImpl({
|
|
|
15871
14898
|
performance,
|
|
15872
14899
|
raycaster,
|
|
15873
14900
|
camera,
|
|
14901
|
+
autoUpdateFrustum,
|
|
14902
|
+
occlusion,
|
|
15874
14903
|
size: effectiveSize,
|
|
15875
14904
|
// Store size props for reset functionality
|
|
15876
14905
|
_sizeProps: width !== void 0 || height !== void 0 ? { width, height } : null,
|
|
@@ -15895,8 +14924,20 @@ function CanvasImpl({
|
|
|
15895
14924
|
}
|
|
15896
14925
|
onCreated?.(state);
|
|
15897
14926
|
}
|
|
15898
|
-
})
|
|
15899
|
-
|
|
14927
|
+
}).then(
|
|
14928
|
+
() => true,
|
|
14929
|
+
// Renderer setup failed (e.g. no WebGL/WebGPU support). The `fallback` prop lives
|
|
14930
|
+
// inside <canvas>, which browsers don't display, so surface it as visible DOM
|
|
14931
|
+
// instead; with no fallback, rethrow to an external error boundary. (#3757)
|
|
14932
|
+
(setupError) => {
|
|
14933
|
+
if (effectActiveRef.current) {
|
|
14934
|
+
if (fallback != null) setFallbackVisible(true);
|
|
14935
|
+
else setError(setupError);
|
|
14936
|
+
}
|
|
14937
|
+
return false;
|
|
14938
|
+
}
|
|
14939
|
+
);
|
|
14940
|
+
if (!configured || !effectActiveRef.current || !root.current) return;
|
|
15900
14941
|
root.current.render(
|
|
15901
14942
|
/* @__PURE__ */ jsx(Bridge, { children: /* @__PURE__ */ jsx(ErrorBoundary, { set: setError, children: /* @__PURE__ */ jsxs(React.Suspense, { fallback: /* @__PURE__ */ jsx(Block, { set: setBlock }), children: [
|
|
15902
14943
|
backgroundProps && /* @__PURE__ */ jsx(Environment, { ...backgroundProps }),
|
|
@@ -15930,14 +14971,7 @@ function CanvasImpl({
|
|
|
15930
14971
|
const handleHMR = () => {
|
|
15931
14972
|
queueMicrotask(() => {
|
|
15932
14973
|
const rootEntry = _roots.get(canvas);
|
|
15933
|
-
if (rootEntry?.store)
|
|
15934
|
-
console.log("[R3F] HMR detected \u2014 rebuilding nodes/uniforms");
|
|
15935
|
-
rootEntry.store.setState((state) => ({
|
|
15936
|
-
nodes: {},
|
|
15937
|
-
uniforms: {},
|
|
15938
|
-
_hmrVersion: state._hmrVersion + 1
|
|
15939
|
-
}));
|
|
15940
|
-
}
|
|
14974
|
+
if (rootEntry?.store) clearHmrCaches(rootEntry.store);
|
|
15941
14975
|
});
|
|
15942
14976
|
};
|
|
15943
14977
|
if (typeof import.meta !== "undefined" && import.meta.hot) {
|
|
@@ -15966,7 +15000,11 @@ function CanvasImpl({
|
|
|
15966
15000
|
...style
|
|
15967
15001
|
},
|
|
15968
15002
|
...props,
|
|
15969
|
-
children:
|
|
15003
|
+
children: fallbackVisible ? (
|
|
15004
|
+
// Renderer setup failed: render the fallback as visible DOM. Inside <canvas> (below)
|
|
15005
|
+
// it exists in the tree but browsers never paint it, which is the whole bug (#3757).
|
|
15006
|
+
fallback
|
|
15007
|
+
) : /* @__PURE__ */ jsx("div", { ref: containerRef, className: "r3f-canvas-container", style: { width: "100%", height: "100%" }, children: /* @__PURE__ */ jsx(
|
|
15970
15008
|
"canvas",
|
|
15971
15009
|
{
|
|
15972
15010
|
ref: canvasRef,
|
|
@@ -15985,4 +15023,4 @@ function Canvas(props) {
|
|
|
15985
15023
|
|
|
15986
15024
|
extend(THREE);
|
|
15987
15025
|
|
|
15988
|
-
export { Block, Canvas, Environment, EnvironmentCube, EnvironmentMap, EnvironmentPortal, ErrorBoundary, FROM_REF, IsObject, ONCE, Portal, R3F_BUILD_LEGACY, R3F_BUILD_WEBGPU, REACT_INTERNAL_PROPS, RESERVED_PROPS,
|
|
15026
|
+
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 };
|