angular-three-soba 1.0.2 → 1.2.0

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

@@ -0,0 +1,2654 @@
+import * as i0 from '@angular/core';
+import { InjectionToken, inject, Directive, Component, CUSTOM_ELEMENTS_SCHEMA, Input, EventEmitter, Output, TemplateRef, ContentChild, ChangeDetectorRef } from '@angular/core';
+import { extend, NgtStore, getLocalState, injectBeforeRender, NgtRxStore, injectNgtRef, is, NgtPush, NgtArgs, injectNgtDestroy, injectNgtLoader, startWithUndefined, prepare, NgtPortal, NgtPortalContent } from 'angular-three';
+import { shaderMaterial } from 'angular-three-soba/shaders';
+import { combineLatest, switchMap, isObservable, of, debounceTime, map, takeUntil, startWith, withLatestFrom } from 'rxjs';
+import * as THREE from 'three';
+import { Group, Mesh, PlaneGeometry, DirectionalLight, OrthographicCamera, Vector2, Box3, Vector3, Sphere, MeshBasicMaterial, CubeTextureLoader, CubeReflectionMapping, EquirectangularReflectionMapping, sRGBEncoding, LinearEncoding, CubeCamera, HalfFloatType, Points, BufferGeometry, BufferAttribute, Vector4, Color, MathUtils, AmbientLight, SpotLight, PointLight, Spherical, AdditiveBlending } from 'three';
+import { NgIf, NgTemplateOutlet } from '@angular/common';
+import { HorizontalBlurShader, VerticalBlurShader, RGBELoader, GroundProjectedEnv, Sky } from 'three-stdlib';
+
+function isLight(object) {
+    return object.isLight;
+}
+function isGeometry(object) {
+    return !!object.geometry;
+}
+const DiscardMaterial = shaderMaterial({}, 'void main() { gl_Position = vec4((uv - 0.5) * 2.0, 1.0, 1.0); }', 'void main() { discard; }');
+class ProgressiveLightMap {
+    constructor(renderer, scene, res = 1024) {
+        this.renderer = renderer;
+        this.res = res;
+        this.scene = scene;
+        this.buffer1Active = false;
+        this.lights = [];
+        this.meshes = [];
+        this.object = null;
+        this.clearColor = new THREE.Color();
+        this.clearAlpha = 0;
+        // Create the Progressive LightMap Texture
+        const format = /(Android|iPad|iPhone|iPod)/g.test(navigator.userAgent) ? THREE.HalfFloatType : THREE.FloatType;
+        this.progressiveLightMap1 = new THREE.WebGLRenderTarget(this.res, this.res, {
+            type: format,
+            encoding: renderer.outputEncoding,
+        });
+        this.progressiveLightMap2 = new THREE.WebGLRenderTarget(this.res, this.res, {
+            type: format,
+            encoding: renderer.outputEncoding,
+        });
+        // Inject some spicy new logic into a standard phong material
+        this.discardMat = new DiscardMaterial();
+        this.targetMat = new THREE.MeshLambertMaterial({ fog: false });
+        this.previousShadowMap = { value: this.progressiveLightMap1.texture };
+        this.averagingWindow = { value: 100 };
+        this.targetMat.onBeforeCompile = (shader) => {
+            // Vertex Shader: Set Vertex Positions to the Unwrapped UV Positions
+            shader.vertexShader =
+                'varying vec2 vUv;\n' +
+                    shader.vertexShader.slice(0, -1) +
+                    'vUv = uv; gl_Position = vec4((uv - 0.5) * 2.0, 1.0, 1.0); }';
+            // Fragment Shader: Set Pixels to average in the Previous frame's Shadows
+            const bodyStart = shader.fragmentShader.indexOf('void main() {');
+            shader.fragmentShader =
+                'varying vec2 vUv;\n' +
+                    shader.fragmentShader.slice(0, bodyStart) +
+                    'uniform sampler2D previousShadowMap;\n	uniform float averagingWindow;\n' +
+                    shader.fragmentShader.slice(bodyStart - 1, -1) +
+                    `\nvec3 texelOld = texture2D(previousShadowMap, vUv).rgb;
+        gl_FragColor.rgb = mix(texelOld, gl_FragColor.rgb, 1.0/ averagingWindow);
+      }`;
+            // Set the Previous Frame's Texture Buffer and Averaging Window
+            shader.uniforms['previousShadowMap'] = this.previousShadowMap;
+            shader.uniforms['averagingWindow'] = this.averagingWindow;
+        };
+    }
+    clear() {
+        this.renderer.getClearColor(this.clearColor);
+        this.clearAlpha = this.renderer.getClearAlpha();
+        this.renderer.setClearColor('black', 1);
+        this.renderer.setRenderTarget(this.progressiveLightMap1);
+        this.renderer.clear();
+        this.renderer.setRenderTarget(this.progressiveLightMap2);
+        this.renderer.clear();
+        this.renderer.setRenderTarget(null);
+        this.renderer.setClearColor(this.clearColor, this.clearAlpha);
+        this.lights = [];
+        this.meshes = [];
+        this.scene.traverse((object) => {
+            if (isGeometry(object)) {
+                this.meshes.push({ object, material: object.material });
+            }
+            else if (isLight(object)) {
+                this.lights.push({ object, intensity: object.intensity });
+            }
+        });
+    }
+    prepare() {
+        this.lights.forEach((light) => (light.object.intensity = 0));
+        this.meshes.forEach((mesh) => (mesh.object.material = this.discardMat));
+    }
+    finish() {
+        this.lights.forEach((light) => (light.object.intensity = light.intensity));
+        this.meshes.forEach((mesh) => (mesh.object.material = mesh.material));
+    }
+    configure(object) {
+        this.object = object;
+    }
+    update(camera, blendWindow = 100) {
+        if (!this.object)
+            return;
+        // Set each object's material to the UV Unwrapped Surface Mapping Version
+        this.averagingWindow.value = blendWindow;
+        this.object.material = this.targetMat;
+        // Ping-pong two surface buffers for reading/writing
+        const activeMap = this.buffer1Active ? this.progressiveLightMap1 : this.progressiveLightMap2;
+        const inactiveMap = this.buffer1Active ? this.progressiveLightMap2 : this.progressiveLightMap1;
+        // Render the object's surface maps
+        const oldBg = this.scene.background;
+        this.scene.background = null;
+        this.renderer.setRenderTarget(activeMap);
+        this.previousShadowMap.value = inactiveMap.texture;
+        this.buffer1Active = !this.buffer1Active;
+        this.renderer.render(this.scene, camera);
+        this.renderer.setRenderTarget(null);
+        this.scene.background = oldBg;
+    }
+}
+
+const SoftShadowMaterial = shaderMaterial({
+    color: new THREE.Color(),
+    blend: 2.0,
+    alphaTest: 0.75,
+    opacity: 0,
+    map: null,
+}, 
+// language=GLSL
+`
+varying vec2 vUv;
+void main() {
+  gl_Position = projectionMatrix * viewMatrix * modeLMatrix * vec4(position, 1.);
+  vUv = uv;
+}
+  `, 
+// language=GLSL
+`
+varying vec2 vUv;
+uniform sampler2D map;
+uniform vec3 color;
+uniform float blend;
+uniform float opacity;
+uniform float alphaTest;
+void main() {
+  vec4 sampleDiffuseColor = texture2D(map, vUv):
+  gl_FragColor = vec4(color * sampledDiffuseColor.r * blend, max(0.0, (1.0 - (sampledDiffuseColor.r + sampledDiffuseColor.g + sampledDiffuseColor.b) / alphaTest)) * opacity);
+  #include <tonemapping_fragment>
+  #include <encodings_fragment>
+}
+  `);
+extend({ SoftShadowMaterial, Group, Mesh, PlaneGeometry });
+const NGTS_ACCUMULATIVE_SHADOWS_API = new InjectionToken('NgtsAccumulativeShadows API');
+function accumulativeShadowsApiFactory(accumulativeShadows) {
+    const store = inject(NgtStore);
+    const api = {
+        lights: new Map(),
+        count: 0,
+        getMesh: () => accumulativeShadows.meshRef.nativeElement,
+        reset: () => {
+            accumulativeShadows.pLM.clear();
+            const material = api.getMesh().material;
+            material.opacity = 0;
+            material.alphaTest = 0;
+            api.count = 0;
+        },
+        update: (frames = 1) => {
+            // adapt the opacity blend ratio to the number of frames
+            const material = api.getMesh().material;
+            if (!api.temporal) {
+                material.opacity = accumulativeShadows.get('opacity');
+                material.alphaTest = accumulativeShadows.get('alphaTest');
+            }
+            else {
+                material.opacity = Math.min(accumulativeShadows.get('opacity'), material.opacity + accumulativeShadows.get('opacity') / api.blend);
+                material.alphaTest = Math.min(accumulativeShadows.get('alphaTest'), material.alphaTest + accumulativeShadows.get('alphaTest') / api.blend);
+            }
+            // switch accumulative lights on
+            accumulativeShadows.accumulativeShadowsRef.nativeElement.visible = true;
+            // collect scene lights and meshes
+            accumulativeShadows.pLM.prepare();
+            // update the lightmap and the accumulative lights
+            for (let i = 0; i < frames; i++) {
+                api.lights.forEach((light) => light.update());
+                accumulativeShadows.pLM.update(store.get('camera'), api.blend);
+            }
+            // switch lights off
+            accumulativeShadows.accumulativeShadowsRef.nativeElement.visible = false;
+            // restore lights and meshes
+            accumulativeShadows.pLM.finish();
+        },
+    };
+    Object.defineProperties(api, {
+        temporal: {
+            get: () => !!accumulativeShadows.get('temporal'),
+        },
+        frames: {
+            get: () => Math.max(2, accumulativeShadows.get('frames')),
+        },
+        blend: {
+            get: () => Math.max(2, accumulativeShadows.get('frames') === Infinity
+                ? accumulativeShadows.get('blend')
+                : accumulativeShadows.get('frames')),
+        },
+    });
+    accumulativeShadows.hold(accumulativeShadows.meshRef.$, (mesh) => {
+        accumulativeShadows.pLM.configure(mesh);
+        accumulativeShadows.hold(combineLatest([accumulativeShadows.select(), getLocalState(store.get('scene')).objects]), () => {
+            // reset internals, buffers, ...
+            api.reset();
+            // update lightmap
+            if (!api.temporal && api.frames !== Infinity)
+                api.update(api.blend);
+        });
+    });
+    injectBeforeRender(() => {
+        const limit = accumulativeShadows.get('limit');
+        if (api.getMesh() && (api.temporal || api.frames === Infinity) && api.count < api.frames && api.count < limit) {
+            api.update();
+            api.count++;
+        }
+    });
+    return api;
+}
+class AccumulativeShadowsConsumer {
+    constructor() {
+        inject(NGTS_ACCUMULATIVE_SHADOWS_API);
+    }
+}
+AccumulativeShadowsConsumer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: AccumulativeShadowsConsumer, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+AccumulativeShadowsConsumer.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.3", type: AccumulativeShadowsConsumer, isStandalone: true, selector: "ngts-accumulative-shadows-consumer", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: AccumulativeShadowsConsumer, decorators: [{
+            type: Directive,
+            args: [{ selector: 'ngts-accumulative-shadows-consumer', standalone: true }]
+        }], ctorParameters: function () { return []; } });
+class NgtsAccumulativeShadows extends NgtRxStore {
+    constructor() {
+        super(...arguments);
+        this.nullTraverse = () => null;
+        this.Math = Math;
+        this.store = inject(NgtStore);
+        this.pLM = new ProgressiveLightMap(this.store.get('gl'), this.store.get('scene'), this.get('resolution'));
+        this.accumulativeShadowsRef = injectNgtRef();
+        this.meshRef = injectNgtRef();
+    }
+    /** How many frames it can render, more yields cleaner results but takes more time, 40 */
+    set frames(frames) {
+        this.set({ frames });
+    }
+    /** If frames === Infinity blend controls the refresh ratio, 100 */
+    set blend(blend) {
+        this.set({ blend });
+    }
+    /** Can limit the amount of frames rendered if frames === Infinity, usually to get some performance back once a movable scene has settled, Infinity */
+    set limit(limit) {
+        this.set({ limit });
+    }
+    /** Scale of the plane,  */
+    set scale(scale) {
+        this.set({ scale });
+    }
+    /** Temporal accumulates shadows over time which is more performant but has a visual regression over instant results, false  */
+    set temporal(temporal) {
+        this.set({ temporal });
+    }
+    /** Opacity of the plane, 1 */
+    set opacity(opacity) {
+        this.set({ opacity });
+    }
+    /** Discards alpha pixels, 0.65 */
+    set alphaTest(alphaTest) {
+        this.set({ alphaTest });
+    }
+    /** Shadow color, black */
+    set color(color) {
+        this.set({ color });
+    }
+    /** Colorblend, how much colors turn to black, 0 is black, 2 */
+    set colorBlend(colorBlend) {
+        this.set({ colorBlend });
+    }
+    /** Buffer resolution, 1024 */
+    set resolution(resolution) {
+        this.set({ resolution });
+    }
+    /** Texture tonemapping */
+    set toneMapped(toneMapped) {
+        this.set({ toneMapped });
+    }
+    initialize() {
+        super.initialize();
+        this.set({
+            frames: 40,
+            limit: Infinity,
+            blend: 20,
+            scale: 10,
+            opacity: 1,
+            alphaTest: 0.75,
+            color: 'black',
+            colorBlend: 2,
+            resolution: 1024,
+            toneMapped: true,
+        });
+    }
+}
+NgtsAccumulativeShadows.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsAccumulativeShadows, deps: null, target: i0.ɵɵFactoryTarget.Component });
+NgtsAccumulativeShadows.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: NgtsAccumulativeShadows, isStandalone: true, selector: "ngts-accumulative-shadows", inputs: { frames: "frames", blend: "blend", limit: "limit", scale: "scale", temporal: "temporal", opacity: "opacity", alphaTest: "alphaTest", color: "color", colorBlend: "colorBlend", resolution: "resolution", toneMapped: "toneMapped" }, providers: [
+        {
+            provide: NGTS_ACCUMULATIVE_SHADOWS_API,
+            useFactory: accumulativeShadowsApiFactory,
+            deps: [NgtsAccumulativeShadows],
+        },
+    ], usesInheritance: true, ngImport: i0, template: `
+        <ngt-group ngtCompound>
+            <ngt-group [ref]="accumulativeShadowsRef" [traverse]="nullTraverse">
+                <ng-content />
+                <ngts-accumulative-shadows-consumer />
+            </ngt-group>
+            <ngt-mesh [receiveShadow]="true" [ref]="meshRef" [scale]="get('scale')" [rotation]="[-Math.PI / 2, 0, 0]">
+                <ngt-plane-geometry />
+                <ngt-soft-shadow-material
+                    [transparent]="true"
+                    [depthWrite]="false"
+                    [color]="get('color')"
+                    [toneMapped]="get('toneMapped')"
+                    [blend]="get('colorBlend')"
+                    [map]="pLM.progressiveLightMap2.texture"
+                />
+            </ngt-mesh>
+        </ngt-group>
+    `, isInline: true, dependencies: [{ kind: "directive", type: AccumulativeShadowsConsumer, selector: "ngts-accumulative-shadows-consumer" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsAccumulativeShadows, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngts-accumulative-shadows',
+                    standalone: true,
+                    template: `
+        <ngt-group ngtCompound>
+            <ngt-group [ref]="accumulativeShadowsRef" [traverse]="nullTraverse">
+                <ng-content />
+                <ngts-accumulative-shadows-consumer />
+            </ngt-group>
+            <ngt-mesh [receiveShadow]="true" [ref]="meshRef" [scale]="get('scale')" [rotation]="[-Math.PI / 2, 0, 0]">
+                <ngt-plane-geometry />
+                <ngt-soft-shadow-material
+                    [transparent]="true"
+                    [depthWrite]="false"
+                    [color]="get('color')"
+                    [toneMapped]="get('toneMapped')"
+                    [blend]="get('colorBlend')"
+                    [map]="pLM.progressiveLightMap2.texture"
+                />
+            </ngt-mesh>
+        </ngt-group>
+    `,
+                    imports: [AccumulativeShadowsConsumer],
+                    providers: [
+                        {
+                            provide: NGTS_ACCUMULATIVE_SHADOWS_API,
+                            useFactory: accumulativeShadowsApiFactory,
+                            deps: [NgtsAccumulativeShadows],
+                        },
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], propDecorators: { frames: [{
+                type: Input
+            }], blend: [{
+                type: Input
+            }], limit: [{
+                type: Input
+            }], scale: [{
+                type: Input
+            }], temporal: [{
+                type: Input
+            }], opacity: [{
+                type: Input
+            }], alphaTest: [{
+                type: Input
+            }], color: [{
+                type: Input
+            }], colorBlend: [{
+                type: Input
+            }], resolution: [{
+                type: Input
+            }], toneMapped: [{
+                type: Input
+            }] } });
+
+extend({ Group, DirectionalLight, OrthographicCamera, Vector2 });
+const NGTS_RANDOMIZED_LIGHTS_API = new InjectionToken('NgtsRandomizedLights API');
+function randomizedLightsApiFactory(randomizedLights) {
+    const accumulativeApi = inject(NGTS_ACCUMULATIVE_SHADOWS_API);
+    const update = () => {
+        let light;
+        if (randomizedLights.lightsRef.nativeElement) {
+            for (let l = 0; l < randomizedLights.lightsRef.nativeElement.children.length; l++) {
+                light = randomizedLights.lightsRef.nativeElement.children[l];
+                if (Math.random() > randomizedLights.get('ambient')) {
+                    const position = randomizedLights.get('position');
+                    const radius = randomizedLights.get('radius');
+                    light.position.set(position[0] + THREE.MathUtils.randFloatSpread(radius), position[1] + THREE.MathUtils.randFloatSpread(radius), position[2] + THREE.MathUtils.randFloatSpread(radius));
+                }
+                else {
+                    const lambda = Math.acos(2 * Math.random() - 1) - Math.PI / 2.0;
+                    const phi = 2 * Math.PI * Math.random();
+                    const length = randomizedLights.get('length');
+                    light.position.set(Math.cos(lambda) * Math.cos(phi) * length, Math.abs(Math.cos(lambda) * Math.sin(phi) * length), Math.sin(lambda) * length);
+                }
+            }
+        }
+    };
+    const api = { update };
+    randomizedLights.effect(combineLatest([
+        randomizedLights.lightsRef.$,
+        randomizedLights.select('position'),
+        randomizedLights.select('radius'),
+        randomizedLights.select('length'),
+        randomizedLights.select('ambient'),
+    ]), ([group]) => {
+        if (accumulativeApi)
+            accumulativeApi.lights.set(group.uuid, api);
+        return () => accumulativeApi.lights.delete(group.uuid);
+    });
+    return api;
+}
+class RandomizedLightsConsumer {
+    constructor() {
+        inject(NGTS_RANDOMIZED_LIGHTS_API);
+    }
+}
+RandomizedLightsConsumer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: RandomizedLightsConsumer, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+RandomizedLightsConsumer.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.3", type: RandomizedLightsConsumer, isStandalone: true, selector: "ngts-randomized-lights-consumer", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: RandomizedLightsConsumer, decorators: [{
+            type: Directive,
+            args: [{ selector: 'ngts-randomized-lights-consumer', standalone: true }]
+        }], ctorParameters: function () { return []; } });
+class NgtsRandomizedLights extends NgtRxStore {
+    constructor() {
+        super(...arguments);
+        this.lightsRef = injectNgtRef();
+    }
+    /** How many frames it will jiggle the lights, 1.
+     *  Frames is context aware, if a provider like AccumulativeShadows exists, frames will be taken from there!  */
+    set frames(frames) {
+        this.set({ frames });
+    }
+    /** Light position, [0, 0, 0] */
+    set position(position) {
+        this.set({ position });
+    }
+    /** Radius of the jiggle, higher values make softer light, 5 */
+    set radius(radius) {
+        this.set({ radius });
+    }
+    /** Amount of lights, 8 */
+    set amount(amount) {
+        this.set({ amount });
+    }
+    /** Light intensity, 1 */
+    set intensity(intensity) {
+        this.set({ intensity });
+    }
+    /** Ambient occlusion, lower values mean less AO, hight more, you can mix AO and directional light, 0.5 */
+    set ambient(ambient) {
+        this.set({ ambient });
+    }
+    /** If the lights cast shadows, this is true by default */
+    set castShadow(castShadow) {
+        this.set({ castShadow });
+    }
+    /** Default shadow bias, 0 */
+    set bias(bias) {
+        this.set({ bias });
+    }
+    /** Default map size, 512 */
+    set mapSize(mapSize) {
+        this.set({ mapSize });
+    }
+    /** Default size of the shadow camera, 10 */
+    set size(size) {
+        this.set({ size });
+    }
+    /** Default shadow camera near, 0.5 */
+    set near(near) {
+        this.set({ near });
+    }
+    /** Default shadow camera far, 500 */
+    set far(far) {
+        this.set({ far });
+    }
+    initialize() {
+        super.initialize();
+        this.set({
+            castShadow: true,
+            bias: 0.001,
+            mapSize: 512,
+            size: 5,
+            near: 0.5,
+            far: 500,
+            frames: 1,
+            position: [0, 0, 0],
+            radius: 1,
+            amount: 8,
+            intensity: 1,
+            ambient: 0.5,
+        });
+        this.connect('cameraArgs', this.select(['size', 'near', 'far'], ({ size, near, far }) => [-size, size, size, -size, near, far]));
+        this.connect('length', this.select(['position'], ({ position }) => new THREE.Vector3(...position).length()));
+    }
+}
+NgtsRandomizedLights.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsRandomizedLights, deps: null, target: i0.ɵɵFactoryTarget.Component });
+NgtsRandomizedLights.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: NgtsRandomizedLights, isStandalone: true, selector: "ngts-randomized-lights", inputs: { lightsRef: "lightsRef", frames: "frames", position: "position", radius: "radius", amount: "amount", intensity: "intensity", ambient: "ambient", castShadow: "castShadow", bias: "bias", mapSize: "mapSize", size: "size", near: "near", far: "far" }, providers: [
+        { provide: NGTS_RANDOMIZED_LIGHTS_API, useFactory: randomizedLightsApiFactory, deps: [NgtsRandomizedLights] },
+    ], usesInheritance: true, ngImport: i0, template: `
+        <ngt-group ngtCompound [ref]="lightsRef">
+            <ngt-directional-light
+                *ngFor="let i; repeat: get('amount')"
+                [castShadow]="get('castShadow')"
+                [intensity]="get('intensity') / get('amount')"
+            >
+                <ngt-value [rawValue]="get('bias')" attach="shadow.bias" />
+                <ngt-vector2 *args="[get('mapSize'), get('mapSize')]" attach="shadow.mapSize" />
+                <ngt-orthographic-camera *args="get('cameraArgs')" attach="shadow.camera" />
+            </ngt-directional-light>
+        </ngt-group>
+    `, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsRandomizedLights, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngts-randomized-lights',
+                    standalone: true,
+                    template: `
+        <ngt-group ngtCompound [ref]="lightsRef">
+            <ngt-directional-light
+                *ngFor="let i; repeat: get('amount')"
+                [castShadow]="get('castShadow')"
+                [intensity]="get('intensity') / get('amount')"
+            >
+                <ngt-value [rawValue]="get('bias')" attach="shadow.bias" />
+                <ngt-vector2 *args="[get('mapSize'), get('mapSize')]" attach="shadow.mapSize" />
+                <ngt-orthographic-camera *args="get('cameraArgs')" attach="shadow.camera" />
+            </ngt-directional-light>
+        </ngt-group>
+    `,
+                    providers: [
+                        { provide: NGTS_RANDOMIZED_LIGHTS_API, useFactory: randomizedLightsApiFactory, deps: [NgtsRandomizedLights] },
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], propDecorators: { lightsRef: [{
+                type: Input
+            }], frames: [{
+                type: Input
+            }], position: [{
+                type: Input
+            }], radius: [{
+                type: Input
+            }], amount: [{
+                type: Input
+            }], intensity: [{
+                type: Input
+            }], ambient: [{
+                type: Input
+            }], castShadow: [{
+                type: Input
+            }], bias: [{
+                type: Input
+            }], mapSize: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], near: [{
+                type: Input
+            }], far: [{
+                type: Input
+            }] } });
+
+const isBox3 = (def) => !!def && def.isBox3;
+function equals(a, b, eps) {
+    return Math.abs(a.x - b.x) < eps && Math.abs(a.y - b.y) < eps && Math.abs(a.z - b.z) < eps;
+}
+function damp(v, t, lambda, delta) {
+    v.x = THREE.MathUtils.damp(v.x, t.x, lambda, delta);
+    v.y = THREE.MathUtils.damp(v.y, t.y, lambda, delta);
+    v.z = THREE.MathUtils.damp(v.z, t.z, lambda, delta);
+}
+const NGTS_BOUNDS_API = new InjectionToken('NgtsBounds API');
+function boundsApiFactory(bounds) {
+    const store = inject(NgtStore);
+    const box = new THREE.Box3();
+    function getSize() {
+        const camera = store.get('camera');
+        const margin = bounds.get('margin');
+        const size = box.getSize(new THREE.Vector3());
+        const center = box.getCenter(new THREE.Vector3());
+        const maxSize = Math.max(size.x, size.y, size.z);
+        const fitHeightDistance = is.orthographicCamera(camera)
+            ? maxSize * 4
+            : maxSize / (2 * Math.atan((Math.PI * camera.fov) / 360));
+        const fitWidthDistance = is.orthographicCamera(camera) ? maxSize * 4 : fitHeightDistance / camera.aspect;
+        const distance = margin * Math.max(fitHeightDistance, fitWidthDistance);
+        return { box, size, center, distance };
+    }
+    const api = {
+        getSize,
+        refresh(object) {
+            const { camera, controls: storeControls } = store.get();
+            const controls = storeControls;
+            if (isBox3(object))
+                box.copy(object);
+            else {
+                const target = object || bounds.boundsRef.nativeElement;
+                if (target) {
+                    target.updateWorldMatrix(true, true);
+                    box.setFromObject(target);
+                }
+            }
+            if (box.isEmpty()) {
+                const max = camera.position.length() || 10;
+                box.setFromCenterAndSize(new THREE.Vector3(), new THREE.Vector3(max, max, max));
+            }
+            if (controls?.constructor.name === 'OrthographicTrackballControls') {
+                // put camera on a sphere along which it would move
+                const { distance } = getSize();
+                const direction = camera.position.clone().sub(controls.target).normalize().multiplyScalar(distance);
+                const newPos = controls.target.clone().add(direction);
+                camera.position.copy(newPos);
+            }
+            return this;
+        },
+        clip() {
+            const { distance } = getSize();
+            const { camera, controls: storeControls, invalidate } = store.get();
+            const controls = storeControls;
+            if (controls)
+                controls.maxDistance = distance * 10;
+            camera.near = distance / 100;
+            camera.far = distance * 100;
+            camera.updateProjectionMatrix();
+            if (controls)
+                controls.update();
+            invalidate();
+            return this;
+        },
+        to({ position, target }) {
+            const { camera } = store.get();
+            const { damping } = bounds.get();
+            bounds.current.camera.copy(camera.position);
+            const { center } = getSize();
+            bounds.goal.camera.set(...position);
+            if (target) {
+                bounds.goal.focus.set(...target);
+            }
+            else {
+                bounds.goal.focus.copy(center);
+            }
+            if (damping) {
+                bounds.current.animating = true;
+            }
+            else {
+                camera.position.set(...position);
+            }
+            return this;
+        },
+        fit() {
+            const { camera, controls: storeControls, invalidate } = store.get();
+            const controls = storeControls;
+            const { damping, margin } = bounds.get();
+            bounds.current.camera.copy(camera.position);
+            if (controls)
+                bounds.current.focus.copy(controls.target);
+            const { center, distance } = getSize();
+            const direction = center.clone().sub(camera.position).normalize().multiplyScalar(distance);
+            bounds.goal.camera.copy(center).sub(direction);
+            bounds.goal.focus.copy(center);
+            if (is.orthographicCamera(camera)) {
+                bounds.current.zoom = camera.zoom;
+                let maxHeight = 0, maxWidth = 0;
+                const vertices = [
+                    new THREE.Vector3(box.min.x, box.min.y, box.min.z),
+                    new THREE.Vector3(box.min.x, box.max.y, box.min.z),
+                    new THREE.Vector3(box.min.x, box.min.y, box.max.z),
+                    new THREE.Vector3(box.min.x, box.max.y, box.max.z),
+                    new THREE.Vector3(box.max.x, box.max.y, box.max.z),
+                    new THREE.Vector3(box.max.x, box.max.y, box.min.z),
+                    new THREE.Vector3(box.max.x, box.min.y, box.max.z),
+                    new THREE.Vector3(box.max.x, box.min.y, box.min.z),
+                ];
+                // Transform the center and each corner to camera space
+                center.applyMatrix4(camera.matrixWorldInverse);
+                for (const v of vertices) {
+                    v.applyMatrix4(camera.matrixWorldInverse);
+                    maxHeight = Math.max(maxHeight, Math.abs(v.y - center.y));
+                    maxWidth = Math.max(maxWidth, Math.abs(v.x - center.x));
+                }
+                maxHeight *= 2;
+                maxWidth *= 2;
+                const zoomForHeight = (camera.top - camera.bottom) / maxHeight;
+                const zoomForWidth = (camera.right - camera.left) / maxWidth;
+                bounds.goal.zoom = Math.min(zoomForHeight, zoomForWidth) / margin;
+                if (!damping) {
+                    camera.zoom = bounds.goal.zoom;
+                    camera.updateProjectionMatrix();
+                }
+            }
+            if (damping) {
+                bounds.current.animating = true;
+            }
+            else {
+                camera.position.copy(bounds.goal.camera);
+                camera.lookAt(bounds.goal.focus);
+                if (controls) {
+                    controls.target.copy(bounds.goal.focus);
+                    controls.update();
+                }
+            }
+            if (bounds.fitted.observed)
+                bounds.fitted.emit(this.getSize());
+            invalidate();
+            return this;
+        },
+    };
+    let count = 0;
+    bounds.hold(bounds.boundsRef.$.pipe(switchMap(() => combineLatest([
+        bounds.select('clip'),
+        bounds.select('fit'),
+        bounds.select('observe'),
+        store.select('camera'),
+        store.select('controls'),
+        store.select('size'),
+        bounds.boundsRef.children$(),
+    ]))), ([clip, fit, observe]) => {
+        if (observe || count++ === 0) {
+            api.refresh();
+            if (fit)
+                api.fit();
+            if (clip)
+                api.clip();
+        }
+    });
+    injectBeforeRender(({ delta }) => {
+        if (bounds.current.animating) {
+            const { damping, eps } = bounds.get();
+            const { camera, controls: storeControls, invalidate } = store.get();
+            const controls = storeControls;
+            damp(bounds.current.focus, bounds.goal.focus, damping, delta);
+            damp(bounds.current.camera, bounds.goal.camera, damping, delta);
+            bounds.current.zoom = THREE.MathUtils.damp(bounds.current.zoom, bounds.goal.zoom, damping, delta);
+            camera.position.copy(bounds.current.camera);
+            if (is.orthographicCamera(camera)) {
+                camera.zoom = bounds.current.zoom;
+                camera.updateProjectionMatrix();
+            }
+            if (!controls) {
+                camera.lookAt(bounds.current.focus);
+            }
+            else {
+                controls.target.copy(bounds.current.focus);
+                controls.update();
+            }
+            invalidate();
+            if (is.orthographicCamera(camera) && !(Math.abs(bounds.current.zoom - bounds.goal.zoom) < eps))
+                return;
+            if (!is.orthographicCamera(camera) && !equals(bounds.current.camera, bounds.goal.camera, eps))
+                return;
+            if (controls && !equals(bounds.current.focus, bounds.goal.focus, eps))
+                return;
+            bounds.current.animating = false;
+        }
+    });
+    return api;
+}
+extend({ Group });
+class NgtsBounds extends NgtRxStore {
+    constructor() {
+        super(...arguments);
+        this.boundsRef = injectNgtRef();
+        this.fitted = new EventEmitter();
+        this.store = inject(NgtStore);
+        this.current = { animating: false, focus: new THREE.Vector3(), camera: new THREE.Vector3(), zoom: 1 };
+        this.goal = { focus: new THREE.Vector3(), camera: new THREE.Vector3(), zoom: 1 };
+    }
+    set damping(damping) {
+        this.set({ damping });
+    }
+    set fit(fit) {
+        this.set({ fit });
+    }
+    set clip(clip) {
+        this.set({ clip });
+    }
+    set observe(observe) {
+        this.set({ observe });
+    }
+    set margin(margin) {
+        this.set({ margin });
+    }
+    set eps(eps) {
+        this.set({ eps });
+    }
+    initialize() {
+        super.initialize();
+        this.set({ damping: 6, fit: false, clip: false, observe: false, margin: 1.2, eps: 0.01 });
+    }
+    ngOnInit() {
+        this.preventDragHijacking();
+    }
+    preventDragHijacking() {
+        this.effect(this.store.select('controls'), (controls) => {
+            if (controls) {
+                const callback = () => (this.current.animating = false);
+                controls.addEventListener('start', callback);
+                return () => controls.removeEventListener('start', callback);
+            }
+        });
+    }
+}
+NgtsBounds.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsBounds, deps: null, target: i0.ɵɵFactoryTarget.Component });
+NgtsBounds.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: NgtsBounds, isStandalone: true, selector: "ngts-bounds", inputs: { boundsRef: "boundsRef", damping: "damping", fit: "fit", clip: "clip", observe: "observe", margin: "margin", eps: "eps" }, outputs: { fitted: "fitted" }, providers: [{ provide: NGTS_BOUNDS_API, useFactory: boundsApiFactory, deps: [NgtsBounds] }], usesInheritance: true, ngImport: i0, template: `
+        <ngt-group ngtCompound [ref]="boundsRef">
+            <ng-content />
+        </ngt-group>
+    `, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsBounds, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngts-bounds',
+                    standalone: true,
+                    template: `
+        <ngt-group ngtCompound [ref]="boundsRef">
+            <ng-content />
+        </ngt-group>
+    `,
+                    providers: [{ provide: NGTS_BOUNDS_API, useFactory: boundsApiFactory, deps: [NgtsBounds] }],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], propDecorators: { boundsRef: [{
+                type: Input
+            }], damping: [{
+                type: Input
+            }], fit: [{
+                type: Input
+            }], clip: [{
+                type: Input
+            }], observe: [{
+                type: Input
+            }], margin: [{
+                type: Input
+            }], eps: [{
+                type: Input
+            }], fitted: [{
+                type: Output
+            }] } });
+
+extend({ Group });
+class NgtsCenter extends NgtRxStore {
+    constructor() {
+        super(...arguments);
+        this.centerRef = injectNgtRef();
+        this.outerRef = injectNgtRef();
+        this.innerRef = injectNgtRef();
+        this.centered = new EventEmitter();
+    }
+    set top(top) {
+        this.set({ top });
+    }
+    set right(right) {
+        this.set({ right });
+    }
+    set bottom(bottom) {
+        this.set({ bottom });
+    }
+    set left(left) {
+        this.set({ left });
+    }
+    set front(front) {
+        this.set({ front });
+    }
+    set back(back) {
+        this.set({ back });
+    }
+    set disableX(disableX) {
+        this.set({ disableX });
+    }
+    set disableY(disableY) {
+        this.set({ disableY });
+    }
+    set disableZ(disableZ) {
+        this.set({ disableZ });
+    }
+    set disabled(disabled) {
+        this.set({ disabled });
+    }
+    set precise(precise) {
+        this.set({ precise });
+    }
+    initialize() {
+        super.initialize();
+        this.set({ precise: true });
+    }
+    ngOnInit() {
+        this.setPosition();
+    }
+    setPosition() {
+        this.hold(combineLatest([this.innerRef.$, this.innerRef.children$()]), ([innerGroup]) => {
+            const { precise, top, left, front, disabled, disableX, disableY, disableZ, back, bottom, right } = this.get();
+            this.outerRef.nativeElement.matrixWorld.identity();
+            const box3 = new Box3().setFromObject(innerGroup, precise);
+            const center = new Vector3();
+            const sphere = new Sphere();
+            const width = box3.max.x - box3.min.x;
+            const height = box3.max.y - box3.min.y;
+            const depth = box3.max.z - box3.min.z;
+            box3.getCenter(center);
+            box3.getBoundingSphere(sphere);
+            const vAlign = top ? height / 2 : bottom ? -height / 2 : 0;
+            const hAlign = left ? -width / 2 : right ? width / 2 : 0;
+            const dAlign = front ? depth / 2 : back ? -depth / 2 : 0;
+            this.outerRef.nativeElement.position.set(disabled || disableX ? 0 : -center.x + hAlign, disabled || disableY ? 0 : -center.y + vAlign, disabled || disableZ ? 0 : -center.z + dAlign);
+            if (this.centered.observed) {
+                this.centered.emit({
+                    parent: this.centerRef.nativeElement.parent,
+                    container: this.centerRef.nativeElement,
+                    width,
+                    height,
+                    depth,
+                    boundingBox: box3,
+                    boundingSphere: sphere,
+                    center: center,
+                    verticalAlignment: vAlign,
+                    horizontalAlignment: hAlign,
+                    depthAlignment: dAlign,
+                });
+            }
+        });
+    }
+}
+NgtsCenter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsCenter, deps: null, target: i0.ɵɵFactoryTarget.Component });
+NgtsCenter.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: NgtsCenter, isStandalone: true, selector: "ngts-center", inputs: { centerRef: "centerRef", top: "top", right: "right", bottom: "bottom", left: "left", front: "front", back: "back", disableX: "disableX", disableY: "disableY", disableZ: "disableZ", disabled: "disabled", precise: "precise" }, outputs: { centered: "centered" }, usesInheritance: true, ngImport: i0, template: `
+        <ngt-group ngtCompound [ref]="centerRef">
+            <ngt-group [ref]="outerRef">
+                <ngt-group [ref]="innerRef">
+                    <ng-content />
+                </ngt-group>
+            </ngt-group>
+        </ngt-group>
+    `, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsCenter, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngts-center',
+                    standalone: true,
+                    template: `
+        <ngt-group ngtCompound [ref]="centerRef">
+            <ngt-group [ref]="outerRef">
+                <ngt-group [ref]="innerRef">
+                    <ng-content />
+                </ngt-group>
+            </ngt-group>
+        </ngt-group>
+    `,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], propDecorators: { centerRef: [{
+                type: Input
+            }], top: [{
+                type: Input
+            }], right: [{
+                type: Input
+            }], bottom: [{
+                type: Input
+            }], left: [{
+                type: Input
+            }], front: [{
+                type: Input
+            }], back: [{
+                type: Input
+            }], disableX: [{
+                type: Input
+            }], disableY: [{
+                type: Input
+            }], disableZ: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], precise: [{
+                type: Input
+            }], centered: [{
+                type: Output
+            }] } });
+
+extend({ Group, Mesh, MeshBasicMaterial, OrthographicCamera });
+class NgtsContactShadows extends NgtRxStore {
+    set opacity(opacity) {
+        this.set({ opacity });
+    }
+    set width(width) {
+        this.set({ width });
+    }
+    set height(height) {
+        this.set({ height });
+    }
+    set blur(blur) {
+        this.set({ blur });
+    }
+    set far(far) {
+        this.set({ far });
+    }
+    set smooth(smooth) {
+        this.set({ smooth });
+    }
+    set resolution(resolution) {
+        this.set({ resolution });
+    }
+    set frames(frames) {
+        this.set({ frames });
+    }
+    set scale(scale) {
+        this.set({ scale });
+    }
+    set color(color) {
+        this.set({ color });
+    }
+    set depthWrite(depthWrite) {
+        this.set({ depthWrite });
+    }
+    set renderOrder(renderOrder) {
+        this.set({ renderOrder });
+    }
+    constructor() {
+        super();
+        this.store = inject(NgtStore);
+        this.shadowCameraRef = injectNgtRef();
+        this.encoding = this.store.get('gl', 'outputEncoding');
+        this.contactShadows$ = this.select('contactShadows');
+        this.Math = Math;
+        this.contactShadowsRef = injectNgtRef();
+        injectBeforeRender(this.onBeforeRender.bind(this, 0));
+    }
+    initialize() {
+        super.initialize();
+        this.set({
+            scale: 10,
+            frames: Infinity,
+            opacity: 1,
+            width: 1,
+            height: 1,
+            blur: 1,
+            far: 10,
+            resolution: 512,
+            smooth: true,
+            color: '#000000',
+            depthWrite: false,
+            renderOrder: 0,
+        });
+        this.connect('scaledWidth', this.select(['width', 'scale'], ({ width, scale }) => width * (Array.isArray(scale) ? scale[0] : scale || 1)));
+        this.connect('scaledHeight', this.select(['height', 'scale'], ({ height, scale }) => height * (Array.isArray(scale) ? scale[1] : scale || 1)));
+        this.connect('cameraArgs', this.select(['scaledWidth', 'scaledHeight', 'far'], ({ scaledWidth: width, scaledHeight: height, far }) => {
+            return [-width / 2, width / 2, height / 2, -height / 2, 0, far];
+        }));
+        this.connect('contactShadows', this.select(['resolution', 'scaledWidth', 'scaledHeight', 'scale', 'color'], ({ resolution, scaledWidth: width, scaledHeight: height, color }) => {
+            const renderTarget = new THREE.WebGLRenderTarget(resolution, resolution);
+            const renderTargetBlur = new THREE.WebGLRenderTarget(resolution, resolution);
+            renderTargetBlur.texture.generateMipmaps = renderTarget.texture.generateMipmaps = false;
+            const planeGeometry = new THREE.PlaneGeometry(width, height).rotateX(Math.PI / 2);
+            const blurPlane = new Mesh(planeGeometry);
+            const depthMaterial = new THREE.MeshDepthMaterial();
+            depthMaterial.depthTest = depthMaterial.depthWrite = false;
+            depthMaterial.onBeforeCompile = (shader) => {
+                shader.uniforms = {
+                    ...shader.uniforms,
+                    ucolor: { value: new THREE.Color(color) },
+                };
+                shader.fragmentShader = shader.fragmentShader.replace(`void main() {`, //
+                `uniform vec3 ucolor;
+                             void main() {
+                            `);
+                shader.fragmentShader = shader.fragmentShader.replace('vec4( vec3( 1.0 - fragCoordZ ), opacity );', 
+                // Colorize the shadow, multiply by the falloff so that the center can remain darker
+                'vec4( ucolor * fragCoordZ * 2.0, ( 1.0 - fragCoordZ ) * 1.0 );');
+            };
+            const horizontalBlurMaterial = new THREE.ShaderMaterial(HorizontalBlurShader);
+            const verticalBlurMaterial = new THREE.ShaderMaterial(VerticalBlurShader);
+            verticalBlurMaterial.depthTest = horizontalBlurMaterial.depthTest = false;
+            return {
+                renderTarget,
+                planeGeometry,
+                depthMaterial,
+                blurPlane,
+                horizontalBlurMaterial,
+                verticalBlurMaterial,
+                renderTargetBlur,
+            };
+        }));
+    }
+    onBeforeRender(count, { scene, gl }) {
+        const { frames, blur, contactShadows: { depthMaterial, renderTarget }, smooth, } = this.get();
+        if (this.shadowCameraRef.nativeElement && (frames === Infinity || count < frames)) {
+            const initialBackground = scene.background;
+            scene.background = null;
+            const initialOverrideMaterial = scene.overrideMaterial;
+            scene.overrideMaterial = depthMaterial;
+            gl.setRenderTarget(renderTarget);
+            gl.render(scene, this.shadowCameraRef.nativeElement);
+            scene.overrideMaterial = initialOverrideMaterial;
+            this.blurShadows(blur);
+            if (smooth)
+                this.blurShadows(blur * 0.4);
+            gl.setRenderTarget(null);
+            scene.background = initialBackground;
+            count++;
+        }
+    }
+    blurShadows(blur) {
+        const { blurPlane, horizontalBlurMaterial, verticalBlurMaterial, renderTargetBlur, renderTarget } = this.get('contactShadows');
+        const gl = this.store.get('gl');
+        blurPlane.visible = true;
+        blurPlane.material = horizontalBlurMaterial;
+        horizontalBlurMaterial.uniforms.tDiffuse.value = renderTarget.texture;
+        horizontalBlurMaterial.uniforms.h.value = (blur * 1) / 256;
+        gl.setRenderTarget(renderTargetBlur);
+        gl.render(blurPlane, this.shadowCameraRef.nativeElement);
+        blurPlane.material = verticalBlurMaterial;
+        verticalBlurMaterial.uniforms.tDiffuse.value = renderTargetBlur.texture;
+        verticalBlurMaterial.uniforms.v.value = (blur * 1) / 256;
+        gl.setRenderTarget(renderTarget);
+        gl.render(blurPlane, this.shadowCameraRef.nativeElement);
+        blurPlane.visible = false;
+    }
+}
+NgtsContactShadows.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsContactShadows, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NgtsContactShadows.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: NgtsContactShadows, isStandalone: true, selector: "ngts-contact-shadows", inputs: { contactShadowsRef: "contactShadowsRef", opacity: "opacity", width: "width", height: "height", blur: "blur", far: "far", smooth: "smooth", resolution: "resolution", frames: "frames", scale: "scale", color: "color", depthWrite: "depthWrite", renderOrder: "renderOrder" }, usesInheritance: true, ngImport: i0, template: `
+        <ngt-group ngtCompound [ref]="contactShadowsRef" [rotation]="[Math.PI / 2, 0, 0]">
+            <ng-container *ngIf="contactShadows$ | ngtPush : null as contactShadows">
+                <ngt-mesh
+                    [renderOrder]="get('renderOrder')"
+                    [geometry]="contactShadows.planeGeometry"
+                    [scale]="[1, -1, 1]"
+                    [rotation]="[-Math.PI / 2, 0, 0]"
+                >
+                    <ngt-mesh-basic-material
+                        [map]="contactShadows.renderTarget.texture"
+                        transparent
+                        [opacity]="get('opacity')"
+                        [depthWrite]="get('depthWrite')"
+                    >
+                        <ngt-value [rawValue]="encoding" attach="map.encoding" />
+                    </ngt-mesh-basic-material>
+                </ngt-mesh>
+                <ngt-orthographic-camera *args="get('cameraArgs')" [ref]="shadowCameraRef" />
+            </ng-container>
+        </ngt-group>
+    `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: NgtPush, name: "ngtPush" }, { kind: "directive", type: NgtArgs, selector: "[args]", inputs: ["args"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsContactShadows, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngts-contact-shadows',
+                    standalone: true,
+                    template: `
+        <ngt-group ngtCompound [ref]="contactShadowsRef" [rotation]="[Math.PI / 2, 0, 0]">
+            <ng-container *ngIf="contactShadows$ | ngtPush : null as contactShadows">
+                <ngt-mesh
+                    [renderOrder]="get('renderOrder')"
+                    [geometry]="contactShadows.planeGeometry"
+                    [scale]="[1, -1, 1]"
+                    [rotation]="[-Math.PI / 2, 0, 0]"
+                >
+                    <ngt-mesh-basic-material
+                        [map]="contactShadows.renderTarget.texture"
+                        transparent
+                        [opacity]="get('opacity')"
+                        [depthWrite]="get('depthWrite')"
+                    >
+                        <ngt-value [rawValue]="encoding" attach="map.encoding" />
+                    </ngt-mesh-basic-material>
+                </ngt-mesh>
+                <ngt-orthographic-camera *args="get('cameraArgs')" [ref]="shadowCameraRef" />
+            </ng-container>
+        </ngt-group>
+    `,
+                    imports: [NgIf, NgtPush, NgtArgs],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: function () { return []; }, propDecorators: { contactShadowsRef: [{
+                type: Input
+            }], opacity: [{
+                type: Input
+            }], width: [{
+                type: Input
+            }], height: [{
+                type: Input
+            }], blur: [{
+                type: Input
+            }], far: [{
+                type: Input
+            }], smooth: [{
+                type: Input
+            }], resolution: [{
+                type: Input
+            }], frames: [{
+                type: Input
+            }], scale: [{
+                type: Input
+            }], color: [{
+                type: Input
+            }], depthWrite: [{
+                type: Input
+            }], renderOrder: [{
+                type: Input
+            }] } });
+
+const ngtsEnvironmentPresetsObj = {
+    sunset: 'venice/venice_sunset_1k.hdr',
+    dawn: 'kiara/kiara_1_dawn_1k.hdr',
+    night: 'dikhololo/dikhololo_night_1k.hdr',
+    warehouse: 'empty-wharehouse/empty_warehouse_01_1k.hdr',
+    forest: 'forrest-slope/forest_slope_1k.hdr',
+    apartment: 'lebombo/lebombo_1k.hdr',
+    studio: 'studio-small-3/studio_small_03_1k.hdr',
+    city: 'potsdamer-platz/potsdamer_platz_1k.hdr',
+    park: 'rooitou/rooitou_park_1k.hdr',
+    lobby: 'st-fagans/st_fagans_interior_1k.hdr',
+};
+
+class NgtsEnvironmentInputs extends NgtRxStore {
+    constructor() {
+        super(...arguments);
+        this.store = inject(NgtStore);
+    }
+    set frames(frames) {
+        this.set({ frames });
+    }
+    set near(near) {
+        this.set({ near });
+    }
+    set far(far) {
+        this.set({ far });
+    }
+    set resolution(resolution) {
+        this.set({ resolution });
+    }
+    set background(background) {
+        this.set({ background });
+    }
+    set blur(blur) {
+        this.set({ blur });
+    }
+    set map(map) {
+        this.set({ map });
+    }
+    set files(files) {
+        this.set({ files });
+    }
+    set path(path) {
+        this.set({ path });
+    }
+    set preset(preset) {
+        this.set({ preset });
+    }
+    set scene(scene) {
+        this.set({ scene });
+    }
+    set extensions(extensions) {
+        this.set({ extensions });
+    }
+    set ground(ground) {
+        this.set({ ground });
+    }
+    set encoding(encoding) {
+        this.set({ encoding });
+    }
+}
+NgtsEnvironmentInputs.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsEnvironmentInputs, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+NgtsEnvironmentInputs.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.3", type: NgtsEnvironmentInputs, inputs: { frames: "frames", near: "near", far: "far", resolution: "resolution", background: "background", blur: "blur", map: "map", files: "files", path: "path", preset: "preset", scene: "scene", extensions: "extensions", ground: "ground", encoding: "encoding" }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsEnvironmentInputs, decorators: [{
+            type: Directive
+        }], propDecorators: { frames: [{
+                type: Input
+            }], near: [{
+                type: Input
+            }], far: [{
+                type: Input
+            }], resolution: [{
+                type: Input
+            }], background: [{
+                type: Input
+            }], blur: [{
+                type: Input
+            }], map: [{
+                type: Input
+            }], files: [{
+                type: Input
+            }], path: [{
+                type: Input
+            }], preset: [{
+                type: Input
+            }], scene: [{
+                type: Input
+            }], extensions: [{
+                type: Input
+            }], ground: [{
+                type: Input
+            }], encoding: [{
+                type: Input
+            }] } });
+
+function resolveScene(scene) {
+    return is.ref(scene) ? scene.nativeElement : scene;
+}
+function setEnvProps(background, scene, defaultScene, texture, blur = 0) {
+    const target = resolveScene(scene || defaultScene);
+    const oldbg = target.background;
+    const oldenv = target.environment;
+    const oldBlur = target.backgroundBlurriness || 0;
+    if (background !== 'only')
+        target.environment = texture;
+    if (background)
+        target.background = texture;
+    if (background && target.backgroundBlurriness !== undefined)
+        target.backgroundBlurriness = blur;
+    return () => {
+        if (background !== 'only')
+            target.environment = oldenv;
+        if (background)
+            target.background = oldbg;
+        if (background && target.backgroundBlurriness !== undefined)
+            target.backgroundBlurriness = oldBlur;
+    };
+}
+const CUBEMAP_ROOT = 'https://market-assets.fra1.cdn.digitaloceanspaces.com/market-assets/hdris/';
+function injectNgtsEnvironment(paramsFactory) {
+    let p = {
+        files: ['/px.png', '/nx.png', '/py.png', '/ny.png', '/pz.png', '/nz.png'],
+        path: '',
+        preset: undefined,
+        encoding: undefined,
+    };
+    const params = paramsFactory(p);
+    const params$ = isObservable(params) ? params : of(params);
+    const textureRef = injectNgtRef();
+    const { destroy$ } = injectNgtDestroy(() => {
+        textureRef.nativeElement?.dispose();
+    });
+    const loaderResult = injectNgtLoader((inputs) => (Array.isArray(inputs) ? CubeTextureLoader : RGBELoader), params$.pipe(debounceTime(0), map((data) => {
+        p = data;
+        return p;
+    }), map((data) => {
+        if (data.preset) {
+            if (!(data.preset in ngtsEnvironmentPresetsObj))
+                throw new Error('Preset must be one of: ' + Object.keys(ngtsEnvironmentPresetsObj).join(', '));
+            data.files = ngtsEnvironmentPresetsObj[data.preset];
+            data.path = CUBEMAP_ROOT;
+        }
+        return Array.isArray(data.files) ? [data.files] : data.files;
+    })), (loader) => {
+        if (p.path) {
+            loader.setPath(p.path);
+        }
+        if (p.extensions) {
+            p.extensions(loader);
+        }
+    });
+    loaderResult.pipe(takeUntil(destroy$)).subscribe((results) => {
+        const texture = Array.isArray(p.files) ? results[0] : results;
+        texture.mapping = Array.isArray(p.files) ? CubeReflectionMapping : EquirectangularReflectionMapping;
+        texture.encoding = (p.encoding ?? Array.isArray(p.files)) ? sRGBEncoding : LinearEncoding;
+        textureRef.nativeElement = texture;
+    });
+    return textureRef;
+}
+
+class NgtsEnvironmentCube extends NgtsEnvironmentInputs {
+    constructor() {
+        super(...arguments);
+        this.textureRef = injectNgtsEnvironment((params) => this.select().pipe(startWith(params)));
+    }
+    initialize() {
+        super.initialize();
+        this.set({ background: false });
+    }
+    ngOnInit() {
+        this.setEnvProps();
+    }
+    setEnvProps() {
+        this.effect(combineLatest([
+            this.store.select('scene'),
+            this.select('scene').pipe(startWithUndefined()),
+            this.select('background'),
+            this.select('blur').pipe(startWithUndefined()),
+            this.textureRef.$,
+        ]), ([defaultScene, scene, background, blur, texture]) => {
+            return setEnvProps(background, scene, defaultScene, texture, blur);
+        });
+    }
+}
+NgtsEnvironmentCube.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsEnvironmentCube, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+NgtsEnvironmentCube.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.3", type: NgtsEnvironmentCube, isStandalone: true, selector: "ngts-environment-cube", usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsEnvironmentCube, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'ngts-environment-cube',
+                    standalone: true,
+                }]
+        }] });
+
+class NgtsEnvironmentMap extends NgtsEnvironmentInputs {
+    initialize() {
+        super.initialize();
+        this.set({ background: false });
+    }
+    ngOnInit() {
+        this.setEnvProps();
+    }
+    setEnvProps() {
+        this.effect(combineLatest([
+            this.store.select('scene'),
+            this.select('map'),
+            this.select('scene').pipe(startWithUndefined()),
+            this.select('background'),
+            this.select('blur').pipe(startWithUndefined()),
+        ]), ([defaultScene, map, scene, background, blur]) => {
+            if (map) {
+                return setEnvProps(background, scene, defaultScene, map, blur);
+            }
+        });
+    }
+}
+NgtsEnvironmentMap.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsEnvironmentMap, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+NgtsEnvironmentMap.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.3", type: NgtsEnvironmentMap, isStandalone: true, selector: "ngts-environment-map", usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsEnvironmentMap, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'ngts-environment-map',
+                    standalone: true,
+                }]
+        }] });
+
+extend({ GroundProjectedEnv });
+class NgtsEnvironmentGround extends NgtsEnvironmentInputs {
+    constructor() {
+        super(...arguments);
+        this.defaultTexture = injectNgtsEnvironment((params) => this.select().pipe(startWith(params)));
+    }
+    ngOnInit() {
+        this.connect('texture', combineLatest([this.select('map').pipe(startWithUndefined()), this.defaultTexture.$]).pipe(map(([map, texture]) => map || texture)));
+        this.connect('groundArgs', this.select('texture').pipe(map((texture) => [texture])));
+        this.connect('groundHeight', this.select(['ground'], ({ ground }) => ground?.height));
+        this.connect('groundRadius', this.select(['ground'], ({ ground }) => ground?.radius));
+        this.connect('groundScale', this.select(['ground'], ({ ground }) => ground?.scale ?? 1000));
+    }
+}
+NgtsEnvironmentGround.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsEnvironmentGround, deps: null, target: i0.ɵɵFactoryTarget.Component });
+NgtsEnvironmentGround.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: NgtsEnvironmentGround, isStandalone: true, selector: "ngts-environment-ground", usesInheritance: true, ngImport: i0, template: `
+        <ngts-environment-map
+            [background]="get('background')"
+            [blur]="get('blur')"
+            [scene]="get('scene')"
+            [map]="get('texture')"
+        />
+        <ng-container *ngIf="get('groundArgs') as groundArgs">
+            <ngt-ground-projected-env
+                *args="groundArgs"
+                [scale]="get('groundScale')"
+                [height]="get('groundHeight')"
+                [radius]="get('groundRadius')"
+            />
+        </ng-container>
+    `, isInline: true, dependencies: [{ kind: "directive", type: NgtsEnvironmentMap, selector: "ngts-environment-map" }, { kind: "directive", type: NgtArgs, selector: "[args]", inputs: ["args"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsEnvironmentGround, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngts-environment-ground',
+                    standalone: true,
+                    template: `
+        <ngts-environment-map
+            [background]="get('background')"
+            [blur]="get('blur')"
+            [scene]="get('scene')"
+            [map]="get('texture')"
+        />
+        <ng-container *ngIf="get('groundArgs') as groundArgs">
+            <ngt-ground-projected-env
+                *args="groundArgs"
+                [scale]="get('groundScale')"
+                [height]="get('groundHeight')"
+                [radius]="get('groundRadius')"
+            />
+        </ng-container>
+    `,
+                    imports: [NgtsEnvironmentMap, NgtArgs, NgIf],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }] });
+
+extend({ CubeCamera });
+class NgtsEnvironmentPortal extends NgtsEnvironmentInputs {
+    initialize() {
+        super.initialize();
+        this.set({ near: 1, far: 1000, resolution: 256, frames: 1, background: false, preset: undefined });
+        this.connect('fbo', this.select(['resolution'], ({ resolution }) => {
+            const fbo = new THREE.WebGLCubeRenderTarget(resolution);
+            fbo.texture.type = HalfFloatType;
+            return fbo;
+        }));
+        this.connect('cameraArgs', this.select(['fbo', 'near', 'far'], ({ near, far, fbo }) => [near, far, fbo]));
+    }
+    constructor() {
+        super();
+        this.virtualSceneRef = injectNgtRef(prepare(new THREE.Scene()));
+        this.cubeCameraRef = injectNgtRef();
+        injectBeforeRender(this.onBeforeRender.bind(this, 1));
+    }
+    ngOnInit() {
+        this.setEnvProps();
+    }
+    setEnvProps() {
+        this.effect(combineLatest([
+            this.store.select('gl'),
+            this.store.select('scene'),
+            this.select('fbo'),
+            this.select('scene'),
+            this.select('background'),
+            this.select('frames'),
+            this.select('blur'),
+            this.virtualSceneRef.$,
+            this.cubeCameraRef.$,
+        ]), ([gl, defaultScene, fbo, scene, background, frames, blur, virtualScene, camera]) => {
+            if (frames === 1)
+                camera.update(gl, virtualScene);
+            return setEnvProps(background, scene, defaultScene, fbo.texture, blur);
+        });
+    }
+    onBeforeRender(count, { gl }) {
+        const { frames } = this.get();
+        if (frames === Infinity || count < frames) {
+            if (this.cubeCameraRef.nativeElement) {
+                this.cubeCameraRef.nativeElement.update(gl, this.virtualSceneRef.nativeElement);
+                count++;
+            }
+        }
+    }
+}
+NgtsEnvironmentPortal.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsEnvironmentPortal, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NgtsEnvironmentPortal.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: NgtsEnvironmentPortal, isStandalone: true, selector: "ngts-environment-portal", usesInheritance: true, ngImport: i0, template: `
+        <ngt-portal [container]="virtualSceneRef">
+            <ng-template ngtPortalContent>
+                <ng-content />
+                <ngt-cube-camera *args="get('cameraArgs')" [ref]="cubeCameraRef" />
+                <ng-container *ngIf="get('files') || get('preset'); else environmentMap">
+                    <ngts-environment-cube
+                        [background]="true"
+                        [files]="get('files')"
+                        [preset]="get('preset')"
+                        [path]="get('path')"
+                        [extensions]="get('extensions')"
+                    />
+                </ng-container>
+                <ng-template #environmentMap>
+                    <ngts-environment-map [background]="true" [map]="get('map')" [extensions]="get('extensions')" />
+                </ng-template>
+            </ng-template>
+        </ngt-portal>
+    `, isInline: true, dependencies: [{ kind: "component", type: NgtPortal, selector: "ngt-portal", inputs: ["container", "state", "autoRender", "autoRenderPriority"], outputs: ["beforeRender"] }, { kind: "directive", type: NgtPortalContent, selector: "ng-template[ngtPortalContent]" }, { kind: "directive", type: NgtsEnvironmentMap, selector: "ngts-environment-map" }, { kind: "directive", type: NgtsEnvironmentCube, selector: "ngts-environment-cube" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgtArgs, selector: "[args]", inputs: ["args"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsEnvironmentPortal, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngts-environment-portal',
+                    standalone: true,
+                    template: `
+        <ngt-portal [container]="virtualSceneRef">
+            <ng-template ngtPortalContent>
+                <ng-content />
+                <ngt-cube-camera *args="get('cameraArgs')" [ref]="cubeCameraRef" />
+                <ng-container *ngIf="get('files') || get('preset'); else environmentMap">
+                    <ngts-environment-cube
+                        [background]="true"
+                        [files]="get('files')"
+                        [preset]="get('preset')"
+                        [path]="get('path')"
+                        [extensions]="get('extensions')"
+                    />
+                </ng-container>
+                <ng-template #environmentMap>
+                    <ngts-environment-map [background]="true" [map]="get('map')" [extensions]="get('extensions')" />
+                </ng-template>
+            </ng-template>
+        </ngt-portal>
+    `,
+                    imports: [NgtPortal, NgtPortalContent, NgtsEnvironmentMap, NgtsEnvironmentCube, NgIf, NgtArgs],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: function () { return []; } });
+
+class NgtsEnvironmentContent {
+}
+NgtsEnvironmentContent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsEnvironmentContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+NgtsEnvironmentContent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.3", type: NgtsEnvironmentContent, isStandalone: true, selector: "ng-template[ngtsEnvironmentContent]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsEnvironmentContent, decorators: [{
+            type: Directive,
+            args: [{ selector: 'ng-template[ngtsEnvironmentContent]', standalone: true }]
+        }] });
+class NgtsEnvironment extends NgtsEnvironmentInputs {
+}
+NgtsEnvironment.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsEnvironment, deps: null, target: i0.ɵɵFactoryTarget.Component });
+NgtsEnvironment.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: NgtsEnvironment, isStandalone: true, selector: "ngts-environment", queries: [{ propertyName: "content", first: true, predicate: NgtsEnvironmentContent, descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: `
+        <ngts-environment-ground
+            *ngIf="get('ground'); else noGround"
+            [ground]="get('ground')"
+            [map]="get('map')"
+            [scene]="get('scene')"
+            [blur]="get('blur')"
+            [background]="get('background')"
+            [preset]="get('preset')"
+            [frames]="get('frames')"
+            [far]="get('far')"
+            [near]="get('near')"
+            [resolution]="get('resolution')"
+            [files]="get('files')"
+            [path]="get('path')"
+            [extensions]="get('extensions')"
+        />
+        <ng-template #noGround>
+            <ngts-environment-map
+                *ngIf="get('map'); else noMap"
+                [map]="get('map')"
+                [scene]="get('scene')"
+                [blur]="get('blur')"
+                [background]="get('background')"
+            />
+            <ng-template #noMap>
+                <ngts-environment-portal
+                    *ngIf="content; else noPortal"
+                    [frames]="get('frames')"
+                    [far]="get('far')"
+                    [near]="get('near')"
+                    [resolution]="get('resolution')"
+                    [map]="get('map')"
+                    [background]="get('background')"
+                    [blur]="get('blur')"
+                    [scene]="get('scene')"
+                    [files]="get('files')"
+                    [path]="get('path')"
+                    [preset]="get('preset')"
+                    [extensions]="get('extensions')"
+                >
+                    <ng-container *ngTemplateOutlet="content" />
+                </ngts-environment-portal>
+                <ng-template #noPortal>
+                    <ngts-environment-cube
+                        [frames]="get('frames')"
+                        [far]="get('far')"
+                        [near]="get('near')"
+                        [resolution]="get('resolution')"
+                        [map]="get('map')"
+                        [background]="get('background')"
+                        [blur]="get('blur')"
+                        [scene]="get('scene')"
+                        [files]="get('files')"
+                        [path]="get('path')"
+                        [preset]="get('preset')"
+                        [extensions]="get('extensions')"
+                    />
+                </ng-template>
+            </ng-template>
+        </ng-template>
+    `, isInline: true, dependencies: [{ kind: "directive", type: NgtsEnvironmentMap, selector: "ngts-environment-map" }, { kind: "component", type: NgtsEnvironmentGround, selector: "ngts-environment-ground" }, { kind: "directive", type: NgtsEnvironmentCube, selector: "ngts-environment-cube" }, { kind: "component", type: NgtsEnvironmentPortal, selector: "ngts-environment-portal" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsEnvironment, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngts-environment',
+                    standalone: true,
+                    template: `
+        <ngts-environment-ground
+            *ngIf="get('ground'); else noGround"
+            [ground]="get('ground')"
+            [map]="get('map')"
+            [scene]="get('scene')"
+            [blur]="get('blur')"
+            [background]="get('background')"
+            [preset]="get('preset')"
+            [frames]="get('frames')"
+            [far]="get('far')"
+            [near]="get('near')"
+            [resolution]="get('resolution')"
+            [files]="get('files')"
+            [path]="get('path')"
+            [extensions]="get('extensions')"
+        />
+        <ng-template #noGround>
+            <ngts-environment-map
+                *ngIf="get('map'); else noMap"
+                [map]="get('map')"
+                [scene]="get('scene')"
+                [blur]="get('blur')"
+                [background]="get('background')"
+            />
+            <ng-template #noMap>
+                <ngts-environment-portal
+                    *ngIf="content; else noPortal"
+                    [frames]="get('frames')"
+                    [far]="get('far')"
+                    [near]="get('near')"
+                    [resolution]="get('resolution')"
+                    [map]="get('map')"
+                    [background]="get('background')"
+                    [blur]="get('blur')"
+                    [scene]="get('scene')"
+                    [files]="get('files')"
+                    [path]="get('path')"
+                    [preset]="get('preset')"
+                    [extensions]="get('extensions')"
+                >
+                    <ng-container *ngTemplateOutlet="content" />
+                </ngts-environment-portal>
+                <ng-template #noPortal>
+                    <ngts-environment-cube
+                        [frames]="get('frames')"
+                        [far]="get('far')"
+                        [near]="get('near')"
+                        [resolution]="get('resolution')"
+                        [map]="get('map')"
+                        [background]="get('background')"
+                        [blur]="get('blur')"
+                        [scene]="get('scene')"
+                        [files]="get('files')"
+                        [path]="get('path')"
+                        [preset]="get('preset')"
+                        [extensions]="get('extensions')"
+                    />
+                </ng-template>
+            </ng-template>
+        </ng-template>
+    `,
+                    imports: [
+                        NgtsEnvironmentMap,
+                        NgtsEnvironmentGround,
+                        NgtsEnvironmentCube,
+                        NgtsEnvironmentPortal,
+                        NgIf,
+                        NgTemplateOutlet,
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], propDecorators: { content: [{
+                type: ContentChild,
+                args: [NgtsEnvironmentContent, { read: TemplateRef }]
+            }] } });
+
+extend({ Group });
+class NgtsFloat extends NgtRxStore {
+    set speed(speed) {
+        this.set({ speed });
+    }
+    set rotationIntensity(rotationIntensity) {
+        this.set({ rotationIntensity });
+    }
+    set floatIntensity(floatIntensity) {
+        this.set({ floatIntensity });
+    }
+    set floatingRange(floatingRange) {
+        this.set({ floatingRange });
+    }
+    initialize() {
+        super.initialize();
+        this.set({ speed: 1, rotationIntensity: 1, floatIntensity: 1, floatingRange: [-0.1, 0.1] });
+    }
+    constructor() {
+        super();
+        this.offset = Math.random() * 10000;
+        this.floatRef = injectNgtRef();
+        injectBeforeRender(this.onBeforeRender.bind(this));
+    }
+    onBeforeRender({ clock }) {
+        if (!this.floatRef.nativeElement)
+            return;
+        const { speed, floatingRange, floatIntensity, rotationIntensity } = this.get();
+        const t = this.offset + clock.getElapsedTime();
+        this.floatRef.nativeElement.rotation.x = (Math.cos((t / 4) * speed) / 8) * rotationIntensity;
+        this.floatRef.nativeElement.rotation.y = (Math.sin((t / 4) * speed) / 8) * rotationIntensity;
+        this.floatRef.nativeElement.rotation.z = (Math.sin((t / 4) * speed) / 20) * rotationIntensity;
+        let yPosition = Math.sin((t / 4) * speed) / 10;
+        yPosition = THREE.MathUtils.mapLinear(yPosition, -0.1, 0.1, floatingRange[0] ?? -0.1, floatingRange[1] ?? 0.1);
+        this.floatRef.nativeElement.position.y = yPosition * floatIntensity;
+    }
+}
+NgtsFloat.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsFloat, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NgtsFloat.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: NgtsFloat, isStandalone: true, selector: "ngts-float", inputs: { floatRef: "floatRef", speed: "speed", rotationIntensity: "rotationIntensity", floatIntensity: "floatIntensity", floatingRange: "floatingRange" }, usesInheritance: true, ngImport: i0, template: `
+        <ngt-group ngtCompound>
+            <ngt-group [ref]="floatRef">
+                <ng-content />
+            </ngt-group>
+        </ngt-group>
+    `, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsFloat, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngts-float',
+                    standalone: true,
+                    template: `
+        <ngt-group ngtCompound>
+            <ngt-group [ref]="floatRef">
+                <ng-content />
+            </ngt-group>
+        </ngt-group>
+    `,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: function () { return []; }, propDecorators: { floatRef: [{
+                type: Input
+            }], speed: [{
+                type: Input
+            }], rotationIntensity: [{
+                type: Input
+            }], floatIntensity: [{
+                type: Input
+            }], floatingRange: [{
+                type: Input
+            }] } });
+
+function calcPosFromAngles(inclination, azimuth, vector = new Vector3()) {
+    const theta = Math.PI * (inclination - 0.5);
+    const phi = 2 * Math.PI * (azimuth - 0.5);
+    vector.x = Math.cos(phi);
+    vector.y = Math.sin(theta);
+    vector.z = Math.sin(phi);
+    return vector;
+}
+class NgtsSky extends NgtRxStore {
+    constructor() {
+        super(...arguments);
+        this.skyRef = injectNgtRef();
+    }
+    set distance(distance) {
+        this.set({ distance });
+    }
+    set sunPosition(sunPosition) {
+        this.set({ sunPosition });
+    }
+    set inclination(inclination) {
+        this.set({ inclination });
+    }
+    set azimuth(azimuth) {
+        this.set({ azimuth });
+    }
+    set mieCoefficient(mieCoefficient) {
+        this.set({ mieCoefficient });
+    }
+    set mieDirectionalG(mieDirectionalG) {
+        this.set({ mieDirectionalG });
+    }
+    set rayleigh(rayleigh) {
+        this.set({ rayleigh });
+    }
+    set turbidity(turbidity) {
+        this.set({ turbidity });
+    }
+    initialize() {
+        super.initialize();
+        const inclination = 0.6;
+        const azimuth = 0.1;
+        this.set({
+            inclination,
+            azimuth,
+            distance: 1000,
+            mieCoefficient: 0.005,
+            mieDirectionalG: 0.8,
+            rayleigh: 0.5,
+            turbidity: 10,
+            sunPosition: calcPosFromAngles(inclination, azimuth),
+        });
+        this.connect('sunPosition', this.select(['inclination', 'azimuth'], ({ inclination, azimuth }) => calcPosFromAngles(inclination, azimuth)));
+        this.connect('scale', this.select(['distance'], ({ distance }) => new Vector3().setScalar(distance)));
+    }
+    ngOnInit() {
+        if (!this.skyRef.nativeElement)
+            this.skyRef.nativeElement = new Sky();
+    }
+}
+NgtsSky.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsSky, deps: null, target: i0.ɵɵFactoryTarget.Component });
+NgtsSky.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: NgtsSky, isStandalone: true, selector: "ngts-sky", inputs: { skyRef: "skyRef", distance: "distance", sunPosition: "sunPosition", inclination: "inclination", azimuth: "azimuth", mieCoefficient: "mieCoefficient", mieDirectionalG: "mieDirectionalG", rayleigh: "rayleigh", turbidity: "turbidity" }, usesInheritance: true, ngImport: i0, template: `
+        <ngt-primitive *args="[skyRef.nativeElement]" ngtCompound [ref]="skyRef" [scale]="get('scale')">
+            <ngt-value [rawValue]="get('mieCoefficient')" attach="material.uniforms.mieCoefficient.value" />
+            <ngt-value [rawValue]="get('mieDirectionalG')" attach="material.uniforms.mieDirectionalG.value" />
+            <ngt-value [rawValue]="get('rayleigh')" attach="material.uniforms.rayleigh.value" />
+            <ngt-value [rawValue]="get('sunPosition')" attach="material.uniforms.sunPosition.value" />
+            <ngt-value [rawValue]="get('turbidity')" attach="material.uniforms.turbidity.value" />
+        </ngt-primitive>
+    `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "[args]", inputs: ["args"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsSky, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngts-sky',
+                    standalone: true,
+                    template: `
+        <ngt-primitive *args="[skyRef.nativeElement]" ngtCompound [ref]="skyRef" [scale]="get('scale')">
+            <ngt-value [rawValue]="get('mieCoefficient')" attach="material.uniforms.mieCoefficient.value" />
+            <ngt-value [rawValue]="get('mieDirectionalG')" attach="material.uniforms.mieDirectionalG.value" />
+            <ngt-value [rawValue]="get('rayleigh')" attach="material.uniforms.rayleigh.value" />
+            <ngt-value [rawValue]="get('sunPosition')" attach="material.uniforms.sunPosition.value" />
+            <ngt-value [rawValue]="get('turbidity')" attach="material.uniforms.turbidity.value" />
+        </ngt-primitive>
+    `,
+                    imports: [NgtArgs],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], propDecorators: { skyRef: [{
+                type: Input
+            }], distance: [{
+                type: Input
+            }], sunPosition: [{
+                type: Input
+            }], inclination: [{
+                type: Input
+            }], azimuth: [{
+                type: Input
+            }], mieCoefficient: [{
+                type: Input
+            }], mieDirectionalG: [{
+                type: Input
+            }], rayleigh: [{
+                type: Input
+            }], turbidity: [{
+                type: Input
+            }] } });
+
+const SparklesMaterial = shaderMaterial({ time: 0, pixelRatio: 1 }, 
+// language=GLSL
+`
+uniform float pixelRatio;
+uniform float time;
+
+attribute float size;
+attribute float speed;
+attribute float opacity;
+attribute vec3 noise;
+attribute vec3 color;
+
+varying vec3 vColor;
+varying float vOpacity;
+
+void main() {
+  vec4 modelPosition = modelMatrix * vec4(position, 1.0);
+
+  modelPosition.y += sin(time * speed + modelPosition.x * noise.x * 100.0) * 0.2;
+  modelPosition.z += cos(time * speed + modelPosition.x * noise.y * 100.0) * 0.2;
+  modelPosition.x += cos(time * speed + modelPosition.x * noise.z * 100.0) * 0.2;
+
+  vec4 viewPosition = viewMatrix * modelPosition;
+  vec4 projectionPostion = projectionMatrix * viewPosition;
+
+  gl_Position = projectionPostion;
+  gl_PointSize = size * 25. * pixelRatio;
+  gl_PointSize *= (1.0 / - viewPosition.z);
+
+  vColor = color;
+  vOpacity = opacity;
+}
+  `, 
+// language=GLSL
+`
+varying vec3 vColor;
+varying float vOpacity;
+
+void main() {
+  float distanceToCenter = distance(gl_PointCoord, vec2(0.5));
+  float strength = 0.05 / distanceToCenter - 0.1;
+
+  gl_FragColor = vec4(vColor, strength * vOpacity);
+}
+  `);
+extend({ SparklesMaterial, Points, BufferGeometry, BufferAttribute });
+const isFloat32Array = (def) => def && def.constructor === Float32Array;
+const expandColor = (v) => [v.r, v.g, v.b];
+const isVector = (v) => v instanceof Vector2 || v instanceof Vector3 || v instanceof Vector4;
+const normalizeVector = (v) => {
+    if (Array.isArray(v))
+        return v;
+    else if (isVector(v))
+        return v.toArray();
+    return [v, v, v];
+};
+function usePropAsIsOrAsAttribute(count, prop, setDefault) {
+    if (prop !== undefined) {
+        if (isFloat32Array(prop)) {
+            return prop;
+        }
+        else {
+            if (prop instanceof Color) {
+                const a = Array.from({ length: count * 3 }, () => expandColor(prop)).flat();
+                return Float32Array.from(a);
+            }
+            else if (isVector(prop) || Array.isArray(prop)) {
+                const a = Array.from({ length: count * 3 }, () => normalizeVector(prop)).flat();
+                return Float32Array.from(a);
+            }
+            return Float32Array.from({ length: count }, () => prop);
+        }
+    }
+    return Float32Array.from({ length: count }, setDefault);
+}
+class NgtsSparkles extends NgtRxStore {
+    /** Number of particles (default: 100) */
+    set count(count) {
+        this.set({ count });
+    }
+    /** Speed of particles (default: 1) */
+    set speed(speed) {
+        this.set({ speed });
+    }
+    /** Opacity of particles (default: 1) */
+    set opacity(opacity) {
+        this.set({ opacity });
+    }
+    /** Color of particles (default: 100) */
+    set color(color) {
+        this.set({ color });
+    }
+    /** Size of particles (default: randomized between 0 and 1) */
+    set size(size) {
+        this.set({ size });
+    }
+    /** The space the particles occupy (default: 1) */
+    set scale(scale) {
+        this.set({ scale });
+    }
+    /** Movement factor (default: 1) */
+    set noise(noise) {
+        this.set({ noise });
+    }
+    initialize() {
+        super.initialize();
+        this.set({
+            noise: 1,
+            count: 100,
+            speed: 1,
+            opacity: 1,
+            scale: 1,
+        });
+        this.connect('positions', this.select(['count', 'scale'], ({ count, scale }) => Float32Array.from(Array.from({ length: count }, () => normalizeVector(scale).map(MathUtils.randFloatSpread)).flat())));
+        this.connect('sizes', this.getAttribute$('size', { setDefault: Math.random }));
+        this.connect('opacities', this.getAttribute$('opacity'));
+        this.connect('speeds', this.getAttribute$('speed'));
+        this.connect('noises', this.getAttribute$('noise', {
+            countValue: (_, count) => count * 3,
+        }));
+        this.connect('colors', this.getAttribute$('color', {
+            keyValue: (color) => (!isFloat32Array(color) ? new Color(color) : color),
+            countValue: (color, count) => (color === undefined ? count * 3 : count),
+            setDefault: () => 1,
+        }));
+    }
+    constructor() {
+        super();
+        this.store = inject(NgtStore);
+        this.dpr = this.store.get('viewport', 'dpr');
+        this.materialRef = injectNgtRef();
+        this.pointsRef = injectNgtRef();
+        injectBeforeRender(this.onBeforeRender.bind(this));
+    }
+    onBeforeRender({ clock }) {
+        if (!this.materialRef.nativeElement)
+            return;
+        this.materialRef.nativeElement.uniforms['time'].value = clock.elapsedTime;
+    }
+    getAttribute$(key, options) {
+        options ?? (options = {});
+        if (!options.keyValue) {
+            options.keyValue = (value) => value;
+        }
+        if (!options.countValue) {
+            options.countValue = (_, count) => count;
+        }
+        return this.select(key).pipe(startWith(this.get(key) || undefined), withLatestFrom(this.select('count')), map(([value, count]) => usePropAsIsOrAsAttribute(options.countValue(value, count), options.keyValue(value, count), options?.setDefault)));
+    }
+}
+NgtsSparkles.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsSparkles, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NgtsSparkles.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: NgtsSparkles, isStandalone: true, selector: "ngts-sparkles", inputs: { pointsRef: "pointsRef", count: "count", speed: "speed", opacity: "opacity", color: "color", size: "size", scale: "scale", noise: "noise" }, usesInheritance: true, ngImport: i0, template: `
+        <ngt-points ngtCompount [ref]="pointsRef">
+            <ngt-buffer-geometry>
+                <ngt-buffer-attribute *args="[get('positions'), 3]" attach="attributes.position" />
+                <ngt-buffer-attribute *args="[get('sizes'), 1]" attach="attributes.size" />
+                <ngt-buffer-attribute *args="[get('opacities'), 1]" attach="attributes.opacity" />
+                <ngt-buffer-attribute *args="[get('speeds'), 1]" attach="attributes.speed" />
+                <ngt-buffer-attribute *args="[get('colors'), 3]" attach="attributes.color" />
+                <ngt-buffer-attribute *args="[get('noises'), 3]" attach="attributes.noise" />
+            </ngt-buffer-geometry>
+            <ngt-sparkles-material [ref]="materialRef" [transparent]="true" [depthWrite]="false" [pixelRatio]="dpr" />
+        </ngt-points>
+    `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "[args]", inputs: ["args"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsSparkles, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngts-sparkles',
+                    standalone: true,
+                    template: `
+        <ngt-points ngtCompount [ref]="pointsRef">
+            <ngt-buffer-geometry>
+                <ngt-buffer-attribute *args="[get('positions'), 3]" attach="attributes.position" />
+                <ngt-buffer-attribute *args="[get('sizes'), 1]" attach="attributes.size" />
+                <ngt-buffer-attribute *args="[get('opacities'), 1]" attach="attributes.opacity" />
+                <ngt-buffer-attribute *args="[get('speeds'), 1]" attach="attributes.speed" />
+                <ngt-buffer-attribute *args="[get('colors'), 3]" attach="attributes.color" />
+                <ngt-buffer-attribute *args="[get('noises'), 3]" attach="attributes.noise" />
+            </ngt-buffer-geometry>
+            <ngt-sparkles-material [ref]="materialRef" [transparent]="true" [depthWrite]="false" [pixelRatio]="dpr" />
+        </ngt-points>
+    `,
+                    imports: [NgtArgs],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: function () { return []; }, propDecorators: { pointsRef: [{
+                type: Input
+            }], count: [{
+                type: Input
+            }], speed: [{
+                type: Input
+            }], opacity: [{
+                type: Input
+            }], color: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], scale: [{
+                type: Input
+            }], noise: [{
+                type: Input
+            }] } });
+
+const presets = {
+    rembrandt: {
+        main: [1, 2, 1],
+        fill: [-2, -0.5, -2],
+    },
+    portrait: {
+        main: [-1, 2, 0.5],
+        fill: [-1, 0.5, -1.5],
+    },
+    upfront: {
+        main: [0, 2, 1],
+        fill: [-1, 0.5, -1.5],
+    },
+    soft: {
+        main: [-2, 4, 4],
+        fill: [-1, 0.5, -1.5],
+    },
+};
+class NgtsStageRefit {
+    constructor() {
+        this.boundsApi = inject(NGTS_BOUNDS_API);
+        this.radius = 0;
+        this.adjustCamera = true;
+    }
+    ngOnChanges() {
+        if (this.adjustCamera) {
+            this.boundsApi.refresh().clip().fit();
+        }
+    }
+}
+NgtsStageRefit.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsStageRefit, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+NgtsStageRefit.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.3", type: NgtsStageRefit, isStandalone: true, selector: "ngts-stage-refit", inputs: { radius: "radius", adjustCamera: "adjustCamera" }, usesOnChanges: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsStageRefit, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'ngts-stage-refit',
+                    standalone: true,
+                }]
+        }], propDecorators: { radius: [{
+                type: Input
+            }], adjustCamera: [{
+                type: Input
+            }] } });
+extend({ AmbientLight, SpotLight, Vector2, PointLight, Group });
+class NgtsStage extends NgtRxStore {
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
+        this.Number = Number;
+        this.centered = new EventEmitter();
+    }
+    set preset(preset) {
+        this.set({ preset });
+    }
+    set shadows(shadows) {
+        this.set({ shadows });
+    }
+    set adjustCamera(adjustCamera) {
+        this.set({ adjustCamera });
+    }
+    set environment(environment) {
+        this.set({ environment });
+    }
+    set intensity(intensity) {
+        this.set({ intensity });
+    }
+    set center(center) {
+        this.set({ center });
+    }
+    initialize() {
+        super.initialize();
+        this.set({
+            adjustCamera: true,
+            intensity: 0.5,
+            shadows: 'contact',
+            environment: 'city',
+            preset: 'rembrandt',
+            radius: 0,
+            width: 0,
+            height: 0,
+            depth: 0,
+        });
+        this.connect('config', this.select('preset').pipe(map((preset) => (typeof preset === 'string' ? presets[preset] : preset))));
+        this.connect('shadowsInfo', this.select('shadows').pipe(map((shadows) => {
+            return {
+                contactShadow: shadows === 'contact' || shadows?.type === 'contact',
+                accumulativeShadow: shadows === 'accumulative' || shadows?.type === 'accumulative',
+                shadowBias: shadows?.bias ?? -0.0001,
+                normalBias: shadows?.normalBias ?? 0,
+                shadowSize: shadows?.size ?? 1024,
+                shadowOffset: shadows?.offset ?? 0,
+                ...(typeof shadows === 'string' ? {} : shadows || {}),
+            };
+        })));
+        this.connect('spotLightPosition', this.select(['config', 'radius'], ({ config, radius }) => [
+            config.main[0] * radius,
+            config.main[1] * radius,
+            config.main[2] * radius,
+        ]));
+        this.connect('pointLightPosition', this.select(['config', 'radius'], ({ config, radius }) => [
+            config.fill[0] * radius,
+            config.fill[1] * radius,
+            config.fill[2] * radius,
+        ]));
+        this.connect('environmentInfo', this.select('environment').pipe(map((environment) => {
+            if (!environment)
+                return null;
+            if (typeof environment === 'string')
+                return { preset: environment };
+            return environment;
+        })));
+    }
+    onCentered(props) {
+        const { boundingSphere, width, height, depth } = props;
+        this.set({ radius: boundingSphere.radius, width, height, depth });
+        this.cdr.detectChanges();
+        if (this.centered.observed)
+            this.centered.emit(props);
+    }
+}
+NgtsStage.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsStage, deps: null, target: i0.ɵɵFactoryTarget.Component });
+NgtsStage.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: NgtsStage, isStandalone: true, selector: "ngts-stage", inputs: { preset: "preset", shadows: "shadows", adjustCamera: "adjustCamera", environment: "environment", intensity: "intensity", center: "center" }, outputs: { centered: "centered" }, usesInheritance: true, ngImport: i0, template: `
+        <ngt-ambient-light [intensity]="get('intensity')! / 3" />
+        <ngt-spot-light
+            [penumbra]="1"
+            [position]="get('spotLightPosition')"
+            [intensity]="get('intensity')! * 2"
+            [castShadow]="!!get('shadows')"
+        >
+            <ngt-value [rawValue]="get('shadowsInfo').shadowBias" attach="shadow.bias" />
+            <ngt-value [rawValue]="get('shadowsInfo').normalBias" attach="shadow.normalBias" />
+            <ngt-vector2
+                *args="[get('shadowsInfo').shadowSize, get('shadowsInfo').shadowSize]"
+                attach="shadow.mapSize"
+            />
+        </ngt-spot-light>
+        <ngt-point-light [position]="get('pointLightPosition')" [intensity]="get('intensity')" />
+
+        <ngts-bounds
+            [fit]="!!get('adjustCamera')"
+            [clip]="!!get('adjustCamera')"
+            [margin]="Number(get('adjustCamera'))"
+            [observe]="true"
+        >
+            <ngts-stage-refit [radius]="get('radius')" [adjustCamera]="!!get('adjustCamera')" />
+            <ngts-center
+                [position]="[0, get('shadowsInfo').shadowOffset / 2, 0]"
+                [top]="!!get('center')?.top"
+                [right]="!!get('center')?.right"
+                [bottom]="!!get('center')?.bottom"
+                [left]="!!get('center')?.left"
+                [front]="!!get('center')?.front"
+                [back]="!!get('center')?.back"
+                [disableX]="!!get('center')?.disableX"
+                [disableY]="!!get('center')?.disableY"
+                [disableZ]="!!get('center')?.disableZ"
+                [precise]="!!get('center')?.precise"
+                (centered)="onCentered($event)"
+            >
+                <ng-content />
+            </ngts-center>
+        </ngts-bounds>
+        <ngt-group [position]="[0, -get('height') / 2 - get('shadowsInfo').shadowOffset / 2, 0]">
+            <ngts-contact-shadows
+                *ngIf="get('shadowsInfo').contactShadow"
+                [scale]="get('radius') * 4"
+                [far]="get('radius')"
+                [blur]="2"
+                [opacity]="get('shadowsInfo').opacity"
+                [width]="get('shadowsInfo').width"
+                [height]="get('shadowsInfo').height"
+                [smooth]="get('shadowsInfo').smooth"
+                [resolution]="get('shadowsInfo').resolution"
+                [frames]="get('shadowsInfo').frames"
+                [scale]="get('shadowsInfo').scale"
+                [color]="get('shadowsInfo').color"
+                [depthWrite]="get('shadowsInfo').depthWrite"
+                [renderOrder]="get('shadowsInfo').renderOrder"
+            />
+            <ngts-accumulative-shadows
+                *ngIf="get('shadowsInfo').accumulativeShadow"
+                [temporal]="true"
+                [frames]="100"
+                [alphaTest]="0.9"
+                [toneMapped]="true"
+                [scale]="get('radius') * 4"
+                [opacity]="get('shadowsInfo').opacity"
+                [alphaTest]="get('shadowsInfo').alphaTest"
+                [color]="get('shadowsInfo').color"
+                [colorBlend]="get('shadowsInfo').colorBlend"
+                [resolution]="get('shadowsInfo').resolution"
+            >
+                <ngts-randomized-lights
+                    [amount]="get('shadowsInfo').amount ?? 8"
+                    [radius]="get('shadowsInfo').radius ?? get('radius')"
+                    [ambient]="get('shadowsInfo').ambient ?? 0.5"
+                    [intensity]="get('shadowsInfo').intensity ?? 1"
+                    [position]="get('spotLightPosition')"
+                    [size]="get('radius') * 4"
+                    [bias]="-get('shadowsInfo').shadowBias"
+                    [mapSize]="get('shadowsInfo').shadowSize"
+                />
+            </ngts-accumulative-shadows>
+        </ngt-group>
+        <ngts-environment
+            *ngIf="get('environmentInfo')"
+            [frames]="get('environmentInfo').frames"
+            [near]="get('environmentInfo').near"
+            [far]="get('environmentInfo').far"
+            [resolution]="get('environmentInfo').resolution"
+            [background]="get('environmentInfo').background"
+            [blur]="get('environmentInfo').blur"
+            [map]="get('environmentInfo').map"
+            [files]="get('environmentInfo').files"
+            [path]="get('environmentInfo').path"
+            [preset]="get('environmentInfo').preset"
+            [scene]="get('environmentInfo').scene"
+            [extensions]="get('environmentInfo').extensions"
+            [ground]="get('environmentInfo').ground"
+            [encoding]="get('environmentInfo').encoding"
+        />
+    `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "[args]", inputs: ["args"] }, { kind: "component", type: NgtsBounds, selector: "ngts-bounds", inputs: ["boundsRef", "damping", "fit", "clip", "observe", "margin", "eps"], outputs: ["fitted"] }, { kind: "directive", type: NgtsStageRefit, selector: "ngts-stage-refit", inputs: ["radius", "adjustCamera"] }, { kind: "component", type: NgtsCenter, selector: "ngts-center", inputs: ["centerRef", "top", "right", "bottom", "left", "front", "back", "disableX", "disableY", "disableZ", "disabled", "precise"], outputs: ["centered"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: NgtsContactShadows, selector: "ngts-contact-shadows", inputs: ["contactShadowsRef", "opacity", "width", "height", "blur", "far", "smooth", "resolution", "frames", "scale", "color", "depthWrite", "renderOrder"] }, { kind: "component", type: NgtsAccumulativeShadows, selector: "ngts-accumulative-shadows", inputs: ["frames", "blend", "limit", "scale", "temporal", "opacity", "alphaTest", "color", "colorBlend", "resolution", "toneMapped"] }, { kind: "component", type: NgtsRandomizedLights, selector: "ngts-randomized-lights", inputs: ["lightsRef", "frames", "position", "radius", "amount", "intensity", "ambient", "castShadow", "bias", "mapSize", "size", "near", "far"] }, { kind: "component", type: NgtsEnvironment, selector: "ngts-environment" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsStage, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngts-stage',
+                    standalone: true,
+                    template: `
+        <ngt-ambient-light [intensity]="get('intensity')! / 3" />
+        <ngt-spot-light
+            [penumbra]="1"
+            [position]="get('spotLightPosition')"
+            [intensity]="get('intensity')! * 2"
+            [castShadow]="!!get('shadows')"
+        >
+            <ngt-value [rawValue]="get('shadowsInfo').shadowBias" attach="shadow.bias" />
+            <ngt-value [rawValue]="get('shadowsInfo').normalBias" attach="shadow.normalBias" />
+            <ngt-vector2
+                *args="[get('shadowsInfo').shadowSize, get('shadowsInfo').shadowSize]"
+                attach="shadow.mapSize"
+            />
+        </ngt-spot-light>
+        <ngt-point-light [position]="get('pointLightPosition')" [intensity]="get('intensity')" />
+
+        <ngts-bounds
+            [fit]="!!get('adjustCamera')"
+            [clip]="!!get('adjustCamera')"
+            [margin]="Number(get('adjustCamera'))"
+            [observe]="true"
+        >
+            <ngts-stage-refit [radius]="get('radius')" [adjustCamera]="!!get('adjustCamera')" />
+            <ngts-center
+                [position]="[0, get('shadowsInfo').shadowOffset / 2, 0]"
+                [top]="!!get('center')?.top"
+                [right]="!!get('center')?.right"
+                [bottom]="!!get('center')?.bottom"
+                [left]="!!get('center')?.left"
+                [front]="!!get('center')?.front"
+                [back]="!!get('center')?.back"
+                [disableX]="!!get('center')?.disableX"
+                [disableY]="!!get('center')?.disableY"
+                [disableZ]="!!get('center')?.disableZ"
+                [precise]="!!get('center')?.precise"
+                (centered)="onCentered($event)"
+            >
+                <ng-content />
+            </ngts-center>
+        </ngts-bounds>
+        <ngt-group [position]="[0, -get('height') / 2 - get('shadowsInfo').shadowOffset / 2, 0]">
+            <ngts-contact-shadows
+                *ngIf="get('shadowsInfo').contactShadow"
+                [scale]="get('radius') * 4"
+                [far]="get('radius')"
+                [blur]="2"
+                [opacity]="get('shadowsInfo').opacity"
+                [width]="get('shadowsInfo').width"
+                [height]="get('shadowsInfo').height"
+                [smooth]="get('shadowsInfo').smooth"
+                [resolution]="get('shadowsInfo').resolution"
+                [frames]="get('shadowsInfo').frames"
+                [scale]="get('shadowsInfo').scale"
+                [color]="get('shadowsInfo').color"
+                [depthWrite]="get('shadowsInfo').depthWrite"
+                [renderOrder]="get('shadowsInfo').renderOrder"
+            />
+            <ngts-accumulative-shadows
+                *ngIf="get('shadowsInfo').accumulativeShadow"
+                [temporal]="true"
+                [frames]="100"
+                [alphaTest]="0.9"
+                [toneMapped]="true"
+                [scale]="get('radius') * 4"
+                [opacity]="get('shadowsInfo').opacity"
+                [alphaTest]="get('shadowsInfo').alphaTest"
+                [color]="get('shadowsInfo').color"
+                [colorBlend]="get('shadowsInfo').colorBlend"
+                [resolution]="get('shadowsInfo').resolution"
+            >
+                <ngts-randomized-lights
+                    [amount]="get('shadowsInfo').amount ?? 8"
+                    [radius]="get('shadowsInfo').radius ?? get('radius')"
+                    [ambient]="get('shadowsInfo').ambient ?? 0.5"
+                    [intensity]="get('shadowsInfo').intensity ?? 1"
+                    [position]="get('spotLightPosition')"
+                    [size]="get('radius') * 4"
+                    [bias]="-get('shadowsInfo').shadowBias"
+                    [mapSize]="get('shadowsInfo').shadowSize"
+                />
+            </ngts-accumulative-shadows>
+        </ngt-group>
+        <ngts-environment
+            *ngIf="get('environmentInfo')"
+            [frames]="get('environmentInfo').frames"
+            [near]="get('environmentInfo').near"
+            [far]="get('environmentInfo').far"
+            [resolution]="get('environmentInfo').resolution"
+            [background]="get('environmentInfo').background"
+            [blur]="get('environmentInfo').blur"
+            [map]="get('environmentInfo').map"
+            [files]="get('environmentInfo').files"
+            [path]="get('environmentInfo').path"
+            [preset]="get('environmentInfo').preset"
+            [scene]="get('environmentInfo').scene"
+            [extensions]="get('environmentInfo').extensions"
+            [ground]="get('environmentInfo').ground"
+            [encoding]="get('environmentInfo').encoding"
+        />
+    `,
+                    imports: [
+                        NgtArgs,
+                        NgtsBounds,
+                        NgtsStageRefit,
+                        NgtsCenter,
+                        NgIf,
+                        NgtsContactShadows,
+                        NgtsAccumulativeShadows,
+                        NgtsRandomizedLights,
+                        NgtsEnvironment,
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], propDecorators: { preset: [{
+                type: Input
+            }], shadows: [{
+                type: Input
+            }], adjustCamera: [{
+                type: Input
+            }], environment: [{
+                type: Input
+            }], intensity: [{
+                type: Input
+            }], center: [{
+                type: Input
+            }], centered: [{
+                type: Output
+            }] } });
+
+const StarFieldMaterial = shaderMaterial({
+    time: 0.0,
+    fade: 0.0,
+}, 
+// language=GLSL
+`
+uniform float time;
+attribute float size;
+varying vec3 vColor;
+void main() {
+  vColor = color;
+  vec4 mvPosition = modelViewMatrix * vec4(position, 0.5);
+  gl_PointSize = size * (30.0 / -mvPosition.z) * (3.0 + sin(time + 100.0));
+  gl_Position = projectionMatrix * mvPosition;
+}
+  `, 
+// language=GLSL
+`
+uniform sampler2D pointTexture;
+uniform float fade;
+varying vec3 vColor;
+void main() {
+  float opacity = 1.0;
+  if (fade == 1.0) {
+    float d = distance(gl_PointCoord, vec2(0.5, 0.5));
+    opacity = 1.0 / (1.0 + exp(16.0 * (d - 0.25)));
+  }
+  gl_FragColor = vec4(vColor, opacity);
+
+  #include <tonemapping_fragment>
+  #include <encodings_fragment>
+}
+  `);
+extend({ Points, BufferGeometry, BufferAttribute });
+const genStar = (r) => {
+    return new Vector3().setFromSpherical(new Spherical(r, Math.acos(1 - Math.random() * 2), Math.random() * 2 * Math.PI));
+};
+class NgtsStars extends NgtRxStore {
+    set radius(radius) {
+        this.set({ radius });
+    }
+    set depth(depth) {
+        this.set({ depth });
+    }
+    set count(count) {
+        this.set({ count });
+    }
+    set factor(factor) {
+        this.set({ factor });
+    }
+    set saturation(saturation) {
+        this.set({ saturation });
+    }
+    set fade(fade) {
+        this.set({ fade });
+    }
+    set speed(speed) {
+        this.set({ speed });
+    }
+    initialize() {
+        super.initialize();
+        this.set({
+            radius: 100,
+            depth: 50,
+            count: 5000,
+            saturation: 0,
+            factor: 4,
+            fade: false,
+            speed: 1,
+        });
+        this.connect('bufferAttributes', this.select(['count', 'depth', 'factor', 'radius', 'saturation'], ({ count, depth, factor, radius, saturation }) => {
+            const positions = [];
+            const colors = [];
+            const sizes = Array.from({ length: count }, () => (0.5 + 0.5 * Math.random()) * factor);
+            const color = new Color();
+            let r = radius + depth;
+            const increment = depth / count;
+            for (let i = 0; i < count; i++) {
+                r -= increment * Math.random();
+                positions.push(...genStar(r).toArray());
+                color.setHSL(i / count, saturation, 0.9);
+                colors.push(color.r, color.g, color.b);
+            }
+            return {
+                positions: new Float32Array(positions),
+                colors: new Float32Array(colors),
+                sizes: new Float32Array(sizes),
+            };
+        }));
+    }
+    constructor() {
+        super();
+        this.AdditiveBlending = AdditiveBlending;
+        this.material = new StarFieldMaterial();
+        this.starsRef = injectNgtRef();
+        injectBeforeRender(this.onBeforeRender.bind(this));
+    }
+    onBeforeRender({ clock }) {
+        this.material.uniforms['time'].value = clock.getElapsedTime() * this.get('speed');
+    }
+}
+NgtsStars.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsStars, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NgtsStars.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: NgtsStars, isStandalone: true, selector: "ngts-stars", inputs: { starsRef: "starsRef", radius: "radius", depth: "depth", count: "count", factor: "factor", saturation: "saturation", fade: "fade", speed: "speed" }, usesInheritance: true, ngImport: i0, template: `
+        <ngt-points [ref]="starsRef">
+            <ngt-buffer-geometry>
+                <ngt-buffer-attribute attach="attributes.position" *args="[get('bufferAttributes').positions, 3]" />
+                <ngt-buffer-attribute attach="attributes.color" *args="[get('bufferAttributes').colors, 3]" />
+                <ngt-buffer-attribute attach="attributes.size" *args="[get('bufferAttributes').sizes, 1]" />
+            </ngt-buffer-geometry>
+            <ngt-primitive
+                *args="[material]"
+                attach="material"
+                [blending]="AdditiveBlending"
+                [depthWrite]="false"
+                [transparent]="true"
+                [vertexColors]="true"
+            >
+                <ngt-value attach="uniforms.fade.value" [rawValue]="get('fade')" />
+            </ngt-primitive>
+        </ngt-points>
+    `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "[args]", inputs: ["args"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsStars, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngts-stars',
+                    standalone: true,
+                    template: `
+        <ngt-points [ref]="starsRef">
+            <ngt-buffer-geometry>
+                <ngt-buffer-attribute attach="attributes.position" *args="[get('bufferAttributes').positions, 3]" />
+                <ngt-buffer-attribute attach="attributes.color" *args="[get('bufferAttributes').colors, 3]" />
+                <ngt-buffer-attribute attach="attributes.size" *args="[get('bufferAttributes').sizes, 1]" />
+            </ngt-buffer-geometry>
+            <ngt-primitive
+                *args="[material]"
+                attach="material"
+                [blending]="AdditiveBlending"
+                [depthWrite]="false"
+                [transparent]="true"
+                [vertexColors]="true"
+            >
+                <ngt-value attach="uniforms.fade.value" [rawValue]="get('fade')" />
+            </ngt-primitive>
+        </ngt-points>
+    `,
+                    imports: [NgtArgs],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: function () { return []; }, propDecorators: { starsRef: [{
+                type: Input
+            }], radius: [{
+                type: Input
+            }], depth: [{
+                type: Input
+            }], count: [{
+                type: Input
+            }], factor: [{
+                type: Input
+            }], saturation: [{
+                type: Input
+            }], fade: [{
+                type: Input
+            }], speed: [{
+                type: Input
+            }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { NGTS_BOUNDS_API, NgtsAccumulativeShadows, NgtsBounds, NgtsCenter, NgtsContactShadows, NgtsEnvironment, NgtsEnvironmentContent, NgtsFloat, NgtsRandomizedLights, NgtsSky, NgtsSparkles, NgtsStage, NgtsStageRefit, NgtsStars, calcPosFromAngles, ngtsEnvironmentPresetsObj };
+//# sourceMappingURL=angular-three-soba-staging.mjs.map