cubeforge 0.6.2 → 0.7.0

package/dist/index.js

@@ -66,7 +66,7 @@ import {
 } from "./chunk-UMHYQ4EP.js";
 
 // src/components/Game.tsx
-import { useEffect as useEffect11, useRef as useRef11, useState as useState3 } from "react";
+import { useEffect as useEffect12, useRef as useRef12, useState as useState3 } from "react";
 
 // ../../packages/core/src/ecs/world.ts
 function applyDeltaSnapshot(baseline, delta) {
@@ -4583,7 +4583,7 @@ function useCollidingWith() {
 // ../devtools/src/DevTools.tsx
 import React from "react";
 import { createPortal } from "react-dom";
-import { useState as useState2, useEffect as useEffect10, useCallback, useRef as useRef10 } from "react";
+import { useState as useState2, useEffect as useEffect11, useCallback as useCallback2, useRef as useRef11 } from "react";
 
 // ../../packages/audio/src/useSound.ts
 import { useEffect as useEffect3, useRef as useRef3 } from "react";
@@ -4905,24 +4905,24 @@ function useSound(src, opts = {}) {
 // ../../packages/audio/src/useSpatialSound.ts
 import { useEffect as useEffect4, useRef as useRef4 } from "react";
 async function loadBuffer2(src) {
-  const bufferCache2 = _getBufferCache();
+  const bufferCache3 = _getBufferCache();
   const bufferRefCount2 = _getBufferRefCount();
   bufferRefCount2.set(src, (bufferRefCount2.get(src) ?? 0) + 1);
-  const cached = bufferCache2.get(src);
+  const cached = bufferCache3.get(src);
   if (cached) return cached;
   const res = await fetch(src);
   const data = await res.arrayBuffer();
   const buf = await getAudioCtx().decodeAudioData(data);
-  bufferCache2.set(src, buf);
+  bufferCache3.set(src, buf);
   return buf;
 }
 function releaseBuffer2(src) {
-  const bufferCache2 = _getBufferCache();
+  const bufferCache3 = _getBufferCache();
   const bufferRefCount2 = _getBufferRefCount();
   const count = bufferRefCount2.get(src) ?? 0;
   if (count <= 1) {
     bufferRefCount2.delete(src);
-    bufferCache2.delete(src);
+    bufferCache3.delete(src);
   } else {
     bufferRefCount2.set(src, count - 1);
   }
@@ -5492,20 +5492,20 @@ function usePreloadAudio(srcs) {
     cancelledRef.current = false;
     if (srcs.length === 0) return;
     const unique = [...new Set(srcs)];
-    const bufferCache2 = _getBufferCache();
+    const bufferCache3 = _getBufferCache();
     const bufferRefCount2 = _getBufferRefCount();
     const ctx = getAudioCtx();
     const loadOne = async (src) => {
       try {
-        if (!preloadCache.has(src) && !bufferCache2.has(src)) {
+        if (!preloadCache.has(src) && !bufferCache3.has(src)) {
           const res = await fetch(src);
           const data = await res.arrayBuffer();
           const buf = await ctx.decodeAudioData(data);
           preloadCache.set(src, buf);
-          bufferCache2.set(src, buf);
+          bufferCache3.set(src, buf);
           bufferRefCount2.set(src, (bufferRefCount2.get(src) ?? 0) + 1);
-        } else if (!preloadCache.has(src) && bufferCache2.has(src)) {
-          preloadCache.set(src, bufferCache2.get(src));
+        } else if (!preloadCache.has(src) && bufferCache3.has(src)) {
+          preloadCache.set(src, bufferCache3.get(src));
         }
       } catch {
         if (!cancelledRef.current) {
@@ -5533,6 +5533,156 @@ function usePreloadAudio(srcs) {
   };
 }
 
+// ../../packages/audio/src/useSoundscape.ts
+import { useEffect as useEffect10, useRef as useRef10, useCallback } from "react";
+var bufferCache2 = /* @__PURE__ */ new Map();
+async function loadBuffer3(src) {
+  const cached = bufferCache2.get(src);
+  if (cached) return cached;
+  const res = await fetch(src);
+  const data = await res.arrayBuffer();
+  const buf = await getAudioCtx().decodeAudioData(data);
+  bufferCache2.set(src, buf);
+  return buf;
+}
+function useSoundscape(layers, opts = {}) {
+  const { volume: masterVolume = 1, fadeIn = 1, fadeOut = 1, group = "ambient", active = true } = opts;
+  const masterGainRef = useRef10(null);
+  const layerStatesRef = useRef10(/* @__PURE__ */ new Map());
+  const activeRef = useRef10(active);
+  useEffect10(() => {
+    const ctx = getAudioCtx();
+    const masterGain = ctx.createGain();
+    masterGain.gain.setValueAtTime(0, ctx.currentTime);
+    masterGain.connect(getGroupGainNode(group));
+    masterGainRef.current = masterGain;
+    const destroyed = { current: false };
+    const layerStates = layerStatesRef.current;
+    const loadPromises = [];
+    for (const layer of layers) {
+      const layerGain = ctx.createGain();
+      const targetVol = layer.active === false ? 0 : layer.volume ?? 1;
+      layerGain.gain.setValueAtTime(targetVol, ctx.currentTime);
+      layerGain.connect(masterGain);
+      const state = {
+        src: layer.src,
+        gainNode: layerGain,
+        source: null,
+        targetVolume: targetVol,
+        unregister: null
+      };
+      layerStates.set(layer.src, state);
+      const p = loadBuffer3(layer.src).then((buf) => {
+        if (destroyed.current) return;
+        const source = ctx.createBufferSource();
+        source.buffer = buf;
+        source.loop = true;
+        source.connect(layerGain);
+        const offset = layer.randomOffset && layer.randomOffset > 0 ? Math.random() * layer.randomOffset : 0;
+        source.start(0, offset % buf.duration);
+        state.source = source;
+        state.unregister = registerGroupSource(group, () => {
+          try {
+            source.stop();
+          } catch {
+          }
+        });
+      });
+      loadPromises.push(p);
+    }
+    Promise.all(loadPromises).then(() => {
+      if (destroyed.current) return;
+      if (!activeRef.current) return;
+      const now = ctx.currentTime;
+      if (fadeIn > 0) {
+        masterGain.gain.cancelScheduledValues(now);
+        masterGain.gain.setValueAtTime(0, now);
+        masterGain.gain.linearRampToValueAtTime(masterVolume, now + fadeIn);
+      } else {
+        masterGain.gain.setValueAtTime(masterVolume, now);
+      }
+    });
+    return () => {
+      destroyed.current = true;
+      const now = ctx.currentTime;
+      const stopAll = () => {
+        for (const state of layerStates.values()) {
+          state.unregister?.();
+          if (state.source) {
+            try {
+              state.source.stop();
+            } catch {
+            }
+          }
+          state.gainNode.disconnect();
+        }
+        layerStates.clear();
+        masterGain.disconnect();
+      };
+      if (fadeOut > 0) {
+        masterGain.gain.cancelScheduledValues(now);
+        masterGain.gain.setValueAtTime(masterGain.gain.value, now);
+        masterGain.gain.linearRampToValueAtTime(0, now + fadeOut);
+        setTimeout(stopAll, fadeOut * 1e3 + 50);
+      } else {
+        stopAll();
+      }
+    };
+  }, []);
+  useEffect10(() => {
+    activeRef.current = active;
+    const masterGain = masterGainRef.current;
+    if (!masterGain) return;
+    const ctx = getAudioCtx();
+    const now = ctx.currentTime;
+    const target = active ? masterVolume : 0;
+    const duration = active ? fadeIn : fadeOut;
+    masterGain.gain.cancelScheduledValues(now);
+    masterGain.gain.setValueAtTime(masterGain.gain.value, now);
+    if (duration > 0) {
+      masterGain.gain.linearRampToValueAtTime(target, now + duration);
+    } else {
+      masterGain.gain.setValueAtTime(target, now);
+    }
+  }, [active, masterVolume, fadeIn, fadeOut]);
+  const setVolume = useCallback((volume, duration = 0) => {
+    const masterGain = masterGainRef.current;
+    if (!masterGain) return;
+    const ctx = getAudioCtx();
+    const now = ctx.currentTime;
+    const clamped = Math.max(0, Math.min(1, volume));
+    masterGain.gain.cancelScheduledValues(now);
+    masterGain.gain.setValueAtTime(masterGain.gain.value, now);
+    if (duration > 0) {
+      masterGain.gain.linearRampToValueAtTime(clamped, now + duration);
+    } else {
+      masterGain.gain.setValueAtTime(clamped, now);
+    }
+  }, []);
+  const setLayerVolume = useCallback((src, volume, duration = 0) => {
+    const state = layerStatesRef.current.get(src);
+    if (!state) return;
+    const ctx = getAudioCtx();
+    const now = ctx.currentTime;
+    const clamped = Math.max(0, Math.min(1, volume));
+    state.targetVolume = clamped;
+    state.gainNode.gain.cancelScheduledValues(now);
+    state.gainNode.gain.setValueAtTime(state.gainNode.gain.value, now);
+    if (duration > 0) {
+      state.gainNode.gain.linearRampToValueAtTime(clamped, now + duration);
+    } else {
+      state.gainNode.gain.setValueAtTime(clamped, now);
+    }
+  }, []);
+  const fadeLayer = useCallback(
+    (src, targetVolume, duration) => {
+      setLayerVolume(src, targetVolume, duration);
+    },
+    [setLayerVolume]
+  );
+  return { setVolume, setLayerVolume, fadeLayer };
+}
+
 // ../../packages/audio/src/listener.ts
 function setListenerPosition(x, y) {
   const ctx = getAudioCtx();
@@ -5720,8 +5870,8 @@ function DevToolsOverlay({ handle, loop, ecs, engine }) {
   const [showNavGrid, setShowNavGrid] = useState2(false);
   const [showContactFlash, setShowContactFlash] = useState2(false);
   const [hidden, setHidden] = useState2(false);
-  const frameRef = useRef10(0);
-  useEffect10(() => {
+  const frameRef = useRef11(0);
+  useEffect11(() => {
     const onKey = (e) => {
       if (e.key === "`" && !e.ctrlKey && !e.metaKey && !e.altKey) {
         setHidden((v) => !v);
@@ -5730,7 +5880,7 @@ function DevToolsOverlay({ handle, loop, ecs, engine }) {
     window.addEventListener("keydown", onKey);
     return () => window.removeEventListener("keydown", onKey);
   }, []);
-  useEffect10(() => {
+  useEffect11(() => {
     handle.onFrame = () => {
       frameRef.current++;
       if (!paused) {
@@ -5742,14 +5892,14 @@ function DevToolsOverlay({ handle, loop, ecs, engine }) {
       handle.onFrame = void 0;
     };
   }, [handle, paused]);
-  useEffect10(() => {
+  useEffect11(() => {
     const rs = engine?.activeRenderSystem;
     rs?.setEntityHighlight?.(selectedEntity);
     return () => {
       rs?.setEntityHighlight?.(null);
     };
   }, [engine, selectedEntity]);
-  useEffect10(() => {
+  useEffect11(() => {
     if (!engine) return;
     const events = engine.events;
     const types = ["triggerEnter", "triggerExit", "collisionEnter", "collisionExit", "circleEnter", "circleExit"];
@@ -5781,7 +5931,7 @@ function DevToolsOverlay({ handle, loop, ecs, engine }) {
   }, [engine, showContactFlash]);
   const totalFrames = handle.buffer.length;
   const currentSnap = handle.buffer[selectedIdx];
-  const handlePauseResume = useCallback(() => {
+  const handlePauseResume = useCallback2(() => {
     if (paused) {
       if (currentSnap) ecs.restoreSnapshot(currentSnap);
       loop.resume();
@@ -5793,15 +5943,15 @@ function DevToolsOverlay({ handle, loop, ecs, engine }) {
       setSelectedIdx(Math.max(0, handle.buffer.length - 1));
     }
   }, [paused, currentSnap, ecs, loop, handle]);
-  const stepBack = useCallback(() => {
+  const stepBack = useCallback2(() => {
     setSelectedIdx((i) => Math.max(0, i - 1));
     setSelectedEntity(null);
   }, []);
-  const stepForward = useCallback(() => {
+  const stepForward = useCallback2(() => {
     setSelectedIdx((i) => Math.min(handle.buffer.length - 1, i + 1));
     setSelectedEntity(null);
   }, [handle]);
-  const handleToggleNavGrid = useCallback(() => {
+  const handleToggleNavGrid = useCallback2(() => {
     if (!engine) return;
     const renderer = engine.activeRenderSystem;
     if (!renderer?.setDebugNavGrid) return;
@@ -6668,14 +6818,14 @@ function Game({
   className,
   children
 }) {
-  const canvasRef = useRef11(null);
-  const debugCanvasRef = useRef11(null);
-  const wrapperRef = useRef11(null);
+  const canvasRef = useRef12(null);
+  const debugCanvasRef = useRef12(null);
+  const wrapperRef = useRef12(null);
   const [engine, setEngine] = useState3(null);
   const [assetsReady, setAssetsReady] = useState3(asyncAssets);
   const [webglError, setWebglError] = useState3(null);
-  const devtoolsHandle = useRef11({ buffer: [] });
-  useEffect11(() => {
+  const devtoolsHandle = useRef12({ buffer: [] });
+  useEffect12(() => {
     const canvas = canvasRef.current;
     const ecs = new ECSWorld();
     if (deterministic) ecs.setDeterministicSeed(seed);
@@ -6829,7 +6979,7 @@ function Game({
       }
     };
   }, []);
-  useEffect11(() => {
+  useEffect12(() => {
     if (!engine) return;
     let cancelled = false;
     if (asyncAssets) {
@@ -6847,7 +6997,7 @@ function Game({
       cancelled = true;
     };
   }, [engine]);
-  useEffect11(() => {
+  useEffect12(() => {
     if (!engine) return;
     const dpr = window.devicePixelRatio || 1;
     const physW = Math.round(width * dpr);
@@ -6858,7 +7008,7 @@ function Game({
     canvas.style.width = `${width}px`;
     canvas.style.height = `${height}px`;
   }, [width, height, engine]);
-  useEffect11(() => {
+  useEffect12(() => {
     engine?.physics.setGravity(gravity);
   }, [gravity, engine]);
   const canvasStyle = {
@@ -6974,15 +7124,15 @@ function Stage(props) {
 }
 
 // src/components/World.tsx
-import { useEffect as useEffect12, useContext as useContext3 } from "react";
+import { useEffect as useEffect13, useContext as useContext3 } from "react";
 import { Fragment as Fragment2, jsx as jsx4 } from "react/jsx-runtime";
 function World({ gravity, background = "#1a1a2e", children }) {
   const engine = useContext3(EngineContext);
-  useEffect12(() => {
+  useEffect13(() => {
     if (!engine) return;
     if (gravity !== void 0) engine.physics.setGravity(gravity);
   }, [gravity, engine]);
-  useEffect12(() => {
+  useEffect13(() => {
     if (!engine) return;
     const camId = engine.ecs.queryOne("Camera2D");
     if (camId !== void 0) {
@@ -6996,7 +7146,7 @@ function World({ gravity, background = "#1a1a2e", children }) {
 }
 
 // src/components/Entity.tsx
-import { useEffect as useEffect13, useContext as useContext4, useState as useState4 } from "react";
+import { useEffect as useEffect14, useContext as useContext4, useState as useState4 } from "react";
 import { jsx as jsx5 } from "react/jsx-runtime";
 function Entity({ id, tags = [], children }) {
   const engine = useContext4(EngineContext);
@@ -7006,7 +7156,7 @@ function Entity({ id, tags = [], children }) {
       console.warn("[Cubeforge] <Entity> must be inside a <World>. No EngineContext found.");
     }
   }
-  useEffect13(() => {
+  useEffect14(() => {
     const eid = engine.ecs.createEntity();
     if (id) {
       if (engine.entityIds.has(id)) {
@@ -7028,15 +7178,15 @@ function Entity({ id, tags = [], children }) {
 }
 
 // src/components/Transform.tsx
-import { useEffect as useEffect14, useContext as useContext5 } from "react";
+import { useEffect as useEffect15, useContext as useContext5 } from "react";
 function Transform({ x = 0, y = 0, rotation = 0, scaleX = 1, scaleY = 1 }) {
   const engine = useContext5(EngineContext);
   const entityId = useContext5(EntityContext);
-  useEffect14(() => {
+  useEffect15(() => {
     engine.ecs.addComponent(entityId, createTransform(x, y, rotation, scaleX, scaleY));
     return () => engine.ecs.removeComponent(entityId, "Transform");
   }, []);
-  useEffect14(() => {
+  useEffect15(() => {
     const comp = engine.ecs.getComponent(entityId, "Transform");
     if (comp) {
       comp.x = x;
@@ -7050,7 +7200,7 @@ function Transform({ x = 0, y = 0, rotation = 0, scaleX = 1, scaleY = 1 }) {
 }
 
 // src/components/Sprite.tsx
-import { useEffect as useEffect15, useContext as useContext6, useRef as useRef12 } from "react";
+import { useEffect as useEffect16, useContext as useContext6, useRef as useRef13 } from "react";
 function Sprite({
   width,
   height,
@@ -7101,7 +7251,7 @@ function Sprite({
       );
     }
   }
-  useEffect15(() => {
+  useEffect16(() => {
     const comp = createSprite({
       width,
       height,
@@ -7153,8 +7303,8 @@ function Sprite({
     }
     return () => engine.ecs.removeComponent(entityId, "Sprite");
   }, []);
-  const didMount = useRef12(false);
-  useEffect15(() => {
+  const didMount = useRef13(false);
+  useEffect16(() => {
     if (!didMount.current) {
       didMount.current = true;
       return;
@@ -7184,7 +7334,7 @@ function Sprite({
       cancelled = true;
     };
   }, [src, engine, entityId]);
-  useEffect15(() => {
+  useEffect16(() => {
     const comp = engine.ecs.getComponent(entityId, "Sprite");
     if (!comp) return;
     comp.color = color;
@@ -7231,7 +7381,7 @@ function Sprite({
 }
 
 // src/components/Text.tsx
-import { useEffect as useEffect16, useContext as useContext7 } from "react";
+import { useEffect as useEffect17, useContext as useContext7 } from "react";
 function Text({
   text,
   fontSize = 16,
@@ -7256,7 +7406,7 @@ function Text({
 }) {
   const engine = useContext7(EngineContext);
   const entityId = useContext7(EntityContext);
-  useEffect16(() => {
+  useEffect17(() => {
     const comp = createText({
       text,
       fontSize,
@@ -7282,7 +7432,7 @@ function Text({
     engine.ecs.addComponent(entityId, comp);
     return () => engine.ecs.removeComponent(entityId, "Text");
   }, []);
-  useEffect16(() => {
+  useEffect17(() => {
     const comp = engine.ecs.getComponent(entityId, "Text");
     if (!comp) return;
     comp.text = text;
@@ -7319,7 +7469,7 @@ function Text({
 }
 
 // src/components/RigidBody.tsx
-import { useEffect as useEffect17, useContext as useContext8 } from "react";
+import { useEffect as useEffect18, useContext as useContext8 } from "react";
 function RigidBody({
   mass = 0,
   gravityScale = 1,
@@ -7349,7 +7499,7 @@ function RigidBody({
       console.warn("[Cubeforge] <RigidBody> must be inside an <Entity>. No EntityContext found.");
     }
   }
-  useEffect17(() => {
+  useEffect18(() => {
     engine.ecs.addComponent(
       entityId,
       createRigidBody({
@@ -7381,7 +7531,7 @@ function RigidBody({
 }
 
 // src/components/BoxCollider.tsx
-import { useEffect as useEffect18, useContext as useContext9 } from "react";
+import { useEffect as useEffect19, useContext as useContext9 } from "react";
 function BoxCollider({
   width,
   height,
@@ -7399,7 +7549,7 @@ function BoxCollider({
 }) {
   const engine = useContext9(EngineContext);
   const entityId = useContext9(EntityContext);
-  useEffect18(() => {
+  useEffect19(() => {
     engine.ecs.addComponent(
       entityId,
       createBoxCollider(width, height, {
@@ -7437,7 +7587,7 @@ function BoxCollider({
 }
 
 // src/components/CircleCollider.tsx
-import { useEffect as useEffect19, useContext as useContext10 } from "react";
+import { useEffect as useEffect20, useContext as useContext10 } from "react";
 function CircleCollider({
   radius,
   offsetX = 0,
@@ -7453,7 +7603,7 @@ function CircleCollider({
 }) {
   const engine = useContext10(EngineContext);
   const entityId = useContext10(EntityContext);
-  useEffect19(() => {
+  useEffect20(() => {
     engine.ecs.addComponent(
       entityId,
       createCircleCollider(radius, {
@@ -7475,7 +7625,7 @@ function CircleCollider({
 }
 
 // src/components/CapsuleCollider.tsx
-import { useEffect as useEffect20, useContext as useContext11 } from "react";
+import { useEffect as useEffect21, useContext as useContext11 } from "react";
 function CapsuleCollider({
   width,
   height,
@@ -7492,7 +7642,7 @@ function CapsuleCollider({
 }) {
   const engine = useContext11(EngineContext);
   const entityId = useContext11(EntityContext);
-  useEffect20(() => {
+  useEffect21(() => {
     engine.ecs.addComponent(
       entityId,
       createCapsuleCollider(width, height, {
@@ -7514,11 +7664,11 @@ function CapsuleCollider({
 }
 
 // src/components/CompoundCollider.tsx
-import { useEffect as useEffect21, useContext as useContext12 } from "react";
+import { useEffect as useEffect22, useContext as useContext12 } from "react";
 function CompoundCollider({ shapes, isTrigger = false, layer = "default", mask = "*" }) {
   const engine = useContext12(EngineContext);
   const entityId = useContext12(EntityContext);
-  useEffect21(() => {
+  useEffect22(() => {
     engine.ecs.addComponent(entityId, createCompoundCollider(shapes, { isTrigger, layer, mask }));
     const checkId = setTimeout(() => {
       if (engine.ecs.hasEntity(entityId) && !engine.ecs.hasComponent(entityId, "Transform")) {
@@ -7534,7 +7684,7 @@ function CompoundCollider({ shapes, isTrigger = false, layer = "default", mask =
 }
 
 // src/components/Script.tsx
-import { useEffect as useEffect22, useContext as useContext13, useRef as useRef13 } from "react";
+import { useEffect as useEffect23, useContext as useContext13, useRef as useRef14 } from "react";
 function Script({ init, update }) {
   const engine = useContext13(EngineContext);
   const entityId = useContext13(EntityContext);
@@ -7543,11 +7693,11 @@ function Script({ init, update }) {
       console.warn("[Cubeforge] <Script> must be inside an <Entity>. No EntityContext found.");
     }
   }
-  const initRef = useRef13(init);
+  const initRef = useRef14(init);
   initRef.current = init;
-  const updateRef = useRef13(update);
+  const updateRef = useRef14(update);
   updateRef.current = update;
-  useEffect22(() => {
+  useEffect23(() => {
     if (initRef.current) {
       try {
         initRef.current(entityId, engine.ecs);
@@ -7563,7 +7713,7 @@ function Script({ init, update }) {
 }
 
 // src/components/Camera2D.tsx
-import { useEffect as useEffect23, useContext as useContext14 } from "react";
+import { useEffect as useEffect24, useContext as useContext14 } from "react";
 function Camera2D({
   followEntity,
   x = 0,
@@ -7577,7 +7727,7 @@ function Camera2D({
   followOffsetY = 0
 }) {
   const engine = useContext14(EngineContext);
-  useEffect23(() => {
+  useEffect24(() => {
     const entityId = engine.ecs.createEntity();
     engine.ecs.addComponent(
       entityId,
@@ -7596,7 +7746,7 @@ function Camera2D({
     );
     return () => engine.ecs.destroyEntity(entityId);
   }, []);
-  useEffect23(() => {
+  useEffect24(() => {
     const camId = engine.ecs.queryOne("Camera2D");
     if (camId === void 0) return;
     const cam = engine.ecs.getComponent(camId, "Camera2D");
@@ -7615,11 +7765,11 @@ function Camera2D({
 }
 
 // src/components/Animation.tsx
-import { useEffect as useEffect24, useContext as useContext15 } from "react";
+import { useEffect as useEffect25, useContext as useContext15 } from "react";
 function Animation({ frames, fps = 12, loop = true, playing = true, onComplete, frameEvents }) {
   const engine = useContext15(EngineContext);
   const entityId = useContext15(EntityContext);
-  useEffect24(() => {
+  useEffect25(() => {
     const state = {
       type: "AnimationState",
       frames,
@@ -7637,7 +7787,7 @@ function Animation({ frames, fps = 12, loop = true, playing = true, onComplete,
       engine.ecs.removeComponent(entityId, "AnimationState");
     };
   }, []);
-  useEffect24(() => {
+  useEffect25(() => {
     const anim = engine.ecs.getComponent(entityId, "AnimationState");
     if (!anim) return;
     const wasFramesChanged = anim.frames !== frames;
@@ -7657,7 +7807,7 @@ function Animation({ frames, fps = 12, loop = true, playing = true, onComplete,
 }
 
 // src/components/AnimatedSprite.tsx
-import { useEffect as useEffect25, useContext as useContext16 } from "react";
+import { useEffect as useEffect26, useContext as useContext16 } from "react";
 import { Fragment as Fragment3, jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
 function defineAnimations(clips) {
   return clips;
@@ -7746,7 +7896,7 @@ function AnimatedSprite(props) {
 function MultiClipAnimation({ animations, current }) {
   const engine = useContext16(EngineContext);
   const entityId = useContext16(EntityContext);
-  useEffect25(() => {
+  useEffect26(() => {
     const clip = animations[current] ?? Object.values(animations)[0];
     const state = {
       type: "AnimationState",
@@ -7765,7 +7915,7 @@ function MultiClipAnimation({ animations, current }) {
     engine.ecs.addComponent(entityId, state);
     return () => engine.ecs.removeComponent(entityId, "AnimationState");
   }, []);
-  useEffect25(() => {
+  useEffect26(() => {
     const anim = engine.ecs.getComponent(entityId, "AnimationState");
     if (!anim) return;
     anim.clips = animations;
@@ -7775,11 +7925,11 @@ function MultiClipAnimation({ animations, current }) {
 }
 
 // src/components/Animator.tsx
-import { useEffect as useEffect26, useContext as useContext17 } from "react";
+import { useEffect as useEffect27, useContext as useContext17 } from "react";
 function Animator({ initial, states, params = {}, playing = true }) {
   const engine = useContext17(EngineContext);
   const entityId = useContext17(EntityContext);
-  useEffect26(() => {
+  useEffect27(() => {
     const comp = {
       type: "Animator",
       initialState: initial,
@@ -7792,13 +7942,13 @@ function Animator({ initial, states, params = {}, playing = true }) {
     engine.ecs.addComponent(entityId, comp);
     return () => engine.ecs.removeComponent(entityId, "Animator");
   }, []);
-  useEffect26(() => {
+  useEffect27(() => {
     const comp = engine.ecs.getComponent(entityId, "Animator");
     if (!comp) return;
     Object.assign(comp.params, params);
     comp.playing = playing;
   }, [params, playing, engine, entityId]);
-  useEffect26(() => {
+  useEffect27(() => {
     const comp = engine.ecs.getComponent(entityId, "Animator");
     if (!comp) return;
     comp.states = states;
@@ -7807,11 +7957,11 @@ function Animator({ initial, states, params = {}, playing = true }) {
 }
 
 // src/components/SquashStretch.tsx
-import { useEffect as useEffect27, useContext as useContext18 } from "react";
+import { useEffect as useEffect28, useContext as useContext18 } from "react";
 function SquashStretch({ intensity = 0.2, recovery = 8 }) {
   const engine = useContext18(EngineContext);
   const entityId = useContext18(EntityContext);
-  useEffect27(() => {
+  useEffect28(() => {
     engine.ecs.addComponent(entityId, {
       type: "SquashStretch",
       intensity,
@@ -7825,7 +7975,7 @@ function SquashStretch({ intensity = 0.2, recovery = 8 }) {
 }
 
 // src/components/ParticleEmitter.tsx
-import { useEffect as useEffect28, useContext as useContext19 } from "react";
+import { useEffect as useEffect29, useContext as useContext19 } from "react";
 
 // src/components/particlePresets.ts
 var PARTICLE_PRESETS = {
@@ -8109,7 +8259,7 @@ function ParticleEmitter({
   const resolvedSizeOverLife = sizeOverLife ?? presetConfig.sizeOverLife;
   const engine = useContext19(EngineContext);
   const entityId = useContext19(EntityContext);
-  useEffect28(() => {
+  useEffect29(() => {
     engine.ecs.addComponent(entityId, {
       type: "ParticlePool",
       particles: [],
@@ -8144,23 +8294,23 @@ function ParticleEmitter({
     });
     return () => engine.ecs.removeComponent(entityId, "ParticlePool");
   }, []);
-  useEffect28(() => {
+  useEffect29(() => {
     const pool = engine.ecs.getComponent(entityId, "ParticlePool");
     if (!pool) return;
     pool.active = active;
   }, [active, engine, entityId]);
-  useEffect28(() => {
+  useEffect29(() => {
     const pool = engine.ecs.getComponent(entityId, "ParticlePool");
     if (!pool) return;
     pool.blendMode = resolvedBlendMode;
     pool.particleShape = resolvedParticleShape;
   }, [resolvedBlendMode, resolvedParticleShape, engine, entityId]);
-  useEffect28(() => {
+  useEffect29(() => {
     const pool = engine.ecs.getComponent(entityId, "ParticlePool");
     if (!pool) return;
     pool.attractors = attractors;
   }, [attractors, engine, entityId]);
-  useEffect28(() => {
+  useEffect29(() => {
     const pool = engine.ecs.getComponent(entityId, "ParticlePool");
     if (!pool || pool.mode !== "formation" || !formationPoints) return;
     pool.formationPoints = formationPoints;
@@ -8172,7 +8322,7 @@ function ParticleEmitter({
       }
     });
   }, [formationPoints, engine, entityId]);
-  useEffect28(() => {
+  useEffect29(() => {
     const pool = engine.ecs.getComponent(entityId, "ParticlePool");
     if (!pool || !targetColor) return;
     pool._colorTransitionFrom = pool.color;
@@ -8184,7 +8334,7 @@ function ParticleEmitter({
 }
 
 // src/components/VirtualJoystick.tsx
-import { useRef as useRef14 } from "react";
+import { useRef as useRef15 } from "react";
 
 // src/hooks/useVirtualInput.ts
 var _axes = { x: 0, y: 0 };
@@ -8218,10 +8368,10 @@ function VirtualJoystick({
   actionLabel = "A",
   actionName = "action"
 }) {
-  const baseRef = useRef14(null);
-  const stickRef = useRef14(null);
-  const activePtr = useRef14(null);
-  const baseCenterRef = useRef14({ x: 0, y: 0 });
+  const baseRef = useRef15(null);
+  const stickRef = useRef15(null);
+  const activePtr = useRef15(null);
+  const baseCenterRef = useRef15({ x: 0, y: 0 });
   const radius = size / 2 - 16;
   const applyStickPosition = (dx, dy) => {
     if (!stickRef.current) return;
@@ -8445,7 +8595,7 @@ function Checkpoint({
 }
 
 // src/components/Tilemap.tsx
-import { useEffect as useEffect29, useState as useState6, useContext as useContext20 } from "react";
+import { useEffect as useEffect30, useState as useState6, useContext as useContext20 } from "react";
 import { Fragment as Fragment5, jsx as jsx10 } from "react/jsx-runtime";
 var animatedTiles = /* @__PURE__ */ new Map();
 function getProperty(props, name) {
@@ -8476,7 +8626,7 @@ function Tilemap({
 }) {
   const engine = useContext20(EngineContext);
   const [spawnedNodes, setSpawnedNodes] = useState6([]);
-  useEffect29(() => {
+  useEffect30(() => {
     if (!engine) return;
     const createdEntities = [];
     async function load() {
@@ -8696,7 +8846,7 @@ function Tilemap({
 }
 
 // src/components/ParallaxLayer.tsx
-import { useEffect as useEffect30, useContext as useContext21 } from "react";
+import { useEffect as useEffect31, useContext as useContext21 } from "react";
 import { jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
 function ParallaxLayerInner({
   src,
@@ -8710,7 +8860,7 @@ function ParallaxLayerInner({
 }) {
   const engine = useContext21(EngineContext);
   const entityId = useContext21(EntityContext);
-  useEffect30(() => {
+  useEffect31(() => {
     engine.ecs.addComponent(entityId, {
       type: "ParallaxLayer",
       src,
@@ -8726,7 +8876,7 @@ function ParallaxLayerInner({
     });
     return () => engine.ecs.removeComponent(entityId, "ParallaxLayer");
   }, []);
-  useEffect30(() => {
+  useEffect31(() => {
     const layer = engine.ecs.getComponent(entityId, "ParallaxLayer");
     if (!layer) return;
     layer.src = src;
@@ -8769,10 +8919,10 @@ function ParallaxLayer({
 }
 
 // src/components/ScreenFlash.tsx
-import { forwardRef, useImperativeHandle, useRef as useRef15 } from "react";
+import { forwardRef, useImperativeHandle, useRef as useRef16 } from "react";
 import { jsx as jsx12 } from "react/jsx-runtime";
 var ScreenFlash = forwardRef((_, ref) => {
-  const divRef = useRef15(null);
+  const divRef = useRef16(null);
   useImperativeHandle(ref, () => ({
     flash(color, duration) {
       const el = divRef.current;
@@ -8808,13 +8958,13 @@ var ScreenFlash = forwardRef((_, ref) => {
 ScreenFlash.displayName = "ScreenFlash";
 
 // src/components/CameraZone.tsx
-import { useEffect as useEffect31, useContext as useContext22, useRef as useRef16 } from "react";
+import { useEffect as useEffect32, useContext as useContext22, useRef as useRef17 } from "react";
 import { Fragment as Fragment6, jsx as jsx13 } from "react/jsx-runtime";
 function CameraZone({ x, y, width, height, watchTag = "player", targetX, targetY, children }) {
   const engine = useContext22(EngineContext);
-  const prevFollowRef = useRef16(void 0);
-  const activeRef = useRef16(false);
-  useEffect31(() => {
+  const prevFollowRef = useRef17(void 0);
+  const activeRef = useRef17(false);
+  useEffect32(() => {
     const eid = engine.ecs.createEntity();
     engine.ecs.addComponent(
       eid,
@@ -8864,7 +9014,7 @@ function CameraZone({ x, y, width, height, watchTag = "player", targetX, targetY
 }
 
 // src/components/VirtualCamera.tsx
-import { useEffect as useEffect32, useContext as useContext23 } from "react";
+import { useEffect as useEffect33, useContext as useContext23 } from "react";
 var registries = /* @__PURE__ */ new WeakMap();
 var driverEids = /* @__PURE__ */ new WeakMap();
 var driverRefs = /* @__PURE__ */ new WeakMap();
@@ -8966,7 +9116,7 @@ function VirtualCamera({
   blendDuration = 0.4
 }) {
   const engine = useContext23(EngineContext);
-  useEffect32(() => {
+  useEffect33(() => {
     acquireDriver(engine);
     const registry2 = getRegistry(engine);
     registry2.set(id, {
@@ -8986,7 +9136,7 @@ function VirtualCamera({
       releaseDriver(engine);
     };
   }, []);
-  useEffect32(() => {
+  useEffect33(() => {
     const entry = getRegistry(engine).get(id);
     if (!entry) return;
     entry.priority = priority;
@@ -9003,11 +9153,11 @@ function VirtualCamera({
 }
 
 // src/components/Trail.tsx
-import { useEffect as useEffect33, useContext as useContext24 } from "react";
+import { useEffect as useEffect34, useContext as useContext24 } from "react";
 function Trail({ length = 20, color = "#ffffff", width = 3 }) {
   const engine = useContext24(EngineContext);
   const entityId = useContext24(EntityContext);
-  useEffect33(() => {
+  useEffect34(() => {
     engine.ecs.addComponent(entityId, createTrail({ length, color, width }));
     return () => engine.ecs.removeComponent(entityId, "Trail");
   }, []);
@@ -9015,7 +9165,7 @@ function Trail({ length = 20, color = "#ffffff", width = 3 }) {
 }
 
 // src/components/NineSlice.tsx
-import { useEffect as useEffect34, useContext as useContext25 } from "react";
+import { useEffect as useEffect35, useContext as useContext25 } from "react";
 function NineSlice({
   src,
   width,
@@ -9028,7 +9178,7 @@ function NineSlice({
 }) {
   const engine = useContext25(EngineContext);
   const entityId = useContext25(EntityContext);
-  useEffect34(() => {
+  useEffect35(() => {
     engine.ecs.addComponent(
       entityId,
       createNineSlice(src, width, height, {
@@ -9045,10 +9195,10 @@ function NineSlice({
 }
 
 // src/components/AssetLoader.tsx
-import { useEffect as useEffect36 } from "react";
+import { useEffect as useEffect37 } from "react";
 
 // src/hooks/usePreload.ts
-import { useState as useState7, useEffect as useEffect35, useContext as useContext26 } from "react";
+import { useState as useState7, useEffect as useEffect36, useContext as useContext26 } from "react";
 function usePreload(assets) {
   const engine = useContext26(EngineContext);
   const [state, setState] = useState7({
@@ -9056,7 +9206,7 @@ function usePreload(assets) {
     loaded: assets.length === 0,
     error: null
   });
-  useEffect35(() => {
+  useEffect36(() => {
     if (assets.length === 0) {
       setState({ progress: 1, loaded: true, error: null });
       return;
@@ -9093,7 +9243,7 @@ function usePreload(assets) {
 import { Fragment as Fragment7, jsx as jsx14 } from "react/jsx-runtime";
 function AssetLoader({ assets, fallback = null, onError, children }) {
   const { loaded, error } = usePreload(assets);
-  useEffect36(() => {
+  useEffect37(() => {
     if (error && onError) onError(error);
   }, [error, onError]);
   if (!loaded) {
@@ -9103,7 +9253,7 @@ function AssetLoader({ assets, fallback = null, onError, children }) {
 }
 
 // src/components/Circle.tsx
-import { useEffect as useEffect37, useContext as useContext27 } from "react";
+import { useEffect as useEffect38, useContext as useContext27 } from "react";
 function Circle({
   radius = 16,
   color = "#ffffff",
@@ -9114,7 +9264,7 @@ function Circle({
 }) {
   const engine = useContext27(EngineContext);
   const entityId = useContext27(EntityContext);
-  useEffect37(() => {
+  useEffect38(() => {
     const comp = createCircleShape({
       radius,
       color,
@@ -9126,7 +9276,7 @@ function Circle({
     engine.ecs.addComponent(entityId, comp);
     return () => engine.ecs.removeComponent(entityId, "CircleShape");
   }, []);
-  useEffect37(() => {
+  useEffect38(() => {
     const comp = engine.ecs.getComponent(entityId, "CircleShape");
     if (!comp) return;
     comp.radius = radius;
@@ -9140,7 +9290,7 @@ function Circle({
 }
 
 // src/components/Line.tsx
-import { useEffect as useEffect38, useContext as useContext28 } from "react";
+import { useEffect as useEffect39, useContext as useContext28 } from "react";
 function Line({
   endX,
   endY,
@@ -9152,7 +9302,7 @@ function Line({
 }) {
   const engine = useContext28(EngineContext);
   const entityId = useContext28(EntityContext);
-  useEffect38(() => {
+  useEffect39(() => {
     const comp = createLineShape({
       endX,
       endY,
@@ -9165,7 +9315,7 @@ function Line({
     engine.ecs.addComponent(entityId, comp);
     return () => engine.ecs.removeComponent(entityId, "LineShape");
   }, []);
-  useEffect38(() => {
+  useEffect39(() => {
     const comp = engine.ecs.getComponent(entityId, "LineShape");
     if (!comp) return;
     comp.endX = endX;
@@ -9180,7 +9330,7 @@ function Line({
 }
 
 // src/components/Polygon.tsx
-import { useEffect as useEffect39, useContext as useContext29 } from "react";
+import { useEffect as useEffect40, useContext as useContext29 } from "react";
 function Polygon({
   points,
   color = "#ffffff",
@@ -9192,7 +9342,7 @@ function Polygon({
 }) {
   const engine = useContext29(EngineContext);
   const entityId = useContext29(EntityContext);
-  useEffect39(() => {
+  useEffect40(() => {
     const comp = createPolygonShape({
       points,
       color,
@@ -9205,7 +9355,7 @@ function Polygon({
     engine.ecs.addComponent(entityId, comp);
     return () => engine.ecs.removeComponent(entityId, "PolygonShape");
   }, []);
-  useEffect39(() => {
+  useEffect40(() => {
     const comp = engine.ecs.getComponent(entityId, "PolygonShape");
     if (!comp) return;
     comp.points = points;
@@ -9220,7 +9370,7 @@ function Polygon({
 }
 
 // src/components/Gradient.tsx
-import { useEffect as useEffect40, useContext as useContext30 } from "react";
+import { useEffect as useEffect41, useContext as useContext30 } from "react";
 function Gradient({
   gradientType = "linear",
   stops,
@@ -9235,7 +9385,7 @@ function Gradient({
 }) {
   const engine = useContext30(EngineContext);
   const entityId = useContext30(EntityContext);
-  useEffect40(() => {
+  useEffect41(() => {
     const comp = createGradient({
       gradientType,
       stops,
@@ -9251,7 +9401,7 @@ function Gradient({
     engine.ecs.addComponent(entityId, comp);
     return () => engine.ecs.removeComponent(entityId, "Gradient");
   }, []);
-  useEffect40(() => {
+  useEffect41(() => {
     const comp = engine.ecs.getComponent(entityId, "Gradient");
     if (!comp) return;
     comp.gradientType = gradientType;
@@ -9265,16 +9415,16 @@ function Gradient({
 }
 
 // src/components/Mask.tsx
-import { useEffect as useEffect41, useContext as useContext31 } from "react";
+import { useEffect as useEffect42, useContext as useContext31 } from "react";
 function Mask({ shape = "rect", width = 64, height = 64, radius = 32, inverted = false }) {
   const engine = useContext31(EngineContext);
   const entityId = useContext31(EntityContext);
-  useEffect41(() => {
+  useEffect42(() => {
     const comp = createMask({ shape, width, height, radius, inverted });
     engine.ecs.addComponent(entityId, comp);
     return () => engine.ecs.removeComponent(entityId, "Mask");
   }, []);
-  useEffect41(() => {
+  useEffect42(() => {
     const comp = engine.ecs.getComponent(entityId, "Mask");
     if (!comp) return;
     comp.shape = shape;
@@ -9287,11 +9437,11 @@ function Mask({ shape = "rect", width = 64, height = 64, radius = 32, inverted =
 }
 
 // src/components/Joint.tsx
-import { useEffect as useEffect42, useContext as useContext32 } from "react";
+import { useEffect as useEffect43, useContext as useContext32 } from "react";
 function Joint({ type, target, anchorA, anchorB, length, stiffness, damping, maxLength }) {
   const engine = useContext32(EngineContext);
   const entityId = useContext32(EntityContext);
-  useEffect42(() => {
+  useEffect43(() => {
     const checkId = setTimeout(() => {
       const targetEntityId = engine.entityIds.get(target);
       if (!targetEntityId) {
@@ -9326,7 +9476,7 @@ function Joint({ type, target, anchorA, anchorB, length, stiffness, damping, max
 }
 
 // src/components/ConvexCollider.tsx
-import { useEffect as useEffect43, useContext as useContext33 } from "react";
+import { useEffect as useEffect44, useContext as useContext33 } from "react";
 function ConvexCollider({
   vertices,
   offsetX = 0,
@@ -9342,7 +9492,7 @@ function ConvexCollider({
 }) {
   const engine = useContext33(EngineContext);
   const entityId = useContext33(EntityContext);
-  useEffect43(() => {
+  useEffect44(() => {
     engine.ecs.addComponent(
       entityId,
       createConvexPolygonCollider(vertices, {
@@ -9364,7 +9514,7 @@ function ConvexCollider({
 }
 
 // src/components/TriangleCollider.tsx
-import { useEffect as useEffect44, useContext as useContext34 } from "react";
+import { useEffect as useEffect45, useContext as useContext34 } from "react";
 function TriangleCollider({
   a,
   b,
@@ -9382,7 +9532,7 @@ function TriangleCollider({
 }) {
   const engine = useContext34(EngineContext);
   const entityId = useContext34(EntityContext);
-  useEffect44(() => {
+  useEffect45(() => {
     engine.ecs.addComponent(
       entityId,
       createTriangleCollider(a, b, c, {
@@ -9404,7 +9554,7 @@ function TriangleCollider({
 }
 
 // src/components/SegmentCollider.tsx
-import { useEffect as useEffect45, useContext as useContext35 } from "react";
+import { useEffect as useEffect46, useContext as useContext35 } from "react";
 function SegmentCollider({
   start: start2,
   end,
@@ -9420,7 +9570,7 @@ function SegmentCollider({
 }) {
   const engine = useContext35(EngineContext);
   const entityId = useContext35(EntityContext);
-  useEffect45(() => {
+  useEffect46(() => {
     engine.ecs.addComponent(
       entityId,
       createSegmentCollider(start2, end, {
@@ -9441,7 +9591,7 @@ function SegmentCollider({
 }
 
 // src/components/HeightFieldCollider.tsx
-import { useEffect as useEffect46, useContext as useContext36 } from "react";
+import { useEffect as useEffect47, useContext as useContext36 } from "react";
 function HeightFieldCollider({
   heights,
   scaleX = 1,
@@ -9456,7 +9606,7 @@ function HeightFieldCollider({
 }) {
   const engine = useContext36(EngineContext);
   const entityId = useContext36(EntityContext);
-  useEffect46(() => {
+  useEffect47(() => {
     engine.ecs.addComponent(
       entityId,
       createHeightFieldCollider(heights, {
@@ -9477,7 +9627,7 @@ function HeightFieldCollider({
 }
 
 // src/components/HalfSpaceCollider.tsx
-import { useEffect as useEffect47, useContext as useContext37 } from "react";
+import { useEffect as useEffect48, useContext as useContext37 } from "react";
 function HalfSpaceCollider({
   normalX = 0,
   normalY = -1,
@@ -9491,7 +9641,7 @@ function HalfSpaceCollider({
 }) {
   const engine = useContext37(EngineContext);
   const entityId = useContext37(EntityContext);
-  useEffect47(() => {
+  useEffect48(() => {
     engine.ecs.addComponent(
       entityId,
       createHalfSpaceCollider({
@@ -9512,7 +9662,7 @@ function HalfSpaceCollider({
 }
 
 // src/components/TriMeshCollider.tsx
-import { useEffect as useEffect48, useContext as useContext38 } from "react";
+import { useEffect as useEffect49, useContext as useContext38 } from "react";
 function TriMeshCollider({
   vertices,
   indices,
@@ -9526,7 +9676,7 @@ function TriMeshCollider({
 }) {
   const engine = useContext38(EngineContext);
   const entityId = useContext38(EntityContext);
-  useEffect48(() => {
+  useEffect49(() => {
     engine.ecs.addComponent(
       entityId,
       createTriMeshCollider(vertices, indices, {
@@ -9609,11 +9759,11 @@ function useCamera() {
 }
 
 // src/hooks/useCameraLookahead.ts
-import { useContext as useContext40, useEffect as useEffect49 } from "react";
+import { useContext as useContext40, useEffect as useEffect50 } from "react";
 function useCameraLookahead(entityId, opts = {}) {
   const engine = useContext40(EngineContext);
   const { distance = 100, smoothing = 3, vertical = false } = opts;
-  useEffect49(() => {
+  useEffect50(() => {
     let offsetX = 0;
     let offsetY = 0;
     const script = createScript((id, world, _input, dt) => {
@@ -9699,17 +9849,17 @@ function useCameraBlend() {
 }
 
 // src/hooks/useCinematicSequence.ts
-import { useEffect as useEffect50, useRef as useRef17, useCallback as useCallback2, useState as useState8, useContext as useContext41 } from "react";
+import { useEffect as useEffect51, useRef as useRef18, useCallback as useCallback3, useState as useState8, useContext as useContext41 } from "react";
 function useCinematicSequence(steps, opts) {
   const engine = useContext41(EngineContext);
-  const stepsRef = useRef17(steps);
+  const stepsRef = useRef18(steps);
   stepsRef.current = steps;
-  const optsRef = useRef17(opts);
+  const optsRef = useRef18(opts);
   optsRef.current = opts;
   const [isPlaying, setIsPlaying] = useState8(false);
   const [currentStep, setCurrentStep] = useState8(-1);
-  const stateRef = useRef17({ playing: false, step: -1, elapsed: 0, scriptEid: null });
-  const activateStep = useCallback2(
+  const stateRef = useRef18({ playing: false, step: -1, elapsed: 0, scriptEid: null });
+  const activateStep = useCallback3(
     (idx) => {
       const steps2 = stepsRef.current;
       if (idx < 0 || idx >= steps2.length) return;
@@ -9729,7 +9879,7 @@ function useCinematicSequence(steps, opts) {
     },
     [engine]
   );
-  const play = useCallback2(() => {
+  const play = useCallback3(() => {
     const state = stateRef.current;
     state.playing = true;
     state.step = 0;
@@ -9738,7 +9888,7 @@ function useCinematicSequence(steps, opts) {
     setCurrentStep(0);
     activateStep(0);
   }, [activateStep]);
-  const stop = useCallback2(() => {
+  const stop = useCallback3(() => {
     const state = stateRef.current;
     if (!state.playing) return;
     state.playing = false;
@@ -9750,7 +9900,7 @@ function useCinematicSequence(steps, opts) {
       if (entry) entry.active = false;
     }
   }, [engine]);
-  useEffect50(() => {
+  useEffect51(() => {
     const state = stateRef.current;
     const eid = engine.ecs.createEntity();
     state.scriptEid = eid;
@@ -9819,13 +9969,13 @@ function useEntity() {
 }
 
 // src/hooks/useDestroyEntity.ts
-import { useCallback as useCallback3, useContext as useContext43 } from "react";
+import { useCallback as useCallback4, useContext as useContext43 } from "react";
 function useDestroyEntity() {
   const engine = useContext43(EngineContext);
   const entityId = useContext43(EntityContext);
   if (!engine) throw new Error("useDestroyEntity must be used inside <Game>");
   if (entityId === null) throw new Error("useDestroyEntity must be used inside <Entity>");
-  return useCallback3(() => {
+  return useCallback4(() => {
     if (engine.ecs.hasEntity(entityId)) {
       engine.ecs.destroyEntity(entityId);
     }
@@ -9858,7 +10008,7 @@ function useInputMap(bindings) {
 }
 
 // src/hooks/useEvents.ts
-import { useContext as useContext45, useEffect as useEffect51, useRef as useRef18 } from "react";
+import { useContext as useContext45, useEffect as useEffect52, useRef as useRef19 } from "react";
 function useEvents() {
   const engine = useContext45(EngineContext);
   if (!engine) throw new Error("useEvents must be used inside <Game>");
@@ -9866,18 +10016,18 @@ function useEvents() {
 }
 function useEvent(event, handler) {
   const events = useEvents();
-  const handlerRef = useRef18(handler);
+  const handlerRef = useRef19(handler);
   handlerRef.current = handler;
-  useEffect51(() => {
+  useEffect52(() => {
     return events.on(event, (data) => handlerRef.current(data));
   }, [events, event]);
 }
 
 // src/hooks/useCoordinates.ts
-import { useCallback as useCallback4, useContext as useContext46 } from "react";
+import { useCallback as useCallback5, useContext as useContext46 } from "react";
 function useCoordinates() {
   const engine = useContext46(EngineContext);
-  const worldToScreen = useCallback4(
+  const worldToScreen = useCallback5(
     (wx, wy) => {
       const canvas = engine.canvas;
       const camId = engine.ecs.queryOne("Camera2D");
@@ -9891,7 +10041,7 @@ function useCoordinates() {
     },
     [engine.ecs, engine.canvas]
   );
-  const screenToWorld3 = useCallback4(
+  const screenToWorld3 = useCallback5(
     (sx, sy) => {
       const canvas = engine.canvas;
       const camId = engine.ecs.queryOne("Camera2D");
@@ -9909,14 +10059,14 @@ function useCoordinates() {
 }
 
 // src/hooks/useWorldQuery.ts
-import { useEffect as useEffect52, useRef as useRef19, useState as useState9 } from "react";
+import { useEffect as useEffect53, useRef as useRef20, useState as useState9 } from "react";
 function useWorldQuery(...components) {
   const engine = useGame();
   const [result, setResult] = useState9(() => engine.ecs.query(...components));
-  const prevRef = useRef19([]);
-  const rafRef = useRef19(0);
-  const mountedRef = useRef19(true);
-  useEffect52(() => {
+  const prevRef = useRef20([]);
+  const rafRef = useRef20(0);
+  const mountedRef = useRef20(true);
+  useEffect53(() => {
     mountedRef.current = true;
     const tick2 = () => {
       if (!mountedRef.current) return;
@@ -9938,9 +10088,9 @@ function useWorldQuery(...components) {
 }
 
 // src/hooks/useInputContext.ts
-import { useEffect as useEffect53, useMemo as useMemo5 } from "react";
+import { useEffect as useEffect54, useMemo as useMemo5 } from "react";
 function useInputContext(ctx) {
-  useEffect53(() => {
+  useEffect54(() => {
     if (!ctx) return;
     globalInputContext.push(ctx);
     return () => globalInputContext.pop(ctx);
@@ -9982,12 +10132,12 @@ function useInputRecorder() {
 }
 
 // src/hooks/useGamepad.ts
-import { useEffect as useEffect54, useRef as useRef20, useState as useState10 } from "react";
+import { useEffect as useEffect55, useRef as useRef21, useState as useState10 } from "react";
 var EMPTY_STATE = { connected: false, axes: [], buttons: [] };
 function useGamepad(playerIndex = 0) {
   const [state, setState] = useState10(EMPTY_STATE);
-  const rafRef = useRef20(0);
-  useEffect54(() => {
+  const rafRef = useRef21(0);
+  useEffect55(() => {
     const poll = () => {
       const gp = navigator.getGamepads()[playerIndex];
       if (gp) {
@@ -10008,19 +10158,19 @@ function useGamepad(playerIndex = 0) {
 }
 
 // src/hooks/usePause.ts
-import { useContext as useContext47, useState as useState11, useCallback as useCallback5 } from "react";
+import { useContext as useContext47, useState as useState11, useCallback as useCallback6 } from "react";
 function usePause() {
   const engine = useContext47(EngineContext);
   const [paused, setPaused] = useState11(false);
-  const pause = useCallback5(() => {
+  const pause = useCallback6(() => {
     engine.loop.pause();
     setPaused(true);
   }, [engine]);
-  const resume = useCallback5(() => {
+  const resume = useCallback6(() => {
     engine.loop.resume();
     setPaused(false);
   }, [engine]);
-  const toggle = useCallback5(() => {
+  const toggle = useCallback6(() => {
     if (engine.loop.isPaused) resume();
     else pause();
   }, [engine, pause, resume]);
@@ -10028,7 +10178,7 @@ function usePause() {
 }
 
 // src/hooks/useProfiler.ts
-import { useContext as useContext48, useEffect as useEffect55, useRef as useRef21, useState as useState12 } from "react";
+import { useContext as useContext48, useEffect as useEffect56, useRef as useRef22, useState as useState12 } from "react";
 var EMPTY = {
   fps: 0,
   frameTime: 0,
@@ -10038,10 +10188,10 @@ var EMPTY = {
 function useProfiler() {
   const engine = useContext48(EngineContext);
   const [data, setData] = useState12(EMPTY);
-  const frameTimesRef = useRef21([]);
-  const lastUpdateRef = useRef21(0);
-  const prevTimeRef = useRef21(0);
-  useEffect55(() => {
+  const frameTimesRef = useRef22([]);
+  const lastUpdateRef = useRef22(0);
+  const prevTimeRef = useRef22(0);
+  useEffect56(() => {
     if (!engine) return;
     let rafId2;
     const frameTimes = frameTimesRef.current;
@@ -10081,10 +10231,10 @@ function useProfiler() {
 }
 
 // src/hooks/usePostProcess.ts
-import { useEffect as useEffect56 } from "react";
+import { useEffect as useEffect57 } from "react";
 function usePostProcess(effect) {
   const engine = useGame();
-  useEffect56(() => {
+  useEffect57(() => {
     engine.postProcessStack.add(effect);
     return () => {
       engine.postProcessStack.remove(effect);
@@ -10093,11 +10243,11 @@ function usePostProcess(effect) {
 }
 
 // src/hooks/useWebGLPostProcess.ts
-import { useEffect as useEffect57, useMemo as useMemo9 } from "react";
+import { useEffect as useEffect58, useMemo as useMemo9 } from "react";
 function useWebGLPostProcess(opts) {
   const engine = useGame();
   const optsKey = useMemo9(() => JSON.stringify(opts), [JSON.stringify(opts)]);
-  useEffect57(() => {
+  useEffect58(() => {
     const rs = engine.activeRenderSystem;
     rs.setPostProcessOptions?.(opts);
     return () => {
@@ -10107,10 +10257,10 @@ function useWebGLPostProcess(opts) {
 }
 
 // src/hooks/useAudioListener.ts
-import { useEffect as useEffect58, useContext as useContext49 } from "react";
+import { useEffect as useEffect59, useContext as useContext49 } from "react";
 function useAudioListener() {
   const engine = useContext49(EngineContext);
-  useEffect58(() => {
+  useEffect59(() => {
     const eid = engine.ecs.createEntity();
     engine.ecs.addComponent(
       eid,
@@ -10154,13 +10304,13 @@ function useTouch() {
 }
 
 // src/hooks/useGestures.ts
-import { useEffect as useEffect59, useRef as useRef22 } from "react";
+import { useEffect as useEffect60, useRef as useRef23 } from "react";
 function useGestures(handlers, opts = {}) {
-  const handlersRef = useRef22(handlers);
+  const handlersRef = useRef23(handlers);
   handlersRef.current = handlers;
-  const optsRef = useRef22(opts);
+  const optsRef = useRef23(opts);
   optsRef.current = opts;
-  useEffect59(() => {
+  useEffect60(() => {
     const target = optsRef.current.target ?? window;
     let starts = [];
     let longPressTimer = null;
@@ -10320,14 +10470,14 @@ var touchHapticsControls = {
 };
 
 // src/hooks/useTimer.ts
-import { useRef as useRef23, useCallback as useCallback6, useEffect as useEffect60, useContext as useContext51 } from "react";
+import { useRef as useRef24, useCallback as useCallback7, useEffect as useEffect61, useContext as useContext51 } from "react";
 function useTimer(duration, onComplete, opts) {
   const engine = useContext51(EngineContext);
-  const onCompleteRef = useRef23(onComplete);
+  const onCompleteRef = useRef24(onComplete);
   onCompleteRef.current = onComplete;
-  const loopRef = useRef23(opts?.loop ?? false);
+  const loopRef = useRef24(opts?.loop ?? false);
   loopRef.current = opts?.loop ?? false;
-  const timerRef = useRef23(null);
+  const timerRef = useRef24(null);
   if (!timerRef.current) {
     timerRef.current = createTimer(
       duration,
@@ -10340,7 +10490,7 @@ function useTimer(duration, onComplete, opts) {
       opts?.autoStart ?? false
     );
   }
-  useEffect60(() => {
+  useEffect61(() => {
     const eid = engine.ecs.createEntity();
     engine.ecs.addComponent(
       eid,
@@ -10352,13 +10502,13 @@ function useTimer(duration, onComplete, opts) {
       if (engine.ecs.hasEntity(eid)) engine.ecs.destroyEntity(eid);
     };
   }, [engine.ecs]);
-  const start2 = useCallback6(() => {
+  const start2 = useCallback7(() => {
     timerRef.current.start();
   }, []);
-  const stop = useCallback6(() => {
+  const stop = useCallback7(() => {
     timerRef.current.stop();
   }, []);
-  const reset = useCallback6(() => {
+  const reset = useCallback7(() => {
     timerRef.current.reset();
   }, []);
   return {
@@ -10381,15 +10531,15 @@ function useTimer(duration, onComplete, opts) {
 }
 
 // src/hooks/useCoroutine.ts
-import { useRef as useRef24, useEffect as useEffect61, useContext as useContext52 } from "react";
+import { useRef as useRef25, useEffect as useEffect62, useContext as useContext52 } from "react";
 var wait = (seconds) => ({ type: "wait", seconds });
 var waitFrames = (frames) => ({ type: "waitFrames", frames });
 var waitUntil = (condition) => ({ type: "waitUntil", condition });
 var nextCoroutineId = 1;
 function useCoroutine() {
   const engine = useContext52(EngineContext);
-  const coroutinesRef = useRef24(/* @__PURE__ */ new Map());
-  useEffect61(() => {
+  const coroutinesRef = useRef25(/* @__PURE__ */ new Map());
+  useEffect62(() => {
     const eid = engine.ecs.createEntity();
     engine.ecs.addComponent(
       eid,
@@ -10454,33 +10604,33 @@ function useCoroutine() {
       return coroutinesRef.current.size;
     }
   };
-  const controlsRef = useRef24(controls);
+  const controlsRef = useRef25(controls);
   return controlsRef.current;
 }
 
 // src/hooks/useSceneManager.ts
-import { useState as useState13, useCallback as useCallback7, useRef as useRef25 } from "react";
+import { useState as useState13, useCallback as useCallback8, useRef as useRef26 } from "react";
 function useSceneManager(initialScene) {
   const [stack, setStack] = useState13([initialScene]);
-  const stackRef = useRef25(stack);
+  const stackRef = useRef26(stack);
   stackRef.current = stack;
-  const push = useCallback7((scene) => {
+  const push = useCallback8((scene) => {
     setStack((prev) => [...prev, scene]);
   }, []);
-  const pop = useCallback7(() => {
+  const pop = useCallback8(() => {
     const prev = stackRef.current;
     if (prev.length <= 1) return void 0;
     const popped = prev[prev.length - 1];
     setStack(prev.slice(0, -1));
     return popped;
   }, []);
-  const replace = useCallback7((scene) => {
+  const replace = useCallback8((scene) => {
     setStack((prev) => [...prev.slice(0, -1), scene]);
   }, []);
-  const reset = useCallback7((scene) => {
+  const reset = useCallback8((scene) => {
     setStack([scene]);
   }, []);
-  const has = useCallback7(
+  const has = useCallback8(
     (scene) => {
       return stack.includes(scene);
     },
@@ -10498,7 +10648,7 @@ function useSceneManager(initialScene) {
 }
 
 // src/hooks/useSceneTransition.ts
-import { useState as useState14, useCallback as useCallback8, useRef as useRef26, useEffect as useEffect62 } from "react";
+import { useState as useState14, useCallback as useCallback9, useRef as useRef27, useEffect as useEffect63 } from "react";
 function useSceneTransition(initialScene, defaultTransition) {
   const [stack, setStack] = useState14([initialScene]);
   const [transState, setTransState] = useState14({
@@ -10507,11 +10657,11 @@ function useSceneTransition(initialScene, defaultTransition) {
     effect: null,
     pendingAction: null
   });
-  const stackRef = useRef26(stack);
+  const stackRef = useRef27(stack);
   stackRef.current = stack;
-  const transRef = useRef26(transState);
+  const transRef = useRef27(transState);
   transRef.current = transState;
-  useEffect62(() => {
+  useEffect63(() => {
     if (transState.phase === "idle") return;
     const effect = transState.effect;
     if (!effect || effect.type === "instant") return;
@@ -10540,7 +10690,7 @@ function useSceneTransition(initialScene, defaultTransition) {
     rafId2 = requestAnimationFrame(animate);
     return () => cancelAnimationFrame(rafId2);
   }, [transState.phase, transState.effect]);
-  const startTransition = useCallback8(
+  const startTransition = useCallback9(
     (effect, action) => {
       const eff = effect ?? defaultTransition ?? { type: "instant" };
       if (eff.type === "instant" || isReducedMotionPreferred()) {
@@ -10556,13 +10706,13 @@ function useSceneTransition(initialScene, defaultTransition) {
     },
     [defaultTransition]
   );
-  const push = useCallback8(
+  const push = useCallback9(
     (scene, transition) => {
       startTransition(transition, () => setStack((prev) => [...prev, scene]));
     },
     [startTransition]
   );
-  const pop = useCallback8(
+  const pop = useCallback9(
     (transition) => {
       const prev = stackRef.current;
       if (prev.length <= 1) return void 0;
@@ -10572,13 +10722,13 @@ function useSceneTransition(initialScene, defaultTransition) {
     },
     [startTransition]
   );
-  const replace = useCallback8(
+  const replace = useCallback9(
     (scene, transition) => {
       startTransition(transition, () => setStack((prev) => [...prev.slice(0, -1), scene]));
     },
     [startTransition]
   );
-  const reset = useCallback8(
+  const reset = useCallback9(
     (scene, transition) => {
       startTransition(transition, () => setStack([scene]));
     },
@@ -10679,10 +10829,10 @@ function SceneTransitionOverlay({ controls }) {
 }
 
 // src/hooks/useHitstop.ts
-import { useContext as useContext53, useCallback as useCallback9 } from "react";
+import { useContext as useContext53, useCallback as useCallback10 } from "react";
 function useHitstop() {
   const engine = useContext53(EngineContext);
-  const freeze = useCallback9(
+  const freeze = useCallback10(
     (seconds) => {
       engine.loop.hitPause(seconds);
     },
@@ -10698,9 +10848,9 @@ function useInputBuffer(opts) {
 }
 
 // src/hooks/useComboDetector.ts
-import { useMemo as useMemo11, useRef as useRef27 } from "react";
+import { useMemo as useMemo11, useRef as useRef28 } from "react";
 function useComboDetector(combos) {
-  const lastComboRef = useRef27(null);
+  const lastComboRef = useRef28(null);
   const result = useMemo11(() => {
     const detector = new ComboDetector({ combos });
     const api = {
@@ -10723,11 +10873,11 @@ function useComboDetector(combos) {
 }
 
 // src/hooks/useParent.ts
-import { useEffect as useEffect63, useContext as useContext54 } from "react";
+import { useEffect as useEffect64, useContext as useContext54 } from "react";
 function useParent(childEntityId, parentEntityId) {
   const engine = useContext54(EngineContext);
   if (!engine) throw new Error("useParent must be used inside <Game>");
-  useEffect63(() => {
+  useEffect64(() => {
     setParent(engine.ecs, childEntityId, parentEntityId);
     return () => {
       removeParent(engine.ecs, childEntityId);
@@ -10736,7 +10886,7 @@ function useParent(childEntityId, parentEntityId) {
 }
 
 // src/hooks/useAccessibility.ts
-import { useCallback as useCallback10, useSyncExternalStore } from "react";
+import { useCallback as useCallback11, useSyncExternalStore } from "react";
 var _version = 0;
 var _listeners = /* @__PURE__ */ new Set();
 function subscribe(cb) {
@@ -10748,12 +10898,12 @@ function getSnapshot() {
 }
 function useAccessibility() {
   useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
-  const setOptions = useCallback10((opts) => {
+  const setOptions = useCallback11((opts) => {
     setAccessibilityOptions(opts);
     _version++;
     for (const cb of _listeners) cb();
   }, []);
-  const announce = useCallback10((text, priority) => {
+  const announce = useCallback11((text, priority) => {
     announceToScreenReader(text, priority);
   }, []);
   return {
@@ -10764,18 +10914,18 @@ function useAccessibility() {
 }
 
 // src/hooks/useHMR.ts
-import { useEffect as useEffect64, useRef as useRef28, useMemo as useMemo12 } from "react";
+import { useEffect as useEffect65, useRef as useRef29, useMemo as useMemo12 } from "react";
 var idCounter = 0;
 function useHMR(hmrKey) {
-  const idRef = useRef28(null);
+  const idRef = useRef29(null);
   if (idRef.current === null) {
     idRef.current = hmrKey ?? `__hmr_${idCounter++}`;
   }
   const key = idRef.current;
   const isHotReload = hmrLoadState(key) !== void 0;
-  const disposeRef = useRef28(null);
-  const acceptRef = useRef28(null);
-  useEffect64(() => {
+  const disposeRef = useRef29(null);
+  const acceptRef = useRef29(null);
+  useEffect65(() => {
     const hot = import.meta.hot;
     if (!hot) return;
     hot.dispose(() => {
@@ -10808,11 +10958,11 @@ function useHMR(hmrKey) {
 }
 
 // src/hooks/useSquashStretch.ts
-import { useCallback as useCallback11, useContext as useContext55 } from "react";
+import { useCallback as useCallback12, useContext as useContext55 } from "react";
 function useSquashStretch() {
   const engine = useContext55(EngineContext);
   const entityId = useContext55(EntityContext);
-  const trigger = useCallback11(
+  const trigger = useCallback12(
     (scaleX, scaleY) => {
       const ss = engine.ecs.getComponent(entityId, "SquashStretch");
       if (!ss) return;
@@ -10825,16 +10975,16 @@ function useSquashStretch() {
 }
 
 // src/hooks/useHistory.ts
-import { useCallback as useCallback12, useContext as useContext56, useEffect as useEffect65, useRef as useRef29, useState as useState15 } from "react";
+import { useCallback as useCallback13, useContext as useContext56, useEffect as useEffect66, useRef as useRef30, useState as useState15 } from "react";
 function useHistory(options) {
   const engine = useContext56(EngineContext);
   const capacity = options?.capacity ?? 50;
   const bindKeys = options?.bindKeyboardShortcuts ?? false;
-  const stackRef = useRef29([]);
-  const indexRef = useRef29(-1);
+  const stackRef = useRef30([]);
+  const indexRef = useRef30(-1);
   const [version, setVersion] = useState15(0);
-  const bump = useCallback12(() => setVersion((v) => v + 1), []);
-  const push = useCallback12(() => {
+  const bump = useCallback13(() => setVersion((v) => v + 1), []);
+  const push = useCallback13(() => {
     const snap = engine.ecs.getSnapshot();
     const stack = stackRef.current;
     if (indexRef.current < stack.length - 1) {
@@ -10845,14 +10995,14 @@ function useHistory(options) {
     indexRef.current = stack.length - 1;
     bump();
   }, [engine, capacity, bump]);
-  const undo = useCallback12(() => {
+  const undo = useCallback13(() => {
     if (indexRef.current <= 0) return;
     indexRef.current -= 1;
     engine.ecs.restoreSnapshot(stackRef.current[indexRef.current]);
     engine.loop.markDirty();
     bump();
   }, [engine, bump]);
-  const redo = useCallback12(() => {
+  const redo = useCallback13(() => {
     const stack = stackRef.current;
     if (indexRef.current >= stack.length - 1) return;
     indexRef.current += 1;
@@ -10860,12 +11010,12 @@ function useHistory(options) {
     engine.loop.markDirty();
     bump();
   }, [engine, bump]);
-  const clear = useCallback12(() => {
+  const clear = useCallback13(() => {
     stackRef.current = [];
     indexRef.current = -1;
     bump();
   }, [bump]);
-  useEffect65(() => {
+  useEffect66(() => {
     if (!bindKeys) return;
     const onKey = (e) => {
       const mod = e.ctrlKey || e.metaKey;
@@ -10890,13 +11040,13 @@ function useHistory(options) {
 }
 
 // src/hooks/useSelection.tsx
-import { createContext as createContext2, useCallback as useCallback13, useContext as useContext57, useEffect as useEffect66, useMemo as useMemo13, useState as useState16 } from "react";
+import { createContext as createContext2, useCallback as useCallback14, useContext as useContext57, useEffect as useEffect67, useMemo as useMemo13, useState as useState16 } from "react";
 import { jsx as jsx15 } from "react/jsx-runtime";
 var SelectionContext = createContext2(null);
 function Selection({ initial, onChange, children }) {
   const engine = useContext57(EngineContext);
   const [selected, setSelected] = useState16(initial ?? []);
-  useEffect66(() => {
+  useEffect67(() => {
     if (!engine) return;
     return engine.ecs.onDestroyEntity((destroyedId) => {
       setSelected((prev) => {
@@ -10907,14 +11057,14 @@ function Selection({ initial, onChange, children }) {
       });
     });
   }, [engine, onChange]);
-  const commit = useCallback13(
+  const commit = useCallback14(
     (next) => {
       setSelected(next);
       onChange?.(next);
     },
     [onChange]
   );
-  const select = useCallback13(
+  const select = useCallback14(
     (id, opts) => {
       if (opts?.additive) {
         setSelected((prev) => {
@@ -10929,7 +11079,7 @@ function Selection({ initial, onChange, children }) {
     },
     [commit, onChange]
   );
-  const deselect = useCallback13(
+  const deselect = useCallback14(
     (id) => {
       setSelected((prev) => {
         if (!prev.includes(id)) return prev;
@@ -10940,7 +11090,7 @@ function Selection({ initial, onChange, children }) {
     },
     [onChange]
   );
-  const toggle = useCallback13(
+  const toggle = useCallback14(
     (id) => {
       setSelected((prev) => {
         const next = prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id];
@@ -10950,8 +11100,8 @@ function Selection({ initial, onChange, children }) {
     },
     [onChange]
   );
-  const clear = useCallback13(() => commit([]), [commit]);
-  const isSelected = useCallback13((id) => selected.includes(id), [selected]);
+  const clear = useCallback14(() => commit([]), [commit]);
+  const isSelected = useCallback14((id) => selected.includes(id), [selected]);
   const value = useMemo13(
     () => ({ selected, select, deselect, toggle, clear, isSelected }),
     [selected, select, deselect, toggle, clear, isSelected]
@@ -10965,10 +11115,10 @@ function useSelection() {
 }
 
 // src/components/TransformHandles.tsx
-import { useContext as useContext58, useEffect as useEffect68, useRef as useRef30 } from "react";
+import { useContext as useContext58, useEffect as useEffect69, useRef as useRef31 } from "react";
 
 // src/hooks/useOverlayTick.ts
-import { useEffect as useEffect67 } from "react";
+import { useEffect as useEffect68 } from "react";
 var callbacks = /* @__PURE__ */ new Set();
 var rafId = 0;
 function tick() {
@@ -10991,7 +11141,7 @@ function register(cb) {
   };
 }
 function useOverlayTick(callback, deps = []) {
-  useEffect67(() => {
+  useEffect68(() => {
     return register(callback);
   }, deps);
 }
@@ -11007,8 +11157,8 @@ function TransformHandles({
 }) {
   const engine = useContext58(EngineContext);
   const selection = useSelection();
-  const overlayRef = useRef30(null);
-  const dragRef = useRef30(null);
+  const overlayRef = useRef31(null);
+  const dragRef = useRef31(null);
   useOverlayTick(() => {
     if (!engine) return;
     const overlay = overlayRef.current;
@@ -11043,7 +11193,7 @@ function TransformHandles({
       node.style.transform = `translate(-50%, -50%) rotate(${t.rotation}rad)`;
     }
   }, [engine, selection.selected]);
-  useEffect68(() => {
+  useEffect69(() => {
     if (!engine) return;
     const onMove = (e) => {
       const drag = dragRef.current;
@@ -11267,7 +11417,7 @@ function worldToScreenCss(engine, wx, wy) {
 }
 
 // src/hooks/useSnap.ts
-import { useCallback as useCallback14, useContext as useContext59 } from "react";
+import { useCallback as useCallback15, useContext as useContext59 } from "react";
 function useSnap(options) {
   const engine = useContext59(EngineContext);
   const gridX = typeof options?.grid === "number" ? options.grid : options?.grid?.x ?? 0;
@@ -11275,7 +11425,7 @@ function useSnap(options) {
   const snapToEntities = options?.snapToEntities ?? false;
   const threshold = options?.threshold ?? 8;
   const exclude = options?.exclude;
-  const snapToGrid = useCallback14(
+  const snapToGrid = useCallback15(
     (x, y) => {
       const sx = gridX > 0 ? Math.round(x / gridX) * gridX : x;
       const sy = gridY > 0 ? Math.round(y / gridY) * gridY : y;
@@ -11283,7 +11433,7 @@ function useSnap(options) {
     },
     [gridX, gridY]
   );
-  const snap = useCallback14(
+  const snap = useCallback15(
     (x, y) => {
       let outX = x;
       let outY = y;
@@ -11358,7 +11508,7 @@ function getBounds(ecs, id) {
 }
 
 // src/components/EditableText.tsx
-import { useContext as useContext60, useEffect as useEffect69, useRef as useRef31 } from "react";
+import { useContext as useContext60, useEffect as useEffect70, useRef as useRef32 } from "react";
 import { jsx as jsx17 } from "react/jsx-runtime";
 function EditableText({
   value,
@@ -11382,8 +11532,8 @@ function EditableText({
 }) {
   const engine = useContext60(EngineContext);
   const entityId = useContext60(EntityContext);
-  const containerRef = useRef31(null);
-  const inputRef = useRef31(null);
+  const containerRef = useRef32(null);
+  const inputRef = useRef32(null);
   useOverlayTick(() => {
     if (!engine || entityId === null || entityId === void 0) return;
     const container = containerRef.current;
@@ -11410,7 +11560,7 @@ function EditableText({
     container.style.setProperty("--cubeforge-canvas-left", `${rect.left + window.scrollX}px`);
     container.style.setProperty("--cubeforge-canvas-top", `${rect.top + window.scrollY}px`);
   }, [engine, entityId, width, height, fontSize]);
-  useEffect69(() => {
+  useEffect70(() => {
     if (autoFocus) inputRef.current?.focus();
   }, [autoFocus]);
   if (!engine) return null;
@@ -11541,7 +11691,7 @@ function copyRegion(source, region, scale) {
 }
 
 // src/components/A11yNode.tsx
-import { useContext as useContext61, useRef as useRef32 } from "react";
+import { useContext as useContext61, useRef as useRef33 } from "react";
 import { jsx as jsx18 } from "react/jsx-runtime";
 function A11yNode({
   label,
@@ -11557,7 +11707,7 @@ function A11yNode({
 }) {
   const engine = useContext61(EngineContext);
   const entityId = useContext61(EntityContext);
-  const nodeRef = useRef32(null);
+  const nodeRef = useRef33(null);
   useOverlayTick(() => {
     if (!engine || entityId === null || entityId === void 0) return;
     const node = nodeRef.current;
@@ -11646,7 +11796,7 @@ function worldToScreenCss3(engine, wx, wy) {
 }
 
 // src/components/VectorPath.tsx
-import { useContext as useContext62, useRef as useRef33 } from "react";
+import { useContext as useContext62, useRef as useRef34 } from "react";
 import { jsx as jsx19 } from "react/jsx-runtime";
 function VectorPath({
   d,
@@ -11662,7 +11812,7 @@ function VectorPath({
 }) {
   const engine = useContext62(EngineContext);
   const entityId = useContext62(EntityContext);
-  const svgRef = useRef33(null);
+  const svgRef = useRef34(null);
   useOverlayTick(() => {
     if (!engine || entityId === null || entityId === void 0) return;
     const svg = svgRef.current;
@@ -11723,12 +11873,12 @@ function worldToScreenCss4(engine, wx, wy) {
 }
 
 // src/hooks/useGrid.ts
-import { useCallback as useCallback15, useContext as useContext63, useMemo as useMemo14, useRef as useRef34, useState as useState17 } from "react";
+import { useCallback as useCallback16, useContext as useContext63, useMemo as useMemo14, useRef as useRef35, useState as useState17 } from "react";
 function useGrid({ width, height, fill }) {
   const engine = useContext63(EngineContext);
   const [version, setVersion] = useState17(0);
-  const bump = useCallback15(() => setVersion((v) => v + 1), []);
-  const dataRef = useRef34(null);
+  const bump = useCallback16(() => setVersion((v) => v + 1), []);
+  const dataRef = useRef35(null);
   if (dataRef.current === null) {
     const arr = new Array(width * height);
     if (typeof fill === "function") {
@@ -11743,19 +11893,19 @@ function useGrid({ width, height, fill }) {
     }
     dataRef.current = arr;
   }
-  const markChanged = useCallback15(() => {
+  const markChanged = useCallback16(() => {
     engine?.loop.markDirty();
     bump();
   }, [engine, bump]);
-  const inBounds = useCallback15((x, y) => x >= 0 && y >= 0 && x < width && y < height, [width, height]);
-  const get = useCallback15(
+  const inBounds = useCallback16((x, y) => x >= 0 && y >= 0 && x < width && y < height, [width, height]);
+  const get = useCallback16(
     (x, y) => {
       if (!inBounds(x, y)) return void 0;
       return dataRef.current[y * width + x];
     },
     [width, inBounds]
   );
-  const set = useCallback15(
+  const set = useCallback16(
     (x, y, value) => {
       if (!inBounds(x, y)) return;
       const data = dataRef.current;
@@ -11766,7 +11916,7 @@ function useGrid({ width, height, fill }) {
     },
     [width, inBounds, markChanged]
   );
-  const swap = useCallback15(
+  const swap = useCallback16(
     (ax, ay, bx, by) => {
       if (!inBounds(ax, ay) || !inBounds(bx, by)) return;
       const data = dataRef.current;
@@ -11780,7 +11930,7 @@ function useGrid({ width, height, fill }) {
     },
     [width, inBounds, markChanged]
   );
-  const forEach = useCallback15(
+  const forEach = useCallback16(
     (cb) => {
       const data = dataRef.current;
       for (let y = 0; y < height; y++) {
@@ -11791,7 +11941,7 @@ function useGrid({ width, height, fill }) {
     },
     [width, height]
   );
-  const find = useCallback15(
+  const find = useCallback16(
     (pred) => {
       const data = dataRef.current;
       for (let y = 0; y < height; y++) {
@@ -11804,7 +11954,7 @@ function useGrid({ width, height, fill }) {
     },
     [width, height]
   );
-  const count = useCallback15(
+  const count = useCallback16(
     (pred) => {
       const data = dataRef.current;
       let n = 0;
@@ -11817,7 +11967,7 @@ function useGrid({ width, height, fill }) {
     },
     [width, height]
   );
-  const neighbors = useCallback15(
+  const neighbors = useCallback16(
     (x, y, diagonal = false) => {
       const data = dataRef.current;
       const result = [];
@@ -11845,7 +11995,7 @@ function useGrid({ width, height, fill }) {
     },
     [width, inBounds]
   );
-  const fillAll = useCallback15(
+  const fillAll = useCallback16(
     (value) => {
       const data = dataRef.current;
       if (typeof value === "function") {
@@ -11862,7 +12012,7 @@ function useGrid({ width, height, fill }) {
     },
     [width, height, markChanged]
   );
-  const toArray = useCallback15(() => {
+  const toArray = useCallback16(() => {
     const data = dataRef.current;
     const out = new Array(height);
     for (let y = 0; y < height; y++) {
@@ -11872,7 +12022,7 @@ function useGrid({ width, height, fill }) {
     }
     return out;
   }, [width, height]);
-  const fromArray = useCallback15(
+  const fromArray = useCallback16(
     (arr) => {
       const data = dataRef.current;
       for (let y = 0; y < height; y++) {
@@ -11908,7 +12058,7 @@ function useGrid({ width, height, fill }) {
 }
 
 // src/hooks/useTurnSystem.ts
-import { useCallback as useCallback16, useContext as useContext64, useEffect as useEffect70, useMemo as useMemo15, useRef as useRef35, useState as useState18 } from "react";
+import { useCallback as useCallback17, useContext as useContext64, useEffect as useEffect71, useMemo as useMemo15, useRef as useRef36, useState as useState18 } from "react";
 function useTurnSystem({
   players,
   initialIndex = 0,
@@ -11921,11 +12071,11 @@ function useTurnSystem({
   const [activeIndex, setActiveIndex] = useState18(initialIndex % players.length);
   const [turn, setTurn] = useState18(0);
   const [isPending, setIsPending] = useState18(false);
-  const pendingRafId = useRef35(null);
-  const pendingRemaining = useRef35(0);
-  const pendingTarget = useRef35(null);
-  const pendingLastTime = useRef35(0);
-  const clearPending = useCallback16(() => {
+  const pendingRafId = useRef36(null);
+  const pendingRemaining = useRef36(0);
+  const pendingTarget = useRef36(null);
+  const pendingLastTime = useRef36(0);
+  const clearPending = useCallback17(() => {
     if (pendingRafId.current !== null) {
       cancelAnimationFrame(pendingRafId.current);
       pendingRafId.current = null;
@@ -11933,13 +12083,13 @@ function useTurnSystem({
     pendingTarget.current = null;
     setIsPending(false);
   }, []);
-  const startedOnce = useRef35(false);
-  useEffect70(() => {
+  const startedOnce = useRef36(false);
+  useEffect71(() => {
     if (startedOnce.current) return;
     startedOnce.current = true;
     onTurnStart?.({ player: players[activeIndex], index: activeIndex, turn: 0 });
   }, []);
-  const applyChange = useCallback16(
+  const applyChange = useCallback17(
     (nextIndex) => {
       const curr = players[activeIndex];
       onTurnEnd?.({ player: curr, index: activeIndex, turn });
@@ -11952,7 +12102,7 @@ function useTurnSystem({
     },
     [players, activeIndex, turn, onTurnStart, onTurnEnd, engine]
   );
-  const scheduleChange = useCallback16(
+  const scheduleChange = useCallback17(
     (nextIndex) => {
       clearPending();
       if (aiDelay <= 0) {
@@ -11984,9 +12134,9 @@ function useTurnSystem({
     },
     [aiDelay, applyChange, clearPending, engine]
   );
-  const nextTurn = useCallback16(() => scheduleChange(activeIndex + 1), [scheduleChange, activeIndex]);
-  const prevTurn = useCallback16(() => scheduleChange(activeIndex - 1), [scheduleChange, activeIndex]);
-  const skipTo = useCallback16(
+  const nextTurn = useCallback17(() => scheduleChange(activeIndex + 1), [scheduleChange, activeIndex]);
+  const prevTurn = useCallback17(() => scheduleChange(activeIndex - 1), [scheduleChange, activeIndex]);
+  const skipTo = useCallback17(
     (target) => {
       let idx;
       if (typeof target === "number") {
@@ -11999,13 +12149,13 @@ function useTurnSystem({
     },
     [players, scheduleChange]
   );
-  const reset = useCallback16(() => {
+  const reset = useCallback17(() => {
     clearPending();
     setActiveIndex(initialIndex % players.length);
     setTurn(0);
     engine?.loop.markDirty();
   }, [players.length, initialIndex, clearPending, engine]);
-  useEffect70(
+  useEffect71(
     () => () => {
       if (pendingRafId.current !== null) cancelAnimationFrame(pendingRafId.current);
     },
@@ -12027,13 +12177,13 @@ function useTurnSystem({
 }
 
 // src/hooks/useHoverable.ts
-import { useContext as useContext65, useEffect as useEffect71, useState as useState19 } from "react";
+import { useContext as useContext65, useEffect as useEffect72, useState as useState19 } from "react";
 function useHoverable(options) {
   const engine = useContext65(EngineContext);
   const ctxEntityId = useContext65(EntityContext);
   const entityId = options?.entityId ?? ctxEntityId;
   const [isHovered, setIsHovered] = useState19(false);
-  useEffect71(() => {
+  useEffect72(() => {
     if (!engine || entityId === null || entityId === void 0 || options?.disabled) return;
     const canvas = engine.canvas;
     let hovered = false;
@@ -12110,7 +12260,7 @@ function screenToWorld(engine, cssX, cssY) {
 }
 
 // src/hooks/useDragDrop.ts
-import { useContext as useContext66, useEffect as useEffect72, useRef as useRef36, useState as useState20 } from "react";
+import { useContext as useContext66, useEffect as useEffect73, useRef as useRef37, useState as useState20 } from "react";
 var dragStateByEngine = /* @__PURE__ */ new WeakMap();
 function getActiveDrag(engine) {
   return dragStateByEngine.get(engine) ?? null;
@@ -12135,9 +12285,9 @@ function useDraggable(options) {
   const entityId = options?.entityId ?? ctxEntityId;
   const [isDragging, setIsDragging] = useState20(false);
   const [position, setPosition] = useState20({ x: 0, y: 0 });
-  const optsRef = useRef36(options);
+  const optsRef = useRef37(options);
   optsRef.current = options;
-  useEffect72(() => {
+  useEffect73(() => {
     if (!engine || entityId === null || entityId === void 0 || options?.disabled) return;
     const canvas = engine.canvas;
     let dragging = false;
@@ -12247,9 +12397,9 @@ function useDroppable(options) {
   const entityId = options?.entityId ?? ctxEntityId;
   const [isOver, setIsOver] = useState20(false);
   const [hoveredBy, setHoveredBy] = useState20(null);
-  const optsRef = useRef36(options);
+  const optsRef = useRef37(options);
   optsRef.current = options;
-  useEffect72(() => {
+  useEffect73(() => {
     if (!engine || entityId === null || entityId === void 0 || options?.disabled) return;
     let currentlyOver = false;
     const check = () => {
@@ -12351,7 +12501,7 @@ function findDroppableUnder(engine, drag) {
 }
 
 // src/hooks/useKeyboardFocus.ts
-import { useContext as useContext67, useEffect as useEffect73, useRef as useRef37, useState as useState21 } from "react";
+import { useContext as useContext67, useEffect as useEffect74, useRef as useRef38, useState as useState21 } from "react";
 var registry = /* @__PURE__ */ new Map();
 var focusedId = null;
 var subscribers = /* @__PURE__ */ new Set();
@@ -12368,9 +12518,9 @@ function setFocused(id) {
 }
 function useFocusable(options) {
   const entityIdCtx = useContext67(EntityContext);
-  const optsRef = useRef37(options);
+  const optsRef = useRef38(options);
   optsRef.current = options;
-  useEffect73(() => {
+  useEffect74(() => {
     if (entityIdCtx === null || entityIdCtx === void 0) return;
     const id = entityIdCtx;
     const entry = {
@@ -12390,14 +12540,14 @@ function useFocusable(options) {
 function useKeyboardFocus() {
   const engine = useContext67(EngineContext);
   const [focused, setFocusedState] = useState21(focusedId);
-  useEffect73(() => {
+  useEffect74(() => {
     const cb = () => setFocusedState(focusedId);
     subscribers.add(cb);
     return () => {
       subscribers.delete(cb);
     };
   }, []);
-  useEffect73(() => {
+  useEffect74(() => {
     if (!engine) return;
     const onKey = (e) => {
       const target = e.target;
@@ -12523,7 +12673,7 @@ function subscribeFocus(cb) {
 }
 
 // src/components/FocusRing.tsx
-import { useContext as useContext68, useEffect as useEffect74, useRef as useRef38, useState as useState22 } from "react";
+import { useContext as useContext68, useEffect as useEffect75, useRef as useRef39, useState as useState22 } from "react";
 import { Fragment as Fragment9, jsx as jsx20, jsxs as jsxs9 } from "react/jsx-runtime";
 function FocusRing({
   color = "#4fc3f7",
@@ -12533,14 +12683,14 @@ function FocusRing({
   pulse = true
 }) {
   const engine = useContext68(EngineContext);
-  const ringRef = useRef38(null);
+  const ringRef = useRef39(null);
   const [focused, setFocused2] = useState22(getFocusedEntityId());
   const [reducedMotion, setReducedMotion] = useState22(false);
-  useEffect74(() => {
+  useEffect75(() => {
     const unsub = subscribeFocus(() => setFocused2(getFocusedEntityId()));
     return unsub;
   }, []);
-  useEffect74(() => {
+  useEffect75(() => {
     if (typeof window === "undefined" || !window.matchMedia) return;
     const mq = window.matchMedia("(prefers-reduced-motion: reduce)");
     setReducedMotion(mq.matches);
@@ -12677,10 +12827,10 @@ function listSavedScenes(prefix = "") {
 }
 
 // ../gameplay/src/hooks/useAnimationController.ts
-import { useState as useState23, useCallback as useCallback17 } from "react";
+import { useState as useState23, useCallback as useCallback18 } from "react";
 function useAnimationController(states, initial) {
   const [stateName, setStateName] = useState23(initial);
-  const setState = useCallback17((next) => {
+  const setState = useCallback18((next) => {
     setStateName((prev) => prev === next ? prev : next);
   }, []);
   const clip = states[stateName] ?? states[initial];
@@ -12702,39 +12852,39 @@ function useAnimationController(states, initial) {
 }
 
 // ../gameplay/src/hooks/useAISteering.ts
-import { useCallback as useCallback18 } from "react";
+import { useCallback as useCallback19 } from "react";
 function useAISteering() {
-  const seek$ = useCallback18((pos, target, speed) => seek(pos, target, speed), []);
-  const flee$ = useCallback18((pos, threat, speed) => flee(pos, threat, speed), []);
-  const arrive$ = useCallback18(
+  const seek$ = useCallback19((pos, target, speed) => seek(pos, target, speed), []);
+  const flee$ = useCallback19((pos, threat, speed) => flee(pos, threat, speed), []);
+  const arrive$ = useCallback19(
     (pos, target, speed, slowRadius) => arrive(pos, target, speed, slowRadius),
     []
   );
-  const patrol$ = useCallback18(
+  const patrol$ = useCallback19(
     (pos, waypoints, speed, currentIdx, arriveThreshold) => patrol(pos, waypoints, speed, currentIdx, arriveThreshold),
     []
   );
-  const wander$ = useCallback18(
+  const wander$ = useCallback19(
     (pos, angle, speed, jitter) => wander(pos, angle, speed, jitter),
     []
   );
-  const pursuit$ = useCallback18(
+  const pursuit$ = useCallback19(
     (pos, targetPos, targetVel, speed, lookAhead) => pursuit(pos, targetPos, targetVel, speed, lookAhead),
     []
   );
-  const evade$ = useCallback18(
+  const evade$ = useCallback19(
     (pos, threatPos, threatVel, speed, lookAhead) => evade(pos, threatPos, threatVel, speed, lookAhead),
     []
   );
-  const separation$ = useCallback18(
+  const separation$ = useCallback19(
     (pos, neighbors, speed, radius) => separation(pos, neighbors, speed, radius),
     []
   );
-  const cohesion$ = useCallback18(
+  const cohesion$ = useCallback19(
     (pos, neighbors, speed) => cohesion(pos, neighbors, speed),
     []
   );
-  const alignment$ = useCallback18(
+  const alignment$ = useCallback19(
     (neighborVelocities, speed) => alignment(neighborVelocities, speed),
     []
   );
@@ -12765,11 +12915,11 @@ function useDamageZone(damage, opts = {}) {
 }
 
 // ../gameplay/src/hooks/useDropThrough.ts
-import { useContext as useContext70, useCallback as useCallback19 } from "react";
+import { useContext as useContext70, useCallback as useCallback20 } from "react";
 function useDropThrough(frames = 8) {
   const engine = useContext70(EngineContext);
   const entityId = useContext70(EntityContext);
-  const dropThrough = useCallback19(() => {
+  const dropThrough = useCallback20(() => {
     const rb = engine.ecs.getComponent(entityId, "RigidBody");
     if (rb) rb.dropThrough = frames;
   }, [engine.ecs, entityId, frames]);
@@ -12777,17 +12927,17 @@ function useDropThrough(frames = 8) {
 }
 
 // ../gameplay/src/hooks/useGameStateMachine.ts
-import { useState as useState24, useRef as useRef39, useCallback as useCallback20, useEffect as useEffect75, useContext as useContext71 } from "react";
+import { useState as useState24, useRef as useRef40, useCallback as useCallback21, useEffect as useEffect76, useContext as useContext71 } from "react";
 function useGameStateMachine(states, initial) {
   const engine = useContext71(EngineContext);
   const [state, setState] = useState24(initial);
-  const stateRef = useRef39(initial);
-  const statesRef = useRef39(states);
+  const stateRef = useRef40(initial);
+  const statesRef = useRef40(states);
   statesRef.current = states;
-  useEffect75(() => {
+  useEffect76(() => {
     statesRef.current[initial]?.onEnter?.();
   }, []);
-  const transition = useCallback20((to) => {
+  const transition = useCallback21((to) => {
     const current = stateRef.current;
     if (current === to) return;
     statesRef.current[current]?.onExit?.();
@@ -12795,7 +12945,7 @@ function useGameStateMachine(states, initial) {
     setState(to);
     statesRef.current[to]?.onEnter?.();
   }, []);
-  useEffect75(() => {
+  useEffect76(() => {
     const eid = engine.ecs.createEntity();
     engine.ecs.addComponent(
       eid,
@@ -12811,27 +12961,27 @@ function useGameStateMachine(states, initial) {
 }
 
 // ../gameplay/src/hooks/useHealth.ts
-import { useRef as useRef40, useEffect as useEffect76, useContext as useContext72, useCallback as useCallback21 } from "react";
+import { useRef as useRef41, useEffect as useEffect77, useContext as useContext72, useCallback as useCallback22 } from "react";
 function useHealth(maxHp, opts = {}) {
   const engine = useContext72(EngineContext);
   const entityId = useContext72(EntityContext);
-  const hpRef = useRef40(maxHp);
-  const invincibleRef = useRef40(false);
+  const hpRef = useRef41(maxHp);
+  const invincibleRef = useRef41(false);
   const iFrameDuration = opts.iFrames ?? 1;
-  const onDeathRef = useRef40(opts.onDeath);
-  const onDamageRef = useRef40(opts.onDamage);
-  useEffect76(() => {
+  const onDeathRef = useRef41(opts.onDeath);
+  const onDamageRef = useRef41(opts.onDamage);
+  useEffect77(() => {
     onDeathRef.current = opts.onDeath;
   });
-  useEffect76(() => {
+  useEffect77(() => {
     onDamageRef.current = opts.onDamage;
   });
-  const timerRef = useRef40(
+  const timerRef = useRef41(
     createTimer(iFrameDuration, () => {
       invincibleRef.current = false;
     })
   );
-  const takeDamage = useCallback21(
+  const takeDamage = useCallback22(
     (amount = 1) => {
       if (invincibleRef.current || hpRef.current <= 0) return;
       hpRef.current = Math.max(0, hpRef.current - amount);
@@ -12844,28 +12994,28 @@ function useHealth(maxHp, opts = {}) {
     },
     [iFrameDuration]
   );
-  const takeDamageRef = useRef40(takeDamage);
-  useEffect76(() => {
+  const takeDamageRef = useRef41(takeDamage);
+  useEffect77(() => {
     takeDamageRef.current = takeDamage;
   }, [takeDamage]);
-  useEffect76(() => {
+  useEffect77(() => {
     return engine.events.on(`damage:${entityId}`, ({ amount }) => {
       takeDamageRef.current(amount);
     });
   }, [engine.events, entityId]);
-  const heal = useCallback21(
+  const heal = useCallback22(
     (amount) => {
       hpRef.current = Math.min(maxHp, hpRef.current + amount);
     },
     [maxHp]
   );
-  const setHp = useCallback21(
+  const setHp = useCallback22(
     (hp) => {
       hpRef.current = Math.min(maxHp, Math.max(0, hp));
     },
     [maxHp]
   );
-  const update = useCallback21((dt) => {
+  const update = useCallback22((dt) => {
     timerRef.current.update(dt);
   }, []);
   return {
@@ -12889,11 +13039,11 @@ function useHealth(maxHp, opts = {}) {
 }
 
 // ../gameplay/src/hooks/useKinematicBody.ts
-import { useContext as useContext73, useCallback as useCallback22 } from "react";
+import { useContext as useContext73, useCallback as useCallback23 } from "react";
 function useKinematicBody() {
   const engine = useContext73(EngineContext);
   const entityId = useContext73(EntityContext);
-  const moveAndCollide = useCallback22(
+  const moveAndCollide = useCallback23(
     (dx, dy) => {
       const transform = engine.ecs.getComponent(entityId, "Transform");
       if (!transform) return { dx: 0, dy: 0 };
@@ -12929,7 +13079,7 @@ function useKinematicBody() {
     },
     [engine.ecs, entityId]
   );
-  const setVelocity = useCallback22(
+  const setVelocity = useCallback23(
     (vx, vy) => {
       const rb = engine.ecs.getComponent(entityId, "RigidBody");
       if (rb) {
@@ -12939,7 +13089,7 @@ function useKinematicBody() {
     },
     [engine.ecs, entityId]
   );
-  const setAngularVelocity = useCallback22(
+  const setAngularVelocity = useCallback23(
     (w) => {
       const rb = engine.ecs.getComponent(entityId, "RigidBody");
       if (rb) rb.angularVelocity = w;
@@ -12950,12 +13100,12 @@ function useKinematicBody() {
 }
 
 // ../gameplay/src/hooks/useLevelTransition.ts
-import { useState as useState25, useRef as useRef41, useCallback as useCallback23 } from "react";
+import { useState as useState25, useRef as useRef42, useCallback as useCallback24 } from "react";
 function useLevelTransition(initial) {
   const [currentLevel, setCurrentLevel] = useState25(initial);
   const [isTransitioning, setIsTransitioning] = useState25(false);
-  const overlayRef = useRef41(null);
-  const transitionTo = useCallback23((level, opts = {}) => {
+  const overlayRef = useRef42(null);
+  const transitionTo = useCallback24((level, opts = {}) => {
     const { duration = 0.4, type = "fade" } = opts;
     if (type === "instant") {
       setCurrentLevel(level);
@@ -12992,7 +13142,7 @@ function useLevelTransition(initial) {
 }
 
 // ../gameplay/src/hooks/usePlatformerController.ts
-import { useContext as useContext74, useEffect as useEffect77 } from "react";
+import { useContext as useContext74, useEffect as useEffect78 } from "react";
 function normalizeKeys(val, defaults) {
   if (!val) return defaults;
   return Array.isArray(val) ? val : [val];
@@ -13016,7 +13166,7 @@ function usePlatformerController(entityId, opts = {}) {
   const leftKeys = normalizeKeys(bindings?.left, ["ArrowLeft", "KeyA", "a"]);
   const rightKeys = normalizeKeys(bindings?.right, ["ArrowRight", "KeyD", "d"]);
   const jumpKeys = normalizeKeys(bindings?.jump, ["Space", "ArrowUp", "KeyW", "w"]);
-  useEffect77(() => {
+  useEffect78(() => {
     const state = {
       coyoteTimer: 0,
       jumpBuffer: 0,
@@ -13080,22 +13230,22 @@ function usePlatformerController(entityId, opts = {}) {
 }
 
 // ../gameplay/src/hooks/usePathfinding.ts
-import { useCallback as useCallback24 } from "react";
+import { useCallback as useCallback25 } from "react";
 function usePathfinding() {
-  const createGrid$ = useCallback24(
+  const createGrid$ = useCallback25(
     (cols, rows, cellSize) => createNavGrid(cols, rows, cellSize),
     []
   );
-  const setWalkable$ = useCallback24(
+  const setWalkable$ = useCallback25(
     (grid, col, row, walkable) => setWalkable(grid, col, row, walkable),
     []
   );
-  const findPath$ = useCallback24((grid, start2, goal) => findPath(grid, start2, goal), []);
+  const findPath$ = useCallback25((grid, start2, goal) => findPath(grid, start2, goal), []);
   return { createGrid: createGrid$, setWalkable: setWalkable$, findPath: findPath$ };
 }
 
 // ../gameplay/src/hooks/usePersistedBindings.ts
-import { useState as useState26, useCallback as useCallback25, useMemo as useMemo16, useContext as useContext75 } from "react";
+import { useState as useState26, useCallback as useCallback26, useMemo as useMemo16, useContext as useContext75 } from "react";
 function usePersistedBindings(storageKey, defaults) {
   const engine = useContext75(EngineContext);
   const input = engine.input;
@@ -13115,7 +13265,7 @@ function usePersistedBindings(storageKey, defaults) {
     }
     return out;
   }, [bindings]);
-  const rebind = useCallback25(
+  const rebind = useCallback26(
     (action, keys) => {
       setBindings((prev) => {
         const next = { ...prev, [action]: Array.isArray(keys) ? keys : [keys] };
@@ -13128,7 +13278,7 @@ function usePersistedBindings(storageKey, defaults) {
     },
     [storageKey]
   );
-  const reset = useCallback25(() => {
+  const reset = useCallback26(() => {
     try {
       localStorage.removeItem(storageKey);
     } catch {
@@ -13149,21 +13299,21 @@ function usePersistedBindings(storageKey, defaults) {
 }
 
 // ../gameplay/src/hooks/useRestart.ts
-import { useState as useState27, useCallback as useCallback26 } from "react";
+import { useState as useState27, useCallback as useCallback27 } from "react";
 function useRestart() {
   const [restartKey, setRestartKey] = useState27(0);
-  const restart = useCallback26(() => {
+  const restart = useCallback27(() => {
     setRestartKey((k) => k + 1);
   }, []);
   return { restartKey, restart };
 }
 
 // ../gameplay/src/hooks/useSave.ts
-import { useCallback as useCallback27, useRef as useRef42 } from "react";
+import { useCallback as useCallback28, useRef as useRef43 } from "react";
 function useSave(key, defaultValue, opts = {}) {
   const version = opts.version ?? 1;
-  const dataRef = useRef42(defaultValue);
-  const save = useCallback27(
+  const dataRef = useRef43(defaultValue);
+  const save = useCallback28(
     (value) => {
       dataRef.current = value;
       const slot = { version, data: value };
@@ -13175,7 +13325,7 @@ function useSave(key, defaultValue, opts = {}) {
     },
     [key, version]
   );
-  const load = useCallback27(() => {
+  const load = useCallback28(() => {
     try {
       const raw = localStorage.getItem(key);
       if (!raw) return defaultValue;
@@ -13195,11 +13345,11 @@ function useSave(key, defaultValue, opts = {}) {
       return defaultValue;
     }
   }, [key, version]);
-  const clear = useCallback27(() => {
+  const clear = useCallback28(() => {
     localStorage.removeItem(key);
     dataRef.current = defaultValue;
   }, [key]);
-  const exists = useCallback27(() => {
+  const exists = useCallback28(() => {
     return localStorage.getItem(key) !== null;
   }, [key]);
   return {
@@ -13214,7 +13364,7 @@ function useSave(key, defaultValue, opts = {}) {
 }
 
 // ../gameplay/src/hooks/useIDBSave.ts
-import { useCallback as useCallback28, useRef as useRef43 } from "react";
+import { useCallback as useCallback29, useRef as useRef44 } from "react";
 var DB_NAME = "cubeforge-saves";
 var STORE_NAME = "saves";
 function openDB() {
@@ -13232,12 +13382,12 @@ function openDB() {
 }
 function useIDBSave(key, defaultValue, opts = {}) {
   const version = opts.version ?? 1;
-  const dbRef = useRef43(null);
-  const getDB = useCallback28(() => {
+  const dbRef = useRef44(null);
+  const getDB = useCallback29(() => {
     if (!dbRef.current) dbRef.current = openDB();
     return dbRef.current;
   }, []);
-  const save = useCallback28(
+  const save = useCallback29(
     async (value) => {
       const db = await getDB();
       const slot = { version, data: value };
@@ -13250,7 +13400,7 @@ function useIDBSave(key, defaultValue, opts = {}) {
     },
     [getDB, key, version]
   );
-  const load = useCallback28(async () => {
+  const load = useCallback29(async () => {
     const db = await getDB();
     return new Promise((resolve, reject) => {
       const tx = db.transaction(STORE_NAME, "readonly");
@@ -13276,7 +13426,7 @@ function useIDBSave(key, defaultValue, opts = {}) {
       req.onerror = () => reject(req.error);
     });
   }, [getDB, key, version]);
-  const clear = useCallback28(async () => {
+  const clear = useCallback29(async () => {
     const db = await getDB();
     return new Promise((resolve, reject) => {
       const tx = db.transaction(STORE_NAME, "readwrite");
@@ -13285,7 +13435,7 @@ function useIDBSave(key, defaultValue, opts = {}) {
       req.onerror = () => reject(req.error);
     });
   }, [getDB, key]);
-  const exists = useCallback28(async () => {
+  const exists = useCallback29(async () => {
     const db = await getDB();
     return new Promise((resolve, reject) => {
       const tx = db.transaction(STORE_NAME, "readonly");
@@ -13298,7 +13448,7 @@ function useIDBSave(key, defaultValue, opts = {}) {
 }
 
 // ../gameplay/src/hooks/useSaveSlots.ts
-import { useCallback as useCallback29, useState as useState28 } from "react";
+import { useCallback as useCallback30, useState as useState28 } from "react";
 function useSaveSlots(namespace, opts = {}) {
   const version = opts.version ?? 1;
   const indexKey = `cubeforge-saves:${namespace}:__index`;
@@ -13352,7 +13502,7 @@ function useSaveSlots(namespace, opts = {}) {
     const metas = readIndex().map((id) => readSlot(id)?.meta).filter((m) => m !== void 0).sort((a, b) => a.savedAt < b.savedAt ? 1 : -1);
     setSlots(metas);
   }
-  const save = useCallback29(
+  const save = useCallback30(
     (id, data, label, thumbnail) => {
       const meta = {
         id,
@@ -13367,7 +13517,7 @@ function useSaveSlots(namespace, opts = {}) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [namespace, version]
   );
-  const load = useCallback29(
+  const load = useCallback30(
     (id) => {
       const entry = readSlot(id);
       if (!entry) return null;
@@ -13383,7 +13533,7 @@ function useSaveSlots(namespace, opts = {}) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [namespace, version]
   );
-  const deleteFn = useCallback29(
+  const deleteFn = useCallback30(
     (id) => {
       try {
         localStorage.removeItem(slotKey(id));
@@ -13395,7 +13545,7 @@ function useSaveSlots(namespace, opts = {}) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [namespace]
   );
-  const copy = useCallback29(
+  const copy = useCallback30(
     (fromId, toId) => {
       const entry = readSlot(fromId);
       if (!entry) return false;
@@ -13408,7 +13558,7 @@ function useSaveSlots(namespace, opts = {}) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [namespace, version]
   );
-  const rename = useCallback29(
+  const rename = useCallback30(
     (id, label) => {
       const entry = readSlot(id);
       if (!entry) return;
@@ -13418,10 +13568,10 @@ function useSaveSlots(namespace, opts = {}) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [namespace]
   );
-  const listSlots = useCallback29(() => {
+  const listSlots = useCallback30(() => {
     return readIndex().map((id) => readSlot(id)?.meta).filter((m) => m !== void 0).sort((a, b) => a.savedAt < b.savedAt ? 1 : -1);
   }, [namespace]);
-  const exists = useCallback29(
+  const exists = useCallback30(
     (id) => {
       return readSlot(id) !== null;
     },
@@ -13443,7 +13593,7 @@ function useSaveSlots(namespace, opts = {}) {
 }
 
 // ../gameplay/src/hooks/useTopDownMovement.ts
-import { useContext as useContext76, useEffect as useEffect78 } from "react";
+import { useContext as useContext76, useEffect as useEffect79 } from "react";
 function moveToward(current, target, maxDelta) {
   const diff = target - current;
   if (Math.abs(diff) <= maxDelta) return target;
@@ -13452,7 +13602,7 @@ function moveToward(current, target, maxDelta) {
 function useTopDownMovement(entityId, opts = {}) {
   const engine = useContext76(EngineContext);
   const { speed = 200, normalizeDiagonal = true, acceleration = Infinity, deceleration = acceleration } = opts;
-  useEffect78(() => {
+  useEffect79(() => {
     const updateFn = (id, world, input, dt) => {
       if (!world.hasEntity(id)) return;
       const rb = world.getComponent(id, "RigidBody");
@@ -13492,18 +13642,18 @@ function useTopDownMovement(entityId, opts = {}) {
 }
 
 // ../gameplay/src/hooks/useDialogue.ts
-import { useState as useState29, useCallback as useCallback30, useRef as useRef44 } from "react";
+import { useState as useState29, useCallback as useCallback31, useRef as useRef45 } from "react";
 function useDialogue() {
   const [active, setActive] = useState29(false);
   const [currentId, setCurrentId] = useState29(null);
-  const scriptRef = useRef44(null);
-  const start2 = useCallback30((script, startId) => {
+  const scriptRef = useRef45(null);
+  const start2 = useCallback31((script, startId) => {
     scriptRef.current = script;
     const id = startId ?? Object.keys(script)[0];
     setCurrentId(id);
     setActive(true);
   }, []);
-  const advance = useCallback30(
+  const advance = useCallback31(
     (choiceIndex) => {
       if (!scriptRef.current || !currentId) return;
       const line = scriptRef.current[currentId];
@@ -13533,7 +13683,7 @@ function useDialogue() {
     },
     [currentId]
   );
-  const close = useCallback30(() => {
+  const close = useCallback31(() => {
     setActive(false);
     setCurrentId(null);
     scriptRef.current = null;
@@ -13542,6 +13692,367 @@ function useDialogue() {
   return { active, current, currentId, start: start2, advance, close };
 }
 
+// ../gameplay/src/hooks/useDialogueTree.ts
+import { useState as useState30, useCallback as useCallback32, useRef as useRef46 } from "react";
+function interpolate(text, vars) {
+  return text.replace(/\{(\w+)\}/g, (_, key) => {
+    const val = vars[key];
+    return val !== void 0 ? String(val) : `{${key}}`;
+  });
+}
+function applyVars(node, vars) {
+  return {
+    ...node,
+    text: interpolate(node.text, vars),
+    speaker: node.speaker ? interpolate(node.speaker, vars) : node.speaker
+  };
+}
+function useDialogueTree() {
+  const [active, setActive] = useState30(false);
+  const [currentId, setCurrentId] = useState30(null);
+  const [variables, setVariables] = useState30({});
+  const scriptRef = useRef46(null);
+  const varsRef = useRef46({});
+  function setCurrentNode(id) {
+    if (!id || !scriptRef.current) {
+      setActive(false);
+      setCurrentId(null);
+      return;
+    }
+    const node = scriptRef.current[id];
+    if (!node) {
+      setActive(false);
+      setCurrentId(null);
+      return;
+    }
+    node.onEnter?.(varsRef.current);
+    setCurrentId(id);
+  }
+  const start2 = useCallback32(
+    (script, startId, initialVars) => {
+      scriptRef.current = script;
+      const newVars = { ...varsRef.current, ...initialVars };
+      varsRef.current = newVars;
+      setVariables(newVars);
+      const id = startId ?? Object.keys(script)[0];
+      setActive(true);
+      setCurrentNode(id);
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  );
+  const advance = useCallback32(
+    (choiceIndex) => {
+      if (!scriptRef.current || !currentId) return;
+      const node = scriptRef.current[currentId];
+      if (!node) {
+        setActive(false);
+        setCurrentId(null);
+        return;
+      }
+      node.onExit?.(varsRef.current);
+      if (node.choices && node.choices.length > 0 && choiceIndex !== void 0) {
+        const visible = node.choices.filter((c) => !c.condition || c.condition(varsRef.current));
+        const choice = visible[choiceIndex];
+        if (choice) {
+          choice.onSelect?.(varsRef.current);
+          if (choice.next && scriptRef.current[choice.next]) {
+            setCurrentNode(choice.next);
+          } else {
+            setActive(false);
+            setCurrentId(null);
+          }
+        }
+        return;
+      }
+      if (node.next && scriptRef.current[node.next]) {
+        setCurrentNode(node.next);
+      } else {
+        const keys = Object.keys(scriptRef.current);
+        const idx = keys.indexOf(currentId);
+        if (idx >= 0 && idx + 1 < keys.length) {
+          setCurrentNode(keys[idx + 1]);
+        } else {
+          setActive(false);
+          setCurrentId(null);
+        }
+      }
+    },
+    [currentId]
+  );
+  const jumpTo = useCallback32(
+    (id) => {
+      if (!scriptRef.current?.[id]) return;
+      const current2 = scriptRef.current[currentId ?? ""];
+      current2?.onExit?.(varsRef.current);
+      setCurrentNode(id);
+    },
+    [currentId]
+  );
+  const setVar = useCallback32((key, value) => {
+    varsRef.current = { ...varsRef.current, [key]: value };
+    setVariables({ ...varsRef.current });
+  }, []);
+  const close = useCallback32(() => {
+    if (scriptRef.current && currentId) {
+      scriptRef.current[currentId]?.onExit?.(varsRef.current);
+    }
+    setActive(false);
+    setCurrentId(null);
+    scriptRef.current = null;
+  }, [currentId]);
+  const rawNode = scriptRef.current && currentId ? scriptRef.current[currentId] ?? null : null;
+  const current = rawNode ? applyVars(rawNode, varsRef.current) : null;
+  const visibleChoices = rawNode?.choices ? rawNode.choices.filter((c) => !c.condition || c.condition(varsRef.current)) : [];
+  return {
+    active,
+    current,
+    currentId,
+    visibleChoices,
+    variables,
+    start: start2,
+    advance,
+    jumpTo,
+    setVar,
+    close
+  };
+}
+
+// ../gameplay/src/hooks/useBehaviorTree.ts
+import { useRef as useRef47, useCallback as useCallback33 } from "react";
+function btAction(fn) {
+  return {
+    tick(dt) {
+      const result = fn(dt);
+      if (result === void 0 || result === null) return "success";
+      if (typeof result === "boolean") return result ? "success" : "failure";
+      return result;
+    },
+    reset() {
+    }
+  };
+}
+function btCondition(fn) {
+  return {
+    tick() {
+      return fn() ? "success" : "failure";
+    },
+    reset() {
+    }
+  };
+}
+function btWait(duration) {
+  let elapsed = 0;
+  return {
+    tick(dt) {
+      elapsed += dt;
+      if (elapsed >= duration) {
+        elapsed = 0;
+        return "success";
+      }
+      return "running";
+    },
+    reset() {
+      elapsed = 0;
+    }
+  };
+}
+function btSequence(...children) {
+  let idx = 0;
+  return {
+    tick(dt) {
+      while (idx < children.length) {
+        const s2 = children[idx].tick(dt);
+        if (s2 === "running") return "running";
+        if (s2 === "failure") {
+          idx = 0;
+          return "failure";
+        }
+        idx++;
+      }
+      idx = 0;
+      return "success";
+    },
+    reset() {
+      idx = 0;
+      children.forEach((c) => c.reset());
+    }
+  };
+}
+function btSelector(...children) {
+  let idx = 0;
+  return {
+    tick(dt) {
+      while (idx < children.length) {
+        const s2 = children[idx].tick(dt);
+        if (s2 === "running") return "running";
+        if (s2 === "success") {
+          idx = 0;
+          return "success";
+        }
+        idx++;
+      }
+      idx = 0;
+      return "failure";
+    },
+    reset() {
+      idx = 0;
+      children.forEach((c) => c.reset());
+    }
+  };
+}
+function btParallel(successPolicy, failPolicy, ...children) {
+  return {
+    tick(dt) {
+      let successCount = 0;
+      let failCount = 0;
+      for (const child of children) {
+        const s2 = child.tick(dt);
+        if (s2 === "success") successCount++;
+        else if (s2 === "failure") failCount++;
+      }
+      if (successPolicy === "any" && successCount > 0) {
+        children.forEach((c) => c.reset());
+        return "success";
+      }
+      if (failPolicy === "any" && failCount > 0) {
+        children.forEach((c) => c.reset());
+        return "failure";
+      }
+      if (successPolicy === "all" && successCount === children.length) return "success";
+      if (failPolicy === "all" && failCount === children.length) return "failure";
+      return "running";
+    },
+    reset() {
+      children.forEach((c) => c.reset());
+    }
+  };
+}
+function btInvert(child) {
+  return {
+    tick(dt) {
+      const s2 = child.tick(dt);
+      if (s2 === "success") return "failure";
+      if (s2 === "failure") return "success";
+      return "running";
+    },
+    reset() {
+      child.reset();
+    }
+  };
+}
+function btRepeat(count, child) {
+  let done = 0;
+  return {
+    tick(dt) {
+      while (count === "forever" || done < count) {
+        const s2 = child.tick(dt);
+        if (s2 === "running") return "running";
+        if (s2 === "failure") {
+          done = 0;
+          child.reset();
+          return "failure";
+        }
+        done++;
+        child.reset();
+      }
+      done = 0;
+      return "success";
+    },
+    reset() {
+      done = 0;
+      child.reset();
+    }
+  };
+}
+function btRetryUntilSuccess(maxAttempts, child) {
+  let attempts = 0;
+  return {
+    tick(dt) {
+      while (attempts < maxAttempts) {
+        const s2 = child.tick(dt);
+        if (s2 === "running") return "running";
+        if (s2 === "success") {
+          attempts = 0;
+          return "success";
+        }
+        attempts++;
+        child.reset();
+      }
+      attempts = 0;
+      return "failure";
+    },
+    reset() {
+      attempts = 0;
+      child.reset();
+    }
+  };
+}
+function btCooldown(duration, child) {
+  let remaining = 0;
+  return {
+    tick(dt) {
+      if (remaining > 0) {
+        remaining = Math.max(0, remaining - dt);
+        return "failure";
+      }
+      const s2 = child.tick(dt);
+      if (s2 !== "running") {
+        remaining = duration;
+        child.reset();
+      }
+      return s2;
+    },
+    reset() {
+      remaining = 0;
+      child.reset();
+    }
+  };
+}
+function btSucceed(child) {
+  return {
+    tick(dt) {
+      const s2 = child.tick(dt);
+      return s2 === "running" ? "running" : "success";
+    },
+    reset() {
+      child.reset();
+    }
+  };
+}
+function btFail(child) {
+  return {
+    tick(dt) {
+      const s2 = child.tick(dt);
+      return s2 === "running" ? "running" : "failure";
+    },
+    reset() {
+      child.reset();
+    }
+  };
+}
+function useBehaviorTree(rootFactory) {
+  const rootRef = useRef47(null);
+  if (!rootRef.current) rootRef.current = rootFactory();
+  const statusRef = useRef47("failure");
+  const tick2 = useCallback33((dt) => {
+    if (!rootRef.current) return "failure";
+    const s2 = rootRef.current.tick(dt);
+    statusRef.current = s2;
+    return s2;
+  }, []);
+  const reset = useCallback33(() => {
+    rootRef.current?.reset();
+  }, []);
+  return {
+    tick: tick2,
+    reset,
+    get lastStatus() {
+      return statusRef.current;
+    }
+  };
+}
+
 // ../gameplay/src/components/DialogueBox.tsx
 import { jsx as jsx21, jsxs as jsxs10 } from "react/jsx-runtime";
 function DialogueBox({ dialogue, onAdvance, onClose, style = {} }) {
@@ -13651,17 +14162,17 @@ function DialogueBox({ dialogue, onAdvance, onClose, style = {} }) {
 }
 
 // ../gameplay/src/hooks/useCutscene.ts
-import { useState as useState30, useCallback as useCallback31, useRef as useRef45, useEffect as useEffect79, useContext as useContext77 } from "react";
+import { useState as useState31, useCallback as useCallback34, useRef as useRef48, useEffect as useEffect80, useContext as useContext77 } from "react";
 function useCutscene() {
   const engine = useContext77(EngineContext);
-  const [playing, setPlaying] = useState30(false);
-  const [stepIndex, setStepIndex] = useState30(0);
-  const stepsRef = useRef45([]);
-  const timerRef = useRef45(0);
-  const idxRef = useRef45(0);
-  const playingRef = useRef45(false);
-  const entityRef = useRef45(null);
-  const finish = useCallback31(() => {
+  const [playing, setPlaying] = useState31(false);
+  const [stepIndex, setStepIndex] = useState31(0);
+  const stepsRef = useRef48([]);
+  const timerRef = useRef48(0);
+  const idxRef = useRef48(0);
+  const playingRef = useRef48(false);
+  const entityRef = useRef48(null);
+  const finish = useCallback34(() => {
     playingRef.current = false;
     setPlaying(false);
     setStepIndex(0);
@@ -13671,14 +14182,14 @@ function useCutscene() {
       entityRef.current = null;
     }
   }, [engine.ecs]);
-  const fireStep = useCallback31((step) => {
+  const fireStep = useCallback34((step) => {
     if (step.type === "call") step.fn();
     if (step.type === "parallel")
       step.steps.forEach((s2) => {
         if (s2.type === "call") s2.fn();
       });
   }, []);
-  const play = useCallback31(
+  const play = useCallback34(
     (steps) => {
       stepsRef.current = steps;
       idxRef.current = 0;
@@ -13735,7 +14246,7 @@ function useCutscene() {
     },
     [engine.ecs, finish, fireStep]
   );
-  const skip = useCallback31(() => {
+  const skip = useCallback34(() => {
     for (let i = idxRef.current; i < stepsRef.current.length; i++) {
       const step = stepsRef.current[i];
       if (step.type === "call") step.fn();
@@ -13746,7 +14257,7 @@ function useCutscene() {
     }
     finish();
   }, [finish]);
-  useEffect79(() => {
+  useEffect80(() => {
     return () => {
       if (entityRef.current !== null && engine.ecs.hasEntity(entityRef.current)) {
         engine.ecs.destroyEntity(entityRef.current);
@@ -13757,7 +14268,7 @@ function useCutscene() {
 }
 
 // ../gameplay/src/hooks/useGameStore.ts
-import { useSyncExternalStore as useSyncExternalStore2, useCallback as useCallback32 } from "react";
+import { useSyncExternalStore as useSyncExternalStore2, useCallback as useCallback35 } from "react";
 function createStore(initialState) {
   let state = { ...initialState };
   const listeners = /* @__PURE__ */ new Set();
@@ -13783,7 +14294,7 @@ function useGameStore(key, initialState) {
   }
   const store = stores.get(key);
   const state = useSyncExternalStore2(store.subscribe, store.getState);
-  const setState = useCallback32(
+  const setState = useCallback35(
     (partial) => {
       store.setState(partial);
     },
@@ -13793,21 +14304,21 @@ function useGameStore(key, initialState) {
 }
 
 // ../gameplay/src/hooks/useTween.ts
-import { useRef as useRef46, useCallback as useCallback33, useEffect as useEffect80 } from "react";
+import { useRef as useRef49, useCallback as useCallback36, useEffect as useEffect81 } from "react";
 function useTween(opts) {
-  const rafRef = useRef46(null);
-  const startTimeRef = useRef46(0);
-  const runningRef = useRef46(false);
-  const optsRef = useRef46(opts);
+  const rafRef = useRef49(null);
+  const startTimeRef = useRef49(0);
+  const runningRef = useRef49(false);
+  const optsRef = useRef49(opts);
   optsRef.current = opts;
-  const stop = useCallback33(() => {
+  const stop = useCallback36(() => {
     if (rafRef.current !== null) {
       cancelAnimationFrame(rafRef.current);
       rafRef.current = null;
     }
     runningRef.current = false;
   }, []);
-  const start2 = useCallback33(() => {
+  const start2 = useCallback36(() => {
     stop();
     runningRef.current = true;
     startTimeRef.current = performance.now();
@@ -13829,12 +14340,12 @@ function useTween(opts) {
     };
     rafRef.current = requestAnimationFrame(tick2);
   }, [stop]);
-  useEffect80(() => {
+  useEffect81(() => {
     if (opts.autoStart) {
       start2();
     }
   }, []);
-  useEffect80(() => {
+  useEffect81(() => {
     return () => {
       if (rafRef.current !== null) {
         cancelAnimationFrame(rafRef.current);
@@ -13853,15 +14364,15 @@ function useTween(opts) {
 }
 
 // ../gameplay/src/hooks/useObjectPool.ts
-import { useRef as useRef47, useMemo as useMemo17, useEffect as useEffect81 } from "react";
+import { useRef as useRef50, useMemo as useMemo17, useEffect as useEffect82 } from "react";
 function useObjectPool(factory, reset, initialSize) {
-  const poolRef = useRef47([]);
-  const activeRef = useRef47(0);
-  const factoryRef = useRef47(factory);
+  const poolRef = useRef50([]);
+  const activeRef = useRef50(0);
+  const factoryRef = useRef50(factory);
   factoryRef.current = factory;
-  const resetRef = useRef47(reset);
+  const resetRef = useRef50(reset);
   resetRef.current = reset;
-  useEffect81(() => {
+  useEffect82(() => {
     if (initialSize != null && initialSize > 0) {
       const pool = poolRef.current;
       for (let i = 0; i < initialSize; i++) {
@@ -14183,7 +14694,7 @@ function definePrefab(name, defaults, render) {
 }
 
 // src/hooks/useNetworkSync.ts
-import { useEffect as useEffect83, useRef as useRef49 } from "react";
+import { useEffect as useEffect84, useRef as useRef52 } from "react";
 
 // ../../packages/net/src/transport.ts
 function isBinaryTransport(t) {
@@ -14528,17 +15039,17 @@ function syncEntity(config) {
 }
 
 // ../../packages/net/src/useNetworkInput.ts
-import { useState as useState31, useEffect as useEffect82, useRef as useRef48 } from "react";
+import { useState as useState32, useEffect as useEffect83, useRef as useRef51 } from "react";
 var INPUT_MSG_TYPE = "input:state";
 function useNetworkInput(config) {
   const { room, keys, input, tickRate = 20 } = config;
   const intervalMs = 1e3 / tickRate;
-  const [localInput, setLocalInput] = useState31(
+  const [localInput, setLocalInput] = useState32(
     () => Object.fromEntries(keys.map((k) => [k, false]))
   );
-  const [remoteInputs] = useState31(() => /* @__PURE__ */ new Map());
-  const localInputRef = useRef48(localInput);
-  useEffect82(() => {
+  const [remoteInputs] = useState32(() => /* @__PURE__ */ new Map());
+  const localInputRef = useRef51(localInput);
+  useEffect83(() => {
     let cleanupDom = null;
     if (!input) {
       let handleKeyDown2 = function(e) {
@@ -14752,9 +15263,9 @@ function lerpState(a, b, t) {
 
 // src/hooks/useNetworkSync.ts
 function useNetworkSync(entityId, components, room, world, owner, opts = {}) {
-  const optsRef = useRef49(opts);
+  const optsRef = useRef52(opts);
   optsRef.current = opts;
-  useEffect83(() => {
+  useEffect84(() => {
     const sync = syncEntity({
       entityId,
       components,
@@ -14769,18 +15280,18 @@ function useNetworkSync(entityId, components, room, world, owner, opts = {}) {
 }
 
 // src/hooks/useRemotePlayer.ts
-import { useEffect as useEffect84, useRef as useRef50, useState as useState32 } from "react";
+import { useEffect as useEffect85, useRef as useRef53, useState as useState33 } from "react";
 var PEER_JOIN_MSG = "peer:join";
 var PEER_LEAVE_MSG = "peer:leave";
 function useRemotePlayer(config) {
   const { room, world, createEntity, destroyEntity } = config;
-  const [players, setPlayers] = useState32(() => /* @__PURE__ */ new Map());
-  const playersRef = useRef50(players);
-  const createRef = useRef50(createEntity);
+  const [players, setPlayers] = useState33(() => /* @__PURE__ */ new Map());
+  const playersRef = useRef53(players);
+  const createRef = useRef53(createEntity);
   createRef.current = createEntity;
-  const destroyRef = useRef50(destroyEntity);
+  const destroyRef = useRef53(destroyEntity);
   destroyRef.current = destroyEntity;
-  useEffect84(() => {
+  useEffect85(() => {
     function spawnPeer(peerId) {
       if (playersRef.current.has(peerId)) return;
       const entityId = createRef.current(peerId);
@@ -14905,6 +15416,18 @@ export {
   applyTorqueImpulse,
   arrive,
   boxArea,
+  btAction,
+  btCondition,
+  btCooldown,
+  btFail,
+  btInvert,
+  btParallel,
+  btRepeat,
+  btRetryUntilSuccess,
+  btSelector,
+  btSequence,
+  btSucceed,
+  btWait,
   capsuleArea,
   chromaticAberrationEffect,
   circleArea,
@@ -15031,6 +15554,7 @@ export {
   useAudioAnalyser,
   useAudioListener,
   useAudioScheduler,
+  useBehaviorTree,
   useCamera,
   useCameraBlend,
   useCameraLookahead,
@@ -15050,6 +15574,7 @@ export {
   useDamageZone,
   useDestroyEntity,
   useDialogue,
+  useDialogueTree,
   useDraggable,
   useDropThrough,
   useDroppable,
@@ -15104,6 +15629,7 @@ export {
   useSnap,
   useSnapshot,
   useSound,
+  useSoundscape,
   useSpatialSound,
   useSquashStretch,
   useStreamedMusic,