@remotion/web-renderer 4.0.392 → 4.0.393

package/dist/compose-canvas.js

@@ -1,36 +0,0 @@
-import { setBorderRadius } from './border-radius';
-import { calculateTransforms } from './calculate-transforms';
-import { turnSvgIntoDrawable } from './drawing/compose-svg';
-import { setOpacity } from './drawing/opacity';
-import { setTransform } from './drawing/transform';
-export const composeCanvas = async (canvas, context) => {
-    const { totalMatrix, reset, dimensions, borderRadius, opacity } = calculateTransforms(canvas);
-    if (opacity === 0) {
-        reset();
-        return;
-    }
-    const drawable = canvas instanceof SVGSVGElement
-        ? await turnSvgIntoDrawable(canvas)
-        : canvas;
-    const finishTransform = setTransform({
-        ctx: context,
-        transform: totalMatrix,
-    });
-    const finishBorderRadius = setBorderRadius({
-        ctx: context,
-        x: dimensions.left,
-        y: dimensions.top,
-        width: dimensions.width,
-        height: dimensions.height,
-        borderRadius,
-    });
-    const finishOpacity = setOpacity({
-        ctx: context,
-        opacity,
-    });
-    context.drawImage(drawable, dimensions.left, dimensions.top, dimensions.width, dimensions.height);
-    finishOpacity();
-    finishBorderRadius();
-    finishTransform();
-    reset();
-};

package/dist/compose-svg.d.ts

@@ -1 +0,0 @@
-export declare const turnSvgIntoDrawable: (svg: SVGSVGElement) => Promise<HTMLImageElement>;

package/dist/compose-svg.js

@@ -1,34 +0,0 @@
-export const turnSvgIntoDrawable = (svg) => {
-    const originalTransform = svg.style.transform;
-    const originalTransformOrigin = svg.style.transformOrigin;
-    const originalMarginLeft = svg.style.marginLeft;
-    const originalMarginRight = svg.style.marginRight;
-    const originalMarginTop = svg.style.marginTop;
-    const originalMarginBottom = svg.style.marginBottom;
-    svg.style.transform = 'none';
-    svg.style.transformOrigin = '';
-    // Margins were already included in the positioning calculation,
-    // so we need to remove them to avoid double counting.
-    svg.style.marginLeft = '0';
-    svg.style.marginRight = '0';
-    svg.style.marginTop = '0';
-    svg.style.marginBottom = '0';
-    const svgData = new XMLSerializer().serializeToString(svg);
-    svg.style.marginLeft = originalMarginLeft;
-    svg.style.marginRight = originalMarginRight;
-    svg.style.marginTop = originalMarginTop;
-    svg.style.marginBottom = originalMarginBottom;
-    svg.style.transform = originalTransform;
-    svg.style.transformOrigin = originalTransformOrigin;
-    return new Promise((resolve, reject) => {
-        const image = new Image();
-        const url = `data:image/svg+xml;base64,${btoa(svgData)}`;
-        image.onload = function () {
-            resolve(image);
-        };
-        image.onerror = () => {
-            reject(new Error('Failed to convert SVG to image'));
-        };
-        image.src = url;
-    });
-};

package/dist/drawing/compose-canvas.d.ts

@@ -1 +0,0 @@
-export declare const drawElementToCanvas: (canvas: HTMLCanvasElement | HTMLImageElement | SVGSVGElement, context: OffscreenCanvasRenderingContext2D) => Promise<void>;

package/dist/drawing/compose-canvas.js

@@ -1,36 +0,0 @@
-import { setBorderRadius } from './border-radius';
-import { calculateTransforms } from './calculate-transforms';
-import { turnSvgIntoDrawable } from './compose-svg';
-import { setOpacity } from './opacity';
-import { setTransform } from './transform';
-export const drawElementToCanvas = async (canvas, context) => {
-    const { totalMatrix, reset, dimensions, borderRadius, opacity } = calculateTransforms(canvas);
-    if (opacity === 0) {
-        reset();
-        return;
-    }
-    const drawable = canvas instanceof SVGSVGElement
-        ? await turnSvgIntoDrawable(canvas)
-        : canvas;
-    const finishTransform = setTransform({
-        ctx: context,
-        transform: totalMatrix,
-    });
-    const finishBorderRadius = setBorderRadius({
-        ctx: context,
-        x: dimensions.left,
-        y: dimensions.top,
-        width: dimensions.width,
-        height: dimensions.height,
-        borderRadius,
-    });
-    const finishOpacity = setOpacity({
-        ctx: context,
-        opacity,
-    });
-    context.drawImage(drawable, dimensions.left, dimensions.top, dimensions.width, dimensions.height);
-    finishOpacity();
-    finishBorderRadius();
-    finishTransform();
-    reset();
-};

package/dist/drawing/compose-svg.d.ts

@@ -1 +0,0 @@
-export declare const turnSvgIntoDrawable: (svg: SVGSVGElement) => Promise<HTMLImageElement>;

package/dist/drawing/compose-svg.js

@@ -1,34 +0,0 @@
-export const turnSvgIntoDrawable = (svg) => {
-    const originalTransform = svg.style.transform;
-    const originalTransformOrigin = svg.style.transformOrigin;
-    const originalMarginLeft = svg.style.marginLeft;
-    const originalMarginRight = svg.style.marginRight;
-    const originalMarginTop = svg.style.marginTop;
-    const originalMarginBottom = svg.style.marginBottom;
-    svg.style.transform = 'none';
-    svg.style.transformOrigin = '';
-    // Margins were already included in the positioning calculation,
-    // so we need to remove them to avoid double counting.
-    svg.style.marginLeft = '0';
-    svg.style.marginRight = '0';
-    svg.style.marginTop = '0';
-    svg.style.marginBottom = '0';
-    const svgData = new XMLSerializer().serializeToString(svg);
-    svg.style.marginLeft = originalMarginLeft;
-    svg.style.marginRight = originalMarginRight;
-    svg.style.marginTop = originalMarginTop;
-    svg.style.marginBottom = originalMarginBottom;
-    svg.style.transform = originalTransform;
-    svg.style.transformOrigin = originalTransformOrigin;
-    return new Promise((resolve, reject) => {
-        const image = new Image();
-        const url = `data:image/svg+xml;base64,${btoa(svgData)}`;
-        image.onload = function () {
-            resolve(image);
-        };
-        image.onerror = () => {
-            reject(new Error('Failed to convert SVG to image'));
-        };
-        image.src = url;
-    });
-};

package/dist/drawing/compose.d.ts

@@ -1,5 +0,0 @@
-import type { Composable } from '../composable';
-export declare const compose: ({ composables, context, }: {
-    composables: Composable[];
-    context: OffscreenCanvasRenderingContext2D;
-}) => Promise<void>;

package/dist/drawing/compose.js

@@ -1,6 +0,0 @@
-import { drawElementToCanvas } from './draw-element-to-canvas';
-export const compose = async ({ composables, context, }) => {
-    for (const composable of composables) {
-        await drawElementToCanvas(composable.element, context);
-    }
-};

package/dist/drawing/get-computed-style-cache.js

@@ -1 +0,0 @@
-"use strict";

package/dist/find-canvas-elements.d.ts

@@ -1 +0,0 @@
-export declare const findCanvasElements: (element: HTMLDivElement) => HTMLCanvasElement[];

package/dist/find-canvas-elements.js

@@ -1,13 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.findCanvasElements = void 0;
-const findCanvasElements = (element) => {
-    const canvasElements = element.querySelectorAll('canvas');
-    const composables = [];
-    Array.from(canvasElements).forEach((canvasElement) => {
-        const canvas = canvasElement;
-        composables.push(canvas);
-    });
-    return composables;
-};
-exports.findCanvasElements = findCanvasElements;

package/dist/find-capturable-elements.d.ts

@@ -1,2 +0,0 @@
-import type { Composable } from './composable';
-export declare const findCapturableElements: (element: HTMLDivElement, context: OffscreenCanvasRenderingContext2D) => Promise<Composable[]>;

package/dist/find-capturable-elements.js

@@ -1,26 +0,0 @@
-import { drawElementToCanvas } from './drawing/draw-element-to-canvas';
-export const findCapturableElements = async (element, context) => {
-    const treeWalker = document.createTreeWalker(element, NodeFilter.SHOW_ELEMENT | NodeFilter.SHOW_TEXT, (node) => {
-        if (node instanceof Element) {
-            const computedStyle = getComputedStyle(node);
-            return computedStyle.display === 'none'
-                ? NodeFilter.FILTER_REJECT
-                : NodeFilter.FILTER_ACCEPT;
-        }
-        return NodeFilter.FILTER_ACCEPT;
-    });
-    const composables = [];
-    while (treeWalker.nextNode()) {
-        const node = treeWalker.currentNode;
-        if (node instanceof HTMLCanvasElement ||
-            node instanceof SVGSVGElement ||
-            node instanceof HTMLImageElement) {
-            await drawElementToCanvas(node, context);
-            composables.push({
-                type: 'element',
-                element: node,
-            });
-        }
-    }
-    return composables;
-};

package/dist/opacity.d.ts

@@ -1,4 +0,0 @@
-export declare const setOpacity: ({ ctx, opacity, }: {
-    ctx: OffscreenCanvasRenderingContext2D;
-    opacity: number;
-}) => () => void;

package/dist/opacity.js

@@ -1,7 +0,0 @@
-export const setOpacity = ({ ctx, opacity, }) => {
-    const previousAlpha = ctx.globalAlpha;
-    ctx.globalAlpha = opacity;
-    return () => {
-        ctx.globalAlpha = previousAlpha;
-    };
-};

package/dist/parse-transform-origin.d.ts

@@ -1,4 +0,0 @@
-export declare const parseTransformOrigin: (transformOrigin: string) => {
-    x: number;
-    y: number;
-} | null;

package/dist/parse-transform-origin.js

@@ -1,7 +0,0 @@
-export const parseTransformOrigin = (transformOrigin) => {
-    if (transformOrigin.trim() === '') {
-        return null;
-    }
-    const [x, y] = transformOrigin.split(' ');
-    return { x: parseFloat(x), y: parseFloat(y) };
-};

package/dist/transform.d.ts

@@ -1,4 +0,0 @@
-export declare const setTransform: ({ ctx, transform, }: {
-    ctx: OffscreenCanvasRenderingContext2D;
-    transform: DOMMatrix;
-}) => () => void;

package/dist/transform.js

@@ -1,6 +0,0 @@
-export const setTransform = ({ ctx, transform, }) => {
-    ctx.setTransform(transform);
-    return () => {
-        ctx.setTransform(new DOMMatrix());
-    };
-};