svg-path-commander 2.1.2 → 2.1.5

package/src/util/getPropertiesAtLength.ts

@@ -1,67 +0,0 @@
-import type { PathArray, PathSegment } from '../types';
-import type { SegmentProperties } from '../interface';
-import parsePathString from '../parser/parsePathString';
-import getTotalLength from './getTotalLength';
-
-/**
- * Returns the segment, its index and length as well as
- * the length to that segment at a given length in a path.
- *
- * @param pathInput target `pathArray`
- * @param distance the given length
- * @returns the requested properties
- */
-const getPropertiesAtLength = (pathInput: string | PathArray, distance?: number): SegmentProperties => {
-  const pathArray = parsePathString(pathInput);
-
-  let pathTemp = pathArray.slice(0) as PathArray;
-  let pathLength = getTotalLength(pathTemp);
-  let index = pathTemp.length - 1;
-  let lengthAtSegment = 0;
-  let length = 0;
-  let segment = pathArray[0] as PathSegment;
-
-  // If the path is empty, return 0.
-  if (index <= 0 || !distance || !Number.isFinite(distance)) {
-    return {
-      segment,
-      index: 0,
-      length,
-      lengthAtSegment,
-    };
-  }
-
-  if (distance >= pathLength) {
-    pathTemp = pathArray.slice(0, -1) as PathArray;
-    lengthAtSegment = getTotalLength(pathTemp);
-    length = pathLength - lengthAtSegment;
-    segment = pathArray[index];
-    return {
-      segment,
-      index,
-      length,
-      lengthAtSegment,
-    };
-  }
-
-  const segments = [] as SegmentProperties[];
-  while (index > 0) {
-    segment = pathTemp[index];
-    pathTemp = pathTemp.slice(0, -1) as PathArray;
-    lengthAtSegment = getTotalLength(pathTemp);
-    length = pathLength - lengthAtSegment;
-    pathLength = lengthAtSegment;
-
-    segments.push({
-      segment,
-      index,
-      length,
-      lengthAtSegment,
-    });
-    index -= 1;
-  }
-
-  return segments.find(({ lengthAtSegment: l }) => l <= distance) as SegmentProperties;
-};
-
-export default getPropertiesAtLength;

package/src/util/getPropertiesAtPoint.ts

@@ -1,84 +0,0 @@
-import type { PathArray, Point } from '../types';
-import type { PointProperties } from '../interface';
-import getPointAtLength from './getPointAtLength';
-import getPropertiesAtLength from './getPropertiesAtLength';
-import getTotalLength from './getTotalLength';
-import parsePathString from '../parser/parsePathString';
-import normalizePath from '../process/normalizePath';
-
-/**
- * Returns the point and segment in path closest to a given point as well as
- * the distance to the path stroke.
- *
- * @see https://bl.ocks.org/mbostock/8027637
- *
- * @param pathInput target `pathArray`
- * @param point the given point
- * @returns the requested properties
- */
-const getPropertiesAtPoint = (pathInput: string | PathArray, point: Point): PointProperties => {
-  const path = parsePathString(pathInput);
-  const normalPath = normalizePath(path);
-  const pathLength = getTotalLength(normalPath);
-  const distanceTo = (p: Point) => {
-    const dx = p.x - point.x;
-    const dy = p.y - point.y;
-    return dx * dx + dy * dy;
-  };
-  let precision = 8;
-  let scan: Point;
-  let closest = { x: 0, y: 0 }; // make TS happy
-  let scanDistance = 0;
-  let bestLength = 0;
-  let bestDistance = Infinity;
-
-  // linear scan for coarse approximation
-  for (let scanLength = 0; scanLength <= pathLength; scanLength += precision) {
-    scan = getPointAtLength(normalPath, scanLength);
-    scanDistance = distanceTo(scan);
-
-    if (scanDistance < bestDistance) {
-      closest = scan;
-      bestLength = scanLength;
-      bestDistance = scanDistance;
-    }
-  }
-
-  // binary search for precise estimate
-  precision /= 2;
-  let before: { x: number; y: number };
-  let after: { x: number; y: number };
-  let beforeLength = 0;
-  let afterLength = 0;
-  let beforeDistance = 0;
-  let afterDistance = 0;
-
-  while (precision > 0.000001) {
-    beforeLength = bestLength - precision;
-    before = getPointAtLength(normalPath, beforeLength);
-    beforeDistance = distanceTo(before);
-    afterLength = bestLength + precision;
-    after = getPointAtLength(normalPath, afterLength);
-    afterDistance = distanceTo(after);
-
-    if (beforeLength >= 0 && beforeDistance < bestDistance) {
-      closest = before;
-      bestLength = beforeLength;
-      bestDistance = beforeDistance;
-    } else if (afterLength <= pathLength && afterDistance < bestDistance) {
-      closest = after;
-      bestLength = afterLength;
-      bestDistance = afterDistance;
-    } else {
-      precision /= 2;
-    }
-    if (precision < 0.00001) break;
-  }
-
-  const segment = getPropertiesAtLength(path, bestLength);
-  const distance = Math.sqrt(bestDistance);
-
-  return { closest, distance, segment };
-};
-
-export default getPropertiesAtPoint;

package/src/util/getSegmentAtLength.ts

@@ -1,15 +0,0 @@
-import type { PathArray, PathSegment } from '../types';
-import getPropertiesAtLength from './getPropertiesAtLength';
-
-/**
- * Returns the segment at a given length.
- *
- * @param pathInput the target `pathArray`
- * @param distance the distance in path to look at
- * @returns the requested segment
- */
-const getSegmentAtLength = (pathInput: string | PathArray, distance?: number): PathSegment | undefined => {
-  return getPropertiesAtLength(pathInput, distance).segment;
-};
-
-export default getSegmentAtLength;

package/src/util/getSegmentOfPoint.ts

@@ -1,18 +0,0 @@
-import type { SegmentProperties } from '../interface';
-import type { PathArray } from '../types';
-import getPropertiesAtPoint from './getPropertiesAtPoint';
-
-/**
- * Returns the path segment which contains a given point.
- *
- * @param path the `pathArray` to look into
- * @param point the point of the shape to look for
- * @returns the requested segment
- */
-const getSegmentOfPoint = (
-  path: string | PathArray,
-  point: { x: number; y: number },
-): SegmentProperties | undefined => {
-  return getPropertiesAtPoint(path, point).segment;
-};
-export default getSegmentOfPoint;

package/src/util/getTotalLength.ts

@@ -1,68 +0,0 @@
-import type { MSegment, PathArray } from '../types';
-import { getLineLength } from '../math/lineTools';
-import { getArcLength } from '../math/arcTools';
-import { getCubicLength } from '../math/cubicTools';
-import { getQuadLength } from '../math/quadTools';
-import iterate from '../process/iterate';
-// import normalizePath from '../process/normalizePath';
-import parsePathString from '../parser/parsePathString';
-import paramsParser from '../parser/paramsParser';
-import normalizeSegment from '../process/normalizeSegment';
-
-/**
- * Returns the shape total length, or the equivalent to `shape.getTotalLength()`.
- *
- * The `normalizePath` version is lighter, faster, more efficient and more accurate
- * with paths that are not `curveArray`.
- *
- * @param pathInput the target `pathArray`
- * @returns the shape total length
- */
-const getTotalLength = (pathInput: string | PathArray) => {
-  const path = parsePathString(pathInput);
-  const params = { ...paramsParser };
-
-  let isM = false;
-  let data = [] as number[];
-  let pathCommand = 'M';
-  let mx = 0;
-  let my = 0;
-  let totalLength = 0;
-
-  iterate(path, (seg, _, lastX, lastY) => {
-    params.x = lastX;
-    params.y = lastY;
-    const normalSegment = normalizeSegment(seg, params);
-    [pathCommand] = normalSegment;
-    isM = pathCommand === 'M';
-    data = !isM ? [lastX, lastY].concat(normalSegment.slice(1) as number[]) : data;
-
-    // this segment is always ZERO
-    /* istanbul ignore else @preserve */
-    if (isM) {
-      // remember mx, my for Z
-      [, mx, my] = normalSegment as MSegment;
-    } else if (pathCommand === 'L') {
-      totalLength += getLineLength(data[0], data[1], data[2], data[3]);
-    } else if (pathCommand === 'A') {
-      totalLength += getArcLength(data[0], data[1], data[2], data[3], data[4], data[5], data[6], data[7], data[8]);
-    } else if (pathCommand === 'C') {
-      totalLength += getCubicLength(data[0], data[1], data[2], data[3], data[4], data[5], data[6], data[7]);
-    } else if (pathCommand === 'Q') {
-      totalLength += getQuadLength(data[0], data[1], data[2], data[3], data[4], data[5]);
-    } else if (pathCommand === 'Z') {
-      data = [lastX, lastY, mx, my];
-      totalLength += getLineLength(data[0], data[1], data[2], data[3]);
-    }
-
-    const seglen = normalSegment.length;
-    params.x1 = +normalSegment[seglen - 2];
-    params.y1 = +normalSegment[seglen - 1];
-    params.x2 = +normalSegment[seglen - 4] || params.x1;
-    params.y2 = +normalSegment[seglen - 3] || params.y1;
-  });
-
-  return totalLength;
-};
-
-export default getTotalLength;

package/src/util/isAbsoluteArray.ts

@@ -1,18 +0,0 @@
-import type { AbsoluteArray } from '../types';
-import isPathArray from './isPathArray';
-
-/**
- * Iterates an array to check if it's a `pathArray`
- * with all absolute values.
- *
- * @param path the `pathArray` to be checked
- * @returns iteration result
- */
-const isAbsoluteArray = (path: unknown): path is AbsoluteArray => {
-  return (
-    isPathArray(path) &&
-    // `isPathArray` also checks if it's `Array`
-    path.every(([x]) => x === x.toUpperCase())
-  );
-};
-export default isAbsoluteArray;

package/src/util/isCurveArray.ts

@@ -1,15 +0,0 @@
-import { CurveArray } from '../types';
-import isNormalizedArray from './isNormalizedArray';
-
-/**
- * Iterates an array to check if it's a `pathArray`
- * with all C (cubic bezier) segments.
- *
- * @param path the `Array` to be checked
- * @returns iteration result
- */
-const isCurveArray = (path: unknown): path is CurveArray => {
-  // `isPathArray` also checks if it's `Array`
-  return isNormalizedArray(path) && path.every(([pc]) => 'MC'.includes(pc));
-};
-export default isCurveArray;

package/src/util/isNormalizedArray.ts

@@ -1,16 +0,0 @@
-import type { NormalArray } from '../types';
-import isAbsoluteArray from './isAbsoluteArray';
-
-/**
- * Iterates an array to check if it's a `pathArray`
- * with all segments are in non-shorthand notation
- * with absolute values.
- *
- * @param {string | SVGPath.pathArray} path the `pathArray` to be checked
- * @returns {boolean} iteration result
- */
-const isNormalizedArray = (path: unknown): path is NormalArray => {
-  // `isAbsoluteArray` also checks if it's `Array`
-  return isAbsoluteArray(path) && path.every(([pc]) => 'ACLMQZ'.includes(pc));
-};
-export default isNormalizedArray;

package/src/util/isPathArray.ts

@@ -1,24 +0,0 @@
-import type { PathArray, PathSegment, RelativeCommand } from '../types';
-import paramsCount from '../parser/paramsCount';
-
-/**
- * Iterates an array to check if it's an actual `pathArray`.
- *
- * @param path the `pathArray` to be checked
- * @returns iteration result
- */
-const isPathArray = (path: unknown): path is PathArray => {
-  return (
-    Array.isArray(path) &&
-    path.every((seg: PathSegment) => {
-      const lk = seg[0].toLowerCase() as RelativeCommand;
-      return (
-        paramsCount[lk] === seg.length - 1 &&
-        'achlmqstvz'.includes(lk) &&
-        (seg.slice(1) as unknown[]).every(Number.isFinite)
-      );
-    }) &&
-    path.length > 0
-  );
-};
-export default isPathArray;

package/src/util/isPointInStroke.ts

@@ -1,16 +0,0 @@
-import type { PathArray } from '../types';
-import getPropertiesAtPoint from './getPropertiesAtPoint';
-import DISTANCE_EPSILON from './distanceEpsilon';
-
-/**
- * Checks if a given point is in the stroke of a path.
- *
- * @param pathInput target path
- * @param point the given `{x,y}` point
- * @returns the query result
- */
-const isPointInStroke = (pathInput: string | PathArray, point: { x: number; y: number }) => {
-  const { distance } = getPropertiesAtPoint(pathInput, point);
-  return Math.abs(distance) < DISTANCE_EPSILON; // 0.01 might be more permissive
-};
-export default isPointInStroke;

package/src/util/isRelativeArray.ts

@@ -1,18 +0,0 @@
-import type { RelativeArray } from '../types';
-import isPathArray from './isPathArray';
-
-/**
- * Iterates an array to check if it's a `pathArray`
- * with relative values.
- *
- * @param path the `pathArray` to be checked
- * @returns iteration result
- */
-const isRelativeArray = (path: unknown): path is RelativeArray => {
-  return (
-    isPathArray(path) &&
-    // `isPathArray` checks if it's `Array`
-    path.slice(1).every(([pc]) => pc === pc.toLowerCase())
-  );
-};
-export default isRelativeArray;

package/src/util/isValidPath.ts

@@ -1,27 +0,0 @@
-import scanSegment from '../parser/scanSegment';
-import skipSpaces from '../parser/skipSpaces';
-import PathParser from '../parser/pathParser';
-
-/**
- * Parses a path string value to determine its validity
- * then returns true if it's valid or false otherwise.
- *
- * @param pathString the path string to be parsed
- * @returns the path string validity
- */
-const isValidPath = (pathString: string) => {
-  if (typeof pathString !== 'string' || !pathString.length) {
-    return false;
-  }
-
-  const path = new PathParser(pathString);
-
-  skipSpaces(path);
-
-  while (path.index < path.max && !path.err.length) {
-    scanSegment(path);
-  }
-
-  return !path.err.length && 'mM'.includes(path.segments[0][0]);
-};
-export default isValidPath;

package/src/util/shapeParams.ts

@@ -1,16 +0,0 @@
-import type { ShapeParams } from '../interface';
-
-/**
- * Supported shapes and their specific parameters.
- */
-const shapeParams: ShapeParams = {
-  line: ['x1', 'y1', 'x2', 'y2'],
-  circle: ['cx', 'cy', 'r'],
-  ellipse: ['cx', 'cy', 'rx', 'ry'],
-  rect: ['width', 'height', 'x', 'y', 'rx', 'ry'],
-  polygon: ['points'],
-  polyline: ['points'],
-  glyph: ['d'],
-};
-
-export default shapeParams;

package/src/util/shapeToPath.ts

@@ -1,86 +0,0 @@
-import type { ShapeParams } from '../interface';
-import type { ShapeOps, ShapeTypes } from '../types';
-import pathToString from '../convert/pathToString';
-import defaultOptions from '../options/options';
-import error from '../parser/error';
-import isValidPath from './isValidPath';
-import shapeToPathArray from './shapeToPathArray';
-import shapeParams from './shapeParams';
-
-/**
- * Returns a new `<path>` element created from attributes of a `<line>`, `<polyline>`,
- * `<polygon>`, `<rect>`, `<ellipse>`, `<circle>` or `<glyph>`. If `replace` parameter
- * is `true`, it will replace the target. The default `ownerDocument` is your current
- * `document` browser page, if you want to use in server-side using `jsdom`, you can
- * pass the `jsdom` `document` to `ownDocument`.
- *
- * It can also work with an options object, see the type below
- *
- * @see ShapeOps
- *
- * The newly created `<path>` element keeps all non-specific
- * attributes like `class`, `fill`, etc.
- *
- * @param element target shape
- * @param replace option to replace target
- * @param ownerDocument document for create element
- * @return the newly created `<path>` element
- */
-const shapeToPath = (
-  element: ShapeTypes | ShapeOps,
-  replace?: boolean,
-  ownerDocument?: Document,
-): SVGPathElement | false => {
-  const doc = ownerDocument || document;
-  const win = doc.defaultView || /* istanbul ignore next */ window;
-  const supportedShapes = Object.keys(shapeParams) as (keyof ShapeParams)[];
-  const targetIsElement = element instanceof win.SVGElement;
-  const tagName = targetIsElement ? element.tagName : null;
-
-  if (tagName === 'path') throw TypeError(`${error}: "${tagName}" is already SVGPathElement`);
-  if (tagName && supportedShapes.every(s => tagName !== s)) throw TypeError(`${error}: "${tagName}" is not SVGElement`);
-
-  const path = doc.createElementNS('http://www.w3.org/2000/svg', 'path');
-  const type = (targetIsElement ? tagName : element.type) as ShapeOps['type'];
-  const shapeAttrs = shapeParams[type] as string[];
-  const config = { type } as Record<string, string>;
-
-  // set d
-  const round = defaultOptions.round as number;
-  const pathArray = shapeToPathArray(element, doc);
-  const description = pathArray && pathArray.length ? pathToString(pathArray, round) : '';
-
-  if (targetIsElement) {
-    shapeAttrs.forEach(p => {
-      config[p] = element.getAttribute(p) as string;
-    });
-    // set no-specific shape attributes: fill, stroke, etc
-    Object.values(element.attributes).forEach(({ name, value }) => {
-      if (!shapeAttrs.includes(name)) path.setAttribute(name, value);
-    });
-  } else {
-    Object.assign(config, element);
-    // set no-specific shape attributes: fill, stroke, etc
-    Object.keys(config).forEach(k => {
-      if (!shapeAttrs.includes(k) && k !== 'type') {
-        path.setAttribute(
-          k.replace(/[A-Z]/g, m => `-${m.toLowerCase()}`),
-          config[k],
-        );
-      }
-    });
-  }
-
-  // replace target element
-  if (isValidPath(description)) {
-    path.setAttribute('d', description);
-    if (replace && targetIsElement) {
-      element.before(path, element);
-      element.remove();
-    }
-    return path;
-  }
-  return false;
-};
-
-export default shapeToPath;

package/src/util/shapeToPathArray.ts

@@ -1,183 +0,0 @@
-import type { CircleAttr, EllipseAttr, GlyphAttr, LineAttr, PolyAttr, RectAttr, ShapeParams } from '../interface';
-import type { PathArray, PathSegment, ShapeOps, ShapeTypes } from '../types';
-import error from '../parser/error';
-import parsePathString from '../parser/parsePathString';
-import shapeParams from './shapeParams';
-import isPathArray from './isPathArray';
-
-/**
- * Returns a new `pathArray` from line attributes.
- *
- * @param attr shape configuration
- * @returns a new line `pathArray`
- */
-export const getLinePath = (attr: LineAttr): PathArray => {
-  let { x1, y1, x2, y2 } = attr;
-  [x1, y1, x2, y2] = [x1, y1, x2, y2].map(a => +a);
-  return [
-    ['M', x1, y1],
-    ['L', x2, y2],
-  ];
-};
-
-/**
- * Returns a new `pathArray` like from polyline/polygon attributes.
- *
- * @param attr shape configuration
- * @return a new polygon/polyline `pathArray`
- */
-export const getPolyPath = (attr: PolyAttr): PathArray => {
-  const pathArray = [] as PathSegment[];
-  const points = (attr.points || '')
-    .trim()
-    .split(/[\s|,]/)
-    .map(a => +a);
-
-  let index = 0;
-  while (index < points.length) {
-    pathArray.push([index ? 'L' : 'M', points[index], points[index + 1]]);
-    index += 2;
-  }
-
-  return (attr.type === 'polygon' ? [...pathArray, ['z']] : pathArray) as PathArray;
-};
-
-/**
- * Returns a new `pathArray` from circle attributes.
- *
- * @param attr shape configuration
- * @return a circle `pathArray`
- */
-export const getCirclePath = (attr: CircleAttr): PathArray => {
-  let { cx, cy, r } = attr;
-  [cx, cy, r] = [cx, cy, r].map(a => +a);
-
-  return [
-    ['M', cx - r, cy],
-    ['a', r, r, 0, 1, 0, 2 * r, 0],
-    ['a', r, r, 0, 1, 0, -2 * r, 0],
-  ];
-};
-
-/**
- * Returns a new `pathArray` from ellipse attributes.
- *
- * @param attr shape configuration
- * @return an ellipse `pathArray`
- */
-export const getEllipsePath = (attr: EllipseAttr): PathArray => {
-  let { cx, cy } = attr;
-  let rx = attr.rx || 0;
-  let ry = attr.ry || rx;
-  [cx, cy, rx, ry] = [cx, cy, rx, ry].map(a => +a);
-
-  return [
-    ['M', cx - rx, cy],
-    ['a', rx, ry, 0, 1, 0, 2 * rx, 0],
-    ['a', rx, ry, 0, 1, 0, -2 * rx, 0],
-  ];
-};
-
-/**
- * Returns a new `pathArray` like from rect attributes.
- *
- * @param attr object with properties above
- * @return a new `pathArray` from `<rect>` attributes
- */
-export const getRectanglePath = (attr: RectAttr): PathArray => {
-  const x = +attr.x || 0;
-  const y = +attr.y || 0;
-  const w = +attr.width;
-  const h = +attr.height;
-  let rx = +(attr.rx || 0);
-  let ry = +(attr.ry || rx);
-
-  // Validity checks from http://www.w3.org/TR/SVG/shapes.html#RectElement:
-  if (rx || ry) {
-    // rx = !rx ? ry : rx;
-    // ry = !ry ? rx : ry;
-
-    /* istanbul ignore else @preserve */
-    if (rx * 2 > w) rx -= (rx * 2 - w) / 2;
-    /* istanbul ignore else @preserve */
-    if (ry * 2 > h) ry -= (ry * 2 - h) / 2;
-
-    return [
-      ['M', x + rx, y],
-      ['h', w - rx * 2],
-      ['s', rx, 0, rx, ry],
-      ['v', h - ry * 2],
-      ['s', 0, ry, -rx, ry],
-      ['h', -w + rx * 2],
-      ['s', -rx, 0, -rx, -ry],
-      ['v', -h + ry * 2],
-      ['s', 0, -ry, rx, -ry],
-    ];
-  }
-
-  return [['M', x, y], ['h', w], ['v', h], ['H', x], ['Z']];
-};
-
-/**
- * Returns a new `pathArray` created from attributes of a `<line>`, `<polyline>`,
- * `<polygon>`, `<rect>`, `<ellipse>`, `<circle>`, <path> or `<glyph>`.
- *
- * The default `ownerDocument` is your current `document` browser page,
- * if you want to use in server-side using `jsdom`, you can pass the
- * `jsdom` `document` to `ownDocument`.
- *
- * It can also work with an options object, see the type below
- *
- * @see ShapeOps
- *
- * @param element target shape
- * @param ownerDocument document for create element
- * @return the newly created `<path>` element
- */
-const shapeToPathArray = (element: ShapeTypes | ShapeOps, ownerDocument?: Document) => {
-  const doc = ownerDocument || document;
-  const win = doc.defaultView || /* istanbul ignore next */ window;
-  const supportedShapes = Object.keys(shapeParams) as (keyof ShapeParams)[];
-  const targetIsElement = element instanceof win.SVGElement;
-  const tagName = targetIsElement ? element.tagName : null;
-
-  if (tagName && [...supportedShapes, 'path'].every(s => tagName !== s)) {
-    throw TypeError(`${error}: "${tagName}" is not SVGElement`);
-  }
-
-  const type = (targetIsElement ? tagName : element.type) as ShapeOps['type'];
-  const shapeAttrs = shapeParams[type] as string[];
-  const config = { type } as Record<string, string>;
-
-  if (targetIsElement) {
-    shapeAttrs.forEach(p => {
-      config[p] = element.getAttribute(p) as string;
-    });
-  } else {
-    Object.assign(config, element);
-  }
-
-  // set d
-  let pathArray = [] as unknown as PathArray;
-
-  /* istanbul ignore else */
-  if (type === 'circle') pathArray = getCirclePath(config as unknown as CircleAttr);
-  else if (type === 'ellipse') pathArray = getEllipsePath(config as unknown as EllipseAttr);
-  else if (['polyline', 'polygon'].includes(type)) pathArray = getPolyPath(config as unknown as PolyAttr);
-  else if (type === 'rect') pathArray = getRectanglePath(config as unknown as RectAttr);
-  else if (type === 'line') pathArray = getLinePath(config as unknown as LineAttr);
-  else if (['glyph', 'path'].includes(type)) {
-    pathArray = parsePathString(
-      targetIsElement
-        ? element.getAttribute('d') || /* istanbul ignore next @preserve */ ''
-        : (element as GlyphAttr).d || '',
-    );
-  }
-
-  // replace target element
-  if (isPathArray(pathArray) && pathArray.length) {
-    return pathArray;
-  }
-  return false;
-};
-export default shapeToPathArray;