@react-three/fiber 10.0.0-canary.e881a4a → 10.0.0-canary.ea31ccd

package/dist/webgpu/index.mjs

@@ -1,21 +1,20 @@
 import * as webgpu from 'three/webgpu';
-import { CubeRenderTarget, RenderTarget, CubeReflectionMapping, EquirectangularReflectionMapping, CubeTextureLoader, Scene, HalfFloatType, Color, Frustum, Matrix4, Group, BoxGeometry, MeshBasicNodeMaterial, Mesh, Node, NodeUpdateType, Layers, ShaderMaterial, Uniform, SRGBColorSpace, RGBAFormat, UnsignedByteType, Vector3, Vector2, TextureLoader, Texture as Texture$1, CanvasTarget, Raycaster, OrthographicCamera, PerspectiveCamera, PCFShadowMap, VSMShadowMap, BasicShadowMap, ACESFilmicToneMapping, WebGPURenderer, Vector4, RenderPipeline } from 'three/webgpu';
-import { Inspector } from 'three/addons/inspector/Inspector.js';
+import { CubeRenderTarget, RenderTarget, Frustum, Matrix4, Group, BoxGeometry, MeshBasicNodeMaterial, Mesh, Node, NodeUpdateType, Layers, ShaderMaterial, Uniform, SRGBColorSpace, RGBAFormat, UnsignedByteType, Vector3, Vector2, TextureLoader, Texture as Texture$1, CubeReflectionMapping, EquirectangularReflectionMapping, CubeTextureLoader, CanvasTarget, Raycaster, OrthographicCamera, PerspectiveCamera, Scene, PCFShadowMap, VSMShadowMap, BasicShadowMap, ACESFilmicToneMapping, WebGPURenderer, HalfFloatType, Color, Vector4, RenderPipeline } from 'three/webgpu';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import * as React from 'react';
-import React__default, { useLayoutEffect, useRef, useMemo, useEffect, useContext, useImperativeHandle, useCallback, useState } from 'react';
+import React__default, { useRef, useMemo, useLayoutEffect, useEffect, useContext, useImperativeHandle, useCallback, useState } from 'react';
 import useMeasure from 'react-use-measure';
 import { useFiber, useContextBridge, traverseFiber, FiberProvider } from 'its-fine';
-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';
+import { createWithEqualityFn } from 'zustand/traditional';
+import { getScheduler } from '@pmndrs/scheduler';
+export { Scheduler, getScheduler } from '@pmndrs/scheduler';
+import Tb, { unstable_getCurrentPriorityLevel, unstable_IdlePriority, unstable_LowPriority, unstable_NormalPriority, unstable_UserBlockingPriority, unstable_ImmediatePriority, unstable_scheduleCallback } from 'scheduler';
 import { GroundedSkybox } from 'three/examples/jsm/objects/GroundedSkybox.js';
 import { HDRLoader } from 'three/examples/jsm/loaders/HDRLoader.js';
+import { HDRCubeTextureLoader } from 'three/examples/jsm/loaders/HDRCubeTextureLoader.js';
 import { EXRLoader } from 'three/examples/jsm/loaders/EXRLoader.js';
 import { UltraHDRLoader } from 'three/examples/jsm/loaders/UltraHDRLoader.js';
 import { GainMapLoader } from '@monogrid/gainmap-js';
-import Tb, { unstable_scheduleCallback, unstable_IdlePriority } from 'scheduler';
-import { createWithEqualityFn } from 'zustand/traditional';
-import { getScheduler } from '@pmndrs/scheduler';
-export { Scheduler, getScheduler } from '@pmndrs/scheduler';
 import { suspend, preload, clear } from 'suspend-react';
 import { dequal } from 'dequal/lite';
 import 'zustand/shallow';
@@ -35,6 +34,10 @@ function _mergeNamespaces(n, m) {
 
 const R3F_BUILD_LEGACY = false;
 const R3F_BUILD_WEBGPU = true;
+async function loadInspector() {
+  const { Inspector } = await import('three/addons/inspector/Inspector.js');
+  return Inspector;
+}
 const WebGLRenderer = class WebGLRenderer2 {
   constructor() {
     throw new Error(
@@ -48,13 +51,13 @@ const WebGLCubeRenderTarget = null;
 const THREE = /*#__PURE__*/_mergeNamespaces({
   __proto__: null,
   CubeRenderTargetCompat: CubeRenderTarget,
-  Inspector: Inspector,
   R3F_BUILD_LEGACY: R3F_BUILD_LEGACY,
   R3F_BUILD_WEBGPU: R3F_BUILD_WEBGPU,
   RenderTargetCompat: RenderTarget,
   WebGLCubeRenderTarget: WebGLCubeRenderTarget,
   WebGLRenderTarget: WebGLRenderTarget,
-  WebGLRenderer: WebGLRenderer
+  WebGLRenderer: WebGLRenderer,
+  loadInspector: loadInspector
 }, [webgpu]);
 
 const primaryRegistry = /* @__PURE__ */ new Map();
@@ -115,556 +118,228 @@ function getPrimaryIds() {
   return Array.from(primaryRegistry.keys());
 }
 
-const presetsObj = {
-  apartment: "lebombo_1k.hdr",
-  city: "potsdamer_platz_1k.hdr",
-  dawn: "kiara_1_dawn_1k.hdr",
-  forest: "forest_slope_1k.hdr",
-  lobby: "st_fagans_interior_1k.hdr",
-  night: "dikhololo_night_1k.hdr",
-  park: "rooitou_park_1k.hdr",
-  studio: "studio_small_03_1k.hdr",
-  sunset: "venice_sunset_1k.hdr",
-  warehouse: "empty_warehouse_01_1k.hdr"
-};
+var __defProp$1 = Object.defineProperty;
+var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField$1 = (obj, key, value) => __defNormalProp$1(obj, typeof key !== "symbol" ? key + "" : key, value);
+const useIsomorphicLayoutEffect = /* @__PURE__ */ (() => typeof window !== "undefined" && (window.document?.createElement || window.navigator?.product === "ReactNative"))() ? React.useLayoutEffect : React.useEffect;
+function useMutableCallback(fn) {
+  const ref = React.useRef(fn);
+  useIsomorphicLayoutEffect(() => void (ref.current = fn), [fn]);
+  return ref;
+}
+function useBridge() {
+  const fiber = useFiber();
+  const ContextBridge = useContextBridge();
+  return React.useMemo(
+    () => ({ children }) => {
+      const strict = !!traverseFiber(fiber, true, (node) => node.type === React.StrictMode);
+      const Root = strict ? React.StrictMode : React.Fragment;
+      return /* @__PURE__ */ jsx(Root, { children: /* @__PURE__ */ jsx(ContextBridge, { children }) });
+    },
+    [fiber, ContextBridge]
+  );
+}
+function Block({ set }) {
+  useIsomorphicLayoutEffect(() => {
+    set(new Promise(() => null));
+    return () => set(false);
+  }, [set]);
+  return null;
+}
+const ErrorBoundary = /* @__PURE__ */ (() => {
+  var _a;
+  return _a = class extends React.Component {
+    constructor() {
+      super(...arguments);
+      __publicField$1(this, "state", { error: false });
+    }
+    componentDidCatch(err) {
+      this.props.set(err);
+    }
+    render() {
+      return this.state.error ? null : this.props.children;
+    }
+  }, __publicField$1(_a, "getDerivedStateFromError", () => ({ error: true })), _a;
+})();
 
-const CUBEMAP_ROOT = "https://raw.githack.com/pmndrs/drei-assets/456060a26bbeb8fdf79326f224b6d99b8bcce736/hdri/";
-const isArray = (arr) => Array.isArray(arr);
-const defaultFiles = ["/px.png", "/nx.png", "/py.png", "/ny.png", "/pz.png", "/nz.png"];
-function useEnvironment({
-  files = defaultFiles,
-  path = "",
-  preset = void 0,
-  colorSpace = void 0,
-  extensions
-} = {}) {
-  if (preset) {
-    validatePreset(preset);
-    files = presetsObj[preset];
-    path = CUBEMAP_ROOT;
-  }
-  const multiFile = isArray(files);
-  const { extension, isCubemap } = getExtension(files);
-  const loader = getLoader$1(extension);
-  if (!loader) throw new Error("useEnvironment: Unrecognized file extension: " + files);
-  const renderer = useThree$1((state) => state.renderer);
-  useLayoutEffect(() => {
-    if (extension !== "webp" && extension !== "jpg" && extension !== "jpeg") return;
-    function clearGainmapTexture() {
-      useLoader$1.clear(loader, multiFile ? [files] : files);
+const is = {
+  obj: (a) => a === Object(a) && !is.arr(a) && typeof a !== "function",
+  fun: (a) => typeof a === "function",
+  str: (a) => typeof a === "string",
+  num: (a) => typeof a === "number",
+  boo: (a) => typeof a === "boolean",
+  und: (a) => a === void 0,
+  nul: (a) => a === null,
+  arr: (a) => Array.isArray(a),
+  equ(a, b, { arrays = "shallow", objects = "reference", strict = true } = {}) {
+    if (typeof a !== typeof b || !!a !== !!b) return false;
+    if (is.str(a) || is.num(a) || is.boo(a)) return a === b;
+    const isObj = is.obj(a);
+    if (isObj && objects === "reference") return a === b;
+    const isArr = is.arr(a);
+    if (isArr && arrays === "reference") return a === b;
+    if ((isArr || isObj) && a === b) return true;
+    let i;
+    for (i in a) if (!(i in b)) return false;
+    if (isObj && arrays === "shallow" && objects === "shallow") {
+      for (i in strict ? b : a) if (!is.equ(a[i], b[i], { strict, objects: "reference" })) return false;
+    } else {
+      for (i in strict ? b : a) if (a[i] !== b[i]) return false;
     }
-    renderer.domElement.addEventListener("webglcontextlost", clearGainmapTexture, { once: true });
-  }, [extension, files, loader, multiFile, renderer.domElement]);
-  const loaderResult = useLoader$1(
-    loader,
-    multiFile ? [files] : files,
-    (loader2) => {
-      if (extension === "webp" || extension === "jpg" || extension === "jpeg") {
-        loader2.setRenderer?.(renderer);
-      }
-      loader2.setPath?.(path);
-      if (extensions) extensions(loader2);
+    if (is.und(i)) {
+      if (isArr && a.length === 0 && b.length === 0) return true;
+      if (isObj && Object.keys(a).length === 0 && Object.keys(b).length === 0) return true;
+      if (a !== b) return false;
     }
-  );
-  let texture = multiFile ? (
-    // @ts-ignore
-    loaderResult[0]
-  ) : loaderResult;
-  if (extension === "jpg" || extension === "jpeg" || extension === "webp") {
-    texture = texture.renderTarget?.texture;
-  }
-  texture.mapping = isCubemap ? CubeReflectionMapping : EquirectangularReflectionMapping;
-  texture.colorSpace = colorSpace ?? (isCubemap ? "srgb" : "srgb-linear");
-  return texture;
-}
-const preloadDefaultOptions = {
-  files: defaultFiles,
-  path: "",
-  preset: void 0,
-  extensions: void 0
-};
-useEnvironment.preload = (preloadOptions) => {
-  const options = { ...preloadDefaultOptions, ...preloadOptions };
-  let { files, path = "" } = options;
-  const { preset, extensions } = options;
-  if (preset) {
-    validatePreset(preset);
-    files = presetsObj[preset];
-    path = CUBEMAP_ROOT;
-  }
-  const { extension } = getExtension(files);
-  if (extension === "webp" || extension === "jpg" || extension === "jpeg") {
-    throw new Error("useEnvironment: Preloading gainmaps is not supported");
-  }
-  const loader = getLoader$1(extension);
-  if (!loader) throw new Error("useEnvironment: Unrecognized file extension: " + files);
-  useLoader$1.preload(loader, isArray(files) ? [files] : files, (loader2) => {
-    loader2.setPath?.(path);
-    if (extensions) extensions(loader2);
-  });
-};
-const clearDefaultOptins = {
-  files: defaultFiles,
-  preset: void 0
-};
-useEnvironment.clear = (clearOptions) => {
-  const options = { ...clearDefaultOptins, ...clearOptions };
-  let { files } = options;
-  const { preset } = options;
-  if (preset) {
-    validatePreset(preset);
-    files = presetsObj[preset];
+    return true;
   }
-  const { extension } = getExtension(files);
-  const loader = getLoader$1(extension);
-  if (!loader) throw new Error("useEnvironment: Unrecognized file extension: " + files);
-  useLoader$1.clear(loader, isArray(files) ? [files] : files);
 };
-function validatePreset(preset) {
-  if (!(preset in presetsObj)) throw new Error("Preset must be one of: " + Object.keys(presetsObj).join(", "));
+const isOrthographicCamera = (def) => def && def.isOrthographicCamera;
+const isRef$1 = (obj) => obj !== null && typeof obj === "object" && obj.hasOwnProperty("current");
+const isColorRepresentation = (value) => value != null && (typeof value === "string" || typeof value === "number" || value.isColor);
+const isObject3D = (object) => object?.isObject3D;
+const isTexture = (value) => !!value?.isTexture;
+const isVectorLike = (object) => object !== null && typeof object === "object" && "set" in object && typeof object.set === "function";
+const isCopyable = (object) => isVectorLike(object) && "copy" in object && typeof object.copy === "function";
+const hasConstructor = (object) => !!object?.constructor;
+
+function calculateDpr(dpr) {
+  const target = typeof window !== "undefined" ? window.devicePixelRatio ?? 2 : 1;
+  return Array.isArray(dpr) ? Math.min(Math.max(dpr[0], target), dpr[1]) : dpr;
 }
-function getExtension(files) {
-  const isCubemap = isArray(files) && files.length === 6;
-  const isGainmap = isArray(files) && files.length === 3 && files.some((file) => file.endsWith("json"));
-  const firstEntry = isArray(files) ? files[0] : files;
-  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();
-  return { extension, isCubemap, isGainmap };
+function getUuidPrefix(uuid) {
+  return uuid.split("-")[0];
 }
-function getLoader$1(extension) {
-  const loader = extension === "cube" ? CubeTextureLoader : extension === "hdr" ? HDRLoader : extension === "exr" ? EXRLoader : extension === "jpg" || extension === "jpeg" ? UltraHDRLoader : extension === "webp" ? GainMapLoader : null;
-  return loader;
+function updateCamera(camera, size) {
+  if (camera.manual) return;
+  if (isOrthographicCamera(camera)) {
+    camera.left = size.width / -2;
+    camera.right = size.width / 2;
+    camera.top = size.height / 2;
+    camera.bottom = size.height / -2;
+  } else {
+    camera.aspect = size.width / size.height;
+  }
+  camera.updateProjectionMatrix();
 }
-
-const isRef$1 = (obj) => obj.current && obj.current.isScene;
-const resolveScene = (scene) => isRef$1(scene) ? scene.current : scene;
-function setEnvProps(background, scene, defaultScene, texture, sceneProps = {}) {
-  sceneProps = {
-    backgroundBlurriness: 0,
-    backgroundIntensity: 1,
-    backgroundRotation: [0, 0, 0],
-    environmentIntensity: 1,
-    environmentRotation: [0, 0, 0],
-    ...sceneProps
-  };
-  const target = resolveScene(scene || defaultScene);
-  const oldbg = target.background;
-  const oldenv = target.environment;
-  const oldSceneProps = {
-    // @ts-ignore
-    backgroundBlurriness: target.backgroundBlurriness,
-    // @ts-ignore
-    backgroundIntensity: target.backgroundIntensity,
-    // @ts-ignore
-    backgroundRotation: target.backgroundRotation?.clone?.() ?? [0, 0, 0],
-    // @ts-ignore
-    environmentIntensity: target.environmentIntensity,
-    // @ts-ignore
-    environmentRotation: target.environmentRotation?.clone?.() ?? [0, 0, 0]
-  };
-  if (background !== "only") target.environment = texture;
-  if (background) target.background = texture;
-  applyProps$1(target, sceneProps);
-  return () => {
-    if (background !== "only") target.environment = oldenv;
-    if (background) target.background = oldbg;
-    applyProps$1(target, oldSceneProps);
-  };
+const frustumMatrix = new Matrix4();
+function updateFrustum(camera, frustum) {
+  const target = frustum ?? new Frustum();
+  frustumMatrix.multiplyMatrices(camera.projectionMatrix, camera.matrixWorldInverse);
+  target.setFromProjectionMatrix(frustumMatrix);
+  return target;
 }
-function EnvironmentMap({ scene, background = false, map, ...config }) {
-  const defaultScene = useThree$1((state) => state.scene);
-  React.useLayoutEffect(() => {
-    if (map) return setEnvProps(background, scene, defaultScene, map, config);
-  });
-  return null;
+
+const REACT_INTERNAL_PROPS = ["children", "key", "ref"];
+function findInitialRoot(instance) {
+  let root = instance.root;
+  while (root.getState().previousRoot) root = root.getState().previousRoot;
+  return root;
 }
-function EnvironmentCube({
-  background = false,
-  scene,
-  blur,
-  backgroundBlurriness,
-  backgroundIntensity,
-  backgroundRotation,
-  environmentIntensity,
-  environmentRotation,
-  ...rest
-}) {
-  const texture = useEnvironment(rest);
-  const defaultScene = useThree$1((state) => state.scene);
-  React.useLayoutEffect(() => {
-    return setEnvProps(background, scene, defaultScene, texture, {
-      backgroundBlurriness: blur ?? backgroundBlurriness,
-      backgroundIntensity,
-      backgroundRotation,
-      environmentIntensity,
-      environmentRotation
+function getRootState(obj) {
+  let state = obj.__r3f?.root.getState();
+  if (!state) {
+    obj.traverseAncestors((ancestor) => {
+      const parentState = ancestor.__r3f?.root.getState();
+      if (parentState) {
+        state = parentState;
+        return false;
+      }
     });
-  });
-  React.useEffect(() => {
-    return () => {
-      texture.dispose();
-    };
-  }, [texture]);
-  return null;
+  }
+  return state;
 }
-function EnvironmentPortal({
-  children,
-  near = 0.1,
-  far = 1e3,
-  resolution = 256,
-  frames = 1,
-  map,
-  background = false,
-  blur,
-  backgroundBlurriness,
-  backgroundIntensity,
-  backgroundRotation,
-  environmentIntensity,
-  environmentRotation,
-  scene,
-  files,
-  path,
-  preset = void 0,
-  extensions
-}) {
-  const renderer = useThree$1((state) => state.renderer);
-  const isLegacy = useThree$1((state) => state.isLegacy);
-  const defaultScene = useThree$1((state) => state.scene);
-  const camera = React.useRef(null);
-  const [virtualScene] = React.useState(() => new Scene());
-  const fbo = React.useMemo(() => {
-    const fbo2 = isLegacy ? new WebGLCubeRenderTarget(resolution) : new CubeRenderTarget(resolution);
-    fbo2.texture.type = HalfFloatType;
-    return fbo2;
-  }, [resolution, isLegacy]);
-  React.useEffect(() => {
-    return () => {
-      fbo.dispose();
-    };
-  }, [fbo]);
-  React.useLayoutEffect(() => {
-    if (frames === 1) {
-      const autoClear = renderer.autoClear;
-      renderer.autoClear = true;
-      camera.current.update(renderer, virtualScene);
-      renderer.autoClear = autoClear;
-    }
-    return setEnvProps(background, scene, defaultScene, fbo.texture, {
-      backgroundBlurriness: blur ?? backgroundBlurriness,
-      backgroundIntensity,
-      backgroundRotation,
-      environmentIntensity,
-      environmentRotation
+function buildGraph(object) {
+  const data = { nodes: {}, materials: {}, meshes: {} };
+  if (object) {
+    object.traverse((obj) => {
+      if (obj.name) data.nodes[obj.name] = obj;
+      if (obj.material) {
+        const material = Array.isArray(obj.material) ? obj.material[0] : obj.material;
+        const nameAlreadyUsed = data.materials[material.name];
+        let materialName = material.name;
+        if (nameAlreadyUsed) {
+          materialName = materialName + `-${getUuidPrefix(material.uuid)}`;
+          material.userData.materialCacheName = materialName;
+        }
+        data.materials[materialName] = material;
+      }
+      if (obj.isMesh && !data.meshes[obj.name]) data.meshes[obj.name] = obj;
     });
-  }, [
-    children,
-    virtualScene,
-    fbo.texture,
-    scene,
-    defaultScene,
-    background,
-    frames,
-    renderer,
-    blur,
-    backgroundBlurriness,
-    backgroundIntensity,
-    backgroundRotation,
-    environmentIntensity,
-    environmentRotation
-  ]);
-  let count = 1;
-  useFrame$1(() => {
-    if (frames === Infinity || count < frames) {
-      const autoClear = renderer.autoClear;
-      renderer.autoClear = true;
-      camera.current.update(renderer, virtualScene);
-      renderer.autoClear = autoClear;
-      count++;
-    }
-  });
-  return /* @__PURE__ */ jsx(Fragment, { children: createPortal$1(
-    /* @__PURE__ */ jsxs(Fragment, { children: [
-      children,
-      /* @__PURE__ */ jsx("cubeCamera", { ref: camera, args: [near, far, fbo] }),
-      files || preset ? /* @__PURE__ */ jsx(EnvironmentCube, { background: true, files, preset, path, extensions }) : map ? /* @__PURE__ */ jsx(EnvironmentMap, { background: true, map, extensions }) : null
-    ] }),
-    virtualScene
-  ) });
+  }
+  return data;
 }
-function EnvironmentGround(props) {
-  const textureDefault = useEnvironment(props);
-  const texture = props.map || textureDefault;
-  React.useMemo(() => extend$1({ GroundProjectedEnvImpl: GroundedSkybox }), []);
-  React.useEffect(() => {
-    return () => {
-      textureDefault.dispose();
-    };
-  }, [textureDefault]);
-  const height = props.ground?.height ?? 15;
-  const radius = props.ground?.radius ?? 60;
-  const scale = props.ground?.scale ?? 1e3;
-  const args = React.useMemo(
-    () => [texture, height, radius],
-    [texture, height, radius]
-  );
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(EnvironmentMap, { ...props, map: texture }),
-    /* @__PURE__ */ jsx("groundProjectedEnvImpl", { args, scale })
-  ] });
+function dispose(obj) {
+  if (obj.type !== "Scene") obj.dispose?.();
+  for (const p in obj) {
+    const prop = obj[p];
+    if (prop?.type !== "Scene") prop?.dispose?.();
+  }
 }
-function EnvironmentColor({ color, scene }) {
-  const defaultScene = useThree$1((state) => state.scene);
-  React.useLayoutEffect(() => {
-    if (color === void 0) return;
-    const target = resolveScene(scene || defaultScene);
-    const oldBg = target.background;
-    target.background = new Color(color);
-    return () => {
-      target.background = oldBg;
+function getInstanceProps(pendingProps) {
+  const props = {};
+  for (const key in pendingProps) {
+    if (!REACT_INTERNAL_PROPS.includes(key)) props[key] = pendingProps[key];
+  }
+  return props;
+}
+function prepare(target, root, type, props) {
+  const object = target;
+  let instance = object?.__r3f;
+  if (!instance) {
+    instance = {
+      root,
+      type,
+      parent: null,
+      children: [],
+      props: getInstanceProps(props),
+      object,
+      eventCount: 0,
+      handlers: {},
+      isHidden: false
     };
-  });
-  return null;
+    if (object) object.__r3f = instance;
+  }
+  return instance;
 }
-function EnvironmentDualSource(props) {
-  const { backgroundFiles, ...envProps } = props;
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(EnvironmentCube, { ...envProps, background: false }),
-    /* @__PURE__ */ jsx(EnvironmentCube, { ...props, files: backgroundFiles, background: "only" })
-  ] });
+function invalidateInstance(instance) {
+  if (!instance.parent) return;
+  const state = instance.root?.getState?.();
+  if (state && state.internal.frames === 0) state.invalidate();
 }
-function Environment(props) {
-  if (props.color && !props.files && !props.preset && !props.map) {
-    return /* @__PURE__ */ jsx(EnvironmentColor, { ...props });
-  }
-  if (props.backgroundFiles && props.backgroundFiles !== props.files) {
-    return /* @__PURE__ */ jsx(EnvironmentDualSource, { ...props });
+
+const tempFrustum = new Frustum();
+let hasWarnedWebGL = false;
+let tslModule = null;
+async function loadTSL() {
+  if (tslModule) return tslModule;
+  try {
+    const tsl = await import('three/tsl');
+    tslModule = { uniform: tsl.uniform, nodeObject: tsl.nodeObject };
+    return tslModule;
+  } catch {
+    return null;
   }
-  return props.ground ? /* @__PURE__ */ jsx(EnvironmentGround, { ...props }) : props.map ? /* @__PURE__ */ jsx(EnvironmentMap, { ...props }) : props.children ? /* @__PURE__ */ jsx(EnvironmentPortal, { ...props }) : /* @__PURE__ */ jsx(EnvironmentCube, { ...props });
 }
-
-var __defProp$1 = Object.defineProperty;
-var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$1 = (obj, key, value) => __defNormalProp$1(obj, typeof key !== "symbol" ? key + "" : key, value);
-const act = React["act"];
-const useIsomorphicLayoutEffect = /* @__PURE__ */ (() => typeof window !== "undefined" && (window.document?.createElement || window.navigator?.product === "ReactNative"))() ? React.useLayoutEffect : React.useEffect;
-function useMutableCallback(fn) {
-  const ref = React.useRef(fn);
-  useIsomorphicLayoutEffect(() => void (ref.current = fn), [fn]);
-  return ref;
-}
-function useBridge() {
-  const fiber = useFiber();
-  const ContextBridge = useContextBridge();
-  return React.useMemo(
-    () => ({ children }) => {
-      const strict = !!traverseFiber(fiber, true, (node) => node.type === React.StrictMode);
-      const Root = strict ? React.StrictMode : React.Fragment;
-      return /* @__PURE__ */ jsx(Root, { children: /* @__PURE__ */ jsx(ContextBridge, { children }) });
-    },
-    [fiber, ContextBridge]
-  );
-}
-function Block({ set }) {
-  useIsomorphicLayoutEffect(() => {
-    set(new Promise(() => null));
-    return () => set(false);
-  }, [set]);
-  return null;
-}
-const ErrorBoundary = /* @__PURE__ */ (() => {
-  var _a;
-  return _a = class extends React.Component {
-    constructor() {
-      super(...arguments);
-      __publicField$1(this, "state", { error: false });
-    }
-    componentDidCatch(err) {
-      this.props.set(err);
-    }
-    render() {
-      return this.state.error ? null : this.props.children;
-    }
-  }, __publicField$1(_a, "getDerivedStateFromError", () => ({ error: true })), _a;
-})();
-
-const is = {
-  obj: (a) => a === Object(a) && !is.arr(a) && typeof a !== "function",
-  fun: (a) => typeof a === "function",
-  str: (a) => typeof a === "string",
-  num: (a) => typeof a === "number",
-  boo: (a) => typeof a === "boolean",
-  und: (a) => a === void 0,
-  nul: (a) => a === null,
-  arr: (a) => Array.isArray(a),
-  equ(a, b, { arrays = "shallow", objects = "reference", strict = true } = {}) {
-    if (typeof a !== typeof b || !!a !== !!b) return false;
-    if (is.str(a) || is.num(a) || is.boo(a)) return a === b;
-    const isObj = is.obj(a);
-    if (isObj && objects === "reference") return a === b;
-    const isArr = is.arr(a);
-    if (isArr && arrays === "reference") return a === b;
-    if ((isArr || isObj) && a === b) return true;
-    let i;
-    for (i in a) if (!(i in b)) return false;
-    if (isObj && arrays === "shallow" && objects === "shallow") {
-      for (i in strict ? b : a) if (!is.equ(a[i], b[i], { strict, objects: "reference" })) return false;
-    } else {
-      for (i in strict ? b : a) if (a[i] !== b[i]) return false;
-    }
-    if (is.und(i)) {
-      if (isArr && a.length === 0 && b.length === 0) return true;
-      if (isObj && Object.keys(a).length === 0 && Object.keys(b).length === 0) return true;
-      if (a !== b) return false;
-    }
-    return true;
-  }
-};
-const isOrthographicCamera = (def) => def && def.isOrthographicCamera;
-const isRef = (obj) => obj !== null && typeof obj === "object" && obj.hasOwnProperty("current");
-const isColorRepresentation = (value) => value != null && (typeof value === "string" || typeof value === "number" || value.isColor);
-const isObject3D = (object) => object?.isObject3D;
-const isTexture = (value) => !!value?.isTexture;
-const isVectorLike = (object) => object !== null && typeof object === "object" && "set" in object && typeof object.set === "function";
-const isCopyable = (object) => isVectorLike(object) && "copy" in object && typeof object.copy === "function";
-const hasConstructor = (object) => !!object?.constructor;
-
-function calculateDpr(dpr) {
-  const target = typeof window !== "undefined" ? window.devicePixelRatio ?? 2 : 1;
-  return Array.isArray(dpr) ? Math.min(Math.max(dpr[0], target), dpr[1]) : dpr;
-}
-function getUuidPrefix(uuid) {
-  return uuid.split("-")[0];
-}
-function updateCamera(camera, size) {
-  if (camera.manual) return;
-  if (isOrthographicCamera(camera)) {
-    camera.left = size.width / -2;
-    camera.right = size.width / 2;
-    camera.top = size.height / 2;
-    camera.bottom = size.height / -2;
-  } else {
-    camera.aspect = size.width / size.height;
-  }
-  camera.updateProjectionMatrix();
-}
-const frustumMatrix = new Matrix4();
-function updateFrustum(camera, frustum) {
-  const target = frustum ?? new Frustum();
-  frustumMatrix.multiplyMatrices(camera.projectionMatrix, camera.matrixWorldInverse);
-  target.setFromProjectionMatrix(frustumMatrix);
-  return target;
-}
-
-const REACT_INTERNAL_PROPS = ["children", "key", "ref"];
-function findInitialRoot(instance) {
-  let root = instance.root;
-  while (root.getState().previousRoot) root = root.getState().previousRoot;
-  return root;
-}
-function getRootState(obj) {
-  let state = obj.__r3f?.root.getState();
-  if (!state) {
-    obj.traverseAncestors((ancestor) => {
-      const parentState = ancestor.__r3f?.root.getState();
-      if (parentState) {
-        state = parentState;
-        return false;
-      }
-    });
-  }
-  return state;
-}
-function buildGraph(object) {
-  const data = { nodes: {}, materials: {}, meshes: {} };
-  if (object) {
-    object.traverse((obj) => {
-      if (obj.name) data.nodes[obj.name] = obj;
-      if (obj.material) {
-        const material = Array.isArray(obj.material) ? obj.material[0] : obj.material;
-        const nameAlreadyUsed = data.materials[material.name];
-        let materialName = material.name;
-        if (nameAlreadyUsed) {
-          materialName = materialName + `-${getUuidPrefix(material.uuid)}`;
-          material.userData.materialCacheName = materialName;
-        }
-        data.materials[materialName] = material;
-      }
-      if (obj.isMesh && !data.meshes[obj.name]) data.meshes[obj.name] = obj;
-    });
-  }
-  return data;
-}
-function dispose(obj) {
-  if (obj.type !== "Scene") obj.dispose?.();
-  for (const p in obj) {
-    const prop = obj[p];
-    if (prop?.type !== "Scene") prop?.dispose?.();
-  }
-}
-function getInstanceProps(pendingProps) {
-  const props = {};
-  for (const key in pendingProps) {
-    if (!REACT_INTERNAL_PROPS.includes(key)) props[key] = pendingProps[key];
-  }
-  return props;
-}
-function prepare(target, root, type, props) {
-  const object = target;
-  let instance = object?.__r3f;
-  if (!instance) {
-    instance = {
-      root,
-      type,
-      parent: null,
-      children: [],
-      props: getInstanceProps(props),
-      object,
-      eventCount: 0,
-      handlers: {},
-      isHidden: false
-    };
-    if (object) object.__r3f = instance;
-  }
-  return instance;
-}
-function invalidateInstance(instance) {
-  if (!instance.parent) return;
-  instance.props.onUpdate?.(instance.object);
-  const state = instance.root?.getState?.();
-  if (state && state.internal.frames === 0) state.invalidate();
-}
-
-const tempFrustum = new Frustum();
-let hasWarnedWebGL = false;
-let tslModule = null;
-async function loadTSL() {
-  if (tslModule) return tslModule;
-  try {
-    const tsl = await import('three/tsl');
-    tslModule = { uniform: tsl.uniform, nodeObject: tsl.nodeObject };
-    return tslModule;
-  } catch {
-    return null;
-  }
-}
-function createOcclusionObserverNode(store, uniform) {
-  const node = new Node("float");
-  node.updateType = NodeUpdateType.OBJECT;
-  node.update = function(frame) {
-    const { internal } = store.getState();
-    const registry = internal.visibilityRegistry;
-    const cache = internal.occlusionCache;
-    for (const entry of registry.values()) {
-      const { object, handlers } = entry;
-      if (handlers.onOccluded || handlers.onVisible) {
-        const isOccluded = frame.renderer.isOccluded(object);
-        cache.set(object, isOccluded);
-      }
-    }
-  };
-  node.setup = function() {
-    return uniform(0);
-  };
-  return node;
+function createOcclusionObserverNode(store, uniform) {
+  const node = new Node("float");
+  node.updateType = NodeUpdateType.OBJECT;
+  node.update = function(frame) {
+    const { internal } = store.getState();
+    const registry = internal.visibilityRegistry;
+    const cache = internal.occlusionCache;
+    for (const entry of registry.values()) {
+      const { object, handlers } = entry;
+      if (handlers.onOccluded || handlers.onVisible) {
+        const isOccluded = frame.renderer.isOccluded(object);
+        cache.set(object, isOccluded);
+      }
+    }
+  };
+  node.setup = function() {
+    return uniform(0);
+  };
+  return node;
 }
 let occlusionSetupPromise = null;
 function enableOcclusion(store) {
@@ -844,8 +519,10 @@ function hasVisibilityHandlers(handlers) {
 }
 
 const FROM_REF = Symbol.for("@react-three/fiber.fromRef");
-function fromRef(ref) {
-  return { [FROM_REF]: ref };
+function fromRef(ref, transform) {
+  const marker = { [FROM_REF]: ref };
+  if (transform) marker.transform = transform;
+  return marker;
 }
 function isFromRef(value) {
   return value !== null && typeof value === "object" && FROM_REF in value;
@@ -859,56 +536,112 @@ function isOnce(value) {
   return value !== null && typeof value === "object" && ONCE in value;
 }
 
-const RESERVED_PROPS = [
-  "children",
-  "key",
-  "ref",
-  // Instance props
-  "args",
-  "dispose",
-  "attach",
-  "object",
-  "onUpdate",
-  // Behavior flags
-  "dispose"
-];
-const EVENT_REGEX = /^on(Pointer|Drag|Drop|Click|DoubleClick|ContextMenu|Wheel)/;
-const VISIBILITY_EVENT_REGEX = /^on(Framed|Occluded|Visible)$/;
-const INDEX_REGEX = /-\d+$/;
-const MEMOIZED_PROTOTYPES = /* @__PURE__ */ new Map();
-const colorMaps = ["map", "emissiveMap", "sheenColorMap", "specularColorMap", "envMap"];
-function resolve(root, key) {
-  if (!key.includes("-")) return { root, key, target: root[key] };
-  if (key in root) return { root, key, target: root[key] };
-  const originalKey = key;
-  let target = root;
-  const parts = key.split("-");
-  for (const part of parts) {
-    if (typeof target !== "object" || target === null) {
-      if (target !== void 0) {
-        const remaining = parts.slice(parts.indexOf(part)).join("-");
-        return { root: target, key: remaining, target: void 0 };
-      }
-      return { root, key: originalKey, target: void 0 };
-    }
-    key = part;
-    root = target;
-    target = target[key];
+const shownNotices = /* @__PURE__ */ new Set();
+function notifyDepreciated({ heading, body, link }) {
+  if (typeof process !== "undefined" && (process.env.NODE_ENV === "test" || process.env.JEST_WORKER_ID !== void 0) && process.env.R3F_SHOW_DEPRECATION_WARNINGS !== "true") {
+    return;
   }
-  return { root, key, target };
-}
-function attach(parent, child) {
-  if (is.str(child.props.attach)) {
-    if (INDEX_REGEX.test(child.props.attach)) {
-      const index = child.props.attach.replace(INDEX_REGEX, "");
-      const { root: root2, key: key2 } = resolve(parent.object, index);
-      if (!Array.isArray(root2[key2])) root2[key2] = [];
-    }
-    const { root, key } = resolve(parent.object, child.props.attach);
-    child.previousAttach = root[key];
-    root[key] = child.object;
-  } else if (is.fun(child.props.attach)) {
-    child.previousAttach = child.props.attach(parent.object, child.object);
+  if (shownNotices.has(heading)) return;
+  shownNotices.add(heading);
+  const caller = getCallerFrame();
+  if (caller) {
+    console.log();
+  }
+  const boxStyle = "background: #ff9800; color: #1a1a1a; padding: 8px 12px; border-radius: 4px; font-weight: 500;";
+  if (caller) {
+    console.log(`%c\u26A0\uFE0F ${heading}`, boxStyle);
+  }
+  if (body || link) {
+    let message = "";
+    if (body) message += body;
+    if (link) message += (body ? "\n\n" : "") + `More info: ${link}`;
+    console.warn(`%c${message}`, "font-weight: bold;");
+  }
+}
+function getCallerFrame(depth = 3) {
+  const stack = new Error().stack;
+  if (!stack) return null;
+  const lines = stack.split("\n");
+  const frame = lines[depth];
+  if (!frame) return null;
+  let match = frame.match(/^\s*at (?:(.+?) )?\(?(.+?):(\d+):(\d+)\)?$/);
+  if (!match) {
+    match = frame.match(/^(?:(.+?)@)?(.+?):(\d+):(\d+)$/);
+  }
+  if (!match) return null;
+  const [, fn, url, line] = match;
+  return {
+    functionName: fn ?? "<anonymous>",
+    location: formatLocation(url, Number(line))
+  };
+}
+function formatLocation(url, line) {
+  const clean = url.split("?")[0];
+  const file = clean.split("/").pop() ?? clean;
+  return `${file}:${line}`;
+}
+function notifyAlpha({ message, link }) {
+  if (typeof process !== "undefined" && (process.env.NODE_ENV === "test" || process.env.JEST_WORKER_ID !== void 0) && process.env.R3F_SHOW_ALPHA_WARNINGS !== "true") {
+    return;
+  }
+  if (shownNotices.has(message)) return;
+  shownNotices.add(message);
+  const boxStyle = "background: #6366f1; color: #ffffff; padding: 6px 10px; border-radius: 4px; font-weight: 500;";
+  console.log(`%c\u{1F52C} ${message}`, boxStyle);
+  {
+    console.log(`%cMore info: ${link}`, "color: #6366f1; font-weight: normal;");
+  }
+}
+
+const RESERVED_PROPS = [
+  "children",
+  "key",
+  "ref",
+  // Instance props
+  "args",
+  "dispose",
+  "attach",
+  "object",
+  // Behavior flags
+  "dispose"
+];
+const EVENT_REGEX = /^on(Pointer|Drag|Drop|Click|DoubleClick|ContextMenu|Wheel)/;
+const VISIBILITY_EVENT_REGEX = /^on(Framed|Occluded|Visible)$/;
+const INDEX_REGEX = /-\d+$/;
+const MEMOIZED_PROTOTYPES = /* @__PURE__ */ new Map();
+const colorMaps = ["map", "emissiveMap", "sheenColorMap", "specularColorMap", "envMap"];
+function resolve(root, key) {
+  if (!key.includes("-")) return { root, key, target: root[key] };
+  if (key in root) return { root, key, target: root[key] };
+  const originalKey = key;
+  let target = root;
+  const parts = key.split("-");
+  for (const part of parts) {
+    if (typeof target !== "object" || target === null) {
+      if (target !== void 0) {
+        const remaining = parts.slice(parts.indexOf(part)).join("-");
+        return { root: target, key: remaining, target: void 0 };
+      }
+      return { root, key: originalKey, target: void 0 };
+    }
+    key = part;
+    root = target;
+    target = target[key];
+  }
+  return { root, key, target };
+}
+function attach(parent, child) {
+  if (is.str(child.props.attach)) {
+    if (INDEX_REGEX.test(child.props.attach)) {
+      const index = child.props.attach.replace(INDEX_REGEX, "");
+      const { root: root2, key: key2 } = resolve(parent.object, index);
+      if (!Array.isArray(root2[key2])) root2[key2] = [];
+    }
+    const { root, key } = resolve(parent.object, child.props.attach);
+    child.previousAttach = root[key];
+    root[key] = child.object;
+  } else if (is.fun(child.props.attach)) {
+    child.previousAttach = child.props.attach(parent.object, child.object);
   }
 }
 function detach(parent, child) {
@@ -946,11 +679,9 @@ function diffProps(instance, newProps) {
   for (const prop in instance.props) {
     if (RESERVED_PROPS.includes(prop) || newProps.hasOwnProperty(prop)) continue;
     const { root, key } = resolve(instance.object, prop);
-    if (root.constructor && root.constructor.length === 0) {
+    if (typeof root?.constructor === "function") {
       const ctor = getMemoizedPrototype(root);
-      if (!is.und(ctor)) changedProps[key] = ctor[key];
-    } else {
-      changedProps[key] = 0;
+      if (!is.und(ctor)) changedProps[prop] = ctor[key];
     }
   }
   return changedProps;
@@ -962,6 +693,13 @@ function applyProps(object, props) {
   for (const prop in props) {
     const value = props[prop];
     if (RESERVED_PROPS.includes(prop)) continue;
+    if (prop === "onUpdate") {
+      notifyDepreciated({
+        heading: "onUpdate is no longer an R3F prop",
+        body: "v10 removed the onUpdate hook: R3F no longer calls it after prop updates. The value is assigned to the object by name. On a Texture that sets three's Texture.onUpdate, which the renderer calls after a GPU upload, not after prop changes. On a node it replaces the Node.onUpdate() method. On other objects it is never called.\n\nUse an effect keyed on the props that change, read the object in useFrame, or use a ref callback.",
+        link: "https://docs.pmnd.rs/react-three-fiber/migration/v10#onupdate-removed"
+      });
+    }
     if (instance && EVENT_REGEX.test(prop)) {
       if (typeof value === "function") instance.handlers[prop] = value;
       else delete instance.handlers[prop];
@@ -1067,635 +805,33 @@ function applyProps(object, props) {
   return object;
 }
 
-const DEFAULT_POINTER_ID = 0;
-const XR_POINTER_ID_START = 1e3;
-function getPointerState(internal, pointerId) {
-  let state = internal.pointerMap.get(pointerId);
-  if (!state) {
-    state = {
-      hovered: /* @__PURE__ */ new Map(),
-      captured: /* @__PURE__ */ new Map(),
-      initialClick: [0, 0],
-      initialHits: []
-    };
-    internal.pointerMap.set(pointerId, state);
-  }
-  return state;
-}
-function getPointerId(event) {
-  return "pointerId" in event ? event.pointerId : DEFAULT_POINTER_ID;
-}
-function makeId(event) {
-  return (event.eventObject || event.object).uuid + "/" + event.index + event.instanceId;
-}
-function releaseInternalPointerCapture(internal, obj, pointerId) {
-  const pointerState = internal.pointerMap.get(pointerId);
-  if (!pointerState) return;
-  const captureData = pointerState.captured.get(obj);
-  if (captureData) {
-    pointerState.captured.delete(obj);
-    captureData.target.releasePointerCapture(pointerId);
-  }
-}
-function removeInteractivity(store, object) {
-  const { internal } = store.getState();
-  internal.interaction = internal.interaction.filter((o) => o !== object);
-  for (const [pointerId, pointerState] of internal.pointerMap) {
-    pointerState.initialHits = pointerState.initialHits.filter((o) => o !== object);
-    pointerState.hovered.forEach((value, key) => {
-      if (value.eventObject === object || value.object === object) {
-        pointerState.hovered.delete(key);
-      }
-    });
-    if (pointerState.captured.has(object)) {
-      releaseInternalPointerCapture(internal, object, pointerId);
-    }
-  }
-  unregisterVisibility(store, object);
+const INTERNAL_LIB_MARKERS = ["zustand", "setState", "Object.assign"];
+function isInternalRendererAccess(stack, callerDepth = 2) {
+  if (!stack) return false;
+  const caller = stack.split("\n")[callerDepth] ?? "";
+  return INTERNAL_LIB_MARKERS.some((m) => caller.includes(m));
 }
-function createEvents(store) {
-  function calculateDistance(event, pointerId) {
-    const { internal } = store.getState();
-    const pointerState = internal.pointerMap.get(pointerId);
-    if (!pointerState) return 0;
-    const [initialX, initialY] = pointerState.initialClick;
-    const dx = event.offsetX - initialX;
-    const dy = event.offsetY - initialY;
-    return Math.round(Math.sqrt(dx * dx + dy * dy));
-  }
-  function filterPointerEvents(objects) {
-    return objects.filter(
-      (obj) => ["Move", "Over", "Enter", "Out", "Leave"].some(
-        (name) => obj.__r3f?.handlers["onPointer" + name]
-      ) || ["OverEnter", "OverLeave", "Over"].some(
-        (name) => obj.__r3f?.handlers["onDrag" + name]
-      ) || obj.__r3f?.handlers.onDrop
-    );
-  }
-  function intersect(event, filter) {
-    const state = store.getState();
-    const duplicates = /* @__PURE__ */ new Set();
-    const intersections = [];
-    const eventsObjects = filter ? filter(state.internal.interaction) : state.internal.interaction;
-    for (let i = 0; i < eventsObjects.length; i++) {
-      const state2 = getRootState(eventsObjects[i]);
-      if (state2) {
-        state2.raycaster.camera = void 0;
-      }
-    }
-    if (!state.previousRoot) {
-      state.events.compute?.(event, state);
-    }
-    function handleRaycast(obj) {
-      const state2 = getRootState(obj);
-      if (!state2 || !state2.events.enabled || state2.raycaster.camera === null) return [];
-      if (state2.raycaster.camera === void 0) {
-        state2.events.compute?.(event, state2, state2.previousRoot?.getState());
-        if (state2.raycaster.camera === void 0) state2.raycaster.camera = null;
-      }
-      return state2.raycaster.camera ? state2.raycaster.intersectObject(obj, true) : [];
-    }
-    let hits = eventsObjects.flatMap(handleRaycast).sort((a, b) => {
-      const aInteractivePriority = a.object.userData?.interactivePriority;
-      const bInteractivePriority = b.object.userData?.interactivePriority;
-      if (aInteractivePriority !== void 0 || bInteractivePriority !== void 0) {
-        if (aInteractivePriority !== void 0 && bInteractivePriority === void 0) return -1;
-        if (bInteractivePriority !== void 0 && aInteractivePriority === void 0) return 1;
-        if (aInteractivePriority !== bInteractivePriority) {
-          return (bInteractivePriority ?? 0) - (aInteractivePriority ?? 0);
-        }
-      }
-      const aState = getRootState(a.object);
-      const bState = getRootState(b.object);
-      const aPriority = aState?.events?.priority ?? 1;
-      const bPriority = bState?.events?.priority ?? 1;
-      return bPriority - aPriority || a.distance - b.distance;
-    }).filter((item) => {
-      const id = makeId(item);
-      if (duplicates.has(id)) return false;
-      duplicates.add(id);
-      return true;
-    });
-    if (state.events.filter) hits = state.events.filter(hits, state);
-    for (const hit of hits) {
-      let eventObject = hit.object;
-      while (eventObject) {
-        if (eventObject.__r3f?.eventCount) {
-          intersections.push({ ...hit, eventObject });
-        }
-        eventObject = eventObject.parent;
-      }
-    }
-    if ("pointerId" in event) {
-      const pointerId = event.pointerId;
-      const pointerState = state.internal.pointerMap.get(pointerId);
-      if (pointerState?.captured.size) {
-        for (const captureData of pointerState.captured.values()) {
-          if (!duplicates.has(makeId(captureData.intersection))) intersections.push(captureData.intersection);
-        }
-      }
-    }
-    return intersections;
-  }
-  function handleIntersects(intersections, event, delta, callback) {
-    if (intersections.length) {
-      const localState = { stopped: false };
-      for (const hit of intersections) {
-        const state = getRootState(hit.object);
-        if (state) {
-          const { raycaster, pointer, camera, internal } = state;
-          const unprojectedPoint = new Vector3(pointer.x, pointer.y, 0).unproject(camera);
-          const hasPointerCapture = (id) => {
-            const pointerState = internal.pointerMap.get(id);
-            return pointerState?.captured.has(hit.eventObject) ?? false;
-          };
-          const setPointerCapture = (id) => {
-            const captureData = { intersection: hit, target: event.target };
-            const pointerState = getPointerState(internal, id);
-            pointerState.captured.set(hit.eventObject, captureData);
-            event.target.setPointerCapture(id);
-          };
-          const releasePointerCapture = (id) => {
-            releaseInternalPointerCapture(internal, hit.eventObject, id);
-          };
-          const extractEventProps = {};
-          for (const prop in event) {
-            const property = event[prop];
-            if (typeof property !== "function") extractEventProps[prop] = property;
-          }
-          const eventPointerId = "pointerId" in event ? event.pointerId : void 0;
-          const raycastEvent = {
-            ...hit,
-            ...extractEventProps,
-            pointer,
-            intersections,
-            stopped: localState.stopped,
-            delta,
-            unprojectedPoint,
-            ray: raycaster.ray,
-            camera,
-            pointerId: eventPointerId,
-            // Hijack stopPropagation, which just sets a flag
-            stopPropagation() {
-              const pointerState = eventPointerId !== void 0 ? internal.pointerMap.get(eventPointerId) : void 0;
-              if (
-                // ...if this pointer hasn't been captured
-                !pointerState?.captured.size || // ... or if the hit object is capturing the pointer
-                pointerState.captured.has(hit.eventObject)
-              ) {
-                raycastEvent.stopped = localState.stopped = true;
-                if (pointerState?.hovered.size && Array.from(pointerState.hovered.values()).find((i) => i.eventObject === hit.eventObject)) {
-                  const higher = intersections.slice(0, intersections.indexOf(hit));
-                  cancelPointer([...higher, hit], eventPointerId);
-                }
-              }
-            },
-            // there should be a distinction between target and currentTarget
-            target: { hasPointerCapture, setPointerCapture, releasePointerCapture },
-            currentTarget: { hasPointerCapture, setPointerCapture, releasePointerCapture },
-            nativeEvent: event
-          };
-          callback(raycastEvent);
-          if (localState.stopped === true) break;
-        }
-      }
-    }
-    return intersections;
-  }
-  function cancelPointer(intersections, pointerId) {
-    const { internal } = store.getState();
-    const pid = pointerId ?? DEFAULT_POINTER_ID;
-    const pointerState = internal.pointerMap.get(pid);
-    if (!pointerState) return;
-    for (const [hoveredId, hoveredObj] of pointerState.hovered) {
-      if (!intersections.length || !intersections.find(
-        (hit) => hit.object === hoveredObj.object && hit.index === hoveredObj.index && hit.instanceId === hoveredObj.instanceId
-      )) {
-        const eventObject = hoveredObj.eventObject;
-        const instance = eventObject.__r3f;
-        pointerState.hovered.delete(hoveredId);
-        if (instance?.eventCount) {
-          const handlers = instance.handlers;
-          const data = { ...hoveredObj, intersections };
-          handlers.onPointerOut?.(data);
-          handlers.onPointerLeave?.(data);
-          handlers.onDragOverLeave?.(data);
-        }
-      }
-    }
-  }
-  function pointerMissed(event, objects) {
-    for (let i = 0; i < objects.length; i++) {
-      const instance = objects[i].__r3f;
-      instance?.handlers.onPointerMissed?.(event);
-    }
-  }
-  function dragOverMissed(event, objects) {
-    for (let i = 0; i < objects.length; i++) {
-      const instance = objects[i].__r3f;
-      instance?.handlers.onDragOverMissed?.(event);
-    }
-  }
-  function dropMissed(event, objects) {
-    for (let i = 0; i < objects.length; i++) {
-      const instance = objects[i].__r3f;
-      instance?.handlers.onDropMissed?.(event);
-    }
-  }
-  function cleanupPointer(pointerId) {
-    const { internal } = store.getState();
-    const pointerState = internal.pointerMap.get(pointerId);
-    if (pointerState) {
-      for (const [, hoveredObj] of pointerState.hovered) {
-        const eventObject = hoveredObj.eventObject;
-        const instance = eventObject.__r3f;
-        if (instance?.eventCount) {
-          const handlers = instance.handlers;
-          const data = { ...hoveredObj, intersections: [] };
-          handlers.onPointerOut?.(data);
-          handlers.onPointerLeave?.(data);
-        }
-      }
-      internal.pointerMap.delete(pointerId);
-    }
-    internal.pointerDirty.delete(pointerId);
-  }
-  function processDeferredPointer(event, pointerId) {
-    const state = store.getState();
-    const { internal } = state;
-    if (!state.events.enabled) return;
-    const filter = filterPointerEvents;
-    const hits = intersect(event, filter);
-    cancelPointer(hits, pointerId);
-    function onIntersect(data) {
-      const eventObject = data.eventObject;
-      const instance = eventObject.__r3f;
-      if (!instance?.eventCount) return;
-      const handlers = instance.handlers;
-      if (handlers.onPointerOver || handlers.onPointerEnter || handlers.onPointerOut || handlers.onPointerLeave) {
-        const id = makeId(data);
-        const pointerState = getPointerState(internal, pointerId);
-        const hoveredItem = pointerState.hovered.get(id);
-        if (!hoveredItem) {
-          pointerState.hovered.set(id, data);
-          handlers.onPointerOver?.(data);
-          handlers.onPointerEnter?.(data);
-        } else if (hoveredItem.stopped) {
-          data.stopPropagation();
-        }
-      }
-      handlers.onPointerMove?.(data);
-    }
-    handleIntersects(hits, event, 0, onIntersect);
-  }
-  function handlePointer(name) {
-    switch (name) {
-      case "onPointerLeave":
-      case "onDragLeave":
-        return () => cancelPointer([]);
-      // Global cancel of these events
-      case "onPointerCancel":
-        return (event) => {
-          const pointerId = getPointerId(event);
-          cleanupPointer(pointerId);
-        };
-      case "onLostPointerCapture":
-        return (event) => {
-          const { internal } = store.getState();
-          const pointerId = getPointerId(event);
-          const pointerState = internal.pointerMap.get(pointerId);
-          if (pointerState?.captured.size) {
-            requestAnimationFrame(() => {
-              const pointerState2 = internal.pointerMap.get(pointerId);
-              if (pointerState2?.captured.size) {
-                pointerState2.captured.clear();
-              }
-              cancelPointer([], pointerId);
-            });
-          }
-        };
-    }
-    return function handleEvent(event) {
-      const state = store.getState();
-      const { onPointerMissed, onDragOverMissed, onDropMissed, internal, events } = state;
-      const pointerId = getPointerId(event);
-      internal.lastEvent.current = event;
-      if (!events.enabled) return;
-      const isPointerMove = name === "onPointerMove";
-      const isDragOver = name === "onDragOver";
-      const isDrop = name === "onDrop";
-      const isClickEvent = name === "onClick" || name === "onContextMenu" || name === "onDoubleClick";
-      const isPointerDown = name === "onPointerDown";
-      const isPointerUp = name === "onPointerUp";
-      const isWheel = name === "onWheel";
-      const canDeferRaycasts = events.frameTimedRaycasts && state.frameloop === "always";
-      if (isPointerMove && canDeferRaycasts) {
-        events.compute?.(event, state);
-        internal.pointerDirty.set(pointerId, event);
-        return;
-      }
-      if (isWheel && canDeferRaycasts && !events.alwaysFireOnScroll) {
-        events.compute?.(event, state);
-        internal.pointerDirty.set(pointerId, event);
-        return;
-      }
-      if ((isClickEvent || isPointerDown || isPointerUp) && internal.pointerDirty.has(pointerId)) {
-        const deferredEvent = internal.pointerDirty.get(pointerId);
-        internal.pointerDirty.delete(pointerId);
-        processDeferredPointer(deferredEvent, pointerId);
-      }
-      const filter = isPointerMove || isDragOver || isDrop ? filterPointerEvents : void 0;
-      const hits = intersect(event, filter);
-      const delta = isClickEvent ? calculateDistance(event, pointerId) : 0;
-      if (isPointerDown) {
-        const pointerState2 = getPointerState(internal, pointerId);
-        pointerState2.initialClick = [event.offsetX, event.offsetY];
-        pointerState2.initialHits = hits.map((hit) => hit.eventObject);
-      }
-      const pointerState = internal.pointerMap.get(pointerId);
-      const initialHits = pointerState?.initialHits ?? [];
-      if (isClickEvent && !hits.length) {
-        if (delta <= 2) {
-          pointerMissed(event, internal.interaction);
-          if (onPointerMissed) onPointerMissed(event);
-        }
-      }
-      if (isDragOver && !hits.length) {
-        dragOverMissed(event, internal.interaction);
-        if (onDragOverMissed) onDragOverMissed(event);
-      }
-      if (isDrop && !hits.length) {
-        dropMissed(event, internal.interaction);
-        if (onDropMissed) onDropMissed(event);
-      }
-      if (isPointerMove || isDragOver) {
-        cancelPointer(hits, pointerId);
-      }
-      function onIntersect(data) {
-        const eventObject = data.eventObject;
-        const instance = eventObject.__r3f;
-        if (!instance?.eventCount) return;
-        const handlers = instance.handlers;
-        if (isPointerMove) {
-          if (handlers.onPointerOver || handlers.onPointerEnter || handlers.onPointerOut || handlers.onPointerLeave) {
-            const id = makeId(data);
-            const pointerState2 = getPointerState(internal, pointerId);
-            const hoveredItem = pointerState2.hovered.get(id);
-            if (!hoveredItem) {
-              pointerState2.hovered.set(id, data);
-              handlers.onPointerOver?.(data);
-              handlers.onPointerEnter?.(data);
-            } else if (hoveredItem.stopped) {
-              data.stopPropagation();
-            }
-          }
-          handlers.onPointerMove?.(data);
-        } else if (isDragOver) {
-          const id = makeId(data);
-          const pointerState2 = getPointerState(internal, pointerId);
-          const hoveredItem = pointerState2.hovered.get(id);
-          if (!hoveredItem) {
-            pointerState2.hovered.set(id, data);
-            handlers.onDragOverEnter?.(data);
-          } else if (hoveredItem.stopped) {
-            data.stopPropagation();
-          }
-          handlers.onDragOver?.(data);
-        } else if (isDrop) {
-          handlers.onDrop?.(data);
-        } else {
-          const handler = handlers[name];
-          if (handler) {
-            if (!isClickEvent || initialHits.includes(eventObject)) {
-              pointerMissed(
-                event,
-                internal.interaction.filter((object) => !initialHits.includes(object))
-              );
-              handler(data);
-            }
-          } else {
-            if (isClickEvent && initialHits.includes(eventObject)) {
-              pointerMissed(
-                event,
-                internal.interaction.filter((object) => !initialHits.includes(object))
-              );
-            }
-          }
-        }
-      }
-      handleIntersects(hits, event, delta, onIntersect);
-    };
-  }
-  function flushDeferredPointers() {
-    const { internal, events } = store.getState();
-    if (!events.frameTimedRaycasts) return;
-    for (const [pointerId, event] of internal.pointerDirty) {
-      processDeferredPointer(event, pointerId);
-    }
-    internal.pointerDirty.clear();
-  }
-  return { handlePointer, flushDeferredPointers, processDeferredPointer };
-}
-const DOM_EVENTS = {
-  onClick: ["click", false],
-  onContextMenu: ["contextmenu", false],
-  onDoubleClick: ["dblclick", false],
-  onDragEnter: ["dragenter", false],
-  onDragLeave: ["dragleave", false],
-  onDragOver: ["dragover", false],
-  onDrop: ["drop", false],
-  onWheel: ["wheel", true],
-  onPointerDown: ["pointerdown", true],
-  onPointerUp: ["pointerup", true],
-  onPointerLeave: ["pointerleave", true],
-  onPointerMove: ["pointermove", true],
-  onPointerCancel: ["pointercancel", true],
-  onLostPointerCapture: ["lostpointercapture", true]
-};
-function createPointerEvents(store) {
-  const { handlePointer, flushDeferredPointers, processDeferredPointer } = createEvents(store);
-  let nextXRPointerId = XR_POINTER_ID_START;
-  const xrPointers = /* @__PURE__ */ new Map();
-  return {
-    priority: 1,
-    enabled: true,
-    frameTimedRaycasts: true,
-    alwaysFireOnScroll: true,
-    updateOnFrame: false,
-    compute(event, state) {
-      state.pointer.set(event.offsetX / state.size.width * 2 - 1, -(event.offsetY / state.size.height) * 2 + 1);
-      state.raycaster.setFromCamera(state.pointer, state.camera);
-    },
-    connected: void 0,
-    handlers: Object.keys(DOM_EVENTS).reduce(
-      (acc, key) => ({ ...acc, [key]: handlePointer(key) }),
-      {}
-    ),
-    update: (pointerId) => {
-      const { events, internal } = store.getState();
-      if (!events.handlers) return;
-      if (pointerId !== void 0) {
-        const event = internal.pointerDirty.get(pointerId);
-        if (event) {
-          internal.pointerDirty.delete(pointerId);
-          processDeferredPointer(event, pointerId);
-        } else if (internal.lastEvent?.current) {
-          processDeferredPointer(internal.lastEvent.current, pointerId);
-        }
-      } else {
-        flushDeferredPointers();
-        if (internal.lastEvent?.current) {
-          events.handlers.onPointerMove(internal.lastEvent.current);
-        }
-      }
-    },
-    flush: () => {
-      const { events, internal } = store.getState();
-      flushDeferredPointers();
-      if (events.updateOnFrame && internal.lastEvent?.current && events.handlers) {
-        events.handlers.onPointerMove(internal.lastEvent.current);
-      }
-    },
-    connect: (target) => {
-      if (!target) return;
-      const { set, events } = store.getState();
-      events.disconnect?.();
-      set((state) => ({ events: { ...state.events, connected: target } }));
-      if (events.handlers) {
-        for (const name in events.handlers) {
-          const event = events.handlers[name];
-          const [eventName, passive] = DOM_EVENTS[name];
-          target.addEventListener(eventName, event, { passive });
-        }
-      }
-    },
-    disconnect: () => {
-      const { set, events } = store.getState();
-      if (events.connected) {
-        if (events.handlers) {
-          for (const name in events.handlers) {
-            const event = events.handlers[name];
-            const [eventName] = DOM_EVENTS[name];
-            events.connected.removeEventListener(eventName, event);
-          }
-        }
-        set((state) => ({ events: { ...state.events, connected: void 0 } }));
-      }
-    },
-    // PREVIEW (A8): the XR pointer registration API may change before stable.
-    registerPointer: (config) => {
-      const pointerId = nextXRPointerId++;
-      xrPointers.set(pointerId, config);
-      const { internal } = store.getState();
-      getPointerState(internal, pointerId);
-      return pointerId;
-    },
-    unregisterPointer: (pointerId) => {
-      xrPointers.delete(pointerId);
-      const { internal } = store.getState();
-      const pointerState = internal.pointerMap.get(pointerId);
-      if (pointerState) {
-        for (const [, hoveredObj] of pointerState.hovered) {
-          const eventObject = hoveredObj.eventObject;
-          const instance = eventObject.__r3f;
-          if (instance?.eventCount) {
-            const handlers = instance.handlers;
-            const data = { ...hoveredObj, intersections: [] };
-            handlers.onPointerOut?.(data);
-            handlers.onPointerLeave?.(data);
-          }
-        }
-        internal.pointerMap.delete(pointerId);
-      }
-      internal.pointerDirty.delete(pointerId);
-    }
-  };
-}
-
-const shownNotices = /* @__PURE__ */ new Set();
-function notifyDepreciated({ heading, body, link }) {
-  if (typeof process !== "undefined" && (process.env.NODE_ENV === "test" || process.env.JEST_WORKER_ID !== void 0) && process.env.R3F_SHOW_DEPRECATION_WARNINGS !== "true") {
-    return;
-  }
-  if (shownNotices.has(heading)) return;
-  shownNotices.add(heading);
-  const caller = getCallerFrame();
-  if (caller) {
-    console.log();
-  }
-  const boxStyle = "background: #ff9800; color: #1a1a1a; padding: 8px 12px; border-radius: 4px; font-weight: 500;";
-  if (caller) {
-    console.log(`%c\u26A0\uFE0F ${heading}`, boxStyle);
-  }
-  if (body || link) {
-    let message = "";
-    if (body) message += body;
-    if (link) message += (body ? "\n\n" : "") + `More info: ${link}`;
-    console.warn(`%c${message}`, "font-weight: bold;");
-  }
-}
-function getCallerFrame(depth = 3) {
-  const stack = new Error().stack;
-  if (!stack) return null;
-  const lines = stack.split("\n");
-  const frame = lines[depth];
-  if (!frame) return null;
-  let match = frame.match(/^\s*at (?:(.+?) )?\(?(.+?):(\d+):(\d+)\)?$/);
-  if (!match) {
-    match = frame.match(/^(?:(.+?)@)?(.+?):(\d+):(\d+)$/);
-  }
-  if (!match) return null;
-  const [, fn, url, line] = match;
-  return {
-    functionName: fn ?? "<anonymous>",
-    location: formatLocation(url, Number(line))
-  };
-}
-function formatLocation(url, line) {
-  const clean = url.split("?")[0];
-  const file = clean.split("/").pop() ?? clean;
-  return `${file}:${line}`;
-}
-function notifyAlpha({ message, link }) {
-  if (typeof process !== "undefined" && (process.env.NODE_ENV === "test" || process.env.JEST_WORKER_ID !== void 0) && process.env.R3F_SHOW_ALPHA_WARNINGS !== "true") {
-    return;
-  }
-  if (shownNotices.has(message)) return;
-  shownNotices.add(message);
-  const boxStyle = "background: #6366f1; color: #ffffff; padding: 6px 10px; border-radius: 4px; font-weight: 500;";
-  console.log(`%c\u{1F52C} ${message}`, boxStyle);
-  {
-    console.log(`%cMore info: ${link}`, "color: #6366f1; font-weight: normal;");
-  }
-}
-
-const INTERNAL_LIB_MARKERS = ["zustand", "setState", "Object.assign"];
-function isInternalRendererAccess(stack, callerDepth = 2) {
-  if (!stack) return false;
-  const caller = stack.split("\n")[callerDepth] ?? "";
-  return INTERNAL_LIB_MARKERS.some((m) => caller.includes(m));
-}
-
-const R3F_CONTEXT = Symbol.for("@react-three/fiber.context");
-const context = globalThis[R3F_CONTEXT] ?? (globalThis[R3F_CONTEXT] = React.createContext(null));
-const createStore = (invalidate, advance) => {
-  const rootStore = createWithEqualityFn((set, get) => {
-    const position = new Vector3();
-    const defaultTarget = new Vector3();
-    const tempTarget = new Vector3();
-    function getCurrentViewport(camera = get().camera, target = defaultTarget, size = get().size) {
-      const { width, height, top, left } = size;
-      const aspect = width / height;
-      if (target.isVector3) tempTarget.copy(target);
-      else tempTarget.set(...target);
-      const distance = camera.getWorldPosition(position).distanceTo(tempTarget);
-      if (isOrthographicCamera(camera)) {
-        return { width: width / camera.zoom, height: height / camera.zoom, top, left, factor: 1, distance, aspect };
-      } else {
-        const fov = camera.fov * Math.PI / 180;
-        const h = 2 * Math.tan(fov / 2) * distance;
-        const w = h * (width / height);
-        return { width: w, height: h, top, left, factor: width / w, distance, aspect };
+
+const R3F_CONTEXT = Symbol.for("@react-three/fiber.context");
+const context = globalThis[R3F_CONTEXT] ?? (globalThis[R3F_CONTEXT] = React.createContext(null));
+const createStore = (invalidate, advance) => {
+  const rootStore = createWithEqualityFn((set, get) => {
+    const position = new Vector3();
+    const defaultTarget = new Vector3();
+    const tempTarget = new Vector3();
+    function getCurrentViewport(camera = get().camera, target = defaultTarget, size = get().size) {
+      const { width, height, top, left } = size;
+      const aspect = width / height;
+      if (target.isVector3) tempTarget.copy(target);
+      else tempTarget.set(...target);
+      const distance = camera.getWorldPosition(position).distanceTo(tempTarget);
+      if (isOrthographicCamera(camera)) {
+        return { width: width / camera.zoom, height: height / camera.zoom, top, left, factor: 1, distance, aspect };
+      } else {
+        const fov = camera.fov * Math.PI / 180;
+        const h = 2 * Math.tan(fov / 2) * distance;
+        const w = h * (width / height);
+        return { width: w, height: h, top, left, factor: width / w, distance, aspect };
       }
     }
     let performanceTimeout = void 0;
@@ -1785,7 +921,7 @@ const createStore = (invalidate, advance) => {
                 size: newSize,
                 viewport: { ...s.viewport, ...getCurrentViewport(state2.camera, defaultTarget, newSize) }
               }));
-              getScheduler().invalidate();
+              get().invalidate();
             }
           }
           return;
@@ -1800,15 +936,16 @@ const createStore = (invalidate, advance) => {
           viewport: { ...s.viewport, ...getCurrentViewport(state2.camera, defaultTarget, size) },
           _sizeImperative: true
         }));
-        getScheduler().invalidate();
+        get().invalidate();
       },
       setDpr: (dpr) => set((state2) => {
         const resolved = calculateDpr(dpr);
         return { viewport: { ...state2.viewport, dpr: resolved, initialDpr: state2.viewport.initialDpr || resolved } };
       }),
       setFrameloop: (frameloop = "always") => {
+        const rootId = get().internal.rootId;
+        if (rootId) getScheduler().setRootFrameloop(rootId, frameloop);
         set(() => ({ frameloop }));
-        getScheduler().frameloop = frameloop;
       },
       setError: (error) => set(() => ({ error })),
       error: null,
@@ -1924,17 +1061,11 @@ const createStore = (invalidate, advance) => {
       oldSize = size;
       oldDpr = viewport.dpr;
       updateCamera(camera, size);
-      if (internal.isSecondary && canvasTarget) {
-        if (viewport.dpr > 0) canvasTarget.setPixelRatio(viewport.dpr);
-        canvasTarget.setSize(size.width, size.height, false);
-      } else {
-        if (viewport.dpr > 0) actualRenderer.setPixelRatio(viewport.dpr);
-        actualRenderer.setSize(size.width, size.height, false);
-        if (canvasTarget) {
-          if (viewport.dpr > 0) canvasTarget.setPixelRatio(viewport.dpr);
-          canvasTarget.setSize(size.width, size.height, false);
-        }
-      }
+      const resizeTarget = canvasTarget ?? actualRenderer;
+      if (viewport.dpr > 0) resizeTarget.setPixelRatio(viewport.dpr);
+      resizeTarget.setSize(size.width, size.height, false);
+      const activeTarget = actualRenderer.getCanvasTarget?.();
+      if (!canvasTarget || activeTarget !== canvasTarget) internal.canvasTargetSizeDirty = true;
     }
     if (camera !== oldCamera) {
       oldCamera = camera;
@@ -1955,7 +1086,7 @@ const createStore = (invalidate, advance) => {
 
 const memoizedLoaders = /* @__PURE__ */ new WeakMap();
 const isConstructor$1 = (value) => typeof value === "function" && value?.prototype?.constructor === value;
-function getLoader(Proto) {
+function getLoader$1(Proto) {
   if (isConstructor$1(Proto)) {
     let loader = memoizedLoaders.get(Proto);
     if (!loader) {
@@ -1968,7 +1099,7 @@ function getLoader(Proto) {
 }
 function loadingFn(extensions, onProgress) {
   return function(Proto, input) {
-    const loader = getLoader(Proto);
+    const loader = getLoader$1(Proto);
     if (extensions) extensions(loader);
     if ("loadAsync" in loader && typeof loader.loadAsync === "function") {
       return loader.loadAsync(input, onProgress).then((data) => {
@@ -1996,7 +1127,11 @@ function useLoader(loader, input, extensions, onProgress, cacheKey) {
   const results = cacheKeys.map(
     (key, index) => suspend(() => fn(loader, inputs[index]), [loader, key], { equal: is.equ })
   );
-  return Array.isArray(input) ? results : results[0];
+  const stableRef = useRef(null);
+  const previous = stableRef.current;
+  const stable = previous !== null && previous.length === results.length && previous.every((value, i) => value === results[i]) ? previous : results;
+  stableRef.current = stable;
+  return Array.isArray(input) ? stable : stable[0];
 }
 useLoader.preload = function(loader, input, extensions, onProgress, cacheKey) {
   const inputs = Array.isArray(input) ? input : [input];
@@ -2009,9 +1144,9 @@ useLoader.clear = function(loader, input, cacheKey) {
   const cacheKeys = Array.isArray(cacheKey ?? input) ? cacheKey ?? input : [cacheKey ?? input];
   cacheKeys.forEach((key) => clear([loader, key]));
 };
-useLoader.loader = getLoader;
+useLoader.loader = getLoader$1;
 
-function useFrame(callback, priorityOrOptions) {
+function useFrame$1(callback, priorityOrOptions) {
   const store = React.useContext(context);
   const isInsideCanvas = store !== null;
   const scheduler = getScheduler();
@@ -2116,6 +1251,13 @@ function useFrame(callback, priorityOrOptions) {
        * Use for controlling the entire frame loop, adding phases, etc.
        */
       scheduler: scheduler2,
+      /**
+       * The root that currently owns this job. Resolve on access because ambient
+       * jobs can be adopted by a Canvas after the controls object is created.
+       */
+      get rootId() {
+        return getScheduler().getJobRootId(id);
+      },
       /**
        * Manually step this job only.
        * Bypasses FPS limiting - always runs.
@@ -2132,6 +1274,14 @@ function useFrame(callback, priorityOrOptions) {
       stepAll: (timestamp) => {
         getScheduler().step(timestamp);
       },
+      /**
+       * Request frames for this job's owning root without waking sibling roots.
+       */
+      invalidate: (frames, stackFrames) => {
+        const scheduler3 = getScheduler();
+        const rootId = scheduler3.getJobRootId(id);
+        if (rootId) scheduler3.invalidateRoot(rootId, frames, stackFrames);
+      },
       /**
        * Pause this job (set enabled=false).
        * Job remains registered but won't run.
@@ -2161,6 +1311,11 @@ function getUrls(input) {
   if (Array.isArray(input)) return input;
   return Object.values(input);
 }
+function inputSignature(input) {
+  if (typeof input === "string") return input;
+  if (Array.isArray(input)) return input.join("\0");
+  return Object.keys(input).sort().map((key) => `${key}\0${input[key]}`).join("
");
+}
 function allUrlsCached(urls, textureCache) {
   return urls.every((url) => textureCache.has(url));
 }
@@ -2179,31 +1334,44 @@ function buildFromCache(input, textureCache) {
   }
 }
 function useTexture(input, optionsOrOnLoad) {
-  const renderer = useThree((state) => state.internal.actualRenderer);
+  const renderer = useThree$1((state) => state.internal.actualRenderer);
   const store = useStore();
   const options = typeof optionsOrOnLoad === "function" ? { onLoad: optionsOrOnLoad } : optionsOrOnLoad ?? {};
   const { onLoad, cache = true } = options;
   const onLoadRef = useRef(onLoad);
   onLoadRef.current = onLoad;
   const onLoadCalledForRef = useRef(null);
-  const urls = useMemo(() => getUrls(input), [input]);
+  const inputKey = useMemo(() => inputSignature(input), [input]);
+  const stableInput = useMemo(() => input, [inputKey]);
+  const urls = useMemo(() => getUrls(stableInput), [stableInput]);
   const cachedResult = useMemo(() => {
     if (!cache) return null;
     const textures = store.getState().textures;
     if (!allUrlsCached(urls, textures)) return null;
-    return buildFromCache(input, textures);
-  }, [cache, urls, input, store]);
+    return buildFromCache(stableInput, textures);
+  }, [cache, urls, stableInput, store]);
   const loadedTextures = useLoader(
     TextureLoader,
-    IsObject(input) ? Object.values(input) : input
+    IsObject(stableInput) ? Object.values(stableInput) : stableInput
   );
-  const inputKey = urls.join("\0");
+  const mappedTextures = useMemo(() => {
+    if (cachedResult) return cachedResult;
+    if (IsObject(stableInput)) {
+      const keyed = {};
+      const textureArray = loadedTextures;
+      let i = 0;
+      for (const key in stableInput) keyed[key] = textureArray[i++];
+      return keyed;
+    } else {
+      return loadedTextures;
+    }
+  }, [stableInput, loadedTextures, cachedResult]);
   useLayoutEffect(() => {
     if (cachedResult) return;
     if (onLoadCalledForRef.current === inputKey) return;
     onLoadCalledForRef.current = inputKey;
-    onLoadRef.current?.(loadedTextures);
-  }, [cachedResult, loadedTextures, inputKey]);
+    onLoadRef.current?.(mappedTextures);
+  }, [cachedResult, mappedTextures, inputKey]);
   useEffect(() => {
     if (cachedResult) return;
     if ("initTexture" in renderer) {
@@ -2222,30 +1390,18 @@ function useTexture(input, optionsOrOnLoad) {
       });
     }
   }, [renderer, loadedTextures, cachedResult]);
-  const mappedTextures = useMemo(() => {
-    if (cachedResult) return cachedResult;
-    if (IsObject(input)) {
-      const keyed = {};
-      const textureArray = loadedTextures;
-      let i = 0;
-      for (const key in input) keyed[key] = textureArray[i++];
-      return keyed;
-    } else {
-      return loadedTextures;
-    }
-  }, [input, loadedTextures, cachedResult]);
   useEffect(() => {
     if (!cache) return;
     const urlTextureMap = [];
-    if (typeof input === "string") {
-      urlTextureMap.push([input, mappedTextures]);
-    } else if (Array.isArray(input)) {
+    if (typeof stableInput === "string") {
+      urlTextureMap.push([stableInput, mappedTextures]);
+    } else if (Array.isArray(stableInput)) {
       const textureArray = mappedTextures;
-      input.forEach((url, i) => urlTextureMap.push([url, textureArray[i]]));
-    } else if (IsObject(input)) {
+      stableInput.forEach((url, i) => urlTextureMap.push([url, textureArray[i]]));
+    } else if (IsObject(stableInput)) {
       const textureRecord = mappedTextures;
-      for (const key in input) {
-        const url = input[key];
+      for (const key in stableInput) {
+        const url = stableInput[key];
         urlTextureMap.push([url, textureRecord[key]]);
       }
     }
@@ -2274,7 +1430,7 @@ function useTexture(input, optionsOrOnLoad) {
       }
       return { _textureRefs: refs };
     });
-  }, [cache, input, mappedTextures, store]);
+  }, [cache, stableInput, mappedTextures, store]);
   return mappedTextures;
 }
 useTexture.preload = (url) => useLoader.preload(TextureLoader, url);
@@ -2345,13 +1501,13 @@ function useTextures(selector) {
     };
   }, [store]);
   const subscribe = selector ? () => selector(registry) : (state) => state.textures;
-  const selected = useThree(subscribe);
+  const selected = useThree$1(subscribe);
   return selector ? selected : registry;
 }
 
 function useRenderTarget(widthOrOptions, heightOrOptions, options) {
-  const isLegacy = useThree((s) => s.isLegacy);
-  const size = useThree((s) => s.size);
+  const isLegacy = useThree$1((s) => s.isLegacy);
+  const size = useThree$1((s) => s.size);
   let width;
   let height;
   let opts;
@@ -2376,12 +1532,133 @@ function useRenderTarget(widthOrOptions, heightOrOptions, options) {
   }, [width, height, size.width, size.height, opts, isLegacy]);
 }
 
+const presetsObj = {
+  apartment: "lebombo_1k.hdr",
+  city: "potsdamer_platz_1k.hdr",
+  dawn: "kiara_1_dawn_1k.hdr",
+  forest: "forest_slope_1k.hdr",
+  lobby: "st_fagans_interior_1k.hdr",
+  night: "dikhololo_night_1k.hdr",
+  park: "rooitou_park_1k.hdr",
+  studio: "studio_small_03_1k.hdr",
+  sunset: "venice_sunset_1k.hdr",
+  warehouse: "empty_warehouse_01_1k.hdr"
+};
+
+const CUBEMAP_ROOT = "https://raw.githack.com/pmndrs/drei-assets/456060a26bbeb8fdf79326f224b6d99b8bcce736/hdri/";
+const isArray = (arr) => Array.isArray(arr);
+const defaultFiles = ["/px.png", "/nx.png", "/py.png", "/ny.png", "/pz.png", "/nz.png"];
+function useEnvironment({
+  files = defaultFiles,
+  path = "",
+  preset = void 0,
+  colorSpace = void 0,
+  extensions
+} = {}) {
+  if (preset) {
+    validatePreset(preset);
+    files = presetsObj[preset];
+    path = CUBEMAP_ROOT;
+  }
+  const multiFile = isArray(files);
+  const { extension, isCubemap } = getExtension(files);
+  const loader = getLoader(extension);
+  if (!loader) throw new Error("useEnvironment: Unrecognized file extension: " + files);
+  const renderer = useThree$1((state) => state.renderer);
+  useLayoutEffect(() => {
+    if (extension !== "webp" && extension !== "jpg" && extension !== "jpeg") return;
+    function clearGainmapTexture() {
+      useLoader.clear(loader, multiFile ? [files] : files);
+    }
+    renderer.domElement.addEventListener("webglcontextlost", clearGainmapTexture, { once: true });
+  }, [extension, files, loader, multiFile, renderer.domElement]);
+  const loaderResult = useLoader(
+    loader,
+    multiFile ? [files] : files,
+    (loader2) => {
+      if (extension === "webp" || extension === "jpg" || extension === "jpeg") {
+        loader2.setRenderer?.(renderer);
+      }
+      loader2.setPath?.(path);
+      if (extensions) extensions(loader2);
+    }
+  );
+  let texture = multiFile ? (
+    // @ts-ignore
+    loaderResult[0]
+  ) : loaderResult;
+  if (extension === "jpg" || extension === "jpeg" || extension === "webp") {
+    texture = texture.renderTarget?.texture;
+  }
+  texture.mapping = isCubemap ? CubeReflectionMapping : EquirectangularReflectionMapping;
+  texture.colorSpace = colorSpace ?? (isCubemap && extension !== "hdr-cube" ? "srgb" : "srgb-linear");
+  return texture;
+}
+const preloadDefaultOptions = {
+  files: defaultFiles,
+  path: "",
+  preset: void 0,
+  extensions: void 0
+};
+useEnvironment.preload = (preloadOptions) => {
+  const options = { ...preloadDefaultOptions, ...preloadOptions };
+  let { files, path = "" } = options;
+  const { preset, extensions } = options;
+  if (preset) {
+    validatePreset(preset);
+    files = presetsObj[preset];
+    path = CUBEMAP_ROOT;
+  }
+  const { extension } = getExtension(files);
+  if (extension === "webp" || extension === "jpg" || extension === "jpeg") {
+    throw new Error("useEnvironment: Preloading gainmaps is not supported");
+  }
+  const loader = getLoader(extension);
+  if (!loader) throw new Error("useEnvironment: Unrecognized file extension: " + files);
+  useLoader.preload(loader, isArray(files) ? [files] : files, (loader2) => {
+    loader2.setPath?.(path);
+    if (extensions) extensions(loader2);
+  });
+};
+const clearDefaultOptins = {
+  files: defaultFiles,
+  preset: void 0
+};
+useEnvironment.clear = (clearOptions) => {
+  const options = { ...clearDefaultOptins, ...clearOptions };
+  let { files } = options;
+  const { preset } = options;
+  if (preset) {
+    validatePreset(preset);
+    files = presetsObj[preset];
+  }
+  const { extension } = getExtension(files);
+  const loader = getLoader(extension);
+  if (!loader) throw new Error("useEnvironment: Unrecognized file extension: " + files);
+  useLoader.clear(loader, isArray(files) ? [files] : files);
+};
+function validatePreset(preset) {
+  if (!(preset in presetsObj)) throw new Error("Preset must be one of: " + Object.keys(presetsObj).join(", "));
+}
+function getExtension(files) {
+  const isCubemap = isArray(files) && files.length === 6;
+  const isGainmap = isArray(files) && files.length === 3 && files.some((file) => file.endsWith("json"));
+  const firstEntry = isArray(files) ? files[0] : files;
+  const firstExtension = firstEntry.split(".").pop()?.split("?")?.shift()?.toLowerCase();
+  const extension = isCubemap ? firstExtension === "hdr" ? "hdr-cube" : "cube" : isGainmap ? "webp" : firstEntry.startsWith("data:application/exr") ? "exr" : firstEntry.startsWith("data:application/hdr") ? "hdr" : firstEntry.startsWith("data:image/jpeg") ? "jpg" : firstExtension;
+  return { extension, isCubemap, isGainmap };
+}
+function getLoader(extension) {
+  const loader = extension === "cube" ? CubeTextureLoader : extension === "hdr-cube" ? HDRCubeTextureLoader : extension === "hdr" ? HDRLoader : extension === "exr" ? EXRLoader : extension === "jpg" || extension === "jpeg" ? UltraHDRLoader : extension === "webp" ? GainMapLoader : null;
+  return loader;
+}
+
 function useStore() {
   const store = useContext(context);
   if (!store) throw new Error("R3F: Hooks can only be used within the Canvas component!");
   return store;
 }
-function useThree(selector = (state) => state, equalityFn) {
+function useThree$1(selector = (state) => state, equalityFn) {
   return useStore()(selector, equalityFn);
 }
 function useInstanceHandle(ref) {
@@ -2393,6 +1670,8 @@ function useGraph(object) {
   return useMemo(() => buildGraph(object), [object]);
 }
 
+const t = 1, o = 8, r = 32, e = 2, i$1 = 268435456;
+
 let effectId = 0;
 function addEffect(callback) {
   notifyDepreciated({
@@ -2421,22 +1700,28 @@ function addTail(callback) {
   return getScheduler().onIdle(callback);
 }
 function invalidate(state, frames = 1, stackFrames = false) {
-  getScheduler().invalidate(frames, stackFrames);
+  const rootId = state?.internal?.rootId;
+  const scheduler = getScheduler();
+  if (rootId) scheduler.invalidateRoot(rootId, frames, stackFrames);
+  else scheduler.invalidate(frames, stackFrames);
 }
-function advance(timestamp) {
-  getScheduler().step(timestamp);
+function advance(timestamp, runGlobalEffects, state) {
+  const rootId = state?.internal?.rootId;
+  const scheduler = getScheduler();
+  if (rootId) scheduler.stepRoot(rootId, timestamp);
+  else scheduler.step(timestamp);
 }
 
-const version = "10.0.0-alpha.3";
+const version = "10.0.0-alpha.5";
 const packageData = {
 	version: version};
 
 function Xb(Tt) {
   return Tt && Tt.__esModule && Object.prototype.hasOwnProperty.call(Tt, "default") ? Tt.default : Tt;
 }
-var Rm = { exports: {} }, Og = { exports: {} }, _b;
+var Rm = { exports: {} }, Og = { exports: {} }, _b$1;
 function Kb() {
-  return _b || (_b = 1, (function(Tt) {
+  return _b$1 || (_b$1 = 1, (function(Tt) {
     Tt.exports = function(m) {
       function Yn(t, r, a, l) {
         return new uc(t, r, a, l);
@@ -13291,399 +12576,982 @@ Check the top-level render call using <` + i + ">.");
         var o = x.H;
         x.H = $o;
         try {
-          return Vi(e, n);
+          return Vi(e, n);
+        } finally {
+          x.H = o;
+        }
+      }, useReducer: function(e, n, o) {
+        z = "useReducer", D(), N();
+        var i = x.H;
+        x.H = $o;
+        try {
+          return Br(e, n, o);
+        } finally {
+          x.H = i;
+        }
+      }, useRef: function() {
+        return z = "useRef", D(), N(), xe().memoizedState;
+      }, useState: function() {
+        z = "useState", D(), N();
+        var e = x.H;
+        x.H = $o;
+        try {
+          return Br(gr);
+        } finally {
+          x.H = e;
+        }
+      }, useDebugValue: function() {
+        z = "useDebugValue", D(), N();
+      }, useDeferredValue: function(e, n) {
+        return z = "useDeferredValue", D(), N(), nc(e, n);
+      }, useTransition: function() {
+        return z = "useTransition", D(), N(), Qp();
+      }, useSyncExternalStore: function(e, n, o) {
+        return z = "useSyncExternalStore", D(), N(), ta(e, n, o);
+      }, useId: function() {
+        return z = "useId", D(), N(), xe().memoizedState;
+      }, useFormState: function(e) {
+        return z = "useFormState", D(), N(), hs(e);
+      }, useActionState: function(e) {
+        return z = "useActionState", D(), N(), hs(e);
+      }, useOptimistic: function(e, n) {
+        return z = "useOptimistic", D(), N(), rf(e, n);
+      }, useMemoCache: function(e) {
+        return D(), Oa(e);
+      }, useHostTransitionStatus: ia, useCacheRefresh: function() {
+        return z = "useCacheRefresh", N(), xe().memoizedState;
+      }, useEffectEvent: function(e) {
+        return z = "useEffectEvent", D(), N(), oa(e);
+      } }, dm = { readContext: function(e) {
+        return Ce(), Ee(e);
+      }, use: function(e) {
+        return D(), we(e);
+      }, useCallback: function(e, n) {
+        return z = "useCallback", D(), N(), Ma(e, n);
+      }, useContext: function(e) {
+        return z = "useContext", D(), N(), Ee(e);
+      }, useEffect: function(e, n) {
+        z = "useEffect", D(), N(), Qn(2048, Ut, e, n);
+      }, useImperativeHandle: function(e, n, o) {
+        return z = "useImperativeHandle", D(), N(), aa(e, n, o);
+      }, useInsertionEffect: function(e, n) {
+        return z = "useInsertionEffect", D(), N(), Qn(4, Wt, e, n);
+      }, useLayoutEffect: function(e, n) {
+        return z = "useLayoutEffect", D(), N(), Qn(4, Rr, e, n);
+      }, useMemo: function(e, n) {
+        z = "useMemo", D(), N();
+        var o = x.H;
+        x.H = $o;
+        try {
+          return Vi(e, n);
+        } finally {
+          x.H = o;
+        }
+      }, useReducer: function(e, n, o) {
+        z = "useReducer", D(), N();
+        var i = x.H;
+        x.H = $o;
+        try {
+          return Qi(e, n, o);
+        } finally {
+          x.H = i;
+        }
+      }, useRef: function() {
+        return z = "useRef", D(), N(), xe().memoizedState;
+      }, useState: function() {
+        z = "useState", D(), N();
+        var e = x.H;
+        x.H = $o;
+        try {
+          return Qi(gr);
+        } finally {
+          x.H = e;
+        }
+      }, useDebugValue: function() {
+        z = "useDebugValue", D(), N();
+      }, useDeferredValue: function(e, n) {
+        return z = "useDeferredValue", D(), N(), sf(e, n);
+      }, useTransition: function() {
+        return z = "useTransition", D(), N(), Ro();
+      }, useSyncExternalStore: function(e, n, o) {
+        return z = "useSyncExternalStore", D(), N(), ta(e, n, o);
+      }, useId: function() {
+        return z = "useId", D(), N(), xe().memoizedState;
+      }, useFormState: function(e) {
+        return z = "useFormState", D(), N(), $t(e);
+      }, useActionState: function(e) {
+        return z = "useActionState", D(), N(), $t(e);
+      }, useOptimistic: function(e, n) {
+        return z = "useOptimistic", D(), N(), of(e, n);
+      }, useMemoCache: function(e) {
+        return D(), Oa(e);
+      }, useHostTransitionStatus: ia, useCacheRefresh: function() {
+        return z = "useCacheRefresh", N(), xe().memoizedState;
+      }, useEffectEvent: function(e) {
+        return z = "useEffectEvent", D(), N(), oa(e);
+      } };
+      var Fy = {}, Hy = /* @__PURE__ */ new Set(), Ay = /* @__PURE__ */ new Set(), jy = /* @__PURE__ */ new Set(), Dy = /* @__PURE__ */ new Set(), Wy = /* @__PURE__ */ new Set(), Uy = /* @__PURE__ */ new Set(), By = /* @__PURE__ */ new Set(), Oy = /* @__PURE__ */ new Set(), My = /* @__PURE__ */ new Set(), Qy = /* @__PURE__ */ new Set();
+      Object.freeze(Fy);
+      var zg = { enqueueSetState: function(e, n, o) {
+        e = e._reactInternals;
+        var i = Nt(e), s = zo(i);
+        s.payload = n, o != null && (df(o), s.callback = o), n = Mt(e, s, i), n !== null && (ur(i, "this.setState()", e), We(n, e, i), Bi(n, e, i));
+      }, enqueueReplaceState: function(e, n, o) {
+        e = e._reactInternals;
+        var i = Nt(e), s = zo(i);
+        s.tag = Cy, s.payload = n, o != null && (df(o), s.callback = o), n = Mt(e, s, i), n !== null && (ur(i, "this.replaceState()", e), We(n, e, i), Bi(n, e, i));
+      }, enqueueForceUpdate: function(e, n) {
+        e = e._reactInternals;
+        var o = Nt(e), i = zo(o);
+        i.tag = Ty, n != null && (df(n), i.callback = n), n = Mt(e, i, o), n !== null && (ur(o, "this.forceUpdate()", e), We(n, e, o), Bi(n, e, o));
+      } }, bd = null, Cg = null, Tg = Error("This is not a real error. It's an implementation detail of React's selective hydration feature. If this leaks into userspace, it's a bug in React. Please file an issue."), Cn = false, $y = {}, Vy = {}, qy = {}, Gy = {}, vd = false, Jy = {}, fm = {}, _g = { dehydrated: null, treeContext: null, retryLane: 0, hydrationErrors: null }, Zy = false, Yy = null;
+      Yy = /* @__PURE__ */ new Set();
+      var Si = false, Tn = false, Rg = false, Xy = typeof WeakSet == "function" ? WeakSet : Set, Gn = null, Sd = null, kd = null, _n = null, nr = false, Vo = null, Wn = false, wd = 8192, Vb = { getCacheForType: function(e) {
+        var n = Ee(un), o = n.data.get(e);
+        return o === void 0 && (o = e(), n.data.set(e, o)), o;
+      }, cacheSignal: function() {
+        return Ee(un).controller.signal;
+      }, getOwner: function() {
+        return di;
+      } }, pm = 0, hm = 1, mm = 2, gm = 3, ym = 4;
+      if (typeof Symbol == "function" && Symbol.for) {
+        var bp = Symbol.for;
+        pm = bp("selector.component"), hm = bp("selector.has_pseudo_class"), mm = bp("selector.role"), gm = bp("selector.test_id"), ym = bp("selector.text");
+      }
+      var bm = [], qb = typeof WeakMap == "function" ? WeakMap : Map, Jn = 0, Zn = 2, uo = 4, ki = 0, vp = 1, iu = 2, vm = 3, Tl = 4, Sm = 6, Ky = 5, ye = Jn, je = null, se = null, ae = 0, tr = 0, km = 1, lu = 2, Sp = 3, eb = 4, Eg = 5, kp = 6, wm = 7, Ig = 8, su = 9, Le = tr, Er = null, _l = false, Pd = false, Lg = false, Ta = 0, nn = ki, Rl = 0, El = 0, Ng = 0, rr = 0, uu = 0, wp = null, Bt = null, Pm = false, xm = 0, nb = 0, tb = 300, Pp = 1 / 0, Fg = 500, xp = null, gn = null, Il = null, zm = 0, Hg = 1, Ag = 2, rb = 3, Ll = 0, ob = 1, ab = 2, ib = 3, lb = 4, Cm = 5, Rn = 0, Nl = null, xd = null, qo = 0, jg = 0, Dg = -0, Wg = null, sb = null, ub = null, Go = zm, cb = null, Gb = 50, zp = 0, Ug = null, Bg = false, Tm = false, Jb = 50, cu = 0, Cp = null, zd = false, _m = null, db = false, fb = /* @__PURE__ */ new Set(), Zb = {}, co = null, Cd = null, pb = false;
+      try {
+        var o0 = Object.preventExtensions({});
+      } catch {
+        pb = true;
+      }
+      var hb = false, mb = {}, gb = null, yb = null, bb = null, vb = null, Sb = null, kb = null, wb = null, Pb = null, xb = null, zb = null;
+      return gb = function(e, n, o, i) {
+        n = Yn(e, n), n !== null && (o = _d(n.memoizedState, o, 0, i), n.memoizedState = o, n.baseState = o, e.memoizedProps = ze({}, e.memoizedProps), o = On(e, 2), o !== null && We(o, e, 2));
+      }, yb = function(e, n, o) {
+        n = Yn(e, n), n !== null && (o = du(n.memoizedState, o, 0), n.memoizedState = o, n.baseState = o, e.memoizedProps = ze({}, e.memoizedProps), o = On(e, 2), o !== null && We(o, e, 2));
+      }, bb = function(e, n, o, i) {
+        n = Yn(e, n), n !== null && (o = F(n.memoizedState, o, i), n.memoizedState = o, n.baseState = o, e.memoizedProps = ze({}, e.memoizedProps), o = On(e, 2), o !== null && We(o, e, 2));
+      }, vb = function(e, n, o) {
+        e.pendingProps = _d(e.memoizedProps, n, 0, o), e.alternate && (e.alternate.pendingProps = e.pendingProps), n = On(e, 2), n !== null && We(n, e, 2);
+      }, Sb = function(e, n) {
+        e.pendingProps = du(e.memoizedProps, n, 0), e.alternate && (e.alternate.pendingProps = e.pendingProps), n = On(e, 2), n !== null && We(n, e, 2);
+      }, kb = function(e, n, o) {
+        e.pendingProps = F(e.memoizedProps, n, o), e.alternate && (e.alternate.pendingProps = e.pendingProps), n = On(e, 2), n !== null && We(n, e, 2);
+      }, wb = function(e) {
+        var n = On(e, 2);
+        n !== null && We(n, e, 2);
+      }, Pb = function(e) {
+        var n = ut(), o = On(e, n);
+        o !== null && We(o, e, n);
+      }, xb = function(e) {
+        pu = e;
+      }, zb = function(e) {
+        fu = e;
+      }, le.attemptContinuousHydration = function(e) {
+        if (e.tag === 13 || e.tag === 31) {
+          var n = On(e, 67108864);
+          n !== null && We(n, e, 67108864), rl(e, 67108864);
+        }
+      }, le.attemptHydrationAtCurrentPriority = function(e) {
+        if (e.tag === 13 || e.tag === 31) {
+          var n = Nt(e);
+          n = Xo(n);
+          var o = On(e, n);
+          o !== null && We(o, e, n), rl(e, n);
+        }
+      }, le.attemptSynchronousHydration = function(e) {
+        switch (e.tag) {
+          case 3:
+            if (e = e.stateNode, e.current.memoizedState.isDehydrated) {
+              var n = _t(e.pendingLanes);
+              if (n !== 0) {
+                for (e.pendingLanes |= 2, e.entangledLanes |= 2; n; ) {
+                  var o = 1 << 31 - vn(n);
+                  e.entanglements[1] |= o, n &= ~o;
+                }
+                Kn(e), (ye & (Zn | uo)) === Jn && (Pp = me() + Fg, Wa(0));
+              }
+            }
+            break;
+          case 31:
+          case 13:
+            n = On(e, 2), n !== null && We(n, e, 2), Ls(), rl(e, 2);
+        }
+      }, le.batchedUpdates = function(e, n) {
+        return e(n);
+      }, le.createComponentSelector = function(e) {
+        return { $$typeof: pm, value: e };
+      }, le.createContainer = function(e, n, o, i, s, u, f, p, g, S) {
+        return Ka(e, n, false, null, o, i, u, null, f, p, g, S);
+      }, le.createHasPseudoClassSelector = function(e) {
+        return { $$typeof: hm, value: e };
+      }, le.createHydrationContainer = function(e, n, o, i, s, u, f, p, g, S, T, _, I, O) {
+        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;
+      }, le.createPortal = function(e, n, o) {
+        var i = 3 < arguments.length && arguments[3] !== void 0 ? arguments[3] : null;
+        try {
+          vt(i);
+          var s = false;
+        } catch {
+          s = true;
+        }
+        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 };
+      }, le.createRoleSelector = function(e) {
+        return { $$typeof: mm, value: e };
+      }, le.createTestNameSelector = function(e) {
+        return { $$typeof: gm, value: e };
+      }, le.createTextSelector = function(e) {
+        return { $$typeof: ym, value: e };
+      }, le.defaultOnCaughtError = function(e) {
+        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") + ".");
+        typeof e == "object" && e !== null && typeof e.environmentName == "string" ? ri("error", [`%o
+
+%s
+
+%s
+`, e, n, o], e.environmentName)() : console.error(`%o
+
+%s
+
+%s
+`, e, n, o);
+      }, le.defaultOnRecoverableError = function(e) {
+        qg(e);
+      }, le.defaultOnUncaughtError = function(e) {
+        qg(e), console.warn(`%s
+
+%s
+`, 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.
+Visit https://react.dev/link/error-boundaries to learn more about error boundaries.`);
+      }, le.deferredUpdates = function(e) {
+        var n = x.T, o = wt();
+        try {
+          return an(32), x.T = null, e();
         } finally {
-          x.H = o;
+          an(o), x.T = n;
         }
-      }, useReducer: function(e, n, o) {
-        z = "useReducer", D(), N();
-        var i = x.H;
-        x.H = $o;
+      }, le.discreteUpdates = function(e, n, o, i, s) {
+        var u = x.T, f = wt();
         try {
-          return Br(e, n, o);
+          return an(2), x.T = null, e(n, o, i, s);
         } finally {
-          x.H = i;
+          an(f), x.T = u, ye === Jn && (Pp = me() + Fg);
         }
-      }, useRef: function() {
-        return z = "useRef", D(), N(), xe().memoizedState;
-      }, useState: function() {
-        z = "useState", D(), N();
-        var e = x.H;
-        x.H = $o;
-        try {
-          return Br(gr);
-        } finally {
-          x.H = e;
+      }, le.findAllNodes = kc, le.findBoundingRects = function(e, n) {
+        if (!xr) throw Error("Test selector API is not supported by this renderer.");
+        n = kc(e, n), e = [];
+        for (var o = 0; o < n.length; o++) e.push(ma(n[o]));
+        for (n = e.length - 1; 0 < n; n--) {
+          o = e[n];
+          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) {
+            var g = e[p], S = g.x, T = S + g.width, _ = g.y, I = _ + g.height;
+            if (i >= S && u >= _ && s <= T && f <= I) {
+              e.splice(n, 1);
+              break;
+            } else if (i !== S || o.width !== g.width || I < u || _ > f) {
+              if (!(u !== _ || o.height !== g.height || T < i || S > s)) {
+                S > i && (g.width += S - i, g.x = i), T < s && (g.width = s - S), e.splice(n, 1);
+                break;
+              }
+            } else {
+              _ > u && (g.height += _ - u, g.y = u), I < f && (g.height = f - _), e.splice(n, 1);
+              break;
+            }
+          }
         }
-      }, useDebugValue: function() {
-        z = "useDebugValue", D(), N();
-      }, useDeferredValue: function(e, n) {
-        return z = "useDeferredValue", D(), N(), nc(e, n);
-      }, useTransition: function() {
-        return z = "useTransition", D(), N(), Qp();
-      }, useSyncExternalStore: function(e, n, o) {
-        return z = "useSyncExternalStore", D(), N(), ta(e, n, o);
-      }, useId: function() {
-        return z = "useId", D(), N(), xe().memoizedState;
-      }, useFormState: function(e) {
-        return z = "useFormState", D(), N(), hs(e);
-      }, useActionState: function(e) {
-        return z = "useActionState", D(), N(), hs(e);
-      }, useOptimistic: function(e, n) {
-        return z = "useOptimistic", D(), N(), rf(e, n);
-      }, useMemoCache: function(e) {
-        return D(), Oa(e);
-      }, useHostTransitionStatus: ia, useCacheRefresh: function() {
-        return z = "useCacheRefresh", N(), xe().memoizedState;
-      }, useEffectEvent: function(e) {
-        return z = "useEffectEvent", D(), N(), oa(e);
-      } }, dm = { readContext: function(e) {
-        return Ce(), Ee(e);
-      }, use: function(e) {
-        return D(), we(e);
-      }, useCallback: function(e, n) {
-        return z = "useCallback", D(), N(), Ma(e, n);
-      }, useContext: function(e) {
-        return z = "useContext", D(), N(), Ee(e);
-      }, useEffect: function(e, n) {
-        z = "useEffect", D(), N(), Qn(2048, Ut, e, n);
-      }, useImperativeHandle: function(e, n, o) {
-        return z = "useImperativeHandle", D(), N(), aa(e, n, o);
-      }, useInsertionEffect: function(e, n) {
-        return z = "useInsertionEffect", D(), N(), Qn(4, Wt, e, n);
-      }, useLayoutEffect: function(e, n) {
-        return z = "useLayoutEffect", D(), N(), Qn(4, Rr, e, n);
-      }, useMemo: function(e, n) {
-        z = "useMemo", D(), N();
-        var o = x.H;
-        x.H = $o;
-        try {
-          return Vi(e, n);
-        } finally {
-          x.H = o;
+        return e;
+      }, le.findHostInstance = function(e) {
+        var n = e._reactInternals;
+        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));
+        return e = mu(n), e === null ? null : ot(e.stateNode);
+      }, le.findHostInstanceWithNoPortals = function(e) {
+        return e = Ed(e), e = e !== null ? _p(e) : null, e === null ? null : ot(e.stateNode);
+      }, le.findHostInstanceWithWarning = function(e, n) {
+        var o = e._reactInternals;
+        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));
+        if (e = mu(o), e === null) return null;
+        if (e.mode & 8) {
+          var i = G(o) || "Component";
+          mb[i] || (mb[i] = true, B(e, function() {
+            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);
+          }));
         }
-      }, useReducer: function(e, n, o) {
-        z = "useReducer", D(), N();
-        var i = x.H;
-        x.H = $o;
+        return ot(e.stateNode);
+      }, le.flushPassiveEffects = el, le.flushSyncFromReconciler = function(e) {
+        var n = ye;
+        ye |= 1;
+        var o = x.T, i = wt();
         try {
-          return Qi(e, n, o);
+          if (an(2), x.T = null, e) return e();
         } finally {
-          x.H = i;
+          an(i), x.T = o, ye = n, (ye & (Zn | uo)) === Jn && Wa(0);
         }
-      }, useRef: function() {
-        return z = "useRef", D(), N(), xe().memoizedState;
-      }, useState: function() {
-        z = "useState", D(), N();
-        var e = x.H;
-        x.H = $o;
-        try {
-          return Qi(gr);
-        } finally {
-          x.H = e;
+      }, le.flushSyncWork = Ls, le.focusWithin = function(e, n) {
+        if (!xr) throw Error("Test selector API is not supported by this renderer.");
+        for (e = Ef(e), n = hh(e, n), n = Array.from(n), e = 0; e < n.length; ) {
+          var o = n[e++], i = o.tag;
+          if (!Kr(o)) {
+            if ((i === 5 || i === 26 || i === 27) && Ft(o.stateNode)) return true;
+            for (o = o.child; o !== null; ) n.push(o), o = o.sibling;
+          }
+        }
+        return false;
+      }, le.getFindAllNodesFailureDescription = function(e, n) {
+        if (!xr) throw Error("Test selector API is not supported by this renderer.");
+        var o = 0, i = [];
+        e = [Ef(e), 0];
+        for (var s = 0; s < e.length; ) {
+          var u = e[s++], f = u.tag, p = e[s++], g = n[p];
+          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;
+        }
+        if (o < n.length) {
+          for (e = []; o < n.length; o++) e.push(Sc(n[o]));
+          return `findAllNodes was able to match part of the selector:
+  ` + (i.join(" > ") + `
+
+No matching component was found for:
+  `) + e.join(" > ");
+        }
+        return null;
+      }, le.getPublicRootInstance = function(e) {
+        if (e = e.current, !e.child) return null;
+        switch (e.child.tag) {
+          case 27:
+          case 5:
+            return ot(e.child.stateNode);
+          default:
+            return e.child.stateNode;
+        }
+      }, le.injectIntoDevTools = function() {
+        var e = { bundleType: 1, version: Jt, rendererPackageName: Zt, currentDispatcherRef: x, reconcilerVersion: "19.2.0" };
+        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);
+      }, le.isAlreadyRendering = Ns, le.observeVisibleRects = function(e, n, o, i) {
+        function s() {
+          var S = kc(e, n);
+          u.forEach(function(T) {
+            0 > S.indexOf(T) && g(T);
+          }), S.forEach(function(T) {
+            0 > u.indexOf(T) && p(T);
+          });
+        }
+        if (!xr) throw Error("Test selector API is not supported by this renderer.");
+        var u = kc(e, n);
+        o = zr(u, o, i);
+        var f = o.disconnect, p = o.observe, g = o.unobserve;
+        return bm.push(s), { disconnect: function() {
+          var S = bm.indexOf(s);
+          0 <= S && bm.splice(S, 1), f();
+        } };
+      }, le.shouldError = function(e) {
+        return pu(e);
+      }, le.shouldSuspend = function(e) {
+        return fu(e);
+      }, le.startHostTransition = function(e, n, o, i) {
+        if (e.tag !== 5) throw Error("Expected the form instance to be a HostComponent. This is a bug in React.");
+        var s = uf(e).queue;
+        Hp(e), nt(e, s, n, Xt, o === null ? Em : function() {
+          x.T === null && console.error("requestFormReset was called outside a transition or action. To fix, move to an action, or wrap with startTransition.");
+          var u = uf(e);
+          return u.next === null && (u = e.alternate.memoizedState), qi(e, u.next.queue, {}, Nt(e)), o(i);
+        });
+      }, le.updateContainer = function(e, n, o, i) {
+        var s = n.current, u = Nt(s);
+        return As(s, u, e, n, o, i), u;
+      }, le.updateContainerSync = Wh, le;
+    }, Tt.exports.default = Tt.exports, Object.defineProperty(Tt.exports, "__esModule", { value: true }));
+  })(Mg)), Mg.exports;
+}
+var Eb;
+function n0() {
+  return Eb || (Eb = 1, process.env.NODE_ENV === "production" ? Rm.exports = Kb() : Rm.exports = e0()), Rm.exports;
+}
+var t0 = n0();
+const r0 = Xb(t0);
+
+const DEFAULT_POINTER_ID = 0;
+const XR_POINTER_ID_START = 1e3;
+function getPointerState(internal, pointerId) {
+  let state = internal.pointerMap.get(pointerId);
+  if (!state) {
+    state = {
+      hovered: /* @__PURE__ */ new Map(),
+      captured: /* @__PURE__ */ new Map(),
+      initialClick: [0, 0],
+      initialHits: []
+    };
+    internal.pointerMap.set(pointerId, state);
+  }
+  return state;
+}
+function getPointerId(event) {
+  return "pointerId" in event ? event.pointerId : DEFAULT_POINTER_ID;
+}
+function makeId(event) {
+  return (event.eventObject || event.object).uuid + "/" + event.index + event.instanceId;
+}
+function releaseInternalPointerCapture(internal, obj, pointerId) {
+  const pointerState = internal.pointerMap.get(pointerId);
+  if (!pointerState) return;
+  const captureData = pointerState.captured.get(obj);
+  if (captureData) {
+    pointerState.captured.delete(obj);
+    try {
+      captureData.target.releasePointerCapture?.(pointerId);
+    } catch {
+    }
+  }
+}
+function swapInteractivity(store, object, newObject) {
+  const { internal } = store.getState();
+  for (let i = 0; i < internal.interaction.length; i++) {
+    if (internal.interaction[i] === object) internal.interaction[i] = newObject;
+  }
+  for (const pointerState of internal.pointerMap.values()) {
+    for (let i = 0; i < pointerState.initialHits.length; i++) {
+      if (pointerState.initialHits[i] === object) pointerState.initialHits[i] = newObject;
+    }
+    pointerState.hovered.forEach((value, key) => {
+      if (value.eventObject === object || value.object === object) {
+        pointerState.hovered.delete(key);
+        const next = {
+          ...value,
+          eventObject: value.eventObject === object ? newObject : value.eventObject,
+          object: value.object === object ? newObject : value.object
+        };
+        pointerState.hovered.set(makeId(next), next);
+      }
+    });
+    const captureData = pointerState.captured.get(object);
+    if (captureData) {
+      pointerState.captured.delete(object);
+      pointerState.captured.set(newObject, {
+        ...captureData,
+        intersection: {
+          ...captureData.intersection,
+          object: captureData.intersection.object === object ? newObject : captureData.intersection.object,
+          eventObject: captureData.intersection.eventObject === object ? newObject : captureData.intersection.eventObject
         }
-      }, useDebugValue: function() {
-        z = "useDebugValue", D(), N();
-      }, useDeferredValue: function(e, n) {
-        return z = "useDeferredValue", D(), N(), sf(e, n);
-      }, useTransition: function() {
-        return z = "useTransition", D(), N(), Ro();
-      }, useSyncExternalStore: function(e, n, o) {
-        return z = "useSyncExternalStore", D(), N(), ta(e, n, o);
-      }, useId: function() {
-        return z = "useId", D(), N(), xe().memoizedState;
-      }, useFormState: function(e) {
-        return z = "useFormState", D(), N(), $t(e);
-      }, useActionState: function(e) {
-        return z = "useActionState", D(), N(), $t(e);
-      }, useOptimistic: function(e, n) {
-        return z = "useOptimistic", D(), N(), of(e, n);
-      }, useMemoCache: function(e) {
-        return D(), Oa(e);
-      }, useHostTransitionStatus: ia, useCacheRefresh: function() {
-        return z = "useCacheRefresh", N(), xe().memoizedState;
-      }, useEffectEvent: function(e) {
-        return z = "useEffectEvent", D(), N(), oa(e);
-      } };
-      var Fy = {}, Hy = /* @__PURE__ */ new Set(), Ay = /* @__PURE__ */ new Set(), jy = /* @__PURE__ */ new Set(), Dy = /* @__PURE__ */ new Set(), Wy = /* @__PURE__ */ new Set(), Uy = /* @__PURE__ */ new Set(), By = /* @__PURE__ */ new Set(), Oy = /* @__PURE__ */ new Set(), My = /* @__PURE__ */ new Set(), Qy = /* @__PURE__ */ new Set();
-      Object.freeze(Fy);
-      var zg = { enqueueSetState: function(e, n, o) {
-        e = e._reactInternals;
-        var i = Nt(e), s = zo(i);
-        s.payload = n, o != null && (df(o), s.callback = o), n = Mt(e, s, i), n !== null && (ur(i, "this.setState()", e), We(n, e, i), Bi(n, e, i));
-      }, enqueueReplaceState: function(e, n, o) {
-        e = e._reactInternals;
-        var i = Nt(e), s = zo(i);
-        s.tag = Cy, s.payload = n, o != null && (df(o), s.callback = o), n = Mt(e, s, i), n !== null && (ur(i, "this.replaceState()", e), We(n, e, i), Bi(n, e, i));
-      }, enqueueForceUpdate: function(e, n) {
-        e = e._reactInternals;
-        var o = Nt(e), i = zo(o);
-        i.tag = Ty, n != null && (df(n), i.callback = n), n = Mt(e, i, o), n !== null && (ur(o, "this.forceUpdate()", e), We(n, e, o), Bi(n, e, o));
-      } }, bd = null, Cg = null, Tg = Error("This is not a real error. It's an implementation detail of React's selective hydration feature. If this leaks into userspace, it's a bug in React. Please file an issue."), Cn = false, $y = {}, Vy = {}, qy = {}, Gy = {}, vd = false, Jy = {}, fm = {}, _g = { dehydrated: null, treeContext: null, retryLane: 0, hydrationErrors: null }, Zy = false, Yy = null;
-      Yy = /* @__PURE__ */ new Set();
-      var Si = false, Tn = false, Rg = false, Xy = typeof WeakSet == "function" ? WeakSet : Set, Gn = null, Sd = null, kd = null, _n = null, nr = false, Vo = null, Wn = false, wd = 8192, Vb = { getCacheForType: function(e) {
-        var n = Ee(un), o = n.data.get(e);
-        return o === void 0 && (o = e(), n.data.set(e, o)), o;
-      }, cacheSignal: function() {
-        return Ee(un).controller.signal;
-      }, getOwner: function() {
-        return di;
-      } }, pm = 0, hm = 1, mm = 2, gm = 3, ym = 4;
-      if (typeof Symbol == "function" && Symbol.for) {
-        var bp = Symbol.for;
-        pm = bp("selector.component"), hm = bp("selector.has_pseudo_class"), mm = bp("selector.role"), gm = bp("selector.test_id"), ym = bp("selector.text");
+      });
+    }
+  }
+  unregisterVisibility(store, object);
+}
+function removeInteractivity(store, object) {
+  const { internal } = store.getState();
+  internal.interaction = internal.interaction.filter((o) => o !== object);
+  for (const [pointerId, pointerState] of internal.pointerMap) {
+    pointerState.initialHits = pointerState.initialHits.filter((o) => o !== object);
+    pointerState.hovered.forEach((value, key) => {
+      if (value.eventObject === object || value.object === object) {
+        pointerState.hovered.delete(key);
       }
-      var bm = [], qb = typeof WeakMap == "function" ? WeakMap : Map, Jn = 0, Zn = 2, uo = 4, ki = 0, vp = 1, iu = 2, vm = 3, Tl = 4, Sm = 6, Ky = 5, ye = Jn, je = null, se = null, ae = 0, tr = 0, km = 1, lu = 2, Sp = 3, eb = 4, Eg = 5, kp = 6, wm = 7, Ig = 8, su = 9, Le = tr, Er = null, _l = false, Pd = false, Lg = false, Ta = 0, nn = ki, Rl = 0, El = 0, Ng = 0, rr = 0, uu = 0, wp = null, Bt = null, Pm = false, xm = 0, nb = 0, tb = 300, Pp = 1 / 0, Fg = 500, xp = null, gn = null, Il = null, zm = 0, Hg = 1, Ag = 2, rb = 3, Ll = 0, ob = 1, ab = 2, ib = 3, lb = 4, Cm = 5, Rn = 0, Nl = null, xd = null, qo = 0, jg = 0, Dg = -0, Wg = null, sb = null, ub = null, Go = zm, cb = null, Gb = 50, zp = 0, Ug = null, Bg = false, Tm = false, Jb = 50, cu = 0, Cp = null, zd = false, _m = null, db = false, fb = /* @__PURE__ */ new Set(), Zb = {}, co = null, Cd = null, pb = false;
-      try {
-        var o0 = Object.preventExtensions({});
-      } catch {
-        pb = true;
+    });
+    if (pointerState.captured.has(object)) {
+      releaseInternalPointerCapture(internal, object, pointerId);
+    }
+  }
+  unregisterVisibility(store, object);
+}
+function createEvents(store) {
+  function calculateDistance(event, pointerId) {
+    const { internal } = store.getState();
+    const pointerState = internal.pointerMap.get(pointerId);
+    if (!pointerState) return 0;
+    const [initialX, initialY] = pointerState.initialClick;
+    const dx = event.offsetX - initialX;
+    const dy = event.offsetY - initialY;
+    return Math.round(Math.sqrt(dx * dx + dy * dy));
+  }
+  function filterPointerEvents(objects) {
+    return objects.filter(
+      (obj) => ["Move", "Over", "Enter", "Out", "Leave"].some(
+        (name) => obj.__r3f?.handlers["onPointer" + name]
+      ) || ["OverEnter", "OverLeave", "Over"].some(
+        (name) => obj.__r3f?.handlers["onDrag" + name]
+      ) || obj.__r3f?.handlers.onDrop
+    );
+  }
+  function intersect(event, filter) {
+    const state = store.getState();
+    const duplicates = /* @__PURE__ */ new Set();
+    const intersections = [];
+    const eventsObjects = filter ? filter(state.internal.interaction) : state.internal.interaction;
+    for (let i = 0; i < eventsObjects.length; i++) {
+      const state2 = getRootState(eventsObjects[i]);
+      if (state2) {
+        state2.raycaster.camera = void 0;
       }
-      var hb = false, mb = {}, gb = null, yb = null, bb = null, vb = null, Sb = null, kb = null, wb = null, Pb = null, xb = null, zb = null;
-      return gb = function(e, n, o, i) {
-        n = Yn(e, n), n !== null && (o = _d(n.memoizedState, o, 0, i), n.memoizedState = o, n.baseState = o, e.memoizedProps = ze({}, e.memoizedProps), o = On(e, 2), o !== null && We(o, e, 2));
-      }, yb = function(e, n, o) {
-        n = Yn(e, n), n !== null && (o = du(n.memoizedState, o, 0), n.memoizedState = o, n.baseState = o, e.memoizedProps = ze({}, e.memoizedProps), o = On(e, 2), o !== null && We(o, e, 2));
-      }, bb = function(e, n, o, i) {
-        n = Yn(e, n), n !== null && (o = F(n.memoizedState, o, i), n.memoizedState = o, n.baseState = o, e.memoizedProps = ze({}, e.memoizedProps), o = On(e, 2), o !== null && We(o, e, 2));
-      }, vb = function(e, n, o) {
-        e.pendingProps = _d(e.memoizedProps, n, 0, o), e.alternate && (e.alternate.pendingProps = e.pendingProps), n = On(e, 2), n !== null && We(n, e, 2);
-      }, Sb = function(e, n) {
-        e.pendingProps = du(e.memoizedProps, n, 0), e.alternate && (e.alternate.pendingProps = e.pendingProps), n = On(e, 2), n !== null && We(n, e, 2);
-      }, kb = function(e, n, o) {
-        e.pendingProps = F(e.memoizedProps, n, o), e.alternate && (e.alternate.pendingProps = e.pendingProps), n = On(e, 2), n !== null && We(n, e, 2);
-      }, wb = function(e) {
-        var n = On(e, 2);
-        n !== null && We(n, e, 2);
-      }, Pb = function(e) {
-        var n = ut(), o = On(e, n);
-        o !== null && We(o, e, n);
-      }, xb = function(e) {
-        pu = e;
-      }, zb = function(e) {
-        fu = e;
-      }, le.attemptContinuousHydration = function(e) {
-        if (e.tag === 13 || e.tag === 31) {
-          var n = On(e, 67108864);
-          n !== null && We(n, e, 67108864), rl(e, 67108864);
+    }
+    if (!state.previousRoot) {
+      state.events.compute?.(event, state);
+    }
+    function handleRaycast(obj) {
+      const state2 = getRootState(obj);
+      if (!state2 || !state2.events.enabled || state2.raycaster.camera === null) return [];
+      if (state2.raycaster.camera === void 0) {
+        state2.events.compute?.(event, state2, state2.previousRoot?.getState());
+        if (state2.raycaster.camera === void 0) state2.raycaster.camera = null;
+      }
+      if (!state2.raycaster.camera) return [];
+      obj.updateWorldMatrix(true, true);
+      return state2.raycaster.intersectObject(obj, true);
+    }
+    let hits = eventsObjects.flatMap(handleRaycast).sort((a, b) => {
+      const aInteractivePriority = a.object.userData?.interactivePriority;
+      const bInteractivePriority = b.object.userData?.interactivePriority;
+      if (aInteractivePriority !== void 0 || bInteractivePriority !== void 0) {
+        if (aInteractivePriority !== void 0 && bInteractivePriority === void 0) return -1;
+        if (bInteractivePriority !== void 0 && aInteractivePriority === void 0) return 1;
+        if (aInteractivePriority !== bInteractivePriority) {
+          return (bInteractivePriority ?? 0) - (aInteractivePriority ?? 0);
         }
-      }, le.attemptHydrationAtCurrentPriority = function(e) {
-        if (e.tag === 13 || e.tag === 31) {
-          var n = Nt(e);
-          n = Xo(n);
-          var o = On(e, n);
-          o !== null && We(o, e, n), rl(e, n);
+      }
+      const aState = getRootState(a.object);
+      const bState = getRootState(b.object);
+      const aPriority = aState?.events?.priority ?? 1;
+      const bPriority = bState?.events?.priority ?? 1;
+      return bPriority - aPriority || a.distance - b.distance;
+    }).filter((item) => {
+      const id = makeId(item);
+      if (duplicates.has(id)) return false;
+      duplicates.add(id);
+      return true;
+    });
+    if (state.events.filter) hits = state.events.filter(hits, state);
+    for (const hit of hits) {
+      let eventObject = hit.object;
+      while (eventObject) {
+        if (eventObject.__r3f?.eventCount) {
+          intersections.push({ ...hit, eventObject });
         }
-      }, le.attemptSynchronousHydration = function(e) {
-        switch (e.tag) {
-          case 3:
-            if (e = e.stateNode, e.current.memoizedState.isDehydrated) {
-              var n = _t(e.pendingLanes);
-              if (n !== 0) {
-                for (e.pendingLanes |= 2, e.entangledLanes |= 2; n; ) {
-                  var o = 1 << 31 - vn(n);
-                  e.entanglements[1] |= o, n &= ~o;
+        eventObject = eventObject.parent;
+      }
+    }
+    if ("pointerId" in event) {
+      const pointerId = event.pointerId;
+      const pointerState = state.internal.pointerMap.get(pointerId);
+      if (pointerState?.captured.size) {
+        for (const captureData of pointerState.captured.values()) {
+          if (!duplicates.has(makeId(captureData.intersection))) intersections.push(captureData.intersection);
+        }
+      }
+    }
+    return intersections;
+  }
+  function handleIntersects(intersections, event, delta, callback) {
+    if (intersections.length) {
+      const localState = { stopped: false };
+      for (const hit of intersections) {
+        const state = getRootState(hit.object);
+        if (state) {
+          const { raycaster, pointer, camera, internal } = state;
+          const unprojectedPoint = new Vector3(pointer.x, pointer.y, 0).unproject(camera);
+          const hasPointerCapture = (id) => {
+            const pointerState = internal.pointerMap.get(id);
+            return pointerState?.captured.has(hit.eventObject) ?? false;
+          };
+          const setPointerCapture = (id) => {
+            const captureData = { intersection: hit, target: event.target };
+            const pointerState = getPointerState(internal, id);
+            pointerState.captured.set(hit.eventObject, captureData);
+            event.target.setPointerCapture(id);
+          };
+          const releasePointerCapture = (id) => {
+            releaseInternalPointerCapture(internal, hit.eventObject, id);
+          };
+          const extractEventProps = {};
+          for (const prop in event) {
+            const property = event[prop];
+            if (typeof property !== "function") extractEventProps[prop] = property;
+          }
+          const eventPointerId = "pointerId" in event ? event.pointerId : void 0;
+          const raycastEvent = {
+            ...hit,
+            ...extractEventProps,
+            pointer,
+            intersections,
+            stopped: localState.stopped,
+            delta,
+            unprojectedPoint,
+            ray: raycaster.ray,
+            camera,
+            pointerId: eventPointerId,
+            // Hijack stopPropagation, which just sets a flag
+            stopPropagation() {
+              const pointerState = eventPointerId !== void 0 ? internal.pointerMap.get(eventPointerId) : void 0;
+              if (
+                // ...if this pointer hasn't been captured
+                !pointerState?.captured.size || // ... or if the hit object is capturing the pointer
+                pointerState.captured.has(hit.eventObject)
+              ) {
+                raycastEvent.stopped = localState.stopped = true;
+                if (pointerState?.hovered.size && Array.from(pointerState.hovered.values()).find((i) => i.eventObject === hit.eventObject)) {
+                  const higher = intersections.slice(0, intersections.indexOf(hit));
+                  cancelPointer([...higher, hit], eventPointerId);
                 }
-                Kn(e), (ye & (Zn | uo)) === Jn && (Pp = me() + Fg, Wa(0));
               }
-            }
-            break;
-          case 31:
-          case 13:
-            n = On(e, 2), n !== null && We(n, e, 2), Ls(), rl(e, 2);
+            },
+            // there should be a distinction between target and currentTarget
+            target: { hasPointerCapture, setPointerCapture, releasePointerCapture },
+            currentTarget: { hasPointerCapture, setPointerCapture, releasePointerCapture },
+            nativeEvent: event
+          };
+          callback(raycastEvent);
+          if (localState.stopped === true) break;
         }
-      }, le.batchedUpdates = function(e, n) {
-        return e(n);
-      }, le.createComponentSelector = function(e) {
-        return { $$typeof: pm, value: e };
-      }, le.createContainer = function(e, n, o, i, s, u, f, p, g, S) {
-        return Ka(e, n, false, null, o, i, u, null, f, p, g, S);
-      }, le.createHasPseudoClassSelector = function(e) {
-        return { $$typeof: hm, value: e };
-      }, le.createHydrationContainer = function(e, n, o, i, s, u, f, p, g, S, T, _, I, O) {
-        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;
-      }, le.createPortal = function(e, n, o) {
-        var i = 3 < arguments.length && arguments[3] !== void 0 ? arguments[3] : null;
-        try {
-          vt(i);
-          var s = false;
-        } catch {
-          s = true;
+      }
+    }
+    return intersections;
+  }
+  function cancelPointer(intersections, pointerId) {
+    const { internal } = store.getState();
+    const pid = pointerId ?? DEFAULT_POINTER_ID;
+    const pointerState = internal.pointerMap.get(pid);
+    if (!pointerState) return;
+    for (const [hoveredId, hoveredObj] of pointerState.hovered) {
+      if (!intersections.length || !intersections.find(
+        (hit) => hit.object === hoveredObj.object && hit.index === hoveredObj.index && hit.instanceId === hoveredObj.instanceId
+      )) {
+        const eventObject = hoveredObj.eventObject;
+        const instance = eventObject.__r3f;
+        pointerState.hovered.delete(hoveredId);
+        if (instance?.eventCount) {
+          const handlers = instance.handlers;
+          const data = { ...hoveredObj, intersections };
+          handlers.onPointerOut?.(data);
+          handlers.onPointerLeave?.(data);
+          handlers.onDragOverLeave?.(data);
         }
-        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 };
-      }, le.createRoleSelector = function(e) {
-        return { $$typeof: mm, value: e };
-      }, le.createTestNameSelector = function(e) {
-        return { $$typeof: gm, value: e };
-      }, le.createTextSelector = function(e) {
-        return { $$typeof: ym, value: e };
-      }, le.defaultOnCaughtError = function(e) {
-        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") + ".");
-        typeof e == "object" && e !== null && typeof e.environmentName == "string" ? ri("error", [`%o
-
-%s
-
-%s
-`, e, n, o], e.environmentName)() : console.error(`%o
-
-%s
-
-%s
-`, e, n, o);
-      }, le.defaultOnRecoverableError = function(e) {
-        qg(e);
-      }, le.defaultOnUncaughtError = function(e) {
-        qg(e), console.warn(`%s
-
-%s
-`, 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.
-Visit https://react.dev/link/error-boundaries to learn more about error boundaries.`);
-      }, le.deferredUpdates = function(e) {
-        var n = x.T, o = wt();
-        try {
-          return an(32), x.T = null, e();
-        } finally {
-          an(o), x.T = n;
+      }
+    }
+  }
+  function pointerMissed(event, objects) {
+    for (let i = 0; i < objects.length; i++) {
+      const instance = objects[i].__r3f;
+      instance?.handlers.onPointerMissed?.(event);
+    }
+  }
+  function dragOverMissed(event, objects) {
+    for (let i = 0; i < objects.length; i++) {
+      const instance = objects[i].__r3f;
+      instance?.handlers.onDragOverMissed?.(event);
+    }
+  }
+  function dropMissed(event, objects) {
+    for (let i = 0; i < objects.length; i++) {
+      const instance = objects[i].__r3f;
+      instance?.handlers.onDropMissed?.(event);
+    }
+  }
+  function cleanupPointer(pointerId) {
+    const { internal } = store.getState();
+    const pointerState = internal.pointerMap.get(pointerId);
+    if (pointerState) {
+      for (const [, hoveredObj] of pointerState.hovered) {
+        const eventObject = hoveredObj.eventObject;
+        const instance = eventObject.__r3f;
+        if (instance?.eventCount) {
+          const handlers = instance.handlers;
+          const data = { ...hoveredObj, intersections: [] };
+          handlers.onPointerOut?.(data);
+          handlers.onPointerLeave?.(data);
         }
-      }, le.discreteUpdates = function(e, n, o, i, s) {
-        var u = x.T, f = wt();
-        try {
-          return an(2), x.T = null, e(n, o, i, s);
-        } finally {
-          an(f), x.T = u, ye === Jn && (Pp = me() + Fg);
+      }
+      internal.pointerMap.delete(pointerId);
+    }
+    internal.pointerDirty.delete(pointerId);
+  }
+  function processDeferredPointer(event, pointerId) {
+    const state = store.getState();
+    const { internal } = state;
+    if (!state.events.enabled) return;
+    const filter = filterPointerEvents;
+    const hits = intersect(event, filter);
+    cancelPointer(hits, pointerId);
+    function onIntersect(data) {
+      const eventObject = data.eventObject;
+      const instance = eventObject.__r3f;
+      if (!instance?.eventCount) return;
+      const handlers = instance.handlers;
+      if (handlers.onPointerOver || handlers.onPointerEnter || handlers.onPointerOut || handlers.onPointerLeave) {
+        const id = makeId(data);
+        const pointerState = getPointerState(internal, pointerId);
+        const hoveredItem = pointerState.hovered.get(id);
+        if (!hoveredItem) {
+          pointerState.hovered.set(id, data);
+          handlers.onPointerOver?.(data);
+          handlers.onPointerEnter?.(data);
+        } else if (hoveredItem.stopped) {
+          data.stopPropagation();
         }
-      }, le.findAllNodes = kc, le.findBoundingRects = function(e, n) {
-        if (!xr) throw Error("Test selector API is not supported by this renderer.");
-        n = kc(e, n), e = [];
-        for (var o = 0; o < n.length; o++) e.push(ma(n[o]));
-        for (n = e.length - 1; 0 < n; n--) {
-          o = e[n];
-          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) {
-            var g = e[p], S = g.x, T = S + g.width, _ = g.y, I = _ + g.height;
-            if (i >= S && u >= _ && s <= T && f <= I) {
-              e.splice(n, 1);
-              break;
-            } else if (i !== S || o.width !== g.width || I < u || _ > f) {
-              if (!(u !== _ || o.height !== g.height || T < i || S > s)) {
-                S > i && (g.width += S - i, g.x = i), T < s && (g.width = s - S), e.splice(n, 1);
-                break;
+      }
+      handlers.onPointerMove?.(data);
+    }
+    handleIntersects(hits, event, 0, onIntersect);
+  }
+  function handlePointer(name) {
+    switch (name) {
+      case "onPointerLeave":
+      case "onDragLeave":
+        return () => cancelPointer([]);
+      // Global cancel of these events
+      case "onPointerCancel":
+        return (event) => {
+          const pointerId = getPointerId(event);
+          cleanupPointer(pointerId);
+        };
+      case "onLostPointerCapture":
+        return (event) => {
+          const { internal } = store.getState();
+          const pointerId = getPointerId(event);
+          const pointerState = internal.pointerMap.get(pointerId);
+          if (pointerState?.captured.size) {
+            requestAnimationFrame(() => {
+              const pointerState2 = internal.pointerMap.get(pointerId);
+              if (pointerState2?.captured.size) {
+                pointerState2.captured.clear();
               }
-            } else {
-              _ > u && (g.height += _ - u, g.y = u), I < f && (g.height = f - _), e.splice(n, 1);
-              break;
+              cancelPointer([], pointerId);
+            });
+          }
+        };
+    }
+    return function handleEvent(event) {
+      const state = store.getState();
+      const { onPointerMissed, onDragOverMissed, onDropMissed, internal, events } = state;
+      const pointerId = getPointerId(event);
+      internal.lastEvent.current = event;
+      if (!events.enabled) return;
+      const isPointerMove = name === "onPointerMove";
+      const isDragOver = name === "onDragOver";
+      const isDrop = name === "onDrop";
+      const isClickEvent = name === "onClick" || name === "onContextMenu" || name === "onDoubleClick";
+      const isPointerDown = name === "onPointerDown";
+      const isPointerUp = name === "onPointerUp";
+      const isWheel = name === "onWheel";
+      const canDeferRaycasts = events.frameTimedRaycasts && state.frameloop === "always";
+      if (isPointerMove && canDeferRaycasts) {
+        events.compute?.(event, state);
+        internal.pointerDirty.set(pointerId, event);
+        return;
+      }
+      if (isWheel && canDeferRaycasts && !events.alwaysFireOnScroll) {
+        events.compute?.(event, state);
+        internal.pointerDirty.set(pointerId, event);
+        return;
+      }
+      if ((isClickEvent || isPointerDown || isPointerUp) && internal.pointerDirty.has(pointerId)) {
+        const deferredEvent = internal.pointerDirty.get(pointerId);
+        internal.pointerDirty.delete(pointerId);
+        processDeferredPointer(deferredEvent, pointerId);
+      }
+      const filter = isPointerMove || isDragOver || isDrop ? filterPointerEvents : void 0;
+      const hits = intersect(event, filter);
+      const delta = isClickEvent ? calculateDistance(event, pointerId) : 0;
+      if (isPointerDown) {
+        const pointerState2 = getPointerState(internal, pointerId);
+        pointerState2.initialClick = [event.offsetX, event.offsetY];
+        pointerState2.initialHits = hits.map((hit) => hit.eventObject);
+      }
+      const pointerState = internal.pointerMap.get(pointerId);
+      const initialHits = pointerState?.initialHits ?? [];
+      if (isClickEvent && !hits.length) {
+        if (delta <= 2) {
+          pointerMissed(event, internal.interaction);
+          if (onPointerMissed) onPointerMissed(event);
+        }
+      }
+      if (isDragOver && !hits.length) {
+        dragOverMissed(event, internal.interaction);
+        if (onDragOverMissed) onDragOverMissed(event);
+      }
+      if (isDrop && !hits.length) {
+        dropMissed(event, internal.interaction);
+        if (onDropMissed) onDropMissed(event);
+      }
+      if (isPointerMove || isDragOver) {
+        cancelPointer(hits, pointerId);
+      }
+      function onIntersect(data) {
+        const eventObject = data.eventObject;
+        const instance = eventObject.__r3f;
+        if (!instance?.eventCount) return;
+        const handlers = instance.handlers;
+        if (isPointerMove) {
+          if (handlers.onPointerOver || handlers.onPointerEnter || handlers.onPointerOut || handlers.onPointerLeave) {
+            const id = makeId(data);
+            const pointerState2 = getPointerState(internal, pointerId);
+            const hoveredItem = pointerState2.hovered.get(id);
+            if (!hoveredItem) {
+              pointerState2.hovered.set(id, data);
+              handlers.onPointerOver?.(data);
+              handlers.onPointerEnter?.(data);
+            } else if (hoveredItem.stopped) {
+              data.stopPropagation();
             }
           }
-        }
-        return e;
-      }, le.findHostInstance = function(e) {
-        var n = e._reactInternals;
-        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));
-        return e = mu(n), e === null ? null : ot(e.stateNode);
-      }, le.findHostInstanceWithNoPortals = function(e) {
-        return e = Ed(e), e = e !== null ? _p(e) : null, e === null ? null : ot(e.stateNode);
-      }, le.findHostInstanceWithWarning = function(e, n) {
-        var o = e._reactInternals;
-        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));
-        if (e = mu(o), e === null) return null;
-        if (e.mode & 8) {
-          var i = G(o) || "Component";
-          mb[i] || (mb[i] = true, B(e, function() {
-            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);
-          }));
-        }
-        return ot(e.stateNode);
-      }, le.flushPassiveEffects = el, le.flushSyncFromReconciler = function(e) {
-        var n = ye;
-        ye |= 1;
-        var o = x.T, i = wt();
-        try {
-          if (an(2), x.T = null, e) return e();
-        } finally {
-          an(i), x.T = o, ye = n, (ye & (Zn | uo)) === Jn && Wa(0);
-        }
-      }, le.flushSyncWork = Ls, le.focusWithin = function(e, n) {
-        if (!xr) throw Error("Test selector API is not supported by this renderer.");
-        for (e = Ef(e), n = hh(e, n), n = Array.from(n), e = 0; e < n.length; ) {
-          var o = n[e++], i = o.tag;
-          if (!Kr(o)) {
-            if ((i === 5 || i === 26 || i === 27) && Ft(o.stateNode)) return true;
-            for (o = o.child; o !== null; ) n.push(o), o = o.sibling;
+          handlers.onPointerMove?.(data);
+        } else if (isDragOver) {
+          const id = makeId(data);
+          const pointerState2 = getPointerState(internal, pointerId);
+          const hoveredItem = pointerState2.hovered.get(id);
+          if (!hoveredItem) {
+            pointerState2.hovered.set(id, data);
+            handlers.onDragOverEnter?.(data);
+          } else if (hoveredItem.stopped) {
+            data.stopPropagation();
+          }
+          handlers.onDragOver?.(data);
+        } else if (isDrop) {
+          handlers.onDrop?.(data);
+        } else {
+          const handler = handlers[name];
+          if (handler) {
+            if (!isClickEvent || initialHits.includes(eventObject)) {
+              pointerMissed(
+                event,
+                internal.interaction.filter((object) => !initialHits.includes(object))
+              );
+              handler(data);
+            }
+          } else {
+            if (isClickEvent && initialHits.includes(eventObject)) {
+              pointerMissed(
+                event,
+                internal.interaction.filter((object) => !initialHits.includes(object))
+              );
+            }
           }
         }
-        return false;
-      }, le.getFindAllNodesFailureDescription = function(e, n) {
-        if (!xr) throw Error("Test selector API is not supported by this renderer.");
-        var o = 0, i = [];
-        e = [Ef(e), 0];
-        for (var s = 0; s < e.length; ) {
-          var u = e[s++], f = u.tag, p = e[s++], g = n[p];
-          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;
+      }
+      handleIntersects(hits, event, delta, onIntersect);
+    };
+  }
+  function flushDeferredPointers() {
+    const { internal, events } = store.getState();
+    if (!events.frameTimedRaycasts) return;
+    for (const [pointerId, event] of internal.pointerDirty) {
+      processDeferredPointer(event, pointerId);
+    }
+    internal.pointerDirty.clear();
+  }
+  return { handlePointer, flushDeferredPointers, processDeferredPointer };
+}
+const DOM_EVENTS = {
+  onClick: ["click", false],
+  onContextMenu: ["contextmenu", false],
+  onDoubleClick: ["dblclick", false],
+  onDragEnter: ["dragenter", false],
+  onDragLeave: ["dragleave", false],
+  onDragOver: ["dragover", false],
+  onDrop: ["drop", false],
+  onWheel: ["wheel", true],
+  onPointerDown: ["pointerdown", true],
+  onPointerUp: ["pointerup", true],
+  onPointerLeave: ["pointerleave", true],
+  onPointerMove: ["pointermove", true],
+  onPointerCancel: ["pointercancel", true],
+  onLostPointerCapture: ["lostpointercapture", true]
+};
+function createPointerEvents(store) {
+  const { handlePointer, flushDeferredPointers, processDeferredPointer } = createEvents(store);
+  let nextXRPointerId = XR_POINTER_ID_START;
+  const xrPointers = /* @__PURE__ */ new Map();
+  return {
+    priority: 1,
+    enabled: true,
+    frameTimedRaycasts: true,
+    alwaysFireOnScroll: true,
+    updateOnFrame: false,
+    compute(event, state) {
+      state.pointer.set(event.offsetX / state.size.width * 2 - 1, -(event.offsetY / state.size.height) * 2 + 1);
+      state.raycaster.setFromCamera(state.pointer, state.camera);
+    },
+    connected: void 0,
+    handlers: Object.keys(DOM_EVENTS).reduce(
+      (acc, key) => ({ ...acc, [key]: handlePointer(key) }),
+      {}
+    ),
+    update: (pointerId) => {
+      const { events, internal } = store.getState();
+      if (!events.handlers) return;
+      if (pointerId !== void 0) {
+        const event = internal.pointerDirty.get(pointerId);
+        if (event) {
+          internal.pointerDirty.delete(pointerId);
+          processDeferredPointer(event, pointerId);
+        } else if (internal.lastEvent?.current) {
+          processDeferredPointer(internal.lastEvent.current, pointerId);
         }
-        if (o < n.length) {
-          for (e = []; o < n.length; o++) e.push(Sc(n[o]));
-          return `findAllNodes was able to match part of the selector:
-  ` + (i.join(" > ") + `
-
-No matching component was found for:
-  `) + e.join(" > ");
+      } else {
+        flushDeferredPointers();
+        if (internal.lastEvent?.current) {
+          events.handlers.onPointerMove(internal.lastEvent.current);
         }
-        return null;
-      }, le.getPublicRootInstance = function(e) {
-        if (e = e.current, !e.child) return null;
-        switch (e.child.tag) {
-          case 27:
-          case 5:
-            return ot(e.child.stateNode);
-          default:
-            return e.child.stateNode;
+      }
+    },
+    flush: () => {
+      const { events, internal } = store.getState();
+      flushDeferredPointers();
+      if (events.updateOnFrame && internal.lastEvent?.current && events.handlers) {
+        events.handlers.onPointerMove(internal.lastEvent.current);
+      }
+    },
+    connect: (target) => {
+      if (!target) return;
+      const { set, events } = store.getState();
+      events.disconnect?.();
+      set((state) => ({ events: { ...state.events, connected: target } }));
+      if (events.handlers) {
+        for (const name in events.handlers) {
+          const event = events.handlers[name];
+          const [eventName, passive] = DOM_EVENTS[name];
+          target.addEventListener(eventName, event, { passive });
         }
-      }, le.injectIntoDevTools = function() {
-        var e = { bundleType: 1, version: Jt, rendererPackageName: Zt, currentDispatcherRef: x, reconcilerVersion: "19.2.0" };
-        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);
-      }, le.isAlreadyRendering = Ns, le.observeVisibleRects = function(e, n, o, i) {
-        function s() {
-          var S = kc(e, n);
-          u.forEach(function(T) {
-            0 > S.indexOf(T) && g(T);
-          }), S.forEach(function(T) {
-            0 > u.indexOf(T) && p(T);
-          });
+      }
+    },
+    disconnect: () => {
+      const { set, events } = store.getState();
+      if (events.connected) {
+        if (events.handlers) {
+          for (const name in events.handlers) {
+            const event = events.handlers[name];
+            const [eventName] = DOM_EVENTS[name];
+            events.connected.removeEventListener(eventName, event);
+          }
         }
-        if (!xr) throw Error("Test selector API is not supported by this renderer.");
-        var u = kc(e, n);
-        o = zr(u, o, i);
-        var f = o.disconnect, p = o.observe, g = o.unobserve;
-        return bm.push(s), { disconnect: function() {
-          var S = bm.indexOf(s);
-          0 <= S && bm.splice(S, 1), f();
-        } };
-      }, le.shouldError = function(e) {
-        return pu(e);
-      }, le.shouldSuspend = function(e) {
-        return fu(e);
-      }, le.startHostTransition = function(e, n, o, i) {
-        if (e.tag !== 5) throw Error("Expected the form instance to be a HostComponent. This is a bug in React.");
-        var s = uf(e).queue;
-        Hp(e), nt(e, s, n, Xt, o === null ? Em : function() {
-          x.T === null && console.error("requestFormReset was called outside a transition or action. To fix, move to an action, or wrap with startTransition.");
-          var u = uf(e);
-          return u.next === null && (u = e.alternate.memoizedState), qi(e, u.next.queue, {}, Nt(e)), o(i);
-        });
-      }, le.updateContainer = function(e, n, o, i) {
-        var s = n.current, u = Nt(s);
-        return As(s, u, e, n, o, i), u;
-      }, le.updateContainerSync = Wh, le;
-    }, Tt.exports.default = Tt.exports, Object.defineProperty(Tt.exports, "__esModule", { value: true }));
-  })(Mg)), Mg.exports;
-}
-var Eb;
-function n0() {
-  return Eb || (Eb = 1, process.env.NODE_ENV === "production" ? Rm.exports = Kb() : Rm.exports = e0()), Rm.exports;
+        set((state) => ({ events: { ...state.events, connected: void 0 } }));
+      }
+    },
+    // PREVIEW (A8): the XR pointer registration API may change before stable.
+    registerPointer: (config) => {
+      const pointerId = nextXRPointerId++;
+      xrPointers.set(pointerId, config);
+      const { internal } = store.getState();
+      getPointerState(internal, pointerId);
+      return pointerId;
+    },
+    unregisterPointer: (pointerId) => {
+      xrPointers.delete(pointerId);
+      const { internal } = store.getState();
+      const pointerState = internal.pointerMap.get(pointerId);
+      if (pointerState) {
+        for (const [, hoveredObj] of pointerState.hovered) {
+          const eventObject = hoveredObj.eventObject;
+          const instance = eventObject.__r3f;
+          if (instance?.eventCount) {
+            const handlers = instance.handlers;
+            const data = { ...hoveredObj, intersections: [] };
+            handlers.onPointerOut?.(data);
+            handlers.onPointerLeave?.(data);
+          }
+        }
+        internal.pointerMap.delete(pointerId);
+      }
+      internal.pointerDirty.delete(pointerId);
+    }
+  };
 }
-var t0 = n0();
-const r0 = Xb(t0);
-
-const t = 1, o = 8, r = 32, e = 2;
 
 function createReconciler(config) {
   const reconciler2 = r0(config);
@@ -13703,7 +13571,10 @@ function extend(objects) {
     catalogue[Component] = objects;
     return Component;
   } else {
-    Object.assign(catalogue, objects);
+    for (const name in objects) {
+      const object = objects[name];
+      if (isConstructor(object)) catalogue[name] = object;
+    }
   }
 }
 function validateInstance(type, props) {
@@ -13848,7 +13719,15 @@ function setFiberRef(fiber, publicInstance) {
   }
 }
 const reconstructed = [];
-function swapInstances() {
+function flushReconstructedInstances() {
+  if (reconstructed.length === 0) return;
+  try {
+    swapReconstructedInstances();
+  } finally {
+    reconstructed.length = 0;
+  }
+}
+function swapReconstructedInstances() {
   for (const [instance] of reconstructed) {
     const parent = instance.parent;
     if (parent) {
@@ -13866,7 +13745,9 @@ function swapInstances() {
       }
     }
     if (instance.isHidden) unhideInstance(instance);
-    if (isObject3D(instance.object)) removeInteractivity(findInitialRoot(instance), instance.object);
+    if (isObject3D(instance.object) && !instance.parent) {
+      removeInteractivity(findInitialRoot(instance), instance.object);
+    }
     if (instance.object.__r3f) delete instance.object.__r3f;
     if (instance.type !== "primitive") disposeOnIdle(instance.object);
   }
@@ -13875,9 +13756,13 @@ function swapInstances() {
     const parent = instance.parent;
     if (parent) {
       const target = catalogue[toPascalCase(instance.type)];
+      const prevObject = instance.object;
       instance.object = instance.props.object ?? new target(...instance.props.args ?? []);
       instance.object.__r3f = instance;
       setFiberRef(fiber, instance.object);
+      if (isObject3D(prevObject) && isObject3D(instance.object)) {
+        swapInteractivity(findInitialRoot(instance), prevObject, instance.object);
+      }
       delete instance.appliedOnce;
       instance.eventCount = 0;
       instance.handlers = {};
@@ -13897,14 +13782,114 @@ function swapInstances() {
       invalidateInstance(instance);
     }
   }
-  reconstructed.length = 0;
 }
 const handleTextInstance = () => {
 };
 const NO_CONTEXT = {};
 let currentUpdatePriority = NoEventPriority;
-const NoFlags = 0;
-const Update = 4;
+function getEventPriority(type) {
+  switch (type) {
+    case "beforetoggle":
+    case "cancel":
+    case "click":
+    case "close":
+    case "contextmenu":
+    case "copy":
+    case "cut":
+    case "auxclick":
+    case "dblclick":
+    case "dragend":
+    case "dragstart":
+    case "drop":
+    case "focusin":
+    case "focusout":
+    case "input":
+    case "invalid":
+    case "keydown":
+    case "keypress":
+    case "keyup":
+    case "mousedown":
+    case "mouseup":
+    case "paste":
+    case "pause":
+    case "play":
+    case "pointercancel":
+    case "pointerdown":
+    case "pointerup":
+    case "ratechange":
+    case "reset":
+    case "resize":
+    case "seeked":
+    case "submit":
+    case "touchcancel":
+    case "touchend":
+    case "touchstart":
+    case "volumechange":
+    case "change":
+    case "selectionchange":
+    case "compositionstart":
+    case "compositionend":
+    case "compositionupdate":
+    case "beforeinput":
+    case "blur":
+    case "fullscreenchange":
+    case "focus":
+    case "hashchange":
+    case "popstate":
+    case "select":
+    case "selectstart":
+      return e;
+    case "drag":
+    case "dragenter":
+    case "dragexit":
+    case "dragleave":
+    case "dragover":
+    case "mousemove":
+    case "mouseout":
+    case "mouseover":
+    case "pointermove":
+    case "pointerout":
+    case "pointerover":
+    case "scroll":
+    case "touchmove":
+    case "wheel":
+    case "mouseenter":
+    case "mouseleave":
+    case "pointerenter":
+    case "pointerleave":
+      return o;
+    case "message": {
+      switch (unstable_getCurrentPriorityLevel()) {
+        case unstable_ImmediatePriority:
+          return e;
+        case unstable_UserBlockingPriority:
+          return o;
+        case unstable_NormalPriority:
+        case unstable_LowPriority:
+          return r;
+        case unstable_IdlePriority:
+          return i$1;
+        default:
+          return r;
+      }
+    }
+    default:
+      return r;
+  }
+}
+function scheduleMicrotask(callback) {
+  if (typeof queueMicrotask === "function") {
+    queueMicrotask(callback);
+  } else if (typeof Promise !== "undefined") {
+    Promise.resolve().then(callback).catch((error) => {
+      setTimeout(() => {
+        throw error;
+      });
+    });
+  } else {
+    setTimeout(callback);
+  }
+}
 const reconciler = /* @__PURE__ */ createReconciler({
   isPrimaryRenderer: false,
   warnsIfNotActing: false,
@@ -13937,22 +13922,21 @@ const reconciler = /* @__PURE__ */ createReconciler({
   getRootHostContext: () => NO_CONTEXT,
   getChildHostContext: () => NO_CONTEXT,
   commitUpdate(instance, type, oldProps, newProps, fiber) {
-    validateInstance(type, newProps);
+    validateInstance(instance.type, newProps);
     let reconstruct = false;
     if (instance.type === "primitive" && oldProps.object !== newProps.object) reconstruct = true;
     else if (newProps.args?.length !== oldProps.args?.length) reconstruct = true;
     else if (newProps.args?.some((value, index) => value !== oldProps.args?.[index])) reconstruct = true;
     if (reconstruct) {
-      reconstructed.push([instance, { ...newProps }, fiber]);
+      reconstructed.push([instance, getInstanceProps(newProps), fiber]);
     } else {
       const changedProps = diffProps(instance, newProps);
-      if (Object.keys(changedProps).length) {
-        Object.assign(instance.props, changedProps);
-        applyProps(instance.object, changedProps);
-      }
+      const attach2 = instance.props.attach;
+      instance.props = getInstanceProps(newProps);
+      if (attach2 !== void 0) instance.props.attach = attach2;
+      else delete instance.props.attach;
+      if (Object.keys(changedProps).length) applyProps(instance.object, changedProps);
     }
-    const isTailSibling = fiber.sibling === null || (fiber.flags & Update) === NoFlags;
-    if (isTailSibling) swapInstances();
   },
   finalizeInitialChildren: (instance) => {
     for (const prop in instance.props) {
@@ -13965,8 +13949,8 @@ const reconciler = /* @__PURE__ */ createReconciler({
     for (const prop in instance.props) {
       const value = instance.props[prop];
       if (isFromRef(value)) {
-        const ref = value[FROM_REF];
-        if (ref.current != null) resolved[prop] = ref.current;
+        const { [FROM_REF]: ref, transform } = value;
+        if (ref.current != null) resolved[prop] = transform ? transform(ref.current) : ref.current;
       }
     }
     if (Object.keys(resolved).length) applyProps(instance.object, resolved);
@@ -13977,8 +13961,9 @@ const reconciler = /* @__PURE__ */ createReconciler({
     const target = container.getState().internal.container ?? container.getState().scene;
     return prepare(target, container, "", {});
   },
-  resetAfterCommit: () => {
-  },
+  // Reconstructed instances are swapped once all mutations are committed,
+  // before layout effects run so refs point to the new objects
+  resetAfterCommit: flushReconstructedInstances,
   shouldSetTextContent: () => false,
   clearContainer: () => false,
   hideInstance,
@@ -13986,6 +13971,9 @@ const reconciler = /* @__PURE__ */ createReconciler({
   createTextInstance: handleTextInstance,
   hideTextInstance: handleTextInstance,
   unhideTextInstance: handleTextInstance,
+  // Mirrors react-dom, which flushes discrete work in microtasks
+  supportsMicrotasks: true,
+  scheduleMicrotask,
   scheduleTimeout: typeof setTimeout === "function" ? setTimeout : void 0,
   cancelTimeout: typeof clearTimeout === "function" ? clearTimeout : void 0,
   noTimeout: -1,
@@ -14026,28 +14014,9 @@ const reconciler = /* @__PURE__ */ createReconciler({
   },
   resolveUpdatePriority() {
     if (currentUpdatePriority !== NoEventPriority) return currentUpdatePriority;
-    switch (typeof window !== "undefined" && window.event?.type) {
-      case "click":
-      case "contextmenu":
-      case "dblclick":
-      case "dragenter":
-      case "dragleave":
-      case "drop":
-      case "pointercancel":
-      case "pointerdown":
-      case "pointerup":
-        return e;
-      case "dragover":
-      case "pointermove":
-      case "pointerout":
-      case "pointerover":
-      case "pointerenter":
-      case "pointerleave":
-      case "wheel":
-        return o;
-      default:
-        return r;
-    }
+    const eventType = typeof window !== "undefined" ? window.event?.type : void 0;
+    if (eventType === void 0) return r;
+    return getEventPriority(eventType);
   },
   resetFormInstance() {
   },
@@ -14262,9 +14231,8 @@ function createRoot(canvas) {
               if (!renderer.hasInitialized?.()) {
                 const size2 = computeInitialSize(canvas, propsSize);
                 if (size2.width > 0 && size2.height > 0) {
-                  const pixelRatio = calculateDpr(dpr);
-                  canvas.width = size2.width * pixelRatio;
-                  canvas.height = size2.height * pixelRatio;
+                  renderer.setPixelRatio(calculateDpr(dpr));
+                  renderer.setSize(size2.width, size2.height, false);
                 }
                 await renderer.init();
               }
@@ -14273,7 +14241,7 @@ function createRoot(canvas) {
               state.internal.actualRenderer = renderer;
               state.set({ webGPUSupported: isWebGPUBackend, renderer, primaryStore: store });
               if (canvasId && !state.internal.isSecondary) {
-                const canvasTarget = new CanvasTarget(canvas);
+                const canvasTarget = renderer.getCanvasTarget?.();
                 const unregisterPrimary = registerPrimary(canvasId, renderer, store);
                 state.set((prev) => ({
                   internal: {
@@ -14387,7 +14355,7 @@ function createRoot(canvas) {
         const handleXRFrame = (timestamp, _frame) => {
           const state2 = store.getState();
           if (state2.frameloop === "never") return;
-          advance(timestamp);
+          advance(timestamp, true, state2);
         };
         const actualRenderer = state.internal.actualRenderer;
         const handleSessionChange = () => {
@@ -14395,7 +14363,7 @@ function createRoot(canvas) {
           const renderer2 = state2.internal.actualRenderer;
           actualRenderer.xr.enabled = actualRenderer.xr.isPresenting;
           renderer2.xr.setAnimationLoop(renderer2.xr.isPresenting ? handleXRFrame : null);
-          if (!renderer2.xr.isPresenting) invalidate();
+          if (!renderer2.xr.isPresenting) invalidate(state2);
         };
         const xr = {
           connect() {
@@ -14477,14 +14445,23 @@ function createRoot(canvas) {
         const newRootId = canvasId || scheduler.generateRootId();
         const unregisterRoot = scheduler.registerRoot(newRootId, {
           getState: () => store.getState(),
-          onError: (err) => store.getState().setError(err)
+          onError: (err) => store.getState().setError(err),
+          frameloop: store.getState().frameloop,
+          before: schedulerConfig?.before,
+          after: schedulerConfig?.after,
+          order: schedulerConfig?.order
         });
         const unregisterCanvasTarget = scheduler.register(
           () => {
             const state2 = store.getState();
-            if (state2.internal.isMultiCanvas && state2.internal.canvasTarget) {
+            const canvasTarget = state2.internal.canvasTarget;
+            if (canvasTarget) {
               const renderer2 = state2.internal.actualRenderer;
-              renderer2.setCanvasTarget(state2.internal.canvasTarget);
+              if (renderer2.getCanvasTarget() !== canvasTarget) renderer2.setCanvasTarget(canvasTarget);
+              if (state2.internal.canvasTargetSizeDirty) {
+                state2.internal.canvasTargetSizeDirty = false;
+                renderer2.backend?.updateSize?.();
+              }
             }
           },
           {
@@ -14553,8 +14530,7 @@ function createRoot(canvas) {
             phase: "render",
             system: true,
             // Internal flag: this is a system job, not user-controlled
-            // Apply scheduler config for render ordering and rate limiting
-            ...schedulerConfig?.after && { after: schedulerConfig.after },
+            // FPS throttles only the default render job; Canvas ordering belongs to the root.
             ...schedulerConfig?.fps && { fps: schedulerConfig.fps }
           }
         );
@@ -14573,8 +14549,21 @@ function createRoot(canvas) {
             scheduler
           }
         }));
+      } else {
+        const constraintsChanged = !is.equ(schedulerConfig?.before, lastConfiguredProps.schedulerBefore, shallowLoose) || !is.equ(schedulerConfig?.after, lastConfiguredProps.schedulerAfter, shallowLoose);
+        if (constraintsChanged) {
+          scheduler.setRootConstraints(rootId, {
+            before: schedulerConfig?.before,
+            after: schedulerConfig?.after
+          });
+        }
+        if (schedulerConfig?.order !== lastConfiguredProps.schedulerOrder) {
+          scheduler.setRootOrder(rootId, schedulerConfig?.order ?? 0);
+        }
       }
-      scheduler.frameloop = frameloop;
+      lastConfiguredProps.schedulerBefore = schedulerConfig?.before;
+      lastConfiguredProps.schedulerAfter = schedulerConfig?.after;
+      lastConfiguredProps.schedulerOrder = schedulerConfig?.order;
       onCreated = onCreatedCallback;
       configured = true;
       resolve();
@@ -14616,18 +14605,23 @@ function unmountComponentAtNode(canvas, callback) {
   const fiber = root?.fiber;
   if (fiber) {
     const state = root?.store.getState();
-    if (state) state.internal.active = false;
+    if (state) {
+      state.internal.active = false;
+      const unregisterRoot = state.internal.unregisterRoot;
+      if (unregisterRoot) {
+        unregisterRoot();
+        state.internal.unregisterRoot = void 0;
+      }
+    }
     reconciler.updateContainer(null, fiber, null, () => {
       if (state) {
         setTimeout(() => {
           try {
             const renderer = state.internal.actualRenderer;
-            const unregisterRoot = state.internal.unregisterRoot;
-            if (unregisterRoot) unregisterRoot();
             const unregisterPrimary = state.internal.unregisterPrimary;
             if (unregisterPrimary) unregisterPrimary();
             const canvasTarget = state.internal.canvasTarget;
-            if (canvasTarget?.dispose) canvasTarget.dispose();
+            if (state.internal.isSecondary && canvasTarget?.dispose) canvasTarget.dispose();
             state.events.disconnect?.();
             cleanupHelperGroup(root.store);
             if (state.isLegacy && renderer) {
@@ -14753,6 +14747,207 @@ function flushSync(fn) {
   return reconciler.flushSyncFromReconciler(fn);
 }
 
+const isRef = (obj) => obj.current && obj.current.isScene;
+const resolveScene = (scene) => isRef(scene) ? scene.current : scene;
+function setEnvProps(background, scene, defaultScene, texture, sceneProps = {}) {
+  sceneProps = {
+    backgroundBlurriness: 0,
+    backgroundIntensity: 1,
+    backgroundRotation: [0, 0, 0],
+    environmentIntensity: 1,
+    environmentRotation: [0, 0, 0],
+    ...sceneProps
+  };
+  const target = resolveScene(scene || defaultScene);
+  const oldbg = target.background;
+  const oldenv = target.environment;
+  const oldSceneProps = {
+    backgroundBlurriness: target.backgroundBlurriness,
+    backgroundIntensity: target.backgroundIntensity,
+    backgroundRotation: target.backgroundRotation.clone(),
+    environmentIntensity: target.environmentIntensity,
+    environmentRotation: target.environmentRotation.clone()
+  };
+  if (background !== "only") target.environment = texture;
+  if (background) target.background = texture;
+  applyProps(target, sceneProps);
+  return () => {
+    if (background !== "only") target.environment = oldenv;
+    if (background) target.background = oldbg;
+    applyProps(target, oldSceneProps);
+  };
+}
+function EnvironmentMap({ scene, background = false, map, ...config }) {
+  const defaultScene = useThree$1((state) => state.scene);
+  React.useLayoutEffect(() => {
+    if (map) return setEnvProps(background, scene, defaultScene, map, config);
+  });
+  return null;
+}
+function EnvironmentCube({
+  background = false,
+  scene,
+  blur,
+  backgroundBlurriness,
+  backgroundIntensity,
+  backgroundRotation,
+  environmentIntensity,
+  environmentRotation,
+  ...rest
+}) {
+  const texture = useEnvironment(rest);
+  const defaultScene = useThree$1((state) => state.scene);
+  React.useLayoutEffect(() => {
+    return setEnvProps(background, scene, defaultScene, texture, {
+      backgroundBlurriness: blur ?? backgroundBlurriness,
+      backgroundIntensity,
+      backgroundRotation,
+      environmentIntensity,
+      environmentRotation
+    });
+  });
+  React.useEffect(() => {
+    return () => {
+      texture.dispose();
+    };
+  }, [texture]);
+  return null;
+}
+function EnvironmentPortal({
+  children,
+  near = 0.1,
+  far = 1e3,
+  resolution = 256,
+  frames = 1,
+  map,
+  background = false,
+  blur,
+  backgroundBlurriness,
+  backgroundIntensity,
+  backgroundRotation,
+  environmentIntensity,
+  environmentRotation,
+  scene,
+  files,
+  path,
+  preset = void 0,
+  extensions
+}) {
+  const renderer = useThree$1((state) => state.renderer);
+  const isLegacy = useThree$1((state) => state.isLegacy);
+  const defaultScene = useThree$1((state) => state.scene);
+  const camera = React.useRef(null);
+  const [virtualScene] = React.useState(() => new Scene());
+  const fbo = React.useMemo(() => {
+    const fbo2 = isLegacy ? new WebGLCubeRenderTarget(resolution) : new CubeRenderTarget(resolution);
+    fbo2.texture.type = HalfFloatType;
+    return fbo2;
+  }, [resolution, isLegacy]);
+  React.useEffect(() => {
+    return () => {
+      fbo.dispose();
+    };
+  }, [fbo]);
+  React.useLayoutEffect(() => {
+    if (frames === 1) {
+      const autoClear = renderer.autoClear;
+      renderer.autoClear = true;
+      camera.current.update(renderer, virtualScene);
+      renderer.autoClear = autoClear;
+    }
+    return setEnvProps(background, scene, defaultScene, fbo.texture, {
+      backgroundBlurriness: blur ?? backgroundBlurriness,
+      backgroundIntensity,
+      backgroundRotation,
+      environmentIntensity,
+      environmentRotation
+    });
+  }, [
+    children,
+    virtualScene,
+    fbo.texture,
+    scene,
+    defaultScene,
+    background,
+    frames,
+    renderer,
+    blur,
+    backgroundBlurriness,
+    backgroundIntensity,
+    backgroundRotation,
+    environmentIntensity,
+    environmentRotation
+  ]);
+  let count = 1;
+  useFrame$1(() => {
+    if (frames === Infinity || count < frames) {
+      const autoClear = renderer.autoClear;
+      renderer.autoClear = true;
+      camera.current.update(renderer, virtualScene);
+      renderer.autoClear = autoClear;
+      count++;
+    }
+  });
+  return /* @__PURE__ */ jsx(Fragment, { children: createPortal(
+    /* @__PURE__ */ jsxs(Fragment, { children: [
+      children,
+      /* @__PURE__ */ jsx("cubeCamera", { ref: camera, args: [near, far, fbo] }),
+      files || preset ? /* @__PURE__ */ jsx(EnvironmentCube, { background: true, files, preset, path, extensions }) : map ? /* @__PURE__ */ jsx(EnvironmentMap, { background: true, map, extensions }) : null
+    ] }),
+    virtualScene
+  ) });
+}
+function EnvironmentGround(props) {
+  const textureDefault = useEnvironment(props);
+  const texture = props.map || textureDefault;
+  React.useMemo(() => extend({ GroundProjectedEnvImpl: GroundedSkybox }), []);
+  React.useEffect(() => {
+    return () => {
+      textureDefault.dispose();
+    };
+  }, [textureDefault]);
+  const height = props.ground?.height ?? 15;
+  const radius = props.ground?.radius ?? 60;
+  const scale = props.ground?.scale ?? 1e3;
+  const args = React.useMemo(
+    () => [texture, height, radius],
+    [texture, height, radius]
+  );
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(EnvironmentMap, { ...props, map: texture }),
+    /* @__PURE__ */ jsx("groundProjectedEnvImpl", { args, scale })
+  ] });
+}
+function EnvironmentColor({ color, scene }) {
+  const defaultScene = useThree$1((state) => state.scene);
+  React.useLayoutEffect(() => {
+    if (color === void 0) return;
+    const target = resolveScene(scene || defaultScene);
+    const oldBg = target.background;
+    target.background = new Color(color);
+    return () => {
+      target.background = oldBg;
+    };
+  });
+  return null;
+}
+function EnvironmentDualSource(props) {
+  const { backgroundFiles, ...envProps } = props;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(EnvironmentCube, { ...envProps, background: false }),
+    /* @__PURE__ */ jsx(EnvironmentCube, { ...props, files: backgroundFiles, background: "only" })
+  ] });
+}
+function Environment(props) {
+  if (props.color && !props.files && !props.preset && !props.map) {
+    return /* @__PURE__ */ jsx(EnvironmentColor, { ...props });
+  }
+  if (props.backgroundFiles && props.backgroundFiles !== props.files) {
+    return /* @__PURE__ */ jsx(EnvironmentDualSource, { ...props });
+  }
+  return props.ground ? /* @__PURE__ */ jsx(EnvironmentGround, { ...props }) : props.map ? /* @__PURE__ */ jsx(EnvironmentMap, { ...props }) : props.children ? /* @__PURE__ */ jsx(EnvironmentPortal, { ...props }) : /* @__PURE__ */ jsx(EnvironmentCube, { ...props });
+}
+
 function parseBackground(background) {
   if (!background) return null;
   if (typeof background === "object" && !background.isColor) {
@@ -14962,9 +15157,9 @@ function CanvasImpl({
   React.useMemo(() => extend(THREE), []);
   const Bridge = useBridge();
   const backgroundProps = React.useMemo(() => parseBackground(background), [background]);
-  const hasInitialSizeRef = React.useRef(false);
+  const [hasInitialSize, setHasInitialSize] = React.useState(false);
   const measureConfig = React.useMemo(() => {
-    if (!hasInitialSizeRef.current) {
+    if (!hasInitialSize) {
       return {
         ...resize,
         scroll: resize?.scroll ?? true,
@@ -14976,7 +15171,7 @@ function CanvasImpl({
       debounce: { scroll: 50, resize: 0 },
       ...resize
     };
-  }, [resize, hasInitialSizeRef.current]);
+  }, [hasInitialSize, resize]);
   const [containerRef, containerRect] = useMeasure(measureConfig);
   const effectiveSize = React.useMemo(() => {
     let w = width ?? containerRect.width;
@@ -14992,9 +15187,7 @@ function CanvasImpl({
       left: containerRect.left
     };
   }, [width, height, containerRect, forceEven]);
-  if (!hasInitialSizeRef.current && effectiveSize.width > 0 && effectiveSize.height > 0) {
-    hasInitialSizeRef.current = true;
-  }
+  if (!hasInitialSize && effectiveSize.width > 0 && effectiveSize.height > 0) setHasInitialSize(true);
   const canvasRef = React.useRef(null);
   const divRef = React.useRef(null);
   React.useImperativeHandle(ref, () => canvasRef.current);
@@ -15059,7 +15252,7 @@ function CanvasImpl({
           onDropMissed: (...args) => handleDropMissed.current?.(...args),
           onCreated: (state) => {
             state.events.connect?.(
-              eventSource ? isRef(eventSource) ? eventSource.current : eventSource : divRef.current
+              eventSource ? isRef$1(eventSource) ? eventSource.current : eventSource : divRef.current
             );
             if (eventPrefix) {
               state.setEvents({
@@ -15108,6 +15301,7 @@ function CanvasImpl({
     const canvas = canvasRef.current;
     if (canvas) {
       return () => {
+        if (canvas.isConnected) return;
         unmountComponentAtNode(canvas);
         root.current = null;
       };
@@ -15166,20 +15360,36 @@ function CanvasImpl({
     }
   );
 }
-function Canvas(props) {
+function Canvas$1(props) {
   return /* @__PURE__ */ jsx(FiberProvider, { children: /* @__PURE__ */ jsx(CanvasImpl, { ...props }) });
 }
 
+const isObjectLike = (value) => value !== null && (typeof value === "object" || typeof value === "function");
+const hasValidLegacyNodeMarkers = (value) => {
+  const hasUuid = "uuid" in value;
+  const hasNodeType = "nodeType" in value;
+  const uuid = Reflect.get(value, "uuid");
+  const nodeType = Reflect.get(value, "nodeType");
+  return (hasUuid || hasNodeType) && (!hasUuid || uuid === void 0 || typeof uuid === "string") && (!hasNodeType || nodeType === void 0 || nodeType === null || typeof nodeType === "string");
+};
+const isUniformNode = (value) => isObjectLike(value) && "isUniformNode" in value && value.isUniformNode === true;
+const isTSLNode = (value) => isObjectLike(value) && (Reflect.get(value, "isNode") === true || Reflect.get(value, "shaderNode") !== void 0 && typeof Reflect.get(value, "id") === "number" || hasValidLegacyNodeMarkers(value));
+const isBufferLike = (value) => ArrayBuffer.isView(value) && !(value instanceof DataView) || isObjectLike(value) && ("isBufferAttribute" in value || "isInterleavedBufferAttribute" in value || isTSLNode(value));
+const isStorageLike = (value) => isObjectLike(value) && ("isTexture" in value || "isData3DTexture" in value || isTSLNode(value));
+
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-var _a;
+var _a, _b;
 const INTERNAL_DATA = Symbol("ScopedStore.data");
-_a = INTERNAL_DATA;
+const INTERNAL_IS_LEAF = Symbol("ScopedStore.isLeaf");
+_b = INTERNAL_DATA, _a = INTERNAL_IS_LEAF;
 const _ScopedStore = class _ScopedStore {
-  constructor(data) {
+  constructor(data, isLeaf) {
+    __publicField(this, _b);
     __publicField(this, _a);
     this[INTERNAL_DATA] = data;
+    this[INTERNAL_IS_LEAF] = isLeaf;
     return new Proxy(this, {
       get(target, prop, receiver) {
         if (typeof prop === "string") {
@@ -15213,10 +15423,10 @@ const _ScopedStore = class _ScopedStore {
    * If the key doesn't exist or isn't a scope object, returns an empty ScopedStore.
    */
   scope(key) {
-    const data = this[INTERNAL_DATA][key];
-    return new _ScopedStore(
-      data && typeof data === "object" ? data : {}
-    );
+    const value = this[INTERNAL_DATA][key];
+    const isLeaf = this[INTERNAL_IS_LEAF];
+    const scope = value && typeof value === "object" && !isLeaf(value) ? value : {};
+    return new _ScopedStore(scope, isLeaf);
   }
   /**
    * Check if a key exists in the store.
@@ -15232,8 +15442,8 @@ const _ScopedStore = class _ScopedStore {
   }
 };
 let ScopedStore = _ScopedStore;
-function createScopedStore(data) {
-  return new ScopedStore(data);
+function createScopedStore(data, isLeaf) {
+  return new ScopedStore(data, isLeaf);
 }
 function createLazyCreatorState(state, store) {
   let _uniforms = null;
@@ -15244,22 +15454,22 @@ function createLazyCreatorState(state, store) {
   return Object.create(state, {
     uniforms: {
       get() {
-        return _uniforms ?? (_uniforms = createScopedStore(view("uniforms")));
+        return _uniforms ?? (_uniforms = createScopedStore(view("uniforms"), isUniformNode));
       }
     },
     nodes: {
       get() {
-        return _nodes ?? (_nodes = createScopedStore(view("nodes")));
+        return _nodes ?? (_nodes = createScopedStore(view("nodes"), isTSLNode));
       }
     },
     buffers: {
       get() {
-        return _buffers ?? (_buffers = createScopedStore(view("buffers")));
+        return _buffers ?? (_buffers = createScopedStore(view("buffers"), isBufferLike));
       }
     },
     gpuStorage: {
       get() {
-        return _gpuStorage ?? (_gpuStorage = createScopedStore(view("gpuStorage")));
+        return _gpuStorage ?? (_gpuStorage = createScopedStore(view("gpuStorage"), isStorageLike));
       }
     }
   });
@@ -15318,6 +15528,11 @@ function createTextureOperations(set) {
     removeMultiple: (keys) => removeTextures(set, keys)
   };
 }
+function scopedNodeName(scope, name) {
+  const raw = scope ? `${scope}_${name}` : name;
+  const safe = raw.replace(/[^A-Za-z0-9_]/g, "_");
+  return /^[A-Za-z_]/.test(safe) ? safe : `_${safe}`;
+}
 function extractTSLValue(value) {
   if (value === null || value === void 0) return value;
   if (typeof value !== "object") return value;
@@ -15355,7 +15570,7 @@ function vectorize(inObject) {
     return extractTSLValue(inObject);
   }
   if (obj.isVector2 || obj.isVector3 || obj.isVector4) return inObject;
-  if (obj.isMatrix3 || obj.isMatrix4) return inObject;
+  if (obj.isMatrix2 || obj.isMatrix3 || obj.isMatrix4) return inObject;
   if (obj.isColor || obj.isEuler || obj.isQuaternion || obj.isSpherical) return inObject;
   if ("r" in obj && "g" in obj && "b" in obj && typeof obj.r === "number" && typeof obj.g === "number" && typeof obj.b === "number") {
     const scale = obj.r > 1 || obj.g > 1 || obj.b > 1 ? 1 / 255 : 1;
@@ -15413,22 +15628,21 @@ function useScopedResource(options) {
   return entries;
 }
 
-const isUniformNode$1 = (value) => value !== null && typeof value === "object" && "value" in value && "uuid" in value;
 function useUniforms(creatorOrScope, scope) {
   const store = usePrimaryStore();
   const removeUniforms2 = useCallback(
-    (names, targetScope) => removeResourceEntries(store, "uniforms", Array.isArray(names) ? names : [names], targetScope, isUniformNode$1),
+    (names, targetScope) => removeResourceEntries(store, "uniforms", Array.isArray(names) ? names : [names], targetScope, isUniformNode),
     [store]
   );
   const clearUniforms = useCallback(
-    (targetScope) => clearResourceEntries(store, "uniforms", targetScope, isUniformNode$1),
+    (targetScope) => clearResourceEntries(store, "uniforms", targetScope, isUniformNode),
     [store]
   );
   const rebuildUniforms = useCallback(
     (targetScope) => rebuildResource(store, "uniforms", targetScope),
     [store]
   );
-  const inputForMemoization = useMemo(() => {
+  const processedInput = useMemo(() => {
     let raw = creatorOrScope;
     if (is.fun(creatorOrScope)) {
       const wrappedState = createLazyCreatorState(store.getState(), store);
@@ -15439,23 +15653,24 @@ function useUniforms(creatorOrScope, scope) {
       for (const [key, value] of Object.entries(raw)) {
         normalized[key] = vectorize(value);
       }
-      return normalized;
+      return { candidates: raw, normalized };
     }
-    return raw;
+    return { candidates: raw, normalized: raw };
   }, [creatorOrScope, store]);
-  const memoizedInput = useCompareMemoize(inputForMemoization);
+  const memoizedInput = useCompareMemoize(processedInput.normalized);
   const isReader = memoizedInput === void 0 || typeof memoizedInput === "string";
   const storeUniforms = usePrimaryThree((s) => s.uniforms);
   const created = useScopedResource({
     store,
     kind: "uniforms",
     scope: isReader ? void 0 : scope,
-    isLeaf: isUniformNode$1,
+    isLeaf: isUniformNode,
     input: memoizedInput,
     create: () => {
       if (isReader) return {};
-      if (typeof memoizedInput !== "object" || memoizedInput === null) throw new Error("Invalid uniform input");
-      return memoizedInput;
+      if (typeof processedInput.candidates !== "object" || processedInput.candidates === null)
+        throw new Error("Invalid uniform input");
+      return processedInput.candidates;
     },
     prepare: (name, candidate) => createUniform(name, candidate, scope),
     reconcile: (existing, candidate) => {
@@ -15477,7 +15692,7 @@ function useUniforms(creatorOrScope, scope) {
     uniforms = storeUniforms;
   } else if (typeof memoizedInput === "string") {
     const scopeData = storeUniforms[memoizedInput];
-    uniforms = scopeData && !isUniformNode$1(scopeData) ? scopeData : {};
+    uniforms = scopeData && !isUniformNode(scopeData) ? scopeData : {};
   }
   return { ...uniforms, removeUniforms: removeUniforms2, clearUniforms, rebuildUniforms };
 }
@@ -15492,7 +15707,7 @@ function removeUniforms(set, names, scope) {
       return { uniforms: { ...state.uniforms, [scope]: currentScope } };
     }
     const uniforms = { ...state.uniforms };
-    for (const name of names) if (isUniformNode$1(uniforms[name])) delete uniforms[name];
+    for (const name of names) if (isUniformNode(uniforms[name])) delete uniforms[name];
     return { uniforms };
   });
 }
@@ -15506,7 +15721,7 @@ function clearRootUniforms(set) {
   set((state) => {
     const uniforms = {};
     for (const [key, value] of Object.entries(state.uniforms)) {
-      if (!isUniformNode$1(value)) uniforms[key] = value;
+      if (!isUniformNode(value)) uniforms[key] = value;
     }
     return { uniforms };
   });
@@ -15516,8 +15731,7 @@ function createUniform(inName, node, scope) {
   const inValue = vectorize(node);
   const newUniform = uniform(inValue);
   if (typeof newUniform.setName === "function") {
-    const name = scope ? `${scope}_${inName}` : inName;
-    newUniform.setName(name);
+    newUniform.setName(scopedNodeName(scope, inName));
   }
   return newUniform;
 }
@@ -15543,12 +15757,10 @@ function hasEqualsMethod(value) {
 function isSameThreeType(a, b) {
   const obj_a = a;
   const obj_b = b;
-  return obj_a.isColor && obj_b.isColor || obj_a.isMatrix3 && obj_b.isMatrix3 || obj_a.isMatrix4 && obj_b.isMatrix4 || obj_a.isEuler && obj_b.isEuler || obj_a.isQuaternion && obj_b.isQuaternion;
+  return obj_a.isColor && obj_b.isColor || obj_a.isMatrix2 && obj_b.isMatrix2 || obj_a.isMatrix3 && obj_b.isMatrix3 || obj_a.isMatrix4 && obj_b.isMatrix4 || obj_a.isEuler && obj_b.isEuler || obj_a.isQuaternion && obj_b.isQuaternion;
 }
 
 const uniformOf = uniform;
-const isUniformNode = (value) => value !== null && typeof value === "object" && "value" in value && "uuid" in value;
-const isTSLNode$1 = (value) => value !== null && typeof value === "object" && "uuid" in value && "nodeType" in value;
 function useUniform(name, value) {
   const store = useStore();
   const registered = useScopedResource({
@@ -15560,7 +15772,7 @@ function useUniform(name, value) {
     create: () => value === void 0 ? {} : { [name]: value },
     prepare: createNamedUniform,
     reconcile: (existing2) => {
-      if (value !== void 0 && !isTSLNode$1(value) && !isUniformNode(value)) {
+      if (value !== void 0 && !isTSLNode(value) && !isUniformNode(value)) {
         existing2.value = typeof value === "string" ? new Color(value) : value;
       }
     }
@@ -15576,7 +15788,7 @@ function createNamedUniform(name, value) {
   let node;
   if (isUniformNode(value)) {
     node = value;
-  } else if (isTSLNode$1(value)) {
+  } else if (isTSLNode(value)) {
     node = uniformOf(value);
   } else if (typeof value === "string") {
     node = uniform(new Color(value));
@@ -15589,7 +15801,6 @@ function createNamedUniform(name, value) {
   return node;
 }
 
-const isTSLNode = (value) => value !== null && typeof value === "object" && ("uuid" in value || "nodeType" in value);
 function useNodes(creatorOrScope, scope) {
   const store = usePrimaryStore();
   const removeNodes2 = useCallback(
@@ -15616,7 +15827,8 @@ function useNodes(creatorOrScope, scope) {
       return creatorOrScope(createLazyCreatorState(store.getState(), store));
     },
     prepare: (name, node) => {
-      node.setName?.(scope ? `${scope}.${name}` : name);
+      const setName = Reflect.get(node, "setName");
+      if (typeof setName === "function") setName.call(node, scopedNodeName(scope, name));
       return node;
     }
   });
@@ -15671,13 +15883,6 @@ function useLocalNodes(creator) {
   }, [store, creator, uniforms, nodes, textures, hmrVersion]);
 }
 
-const isBufferLike = (value) => {
-  if (value === null || typeof value !== "object") return false;
-  if (ArrayBuffer.isView(value)) return true;
-  if ("isBufferAttribute" in value) return true;
-  if ("uuid" in value || "nodeType" in value) return true;
-  return false;
-};
 const disposeBuffer = (buffer) => {
   if (buffer === null || typeof buffer !== "object") return;
   if ("dispose" in buffer && typeof buffer.dispose === "function") {
@@ -15724,9 +15929,8 @@ function useBuffers(creatorOrScope, scope) {
       return creatorOrScope(createLazyCreatorState(store.getState(), store));
     },
     prepare: (name, buffer) => {
-      if ("setName" in buffer && typeof buffer.setName === "function") {
-        buffer.setName(scope ? `${scope}.${name}` : name);
-      }
+      const setName = Reflect.get(buffer, "setName");
+      if (typeof setName === "function") setName.call(buffer, scopedNodeName(scope, name));
       return buffer;
     }
   });
@@ -15743,13 +15947,6 @@ function rebuildAllBuffers(store, scope) {
   rebuildResource(store, "buffers", scope);
 }
 
-const isStorageLike = (value) => {
-  if (value === null || typeof value !== "object") return false;
-  if ("isTexture" in value) return true;
-  if ("isData3DTexture" in value) return true;
-  if ("uuid" in value || "nodeType" in value) return true;
-  return false;
-};
 const disposeStorage = (storage) => {
   if (storage === null || typeof storage !== "object") return;
   if ("dispose" in storage && typeof storage.dispose === "function") {
@@ -15796,10 +15993,9 @@ function useGPUStorage(creatorOrScope, scope) {
       return creatorOrScope(createLazyCreatorState(store.getState(), store));
     },
     prepare: (name, storage) => {
-      const label = scope ? `${scope}.${name}` : name;
-      if ("setName" in storage && typeof storage.setName === "function") {
-        storage.setName(label);
-      }
+      const label = scopedNodeName(scope, name);
+      const setName = Reflect.get(storage, "setName");
+      if (typeof setName === "function") setName.call(storage, label);
       if ("name" in storage && typeof storage.name === "string") {
         storage.name = label;
       }
@@ -15827,9 +16023,10 @@ function rebuildAllStorage(store, scope) {
 
 function useRenderPipeline(mainCB, setupCB) {
   const store = useStore();
-  const { scene, camera, renderer, isLegacy } = useThree();
+  const { scene, camera, renderer, isLegacy } = useThree$1();
   const callbacksRanRef = useRef(false);
   const scenePassCacheRef = useRef(null);
+  const forceScenePassRebuildRef = useRef(false);
   const mainCBRef = useRef(mainCB);
   const setupCBRef = useRef(setupCB);
   mainCBRef.current = mainCB;
@@ -15837,7 +16034,7 @@ function useRenderPipeline(mainCB, setupCB) {
   const [rebuildVersion, setRebuildVersion] = useState(0);
   useEffect(() => {
     callbacksRanRef.current = false;
-    scenePassCacheRef.current = null;
+    forceScenePassRebuildRef.current = true;
   }, []);
   const clearPasses = useCallback(() => {
     store.setState({ passes: {} });
@@ -15847,12 +16044,14 @@ function useRenderPipeline(mainCB, setupCB) {
       renderPipeline: null,
       passes: {}
     });
+    scenePassCacheRef.current?.scenePass.dispose();
     callbacksRanRef.current = false;
     scenePassCacheRef.current = null;
+    forceScenePassRebuildRef.current = false;
   }, [store]);
   const rebuild = useCallback(() => {
     callbacksRanRef.current = false;
-    scenePassCacheRef.current = null;
+    forceScenePassRebuildRef.current = true;
     setRebuildVersion((v) => v + 1);
   }, []);
   useLayoutEffect(() => {
@@ -15860,6 +16059,9 @@ function useRenderPipeline(mainCB, setupCB) {
       throw new Error("useRenderPipeline is only available with WebGPU renderer. Set renderer prop on Canvas.");
     }
     if (!renderer || !scene || !camera) return;
+    if (!("isWebGPURenderer" in renderer)) {
+      throw new Error("useRenderPipeline: renderer is not a WebGPURenderer but isLegacy is false.");
+    }
     const state = store.getState();
     const set = store.setState;
     try {
@@ -15870,21 +16072,33 @@ function useRenderPipeline(mainCB, setupCB) {
         pipeline = new RenderPipeline(renderer);
         justCreatedPipeline = true;
       }
-      const cacheValid = scenePassCacheRef.current && scenePassCacheRef.current.sceneUuid === scene.uuid && scenePassCacheRef.current.cameraUuid === camera.uuid;
+      const cacheValid = !forceScenePassRebuildRef.current && scenePassCacheRef.current && scenePassCacheRef.current.sceneUuid === scene.uuid && scenePassCacheRef.current.cameraUuid === camera.uuid;
+      let outgoingScenePass = null;
       let scenePass;
       if (cacheValid) {
         scenePass = scenePassCacheRef.current.scenePass;
       } else {
+        outgoingScenePass = scenePassCacheRef.current?.scenePass ?? null;
         scenePass = pass(scene, camera);
         scenePassCacheRef.current = { sceneUuid: scene.uuid, cameraUuid: camera.uuid, scenePass };
+        forceScenePassRebuildRef.current = false;
       }
       currentPasses.scenePass = scenePass;
-      if (!pipeline.outputNode || justCreatedPipeline) pipeline.outputNode = scenePass;
+      let outputNodeChanged = false;
+      if (!pipeline.outputNode || justCreatedPipeline || pipeline.outputNode === outgoingScenePass) {
+        pipeline.outputNode = scenePass;
+        outputNodeChanged = true;
+      }
       set({ renderPipeline: pipeline, passes: currentPasses });
       const shouldRunCallbacks = justCreatedPipeline || !callbacksRanRef.current || !cacheValid;
       if (shouldRunCallbacks) {
         if (setupCBRef.current) {
-          const freshState = store.getState();
+          const freshState = Object.assign({}, store.getState(), {
+            renderPipeline: pipeline,
+            passes: { ...currentPasses, scenePass },
+            renderer,
+            isLegacy: false
+          });
           const setupResult = setupCBRef.current(freshState);
           if (setupResult && typeof setupResult === "object") {
             currentPasses = { ...currentPasses, ...setupResult };
@@ -15892,32 +16106,37 @@ function useRenderPipeline(mainCB, setupCB) {
           }
         }
         if (mainCBRef.current) {
-          const freshState = store.getState();
+          const freshState = Object.assign({}, store.getState(), {
+            renderPipeline: pipeline,
+            passes: { ...currentPasses, scenePass },
+            renderer,
+            isLegacy: false
+          });
           const mainResult = mainCBRef.current(freshState);
           if (mainResult && typeof mainResult === "object") {
             currentPasses = { ...currentPasses, ...mainResult };
             set({ passes: currentPasses });
           }
         }
+        outputNodeChanged = true;
         callbacksRanRef.current = true;
       }
+      if (outputNodeChanged) pipeline.needsUpdate = true;
+      if (outgoingScenePass && outgoingScenePass !== scenePass) outgoingScenePass.dispose();
     } catch (error) {
       console.warn("[useRenderPipeline] Setup failed; the render pipeline was not configured:", error);
     }
   }, [store, renderer, scene, camera, isLegacy, rebuildVersion]);
-  const passes = useThree((s) => s.passes);
-  const renderPipeline = useThree((s) => s.renderPipeline);
-  return {
-    passes,
-    renderPipeline,
-    clearPasses,
-    reset,
-    rebuild,
-    // isReady indicates if RenderPipeline is configured and ready for rendering
-    isReady: renderPipeline !== null
-  };
+  const passes = useThree$1((s) => s.passes);
+  const renderPipeline = useThree$1((s) => s.renderPipeline);
+  const actions = { passes, clearPasses, reset, rebuild };
+  if (renderPipeline) return { ...actions, isReady: true, renderPipeline };
+  return { ...actions, isReady: false, renderPipeline: null };
 }
 
 extend(THREE);
+const useThree = useThree$1;
+const useFrame = useFrame$1;
+const Canvas = Canvas$1;
 
-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, clearNodeScope, clearRootNodes, clearRootUniforms, clearScope, context, createEvents, createPointerEvents, createPortal, createRoot, createScopedStore, createStore, createTextureOperations, detach, diffProps, dispose, createPointerEvents as events, extend, findInitialRoot, flushSync, fromRef, getInstanceProps, getPrimary, getPrimaryIds, getRootState, getUuidPrefix, hasConstructor, hasPrimary, invalidate, invalidateInstance, is, isColorRepresentation, isCopyable, isFromRef, isObject3D, isOnce, isOrthographicCamera, isRef, isRenderer, isTexture, isVectorLike, once, prepare, presetsObj, rebuildAllBuffers, rebuildAllNodes, rebuildAllStorage, rebuildAllUniforms, reconciler, registerPrimary, removeInteractivity, removeNodes, removeUniforms, resolve, unmountComponentAtNode, unregisterPrimary, updateCamera, updateFrustum, useBridge, useBuffers, useEnvironment, useFrame, useGPUStorage, useGraph, useInstanceHandle, useIsomorphicLayoutEffect, useLoader, useLocalNodes, useMutableCallback, useNodes, useRenderPipeline, useRenderTarget, useStore, useTexture, useTextures, useThree, useUniform, useUniforms, waitForPrimary };
+export { Block, Canvas, Environment, EnvironmentCube, EnvironmentMap, EnvironmentPortal, ErrorBoundary, FROM_REF, IsObject, ONCE, Portal, R3F_BUILD_LEGACY, R3F_BUILD_WEBGPU, REACT_INTERNAL_PROPS, RESERVED_PROPS, Texture, _roots, addAfterEffect, addEffect, addTail, advance, applyProps, attach, buildGraph, calculateDpr, clearNodeScope, clearRootNodes, clearRootUniforms, clearScope, context, createEvents, createPointerEvents, createPortal, createRoot, createScopedStore, createStore, createTextureOperations, detach, diffProps, dispose, createPointerEvents as events, extend, findInitialRoot, flushSync, fromRef, getInstanceProps, getPrimary, getPrimaryIds, getRootState, getUuidPrefix, hasConstructor, hasPrimary, invalidate, invalidateInstance, is, isColorRepresentation, isCopyable, isFromRef, isObject3D, isOnce, isOrthographicCamera, isRef$1 as isRef, isRenderer, isTexture, isVectorLike, once, prepare, presetsObj, rebuildAllBuffers, rebuildAllNodes, rebuildAllStorage, rebuildAllUniforms, reconciler, registerPrimary, removeInteractivity, removeNodes, removeUniforms, resolve, swapInteractivity, unmountComponentAtNode, unregisterPrimary, updateCamera, updateFrustum, useBridge, useBuffers, useEnvironment, useFrame, useGPUStorage, useGraph, useInstanceHandle, useIsomorphicLayoutEffect, useLoader, useLocalNodes, useMutableCallback, useNodes, useRenderPipeline, useRenderTarget, useStore, useTexture, useTextures, useThree, useUniform, useUniforms, waitForPrimary };