@remotion/effects 4.0.470 → 4.0.472

package/dist/esm/speckle.mjs

@@ -34,14 +34,16 @@ var colorAmountSchema = {
   max: 1,
   step: 0.01,
   default: DEFAULT_AMOUNT,
-  description: "Amount"
+  description: "Amount",
+  hiddenFromList: false
 };
 var colorMultiplierSchema = {
   type: "number",
   min: 0,
   step: 0.01,
   default: DEFAULT_AMOUNT,
-  description: "Amount"
+  description: "Amount",
+  hiddenFromList: false
 };
 var brightnessAmountSchema = {
   type: "number",
@@ -49,10 +51,11 @@ var brightnessAmountSchema = {
   max: 1,
   step: 0.01,
   default: DEFAULT_BRIGHTNESS_AMOUNT,
-  description: "Amount"
+  description: "Amount",
+  hiddenFromList: false
 };
 var hueDegreesSchema = {
-  type: "number",
+  type: "rotation-degrees",
   step: 1,
   default: DEFAULT_HUE_DEGREES,
   description: "Degrees"
@@ -107,7 +110,8 @@ var speckleSchema = {
     max: 1,
     step: 0.01,
     default: DEFAULT_DENSITY,
-    description: "Density"
+    description: "Density",
+    hiddenFromList: false
   },
   size: {
     type: "number",
@@ -115,7 +119,8 @@ var speckleSchema = {
     max: 50,
     step: 0.1,
     default: DEFAULT_SIZE,
-    description: "Size"
+    description: "Size",
+    hiddenFromList: false
   },
   randomness: {
     type: "number",
@@ -123,7 +128,8 @@ var speckleSchema = {
     max: 1,
     step: 0.01,
     default: DEFAULT_RANDOMNESS,
-    description: "Randomness"
+    description: "Randomness",
+    hiddenFromList: false
   }
 };
 var resolve = (p) => ({

package/dist/esm/tint.mjs

@@ -34,14 +34,16 @@ var colorAmountSchema = {
   max: 1,
   step: 0.01,
   default: DEFAULT_AMOUNT,
-  description: "Amount"
+  description: "Amount",
+  hiddenFromList: false
 };
 var colorMultiplierSchema = {
   type: "number",
   min: 0,
   step: 0.01,
   default: DEFAULT_AMOUNT,
-  description: "Amount"
+  description: "Amount",
+  hiddenFromList: false
 };
 var brightnessAmountSchema = {
   type: "number",
@@ -49,10 +51,11 @@ var brightnessAmountSchema = {
   max: 1,
   step: 0.01,
   default: DEFAULT_BRIGHTNESS_AMOUNT,
-  description: "Amount"
+  description: "Amount",
+  hiddenFromList: false
 };
 var hueDegreesSchema = {
-  type: "number",
+  type: "rotation-degrees",
   step: 1,
   default: DEFAULT_HUE_DEGREES,
   description: "Degrees"
@@ -110,7 +113,8 @@ var tintSchema = {
     max: 1,
     step: 0.01,
     default: DEFAULT_AMOUNT2,
-    description: "Amount"
+    description: "Amount",
+    hiddenFromList: false
   }
 };
 var resolve = (p) => ({

package/dist/esm/translate.mjs

@@ -34,14 +34,16 @@ var colorAmountSchema = {
   max: 1,
   step: 0.01,
   default: DEFAULT_AMOUNT,
-  description: "Amount"
+  description: "Amount",
+  hiddenFromList: false
 };
 var colorMultiplierSchema = {
   type: "number",
   min: 0,
   step: 0.01,
   default: DEFAULT_AMOUNT,
-  description: "Amount"
+  description: "Amount",
+  hiddenFromList: false
 };
 var brightnessAmountSchema = {
   type: "number",
@@ -49,10 +51,11 @@ var brightnessAmountSchema = {
   max: 1,
   step: 0.01,
   default: DEFAULT_BRIGHTNESS_AMOUNT,
-  description: "Amount"
+  description: "Amount",
+  hiddenFromList: false
 };
 var hueDegreesSchema = {
-  type: "number",
+  type: "rotation-degrees",
   step: 1,
   default: DEFAULT_HUE_DEGREES,
   description: "Degrees"
@@ -102,13 +105,15 @@ var xyTranslateSchema = {
     type: "number",
     step: 1,
     default: 0,
-    description: "X"
+    description: "X",
+    hiddenFromList: false
   },
   y: {
     type: "number",
     step: 1,
     default: 0,
-    description: "Y"
+    description: "Y",
+    hiddenFromList: false
   }
 };
 var uvTranslateSchema = {
@@ -116,13 +121,15 @@ var uvTranslateSchema = {
     type: "number",
     step: 0.01,
     default: 0,
-    description: "U"
+    description: "U",
+    hiddenFromList: false
   },
   v: {
     type: "number",
     step: 0.01,
     default: 0,
-    description: "V"
+    description: "V",
+    hiddenFromList: false
   }
 };
 var resolveXyTranslate = (params) => ({

package/dist/esm/vignette.mjs

@@ -34,14 +34,16 @@ var colorAmountSchema = {
   max: 1,
   step: 0.01,
   default: DEFAULT_AMOUNT,
-  description: "Amount"
+  description: "Amount",
+  hiddenFromList: false
 };
 var colorMultiplierSchema = {
   type: "number",
   min: 0,
   step: 0.01,
   default: DEFAULT_AMOUNT,
-  description: "Amount"
+  description: "Amount",
+  hiddenFromList: false
 };
 var brightnessAmountSchema = {
   type: "number",
@@ -49,10 +51,11 @@ var brightnessAmountSchema = {
   max: 1,
   step: 0.01,
   default: DEFAULT_BRIGHTNESS_AMOUNT,
-  description: "Amount"
+  description: "Amount",
+  hiddenFromList: false
 };
 var hueDegreesSchema = {
-  type: "number",
+  type: "rotation-degrees",
   step: 1,
   default: DEFAULT_HUE_DEGREES,
   description: "Degrees"
@@ -104,6 +107,7 @@ var DEFAULT_FEATHER = 0.35;
 var DEFAULT_ROUNDNESS = 1;
 var DEFAULT_COLOR = "#000000";
 var DEFAULT_MODE = "color";
+var DEFAULT_CENTER = [0.5, 0.5];
 var vignetteSchema = {
   amount: {
     type: "number",
@@ -111,7 +115,8 @@ var vignetteSchema = {
     max: 1,
     step: 0.01,
     default: DEFAULT_AMOUNT2,
-    description: "Amount"
+    description: "Amount",
+    hiddenFromList: false
   },
   radius: {
     type: "number",
@@ -119,7 +124,8 @@ var vignetteSchema = {
     max: 1,
     step: 0.01,
     default: DEFAULT_RADIUS,
-    description: "Radius"
+    description: "Radius",
+    hiddenFromList: false
   },
   feather: {
     type: "number",
@@ -127,7 +133,8 @@ var vignetteSchema = {
     max: 1,
     step: 0.01,
     default: DEFAULT_FEATHER,
-    description: "Feather"
+    description: "Feather",
+    hiddenFromList: false
   },
   roundness: {
     type: "number",
@@ -135,7 +142,8 @@ var vignetteSchema = {
     max: 1,
     step: 0.01,
     default: DEFAULT_ROUNDNESS,
-    description: "Roundness"
+    description: "Roundness",
+    hiddenFromList: false
   },
   color: {
     type: "color",
@@ -150,6 +158,12 @@ var vignetteSchema = {
       color: {},
       alpha: {}
     }
+  },
+  center: {
+    type: "uv-coordinate",
+    step: 0.01,
+    default: DEFAULT_CENTER,
+    description: "Center"
   }
 };
 var formatEnum = (variants) => {
@@ -172,8 +186,17 @@ var resolve = (p) => ({
   feather: p.feather ?? DEFAULT_FEATHER,
   roundness: p.roundness ?? DEFAULT_ROUNDNESS,
   color: p.color ?? DEFAULT_COLOR,
-  mode: p.mode ?? DEFAULT_MODE
+  mode: p.mode ?? DEFAULT_MODE,
+  center: [...p.center ?? DEFAULT_CENTER]
 });
+var assertOptionalUvCoordinate = (value, name) => {
+  if (value === undefined) {
+    return;
+  }
+  if (!Array.isArray(value) || value.length !== 2 || value.some((item) => typeof item !== "number" || !Number.isFinite(item))) {
+    throw new TypeError(`"${name}" must be a [number, number] tuple`);
+  }
+};
 var validateVignetteParams = (params) => {
   assertEffectParamsObject(params, "Vignette");
   assertOptionalFiniteNumber(params.amount, "amount");
@@ -182,6 +205,7 @@ var validateVignetteParams = (params) => {
   assertOptionalFiniteNumber(params.roundness, "roundness");
   assertOptionalColor(params.color, "color");
   assertOptionalEnum(params.mode, "mode", VIGNETTE_MODES);
+  assertOptionalUvCoordinate(params.center, "center");
   const r = resolve(params);
   validateUnitInterval(r.amount, "amount");
   validateUnitInterval(r.radius, "radius");
@@ -211,9 +235,10 @@ uniform float uFeather;
 uniform float uRoundness;
 uniform vec4 uColor;
 uniform int uMode;
+uniform vec2 uCenter;
 
 float vignetteMask() {
-	vec2 centered = abs(vUv * 2.0 - 1.0);
+	vec2 centered = abs(vUv - uCenter) * 2.0;
 	float rectangleDistance = max(centered.x, centered.y);
 	float ellipseDistance = length(centered);
 	float distanceFromCenter = mix(rectangleDistance, ellipseDistance, uRoundness);
@@ -363,7 +388,8 @@ var setupVignette = (target) => {
       uFeather: gl.getUniformLocation(program, "uFeather"),
       uRoundness: gl.getUniformLocation(program, "uRoundness"),
       uColor: gl.getUniformLocation(program, "uColor"),
-      uMode: gl.getUniformLocation(program, "uMode")
+      uMode: gl.getUniformLocation(program, "uMode"),
+      uCenter: gl.getUniformLocation(program, "uCenter")
     },
     colorCtx,
     cachedColor: "",
@@ -387,7 +413,7 @@ var vignette = createEffect({
   backend: "webgl2",
   calculateKey: (params) => {
     const r = resolve(params);
-    return `vignette-${r.amount}-${r.radius}-${r.feather}-${r.roundness}-${r.color}-${r.mode}`;
+    return `vignette-${r.amount}-${r.radius}-${r.feather}-${r.roundness}-${r.color}-${r.mode}-${r.center.join(":")}`;
   },
   setup: (target) => setupVignette(target),
   apply: ({ source, width, height, params, state, flipSourceY }) => {
@@ -418,6 +444,8 @@ var vignette = createEffect({
       gl.uniform4f(uniforms.uColor, red, green, blue, alpha);
     if (uniforms.uMode)
       gl.uniform1i(uniforms.uMode, r.mode === "alpha" ? 1 : 0);
+    if (uniforms.uCenter)
+      gl.uniform2f(uniforms.uCenter, r.center[0], r.center[1]);
     gl.bindVertexArray(vao);
     gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
     gl.bindVertexArray(null);

package/dist/esm/wave.mjs

@@ -244,7 +244,8 @@ var waveSchema = {
   phase: {
     type: "number",
     default: 0,
-    description: "Phase"
+    description: "Phase",
+    hiddenFromList: false
   },
   direction: {
     type: "enum",
@@ -261,7 +262,8 @@ var waveSchema = {
     max: 500,
     step: 1,
     default: 60,
-    description: "Amplitude"
+    description: "Amplitude",
+    hiddenFromList: false
   },
   wavelength: {
     type: "number",
@@ -269,7 +271,8 @@ var waveSchema = {
     max: 2000,
     step: 1,
     default: 240,
-    description: "Wavelength"
+    description: "Wavelength",
+    hiddenFromList: false
   }
 };
 var resolve = (p) => ({