@react-three/fiber 10.0.0-canary.1be335a → 10.0.0-canary.27df622

package/dist/index.mjs

@@ -1,22 +1,21 @@
 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 } from 'three/webgpu';
+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 } from 'three/webgpu';
 import { WebGLCubeRenderTarget, WebGLRenderTarget, WebGLRenderer } from 'three';
-import { Inspector } from 'three/addons/inspector/Inspector.js';
 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_getCurrentPriorityLevel, unstable_IdlePriority, unstable_LowPriority, unstable_NormalPriority, unstable_UserBlockingPriority, unstable_ImmediatePriority, unstable_scheduleCallback } 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';
 
 function _mergeNamespaces(n, m) {
@@ -33,18 +32,22 @@ function _mergeNamespaces(n, m) {
 
 const R3F_BUILD_LEGACY = true;
 const R3F_BUILD_WEBGPU = true;
+async function loadInspector() {
+  const { Inspector } = await import('three/addons/inspector/Inspector.js');
+  return Inspector;
+}
 
 const THREE = /*#__PURE__*/_mergeNamespaces({
   __proto__: null,
   CubeRenderTarget: CubeRenderTarget,
   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();
@@ -105,556 +108,229 @@ 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 = 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);
+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(this, "state", { error: false });
+    }
+    componentDidCatch(err) {
+      this.props.set(err);
+    }
+    render() {
+      return this.state.error ? null : this.props.children;
+    }
+  }, __publicField(_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
-  ) });
-}
-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 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;
+  }
+  return data;
 }
-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 dispose(obj) {
+  if (obj.type !== "Scene") obj.dispose?.();
+  for (const p in obj) {
+    const prop = obj[p];
+    if (prop?.type !== "Scene") prop?.dispose?.();
+  }
 }
-function Environment(props) {
-  if (props.color && !props.files && !props.preset && !props.map) {
-    return /* @__PURE__ */ jsx(EnvironmentColor, { ...props });
+function getInstanceProps(pendingProps) {
+  const props = {};
+  for (const key in pendingProps) {
+    if (!REACT_INTERNAL_PROPS.includes(key)) props[key] = pendingProps[key];
   }
-  if (props.backgroundFiles && props.backgroundFiles !== props.files) {
-    return /* @__PURE__ */ jsx(EnvironmentDualSource, { ...props });
+  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 props.ground ? /* @__PURE__ */ jsx(EnvironmentGround, { ...props }) : props.map ? /* @__PURE__ */ jsx(EnvironmentMap, { ...props }) : props.children ? /* @__PURE__ */ jsx(EnvironmentPortal, { ...props }) : /* @__PURE__ */ jsx(EnvironmentCube, { ...props });
+  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();
 }
 
-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);
-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;
+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 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(this, "state", { error: false });
-    }
-    componentDidCatch(err) {
-      this.props.set(err);
-    }
-    render() {
-      return this.state.error ? null : this.props.children;
-    }
-  }, __publicField(_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) {
@@ -834,8 +510,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;
@@ -936,11 +614,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[prop] = ctor[key];
-    } else {
-      changedProps[prop] = 0;
     }
   }
   return changedProps;
@@ -1057,635 +733,90 @@ 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);
+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 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);
+  if (shownNotices.has(heading)) return;
+  shownNotices.add(heading);
+  const caller = getCallerFrame();
+  if (caller) {
+    console.log();
   }
-}
-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);
-    }
+  const boxStyle = "background: #ff9800; color: #1a1a1a; padding: 8px 12px; border-radius: 4px; font-weight: 500;";
+  if (caller) {
+    console.log(`%c\u26A0\uFE0F ${heading}`, boxStyle);
   }
-  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));
+  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 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 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+)$/);
   }
-  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;
+  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;
   }
-  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;
+  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;");
   }
-  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 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 };
       }
     }
     let performanceTimeout = void 0;
@@ -1775,7 +906,7 @@ const createStore = (invalidate, advance) => {
                 size: newSize,
                 viewport: { ...s.viewport, ...getCurrentViewport(state2.camera, defaultTarget, newSize) }
               }));
-              getScheduler().invalidate();
+              get().invalidate();
             }
           }
           return;
@@ -1790,15 +921,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,
@@ -1914,17 +1046,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;
@@ -1945,7 +1071,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) {
@@ -1958,7 +1084,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) => {
@@ -1986,7 +1112,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];
@@ -1999,7 +1129,7 @@ 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) {
   const store = React.useContext(context);
@@ -2106,6 +1236,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.
@@ -2122,6 +1259,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.
@@ -2151,6 +1296,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));
 }
@@ -2176,24 +1326,37 @@ function useTexture(input, optionsOrOnLoad) {
   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) {
@@ -2212,30 +1375,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]]);
       }
     }
@@ -2264,7 +1415,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);
@@ -2365,7 +1516,128 @@ function useRenderTarget(widthOrOptions, heightOrOptions, options) {
     {
       return isLegacy ? new WebGLRenderTarget(w, h, opts) : new RenderTarget(w, h, opts);
     }
-  }, [width, height, size.width, size.height, opts, isLegacy]);
+  }, [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((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() {
@@ -2385,6 +1657,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({
@@ -2413,13 +1687,19 @@ 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};
 
@@ -13287,395 +12567,978 @@ Check the top-level render call using <` + i + ">.");
         } finally {
           x.H = o;
         }
-      }, useReducer: function(e, n, o) {
-        z = "useReducer", D(), N();
-        var i = x.H;
-        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 {
-          return Br(e, n, o);
-        } finally {
-          x.H = i;
+          vt(i);
+          var s = false;
+        } catch {
+          s = true;
         }
-      }, useRef: function() {
-        return z = "useRef", D(), N(), xe().memoizedState;
-      }, useState: function() {
-        z = "useState", D(), N();
-        var e = x.H;
-        x.H = $o;
+        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 Br(gr);
+          return an(32), x.T = null, e();
         } finally {
-          x.H = e;
+          an(o), x.T = n;
         }
-      }, 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;
+      }, le.discreteUpdates = function(e, n, o, i, s) {
+        var u = x.T, f = wt();
         try {
-          return Vi(e, n);
+          return an(2), x.T = null, e(n, o, i, s);
         } finally {
-          x.H = o;
+          an(f), x.T = u, ye === Jn && (Pp = me() + Fg);
         }
-      }, 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;
+      }, 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;
+            }
+          }
         }
-      }, useRef: function() {
-        return z = "useRef", D(), N(), xe().memoizedState;
-      }, useState: function() {
-        z = "useState", D(), N();
-        var e = x.H;
-        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);
+          }));
+        }
+        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(gr);
+          if (an(2), x.T = null, e) return e();
         } finally {
-          x.H = e;
+          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;
+          }
+        }
+        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();
+        }
+      }
+      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);
         }
-      }, 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;
+      }
+      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);
+          }
+        }
+        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);
+          }
         }
-        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;
+        internal.pointerMap.delete(pointerId);
+      }
+      internal.pointerDirty.delete(pointerId);
+    }
+  };
 }
-var t0 = n0();
-const r0 = Xb(t0);
-
-const t = 1, o = 8, r = 32, e = 2, i$1 = 268435456;
 
 function createReconciler(config) {
   const reconciler2 = r0(config);
@@ -13695,7 +13558,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) {
@@ -13866,7 +13732,9 @@ function swapReconstructedInstances() {
       }
     }
     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 +13743,13 @@ function swapReconstructedInstances() {
     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 = {};
@@ -14037,7 +13909,7 @@ 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;
@@ -14064,8 +13936,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);
@@ -14364,9 +14236,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();
               }
@@ -14375,7 +14246,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: {
@@ -14489,7 +14360,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 = () => {
@@ -14497,7 +14368,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() {
@@ -14579,14 +14450,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?.();
+              }
             }
           },
           {
@@ -14655,8 +14535,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 }
           }
         );
@@ -14675,8 +14554,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();
@@ -14718,18 +14610,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) {
@@ -14855,6 +14752,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((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((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((state) => state.renderer);
+  const isLegacy = useThree((state) => state.isLegacy);
+  const defaultScene = useThree((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(() => {
+    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((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) {
@@ -14967,9 +15065,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,
@@ -14981,7 +15079,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;
@@ -14997,9 +15095,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);
@@ -15064,7 +15160,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({
@@ -15113,6 +15209,7 @@ function CanvasImpl({
     const canvas = canvasRef.current;
     if (canvas) {
       return () => {
+        if (canvas.isConnected) return;
         unmountComponentAtNode(canvas);
         root.current = null;
       };
@@ -15177,4 +15274,4 @@ function Canvas(props) {
 
 extend(THREE);
 
-export { Block, Canvas, Environment, EnvironmentCube, EnvironmentMap, EnvironmentPortal, ErrorBoundary, FROM_REF, IsObject, ONCE, Portal, R3F_BUILD_LEGACY, R3F_BUILD_WEBGPU, REACT_INTERNAL_PROPS, RESERVED_PROPS, Texture, _roots, act, addAfterEffect, addEffect, addTail, advance, applyProps, attach, buildGraph, calculateDpr, context, createEvents, createPointerEvents, createPortal, createRoot, createStore, detach, diffProps, dispose, createPointerEvents as events, extend, findInitialRoot, flushSync, fromRef, getInstanceProps, getPrimary, getPrimaryIds, getRootState, getUuidPrefix, hasConstructor, hasPrimary, invalidate, invalidateInstance, is, isColorRepresentation, isCopyable, isFromRef, isObject3D, isOnce, isOrthographicCamera, isRef, isRenderer, isTexture, isVectorLike, once, prepare, presetsObj, reconciler, registerPrimary, removeInteractivity, resolve, unmountComponentAtNode, unregisterPrimary, updateCamera, updateFrustum, useBridge, useEnvironment, useFrame, useGraph, useInstanceHandle, useIsomorphicLayoutEffect, useLoader, useMutableCallback, useRenderTarget, useStore, useTexture, useTextures, useThree, waitForPrimary };
+export { Block, Canvas, Environment, EnvironmentCube, EnvironmentMap, EnvironmentPortal, ErrorBoundary, FROM_REF, IsObject, ONCE, Portal, R3F_BUILD_LEGACY, R3F_BUILD_WEBGPU, REACT_INTERNAL_PROPS, RESERVED_PROPS, Texture, _roots, addAfterEffect, addEffect, addTail, advance, applyProps, attach, buildGraph, calculateDpr, context, createEvents, createPointerEvents, createPortal, createRoot, createStore, detach, diffProps, dispose, createPointerEvents as events, extend, findInitialRoot, flushSync, fromRef, getInstanceProps, getPrimary, getPrimaryIds, getRootState, getUuidPrefix, hasConstructor, hasPrimary, invalidate, invalidateInstance, is, isColorRepresentation, isCopyable, isFromRef, isObject3D, isOnce, isOrthographicCamera, isRef$1 as isRef, isRenderer, isTexture, isVectorLike, once, prepare, presetsObj, reconciler, registerPrimary, removeInteractivity, resolve, swapInteractivity, unmountComponentAtNode, unregisterPrimary, updateCamera, updateFrustum, useBridge, useEnvironment, useFrame, useGraph, useInstanceHandle, useIsomorphicLayoutEffect, useLoader, useMutableCallback, useRenderTarget, useStore, useTexture, useTextures, useThree, waitForPrimary };