@remotion/paths 3.3.38 → 3.3.40

package/dist/helpers/construct.js

@@ -2,16 +2,16 @@
 // Copied from: https://github.com/rveciana/svg-path-properties
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.construct = void 0;
+const parse_path_1 = require("../parse-path");
 const arc_1 = require("./arc");
 const bezier_1 = require("./bezier");
 const linear_1 = require("./linear");
-const parse_1 = require("./parse");
 const construct = (string) => {
     let length = 0;
     const partial_lengths = [];
     const functions = [];
     let initial_point = null;
-    const parsed = (0, parse_1.parsePath)(string);
+    const parsed = (0, parse_path_1.parsePath)(string);
     let cur = [0, 0];
     let prev_point = [0, 0];
     let curve;
@@ -19,100 +19,142 @@ const construct = (string) => {
     const segments = [];
     for (let i = 0; i < parsed.length; i++) {
         const instruction = parsed[i];
-        if (instruction[0].toLowerCase() !== 'm' && segments.length > 0) {
+        if (instruction.type !== 'm' &&
+            instruction.type !== 'M' &&
+            segments.length > 0) {
             segments[segments.length - 1].push(instruction);
         }
         // moveTo
-        if (instruction[0] === 'M') {
-            cur = [instruction[1], instruction[2]];
+        if (instruction.type === 'M') {
+            cur = [instruction.x, instruction.y];
             ringStart = [cur[0], cur[1]];
             segments.push([instruction]);
             functions.push(null);
             if (i === 0) {
-                initial_point = { x: instruction[1], y: instruction[2] };
+                initial_point = { x: instruction.x, y: instruction.y };
             }
         }
-        else if (instruction[0] === 'm') {
-            cur = [instruction[1] + cur[0], instruction[2] + cur[1]];
+        else if (instruction.type === 'm') {
+            cur = [instruction.dx + cur[0], instruction.dy + cur[1]];
             ringStart = [cur[0], cur[1]];
-            segments.push([['M', cur[0], cur[1]]]);
+            segments.push([{ type: 'M', x: cur[0], y: cur[1] }]);
             functions.push(null);
             // lineTo
         }
-        else if (instruction[0] === 'L') {
-            length += Math.sqrt((cur[0] - instruction[1]) ** 2 + (cur[1] - instruction[2]) ** 2);
-            functions.push((0, linear_1.makeLinearPosition)(cur[0], instruction[1], cur[1], instruction[2]));
-            cur = [instruction[1], instruction[2]];
+        else if (instruction.type === 'L') {
+            length += Math.sqrt((cur[0] - instruction.x) ** 2 + (cur[1] - instruction.y) ** 2);
+            functions.push((0, linear_1.makeLinearPosition)({
+                x0: cur[0],
+                x1: instruction.x,
+                y0: cur[1],
+                y1: instruction.y,
+            }));
+            cur = [instruction.x, instruction.y];
         }
-        else if (instruction[0] === 'l') {
-            length += Math.sqrt(instruction[1] ** 2 + instruction[2] ** 2);
-            functions.push((0, linear_1.makeLinearPosition)(cur[0], instruction[1] + cur[0], cur[1], instruction[2] + cur[1]));
-            cur = [instruction[1] + cur[0], instruction[2] + cur[1]];
+        else if (instruction.type === 'l') {
+            length += Math.sqrt(instruction.dx ** 2 + instruction.dy ** 2);
+            functions.push((0, linear_1.makeLinearPosition)({
+                x0: cur[0],
+                x1: instruction.dx + cur[0],
+                y0: cur[1],
+                y1: instruction.dy + cur[1],
+            }));
+            cur = [instruction.dx + cur[0], instruction.dy + cur[1]];
         }
-        else if (instruction[0] === 'H') {
-            length += Math.abs(cur[0] - instruction[1]);
-            functions.push((0, linear_1.makeLinearPosition)(cur[0], instruction[1], cur[1], cur[1]));
-            cur[0] = instruction[1];
+        else if (instruction.type === 'H') {
+            length += Math.abs(cur[0] - instruction.x);
+            functions.push((0, linear_1.makeLinearPosition)({
+                x0: cur[0],
+                x1: instruction.x,
+                y0: cur[1],
+                y1: cur[1],
+            }));
+            cur[0] = instruction.x;
         }
-        else if (instruction[0] === 'h') {
-            length += Math.abs(instruction[1]);
-            functions.push((0, linear_1.makeLinearPosition)(cur[0], cur[0] + instruction[1], cur[1], cur[1]));
-            cur[0] = instruction[1] + cur[0];
+        else if (instruction.type === 'h') {
+            length += Math.abs(instruction.dx);
+            functions.push((0, linear_1.makeLinearPosition)({
+                x0: cur[0],
+                x1: cur[0] + instruction.dx,
+                y0: cur[1],
+                y1: cur[1],
+            }));
+            cur[0] = instruction.dx + cur[0];
         }
-        else if (instruction[0] === 'V') {
-            length += Math.abs(cur[1] - instruction[1]);
-            functions.push((0, linear_1.makeLinearPosition)(cur[0], cur[0], cur[1], instruction[1]));
-            cur[1] = instruction[1];
+        else if (instruction.type === 'V') {
+            length += Math.abs(cur[1] - instruction.y);
+            functions.push((0, linear_1.makeLinearPosition)({
+                x0: cur[0],
+                x1: cur[0],
+                y0: cur[1],
+                y1: instruction.y,
+            }));
+            cur[1] = instruction.y;
         }
-        else if (instruction[0] === 'v') {
-            length += Math.abs(instruction[1]);
-            functions.push((0, linear_1.makeLinearPosition)(cur[0], cur[0], cur[1], cur[1] + instruction[1]));
-            cur[1] = instruction[1] + cur[1];
+        else if (instruction.type === 'v') {
+            length += Math.abs(instruction.dy);
+            functions.push((0, linear_1.makeLinearPosition)({
+                x0: cur[0],
+                x1: cur[0],
+                y0: cur[1],
+                y1: cur[1] + instruction.dy,
+            }));
+            cur[1] = instruction.dy + cur[1];
             // Close path
         }
-        else if (instruction[0] === 'z' || instruction[0] === 'Z') {
+        else if (instruction.type === 'Z') {
             length += Math.sqrt((ringStart[0] - cur[0]) ** 2 + (ringStart[1] - cur[1]) ** 2);
-            functions.push((0, linear_1.makeLinearPosition)(cur[0], ringStart[0], cur[1], ringStart[1]));
+            functions.push((0, linear_1.makeLinearPosition)({
+                x0: cur[0],
+                x1: ringStart[0],
+                y0: cur[1],
+                y1: ringStart[1],
+            }));
             cur = [ringStart[0], ringStart[1]];
             // Cubic Bezier curves
         }
-        else if (instruction[0] === 'C') {
+        else if (instruction.type === 'C') {
             curve = (0, bezier_1.makeBezier)({
                 ax: cur[0],
                 ay: cur[1],
-                bx: instruction[1],
-                by: instruction[2],
-                cx: instruction[3],
-                cy: instruction[4],
-                dx: instruction[5],
-                dy: instruction[6],
+                bx: instruction.cp1x,
+                by: instruction.cp1y,
+                cx: instruction.cp2x,
+                cy: instruction.cp2y,
+                dx: instruction.x,
+                dy: instruction.y,
             });
             length += curve.getTotalLength();
-            cur = [instruction[5], instruction[6]];
+            cur = [instruction.x, instruction.y];
             functions.push(curve);
         }
-        else if (instruction[0] === 'c') {
+        else if (instruction.type === 'c') {
             curve = (0, bezier_1.makeBezier)({
                 ax: cur[0],
                 ay: cur[1],
-                bx: cur[0] + instruction[1],
-                by: cur[1] + instruction[2],
-                cx: cur[0] + instruction[3],
-                cy: cur[1] + instruction[4],
-                dx: cur[0] + instruction[5],
-                dy: cur[1] + instruction[6],
+                bx: cur[0] + instruction.cp1dx,
+                by: cur[1] + instruction.cp1dy,
+                cx: cur[0] + instruction.cp2dx,
+                cy: cur[1] + instruction.cp2dy,
+                dx: cur[0] + instruction.dx,
+                dy: cur[1] + instruction.dy,
             });
             if (curve.getTotalLength() > 0) {
                 length += curve.getTotalLength();
                 functions.push(curve);
-                cur = [instruction[5] + cur[0], instruction[6] + cur[1]];
+                cur = [instruction.dx + cur[0], instruction.dy + cur[1]];
             }
             else {
-                functions.push((0, linear_1.makeLinearPosition)(cur[0], cur[0], cur[1], cur[1]));
+                functions.push((0, linear_1.makeLinearPosition)({ x0: cur[0], x1: cur[0], y0: cur[1], y1: cur[1] }));
             }
         }
-        else if (instruction[0] === 'S') {
-            if (i > 0 && ['C', 'c', 'S', 's'].indexOf(parsed[i - 1][0]) > -1) {
+        else if (instruction.type === 'S') {
+            const prev = parsed[i - 1];
+            const prevWasCurve = prev.type === 'C' ||
+                prev.type === 'c' ||
+                prev.type === 'S' ||
+                prev.type === 's';
+            if (i > 0 && prevWasCurve) {
                 if (curve) {
                     const c = curve.getC();
                     curve = (0, bezier_1.makeBezier)({
@@ -120,10 +162,10 @@ const construct = (string) => {
                         ay: cur[1],
                         bx: 2 * cur[0] - c.x,
                         by: 2 * cur[1] - c.y,
-                        cx: instruction[1],
-                        cy: instruction[2],
-                        dx: instruction[3],
-                        dy: instruction[4],
+                        cx: instruction.cpx,
+                        cy: instruction.cpy,
+                        dx: instruction.x,
+                        dy: instruction.y,
                     });
                 }
             }
@@ -133,21 +175,25 @@ const construct = (string) => {
                     ay: cur[1],
                     bx: cur[0],
                     by: cur[1],
-                    cx: instruction[1],
-                    cy: instruction[2],
-                    dx: instruction[3],
-                    dy: instruction[4],
+                    cx: instruction.cpx,
+                    cy: instruction.cpy,
+                    dx: instruction.x,
+                    dy: instruction.y,
                 });
             }
             if (curve) {
                 length += curve.getTotalLength();
-                cur = [instruction[3], instruction[4]];
+                cur = [instruction.x, instruction.y];
                 functions.push(curve);
             }
         }
-        else if (instruction[0] === 's') {
-            // 240 225
-            if (i > 0 && ['C', 'c', 'S', 's'].indexOf(parsed[i - 1][0]) > -1) {
+        else if (instruction.type === 's') {
+            const prev = parsed[i - 1];
+            const prevWasCurve = prev.type === 'C' ||
+                prev.type === 'c' ||
+                prev.type === 'S' ||
+                prev.type === 's';
+            if (i > 0 && prevWasCurve) {
                 if (curve) {
                     const c = curve.getC();
                     const d = curve.getD();
@@ -156,10 +202,10 @@ const construct = (string) => {
                         ay: cur[1],
                         bx: cur[0] + d.x - c.x,
                         by: cur[1] + d.y - c.y,
-                        cx: cur[0] + instruction[1],
-                        cy: cur[1] + instruction[2],
-                        dx: cur[0] + instruction[3],
-                        dy: cur[1] + instruction[4],
+                        cx: cur[0] + instruction.cpdx,
+                        cy: cur[1] + instruction.cpdy,
+                        dx: cur[0] + instruction.dx,
+                        dy: cur[1] + instruction.dy,
                     });
                 }
             }
@@ -169,22 +215,27 @@ const construct = (string) => {
                     ay: cur[1],
                     bx: cur[0],
                     by: cur[1],
-                    cx: cur[0] + instruction[1],
-                    cy: cur[1] + instruction[2],
-                    dx: cur[0] + instruction[3],
-                    dy: cur[1] + instruction[4],
+                    cx: cur[0] + instruction.cpdx,
+                    cy: cur[1] + instruction.cpdy,
+                    dx: cur[0] + instruction.dx,
+                    dy: cur[1] + instruction.dy,
                 });
             }
             if (curve) {
                 length += curve.getTotalLength();
-                cur = [instruction[3] + cur[0], instruction[4] + cur[1]];
+                cur = [instruction.dx + cur[0], instruction.dy + cur[1]];
                 functions.push(curve);
             }
         }
         // Quadratic Bezier curves
-        else if (instruction[0] === 'Q') {
-            if (cur[0] === instruction[1] && cur[1] === instruction[2]) {
-                const linearCurve = (0, linear_1.makeLinearPosition)(instruction[1], instruction[3], instruction[2], instruction[4]);
+        else if (instruction.type === 'Q') {
+            if (cur[0] === instruction.cpx && cur[1] === instruction.cpy) {
+                const linearCurve = (0, linear_1.makeLinearPosition)({
+                    x0: instruction.cpx,
+                    x1: instruction.x,
+                    y0: instruction.cpy,
+                    y1: instruction.y,
+                });
                 length += linearCurve.getTotalLength();
                 functions.push(linearCurve);
             }
@@ -192,22 +243,27 @@ const construct = (string) => {
                 curve = (0, bezier_1.makeBezier)({
                     ax: cur[0],
                     ay: cur[1],
-                    bx: instruction[1],
-                    by: instruction[2],
-                    cx: instruction[3],
-                    cy: instruction[4],
+                    bx: instruction.cpx,
+                    by: instruction.cpy,
+                    cx: instruction.x,
+                    cy: instruction.y,
                     dx: null,
                     dy: null,
                 });
                 length += curve.getTotalLength();
                 functions.push(curve);
             }
-            cur = [instruction[3], instruction[4]];
-            prev_point = [instruction[1], instruction[2]];
+            cur = [instruction.x, instruction.y];
+            prev_point = [instruction.cpx, instruction.cpy];
         }
-        else if (instruction[0] === 'q') {
-            if (instruction[1] === 0 && instruction[2] === 0) {
-                const linearCurve = (0, linear_1.makeLinearPosition)(cur[0] + instruction[1], cur[0] + instruction[3], cur[1] + instruction[2], cur[1] + instruction[4]);
+        else if (instruction.type === 'q') {
+            if (instruction.cpdx === 0 && instruction.cpdy === 0) {
+                const linearCurve = (0, linear_1.makeLinearPosition)({
+                    x0: cur[0] + instruction.cpdx,
+                    x1: cur[0] + instruction.cpdy,
+                    y0: cur[1] + instruction.dx,
+                    y1: cur[1] + instruction.dy,
+                });
                 length += linearCurve.getTotalLength();
                 functions.push(linearCurve);
             }
@@ -215,28 +271,33 @@ const construct = (string) => {
                 curve = (0, bezier_1.makeBezier)({
                     ax: cur[0],
                     ay: cur[1],
-                    bx: cur[0] + instruction[1],
-                    by: cur[1] + instruction[2],
-                    cx: cur[0] + instruction[3],
-                    cy: cur[1] + instruction[4],
+                    bx: cur[0] + instruction.cpdx,
+                    by: cur[1] + instruction.cpdy,
+                    cx: cur[0] + instruction.dx,
+                    cy: cur[1] + instruction.dy,
                     dx: null,
                     dy: null,
                 });
                 length += curve.getTotalLength();
                 functions.push(curve);
             }
-            prev_point = [cur[0] + instruction[1], cur[1] + instruction[2]];
-            cur = [instruction[3] + cur[0], instruction[4] + cur[1]];
+            prev_point = [cur[0] + instruction.cpdx, cur[1] + instruction.cpdy];
+            cur = [instruction.dx + cur[0], instruction.dy + cur[1]];
         }
-        else if (instruction[0] === 'T') {
-            if (i > 0 && ['Q', 'q', 'T', 't'].indexOf(parsed[i - 1][0]) > -1) {
+        else if (instruction.type === 'T') {
+            const prev = parsed[i - 1];
+            const prevWasQ = prev.type === 'Q' ||
+                prev.type === 'q' ||
+                prev.type === 'T' ||
+                prev.type === 't';
+            if (i > 0 && prevWasQ) {
                 curve = (0, bezier_1.makeBezier)({
                     ax: cur[0],
                     ay: cur[1],
                     bx: 2 * cur[0] - prev_point[0],
                     by: 2 * cur[1] - prev_point[1],
-                    cx: instruction[1],
-                    cy: instruction[2],
+                    cx: instruction.x,
+                    cy: instruction.y,
                     dx: null,
                     dy: null,
                 });
@@ -244,22 +305,32 @@ const construct = (string) => {
                 length += curve.getTotalLength();
             }
             else {
-                const linearCurve = (0, linear_1.makeLinearPosition)(cur[0], instruction[1], cur[1], instruction[2]);
+                const linearCurve = (0, linear_1.makeLinearPosition)({
+                    x0: cur[0],
+                    x1: instruction.x,
+                    y0: cur[1],
+                    y1: instruction.y,
+                });
                 functions.push(linearCurve);
                 length += linearCurve.getTotalLength();
             }
             prev_point = [2 * cur[0] - prev_point[0], 2 * cur[1] - prev_point[1]];
-            cur = [instruction[1], instruction[2]];
+            cur = [instruction.x, instruction.y];
         }
-        else if (instruction[0] === 't') {
-            if (i > 0 && ['Q', 'q', 'T', 't'].indexOf(parsed[i - 1][0]) > -1) {
+        else if (instruction.type === 't') {
+            const prev = parsed[i - 1];
+            const prevWasQ = prev.type === 'Q' ||
+                prev.type === 'q' ||
+                prev.type === 'T' ||
+                prev.type === 't';
+            if (i > 0 && prevWasQ) {
                 curve = (0, bezier_1.makeBezier)({
                     ax: cur[0],
                     ay: cur[1],
                     bx: 2 * cur[0] - prev_point[0],
                     by: 2 * cur[1] - prev_point[1],
-                    cx: cur[0] + instruction[1],
-                    cy: cur[1] + instruction[2],
+                    cx: cur[0] + instruction.dx,
+                    cy: cur[1] + instruction.dy,
                     dx: null,
                     dy: null,
                 });
@@ -267,43 +338,48 @@ const construct = (string) => {
                 functions.push(curve);
             }
             else {
-                const linearCurve = (0, linear_1.makeLinearPosition)(cur[0], cur[0] + instruction[1], cur[1], cur[1] + instruction[2]);
+                const linearCurve = (0, linear_1.makeLinearPosition)({
+                    x0: cur[0],
+                    x1: cur[0] + instruction.dx,
+                    y0: cur[1],
+                    y1: cur[1] + instruction.dy,
+                });
                 length += linearCurve.getTotalLength();
                 functions.push(linearCurve);
             }
             prev_point = [2 * cur[0] - prev_point[0], 2 * cur[1] - prev_point[1]];
-            cur = [instruction[1] + cur[0], instruction[2] + cur[1]];
+            cur = [instruction.dx + cur[0], instruction.dy + cur[1]];
         }
-        else if (instruction[0] === 'A') {
+        else if (instruction.type === 'A') {
             const arcCurve = (0, arc_1.makeArc)({
                 x0: cur[0],
                 y0: cur[1],
-                rx: instruction[1],
-                ry: instruction[2],
-                xAxisRotate: instruction[3],
-                LargeArcFlag: instruction[4] === 1,
-                SweepFlag: instruction[5] === 1,
-                x1: instruction[6],
-                y1: instruction[7],
+                rx: instruction.rx,
+                ry: instruction.ry,
+                xAxisRotate: instruction.xAxisRotation,
+                LargeArcFlag: instruction.largeArcFlag,
+                SweepFlag: instruction.sweepFlag,
+                x1: instruction.x,
+                y1: instruction.y,
             });
             length += arcCurve.getTotalLength();
-            cur = [instruction[6], instruction[7]];
+            cur = [instruction.x, instruction.y];
             functions.push(arcCurve);
         }
-        else if (instruction[0] === 'a') {
+        else if (instruction.type === 'a') {
             const arcCurve = (0, arc_1.makeArc)({
                 x0: cur[0],
                 y0: cur[1],
-                rx: instruction[1],
-                ry: instruction[2],
-                xAxisRotate: instruction[3],
-                LargeArcFlag: instruction[4] === 1,
-                SweepFlag: instruction[5] === 1,
-                x1: cur[0] + instruction[6],
-                y1: cur[1] + instruction[7],
+                rx: instruction.rx,
+                ry: instruction.ry,
+                xAxisRotate: instruction.xAxisRotation,
+                LargeArcFlag: instruction.largeArcFlag,
+                SweepFlag: instruction.sweepFlag,
+                x1: cur[0] + instruction.dx,
+                y1: cur[1] + instruction.dy,
             });
             length += arcCurve.getTotalLength();
-            cur = [cur[0] + instruction[6], cur[1] + instruction[7]];
+            cur = [cur[0] + instruction.dx, cur[1] + instruction.dy];
             functions.push(arcCurve);
         }
         partial_lengths.push(length);

package/dist/helpers/iterate.d.ts

@@ -0,0 +1,12 @@
+import type { AbsoluteInstruction, ReducedInstruction } from './types';
+export declare const iterateOverSegments: <T extends ReducedInstruction>({ segments, iterate, }: {
+    segments: AbsoluteInstruction[];
+    iterate: (options: {
+        segment: AbsoluteInstruction;
+        prevSegment: AbsoluteInstruction | null;
+        x: number;
+        y: number;
+        initialX: number;
+        initialY: number;
+    }) => T[];
+}) => T[];

package/dist/helpers/iterate.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.iterateOverSegments = void 0;
+const iterateOverSegments = ({ segments, iterate, }) => {
+    let x = 0;
+    let y = 0;
+    let initialX = 0;
+    let initialY = 0;
+    const newSegments = segments.map((s, i) => {
+        var _a;
+        const newSeg = iterate({
+            segment: s,
+            x,
+            y,
+            prevSegment: (_a = segments[i - 1]) !== null && _a !== void 0 ? _a : null,
+            initialX,
+            initialY,
+        });
+        switch (s.type) {
+            case 'M':
+                initialX = s.x;
+                initialY = s.y;
+            // fallthrough
+            case 'A':
+            case 'C':
+            case 'Q':
+            case 'S':
+            case 'T':
+            case 'L': {
+                x = s.x;
+                y = s.y;
+                break;
+            }
+            case 'V': {
+                y = s.y;
+                break;
+            }
+            case 'H': {
+                x = s.x;
+                break;
+            }
+            case 'Z': {
+                break;
+            }
+            default:
+                // @ts-expect-error
+                throw new Error(`Unexpected instruction ${s.type}`);
+        }
+        return newSeg;
+    });
+    return newSegments.flat(1);
+};
+exports.iterateOverSegments = iterateOverSegments;

package/dist/helpers/linear.d.ts

@@ -1,5 +1,10 @@
 import type { Point, PointProperties } from './types';
-export declare const makeLinearPosition: (x0: number, x1: number, y0: number, y1: number) => {
+export declare const makeLinearPosition: ({ x0, x1, y0, y1, }: {
+    x0: number;
+    x1: number;
+    y0: number;
+    y1: number;
+}) => {
     getTotalLength: () => number;
     getPointAtLength: (pos: number) => Point;
     getTangentAtLength: () => Point;

package/dist/helpers/linear.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.makeLinearPosition = void 0;
-const makeLinearPosition = (x0, x1, y0, y1) => {
+const makeLinearPosition = ({ x0, x1, y0, y1, }) => {
     const getTotalLength = () => {
         return Math.sqrt((x0 - x1) ** 2 + (y0 - y1) ** 2);
     };

package/dist/helpers/remove-a-s-t-curves.d.ts

@@ -0,0 +1,2 @@
+import type { AbsoluteInstruction, ReducedInstruction } from './types';
+export declare const removeATSHVInstructions: (segments: AbsoluteInstruction[]) => ReducedInstruction[];