react-three-game 0.0.69 → 0.0.71

package/dist/tools/prefabeditor/PrefabRoot.js

@@ -1,12 +1,3 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -20,47 +11,97 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useHelper } from "@react-three/drei";
-import { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
-import { BoxHelper, Euler, Matrix4, Quaternion, Vector3, } from "three";
+import { forwardRef, createContext, useCallback, useContext, useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
+import { BoxHelper, Euler, Matrix4, } from "three";
 import { useStore } from "zustand";
-import { getComponent, registerComponent } from "./components/ComponentRegistry";
+import { useClickValid } from "./useClickValid";
+import { findComponent } from "./types";
+import { getComponentDef, getComponentAssetRefs, registerComponent } from "./components/ComponentRegistry";
 import components from "./components";
-import { loadModel, loadTexture } from "../dragdrop";
+import { loadModel, loadSound, loadTexture } from "../dragdrop";
 import { GameInstance, GameInstanceProvider, getRepeatAxesFromModelProperties, useInstanceCheck } from "./InstanceProvider";
-import { decompose } from "./utils";
-import { createPrefabStore, PrefabStoreProvider, prefabStoreToPrefab, usePrefabChildIds, usePrefabNode, usePrefabRootId } from "./prefabStore";
+import { composeTransform, decompose } from "./utils";
+import { isPhysicsProps } from "./components/PhysicsComponent";
+import { denormalizePrefab } from "./prefab";
+import { createPrefabStore, PrefabStoreProvider, useOptionalPrefabStoreApi, usePrefabChildIds, usePrefabNode, usePrefabRootId } from "./prefabStore";
+import { createRefBridge } from "./RefBridge";
+import { sound as soundManager } from "../../helpers/SoundManager";
 components.forEach(registerComponent);
 const IDENTITY = new Matrix4();
 const EMPTY_MODELS = {};
 const EMPTY_TEXTURES = {};
-export const PrefabRoot = forwardRef(({ editMode, data, store, selectedId, onSelect, onClick, onSelectedObjectChange, onFocusNode, basePath = "", injectedModels = EMPTY_MODELS, injectedTextures = EMPTY_TEXTURES }, ref) => {
+const EMPTY_SOUNDS = {};
+const SceneRuntimeContext = createContext(null);
+/** Access the scene runtime (refBridge, getRigidBody, editMode) from within a component View. */
+export function useSceneRuntime() {
+    const ctx = useContext(SceneRuntimeContext);
+    if (!ctx)
+        throw new Error("useSceneRuntime must be used inside <PrefabRoot>");
+    return ctx;
+}
+/** Resolve a relative or absolute asset file path against a base path. */
+function resolveAssetPath(basePath, file) {
+    if (file.startsWith("http://") || file.startsWith("https://"))
+        return file;
+    return file.startsWith("/") ? `${basePath}${file}` : `${basePath}/${file}`;
+}
+/** Check if all model assets required by a node are loaded. */
+function isNodeReady(node, loadedModels) {
+    var _a;
+    const model = findComponent(node, "Model");
+    if (!((_a = model === null || model === void 0 ? void 0 : model.properties) === null || _a === void 0 ? void 0 : _a.filename))
+        return true;
+    return Boolean(loadedModels[model.properties.filename]);
+}
+export const PrefabRoot = forwardRef(({ editMode, data, store, selectedId, onSelect, onClick, basePath = "" }, ref) => {
+    var _a;
     const [models, setModels] = useState({});
     const [textures, setTextures] = useState({});
+    const [sounds, setSounds] = useState({});
+    const [injectedModels, setInjectedModels] = useState(EMPTY_MODELS);
+    const [injectedTextures, setInjectedTextures] = useState(EMPTY_TEXTURES);
+    const [injectedSounds, setInjectedSounds] = useState(EMPTY_SOUNDS);
     const loading = useRef(new Set());
+    const failedModels = useRef(new Set());
     const failedTextures = useRef(new Set());
+    const failedSounds = useRef(new Set());
     const objectRefs = useRef({});
     const rigidBodyRefs = useRef(new Map());
     const rootRef = useRef(null);
-    const [internalStore] = useState(() => { var _a; return createPrefabStore(data !== null && data !== void 0 ? data : prefabStoreToPrefab((_a = store === null || store === void 0 ? void 0 : store.getState()) !== null && _a !== void 0 ? _a : missingStoreState())); });
-    const prefabStore = store !== null && store !== void 0 ? store : internalStore;
-    const assetManifestKey = useStore(prefabStore, state => state.assetManifestKey);
+    const [refBridge] = useState(() => createRefBridge());
+    const parentStore = useOptionalPrefabStoreApi();
+    const [ownedStore] = useState(() => { var _a, _b; return createPrefabStore(data !== null && data !== void 0 ? data : denormalizePrefab((_b = (_a = store === null || store === void 0 ? void 0 : store.getState()) !== null && _a !== void 0 ? _a : parentStore === null || parentStore === void 0 ? void 0 : parentStore.getState()) !== null && _b !== void 0 ? _b : missingStoreState())); });
+    const resolvedStore = (_a = store !== null && store !== void 0 ? store : parentStore) !== null && _a !== void 0 ? _a : ownedStore;
+    const usesOwnedStore = resolvedStore === ownedStore;
+    const shouldProvideStoreContext = !parentStore || parentStore !== resolvedStore;
+    const assetManifestKey = useStore(resolvedStore, state => state.assetManifestKey);
     const availableModels = useMemo(() => (Object.assign(Object.assign({}, models), injectedModels)), [models, injectedModels]);
     const availableTextures = useMemo(() => (Object.assign(Object.assign({}, textures), injectedTextures)), [textures, injectedTextures]);
+    const availableSounds = useMemo(() => (Object.assign(Object.assign({}, sounds), injectedSounds)), [sounds, injectedSounds]);
     useImperativeHandle(ref, () => ({
         root: rootRef.current,
+        refBridge,
         rigidBodyRefs: rigidBodyRefs.current,
         getObject: (nodeId) => { var _a; return (_a = objectRefs.current[nodeId]) !== null && _a !== void 0 ? _a : null; },
-        focusNode: (nodeId) => onFocusNode === null || onFocusNode === void 0 ? void 0 : onFocusNode(nodeId),
-    }), [onFocusNode]);
+        getRigidBody: (nodeId) => { var _a; return (_a = rigidBodyRefs.current.get(nodeId)) !== null && _a !== void 0 ? _a : null; },
+        addModel: (path, model) => setInjectedModels(prev => (Object.assign(Object.assign({}, prev), { [path]: model }))),
+        addTexture: (path, texture) => setInjectedTextures(prev => (Object.assign(Object.assign({}, prev), { [path]: texture }))),
+        addSound: (path, sound) => {
+            soundManager.setBuffer(path, sound);
+            setInjectedSounds(prev => (Object.assign(Object.assign({}, prev), { [path]: sound })));
+        },
+    }), [refBridge]);
     const registerRef = useCallback((id, obj) => {
         objectRefs.current[id] = obj;
-        if (id === selectedId) {
-            onSelectedObjectChange === null || onSelectedObjectChange === void 0 ? void 0 : onSelectedObjectChange(obj);
-        }
-    }, [onSelectedObjectChange, selectedId]);
+        refBridge.register(id, obj);
+    }, [refBridge]);
     const registerRigidBodyRef = useCallback((id, rb) => {
         rigidBodyRefs.current.set(id, rb);
     }, []);
+    const getRigidBody = useCallback((id) => {
+        var _a;
+        return (_a = rigidBodyRefs.current.get(id)) !== null && _a !== void 0 ? _a : null;
+    }, []);
     useEffect(() => {
         const originalError = console.error;
         console.error = (...args) => {
@@ -71,78 +112,102 @@ export const PrefabRoot = forwardRef(({ editMode, data, store, selectedId, onSel
         return () => { console.error = originalError; };
     }, []);
     useEffect(() => {
-        if (!store && data) {
-            prefabStore.getState().replacePrefab(data);
+        if (usesOwnedStore && data) {
+            resolvedStore.getState().replacePrefab(data);
         }
-    }, [data, prefabStore, store]);
+    }, [data, resolvedStore, usesOwnedStore]);
     useEffect(() => {
-        const syncAssets = (snapshot = prefabStore.getState()) => {
+        const syncAssets = (snapshot = resolvedStore.getState()) => {
             const modelsToLoad = new Set();
             const texturesToLoad = new Set();
+            const soundsToLoad = new Set();
             Object.values(snapshot.nodesById).forEach(node => {
                 var _a;
                 Object.values((_a = node.components) !== null && _a !== void 0 ? _a : {}).forEach(component => {
-                    var _a, _b, _c, _d;
+                    var _a;
                     if (!(component === null || component === void 0 ? void 0 : component.type))
                         return;
-                    if (component.type === 'Model' && ((_a = component.properties) === null || _a === void 0 ? void 0 : _a.filename)) {
-                        modelsToLoad.add(component.properties.filename);
-                    }
-                    if (component.type === 'Material') {
-                        ((_b = component.properties) === null || _b === void 0 ? void 0 : _b.texture) && texturesToLoad.add(component.properties.texture);
-                        ((_c = component.properties) === null || _c === void 0 ? void 0 : _c.normalMapTexture) && texturesToLoad.add(component.properties.normalMapTexture);
-                    }
-                    if (component.type === 'SpotLight' && ((_d = component.properties) === null || _d === void 0 ? void 0 : _d.map)) {
-                        texturesToLoad.add(component.properties.map);
+                    for (const ref of getComponentAssetRefs(component.type, (_a = component.properties) !== null && _a !== void 0 ? _a : {})) {
+                        if (ref.type === 'model')
+                            modelsToLoad.add(ref.path);
+                        else if (ref.type === 'texture')
+                            texturesToLoad.add(ref.path);
+                        else if (ref.type === 'sound')
+                            soundsToLoad.add(ref.path);
                     }
                 });
             });
-            modelsToLoad.forEach((file) => __awaiter(void 0, void 0, void 0, function* () {
-                if (models[file] || injectedModels[file] || loading.current.has(file))
+            const loadAsset = (file, loaded, injected, failed, loader) => {
+                if (loaded[file] || injected[file] || loading.current.has(file) || failed.has(file))
                     return;
                 loading.current.add(file);
-                const path = file.startsWith("/")
-                    ? `${basePath}${file}`
-                    : `${basePath}/${file}`;
-                const res = yield loadModel(path);
-                const model = res.model;
-                if (res.success && model) {
+                void loader(resolveAssetPath(basePath, file)).then(result => {
+                    if (!result.success) {
+                        console.warn(`Failed to load asset: ${file}`, result.error);
+                        loading.current.delete(file);
+                        failed.add(file);
+                    }
+                });
+            };
+            modelsToLoad.forEach(file => loadAsset(file, models, injectedModels, failedModels.current, (path) => loadModel(path).then(result => {
+                const model = result.model;
+                if (result.success && model) {
                     setModels(m => (Object.assign(Object.assign({}, m), { [file]: model })));
                 }
-            }));
-            texturesToLoad.forEach(file => {
-                if (textures[file] || injectedTextures[file] || loading.current.has(file) || failedTextures.current.has(file))
-                    return;
-                loading.current.add(file);
-                // Handle full URLs (http/https) or regular paths
-                const path = file.startsWith("http://") || file.startsWith("https://")
-                    ? file
-                    : file.startsWith("/")
-                        ? `${basePath}${file}`
-                        : `${basePath}/${file}`;
-                void loadTexture(path).then(result => {
-                    if (result.success && result.texture) {
-                        setTextures(t => (Object.assign(Object.assign({}, t), { [file]: result.texture })));
-                        return;
-                    }
-                    console.warn(`Failed to load texture: ${path}`, result.error);
+                return result;
+            })));
+            texturesToLoad.forEach(file => loadAsset(file, textures, injectedTextures, failedTextures.current, (path) => loadTexture(path).then(result => {
+                if (result.success && result.texture) {
+                    setTextures(t => (Object.assign(Object.assign({}, t), { [file]: result.texture })));
+                }
+                return result;
+            })));
+            soundsToLoad.forEach(file => loadAsset(file, sounds, injectedSounds, failedSounds.current, (path) => loadSound(path).then(result => {
+                if (result.success && result.sound) {
+                    soundManager.setBuffer(file, result.sound);
+                    setSounds(current => (Object.assign(Object.assign({}, current), { [file]: result.sound })));
                     loading.current.delete(file);
-                    failedTextures.current.add(file);
-                });
-            });
+                }
+                return result;
+            })));
         };
         syncAssets();
-    }, [prefabStore, assetManifestKey, basePath, injectedModels, injectedTextures]);
-    return (_jsx(PrefabStoreProvider, { store: prefabStore, children: _jsx("group", { ref: rootRef, children: _jsx(GameInstanceProvider, { models: availableModels, selectedId: selectedId, editMode: editMode, onSelect: editMode ? onSelect : undefined, registerRef: registerRef, children: _jsx(StoreRootNode, { selectedId: selectedId, onSelect: editMode ? onSelect : undefined, onClick: onClick, registerRef: registerRef, registerRigidBodyRef: registerRigidBodyRef, loadedModels: availableModels, loadedTextures: availableTextures, editMode: editMode, parentMatrix: IDENTITY }) }) }) }));
+    }, [resolvedStore, assetManifestKey, basePath, injectedModels, injectedSounds, injectedTextures, models, sounds, textures]);
+    // Keep refs current so context getters are always fresh without changing context identity
+    const availableModelsRef = useRef(availableModels);
+    availableModelsRef.current = availableModels;
+    const availableTexturesRef = useRef(availableTextures);
+    availableTexturesRef.current = availableTextures;
+    const availableSoundsRef = useRef(availableSounds);
+    availableSoundsRef.current = availableSounds;
+    const sceneRuntime = useMemo(() => ({
+        refBridge,
+        getRigidBody,
+        registerRigidBodyRef,
+        editMode,
+        getModel: (path) => { var _a; return (_a = availableModelsRef.current[path]) !== null && _a !== void 0 ? _a : null; },
+        getTexture: (path) => { var _a; return (_a = availableTexturesRef.current[path]) !== null && _a !== void 0 ? _a : null; },
+        getSound: (path) => { var _a; return (_a = availableSoundsRef.current[path]) !== null && _a !== void 0 ? _a : null; },
+        getAssetRevision: () => {
+            const modelKeys = Object.keys(availableModelsRef.current).sort().join('|');
+            const textureKeys = Object.keys(availableTexturesRef.current).sort().join('|');
+            return `${textureKeys}::${modelKeys}`;
+        },
+    }), [refBridge, getRigidBody, registerRigidBodyRef, editMode]);
+    const content = (_jsx("group", { ref: rootRef, children: _jsx(GameInstanceProvider, { models: availableModels, selectedId: selectedId, editMode: editMode, onSelect: editMode ? onSelect : undefined, registerRef: registerRef, children: _jsx(StoreRootNode, { selectedId: selectedId, onSelect: editMode ? onSelect : undefined, onClick: onClick, registerRef: registerRef, loadedModels: availableModels, editMode: editMode, parentMatrix: IDENTITY }) }) }));
+    if (!shouldProvideStoreContext) {
+        return _jsx(SceneRuntimeContext.Provider, { value: sceneRuntime, children: content });
+    }
+    return _jsx(PrefabStoreProvider, { store: resolvedStore, children: _jsx(SceneRuntimeContext.Provider, { value: sceneRuntime, children: content }) });
 });
 function StoreRootNode(props) {
     const rootId = usePrefabRootId();
     return _jsx(GameObjectRenderer, Object.assign({}, props, { nodeId: rootId }));
 }
 export function GameObjectRenderer(props) {
-    var _a, _b, _c;
+    var _a, _b;
     const node = usePrefabNode(props.nodeId);
-    const isInstanced = (_c = (_b = (_a = node === null || node === void 0 ? void 0 : node.components) === null || _a === void 0 ? void 0 : _a.model) === null || _b === void 0 ? void 0 : _b.properties) === null || _c === void 0 ? void 0 : _c.instanced;
+    const isInstanced = (_b = (_a = findComponent(node, "Model")) === null || _a === void 0 ? void 0 : _a.properties) === null || _b === void 0 ? void 0 : _b.instanced;
     const prevInstancedRef = useRef(undefined);
     const [isTransitioning, setIsTransitioning] = useState(false);
     useEffect(() => {
@@ -160,24 +225,27 @@ export function GameObjectRenderer(props) {
         ? _jsx(InstancedNode, Object.assign({}, props), key)
         : _jsx(StandardNode, Object.assign({}, props), key);
 }
-function isPhysicsProps(v) {
-    return (v === null || v === void 0 ? void 0 : v.type) === "fixed" || (v === null || v === void 0 ? void 0 : v.type) === "dynamic" || (v === null || v === void 0 ? void 0 : v.type) === "kinematicPosition" || (v === null || v === void 0 ? void 0 : v.type) === "kinematicVelocity";
-}
 function InstancedNode({ nodeId, parentMatrix = IDENTITY, editMode, registerRef, onSelect, onClick }) {
-    var _a, _b, _c, _d, _e, _f, _g, _h;
+    var _a, _b, _c;
     const gameObject = usePrefabNode(nodeId);
     if (!gameObject)
         return null;
     const localTransform = getNodeTransformProps(gameObject);
     const isLocked = Boolean(gameObject.locked);
-    const clickable = Object.values((_a = gameObject.components) !== null && _a !== void 0 ? _a : {}).some(component => (component === null || component === void 0 ? void 0 : component.type) === 'Click');
-    const physicsProps = isPhysicsProps((_c = (_b = gameObject.components) === null || _b === void 0 ? void 0 : _b.physics) === null || _c === void 0 ? void 0 : _c.properties)
-        ? (_e = (_d = gameObject.components) === null || _d === void 0 ? void 0 : _d.physics) === null || _e === void 0 ? void 0 : _e.properties
+    const clickComponent = findComponent(gameObject, "Click");
+    const clickable = Boolean(clickComponent);
+    const clickEventName = (_a = clickComponent === null || clickComponent === void 0 ? void 0 : clickComponent.properties) === null || _a === void 0 ? void 0 : _a.eventName;
+    const physicsData = findComponent(gameObject, "Physics");
+    const physicsProps = isPhysicsProps(physicsData === null || physicsData === void 0 ? void 0 : physicsData.properties)
+        ? physicsData === null || physicsData === void 0 ? void 0 : physicsData.properties
         : undefined;
-    const modelUrl = (_h = (_g = (_f = gameObject.components) === null || _f === void 0 ? void 0 : _f.model) === null || _g === void 0 ? void 0 : _g.properties) === null || _h === void 0 ? void 0 : _h.filename;
+    const modelUrl = (_c = (_b = findComponent(gameObject, "Model")) === null || _b === void 0 ? void 0 : _b.properties) === null || _c === void 0 ? void 0 : _c.filename;
     const instances = useMemo(() => buildRepeatedInstances(gameObject, parentMatrix, modelUrl, physicsProps), [gameObject, modelUrl, parentMatrix, physicsProps]);
     const groupRef = useRef(null);
-    const clickValid = useRef(false);
+    const editClickHandlers = useClickValid(!!editMode && !isLocked, (e) => {
+        onSelect === null || onSelect === void 0 ? void 0 : onSelect(nodeId);
+        onClick === null || onClick === void 0 ? void 0 : onClick(e, gameObject);
+    });
     useEffect(() => {
         if (editMode) {
             registerRef(nodeId, groupRef.current);
@@ -185,19 +253,12 @@ function InstancedNode({ nodeId, parentMatrix = IDENTITY, editMode, registerRef,
         }
     }, [nodeId, registerRef, editMode]);
     if (editMode) {
-        return (_jsxs(_Fragment, { children: [_jsx("group", { ref: groupRef, position: localTransform.position, rotation: localTransform.rotation, scale: localTransform.scale, onPointerDown: isLocked ? undefined : (e) => { e.stopPropagation(); clickValid.current = true; }, onPointerMove: isLocked ? undefined : () => { clickValid.current = false; }, onPointerUp: isLocked ? undefined : (e) => {
-                        if (clickValid.current) {
-                            e.stopPropagation();
-                            onSelect === null || onSelect === void 0 ? void 0 : onSelect(nodeId);
-                            onClick === null || onClick === void 0 ? void 0 : onClick(e, gameObject);
-                        }
-                        clickValid.current = false;
-                    }, children: _jsx("mesh", { visible: false, children: _jsx("boxGeometry", { args: [0.01, 0.01, 0.01] }) }) }), instances.map(instance => (_jsx(GameInstance, { id: instance.id, sourceId: gameObject.id, clickable: clickable, modelUrl: instance.modelUrl, position: instance.position, rotation: instance.rotation, scale: instance.scale, locked: isLocked, physics: instance.physics }, instance.id)))] }));
+        return (_jsxs(_Fragment, { children: [_jsx("group", Object.assign({ ref: groupRef, position: localTransform.position, rotation: localTransform.rotation, scale: localTransform.scale }, editClickHandlers, { children: _jsx("mesh", { visible: false, children: _jsx("boxGeometry", { args: [0.01, 0.01, 0.01] }) }) })), instances.map(instance => (_jsx(GameInstance, { id: instance.id, sourceId: gameObject.id, clickable: clickable, clickEventName: clickEventName, modelUrl: instance.modelUrl, position: instance.position, rotation: instance.rotation, scale: instance.scale, locked: isLocked, physics: instance.physics }, instance.id)))] }));
     }
-    return (_jsx(_Fragment, { children: instances.map(instance => (_jsx(GameInstance, { id: instance.id, sourceId: gameObject.id, clickable: clickable, modelUrl: instance.modelUrl, position: instance.position, rotation: instance.rotation, scale: instance.scale, locked: isLocked, physics: instance.physics }, instance.id))) }));
+    return (_jsx(_Fragment, { children: instances.map(instance => (_jsx(GameInstance, { id: instance.id, sourceId: gameObject.id, clickable: clickable, clickEventName: clickEventName, modelUrl: instance.modelUrl, position: instance.position, rotation: instance.rotation, scale: instance.scale, locked: isLocked, physics: instance.physics }, instance.id))) }));
 }
-function StandardNode({ nodeId, selectedId, onSelect, onClick, registerRef, registerRigidBodyRef, loadedModels, loadedTextures, editMode, parentMatrix = IDENTITY, }) {
-    var _a, _b, _c, _d, _e;
+function StandardNode({ nodeId, selectedId, onSelect, onClick, registerRef, loadedModels, editMode, parentMatrix = IDENTITY, }) {
+    var _a, _b;
     const gameObject = usePrefabNode(nodeId);
     const childIds = usePrefabChildIds(nodeId);
     const isSelected = selectedId === nodeId;
@@ -205,59 +266,49 @@ function StandardNode({ nodeId, selectedId, onSelect, onClick, registerRef, regi
         return null;
     const groupRef = useRef(null);
     const helperRef = useRef(null);
-    const clickValid = useRef(false);
     const isLocked = Boolean(gameObject.locked);
     const stillInstanced = useInstanceCheck(nodeId);
+    const clickHandlers = useClickValid(!!editMode && !isLocked, (e) => {
+        onSelect === null || onSelect === void 0 ? void 0 : onSelect(nodeId);
+        onClick === null || onClick === void 0 ? void 0 : onClick(e, gameObject);
+    });
     useHelper(editMode && isSelected ? helperRef : null, BoxHelper, "cyan");
     useEffect(() => {
         registerRef(nodeId, groupRef.current);
         return () => registerRef(nodeId, null);
     }, [nodeId, registerRef]);
     const world = parentMatrix.clone().multiply(compose(gameObject));
-    const onDown = (e) => {
-        e.stopPropagation();
-        clickValid.current = true;
-    };
-    const onUp = (e) => {
-        if (clickValid.current) {
-            e.stopPropagation();
-            onSelect === null || onSelect === void 0 ? void 0 : onSelect(nodeId);
-            onClick === null || onClick === void 0 ? void 0 : onClick(e, gameObject);
-        }
-        clickValid.current = false;
-    };
-    const physics = (_a = gameObject.components) === null || _a === void 0 ? void 0 : _a.physics;
-    const ready = !((_b = gameObject.components) === null || _b === void 0 ? void 0 : _b.model) ||
-        loadedModels[gameObject.components.model.properties.filename];
+    const physics = findComponent(gameObject, "Physics");
+    const ready = isNodeReady(gameObject, loadedModels);
     const hasPhysics = physics && ready && !stillInstanced;
     const transform = getNodeTransformProps(gameObject);
-    const physicsDef = hasPhysics ? getComponent("Physics") : null;
-    const isInstanced = (_e = (_d = (_c = gameObject.components) === null || _c === void 0 ? void 0 : _c.model) === null || _d === void 0 ? void 0 : _d.properties) === null || _e === void 0 ? void 0 : _e.instanced;
+    const physicsDef = hasPhysics ? getComponentDef(physics.type) : null;
+    const isInstanced = (_b = (_a = findComponent(gameObject, "Model")) === null || _a === void 0 ? void 0 : _a.properties) === null || _b === void 0 ? void 0 : _b.instanced;
     const physicsKey = `physics_${nodeId}_${isInstanced ? 'instanced' : 'standard'}`;
-    const renderCtx = { loadedModels, loadedTextures, editMode, registerRef };
+    const renderCtx = { loadedModels, editMode, registerRef };
     const childNodes = getChildHostComponents(gameObject).length > 0
         ? _jsx(CompositionChildren, { childIds: childIds, selectedId: selectedId, ctx: renderCtx, parentMatrix: world })
-        : _jsx(ChildNodes, { childIds: childIds, parentMatrix: world, selectedId: selectedId, onSelect: onSelect, onClick: onClick, registerRef: registerRef, registerRigidBodyRef: registerRigidBodyRef, loadedModels: loadedModels, loadedTextures: loadedTextures, editMode: editMode });
-    const inner = (_jsx("group", { onPointerDown: editMode && !isLocked ? onDown : undefined, onPointerMove: editMode && !isLocked ? () => (clickValid.current = false) : undefined, onPointerUp: editMode && !isLocked ? onUp : undefined, children: renderCompositionNode(gameObject, renderCtx, isSelected, parentMatrix, childNodes) }));
+        : _jsx(ChildNodes, { childIds: childIds, parentMatrix: world, selectedId: selectedId, onSelect: onSelect, onClick: onClick, registerRef: registerRef, loadedModels: loadedModels, editMode: editMode });
+    const inner = (_jsx("group", Object.assign({}, clickHandlers, { children: renderCompositionNode(gameObject, renderCtx, isSelected, parentMatrix, childNodes) })));
     if (editMode) {
-        return (_jsxs(_Fragment, { children: [_jsx("group", { ref: groupRef, position: transform.position, rotation: transform.rotation, scale: transform.scale, children: _jsx("mesh", { visible: false, children: _jsx("boxGeometry", { args: [0.01, 0.01, 0.01] }) }) }), _jsx("group", { ref: helperRef, position: transform.position, rotation: transform.rotation, scale: transform.scale, children: inner }), hasPhysics && (physicsDef === null || physicsDef === void 0 ? void 0 : physicsDef.View) ? (_jsx(physicsDef.View, { properties: physics.properties, position: transform.position, rotation: transform.rotation, scale: transform.scale, editMode: editMode, nodeId: nodeId, registerRigidBodyRef: registerRigidBodyRef, children: inner }, physicsKey)) : null] }));
+        return (_jsxs(_Fragment, { children: [_jsx("group", { ref: groupRef, position: transform.position, rotation: transform.rotation, scale: transform.scale, children: _jsx("mesh", { visible: false, children: _jsx("boxGeometry", { args: [0.01, 0.01, 0.01] }) }) }), _jsx("group", { ref: helperRef, position: transform.position, rotation: transform.rotation, scale: transform.scale, children: inner }), hasPhysics && (physicsDef === null || physicsDef === void 0 ? void 0 : physicsDef.View) ? (_jsx(physicsDef.View, { properties: physics.properties, position: transform.position, rotation: transform.rotation, scale: transform.scale, editMode: editMode, nodeId: nodeId, children: inner }, physicsKey)) : null] }));
     }
     if (hasPhysics && (physicsDef === null || physicsDef === void 0 ? void 0 : physicsDef.View)) {
-        return (_jsx(physicsDef.View, { properties: physics.properties, position: transform.position, rotation: transform.rotation, scale: transform.scale, editMode: editMode, nodeId: nodeId, registerRigidBodyRef: registerRigidBodyRef, children: inner }, physicsKey));
+        return (_jsx(physicsDef.View, { properties: physics.properties, position: transform.position, rotation: transform.rotation, scale: transform.scale, editMode: editMode, nodeId: nodeId, children: inner }, physicsKey));
     }
     return (_jsx("group", { ref: groupRef, position: transform.position, rotation: transform.rotation, scale: transform.scale, children: inner }));
 }
-const LEAF_COMPONENT_TYPES = new Set(["Geometry", "Material", "Physics"]);
 function getChildHostComponents(gameObject) {
     var _a;
-    return Object.entries((_a = gameObject.components) !== null && _a !== void 0 ? _a : {}).flatMap(([key, comp]) => {
+    return Object.entries((_a = gameObject.components) !== null && _a !== void 0 ? _a : {}).reduce((result, [key, comp]) => {
         if (!(comp === null || comp === void 0 ? void 0 : comp.type))
-            return [];
-        const def = getComponent(comp.type);
-        if (!(def === null || def === void 0 ? void 0 : def.View) || LEAF_COMPONENT_TYPES.has(comp.type))
-            return [];
-        return { key, View: def.View, properties: comp.properties };
-    });
+            return result;
+        const def = getComponentDef(comp.type);
+        if (!(def === null || def === void 0 ? void 0 : def.View) || def.isWrapper)
+            return result;
+        result.push({ key, View: def.View, properties: comp.properties });
+        return result;
+    }, []);
 }
 function ChildNodes(_a) {
     var { childIds, parentMatrix } = _a, props = __rest(_a, ["childIds", "parentMatrix"]);
@@ -265,11 +316,11 @@ function ChildNodes(_a) {
 }
 function compose(node) {
     const { position, rotation, scale } = getNodeTransformProps(node);
-    return new Matrix4().compose(new Vector3(...position), new Quaternion().setFromEuler(new Euler(...rotation)), new Vector3(...scale));
+    return composeTransform(position, rotation, scale);
 }
 function getModelRepeatSettings(node) {
-    var _a, _b, _c;
-    const properties = (_c = (_b = (_a = node === null || node === void 0 ? void 0 : node.components) === null || _a === void 0 ? void 0 : _a.model) === null || _b === void 0 ? void 0 : _b.properties) !== null && _c !== void 0 ? _c : {};
+    var _a, _b;
+    const properties = (_b = (_a = findComponent(node, "Model")) === null || _a === void 0 ? void 0 : _a.properties) !== null && _b !== void 0 ? _b : {};
     return {
         repeat: Boolean(properties.repeat),
         repeatAxes: getRepeatAxesFromModelProperties(properties),
@@ -320,12 +371,12 @@ function buildRepeatedInstances(gameObject, parentMatrix, modelUrl, physics) {
     return instances;
 }
 function getNodeTransformProps(node) {
-    var _a, _b, _c, _d, _e;
-    const t = (_b = (_a = node === null || node === void 0 ? void 0 : node.components) === null || _a === void 0 ? void 0 : _a.transform) === null || _b === void 0 ? void 0 : _b.properties;
+    var _a, _b, _c, _d;
+    const t = (_a = findComponent(node, "Transform")) === null || _a === void 0 ? void 0 : _a.properties;
     return {
-        position: (_c = t === null || t === void 0 ? void 0 : t.position) !== null && _c !== void 0 ? _c : [0, 0, 0],
-        rotation: (_d = t === null || t === void 0 ? void 0 : t.rotation) !== null && _d !== void 0 ? _d : [0, 0, 0],
-        scale: (_e = t === null || t === void 0 ? void 0 : t.scale) !== null && _e !== void 0 ? _e : [1, 1, 1],
+        position: (_b = t === null || t === void 0 ? void 0 : t.position) !== null && _b !== void 0 ? _b : [0, 0, 0],
+        rotation: (_c = t === null || t === void 0 ? void 0 : t.rotation) !== null && _c !== void 0 ? _c : [0, 0, 0],
+        scale: (_d = t === null || t === void 0 ? void 0 : t.scale) !== null && _d !== void 0 ? _d : [1, 1, 1],
     };
 }
 function renderCompositionSubtree(gameObject, ctx, isSelected, childIds, parentMatrix = IDENTITY) {
@@ -351,40 +402,25 @@ function renderCompositionNode(gameObject, ctx, isSelected, parentMatrix, childN
     const ownContent = renderNodeOwnContent(gameObject, ctx, isSelected, parentMatrix);
     return wrapWithChildHosts(gameObject, ctx, isSelected, parentMatrix, _jsxs(_Fragment, { children: [ownContent, childNodes] }));
 }
-function renderNodeOwnContent(gameObject, ctx, isSelected, parentMatrix) {
-    var _a, _b;
-    const geometry = (_a = gameObject.components) === null || _a === void 0 ? void 0 : _a.geometry;
-    const material = (_b = gameObject.components) === null || _b === void 0 ? void 0 : _b.material;
-    const geometryDef = geometry && getComponent("Geometry");
-    const materialDef = material && getComponent("Material");
-    const contextProps = {
-        loadedModels: ctx.loadedModels,
-        loadedTextures: ctx.loadedTextures,
-        editMode: ctx.editMode,
+function buildContextProps(gameObject, _ctx, isSelected) {
+    return {
+        editMode: _ctx.editMode,
         isSelected,
         nodeId: gameObject.id,
-        parentMatrix,
-        registerRef: ctx.registerRef,
     };
-    let core;
-    if (geometry && (geometryDef === null || geometryDef === void 0 ? void 0 : geometryDef.View)) {
-        core = (_jsxs("mesh", { castShadow: true, receiveShadow: true, children: [_jsx(geometryDef.View, Object.assign({ properties: geometry.properties }, contextProps)), material && (materialDef === null || materialDef === void 0 ? void 0 : materialDef.View) && (_jsx(materialDef.View, Object.assign({ properties: material.properties }, contextProps), "material"))] }));
-    }
-    else {
-        core = null;
-    }
-    return core;
+}
+function renderNodeOwnContent(gameObject, ctx, isSelected, parentMatrix) {
+    const geometry = findComponent(gameObject, "Geometry");
+    const material = findComponent(gameObject, "Material");
+    const geometryDef = geometry && getComponentDef(geometry.type);
+    const materialDef = material && getComponentDef(material.type);
+    if (!geometry || !(geometryDef === null || geometryDef === void 0 ? void 0 : geometryDef.View))
+        return null;
+    const contextProps = buildContextProps(gameObject, ctx, isSelected);
+    return (_jsxs("mesh", { castShadow: true, receiveShadow: true, children: [_jsx(geometryDef.View, Object.assign({ properties: geometry.properties }, contextProps)), material && (materialDef === null || materialDef === void 0 ? void 0 : materialDef.View) && (_jsx(materialDef.View, Object.assign({ properties: material.properties }, contextProps), "material"))] }));
 }
 function wrapWithChildHosts(gameObject, ctx, isSelected, parentMatrix, subtree) {
-    const contextProps = {
-        loadedModels: ctx.loadedModels,
-        loadedTextures: ctx.loadedTextures,
-        editMode: ctx.editMode,
-        isSelected,
-        nodeId: gameObject.id,
-        parentMatrix,
-        registerRef: ctx.registerRef,
-    };
+    const contextProps = buildContextProps(gameObject, ctx, isSelected);
     const childHosts = getChildHostComponents(gameObject);
     return childHosts.reduce((acc, { key, View, properties }) => (_jsx(View, Object.assign({ properties: properties }, contextProps, { children: acc }), key)), subtree);
 }

package/dist/tools/prefabeditor/RefBridge.d.ts

@@ -0,0 +1,24 @@
+import { Object3D } from "three";
+/**
+ * RefBridge — O(1) lookup from entity ID to live Three.js Object3D.
+ *
+ * In play mode the Scene API writes directly to these refs, bypassing
+ * React reconciliation.  In edit mode the store path is used instead.
+ *
+ * Component Views register/unregister refs on mount/unmount via
+ * `bridge.register(id, obj)` / `bridge.unregister(id)`.
+ */
+export interface RefBridge {
+    register: (id: string, obj: Object3D | null) => void;
+    unregister: (id: string) => void;
+    get: (id: string) => Object3D | null;
+    /** Apply a transform component's properties directly to the Object3D. */
+    setTransform: (id: string, position?: number[], rotation?: number[], scale?: number[]) => void;
+    /** Read current transform from the Object3D back into a properties bag. */
+    readTransform: (id: string) => {
+        position: [number, number, number];
+        rotation: [number, number, number];
+        scale: [number, number, number];
+    } | null;
+}
+export declare function createRefBridge(): RefBridge;

package/dist/tools/prefabeditor/RefBridge.js

@@ -0,0 +1,44 @@
+export function createRefBridge() {
+    const refs = new Map();
+    return {
+        register(id, obj) {
+            if (obj) {
+                refs.set(id, obj);
+            }
+            else {
+                refs.delete(id);
+            }
+        },
+        unregister(id) {
+            refs.delete(id);
+        },
+        get(id) {
+            var _a;
+            return (_a = refs.get(id)) !== null && _a !== void 0 ? _a : null;
+        },
+        setTransform(id, position, rotation, scale) {
+            const obj = refs.get(id);
+            if (!obj)
+                return;
+            if (position) {
+                obj.position.set(position[0], position[1], position[2]);
+            }
+            if (rotation) {
+                obj.rotation.set(rotation[0], rotation[1], rotation[2]);
+            }
+            if (scale) {
+                obj.scale.set(scale[0], scale[1], scale[2]);
+            }
+        },
+        readTransform(id) {
+            const obj = refs.get(id);
+            if (!obj)
+                return null;
+            return {
+                position: [obj.position.x, obj.position.y, obj.position.z],
+                rotation: [obj.rotation.x, obj.rotation.y, obj.rotation.z],
+                scale: [obj.scale.x, obj.scale.y, obj.scale.z],
+            };
+        },
+    };
+}

package/dist/tools/prefabeditor/components/AmbientLightComponent.js

@@ -1,19 +1,22 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { ColorField, FieldGroup, NumberField } from "./Input";
+import { ColorField, NumberField } from "./Input";
+import { LightSection, mergeWithDefaults } from "./lightUtils";
+const ambientLightDefaults = {
+    color: '#ffffff',
+    intensity: 1,
+};
 function AmbientLightComponentEditor({ component, onUpdate, }) {
-    return (_jsxs(FieldGroup, { children: [_jsx(ColorField, { name: "color", label: "Color", values: component.properties, onChange: onUpdate }), _jsx(NumberField, { name: "intensity", label: "Intensity", values: component.properties, onChange: onUpdate, min: 0, step: 0.1, fallback: 1 })] }));
+    const values = mergeWithDefaults(ambientLightDefaults, component.properties);
+    return (_jsxs(LightSection, { title: "Light", children: [_jsx(ColorField, { name: "color", label: "Color", values: values, onChange: onUpdate }), _jsx(NumberField, { name: "intensity", label: "Intensity", values: values, onChange: onUpdate, min: 0, step: 0.1, fallback: 1 })] }));
 }
 function AmbientLightComponentView({ properties, children }) {
-    const { color = '#ffffff', intensity = 1 } = properties;
+    const { color, intensity } = mergeWithDefaults(ambientLightDefaults, properties);
     return (_jsxs(_Fragment, { children: [_jsx("ambientLight", { color: color, intensity: intensity }), children] }));
 }
 const AmbientLightComponent = {
     name: 'AmbientLight',
     Editor: AmbientLightComponentEditor,
     View: AmbientLightComponentView,
-    defaultProperties: {
-        color: '#ffffff',
-        intensity: 1,
-    },
+    defaultProperties: {},
 };
 export default AmbientLightComponent;