@remotion/web-renderer 4.0.430 → 4.0.432

package/dist/drawing/precompose.js

@@ -1,14 +0,0 @@
-import { compose } from '../compose';
-export const precomposeDOMElement = async ({ boundingRect, element, logLevel, internalState, }) => {
-    const tempCanvas = new OffscreenCanvas(boundingRect.width, boundingRect.height);
-    const tempContext = tempCanvas.getContext('2d');
-    await compose({
-        element,
-        context: tempContext,
-        logLevel,
-        parentRect: boundingRect,
-        internalState,
-        onlyBackgroundClip: false,
-    });
-    return { tempCanvas, tempContext };
-};

package/dist/drawing/process-node.js

@@ -1,122 +0,0 @@
-import { Internals } from 'remotion';
-import { calculateTransforms } from './calculate-transforms';
-import { getWiderRectAndExpand } from './clamp-rect-to-parent-bounds';
-import { doRectsIntersect } from './do-rects-intersect';
-import { drawElement } from './draw-element';
-import { getPrecomposeRectFor3DTransform, handle3dTransform, } from './handle-3d-transform';
-import { getPrecomposeRectForMask, handleMask } from './handle-mask';
-import { precomposeDOMElement } from './precompose';
-import { roundToExpandRect } from './round-to-expand-rect';
-import { transformDOMRect } from './transform-rect-with-matrix';
-export const processNode = async ({ element, context, draw, logLevel, parentRect, internalState, rootElement, }) => {
-    const { totalMatrix, reset, dimensions, opacity, computedStyle, precompositing, } = calculateTransforms({
-        element,
-        rootElement,
-    });
-    if (opacity === 0) {
-        reset();
-        return { type: 'skip-children' };
-    }
-    // When backfaceVisibility is 'hidden', don't render if the element is rotated
-    // to show its backface. The backface is visible when the z-component of the
-    // transformed normal vector (0, 0, 1) is negative, which corresponds to m33 < 0.
-    if (computedStyle.backfaceVisibility === 'hidden' && totalMatrix.m33 < 0) {
-        reset();
-        return { type: 'skip-children' };
-    }
-    if (dimensions.width <= 0 || dimensions.height <= 0) {
-        reset();
-        return { type: 'continue', cleanupAfterChildren: null };
-    }
-    const rect = new DOMRect(dimensions.left - parentRect.x, dimensions.top - parentRect.y, dimensions.width, dimensions.height);
-    if (precompositing.needsPrecompositing) {
-        const start = Date.now();
-        let precomposeRect = null;
-        if (precompositing.needsMaskImage) {
-            precomposeRect = getWiderRectAndExpand({
-                firstRect: precomposeRect,
-                secondRect: getPrecomposeRectForMask(element),
-            });
-        }
-        if (precompositing.needs3DTransformViaWebGL) {
-            precomposeRect = getWiderRectAndExpand({
-                firstRect: precomposeRect,
-                secondRect: getPrecomposeRectFor3DTransform({
-                    element,
-                    parentRect,
-                    matrix: totalMatrix,
-                }),
-            });
-        }
-        if (!precomposeRect) {
-            throw new Error('Precompose rect not found');
-        }
-        if (precomposeRect.width <= 0 || precomposeRect.height <= 0) {
-            return { type: 'continue', cleanupAfterChildren: null };
-        }
-        if (!doRectsIntersect(precomposeRect, parentRect)) {
-            return { type: 'continue', cleanupAfterChildren: null };
-        }
-        const { tempCanvas, tempContext } = await precomposeDOMElement({
-            boundingRect: precomposeRect,
-            element,
-            logLevel,
-            internalState,
-        });
-        let drawable = tempCanvas;
-        const rectAfterTransforms = roundToExpandRect(transformDOMRect({
-            rect: precomposeRect,
-            matrix: totalMatrix,
-        }));
-        if (precompositing.needsMaskImage) {
-            handleMask({
-                gradientInfo: precompositing.needsMaskImage,
-                rect,
-                precomposeRect,
-                tempContext,
-            });
-        }
-        if (precompositing.needs3DTransformViaWebGL) {
-            const t = handle3dTransform({
-                matrix: totalMatrix,
-                precomposeRect,
-                tempCanvas: drawable,
-                rectAfterTransforms,
-                internalState,
-            });
-            if (t) {
-                drawable = t;
-            }
-        }
-        const previousTransform = context.getTransform();
-        if (drawable) {
-            context.setTransform(new DOMMatrix());
-            context.drawImage(drawable, 0, drawable.height - rectAfterTransforms.height, rectAfterTransforms.width, rectAfterTransforms.height, rectAfterTransforms.left - parentRect.x, rectAfterTransforms.top - parentRect.y, rectAfterTransforms.width, rectAfterTransforms.height);
-            context.setTransform(previousTransform);
-            Internals.Log.trace({
-                logLevel,
-                tag: '@remotion/web-renderer',
-            }, `Transforming element in 3D - canvas size: ${precomposeRect.width}x${precomposeRect.height} - compose: ${Date.now() - start}ms`);
-            internalState.addPrecompose({
-                canvasWidth: precomposeRect.width,
-                canvasHeight: precomposeRect.height,
-            });
-        }
-        reset();
-        return { type: 'skip-children' };
-    }
-    const { cleanupAfterChildren } = await drawElement({
-        rect,
-        computedStyle,
-        context,
-        draw,
-        opacity,
-        totalMatrix,
-        parentRect,
-        logLevel,
-        element,
-        internalState,
-    });
-    reset();
-    return { type: 'continue', cleanupAfterChildren };
-};

package/dist/drawing/round-to-expand-rect.js

@@ -1,7 +0,0 @@
-export const roundToExpandRect = (rect) => {
-    const left = Math.floor(rect.left);
-    const top = Math.floor(rect.top);
-    const right = Math.ceil(rect.right);
-    const bottom = Math.ceil(rect.bottom);
-    return new DOMRect(left, top, right - left, bottom - top);
-};

package/dist/drawing/text/apply-text-transform.js

@@ -1,12 +0,0 @@
-export const applyTextTransform = (text, transform) => {
-    if (transform === 'uppercase') {
-        return text.toUpperCase();
-    }
-    if (transform === 'lowercase') {
-        return text.toLowerCase();
-    }
-    if (transform === 'capitalize') {
-        return text.replace(/\b\w/g, (char) => char.toUpperCase());
-    }
-    return text;
-};

package/dist/drawing/text/draw-text.js

@@ -1,53 +0,0 @@
-import { Internals } from 'remotion';
-import { applyTextTransform } from './apply-text-transform';
-import { findLineBreaks } from './find-line-breaks.text';
-import { getCollapsedText } from './get-collapsed-text';
-export const drawText = ({ span, logLevel, onlyBackgroundClip, }) => {
-    const drawFn = ({ dimensions: rect, computedStyle, contextToDraw }) => {
-        const { fontFamily, fontSize, fontWeight, direction, writingMode, letterSpacing, textTransform, webkitTextFillColor, } = computedStyle;
-        const isVertical = writingMode !== 'horizontal-tb';
-        if (isVertical) {
-            // TODO: Only warn once per render.
-            Internals.Log.warn({
-                logLevel,
-                tag: '@remotion/web-renderer',
-            }, 'Detected "writing-mode" CSS property. Vertical text is not yet supported in @remotion/web-renderer');
-            return;
-        }
-        contextToDraw.save();
-        const fontSizePx = parseFloat(fontSize);
-        contextToDraw.font = `${fontWeight} ${fontSizePx}px ${fontFamily}`;
-        contextToDraw.fillStyle =
-            // If text is being applied with backgroundClipText, we need to use a solid color otherwise it won't get
-            // applied in canvas
-            onlyBackgroundClip
-                ? 'black'
-                : // -webkit-text-fill-color overrides color, and defaults to the value of `color`
-                    webkitTextFillColor;
-        contextToDraw.letterSpacing = letterSpacing;
-        const isRTL = direction === 'rtl';
-        contextToDraw.textAlign = isRTL ? 'right' : 'left';
-        contextToDraw.textBaseline = 'alphabetic';
-        const originalText = span.textContent;
-        const collapsedText = getCollapsedText(span);
-        const transformedText = applyTextTransform(collapsedText, textTransform);
-        span.textContent = transformedText;
-        // For RTL text, fill from the right edge instead of left
-        const xPosition = isRTL ? rect.right : rect.left;
-        const lines = findLineBreaks(span, isRTL);
-        let offsetTop = 0;
-        const measurements = contextToDraw.measureText(lines[0].text);
-        const { fontBoundingBoxDescent, fontBoundingBoxAscent } = measurements;
-        const fontHeight = fontBoundingBoxAscent + fontBoundingBoxDescent;
-        for (const line of lines) {
-            // Calculate leading
-            const leading = line.height - fontHeight;
-            const halfLeading = leading / 2;
-            contextToDraw.fillText(line.text, xPosition + line.offsetHorizontal, rect.top + halfLeading + fontBoundingBoxAscent + offsetTop);
-            offsetTop += line.height;
-        }
-        span.textContent = originalText;
-        contextToDraw.restore();
-    };
-    return drawFn;
-};

package/dist/drawing/text/find-line-breaks.text.js

@@ -1,118 +0,0 @@
-import { getCollapsedText } from './get-collapsed-text';
-// Punctuation that cannot start a line according to Unicode line breaking rules
-// When these would start a line, the browser moves the preceding word to the new line
-const cannotStartLine = (segment) => {
-    if (segment.length === 0)
-        return false;
-    const firstChar = segment[0];
-    const forbiddenLineStarts = [
-        '.',
-        ',',
-        ';',
-        ':',
-        '!',
-        '?',
-        ')',
-        ']',
-        '}',
-        '"',
-        "'",
-        '"',
-        `'`,
-        '»',
-        '…',
-        '‥',
-        '·',
-        '%',
-        '‰',
-    ];
-    return forbiddenLineStarts.includes(firstChar);
-};
-export function findLineBreaks(span, rtl) {
-    const textNode = span.childNodes[0];
-    const originalText = textNode.textContent;
-    const originalRect = span.getBoundingClientRect();
-    const computedStyle = getComputedStyle(span);
-    const segmenter = new Intl.Segmenter('en', { granularity: 'word' });
-    const segments = segmenter.segment(originalText);
-    const words = Array.from(segments).map((s) => s.segment);
-    // If the text would be centered in a flexbox container
-    const lines = [];
-    let currentLine = '';
-    let testText = '';
-    let previousRect = originalRect;
-    textNode.textContent = '';
-    for (let i = 0; i < words.length; i += 1) {
-        const word = words[i];
-        testText += word;
-        let wordsToAdd = word;
-        while (typeof words[i + 1] !== 'undefined' && words[i + 1].trim() === '') {
-            testText += words[i + 1];
-            wordsToAdd += words[i + 1];
-            i++;
-        }
-        previousRect = span.getBoundingClientRect();
-        textNode.textContent = testText;
-        const collapsedText = getCollapsedText(span);
-        textNode.textContent = collapsedText;
-        const rect = span.getBoundingClientRect();
-        const currentHeight = rect.height;
-        // If height changed significantly, we had a line break
-        if (previousRect &&
-            previousRect.height !== 0 &&
-            Math.abs(currentHeight - previousRect.height) > 2) {
-            const offsetHorizontal = rtl
-                ? previousRect.right - originalRect.right
-                : previousRect.left - originalRect.left;
-            const shouldCollapse = !computedStyle.whiteSpaceCollapse.includes('preserve');
-            let textForPreviousLine = currentLine;
-            let textForNewLine = wordsToAdd;
-            // If the segment that triggered the break can't start a line (e.g., punctuation),
-            // the browser would have moved the preceding word to the new line as well
-            if (cannotStartLine(word)) {
-                const currentLineSegments = Array.from(segmenter.segment(currentLine)).map((s) => s.segment);
-                // Find the last non-whitespace segment (the word to move)
-                let lastWordIndex = currentLineSegments.length - 1;
-                while (lastWordIndex >= 0 &&
-                    currentLineSegments[lastWordIndex].trim() === '') {
-                    lastWordIndex--;
-                }
-                if (lastWordIndex >= 0) {
-                    // Move the last word (and any trailing whitespace) to the new line
-                    textForPreviousLine = currentLineSegments
-                        .slice(0, lastWordIndex)
-                        .join('');
-                    textForNewLine =
-                        currentLineSegments.slice(lastWordIndex).join('') + wordsToAdd;
-                }
-            }
-            lines.push({
-                text: shouldCollapse ? textForPreviousLine.trim() : textForPreviousLine,
-                height: currentHeight - previousRect.height,
-                offsetHorizontal,
-            });
-            currentLine = textForNewLine;
-        }
-        else {
-            currentLine += wordsToAdd;
-        }
-    }
-    // Add the last line
-    if (currentLine) {
-        textNode.textContent = testText;
-        const rects = span.getClientRects();
-        const rect = span.getBoundingClientRect();
-        const lastRect = rects[rects.length - 1];
-        const offsetHorizontal = rtl
-            ? lastRect.right - originalRect.right
-            : lastRect.left - originalRect.left;
-        lines.push({
-            text: currentLine,
-            height: rect.height - lines.reduce((acc, curr) => acc + curr.height, 0),
-            offsetHorizontal,
-        });
-    }
-    // Reset to original text
-    textNode.textContent = originalText;
-    return lines;
-}

package/dist/drawing/text/get-collapsed-text.d.ts

@@ -1 +0,0 @@
-export declare const getCollapsedText: (span: HTMLSpanElement) => string;

package/dist/drawing/text/get-collapsed-text.js

@@ -1,46 +0,0 @@
-export const getCollapsedText = (span) => {
-    const textNode = span.firstChild;
-    if (!textNode || textNode.nodeType !== Node.TEXT_NODE) {
-        throw new Error('Span must contain a single text node');
-    }
-    const originalText = textNode.textContent || '';
-    let collapsedText = originalText;
-    // Helper to measure width
-    const measureWidth = (text) => {
-        textNode.textContent = text;
-        return span.getBoundingClientRect().width;
-    };
-    const originalWidth = measureWidth(originalText);
-    // Test leading whitespace
-    if (/^\s/.test(collapsedText)) {
-        const trimmedLeading = collapsedText.replace(/^\s+/, '');
-        const newWidth = measureWidth(trimmedLeading);
-        if (newWidth === originalWidth) {
-            // Whitespace was collapsed by the browser
-            collapsedText = trimmedLeading;
-        }
-    }
-    // Test trailing whitespace (on current collapsed text)
-    if (/\s$/.test(collapsedText)) {
-        const currentWidth = measureWidth(collapsedText);
-        const trimmedTrailing = collapsedText.replace(/\s+$/, '');
-        const newWidth = measureWidth(trimmedTrailing);
-        if (newWidth === currentWidth) {
-            // Whitespace was collapsed by the browser
-            collapsedText = trimmedTrailing;
-        }
-    }
-    // Test internal duplicate whitespace (on current collapsed text)
-    if (/\s\s/.test(collapsedText)) {
-        const currentWidth = measureWidth(collapsedText);
-        const collapsedInternal = collapsedText.replace(/\s\s+/g, ' ');
-        const newWidth = measureWidth(collapsedInternal);
-        if (newWidth === currentWidth) {
-            // Whitespace was collapsed by the browser
-            collapsedText = collapsedInternal;
-        }
-    }
-    // Restore original text
-    textNode.textContent = originalText;
-    return collapsedText;
-};

package/dist/drawing/text/handle-text-node.js

@@ -1,24 +0,0 @@
-import { processNode } from '../process-node';
-import { drawText } from './draw-text';
-export const handleTextNode = async ({ node, context, logLevel, parentRect, internalState, rootElement, onlyBackgroundClip, }) => {
-    const span = document.createElement('span');
-    const parent = node.parentNode;
-    if (!parent) {
-        throw new Error('Text node has no parent');
-    }
-    parent.insertBefore(span, node);
-    span.appendChild(node);
-    const value = await processNode({
-        context,
-        element: span,
-        draw: drawText({ span, logLevel, onlyBackgroundClip }),
-        logLevel,
-        parentRect,
-        internalState,
-        rootElement,
-    });
-    // Undo the layout manipulation
-    parent.insertBefore(node, span);
-    parent.removeChild(span);
-    return value;
-};

package/dist/drawing/transform-in-3d.js

@@ -1,177 +0,0 @@
-// Vertex shader - now includes texture coordinates
-const vsSource = `
-		attribute vec2 aPosition;
-		attribute vec2 aTexCoord;
-		uniform mat4 uTransform;
-		uniform mat4 uProjection;
-		varying vec2 vTexCoord;
-
-		void main() {
-				gl_Position = uProjection * uTransform * vec4(aPosition, 0.0, 1.0);
-				vTexCoord = aTexCoord;
-		}
-`;
-// Fragment shader - samples from texture and unpremultiplies alpha
-const fsSource = `
-		precision mediump float;
-		uniform sampler2D uTexture;
-		varying vec2 vTexCoord;
-
-		void main() {
-				gl_FragColor = texture2D(uTexture, vTexCoord);
-		}
-`;
-function compileShader(shaderGl, source, type) {
-    const shader = shaderGl.createShader(type);
-    if (!shader) {
-        throw new Error('Could not create shader');
-    }
-    shaderGl.shaderSource(shader, source);
-    shaderGl.compileShader(shader);
-    if (!shaderGl.getShaderParameter(shader, shaderGl.COMPILE_STATUS)) {
-        const log = shaderGl.getShaderInfoLog(shader);
-        shaderGl.deleteShader(shader);
-        throw new Error('Shader compile error: ' + log);
-    }
-    return shader;
-}
-const createHelperCanvas = ({ canvasWidth, canvasHeight, helperCanvasState, }) => {
-    var _a;
-    if (helperCanvasState.current) {
-        // Resize canvas if dimensions changed
-        if (helperCanvasState.current.canvas.width !== canvasWidth ||
-            helperCanvasState.current.canvas.height !== canvasHeight) {
-            helperCanvasState.current.canvas.width = canvasWidth;
-            helperCanvasState.current.canvas.height = canvasHeight;
-        }
-        // Always reset viewport and clear when reusing
-        helperCanvasState.current.gl.viewport(0, 0, canvasWidth, canvasHeight);
-        helperCanvasState.current.gl.clearColor(0, 0, 0, 0);
-        helperCanvasState.current.gl.clear(helperCanvasState.current.gl.COLOR_BUFFER_BIT);
-        return helperCanvasState.current;
-    }
-    const canvas = new OffscreenCanvas(canvasWidth, canvasHeight);
-    const gl = (_a = canvas.getContext('webgl', {
-        premultipliedAlpha: true,
-    })) !== null && _a !== void 0 ? _a : undefined;
-    if (!gl) {
-        throw new Error('WebGL not supported');
-    }
-    // Compile shaders and create program once
-    const vertexShader = compileShader(gl, vsSource, gl.VERTEX_SHADER);
-    const fragmentShader = compileShader(gl, fsSource, gl.FRAGMENT_SHADER);
-    const program = gl.createProgram();
-    if (!program) {
-        throw new Error('Could not create program');
-    }
-    gl.attachShader(program, vertexShader);
-    gl.attachShader(program, fragmentShader);
-    gl.linkProgram(program);
-    if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
-        throw new Error('Program link error: ' + gl.getProgramInfoLog(program));
-    }
-    // Get attribute and uniform locations once
-    const locations = {
-        aPosition: gl.getAttribLocation(program, 'aPosition'),
-        aTexCoord: gl.getAttribLocation(program, 'aTexCoord'),
-        uTransform: gl.getUniformLocation(program, 'uTransform'),
-        uProjection: gl.getUniformLocation(program, 'uProjection'),
-        uTexture: gl.getUniformLocation(program, 'uTexture'),
-    };
-    // Shaders can be deleted after linking
-    gl.deleteShader(vertexShader);
-    gl.deleteShader(fragmentShader);
-    const cleanup = () => {
-        gl.deleteProgram(program);
-        const loseContext = gl.getExtension('WEBGL_lose_context');
-        if (loseContext) {
-            loseContext.loseContext();
-        }
-    };
-    helperCanvasState.current = { canvas, gl, program, locations, cleanup };
-    return helperCanvasState.current;
-};
-export const transformIn3d = ({ matrix, sourceCanvas, untransformedRect, rectAfterTransforms, internalState, }) => {
-    const { canvas, gl, program, locations } = createHelperCanvas({
-        canvasWidth: rectAfterTransforms.width,
-        canvasHeight: rectAfterTransforms.height,
-        helperCanvasState: internalState.helperCanvasState,
-    });
-    // Use the cached program
-    gl.useProgram(program);
-    // Setup viewport and clear (already done in createHelperCanvas, but ensure it's set)
-    gl.viewport(0, 0, rectAfterTransforms.width, rectAfterTransforms.height);
-    gl.clearColor(0, 0, 0, 0);
-    gl.clear(gl.COLOR_BUFFER_BIT);
-    // Enable blending
-    gl.enable(gl.BLEND);
-    gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA);
-    gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);
-    // Create vertex buffer
-    const vertexBuffer = gl.createBuffer();
-    gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer);
-    // prettier-ignore
-    const vertices = new Float32Array([
-        untransformedRect.x, untransformedRect.y, 0, 0,
-        untransformedRect.x + untransformedRect.width, untransformedRect.y, 1, 0,
-        untransformedRect.x, untransformedRect.y + untransformedRect.height, 0, 1,
-        untransformedRect.x, untransformedRect.y + untransformedRect.height, 0, 1,
-        untransformedRect.x + untransformedRect.width, untransformedRect.y, 1, 0,
-        untransformedRect.x + untransformedRect.width, untransformedRect.y + untransformedRect.height, 1, 1,
-    ]);
-    gl.bufferData(gl.ARRAY_BUFFER, vertices, gl.STATIC_DRAW);
-    // Setup attributes using cached locations
-    gl.enableVertexAttribArray(locations.aPosition);
-    gl.vertexAttribPointer(locations.aPosition, 2, gl.FLOAT, false, 4 * 4, 0);
-    gl.enableVertexAttribArray(locations.aTexCoord);
-    gl.vertexAttribPointer(locations.aTexCoord, 2, gl.FLOAT, false, 4 * 4, 2 * 4);
-    // Create and configure texture
-    const texture = gl.createTexture();
-    gl.bindTexture(gl.TEXTURE_2D, texture);
-    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
-    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
-    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, gl.RGBA, gl.UNSIGNED_BYTE, sourceCanvas);
-    // Set uniforms using cached locations
-    const transformMatrix = matrix.toFloat32Array();
-    const zScale = 1000000000;
-    // Projection matrix accounts for the output canvas dimensions
-    const projectionMatrix = new Float32Array([
-        2 / rectAfterTransforms.width,
-        0,
-        0,
-        0,
-        0,
-        -2 / rectAfterTransforms.height,
-        0,
-        0,
-        0,
-        0,
-        -2 / zScale,
-        0,
-        -1 + (2 * -rectAfterTransforms.x) / rectAfterTransforms.width,
-        1 - (2 * -rectAfterTransforms.y) / rectAfterTransforms.height,
-        0,
-        1,
-    ]);
-    gl.uniformMatrix4fv(locations.uTransform, false, transformMatrix);
-    gl.uniformMatrix4fv(locations.uProjection, false, projectionMatrix);
-    gl.uniform1i(locations.uTexture, 0);
-    // Draw
-    gl.drawArrays(gl.TRIANGLES, 0, 6);
-    // Clean up per-frame resources only
-    gl.disableVertexAttribArray(locations.aPosition);
-    gl.disableVertexAttribArray(locations.aTexCoord);
-    gl.deleteTexture(texture);
-    gl.deleteBuffer(vertexBuffer);
-    gl.bindTexture(gl.TEXTURE_2D, null);
-    gl.bindBuffer(gl.ARRAY_BUFFER, null);
-    // Reset state
-    gl.disable(gl.BLEND);
-    gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, false);
-    return {
-        canvas,
-        rect: rectAfterTransforms,
-    };
-};

package/dist/drawing/transform-rect-with-matrix.js

@@ -1,19 +0,0 @@
-export function transformDOMRect({ rect, matrix, }) {
-    // Get all four corners of the rectangle
-    const topLeft = new DOMPointReadOnly(rect.left, rect.top);
-    const topRight = new DOMPointReadOnly(rect.right, rect.top);
-    const bottomLeft = new DOMPointReadOnly(rect.left, rect.bottom);
-    const bottomRight = new DOMPointReadOnly(rect.right, rect.bottom);
-    // Transform all corners
-    const transformedTopLeft = topLeft.matrixTransform(matrix);
-    const transformedTopRight = topRight.matrixTransform(matrix);
-    const transformedBottomLeft = bottomLeft.matrixTransform(matrix);
-    const transformedBottomRight = bottomRight.matrixTransform(matrix);
-    // Find the bounding box of the transformed points
-    const minX = Math.min(transformedTopLeft.x / transformedTopLeft.w, transformedTopRight.x / transformedTopRight.w, transformedBottomLeft.x / transformedBottomLeft.w, transformedBottomRight.x / transformedBottomRight.w);
-    const maxX = Math.max(transformedTopLeft.x / transformedTopLeft.w, transformedTopRight.x / transformedTopRight.w, transformedBottomLeft.x / transformedBottomLeft.w, transformedBottomRight.x / transformedBottomRight.w);
-    const minY = Math.min(transformedTopLeft.y / transformedTopLeft.w, transformedTopRight.y / transformedTopRight.w, transformedBottomLeft.y / transformedBottomLeft.w, transformedBottomRight.y / transformedBottomRight.w);
-    const maxY = Math.max(transformedTopLeft.y / transformedTopLeft.w, transformedTopRight.y / transformedTopRight.w, transformedBottomLeft.y / transformedBottomLeft.w, transformedBottomRight.y / transformedBottomRight.w);
-    // Create a new DOMRect from the bounding box
-    return new DOMRect(minX, minY, maxX - minX, maxY - minY);
-}

package/dist/drawing/transform.js

@@ -1,10 +0,0 @@
-export const setTransform = ({ ctx, transform, parentRect, }) => {
-    const offsetMatrix = new DOMMatrix()
-        .translate(-parentRect.x, -parentRect.y)
-        .multiply(transform)
-        .translate(parentRect.x, parentRect.y);
-    ctx.setTransform(offsetMatrix);
-    return () => {
-        ctx.setTransform(new DOMMatrix());
-    };
-};

package/dist/drawing/turn-svg-into-drawable.js

@@ -1,41 +0,0 @@
-export const turnSvgIntoDrawable = (svg) => {
-    const { fill, color } = getComputedStyle(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;
-    const originalFill = svg.style.fill;
-    const originalColor = svg.style.color;
-    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';
-    svg.style.fill = fill;
-    svg.style.color = color;
-    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;
-    svg.style.fill = originalFill;
-    svg.style.color = originalColor;
-    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/frame-range.js

@@ -1,15 +0,0 @@
-export const getRealFrameRange = (durationInFrames, frameRange) => {
-    if (frameRange === null) {
-        return [0, durationInFrames - 1];
-    }
-    if (typeof frameRange === 'number') {
-        if (frameRange < 0 || frameRange >= durationInFrames) {
-            throw new Error(`Frame number is out of range, must be between 0 and ${durationInFrames - 1} but got ${frameRange}`);
-        }
-        return [frameRange, frameRange];
-    }
-    if (frameRange[1] >= durationInFrames || frameRange[0] < 0) {
-        throw new Error(`The "durationInFrames" of the composition was evaluated to be ${durationInFrames}, but frame range ${frameRange.join('-')} is not inbetween 0-${durationInFrames - 1}`);
-    }
-    return frameRange;
-};