@react-three/fiber 10.0.0-canary.f046a54 → 10.0.0-canary.f5d9cbd

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/legacy.mjs CHANGED
@@ -1,20 +1,19 @@
1
1
  import * as three from 'three';
2
- import { WebGLRenderTarget, CubeReflectionMapping, EquirectangularReflectionMapping, CubeTextureLoader, Scene, WebGLCubeRenderTarget, 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';
2
+ import { WebGLCubeRenderTarget, WebGLRenderTarget, Frustum, Matrix4, Group, BoxGeometry, MeshBasicNodeMaterial, Mesh, Node, NodeUpdateType, Layers, ShaderMaterial, Uniform, SRGBColorSpace, RGBAFormat, UnsignedByteType, Vector3, Vector2, TextureLoader, Texture as Texture$1, CubeReflectionMapping, EquirectangularReflectionMapping, CubeTextureLoader, Raycaster, OrthographicCamera, PerspectiveCamera, Scene, PCFShadowMap, VSMShadowMap, BasicShadowMap, ACESFilmicToneMapping, WebGLRenderer, HalfFloatType, Color } from 'three';
3
3
  import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
4
4
  import * as React from 'react';
5
- import React__default, { useLayoutEffect, useRef, useMemo, useEffect, useContext, useImperativeHandle, useCallback, useState } from 'react';
5
+ import React__default, { useRef, useMemo, useLayoutEffect, useEffect, useContext, useImperativeHandle, useCallback, useState } from 'react';
6
6
  import useMeasure from 'react-use-measure';
7
7
  import { useFiber, useContextBridge, traverseFiber, FiberProvider } from 'its-fine';
8
- import { useThree as useThree$1, useLoader as useLoader$1, useFrame as useFrame$1, createPortal as createPortal$1, applyProps as applyProps$1, extend as extend$1 } from '@react-three/fiber';
8
+ import { createWithEqualityFn } from 'zustand/traditional';
9
+ import { getScheduler } from '@pmndrs/scheduler';
10
+ export { Scheduler, getScheduler } from '@pmndrs/scheduler';
11
+ import Tb, { unstable_getCurrentPriorityLevel, unstable_IdlePriority, unstable_LowPriority, unstable_NormalPriority, unstable_UserBlockingPriority, unstable_ImmediatePriority, unstable_scheduleCallback } from 'scheduler';
9
12
  import { GroundedSkybox } from 'three/examples/jsm/objects/GroundedSkybox.js';
10
13
  import { HDRLoader } from 'three/examples/jsm/loaders/HDRLoader.js';
11
14
  import { EXRLoader } from 'three/examples/jsm/loaders/EXRLoader.js';
12
15
  import { UltraHDRLoader } from 'three/examples/jsm/loaders/UltraHDRLoader.js';
13
16
  import { GainMapLoader } from '@monogrid/gainmap-js';
14
- import Tb, { unstable_scheduleCallback, unstable_IdlePriority } from 'scheduler';
15
- import { createWithEqualityFn } from 'zustand/traditional';
16
- import { getScheduler } from '@pmndrs/scheduler';
17
- export { Scheduler, getScheduler } from '@pmndrs/scheduler';
18
17
  import { suspend, preload, clear } from 'suspend-react';
19
18
 
20
19
  function _mergeNamespaces(n, m) {
@@ -31,26 +30,27 @@ function _mergeNamespaces(n, m) {
31
30
 
32
31
  const R3F_BUILD_LEGACY = true;
33
32
  const R3F_BUILD_WEBGPU = false;
34
- const Inspector = class Inspector2 {
35
- constructor() {
36
- throw new Error("Inspector is not available in legacy builds. Use @react-three/fiber/webgpu instead.");
37
- }
38
- };
33
+ async function loadInspector() {
34
+ throw new Error("Inspector is not available in legacy builds. Use @react-three/fiber/webgpu instead.");
35
+ }
39
36
  const WebGPURenderer = class WebGPURenderer2 {
40
37
  constructor() {
41
38
  throw new Error("WebGPURenderer is not available in legacy builds. Use @react-three/fiber/webgpu instead.");
42
39
  }
43
40
  };
44
41
  const RenderTarget = null;
42
+ const CubeRenderTarget = null;
45
43
 
46
44
  const THREE = /*#__PURE__*/_mergeNamespaces({
47
45
  __proto__: null,
48
- Inspector: Inspector,
46
+ CubeRenderTarget: CubeRenderTarget,
47
+ CubeRenderTargetCompat: WebGLCubeRenderTarget,
49
48
  R3F_BUILD_LEGACY: R3F_BUILD_LEGACY,
50
49
  R3F_BUILD_WEBGPU: R3F_BUILD_WEBGPU,
51
50
  RenderTarget: RenderTarget,
52
51
  RenderTargetCompat: WebGLRenderTarget,
53
- WebGPURenderer: WebGPURenderer
52
+ WebGPURenderer: WebGPURenderer,
53
+ loadInspector: loadInspector
54
54
  }, [three]);
55
55
 
56
56
  const primaryRegistry = /* @__PURE__ */ new Map();
@@ -111,550 +111,223 @@ function getPrimaryIds() {
111
111
  return Array.from(primaryRegistry.keys());
112
112
  }
113
113
 
114
- const presetsObj = {
115
- apartment: "lebombo_1k.hdr",
116
- city: "potsdamer_platz_1k.hdr",
117
- dawn: "kiara_1_dawn_1k.hdr",
118
- forest: "forest_slope_1k.hdr",
119
- lobby: "st_fagans_interior_1k.hdr",
120
- night: "dikhololo_night_1k.hdr",
121
- park: "rooitou_park_1k.hdr",
122
- studio: "studio_small_03_1k.hdr",
123
- sunset: "venice_sunset_1k.hdr",
124
- warehouse: "empty_warehouse_01_1k.hdr"
125
- };
114
+ var __defProp = Object.defineProperty;
115
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
116
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
117
+ const useIsomorphicLayoutEffect = /* @__PURE__ */ (() => typeof window !== "undefined" && (window.document?.createElement || window.navigator?.product === "ReactNative"))() ? React.useLayoutEffect : React.useEffect;
118
+ function useMutableCallback(fn) {
119
+ const ref = React.useRef(fn);
120
+ useIsomorphicLayoutEffect(() => void (ref.current = fn), [fn]);
121
+ return ref;
122
+ }
123
+ function useBridge() {
124
+ const fiber = useFiber();
125
+ const ContextBridge = useContextBridge();
126
+ return React.useMemo(
127
+ () => ({ children }) => {
128
+ const strict = !!traverseFiber(fiber, true, (node) => node.type === React.StrictMode);
129
+ const Root = strict ? React.StrictMode : React.Fragment;
130
+ return /* @__PURE__ */ jsx(Root, { children: /* @__PURE__ */ jsx(ContextBridge, { children }) });
131
+ },
132
+ [fiber, ContextBridge]
133
+ );
134
+ }
135
+ function Block({ set }) {
136
+ useIsomorphicLayoutEffect(() => {
137
+ set(new Promise(() => null));
138
+ return () => set(false);
139
+ }, [set]);
140
+ return null;
141
+ }
142
+ const ErrorBoundary = /* @__PURE__ */ (() => {
143
+ var _a;
144
+ return _a = class extends React.Component {
145
+ constructor() {
146
+ super(...arguments);
147
+ __publicField(this, "state", { error: false });
148
+ }
149
+ componentDidCatch(err) {
150
+ this.props.set(err);
151
+ }
152
+ render() {
153
+ return this.state.error ? null : this.props.children;
154
+ }
155
+ }, __publicField(_a, "getDerivedStateFromError", () => ({ error: true })), _a;
156
+ })();
126
157
 
127
- const CUBEMAP_ROOT = "https://raw.githack.com/pmndrs/drei-assets/456060a26bbeb8fdf79326f224b6d99b8bcce736/hdri/";
128
- const isArray = (arr) => Array.isArray(arr);
129
- const defaultFiles = ["/px.png", "/nx.png", "/py.png", "/ny.png", "/pz.png", "/nz.png"];
130
- function useEnvironment({
131
- files = defaultFiles,
132
- path = "",
133
- preset = void 0,
134
- colorSpace = void 0,
135
- extensions
136
- } = {}) {
137
- if (preset) {
138
- validatePreset(preset);
139
- files = presetsObj[preset];
140
- path = CUBEMAP_ROOT;
141
- }
142
- const multiFile = isArray(files);
143
- const { extension, isCubemap } = getExtension(files);
144
- const loader = getLoader$1(extension);
145
- if (!loader) throw new Error("useEnvironment: Unrecognized file extension: " + files);
146
- const renderer = useThree$1((state) => state.renderer);
147
- useLayoutEffect(() => {
148
- if (extension !== "webp" && extension !== "jpg" && extension !== "jpeg") return;
149
- function clearGainmapTexture() {
150
- useLoader$1.clear(loader, multiFile ? [files] : files);
158
+ const is = {
159
+ obj: (a) => a === Object(a) && !is.arr(a) && typeof a !== "function",
160
+ fun: (a) => typeof a === "function",
161
+ str: (a) => typeof a === "string",
162
+ num: (a) => typeof a === "number",
163
+ boo: (a) => typeof a === "boolean",
164
+ und: (a) => a === void 0,
165
+ nul: (a) => a === null,
166
+ arr: (a) => Array.isArray(a),
167
+ equ(a, b, { arrays = "shallow", objects = "reference", strict = true } = {}) {
168
+ if (typeof a !== typeof b || !!a !== !!b) return false;
169
+ if (is.str(a) || is.num(a) || is.boo(a)) return a === b;
170
+ const isObj = is.obj(a);
171
+ if (isObj && objects === "reference") return a === b;
172
+ const isArr = is.arr(a);
173
+ if (isArr && arrays === "reference") return a === b;
174
+ if ((isArr || isObj) && a === b) return true;
175
+ let i;
176
+ for (i in a) if (!(i in b)) return false;
177
+ if (isObj && arrays === "shallow" && objects === "shallow") {
178
+ for (i in strict ? b : a) if (!is.equ(a[i], b[i], { strict, objects: "reference" })) return false;
179
+ } else {
180
+ for (i in strict ? b : a) if (a[i] !== b[i]) return false;
151
181
  }
152
- renderer.domElement.addEventListener("webglcontextlost", clearGainmapTexture, { once: true });
153
- }, [extension, files, loader, multiFile, renderer.domElement]);
154
- const loaderResult = useLoader$1(
155
- loader,
156
- multiFile ? [files] : files,
157
- (loader2) => {
158
- if (extension === "webp" || extension === "jpg" || extension === "jpeg") {
159
- loader2.setRenderer?.(renderer);
160
- }
161
- loader2.setPath?.(path);
162
- if (extensions) extensions(loader2);
182
+ if (is.und(i)) {
183
+ if (isArr && a.length === 0 && b.length === 0) return true;
184
+ if (isObj && Object.keys(a).length === 0 && Object.keys(b).length === 0) return true;
185
+ if (a !== b) return false;
163
186
  }
164
- );
165
- let texture = multiFile ? (
166
- // @ts-ignore
167
- loaderResult[0]
168
- ) : loaderResult;
169
- if (extension === "jpg" || extension === "jpeg" || extension === "webp") {
170
- texture = texture.renderTarget?.texture;
171
- }
172
- texture.mapping = isCubemap ? CubeReflectionMapping : EquirectangularReflectionMapping;
173
- texture.colorSpace = colorSpace ?? (isCubemap ? "srgb" : "srgb-linear");
174
- return texture;
175
- }
176
- const preloadDefaultOptions = {
177
- files: defaultFiles,
178
- path: "",
179
- preset: void 0,
180
- extensions: void 0
181
- };
182
- useEnvironment.preload = (preloadOptions) => {
183
- const options = { ...preloadDefaultOptions, ...preloadOptions };
184
- let { files, path = "" } = options;
185
- const { preset, extensions } = options;
186
- if (preset) {
187
- validatePreset(preset);
188
- files = presetsObj[preset];
189
- path = CUBEMAP_ROOT;
190
- }
191
- const { extension } = getExtension(files);
192
- if (extension === "webp" || extension === "jpg" || extension === "jpeg") {
193
- throw new Error("useEnvironment: Preloading gainmaps is not supported");
194
- }
195
- const loader = getLoader$1(extension);
196
- if (!loader) throw new Error("useEnvironment: Unrecognized file extension: " + files);
197
- useLoader$1.preload(loader, isArray(files) ? [files] : files, (loader2) => {
198
- loader2.setPath?.(path);
199
- if (extensions) extensions(loader2);
200
- });
201
- };
202
- const clearDefaultOptins = {
203
- files: defaultFiles,
204
- preset: void 0
205
- };
206
- useEnvironment.clear = (clearOptions) => {
207
- const options = { ...clearDefaultOptins, ...clearOptions };
208
- let { files } = options;
209
- const { preset } = options;
210
- if (preset) {
211
- validatePreset(preset);
212
- files = presetsObj[preset];
187
+ return true;
213
188
  }
214
- const { extension } = getExtension(files);
215
- const loader = getLoader$1(extension);
216
- if (!loader) throw new Error("useEnvironment: Unrecognized file extension: " + files);
217
- useLoader$1.clear(loader, isArray(files) ? [files] : files);
218
189
  };
219
- function validatePreset(preset) {
220
- if (!(preset in presetsObj)) throw new Error("Preset must be one of: " + Object.keys(presetsObj).join(", "));
190
+ const isOrthographicCamera = (def) => def && def.isOrthographicCamera;
191
+ const isRef$1 = (obj) => obj !== null && typeof obj === "object" && obj.hasOwnProperty("current");
192
+ const isColorRepresentation = (value) => value != null && (typeof value === "string" || typeof value === "number" || value.isColor);
193
+ const isObject3D = (object) => object?.isObject3D;
194
+ const isTexture = (value) => !!value?.isTexture;
195
+ const isVectorLike = (object) => object !== null && typeof object === "object" && "set" in object && typeof object.set === "function";
196
+ const isCopyable = (object) => isVectorLike(object) && "copy" in object && typeof object.copy === "function";
197
+ const hasConstructor = (object) => !!object?.constructor;
198
+
199
+ function calculateDpr(dpr) {
200
+ const target = typeof window !== "undefined" ? window.devicePixelRatio ?? 2 : 1;
201
+ return Array.isArray(dpr) ? Math.min(Math.max(dpr[0], target), dpr[1]) : dpr;
221
202
  }
222
- function getExtension(files) {
223
- const isCubemap = isArray(files) && files.length === 6;
224
- const isGainmap = isArray(files) && files.length === 3 && files.some((file) => file.endsWith("json"));
225
- const firstEntry = isArray(files) ? files[0] : files;
226
- const extension = isCubemap ? "cube" : isGainmap ? "webp" : firstEntry.startsWith("data:application/exr") ? "exr" : firstEntry.startsWith("data:application/hdr") ? "hdr" : firstEntry.startsWith("data:image/jpeg") ? "jpg" : firstEntry.split(".").pop()?.split("?")?.shift()?.toLowerCase();
227
- return { extension, isCubemap, isGainmap };
203
+ function getUuidPrefix(uuid) {
204
+ return uuid.split("-")[0];
228
205
  }
229
- function getLoader$1(extension) {
230
- const loader = extension === "cube" ? CubeTextureLoader : extension === "hdr" ? HDRLoader : extension === "exr" ? EXRLoader : extension === "jpg" || extension === "jpeg" ? UltraHDRLoader : extension === "webp" ? GainMapLoader : null;
231
- return loader;
206
+ function updateCamera(camera, size) {
207
+ if (camera.manual) return;
208
+ if (isOrthographicCamera(camera)) {
209
+ camera.left = size.width / -2;
210
+ camera.right = size.width / 2;
211
+ camera.top = size.height / 2;
212
+ camera.bottom = size.height / -2;
213
+ } else {
214
+ camera.aspect = size.width / size.height;
215
+ }
216
+ camera.updateProjectionMatrix();
232
217
  }
233
-
234
- const isRef$1 = (obj) => obj.current && obj.current.isScene;
235
- const resolveScene = (scene) => isRef$1(scene) ? scene.current : scene;
236
- function setEnvProps(background, scene, defaultScene, texture, sceneProps = {}) {
237
- sceneProps = {
238
- backgroundBlurriness: 0,
239
- backgroundIntensity: 1,
240
- backgroundRotation: [0, 0, 0],
241
- environmentIntensity: 1,
242
- environmentRotation: [0, 0, 0],
243
- ...sceneProps
244
- };
245
- const target = resolveScene(scene || defaultScene);
246
- const oldbg = target.background;
247
- const oldenv = target.environment;
248
- const oldSceneProps = {
249
- // @ts-ignore
250
- backgroundBlurriness: target.backgroundBlurriness,
251
- // @ts-ignore
252
- backgroundIntensity: target.backgroundIntensity,
253
- // @ts-ignore
254
- backgroundRotation: target.backgroundRotation?.clone?.() ?? [0, 0, 0],
255
- // @ts-ignore
256
- environmentIntensity: target.environmentIntensity,
257
- // @ts-ignore
258
- environmentRotation: target.environmentRotation?.clone?.() ?? [0, 0, 0]
259
- };
260
- if (background !== "only") target.environment = texture;
261
- if (background) target.background = texture;
262
- applyProps$1(target, sceneProps);
263
- return () => {
264
- if (background !== "only") target.environment = oldenv;
265
- if (background) target.background = oldbg;
266
- applyProps$1(target, oldSceneProps);
267
- };
218
+ const frustumMatrix = new Matrix4();
219
+ function updateFrustum(camera, frustum) {
220
+ const target = frustum ?? new Frustum();
221
+ frustumMatrix.multiplyMatrices(camera.projectionMatrix, camera.matrixWorldInverse);
222
+ target.setFromProjectionMatrix(frustumMatrix);
223
+ return target;
268
224
  }
269
- function EnvironmentMap({ scene, background = false, map, ...config }) {
270
- const defaultScene = useThree$1((state) => state.scene);
271
- React.useLayoutEffect(() => {
272
- if (map) return setEnvProps(background, scene, defaultScene, map, config);
273
- });
274
- return null;
225
+
226
+ const REACT_INTERNAL_PROPS = ["children", "key", "ref"];
227
+ function findInitialRoot(instance) {
228
+ let root = instance.root;
229
+ while (root.getState().previousRoot) root = root.getState().previousRoot;
230
+ return root;
275
231
  }
276
- function EnvironmentCube({
277
- background = false,
278
- scene,
279
- blur,
280
- backgroundBlurriness,
281
- backgroundIntensity,
282
- backgroundRotation,
283
- environmentIntensity,
284
- environmentRotation,
285
- ...rest
286
- }) {
287
- const texture = useEnvironment(rest);
288
- const defaultScene = useThree$1((state) => state.scene);
289
- React.useLayoutEffect(() => {
290
- return setEnvProps(background, scene, defaultScene, texture, {
291
- backgroundBlurriness: blur ?? backgroundBlurriness,
292
- backgroundIntensity,
293
- backgroundRotation,
294
- environmentIntensity,
295
- environmentRotation
232
+ function getRootState(obj) {
233
+ let state = obj.__r3f?.root.getState();
234
+ if (!state) {
235
+ obj.traverseAncestors((ancestor) => {
236
+ const parentState = ancestor.__r3f?.root.getState();
237
+ if (parentState) {
238
+ state = parentState;
239
+ return false;
240
+ }
296
241
  });
297
- });
298
- React.useEffect(() => {
299
- return () => {
300
- texture.dispose();
301
- };
302
- }, [texture]);
303
- return null;
242
+ }
243
+ return state;
304
244
  }
305
- function EnvironmentPortal({
306
- children,
307
- near = 0.1,
308
- far = 1e3,
309
- resolution = 256,
310
- frames = 1,
311
- map,
312
- background = false,
313
- blur,
314
- backgroundBlurriness,
315
- backgroundIntensity,
316
- backgroundRotation,
317
- environmentIntensity,
318
- environmentRotation,
319
- scene,
320
- files,
321
- path,
322
- preset = void 0,
323
- extensions
324
- }) {
325
- const gl = useThree$1((state) => state.gl);
326
- const defaultScene = useThree$1((state) => state.scene);
327
- const camera = React.useRef(null);
328
- const [virtualScene] = React.useState(() => new Scene());
329
- const fbo = React.useMemo(() => {
330
- const fbo2 = new WebGLCubeRenderTarget(resolution);
331
- fbo2.texture.type = HalfFloatType;
332
- return fbo2;
333
- }, [resolution]);
334
- React.useEffect(() => {
335
- return () => {
336
- fbo.dispose();
337
- };
338
- }, [fbo]);
339
- React.useLayoutEffect(() => {
340
- if (frames === 1) {
341
- const autoClear = gl.autoClear;
342
- gl.autoClear = true;
343
- camera.current.update(gl, virtualScene);
344
- gl.autoClear = autoClear;
345
- }
346
- return setEnvProps(background, scene, defaultScene, fbo.texture, {
347
- backgroundBlurriness: blur ?? backgroundBlurriness,
348
- backgroundIntensity,
349
- backgroundRotation,
350
- environmentIntensity,
351
- environmentRotation
245
+ function buildGraph(object) {
246
+ const data = { nodes: {}, materials: {}, meshes: {} };
247
+ if (object) {
248
+ object.traverse((obj) => {
249
+ if (obj.name) data.nodes[obj.name] = obj;
250
+ if (obj.material) {
251
+ const material = Array.isArray(obj.material) ? obj.material[0] : obj.material;
252
+ const nameAlreadyUsed = data.materials[material.name];
253
+ let materialName = material.name;
254
+ if (nameAlreadyUsed) {
255
+ materialName = materialName + `-${getUuidPrefix(material.uuid)}`;
256
+ material.userData.materialCacheName = materialName;
257
+ }
258
+ data.materials[materialName] = material;
259
+ }
260
+ if (obj.isMesh && !data.meshes[obj.name]) data.meshes[obj.name] = obj;
352
261
  });
353
- }, [
354
- children,
355
- virtualScene,
356
- fbo.texture,
357
- scene,
358
- defaultScene,
359
- background,
360
- frames,
361
- gl,
362
- blur,
363
- backgroundBlurriness,
364
- backgroundIntensity,
365
- backgroundRotation,
366
- environmentIntensity,
367
- environmentRotation
368
- ]);
369
- let count = 1;
370
- useFrame$1(() => {
371
- if (frames === Infinity || count < frames) {
372
- const autoClear = gl.autoClear;
373
- gl.autoClear = true;
374
- camera.current.update(gl, virtualScene);
375
- gl.autoClear = autoClear;
376
- count++;
377
- }
378
- });
379
- return /* @__PURE__ */ jsx(Fragment, { children: createPortal$1(
380
- /* @__PURE__ */ jsxs(Fragment, { children: [
381
- children,
382
- /* @__PURE__ */ jsx("cubeCamera", { ref: camera, args: [near, far, fbo] }),
383
- files || preset ? /* @__PURE__ */ jsx(EnvironmentCube, { background: true, files, preset, path, extensions }) : map ? /* @__PURE__ */ jsx(EnvironmentMap, { background: true, map, extensions }) : null
384
- ] }),
385
- virtualScene
386
- ) });
387
- }
388
- function EnvironmentGround(props) {
389
- const textureDefault = useEnvironment(props);
390
- const texture = props.map || textureDefault;
391
- React.useMemo(() => extend$1({ GroundProjectedEnvImpl: GroundedSkybox }), []);
392
- React.useEffect(() => {
393
- return () => {
394
- textureDefault.dispose();
395
- };
396
- }, [textureDefault]);
397
- const height = props.ground?.height ?? 15;
398
- const radius = props.ground?.radius ?? 60;
399
- const scale = props.ground?.scale ?? 1e3;
400
- const args = React.useMemo(
401
- () => [texture, height, radius],
402
- [texture, height, radius]
403
- );
404
- return /* @__PURE__ */ jsxs(Fragment, { children: [
405
- /* @__PURE__ */ jsx(EnvironmentMap, { ...props, map: texture }),
406
- /* @__PURE__ */ jsx("groundProjectedEnvImpl", { args, scale })
407
- ] });
408
- }
409
- function EnvironmentColor({ color, scene }) {
410
- const defaultScene = useThree$1((state) => state.scene);
411
- React.useLayoutEffect(() => {
412
- if (color === void 0) return;
413
- const target = resolveScene(scene || defaultScene);
414
- const oldBg = target.background;
415
- target.background = new Color(color);
416
- return () => {
417
- target.background = oldBg;
418
- };
419
- });
420
- return null;
421
- }
422
- function EnvironmentDualSource(props) {
423
- const { backgroundFiles, ...envProps } = props;
424
- return /* @__PURE__ */ jsxs(Fragment, { children: [
425
- /* @__PURE__ */ jsx(EnvironmentCube, { ...envProps, background: false }),
426
- /* @__PURE__ */ jsx(EnvironmentCube, { ...props, files: backgroundFiles, background: "only" })
427
- ] });
262
+ }
263
+ return data;
428
264
  }
429
- function Environment(props) {
430
- if (props.color && !props.files && !props.preset && !props.map) {
431
- return /* @__PURE__ */ jsx(EnvironmentColor, { ...props });
265
+ function dispose(obj) {
266
+ if (obj.type !== "Scene") obj.dispose?.();
267
+ for (const p in obj) {
268
+ const prop = obj[p];
269
+ if (prop?.type !== "Scene") prop?.dispose?.();
432
270
  }
433
- if (props.backgroundFiles && props.backgroundFiles !== props.files) {
434
- return /* @__PURE__ */ jsx(EnvironmentDualSource, { ...props });
271
+ }
272
+ function getInstanceProps(pendingProps) {
273
+ const props = {};
274
+ for (const key in pendingProps) {
275
+ if (!REACT_INTERNAL_PROPS.includes(key)) props[key] = pendingProps[key];
435
276
  }
436
- return props.ground ? /* @__PURE__ */ jsx(EnvironmentGround, { ...props }) : props.map ? /* @__PURE__ */ jsx(EnvironmentMap, { ...props }) : props.children ? /* @__PURE__ */ jsx(EnvironmentPortal, { ...props }) : /* @__PURE__ */ jsx(EnvironmentCube, { ...props });
277
+ return props;
437
278
  }
438
-
439
- var __defProp = Object.defineProperty;
440
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
441
- var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
442
- const act = React["act"];
443
- const useIsomorphicLayoutEffect = /* @__PURE__ */ (() => typeof window !== "undefined" && (window.document?.createElement || window.navigator?.product === "ReactNative"))() ? React.useLayoutEffect : React.useEffect;
444
- function useMutableCallback(fn) {
445
- const ref = React.useRef(fn);
446
- useIsomorphicLayoutEffect(() => void (ref.current = fn), [fn]);
447
- return ref;
279
+ function prepare(target, root, type, props) {
280
+ const object = target;
281
+ let instance = object?.__r3f;
282
+ if (!instance) {
283
+ instance = {
284
+ root,
285
+ type,
286
+ parent: null,
287
+ children: [],
288
+ props: getInstanceProps(props),
289
+ object,
290
+ eventCount: 0,
291
+ handlers: {},
292
+ isHidden: false
293
+ };
294
+ if (object) object.__r3f = instance;
295
+ }
296
+ return instance;
448
297
  }
449
- function useBridge() {
450
- const fiber = useFiber();
451
- const ContextBridge = useContextBridge();
452
- return React.useMemo(
453
- () => ({ children }) => {
454
- const strict = !!traverseFiber(fiber, true, (node) => node.type === React.StrictMode);
455
- const Root = strict ? React.StrictMode : React.Fragment;
456
- return /* @__PURE__ */ jsx(Root, { children: /* @__PURE__ */ jsx(ContextBridge, { children }) });
457
- },
458
- [fiber, ContextBridge]
459
- );
298
+ function invalidateInstance(instance) {
299
+ if (!instance.parent) return;
300
+ instance.props.onUpdate?.(instance.object);
301
+ const state = instance.root?.getState?.();
302
+ if (state && state.internal.frames === 0) state.invalidate();
460
303
  }
461
- function Block({ set }) {
462
- useIsomorphicLayoutEffect(() => {
463
- set(new Promise(() => null));
464
- return () => set(false);
465
- }, [set]);
466
- return null;
304
+
305
+ const tempFrustum = new Frustum();
306
+ let hasWarnedWebGL = false;
307
+ let tslModule = null;
308
+ async function loadTSL() {
309
+ if (tslModule) return tslModule;
310
+ try {
311
+ const tsl = await import('three/tsl');
312
+ tslModule = { uniform: tsl.uniform, nodeObject: tsl.nodeObject };
313
+ return tslModule;
314
+ } catch {
315
+ return null;
316
+ }
467
317
  }
468
- const ErrorBoundary = /* @__PURE__ */ (() => {
469
- var _a;
470
- return _a = class extends React.Component {
471
- constructor() {
472
- super(...arguments);
473
- __publicField(this, "state", { error: false });
474
- }
475
- componentDidCatch(err) {
476
- this.props.set(err);
477
- }
478
- render() {
479
- return this.state.error ? null : this.props.children;
480
- }
481
- }, __publicField(_a, "getDerivedStateFromError", () => ({ error: true })), _a;
482
- })();
483
-
484
- const is = {
485
- obj: (a) => a === Object(a) && !is.arr(a) && typeof a !== "function",
486
- fun: (a) => typeof a === "function",
487
- str: (a) => typeof a === "string",
488
- num: (a) => typeof a === "number",
489
- boo: (a) => typeof a === "boolean",
490
- und: (a) => a === void 0,
491
- nul: (a) => a === null,
492
- arr: (a) => Array.isArray(a),
493
- equ(a, b, { arrays = "shallow", objects = "reference", strict = true } = {}) {
494
- if (typeof a !== typeof b || !!a !== !!b) return false;
495
- if (is.str(a) || is.num(a) || is.boo(a)) return a === b;
496
- const isObj = is.obj(a);
497
- if (isObj && objects === "reference") return a === b;
498
- const isArr = is.arr(a);
499
- if (isArr && arrays === "reference") return a === b;
500
- if ((isArr || isObj) && a === b) return true;
501
- let i;
502
- for (i in a) if (!(i in b)) return false;
503
- if (isObj && arrays === "shallow" && objects === "shallow") {
504
- for (i in strict ? b : a) if (!is.equ(a[i], b[i], { strict, objects: "reference" })) return false;
505
- } else {
506
- for (i in strict ? b : a) if (a[i] !== b[i]) return false;
507
- }
508
- if (is.und(i)) {
509
- if (isArr && a.length === 0 && b.length === 0) return true;
510
- if (isObj && Object.keys(a).length === 0 && Object.keys(b).length === 0) return true;
511
- if (a !== b) return false;
512
- }
513
- return true;
514
- }
515
- };
516
- const isOrthographicCamera = (def) => def && def.isOrthographicCamera;
517
- const isRef = (obj) => obj !== null && typeof obj === "object" && obj.hasOwnProperty("current");
518
- const isColorRepresentation = (value) => value != null && (typeof value === "string" || typeof value === "number" || value.isColor);
519
- const isObject3D = (object) => object?.isObject3D;
520
- const isTexture = (value) => !!value?.isTexture;
521
- const isVectorLike = (object) => object !== null && typeof object === "object" && "set" in object && typeof object.set === "function";
522
- const isCopyable = (object) => isVectorLike(object) && "copy" in object && typeof object.copy === "function";
523
- const hasConstructor = (object) => !!object?.constructor;
524
-
525
- function calculateDpr(dpr) {
526
- const target = typeof window !== "undefined" ? window.devicePixelRatio ?? 2 : 1;
527
- return Array.isArray(dpr) ? Math.min(Math.max(dpr[0], target), dpr[1]) : dpr;
528
- }
529
- function getUuidPrefix(uuid) {
530
- return uuid.split("-")[0];
531
- }
532
- function updateCamera(camera, size) {
533
- if (camera.manual) return;
534
- if (isOrthographicCamera(camera)) {
535
- camera.left = size.width / -2;
536
- camera.right = size.width / 2;
537
- camera.top = size.height / 2;
538
- camera.bottom = size.height / -2;
539
- } else {
540
- camera.aspect = size.width / size.height;
541
- }
542
- camera.updateProjectionMatrix();
543
- }
544
- const frustumMatrix = new Matrix4();
545
- function updateFrustum(camera, frustum) {
546
- const target = frustum ?? new Frustum();
547
- frustumMatrix.multiplyMatrices(camera.projectionMatrix, camera.matrixWorldInverse);
548
- target.setFromProjectionMatrix(frustumMatrix);
549
- return target;
550
- }
551
-
552
- const REACT_INTERNAL_PROPS = ["children", "key", "ref"];
553
- function findInitialRoot(instance) {
554
- let root = instance.root;
555
- while (root.getState().previousRoot) root = root.getState().previousRoot;
556
- return root;
557
- }
558
- function getRootState(obj) {
559
- let state = obj.__r3f?.root.getState();
560
- if (!state) {
561
- obj.traverseAncestors((ancestor) => {
562
- const parentState = ancestor.__r3f?.root.getState();
563
- if (parentState) {
564
- state = parentState;
565
- return false;
566
- }
567
- });
568
- }
569
- return state;
570
- }
571
- function buildGraph(object) {
572
- const data = { nodes: {}, materials: {}, meshes: {} };
573
- if (object) {
574
- object.traverse((obj) => {
575
- if (obj.name) data.nodes[obj.name] = obj;
576
- if (obj.material) {
577
- const material = Array.isArray(obj.material) ? obj.material[0] : obj.material;
578
- const nameAlreadyUsed = data.materials[material.name];
579
- let materialName = material.name;
580
- if (nameAlreadyUsed) {
581
- materialName = materialName + `-${getUuidPrefix(material.uuid)}`;
582
- material.userData.materialCacheName = materialName;
583
- }
584
- data.materials[materialName] = material;
585
- }
586
- if (obj.isMesh && !data.meshes[obj.name]) data.meshes[obj.name] = obj;
587
- });
588
- }
589
- return data;
590
- }
591
- function dispose(obj) {
592
- if (obj.type !== "Scene") obj.dispose?.();
593
- for (const p in obj) {
594
- const prop = obj[p];
595
- if (prop?.type !== "Scene") prop?.dispose?.();
596
- }
597
- }
598
- function getInstanceProps(pendingProps) {
599
- const props = {};
600
- for (const key in pendingProps) {
601
- if (!REACT_INTERNAL_PROPS.includes(key)) props[key] = pendingProps[key];
602
- }
603
- return props;
604
- }
605
- function prepare(target, root, type, props) {
606
- const object = target;
607
- let instance = object?.__r3f;
608
- if (!instance) {
609
- instance = {
610
- root,
611
- type,
612
- parent: null,
613
- children: [],
614
- props: getInstanceProps(props),
615
- object,
616
- eventCount: 0,
617
- handlers: {},
618
- isHidden: false,
619
- deferredRefs: []
620
- };
621
- if (object) object.__r3f = instance;
622
- }
623
- return instance;
624
- }
625
- function invalidateInstance(instance) {
626
- if (!instance.parent) return;
627
- instance.props.onUpdate?.(instance.object);
628
- const state = instance.root?.getState?.();
629
- if (state && state.internal.frames === 0) state.invalidate();
630
- }
631
-
632
- const tempFrustum = new Frustum();
633
- let hasWarnedWebGL = false;
634
- let tslModule = null;
635
- async function loadTSL() {
636
- if (tslModule) return tslModule;
637
- try {
638
- const tsl = await import('three/tsl');
639
- tslModule = { uniform: tsl.uniform, nodeObject: tsl.nodeObject };
640
- return tslModule;
641
- } catch {
642
- return null;
643
- }
644
- }
645
- function createOcclusionObserverNode(store, uniform) {
646
- const node = new Node("float");
647
- node.updateType = NodeUpdateType.OBJECT;
648
- node.update = function(frame) {
649
- const { internal } = store.getState();
650
- const registry = internal.visibilityRegistry;
651
- const cache = internal.occlusionCache;
652
- for (const entry of registry.values()) {
653
- const { object, handlers } = entry;
654
- if (handlers.onOccluded || handlers.onVisible) {
655
- const isOccluded = frame.renderer.isOccluded(object);
656
- cache.set(object, isOccluded);
657
- }
318
+ function createOcclusionObserverNode(store, uniform) {
319
+ const node = new Node("float");
320
+ node.updateType = NodeUpdateType.OBJECT;
321
+ node.update = function(frame) {
322
+ const { internal } = store.getState();
323
+ const registry = internal.visibilityRegistry;
324
+ const cache = internal.occlusionCache;
325
+ for (const entry of registry.values()) {
326
+ const { object, handlers } = entry;
327
+ if (handlers.onOccluded || handlers.onVisible) {
328
+ const isOccluded = frame.renderer.isOccluded(object);
329
+ cache.set(object, isOccluded);
330
+ }
658
331
  }
659
332
  };
660
333
  node.setup = function() {
@@ -773,6 +446,17 @@ function unregisterVisibility(store, object) {
773
446
  internal.visibilityRegistry.delete(object.uuid);
774
447
  internal.occlusionCache.delete(object);
775
448
  }
449
+ function updateVisibilityHandlers(store, object, handlers) {
450
+ const { internal } = store.getState();
451
+ const entry = internal.visibilityRegistry.get(object.uuid);
452
+ if (!entry) return false;
453
+ entry.handlers = handlers;
454
+ if ((handlers.onOccluded || handlers.onVisible) && !internal.occlusionEnabled) {
455
+ object.occlusionTest = true;
456
+ enableOcclusion(store);
457
+ }
458
+ return true;
459
+ }
776
460
  function checkVisibility(state) {
777
461
  const { internal, camera } = state;
778
462
  const registry = internal.visibilityRegistry;
@@ -933,9 +617,9 @@ function diffProps(instance, newProps) {
933
617
  const { root, key } = resolve(instance.object, prop);
934
618
  if (root.constructor && root.constructor.length === 0) {
935
619
  const ctor = getMemoizedPrototype(root);
936
- if (!is.und(ctor)) changedProps[key] = ctor[key];
620
+ if (!is.und(ctor)) changedProps[prop] = ctor[key];
937
621
  } else {
938
- changedProps[key] = 0;
622
+ changedProps[prop] = 0;
939
623
  }
940
624
  }
941
625
  return changedProps;
@@ -960,10 +644,7 @@ function applyProps(object, props) {
960
644
  continue;
961
645
  }
962
646
  if (value === void 0) continue;
963
- if (isFromRef(value)) {
964
- instance?.deferredRefs?.push({ prop, ref: value[FROM_REF] });
965
- continue;
966
- }
647
+ if (isFromRef(value)) continue;
967
648
  if (isOnce(value)) {
968
649
  if (instance?.appliedOnce?.has(prop)) continue;
969
650
  if (instance) {
@@ -1030,6 +711,9 @@ function applyProps(object, props) {
1030
711
  if (instance.eventCount && object2.raycast !== null) {
1031
712
  rootState.internal.interaction.push(object2);
1032
713
  }
714
+ }
715
+ if (instance?.parent && rootState?.internal && instance.object?.isObject3D) {
716
+ const object2 = instance.object;
1033
717
  const root = findInitialRoot(instance);
1034
718
  const visibilityHandlers = {
1035
719
  onFramed: instance.handlers.onFramed,
@@ -1037,7 +721,9 @@ function applyProps(object, props) {
1037
721
  onVisible: instance.handlers.onVisible
1038
722
  };
1039
723
  if (hasVisibilityHandlers(visibilityHandlers)) {
1040
- registerVisibility(root, object2, visibilityHandlers);
724
+ if (!updateVisibilityHandlers(root, object2, visibilityHandlers)) {
725
+ registerVisibility(root, object2, visibilityHandlers);
726
+ }
1041
727
  } else {
1042
728
  unregisterVisibility(root, object2);
1043
729
  }
@@ -1050,1331 +736,902 @@ function applyProps(object, props) {
1050
736
  return object;
1051
737
  }
1052
738
 
1053
- const DEFAULT_POINTER_ID = 0;
1054
- const XR_POINTER_ID_START = 1e3;
1055
- function getPointerState(internal, pointerId) {
1056
- let state = internal.pointerMap.get(pointerId);
1057
- if (!state) {
1058
- state = {
1059
- hovered: /* @__PURE__ */ new Map(),
1060
- captured: /* @__PURE__ */ new Map(),
1061
- initialClick: [0, 0],
1062
- initialHits: []
1063
- };
1064
- internal.pointerMap.set(pointerId, state);
739
+ const shownNotices = /* @__PURE__ */ new Set();
740
+ function notifyDepreciated({ heading, body, link }) {
741
+ if (typeof process !== "undefined" && (process.env.NODE_ENV === "test" || process.env.JEST_WORKER_ID !== void 0) && process.env.R3F_SHOW_DEPRECATION_WARNINGS !== "true") {
742
+ return;
743
+ }
744
+ if (shownNotices.has(heading)) return;
745
+ shownNotices.add(heading);
746
+ const caller = getCallerFrame();
747
+ if (caller) {
748
+ console.log();
749
+ }
750
+ const boxStyle = "background: #ff9800; color: #1a1a1a; padding: 8px 12px; border-radius: 4px; font-weight: 500;";
751
+ if (caller) {
752
+ console.log(`%c\u26A0\uFE0F ${heading}`, boxStyle);
753
+ }
754
+ if (body || link) {
755
+ let message = "";
756
+ if (body) message += body;
757
+ if (link) message += (body ? "\n\n" : "") + `More info: ${link}`;
758
+ console.warn(`%c${message}`, "font-weight: bold;");
1065
759
  }
1066
- return state;
1067
760
  }
1068
- function getPointerId(event) {
1069
- return "pointerId" in event ? event.pointerId : DEFAULT_POINTER_ID;
761
+ function getCallerFrame(depth = 3) {
762
+ const stack = new Error().stack;
763
+ if (!stack) return null;
764
+ const lines = stack.split("\n");
765
+ const frame = lines[depth];
766
+ if (!frame) return null;
767
+ let match = frame.match(/^\s*at (?:(.+?) )?\(?(.+?):(\d+):(\d+)\)?$/);
768
+ if (!match) {
769
+ match = frame.match(/^(?:(.+?)@)?(.+?):(\d+):(\d+)$/);
770
+ }
771
+ if (!match) return null;
772
+ const [, fn, url, line] = match;
773
+ return {
774
+ functionName: fn ?? "<anonymous>",
775
+ location: formatLocation(url, Number(line))
776
+ };
1070
777
  }
1071
- function makeId(event) {
1072
- return (event.eventObject || event.object).uuid + "/" + event.index + event.instanceId;
778
+ function formatLocation(url, line) {
779
+ const clean = url.split("?")[0];
780
+ const file = clean.split("/").pop() ?? clean;
781
+ return `${file}:${line}`;
1073
782
  }
1074
- function releaseInternalPointerCapture(internal, obj, pointerId) {
1075
- const pointerState = internal.pointerMap.get(pointerId);
1076
- if (!pointerState) return;
1077
- const captureData = pointerState.captured.get(obj);
1078
- if (captureData) {
1079
- pointerState.captured.delete(obj);
1080
- captureData.target.releasePointerCapture(pointerId);
783
+ function notifyAlpha({ message, link }) {
784
+ if (typeof process !== "undefined" && (process.env.NODE_ENV === "test" || process.env.JEST_WORKER_ID !== void 0) && process.env.R3F_SHOW_ALPHA_WARNINGS !== "true") {
785
+ return;
1081
786
  }
1082
- }
1083
- function removeInteractivity(store, object) {
1084
- const { internal } = store.getState();
1085
- internal.interaction = internal.interaction.filter((o) => o !== object);
1086
- for (const [pointerId, pointerState] of internal.pointerMap) {
1087
- pointerState.initialHits = pointerState.initialHits.filter((o) => o !== object);
1088
- pointerState.hovered.forEach((value, key) => {
1089
- if (value.eventObject === object || value.object === object) {
1090
- pointerState.hovered.delete(key);
1091
- }
1092
- });
1093
- if (pointerState.captured.has(object)) {
1094
- releaseInternalPointerCapture(internal, object, pointerId);
1095
- }
787
+ if (shownNotices.has(message)) return;
788
+ shownNotices.add(message);
789
+ const boxStyle = "background: #6366f1; color: #ffffff; padding: 6px 10px; border-radius: 4px; font-weight: 500;";
790
+ console.log(`%c\u{1F52C} ${message}`, boxStyle);
791
+ {
792
+ console.log(`%cMore info: ${link}`, "color: #6366f1; font-weight: normal;");
1096
793
  }
1097
- unregisterVisibility(store, object);
1098
794
  }
1099
- function createEvents(store) {
1100
- function calculateDistance(event, pointerId) {
1101
- const { internal } = store.getState();
1102
- const pointerState = internal.pointerMap.get(pointerId);
1103
- if (!pointerState) return 0;
1104
- const [initialX, initialY] = pointerState.initialClick;
1105
- const dx = event.offsetX - initialX;
1106
- const dy = event.offsetY - initialY;
1107
- return Math.round(Math.sqrt(dx * dx + dy * dy));
1108
- }
1109
- function filterPointerEvents(objects) {
1110
- return objects.filter(
1111
- (obj) => ["Move", "Over", "Enter", "Out", "Leave"].some(
1112
- (name) => obj.__r3f?.handlers["onPointer" + name]
1113
- ) || ["OverEnter", "OverLeave", "Over"].some(
1114
- (name) => obj.__r3f?.handlers["onDrag" + name]
1115
- ) || obj.__r3f?.handlers.onDrop
1116
- );
1117
- }
1118
- function intersect(event, filter) {
1119
- const state = store.getState();
1120
- const duplicates = /* @__PURE__ */ new Set();
1121
- const intersections = [];
1122
- const eventsObjects = filter ? filter(state.internal.interaction) : state.internal.interaction;
1123
- for (let i = 0; i < eventsObjects.length; i++) {
1124
- const state2 = getRootState(eventsObjects[i]);
1125
- if (state2) {
1126
- state2.raycaster.camera = void 0;
1127
- }
1128
- }
1129
- if (!state.previousRoot) {
1130
- state.events.compute?.(event, state);
1131
- }
1132
- function handleRaycast(obj) {
1133
- const state2 = getRootState(obj);
1134
- if (!state2 || !state2.events.enabled || state2.raycaster.camera === null) return [];
1135
- if (state2.raycaster.camera === void 0) {
1136
- state2.events.compute?.(event, state2, state2.previousRoot?.getState());
1137
- if (state2.raycaster.camera === void 0) state2.raycaster.camera = null;
1138
- }
1139
- return state2.raycaster.camera ? state2.raycaster.intersectObject(obj, true) : [];
1140
- }
1141
- let hits = eventsObjects.flatMap(handleRaycast).sort((a, b) => {
1142
- const aInteractivePriority = a.object.userData?.interactivePriority;
1143
- const bInteractivePriority = b.object.userData?.interactivePriority;
1144
- if (aInteractivePriority !== void 0 || bInteractivePriority !== void 0) {
1145
- if (aInteractivePriority !== void 0 && bInteractivePriority === void 0) return -1;
1146
- if (bInteractivePriority !== void 0 && aInteractivePriority === void 0) return 1;
1147
- if (aInteractivePriority !== bInteractivePriority) {
1148
- return (bInteractivePriority ?? 0) - (aInteractivePriority ?? 0);
1149
- }
1150
- }
1151
- const aState = getRootState(a.object);
1152
- const bState = getRootState(b.object);
1153
- const aPriority = aState?.events?.priority ?? 1;
1154
- const bPriority = bState?.events?.priority ?? 1;
1155
- return bPriority - aPriority || a.distance - b.distance;
1156
- }).filter((item) => {
1157
- const id = makeId(item);
1158
- if (duplicates.has(id)) return false;
1159
- duplicates.add(id);
1160
- return true;
1161
- });
1162
- if (state.events.filter) hits = state.events.filter(hits, state);
1163
- for (const hit of hits) {
1164
- let eventObject = hit.object;
1165
- while (eventObject) {
1166
- if (eventObject.__r3f?.eventCount) {
1167
- intersections.push({ ...hit, eventObject });
1168
- }
1169
- eventObject = eventObject.parent;
795
+
796
+ const INTERNAL_LIB_MARKERS = ["zustand", "setState", "Object.assign"];
797
+ function isInternalRendererAccess(stack, callerDepth = 2) {
798
+ if (!stack) return false;
799
+ const caller = stack.split("\n")[callerDepth] ?? "";
800
+ return INTERNAL_LIB_MARKERS.some((m) => caller.includes(m));
801
+ }
802
+
803
+ const R3F_CONTEXT = Symbol.for("@react-three/fiber.context");
804
+ const context = globalThis[R3F_CONTEXT] ?? (globalThis[R3F_CONTEXT] = React.createContext(null));
805
+ const createStore = (invalidate, advance) => {
806
+ const rootStore = createWithEqualityFn((set, get) => {
807
+ const position = new Vector3();
808
+ const defaultTarget = new Vector3();
809
+ const tempTarget = new Vector3();
810
+ function getCurrentViewport(camera = get().camera, target = defaultTarget, size = get().size) {
811
+ const { width, height, top, left } = size;
812
+ const aspect = width / height;
813
+ if (target.isVector3) tempTarget.copy(target);
814
+ else tempTarget.set(...target);
815
+ const distance = camera.getWorldPosition(position).distanceTo(tempTarget);
816
+ if (isOrthographicCamera(camera)) {
817
+ return { width: width / camera.zoom, height: height / camera.zoom, top, left, factor: 1, distance, aspect };
818
+ } else {
819
+ const fov = camera.fov * Math.PI / 180;
820
+ const h = 2 * Math.tan(fov / 2) * distance;
821
+ const w = h * (width / height);
822
+ return { width: w, height: h, top, left, factor: width / w, distance, aspect };
1170
823
  }
1171
824
  }
1172
- if ("pointerId" in event) {
1173
- const pointerId = event.pointerId;
1174
- const pointerState = state.internal.pointerMap.get(pointerId);
1175
- if (pointerState?.captured.size) {
1176
- for (const captureData of pointerState.captured.values()) {
1177
- if (!duplicates.has(makeId(captureData.intersection))) intersections.push(captureData.intersection);
825
+ let performanceTimeout = void 0;
826
+ const setPerformanceCurrent = (current) => set((state2) => ({ performance: { ...state2.performance, current } }));
827
+ const pointer = new Vector2();
828
+ const rootState = {
829
+ set,
830
+ get,
831
+ // Mock objects that have to be configured
832
+ // primaryStore is set after store creation (self-reference for primary, primary's store for secondary)
833
+ primaryStore: null,
834
+ gl: null,
835
+ renderer: null,
836
+ camera: null,
837
+ frustum: new Frustum(),
838
+ autoUpdateFrustum: true,
839
+ raycaster: null,
840
+ events: {
841
+ priority: 1,
842
+ enabled: true,
843
+ connected: false,
844
+ frameTimedRaycasts: true,
845
+ alwaysFireOnScroll: true,
846
+ updateOnFrame: false
847
+ },
848
+ scene: null,
849
+ rootScene: null,
850
+ xr: null,
851
+ inspector: null,
852
+ invalidate: (frames = 1, stackFrames = false) => invalidate(get(), frames, stackFrames),
853
+ advance: (timestamp, runGlobalEffects) => advance(timestamp, runGlobalEffects, get()),
854
+ textureColorSpace: SRGBColorSpace,
855
+ isLegacy: false,
856
+ webGPUSupported: false,
857
+ isNative: false,
858
+ controls: null,
859
+ pointer,
860
+ mouse: pointer,
861
+ frameloop: "always",
862
+ onPointerMissed: void 0,
863
+ onDragOverMissed: void 0,
864
+ onDropMissed: void 0,
865
+ performance: {
866
+ current: 1,
867
+ min: 0.5,
868
+ max: 1,
869
+ debounce: 200,
870
+ regress: () => {
871
+ const state2 = get();
872
+ if (performanceTimeout) clearTimeout(performanceTimeout);
873
+ if (state2.performance.current !== state2.performance.min) setPerformanceCurrent(state2.performance.min);
874
+ performanceTimeout = setTimeout(
875
+ () => setPerformanceCurrent(get().performance.max),
876
+ state2.performance.debounce
877
+ );
1178
878
  }
1179
- }
1180
- }
1181
- return intersections;
1182
- }
1183
- function handleIntersects(intersections, event, delta, callback) {
1184
- if (intersections.length) {
1185
- const localState = { stopped: false };
1186
- for (const hit of intersections) {
1187
- const state = getRootState(hit.object);
1188
- if (state) {
1189
- const { raycaster, pointer, camera, internal } = state;
1190
- const unprojectedPoint = new Vector3(pointer.x, pointer.y, 0).unproject(camera);
1191
- const hasPointerCapture = (id) => {
1192
- const pointerState = internal.pointerMap.get(id);
1193
- return pointerState?.captured.has(hit.eventObject) ?? false;
1194
- };
1195
- const setPointerCapture = (id) => {
1196
- const captureData = { intersection: hit, target: event.target };
1197
- const pointerState = getPointerState(internal, id);
1198
- pointerState.captured.set(hit.eventObject, captureData);
1199
- event.target.setPointerCapture(id);
1200
- };
1201
- const releasePointerCapture = (id) => {
1202
- releaseInternalPointerCapture(internal, hit.eventObject, id);
1203
- };
1204
- const extractEventProps = {};
1205
- for (const prop in event) {
1206
- const property = event[prop];
1207
- if (typeof property !== "function") extractEventProps[prop] = property;
879
+ },
880
+ size: { width: 0, height: 0, top: 0, left: 0 },
881
+ viewport: {
882
+ initialDpr: 0,
883
+ dpr: 0,
884
+ width: 0,
885
+ height: 0,
886
+ top: 0,
887
+ left: 0,
888
+ aspect: 0,
889
+ distance: 0,
890
+ factor: 0,
891
+ getCurrentViewport
892
+ },
893
+ setEvents: (events) => set((state2) => ({ ...state2, events: { ...state2.events, ...events } })),
894
+ setSize: (width, height, top, left) => {
895
+ const state2 = get();
896
+ if (width === void 0) {
897
+ set({ _sizeImperative: false });
898
+ if (state2._sizeProps) {
899
+ const { width: propW, height: propH } = state2._sizeProps;
900
+ if (propW !== void 0 || propH !== void 0) {
901
+ const currentSize = state2.size;
902
+ const newSize = {
903
+ width: propW ?? currentSize.width,
904
+ height: propH ?? currentSize.height,
905
+ top: currentSize.top,
906
+ left: currentSize.left
907
+ };
908
+ set((s) => ({
909
+ size: newSize,
910
+ viewport: { ...s.viewport, ...getCurrentViewport(state2.camera, defaultTarget, newSize) }
911
+ }));
912
+ getScheduler().invalidate();
913
+ }
1208
914
  }
1209
- const eventPointerId = "pointerId" in event ? event.pointerId : void 0;
1210
- const raycastEvent = {
1211
- ...hit,
1212
- ...extractEventProps,
1213
- pointer,
1214
- intersections,
1215
- stopped: localState.stopped,
1216
- delta,
1217
- unprojectedPoint,
1218
- ray: raycaster.ray,
1219
- camera,
1220
- pointerId: eventPointerId,
1221
- // Hijack stopPropagation, which just sets a flag
1222
- stopPropagation() {
1223
- const pointerState = eventPointerId !== void 0 ? internal.pointerMap.get(eventPointerId) : void 0;
1224
- if (
1225
- // ...if this pointer hasn't been captured
1226
- !pointerState?.captured.size || // ... or if the hit object is capturing the pointer
1227
- pointerState.captured.has(hit.eventObject)
1228
- ) {
1229
- raycastEvent.stopped = localState.stopped = true;
1230
- if (pointerState?.hovered.size && Array.from(pointerState.hovered.values()).find((i) => i.eventObject === hit.eventObject)) {
1231
- const higher = intersections.slice(0, intersections.indexOf(hit));
1232
- cancelPointer([...higher, hit], eventPointerId);
1233
- }
1234
- }
1235
- },
1236
- // there should be a distinction between target and currentTarget
1237
- target: { hasPointerCapture, setPointerCapture, releasePointerCapture },
1238
- currentTarget: { hasPointerCapture, setPointerCapture, releasePointerCapture },
1239
- nativeEvent: event
1240
- };
1241
- callback(raycastEvent);
1242
- if (localState.stopped === true) break;
915
+ return;
1243
916
  }
917
+ const w = width;
918
+ const h = height ?? width;
919
+ const t = top ?? state2.size.top;
920
+ const l = left ?? state2.size.left;
921
+ const size = { width: w, height: h, top: t, left: l };
922
+ set((s) => ({
923
+ size,
924
+ viewport: { ...s.viewport, ...getCurrentViewport(state2.camera, defaultTarget, size) },
925
+ _sizeImperative: true
926
+ }));
927
+ getScheduler().invalidate();
928
+ },
929
+ setDpr: (dpr) => set((state2) => {
930
+ const resolved = calculateDpr(dpr);
931
+ return { viewport: { ...state2.viewport, dpr: resolved, initialDpr: state2.viewport.initialDpr || resolved } };
932
+ }),
933
+ setFrameloop: (frameloop = "always") => {
934
+ set(() => ({ frameloop }));
935
+ getScheduler().frameloop = frameloop;
936
+ },
937
+ setError: (error) => set(() => ({ error })),
938
+ error: null,
939
+ //* TSL State (managed via hooks: useUniforms, useNodes, useBuffers, useGPUStorage, useTextures, useRenderPipeline) ==============================
940
+ uniforms: {},
941
+ nodes: {},
942
+ buffers: {},
943
+ gpuStorage: {},
944
+ textures: /* @__PURE__ */ new Map(),
945
+ _textureRefs: /* @__PURE__ */ new Map(),
946
+ renderPipeline: null,
947
+ passes: {},
948
+ _hmrVersion: 0,
949
+ _sizeImperative: false,
950
+ _sizeProps: null,
951
+ previousRoot: void 0,
952
+ internal: {
953
+ // Events
954
+ interaction: [],
955
+ subscribers: [],
956
+ // Per-pointer state (new unified structure)
957
+ pointerMap: /* @__PURE__ */ new Map(),
958
+ pointerDirty: /* @__PURE__ */ new Map(),
959
+ lastEvent: React.createRef(),
960
+ // Deprecated but kept for backwards compatibility
961
+ hovered: /* @__PURE__ */ new Map(),
962
+ initialClick: [0, 0],
963
+ initialHits: [],
964
+ capturedMap: /* @__PURE__ */ new Map(),
965
+ // Visibility tracking (onFramed, onOccluded, onVisible)
966
+ visibilityRegistry: /* @__PURE__ */ new Map(),
967
+ // Occlusion system (WebGPU only)
968
+ occlusionEnabled: false,
969
+ occlusionObserver: null,
970
+ occlusionCache: /* @__PURE__ */ new Map(),
971
+ helperGroup: null,
972
+ // Updates
973
+ active: false,
974
+ frames: 0,
975
+ priority: 0,
976
+ subscribe: (ref, priority, store) => {
977
+ const internal = get().internal;
978
+ internal.priority = internal.priority + (priority > 0 ? 1 : 0);
979
+ internal.subscribers.push({ ref, priority, store });
980
+ internal.subscribers = internal.subscribers.sort((a, b) => a.priority - b.priority);
981
+ return () => {
982
+ const internal2 = get().internal;
983
+ if (internal2?.subscribers) {
984
+ internal2.priority = internal2.priority - (priority > 0 ? 1 : 0);
985
+ internal2.subscribers = internal2.subscribers.filter((s) => s.ref !== ref);
986
+ }
987
+ };
988
+ },
989
+ // Renderer Storage (single source of truth)
990
+ actualRenderer: null,
991
+ // Scheduler for useFrameNext (initialized in renderer.tsx)
992
+ scheduler: null
1244
993
  }
1245
- }
1246
- return intersections;
1247
- }
1248
- function cancelPointer(intersections, pointerId) {
1249
- const { internal } = store.getState();
1250
- const pid = pointerId ?? DEFAULT_POINTER_ID;
1251
- const pointerState = internal.pointerMap.get(pid);
1252
- if (!pointerState) return;
1253
- for (const [hoveredId, hoveredObj] of pointerState.hovered) {
1254
- if (!intersections.length || !intersections.find(
1255
- (hit) => hit.object === hoveredObj.object && hit.index === hoveredObj.index && hit.instanceId === hoveredObj.instanceId
1256
- )) {
1257
- const eventObject = hoveredObj.eventObject;
1258
- const instance = eventObject.__r3f;
1259
- pointerState.hovered.delete(hoveredId);
1260
- if (instance?.eventCount) {
1261
- const handlers = instance.handlers;
1262
- const data = { ...hoveredObj, intersections };
1263
- handlers.onPointerOut?.(data);
1264
- handlers.onPointerLeave?.(data);
1265
- handlers.onDragOverLeave?.(data);
994
+ };
995
+ return rootState;
996
+ });
997
+ const state = rootStore.getState();
998
+ Object.defineProperty(state, "gl", {
999
+ get() {
1000
+ const currentState = rootStore.getState();
1001
+ if (!currentState.isLegacy && currentState.internal.actualRenderer) {
1002
+ const stack = new Error().stack || "";
1003
+ if (!isInternalRendererAccess(stack)) {
1004
+ const cleanedStack = stack.split("\n").slice(2).join("\n") || "Stack trace unavailable";
1005
+ notifyDepreciated({
1006
+ heading: "Accessing state.gl in WebGPU mode",
1007
+ body: "Please use state.renderer instead. state.gl is deprecated and will be removed in future versions.\n\nFor backwards compatibility, state.gl currently maps to state.renderer, but this may cause issues with libraries expecting WebGLRenderer.\n\nAccessed from:\n" + cleanedStack
1008
+ });
1266
1009
  }
1267
1010
  }
1011
+ return currentState.internal.actualRenderer;
1012
+ },
1013
+ set(value) {
1014
+ rootStore.getState().internal.actualRenderer = value;
1015
+ },
1016
+ enumerable: true,
1017
+ configurable: true
1018
+ });
1019
+ Object.defineProperty(state, "renderer", {
1020
+ get() {
1021
+ return rootStore.getState().internal.actualRenderer;
1022
+ },
1023
+ set(value) {
1024
+ rootStore.getState().internal.actualRenderer = value;
1025
+ },
1026
+ enumerable: true,
1027
+ configurable: true
1028
+ });
1029
+ let oldScene = state.scene;
1030
+ rootStore.subscribe(() => {
1031
+ const currentState = rootStore.getState();
1032
+ const { scene, rootScene, set } = currentState;
1033
+ if (scene !== oldScene) {
1034
+ oldScene = scene;
1035
+ if (scene?.isScene && scene !== rootScene) {
1036
+ set({ rootScene: scene });
1037
+ }
1268
1038
  }
1269
- }
1270
- function pointerMissed(event, objects) {
1271
- for (let i = 0; i < objects.length; i++) {
1272
- const instance = objects[i].__r3f;
1273
- instance?.handlers.onPointerMissed?.(event);
1274
- }
1275
- }
1276
- function dragOverMissed(event, objects) {
1277
- for (let i = 0; i < objects.length; i++) {
1278
- const instance = objects[i].__r3f;
1279
- instance?.handlers.onDragOverMissed?.(event);
1280
- }
1281
- }
1282
- function dropMissed(event, objects) {
1283
- for (let i = 0; i < objects.length; i++) {
1284
- const instance = objects[i].__r3f;
1285
- instance?.handlers.onDropMissed?.(event);
1039
+ });
1040
+ let oldSize = state.size;
1041
+ let oldDpr = state.viewport.dpr;
1042
+ let oldCamera = state.camera;
1043
+ rootStore.subscribe(() => {
1044
+ const { camera, size, viewport, set, internal } = rootStore.getState();
1045
+ const actualRenderer = internal.actualRenderer;
1046
+ const canvasTarget = internal.canvasTarget;
1047
+ if (size.width !== oldSize.width || size.height !== oldSize.height || viewport.dpr !== oldDpr) {
1048
+ oldSize = size;
1049
+ oldDpr = viewport.dpr;
1050
+ updateCamera(camera, size);
1051
+ const resizeTarget = canvasTarget ?? actualRenderer;
1052
+ if (viewport.dpr > 0) resizeTarget.setPixelRatio(viewport.dpr);
1053
+ resizeTarget.setSize(size.width, size.height, false);
1054
+ internal.canvasTargetSizeDirty = true;
1286
1055
  }
1287
- }
1288
- function cleanupPointer(pointerId) {
1289
- const { internal } = store.getState();
1290
- const pointerState = internal.pointerMap.get(pointerId);
1291
- if (pointerState) {
1292
- for (const [, hoveredObj] of pointerState.hovered) {
1293
- const eventObject = hoveredObj.eventObject;
1294
- const instance = eventObject.__r3f;
1295
- if (instance?.eventCount) {
1296
- const handlers = instance.handlers;
1297
- const data = { ...hoveredObj, intersections: [] };
1298
- handlers.onPointerOut?.(data);
1299
- handlers.onPointerLeave?.(data);
1300
- }
1056
+ if (camera !== oldCamera) {
1057
+ oldCamera = camera;
1058
+ const { rootScene } = rootStore.getState();
1059
+ if (camera && rootScene && !camera.parent) {
1060
+ rootScene.add(camera);
1301
1061
  }
1302
- internal.pointerMap.delete(pointerId);
1303
- }
1304
- internal.pointerDirty.delete(pointerId);
1305
- }
1306
- function processDeferredPointer(event, pointerId) {
1307
- const state = store.getState();
1308
- const { internal } = state;
1309
- if (!state.events.enabled) return;
1310
- const filter = filterPointerEvents;
1311
- const hits = intersect(event, filter);
1312
- cancelPointer(hits, pointerId);
1313
- function onIntersect(data) {
1314
- const eventObject = data.eventObject;
1315
- const instance = eventObject.__r3f;
1316
- if (!instance?.eventCount) return;
1317
- const handlers = instance.handlers;
1318
- if (handlers.onPointerOver || handlers.onPointerEnter || handlers.onPointerOut || handlers.onPointerLeave) {
1319
- const id = makeId(data);
1320
- const pointerState = getPointerState(internal, pointerId);
1321
- const hoveredItem = pointerState.hovered.get(id);
1322
- if (!hoveredItem) {
1323
- pointerState.hovered.set(id, data);
1324
- handlers.onPointerOver?.(data);
1325
- handlers.onPointerEnter?.(data);
1326
- } else if (hoveredItem.stopped) {
1327
- data.stopPropagation();
1328
- }
1062
+ set((state2) => ({ viewport: { ...state2.viewport, ...state2.viewport.getCurrentViewport(camera) } }));
1063
+ const currentState = rootStore.getState();
1064
+ if (currentState.autoUpdateFrustum && camera) {
1065
+ updateFrustum(camera, currentState.frustum);
1329
1066
  }
1330
- handlers.onPointerMove?.(data);
1331
1067
  }
1332
- handleIntersects(hits, event, 0, onIntersect);
1068
+ });
1069
+ rootStore.subscribe((state2) => invalidate(state2));
1070
+ return rootStore;
1071
+ };
1072
+
1073
+ const memoizedLoaders = /* @__PURE__ */ new WeakMap();
1074
+ const isConstructor$1 = (value) => typeof value === "function" && value?.prototype?.constructor === value;
1075
+ function getLoader$1(Proto) {
1076
+ if (isConstructor$1(Proto)) {
1077
+ let loader = memoizedLoaders.get(Proto);
1078
+ if (!loader) {
1079
+ loader = new Proto();
1080
+ memoizedLoaders.set(Proto, loader);
1081
+ }
1082
+ return loader;
1333
1083
  }
1334
- function handlePointer(name) {
1335
- switch (name) {
1336
- case "onPointerLeave":
1337
- case "onDragLeave":
1338
- return () => cancelPointer([]);
1339
- // Global cancel of these events
1340
- case "onPointerCancel":
1341
- return (event) => {
1342
- const pointerId = getPointerId(event);
1343
- cleanupPointer(pointerId);
1344
- };
1345
- case "onLostPointerCapture":
1346
- return (event) => {
1347
- const { internal } = store.getState();
1348
- const pointerId = getPointerId(event);
1349
- const pointerState = internal.pointerMap.get(pointerId);
1350
- if (pointerState?.captured.size) {
1351
- requestAnimationFrame(() => {
1352
- const pointerState2 = internal.pointerMap.get(pointerId);
1353
- if (pointerState2?.captured.size) {
1354
- pointerState2.captured.clear();
1355
- }
1356
- cancelPointer([], pointerId);
1357
- });
1358
- }
1359
- };
1084
+ return Proto;
1085
+ }
1086
+ function loadingFn(extensions, onProgress) {
1087
+ return function(Proto, input) {
1088
+ const loader = getLoader$1(Proto);
1089
+ if (extensions) extensions(loader);
1090
+ if ("loadAsync" in loader && typeof loader.loadAsync === "function") {
1091
+ return loader.loadAsync(input, onProgress).then((data) => {
1092
+ if (isObject3D(data?.scene)) Object.assign(data, buildGraph(data.scene));
1093
+ return data;
1094
+ });
1360
1095
  }
1361
- return function handleEvent(event) {
1096
+ return new Promise(
1097
+ (res, reject) => loader.load(
1098
+ input,
1099
+ (data) => {
1100
+ if (isObject3D(data?.scene)) Object.assign(data, buildGraph(data.scene));
1101
+ res(data);
1102
+ },
1103
+ onProgress,
1104
+ (error) => reject(new Error(`Could not load ${input}: ${error?.message}`))
1105
+ )
1106
+ );
1107
+ };
1108
+ }
1109
+ function useLoader(loader, input, extensions, onProgress, cacheKey) {
1110
+ const inputs = Array.isArray(input) ? input : [input];
1111
+ const cacheKeys = Array.isArray(cacheKey ?? input) ? cacheKey ?? input : [cacheKey ?? input];
1112
+ const fn = loadingFn(extensions, onProgress);
1113
+ const results = cacheKeys.map(
1114
+ (key, index) => suspend(() => fn(loader, inputs[index]), [loader, key], { equal: is.equ })
1115
+ );
1116
+ return Array.isArray(input) ? results : results[0];
1117
+ }
1118
+ useLoader.preload = function(loader, input, extensions, onProgress, cacheKey) {
1119
+ const inputs = Array.isArray(input) ? input : [input];
1120
+ const cacheKeys = Array.isArray(cacheKey ?? input) ? cacheKey ?? input : [cacheKey ?? input];
1121
+ cacheKeys.forEach(
1122
+ (key, index) => preload(() => loadingFn(extensions, onProgress)(loader, inputs[index]), [loader, key])
1123
+ );
1124
+ };
1125
+ useLoader.clear = function(loader, input, cacheKey) {
1126
+ const cacheKeys = Array.isArray(cacheKey ?? input) ? cacheKey ?? input : [cacheKey ?? input];
1127
+ cacheKeys.forEach((key) => clear([loader, key]));
1128
+ };
1129
+ useLoader.loader = getLoader$1;
1130
+
1131
+ function useFrame(callback, priorityOrOptions) {
1132
+ const store = React.useContext(context);
1133
+ const isInsideCanvas = store !== null;
1134
+ const scheduler = getScheduler();
1135
+ const optionsKey = typeof priorityOrOptions === "number" ? `p:${priorityOrOptions}` : priorityOrOptions ? JSON.stringify({
1136
+ id: priorityOrOptions.id,
1137
+ phase: priorityOrOptions.phase,
1138
+ priority: priorityOrOptions.priority,
1139
+ fps: priorityOrOptions.fps,
1140
+ drop: priorityOrOptions.drop,
1141
+ enabled: priorityOrOptions.enabled,
1142
+ before: priorityOrOptions.before,
1143
+ after: priorityOrOptions.after
1144
+ }) : "";
1145
+ const options = React.useMemo(() => {
1146
+ return typeof priorityOrOptions === "number" ? { priority: priorityOrOptions } : priorityOrOptions ?? {};
1147
+ }, [optionsKey]);
1148
+ const reactId = React.useId();
1149
+ const id = options.id ?? reactId;
1150
+ const callbackRef = useMutableCallback(callback);
1151
+ const isLegacyPriority = typeof priorityOrOptions === "number" && priorityOrOptions > 0;
1152
+ useIsomorphicLayoutEffect(() => {
1153
+ if (!callback) return;
1154
+ if (isInsideCanvas) {
1362
1155
  const state = store.getState();
1363
- const { onPointerMissed, onDragOverMissed, onDropMissed, internal, events } = state;
1364
- const pointerId = getPointerId(event);
1365
- internal.lastEvent.current = event;
1366
- if (!events.enabled) return;
1367
- const isPointerMove = name === "onPointerMove";
1368
- const isDragOver = name === "onDragOver";
1369
- const isDrop = name === "onDrop";
1370
- const isClickEvent = name === "onClick" || name === "onContextMenu" || name === "onDoubleClick";
1371
- const isPointerDown = name === "onPointerDown";
1372
- const isPointerUp = name === "onPointerUp";
1373
- const isWheel = name === "onWheel";
1374
- const canDeferRaycasts = events.frameTimedRaycasts && state.frameloop === "always";
1375
- if (isPointerMove && canDeferRaycasts) {
1376
- events.compute?.(event, state);
1377
- internal.pointerDirty.set(pointerId, event);
1378
- return;
1379
- }
1380
- if (isWheel && canDeferRaycasts && !events.alwaysFireOnScroll) {
1381
- events.compute?.(event, state);
1382
- internal.pointerDirty.set(pointerId, event);
1383
- return;
1384
- }
1385
- if ((isClickEvent || isPointerDown || isPointerUp) && internal.pointerDirty.has(pointerId)) {
1386
- const deferredEvent = internal.pointerDirty.get(pointerId);
1387
- internal.pointerDirty.delete(pointerId);
1388
- processDeferredPointer(deferredEvent, pointerId);
1389
- }
1390
- const filter = isPointerMove || isDragOver || isDrop ? filterPointerEvents : void 0;
1391
- const hits = intersect(event, filter);
1392
- const delta = isClickEvent ? calculateDistance(event, pointerId) : 0;
1393
- if (isPointerDown) {
1394
- const pointerState2 = getPointerState(internal, pointerId);
1395
- pointerState2.initialClick = [event.offsetX, event.offsetY];
1396
- pointerState2.initialHits = hits.map((hit) => hit.eventObject);
1397
- }
1398
- const pointerState = internal.pointerMap.get(pointerId);
1399
- const initialHits = pointerState?.initialHits ?? [];
1400
- if (isClickEvent && !hits.length) {
1401
- if (delta <= 2) {
1402
- pointerMissed(event, internal.interaction);
1403
- if (onPointerMissed) onPointerMissed(event);
1156
+ const rootId = state.internal.rootId;
1157
+ if (isLegacyPriority) {
1158
+ state.internal.priority++;
1159
+ let parentRoot = state.previousRoot;
1160
+ while (parentRoot) {
1161
+ const parentState = parentRoot.getState();
1162
+ if (parentState?.internal) parentState.internal.priority++;
1163
+ parentRoot = parentState?.previousRoot;
1404
1164
  }
1165
+ notifyDepreciated({
1166
+ heading: "useFrame with numeric priority is deprecated",
1167
+ body: 'Using useFrame(callback, number) to control render order is deprecated.\n\nFor custom rendering, use: useFrame(callback, { phase: "render" })\nFor execution order within update phase, use: useFrame(callback, { priority: number })',
1168
+ link: "https://docs.pmnd.rs/react-three-fiber/api/hooks#useframe"
1169
+ });
1405
1170
  }
1406
- if (isDragOver && !hits.length) {
1407
- dragOverMissed(event, internal.interaction);
1408
- if (onDragOverMissed) onDragOverMissed(event);
1409
- }
1410
- if (isDrop && !hits.length) {
1411
- dropMissed(event, internal.interaction);
1412
- if (onDropMissed) onDropMissed(event);
1413
- }
1414
- if (isPointerMove || isDragOver) {
1415
- cancelPointer(hits, pointerId);
1416
- }
1417
- function onIntersect(data) {
1418
- const eventObject = data.eventObject;
1419
- const instance = eventObject.__r3f;
1420
- if (!instance?.eventCount) return;
1421
- const handlers = instance.handlers;
1422
- if (isPointerMove) {
1423
- if (handlers.onPointerOver || handlers.onPointerEnter || handlers.onPointerOut || handlers.onPointerLeave) {
1424
- const id = makeId(data);
1425
- const pointerState2 = getPointerState(internal, pointerId);
1426
- const hoveredItem = pointerState2.hovered.get(id);
1427
- if (!hoveredItem) {
1428
- pointerState2.hovered.set(id, data);
1429
- handlers.onPointerOver?.(data);
1430
- handlers.onPointerEnter?.(data);
1431
- } else if (hoveredItem.stopped) {
1432
- data.stopPropagation();
1433
- }
1434
- }
1435
- handlers.onPointerMove?.(data);
1436
- } else if (isDragOver) {
1437
- const id = makeId(data);
1438
- const pointerState2 = getPointerState(internal, pointerId);
1439
- const hoveredItem = pointerState2.hovered.get(id);
1440
- if (!hoveredItem) {
1441
- pointerState2.hovered.set(id, data);
1442
- handlers.onDragOverEnter?.(data);
1443
- } else if (hoveredItem.stopped) {
1444
- data.stopPropagation();
1445
- }
1446
- handlers.onDragOver?.(data);
1447
- } else if (isDrop) {
1448
- handlers.onDrop?.(data);
1449
- } else {
1450
- const handler = handlers[name];
1451
- if (handler) {
1452
- if (!isClickEvent || initialHits.includes(eventObject)) {
1453
- pointerMissed(
1454
- event,
1455
- internal.interaction.filter((object) => !initialHits.includes(object))
1456
- );
1457
- handler(data);
1458
- }
1459
- } else {
1460
- if (isClickEvent && initialHits.includes(eventObject)) {
1461
- pointerMissed(
1462
- event,
1463
- internal.interaction.filter((object) => !initialHits.includes(object))
1464
- );
1171
+ const wrappedCallback = (frameState, delta) => {
1172
+ const localState = store.getState();
1173
+ const mergedState = {
1174
+ ...localState,
1175
+ time: frameState.time,
1176
+ delta: frameState.delta,
1177
+ elapsed: frameState.elapsed,
1178
+ frame: frameState.frame
1179
+ };
1180
+ callbackRef.current?.(mergedState, delta);
1181
+ };
1182
+ const unregister = scheduler.register(wrappedCallback, {
1183
+ id,
1184
+ rootId,
1185
+ ...options
1186
+ });
1187
+ return () => {
1188
+ unregister();
1189
+ if (isLegacyPriority) {
1190
+ const currentState = store.getState();
1191
+ if (currentState.internal) {
1192
+ currentState.internal.priority--;
1193
+ let parentRoot = currentState.previousRoot;
1194
+ while (parentRoot) {
1195
+ const parentState = parentRoot.getState();
1196
+ if (parentState?.internal) parentState.internal.priority--;
1197
+ parentRoot = parentState?.previousRoot;
1465
1198
  }
1466
1199
  }
1467
1200
  }
1468
- }
1469
- handleIntersects(hits, event, delta, onIntersect);
1470
- };
1471
- }
1472
- function flushDeferredPointers() {
1473
- const { internal, events } = store.getState();
1474
- if (!events.frameTimedRaycasts) return;
1475
- for (const [pointerId, event] of internal.pointerDirty) {
1476
- processDeferredPointer(event, pointerId);
1201
+ };
1202
+ } else {
1203
+ return scheduler.register(
1204
+ (state, delta) => {
1205
+ const frameState = state;
1206
+ if (!frameState.renderer) return;
1207
+ callbackRef.current?.(frameState, delta);
1208
+ },
1209
+ { id, ...options }
1210
+ );
1477
1211
  }
1478
- internal.pointerDirty.clear();
1479
- }
1480
- return { handlePointer, flushDeferredPointers, processDeferredPointer };
1481
- }
1482
- const DOM_EVENTS = {
1483
- onClick: ["click", false],
1484
- onContextMenu: ["contextmenu", false],
1485
- onDoubleClick: ["dblclick", false],
1486
- onDragEnter: ["dragenter", false],
1487
- onDragLeave: ["dragleave", false],
1488
- onDragOver: ["dragover", false],
1489
- onDrop: ["drop", false],
1490
- onWheel: ["wheel", true],
1491
- onPointerDown: ["pointerdown", true],
1492
- onPointerUp: ["pointerup", true],
1493
- onPointerLeave: ["pointerleave", true],
1494
- onPointerMove: ["pointermove", true],
1495
- onPointerCancel: ["pointercancel", true],
1496
- onLostPointerCapture: ["lostpointercapture", true]
1497
- };
1498
- function createPointerEvents(store) {
1499
- const { handlePointer, flushDeferredPointers, processDeferredPointer } = createEvents(store);
1500
- let nextXRPointerId = XR_POINTER_ID_START;
1501
- const xrPointers = /* @__PURE__ */ new Map();
1502
- return {
1503
- priority: 1,
1504
- enabled: true,
1505
- frameTimedRaycasts: true,
1506
- alwaysFireOnScroll: true,
1507
- updateOnFrame: false,
1508
- compute(event, state) {
1509
- state.pointer.set(event.offsetX / state.size.width * 2 - 1, -(event.offsetY / state.size.height) * 2 + 1);
1510
- state.raycaster.setFromCamera(state.pointer, state.camera);
1511
- },
1512
- connected: void 0,
1513
- handlers: Object.keys(DOM_EVENTS).reduce(
1514
- (acc, key) => ({ ...acc, [key]: handlePointer(key) }),
1515
- {}
1212
+ }, [store, scheduler, id, optionsKey, isLegacyPriority, isInsideCanvas]);
1213
+ const isPaused = React.useSyncExternalStore(
1214
+ // Subscribe function
1215
+ React.useCallback(
1216
+ (onStoreChange) => {
1217
+ return getScheduler().subscribeJobState(id, onStoreChange);
1218
+ },
1219
+ [id]
1516
1220
  ),
1517
- update: (pointerId) => {
1518
- const { events, internal } = store.getState();
1519
- if (!events.handlers) return;
1520
- if (pointerId !== void 0) {
1521
- const event = internal.pointerDirty.get(pointerId);
1522
- if (event) {
1523
- internal.pointerDirty.delete(pointerId);
1524
- processDeferredPointer(event, pointerId);
1525
- } else if (internal.lastEvent?.current) {
1526
- processDeferredPointer(internal.lastEvent.current, pointerId);
1527
- }
1528
- } else {
1529
- flushDeferredPointers();
1530
- if (internal.lastEvent?.current) {
1531
- events.handlers.onPointerMove(internal.lastEvent.current);
1532
- }
1533
- }
1534
- },
1535
- flush: () => {
1536
- const { events, internal } = store.getState();
1537
- flushDeferredPointers();
1538
- if (events.updateOnFrame && internal.lastEvent?.current && events.handlers) {
1539
- events.handlers.onPointerMove(internal.lastEvent.current);
1540
- }
1541
- },
1542
- connect: (target) => {
1543
- if (!target) return;
1544
- const { set, events } = store.getState();
1545
- events.disconnect?.();
1546
- set((state) => ({ events: { ...state.events, connected: target } }));
1547
- if (events.handlers) {
1548
- for (const name in events.handlers) {
1549
- const event = events.handlers[name];
1550
- const [eventName, passive] = DOM_EVENTS[name];
1551
- target.addEventListener(eventName, event, { passive });
1552
- }
1553
- }
1554
- },
1555
- disconnect: () => {
1556
- const { set, events } = store.getState();
1557
- if (events.connected) {
1558
- if (events.handlers) {
1559
- for (const name in events.handlers) {
1560
- const event = events.handlers[name];
1561
- const [eventName] = DOM_EVENTS[name];
1562
- events.connected.removeEventListener(eventName, event);
1563
- }
1564
- }
1565
- set((state) => ({ events: { ...state.events, connected: void 0 } }));
1566
- }
1567
- },
1568
- registerPointer: (config) => {
1569
- const pointerId = nextXRPointerId++;
1570
- xrPointers.set(pointerId, config);
1571
- const { internal } = store.getState();
1572
- getPointerState(internal, pointerId);
1573
- return pointerId;
1574
- },
1575
- unregisterPointer: (pointerId) => {
1576
- xrPointers.delete(pointerId);
1577
- const { internal } = store.getState();
1578
- const pointerState = internal.pointerMap.get(pointerId);
1579
- if (pointerState) {
1580
- for (const [, hoveredObj] of pointerState.hovered) {
1581
- const eventObject = hoveredObj.eventObject;
1582
- const instance = eventObject.__r3f;
1583
- if (instance?.eventCount) {
1584
- const handlers = instance.handlers;
1585
- const data = { ...hoveredObj, intersections: [] };
1586
- handlers.onPointerOut?.(data);
1587
- handlers.onPointerLeave?.(data);
1588
- }
1589
- }
1590
- internal.pointerMap.delete(pointerId);
1591
- }
1592
- internal.pointerDirty.delete(pointerId);
1593
- }
1594
- };
1221
+ // getSnapshot function
1222
+ React.useCallback(() => getScheduler().isJobPaused(id), [id]),
1223
+ // getServerSnapshot function (SSR)
1224
+ React.useCallback(() => false, [])
1225
+ );
1226
+ const controls = React.useMemo(() => {
1227
+ const scheduler2 = getScheduler();
1228
+ return {
1229
+ /** The job's unique ID */
1230
+ id,
1231
+ /**
1232
+ * Access to the global scheduler for frame loop control.
1233
+ * Use for controlling the entire frame loop, adding phases, etc.
1234
+ */
1235
+ scheduler: scheduler2,
1236
+ /**
1237
+ * Manually step this job only.
1238
+ * Bypasses FPS limiting - always runs.
1239
+ * @param timestamp Optional timestamp (defaults to performance.now())
1240
+ */
1241
+ step: (timestamp) => {
1242
+ getScheduler().stepJob(id, timestamp);
1243
+ },
1244
+ /**
1245
+ * Manually step ALL jobs in the scheduler.
1246
+ * Useful for frameloop='never' mode.
1247
+ * @param timestamp Optional timestamp (defaults to performance.now())
1248
+ */
1249
+ stepAll: (timestamp) => {
1250
+ getScheduler().step(timestamp);
1251
+ },
1252
+ /**
1253
+ * Pause this job (set enabled=false).
1254
+ * Job remains registered but won't run.
1255
+ */
1256
+ pause: () => {
1257
+ getScheduler().pauseJob(id);
1258
+ },
1259
+ /**
1260
+ * Resume this job (set enabled=true).
1261
+ */
1262
+ resume: () => {
1263
+ getScheduler().resumeJob(id);
1264
+ },
1265
+ /**
1266
+ * Reactive paused state - automatically updates when pause/resume is called.
1267
+ * No need for forceUpdate() in your components.
1268
+ */
1269
+ isPaused
1270
+ };
1271
+ }, [id, isPaused]);
1272
+ return controls;
1595
1273
  }
1596
1274
 
1597
- const shownNotices = /* @__PURE__ */ new Set();
1598
- function notifyDepreciated({ heading, body, link }) {
1599
- if (typeof process !== "undefined" && (process.env.NODE_ENV === "test" || process.env.JEST_WORKER_ID !== void 0) && process.env.R3F_SHOW_DEPRECATION_WARNINGS !== "true") {
1600
- return;
1601
- }
1602
- if (shownNotices.has(heading)) return;
1603
- shownNotices.add(heading);
1604
- const caller = getCallerFrame();
1605
- if (caller) {
1606
- console.log();
1607
- }
1608
- const boxStyle = "background: #ff9800; color: #1a1a1a; padding: 8px 12px; border-radius: 4px; font-weight: 500;";
1609
- if (caller) {
1610
- console.log(`%c\u26A0\uFE0F ${heading}`, boxStyle);
1611
- }
1612
- if (body || link) {
1613
- let message = "";
1614
- if (body) message += body;
1615
- if (link) message += (body ? "\n\n" : "") + `More info: ${link}`;
1616
- console.warn(`%c${message}`, "font-weight: bold;");
1617
- }
1618
- }
1619
- function getCallerFrame(depth = 3) {
1620
- const stack = new Error().stack;
1621
- if (!stack) return null;
1622
- const lines = stack.split("\n");
1623
- const frame = lines[depth];
1624
- if (!frame) return null;
1625
- let match = frame.match(/^\s*at (?:(.+?) )?\(?(.+?):(\d+):(\d+)\)?$/);
1626
- if (!match) {
1627
- match = frame.match(/^(?:(.+?)@)?(.+?):(\d+):(\d+)$/);
1628
- }
1629
- if (!match) return null;
1630
- const [, fn, url, line] = match;
1631
- return {
1632
- functionName: fn ?? "<anonymous>",
1633
- location: formatLocation(url, Number(line))
1634
- };
1275
+ const IsObject = (url) => url === Object(url) && !Array.isArray(url) && typeof url !== "function";
1276
+ function getUrls(input) {
1277
+ if (typeof input === "string") return [input];
1278
+ if (Array.isArray(input)) return input;
1279
+ return Object.values(input);
1635
1280
  }
1636
- function formatLocation(url, line) {
1637
- const clean = url.split("?")[0];
1638
- const file = clean.split("/").pop() ?? clean;
1639
- return `${file}:${line}`;
1281
+ function allUrlsCached(urls, textureCache) {
1282
+ return urls.every((url) => textureCache.has(url));
1640
1283
  }
1641
- function notifyAlpha({ message, link }) {
1642
- if (typeof process !== "undefined" && (process.env.NODE_ENV === "test" || process.env.JEST_WORKER_ID !== void 0) && process.env.R3F_SHOW_ALPHA_WARNINGS !== "true") {
1643
- return;
1644
- }
1645
- if (shownNotices.has(message)) return;
1646
- shownNotices.add(message);
1647
- const boxStyle = "background: #6366f1; color: #ffffff; padding: 6px 10px; border-radius: 4px; font-weight: 500;";
1648
- console.log(`%c\u{1F52C} ${message}`, boxStyle);
1649
- {
1650
- console.log(`%cMore info: ${link}`, "color: #6366f1; font-weight: normal;");
1284
+ function buildFromCache(input, textureCache) {
1285
+ if (typeof input === "string") {
1286
+ return textureCache.get(input);
1287
+ } else if (Array.isArray(input)) {
1288
+ return input.map((url) => textureCache.get(url));
1289
+ } else {
1290
+ const result = {};
1291
+ const objInput = input;
1292
+ for (const key in objInput) {
1293
+ result[key] = textureCache.get(objInput[key]);
1294
+ }
1295
+ return result;
1651
1296
  }
1652
1297
  }
1653
-
1654
- const INTERNAL_LIB_MARKERS = ["zustand", "setState", "Object.assign"];
1655
- const INTERNAL_FIBER_MARKERS = ["packages/fiber/src", "packages/fiber/dist", "@react-three/fiber", "@react-three_fiber"];
1656
- function isInternalRendererAccess(stack, callerDepth = 2) {
1657
- if (!stack) return false;
1658
- const caller = stack.split("\n")[callerDepth] ?? "";
1659
- return INTERNAL_LIB_MARKERS.some((m) => caller.includes(m)) || INTERNAL_FIBER_MARKERS.some((m) => caller.includes(m));
1660
- }
1661
-
1662
- const R3F_CONTEXT = Symbol.for("@react-three/fiber.context");
1663
- const context = globalThis[R3F_CONTEXT] ?? (globalThis[R3F_CONTEXT] = React.createContext(null));
1664
- const createStore = (invalidate, advance) => {
1665
- const rootStore = createWithEqualityFn((set, get) => {
1666
- const position = new Vector3();
1667
- const defaultTarget = new Vector3();
1668
- const tempTarget = new Vector3();
1669
- function getCurrentViewport(camera = get().camera, target = defaultTarget, size = get().size) {
1670
- const { width, height, top, left } = size;
1671
- const aspect = width / height;
1672
- if (target.isVector3) tempTarget.copy(target);
1673
- else tempTarget.set(...target);
1674
- const distance = camera.getWorldPosition(position).distanceTo(tempTarget);
1675
- if (isOrthographicCamera(camera)) {
1676
- return { width: width / camera.zoom, height: height / camera.zoom, top, left, factor: 1, distance, aspect };
1677
- } else {
1678
- const fov = camera.fov * Math.PI / 180;
1679
- const h = 2 * Math.tan(fov / 2) * distance;
1680
- const w = h * (width / height);
1681
- return { width: w, height: h, top, left, factor: width / w, distance, aspect };
1298
+ function useTexture(input, optionsOrOnLoad) {
1299
+ const renderer = useThree((state) => state.internal.actualRenderer);
1300
+ const store = useStore();
1301
+ const options = typeof optionsOrOnLoad === "function" ? { onLoad: optionsOrOnLoad } : optionsOrOnLoad ?? {};
1302
+ const { onLoad, cache = true } = options;
1303
+ const onLoadRef = useRef(onLoad);
1304
+ onLoadRef.current = onLoad;
1305
+ const onLoadCalledForRef = useRef(null);
1306
+ const urls = useMemo(() => getUrls(input), [input]);
1307
+ const cachedResult = useMemo(() => {
1308
+ if (!cache) return null;
1309
+ const textures = store.getState().textures;
1310
+ if (!allUrlsCached(urls, textures)) return null;
1311
+ return buildFromCache(input, textures);
1312
+ }, [cache, urls, input, store]);
1313
+ const loadedTextures = useLoader(
1314
+ TextureLoader,
1315
+ IsObject(input) ? Object.values(input) : input
1316
+ );
1317
+ const inputKey = urls.join("\0");
1318
+ useLayoutEffect(() => {
1319
+ if (cachedResult) return;
1320
+ if (onLoadCalledForRef.current === inputKey) return;
1321
+ onLoadCalledForRef.current = inputKey;
1322
+ onLoadRef.current?.(loadedTextures);
1323
+ }, [cachedResult, loadedTextures, inputKey]);
1324
+ useEffect(() => {
1325
+ if (cachedResult) return;
1326
+ if ("initTexture" in renderer) {
1327
+ let textureArray = [];
1328
+ if (Array.isArray(loadedTextures)) {
1329
+ textureArray = loadedTextures;
1330
+ } else if (loadedTextures instanceof Texture$1) {
1331
+ textureArray = [loadedTextures];
1332
+ } else if (IsObject(loadedTextures)) {
1333
+ textureArray = Object.values(loadedTextures);
1682
1334
  }
1335
+ textureArray.forEach((texture) => {
1336
+ if (texture instanceof Texture$1) {
1337
+ renderer.initTexture(texture);
1338
+ }
1339
+ });
1683
1340
  }
1684
- let performanceTimeout = void 0;
1685
- const setPerformanceCurrent = (current) => set((state2) => ({ performance: { ...state2.performance, current } }));
1686
- const pointer = new Vector2();
1687
- const rootState = {
1688
- set,
1689
- get,
1690
- // Mock objects that have to be configured
1691
- // primaryStore is set after store creation (self-reference for primary, primary's store for secondary)
1692
- primaryStore: null,
1693
- gl: null,
1694
- renderer: null,
1695
- camera: null,
1696
- frustum: new Frustum(),
1697
- autoUpdateFrustum: true,
1698
- raycaster: null,
1699
- events: {
1700
- priority: 1,
1701
- enabled: true,
1702
- connected: false,
1703
- frameTimedRaycasts: true,
1704
- alwaysFireOnScroll: true,
1705
- updateOnFrame: false
1706
- },
1707
- scene: null,
1708
- rootScene: null,
1709
- xr: null,
1710
- inspector: null,
1711
- invalidate: (frames = 1, stackFrames = false) => invalidate(get(), frames, stackFrames),
1712
- advance: (timestamp, runGlobalEffects) => advance(timestamp, runGlobalEffects, get()),
1713
- textureColorSpace: SRGBColorSpace,
1714
- isLegacy: false,
1715
- webGPUSupported: false,
1716
- isNative: false,
1717
- controls: null,
1718
- pointer,
1719
- mouse: pointer,
1720
- frameloop: "always",
1721
- onPointerMissed: void 0,
1722
- onDragOverMissed: void 0,
1723
- onDropMissed: void 0,
1724
- performance: {
1725
- current: 1,
1726
- min: 0.5,
1727
- max: 1,
1728
- debounce: 200,
1729
- regress: () => {
1730
- const state2 = get();
1731
- if (performanceTimeout) clearTimeout(performanceTimeout);
1732
- if (state2.performance.current !== state2.performance.min) setPerformanceCurrent(state2.performance.min);
1733
- performanceTimeout = setTimeout(
1734
- () => setPerformanceCurrent(get().performance.max),
1735
- state2.performance.debounce
1736
- );
1341
+ }, [renderer, loadedTextures, cachedResult]);
1342
+ const mappedTextures = useMemo(() => {
1343
+ if (cachedResult) return cachedResult;
1344
+ if (IsObject(input)) {
1345
+ const keyed = {};
1346
+ const textureArray = loadedTextures;
1347
+ let i = 0;
1348
+ for (const key in input) keyed[key] = textureArray[i++];
1349
+ return keyed;
1350
+ } else {
1351
+ return loadedTextures;
1352
+ }
1353
+ }, [input, loadedTextures, cachedResult]);
1354
+ useEffect(() => {
1355
+ if (!cache) return;
1356
+ const urlTextureMap = [];
1357
+ if (typeof input === "string") {
1358
+ urlTextureMap.push([input, mappedTextures]);
1359
+ } else if (Array.isArray(input)) {
1360
+ const textureArray = mappedTextures;
1361
+ input.forEach((url, i) => urlTextureMap.push([url, textureArray[i]]));
1362
+ } else if (IsObject(input)) {
1363
+ const textureRecord = mappedTextures;
1364
+ for (const key in input) {
1365
+ const url = input[key];
1366
+ urlTextureMap.push([url, textureRecord[key]]);
1367
+ }
1368
+ }
1369
+ store.setState((state) => {
1370
+ const refs = new Map(state._textureRefs);
1371
+ let textures = state.textures;
1372
+ let added = false;
1373
+ for (const [url, texture] of urlTextureMap) {
1374
+ if (!textures.has(url)) {
1375
+ if (!added) {
1376
+ textures = new Map(textures);
1377
+ added = true;
1378
+ }
1379
+ textures.set(url, texture);
1737
1380
  }
1381
+ refs.set(url, (refs.get(url) ?? 0) + 1);
1382
+ }
1383
+ return added ? { textures, _textureRefs: refs } : { _textureRefs: refs };
1384
+ });
1385
+ return () => store.setState((state) => {
1386
+ const refs = new Map(state._textureRefs);
1387
+ for (const [url] of urlTextureMap) {
1388
+ const next = (refs.get(url) ?? 0) - 1;
1389
+ if (next <= 0) refs.delete(url);
1390
+ else refs.set(url, next);
1391
+ }
1392
+ return { _textureRefs: refs };
1393
+ });
1394
+ }, [cache, input, mappedTextures, store]);
1395
+ return mappedTextures;
1396
+ }
1397
+ useTexture.preload = (url) => useLoader.preload(TextureLoader, url);
1398
+ useTexture.clear = (input) => useLoader.clear(TextureLoader, input);
1399
+ const Texture = ({
1400
+ children,
1401
+ input,
1402
+ onLoad,
1403
+ cache
1404
+ }) => {
1405
+ const options = typeof onLoad === "function" ? { onLoad, cache } : { ...onLoad, cache };
1406
+ const ret = useTexture(input, options);
1407
+ return /* @__PURE__ */ jsx(Fragment, { children: children?.(ret) });
1408
+ };
1409
+
1410
+ function useTextures(selector) {
1411
+ const store = useStore();
1412
+ const registry = useMemo(() => {
1413
+ const getState = store.getState;
1414
+ const setState = store.setState;
1415
+ const getOne = (key) => getState().textures.get(key);
1416
+ return {
1417
+ get all() {
1418
+ return getState().textures;
1738
1419
  },
1739
- size: { width: 0, height: 0, top: 0, left: 0 },
1740
- viewport: {
1741
- initialDpr: 0,
1742
- dpr: 0,
1743
- width: 0,
1744
- height: 0,
1745
- top: 0,
1746
- left: 0,
1747
- aspect: 0,
1748
- distance: 0,
1749
- factor: 0,
1750
- getCurrentViewport
1420
+ get(input) {
1421
+ if (typeof input === "string") return getOne(input);
1422
+ if (Array.isArray(input)) return input.map(getOne);
1423
+ const out = {};
1424
+ for (const name in input) out[name] = getOne(input[name]);
1425
+ return out;
1751
1426
  },
1752
- setEvents: (events) => set((state2) => ({ ...state2, events: { ...state2.events, ...events } })),
1753
- setSize: (width, height, top, left) => {
1754
- const state2 = get();
1755
- if (width === void 0) {
1756
- set({ _sizeImperative: false });
1757
- if (state2._sizeProps) {
1758
- const { width: propW, height: propH } = state2._sizeProps;
1759
- if (propW !== void 0 || propH !== void 0) {
1760
- const currentSize = state2.size;
1761
- const newSize = {
1762
- width: propW ?? currentSize.width,
1763
- height: propH ?? currentSize.height,
1764
- top: currentSize.top,
1765
- left: currentSize.left
1766
- };
1767
- set((s) => ({
1768
- size: newSize,
1769
- viewport: { ...s.viewport, ...getCurrentViewport(state2.camera, defaultTarget, newSize) }
1770
- }));
1771
- getScheduler().invalidate();
1772
- }
1427
+ has: (key) => getState().textures.has(key),
1428
+ add(keyOrRecord, texture) {
1429
+ setState((state) => {
1430
+ const textures = new Map(state.textures);
1431
+ if (typeof keyOrRecord === "string") {
1432
+ textures.set(keyOrRecord, texture);
1433
+ } else {
1434
+ for (const key in keyOrRecord) textures.set(key, keyOrRecord[key]);
1773
1435
  }
1774
- return;
1775
- }
1776
- const w = width;
1777
- const h = height ?? width;
1778
- const t = top ?? state2.size.top;
1779
- const l = left ?? state2.size.left;
1780
- const size = { width: w, height: h, top: t, left: l };
1781
- set((s) => ({
1782
- size,
1783
- viewport: { ...s.viewport, ...getCurrentViewport(state2.camera, defaultTarget, size) },
1784
- _sizeImperative: true
1785
- }));
1786
- getScheduler().invalidate();
1787
- },
1788
- setDpr: (dpr) => set((state2) => {
1789
- const resolved = calculateDpr(dpr);
1790
- return { viewport: { ...state2.viewport, dpr: resolved, initialDpr: state2.viewport.initialDpr || resolved } };
1791
- }),
1792
- setFrameloop: (frameloop = "always") => {
1793
- set(() => ({ frameloop }));
1436
+ return { textures };
1437
+ });
1794
1438
  },
1795
- setError: (error) => set(() => ({ error })),
1796
- error: null,
1797
- //* TSL State (managed via hooks: useUniforms, useNodes, useBuffers, useGPUStorage, useTextures, useRenderPipeline) ==============================
1798
- uniforms: {},
1799
- nodes: {},
1800
- buffers: {},
1801
- gpuStorage: {},
1802
- textures: /* @__PURE__ */ new Map(),
1803
- _textureRefs: /* @__PURE__ */ new Map(),
1804
- renderPipeline: null,
1805
- passes: {},
1806
- _hmrVersion: 0,
1807
- _sizeImperative: false,
1808
- _sizeProps: null,
1809
- previousRoot: void 0,
1810
- internal: {
1811
- // Events
1812
- interaction: [],
1813
- subscribers: [],
1814
- // Per-pointer state (new unified structure)
1815
- pointerMap: /* @__PURE__ */ new Map(),
1816
- pointerDirty: /* @__PURE__ */ new Map(),
1817
- lastEvent: React.createRef(),
1818
- // Deprecated but kept for backwards compatibility
1819
- hovered: /* @__PURE__ */ new Map(),
1820
- initialClick: [0, 0],
1821
- initialHits: [],
1822
- capturedMap: /* @__PURE__ */ new Map(),
1823
- // Visibility tracking (onFramed, onOccluded, onVisible)
1824
- visibilityRegistry: /* @__PURE__ */ new Map(),
1825
- // Occlusion system (WebGPU only)
1826
- occlusionEnabled: false,
1827
- occlusionObserver: null,
1828
- occlusionCache: /* @__PURE__ */ new Map(),
1829
- helperGroup: null,
1830
- // Updates
1831
- active: false,
1832
- frames: 0,
1833
- priority: 0,
1834
- subscribe: (ref, priority, store) => {
1835
- const internal = get().internal;
1836
- internal.priority = internal.priority + (priority > 0 ? 1 : 0);
1837
- internal.subscribers.push({ ref, priority, store });
1838
- internal.subscribers = internal.subscribers.sort((a, b) => a.priority - b.priority);
1839
- return () => {
1840
- const internal2 = get().internal;
1841
- if (internal2?.subscribers) {
1842
- internal2.priority = internal2.priority - (priority > 0 ? 1 : 0);
1843
- internal2.subscribers = internal2.subscribers.filter((s) => s.ref !== ref);
1844
- }
1845
- };
1846
- },
1847
- // Renderer Storage (single source of truth)
1848
- actualRenderer: null,
1849
- // Scheduler for useFrameNext (initialized in renderer.tsx)
1850
- scheduler: null
1851
- }
1852
- };
1853
- return rootState;
1854
- });
1855
- const state = rootStore.getState();
1856
- Object.defineProperty(state, "gl", {
1857
- get() {
1858
- const currentState = rootStore.getState();
1859
- if (!currentState.isLegacy && currentState.internal.actualRenderer) {
1860
- const stack = new Error().stack || "";
1861
- if (!isInternalRendererAccess(stack)) {
1862
- const cleanedStack = stack.split("\n").slice(2).join("\n") || "Stack trace unavailable";
1863
- notifyDepreciated({
1864
- heading: "Accessing state.gl in WebGPU mode",
1865
- body: "Please use state.renderer instead. state.gl is deprecated and will be removed in future versions.\n\nFor backwards compatibility, state.gl currently maps to state.renderer, but this may cause issues with libraries expecting WebGLRenderer.\n\nAccessed from:\n" + cleanedStack
1866
- });
1867
- }
1868
- }
1869
- return currentState.internal.actualRenderer;
1870
- },
1871
- set(value) {
1872
- rootStore.getState().internal.actualRenderer = value;
1873
- },
1874
- enumerable: true,
1875
- configurable: true
1876
- });
1877
- Object.defineProperty(state, "renderer", {
1878
- get() {
1879
- return rootStore.getState().internal.actualRenderer;
1880
- },
1881
- set(value) {
1882
- rootStore.getState().internal.actualRenderer = value;
1883
- },
1884
- enumerable: true,
1885
- configurable: true
1886
- });
1887
- let oldScene = state.scene;
1888
- rootStore.subscribe(() => {
1889
- const currentState = rootStore.getState();
1890
- const { scene, rootScene, set } = currentState;
1891
- if (scene !== oldScene) {
1892
- oldScene = scene;
1893
- if (scene?.isScene && scene !== rootScene) {
1894
- set({ rootScene: scene });
1895
- }
1896
- }
1897
- });
1898
- let oldSize = state.size;
1899
- let oldDpr = state.viewport.dpr;
1900
- let oldCamera = state.camera;
1901
- rootStore.subscribe(() => {
1902
- const { camera, size, viewport, set, internal } = rootStore.getState();
1903
- const actualRenderer = internal.actualRenderer;
1904
- const canvasTarget = internal.canvasTarget;
1905
- if (size.width !== oldSize.width || size.height !== oldSize.height || viewport.dpr !== oldDpr) {
1906
- oldSize = size;
1907
- oldDpr = viewport.dpr;
1908
- updateCamera(camera, size);
1909
- if (internal.isSecondary && canvasTarget) {
1910
- if (viewport.dpr > 0) canvasTarget.setPixelRatio(viewport.dpr);
1911
- canvasTarget.setSize(size.width, size.height, false);
1912
- } else {
1913
- if (viewport.dpr > 0) actualRenderer.setPixelRatio(viewport.dpr);
1914
- actualRenderer.setSize(size.width, size.height, false);
1915
- if (canvasTarget) {
1916
- if (viewport.dpr > 0) canvasTarget.setPixelRatio(viewport.dpr);
1917
- canvasTarget.setSize(size.width, size.height, false);
1439
+ dispose(key, options) {
1440
+ const state = getState();
1441
+ const refs = state._textureRefs.get(key) ?? 0;
1442
+ if (refs > 0 && !options?.force) {
1443
+ console.warn(
1444
+ `[useTextures] "${key}" still has ${refs} active reference(s); skipping dispose. Pass { force: true } to override.`
1445
+ );
1446
+ return false;
1918
1447
  }
1448
+ state.textures.get(key)?.dispose();
1449
+ setState((s) => {
1450
+ const textures = new Map(s.textures);
1451
+ textures.delete(key);
1452
+ const nextRefs = new Map(s._textureRefs);
1453
+ nextRefs.delete(key);
1454
+ return { textures, _textureRefs: nextRefs };
1455
+ });
1456
+ return true;
1457
+ },
1458
+ disposeAll() {
1459
+ for (const texture of getState().textures.values()) texture.dispose();
1460
+ setState({ textures: /* @__PURE__ */ new Map(), _textureRefs: /* @__PURE__ */ new Map() });
1919
1461
  }
1920
- }
1921
- if (camera !== oldCamera) {
1922
- oldCamera = camera;
1923
- const { rootScene } = rootStore.getState();
1924
- if (camera && rootScene && !camera.parent) {
1925
- rootScene.add(camera);
1926
- }
1927
- set((state2) => ({ viewport: { ...state2.viewport, ...state2.viewport.getCurrentViewport(camera) } }));
1928
- const currentState = rootStore.getState();
1929
- if (currentState.autoUpdateFrustum && camera) {
1930
- updateFrustum(camera, currentState.frustum);
1931
- }
1932
- }
1933
- });
1934
- rootStore.subscribe((state2) => invalidate(state2));
1935
- return rootStore;
1936
- };
1462
+ };
1463
+ }, [store]);
1464
+ const subscribe = selector ? () => selector(registry) : (state) => state.textures;
1465
+ const selected = useThree(subscribe);
1466
+ return selector ? selected : registry;
1467
+ }
1937
1468
 
1938
- const memoizedLoaders = /* @__PURE__ */ new WeakMap();
1939
- const isConstructor$1 = (value) => typeof value === "function" && value?.prototype?.constructor === value;
1940
- function getLoader(Proto) {
1941
- if (isConstructor$1(Proto)) {
1942
- let loader = memoizedLoaders.get(Proto);
1943
- if (!loader) {
1944
- loader = new Proto();
1945
- memoizedLoaders.set(Proto, loader);
1469
+ function useRenderTarget(widthOrOptions, heightOrOptions, options) {
1470
+ const isLegacy = useThree((s) => s.isLegacy);
1471
+ const size = useThree((s) => s.size);
1472
+ let width;
1473
+ let height;
1474
+ let opts;
1475
+ if (typeof widthOrOptions === "object") {
1476
+ opts = widthOrOptions;
1477
+ } else if (typeof widthOrOptions === "number") {
1478
+ width = widthOrOptions;
1479
+ if (typeof heightOrOptions === "object") {
1480
+ height = widthOrOptions;
1481
+ opts = heightOrOptions;
1482
+ } else if (typeof heightOrOptions === "number") {
1483
+ height = heightOrOptions;
1484
+ opts = options;
1485
+ } else {
1486
+ height = widthOrOptions;
1946
1487
  }
1947
- return loader;
1948
1488
  }
1949
- return Proto;
1950
- }
1951
- function loadingFn(extensions, onProgress) {
1952
- return function(Proto, input) {
1953
- const loader = getLoader(Proto);
1954
- if (extensions) extensions(loader);
1955
- if ("loadAsync" in loader && typeof loader.loadAsync === "function") {
1956
- return loader.loadAsync(input, onProgress).then((data) => {
1957
- if (isObject3D(data?.scene)) Object.assign(data, buildGraph(data.scene));
1958
- return data;
1959
- });
1960
- }
1961
- return new Promise(
1962
- (res, reject) => loader.load(
1963
- input,
1964
- (data) => {
1965
- if (isObject3D(data?.scene)) Object.assign(data, buildGraph(data.scene));
1966
- res(data);
1967
- },
1968
- onProgress,
1969
- (error) => reject(new Error(`Could not load ${input}: ${error?.message}`))
1970
- )
1971
- );
1972
- };
1973
- }
1974
- function useLoader(loader, input, extensions, onProgress, cacheKey) {
1975
- const inputs = Array.isArray(input) ? input : [input];
1976
- const cacheKeys = Array.isArray(cacheKey ?? input) ? cacheKey ?? input : [cacheKey ?? input];
1977
- const fn = loadingFn(extensions, onProgress);
1978
- const results = cacheKeys.map(
1979
- (key, index) => suspend(() => fn(loader, inputs[index]), [loader, key], { equal: is.equ })
1980
- );
1981
- return Array.isArray(input) ? results : results[0];
1489
+ return useMemo(() => {
1490
+ const w = width ?? size.width;
1491
+ const h = height ?? size.height;
1492
+ return new WebGLRenderTarget(w, h, opts);
1493
+ }, [width, height, size.width, size.height, opts, isLegacy]);
1982
1494
  }
1983
- useLoader.preload = function(loader, input, extensions, onProgress, cacheKey) {
1984
- const inputs = Array.isArray(input) ? input : [input];
1985
- const cacheKeys = Array.isArray(cacheKey ?? input) ? cacheKey ?? input : [cacheKey ?? input];
1986
- cacheKeys.forEach(
1987
- (key, index) => preload(() => loadingFn(extensions, onProgress)(loader, inputs[index]), [loader, key])
1988
- );
1989
- };
1990
- useLoader.clear = function(loader, input, cacheKey) {
1991
- const cacheKeys = Array.isArray(cacheKey ?? input) ? cacheKey ?? input : [cacheKey ?? input];
1992
- cacheKeys.forEach((key) => clear([loader, key]));
1495
+
1496
+ const presetsObj = {
1497
+ apartment: "lebombo_1k.hdr",
1498
+ city: "potsdamer_platz_1k.hdr",
1499
+ dawn: "kiara_1_dawn_1k.hdr",
1500
+ forest: "forest_slope_1k.hdr",
1501
+ lobby: "st_fagans_interior_1k.hdr",
1502
+ night: "dikhololo_night_1k.hdr",
1503
+ park: "rooitou_park_1k.hdr",
1504
+ studio: "studio_small_03_1k.hdr",
1505
+ sunset: "venice_sunset_1k.hdr",
1506
+ warehouse: "empty_warehouse_01_1k.hdr"
1993
1507
  };
1994
- useLoader.loader = getLoader;
1995
1508
 
1996
- function useFrame(callback, priorityOrOptions) {
1997
- const store = React.useContext(context);
1998
- const isInsideCanvas = store !== null;
1999
- const scheduler = getScheduler();
2000
- const optionsKey = typeof priorityOrOptions === "number" ? `p:${priorityOrOptions}` : priorityOrOptions ? JSON.stringify({
2001
- id: priorityOrOptions.id,
2002
- phase: priorityOrOptions.phase,
2003
- priority: priorityOrOptions.priority,
2004
- fps: priorityOrOptions.fps,
2005
- drop: priorityOrOptions.drop,
2006
- enabled: priorityOrOptions.enabled,
2007
- before: priorityOrOptions.before,
2008
- after: priorityOrOptions.after
2009
- }) : "";
2010
- const options = React.useMemo(() => {
2011
- return typeof priorityOrOptions === "number" ? { priority: priorityOrOptions } : priorityOrOptions ?? {};
2012
- }, [optionsKey]);
2013
- const reactId = React.useId();
2014
- const id = options.id ?? reactId;
2015
- const callbackRef = useMutableCallback(callback);
2016
- const isLegacyPriority = typeof priorityOrOptions === "number" && priorityOrOptions > 0;
2017
- useIsomorphicLayoutEffect(() => {
2018
- if (!callback) return;
2019
- if (isInsideCanvas) {
2020
- const state = store.getState();
2021
- const rootId = state.internal.rootId;
2022
- if (isLegacyPriority) {
2023
- state.internal.priority++;
2024
- let parentRoot = state.previousRoot;
2025
- while (parentRoot) {
2026
- const parentState = parentRoot.getState();
2027
- if (parentState?.internal) parentState.internal.priority++;
2028
- parentRoot = parentState?.previousRoot;
2029
- }
2030
- notifyDepreciated({
2031
- heading: "useFrame with numeric priority is deprecated",
2032
- body: 'Using useFrame(callback, number) to control render order is deprecated.\n\nFor custom rendering, use: useFrame(callback, { phase: "render" })\nFor execution order within update phase, use: useFrame(callback, { priority: number })',
2033
- link: "https://docs.pmnd.rs/react-three-fiber/api/hooks#useframe"
2034
- });
1509
+ const CUBEMAP_ROOT = "https://raw.githack.com/pmndrs/drei-assets/456060a26bbeb8fdf79326f224b6d99b8bcce736/hdri/";
1510
+ const isArray = (arr) => Array.isArray(arr);
1511
+ const defaultFiles = ["/px.png", "/nx.png", "/py.png", "/ny.png", "/pz.png", "/nz.png"];
1512
+ function useEnvironment({
1513
+ files = defaultFiles,
1514
+ path = "",
1515
+ preset = void 0,
1516
+ colorSpace = void 0,
1517
+ extensions
1518
+ } = {}) {
1519
+ if (preset) {
1520
+ validatePreset(preset);
1521
+ files = presetsObj[preset];
1522
+ path = CUBEMAP_ROOT;
1523
+ }
1524
+ const multiFile = isArray(files);
1525
+ const { extension, isCubemap } = getExtension(files);
1526
+ const loader = getLoader(extension);
1527
+ if (!loader) throw new Error("useEnvironment: Unrecognized file extension: " + files);
1528
+ const renderer = useThree((state) => state.renderer);
1529
+ useLayoutEffect(() => {
1530
+ if (extension !== "webp" && extension !== "jpg" && extension !== "jpeg") return;
1531
+ function clearGainmapTexture() {
1532
+ useLoader.clear(loader, multiFile ? [files] : files);
1533
+ }
1534
+ renderer.domElement.addEventListener("webglcontextlost", clearGainmapTexture, { once: true });
1535
+ }, [extension, files, loader, multiFile, renderer.domElement]);
1536
+ const loaderResult = useLoader(
1537
+ loader,
1538
+ multiFile ? [files] : files,
1539
+ (loader2) => {
1540
+ if (extension === "webp" || extension === "jpg" || extension === "jpeg") {
1541
+ loader2.setRenderer?.(renderer);
2035
1542
  }
2036
- const wrappedCallback = (frameState, delta) => {
2037
- const localState = store.getState();
2038
- const mergedState = {
2039
- ...localState,
2040
- time: frameState.time,
2041
- delta: frameState.delta,
2042
- elapsed: frameState.elapsed,
2043
- frame: frameState.frame
2044
- };
2045
- callbackRef.current?.(mergedState, delta);
2046
- };
2047
- const unregister = scheduler.register(wrappedCallback, {
2048
- id,
2049
- rootId,
2050
- ...options
2051
- });
2052
- return () => {
2053
- unregister();
2054
- if (isLegacyPriority) {
2055
- const currentState = store.getState();
2056
- if (currentState.internal) {
2057
- currentState.internal.priority--;
2058
- let parentRoot = currentState.previousRoot;
2059
- while (parentRoot) {
2060
- const parentState = parentRoot.getState();
2061
- if (parentState?.internal) parentState.internal.priority--;
2062
- parentRoot = parentState?.previousRoot;
2063
- }
2064
- }
2065
- }
2066
- };
2067
- } else {
2068
- return scheduler.register(
2069
- (state, delta) => {
2070
- const frameState = state;
2071
- if (!frameState.renderer) return;
2072
- callbackRef.current?.(frameState, delta);
2073
- },
2074
- { id, ...options }
2075
- );
1543
+ loader2.setPath?.(path);
1544
+ if (extensions) extensions(loader2);
2076
1545
  }
2077
- }, [store, scheduler, id, optionsKey, isLegacyPriority, isInsideCanvas]);
2078
- const isPaused = React.useSyncExternalStore(
2079
- // Subscribe function
2080
- React.useCallback(
2081
- (onStoreChange) => {
2082
- return getScheduler().subscribeJobState(id, onStoreChange);
2083
- },
2084
- [id]
2085
- ),
2086
- // getSnapshot function
2087
- React.useCallback(() => getScheduler().isJobPaused(id), [id]),
2088
- // getServerSnapshot function (SSR)
2089
- React.useCallback(() => false, [])
2090
1546
  );
2091
- const controls = React.useMemo(() => {
2092
- const scheduler2 = getScheduler();
2093
- return {
2094
- /** The job's unique ID */
2095
- id,
2096
- /**
2097
- * Access to the global scheduler for frame loop control.
2098
- * Use for controlling the entire frame loop, adding phases, etc.
2099
- */
2100
- scheduler: scheduler2,
2101
- /**
2102
- * Manually step this job only.
2103
- * Bypasses FPS limiting - always runs.
2104
- * @param timestamp Optional timestamp (defaults to performance.now())
2105
- */
2106
- step: (timestamp) => {
2107
- getScheduler().stepJob(id, timestamp);
2108
- },
2109
- /**
2110
- * Manually step ALL jobs in the scheduler.
2111
- * Useful for frameloop='never' mode.
2112
- * @param timestamp Optional timestamp (defaults to performance.now())
2113
- */
2114
- stepAll: (timestamp) => {
2115
- getScheduler().step(timestamp);
2116
- },
2117
- /**
2118
- * Pause this job (set enabled=false).
2119
- * Job remains registered but won't run.
2120
- */
2121
- pause: () => {
2122
- getScheduler().pauseJob(id);
2123
- },
2124
- /**
2125
- * Resume this job (set enabled=true).
2126
- */
2127
- resume: () => {
2128
- getScheduler().resumeJob(id);
2129
- },
2130
- /**
2131
- * Reactive paused state - automatically updates when pause/resume is called.
2132
- * No need for forceUpdate() in your components.
2133
- */
2134
- isPaused
2135
- };
2136
- }, [id, isPaused]);
2137
- return controls;
1547
+ let texture = multiFile ? (
1548
+ // @ts-ignore
1549
+ loaderResult[0]
1550
+ ) : loaderResult;
1551
+ if (extension === "jpg" || extension === "jpeg" || extension === "webp") {
1552
+ texture = texture.renderTarget?.texture;
1553
+ }
1554
+ texture.mapping = isCubemap ? CubeReflectionMapping : EquirectangularReflectionMapping;
1555
+ texture.colorSpace = colorSpace ?? (isCubemap ? "srgb" : "srgb-linear");
1556
+ return texture;
1557
+ }
1558
+ const preloadDefaultOptions = {
1559
+ files: defaultFiles,
1560
+ path: "",
1561
+ preset: void 0,
1562
+ extensions: void 0
1563
+ };
1564
+ useEnvironment.preload = (preloadOptions) => {
1565
+ const options = { ...preloadDefaultOptions, ...preloadOptions };
1566
+ let { files, path = "" } = options;
1567
+ const { preset, extensions } = options;
1568
+ if (preset) {
1569
+ validatePreset(preset);
1570
+ files = presetsObj[preset];
1571
+ path = CUBEMAP_ROOT;
1572
+ }
1573
+ const { extension } = getExtension(files);
1574
+ if (extension === "webp" || extension === "jpg" || extension === "jpeg") {
1575
+ throw new Error("useEnvironment: Preloading gainmaps is not supported");
1576
+ }
1577
+ const loader = getLoader(extension);
1578
+ if (!loader) throw new Error("useEnvironment: Unrecognized file extension: " + files);
1579
+ useLoader.preload(loader, isArray(files) ? [files] : files, (loader2) => {
1580
+ loader2.setPath?.(path);
1581
+ if (extensions) extensions(loader2);
1582
+ });
1583
+ };
1584
+ const clearDefaultOptins = {
1585
+ files: defaultFiles,
1586
+ preset: void 0
1587
+ };
1588
+ useEnvironment.clear = (clearOptions) => {
1589
+ const options = { ...clearDefaultOptins, ...clearOptions };
1590
+ let { files } = options;
1591
+ const { preset } = options;
1592
+ if (preset) {
1593
+ validatePreset(preset);
1594
+ files = presetsObj[preset];
1595
+ }
1596
+ const { extension } = getExtension(files);
1597
+ const loader = getLoader(extension);
1598
+ if (!loader) throw new Error("useEnvironment: Unrecognized file extension: " + files);
1599
+ useLoader.clear(loader, isArray(files) ? [files] : files);
1600
+ };
1601
+ function validatePreset(preset) {
1602
+ if (!(preset in presetsObj)) throw new Error("Preset must be one of: " + Object.keys(presetsObj).join(", "));
1603
+ }
1604
+ function getExtension(files) {
1605
+ const isCubemap = isArray(files) && files.length === 6;
1606
+ const isGainmap = isArray(files) && files.length === 3 && files.some((file) => file.endsWith("json"));
1607
+ const firstEntry = isArray(files) ? files[0] : files;
1608
+ const extension = isCubemap ? "cube" : isGainmap ? "webp" : firstEntry.startsWith("data:application/exr") ? "exr" : firstEntry.startsWith("data:application/hdr") ? "hdr" : firstEntry.startsWith("data:image/jpeg") ? "jpg" : firstEntry.split(".").pop()?.split("?")?.shift()?.toLowerCase();
1609
+ return { extension, isCubemap, isGainmap };
1610
+ }
1611
+ function getLoader(extension) {
1612
+ const loader = extension === "cube" ? CubeTextureLoader : extension === "hdr" ? HDRLoader : extension === "exr" ? EXRLoader : extension === "jpg" || extension === "jpeg" ? UltraHDRLoader : extension === "webp" ? GainMapLoader : null;
1613
+ return loader;
2138
1614
  }
2139
1615
 
2140
- const IsObject = (url) => url === Object(url) && !Array.isArray(url) && typeof url !== "function";
2141
- function getUrls(input) {
2142
- if (typeof input === "string") return [input];
2143
- if (Array.isArray(input)) return input;
2144
- return Object.values(input);
1616
+ function useStore() {
1617
+ const store = useContext(context);
1618
+ if (!store) throw new Error("R3F: Hooks can only be used within the Canvas component!");
1619
+ return store;
2145
1620
  }
2146
- function allUrlsCached(urls, textureCache) {
2147
- return urls.every((url) => textureCache.has(url));
1621
+ function useThree(selector = (state) => state, equalityFn) {
1622
+ return useStore()(selector, equalityFn);
2148
1623
  }
2149
- function buildFromCache(input, textureCache) {
2150
- if (typeof input === "string") {
2151
- return textureCache.get(input);
2152
- } else if (Array.isArray(input)) {
2153
- return input.map((url) => textureCache.get(url));
2154
- } else {
2155
- const result = {};
2156
- const objInput = input;
2157
- for (const key in objInput) {
2158
- result[key] = textureCache.get(objInput[key]);
2159
- }
2160
- return result;
2161
- }
2162
- }
2163
- function useTexture(input, optionsOrOnLoad) {
2164
- const renderer = useThree((state) => state.internal.actualRenderer);
2165
- const store = useStore();
2166
- const options = typeof optionsOrOnLoad === "function" ? { onLoad: optionsOrOnLoad } : optionsOrOnLoad ?? {};
2167
- const { onLoad, cache = true } = options;
2168
- const onLoadRef = useRef(onLoad);
2169
- onLoadRef.current = onLoad;
2170
- const onLoadCalledForRef = useRef(null);
2171
- const urls = useMemo(() => getUrls(input), [input]);
2172
- const cachedResult = useMemo(() => {
2173
- if (!cache) return null;
2174
- const textures = store.getState().textures;
2175
- if (!allUrlsCached(urls, textures)) return null;
2176
- return buildFromCache(input, textures);
2177
- }, [cache, urls, input, store]);
2178
- const loadedTextures = useLoader(
2179
- TextureLoader,
2180
- IsObject(input) ? Object.values(input) : input
2181
- );
2182
- const inputKey = urls.join("\0");
2183
- useLayoutEffect(() => {
2184
- if (cachedResult) return;
2185
- if (onLoadCalledForRef.current === inputKey) return;
2186
- onLoadCalledForRef.current = inputKey;
2187
- onLoadRef.current?.(loadedTextures);
2188
- }, [cachedResult, loadedTextures, inputKey]);
2189
- useEffect(() => {
2190
- if (cachedResult) return;
2191
- if ("initTexture" in renderer) {
2192
- let textureArray = [];
2193
- if (Array.isArray(loadedTextures)) {
2194
- textureArray = loadedTextures;
2195
- } else if (loadedTextures instanceof Texture$1) {
2196
- textureArray = [loadedTextures];
2197
- } else if (IsObject(loadedTextures)) {
2198
- textureArray = Object.values(loadedTextures);
2199
- }
2200
- textureArray.forEach((texture) => {
2201
- if (texture instanceof Texture$1) {
2202
- renderer.initTexture(texture);
2203
- }
2204
- });
2205
- }
2206
- }, [renderer, loadedTextures, cachedResult]);
2207
- const mappedTextures = useMemo(() => {
2208
- if (cachedResult) return cachedResult;
2209
- if (IsObject(input)) {
2210
- const keyed = {};
2211
- const textureArray = loadedTextures;
2212
- let i = 0;
2213
- for (const key in input) keyed[key] = textureArray[i++];
2214
- return keyed;
2215
- } else {
2216
- return loadedTextures;
2217
- }
2218
- }, [input, loadedTextures, cachedResult]);
2219
- useEffect(() => {
2220
- if (!cache) return;
2221
- const urlTextureMap = [];
2222
- if (typeof input === "string") {
2223
- urlTextureMap.push([input, mappedTextures]);
2224
- } else if (Array.isArray(input)) {
2225
- const textureArray = mappedTextures;
2226
- input.forEach((url, i) => urlTextureMap.push([url, textureArray[i]]));
2227
- } else if (IsObject(input)) {
2228
- const textureRecord = mappedTextures;
2229
- for (const key in input) {
2230
- const url = input[key];
2231
- urlTextureMap.push([url, textureRecord[key]]);
2232
- }
2233
- }
2234
- store.setState((state) => {
2235
- const refs = new Map(state._textureRefs);
2236
- let textures = state.textures;
2237
- let added = false;
2238
- for (const [url, texture] of urlTextureMap) {
2239
- if (!textures.has(url)) {
2240
- if (!added) {
2241
- textures = new Map(textures);
2242
- added = true;
2243
- }
2244
- textures.set(url, texture);
2245
- }
2246
- refs.set(url, (refs.get(url) ?? 0) + 1);
2247
- }
2248
- return added ? { textures, _textureRefs: refs } : { _textureRefs: refs };
2249
- });
2250
- return () => store.setState((state) => {
2251
- const refs = new Map(state._textureRefs);
2252
- for (const [url] of urlTextureMap) {
2253
- const next = (refs.get(url) ?? 0) - 1;
2254
- if (next <= 0) refs.delete(url);
2255
- else refs.set(url, next);
2256
- }
2257
- return { _textureRefs: refs };
2258
- });
2259
- }, [cache, input, mappedTextures, store]);
2260
- return mappedTextures;
2261
- }
2262
- useTexture.preload = (url) => useLoader.preload(TextureLoader, url);
2263
- useTexture.clear = (input) => useLoader.clear(TextureLoader, input);
2264
- const Texture = ({
2265
- children,
2266
- input,
2267
- onLoad,
2268
- cache
2269
- }) => {
2270
- const options = typeof onLoad === "function" ? { onLoad, cache } : { ...onLoad, cache };
2271
- const ret = useTexture(input, options);
2272
- return /* @__PURE__ */ jsx(Fragment, { children: children?.(ret) });
2273
- };
2274
-
2275
- function useTextures(selector) {
2276
- const store = useStore();
2277
- const registry = useMemo(() => {
2278
- const getState = store.getState;
2279
- const setState = store.setState;
2280
- const getOne = (key) => getState().textures.get(key);
2281
- return {
2282
- get all() {
2283
- return getState().textures;
2284
- },
2285
- get(input) {
2286
- if (typeof input === "string") return getOne(input);
2287
- if (Array.isArray(input)) return input.map(getOne);
2288
- const out = {};
2289
- for (const name in input) out[name] = getOne(input[name]);
2290
- return out;
2291
- },
2292
- has: (key) => getState().textures.has(key),
2293
- add(keyOrRecord, texture) {
2294
- setState((state) => {
2295
- const textures = new Map(state.textures);
2296
- if (typeof keyOrRecord === "string") {
2297
- textures.set(keyOrRecord, texture);
2298
- } else {
2299
- for (const key in keyOrRecord) textures.set(key, keyOrRecord[key]);
2300
- }
2301
- return { textures };
2302
- });
2303
- },
2304
- dispose(key, options) {
2305
- const state = getState();
2306
- const refs = state._textureRefs.get(key) ?? 0;
2307
- if (refs > 0 && !options?.force) {
2308
- console.warn(
2309
- `[useTextures] "${key}" still has ${refs} active reference(s); skipping dispose. Pass { force: true } to override.`
2310
- );
2311
- return false;
2312
- }
2313
- state.textures.get(key)?.dispose();
2314
- setState((s) => {
2315
- const textures = new Map(s.textures);
2316
- textures.delete(key);
2317
- const nextRefs = new Map(s._textureRefs);
2318
- nextRefs.delete(key);
2319
- return { textures, _textureRefs: nextRefs };
2320
- });
2321
- return true;
2322
- },
2323
- disposeAll() {
2324
- for (const texture of getState().textures.values()) texture.dispose();
2325
- setState({ textures: /* @__PURE__ */ new Map(), _textureRefs: /* @__PURE__ */ new Map() });
2326
- }
2327
- };
2328
- }, [store]);
2329
- const subscribe = selector ? () => selector(registry) : (state) => state.textures;
2330
- const selected = useThree(subscribe);
2331
- return selector ? selected : registry;
2332
- }
2333
-
2334
- function useRenderTarget(widthOrOptions, heightOrOptions, options) {
2335
- const isLegacy = useThree((s) => s.isLegacy);
2336
- const size = useThree((s) => s.size);
2337
- let width;
2338
- let height;
2339
- let opts;
2340
- if (typeof widthOrOptions === "object") {
2341
- opts = widthOrOptions;
2342
- } else if (typeof widthOrOptions === "number") {
2343
- width = widthOrOptions;
2344
- if (typeof heightOrOptions === "object") {
2345
- height = widthOrOptions;
2346
- opts = heightOrOptions;
2347
- } else if (typeof heightOrOptions === "number") {
2348
- height = heightOrOptions;
2349
- opts = options;
2350
- } else {
2351
- height = widthOrOptions;
2352
- }
2353
- }
2354
- return useMemo(() => {
2355
- const w = width ?? size.width;
2356
- const h = height ?? size.height;
2357
- return new WebGLRenderTarget(w, h, opts);
2358
- }, [width, height, size.width, size.height, opts, isLegacy]);
2359
- }
2360
-
2361
- function useStore() {
2362
- const store = useContext(context);
2363
- if (!store) throw new Error("R3F: Hooks can only be used within the Canvas component!");
2364
- return store;
2365
- }
2366
- function useThree(selector = (state) => state, equalityFn) {
2367
- return useStore()(selector, equalityFn);
2368
- }
2369
- function useInstanceHandle(ref) {
2370
- const instance = useRef(null);
2371
- useImperativeHandle(instance, () => ref.current.__r3f, [ref]);
2372
- return instance;
1624
+ function useInstanceHandle(ref) {
1625
+ const instance = useRef(null);
1626
+ useImperativeHandle(instance, () => ref.current.__r3f, [ref]);
1627
+ return instance;
2373
1628
  }
2374
1629
  function useGraph(object) {
2375
1630
  return useMemo(() => buildGraph(object), [object]);
2376
1631
  }
2377
1632
 
1633
+ const t = 1, o = 8, r = 32, e = 2, i$1 = 268435456;
1634
+
2378
1635
  let effectId = 0;
2379
1636
  function addEffect(callback) {
2380
1637
  notifyDepreciated({
@@ -2409,7 +1666,7 @@ function advance(timestamp) {
2409
1666
  getScheduler().step(timestamp);
2410
1667
  }
2411
1668
 
2412
- const version = "10.0.0-alpha.2";
1669
+ const version = "10.0.0-alpha.3";
2413
1670
  const packageData = {
2414
1671
  version: version};
2415
1672
 
@@ -13466,206 +12723,789 @@ Check the top-level render call using <` + i + ">.");
13466
12723
  var o = 1 << 31 - vn(n);
13467
12724
  e.entanglements[1] |= o, n &= ~o;
13468
12725
  }
13469
- Kn(e), (ye & (Zn | uo)) === Jn && (Pp = me() + Fg, Wa(0));
12726
+ Kn(e), (ye & (Zn | uo)) === Jn && (Pp = me() + Fg, Wa(0));
12727
+ }
12728
+ }
12729
+ break;
12730
+ case 31:
12731
+ case 13:
12732
+ n = On(e, 2), n !== null && We(n, e, 2), Ls(), rl(e, 2);
12733
+ }
12734
+ }, le.batchedUpdates = function(e, n) {
12735
+ return e(n);
12736
+ }, le.createComponentSelector = function(e) {
12737
+ return { $$typeof: pm, value: e };
12738
+ }, le.createContainer = function(e, n, o, i, s, u, f, p, g, S) {
12739
+ return Ka(e, n, false, null, o, i, u, null, f, p, g, S);
12740
+ }, le.createHasPseudoClassSelector = function(e) {
12741
+ return { $$typeof: hm, value: e };
12742
+ }, le.createHydrationContainer = function(e, n, o, i, s, u, f, p, g, S, T, _, I, O) {
12743
+ return e = Ka(o, i, true, e, s, u, p, O, g, S, T, _), e.context = Dh(null), o = e.current, i = Nt(o), i = Xo(i), s = zo(i), s.callback = n ?? null, Mt(o, s, i), ur(i, "hydrateRoot()", null), n = i, e.current.lanes = n, Ci(e, n), Kn(e), e;
12744
+ }, le.createPortal = function(e, n, o) {
12745
+ var i = 3 < arguments.length && arguments[3] !== void 0 ? arguments[3] : null;
12746
+ try {
12747
+ vt(i);
12748
+ var s = false;
12749
+ } catch {
12750
+ s = true;
12751
+ }
12752
+ return s && (console.error("The provided key is an unsupported type %s. This value must be coerced to a string before using it here.", typeof Symbol == "function" && Symbol.toStringTag && i[Symbol.toStringTag] || i.constructor.name || "Object"), vt(i)), { $$typeof: Ao, key: i == null ? null : "" + i, children: e, containerInfo: n, implementation: o };
12753
+ }, le.createRoleSelector = function(e) {
12754
+ return { $$typeof: mm, value: e };
12755
+ }, le.createTestNameSelector = function(e) {
12756
+ return { $$typeof: gm, value: e };
12757
+ }, le.createTextSelector = function(e) {
12758
+ return { $$typeof: ym, value: e };
12759
+ }, le.defaultOnCaughtError = function(e) {
12760
+ var n = bd ? "The above error occurred in the <" + bd + "> component." : "The above error occurred in one of your React components.", o = "React will try to recreate this component tree from scratch using the error boundary you provided, " + ((Cg || "Anonymous") + ".");
12761
+ typeof e == "object" && e !== null && typeof e.environmentName == "string" ? ri("error", [`%o
12762
+
12763
+ %s
12764
+
12765
+ %s
12766
+ `, e, n, o], e.environmentName)() : console.error(`%o
12767
+
12768
+ %s
12769
+
12770
+ %s
12771
+ `, e, n, o);
12772
+ }, le.defaultOnRecoverableError = function(e) {
12773
+ qg(e);
12774
+ }, le.defaultOnUncaughtError = function(e) {
12775
+ qg(e), console.warn(`%s
12776
+
12777
+ %s
12778
+ `, bd ? "An error occurred in the <" + bd + "> component." : "An error occurred in one of your React components.", `Consider adding an error boundary to your tree to customize error handling behavior.
12779
+ Visit https://react.dev/link/error-boundaries to learn more about error boundaries.`);
12780
+ }, le.deferredUpdates = function(e) {
12781
+ var n = x.T, o = wt();
12782
+ try {
12783
+ return an(32), x.T = null, e();
12784
+ } finally {
12785
+ an(o), x.T = n;
12786
+ }
12787
+ }, le.discreteUpdates = function(e, n, o, i, s) {
12788
+ var u = x.T, f = wt();
12789
+ try {
12790
+ return an(2), x.T = null, e(n, o, i, s);
12791
+ } finally {
12792
+ an(f), x.T = u, ye === Jn && (Pp = me() + Fg);
12793
+ }
12794
+ }, le.findAllNodes = kc, le.findBoundingRects = function(e, n) {
12795
+ if (!xr) throw Error("Test selector API is not supported by this renderer.");
12796
+ n = kc(e, n), e = [];
12797
+ for (var o = 0; o < n.length; o++) e.push(ma(n[o]));
12798
+ for (n = e.length - 1; 0 < n; n--) {
12799
+ o = e[n];
12800
+ for (var i = o.x, s = i + o.width, u = o.y, f = u + o.height, p = n - 1; 0 <= p; p--) if (n !== p) {
12801
+ var g = e[p], S = g.x, T = S + g.width, _ = g.y, I = _ + g.height;
12802
+ if (i >= S && u >= _ && s <= T && f <= I) {
12803
+ e.splice(n, 1);
12804
+ break;
12805
+ } else if (i !== S || o.width !== g.width || I < u || _ > f) {
12806
+ if (!(u !== _ || o.height !== g.height || T < i || S > s)) {
12807
+ S > i && (g.width += S - i, g.x = i), T < s && (g.width = s - S), e.splice(n, 1);
12808
+ break;
12809
+ }
12810
+ } else {
12811
+ _ > u && (g.height += _ - u, g.y = u), I < f && (g.height = f - _), e.splice(n, 1);
12812
+ break;
12813
+ }
12814
+ }
12815
+ }
12816
+ return e;
12817
+ }, le.findHostInstance = function(e) {
12818
+ var n = e._reactInternals;
12819
+ if (n === void 0) throw typeof e.render == "function" ? Error("Unable to find node on an unmounted component.") : (e = Object.keys(e).join(","), Error("Argument appears to not be a ReactComponent. Keys: " + e));
12820
+ return e = mu(n), e === null ? null : ot(e.stateNode);
12821
+ }, le.findHostInstanceWithNoPortals = function(e) {
12822
+ return e = Ed(e), e = e !== null ? _p(e) : null, e === null ? null : ot(e.stateNode);
12823
+ }, le.findHostInstanceWithWarning = function(e, n) {
12824
+ var o = e._reactInternals;
12825
+ if (o === void 0) throw typeof e.render == "function" ? Error("Unable to find node on an unmounted component.") : (e = Object.keys(e).join(","), Error("Argument appears to not be a ReactComponent. Keys: " + e));
12826
+ if (e = mu(o), e === null) return null;
12827
+ if (e.mode & 8) {
12828
+ var i = G(o) || "Component";
12829
+ mb[i] || (mb[i] = true, B(e, function() {
12830
+ o.mode & 8 ? console.error("%s is deprecated in StrictMode. %s was passed an instance of %s which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://react.dev/link/strict-mode-find-node", n, n, i) : console.error("%s is deprecated in StrictMode. %s was passed an instance of %s which renders StrictMode children. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://react.dev/link/strict-mode-find-node", n, n, i);
12831
+ }));
12832
+ }
12833
+ return ot(e.stateNode);
12834
+ }, le.flushPassiveEffects = el, le.flushSyncFromReconciler = function(e) {
12835
+ var n = ye;
12836
+ ye |= 1;
12837
+ var o = x.T, i = wt();
12838
+ try {
12839
+ if (an(2), x.T = null, e) return e();
12840
+ } finally {
12841
+ an(i), x.T = o, ye = n, (ye & (Zn | uo)) === Jn && Wa(0);
12842
+ }
12843
+ }, le.flushSyncWork = Ls, le.focusWithin = function(e, n) {
12844
+ if (!xr) throw Error("Test selector API is not supported by this renderer.");
12845
+ for (e = Ef(e), n = hh(e, n), n = Array.from(n), e = 0; e < n.length; ) {
12846
+ var o = n[e++], i = o.tag;
12847
+ if (!Kr(o)) {
12848
+ if ((i === 5 || i === 26 || i === 27) && Ft(o.stateNode)) return true;
12849
+ for (o = o.child; o !== null; ) n.push(o), o = o.sibling;
12850
+ }
12851
+ }
12852
+ return false;
12853
+ }, le.getFindAllNodesFailureDescription = function(e, n) {
12854
+ if (!xr) throw Error("Test selector API is not supported by this renderer.");
12855
+ var o = 0, i = [];
12856
+ e = [Ef(e), 0];
12857
+ for (var s = 0; s < e.length; ) {
12858
+ var u = e[s++], f = u.tag, p = e[s++], g = n[p];
12859
+ if ((f !== 5 && f !== 26 && f !== 27 || !Kr(u)) && (If(u, g) && (i.push(Sc(g)), p++, p > o && (o = p)), p < n.length)) for (u = u.child; u !== null; ) e.push(u, p), u = u.sibling;
12860
+ }
12861
+ if (o < n.length) {
12862
+ for (e = []; o < n.length; o++) e.push(Sc(n[o]));
12863
+ return `findAllNodes was able to match part of the selector:
12864
+ ` + (i.join(" > ") + `
12865
+
12866
+ No matching component was found for:
12867
+ `) + e.join(" > ");
12868
+ }
12869
+ return null;
12870
+ }, le.getPublicRootInstance = function(e) {
12871
+ if (e = e.current, !e.child) return null;
12872
+ switch (e.child.tag) {
12873
+ case 27:
12874
+ case 5:
12875
+ return ot(e.child.stateNode);
12876
+ default:
12877
+ return e.child.stateNode;
12878
+ }
12879
+ }, le.injectIntoDevTools = function() {
12880
+ var e = { bundleType: 1, version: Jt, rendererPackageName: Zt, currentDispatcherRef: x, reconcilerVersion: "19.2.0" };
12881
+ return jo !== null && (e.rendererConfig = jo), e.overrideHookState = gb, e.overrideHookStateDeletePath = yb, e.overrideHookStateRenamePath = bb, e.overrideProps = vb, e.overridePropsDeletePath = Sb, e.overridePropsRenamePath = kb, e.scheduleUpdate = wb, e.scheduleRetry = Pb, e.setErrorHandler = xb, e.setSuspenseHandler = zb, e.scheduleRefresh = hu, e.scheduleRoot = Fl, e.setRefreshHandler = Ir, e.getCurrentFiber = Ic, Ep(e);
12882
+ }, le.isAlreadyRendering = Ns, le.observeVisibleRects = function(e, n, o, i) {
12883
+ function s() {
12884
+ var S = kc(e, n);
12885
+ u.forEach(function(T) {
12886
+ 0 > S.indexOf(T) && g(T);
12887
+ }), S.forEach(function(T) {
12888
+ 0 > u.indexOf(T) && p(T);
12889
+ });
12890
+ }
12891
+ if (!xr) throw Error("Test selector API is not supported by this renderer.");
12892
+ var u = kc(e, n);
12893
+ o = zr(u, o, i);
12894
+ var f = o.disconnect, p = o.observe, g = o.unobserve;
12895
+ return bm.push(s), { disconnect: function() {
12896
+ var S = bm.indexOf(s);
12897
+ 0 <= S && bm.splice(S, 1), f();
12898
+ } };
12899
+ }, le.shouldError = function(e) {
12900
+ return pu(e);
12901
+ }, le.shouldSuspend = function(e) {
12902
+ return fu(e);
12903
+ }, le.startHostTransition = function(e, n, o, i) {
12904
+ if (e.tag !== 5) throw Error("Expected the form instance to be a HostComponent. This is a bug in React.");
12905
+ var s = uf(e).queue;
12906
+ Hp(e), nt(e, s, n, Xt, o === null ? Em : function() {
12907
+ x.T === null && console.error("requestFormReset was called outside a transition or action. To fix, move to an action, or wrap with startTransition.");
12908
+ var u = uf(e);
12909
+ return u.next === null && (u = e.alternate.memoizedState), qi(e, u.next.queue, {}, Nt(e)), o(i);
12910
+ });
12911
+ }, le.updateContainer = function(e, n, o, i) {
12912
+ var s = n.current, u = Nt(s);
12913
+ return As(s, u, e, n, o, i), u;
12914
+ }, le.updateContainerSync = Wh, le;
12915
+ }, Tt.exports.default = Tt.exports, Object.defineProperty(Tt.exports, "__esModule", { value: true }));
12916
+ })(Mg)), Mg.exports;
12917
+ }
12918
+ var Eb;
12919
+ function n0() {
12920
+ return Eb || (Eb = 1, process.env.NODE_ENV === "production" ? Rm.exports = Kb() : Rm.exports = e0()), Rm.exports;
12921
+ }
12922
+ var t0 = n0();
12923
+ const r0 = Xb(t0);
12924
+
12925
+ const DEFAULT_POINTER_ID = 0;
12926
+ const XR_POINTER_ID_START = 1e3;
12927
+ function getPointerState(internal, pointerId) {
12928
+ let state = internal.pointerMap.get(pointerId);
12929
+ if (!state) {
12930
+ state = {
12931
+ hovered: /* @__PURE__ */ new Map(),
12932
+ captured: /* @__PURE__ */ new Map(),
12933
+ initialClick: [0, 0],
12934
+ initialHits: []
12935
+ };
12936
+ internal.pointerMap.set(pointerId, state);
12937
+ }
12938
+ return state;
12939
+ }
12940
+ function getPointerId(event) {
12941
+ return "pointerId" in event ? event.pointerId : DEFAULT_POINTER_ID;
12942
+ }
12943
+ function makeId(event) {
12944
+ return (event.eventObject || event.object).uuid + "/" + event.index + event.instanceId;
12945
+ }
12946
+ function releaseInternalPointerCapture(internal, obj, pointerId) {
12947
+ const pointerState = internal.pointerMap.get(pointerId);
12948
+ if (!pointerState) return;
12949
+ const captureData = pointerState.captured.get(obj);
12950
+ if (captureData) {
12951
+ pointerState.captured.delete(obj);
12952
+ try {
12953
+ captureData.target.releasePointerCapture?.(pointerId);
12954
+ } catch {
12955
+ }
12956
+ }
12957
+ }
12958
+ function swapInteractivity(store, object, newObject) {
12959
+ const { internal } = store.getState();
12960
+ for (let i = 0; i < internal.interaction.length; i++) {
12961
+ if (internal.interaction[i] === object) internal.interaction[i] = newObject;
12962
+ }
12963
+ for (const pointerState of internal.pointerMap.values()) {
12964
+ for (let i = 0; i < pointerState.initialHits.length; i++) {
12965
+ if (pointerState.initialHits[i] === object) pointerState.initialHits[i] = newObject;
12966
+ }
12967
+ pointerState.hovered.forEach((value, key) => {
12968
+ if (value.eventObject === object || value.object === object) {
12969
+ pointerState.hovered.delete(key);
12970
+ const next = {
12971
+ ...value,
12972
+ eventObject: value.eventObject === object ? newObject : value.eventObject,
12973
+ object: value.object === object ? newObject : value.object
12974
+ };
12975
+ pointerState.hovered.set(makeId(next), next);
12976
+ }
12977
+ });
12978
+ const captureData = pointerState.captured.get(object);
12979
+ if (captureData) {
12980
+ pointerState.captured.delete(object);
12981
+ pointerState.captured.set(newObject, {
12982
+ ...captureData,
12983
+ intersection: {
12984
+ ...captureData.intersection,
12985
+ object: captureData.intersection.object === object ? newObject : captureData.intersection.object,
12986
+ eventObject: captureData.intersection.eventObject === object ? newObject : captureData.intersection.eventObject
12987
+ }
12988
+ });
12989
+ }
12990
+ }
12991
+ unregisterVisibility(store, object);
12992
+ }
12993
+ function removeInteractivity(store, object) {
12994
+ const { internal } = store.getState();
12995
+ internal.interaction = internal.interaction.filter((o) => o !== object);
12996
+ for (const [pointerId, pointerState] of internal.pointerMap) {
12997
+ pointerState.initialHits = pointerState.initialHits.filter((o) => o !== object);
12998
+ pointerState.hovered.forEach((value, key) => {
12999
+ if (value.eventObject === object || value.object === object) {
13000
+ pointerState.hovered.delete(key);
13001
+ }
13002
+ });
13003
+ if (pointerState.captured.has(object)) {
13004
+ releaseInternalPointerCapture(internal, object, pointerId);
13005
+ }
13006
+ }
13007
+ unregisterVisibility(store, object);
13008
+ }
13009
+ function createEvents(store) {
13010
+ function calculateDistance(event, pointerId) {
13011
+ const { internal } = store.getState();
13012
+ const pointerState = internal.pointerMap.get(pointerId);
13013
+ if (!pointerState) return 0;
13014
+ const [initialX, initialY] = pointerState.initialClick;
13015
+ const dx = event.offsetX - initialX;
13016
+ const dy = event.offsetY - initialY;
13017
+ return Math.round(Math.sqrt(dx * dx + dy * dy));
13018
+ }
13019
+ function filterPointerEvents(objects) {
13020
+ return objects.filter(
13021
+ (obj) => ["Move", "Over", "Enter", "Out", "Leave"].some(
13022
+ (name) => obj.__r3f?.handlers["onPointer" + name]
13023
+ ) || ["OverEnter", "OverLeave", "Over"].some(
13024
+ (name) => obj.__r3f?.handlers["onDrag" + name]
13025
+ ) || obj.__r3f?.handlers.onDrop
13026
+ );
13027
+ }
13028
+ function intersect(event, filter) {
13029
+ const state = store.getState();
13030
+ const duplicates = /* @__PURE__ */ new Set();
13031
+ const intersections = [];
13032
+ const eventsObjects = filter ? filter(state.internal.interaction) : state.internal.interaction;
13033
+ for (let i = 0; i < eventsObjects.length; i++) {
13034
+ const state2 = getRootState(eventsObjects[i]);
13035
+ if (state2) {
13036
+ state2.raycaster.camera = void 0;
13037
+ }
13038
+ }
13039
+ if (!state.previousRoot) {
13040
+ state.events.compute?.(event, state);
13041
+ }
13042
+ function handleRaycast(obj) {
13043
+ const state2 = getRootState(obj);
13044
+ if (!state2 || !state2.events.enabled || state2.raycaster.camera === null) return [];
13045
+ if (state2.raycaster.camera === void 0) {
13046
+ state2.events.compute?.(event, state2, state2.previousRoot?.getState());
13047
+ if (state2.raycaster.camera === void 0) state2.raycaster.camera = null;
13048
+ }
13049
+ if (!state2.raycaster.camera) return [];
13050
+ obj.updateWorldMatrix(true, true);
13051
+ return state2.raycaster.intersectObject(obj, true);
13052
+ }
13053
+ let hits = eventsObjects.flatMap(handleRaycast).sort((a, b) => {
13054
+ const aInteractivePriority = a.object.userData?.interactivePriority;
13055
+ const bInteractivePriority = b.object.userData?.interactivePriority;
13056
+ if (aInteractivePriority !== void 0 || bInteractivePriority !== void 0) {
13057
+ if (aInteractivePriority !== void 0 && bInteractivePriority === void 0) return -1;
13058
+ if (bInteractivePriority !== void 0 && aInteractivePriority === void 0) return 1;
13059
+ if (aInteractivePriority !== bInteractivePriority) {
13060
+ return (bInteractivePriority ?? 0) - (aInteractivePriority ?? 0);
13061
+ }
13062
+ }
13063
+ const aState = getRootState(a.object);
13064
+ const bState = getRootState(b.object);
13065
+ const aPriority = aState?.events?.priority ?? 1;
13066
+ const bPriority = bState?.events?.priority ?? 1;
13067
+ return bPriority - aPriority || a.distance - b.distance;
13068
+ }).filter((item) => {
13069
+ const id = makeId(item);
13070
+ if (duplicates.has(id)) return false;
13071
+ duplicates.add(id);
13072
+ return true;
13073
+ });
13074
+ if (state.events.filter) hits = state.events.filter(hits, state);
13075
+ for (const hit of hits) {
13076
+ let eventObject = hit.object;
13077
+ while (eventObject) {
13078
+ if (eventObject.__r3f?.eventCount) {
13079
+ intersections.push({ ...hit, eventObject });
13080
+ }
13081
+ eventObject = eventObject.parent;
13082
+ }
13083
+ }
13084
+ if ("pointerId" in event) {
13085
+ const pointerId = event.pointerId;
13086
+ const pointerState = state.internal.pointerMap.get(pointerId);
13087
+ if (pointerState?.captured.size) {
13088
+ for (const captureData of pointerState.captured.values()) {
13089
+ if (!duplicates.has(makeId(captureData.intersection))) intersections.push(captureData.intersection);
13090
+ }
13091
+ }
13092
+ }
13093
+ return intersections;
13094
+ }
13095
+ function handleIntersects(intersections, event, delta, callback) {
13096
+ if (intersections.length) {
13097
+ const localState = { stopped: false };
13098
+ for (const hit of intersections) {
13099
+ const state = getRootState(hit.object);
13100
+ if (state) {
13101
+ const { raycaster, pointer, camera, internal } = state;
13102
+ const unprojectedPoint = new Vector3(pointer.x, pointer.y, 0).unproject(camera);
13103
+ const hasPointerCapture = (id) => {
13104
+ const pointerState = internal.pointerMap.get(id);
13105
+ return pointerState?.captured.has(hit.eventObject) ?? false;
13106
+ };
13107
+ const setPointerCapture = (id) => {
13108
+ const captureData = { intersection: hit, target: event.target };
13109
+ const pointerState = getPointerState(internal, id);
13110
+ pointerState.captured.set(hit.eventObject, captureData);
13111
+ event.target.setPointerCapture(id);
13112
+ };
13113
+ const releasePointerCapture = (id) => {
13114
+ releaseInternalPointerCapture(internal, hit.eventObject, id);
13115
+ };
13116
+ const extractEventProps = {};
13117
+ for (const prop in event) {
13118
+ const property = event[prop];
13119
+ if (typeof property !== "function") extractEventProps[prop] = property;
13120
+ }
13121
+ const eventPointerId = "pointerId" in event ? event.pointerId : void 0;
13122
+ const raycastEvent = {
13123
+ ...hit,
13124
+ ...extractEventProps,
13125
+ pointer,
13126
+ intersections,
13127
+ stopped: localState.stopped,
13128
+ delta,
13129
+ unprojectedPoint,
13130
+ ray: raycaster.ray,
13131
+ camera,
13132
+ pointerId: eventPointerId,
13133
+ // Hijack stopPropagation, which just sets a flag
13134
+ stopPropagation() {
13135
+ const pointerState = eventPointerId !== void 0 ? internal.pointerMap.get(eventPointerId) : void 0;
13136
+ if (
13137
+ // ...if this pointer hasn't been captured
13138
+ !pointerState?.captured.size || // ... or if the hit object is capturing the pointer
13139
+ pointerState.captured.has(hit.eventObject)
13140
+ ) {
13141
+ raycastEvent.stopped = localState.stopped = true;
13142
+ if (pointerState?.hovered.size && Array.from(pointerState.hovered.values()).find((i) => i.eventObject === hit.eventObject)) {
13143
+ const higher = intersections.slice(0, intersections.indexOf(hit));
13144
+ cancelPointer([...higher, hit], eventPointerId);
13145
+ }
13470
13146
  }
13471
- }
13472
- break;
13473
- case 31:
13474
- case 13:
13475
- n = On(e, 2), n !== null && We(n, e, 2), Ls(), rl(e, 2);
13147
+ },
13148
+ // there should be a distinction between target and currentTarget
13149
+ target: { hasPointerCapture, setPointerCapture, releasePointerCapture },
13150
+ currentTarget: { hasPointerCapture, setPointerCapture, releasePointerCapture },
13151
+ nativeEvent: event
13152
+ };
13153
+ callback(raycastEvent);
13154
+ if (localState.stopped === true) break;
13476
13155
  }
13477
- }, le.batchedUpdates = function(e, n) {
13478
- return e(n);
13479
- }, le.createComponentSelector = function(e) {
13480
- return { $$typeof: pm, value: e };
13481
- }, le.createContainer = function(e, n, o, i, s, u, f, p, g, S) {
13482
- return Ka(e, n, false, null, o, i, u, null, f, p, g, S);
13483
- }, le.createHasPseudoClassSelector = function(e) {
13484
- return { $$typeof: hm, value: e };
13485
- }, le.createHydrationContainer = function(e, n, o, i, s, u, f, p, g, S, T, _, I, O) {
13486
- return e = Ka(o, i, true, e, s, u, p, O, g, S, T, _), e.context = Dh(null), o = e.current, i = Nt(o), i = Xo(i), s = zo(i), s.callback = n ?? null, Mt(o, s, i), ur(i, "hydrateRoot()", null), n = i, e.current.lanes = n, Ci(e, n), Kn(e), e;
13487
- }, le.createPortal = function(e, n, o) {
13488
- var i = 3 < arguments.length && arguments[3] !== void 0 ? arguments[3] : null;
13489
- try {
13490
- vt(i);
13491
- var s = false;
13492
- } catch {
13493
- s = true;
13156
+ }
13157
+ }
13158
+ return intersections;
13159
+ }
13160
+ function cancelPointer(intersections, pointerId) {
13161
+ const { internal } = store.getState();
13162
+ const pid = pointerId ?? DEFAULT_POINTER_ID;
13163
+ const pointerState = internal.pointerMap.get(pid);
13164
+ if (!pointerState) return;
13165
+ for (const [hoveredId, hoveredObj] of pointerState.hovered) {
13166
+ if (!intersections.length || !intersections.find(
13167
+ (hit) => hit.object === hoveredObj.object && hit.index === hoveredObj.index && hit.instanceId === hoveredObj.instanceId
13168
+ )) {
13169
+ const eventObject = hoveredObj.eventObject;
13170
+ const instance = eventObject.__r3f;
13171
+ pointerState.hovered.delete(hoveredId);
13172
+ if (instance?.eventCount) {
13173
+ const handlers = instance.handlers;
13174
+ const data = { ...hoveredObj, intersections };
13175
+ handlers.onPointerOut?.(data);
13176
+ handlers.onPointerLeave?.(data);
13177
+ handlers.onDragOverLeave?.(data);
13494
13178
  }
13495
- return s && (console.error("The provided key is an unsupported type %s. This value must be coerced to a string before using it here.", typeof Symbol == "function" && Symbol.toStringTag && i[Symbol.toStringTag] || i.constructor.name || "Object"), vt(i)), { $$typeof: Ao, key: i == null ? null : "" + i, children: e, containerInfo: n, implementation: o };
13496
- }, le.createRoleSelector = function(e) {
13497
- return { $$typeof: mm, value: e };
13498
- }, le.createTestNameSelector = function(e) {
13499
- return { $$typeof: gm, value: e };
13500
- }, le.createTextSelector = function(e) {
13501
- return { $$typeof: ym, value: e };
13502
- }, le.defaultOnCaughtError = function(e) {
13503
- var n = bd ? "The above error occurred in the <" + bd + "> component." : "The above error occurred in one of your React components.", o = "React will try to recreate this component tree from scratch using the error boundary you provided, " + ((Cg || "Anonymous") + ".");
13504
- typeof e == "object" && e !== null && typeof e.environmentName == "string" ? ri("error", [`%o
13505
-
13506
- %s
13507
-
13508
- %s
13509
- `, e, n, o], e.environmentName)() : console.error(`%o
13510
-
13511
- %s
13512
-
13513
- %s
13514
- `, e, n, o);
13515
- }, le.defaultOnRecoverableError = function(e) {
13516
- qg(e);
13517
- }, le.defaultOnUncaughtError = function(e) {
13518
- qg(e), console.warn(`%s
13519
-
13520
- %s
13521
- `, bd ? "An error occurred in the <" + bd + "> component." : "An error occurred in one of your React components.", `Consider adding an error boundary to your tree to customize error handling behavior.
13522
- Visit https://react.dev/link/error-boundaries to learn more about error boundaries.`);
13523
- }, le.deferredUpdates = function(e) {
13524
- var n = x.T, o = wt();
13525
- try {
13526
- return an(32), x.T = null, e();
13527
- } finally {
13528
- an(o), x.T = n;
13179
+ }
13180
+ }
13181
+ }
13182
+ function pointerMissed(event, objects) {
13183
+ for (let i = 0; i < objects.length; i++) {
13184
+ const instance = objects[i].__r3f;
13185
+ instance?.handlers.onPointerMissed?.(event);
13186
+ }
13187
+ }
13188
+ function dragOverMissed(event, objects) {
13189
+ for (let i = 0; i < objects.length; i++) {
13190
+ const instance = objects[i].__r3f;
13191
+ instance?.handlers.onDragOverMissed?.(event);
13192
+ }
13193
+ }
13194
+ function dropMissed(event, objects) {
13195
+ for (let i = 0; i < objects.length; i++) {
13196
+ const instance = objects[i].__r3f;
13197
+ instance?.handlers.onDropMissed?.(event);
13198
+ }
13199
+ }
13200
+ function cleanupPointer(pointerId) {
13201
+ const { internal } = store.getState();
13202
+ const pointerState = internal.pointerMap.get(pointerId);
13203
+ if (pointerState) {
13204
+ for (const [, hoveredObj] of pointerState.hovered) {
13205
+ const eventObject = hoveredObj.eventObject;
13206
+ const instance = eventObject.__r3f;
13207
+ if (instance?.eventCount) {
13208
+ const handlers = instance.handlers;
13209
+ const data = { ...hoveredObj, intersections: [] };
13210
+ handlers.onPointerOut?.(data);
13211
+ handlers.onPointerLeave?.(data);
13529
13212
  }
13530
- }, le.discreteUpdates = function(e, n, o, i, s) {
13531
- var u = x.T, f = wt();
13532
- try {
13533
- return an(2), x.T = null, e(n, o, i, s);
13534
- } finally {
13535
- an(f), x.T = u, ye === Jn && (Pp = me() + Fg);
13213
+ }
13214
+ internal.pointerMap.delete(pointerId);
13215
+ }
13216
+ internal.pointerDirty.delete(pointerId);
13217
+ }
13218
+ function processDeferredPointer(event, pointerId) {
13219
+ const state = store.getState();
13220
+ const { internal } = state;
13221
+ if (!state.events.enabled) return;
13222
+ const filter = filterPointerEvents;
13223
+ const hits = intersect(event, filter);
13224
+ cancelPointer(hits, pointerId);
13225
+ function onIntersect(data) {
13226
+ const eventObject = data.eventObject;
13227
+ const instance = eventObject.__r3f;
13228
+ if (!instance?.eventCount) return;
13229
+ const handlers = instance.handlers;
13230
+ if (handlers.onPointerOver || handlers.onPointerEnter || handlers.onPointerOut || handlers.onPointerLeave) {
13231
+ const id = makeId(data);
13232
+ const pointerState = getPointerState(internal, pointerId);
13233
+ const hoveredItem = pointerState.hovered.get(id);
13234
+ if (!hoveredItem) {
13235
+ pointerState.hovered.set(id, data);
13236
+ handlers.onPointerOver?.(data);
13237
+ handlers.onPointerEnter?.(data);
13238
+ } else if (hoveredItem.stopped) {
13239
+ data.stopPropagation();
13536
13240
  }
13537
- }, le.findAllNodes = kc, le.findBoundingRects = function(e, n) {
13538
- if (!xr) throw Error("Test selector API is not supported by this renderer.");
13539
- n = kc(e, n), e = [];
13540
- for (var o = 0; o < n.length; o++) e.push(ma(n[o]));
13541
- for (n = e.length - 1; 0 < n; n--) {
13542
- o = e[n];
13543
- for (var i = o.x, s = i + o.width, u = o.y, f = u + o.height, p = n - 1; 0 <= p; p--) if (n !== p) {
13544
- var g = e[p], S = g.x, T = S + g.width, _ = g.y, I = _ + g.height;
13545
- if (i >= S && u >= _ && s <= T && f <= I) {
13546
- e.splice(n, 1);
13547
- break;
13548
- } else if (i !== S || o.width !== g.width || I < u || _ > f) {
13549
- if (!(u !== _ || o.height !== g.height || T < i || S > s)) {
13550
- S > i && (g.width += S - i, g.x = i), T < s && (g.width = s - S), e.splice(n, 1);
13551
- break;
13241
+ }
13242
+ handlers.onPointerMove?.(data);
13243
+ }
13244
+ handleIntersects(hits, event, 0, onIntersect);
13245
+ }
13246
+ function handlePointer(name) {
13247
+ switch (name) {
13248
+ case "onPointerLeave":
13249
+ case "onDragLeave":
13250
+ return () => cancelPointer([]);
13251
+ // Global cancel of these events
13252
+ case "onPointerCancel":
13253
+ return (event) => {
13254
+ const pointerId = getPointerId(event);
13255
+ cleanupPointer(pointerId);
13256
+ };
13257
+ case "onLostPointerCapture":
13258
+ return (event) => {
13259
+ const { internal } = store.getState();
13260
+ const pointerId = getPointerId(event);
13261
+ const pointerState = internal.pointerMap.get(pointerId);
13262
+ if (pointerState?.captured.size) {
13263
+ requestAnimationFrame(() => {
13264
+ const pointerState2 = internal.pointerMap.get(pointerId);
13265
+ if (pointerState2?.captured.size) {
13266
+ pointerState2.captured.clear();
13552
13267
  }
13553
- } else {
13554
- _ > u && (g.height += _ - u, g.y = u), I < f && (g.height = f - _), e.splice(n, 1);
13555
- break;
13268
+ cancelPointer([], pointerId);
13269
+ });
13270
+ }
13271
+ };
13272
+ }
13273
+ return function handleEvent(event) {
13274
+ const state = store.getState();
13275
+ const { onPointerMissed, onDragOverMissed, onDropMissed, internal, events } = state;
13276
+ const pointerId = getPointerId(event);
13277
+ internal.lastEvent.current = event;
13278
+ if (!events.enabled) return;
13279
+ const isPointerMove = name === "onPointerMove";
13280
+ const isDragOver = name === "onDragOver";
13281
+ const isDrop = name === "onDrop";
13282
+ const isClickEvent = name === "onClick" || name === "onContextMenu" || name === "onDoubleClick";
13283
+ const isPointerDown = name === "onPointerDown";
13284
+ const isPointerUp = name === "onPointerUp";
13285
+ const isWheel = name === "onWheel";
13286
+ const canDeferRaycasts = events.frameTimedRaycasts && state.frameloop === "always";
13287
+ if (isPointerMove && canDeferRaycasts) {
13288
+ events.compute?.(event, state);
13289
+ internal.pointerDirty.set(pointerId, event);
13290
+ return;
13291
+ }
13292
+ if (isWheel && canDeferRaycasts && !events.alwaysFireOnScroll) {
13293
+ events.compute?.(event, state);
13294
+ internal.pointerDirty.set(pointerId, event);
13295
+ return;
13296
+ }
13297
+ if ((isClickEvent || isPointerDown || isPointerUp) && internal.pointerDirty.has(pointerId)) {
13298
+ const deferredEvent = internal.pointerDirty.get(pointerId);
13299
+ internal.pointerDirty.delete(pointerId);
13300
+ processDeferredPointer(deferredEvent, pointerId);
13301
+ }
13302
+ const filter = isPointerMove || isDragOver || isDrop ? filterPointerEvents : void 0;
13303
+ const hits = intersect(event, filter);
13304
+ const delta = isClickEvent ? calculateDistance(event, pointerId) : 0;
13305
+ if (isPointerDown) {
13306
+ const pointerState2 = getPointerState(internal, pointerId);
13307
+ pointerState2.initialClick = [event.offsetX, event.offsetY];
13308
+ pointerState2.initialHits = hits.map((hit) => hit.eventObject);
13309
+ }
13310
+ const pointerState = internal.pointerMap.get(pointerId);
13311
+ const initialHits = pointerState?.initialHits ?? [];
13312
+ if (isClickEvent && !hits.length) {
13313
+ if (delta <= 2) {
13314
+ pointerMissed(event, internal.interaction);
13315
+ if (onPointerMissed) onPointerMissed(event);
13316
+ }
13317
+ }
13318
+ if (isDragOver && !hits.length) {
13319
+ dragOverMissed(event, internal.interaction);
13320
+ if (onDragOverMissed) onDragOverMissed(event);
13321
+ }
13322
+ if (isDrop && !hits.length) {
13323
+ dropMissed(event, internal.interaction);
13324
+ if (onDropMissed) onDropMissed(event);
13325
+ }
13326
+ if (isPointerMove || isDragOver) {
13327
+ cancelPointer(hits, pointerId);
13328
+ }
13329
+ function onIntersect(data) {
13330
+ const eventObject = data.eventObject;
13331
+ const instance = eventObject.__r3f;
13332
+ if (!instance?.eventCount) return;
13333
+ const handlers = instance.handlers;
13334
+ if (isPointerMove) {
13335
+ if (handlers.onPointerOver || handlers.onPointerEnter || handlers.onPointerOut || handlers.onPointerLeave) {
13336
+ const id = makeId(data);
13337
+ const pointerState2 = getPointerState(internal, pointerId);
13338
+ const hoveredItem = pointerState2.hovered.get(id);
13339
+ if (!hoveredItem) {
13340
+ pointerState2.hovered.set(id, data);
13341
+ handlers.onPointerOver?.(data);
13342
+ handlers.onPointerEnter?.(data);
13343
+ } else if (hoveredItem.stopped) {
13344
+ data.stopPropagation();
13556
13345
  }
13557
13346
  }
13558
- }
13559
- return e;
13560
- }, le.findHostInstance = function(e) {
13561
- var n = e._reactInternals;
13562
- if (n === void 0) throw typeof e.render == "function" ? Error("Unable to find node on an unmounted component.") : (e = Object.keys(e).join(","), Error("Argument appears to not be a ReactComponent. Keys: " + e));
13563
- return e = mu(n), e === null ? null : ot(e.stateNode);
13564
- }, le.findHostInstanceWithNoPortals = function(e) {
13565
- return e = Ed(e), e = e !== null ? _p(e) : null, e === null ? null : ot(e.stateNode);
13566
- }, le.findHostInstanceWithWarning = function(e, n) {
13567
- var o = e._reactInternals;
13568
- if (o === void 0) throw typeof e.render == "function" ? Error("Unable to find node on an unmounted component.") : (e = Object.keys(e).join(","), Error("Argument appears to not be a ReactComponent. Keys: " + e));
13569
- if (e = mu(o), e === null) return null;
13570
- if (e.mode & 8) {
13571
- var i = G(o) || "Component";
13572
- mb[i] || (mb[i] = true, B(e, function() {
13573
- o.mode & 8 ? console.error("%s is deprecated in StrictMode. %s was passed an instance of %s which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://react.dev/link/strict-mode-find-node", n, n, i) : console.error("%s is deprecated in StrictMode. %s was passed an instance of %s which renders StrictMode children. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://react.dev/link/strict-mode-find-node", n, n, i);
13574
- }));
13575
- }
13576
- return ot(e.stateNode);
13577
- }, le.flushPassiveEffects = el, le.flushSyncFromReconciler = function(e) {
13578
- var n = ye;
13579
- ye |= 1;
13580
- var o = x.T, i = wt();
13581
- try {
13582
- if (an(2), x.T = null, e) return e();
13583
- } finally {
13584
- an(i), x.T = o, ye = n, (ye & (Zn | uo)) === Jn && Wa(0);
13585
- }
13586
- }, le.flushSyncWork = Ls, le.focusWithin = function(e, n) {
13587
- if (!xr) throw Error("Test selector API is not supported by this renderer.");
13588
- for (e = Ef(e), n = hh(e, n), n = Array.from(n), e = 0; e < n.length; ) {
13589
- var o = n[e++], i = o.tag;
13590
- if (!Kr(o)) {
13591
- if ((i === 5 || i === 26 || i === 27) && Ft(o.stateNode)) return true;
13592
- for (o = o.child; o !== null; ) n.push(o), o = o.sibling;
13347
+ handlers.onPointerMove?.(data);
13348
+ } else if (isDragOver) {
13349
+ const id = makeId(data);
13350
+ const pointerState2 = getPointerState(internal, pointerId);
13351
+ const hoveredItem = pointerState2.hovered.get(id);
13352
+ if (!hoveredItem) {
13353
+ pointerState2.hovered.set(id, data);
13354
+ handlers.onDragOverEnter?.(data);
13355
+ } else if (hoveredItem.stopped) {
13356
+ data.stopPropagation();
13357
+ }
13358
+ handlers.onDragOver?.(data);
13359
+ } else if (isDrop) {
13360
+ handlers.onDrop?.(data);
13361
+ } else {
13362
+ const handler = handlers[name];
13363
+ if (handler) {
13364
+ if (!isClickEvent || initialHits.includes(eventObject)) {
13365
+ pointerMissed(
13366
+ event,
13367
+ internal.interaction.filter((object) => !initialHits.includes(object))
13368
+ );
13369
+ handler(data);
13370
+ }
13371
+ } else {
13372
+ if (isClickEvent && initialHits.includes(eventObject)) {
13373
+ pointerMissed(
13374
+ event,
13375
+ internal.interaction.filter((object) => !initialHits.includes(object))
13376
+ );
13377
+ }
13593
13378
  }
13594
13379
  }
13595
- return false;
13596
- }, le.getFindAllNodesFailureDescription = function(e, n) {
13597
- if (!xr) throw Error("Test selector API is not supported by this renderer.");
13598
- var o = 0, i = [];
13599
- e = [Ef(e), 0];
13600
- for (var s = 0; s < e.length; ) {
13601
- var u = e[s++], f = u.tag, p = e[s++], g = n[p];
13602
- if ((f !== 5 && f !== 26 && f !== 27 || !Kr(u)) && (If(u, g) && (i.push(Sc(g)), p++, p > o && (o = p)), p < n.length)) for (u = u.child; u !== null; ) e.push(u, p), u = u.sibling;
13380
+ }
13381
+ handleIntersects(hits, event, delta, onIntersect);
13382
+ };
13383
+ }
13384
+ function flushDeferredPointers() {
13385
+ const { internal, events } = store.getState();
13386
+ if (!events.frameTimedRaycasts) return;
13387
+ for (const [pointerId, event] of internal.pointerDirty) {
13388
+ processDeferredPointer(event, pointerId);
13389
+ }
13390
+ internal.pointerDirty.clear();
13391
+ }
13392
+ return { handlePointer, flushDeferredPointers, processDeferredPointer };
13393
+ }
13394
+ const DOM_EVENTS = {
13395
+ onClick: ["click", false],
13396
+ onContextMenu: ["contextmenu", false],
13397
+ onDoubleClick: ["dblclick", false],
13398
+ onDragEnter: ["dragenter", false],
13399
+ onDragLeave: ["dragleave", false],
13400
+ onDragOver: ["dragover", false],
13401
+ onDrop: ["drop", false],
13402
+ onWheel: ["wheel", true],
13403
+ onPointerDown: ["pointerdown", true],
13404
+ onPointerUp: ["pointerup", true],
13405
+ onPointerLeave: ["pointerleave", true],
13406
+ onPointerMove: ["pointermove", true],
13407
+ onPointerCancel: ["pointercancel", true],
13408
+ onLostPointerCapture: ["lostpointercapture", true]
13409
+ };
13410
+ function createPointerEvents(store) {
13411
+ const { handlePointer, flushDeferredPointers, processDeferredPointer } = createEvents(store);
13412
+ let nextXRPointerId = XR_POINTER_ID_START;
13413
+ const xrPointers = /* @__PURE__ */ new Map();
13414
+ return {
13415
+ priority: 1,
13416
+ enabled: true,
13417
+ frameTimedRaycasts: true,
13418
+ alwaysFireOnScroll: true,
13419
+ updateOnFrame: false,
13420
+ compute(event, state) {
13421
+ state.pointer.set(event.offsetX / state.size.width * 2 - 1, -(event.offsetY / state.size.height) * 2 + 1);
13422
+ state.raycaster.setFromCamera(state.pointer, state.camera);
13423
+ },
13424
+ connected: void 0,
13425
+ handlers: Object.keys(DOM_EVENTS).reduce(
13426
+ (acc, key) => ({ ...acc, [key]: handlePointer(key) }),
13427
+ {}
13428
+ ),
13429
+ update: (pointerId) => {
13430
+ const { events, internal } = store.getState();
13431
+ if (!events.handlers) return;
13432
+ if (pointerId !== void 0) {
13433
+ const event = internal.pointerDirty.get(pointerId);
13434
+ if (event) {
13435
+ internal.pointerDirty.delete(pointerId);
13436
+ processDeferredPointer(event, pointerId);
13437
+ } else if (internal.lastEvent?.current) {
13438
+ processDeferredPointer(internal.lastEvent.current, pointerId);
13603
13439
  }
13604
- if (o < n.length) {
13605
- for (e = []; o < n.length; o++) e.push(Sc(n[o]));
13606
- return `findAllNodes was able to match part of the selector:
13607
- ` + (i.join(" > ") + `
13608
-
13609
- No matching component was found for:
13610
- `) + e.join(" > ");
13440
+ } else {
13441
+ flushDeferredPointers();
13442
+ if (internal.lastEvent?.current) {
13443
+ events.handlers.onPointerMove(internal.lastEvent.current);
13611
13444
  }
13612
- return null;
13613
- }, le.getPublicRootInstance = function(e) {
13614
- if (e = e.current, !e.child) return null;
13615
- switch (e.child.tag) {
13616
- case 27:
13617
- case 5:
13618
- return ot(e.child.stateNode);
13619
- default:
13620
- return e.child.stateNode;
13445
+ }
13446
+ },
13447
+ flush: () => {
13448
+ const { events, internal } = store.getState();
13449
+ flushDeferredPointers();
13450
+ if (events.updateOnFrame && internal.lastEvent?.current && events.handlers) {
13451
+ events.handlers.onPointerMove(internal.lastEvent.current);
13452
+ }
13453
+ },
13454
+ connect: (target) => {
13455
+ if (!target) return;
13456
+ const { set, events } = store.getState();
13457
+ events.disconnect?.();
13458
+ set((state) => ({ events: { ...state.events, connected: target } }));
13459
+ if (events.handlers) {
13460
+ for (const name in events.handlers) {
13461
+ const event = events.handlers[name];
13462
+ const [eventName, passive] = DOM_EVENTS[name];
13463
+ target.addEventListener(eventName, event, { passive });
13621
13464
  }
13622
- }, le.injectIntoDevTools = function() {
13623
- var e = { bundleType: 1, version: Jt, rendererPackageName: Zt, currentDispatcherRef: x, reconcilerVersion: "19.2.0" };
13624
- return jo !== null && (e.rendererConfig = jo), e.overrideHookState = gb, e.overrideHookStateDeletePath = yb, e.overrideHookStateRenamePath = bb, e.overrideProps = vb, e.overridePropsDeletePath = Sb, e.overridePropsRenamePath = kb, e.scheduleUpdate = wb, e.scheduleRetry = Pb, e.setErrorHandler = xb, e.setSuspenseHandler = zb, e.scheduleRefresh = hu, e.scheduleRoot = Fl, e.setRefreshHandler = Ir, e.getCurrentFiber = Ic, Ep(e);
13625
- }, le.isAlreadyRendering = Ns, le.observeVisibleRects = function(e, n, o, i) {
13626
- function s() {
13627
- var S = kc(e, n);
13628
- u.forEach(function(T) {
13629
- 0 > S.indexOf(T) && g(T);
13630
- }), S.forEach(function(T) {
13631
- 0 > u.indexOf(T) && p(T);
13632
- });
13465
+ }
13466
+ },
13467
+ disconnect: () => {
13468
+ const { set, events } = store.getState();
13469
+ if (events.connected) {
13470
+ if (events.handlers) {
13471
+ for (const name in events.handlers) {
13472
+ const event = events.handlers[name];
13473
+ const [eventName] = DOM_EVENTS[name];
13474
+ events.connected.removeEventListener(eventName, event);
13475
+ }
13476
+ }
13477
+ set((state) => ({ events: { ...state.events, connected: void 0 } }));
13478
+ }
13479
+ },
13480
+ // PREVIEW (A8): the XR pointer registration API may change before stable.
13481
+ registerPointer: (config) => {
13482
+ const pointerId = nextXRPointerId++;
13483
+ xrPointers.set(pointerId, config);
13484
+ const { internal } = store.getState();
13485
+ getPointerState(internal, pointerId);
13486
+ return pointerId;
13487
+ },
13488
+ unregisterPointer: (pointerId) => {
13489
+ xrPointers.delete(pointerId);
13490
+ const { internal } = store.getState();
13491
+ const pointerState = internal.pointerMap.get(pointerId);
13492
+ if (pointerState) {
13493
+ for (const [, hoveredObj] of pointerState.hovered) {
13494
+ const eventObject = hoveredObj.eventObject;
13495
+ const instance = eventObject.__r3f;
13496
+ if (instance?.eventCount) {
13497
+ const handlers = instance.handlers;
13498
+ const data = { ...hoveredObj, intersections: [] };
13499
+ handlers.onPointerOut?.(data);
13500
+ handlers.onPointerLeave?.(data);
13501
+ }
13633
13502
  }
13634
- if (!xr) throw Error("Test selector API is not supported by this renderer.");
13635
- var u = kc(e, n);
13636
- o = zr(u, o, i);
13637
- var f = o.disconnect, p = o.observe, g = o.unobserve;
13638
- return bm.push(s), { disconnect: function() {
13639
- var S = bm.indexOf(s);
13640
- 0 <= S && bm.splice(S, 1), f();
13641
- } };
13642
- }, le.shouldError = function(e) {
13643
- return pu(e);
13644
- }, le.shouldSuspend = function(e) {
13645
- return fu(e);
13646
- }, le.startHostTransition = function(e, n, o, i) {
13647
- if (e.tag !== 5) throw Error("Expected the form instance to be a HostComponent. This is a bug in React.");
13648
- var s = uf(e).queue;
13649
- Hp(e), nt(e, s, n, Xt, o === null ? Em : function() {
13650
- x.T === null && console.error("requestFormReset was called outside a transition or action. To fix, move to an action, or wrap with startTransition.");
13651
- var u = uf(e);
13652
- return u.next === null && (u = e.alternate.memoizedState), qi(e, u.next.queue, {}, Nt(e)), o(i);
13653
- });
13654
- }, le.updateContainer = function(e, n, o, i) {
13655
- var s = n.current, u = Nt(s);
13656
- return As(s, u, e, n, o, i), u;
13657
- }, le.updateContainerSync = Wh, le;
13658
- }, Tt.exports.default = Tt.exports, Object.defineProperty(Tt.exports, "__esModule", { value: true }));
13659
- })(Mg)), Mg.exports;
13660
- }
13661
- var Eb;
13662
- function n0() {
13663
- return Eb || (Eb = 1, process.env.NODE_ENV === "production" ? Rm.exports = Kb() : Rm.exports = e0()), Rm.exports;
13503
+ internal.pointerMap.delete(pointerId);
13504
+ }
13505
+ internal.pointerDirty.delete(pointerId);
13506
+ }
13507
+ };
13664
13508
  }
13665
- var t0 = n0();
13666
- const r0 = Xb(t0);
13667
-
13668
- const t = 1, o = 8, r = 32, e = 2;
13669
13509
 
13670
13510
  function createReconciler(config) {
13671
13511
  const reconciler2 = r0(config);
@@ -13830,7 +13670,15 @@ function setFiberRef(fiber, publicInstance) {
13830
13670
  }
13831
13671
  }
13832
13672
  const reconstructed = [];
13833
- function swapInstances() {
13673
+ function flushReconstructedInstances() {
13674
+ if (reconstructed.length === 0) return;
13675
+ try {
13676
+ swapReconstructedInstances();
13677
+ } finally {
13678
+ reconstructed.length = 0;
13679
+ }
13680
+ }
13681
+ function swapReconstructedInstances() {
13834
13682
  for (const [instance] of reconstructed) {
13835
13683
  const parent = instance.parent;
13836
13684
  if (parent) {
@@ -13848,7 +13696,9 @@ function swapInstances() {
13848
13696
  }
13849
13697
  }
13850
13698
  if (instance.isHidden) unhideInstance(instance);
13851
- if (isObject3D(instance.object)) removeInteractivity(findInitialRoot(instance), instance.object);
13699
+ if (isObject3D(instance.object) && !instance.parent) {
13700
+ removeInteractivity(findInitialRoot(instance), instance.object);
13701
+ }
13852
13702
  if (instance.object.__r3f) delete instance.object.__r3f;
13853
13703
  if (instance.type !== "primitive") disposeOnIdle(instance.object);
13854
13704
  }
@@ -13857,9 +13707,13 @@ function swapInstances() {
13857
13707
  const parent = instance.parent;
13858
13708
  if (parent) {
13859
13709
  const target = catalogue[toPascalCase(instance.type)];
13710
+ const prevObject = instance.object;
13860
13711
  instance.object = instance.props.object ?? new target(...instance.props.args ?? []);
13861
13712
  instance.object.__r3f = instance;
13862
13713
  setFiberRef(fiber, instance.object);
13714
+ if (isObject3D(prevObject) && isObject3D(instance.object)) {
13715
+ swapInteractivity(findInitialRoot(instance), prevObject, instance.object);
13716
+ }
13863
13717
  delete instance.appliedOnce;
13864
13718
  instance.eventCount = 0;
13865
13719
  instance.handlers = {};
@@ -13879,14 +13733,114 @@ function swapInstances() {
13879
13733
  invalidateInstance(instance);
13880
13734
  }
13881
13735
  }
13882
- reconstructed.length = 0;
13883
13736
  }
13884
13737
  const handleTextInstance = () => {
13885
13738
  };
13886
13739
  const NO_CONTEXT = {};
13887
13740
  let currentUpdatePriority = NoEventPriority;
13888
- const NoFlags = 0;
13889
- const Update = 4;
13741
+ function getEventPriority(type) {
13742
+ switch (type) {
13743
+ case "beforetoggle":
13744
+ case "cancel":
13745
+ case "click":
13746
+ case "close":
13747
+ case "contextmenu":
13748
+ case "copy":
13749
+ case "cut":
13750
+ case "auxclick":
13751
+ case "dblclick":
13752
+ case "dragend":
13753
+ case "dragstart":
13754
+ case "drop":
13755
+ case "focusin":
13756
+ case "focusout":
13757
+ case "input":
13758
+ case "invalid":
13759
+ case "keydown":
13760
+ case "keypress":
13761
+ case "keyup":
13762
+ case "mousedown":
13763
+ case "mouseup":
13764
+ case "paste":
13765
+ case "pause":
13766
+ case "play":
13767
+ case "pointercancel":
13768
+ case "pointerdown":
13769
+ case "pointerup":
13770
+ case "ratechange":
13771
+ case "reset":
13772
+ case "resize":
13773
+ case "seeked":
13774
+ case "submit":
13775
+ case "touchcancel":
13776
+ case "touchend":
13777
+ case "touchstart":
13778
+ case "volumechange":
13779
+ case "change":
13780
+ case "selectionchange":
13781
+ case "compositionstart":
13782
+ case "compositionend":
13783
+ case "compositionupdate":
13784
+ case "beforeinput":
13785
+ case "blur":
13786
+ case "fullscreenchange":
13787
+ case "focus":
13788
+ case "hashchange":
13789
+ case "popstate":
13790
+ case "select":
13791
+ case "selectstart":
13792
+ return e;
13793
+ case "drag":
13794
+ case "dragenter":
13795
+ case "dragexit":
13796
+ case "dragleave":
13797
+ case "dragover":
13798
+ case "mousemove":
13799
+ case "mouseout":
13800
+ case "mouseover":
13801
+ case "pointermove":
13802
+ case "pointerout":
13803
+ case "pointerover":
13804
+ case "scroll":
13805
+ case "touchmove":
13806
+ case "wheel":
13807
+ case "mouseenter":
13808
+ case "mouseleave":
13809
+ case "pointerenter":
13810
+ case "pointerleave":
13811
+ return o;
13812
+ case "message": {
13813
+ switch (unstable_getCurrentPriorityLevel()) {
13814
+ case unstable_ImmediatePriority:
13815
+ return e;
13816
+ case unstable_UserBlockingPriority:
13817
+ return o;
13818
+ case unstable_NormalPriority:
13819
+ case unstable_LowPriority:
13820
+ return r;
13821
+ case unstable_IdlePriority:
13822
+ return i$1;
13823
+ default:
13824
+ return r;
13825
+ }
13826
+ }
13827
+ default:
13828
+ return r;
13829
+ }
13830
+ }
13831
+ function scheduleMicrotask(callback) {
13832
+ if (typeof queueMicrotask === "function") {
13833
+ queueMicrotask(callback);
13834
+ } else if (typeof Promise !== "undefined") {
13835
+ Promise.resolve().then(callback).catch((error) => {
13836
+ setTimeout(() => {
13837
+ throw error;
13838
+ });
13839
+ });
13840
+ } else {
13841
+ setTimeout(callback);
13842
+ }
13843
+ }
13890
13844
  const reconciler = /* @__PURE__ */ createReconciler({
13891
13845
  isPrimaryRenderer: false,
13892
13846
  warnsIfNotActing: false,
@@ -13925,16 +13879,15 @@ const reconciler = /* @__PURE__ */ createReconciler({
13925
13879
  else if (newProps.args?.length !== oldProps.args?.length) reconstruct = true;
13926
13880
  else if (newProps.args?.some((value, index) => value !== oldProps.args?.[index])) reconstruct = true;
13927
13881
  if (reconstruct) {
13928
- reconstructed.push([instance, { ...newProps }, fiber]);
13882
+ reconstructed.push([instance, getInstanceProps(newProps), fiber]);
13929
13883
  } else {
13930
13884
  const changedProps = diffProps(instance, newProps);
13931
- if (Object.keys(changedProps).length) {
13932
- Object.assign(instance.props, changedProps);
13933
- applyProps(instance.object, changedProps);
13934
- }
13885
+ const attach2 = instance.props.attach;
13886
+ instance.props = getInstanceProps(newProps);
13887
+ if (attach2 !== void 0) instance.props.attach = attach2;
13888
+ else delete instance.props.attach;
13889
+ if (Object.keys(changedProps).length) applyProps(instance.object, changedProps);
13935
13890
  }
13936
- const isTailSibling = fiber.sibling === null || (fiber.flags & Update) === NoFlags;
13937
- if (isTailSibling) swapInstances();
13938
13891
  },
13939
13892
  finalizeInitialChildren: (instance) => {
13940
13893
  for (const prop in instance.props) {
@@ -13959,8 +13912,9 @@ const reconciler = /* @__PURE__ */ createReconciler({
13959
13912
  const target = container.getState().internal.container ?? container.getState().scene;
13960
13913
  return prepare(target, container, "", {});
13961
13914
  },
13962
- resetAfterCommit: () => {
13963
- },
13915
+ // Reconstructed instances are swapped once all mutations are committed,
13916
+ // before layout effects run so refs point to the new objects
13917
+ resetAfterCommit: flushReconstructedInstances,
13964
13918
  shouldSetTextContent: () => false,
13965
13919
  clearContainer: () => false,
13966
13920
  hideInstance,
@@ -13968,6 +13922,9 @@ const reconciler = /* @__PURE__ */ createReconciler({
13968
13922
  createTextInstance: handleTextInstance,
13969
13923
  hideTextInstance: handleTextInstance,
13970
13924
  unhideTextInstance: handleTextInstance,
13925
+ // Mirrors react-dom, which flushes discrete work in microtasks
13926
+ supportsMicrotasks: true,
13927
+ scheduleMicrotask,
13971
13928
  scheduleTimeout: typeof setTimeout === "function" ? setTimeout : void 0,
13972
13929
  cancelTimeout: typeof clearTimeout === "function" ? clearTimeout : void 0,
13973
13930
  noTimeout: -1,
@@ -14008,28 +13965,9 @@ const reconciler = /* @__PURE__ */ createReconciler({
14008
13965
  },
14009
13966
  resolveUpdatePriority() {
14010
13967
  if (currentUpdatePriority !== NoEventPriority) return currentUpdatePriority;
14011
- switch (typeof window !== "undefined" && window.event?.type) {
14012
- case "click":
14013
- case "contextmenu":
14014
- case "dblclick":
14015
- case "dragenter":
14016
- case "dragleave":
14017
- case "drop":
14018
- case "pointercancel":
14019
- case "pointerdown":
14020
- case "pointerup":
14021
- return e;
14022
- case "dragover":
14023
- case "pointermove":
14024
- case "pointerout":
14025
- case "pointerover":
14026
- case "pointerenter":
14027
- case "pointerleave":
14028
- case "wheel":
14029
- return o;
14030
- default:
14031
- return r;
14032
- }
13968
+ const eventType = typeof window !== "undefined" ? window.event?.type : void 0;
13969
+ if (eventType === void 0) return r;
13970
+ return getEventPriority(eventType);
14033
13971
  },
14034
13972
  resetFormInstance() {
14035
13973
  },
@@ -14078,11 +14016,15 @@ const reconciler = /* @__PURE__ */ createReconciler({
14078
14016
  cloneMutableTextInstance(textInstance) {
14079
14017
  return textInstance;
14080
14018
  },
14019
+ // React 19.2 added these for root-level view transitions. They only run for hosts that opt into
14020
+ // view transitions by returning a container from cloneRootViewTransitionContainer; R3F renders
14021
+ // into a WebGL/WebGPU canvas, where cloning the root has no meaning, so we never opt in and
14022
+ // React never calls them. They stay as no-ops rather than throws: the host config is shared by
14023
+ // every root, and a throw here would turn a React-internal probe into a hard crash for users.
14024
+ // Guarded by a test asserting a full render + unmount never reaches them.
14081
14025
  cloneRootViewTransitionContainer(_rootContainer) {
14082
- throw new Error("Not implemented.");
14083
14026
  },
14084
14027
  removeRootViewTransitionClone(_rootContainer, _clone) {
14085
- throw new Error("Not implemented.");
14086
14028
  },
14087
14029
  // https://github.com/facebook/react/pull/32465
14088
14030
  createFragmentInstance: (_fiber) => null,
@@ -14434,6 +14376,10 @@ function createRoot(canvas) {
14434
14376
  if (state2.internal.isMultiCanvas && state2.internal.canvasTarget) {
14435
14377
  const renderer2 = state2.internal.actualRenderer;
14436
14378
  renderer2.setCanvasTarget(state2.internal.canvasTarget);
14379
+ if (state2.internal.canvasTargetSizeDirty) {
14380
+ state2.internal.canvasTargetSizeDirty = false;
14381
+ renderer2.backend?.updateSize?.();
14382
+ }
14437
14383
  }
14438
14384
  },
14439
14385
  {
@@ -14590,7 +14536,8 @@ function unmountComponentAtNode(canvas, callback) {
14590
14536
  dispose(state.scene);
14591
14537
  _roots.delete(canvas);
14592
14538
  if (callback) callback(canvas);
14593
- } catch {
14539
+ } catch (error) {
14540
+ console.warn("[R3F] Error while unmounting root; teardown may be incomplete:", error);
14594
14541
  }
14595
14542
  }, 500);
14596
14543
  }
@@ -14701,6 +14648,212 @@ function flushSync(fn) {
14701
14648
  return reconciler.flushSyncFromReconciler(fn);
14702
14649
  }
14703
14650
 
14651
+ const isRef = (obj) => obj.current && obj.current.isScene;
14652
+ const resolveScene = (scene) => isRef(scene) ? scene.current : scene;
14653
+ function setEnvProps(background, scene, defaultScene, texture, sceneProps = {}) {
14654
+ sceneProps = {
14655
+ backgroundBlurriness: 0,
14656
+ backgroundIntensity: 1,
14657
+ backgroundRotation: [0, 0, 0],
14658
+ environmentIntensity: 1,
14659
+ environmentRotation: [0, 0, 0],
14660
+ ...sceneProps
14661
+ };
14662
+ const target = resolveScene(scene || defaultScene);
14663
+ const oldbg = target.background;
14664
+ const oldenv = target.environment;
14665
+ const oldSceneProps = {
14666
+ // @ts-ignore
14667
+ backgroundBlurriness: target.backgroundBlurriness,
14668
+ // @ts-ignore
14669
+ backgroundIntensity: target.backgroundIntensity,
14670
+ // @ts-ignore
14671
+ backgroundRotation: target.backgroundRotation?.clone?.() ?? [0, 0, 0],
14672
+ // @ts-ignore
14673
+ environmentIntensity: target.environmentIntensity,
14674
+ // @ts-ignore
14675
+ environmentRotation: target.environmentRotation?.clone?.() ?? [0, 0, 0]
14676
+ };
14677
+ if (background !== "only") target.environment = texture;
14678
+ if (background) target.background = texture;
14679
+ applyProps(target, sceneProps);
14680
+ return () => {
14681
+ if (background !== "only") target.environment = oldenv;
14682
+ if (background) target.background = oldbg;
14683
+ applyProps(target, oldSceneProps);
14684
+ };
14685
+ }
14686
+ function EnvironmentMap({ scene, background = false, map, ...config }) {
14687
+ const defaultScene = useThree((state) => state.scene);
14688
+ React.useLayoutEffect(() => {
14689
+ if (map) return setEnvProps(background, scene, defaultScene, map, config);
14690
+ });
14691
+ return null;
14692
+ }
14693
+ function EnvironmentCube({
14694
+ background = false,
14695
+ scene,
14696
+ blur,
14697
+ backgroundBlurriness,
14698
+ backgroundIntensity,
14699
+ backgroundRotation,
14700
+ environmentIntensity,
14701
+ environmentRotation,
14702
+ ...rest
14703
+ }) {
14704
+ const texture = useEnvironment(rest);
14705
+ const defaultScene = useThree((state) => state.scene);
14706
+ React.useLayoutEffect(() => {
14707
+ return setEnvProps(background, scene, defaultScene, texture, {
14708
+ backgroundBlurriness: blur ?? backgroundBlurriness,
14709
+ backgroundIntensity,
14710
+ backgroundRotation,
14711
+ environmentIntensity,
14712
+ environmentRotation
14713
+ });
14714
+ });
14715
+ React.useEffect(() => {
14716
+ return () => {
14717
+ texture.dispose();
14718
+ };
14719
+ }, [texture]);
14720
+ return null;
14721
+ }
14722
+ function EnvironmentPortal({
14723
+ children,
14724
+ near = 0.1,
14725
+ far = 1e3,
14726
+ resolution = 256,
14727
+ frames = 1,
14728
+ map,
14729
+ background = false,
14730
+ blur,
14731
+ backgroundBlurriness,
14732
+ backgroundIntensity,
14733
+ backgroundRotation,
14734
+ environmentIntensity,
14735
+ environmentRotation,
14736
+ scene,
14737
+ files,
14738
+ path,
14739
+ preset = void 0,
14740
+ extensions
14741
+ }) {
14742
+ const renderer = useThree((state) => state.renderer);
14743
+ const isLegacy = useThree((state) => state.isLegacy);
14744
+ const defaultScene = useThree((state) => state.scene);
14745
+ const camera = React.useRef(null);
14746
+ const [virtualScene] = React.useState(() => new Scene());
14747
+ const fbo = React.useMemo(() => {
14748
+ const fbo2 = isLegacy ? new WebGLCubeRenderTarget(resolution) : new CubeRenderTarget(resolution);
14749
+ fbo2.texture.type = HalfFloatType;
14750
+ return fbo2;
14751
+ }, [resolution, isLegacy]);
14752
+ React.useEffect(() => {
14753
+ return () => {
14754
+ fbo.dispose();
14755
+ };
14756
+ }, [fbo]);
14757
+ React.useLayoutEffect(() => {
14758
+ if (frames === 1) {
14759
+ const autoClear = renderer.autoClear;
14760
+ renderer.autoClear = true;
14761
+ camera.current.update(renderer, virtualScene);
14762
+ renderer.autoClear = autoClear;
14763
+ }
14764
+ return setEnvProps(background, scene, defaultScene, fbo.texture, {
14765
+ backgroundBlurriness: blur ?? backgroundBlurriness,
14766
+ backgroundIntensity,
14767
+ backgroundRotation,
14768
+ environmentIntensity,
14769
+ environmentRotation
14770
+ });
14771
+ }, [
14772
+ children,
14773
+ virtualScene,
14774
+ fbo.texture,
14775
+ scene,
14776
+ defaultScene,
14777
+ background,
14778
+ frames,
14779
+ renderer,
14780
+ blur,
14781
+ backgroundBlurriness,
14782
+ backgroundIntensity,
14783
+ backgroundRotation,
14784
+ environmentIntensity,
14785
+ environmentRotation
14786
+ ]);
14787
+ let count = 1;
14788
+ useFrame(() => {
14789
+ if (frames === Infinity || count < frames) {
14790
+ const autoClear = renderer.autoClear;
14791
+ renderer.autoClear = true;
14792
+ camera.current.update(renderer, virtualScene);
14793
+ renderer.autoClear = autoClear;
14794
+ count++;
14795
+ }
14796
+ });
14797
+ return /* @__PURE__ */ jsx(Fragment, { children: createPortal(
14798
+ /* @__PURE__ */ jsxs(Fragment, { children: [
14799
+ children,
14800
+ /* @__PURE__ */ jsx("cubeCamera", { ref: camera, args: [near, far, fbo] }),
14801
+ files || preset ? /* @__PURE__ */ jsx(EnvironmentCube, { background: true, files, preset, path, extensions }) : map ? /* @__PURE__ */ jsx(EnvironmentMap, { background: true, map, extensions }) : null
14802
+ ] }),
14803
+ virtualScene
14804
+ ) });
14805
+ }
14806
+ function EnvironmentGround(props) {
14807
+ const textureDefault = useEnvironment(props);
14808
+ const texture = props.map || textureDefault;
14809
+ React.useMemo(() => extend({ GroundProjectedEnvImpl: GroundedSkybox }), []);
14810
+ React.useEffect(() => {
14811
+ return () => {
14812
+ textureDefault.dispose();
14813
+ };
14814
+ }, [textureDefault]);
14815
+ const height = props.ground?.height ?? 15;
14816
+ const radius = props.ground?.radius ?? 60;
14817
+ const scale = props.ground?.scale ?? 1e3;
14818
+ const args = React.useMemo(
14819
+ () => [texture, height, radius],
14820
+ [texture, height, radius]
14821
+ );
14822
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
14823
+ /* @__PURE__ */ jsx(EnvironmentMap, { ...props, map: texture }),
14824
+ /* @__PURE__ */ jsx("groundProjectedEnvImpl", { args, scale })
14825
+ ] });
14826
+ }
14827
+ function EnvironmentColor({ color, scene }) {
14828
+ const defaultScene = useThree((state) => state.scene);
14829
+ React.useLayoutEffect(() => {
14830
+ if (color === void 0) return;
14831
+ const target = resolveScene(scene || defaultScene);
14832
+ const oldBg = target.background;
14833
+ target.background = new Color(color);
14834
+ return () => {
14835
+ target.background = oldBg;
14836
+ };
14837
+ });
14838
+ return null;
14839
+ }
14840
+ function EnvironmentDualSource(props) {
14841
+ const { backgroundFiles, ...envProps } = props;
14842
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
14843
+ /* @__PURE__ */ jsx(EnvironmentCube, { ...envProps, background: false }),
14844
+ /* @__PURE__ */ jsx(EnvironmentCube, { ...props, files: backgroundFiles, background: "only" })
14845
+ ] });
14846
+ }
14847
+ function Environment(props) {
14848
+ if (props.color && !props.files && !props.preset && !props.map) {
14849
+ return /* @__PURE__ */ jsx(EnvironmentColor, { ...props });
14850
+ }
14851
+ if (props.backgroundFiles && props.backgroundFiles !== props.files) {
14852
+ return /* @__PURE__ */ jsx(EnvironmentDualSource, { ...props });
14853
+ }
14854
+ return props.ground ? /* @__PURE__ */ jsx(EnvironmentGround, { ...props }) : props.map ? /* @__PURE__ */ jsx(EnvironmentMap, { ...props }) : props.children ? /* @__PURE__ */ jsx(EnvironmentPortal, { ...props }) : /* @__PURE__ */ jsx(EnvironmentCube, { ...props });
14855
+ }
14856
+
14704
14857
  function parseBackground(background) {
14705
14858
  if (!background) return null;
14706
14859
  if (typeof background === "object" && !background.isColor) {
@@ -14744,14 +14897,36 @@ function parseRendererConfig(rendererProp) {
14744
14897
  return { primaryCanvas: void 0, scheduler: void 0, renderer: rendererProp };
14745
14898
  }
14746
14899
 
14900
+ const RESOURCE_KINDS = ["nodes", "uniforms", "buffers", "gpuStorage"];
14901
+ const registries = /* @__PURE__ */ new WeakMap();
14902
+ function getKindRegistry(store, kind) {
14903
+ let registry = registries.get(store);
14904
+ if (!registry) {
14905
+ registry = {
14906
+ nodes: { valid: /* @__PURE__ */ new Set(), staged: /* @__PURE__ */ new Map() },
14907
+ uniforms: { valid: /* @__PURE__ */ new Set(), staged: /* @__PURE__ */ new Map() },
14908
+ buffers: { valid: /* @__PURE__ */ new Set(), staged: /* @__PURE__ */ new Map() },
14909
+ gpuStorage: { valid: /* @__PURE__ */ new Set(), staged: /* @__PURE__ */ new Map() }
14910
+ };
14911
+ registries.set(store, registry);
14912
+ }
14913
+ return registry[kind];
14914
+ }
14915
+ function invalidateResource(store, kind, scopeKey) {
14916
+ const registry = getKindRegistry(store, kind);
14917
+ {
14918
+ registry.valid.clear();
14919
+ registry.staged.clear();
14920
+ }
14921
+ }
14922
+ function invalidateAllResources(store) {
14923
+ for (const kind of RESOURCE_KINDS) invalidateResource(store, kind);
14924
+ }
14925
+
14747
14926
  function clearHmrCaches(store) {
14748
- store.setState((state) => ({
14749
- nodes: {},
14750
- uniforms: {},
14751
- buffers: {},
14752
- gpuStorage: {},
14753
- _hmrVersion: state._hmrVersion + 1
14754
- }));
14927
+ const primary = store.getState().primaryStore ?? store;
14928
+ invalidateAllResources(primary);
14929
+ primary.setState((state) => ({ _hmrVersion: state._hmrVersion + 1 }));
14755
14930
  }
14756
14931
 
14757
14932
  function CanvasImpl({
@@ -14888,7 +15063,7 @@ function CanvasImpl({
14888
15063
  onDropMissed: (...args) => handleDropMissed.current?.(...args),
14889
15064
  onCreated: (state) => {
14890
15065
  state.events.connect?.(
14891
- eventSource ? isRef(eventSource) ? eventSource.current : eventSource : divRef.current
15066
+ eventSource ? isRef$1(eventSource) ? eventSource.current : eventSource : divRef.current
14892
15067
  );
14893
15068
  if (eventPrefix) {
14894
15069
  state.setEvents({
@@ -15001,4 +15176,4 @@ function Canvas(props) {
15001
15176
 
15002
15177
  extend(THREE);
15003
15178
 
15004
- 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 };
15179
+ export { Block, Canvas, Environment, EnvironmentCube, EnvironmentMap, EnvironmentPortal, ErrorBoundary, FROM_REF, IsObject, ONCE, Portal, R3F_BUILD_LEGACY, R3F_BUILD_WEBGPU, REACT_INTERNAL_PROPS, RESERVED_PROPS, Texture, _roots, addAfterEffect, addEffect, addTail, advance, applyProps, attach, buildGraph, calculateDpr, 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$1 as isRef, isRenderer, isTexture, isVectorLike, once, prepare, presetsObj, reconciler, registerPrimary, removeInteractivity, resolve, swapInteractivity, unmountComponentAtNode, unregisterPrimary, updateCamera, updateFrustum, useBridge, useEnvironment, useFrame, useGraph, useInstanceHandle, useIsomorphicLayoutEffect, useLoader, useMutableCallback, useRenderTarget, useStore, useTexture, useTextures, useThree, waitForPrimary };