angular-three-postprocessing 2.0.0-beta.4 → 2.0.0-beta.40

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.
Files changed (90) hide show
  1. package/esm2022/index.mjs +4 -3
  2. package/esm2022/lib/effect-composer.mjs +249 -0
  3. package/esm2022/lib/effect.mjs +78 -0
  4. package/esm2022/lib/effects/bloom/bloom.mjs +33 -0
  5. package/esm2022/lib/effects/brightness-contrast/brightness-contrast.mjs +29 -0
  6. package/esm2022/lib/effects/color-depth/color-depth.mjs +29 -0
  7. package/esm2022/lib/effects/depth/depth.mjs +29 -0
  8. package/esm2022/lib/effects/dot-screen/dot-screen.mjs +29 -0
  9. package/esm2022/lib/effects/hue-saturation/hue-saturation.mjs +29 -0
  10. package/esm2022/lib/effects/index.mjs +18 -0
  11. package/esm2022/lib/effects/lut/lut.mjs +74 -0
  12. package/esm2022/lib/effects/noise/noise.mjs +33 -0
  13. package/esm2022/lib/effects/pixelation/pixelation.mjs +37 -0
  14. package/esm2022/lib/effects/scanline/scanline.mjs +33 -0
  15. package/esm2022/lib/effects/sepia/sepia.mjs +29 -0
  16. package/esm2022/lib/effects/shock-wave/shock-wave.mjs +29 -0
  17. package/esm2022/lib/effects/smaa/smaa.mjs +29 -0
  18. package/esm2022/lib/effects/ssao/ssao.mjs +217 -0
  19. package/esm2022/lib/effects/tilt-shift/tilt-shift.mjs +33 -0
  20. package/esm2022/lib/effects/tone-mapping/tone-mapping.mjs +29 -0
  21. package/esm2022/lib/effects/vignette/vignette.mjs +29 -0
  22. package/fesm2022/angular-three-postprocessing.mjs +881 -206
  23. package/fesm2022/angular-three-postprocessing.mjs.map +1 -1
  24. package/index.d.ts +3 -2
  25. package/lib/effect-composer.d.ts +105 -0
  26. package/lib/effect.d.ts +27 -0
  27. package/{effects → lib/effects}/bloom/bloom.d.ts +7 -2
  28. package/{effects → lib/effects}/brightness-contrast/brightness-contrast.d.ts +9 -1
  29. package/{effects → lib/effects}/color-depth/color-depth.d.ts +8 -1
  30. package/{effects → lib/effects}/depth/depth.d.ts +8 -1
  31. package/{effects → lib/effects}/dot-screen/dot-screen.d.ts +9 -1
  32. package/{effects → lib/effects}/hue-saturation/hue-saturation.d.ts +9 -1
  33. package/{effects → lib/effects}/index.d.ts +1 -0
  34. package/lib/effects/lut/lut.d.ts +29 -0
  35. package/{effects → lib/effects}/noise/noise.d.ts +8 -1
  36. package/lib/effects/pixelation/pixelation.d.ts +20 -0
  37. package/{effects → lib/effects}/scanline/scanline.d.ts +8 -1
  38. package/{effects → lib/effects}/sepia/sepia.d.ts +8 -1
  39. package/lib/effects/shock-wave/shock-wave.d.ts +17 -0
  40. package/lib/effects/smaa/smaa.d.ts +16 -0
  41. package/lib/effects/ssao/ssao.d.ts +42 -0
  42. package/lib/effects/tilt-shift/tilt-shift.d.ts +23 -0
  43. package/lib/effects/tone-mapping/tone-mapping.d.ts +22 -0
  44. package/lib/effects/vignette/vignette.d.ts +17 -0
  45. package/package.json +4 -14
  46. package/effect-composer.d.ts +0 -53
  47. package/effect.d.ts +0 -24
  48. package/effects/README.md +0 -3
  49. package/effects/lut/lut.d.ts +0 -19
  50. package/effects/shock-wave/shock-wave.d.ts +0 -7
  51. package/effects/smaa/smaa.d.ts +0 -7
  52. package/effects/ssao/ssao.d.ts +0 -38
  53. package/effects/tilt-shift/tilt-shift.d.ts +0 -8
  54. package/effects/tone-mapping/tone-mapping.d.ts +0 -7
  55. package/effects/vignette/vignette.d.ts +0 -7
  56. package/esm2022/effect-composer.mjs +0 -242
  57. package/esm2022/effect.mjs +0 -79
  58. package/esm2022/effects/angular-three-postprocessing-effects.mjs +0 -5
  59. package/esm2022/effects/bloom/bloom.mjs +0 -34
  60. package/esm2022/effects/brightness-contrast/brightness-contrast.mjs +0 -30
  61. package/esm2022/effects/color-depth/color-depth.mjs +0 -30
  62. package/esm2022/effects/depth/depth.mjs +0 -30
  63. package/esm2022/effects/dot-screen/dot-screen.mjs +0 -30
  64. package/esm2022/effects/hue-saturation/hue-saturation.mjs +0 -30
  65. package/esm2022/effects/index.mjs +0 -17
  66. package/esm2022/effects/lut/lut.mjs +0 -77
  67. package/esm2022/effects/noise/noise.mjs +0 -34
  68. package/esm2022/effects/scanline/scanline.mjs +0 -34
  69. package/esm2022/effects/sepia/sepia.mjs +0 -30
  70. package/esm2022/effects/shock-wave/shock-wave.mjs +0 -30
  71. package/esm2022/effects/smaa/smaa.mjs +0 -30
  72. package/esm2022/effects/ssao/ssao.mjs +0 -187
  73. package/esm2022/effects/tilt-shift/tilt-shift.mjs +0 -34
  74. package/esm2022/effects/tone-mapping/tone-mapping.mjs +0 -30
  75. package/esm2022/effects/vignette/vignette.mjs +0 -30
  76. package/fesm2022/angular-three-postprocessing-effects.mjs +0 -617
  77. package/fesm2022/angular-three-postprocessing-effects.mjs.map +0 -1
  78. package/plugin/README.md +0 -11
  79. package/plugin/generators.json +0 -19
  80. package/plugin/package.json +0 -9
  81. package/plugin/src/generators/init/compat.d.ts +0 -2
  82. package/plugin/src/generators/init/compat.js +0 -6
  83. package/plugin/src/generators/init/compat.js.map +0 -1
  84. package/plugin/src/generators/init/init.d.ts +0 -4
  85. package/plugin/src/generators/init/init.js +0 -22
  86. package/plugin/src/generators/init/init.js.map +0 -1
  87. package/plugin/src/generators/init/schema.json +0 -6
  88. package/plugin/src/index.d.ts +0 -1
  89. package/plugin/src/index.js +0 -6
  90. package/plugin/src/index.js.map +0 -1
@@ -1,65 +1,64 @@
1
1
  import * as i0 from '@angular/core';
2
- import { inject, computed, effect, Directive, Input, InjectionToken, Component, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
3
- import { NgtSignalStore, injectNgtRef, NgtStore, getLocalState, requestAnimationInInjectionContext, extend, injectBeforeRender } from 'angular-three';
4
- import { BlendFunction, EffectComposer, RenderPass, NormalPass, DepthDownsamplingPass, EffectPass } from 'postprocessing';
2
+ import { computed, effect, Directive, Input, forwardRef, inject, Injector, Component, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
3
+ import { signalStore, injectNgtRef, injectNgtStore, getLocalState, is, extend, injectBeforeRender, NgtArgs } from 'angular-three';
4
+ import { BlendFunction, EffectComposer, RenderPass, NormalPass, DepthDownsamplingPass, Effect, EffectPass, Pass, BloomEffect, BrightnessContrastEffect, ColorDepthEffect, DepthEffect, DotScreenEffect, HueSaturationEffect, LUT3DEffect, NoiseEffect, PixelationEffect, ScanlineEffect, SepiaEffect, ShockWaveEffect, SMAAEffect, SSAOEffect, TiltShiftEffect, ToneMappingEffect, VignetteEffect } from 'postprocessing';
5
+ import { createInjectionToken } from 'ngxtension/create-injection-token';
5
6
  import * as THREE from 'three';
6
7
  import { Group } from 'three';
7
8
  import { isWebGL2Available } from 'three-stdlib';
8
9
 
9
- class NgtpEffect extends NgtSignalStore {
10
- set blendFunction(blendFunction) {
11
- this.set({ blendFunction });
10
+ class NgtpEffect {
11
+ set _blendFunction(blendFunction) {
12
+ this.inputs.set({ blendFunction });
12
13
  }
13
- set opacity(opacity) {
14
- this.set({ opacity });
14
+ set _opacity(opacity) {
15
+ this.inputs.set({ opacity });
15
16
  }
16
- #previousProps;
17
- #nativeProps;
18
17
  constructor() {
19
- super();
18
+ this.inputs = signalStore();
20
19
  this.effectRef = injectNgtRef();
21
20
  this.defaultBlendFunction = BlendFunction.NORMAL;
22
21
  this.nativeArgs = () => [];
23
- this.effectBlendFunction = this.select('blendFunction');
24
- this.effectOpacity = this.select('opacity');
25
- this.store = inject(NgtStore);
22
+ this.blendFunction = this.inputs.select('blendFunction');
23
+ this.opacity = this.inputs.select('opacity');
24
+ this.store = injectNgtStore();
26
25
  this.camera = this.store.select('camera');
27
- this.#nativeProps = computed(() => {
26
+ this.invalidate = this.store.select('invalidate');
27
+ this.nativeInputs = computed(() => {
28
28
  const effect = this.effectRef.nativeElement;
29
29
  if (!effect)
30
- return this.#previousProps || null;
30
+ return this.previousInputs || null;
31
31
  const localState = getLocalState(effect);
32
32
  if (!localState)
33
- return this.#previousProps || null;
34
- const nativeProps = localState.nativeProps.select()();
33
+ return this.previousInputs || null;
34
+ const nativeProps = localState.nativeProps.state();
35
35
  delete nativeProps['__ngt_dummy_state__'];
36
36
  if ('camera' in nativeProps) {
37
37
  delete nativeProps['camera'];
38
38
  }
39
- return (this.#previousProps = nativeProps);
40
- }, { equal: Object.is });
39
+ if (!Object.keys(nativeProps).length)
40
+ return this.previousInputs || null;
41
+ return (this.previousInputs = nativeProps);
42
+ }, { equal: (a, b) => is.equ(a, b, { objects: 'shallow' }) });
41
43
  this.args = computed(() => {
42
- const nativeProps = this.#nativeProps();
43
- const nativeArgs = this.nativeArgs();
44
- if (nativeProps)
45
- return [...nativeArgs, ...[{ ...nativeProps }]];
46
- return [...nativeArgs];
47
- });
48
- requestAnimationInInjectionContext(() => {
49
- this.#setBlendMode();
44
+ const [nativeInputs, nativeArgs] = [this.nativeInputs(), this.nativeArgs()];
45
+ if (nativeInputs) {
46
+ nativeArgs.push(nativeInputs);
47
+ }
48
+ return nativeArgs;
50
49
  });
50
+ this.setBlendMode();
51
51
  }
52
- #setBlendMode() {
53
- const trigger = computed(() => ({
54
- blendFunction: this.effectBlendFunction(),
55
- opacity: this.effectOpacity(),
56
- effect: this.effectRef.nativeElement,
57
- }));
52
+ setBlendMode() {
58
53
  effect(() => {
59
- const { effect, blendFunction, opacity } = trigger();
54
+ const [blendFunction, opacity, effect, invalidate] = [
55
+ this.blendFunction(),
56
+ this.opacity(),
57
+ this.effectRef.nativeElement,
58
+ this.invalidate(),
59
+ ];
60
60
  if (!effect)
61
61
  return;
62
- const invalidate = this.store.get('invalidate');
63
62
  effect.blendMode.blendFunction =
64
63
  !blendFunction && blendFunction !== 0 ? this.defaultBlendFunction : blendFunction;
65
64
  if (opacity !== undefined)
@@ -67,73 +66,59 @@ class NgtpEffect extends NgtSignalStore {
67
66
  invalidate();
68
67
  });
69
68
  }
70
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: NgtpEffect, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
71
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: NgtpEffect, inputs: { effectRef: "effectRef", blendFunction: "blendFunction", opacity: "opacity" }, usesInheritance: true, ngImport: i0 }); }
69
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpEffect, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
70
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.3", type: NgtpEffect, inputs: { effectRef: "effectRef", _blendFunction: ["blendFunction", "_blendFunction"], _opacity: ["opacity", "_opacity"] }, ngImport: i0 }); }
72
71
  }
73
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: NgtpEffect, decorators: [{
72
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpEffect, decorators: [{
74
73
  type: Directive
75
74
  }], ctorParameters: function () { return []; }, propDecorators: { effectRef: [{
76
75
  type: Input
77
- }], blendFunction: [{
78
- type: Input
79
- }], opacity: [{
80
- type: Input
76
+ }], _blendFunction: [{
77
+ type: Input,
78
+ args: [{ alias: 'blendFunction' }]
79
+ }], _opacity: [{
80
+ type: Input,
81
+ args: [{ alias: 'opacity' }]
81
82
  }] } });
82
83
 
83
84
  extend({ Group });
84
- const NGTP_EFFECT_COMPOSER_API = new InjectionToken('NgtpEffectComposer API');
85
- class NgtpEffectComposer extends NgtSignalStore {
86
- set enabled(enabled) {
87
- this.set({ enabled });
88
- }
89
- set depthBuffer(depthBuffer) {
90
- this.set({ depthBuffer });
91
- }
92
- set disableNormalPass(disableNormalPass) {
93
- this.set({ disableNormalPass });
94
- }
95
- set stencilBuffer(stencilBuffer) {
96
- this.set({ stencilBuffer });
97
- }
98
- set autoClear(autoClear) {
99
- this.set({ autoClear });
100
- }
101
- set resolutionScale(resolutionScale) {
102
- this.set({ resolutionScale });
103
- }
104
- set multisampling(multisampling) {
105
- this.set({ multisampling });
106
- }
107
- set frameBufferType(frameBufferType) {
108
- this.set({ frameBufferType });
109
- }
110
- set renderPriority(renderPriority) {
111
- this.set({ renderPriority });
112
- }
113
- set camera(camera) {
114
- this.set({ camera });
115
- }
116
- set scene(scene) {
117
- this.set({ scene });
118
- }
119
- #store;
120
- #gl;
121
- #size;
122
- #defaultScene;
123
- #defaultCamera;
124
- #scene;
125
- #camera;
126
- #depthBuffer;
127
- #stencilBuffer;
128
- #multisampling;
129
- #frameBufferType;
130
- #disableNormalPass;
131
- #resolutionScale;
132
- #activeScene;
133
- #activeCamera;
134
- #composerEntities;
85
+ const [injectNgtpEffectComposerApi, provideNgtpEffectComposerApi] = createInjectionToken((composer) => composer.api, { isRoot: false, deps: [forwardRef(() => NgtpEffectComposer)] });
86
+ class NgtpEffectComposer {
87
+ set _enabled(enabled) {
88
+ this.inputs.set({ enabled });
89
+ }
90
+ set _depthBuffer(depthBuffer) {
91
+ this.inputs.set({ depthBuffer });
92
+ }
93
+ set _disableNormalPass(disableNormalPass) {
94
+ this.inputs.set({ disableNormalPass });
95
+ }
96
+ set _stencilBuffer(stencilBuffer) {
97
+ this.inputs.set({ stencilBuffer });
98
+ }
99
+ set _autoClear(autoClear) {
100
+ this.inputs.set({ autoClear });
101
+ }
102
+ set _resolutionScale(resolutionScale) {
103
+ this.inputs.set({ resolutionScale });
104
+ }
105
+ set _multisampling(multisampling) {
106
+ this.inputs.set({ multisampling });
107
+ }
108
+ set _frameBufferType(frameBufferType) {
109
+ this.inputs.set({ frameBufferType });
110
+ }
111
+ set _renderPriority(renderPriority) {
112
+ this.inputs.set({ renderPriority });
113
+ }
114
+ set _camera(camera) {
115
+ this.inputs.set({ camera });
116
+ }
117
+ set _scene(scene) {
118
+ this.inputs.set({ scene });
119
+ }
135
120
  constructor() {
136
- super({
121
+ this.inputs = signalStore({
137
122
  enabled: true,
138
123
  renderPriority: 1,
139
124
  autoClear: true,
@@ -141,32 +126,36 @@ class NgtpEffectComposer extends NgtSignalStore {
141
126
  frameBufferType: THREE.HalfFloatType,
142
127
  });
143
128
  this.composerRef = injectNgtRef();
144
- this.#store = inject(NgtStore);
145
- this.#gl = this.#store.select('gl');
146
- this.#size = this.#store.select('size');
147
- this.#defaultScene = this.#store.select('scene');
148
- this.#defaultCamera = this.#store.select('camera');
149
- this.#scene = this.select('scene');
150
- this.#camera = this.select('camera');
151
- this.#depthBuffer = this.select('depthBuffer');
152
- this.#stencilBuffer = this.select('stencilBuffer');
153
- this.#multisampling = this.select('multisampling');
154
- this.#frameBufferType = this.select('frameBufferType');
155
- this.#disableNormalPass = this.select('disableNormalPass');
156
- this.#resolutionScale = this.select('resolutionScale');
157
- this.#activeScene = computed(() => this.#scene() || this.#defaultScene());
158
- this.#activeCamera = computed(() => this.#camera() || this.#defaultCamera());
159
- this.#composerEntities = computed(() => {
160
- const gl = this.#gl();
161
- const camera = this.#activeCamera();
162
- const scene = this.#activeScene();
163
- const depthBuffer = this.#depthBuffer();
164
- const stencilBuffer = this.#stencilBuffer();
165
- const multisampling = this.#multisampling();
166
- const frameBufferType = this.#frameBufferType();
167
- const disableNormalPass = this.#disableNormalPass();
168
- const resolutionScale = this.#resolutionScale();
129
+ this.injector = inject(Injector);
130
+ this.store = injectNgtStore();
131
+ this.gl = this.store.select('gl');
132
+ this.defaultScene = this.store.select('scene');
133
+ this.defaultCamera = this.store.select('camera');
134
+ this.size = this.store.select('size');
135
+ this.depthBuffer = this.inputs.select('depthBuffer');
136
+ this.stencilBuffer = this.inputs.select('stencilBuffer');
137
+ this.multisampling = this.inputs.select('multisampling');
138
+ this.frameBufferType = this.inputs.select('frameBufferType');
139
+ this.scene = this.inputs.select('scene');
140
+ this.camera = this.inputs.select('camera');
141
+ this.disableNormalPass = this.inputs.select('disableNormalPass');
142
+ this.resolutionScale = this.inputs.select('resolutionScale');
143
+ this.autoClear = this.inputs.select('autoClear');
144
+ this.activeScene = computed(() => this.scene() || this.defaultScene());
145
+ this.activeCamera = computed(() => this.camera() || this.defaultCamera());
146
+ this.composerEntities = computed(() => {
169
147
  const webGL2Available = isWebGL2Available();
148
+ const [gl, depthBuffer, stencilBuffer, multisampling, frameBufferType, scene, camera, disableNormalPass, resolutionScale,] = [
149
+ this.gl(),
150
+ this.depthBuffer(),
151
+ this.stencilBuffer(),
152
+ this.multisampling(),
153
+ this.frameBufferType(),
154
+ this.activeScene(),
155
+ this.activeCamera(),
156
+ this.disableNormalPass(),
157
+ this.resolutionScale(),
158
+ ];
170
159
  // Initialize composer
171
160
  const effectComposer = new EffectComposer(gl, {
172
161
  depthBuffer,
@@ -191,54 +180,62 @@ class NgtpEffectComposer extends NgtSignalStore {
191
180
  }
192
181
  return { effectComposer, normalPass, downSamplingPass };
193
182
  });
183
+ this.composer = computed(() => this.composerEntities().effectComposer);
194
184
  this.api = computed(() => {
195
- const { effectComposer, normalPass, downSamplingPass } = this.#composerEntities();
196
- return {
197
- composer: effectComposer,
198
- normalPass,
199
- downSamplingPass,
200
- resolutionScale: this.#resolutionScale(),
201
- camera: this.#activeCamera(),
202
- scene: this.#activeScene(),
203
- };
204
- });
205
- requestAnimationInInjectionContext(() => {
206
- this.#setComposerSize();
207
- this.#updateEffectPasses();
208
- this.#setBeforeRender();
185
+ const [{ effectComposer: composer, normalPass, downSamplingPass }, resolutionScale, camera, scene] = [
186
+ this.composerEntities(),
187
+ this.resolutionScale(),
188
+ this.activeCamera(),
189
+ this.activeScene(),
190
+ ];
191
+ return { composer, normalPass, downSamplingPass, resolutionScale, camera, scene };
209
192
  });
193
+ this.setComposerSize();
194
+ this.updatePasses();
210
195
  }
211
- #setComposerSize() {
212
- const trigger = computed(() => ({ composer: this.#composerEntities().effectComposer, size: this.#size() }));
196
+ ngOnInit() {
197
+ this.beforeRender();
198
+ }
199
+ setComposerSize() {
213
200
  effect(() => {
214
- const { composer, size } = trigger();
215
- if (!composer)
216
- return;
201
+ const [composer, size] = [this.composer(), this.size()];
217
202
  composer.setSize(size.width, size.height);
218
203
  });
219
204
  }
220
- #updateEffectPasses() {
221
- const trigger = computed(() => ({
222
- composerEntities: this.#composerEntities(),
223
- instance: this.composerRef.nativeElement,
224
- children: this.composerRef.children('nonObjects')(),
225
- camera: this.#activeCamera(),
226
- }));
205
+ updatePasses() {
227
206
  effect((onCleanup) => {
228
- const { composerEntities: { effectComposer, normalPass, downSamplingPass }, instance, children, camera, } = trigger();
229
- let effectPass;
230
- if (instance && children.length && effectComposer) {
231
- effectPass = new EffectPass(camera, ...children);
232
- effectPass.renderToScreen = true;
233
- effectComposer.addPass(effectPass);
207
+ const [{ effectComposer: composer, normalPass, downSamplingPass }, instance, children, camera] = [
208
+ this.composerEntities(),
209
+ this.composerRef.nativeElement,
210
+ this.composerRef.children('nonObjects')(),
211
+ this.activeCamera(),
212
+ ];
213
+ const passes = [];
214
+ if (instance && composer && children.length) {
215
+ for (let i = 0; i < children.length; i++) {
216
+ const child = children[i];
217
+ if (child instanceof Effect) {
218
+ const effects = [];
219
+ while (children[i] instanceof Effect)
220
+ effects.push(children[i++]);
221
+ i--;
222
+ const pass = new EffectPass(camera, ...effects);
223
+ passes.push(pass);
224
+ }
225
+ else if (child instanceof Pass) {
226
+ passes.push(child);
227
+ }
228
+ }
229
+ for (const pass of passes)
230
+ composer.addPass(pass);
234
231
  if (normalPass)
235
232
  normalPass.enabled = true;
236
233
  if (downSamplingPass)
237
234
  downSamplingPass.enabled = true;
238
235
  }
239
236
  onCleanup(() => {
240
- if (effectPass)
241
- effectComposer?.removePass(effectPass);
237
+ for (const pass of passes)
238
+ composer?.removePass(pass);
242
239
  if (normalPass)
243
240
  normalPass.enabled = false;
244
241
  if (downSamplingPass)
@@ -246,77 +243,755 @@ class NgtpEffectComposer extends NgtSignalStore {
246
243
  });
247
244
  });
248
245
  }
249
- #setBeforeRender() {
246
+ beforeRender() {
250
247
  injectBeforeRender(({ delta }) => {
251
- const enabled = this.get('enabled');
252
- const autoClear = this.get('autoClear');
253
- const gl = this.#store.get('gl');
254
- const { effectComposer } = this.#composerEntities();
255
- if (enabled && effectComposer) {
248
+ const [enabled, gl, autoClear, stencilBuffer, composer] = [
249
+ this.inputs.get('enabled'),
250
+ this.gl(),
251
+ this.autoClear(),
252
+ this.stencilBuffer(),
253
+ this.composer(),
254
+ ];
255
+ if (enabled) {
256
+ const currentAutoClear = gl.autoClear;
256
257
  gl.autoClear = autoClear;
257
- effectComposer.render(delta);
258
+ if (stencilBuffer && !autoClear)
259
+ gl.clearStencil();
260
+ composer.render(delta);
261
+ gl.autoClear = currentAutoClear;
258
262
  }
259
- }, { priority: this.get('enabled') ? this.get('renderPriority') : 0 });
260
- }
261
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: NgtpEffectComposer, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
262
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: NgtpEffectComposer, isStandalone: true, selector: "ngtp-effect-composer", inputs: { enabled: "enabled", depthBuffer: "depthBuffer", disableNormalPass: "disableNormalPass", stencilBuffer: "stencilBuffer", autoClear: "autoClear", resolutionScale: "resolutionScale", multisampling: "multisampling", frameBufferType: "frameBufferType", renderPriority: "renderPriority", camera: "camera", scene: "scene" }, providers: [
263
- {
264
- provide: NGTP_EFFECT_COMPOSER_API,
265
- useFactory: (composer) => composer.api,
266
- deps: [NgtpEffectComposer],
267
- },
268
- ], usesInheritance: true, ngImport: i0, template: `
269
- <ngt-group [ref]="composerRef">
270
- <ng-content />
271
- </ngt-group>
272
- `, isInline: true }); }
263
+ }, {
264
+ injector: this.injector,
265
+ priority: this.inputs.get('enabled') ? this.inputs.get('renderPriority') : 0,
266
+ });
267
+ }
268
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpEffectComposer, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
269
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpEffectComposer, isStandalone: true, selector: "ngtp-effect-composer", inputs: { composerRef: "composerRef", _enabled: ["enabled", "_enabled"], _depthBuffer: ["depthBuffer", "_depthBuffer"], _disableNormalPass: ["disableNormalPass", "_disableNormalPass"], _stencilBuffer: ["stencilBuffer", "_stencilBuffer"], _autoClear: ["autoClear", "_autoClear"], _resolutionScale: ["resolutionScale", "_resolutionScale"], _multisampling: ["multisampling", "_multisampling"], _frameBufferType: ["frameBufferType", "_frameBufferType"], _renderPriority: ["renderPriority", "_renderPriority"], _camera: ["camera", "_camera"], _scene: ["scene", "_scene"] }, providers: [provideNgtpEffectComposerApi()], ngImport: i0, template: `
270
+ <ngt-group [ref]="composerRef">
271
+ <ng-content />
272
+ </ngt-group>
273
+ `, isInline: true }); }
273
274
  }
274
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: NgtpEffectComposer, decorators: [{
275
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpEffectComposer, decorators: [{
275
276
  type: Component,
276
277
  args: [{
277
278
  selector: 'ngtp-effect-composer',
278
279
  standalone: true,
279
280
  template: `
280
- <ngt-group [ref]="composerRef">
281
- <ng-content />
282
- </ngt-group>
283
- `,
284
- providers: [
285
- {
286
- provide: NGTP_EFFECT_COMPOSER_API,
287
- useFactory: (composer) => composer.api,
288
- deps: [NgtpEffectComposer],
289
- },
290
- ],
281
+ <ngt-group [ref]="composerRef">
282
+ <ng-content />
283
+ </ngt-group>
284
+ `,
285
+ providers: [provideNgtpEffectComposerApi()],
291
286
  schemas: [CUSTOM_ELEMENTS_SCHEMA],
292
287
  }]
293
- }], ctorParameters: function () { return []; }, propDecorators: { enabled: [{
294
- type: Input
295
- }], depthBuffer: [{
296
- type: Input
297
- }], disableNormalPass: [{
298
- type: Input
299
- }], stencilBuffer: [{
300
- type: Input
301
- }], autoClear: [{
302
- type: Input
303
- }], resolutionScale: [{
304
- type: Input
305
- }], multisampling: [{
288
+ }], ctorParameters: function () { return []; }, propDecorators: { composerRef: [{
306
289
  type: Input
307
- }], frameBufferType: [{
308
- type: Input
309
- }], renderPriority: [{
290
+ }], _enabled: [{
291
+ type: Input,
292
+ args: [{ alias: 'enabled' }]
293
+ }], _depthBuffer: [{
294
+ type: Input,
295
+ args: [{ alias: 'depthBuffer' }]
296
+ }], _disableNormalPass: [{
297
+ type: Input,
298
+ args: [{ alias: 'disableNormalPass' }]
299
+ }], _stencilBuffer: [{
300
+ type: Input,
301
+ args: [{ alias: 'stencilBuffer' }]
302
+ }], _autoClear: [{
303
+ type: Input,
304
+ args: [{ alias: 'autoClear' }]
305
+ }], _resolutionScale: [{
306
+ type: Input,
307
+ args: [{ alias: 'resolutionScale' }]
308
+ }], _multisampling: [{
309
+ type: Input,
310
+ args: [{ alias: 'multisampling' }]
311
+ }], _frameBufferType: [{
312
+ type: Input,
313
+ args: [{ alias: 'frameBufferType' }]
314
+ }], _renderPriority: [{
315
+ type: Input,
316
+ args: [{ alias: 'renderPriority' }]
317
+ }], _camera: [{
318
+ type: Input,
319
+ args: [{ alias: 'camera' }]
320
+ }], _scene: [{
321
+ type: Input,
322
+ args: [{ alias: 'scene' }]
323
+ }] } });
324
+
325
+ extend({ BloomEffect });
326
+ class NgtpBloom extends NgtpEffect {
327
+ constructor() {
328
+ super(...arguments);
329
+ this.defaultBlendFunction = BlendFunction.ADD;
330
+ }
331
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpBloom, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
332
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpBloom, isStandalone: true, selector: "ngtp-bloom", usesInheritance: true, ngImport: i0, template: `
333
+ <ngt-bloom-effect ngtCompound *args="args()" [ref]="effectRef" [camera]="camera()">
334
+ <ng-content />
335
+ </ngt-bloom-effect>
336
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }] }); }
337
+ }
338
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpBloom, decorators: [{
339
+ type: Component,
340
+ args: [{
341
+ selector: 'ngtp-bloom',
342
+ standalone: true,
343
+ template: `
344
+ <ngt-bloom-effect ngtCompound *args="args()" [ref]="effectRef" [camera]="camera()">
345
+ <ng-content />
346
+ </ngt-bloom-effect>
347
+ `,
348
+ imports: [NgtArgs],
349
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
350
+ }]
351
+ }] });
352
+
353
+ extend({ BrightnessContrastEffect });
354
+ class NgtpBrightnessContrast extends NgtpEffect {
355
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpBrightnessContrast, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
356
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpBrightnessContrast, isStandalone: true, selector: "ngtp-brightness-contrast", usesInheritance: true, ngImport: i0, template: `
357
+ <ngt-brightness-contrast-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
358
+ <ng-content />
359
+ </ngt-brightness-contrast-effect>
360
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }] }); }
361
+ }
362
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpBrightnessContrast, decorators: [{
363
+ type: Component,
364
+ args: [{
365
+ selector: 'ngtp-brightness-contrast',
366
+ standalone: true,
367
+ template: `
368
+ <ngt-brightness-contrast-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
369
+ <ng-content />
370
+ </ngt-brightness-contrast-effect>
371
+ `,
372
+ imports: [NgtArgs],
373
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
374
+ }]
375
+ }] });
376
+
377
+ extend({ ColorDepthEffect });
378
+ class NgtpColorDepth extends NgtpEffect {
379
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpColorDepth, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
380
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpColorDepth, isStandalone: true, selector: "ngtp-color-depth", usesInheritance: true, ngImport: i0, template: `
381
+ <ngt-color-depth-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
382
+ <ng-content />
383
+ </ngt-color-depth-effect>
384
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }] }); }
385
+ }
386
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpColorDepth, decorators: [{
387
+ type: Component,
388
+ args: [{
389
+ selector: 'ngtp-color-depth',
390
+ standalone: true,
391
+ template: `
392
+ <ngt-color-depth-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
393
+ <ng-content />
394
+ </ngt-color-depth-effect>
395
+ `,
396
+ imports: [NgtArgs],
397
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
398
+ }]
399
+ }] });
400
+
401
+ extend({ DepthEffect });
402
+ class NgtpDepth extends NgtpEffect {
403
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpDepth, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
404
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpDepth, isStandalone: true, selector: "ngtp-depth", usesInheritance: true, ngImport: i0, template: `
405
+ <ngt-depth-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
406
+ <ng-content />
407
+ </ngt-depth-effect>
408
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }] }); }
409
+ }
410
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpDepth, decorators: [{
411
+ type: Component,
412
+ args: [{
413
+ selector: 'ngtp-depth',
414
+ standalone: true,
415
+ template: `
416
+ <ngt-depth-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
417
+ <ng-content />
418
+ </ngt-depth-effect>
419
+ `,
420
+ imports: [NgtArgs],
421
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
422
+ }]
423
+ }] });
424
+
425
+ extend({ DotScreenEffect });
426
+ class NgtpDotScreen extends NgtpEffect {
427
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpDotScreen, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
428
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpDotScreen, isStandalone: true, selector: "ngtp-dot-screen", usesInheritance: true, ngImport: i0, template: `
429
+ <ngt-dot-screen-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
430
+ <ng-content />
431
+ </ngt-dot-screen-effect>
432
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }] }); }
433
+ }
434
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpDotScreen, decorators: [{
435
+ type: Component,
436
+ args: [{
437
+ selector: 'ngtp-dot-screen',
438
+ standalone: true,
439
+ template: `
440
+ <ngt-dot-screen-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
441
+ <ng-content />
442
+ </ngt-dot-screen-effect>
443
+ `,
444
+ imports: [NgtArgs],
445
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
446
+ }]
447
+ }] });
448
+
449
+ extend({ HueSaturationEffect });
450
+ class NgtpHueSaturation extends NgtpEffect {
451
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpHueSaturation, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
452
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpHueSaturation, isStandalone: true, selector: "ngtp-hue-saturation", usesInheritance: true, ngImport: i0, template: `
453
+ <ngt-hue-saturation-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
454
+ <ng-content />
455
+ </ngt-hue-saturation-effect>
456
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }] }); }
457
+ }
458
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpHueSaturation, decorators: [{
459
+ type: Component,
460
+ args: [{
461
+ selector: 'ngtp-hue-saturation',
462
+ standalone: true,
463
+ template: `
464
+ <ngt-hue-saturation-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
465
+ <ng-content />
466
+ </ngt-hue-saturation-effect>
467
+ `,
468
+ imports: [NgtArgs],
469
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
470
+ }]
471
+ }] });
472
+
473
+ class NgtpLUT {
474
+ set _lut(lut) {
475
+ this.inputs.set({ lut });
476
+ }
477
+ set _blendFunction(blendFunction) {
478
+ this.inputs.set({ blendFunction });
479
+ }
480
+ set _tetrahedralInterpolation(tetrahedralInterpolation) {
481
+ this.inputs.set({ tetrahedralInterpolation });
482
+ }
483
+ constructor() {
484
+ this.inputs = signalStore({});
485
+ this.effectRef = injectNgtRef();
486
+ this.lut = this.inputs.select('lut');
487
+ this.tetrahedralInterpolation = this.inputs.select('tetrahedralInterpolation');
488
+ this.blendFunction = this.inputs.select('blendFunction');
489
+ this.store = injectNgtStore();
490
+ this.invalidate = this.store.select('invalidate');
491
+ this.effect = computed(() => new LUT3DEffect(this.lut(), {
492
+ blendFunction: this.blendFunction(),
493
+ tetrahedralInterpolation: this.tetrahedralInterpolation(),
494
+ }));
495
+ this.setState();
496
+ }
497
+ setState() {
498
+ effect(() => {
499
+ const [effect, invalidate, lut, tetrahedralInterpolation] = [
500
+ this.effect(),
501
+ this.invalidate(),
502
+ this.lut(),
503
+ this.tetrahedralInterpolation(),
504
+ ];
505
+ if (!effect)
506
+ return;
507
+ if (tetrahedralInterpolation)
508
+ effect.tetrahedralInterpolation = tetrahedralInterpolation;
509
+ if (lut)
510
+ effect.lut = lut;
511
+ invalidate();
512
+ });
513
+ }
514
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpLUT, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
515
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpLUT, isStandalone: true, selector: "ngtp-lut", inputs: { effectRef: "effectRef", _lut: ["lut", "_lut"], _blendFunction: ["blendFunction", "_blendFunction"], _tetrahedralInterpolation: ["tetrahedralInterpolation", "_tetrahedralInterpolation"] }, ngImport: i0, template: `
516
+ <ngt-primitive *args="[effect()]" [ref]="effectRef" />
517
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }] }); }
518
+ }
519
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpLUT, decorators: [{
520
+ type: Component,
521
+ args: [{
522
+ selector: 'ngtp-lut',
523
+ standalone: true,
524
+ template: `
525
+ <ngt-primitive *args="[effect()]" [ref]="effectRef" />
526
+ `,
527
+ imports: [NgtArgs],
528
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
529
+ }]
530
+ }], ctorParameters: function () { return []; }, propDecorators: { effectRef: [{
310
531
  type: Input
311
- }], camera: [{
532
+ }], _lut: [{
533
+ type: Input,
534
+ args: [{ required: true, alias: 'lut' }]
535
+ }], _blendFunction: [{
536
+ type: Input,
537
+ args: [{ alias: 'blendFunction' }]
538
+ }], _tetrahedralInterpolation: [{
539
+ type: Input,
540
+ args: [{ alias: 'tetrahedralInterpolation' }]
541
+ }] } });
542
+
543
+ extend({ NoiseEffect });
544
+ class NgtpNoise extends NgtpEffect {
545
+ constructor() {
546
+ super(...arguments);
547
+ this.defaultBlendFunction = BlendFunction.COLOR_DODGE;
548
+ }
549
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpNoise, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
550
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpNoise, isStandalone: true, selector: "ngtp-noise", usesInheritance: true, ngImport: i0, template: `
551
+ <ngt-noise-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
552
+ <ng-content />
553
+ </ngt-noise-effect>
554
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }] }); }
555
+ }
556
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpNoise, decorators: [{
557
+ type: Component,
558
+ args: [{
559
+ selector: 'ngtp-noise',
560
+ standalone: true,
561
+ template: `
562
+ <ngt-noise-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
563
+ <ng-content />
564
+ </ngt-noise-effect>
565
+ `,
566
+ imports: [NgtArgs],
567
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
568
+ }]
569
+ }] });
570
+
571
+ class NgtpPixelation {
572
+ constructor() {
573
+ this.inputs = signalStore({ granularity: 30 });
574
+ this.effectRef = injectNgtRef();
575
+ this.granularity = this.inputs.select('granularity');
576
+ this.effect = computed(() => new PixelationEffect(this.granularity()));
577
+ }
578
+ set _granularity(granularity) {
579
+ this.inputs.set({ granularity });
580
+ }
581
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpPixelation, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
582
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpPixelation, isStandalone: true, selector: "ngtp-pixelation", inputs: { effectRef: "effectRef", _granularity: ["granularity", "_granularity"] }, ngImport: i0, template: `
583
+ <ngt-primitive *args="[effect()]" [ref]="effectRef" />
584
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }] }); }
585
+ }
586
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpPixelation, decorators: [{
587
+ type: Component,
588
+ args: [{
589
+ selector: 'ngtp-pixelation',
590
+ standalone: true,
591
+ template: `
592
+ <ngt-primitive *args="[effect()]" [ref]="effectRef" />
593
+ `,
594
+ imports: [NgtArgs],
595
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
596
+ }]
597
+ }], propDecorators: { effectRef: [{
312
598
  type: Input
313
- }], scene: [{
599
+ }], _granularity: [{
600
+ type: Input,
601
+ args: [{ alias: 'granularity' }]
602
+ }] } });
603
+
604
+ extend({ ScanlineEffect });
605
+ class NgtpScanline extends NgtpEffect {
606
+ constructor() {
607
+ super(...arguments);
608
+ this.defaultBlendFunction = BlendFunction.OVERLAY;
609
+ }
610
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpScanline, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
611
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpScanline, isStandalone: true, selector: "ngtp-scanline", usesInheritance: true, ngImport: i0, template: `
612
+ <ngt-scanline-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
613
+ <ng-content />
614
+ </ngt-scanline-effect>
615
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }] }); }
616
+ }
617
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpScanline, decorators: [{
618
+ type: Component,
619
+ args: [{
620
+ selector: 'ngtp-scanline',
621
+ standalone: true,
622
+ template: `
623
+ <ngt-scanline-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
624
+ <ng-content />
625
+ </ngt-scanline-effect>
626
+ `,
627
+ imports: [NgtArgs],
628
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
629
+ }]
630
+ }] });
631
+
632
+ extend({ SepiaEffect });
633
+ class NgtpSepia extends NgtpEffect {
634
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpSepia, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
635
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpSepia, isStandalone: true, selector: "ngtp-sepia", usesInheritance: true, ngImport: i0, template: `
636
+ <ngt-sepia-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
637
+ <ng-content />
638
+ </ngt-sepia-effect>
639
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }] }); }
640
+ }
641
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpSepia, decorators: [{
642
+ type: Component,
643
+ args: [{
644
+ selector: 'ngtp-sepia',
645
+ standalone: true,
646
+ template: `
647
+ <ngt-sepia-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
648
+ <ng-content />
649
+ </ngt-sepia-effect>
650
+ `,
651
+ imports: [NgtArgs],
652
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
653
+ }]
654
+ }] });
655
+
656
+ extend({ ShockWaveEffect });
657
+ class NgtpShockWave extends NgtpEffect {
658
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpShockWave, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
659
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpShockWave, isStandalone: true, selector: "ngtp-shock-wave", usesInheritance: true, ngImport: i0, template: `
660
+ <ngt-shock-wave-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
661
+ <ng-content />
662
+ </ngt-shock-wave-effect>
663
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }] }); }
664
+ }
665
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpShockWave, decorators: [{
666
+ type: Component,
667
+ args: [{
668
+ selector: 'ngtp-shock-wave',
669
+ standalone: true,
670
+ template: `
671
+ <ngt-shock-wave-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
672
+ <ng-content />
673
+ </ngt-shock-wave-effect>
674
+ `,
675
+ imports: [NgtArgs],
676
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
677
+ }]
678
+ }] });
679
+
680
+ extend({ SMAAEffect });
681
+ class NgtpSMAA extends NgtpEffect {
682
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpSMAA, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
683
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpSMAA, isStandalone: true, selector: "ngtp-SMAA", usesInheritance: true, ngImport: i0, template: `
684
+ <ngt-SMAA-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
685
+ <ng-content />
686
+ </ngt-SMAA-effect>
687
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }] }); }
688
+ }
689
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpSMAA, decorators: [{
690
+ type: Component,
691
+ args: [{
692
+ selector: 'ngtp-SMAA',
693
+ standalone: true,
694
+ template: `
695
+ <ngt-SMAA-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
696
+ <ng-content />
697
+ </ngt-SMAA-effect>
698
+ `,
699
+ imports: [NgtArgs],
700
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
701
+ }]
702
+ }] });
703
+
704
+ class NgtpSSAO {
705
+ constructor() {
706
+ this.inputs = signalStore({
707
+ blendFunction: BlendFunction.MULTIPLY,
708
+ samples: 30,
709
+ rings: 4,
710
+ distanceThreshold: 1.0,
711
+ distanceFalloff: 0.0,
712
+ rangeThreshold: 0.5,
713
+ rangeFalloff: 0.1,
714
+ luminanceInfluence: 0.9,
715
+ radius: 20,
716
+ bias: 0.5,
717
+ intensity: 1.0,
718
+ depthAwareUpsampling: true,
719
+ });
720
+ this.effectRef = injectNgtRef();
721
+ this.effectComposerApi = injectNgtpEffectComposerApi();
722
+ this.effect = computed(() => {
723
+ const [state, { camera, normalPass, downSamplingPass, resolutionScale }] = [
724
+ this.inputs.state(),
725
+ this.effectComposerApi(),
726
+ ];
727
+ if (normalPass === null && downSamplingPass === null) {
728
+ console.error('Please enable the NormalPass in the NgtpEffectComposer in order to use NgtpSSAO.');
729
+ return null;
730
+ }
731
+ return new SSAOEffect(camera, normalPass && !downSamplingPass ? normalPass.texture : null, {
732
+ ...state,
733
+ // @ts-expect-error
734
+ normalDepthBuffer: state.normalDepthBuffer || (downSamplingPass ? downSamplingPass.texture : null),
735
+ resolutionScale: state.resolutionScale || (resolutionScale ?? 1),
736
+ depthAwareUpsampling: state.depthAwareUpsampling ?? true,
737
+ });
738
+ });
739
+ }
740
+ set _blendFunction(blendFunction) {
741
+ this.inputs.set({ blendFunction });
742
+ }
743
+ set _distanceScaling(distanceScaling) {
744
+ this.inputs.set({ distanceScaling });
745
+ }
746
+ set _depthAwareUpsampling(depthAwareUpsampling) {
747
+ this.inputs.set({ depthAwareUpsampling });
748
+ }
749
+ set _normalDepthBuffer(normalDepthBuffer) {
750
+ this.inputs.set({ normalDepthBuffer });
751
+ }
752
+ set _samples(samples) {
753
+ this.inputs.set({ samples });
754
+ }
755
+ set _rings(rings) {
756
+ this.inputs.set({ rings });
757
+ }
758
+ set _worldDistanceThreshold(worldDistanceThreshold) {
759
+ this.inputs.set({ worldDistanceThreshold });
760
+ }
761
+ set _worldDistanceFalloff(worldDistanceFalloff) {
762
+ this.inputs.set({ worldDistanceFalloff });
763
+ }
764
+ set _worldProximityThreshold(worldProximityThreshold) {
765
+ this.inputs.set({ worldProximityThreshold });
766
+ }
767
+ set _worldProximityFalloff(worldProximityFalloff) {
768
+ this.inputs.set({ worldProximityFalloff });
769
+ }
770
+ set _distanceThreshold(distanceThreshold) {
771
+ this.inputs.set({ distanceThreshold });
772
+ }
773
+ set _distanceFalloff(distanceFalloff) {
774
+ this.inputs.set({ distanceFalloff });
775
+ }
776
+ set _rangeThreshold(rangeThreshold) {
777
+ this.inputs.set({ rangeThreshold });
778
+ }
779
+ set _rangeFalloff(rangeFalloff) {
780
+ this.inputs.set({ rangeFalloff });
781
+ }
782
+ set _minRadiusScale(minRadiusScale) {
783
+ this.inputs.set({ minRadiusScale });
784
+ }
785
+ set _luminanceInfluence(luminanceInfluence) {
786
+ this.inputs.set({ luminanceInfluence });
787
+ }
788
+ set _radius(radius) {
789
+ this.inputs.set({ radius });
790
+ }
791
+ set _intensity(intensity) {
792
+ this.inputs.set({ intensity });
793
+ }
794
+ set _bias(bias) {
795
+ this.inputs.set({ bias });
796
+ }
797
+ set _fade(fade) {
798
+ this.inputs.set({ fade });
799
+ }
800
+ set _color(color) {
801
+ this.inputs.set({ color });
802
+ }
803
+ set _resolutionScale(resolutionScale) {
804
+ this.inputs.set({ resolutionScale });
805
+ }
806
+ set _resolutionX(resolutionX) {
807
+ this.inputs.set({ resolutionX });
808
+ }
809
+ set _resolutionY(resolutionY) {
810
+ this.inputs.set({ resolutionY });
811
+ }
812
+ set _width(width) {
813
+ this.inputs.set({ width });
814
+ }
815
+ set _height(height) {
816
+ this.inputs.set({ height });
817
+ }
818
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpSSAO, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
819
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpSSAO, isStandalone: true, selector: "ngtp-SSAO", inputs: { effectRef: "effectRef", _blendFunction: ["blendFunction", "_blendFunction"], _distanceScaling: ["distanceScaling", "_distanceScaling"], _depthAwareUpsampling: ["depthAwareUpsampling", "_depthAwareUpsampling"], _normalDepthBuffer: ["normalDepthBuffer", "_normalDepthBuffer"], _samples: ["samples", "_samples"], _rings: ["rings", "_rings"], _worldDistanceThreshold: ["worldDistanceThreshold", "_worldDistanceThreshold"], _worldDistanceFalloff: ["worldDistanceFalloff", "_worldDistanceFalloff"], _worldProximityThreshold: ["worldProximityThreshold", "_worldProximityThreshold"], _worldProximityFalloff: ["worldProximityFalloff", "_worldProximityFalloff"], _distanceThreshold: ["distanceThreshold", "_distanceThreshold"], _distanceFalloff: ["distanceFalloff", "_distanceFalloff"], _rangeThreshold: ["rangeThreshold", "_rangeThreshold"], _rangeFalloff: ["rangeFalloff", "_rangeFalloff"], _minRadiusScale: ["minRadiusScale", "_minRadiusScale"], _luminanceInfluence: ["luminanceInfluence", "_luminanceInfluence"], _radius: ["radius", "_radius"], _intensity: ["intensity", "_intensity"], _bias: ["bias", "_bias"], _fade: ["fade", "_fade"], _color: ["color", "_color"], _resolutionScale: ["resolutionScale", "_resolutionScale"], _resolutionX: ["resolutionX", "_resolutionX"], _resolutionY: ["resolutionY", "_resolutionY"], _width: ["width", "_width"], _height: ["height", "_height"] }, ngImport: i0, template: `
820
+ <ngt-primitive *args="[effect()]" [ref]="effectRef" />
821
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }] }); }
822
+ }
823
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpSSAO, decorators: [{
824
+ type: Component,
825
+ args: [{
826
+ selector: 'ngtp-SSAO',
827
+ standalone: true,
828
+ template: `
829
+ <ngt-primitive *args="[effect()]" [ref]="effectRef" />
830
+ `,
831
+ imports: [NgtArgs],
832
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
833
+ }]
834
+ }], propDecorators: { effectRef: [{
314
835
  type: Input
836
+ }], _blendFunction: [{
837
+ type: Input,
838
+ args: [{ alias: 'blendFunction' }]
839
+ }], _distanceScaling: [{
840
+ type: Input,
841
+ args: [{ alias: 'distanceScaling' }]
842
+ }], _depthAwareUpsampling: [{
843
+ type: Input,
844
+ args: [{ alias: 'depthAwareUpsampling' }]
845
+ }], _normalDepthBuffer: [{
846
+ type: Input,
847
+ args: [{ alias: 'normalDepthBuffer' }]
848
+ }], _samples: [{
849
+ type: Input,
850
+ args: [{ alias: 'samples' }]
851
+ }], _rings: [{
852
+ type: Input,
853
+ args: [{ alias: 'rings' }]
854
+ }], _worldDistanceThreshold: [{
855
+ type: Input,
856
+ args: [{ alias: 'worldDistanceThreshold' }]
857
+ }], _worldDistanceFalloff: [{
858
+ type: Input,
859
+ args: [{ alias: 'worldDistanceFalloff' }]
860
+ }], _worldProximityThreshold: [{
861
+ type: Input,
862
+ args: [{ alias: 'worldProximityThreshold' }]
863
+ }], _worldProximityFalloff: [{
864
+ type: Input,
865
+ args: [{ alias: 'worldProximityFalloff' }]
866
+ }], _distanceThreshold: [{
867
+ type: Input,
868
+ args: [{ alias: 'distanceThreshold' }]
869
+ }], _distanceFalloff: [{
870
+ type: Input,
871
+ args: [{ alias: 'distanceFalloff' }]
872
+ }], _rangeThreshold: [{
873
+ type: Input,
874
+ args: [{ alias: 'rangeThreshold' }]
875
+ }], _rangeFalloff: [{
876
+ type: Input,
877
+ args: [{ alias: 'rangeFalloff' }]
878
+ }], _minRadiusScale: [{
879
+ type: Input,
880
+ args: [{ alias: 'minRadiusScale' }]
881
+ }], _luminanceInfluence: [{
882
+ type: Input,
883
+ args: [{ alias: 'luminanceInfluence' }]
884
+ }], _radius: [{
885
+ type: Input,
886
+ args: [{ alias: 'radius' }]
887
+ }], _intensity: [{
888
+ type: Input,
889
+ args: [{ alias: 'intensity' }]
890
+ }], _bias: [{
891
+ type: Input,
892
+ args: [{ alias: 'bias' }]
893
+ }], _fade: [{
894
+ type: Input,
895
+ args: [{ alias: 'fade' }]
896
+ }], _color: [{
897
+ type: Input,
898
+ args: [{ alias: 'color' }]
899
+ }], _resolutionScale: [{
900
+ type: Input,
901
+ args: [{ alias: 'resolutionScale' }]
902
+ }], _resolutionX: [{
903
+ type: Input,
904
+ args: [{ alias: 'resolutionX' }]
905
+ }], _resolutionY: [{
906
+ type: Input,
907
+ args: [{ alias: 'resolutionY' }]
908
+ }], _width: [{
909
+ type: Input,
910
+ args: [{ alias: 'width' }]
911
+ }], _height: [{
912
+ type: Input,
913
+ args: [{ alias: 'height' }]
315
914
  }] } });
316
915
 
916
+ extend({ TiltShiftEffect });
917
+ class NgtpTiltShift extends NgtpEffect {
918
+ constructor() {
919
+ super(...arguments);
920
+ this.defaultBlendFunction = BlendFunction.ADD;
921
+ }
922
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpTiltShift, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
923
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpTiltShift, isStandalone: true, selector: "ngtp-tilt-shift", usesInheritance: true, ngImport: i0, template: `
924
+ <ngt-tilt-shift-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
925
+ <ng-content />
926
+ </ngt-tilt-shift-effect>
927
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }] }); }
928
+ }
929
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpTiltShift, decorators: [{
930
+ type: Component,
931
+ args: [{
932
+ selector: 'ngtp-tilt-shift',
933
+ standalone: true,
934
+ template: `
935
+ <ngt-tilt-shift-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
936
+ <ng-content />
937
+ </ngt-tilt-shift-effect>
938
+ `,
939
+ imports: [NgtArgs],
940
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
941
+ }]
942
+ }] });
943
+
944
+ extend({ ToneMappingEffect });
945
+ class NgtpToneMapping extends NgtpEffect {
946
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpToneMapping, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
947
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpToneMapping, isStandalone: true, selector: "ngtp-tone-mapping", usesInheritance: true, ngImport: i0, template: `
948
+ <ngt-tone-mapping-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
949
+ <ng-content />
950
+ </ngt-tone-mapping-effect>
951
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }] }); }
952
+ }
953
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpToneMapping, decorators: [{
954
+ type: Component,
955
+ args: [{
956
+ selector: 'ngtp-tone-mapping',
957
+ standalone: true,
958
+ template: `
959
+ <ngt-tone-mapping-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
960
+ <ng-content />
961
+ </ngt-tone-mapping-effect>
962
+ `,
963
+ imports: [NgtArgs],
964
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
965
+ }]
966
+ }] });
967
+
968
+ extend({ VignetteEffect });
969
+ class NgtpVignette extends NgtpEffect {
970
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpVignette, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
971
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: NgtpVignette, isStandalone: true, selector: "ngtp-vignette", usesInheritance: true, ngImport: i0, template: `
972
+ <ngt-vignette-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
973
+ <ng-content />
974
+ </ngt-vignette-effect>
975
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "ng-template[args]", inputs: ["args"] }] }); }
976
+ }
977
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgtpVignette, decorators: [{
978
+ type: Component,
979
+ args: [{
980
+ selector: 'ngtp-vignette',
981
+ standalone: true,
982
+ template: `
983
+ <ngt-vignette-effect ngtCompound *args="args()" [camera]="camera()" [ref]="effectRef">
984
+ <ng-content />
985
+ </ngt-vignette-effect>
986
+ `,
987
+ imports: [NgtArgs],
988
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
989
+ }]
990
+ }] });
991
+
317
992
  /**
318
993
  * Generated bundle index. Do not edit.
319
994
  */
320
995
 
321
- export { NGTP_EFFECT_COMPOSER_API, NgtpEffect, NgtpEffectComposer };
996
+ export { NgtpBloom, NgtpBrightnessContrast, NgtpColorDepth, NgtpDepth, NgtpDotScreen, NgtpEffect, NgtpEffectComposer, NgtpHueSaturation, NgtpLUT, NgtpNoise, NgtpPixelation, NgtpSMAA, NgtpSSAO, NgtpScanline, NgtpSepia, NgtpShockWave, NgtpTiltShift, NgtpToneMapping, NgtpVignette, injectNgtpEffectComposerApi, provideNgtpEffectComposerApi };
322
997
  //# sourceMappingURL=angular-three-postprocessing.mjs.map