react-three-game 0.0.109 → 0.0.110

package/README.md

@@ -153,6 +153,7 @@ interface GameObject {
   name?: string;
   disabled?: boolean;
   locked?: boolean;
+  hidden?: boolean;
   components?: Record<string, { type: string; properties: any }>;
   children?: GameObject[];
 }
@@ -280,17 +281,9 @@ Custom component `View`s use normal React and R3F behavior — `useFrame`, refs,
 
 ## Useful Exports
 
-* `GameCanvas`, `PrefabRoot`, `PrefabEditor`, `PrefabEditorMode`
-* `Prefab`, `GameObject`, `ComponentData`, `PrefabNode`, `PrefabEditorRef`, `Scene`
-* `registerComponent`, `Component`, `ComponentViewProps`, `FieldDefinition`
-* `useScene`, `useEditorRef`, `useEditorContext`
-* `useNode`, `useNodeObject`, `useNodeHandle`, `useAssetRuntime`
-* `usePrefabStore`, `usePrefabStoreApi`
-* `gameEvents`, `useGameEvent`, `useClickEvent`
-* `loadJson`, `saveJson`, `loadFiles`, `loadModel`, `loadTexture`, `loadSound`
-* `exportGLB`, `exportGLBData`, `regenerateIds`, `computeParentWorldMatrix`
-* `ground`, `soundManager`
-* `FieldRenderer`, `Vector3Field`, `NumberField`, `StringField`, `BooleanField`, `SelectField`, `ColorField`
+* `react-three-game/viewer`: `GameCanvas`, `PrefabRoot`, `PrefabEditorMode`, `registerComponent`, scene hooks, event hooks, asset/runtime hooks, prefab types, loaders, `ground`, and `soundManager`
+* `react-three-game/editor`: everything from `/viewer`, plus `PrefabEditor`, editor refs/context, prefab store hooks, inspector field components, JSON import/export helpers, GLB export helpers, material overrides, model decomposition, asset viewer components, and `three/tsl` helpers
+* `react-three-game/plugins/crashcat`: `CrashcatRuntime`, `CrashcatPhysicsComponent`, `CrashcatRagdollComponent`, ragdoll helpers, static body helpers, and `useCrashcat`
 
 ## Development
 

package/dist/plugins/crashcat/CrashcatPhysicsComponent.js

@@ -1,9 +1,10 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useFrame } from "@react-three/fiber";
-import { useEffect, useMemo, useRef } from "react";
+import { useCallback, useEffect, useMemo, useRef } from "react";
+import { useStore } from "zustand";
 import { BooleanField, FieldRenderer, StringField, Vector3Field, } from "../../tools/prefabeditor/components/Input";
-import { useAssetRuntime, useNode } from "../../tools/prefabeditor/assetRuntime";
+import { useModelAsset, useNode } from "../../tools/prefabeditor/assetRuntime";
 import { usePrefabStoreApi } from "../../tools/prefabeditor/prefabStore";
 import { PrefabEditorMode, useScene } from "../../tools/prefabeditor/SceneContext";
 import { box, capsule, convexHull, MotionQuality, MotionType, rigidBody, sphere, triangleMesh, } from "crashcat";
@@ -51,7 +52,26 @@ const scratchBoundsSize = new Vector3();
 const worldQuaternion = new Quaternion();
 const parentWorldQuaternion = new Quaternion();
 const localQuaternion = new Quaternion();
+// Extracted collider geometry is keyed by the sequence of geometry UUIDs in the
+// object's subtree. Clones of the same model share geometry instances and have
+// identical model-internal transforms, and the extraction is expressed in
+// object-local space (the object's own world transform is divided out), so the
+// result is identical across every instance/body of that model. Extracting once
+// avoids re-walking thousands of vertices per rigid body.
+const geometryDataCache = new Map();
 function collectGeometryData(object) {
+    let cacheKey = "";
+    object.traverse((child) => {
+        var _a;
+        const geometry = child.geometry;
+        if (((_a = geometry === null || geometry === void 0 ? void 0 : geometry.attributes) === null || _a === void 0 ? void 0 : _a.position) && geometry.uuid)
+            cacheKey += `${geometry.uuid};`;
+    });
+    if (cacheKey) {
+        const cached = geometryDataCache.get(cacheKey);
+        if (cached)
+            return cached;
+    }
     const positions = [];
     const indices = [];
     let vertexOffset = 0;
@@ -83,7 +103,10 @@ function collectGeometryData(object) {
     });
     if (positions.length === 0 || indices.length < 3)
         return null;
-    return { positions, indices };
+    const result = { positions, indices };
+    if (cacheKey)
+        geometryDataCache.set(cacheKey, result);
+    return result;
 }
 function createShapeForObject(object, physics) {
     var _a, _b;
@@ -246,8 +269,23 @@ function CrashcatPhysicsView({ properties, children }) {
     const scene = useScene();
     const store = usePrefabStoreApi();
     const api = useCrashcat();
-    const { getAssetRevision } = useAssetRuntime();
-    const revision = getAssetRevision();
+    // Subscribe only to this node's Model filename (not its full node, which would
+    // re-render on every transform edit), then to that one model's loaded asset.
+    // Colliders rebuild when *this* node's mesh loads, not when any asset loads.
+    const modelPath = useStore(store, useCallback((s) => {
+        var _a, _b;
+        const node = s.nodesById[nodeId];
+        if (!node)
+            return null;
+        for (const key in node.components) {
+            const component = node.components[key];
+            if ((component === null || component === void 0 ? void 0 : component.type) === "Model") {
+                return (_b = (_a = component.properties) === null || _a === void 0 ? void 0 : _a.filename) !== null && _b !== void 0 ? _b : null;
+            }
+        }
+        return null;
+    }, [nodeId]));
+    const loadedModel = useModelAsset(modelPath);
     const bodyRef = useRef(null);
     const motionTypeRef = useRef(MotionType.STATIC);
     const needsRegistrationRef = useRef(false);
@@ -307,8 +345,8 @@ function CrashcatPhysicsView({ properties, children }) {
         lastQuaternionRef.current = null;
     };
     useEffect(() => {
-        // Rebuild mesh-derived colliders when referenced assets finish loading.
-        void revision;
+        // Rebuild mesh-derived colliders when this node's referenced model finishes loading.
+        void loadedModel;
         needsRegistrationRef.current = true;
         if (api) {
             api.unregister(nodeId);
@@ -325,7 +363,7 @@ function CrashcatPhysicsView({ properties, children }) {
         getObject,
         nodeId,
         physics,
-        revision,
+        loadedModel,
     ]);
     useFrame(() => {
         if (needsRegistrationRef.current) {

package/dist/plugins/crashcat/CrashcatRagdoll.d.ts

@@ -52,7 +52,7 @@ export type CrashcatRagdollProps = {
     nodeInteractionHandlers?: NodeInteractionHandlers;
 };
 export declare function createRagdollSettings(scale?: number, angleA?: number, angleB?: number, twistAngle?: number): RagdollSettings;
-export declare function CrashcatRagdoll({ position, scale, swingAngle, shoulderAngle, twistAngle, stabilize, initialLinearVelocity, initialAngularVelocity, color, clickImpulse, nodeInteractionHandlers, }: CrashcatRagdollProps): import("react/jsx-runtime").JSX.Element;
+export declare function CrashcatRagdoll({ position, scale, swingAngle, shoulderAngle, twistAngle, stabilize, initialLinearVelocity, initialAngularVelocity, color, clickImpulse, nodeInteractionHandlers, }: CrashcatRagdollProps): import("react").JSX.Element;
 declare const CrashcatRagdollComponent: Component;
 export default CrashcatRagdollComponent;
 export declare function createStaticBoxBody(world: World, objectLayer: number, halfExtents: Vec3, position: Vec3): rigidBody.RigidBody;

package/dist/plugins/crashcat/CrashcatRuntime.d.ts

@@ -24,4 +24,4 @@ export declare function useCrashcat(): CrashcatApi | null;
 export declare function CrashcatRuntime({ debug, children }: {
     debug?: boolean;
     children?: React.ReactNode;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;

package/dist/shared/ContactShadow.d.ts

@@ -4,5 +4,5 @@ interface ContactShadowProps {
     scale?: number;
     yOffset?: number;
 }
-declare const ContactShadow: ({ opacity, blur, scale, yOffset, }: ContactShadowProps) => import("react/jsx-runtime").JSX.Element;
+declare const ContactShadow: ({ opacity, blur, scale, yOffset, }: ContactShadowProps) => import("react").JSX.Element;
 export default ContactShadow;

package/dist/shared/GameCanvas.d.ts

@@ -5,4 +5,4 @@ export interface GameCanvasProps extends Omit<CanvasProps, 'children'> {
     children: React.ReactNode;
     glConfig?: WebGPURendererParameters;
 }
-export default function GameCanvas({ loader, children, glConfig, onCreated, style, ...props }: GameCanvasProps): import("react/jsx-runtime").JSX.Element;
+export default function GameCanvas({ loader, children, glConfig, onCreated, style, ...props }: GameCanvasProps): import("react").JSX.Element;

package/dist/tools/assetviewer/page.d.ts

@@ -4,48 +4,48 @@ interface TextureListViewerProps {
     onSelect: (file: string) => void;
     basePath?: string;
 }
-export declare function TextureListViewer({ files, selected, onSelect, basePath }: TextureListViewerProps): import("react/jsx-runtime").JSX.Element;
+export declare function TextureListViewer({ files, selected, onSelect, basePath }: TextureListViewerProps): import("react").JSX.Element;
 interface ModelListViewerProps {
     files: string[];
     selected?: string;
     onSelect: (file: string) => void;
     basePath?: string;
 }
-export declare function ModelListViewer({ files, selected, onSelect, basePath }: ModelListViewerProps): import("react/jsx-runtime").JSX.Element;
+export declare function ModelListViewer({ files, selected, onSelect, basePath }: ModelListViewerProps): import("react").JSX.Element;
 interface SoundListViewerProps {
     files: string[];
     selected?: string;
     onSelect: (file: string) => void;
     basePath?: string;
 }
-export declare function SoundListViewer({ files, selected, onSelect, basePath }: SoundListViewerProps): import("react/jsx-runtime").JSX.Element;
+export declare function SoundListViewer({ files, selected, onSelect, basePath }: SoundListViewerProps): import("react").JSX.Element;
 export declare function TexturePicker({ value, onChange, basePath }: {
     value: string | undefined;
     onChange: (value: string | undefined) => void;
     basePath?: string;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
 export declare function ModelPicker({ value, onChange, basePath, pickerKey }: {
     value: string | undefined;
     onChange: (value: string | undefined) => void;
     basePath?: string;
     pickerKey?: string;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
 export declare function SoundPicker({ value, onChange, basePath }: {
     value: string | undefined;
     onChange: (value: string | undefined) => void;
     basePath?: string;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
 export declare function SingleTextureViewer({ file, basePath }: {
     file?: string;
     basePath?: string;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
 export declare function SingleModelViewer({ file, basePath }: {
     file?: string;
     basePath?: string;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
 export declare function SingleSoundViewer({ file, basePath }: {
     file?: string;
     basePath?: string;
-}): import("react/jsx-runtime").JSX.Element | null;
-export declare function SharedCanvas(): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element | null;
+export declare function SharedCanvas(): import("react").JSX.Element;
 export {};

package/dist/tools/dragdrop/DragDropLoader.d.ts

@@ -21,6 +21,6 @@ export declare function loadDroppedAssets(dataTransfer: DataTransfer | null, opt
 export declare function loadUrls(urls: string[], options: AssetLoadOptions): Promise<void>;
 export declare function loadUrl(url: string, options: AssetLoadOptions): Promise<void>;
 export declare function loadFiles(files: File[], { onModelLoaded, onTextureLoaded, onSoundLoaded, onUnhandledFile, onFilesLoaded, onLoadError }: AssetLoadOptions): Promise<void>;
-export declare function DragDropLoader({ children, ...divProps }: DragDropLoaderProps): import("react/jsx-runtime").JSX.Element;
-export declare function FilePicker({ accept, children, multiple, ...divProps }: FilePickerProps): import("react/jsx-runtime").JSX.Element;
+export declare function DragDropLoader({ children, ...divProps }: DragDropLoaderProps): import("react").JSX.Element;
+export declare function FilePicker({ accept, children, multiple, ...divProps }: FilePickerProps): import("react").JSX.Element;
 export {};

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

@@ -11,5 +11,5 @@ export declare function Dropdown({ trigger, children, placement, offset, zIndex,
     placement?: Placement;
     offset?: number;
     zIndex?: number;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
 export {};

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

@@ -9,4 +9,4 @@ export default function EditorTree({ selectedId, setSelectedId, getPrefab, onRep
     onRedo?: () => void;
     canUndo?: boolean;
     canRedo?: boolean;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;

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

@@ -14,7 +14,7 @@ export declare function TreeNodeMenu({ isRoot, nodeId, locked, onAddChild, onFoc
     onDuplicate?: (nodeId: string) => void;
     onDelete?: (nodeId: string) => void;
     onClose: () => void;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
 export declare function TreeContextMenu({ contextMenu, onClose, children, }: {
     contextMenu: TreeContextMenuState;
     onClose: () => void;
@@ -26,4 +26,4 @@ export declare function FileMenu({ getPrefab, onReplacePrefab, onImportPrefab, o
     onImportPrefab: (prefab: Prefab) => void;
     onImportPackedPrefab: (url: string) => void;
     onClose: () => void;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;

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

@@ -10,5 +10,5 @@ declare function EditorUI({ selectedId, setSelectedId, getPrefab, onReplacePrefa
     onRedo?: () => void;
     canUndo?: boolean;
     canRedo?: boolean;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
 export default EditorUI;

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

@@ -29,7 +29,7 @@ export declare function GameInstanceProvider({ children, models, onSelect, onCli
     registerRef?: (id: string, obj: Object3D | null) => void;
     selectedId?: string | null;
     editMode?: boolean;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
 export declare function useInstanceCheck(id: string): boolean;
 export declare function GameInstance({ id, sourceId, modelUrl, locked, position, rotation, scale, visible, onClick: _onClick, }: {
     id: string;

package/dist/tools/prefabeditor/PrefabEditor.js

@@ -12,7 +12,7 @@ import { MapControls, TransformControls, useHelper } from "@react-three/drei";
 import { useCallback, useEffect, useMemo, useRef, useState, forwardRef, useImperativeHandle } from "react";
 import { BoxHelper } from "three";
 import { findComponentEntry } from "./types";
-import { GameCanvas, PrefabRoot, PrefabEditorMode, SceneContext, createImageNode, createModelNode, denormalizePrefab } from "../../viewer";
+import { GameCanvas, PrefabRoot, PrefabEditorMode, SceneContext, AssetRuntimeProvider, createImageNode, createModelNode, denormalizePrefab } from "../../viewer";
 import EditorUI from "./EditorUI";
 import { base, toolbar } from "./styles";
 import { computeParentWorldMatrix, decompose, exportGLB as exportGLBFile, exportGLBData, focusCameraOnObject, isExternalPath, regenerateIds, withBasePath } from "./utils";
@@ -65,11 +65,12 @@ const PrefabEditor = forwardRef(({ basePath = "", initialPrefab, mode: initialMo
     const [rotationSnap, setRotationSnap] = useState(Math.PI / 4);
     const startingPrefab = initialPrefab !== null && initialPrefab !== void 0 ? initialPrefab : DEFAULT_PREFAB;
     const [prefabStore] = useState(() => createPrefabStore(startingPrefab));
-    const [history, setHistory] = useState([startingPrefab]);
+    const [history, setHistory] = useState(() => [prefabStore.getState()]);
     const [historyIndex, setHistoryIndex] = useState(0);
     const historyIndexRef = useRef(0);
     const historyTimeoutRef = useRef(null);
-    const prefabRootRef = useRef(null);
+    const notifyRafRef = useRef(null);
+    const runtimeRef = useRef(null);
     const canvasRef = useRef(null);
     const controlsRef = useRef(null);
     const transformControlsRef = useRef(null);
@@ -81,11 +82,14 @@ const PrefabEditor = forwardRef(({ basePath = "", initialPrefab, mode: initialMo
     }, []);
     const getPrefab = useCallback(() => denormalizePrefab(prefabStore.getState()), [prefabStore]);
     const getNode = useCallback((nodeId) => { var _a; return (_a = prefabStore.getState().nodesById[nodeId]) !== null && _a !== void 0 ? _a : null; }, [prefabStore]);
-    const getRoot = useCallback(() => { var _a, _b; return (_b = (_a = prefabRootRef.current) === null || _a === void 0 ? void 0 : _a.root) !== null && _b !== void 0 ? _b : null; }, []);
-    const getObject = useCallback((nodeId) => { var _a, _b; return (_b = (_a = prefabRootRef.current) === null || _a === void 0 ? void 0 : _a.getObject(nodeId)) !== null && _b !== void 0 ? _b : null; }, []);
-    const getHandle = useCallback((nodeId, kind) => { var _a, _b; return (_b = (_a = prefabRootRef.current) === null || _a === void 0 ? void 0 : _a.getHandle(nodeId, kind)) !== null && _b !== void 0 ? _b : null; }, []);
-    const getModel = useCallback((path) => { var _a, _b; return (_b = (_a = prefabRootRef.current) === null || _a === void 0 ? void 0 : _a.getModel(path)) !== null && _b !== void 0 ? _b : null; }, []);
-    const scheduleHistory = useCallback((nextPrefab) => {
+    const getRoot = useCallback(() => { var _a, _b; return (_b = (_a = runtimeRef.current) === null || _a === void 0 ? void 0 : _a.getObject(prefabStore.getState().rootId)) !== null && _b !== void 0 ? _b : null; }, [prefabStore]);
+    const getObject = useCallback((nodeId) => { var _a, _b; return (_b = (_a = runtimeRef.current) === null || _a === void 0 ? void 0 : _a.getObject(nodeId)) !== null && _b !== void 0 ? _b : null; }, []);
+    const getHandle = useCallback((nodeId, kind) => { var _a, _b; return (_b = (_a = runtimeRef.current) === null || _a === void 0 ? void 0 : _a.getHandle(nodeId, kind)) !== null && _b !== void 0 ? _b : null; }, []);
+    const getModel = useCallback((path) => { var _a, _b; return (_b = (_a = runtimeRef.current) === null || _a === void 0 ? void 0 : _a.getModel(path)) !== null && _b !== void 0 ? _b : null; }, []);
+    // History stores normalized state snapshots. Because store mutations use
+    // structural sharing (unchanged nodes keep their references), capturing a
+    // snapshot is O(1) instead of deep-cloning the whole prefab tree.
+    const scheduleHistory = useCallback((snapshot) => {
         if (historyTimeoutRef.current) {
             clearTimeout(historyTimeoutRef.current);
             historyTimeoutRef.current = null;
@@ -93,7 +97,7 @@ const PrefabEditor = forwardRef(({ basePath = "", initialPrefab, mode: initialMo
         historyTimeoutRef.current = setTimeout(() => {
             const currentHistoryIndex = historyIndexRef.current;
             setHistory(prev => {
-                const nextHistory = [...prev.slice(0, currentHistoryIndex + 1), nextPrefab];
+                const nextHistory = [...prev.slice(0, currentHistoryIndex + 1), snapshot];
                 return nextHistory.length > MAX_HISTORY_LENGTH ? nextHistory.slice(1) : nextHistory;
             });
             const nextHistoryIndex = Math.min(currentHistoryIndex + 1, MAX_HISTORY_LENGTH - 1);
@@ -102,19 +106,29 @@ const PrefabEditor = forwardRef(({ basePath = "", initialPrefab, mode: initialMo
             historyTimeoutRef.current = null;
         }, HISTORY_DEBOUNCE_MS);
     }, []);
+    // Coalesce onChange notifications to once per frame. denormalizePrefab walks
+    // the entire tree, so calling it on every mutation (e.g. per-frame gizmo
+    // drags) does not scale. We only pay that cost once, with the latest state.
+    const scheduleChange = useCallback(() => {
+        if (!onChangeRef.current || notifyRafRef.current != null)
+            return;
+        notifyRafRef.current = requestAnimationFrame(() => {
+            var _a;
+            notifyRafRef.current = null;
+            (_a = onChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onChangeRef, denormalizePrefab(prefabStore.getState()));
+        });
+    }, [prefabStore]);
     const mutate = useCallback((run, pushHistory = isEditMode) => {
-        var _a;
         const before = prefabStore.getState();
         const result = run(before);
         const after = prefabStore.getState();
         if (after === before)
             return result;
-        const prefab = denormalizePrefab(after);
-        (_a = onChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onChangeRef, prefab);
+        scheduleChange();
         if (pushHistory)
-            scheduleHistory(prefab);
+            scheduleHistory(after);
         return result;
-    }, [isEditMode, prefabStore, scheduleHistory]);
+    }, [isEditMode, prefabStore, scheduleChange, scheduleHistory]);
     const update = useCallback((id, fn) => {
         mutate(s => s.updateNode(id, fn));
     }, [mutate]);
@@ -172,7 +186,7 @@ const PrefabEditor = forwardRef(({ basePath = "", initialPrefab, mode: initialMo
         }
         if (options === null || options === void 0 ? void 0 : options.resetHistory) {
             setSelectedId(null);
-            setHistory([prefab]);
+            setHistory([prefabStore.getState()]);
             historyIndexRef.current = 0;
             setHistoryIndex(0);
         }
@@ -189,6 +203,9 @@ const PrefabEditor = forwardRef(({ basePath = "", initialPrefab, mode: initialMo
             if (historyTimeoutRef.current) {
                 clearTimeout(historyTimeoutRef.current);
             }
+            if (notifyRafRef.current != null) {
+                cancelAnimationFrame(notifyRafRef.current);
+            }
         };
     }, []);
     useEffect(() => {
@@ -210,14 +227,13 @@ const PrefabEditor = forwardRef(({ basePath = "", initialPrefab, mode: initialMo
         add(regenerateIds(prefab.root));
     }, [add]);
     const applyHistory = useCallback((index) => {
-        var _a;
         detachTransformControls();
-        prefabStore.getState().replacePrefab(history[index]);
-        (_a = onChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onChangeRef, history[index]);
+        prefabStore.getState().restoreState(history[index]);
+        scheduleChange();
         historyIndexRef.current = index;
         setHistoryIndex(index);
         setSelectedId(prev => prev && prefabStore.getState().nodesById[prev] ? prev : null);
-    }, [detachTransformControls, history, prefabStore]);
+    }, [detachTransformControls, history, prefabStore, scheduleChange]);
     const undo = useCallback(() => {
         if (historyIndex > 0) {
             applyHistory(historyIndex - 1);
@@ -319,11 +335,11 @@ const PrefabEditor = forwardRef(({ basePath = "", initialPrefab, mode: initialMo
         function handleDrop(e) {
             e.preventDefault();
             e.stopPropagation();
-            const scene = prefabRootRef.current;
+            const runtime = runtimeRef.current;
             void loadDroppedAssets(e.dataTransfer, {
                 onModelLoaded: (model, filename, file) => {
                     const path = getPrefabAssetRef(filename, 'models');
-                    scene === null || scene === void 0 ? void 0 : scene.addModel(path, model);
+                    runtime === null || runtime === void 0 ? void 0 : runtime.registerModel(path, model);
                     const modelName = file.name.replace(/\.[^.]+$/, '');
                     const modelIdPrefix = modelName.replace(/[^\w-]+/g, '-') || 'model';
                     if (hasCollisionMeshConventions(model)) {
@@ -336,7 +352,7 @@ const PrefabEditor = forwardRef(({ basePath = "", initialPrefab, mode: initialMo
                                 return key;
                             },
                         });
-                        textureRefs.forEach((texture, path) => scene === null || scene === void 0 ? void 0 : scene.addTexture(path, texture));
+                        textureRefs.forEach((texture, path) => { runtime === null || runtime === void 0 ? void 0 : runtime.registerTexture(path, texture); });
                         add(Object.assign(Object.assign({}, decomposed), { name: modelName || decomposed.name }));
                         return;
                     }
@@ -344,7 +360,7 @@ const PrefabEditor = forwardRef(({ basePath = "", initialPrefab, mode: initialMo
                 },
                 onTextureLoaded: (texture, filename, file) => {
                     const path = getPrefabAssetRef(filename, 'textures');
-                    scene === null || scene === void 0 ? void 0 : scene.addTexture(path, texture);
+                    runtime === null || runtime === void 0 ? void 0 : runtime.registerTexture(path, texture);
                     add(createImageNode(path, file.name.replace(/\.[^.]+$/, '')));
                 },
                 onLoadError: error => {
@@ -376,44 +392,44 @@ const PrefabEditor = forwardRef(({ basePath = "", initialPrefab, mode: initialMo
         duplicate,
         move,
         replace,
-        addModel: (path, model) => { var _a; return (_a = prefabRootRef.current) === null || _a === void 0 ? void 0 : _a.addModel(path, model); },
-        addTexture: (path, texture) => { var _a; return (_a = prefabRootRef.current) === null || _a === void 0 ? void 0 : _a.addTexture(path, texture); },
-        addSound: (path, sound) => { var _a; return (_a = prefabRootRef.current) === null || _a === void 0 ? void 0 : _a.addSound(path, sound); },
+        addModel: (path, model) => { var _a; return (_a = runtimeRef.current) === null || _a === void 0 ? void 0 : _a.registerModel(path, model); },
+        addTexture: (path, texture) => { var _a; return (_a = runtimeRef.current) === null || _a === void 0 ? void 0 : _a.registerTexture(path, texture); },
+        addSound: (path, sound) => { var _a; return (_a = runtimeRef.current) === null || _a === void 0 ? void 0 : _a.registerSound(path, sound); },
     }), [add, basePath, duplicate, getHandle, getModel, getNode, getObject, getRoot, mode, move, remove, replace, replaceNode, update]);
     const editorRefValue = useMemo(() => (Object.assign(Object.assign({}, sceneValue), { save: getPrefab, load: loadPrefab, undo,
         redo, screenshot: handleScreenshot, exportGLB: handleExportGLB, exportGLBData: handleExportGLBData, clearSelection })), [clearSelection, getPrefab, handleExportGLB, handleExportGLBData, handleScreenshot, loadPrefab, redo, sceneValue, undo]);
     useImperativeHandle(ref, () => editorRefValue, [editorRefValue]);
-    const content = (_jsxs(_Fragment, { children: [isEditMode ? _jsx("gridHelper", { args: [10, 10], position: [0, -1, 0] }) : null, _jsx(PrefabRoot, { ref: prefabRootRef, store: prefabStore, editMode: isEditMode, selectedId: selectedId, onSelect: setSelection, basePath: basePath, children: children })] }));
+    const content = (_jsxs(_Fragment, { children: [isEditMode ? _jsx("gridHelper", { args: [10, 10], position: [0, -1, 0] }) : null, _jsx(PrefabRoot, { store: prefabStore, editMode: isEditMode, selectedId: selectedId, onSelect: setSelection, basePath: basePath, children: children })] }));
     const handleCanvasCreated = useCallback((state) => {
         var _a;
         canvasRef.current = state.gl.domElement;
         (_a = canvasProps === null || canvasProps === void 0 ? void 0 : canvasProps.onCreated) === null || _a === void 0 ? void 0 : _a.call(canvasProps, state);
     }, [canvasProps]);
-    return _jsx(PrefabStoreProvider, { store: prefabStore, children: _jsx(EditorRefContext.Provider, { value: editorRefValue, children: _jsx(EditorContext.Provider, { value: {
-                    mode,
-                    basePath,
-                    setMode: updateMode,
-                    transformMode,
-                    setTransformMode,
-                    scaleSnap,
-                    setScaleSnap,
-                    positionSnap,
-                    setPositionSnap,
-                    rotationSnap,
-                    setRotationSnap,
-                    onFocusNode: isEditMode ? handleFocusNode : undefined,
-                    onScreenshot: handleScreenshot,
-                    onExportGLB: handleExportGLB
-                }, children: _jsxs(SceneContext.Provider, { value: sceneValue, children: [_jsxs(GameCanvas, Object.assign({ camera: { position: [0, 5, 15] } }, canvasProps, { onCreated: handleCanvasCreated, onPointerMissed: isEditMode
-                                ? (event) => {
-                                    var _a, _b, _c, _d;
-                                    const button = (_c = (_a = event.button) !== null && _a !== void 0 ? _a : (_b = event.sourceEvent) === null || _b === void 0 ? void 0 : _b.button) !== null && _c !== void 0 ? _c : 0;
-                                    if (button === 0 && selectedId) {
-                                        setSelection(null);
+    return _jsx(PrefabStoreProvider, { store: prefabStore, children: _jsx(AssetRuntimeProvider, { runtimeRef: runtimeRef, children: _jsx(EditorRefContext.Provider, { value: editorRefValue, children: _jsx(EditorContext.Provider, { value: {
+                        mode,
+                        basePath,
+                        setMode: updateMode,
+                        transformMode,
+                        setTransformMode,
+                        scaleSnap,
+                        setScaleSnap,
+                        positionSnap,
+                        setPositionSnap,
+                        rotationSnap,
+                        setRotationSnap,
+                        onFocusNode: isEditMode ? handleFocusNode : undefined,
+                        onScreenshot: handleScreenshot,
+                        onExportGLB: handleExportGLB
+                    }, children: _jsxs(SceneContext.Provider, { value: sceneValue, children: [_jsxs(GameCanvas, Object.assign({ camera: { position: [0, 5, 15] } }, canvasProps, { onCreated: handleCanvasCreated, onPointerMissed: isEditMode
+                                    ? (event) => {
+                                        var _a, _b, _c, _d;
+                                        const button = (_c = (_a = event.button) !== null && _a !== void 0 ? _a : (_b = event.sourceEvent) === null || _b === void 0 ? void 0 : _b.button) !== null && _c !== void 0 ? _c : 0;
+                                        if (button === 0 && selectedId) {
+                                            setSelection(null);
+                                        }
+                                        (_d = canvasProps === null || canvasProps === void 0 ? void 0 : canvasProps.onPointerMissed) === null || _d === void 0 ? void 0 : _d.call(canvasProps, event);
                                     }
-                                    (_d = canvasProps === null || canvasProps === void 0 ? void 0 : canvasProps.onPointerMissed) === null || _d === void 0 ? void 0 : _d.call(canvasProps, event);
-                                }
-                                : canvasProps === null || canvasProps === void 0 ? void 0 : canvasProps.onPointerMissed, children: [content, isEditMode ? _jsx(SelectionHelper, { object: transformObject }) : null, isEditMode && (_jsxs(_Fragment, { children: [_jsx(MapControls, { ref: controlsRef, enableDamping: false, makeDefault: true }), transformObject && (_jsx(TransformControls, { ref: transformControlsRef, object: transformObject, mode: transformMode, space: transformMode === "translate" ? "world" : "local", onObjectChange: handleTransformChange, translationSnap: positionSnap > 0 ? positionSnap : undefined, rotationSnap: rotationSnap > 0 ? rotationSnap : undefined, scaleSnap: scaleSnap > 0 ? scaleSnap : undefined }, `transform-${selectedId}-${transformMode}-${positionSnap}-${rotationSnap}-${scaleSnap}`))] }))] })), showUI && (_jsxs(_Fragment, { children: [_jsxs("div", { style: toolbar.panel, children: [_jsx("button", { type: "button", style: base.btn, onClick: toggleMode, children: isEditMode ? "▶" : "⏸" }), uiPlugins] }), isEditMode && (_jsx(EditorUI, { selectedId: selectedId, setSelectedId: setSelection, getPrefab: getPrefab, onReplacePrefab: (prefab) => loadPrefab(prefab, { resetHistory: true }), onImportPrefab: importPrefab, basePath: basePath, onUndo: undo, onRedo: redo, canUndo: historyIndex > 0, canRedo: historyIndex < history.length - 1 }))] }))] }) }) }) });
+                                    : canvasProps === null || canvasProps === void 0 ? void 0 : canvasProps.onPointerMissed, children: [content, isEditMode ? _jsx(SelectionHelper, { object: transformObject }) : null, isEditMode && (_jsxs(_Fragment, { children: [_jsx(MapControls, { ref: controlsRef, enableDamping: false, makeDefault: true }), transformObject && (_jsx(TransformControls, { ref: transformControlsRef, object: transformObject, mode: transformMode, space: transformMode === "translate" ? "world" : "local", onObjectChange: handleTransformChange, translationSnap: positionSnap > 0 ? positionSnap : undefined, rotationSnap: rotationSnap > 0 ? rotationSnap : undefined, scaleSnap: scaleSnap > 0 ? scaleSnap : undefined }, `transform-${selectedId}-${transformMode}-${positionSnap}-${rotationSnap}-${scaleSnap}`))] }))] })), showUI && (_jsxs(_Fragment, { children: [_jsxs("div", { style: toolbar.panel, children: [_jsx("button", { type: "button", style: base.btn, onClick: toggleMode, children: isEditMode ? "▶" : "⏸" }), uiPlugins] }), isEditMode && (_jsx(EditorUI, { selectedId: selectedId, setSelectedId: setSelection, getPrefab: getPrefab, onReplacePrefab: (prefab) => loadPrefab(prefab, { resetHistory: true }), onImportPrefab: importPrefab, basePath: basePath, onUndo: undo, onRedo: redo, canUndo: historyIndex > 0, canRedo: historyIndex < history.length - 1 }))] }))] }) }) }) }) });
 });
 PrefabEditor.displayName = "PrefabEditor";
 export default PrefabEditor;

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

@@ -1,6 +1,6 @@
 import { Matrix4 } from "three";
 import type { Object3D } from "three";
-import { type ThreeEvent } from "@react-three/fiber";
+import type { ThreeEvent } from "@react-three/fiber";
 import type { GameObject as GameObjectType, Prefab } from "./types";
 import type { LoadedModels } from "../dragdrop";
 import type { PrefabStoreApi } from "./prefabStore";
@@ -18,7 +18,7 @@ export interface PrefabRootProps {
     children?: React.ReactNode;
 }
 export declare const PrefabRoot: import("react").ForwardRefExoticComponent<PrefabRootProps & import("react").RefAttributes<Scene>>;
-export declare function GameObjectRenderer(props: RendererProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function GameObjectRenderer(props: RendererProps): import("react").JSX.Element | null;
 interface RendererProps {
     nodeId: string;
     selectedId?: string | null;