@needle-tools/engine 4.11.4 → 4.11.5-next.4201116

package/src/engine-components/Renderer.ts

@@ -69,7 +69,7 @@ class SharedMaterialArray implements ISharedMaterials {
     set changed(value: boolean) {
         if (value === true) {
             if (debugRenderer)
-                console.warn("SharedMaterials have changed: " + this._renderer.name, this);
+                console.warn("SharedMaterials have changed: " + this._renderer.name);
         }
         this._changed = value;
     }
@@ -358,11 +358,15 @@ export class Renderer extends Behaviour implements IRenderer {
     //@ts-ignore
     get sharedMaterials(): SharedMaterialArray {
 
-        // @ts-ignore (original materials will be set during deserialization)
-        if (this._originalMaterials === undefined) return null;
-
-        // @ts-ignore during deserialization code might access this property *before* the setter and then create an empty array
-        if (this.__isDeserializing === true) return null;
+        if (this._originalMaterials === undefined) {
+            if (!this.__didAwake) {
+                // @ts-ignore (original materials will be set during deserialization)
+                return null;
+            }
+            else {
+                this._originalMaterials = [];
+            }
+        }
 
         if (!this._sharedMaterials || !this._sharedMaterials.is(this)) {
             if (!this._originalMaterials) this._originalMaterials = [];
@@ -454,6 +458,7 @@ export class Renderer extends Behaviour implements IRenderer {
             this.context.addBeforeRenderListener(this.gameObject, this.onBeforeRenderThree);
         }
 
+        this._lightmaps = undefined;
         this.applyLightmapping();
 
         if (showWireframe) {
@@ -468,8 +473,8 @@ export class Renderer extends Behaviour implements IRenderer {
     }
 
     private applyLightmapping() {
-        if (this.lightmapIndex >= 0) {
-            const type = this.gameObject.type;
+        if (this.lightmapIndex >= 0 && !this._lightmaps) {
+            // const type = this.gameObject.type;
 
             // use the override lightmap if its not undefined
             const tex = this._lightmapTextureOverride !== undefined
@@ -477,45 +482,12 @@ export class Renderer extends Behaviour implements IRenderer {
                 : this.context.lightmaps.tryGetLightmap(this.sourceId, this.lightmapIndex);
             if (tex) {
                 if (!this._lightmaps) this._lightmaps = [];
-
-
                 const rm = new RendererLightmap(this);
                 rm.init(this.lightmapIndex, this.lightmapScaleOffset, tex);
                 this._lightmaps.push(rm);
-
-                // if (type === "Mesh") {
-                //     const mat = this.gameObject["material"];
-                //     if (!mat?.isMeshBasicMaterial) {
-                //         if (this._lightmaps.length <= 0) {
-                //         }
-                //         const rm = this._lightmaps[0];
-                //         rm.init(this.lightmapIndex, this.lightmapScaleOffset, tex);
-                //     }
-                //     else {
-                //         if (mat)
-                //             console.warn("Lightmapping is not supported on MeshBasicMaterial", mat.name)
-                //     }
-                // }
-                // // for multi materials we need to loop through children 
-                // // and then we add a lightmap renderer component to each of them
-                // else if (this.isMultiMaterialObject(this.gameObject) && this.sharedMaterials.length > 0) {
-                //     for (let i = 0; i < this.gameObject.children.length; i++) {
-                //         const child = this.gameObject.children[i];
-                //         if (!child["material"]?.isMeshBasicMaterial) {
-                //             let rm: RendererLightmap | undefined = undefined;
-                //             if (i >= this._lightmaps.length) {
-                //                 rm = new RendererLightmap(child as Mesh, this.context);
-                //                 this._lightmaps.push(rm);
-                //             }
-                //             else
-                //                 rm = this._lightmaps[i];
-                //             rm.init(this.lightmapIndex, this.lightmapScaleOffset, tex);
-                //         }
-                //     }
-                // }
             }
             else {
-                if (debugRenderer) console.warn("Lightmap not found", this.sourceId, this.lightmapIndex);
+                if (debugRenderer) console.warn(`[Renderer] No lightmaps found ${this.name} (${this.sourceId}, ${this.lightmapIndex})`);
             }
         }
 
@@ -730,7 +702,6 @@ export class Renderer extends Behaviour implements IRenderer {
                 // If the material has a envMap and is NOT using a reflection probe we set the envMap to the scene environment
                 if (mat && "envMap" in mat && "envMapIntensity" in mat && !ReflectionProbe.isUsingReflectionProbe(mat)) {
                     mat.envMap = this.context.scene.environment;
-                    mat.envMapIntensity = this.context.scene.environmentIntensity;
                     mat.envMapRotation = this.context.scene.environmentRotation;
                 }
             }
@@ -741,8 +712,9 @@ export class Renderer extends Behaviour implements IRenderer {
     private onBeforeRenderThree = (_renderer, _scene, _camera, _geometry, material, _group) => {
         if (material.envMapIntensity !== undefined) {
             const factor = this.hasLightmap ? Math.PI : 1;
-            const environmentIntensity = this.context.mainCameraComponent?.environmentIntensity ?? 1;
+            const environmentIntensity = this.context.scene.environmentIntensity;
             material.envMapIntensity = Math.max(0, environmentIntensity * this.context.sceneLighting.environmentIntensity / factor);
+            // console.log(this.context.sceneLighting.environmentIntensity);
         }
         if (this._lightmaps) {
             for (const lm of this._lightmaps) {

package/src/engine-components/RendererInstancing.ts

@@ -29,8 +29,9 @@ export class InstancingHandler {
      * (The instancing mesh renderer will grow x2 if the max instance count is reached)
      * @default 4
      * @returns The initial instance count
-     * */
-    static getStartInstanceCount = (_obj: Object3D) => {
+     */
+    // @ts-ignore (ignore the unused parameter warning)
+    static getStartInstanceCount = (obj: Object3D) => {
         return 4;
     };
 
@@ -45,20 +46,24 @@ export class InstancingHandler {
         if (res) {
             if (handlesArray === null) handlesArray = [];
             handlesArray.push(res);
-            // load texture lods
-            NEEDLE_progressive.assignTextureLOD(res.renderer.material, 0);
-
-            // Load mesh lods
-            // TODO: technically for multi meshes we do this work multiple times (we search for meshes in children and then use the renderer sharedMeshes... that doesnt make sense)
-            for (let i = 0; i < renderer.sharedMeshes.length; i++) {
-                const mesh = renderer.sharedMeshes[i];
-                const geometry = mesh.geometry;
-                NEEDLE_progressive.assignMeshLOD(mesh, 0).then(lod => {
-                    if (lod && renderer.activeAndEnabled && geometry != lod) {
-                        res.setGeometry(lod);
-                    }
-                });
+
+            // Load LOD for textures
+            const mat = res.object.material;
+            if(Array.isArray(mat)) {
+                mat.forEach(m => NEEDLE_progressive.assignTextureLOD(m, 0));
+            }
+            else {
+                NEEDLE_progressive.assignTextureLOD(mat, 0);
             }
+
+            // Load LOD for geometry
+            const mesh = res.object;
+            const geometry = mesh.geometry;
+            NEEDLE_progressive.assignMeshLOD(mesh, 0).then(lod => {
+                if (lod && geometry != lod) {
+                    res.setGeometry(lod);
+                }
+            });
         }
 
         else if (level <= 0 && obj.type !== "Mesh") {
@@ -349,7 +354,7 @@ class InstancedMeshRenderer {
     private _context: Context;
     private _batchedMesh: BatchedMesh;
     private _handles: (InstanceHandle | null)[] = [];
-    private readonly _geometryIds: Map<BufferGeometry, number> = new Map();
+    private _geometryIds = new WeakMap<BufferGeometry, number>();
     private _maxInstanceCount: number;
 
     private _currentInstanceCount = 0;
@@ -439,6 +444,10 @@ class InstancedMeshRenderer {
     private _needUpdateBounds: boolean = false;
     private _debugMaterial: MeshStandardMaterial | null = null;
 
+    private getBatchedMeshName() {
+        return this.name ? `${this.name} (BatchedMesh)` : "BatchedMesh";
+    }
+
     constructor(name: string, geo: BufferGeometry, material: Material, initialMaxCount: number, context: Context) {
         this.name = name;
         this.geometry = geo;
@@ -452,6 +461,7 @@ class InstancedMeshRenderer {
         this._maxVertexCount = estimate.vertexCount;
         this._maxIndexCount = estimate.indexCount;
         this._batchedMesh = new BatchedMesh(this._maxInstanceCount, this._maxVertexCount, this._maxIndexCount, this._debugMaterial ?? this.material);
+        this._batchedMesh.name = this.getBatchedMeshName();
         // this.inst = new InstancedMesh(geo, material, count);
         this._batchedMesh[$instancingAutoUpdateBounds] = true;
         // this.inst.count = 0;
@@ -475,7 +485,7 @@ class InstancedMeshRenderer {
         context.post_render_callbacks.push(this.onAfterRender);
 
         if (debugInstancing) {
-            console.log(`Instanced renderer created with ${this._maxInstanceCount} instances, ${this._maxVertexCount} max vertices and ${this._maxIndexCount} max indices for \"${name}\"`)
+            console.log(`Instanced renderer (${this.name}) created with ${this._maxInstanceCount} instances, ${this._maxVertexCount} max vertices and ${this._maxIndexCount} max indices for \"${name}\"`)
         }
     }
 
@@ -522,7 +532,8 @@ class InstancedMeshRenderer {
             return false;
         }
 
-        if (this.mustGrow(geo)) {
+        const newInstanceCount = this._currentInstanceCount + 1;
+        if (newInstanceCount > this._maxInstanceCount || this.mustGrow(geo)) {
             if (this.allowResize) {
                 this.grow(geo);
             }
@@ -644,34 +655,42 @@ class InstancedMeshRenderer {
     private mustGrow(geo?: BufferGeometry): boolean {
         if (this.count >= this._maxInstanceCount) return true;
         if (!geo || !geo.attributes) return false;
+
+        const isKnownGeometry = this._geometryIds.has(geo);
+        if (isKnownGeometry) return false;
+
         const meshInfo = getMeshInformation(geo);
         const newVertexCount = meshInfo.vertexCount;
         const newIndexCount = meshInfo.indexCount;
         return this._currentVertexCount + newVertexCount > this._maxVertexCount || this._currentIndexCount + newIndexCount > this._maxIndexCount;
     }
 
+    private _growId = 0;
     private grow(geometry: BufferGeometry) {
+        const id = ++this._growId;
         const growFactor = 2;
         const newSize = Math.ceil(this._maxInstanceCount * growFactor);
 
         // create a new BatchedMesh instance
+        // TODO: we should keep track of how many instances for each geometry we have and consider that when estimating new space
         const estimatedSpace = this.tryEstimateVertexCountSize(newSize, [geometry]);// geometry.attributes.position.count;
         // const indices = geometry.index ? geometry.index.count : 0;
         const newMaxVertexCount = Math.max(this._maxVertexCount, estimatedSpace.vertexCount);
-        const newMaxIndexCount = Math.max(this._maxIndexCount, estimatedSpace.indexCount, Math.ceil(this._maxVertexCount * growFactor));
+        const newMaxIndexCount = Math.max(this._maxIndexCount, estimatedSpace.indexCount);//, Math.ceil(this._maxVertexCount * growFactor));
 
         if (debugInstancing) {
             const geometryInfo = getMeshInformation(geometry);
-            console.warn(`[Instancing] Growing Buffer\nMesh: \"${this.name}${geometry.name?.length ? "/" + geometry.name : ""}\"\n${geometryInfo.vertexCount} vertices, ${geometryInfo.indexCount} indices\nMax count ${this._maxInstanceCount} → ${newSize}\nMax vertex count ${this._maxVertexCount} -> ${newMaxVertexCount}\nMax index count ${this._maxIndexCount} -> ${newMaxIndexCount}`);
+            console.warn(`[Instancing] Growing Buffer\nMesh: \"${this.name}${geometry.name?.length ? "/" + geometry.name : ""}\" (${geometryInfo.vertexCount.toLocaleString()} vertices, ${geometryInfo.indexCount.toLocaleString()} indices)\nMax count ${this._maxInstanceCount.toLocaleString()} → ${newSize.toLocaleString()}\nMax vertex count ${this._maxVertexCount.toLocaleString()} -> ${newMaxVertexCount.toLocaleString()}\nMax index count ${this._maxIndexCount.toLocaleString()} -> ${newMaxIndexCount.toLocaleString()}`);
             this._debugMaterial = createDebugMaterial();
         }
         else if (isDevEnvironment()) {
-            console.debug(`[Instancing] Growing Buffer\nMesh: \"${this.name}${geometry.name?.length ? "/" + geometry.name : ""}\"\nMax count ${this._maxInstanceCount} → ${newSize}\nMax vertex count ${this._maxVertexCount} -> ${newMaxVertexCount}\nMax index count ${this._maxIndexCount} -> ${newMaxIndexCount}`);
+            console.debug(`[Instancing] Growing Buffer\nMesh: \"${this.name}${geometry.name?.length ? "/" + geometry.name : ""}\"\nMax count ${this._maxInstanceCount} → ${newSize}\nMax vertex count ${this._maxVertexCount.toLocaleString()} -> ${newMaxVertexCount.toLocaleString()}\nMax index count ${this._maxIndexCount.toLocaleString()} -> ${newMaxIndexCount.toLocaleString()}`);
         }
 
         this._maxVertexCount = newMaxVertexCount;
         this._maxIndexCount = newMaxIndexCount;
         const newInst = new BatchedMesh(newSize, this._maxVertexCount, this._maxIndexCount, this._debugMaterial ?? this.material);
+        newInst.name = this.getBatchedMeshName();
         newInst.layers = this._batchedMesh.layers;
         newInst.castShadow = this._batchedMesh.castShadow;
         newInst.receiveShadow = this._batchedMesh.receiveShadow;
@@ -686,7 +705,7 @@ class InstancedMeshRenderer {
         // dispose the old batched mesh
         this._batchedMesh.dispose();
         this._batchedMesh.removeFromParent();
-        this._geometryIds.clear();
+        this._geometryIds = new WeakMap<BufferGeometry, number>();
 
         this._batchedMesh = newInst;
         this._maxInstanceCount = newSize;
@@ -698,6 +717,11 @@ class InstancedMeshRenderer {
         const original = [...this._handles];
         this._handles = [];
         for (const handle of original) {
+            if (id !== this._growId) {
+                // another grow happened in the meantime
+                if (debugInstancing) console.warn("[Instancing] Aborting grow since another grow happened in the meantime");
+                return;
+            }
             if (handle && handle.__instanceIndex >= 0) {
                 this.addGeometry(handle);
                 this._handles[handle.__instanceIndex] = handle;
@@ -722,23 +746,31 @@ class InstancedMeshRenderer {
                     entry.count += 1;
                 }
 
+                if (_newGeometries && _newGeometries?.length > 0) {
+                    const index = _newGeometries.indexOf(handle.object.geometry as BufferGeometry);
+                    if (index !== -1) {
+                        _newGeometries.splice(index, 1);
+                    }
+                }
             }
         }
 
         // then calculate the total vertex count
         let totalVertices = 0;
         let totalIndices = 0;
+        let totalGeometries = 0;
         // let maxVertices = 0;
         for (const [_geo, data] of usedGeometries) {
-            totalVertices += data.vertexCount * data.count;
-            totalIndices += data.indexCount * data.count;
+            totalGeometries += 1;
+            totalVertices += data.vertexCount;
+            totalIndices += data.indexCount;
             // maxVertices = Math.max(maxVertices, geo.attributes.position.count * count);
         }
         // we calculate the average to make an educated guess of how many vertices will be needed with the new buffer count
-        const averageVerts = Math.ceil(totalVertices / Math.max(1, this._currentInstanceCount));
-        let maxVertexCount = averageVerts * newMaxInstances;
-        const averageIndices = Math.ceil(totalIndices / Math.max(1, this._currentInstanceCount));
-        let maxIndexCount = averageIndices * newMaxInstances * 2;
+        const averageVerts = Math.ceil(totalVertices / Math.max(1, totalGeometries));
+        let maxVertexCount = averageVerts * totalGeometries;
+        const averageIndices = Math.ceil(totalIndices / Math.max(1, totalGeometries));
+        let maxIndexCount = averageIndices * totalGeometries;
 
         // if new geometries are provided we *know* that they will be added
         // so we make sure to include them in the calculation
@@ -753,6 +785,10 @@ class InstancedMeshRenderer {
             }
         }
 
+        if (debugInstancing) {
+            console.log(`[Instancing] Estimated size for new buffer ${this.name}\nGeometries: ${totalGeometries} (New: ${_newGeometries?.length || 0})\nInstances: ${newMaxInstances}\nEstimated Vertices: ${maxVertexCount.toLocaleString()}\nEstimated Indices: ${maxIndexCount.toLocaleString()}`);
+        }
+
         return { vertexCount: maxVertexCount, indexCount: maxIndexCount };
     }
 
@@ -770,16 +806,16 @@ class InstancedMeshRenderer {
         let geometryId = this._geometryIds.get(geo);
         if (geometryId === undefined || geometryId === null) {
             if (debugInstancing)
-                console.debug(`[Instancing] > ADD NEW GEOMETRY \"${handle.name} (${geo.name}; ${geo.uuid})\"\n${this._currentInstanceCount} instances, ${handle.maxVertexCount} max vertices, ${handle.maxIndexCount} max indices`);
+                console.warn(`[Instancing] > ADD NEW GEOMETRY \"${handle.name} (${geo.name}; ${geo.uuid})\"\nCurrent Instances: ${this._currentInstanceCount}\nMax Vertices: ${handle.maxVertexCount.toLocaleString()}\nMax Indices: ${handle.maxIndexCount.toLocaleString()}\nMax Triangles: ${(handle.maxIndexCount / 3).toLocaleString()}`);
 
             geometryId = this._batchedMesh.addGeometry(geo, handle.maxVertexCount, handle.maxIndexCount);
             this._geometryIds.set(geo, geometryId);
+            this._currentVertexCount += handle.maxVertexCount;
+            this._currentIndexCount += handle.maxIndexCount;
         }
         else {
             if (debugInstancing === "verbose") console.log(`[Instancing] > ADD INSTANCE \"${handle.name}\"\nGEOMETRY_ID=${geometryId}\n${this._currentInstanceCount} instances`);
         }
-        this._currentVertexCount += handle.maxVertexCount;
-        this._currentIndexCount += handle.maxIndexCount;
         const i = this._batchedMesh.addInstance(geometryId);
         handle.__geometryIndex = geometryId;
         handle.__instanceIndex = i;
@@ -787,7 +823,7 @@ class InstancedMeshRenderer {
         handle.__reservedIndexRange = handle.maxIndexCount;
         this._batchedMesh.setMatrixAt(i, handle.object.matrixWorld);
         if (debugInstancing)
-            console.debug(`[Instancing] > ADDED INSTANCE \"${handle.name}\"\nGEOMETRY_ID=${geometryId}\n${this._currentInstanceCount} instances\nIndex: ${handle.__instanceIndex}`);
+            console.debug(`[Instancing] > ADDED INSTANCE \"${handle.name}\"\nGEOMETRY_ID=${geometryId}\n${this._currentInstanceCount} instances\nIndex: ${handle.__instanceIndex}\nVertices: ${this._currentVertexCount.toLocaleString()}/${this._maxVertexCount.toLocaleString()},\nIndices: ${this._currentIndexCount.toLocaleString()}/${this._maxIndexCount.toLocaleString()}`);
 
     }
 
@@ -803,7 +839,7 @@ class InstancedMeshRenderer {
         //     this.inst.deleteGeometry(handle.__instanceIndex);
         // else 
         // this._batchedMesh.setVisibleAt(handle.__instanceIndex, false);
-        if(debugInstancing) {
+        if (debugInstancing) {
             console.debug(`[Instancing] < REMOVE INSTANCE \"${handle.name}\" at [${handle.__instanceIndex}]\nGEOMETRY_ID=${handle.__geometryIndex}\n${this._currentInstanceCount} instances\nIndex: ${handle.__instanceIndex}`);
         }
         this._batchedMesh.deleteInstance(handle.__instanceIndex);

package/src/engine-components/RendererLightmap.ts

@@ -9,6 +9,10 @@ const debug = getParam("debuglightmaps");
 
 declare type MaterialWithLightmap = Material & { lightMap?: Texture | null };
 
+let cloningCounter = 0;
+
+const $lightmapVersion = Symbol("lightmap-material-version");
+
 
 /**
  * This component is automatically added by the {@link Renderer} component if the object has lightmap uvs AND we have a lightmap.
@@ -37,6 +41,8 @@ export class RendererLightmap {
     private lightmapScaleOffset: Vector4 = new Vector4(1, 1, 0, 0);
 
     private readonly renderer: Renderer;
+    private readonly clonedMaterials = new Array<Material>();
+
     private get context(): Context { return this.renderer.context; }
     private get gameObject() { return this.renderer.gameObject; }
     private lightmapTexture: Texture | null = null;
@@ -89,8 +95,7 @@ export class RendererLightmap {
 
             const mat = this.renderer.sharedMaterials[i];
             if (!mat) continue;
-
-            const newMat = this.ensureLightmapMaterial(mat);
+            const newMat = this.ensureLightmapMaterial(mat, i);
             if (mat !== newMat) {
                 this.renderer.sharedMaterials[i] = newMat;
             }
@@ -118,23 +123,28 @@ export class RendererLightmap {
         }
     }
 
-    private ensureLightmapMaterial(material: Material) {
+    private ensureLightmapMaterial(material: Material, index: number) {
         if (!material.userData) material.userData = {};
         // if (material instanceof MeshPhysicalMaterial) {
         //     return material;
         // }
         // check if the material version has changed and only then clone the material
-        if (material["NEEDLE:lightmap-material-version"] != material.version) {
-            if (material["NEEDLE:lightmap-material-version"] == undefined) {
-                if (debug) console.warn("Cloning material for lightmap " + material.name);
-                const mat: Material = material.clone();
-                if (!mat.name?.includes("(lightmap)")) mat.name = material.name + " (lightmap)";
-                material = mat;
-                material.onBeforeCompile = this.onBeforeCompile;
-            }
-            else {
-                // we need to clone the material
+        if (this.clonedMaterials[index] !== material) {
+            if (debug) {
+                ++cloningCounter;
+                if (cloningCounter++ < 1000) {
+                    console.warn(`Cloning material for lightmap ${this.renderer.name}: '${material.name}'`);
+                }
+                else if (cloningCounter === 1000) {
+                    console.warn(`Further material cloning for lightmaps suppressed to avoid flooding the console.`);
+                }
             }
+            const mat: Material = material.clone();
+            if (!mat.name?.includes("(lightmap)")) mat.name = material.name + " (lightmap)";
+            material = mat;
+            material.onBeforeCompile = this.onBeforeCompile;
+            this.clonedMaterials[index] = material;
+
         }
         return material;
     }
@@ -144,22 +154,22 @@ export class RendererLightmap {
         if (material instanceof MeshPhysicalMaterial && material.transmission > 0) {
             return;
         }
-        const hasChanged = material.lightMap !== this.lightmapTexture || material["NEEDLE:lightmap-material-version"] !== material.version;
+        const hasChanged = material.lightMap !== this.lightmapTexture || material[$lightmapVersion] !== material.version;
         if (!hasChanged) {
             return;
         }
 
-        if (debug) console.log("Assigning lightmap", material.name, material.version, material);
+        if (debug) console.log(`Assigning lightmap texture ${this.renderer.name}: '${material.name}' (${material.version} ${material[$lightmapVersion]})`);
 
         // assign the lightmap
         material.lightMap = this.lightmapTexture;
         material.needsUpdate = true;
         // store the version of the material
-        material["NEEDLE:lightmap-material-version"] = material.version;
+        material[$lightmapVersion] = material.version;
     }
 
     private onBeforeCompile = (shader: WebGLProgramParametersWithUniforms, _) => {
-        if (debug) console.log("Lightmaps, before compile\n", shader)
+        if (debug === "verbose") console.log("Lightmaps, before compile\n", shader)
         this.lightmapScaleOffsetUniform.value = this.lightmapScaleOffset;
         this.lightmapUniform.value = this.lightmapTexture;
         shader.uniforms.lightmapScaleOffset = this.lightmapScaleOffsetUniform;

package/src/engine-components/RigidBody.ts

@@ -140,6 +140,7 @@ class TransformWatch {
  * - Example: https://samples.needle.tools/physics-playground
  * - Example: https://samples.needle.tools/physics-&-animation
  * 
+ * @summary Rigidbody for physical interactions
  * @category Physics 
  * @group Components
  */

package/src/engine-components/SceneSwitcher.ts

@@ -108,6 +108,7 @@ export interface ISceneEventListener {
  * });
  * ```
  * 
+ * @summary Dynamically loads and switches between multiple scenes
  * @category Asset Management
  * @group Components
  */

package/src/engine-components/ScreenCapture.ts

@@ -70,6 +70,7 @@ export declare type ScreenCaptureOptions = {
  * By default the component will start sharing the screen when the user clicks on the object this component is attached to. You can set {@link device} This behaviour can be disabled by setting `allowStartOnClick` to false.  
  * It is also possible to start the stream manually from your code by calling the {@link share} method.
  * 
+ * @summary Share screen, camera or microphone in a networked room
  * @category Networking
  * @group Components
 */

package/src/engine-components/SeeThrough.ts

@@ -40,6 +40,7 @@ let i = 0;
  * 
  * - Example https://see-through-walls-z23hmxbz1kjfjn.needle.run/
  * 
+ * @summary Makes objects fade out when obscuring a reference point from the camera
  * @category Rendering
  * @group Components
  */

package/src/engine-components/ShadowCatcher.ts

@@ -22,6 +22,8 @@ enum ShadowMode {
  * If the GameObject is a Mesh, it will apply a shadow-catching material to it - otherwise it will create a quad with the shadow-catching material.  
  * 
  * Note that ShadowCatcher meshes are not raycastable by default; if you want them to be raycastable, change the layers in `onEnable()`.
+ * 
+ * @summary Renders shadows or light on the object
  * @category Rendering
  * @group Components
  */