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

package/dist/browser/index.mjs

@@ -799,7 +799,7 @@ var init_Textures = __esm({
 });
 
 // src/Materials.ts
-import { Color, DoubleSide, FrontSide, MeshBasicMaterial, MeshStandardMaterial, ShaderChunk, ShaderMaterial } from "three";
+import { Color, CustomBlending, DoubleSide, OneFactor, RepeatWrapping, FrontSide, MeshBasicMaterial, MeshStandardMaterial, ShaderChunk, ShaderMaterial, ZeroFactor } from "three";
 var _Materials, Materials;
 var init_Materials = __esm({
   "src/Materials.ts"() {
@@ -838,6 +838,71 @@ var init_Materials = __esm({
           alphaTest: 0.5
         });
       }
+      /** Whether vanilla's render type for the mode culls back faces. */
+      static entityModeCulls(mode = "cutout") {
+        return mode === "cutout_cull" || mode === "solid" || mode === "eyes" || mode === "water_mask";
+      }
+      /** UV offset per tick of entity age for the scrolling modes, as vanilla's texture matrix applies it. */
+      static entityModeScroll(mode = "cutout") {
+        if (mode === "energy_swirl") return [0.01, 0.01];
+        if (mode === "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, mode = "cutout", tint) {
+        const material = _Materials.createBasicCanvasMaterial(canvas);
+        switch (mode) {
+          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(mode)) {
+          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),
@@ -3450,48 +3515,6 @@ var init_SceneObject = __esm({
   }
 });
 
-// src/model/ModelCulling.ts
-import { Vector3 as Vector39 } from "three";
-var ModelCulling;
-var init_ModelCulling = __esm({
-  "src/model/ModelCulling.ts"() {
-    init_CubeFace();
-    ModelCulling = class {
-      static toLocalMask(worldMask, rotation) {
-        let localMask = 0;
-        for (const [localFace, offset] of CUBE_FACE_OFFSETS.entries()) {
-          const normal = new Vector39(...offset).applyEuler(rotation);
-          const worldFace = CUBE_FACE_OFFSETS.findIndex(([x, y, z]) => Math.abs(normal.x - x) < 1e-6 && Math.abs(normal.y - y) < 1e-6 && Math.abs(normal.z - z) < 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 vertex = 0; vertex < 4; vertex++) {
-            const uvIndex = (faceIndex * 4 + vertex) * 2;
-            const x = element.mappedUv[uvIndex] * atlas.image.width;
-            const y = (1 - element.mappedUv[uvIndex + 1]) * atlas.image.height;
-            if (x < position[0] - 1e-6 || x > position[0] + size[0] + 1e-6 || y < position[1] - 1e-6 || y > position[1] + size[1] + 1e-6) return false;
-          }
-          return true;
-        });
-      }
-    };
-  }
-});
-
 // src/three/BufferGeometryUtils.js
 import {
   BufferAttribute as BufferAttribute4,
@@ -3502,7 +3525,7 @@ import {
   TriangleFanDrawMode,
   TriangleStripDrawMode,
   TrianglesDrawMode,
-  Vector3 as Vector310
+  Vector3 as Vector39
 } from "three";
 function computeTangents(geometry) {
   geometry.computeTangents();
@@ -3821,15 +3844,15 @@ function computeMorphedAttributes(object) {
     console.error("THREE.BufferGeometryUtils: Geometry is not of type BufferGeometry.");
     return null;
   }
-  const _vA = new Vector310();
-  const _vB = new Vector310();
-  const _vC = new Vector310();
-  const _tempA = new Vector310();
-  const _tempB = new Vector310();
-  const _tempC = new Vector310();
-  const _morphA = new Vector310();
-  const _morphB = new Vector310();
-  const _morphC = new Vector310();
+  const _vA = new Vector39();
+  const _vB = new Vector39();
+  const _vC = new Vector39();
+  const _tempA = new Vector39();
+  const _tempB = new Vector39();
+  const _tempC = new Vector39();
+  const _morphA = new Vector39();
+  const _morphB = new Vector39();
+  const _morphC = new Vector39();
   function _calculateMorphedAttributeData(object2, material2, attribute, morphAttribute, morphTargetsRelative2, a2, b2, c2, modifiedAttributeArray) {
     _vA.fromBufferAttribute(attribute, a2);
     _vB.fromBufferAttribute(attribute, b2);
@@ -4038,12 +4061,54 @@ var init_BufferGeometryUtils = __esm({
   }
 });
 
+// src/model/ModelCulling.ts
+import { Vector3 as Vector310 } from "three";
+var ModelCulling;
+var init_ModelCulling = __esm({
+  "src/model/ModelCulling.ts"() {
+    init_CubeFace();
+    ModelCulling = class {
+      static toLocalMask(worldMask, rotation) {
+        let localMask = 0;
+        for (const [localFace, offset] of CUBE_FACE_OFFSETS.entries()) {
+          const normal = new Vector310(...offset).applyEuler(rotation);
+          const worldFace = CUBE_FACE_OFFSETS.findIndex(([x, y, z]) => Math.abs(normal.x - x) < 1e-6 && Math.abs(normal.y - y) < 1e-6 && Math.abs(normal.z - z) < 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 vertex = 0; vertex < 4; vertex++) {
+            const uvIndex = (faceIndex * 4 + vertex) * 2;
+            const x = element.mappedUv[uvIndex] * atlas.image.width;
+            const y = (1 - element.mappedUv[uvIndex + 1]) * atlas.image.height;
+            if (x < position[0] - 1e-6 || x > position[0] + size[0] + 1e-6 || y < position[1] - 1e-6 || y > position[1] + size[1] + 1e-6) return false;
+          }
+          return true;
+        });
+      }
+    };
+  }
+});
+
 // src/model/scene/ModelObject.ts
-import { BoxGeometry as BoxGeometry5, BufferAttribute as BufferAttribute5, Color as Color7, Euler as Euler6, Matrix4 as Matrix46 } from "three";
+import { BoxGeometry as BoxGeometry5, BufferAttribute as BufferAttribute5, Color as Color8, Euler as Euler6, Matrix4 as Matrix47 } from "three";
 function isModelObject(obj) {
   return obj.isModelObject;
 }
-var import_ts_deepmerge5, p9, _ModelObject, ModelObject;
+var import_ts_deepmerge5, p7, _ModelObject, ModelObject;
 var init_ModelObject = __esm({
   "src/model/scene/ModelObject.ts"() {
     init_SceneObject();
@@ -4056,7 +4121,7 @@ var init_ModelObject = __esm({
     init_CubeFace();
     init_DisplayTransforms();
     init_ModelCulling();
-    p9 = prefix("ModelObject");
+    p7 = prefix("ModelObject");
     _ModelObject = class _ModelObject extends SceneObject {
       constructor(originalModel, options) {
         super(options);
@@ -4111,19 +4176,19 @@ var init_ModelObject = __esm({
                   if (tintIndex === void 0 || tintIndex < 0) continue;
                   const tint = this.options.tints[tintIndex];
                   if (tint === void 0) continue;
-                  const color = new Color7(tint);
+                  const color = new Color8(tint);
                   for (let vertex = 0; vertex < 4; vertex++) {
                     color.toArray(colors, (faceIndex * 4 + vertex) * 3);
                   }
                 }
                 elGeo.setAttribute("color", new BufferAttribute5(colors, 3));
               }
-              elGeo.applyMatrix4(new Matrix46().makeTranslation((el.to[0] - el.from[0]) / 2, (el.to[1] - el.from[1]) / 2, (el.to[2] - el.from[2]) / 2));
-              elGeo.applyMatrix4(new Matrix46().makeTranslation(el.from[0], el.from[1], el.from[2]));
+              elGeo.applyMatrix4(new Matrix47().makeTranslation((el.to[0] - el.from[0]) / 2, (el.to[1] - el.from[1]) / 2, (el.to[2] - el.from[2]) / 2));
+              elGeo.applyMatrix4(new Matrix47().makeTranslation(el.from[0], el.from[1], el.from[2]));
               if (el.rotation) {
                 applyElementRotation(el.rotation, elGeo);
               }
-              elGeo.applyMatrix4(new Matrix46().makeTranslation(-8, -8, -8));
+              elGeo.applyMatrix4(new Matrix47().makeTranslation(-8, -8, -8));
               if (displayTransform) DisplayTransforms.apply(elGeo, displayTransform);
               if (this.options.mergeMeshes) {
                 allGeos.push(elGeo);
@@ -4135,10 +4200,10 @@ var init_ModelObject = __esm({
               }
             });
           } else {
-            console.debug(p9, this.atlas.model, "has no elements");
+            console.debug(p7, this.atlas.model, "has no elements");
           }
         } else {
-          console.debug(p9, "Missing atlas for", this);
+          console.debug(p7, "Missing atlas for", this);
         }
         if (this.options.mergeMeshes) {
           let combinedGeo;
@@ -4238,7 +4303,7 @@ var init_fluidBlocks = __esm({
 });
 
 // src/model/fluid/FluidGeometry.ts
-import { BufferGeometry as BufferGeometry3, Float32BufferAttribute as Float32BufferAttribute5 } from "three";
+import { BufferGeometry as BufferGeometry4, Float32BufferAttribute as Float32BufferAttribute5 } from "three";
 function getBlockFluidState(key, state) {
   const rule = key && fluidRules[key.toNamespacedString()];
   if (rule) return {
@@ -4256,7 +4321,7 @@ function ownHeight(sample) {
   return (level === 0 || level >= 8 ? 8 : 8 - level) / 9;
 }
 function createFluidGeometry(kind, sample) {
-  const geometry = new BufferGeometry3();
+  const geometry = new BufferGeometry4();
   const positions = [], normals = [], uvs = [], indices = [];
   const self = sample(0, 0, 0);
   const height = (x, z) => {
@@ -4377,7 +4442,7 @@ __export(FluidModelObject_exports, {
   FluidModelObject: () => FluidModelObject,
   sampleFluid: () => sampleFluid
 });
-import { BufferAttribute as BufferAttribute6, Color as Color8, DoubleSide as DoubleSide3 } from "three";
+import { BufferAttribute as BufferAttribute6, Color as Color9, DoubleSide as DoubleSide3 } from "three";
 function sampleFluid(kind, sample) {
   const cells = [];
   const key = [];
@@ -4428,7 +4493,7 @@ var init_FluidModelObject = __esm({
           }
         }
         geometry.clearGroups();
-        const color = new Color8(this.options.tints?.[0] ?? (this.kind === "water" ? 4159204 : 16777215));
+        const color = new Color9(this.options.tints?.[0] ?? (this.kind === "water" ? 4159204 : 16777215));
         const colors = new Float32Array(geometry.getAttribute("position").count * 3);
         for (let i = 0; i < colors.length; i += 3) color.toArray(colors, i);
         geometry.setAttribute("color", new BufferAttribute6(colors, 3));
@@ -4763,32 +4828,44 @@ var Entities = class {
   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((name) => {
-      const layer = model.layers[name];
+    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 "${name}". 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, layer };
+      let name = pass.layer;
+      for (let n = 2; names.includes(name); n++) name = `${pass.layer}#${n}`;
+      names.push(name);
+      return { name, layer, pass };
     });
-    const layers = Object.fromEntries(await Promise.all(selected.map(async ({ name, layer }, index) => {
+    const layers = Object.fromEntries(await Promise.all(selected.map(async ({ name, layer, pass }, index) => {
       const override = options?.textures?.[name] ?? (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 [name, { key: override ?? modelKey, texture, layer }];
+      const render = pass.render ?? layer.render;
+      return [name, { 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;
@@ -4870,11 +4947,12 @@ function trimCanvas(source) {
 init_SceneObject();
 init_Caching();
 var import_ts_deepmerge4 = __toESM(require_dist());
+init_Ticker();
 init_model();
 init_ModelTextures();
 init_AssetKey();
 init_Materials();
-import { Object3D as Object3D3 } from "three";
+import { Color as Color3, Euler as Euler4, Matrix4 as Matrix44, Object3D as Object3D3 } from "three";
 init_three();
 var _EntityObject = class _EntityObject extends SceneObject {
   constructor(entity, options) {
@@ -4882,6 +4960,10 @@ var _EntityObject = class _EntityObject extends SceneObject {
     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() {
@@ -4891,6 +4973,25 @@ var _EntityObject = class _EntityObject extends SceneObject {
   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(name) {
     return super.getGroupByName(`layer:${name}`);
   }
@@ -4921,16 +5022,29 @@ var _EntityObject = class _EntityObject extends SceneObject {
   createMeshes(force = false) {
     if (this.meshesCreated && !force) return;
     const modelRoot = new Object3D3();
-    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 Matrix44();
+        if ("scale" in op) matrix.makeScale(...op.scale);
+        else if ("translate" in op) matrix.makeTranslation(...op.translate);
+        else matrix.makeRotationFromEuler(new Euler4(...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(([name, layer], index) => {
       const group = this.createGroup(`layer:${name}`);
       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(name, part, parent, textureSize, material, renderOrder) {
+  createPart(name, part, parent, textureSize, material, renderOrder, inward = true) {
     const anchor = this.createGroup(name);
     anchor.position.fromArray(part.pose.offset);
     anchor.rotation.set(...part.pose.rotation, "ZYX");
@@ -4949,7 +5063,7 @@ var _EntityObject = class _EntityObject extends SceneObject {
         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()));
       }
@@ -4959,30 +5073,46 @@ var _EntityObject = class _EntityObject extends SceneObject {
       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 ([name, layer]) => {
+      const mode = layer.render ?? layer.layer.render ?? "cutout";
+      const tint = layer.tint === void 0 ? void 0 : this.options.tints?.[layer.tint];
+      const scroll = Materials.entityModeScroll(mode);
       const assetKeyStr = this.getTextureKey(layer).serialize();
-      const keyStr = `entity:${assetKeyStr}`;
-      let mat = Caching.materialCache.getIfPresent(keyStr);
+      const keyStr = `entity:${mode}:${tint === void 0 ? "" : new Color3(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, mode, 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(name)?.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;
@@ -4992,11 +5122,11 @@ function isEntityObject(obj) {
 init_MineRenderError();
 
 // src/export/SceneExporter.ts
-import { ClampToEdgeWrapping as ClampToEdgeWrapping2, Color as Color6, Float32BufferAttribute as Float32BufferAttribute3, Matrix4 as Matrix45, Mesh as Mesh5, MeshBasicMaterial as MeshBasicMaterial2, NearestFilter as NearestFilter3, RGBAFormat as RGBAFormat3, Scene as Scene4, Source as Source2, Texture as Texture4, UnsignedByteType } from "three";
+import { ClampToEdgeWrapping as ClampToEdgeWrapping2, Color as Color7, Float32BufferAttribute as Float32BufferAttribute3, Matrix4 as Matrix46, Mesh as Mesh5, MeshBasicMaterial as MeshBasicMaterial2, NearestFilter as NearestFilter3, RGBAFormat as RGBAFormat3, Scene as Scene4, Source as Source2, Texture as Texture4, UnsignedByteType } from "three";
 
 // ../../node_modules/three/examples/jsm/exporters/OBJExporter.js
 import {
-  Color as Color3,
+  Color as Color4,
   Matrix3,
   Vector2 as Vector22,
   Vector3 as Vector36
@@ -5008,7 +5138,7 @@ var OBJExporter = class {
     let indexVertexUvs = 0;
     let indexNormals = 0;
     const vertex = new Vector36();
-    const color = new Color3();
+    const color = new Color4();
     const normal = new Vector36();
     const uv = new Vector22();
     const face = [];
@@ -5139,7 +5269,7 @@ var OBJExporter = class {
 import {
   Matrix3 as Matrix32,
   Vector3 as Vector37,
-  Color as Color4
+  Color as Color5
 } from "three";
 var PLYExporter = class {
   parse(object, onDone, options = {}) {
@@ -5197,7 +5327,7 @@ var PLYExporter = class {
         includeIndices = false;
       }
     });
-    const tempColor = new Color4();
+    const tempColor = new Color5();
     includeIndices = includeIndices && excludeAttributes.indexOf("index") === -1;
     includeNormals = includeNormals && excludeAttributes.indexOf("normal") === -1;
     includeColors = includeColors && excludeAttributes.indexOf("color") === -1;
@@ -5409,7 +5539,7 @@ property list uchar int vertex_index
 import {
   BufferAttribute as BufferAttribute3,
   ClampToEdgeWrapping,
-  Color as Color5,
+  Color as Color6,
   DoubleSide as DoubleSide2,
   InterpolateDiscrete,
   InterpolateLinear,
@@ -5418,14 +5548,14 @@ import {
   LinearMipmapLinearFilter,
   LinearMipmapNearestFilter,
   MathUtils as MathUtils2,
-  Matrix4 as Matrix44,
+  Matrix4 as Matrix45,
   MirroredRepeatWrapping,
   NearestFilter as NearestFilter2,
   NearestMipmapLinearFilter,
   NearestMipmapNearestFilter,
   PropertyBinding,
   RGBAFormat as RGBAFormat2,
-  RepeatWrapping,
+  RepeatWrapping as RepeatWrapping2,
   Scene as Scene3,
   Source,
   SRGBColorSpace as SRGBColorSpace4,
@@ -5643,7 +5773,7 @@ THREE_TO_WEBGL[LinearFilter] = WEBGL_CONSTANTS.LINEAR;
 THREE_TO_WEBGL[LinearMipmapNearestFilter] = WEBGL_CONSTANTS.LINEAR_MIPMAP_NEAREST;
 THREE_TO_WEBGL[LinearMipmapLinearFilter] = WEBGL_CONSTANTS.LINEAR_MIPMAP_LINEAR;
 THREE_TO_WEBGL[ClampToEdgeWrapping] = WEBGL_CONSTANTS.CLAMP_TO_EDGE;
-THREE_TO_WEBGL[RepeatWrapping] = WEBGL_CONSTANTS.REPEAT;
+THREE_TO_WEBGL[RepeatWrapping2] = WEBGL_CONSTANTS.REPEAT;
 THREE_TO_WEBGL[MirroredRepeatWrapping] = WEBGL_CONSTANTS.MIRRORED_REPEAT;
 var PATH_PROPERTIES = {
   scale: "scale",
@@ -5651,7 +5781,7 @@ var PATH_PROPERTIES = {
   quaternion: "rotation",
   morphTargetInfluences: "weights"
 };
-var DEFAULT_SPECULAR_COLOR = new Color5();
+var DEFAULT_SPECULAR_COLOR = new Color6();
 var GLB_HEADER_BYTES = 12;
 var GLB_HEADER_MAGIC = 1179937895;
 var GLB_VERSION = 2;
@@ -6708,7 +6838,7 @@ var GLTFWriter = class {
     if (rootJoint === void 0) return null;
     const joints = [];
     const inverseBindMatrices = new Float32Array(skeleton.bones.length * 16);
-    const temporaryBoneInverse = new Matrix44();
+    const temporaryBoneInverse = new Matrix45();
     for (let i = 0; i < skeleton.bones.length; ++i) {
       joints.push(nodeMap.get(skeleton.bones[i]));
       temporaryBoneInverse.copy(skeleton.boneInverses[i]);
@@ -7174,7 +7304,7 @@ var GLTFMeshGpuInstancing = class {
     const translationAttr = new Float32Array(mesh.count * 3);
     const rotationAttr = new Float32Array(mesh.count * 4);
     const scaleAttr = new Float32Array(mesh.count * 3);
-    const matrix = new Matrix44();
+    const matrix = new Matrix45();
     const position = new Vector38();
     const quaternion = new Quaternion4();
     const scale = new Vector38();
@@ -7348,7 +7478,7 @@ var SceneExporter = class {
   }
 };
 function localMatrix(object) {
-  return object.matrixAutoUpdate ? new Matrix45().compose(object.position, object.quaternion, object.scale) : object.matrix.clone();
+  return object.matrixAutoUpdate ? new Matrix46().compose(object.position, object.quaternion, object.scale) : object.matrix.clone();
 }
 function createSnapshot(root, gltf, bakeColors = false) {
   const scene = new Scene4();
@@ -7433,7 +7563,7 @@ function createSnapshot(root, gltf, bakeColors = false) {
       const material = copyMaterial(sourceMaterial, geometry);
       if (!sourceMaterial.vertexColors) geometry.deleteAttribute("color");
       if (bakeColors || instanceColor) {
-        const tint = (material.color ?? new Color6()).clone();
+        const tint = (material.color ?? new Color7()).clone();
         if (instanceColor) tint.multiply(instanceColor);
         if (bakeColors) {
           const original = geometry.getAttribute("color");
@@ -7460,9 +7590,9 @@ function createSnapshot(root, gltf, bakeColors = false) {
       const instanced = mesh;
       if (instanced.isInstancedMesh) {
         for (let i = 0; i < instanced.count; i++) {
-          const matrix = new Matrix45();
+          const matrix = new Matrix46();
           instanced.getMatrixAt(i, matrix);
-          const color = instanced.instanceColor ? new Color6().fromBufferAttribute(instanced.instanceColor, i) : void 0;
+          const color = instanced.instanceColor ? new Color7().fromBufferAttribute(instanced.instanceColor, i) : void 0;
           addMesh(mesh, world.clone().multiply(matrix), color);
         }
       } else {
@@ -7474,7 +7604,7 @@ function createSnapshot(root, gltf, bakeColors = false) {
   try {
     const ancestors = [];
     for (let parent = root.parent; parent; parent = parent.parent) ancestors.unshift(parent);
-    const world = new Matrix45();
+    const world = new Matrix46();
     for (const ancestor of ancestors) {
       if (!ancestor.visible) return { scene, dispose };
       world.multiply(localMatrix(ancestor));
@@ -7541,20 +7671,90 @@ function copyDataTexture(source) {
 }
 
 // src/gui/GuiHelper.ts
+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, y) => row.split("").map((symbol, x) => ({ symbol, x, y }))).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, y } of cells) {
+          const ingredient = recipe.key[symbol];
+          if (!ingredient) throw new Error(`Missing recipe ingredient for symbol ${JSON.stringify(symbol)}`);
+          addIngredient(ingredient, (y - minY + offsetY) * 3 + x - 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/scene/GuiObject.ts
 init_AssetKey();
 init_ModelTextures();
+init_Models();
 init_Caching();
 init_SceneObject();
 init_Materials();
-import { Box2, Mesh as Mesh6, PlaneGeometry as PlaneGeometry2, Vector2 as Vector23 } from "three";
+init_ModelObject();
+init_DisplayPosition();
+import { Box2, Box3 as Box32, Mesh as Mesh7, PlaneGeometry as PlaneGeometry2, Vector2 as Vector23 } from "three";
+
+// src/model/GuiLight.ts
+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 });
@@ -7569,13 +7769,34 @@ var GuiObject = class extends SceneObject {
   async init() {
     if (this.initialized) return;
     try {
+      let depth = 0;
       for (const [index, layer] of this.textureLayers.entries()) {
+        const [x, y] = 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(x + width2 / 2, -y - height2 / 2, 0);
+          item.scale.set(width2 / 16, height2 / 16, width2 / 16);
+          item.updateMatrix();
+          const bounds = new Box32();
+          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 Vector23(x, y));
+          this.bounds.expandByPoint(new Vector23(x + width2, y + height2));
+          this.bounds.expandByPoint(new Vector23(bounds.min.x, -bounds.max.y));
+          this.bounds.expandByPoint(new Vector23(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 [x, y] = layer.position ?? [0, 0];
         const geometry = new PlaneGeometry2(width, height);
         this.geometries.add(geometry);
         const uv = geometry.getAttribute("uv");
@@ -7586,14 +7807,16 @@ var GuiObject = class extends SceneObject {
             1 - (cropY + (1 - uv.getY(i)) * cropHeight) / image.height
           );
         }
-        const mesh = new Mesh6(geometry, material);
+        const mesh = new Mesh7(geometry, material);
         mesh.name = `mesh:${layer.name ?? index}`;
-        mesh.position.set(x + width / 2, -y - height / 2, 0);
+        mesh.position.set(x + width / 2, -y - height / 2, depth);
         mesh.renderOrder = index;
         this.add(mesh);
         this.bounds.expandByPoint(new Vector23(x, y));
         this.bounds.expandByPoint(new Vector23(x + width, y + height));
+        depth += 0.01;
       }
+      for (const child of this.children) child.position.z -= depth - 0.01;
       this.initialized = true;
       this.notifyDirty();
     } catch (error) {
@@ -7601,6 +7824,32 @@ var GuiObject = class extends SceneObject {
       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}`;
@@ -7644,7 +7893,7 @@ init_util();
 import { Raycaster, Vector2 as Vector24 } from "three";
 init_log();
 init_three();
-var p7 = prefix("SceneInspector");
+var p8 = prefix("SceneInspector");
 var help = "<span>Ctrl/Cmd+Click to Select<br/></span><br/>";
 var SceneInspector = class {
   constructor(renderer) {
@@ -7738,7 +7987,7 @@ var SceneInspector = class {
   }
   selectObject(targetObject, targetIntersection, instance = this.getIntersectionInstance(targetIntersection)) {
     this.selectedObject = targetObject;
-    console.log(p7, "selected", targetObject);
+    console.log(p8, "selected", targetObject);
     this.redraw(targetObject, targetIntersection, instance);
   }
   redraw(targetObject, targetIntersection, instance) {
@@ -7997,7 +8246,7 @@ var SceneStatsDisplay = class {
 
 // src/instance/InstanceManager.ts
 init_log();
-var p8 = prefix("InstanceManager");
+var p9 = prefix("InstanceManager");
 var InstanceManager = class {
   constructor() {
     this.isInstanceManager = true;
@@ -8005,7 +8254,7 @@ var InstanceManager = class {
   }
   async get(key) {
     if (key in this.instanceCache) {
-      console.debug(p8, "key in cache", key);
+      console.debug(p9, "key in cache", key);
       return (await this.instanceCache[key]).nextInstance();
     }
     return void 0;
@@ -8014,7 +8263,7 @@ var InstanceManager = class {
     if (key in this.instanceCache) {
       return await this.get(key);
     }
-    console.debug(p8, "key not in cache", key);
+    console.debug(p9, "key not in cache", key);
     const pending = Promise.resolve().then(supplier).then((obj) => obj.nextInstance());
     this.instanceCache[key] = pending;
     try {
@@ -8048,13 +8297,6 @@ function isInstanceable(obj) {
 init_DisplayPosition();
 init_DisplayTransforms();
 
-// src/model/GuiLight.ts
-var GuiLight = /* @__PURE__ */ ((GuiLight2) => {
-  GuiLight2["FRONT"] = "front";
-  GuiLight2["SIDE"] = "side";
-  return GuiLight2;
-})(GuiLight || {});
-
 // src/model/Model.ts
 var ITEM_GENERATED = "item/generated";
 var BUILTIN_GENERATED = "builtin/generated";
@@ -8079,7 +8321,7 @@ init_ModelMerger();
 init_BlockStates();
 init_MineRenderError();
 init_util();
-import { Euler as Euler5 } from "three";
+import { Euler as Euler7 } from "three";
 function matchesCondition(condition, state) {
   return Object.entries(condition).every(([key, value]) => {
     if (Array.isArray(value)) {
@@ -8154,7 +8396,7 @@ var BlockStateResolver = class {
     return variants[variants.length - 1];
   }
   static rotation(variant) {
-    const rotation = new Euler5();
+    const rotation = new Euler7();
     if (typeof variant.x !== "undefined") {
       rotation.x = toRadians(clampRotationDegrees(variant.x));
     }
@@ -8264,7 +8506,7 @@ var import_ts_deepmerge6 = __toESM(require_dist());
 init_MineRenderError();
 init_InstanceReference();
 init_AssetKey();
-import { Euler as Euler7, Matrix4 as Matrix47, Quaternion as Quaternion5, Vector3 as Vector311 } from "three";
+import { Euler as Euler8, Matrix4 as Matrix48, Quaternion as Quaternion5, Vector3 as Vector311 } from "three";
 init_ModelCulling();
 init_FluidGeometry();
 var _BlockObject = class _BlockObject extends SceneObject {
@@ -8330,7 +8572,7 @@ var _BlockObject = class _BlockObject extends SceneObject {
     const scale = new Vector311();
     this.getModelMatrix(model).decompose(position, rotation, scale);
     if (position.distanceToSquared(this.position) > 1e-10 || scale.distanceToSquared(new Vector311(1, 1, 1)) > 1e-10) return 0;
-    return ModelCulling.toLocalMask(worldMask, new Euler7().setFromQuaternion(rotation));
+    return ModelCulling.toLocalMask(worldMask, new Euler8().setFromQuaternion(rotation));
   }
   async setCullMask(worldMask) {
     worldMask &= 63;
@@ -8392,7 +8634,7 @@ var _BlockObject = class _BlockObject extends SceneObject {
       () => new FluidModelObject2(kind, surface.sample, this.blockState.key, this.options)
     );
     const previous = this._fluidModel;
-    const matrix = previous ? this.getModelMatrix(previous) : new Matrix47().makeTranslation(...this.position.toArray());
+    const matrix = previous ? this.getModelMatrix(previous) : new Matrix48().makeTranslation(...this.position.toArray());
     if (isInstanceReference(replacement)) replacement.setMatrix(matrix);
     else matrix.decompose(replacement.position, replacement.quaternion, replacement.scale);
     this._models = this._models.filter((model) => model !== previous);
@@ -8523,7 +8765,7 @@ var _BlockObject = class _BlockObject extends SceneObject {
   setPositionRotationScaleAt(index, position, rotation, scale) {
     super.setPositionRotationScaleAt(index, position, rotation, scale);
   }
-  getMatrixAt(index, matrix = new Matrix47()) {
+  getMatrixAt(index, matrix = new Matrix48()) {
     if (!this.isInstanced) throw new MineRenderError("Object is not instanced");
     const child = this._models[0];
     if (child && isModelObject(child)) {
@@ -13087,7 +13329,7 @@ init_CubeFace();
 init_AssetKey();
 init_Models();
 init_CubeFace();
-import { Matrix4 as Matrix48, Vector3 as Vector314 } from "three";
+import { Matrix4 as Matrix49, Vector3 as Vector314 } from "three";
 init_ModelCulling();
 init_ModelObject();
 init_UVMapper();
@@ -13150,7 +13392,7 @@ var SectionModels = class {
         });
         await object.init();
         const geometry = object.children[0].geometry;
-        geometry.applyMatrix4(new Matrix48().makeRotationFromEuler(rotation));
+        geometry.applyMatrix4(new Matrix49().makeRotationFromEuler(rotation));
         object.clear();
         const cullFaces = CUBE_FACES.map((face) => {
           const local = CUBE_FACES.findIndex((name) => name === atlas.model.elements[0].faces[face]?.cullface);
@@ -13400,7 +13642,7 @@ var MineRenderWorld = class {
 // src/world/SectionMesh.ts
 init_CanvasCompat();
 init_Materials();
-import { BufferGeometry as BufferGeometry5, Float32BufferAttribute as Float32BufferAttribute6, Group, Mesh as Mesh10 } from "three";
+import { BufferGeometry as BufferGeometry6, Float32BufferAttribute as Float32BufferAttribute6, Group, Mesh as Mesh10 } from "three";
 var SectionMesh = class _SectionMesh extends Group {
   constructor() {
     super(...arguments);
@@ -13474,7 +13716,7 @@ var SectionMesh = class _SectionMesh extends Group {
           for (let corner = 0; corner < 6; corner++) indices.push(start + sourceIndices.getX(face * 6 + corner) - face * 4);
         }
       }
-      const geometry = new BufferGeometry5();
+      const geometry = new BufferGeometry6();
       geometry.setAttribute("position", new Float32BufferAttribute6(positions, 3));
       geometry.setAttribute("normal", new Float32BufferAttribute6(normals, 3));
       geometry.setAttribute("uv", new Float32BufferAttribute6(uvs, 2));