@needle-tools/engine 4.11.4 → 4.11.5-next.53316bf

package/src/engine/engine_context.ts

@@ -13,6 +13,7 @@ import * as Stats from 'three/examples/jsm/libs/stats.module.js';
 import type { EffectComposer as ThreeEffectComposer } from "three/examples/jsm/postprocessing/EffectComposer.js";
 import { nodeFrame } from "three/examples/jsm/renderers/webgl-legacy/nodes/WebGLNodeBuilder.js";
 
+import { initSpectorIfAvailable } from './debug/debug_spector.js';
 import { isDevEnvironment, LogType, showBalloonError, showBalloonMessage } from './debug/index.js';
 import { Addressables } from './engine_addressables.js';
 import { AnimationsRegistry } from './engine_animation.js';
@@ -37,7 +38,7 @@ import { RendererData as SceneLighting } from './engine_scenelighting.js';
 import { getTempColor, logHierarchy } from './engine_three_utils.js';
 import { Time } from './engine_time.js';
 import { patchTonemapping } from './engine_tonemapping.js';
-import type { CoroutineData, ICamera, IComponent, IContext, ILight, LoadedModel, Model, Vec2 } from "./engine_types.js";
+import type { CoroutineData, ICamera, IComponent, IContext, ILight, LoadedModel, Model, SourceIdentifier, Vec2 } from "./engine_types.js";
 import { deepClone, delay, DeviceUtilities, getParam } from './engine_utils.js';
 import type { INeedleXRSessionEventReceiver, NeedleXRSession } from './engine_xr.js';
 import { NeedleMenu } from './webcomponents/needle menu/needle-menu.js';
@@ -129,9 +130,12 @@ export function registerComponent(script: IComponent, context?: Context) {
 }
 
 /**
- * The context is the main object that holds all the data and state of the Needle Engine.  
- * It can be used to access the scene, renderer, camera, input, physics, networking, and more.
- * @example
+ * The Needle Engine context is the main access point that holds all the data and state of a Needle Engine application. 
+ * It can be used to access the {@link Context.scene}, {@link Context.renderer}, {@link Context.mainCamera}, {@link Context.input}, {@link Context.physics}, {@link Context.time}, {@link Context.connection} (networking), and more.
+ * 
+ * The context is automatically created when using the `<needle-engine>` web component.  
+ * 
+ * @example Accessing the context from a [component](https://engine.needle.tools/docs/api/Behaviour):
  * ```typescript
  * import { Behaviour } from "@needle-tools/engine";
  * import { Mesh, BoxGeometry, MeshBasicMaterial } from "three";
@@ -142,6 +146,18 @@ export function registerComponent(script: IComponent, context?: Context) {
  *   }
  * }
  * ```
+ * 
+ * @example Accessing the context from a [hook](https://engine.needle.tools/docs/scripting.html#hooks) without a component e.g. from a javascript module or svelte or react component.
+ * 
+ * ```typescript
+ * import { onStart } from "@needle-tools/engine";
+ * 
+ * onStart((context) => {
+ *   console.log("Hello from onStart hook");
+ *   context.scene.add(new Mesh(new BoxGeometry(), new MeshBasicMaterial()));
+ * });
+ * ```
+ * 
  */
 export class Context implements IContext {
 
@@ -357,6 +373,7 @@ export class Context implements IContext {
 	 */
 	composer: EffectComposer | ThreeEffectComposer | null = null;
 
+	// #region internal script lists
 	/**
 	 * @internal All known components. Don't use directly
 	 */
@@ -424,6 +441,9 @@ export class Context implements IContext {
 	/** @internal */
 	readonly new_scripts_xr: INeedleXRSessionEventReceiver[] = [];
 
+	// #endregion
+	// #region Properties
+
 	/** 
 	 * The **main camera component** of the scene - this camera is used for rendering.  
 	 * Use `setCurrentCamera` for updating the main camera.
@@ -468,25 +488,36 @@ export class Context implements IContext {
 	physics: Physics;
 	/** access networking methods (use it to send or listen to messages or join a networking backend) */
 	connection: NetworkConnection;
-	/** 
-	 * @deprecated AssetDataBase is deprecated
-	 */
+	/**  @deprecated AssetDatabase is deprecated */
 	assets: AssetDatabase;
 	/** The main light in the scene */
 	mainLight: ILight | null = null;
 	/** @deprecated Use sceneLighting */
 	get rendererData() { return this.sceneLighting }
+	/** Access the scene lighting manager to control lighting settings in the context */
 	sceneLighting: SceneLighting;
 	addressables: Addressables;
 	lightmaps: ILightDataRegistry;
 	players: PlayerViewManager;
+
+	/** Access the LODs manager to control LOD behavior in the context */
 	readonly lodsManager: LODsManager;
 	/** Access the needle menu to add or remove buttons to the menu element */
 	readonly menu: NeedleMenu;
 
-	/** @returns true if the context is fully created and ready */
+	/** 
+	 * Checks if the context is fully created and ready
+	 * @returns true if the context is fully created and ready 
+	 */
 	get isCreated() { return this._isCreated; }
 
+	/** 
+	 * The source identifier(s) of the root scene(s) loaded into this context.
+	 * When using `<needle-engine>` web component this will be the `src` attribute(s).
+	 * @returns The source identifier for of the root scene
+	*/
+	get rootSourceId(): SourceIdentifier | undefined { return this.rootSceneSourceIdentifiers[0] || undefined; }
+
 	private _needsUpdateSize: boolean = false;
 	private _isCreated: boolean = false;
 	private _isCreating: boolean = false;
@@ -541,6 +572,7 @@ export class Context implements IContext {
 		ContextRegistry.register(this);
 	}
 
+	// #region Renderer
 	/** 
 	 * Calling this function will dispose the current renderer and create a new one which will then be assigned to the context. It can be used to create a new renderer with custom WebGLRendererParameters.   
 	 * **Note**: Instead you can also modify the static `Context.DefaultWebGlRendererParameters` before the context is created.  
@@ -591,6 +623,8 @@ export class Context implements IContext {
 
 		this.input.bindEvents();
 
+		initSpectorIfAvailable(this, this.renderer.domElement);
+
 		return this.renderer;
 	}
 
@@ -894,6 +928,7 @@ export class Context implements IContext {
 		}
 	}
 
+	// #region onBeforeRender / onAfterRender listeners
 	private readonly _onBeforeRenderListeners = new Map<string, OnRenderCallback[]>();
 	private readonly _onAfterRenderListeners = new Map<string, OnRenderCallback[]>();
 
@@ -991,6 +1026,8 @@ export class Context implements IContext {
 	private _lastStyleComputedResult: boolean | undefined = undefined;
 
 	private _createId: number = 0;
+
+	// #region internal create
 	private async internalOnCreate(opts?: ContextCreateArgs): Promise<boolean> {
 		const createId = ++this._createId;
 
@@ -1200,6 +1237,11 @@ export class Context implements IContext {
 		if (opts?.abortSignal?.aborted) {
 			return false;
 		}
+
+
+		const mainIdentifier = this.rootSourceId;
+		if (mainIdentifier) this.sceneLighting.enable(mainIdentifier);
+
 		invokeLifecycleFunctions(this, ContextEvent.ContextCreated);
 		if (debug) console.log("Context Created...", this.renderer, this.renderer.domElement)
 
@@ -1209,13 +1251,18 @@ export class Context implements IContext {
 		return true;
 	}
 
+
+	private readonly rootSceneSourceIdentifiers: SourceIdentifier[] = [];
 	private async internalLoadInitialContent(createId: number, args: ContextCreateArgs): Promise<Array<LoadedModel>> {
+		this.rootSceneSourceIdentifiers.length = 0;
+
 		const results = new Array<LoadedModel>();
 		// early out if we dont have any files to load
 		if (args.files.length === 0) return results;
 
-
 		const files = [...args.files];
+		this.rootSceneSourceIdentifiers.push(...files);
+
 		const progressArg: LoadingProgressArgs = {
 			name: "",
 			progress: null!,
@@ -1223,6 +1270,7 @@ export class Context implements IContext {
 			count: files.length
 		}
 
+
 		const loader = getLoader();
 		// this hash should be constant since it is used to initialize the UIDProvider per initially loaded scene
 		const loadingHash = 0;
@@ -1661,7 +1709,8 @@ export class Context implements IContext {
 
 		if (this._stats) {
 			this._stats.end();
-			if (this.time.frameCount % 150 === 0)
+			const dt = this.time.fps < 20 ? 50 : 150;
+			if (this.time.frameCount % dt === 0)
 				console.log(this.renderer.info.render.calls + " DrawCalls", "\nRender:", { ...this.renderer.info.render }, "\nMemory:", { ...this.renderer.info.memory }, "\nTarget Framerate: " + this.targetFrameRate);
 		}
 

package/src/engine/engine_loaders.ts

@@ -13,7 +13,7 @@ import { registerPrewarmObject } from "./engine_mainloop_utils.js";
 import { SerializationContext } from "./engine_serialization_core.js";
 import { Context } from "./engine_setup.js"
 import { postprocessFBXMaterials } from "./engine_three_utils.js";
-import { CustomModel, isGLTFModel, Model, type UIDProvider } from "./engine_types.js";
+import { CustomModel, isGLTFModel, Model, SourceIdentifier, type UIDProvider } from "./engine_types.js";
 import * as utils from "./engine_utils.js";
 import { tryDetermineMimetypeFromURL } from "./engine_utils_format.js"
 import { invokeLoadedImportPluginHooks, registerComponentExtension, registerExtensions } from "./extensions/extensions.js";
@@ -43,7 +43,7 @@ const debugFileTypes = utils.getParam("debugfileformat");
 
 
 
-export async function onCreateLoader(url: string, context: Context): Promise<CustomLoader | GLTFLoader | FBXLoader | USDZLoader | OBJLoader | null> {
+async function onCreateLoader(url: string, context: Context, sourceId: SourceIdentifier): Promise<CustomLoader | GLTFLoader | FBXLoader | USDZLoader | OBJLoader | null> {
 
     const type = await tryDetermineMimetypeFromURL(url, { useExtension: true }) || "unknown";
     if (debugFileTypes) console.debug(`Determined file type: '${type}' for url '${url}'`, { registeredModelLoaderCallbacks });
@@ -67,7 +67,7 @@ export async function onCreateLoader(url: string, context: Context): Promise<Cus
             {
                 console.warn(`Unknown file type (${type}). Needle Engine will fallback to the GLTFLoader - To support more model formats please create a Needle loader plugin.\nUse import { NeedleEngineModelLoader } from \"@needle-tools/engine\" namespace to register your loader.`, url);
                 const loader = new GLTFLoader();
-                await registerExtensions(loader, context, url);
+                await registerExtensions(loader, context, url, sourceId);
                 return loader;
             }
         case "model/fbx":
@@ -88,7 +88,7 @@ export async function onCreateLoader(url: string, context: Context): Promise<Cus
         case "model/vrm":
             {
                 const loader = new GLTFLoader();
-                await registerExtensions(loader, context, url);
+                await registerExtensions(loader, context, url, sourceId);
                 return loader;
             }
     }
@@ -117,7 +117,7 @@ export async function parseSync(context: Context, data: string | ArrayBuffer, pa
         path = "";
     }
     if (printGltf) console.log("Parse glTF", path)
-    const loader = await onCreateLoader(path, context);
+    const loader = await onCreateLoader(path, context, path);
     if (!loader) {
         return undefined;
     }
@@ -193,7 +193,7 @@ export async function loadSync(context: Context, url: string, sourceId: string,
     // but due to the async nature and potentially triggering multiple loads at the same time
     // we need to make sure the extensions dont override each other
     // creating new loaders should not be expensive as well
-    const loader = await onCreateLoader(url, context);
+    const loader = await onCreateLoader(url, context, sourceId);
     if (!loader) {
         return undefined;
     }

package/src/engine/engine_physics.ts

@@ -13,6 +13,7 @@ import type { IPhysicsEngine } from './engine_types.js';
 import { getParam } from "./engine_utils.js"
 
 const debugPhysics = getParam("debugphysics");
+const debugWorker = getParam("debugworker");
 const layerMaskHelper: Layers = new Layers();
 
 
@@ -654,6 +655,9 @@ namespace NEMeshBVH {
                     // if there are no workers available, create a new one
                     if (!workerInstance && workerInstances.length < 3) {
                         try {
+                            if (debugWorker) {
+                                console.warn("[GenerateMeshBVHWorker] Creating worker with import.meta.url:", import.meta.url);
+                            }
                             workerInstance = new _GenerateMeshBVHWorker();
                             workerInstances.push(workerInstance);
                         }
@@ -665,8 +669,8 @@ namespace NEMeshBVH {
                                 failedToCreateMeshBVHWorker += 10;
                             }
                             else {
-                                console.error("Failed to create MeshBVH worker");
-                                console.debug(err);
+                                console.error("Failed to create MeshBVH worker. Please see below for more details:");
+                                console.log(err);
                             }
                             failedToCreateMeshBVHWorker++;
                         }

package/src/engine/engine_physics_rapier.ts

@@ -67,7 +67,7 @@ export class RapierPhysics implements IPhysicsEngine {
     debugRenderRaycasts: boolean = false;
 
     removeBody(obj: IComponent) {
-        if(debugPhysics) console.log("REMOVE BODY", obj?.name, obj[$bodyKey]);
+        if (debugPhysics) console.log("REMOVE BODY", obj?.name, obj[$bodyKey]);
         if (!obj) return;
         this.validate();
         const body = obj[$bodyKey];
@@ -817,7 +817,16 @@ export class RapierPhysics implements IPhysicsEngine {
         return component;
     }
 
-    private createCollider(collider: ICollider, desc: ColliderDesc) {
+    /**
+     * Creates a collider in the physics world.
+     * 
+     * @param collider - The collider component.
+     * @param desc - The collider description.
+     * @returns The created collider.
+     * 
+     * @throws Will throw an error if the physics world is not initialized. Make sure to call `initialize()` before creating colliders.  
+     */
+    createCollider(collider: ICollider, desc: ColliderDesc) {
         if (!this.world) throw new Error("Physics world not initialized");
         const matrix = this._tempMatrix;
         let rigidBody: RigidBody | undefined = undefined;

package/src/engine/engine_scenelighting.ts

@@ -1,4 +1,4 @@
-import { EquirectangularReflectionMapping, LightProbe, SphericalHarmonics3, SRGBColorSpace,Texture, Vector4, WebGLCubeRenderTarget } from "three";
+import { EquirectangularReflectionMapping, LightProbe, Source, SphericalHarmonics3, SRGBColorSpace, Texture, Vector4, WebGLCubeRenderTarget } from "three";
 
 import { AssetReference } from "./engine_addressables.js";
 import { Context } from "./engine_setup.js";
@@ -44,9 +44,16 @@ export class RendererData {
         this.context.pre_update_callbacks.push(this.preUpdate.bind(this))
     }
 
+    /**
+     * The id of the currently active scene light settings (source identifier).
+     */
     private _currentLightSettingsId?: SourceIdentifier;
     private _sceneLightSettings?: Map<SourceIdentifier, SceneLightSettings>;
 
+    get currentLightSettingsId(): SourceIdentifier | undefined {
+        return this._currentLightSettingsId;
+    }
+
     private preUpdate() {
         const time = this.context.time;
         this._timevec4.x = time.time;
@@ -82,11 +89,11 @@ export class RendererData {
 
     /** set the scene lighting from a specific scene. Will disable any previously enabled lighting settings */
     enable(sourceId: SourceIdentifier | AssetReference) {
-        if(sourceId instanceof AssetReference)
+        if (sourceId instanceof AssetReference)
             sourceId = sourceId.url;
         const settings = this._sceneLightSettings?.get(sourceId);
         if (!settings) {
-            if(debug) console.warn("No light settings found for", sourceId);
+            if (debug) console.warn("No light settings found for", sourceId);
             return false;
         }
         if (debug) console.log("Enable scene light settings", sourceId, settings);
@@ -100,7 +107,7 @@ export class RendererData {
 
     /** disable the lighting of a specific scene, will only have any effect if it is currently active */
     disable(sourceId: SourceIdentifier | AssetReference) {
-        if(sourceId instanceof AssetReference)
+        if (sourceId instanceof AssetReference)
             sourceId = sourceId.url;
         if (sourceId === null || sourceId === undefined) return false;
         const settings = this._sceneLightSettings?.get(sourceId);
@@ -112,8 +119,22 @@ export class RendererData {
         return true;
     }
 
-    /** Disables the currently active scene lighting (if any), returns the id of the previously active lighting */
-    disableCurrent() : SourceIdentifier | null {
+    /**
+     * Enables the currently active scene lighting (if any), returns the id of the enabled lighting.
+     * @returns The id of the enabled lighting, or null if no lighting is currently active.
+     */
+    enableCurrent(): SourceIdentifier | null {
+        if (this._currentLightSettingsId) {
+            this.enable(this._currentLightSettingsId);
+            return this._currentLightSettingsId ?? null;
+        }
+        return null;
+    }
+
+    /** Disables the currently active scene lighting (if any), returns the id of the previously active lighting
+     * @returns The id of the previously active lighting, or null if no lighting was active.
+     */
+    disableCurrent(): SourceIdentifier | null {
         if (this._currentLightSettingsId) {
             const prev = this._currentLightSettingsId;
             this.disable(this._currentLightSettingsId);
@@ -162,7 +183,7 @@ export class RendererData {
     private __currentReflectionId: SourceIdentifier | null = null;
 
     /** @internal */
-    internalEnableReflection(sourceId: SourceIdentifier) : Texture | null {
+    internalEnableReflection(sourceId: SourceIdentifier): Texture | null {
         this.__currentReflectionId = sourceId;
         const settings = this._sceneLightSettings?.get(sourceId);
 
@@ -181,6 +202,7 @@ export class RendererData {
                     const tex = existing.Source;
                     tex.mapping = EquirectangularReflectionMapping;
                     scene.environment = tex;
+                    scene.environmentIntensity = this.environmentIntensity || 1;
                     return tex;
                 }
                 else if (debug) console.warn("Could not find reflection for source", sourceId);
@@ -216,7 +238,7 @@ export class RendererData {
     /** @internal */
     internalDisableReflection(sourceId?: SourceIdentifier) {
         if (sourceId && sourceId !== this.__currentReflectionId) {
-            if(debug) console.log("Not disabling reflection for", sourceId, "because it is not the current light settings id", this.__currentReflectionId)
+            if (debug) console.log("Not disabling reflection for", sourceId, "because it is not the current light settings id", this.__currentReflectionId)
             return;
         }
         if (debug) console.log("Disable reflection", sourceId)

package/src/engine/engine_texture.ts

@@ -1,6 +1,6 @@
 import type { EffectComposer } from "postprocessing";
 import { Camera, Mesh, Object3D, Texture, WebGLRenderer, WebGLRenderTarget } from "three";
-import type { EffectComposer as ThreeEffectComposer } from "three/examples/jsm/postprocessing/EffectComposer";
+import type { EffectComposer as ThreeEffectComposer } from "three/examples/jsm/postprocessing/EffectComposer.js";
 
 import { findResourceUsers } from "./engine_assetdatabase.js";
 

package/src/engine/engine_tonemapping.ts

@@ -1,7 +1,7 @@
 import { ACESFilmicToneMapping, AgXToneMapping, NeutralToneMapping, NoToneMapping, ShaderChunk, ToneMapping } from "three";
 
 import { isDevEnvironment } from "./debug/index.js";
-import type { Context } from "./engine_setup";
+import type { Context } from "./engine_setup.js";
 
 let patchedTonemapping = false;
 export function patchTonemapping(_ctx?: Context) {

package/src/engine/engine_types.ts

@@ -566,6 +566,23 @@ export interface IPhysicsEngine {
      */
     boxOverlap(point: Vector3, size: Vector3, rotation: Vector4Like | null): Array<ShapeOverlapResult>;
 
+    /**
+     * Creates a collider in the physics world.
+     * 
+     * @param collider - The collider component.
+     * @param desc - The collider description.
+     * @returns The created collider.
+     * 
+     * @throws Will throw an error if the physics world is not initialized. Make sure to call `initialize()` before creating colliders.
+     * 
+     * @example
+     * ```typescript
+     * const boxColliderDesc = NEEDLE_ENGINE_MODULES.RAPIER_PHYSICS.MODULE.ColliderDesc.cuboid(1, 1, 1);
+     * const collider = physicsEngine.createCollider(myBoxColliderComponent, boxColliderDesc);
+     * ```
+     */
+    createCollider(collider: ICollider, desc: any): any;
+
     // Collider methods
     /**
      * Adds a sphere collider to the physics world

package/src/engine/engine_typestore.ts

@@ -7,6 +7,7 @@ declare type Type = new (...args: any[]) => any;
 class _TypeStore {
 
     private _types: Map<string, Type> = new Map();
+    private _reverseTypes: Map<Type, string> = new Map();
 
     constructor() {
         if (debug) console.warn("TypeStore: Created", this);
@@ -18,8 +19,10 @@ class _TypeStore {
     public add(key: string, type: Type) {
         if (debug) console.warn("ADD TYPE", key);
         const existing = this._types.get(key);
-        if (!existing)
+        if (!existing) {
             this._types.set(key, type);
+            this._reverseTypes.set(type, key);
+        }
         else {
             if (debug) {
                 if (existing !== type) {
@@ -40,11 +43,7 @@ class _TypeStore {
      * @returns the key/name for the given type if registered
      */
     public getKey(type: Type): string | null {
-        for (const [key, value] of this._types) {
-            if (value === type)
-                return key;
-        }
-        return null;
+        return this._reverseTypes.get(type) || null;
     }
 }
 

package/src/engine/engine_utils_qrcode.ts

@@ -166,7 +166,7 @@ async function internalRenderQRCodeOverlays(canvas: HTMLCanvasElement, args: { s
         haveLogo = await new Promise((resolve, _reject) => {
             image.onload = () => resolve(true);
             image.onerror = (err) => {
-                let errorUrl = logoSrc !== needleLogoOnlySVG ? "'" + logoSrc + "'" : null;
+                const errorUrl = logoSrc !== needleLogoOnlySVG ? "'" + logoSrc + "'" : null;
                 console.error("[QR Code] Error loading logo image for QR code", errorUrl, isDevEnvironment() ? err : "");
                 resolve(false);
             };

package/src/engine/extensions/NEEDLE_components.ts

@@ -2,12 +2,13 @@ import { Object3D } from "three";
 import { GLTFExporter } from 'three/examples/jsm/exporters/GLTFExporter.js';
 import { type GLTF, type GLTFLoaderPlugin, GLTFParser } from "three/examples/jsm/loaders/GLTFLoader.js";
 
+import { isDevEnvironment } from "../debug/debug.js";
 import { builtinComponentKeyName } from "../engine_constants.js";
 import { debugExtension } from "../engine_default_parameters.js";
 import { getLoader } from "../engine_gltf.js";
 import { type NodeToObjectMap, type ObjectToNodeMap, SerializationContext } from "../engine_serialization_core.js";
 import { apply } from "../js-extensions/index.js";
-import { maskGltfAssociation,resolveReferences } from "./extension_utils.js";
+import { maskGltfAssociation, resolveReferences } from "./extension_utils.js";
 
 export const debug = debugExtension
 const componentsArrayExportKey = "$___Export_Components";
@@ -15,7 +16,7 @@ const componentsArrayExportKey = "$___Export_Components";
 export const EXTENSION_NAME = "NEEDLE_components";
 
 class ExtensionData {
-    [builtinComponentKeyName]?: Array<object | null>
+    [builtinComponentKeyName]?: Array<Record<string, any> | null>
 }
 
 class ExportData {
@@ -35,14 +36,7 @@ export class NEEDLE_components implements GLTFLoaderPlugin {
     get name(): string {
         return EXTENSION_NAME;
     }
-
-    // import
-    parser?: GLTFParser;
-    nodeToObjectMap: NodeToObjectMap = {};
-    /** The loaded gltf */
-    gltf: GLTF | null = null;
-
-    // export
+    // #region export
     exportContext!: { [nodeIndex: number]: ExportData };
     objectToNodeMap: ObjectToNodeMap = {};
     context!: SerializationContext;
@@ -112,7 +106,7 @@ export class NEEDLE_components implements GLTFLoaderPlugin {
 
     writeNode(node: Object3D, nodeDef) {
         const nodeIndex = this.writer.json.nodes.length;
-        if (debug) 
+        if (debug)
             console.log(node.name, nodeIndex, node.uuid);
         const context = new ExportData(node, nodeIndex, nodeDef);
         this.exportContext[nodeIndex] = context;
@@ -158,8 +152,13 @@ export class NEEDLE_components implements GLTFLoaderPlugin {
 
 
     // -------------------------------------
-    // LOADING 
-    // called by GLTFLoader
+    // #region import 
+    parser?: GLTFParser;
+    nodeToObjectMap: NodeToObjectMap = {};
+    /** The loaded gltf */
+    gltf: GLTF | null = null;
+
+
     beforeRoot() {
         if (debug)
             console.log("BEGIN LOAD");
@@ -167,7 +166,6 @@ export class NEEDLE_components implements GLTFLoaderPlugin {
         return null;
     }
 
-    // called by GLTFLoader
     async afterRoot(result: GLTF): Promise<void> {
         this.gltf = result;
 
@@ -175,8 +173,7 @@ export class NEEDLE_components implements GLTFLoaderPlugin {
         const ext = parser?.extensions;
         if (!ext) return;
         const hasExtension = ext[this.name];
-        if (debug)
-            console.log("After root", result, this.parser, ext);
+        if (debug) console.log("After root", result, this.parser, ext);
 
         const loadComponents: Array<Promise<void>> = [];
         if (hasExtension === true) {
@@ -204,7 +201,7 @@ export class NEEDLE_components implements GLTFLoaderPlugin {
 
                     apply(obj);
 
-                    loadComponents.push(this.createComponents(obj, data));
+                    loadComponents.push(this.createComponents(result, node, obj, data));
                 }
             }
         }
@@ -220,7 +217,7 @@ export class NEEDLE_components implements GLTFLoaderPlugin {
         }
     }
 
-    private async createComponents(obj: Object3D, data: ExtensionData) {
+    private async createComponents(result: GLTF, node: Node, obj: Object3D, data: ExtensionData) {
         if (!data) return;
         const componentData = data[builtinComponentKeyName];
         if (componentData) {
@@ -228,20 +225,42 @@ export class NEEDLE_components implements GLTFLoaderPlugin {
             if (debug)
                 console.log(obj.name, componentData);
             for (const i in componentData) {
-                const serializedData = componentData[i];
-                if (debug)
-                    console.log("Serialized data", JSON.parse(JSON.stringify(serializedData)));
+                const data = componentData[i];
+
+                if (debug) console.log("Serialized data", JSON.parse(JSON.stringify(data)));
+
+                // Fix for https://linear.app/needle/issue/NE-6779/blender-export-has-missing-sharedmaterials
+                if (data?.name === "MeshRenderer" || data?.name === "SkinnedMeshRenderer") {
+                    if (!data.sharedMaterials) {
+                        let success = false;
+                        if ("mesh" in node) {
+                            const meshIndex = node.mesh;
+                            if (typeof meshIndex === "number" && result.parser) {
+                                const meshDef = result.parser.json.meshes?.[meshIndex];
+                                if (meshDef?.primitives) {
+                                    data.sharedMaterials =  meshDef.primitives.map(prim => {
+                                        return "/materials/" + (prim.material ?? 0);
+                                    });
+                                    success = true;
+                                }
+                            }
+                        }
+                        if(!success && (debug || isDevEnvironment())) {
+                            console.warn(`[NEEDLE_components] Component '${data.name}' on object '${obj.name}' is not added to a mesh or failed to retrieve materials from glTF.`);
+                        }
+                    }
+                }
 
-                if (serializedData && this.parser) {
+                if (data && this.parser) {
                     tasks.push(
-                        resolveReferences(this.parser, serializedData)
-                            .catch(e => console.error(`Error while resolving references (see console for details)\n`, e, obj, serializedData))
+                        resolveReferences(this.parser, data)
+                            .catch(e => console.error(`Error while resolving references (see console for details)\n`, e, obj, data))
                     );
                 }
 
                 obj.userData = obj.userData || {};
                 obj.userData[builtinComponentKeyName] = obj.userData[builtinComponentKeyName] || [];
-                obj.userData[builtinComponentKeyName].push(serializedData);
+                obj.userData[builtinComponentKeyName].push(data);
             }
             await Promise.all(tasks).catch((e) => {
                 console.error("Error while loading components", e);
@@ -266,4 +285,6 @@ export class NEEDLE_components implements GLTFLoaderPlugin {
     //     // console.log(components);
     //     return null;
     // }
-}
+}
+
+

package/src/engine/extensions/NEEDLE_lightmaps.ts

@@ -95,8 +95,8 @@ export class NEEDLE_lightmaps implements GLTFLoaderPlugin {
                     }
                     const results = await PromiseAllWithErrors(dependencies);
                     if (results?.anyFailed) {
-                        if (isDevEnvironment())
-                            console.error("Failed to load lightmap extension", results);
+                        if (isDevEnvironment() || debug)
+                            console.error("[NEEDLE_lightmaps]Error during extension loading:", results);
                     }
                     resolve();
                 });