angular-three-postprocessing 4.0.0-next.99 → 4.0.0

package/types/angular-three-postprocessing.d.ts

@@ -0,0 +1,1887 @@
+import * as angular_three from 'angular-three';
+import { NgtVector3, NgtVector2 } from 'angular-three';
+import * as _angular_core from '@angular/core';
+import { ElementRef } from '@angular/core';
+import * as postprocessing from 'postprocessing';
+import { BlendFunction, EffectComposer, Effect, BloomEffectOptions, BloomEffect, BrightnessContrastEffect, ChromaticAberrationEffect, ColorAverageEffect, ColorDepthEffect, DepthEffect, DepthOfFieldEffect, DotScreenEffect, FXAAEffect, GlitchEffect, GlitchMode, GodRaysEffect, GridEffect, HueSaturationEffect, LUT3DEffect, NoiseEffect, OutlineEffect, PixelationEffect, ScanlineEffect, SelectiveBloomEffect, SepiaEffect, ShockWaveEffect, SMAAEffect, TiltShiftEffect, ToneMappingEffect, VignetteEffect } from 'postprocessing';
+import * as THREE from 'three';
+
+/**
+ * Injection token for providing default effect options.
+ *
+ * Use `injectDefaultEffectOptions` to inject default options in effect components.
+ * Use `provideDefaultEffectOptions` to provide default options for effects.
+ *
+ * @example
+ * ```typescript
+ * @Component({
+ *   providers: [provideDefaultEffectOptions({ blendFunction: BlendFunction.ADD, opacity: 0.5 })]
+ * })
+ * export class MyEffect {}
+ * ```
+ */
+declare const injectDefaultEffectOptions: {
+    (): {
+        blendFunction?: BlendFunction;
+        opacity?: number;
+    };
+    (injectOptions: _angular_core.InjectOptions & {
+        optional?: false;
+    } & {
+        injector?: _angular_core.Injector;
+    }): {
+        blendFunction?: BlendFunction;
+        opacity?: number;
+    };
+    (injectOptions: _angular_core.InjectOptions & {
+        injector?: _angular_core.Injector;
+    }): {
+        blendFunction?: BlendFunction;
+        opacity?: number;
+    } | null;
+};
+declare const provideDefaultEffectOptions: ((value: {
+    blendFunction?: BlendFunction;
+    opacity?: number;
+} | (() => {
+    blendFunction?: BlendFunction;
+    opacity?: number;
+})) => _angular_core.Provider) & ((value: {
+    blendFunction?: BlendFunction;
+    opacity?: number;
+} | (() => {
+    blendFunction?: BlendFunction;
+    opacity?: number;
+})) => _angular_core.Provider);
+/**
+ * Component that applies blend mode settings to a postprocessing effect.
+ *
+ * This component is used internally by effect components to apply `blendFunction`
+ * and `opacity` values to the effect's blend mode.
+ *
+ * @example
+ * ```html
+ * <ngt-bloom-effect *args="[options()]">
+ *   <ngtp-effect-blend-mode />
+ * </ngt-bloom-effect>
+ * ```
+ */
+declare class NgtpEffectBlendMode {
+    /** Reference to the parent NgtpEffect directive, if available */
+    effect: NgtpEffect | null;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpEffectBlendMode, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpEffectBlendMode, "ngtp-effect-blend-mode", never, {}, {}, never, never, true, never>;
+}
+/**
+ * Base directive for postprocessing effects that provides common functionality.
+ *
+ * This directive is used as a host directive by effect components to provide:
+ * - `blendFunction`: Controls how the effect blends with the scene
+ * - `opacity`: Controls the effect's opacity
+ * - Access to the camera and invalidate function from the store
+ *
+ * @example
+ * ```typescript
+ * @Component({
+ *   hostDirectives: [{ directive: NgtpEffect, inputs: ['blendFunction', 'opacity'] }]
+ * })
+ * export class NgtpBloom {}
+ * ```
+ */
+declare class NgtpEffect {
+    /** Default effect options injected from parent providers */
+    defaultEffectOptions: {
+        blendFunction?: BlendFunction;
+        opacity?: number;
+    } | null;
+    /**
+     * The blend function used to combine this effect with the scene.
+     * @see BlendFunction from postprocessing library
+     */
+    blendFunction: _angular_core.InputSignal<BlendFunction | undefined>;
+    /**
+     * The opacity of the effect.
+     * @default undefined (uses effect's default)
+     */
+    opacity: _angular_core.InputSignal<number | undefined>;
+    private store;
+    /** The current camera from the store */
+    camera: angular_three.DeepSignal<angular_three.NgtCamera>;
+    /** Function to invalidate the render loop, triggering a re-render */
+    invalidate: _angular_core.Signal<(frames?: number) => void>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpEffect, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgtpEffect, never, never, { "blendFunction": { "alias": "blendFunction"; "required": false; "isSignal": true; }; "opacity": { "alias": "opacity"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Configuration options for the effect composer.
+ */
+interface NgtpEffectComposerOptions {
+    /**
+     * Whether the effect composer is enabled.
+     * @default true
+     */
+    enabled: boolean;
+    /**
+     * Whether to use a depth buffer.
+     * @default undefined
+     */
+    depthBuffer?: boolean;
+    /**
+     * Whether to enable the normal pass.
+     * Only used for SSGI currently, leave it disabled for everything else unless it's needed.
+     * @default undefined
+     */
+    enableNormalPass?: boolean;
+    /**
+     * Whether to use a stencil buffer.
+     * @default undefined
+     */
+    stencilBuffer?: boolean;
+    /**
+     * Whether to auto-clear before rendering.
+     * @default true
+     */
+    autoClear: boolean;
+    /**
+     * Resolution scale for the effect composer.
+     * @default undefined
+     */
+    resolutionScale?: number;
+    /**
+     * Number of samples for multisampling anti-aliasing.
+     * Set to 0 to disable multisampling.
+     * @default 8
+     */
+    multisampling: number;
+    /**
+     * The texture data type for the frame buffer.
+     * @default THREE.HalfFloatType
+     */
+    frameBufferType: THREE.TextureDataType;
+    /**
+     * The render priority for the effect composer.
+     * Higher values render later.
+     * @default 1
+     */
+    renderPriority: number;
+    /**
+     * Custom camera to use for rendering effects.
+     * If not provided, uses the default camera from the store.
+     * @default undefined
+     */
+    camera?: THREE.Camera;
+    /**
+     * Custom scene to use for rendering effects.
+     * If not provided, uses the default scene from the store.
+     * @default undefined
+     */
+    scene?: THREE.Scene;
+}
+/**
+ * Angular component that manages postprocessing effects for a Three.js scene.
+ *
+ * The effect composer wraps the postprocessing library's EffectComposer and provides
+ * a declarative way to add effects to your scene. Effects are added as children of
+ * this component and are automatically composed into an effect pass.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-bloom [options]="{ intensity: 1, luminanceThreshold: 0.9 }" />
+ *   <ngtp-vignette [options]="{ darkness: 0.5 }" />
+ * </ngtp-effect-composer>
+ * ```
+ *
+ * @example
+ * ```html
+ * <!-- With custom options -->
+ * <ngtp-effect-composer [options]="{ multisampling: 4, autoClear: false }">
+ *   <ngtp-smaa />
+ *   <ngtp-tone-mapping />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpEffectComposer {
+    /**
+     * Configuration options for the effect composer.
+     * @see NgtpEffectComposerOptions
+     */
+    options: _angular_core.InputSignalWithTransform<NgtpEffectComposerOptions, "" | Partial<NgtpEffectComposerOptions>>;
+    private store;
+    private depthBuffer;
+    private stencilBuffer;
+    private multisampling;
+    private frameBufferType;
+    private enableNormalPass;
+    private resolutionScale;
+    private enabled;
+    private renderPriority;
+    /**
+     * The scene used for rendering effects.
+     * Uses custom scene from options if provided, otherwise uses the store's scene.
+     */
+    scene: _angular_core.Signal<THREE.Scene<THREE.Object3DEventMap>>;
+    /**
+     * The camera used for rendering effects.
+     * Uses custom camera from options if provided, otherwise uses the store's camera.
+     */
+    camera: _angular_core.Signal<THREE.Camera>;
+    private groupRef;
+    /**
+     * Computed render priority based on whether the composer is enabled.
+     * Returns 0 when disabled, otherwise returns the configured renderPriority.
+     */
+    private priority;
+    /**
+     * Creates and configures the effect composer with render pass, normal pass,
+     * and depth downsampling pass based on options.
+     */
+    private composerData;
+    /**
+     * The underlying postprocessing EffectComposer instance.
+     * Can be used to access the composer directly for advanced use cases.
+     */
+    effectComposer: _angular_core.Signal<EffectComposer>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpEffectComposer, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpEffectComposer, "ngtp-effect-composer", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * Configuration options for the ASCII effect.
+ */
+interface ASCIIEffectOptions {
+    /**
+     * The font family to use for rendering characters.
+     * @default 'arial'
+     */
+    font?: string;
+    /**
+     * The character set to use for rendering, ordered from darkest to brightest.
+     * @default " .:,'-^=*+?!|0#X%WM@"
+     */
+    characters?: string;
+    /**
+     * The font size in pixels for the character texture.
+     * @default 54
+     */
+    fontSize?: number;
+    /**
+     * The size of each cell in pixels.
+     * @default 16
+     */
+    cellSize?: number;
+    /**
+     * The color of the ASCII characters in hex format.
+     * @default '#ffffff'
+     */
+    color?: string;
+    /**
+     * Whether to invert the brightness mapping.
+     * @default false
+     */
+    invert?: boolean;
+}
+/**
+ * A postprocessing effect that renders the scene as ASCII art.
+ *
+ * This effect converts the rendered scene into a grid of ASCII characters,
+ * where the character used depends on the brightness of the underlying pixels.
+ *
+ * @example
+ * ```typescript
+ * const effect = new ASCIIEffect({
+ *   cellSize: 12,
+ *   color: '#00ff00',
+ *   characters: ' .:-=+*#%@'
+ * });
+ * ```
+ */
+declare class ASCIIEffect extends Effect {
+    constructor({ font, characters, fontSize, cellSize, color, invert, }?: ASCIIEffectOptions);
+    /**
+     * Creates a texture containing all the ASCII characters.
+     *
+     * Draws each character in the character set onto a canvas and creates
+     * a texture that can be sampled in the shader.
+     *
+     * @param characters - The character set to render
+     * @param font - The font family to use
+     * @param fontSize - The font size in pixels
+     * @returns A Three.js texture containing the rendered characters
+     */
+    createCharactersTexture(characters: string, font: string, fontSize: number): THREE.Texture;
+}
+/**
+ * Angular component that applies an ASCII art postprocessing effect to the scene.
+ *
+ * Renders the scene as ASCII characters, where character selection is based on
+ * the brightness of the underlying pixels.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-ascii [options]="{ cellSize: 12, color: '#00ff00' }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpASCII {
+    /**
+     * Configuration options for the ASCII effect.
+     * @see ASCIIEffectOptions
+     */
+    options: _angular_core.InputSignalWithTransform<ASCIIEffectOptions, "" | Partial<ASCIIEffectOptions>>;
+    /** The underlying ASCIIEffect instance */
+    effect: _angular_core.Signal<ASCIIEffect>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpASCII, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpASCII, "ngtp-ascii", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Angular component that applies a bloom postprocessing effect to the scene.
+ *
+ * The bloom effect creates a glow around bright areas of the scene, simulating
+ * the way bright light bleeds in cameras and the human eye.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-bloom [options]="{ intensity: 1, luminanceThreshold: 0.9 }" />
+ * </ngtp-effect-composer>
+ * ```
+ *
+ * @example
+ * ```html
+ * <!-- With custom blend function -->
+ * <ngtp-effect-composer>
+ *   <ngtp-bloom
+ *     [blendFunction]="BlendFunction.SCREEN"
+ *     [options]="{ intensity: 0.5, luminanceSmoothing: 0.9 }"
+ *   />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpBloom {
+    /**
+     * Configuration options for the bloom effect.
+     * Accepts all BloomEffectOptions except blendFunction (use the blendFunction input instead).
+     * @see BloomEffectOptions from postprocessing library
+     */
+    options: _angular_core.InputSignal<Omit<BloomEffectOptions, "blendFunction">>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<BloomEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpBloom, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpBloom, "ngtp-bloom", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+/**
+ * Configuration options for the brightness/contrast effect.
+ * Derived from BrightnessContrastEffect constructor parameters.
+ */
+type BrightnessEffectOptions = NonNullable<ConstructorParameters<typeof BrightnessContrastEffect>[0]>;
+/**
+ * Angular component that applies brightness and contrast adjustments to the scene.
+ *
+ * This effect allows you to modify the overall brightness and contrast of the
+ * rendered scene as a postprocessing step.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-brightness-contrast [options]="{ brightness: 0.1, contrast: 0.2 }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpBrightnessContrast {
+    /**
+     * Configuration options for the brightness/contrast effect.
+     * @see BrightnessEffectOptions
+     */
+    options: _angular_core.InputSignal<Omit<{
+        blendFunction?: postprocessing.BlendFunction;
+        brightness?: number;
+        contrast?: number;
+    }, "blendFunction">>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<BrightnessContrastEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpBrightnessContrast, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpBrightnessContrast, "ngtp-brightness-contrast", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+/**
+ * Configuration options for the chromatic aberration effect.
+ * Derived from ChromaticAberrationEffect constructor parameters.
+ */
+type ChromaticAberrationEffectOptions = Partial<NonNullable<ConstructorParameters<typeof ChromaticAberrationEffect>[0]>>;
+/**
+ * Angular component that applies a chromatic aberration effect to the scene.
+ *
+ * Chromatic aberration simulates the color fringing that occurs in real camera lenses
+ * when different wavelengths of light are focused at different distances.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-chromatic-aberration [options]="{ offset: [0.002, 0.002] }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpChromaticAberration {
+    /**
+     * Configuration options for the chromatic aberration effect.
+     * @see ChromaticAberrationEffectOptions
+     */
+    options: _angular_core.InputSignal<Omit<Partial<{
+        blendFunction?: postprocessing.BlendFunction;
+        offset?: THREE.Vector2;
+        radialModulation: boolean;
+        modulationOffset: number;
+    }>, "blendFunction">>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<ChromaticAberrationEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpChromaticAberration, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpChromaticAberration, "ngtp-chromatic-aberration", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+/**
+ * Angular component that applies a color averaging effect to the scene.
+ *
+ * This effect converts the scene to grayscale by averaging the color channels,
+ * which can create a desaturated or monochrome look.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-color-average />
+ * </ngtp-effect-composer>
+ * ```
+ *
+ * @example
+ * ```html
+ * <!-- With custom blend function -->
+ * <ngtp-effect-composer>
+ *   <ngtp-color-average [options]="{ blendFunction: BlendFunction.MULTIPLY }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpColorAverage {
+    /**
+     * Configuration options for the color average effect.
+     * @default { blendFunction: BlendFunction.NORMAL }
+     */
+    options: _angular_core.InputSignalWithTransform<{
+        blendFunction: BlendFunction;
+    }, "" | Partial<{
+        blendFunction: BlendFunction;
+    }>>;
+    effectRef: _angular_core.Signal<ElementRef<ColorAverageEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpColorAverage, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpColorAverage, "ngtp-color-average", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * Configuration options for the color depth effect.
+ * Derived from ColorDepthEffect constructor parameters.
+ */
+type ColorDepthEffectOptions = Partial<NonNullable<ConstructorParameters<typeof ColorDepthEffect>[0]>>;
+/**
+ * Angular component that applies a color depth reduction effect to the scene.
+ *
+ * This effect reduces the number of colors in the scene, creating a posterized
+ * or retro look similar to older display hardware with limited color palettes.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-color-depth [options]="{ bits: 4 }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpColorDepth {
+    /**
+     * Configuration options for the color depth effect.
+     * @see ColorDepthEffectOptions
+     */
+    options: _angular_core.InputSignal<Omit<Partial<{
+        blendFunction?: postprocessing.BlendFunction;
+        bits?: number;
+    }>, "blendFunction">>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<ColorDepthEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpColorDepth, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpColorDepth, "ngtp-color-depth", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+/**
+ * Configuration options for the depth effect.
+ * Derived from DepthEffect constructor parameters.
+ */
+type DepthEffectOptions = Partial<NonNullable<ConstructorParameters<typeof DepthEffect>[0]>>;
+/**
+ * Angular component that visualizes the scene's depth buffer.
+ *
+ * This effect renders the depth information of the scene, which can be useful
+ * for debugging or creating stylized depth-based visualizations.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-depth [options]="{ inverted: true }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpDepth {
+    /**
+     * Configuration options for the depth effect.
+     * @see DepthEffectOptions
+     */
+    options: _angular_core.InputSignal<Omit<Partial<{
+        blendFunction?: postprocessing.BlendFunction;
+        inverted?: boolean;
+    }>, "blendFunction">>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<DepthEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpDepth, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpDepth, "ngtp-depth", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+/**
+ * Configuration options for the depth of field effect.
+ * Extends DepthOfFieldEffect options with additional target and depth texture support.
+ */
+type DOFOptions = NonNullable<ConstructorParameters<typeof DepthOfFieldEffect>[1]> & Partial<{
+    target: NgtVector3;
+    depthTexture: {
+        texture: THREE.Texture;
+        packing: THREE.DepthPackingStrategies;
+    };
+}>;
+/**
+ * Angular component that applies a depth of field effect to the scene.
+ *
+ * This effect simulates the focus behavior of real camera lenses, blurring
+ * objects that are outside the focal range. Can be configured for autofocus
+ * by providing a target position.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-depth-of-field [options]="{ focusDistance: 0, focalLength: 0.02, bokehScale: 2 }" />
+ * </ngtp-effect-composer>
+ * ```
+ *
+ * @example
+ * ```html
+ * <!-- With autofocus target -->
+ * <ngtp-effect-composer>
+ *   <ngtp-depth-of-field [options]="{ target: [0, 0, 5], bokehScale: 3 }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpDepthOfField {
+    /**
+     * Configuration options for the depth of field effect.
+     * @see DOFOptions
+     */
+    options: _angular_core.InputSignal<DOFOptions>;
+    private effectComposer;
+    /**
+     * Creates the DepthOfFieldEffect instance with the configured options.
+     * Enables autofocus if a target is provided and applies depth texture settings.
+     */
+    effect: _angular_core.Signal<DepthOfFieldEffect>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpDepthOfField, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpDepthOfField, "ngtp-depth-of-field", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Configuration options for the dot screen effect.
+ * Derived from DotScreenEffect constructor parameters.
+ */
+type DotScreenEffectOptions = Partial<NonNullable<ConstructorParameters<typeof DotScreenEffect>[0]>>;
+/**
+ * Angular component that applies a dot screen effect to the scene.
+ *
+ * This effect overlays a pattern of dots on the scene, creating a halftone
+ * or comic book style appearance.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-dot-screen [options]="{ scale: 1.5, angle: Math.PI * 0.25 }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpDotScreen {
+    /**
+     * Configuration options for the dot screen effect.
+     * @see DotScreenEffectOptions
+     */
+    options: _angular_core.InputSignal<Omit<Partial<{
+        blendFunction?: postprocessing.BlendFunction;
+        angle?: number;
+        scale?: number;
+    }>, "blendFunction">>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<DotScreenEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpDotScreen, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpDotScreen, "ngtp-dot-screen", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+/**
+ * Configuration options for the FXAA effect.
+ * Derived from FXAAEffect constructor parameters.
+ */
+type FXAAEffectOptions = Partial<NonNullable<ConstructorParameters<typeof FXAAEffect>[0]>>;
+/**
+ * Angular component that applies Fast Approximate Anti-Aliasing (FXAA) to the scene.
+ *
+ * FXAA is a fast, single-pass anti-aliasing technique that smooths jagged edges
+ * in the rendered image. It's less demanding than multisampling but may blur
+ * some fine details.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer [options]="{ multisampling: 0 }">
+ *   <ngtp-fxaa />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpFXAA {
+    /**
+     * Configuration options for the FXAA effect.
+     * @see FXAAEffectOptions
+     */
+    options: _angular_core.InputSignal<Omit<Partial<{
+        blendFunction?: postprocessing.BlendFunction;
+    }>, "blendFunction">>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<FXAAEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpFXAA, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpFXAA, "ngtp-fxaa", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+/**
+ * Configuration options for the glitch effect.
+ * Extends GlitchEffect options with additional control properties.
+ */
+type GlitchOptions = NonNullable<ConstructorParameters<typeof GlitchEffect>[0]> & Partial<{
+    /** The glitch mode (SPORADIC, CONSTANT_MILD, CONSTANT_WILD, DISABLED) */
+    mode: GlitchMode;
+    /** Whether the glitch effect is active */
+    active: boolean;
+    /** Delay range between glitches [min, max] in seconds */
+    delay: NgtVector2;
+    /** Duration range of glitches [min, max] in seconds */
+    duration: NgtVector2;
+    /** Chromatic aberration offset */
+    chromaticAberrationOffset: NgtVector2;
+    /** Strength of the glitch effect [x, y] */
+    strength: NgtVector2;
+}>;
+/**
+ * Angular component that applies a glitch effect to the scene.
+ *
+ * This effect simulates digital glitches with customizable timing, strength,
+ * and chromatic aberration. Can be toggled on/off and configured for different
+ * glitch modes.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-glitch [options]="{ delay: [1.5, 3.5], duration: [0.6, 1.0] }" />
+ * </ngtp-effect-composer>
+ * ```
+ *
+ * @example
+ * ```html
+ * <!-- Constant glitch mode -->
+ * <ngtp-effect-composer>
+ *   <ngtp-glitch [options]="{ mode: GlitchMode.CONSTANT_MILD, active: true }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpGlitch {
+    /**
+     * Configuration options for the glitch effect.
+     * @default { active: true }
+     * @see GlitchOptions
+     */
+    options: _angular_core.InputSignalWithTransform<GlitchOptions, "" | Partial<{
+        active: boolean;
+    }>>;
+    private active;
+    private mode;
+    private ratio;
+    private dtSize;
+    private columns;
+    private blendFunction;
+    private perturbationMap;
+    private delay;
+    private duration;
+    private chromaticAberrationOffset;
+    private strength;
+    private store;
+    /**
+     * The underlying GlitchEffect instance.
+     * Created with the configured options and vector2 parameters.
+     */
+    effect: _angular_core.Signal<GlitchEffect>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpGlitch, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpGlitch, "ngtp-glitch", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Angular component that applies a god rays (volumetric lighting) effect to the scene.
+ *
+ * This effect creates light shafts emanating from a light source, simulating
+ * the way light scatters through atmospheric particles. Requires a sun/light
+ * source mesh to generate the rays from.
+ *
+ * @example
+ * ```html
+ * <ngt-mesh #sun [position]="[0, 5, -10]">
+ *   <ngt-sphere-geometry />
+ *   <ngt-mesh-basic-material color="yellow" />
+ * </ngt-mesh>
+ *
+ * <ngtp-effect-composer>
+ *   <ngtp-god-rays [options]="{ sun: sunRef, density: 0.96 }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpGodRays {
+    /**
+     * Configuration options for the god rays effect.
+     * Must include a `sun` property with the light source reference.
+     * @see GodRaysOptions
+     */
+    options: _angular_core.InputSignal<{
+        blendFunction?: postprocessing.BlendFunction;
+        samples?: number;
+        density?: number;
+        decay?: number;
+        weight?: number;
+        exposure?: number;
+        clampMax?: number;
+        resolutionScale?: number;
+        resolutionX?: number;
+        resolutionY?: number;
+        width?: number;
+        height?: number;
+        kernelSize?: postprocessing.KernelSize;
+        blur?: boolean;
+    } & {
+        /**
+         * The light source for the god rays.
+         * Can be a Mesh, Points, ElementRef, or a Signal of any of these.
+         */
+        sun: THREE.Mesh | THREE.Points | ElementRef<THREE.Mesh | THREE.Points> | (() => THREE.Mesh | THREE.Points | ElementRef<THREE.Mesh | THREE.Points> | undefined);
+    }>;
+    private effectComposer;
+    private effectOptions;
+    private sun;
+    /**
+     * Resolves the sun reference to the actual Three.js object.
+     * Handles both direct references and function references.
+     */
+    private sunElement;
+    /**
+     * The underlying GodRaysEffect instance.
+     * Created with the camera, sun element, and configured options.
+     */
+    effect: _angular_core.Signal<GodRaysEffect>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpGodRays, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpGodRays, "ngtp-god-rays", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Configuration options for the grid effect.
+ * Extends GridEffect options with optional size configuration.
+ */
+type GridOptions = NonNullable<ConstructorParameters<typeof GridEffect>[0]> & Partial<{
+    /** Custom size for the grid effect */
+    size: {
+        width: number;
+        height: number;
+    };
+}>;
+/**
+ * Angular component that applies a grid overlay effect to the scene.
+ *
+ * This effect overlays a grid pattern on the rendered scene, which can be
+ * useful for technical visualization or stylized effects.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-grid [options]="{ scale: 1.5, lineWidth: 0.5 }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpGrid {
+    /**
+     * Configuration options for the grid effect.
+     * @see GridOptions
+     */
+    options: _angular_core.InputSignal<GridOptions>;
+    private effectOptions;
+    private size;
+    /** The underlying GridEffect instance */
+    effect: _angular_core.Signal<GridEffect>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpGrid, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpGrid, "ngtp-grid", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Configuration options for the hue/saturation effect.
+ * Derived from HueSaturationEffect constructor parameters.
+ */
+type HueSaturationEffectOptions = Partial<NonNullable<ConstructorParameters<typeof HueSaturationEffect>[0]>>;
+/**
+ * Angular component that applies hue and saturation adjustments to the scene.
+ *
+ * This effect allows you to shift the hue and adjust the saturation of the
+ * rendered scene as a postprocessing step.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-hue-saturation [options]="{ hue: 0.5, saturation: 0.2 }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpHueSaturation {
+    /**
+     * Configuration options for the hue/saturation effect.
+     * @see HueSaturationEffectOptions
+     */
+    options: _angular_core.InputSignal<Omit<Partial<{
+        blendFunction?: postprocessing.BlendFunction;
+        hue?: number;
+        saturation?: number;
+    }>, "blendFunction">>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<HueSaturationEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpHueSaturation, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpHueSaturation, "ngtp-hue-saturation", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+/**
+ * A postprocessing effect that simulates camera lens flares.
+ *
+ * Creates realistic lens flare effects including glare, ghosts, star bursts,
+ * and anamorphic flares. Can be animated and positioned dynamically.
+ *
+ * @example
+ * ```typescript
+ * const effect = new LensFlareEffect({
+ *   glareSize: 0.3,
+ *   starPoints: 8,
+ *   animated: true
+ * });
+ * ```
+ */
+declare class LensFlareEffect extends Effect {
+    /**
+     * Creates a new LensFlareEffect instance.
+     *
+     * @param options - Configuration options for the lens flare
+     * @param options.blendFunction - How to blend with the scene
+     * @param options.enabled - Whether the effect is enabled
+     * @param options.glareSize - Size of the glare
+     * @param options.lensPosition - Position of the lens on screen
+     * @param options.iResolution - Resolution of the effect
+     * @param options.starPoints - Number of points in the star pattern
+     * @param options.flareSize - Size of individual flares
+     * @param options.flareSpeed - Animation speed of flares
+     * @param options.flareShape - Shape parameter for flares
+     * @param options.animated - Whether to animate the effect
+     * @param options.anamorphic - Enable anamorphic lens simulation
+     * @param options.colorGain - Color tint for the effect
+     * @param options.lensDirtTexture - Texture for lens dirt overlay
+     * @param options.haloScale - Scale of the halo effect
+     * @param options.secondaryGhosts - Enable secondary ghost images
+     * @param options.aditionalStreaks - Enable additional streak effects
+     * @param options.ghostScale - Scale of ghost images
+     * @param options.opacity - Opacity of the effect
+     * @param options.starBurst - Enable star burst effect
+     */
+    constructor({ blendFunction, enabled, glareSize, lensPosition, iResolution, starPoints, flareSize, flareSpeed, flareShape, animated, anamorphic, colorGain, lensDirtTexture, haloScale, secondaryGhosts, aditionalStreaks, ghostScale, opacity, starBurst, }?: {
+        blendFunction?: BlendFunction | undefined;
+        enabled?: boolean | undefined;
+        glareSize?: number | undefined;
+        lensPosition?: number[] | undefined;
+        iResolution?: number[] | undefined;
+        starPoints?: number | undefined;
+        flareSize?: number | undefined;
+        flareSpeed?: number | undefined;
+        flareShape?: number | undefined;
+        animated?: boolean | undefined;
+        anamorphic?: boolean | undefined;
+        colorGain?: THREE.Color | undefined;
+        lensDirtTexture?: THREE.Texture<unknown> | null | undefined;
+        haloScale?: number | undefined;
+        secondaryGhosts?: boolean | undefined;
+        aditionalStreaks?: boolean | undefined;
+        ghostScale?: number | undefined;
+        opacity?: number | undefined;
+        starBurst?: boolean | undefined;
+    });
+    /**
+     * Updates the effect's time uniform for animation.
+     *
+     * @param _renderer - The WebGL renderer (unused)
+     * @param _inputBuffer - The input render target (unused)
+     * @param deltaTime - Time elapsed since last frame
+     */
+    update(_renderer: THREE.WebGLRenderer, _inputBuffer: THREE.WebGLRenderTarget, deltaTime: number): void;
+}
+/**
+ * Configuration options for the Angular lens flare component.
+ * Extends LensFlareEffect options with position and mouse tracking.
+ */
+type LensFlareOptions = ConstructorParameters<typeof LensFlareEffect>[0] & {
+    /** World position of the light source for the flare */
+    position: NgtVector3;
+    /** Whether the flare should follow the mouse cursor */
+    followMouse: boolean;
+    /** Smoothing time for opacity transitions */
+    smoothTime: number;
+};
+/**
+ * Angular component that applies a lens flare effect to the scene.
+ *
+ * This effect simulates realistic camera lens flares with support for
+ * dynamic positioning, mouse following, and occlusion detection.
+ * The flare automatically fades when occluded by scene objects.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-lens-flare [options]="{ position: [10, 5, -20], glareSize: 0.3 }" />
+ * </ngtp-effect-composer>
+ * ```
+ *
+ * @example
+ * ```html
+ * <!-- Mouse-following flare -->
+ * <ngtp-effect-composer>
+ *   <ngtp-lens-flare [options]="{ followMouse: true, smoothTime: 0.5 }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpLensFlare {
+    /**
+     * Configuration options for the lens flare effect.
+     * @see LensFlareOptions
+     */
+    options: _angular_core.InputSignalWithTransform<{
+        blendFunction?: BlendFunction | undefined;
+        enabled?: boolean | undefined;
+        glareSize?: number | undefined;
+        lensPosition?: number[] | undefined;
+        iResolution?: number[] | undefined;
+        starPoints?: number | undefined;
+        flareSize?: number | undefined;
+        flareSpeed?: number | undefined;
+        flareShape?: number | undefined;
+        animated?: boolean | undefined;
+        anamorphic?: boolean | undefined;
+        colorGain?: THREE.Color | undefined;
+        lensDirtTexture?: THREE.Texture<unknown> | null | undefined;
+        haloScale?: number | undefined;
+        secondaryGhosts?: boolean | undefined;
+        aditionalStreaks?: boolean | undefined;
+        ghostScale?: number | undefined;
+        opacity?: number | undefined;
+        starBurst?: boolean | undefined;
+    } & {
+        /** World position of the light source for the flare */
+        position: NgtVector3;
+        /** Whether the flare should follow the mouse cursor */
+        followMouse: boolean;
+        /** Smoothing time for opacity transitions */
+        smoothTime: number;
+    }, "" | Partial<{
+        blendFunction?: BlendFunction | undefined;
+        enabled?: boolean | undefined;
+        glareSize?: number | undefined;
+        lensPosition?: number[] | undefined;
+        iResolution?: number[] | undefined;
+        starPoints?: number | undefined;
+        flareSize?: number | undefined;
+        flareSpeed?: number | undefined;
+        flareShape?: number | undefined;
+        animated?: boolean | undefined;
+        anamorphic?: boolean | undefined;
+        colorGain?: THREE.Color | undefined;
+        lensDirtTexture?: THREE.Texture<unknown> | null | undefined;
+        haloScale?: number | undefined;
+        secondaryGhosts?: boolean | undefined;
+        aditionalStreaks?: boolean | undefined;
+        ghostScale?: number | undefined;
+        opacity?: number | undefined;
+        starBurst?: boolean | undefined;
+    } & {
+        /** World position of the light source for the flare */
+        position: NgtVector3;
+        /** Whether the flare should follow the mouse cursor */
+        followMouse: boolean;
+        /** Smoothing time for opacity transitions */
+        smoothTime: number;
+    }>>;
+    private store;
+    private effectComposer;
+    private effectOptions;
+    private position;
+    /** Cached vector for projecting 3D position to screen space */
+    private projectedPosition;
+    /** Cached vector for 2D mouse/raycaster coordinates */
+    private mouse2d;
+    /** The underlying LensFlareEffect instance */
+    effect: _angular_core.Signal<LensFlareEffect>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpLensFlare, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpLensFlare, "ngtp-lens-flare", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Configuration options for the LUT (Look-Up Table) effect.
+ */
+interface LUTOptions {
+    /**
+     * The 3D LUT texture to apply for color grading.
+     * Can be loaded using LUTCubeLoader or LUT3dlLoader.
+     */
+    lut: THREE.Texture;
+    /**
+     * The blend function for combining with the scene.
+     * @default BlendFunction.SRC
+     */
+    blendFunction?: BlendFunction;
+    /**
+     * Whether to use tetrahedral interpolation for smoother color transitions.
+     * @default false
+     */
+    tetrahedralInterpolation?: boolean;
+}
+/**
+ * Angular component that applies a LUT (Look-Up Table) color grading effect.
+ *
+ * LUTs are used for color grading in film and photography. This effect applies
+ * a 3D LUT texture to transform the colors of the rendered scene.
+ *
+ * @example
+ * ```typescript
+ * // In component
+ * lutTexture = injectLoader(() => LUTCubeLoader, () => 'path/to/lut.cube');
+ * ```
+ *
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-lut [options]="{ lut: lutTexture() }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpLUT {
+    /**
+     * Configuration options for the LUT effect.
+     * Must include a `lut` texture.
+     * @see LUTOptions
+     */
+    options: _angular_core.InputSignal<LUTOptions>;
+    private lut;
+    private tetrahedralInterpolation;
+    private store;
+    /** The underlying LUT3DEffect instance */
+    effect: _angular_core.Signal<LUT3DEffect>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpLUT, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpLUT, "ngtp-lut", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Configuration options for the noise effect.
+ * Derived from NoiseEffect constructor parameters.
+ */
+type NoiseEffectOptions = Partial<NonNullable<ConstructorParameters<typeof NoiseEffect>[0]>>;
+/**
+ * Angular component that applies a noise/grain effect to the scene.
+ *
+ * This effect adds film grain or noise to the rendered image, which can
+ * add a cinematic quality or help hide banding in gradients.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-noise [options]="{ premultiply: true }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpNoise {
+    /**
+     * Configuration options for the noise effect.
+     * @see NoiseEffectOptions
+     */
+    options: _angular_core.InputSignal<Omit<Partial<{
+        blendFunction?: BlendFunction;
+        premultiply?: boolean;
+    }>, "blendFunction">>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<NoiseEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpNoise, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpNoise, "ngtp-noise", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+/**
+ * Configuration options for the outline effect.
+ * Extends OutlineEffect options with selection management.
+ */
+type NgtpOutlineOptions = ConstructorParameters<typeof OutlineEffect>[2] & {
+    /**
+     * Array of objects to outline.
+     * Can be Object3D instances or ElementRefs.
+     * Not needed if using NgtSelectionApi.
+     */
+    selection?: Array<THREE.Object3D | ElementRef<THREE.Object3D>>;
+    /**
+     * The layer used for selection rendering.
+     * @default 10
+     */
+    selectionLayer: number;
+};
+/**
+ * Angular component that applies an outline effect to selected objects.
+ *
+ * This effect draws an outline around specified objects in the scene.
+ * Can be used with NgtSelectionApi for declarative selection or with
+ * manual selection via the options input.
+ *
+ * @example
+ * ```html
+ * <!-- With NgtSelectionApi (recommended) -->
+ * <ngt-group [select]="hovered()" (pointerenter)="hovered.set(true)">
+ *   <ngt-mesh>...</ngt-mesh>
+ * </ngt-group>
+ *
+ * <ngtp-effect-composer>
+ *   <ngtp-outline [options]="{ edgeStrength: 2.5, blur: true }" />
+ * </ngtp-effect-composer>
+ * ```
+ *
+ * @example
+ * ```html
+ * <!-- With manual selection -->
+ * <ngtp-effect-composer>
+ *   <ngtp-outline [options]="{ selection: [meshRef.nativeElement], edgeStrength: 5 }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpOutline {
+    /**
+     * Configuration options for the outline effect.
+     * @see NgtpOutlineOptions
+     */
+    options: _angular_core.InputSignalWithTransform<{
+        blendFunction?: postprocessing.BlendFunction;
+        patternTexture?: THREE.Texture;
+        patternScale?: number;
+        edgeStrength?: number;
+        pulseSpeed?: number;
+        visibleEdgeColor?: number;
+        hiddenEdgeColor?: number;
+        multisampling?: number;
+        resolutionScale?: number;
+        resolutionX?: number;
+        resolutionY?: number;
+        width?: number;
+        height?: number;
+        kernelSize?: postprocessing.KernelSize;
+        blur?: boolean;
+        xRay?: boolean;
+    } & {
+        /**
+         * Array of objects to outline.
+         * Can be Object3D instances or ElementRefs.
+         * Not needed if using NgtSelectionApi.
+         */
+        selection?: Array<THREE.Object3D | ElementRef<THREE.Object3D>>;
+        /**
+         * The layer used for selection rendering.
+         * @default 10
+         */
+        selectionLayer: number;
+    }, "" | Partial<{
+        blendFunction?: postprocessing.BlendFunction;
+        patternTexture?: THREE.Texture;
+        patternScale?: number;
+        edgeStrength?: number;
+        pulseSpeed?: number;
+        visibleEdgeColor?: number;
+        hiddenEdgeColor?: number;
+        multisampling?: number;
+        resolutionScale?: number;
+        resolutionX?: number;
+        resolutionY?: number;
+        width?: number;
+        height?: number;
+        kernelSize?: postprocessing.KernelSize;
+        blur?: boolean;
+        xRay?: boolean;
+    } & {
+        /**
+         * Array of objects to outline.
+         * Can be Object3D instances or ElementRefs.
+         * Not needed if using NgtSelectionApi.
+         */
+        selection?: Array<THREE.Object3D | ElementRef<THREE.Object3D>>;
+        /**
+         * The layer used for selection rendering.
+         * @default 10
+         */
+        selectionLayer: number;
+    }>>;
+    private selectionApi;
+    private effectComposer;
+    private store;
+    private selection;
+    private selectionLayer;
+    private blendFunction;
+    private patternTexture;
+    private edgeStrength;
+    private pulseSpeed;
+    private visibleEdgeColor;
+    private hiddenEdgeColor;
+    private width;
+    private height;
+    private kernelSize;
+    private blur;
+    private xRay;
+    private restOptions;
+    /**
+     * The underlying OutlineEffect instance.
+     * Created with the scene, camera, and configured options.
+     */
+    effect: _angular_core.Signal<OutlineEffect>;
+    constructor();
+    /**
+     * Handles changes to the selection and updates the outline effect.
+     *
+     * @param selected - Function returning the currently selected objects
+     * @param _effect - Function returning the OutlineEffect instance
+     * @param _invalidate - Function returning the invalidate callback
+     * @returns Cleanup function to clear the selection
+     */
+    private handleSelectionChangeEffect;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpOutline, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpOutline, "ngtp-outline", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Configuration options for the pixelation effect.
+ */
+interface PixelationOptions {
+    /**
+     * The pixel granularity - higher values create larger pixels.
+     * @default 5
+     */
+    granularity: number;
+}
+/**
+ * Angular component that applies a pixelation effect to the scene.
+ *
+ * This effect reduces the resolution of the rendered image to create
+ * a retro, 8-bit style appearance.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-pixelation [options]="{ granularity: 10 }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpPixelation {
+    /**
+     * Configuration options for the pixelation effect.
+     * @default { granularity: 5 }
+     * @see PixelationOptions
+     */
+    options: _angular_core.InputSignalWithTransform<{
+        granularity: number;
+    }, "" | Partial<{
+        granularity: number;
+    }>>;
+    private granularity;
+    /** The underlying PixelationEffect instance */
+    effect: _angular_core.Signal<PixelationEffect>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpPixelation, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpPixelation, "ngtp-pixelation", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Configuration options for the scanline effect.
+ * Derived from ScanlineEffect constructor parameters.
+ */
+type ScanlineEffectOptions = Partial<NonNullable<ConstructorParameters<typeof ScanlineEffect>[0]>>;
+/**
+ * Angular component that applies a scanline effect to the scene.
+ *
+ * This effect overlays horizontal scanlines on the image, simulating
+ * the appearance of old CRT monitors or television screens.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-scanline [options]="{ density: 2.0 }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpScanline {
+    /**
+     * Configuration options for the scanline effect.
+     * @default { density: 1.25 }
+     * @see ScanlineEffectOptions
+     */
+    options: _angular_core.InputSignalWithTransform<Omit<Partial<{
+        blendFunction?: BlendFunction;
+        density?: number;
+    }>, "blendFunction">, "" | Partial<Omit<Partial<{
+        blendFunction?: BlendFunction;
+        density?: number;
+    }>, "blendFunction">>>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<ScanlineEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpScanline, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpScanline, "ngtp-scanline", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+/**
+ * Configuration options for the selective bloom effect.
+ * Extends BloomEffectOptions with selection control properties.
+ */
+type SelectiveBloomOptions = BloomEffectOptions & {
+    /**
+     * The layer used for selection rendering.
+     * @default 10
+     */
+    selectionLayer: number;
+    /**
+     * Whether to invert the selection (bloom everything except selected).
+     * @default false
+     */
+    inverted: boolean;
+    /**
+     * Whether to ignore the background in the bloom effect.
+     * @default false
+     */
+    ignoreBackground: boolean;
+};
+/**
+ * Angular component that applies bloom only to selected objects.
+ *
+ * Unlike the standard bloom effect, selective bloom allows you to specify
+ * which objects should glow. Requires light sources to be provided for
+ * proper rendering.
+ *
+ * Can be used with NgtSelectionApi for declarative selection or with
+ * manual selection via the selection input.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-selective-bloom
+ *     [lights]="[ambientLightRef, pointLightRef]"
+ *     [selection]="[glowingMeshRef]"
+ *     [options]="{ intensity: 2, luminanceThreshold: 0 }"
+ *   />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpSelectiveBloom {
+    /**
+     * Light sources that should be included in the bloom calculation.
+     * Required for proper selective bloom rendering.
+     */
+    lights: _angular_core.InputSignal<THREE.Object3D<THREE.Object3DEventMap>[] | ElementRef<THREE.Object3D<THREE.Object3DEventMap> | undefined>[]>;
+    /**
+     * Objects to apply bloom to.
+     * Can be a single object, array of objects, or ElementRefs.
+     * Not needed if using NgtSelectionApi.
+     * @default []
+     */
+    selection: _angular_core.InputSignal<THREE.Object3D<THREE.Object3DEventMap> | THREE.Object3D<THREE.Object3DEventMap>[] | ElementRef<THREE.Object3D<THREE.Object3DEventMap> | undefined> | ElementRef<THREE.Object3D<THREE.Object3DEventMap> | undefined>[]>;
+    /**
+     * Configuration options for the selective bloom effect.
+     * @see SelectiveBloomOptions
+     */
+    options: _angular_core.InputSignalWithTransform<SelectiveBloomOptions, "" | Partial<SelectiveBloomOptions>>;
+    private blendFunction;
+    private luminanceThreshold;
+    private luminanceSmoothing;
+    private mipmapBlur;
+    private intensity;
+    private radius;
+    private levels;
+    private kernelSize;
+    private resolutionScale;
+    private width;
+    private height;
+    private resolutionX;
+    private resolutionY;
+    private inverted;
+    private ignoreBackground;
+    private selectionLayer;
+    private store;
+    private effectComposer;
+    private selectionApi;
+    private resolvedLights;
+    private resolvedSelected;
+    private resolvedNgtSelected;
+    /**
+     * The underlying SelectiveBloomEffect instance.
+     * Created with the scene, camera, and configured options.
+     */
+    effect: _angular_core.Signal<SelectiveBloomEffect>;
+    constructor();
+    /**
+     * Enables the selection layer on a light source.
+     *
+     * @param effect - The SelectiveBloomEffect instance
+     * @param light - The light to enable on the selection layer
+     */
+    private addLight;
+    /**
+     * Disables the selection layer on a light source.
+     *
+     * @param effect - The SelectiveBloomEffect instance
+     * @param light - The light to disable from the selection layer
+     */
+    private removeLight;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpSelectiveBloom, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpSelectiveBloom, "ngtp-selective-bloom", never, { "lights": { "alias": "lights"; "required": true; "isSignal": true; }; "selection": { "alias": "selection"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Configuration options for the sepia effect.
+ * Derived from SepiaEffect constructor parameters.
+ */
+type SepiaEffectOptions = Partial<NonNullable<ConstructorParameters<typeof SepiaEffect>[0]>>;
+/**
+ * Angular component that applies a sepia tone effect to the scene.
+ *
+ * This effect gives the rendered image a warm, brownish tint similar to
+ * old photographs, creating a vintage or nostalgic appearance.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-sepia [options]="{ intensity: 0.5 }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpSepia {
+    /**
+     * Configuration options for the sepia effect.
+     * @see SepiaEffectOptions
+     */
+    options: _angular_core.InputSignal<Omit<Partial<{
+        blendFunction?: postprocessing.BlendFunction;
+        intensity?: number;
+    }>, "blendFunction">>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<SepiaEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpSepia, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpSepia, "ngtp-sepia", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+/**
+ * Configuration options for the shock wave effect.
+ * Derived from ShockWaveEffect constructor parameters.
+ */
+type ShockWaveEffectOptions = Partial<NonNullable<ConstructorParameters<typeof ShockWaveEffect>[0]>>;
+/**
+ * Angular component that applies a shock wave distortion effect.
+ *
+ * This effect creates an expanding ring distortion that simulates a
+ * shock wave or explosion ripple emanating from a point in the scene.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-shock-wave
+ *     [options]="{ speed: 2, maxRadius: 1, waveSize: 0.2, amplitude: 0.05 }"
+ *   />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpShockWave {
+    /**
+     * Configuration options for the shock wave effect.
+     * @see ShockWaveEffectOptions
+     */
+    options: _angular_core.InputSignal<Omit<Partial<THREE.Camera>, "blendFunction">>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<ShockWaveEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpShockWave, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpShockWave, "ngtp-shock-wave", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+/**
+ * Configuration options for the SMAA effect.
+ * Derived from SMAAEffect constructor parameters.
+ */
+type SMAAEffectOptions = Partial<NonNullable<ConstructorParameters<typeof SMAAEffect>[0]>>;
+/**
+ * Angular component that applies Subpixel Morphological Anti-Aliasing (SMAA).
+ *
+ * SMAA is a high-quality, efficient anti-aliasing technique that provides
+ * better results than FXAA while being less demanding than multisampling.
+ * It's particularly effective at smoothing edges while preserving sharpness.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer [options]="{ multisampling: 0 }">
+ *   <ngtp-smaa />
+ * </ngtp-effect-composer>
+ * ```
+ *
+ * @example
+ * ```html
+ * <!-- With preset -->
+ * <ngtp-effect-composer>
+ *   <ngtp-smaa [options]="{ preset: SMAAPreset.ULTRA }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpSMAA {
+    /**
+     * Configuration options for the SMAA effect.
+     * @see SMAAEffectOptions
+     */
+    options: _angular_core.InputSignal<Omit<Partial<{
+        preset?: postprocessing.SMAAPreset;
+        edgeDetectionMode?: postprocessing.EdgeDetectionMode;
+        predicationMode?: postprocessing.PredicationMode;
+    }>, "blendFunction">>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<SMAAEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpSMAA, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpSMAA, "ngtp-smaa", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+/**
+ * Configuration options for the tilt-shift effect.
+ * Derived from TiltShiftEffect constructor parameters.
+ */
+type TiltShiftEffectOptions = Partial<NonNullable<ConstructorParameters<typeof TiltShiftEffect>[0]>>;
+/**
+ * Angular component that applies a tilt-shift blur effect.
+ *
+ * This effect simulates the shallow depth of field look from tilt-shift
+ * photography, creating a "miniature" or "diorama" appearance where only
+ * a horizontal band of the image is in focus.
+ *
+ * Uses the postprocessing library's built-in TiltShiftEffect.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-tilt-shift [options]="{ blur: 0.5, offset: 0.5 }" />
+ * </ngtp-effect-composer>
+ * ```
+ *
+ * @see NgtpTiltShift2 for an alternative implementation with different parameters
+ */
+declare class NgtpTiltShift {
+    /**
+     * Configuration options for the tilt-shift effect.
+     * @see TiltShiftEffectOptions
+     */
+    options: _angular_core.InputSignal<Omit<Partial<{
+        blendFunction?: BlendFunction;
+        offset?: number;
+        rotation?: number;
+        focusArea?: number;
+        feather?: number;
+        bias?: number;
+        kernelSize?: postprocessing.KernelSize;
+        resolutionScale?: number;
+        resolutionX?: number;
+        resolutionY?: number;
+    }>, "blendFunction">>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<TiltShiftEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpTiltShift, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpTiltShift, "ngtp-tilt-shift", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+/**
+ * A custom tilt-shift effect with line-based focus control.
+ *
+ * This effect provides a different approach to tilt-shift compared to
+ * the standard TiltShiftEffect, allowing you to define a focus line
+ * between two screen-space points.
+ *
+ * @example
+ * ```typescript
+ * const effect = new TiltShift2Effect({
+ *   blur: 0.2,
+ *   start: [0.5, 0.3],
+ *   end: [0.5, 0.7]
+ * });
+ * ```
+ */
+declare class TiltShift2Effect extends Effect {
+    /**
+     * Creates a new TiltShift2Effect instance.
+     *
+     * @param options - Configuration options
+     * @param options.blendFunction - How to blend with the scene
+     * @param options.blur - Blur intensity [0, 1], can exceed 1 for more blur
+     * @param options.taper - Taper of the focus area [0, 1]
+     * @param options.start - Start point of focus line in screen space [x, y]
+     * @param options.end - End point of focus line in screen space [x, y]
+     * @param options.samples - Number of blur samples
+     * @param options.direction - Direction of the blur
+     */
+    constructor({ blendFunction, blur, // [0, 1], can go beyond 1 for extra
+    taper, // [0, 1], can go beyond 1 for extra
+    start, // [0,1] percentage x,y of screenspace
+    end, // [0,1] percentage x,y of screenspace
+    samples, // number of blur samples
+    direction, }?: {
+        blendFunction?: BlendFunction | undefined;
+        blur?: number | undefined;
+        taper?: number | undefined;
+        start?: number[] | undefined;
+        end?: number[] | undefined;
+        samples?: number | undefined;
+        direction?: number[] | undefined;
+    });
+}
+/**
+ * Configuration options for the TiltShift2 effect.
+ * Derived from TiltShift2Effect constructor parameters.
+ */
+type TiltShift2EffectOptions = Partial<NonNullable<ConstructorParameters<typeof TiltShift2Effect>[0]>>;
+/**
+ * Angular component that applies an alternative tilt-shift effect.
+ *
+ * This effect uses a line-based focus system where you define start and
+ * end points in screen space. The area between these points stays in focus
+ * while the rest of the image is blurred.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-tilt-shift2 [options]="{ blur: 0.2, start: [0.5, 0.3], end: [0.5, 0.7] }" />
+ * </ngtp-effect-composer>
+ * ```
+ *
+ * @see NgtpTiltShift for the standard tilt-shift implementation
+ */
+declare class NgtpTiltShift2 {
+    /**
+     * Configuration options for the tilt-shift effect.
+     * @see TiltShift2EffectOptions
+     */
+    options: _angular_core.InputSignal<Omit<Partial<{
+        blendFunction?: BlendFunction | undefined;
+        blur?: number | undefined;
+        taper?: number | undefined;
+        start?: number[] | undefined;
+        end?: number[] | undefined;
+        samples?: number | undefined;
+        direction?: number[] | undefined;
+    }>, "blendFunction">>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<TiltShift2Effect> | undefined>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpTiltShift2, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpTiltShift2, "ngtp-tilt-shift2", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+/**
+ * Configuration options for the tone mapping effect.
+ * Derived from ToneMappingEffect constructor parameters.
+ */
+type ToneMappingEffectOptions = NonNullable<ConstructorParameters<typeof ToneMappingEffect>[0]>;
+/**
+ * Angular component that applies tone mapping to the scene.
+ *
+ * Tone mapping converts HDR (High Dynamic Range) values to LDR (Low Dynamic
+ * Range) for display. Various tone mapping modes are available including
+ * Reinhard, ACES Filmic, and custom linear options.
+ *
+ * Note: The effect composer disables Three.js's built-in tone mapping,
+ * so this effect should be used if tone mapping is desired.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-tone-mapping [options]="{ mode: ToneMappingMode.ACES_FILMIC }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpToneMapping {
+    /**
+     * Configuration options for the tone mapping effect.
+     * @see ToneMappingEffectOptions
+     */
+    options: _angular_core.InputSignal<Omit<{
+        blendFunction?: postprocessing.BlendFunction;
+        adaptive?: boolean;
+        mode?: postprocessing.ToneMappingMode;
+        resolution?: number;
+        maxLuminance?: number;
+        whitePoint?: number;
+        middleGrey?: number;
+        minLuminance?: number;
+        averageLuminance?: number;
+        adaptationRate?: number;
+    }, "blendFunction">>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<ToneMappingEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpToneMapping, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpToneMapping, "ngtp-tone-mapping", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+/**
+ * Configuration options for the vignette effect.
+ * Derived from VignetteEffect constructor parameters.
+ */
+type VignetteEffectOptions = Partial<NonNullable<ConstructorParameters<typeof VignetteEffect>[0]>>;
+/**
+ * Angular component that applies a vignette effect to the scene.
+ *
+ * This effect darkens the corners and edges of the image, drawing the
+ * viewer's attention to the center. It's a common cinematic technique
+ * for creating focus and atmosphere.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-vignette [options]="{ darkness: 0.5, offset: 0.3 }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpVignette {
+    /**
+     * Configuration options for the vignette effect.
+     * @see VignetteEffectOptions
+     */
+    options: _angular_core.InputSignal<Omit<Partial<{
+        blendFunction?: postprocessing.BlendFunction;
+        technique?: postprocessing.VignetteTechnique;
+        eskil?: boolean;
+        offset?: number;
+        darkness?: number;
+    }>, "blendFunction">>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<VignetteEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpVignette, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpVignette, "ngtp-vignette", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+/**
+ * A postprocessing effect that simulates an underwater/water distortion.
+ *
+ * Creates animated rippling distortion that makes the scene appear as if
+ * viewed through water or a heat haze.
+ *
+ * @example
+ * ```typescript
+ * const effect = new WaterEffect({ factor: 0.5 });
+ * ```
+ */
+declare class WaterEffect extends Effect {
+    /**
+     * Creates a new WaterEffect instance.
+     *
+     * @param options - Configuration options
+     * @param options.blendFunction - How to blend with the scene
+     * @param options.factor - Intensity of the water effect (0 = no effect)
+     */
+    constructor({ blendFunction, factor }?: {
+        blendFunction?: BlendFunction | undefined;
+        factor?: number | undefined;
+    });
+}
+/**
+ * Configuration options for the water effect.
+ * Derived from WaterEffect constructor parameters.
+ */
+type WaterEffectOptions = Partial<NonNullable<ConstructorParameters<typeof WaterEffect>[0]>>;
+/**
+ * Angular component that applies a water/ripple distortion effect.
+ *
+ * This effect creates an animated underwater-like distortion that can
+ * simulate viewing through water, heat haze, or a dream-like state.
+ *
+ * @example
+ * ```html
+ * <ngtp-effect-composer>
+ *   <ngtp-water [options]="{ factor: 0.5 }" />
+ * </ngtp-effect-composer>
+ * ```
+ */
+declare class NgtpWater {
+    /**
+     * Configuration options for the water effect.
+     * @see WaterEffectOptions
+     */
+    options: _angular_core.InputSignal<Omit<Partial<{
+        blendFunction?: BlendFunction | undefined;
+        factor?: number | undefined;
+    }>, "blendFunction">>;
+    /** Reference to the host NgtpEffect directive */
+    protected hostEffect: NgtpEffect;
+    effectRef: _angular_core.Signal<ElementRef<WaterEffect> | undefined>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgtpWater, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgtpWater, "ngtp-water", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
+}
+
+export { ASCIIEffect, LensFlareEffect, NgtpASCII, NgtpBloom, NgtpBrightnessContrast, NgtpChromaticAberration, NgtpColorAverage, NgtpColorDepth, NgtpDepth, NgtpDepthOfField, NgtpDotScreen, NgtpEffect, NgtpEffectBlendMode, NgtpEffectComposer, NgtpFXAA, NgtpGlitch, NgtpGodRays, NgtpGrid, NgtpHueSaturation, NgtpLUT, NgtpLensFlare, NgtpNoise, NgtpOutline, NgtpPixelation, NgtpSMAA, NgtpScanline, NgtpSelectiveBloom, NgtpSepia, NgtpShockWave, NgtpTiltShift, NgtpTiltShift2, NgtpToneMapping, NgtpVignette, NgtpWater, TiltShift2Effect, WaterEffect, injectDefaultEffectOptions, provideDefaultEffectOptions };
+export type { BrightnessEffectOptions, ChromaticAberrationEffectOptions, ColorDepthEffectOptions, DepthEffectOptions, DotScreenEffectOptions, FXAAEffectOptions, GlitchOptions, HueSaturationEffectOptions, LUTOptions, LensFlareOptions, NgtpEffectComposerOptions, NgtpOutlineOptions, NoiseEffectOptions, PixelationOptions, SMAAEffectOptions, ScanlineEffectOptions, SelectiveBloomOptions, SepiaEffectOptions, ShockWaveEffectOptions, TiltShift2EffectOptions, TiltShiftEffectOptions, ToneMappingEffectOptions, VignetteEffectOptions, WaterEffectOptions };