@remotion/effects 4.0.472 → 4.0.474

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 (45) hide show
  1. package/dist/esm/barrel-distortion.mjs +8 -0
  2. package/dist/esm/blur.mjs +8 -0
  3. package/dist/esm/brightness.mjs +8 -0
  4. package/dist/esm/chromatic-aberration.mjs +8 -0
  5. package/dist/esm/color-key.mjs +8 -0
  6. package/dist/esm/contrast.mjs +8 -0
  7. package/dist/esm/dot-grid.mjs +10 -2
  8. package/dist/esm/drop-shadow.mjs +8 -0
  9. package/dist/esm/duotone.mjs +8 -0
  10. package/dist/esm/evolve.mjs +8 -0
  11. package/dist/esm/fisheye.mjs +8 -0
  12. package/dist/esm/glow.mjs +9 -1
  13. package/dist/esm/grayscale.mjs +8 -0
  14. package/dist/esm/halftone-linear-gradient.mjs +37 -4
  15. package/dist/esm/halftone.mjs +8 -8
  16. package/dist/esm/hue.mjs +8 -0
  17. package/dist/esm/index.mjs +56 -6
  18. package/dist/esm/invert.mjs +8 -0
  19. package/dist/esm/linear-progressive-blur.mjs +10 -1
  20. package/dist/esm/lines.mjs +32 -3
  21. package/dist/esm/mirror.mjs +8 -0
  22. package/dist/esm/noise-displacement.mjs +578 -0
  23. package/dist/esm/noise.mjs +10 -2
  24. package/dist/esm/pixel-dissolve.mjs +8 -0
  25. package/dist/esm/rings.mjs +32 -3
  26. package/dist/esm/saturation.mjs +8 -0
  27. package/dist/esm/scale.mjs +8 -0
  28. package/dist/esm/scanlines.mjs +10 -2
  29. package/dist/esm/shine.mjs +8 -0
  30. package/dist/esm/speckle.mjs +8 -0
  31. package/dist/esm/tint.mjs +8 -0
  32. package/dist/esm/translate.mjs +8 -0
  33. package/dist/esm/vignette.mjs +8 -0
  34. package/dist/esm/wave.mjs +8 -0
  35. package/dist/esm/waves.mjs +32 -3
  36. package/dist/esm/white-noise.mjs +8 -0
  37. package/dist/esm/zigzag.mjs +32 -3
  38. package/dist/halftone-linear-gradient.d.ts +10 -0
  39. package/dist/lines.d.ts +7 -0
  40. package/dist/noise-displacement.d.ts +26 -0
  41. package/dist/rings.d.ts +7 -0
  42. package/dist/validate-effect-param.d.ts +1 -0
  43. package/dist/waves.d.ts +7 -0
  44. package/dist/zigzag.d.ts +7 -0
  45. package/package.json +11 -3
@@ -23,6 +23,14 @@ var assertOptionalColor = (value, name) => {
23
23
  }
24
24
  assertRequiredColor(value, name);
25
25
  };
26
+ var assertOptionalBoolean = (value, name) => {
27
+ if (value === undefined) {
28
+ return;
29
+ }
30
+ if (typeof value !== "boolean") {
31
+ throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
32
+ }
33
+ };
26
34
 
27
35
  // src/color-utils.ts
28
36
  var DEFAULT_AMOUNT = 1;
@@ -131,7 +139,7 @@ var resolve = (p) => ({
131
139
  seed: p.seed ?? DEFAULT_SEED,
132
140
  premultiply: p.premultiply ?? DEFAULT_PREMULTIPLY
133
141
  });
134
- var assertOptionalBoolean = (value, name) => {
142
+ var assertOptionalBoolean2 = (value, name) => {
135
143
  if (value === undefined) {
136
144
  return;
137
145
  }
@@ -143,7 +151,7 @@ var validateNoiseParams = (params) => {
143
151
  assertEffectParamsObject(params, "Noise");
144
152
  assertOptionalFiniteNumber(params.amount, "amount");
145
153
  assertOptionalFiniteNumber(params.seed, "seed");
146
- assertOptionalBoolean(params.premultiply, "premultiply");
154
+ assertOptionalBoolean2(params.premultiply, "premultiply");
147
155
  const r = resolve(params);
148
156
  validateUnitInterval(r.amount, "amount");
149
157
  };
@@ -23,6 +23,14 @@ var assertOptionalColor = (value, name) => {
23
23
  }
24
24
  assertRequiredColor(value, name);
25
25
  };
26
+ var assertOptionalBoolean = (value, name) => {
27
+ if (value === undefined) {
28
+ return;
29
+ }
30
+ if (typeof value !== "boolean") {
31
+ throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
32
+ }
33
+ };
26
34
 
27
35
  // src/color-utils.ts
28
36
  var DEFAULT_AMOUNT = 1;
@@ -23,6 +23,14 @@ var assertOptionalColor = (value, name) => {
23
23
  }
24
24
  assertRequiredColor(value, name);
25
25
  };
26
+ var assertOptionalBoolean = (value, name) => {
27
+ if (value === undefined) {
28
+ return;
29
+ }
30
+ if (typeof value !== "boolean") {
31
+ throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
32
+ }
33
+ };
26
34
 
27
35
  // src/color-utils.ts
28
36
  var DEFAULT_AMOUNT = 1;
@@ -105,6 +113,7 @@ var DEFAULT_CENTER = [0.5, 0.5];
105
113
  var DEFAULT_THICKNESS = 40;
106
114
  var DEFAULT_GAP = 0;
107
115
  var DEFAULT_OFFSET = 0;
116
+ var DEFAULT_MASK_TO_SOURCE_ALPHA = false;
108
117
  var ringsSchema = {
109
118
  center: {
110
119
  type: "uv-coordinate",
@@ -138,6 +147,11 @@ var ringsSchema = {
138
147
  default: DEFAULT_OFFSET,
139
148
  description: "Offset",
140
149
  hiddenFromList: false
150
+ },
151
+ maskToSourceAlpha: {
152
+ type: "boolean",
153
+ default: DEFAULT_MASK_TO_SOURCE_ALPHA,
154
+ description: "Mask to source alpha"
141
155
  }
142
156
  };
143
157
  var resolve = (p) => {
@@ -148,7 +162,8 @@ var resolve = (p) => {
148
162
  center: [...p.center ?? DEFAULT_CENTER],
149
163
  thickness,
150
164
  spacing: thickness + gap,
151
- offset: p.offset ?? DEFAULT_OFFSET
165
+ offset: p.offset ?? DEFAULT_OFFSET,
166
+ maskToSourceAlpha: p.maskToSourceAlpha ?? DEFAULT_MASK_TO_SOURCE_ALPHA
152
167
  };
153
168
  };
154
169
  var validatePositive = (value, name) => {
@@ -189,6 +204,7 @@ var validateRingsParams = (params) => {
189
204
  assertOptionalFiniteNumber(params.thickness, "thickness");
190
205
  assertOptionalFiniteNumber(params.gap, "gap");
191
206
  assertOptionalFiniteNumber(params.offset, "offset");
207
+ assertOptionalBoolean(params.maskToSourceAlpha, "maskToSourceAlpha");
192
208
  const thickness = params.thickness ?? DEFAULT_THICKNESS;
193
209
  const gap = params.gap ?? DEFAULT_GAP;
194
210
  validatePositive(thickness, "thickness");
@@ -218,6 +234,7 @@ uniform vec2 uCenter;
218
234
  uniform float uThickness;
219
235
  uniform float uSpacing;
220
236
  uniform float uOffset;
237
+ uniform bool uMaskToSourceAlpha;
221
238
 
222
239
  void main() {
223
240
  vec4 texColor = texture(uSource, vUv);
@@ -244,6 +261,14 @@ void main() {
244
261
  float ringAlpha = ringColor.a;
245
262
  vec3 premultipliedRing = ringColor.rgb * ringAlpha;
246
263
 
264
+ if (uMaskToSourceAlpha) {
265
+ fragColor = vec4(
266
+ premultipliedRing * texColor.a + texColor.rgb * (1.0 - ringAlpha),
267
+ texColor.a
268
+ );
269
+ return;
270
+ }
271
+
247
272
  fragColor = vec4(
248
273
  premultipliedRing + texColor.rgb * (1.0 - ringAlpha),
249
274
  ringAlpha + texColor.a * (1.0 - ringAlpha)
@@ -370,7 +395,8 @@ var setupRings = (target) => {
370
395
  uCenter: gl.getUniformLocation(program, "uCenter"),
371
396
  uThickness: gl.getUniformLocation(program, "uThickness"),
372
397
  uSpacing: gl.getUniformLocation(program, "uSpacing"),
373
- uOffset: gl.getUniformLocation(program, "uOffset")
398
+ uOffset: gl.getUniformLocation(program, "uOffset"),
399
+ uMaskToSourceAlpha: gl.getUniformLocation(program, "uMaskToSourceAlpha")
374
400
  },
375
401
  cachedPaletteKey: "",
376
402
  palettePixelData: new Uint8Array(0)
@@ -404,7 +430,8 @@ var rings = createEffect({
404
430
  backend: "webgl2",
405
431
  calculateKey: (params) => {
406
432
  const r = resolve(params);
407
- return `rings-${r.colors.join("|")}-${r.center.join(":")}-${r.thickness}-${r.spacing}-${r.offset}`;
433
+ const maskSuffix = r.maskToSourceAlpha ? "-mask-to-source-alpha" : "";
434
+ return `rings-${r.colors.join("|")}-${r.center.join(":")}-${r.thickness}-${r.spacing}-${r.offset}${maskSuffix}`;
408
435
  },
409
436
  setup: (target) => setupRings(target),
410
437
  apply: ({ source, width, height, params, state, flipSourceY }) => {
@@ -445,6 +472,8 @@ var rings = createEffect({
445
472
  gl.uniform1f(uniforms.uSpacing, r.spacing);
446
473
  if (uniforms.uOffset)
447
474
  gl.uniform1f(uniforms.uOffset, r.offset);
475
+ if (uniforms.uMaskToSourceAlpha)
476
+ gl.uniform1i(uniforms.uMaskToSourceAlpha, r.maskToSourceAlpha ? 1 : 0);
448
477
  gl.bindVertexArray(vao);
449
478
  gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
450
479
  gl.bindVertexArray(null);
@@ -23,6 +23,14 @@ var assertOptionalColor = (value, name) => {
23
23
  }
24
24
  assertRequiredColor(value, name);
25
25
  };
26
+ var assertOptionalBoolean = (value, name) => {
27
+ if (value === undefined) {
28
+ return;
29
+ }
30
+ if (typeof value !== "boolean") {
31
+ throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
32
+ }
33
+ };
26
34
 
27
35
  // src/color-utils.ts
28
36
  var DEFAULT_AMOUNT = 1;
@@ -23,6 +23,14 @@ var assertOptionalColor = (value, name) => {
23
23
  }
24
24
  assertRequiredColor(value, name);
25
25
  };
26
+ var assertOptionalBoolean = (value, name) => {
27
+ if (value === undefined) {
28
+ return;
29
+ }
30
+ if (typeof value !== "boolean") {
31
+ throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
32
+ }
33
+ };
26
34
 
27
35
  // src/scale/index.ts
28
36
  var { createEffect } = Internals;
@@ -23,6 +23,14 @@ var assertOptionalColor = (value, name) => {
23
23
  }
24
24
  assertRequiredColor(value, name);
25
25
  };
26
+ var assertOptionalBoolean = (value, name) => {
27
+ if (value === undefined) {
28
+ return;
29
+ }
30
+ if (typeof value !== "boolean") {
31
+ throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
32
+ }
33
+ };
26
34
 
27
35
  // src/color-utils.ts
28
36
  var DEFAULT_AMOUNT = 1;
@@ -153,7 +161,7 @@ var resolve = (p) => ({
153
161
  offset: p.offset ?? DEFAULT_OFFSET,
154
162
  premultiply: p.premultiply ?? DEFAULT_PREMULTIPLY
155
163
  });
156
- var assertOptionalBoolean = (value, name) => {
164
+ var assertOptionalBoolean2 = (value, name) => {
157
165
  if (value === undefined) {
158
166
  return;
159
167
  }
@@ -172,7 +180,7 @@ var validateScanlinesParams = (params) => {
172
180
  assertOptionalFiniteNumber(params.spacing, "spacing");
173
181
  assertOptionalFiniteNumber(params.thickness, "thickness");
174
182
  assertOptionalFiniteNumber(params.offset, "offset");
175
- assertOptionalBoolean(params.premultiply, "premultiply");
183
+ assertOptionalBoolean2(params.premultiply, "premultiply");
176
184
  const r = resolve(params);
177
185
  validateUnitInterval(r.amount, "amount");
178
186
  validatePositive(r.spacing, "spacing");
@@ -23,6 +23,14 @@ var assertOptionalColor = (value, name) => {
23
23
  }
24
24
  assertRequiredColor(value, name);
25
25
  };
26
+ var assertOptionalBoolean = (value, name) => {
27
+ if (value === undefined) {
28
+ return;
29
+ }
30
+ if (typeof value !== "boolean") {
31
+ throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
32
+ }
33
+ };
26
34
 
27
35
  // src/color-utils.ts
28
36
  var DEFAULT_AMOUNT = 1;
@@ -23,6 +23,14 @@ var assertOptionalColor = (value, name) => {
23
23
  }
24
24
  assertRequiredColor(value, name);
25
25
  };
26
+ var assertOptionalBoolean = (value, name) => {
27
+ if (value === undefined) {
28
+ return;
29
+ }
30
+ if (typeof value !== "boolean") {
31
+ throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
32
+ }
33
+ };
26
34
 
27
35
  // src/color-utils.ts
28
36
  var DEFAULT_AMOUNT = 1;
package/dist/esm/tint.mjs CHANGED
@@ -23,6 +23,14 @@ var assertOptionalColor = (value, name) => {
23
23
  }
24
24
  assertRequiredColor(value, name);
25
25
  };
26
+ var assertOptionalBoolean = (value, name) => {
27
+ if (value === undefined) {
28
+ return;
29
+ }
30
+ if (typeof value !== "boolean") {
31
+ throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
32
+ }
33
+ };
26
34
 
27
35
  // src/color-utils.ts
28
36
  var DEFAULT_AMOUNT = 1;
@@ -23,6 +23,14 @@ var assertOptionalColor = (value, name) => {
23
23
  }
24
24
  assertRequiredColor(value, name);
25
25
  };
26
+ var assertOptionalBoolean = (value, name) => {
27
+ if (value === undefined) {
28
+ return;
29
+ }
30
+ if (typeof value !== "boolean") {
31
+ throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
32
+ }
33
+ };
26
34
 
27
35
  // src/color-utils.ts
28
36
  var DEFAULT_AMOUNT = 1;
@@ -23,6 +23,14 @@ var assertOptionalColor = (value, name) => {
23
23
  }
24
24
  assertRequiredColor(value, name);
25
25
  };
26
+ var assertOptionalBoolean = (value, name) => {
27
+ if (value === undefined) {
28
+ return;
29
+ }
30
+ if (typeof value !== "boolean") {
31
+ throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
32
+ }
33
+ };
26
34
 
27
35
  // src/color-utils.ts
28
36
  var DEFAULT_AMOUNT = 1;
package/dist/esm/wave.mjs CHANGED
@@ -23,6 +23,14 @@ var assertOptionalColor = (value, name) => {
23
23
  }
24
24
  assertRequiredColor(value, name);
25
25
  };
26
+ var assertOptionalBoolean = (value, name) => {
27
+ if (value === undefined) {
28
+ return;
29
+ }
30
+ if (typeof value !== "boolean") {
31
+ throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
32
+ }
33
+ };
26
34
 
27
35
  // src/wave/wave-runtime.ts
28
36
  import { Internals } from "remotion";
@@ -23,6 +23,14 @@ var assertOptionalColor = (value, name) => {
23
23
  }
24
24
  assertRequiredColor(value, name);
25
25
  };
26
+ var assertOptionalBoolean = (value, name) => {
27
+ if (value === undefined) {
28
+ return;
29
+ }
30
+ if (typeof value !== "boolean") {
31
+ throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
32
+ }
33
+ };
26
34
 
27
35
  // src/color-utils.ts
28
36
  var DEFAULT_AMOUNT = 1;
@@ -110,6 +118,7 @@ var DEFAULT_OFFSET = 0;
110
118
  var DEFAULT_AMPLITUDE = 24;
111
119
  var DEFAULT_WAVELENGTH = 160;
112
120
  var DEFAULT_PHASE = 0;
121
+ var DEFAULT_MASK_TO_SOURCE_ALPHA = false;
113
122
  var wavesSchema = {
114
123
  direction: {
115
124
  type: "enum",
@@ -177,6 +186,11 @@ var wavesSchema = {
177
186
  default: DEFAULT_PHASE,
178
187
  description: "Phase",
179
188
  hiddenFromList: false
189
+ },
190
+ maskToSourceAlpha: {
191
+ type: "boolean",
192
+ default: DEFAULT_MASK_TO_SOURCE_ALPHA,
193
+ description: "Mask to source alpha"
180
194
  }
181
195
  };
182
196
  var resolve = (p) => {
@@ -191,7 +205,8 @@ var resolve = (p) => {
191
205
  offset: p.offset ?? DEFAULT_OFFSET,
192
206
  amplitude: p.amplitude ?? DEFAULT_AMPLITUDE,
193
207
  wavelength: p.wavelength ?? DEFAULT_WAVELENGTH,
194
- phase: p.phase ?? DEFAULT_PHASE
208
+ phase: p.phase ?? DEFAULT_PHASE,
209
+ maskToSourceAlpha: p.maskToSourceAlpha ?? DEFAULT_MASK_TO_SOURCE_ALPHA
195
210
  };
196
211
  };
197
212
  var formatEnum = (variants) => {
@@ -240,6 +255,7 @@ var validateWavesParams = (params) => {
240
255
  assertOptionalFiniteNumber(params.amplitude, "amplitude");
241
256
  assertOptionalFiniteNumber(params.wavelength, "wavelength");
242
257
  assertOptionalFiniteNumber(params.phase, "phase");
258
+ assertOptionalBoolean(params.maskToSourceAlpha, "maskToSourceAlpha");
243
259
  const thickness = params.thickness ?? DEFAULT_THICKNESS;
244
260
  const gap = params.gap ?? DEFAULT_GAP;
245
261
  const amplitude = params.amplitude ?? DEFAULT_AMPLITUDE;
@@ -277,6 +293,7 @@ uniform float uOffset;
277
293
  uniform float uAmplitude;
278
294
  uniform float uWavelength;
279
295
  uniform float uPhase;
296
+ uniform bool uMaskToSourceAlpha;
280
297
 
281
298
  void main() {
282
299
  vec4 texColor = texture(uSource, vUv);
@@ -312,6 +329,14 @@ void main() {
312
329
  float lineAlpha = lineColor.a;
313
330
  vec3 premultipliedLine = lineColor.rgb * lineAlpha;
314
331
 
332
+ if (uMaskToSourceAlpha) {
333
+ fragColor = vec4(
334
+ premultipliedLine * texColor.a + texColor.rgb * (1.0 - lineAlpha),
335
+ texColor.a
336
+ );
337
+ return;
338
+ }
339
+
315
340
  fragColor = vec4(
316
341
  premultipliedLine + texColor.rgb * (1.0 - lineAlpha),
317
342
  lineAlpha + texColor.a * (1.0 - lineAlpha)
@@ -442,7 +467,8 @@ var setupWaves = (target) => {
442
467
  uOffset: gl.getUniformLocation(program, "uOffset"),
443
468
  uAmplitude: gl.getUniformLocation(program, "uAmplitude"),
444
469
  uWavelength: gl.getUniformLocation(program, "uWavelength"),
445
- uPhase: gl.getUniformLocation(program, "uPhase")
470
+ uPhase: gl.getUniformLocation(program, "uPhase"),
471
+ uMaskToSourceAlpha: gl.getUniformLocation(program, "uMaskToSourceAlpha")
446
472
  },
447
473
  cachedPaletteKey: "",
448
474
  palettePixelData: new Uint8Array(0)
@@ -476,7 +502,8 @@ var waves = createEffect({
476
502
  backend: "webgl2",
477
503
  calculateKey: (params) => {
478
504
  const r = resolve(params);
479
- return `waves-${r.colors.join("|")}-${r.direction}-${r.thickness}-${r.spacing}-${r.angle}-${r.offset}-${r.amplitude}-${r.wavelength}-${r.phase}`;
505
+ const maskSuffix = r.maskToSourceAlpha ? "-mask-to-source-alpha" : "";
506
+ return `waves-${r.colors.join("|")}-${r.direction}-${r.thickness}-${r.spacing}-${r.angle}-${r.offset}-${r.amplitude}-${r.wavelength}-${r.phase}${maskSuffix}`;
480
507
  },
481
508
  setup: (target) => setupWaves(target),
482
509
  apply: ({ source, width, height, params, state, flipSourceY }) => {
@@ -525,6 +552,8 @@ var waves = createEffect({
525
552
  gl.uniform1f(uniforms.uWavelength, r.wavelength);
526
553
  if (uniforms.uPhase)
527
554
  gl.uniform1f(uniforms.uPhase, r.phase * Math.PI / 180);
555
+ if (uniforms.uMaskToSourceAlpha)
556
+ gl.uniform1i(uniforms.uMaskToSourceAlpha, r.maskToSourceAlpha ? 1 : 0);
528
557
  gl.bindVertexArray(vao);
529
558
  gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
530
559
  gl.bindVertexArray(null);
@@ -23,6 +23,14 @@ var assertOptionalColor = (value, name) => {
23
23
  }
24
24
  assertRequiredColor(value, name);
25
25
  };
26
+ var assertOptionalBoolean = (value, name) => {
27
+ if (value === undefined) {
28
+ return;
29
+ }
30
+ if (typeof value !== "boolean") {
31
+ throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
32
+ }
33
+ };
26
34
 
27
35
  // src/color-utils.ts
28
36
  var DEFAULT_AMOUNT = 1;
@@ -23,6 +23,14 @@ var assertOptionalColor = (value, name) => {
23
23
  }
24
24
  assertRequiredColor(value, name);
25
25
  };
26
+ var assertOptionalBoolean = (value, name) => {
27
+ if (value === undefined) {
28
+ return;
29
+ }
30
+ if (typeof value !== "boolean") {
31
+ throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
32
+ }
33
+ };
26
34
 
27
35
  // src/color-utils.ts
28
36
  var DEFAULT_AMOUNT = 1;
@@ -109,6 +117,7 @@ var DEFAULT_ANGLE = 0;
109
117
  var DEFAULT_OFFSET = 0;
110
118
  var DEFAULT_AMPLITUDE = 40;
111
119
  var DEFAULT_WAVELENGTH = 160;
120
+ var DEFAULT_MASK_TO_SOURCE_ALPHA = false;
112
121
  var zigzagSchema = {
113
122
  direction: {
114
123
  type: "enum",
@@ -167,6 +176,11 @@ var zigzagSchema = {
167
176
  default: DEFAULT_WAVELENGTH,
168
177
  description: "Wavelength",
169
178
  hiddenFromList: false
179
+ },
180
+ maskToSourceAlpha: {
181
+ type: "boolean",
182
+ default: DEFAULT_MASK_TO_SOURCE_ALPHA,
183
+ description: "Mask to source alpha"
170
184
  }
171
185
  };
172
186
  var resolve = (p) => {
@@ -180,7 +194,8 @@ var resolve = (p) => {
180
194
  angle: p.angle ?? DEFAULT_ANGLE,
181
195
  offset: p.offset ?? DEFAULT_OFFSET,
182
196
  amplitude: p.amplitude ?? DEFAULT_AMPLITUDE,
183
- wavelength: p.wavelength ?? DEFAULT_WAVELENGTH
197
+ wavelength: p.wavelength ?? DEFAULT_WAVELENGTH,
198
+ maskToSourceAlpha: p.maskToSourceAlpha ?? DEFAULT_MASK_TO_SOURCE_ALPHA
184
199
  };
185
200
  };
186
201
  var formatEnum = (variants) => {
@@ -228,6 +243,7 @@ var validateZigzagParams = (params) => {
228
243
  assertOptionalFiniteNumber(params.offset, "offset");
229
244
  assertOptionalFiniteNumber(params.amplitude, "amplitude");
230
245
  assertOptionalFiniteNumber(params.wavelength, "wavelength");
246
+ assertOptionalBoolean(params.maskToSourceAlpha, "maskToSourceAlpha");
231
247
  const thickness = params.thickness ?? DEFAULT_THICKNESS;
232
248
  const gap = params.gap ?? DEFAULT_GAP;
233
249
  const amplitude = params.amplitude ?? DEFAULT_AMPLITUDE;
@@ -264,6 +280,7 @@ uniform float uAngle;
264
280
  uniform float uOffset;
265
281
  uniform float uAmplitude;
266
282
  uniform float uWavelength;
283
+ uniform bool uMaskToSourceAlpha;
267
284
 
268
285
  void main() {
269
286
  vec4 texColor = texture(uSource, vUv);
@@ -298,6 +315,14 @@ void main() {
298
315
  float lineAlpha = lineColor.a;
299
316
  vec3 premultipliedLine = lineColor.rgb * lineAlpha;
300
317
 
318
+ if (uMaskToSourceAlpha) {
319
+ fragColor = vec4(
320
+ premultipliedLine * texColor.a + texColor.rgb * (1.0 - lineAlpha),
321
+ texColor.a
322
+ );
323
+ return;
324
+ }
325
+
301
326
  fragColor = vec4(
302
327
  premultipliedLine + texColor.rgb * (1.0 - lineAlpha),
303
328
  lineAlpha + texColor.a * (1.0 - lineAlpha)
@@ -427,7 +452,8 @@ var setupZigzag = (target) => {
427
452
  uAngle: gl.getUniformLocation(program, "uAngle"),
428
453
  uOffset: gl.getUniformLocation(program, "uOffset"),
429
454
  uAmplitude: gl.getUniformLocation(program, "uAmplitude"),
430
- uWavelength: gl.getUniformLocation(program, "uWavelength")
455
+ uWavelength: gl.getUniformLocation(program, "uWavelength"),
456
+ uMaskToSourceAlpha: gl.getUniformLocation(program, "uMaskToSourceAlpha")
431
457
  },
432
458
  cachedPaletteKey: "",
433
459
  palettePixelData: new Uint8Array(0)
@@ -461,7 +487,8 @@ var zigzag = createEffect({
461
487
  backend: "webgl2",
462
488
  calculateKey: (params) => {
463
489
  const r = resolve(params);
464
- return `zigzag-${r.colors.join("|")}-${r.direction}-${r.thickness}-${r.spacing}-${r.angle}-${r.offset}-${r.amplitude}-${r.wavelength}`;
490
+ const maskSuffix = r.maskToSourceAlpha ? "-mask-to-source-alpha" : "";
491
+ return `zigzag-${r.colors.join("|")}-${r.direction}-${r.thickness}-${r.spacing}-${r.angle}-${r.offset}-${r.amplitude}-${r.wavelength}${maskSuffix}`;
465
492
  },
466
493
  setup: (target) => setupZigzag(target),
467
494
  apply: ({ source, width, height, params, state, flipSourceY }) => {
@@ -508,6 +535,8 @@ var zigzag = createEffect({
508
535
  gl.uniform1f(uniforms.uAmplitude, r.amplitude);
509
536
  if (uniforms.uWavelength)
510
537
  gl.uniform1f(uniforms.uWavelength, r.wavelength);
538
+ if (uniforms.uMaskToSourceAlpha)
539
+ gl.uniform1i(uniforms.uMaskToSourceAlpha, r.maskToSourceAlpha ? 1 : 0);
511
540
  gl.bindVertexArray(vao);
512
541
  gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
513
542
  gl.bindVertexArray(null);
@@ -25,6 +25,7 @@ export declare const halftoneLinearGradientSchema: {
25
25
  readonly step: 0.01;
26
26
  readonly default: readonly [0, 0.5];
27
27
  readonly description: "First stop position";
28
+ readonly lineTo: "secondStopPosition";
28
29
  };
29
30
  readonly secondStopPosition: {
30
31
  readonly type: "uv-coordinate";
@@ -58,6 +59,11 @@ export declare const halftoneLinearGradientSchema: {
58
59
  readonly source: {};
59
60
  };
60
61
  };
62
+ readonly maskToSourceAlpha: {
63
+ readonly type: "boolean";
64
+ readonly default: false;
65
+ readonly description: "Mask to source alpha";
66
+ };
61
67
  };
62
68
  export type HalftoneLinearGradientColorMode = (typeof HALFTONE_LINEAR_GRADIENT_COLOR_MODES)[number];
63
69
  export type UvCoordinate = readonly [number, number];
@@ -82,6 +88,10 @@ type HalftoneLinearGradientCommonParams = {
82
88
  * Distance between adjacent dot centers.
83
89
  */
84
90
  readonly gridSize?: number;
91
+ /**
92
+ * Masks solid-color dots to the source alpha channel. Defaults to `false`.
93
+ */
94
+ readonly maskToSourceAlpha?: boolean;
85
95
  };
86
96
  export type HalftoneLinearGradientParams = HalftoneLinearGradientCommonParams & ({
87
97
  readonly colorMode?: 'solid';
package/dist/lines.d.ts CHANGED
@@ -40,6 +40,11 @@ export declare const linesSchema: {
40
40
  readonly description: "Offset";
41
41
  readonly hiddenFromList: false;
42
42
  };
43
+ readonly maskToSourceAlpha: {
44
+ readonly type: "boolean";
45
+ readonly default: false;
46
+ readonly description: "Mask to source alpha";
47
+ };
43
48
  };
44
49
  export type LinesDirection = (typeof LINE_DIRECTIONS)[number];
45
50
  export type LinesParams = {
@@ -55,6 +60,8 @@ export type LinesParams = {
55
60
  readonly angle?: number;
56
61
  /** Offset in pixels. Animate this value to scroll the lines. Defaults to `0`. */
57
62
  readonly offset?: number;
63
+ /** Masks the generated line pattern to the source alpha channel. Defaults to `false`. */
64
+ readonly maskToSourceAlpha?: boolean;
58
65
  };
59
66
  export declare const lines: (params?: (LinesParams & {
60
67
  readonly disabled?: boolean | undefined;
@@ -0,0 +1,26 @@
1
+ export type NoiseDisplacementCenter = readonly [number, number];
2
+ export type NoiseDisplacementParams = {
3
+ /** Center of the affected area in UV coordinates. */
4
+ readonly center: NoiseDisplacementCenter;
5
+ /** Radius of the affected area, relative to the shorter canvas side. */
6
+ readonly radius: number;
7
+ /** Maximum displacement in pixels at the center. Defaults to `36`. */
8
+ readonly strength?: number;
9
+ /** Seed for the deterministic noise field. Defaults to `0`. */
10
+ readonly seed?: number;
11
+ /** Size of each noise cell in pixels. Defaults to `8`. */
12
+ readonly grainSize?: number;
13
+ /** Number of source samples along the displacement path. Defaults to `6`. */
14
+ readonly passes?: number;
15
+ /** Additional local blur in pixels. Defaults to `0`. */
16
+ readonly blur?: number;
17
+ /** Edge softness as a fraction of the radius. Defaults to `0.25`. */
18
+ readonly feather?: number;
19
+ /** Direction of the optional bias pull in degrees. Defaults to `0`. */
20
+ readonly biasDirection?: number;
21
+ /** Directional pull multiplier relative to `strength`. Defaults to `0`. */
22
+ readonly biasAmount?: number;
23
+ };
24
+ export declare const noiseDisplacement: (params: NoiseDisplacementParams & {
25
+ readonly disabled?: boolean | undefined;
26
+ }) => import("remotion").EffectDescriptor<unknown>;
package/dist/rings.d.ts CHANGED
@@ -32,6 +32,11 @@ export declare const ringsSchema: {
32
32
  readonly description: "Offset";
33
33
  readonly hiddenFromList: false;
34
34
  };
35
+ readonly maskToSourceAlpha: {
36
+ readonly type: "boolean";
37
+ readonly default: false;
38
+ readonly description: "Mask to source alpha";
39
+ };
35
40
  };
36
41
  export type RingsCenter = readonly [number, number];
37
42
  export type RingsParams = {
@@ -45,6 +50,8 @@ export type RingsParams = {
45
50
  readonly gap?: number;
46
51
  /** Radial offset in pixels. Animate to expand or contract the rings. */
47
52
  readonly offset?: number;
53
+ /** Masks the generated ring pattern to the source alpha channel. Defaults to `false`. */
54
+ readonly maskToSourceAlpha?: boolean;
48
55
  };
49
56
  export declare const rings: (params?: (RingsParams & {
50
57
  readonly disabled?: boolean | undefined;
@@ -2,3 +2,4 @@ export declare const assertEffectParamsObject: (params: unknown, effectLabel: st
2
2
  export declare const assertRequiredFiniteNumber: (value: unknown, name: string) => void;
3
3
  export declare const assertRequiredColor: (value: unknown, name: string) => void;
4
4
  export declare const assertOptionalColor: (value: unknown, name: string) => void;
5
+ export declare const assertOptionalBoolean: (value: unknown, name: string) => void;
package/dist/waves.d.ts CHANGED
@@ -67,6 +67,11 @@ export declare const wavesSchema: {
67
67
  readonly description: "Phase";
68
68
  readonly hiddenFromList: false;
69
69
  };
70
+ readonly maskToSourceAlpha: {
71
+ readonly type: "boolean";
72
+ readonly default: false;
73
+ readonly description: "Mask to source alpha";
74
+ };
70
75
  };
71
76
  export type WavesDirection = (typeof WAVE_DIRECTIONS)[number];
72
77
  export type WavesParams = {
@@ -88,6 +93,8 @@ export type WavesParams = {
88
93
  readonly wavelength?: number;
89
94
  /** Wave phase in degrees. Defaults to `0`. */
90
95
  readonly phase?: number;
96
+ /** Masks the generated wave pattern to the source alpha channel. Defaults to `false`. */
97
+ readonly maskToSourceAlpha?: boolean;
91
98
  };
92
99
  export declare const waves: (params?: (WavesParams & {
93
100
  readonly disabled?: boolean | undefined;