@forgeax/engine-render 0.1.20 → 0.1.23

package/src/transmission/__tests__/standard-transmission.dawn.test.ts

@@ -14,6 +14,7 @@ import {
   DirectionalLight,
   MeshFilter,
   MeshRenderer,
+  PointLight,
   TONEMAP_LINEAR,
 } from '../../components';
 import { constructRendererHost, type RhiBackendPack } from '../../construct-renderer';
@@ -57,8 +58,10 @@ interface TransmissionCase {
   readonly thicknessTexture?: number;
   readonly masked?: boolean;
   readonly overlap?: boolean;
-  readonly lane?: 'direct' | 'clustered';
+  readonly renderPath?: 'forward' | 'deferred';
   readonly surfaceQuat?: readonly [number, number, number, number];
+  readonly directionalLight?: boolean;
+  readonly localLight?: boolean;
 }
 
 function textureAsset(value: number): TextureAsset {
@@ -106,6 +109,7 @@ async function renderCase(testCase: TransmissionCase): Promise<{
   readonly pixel: readonly [number, number, number, number];
   readonly passNames: readonly string[];
   readonly observation: boolean;
+  readonly errors: readonly string[];
 }> {
   let device: GPUDevice | undefined;
   let configuredDevice: GPUDevice | undefined;
@@ -157,7 +161,7 @@ async function renderCase(testCase: TransmissionCase): Promise<{
       {
         standardProfile: {
           ...DEFAULT_STANDARD_PROFILE,
-          lighting: testCase.lane ?? 'direct',
+          renderPath: testCase.renderPath ?? DEFAULT_STANDARD_PROFILE.renderPath,
         },
       },
       { shaderManifestUrl: ENGINE_MANIFEST_URL },
@@ -172,6 +176,10 @@ async function renderCase(testCase: TransmissionCase): Promise<{
   }
 
   const { renderer } = host.value;
+  const errors: string[] = [];
+  const unsubscribe = renderer.subscribe((event) => {
+    if (event.kind === 'error') errors.push(event.error.code);
+  });
   const world = new World();
   const lease = renderer.attach(world);
   if (!lease.ok) throw lease.error;
@@ -277,12 +285,22 @@ async function renderCase(testCase: TransmissionCase): Promise<{
   );
   expect(cameraEntity.ok, `${testCase.name}: camera spawn must succeed`).toBe(true);
   if (!cameraEntity.ok) throw cameraEntity.error;
-  const lightEntity = world.spawn({
-    component: DirectionalLight,
-    data: { direction: [0, 0, -1], color: [1, 1, 1], intensity: 1, castShadow: false },
-  });
-  expect(lightEntity.ok, `${testCase.name}: light spawn must succeed`).toBe(true);
-  if (!lightEntity.ok) throw lightEntity.error;
+  if (testCase.directionalLight !== false) {
+    const lightEntity = world.spawn({
+      component: DirectionalLight,
+      data: { direction: [0, 0, -1], color: [1, 1, 1], intensity: 1, castShadow: false },
+    });
+    expect(lightEntity.ok, `${testCase.name}: light spawn must succeed`).toBe(true);
+    if (!lightEntity.ok) throw lightEntity.error;
+  }
+  if (testCase.localLight === true) {
+    const localLightEntity = world.spawn(
+      { component: Transform, data: { pos: [0, 0, 1] } },
+      { component: PointLight, data: { intensity: 8, range: 10 } },
+    );
+    expect(localLightEntity.ok, `${testCase.name}: local light spawn must succeed`).toBe(true);
+    if (!localLightEntity.ok) throw localLightEntity.error;
+  }
   world.update().unwrap();
   const drawn = renderer.draw({
     leases: [lease.value],
@@ -299,10 +317,12 @@ async function renderCase(testCase: TransmissionCase): Promise<{
   const renderDevice = configuredDevice ?? device;
   const passNames = renderer.inspect().perFramePassNames;
   expect(renderer.inspect().renderScene.projectionRecords).toBeGreaterThanOrEqual(1);
+  unsubscribe();
   return {
     pixel: await readCenter(renderDevice, target),
     passNames,
     observation: observation.ok,
+    errors,
   };
 }
 
@@ -403,9 +423,9 @@ describe('Standard transmission Dawn ROI', () => {
     );
   }, 120_000);
 
-  it('exercises direct/clustered lanes and transmission-before-BLEND overlap order', async () => {
-    const direct = await renderCase({
-      name: 'direct',
+  it('exercises both Standard render paths and transmission-before-BLEND overlap order', async () => {
+    const forward = await renderCase({
+      name: 'forward',
       transmission: 1,
       ior: 1.5,
       thickness: 0.5,
@@ -413,10 +433,10 @@ describe('Standard transmission Dawn ROI', () => {
       attenuationColor: [0.7, 0.8, 0.9],
       attenuationDistance: 2,
       overlap: true,
-      lane: 'direct',
+      renderPath: 'forward',
     });
-    const clustered = await renderCase({
-      name: 'clustered',
+    const deferred = await renderCase({
+      name: 'deferred',
       transmission: 1,
       ior: 1.5,
       thickness: 0.5,
@@ -424,14 +444,33 @@ describe('Standard transmission Dawn ROI', () => {
       attenuationColor: [0.7, 0.8, 0.9],
       attenuationDistance: 2,
       overlap: true,
-      lane: 'clustered',
+      renderPath: 'deferred',
     });
-    const transmissionIndex = direct.passNames.indexOf('transmission-forward');
-    const transparentIndex = direct.passNames.indexOf('transparent');
+    const transmissionIndex = forward.passNames.indexOf('transmission-forward');
+    const transparentIndex = forward.passNames.indexOf('transparent');
     expect(transmissionIndex).toBeGreaterThanOrEqual(0);
     expect(transparentIndex).toBeGreaterThan(transmissionIndex);
-    expect(clustered.pixel).not.toEqual(direct.pixel);
-    expect(clustered.pixel.every(Number.isFinite)).toBe(true);
-    expect(direct.pixel.every(Number.isFinite)).toBe(true);
+    expect(deferred.pixel.every(Number.isFinite)).toBe(true);
+    expect(forward.pixel.every(Number.isFinite)).toBe(true);
+  }, 120_000);
+
+  it('submits a real clustered local-light frame through the Standard front door', async () => {
+    const clustered = await renderCase({
+      name: 'clustered-local-light',
+      transmission: 0,
+      ior: 1.5,
+      thickness: 0,
+      roughness: 0.4,
+      attenuationColor: [1, 1, 1],
+      directionalLight: false,
+      localLight: true,
+      renderPath: 'forward',
+    });
+
+    expect(clustered.passNames).toEqual(
+      expect.arrayContaining(['cluster-membership-producer', 'main', 'output-transform']),
+    );
+    expect(clustered.observation).toBe(true);
+    expect(clustered.errors).toEqual([]);
   }, 120_000);
 });

package/src/typed-render-graph-primitives.ts

@@ -34,6 +34,7 @@ import {
 } from './render-graph-primitives';
 import type { RenderPipelineFrame, RenderPipelineGpuDrivenProjection } from './render-pipeline';
 import { createRenderPipelineTarget, type RenderPipelineTarget } from './render-pipeline';
+import type { OcclusionFrameProjection } from './scene/visibility/occlusion-runtime';
 import {
   getTemporalBindGroupResources,
   getTemporalGpuState,
@@ -136,6 +137,7 @@ export interface TypedScenePassOptions {
   readonly transmissionBackdrop?: GraphTextureView | undefined;
   readonly extraAccesses?: readonly GraphAccess[] | undefined;
   readonly gpuDriven?: RenderPipelineGpuDrivenProjection | undefined;
+  readonly occlusion?: OcclusionFrameProjection | undefined;
 }
 
 export function addTypedScenePass(
@@ -187,6 +189,7 @@ export function addTypedScenePass(
       stencilLoadOp: options.depthLoadOp ?? 'clear',
       stencilStoreOp: 'store',
     },
+    occlusionQuerySet: options.occlusion?.querySet,
     encode: ({ pass, frame, resources }) => {
       const colorViews = colorTargets.map((target) => resolvedView(resources, target.view));
       const depthView = resolvedView(resources, options.depth.view);
@@ -222,17 +225,29 @@ export function addTypedScenePass(
           projectorSampler:
             internal.spotLightProjector?.sampler ?? internal.volumetricFog?.projectorSampler,
         },
+        true,
+        internal.standardLighting,
       );
       if (groups.viewBindGroup !== null) {
         options.gpuDriven?.encode(groups.viewBindGroup, pass, resources);
       }
+      // The context carries the frame's primary occlusion projection for
+      // pipeline construction, but only the pass that owns that projection
+      // may begin its query. Forwarding it to deferred/temporal scene passes
+      // leaves their descriptors without an occlusionQuerySet and makes Dawn
+      // reject beginOcclusionQuery in those passes.
+      const activeOcclusion = options.occlusion;
       encodeMainPass(
         {
           ...internal,
+          ...(activeOcclusion === undefined ? {} : { occlusion: activeOcclusion }),
           geometryColorView: colorViews[0] ?? null,
           geometryDepthView: depthView,
           geometryColorResolveView: resolveView,
           transparentColorFormat: colorTargets[0]?.format as GPUTextureFormat,
+          ...(colorTargets[1]?.format === 'rgba16float'
+            ? { reflectionFallbackColorFormat: 'rgba16float' as const }
+            : {}),
           msaaActive: colorTargets[0]?.sampleCount === 4,
           viewBindGroup: groups.viewBindGroup,
           meshBindGroup: groups.meshBindGroup,
@@ -254,6 +269,10 @@ export function addTypedScenePass(
             : { transmissionBackdropView: transmissionBackdrop }),
         },
       );
+      if (activeOcclusion !== undefined) {
+        const proxyResult = activeOcclusion.encodeProxyBounds(pass);
+        if (!proxyResult.ok) throw proxyResult.error;
+      }
     },
   });
 }
@@ -289,6 +308,37 @@ export function addTypedFrameObservationPass(
   });
 }
 
+/** Publish the same-frame fallback MRT as a detached, copy-readable source. */
+export function addReflectionFallbackObservationPass(
+  graph: RenderGraphBuilder<RenderPipelineFrame>,
+  target: RenderPipelineTarget,
+): Result<void, RenderGraphError> {
+  return graph.addCopyPass('reflection-fallback-observation', {
+    accesses: [{ resource: target.view, usage: 'copy-src' }],
+    encode: ({ frame, resources }) => {
+      const internal = frame as _InternalRenderPipelineContext;
+      const texture = resources.texture(target.texture);
+      if (!texture.ok) throw texture.error;
+      internal.frameState.reflectionFallbackObservationSource = {
+        texture: texture.value,
+        descriptor: {
+          texture: texture.value,
+          format: target.format,
+          size: { width: frame.targetW, height: frame.targetH },
+          usage:
+            GPU_TEXTURE_USAGE_COPY_SRC |
+            GPU_TEXTURE_USAGE_RENDER_ATTACHMENT |
+            GPU_TEXTURE_USAGE_TEXTURE_BINDING,
+          sample: target.sampleCount,
+        },
+        frameId: internal.frameState.frameNumber,
+        pipelineId: 'forgeax::standard',
+        backendId: internal.runtime.device.caps.backendKind,
+      };
+    },
+  });
+}
+
 export interface TypedBloomTargets {
   readonly scene: RenderPipelineTarget;
   readonly composited: RenderPipelineTarget;
@@ -696,7 +746,7 @@ export function addTypedOutputTransformPass(
   graph: RenderGraphBuilder<RenderPipelineFrame>,
   input: RenderPipelineTarget,
   output: RenderPipelineTarget,
-  options: { readonly outputOnly?: boolean; readonly outputTransform?: boolean } = {},
+  options: { readonly outputOnly?: boolean; readonly dither?: boolean } = {},
 ): Result<void, RenderGraphError> {
   const outputOnly = options.outputOnly ?? false;
   return addTypedFullscreenPass(graph, {
@@ -706,7 +756,7 @@ export function addTypedOutputTransformPass(
     output,
     outputOnly,
     rawSwapchainOutput: outputOnly,
-    ...(options.outputTransform === true
+    ...(options.dither !== undefined
       ? {
           paramsTransform: (params: Uint8Array | undefined): Uint8Array | undefined => {
             if (params === undefined || params.byteLength !== 16) return params;
@@ -715,7 +765,7 @@ export function addTypedOutputTransformPass(
               transformed.buffer,
               transformed.byteOffset,
               transformed.byteLength,
-            ).setFloat32(12, 1, true);
+            ).setFloat32(12, options.dither === true ? 1 : 0, true);
             return transformed;
           },
         }

package/src/typed-shadow-passes.ts

@@ -13,7 +13,7 @@ import { createRenderPipelineTarget, type RenderPipelineTarget } from './render-
 import { resolveDirectionalShadowAtlasGrid } from './typed-shadow-atlas';
 
 export interface TypedShadowTargets {
-  readonly directional: RenderPipelineTarget;
+  readonly directional?: RenderPipelineTarget | undefined;
   readonly spot: RenderPipelineTarget;
   readonly point?: RenderPipelineTarget | undefined;
 }
@@ -44,44 +44,50 @@ export function addTypedShadowPasses(
   graph: RenderGraphBuilder<RenderPipelineFrame>,
   topology: RenderPipelineTopology,
 ): Result<TypedShadowTargets, RenderGraphError> {
-  const atlasGrid = resolveDirectionalShadowAtlasGrid(topology.shadow.cascadeCount);
-  const directional = createRenderPipelineTarget(graph, 'directional-shadow-depth', {
-    format: 'depth32float',
-    size: {
-      width: topology.shadow.mapSize * atlasGrid.columns,
-      height: topology.shadow.mapSize * atlasGrid.rows,
-    },
-  });
-  if (!directional.ok) return directional;
-  for (let cascade = 0; cascade < topology.shadow.cascadeCount; cascade += 1) {
-    const col = cascade % atlasGrid.columns;
-    const row = Math.floor(cascade / atlasGrid.columns);
-    const added = recordShadowPass(
-      graph,
-      `shadowCascade${cascade}`,
-      directional.value,
-      cascade === 0 ? 'clear' : 'load',
-      ({ pass, frame }) =>
-        encodeDirectionalShadowPass(frame as never, pass, cascade, {
-          x: col * topology.shadow.mapSize,
-          y: row * topology.shadow.mapSize,
-          w: topology.shadow.mapSize,
-          h: topology.shadow.mapSize,
-        }),
-      (frame) => !(frame as _InternalRenderPipelineContext).directionalShadowCacheReuse,
-    );
-    if (!added.ok) return added;
+  let directional: RenderPipelineTarget | undefined;
+  if (topology.shadow.directional !== 'disabled') {
+    const { mapSize, cascadeCount } = topology.shadow.directional;
+    const atlasGrid = resolveDirectionalShadowAtlasGrid(cascadeCount);
+    const target = createRenderPipelineTarget(graph, 'directional-shadow-depth', {
+      format: 'depth32float',
+      size: {
+        width: mapSize * atlasGrid.columns,
+        height: mapSize * atlasGrid.rows,
+      },
+    });
+    if (!target.ok) return target;
+    const directionalTarget = target.value;
+    directional = directionalTarget;
+    for (let cascade = 0; cascade < cascadeCount; cascade += 1) {
+      const col = cascade % atlasGrid.columns;
+      const row = Math.floor(cascade / atlasGrid.columns);
+      const added = recordShadowPass(
+        graph,
+        `shadowCascade${cascade}`,
+        directionalTarget,
+        cascade === 0 ? 'clear' : 'load',
+        ({ pass, frame }) =>
+          encodeDirectionalShadowPass(frame as never, pass, cascade, {
+            x: col * mapSize,
+            y: row * mapSize,
+            w: mapSize,
+            h: mapSize,
+          }),
+        (frame) => !(frame as _InternalRenderPipelineContext).directionalShadowCacheReuse,
+      );
+      if (!added.ok) return added;
+    }
+    const observation = graph.addCopyPass('directional-shadow-observation', {
+      accesses: [{ resource: directionalTarget.view, usage: 'copy-src' }],
+      encode: ({ frame, resources }) => {
+        const internal = frame as _InternalRenderPipelineContext;
+        const texture = resources.texture(directionalTarget.texture);
+        if (!texture.ok) throw texture.error;
+        internal.pipelineState.perPassResources.shadowTexture = texture.value;
+      },
+    });
+    if (!observation.ok) return observation;
   }
-  const observation = graph.addCopyPass('directional-shadow-observation', {
-    accesses: [{ resource: directional.value.view, usage: 'copy-src' }],
-    encode: ({ frame, resources }) => {
-      const internal = frame as _InternalRenderPipelineContext;
-      const texture = resources.texture(directional.value.texture);
-      if (!texture.ok) throw texture.error;
-      internal.pipelineState.perPassResources.shadowTexture = texture.value;
-    },
-  });
-  if (!observation.ok) return observation;
 
   let point: RenderPipelineTarget | undefined;
   if (topology.shadow.pointCount > 0) {
@@ -148,7 +154,7 @@ export function addTypedShadowPasses(
 
   const spot = createRenderPipelineTarget(graph, 'spot-shadow-depth', {
     format: 'depth32float',
-    size: { width: topology.shadow.mapSize * 2, height: topology.shadow.mapSize * 2 },
+    size: { width: topology.shadow.spotMapSize * 2, height: topology.shadow.spotMapSize * 2 },
   });
   if (!spot.ok) return spot;
   for (let spotIndex = 0; spotIndex < Math.max(1, topology.shadow.spotCount); spotIndex += 1) {
@@ -162,5 +168,5 @@ export function addTypedShadowPasses(
     if (!added.ok) return added;
   }
 
-  return ok({ directional: directional.value, spot: spot.value, point });
+  return ok({ directional, spot: spot.value, point });
 }

package/src/volume/passes.ts

@@ -2,8 +2,8 @@ import type {
   GraphBuffer,
   GraphTextureView,
   RenderGraphBuilder,
-  RenderGraphError,
 } from '@forgeax/engine-render-graph';
+import { RenderGraphError } from '@forgeax/engine-render-graph';
 import type {
   BindGroup,
   BindGroupLayout,
@@ -14,18 +14,10 @@ import type {
   TextureView,
 } from '@forgeax/engine-rhi';
 import { RhiError } from '@forgeax/engine-rhi';
-import { ok, type Result } from '@forgeax/engine-types';
+import { err, ok, type Result } from '@forgeax/engine-types';
 import { GPU_TEXTURE_USAGE_TEXTURE_BINDING } from '../gpu-texture-usage';
-import {
-  GPU_BUFFER_USAGE_COPY_DST,
-  GPU_BUFFER_USAGE_STORAGE,
-  GPU_BUFFER_USAGE_UNIFORM,
-} from '../gpu-usage';
-import {
-  LIGHT_ARRAY_HEADER_BYTES,
-  LIGHT_ARRAY_MAX_SLOTS,
-  SPOT_LIGHT_STD430_BYTES,
-} from '../light-buffer-layout';
+import { GPU_BUFFER_USAGE_COPY_DST, GPU_BUFFER_USAGE_UNIFORM } from '../gpu-usage';
+import type { StandardClusterGraphBuffers } from '../pipeline/standard-lighting/graph';
 import { VIEW_UNIFORM_BYTES } from '../record/view-ubo';
 import type { VolumetricFogFrameContext, VolumetricFogShaderSources } from '../render-contract';
 import type {
@@ -89,10 +81,12 @@ export interface VolumetricFogPassInputs {
   readonly density: GraphTextureView;
   readonly params: GraphBuffer;
   readonly view: GraphBuffer;
-  readonly directionalShadow: GraphTextureView;
+  readonly directionalShadow?: GraphTextureView;
   readonly spotShadow: GraphTextureView;
-  readonly pointLights: GraphBuffer;
-  readonly spotLights: GraphBuffer;
+  /** The single Standard Cluster light payload consumed by all volume stages. */
+  readonly lightData: GraphBuffer;
+  /** The Cluster uniform carries the admitted light count for slot guards. */
+  readonly clusterUniform: GraphBuffer;
   readonly selectedLightKind: 'directional' | 'point' | 'spot';
   readonly projector?: GraphTextureView;
 }
@@ -166,13 +160,29 @@ function importVolumeInputs(
   topology: RenderPipelineTopology,
   linearHdr: RenderPipelineTarget,
   sceneDepth: GraphTextureView,
-  directionalShadow: GraphTextureView,
+  directionalShadow: GraphTextureView | undefined,
   spotShadow: GraphTextureView,
   selectedLightKind: 'directional' | 'point' | 'spot' | undefined,
+  clusterBuffers: StandardClusterGraphBuffers | null,
 ): Result<ImportedVolumeInputs | undefined, RenderGraphError> {
   const volume = topology.volumetricFog;
   if (volume?.enabled !== true || volume.format === undefined || volume.extent === undefined)
     return ok(undefined);
+  if (clusterBuffers === null) {
+    return err(
+      new RenderGraphError({
+        code: 'resource-descriptor-invalid',
+        expected: 'volumetric fog consumes the Standard Cluster light buffers',
+        hint: 'enable the storage-backed Standard Cluster transport before enabling volumetric fog',
+        detail: {
+          resourceLabel: 'volumetric-fog',
+          field: 'clusterBuffers',
+          expected: 'StandardClusterGraphBuffers',
+          actual: 'missing',
+        },
+      }),
+    );
+  }
   const texture = graph.importTexture(
     'volume-density',
     {
@@ -218,21 +228,6 @@ function importVolumeInputs(
     (frame) => frame.pipelineState.viewUniformBuffer,
   );
   if (!view.ok) return view;
-  const spotLights = graph.importBuffer(
-    'volume-spot-lights',
-    {
-      size: LIGHT_ARRAY_HEADER_BYTES + LIGHT_ARRAY_MAX_SLOTS * SPOT_LIGHT_STD430_BYTES,
-      usage: GPU_BUFFER_USAGE_STORAGE | GPU_BUFFER_USAGE_COPY_DST,
-    },
-    (frame) => frame.pipelineState.spotLightsBuffer,
-  );
-  if (!spotLights.ok) return spotLights;
-  const pointLights = graph.importBuffer(
-    'volume-point-lights',
-    { size: 16 + 4 * 32, usage: GPU_BUFFER_USAGE_STORAGE | GPU_BUFFER_USAGE_COPY_DST },
-    (frame) => frame.pipelineState.pointLightsBuffer,
-  );
-  if (!pointLights.ok) return pointLights;
   let projector: GraphTextureView | undefined;
   if (volume.projector !== undefined) {
     const projectorTexture = graph.importTexture(
@@ -268,10 +263,10 @@ function importVolumeInputs(
     density: density.value,
     params: params.value,
     view: view.value,
-    directionalShadow,
+    ...(directionalShadow === undefined ? {} : { directionalShadow }),
     spotShadow,
-    pointLights: pointLights.value,
-    spotLights: spotLights.value,
+    lightData: clusterBuffers.lightData,
+    clusterUniform: clusterBuffers.clusterUniform,
     selectedLightKind: selectedLightKind ?? 'directional',
     ...(projector === undefined ? {} : { projector }),
   });
@@ -281,8 +276,9 @@ export function addAuthoredVolumetricFogPasses(
   topology: RenderPipelineTopology,
   linearHdr: RenderPipelineTarget,
   sceneDepth: GraphTextureView,
-  directionalShadow: GraphTextureView,
+  directionalShadow: GraphTextureView | undefined,
   spotShadow: GraphTextureView,
+  clusterBuffers: StandardClusterGraphBuffers | null,
 ): Result<void, RenderGraphError> {
   // A paired Point+Spot volume stores the Spot shadow lane as well. The
   // topology's primary light remains PointLight for radiance selection, but
@@ -300,6 +296,7 @@ export function addAuthoredVolumetricFogPasses(
     directionalShadow,
     spotShadow,
     shadowLightKind,
+    clusterBuffers,
   );
   if (!imported.ok) return imported;
   if (imported.value === undefined) return ok(undefined);
@@ -320,6 +317,15 @@ export function addVolumetricFogPasses(
   const packedLayers = Math.ceil(inputs.resources.extent.depth / VOLUME_PACKING_Z);
   const resolvedDispatchX = Math.ceil(inputs.resources.resolvedExtent.width / 8);
   const resolvedDispatchY = Math.ceil(inputs.resources.resolvedExtent.height / 8);
+  // Point-light volume injection has no cube-array shadow sampler. It keeps
+  // the directional cascade count at zero and therefore needs only a valid
+  // 2D depth binding; use the always-present spot target as the inert binding
+  // when directional shadows are disabled. Directional selection still uses
+  // its own target whenever one exists, and spot selection uses spotShadow.
+  const shadowResource =
+    inputs.selectedLightKind === 'spot'
+      ? inputs.spotShadow
+      : (inputs.directionalShadow ?? inputs.spotShadow);
   let inject: ComputeState | undefined;
   let integrate: ComputeState | undefined;
   let temporal: ComputeState | undefined;
@@ -330,12 +336,11 @@ export function addVolumetricFogPasses(
       { resource: inputs.params, usage: 'uniform-read' },
       { resource: inputs.view, usage: 'uniform-read' },
       {
-        resource:
-          inputs.selectedLightKind === 'spot' ? inputs.spotShadow : inputs.directionalShadow,
+        resource: shadowResource,
         usage: 'sampled-read',
       },
-      { resource: inputs.spotLights, usage: 'storage-read' },
-      { resource: inputs.pointLights, usage: 'storage-read' },
+      { resource: inputs.lightData, usage: 'storage-read' },
+      { resource: inputs.clusterUniform, usage: 'uniform-read' },
       ...(inputs.projector === undefined
         ? []
         : [{ resource: inputs.projector, usage: 'sampled-read' as const }]),
@@ -357,21 +362,19 @@ export function addVolumetricFogPasses(
           },
         },
         { binding: 7, visibility: 4, buffer: { type: 'read-only-storage' } },
-        { binding: 8, visibility: 4, buffer: { type: 'read-only-storage' } },
+        { binding: 8, visibility: 4, buffer: { type: 'uniform' } },
       ]);
-      const shadow = resources.textureView(
-        inputs.selectedLightKind === 'spot' ? inputs.spotShadow : inputs.directionalShadow,
-      );
+      const shadow = resources.textureView(shadowResource);
       const params = resources.buffer(inputs.params);
       const view = resources.buffer(inputs.view);
-      const spotLights = resources.buffer(inputs.spotLights);
-      const pointLights = resources.buffer(inputs.pointLights);
+      const lightData = resources.buffer(inputs.lightData);
+      const clusterUniform = resources.buffer(inputs.clusterUniform);
       const froxel = resources.textureView(inputs.resources.froxelView);
       if (!shadow.ok) throw shadow.error;
       if (!params.ok) throw params.error;
       if (!view.ok) throw view.error;
-      if (!spotLights.ok) throw spotLights.error;
-      if (!pointLights.ok) throw pointLights.error;
+      if (!lightData.ok) throw lightData.error;
+      if (!clusterUniform.ok) throw clusterUniform.error;
       if (!froxel.ok) throw froxel.error;
       const shadowSampler = frame.runtime.device.createSampler({ compare: 'less' });
       if (!shadowSampler.ok) throw shadowSampler.error;
@@ -381,8 +384,8 @@ export function addVolumetricFogPasses(
         { binding: 4, resource: { kind: 'sampler', value: shadowSampler.value } },
         { binding: 5, resource: { kind: 'buffer', value: { buffer: params.value } } },
         { binding: 6, resource: { kind: 'textureView', value: froxel.value as never } },
-        { binding: 7, resource: { kind: 'buffer', value: { buffer: spotLights.value } } },
-        { binding: 8, resource: { kind: 'buffer', value: { buffer: pointLights.value } } },
+        { binding: 7, resource: { kind: 'buffer', value: { buffer: lightData.value } } },
+        { binding: 8, resource: { kind: 'buffer', value: { buffer: clusterUniform.value } } },
       ]);
       pass.setPipeline(inject.pipeline);
       pass.setBindGroup(0, bindings);
@@ -400,8 +403,8 @@ export function addVolumetricFogPasses(
       { resource: inputs.resources.temporalView, usage: 'storage-write' },
       { resource: inputs.params, usage: 'uniform-read' },
       { resource: inputs.view, usage: 'uniform-read' },
-      { resource: inputs.spotLights, usage: 'storage-read' },
-      { resource: inputs.pointLights, usage: 'storage-read' },
+      { resource: inputs.lightData, usage: 'storage-read' },
+      { resource: inputs.clusterUniform, usage: 'uniform-read' },
       ...(inputs.projector === undefined
         ? []
         : [{ resource: inputs.projector, usage: 'sampled-read' as const }]),
@@ -443,7 +446,7 @@ export function addVolumetricFogPasses(
           },
         },
         { binding: 10, visibility: 4, buffer: { type: 'read-only-storage' } },
-        { binding: 11, visibility: 4, buffer: { type: 'read-only-storage' } },
+        { binding: 11, visibility: 4, buffer: { type: 'uniform' } },
         { binding: 12, visibility: 4, texture: { sampleType: 'float', viewDimension: '2d' } },
         { binding: 13, visibility: 4, sampler: { type: 'filtering' } },
       ]);
@@ -455,8 +458,8 @@ export function addVolumetricFogPasses(
       const temporalSeed = resources.textureView(inputs.resources.temporalView);
       const params = resources.buffer(inputs.params);
       const view = resources.buffer(inputs.view);
-      const spotLights = resources.buffer(inputs.spotLights);
-      const pointLights = resources.buffer(inputs.pointLights);
+      const lightData = resources.buffer(inputs.lightData);
+      const clusterUniform = resources.buffer(inputs.clusterUniform);
       const projector =
         inputs.projector === undefined ? undefined : resources.textureView(inputs.projector);
       if (!froxel.ok) throw froxel.error;
@@ -467,8 +470,8 @@ export function addVolumetricFogPasses(
       if (!temporalSeed.ok) throw temporalSeed.error;
       if (!params.ok) throw params.error;
       if (!view.ok) throw view.error;
-      if (!spotLights.ok) throw spotLights.error;
-      if (!pointLights.ok) throw pointLights.error;
+      if (!lightData.ok) throw lightData.error;
+      if (!clusterUniform.ok) throw clusterUniform.error;
       if (projector !== undefined && !projector.ok) throw projector.error;
       const sampler = frame.runtime.device.createSampler({
         minFilter: 'linear',
@@ -494,8 +497,8 @@ export function addVolumetricFogPasses(
         { binding: 7, resource: { kind: 'sampler', value: densitySampler.value } },
         { binding: 8, resource: { kind: 'textureView', value: historySeed.value as never } },
         { binding: 9, resource: { kind: 'textureView', value: temporalSeed.value as never } },
-        { binding: 10, resource: { kind: 'buffer', value: { buffer: spotLights.value } } },
-        { binding: 11, resource: { kind: 'buffer', value: { buffer: pointLights.value } } },
+        { binding: 10, resource: { kind: 'buffer', value: { buffer: lightData.value } } },
+        { binding: 11, resource: { kind: 'buffer', value: { buffer: clusterUniform.value } } },
         {
           binding: 12,
           resource: {