angular-three-soba 4.0.0-next.97 → 4.0.0-next.99

package/fesm2022/angular-three-soba-staging.mjs

@@ -1,18 +1,18 @@
 import * as i0 from '@angular/core';
 import { input, viewChild, computed, effect, inject, DestroyRef, untracked, Component, CUSTOM_ELEMENTS_SCHEMA, ChangeDetectionStrategy, signal, Directive, output, Injector, contentChild, TemplateRef, numberAttribute, ViewContainerRef } from '@angular/core';
 import * as i1 from 'angular-three';
-import { omit, injectStore, pick, extend, getInstanceState, injectBeforeRender, checkUpdate, NgtArgs, vector3, is, resolveRef, injectLoader, applyProps, NgtPortal } from 'angular-three';
+import { omit, injectStore, pick, extend, getInstanceState, beforeRender, checkUpdate, NgtArgs, vector3, is, resolveRef, loaderResource, applyProps, NgtPortal } from 'angular-three';
 import { ProgressiveLightMap, SoftShadowMaterial, CausticsProjectionMaterial, createCausticsUpdate, SpotLightMaterial } from 'angular-three-soba/vanilla-exports';
 import { mergeInputs } from 'ngxtension/inject-inputs';
 import * as THREE from 'three';
 import { Group, Mesh, PlaneGeometry, Scene, LineBasicMaterial, OrthographicCamera, MeshBasicMaterial, CubeCamera, RingGeometry, DirectionalLight, Vector2, RepeatWrapping, SpotLight, AmbientLight, PointLight } from 'three';
 import { SimplexNoise, HorizontalBlurShader, VerticalBlurShader, RGBELoader, EXRLoader, GroundProjectedEnv, Sky, FullScreenQuad } from 'three-stdlib';
-import { injectHelper, NgtsEdges, NgtsHelper } from 'angular-three-soba/abstractions';
-import { injectFBO, getVersion } from 'angular-three-soba/misc';
+import { helper, NgtsEdges, NgtsHelper } from 'angular-three-soba/abstractions';
+import { fbo, getVersion } from 'angular-three-soba/misc';
 import { NgTemplateOutlet } from '@angular/common';
 import { HDRJPGLoader, GainMapLoader } from '@monogrid/gainmap-js';
 import { assertInjector } from 'ngxtension/assert-injector';
-import { injectTexture } from 'angular-three-soba/loaders';
+import { injectTexture, textureResource } from 'angular-three-soba/loaders';
 
 const defaultOptions$e = {
     temporal: false,
@@ -95,7 +95,7 @@ class NgtsAccumulativeShadows {
                     clearTimeout(timeout);
             });
         });
-        injectBeforeRender(() => {
+        beforeRender(() => {
             const [frames, temporal, invalidate, limit] = [
                 this.frames(),
                 !!this.temporal(),
@@ -281,7 +281,7 @@ class NgtsBBAnchor {
                 bbAnchorParent['parent'].add(this.bbAnchorRef().nativeElement);
             }
         });
-        injectBeforeRender(() => {
+        beforeRender(() => {
             const parent = this.parent();
             if (parent) {
                 boundingBox.setFromObject(parent);
@@ -392,7 +392,7 @@ class NgtsBounds {
                     this.clip();
             }
         });
-        injectBeforeRender(({ delta }) => {
+        beforeRender(({ delta }) => {
             // This [additional animation step START] is needed to guarantee that delta used in animation isn't absurdly high (2-3 seconds) which is actually possible if rendering happens on demand...
             if (this.animationState === AnimationState.START) {
                 this.animationState = AnimationState.ACTIVE;
@@ -621,7 +621,7 @@ class NgtsCameraShake {
             callback();
             onCleanup(() => void defaultControls.removeEventListener('change', callback));
         });
-        injectBeforeRender(({ delta, clock }) => {
+        beforeRender(({ delta, clock }) => {
             const [{ maxYaw, yawFrequency, maxPitch, pitchFrequency, maxRoll, rollFrequency, decay, decayRate }, camera,] = [this.options(), this.store.snapshot.camera];
             const shake = Math.pow(this.intensity, 2);
             const yaw = maxYaw * shake * this.yawNoise.noise(clock.elapsedTime * yawFrequency, 1);
@@ -699,16 +699,16 @@ class NgtsCaustics {
             settings: NORMAL_OPTIONS,
         }));
         // Buffers for front and back faces
-        this.normalTarget = injectFBO(this.normalTargetParams);
-        this.normalTargetB = injectFBO(this.normalTargetParams);
+        this.normalTarget = fbo(this.normalTargetParams);
+        this.normalTargetB = fbo(this.normalTargetParams);
         this.causticsTargetParams = computed(() => ({
             width: this.resolution(),
             height: this.resolution(),
             settings: CAUSTIC_OPTIONS,
         }));
-        this.causticsTarget = injectFBO(this.causticsTargetParams);
-        this.causticsTargetB = injectFBO(this.causticsTargetParams);
-        this.cameraHelper = injectHelper(() => (this.debug() ? this.cameraRef().nativeElement : null), () => THREE.CameraHelper);
+        this.causticsTarget = fbo(this.causticsTargetParams);
+        this.causticsTargetB = fbo(this.causticsTargetParams);
+        this.cameraHelper = helper(() => (this.debug() ? this.cameraRef().nativeElement : null), () => THREE.CameraHelper);
         extend({
             CausticsProjectionMaterial,
             Group,
@@ -756,7 +756,7 @@ class NgtsCaustics {
                 helper: this.cameraHelper(),
             };
         });
-        injectBeforeRender(({ gl }) => update(gl));
+        beforeRender(({ gl }) => update(gl));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: NgtsCaustics, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: NgtsCaustics, isStandalone: true, selector: "ngts-caustics", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "groupRef", first: true, predicate: ["group"], descendants: true, isSignal: true }, { propertyName: "sceneRef", first: true, predicate: ["scene"], descendants: true, isSignal: true }, { propertyName: "cameraRef", first: true, predicate: ["camera"], descendants: true, isSignal: true }, { propertyName: "planeRef", first: true, predicate: ["plane"], descendants: true, isSignal: true }], ngImport: i0, template: `
@@ -1018,7 +1018,7 @@ class NgtsContactShadows {
         });
         extend({ Group, Mesh, MeshBasicMaterial, OrthographicCamera });
         let count = 0;
-        injectBeforeRender(() => {
+        beforeRender(() => {
             const shadowsCamera = this.shadowsCameraRef()?.nativeElement;
             if (!shadowsCamera)
                 return;
@@ -1154,8 +1154,8 @@ const ENVIRONMENT_PRESETS = {
 };
 const CUBEMAP_ROOT = 'https://raw.githack.com/pmndrs/drei-assets/456060a26bbeb8fdf79326f224b6d99b8bcce736/hdri/';
 const defaultFiles = ['/px.png', '/nx.png', '/py.png', '/ny.png', '/pz.png', '/nz.png'];
-function injectEnvironment(options = () => ({}), { injector } = {}) {
-    return assertInjector(injectEnvironment, injector, () => {
+function environmentResource(options = () => ({}), { injector } = {}) {
+    return assertInjector(environmentResource, injector, () => {
         const adjustedOptions = computed(() => {
             const { preset, extensions, colorSpace, ...rest } = options();
             let { files, path } = rest;
@@ -1185,10 +1185,10 @@ function injectEnvironment(options = () => ({}), { injector } = {}) {
                 return;
             store.gl().domElement.addEventListener('webglcontextlost', () => {
                 // @ts-expect-error - files is correctly passed
-                injectLoader.clear(multiFile ? [_files] : _files);
+                loaderResource.clear(multiFile ? [_files] : _files);
             }, { once: true });
         });
-        const result = injectLoader(loader, 
+        const resource = loaderResource(loader, 
         // @ts-expect-error - ensure the files is an array
         () => {
             const { files } = adjustedOptions();
@@ -1207,7 +1207,7 @@ function injectEnvironment(options = () => ({}), { injector } = {}) {
             },
         });
         effect(() => {
-            const loaderResult = result();
+            const loaderResult = resource.value();
             if (!loaderResult)
                 return;
             const { extension, isCubeMap } = untracked(resultOptions);
@@ -1230,13 +1230,12 @@ function injectEnvironment(options = () => ({}), { injector } = {}) {
             textureResult.colorSpace = colorSpace ?? (isCubeMap ? 'srgb' : 'srgb-linear');
             texture.set(textureResult);
         });
-        return texture.asReadonly();
+        return { texture: texture.asReadonly(), resource };
     });
 }
-injectEnvironment.preload = (options = () => ({})) => {
-    const _options = options();
-    let { files, path } = _options;
-    const { preset, extensions } = _options;
+environmentResource.preload = (options = {}) => {
+    let { files, path } = options;
+    const { preset, extensions } = options;
     if (files == null) {
         files = defaultFiles;
     }
@@ -1255,15 +1254,15 @@ injectEnvironment.preload = (options = () => ({})) => {
     const loader = getLoader(extension);
     if (!loader)
         throw new Error('injectEnvironment: Unrecognized file extension: ' + files);
-    injectLoader.preload(() => loader, 
+    loaderResource.preload(loader, 
     // @ts-expect-error - files is correctly passed
-    () => (Array.isArray(files) ? [files] : files), (loader) => {
+    Array.isArray(files) ? [files] : files, (loader) => {
         loader.setPath?.(path);
         if (extensions)
             extensions(loader);
     });
 };
-injectEnvironment.clear = (clearOptions) => {
+environmentResource.clear = (clearOptions) => {
     const options = { files: defaultFiles, ...clearOptions };
     let { files } = options;
     const preset = options.preset;
@@ -1271,7 +1270,7 @@ injectEnvironment.clear = (clearOptions) => {
         validatePreset(preset);
         files = ENVIRONMENT_PRESETS[preset];
     }
-    injectLoader.clear(files);
+    loaderResource.clear(files);
 };
 function validatePreset(preset) {
     if (!(preset in ENVIRONMENT_PRESETS))
@@ -1402,7 +1401,7 @@ class NgtsEnvironmentCube {
                 environmentRotation,
             };
         });
-        const _texture = injectEnvironment(this.options);
+        const { texture: _texture } = environmentResource(this.options);
         effect((onCleanup) => {
             const texture = _texture();
             if (!texture)
@@ -1471,7 +1470,7 @@ class NgtsEnvironmentPortal {
             onCleanup(() => cleanup?.());
         });
         let count = 1;
-        injectBeforeRender(() => {
+        beforeRender(() => {
             const frames = this.options().frames;
             if (frames === Infinity || (frames != null && count < frames)) {
                 const camera = this.cameraRef()?.nativeElement;
@@ -1566,11 +1565,11 @@ class NgtsEnvironmentGround {
     constructor() {
         this.options = input({});
         this.envSet = output();
-        this.defaultTexture = injectEnvironment(this.options);
+        this.defaultEnvironment = environmentResource(this.options);
         this.height = computed(() => this.options().ground?.height);
         this.radius = computed(() => this.options().ground?.radius);
         this.scale = computed(() => this.options().ground?.scale ?? 1000);
-        this.args = computed(() => [this.options().map || this.defaultTexture()]);
+        this.args = computed(() => [this.options().map || this.defaultEnvironment.texture()]);
         this.envMapOptions = computed(() => {
             const { map: _, ...options } = this.options();
             const [map] = this.args();
@@ -1578,7 +1577,7 @@ class NgtsEnvironmentGround {
         });
         extend({ GroundProjectedEnv });
         inject(DestroyRef).onDestroy(() => {
-            this.defaultTexture()?.dispose();
+            this.defaultEnvironment.texture()?.dispose();
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: NgtsEnvironmentGround, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
@@ -1646,6 +1645,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
                 }]
         }] });
 
+/**
+ * @deprecated use environmentResource instead. Will be removed in v5.0.0
+ * @since v4.0.0
+ */
+function injectEnvironment(options = () => ({}), { injector } = {}) {
+    return assertInjector(injectEnvironment, injector, () => {
+        const resource = environmentResource(options, { injector });
+        return resource.texture;
+    });
+}
+injectEnvironment.preload = (options = () => ({})) => {
+    environmentResource.preload(options());
+};
+injectEnvironment.clear = (clearOptions) => {
+    environmentResource.clear(clearOptions);
+};
+
 const defaultOptions$7 = {
     enabled: true,
     speed: 1,
@@ -1668,7 +1684,7 @@ class NgtsFloat {
         this.floatRef = viewChild.required('float');
         extend({ Group });
         const offset = Math.random() * 10000;
-        injectBeforeRender(({ clock, invalidate }) => {
+        beforeRender(({ clock, invalidate }) => {
             const [{ enabled, speed, rotationIntensity, floatingRange, floatIntensity, autoInvalidate }] = [
                 this.options(),
             ];
@@ -1890,6 +1906,10 @@ function getFormatString(format) {
 }
 const LIST_URL$1 = 'https://cdn.jsdelivr.net/gh/pmndrs/drei-assets@master/matcaps.json';
 const MATCAP_ROOT = 'https://rawcdn.githack.com/emmelleppi/matcaps/9b36ccaaf0a24881a39062d05566c9e92be4aa0d';
+/**
+ * @deprecated Use matcapTexture instead. Will be removed in v5.0.0
+ * @since v4.0.0
+ */
 function injectMatcapTexture(id = () => 0, { format = () => 1024, onLoad, injector, } = {}) {
     return assertInjector(injectMatcapTexture, injector, () => {
         const matcapList = signal({});
@@ -1916,20 +1936,46 @@ function injectMatcapTexture(id = () => 0, { format = () => 1024, onLoad, inject
         return { url, texture: matcapTexture, numTot };
     });
 }
+function matcapTextureResource(id = () => 0, { format = () => 1024, onLoad, injector, } = {}) {
+    return assertInjector(matcapTextureResource, injector, () => {
+        const matcapList = signal({});
+        fetch(LIST_URL$1)
+            .then((res) => res.json())
+            .then((list) => {
+            matcapList.set(list);
+        });
+        const DEFAULT_MATCAP = computed(() => matcapList()[0]);
+        const numTot = computed(() => Object.keys(matcapList()).length);
+        const fileHash = computed(() => {
+            const idValue = id();
+            if (typeof idValue === 'string') {
+                return idValue;
+            }
+            if (typeof idValue === 'number') {
+                return matcapList()[idValue];
+            }
+            return null;
+        });
+        const fileName = computed(() => `${fileHash() || DEFAULT_MATCAP()}${getFormatString(format())}.png`);
+        const url = computed(() => `${MATCAP_ROOT}/${format()}/${fileName()}`);
+        const resource = textureResource(url, { onLoad });
+        return { url, resource, numTot };
+    });
+}
 class NgtsMatcapTexture {
     constructor() {
         this.matcapTexture = input();
-        this.matcapTextureLoaded = output();
+        this.matcapTextureLoaded = input();
         this.template = inject(TemplateRef);
         this.vcr = inject(ViewContainerRef);
         this.id = computed(() => this.matcapTexture()?.id ?? 0);
         this.format = computed(() => this.matcapTexture()?.format ?? 1024);
-        const { texture } = injectMatcapTexture(this.id, {
+        const { resource } = matcapTextureResource(this.id, {
             format: this.format,
-            onLoad: this.matcapTextureLoaded.emit.bind(this.matcapTextureLoaded),
+            onLoad: this.matcapTextureLoaded(),
         });
         effect(() => {
-            this.ref = this.vcr.createEmbeddedView(this.template, { $implicit: texture });
+            this.ref = this.vcr.createEmbeddedView(this.template, { $implicit: resource });
             this.ref.detectChanges();
         });
         inject(DestroyRef).onDestroy(() => {
@@ -1940,7 +1986,7 @@ class NgtsMatcapTexture {
         return true;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: NgtsMatcapTexture, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.1", type: NgtsMatcapTexture, isStandalone: true, selector: "ng-template[matcapTexture]", inputs: { matcapTexture: { classPropertyName: "matcapTexture", publicName: "matcapTexture", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { matcapTextureLoaded: "matcapTextureLoaded" }, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.1", type: NgtsMatcapTexture, isStandalone: true, selector: "ng-template[matcapTexture]", inputs: { matcapTexture: { classPropertyName: "matcapTexture", publicName: "matcapTexture", isSignal: true, isRequired: false, transformFunction: null }, matcapTextureLoaded: { classPropertyName: "matcapTextureLoaded", publicName: "matcapTextureLoaded", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: NgtsMatcapTexture, decorators: [{
             type: Directive,
@@ -1949,6 +1995,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
 
 const NORMAL_ROOT = 'https://rawcdn.githack.com/pmndrs/drei-assets/7a3104997e1576f83472829815b00880d88b32fb';
 const LIST_URL = 'https://cdn.jsdelivr.net/gh/pmndrs/drei-assets@master/normals/normals.json';
+/**
+ * @deprecated Use normalTexture instead. Will be removed in v5.0.0
+ * @since v4.0.0
+ */
 function injectNormalTexture(id = () => 0, { settings = () => ({}), onLoad, injector, }) {
     return assertInjector(injectNormalTexture, injector, () => {
         const normalList = signal({});
@@ -1985,10 +2035,46 @@ function injectNormalTexture(id = () => 0, { settings = () => ({}), onLoad, inje
         return { url, texture: normalTexture, numTot };
     });
 }
+function normalTextureResource(id = () => 0, { settings = () => ({}), onLoad, injector, }) {
+    return assertInjector(normalTextureResource, injector, () => {
+        const normalList = signal({});
+        fetch(LIST_URL)
+            .then((res) => res.json())
+            .then((list) => {
+            normalList.set(list);
+        });
+        const DEFAULT_NORMAL = computed(() => normalList()[0]);
+        const numTot = computed(() => Object.keys(normalList()).length);
+        const fileHash = computed(() => {
+            const idValue = id();
+            if (typeof idValue === 'string') {
+                return idValue;
+            }
+            if (typeof idValue === 'number') {
+                return normalList()[idValue];
+            }
+            return null;
+        });
+        const imageName = computed(() => fileHash() || DEFAULT_NORMAL());
+        const url = computed(() => `${NORMAL_ROOT}/normals/${imageName()}`);
+        const resource = textureResource(url, { onLoad });
+        effect(() => {
+            if (!resource.hasValue())
+                return;
+            const texture = resource.value();
+            const { anisotropy = 1, repeat = [1, 1], offset = [0, 0] } = settings();
+            texture.wrapS = texture.wrapT = THREE.RepeatWrapping;
+            texture.repeat = new THREE.Vector2(repeat[0], repeat[1]);
+            texture.offset = new THREE.Vector2(offset[0], offset[1]);
+            texture.anisotropy = anisotropy;
+        });
+        return { url, resource, numTot };
+    });
+}
 class NgtsNormalTexture {
     constructor() {
         this.normalTexture = input();
-        this.normalTextureLoaded = output();
+        this.normalTextureLoaded = input();
         this.template = inject(TemplateRef);
         this.vcr = inject(ViewContainerRef);
         this.id = computed(() => this.normalTexture()?.id ?? 0);
@@ -1996,12 +2082,12 @@ class NgtsNormalTexture {
             const { id: _, ...settings } = this.normalTexture() || {};
             return settings;
         });
-        const { texture } = injectNormalTexture(this.id, {
+        const { resource } = normalTextureResource(this.id, {
             settings: this.settings,
-            onLoad: this.normalTextureLoaded.emit.bind(this.normalTextureLoaded),
+            onLoad: this.normalTextureLoaded(),
         });
         effect(() => {
-            this.ref = this.vcr.createEmbeddedView(this.template, { $implicit: texture });
+            this.ref = this.vcr.createEmbeddedView(this.template, { $implicit: resource });
             this.ref.detectChanges();
         });
         inject(DestroyRef).onDestroy(() => {
@@ -2012,7 +2098,7 @@ class NgtsNormalTexture {
         return true;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: NgtsNormalTexture, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.1", type: NgtsNormalTexture, isStandalone: true, selector: "ng-template[normalTexture]", inputs: { normalTexture: { classPropertyName: "normalTexture", publicName: "normalTexture", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { normalTextureLoaded: "normalTextureLoaded" }, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.1", type: NgtsNormalTexture, isStandalone: true, selector: "ng-template[normalTexture]", inputs: { normalTexture: { classPropertyName: "normalTexture", publicName: "normalTexture", isSignal: true, isRequired: false, transformFunction: null }, normalTextureLoaded: { classPropertyName: "normalTextureLoaded", publicName: "normalTextureLoaded", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: NgtsNormalTexture, decorators: [{
             type: Directive,
@@ -2222,7 +2308,7 @@ class NgtsRenderTextureImpl {
         }));
         this.renderPriority = pick(this.options, 'renderPriority');
         this.frames = pick(this.options, 'frames');
-        this.fbo = injectFBO(this.fboParams);
+        this.fbo = fbo(this.fboParams);
         this.virtualScene = (() => {
             const scene = new THREE.Scene();
             scene.name = `ngts-render-texture-virtual-scene-${incrementId++}`;
@@ -2406,6 +2492,7 @@ const defaultVolumetricMeshOptions = {
     attenuation: 5,
     anglePower: 5,
     color: 'white',
+    depthBuffer: null,
 };
 class NgtsVolumetricMesh {
     constructor() {
@@ -2435,7 +2522,7 @@ class NgtsVolumetricMesh {
         });
         extend({ Mesh });
         const vec = new THREE.Vector3();
-        injectBeforeRender(() => {
+        beforeRender(() => {
             const mesh = this.meshRef().nativeElement;
             const material = this.material;
             material.uniforms['spotPosition'].value.copy(mesh.getWorldPosition(vec));
@@ -2487,8 +2574,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
                     imports: [NgtArgs],
                 }]
         }], ctorParameters: () => [] });
-function injectSpotLightCommon(spotLight, mesh, width, height, distance, injector) {
-    assertInjector(injectSpotLightCommon, injector, () => {
+function spotLightCommon(spotLight, mesh, width, height, distance, injector) {
+    assertInjector(spotLightCommon, injector, () => {
         const pos = new THREE.Vector3();
         const dir = new THREE.Vector3();
         effect(() => {
@@ -2506,7 +2593,7 @@ function injectSpotLightCommon(spotLight, mesh, width, height, distance, injecto
                 throw new Error('NgtsSpotLightShadow must be a child of a NgtsSpotLight');
             }
         });
-        injectBeforeRender(() => {
+        beforeRender(() => {
             const [_spotLight, _mesh] = [spotLight()?.nativeElement, mesh()?.nativeElement];
             if (!_spotLight || !_mesh)
                 return;
@@ -2573,7 +2660,7 @@ class NgtsSpotLightShadowShader {
             uTime: { value: 0 },
         };
         extend({ Mesh, PlaneGeometry, MeshBasicMaterial });
-        injectSpotLightCommon(this.spotLight.spotLightRef, this.meshRef, this.width, this.height, this.distance);
+        spotLightCommon(this.spotLight.spotLightRef, this.meshRef, this.width, this.height, this.distance);
         effect(() => {
             this.uniforms.uShadowMap.value = this.map();
         });
@@ -2590,7 +2677,7 @@ class NgtsSpotLightShadowShader {
                 renderTarget.dispose();
             });
         });
-        injectBeforeRender(({ gl, delta }) => {
+        beforeRender(({ gl, delta }) => {
             this.uniforms.uTime.value += delta;
             gl.setRenderTarget(this.renderTarget());
             this.fsQuad().render(gl);
@@ -2655,7 +2742,7 @@ class NgtsSpotLightShadowNoShader {
         this.height = pick(this.options, 'height');
         this.distance = pick(this.options, 'distance');
         extend({ Mesh, PlaneGeometry, MeshBasicMaterial });
-        injectSpotLightCommon(this.spotLight.spotLightRef, this.meshRef, this.width, this.height, this.distance);
+        spotLightCommon(this.spotLight.spotLightRef, this.meshRef, this.width, this.height, this.distance);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: NgtsSpotLightShadowNoShader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.1", type: NgtsSpotLightShadowNoShader, isStandalone: true, selector: "ngts-spot-light-shadow-no-shader", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "meshRef", first: true, predicate: ["mesh"], descendants: true, isSignal: true }], ngImport: i0, template: `
@@ -2733,6 +2820,7 @@ const defaultOptions$1 = {
     anglePower: 5,
     volumetric: true,
     debug: false,
+    depthBuffer: null,
 };
 class NgtsSpotLight {
     constructor() {
@@ -3051,5 +3139,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { ENVIRONMENT_PRESETS, NgtsAccumulativeShadows, NgtsBBAnchor, NgtsBackdrop, NgtsBounds, NgtsCameraShake, NgtsCaustics, NgtsCenter, NgtsContactShadows, NgtsEnvironment, NgtsEnvironmentCube, NgtsEnvironmentGround, NgtsEnvironmentMap, NgtsEnvironmentPortal, NgtsFloat, NgtsLightformer, NgtsMask, NgtsMatcapTexture, NgtsNormalTexture, NgtsRandomizedLights, NgtsRenderTexture, NgtsRenderTextureContainer, NgtsRenderTextureContent, NgtsRenderTextureImpl, NgtsSky, NgtsSpotLight, NgtsSpotLightShadow, NgtsStage, NgtsStageRefit, calcPosFromAngles, injectEnvironment, injectMatcapTexture, injectNormalTexture, mask };
+export { ENVIRONMENT_PRESETS, NgtsAccumulativeShadows, NgtsBBAnchor, NgtsBackdrop, NgtsBounds, NgtsCameraShake, NgtsCaustics, NgtsCenter, NgtsContactShadows, NgtsEnvironment, NgtsEnvironmentCube, NgtsEnvironmentGround, NgtsEnvironmentMap, NgtsEnvironmentPortal, NgtsFloat, NgtsLightformer, NgtsMask, NgtsMatcapTexture, NgtsNormalTexture, NgtsRandomizedLights, NgtsRenderTexture, NgtsRenderTextureContainer, NgtsRenderTextureContent, NgtsRenderTextureImpl, NgtsSky, NgtsSpotLight, NgtsSpotLightShadow, NgtsStage, NgtsStageRefit, calcPosFromAngles, environmentResource, injectEnvironment, injectMatcapTexture, injectNormalTexture, mask, matcapTextureResource, normalTextureResource };
 //# sourceMappingURL=angular-three-soba-staging.mjs.map