@tresjs/cientos 5.3.1 → 5.4.0

package/dist/trescientos.js

@@ -1,12 +1,12 @@
 /**
   * name: @tresjs/cientos
-  * version: v5.3.1
+  * version: v5.4.0
   * (c) 2026
   * description: Collection of useful helpers and fully functional, ready-made abstractions for Tres
   * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
   */
-import { Fragment, Suspense, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, inject, isReactive, isRef, mergeProps, nextTick, normalizeProps, onBeforeUnmount, onMounted, onUnmounted, openBlock, provide, reactive, ref, render, renderList, renderSlot, shallowReactive, shallowRef, toRaw, toRefs, toValue, triggerRef, unref, useAttrs, useSlots, watch, watchEffect, withAsyncContext, withCtx } from "vue";
-import { buildGraph, extend, logError, logWarning, normalizeColor, normalizeVectorFlexibleParam, useLoader, useLoop, useTres, useTresContext } from "@tresjs/core";
+import { Fragment, Suspense, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, inject, isReactive, isRef, mergeDefaults, mergeProps, nextTick, normalizeProps, onBeforeUnmount, onMounted, onUnmounted, openBlock, provide, reactive, ref, render, renderList, renderSlot, shallowReactive, shallowRef, toRaw, toRefs, toValue, triggerRef, unref, useAttrs, useSlots, watch, watchEffect, withAsyncContext, withCtx } from "vue";
+import { buildGraph, extend, isObject3D, logError, logWarning, normalizeColor, normalizeVectorFlexibleParam, useLoader, useLoop, useTres, useTresContext } from "@tresjs/core";
 import * as THREE from "three";
 import { AdditiveBlending, AlwaysStencilFunc, AnimationMixer, Audio, AudioListener, AudioLoader, BackSide, Box2, Box3, BoxGeometry, BufferAttribute, BufferGeometry, Camera, CatmullRomCurve3, ClampToEdgeWrapping, Clock, Color, CubeCamera, CubeReflectionMapping, CubeTextureLoader, CubicBezierCurve3, DataTexture, DefaultLoadingManager, DepthTexture, DirectionalLight, DoubleSide, EdgesGeometry, EqualStencilFunc, EquirectangularReflectionMapping, Euler, FloatType, FramebufferTexture, FrontSide, Group, HalfFloatType, IcosahedronGeometry, InstancedMesh, InterleavedBuffer, InterleavedBufferAttribute, KeepStencilOp, LOD, LinearFilter, MOUSE, MathUtils, Matrix4, Mesh, MeshBasicMaterial, MeshDepthMaterial, MeshLambertMaterial, MeshStandardMaterial, NearestFilter, NoBlending, NotEqualStencilFunc, Object3D, OrthographicCamera, PerspectiveCamera, Plane, PlaneGeometry, Points, PointsMaterial, QuadraticBezierCurve3, Quaternion, REVISION, RGBAFormat, RawShaderMaterial, Raycaster, RepeatWrapping, ReplaceStencilOp, Scene, ShaderChunk, ShaderMaterial, ShapeGeometry, SkinnedMesh, Sphere, Spherical, TOUCH, TangentSpaceNormalMap, Texture, TextureLoader, UVMapping, Uniform, UniformsUtils, UnsignedByteType, Vector2, Vector3, Vector4, VideoTexture, WebGLCubeRenderTarget, WebGLRenderTarget, WebGLRenderer } from "three";
 import { tryOnScopeDispose, useDebounceFn, useElementSize, useEventListener, useMagicKeys, useMouse, useScroll, useWindowScroll, useWindowSize, watchThrottled, whenever } from "@vueuse/core";
@@ -15,6 +15,7 @@ import BaseCameraControls, { default as CameraControls } from "camera-controls";
 import CustomShaderMaterial from "three-custom-shader-material/vanilla";
 import StatsImpl from "stats.js";
 import StatsGlImpl from "stats-gl";
+import { BVHHelper, MeshBVH, acceleratedRaycast } from "three-mesh-bvh";
 
 //#region src/core/abstractions/AnimatedSprite/AtlasAnimationDefinitionParser.ts
 /**
@@ -3594,19 +3595,16 @@ var CameraControls_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		const touches = computed(() => getTouches(props.camera || activeCamera.value, props.touches));
 		const controlsRef = shallowRef(null);
 		extend$1({ CameraControls });
-		watchEffect(() => {
-			addEventListeners();
-			if (controlsRef.value && makeDefault.value) controls.value = controlsRef.value;
-			else controls.value = null;
-		});
-		function addEventListeners() {
-			useEventListener(controlsRef.value, "update", () => {
-				emit("change", controlsRef.value);
+		whenever(controlsRef, (value) => {
+			value.addEventListener("update", () => {
+				controlsRef.value && emit("change", controlsRef.value);
 				invalidate();
 			});
-			useEventListener(controlsRef.value, "controlend", () => emit("end", controlsRef.value));
-			useEventListener(controlsRef.value, "controlstart", () => emit("start", controlsRef.value));
-		}
+			value.addEventListener("controlend", () => controlsRef.value && emit("end", controlsRef.value));
+			value.addEventListener("controlstart", () => controlsRef.value && emit("start", controlsRef.value));
+			if (makeDefault.value) controls.value = value;
+			else controls.value = null;
+		}, { once: true });
 		const { onBeforeRender } = useLoop();
 		onBeforeRender(({ delta }) => {
 			if (controlsRef.value?.enabled) controlsRef.value?.update(delta);
@@ -3764,8 +3762,12 @@ var KeyboardControls_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 			else forwardMove.value = 0;
 		});
 		__expose({ instance: controls });
-		const isActive = (isLock) => emit("isLock", isLock);
-		const hasChange = (state) => emit("change", state);
+		const isActive = (isLock) => {
+			emit("isLock", isLock);
+		};
+		const hasChange = (state) => {
+			emit("change", state);
+		};
 		const moveVector = new Vector3();
 		const rotationVector = new Vector3();
 		const tmpQuaternion = new Quaternion();
@@ -3776,7 +3778,10 @@ var KeyboardControls_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 			camera?.translateZ(-movementSpeed);
 			tmpQuaternion.set(rotationVector.x * rotMult, rotationVector.y * rotMult, rotationVector.z * rotMult, 1).normalize();
 			camera?.quaternion.multiply(tmpQuaternion);
-			if (sidewardMove.value || forwardMove.value) emit("change", controls.value);
+			if (sidewardMove.value || forwardMove.value) {
+				invalidate();
+				emit("change", controls.value);
+			}
 		};
 		const { onBeforeRender } = useLoop();
 		onBeforeRender(({ delta }) => {
@@ -3808,10 +3813,68 @@ var KeyboardControls_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 //#region src/core/controls/KeyboardControls.vue
 var KeyboardControls_default = KeyboardControls_vue_vue_type_script_setup_true_lang_default;
 
+//#endregion
+//#region src/core/controls/useOrbitLikeControls.ts
+/** Shared default values for orbit-like controls (excludes touches, mouseButtons, screenSpacePanning). */
+const ORBIT_LIKE_DEFAULTS = {
+	makeDefault: false,
+	autoRotate: false,
+	autoRotateSpeed: 2,
+	enableDamping: true,
+	dampingFactor: .05,
+	enablePan: true,
+	keyPanSpeed: 7,
+	maxAzimuthAngle: Number.POSITIVE_INFINITY,
+	minAzimuthAngle: Number.NEGATIVE_INFINITY,
+	maxPolarAngle: Math.PI,
+	minPolarAngle: 0,
+	minDistance: 0,
+	maxDistance: Number.POSITIVE_INFINITY,
+	minZoom: 0,
+	maxZoom: Number.POSITIVE_INFINITY,
+	enableZoom: true,
+	zoomSpeed: 1,
+	enableRotate: true,
+	rotateSpeed: 1,
+	target: () => [
+		0,
+		0,
+		0
+	]
+};
+function useOrbitLikeControls(controlsRef, props, emit) {
+	const { controls, invalidate } = useTres();
+	watch(props, () => {
+		invalidate();
+	});
+	whenever(controlsRef, (value) => {
+		value.addEventListener("change", () => {
+			invalidate();
+			if (value) emit("change", controlsRef.value);
+		});
+		value.addEventListener("start", () => {
+			controlsRef.value && emit("start", controlsRef.value);
+		});
+		value.addEventListener("end", () => {
+			controlsRef.value && emit("end", controlsRef.value);
+		});
+		if (props.makeDefault) controls.value = value;
+		else controls.value = null;
+	}, { once: true });
+	const { onBeforeRender } = useLoop();
+	onBeforeRender(() => {
+		if (controlsRef.value && controlsRef.value.enabled && (props.enableDamping || props.autoRotate)) controlsRef.value.update();
+	});
+	onUnmounted(() => {
+		if (controlsRef.value) controlsRef.value.dispose();
+	});
+}
+
 //#endregion
 //#region src/core/controls/MapControls.vue?vue&type=script&setup=true&lang.ts
 const _hoisted_1$45 = [
 	"args",
+	"target",
 	"auto-rotate",
 	"auto-rotate-speed",
 	"enable-damping",
@@ -3827,18 +3890,20 @@ const _hoisted_1$45 = [
 	"max-distance",
 	"min-zoom",
 	"max-zoom",
+	"touches",
 	"enable-zoom",
 	"zoom-speed",
 	"enable-rotate",
-	"rotate-speed"
+	"rotate-speed",
+	"mouse-buttons",
+	"screen-space-panning"
 ];
 var MapControls_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	__name: "MapControls",
-	props: {
+	props: /* @__PURE__ */ mergeDefaults({
 		makeDefault: {
 			type: Boolean,
-			required: false,
-			default: false
+			required: false
 		},
 		camera: {
 			type: Object,
@@ -3854,33 +3919,27 @@ var MapControls_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 		},
 		enableDamping: {
 			type: Boolean,
-			required: false,
-			default: true
+			required: false
 		},
 		dampingFactor: {
 			type: Number,
-			required: false,
-			default: .05
+			required: false
 		},
 		autoRotate: {
 			type: Boolean,
-			required: false,
-			default: false
+			required: false
 		},
 		autoRotateSpeed: {
 			type: Number,
-			required: false,
-			default: 2
+			required: false
 		},
 		enablePan: {
 			type: Boolean,
-			required: false,
-			default: true
+			required: false
 		},
 		keyPanSpeed: {
 			type: Number,
-			required: false,
-			default: 7
+			required: false
 		},
 		keys: {
 			type: Object,
@@ -3888,43 +3947,35 @@ var MapControls_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 		},
 		maxAzimuthAngle: {
 			type: Number,
-			required: false,
-			default: Number.POSITIVE_INFINITY
+			required: false
 		},
 		minAzimuthAngle: {
 			type: Number,
-			required: false,
-			default: Number.NEGATIVE_INFINITY
+			required: false
 		},
 		maxPolarAngle: {
 			type: Number,
-			required: false,
-			default: Math.PI
+			required: false
 		},
 		minPolarAngle: {
 			type: Number,
-			required: false,
-			default: 0
+			required: false
 		},
 		minDistance: {
 			type: Number,
-			required: false,
-			default: 0
+			required: false
 		},
 		maxDistance: {
 			type: Number,
-			required: false,
-			default: Number.POSITIVE_INFINITY
+			required: false
 		},
 		minZoom: {
 			type: Number,
-			required: false,
-			default: 0
+			required: false
 		},
 		maxZoom: {
 			type: Number,
-			required: false,
-			default: Number.POSITIVE_INFINITY
+			required: false
 		},
 		touches: {
 			type: Object,
@@ -3932,25 +3983,41 @@ var MapControls_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 		},
 		enableZoom: {
 			type: Boolean,
-			required: false,
-			default: true
+			required: false
 		},
 		zoomSpeed: {
 			type: Number,
-			required: false,
-			default: 1
+			required: false
 		},
 		enableRotate: {
 			type: Boolean,
-			required: false,
-			default: true
+			required: false
 		},
 		rotateSpeed: {
 			type: Number,
-			required: false,
-			default: 1
+			required: false
+		},
+		mouseButtons: {
+			type: Object,
+			required: false
+		},
+		screenSpacePanning: {
+			type: Boolean,
+			required: false
 		}
-	},
+	}, {
+		...ORBIT_LIKE_DEFAULTS,
+		touches: () => ({
+			ONE: TOUCH.PAN,
+			TWO: TOUCH.DOLLY_ROTATE
+		}),
+		mouseButtons: () => ({
+			LEFT: MOUSE.PAN,
+			MIDDLE: MOUSE.DOLLY,
+			RIGHT: MOUSE.ROTATE
+		}),
+		screenSpacePanning: false
+	}),
 	emits: [
 		"change",
 		"start",
@@ -3959,34 +4026,10 @@ var MapControls_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 	setup(__props, { expose: __expose, emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
-		const { autoRotate, autoRotateSpeed, enableDamping, dampingFactor, enablePan, keyPanSpeed, maxAzimuthAngle, minAzimuthAngle, maxPolarAngle, minPolarAngle, minDistance, maxDistance, minZoom, maxZoom, enableZoom, zoomSpeed, enableRotate, rotateSpeed } = toRefs(props);
-		const { camera: activeCamera, renderer, extend: extend$1, controls, invalidate } = useTres();
-		watch(props, () => {
-			invalidate();
-		});
+		const { camera: activeCamera, renderer, extend: extend$1 } = useTres();
 		const controlsRef = shallowRef(null);
 		extend$1({ MapControls });
-		watch(controls, (value) => {
-			if (value && props.makeDefault) controls.value = value;
-			else controls.value = null;
-		});
-		function onChange() {
-			addEventListeners();
-			invalidate();
-			emit("change", controlsRef.value);
-		}
-		function addEventListeners() {
-			useEventListener(controlsRef.value, "change", onChange);
-			useEventListener(controlsRef.value, "start", () => emit("start", controlsRef.value));
-			useEventListener(controlsRef.value, "end", () => emit("end", controlsRef.value));
-		}
-		const { onBeforeRender } = useLoop();
-		onBeforeRender(() => {
-			if (controlsRef.value && (enableDamping.value || autoRotate.value)) controlsRef.value.update();
-		});
-		onUnmounted(() => {
-			if (controlsRef.value) controlsRef.value.dispose();
-		});
+		useOrbitLikeControls(controlsRef, props, emit);
 		__expose({ instance: controlsRef });
 		return (_ctx, _cache) => {
 			return (__props.camera || unref(activeCamera)) && (__props.domElement || unref(renderer).domElement) ? (openBlock(), createElementBlock("TresMapControls", {
@@ -3994,25 +4037,29 @@ var MapControls_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 				ref_key: "controlsRef",
 				ref: controlsRef,
 				args: [__props.camera || unref(activeCamera), __props.domElement || unref(renderer).domElement],
-				"auto-rotate": unref(autoRotate),
-				"auto-rotate-speed": unref(autoRotateSpeed),
-				"enable-damping": unref(enableDamping),
-				"damping-factor": unref(dampingFactor),
-				"enable-pan": unref(enablePan),
-				"key-pan-speed": unref(keyPanSpeed),
+				target: __props.target,
+				"auto-rotate": __props.autoRotate,
+				"auto-rotate-speed": __props.autoRotateSpeed,
+				"enable-damping": __props.enableDamping,
+				"damping-factor": __props.dampingFactor,
+				"enable-pan": __props.enablePan,
+				"key-pan-speed": __props.keyPanSpeed,
 				keys: __props.keys,
-				"max-azimuth-angle": unref(maxAzimuthAngle),
-				"min-azimuth-angle": unref(minAzimuthAngle),
-				"max-polar-angle": unref(maxPolarAngle),
-				"min-polar-angle": unref(minPolarAngle),
-				"min-distance": unref(minDistance),
-				"max-distance": unref(maxDistance),
-				"min-zoom": unref(minZoom),
-				"max-zoom": unref(maxZoom),
-				"enable-zoom": unref(enableZoom),
-				"zoom-speed": unref(zoomSpeed),
-				"enable-rotate": unref(enableRotate),
-				"rotate-speed": unref(rotateSpeed)
+				"max-azimuth-angle": __props.maxAzimuthAngle,
+				"min-azimuth-angle": __props.minAzimuthAngle,
+				"max-polar-angle": __props.maxPolarAngle,
+				"min-polar-angle": __props.minPolarAngle,
+				"min-distance": __props.minDistance,
+				"max-distance": __props.maxDistance,
+				"min-zoom": __props.minZoom,
+				"max-zoom": __props.maxZoom,
+				touches: __props.touches,
+				"enable-zoom": __props.enableZoom,
+				"zoom-speed": __props.zoomSpeed,
+				"enable-rotate": __props.enableRotate,
+				"rotate-speed": __props.rotateSpeed,
+				"mouse-buttons": __props.mouseButtons,
+				"screen-space-panning": __props.screenSpacePanning
 			}, null, 8, _hoisted_1$45)) : createCommentVNode("v-if", true);
 		};
 	}
@@ -4025,6 +4072,7 @@ var MapControls_default = MapControls_vue_vue_type_script_setup_true_lang_defaul
 //#endregion
 //#region src/core/controls/OrbitControls.vue?vue&type=script&setup=true&lang.ts
 const _hoisted_1$44 = [
+	"args",
 	"target",
 	"auto-rotate",
 	"auto-rotate-speed",
@@ -4047,15 +4095,18 @@ const _hoisted_1$44 = [
 	"enable-rotate",
 	"rotate-speed",
 	"mouse-buttons",
-	"args"
+	"screen-space-panning"
 ];
 var OrbitControls_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	__name: "OrbitControls",
-	props: {
+	props: /* @__PURE__ */ mergeDefaults({
+		mouseButtons: {
+			type: Object,
+			required: false
+		},
 		makeDefault: {
 			type: Boolean,
-			required: false,
-			default: false
+			required: false
 		},
 		camera: {
 			type: Object,
@@ -4067,42 +4118,31 @@ var OrbitControls_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		},
 		target: {
 			type: null,
-			required: false,
-			default: () => [
-				0,
-				0,
-				0
-			]
+			required: false
 		},
 		enableDamping: {
 			type: Boolean,
-			required: false,
-			default: true
+			required: false
 		},
 		dampingFactor: {
 			type: Number,
-			required: false,
-			default: .05
+			required: false
 		},
 		autoRotate: {
 			type: Boolean,
-			required: false,
-			default: false
+			required: false
 		},
 		autoRotateSpeed: {
 			type: Number,
-			required: false,
-			default: 2
+			required: false
 		},
 		enablePan: {
 			type: Boolean,
-			required: false,
-			default: true
+			required: false
 		},
 		keyPanSpeed: {
 			type: Number,
-			required: false,
-			default: 7
+			required: false
 		},
 		keys: {
 			type: Object,
@@ -4110,82 +4150,73 @@ var OrbitControls_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		},
 		maxAzimuthAngle: {
 			type: Number,
-			required: false,
-			default: Number.POSITIVE_INFINITY
+			required: false
 		},
 		minAzimuthAngle: {
 			type: Number,
-			required: false,
-			default: Number.NEGATIVE_INFINITY
+			required: false
 		},
 		maxPolarAngle: {
 			type: Number,
-			required: false,
-			default: Math.PI
+			required: false
 		},
 		minPolarAngle: {
 			type: Number,
-			required: false,
-			default: 0
+			required: false
 		},
 		minDistance: {
 			type: Number,
-			required: false,
-			default: 0
+			required: false
 		},
 		maxDistance: {
 			type: Number,
-			required: false,
-			default: Number.POSITIVE_INFINITY
+			required: false
 		},
 		minZoom: {
 			type: Number,
-			required: false,
-			default: 0
+			required: false
 		},
 		maxZoom: {
 			type: Number,
-			required: false,
-			default: Number.POSITIVE_INFINITY
+			required: false
 		},
 		touches: {
 			type: Object,
-			required: false,
-			default: () => ({
-				ONE: TOUCH.ROTATE,
-				TWO: TOUCH.DOLLY_PAN
-			})
+			required: false
 		},
 		enableZoom: {
 			type: Boolean,
-			required: false,
-			default: true
+			required: false
 		},
 		zoomSpeed: {
 			type: Number,
-			required: false,
-			default: 1
+			required: false
 		},
 		enableRotate: {
 			type: Boolean,
-			required: false,
-			default: true
+			required: false
 		},
 		rotateSpeed: {
 			type: Number,
-			required: false,
-			default: 1
+			required: false
 		},
-		mouseButtons: {
-			type: Object,
-			required: false,
-			default: () => ({
-				LEFT: MOUSE.ROTATE,
-				MIDDLE: MOUSE.DOLLY,
-				RIGHT: MOUSE.PAN
-			})
+		screenSpacePanning: {
+			type: Boolean,
+			required: false
 		}
-	},
+	}, {
+		...ORBIT_LIKE_DEFAULTS,
+		touches: () => ({
+			ONE: TOUCH.ROTATE,
+			TWO: TOUCH.DOLLY_PAN
+		}),
+		mouseButtons: () => ({
+			LEFT: MOUSE.ROTATE,
+			MIDDLE: MOUSE.DOLLY,
+			RIGHT: MOUSE.PAN
+		}),
+		screenSpacePanning: true
+	}),
 	emits: [
 		"change",
 		"start",
@@ -4194,62 +4225,40 @@ var OrbitControls_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 	setup(__props, { expose: __expose, emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
-		const { makeDefault, autoRotate, autoRotateSpeed, enableDamping, dampingFactor, enablePan, keyPanSpeed, maxAzimuthAngle, minAzimuthAngle, maxPolarAngle, minPolarAngle, minDistance, maxDistance, minZoom, maxZoom, enableZoom, zoomSpeed, enableRotate, touches, rotateSpeed, target, mouseButtons } = toRefs(props);
-		const { camera: activeCamera, renderer, extend: extend$1, controls, invalidate } = useTres();
+		const { camera: activeCamera, renderer, extend: extend$1 } = useTres();
 		const controlsRef = shallowRef(null);
 		extend$1({ OrbitControls });
-		watch(controlsRef, (value) => {
-			addEventListeners();
-			if (value && makeDefault.value) controls.value = value;
-			else controls.value = null;
-		});
-		function addEventListeners() {
-			useEventListener(controlsRef.value, "change", () => {
-				emit("change", controlsRef.value);
-				invalidate();
-			});
-			useEventListener(controlsRef.value, "start", () => emit("start", controlsRef.value));
-			useEventListener(controlsRef.value, "end", () => emit("end", controlsRef.value));
-		}
-		const { onBeforeRender } = useLoop();
-		onBeforeRender(() => {
-			if (controlsRef.value && (enableDamping.value || autoRotate.value)) {
-				controlsRef.value.update();
-				if (autoRotate.value) {}
-			}
-		});
-		onUnmounted(() => {
-			if (controlsRef.value) controlsRef.value.dispose();
-		});
+		useOrbitLikeControls(controlsRef, props, emit);
 		__expose({ instance: controlsRef });
 		return (_ctx, _cache) => {
 			return (__props.camera || unref(activeCamera)) && (__props.domElement || unref(renderer).domElement) ? (openBlock(), createElementBlock("TresOrbitControls", {
 				ref_key: "controlsRef",
 				ref: controlsRef,
 				key: (__props.camera || unref(activeCamera))?.uuid,
-				target: unref(target),
-				"auto-rotate": unref(autoRotate),
-				"auto-rotate-speed": unref(autoRotateSpeed),
-				"enable-damping": unref(enableDamping),
-				"damping-factor": unref(dampingFactor),
-				"enable-pan": unref(enablePan),
-				"key-pan-speed": unref(keyPanSpeed),
+				args: [__props.camera || unref(activeCamera), __props.domElement || unref(renderer).domElement],
+				target: __props.target,
+				"auto-rotate": __props.autoRotate,
+				"auto-rotate-speed": __props.autoRotateSpeed,
+				"enable-damping": __props.enableDamping,
+				"damping-factor": __props.dampingFactor,
+				"enable-pan": __props.enablePan,
+				"key-pan-speed": __props.keyPanSpeed,
 				keys: __props.keys,
-				"max-azimuth-angle": unref(maxAzimuthAngle),
-				"min-azimuth-angle": unref(minAzimuthAngle),
-				"max-polar-angle": unref(maxPolarAngle),
-				"min-polar-angle": unref(minPolarAngle),
-				"min-distance": unref(minDistance),
-				"max-distance": unref(maxDistance),
-				"min-zoom": unref(minZoom),
-				"max-zoom": unref(maxZoom),
-				touches: unref(touches),
-				"enable-zoom": unref(enableZoom),
-				"zoom-speed": unref(zoomSpeed),
-				"enable-rotate": unref(enableRotate),
-				"rotate-speed": unref(rotateSpeed),
-				"mouse-buttons": unref(mouseButtons),
-				args: [__props.camera || unref(activeCamera), __props.domElement || unref(renderer).domElement]
+				"max-azimuth-angle": __props.maxAzimuthAngle,
+				"min-azimuth-angle": __props.minAzimuthAngle,
+				"max-polar-angle": __props.maxPolarAngle,
+				"min-polar-angle": __props.minPolarAngle,
+				"min-distance": __props.minDistance,
+				"max-distance": __props.maxDistance,
+				"min-zoom": __props.minZoom,
+				"max-zoom": __props.maxZoom,
+				touches: __props.touches,
+				"enable-zoom": __props.enableZoom,
+				"zoom-speed": __props.zoomSpeed,
+				"enable-rotate": __props.enableRotate,
+				"rotate-speed": __props.rotateSpeed,
+				"mouse-buttons": __props.mouseButtons,
+				"screen-space-panning": __props.screenSpacePanning
 			}, null, 8, _hoisted_1$44)) : createCommentVNode("v-if", true);
 		};
 	}
@@ -4306,6 +4315,7 @@ var PointerLockControls_vue_vue_type_script_setup_true_lang_default = /* @__PURE
 					controlsRef.value.lock();
 					controlsRef.value.addEventListener("lock", () => isLockEmitter(true));
 					controlsRef.value.addEventListener("unlock", () => isLockEmitter(false));
+					controlsRef.value.addEventListener("change", () => invalidate());
 					invalidate();
 				}
 			});
@@ -7360,6 +7370,145 @@ function useIntersect(onChange = () => {}) {
 	};
 }
 
+//#endregion
+//#region src/core/performance/useBVH.ts
+/**
+* Vue composable for BVH optimization - speeds up raycasting
+* Automatically computes boundsTree and assigns acceleratedRaycast for meshes
+* Not side-effect free: mutates mesh.raycast; reverts to original when disabled or unmounted
+*/
+const useBVH = (target, { enabled = true, firstHitOnly = false, splitStrategy = "SAH", verbose = false, setBoundingBox = true, maxDepth = 40, maxLeafSize = 10, indirect = false, debug = false } = {}) => {
+	const DEBUG_OPACITY = .3;
+	let processedMeshes = [];
+	const debugGroup = new Group();
+	debugGroup.name = "BVH-Debug-Helpers";
+	const bvhOptions = {
+		splitStrategy,
+		verbose,
+		setBoundingBox,
+		maxDepth,
+		maxLeafSize,
+		indirect
+	};
+	/**
+	* Recursively traverse object3D and find all meshes (including SkinnedMesh)
+	*/
+	const getAllMeshes = (object) => {
+		const meshes = [];
+		object.traverse((child) => {
+			if (verbose) console.log(`BVH: Found object - Type: ${child.type}, Name: ${child.name || "unnamed"}`);
+			if ((child instanceof Mesh || child instanceof SkinnedMesh) && "geometry" in child && "material" in child) meshes.push(child);
+		});
+		return meshes;
+	};
+	/**
+	* Apply BVH optimization to a mesh (Mesh or SkinnedMesh)
+	*/
+	const applyBVHToMesh = (mesh) => {
+		if (!mesh.geometry?.attributes.position) {
+			if (verbose) console.warn("BVH: Mesh has no geometry or position attribute", mesh);
+			return null;
+		}
+		const originalRaycast = mesh.raycast;
+		try {
+			const boundsTree = new MeshBVH(mesh.geometry, bvhOptions);
+			mesh.geometry.boundsTree = boundsTree;
+			if (firstHitOnly) mesh.raycast = function(raycaster, intersects) {
+				const boundsTree$1 = this.geometry.boundsTree;
+				if (boundsTree$1) {
+					if (!this.layers.test(raycaster.layers)) return;
+					if (!(boundsTree$1 instanceof MeshBVH)) return;
+					const side = (Array.isArray(this.material) ? this.material[0] : this.material)?.side ?? raycaster.params.Mesh?.side;
+					const hit = boundsTree$1.raycastFirst(raycaster.ray, side, raycaster.near, raycaster.far);
+					if (hit) {
+						hit.object = this;
+						intersects.push(hit);
+					}
+				} else originalRaycast.call(this, raycaster, intersects);
+			};
+			else mesh.raycast = acceleratedRaycast;
+			return {
+				mesh,
+				originalRaycast,
+				geometry: mesh.geometry,
+				boundsTree
+			};
+		} catch (error) {
+			if (verbose) console.error("BVH: Failed to create bounds tree for mesh", mesh, error);
+			return null;
+		}
+	};
+	/**
+	* Create debug helper for a processed mesh
+	*/
+	const createDebugHelper = (processedMesh) => {
+		if (!!processedMesh.debugHelper || !isObject3D(processedMesh.mesh)) return;
+		const helper = new BVHHelper(processedMesh.mesh, processedMesh.boundsTree, maxDepth);
+		helper.opacity = DEBUG_OPACITY;
+		helper.update();
+		processedMesh.debugHelper = helper;
+		processedMesh.mesh.parent?.add(helper);
+	};
+	/**
+	* Remove debug helper from a processed mesh
+	*/
+	const removeDebugHelper = (processedMesh) => {
+		if (!processedMesh.debugHelper) return;
+		processedMesh.debugHelper.removeFromParent();
+		processedMesh.debugHelper = void 0;
+	};
+	/**
+	* Remove BVH optimization from a mesh
+	*/
+	const removeBVHFromMesh = (processedMesh) => {
+		const { mesh, originalRaycast, geometry } = processedMesh;
+		removeDebugHelper(processedMesh);
+		mesh.raycast = originalRaycast;
+		if (geometry.disposeBoundsTree) geometry.disposeBoundsTree();
+		else if (geometry.boundsTree) geometry.boundsTree = void 0;
+	};
+	/**
+	* Apply BVH optimization to an object and all its mesh children
+	*/
+	const applyBVH = (object) => {
+		if (!toValue(enabled)) {
+			if (verbose) console.log("BVH: Optimization disabled, skipping");
+			return;
+		}
+		getAllMeshes(object).filter((mesh) => !processedMeshes.some((pm) => pm.mesh === mesh)).forEach((mesh) => {
+			const processedMesh = applyBVHToMesh(mesh);
+			if (processedMesh) {
+				processedMeshes.push(processedMesh);
+				if (toValue(debug)) createDebugHelper(processedMesh);
+			}
+		});
+		if (verbose) console.log(`BVH: Applied optimization to ${processedMeshes.length} meshes`);
+	};
+	/**
+	* Remove BVH optimization from all processed meshes
+	*/
+	const removeBVH = () => {
+		processedMeshes.forEach(removeBVHFromMesh);
+		processedMeshes = [];
+	};
+	whenever(() => toValue(target), () => {
+		const objectValue = toValue(target);
+		if (objectValue && toValue(enabled)) applyBVH(objectValue);
+	});
+	watch(() => toValue(enabled), (enabled$1) => {
+		if (enabled$1) {
+			const objectValue = toValue(target);
+			if (objectValue) applyBVH(objectValue);
+		} else removeBVH();
+	});
+	watch(() => toValue(debug), () => {
+		processedMeshes.forEach(toValue(debug) ? createDebugHelper : removeDebugHelper);
+	}, { immediate: true });
+	onUnmounted(() => {
+		removeBVH();
+	});
+};
+
 //#endregion
 //#region src/core/shapes/Box.vue?vue&type=script&setup=true&lang.ts
 const _hoisted_1$32 = ["args"];
@@ -11678,7 +11827,7 @@ var component_vue_vue_type_script_setup_true_lang_default$1 = /* @__PURE__ */ de
 			mat.uniforms.uNormal.value = normal;
 			mat.uniforms.uTime.value = elapsed / (props.cooldownSec + props.lifetimeSec);
 		});
-		function isObject3D(o) {
+		function isObject3D$1(o) {
 			return o && "isObject3D" in o;
 		}
 		function isBufferGeometry(o) {
@@ -11687,8 +11836,8 @@ var component_vue_vue_type_script_setup_true_lang_default$1 = /* @__PURE__ */ de
 		onMounted(() => {
 			if (props.geometry) {
 				if (isBufferGeometry(props.geometry)) sparkles.geometry.copy(props.geometry);
-				else if (isObject3D(props.geometry) && "geometry" in props.geometry && isBufferGeometry(props.geometry.geometry)) sparkles.geometry.copy(props.geometry.geometry);
-			} else if (isObject3D(sparkles.parent) && "geometry" in sparkles.parent && isBufferGeometry(sparkles.parent.geometry)) sparkles.geometry.copy(sparkles.parent.geometry);
+				else if (isObject3D$1(props.geometry) && "geometry" in props.geometry && isBufferGeometry(props.geometry.geometry)) sparkles.geometry.copy(props.geometry.geometry);
+			} else if (isObject3D$1(sparkles.parent) && "geometry" in sparkles.parent && isBufferGeometry(sparkles.parent.geometry)) sparkles.geometry.copy(sparkles.parent.geometry);
 			else sparkles.geometry = new IcosahedronGeometry(1, 16);
 			if (typeof props.map === "string") {
 				const { state: texture$1 } = useTexture(props.map);
@@ -12403,4 +12552,4 @@ function extractBindingPosition(binding) {
 }
 
 //#endregion
-export { component_default as AccumulativeShadows, Align_default as Align, component_default$1 as AnimatedSprite, Backdrop_default as Backdrop, BakeShadows, BaseCameraControls, Billboard_default as Billboard, component_default$2 as Bounds, Box_default as Box, CameraControls_default as CameraControls, CameraShake_default as CameraShake, CatmullRomCurve3_default as CatmullRomCurve3, Circle_default as Circle, CircleShadow_default as CircleShadow, Cone_default as Cone, ContactShadows_default as ContactShadows, component_default$3 as CubeCamera, CubicBezierLine_default as CubicBezierLine, customShaderMaterial_default as CustomShaderMaterial, Cylinder_default as Cylinder, Dodecahedron_default as Dodecahedron, Edges_default as Edges, component_default$4 as Environment, component_default$5 as FBXModel, component_default$6 as Fbo, Fit_default as Fit, component_default$7 as GLTFModel, GlobalAudio, GradientTexture_default as GradientTexture, Grid_default as Grid, component_default$8 as Helper, holographicMaterial_default as HolographicMaterial, HTML_default as Html, Icosahedron_default as Icosahedron, component_default$9 as Image, KeyboardControls_default as KeyboardControls, LOD_default as LOD, component_default$10 as Lensflare, Levioso_default as Levioso, lightformer_default as Lightformer, Line2_default as Line2, MapControls_default as MapControls, MarchingCube_default as MarchingCube, MarchingCubes_default as MarchingCubes, MarchingPlane_default as MarchingPlane, component_default$11 as Mask, meshDiscardMaterial_default as MeshDiscardMaterial, meshGlassMaterial_default as MeshGlassMaterial, meshReflectionMaterial_default as MeshReflectionMaterial, meshWobbleMaterial_default as MeshWobbleMaterial, MouseParallax_default as MouseParallax, Ocean_default as Ocean, Octahedron_default as Octahedron, OrbitControls_default as OrbitControls, component_default$12 as Outline, Plane_default as Plane, component_default$13 as PointMaterial, PointerLockControls_default as PointerLockControls, PositionalAudio_default as PositionalAudio, Precipitation_default as Precipitation, QuadraticBezierLine_default as QuadraticBezierLine, component_default$14 as RandomizedLights, Reflector_default as Reflector, Ring_default as Ring, RoundedBox_default as RoundedBox, component_default$15 as Sampler, ScreenQuad_default as ScreenQuad, ScreenSizer_default as ScreenSizer, ScreenSpace_default as ScreenSpace, ScrollControls_default as ScrollControls, Sky_default as Sky, Smoke_default as Smoke, SoftShadows_default as SoftShadows, component_default$16 as Sparkles, Sphere_default as Sphere, Stage_default as Stage, Stars_default as Stars, Stats, StatsGl, Superformula_default as Superformula, Tetrahedron_default as Tetrahedron, Text3D_default as Text3D, Torus_default as Torus, TorusKnot_default as TorusKnot, TransformControls_default as TransformControls, Tube_default as Tube, component_default$17 as UseSVG, component_default$18 as UseTexture, extractBindingPosition, hasSetter, pick, useAnimations, useEnvironment, useFBO, useFBX, useGLTF, useGLTFExporter, useIntersect, useMask, useProgress, useSVG, useSurfaceSampler, useTexture, useTextures, useVideoTexture };
+export { component_default as AccumulativeShadows, Align_default as Align, component_default$1 as AnimatedSprite, Backdrop_default as Backdrop, BakeShadows, BaseCameraControls, Billboard_default as Billboard, component_default$2 as Bounds, Box_default as Box, CameraControls_default as CameraControls, CameraShake_default as CameraShake, CatmullRomCurve3_default as CatmullRomCurve3, Circle_default as Circle, CircleShadow_default as CircleShadow, Cone_default as Cone, ContactShadows_default as ContactShadows, component_default$3 as CubeCamera, CubicBezierLine_default as CubicBezierLine, customShaderMaterial_default as CustomShaderMaterial, Cylinder_default as Cylinder, Dodecahedron_default as Dodecahedron, Edges_default as Edges, component_default$4 as Environment, component_default$5 as FBXModel, component_default$6 as Fbo, Fit_default as Fit, component_default$7 as GLTFModel, GlobalAudio, GradientTexture_default as GradientTexture, Grid_default as Grid, component_default$8 as Helper, holographicMaterial_default as HolographicMaterial, HTML_default as Html, Icosahedron_default as Icosahedron, component_default$9 as Image, KeyboardControls_default as KeyboardControls, LOD_default as LOD, component_default$10 as Lensflare, Levioso_default as Levioso, lightformer_default as Lightformer, Line2_default as Line2, MapControls_default as MapControls, MarchingCube_default as MarchingCube, MarchingCubes_default as MarchingCubes, MarchingPlane_default as MarchingPlane, component_default$11 as Mask, meshDiscardMaterial_default as MeshDiscardMaterial, meshGlassMaterial_default as MeshGlassMaterial, meshReflectionMaterial_default as MeshReflectionMaterial, meshWobbleMaterial_default as MeshWobbleMaterial, MouseParallax_default as MouseParallax, Ocean_default as Ocean, Octahedron_default as Octahedron, OrbitControls_default as OrbitControls, component_default$12 as Outline, Plane_default as Plane, component_default$13 as PointMaterial, PointerLockControls_default as PointerLockControls, PositionalAudio_default as PositionalAudio, Precipitation_default as Precipitation, QuadraticBezierLine_default as QuadraticBezierLine, component_default$14 as RandomizedLights, Reflector_default as Reflector, Ring_default as Ring, RoundedBox_default as RoundedBox, component_default$15 as Sampler, ScreenQuad_default as ScreenQuad, ScreenSizer_default as ScreenSizer, ScreenSpace_default as ScreenSpace, ScrollControls_default as ScrollControls, Sky_default as Sky, Smoke_default as Smoke, SoftShadows_default as SoftShadows, component_default$16 as Sparkles, Sphere_default as Sphere, Stage_default as Stage, Stars_default as Stars, Stats, StatsGl, Superformula_default as Superformula, Tetrahedron_default as Tetrahedron, Text3D_default as Text3D, Torus_default as Torus, TorusKnot_default as TorusKnot, TransformControls_default as TransformControls, Tube_default as Tube, component_default$17 as UseSVG, component_default$18 as UseTexture, extractBindingPosition, hasSetter, pick, useAnimations, useBVH, useEnvironment, useFBO, useFBX, useGLTF, useGLTFExporter, useIntersect, useMask, useProgress, useSVG, useSurfaceSampler, useTexture, useTextures, useVideoTexture };