@remotion/transitions 4.0.522 → 4.0.523

package/dist/esm/index.mjs

@@ -334,9 +334,275 @@ var uploadElementImage = (gl, elementImage) => {
   gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, elementImage);
 };
 
+// src/presentations/blur-slide.tsx
+var DEFAULT_DIRECTION = "from-left";
+var DEFAULT_BLUR = 0.5;
+var VALID_DIRECTIONS = [
+  "from-left",
+  "from-right",
+  "from-top",
+  "from-bottom"
+];
+var VERTEX_SHADER = `#version 300 es
+in vec2 a_pos;
+out vec2 v_uv;
+void main() {
+	v_uv = vec2(a_pos.x * 0.5 + 0.5, 0.5 - a_pos.y * 0.5);
+	gl_Position = vec4(a_pos, 0.0, 1.0);
+}`;
+var SAMPLES = 32;
+var SLIDE_FRAGMENT_SHADER = `#version 300 es
+precision highp float;
+
+uniform sampler2D u_prev;
+uniform sampler2D u_next;
+uniform float u_progress;
+uniform vec2 u_direction;
+uniform float u_blur_length;
+
+in vec2 v_uv;
+out vec4 outColor;
+
+const int SAMPLES = ${SAMPLES};
+
+void main() {
+	// Both scenes travel together; the exiting scene wraps around the edges
+	// while the entering scene takes over through a crossfade in the middle.
+	vec2 slidUv = v_uv - u_direction * u_progress;
+	float mixFactor = smoothstep(0.3, 0.7, u_progress);
+
+	vec4 color = vec4(0.0);
+	for (int i = 0; i < SAMPLES; i++) {
+		float t = (float(i) / float(SAMPLES - 1) - 0.5) * u_blur_length;
+		vec2 uv = slidUv + u_direction * t;
+		color += mix(texture(u_prev, uv), texture(u_next, uv), mixFactor);
+	}
+
+	outColor = color / float(SAMPLES);
+}`;
+var BLUR_FRAGMENT_SHADER = `#version 300 es
+precision highp float;
+
+uniform sampler2D u_source;
+uniform vec2 u_direction;
+uniform float u_blur_length;
+
+in vec2 v_uv;
+out vec4 outColor;
+
+const int SAMPLES = ${SAMPLES};
+
+void main() {
+	vec4 color = vec4(0.0);
+	for (int i = 0; i < SAMPLES; i++) {
+		float t = ((float(i) + 0.5) / float(SAMPLES) - 0.5) * u_blur_length;
+		vec2 uv = v_uv + u_direction * t;
+		// The framebuffer texture is stored bottom-up, so flip Y when sampling it.
+		color += texture(u_source, vec2(uv.x, 1.0 - uv.y));
+	}
+
+	outColor = color / float(SAMPLES);
+}`;
+var compileShader = (gl, source, type) => {
+  const shader = gl.createShader(type);
+  if (!shader) {
+    throw new Error("Failed to create shader");
+  }
+  gl.shaderSource(shader, source);
+  gl.compileShader(shader);
+  if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
+    const log = gl.getShaderInfoLog(shader);
+    gl.deleteShader(shader);
+    throw new Error(`Failed to compile shader: ${log}`);
+  }
+  return shader;
+};
+var createProgram = (gl, fragmentShader) => {
+  const program = gl.createProgram();
+  if (!program) {
+    throw new Error("Failed to create WebGL program");
+  }
+  const vs = compileShader(gl, VERTEX_SHADER, gl.VERTEX_SHADER);
+  const fs = compileShader(gl, fragmentShader, gl.FRAGMENT_SHADER);
+  gl.attachShader(program, vs);
+  gl.attachShader(program, fs);
+  gl.linkProgram(program);
+  if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
+    const log = gl.getProgramInfoLog(program);
+    gl.deleteProgram(program);
+    throw new Error(`Failed to link program: ${log}`);
+  }
+  return program;
+};
+var createTexture = (gl) => {
+  const tex = gl.createTexture();
+  if (!tex) {
+    throw new Error("Failed to create texture");
+  }
+  gl.bindTexture(gl.TEXTURE_2D, tex);
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.REPEAT);
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.REPEAT);
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
+  gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 1, 1, 0, gl.RGBA, gl.UNSIGNED_BYTE, new Uint8Array([0, 0, 0, 0]));
+  return tex;
+};
+var getDirectionVector = (direction) => {
+  switch (direction) {
+    case "from-left":
+      return [1, 0];
+    case "from-right":
+      return [-1, 0];
+    case "from-top":
+      return [0, 1];
+    case "from-bottom":
+      return [0, -1];
+    default:
+      throw new Error(`Invalid direction: ${direction}`);
+  }
+};
+var validateProps = (props) => {
+  const direction = props.direction ?? DEFAULT_DIRECTION;
+  const blur = props.blur ?? DEFAULT_BLUR;
+  if (!VALID_DIRECTIONS.includes(direction)) {
+    throw new TypeError(`direction passed to blurSlide() must be one of ${VALID_DIRECTIONS.map((d) => `"${d}"`).join(", ")}, received ${JSON.stringify(direction)}`);
+  }
+  if (typeof blur !== "number" || !Number.isFinite(blur)) {
+    throw new TypeError(`blur passed to blurSlide() must be a finite number, received ${blur}`);
+  }
+  if (blur < 0) {
+    throw new TypeError(`blur passed to blurSlide() must be greater than or equal to 0, received ${blur}`);
+  }
+};
+var blurSlideShader = (canvas) => {
+  const gl = canvas.getContext("webgl2", { premultipliedAlpha: true });
+  if (!gl) {
+    throw new Error("Failed to create WebGL2 context");
+  }
+  const slideProgram = createProgram(gl, SLIDE_FRAGMENT_SHADER);
+  const blurProgram = createProgram(gl, BLUR_FRAGMENT_SHADER);
+  const prevTex = createTexture(gl);
+  const nextTex = createTexture(gl);
+  const intermediateTex = createTexture(gl);
+  const framebuffer = gl.createFramebuffer();
+  if (!framebuffer) {
+    throw new Error("Failed to create framebuffer");
+  }
+  gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
+  gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, intermediateTex, 0);
+  gl.bindFramebuffer(gl.FRAMEBUFFER, null);
+  let intermediateWidth = 1;
+  let intermediateHeight = 1;
+  const vao = gl.createVertexArray();
+  gl.bindVertexArray(vao);
+  const buffer = gl.createBuffer();
+  gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
+  gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([-1, -1, 1, -1, -1, 1, 1, 1]), gl.STATIC_DRAW);
+  const aPos = gl.getAttribLocation(slideProgram, "a_pos");
+  gl.enableVertexAttribArray(aPos);
+  gl.vertexAttribPointer(aPos, 2, gl.FLOAT, false, 0, 0);
+  const uPrev = gl.getUniformLocation(slideProgram, "u_prev");
+  const uNext = gl.getUniformLocation(slideProgram, "u_next");
+  const uProgress = gl.getUniformLocation(slideProgram, "u_progress");
+  const uSlideDirection = gl.getUniformLocation(slideProgram, "u_direction");
+  const uSlideBlurLength = gl.getUniformLocation(slideProgram, "u_blur_length");
+  const uSource = gl.getUniformLocation(blurProgram, "u_source");
+  const uBlurDirection = gl.getUniformLocation(blurProgram, "u_direction");
+  const uBlurBlurLength = gl.getUniformLocation(blurProgram, "u_blur_length");
+  const cleanup = () => {
+    gl.deleteProgram(slideProgram);
+    gl.deleteProgram(blurProgram);
+    gl.deleteTexture(prevTex);
+    gl.deleteTexture(nextTex);
+    gl.deleteTexture(intermediateTex);
+    gl.deleteFramebuffer(framebuffer);
+    gl.deleteBuffer(buffer);
+    gl.deleteVertexArray(vao);
+  };
+  const clear = () => {
+    gl.bindFramebuffer(gl.FRAMEBUFFER, null);
+    gl.clearColor(0, 0, 0, 0);
+    gl.clear(gl.COLOR_BUFFER_BIT);
+  };
+  const draw = ({
+    prevImage,
+    nextImage,
+    width,
+    height,
+    time,
+    passedProps
+  }) => {
+    const { direction = DEFAULT_DIRECTION, blur = DEFAULT_BLUR } = passedProps;
+    if (!prevImage && !nextImage) {
+      return;
+    }
+    if (prevImage && (prevImage.width === 0 || prevImage.height === 0)) {
+      return;
+    }
+    if (nextImage && (nextImage.width === 0 || nextImage.height === 0)) {
+      return;
+    }
+    const effectiveTime = !prevImage ? 0 : !nextImage ? 1 : time;
+    const p = 1 - effectiveTime;
+    const progress = p * p * p * (p * (p * 6 - 15) + 10);
+    const blurLength = blur * 2 * Math.min(progress, 1 - progress);
+    const coarseTapSpacing = blurLength / (SAMPLES - 1);
+    const [dirX, dirY] = getDirectionVector(direction);
+    gl.bindVertexArray(vao);
+    if (intermediateWidth !== width || intermediateHeight !== height) {
+      gl.bindTexture(gl.TEXTURE_2D, intermediateTex);
+      gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
+      intermediateWidth = width;
+      intermediateHeight = height;
+    }
+    gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
+    gl.viewport(0, 0, width, height);
+    gl.clearColor(0, 0, 0, 0);
+    gl.clear(gl.COLOR_BUFFER_BIT);
+    gl.useProgram(slideProgram);
+    gl.activeTexture(gl.TEXTURE0);
+    gl.bindTexture(gl.TEXTURE_2D, prevTex);
+    if (prevImage) {
+      uploadElementImage(gl, prevImage);
+    }
+    gl.uniform1i(uPrev, 0);
+    gl.activeTexture(gl.TEXTURE1);
+    gl.bindTexture(gl.TEXTURE_2D, nextTex);
+    if (nextImage) {
+      uploadElementImage(gl, nextImage);
+    }
+    gl.uniform1i(uNext, 1);
+    gl.uniform1f(uProgress, progress);
+    gl.uniform2f(uSlideDirection, dirX, dirY);
+    gl.uniform1f(uSlideBlurLength, blurLength);
+    gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
+    gl.bindFramebuffer(gl.FRAMEBUFFER, null);
+    gl.viewport(0, 0, width, height);
+    gl.clearColor(0, 0, 0, 0);
+    gl.clear(gl.COLOR_BUFFER_BIT);
+    gl.useProgram(blurProgram);
+    gl.activeTexture(gl.TEXTURE0);
+    gl.bindTexture(gl.TEXTURE_2D, intermediateTex);
+    gl.uniform1i(uSource, 0);
+    gl.uniform2f(uBlurDirection, dirX, dirY);
+    gl.uniform1f(uBlurBlurLength, coarseTapSpacing);
+    gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
+  };
+  return {
+    clear,
+    cleanup,
+    draw
+  };
+};
+var makeBlurSlide = makeHtmlInCanvasPresentation(blurSlideShader);
+var blurSlide = (props = {}) => {
+  validateProps(props);
+  return makeBlurSlide(props);
+};
+
 // src/presentations/cross-zoom.tsx
 var DEFAULT_STRENGTH = 0.4;
-var VERTEX_SHADER = `#version 300 es
+var VERTEX_SHADER2 = `#version 300 es
 in vec2 a_pos;
 out vec2 v_uv;
 void main() {
@@ -413,7 +679,7 @@ void main() {
 	float progress = 1.0 - u_time;
 	outColor = transition(v_uv, progress);
 }`;
-var compileShader = (gl, source, type) => {
+var compileShader2 = (gl, source, type) => {
   const shader = gl.createShader(type);
   if (!shader) {
     throw new Error("Failed to create shader");
@@ -427,13 +693,13 @@ var compileShader = (gl, source, type) => {
   }
   return shader;
 };
-var createProgram = (gl) => {
+var createProgram2 = (gl) => {
   const program = gl.createProgram();
   if (!program) {
     throw new Error("Failed to create WebGL program");
   }
-  const vs = compileShader(gl, VERTEX_SHADER, gl.VERTEX_SHADER);
-  const fs = compileShader(gl, FRAGMENT_SHADER, gl.FRAGMENT_SHADER);
+  const vs = compileShader2(gl, VERTEX_SHADER2, gl.VERTEX_SHADER);
+  const fs = compileShader2(gl, FRAGMENT_SHADER, gl.FRAGMENT_SHADER);
   gl.attachShader(program, vs);
   gl.attachShader(program, fs);
   gl.linkProgram(program);
@@ -444,7 +710,7 @@ var createProgram = (gl) => {
   }
   return program;
 };
-var createTexture = (gl) => {
+var createTexture2 = (gl) => {
   const tex = gl.createTexture();
   if (!tex) {
     throw new Error("Failed to create texture");
@@ -462,9 +728,9 @@ var crossZoomShader = (canvas) => {
   if (!gl) {
     throw new Error("Failed to create WebGL2 context");
   }
-  const program = createProgram(gl);
-  const prevTex = createTexture(gl);
-  const nextTex = createTexture(gl);
+  const program = createProgram2(gl);
+  const prevTex = createTexture2(gl);
+  const nextTex = createTexture2(gl);
   const vao = gl.createVertexArray();
   gl.bindVertexArray(vao);
   const buffer = gl.createBuffer();
@@ -536,7 +802,7 @@ var crossZoom = makeHtmlInCanvasPresentation(crossZoomShader);
 // src/presentations/dreamy-zoom.tsx
 var DEFAULT_ROTATION = 6;
 var DEFAULT_SCALE = 1.2;
-var VERTEX_SHADER2 = `#version 300 es
+var VERTEX_SHADER3 = `#version 300 es
 in vec2 a_pos;
 out vec2 v_uv;
 void main() {
@@ -579,7 +845,7 @@ void main() {
 	float progress = 1.0 - u_time;
 	outColor = transition(v_uv, progress);
 }`;
-var compileShader2 = (gl, source, type) => {
+var compileShader3 = (gl, source, type) => {
   const shader = gl.createShader(type);
   if (!shader) {
     throw new Error("Failed to create shader");
@@ -593,13 +859,13 @@ var compileShader2 = (gl, source, type) => {
   }
   return shader;
 };
-var createProgram2 = (gl) => {
+var createProgram3 = (gl) => {
   const program = gl.createProgram();
   if (!program) {
     throw new Error("Failed to create WebGL program");
   }
-  const vs = compileShader2(gl, VERTEX_SHADER2, gl.VERTEX_SHADER);
-  const fs = compileShader2(gl, FRAGMENT_SHADER2, gl.FRAGMENT_SHADER);
+  const vs = compileShader3(gl, VERTEX_SHADER3, gl.VERTEX_SHADER);
+  const fs = compileShader3(gl, FRAGMENT_SHADER2, gl.FRAGMENT_SHADER);
   gl.attachShader(program, vs);
   gl.attachShader(program, fs);
   gl.linkProgram(program);
@@ -610,7 +876,7 @@ var createProgram2 = (gl) => {
   }
   return program;
 };
-var createTexture2 = (gl) => {
+var createTexture3 = (gl) => {
   const tex = gl.createTexture();
   if (!tex) {
     throw new Error("Failed to create texture");
@@ -628,9 +894,9 @@ var dreamyZoomShader = (canvas) => {
   if (!gl) {
     throw new Error("Failed to create WebGL2 context");
   }
-  const program = createProgram2(gl);
-  const prevTex = createTexture2(gl);
-  const nextTex = createTexture2(gl);
+  const program = createProgram3(gl);
+  const prevTex = createTexture3(gl);
+  const nextTex = createTexture3(gl);
   const vao = gl.createVertexArray();
   gl.bindVertexArray(vao);
   const buffer = gl.createBuffer();
@@ -705,7 +971,7 @@ var dreamyZoom = makeHtmlInCanvasPresentation(dreamyZoomShader);
 
 // src/presentations/film-burn.tsx
 var DEFAULT_SEED = 2.31;
-var VERTEX_SHADER3 = `#version 300 es
+var VERTEX_SHADER4 = `#version 300 es
 in vec2 a_pos;
 out vec2 v_uv;
 void main() {
@@ -848,7 +1114,7 @@ void main() {
 	float progress = 1.0 - u_time;
 	outColor = transition(v_uv, progress);
 }`;
-var compileShader3 = (gl, source, type) => {
+var compileShader4 = (gl, source, type) => {
   const shader = gl.createShader(type);
   if (!shader) {
     throw new Error("Failed to create shader");
@@ -862,13 +1128,13 @@ var compileShader3 = (gl, source, type) => {
   }
   return shader;
 };
-var createProgram3 = (gl) => {
+var createProgram4 = (gl) => {
   const program = gl.createProgram();
   if (!program) {
     throw new Error("Failed to create WebGL program");
   }
-  const vs = compileShader3(gl, VERTEX_SHADER3, gl.VERTEX_SHADER);
-  const fs = compileShader3(gl, FRAGMENT_SHADER3, gl.FRAGMENT_SHADER);
+  const vs = compileShader4(gl, VERTEX_SHADER4, gl.VERTEX_SHADER);
+  const fs = compileShader4(gl, FRAGMENT_SHADER3, gl.FRAGMENT_SHADER);
   gl.attachShader(program, vs);
   gl.attachShader(program, fs);
   gl.linkProgram(program);
@@ -879,7 +1145,7 @@ var createProgram3 = (gl) => {
   }
   return program;
 };
-var createTexture3 = (gl) => {
+var createTexture4 = (gl) => {
   const tex = gl.createTexture();
   if (!tex) {
     throw new Error("Failed to create texture");
@@ -897,9 +1163,9 @@ var filmBurnShader = (canvas) => {
   if (!gl) {
     throw new Error("Failed to create WebGL2 context");
   }
-  const program = createProgram3(gl);
-  const prevTex = createTexture3(gl);
-  const nextTex = createTexture3(gl);
+  const program = createProgram4(gl);
+  const prevTex = createTexture4(gl);
+  const nextTex = createTexture4(gl);
   const vao = gl.createVertexArray();
   gl.bindVertexArray(vao);
   const buffer = gl.createBuffer();
@@ -969,7 +1235,7 @@ var filmBurnShader = (canvas) => {
 var filmBurn = makeHtmlInCanvasPresentation(filmBurnShader);
 
 // src/presentations/linear-blur.tsx
-var VERTEX_SHADER4 = `#version 300 es
+var VERTEX_SHADER5 = `#version 300 es
 in vec2 a_pos;
 out vec2 v_uv;
 void main() {
@@ -1013,7 +1279,7 @@ void main() {
 	float progress = 1.0 - u_time;
 	outColor = transition(v_uv, progress);
 }`;
-var compileShader4 = (gl, source, type) => {
+var compileShader5 = (gl, source, type) => {
   const shader = gl.createShader(type);
   if (!shader) {
     throw new Error("Failed to create shader");
@@ -1027,13 +1293,13 @@ var compileShader4 = (gl, source, type) => {
   }
   return shader;
 };
-var createProgram4 = (gl) => {
+var createProgram5 = (gl) => {
   const program = gl.createProgram();
   if (!program) {
     throw new Error("Failed to create WebGL program");
   }
-  const vs = compileShader4(gl, VERTEX_SHADER4, gl.VERTEX_SHADER);
-  const fs = compileShader4(gl, FRAGMENT_SHADER4, gl.FRAGMENT_SHADER);
+  const vs = compileShader5(gl, VERTEX_SHADER5, gl.VERTEX_SHADER);
+  const fs = compileShader5(gl, FRAGMENT_SHADER4, gl.FRAGMENT_SHADER);
   gl.attachShader(program, vs);
   gl.attachShader(program, fs);
   gl.linkProgram(program);
@@ -1044,7 +1310,7 @@ var createProgram4 = (gl) => {
   }
   return program;
 };
-var createTexture4 = (gl) => {
+var createTexture5 = (gl) => {
   const tex = gl.createTexture();
   if (!tex) {
     throw new Error("Failed to create texture");
@@ -1062,9 +1328,9 @@ var linearBlurShader = (canvas) => {
   if (!gl) {
     throw new Error("Failed to create WebGL2 context");
   }
-  const program = createProgram4(gl);
-  const prevTex = createTexture4(gl);
-  const nextTex = createTexture4(gl);
+  const program = createProgram5(gl);
+  const prevTex = createTexture5(gl);
+  const nextTex = createTexture5(gl);
   const vao = gl.createVertexArray();
   gl.bindVertexArray(vao);
   const buffer = gl.createBuffer();
@@ -1146,7 +1412,7 @@ var validateFiniteNumber = (name, value) => {
     throw new TypeError(`${name} passed to pushCut() must be finite, received ${value}`);
   }
 };
-var validateProps = (props) => {
+var validateProps2 = (props) => {
   const cutProgress = props.cutProgress ?? 5 / 11;
   const outgoingScale = props.outgoingScale ?? 1.04;
   const incomingStartScale = props.incomingStartScale ?? 1.04;
@@ -1250,7 +1516,7 @@ var PushCutPresentation = ({
 };
 var pushCut = (props) => {
   const passedProps = props ?? {};
-  validateProps(passedProps);
+  validateProps2(passedProps);
   return {
     component: PushCutPresentation,
     props: passedProps
@@ -1880,5 +2146,6 @@ export {
   filmBurn,
   dreamyZoom,
   crossZoom,
+  blurSlide,
   TransitionSeries
 };

package/dist/index.d.ts

@@ -6,6 +6,8 @@ export { useTransitionProgress } from './use-transition-progress.js';
 export type { TransitionState } from './use-transition-progress.js';
 export { makeHtmlInCanvasPresentation } from './html-in-canvas-presentation.js';
 export type { HtmlInCanvasShader, HtmlInCanvasShaderDraw, HtmlInCanvasShaderDrawParams, } from './html-in-canvas-presentation.js';
+export { blurSlide } from './presentations/blur-slide.js';
+export type { BlurSlideDirection, BlurSlideProps, } from './presentations/blur-slide.js';
 export { crossZoom } from './presentations/cross-zoom.js';
 export type { CrossZoomProps } from './presentations/cross-zoom.js';
 export { dreamyZoom } from './presentations/dreamy-zoom.js';

package/dist/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.pushCut = exports.linearBlur = exports.filmBurn = exports.dreamyZoom = exports.crossZoom = exports.makeHtmlInCanvasPresentation = exports.useTransitionProgress = exports.TransitionSeries = exports.springTiming = exports.linearTiming = void 0;
+exports.pushCut = exports.linearBlur = exports.filmBurn = exports.dreamyZoom = exports.crossZoom = exports.blurSlide = exports.makeHtmlInCanvasPresentation = exports.useTransitionProgress = exports.TransitionSeries = exports.springTiming = exports.linearTiming = void 0;
 // Timings
 const linear_timing_js_1 = require("./timings/linear-timing.js");
 Object.defineProperty(exports, "linearTiming", { enumerable: true, get: function () { return linear_timing_js_1.linearTiming; } });
@@ -15,6 +15,8 @@ Object.defineProperty(exports, "useTransitionProgress", { enumerable: true, get:
 // HTML-in-canvas
 const html_in_canvas_presentation_js_1 = require("./html-in-canvas-presentation.js");
 Object.defineProperty(exports, "makeHtmlInCanvasPresentation", { enumerable: true, get: function () { return html_in_canvas_presentation_js_1.makeHtmlInCanvasPresentation; } });
+const blur_slide_js_1 = require("./presentations/blur-slide.js");
+Object.defineProperty(exports, "blurSlide", { enumerable: true, get: function () { return blur_slide_js_1.blurSlide; } });
 const cross_zoom_js_1 = require("./presentations/cross-zoom.js");
 Object.defineProperty(exports, "crossZoom", { enumerable: true, get: function () { return cross_zoom_js_1.crossZoom; } });
 const dreamy_zoom_js_1 = require("./presentations/dreamy-zoom.js");

package/dist/presentations/blur-slide.d.ts

@@ -0,0 +1,18 @@
+import type { EffectsProp } from 'remotion';
+import type { TransitionPresentation } from '../types';
+import type { SlideDirection } from './slide';
+export type BlurSlideDirection = SlideDirection;
+export type BlurSlideProps = {
+    direction?: BlurSlideDirection;
+    blur?: number;
+};
+export declare const blurSlideShader: (canvas: OffscreenCanvas) => {
+    clear: () => void;
+    cleanup: () => void;
+    draw: import("..").HtmlInCanvasShaderDraw<BlurSlideProps>;
+};
+export declare const blurSlide: (props?: BlurSlideProps & {
+    effects?: EffectsProp | undefined;
+}) => TransitionPresentation<BlurSlideProps & {
+    effects?: EffectsProp | undefined;
+}>;