toosoon-utils 4.2.3 → 4.3.1

package/lib/extras/paths/PathContext.js

@@ -14,8 +14,12 @@ import Path from './Path';
 export default class PathContext extends Path {
     _currentPosition = new Vector2(NaN, NaN);
     _currentTransform = new DOMMatrix();
-    _positionTransform = new DOMMatrix();
     _transformStack = [];
+    autoClose;
+    constructor() {
+        super({ autoClose: false });
+        this.autoClose = false;
+    }
     /**
      * Create a path from a given list of points
      *
@@ -45,8 +49,8 @@ export default class PathContext extends Path {
      * @return {this}
      */
     closePath() {
-        const startPoint = this.subpaths[0]?.getPoint(0);
-        const endPoint = this.subpaths[this.subpaths.length - 1]?.getPoint(1);
+        const startPoint = this.curves[0]?.getPoint(0);
+        const endPoint = this.curves[this.curves.length - 1]?.getPoint(1);
         if (!startPoint.equals(endPoint)) {
             const curve = new LineCurve(endPoint.x, endPoint.y, startPoint.x, startPoint.y);
             this.add(curve);
@@ -61,8 +65,8 @@ export default class PathContext extends Path {
      * @return {this}
      */
     moveTo(x, y) {
-        const [tX, tY] = this._transformPoint([x, y]);
-        this._setCurrentPosition(tX, tY);
+        [x, y] = this._transformPoint([x, y]);
+        this._setCurrentPosition(x, y);
         return this;
     }
     /**
@@ -74,12 +78,12 @@ export default class PathContext extends Path {
      * @return {this}
      */
     lineTo(x, y) {
-        const [tX, tY] = this._transformPoint([x, y]);
+        [x, y] = this._transformPoint([x, y]);
         if (!this._hasCurrentPosition())
-            return this._setCurrentPosition(tX, tY);
-        const curve = new LineCurve(this._currentPosition.x, this._currentPosition.y, tX, tY);
+            return this._setCurrentPosition(x, y);
+        const curve = new LineCurve(this._currentPosition.x, this._currentPosition.y, x, y);
         this.add(curve);
-        this._setCurrentPosition(tX, tY);
+        this._setCurrentPosition(x, y);
         return this;
     }
     /**
@@ -90,12 +94,12 @@ export default class PathContext extends Path {
      * @returns {this}
      */
     polylineTo(points) {
-        const tPoints = this._transformPoints(points);
+        points = this._transformPoints(points);
         if (!this._hasCurrentPosition())
-            this._setCurrentPosition(...tPoints[0]);
-        const curve = new PolylineCurve([this._currentPosition.toArray()].concat(tPoints));
+            this._setCurrentPosition(...points[0]);
+        const curve = new PolylineCurve([this._currentPosition.toArray()].concat(points));
         this.add(curve);
-        this._setCurrentPosition(...tPoints[tPoints.length - 1]);
+        this._setCurrentPosition(...points[points.length - 1]);
         return this;
     }
     /**
@@ -109,13 +113,13 @@ export default class PathContext extends Path {
      * @return {this}
      */
     quadraticCurveTo(cpx, cpy, x2, y2) {
-        const [tCpx, tCpy] = this._transformPoint([cpx, cpy]);
-        const [tX2, tY2] = this._transformPoint([x2, y2]);
+        [cpx, cpy] = this._transformPoint([cpx, cpy]);
+        [x2, y2] = this._transformPoint([x2, y2]);
         if (!this._hasCurrentPosition())
-            this._setCurrentPosition(tCpx, tCpy);
-        const curve = new QuadraticBezierCurve(this._currentPosition.x, this._currentPosition.y, tCpx, tCpy, tX2, tY2);
+            this._setCurrentPosition(cpx, cpy);
+        const curve = new QuadraticBezierCurve(this._currentPosition.x, this._currentPosition.y, cpx, cpy, x2, y2);
         this.add(curve);
-        this._setCurrentPosition(tX2, tY2);
+        this._setCurrentPosition(x2, y2);
         return this;
     }
     /**
@@ -131,14 +135,14 @@ export default class PathContext extends Path {
      * @return {this}
      */
     bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x2, y2) {
-        const [tCp1x, tCp1y] = this._transformPoint([cp1x, cp1y]);
-        const [tCp2x, tCp2y] = this._transformPoint([cp2x, cp2y]);
-        const [tX2, tY2] = this._transformPoint([x2, y2]);
+        [cp1x, cp1y] = this._transformPoint([cp1x, cp1y]);
+        [cp2x, cp2y] = this._transformPoint([cp2x, cp2y]);
+        [x2, y2] = this._transformPoint([x2, y2]);
         if (!this._hasCurrentPosition())
-            this._setCurrentPosition(tCp1x, tCp1y);
-        const curve = new CubicBezierCurve(this._currentPosition.x, this._currentPosition.y, tCp1x, tCp1y, tCp2x, tCp2y, tX2, tY2);
+            this._setCurrentPosition(cp1x, cp1y);
+        const curve = new CubicBezierCurve(this._currentPosition.x, this._currentPosition.y, cp1x, cp1y, cp2x, cp2y, x2, y2);
         this.add(curve);
-        this._setCurrentPosition(tX2, tY2);
+        this._setCurrentPosition(x2, y2);
         return this;
     }
     /**
@@ -154,14 +158,14 @@ export default class PathContext extends Path {
      * @return {this}
      */
     catmullRomCurveTo(cp1x, cp1y, cp2x, cp2y, x2, y2) {
-        const [tCp1x, tCp1y] = this._transformPoint([cp1x, cp1y]);
-        const [tCp2x, tCp2y] = this._transformPoint([cp2x, cp2y]);
-        const [tX2, tY2] = this._transformPoint([x2, y2]);
+        [cp1x, cp1y] = this._transformPoint([cp1x, cp1y]);
+        [cp2x, cp2y] = this._transformPoint([cp2x, cp2y]);
+        [x2, y2] = this._transformPoint([x2, y2]);
         if (!this._hasCurrentPosition())
-            this._setCurrentPosition(tCp1x, tCp1y);
-        const curve = new CatmullRomCurve(this._currentPosition.x, this._currentPosition.y, tCp1x, tCp1y, tCp2x, tCp2y, tX2, tY2);
+            this._setCurrentPosition(cp1x, cp1y);
+        const curve = new CatmullRomCurve(this._currentPosition.x, this._currentPosition.y, cp1x, cp1y, cp2x, cp2y, x2, y2);
         this.add(curve);
-        this._setCurrentPosition(tX2, tY2);
+        this._setCurrentPosition(x2, y2);
         return this;
     }
     /**
@@ -172,12 +176,12 @@ export default class PathContext extends Path {
      * @return {this}
      */
     splineTo(points) {
-        const tPoints = this._transformPoints(points);
+        points = this._transformPoints(points);
         if (!this._hasCurrentPosition())
-            this._setCurrentPosition(...tPoints[0]);
-        const curve = new SplineCurve([this._currentPosition.toArray()].concat(tPoints));
+            this._setCurrentPosition(...points[0]);
+        const curve = new SplineCurve([this._currentPosition.toArray()].concat(points));
         this.add(curve);
-        this._setCurrentPosition(...tPoints[tPoints.length - 1]);
+        this._setCurrentPosition(...points[points.length - 1]);
         return this;
     }
     /**
@@ -195,18 +199,16 @@ export default class PathContext extends Path {
      * @return {this}
      */
     ellipse(cx, cy, rx, ry, rotation, startAngle, endAngle, counterclockwise) {
-        const [tCx, tCy, tRx, tRy, tRotation] = this._transformEllipse(cx, cy, rx, ry, rotation);
-        const start = EllipseCurve.interpolate(0, tCx, tCy, tRx, tRy, tRotation, startAngle, endAngle, counterclockwise);
-        const end = EllipseCurve.interpolate(1, tCx, tCy, tRx, tRy, tRotation, startAngle, endAngle, counterclockwise);
-        if (!this._hasCurrentPosition())
-            this._setCurrentPosition(...start);
-        else if (!this._currentPosition.equals(start)) {
-            const curve = new LineCurve(this._currentPosition.x, this._currentPosition.y, ...start);
-            this.add(curve);
+        [cx, cy, rx, ry, rotation] = this._transformEllipse(cx, cy, rx, ry, rotation);
+        const start = EllipseCurve.interpolate(0, cx, cy, rx, ry, rotation, startAngle, endAngle, counterclockwise);
+        const end = EllipseCurve.interpolate(1, cx, cy, rx, ry, rotation, startAngle, endAngle, counterclockwise);
+        if (this._hasCurrentPosition() && !this._currentPosition.equals(start)) {
+            const line = new LineCurve(this._currentPosition.x, this._currentPosition.y, ...start);
+            this.add(line);
         }
-        if (tRx <= EPSILON && tRy <= EPSILON)
+        if (rx <= EPSILON && ry <= EPSILON)
             return this;
-        const curve = new EllipseCurve(tCx, tCy, tRx, tRy, tRotation, startAngle, endAngle, counterclockwise);
+        const curve = new EllipseCurve(cx, cy, rx, ry, rotation, startAngle, endAngle, counterclockwise);
         this.add(curve);
         this._setCurrentPosition(...end);
         return this;
@@ -227,25 +229,23 @@ export default class PathContext extends Path {
         if (!this._isUniform || this._isRotated) {
             return this.ellipse(cx, cy, radius, radius, 0, startAngle, endAngle, counterclockwise);
         }
-        const [tCx, tCy, tRadius] = this._transformEllipse(cx, cy, radius, radius, 0);
-        const start = EllipseCurve.interpolate(0, tCx, tCy, tRadius, tRadius, 0, startAngle, endAngle, counterclockwise);
-        const end = EllipseCurve.interpolate(1, tCx, tCy, tRadius, tRadius, 0, startAngle, endAngle, counterclockwise);
-        if (!this._hasCurrentPosition())
-            this._setCurrentPosition(...start);
-        else if (!this._currentPosition.equals(start)) {
-            const curve = new LineCurve(this._currentPosition.x, this._currentPosition.y, ...start);
-            this.add(curve);
+        [cx, cy, radius] = this._transformEllipse(cx, cy, radius, radius, 0);
+        const start = EllipseCurve.interpolate(0, cx, cy, radius, radius, 0, startAngle, endAngle, counterclockwise);
+        const end = EllipseCurve.interpolate(1, cx, cy, radius, radius, 0, startAngle, endAngle, counterclockwise);
+        if (this._hasCurrentPosition() && !this._currentPosition.equals(start)) {
+            const line = new LineCurve(this._currentPosition.x, this._currentPosition.y, ...start);
+            this.add(line);
         }
-        if (tRadius <= EPSILON)
+        if (radius <= EPSILON)
             return this;
-        const curve = new ArcCurve(tCx, tCy, tRadius, startAngle, endAngle, counterclockwise);
+        const curve = new ArcCurve(cx, cy, radius, startAngle, endAngle, counterclockwise);
         this.add(curve);
         this._setCurrentPosition(...end);
         return this;
     }
     /**
      * Draw an Arc curve from the current position, tangential to the 2 segments created by both control points
-     * Add an instance of {@link ArcCurve} to this path
+     * Add an instance of {@link EllipseCurve} to this path
      *
      * @param {number} x1 X-axis coordinate of the first control point
      * @param {number} y1 Y-axis coordinate of the first control point
@@ -285,8 +285,7 @@ export default class PathContext extends Path {
         const c = t1.clone().add(n1.clone().multiplyScalar(normalLength));
         const startAngle = Math.atan2(t1.y - c.y, t1.x - c.x);
         const endAngle = Math.atan2(t2.y - c.y, t2.x - c.x);
-        const deltaAngle = endAngle - startAngle;
-        const counterclockwise = deltaAngle < 0;
+        const counterclockwise = (p0.y - p1.y) * (p2.x - p0.x) <= (p0.x - p1.x) * (p2.y - p0.y);
         t1.applyMatrix(this._currentTransform);
         t2.applyMatrix(this._currentTransform);
         c.applyMatrix(this._currentTransform);
@@ -343,9 +342,8 @@ export default class PathContext extends Path {
         topRightRadius = Math.min(topRightRadius, maxRadius);
         bottomRightRadius = Math.min(bottomRightRadius, maxRadius);
         bottomLeftRadius = Math.min(bottomLeftRadius, maxRadius);
-        const curve = new PathContext({ autoClose: true });
+        const curve = new PathContext();
         curve.setTransform(this.getTransform());
-        this.add(curve);
         // Top-Right corner
         if (topRightRadius > 0) {
             curve.lineTo(x + width - topRightRadius, y);
@@ -378,6 +376,9 @@ export default class PathContext extends Path {
         else {
             curve.lineTo(x, y);
         }
+        curve.closePath();
+        this.add(curve);
+        this.moveTo(x, y);
         return this;
     }
     setTransform(a, b, c, d, e, f) {
@@ -426,43 +427,39 @@ export default class PathContext extends Path {
     }
     _setCurrentPosition(x, y) {
         this._currentPosition.set(x, y);
-        this._positionTransform = this.getTransform();
         return this;
     }
     // ****************************
     // Matrix transformations
     // ****************************
-    _transformPoint(point, matrix = this._currentTransform) {
-        if (matrix.isIdentity)
+    _transformPoint(point) {
+        if (this._isIdentity)
             return point;
-        const { x, y } = matrix.transformPoint({ x: point[0], y: point[1] });
+        const { x, y } = this._currentTransform.transformPoint({ x: point[0], y: point[1] });
         return [x, y];
     }
-    _transformPoints(points, matrix = this._currentTransform) {
-        if (matrix.isIdentity)
+    _transformPoints(points) {
+        if (this._isIdentity)
             return points;
-        return points.map((point) => this._transformPoint(point, matrix));
+        return points.map((point) => this._transformPoint(point));
     }
-    _transformVector(vector, matrix = this._currentTransform) {
-        if (matrix.isIdentity)
+    _transformVector(vector) {
+        if (this._isIdentity)
             return vector;
-        const [x0, y0] = this._transformPoint([0, 0], matrix);
-        const [vx, vy] = this._transformPoint(vector, matrix);
+        const [x0, y0] = this._transformPoint([0, 0]);
+        const [vx, vy] = this._transformPoint(vector);
         return [vx - x0, vy - y0];
     }
-    _transformEllipse(cx, cy, rx, ry, rotation, matrix = this._currentTransform) {
-        if (matrix.isIdentity)
+    _transformEllipse(cx, cy, rx, ry, rotation) {
+        if (this._isIdentity)
             return [cx, cy, rx, ry, rotation];
-        const [tCx, tCy] = this._transformPoint([cx, cy], matrix);
-        const [ux1, uy1] = this._transformVector([Math.cos(rotation) * rx, Math.sin(rotation) * rx], matrix);
-        const [ux2, uy2] = this._transformVector([-Math.sin(rotation) * ry, Math.cos(rotation) * ry], matrix);
-        const tRx = Math.hypot(ux1, uy1);
-        const tRy = Math.hypot(ux2, uy2);
-        const tRotation = Math.atan2(uy1, ux1);
-        return [tCx, tCy, tRx, tRy, tRotation];
-    }
-    _inversePoint(point, matrix = this._currentTransform) {
-        return this._transformPoint(point, matrix.inverse());
+        [cx, cy] = this._transformPoint([cx, cy]);
+        const [u1x, u1y] = this._transformVector([Math.cos(rotation) * rx, Math.sin(rotation) * rx]);
+        const [u2x, u2y] = this._transformVector([-Math.sin(rotation) * ry, Math.cos(rotation) * ry]);
+        rx = Math.hypot(u1x, u1y);
+        ry = Math.hypot(u2x, u2y);
+        rotation = Math.atan2(u1y, u1x);
+        return [cx, cy, rx, ry, rotation];
     }
     get _translateX() {
         return this._currentTransform.e;
@@ -482,20 +479,6 @@ export default class PathContext extends Path {
         const { a, b } = this._currentTransform;
         return Math.atan2(b, a);
     }
-    get _skewX() {
-        const { c, d } = this._currentTransform;
-        const cos = Math.cos(this._rotation);
-        const sin = Math.sin(this._rotation);
-        const m11 = c * cos + d * sin;
-        return Math.atan(m11 / this._scaleX);
-    }
-    get _skewY() {
-        const { a, b } = this._currentTransform;
-        const cos = Math.cos(this._rotation);
-        const sin = Math.sin(this._rotation);
-        const m21 = a * sin - b * cos;
-        return Math.atan(m21 / this._scaleY);
-    }
     get _isTranslated() {
         return Math.abs(this._translateX) > EPSILON || Math.abs(this._translateY) > EPSILON;
     }
@@ -506,12 +489,6 @@ export default class PathContext extends Path {
         const { b, c } = this._currentTransform;
         return Math.abs(b) > EPSILON || Math.abs(c) > EPSILON;
     }
-    get _isSkewed() {
-        const { a, b, c, d } = this._currentTransform;
-        const angleX = Math.atan2(b, a);
-        const angleY = Math.atan2(-c, d);
-        return Math.abs(angleX - angleY) > EPSILON;
-    }
     get _isUniform() {
         return Math.abs(this._scaleX - this._scaleY) <= EPSILON;
     }

package/lib/extras/paths/PathSVG.d.ts

@@ -2,9 +2,18 @@ import { Curve, LineCurve, PolylineCurve, QuadraticBezierCurve, CubicBezierCurve
 import { type Vector2 } from '../geometry';
 import PathContext from './PathContext';
 import Path from './Path';
-export type PathSVGSerializationParams = {
+/**
+ * Parameters used for SVG serialization of a path
+ */
+export type PathSVGSerializationParameters = {
+    /**
+     * Flag indicating if given curve should be approximated into straight lines
+     */
     approximate?: boolean;
-    curveResolution?: number;
+    /**
+     * Resolution used for approximations
+     */
+    resolution?: number;
 };
 /**
  * Utility class for manipulating connected curves and generating SVG path
@@ -19,10 +28,10 @@ export default class PathSVG extends PathContext {
     /**
      * Serialize this path into a SVG path string
      *
-     * @param {object} [params]
+     * @param {PathSVGSerializationParameters} [params] Serialization parameters
      * @returns {string}
      */
-    toString(params?: PathSVGSerializationParams): string;
+    toString(params?: PathSVGSerializationParameters): string;
     /**
      * Convert a {@link Curve} into spaced points
      *
@@ -35,77 +44,74 @@ export default class PathSVG extends PathContext {
      * Serialize a {@link Curve}
      *
      * @param {Curve} curve Curve to serialize
-     * @param {object} [params] Serialization parameters
-     * @param {boolean} [params.approximate]    Flag indicating if given curve should be approximated into straight lines
-     * @param {number} [params.curveResolution] Resolution used for curve approximations
-     * @returns string
+     * @param {PathSVGSerializationParameters} [params] Serialization parameters
+     * @returns {string}
      */
-    static serialize(curve: Curve<Vector2>, { approximate, curveResolution }?: PathSVGSerializationParams): string;
+    static serialize(curve: Curve<Vector2>, { approximate, resolution }?: PathSVGSerializationParameters): string;
     /**
      * Serialize a {@link LineCurve}
      *
      * @param {LineCurve} curve LineCurve to serialize
-     * @returns string
+     * @returns {string}
      */
     static serializeLineCurve(curve: LineCurve): string;
     /**
      * Serialize a {@link PolylineCurve}
      *
      * @param {PolylineCurve} curve PolylineCurve to serialize
-     * @returns string
+     * @returns {string}
      */
     static serializePolylineCurve(curve: PolylineCurve): string;
     /**
      * Serialize a {@link QuadraticBezierCurve}
      *
      * @param {QuadraticBezierCurve} curve QuadraticBezierCurve to serialize
-     * @returns string
+     * @returns {string}
      */
     static serializeQuadraticBezierCurve(curve: QuadraticBezierCurve): string;
     /**
      * Serialize a {@link CubicBezierCurve}
      *
      * @param {CubicBezierCurve} curve CubicBezierCurve to serialize
-     * @returns string
+     * @returns {string}
      */
     static serializeCubicBezierCurve(curve: CubicBezierCurve): string;
     /**
      * Serialize a {@link CatmullRomCurve} by approximating it into straight lines
      *
      * @param {CatmullRomCurve} curve CatmullRomCurve to serialize
-     * @param {number} [curveResolution] Approximation resolution
-     * @returns string
+     * @param {number} [resolution] Approximation resolution
+     * @returns {string}
      */
-    static serializeCatmullRomCurve(curve: CatmullRomCurve, curveResolution?: number): string;
+    static serializeCatmullRomCurve(curve: CatmullRomCurve, resolution?: number): string;
     /**
      * Serialize a {@link SplineCurve} by approximating it into straight lines
      *
      * @param {SplineCurve} curve SplineCurve to serialize
-     * @param {number} [curveResolution] Approximation resolution
-     * @returns string
+     * @param {number} [resolution] Approximation resolution
+     * @returns {string}
      */
-    static serializeSplineCurve(curve: SplineCurve, curveResolution?: number): string;
+    static serializeSplineCurve(curve: SplineCurve, resolution?: number): string;
     /**
      * Serialize an {@link EllipseCurve}
      *
      * @param {EllipseCurve} curve EllipseCurve to serialize
-     * @returns string
+     * @returns {string}
      */
     static serializeEllipseCurve(curve: EllipseCurve): string;
     /**
      * Serialize an {@link ArcCurve}
      *
      * @param {ArcCurve} curve ArcCurve to serialize
-     * @returns string
+     * @returns {string}
      */
     static serializeArcCurve(curve: ArcCurve): string;
     /**
      * Serialize an {@link Path}
      *
      * @param {Path} path Path to serialize
-     * @param {object} [params]
-     * @param {object} [params.curveResolution] Resolution used for curves approximations
-     * @returns string
+     * @param {PathSVGSerializationParameters} [params] Serialization parameters
+     * @returns {string}
      */
-    static serializePath(path: Path<Vector2>, params?: PathSVGSerializationParams): string;
+    static serializePath(path: Path<Vector2>, params?: PathSVGSerializationParameters): string;
 }

package/lib/extras/paths/PathSVG.js

@@ -16,10 +16,10 @@ export default class PathSVG extends PathContext {
     /**
      * Serialize this path into a SVG path string
      *
-     * @param {object} [params]
+     * @param {PathSVGSerializationParameters} [params] Serialization parameters
      * @returns {string}
      */
-    toString(params = {}) {
+    toString(params) {
         return PathSVG.serialize(this, params);
     }
     /**
@@ -37,42 +37,40 @@ export default class PathSVG extends PathContext {
      * Serialize a {@link Curve}
      *
      * @param {Curve} curve Curve to serialize
-     * @param {object} [params] Serialization parameters
-     * @param {boolean} [params.approximate]    Flag indicating if given curve should be approximated into straight lines
-     * @param {number} [params.curveResolution] Resolution used for curve approximations
-     * @returns string
+     * @param {PathSVGSerializationParameters} [params] Serialization parameters
+     * @returns {string}
      */
-    static serialize(curve, { approximate, curveResolution } = {}) {
+    static serialize(curve, { approximate, resolution } = {}) {
         if (curve instanceof Path) {
-            return PathSVG.serializePath(curve, { approximate, curveResolution });
+            return this.serializePath(curve, { approximate, resolution });
         }
         if (approximate === true) {
-            const points = PathSVG.approximate(curve, curveResolution);
+            const points = this.approximate(curve, resolution);
             return points.map(([x, y]) => `L${x},${y}`).join(' ');
         }
         if (curve instanceof LineCurve) {
-            return PathSVG.serializeLineCurve(curve);
+            return this.serializeLineCurve(curve);
         }
         if (curve instanceof PolylineCurve) {
-            return PathSVG.serializePolylineCurve(curve);
+            return this.serializePolylineCurve(curve);
         }
         if (curve instanceof QuadraticBezierCurve) {
-            return PathSVG.serializeQuadraticBezierCurve(curve);
+            return this.serializeQuadraticBezierCurve(curve);
         }
         if (curve instanceof CubicBezierCurve) {
-            return PathSVG.serializeCubicBezierCurve(curve);
+            return this.serializeCubicBezierCurve(curve);
         }
         if (curve instanceof CatmullRomCurve) {
-            return PathSVG.serializeCatmullRomCurve(curve, curveResolution);
+            return this.serializeCatmullRomCurve(curve, resolution);
         }
         if (curve instanceof SplineCurve) {
-            return PathSVG.serializeSplineCurve(curve, curveResolution);
+            return this.serializeSplineCurve(curve, resolution);
         }
         if (curve instanceof EllipseCurve) {
-            return PathSVG.serializeEllipseCurve(curve);
+            return this.serializeEllipseCurve(curve);
         }
         if (curve instanceof ArcCurve) {
-            return PathSVG.serializeArcCurve(curve);
+            return this.serializeArcCurve(curve);
         }
         return '';
     }
@@ -80,7 +78,7 @@ export default class PathSVG extends PathContext {
      * Serialize a {@link LineCurve}
      *
      * @param {LineCurve} curve LineCurve to serialize
-     * @returns string
+     * @returns {string}
      */
     static serializeLineCurve(curve) {
         const { x2, y2 } = curve;
@@ -90,7 +88,7 @@ export default class PathSVG extends PathContext {
      * Serialize a {@link PolylineCurve}
      *
      * @param {PolylineCurve} curve PolylineCurve to serialize
-     * @returns string
+     * @returns {string}
      */
     static serializePolylineCurve(curve) {
         const { points } = curve;
@@ -100,7 +98,7 @@ export default class PathSVG extends PathContext {
      * Serialize a {@link QuadraticBezierCurve}
      *
      * @param {QuadraticBezierCurve} curve QuadraticBezierCurve to serialize
-     * @returns string
+     * @returns {string}
      */
     static serializeQuadraticBezierCurve(curve) {
         const { cpx, cpy, x2, y2 } = curve;
@@ -110,7 +108,7 @@ export default class PathSVG extends PathContext {
      * Serialize a {@link CubicBezierCurve}
      *
      * @param {CubicBezierCurve} curve CubicBezierCurve to serialize
-     * @returns string
+     * @returns {string}
      */
     static serializeCubicBezierCurve(curve) {
         const { cp1x, cp1y, cp2x, cp2y, x2, y2 } = curve;
@@ -120,29 +118,29 @@ export default class PathSVG extends PathContext {
      * Serialize a {@link CatmullRomCurve} by approximating it into straight lines
      *
      * @param {CatmullRomCurve} curve CatmullRomCurve to serialize
-     * @param {number} [curveResolution] Approximation resolution
-     * @returns string
+     * @param {number} [resolution] Approximation resolution
+     * @returns {string}
      */
-    static serializeCatmullRomCurve(curve, curveResolution) {
-        const points = PathSVG.approximate(curve, curveResolution);
+    static serializeCatmullRomCurve(curve, resolution) {
+        const points = this.approximate(curve, resolution);
         return points.map(([x, y]) => `L${x},${y}`).join(' ');
     }
     /**
      * Serialize a {@link SplineCurve} by approximating it into straight lines
      *
      * @param {SplineCurve} curve SplineCurve to serialize
-     * @param {number} [curveResolution] Approximation resolution
-     * @returns string
+     * @param {number} [resolution] Approximation resolution
+     * @returns {string}
      */
-    static serializeSplineCurve(curve, curveResolution) {
-        const points = PathSVG.approximate(curve, curveResolution);
+    static serializeSplineCurve(curve, resolution) {
+        const points = this.approximate(curve, resolution);
         return points.map(([x, y]) => `L${x},${y}`).join(' ');
     }
     /**
      * Serialize an {@link EllipseCurve}
      *
      * @param {EllipseCurve} curve EllipseCurve to serialize
-     * @returns string
+     * @returns {string}
      */
     static serializeEllipseCurve(curve) {
         const { cx, cy, rx, ry, rotation, startAngle, endAngle, counterclockwise } = curve;
@@ -167,29 +165,28 @@ export default class PathSVG extends PathContext {
      * Serialize an {@link ArcCurve}
      *
      * @param {ArcCurve} curve ArcCurve to serialize
-     * @returns string
+     * @returns {string}
      */
     static serializeArcCurve(curve) {
-        return PathSVG.serializeEllipseCurve(curve);
+        return this.serializeEllipseCurve(curve);
     }
     /**
      * Serialize an {@link Path}
      *
      * @param {Path} path Path to serialize
-     * @param {object} [params]
-     * @param {object} [params.curveResolution] Resolution used for curves approximations
-     * @returns string
+     * @param {PathSVGSerializationParameters} [params] Serialization parameters
+     * @returns {string}
      */
-    static serializePath(path, params = {}) {
-        return path.subpaths
+    static serializePath(path, params) {
+        return path.curves
             .map((curve, index) => {
             let commands = ``;
-            const previousPoint = path.subpaths[index - 1]?.getPoint(1);
+            const previousPoint = path.curves[index - 1]?.getPoint(1);
             const newPoint = curve.getPoint(0);
             if (index === 0 || !previousPoint?.equals(newPoint)) {
                 commands += `M${newPoint.x},${newPoint.y}`;
             }
-            commands += PathSVG.serialize(curve, params);
+            commands += this.serialize(curve, params);
             return commands;
         })
             .join(' ');

package/lib/extras/paths/index.d.ts

@@ -1,3 +1,3 @@
 export { default as Path } from './Path';
 export { default as PathContext } from './PathContext';
-export { default as PathSVG, type PathSVGSerializationParams } from './PathSVG';
+export { default as PathSVG, type PathSVGSerializationParameters } from './PathSVG';