angular-three-postprocessing 4.0.0-next.115 → 4.0.0-next.118

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,1868 @@
1
+ import * as angular_three from 'angular-three';
2
+ import { NgtVector3, NgtVector2 } from 'angular-three';
3
+ import * as i0 from '@angular/core';
4
+ import { ElementRef } from '@angular/core';
5
+ import * as postprocessing from 'postprocessing';
6
+ import { BlendFunction, EffectComposer, Effect, BloomEffectOptions, BrightnessContrastEffect, ChromaticAberrationEffect, ColorDepthEffect, DepthEffect, DepthOfFieldEffect, DotScreenEffect, FXAAEffect, GlitchEffect, GlitchMode, GodRaysEffect, GridEffect, HueSaturationEffect, LUT3DEffect, NoiseEffect, OutlineEffect, PixelationEffect, ScanlineEffect, SelectiveBloomEffect, SepiaEffect, ShockWaveEffect, SMAAEffect, TiltShiftEffect, ToneMappingEffect, VignetteEffect } from 'postprocessing';
7
+ import * as THREE from 'three';
8
+
9
+ /**
10
+ * Injection token for providing default effect options.
11
+ *
12
+ * Use `injectDefaultEffectOptions` to inject default options in effect components.
13
+ * Use `provideDefaultEffectOptions` to provide default options for effects.
14
+ *
15
+ * @example
16
+ * ```typescript
17
+ * @Component({
18
+ * providers: [provideDefaultEffectOptions({ blendFunction: BlendFunction.ADD, opacity: 0.5 })]
19
+ * })
20
+ * export class MyEffect {}
21
+ * ```
22
+ */
23
+ declare const injectDefaultEffectOptions: {
24
+ (): {
25
+ blendFunction?: BlendFunction;
26
+ opacity?: number;
27
+ };
28
+ (injectOptions: i0.InjectOptions & {
29
+ optional?: false;
30
+ } & {
31
+ injector?: i0.Injector;
32
+ }): {
33
+ blendFunction?: BlendFunction;
34
+ opacity?: number;
35
+ };
36
+ (injectOptions: i0.InjectOptions & {
37
+ injector?: i0.Injector;
38
+ }): {
39
+ blendFunction?: BlendFunction;
40
+ opacity?: number;
41
+ } | null;
42
+ };
43
+ declare const provideDefaultEffectOptions: ((value: {
44
+ blendFunction?: BlendFunction;
45
+ opacity?: number;
46
+ } | (() => {
47
+ blendFunction?: BlendFunction;
48
+ opacity?: number;
49
+ })) => i0.Provider) & ((value: {
50
+ blendFunction?: BlendFunction;
51
+ opacity?: number;
52
+ } | (() => {
53
+ blendFunction?: BlendFunction;
54
+ opacity?: number;
55
+ })) => i0.Provider);
56
+ /**
57
+ * Component that applies blend mode settings to a postprocessing effect.
58
+ *
59
+ * This component is used internally by effect components to apply `blendFunction`
60
+ * and `opacity` values to the effect's blend mode.
61
+ *
62
+ * @example
63
+ * ```html
64
+ * <ngt-bloom-effect *args="[options()]">
65
+ * <ngtp-effect-blend-mode />
66
+ * </ngt-bloom-effect>
67
+ * ```
68
+ */
69
+ declare class NgtpEffectBlendMode {
70
+ /** Reference to the parent NgtpEffect directive, if available */
71
+ effect: NgtpEffect | null;
72
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpEffectBlendMode, never>;
73
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpEffectBlendMode, "ngtp-effect-blend-mode", never, {}, {}, never, never, true, never>;
74
+ }
75
+ /**
76
+ * Base directive for postprocessing effects that provides common functionality.
77
+ *
78
+ * This directive is used as a host directive by effect components to provide:
79
+ * - `blendFunction`: Controls how the effect blends with the scene
80
+ * - `opacity`: Controls the effect's opacity
81
+ * - Access to the camera and invalidate function from the store
82
+ *
83
+ * @example
84
+ * ```typescript
85
+ * @Component({
86
+ * hostDirectives: [{ directive: NgtpEffect, inputs: ['blendFunction', 'opacity'] }]
87
+ * })
88
+ * export class NgtpBloom {}
89
+ * ```
90
+ */
91
+ declare class NgtpEffect {
92
+ /** Default effect options injected from parent providers */
93
+ defaultEffectOptions: {
94
+ blendFunction?: BlendFunction;
95
+ opacity?: number;
96
+ } | null;
97
+ /**
98
+ * The blend function used to combine this effect with the scene.
99
+ * @see BlendFunction from postprocessing library
100
+ */
101
+ blendFunction: i0.InputSignal<BlendFunction | undefined>;
102
+ /**
103
+ * The opacity of the effect.
104
+ * @default undefined (uses effect's default)
105
+ */
106
+ opacity: i0.InputSignal<number | undefined>;
107
+ private store;
108
+ /** The current camera from the store */
109
+ camera: angular_three.DeepSignal<angular_three.NgtCamera>;
110
+ /** Function to invalidate the render loop, triggering a re-render */
111
+ invalidate: i0.Signal<(frames?: number) => void>;
112
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpEffect, never>;
113
+ static ɵdir: i0.ɵɵDirectiveDeclaration<NgtpEffect, never, never, { "blendFunction": { "alias": "blendFunction"; "required": false; "isSignal": true; }; "opacity": { "alias": "opacity"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
114
+ }
115
+
116
+ /**
117
+ * Configuration options for the effect composer.
118
+ */
119
+ interface NgtpEffectComposerOptions {
120
+ /**
121
+ * Whether the effect composer is enabled.
122
+ * @default true
123
+ */
124
+ enabled: boolean;
125
+ /**
126
+ * Whether to use a depth buffer.
127
+ * @default undefined
128
+ */
129
+ depthBuffer?: boolean;
130
+ /**
131
+ * Whether to enable the normal pass.
132
+ * Only used for SSGI currently, leave it disabled for everything else unless it's needed.
133
+ * @default undefined
134
+ */
135
+ enableNormalPass?: boolean;
136
+ /**
137
+ * Whether to use a stencil buffer.
138
+ * @default undefined
139
+ */
140
+ stencilBuffer?: boolean;
141
+ /**
142
+ * Whether to auto-clear before rendering.
143
+ * @default true
144
+ */
145
+ autoClear: boolean;
146
+ /**
147
+ * Resolution scale for the effect composer.
148
+ * @default undefined
149
+ */
150
+ resolutionScale?: number;
151
+ /**
152
+ * Number of samples for multisampling anti-aliasing.
153
+ * Set to 0 to disable multisampling.
154
+ * @default 8
155
+ */
156
+ multisampling: number;
157
+ /**
158
+ * The texture data type for the frame buffer.
159
+ * @default THREE.HalfFloatType
160
+ */
161
+ frameBufferType: THREE.TextureDataType;
162
+ /**
163
+ * The render priority for the effect composer.
164
+ * Higher values render later.
165
+ * @default 1
166
+ */
167
+ renderPriority: number;
168
+ /**
169
+ * Custom camera to use for rendering effects.
170
+ * If not provided, uses the default camera from the store.
171
+ * @default undefined
172
+ */
173
+ camera?: THREE.Camera;
174
+ /**
175
+ * Custom scene to use for rendering effects.
176
+ * If not provided, uses the default scene from the store.
177
+ * @default undefined
178
+ */
179
+ scene?: THREE.Scene;
180
+ }
181
+ /**
182
+ * Angular component that manages postprocessing effects for a Three.js scene.
183
+ *
184
+ * The effect composer wraps the postprocessing library's EffectComposer and provides
185
+ * a declarative way to add effects to your scene. Effects are added as children of
186
+ * this component and are automatically composed into an effect pass.
187
+ *
188
+ * @example
189
+ * ```html
190
+ * <ngtp-effect-composer>
191
+ * <ngtp-bloom [options]="{ intensity: 1, luminanceThreshold: 0.9 }" />
192
+ * <ngtp-vignette [options]="{ darkness: 0.5 }" />
193
+ * </ngtp-effect-composer>
194
+ * ```
195
+ *
196
+ * @example
197
+ * ```html
198
+ * <!-- With custom options -->
199
+ * <ngtp-effect-composer [options]="{ multisampling: 4, autoClear: false }">
200
+ * <ngtp-smaa />
201
+ * <ngtp-tone-mapping />
202
+ * </ngtp-effect-composer>
203
+ * ```
204
+ */
205
+ declare class NgtpEffectComposer {
206
+ /**
207
+ * Configuration options for the effect composer.
208
+ * @see NgtpEffectComposerOptions
209
+ */
210
+ options: i0.InputSignalWithTransform<NgtpEffectComposerOptions, "" | Partial<NgtpEffectComposerOptions>>;
211
+ private store;
212
+ private depthBuffer;
213
+ private stencilBuffer;
214
+ private multisampling;
215
+ private frameBufferType;
216
+ private enableNormalPass;
217
+ private resolutionScale;
218
+ private enabled;
219
+ private renderPriority;
220
+ /**
221
+ * The scene used for rendering effects.
222
+ * Uses custom scene from options if provided, otherwise uses the store's scene.
223
+ */
224
+ scene: i0.Signal<THREE.Scene<THREE.Object3DEventMap>>;
225
+ /**
226
+ * The camera used for rendering effects.
227
+ * Uses custom camera from options if provided, otherwise uses the store's camera.
228
+ */
229
+ camera: i0.Signal<THREE.Camera>;
230
+ private groupRef;
231
+ /**
232
+ * Computed render priority based on whether the composer is enabled.
233
+ * Returns 0 when disabled, otherwise returns the configured renderPriority.
234
+ */
235
+ private priority;
236
+ /**
237
+ * Creates and configures the effect composer with render pass, normal pass,
238
+ * and depth downsampling pass based on options.
239
+ */
240
+ private composerData;
241
+ /**
242
+ * The underlying postprocessing EffectComposer instance.
243
+ * Can be used to access the composer directly for advanced use cases.
244
+ */
245
+ effectComposer: i0.Signal<EffectComposer>;
246
+ constructor();
247
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpEffectComposer, never>;
248
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpEffectComposer, "ngtp-effect-composer", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
249
+ }
250
+
251
+ /**
252
+ * Configuration options for the ASCII effect.
253
+ */
254
+ interface ASCIIEffectOptions {
255
+ /**
256
+ * The font family to use for rendering characters.
257
+ * @default 'arial'
258
+ */
259
+ font?: string;
260
+ /**
261
+ * The character set to use for rendering, ordered from darkest to brightest.
262
+ * @default " .:,'-^=*+?!|0#X%WM@"
263
+ */
264
+ characters?: string;
265
+ /**
266
+ * The font size in pixels for the character texture.
267
+ * @default 54
268
+ */
269
+ fontSize?: number;
270
+ /**
271
+ * The size of each cell in pixels.
272
+ * @default 16
273
+ */
274
+ cellSize?: number;
275
+ /**
276
+ * The color of the ASCII characters in hex format.
277
+ * @default '#ffffff'
278
+ */
279
+ color?: string;
280
+ /**
281
+ * Whether to invert the brightness mapping.
282
+ * @default false
283
+ */
284
+ invert?: boolean;
285
+ }
286
+ /**
287
+ * A postprocessing effect that renders the scene as ASCII art.
288
+ *
289
+ * This effect converts the rendered scene into a grid of ASCII characters,
290
+ * where the character used depends on the brightness of the underlying pixels.
291
+ *
292
+ * @example
293
+ * ```typescript
294
+ * const effect = new ASCIIEffect({
295
+ * cellSize: 12,
296
+ * color: '#00ff00',
297
+ * characters: ' .:-=+*#%@'
298
+ * });
299
+ * ```
300
+ */
301
+ declare class ASCIIEffect extends Effect {
302
+ constructor({ font, characters, fontSize, cellSize, color, invert, }?: ASCIIEffectOptions);
303
+ /**
304
+ * Creates a texture containing all the ASCII characters.
305
+ *
306
+ * Draws each character in the character set onto a canvas and creates
307
+ * a texture that can be sampled in the shader.
308
+ *
309
+ * @param characters - The character set to render
310
+ * @param font - The font family to use
311
+ * @param fontSize - The font size in pixels
312
+ * @returns A Three.js texture containing the rendered characters
313
+ */
314
+ createCharactersTexture(characters: string, font: string, fontSize: number): THREE.Texture;
315
+ }
316
+ /**
317
+ * Angular component that applies an ASCII art postprocessing effect to the scene.
318
+ *
319
+ * Renders the scene as ASCII characters, where character selection is based on
320
+ * the brightness of the underlying pixels.
321
+ *
322
+ * @example
323
+ * ```html
324
+ * <ngtp-effect-composer>
325
+ * <ngtp-ascii [options]="{ cellSize: 12, color: '#00ff00' }" />
326
+ * </ngtp-effect-composer>
327
+ * ```
328
+ */
329
+ declare class NgtpASCII {
330
+ /**
331
+ * Configuration options for the ASCII effect.
332
+ * @see ASCIIEffectOptions
333
+ */
334
+ options: i0.InputSignalWithTransform<ASCIIEffectOptions, "" | Partial<ASCIIEffectOptions>>;
335
+ /** The underlying ASCIIEffect instance */
336
+ protected effect: i0.Signal<ASCIIEffect>;
337
+ constructor();
338
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpASCII, never>;
339
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpASCII, "ngtp-ascii", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
340
+ }
341
+
342
+ /**
343
+ * Angular component that applies a bloom postprocessing effect to the scene.
344
+ *
345
+ * The bloom effect creates a glow around bright areas of the scene, simulating
346
+ * the way bright light bleeds in cameras and the human eye.
347
+ *
348
+ * @example
349
+ * ```html
350
+ * <ngtp-effect-composer>
351
+ * <ngtp-bloom [options]="{ intensity: 1, luminanceThreshold: 0.9 }" />
352
+ * </ngtp-effect-composer>
353
+ * ```
354
+ *
355
+ * @example
356
+ * ```html
357
+ * <!-- With custom blend function -->
358
+ * <ngtp-effect-composer>
359
+ * <ngtp-bloom
360
+ * [blendFunction]="BlendFunction.SCREEN"
361
+ * [options]="{ intensity: 0.5, luminanceSmoothing: 0.9 }"
362
+ * />
363
+ * </ngtp-effect-composer>
364
+ * ```
365
+ */
366
+ declare class NgtpBloom {
367
+ /**
368
+ * Configuration options for the bloom effect.
369
+ * Accepts all BloomEffectOptions except blendFunction (use the blendFunction input instead).
370
+ * @see BloomEffectOptions from postprocessing library
371
+ */
372
+ options: i0.InputSignal<Omit<BloomEffectOptions, "blendFunction">>;
373
+ /** Reference to the host NgtpEffect directive */
374
+ protected effect: NgtpEffect;
375
+ constructor();
376
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpBloom, never>;
377
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpBloom, "ngtp-bloom", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
378
+ }
379
+
380
+ /**
381
+ * Configuration options for the brightness/contrast effect.
382
+ * Derived from BrightnessContrastEffect constructor parameters.
383
+ */
384
+ type BrightnessEffectOptions = NonNullable<ConstructorParameters<typeof BrightnessContrastEffect>[0]>;
385
+ /**
386
+ * Angular component that applies brightness and contrast adjustments to the scene.
387
+ *
388
+ * This effect allows you to modify the overall brightness and contrast of the
389
+ * rendered scene as a postprocessing step.
390
+ *
391
+ * @example
392
+ * ```html
393
+ * <ngtp-effect-composer>
394
+ * <ngtp-brightness-contrast [options]="{ brightness: 0.1, contrast: 0.2 }" />
395
+ * </ngtp-effect-composer>
396
+ * ```
397
+ */
398
+ declare class NgtpBrightnessContrast {
399
+ /**
400
+ * Configuration options for the brightness/contrast effect.
401
+ * @see BrightnessEffectOptions
402
+ */
403
+ options: i0.InputSignal<Omit<{
404
+ blendFunction?: postprocessing.BlendFunction;
405
+ brightness?: number;
406
+ contrast?: number;
407
+ }, "blendFunction">>;
408
+ /** Reference to the host NgtpEffect directive */
409
+ protected effect: NgtpEffect;
410
+ constructor();
411
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpBrightnessContrast, never>;
412
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpBrightnessContrast, "ngtp-brightness-contrast", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
413
+ }
414
+
415
+ /**
416
+ * Configuration options for the chromatic aberration effect.
417
+ * Derived from ChromaticAberrationEffect constructor parameters.
418
+ */
419
+ type ChromaticAberrationEffectOptions = Partial<NonNullable<ConstructorParameters<typeof ChromaticAberrationEffect>[0]>>;
420
+ /**
421
+ * Angular component that applies a chromatic aberration effect to the scene.
422
+ *
423
+ * Chromatic aberration simulates the color fringing that occurs in real camera lenses
424
+ * when different wavelengths of light are focused at different distances.
425
+ *
426
+ * @example
427
+ * ```html
428
+ * <ngtp-effect-composer>
429
+ * <ngtp-chromatic-aberration [options]="{ offset: [0.002, 0.002] }" />
430
+ * </ngtp-effect-composer>
431
+ * ```
432
+ */
433
+ declare class NgtpChromaticAberration {
434
+ /**
435
+ * Configuration options for the chromatic aberration effect.
436
+ * @see ChromaticAberrationEffectOptions
437
+ */
438
+ options: i0.InputSignal<Omit<Partial<{
439
+ blendFunction?: postprocessing.BlendFunction;
440
+ offset?: THREE.Vector2;
441
+ radialModulation: boolean;
442
+ modulationOffset: number;
443
+ }>, "blendFunction">>;
444
+ /** Reference to the host NgtpEffect directive */
445
+ protected effect: NgtpEffect;
446
+ constructor();
447
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpChromaticAberration, never>;
448
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpChromaticAberration, "ngtp-chromatic-aberration", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
449
+ }
450
+
451
+ /**
452
+ * Angular component that applies a color averaging effect to the scene.
453
+ *
454
+ * This effect converts the scene to grayscale by averaging the color channels,
455
+ * which can create a desaturated or monochrome look.
456
+ *
457
+ * @example
458
+ * ```html
459
+ * <ngtp-effect-composer>
460
+ * <ngtp-color-average />
461
+ * </ngtp-effect-composer>
462
+ * ```
463
+ *
464
+ * @example
465
+ * ```html
466
+ * <!-- With custom blend function -->
467
+ * <ngtp-effect-composer>
468
+ * <ngtp-color-average [options]="{ blendFunction: BlendFunction.MULTIPLY }" />
469
+ * </ngtp-effect-composer>
470
+ * ```
471
+ */
472
+ declare class NgtpColorAverage {
473
+ /**
474
+ * Configuration options for the color average effect.
475
+ * @default { blendFunction: BlendFunction.NORMAL }
476
+ */
477
+ options: i0.InputSignalWithTransform<{
478
+ blendFunction: BlendFunction;
479
+ }, "" | Partial<{
480
+ blendFunction: BlendFunction;
481
+ }>>;
482
+ constructor();
483
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpColorAverage, never>;
484
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpColorAverage, "ngtp-color-average", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
485
+ }
486
+
487
+ /**
488
+ * Configuration options for the color depth effect.
489
+ * Derived from ColorDepthEffect constructor parameters.
490
+ */
491
+ type ColorDepthEffectOptions = Partial<NonNullable<ConstructorParameters<typeof ColorDepthEffect>[0]>>;
492
+ /**
493
+ * Angular component that applies a color depth reduction effect to the scene.
494
+ *
495
+ * This effect reduces the number of colors in the scene, creating a posterized
496
+ * or retro look similar to older display hardware with limited color palettes.
497
+ *
498
+ * @example
499
+ * ```html
500
+ * <ngtp-effect-composer>
501
+ * <ngtp-color-depth [options]="{ bits: 4 }" />
502
+ * </ngtp-effect-composer>
503
+ * ```
504
+ */
505
+ declare class NgtpColorDepth {
506
+ /**
507
+ * Configuration options for the color depth effect.
508
+ * @see ColorDepthEffectOptions
509
+ */
510
+ options: i0.InputSignal<Omit<Partial<{
511
+ blendFunction?: postprocessing.BlendFunction;
512
+ bits?: number;
513
+ }>, "blendFunction">>;
514
+ /** Reference to the host NgtpEffect directive */
515
+ protected effect: NgtpEffect;
516
+ constructor();
517
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpColorDepth, never>;
518
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpColorDepth, "ngtp-color-depth", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
519
+ }
520
+
521
+ /**
522
+ * Configuration options for the depth effect.
523
+ * Derived from DepthEffect constructor parameters.
524
+ */
525
+ type DepthEffectOptions = Partial<NonNullable<ConstructorParameters<typeof DepthEffect>[0]>>;
526
+ /**
527
+ * Angular component that visualizes the scene's depth buffer.
528
+ *
529
+ * This effect renders the depth information of the scene, which can be useful
530
+ * for debugging or creating stylized depth-based visualizations.
531
+ *
532
+ * @example
533
+ * ```html
534
+ * <ngtp-effect-composer>
535
+ * <ngtp-depth [options]="{ inverted: true }" />
536
+ * </ngtp-effect-composer>
537
+ * ```
538
+ */
539
+ declare class NgtpDepth {
540
+ /**
541
+ * Configuration options for the depth effect.
542
+ * @see DepthEffectOptions
543
+ */
544
+ options: i0.InputSignal<Omit<Partial<{
545
+ blendFunction?: postprocessing.BlendFunction;
546
+ inverted?: boolean;
547
+ }>, "blendFunction">>;
548
+ /** Reference to the host NgtpEffect directive */
549
+ protected effect: NgtpEffect;
550
+ constructor();
551
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpDepth, never>;
552
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpDepth, "ngtp-depth", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
553
+ }
554
+
555
+ /**
556
+ * Configuration options for the depth of field effect.
557
+ * Extends DepthOfFieldEffect options with additional target and depth texture support.
558
+ */
559
+ type DOFOptions = NonNullable<ConstructorParameters<typeof DepthOfFieldEffect>[1]> & Partial<{
560
+ target: NgtVector3;
561
+ depthTexture: {
562
+ texture: THREE.Texture;
563
+ packing: THREE.DepthPackingStrategies;
564
+ };
565
+ }>;
566
+ /**
567
+ * Angular component that applies a depth of field effect to the scene.
568
+ *
569
+ * This effect simulates the focus behavior of real camera lenses, blurring
570
+ * objects that are outside the focal range. Can be configured for autofocus
571
+ * by providing a target position.
572
+ *
573
+ * @example
574
+ * ```html
575
+ * <ngtp-effect-composer>
576
+ * <ngtp-depth-of-field [options]="{ focusDistance: 0, focalLength: 0.02, bokehScale: 2 }" />
577
+ * </ngtp-effect-composer>
578
+ * ```
579
+ *
580
+ * @example
581
+ * ```html
582
+ * <!-- With autofocus target -->
583
+ * <ngtp-effect-composer>
584
+ * <ngtp-depth-of-field [options]="{ target: [0, 0, 5], bokehScale: 3 }" />
585
+ * </ngtp-effect-composer>
586
+ * ```
587
+ */
588
+ declare class NgtpDepthOfField {
589
+ /**
590
+ * Configuration options for the depth of field effect.
591
+ * @see DOFOptions
592
+ */
593
+ options: i0.InputSignal<DOFOptions>;
594
+ private effectComposer;
595
+ /**
596
+ * Creates the DepthOfFieldEffect instance with the configured options.
597
+ * Enables autofocus if a target is provided and applies depth texture settings.
598
+ */
599
+ protected effect: i0.Signal<DepthOfFieldEffect>;
600
+ constructor();
601
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpDepthOfField, never>;
602
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpDepthOfField, "ngtp-depth-of-field", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
603
+ }
604
+
605
+ /**
606
+ * Configuration options for the dot screen effect.
607
+ * Derived from DotScreenEffect constructor parameters.
608
+ */
609
+ type DotScreenEffectOptions = Partial<NonNullable<ConstructorParameters<typeof DotScreenEffect>[0]>>;
610
+ /**
611
+ * Angular component that applies a dot screen effect to the scene.
612
+ *
613
+ * This effect overlays a pattern of dots on the scene, creating a halftone
614
+ * or comic book style appearance.
615
+ *
616
+ * @example
617
+ * ```html
618
+ * <ngtp-effect-composer>
619
+ * <ngtp-dot-screen [options]="{ scale: 1.5, angle: Math.PI * 0.25 }" />
620
+ * </ngtp-effect-composer>
621
+ * ```
622
+ */
623
+ declare class NgtpDotScreen {
624
+ /**
625
+ * Configuration options for the dot screen effect.
626
+ * @see DotScreenEffectOptions
627
+ */
628
+ options: i0.InputSignal<Omit<Partial<{
629
+ blendFunction?: postprocessing.BlendFunction;
630
+ angle?: number;
631
+ scale?: number;
632
+ }>, "blendFunction">>;
633
+ /** Reference to the host NgtpEffect directive */
634
+ protected effect: NgtpEffect;
635
+ constructor();
636
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpDotScreen, never>;
637
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpDotScreen, "ngtp-dot-screen", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
638
+ }
639
+
640
+ /**
641
+ * Configuration options for the FXAA effect.
642
+ * Derived from FXAAEffect constructor parameters.
643
+ */
644
+ type FXAAEffectOptions = Partial<NonNullable<ConstructorParameters<typeof FXAAEffect>[0]>>;
645
+ /**
646
+ * Angular component that applies Fast Approximate Anti-Aliasing (FXAA) to the scene.
647
+ *
648
+ * FXAA is a fast, single-pass anti-aliasing technique that smooths jagged edges
649
+ * in the rendered image. It's less demanding than multisampling but may blur
650
+ * some fine details.
651
+ *
652
+ * @example
653
+ * ```html
654
+ * <ngtp-effect-composer [options]="{ multisampling: 0 }">
655
+ * <ngtp-fxaa />
656
+ * </ngtp-effect-composer>
657
+ * ```
658
+ */
659
+ declare class NgtpFXAA {
660
+ /**
661
+ * Configuration options for the FXAA effect.
662
+ * @see FXAAEffectOptions
663
+ */
664
+ options: i0.InputSignal<Omit<Partial<{
665
+ blendFunction?: postprocessing.BlendFunction;
666
+ }>, "blendFunction">>;
667
+ /** Reference to the host NgtpEffect directive */
668
+ protected effect: NgtpEffect;
669
+ constructor();
670
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpFXAA, never>;
671
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpFXAA, "ngtp-fxaa", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
672
+ }
673
+
674
+ /**
675
+ * Configuration options for the glitch effect.
676
+ * Extends GlitchEffect options with additional control properties.
677
+ */
678
+ type GlitchOptions = NonNullable<ConstructorParameters<typeof GlitchEffect>[0]> & Partial<{
679
+ /** The glitch mode (SPORADIC, CONSTANT_MILD, CONSTANT_WILD, DISABLED) */
680
+ mode: GlitchMode;
681
+ /** Whether the glitch effect is active */
682
+ active: boolean;
683
+ /** Delay range between glitches [min, max] in seconds */
684
+ delay: NgtVector2;
685
+ /** Duration range of glitches [min, max] in seconds */
686
+ duration: NgtVector2;
687
+ /** Chromatic aberration offset */
688
+ chromaticAberrationOffset: NgtVector2;
689
+ /** Strength of the glitch effect [x, y] */
690
+ strength: NgtVector2;
691
+ }>;
692
+ /**
693
+ * Angular component that applies a glitch effect to the scene.
694
+ *
695
+ * This effect simulates digital glitches with customizable timing, strength,
696
+ * and chromatic aberration. Can be toggled on/off and configured for different
697
+ * glitch modes.
698
+ *
699
+ * @example
700
+ * ```html
701
+ * <ngtp-effect-composer>
702
+ * <ngtp-glitch [options]="{ delay: [1.5, 3.5], duration: [0.6, 1.0] }" />
703
+ * </ngtp-effect-composer>
704
+ * ```
705
+ *
706
+ * @example
707
+ * ```html
708
+ * <!-- Constant glitch mode -->
709
+ * <ngtp-effect-composer>
710
+ * <ngtp-glitch [options]="{ mode: GlitchMode.CONSTANT_MILD, active: true }" />
711
+ * </ngtp-effect-composer>
712
+ * ```
713
+ */
714
+ declare class NgtpGlitch {
715
+ /**
716
+ * Configuration options for the glitch effect.
717
+ * @default { active: true }
718
+ * @see GlitchOptions
719
+ */
720
+ options: i0.InputSignalWithTransform<GlitchOptions, "" | Partial<{
721
+ active: boolean;
722
+ }>>;
723
+ private active;
724
+ private mode;
725
+ private ratio;
726
+ private dtSize;
727
+ private columns;
728
+ private blendFunction;
729
+ private perturbationMap;
730
+ private delay;
731
+ private duration;
732
+ private chromaticAberrationOffset;
733
+ private strength;
734
+ private store;
735
+ /**
736
+ * The underlying GlitchEffect instance.
737
+ * Created with the configured options and vector2 parameters.
738
+ */
739
+ effect: i0.Signal<GlitchEffect>;
740
+ constructor();
741
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpGlitch, never>;
742
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpGlitch, "ngtp-glitch", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
743
+ }
744
+
745
+ /**
746
+ * Angular component that applies a god rays (volumetric lighting) effect to the scene.
747
+ *
748
+ * This effect creates light shafts emanating from a light source, simulating
749
+ * the way light scatters through atmospheric particles. Requires a sun/light
750
+ * source mesh to generate the rays from.
751
+ *
752
+ * @example
753
+ * ```html
754
+ * <ngt-mesh #sun [position]="[0, 5, -10]">
755
+ * <ngt-sphere-geometry />
756
+ * <ngt-mesh-basic-material color="yellow" />
757
+ * </ngt-mesh>
758
+ *
759
+ * <ngtp-effect-composer>
760
+ * <ngtp-god-rays [options]="{ sun: sunRef, density: 0.96 }" />
761
+ * </ngtp-effect-composer>
762
+ * ```
763
+ */
764
+ declare class NgtpGodRays {
765
+ /**
766
+ * Configuration options for the god rays effect.
767
+ * Must include a `sun` property with the light source reference.
768
+ * @see GodRaysOptions
769
+ */
770
+ options: i0.InputSignal<{
771
+ blendFunction?: postprocessing.BlendFunction;
772
+ samples?: number;
773
+ density?: number;
774
+ decay?: number;
775
+ weight?: number;
776
+ exposure?: number;
777
+ clampMax?: number;
778
+ resolutionScale?: number;
779
+ resolutionX?: number;
780
+ resolutionY?: number;
781
+ width?: number;
782
+ height?: number;
783
+ kernelSize?: postprocessing.KernelSize;
784
+ blur?: boolean;
785
+ } & {
786
+ /**
787
+ * The light source for the god rays.
788
+ * Can be a Mesh, Points, ElementRef, or a function returning any of these.
789
+ */
790
+ sun: THREE.Mesh | THREE.Points | ElementRef<THREE.Mesh | THREE.Points> | (() => THREE.Mesh | THREE.Points | ElementRef<THREE.Mesh | THREE.Points> | undefined);
791
+ }>;
792
+ private effectComposer;
793
+ private effectOptions;
794
+ private sun;
795
+ /**
796
+ * Resolves the sun reference to the actual Three.js object.
797
+ * Handles both direct references and function references.
798
+ */
799
+ private sunElement;
800
+ /**
801
+ * The underlying GodRaysEffect instance.
802
+ * Created with the camera, sun element, and configured options.
803
+ */
804
+ protected effect: i0.Signal<GodRaysEffect>;
805
+ constructor();
806
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpGodRays, never>;
807
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpGodRays, "ngtp-god-rays", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
808
+ }
809
+
810
+ /**
811
+ * Configuration options for the grid effect.
812
+ * Extends GridEffect options with optional size configuration.
813
+ */
814
+ type GridOptions = NonNullable<ConstructorParameters<typeof GridEffect>[0]> & Partial<{
815
+ /** Custom size for the grid effect */
816
+ size: {
817
+ width: number;
818
+ height: number;
819
+ };
820
+ }>;
821
+ /**
822
+ * Angular component that applies a grid overlay effect to the scene.
823
+ *
824
+ * This effect overlays a grid pattern on the rendered scene, which can be
825
+ * useful for technical visualization or stylized effects.
826
+ *
827
+ * @example
828
+ * ```html
829
+ * <ngtp-effect-composer>
830
+ * <ngtp-grid [options]="{ scale: 1.5, lineWidth: 0.5 }" />
831
+ * </ngtp-effect-composer>
832
+ * ```
833
+ */
834
+ declare class NgtpGrid {
835
+ /**
836
+ * Configuration options for the grid effect.
837
+ * @see GridOptions
838
+ */
839
+ options: i0.InputSignal<GridOptions>;
840
+ private effectOptions;
841
+ private size;
842
+ /** The underlying GridEffect instance */
843
+ protected effect: i0.Signal<GridEffect>;
844
+ constructor();
845
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpGrid, never>;
846
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpGrid, "ngtp-grid", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
847
+ }
848
+
849
+ /**
850
+ * Configuration options for the hue/saturation effect.
851
+ * Derived from HueSaturationEffect constructor parameters.
852
+ */
853
+ type HueSaturationEffectOptions = Partial<NonNullable<ConstructorParameters<typeof HueSaturationEffect>[0]>>;
854
+ /**
855
+ * Angular component that applies hue and saturation adjustments to the scene.
856
+ *
857
+ * This effect allows you to shift the hue and adjust the saturation of the
858
+ * rendered scene as a postprocessing step.
859
+ *
860
+ * @example
861
+ * ```html
862
+ * <ngtp-effect-composer>
863
+ * <ngtp-hue-saturation [options]="{ hue: 0.5, saturation: 0.2 }" />
864
+ * </ngtp-effect-composer>
865
+ * ```
866
+ */
867
+ declare class NgtpHueSaturation {
868
+ /**
869
+ * Configuration options for the hue/saturation effect.
870
+ * @see HueSaturationEffectOptions
871
+ */
872
+ options: i0.InputSignal<Omit<Partial<{
873
+ blendFunction?: postprocessing.BlendFunction;
874
+ hue?: number;
875
+ saturation?: number;
876
+ }>, "blendFunction">>;
877
+ /** Reference to the host NgtpEffect directive */
878
+ protected effect: NgtpEffect;
879
+ constructor();
880
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpHueSaturation, never>;
881
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpHueSaturation, "ngtp-hue-saturation", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
882
+ }
883
+
884
+ /**
885
+ * A postprocessing effect that simulates camera lens flares.
886
+ *
887
+ * Creates realistic lens flare effects including glare, ghosts, star bursts,
888
+ * and anamorphic flares. Can be animated and positioned dynamically.
889
+ *
890
+ * @example
891
+ * ```typescript
892
+ * const effect = new LensFlareEffect({
893
+ * glareSize: 0.3,
894
+ * starPoints: 8,
895
+ * animated: true
896
+ * });
897
+ * ```
898
+ */
899
+ declare class LensFlareEffect extends Effect {
900
+ /**
901
+ * Creates a new LensFlareEffect instance.
902
+ *
903
+ * @param options - Configuration options for the lens flare
904
+ * @param options.blendFunction - How to blend with the scene
905
+ * @param options.enabled - Whether the effect is enabled
906
+ * @param options.glareSize - Size of the glare
907
+ * @param options.lensPosition - Position of the lens on screen
908
+ * @param options.iResolution - Resolution of the effect
909
+ * @param options.starPoints - Number of points in the star pattern
910
+ * @param options.flareSize - Size of individual flares
911
+ * @param options.flareSpeed - Animation speed of flares
912
+ * @param options.flareShape - Shape parameter for flares
913
+ * @param options.animated - Whether to animate the effect
914
+ * @param options.anamorphic - Enable anamorphic lens simulation
915
+ * @param options.colorGain - Color tint for the effect
916
+ * @param options.lensDirtTexture - Texture for lens dirt overlay
917
+ * @param options.haloScale - Scale of the halo effect
918
+ * @param options.secondaryGhosts - Enable secondary ghost images
919
+ * @param options.aditionalStreaks - Enable additional streak effects
920
+ * @param options.ghostScale - Scale of ghost images
921
+ * @param options.opacity - Opacity of the effect
922
+ * @param options.starBurst - Enable star burst effect
923
+ */
924
+ constructor({ blendFunction, enabled, glareSize, lensPosition, iResolution, starPoints, flareSize, flareSpeed, flareShape, animated, anamorphic, colorGain, lensDirtTexture, haloScale, secondaryGhosts, aditionalStreaks, ghostScale, opacity, starBurst, }?: {
925
+ blendFunction?: BlendFunction | undefined;
926
+ enabled?: boolean | undefined;
927
+ glareSize?: number | undefined;
928
+ lensPosition?: number[] | undefined;
929
+ iResolution?: number[] | undefined;
930
+ starPoints?: number | undefined;
931
+ flareSize?: number | undefined;
932
+ flareSpeed?: number | undefined;
933
+ flareShape?: number | undefined;
934
+ animated?: boolean | undefined;
935
+ anamorphic?: boolean | undefined;
936
+ colorGain?: THREE.Color | undefined;
937
+ lensDirtTexture?: THREE.Texture<unknown> | null | undefined;
938
+ haloScale?: number | undefined;
939
+ secondaryGhosts?: boolean | undefined;
940
+ aditionalStreaks?: boolean | undefined;
941
+ ghostScale?: number | undefined;
942
+ opacity?: number | undefined;
943
+ starBurst?: boolean | undefined;
944
+ });
945
+ /**
946
+ * Updates the effect's time uniform for animation.
947
+ *
948
+ * @param _renderer - The WebGL renderer (unused)
949
+ * @param _inputBuffer - The input render target (unused)
950
+ * @param deltaTime - Time elapsed since last frame
951
+ */
952
+ update(_renderer: THREE.WebGLRenderer, _inputBuffer: THREE.WebGLRenderTarget, deltaTime: number): void;
953
+ }
954
+ /**
955
+ * Configuration options for the Angular lens flare component.
956
+ * Extends LensFlareEffect options with position and mouse tracking.
957
+ */
958
+ type LensFlareOptions = ConstructorParameters<typeof LensFlareEffect>[0] & {
959
+ /** World position of the light source for the flare */
960
+ position: NgtVector3;
961
+ /** Whether the flare should follow the mouse cursor */
962
+ followMouse: boolean;
963
+ /** Smoothing time for opacity transitions */
964
+ smoothTime: number;
965
+ };
966
+ /**
967
+ * Angular component that applies a lens flare effect to the scene.
968
+ *
969
+ * This effect simulates realistic camera lens flares with support for
970
+ * dynamic positioning, mouse following, and occlusion detection.
971
+ * The flare automatically fades when occluded by scene objects.
972
+ *
973
+ * @example
974
+ * ```html
975
+ * <ngtp-effect-composer>
976
+ * <ngtp-lens-flare [options]="{ position: [10, 5, -20], glareSize: 0.3 }" />
977
+ * </ngtp-effect-composer>
978
+ * ```
979
+ *
980
+ * @example
981
+ * ```html
982
+ * <!-- Mouse-following flare -->
983
+ * <ngtp-effect-composer>
984
+ * <ngtp-lens-flare [options]="{ followMouse: true, smoothTime: 0.5 }" />
985
+ * </ngtp-effect-composer>
986
+ * ```
987
+ */
988
+ declare class NgtpLensFlare {
989
+ /**
990
+ * Configuration options for the lens flare effect.
991
+ * @see LensFlareOptions
992
+ */
993
+ options: i0.InputSignalWithTransform<{
994
+ blendFunction?: BlendFunction | undefined;
995
+ enabled?: boolean | undefined;
996
+ glareSize?: number | undefined;
997
+ lensPosition?: number[] | undefined;
998
+ iResolution?: number[] | undefined;
999
+ starPoints?: number | undefined;
1000
+ flareSize?: number | undefined;
1001
+ flareSpeed?: number | undefined;
1002
+ flareShape?: number | undefined;
1003
+ animated?: boolean | undefined;
1004
+ anamorphic?: boolean | undefined;
1005
+ colorGain?: THREE.Color | undefined;
1006
+ lensDirtTexture?: THREE.Texture<unknown> | null | undefined;
1007
+ haloScale?: number | undefined;
1008
+ secondaryGhosts?: boolean | undefined;
1009
+ aditionalStreaks?: boolean | undefined;
1010
+ ghostScale?: number | undefined;
1011
+ opacity?: number | undefined;
1012
+ starBurst?: boolean | undefined;
1013
+ } & {
1014
+ /** World position of the light source for the flare */
1015
+ position: NgtVector3;
1016
+ /** Whether the flare should follow the mouse cursor */
1017
+ followMouse: boolean;
1018
+ /** Smoothing time for opacity transitions */
1019
+ smoothTime: number;
1020
+ }, "" | Partial<{
1021
+ blendFunction?: BlendFunction | undefined;
1022
+ enabled?: boolean | undefined;
1023
+ glareSize?: number | undefined;
1024
+ lensPosition?: number[] | undefined;
1025
+ iResolution?: number[] | undefined;
1026
+ starPoints?: number | undefined;
1027
+ flareSize?: number | undefined;
1028
+ flareSpeed?: number | undefined;
1029
+ flareShape?: number | undefined;
1030
+ animated?: boolean | undefined;
1031
+ anamorphic?: boolean | undefined;
1032
+ colorGain?: THREE.Color | undefined;
1033
+ lensDirtTexture?: THREE.Texture<unknown> | null | undefined;
1034
+ haloScale?: number | undefined;
1035
+ secondaryGhosts?: boolean | undefined;
1036
+ aditionalStreaks?: boolean | undefined;
1037
+ ghostScale?: number | undefined;
1038
+ opacity?: number | undefined;
1039
+ starBurst?: boolean | undefined;
1040
+ } & {
1041
+ /** World position of the light source for the flare */
1042
+ position: NgtVector3;
1043
+ /** Whether the flare should follow the mouse cursor */
1044
+ followMouse: boolean;
1045
+ /** Smoothing time for opacity transitions */
1046
+ smoothTime: number;
1047
+ }>>;
1048
+ private store;
1049
+ private effectComposer;
1050
+ private effectOptions;
1051
+ private position;
1052
+ /** Cached vector for projecting 3D position to screen space */
1053
+ private projectedPosition;
1054
+ /** Cached vector for 2D mouse/raycaster coordinates */
1055
+ private mouse2d;
1056
+ /** The underlying LensFlareEffect instance */
1057
+ protected effect: i0.Signal<LensFlareEffect>;
1058
+ constructor();
1059
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpLensFlare, never>;
1060
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpLensFlare, "ngtp-lens-flare", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
1061
+ }
1062
+
1063
+ /**
1064
+ * Configuration options for the LUT (Look-Up Table) effect.
1065
+ */
1066
+ interface LUTOptions {
1067
+ /**
1068
+ * The 3D LUT texture to apply for color grading.
1069
+ * Can be loaded using LUTCubeLoader or LUT3dlLoader.
1070
+ */
1071
+ lut: THREE.Texture;
1072
+ /**
1073
+ * The blend function for combining with the scene.
1074
+ * @default BlendFunction.SRC
1075
+ */
1076
+ blendFunction?: BlendFunction;
1077
+ /**
1078
+ * Whether to use tetrahedral interpolation for smoother color transitions.
1079
+ * @default false
1080
+ */
1081
+ tetrahedralInterpolation?: boolean;
1082
+ }
1083
+ /**
1084
+ * Angular component that applies a LUT (Look-Up Table) color grading effect.
1085
+ *
1086
+ * LUTs are used for color grading in film and photography. This effect applies
1087
+ * a 3D LUT texture to transform the colors of the rendered scene.
1088
+ *
1089
+ * @example
1090
+ * ```typescript
1091
+ * // In component
1092
+ * lutTexture = injectLoader(() => LUTCubeLoader, () => 'path/to/lut.cube');
1093
+ * ```
1094
+ *
1095
+ * ```html
1096
+ * <ngtp-effect-composer>
1097
+ * <ngtp-lut [options]="{ lut: lutTexture() }" />
1098
+ * </ngtp-effect-composer>
1099
+ * ```
1100
+ */
1101
+ declare class NgtpLUT {
1102
+ /**
1103
+ * Configuration options for the LUT effect.
1104
+ * Must include a `lut` texture.
1105
+ * @see LUTOptions
1106
+ */
1107
+ options: i0.InputSignal<LUTOptions>;
1108
+ private lut;
1109
+ private tetrahedralInterpolation;
1110
+ private store;
1111
+ /** The underlying LUT3DEffect instance */
1112
+ protected effect: i0.Signal<LUT3DEffect>;
1113
+ constructor();
1114
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpLUT, never>;
1115
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpLUT, "ngtp-lut", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
1116
+ }
1117
+
1118
+ /**
1119
+ * Configuration options for the noise effect.
1120
+ * Derived from NoiseEffect constructor parameters.
1121
+ */
1122
+ type NoiseEffectOptions = Partial<NonNullable<ConstructorParameters<typeof NoiseEffect>[0]>>;
1123
+ /**
1124
+ * Angular component that applies a noise/grain effect to the scene.
1125
+ *
1126
+ * This effect adds film grain or noise to the rendered image, which can
1127
+ * add a cinematic quality or help hide banding in gradients.
1128
+ *
1129
+ * @example
1130
+ * ```html
1131
+ * <ngtp-effect-composer>
1132
+ * <ngtp-noise [options]="{ premultiply: true }" />
1133
+ * </ngtp-effect-composer>
1134
+ * ```
1135
+ */
1136
+ declare class NgtpNoise {
1137
+ /**
1138
+ * Configuration options for the noise effect.
1139
+ * @see NoiseEffectOptions
1140
+ */
1141
+ options: i0.InputSignal<Omit<Partial<{
1142
+ blendFunction?: BlendFunction;
1143
+ premultiply?: boolean;
1144
+ }>, "blendFunction">>;
1145
+ /** Reference to the host NgtpEffect directive */
1146
+ protected effect: NgtpEffect;
1147
+ constructor();
1148
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpNoise, never>;
1149
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpNoise, "ngtp-noise", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
1150
+ }
1151
+
1152
+ /**
1153
+ * Configuration options for the outline effect.
1154
+ * Extends OutlineEffect options with selection management.
1155
+ */
1156
+ type NgtpOutlineOptions = ConstructorParameters<typeof OutlineEffect>[2] & {
1157
+ /**
1158
+ * Array of objects to outline.
1159
+ * Can be Object3D instances or ElementRefs.
1160
+ * Not needed if using NgtSelectionApi.
1161
+ */
1162
+ selection?: Array<THREE.Object3D | ElementRef<THREE.Object3D>>;
1163
+ /**
1164
+ * The layer used for selection rendering.
1165
+ * @default 10
1166
+ */
1167
+ selectionLayer: number;
1168
+ };
1169
+ /**
1170
+ * Angular component that applies an outline effect to selected objects.
1171
+ *
1172
+ * This effect draws an outline around specified objects in the scene.
1173
+ * Can be used with NgtSelectionApi for declarative selection or with
1174
+ * manual selection via the options input.
1175
+ *
1176
+ * @example
1177
+ * ```html
1178
+ * <!-- With NgtSelectionApi (recommended) -->
1179
+ * <ngt-group [select]="hovered()" (pointerenter)="hovered.set(true)">
1180
+ * <ngt-mesh>...</ngt-mesh>
1181
+ * </ngt-group>
1182
+ *
1183
+ * <ngtp-effect-composer>
1184
+ * <ngtp-outline [options]="{ edgeStrength: 2.5, blur: true }" />
1185
+ * </ngtp-effect-composer>
1186
+ * ```
1187
+ *
1188
+ * @example
1189
+ * ```html
1190
+ * <!-- With manual selection -->
1191
+ * <ngtp-effect-composer>
1192
+ * <ngtp-outline [options]="{ selection: [meshRef.nativeElement], edgeStrength: 5 }" />
1193
+ * </ngtp-effect-composer>
1194
+ * ```
1195
+ */
1196
+ declare class NgtpOutline {
1197
+ /**
1198
+ * Configuration options for the outline effect.
1199
+ * @see NgtpOutlineOptions
1200
+ */
1201
+ options: i0.InputSignalWithTransform<{
1202
+ blendFunction?: postprocessing.BlendFunction;
1203
+ patternTexture?: THREE.Texture;
1204
+ patternScale?: number;
1205
+ edgeStrength?: number;
1206
+ pulseSpeed?: number;
1207
+ visibleEdgeColor?: number;
1208
+ hiddenEdgeColor?: number;
1209
+ multisampling?: number;
1210
+ resolutionScale?: number;
1211
+ resolutionX?: number;
1212
+ resolutionY?: number;
1213
+ width?: number;
1214
+ height?: number;
1215
+ kernelSize?: postprocessing.KernelSize;
1216
+ blur?: boolean;
1217
+ xRay?: boolean;
1218
+ } & {
1219
+ /**
1220
+ * Array of objects to outline.
1221
+ * Can be Object3D instances or ElementRefs.
1222
+ * Not needed if using NgtSelectionApi.
1223
+ */
1224
+ selection?: Array<THREE.Object3D | ElementRef<THREE.Object3D>>;
1225
+ /**
1226
+ * The layer used for selection rendering.
1227
+ * @default 10
1228
+ */
1229
+ selectionLayer: number;
1230
+ }, "" | Partial<{
1231
+ blendFunction?: postprocessing.BlendFunction;
1232
+ patternTexture?: THREE.Texture;
1233
+ patternScale?: number;
1234
+ edgeStrength?: number;
1235
+ pulseSpeed?: number;
1236
+ visibleEdgeColor?: number;
1237
+ hiddenEdgeColor?: number;
1238
+ multisampling?: number;
1239
+ resolutionScale?: number;
1240
+ resolutionX?: number;
1241
+ resolutionY?: number;
1242
+ width?: number;
1243
+ height?: number;
1244
+ kernelSize?: postprocessing.KernelSize;
1245
+ blur?: boolean;
1246
+ xRay?: boolean;
1247
+ } & {
1248
+ /**
1249
+ * Array of objects to outline.
1250
+ * Can be Object3D instances or ElementRefs.
1251
+ * Not needed if using NgtSelectionApi.
1252
+ */
1253
+ selection?: Array<THREE.Object3D | ElementRef<THREE.Object3D>>;
1254
+ /**
1255
+ * The layer used for selection rendering.
1256
+ * @default 10
1257
+ */
1258
+ selectionLayer: number;
1259
+ }>>;
1260
+ private selectionApi;
1261
+ private effectComposer;
1262
+ private store;
1263
+ private selection;
1264
+ private selectionLayer;
1265
+ private blendFunction;
1266
+ private patternTexture;
1267
+ private edgeStrength;
1268
+ private pulseSpeed;
1269
+ private visibleEdgeColor;
1270
+ private hiddenEdgeColor;
1271
+ private width;
1272
+ private height;
1273
+ private kernelSize;
1274
+ private blur;
1275
+ private xRay;
1276
+ private restOptions;
1277
+ /**
1278
+ * The underlying OutlineEffect instance.
1279
+ * Created with the scene, camera, and configured options.
1280
+ */
1281
+ effect: i0.Signal<OutlineEffect>;
1282
+ constructor();
1283
+ /**
1284
+ * Handles changes to the selection and updates the outline effect.
1285
+ *
1286
+ * @param selected - Function returning the currently selected objects
1287
+ * @param _effect - Function returning the OutlineEffect instance
1288
+ * @param _invalidate - Function returning the invalidate callback
1289
+ * @returns Cleanup function to clear the selection
1290
+ */
1291
+ private handleSelectionChangeEffect;
1292
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpOutline, never>;
1293
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpOutline, "ngtp-outline", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
1294
+ }
1295
+
1296
+ /**
1297
+ * Configuration options for the pixelation effect.
1298
+ */
1299
+ interface PixelationOptions {
1300
+ /**
1301
+ * The pixel granularity - higher values create larger pixels.
1302
+ * @default 5
1303
+ */
1304
+ granularity: number;
1305
+ }
1306
+ /**
1307
+ * Angular component that applies a pixelation effect to the scene.
1308
+ *
1309
+ * This effect reduces the resolution of the rendered image to create
1310
+ * a retro, 8-bit style appearance.
1311
+ *
1312
+ * @example
1313
+ * ```html
1314
+ * <ngtp-effect-composer>
1315
+ * <ngtp-pixelation [options]="{ granularity: 10 }" />
1316
+ * </ngtp-effect-composer>
1317
+ * ```
1318
+ */
1319
+ declare class NgtpPixelation {
1320
+ /**
1321
+ * Configuration options for the pixelation effect.
1322
+ * @default { granularity: 5 }
1323
+ * @see PixelationOptions
1324
+ */
1325
+ options: i0.InputSignalWithTransform<{
1326
+ granularity: number;
1327
+ }, "" | Partial<{
1328
+ granularity: number;
1329
+ }>>;
1330
+ private granularity;
1331
+ /** The underlying PixelationEffect instance */
1332
+ protected effect: i0.Signal<PixelationEffect>;
1333
+ constructor();
1334
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpPixelation, never>;
1335
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpPixelation, "ngtp-pixelation", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
1336
+ }
1337
+
1338
+ /**
1339
+ * Configuration options for the scanline effect.
1340
+ * Derived from ScanlineEffect constructor parameters.
1341
+ */
1342
+ type ScanlineEffectOptions = Partial<NonNullable<ConstructorParameters<typeof ScanlineEffect>[0]>>;
1343
+ /**
1344
+ * Angular component that applies a scanline effect to the scene.
1345
+ *
1346
+ * This effect overlays horizontal scanlines on the image, simulating
1347
+ * the appearance of old CRT monitors or television screens.
1348
+ *
1349
+ * @example
1350
+ * ```html
1351
+ * <ngtp-effect-composer>
1352
+ * <ngtp-scanline [options]="{ density: 2.0 }" />
1353
+ * </ngtp-effect-composer>
1354
+ * ```
1355
+ */
1356
+ declare class NgtpScanline {
1357
+ /**
1358
+ * Configuration options for the scanline effect.
1359
+ * @default { density: 1.25 }
1360
+ * @see ScanlineEffectOptions
1361
+ */
1362
+ options: i0.InputSignalWithTransform<Omit<Partial<{
1363
+ blendFunction?: BlendFunction;
1364
+ density?: number;
1365
+ }>, "blendFunction">, "" | Partial<Omit<Partial<{
1366
+ blendFunction?: BlendFunction;
1367
+ density?: number;
1368
+ }>, "blendFunction">>>;
1369
+ /** Reference to the host NgtpEffect directive */
1370
+ protected effect: NgtpEffect;
1371
+ constructor();
1372
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpScanline, never>;
1373
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpScanline, "ngtp-scanline", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
1374
+ }
1375
+
1376
+ /**
1377
+ * Configuration options for the selective bloom effect.
1378
+ * Extends BloomEffectOptions with selection control properties.
1379
+ */
1380
+ type SelectiveBloomOptions = BloomEffectOptions & {
1381
+ /**
1382
+ * The layer used for selection rendering.
1383
+ * @default 10
1384
+ */
1385
+ selectionLayer: number;
1386
+ /**
1387
+ * Whether to invert the selection (bloom everything except selected).
1388
+ * @default false
1389
+ */
1390
+ inverted: boolean;
1391
+ /**
1392
+ * Whether to ignore the background in the bloom effect.
1393
+ * @default false
1394
+ */
1395
+ ignoreBackground: boolean;
1396
+ };
1397
+ /**
1398
+ * Angular component that applies bloom only to selected objects.
1399
+ *
1400
+ * Unlike the standard bloom effect, selective bloom allows you to specify
1401
+ * which objects should glow. Requires light sources to be provided for
1402
+ * proper rendering.
1403
+ *
1404
+ * Can be used with NgtSelectionApi for declarative selection or with
1405
+ * manual selection via the selection input.
1406
+ *
1407
+ * @example
1408
+ * ```html
1409
+ * <ngtp-effect-composer>
1410
+ * <ngtp-selective-bloom
1411
+ * [lights]="[ambientLightRef, pointLightRef]"
1412
+ * [selection]="[glowingMeshRef]"
1413
+ * [options]="{ intensity: 2, luminanceThreshold: 0 }"
1414
+ * />
1415
+ * </ngtp-effect-composer>
1416
+ * ```
1417
+ */
1418
+ declare class NgtpSelectiveBloom {
1419
+ /**
1420
+ * Light sources that should be included in the bloom calculation.
1421
+ * Required for proper selective bloom rendering.
1422
+ */
1423
+ lights: i0.InputSignal<THREE.Object3D<THREE.Object3DEventMap>[] | ElementRef<THREE.Object3D<THREE.Object3DEventMap> | undefined>[]>;
1424
+ /**
1425
+ * Objects to apply bloom to.
1426
+ * Can be a single object, array of objects, or ElementRefs.
1427
+ * Not needed if using NgtSelectionApi.
1428
+ * @default []
1429
+ */
1430
+ selection: i0.InputSignal<THREE.Object3D<THREE.Object3DEventMap> | THREE.Object3D<THREE.Object3DEventMap>[] | ElementRef<THREE.Object3D<THREE.Object3DEventMap> | undefined> | ElementRef<THREE.Object3D<THREE.Object3DEventMap> | undefined>[]>;
1431
+ /**
1432
+ * Configuration options for the selective bloom effect.
1433
+ * @see SelectiveBloomOptions
1434
+ */
1435
+ options: i0.InputSignalWithTransform<SelectiveBloomOptions, "" | Partial<SelectiveBloomOptions>>;
1436
+ private blendFunction;
1437
+ private luminanceThreshold;
1438
+ private luminanceSmoothing;
1439
+ private mipmapBlur;
1440
+ private intensity;
1441
+ private radius;
1442
+ private levels;
1443
+ private kernelSize;
1444
+ private resolutionScale;
1445
+ private width;
1446
+ private height;
1447
+ private resolutionX;
1448
+ private resolutionY;
1449
+ private inverted;
1450
+ private ignoreBackground;
1451
+ private selectionLayer;
1452
+ private store;
1453
+ private effectComposer;
1454
+ private selectionApi;
1455
+ private resolvedLights;
1456
+ private resolvedSelected;
1457
+ private resolvedNgtSelected;
1458
+ /**
1459
+ * The underlying SelectiveBloomEffect instance.
1460
+ * Created with the scene, camera, and configured options.
1461
+ */
1462
+ protected effect: i0.Signal<SelectiveBloomEffect>;
1463
+ constructor();
1464
+ /**
1465
+ * Enables the selection layer on a light source.
1466
+ *
1467
+ * @param effect - The SelectiveBloomEffect instance
1468
+ * @param light - The light to enable on the selection layer
1469
+ */
1470
+ private addLight;
1471
+ /**
1472
+ * Disables the selection layer on a light source.
1473
+ *
1474
+ * @param effect - The SelectiveBloomEffect instance
1475
+ * @param light - The light to disable from the selection layer
1476
+ */
1477
+ private removeLight;
1478
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpSelectiveBloom, never>;
1479
+ static ɵcmp: i0.ɵɵ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>;
1480
+ }
1481
+
1482
+ /**
1483
+ * Configuration options for the sepia effect.
1484
+ * Derived from SepiaEffect constructor parameters.
1485
+ */
1486
+ type SepiaEffectOptions = Partial<NonNullable<ConstructorParameters<typeof SepiaEffect>[0]>>;
1487
+ /**
1488
+ * Angular component that applies a sepia tone effect to the scene.
1489
+ *
1490
+ * This effect gives the rendered image a warm, brownish tint similar to
1491
+ * old photographs, creating a vintage or nostalgic appearance.
1492
+ *
1493
+ * @example
1494
+ * ```html
1495
+ * <ngtp-effect-composer>
1496
+ * <ngtp-sepia [options]="{ intensity: 0.5 }" />
1497
+ * </ngtp-effect-composer>
1498
+ * ```
1499
+ */
1500
+ declare class NgtpSepia {
1501
+ /**
1502
+ * Configuration options for the sepia effect.
1503
+ * @see SepiaEffectOptions
1504
+ */
1505
+ options: i0.InputSignal<Omit<Partial<{
1506
+ blendFunction?: postprocessing.BlendFunction;
1507
+ intensity?: number;
1508
+ }>, "blendFunction">>;
1509
+ /** Reference to the host NgtpEffect directive */
1510
+ protected effect: NgtpEffect;
1511
+ constructor();
1512
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpSepia, never>;
1513
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpSepia, "ngtp-sepia", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
1514
+ }
1515
+
1516
+ /**
1517
+ * Configuration options for the shock wave effect.
1518
+ * Derived from ShockWaveEffect constructor parameters.
1519
+ */
1520
+ type ShockWaveEffectOptions = Partial<NonNullable<ConstructorParameters<typeof ShockWaveEffect>[0]>>;
1521
+ /**
1522
+ * Angular component that applies a shock wave distortion effect.
1523
+ *
1524
+ * This effect creates an expanding ring distortion that simulates a
1525
+ * shock wave or explosion ripple emanating from a point in the scene.
1526
+ *
1527
+ * @example
1528
+ * ```html
1529
+ * <ngtp-effect-composer>
1530
+ * <ngtp-shock-wave
1531
+ * [options]="{ speed: 2, maxRadius: 1, waveSize: 0.2, amplitude: 0.05 }"
1532
+ * />
1533
+ * </ngtp-effect-composer>
1534
+ * ```
1535
+ */
1536
+ declare class NgtpShockWave {
1537
+ /**
1538
+ * Configuration options for the shock wave effect.
1539
+ * @see ShockWaveEffectOptions
1540
+ */
1541
+ options: i0.InputSignal<Omit<Partial<THREE.Camera>, "blendFunction">>;
1542
+ /** Reference to the host NgtpEffect directive */
1543
+ protected effect: NgtpEffect;
1544
+ constructor();
1545
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpShockWave, never>;
1546
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpShockWave, "ngtp-shock-wave", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
1547
+ }
1548
+
1549
+ /**
1550
+ * Configuration options for the SMAA effect.
1551
+ * Derived from SMAAEffect constructor parameters.
1552
+ */
1553
+ type SMAAEffectOptions = Partial<NonNullable<ConstructorParameters<typeof SMAAEffect>[0]>>;
1554
+ /**
1555
+ * Angular component that applies Subpixel Morphological Anti-Aliasing (SMAA).
1556
+ *
1557
+ * SMAA is a high-quality, efficient anti-aliasing technique that provides
1558
+ * better results than FXAA while being less demanding than multisampling.
1559
+ * It's particularly effective at smoothing edges while preserving sharpness.
1560
+ *
1561
+ * @example
1562
+ * ```html
1563
+ * <ngtp-effect-composer [options]="{ multisampling: 0 }">
1564
+ * <ngtp-smaa />
1565
+ * </ngtp-effect-composer>
1566
+ * ```
1567
+ *
1568
+ * @example
1569
+ * ```html
1570
+ * <!-- With preset -->
1571
+ * <ngtp-effect-composer>
1572
+ * <ngtp-smaa [options]="{ preset: SMAAPreset.ULTRA }" />
1573
+ * </ngtp-effect-composer>
1574
+ * ```
1575
+ */
1576
+ declare class NgtpSMAA {
1577
+ /**
1578
+ * Configuration options for the SMAA effect.
1579
+ * @see SMAAEffectOptions
1580
+ */
1581
+ options: i0.InputSignal<Omit<Partial<{
1582
+ preset?: postprocessing.SMAAPreset;
1583
+ edgeDetectionMode?: postprocessing.EdgeDetectionMode;
1584
+ predicationMode?: postprocessing.PredicationMode;
1585
+ }>, "blendFunction">>;
1586
+ /** Reference to the host NgtpEffect directive */
1587
+ protected effect: NgtpEffect;
1588
+ constructor();
1589
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpSMAA, never>;
1590
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpSMAA, "ngtp-smaa", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
1591
+ }
1592
+
1593
+ /**
1594
+ * Configuration options for the tilt-shift effect.
1595
+ * Derived from TiltShiftEffect constructor parameters.
1596
+ */
1597
+ type TiltShiftEffectOptions = Partial<NonNullable<ConstructorParameters<typeof TiltShiftEffect>[0]>>;
1598
+ /**
1599
+ * Angular component that applies a tilt-shift blur effect.
1600
+ *
1601
+ * This effect simulates the shallow depth of field look from tilt-shift
1602
+ * photography, creating a "miniature" or "diorama" appearance where only
1603
+ * a horizontal band of the image is in focus.
1604
+ *
1605
+ * Uses the postprocessing library's built-in TiltShiftEffect.
1606
+ *
1607
+ * @example
1608
+ * ```html
1609
+ * <ngtp-effect-composer>
1610
+ * <ngtp-tilt-shift [options]="{ blur: 0.5, offset: 0.5 }" />
1611
+ * </ngtp-effect-composer>
1612
+ * ```
1613
+ *
1614
+ * @see NgtpTiltShift2 for an alternative implementation with different parameters
1615
+ */
1616
+ declare class NgtpTiltShift {
1617
+ /**
1618
+ * Configuration options for the tilt-shift effect.
1619
+ * @see TiltShiftEffectOptions
1620
+ */
1621
+ options: i0.InputSignal<Omit<Partial<{
1622
+ blendFunction?: BlendFunction;
1623
+ offset?: number;
1624
+ rotation?: number;
1625
+ focusArea?: number;
1626
+ feather?: number;
1627
+ bias?: number;
1628
+ kernelSize?: postprocessing.KernelSize;
1629
+ resolutionScale?: number;
1630
+ resolutionX?: number;
1631
+ resolutionY?: number;
1632
+ }>, "blendFunction">>;
1633
+ /** Reference to the host NgtpEffect directive */
1634
+ protected effect: NgtpEffect;
1635
+ constructor();
1636
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpTiltShift, never>;
1637
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpTiltShift, "ngtp-tilt-shift", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
1638
+ }
1639
+
1640
+ /**
1641
+ * A custom tilt-shift effect with line-based focus control.
1642
+ *
1643
+ * This effect provides a different approach to tilt-shift compared to
1644
+ * the standard TiltShiftEffect, allowing you to define a focus line
1645
+ * between two screen-space points.
1646
+ *
1647
+ * @example
1648
+ * ```typescript
1649
+ * const effect = new TiltShift2Effect({
1650
+ * blur: 0.2,
1651
+ * start: [0.5, 0.3],
1652
+ * end: [0.5, 0.7]
1653
+ * });
1654
+ * ```
1655
+ */
1656
+ declare class TiltShift2Effect extends Effect {
1657
+ /**
1658
+ * Creates a new TiltShift2Effect instance.
1659
+ *
1660
+ * @param options - Configuration options
1661
+ * @param options.blendFunction - How to blend with the scene
1662
+ * @param options.blur - Blur intensity [0, 1], can exceed 1 for more blur
1663
+ * @param options.taper - Taper of the focus area [0, 1]
1664
+ * @param options.start - Start point of focus line in screen space [x, y]
1665
+ * @param options.end - End point of focus line in screen space [x, y]
1666
+ * @param options.samples - Number of blur samples
1667
+ * @param options.direction - Direction of the blur
1668
+ */
1669
+ constructor({ blendFunction, blur, // [0, 1], can go beyond 1 for extra
1670
+ taper, // [0, 1], can go beyond 1 for extra
1671
+ start, // [0,1] percentage x,y of screenspace
1672
+ end, // [0,1] percentage x,y of screenspace
1673
+ samples, // number of blur samples
1674
+ direction, }?: {
1675
+ blendFunction?: BlendFunction | undefined;
1676
+ blur?: number | undefined;
1677
+ taper?: number | undefined;
1678
+ start?: number[] | undefined;
1679
+ end?: number[] | undefined;
1680
+ samples?: number | undefined;
1681
+ direction?: number[] | undefined;
1682
+ });
1683
+ }
1684
+ /**
1685
+ * Configuration options for the TiltShift2 effect.
1686
+ * Derived from TiltShift2Effect constructor parameters.
1687
+ */
1688
+ type TiltShift2EffectOptions = Partial<NonNullable<ConstructorParameters<typeof TiltShift2Effect>[0]>>;
1689
+ /**
1690
+ * Angular component that applies an alternative tilt-shift effect.
1691
+ *
1692
+ * This effect uses a line-based focus system where you define start and
1693
+ * end points in screen space. The area between these points stays in focus
1694
+ * while the rest of the image is blurred.
1695
+ *
1696
+ * @example
1697
+ * ```html
1698
+ * <ngtp-effect-composer>
1699
+ * <ngtp-tilt-shift2 [options]="{ blur: 0.2, start: [0.5, 0.3], end: [0.5, 0.7] }" />
1700
+ * </ngtp-effect-composer>
1701
+ * ```
1702
+ *
1703
+ * @see NgtpTiltShift for the standard tilt-shift implementation
1704
+ */
1705
+ declare class NgtpTiltShift2 {
1706
+ /**
1707
+ * Configuration options for the tilt-shift effect.
1708
+ * @see TiltShift2EffectOptions
1709
+ */
1710
+ options: i0.InputSignal<Omit<Partial<{
1711
+ blendFunction?: BlendFunction | undefined;
1712
+ blur?: number | undefined;
1713
+ taper?: number | undefined;
1714
+ start?: number[] | undefined;
1715
+ end?: number[] | undefined;
1716
+ samples?: number | undefined;
1717
+ direction?: number[] | undefined;
1718
+ }>, "blendFunction">>;
1719
+ /** Reference to the host NgtpEffect directive */
1720
+ protected effect: NgtpEffect;
1721
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpTiltShift2, never>;
1722
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpTiltShift2, "ngtp-tilt-shift2", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
1723
+ }
1724
+
1725
+ /**
1726
+ * Configuration options for the tone mapping effect.
1727
+ * Derived from ToneMappingEffect constructor parameters.
1728
+ */
1729
+ type ToneMappingEffectOptions = NonNullable<ConstructorParameters<typeof ToneMappingEffect>[0]>;
1730
+ /**
1731
+ * Angular component that applies tone mapping to the scene.
1732
+ *
1733
+ * Tone mapping converts HDR (High Dynamic Range) values to LDR (Low Dynamic
1734
+ * Range) for display. Various tone mapping modes are available including
1735
+ * Reinhard, ACES Filmic, and custom linear options.
1736
+ *
1737
+ * Note: The effect composer disables Three.js's built-in tone mapping,
1738
+ * so this effect should be used if tone mapping is desired.
1739
+ *
1740
+ * @example
1741
+ * ```html
1742
+ * <ngtp-effect-composer>
1743
+ * <ngtp-tone-mapping [options]="{ mode: ToneMappingMode.ACES_FILMIC }" />
1744
+ * </ngtp-effect-composer>
1745
+ * ```
1746
+ */
1747
+ declare class NgtpToneMapping {
1748
+ /**
1749
+ * Configuration options for the tone mapping effect.
1750
+ * @see ToneMappingEffectOptions
1751
+ */
1752
+ options: i0.InputSignal<Omit<{
1753
+ blendFunction?: postprocessing.BlendFunction;
1754
+ adaptive?: boolean;
1755
+ mode?: postprocessing.ToneMappingMode;
1756
+ resolution?: number;
1757
+ maxLuminance?: number;
1758
+ whitePoint?: number;
1759
+ middleGrey?: number;
1760
+ minLuminance?: number;
1761
+ averageLuminance?: number;
1762
+ adaptationRate?: number;
1763
+ }, "blendFunction">>;
1764
+ /** Reference to the host NgtpEffect directive */
1765
+ protected effect: NgtpEffect;
1766
+ constructor();
1767
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpToneMapping, never>;
1768
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpToneMapping, "ngtp-tone-mapping", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
1769
+ }
1770
+
1771
+ /**
1772
+ * Configuration options for the vignette effect.
1773
+ * Derived from VignetteEffect constructor parameters.
1774
+ */
1775
+ type VignetteEffectOptions = Partial<NonNullable<ConstructorParameters<typeof VignetteEffect>[0]>>;
1776
+ /**
1777
+ * Angular component that applies a vignette effect to the scene.
1778
+ *
1779
+ * This effect darkens the corners and edges of the image, drawing the
1780
+ * viewer's attention to the center. It's a common cinematic technique
1781
+ * for creating focus and atmosphere.
1782
+ *
1783
+ * @example
1784
+ * ```html
1785
+ * <ngtp-effect-composer>
1786
+ * <ngtp-vignette [options]="{ darkness: 0.5, offset: 0.3 }" />
1787
+ * </ngtp-effect-composer>
1788
+ * ```
1789
+ */
1790
+ declare class NgtpVignette {
1791
+ /**
1792
+ * Configuration options for the vignette effect.
1793
+ * @see VignetteEffectOptions
1794
+ */
1795
+ options: i0.InputSignal<Omit<Partial<{
1796
+ blendFunction?: postprocessing.BlendFunction;
1797
+ technique?: postprocessing.VignetteTechnique;
1798
+ eskil?: boolean;
1799
+ offset?: number;
1800
+ darkness?: number;
1801
+ }>, "blendFunction">>;
1802
+ /** Reference to the host NgtpEffect directive */
1803
+ protected effect: NgtpEffect;
1804
+ constructor();
1805
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpVignette, never>;
1806
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpVignette, "ngtp-vignette", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
1807
+ }
1808
+
1809
+ /**
1810
+ * A postprocessing effect that simulates an underwater/water distortion.
1811
+ *
1812
+ * Creates animated rippling distortion that makes the scene appear as if
1813
+ * viewed through water or a heat haze.
1814
+ *
1815
+ * @example
1816
+ * ```typescript
1817
+ * const effect = new WaterEffect({ factor: 0.5 });
1818
+ * ```
1819
+ */
1820
+ declare class WaterEffect extends Effect {
1821
+ /**
1822
+ * Creates a new WaterEffect instance.
1823
+ *
1824
+ * @param options - Configuration options
1825
+ * @param options.blendFunction - How to blend with the scene
1826
+ * @param options.factor - Intensity of the water effect (0 = no effect)
1827
+ */
1828
+ constructor({ blendFunction, factor }?: {
1829
+ blendFunction?: BlendFunction | undefined;
1830
+ factor?: number | undefined;
1831
+ });
1832
+ }
1833
+ /**
1834
+ * Configuration options for the water effect.
1835
+ * Derived from WaterEffect constructor parameters.
1836
+ */
1837
+ type WaterEffectOptions = Partial<NonNullable<ConstructorParameters<typeof WaterEffect>[0]>>;
1838
+ /**
1839
+ * Angular component that applies a water/ripple distortion effect.
1840
+ *
1841
+ * This effect creates an animated underwater-like distortion that can
1842
+ * simulate viewing through water, heat haze, or a dream-like state.
1843
+ *
1844
+ * @example
1845
+ * ```html
1846
+ * <ngtp-effect-composer>
1847
+ * <ngtp-water [options]="{ factor: 0.5 }" />
1848
+ * </ngtp-effect-composer>
1849
+ * ```
1850
+ */
1851
+ declare class NgtpWater {
1852
+ /**
1853
+ * Configuration options for the water effect.
1854
+ * @see WaterEffectOptions
1855
+ */
1856
+ options: i0.InputSignal<Omit<Partial<{
1857
+ blendFunction?: BlendFunction | undefined;
1858
+ factor?: number | undefined;
1859
+ }>, "blendFunction">>;
1860
+ /** Reference to the host NgtpEffect directive */
1861
+ protected effect: NgtpEffect;
1862
+ constructor();
1863
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgtpWater, never>;
1864
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgtpWater, "ngtp-water", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof NgtpEffect; inputs: { "blendFunction": "blendFunction"; "opacity": "opacity"; }; outputs: {}; }]>;
1865
+ }
1866
+
1867
+ 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 };
1868
+ 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 };