@driftengine/core 4.4.2 → 4.6.0

package/dist/render/backend/webgpu/buffers.d.ts

@@ -26,6 +26,16 @@ export interface VertexAttribute {
  */
 export declare const VERTEX_LAYOUT: readonly VertexAttribute[];
 /** Geometry on the device, with the buffers bound in layout order. */
+/**
+ * The texture coordinates of a mesh that names texture-array layers: (u, v, layer), three floats.
+ *
+ * **Three only where layers exist.** Every location is spent, so the layer rides in this attribute,
+ * and widening it for every textured mesh would add four bytes to each of its vertices for nothing.
+ * A mesh without layers keeps two, and the shader's `vec3` input reads z as 0 — WebGPU fills a
+ * component the format does not carry with 0 (and w with 1) — which is layer 0. The pipeline key
+ * carries `:layers`, so the two vertex layouts never share a pipeline.
+ */
+export declare const LAYERED_UVS: VertexAttribute;
 export interface GpuMesh {
     /**
      * The buffers a draw binds, in the order `vertexBufferLayouts` describes them.
@@ -48,6 +58,15 @@ export interface GpuMesh {
      * its own does.
      */
     readonly vertexStride: number;
+    /**
+     * Byte offsets of the joint indices and weights in the interleaved vertex, or null for a mesh
+     * that supplied neither. For a pass that skins through a shader of its own — the motion pass —
+     * which has to find them without the `present` map the generated pipelines are keyed by.
+     */
+    readonly skinOffsets: {
+        readonly joints: number;
+        readonly weights: number;
+    } | null;
     readonly indexBuffer: GPUBuffer;
     readonly indexCount: number;
     /**
@@ -114,7 +133,16 @@ export interface GpuMesh {
      * one CPU-side copy of the vertex data per dynamic mesh, which is why the flag exists rather
      * than every mesh paying it.
      */
-    readonly update: ((device: GPUDevice, positions: Float32Array, normals?: Float32Array) => void) | null;
+    readonly update: ((device: GPUDevice, positions: Float32Array, normals?: Float32Array, previous?: GPUBuffer | null) => void) | null;
+    /**
+     * A dynamic mesh's motion state, which the renderer owns: a buffer for last frame's interleaved
+     * rows, made the first time a reconstructing renderer rewrites the mesh, and the frame of the
+     * last rewrite. Null on a mesh created without `{ dynamic: true }`, which never moves a vertex.
+     */
+    readonly motion: {
+        previous: GPUBuffer | null;
+        changed: number;
+    } | null;
     dispose(): void;
 }
 /** A mesh on its way to the device, and the iterator that gets it there. */

package/dist/render/backend/webgpu/buffers.js

@@ -84,6 +84,27 @@ export const VERTEX_LAYOUT = [
      */
     { name: 'channel', shaderLocation: 13, format: 'float32x4', components: 4, optional: true },
 ];
+/** Geometry on the device, with the buffers bound in layout order. */
+/**
+ * The texture coordinates of a mesh that names texture-array layers: (u, v, layer), three floats.
+ *
+ * **Three only where layers exist.** Every location is spent, so the layer rides in this attribute,
+ * and widening it for every textured mesh would add four bytes to each of its vertices for nothing.
+ * A mesh without layers keeps two, and the shader's `vec3` input reads z as 0 — WebGPU fills a
+ * component the format does not carry with 0 (and w with 1) — which is layer 0. The pipeline key
+ * carries `:layers`, so the two vertex layouts never share a pipeline.
+ */
+export const LAYERED_UVS = {
+    name: 'uvs',
+    shaderLocation: 5,
+    format: 'float32x3',
+    components: 3,
+    optional: true,
+};
+/** The attribute as this mesh lays it out: the UV field widens where the mesh names layers. */
+function laidOut(attribute, layered) {
+    return layered && attribute.name === 'uvs' ? LAYERED_UVS : attribute;
+}
 /**
  * Upload a mesh, all of it, now.
  *
@@ -130,7 +151,8 @@ export function createGpuMeshIncremental(device, data, dynamic = false) {
     validateMeshData(data);
     const bounds = boundsOfPositions(data.positions, createBounds());
     const vertexCount = data.positions.length / 3;
-    const supplied = VERTEX_LAYOUT.filter((attribute) => !attribute.optional || data[attribute.name] !== undefined);
+    const layered = data.layers !== undefined;
+    const supplied = VERTEX_LAYOUT.filter((attribute) => !attribute.optional || data[attribute.name] !== undefined).map((attribute) => laidOut(attribute, layered));
     /* Interleaved: one stride holding every attribute the mesh actually supplied. */
     const stride = supplied.reduce((sum, attribute) => sum + attribute.components * 4, 0);
     const step = stride / 4;
@@ -235,6 +257,7 @@ export function createGpuMeshIncremental(device, data, dynamic = false) {
         progress,
         hasTangents: data.tangents !== undefined,
         isSkinned: data.joints !== undefined,
+        skinOffsets: skinOffsetsOf(supplied),
         hasChannel: data.channel !== undefined,
         morph: data.morphTargets === undefined || data.morphTargetCount === undefined
             ? null
@@ -270,7 +293,14 @@ function* uploadSteps(job) {
         let fieldOffset = 0;
         for (const attribute of supplied) {
             const source = data[attribute.name];
-            interleaveField(interleaved, source, attribute.components, step, fieldOffset, from, to);
+            if (attribute === LAYERED_UVS) {
+                /* (u, v) from the coordinates and the layer after them, one field of three. */
+                interleaveField(interleaved, source, 2, step, fieldOffset, from, to);
+                interleaveField(interleaved, data.layers, 1, step, fieldOffset + 2, from, to);
+            }
+            else {
+                interleaveField(interleaved, source, attribute.components, step, fieldOffset, from, to);
+            }
             fieldOffset += attribute.components;
         }
         device.queue.writeBuffer(vertices, from * stride, interleaved, from * step, (to - from) * step);
@@ -329,12 +359,31 @@ function interleaveField(rows, source, width, step, fieldOffset, from, to) {
             rows[write] = source[read];
     }
 }
+/**
+ * Where the joints and weights sit in a vertex of `supplied`, the attributes a mesh interleaves in
+ * layout order; null unless it supplied both.
+ */
+function skinOffsetsOf(supplied) {
+    let floats = 0;
+    let joints = -1;
+    let weights = -1;
+    for (const attribute of supplied) {
+        if (attribute.name === 'joints')
+            joints = floats * 4;
+        if (attribute.name === 'weights')
+            weights = floats * 4;
+        floats += attribute.components;
+    }
+    return joints >= 0 && weights >= 0 ? { joints, weights } : null;
+}
 /** The handle, made where it can see only what it hands out. */
 function gpuMeshOf(parts) {
+    const motion = parts.update === null ? null : { previous: null, changed: -1 };
     const { vertices, constants, indexBuffer, progress } = parts;
     return {
         vertexBuffers: [vertices, constants],
         vertexStride: parts.stride,
+        skinOffsets: parts.skinOffsets,
         indexBuffer,
         indexCount: parts.indexCount,
         bounds: parts.bounds,
@@ -346,7 +395,9 @@ function gpuMeshOf(parts) {
         hasChannel: parts.hasChannel,
         morph: parts.morph,
         update: parts.update,
+        motion,
         dispose() {
+            motion?.previous?.destroy();
             vertices.destroy();
             constants.destroy();
             indexBuffer.destroy();
@@ -359,12 +410,16 @@ function gpuMeshOf(parts) {
  * receive have to still be there.
  */
 function dynamicUpdate(interleaved, vertices, bounds, vertexCount, step, positionField, normalField) {
-    return (target, positions, normals) => {
+    return (target, positions, normals, previous = null) => {
         if (positions.length !== vertexCount * 3) {
             throw new Error(`this mesh has ${vertexCount} vertices and the update has ${positions.length / 3}. ` +
                 "A mesh's vertex count is fixed at creation: the index buffer, the pipeline and " +
                 'every other attribute are sized against it.');
         }
+        /* The rows as they stand are last frame's, handed over before a position of them changes.
+           `writeBuffer` copies at the call, so patching the array afterwards cannot reach this copy. */
+        if (previous !== null)
+            target.queue.writeBuffer(previous, 0, interleaved);
         /* Everything that decides whether this is on screen starts from the bounds, so a cloth
            that blew sideways out of its original box would be culled while still visible. */
         boundsOfPositions(positions, bounds);
@@ -423,7 +478,9 @@ instanced = false) {
     const interleaved = [];
     const constants = [];
     let offset = 0;
-    VERTEX_LAYOUT.forEach((attribute, index) => {
+    const layered = present['layers'] === true;
+    VERTEX_LAYOUT.forEach((declared, index) => {
+        const attribute = laidOut(declared, layered);
         /*
          * **The instanced pipeline reclaims the two skinning locations, and it is allowed to because
          * it cannot skin.** Locations 11 and 12 are the joint indices and weights; the INSTANCED

package/dist/render/backend/webgpu/depthPass.d.ts

@@ -117,7 +117,7 @@ export declare const DEPTH_FRAG_BINDING: 1;
 export declare const DEPTH_PREVIOUS_BINDING: {
     readonly texture: 32;
     readonly sampler: 33;
-    readonly type: "sampler2D";
+    readonly type: "sampler2DArray";
 };
 /** Where the skinned vertex stage reads the joint palette. Generated, not chosen here. */
 export declare const DEPTH_PALETTE_BINDING: {

package/dist/render/backend/webgpu/depthPass.js

@@ -104,7 +104,8 @@ cutout = false) {
             {
                 binding: PREVIOUS.texture,
                 visibility: VISIBILITY_FRAGMENT,
-                texture: { sampleType: 'unfilterable-float' },
+                /* An array since the sun's maps became one (`shadowMap.ts`): the peel reads its static layer. */
+                texture: { sampleType: 'unfilterable-float', viewDimension: '2d-array' },
             },
             {
                 binding: PREVIOUS.sampler,
@@ -118,7 +119,11 @@ cutout = false) {
                     {
                         binding: CUTOUT_MAP.texture,
                         visibility: VISIBILITY_FRAGMENT,
-                        texture: { sampleType: 'float' },
+                        /* A surface texture, and every surface texture is a `2d-array` view. */
+                        texture: {
+                            sampleType: 'float',
+                            viewDimension: '2d-array',
+                        },
                     },
                     {
                         binding: CUTOUT_MAP.sampler,

package/dist/render/backend/webgpu/drawCommand.d.ts

@@ -24,6 +24,11 @@ export interface DrawCommand {
     indexed: boolean;
     count: number;
     instances: number;
+    /**
+     * A `drawIndexedIndirect` record to draw from instead of `count` and `instances`: an instance
+     * cull's survivors, counted on the device. Null for every other draw.
+     */
+    indirect: GPUBuffer | null;
 }
 export interface CommandPool {
     commands: DrawCommand[];

package/dist/render/backend/webgpu/drawCommand.js

@@ -25,6 +25,7 @@ function emptyCommand() {
         indexed: false,
         count: 0,
         instances: 1,
+        indirect: null,
     };
 }
 export function createCommandPool(capacity) {

package/dist/render/backend/webgpu/flatPass.d.ts

@@ -58,6 +58,8 @@ export interface StageBindings {
         readonly stride?: number;
     }>>;
     readonly textures: Readonly<Record<string, TextureBinding>>;
+    /** Each pipeline-overridable constant's id, by the GLSL name it was declared under. */
+    readonly overrides?: Readonly<Record<string, number>>;
 }
 /** The key for a set of vertex flags: the same rule `variantKey` uses, flags on, sorted, joined. */
 export declare function flatVertexKey(skinned: boolean, morphed: boolean, instanced?: boolean): string;
@@ -176,8 +178,11 @@ export declare function flatPipeline(cache: PipelineCache, device: GPUDevice, la
  * `depthMask` alone and only turns blending on. A translucent part of a loaded model is a
  * pane of glass in a solid object, not a particle, and it has to occlude what is behind it
  * for the rest of the model to sort correctly.
+ *
+ * `'additive'` adds instead: colour times alpha onto the target, its alpha kept. The key must
+ * carry it (`|add`).
  */
-translucent?: boolean, 
+translucent?: boolean | 'additive', 
 /** Whether this pipeline reads a joint palette. See `FlatVertexOptions`. */
 skinned?: boolean, 
 /** Whether this pipeline reads morph deltas. See `FlatVertexOptions`. */

package/dist/render/backend/webgpu/flatPass.js

@@ -2,6 +2,13 @@ import { DEPTH_COMPARE, DEPTH_FORMAT, depthOffsetForLayer } from '../../depthCon
 import { FLAT_BINDINGS, FLAT_FRAG_WGSL, FLAT_VERT_WGSL, } from '../../shaders/generated/flat.wgsl.js';
 import { vertexBufferLayouts } from './buffers.js';
 import { shaderModule } from './shaderModules.js';
+/** The material maps the flat pass reads: `2d-array` colour, filtered, not shadow maps. */
+const SURFACE_MAPS = new Set([
+    'uAlbedo',
+    'uNormalMap',
+    'uOrmMap',
+    'uEmissiveMap',
+]);
 /**
  * The key for a set of flags.
  *
@@ -107,6 +114,20 @@ export function flatFragmentBindings(variant) {
         throw new Error(`flatPass: no bindings for variant "${variant}"`);
     return found;
 }
+/**
+ * The lit fragment stage's constants, set from the cache: the glass switch, keyed by its **id**.
+ *
+ * Not by its name, because an override declared with `@id` answers to the id alone — WebGPU's
+ * "pipeline-overridable constant identifier string" — and naga writes one on every specialisation
+ * constant. Keyed by name, Chrome refused every lit pipeline: *Pipeline overridable constant
+ * "GLASS_SHADOWS" not found*, and the frame drew nothing.
+ */
+function flatFragmentConstants(variant, cache) {
+    const id = flatFragmentBindings(variant).overrides?.['GLASS_SHADOWS'];
+    if (id === undefined)
+        throw new Error(`flatPass: variant "${variant}" has no glass switch`);
+    return { [String(id)]: cache.glassShadows ? 1 : 0 };
+}
 /** The depth format both backends compare with. */
 /* Re-exported so the twenty passes that already import it from here do not each learn a new
    module; `depthConvention.ts` is where the decision lives and why. */
@@ -182,7 +203,21 @@ export function createFlatBindGroupLayout(device, variant, skinned = false, morp
         const integer = texture.type === 'usampler2D' || texture.type === 'usampler3D';
         /* DriftLight's brick index and atlas, the lit pass's only volumes. See `driftLight.ts`. */
         const volume = texture.type === 'sampler3D' || texture.type === 'usampler3D';
-        const isShadow = integer || (name !== 'uEnvironment' && (name.endsWith('ShadowMap') || cube || array));
+        /* Glass tints are colour, mipmapped and filtered: a frosted pane is read at a coarser level. */
+        const tint = name.endsWith('GlassTints');
+        /*
+         * **The four material maps are arrays too, and they are colour.** Every surface texture is a
+         * `2d-array` view since texture arrays landed, so the rule below — an array is a shadow map —
+         * would declare albedo unfilterable and bind a non-filtering sampler to it, which reads as
+         * every textured surface going nearest-neighbour and losing its mip chain. Named, as
+         * `uEnvironment` is, because a pattern wide enough to catch them catches the shadow arrays.
+         */
+        const surface = SURFACE_MAPS.has(name);
+        const isShadow = integer ||
+            (!tint &&
+                !surface &&
+                name !== 'uEnvironment' &&
+                (name.endsWith('ShadowMap') || cube || array));
         entries.push({
             binding: texture.texture,
             visibility: VISIBILITY_FRAGMENT,
@@ -332,6 +367,9 @@ export function flatPipeline(cache, device, layout, variant, key, present,
  * `depthMask` alone and only turns blending on. A translucent part of a loaded model is a
  * pane of glass in a solid object, not a particle, and it has to occlude what is behind it
  * for the rest of the model to sort correctly.
+ *
+ * `'additive'` adds instead: colour times alpha onto the target, its alpha kept. The key must
+ * carry it (`|add`).
  */
 translucent = false, 
 /** Whether this pipeline reads a joint palette. See `FlatVertexOptions`. */
@@ -449,21 +487,31 @@ doubleSided = false) {
                 code: FLAT_FRAG_WGSL[variant] ?? '',
             }),
             entryPoint: 'main',
+            /* Every variant declares it, so every lit pipeline may set it: see `PipelineCache`. */
+            constants: flatFragmentConstants(variant, cache),
             targets: [
                 oitTarget(oit) ??
-                    (translucent
+                    (translucent === 'additive'
                         ? {
                             format: cache.format,
                             blend: {
-                                color: {
-                                    srcFactor: 'src-alpha',
-                                    dstFactor: 'one-minus-src-alpha',
-                                    operation: 'add',
-                                },
-                                alpha: { srcFactor: 'one', dstFactor: 'one-minus-src-alpha', operation: 'add' },
+                                color: { srcFactor: 'src-alpha', dstFactor: 'one', operation: 'add' },
+                                alpha: { srcFactor: 'zero', dstFactor: 'one', operation: 'add' },
                             },
                         }
-                        : { format: cache.format }),
+                        : translucent
+                            ? {
+                                format: cache.format,
+                                blend: {
+                                    color: {
+                                        srcFactor: 'src-alpha',
+                                        dstFactor: 'one-minus-src-alpha',
+                                        operation: 'add',
+                                    },
+                                    alpha: { srcFactor: 'one', dstFactor: 'one-minus-src-alpha', operation: 'add' },
+                                },
+                            }
+                            : { format: cache.format }),
             ],
         },
         primitive: { topology: 'triangle-list', cullMode: doubleSided ? 'none' : 'back' },

package/dist/render/backend/webgpu/glassTintPass.d.ts

@@ -0,0 +1,28 @@
+import type { ResolvedGlass } from '../../glass.ts';
+import type { PipelineCache } from './pipelineCache.ts';
+import { UniformRing } from './uniformRing.ts';
+export type GlassTintKind = 'rigid' | 'instanced' | 'skinned' | 'cutout' | 'instancedCutout';
+/** The multiplying state: colour times what passes, clarity times clarity, order-free. */
+export declare const GLASS_TINT_BLEND: GPUBlendState;
+export declare class GpuGlassTint {
+    readonly frag: UniformRing;
+    private readonly layouts;
+    private plainGroup;
+    private groupVertBuffer;
+    private groupFragBuffer;
+    private readonly cutoutGroups;
+    private readonly skinnedGroups;
+    private readonly device;
+    constructor(device: GPUDevice);
+    /** One pane's block: what it lets through, how clear it is, and the light it is drawn for. */
+    writePane(slot: number, glass: ResolvedGlass, light: Float32Array): void;
+    /** The plain group, rebuilt only when a ring has grown a new buffer under it. */
+    group(vertBuffer: GPUBuffer): GPUBindGroup;
+    /** A cutout pane's group, one per map, built the first time that map casts colour. */
+    cutoutGroup(vertBuffer: GPUBuffer, view: GPUTextureView, sampler: GPUSampler): GPUBindGroup;
+    /** A skinned pane's group, one per palette view. */
+    skinnedGroup(vertBuffer: GPUBuffer, palette: GPUTextureView): GPUBindGroup;
+    /** The pipeline for one kind of caster, cull mode and vertex layout, cached by key. */
+    pipeline(cache: PipelineCache, kind: GlassTintKind, key: string, present: Readonly<Record<string, boolean>>, cullMode: GPUCullMode): GPURenderPipeline;
+    dispose(): void;
+}

package/dist/render/backend/webgpu/glassTintPass.js

@@ -0,0 +1,206 @@
+/**
+ * What a pane lets through, drawn into a shadow's tint layer on this device: the layouts, the
+ * per-draw block, the bind groups and the pipelines for the five tint programs (`depth.ts`).
+ *
+ * **The vertex half is the depth pass's**, block for block — the tint's vertex stages are the depth
+ * ones with the world position handed on — so a draw's vertex slot comes from the shadow pass's own
+ * ring and only the pane's 32 bytes are this file's. **The fragment half multiplies**: an
+ * `rgba8unorm` target cleared to white, `dst × src` for colour and `dst-alpha × src` for clarity, and
+ * no depth, so every pane on a ray counts in any order. Built the first time glass casts, so a scene
+ * with no glass builds none of it.
+ */
+import { DEPTH_BINDINGS } from '../../shaders/generated/depth.wgsl.js';
+import { GLASS_TINT_CUTOUT_FRAG_WGSL, GLASS_TINT_CUTOUT_VERT_WGSL, GLASS_TINT_FRAG_WGSL, GLASS_TINT_INSTANCED_CUTOUT_VERT_WGSL, GLASS_TINT_INSTANCED_VERT_WGSL, GLASS_TINT_SKINNED_VERT_WGSL, GLASS_TINT_VERT_WGSL, } from '../../shaders/generated/depth.wgsl.js';
+import { vertexBufferLayouts } from './buffers.js';
+import { shaderModule } from './shaderModules.js';
+import { UniformRing } from './uniformRing.js';
+const VISIBILITY_VERTEX = 0x1;
+const VISIBILITY_FRAGMENT = 0x2;
+const USAGE_UNIFORM_DST = 0x40 | 0x8; // UNIFORM | COPY_DST
+const VERT = DEPTH_BINDINGS.GLASS_TINT_VERT;
+const CUTOUT_VERT = DEPTH_BINDINGS.GLASS_TINT_CUTOUT_VERT;
+const FRAG = DEPTH_BINDINGS.GLASS_TINT_FRAG;
+const CUTOUT_MAP = DEPTH_BINDINGS.GLASS_TINT_CUTOUT_FRAG.textures.uCutoutMap;
+const PALETTE = DEPTH_BINDINGS.GLASS_TINT_SKINNED_VERT.textures.uJointPalette;
+const PANE = FRAG.fields.uGlassPane.offset;
+const LIGHT = FRAG.fields.uGlassLight.offset;
+/** Panes a frame can tint: a pane is a draw per shadow it reaches, and panes are few. */
+const MAX_TINT_DRAWS = 512;
+/** The multiplying state: colour times what passes, clarity times clarity, order-free. */
+export const GLASS_TINT_BLEND = {
+    color: { operation: 'add', srcFactor: 'dst', dstFactor: 'zero' },
+    alpha: { operation: 'add', srcFactor: 'dst-alpha', dstFactor: 'zero' },
+};
+export class GpuGlassTint {
+    frag;
+    layouts;
+    plainGroup = null;
+    groupVertBuffer = null;
+    groupFragBuffer = null;
+    cutoutGroups = new Map();
+    skinnedGroups = new Map();
+    device;
+    constructor(device) {
+        this.device = device;
+        this.frag = new UniformRing(device, FRAG.uniformSize, MAX_TINT_DRAWS, USAGE_UNIFORM_DST, 'glassTint.ring');
+        const vert = (size) => ({
+            binding: VERT.uniforms,
+            visibility: VISIBILITY_VERTEX,
+            buffer: { type: 'uniform', hasDynamicOffset: true, minBindingSize: size },
+        });
+        const frag = {
+            binding: FRAG.uniforms,
+            visibility: VISIBILITY_FRAGMENT,
+            buffer: { type: 'uniform', hasDynamicOffset: true, minBindingSize: FRAG.uniformSize },
+        };
+        this.layouts = {
+            plain: device.createBindGroupLayout({
+                label: 'glassTint.layout',
+                entries: [vert(VERT.uniformSize), frag],
+            }),
+            cutout: device.createBindGroupLayout({
+                label: 'glassTint.layout.cutout',
+                entries: [
+                    vert(CUTOUT_VERT.uniformSize),
+                    frag,
+                    {
+                        binding: CUTOUT_MAP.texture,
+                        visibility: VISIBILITY_FRAGMENT,
+                        /* A surface texture, and every surface texture is a `2d-array` view. */
+                        texture: { sampleType: 'float', viewDimension: '2d-array' },
+                    },
+                    {
+                        binding: CUTOUT_MAP.sampler,
+                        visibility: VISIBILITY_FRAGMENT,
+                        sampler: { type: 'filtering' },
+                    },
+                ],
+            }),
+            skinned: device.createBindGroupLayout({
+                label: 'glassTint.layout.skinned',
+                entries: [
+                    {
+                        binding: PALETTE.texture,
+                        visibility: VISIBILITY_VERTEX,
+                        texture: { sampleType: 'unfilterable-float' },
+                    },
+                    vert(VERT.uniformSize),
+                    frag,
+                ],
+            }),
+        };
+    }
+    /** One pane's block: what it lets through, how clear it is, and the light it is drawn for. */
+    writePane(slot, glass, light) {
+        const pane = paneScratch;
+        pane[0] = glass.transmission * glass.tint[0];
+        pane[1] = glass.transmission * glass.tint[1];
+        pane[2] = glass.transmission * glass.tint[2];
+        pane[3] = 1 - glass.frost;
+        this.frag.writeFloats(slot, PANE, pane);
+        this.frag.writeFloats(slot, LIGHT, light);
+    }
+    /** The plain group, rebuilt only when a ring has grown a new buffer under it. */
+    group(vertBuffer) {
+        if (this.plainGroup === null ||
+            this.groupVertBuffer !== vertBuffer ||
+            this.groupFragBuffer !== this.frag.buffer) {
+            this.cutoutGroups.clear();
+            this.skinnedGroups.clear();
+            this.groupVertBuffer = vertBuffer;
+            this.groupFragBuffer = this.frag.buffer;
+            this.plainGroup = this.device.createBindGroup({
+                label: 'glassTint.group',
+                layout: this.layouts.plain,
+                entries: [
+                    { binding: VERT.uniforms, resource: { buffer: vertBuffer, size: VERT.uniformSize } },
+                    {
+                        binding: FRAG.uniforms,
+                        resource: { buffer: this.frag.buffer, size: FRAG.uniformSize },
+                    },
+                ],
+            });
+        }
+        return this.plainGroup;
+    }
+    /** A cutout pane's group, one per map, built the first time that map casts colour. */
+    cutoutGroup(vertBuffer, view, sampler) {
+        this.group(vertBuffer);
+        const held = this.cutoutGroups.get(view);
+        if (held !== undefined)
+            return held;
+        const made = this.device.createBindGroup({
+            label: 'glassTint.group.cutout',
+            layout: this.layouts.cutout,
+            entries: [
+                {
+                    binding: CUTOUT_VERT.uniforms,
+                    resource: { buffer: vertBuffer, size: CUTOUT_VERT.uniformSize },
+                },
+                { binding: FRAG.uniforms, resource: { buffer: this.frag.buffer, size: FRAG.uniformSize } },
+                { binding: CUTOUT_MAP.texture, resource: view },
+                { binding: CUTOUT_MAP.sampler, resource: sampler },
+            ],
+        });
+        this.cutoutGroups.set(view, made);
+        return made;
+    }
+    /** A skinned pane's group, one per palette view. */
+    skinnedGroup(vertBuffer, palette) {
+        this.group(vertBuffer);
+        const held = this.skinnedGroups.get(palette);
+        if (held !== undefined)
+            return held;
+        const made = this.device.createBindGroup({
+            label: 'glassTint.group.skinned',
+            layout: this.layouts.skinned,
+            entries: [
+                { binding: PALETTE.texture, resource: palette },
+                { binding: VERT.uniforms, resource: { buffer: vertBuffer, size: VERT.uniformSize } },
+                { binding: FRAG.uniforms, resource: { buffer: this.frag.buffer, size: FRAG.uniformSize } },
+            ],
+        });
+        this.skinnedGroups.set(palette, made);
+        return made;
+    }
+    /** The pipeline for one kind of caster, cull mode and vertex layout, cached by key. */
+    pipeline(cache, kind, key, present, cullMode) {
+        const cutout = kind === 'cutout' || kind === 'instancedCutout';
+        const instanced = kind === 'instanced' || kind === 'instancedCutout';
+        const layout = kind === 'skinned' ? this.layouts.skinned : cutout ? this.layouts.cutout : this.layouts.plain;
+        const vertex = kind === 'rigid'
+            ? GLASS_TINT_VERT_WGSL
+            : kind === 'instanced'
+                ? GLASS_TINT_INSTANCED_VERT_WGSL
+                : kind === 'skinned'
+                    ? GLASS_TINT_SKINNED_VERT_WGSL
+                    : kind === 'cutout'
+                        ? GLASS_TINT_CUTOUT_VERT_WGSL
+                        : GLASS_TINT_INSTANCED_CUTOUT_VERT_WGSL;
+        const label = `glass-tint|${kind}|${cullMode}|${key}`;
+        return cache.get(label, () => ({
+            label,
+            layout: this.device.createPipelineLayout({ bindGroupLayouts: [layout] }),
+            vertex: {
+                module: shaderModule(this.device, { label: `glassTint.${kind}.vert`, code: vertex }),
+                entryPoint: 'main',
+                buffers: vertexBufferLayouts(present, instanced),
+            },
+            fragment: {
+                module: shaderModule(this.device, {
+                    label: cutout ? 'glassTint.cutout.frag' : 'glassTint.frag',
+                    code: cutout ? GLASS_TINT_CUTOUT_FRAG_WGSL : GLASS_TINT_FRAG_WGSL,
+                }),
+                entryPoint: 'main',
+                targets: [{ format: 'rgba8unorm', blend: GLASS_TINT_BLEND }],
+            },
+            /* The depth pass's primitive state exactly — its winding included, for the reason
+               `depthPipeline` gives: this map is sampled, not presented. */
+            primitive: { topology: 'triangle-list', cullMode, frontFace: 'cw' },
+        }));
+    }
+    dispose() {
+        this.frag.dispose();
+    }
+}
+const paneScratch = new Float32Array(4);