@remotion/effects 4.0.464 → 4.0.466

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 (40) hide show
  1. package/README.md +13 -2
  2. package/dist/barrel-distortion/barrel-distortion-runtime.d.ts +21 -0
  3. package/dist/barrel-distortion/barrel-distortion-shaders.d.ts +2 -0
  4. package/dist/barrel-distortion/index.d.ts +7 -0
  5. package/dist/barrel-distortion.d.ts +1 -0
  6. package/dist/blur/blur-runtime.d.ts +4 -1
  7. package/dist/blur/index.d.ts +4 -0
  8. package/dist/blur.d.ts +1 -0
  9. package/dist/brightness.d.ts +7 -0
  10. package/dist/color-utils.d.ts +37 -0
  11. package/dist/effect-internals.d.ts +8 -0
  12. package/dist/esm/barrel-distortion.mjs +329 -0
  13. package/dist/esm/blur.mjs +107 -44
  14. package/dist/esm/brightness.mjs +138 -0
  15. package/dist/esm/grayscale.mjs +128 -0
  16. package/dist/esm/halftone.mjs +150 -20
  17. package/dist/esm/hue.mjs +126 -0
  18. package/dist/esm/index.mjs +0 -1
  19. package/dist/esm/invert.mjs +128 -0
  20. package/dist/esm/mirror.mjs +358 -0
  21. package/dist/esm/saturation.mjs +128 -0
  22. package/dist/esm/scale.mjs +103 -0
  23. package/dist/esm/tint.mjs +72 -14
  24. package/dist/esm/wave.mjs +289 -55
  25. package/dist/grayscale.d.ts +7 -0
  26. package/dist/halftone.d.ts +19 -7
  27. package/dist/hue.d.ts +7 -0
  28. package/dist/invert.d.ts +7 -0
  29. package/dist/mirror/index.d.ts +13 -0
  30. package/dist/mirror/mirror-runtime.d.ts +26 -0
  31. package/dist/mirror/mirror-shaders.d.ts +2 -0
  32. package/dist/mirror.d.ts +1 -0
  33. package/dist/saturation.d.ts +7 -0
  34. package/dist/scale/index.d.ts +11 -0
  35. package/dist/scale.d.ts +1 -0
  36. package/dist/wave/index.d.ts +12 -0
  37. package/dist/wave/wave-runtime.d.ts +29 -0
  38. package/dist/wave/wave-shaders.d.ts +2 -0
  39. package/dist/wave.d.ts +1 -46
  40. package/package.json +77 -12
package/dist/esm/tint.mjs CHANGED
@@ -1,14 +1,3 @@
1
- var __defProp = Object.defineProperty;
2
- var __export = (target, all) => {
3
- for (var name in all)
4
- __defProp(target, name, {
5
- get: all[name],
6
- enumerable: true,
7
- configurable: true,
8
- set: (newValue) => all[name] = () => newValue
9
- });
10
- };
11
-
12
1
  // src/tint.ts
13
2
  import { Internals } from "remotion";
14
3
 
@@ -29,9 +18,73 @@ var assertRequiredColor = (value, name) => {
29
18
  }
30
19
  };
31
20
 
21
+ // src/color-utils.ts
22
+ var DEFAULT_AMOUNT = 1;
23
+ var DEFAULT_BRIGHTNESS_AMOUNT = 0;
24
+ var DEFAULT_HUE_DEGREES = 0;
25
+ var colorAmountSchema = {
26
+ type: "number",
27
+ min: 0,
28
+ max: 1,
29
+ step: 0.01,
30
+ default: DEFAULT_AMOUNT,
31
+ description: "Amount"
32
+ };
33
+ var colorMultiplierSchema = {
34
+ type: "number",
35
+ min: 0,
36
+ step: 0.01,
37
+ default: DEFAULT_AMOUNT,
38
+ description: "Amount"
39
+ };
40
+ var brightnessAmountSchema = {
41
+ type: "number",
42
+ min: -1,
43
+ max: 1,
44
+ step: 0.01,
45
+ default: DEFAULT_BRIGHTNESS_AMOUNT,
46
+ description: "Amount"
47
+ };
48
+ var hueDegreesSchema = {
49
+ type: "number",
50
+ step: 1,
51
+ default: DEFAULT_HUE_DEGREES,
52
+ description: "Degrees"
53
+ };
54
+ var assertOptionalFiniteNumber = (value, name) => {
55
+ if (value === undefined) {
56
+ return;
57
+ }
58
+ assertRequiredFiniteNumber(value, name);
59
+ };
60
+ var validateUnitInterval = (value, name) => {
61
+ if (value < 0) {
62
+ throw new TypeError(`"${name}" must be >= 0, but got ${JSON.stringify(value)}`);
63
+ }
64
+ if (value > 1) {
65
+ throw new TypeError(`"${name}" must be <= 1, but got ${JSON.stringify(value)}`);
66
+ }
67
+ };
68
+ var validateNonNegative = (value, name) => {
69
+ if (value < 0) {
70
+ throw new TypeError(`"${name}" must be >= 0, but got ${JSON.stringify(value)}`);
71
+ }
72
+ };
73
+ var validateSignedUnitInterval = (value, name) => {
74
+ if (value < -1) {
75
+ throw new TypeError(`"${name}" must be >= -1, but got ${JSON.stringify(value)}`);
76
+ }
77
+ if (value > 1) {
78
+ throw new TypeError(`"${name}" must be <= 1, but got ${JSON.stringify(value)}`);
79
+ }
80
+ };
81
+ var clampColorChannel = (value) => {
82
+ return Math.max(0, Math.min(255, value));
83
+ };
84
+
32
85
  // src/tint.ts
33
86
  var { createEffect } = Internals;
34
- var DEFAULT_AMOUNT = 0.5;
87
+ var DEFAULT_AMOUNT2 = 0.5;
35
88
  var tintSchema = {
36
89
  color: {
37
90
  type: "color",
@@ -43,21 +96,26 @@ var tintSchema = {
43
96
  min: 0,
44
97
  max: 1,
45
98
  step: 0.01,
46
- default: DEFAULT_AMOUNT,
99
+ default: DEFAULT_AMOUNT2,
47
100
  description: "Amount"
48
101
  }
49
102
  };
50
103
  var resolve = (p) => ({
51
104
  color: p.color,
52
- amount: p.amount ?? DEFAULT_AMOUNT
105
+ amount: p.amount ?? DEFAULT_AMOUNT2
53
106
  });
54
107
  var validateTintParams = (params) => {
55
108
  assertEffectParamsObject(params, "Tint");
56
109
  assertRequiredColor(params.color, "color");
110
+ assertOptionalFiniteNumber(params.amount, "amount");
111
+ if (params.amount !== undefined) {
112
+ validateUnitInterval(params.amount, "amount");
113
+ }
57
114
  };
58
115
  var tint = createEffect({
59
116
  type: "remotion/tint",
60
117
  label: "Tint",
118
+ documentationLink: "https://www.remotion.dev/docs/effects/tint",
61
119
  backend: "2d",
62
120
  calculateKey: (params) => {
63
121
  const r = resolve(params);
package/dist/esm/wave.mjs CHANGED
@@ -1,18 +1,254 @@
1
- var __defProp = Object.defineProperty;
2
- var __export = (target, all) => {
3
- for (var name in all)
4
- __defProp(target, name, {
5
- get: all[name],
6
- enumerable: true,
7
- configurable: true,
8
- set: (newValue) => all[name] = () => newValue
9
- });
1
+ // src/wave/index.ts
2
+ import { Internals as Internals2 } from "remotion";
3
+
4
+ // src/validate-effect-param.ts
5
+ var assertEffectParamsObject = (params, effectLabel) => {
6
+ if (params === null || typeof params !== "object") {
7
+ throw new TypeError(`${effectLabel} effect requires a parameters object, but got ${JSON.stringify(params)}`);
8
+ }
9
+ };
10
+ var assertRequiredFiniteNumber = (value, name) => {
11
+ if (typeof value !== "number" || !Number.isFinite(value)) {
12
+ throw new TypeError(`"${name}" must be a finite number, but got ${JSON.stringify(value)}`);
13
+ }
14
+ };
15
+ var assertRequiredColor = (value, name) => {
16
+ if (typeof value !== "string" || value.length === 0) {
17
+ throw new TypeError(`"${name}" must be a non-empty string, but got ${JSON.stringify(value)}`);
18
+ }
10
19
  };
11
20
 
12
- // src/wave.ts
21
+ // src/wave/wave-runtime.ts
13
22
  import { Internals } from "remotion";
14
- var { createEffect } = Internals;
23
+
24
+ // src/wave/wave-shaders.ts
25
+ var WAVE_VS = `#version 300 es
26
+ layout(location = 0) in vec2 aPos;
27
+ layout(location = 1) in vec2 aUv;
28
+ out vec2 vUv;
29
+ void main() {
30
+ vUv = aUv;
31
+ gl_Position = vec4(aPos, 0.0, 1.0);
32
+ }
33
+ `;
34
+ var WAVE_FS = `#version 300 es
35
+ precision highp float;
36
+ in vec2 vUv;
37
+ out vec4 fragColor;
38
+
39
+ uniform sampler2D uSource;
40
+ uniform vec2 uResolution;
41
+ uniform float uAmplitude;
42
+ uniform float uWavelength;
43
+ uniform float uPhase;
44
+ uniform int uDirection;
45
+
46
+ const float TWO_PI = 6.28318530718;
47
+
48
+ void main() {
49
+ float wavelength = max(uWavelength, 0.001);
50
+ vec2 srcUv = vUv;
51
+
52
+ if (uDirection == 0) {
53
+ float coordPx = vUv.x * uResolution.x;
54
+ float offsetPx =
55
+ sin((coordPx / wavelength) * TWO_PI + uPhase) * uAmplitude;
56
+ srcUv.y -= offsetPx / uResolution.y;
57
+ } else {
58
+ float coordPx = vUv.y * uResolution.y;
59
+ float offsetPx =
60
+ sin((coordPx / wavelength) * TWO_PI + uPhase) * uAmplitude;
61
+ srcUv.x -= offsetPx / uResolution.x;
62
+ }
63
+
64
+ fragColor = texture(uSource, srcUv);
65
+ }
66
+ `;
67
+
68
+ // src/wave/wave-runtime.ts
69
+ var { createWebGL2ContextError } = Internals;
70
+ var compileShader = (gl, type, source) => {
71
+ const shader = gl.createShader(type);
72
+ if (!shader) {
73
+ throw new Error("Failed to create WebGL shader");
74
+ }
75
+ gl.shaderSource(shader, source);
76
+ gl.compileShader(shader);
77
+ if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
78
+ const log = gl.getShaderInfoLog(shader);
79
+ gl.deleteShader(shader);
80
+ throw new Error(`Shader compile failed: ${log ?? "(no log)"}`);
81
+ }
82
+ return shader;
83
+ };
84
+ var linkProgram = (gl, vs, fs) => {
85
+ const program = gl.createProgram();
86
+ if (!program) {
87
+ throw new Error("Failed to create WebGL program");
88
+ }
89
+ gl.attachShader(program, vs);
90
+ gl.attachShader(program, fs);
91
+ gl.linkProgram(program);
92
+ if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
93
+ const log = gl.getProgramInfoLog(program);
94
+ gl.deleteProgram(program);
95
+ throw new Error(`Program link failed: ${log ?? "(no log)"}`);
96
+ }
97
+ return program;
98
+ };
99
+ var createProgram = (gl, vertexSource, fragmentSource) => {
100
+ const vs = compileShader(gl, gl.VERTEX_SHADER, vertexSource);
101
+ const fs = compileShader(gl, gl.FRAGMENT_SHADER, fragmentSource);
102
+ const program = linkProgram(gl, vs, fs);
103
+ gl.deleteShader(vs);
104
+ gl.deleteShader(fs);
105
+ return program;
106
+ };
107
+ var getWaveUniforms = (gl, program) => ({
108
+ uSource: gl.getUniformLocation(program, "uSource"),
109
+ uResolution: gl.getUniformLocation(program, "uResolution"),
110
+ uAmplitude: gl.getUniformLocation(program, "uAmplitude"),
111
+ uWavelength: gl.getUniformLocation(program, "uWavelength"),
112
+ uPhase: gl.getUniformLocation(program, "uPhase"),
113
+ uDirection: gl.getUniformLocation(program, "uDirection")
114
+ });
115
+ var createRgbaTexture = (gl) => {
116
+ const texture = gl.createTexture();
117
+ if (!texture) {
118
+ throw new Error("Failed to create WebGL texture");
119
+ }
120
+ gl.bindTexture(gl.TEXTURE_2D, texture);
121
+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
122
+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
123
+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
124
+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
125
+ gl.bindTexture(gl.TEXTURE_2D, null);
126
+ return texture;
127
+ };
128
+ var setupWave = (target) => {
129
+ const gl = target.getContext("webgl2", {
130
+ premultipliedAlpha: true,
131
+ alpha: true,
132
+ preserveDrawingBuffer: true
133
+ });
134
+ if (!gl) {
135
+ throw createWebGL2ContextError("wave effect");
136
+ }
137
+ gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);
138
+ gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);
139
+ const program = createProgram(gl, WAVE_VS, WAVE_FS);
140
+ const vao = gl.createVertexArray();
141
+ if (!vao) {
142
+ throw new Error("Failed to create WebGL vertex array");
143
+ }
144
+ gl.bindVertexArray(vao);
145
+ const data = new Float32Array([
146
+ -1,
147
+ -1,
148
+ 0,
149
+ 0,
150
+ 1,
151
+ -1,
152
+ 1,
153
+ 0,
154
+ -1,
155
+ 1,
156
+ 0,
157
+ 1,
158
+ 1,
159
+ 1,
160
+ 1,
161
+ 1
162
+ ]);
163
+ const vbo = gl.createBuffer();
164
+ if (!vbo) {
165
+ throw new Error("Failed to create WebGL buffer");
166
+ }
167
+ gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
168
+ gl.bufferData(gl.ARRAY_BUFFER, data, gl.STATIC_DRAW);
169
+ gl.enableVertexAttribArray(0);
170
+ gl.vertexAttribPointer(0, 2, gl.FLOAT, false, 16, 0);
171
+ gl.enableVertexAttribArray(1);
172
+ gl.vertexAttribPointer(1, 2, gl.FLOAT, false, 16, 8);
173
+ gl.bindVertexArray(null);
174
+ const textureSource = createRgbaTexture(gl);
175
+ return {
176
+ gl,
177
+ program,
178
+ vao,
179
+ vbo,
180
+ textureSource,
181
+ uniforms: getWaveUniforms(gl, program)
182
+ };
183
+ };
184
+ var cleanupWave = (state) => {
185
+ const { gl, program, vao, vbo, textureSource } = state;
186
+ gl.deleteTexture(textureSource);
187
+ gl.deleteBuffer(vbo);
188
+ gl.deleteProgram(program);
189
+ gl.deleteVertexArray(vao);
190
+ };
191
+ var drawFullscreenQuad = (state) => {
192
+ const { gl, vao } = state;
193
+ gl.bindVertexArray(vao);
194
+ gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
195
+ gl.bindVertexArray(null);
196
+ };
197
+ var applyWave = ({
198
+ state,
199
+ source,
200
+ width,
201
+ height,
202
+ amplitude,
203
+ wavelength,
204
+ phase,
205
+ direction
206
+ }) => {
207
+ const { gl, program, textureSource, uniforms } = state;
208
+ gl.viewport(0, 0, width, height);
209
+ gl.bindTexture(gl.TEXTURE_2D, textureSource);
210
+ gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, source);
211
+ gl.bindTexture(gl.TEXTURE_2D, null);
212
+ gl.bindFramebuffer(gl.FRAMEBUFFER, null);
213
+ gl.clearColor(0, 0, 0, 0);
214
+ gl.clear(gl.COLOR_BUFFER_BIT);
215
+ gl.useProgram(program);
216
+ if (uniforms.uSource)
217
+ gl.uniform1i(uniforms.uSource, 0);
218
+ if (uniforms.uResolution)
219
+ gl.uniform2f(uniforms.uResolution, width, height);
220
+ if (uniforms.uAmplitude)
221
+ gl.uniform1f(uniforms.uAmplitude, amplitude);
222
+ if (uniforms.uWavelength)
223
+ gl.uniform1f(uniforms.uWavelength, wavelength);
224
+ if (uniforms.uPhase)
225
+ gl.uniform1f(uniforms.uPhase, phase);
226
+ if (uniforms.uDirection)
227
+ gl.uniform1i(uniforms.uDirection, direction === "horizontal" ? 0 : 1);
228
+ gl.activeTexture(gl.TEXTURE0);
229
+ gl.bindTexture(gl.TEXTURE_2D, textureSource);
230
+ drawFullscreenQuad(state);
231
+ gl.bindTexture(gl.TEXTURE_2D, null);
232
+ gl.useProgram(null);
233
+ };
234
+
235
+ // src/wave/index.ts
236
+ var { createEffect } = Internals2;
15
237
  var waveSchema = {
238
+ phase: {
239
+ type: "number",
240
+ default: 0,
241
+ description: "Phase"
242
+ },
243
+ direction: {
244
+ type: "enum",
245
+ variants: {
246
+ horizontal: {},
247
+ vertical: {}
248
+ },
249
+ default: "horizontal",
250
+ description: "Direction"
251
+ },
16
252
  amplitude: {
17
253
  type: "number",
18
254
  min: 0,
@@ -28,65 +264,63 @@ var waveSchema = {
28
264
  step: 1,
29
265
  default: 240,
30
266
  description: "Wavelength"
31
- },
32
- evolution: {
33
- type: "number",
34
- default: 0,
35
- description: "Evolution"
36
- },
37
- sliceWidth: {
38
- type: "number",
39
- min: 1,
40
- max: 100,
41
- step: 1,
42
- default: 4,
43
- description: "Slice width"
44
- },
45
- background: {
46
- type: "color",
47
- default: "transparent",
48
- description: "Background"
49
267
  }
50
268
  };
51
269
  var resolve = (p) => ({
270
+ phase: p.phase ?? 0,
271
+ direction: p.direction ?? "horizontal",
52
272
  amplitude: p.amplitude ?? 60,
53
- wavelength: p.wavelength ?? 240,
54
- evolution: p.evolution ?? 0,
55
- sliceWidth: p.sliceWidth ?? 4,
56
- background: p.background ?? "transparent"
273
+ wavelength: p.wavelength ?? 240
57
274
  });
275
+ var assertOptionalFiniteNumber = (value, name) => {
276
+ if (value === undefined) {
277
+ return;
278
+ }
279
+ assertRequiredFiniteNumber(value, name);
280
+ };
281
+ var validateWaveParams = (params) => {
282
+ assertEffectParamsObject(params, "Wave");
283
+ assertOptionalFiniteNumber(params.phase, "phase");
284
+ assertOptionalFiniteNumber(params.amplitude, "amplitude");
285
+ assertOptionalFiniteNumber(params.wavelength, "wavelength");
286
+ if (params.direction !== undefined && params.direction !== "horizontal" && params.direction !== "vertical") {
287
+ throw new TypeError(`"direction" must be "horizontal" or "vertical", but got ${JSON.stringify(params.direction)}`);
288
+ }
289
+ const resolved = resolve(params);
290
+ if (resolved.amplitude < 0) {
291
+ throw new TypeError(`"amplitude" must be >= 0, but got ${JSON.stringify(resolved.amplitude)}`);
292
+ }
293
+ if (resolved.wavelength <= 0) {
294
+ throw new TypeError(`"wavelength" must be > 0, but got ${JSON.stringify(resolved.wavelength)}`);
295
+ }
296
+ };
58
297
  var wave = createEffect({
59
298
  type: "remotion/wave",
60
299
  label: "Wave",
61
- backend: "2d",
300
+ documentationLink: "https://www.remotion.dev/docs/effects/wave",
301
+ backend: "webgl2",
62
302
  calculateKey: (params) => {
63
303
  const r = resolve(params);
64
- return `wave-${r.amplitude}-${r.wavelength}-${r.evolution}-${r.sliceWidth}-${r.background}`;
304
+ return `wave-${r.phase}-${r.direction}-${r.amplitude}-${r.wavelength}`;
65
305
  },
66
- setup: () => null,
67
- apply: ({ source, target, width, height, params }) => {
68
- const ctx = target.getContext("2d");
69
- if (!ctx) {
70
- throw new Error("Failed to acquire 2D context for wave effect. The canvas may have been assigned a different context type.");
71
- }
306
+ setup: (target) => setupWave(target),
307
+ apply: ({ source, width, height, params, state }) => {
72
308
  const r = resolve(params);
73
- ctx.clearRect(0, 0, width, height);
74
- if (r.background !== "transparent") {
75
- ctx.fillStyle = r.background;
76
- ctx.fillRect(0, 0, width, height);
77
- }
78
- for (let x = 0;x < width; x += r.sliceWidth) {
79
- const offset = Math.sin(x / r.wavelength * Math.PI * 2 + r.evolution) * r.amplitude;
80
- ctx.drawImage(source, x, 0, r.sliceWidth, height, x, offset, r.sliceWidth, height);
81
- }
82
- },
83
- cleanup: () => {
84
- return;
309
+ applyWave({
310
+ state,
311
+ source,
312
+ width,
313
+ height,
314
+ amplitude: r.amplitude,
315
+ wavelength: r.wavelength,
316
+ phase: r.phase,
317
+ direction: r.direction
318
+ });
85
319
  },
320
+ cleanup: (state) => cleanupWave(state),
86
321
  schema: waveSchema,
87
- validateParams: () => {}
322
+ validateParams: validateWaveParams
88
323
  });
89
324
  export {
90
- waveSchema,
91
325
  wave
92
326
  };
@@ -0,0 +1,7 @@
1
+ export type GrayscaleParams = {
2
+ /** Mix between original color and grayscale. Defaults to `1`. */
3
+ readonly amount?: number;
4
+ };
5
+ export declare const grayscale: (params?: (GrayscaleParams & {
6
+ readonly disabled?: boolean | undefined;
7
+ }) | undefined) => import("remotion").EffectDescriptor<unknown>;
@@ -1,3 +1,5 @@
1
+ declare const HALFTONE_SHAPES: readonly ["circle", "square", "line"];
2
+ declare const HALFTONE_SAMPLING: readonly ["bilinear", "nearest"];
1
3
  export declare const halftoneSchema: {
2
4
  readonly dotSize: {
3
5
  readonly type: "number";
@@ -45,9 +47,19 @@ export declare const halftoneSchema: {
45
47
  readonly default: "circle";
46
48
  readonly description: "Shape";
47
49
  };
50
+ readonly invert: {
51
+ readonly type: "boolean";
52
+ readonly default: false;
53
+ readonly description: "Invert";
54
+ };
55
+ readonly color: {
56
+ readonly type: "color";
57
+ readonly default: "black";
58
+ readonly description: "Color";
59
+ };
48
60
  };
49
- export type HalftoneShape = 'circle' | 'square' | 'line';
50
- export type HalftoneSampling = 'bilinear' | 'nearest';
61
+ export type HalftoneShape = (typeof HALFTONE_SHAPES)[number];
62
+ export type HalftoneSampling = (typeof HALFTONE_SAMPLING)[number];
51
63
  export type HalftoneParams = {
52
64
  readonly shape?: HalftoneShape;
53
65
  readonly dotSize?: number;
@@ -63,13 +75,13 @@ export type HalftoneParams = {
63
75
  /** Dot color. Defaults to black. */
64
76
  readonly color?: string;
65
77
  /**
66
- * When false (default), halftone follows luminance on opaque pixels (classic
67
- * halftone on your subject). When true, the same dot pattern fills transparent
68
- * and low-alpha areas instead—e.g. the canvas around a cut-out shape—while
69
- * leaving the opaque shape mostly free of those dots.
78
+ * When false (default), dark areas produce larger dots.
79
+ * When true, the pattern is inverted:
80
+ * bright and transparent areas produce larger dots instead.
70
81
  */
71
- readonly shadeOutside?: boolean;
82
+ readonly invert?: boolean;
72
83
  };
73
84
  export declare const halftone: (params?: (HalftoneParams & {
74
85
  readonly disabled?: boolean | undefined;
75
86
  }) | undefined) => import("remotion").EffectDescriptor<unknown>;
87
+ export {};
package/dist/hue.d.ts ADDED
@@ -0,0 +1,7 @@
1
+ export type HueParams = {
2
+ /** Hue rotation in degrees. Defaults to `0`. */
3
+ readonly degrees?: number;
4
+ };
5
+ export declare const hue: (params?: (HueParams & {
6
+ readonly disabled?: boolean | undefined;
7
+ }) | undefined) => import("remotion").EffectDescriptor<unknown>;
@@ -0,0 +1,7 @@
1
+ export type InvertParams = {
2
+ /** Mix between original color and inverted color. Defaults to `1`. */
3
+ readonly amount?: number;
4
+ };
5
+ export declare const invert: (params?: (InvertParams & {
6
+ readonly disabled?: boolean | undefined;
7
+ }) | undefined) => import("remotion").EffectDescriptor<unknown>;
@@ -0,0 +1,13 @@
1
+ import { type MirrorDirection } from './mirror-runtime.js';
2
+ export type { MirrorDirection };
3
+ export type MirrorParams = {
4
+ /** Mirror direction. Defaults to `horizontal`. */
5
+ readonly direction?: MirrorDirection;
6
+ /** Mirror position in UV coordinates. Defaults to `0.5`. */
7
+ readonly position?: number;
8
+ /** Mirror the other side of the image. Defaults to `false`. */
9
+ readonly invert?: boolean;
10
+ };
11
+ export declare const mirror: (params?: (MirrorParams & {
12
+ readonly disabled?: boolean | undefined;
13
+ }) | undefined) => import("remotion").EffectDescriptor<unknown>;
@@ -0,0 +1,26 @@
1
+ export type MirrorDirection = 'horizontal' | 'vertical';
2
+ export type MirrorState = {
3
+ gl: WebGL2RenderingContext;
4
+ program: WebGLProgram;
5
+ vao: WebGLVertexArrayObject;
6
+ vbo: WebGLBuffer;
7
+ textureSource: WebGLTexture;
8
+ uniforms: {
9
+ uSource: WebGLUniformLocation | null;
10
+ uPosition: WebGLUniformLocation | null;
11
+ uDirection: WebGLUniformLocation | null;
12
+ uInvert: WebGLUniformLocation | null;
13
+ };
14
+ };
15
+ export declare const setupMirror: (target: HTMLCanvasElement) => MirrorState;
16
+ export declare const cleanupMirror: (state: MirrorState) => void;
17
+ export declare const applyMirror: ({ state, source, width, height, position, direction, invert, flipSourceY, }: {
18
+ readonly state: MirrorState;
19
+ readonly source: CanvasImageSource;
20
+ readonly width: number;
21
+ readonly height: number;
22
+ readonly position: number;
23
+ readonly direction: MirrorDirection;
24
+ readonly invert: boolean;
25
+ readonly flipSourceY: boolean;
26
+ }) => void;
@@ -0,0 +1,2 @@
1
+ export declare const MIRROR_VS = "#version 300 es\nlayout(location = 0) in vec2 aPos;\nlayout(location = 1) in vec2 aUv;\nout vec2 vUv;\nvoid main() {\n\tvUv = aUv;\n\tgl_Position = vec4(aPos, 0.0, 1.0);\n}\n";
2
+ export declare const MIRROR_FS = "#version 300 es\nprecision highp float;\nin vec2 vUv;\nout vec4 fragColor;\n\nuniform sampler2D uSource;\nuniform float uPosition;\nuniform int uDirection;\nuniform bool uInvert;\n\nvoid main() {\n\tvec2 srcUv = vUv;\n\tfloat coord = uDirection == 0 ? vUv.x : vUv.y;\n\tbool shouldMirror = uInvert ? coord < uPosition : coord > uPosition;\n\n\tif (shouldMirror) {\n\t\tfloat mirrored = 2.0 * uPosition - coord;\n\t\tif (uDirection == 0) {\n\t\t\tsrcUv.x = mirrored;\n\t\t} else {\n\t\t\tsrcUv.y = mirrored;\n\t\t}\n\t}\n\n\tfragColor = texture(uSource, clamp(srcUv, vec2(0.0), vec2(1.0)));\n}\n";
@@ -0,0 +1 @@
1
+ export { mirror, type MirrorDirection, type MirrorParams, } from './mirror/index.js';
@@ -0,0 +1,7 @@
1
+ export type SaturationParams = {
2
+ /** Saturation multiplier. `1` leaves colors unchanged, `0` makes them grayscale. Defaults to `1`. */
3
+ readonly amount?: number;
4
+ };
5
+ export declare const saturation: (params?: (SaturationParams & {
6
+ readonly disabled?: boolean | undefined;
7
+ }) | undefined) => import("remotion").EffectDescriptor<unknown>;
@@ -0,0 +1,11 @@
1
+ export type ScaleParams = {
2
+ /** Scale factor. Defaults to `1`. Must be greater than 0. */
3
+ readonly scale: number;
4
+ /** Whether to apply horizontal scaling. Defaults to `true`. */
5
+ readonly horizontal?: boolean;
6
+ /** Whether to apply vertical scaling. Defaults to `true`. */
7
+ readonly vertical?: boolean;
8
+ };
9
+ export declare const scale: (params: ScaleParams & {
10
+ readonly disabled?: boolean | undefined;
11
+ }) => import("remotion").EffectDescriptor<unknown>;
@@ -0,0 +1 @@
1
+ export { scale, type ScaleParams } from './scale/index.js';
@@ -0,0 +1,12 @@
1
+ export type WaveDirection = 'horizontal' | 'vertical';
2
+ export type WaveParams = {
3
+ /** Phase offset in radians. */
4
+ readonly phase?: number;
5
+ /** Wave propagation axis. Defaults to `horizontal`. */
6
+ readonly direction?: WaveDirection;
7
+ readonly amplitude?: number;
8
+ readonly wavelength?: number;
9
+ };
10
+ export declare const wave: (params?: (WaveParams & {
11
+ readonly disabled?: boolean | undefined;
12
+ }) | undefined) => import("remotion").EffectDescriptor<unknown>;
@@ -0,0 +1,29 @@
1
+ export type WaveState = {
2
+ gl: WebGL2RenderingContext;
3
+ program: WebGLProgram;
4
+ vao: WebGLVertexArrayObject;
5
+ vbo: WebGLBuffer;
6
+ textureSource: WebGLTexture;
7
+ uniforms: {
8
+ uSource: WebGLUniformLocation | null;
9
+ uResolution: WebGLUniformLocation | null;
10
+ uAmplitude: WebGLUniformLocation | null;
11
+ uWavelength: WebGLUniformLocation | null;
12
+ uPhase: WebGLUniformLocation | null;
13
+ uDirection: WebGLUniformLocation | null;
14
+ };
15
+ };
16
+ export declare const setupWave: (target: HTMLCanvasElement) => WaveState;
17
+ export declare const cleanupWave: (state: WaveState) => void;
18
+ type ApplyWaveParams = {
19
+ readonly state: WaveState;
20
+ readonly source: CanvasImageSource;
21
+ readonly width: number;
22
+ readonly height: number;
23
+ readonly amplitude: number;
24
+ readonly wavelength: number;
25
+ readonly phase: number;
26
+ readonly direction: 'horizontal' | 'vertical';
27
+ };
28
+ export declare const applyWave: ({ state, source, width, height, amplitude, wavelength, phase, direction, }: ApplyWaveParams) => void;
29
+ export {};
@@ -0,0 +1,2 @@
1
+ export declare const WAVE_VS = "#version 300 es\nlayout(location = 0) in vec2 aPos;\nlayout(location = 1) in vec2 aUv;\nout vec2 vUv;\nvoid main() {\n\tvUv = aUv;\n\tgl_Position = vec4(aPos, 0.0, 1.0);\n}\n";
2
+ export declare const WAVE_FS = "#version 300 es\nprecision highp float;\nin vec2 vUv;\nout vec4 fragColor;\n\nuniform sampler2D uSource;\nuniform vec2 uResolution;\nuniform float uAmplitude;\nuniform float uWavelength;\nuniform float uPhase;\nuniform int uDirection;\n\nconst float TWO_PI = 6.28318530718;\n\nvoid main() {\n\tfloat wavelength = max(uWavelength, 0.001);\n\tvec2 srcUv = vUv;\n\n\tif (uDirection == 0) {\n\t\tfloat coordPx = vUv.x * uResolution.x;\n\t\tfloat offsetPx =\n\t\t\tsin((coordPx / wavelength) * TWO_PI + uPhase) * uAmplitude;\n\t\tsrcUv.y -= offsetPx / uResolution.y;\n\t} else {\n\t\tfloat coordPx = vUv.y * uResolution.y;\n\t\tfloat offsetPx =\n\t\t\tsin((coordPx / wavelength) * TWO_PI + uPhase) * uAmplitude;\n\t\tsrcUv.x -= offsetPx / uResolution.x;\n\t}\n\n\tfragColor = texture(uSource, srcUv);\n}\n";