minerender 2.1.0-alpha.52 → 2.1.0-alpha.54

package/dist/bundle.js

@@ -33153,6 +33153,71 @@ var MineRender = (() => {
             alphaTest: 0.5
           });
         }
+        /** Whether vanilla's render type for the mode culls back faces. */
+        static entityModeCulls(mode2 = "cutout") {
+          return mode2 === "cutout_cull" || mode2 === "solid" || mode2 === "eyes" || mode2 === "water_mask";
+        }
+        /** UV offset per tick of entity age for the scrolling modes, as vanilla's texture matrix applies it. */
+        static entityModeScroll(mode2 = "cutout") {
+          if (mode2 === "energy_swirl") return [0.01, 0.01];
+          if (mode2 === "breeze_wind") return [0.02, 0];
+          return void 0;
+        }
+        /**
+         * Entity material for one of vanilla's render types. Entities are unlit here, so the lit and full-bright modes
+         * differ only in blending and depth state. Culling is not a material property: {@link entityModeCulls} decides
+         * whether the geometry gets inward faces.
+         */
+        static createEntityCanvasMaterial(canvas, mode2 = "cutout", tint) {
+          const material = _Materials.createBasicCanvasMaterial(canvas);
+          switch (mode2) {
+            case "cutout":
+            case "cutout_cull":
+              break;
+            case "cutout_z_offset":
+              material.polygonOffset = true;
+              material.polygonOffsetFactor = -1;
+              material.polygonOffsetUnits = -10;
+              break;
+            case "solid":
+              material.alphaTest = 0;
+              break;
+            case "translucent":
+            case "breeze_wind":
+              material.transparent = true;
+              material.alphaTest = 0.1;
+              break;
+            case "translucent_emissive":
+              material.transparent = true;
+              material.alphaTest = 0.1;
+              material.depthWrite = false;
+              break;
+            case "eyes":
+              material.transparent = true;
+              material.alphaTest = 0;
+              material.depthWrite = false;
+              break;
+            case "energy_swirl":
+              material.transparent = true;
+              material.alphaTest = 0.1;
+              material.blending = CustomBlending;
+              material.blendSrc = OneFactor;
+              material.blendDst = OneFactor;
+              material.blendSrcAlpha = ZeroFactor;
+              material.blendDstAlpha = OneFactor;
+              material.color.set(8421504);
+              break;
+            case "water_mask":
+              material.alphaTest = 0;
+              material.colorWrite = false;
+              break;
+          }
+          if (_Materials.entityModeScroll(mode2)) {
+            material.map.wrapS = material.map.wrapT = RepeatWrapping;
+          }
+          if (tint !== void 0) material.color.multiply(new Color(tint));
+          return material;
+        }
         static createGuiCanvasMaterial(canvas) {
           const material = new MeshBasicMaterial({
             map: Textures.createCanvasTexture(canvas),
@@ -79134,51 +79199,6 @@ ${key}` : key;
     }
   });
 
-  // src/model/ModelCulling.ts
-  var ModelCulling;
-  var init_ModelCulling = __esm({
-    "src/model/ModelCulling.ts"() {
-      init_dirname();
-      init_buffer2();
-      init_process2();
-      init_three_module();
-      init_CubeFace();
-      ModelCulling = class {
-        static toLocalMask(worldMask, rotation) {
-          let localMask = 0;
-          for (const [localFace, offset] of CUBE_FACE_OFFSETS.entries()) {
-            const normal = new Vector3(...offset).applyEuler(rotation);
-            const worldFace = CUBE_FACE_OFFSETS.findIndex(([x4, y5, z4]) => Math.abs(normal.x - x4) < 1e-6 && Math.abs(normal.y - y5) < 1e-6 && Math.abs(normal.z - z4) < 1e-6);
-            if (worldFace < 0) return 0;
-            if (worldMask & 1 << worldFace) localMask |= 1 << localFace;
-          }
-          return localMask;
-        }
-        static isOpaqueFullCube(atlas) {
-          if (!atlas || atlas.hasTransparency !== false || atlas.model.elements?.length !== 1) return false;
-          const element = atlas.model.elements[0];
-          if (element.from.length !== 3 || !element.from.every((value) => value === 0) || element.to.length !== 3 || !element.to.every((value) => value === 16) || element.rotation && element.rotation.angle !== 0 || element.mappedUv?.length !== 48 || !element.mappedUv.every(Number.isFinite)) return false;
-          if (!(atlas.image.width > 0 && atlas.image.height > 0)) return false;
-          return CUBE_FACES.every((face, faceIndex) => {
-            const texture = element.faces[face]?.texture;
-            if (!texture?.startsWith("#")) return false;
-            const key = texture.slice(1);
-            const position = atlas.positions[key];
-            const size = atlas.sizes[key];
-            if (position?.length !== 2 || !position.every(Number.isFinite) || size?.length !== 2 || !size.every((value) => value > 0 && Number.isFinite(value))) return false;
-            for (let vertex2 = 0; vertex2 < 4; vertex2++) {
-              const uvIndex = (faceIndex * 4 + vertex2) * 2;
-              const x4 = element.mappedUv[uvIndex] * atlas.image.width;
-              const y5 = (1 - element.mappedUv[uvIndex + 1]) * atlas.image.height;
-              if (x4 < position[0] - 1e-6 || x4 > position[0] + size[0] + 1e-6 || y5 < position[1] - 1e-6 || y5 > position[1] + size[1] + 1e-6) return false;
-            }
-            return true;
-          });
-        }
-      };
-    }
-  });
-
   // src/three/BufferGeometryUtils.js
   function computeTangents(geometry) {
     geometry.computeTangents();
@@ -79718,11 +79738,56 @@ ${key}` : key;
     }
   });
 
+  // src/model/ModelCulling.ts
+  var ModelCulling;
+  var init_ModelCulling = __esm({
+    "src/model/ModelCulling.ts"() {
+      init_dirname();
+      init_buffer2();
+      init_process2();
+      init_three_module();
+      init_CubeFace();
+      ModelCulling = class {
+        static toLocalMask(worldMask, rotation) {
+          let localMask = 0;
+          for (const [localFace, offset] of CUBE_FACE_OFFSETS.entries()) {
+            const normal = new Vector3(...offset).applyEuler(rotation);
+            const worldFace = CUBE_FACE_OFFSETS.findIndex(([x4, y5, z4]) => Math.abs(normal.x - x4) < 1e-6 && Math.abs(normal.y - y5) < 1e-6 && Math.abs(normal.z - z4) < 1e-6);
+            if (worldFace < 0) return 0;
+            if (worldMask & 1 << worldFace) localMask |= 1 << localFace;
+          }
+          return localMask;
+        }
+        static isOpaqueFullCube(atlas) {
+          if (!atlas || atlas.hasTransparency !== false || atlas.model.elements?.length !== 1) return false;
+          const element = atlas.model.elements[0];
+          if (element.from.length !== 3 || !element.from.every((value) => value === 0) || element.to.length !== 3 || !element.to.every((value) => value === 16) || element.rotation && element.rotation.angle !== 0 || element.mappedUv?.length !== 48 || !element.mappedUv.every(Number.isFinite)) return false;
+          if (!(atlas.image.width > 0 && atlas.image.height > 0)) return false;
+          return CUBE_FACES.every((face, faceIndex) => {
+            const texture = element.faces[face]?.texture;
+            if (!texture?.startsWith("#")) return false;
+            const key = texture.slice(1);
+            const position = atlas.positions[key];
+            const size = atlas.sizes[key];
+            if (position?.length !== 2 || !position.every(Number.isFinite) || size?.length !== 2 || !size.every((value) => value > 0 && Number.isFinite(value))) return false;
+            for (let vertex2 = 0; vertex2 < 4; vertex2++) {
+              const uvIndex = (faceIndex * 4 + vertex2) * 2;
+              const x4 = element.mappedUv[uvIndex] * atlas.image.width;
+              const y5 = (1 - element.mappedUv[uvIndex + 1]) * atlas.image.height;
+              if (x4 < position[0] - 1e-6 || x4 > position[0] + size[0] + 1e-6 || y5 < position[1] - 1e-6 || y5 > position[1] + size[1] + 1e-6) return false;
+            }
+            return true;
+          });
+        }
+      };
+    }
+  });
+
   // src/model/scene/ModelObject.ts
   function isModelObject(obj) {
     return obj.isModelObject;
   }
-  var import_ts_deepmerge5, p12, _ModelObject, ModelObject;
+  var import_ts_deepmerge5, p10, _ModelObject, ModelObject;
   var init_ModelObject = __esm({
     "src/model/scene/ModelObject.ts"() {
       init_dirname();
@@ -79739,7 +79804,7 @@ ${key}` : key;
       init_CubeFace();
       init_DisplayTransforms();
       init_ModelCulling();
-      p12 = prefix("ModelObject");
+      p10 = prefix("ModelObject");
       _ModelObject = class _ModelObject extends SceneObject {
         constructor(originalModel, options) {
           super(options);
@@ -79818,10 +79883,10 @@ ${key}` : key;
                 }
               });
             } else {
-              console.debug(p12, this.atlas.model, "has no elements");
+              console.debug(p10, this.atlas.model, "has no elements");
             }
           } else {
-            console.debug(p12, "Missing atlas for", this);
+            console.debug(p10, "Missing atlas for", this);
           }
           if (this.options.mergeMeshes) {
             let combinedGeo;
@@ -83512,32 +83577,44 @@ ${key}` : key;
     static async getLayerList(modelKey) {
       return Object.keys((await this.getModelFile(modelKey))?.layers ?? {});
     }
+    /** The dataset's extra draws on top of `main`; their `when` labels are the states `EntityModelOptions.when` can enable. */
+    static async getPassList(modelKey) {
+      return (await this.getModelFile(modelKey))?.passes ?? [];
+    }
     static async getEntity(modelKey, textureKey, options) {
       const model = await this.getModelFile(modelKey);
       if (!model) return void 0;
-      const names = [...new Set(options?.layers ?? [options?.layer ?? "main"])];
-      if (names.length === 0) throw new MineRenderError(`Entity ${model.id} requires at least one layer`);
-      const selected = names.map((name2) => {
-        const layer = model.layers[name2];
+      const passes = options?.layers || options?.layer !== void 0 ? [] : (model.passes ?? []).filter((pass) => pass.when === void 0 || options?.when?.includes(pass.when));
+      const draws = [...new Set(options?.layers ?? [options?.layer ?? "main"])].map((layer) => ({ layer }));
+      if (draws.length === 0) throw new MineRenderError(`Entity ${model.id} requires at least one layer`);
+      draws.push(...passes);
+      const names = [];
+      const selected = draws.map((pass) => {
+        const layer = model.layers[pass.layer];
         if (!layer) {
-          throw new MineRenderError(`Entity ${model.id} has no layer "${name2}". Available layers: ${Object.keys(model.layers).join(", ")}`);
+          throw new MineRenderError(`Entity ${model.id} has no layer "${pass.layer}". Available layers: ${Object.keys(model.layers).join(", ")}`);
         }
-        return { name: name2, layer };
+        let name2 = pass.layer;
+        for (let n4 = 2; names.includes(name2); n4++) name2 = `${pass.layer}#${n4}`;
+        names.push(name2);
+        return { name: name2, layer, pass };
       });
-      const layers = Object.fromEntries(await Promise.all(selected.map(async ({ name: name2, layer }, index) => {
+      const layers = Object.fromEntries(await Promise.all(selected.map(async ({ name: name2, layer, pass }, index) => {
         const override = options?.textures?.[name2] ?? (index === 0 ? textureKey : void 0);
+        const textureLocation = pass.textureLocation ?? layer.textureLocation;
         let texture;
         if (override) {
           const path = isAssetKey(override) ? override.getFullPath() : override.path;
           texture = isAssetKey(override) && override.assetType === "textures" && path.startsWith("entity/") ? override : new AssetKey(override.namespace, path, "textures", "entity", "assets", ".png", isAssetKey(override) ? override.root : void 0);
-        } else if (layer.textureLocation !== void 0) {
-          texture = AssetKey.parse("textures", layer.textureLocation.replace(/^([^:]+:)?textures\//, "$1"));
+        } else if (textureLocation !== void 0) {
+          texture = AssetKey.parse("textures", textureLocation.replace(/^([^:]+:)?textures\//, "$1"));
         } else {
           texture = await this.resolveTexture(modelKey);
         }
-        return [name2, { key: override ?? modelKey, texture, layer }];
+        const render = pass.render ?? layer.render;
+        return [name2, { key: override ?? modelKey, texture, layer, ...render && { render }, ...pass.tint && { tint: pass.tint } }];
       })));
-      return { ...layers[names[0]], id: model.id, layers };
+      return { ...layers[names[0]], id: model.id, layers, ...model.transform && { transform: model.transform } };
     }
     static async resolveTexture(modelKey) {
       const path = isAssetKey(modelKey) ? modelKey.getFullPath() : modelKey.path;
@@ -83672,6 +83749,7 @@ ${key}` : key;
   init_Caching();
   var import_ts_deepmerge4 = __toESM(require_dist());
   init_three_module();
+  init_Ticker();
   init_model();
   init_ModelTextures();
   init_AssetKey();
@@ -83683,6 +83761,10 @@ ${key}` : key;
       this.entity = entity;
       this.isEntityObject = true;
       this.meshesCreated = false;
+      /** Scrolling materials are owned: their texture offset follows this entity's age. */
+      this.scrollMaterials = [];
+      /** Entity age in ticks, as vanilla's `ageInTicks`; drives the scrolling render modes. */
+      this.age = 0;
       this.options = (0, import_ts_deepmerge4.default)({}, _EntityObject.DEFAULT_OPTIONS, options ?? {});
     }
     async init() {
@@ -83692,6 +83774,25 @@ ${key}` : key;
     dispose() {
       super.dispose();
     }
+    disposeAndRemoveAllChildren() {
+      this.clearScrollMaterials();
+      super.disposeAndRemoveAllChildren();
+    }
+    clearScrollMaterials() {
+      Ticker.remove(this.scrollTicker);
+      this.scrollTicker = void 0;
+      for (const { material } of this.scrollMaterials.splice(0)) {
+        material.map?.dispose();
+        material.dispose();
+      }
+    }
+    /** Applies the entity age to the scrolling materials; the ticker calls this 20 times per second. */
+    updateScroll() {
+      for (const { offset, speed } of this.scrollMaterials) {
+        offset.set(this.age * speed[0] % 1, 0 - this.age * speed[1] % 1);
+      }
+      this.notifyDirty();
+    }
     getLayerGroup(name2) {
       return super.getGroupByName(`layer:${name2}`);
     }
@@ -83722,16 +83823,29 @@ ${key}` : key;
     createMeshes(force = false) {
       if (this.meshesCreated && !force) return;
       const modelRoot = new Object3D();
-      if (this.options.flip) modelRoot.scale.set(-1, -1, 1);
+      const transform = this.options.flip === void 0 ? this.entity.transform : void 0;
+      if (transform) {
+        for (const op of transform) {
+          const matrix = new Matrix4();
+          if ("scale" in op) matrix.makeScale(...op.scale);
+          else if ("translate" in op) matrix.makeTranslation(...op.translate);
+          else matrix.makeRotationFromEuler(new Euler(...op.rotate, "ZYX"));
+          modelRoot.matrix.multiply(matrix);
+        }
+        modelRoot.matrixAutoUpdate = false;
+      } else if (this.options.flip ?? true) {
+        modelRoot.scale.set(-1, -1, 1);
+      }
       this.add(modelRoot);
       Object.entries(this.entityLayers).forEach(([name2, layer], index) => {
         const group = this.createGroup(`layer:${name2}`);
         modelRoot.add(group);
-        this.createPart("root", layer.layer.root, group, layer.layer.texture, Materials.MISSING_TEXTURE, index);
+        const inward = !Materials.entityModeCulls(layer.render ?? layer.layer.render);
+        this.createPart("root", layer.layer.root, group, layer.layer.texture, Materials.MISSING_TEXTURE, index, inward);
       });
       this.meshesCreated = true;
     }
-    createPart(name2, part, parent, textureSize, material, renderOrder) {
+    createPart(name2, part, parent, textureSize, material, renderOrder, inward = true) {
       const anchor = this.createGroup(name2);
       anchor.position.fromArray(part.pose.offset);
       anchor.rotation.set(...part.pose.rotation, "ZYX");
@@ -83750,7 +83864,7 @@ ${key}` : key;
           uv
         ).clone();
         geometry.translate(cube.origin[0] + width / 2, cube.origin[1] + height / 2, cube.origin[2] + depth / 2);
-        if (Math.min(width + growX * 2, height + growY * 2, depth + growZ * 2) > 0) {
+        if (inward && Math.min(width + growX * 2, height + growY * 2, depth + growZ * 2) > 0) {
           const index = Array.from(geometry.getIndex().array);
           geometry.setIndex(index.concat(index.slice().reverse()));
         }
@@ -83760,30 +83874,46 @@ ${key}` : key;
         if (this.options.wireframe) addWireframeToMesh(geometry, mesh);
       }
       for (const [childName, child] of Object.entries(part.children)) {
-        this.createPart(childName, child, anchor, size, material, renderOrder);
+        this.createPart(childName, child, anchor, size, material, renderOrder, inward);
       }
     }
     async applyTextures() {
+      this.clearScrollMaterials();
       await Promise.all(Object.entries(this.entityLayers).map(async ([name2, layer]) => {
+        const mode2 = layer.render ?? layer.layer.render ?? "cutout";
+        const tint = layer.tint === void 0 ? void 0 : this.options.tints?.[layer.tint];
+        const scroll = Materials.entityModeScroll(mode2);
         const assetKeyStr = this.getTextureKey(layer).serialize();
-        const keyStr = `entity:${assetKeyStr}`;
-        let mat = Caching.materialCache.getIfPresent(keyStr);
+        const keyStr = `entity:${mode2}:${tint === void 0 ? "" : new Color(tint).getHexString()}:${assetKeyStr}`;
+        let mat = scroll ? void 0 : Caching.materialCache.getIfPresent(keyStr);
         if (!mat) {
           const cachedAsset = Caching.textureAssetCache.getIfPresent(assetKeyStr);
           const imageData = await this.loadTextures(layer);
           if (!imageData) return;
           const canvas = imageData.data.canvas;
-          const createMaterial = () => Materials.createBasicCanvasMaterial(canvas);
-          mat = cachedAsset && Caching.textureAssetCache.getIfPresent(assetKeyStr) === cachedAsset ? Caching.materialCache.get(keyStr, createMaterial) : createMaterial();
+          const createMaterial = () => Materials.createEntityCanvasMaterial(canvas, mode2, tint);
+          mat = !scroll && cachedAsset && Caching.textureAssetCache.getIfPresent(assetKeyStr) === cachedAsset ? Caching.materialCache.get(keyStr, createMaterial) : createMaterial();
+          if (scroll) {
+            this.scrollMaterials.push({ material: mat, offset: mat.map.offset, speed: scroll });
+          }
         }
         this.getLayerGroup(name2)?.traverse((object) => {
           if (isMesh(object)) object.material = mat;
         });
       }));
+      if (!this.children.length) {
+        this.clearScrollMaterials();
+      } else if (this.scrollMaterials.length) {
+        this.updateScroll();
+        this.scrollTicker = Ticker.add(() => {
+          this.age++;
+          this.updateScroll();
+        });
+      }
       this.notifyDirty();
     }
   };
-  _EntityObject.DEFAULT_OPTIONS = (0, import_ts_deepmerge4.default)({}, SceneObject.DEFAULT_OPTIONS, { flip: true });
+  _EntityObject.DEFAULT_OPTIONS = (0, import_ts_deepmerge4.default)({}, SceneObject.DEFAULT_OPTIONS);
   var EntityObject = _EntityObject;
   function isEntityObject(obj) {
     return obj.isEntityObject;
@@ -86328,11 +86458,69 @@ property list uchar int vertex_index
   init_dirname();
   init_buffer2();
   init_process2();
+  init_AssetKey();
   var GuiHelper = class {
     static inventorySlot(slot, origin = [0, 0], offset = [18, 18], rowSize = 9) {
       const [column, row] = typeof slot === "number" ? [slot % rowSize, Math.floor(slot / rowSize)] : slot;
       return [origin[0] + column * offset[0], origin[1] + row * offset[1]];
     }
+    /** Creates crafting-table layers for ingredients and the result; stack counts are not drawn. */
+    static recipe(recipe, options = {}) {
+      const layers = [
+        { name: "background", texture: "minecraft:gui/container/crafting_table", crop: [0, 0, 176, 166] }
+      ];
+      const itemKey = (ingredient) => {
+        const item = typeof ingredient === "string" && !ingredient.startsWith("#") ? ingredient : typeof ingredient === "object" && "item" in ingredient ? ingredient.item : options.resolveIngredient?.(ingredient);
+        if (isAssetKey(item)) return item;
+        if (!item || item.startsWith("#")) {
+          throw new Error(`Select a concrete item for recipe ingredient ${JSON.stringify(ingredient)}`);
+        }
+        const key = AssetKey.parse("models", item);
+        return new AssetKey(key.namespace, key.getFullPath(), "models", "item");
+      };
+      const addIngredient = (ingredient, slot) => {
+        layers.push({
+          name: `ingredient-${slot}`,
+          item: itemKey(ingredient),
+          position: this.inventorySlot(slot, [30, 17], [18, 18], 3)
+        });
+      };
+      switch (recipe.type) {
+        case "minecraft:crafting_shaped":
+        case "crafting_shaped": {
+          const pattern = recipe.pattern;
+          if (!pattern.length || pattern.length > 3 || !pattern[0].length || pattern[0].length > 3 || pattern.some((row) => row.length !== pattern[0].length)) {
+            throw new Error("Crafting patterns must be rectangular, with 1\u20133 rows and columns");
+          }
+          const cells = pattern.flatMap((row, y5) => row.split("").map((symbol, x4) => ({ symbol, x: x4, y: y5 }))).filter((cell) => cell.symbol !== " ");
+          if (!cells.length) throw new Error("Crafting patterns must contain an ingredient");
+          const minX = Math.min(...cells.map((cell) => cell.x)), maxX = Math.max(...cells.map((cell) => cell.x));
+          const minY = Math.min(...cells.map((cell) => cell.y)), maxY = Math.max(...cells.map((cell) => cell.y));
+          const offsetX = minX === maxX ? 1 : 0, offsetY = minY === maxY ? 1 : 0;
+          for (const { symbol, x: x4, y: y5 } of cells) {
+            const ingredient = recipe.key[symbol];
+            if (!ingredient) throw new Error(`Missing recipe ingredient for symbol ${JSON.stringify(symbol)}`);
+            addIngredient(ingredient, (y5 - minY + offsetY) * 3 + x4 - minX + offsetX);
+          }
+          break;
+        }
+        case "minecraft:crafting_shapeless":
+        case "crafting_shapeless":
+          if (!recipe.ingredients.length || recipe.ingredients.length > 9) {
+            throw new Error("Shapeless crafting recipes require 1\u20139 ingredients");
+          }
+          recipe.ingredients.forEach(addIngredient);
+          break;
+        default:
+          throw new Error(`Unsupported crafting recipe type: ${recipe.type}`);
+      }
+      layers.push({
+        name: "result",
+        item: itemKey("id" in recipe.result ? recipe.result.id : recipe.result.item),
+        position: [124, 35]
+      });
+      return layers;
+    }
   };
 
   // src/gui/GuiLayer.ts
@@ -86352,9 +86540,24 @@ property list uchar int vertex_index
   init_three_module();
   init_AssetKey();
   init_ModelTextures();
+  init_Models();
   init_Caching();
   init_SceneObject();
   init_Materials();
+  init_ModelObject();
+  init_DisplayPosition();
+
+  // src/model/GuiLight.ts
+  init_dirname();
+  init_buffer2();
+  init_process2();
+  var GuiLight = /* @__PURE__ */ ((GuiLight2) => {
+    GuiLight2["FRONT"] = "front";
+    GuiLight2["SIDE"] = "side";
+    return GuiLight2;
+  })(GuiLight || {});
+
+  // src/gui/scene/GuiObject.ts
   var GuiObject = class extends SceneObject {
     constructor(textureLayers, options) {
       super({ ...options, instanceMeshes: false, mergeMeshes: false });
@@ -86369,13 +86572,34 @@ property list uchar int vertex_index
     async init() {
       if (this.initialized) return;
       try {
+        let depth = 0;
         for (const [index, layer] of this.textureLayers.entries()) {
+          const [x4, y5] = layer.position ?? [0, 0];
+          if ("item" in layer) {
+            const [width2, height2] = layer.size ?? [16, 16];
+            const item = await this.createItem(layer, index);
+            item.position.set(x4 + width2 / 2, -y5 - height2 / 2, 0);
+            item.scale.set(width2 / 16, height2 / 16, width2 / 16);
+            item.updateMatrix();
+            const bounds = new Box3();
+            item.iterateAllMeshes((mesh2) => {
+              mesh2.geometry.computeBoundingBox();
+              bounds.union(mesh2.geometry.boundingBox);
+            });
+            bounds.applyMatrix4(item.matrix);
+            item.position.z = depth - bounds.min.z;
+            depth += bounds.max.z - bounds.min.z + 0.01;
+            this.bounds.expandByPoint(new Vector2(x4, y5));
+            this.bounds.expandByPoint(new Vector2(x4 + width2, y5 + height2));
+            this.bounds.expandByPoint(new Vector2(bounds.min.x, -bounds.max.y));
+            this.bounds.expandByPoint(new Vector2(bounds.max.x, -bounds.min.y));
+            continue;
+          }
           const key = typeof layer.texture === "string" ? AssetKey.parse("textures", layer.texture) : layer.texture;
           const material = await this.loadMaterial(key);
           const image = material.map.image;
           const [cropX, cropY, cropWidth, cropHeight] = layer.crop ?? [0, 0, image.width, image.height];
           const [width, height] = layer.size ?? [cropWidth, cropHeight];
-          const [x4, y5] = layer.position ?? [0, 0];
           const geometry = new PlaneGeometry(width, height);
           this.geometries.add(geometry);
           const uv = geometry.getAttribute("uv");
@@ -86388,12 +86612,14 @@ property list uchar int vertex_index
           }
           const mesh = new Mesh(geometry, material);
           mesh.name = `mesh:${layer.name ?? index}`;
-          mesh.position.set(x4 + width / 2, -y5 - height / 2, 0);
+          mesh.position.set(x4 + width / 2, -y5 - height / 2, depth);
           mesh.renderOrder = index;
           this.add(mesh);
           this.bounds.expandByPoint(new Vector2(x4, y5));
           this.bounds.expandByPoint(new Vector2(x4 + width, y5 + height));
+          depth += 0.01;
         }
+        for (const child of this.children) child.position.z -= depth - 0.01;
         this.initialized = true;
         this.notifyDirty();
       } catch (error) {
@@ -86401,6 +86627,32 @@ property list uchar int vertex_index
         throw error;
       }
     }
+    async createItem(layer, index) {
+      const key = typeof layer.item === "string" ? AssetKey.parse("models", layer.item) : layer.item;
+      const model = await Models.getMerged(key);
+      if (!model) throw new Error(`Could not load GUI item ${key.toNamespacedString()}`);
+      const item = new ModelObject(model, {
+        displayPosition: "gui" /* GUI */,
+        tints: layer.tints,
+        instanceMeshes: false,
+        mergeMeshes: true
+      });
+      item.name = `group:${layer.name ?? index}`;
+      this.add(item);
+      await item.init();
+      item.iterateAllMeshes((mesh) => {
+        this.geometries.add(mesh.geometry);
+        mesh.name = `mesh:${layer.name ?? index}`;
+        mesh.renderOrder = index;
+        for (const material of Array.isArray(mesh.material) ? mesh.material : [mesh.material]) {
+          material.transparent = true;
+          if (model.gui_light === "front" /* FRONT */ && material.uniforms?.SHADE) {
+            material.uniforms.SHADE.value = false;
+          }
+        }
+      });
+      return item;
+    }
     async loadMaterial(key) {
       const assetKey = key.serialize();
       const materialKey = `gui:${assetKey}`;
@@ -86452,7 +86704,7 @@ property list uchar int vertex_index
   init_util();
   init_log();
   init_three();
-  var p10 = prefix("SceneInspector");
+  var p11 = prefix("SceneInspector");
   var help = "<span>Ctrl/Cmd+Click to Select<br/></span><br/>";
   var SceneInspector = class {
     constructor(renderer) {
@@ -86546,7 +86798,7 @@ property list uchar int vertex_index
     }
     selectObject(targetObject, targetIntersection, instance = this.getIntersectionInstance(targetIntersection)) {
       this.selectedObject = targetObject;
-      console.log(p10, "selected", targetObject);
+      console.log(p11, "selected", targetObject);
       this.redraw(targetObject, targetIntersection, instance);
     }
     redraw(targetObject, targetIntersection, instance) {
@@ -86816,7 +87068,7 @@ property list uchar int vertex_index
   init_buffer2();
   init_process2();
   init_log();
-  var p11 = prefix("InstanceManager");
+  var p12 = prefix("InstanceManager");
   var InstanceManager = class {
     constructor() {
       this.isInstanceManager = true;
@@ -86824,7 +87076,7 @@ property list uchar int vertex_index
     }
     async get(key) {
       if (key in this.instanceCache) {
-        console.debug(p11, "key in cache", key);
+        console.debug(p12, "key in cache", key);
         return (await this.instanceCache[key]).nextInstance();
       }
       return void 0;
@@ -86833,7 +87085,7 @@ property list uchar int vertex_index
       if (key in this.instanceCache) {
         return await this.get(key);
       }
-      console.debug(p11, "key not in cache", key);
+      console.debug(p12, "key not in cache", key);
       const pending = Promise.resolve().then(supplier).then((obj) => obj.nextInstance());
       this.instanceCache[key] = pending;
       try {
@@ -86878,16 +87130,6 @@ property list uchar int vertex_index
   init_buffer2();
   init_process2();
 
-  // src/model/GuiLight.ts
-  init_dirname();
-  init_buffer2();
-  init_process2();
-  var GuiLight = /* @__PURE__ */ ((GuiLight2) => {
-    GuiLight2["FRONT"] = "front";
-    GuiLight2["SIDE"] = "side";
-    return GuiLight2;
-  })(GuiLight || {});
-
   // src/model/Model.ts
   init_dirname();
   init_buffer2();