@remotion/paths 3.2.11

package/.prettierrc.js

@@ -0,0 +1,14 @@
+module.exports = {
+	singleQuote: true,
+	bracketSpacing: false,
+	useTabs: true,
+	overrides: [
+		{
+			files: ['*.yml'],
+			options: {
+				singleQuote: false,
+			},
+		},
+	],
+	plugins: [require.resolve('prettier-plugin-organize-imports')],
+};

package/LICENSE.md

@@ -0,0 +1,7 @@
+Copyright (c) 2022 JonnyBurger
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/README.md

@@ -0,0 +1,25 @@
+## @remotion/paths
+
+A package providing utility functions for dealing with SVG paths. This package consists of code from [`svg-path-properties`](https://www.npmjs.com/package/svg-path-properties) and [`svg-path-reverse`](https://github.com/Pomax/svg-path-reverse#readme) with the following improvements:
+
+- Functional style APIs
+- First class Typescript types
+- Documentation with examples
+- ESM import style
+
+No dependencies are needed, meaning this package can be used independently of Remotion.
+
+## API
+
+- [`getLength()`](https://remotion.dev/docs/paths/get-length)
+- [`getParts()`](https://remotion.dev/docs/paths/get-parts)
+- [`getPointAtLength()`](https://remotion.dev/docs/paths/get-point-at-length)
+- [`getTangentAtLength()`](https://remotion.dev/docs/paths/get-tangent-at-length)
+- [`reversePath()`](https://remotion.dev/docs/paths/reverse-path)
+- [`normalizePath()`](https://remotion.dev/docs/paths/normalize-path)
+- [`interpolatePath()`](https://remotion.dev/docs/paths/interpolate-path)
+- [`evolvePath()`](https://remotion.dev/docs/paths/evolve-path)
+
+## License
+
+MIT

package/dist/arc.d.ts

@@ -0,0 +1,12 @@
+import type { Properties } from './types';
+export declare const makeArc: ({ x0, y0, rx, ry, xAxisRotate, LargeArcFlag, SweepFlag, x1, y1, }: {
+    x0: number;
+    y0: number;
+    rx: number;
+    ry: number;
+    xAxisRotate: number;
+    LargeArcFlag: boolean;
+    SweepFlag: boolean;
+    x1: number;
+    y1: number;
+}) => Properties;

package/dist/arc.js

@@ -0,0 +1,231 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.makeArc = void 0;
+const makeArc = ({ x0, y0, rx, ry, xAxisRotate, LargeArcFlag, SweepFlag, x1, y1, }) => {
+    const lengthProperties = approximateArcLengthOfCurve(300, (t) => {
+        return pointOnEllipticalArc({
+            p0: { x: x0, y: y0 },
+            rx,
+            ry,
+            xAxisRotation: xAxisRotate,
+            largeArcFlag: LargeArcFlag,
+            sweepFlag: SweepFlag,
+            p1: { x: x1, y: y1 },
+            t,
+        });
+    });
+    const length = lengthProperties.arcLength;
+    const getTotalLength = () => {
+        return length;
+    };
+    const getPointAtLength = (fractionLength) => {
+        if (fractionLength < 0) {
+            fractionLength = 0;
+        }
+        else if (fractionLength > length) {
+            fractionLength = length;
+        }
+        const position = pointOnEllipticalArc({
+            p0: { x: x0, y: y0 },
+            rx,
+            ry,
+            xAxisRotation: xAxisRotate,
+            largeArcFlag: LargeArcFlag,
+            sweepFlag: SweepFlag,
+            p1: { x: x1, y: y1 },
+            t: fractionLength / length,
+        });
+        return { x: position.x, y: position.y };
+    };
+    const getTangentAtLength = (fractionLength) => {
+        if (fractionLength < 0) {
+            fractionLength = 0;
+        }
+        else if (fractionLength > length) {
+            fractionLength = length;
+        }
+        const point_dist = 0.05; // needs testing
+        const p1 = getPointAtLength(fractionLength);
+        let p2;
+        if (fractionLength < 0) {
+            fractionLength = 0;
+        }
+        else if (fractionLength > length) {
+            fractionLength = length;
+        }
+        if (fractionLength < length - point_dist) {
+            p2 = getPointAtLength(fractionLength + point_dist);
+        }
+        else {
+            p2 = getPointAtLength(fractionLength - point_dist);
+        }
+        const xDist = p2.x - p1.x;
+        const yDist = p2.y - p1.y;
+        const dist = Math.sqrt(xDist * xDist + yDist * yDist);
+        if (fractionLength < length - point_dist) {
+            return { x: -xDist / dist, y: -yDist / dist };
+        }
+        return { x: xDist / dist, y: yDist / dist };
+    };
+    const getPropertiesAtLength = (fractionLength) => {
+        const tangent = getTangentAtLength(fractionLength);
+        const point = getPointAtLength(fractionLength);
+        return { x: point.x, y: point.y, tangentX: tangent.x, tangentY: tangent.y };
+    };
+    return {
+        getPointAtLength,
+        getPropertiesAtLength,
+        getTangentAtLength,
+        getTotalLength,
+    };
+};
+exports.makeArc = makeArc;
+const pointOnEllipticalArc = ({ p0, rx, ry, xAxisRotation, largeArcFlag, sweepFlag, p1, t, }) => {
+    // In accordance to: http://www.w3.org/TR/SVG/implnote.html#ArcOutOfRangeParameters
+    rx = Math.abs(rx);
+    ry = Math.abs(ry);
+    xAxisRotation = mod(xAxisRotation, 360);
+    const xAxisRotationRadians = toRadians(xAxisRotation);
+    // If the endpoints are identical, then this is equivalent to omitting the elliptical arc segment entirely.
+    if (p0.x === p1.x && p0.y === p1.y) {
+        return { x: p0.x, y: p0.y, ellipticalArcAngle: 0 }; // Check if angle is correct
+    }
+    // If rx = 0 or ry = 0 then this arc is treated as a straight line segment joining the endpoints.
+    if (rx === 0 || ry === 0) {
+        // return this.pointOnLine(p0, p1, t);
+        return { x: 0, y: 0, ellipticalArcAngle: 0 }; // Check if angle is correct
+    }
+    // Following "Conversion from endpoint to center parameterization"
+    // http://www.w3.org/TR/SVG/implnote.html#ArcConversionEndpointToCenter
+    // Step #1: Compute transformedPoint
+    const dx = (p0.x - p1.x) / 2;
+    const dy = (p0.y - p1.y) / 2;
+    const transformedPoint = {
+        x: Math.cos(xAxisRotationRadians) * dx + Math.sin(xAxisRotationRadians) * dy,
+        y: -Math.sin(xAxisRotationRadians) * dx +
+            Math.cos(xAxisRotationRadians) * dy,
+    };
+    // Ensure radii are large enough
+    const radiiCheck = transformedPoint.x ** 2 / rx ** 2 + transformedPoint.y ** 2 / ry ** 2;
+    if (radiiCheck > 1) {
+        rx *= Math.sqrt(radiiCheck);
+        ry *= Math.sqrt(radiiCheck);
+    }
+    // Step #2: Compute transformedCenter
+    const cSquareNumerator = rx ** 2 * ry ** 2 -
+        rx ** 2 * transformedPoint.y ** 2 -
+        ry ** 2 * transformedPoint.x ** 2;
+    const cSquareRootDenom = rx ** 2 * transformedPoint.y ** 2 + ry ** 2 * transformedPoint.x ** 2;
+    let cRadicand = cSquareNumerator / cSquareRootDenom;
+    // Make sure this never drops below zero because of precision
+    cRadicand = cRadicand < 0 ? 0 : cRadicand;
+    const cCoef = (largeArcFlag === sweepFlag ? -1 : 1) * Math.sqrt(cRadicand);
+    const transformedCenter = {
+        x: cCoef * ((rx * transformedPoint.y) / ry),
+        y: cCoef * (-(ry * transformedPoint.x) / rx),
+    };
+    // Step #3: Compute center
+    const center = {
+        x: Math.cos(xAxisRotationRadians) * transformedCenter.x -
+            Math.sin(xAxisRotationRadians) * transformedCenter.y +
+            (p0.x + p1.x) / 2,
+        y: Math.sin(xAxisRotationRadians) * transformedCenter.x +
+            Math.cos(xAxisRotationRadians) * transformedCenter.y +
+            (p0.y + p1.y) / 2,
+    };
+    // Step #4: Compute start/sweep angles
+    // Start angle of the elliptical arc prior to the stretch and rotate operations.
+    // Difference between the start and end angles
+    const startVector = {
+        x: (transformedPoint.x - transformedCenter.x) / rx,
+        y: (transformedPoint.y - transformedCenter.y) / ry,
+    };
+    const startAngle = angleBetween({
+        x: 1,
+        y: 0,
+    }, startVector);
+    const endVector = {
+        x: (-transformedPoint.x - transformedCenter.x) / rx,
+        y: (-transformedPoint.y - transformedCenter.y) / ry,
+    };
+    let sweepAngle = angleBetween(startVector, endVector);
+    if (!sweepFlag && sweepAngle > 0) {
+        sweepAngle -= 2 * Math.PI;
+    }
+    else if (sweepFlag && sweepAngle < 0) {
+        sweepAngle += 2 * Math.PI;
+    }
+    // We use % instead of `mod(..)` because we want it to be -360deg to 360deg(but actually in radians)
+    sweepAngle %= 2 * Math.PI;
+    // From http://www.w3.org/TR/SVG/implnote.html#ArcParameterizationAlternatives
+    const angle = startAngle + sweepAngle * t;
+    const ellipseComponentX = rx * Math.cos(angle);
+    const ellipseComponentY = ry * Math.sin(angle);
+    const point = {
+        x: Math.cos(xAxisRotationRadians) * ellipseComponentX -
+            Math.sin(xAxisRotationRadians) * ellipseComponentY +
+            center.x,
+        y: Math.sin(xAxisRotationRadians) * ellipseComponentX +
+            Math.cos(xAxisRotationRadians) * ellipseComponentY +
+            center.y,
+        ellipticalArcStartAngle: startAngle,
+        ellipticalArcEndAngle: startAngle + sweepAngle,
+        ellipticalArcAngle: angle,
+        ellipticalArcCenter: center,
+        resultantRx: rx,
+        resultantRy: ry,
+    };
+    return point;
+};
+const approximateArcLengthOfCurve = (resolution, pointOnCurveFunc) => {
+    // Resolution is the number of segments we use
+    resolution = resolution ? resolution : 500;
+    let resultantArcLength = 0;
+    const arcLengthMap = [];
+    const approximationLines = [];
+    let prevPoint = pointOnCurveFunc(0);
+    let nextPoint;
+    for (let i = 0; i < resolution; i++) {
+        const t = clamp(i * (1 / resolution), 0, 1);
+        nextPoint = pointOnCurveFunc(t);
+        resultantArcLength += distance(prevPoint, nextPoint);
+        approximationLines.push([prevPoint, nextPoint]);
+        arcLengthMap.push({
+            t,
+            arcLength: resultantArcLength,
+        });
+        prevPoint = nextPoint;
+    }
+    // Last stretch to the endpoint
+    nextPoint = pointOnCurveFunc(1);
+    approximationLines.push([prevPoint, nextPoint]);
+    resultantArcLength += distance(prevPoint, nextPoint);
+    arcLengthMap.push({
+        t: 1,
+        arcLength: resultantArcLength,
+    });
+    return {
+        arcLength: resultantArcLength,
+        arcLengthMap,
+        approximationLines,
+    };
+};
+const mod = (x, m) => {
+    return ((x % m) + m) % m;
+};
+const toRadians = (angle) => {
+    return angle * (Math.PI / 180);
+};
+const distance = (p0, p1) => {
+    return Math.sqrt((p1.x - p0.x) ** 2 + (p1.y - p0.y) ** 2);
+};
+const clamp = (val, min, max) => {
+    return Math.min(Math.max(val, min), max);
+};
+const angleBetween = (v0, v1) => {
+    const p = v0.x * v1.x + v0.y * v1.y;
+    const n = Math.sqrt((v0.x ** 2 + v0.y ** 2) * (v1.x ** 2 + v1.y ** 2));
+    const sign = v0.x * v1.y - v0.y * v1.x < 0 ? -1 : 1;
+    const angle = sign * Math.acos(p / n);
+    return angle;
+};

package/dist/bezier-functions.d.ts

@@ -0,0 +1,11 @@
+import type { Point } from './types';
+export declare const cubicPoint: (xs: number[], ys: number[], t: number) => Point;
+export declare const cubicDerivative: (xs: number[], ys: number[], t: number) => Point;
+export declare const getCubicArcLength: (xs: number[], ys: number[], t: number) => number;
+export declare const quadraticPoint: (xs: number[], ys: number[], t: number) => Point;
+export declare const getQuadraticArcLength: (xs: number[], ys: number[], t: number) => number;
+export declare const quadraticDerivative: (xs: number[], ys: number[], t: number) => {
+    x: number;
+    y: number;
+};
+export declare const t2length: (length: number, totalLength: number, func: (t: number) => number) => number;

package/dist/bezier-functions.js

@@ -0,0 +1,138 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.t2length = exports.quadraticDerivative = exports.getQuadraticArcLength = exports.quadraticPoint = exports.getCubicArcLength = exports.cubicDerivative = exports.cubicPoint = void 0;
+const bezier_values_1 = require("./bezier-values");
+const cubicPoint = (xs, ys, t) => {
+    const x = (1 - t) * (1 - t) * (1 - t) * xs[0] +
+        3 * (1 - t) * (1 - t) * t * xs[1] +
+        3 * (1 - t) * t * t * xs[2] +
+        t * t * t * xs[3];
+    const y = (1 - t) * (1 - t) * (1 - t) * ys[0] +
+        3 * (1 - t) * (1 - t) * t * ys[1] +
+        3 * (1 - t) * t * t * ys[2] +
+        t * t * t * ys[3];
+    return { x, y };
+};
+exports.cubicPoint = cubicPoint;
+const cubicDerivative = (xs, ys, t) => {
+    const derivative = (0, exports.quadraticPoint)([3 * (xs[1] - xs[0]), 3 * (xs[2] - xs[1]), 3 * (xs[3] - xs[2])], [3 * (ys[1] - ys[0]), 3 * (ys[2] - ys[1]), 3 * (ys[3] - ys[2])], t);
+    return derivative;
+};
+exports.cubicDerivative = cubicDerivative;
+const getCubicArcLength = (xs, ys, t) => {
+    let correctedT;
+    /* if (xs.length >= tValues.length) {
+        throw new Error('too high n bezier');
+      } */
+    const n = 20;
+    const z = t / 2;
+    let sum = 0;
+    for (let i = 0; i < n; i++) {
+        correctedT = z * bezier_values_1.tValues[n][i] + z;
+        sum += bezier_values_1.cValues[n][i] * bFunc(xs, ys, correctedT);
+    }
+    return z * sum;
+};
+exports.getCubicArcLength = getCubicArcLength;
+const quadraticPoint = (xs, ys, t) => {
+    const x = (1 - t) * (1 - t) * xs[0] + 2 * (1 - t) * t * xs[1] + t * t * xs[2];
+    const y = (1 - t) * (1 - t) * ys[0] + 2 * (1 - t) * t * ys[1] + t * t * ys[2];
+    return { x, y };
+};
+exports.quadraticPoint = quadraticPoint;
+const getQuadraticArcLength = (xs, ys, t) => {
+    if (t === undefined) {
+        t = 1;
+    }
+    const ax = xs[0] - 2 * xs[1] + xs[2];
+    const ay = ys[0] - 2 * ys[1] + ys[2];
+    const bx = 2 * xs[1] - 2 * xs[0];
+    const by = 2 * ys[1] - 2 * ys[0];
+    const A = 4 * (ax * ax + ay * ay);
+    const B = 4 * (ax * bx + ay * by);
+    const C = bx * bx + by * by;
+    if (A === 0) {
+        return t * Math.sqrt((xs[2] - xs[0]) ** 2 + (ys[2] - ys[0]) ** 2);
+    }
+    const b = B / (2 * A);
+    const c = C / A;
+    const u = t + b;
+    const k = c - b * b;
+    const uuk = u * u + k > 0 ? Math.sqrt(u * u + k) : 0;
+    const bbk = b * b + k > 0 ? Math.sqrt(b * b + k) : 0;
+    const term = b + Math.sqrt(b * b + k) === 0
+        ? 0
+        : k * Math.log(Math.abs((u + uuk) / (b + bbk)));
+    return (Math.sqrt(A) / 2) * (u * uuk - b * bbk + term);
+};
+exports.getQuadraticArcLength = getQuadraticArcLength;
+const quadraticDerivative = (xs, ys, t) => {
+    return {
+        x: (1 - t) * 2 * (xs[1] - xs[0]) + t * 2 * (xs[2] - xs[1]),
+        y: (1 - t) * 2 * (ys[1] - ys[0]) + t * 2 * (ys[2] - ys[1]),
+    };
+};
+exports.quadraticDerivative = quadraticDerivative;
+function bFunc(xs, ys, t) {
+    const xbase = getDerivative(1, t, xs);
+    const ybase = getDerivative(1, t, ys);
+    const combined = xbase * xbase + ybase * ybase;
+    return Math.sqrt(combined);
+}
+/**
+ * Compute the curve derivative (hodograph) at t.
+ */
+const getDerivative = (derivative, t, vs) => {
+    // the derivative of any 't'-less function is zero.
+    const n = vs.length - 1;
+    let value;
+    if (n === 0) {
+        return 0;
+    }
+    // direct values? compute!
+    if (derivative === 0) {
+        value = 0;
+        for (let k = 0; k <= n; k++) {
+            value += bezier_values_1.binomialCoefficients[n][k] * (1 - t) ** (n - k) * t ** k * vs[k];
+        }
+        return value;
+    }
+    // Still some derivative? go down one order, then try
+    // for the lower order curve's.
+    const _vs = new Array(n);
+    for (let k = 0; k < n; k++) {
+        _vs[k] = n * (vs[k + 1] - vs[k]);
+    }
+    return getDerivative(derivative - 1, t, _vs);
+};
+const t2length = (length, totalLength, func) => {
+    let error = 1;
+    let t = length / totalLength;
+    let step = (length - func(t)) / totalLength;
+    let numIterations = 0;
+    while (error > 0.001) {
+        const increasedTLength = func(t + step);
+        const increasedTError = Math.abs(length - increasedTLength) / totalLength;
+        if (increasedTError < error) {
+            error = increasedTError;
+            t += step;
+        }
+        else {
+            const decreasedTLength = func(t - step);
+            const decreasedTError = Math.abs(length - decreasedTLength) / totalLength;
+            if (decreasedTError < error) {
+                error = decreasedTError;
+                t -= step;
+            }
+            else {
+                step /= 2;
+            }
+        }
+        numIterations++;
+        if (numIterations > 500) {
+            break;
+        }
+    }
+    return t;
+};
+exports.t2length = t2length;

package/dist/bezier-values.d.ts

@@ -0,0 +1,3 @@
+export declare const tValues: number[][];
+export declare const cValues: number[][];
+export declare const binomialCoefficients: number[][];