angular-three-postprocessing 2.0.0-beta.235 → 2.0.0-beta.236

package/fesm2022/angular-three-postprocessing.mjs

@@ -1,12 +1,13 @@
 import * as i0 from '@angular/core';
 import { inject, Component, CUSTOM_ELEMENTS_SCHEMA, ChangeDetectionStrategy, input, Directive, Injector, computed, viewChild, ViewContainerRef, contentChild, TemplateRef, afterNextRender } from '@angular/core';
-import { injectNgtRef, injectNgtStore, extend, injectBeforeRender, getLocalState, NgtArgs } from 'angular-three';
+import { injectNgtRef, injectNgtStore, extend, createApiToken, injectBeforeRender, getLocalState, NgtArgs, is } from 'angular-three';
 import { injectAutoEffect } from 'ngxtension/auto-effect';
 import { createNoopInjectionToken } from 'ngxtension/create-injection-token';
 import { mergeInputs } from 'ngxtension/inject-inputs';
-import { EffectAttribute, EffectComposer, RenderPass, NormalPass, DepthDownsamplingPass, Effect, EffectPass, Pass, BloomEffect, BlendFunction } from 'postprocessing';
-import { Group, HalfFloatType, NoToneMapping } from 'three';
+import { EffectAttribute, EffectComposer, RenderPass, NormalPass, DepthDownsamplingPass, Effect, EffectPass, Pass, BloomEffect, BlendFunction, BrightnessContrastEffect, ChromaticAberrationEffect, ColorAverageEffect, ColorDepthEffect, DepthEffect, DepthOfFieldEffect, MaskFunction, DotScreenEffect, FXAAEffect, GlitchEffect, GlitchMode, GodRaysEffect, GridEffect, HueSaturationEffect, LUT3DEffect, NoiseEffect, PixelationEffect, ScanlineEffect, SepiaEffect, ShockWaveEffect, SMAAEffect, TiltShiftEffect, VignetteEffect } from 'postprocessing';
+import { Group, HalfFloatType, NoToneMapping, Uniform, Texture, Color, CanvasTexture, RepeatWrapping, NearestFilter, Vector3, Vector2, Mesh } from 'three';
 import { isWebGL2Available } from 'three-stdlib';
+import { easing } from 'maath';
 
 const [injectDefaultEffectOptions, provideDefaultEffectOptions] = createNoopInjectionToken('Default Effect options');
 class NgtpEffectBlendMode {
@@ -57,7 +58,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImpor
 const NgtpEffectHostDirective = { directive: NgtpEffect, inputs: ['blendFunction', 'opacity', 'effectRef'] };
 
 extend({ Group });
-const defaultOptions = {
+const [injectEffectComposerApi, provideEffectComposerApi] = createApiToken(() => NgtpEffectComposer);
+const defaultOptions$3 = {
     enabled: true,
     renderPriority: 1,
     autoClear: true,
@@ -77,7 +79,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImpor
         }] });
 class NgtpEffectComposer {
     constructor() {
-        this.options = input(defaultOptions, { transform: mergeInputs(defaultOptions) });
+        this.options = input(defaultOptions$3, { transform: mergeInputs(defaultOptions$3) });
         this.injector = inject(Injector);
         this.autoEffect = injectAutoEffect();
         this.store = injectNgtStore();
@@ -133,6 +135,15 @@ class NgtpEffectComposer {
             }
             return { composer, normalPass, downSamplingPass };
         });
+        this.api = computed(() => {
+            const [{ composer, normalPass, downSamplingPass }, camera, scene, resolutionScale] = [
+                this.composerData(),
+                this.camera(),
+                this.scene(),
+                this.resolutionScale(),
+            ];
+            return { composer, camera, scene, normalPass, downSamplingPass, resolutionScale };
+        });
         afterNextRender(() => {
             this.disableToneMapping();
             this.setComposerSize();
@@ -233,7 +244,7 @@ class NgtpEffectComposer {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpEffectComposer, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.0.3", type: NgtpEffectComposer, isStandalone: true, selector: "ngtp-effect-composer", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "content", first: true, predicate: NgtpEffects, descendants: true, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "group", first: true, predicate: ["group"], descendants: true, isSignal: true }, { propertyName: "groupAnchor", first: true, predicate: ["group"], descendants: true, read: ViewContainerRef, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.0.3", type: NgtpEffectComposer, isStandalone: true, selector: "ngtp-effect-composer", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideEffectComposerApi()], queries: [{ propertyName: "content", first: true, predicate: NgtpEffects, descendants: true, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "group", first: true, predicate: ["group"], descendants: true, isSignal: true }, { propertyName: "groupAnchor", first: true, predicate: ["group"], descendants: true, read: ViewContainerRef, isSignal: true }], ngImport: i0, template: `
 		<ngt-group #group ngtCompound></ngt-group>
 	`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
@@ -245,11 +256,127 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImpor
                     template: `
 		<ngt-group #group ngtCompound></ngt-group>
 	`,
+                    providers: [provideEffectComposerApi()],
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                     changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
         }], ctorParameters: () => [] });
 
+const fragment = `
+uniform sampler2D uCharacters;
+uniform float uCharactersCount;
+uniform float uCellSize;
+uniform bool uInvert;
+uniform vec3 uColor;
+
+const vec2 SIZE = vec2(16.);
+
+vec3 greyscale(vec3 color, float strength) {
+    float g = dot(color, vec3(0.299, 0.587, 0.114));
+    return mix(color, vec3(g), strength);
+}
+
+vec3 greyscale(vec3 color) {
+    return greyscale(color, 1.0);
+}
+
+void mainImage(const in vec4 inputColor, const in vec2 uv, out vec4 outputColor) {
+    vec2 cell = resolution / uCellSize;
+    vec2 grid = 1.0 / cell;
+    vec2 pixelizedUV = grid * (0.5 + floor(uv / grid));
+    vec4 pixelized = texture2D(inputBuffer, pixelizedUV);
+    float greyscaled = greyscale(pixelized.rgb).r;
+
+    if (uInvert) {
+        greyscaled = 1.0 - greyscaled;
+    }
+
+    float characterIndex = floor((uCharactersCount - 1.0) * greyscaled);
+    vec2 characterPosition = vec2(mod(characterIndex, SIZE.x), floor(characterIndex / SIZE.y));
+    vec2 offset = vec2(characterPosition.x, -characterPosition.y) / SIZE;
+    vec2 charUV = mod(uv * (cell / SIZE), 1.0 / SIZE) - vec2(0., 1.0 / SIZE) + offset;
+    vec4 asciiCharacter = texture2D(uCharacters, charUV);
+
+    asciiCharacter.rgb = uColor * asciiCharacter.r;
+    asciiCharacter.a = pixelized.a;
+    outputColor = asciiCharacter;
+}
+`;
+class ASCIIEffect extends Effect {
+    constructor({ font = 'arial', characters = ` .:,'-^=*+?!|0#X%WM@`, fontSize = 54, cellSize = 16, color = '#ffffff', invert = false, } = {}) {
+        const uniforms = new Map([
+            ['uCharacters', new Uniform(new Texture())],
+            ['uCellSize', new Uniform(cellSize)],
+            ['uCharactersCount', new Uniform(characters.length)],
+            ['uColor', new Uniform(new Color(color))],
+            ['uInvert', new Uniform(invert)],
+        ]);
+        super('ASCIIEffect', fragment, { uniforms });
+        const charactersTextureUniform = this.uniforms.get('uCharacters');
+        if (charactersTextureUniform) {
+            charactersTextureUniform.value = this.createCharactersTexture(characters, font, fontSize);
+        }
+    }
+    /** Draws the characters on a Canvas and returns a texture */
+    createCharactersTexture(characters, font, fontSize) {
+        const canvas = document.createElement('canvas');
+        const SIZE = 1024;
+        const MAX_PER_ROW = 16;
+        const CELL = SIZE / MAX_PER_ROW;
+        canvas.width = canvas.height = SIZE;
+        const texture = new CanvasTexture(canvas, undefined, RepeatWrapping, RepeatWrapping, NearestFilter, NearestFilter);
+        const context = canvas.getContext('2d');
+        if (!context) {
+            throw new Error('Context not available');
+        }
+        context.clearRect(0, 0, SIZE, SIZE);
+        context.font = `${fontSize}px ${font}`;
+        context.textAlign = 'center';
+        context.textBaseline = 'middle';
+        context.fillStyle = '#fff';
+        for (let i = 0; i < characters.length; i++) {
+            const char = characters[i];
+            const x = i % MAX_PER_ROW;
+            const y = Math.floor(i / MAX_PER_ROW);
+            context.fillText(char, x * CELL + CELL / 2, y * CELL + CELL / 2);
+        }
+        texture.needsUpdate = true;
+        return texture;
+    }
+}
+const defaultOptions$2 = {
+    font: 'arial',
+    characters: ` .:,'-^=*+?!|0#X%WM@`,
+    fontSize: 54,
+    cellSize: 16,
+    color: '#ffffff',
+    invert: false,
+};
+class NgtpASCII {
+    constructor() {
+        this.effectRef = input(injectNgtRef());
+        this.options = input(defaultOptions$2, { transform: mergeInputs(defaultOptions$2) });
+        this.effect = computed(() => new ASCIIEffect(this.options()));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpASCII, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpASCII, isStandalone: true, selector: "ngtp-ascii", inputs: { effectRef: { classPropertyName: "effectRef", publicName: "effectRef", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+		<ngt-primitive *args="[effect()]" [ref]="effectRef()" ngtCompound />
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpASCII, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-ascii',
+                    standalone: true,
+                    template: `
+		<ngt-primitive *args="[effect()]" [ref]="effectRef()" ngtCompound />
+	`,
+                    imports: [NgtArgs],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }] });
+
 extend({ BloomEffect });
 class NgtpBloom {
     constructor() {
@@ -283,9 +410,1137 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImpor
                 }]
         }] });
 
+extend({ BrightnessContrastEffect });
+class NgtpBrightnessContrast {
+    constructor() {
+        this.effect = inject(NgtpEffect, { host: true });
+        this.options = input({});
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpBrightnessContrast, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpBrightnessContrast, isStandalone: true, selector: "ngtp-brightness-contrast", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: NgtpEffect, inputs: ["blendFunction", "blendFunction", "opacity", "opacity", "effectRef", "effectRef"] }], ngImport: i0, template: `
+		<ngt-brightness-contrast-effect
+			*args="[options()]"
+			[camera]="effect.camera()"
+			[ref]="effect.effectRef()"
+			ngtCompound
+		>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-brightness-contrast-effect>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }, { kind: "component", type: NgtpEffectBlendMode, selector: "ngtp-effect-blend-mode" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpBrightnessContrast, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-brightness-contrast',
+                    standalone: true,
+                    template: `
+		<ngt-brightness-contrast-effect
+			*args="[options()]"
+			[camera]="effect.camera()"
+			[ref]="effect.effectRef()"
+			ngtCompound
+		>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-brightness-contrast-effect>
+	`,
+                    imports: [NgtArgs, NgtpEffectBlendMode],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    hostDirectives: [NgtpEffectHostDirective],
+                }]
+        }] });
+
+extend({ ChromaticAberrationEffect });
+class NgtpChromaticAberration {
+    constructor() {
+        this.effect = inject(NgtpEffect, { host: true });
+        this.options = input({});
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpChromaticAberration, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpChromaticAberration, isStandalone: true, selector: "ngtp-chromatic-aberration", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: NgtpEffect, inputs: ["blendFunction", "blendFunction", "opacity", "opacity", "effectRef", "effectRef"] }], ngImport: i0, template: `
+		<ngt-chromatic-aberration-effect
+			*args="[options()]"
+			[camera]="effect.camera()"
+			[ref]="effect.effectRef()"
+			ngtCompound
+		>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-chromatic-aberration-effect>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }, { kind: "component", type: NgtpEffectBlendMode, selector: "ngtp-effect-blend-mode" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpChromaticAberration, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-chromatic-aberration',
+                    template: `
+		<ngt-chromatic-aberration-effect
+			*args="[options()]"
+			[camera]="effect.camera()"
+			[ref]="effect.effectRef()"
+			ngtCompound
+		>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-chromatic-aberration-effect>
+	`,
+                    standalone: true,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgtArgs, NgtpEffectBlendMode],
+                    hostDirectives: [NgtpEffectHostDirective],
+                }]
+        }] });
+
+extend({ ColorAverageEffect });
+class NgtpColorAverage {
+    constructor() {
+        this.effectRef = input(injectNgtRef());
+        this.options = input({ blendFunction: BlendFunction.NORMAL }, { transform: mergeInputs({ blendFunction: BlendFunction.NORMAL }) });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpColorAverage, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpColorAverage, isStandalone: true, selector: "ngtp-color-average", inputs: { effectRef: { classPropertyName: "effectRef", publicName: "effectRef", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+		<ngt-color-average-effect *args="[options().blendFunction]" [ref]="effectRef()" ngtCompound>
+			<ng-content />
+		</ngt-color-average-effect>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpColorAverage, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-color-average',
+                    standalone: true,
+                    template: `
+		<ngt-color-average-effect *args="[options().blendFunction]" [ref]="effectRef()" ngtCompound>
+			<ng-content />
+		</ngt-color-average-effect>
+	`,
+                    imports: [NgtArgs],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }] });
+
+extend({ ColorDepthEffect });
+class NgtpColorDepth {
+    constructor() {
+        this.effect = inject(NgtpEffect, { host: true });
+        this.options = input({});
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpColorDepth, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpColorDepth, isStandalone: true, selector: "ngtp-color-depth", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: NgtpEffect, inputs: ["blendFunction", "blendFunction", "opacity", "opacity", "effectRef", "effectRef"] }], ngImport: i0, template: `
+		<ngt-color-depth-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-color-depth-effect>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }, { kind: "component", type: NgtpEffectBlendMode, selector: "ngtp-effect-blend-mode" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpColorDepth, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-color-depth',
+                    template: `
+		<ngt-color-depth-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-color-depth-effect>
+	`,
+                    standalone: true,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgtArgs, NgtpEffectBlendMode],
+                    hostDirectives: [NgtpEffectHostDirective],
+                }]
+        }] });
+
+extend({ DepthEffect });
+class NgtpDepth {
+    constructor() {
+        this.effect = inject(NgtpEffect, { host: true });
+        this.options = input({});
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpDepth, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpDepth, isStandalone: true, selector: "ngtp-depth", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: NgtpEffect, inputs: ["blendFunction", "blendFunction", "opacity", "opacity", "effectRef", "effectRef"] }], ngImport: i0, template: `
+		<ngt-depth-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-depth-effect>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }, { kind: "component", type: NgtpEffectBlendMode, selector: "ngtp-effect-blend-mode" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpDepth, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-depth',
+                    template: `
+		<ngt-depth-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-depth-effect>
+	`,
+                    standalone: true,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgtArgs, NgtpEffectBlendMode],
+                    hostDirectives: [NgtpEffectHostDirective],
+                }]
+        }] });
+
+class NgtpDepthOfField {
+    constructor() {
+        this.autoEffect = injectAutoEffect();
+        this.composerApi = injectEffectComposerApi();
+        this.effectRef = input(injectNgtRef());
+        this.options = input({});
+        this.autoFocus = computed(() => this.options().target != null);
+        this.effect = computed(() => {
+            const [{ camera }, options, autoFocus] = [this.composerApi(), this.options(), this.autoFocus()];
+            const effect = new DepthOfFieldEffect(camera, options);
+            // Creating a target enables autofocus, R3F will set via props
+            if (autoFocus)
+                effect.target = new Vector3();
+            // Depth texture for depth picking with optional packing strategy
+            if (options.depthTexture) {
+                effect.setDepthTexture(options.depthTexture.texture, options.depthTexture.packing);
+            }
+            // Temporary fix that restores DOF 6.21.3 behavior, everything since then lets shapes leak through the blur
+            const maskPass = effect.maskPass;
+            maskPass.maskFunction = MaskFunction.MULTIPLY_RGB_SET_ALPHA;
+            return effect;
+        });
+        afterNextRender(() => {
+            this.autoEffect(() => {
+                const effect = this.effect();
+                return () => {
+                    effect.dispose();
+                };
+            });
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpDepthOfField, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpDepthOfField, isStandalone: true, selector: "ngtp-depth-of-field", inputs: { effectRef: { classPropertyName: "effectRef", publicName: "effectRef", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+		<ngt-primitive *args="[effect()]" [ref]="effectRef()" ngtCompound />
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpDepthOfField, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-depth-of-field',
+                    standalone: true,
+                    template: `
+		<ngt-primitive *args="[effect()]" [ref]="effectRef()" ngtCompound />
+	`,
+                    imports: [NgtArgs],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], ctorParameters: () => [] });
+
+extend({ DotScreenEffect });
+class NgtpDotScreen {
+    constructor() {
+        this.effect = inject(NgtpEffect, { host: true });
+        this.options = input({});
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpDotScreen, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpDotScreen, isStandalone: true, selector: "ngtp-dot-screen", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: NgtpEffect, inputs: ["blendFunction", "blendFunction", "opacity", "opacity", "effectRef", "effectRef"] }], ngImport: i0, template: `
+		<ngt-dot-screen-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-dot-screen-effect>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }, { kind: "component", type: NgtpEffectBlendMode, selector: "ngtp-effect-blend-mode" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpDotScreen, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-dot-screen',
+                    template: `
+		<ngt-dot-screen-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-dot-screen-effect>
+	`,
+                    standalone: true,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgtArgs, NgtpEffectBlendMode],
+                    hostDirectives: [NgtpEffectHostDirective],
+                }]
+        }] });
+
+extend({ FXAAEffect });
+class NgtpFXAA {
+    constructor() {
+        this.effect = inject(NgtpEffect, { host: true });
+        this.options = input({});
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpFXAA, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpFXAA, isStandalone: true, selector: "ngtp-fxaa", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: NgtpEffect, inputs: ["blendFunction", "blendFunction", "opacity", "opacity", "effectRef", "effectRef"] }], ngImport: i0, template: `
+		<ngt-fXAA-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-fXAA-effect>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }, { kind: "component", type: NgtpEffectBlendMode, selector: "ngtp-effect-blend-mode" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpFXAA, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-fxaa',
+                    template: `
+		<ngt-fXAA-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-fXAA-effect>
+	`,
+                    standalone: true,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgtArgs, NgtpEffectBlendMode],
+                    hostDirectives: [NgtpEffectHostDirective],
+                }]
+        }] });
+
+function vector2(options, key) {
+    return computed(() => {
+        const value = options()[key];
+        if (typeof value === 'number')
+            return new Vector2(value, value);
+        else if (value)
+            return new Vector2(...value);
+        else
+            return new Vector2();
+    });
+}
+
+class NgtpGlitch {
+    constructor() {
+        this.autoEffect = injectAutoEffect();
+        this.store = injectNgtStore();
+        this.invalidate = this.store.select('invalidate');
+        this.effectRef = input(injectNgtRef());
+        this.options = input({ active: true }, { transform: mergeInputs({ active: true }) });
+        this.active = computed(() => this.options().active);
+        this.mode = computed(() => this.options().mode);
+        this.delay = vector2(this.options, 'delay');
+        this.duration = vector2(this.options, 'duration');
+        this.chromaticAberrationOffset = vector2(this.options, 'chromaticAberrationOffset');
+        this.strength = vector2(this.options, 'strength');
+        this.effect = computed(() => {
+            const [{ ratio, dtSize, columns, blendFunction, perturbationMap }, delay, duration, chromaticAberrationOffset, strength,] = [this.options(), this.delay(), this.duration(), this.chromaticAberrationOffset(), this.strength()];
+            return new GlitchEffect({
+                ratio,
+                dtSize,
+                columns,
+                blendFunction,
+                perturbationMap,
+                delay,
+                duration,
+                chromaticAberrationOffset,
+                strength,
+            });
+        });
+        afterNextRender(() => {
+            this.autoEffect(() => {
+                const effect = this.effect();
+                return () => effect.dispose();
+            });
+            this.autoEffect(() => {
+                const [effect, invalidate, mode, active] = [this.effect(), this.invalidate(), this.mode(), this.active()];
+                effect.mode = active ? mode || GlitchMode.SPORADIC : GlitchMode.DISABLED;
+                invalidate();
+            });
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpGlitch, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpGlitch, isStandalone: true, selector: "ngtp-glitch", inputs: { effectRef: { classPropertyName: "effectRef", publicName: "effectRef", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+		<ngt-primitive *args="[effect()]" [ref]="effectRef()" [dispose]="null" ngtCompound />
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpGlitch, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-glitch',
+                    standalone: true,
+                    template: `
+		<ngt-primitive *args="[effect()]" [ref]="effectRef()" [dispose]="null" ngtCompound />
+	`,
+                    imports: [NgtArgs],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], ctorParameters: () => [] });
+
+class NgtpGodRays {
+    constructor() {
+        this.autoEffect = injectAutoEffect();
+        this.composerApi = injectEffectComposerApi();
+        this.effectRef = input(injectNgtRef());
+        this.options = input({});
+        this.effect = computed(() => {
+            const [{ camera }, { sun, ...options }] = [this.composerApi(), this.options()];
+            return new GodRaysEffect(camera, is.ref(sun) ? sun.nativeElement : sun, options);
+        });
+        afterNextRender(() => {
+            this.autoEffect(() => {
+                const [sun, effect] = [this.options().sun, this.effect()];
+                effect.lightSource = is.ref(sun) ? sun.nativeElement : sun;
+            });
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpGodRays, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpGodRays, isStandalone: true, selector: "ngtp-god-rays", inputs: { effectRef: { classPropertyName: "effectRef", publicName: "effectRef", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+		<ngt-primitive *args="[effect()]" [ref]="effectRef()" ngtCompound />
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpGodRays, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-god-rays',
+                    standalone: true,
+                    template: `
+		<ngt-primitive *args="[effect()]" [ref]="effectRef()" ngtCompound />
+	`,
+                    imports: [NgtArgs],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: () => [] });
+
+class NgtpGrid {
+    constructor() {
+        this.autoEffect = injectAutoEffect();
+        this.store = injectNgtStore();
+        this.invalidate = this.store.select('invalidate');
+        this.effectRef = input(injectNgtRef());
+        this.options = input({});
+        this.size = computed(() => this.options().size);
+        this.effect = computed(() => {
+            const { size: _, ...options } = this.options();
+            return new GridEffect(options);
+        });
+        afterNextRender(() => {
+            this.autoEffect(() => {
+                const [size, effect] = [this.size(), this.effect()];
+                if (size) {
+                    effect.setSize(size.width, size.height);
+                }
+            });
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpGrid, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpGrid, isStandalone: true, selector: "ngtp-grid", inputs: { effectRef: { classPropertyName: "effectRef", publicName: "effectRef", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+		<ngt-primitive *args="[effect()]" [ref]="effectRef()" ngtCompound />
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpGrid, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-grid',
+                    standalone: true,
+                    template: `
+		<ngt-primitive *args="[effect()]" [ref]="effectRef()" ngtCompound />
+	`,
+                    imports: [NgtArgs],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: () => [] });
+
+extend({ HueSaturationEffect });
+class NgtpHueSaturation {
+    constructor() {
+        this.effect = inject(NgtpEffect, { host: true });
+        this.options = input({});
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpHueSaturation, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpHueSaturation, isStandalone: true, selector: "ngtp-hue-saturation", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: NgtpEffect, inputs: ["blendFunction", "blendFunction", "opacity", "opacity", "effectRef", "effectRef"] }], ngImport: i0, template: `
+		<ngt-hue-saturation-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-hue-saturation-effect>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }, { kind: "component", type: NgtpEffectBlendMode, selector: "ngtp-effect-blend-mode" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpHueSaturation, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-hue-saturation',
+                    template: `
+		<ngt-hue-saturation-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-hue-saturation-effect>
+	`,
+                    standalone: true,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgtArgs, NgtpEffectBlendMode],
+                    hostDirectives: [NgtpEffectHostDirective],
+                }]
+        }] });
+
+// Created by Anderson Mancini 2023
+// React Three Fiber Ultimate LensFlare
+const LensFlareShader = {
+    fragmentShader: /* glsl */ `
+
+  uniform float iTime;
+  uniform vec2 lensPosition;
+  uniform vec2 iResolution;
+  uniform vec3 colorGain;
+  uniform float starPoints;
+  uniform float glareSize;
+  uniform float flareSize;
+  uniform float flareSpeed;
+  uniform float flareShape;
+  uniform float haloScale;
+  uniform float opacity;
+  uniform bool animated;
+  uniform bool anamorphic;
+  uniform bool enabled;
+  uniform bool secondaryGhosts;
+  uniform bool starBurst;
+  uniform float ghostScale;
+  uniform bool aditionalStreaks;
+  uniform sampler2D lensDirtTexture;
+  vec2 vxtC;
+
+  float rndf(float n){return fract(sin(n) * 43758.5453123);}float niz(float p){float fl = floor(p);float fc = fract(p);return mix(rndf(fl),rndf(fl + 1.0), fc);}
+  vec3 hsv2rgb(vec3 c){vec4 k = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);vec3 p = abs(fract(c.xxx + k.xyz) * 6.0 - k.www);return c.z * mix(k.xxx, clamp(p - k.xxx, 0.0, 1.0), c.y);}
+  float satU(float x){return clamp(x, 0.,1.);}vec2 rtU(vec2 naz, float rtn){return vec2(cos(rtn) * naz.x + sin(rtn) * naz.y,cos(rtn) * naz.y - sin(rtn) * naz.x);}
+  vec3 drwF(vec2 p, float intensity, float rnd, float speed, int id){float flhos = (1. / 32.) * float(id) * 0.1;float lingrad = distance(vec2(0.), p);float expg = 1. / exp(lingrad * (fract(rnd) * 0.66 + 0.33));vec3 qzTg = hsv2rgb(vec3( fract( (expg * 8.) + speed * flareSpeed + flhos), pow(1.-abs(expg*2.-1.), 0.45), 20.0 * expg * intensity));float internalStarPoints;if(anamorphic){internalStarPoints = 1.0;} else{internalStarPoints = starPoints;}float ams = length(p * flareShape * sin(internalStarPoints * atan(p.x, p.y)));float kJhg = pow(1.-satU(ams), ( anamorphic ? 100. : 12.));kJhg += satU(expg-0.9) * 3.;kJhg = pow(kJhg * expg, 8. + (1.-intensity) * 5.);if(flareSpeed > 0.0){return vec3(kJhg) * qzTg;} else{return vec3(kJhg) * flareSize * 15.;}}
+  float ams2(vec3 a, vec3 b) { return abs(a.x - b.x) + abs(a.y - b.y) + abs(a.z - b.z);}vec3 satU(vec3 x){return clamp(x, vec3(0.0), vec3(1.0));}
+  float glR(vec2 naz, vec2 pos, float zsi){vec2 mni;if(animated){mni = rtU(naz-pos, iTime * 0.1);} else{mni = naz-pos;}float ang = atan(mni.y, mni.x) * (anamorphic ? 1.0 : starPoints);float ams2 = length(mni);ams2 = pow(ams2, .9);float f0 = 1.0/(length(naz-pos)*(1.0/zsi*16.0)+.2);return f0+f0*(sin((ang))*.2 +.3);}
+  float sdHex(vec2 p){p = abs(p);vec2 q = vec2(p.x*2.0*0.5773503, p.y + p.x*0.5773503);return dot(step(q.xy,q.yx), 1.0-q.yx);}float fpow(float x, float k){return x > k ? pow((x-k)/(1.0-k),2.0) : 0.0;}
+  vec3 rHx(vec2 naz, vec2 p, float s, vec3 col){naz -= p;if (abs(naz.x) < 0.2*s && abs(naz.y) < 0.2*s){return mix(vec3(0),mix(vec3(0),col,0.1 + fpow(length(naz/s),0.1)*10.0),smoothstep(0.0,0.1,sdHex(naz*20.0/s)));}return vec3(0);}
+  vec3 mLs(vec2 naz, vec2 pos){vec2 mni = naz-pos;vec2 zxMp = naz*(length(naz));float ang = atan(mni.x,mni.y);float f0 = .3/(length(naz-pos)*16.0+1.0);f0 = f0*(sin(niz(sin(ang*3.9-(animated ? iTime : 0.0) * 0.3) * starPoints))*.2 );float f1 = max(0.01-pow(length(naz+1.2*pos),1.9),.0)*7.0;float f2 = max(.9/(10.0+32.0*pow(length(zxMp+0.99*pos),2.0)),.0)*0.35;float f22 = max(.9/(11.0+32.0*pow(length(zxMp+0.85*pos),2.0)),.0)*0.23;float f23 = max(.9/(12.0+32.0*pow(length(zxMp+0.95*pos),2.0)),.0)*0.6;vec2 ztX = mix(naz,zxMp, 0.1);float f4 = max(0.01-pow(length(ztX+0.4*pos),2.9),.0)*4.02;float f42 = max(0.0-pow(length(ztX+0.45*pos),2.9),.0)*4.1;float f43 = max(0.01-pow(length(ztX+0.5*pos),2.9),.0)*4.6;ztX = mix(naz,zxMp,-.4);float f5 = max(0.01-pow(length(ztX+0.1*pos),5.5),.0)*2.0;float f52 = max(0.01-pow(length(ztX+0.2*pos),5.5),.0)*2.0;float f53 = max(0.01-pow(length(ztX+0.1*pos),5.5),.0)*2.0;ztX = mix(naz,zxMp, 2.1);float f6 = max(0.01-pow(length(ztX-0.3*pos),1.61),.0)*3.159;float f62 = max(0.01-pow(length(ztX-0.325*pos),1.614),.0)*3.14;float f63 = max(0.01-pow(length(ztX-0.389*pos),1.623),.0)*3.12;vec3 c = vec3(glR(naz,pos, glareSize));vec2 prot;if(animated){prot = rtU(naz - pos, (iTime * 0.1));} else if(anamorphic){prot = rtU(naz - pos, 1.570796);} else {prot = naz - pos;}c += drwF(prot, (anamorphic ? flareSize * 10. : flareSize), 0.1, iTime, 1);c.r+=f1+f2+f4+f5+f6; c.g+=f1+f22+f42+f52+f62; c.b+=f1+f23+f43+f53+f63;c = c*1.3 * vec3(length(zxMp)+.09);c+=vec3(f0);return c;}
+  vec3 cc(vec3 clr, float fct,float fct2){float w = clr.x+clr.y+clr.z;return mix(clr,vec3(w)*fct,w*fct2);}float rnd(vec2 p){float f = fract(sin(dot(p, vec2(12.1234, 72.8392) )*45123.2));return f;}float rnd(float w){float f = fract(sin(w)*1000.);return f;}
+  float rShp(vec2 p, int N){float f;float a=atan(p.x,p.y)+.2;float b=6.28319/float(N);f=smoothstep(.5,.51, cos(floor(.5+a/b)*b-a)*length(p.xy)* 2.0  -ghostScale);return f;}
+  vec3 drC(vec2 p, float zsi, float dCy, vec3 clr, vec3 clr2, float ams2, vec2 esom){float l = length(p + esom*(ams2*2.))+zsi/2.;float l2 = length(p + esom*(ams2*4.))+zsi/3.;float c = max(0.01-pow(length(p + esom*ams2), zsi*ghostScale), 0.0)*10.;float c1 = max(0.001-pow(l-0.3, 1./40.)+sin(l*20.), 0.0)*3.;float c2 =  max(0.09/pow(length(p-esom*ams2/.5)*1., .95), 0.0)/20.;float s = max(0.02-pow(rShp(p*5. + esom*ams2*5. + dCy, 6) , 1.), 0.0)*1.5;clr = cos(vec3(0.44, .24, .2)*8. + ams2*4.)*0.5+.5;vec3 f = c*clr;f += c1*clr;f += c2*clr;f +=  s*clr;return f-0.01;}
+  vec4 geLC(float x){return vec4(vec3(mix(mix(mix(mix(mix(mix(mix(mix(mix(mix(mix(mix(mix(mix(mix(vec3(0., 0., 0.),vec3(0., 0., 0.), smoothstep(0.0, 0.063, x)),vec3(0., 0., 0.), smoothstep(0.063, 0.125, x)),vec3(0.0, 0., 0.), smoothstep(0.125, 0.188, x)),vec3(0.188, 0.131, 0.116), smoothstep(0.188, 0.227, x)),vec3(0.31, 0.204, 0.537), smoothstep(0.227, 0.251, x)),vec3(0.192, 0.106, 0.286), smoothstep(0.251, 0.314, x)),vec3(0.102, 0.008, 0.341), smoothstep(0.314, 0.392, x)),vec3(0.086, 0.0, 0.141), smoothstep(0.392, 0.502, x)),vec3(1.0, 0.31, 0.0), smoothstep(0.502, 0.604, x)),vec3(.1, 0.1, 0.1), smoothstep(0.604, 0.643, x)),vec3(1.0, 0.929, 0.0), smoothstep(0.643, 0.761, x)),vec3(1.0, 0.086, 0.424), smoothstep(0.761, 0.847, x)),vec3(1.0, 0.49, 0.0), smoothstep(0.847, 0.89, x)),vec3(0.945, 0.275, 0.475), smoothstep(0.89, 0.941, x)),vec3(0.251, 0.275, 0.796), smoothstep(0.941, 1.0, x))),1.0);}
+  float diTN(vec2 p){vec2 f = fract(p);f = (f * f) * (3.0 - (2.0 * f));float n = dot(floor(p), vec2(1.0, 157.0));vec4 a = fract(sin(vec4(n + 0.0, n + 1.0, n + 157.0, n + 158.0)) * 43758.5453123);return mix(mix(a.x, a.y, f.x), mix(a.z, a.w, f.x), f.y);}
+  float fbm(vec2 p){const mat2 m = mat2(0.80, -0.60, 0.60, 0.80);float f = 0.0;f += 0.5000*diTN(p); p = m*p*2.02;f += 0.2500*diTN(p); p = m*p*2.03;f += 0.1250*diTN(p); p = m*p*2.01;f += 0.0625*diTN(p);return f/0.9375;}
+  vec4 geLS(vec2 p){vec2 pp = (p - vec2(0.5)) * 2.0;float a = atan(pp.y, pp.x);vec4 cp = vec4(sin(a * 1.0), length(pp), sin(a * 13.0), sin(a * 53.0));float d = sin(clamp(pow(length(vec2(0.5) - p) * 0.5 + haloScale /2., 5.0), 0.0, 1.0) * 3.14159);vec3 c = vec3(d) * vec3(fbm(cp.xy * 16.0) * fbm(cp.zw * 9.0) * max(max(max(max(0.5, sin(a * 1.0)), sin(a * 3.0) * 0.8), sin(a * 7.0) * 0.8), sin(a * 9.0) * 10.6));c *= vec3(mix(2.0, (sin(length(pp.xy) * 256.0) * 0.5) + 0.5, sin((clamp((length(pp.xy) - 0.875) / 0.1, 0.0, 1.0) + 0.0) * 2.0 * 3.14159) * 1.5) + 0.5) * 0.3275;return vec4(vec3(c * 1.0), d);}
+  vec4 geLD(vec2 p){p.xy += vec2(fbm(p.yx * 3.0), fbm(p.yx * 2.0)) * 0.0825;vec3 o = vec3(mix(0.125, 0.25, max(max(smoothstep(0.1, 0.0, length(p - vec2(0.25))),smoothstep(0.4, 0.0, length(p - vec2(0.75)))),smoothstep(0.8, 0.0, length(p - vec2(0.875, 0.125))))));o += vec3(max(fbm(p * 1.0) - 0.5, 0.0)) * 0.5;o += vec3(max(fbm(p * 2.0) - 0.5, 0.0)) * 0.5;o += vec3(max(fbm(p * 4.0) - 0.5, 0.0)) * 0.25;o += vec3(max(fbm(p * 8.0) - 0.75, 0.0)) * 1.0;o += vec3(max(fbm(p * 16.0) - 0.75, 0.0)) * 0.75;o += vec3(max(fbm(p * 64.0) - 0.75, 0.0)) * 0.5;return vec4(clamp(o, vec3(0.15), vec3(1.0)), 1.0);}
+  vec4 txL(sampler2D tex, vec2 xtC){if(((xtC.x < 0.) || (xtC.y < 0.)) || ((xtC.x > 1.) || (xtC.y > 1.))){return vec4(0.0);}else{return texture(tex, xtC); }}
+  vec4 txD(sampler2D tex, vec2 xtC, vec2 dir, vec3 ditn) {return vec4(txL(tex, (xtC + (dir * ditn.r))).r,txL(tex, (xtC + (dir * ditn.g))).g,txL(tex, (xtC + (dir * ditn.b))).b,1.0);}
+  vec4 strB(){vec2 aspXtc = vec2(1.0) - (((vxtC - vec2(0.5)) * vec2(1.0)) + vec2(0.5)); vec2 xtC = vec2(1.0) - vxtC; vec2 ghvc = (vec2(0.5) - xtC) * 0.3 - lensPosition; vec2 ghNm = normalize(ghvc * vec2(1.0)) * vec2(1.0);vec2 haloVec = normalize(ghvc) * 0.6;vec2 hlNm = ghNm * 0.6;vec2 texelSize = vec2(1.0) / vec2(iResolution.xy);vec3 ditn = vec3(-(texelSize.x * 1.5), 0.2, texelSize.x * 1.5);vec4 c = vec4(0.0);for (int i = 0; i < 8; i++) {vec2 offset = xtC + (ghvc * float(i));c += txD(lensDirtTexture, offset, ghNm, ditn) * pow(max(0.0, 1.0 - (length(vec2(0.5) - offset) / length(vec2(0.5)))), 10.0);}vec2 uyTrz = xtC + hlNm; return (c * geLC((length(vec2(0.5) - aspXtc) / length(vec2(haloScale))))) +(txD(lensDirtTexture, uyTrz, ghNm, ditn) * pow(max(0.0, 1.0 - (length(vec2(0.5) - uyTrz) / length(vec2(0.5)))), 10.0));}
+  void mainImage(vec4 v,vec2 r,out vec4 i){vec2 g=r-.5;g.y*=iResolution.y/iResolution.x;vec2 l=lensPosition*.5;l.y*=iResolution.y/iResolution.x;vec3 f=mLs(g,l)*20.*colorGain/256.;if(aditionalStreaks){vec3 o=vec3(.9,.2,.1),p=vec3(.3,.1,.9);for(float n=0.;n<10.;n++)f+=drC(g,pow(rnd(n*2e3)*2.8,.1)+1.41,0.,o+n,p+n,rnd(n*20.)*3.+.2-.5,lensPosition);}if(secondaryGhosts){vec3 n=vec3(0);n+=rHx(g,-lensPosition*.25,ghostScale*1.4,vec3(.25,.35,0));n+=rHx(g,lensPosition*.25,ghostScale*.5,vec3(1,.5,.5));n+=rHx(g,lensPosition*.1,ghostScale*1.6,vec3(1));n+=rHx(g,lensPosition*1.8,ghostScale*2.,vec3(0,.5,.75));n+=rHx(g,lensPosition*1.25,ghostScale*.8,vec3(1,1,.5));n+=rHx(g,-lensPosition*1.25,ghostScale*5.,vec3(.5,.5,.25));n+=fpow(1.-abs(distance(lensPosition*.8,g)-.7),.985)*colorGain/2100.;f+=n;}if(starBurst){vxtC=g+.5;vec4 n=geLD(g);float o=1.-clamp(0.5,0.,.5)*2.;n+=mix(n,pow(n*2.,vec4(2))*.5,o);float s=(g.x+g.y)*(1./6.);vec2 d=mat2(cos(s),-sin(s),sin(s),cos(s))*vxtC;n+=geLS(d)*2.;f+=clamp(n.xyz*strB().xyz,.01,1.);}i=enabled?vec4(mix(f,vec3(0),opacity)+v.xyz,v.w):vec4(v);}
+`,
+};
+class LensFlareEffect extends Effect {
+    constructor({ blendFunction = BlendFunction.NORMAL, enabled = true, glareSize = 0.2, lensPosition = [0.01, 0.01], iResolution = [0, 0], starPoints = 6, flareSize = 0.01, flareSpeed = 0.01, flareShape = 0.01, animated = true, anamorphic = false, colorGain = new Color(20, 20, 20), lensDirtTexture = null, haloScale = 0.5, secondaryGhosts = true, aditionalStreaks = true, ghostScale = 0.0, opacity = 1.0, starBurst = false, } = {}) {
+        super('LensFlareEffect', LensFlareShader.fragmentShader, {
+            blendFunction,
+            uniforms: new Map([
+                ['enabled', new Uniform(enabled)],
+                ['glareSize', new Uniform(glareSize)],
+                ['lensPosition', new Uniform(lensPosition)],
+                ['iTime', new Uniform(0)],
+                ['iResolution', new Uniform(iResolution)],
+                ['starPoints', new Uniform(starPoints)],
+                ['flareSize', new Uniform(flareSize)],
+                ['flareSpeed', new Uniform(flareSpeed)],
+                ['flareShape', new Uniform(flareShape)],
+                ['animated', new Uniform(animated)],
+                ['anamorphic', new Uniform(anamorphic)],
+                ['colorGain', new Uniform(colorGain)],
+                ['lensDirtTexture', new Uniform(lensDirtTexture)],
+                ['haloScale', new Uniform(haloScale)],
+                ['secondaryGhosts', new Uniform(secondaryGhosts)],
+                ['aditionalStreaks', new Uniform(aditionalStreaks)],
+                ['ghostScale', new Uniform(ghostScale)],
+                ['starBurst', new Uniform(starBurst)],
+                ['opacity', new Uniform(opacity)],
+            ]),
+        });
+    }
+    update(_renderer, _inputBuffer, deltaTime) {
+        const iTime = this.uniforms.get('iTime');
+        if (iTime) {
+            iTime.value += deltaTime;
+        }
+    }
+}
+const defaultOptions$1 = {
+    position: new Vector3(-25, 6, -60),
+    followMouse: false,
+    smoothTime: 0.7,
+};
+class NgtpLensFlare {
+    constructor() {
+        this.autoEffect = injectAutoEffect();
+        this.store = injectNgtStore();
+        this.viewport = this.store.select('viewport');
+        this.raycaster = this.store.select('raycaster');
+        this.pointer = this.store.select('pointer');
+        this.composerApi = injectEffectComposerApi();
+        this.effectRef = input(injectNgtRef());
+        this.options = input(defaultOptions$1, { transform: mergeInputs(defaultOptions$1) });
+        this.projectedPosition = new Vector3();
+        this.mouse2d = new Vector2();
+        this.effect = computed(() => {
+            const { position: _, followMouse: __, smoothTime: ___, ...options } = this.options();
+            return new LensFlareEffect(options);
+        });
+        afterNextRender(() => {
+            this.autoEffect(() => {
+                const [effect, viewport] = [this.effect(), this.viewport()];
+                const iResolution = effect.uniforms.get('iResolution');
+                if (iResolution) {
+                    iResolution.value.x = viewport.width;
+                    iResolution.value.y = viewport.height;
+                }
+            });
+        });
+        injectBeforeRender(({ delta }) => {
+            const [effect] = [this.effect()];
+            if (!effect)
+                return;
+            const [{ followMouse, position, smoothTime }, pointer, { camera, scene }, raycaster] = [
+                this.options(),
+                this.pointer(),
+                this.composerApi(),
+                this.raycaster(),
+            ];
+            const uLensPosition = effect.uniforms.get('lensPosition');
+            const uOpacity = effect.uniforms.get('opacity');
+            if (!uLensPosition || !uOpacity)
+                return;
+            let target = 1;
+            if (followMouse) {
+                uLensPosition.value.x = pointer.x;
+                uLensPosition.value.y = pointer.y;
+                target = 0;
+            }
+            else {
+                this.projectedPosition.copy(position).project(camera);
+                if (this.projectedPosition.z > 1)
+                    return;
+                uLensPosition.value.x = this.projectedPosition.x;
+                uLensPosition.value.y = this.projectedPosition.y;
+                this.mouse2d.set(this.projectedPosition.x, this.projectedPosition.y);
+                raycaster.setFromCamera(this.mouse2d, camera);
+                const intersects = raycaster.intersectObjects(scene.children, true);
+                const { object } = intersects[0] ?? {};
+                if (object) {
+                    if (object.userData?.['lensflare'] === 'no-occlusion') {
+                        target = 0;
+                    }
+                    else if (object instanceof Mesh) {
+                        if (object.material.uniforms?._transmission?.value > 0.2) {
+                            //Check for MeshTransmissionMaterial
+                            target = 0.2;
+                        }
+                        else if (object.material._transmission && object.material._transmission > 0.2) {
+                            //Check for MeshPhysicalMaterial with transmission setting
+                            target = 0.2;
+                        }
+                        else if (object.material.transparent) {
+                            // Check for OtherMaterials with transparent parameter
+                            target = object.material.opacity;
+                        }
+                    }
+                }
+            }
+            easing.damp(uOpacity, 'value', target, smoothTime, delta);
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpLensFlare, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpLensFlare, isStandalone: true, selector: "ngtp-lens-flare", inputs: { effectRef: { classPropertyName: "effectRef", publicName: "effectRef", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+		<ngt-primitive *args="[effect()]" [ref]="effectRef()" [dispose]="null" ngtCompound />
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpLensFlare, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-lens-flare',
+                    standalone: true,
+                    template: `
+		<ngt-primitive *args="[effect()]" [ref]="effectRef()" [dispose]="null" ngtCompound />
+	`,
+                    imports: [NgtArgs],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], ctorParameters: () => [] });
+
+class NgtpLUT {
+    constructor() {
+        this.autoEffect = injectAutoEffect();
+        this.store = injectNgtStore();
+        this.invalidate = this.store.select('invalidate');
+        this.effectRef = input(injectNgtRef());
+        this.options = input({});
+        this.lut = computed(() => this.options().lut);
+        this.effect = computed(() => {
+            const [lut, { lut: _, ...options }] = [this.lut(), this.options()];
+            return new LUT3DEffect(lut, options);
+        });
+        afterNextRender(() => {
+            this.autoEffect(() => {
+                const [effect, { lut, tetrahedralInterpolation }, invalidate] = [
+                    this.effect(),
+                    this.options(),
+                    this.invalidate(),
+                ];
+                if (tetrahedralInterpolation)
+                    effect.tetrahedralInterpolation = tetrahedralInterpolation;
+                if (lut)
+                    effect.lut = lut;
+                invalidate();
+            });
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpLUT, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpLUT, isStandalone: true, selector: "ngtp-lut", inputs: { effectRef: { classPropertyName: "effectRef", publicName: "effectRef", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+		<ngt-primitive *args="[effect()]" [ref]="effectRef()" [dispose]="null" ngtCompound />
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpLUT, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-lut',
+                    template: `
+		<ngt-primitive *args="[effect()]" [ref]="effectRef()" [dispose]="null" ngtCompound />
+	`,
+                    imports: [NgtArgs],
+                    standalone: true,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], ctorParameters: () => [] });
+
+extend({ NoiseEffect });
+class NgtpNoise {
+    constructor() {
+        this.effect = inject(NgtpEffect, { host: true });
+        this.options = input({});
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpNoise, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpNoise, isStandalone: true, selector: "ngtp-noise", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideDefaultEffectOptions({ blendFunction: BlendFunction.COLOR_DODGE })], hostDirectives: [{ directive: NgtpEffect, inputs: ["blendFunction", "blendFunction", "opacity", "opacity", "effectRef", "effectRef"] }], ngImport: i0, template: `
+		<ngt-noise-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-noise-effect>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }, { kind: "component", type: NgtpEffectBlendMode, selector: "ngtp-effect-blend-mode" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpNoise, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-noise',
+                    template: `
+		<ngt-noise-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-noise-effect>
+	`,
+                    standalone: true,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgtArgs, NgtpEffectBlendMode],
+                    hostDirectives: [NgtpEffectHostDirective],
+                    providers: [provideDefaultEffectOptions({ blendFunction: BlendFunction.COLOR_DODGE })],
+                }]
+        }] });
+
+class NgtpPixelation {
+    constructor() {
+        this.effectRef = input(injectNgtRef());
+        this.options = input({ granularity: 5 }, { transform: mergeInputs({ granularity: 5 }) });
+        this.granularity = computed(() => this.options().granularity);
+        this.effect = computed(() => new PixelationEffect(this.granularity()));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpPixelation, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpPixelation, isStandalone: true, selector: "ngtp-pixelation", inputs: { effectRef: { classPropertyName: "effectRef", publicName: "effectRef", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+		<ngt-primitive *args="[effect()]" [ref]="effectRef()" ngtCompound />
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpPixelation, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-pixelation',
+                    template: `
+		<ngt-primitive *args="[effect()]" [ref]="effectRef()" ngtCompound />
+	`,
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    imports: [NgtArgs],
+                }]
+        }] });
+
+extend({ ScanlineEffect });
+const defaultOptions = {
+    density: 1.25,
+};
+class NgtpScanline {
+    constructor() {
+        this.effect = inject(NgtpEffect, { host: true });
+        this.options = input(defaultOptions, { transform: mergeInputs(defaultOptions) });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpScanline, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpScanline, isStandalone: true, selector: "ngtp-scanline", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideDefaultEffectOptions({ blendFunction: BlendFunction.OVERLAY })], hostDirectives: [{ directive: NgtpEffect, inputs: ["blendFunction", "blendFunction", "opacity", "opacity", "effectRef", "effectRef"] }], ngImport: i0, template: `
+		<ngt-scanline-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-scanline-effect>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }, { kind: "component", type: NgtpEffectBlendMode, selector: "ngtp-effect-blend-mode" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpScanline, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-scanline',
+                    template: `
+		<ngt-scanline-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-scanline-effect>
+	`,
+                    standalone: true,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgtArgs, NgtpEffectBlendMode],
+                    hostDirectives: [NgtpEffectHostDirective],
+                    providers: [provideDefaultEffectOptions({ blendFunction: BlendFunction.OVERLAY })],
+                }]
+        }] });
+
+extend({ SepiaEffect });
+class NgtpSepia {
+    constructor() {
+        this.effect = inject(NgtpEffect, { host: true });
+        this.options = input({});
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpSepia, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpSepia, isStandalone: true, selector: "ngtp-sepia", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: NgtpEffect, inputs: ["blendFunction", "blendFunction", "opacity", "opacity", "effectRef", "effectRef"] }], ngImport: i0, template: `
+		<ngt-sepia-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-sepia-effect>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }, { kind: "component", type: NgtpEffectBlendMode, selector: "ngtp-effect-blend-mode" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpSepia, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-sepia',
+                    template: `
+		<ngt-sepia-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-sepia-effect>
+	`,
+                    standalone: true,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgtArgs, NgtpEffectBlendMode],
+                    hostDirectives: [NgtpEffectHostDirective],
+                }]
+        }] });
+
+extend({ ShockWaveEffect });
+class NgtpShockWave {
+    constructor() {
+        this.effect = inject(NgtpEffect, { host: true });
+        this.options = input({});
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpShockWave, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpShockWave, isStandalone: true, selector: "ngtp-shock-wave", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: NgtpEffect, inputs: ["blendFunction", "blendFunction", "opacity", "opacity", "effectRef", "effectRef"] }], ngImport: i0, template: `
+		<ngt-shock-wave-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-shock-wave-effect>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }, { kind: "component", type: NgtpEffectBlendMode, selector: "ngtp-effect-blend-mode" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpShockWave, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-shock-wave',
+                    template: `
+		<ngt-shock-wave-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-shock-wave-effect>
+	`,
+                    standalone: true,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgtArgs, NgtpEffectBlendMode],
+                    hostDirectives: [NgtpEffectHostDirective],
+                }]
+        }] });
+
+extend({ SMAAEffect });
+class NgtpSMAA {
+    constructor() {
+        this.effect = inject(NgtpEffect, { host: true });
+        this.options = input({});
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpSMAA, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpSMAA, isStandalone: true, selector: "ngtp-smaa", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: NgtpEffect, inputs: ["blendFunction", "blendFunction", "opacity", "opacity", "effectRef", "effectRef"] }], ngImport: i0, template: `
+		<ngt-sMAA-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-sMAA-effect>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }, { kind: "component", type: NgtpEffectBlendMode, selector: "ngtp-effect-blend-mode" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpSMAA, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-smaa',
+                    template: `
+		<ngt-sMAA-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-sMAA-effect>
+	`,
+                    standalone: true,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgtArgs, NgtpEffectBlendMode],
+                    hostDirectives: [NgtpEffectHostDirective],
+                }]
+        }] });
+
+extend({ TiltShiftEffect });
+class NgtpTiltShift {
+    constructor() {
+        this.effect = inject(NgtpEffect, { host: true });
+        this.options = input({});
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpTiltShift, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpTiltShift, isStandalone: true, selector: "ngtp-tilt-shift", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideDefaultEffectOptions({ blendFunction: BlendFunction.ADD })], hostDirectives: [{ directive: NgtpEffect, inputs: ["blendFunction", "blendFunction", "opacity", "opacity", "effectRef", "effectRef"] }], ngImport: i0, template: `
+		<ngt-tilt-shift-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-tilt-shift-effect>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }, { kind: "component", type: NgtpEffectBlendMode, selector: "ngtp-effect-blend-mode" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpTiltShift, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-tilt-shift',
+                    template: `
+		<ngt-tilt-shift-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-tilt-shift-effect>
+	`,
+                    standalone: true,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgtArgs, NgtpEffectBlendMode],
+                    hostDirectives: [NgtpEffectHostDirective],
+                    providers: [provideDefaultEffectOptions({ blendFunction: BlendFunction.ADD })],
+                }]
+        }] });
+
+const TiltShiftShader = {
+    fragmentShader: `
+
+    // original shader by Evan Wallace
+
+    #define MAX_ITERATIONS 100
+
+    uniform float blur;
+    uniform float taper;
+    uniform vec2 start;
+    uniform vec2 end;
+    uniform vec2 direction;
+    uniform int samples;
+
+    float random(vec3 scale, float seed) {
+        /* use the fragment position for a different seed per-pixel */
+        return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed);
+    }
+
+    void mainImage(const in vec4 inputColor, const in vec2 uv, out vec4 outputColor) {
+        vec4 color = vec4(0.0);
+        float total = 0.0;
+        vec2 startPixel = vec2(start.x * resolution.x, start.y * resolution.y);
+        vec2 endPixel = vec2(end.x * resolution.x, end.y * resolution.y);
+        float f_samples = float(samples);
+        float half_samples = f_samples / 2.0;
+
+        // use screen diagonal to normalize blur radii
+        float maxScreenDistance = distance(vec2(0.0), resolution); // diagonal distance
+        float gradientRadius = taper * (maxScreenDistance);
+        float blurRadius = blur * (maxScreenDistance / 16.0);
+
+        /* randomize the lookup values to hide the fixed number of samples */
+        float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0);
+        vec2 normal = normalize(vec2(startPixel.y - endPixel.y, endPixel.x - startPixel.x));
+        float radius = smoothstep(0.0, 1.0, abs(dot(uv * resolution - startPixel, normal)) / gradientRadius) * blurRadius;
+
+        #pragma unroll_loop_start
+        for (int i = 0; i <= MAX_ITERATIONS; i++) {
+            if (i >= samples) { break; } // return early if over sample count
+            float f_i = float(i);
+            float s_i = -half_samples + f_i;
+            float percent = (s_i + offset - 0.5) / half_samples;
+            float weight = 1.0 - abs(percent);
+            vec4 sample_i = texture2D(inputBuffer, uv + normalize(direction) / resolution * percent * radius);
+            /* switch to pre-multiplied alpha to correctly blur transparent images */
+            sample_i.rgb *= sample_i.a;
+            color += sample_i * weight;
+            total += weight;
+        }
+        #pragma unroll_loop_end
+
+        outputColor = color / total;
+
+        /* switch back from pre-multiplied alpha */
+        outputColor.rgb /= outputColor.a + 0.00001;
+    }
+    `,
+};
+class TiltShift2Effect extends Effect {
+    constructor({ blendFunction = BlendFunction.NORMAL, blur = 0.15, // [0, 1], can go beyond 1 for extra
+    taper = 0.5, // [0, 1], can go beyond 1 for extra
+    start = [0.5, 0.0], // [0,1] percentage x,y of screenspace
+    end = [0.5, 1.0], // [0,1] percentage x,y of screenspace
+    samples = 10.0, // number of blur samples
+    direction = [1, 1], // direction of blur
+     } = {}) {
+        super('TiltShiftEffect', TiltShiftShader.fragmentShader, {
+            blendFunction,
+            attributes: EffectAttribute.CONVOLUTION,
+            uniforms: new Map([
+                ['blur', new Uniform(blur)],
+                ['taper', new Uniform(taper)],
+                ['start', new Uniform(start)],
+                ['end', new Uniform(end)],
+                ['samples', new Uniform(samples)],
+                ['direction', new Uniform(direction)],
+            ]),
+        });
+    }
+}
+extend({ TiltShift2Effect });
+class NgtpTiltShift2 {
+    constructor() {
+        this.effect = inject(NgtpEffect, { host: true });
+        this.options = input({});
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpTiltShift2, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpTiltShift2, isStandalone: true, selector: "ngtp-tilt-shift2", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideDefaultEffectOptions({ blendFunction: BlendFunction.NORMAL })], hostDirectives: [{ directive: NgtpEffect, inputs: ["blendFunction", "blendFunction", "opacity", "opacity", "effectRef", "effectRef"] }], ngImport: i0, template: `
+		<ngt-tilt-shift2-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-tilt-shift2-effect>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }, { kind: "component", type: NgtpEffectBlendMode, selector: "ngtp-effect-blend-mode" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpTiltShift2, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-tilt-shift2',
+                    standalone: true,
+                    template: `
+		<ngt-tilt-shift2-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-tilt-shift2-effect>
+	`,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgtArgs, NgtpEffectBlendMode],
+                    hostDirectives: [NgtpEffectHostDirective],
+                    providers: [provideDefaultEffectOptions({ blendFunction: BlendFunction.NORMAL })],
+                }]
+        }] });
+
+extend({ VignetteEffect });
+class NgtpVignette {
+    constructor() {
+        this.effect = inject(NgtpEffect, { host: true });
+        this.options = input({});
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpVignette, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpVignette, isStandalone: true, selector: "ngtp-vignette", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: NgtpEffect, inputs: ["blendFunction", "blendFunction", "opacity", "opacity", "effectRef", "effectRef"] }], ngImport: i0, template: `
+		<ngt-vignette-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-vignette-effect>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }, { kind: "component", type: NgtpEffectBlendMode, selector: "ngtp-effect-blend-mode" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpVignette, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-vignette',
+                    template: `
+		<ngt-vignette-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-vignette-effect>
+	`,
+                    standalone: true,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgtArgs, NgtpEffectBlendMode],
+                    hostDirectives: [NgtpEffectHostDirective],
+                }]
+        }] });
+
+const WaterShader = {
+    fragmentShader: `
+  uniform float factor;
+  void mainImage(const in vec4 inputColor, const in vec2 uv, out vec4 outputColor) {
+    vec2 vUv = uv;
+    float frequency = 6.0 * factor;
+    float amplitude = 0.015 * factor;
+    float x = vUv.y * frequency + time * .7;
+    float y = vUv.x * frequency + time * .3;
+    vUv.x += cos(x+y) * amplitude * cos(y);
+    vUv.y += sin(x-y) * amplitude * cos(y);
+    vec4 rgba = texture2D(inputBuffer, vUv);
+    outputColor = rgba;
+  }`,
+};
+class WaterEffect extends Effect {
+    constructor({ blendFunction = BlendFunction.NORMAL, factor = 0 } = {}) {
+        super('WaterEffect', WaterShader.fragmentShader, {
+            blendFunction,
+            attributes: EffectAttribute.CONVOLUTION,
+            uniforms: new Map([['factor', new Uniform(factor)]]),
+        });
+    }
+}
+extend({ WaterEffect });
+class NgtpWater {
+    constructor() {
+        this.effect = inject(NgtpEffect, { host: true });
+        this.options = input({});
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpWater, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: NgtpWater, isStandalone: true, selector: "ngtp-water", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideDefaultEffectOptions({ blendFunction: BlendFunction.NORMAL })], hostDirectives: [{ directive: NgtpEffect, inputs: ["blendFunction", "blendFunction", "opacity", "opacity", "effectRef", "effectRef"] }], ngImport: i0, template: `
+		<ngt-water-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-water-effect>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }, { kind: "component", type: NgtpEffectBlendMode, selector: "ngtp-effect-blend-mode" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: NgtpWater, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngtp-water',
+                    standalone: true,
+                    template: `
+		<ngt-water-effect *args="[options()]" [camera]="effect.camera()" [ref]="effect.effectRef()" ngtCompound>
+			<ngtp-effect-blend-mode />
+			<ng-content />
+		</ngt-water-effect>
+	`,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgtArgs, NgtpEffectBlendMode],
+                    hostDirectives: [NgtpEffectHostDirective],
+                    providers: [provideDefaultEffectOptions({ blendFunction: BlendFunction.NORMAL })],
+                }]
+        }] });
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { NgtpBloom, NgtpEffect, NgtpEffectBlendMode, NgtpEffectComposer, NgtpEffectHostDirective, NgtpEffects, injectDefaultEffectOptions, provideDefaultEffectOptions };
+export { ASCIIEffect, LensFlareEffect, NgtpASCII, NgtpBloom, NgtpBrightnessContrast, NgtpChromaticAberration, NgtpColorAverage, NgtpColorDepth, NgtpDepth, NgtpDepthOfField, NgtpDotScreen, NgtpEffect, NgtpEffectBlendMode, NgtpEffectComposer, NgtpEffectHostDirective, NgtpEffects, NgtpFXAA, NgtpGlitch, NgtpGodRays, NgtpGrid, NgtpHueSaturation, NgtpLUT, NgtpLensFlare, NgtpNoise, NgtpPixelation, NgtpSMAA, NgtpScanline, NgtpSepia, NgtpShockWave, NgtpTiltShift, NgtpTiltShift2, NgtpVignette, NgtpWater, TiltShift2Effect, WaterEffect, injectDefaultEffectOptions, injectEffectComposerApi, provideDefaultEffectOptions, provideEffectComposerApi };
 //# sourceMappingURL=angular-three-postprocessing.mjs.map