Release v3.7.2 (#2181)

CHANGELOG

@@ -1,3 +1,11 @@
+16-05-2023 (v3.7.2)
+
+  * demo - add DWDM (Dense wavelength-division multiplexing) example
+  * dia.Paper - allow immediate propagation on pointerup
+  * dia.CellView - fix to `checkMouseLeave` working incorrectly when paper has autoFreeze=true
+  * dia.CellView - fix to get correct ref node bounding box
+  * dia.HighlighterView - prevent highlighter mounting to unmounted cell views
+
 28-04-2023 (v3.7.1)
 
   * bump jQuery to v3.6.4

dist/geometry.js

@@ -1,4 +1,4 @@
-/*! JointJS v3.7.1 (2023-04-28) - JavaScript diagramming library
+/*! JointJS v3.7.2 (2023-05-16) - JavaScript diagramming library
 
 
 This Source Code Form is subject to the terms of the Mozilla Public

dist/joint.core.js

@@ -1,4 +1,4 @@
-/*! JointJS v3.7.1 (2023-04-28) - JavaScript diagramming library
+/*! JointJS v3.7.2 (2023-05-16) - JavaScript diagramming library
 
 
 This Source Code Form is subject to the terms of the Mozilla Public
@@ -19139,6 +19139,7 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	    nodeSelector: null,
 	    node: null,
 	    updateRequested: false,
+	    postponedUpdate: false,
 	    transformGroup: null,
 	    detachedTransformGroup: null,
 
@@ -19158,6 +19159,10 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	        var ref = this;
 	        var cellView = ref.cellView;
 	        var nodeSelector = ref.nodeSelector;
+	        if (!cellView.isMounted()) {
+	            this.postponedUpdate = true;
+	            return 0;
+	        }
 	        this.update(cellView, nodeSelector);
 	        this.mount();
 	        this.transform();
@@ -19222,7 +19227,16 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	        var options = ref.options;
 	        var transformGroup = ref.transformGroup;
 	        var detachedTransformGroup = ref.detachedTransformGroup;
+	        var postponedUpdate = ref.postponedUpdate;
+	        var nodeSelector = ref.nodeSelector;
 	        if (!MOUNTABLE || transformGroup) { return; }
+	        if (postponedUpdate) {
+	            // The cellView was not mounted when the update was requested.
+	            // The update was postponed until the cellView is mounted.
+	            this.update(cellView, nodeSelector);
+	            this.transform();
+	            return;
+	        }
 	        var cellViewRoot = cellView.vel;
 	        var paper = cellView.paper;
 	        var layerName = options.layer;
@@ -19280,6 +19294,7 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	        var updateRequested = ref.updateRequested;
 	        var id = ref.id;
 	        if (updateRequested) { return; }
+	        this.postponedUpdate = false;
 	        var node = this.node = this.findNode(cellView, nodeSelector);
 	        if (prevNode) {
 	            this.unhighlight(cellView, prevNode);
@@ -20396,25 +20411,42 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 
 	        relativeItems.push.apply(relativeItems, relativeRefItems);
 
-	        var rotatableMatrix;
 	        for (var i = 0, n = relativeItems.length; i < n; i++) {
 	            item = relativeItems[i];
 	            node = item.node;
 	            refNode = item.refNode;
 
 	            // Find the reference element bounding box. If no reference was provided, we
 	            // use the optional bounding box.
-	            var vRotatable = V(opt.rotatableNode);
 	            var refNodeId = refNode ? V.ensureId(refNode) : '';
-	            var isRefNodeRotatable = !!vRotatable && !!refNode && vRotatable.contains(refNode);
-	            var unrotatedRefBBox = bboxCache[refNodeId];
-	            if (!unrotatedRefBBox) {
-	                // Get the bounding box of the reference element relative to the `rotatable` `<g>` (without rotation)
-	                // or to the root `<g>` element if no rotatable group present if reference node present.
-	                // Uses the bounding box provided.
-	                var transformationTarget = (isRefNodeRotatable) ? vRotatable : rootNode;
-	                unrotatedRefBBox = bboxCache[refNodeId] = (refNode)
-	                    ? V(refNode).getBBox({ target: transformationTarget })
+	            var refBBox = bboxCache[refNodeId];
+	            if (!refBBox) {
+	                // Get the bounding box of the reference element using to the common ancestor
+	                // transformation space.
+	                //
+	                // @example 1
+	                // <g transform="translate(11, 13)">
+	                //     <rect @selector="b" x="1" y="2" width="3" height="4"/>
+	                //     <rect @selector="a"/>
+	                // </g>
+	                //
+	                // In this case, the reference bounding box can not be affected
+	                // by the `transform` attribute of the `<g>` element,
+	                // because the exact transformation will be applied to the `a` element
+	                // as well as to the `b` element.
+	                //
+	                // @example 2
+	                // <g transform="translate(11, 13)">
+	                //     <rect @selector="b" x="1" y="2" width="3" height="4"/>
+	                // </g>
+	                // <rect @selector="a"/>
+	                //
+	                // In this case, the reference bounding box have to be affected by the
+	                // `transform` attribute of the `<g>` element, because the `a` element
+	                // is not descendant of the `<g>` element and will not be affected
+	                // by the transformation.
+	                refBBox = bboxCache[refNodeId] = (refNode)
+	                    ? V(refNode).getBBox({ target: getCommonAncestorNode(node, refNode) })
 	                    : opt.rootBBox;
 	            }
 
@@ -20429,14 +20461,6 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	                processedAttrs = item.processedAttributes;
 	            }
 
-	            var refBBox = unrotatedRefBBox;
-	            if (isRefNodeRotatable && !vRotatable.contains(node)) {
-	                // if the referenced node is inside the rotatable group while the updated node is outside,
-	                // we need to take the rotatable node transformation into account
-	                if (!rotatableMatrix) { rotatableMatrix = V.transformStringToMatrix(vRotatable.attr('transform')); }
-	                refBBox = V.transformRect(unrotatedRefBBox, rotatableMatrix);
-	            }
-
 	            this.updateRelativeAttributes(node, processedAttrs, refBBox, opt);
 	        }
 	    },
@@ -20705,16 +20729,23 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	                var sourceElement = model.getSourceElement();
 	                if (sourceElement) {
 	                    var sourceView = paper.findViewByModel(sourceElement);
-	                    if (sourceView) { paper.dumpView(sourceView); }
+	                    if (sourceView) {
+	                        paper.dumpView(sourceView);
+	                        paper.checkViewVisibility(sourceView);
+	                    }
 	                }
 	                var targetElement = model.getTargetElement();
 	                if (targetElement) {
 	                    var targetView = paper.findViewByModel(targetElement);
-	                    if (targetView) { paper.dumpView(targetView); }
+	                    if (targetView) {
+	                        paper.dumpView(targetView);
+	                        paper.checkViewVisibility(targetView);
+	                    }
 	                }
 	            }
 	            // Do the updates of the current view synchronously now
 	            paper.dumpView(this);
+	            paper.checkViewVisibility(this);
 	        }
 	        var target = this.getEventTarget(evt, { fromPoint: true });
 	        var view = paper.findView(target);
@@ -20746,6 +20777,16 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	    }
 	});
 
+	// TODO: Move to Vectorizer library.
+	function getCommonAncestorNode(node1, node2) {
+	    var parent = node1;
+	    do {
+	        if (parent.contains(node2)) { return parent; }
+	        parent = parent.parentNode;
+	    } while (parent);
+	    return null;
+	}
+
 	var Flags$1 = {
 	    TOOLS: CellView.Flags.TOOLS,
 	    UPDATE: 'UPDATE',
@@ -32540,6 +32581,41 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	        return unmountCount;
 	    },
 
+	    checkViewVisibility: function(cellView, opt) {
+	        if ( opt === void 0 ) opt = {};
+
+	        var viewportFn = 'viewport' in opt ? opt.viewport : this.options.viewport;
+	        if (typeof viewportFn !== 'function') { viewportFn = null; }
+	        var updates = this._updates;
+	        var mounted = updates.mounted;
+	        var unmounted = updates.unmounted;
+	        var visible = !cellView.DETACHABLE || !viewportFn || viewportFn.call(this, cellView, false, this);
+
+	        var isUnmounted = false;
+	        var isMounted = false;
+
+	        if (cellView.cid in mounted && !visible) {
+	            var flag$1 = this.registerUnmountedView(cellView);
+	            if (flag$1) { this.detachView(cellView); }
+	            var i = updates.mountedCids.indexOf(cellView.cid);
+	            updates.mountedCids.splice(i, 1);
+	            isUnmounted = true;
+	        }
+
+	        if (!isUnmounted && cellView.cid in unmounted && visible) {
+	            var i$1 = updates.unmountedCids.indexOf(cellView.cid);
+	            updates.unmountedCids.splice(i$1, 1);
+	            var flag = this.registerMountedView(cellView);
+	            if (flag) { this.scheduleViewUpdate(cellView, flag, cellView.UPDATE_PRIORITY, { mounting: true }); }
+	            isMounted = true;
+	        }
+
+	        return {
+	            mounted: isMounted ? 1 : 0,
+	            unmounted: isUnmounted ? 1 : 0
+	        };
+	    },
+
 	    checkViewport: function(opt) {
 	        var passingOpt = defaults({}, opt, {
 	            mountBatchSize: Infinity,
@@ -33716,7 +33792,6 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	            this.pointerclick($.Event(evt.originalEvent, { type: 'click', data: evt.data }));
 	        }
 
-	        evt.stopImmediatePropagation();
 	        this.delegateEvents();
 	    },
 
@@ -34877,10 +34952,6 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	            }
 	        }
 	        return this;
-	    },
-
-	    isMounted: function() {
-	        return this.el.parentNode !== null;
 	    }
 
 	});
@@ -36599,7 +36670,7 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 		Control: Control
 	});
 
-	var version = "3.7.1";
+	var version = "3.7.2";
 
 	var Vectorizer = V;
 	var layout = { PortLabel: PortLabel, Port: Port };

dist/joint.d.ts

@@ -1,4 +1,4 @@
-/*! JointJS v3.7.1 (2023-04-28) - JavaScript diagramming library
+/*! JointJS v3.7.2 (2023-05-16) - JavaScript diagramming library
 
 
 This Source Code Form is subject to the terms of the Mozilla Public
@@ -1545,9 +1545,9 @@ export namespace dia {
 
         findView(paper: Paper): CellView;
 
-        isLink(): boolean;
+        isLink(): this is Link;
 
-        isElement(): boolean;
+        isElement(): this is Element;
 
         startBatch(name: string, opt?: Graph.Options): this;
 
@@ -1653,10 +1653,6 @@ export namespace dia {
 
     class Element<A extends ObjectHash = Element.Attributes, S extends Backbone.ModelSetOptions = dia.ModelSetOptions> extends Cell<A, S> {
 
-        isElement(): boolean;
-
-        isLink(): boolean;
-
         translate(tx: number, ty?: number, opt?: Element.TranslateOptions): this;
 
         position(opt?: Element.PositionOptions): g.Point;
@@ -1789,10 +1785,6 @@ export namespace dia {
          */
         labelMarkup?: string | MarkupJSON; // default label markup
 
-        isElement(): boolean;
-
-        isLink(): boolean;
-
         disconnect(): this;
 
         source(): Link.EndJSON;
@@ -1815,7 +1807,7 @@ export namespace dia {
         label(index: number, label: Link.Label, opt?: S): this;
 
         labels(): Link.Label[];
-        labels(labels: Link.Label[]): this;
+        labels(labels: Link.Label[], opt?: S): this;
 
         hasLabels(): boolean;
 
@@ -2799,6 +2791,21 @@ export namespace dia {
 
         // protected
 
+        /**
+        * For the specified view, calls the visibility viewport function specified by the paper.options.viewport function.
+        * If the function returns true, the view is attached to the DOM; in other case it is detached.
+        * While async papers do this automatically, synchronous papers require an explicit call to this method for this functionality to be applied. To show the view again, use paper.requestView().
+        * If you are using autoFreeze option you should call this function if you are calling paper.requestView() if you want paper.options.viewport function to be applied.
+        * @param cellView cellView for which the visibility check is performed
+        * @param opt if opt.viewport is provided, it is used as the callback function instead of paper.options.viewport.
+        */
+        protected checkViewVisibility(cellView: dia.CellView, opt?: {
+            viewport?: Paper.ViewportCallback;
+        }): {
+            mounted: number;
+            unmounted: number;
+        };
+
         protected scheduleViewUpdate(view: mvc.View<any, any>, flag: number, priority: number, opt?: { [key: string]: any }): void;
 
         protected dumpViewUpdate(view: mvc.View<any, any>): number;
@@ -2966,10 +2973,6 @@ export namespace dia {
 
         mount(): this;
 
-        unmount(): this;
-
-        isMounted(): boolean;
-
         protected simulateRelatedView(el: SVGElement): void;
     }
 
@@ -3038,9 +3041,9 @@ export namespace dia {
         nodeSelector: HighlighterView.NodeSelector | null;
         node: SVGElement | null;
         updateRequested: boolean;
+        postponedUpdate: boolean;
         transformGroup: Vectorizer | null;
-
-        public unmount(): void;
+        detachedTransformGroup: Vectorizer | null;
 
         protected findNode(cellView: dia.CellView, nodeSelector: HighlighterView.NodeSelector): SVGElement | null;
 
@@ -4567,6 +4570,8 @@ export namespace mvc {
 
         unmount(): void;
 
+        isMounted(): boolean;
+
         protected init(): void;
 
         protected onRender(): void;