@expofp/renderer 3.1.6 → 3.2.1

package/dist/index.js

@@ -1,11 +1,15 @@
-import { AlwaysDepth, AmbientLight, BatchedMesh, Box3, BufferAttribute, BufferGeometry, Camera, Clock, Color, DataTexture, DirectionalLight, DoubleSide, DynamicDrawUsage, FloatType, Frustum, Group, IntType, LessEqualDepth, LinearSRGBColorSpace, MathUtils, Matrix4, Mesh, MeshBasicMaterial, MeshPhongMaterial, PerspectiveCamera, Plane, PlaneGeometry, Quaternion, RGBAFormat, RGBAIntegerFormat, RGFormat, RGIntegerFormat, Raycaster, RedFormat, RedIntegerFormat, SRGBColorSpace, Scene, Sphere, Spherical, StreamDrawUsage, Texture, UnsignedIntType, Vector2, Vector3, Vector4, WebGLRenderer } from "three";
+import { AlwaysDepth, BatchedMesh, Box3, BufferAttribute, BufferGeometry, Camera, Clock, Color, CustomBlending, DataTexture, DirectionalLight, DoubleSide, DynamicDrawUsage, FloatType, Frustum, Group, HemisphereLight, IntType, LessDepth, LessEqualDepth, LinearSRGBColorSpace, MathUtils, Matrix3, Matrix4, Mesh, MeshBasicMaterial, MeshPhysicalMaterial, MeshStandardMaterial, OneFactor, PMREMGenerator, PerspectiveCamera, Plane, PlaneGeometry, Quaternion, RGBAFormat, RGBAIntegerFormat, RGFormat, RGIntegerFormat, Raycaster, RedFormat, RedIntegerFormat, SRGBColorSpace, Scene, Sphere, Spherical, StreamDrawUsage, Texture, UnsignedIntType, Vector2, Vector3, Vector4, WebGLRenderer } from "three";
 import { traverseAncestorsGenerator } from "three/examples/jsm/utils/SceneUtils.js";
 import createLog from "debug";
 import { BatchedText, Text } from "troika-three-text";
-import { LineMaterial, LineSegmentsGeometry } from "three/examples/jsm/Addons.js";
+import { BufferGeometryUtils, ColorEnvironment, LineMaterial, LineSegmentsGeometry } from "three/examples/jsm/Addons.js";
 import { MaxRectsPacker, Rectangle } from "maxrects-packer";
 import { colord, extend } from "colord";
 import namesPlugin from "colord/plugins/names";
+import { MeshoptDecoder } from "three/addons/libs/meshopt_decoder.module.js";
+import { DRACOLoader } from "three/examples/jsm/loaders/DRACOLoader.js";
+import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader.js";
+import { GLTFExporter } from "three/examples/jsm/exporters/GLTFExporter.js";
 import { DEG2RAD, MathUtils as MathUtils$1, RAD2DEG } from "three/src/math/MathUtils.js";
 import { EventManager, Pan, Rotate } from "mjolnir.js";
 //#region src/util/logging.ts
@@ -94,7 +98,7 @@ function getSquareTextureSize(capacity, pixelsPerInstance) {
 */
 function getSquareTextureInfo(arrayType, channels, pixelsPerInstance, capacity) {
 	if (channels === 3) {
-		logger$14.debug("\"channels\" cannot be 3. Set to 4. More info: https://github.com/mrdoob/three.js/pull/23228");
+		logger$16.debug("\"channels\" cannot be 3. Set to 4. More info: https://github.com/mrdoob/three.js/pull/23228");
 		channels = 4;
 	}
 	const size = getSquareTextureSize(capacity, pixelsPerInstance);
@@ -121,7 +125,7 @@ function getSquareTextureInfo(arrayType, channels, pixelsPerInstance, capacity)
 		format
 	};
 }
-var logger$14 = createLogger("SquareDataTexture");
+var logger$16 = createLogger("SquareDataTexture");
 /**
 * A class that extends `DataTexture` to manage a square texture optimized for instances rendering.
 * It supports dynamic resizing, partial update based on rows, and allows setting/getting uniforms per instance.
@@ -163,7 +167,7 @@ var SquareDataTexture = class extends DataTexture {
 	setUniformAt(id, name, value) {
 		const schema = this.uniformMap.get(name);
 		if (!schema) {
-			logger$14.debug(`setUniformAt: uniform ${name} not found`);
+			logger$16.debug(`setUniformAt: uniform ${name} not found`);
 			return;
 		}
 		const { offset, size } = schema;
@@ -181,7 +185,7 @@ var SquareDataTexture = class extends DataTexture {
 	getUniformAt(id, name, target) {
 		const schema = this.uniformMap.get(name);
 		if (!schema) {
-			logger$14.debug(`getUniformAt: uniform ${name} not found`);
+			logger$16.debug(`getUniformAt: uniform ${name} not found`);
 			return 0;
 		}
 		const { offset, size } = schema;
@@ -300,7 +304,7 @@ var componentsArray = [
 //#endregion
 //#region src/batch/BatchedMesh.ts
 var batchIdName = "batchId";
-var logger$13 = createLogger("BatchedMesh");
+var logger$15 = createLogger("BatchedMesh");
 /**
 * Class extending {@link ThreeBatchedMesh} to support per instance uniforms and disable WebGL multi draw
 */
@@ -323,7 +327,6 @@ var BatchedMesh$1 = class BatchedMesh$1 extends BatchedMesh {
 	*/
 	constructor(instanceCount, vertexCount, indexCount, material) {
 		super(instanceCount, vertexCount, indexCount, material);
-		material.forceSinglePass = true;
 		addDim(this);
 		if (!BatchedMesh$1.useMultiDraw) this.addEventListener("added", () => {
 			if (this.geometry.index !== null) {
@@ -376,7 +379,7 @@ var BatchedMesh$1 = class BatchedMesh$1 extends BatchedMesh {
 		if (BatchedMesh$1.useMultiDraw) return;
 		const batchCount = this.batchCount;
 		const gl = renderer.getContext();
-		if (geometry.index == null) return logger$13.debug("No index buffer", this.parent?.name);
+		if (geometry.index == null) return logger$15.debug("No index buffer", this.parent?.name);
 		const type = this.getIndexType(gl, geometry.index);
 		gl.drawElements(gl.TRIANGLES, batchCount, type, 0);
 		renderer.info.update(batchCount, gl.TRIANGLES, 1);
@@ -391,7 +394,7 @@ var BatchedMesh$1 = class BatchedMesh$1 extends BatchedMesh {
 	*/
 	getUniformAt(id, name, target) {
 		if (!this.uniformsTexture) {
-			logger$13.debug(`getUniformAt: uniforms texture not initialized`);
+			logger$15.debug(`getUniformAt: uniforms texture not initialized`);
 			return 0;
 		}
 		return this.uniformsTexture.getUniformAt(id, name, target);
@@ -404,7 +407,7 @@ var BatchedMesh$1 = class BatchedMesh$1 extends BatchedMesh {
 	*/
 	setUniformAt(instanceId, name, value) {
 		if (!this.uniformsTexture) {
-			logger$13.debug(`setUniformAt: uniforms texture not initialized`);
+			logger$15.debug(`setUniformAt: uniforms texture not initialized`);
 			return;
 		}
 		this.uniformsTexture.setUniformAt(instanceId, name, value);
@@ -727,6 +730,17 @@ var BatchedText$1 = class extends BatchedText {
 		if (pendingSyncs.length) Promise.all(pendingSyncs).then(repack);
 		else repack();
 	}
+	createDerivedMaterial(baseMaterial) {
+		const derivedMaterial = super.createDerivedMaterial(baseMaterial);
+		derivedMaterial.onBeforeCompile = (shader) => {
+			shader.vertexShader = shader.vertexShader.replace("void main() {", `
+        void main () {
+          // Uninitialized vec2 causes problems on Samsung Android devices
+          uTroikaPositionOffset = vec2(0., 0.);
+        `);
+		};
+		return derivedMaterial;
+	}
 	repackBatchedGeometry() {
 		const geometry = this.geometry;
 		const batchedAttributes = geometry.attributes;
@@ -1067,7 +1081,6 @@ var dimColorFrag = `
 var POLYGON_OFFSET_MULTIPLIER = 12;
 var sharedParameters = {
 	side: DoubleSide,
-	transparent: true,
 	forceSinglePass: true,
 	depthFunc: AlwaysDepth
 };
@@ -1075,6 +1088,7 @@ var sharedParameters = {
 var MaterialSystem = class {
 	backgroundMaterial;
 	viewport = new Vector4();
+	lightingMaterials = [];
 	/**
 	* Creates a line material.
 	* @param params {@link LineMaterialParameters}
@@ -1103,8 +1117,7 @@ var MaterialSystem = class {
 				uniforms["resolution"].value.set(this.viewport.z, this.viewport.w);
 			}
 		};
-		addDimToMaterial(material);
-		this.addPolygonOffset(material);
+		this.patchMaterial(material);
 		return material;
 	}
 	/**
@@ -1113,14 +1126,21 @@ var MaterialSystem = class {
 	* @returns MeshBasicMaterial instance
 	*/
 	createColorMaterial(params = {}) {
-		const material = new (params.lightingEnable ? MeshPhongMaterial : MeshBasicMaterial)({
+		const materialConstructor = params.lightingEnable ? MeshPhysicalMaterial : MeshBasicMaterial;
+		const color = params.color ?? 16777215;
+		const opacity = params.opacity ?? 1;
+		const transparent = opacity < 1;
+		const material = new materialConstructor({
 			...sharedParameters,
-			color: params.color ?? 16777215,
-			opacity: params.opacity ?? 1
+			color,
+			opacity,
+			transparent
 		});
-		if (params.depthEnable) material.depthFunc = LessEqualDepth;
-		addDimToMaterial(material);
-		this.addPolygonOffset(material);
+		if (transparent) {
+			material.depthWrite = false;
+			material.depthFunc = LessDepth;
+		} else if (params.depthEnable) material.depthFunc = LessEqualDepth;
+		this.patchMaterial(material, { lightingEnable: params.lightingEnable });
 		return material;
 	}
 	/**
@@ -1131,18 +1151,37 @@ var MaterialSystem = class {
 	createTextureMaterial(params) {
 		const material = new MeshBasicMaterial({
 			...sharedParameters,
-			map: params.map
+			map: params.map,
+			transparent: true,
+			depthFunc: LessDepth
 		});
-		if (params.depthEnable) material.depthFunc = LessEqualDepth;
 		if (params.uvOffset) material.onBeforeCompile = (shader) => {
 			shader.vertexShader = shader.vertexShader.replace("#include <uv_vertex>", `
               #include <uv_vertex>
               vMapUv = uv * uvOffset.zw + uvOffset.xy;
             `);
 		};
+		this.patchMaterial(material);
+		return material;
+	}
+	/**
+	* Apply the engine's cross-cutting material patches: dim shader hooks, polygon offset,
+	* and (optional) registration with the lighting system. Used internally by every
+	* factory in this class and exposed publicly so externally-built materials (e.g. PBR
+	* materials cloned from GLTF source) can opt in to the same behavior.
+	* @param material material to patch
+	* @param opts patch options
+	* @param opts.lightingEnable when true and the material is a MeshPhysicalMaterial,
+	* configures it for the project's lighting pipeline and registers it
+	*/
+	patchMaterial(material, opts = {}) {
 		addDimToMaterial(material);
 		this.addPolygonOffset(material);
-		return material;
+		if (opts.lightingEnable && material instanceof MeshPhysicalMaterial) {
+			material.ior = 1;
+			material.specularIntensity = 0;
+			this.lightingMaterials.push(material);
+		}
 	}
 	/**
 	* Creates a background material. Used for the background layer to support dimming the background.
@@ -1213,6 +1252,9 @@ function isTextDef(def) {
 function isLineDef(def) {
 	return def.points !== void 0;
 }
+function isModelDef(def) {
+	return def.url !== void 0;
+}
 function isLayerDef(def) {
 	return def.children !== void 0;
 }
@@ -1228,6 +1270,9 @@ function isTextLayer(layer) {
 function isLineLayer(layer) {
 	return layer.children[0] && isLineDef(layer.children[0]);
 }
+function isModelLayer(layer) {
+	return layer.children[0] && isModelDef(layer.children[0]);
+}
 function isLayerLayer(layer) {
 	return layer.children[0] && isLayerDef(layer.children[0]);
 }
@@ -1341,13 +1386,14 @@ var RenderableSystem = class {
 	* @param firstUpdate whether this is the first update for this def. Set to true when the def is first added to the scene.
 	*/
 	updateDef(def, firstUpdate = false) {
-		const mapping = this.getObjectInstanceByDef(def);
-		if (!mapping) return;
-		const { object: mesh, instanceIds } = mapping;
-		for (const instanceId of instanceIds) mesh.setVisibleAt(instanceId, !def.hidden);
-		if (def.hidden && !firstUpdate) return;
-		for (const instanceId of instanceIds) toggleInstanceDim(mesh, instanceId, def.dim);
-		this.updateDefImpl(def, mesh, instanceIds, firstUpdate);
+		const mappings = this.getObjectInstanceByDef(def);
+		if (!mappings) return;
+		for (const { object: mesh, instanceIds } of mappings) {
+			for (const instanceId of instanceIds) mesh.setVisibleAt(instanceId, !def.hidden);
+			if (def.hidden && !firstUpdate) continue;
+			for (const instanceId of instanceIds) toggleInstanceDim(mesh, instanceId, def.dim);
+			this.updateDefImpl(def, mesh, instanceIds, firstUpdate);
+		}
 	}
 	/**
 	* Update an existing collection with a new layer definition.
@@ -1418,7 +1464,8 @@ var RenderableSystem = class {
 			this.logger.debug(`Tried to register def with empty instanceIds %O`, def);
 			return;
 		}
-		this.mapDefToObject.set(def, {
+		if (!this.mapDefToObject.has(def)) this.mapDefToObject.set(def, []);
+		this.mapDefToObject.get(def).push({
 			object,
 			instanceIds: ids
 		});
@@ -1427,29 +1474,57 @@ var RenderableSystem = class {
 		this.updateDef(def, true);
 	}
 	/**
-	* Unregister a def and its associated object mapping.
+	* Register a single instance mapping between a def and an object/instance, appending
+	* one entry per call. Use when a single def maps to multiple instances across one or
+	* more containers (e.g. a model spread across several BatchedMesh batches). Pushes
+	* once per instance into the object→defs map so `getDefsByObject(obj)[batchId]` stays
+	* aligned with sequential `BatchedMesh.addInstance` ids.
+	* @param def def to register
+	* @param object container the def's instance lives in
+	* @param instanceId single instance id in the container
+	*/
+	registerDefInstance(def, object, instanceId) {
+		if (!this.mapDefToObject.has(def)) this.mapDefToObject.set(def, []);
+		this.mapDefToObject.get(def).push({
+			object,
+			instanceIds: [instanceId]
+		});
+		if (!this.mapObjectToDefs.has(object)) this.mapObjectToDefs.set(object, []);
+		this.mapObjectToDefs.get(object).push(def);
+		this.updateDef(def, true);
+	}
+	/**
+	* Unregister a def and its associated object mappings.
 	* @param def def to unregister
 	*/
 	unregisterDef(def) {
-		const mapping = this.mapDefToObject.get(def);
-		if (mapping) {
-			const { object } = mapping;
-			const defs = this.mapObjectToDefs.get(object);
-			if (defs) {
-				this.mapObjectToDefs.set(object, defs.filter((d) => d !== def));
-				if (this.mapObjectToDefs.get(object).length === 0) this.mapObjectToDefs.delete(object);
+		const mappings = this.mapDefToObject.get(def);
+		if (mappings) {
+			for (const { object } of mappings) {
+				const defs = this.mapObjectToDefs.get(object);
+				if (defs) {
+					this.mapObjectToDefs.set(object, defs.filter((d) => d !== def));
+					if (this.mapObjectToDefs.get(object).length === 0) this.mapObjectToDefs.delete(object);
+				}
 			}
 			this.mapDefToObject.delete(def);
 		}
 	}
 	/**
-	* Unregister all defs associated with an object.
+	* Unregister all defs associated with an object. Only removes the entries that point
+	* at this object — defs with mappings to other containers keep those entries intact.
 	* @param object object to unregister
 	*/
 	unregisterObject(object) {
 		const defs = this.mapObjectToDefs.get(object);
 		if (defs) {
-			for (const def of defs) this.mapDefToObject.delete(def);
+			for (const def of defs) {
+				const mappings = this.mapDefToObject.get(def);
+				if (!mappings) continue;
+				const remaining = mappings.filter((m) => m.object !== object);
+				if (remaining.length === 0) this.mapDefToObject.delete(def);
+				else this.mapDefToObject.set(def, remaining);
+			}
 			this.mapObjectToDefs.delete(object);
 		}
 	}
@@ -1461,17 +1536,18 @@ var RenderableSystem = class {
 		this.mapObjectToDefs.clear();
 	}
 	/**
-	* Lookup object/instance by def.
+	* Lookup object/instance mappings by def. Returns an array because a single def can
+	* map to multiple containers (e.g. a model spread across batches keyed by material).
 	* @param def def to lookup
-	* @returns object and instance ids
+	* @returns array of object/instance-id mappings, or undefined if none
 	*/
 	getObjectInstanceByDef(def) {
-		const mapping = this.mapDefToObject.get(def);
-		if (!mapping) {
+		const mappings = this.mapDefToObject.get(def);
+		if (!mappings || mappings.length === 0) {
 			this.logger.debug(`No object mapping found for def %O`, def);
 			return;
 		}
-		return mapping;
+		return mappings;
 	}
 	/**
 	* Lookup defs by object.
@@ -1491,7 +1567,7 @@ var RenderableSystem = class {
 };
 //#endregion
 //#region src/geometry/image.ts
-var logger$12 = createLogger("image");
+var logger$14 = createLogger("image");
 /**
 * A system that handles the rendering of image defs.
 */
@@ -1509,10 +1585,10 @@ var ImageSystem = class extends RenderableSystem {
 	* @param materialSystem {@link MaterialSystem}
 	*/
 	constructor(ctx, materialSystem) {
-		super("image", ctx, logger$12);
+		super("image", ctx, logger$14);
 		this.materialSystem = materialSystem;
 		const atlasTextureSize = ctx.three.capabilities.maxTextureSize;
-		logger$12.debug(`Max texture size: ${atlasTextureSize}`);
+		logger$14.debug(`Max texture size: ${atlasTextureSize}`);
 		this.packer = new MaxRectsPacker(atlasTextureSize, atlasTextureSize, 1, { pot: false });
 	}
 	dispose() {
@@ -1583,7 +1659,7 @@ var ImageSystem = class extends RenderableSystem {
 			oldTexture?.dispose();
 			mesh.visible = true;
 			data.appliedScale = targetScale;
-			logger$12.debug(`Rendered atlas for ${mesh.name || mesh.parent?.name} at scale ${targetScale.toFixed(3)}`);
+			logger$14.debug(`Rendered atlas for ${mesh.name || mesh.parent?.name} at scale ${targetScale.toFixed(3)}`);
 		}
 	}
 	disposeObject(object) {
@@ -1603,7 +1679,7 @@ var ImageSystem = class extends RenderableSystem {
 	}
 	computeResizeFactor() {
 		if (!this.memoryLimitMb) {
-			logger$12.debug("Memory limit is not set, atlases will not be scaled");
+			logger$14.debug("Memory limit is not set, atlases will not be scaled");
 			return 1;
 		}
 		let totalResizable = 0;
@@ -1614,17 +1690,17 @@ var ImageSystem = class extends RenderableSystem {
 			else totalNonResizable += bytes;
 		}
 		if (totalResizable === 0) {
-			logger$12.debug("No resizable atlases, atlases will not be scaled");
+			logger$14.debug("No resizable atlases, atlases will not be scaled");
 			return 1;
 		}
 		const budget = this.memoryLimitMb * 1024 * 1024 - totalNonResizable;
 		if (budget <= 0) {
-			logger$12.debug("Memory limit is too low, unable to resize textures.");
+			logger$14.debug("Memory limit is too low, unable to resize textures.");
 			return 1;
 		}
 		const factor = Math.sqrt(budget / totalResizable);
 		if (factor >= 1) return 1;
-		logger$12.debug(`Resize factor: ${factor.toFixed(3)} (budget ${budget} bytes, resizable ${totalResizable} bytes)`);
+		logger$14.debug(`Resize factor: ${factor.toFixed(3)} (budget ${budget} bytes, resizable ${totalResizable} bytes)`);
 		return factor;
 	}
 	packImages(images) {
@@ -1646,8 +1722,8 @@ var ImageSystem = class extends RenderableSystem {
 				const boundsHeight = image.bounds.size.y;
 				const ratio = sourceArea / (boundsWidth * boundsHeight);
 				if (ratio > 1e3) {
-					logger$12.debug(`Image bounds: ${boundsWidth}x${boundsHeight}`, `Image source: ${sourceWidth}x${sourceHeight}`);
-					logger$12.warn(`Image bounds area is ${ratio.toFixed(2)} times smaller than the image.`);
+					logger$14.debug(`Image bounds: ${boundsWidth}x${boundsHeight}`, `Image source: ${sourceWidth}x${sourceHeight}`);
+					logger$14.warn(`Image bounds area is ${ratio.toFixed(2)} times smaller than the image.`);
 				}
 				const rect = new Rectangle(image.source.width, image.source.height);
 				rect.data = [imageWithIndex];
@@ -1656,7 +1732,7 @@ var ImageSystem = class extends RenderableSystem {
 			} else existingRect.data.push(imageWithIndex);
 		}
 		this.packer.addArray(rectangles);
-		this.packer.bins.forEach((bin) => logger$12.debug(`Bin: ${bin.width}x${bin.height}, ${bin.rects.length} rectangles`));
+		this.packer.bins.forEach((bin) => logger$14.debug(`Bin: ${bin.width}x${bin.height}, ${bin.rects.length} rectangles`));
 		return this.packer.bins;
 	}
 };
@@ -1668,7 +1744,7 @@ function createAtlas(bin, scale) {
 	const ctx = canvas.getContext("2d");
 	for (const rect of bin.rects) ctx.drawImage(rect.data[0].def.source, Math.floor(rect.x * scale), Math.floor(rect.y * scale), Math.floor(rect.width * scale), Math.floor(rect.height * scale));
 	const t1 = performance.now();
-	logger$12.debug(`Create atlas (${canvas.width}x${canvas.height}) took ${(t1 - t0).toFixed(2)} milliseconds.`);
+	logger$14.debug(`Create atlas (${canvas.width}x${canvas.height}) took ${(t1 - t0).toFixed(2)} milliseconds.`);
 	return createTexture(canvas);
 }
 function createPlaceholderTexture() {
@@ -1687,7 +1763,7 @@ function getAtlasSizeBytes(width, height) {
 }
 //#endregion
 //#region src/geometry/line.ts
-var logger$11 = createLogger("line");
+var logger$13 = createLogger("line");
 /**
 * A system that handles the rendering of line defs.
 */
@@ -1698,7 +1774,7 @@ var LineSystem = class extends RenderableSystem {
 	* @param materialSystem {@link MaterialSystem}
 	*/
 	constructor(ctx, materialSystem) {
-		super("line", ctx, logger$11);
+		super("line", ctx, logger$13);
 		this.materialSystem = materialSystem;
 	}
 	buildLayer(layer) {
@@ -2106,7 +2182,7 @@ function computeBoundingSphere(bounds, origin, out = new Sphere()) {
 }
 //#endregion
 //#region src/geometry/mesh.ts
-var logger$10 = createLogger("mesh");
+var logger$12 = createLogger("mesh");
 extend([namesPlugin]);
 /**
 * A system that handles the rendering of shape defs.
@@ -2125,7 +2201,7 @@ var MeshSystem = class extends RenderableSystem {
 	* @param materialSystem {@link MaterialSystem}
 	*/
 	constructor(ctx, materialSystem) {
-		super("mesh", ctx, logger$10);
+		super("mesh", ctx, logger$12);
 		this.materialSystem = materialSystem;
 	}
 	buildLayer(layer) {
@@ -2164,24 +2240,25 @@ var MeshSystem = class extends RenderableSystem {
 		const isPolygon = shape instanceof Polygon;
 		const isRect = shape instanceof Rect;
 		if (expectedShapeType === "polygon" && !isPolygon || expectedShapeType === "rect" && !isRect) {
-			logger$10.warn("Shape type changing not supported %O", shapeDef);
+			logger$12.warn("Shape type changing not supported %O", shapeDef);
 			return;
 		}
 		if (isPolygon) {
 			const geometryRange = mesh.getGeometryRangeAt(geometryId);
-			if (shape.vertices.length != geometryRange?.reservedVertexCount || shape.indices.length * 3 != geometryRange.reservedIndexCount) {
-				logger$10.warn("Polygon geometry changing not supported %O", shapeDef);
+			let newGeometry = this.buildPolygonGeometry(shape);
+			if (mesh.userData["is3D"]) newGeometry = processGeometryFor3D(newGeometry);
+			const { vertices, indices } = countGeometry(newGeometry);
+			if (vertices != geometryRange?.reservedVertexCount || indices != Math.max(geometryRange.reservedIndexCount, 0)) {
+				logger$12.warn("Polygon geometry changing not supported %O", shapeDef);
 				return;
 			}
-			const geometry = this.buildPolygonGeometry(shape);
-			if (mesh.geometry.hasAttribute("normal")) geometry.computeVertexNormals();
-			mesh.setGeometryAt(geometryId, geometry);
+			mesh.setGeometryAt(geometryId, newGeometry);
 		} else if (isRect) this.updateRect(shape, mesh, instanceId);
 	}
 	updateColor(shapeDef, mesh, instanceId) {
 		const color = this.normalizeColor(shapeDef.color);
 		if (!color) {
-			logger$10.warn(`Invalid color: ${shapeDef.color} %O`, shapeDef);
+			logger$12.warn(`Invalid color: ${shapeDef.color} %O`, shapeDef);
 			return;
 		}
 		mesh.setColorAt(instanceId, this.color.setRGB(color.r / 255, color.g / 255, color.b / 255, SRGBColorSpace));
@@ -2207,10 +2284,7 @@ var MeshSystem = class extends RenderableSystem {
 				({vertices, indices} = countGeometry(rectGeom));
 			} else if (shapeDef.shape instanceof Polygon) {
 				let geometry = this.buildPolygonGeometry(shapeDef.shape);
-				if (is3D) {
-					geometry = geometry.toNonIndexed();
-					geometry.computeVertexNormals();
-				}
+				if (is3D) geometry = processGeometryFor3D(geometry);
 				shapeDefToGeometry.set(shapeDef, geometry);
 				({vertices, indices} = countGeometry(geometry));
 			}
@@ -2224,7 +2298,8 @@ var MeshSystem = class extends RenderableSystem {
 		});
 		const batchedMesh = new BatchedMesh$1(shapes.length, vertexCount, indexCount, material);
 		const rectGeometryId = rectAdded ? batchedMesh.addGeometry(rectGeom) : void 0;
-		batchedMesh.setCustomSort((list) => this.sortInstances(batchedMesh, list));
+		batchedMesh.setCustomSort((list) => this.sortInstances(batchedMesh, is3D, opacity < 1, list));
+		if (is3D) batchedMesh.userData["is3D"] = true;
 		for (const shapeDef of shapes) {
 			let instanceId;
 			let type;
@@ -2254,18 +2329,316 @@ var MeshSystem = class extends RenderableSystem {
 	buildPolygonGeometry(polygon) {
 		return new BufferGeometry().setFromPoints(polygon.vertices).setIndex(polygon.indices.flat());
 	}
-	sortInstances(mesh, list) {
+	sortInstances(mesh, is3D, isTransparent, list) {
 		const shapeDefs = this.getDefsByObject(mesh);
 		list.sort((a, b) => {
 			const aDef = shapeDefs[a.index];
 			const bDef = shapeDefs[b.index];
-			return (aDef.dim === false ? 1 : 0) - (bDef.dim === false ? 1 : 0);
+			const aDim = aDef.dim === false ? 1 : 0;
+			const bDim = bDef.dim === false ? 1 : 0;
+			if (aDim !== bDim) return aDim - bDim;
+			if (!is3D) return 0;
+			return isTransparent ? sortTransparent(a, b) : sortOpaque(a, b);
 		});
 	}
 };
+function sortOpaque(a, b) {
+	return a.z - b.z;
+}
+function sortTransparent(a, b) {
+	return b.z - a.z;
+}
+function processGeometryFor3D(geometry) {
+	let processedGeometry = geometry;
+	processedGeometry = processedGeometry.toNonIndexed();
+	processedGeometry.computeVertexNormals();
+	processedGeometry = BufferGeometryUtils.toCreasedNormals(processedGeometry, Math.PI / 6);
+	return processedGeometry;
+}
+//#endregion
+//#region src/geometry/model.ts
+var logger$11 = createLogger("model");
+/**
+* Converts the GLB Y-up coordinate system to the engine's Z-up convention.
+* Matches the rotation/scale applied at the scene root in {@link import("../loaders/glb.ts")}.
+*/
+var Y_UP_TO_Z_UP = new Matrix4().makeRotationX(-Math.PI / 2).multiply(new Matrix4().makeScale(1, -1, 1));
+/**
+* A system that handles the rendering of external 3D model defs (e.g. GLB/glTF).
+* Loads models asynchronously, builds one {@link BatchedMesh} per (ModelDef, source
+* material) pair so each material clone can carry its def's opacity directly, and
+* routes shading through {@link MaterialSystem.patchMaterial} for dim + polygon offset.
+*/
+var ModelSystem = class extends RenderableSystem {
+	loader = new GLTFLoader();
+	cachePromise = /* @__PURE__ */ new Map();
+	pendingUpdates = /* @__PURE__ */ new Map();
+	layerAborted = /* @__PURE__ */ new WeakSet();
+	isDisposed = false;
+	/**
+	* @param ctx {@link RendererContext}
+	* @param materialSystem {@link MaterialSystem}
+	*/
+	constructor(ctx, materialSystem) {
+		super("model", ctx, logger$11);
+		this.materialSystem = materialSystem;
+		const dracoLoader = new DRACOLoader();
+		dracoLoader.setDecoderPath("https://www.gstatic.com/draco/versioned/decoders/1.5.7/");
+		this.loader.setDRACOLoader(dracoLoader);
+		this.loader.setMeshoptDecoder(MeshoptDecoder);
+	}
+	buildLayer(layer) {
+		const group = new Group();
+		if (layer.children.length === 0) return group;
+		this.loadAndBuild(group, layer.children);
+		return group;
+	}
+	updateDef(def, firstUpdate = false) {
+		if (!this.getObjectInstanceByDef(def)) {
+			this.pendingUpdates.set(def, def);
+			return;
+		}
+		super.updateDef(def, firstUpdate);
+	}
+	disposeLayer(group) {
+		this.layerAborted.add(group);
+		super.disposeLayer(group);
+	}
+	dispose() {
+		this.isDisposed = true;
+		super.dispose();
+		for (const cachePromise of this.cachePromise.values()) cachePromise.then((cache) => disposeGltfCache(cache)).catch(() => void 0);
+		this.cachePromise.clear();
+		this.pendingUpdates.clear();
+	}
+	disposeObject(object) {
+		disposeObject(object, { textures: false });
+	}
+	updateDefImpl(def, mesh, instanceIds) {
+		const extents = mesh.userData["modelExtents"];
+		if (extents) {
+			const matrix = composeInstanceMatrix(def, extents);
+			for (const instanceId of instanceIds) mesh.setMatrixAt(instanceId, matrix);
+		}
+		const material = mesh.material;
+		const opacity = def.opacity ?? 1;
+		material.opacity = opacity;
+		const srcTransparent = material.userData["srcTransparent"] === true;
+		material.transparent = opacity < 1 || srcTransparent;
+		material.depthWrite = !material.transparent;
+	}
+	async loadAndBuild(group, models) {
+		let caches;
+		try {
+			caches = await Promise.all(models.map((def) => this.loadCached(def.url)));
+		} catch (err) {
+			logger$11.warn("Failed to load model batch %O", err);
+			return;
+		}
+		if (this.isDisposed || this.layerAborted.has(group)) return;
+		const batches = [];
+		for (let i = 0; i < models.length; i++) {
+			const cache = caches[i];
+			if (!cache || cache.entries.length === 0) continue;
+			batches.push(...this.buildBatchesForDef(models[i], cache));
+		}
+		if (this.isDisposed || this.layerAborted.has(group)) {
+			for (const batch of batches) {
+				this.disposeObject(batch);
+				this.unregisterObject(batch);
+			}
+			return;
+		}
+		group.add(...batches);
+		for (const batch of batches) batch.renderOrder = group.renderOrder;
+		for (const [def, latest] of this.pendingUpdates) if (this.getObjectInstanceByDef(def)) {
+			this.pendingUpdates.delete(def);
+			this.updateDef(latest);
+		}
+	}
+	buildBatchesForDef(def, cache) {
+		const buckets = /* @__PURE__ */ new Map();
+		for (const entry of cache.entries) {
+			const key = `${entry.sourceMaterial.uuid}|${attributeSignature(entry.geometry)}`;
+			let bucket = buckets.get(key);
+			if (!bucket) {
+				bucket = {
+					sourceMaterial: entry.sourceMaterial,
+					geometries: []
+				};
+				buckets.set(key, bucket);
+			}
+			bucket.geometries.push(entry.geometry);
+		}
+		const batches = [];
+		for (const { sourceMaterial, geometries } of buckets.values()) {
+			const material = this.createPatchedMaterial(sourceMaterial);
+			let totalVertices = 0;
+			let totalIndices = 0;
+			for (const geometry of geometries) {
+				totalVertices += geometry.attributes["position"].count;
+				totalIndices += geometry.index?.count ?? 0;
+			}
+			const batch = new BatchedMesh$1(geometries.length, totalVertices, totalIndices, material);
+			batch.userData["modelExtents"] = cache.extents;
+			for (const geometry of geometries) {
+				const geometryId = batch.addGeometry(geometry);
+				const instanceId = batch.addInstance(geometryId);
+				this.registerDefInstance(def, batch, instanceId);
+			}
+			batches.push(batch);
+		}
+		return batches;
+	}
+	createPatchedMaterial(source) {
+		const physical = new MeshPhysicalMaterial();
+		if (source instanceof MeshStandardMaterial || source instanceof MeshPhysicalMaterial) {
+			physical.color.copy(source.color);
+			physical.map = source.map;
+			physical.normalMap = source.normalMap;
+			physical.normalScale.copy(source.normalScale);
+			physical.roughness = source.roughness;
+			physical.roughnessMap = source.roughnessMap;
+			physical.metalness = source.metalness;
+			physical.metalnessMap = source.metalnessMap;
+			physical.emissive.copy(source.emissive);
+			physical.emissiveIntensity = source.emissiveIntensity;
+			physical.emissiveMap = source.emissiveMap;
+			physical.aoMap = source.aoMap;
+			physical.aoMapIntensity = source.aoMapIntensity;
+			physical.alphaMap = source.alphaMap;
+			physical.alphaTest = source.alphaTest;
+		}
+		physical.side = source.side;
+		physical.transparent = source.transparent;
+		physical.opacity = source.opacity;
+		physical.depthWrite = !source.transparent;
+		physical.depthFunc = source.transparent ? LessDepth : LessEqualDepth;
+		physical.userData["srcTransparent"] = source.transparent;
+		this.materialSystem.patchMaterial(physical, { lightingEnable: true });
+		return physical;
+	}
+	async loadCached(url) {
+		let promise = this.cachePromise.get(url);
+		if (!promise) {
+			promise = this.parseGltf(url);
+			this.cachePromise.set(url, promise);
+		}
+		try {
+			return await promise;
+		} catch (err) {
+			logger$11.warn("Failed to load model %s: %O", url, err);
+			this.cachePromise.delete(url);
+			return;
+		}
+	}
+	async parseGltf(url) {
+		const entries = collectGltfEntries(await this.loader.loadAsync(url));
+		const extents = new Box3();
+		for (const { geometry } of entries) {
+			if (!geometry.boundingBox) geometry.computeBoundingBox();
+			extents.union(geometry.boundingBox);
+		}
+		return {
+			extents,
+			entries
+		};
+	}
+};
+/**
+* Traverses a loaded GLTF scene and collects baked geometries paired with their
+* source materials. Geometries are cloned, then transformed by
+* {@link Y_UP_TO_Z_UP} times the node's world matrix so vertices land in engine
+* space relative to the GLB root.
+* @param gltf parsed GLTF
+* @returns array of `{geometry, sourceMaterial}` entries, one per Mesh node
+*/
+function collectGltfEntries(gltf) {
+	const entries = [];
+	gltf.scene.updateMatrixWorld(true);
+	const tmp = new Matrix4();
+	gltf.scene.traverse((node) => {
+		if (!(node instanceof Mesh)) return;
+		const mesh = node;
+		if (!mesh.geometry || !mesh.material) return;
+		const sourceMaterial = Array.isArray(mesh.material) ? mesh.material[0] : mesh.material;
+		if (Array.isArray(mesh.material) && mesh.material.length > 1) logger$11.debug("Multi-material mesh on node %s — only the first material is used.", mesh.name);
+		const baked = mesh.geometry.clone();
+		tmp.multiplyMatrices(Y_UP_TO_Z_UP, mesh.matrixWorld);
+		baked.applyMatrix4(tmp);
+		baked.computeBoundingBox();
+		baked.computeBoundingSphere();
+		entries.push({
+			geometry: baked,
+			sourceMaterial
+		});
+	});
+	return entries;
+}
+/**
+* Disposes a cached GLB's baked geometries and the unique textures referenced by its
+* source materials. Source textures are shared across batches, so this is the only
+* place they should be released.
+* @param cache cache entry to dispose
+*/
+function disposeGltfCache(cache) {
+	const seen = /* @__PURE__ */ new Set();
+	const textureProps = [
+		"map",
+		"normalMap",
+		"roughnessMap",
+		"metalnessMap",
+		"emissiveMap",
+		"aoMap",
+		"alphaMap"
+	];
+	for (const { sourceMaterial } of cache.entries) {
+		const matRecord = sourceMaterial;
+		for (const prop of textureProps) {
+			const tex = matRecord[prop];
+			if (tex && tex instanceof Texture && !seen.has(tex)) {
+				seen.add(tex);
+				tex.dispose();
+			}
+		}
+	}
+	for (const { geometry } of cache.entries) geometry.dispose();
+}
+/**
+* Stable identifier for a geometry's attribute set. Used to sub-bucket geometries that
+* share a source material but have different attribute names (e.g. with vs without uv),
+* since {@link BatchedMesh.addGeometry} requires homogeneous attributes per batch.
+* @param geometry geometry to summarize
+* @returns comma-separated sorted attribute names
+*/
+function attributeSignature(geometry) {
+	return Object.keys(geometry.attributes).sort().join(",");
+}
+/**
+* Composes a per-instance world matrix from a ModelDef's bounds and the loaded GLB's
+* engine-space extents: scale uniformly to fit bounds.size in XY, rotate around Z by
+* bounds.rotation, and translate so the model sits at bounds.center with its base at
+* bounds.elevation.
+* @param def model definition
+* @param extents engine-space bounding box of the loaded GLB
+* @returns world matrix to set on a BatchedMesh instance
+*/
+function composeInstanceMatrix(def, extents) {
+	const size = extents.getSize(tempSize);
+	const center = extents.getCenter(tempCenter);
+	const sx = size.x > 0 ? def.bounds.size.x / size.x : 1;
+	const sy = size.y > 0 ? def.bounds.size.y / size.y : 1;
+	const scale = Math.min(sx, sy);
+	return new Matrix4().makeTranslation(-center.x, -center.y, -extents.min.z).premultiply(tempScale.makeScale(scale, scale, scale)).premultiply(tempRotation.makeRotationZ(def.bounds.rotation)).premultiply(tempTranslation.makeTranslation(def.bounds.center.x, def.bounds.center.y, def.bounds.elevation));
+}
+var tempSize = new Vector3();
+var tempCenter = new Vector3();
+var tempScale = new Matrix4();
+var tempRotation = new Matrix4();
+var tempTranslation = new Matrix4();
 //#endregion
 //#region src/geometry/text.ts
-var logger$9 = createLogger("text");
+var logger$10 = createLogger("text");
 /**
 * A system that handles the rendering of text defs.
 */
@@ -2286,7 +2659,7 @@ var TextSystem = class extends RenderableSystem {
 	* @param materialSystem {@link MaterialSystem}
 	*/
 	constructor(ctx, materialSystem) {
-		super("text", ctx, logger$9);
+		super("text", ctx, logger$10);
 		this.materialSystem = materialSystem;
 	}
 	dispose() {
@@ -2364,6 +2737,9 @@ var TextSystem = class extends RenderableSystem {
 		const textDefs = layer.children;
 		const batchedText = new BatchedText$1();
 		batchedText.material = this.materialSystem.createColorMaterial({ depthEnable: is3D });
+		batchedText.material.transparent = false;
+		batchedText.material.blending = CustomBlending;
+		batchedText.material.blendSrcAlpha = OneFactor;
 		const mappingData = [];
 		let instanceId = 0;
 		for (const textDef of textDefs) {
@@ -2458,7 +2834,7 @@ function setAnchorsAndAlignment(text, alignment) {
 }
 //#endregion
 //#region src/geometry/layer.ts
-var logger$8 = createLogger("layer");
+var logger$9 = createLogger("layer");
 /**
 * A system that handles the rendering of layer defs and scene graph building.
 */
@@ -2469,6 +2845,7 @@ var LayerSystem = class {
 	imageSystem;
 	textSystem;
 	lineSystem;
+	modelSystem;
 	systems;
 	mapLayerDefsToObjects = /* @__PURE__ */ new Map();
 	mapLayerDefToParent = /* @__PURE__ */ new Map();
@@ -2483,11 +2860,13 @@ var LayerSystem = class {
 		this.imageSystem = new ImageSystem(this.ctx, this.materialSystem);
 		this.textSystem = new TextSystem(this.ctx, this.materialSystem);
 		this.lineSystem = new LineSystem(this.ctx, this.materialSystem);
+		this.modelSystem = new ModelSystem(this.ctx, this.materialSystem);
 		this.systems = [
 			this.meshSystem,
 			this.imageSystem,
 			this.textSystem,
-			this.lineSystem
+			this.lineSystem,
+			this.modelSystem
 		];
 	}
 	/**
@@ -2513,14 +2892,14 @@ var LayerSystem = class {
 	*/
 	buildScene(sceneDef) {
 		const renderOrder = this.initRenderOrder(sceneDef.rootLayer).map((layer) => this.getFullLayerName(layer));
-		logger$8.debug("Render order %O", renderOrder);
+		logger$9.debug("Render order %O", renderOrder);
 		const rootGroup = new Group();
 		rootGroup.name = sceneDef.rootLayer.name;
 		this.mapLayerDefsToObjects.set(sceneDef.rootLayer, rootGroup);
 		if (sceneDef.background) rootGroup.add(this.createBackgroundLayer(sceneDef.background));
 		for (const child of sceneDef.rootLayer.children) rootGroup.add(this.buildLayer(child));
 		this.updateLayer(sceneDef.rootLayer, false);
-		printTree(rootGroup, logger$8.debug);
+		printTree(rootGroup, logger$9.debug);
 		if (sceneDef.memoryLimit) this.imageSystem.memoryLimitMb = sceneDef.memoryLimit;
 		this.imageSystem.renderAtlases();
 		return rootGroup;
@@ -2553,6 +2932,7 @@ var LayerSystem = class {
 		else if (isImageDef(def)) this.imageSystem.updateDef(def);
 		else if (isTextDef(def)) this.textSystem.updateDef(def);
 		else if (isLineDef(def)) this.lineSystem.updateDef(def);
+		else if (isModelDef(def)) this.modelSystem.updateDef(def);
 		else this.updateLayer(def, true);
 	}
 	disposeLayerTree(layerDef) {
@@ -2563,6 +2943,7 @@ var LayerSystem = class {
 		else if (isImageLayer(layerDef)) this.imageSystem.disposeLayer(layerObject);
 		else if (isTextLayer(layerDef)) this.textSystem.disposeLayer(layerObject);
 		else if (isLineLayer(layerDef)) this.lineSystem.disposeLayer(layerObject);
+		else if (isModelLayer(layerDef)) this.modelSystem.disposeLayer(layerObject);
 		this.mapLayerDefsToObjects.delete(layerDef);
 		this.mapLayerDefToParent.delete(layerDef);
 		this.renderOrderMap.delete(layerDef);
@@ -2576,6 +2957,7 @@ var LayerSystem = class {
 			else if (isLineLayer(layerDef)) this.lineSystem.updateLayer(group, layerDef);
 			else if (isTextLayer(layerDef)) this.textSystem.updateLayer(group, layerDef);
 			else if (isShapeLayer(layerDef)) this.meshSystem.updateLayer(group, layerDef);
+			else if (isModelLayer(layerDef)) this.modelSystem.updateLayer(group, layerDef);
 			this.setLayerName(group, group.name);
 		}
 		layerObject.visible = !layerDef.hidden && layerDef.children.length > 0;
@@ -2585,12 +2967,13 @@ var LayerSystem = class {
 	}
 	buildLayer(layerDef, parentPrefix = "") {
 		const layerFullName = parentPrefix + layerDef.name;
-		logger$8.debug(`Building layer ${layerFullName}...`);
+		logger$9.debug(`Building layer ${layerFullName}...`);
 		let layerObject;
 		if (isShapeLayer(layerDef)) layerObject = this.meshSystem.buildLayer(layerDef);
 		else if (isImageLayer(layerDef)) layerObject = this.imageSystem.buildLayer(layerDef);
 		else if (isTextLayer(layerDef)) layerObject = this.textSystem.buildLayer(layerDef);
 		else if (isLineLayer(layerDef)) layerObject = this.lineSystem.buildLayer(layerDef);
+		else if (isModelLayer(layerDef)) layerObject = this.modelSystem.buildLayer(layerDef);
 		else {
 			layerObject = new Group();
 			layerDef.children.map((layer) => this.buildLayer(layer, parentPrefix + `${layerDef.name}:`)).forEach((g) => layerObject.add(g));
@@ -2610,11 +2993,8 @@ var LayerSystem = class {
 	setRenderOrder(object, layer) {
 		const renderOrder = this.renderOrderMap.get(layer);
 		if (renderOrder === void 0) return;
-		if (object.isGroup) {
-			object.children.forEach((child) => this.setRenderOrder(child, layer));
-			return;
-		}
 		object.renderOrder = renderOrder;
+		if (object.isGroup) object.children.forEach((child) => this.setRenderOrder(child, layer));
 	}
 	createBackgroundLayer(color) {
 		const backgroundMesh = new Mesh(new PlaneGeometry(2, 2), this.materialSystem.createBackgroundMaterial(color));
@@ -2670,219 +3050,154 @@ var LayerSystem = class {
 //#region src/geometry/lights.ts
 /** System for managing directional lights in 3D scenes. */
 var LightsSystem = class {
-	color = 16777215;
-	intensity = .5;
+	skyColor = 16777215;
+	groundColor = 0;
+	intensity = Math.PI;
 	mapSceneToLight = /* @__PURE__ */ new Map();
+	pmremGenerator;
+	/**
+	* @param ctx {@link RendererContext} instance
+	*/
+	constructor(ctx) {
+		this.ctx = ctx;
+		this.pmremGenerator = new PMREMGenerator(this.ctx.three);
+	}
 	/**
 	* Initializes a directional light for the given scene.
 	* @param scene {@link Scene} to add the light to
 	*/
 	initLights(scene) {
-		const ambientLight = new AmbientLight(16777215, this.intensity);
-		scene.add(ambientLight);
-		const directionalLight = new DirectionalLight(this.color, this.intensity * Math.PI * 2);
+		const hemisphereLightIntensity = this.intensity * .25;
+		const hemisphereLight = new HemisphereLight(this.skyColor, this.groundColor, hemisphereLightIntensity);
+		const matrixWorldInverse = new Matrix4().copy(scene.matrixWorld).invert();
+		const position = new Vector3(0, 0, -1).applyMatrix4(matrixWorldInverse);
+		hemisphereLight.position.copy(position);
+		scene.add(hemisphereLight);
+		const directionalLightIntensity = this.intensity * .5;
+		const directionalLight = new DirectionalLight(this.skyColor, directionalLightIntensity);
 		scene.add(directionalLight);
 		scene.add(directionalLight.target);
 		this.mapSceneToLight.set(scene, directionalLight);
+		scene.environment = this.pmremGenerator.fromScene(new ColorEnvironment(), .04).texture;
+		scene.environmentIntensity = .25;
 	}
 	/**
 	* Updates the light direction to match the camera's viewing direction.
-	* @param scene {@link Scene} containing the light
+	* @param sceneState {@link SceneState} containing the light
 	* @param camera {@link Camera} to derive the light direction from
 	*/
-	updateLights(scene, camera) {
-		const light = this.mapSceneToLight.get(scene);
+	updateLights(sceneState, camera) {
+		const light = this.mapSceneToLight.get(sceneState.scene);
 		if (!light) return;
-		const e = scene.matrixWorld.elements;
-		camera.getWorldDirection(light.position).multiply({
-			x: Math.sign(e[0]),
-			y: Math.sign(e[5]),
-			z: Math.sign(e[10])
-		}).normalize().negate();
+		camera.getWorldDirection(light.position).transformDirection(sceneState.worldMatrixInverse).negate();
 	}
 };
 //#endregion
-//#region src/util/asserts.ts
-/** Logger instance for assert warnings */
-var logger$7 = createLogger("");
+//#region src/loaders/glb.ts
+var logger$8 = createLogger("glb");
 /**
-* Asserts the renderer has not been disposed.
-* @param renderer - Renderer instance to check
-* @param funcName - Name of the calling function for error messages
-* @returns false if disposed, true otherwise
+* Loads a GLB file and returns a Three.js model.
+* @param models - The models to load.
+* @returns An object containing parsed Three.js objects.
 */
-function assertNotDisposed(renderer, funcName) {
-	if (renderer.isDisposed) {
-		logger$7.warn(`[${funcName}]: Renderer is used after being disposed. Please create a new instance.`);
-		return false;
-	}
-	return true;
-}
-/**
-* Asserts the renderer has been initialized.
-* @param renderer - Renderer instance to check
-* @param funcName - Name of the calling function for error messages
-* @returns false if not initialized, true otherwise
-*/
-function assertInitialized(renderer, funcName) {
-	if (!renderer.isInitialized) {
-		logger$7.warn(`${funcName}: Renderer is not initialized. Please call init() before using it.`);
-		return false;
-	}
-	return true;
-}
-/**
-* Asserts the renderer has not been initialized yet.
-* @param renderer - Renderer instance to check
-* @param funcName - Name of the calling function for error messages
-* @returns false if already initialized, true otherwise
-*/
-function assertNotInitialized(renderer, funcName) {
-	if (renderer.isInitialized) {
-		logger$7.warn(`${funcName}: Renderer is already initialized. Please call init() only once.`);
-		return false;
-	}
-	return true;
+async function loadGLB(models) {
+	const loader = new GLTFLoader();
+	const dracoLoader = new DRACOLoader();
+	dracoLoader.setDecoderPath("https://www.gstatic.com/draco/versioned/decoders/1.5.7/");
+	const root = new Group();
+	for (const model of models) {
+		if (model.isMeshopt) loader.setMeshoptDecoder(MeshoptDecoder);
+		if (model.isDraco) loader.setDRACOLoader(dracoLoader);
+		const loadedModel = await loader.loadAsync(model.url);
+		logger$8.info("model loaded", loadedModel);
+		root.add(...loadedModel.scene.children);
+		loader.setMeshoptDecoder(null);
+		loader.setDRACOLoader(null);
+	}
+	const bounds = new Box3();
+	root.traverse((node) => {
+		if (node.userData && Object.keys(node.userData).filter((key) => key !== "name").length > 0) logger$8.info(`node ${node.name} userData:`, node.userData);
+		if (node instanceof Mesh && node.geometry) {
+			const materialJSON = node.material.toJSON();
+			logger$8.info(`node ${node.name} material %O:`, materialJSON);
+			const geometry = node.geometry;
+			if (!geometry.boundingBox) geometry.computeBoundingBox();
+			const box = geometry.boundingBox.clone();
+			box.applyMatrix4(node.matrixWorld);
+			bounds.union(box);
+		}
+	});
+	logger$8.info("model bounds", bounds);
+	root.rotation.x = -Math.PI / 2;
+	root.scale.set(1, -1, 1);
+	return {
+		sceneDef: {
+			rootLayer: {
+				children: [],
+				name: "root"
+			},
+			viewbox: new Rect([bounds.min.x, bounds.min.z], [bounds.max.x, bounds.max.z])
+		},
+		root
+	};
 }
 /**
-* Asserts the renderer is not in external mode.
-* @param renderer - Renderer instance to check
-* @param funcName - Name of the calling function for error messages
-* @returns false if in external mode, true otherwise
+* Loads a GLB file, converts it to a Three.js {@link Scene}, exports the scene as a GLTF
+* (JSON) file, and triggers a browser download of the result.
+* @param url - The URL of the GLB file.
+* @param isMeshopt - Whether the model file uses meshopt compression.
 */
-function assertNotExternalMode(renderer, funcName) {
-	if (renderer.isExternalMode) {
-		logger$7.warn(`${funcName}: This operation is not supported in external mode.`);
-		return false;
-	}
-	return true;
+async function glb2gltf(url, isMeshopt) {
+	const loader = new GLTFLoader();
+	if (isMeshopt) loader.setMeshoptDecoder(MeshoptDecoder);
+	const model = await loader.loadAsync(url);
+	logger$8.info("glb loaded for export", model);
+	const scene = new Scene();
+	for (const child of model.scene.children) scene.add(child.clone());
+	const gltf = await new GLTFExporter().parseAsync(scene);
+	logger$8.info("scene exported as gltf");
+	const filename = `${deriveBasename(url)}.gltf`;
+	saveBlob(new Blob([JSON.stringify(gltf, null, 2)], { type: "application/json" }), filename);
 }
 /**
-* Asserts that number array is a valid 4x4 matrix.
-* @param matrix number array to check
-* @param name name of the matrix for error messages
-* @param log optional logger instance to use for warning messages (defaults to root logger)
-* @returns true if matrix is valid, false otherwise
+* Loads a GLTF/GLB file and splits its top-level children into two GLB files based on
+* whether each child's name starts with `BasisTransform`. The matching children are saved
+* with a `-decor` suffix; the rest are saved with a `-base` suffix. Both files are
+* triggered as browser downloads. The output is intentionally uncompressed — run a
+* meshopt/quantize pass offline (e.g. via `gltf-transform`) afterwards.
+* @param url - The URL of the GLTF/GLB file.
 */
-function assertValidMatrix(matrix, name, log = logger$7) {
-	if (matrix.length !== 16) {
-		log.warn(`${name}: Matrix must be 16 elements long`);
-		return false;
-	}
-	return true;
+async function splitGltf(url) {
+	const model = await new GLTFLoader().loadAsync(url);
+	logger$8.info("gltf loaded for split", model);
+	const baseScene = new Scene();
+	const decorScene = new Scene();
+	for (const child of model.scene.children) (child.name.startsWith("BasisTransform") ? decorScene : baseScene).add(child.clone());
+	logger$8.info("split: base=%d decor=%d", baseScene.children.length, decorScene.children.length);
+	const exporter = new GLTFExporter();
+	const baseGlb = await exporter.parseAsync(baseScene, { binary: true });
+	const decorGlb = await exporter.parseAsync(decorScene, { binary: true });
+	const stem = deriveBasename(url);
+	saveBlob(new Blob([baseGlb], { type: "model/gltf-binary" }), `${stem}-base.glb`);
+	saveBlob(new Blob([decorGlb], { type: "model/gltf-binary" }), `${stem}-decor.glb`);
 }
-/**
-* Wraps an API object so that every method is guarded by a precondition check.
-* When the guard (or a per-method override) fails, the corresponding fallback
-* method is called instead of the real implementation.
-* Non-function properties are passed through from `impl` (if present) or `fallback`.
-* @param impl - Real implementation, or null when the backing system doesn't exist
-* @param fallback - Noop / default implementation used when guard fails or impl is null
-* @param guard - Default guard applied to every method
-* @param guards - Optional per-method guard overrides (takes precedence over `guard`)
-* @returns A new object conforming to T with every method wrapped
-*/
-function guardAPI(impl, fallback, guard, guards) {
-	const guarded = {};
-	for (const [key, fallbackVal] of Object.entries(fallback)) if (typeof fallbackVal === "function") {
-		const implFn = impl?.[key];
-		const methodGuard = guards?.[key] ?? guard;
-		const fallbackFn = fallbackVal;
-		guarded[key] = (...args) => {
-			if (methodGuard(key) && implFn) return implFn(...args);
-			return fallbackFn(...args);
-		};
-	} else guarded[key] = impl?.[key] ?? fallbackVal;
-	return guarded;
+function deriveBasename(url) {
+	return (url.split("?")[0].split("#")[0].split("/").pop() ?? "model").replace(/\.(glb|gltf)$/i, "");
 }
-//#endregion
-//#region src/space/external.ts
-var externalLogger = createLogger("external");
-/**
-* Camera system in external mode. Exposes dummy camera instance as a wrapper for external camera transforms,
-* and estimates zoom factor ndc -> world conversion.
-*/
-var ExternalCameraSystem = class {
-	/** External camera instance */
-	camera = new Camera();
-	ndcLeft = new Vector2(-1, 0);
-	ndcRight = new Vector2(1, 0);
-	intersectionPointLeft = new Vector3();
-	intersectionPointRight = new Vector3();
-	prevZoomFactor;
-	/**
-	* @param ctx {@link RendererContext} instance
-	* @param pickingSystem {@link PickingSystem} instance
-	*/
-	constructor(ctx, pickingSystem) {
-		this.ctx = ctx;
-		this.pickingSystem = pickingSystem;
-	}
-	/** Current zoom factor estimation */
-	get zoomFactor() {
-		const estimatedZoomFactor = this.estimateZoomFactor();
-		const newZoomFactor = estimatedZoomFactor ?? this.prevZoomFactor ?? 1;
-		if (estimatedZoomFactor) this.prevZoomFactor = estimatedZoomFactor;
-		return newZoomFactor;
-	}
-	/**
-	* Set the camera projection matrix.
-	* @param matrix Projection matrix
-	*/
-	setCameraProjection(matrix) {
-		if (!assertValidMatrix(matrix, "setCameraProjection", externalLogger)) return;
-		this.camera.projectionMatrix.fromArray(matrix);
-		this.camera.projectionMatrixInverse.copy(this.camera.projectionMatrix).invert();
-	}
-	estimateZoomFactor() {
-		const [bufferW, bufferH] = this.ctx.getDrawingBufferSizePx();
-		if (bufferW <= 0 || bufferH <= 0) return;
-		const worldPoint1 = this.pickingSystem.intersectPlane(this.ndcLeft, this.camera, this.intersectionPointLeft);
-		const worldPoint2 = this.pickingSystem.intersectPlane(this.ndcRight, this.camera, this.intersectionPointRight);
-		if (!worldPoint1 || !worldPoint2) return;
-		const worldLength = worldPoint2.sub(worldPoint1).length();
-		if (worldLength === 0) return;
-		return bufferW / worldLength;
-	}
-};
-var originalProjectionMatrix = new Matrix4();
-var patchedMeshes = /* @__PURE__ */ new WeakSet();
-/**
-* Three.js passes two matrices to the vertex shader as uniforms: projectionMatrix and modelViewMatrix.
-* In external mode, the scale of matrix values might be (in mapbox case it certainly is) too big for float32 precision,
-* thus introducing visual artifacts after multiplying them. This function introduces a workaround to premultiply
-* matrices on the CPU side and pass them as a single uniform. In order to not break the shader, it passes an identity
-* matrix as a second uniform. It uses material.onBeforeRender instead of object.onBeforeRender because it's called
-* after three.js own matrix calculations (https://github.com/mrdoob/three.js/blob/33b6ce05a72be0b49cc84cdbb7b5cc972036eebc/src/renderers/WebGLRenderer.js#L2097).
-* Since there is no material.onAfterRender, we use object.onAfterRender to restore camera projection matrix instead.
-* Idempotent — already-patched meshes are skipped via a WeakSet, so this can safely be called every frame.
-* @param scene {@link Scene} instance
-*/
-function patchMatricesInExternalMode(scene) {
-	scene.traverse((child) => {
-		const mesh = child;
-		if (!mesh.isMesh || patchedMeshes.has(mesh)) return;
-		patchedMeshes.add(mesh);
-		const materials = Array.isArray(mesh.material) ? mesh.material : [mesh.material];
-		for (const material of materials) {
-			const onBeforeRender = material.onBeforeRender.bind(material);
-			material.onBeforeRender = (renderer, scene, camera, geometry, object, group) => {
-				onBeforeRender(renderer, scene, camera, geometry, object, group);
-				originalProjectionMatrix.copy(camera.projectionMatrix);
-				camera.projectionMatrix.multiply(object.matrixWorld);
-				object.modelViewMatrix.identity();
-			};
-		}
-		const onAfterRender = mesh.onAfterRender.bind(mesh);
-		mesh.onAfterRender = (renderer, scene, camera, geometry, object, group) => {
-			camera.projectionMatrix.copy(originalProjectionMatrix);
-			onAfterRender(renderer, scene, camera, geometry, object, group);
-		};
-	});
+function saveBlob(blob, filename) {
+	const objectUrl = URL.createObjectURL(blob);
+	const link = document.createElement("a");
+	link.href = objectUrl;
+	link.download = filename;
+	link.style.display = "none";
+	document.body.appendChild(link);
+	link.click();
+	document.body.removeChild(link);
+	URL.revokeObjectURL(objectUrl);
 }
 //#endregion
 //#region src/ui/controls.ts
-var logger$6 = createLogger("controls");
+var logger$7 = createLogger("controls");
 /** Navigation system. Manages camera controls and zooming. */
 var ControlsSystem = class {
 	controller;
@@ -2926,7 +3241,7 @@ var ControlsSystem = class {
 		const worldRect = new Rect(this.coordinatesSystem.modelToWorld(rect.min), this.coordinatesSystem.modelToWorld(rect.max));
 		const sourceRect = Polygon.fromRect(worldRect).rotate(bearingAngle).bounds;
 		if (sourceRect.size.x <= 0 || sourceRect.size.y <= 0) {
-			logger$6.warn("zoomTo: sourceRect size is 0");
+			logger$7.warn("zoomTo: sourceRect size is 0");
 			return;
 		}
 		if (paddingPercent) targetRect.expand({
@@ -3225,7 +3540,7 @@ function asEventAPI(system) {
 }
 //#endregion
 //#region src/space/coordinates.ts
-var logger$5 = createLogger("coordinates");
+var logger$6 = createLogger("coordinates");
 /** System responsible for converting coordinates between different spaces. */
 var CoordinatesSystem = class {
 	/** Used as a scratch vector for coordinate space conversions */
@@ -3298,7 +3613,7 @@ var CoordinatesSystem = class {
 	canvasToNDC(point, out = new Vector2()) {
 		const [w, h] = this.ctx.getDrawingBufferSizePx();
 		if (w <= 0 || h <= 0) {
-			logger$5.warn("canvasToNDC: renderer size is 0");
+			logger$6.warn("canvasToNDC: renderer size is 0");
 			return out.set(0, 0);
 		}
 		const dpr = this.ctx.three.getPixelRatio();
@@ -3466,7 +3781,7 @@ function createNoopHandler() {
 	};
 }
 //#endregion
-//#region ../../node_modules/.pnpm/camera-controls@3.1.1_patch_hash=1d30d1431514ed87b48b2ec3defd4fe64eca4cb9b29373199021281dbc5d7782_three@0.174.0/node_modules/camera-controls/dist/camera-controls.module.js
+//#region ../../node_modules/.pnpm/camera-controls@3.1.1_patch_hash=1d30d1431514ed87b48b2ec3defd4fe64eca4cb9b29373199021281dbc5d7782_three@0.184.0/node_modules/camera-controls/dist/camera-controls.module.js
 /*!
 * camera-controls
 * https://github.com/yomotsu/camera-controls
@@ -5838,7 +6153,7 @@ var subsetOfTHREE = {
 	Plane
 };
 CameraControls.install({ THREE: subsetOfTHREE });
-var logger$4 = createLogger("cameraController");
+var logger$5 = createLogger("cameraController");
 /**
 * Minimum z-axis separation between overlapping surfaces, in SVG/model units.
 *
@@ -5912,7 +6227,7 @@ var CameraController = class CameraController extends CameraControls {
 					radius
 				].map((value) => +value.toFixed(2));
 				const clippingPlanes = [this.camera.near, this.camera.far];
-				logger$4.debug("camera update %O", {
+				logger$5.debug("camera update %O", {
 					position,
 					target,
 					spherical,
@@ -6567,6 +6882,100 @@ var noopHandlers = {
 	pitch: createNoopHandler()
 };
 //#endregion
+//#region src/util/asserts.ts
+/** Logger instance for assert warnings */
+var logger$4 = createLogger("");
+/**
+* Asserts the renderer has not been disposed.
+* @param renderer - Renderer instance to check
+* @param funcName - Name of the calling function for error messages
+* @returns false if disposed, true otherwise
+*/
+function assertNotDisposed(renderer, funcName) {
+	if (renderer.isDisposed) {
+		logger$4.warn(`[${funcName}]: Renderer is used after being disposed. Please create a new instance.`);
+		return false;
+	}
+	return true;
+}
+/**
+* Asserts the renderer has been initialized.
+* @param renderer - Renderer instance to check
+* @param funcName - Name of the calling function for error messages
+* @returns false if not initialized, true otherwise
+*/
+function assertInitialized(renderer, funcName) {
+	if (!renderer.isInitialized) {
+		logger$4.warn(`${funcName}: Renderer is not initialized. Please call init() before using it.`);
+		return false;
+	}
+	return true;
+}
+/**
+* Asserts the renderer has not been initialized yet.
+* @param renderer - Renderer instance to check
+* @param funcName - Name of the calling function for error messages
+* @returns false if already initialized, true otherwise
+*/
+function assertNotInitialized(renderer, funcName) {
+	if (renderer.isInitialized) {
+		logger$4.warn(`${funcName}: Renderer is already initialized. Please call init() only once.`);
+		return false;
+	}
+	return true;
+}
+/**
+* Asserts the renderer is not in external mode.
+* @param renderer - Renderer instance to check
+* @param funcName - Name of the calling function for error messages
+* @returns false if in external mode, true otherwise
+*/
+function assertNotExternalMode(renderer, funcName) {
+	if (renderer.isExternalMode) {
+		logger$4.warn(`${funcName}: This operation is not supported in external mode.`);
+		return false;
+	}
+	return true;
+}
+/**
+* Asserts that number array is a valid 4x4 matrix.
+* @param matrix number array to check
+* @param name name of the matrix for error messages
+* @param log optional logger instance to use for warning messages (defaults to root logger)
+* @returns true if matrix is valid, false otherwise
+*/
+function assertValidMatrix(matrix, name, log = logger$4) {
+	if (matrix.length !== 16) {
+		log.warn(`${name}: Matrix must be 16 elements long`);
+		return false;
+	}
+	return true;
+}
+/**
+* Wraps an API object so that every method is guarded by a precondition check.
+* When the guard (or a per-method override) fails, the corresponding fallback
+* method is called instead of the real implementation.
+* Non-function properties are passed through from `impl` (if present) or `fallback`.
+* @param impl - Real implementation, or null when the backing system doesn't exist
+* @param fallback - Noop / default implementation used when guard fails or impl is null
+* @param guard - Default guard applied to every method
+* @param guards - Optional per-method guard overrides (takes precedence over `guard`)
+* @returns A new object conforming to T with every method wrapped
+*/
+function guardAPI(impl, fallback, guard, guards) {
+	const guarded = {};
+	for (const [key, fallbackVal] of Object.entries(fallback)) if (typeof fallbackVal === "function") {
+		const implFn = impl?.[key];
+		const methodGuard = guards?.[key] ?? guard;
+		const fallbackFn = fallbackVal;
+		guarded[key] = (...args) => {
+			if (methodGuard(key) && implFn) return implFn(...args);
+			return fallbackFn(...args);
+		};
+	} else guarded[key] = impl?.[key] ?? fallbackVal;
+	return guarded;
+}
+//#endregion
 //#region src/core/updates.ts
 var logger$3 = createLogger("updates");
 /**
@@ -6752,6 +7161,85 @@ var InternalCameraSystem = class {
 	}
 };
 //#endregion
+//#region src/space/external.ts
+var externalLogger = createLogger("external");
+/**
+* Camera system in external mode. Exposes dummy camera instance as a wrapper for external camera transforms,
+* and estimates zoom factor ndc -> world conversion.
+*/
+var ExternalCameraSystem = class {
+	/** External camera instance */
+	camera = new Camera();
+	ndcLeft = new Vector2(-1, 0);
+	ndcRight = new Vector2(1, 0);
+	intersectionPointLeft = new Vector3();
+	intersectionPointRight = new Vector3();
+	prevZoomFactor;
+	mainMatrix4 = new Matrix4();
+	mainMatrixInverse = new Matrix4();
+	nearPoint = new Vector3();
+	farPoint = new Vector3();
+	viewDir = new Vector3();
+	target = new Vector3();
+	up = new Vector3();
+	cameraPos = new Vector3();
+	linearSystem = new Matrix3();
+	rhs = new Vector3();
+	/**
+	* @param ctx {@link RendererContext} instance
+	* @param pickingSystem {@link PickingSystem} instance
+	*/
+	constructor(ctx, pickingSystem) {
+		this.ctx = ctx;
+		this.pickingSystem = pickingSystem;
+		this.camera.matrixAutoUpdate = false;
+		this.camera.matrixWorldAutoUpdate = false;
+	}
+	/** Current zoom factor estimation */
+	get zoomFactor() {
+		const estimatedZoomFactor = this.estimateZoomFactor();
+		const newZoomFactor = estimatedZoomFactor ?? this.prevZoomFactor ?? 1;
+		if (estimatedZoomFactor) this.prevZoomFactor = estimatedZoomFactor;
+		return newZoomFactor;
+	}
+	/**
+	* Decompose the combined world-to-clip-space matrix into a rigid view matrix and a projection
+	* matrix, then publish all four matrices (and their inverses) on the underlying camera.
+	* @param mainMatrix Combined matrix mapping world space directly to clip space.
+	*/
+	setCameraProjection(mainMatrix) {
+		if (!assertValidMatrix(mainMatrix, "setCameraProjection", externalLogger)) return;
+		const M = this.mainMatrix4.fromArray(mainMatrix);
+		const e = M.elements;
+		this.mainMatrixInverse.copy(M).invert();
+		this.linearSystem.set(e[0], e[4], e[8], e[1], e[5], e[9], e[3], e[7], e[11]);
+		this.rhs.set(-e[12], -e[13], -e[15]);
+		this.cameraPos.copy(this.rhs).applyMatrix3(this.linearSystem.invert());
+		this.nearPoint.set(0, 0, 1).applyMatrix4(this.mainMatrixInverse);
+		this.farPoint.set(0, 0, -1).applyMatrix4(this.mainMatrixInverse);
+		this.viewDir.copy(this.farPoint).sub(this.nearPoint).normalize();
+		this.up.set(0, 0, 1);
+		if (Math.abs(this.up.dot(this.viewDir)) > .999) this.up.set(0, 1, 0);
+		this.target.copy(this.cameraPos).add(this.viewDir);
+		const camera = this.camera;
+		camera.matrixWorld.lookAt(this.cameraPos, this.target, this.up);
+		camera.matrixWorld.setPosition(this.cameraPos);
+		camera.matrixWorldInverse.copy(camera.matrixWorld).invert();
+		camera.projectionMatrix.multiplyMatrices(M, camera.matrixWorld);
+		camera.projectionMatrixInverse.copy(camera.projectionMatrix).invert();
+	}
+	estimateZoomFactor() {
+		const [bufferW, bufferH] = this.ctx.getDrawingBufferSizePx();
+		if (bufferW <= 0 || bufferH <= 0) return;
+		const worldPoint1 = this.pickingSystem.intersectPlane(this.ndcLeft, this.camera, this.intersectionPointLeft);
+		const worldPoint2 = this.pickingSystem.intersectPlane(this.ndcRight, this.camera, this.intersectionPointRight);
+		if (!worldPoint1 || !worldPoint2) return;
+		const worldLength = worldPoint2.sub(worldPoint1).length();
+		if (worldLength === 0) return;
+		return bufferW / worldLength;
+	}
+};
+//#endregion
 //#region src/space/picking.ts
 /**
 * Picking subsystem.
@@ -6826,7 +7314,8 @@ var SceneSystem = class {
 	* @returns Scale factor (model space to world space)
 	*/
 	scaleFactor(sceneId) {
-		return this.getSceneStateById(sceneId).worldMatrix.elements[0];
+		const sceneState = this.getSceneStateById(sceneId);
+		return Math.abs(sceneState.worldMatrix.elements[0]);
 	}
 	/**
 	* Register a new scene from it's definition
@@ -7194,7 +7683,7 @@ var Renderer = class {
 		this.renderer.autoClear = !this.isExternalMode;
 		this.ctx = this.createRendererContext();
 		this.eventSystem = new EventSystem();
-		this.lightsSystem = new LightsSystem();
+		this.lightsSystem = new LightsSystem(this.ctx);
 		this.layerSystem = new LayerSystem(this.ctx);
 		this.viewportSystem = new ViewportSystem(this.ctx, this.eventSystem);
 		this.updatesSystem = new UpdatesSystem(this.ctx, this.layerSystem);
@@ -7293,6 +7782,18 @@ var Renderer = class {
 		return this.disposed;
 	}
 	/**
+	* Loads a GLB file and returns a Three.js model.
+	* @param models - The models to load.
+	*/
+	async loadModel(models) {
+		this.init();
+		const { root, sceneDef } = await loadGLB(models);
+		const scene = this.viewportSystem.initScene(sceneDef);
+		scene.background = new Color(15461355);
+		scene.add(root);
+		this.lightsSystem.initLights(scene);
+	}
+	/**
 	* Initializes viewport and scene with the given scene definition.
 	* Should be called once on startup. Repeated calls will produce console warnings.
 	* @param sceneDef {@link SceneDef} to render
@@ -7361,6 +7862,7 @@ var Renderer = class {
 				} else if (sceneState.scene.children.length === 0) {
 					const root = this.layerSystem.buildScene(sceneState.sceneDef);
 					scene.add(root);
+					this.lightsSystem.initLights(scene);
 				}
 			}
 			const justLoaded = loadedChanged && sceneState.loaded;
@@ -7368,8 +7870,7 @@ var Renderer = class {
 			this.viewportSystem.updatePtScale(id);
 			const hasDefsUpdated = this.updatesSystem.processPendingUpdates(frustum, 3);
 			const forceRedraw = hasControlsUpdated || hasDefsUpdated || justLoaded || this.isExternalMode || this.ui;
-			if (this.isExternalMode) patchMatricesInExternalMode(scene);
-			this.lightsSystem.updateLights(scene, camera);
+			this.lightsSystem.updateLights(sceneState, camera);
 			if (this.needsRedraw || forceRedraw) this.renderer.render(scene, camera);
 			if (hasDefsUpdated || this.needsRedraw) this.viewportSystem.invalidateSceneBounds(sceneState);
 		}
@@ -7475,4 +7976,4 @@ var Renderer = class {
 	}
 };
 //#endregion
-export { Polygon, Rect, Renderer, isImageDef, isImageLayer, isLayerDef, isLayerLayer, isLineDef, isLineLayer, isShapeDef, isShapeLayer, isTextDef, isTextLayer };
+export { Polygon, Rect, Renderer, glb2gltf, isImageDef, isImageLayer, isLayerDef, isLayerLayer, isLineDef, isLineLayer, isModelDef, isModelLayer, isShapeDef, isShapeLayer, isTextDef, isTextLayer, splitGltf };