@remotion/paths 3.2.11

package/dist/normalize-path.js

@@ -0,0 +1,300 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.normalizePath = void 0;
+/**
+ * Removes all relative coordinates from an SVG path and converts them into absolute coordinates.
+ * @param {string} path A valid SVG path
+ * @link https://remotion.dev/docs/paths/normalize-path
+ */
+const normalizePath = (path) => {
+    // preprocess "d" so that we have spaces between values
+    path = path
+        .replace(/,/g, ' ')
+        .replace(/([^eE])-/g, '$1 -')
+        .replace(/\s*([achlmqstvzACHLMQSTVZ])\s*/g, ' $1 ')
+        .replace(/\s+/g, ' ');
+    // set up the variables used in this function
+    const instructions = path
+        .replace(/([achlmqstvzACHLMQSTVZ])\s?/g, '|$1')
+        .split('|');
+    const instructionLength = instructions.length;
+    let i;
+    let instruction;
+    let op;
+    let lop;
+    let alen;
+    let a;
+    let sx = 0;
+    let sy = 0;
+    let x = 0;
+    let y = 0;
+    let cx = 0;
+    let cy = 0;
+    let cx2 = 0;
+    let cy2 = 0;
+    let rx = 0;
+    let ry = 0;
+    let xrot = 0;
+    let lflag = 0;
+    let sweep = 0;
+    let normalized = '';
+    // we run through the instruction list starting at 1, not 0,
+    // because we split up "|M x y ...." so the first element will
+    // always be an empty string. By design.
+    for (i = 1; i < instructionLength; i++) {
+        // which instruction is this?
+        instruction = instructions[i];
+        op = instruction.substring(0, 1);
+        lop = op.toLowerCase();
+        // what are the arguments? note that we need to convert
+        // all strings into numbers, or + will do silly things.
+        const oargs = instruction
+            .replace(op, '')
+            .trim()
+            .split(' ')
+            .filter((v) => {
+            return v !== '';
+        });
+        const args = oargs.map((_a) => parseFloat(String(_a)));
+        alen = args.length;
+        // we could use a switch, but elaborate code in a "case" with
+        // fallthrough is just horrid to read. So let's use ifthen
+        // statements instead.
+        // moveto command (plus possible lineto)
+        if (lop === 'm') {
+            normalized += 'M ';
+            if (op === 'm') {
+                x += args[0];
+                y += args[1];
+            }
+            else {
+                x = args[0];
+                y = args[1];
+            }
+            // records start position, for dealing
+            // with the shape close operator ('Z')
+            sx = x;
+            sy = y;
+            normalized += x + ' ' + y + ' ';
+            if (alen > 2) {
+                for (a = 0; a < alen; a += 2) {
+                    // eslint-disable-next-line max-depth
+                    if (op === 'm') {
+                        x += args[a];
+                        y += args[a + 1];
+                    }
+                    else {
+                        x = args[a];
+                        y = args[a + 1];
+                    }
+                    normalized += 'L ' + x + ' ' + y + ' ';
+                }
+            }
+        }
+        // lineto commands
+        else if (lop === 'l') {
+            for (a = 0; a < alen; a += 2) {
+                if (op === 'l') {
+                    x += args[a];
+                    y += args[a + 1];
+                }
+                else {
+                    x = args[a];
+                    y = args[a + 1];
+                }
+                normalized += 'L ' + x + ' ' + y + ' ';
+            }
+        }
+        else if (lop === 'h') {
+            for (a = 0; a < alen; a++) {
+                if (op === 'h') {
+                    x += args[a];
+                }
+                else {
+                    x = args[a];
+                }
+                normalized += 'L ' + x + ' ' + y + ' ';
+            }
+        }
+        else if (lop === 'v') {
+            for (a = 0; a < alen; a++) {
+                if (op === 'v') {
+                    y += args[a];
+                }
+                else {
+                    y = args[a];
+                }
+                normalized += 'L ' + x + ' ' + y + ' ';
+            }
+        }
+        // quadratic curveto commands
+        else if (lop === 'q') {
+            for (a = 0; a < alen; a += 4) {
+                if (op === 'q') {
+                    cx = x + args[a];
+                    cy = y + args[a + 1];
+                    x += args[a + 2];
+                    y += args[a + 3];
+                }
+                else {
+                    cx = args[a];
+                    cy = args[a + 1];
+                    x = args[a + 2];
+                    y = args[a + 3];
+                }
+                normalized += 'Q ' + cx + ' ' + cy + ' ' + x + ' ' + y + ' ';
+            }
+        }
+        else if (lop === 't') {
+            for (a = 0; a < alen; a += 2) {
+                // reflect previous cx/cy over x/y
+                cx = x + (x - cx);
+                cy = y + (y - cy);
+                // then get real end point
+                if (op === 't') {
+                    x += args[a];
+                    y += args[a + 1];
+                }
+                else {
+                    x = args[a];
+                    y = args[a + 1];
+                }
+                normalized += 'Q ' + cx + ' ' + cy + ' ' + x + ' ' + y + ' ';
+            }
+        }
+        // cubic curveto commands
+        else if (lop === 'c') {
+            for (a = 0; a < alen; a += 6) {
+                if (op === 'c') {
+                    cx = x + args[a];
+                    cy = y + args[a + 1];
+                    cx2 = x + args[a + 2];
+                    cy2 = y + args[a + 3];
+                    x += args[a + 4];
+                    y += args[a + 5];
+                }
+                else {
+                    cx = args[a];
+                    cy = args[a + 1];
+                    cx2 = args[a + 2];
+                    cy2 = args[a + 3];
+                    x = args[a + 4];
+                    y = args[a + 5];
+                }
+                normalized +=
+                    'C ' +
+                        cx +
+                        ' ' +
+                        cy +
+                        ' ' +
+                        cx2 +
+                        ' ' +
+                        cy2 +
+                        ' ' +
+                        x +
+                        ' ' +
+                        y +
+                        ' ';
+            }
+        }
+        else if (lop === 's') {
+            for (a = 0; a < alen; a += 4) {
+                // reflect previous cx2/cy2 over x/y
+                cx = x + (x - cx2);
+                cy = y + (y - cy2);
+                // then get real control and end point
+                if (op === 's') {
+                    cx2 = x + args[a];
+                    cy2 = y + args[a + 1];
+                    x += args[a + 2];
+                    y += args[a + 3];
+                }
+                else {
+                    cx2 = args[a];
+                    cy2 = args[a + 1];
+                    x = args[a + 2];
+                    y = args[a + 3];
+                }
+                normalized +=
+                    'C ' +
+                        cx +
+                        ' ' +
+                        cy +
+                        ' ' +
+                        cx2 +
+                        ' ' +
+                        cy2 +
+                        ' ' +
+                        x +
+                        ' ' +
+                        y +
+                        ' ';
+            }
+        }
+        //   rx ry x-axis-rotation large-arc-flag sweep-flag  x   y
+        // a 25,25             -30              0,         1 50,-25
+        // arc command
+        else if (lop === 'a') {
+            for (a = 0; a < alen; a += 7) {
+                rx = args[a];
+                ry = args[a + 1];
+                xrot = args[a + 2];
+                lflag = oargs[a + 3]; // we need the original string to deal with leading zeroes
+                let fixed = false;
+                if (lflag.length > 1) {
+                    const b1 = parseInt(lflag[0], 10);
+                    const b2 = parseInt(lflag[1], 10);
+                    let rest;
+                    // eslint-disable-next-line max-depth
+                    if (lflag.length > 2)
+                        rest = parseFloat(lflag.substring(2));
+                    args[a + 3] = b1;
+                    args.splice(a + 4, 0, b2);
+                    // eslint-disable-next-line max-depth
+                    if (rest !== undefined)
+                        args.splice(a + 5, 0, rest);
+                    fixed = true;
+                }
+                lflag = args[a + 3];
+                sweep = fixed ? args[a + 4] : oargs[a + 4]; // we need the original string to deal with leading zeroes
+                if (!fixed && sweep.length > 1) {
+                    args[a + 4] = parseInt(sweep[0], 10);
+                    args.splice(a + 5, 0, parseFloat(sweep.substring(1)));
+                }
+                sweep = args[a + 4];
+                if (op === 'a') {
+                    x += args[a + 5];
+                    y += args[a + 6];
+                }
+                else {
+                    x = args[a + 5];
+                    y = args[a + 6];
+                }
+                normalized +=
+                    'A ' +
+                        rx +
+                        ' ' +
+                        ry +
+                        ' ' +
+                        xrot +
+                        ' ' +
+                        lflag +
+                        ' ' +
+                        sweep +
+                        ' ' +
+                        x +
+                        ' ' +
+                        y +
+                        ' ';
+            }
+        }
+        else if (lop === 'z') {
+            normalized += 'Z ';
+            // not unimportant: path closing changes the current x/y coordinate
+            x = sx;
+            y = sy;
+        }
+    }
+    return normalized.trim();
+};
+exports.normalizePath = normalizePath;

package/dist/parse.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (path: string) => [string, ...number[]][];
+export default _default;

package/dist/parse.js

@@ -0,0 +1,48 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const length = {
+    a: 7,
+    c: 6,
+    h: 1,
+    l: 2,
+    m: 2,
+    q: 4,
+    s: 4,
+    t: 2,
+    v: 1,
+    z: 0
+};
+const segmentRegExp = /([astvzqmhlc])([^astvzqmhlc]*)/gi;
+const numberRegExp = /-?[0-9]*\.?[0-9]+(?:e[-+]?\d+)?/gi;
+exports.default = (path) => {
+    const segments = (path && path.length > 0 ? path : "M0,0").match(segmentRegExp);
+    if (!segments) {
+        throw new Error(`No path elements found in string ${path}`);
+    }
+    return segments.reduce((segmentsArray, segmentString) => {
+        let command = segmentString.charAt(0);
+        let type = command.toLowerCase();
+        const args = parseValues(segmentString.substr(1));
+        // overloaded moveTo
+        if (type === "m" && args.length > 2) {
+            segmentsArray.push([command, ...args.splice(0, 2)]);
+            type = "l";
+            command = command === "m" ? "l" : "L";
+        }
+        while (args.length >= 0) {
+            if (args.length === length[type]) {
+                segmentsArray.push([command, ...args.splice(0, length[type])]);
+                break;
+            }
+            if (args.length < length[type]) {
+                throw new Error(`Malformed path data: "${command}" must have ${length[type]} elements and has ${args.length}: ${segmentString}`);
+            }
+            segmentsArray.push([command, ...args.splice(0, length[type])]);
+        }
+        return segmentsArray;
+    }, []);
+};
+const parseValues = (args) => {
+    const numbers = args.match(numberRegExp);
+    return numbers ? numbers.map(Number) : [];
+};

package/dist/reverse-path.d.ts

@@ -0,0 +1,12 @@
+/**
+ * https://github.com/Pomax/svg-path-reverse
+ *
+ * This code is in the public domain, except in jurisdictions that do
+ * not recognise the public domain, where this code is MIT licensed.
+ */
+/**
+ * Reverses a path so the end and start are switched.
+ * @param {string} path A valid SVG path
+ * @link https://remotion.dev/docs/paths/reverse-path
+ */
+export declare const reversePath: (path: string) => string;

package/dist/reverse-path.js

@@ -0,0 +1,148 @@
+"use strict";
+/**
+ * https://github.com/Pomax/svg-path-reverse
+ *
+ * This code is in the public domain, except in jurisdictions that do
+ * not recognise the public domain, where this code is MIT licensed.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.reversePath = void 0;
+const normalize_path_1 = require("./normalize-path");
+/**
+ * Normalise an SVG path to absolute coordinates
+ * and full commands, rather than relative coordinates
+ * and/or shortcut commands.
+ */
+/**
+ * Reverse an SVG path.
+ * As long as the input path is normalised, this is actually really
+ * simple to do. As all pathing commands are symmetrical, meaning
+ * that they render the same when you reverse the coordinate order,
+ * the grand trick here is to reverse the path (making sure to keep
+ * coordinates ordered pairwise) and shift the operators left by
+ * one or two coordinate pairs depending on the operator:
+ *
+ *   - Z is removed (after noting it existed),
+ *   - L moves to 2 spots earlier (skipping one coordinate),
+ *   - Q moves to 2 spots earlier (skipping one coordinate),
+ *   - C moves to 4 spots earlier (skipping two coordinates)
+ *       and its arguments get reversed,
+ *   - the path start becomes M.
+ *   - the path end becomes Z iff it was there to begin with.
+ */
+function reverseNormalizedPath(normalized) {
+    const terms = normalized.trim().split(' ');
+    let term;
+    const tlen = terms.length;
+    const tlen1 = tlen - 1;
+    let t;
+    const reversed = [];
+    let x;
+    let y;
+    let pair;
+    let pairs;
+    let shift;
+    const matcher = /[QAZLCM]/;
+    const closed = terms.slice(-1)[0].toUpperCase() === 'Z';
+    for (t = 0; t < tlen; t++) {
+        term = terms[t];
+        // Is this an operator? If it is, run through its
+        // argument list, which we know is fixed length.
+        if (matcher.test(term)) {
+            // Arc processing relies on not-just-coordinates
+            if (term === 'A') {
+                reversed.push(terms[t + 5] === '0' ? '1' : '0');
+                reversed.push(terms[t + 4]);
+                reversed.push(terms[t + 3]);
+                reversed.push(terms[t + 2]);
+                reversed.push(terms[t + 1]);
+                reversed.push(term);
+                reversed.push(terms[t + 7]);
+                reversed.push(terms[t + 6]);
+                t += 7;
+                continue;
+            }
+            // how many coordinate pairs do we need to read,
+            // and by how many pairs should this operator be
+            // shifted left?
+            else if (term === 'C') {
+                pairs = 3;
+                shift = 2;
+            }
+            else if (term === 'Q') {
+                pairs = 2;
+                shift = 1;
+            }
+            else if (term === 'L') {
+                pairs = 1;
+                shift = 1;
+            }
+            else if (term === 'M') {
+                pairs = 1;
+                shift = 0;
+            }
+            else {
+                continue;
+            }
+            // do the argument reading and operator shifting
+            if (pairs === shift) {
+                reversed.push(term);
+            }
+            for (pair = 0; pair < pairs; pair++) {
+                if (pair === shift) {
+                    reversed.push(term);
+                }
+                x = terms[++t];
+                y = terms[++t];
+                reversed.push(y);
+                reversed.push(x);
+            }
+        }
+        // the code has been set up so that every time we
+        // iterate because of the for() operation, the term
+        // we see is a pathing operator, not a number. As
+        // such, if we get to this "else" the path is malformed.
+        else {
+            const pre = terms.slice(Math.max(t - 3, 0), 3).join(' ');
+            const post = terms.slice(t + 1, Math.min(t + 4, tlen1)).join(' ');
+            const range = pre + ' [' + term + '] ' + post;
+            throw new Error('Error while trying to reverse normalized SVG path, at position ' +
+                t +
+                ' (' +
+                range +
+                ').\n' +
+                "Either the path is not normalised, or it's malformed.");
+        }
+    }
+    reversed.push('M');
+    // generating the reversed path string involves
+    // running through our transformed terms in reverse.
+    let revstring = '';
+    const rlen1 = reversed.length - 1;
+    let r;
+    for (r = rlen1; r > 0; r--) {
+        revstring += reversed[r] + ' ';
+    }
+    if (closed)
+        revstring += 'Z';
+    revstring = revstring.replace(/M M/g, 'Z M');
+    return revstring;
+}
+/**
+ * Reverses a path so the end and start are switched.
+ * @param {string} path A valid SVG path
+ * @link https://remotion.dev/docs/paths/reverse-path
+ */
+const reversePath = (path) => {
+    const normalizedPath = (0, normalize_path_1.normalizePath)(path);
+    const paths = normalizedPath.replace(/M/g, '|M').split('|');
+    paths.splice(0, 1);
+    return paths
+        .map((spath) => {
+        return reverseNormalizedPath(spath.trim());
+    })
+        .join(' ')
+        .replace(/ +/g, ' ')
+        .trim();
+};
+exports.reversePath = reversePath;

package/dist/types.d.ts

@@ -0,0 +1,26 @@
+export interface Properties {
+    getTotalLength(): number;
+    getPointAtLength(pos: number): Point;
+    getTangentAtLength(pos: number): Point;
+    getPropertiesAtLength(pos: number): PointProperties;
+}
+export interface PartProperties {
+    start: Point;
+    end: Point;
+    length: number;
+    getPointAtLength(pos: number): Point;
+    getTangentAtLength(pos: number): Point;
+    getPropertiesAtLength(pos: number): PointProperties;
+}
+export interface Point {
+    x: number;
+    y: number;
+}
+export declare type PointArray = [number, number];
+export interface PointProperties {
+    x: number;
+    y: number;
+    tangentX: number;
+    tangentY: number;
+}
+export declare type pathOrders = "a" | "c" | "h" | "l" | "m" | "q" | "s" | "t" | "v" | "z";

package/dist/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/package.json

@@ -0,0 +1,39 @@
+{
+	"name": "@remotion/paths",
+	"version": "3.2.11",
+	"description": "Utility functions for SVG paths",
+	"main": "dist/index.js",
+	"sideEffects": false,
+	"scripts": {
+		"lint": "eslint src --ext ts,tsx",
+		"watch": "tsc -w",
+		"build": "tsc -d",
+		"test": "vitest --run"
+	},
+	"author": "Jonny Burger <jonny@remotion.dev>",
+	"license": "MIT",
+	"repository": {
+		"url": "https://github.com/remotion-dev/remotion"
+	},
+	"bugs": {
+		"url": "https://github.com/remotion-dev/remotion/issues"
+	},
+	"devDependencies": {
+		"@jonny/eslint-config": "3.0.266",
+		"@types/node": "^16.7.5",
+		"eslint": "8.13.0",
+		"prettier": "^2.0.5",
+		"prettier-plugin-organize-imports": "^2.3.4",
+		"typescript": "^4.7.0",
+		"vitest": "^0.18.0"
+	},
+	"keywords": [
+		"svg",
+		"path",
+		"utilities"
+	],
+	"publishConfig": {
+		"access": "public"
+	},
+	"gitHead": "43d44e718e41200aea544719e9963482f9a65120"
+}

package/tsconfig.json

@@ -0,0 +1,9 @@
+{
+	"extends": "../tsconfig.settings.json",
+	"compilerOptions": {
+		"composite": true,
+		"rootDir": "src",
+		"outDir": "dist"
+	},
+	"include": ["src"]
+}