react-three-game 0.0.68 → 0.0.70

package/dist/helpers/SoundManager.d.ts

@@ -19,6 +19,8 @@ declare class SoundManager {
         detune?: number;
         pitch?: number;
     }): void;
+    hasBuffer(path: string): boolean;
+    setBuffer(path: string, buffer: AudioBuffer): void;
     /** Load and play SFX - accepts file path directly */
     play(path: string, options?: {
         volume?: number;

package/dist/helpers/SoundManager.js

@@ -68,6 +68,12 @@ class SoundManager {
         gain.connect(this.sfxGain);
         src.start();
     }
+    hasBuffer(path) {
+        return this.buffers.has(path);
+    }
+    setBuffer(path, buffer) {
+        this.buffers.set(path, buffer);
+    }
     /** Load and play SFX - accepts file path directly */
     play(path, options) {
         return __awaiter(this, void 0, void 0, function* () {

package/dist/index.d.ts

@@ -4,14 +4,15 @@ export { ground } from './helpers';
 export type { GroundOptions, Vec3 } from './helpers';
 export { sound as soundManager } from './helpers/SoundManager';
 export { default as PrefabEditor } from './tools/prefabeditor/PrefabEditor';
+export { PrefabEditorMode } from './tools/prefabeditor/PrefabEditor';
 export { default as PrefabRoot } from './tools/prefabeditor/PrefabRoot';
-export { useEditorContext } from './tools/prefabeditor/EditorContext';
-export type { EditorContextType } from './tools/prefabeditor/EditorContext';
-export { createPrefabStore, prefabStoreToPrefab } from './tools/prefabeditor/prefabStore';
+export { useEditorContext } from './tools/prefabeditor/PrefabEditor';
+export type { EditorContextType } from './tools/prefabeditor/PrefabEditor';
+export { createPrefabStore, prefabStoreToPrefab, usePrefabStoreApi } from './tools/prefabeditor/prefabStore';
 export type { PrefabStoreApi, PrefabStoreState } from './tools/prefabeditor/prefabStore';
 export { createScene } from './tools/prefabeditor/sceneApi';
 export { registerComponent } from './tools/prefabeditor/components/ComponentRegistry';
-export { FieldRenderer, FieldGroup, Label, Vector3Input, Vector3Field, NumberField, ColorInput, ColorField, StringInput, StringField, BooleanInput, BooleanField, SelectInput, SelectField, } from './tools/prefabeditor/components/Input';
+export { FieldRenderer, FieldGroup, ListEditor, Label, Vector3Input, Vector3Field, NumberField, ColorInput, ColorField, StringInput, StringField, BooleanInput, BooleanField, SelectInput, SelectField, } from './tools/prefabeditor/components/Input';
 export { loadJson, saveJson, exportGLB, exportGLBData, regenerateIds, computeParentWorldMatrix, createModelNode, createImageNode, } from './tools/prefabeditor/utils';
 export type { ExportGLBOptions } from './tools/prefabeditor/utils';
 export type { PrefabEditorProps, PrefabEditorRef, } from './tools/prefabeditor/PrefabEditor';
@@ -19,10 +20,12 @@ export type { SpawnOptions, Scene, Entity, EntityComponent, EntityData, EntityUp
 export type { PrefabRootProps, PrefabRootRef } from './tools/prefabeditor/PrefabRoot';
 export type { Component } from './tools/prefabeditor/components/ComponentRegistry';
 export type { FieldDefinition, FieldType } from './tools/prefabeditor/components/Input';
-export type { Prefab, GameObject, ComponentData as ComponentDefinition } from './tools/prefabeditor/types';
+export type { Prefab, GameObject, ComponentData } from './tools/prefabeditor/types';
+export { findComponent, findComponentEntry, hasComponent } from './tools/prefabeditor/types';
 export { gameEvents, useGameEvent, getEntityIdFromRigidBody } from './tools/prefabeditor/GameEvents';
 export type { GameEventType, GameEventMap, GameEventPayload, PhysicsEventType, InteractionEventType, PhysicsEventPayload, ClickEventPayload } from './tools/prefabeditor/GameEvents';
 export { loadFiles } from './tools/dragdrop/DragDropLoader';
 export type { AssetLoadOptions } from './tools/dragdrop/DragDropLoader';
-export { loadModel, loadTexture } from './tools/dragdrop/modelLoader';
-export type { LoadedModel, LoadedTexture, LoadedModels, LoadedTextures, ModelLoadResult, ProgressCallback, TextureLoadResult } from './tools/dragdrop/modelLoader';
+export { loadModel, loadSound, loadTexture } from './tools/dragdrop/modelLoader';
+export type { LoadedModel, LoadedModels, ModelLoadResult, LoadedSound, LoadedSounds, SoundLoadResult, LoadedTexture, LoadedTextures, TextureLoadResult, ProgressCallback, } from './tools/dragdrop/modelLoader';
+export { ModelListViewer, SoundListViewer, ModelPicker, SoundPicker, TextureListViewer, TexturePicker, SingleModelViewer, SingleSoundViewer, SingleTextureViewer, SharedCanvas, } from './tools/assetviewer/page';

package/dist/index.js

@@ -5,19 +5,23 @@ export { ground } from './helpers';
 export { sound as soundManager } from './helpers/SoundManager';
 // Prefab Editor
 export { default as PrefabEditor } from './tools/prefabeditor/PrefabEditor';
+export { PrefabEditorMode } from './tools/prefabeditor/PrefabEditor';
 export { default as PrefabRoot } from './tools/prefabeditor/PrefabRoot';
-export { useEditorContext } from './tools/prefabeditor/EditorContext';
+export { useEditorContext } from './tools/prefabeditor/PrefabEditor';
 // Prefab Editor - Store & Scene API
-export { createPrefabStore, prefabStoreToPrefab } from './tools/prefabeditor/prefabStore';
+export { createPrefabStore, prefabStoreToPrefab, usePrefabStoreApi } from './tools/prefabeditor/prefabStore';
 export { createScene } from './tools/prefabeditor/sceneApi';
 // Prefab Editor - Component Registry
 export { registerComponent } from './tools/prefabeditor/components/ComponentRegistry';
 // Prefab Editor - Input Components
-export { FieldRenderer, FieldGroup, Label, Vector3Input, Vector3Field, NumberField, ColorInput, ColorField, StringInput, StringField, BooleanInput, BooleanField, SelectInput, SelectField, } from './tools/prefabeditor/components/Input';
+export { FieldRenderer, FieldGroup, ListEditor, Label, Vector3Input, Vector3Field, NumberField, ColorInput, ColorField, StringInput, StringField, BooleanInput, BooleanField, SelectInput, SelectField, } from './tools/prefabeditor/components/Input';
 // Prefab Editor - Utils
 export { loadJson, saveJson, exportGLB, exportGLBData, regenerateIds, computeParentWorldMatrix, createModelNode, createImageNode, } from './tools/prefabeditor/utils';
+export { findComponent, findComponentEntry, hasComponent } from './tools/prefabeditor/types';
 // Game Events (physics + custom events)
 export { gameEvents, useGameEvent, getEntityIdFromRigidBody } from './tools/prefabeditor/GameEvents';
 // Asset Loading
 export { loadFiles } from './tools/dragdrop/DragDropLoader';
-export { loadModel, loadTexture } from './tools/dragdrop/modelLoader';
+export { loadModel, loadSound, loadTexture } from './tools/dragdrop/modelLoader';
+// Asset Viewer
+export { ModelListViewer, SoundListViewer, ModelPicker, SoundPicker, TextureListViewer, TexturePicker, SingleModelViewer, SingleSoundViewer, SingleTextureViewer, SharedCanvas, } from './tools/assetviewer/page';

package/dist/shared/GameCanvas.js

@@ -23,8 +23,6 @@ import { Canvas, extend } from "@react-three/fiber";
 import { WebGPURenderer, MeshBasicNodeMaterial, MeshStandardNodeMaterial, SpriteNodeMaterial, PCFShadowMap } from "three/webgpu";
 import { Suspense, useState } from "react";
 import { Loader } from "@react-three/drei";
-// generic version
-// extend(THREE as any)
 extend({
     MeshBasicNodeMaterial: MeshBasicNodeMaterial,
     MeshStandardNodeMaterial: MeshStandardNodeMaterial,

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

@@ -30,6 +30,11 @@ export declare function ModelPicker({ value, onChange, basePath, pickerKey }: {
     basePath?: string;
     pickerKey?: string;
 }): import("react/jsx-runtime").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;
 export declare function SingleTextureViewer({ file, basePath }: {
     file?: string;
     basePath?: string;

package/dist/tools/assetviewer/page.js

@@ -209,6 +209,9 @@ export function TexturePicker({ value, onChange, basePath = "" }) {
 export function ModelPicker({ value, onChange, basePath = "", pickerKey }) {
     return (_jsx(AssetPicker, { value: value, onChange: onChange, basePath: basePath, manifestFolder: "models", rootStyle: { maxHeight: 160, overflow: 'visible', position: 'relative', display: 'flex', gap: 8, alignItems: 'center', justifyContent: 'center' }, controlsStyle: { display: 'flex', flexDirection: 'column', gap: 6, flex: '0 0 84px', minWidth: 84, justifyContent: 'flex-end' }, changeButtonStyle: { width: '100%', padding: '6px 8px', backgroundColor: '#1f2937', color: 'inherit', fontSize: 10, cursor: 'pointer', border: '1px solid rgba(34, 211, 238, 0.3)' }, clearButtonStyle: { width: '100%', padding: '6px 8px', backgroundColor: '#1f2937', color: 'inherit', fontSize: 10, cursor: 'pointer', border: '1px solid rgba(34, 211, 238, 0.3)' }, popupStyle: { background: 'rgba(0,0,0,0.9)', border: '1px solid rgba(34, 211, 238, 0.3)' }, preview: _jsx("div", { style: { flex: '0 0 auto' }, children: _jsx(SingleModelViewer, { file: value ? `/${value}` : undefined, basePath: basePath }) }), renderList: ({ files, value: selectedValue, onSelect, basePath: currentBasePath }) => (_jsx(ModelListViewer, { files: files, selected: selectedValue ? `/${selectedValue}` : undefined, onSelect: (file) => onSelect(file.startsWith('/') ? file.slice(1) : file), basePath: currentBasePath }, pickerKey)) }));
 }
+export function SoundPicker({ value, onChange, basePath = "" }) {
+    return (_jsx(AssetPicker, { value: value, onChange: onChange, basePath: basePath, manifestFolder: "sound", rootStyle: { maxHeight: 76, overflow: 'visible', position: 'relative', display: 'flex', gap: 8, alignItems: 'center', justifyContent: 'center' }, controlsStyle: { display: 'flex', flexDirection: 'column', gap: 6, flex: '0 0 84px', minWidth: 84, justifyContent: 'flex-end' }, changeButtonStyle: { width: '100%', padding: '6px 8px', backgroundColor: '#1f2937', color: 'inherit', fontSize: 10, cursor: 'pointer', border: '1px solid rgba(255,255,255,0.12)', borderRadius: 3 }, clearButtonStyle: { width: '100%', padding: '6px 8px', backgroundColor: '#1f2937', color: 'inherit', fontSize: 10, cursor: 'pointer', border: '1px solid rgba(255,255,255,0.12)', borderRadius: 3 }, preview: _jsx("div", { style: { flex: '0 0 auto', minWidth: 84 }, children: value ? _jsx(SingleSoundViewer, { file: value, basePath: basePath }) : _jsx("div", { style: { width: 84, height: 60, backgroundColor: '#1f2937', border: '1px dashed rgba(255,255,255,0.12)', borderRadius: 4 } }) }), renderList: ({ files, value: selectedValue, onSelect, basePath: currentBasePath }) => (_jsx(SoundListViewer, { files: files, selected: selectedValue || undefined, onSelect: onSelect, basePath: currentBasePath })) }));
+}
 // Single Asset Viewer Components - display only one selected asset
 export function SingleTextureViewer({ file, basePath = "" }) {
     if (!file)

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

@@ -1,8 +1,9 @@
 import type { HTMLAttributes, ReactNode } from "react";
-import type { LoadedModel, LoadedTexture } from "./modelLoader";
+import type { LoadedModel, LoadedSound, LoadedTexture } from "./modelLoader";
 export interface AssetLoadOptions {
     onModelLoaded?: (model: LoadedModel, filename: string, file: File) => void | Promise<void>;
     onTextureLoaded?: (texture: LoadedTexture, filename: string, file: File) => void | Promise<void>;
+    onSoundLoaded?: (sound: LoadedSound, filename: string, file: File) => void | Promise<void>;
     onUnhandledFile?: (file: File) => void | Promise<void>;
     onFilesLoaded?: (files: File[]) => void | Promise<void>;
     onLoadError?: (error: unknown, filename: string, file: File) => void | Promise<void>;
@@ -16,7 +17,7 @@ export interface FilePickerProps extends AssetLoadOptions, DivProps {
     children?: ReactNode;
     multiple?: boolean;
 }
-export declare function loadFiles(files: File[], { onModelLoaded, onTextureLoaded, onUnhandledFile, onFilesLoaded, onLoadError }: 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 {};

package/dist/tools/dragdrop/DragDropLoader.js

@@ -20,16 +20,17 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useRef } from "react";
-import { canParseModelFile, canParseTextureFile, parseModelFromFile, parseTextureFromFile } from "./modelLoader";
-const DEFAULT_ACCEPT = ".glb,.gltf,.fbx,.png,.jpg,.jpeg,.webp,.gif,.bmp,.svg";
+import { canParseModelFile, canParseSoundFile, canParseTextureFile, parseModelFromFile, parseSoundFromFile, parseTextureFromFile } from "./modelLoader";
+const DEFAULT_ACCEPT = ".glb,.gltf,.fbx,.png,.jpg,.jpeg,.webp,.gif,.bmp,.svg,.mp3,.wav,.ogg,.m4a";
 function getFiles(fileList) {
     return fileList ? Array.from(fileList) : [];
 }
 export function loadFiles(files_1, _a) {
-    return __awaiter(this, arguments, void 0, function* (files, { onModelLoaded, onTextureLoaded, onUnhandledFile, onFilesLoaded, onLoadError }) {
+    return __awaiter(this, arguments, void 0, function* (files, { onModelLoaded, onTextureLoaded, onSoundLoaded, onUnhandledFile, onFilesLoaded, onLoadError }) {
         yield Promise.all(files.map((file) => __awaiter(this, void 0, void 0, function* () {
             const shouldParseModel = canParseModelFile(file);
             const shouldParseTexture = canParseTextureFile(file);
+            const shouldParseSound = canParseSoundFile(file);
             if (shouldParseModel) {
                 const result = yield parseModelFromFile(file);
                 if (result.success && result.model) {
@@ -56,6 +57,19 @@ export function loadFiles(files_1, _a) {
                 console.error("Texture parse error:", result.error);
                 return;
             }
+            if (shouldParseSound) {
+                const result = yield parseSoundFromFile(file);
+                if (result.success && result.sound) {
+                    yield (onSoundLoaded === null || onSoundLoaded === void 0 ? void 0 : onSoundLoaded(result.sound, file.name, file));
+                    return;
+                }
+                if (onLoadError) {
+                    yield onLoadError(result.error, file.name, file);
+                    return;
+                }
+                console.error("Sound parse error:", result.error);
+                return;
+            }
             if (onUnhandledFile) {
                 yield onUnhandledFile(file);
             }
@@ -70,6 +84,7 @@ function createLoadHandlers(options) {
     return {
         onFilesLoaded: options.onFilesLoaded,
         onModelLoaded: options.onModelLoaded,
+        onSoundLoaded: options.onSoundLoaded,
         onTextureLoaded: options.onTextureLoaded,
         onUnhandledFile: options.onUnhandledFile,
         onLoadError: options.onLoadError,

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

@@ -1,4 +1,4 @@
 export { DragDropLoader, FilePicker, loadFiles } from "./DragDropLoader";
 export type { AssetLoadOptions, DragDropLoaderProps, FilePickerProps } from "./DragDropLoader";
-export { loadModel, loadTexture, parseModelFromFile, parseTextureFromFile } from "./modelLoader";
-export type { LoadedModel, LoadedTexture, LoadedModels, LoadedTextures, ModelLoadResult, ProgressCallback, TextureLoadResult } from "./modelLoader";
+export { loadModel, loadSound, loadTexture, parseModelFromFile, parseSoundFromFile, parseTextureFromFile } from "./modelLoader";
+export type { LoadedModel, LoadedSound, LoadedTexture, LoadedModels, LoadedSounds, LoadedTextures, ModelLoadResult, ProgressCallback, SoundLoadResult, TextureLoadResult } from "./modelLoader";

package/dist/tools/dragdrop/index.js

@@ -1,2 +1,2 @@
 export { DragDropLoader, FilePicker, loadFiles } from "./DragDropLoader";
-export { loadModel, loadTexture, parseModelFromFile, parseTextureFromFile } from "./modelLoader";
+export { loadModel, loadSound, loadTexture, parseModelFromFile, parseSoundFromFile, parseTextureFromFile } from "./modelLoader";

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

@@ -1,8 +1,10 @@
 import type { Object3D, Texture } from "three";
 export type LoadedModel = Object3D;
 export type LoadedTexture = Texture;
+export type LoadedSound = AudioBuffer;
 export type LoadedModels = Record<string, LoadedModel>;
 export type LoadedTextures = Record<string, LoadedTexture>;
+export type LoadedSounds = Record<string, LoadedSound>;
 export type ModelLoadResult = {
     success: boolean;
     model?: LoadedModel;
@@ -13,10 +15,18 @@ export type TextureLoadResult = {
     texture?: LoadedTexture;
     error?: unknown;
 };
+export type SoundLoadResult = {
+    success: boolean;
+    sound?: LoadedSound;
+    error?: unknown;
+};
 export type ProgressCallback = (filename: string, loaded: number, total: number) => void;
 export declare function canParseModelFile(file: File | string): boolean;
 export declare function canParseTextureFile(file: File | string): boolean;
+export declare function canParseSoundFile(file: File | string): boolean;
 export declare function parseModelFromFile(file: File): Promise<ModelLoadResult>;
 export declare function parseTextureFromFile(file: File): Promise<TextureLoadResult>;
+export declare function parseSoundFromFile(file: File): Promise<SoundLoadResult>;
 export declare function loadModel(filename: string, onProgress?: ProgressCallback): Promise<ModelLoadResult>;
 export declare function loadTexture(filename: string): Promise<TextureLoadResult>;
+export declare function loadSound(filename: string): Promise<SoundLoadResult>;

package/dist/tools/dragdrop/modelLoader.js

@@ -16,6 +16,21 @@ gltfLoader.setDRACOLoader(dracoLoader);
 const fbxLoader = new FBXLoader();
 const textureLoader = new TextureLoader();
 const TEXTURE_FILE_EXTENSIONS = [".png", ".jpg", ".jpeg", ".webp", ".gif", ".bmp", ".svg"];
+const SOUND_FILE_EXTENSIONS = [".mp3", ".wav", ".ogg", ".m4a"];
+let decodeAudioContext = null;
+function getAudioContext() {
+    if (typeof window === 'undefined') {
+        throw new Error('Audio loading is only supported in the browser');
+    }
+    if (!decodeAudioContext) {
+        const AudioCtx = window.AudioContext || window.webkitAudioContext;
+        if (!AudioCtx) {
+            throw new Error('Web Audio API is not available in this browser');
+        }
+        decodeAudioContext = new AudioCtx();
+    }
+    return decodeAudioContext;
+}
 function normalizeModelPath(name) {
     return name.split(/[?#]/, 1)[0].toLowerCase();
 }
@@ -38,6 +53,11 @@ export function canParseTextureFile(file) {
     const normalizedName = normalizeModelPath(filename);
     return TEXTURE_FILE_EXTENSIONS.some(extension => normalizedName.endsWith(extension));
 }
+export function canParseSoundFile(file) {
+    const filename = typeof file === "string" ? file : file.name;
+    const normalizedName = normalizeModelPath(filename);
+    return SOUND_FILE_EXTENSIONS.some(extension => normalizedName.endsWith(extension));
+}
 function parseModelBuffer(arrayBuffer, sourceName) {
     const modelFileKind = getModelFileKind(sourceName);
     if (modelFileKind === "gltf") {
@@ -89,6 +109,29 @@ export function parseTextureFromFile(file) {
         });
     });
 }
+export function parseSoundFromFile(file) {
+    return new Promise(resolve => {
+        const reader = new FileReader();
+        reader.onload = (event) => __awaiter(this, void 0, void 0, function* () {
+            var _a;
+            const arrayBuffer = (_a = event.target) === null || _a === void 0 ? void 0 : _a.result;
+            if (!arrayBuffer) {
+                resolve({ success: false, error: new Error('Failed to read file') });
+                return;
+            }
+            try {
+                const context = getAudioContext();
+                const sound = yield context.decodeAudioData(arrayBuffer.slice(0));
+                resolve({ success: true, sound });
+            }
+            catch (error) {
+                resolve({ success: false, error });
+            }
+        });
+        reader.onerror = () => resolve({ success: false, error: reader.error });
+        reader.readAsArrayBuffer(file);
+    });
+}
 export function loadModel(filename, onProgress) {
     return __awaiter(this, void 0, void 0, function* () {
         try {
@@ -141,3 +184,20 @@ export function loadTexture(filename) {
         }
     });
 }
+export function loadSound(filename) {
+    return __awaiter(this, void 0, void 0, function* () {
+        try {
+            if (!canParseSoundFile(filename)) {
+                return { success: false, error: new Error(`Unsupported file format: ${filename}`) };
+            }
+            const response = yield fetch(filename);
+            const arrayBuffer = yield response.arrayBuffer();
+            const context = getAudioContext();
+            const sound = yield context.decodeAudioData(arrayBuffer.slice(0));
+            return { success: true, sound };
+        }
+        catch (error) {
+            return { success: false, error };
+        }
+    });
+}

package/dist/tools/prefabeditor/EditorTree.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { memo, useCallback, useState } from 'react';
-import { getComponent } from './components/ComponentRegistry';
+import { getComponentDef } from './components/ComponentRegistry';
 import { base, colors, tree } from './styles';
-import { useEditorContext } from './EditorContext';
+import { useEditorContext } from './PrefabEditor';
 import { Dropdown } from './Dropdown';
 import { FileMenu, TreeContextMenu, TreeNodeMenu } from './EditorTreeMenus';
 import { usePrefabChildIds, usePrefabNode, usePrefabRootId, usePrefabStore, usePrefabStoreApi } from './prefabStore';
@@ -37,7 +37,7 @@ export default function EditorTree({ selectedId, setSelectedId, getPrefab, onRep
             components: {
                 transform: {
                     type: "Transform",
-                    properties: Object.assign({}, (_a = getComponent('Transform')) === null || _a === void 0 ? void 0 : _a.defaultProperties)
+                    properties: Object.assign({}, (_a = getComponentDef('Transform')) === null || _a === void 0 ? void 0 : _a.defaultProperties)
                 }
             }
         };
@@ -142,37 +142,13 @@ const TreeNode = memo(function TreeNode({ nodeId, depth, rootId, visibleIds, col
                                     marginRight: 4,
                                     cursor: 'pointer',
                                     visibility: hasChildren ? 'visible' : 'hidden'
-                                }, onClick: (e) => hasChildren && onToggleCollapse(e, nodeId), children: isCollapsed ? '▶' : '▼' }), !isRoot && _jsx("span", { style: { marginRight: 4, opacity: 0.4 }, children: "\u22EE\u22EE" }), _jsx("span", { style: { overflow: 'hidden', textOverflow: 'ellipsis' }, children: (_a = node.name) !== null && _a !== void 0 ? _a : node.id }), node.locked && _jsx("span", { style: { marginLeft: 6, opacity: 0.6 }, children: "\uD83D\uDD12" })] }), !isRoot && (_jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: 2 }, children: [_jsx(Dropdown, { placement: "bottom-end", trigger: ({ ref, toggle }) => (_jsx("button", { ref: ref, title: "Node Actions", style: {
-                                        background: 'none',
-                                        border: 'none',
-                                        cursor: 'pointer',
-                                        padding: '0 4px',
-                                        fontSize: 14,
-                                        opacity: 0.7,
-                                        color: 'inherit',
-                                    }, onClick: (e) => {
+                                }, onClick: (e) => hasChildren && onToggleCollapse(e, nodeId), children: isCollapsed ? '▶' : '▼' }), !isRoot && _jsx("span", { style: { marginRight: 4, opacity: 0.4 }, children: "\u22EE\u22EE" }), _jsx("span", { style: { overflow: 'hidden', textOverflow: 'ellipsis' }, children: (_a = node.name) !== null && _a !== void 0 ? _a : node.id }), node.locked && _jsx("span", { style: { marginLeft: 6, opacity: 0.6 }, children: "\uD83D\uDD12" })] }), !isRoot && (_jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: 2 }, children: [_jsx(Dropdown, { placement: "bottom-end", trigger: ({ ref, toggle }) => (_jsx("button", { ref: ref, title: "Node Actions", style: tree.iconButton, onClick: (e) => {
                                         e.stopPropagation();
                                         toggle();
-                                    }, children: "\u22EF" })), children: (close) => renderTreeNodeMenu(nodeId, false, close) }), _jsx("button", { style: {
-                                    background: 'none',
-                                    border: 'none',
-                                    cursor: 'pointer',
-                                    padding: '0 4px',
-                                    fontSize: 14,
-                                    opacity: node.disabled ? 0.5 : 0.7,
-                                    color: 'inherit',
-                                }, onClick: (e) => {
+                                    }, children: "\u22EF" })), children: (close) => renderTreeNodeMenu(nodeId, false, close) }), _jsx("button", { style: Object.assign(Object.assign({}, tree.iconButton), { opacity: node.disabled ? 0.5 : 0.7 }), onClick: (e) => {
                                     e.stopPropagation();
                                     onToggleDisabled(nodeId);
-                                }, title: node.disabled ? 'Enable' : 'Disable', children: node.disabled ? '◎' : '◉' })] })), isRoot && (_jsx(Dropdown, { placement: "bottom-end", trigger: ({ ref, toggle }) => (_jsx("button", { ref: ref, title: "Scene Actions", style: {
-                                background: 'none',
-                                border: 'none',
-                                cursor: 'pointer',
-                                padding: '0 4px',
-                                fontSize: 14,
-                                opacity: 0.7,
-                                color: 'inherit',
-                            }, onClick: (e) => {
+                                }, title: node.disabled ? 'Enable' : 'Disable', children: node.disabled ? '◎' : '◉' })] })), isRoot && (_jsx(Dropdown, { placement: "bottom-end", trigger: ({ ref, toggle }) => (_jsx("button", { ref: ref, title: "Scene Actions", style: tree.iconButton, onClick: (e) => {
                                 e.stopPropagation();
                                 toggle();
                             }, children: "\u22EF" })), children: (close) => renderTreeNodeMenu(nodeId, true, close) }))] }), !isCollapsed && childIds.map(childId => (_jsx(TreeNode, { nodeId: childId, depth: depth + 1, rootId: rootId, visibleIds: visibleIds, collapsedIds: collapsedIds, dropTarget: dropTarget, selectedNodeId: selectedNodeId, onToggleCollapse: onToggleCollapse, onOpenContextMenu: onOpenContextMenu, onDragStart: onDragStart, onDragOver: onDragOver, onDragLeave: onDragLeave, onDrop: onDrop, onDragEnd: onDragEnd, renderTreeNodeMenu: renderTreeNodeMenu, onToggleDisabled: onToggleDisabled, setSelectedId: setSelectedId }, childId)))] }));

package/dist/tools/prefabeditor/EditorTreeMenus.js

@@ -11,8 +11,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useRef, useState } from 'react';
 import { createPortal } from 'react-dom';
 import { menu } from './styles';
-import { useEditorContext } from './EditorContext';
-import { getComponent } from './components/ComponentRegistry';
+import { useEditorContext } from './PrefabEditor';
+import { getComponentDef } from './components/ComponentRegistry';
 import { loadJson, saveJson } from './utils';
 function createEmptyPrefab() {
     var _a;
@@ -25,7 +25,7 @@ function createEmptyPrefab() {
             components: {
                 transform: {
                     type: 'Transform',
-                    properties: Object.assign({}, (_a = getComponent('Transform')) === null || _a === void 0 ? void 0 : _a.defaultProperties)
+                    properties: Object.assign({}, (_a = getComponentDef('Transform')) === null || _a === void 0 ? void 0 : _a.defaultProperties)
                 }
             },
             children: []

package/dist/tools/prefabeditor/EditorUI.js

@@ -11,8 +11,9 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState } from 'react';
+import { hasComponent } from "./types";
 import EditorTree from './EditorTree';
-import { getAllComponents } from './components/ComponentRegistry';
+import { getAllComponentDefs } from './components/ComponentRegistry';
 import { base, colors, inspector, componentCard } from './styles';
 import { usePrefabStore } from './prefabStore';
 function EditorUI({ selectedId, setSelectedId, getPrefab, onReplacePrefab, onImportPrefab, basePath, onUndo, onRedo, canUndo, canRedo }) {
@@ -36,9 +37,9 @@ function EditorUI({ selectedId, setSelectedId, getPrefab, onReplacePrefab, onImp
 }
 function NodeInspector({ node, updateNode, deleteNode, basePath }) {
     var _a;
-    const ALL_COMPONENTS = getAllComponents();
+    const ALL_COMPONENTS = getAllComponentDefs();
     const allKeys = Object.keys(ALL_COMPONENTS);
-    const available = allKeys.filter(k => { var _a; return !((_a = node.components) === null || _a === void 0 ? void 0 : _a[k.toLowerCase()]); });
+    const available = allKeys.filter(k => !hasComponent(node, k));
     const [preferredAddType, setAddType] = useState(available[0] || "");
     const addType = available.includes(preferredAddType) ? preferredAddType : (available[0] || "");
     return _jsxs("div", { style: inspector.content, children: [_jsxs("div", { style: base.section, children: [_jsxs("div", { style: { display: "flex", marginBottom: 8, alignItems: 'center', gap: 8 }, children: [_jsx("div", { style: { fontSize: 10, color: colors.textDim, wordBreak: 'break-all', border: `1px solid ${colors.border}`, padding: '2px 6px', borderRadius: 3, flex: 1, fontFamily: 'monospace' }, children: node.id }), _jsx("button", { style: Object.assign(Object.assign({}, base.btn), base.btnDanger), title: "Delete Node", onClick: deleteNode, children: "\u274C" })] }), _jsx("input", { style: base.input, value: (_a = node.name) !== null && _a !== void 0 ? _a : "", placeholder: 'Node name', onChange: e => updateNode(n => (Object.assign(Object.assign({}, n), { name: e.target.value }))) })] }), _jsxs("div", { style: base.section, children: [_jsx("div", { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 8 }, children: _jsx("div", { style: base.label, children: "Components" }) }), node.components && Object.entries(node.components).map(([key, comp]) => {
@@ -48,7 +49,8 @@ function NodeInspector({ node, updateNode, deleteNode, basePath }) {
                         if (!def)
                             return _jsxs("div", { style: { color: colors.danger, fontSize: 11 }, children: ["Unknown: ", comp.type] }, key);
                         return (_jsxs("div", { style: componentCard.container, children: [_jsxs("div", { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 4 }, children: [_jsx("div", { style: { fontSize: 11, fontWeight: 500 }, children: key }), _jsx("button", { style: Object.assign(Object.assign({}, base.btn), { padding: '2px 6px' }), title: "Remove Component", onClick: () => updateNode(n => {
-                                                const _a = n.components || {}, _b = key, _ = _a[_b], rest = __rest(_a, [typeof _b === "symbol" ? _b : _b + ""]);
+                                                var _a;
+                                                const _b = (_a = n.components) !== null && _a !== void 0 ? _a : {}, _c = key, _ = _b[_c], rest = __rest(_b, [typeof _c === "symbol" ? _c : _c + ""]);
                                                 return Object.assign(Object.assign({}, n), { components: rest });
                                             }), children: "\u2715" })] }), def.Editor && (_jsx(def.Editor, { component: comp, node: node, onUpdate: (newProps) => updateNode(n => (Object.assign(Object.assign({}, n), { components: Object.assign(Object.assign({}, n.components), { [key]: Object.assign(Object.assign({}, comp), { properties: Object.assign(Object.assign({}, comp.properties), newProps) }) }) }))), basePath: basePath }))] }, key));
                     })] }), available.length > 0 && (_jsx("div", { children: _jsxs("div", { style: base.row, children: [_jsx("select", { style: Object.assign(Object.assign({}, base.input), { flex: 1 }), value: addType, onChange: e => setAddType(e.target.value), children: available.map(k => _jsx("option", { value: k, children: k }, k)) }), _jsx("button", { style: base.btn, disabled: !addType, onClick: () => {

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

@@ -13,6 +13,7 @@ export type InstanceData = {
     id: string;
     sourceId: string;
     clickable?: boolean;
+    clickEventName?: string;
     locked?: boolean;
     position: [number, number, number];
     rotation: [number, number, number];
@@ -35,6 +36,7 @@ export declare const GameInstance: React.ForwardRefExoticComponent<{
     id: string;
     sourceId?: string;
     clickable?: boolean;
+    clickEventName?: string;
     modelUrl: string;
     locked?: boolean;
     position: [number, number, number];