@joint/core 4.0.2 → 4.0.4

package/README.md

@@ -1,17 +1,17 @@
 # JointJS - JavaScript diagramming library powering exceptional UIs
 
-[![Build Status](https://travis-ci.com/clientIO/joint.svg?branch=master)](https://travis-ci.com/clientIO/joint)
+[![Build Status](https://app.travis-ci.com/clientIO/joint.svg?token=YC3doXGarvYwgzfqe9zy&branch=master)](https://app.travis-ci.com/clientIO/joint)
 [![Total Discussion](https://img.shields.io/github/discussions/badges/shields)](https://github.com/clientIO/joint/discussions)
 [![NPM Version](https://img.shields.io/npm/v/jointjs)](https://www.npmjs.com/package/jointjs)
 [![NPM License](https://img.shields.io/npm/l/jointjs?color=blue)](https://github.com/clientIO/joint/blob/master/LICENSE)
 
- [JointJS](https://jointjs.com) is a tested and proven  *JavaScript*/*Typescript* diagramming library that helps developers and companies of any size build visual and No-Code/Low-Code applications faster and with confidence. It’s a flexible tool from which a wide range of UIs can be created (interactive diagramming applications, drawing tools, data visualizations, UIs for monitoring systems, and many more). It can become the foundational layer of your next application and help you bring your idea to market in days, not months or years.
+[JointJS](https://jointjs.com) is a tested and proven *JavaScript*/*Typescript* diagramming library that helps developers and companies of any size build visual and No-Code/Low-Code applications faster and with confidence. It’s a flexible tool from which a wide range of UIs can be created (interactive diagramming applications, drawing tools, data visualizations, UIs for monitoring systems, and many more). It can become the foundational layer of your next application and help you bring your idea to market in days, not months or years.
 
 ![Use Cases](https://user-images.githubusercontent.com/3967880/200360293-808f148c-32af-4f46-bec1-b4ae4e1592a0.jpg)
 
 Further **information**, **examples** and **documentation** can be found at [jointjs.com](https://jointjs.com).
 
-:1234: Get started with [tutorials](https://resources.jointjs.com/tutorial).
+:1234: Get started with [tutorials](https://docs.jointjs.com).
 
 :bulb: To ask a question, share feedback, or engage in a discussion with other community members, visit our [GitHub discussions](https://github.com/clientIO/joint/discussions).
 

package/dist/geometry.js

@@ -1,4 +1,4 @@
-/*! JointJS v4.0.2 (2024-04-09) - JavaScript diagramming library
+/*! JointJS v4.0.4 (2024-05-31) - JavaScript diagramming library
 
 
 This Source Code Form is subject to the terms of the Mozilla Public

package/dist/geometry.min.js

@@ -1,4 +1,4 @@
-/*! JointJS v4.0.2 (2024-04-09) - JavaScript diagramming library
+/*! JointJS v4.0.4 (2024-05-31) - JavaScript diagramming library
 
 
 This Source Code Form is subject to the terms of the Mozilla Public

package/dist/joint.d.ts

@@ -1,4 +1,4 @@
-/*! JointJS v4.0.2 (2024-04-09) - JavaScript diagramming library
+/*! JointJS v4.0.4 (2024-05-31) - JavaScript diagramming library
 
 
 This Source Code Form is subject to the terms of the Mozilla Public
@@ -618,6 +618,16 @@ export declare namespace connectors {
     var curve: CurveConnector;
 }
 
+declare type DeepPartial<T> = _DeepPartial<_DeepRequired<T>>;
+
+declare type _DeepPartial<T> = {
+    	[P in keyof T]?: T[P] extends object ? _DeepPartial<T[P]> : T[P];
+};
+
+declare type _DeepRequired<T> = {
+    [P in keyof T]-?: T[P] extends object ? _DeepRequired<T[P]> : T[P];
+};
+
 export declare namespace dia {
 
     export type Event = mvc.TriggeredEvent;
@@ -933,7 +943,7 @@ export declare namespace dia {
 
     export class Cell<A extends ObjectHash = Cell.Attributes, S extends mvc.ModelSetOptions = dia.ModelSetOptions> extends mvc.Model<A, S> {
 
-        constructor(attributes?: A, opt?: Cell.ConstructorOptions);
+        constructor(attributes?: DeepPartial<A>, opt?: Cell.ConstructorOptions);
 
         id: Cell.ID;
         graph: Graph;
@@ -967,7 +977,7 @@ export declare namespace dia {
         isEmbedded(): boolean;
 
         prop(key: Path): any;
-        prop(object: Partial<A>, opt?: Cell.Options): this;
+        prop(object: DeepPartial<A>, opt?: Cell.Options): this;
         prop(key: Path, value: any, opt?: Cell.Options): this;
 
         removeProp(path: Path, opt?: Cell.Options): this;
@@ -4487,6 +4497,8 @@ export declare namespace mvc {
 
         isMounted(): boolean;
 
+        protected findAttributeNode(attributeName: string, node: Element): Element | null;
+
         protected init(): void;
 
         protected onRender(): void;

package/dist/joint.js

@@ -1,4 +1,4 @@
-/*! JointJS v4.0.2 (2024-04-09) - JavaScript diagramming library
+/*! JointJS v4.0.4 (2024-05-31) - JavaScript diagramming library
 
 
 This Source Code Form is subject to the terms of the Mozilla Public
@@ -17410,6 +17410,8 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	    return (attrs.text !== undefined);
 	}
 
+	var FONT_ATTRIBUTES = ['font-weight', 'font-family', 'font-size', 'letter-spacing', 'text-transform'];
+
 	var textAttributesNS = {
 
 	    'line-height': {
@@ -17525,18 +17527,28 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	            var text = value.text;
 	            if (text === undefined) { text = attrs.text; }
 	            if (text !== undefined) {
+
 	                var breakTextFn = value.breakText || breakText;
 	                var computedStyles = getComputedStyle(node);
+	                var wrapFontAttributes = {};
+	                // The font size attributes must be set on the node
+	                // to get the correct text wrapping.
+	                // TODO: set the native SVG attributes before special attributes
+	                for (var i = 0; i < FONT_ATTRIBUTES.length; i++) {
+	                    var name = FONT_ATTRIBUTES[i];
+	                    if (name in attrs) {
+	                        node.setAttribute(name, attrs[name]);
+	                    }
+	                    // Note: computedStyles is a live object
+	                    // i.e. the properties are evaluated when accessed.
+	                    wrapFontAttributes[name] = computedStyles[name];
+	                }
 
-	                wrappedText = breakTextFn('' + text, size, {
-	                    'font-weight': computedStyles.fontWeight,
-	                    'font-family': computedStyles.fontFamily,
-	                    'text-transform': computedStyles.textTransform,
-	                    'font-size': computedStyles.fontSize,
-	                    'letter-spacing': computedStyles.letterSpacing,
-	                    // The `line-height` attribute in SVG is JoinJS specific.
-	                    'lineHeight': attrs['line-height'],
-	                }, {
+	                // The `line-height` attribute in SVG is JoinJS specific.
+	                // TODO: change the `lineHeight` to breakText option.
+	                wrapFontAttributes.lineHeight = attrs['line-height'];
+
+	                wrappedText = breakTextFn('' + text, size, wrapFontAttributes, {
 	                    // Provide an existing SVG Document here
 	                    // instead of creating a temporary one over again.
 	                    svgDocument: this.paper.svg,
@@ -17550,7 +17562,11 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	                wrappedText = '';
 	            }
 	            textAttributesNS.text.set.call(this, wrappedText, refBBox, node, attrs);
-	        }
+	        },
+	        // We expose the font attributes list to allow
+	        // the user to take other custom font attributes into account
+	        // when wrapping the text.
+	        FONT_ATTRIBUTES: FONT_ATTRIBUTES
 	    },
 
 	    'title': {
@@ -20344,6 +20360,13 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	            'port-group': port.group
 	        });
 
+	        // If the port ID is a number, we need to add
+	        // extra information to the port element to distinguish
+	        // between ports with the same ID but different types.
+	        if (isNumber(port.id)) {
+	            portElement.attr('port-id-type', 'number');
+	        }
+
 	        var labelMarkupDef = this._getPortLabelMarkup(port.label);
 	        if (Array.isArray(labelMarkupDef)) {
 	            // JSON Markup
@@ -21610,6 +21633,11 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	        svgforeignobject: function() {
 	            return !!document.createElementNS &&
 	                /SVGForeignObject/.test(({}).toString.call(document.createElementNS('http://www.w3.org/2000/svg', 'foreignObject')));
+	        },
+
+	        // works for iOS browsers too
+	        isSafari: function() {
+	            return /Safari/.test(navigator.userAgent) && /Apple Computer/.test(navigator.vendor);
 	        }
 	    },
 
@@ -23866,23 +23894,25 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	        return this;
 	    },
 
-	    findAttribute: function(attributeName, node) {
-
+	    findAttributeNode: function(attributeName, node) {
 	        var currentNode = node;
-
 	        while (currentNode && currentNode.nodeType === 1) {
-	            var attributeValue = currentNode.getAttribute(attributeName);
 	            // attribute found
-	            if (attributeValue) { return attributeValue; }
+	            // (empty value does not count as attribute found)
+	            if (currentNode.getAttribute(attributeName)) { return currentNode; }
 	            // do not climb up the DOM
 	            if (currentNode === this.el) { return null; }
 	            // try parent node
 	            currentNode = currentNode.parentNode;
 	        }
-
 	        return null;
 	    },
 
+	    findAttribute: function(attributeName, node) {
+	        var matchedNode = this.findAttributeNode(attributeName, node);
+	        return matchedNode && matchedNode.getAttribute(attributeName);
+	    },
+
 	    // Override the mvc ViewBase `_ensureElement()` method in order to create an
 	    // svg element (e.g., `<g>`) node that wraps all the nodes of the Cell view.
 	    // Expose class name setter as a separate method.
@@ -30606,13 +30636,18 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 
 	        var model = this.model;
 	        var id = model.id;
-	        var port = this.findAttribute('port', magnet);
+	        // Find a node with the `port` attribute set on it.
+	        var portNode = this.findAttributeNode('port', magnet);
 	        // Find a unique `selector` of the element under pointer that is a magnet.
 	        var selector = magnet.getAttribute('joint-selector');
 
 	        var end = { id: id };
 	        if (selector != null) { end.magnet = selector; }
-	        if (port != null) {
+	        if (portNode != null) {
+	            var port = portNode.getAttribute('port');
+	            if (portNode.getAttribute('port-id-type') === 'number') {
+	                port = parseInt(port, 10);
+	            }
 	            end.port = port;
 	            if (!model.hasPort(port) && !selector) {
 	                // port created via the `port` attribute (not API)
@@ -32471,6 +32506,11 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	            this.updateHighlighters(true);
 	            this.updateTools(opt);
 	            flags = this.removeFlag(flags, [Flags$2.RENDER, Flags$2.UPDATE, Flags$2.LABELS, Flags$2.TOOLS, Flags$2.CONNECTOR]);
+
+	            if (env.test('isSafari')) {
+	                this.__fixSafariBug268376();
+	            }
+
 	            return flags;
 	        }
 
@@ -32524,6 +32564,20 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	        return flags;
 	    },
 
+	    __fixSafariBug268376: function() {
+	        // Safari has a bug where any change after the first render is not reflected in the DOM.
+	        // https://bugs.webkit.org/show_bug.cgi?id=268376
+	        var ref = this;
+	        var el = ref.el;
+	        var childNodes = Array.from(el.childNodes);
+	        var fragment = document.createDocumentFragment();
+	        for (var i = 0, n = childNodes.length; i < n; i++) {
+	            el.removeChild(childNodes[i]);
+	            fragment.appendChild(childNodes[i]);
+	        }
+	        el.appendChild(fragment);
+	    },
+
 	    requestConnectionUpdate: function(opt) {
 	        this.requestUpdate(this.getFlag(Flags$2.UPDATE), opt);
 	    },
@@ -34667,6 +34721,8 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	    },
 
 	    renderGrid: function renderGrid() {
+	        var this$1 = this;
+
 
 	        var ref = this;
 	        var paper = ref.options.paper;
@@ -34686,7 +34742,7 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 
 	        gridSettings.forEach(function (gridLayerSetting, index) {
 
-	            var id = 'pattern_' + index;
+	            var id = this$1._getPatternId(index);
 	            var options = merge({}, gridLayerSetting);
 	            var scaleFactor = options.scaleFactor; if ( scaleFactor === void 0 ) scaleFactor = 1;
 	            options.width = gridSize * scaleFactor || 1;
@@ -34714,6 +34770,8 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	    },
 
 	    updateGrid: function updateGrid() {
+	        var this$1 = this;
+
 
 	        var ref = this;
 	        var grid = ref._gridCache;
@@ -34734,12 +34792,16 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	        }
 	        gridSettings.forEach(function (options, index) {
 	            if (isFunction(options.update)) {
-	                var vPattern = patterns['pattern_' + index];
+	                var vPattern = patterns[this$1._getPatternId(index)];
 	                options.update(vPattern.node.firstChild, options, paper);
 	            }
 	        });
 	    },
 
+	    _getPatternId: function _getPatternId(index) {
+	        return ("pattern_" + (this.options.paper.cid) + "_" + index);
+	    },
+
 	    _getGridRefs: function _getGridRefs() {
 	        var ref = this;
 	        var grid = ref._gridCache;
@@ -38964,12 +39026,14 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 	        evt.stopPropagation();
 	        evt.preventDefault();
 	        var relatedView = this.relatedView;
+	        var paper = relatedView.paper;
 	        relatedView.model.startBatch('arrowhead-move', { ui: true, tool: this.cid });
 	        relatedView.startArrowheadMove(this.arrowheadType);
 	        this.delegateDocumentEvents();
-	        relatedView.paper.undelegateEvents();
+	        paper.undelegateEvents();
 	        this.focus();
 	        this.el.style.pointerEvents = 'none';
+	        relatedView.notifyPointerdown.apply(relatedView, paper.getPointerArgs(evt));
 	    },
 	    onPointerMove: function(evt) {
 	        var normalizedEvent = normalizeEvent(evt);
@@ -39924,7 +39988,7 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 		Control: Control
 	});
 
-	var version = "4.0.2";
+	var version = "4.0.4";
 
 	var Vectorizer = V;
 	var layout = { PortLabel: PortLabel, Port: Port };