@joint/core 4.1.3 → 4.2.0-alpha.1

package/src/g/rect.mjs

@@ -369,6 +369,13 @@ Rect.prototype = {
         return this;
     },
 
+    moveAroundPoint: function(origin, angle) {
+        const newCenter = this.center().rotate(origin, angle);
+        this.x = newCenter.x - this.width / 2;
+        this.y = newCenter.y - this.height / 2;
+        return this;
+    },
+
     // Normalize the rectangle; i.e., make it so that it has a non-negative width and height.
     // If width < 0 the function swaps the left and right corners,
     // and it swaps the top and bottom corners if height < 0

package/src/highlighters/stroke.mjs

@@ -35,7 +35,7 @@ export const stroke = HighlighterView.extend({
                     d = d.substr(0, secondSubpathIndex);
                 }
             }
-        } catch (error) {
+        } catch {
             // Failed to get path data from magnet element.
             // Draw a rectangle around the node instead.
             const nodeBBox = cellView.getNodeBoundingRect(node);

package/src/layout/ports/port.mjs

@@ -1,6 +1,28 @@
 import * as g from '../../g/index.mjs';
 import * as util from '../../util/index.mjs';
 
+function parseCoordinate(coordinate, dimension, bbox, value) {
+
+    if (util.isPercentage(value)) {
+        return parseFloat(value) / 100 * bbox[dimension];
+    }
+
+    if (util.isCalcExpression(value)) {
+        return Number(util.evalCalcExpression(value, bbox));
+    }
+
+    if (typeof value === 'string') {
+        const num = Number(value);
+        if (isNaN(num)) {
+            throw new TypeError(
+                `Cannot convert port coordinate ${coordinate}: "${value}" to a number`
+            );
+        }
+        return num;
+    }
+    return value;
+}
+
 function portTransformAttrs(point, angle, opt) {
 
     var trans = point.toJSON();
@@ -52,20 +74,14 @@ function ellipseLayout(ports, elBBox, startAngle, stepFn) {
     });
 }
 
-
 function argTransform(bbox, args) {
     let { x, y, angle } = args;
-    if (util.isPercentage(x)) {
-        x = parseFloat(x) / 100 * bbox.width;
-    } else if (util.isCalcExpression(x)) {
-        x = Number(util.evalCalcExpression(x, bbox));
-    }
-    if (util.isPercentage(y)) {
-        y = parseFloat(y) / 100 * bbox.height;
-    } else if (util.isCalcExpression(y)) {
-        y = Number(util.evalCalcExpression(y, bbox));
-    }
-    return { x, y, angle };
+
+    return {
+        x: parseCoordinate('x', 'width', bbox, x),
+        y: parseCoordinate('y', 'height', bbox, y),
+        angle
+    };
 }
 
 // Creates a point stored in arguments
@@ -74,14 +90,13 @@ function argPoint(bbox, args) {
     return new g.Point(x || 0, y || 0);
 }
 
-
 /**
  * @param {Array<Object>} ports
  * @param {g.Rect} elBBox
  * @param {Object=} opt opt Group options
  * @returns {Array<g.Point>}
  */
-export const absolute = function(ports, elBBox) {
+export const absolute = function(ports, elBBox, opt) {
     return ports.map(port => {
         const transformation = argPoint(elBBox, port).round().toJSON();
         transformation.angle = port.angle || 0;
@@ -90,6 +105,7 @@ export const absolute = function(ports, elBBox) {
 };
 
 /**
+ * @deprecated
  * @param {Array<Object>} ports
  * @param {g.Rect} elBBox
  * @param {Object=} opt opt Group options
@@ -184,4 +200,3 @@ export const ellipse = function(ports, elBBox, opt) {
         return (index + 0.5 - count / 2) * stepAngle;
     });
 };
-

package/src/layout/ports/portLabel.mjs

@@ -167,7 +167,7 @@ function radialLayout(portCenterOffset, autoOrient, opt) {
     });
 }
 
-export const manual = function(_portPosition, _elBBox, opt) {
+export const manual = function(portPosition, elBBox, opt) {
     return labelAttributes(opt);
 };
 

package/src/linkAnchors/index.mjs

@@ -40,7 +40,7 @@ function _connectionClosest(view, _magnet, refPoint, _opt) {
 }
 
 export function resolveRef(fn) {
-    return function(view, magnet, ref, opt) {
+    return function(view, magnet, ref, opt, endType, linkView) {
         if (ref instanceof Element) {
             var refView = this.paper.findView(ref);
             var refPoint;
@@ -55,7 +55,7 @@ export function resolveRef(fn) {
                 // Something went wrong
                 refPoint = new Point();
             }
-            return fn.call(this, view, magnet, refPoint, opt);
+            return fn.call(this, view, magnet, refPoint, opt, endType, linkView);
         }
         return fn.apply(this, arguments);
     };

package/src/linkTools/Anchor.mjs

@@ -118,7 +118,7 @@ const Anchor = ToolView.extend({
             bbox = view.getNodeUnrotatedBBox(magnet);
             angle = model.angle();
             center = bbox.center();
-            if (angle) center.rotate(model.getBBox().center(), -angle);
+            if (angle) center.rotate(model.getCenter(), -angle);
             // TODO: get the link's magnet rotation into account
         }
         bbox.inflate(padding);
@@ -185,7 +185,7 @@ const Anchor = ToolView.extend({
                 // snap coords within node bbox
                 var bbox = view.getNodeUnrotatedBBox(magnet);
                 var angle = model.angle();
-                var origin = model.getBBox().center();
+                var origin = model.getCenter();
                 var rotatedCoords = coords.clone().rotate(origin, angle);
                 if (!bbox.containsPoint(rotatedCoords)) {
                     coords = bbox.pointNearestToPoint(rotatedCoords).rotate(origin, -angle);

package/src/linkTools/Vertices.mjs

@@ -221,18 +221,16 @@ export const Vertices = ToolView.extend({
     onHandleChanged: function(_handle, evt) {
         const { options, relatedView: linkView } = this;
         if (options.vertexAdding) this.updatePath();
-        if (!options.redundancyRemoval) {
-            linkView.checkMouseleave(util.normalizeEvent(evt));
-            return;
+        if (options.redundancyRemoval) {
+            const verticesRemoved = linkView.removeRedundantLinearVertices({ ui: true, tool: this.cid });
+            if (verticesRemoved) this.render();
         }
-        var verticesRemoved = linkView.removeRedundantLinearVertices({ ui: true, tool: this.cid });
-        if (verticesRemoved) this.render();
         this.blur();
         linkView.model.stopBatch('vertex-move', { ui: true, tool: this.cid });
         if (this.eventData(evt).vertexAdded) {
             linkView.model.stopBatch('vertex-add', { ui: true, tool: this.cid });
         }
-        var [normalizedEvt, x, y] = linkView.paper.getPointerArgs(evt);
+        const [normalizedEvt, x, y] = linkView.paper.getPointerArgs(evt);
         if (!options.stopPropagation) linkView.notifyPointerup(normalizedEvt, x, y);
         linkView.checkMouseleave(normalizedEvt);
     },

package/src/mvc/View.mjs

@@ -18,8 +18,12 @@ export const View = ViewBase.extend({
 
     DETACHABLE: true,
     UPDATE_PRIORITY: 2,
+
+    /** @deprecated is no longer used (moved to Paper) */
     FLAG_INSERT: 1<<30,
+    /** @deprecated is no longer used */
     FLAG_REMOVE: 1<<29,
+    /** @deprecated is no longer used */
     FLAG_INIT: 1<<28,
 
     constructor: function(options) {

package/src/mvc/ViewBase.mjs

@@ -24,7 +24,7 @@ import {
 // Creating a ViewBase creates its initial element outside of the DOM,
 // if an existing element is not provided...
 export var ViewBase = function(options) {
-    this.cid = uniqueId('view');
+    this.cid = (options && options.cid) || uniqueId('view');
     this.preinitialize.apply(this, arguments);
     assign(this, pick(options, viewOptions));
     this._ensureElement();

package/src/util/util.mjs

@@ -821,7 +821,7 @@ export const sanitizeHTML = function(html) {
             const value = node.getAttribute(name);
             // Remove attribute names that start with "on" (e.g. onload, onerror...).
             // Remove attribute values that start with "javascript:" pseudo protocol (e.g. `href="javascript:alert(1)"`).
-            if (name.startsWith('on') || value.startsWith('javascript:' || value.startsWith('data:') || value.startsWith('vbscript:'))) {
+            if (name.startsWith('on') || value.startsWith('javascript:') || value.startsWith('data:') || value.startsWith('vbscript:')) {
                 node.removeAttribute(name);
             }
         });

package/src/util/utilHelpers.mjs

@@ -105,6 +105,7 @@ const rsOrdUpper = '\\d*(?:1ST|2ND|3RD|(?![123])\\dTH)(?=\\b|[a-z_])';
 const rsSeq = rsOptVar + reOptMod + rsOptJoin;
 const rsEmoji = `(?:${[rsDingbat, rsRegional, rsSurrPair].join('|')})${rsSeq}`;
 
+// eslint-disable-next-line no-misleading-character-class
 const reUnicodeWords = RegExp([
     `${rsUpper}?${rsLower}+${rsOptContrLower}(?=${[rsBreak, rsUpper, '$'].join('|')})`,
     `${rsMiscUpper}+${rsOptContrUpper}(?=${[rsBreak, rsUpper + rsMiscLower, '$'].join('|')})`,
@@ -130,6 +131,7 @@ const rsNonAstralCombo = `${rsNonAstral}${rsCombo}?`;
 const rsSymbol = `(?:${[rsNonAstralCombo, rsCombo, rsRegional, rsSurrPair, rsAstral].join('|')})`;
 
 // Used to match [string symbols](https://mathiasbynens.be/notes/javascript-unicode)
+// eslint-disable-next-line no-misleading-character-class
 const reUnicode = RegExp(`${rsFitz}(?=${rsFitz})|${rsSymbol + rsSeq}`, 'g');
 
 const reIsDeepProp = /\.|\[(?:[^[\]]*|(["'])(?:(?!\1)[^\\]|\\.)*?\1)\]/;

package/types/geometry.d.ts

@@ -12,12 +12,16 @@ export namespace g {
     }
 
     export type Shape = Path | Point | Line | Polyline | Polygon | Rect | Ellipse;
+
     export interface PlainPoint {
 
         x: number;
         y: number;
     }
 
+    /** Can be understood by `g.Point` constructor */
+    export type PointInit = Partial<PlainPoint> | string;
+
     export interface PlainRect {
 
         x: number;
@@ -77,15 +81,15 @@ export namespace g {
 
         clone(): Segment;
 
-        closestPoint(p: Point, opt?: SubdivisionsOpt): Point;
+        closestPoint(p: PlainPoint, opt?: SubdivisionsOpt): Point;
 
-        closestPointLength(p: Point, opt?: SubdivisionsOpt): number;
+        closestPointLength(p: PlainPoint, opt?: SubdivisionsOpt): number;
 
-        closestPointNormalizedLength(p: Point, opt?: SubdivisionsOpt): number;
+        closestPointNormalizedLength(p: PlainPoint, opt?: SubdivisionsOpt): number;
 
-        closestPointT(p: Point): number;
+        closestPointT(p: PlainPoint): number;
 
-        closestPointTangent(p: Point): Line | null;
+        closestPointTangent(p: PlainPoint): Line | null;
 
         divideAt(ratio: number, opt?: SubdivisionsOpt): [Segment, Segment];
 
@@ -111,7 +115,7 @@ export namespace g {
 
         round(precision?: number): this;
 
-        scale(sx: number, sy: number, origin?: PlainPoint): this;
+        scale(sx: number, sy: number, origin?: PointInit): this;
 
         tangentAt(ratio: number): Line | null;
 
@@ -168,7 +172,7 @@ export namespace g {
         end: Point;
         type: types.Curve;
 
-        constructor(p1: PlainPoint | string, p2: PlainPoint | string, p3: PlainPoint | string, p4: PlainPoint | string);
+        constructor(p1: PointInit, p2: PointInit, p3: PointInit, p4: PointInit);
         constructor(curve: Curve);
 
         bbox(): Rect;
@@ -216,7 +220,7 @@ export namespace g {
 
         round(precision?: number): this;
 
-        scale(sx: number, sy: number, origin?: PlainPoint | string): this;
+        scale(sx: number, sy: number, origin?: PointInit): this;
 
         tangentAt(ratio: number, opt?: SubdivisionsOpt): Line | null;
 
@@ -248,7 +252,7 @@ export namespace g {
         b: number;
         type: types.Ellipse;
 
-        constructor(center: PlainPoint | string, a: number, b: number);
+        constructor(center: PointInit, a: number, b: number);
         constructor(ellipse: Ellipse);
 
         bbox(): Rect;
@@ -265,7 +269,7 @@ export namespace g {
 
         intersectionWithLine(l: Line): Point[] | null;
 
-        intersectionWithLineFromCenterToPoint(p: PlainPoint, angle?: number): Point;
+        intersectionWithLineFromCenterToPoint(p: PointInit, angle?: number): Point;
 
         normalizedDistance(point: PlainPoint): number;
 
@@ -284,7 +288,7 @@ export namespace g {
         end: Point;
         type: types.Line;
 
-        constructor(p1: PlainPoint | string, p2: PlainPoint | string);
+        constructor(p1: PointInit, p2: PointInit);
         constructor(line: Line);
         constructor();
 
@@ -298,13 +302,13 @@ export namespace g {
 
         parallel(distance: number): Line;
 
-        closestPoint(p: PlainPoint | string): Point;
+        closestPoint(p: PointInit): Point;
 
-        closestPointLength(p: PlainPoint | string): number;
+        closestPointLength(p: PointInit): number;
 
-        closestPointNormalizedLength(p: PlainPoint | string): number;
+        closestPointNormalizedLength(p: PointInit): number;
 
-        closestPointTangent(p: PlainPoint | string): Line | null;
+        closestPointTangent(p: PointInit): Line | null;
 
         containsPoint(p: PlainPoint): boolean;
 
@@ -332,13 +336,13 @@ export namespace g {
 
         pointAtLength(length: number): Point;
 
-        pointOffset(p: PlainPoint | string): number;
+        pointOffset(p: PointInit): number;
 
         rotate(origin: PlainPoint, angle: number): this;
 
         round(precision?: number): this;
 
-        scale(sx: number, sy: number, origin?: PlainPoint): this;
+        scale(sx: number, sy: number, origin?: PointInit): this;
 
         setLength(length: number): this;
 
@@ -377,13 +381,13 @@ export namespace g {
 
         clone(): Path;
 
-        closestPoint(p: Point, opt?: SegmentSubdivisionsOpt): Point | null;
+        closestPoint(p: PlainPoint, opt?: SegmentSubdivisionsOpt): Point | null;
 
-        closestPointLength(p: Point, opt?: SegmentSubdivisionsOpt): number;
+        closestPointLength(p: PlainPoint, opt?: SegmentSubdivisionsOpt): number;
 
-        closestPointNormalizedLength(p: Point, opt?: SegmentSubdivisionsOpt): number;
+        closestPointNormalizedLength(p: PlainPoint, opt?: SegmentSubdivisionsOpt): number;
 
-        closestPointTangent(p: Point, opt?: SegmentSubdivisionsOpt): Line | null;
+        closestPointTangent(p: PlainPoint, opt?: SegmentSubdivisionsOpt): Line | null;
 
         containsPoint(p: PlainPoint, opt?: SegmentSubdivisionsOpt): boolean;
 
@@ -419,7 +423,7 @@ export namespace g {
 
         round(precision?: number): this;
 
-        scale(sx: number, sy: number, origin?: PlainPoint | string): this;
+        scale(sx: number, sy: number, origin?: PointInit): this;
 
         segmentAt(ratio: number, opt?: SegmentSubdivisionsOpt): Segment | null;
 
@@ -446,7 +450,7 @@ export namespace g {
 
         validate(): this;
 
-        private closestPointT(p: Point, opt?: SegmentSubdivisionsOpt): PathT | null;
+        private closestPointT(p: PlainPoint, opt?: SegmentSubdivisionsOpt): PathT | null;
 
         private lengthAtT(t: PathT, opt?: SegmentSubdivisionsOpt): number;
 
@@ -474,17 +478,17 @@ export namespace g {
         type: types.Point;
 
         constructor(x?: number, y?: number);
-        constructor(p: PlainPoint | string);
+        constructor(p: PointInit);
 
-        chooseClosest(points: PlainPoint[]): Point | null;
+        chooseClosest(points: PointInit[]): Point | null;
 
         adhereToRect(r: Rect): this;
 
         angleBetween(p1: PlainPoint, p2: PlainPoint): number;
 
-        bearing(p: Point): CardinalDirection;
+        bearing(p: PlainPoint): CardinalDirection;
 
-        changeInAngle(dx: number, dy: number, ref: PlainPoint | string): number;
+        changeInAngle(dx: number, dy: number, ref: PointInit): number;
 
         clone(): Point;
 
@@ -493,42 +497,42 @@ export namespace g {
         difference(dx?: number, dy?: number): Point;
         difference(p: PlainPoint): Point;
 
-        distance(p: PlainPoint | string): number;
+        distance(p: PlainPoint): number;
 
         dot(p: PlainPoint): number;
 
-        equals(p: Point): boolean;
+        equals(p: PlainPoint): boolean;
 
-        lerp(p: Point, t: number): Point;
+        lerp(p: PlainPoint, t: number): Point;
 
         magnitude(): number;
 
         manhattanDistance(p: PlainPoint): number;
 
-        move(ref: PlainPoint | string, distance: number): this;
+        move(ref: PointInit, distance: number): this;
 
         normalize(length: number): this;
 
         offset(dx?: number, dy?: number): this;
         offset(p: PlainPoint): this;
 
-        reflection(ref: PlainPoint | string): Point;
+        reflection(ref: PointInit): Point;
 
-        rotate(origin: PlainPoint | string, angle: number): this;
+        rotate(origin: PlainPoint, angle: number): this;
 
         round(precision?: number): this;
 
-        scale(sx: number, sy: number, origin?: PlainPoint | string): this;
+        scale(sx: number, sy: number, origin?: PointInit): this;
 
         snapToGrid(gx: number, gy?: number): this;
 
-        squaredDistance(p: PlainPoint | string): number;
+        squaredDistance(p: PlainPoint): number;
 
-        theta(p: PlainPoint | string): number;
+        theta(p: PointInit): number;
 
         toJSON(): PlainPoint;
 
-        toPolar(origin?: PlainPoint | string): this;
+        toPolar(origin?: PointInit): this;
 
         toString(): string;
 
@@ -542,7 +546,7 @@ export namespace g {
 
         vectorAngle(p: PlainPoint): number;
 
-        static fromPolar(distance: number, angle: number, origin?: PlainPoint | string): Point;
+        static fromPolar(distance: number, angle: number, origin?: PointInit): Point;
 
         static random(x1: number, x2: number, y1: number, y2: number): Point;
     }
@@ -554,17 +558,17 @@ export namespace g {
 
         constructor();
         constructor(svgString: string);
-        constructor(points: PlainPoint[]);
+        constructor(points: PointInit[]);
 
         bbox(): Rect | null;
 
-        closestPoint(p: PlainPoint | string): Point | null;
+        closestPoint(p: PlainPoint): Point | null;
 
-        closestPointLength(p: PlainPoint | string): number;
+        closestPointLength(p: PlainPoint): number;
 
-        closestPointNormalizedLength(p: PlainPoint | string): number;
+        closestPointNormalizedLength(p: PlainPoint): number;
 
-        closestPointTangent(p: PlainPoint | string): Line | null;
+        closestPointTangent(p: PlainPoint): Line | null;
 
         containsPoint(p: PlainPoint): boolean;
 
@@ -584,7 +588,7 @@ export namespace g {
 
         round(precision?: number): this;
 
-        scale(sx: number, sy: number, origin?: PlainPoint | string): this;
+        scale(sx: number, sy: number, origin?: PointInit): this;
 
         simplify(opt?: { threshold?: number }): this;
 
@@ -649,7 +653,7 @@ export namespace g {
 
         clone(): Rect;
 
-        containsPoint(p: PlainPoint | string, opt?: StrictOpt): boolean;
+        containsPoint(p: PointInit, opt?: StrictOpt): boolean;
 
         containsRect(r: PlainRect): boolean;
 
@@ -663,7 +667,7 @@ export namespace g {
 
         intersectionWithLine(l: Line): Point[] | null;
 
-        intersectionWithLineFromCenterToPoint(p: PlainPoint | string, angle?: number): Point;
+        intersectionWithLineFromCenterToPoint(p: PointInit, angle?: number): Point;
 
         leftLine(): Line;
 
@@ -675,6 +679,8 @@ export namespace g {
 
         moveAndExpand(r: PlainRect): this;
 
+        moveAroundPoint(origin: PlainPoint, angle: number): this;
+
         normalize(): this;
 
         offset(dx?: number, dy?: number): this;
@@ -682,7 +688,7 @@ export namespace g {
 
         origin(): Point;
 
-        pointNearestToPoint(point: PlainPoint | string): Point;
+        pointNearestToPoint(point: PointInit): Point;
 
         rightLine(): Line;
 
@@ -690,9 +696,9 @@ export namespace g {
 
         round(precision?: number): this;
 
-        scale(sx: number, sy: number, origin?: PlainPoint | string): this;
+        scale(sx: number, sy: number, origin?: PointInit): this;
 
-        sideNearestToPoint(point: PlainPoint | string): RectangleSide;
+        sideNearestToPoint(point: PointInit): RectangleSide;
 
         snapToGrid(gx: number, gy?: number): this;
 
@@ -732,24 +738,24 @@ export namespace g {
             p3: Point;
         }
 
-        export function curveThroughPoints(points: PlainPoint[] | Point[]): string[];
+        export function curveThroughPoints(points: PlainPoint[]): string[];
 
-        export function getCurveControlPoints(points: PlainPoint[] | Point[]): [Point[], Point[]];
+        export function getCurveControlPoints(points: PlainPoint[]): [Point[], Point[]];
 
         export function getCurveDivider(
-            p0: string | PlainPoint,
-            p1: string | PlainPoint,
-            p2: string | PlainPoint,
-            p3: string | PlainPoint
+            p0: PointInit,
+            p1: PointInit,
+            p2: PointInit,
+            p3: PointInit
         ): (t: number) => [IBezierCurve, IBezierCurve];
 
         export function getFirstControlPoints(rhs: number[]): number[];
 
         export function getInversionSolver(
-            p0: PlainPoint,
-            p1: PlainPoint,
-            p2: PlainPoint,
-            p3: PlainPoint
+            p0: PointInit,
+            p1: PointInit,
+            p2: PointInit,
+            p3: PointInit
         ): (p: PlainPoint) => number;
     }