bpmn-js 8.8.2 → 8.8.3

package/CHANGELOG.md

@@ -6,6 +6,12 @@ All notable changes to [bpmn-js](https://github.com/bpmn-io/bpmn-js) are documen
 
 ___Note:__ Yet to be released changes appear here._
 
+## 8.8.3
+
+* `FIX`: correct resize handles hidden behind element ([#1520](https://github.com/bpmn-io/bpmn-js/issues/1520))
+* `FIX`: handle close to source or target drop on flow ([#1541](https://github.com/bpmn-io/bpmn-js/issues/1541))
+* `CHORE`: bump to `diagram-js@7.6.3`
+
 ## 8.8.2
 
 * `FIX`: properly re-use ID of a copied element if available ([#1503](https://github.com/bpmn-io/bpmn-js/pull/1509))

package/dist/assets/diagram-js.css

@@ -468,6 +468,7 @@ marker.djs-dragger tspan {
  */
 .djs-overlay-context-pad {
   width: 72px;
+  z-index: 100;
 }
 
 .djs-context-pad {
@@ -750,6 +751,7 @@ marker.djs-dragger tspan {
   width: 100%;
   padding: 6px 10px;
   border: 1px solid var(--search-input-border-color);
+  box-sizing: border-box;
 }
 
 .djs-search-input input:focus {

package/dist/bpmn-modeler.development.js

@@ -1,5 +1,5 @@
 /*!
- * bpmn-js - bpmn-modeler v8.8.2
+ * bpmn-js - bpmn-modeler v8.8.3
  *
  * Copyright (c) 2014-present, camunda Services GmbH
  *
@@ -8,7 +8,7 @@
  *
  * Source Code: https://github.com/bpmn-io/bpmn-js
  *
- * Date: 2021-10-20
+ * Date: 2021-12-03
  */
 (function (global, factory) {
 	typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
@@ -2337,13 +2337,14 @@
 	  eventBus.on([ 'render.shape', 'render.connection' ], renderPriority, function(evt, context) {
 	    var type = evt.type,
 	        element = context.element,
-	        visuals = context.gfx;
+	        visuals = context.gfx,
+	        attrs = context.attrs;
 
 	    if (self.canRender(element)) {
 	      if (type === 'render.shape') {
-	        return self.drawShape(visuals, element);
+	        return self.drawShape(visuals, element, attrs);
 	      } else {
-	        return self.drawConnection(visuals, element);
+	        return self.drawConnection(visuals, element, attrs);
 	      }
 	    }
 	  });
@@ -2803,7 +2804,7 @@
 	  return true;
 	};
 
-	DefaultRenderer.prototype.drawShape = function drawShape(visuals, element) {
+	DefaultRenderer.prototype.drawShape = function drawShape(visuals, element, attrs) {
 	  var rect = create$1('rect');
 
 	  attr(rect, {
@@ -2814,9 +2815,9 @@
 	  });
 
 	  if (isFrameElement$1(element)) {
-	    attr(rect, this.FRAME_STYLE);
+	    attr(rect, assign({}, this.FRAME_STYLE, attrs || {}));
 	  } else {
-	    attr(rect, this.SHAPE_STYLE);
+	    attr(rect, assign({}, this.SHAPE_STYLE, attrs || {}));
 	  }
 
 	  append(visuals, rect);
@@ -2824,9 +2825,9 @@
 	  return rect;
 	};
 
-	DefaultRenderer.prototype.drawConnection = function drawConnection(visuals, connection) {
+	DefaultRenderer.prototype.drawConnection = function drawConnection(visuals, connection, attrs) {
 
-	  var line = createLine(connection.waypoints, this.CONNECTION_STYLE);
+	  var line = createLine(connection.waypoints, assign({}, this.CONNECTION_STYLE, attrs || {}));
 	  append(visuals, line);
 
 	  return line;
@@ -4365,6 +4366,10 @@
 	var BASE_LAYER = 'base';
 	var HIDDEN_MARKER = 'djs-element-hidden';
 
+	// render plane contents behind utility layers
+	var PLANE_LAYER_INDEX = 0;
+	var UTILITY_LAYER_INDEX = 1;
+
 
 	var REQUIRED_MODEL_ATTRS = {
 	  shape: [ 'x', 'y', 'width', 'height' ],
@@ -4463,7 +4468,8 @@
 	    'connection.added',
 	    'shape.removed',
 	    'connection.removed',
-	    'elements.changed'
+	    'elements.changed',
+	    'plane.set'
 	  ], function() {
 	    delete this._cachedViewbox;
 	  }, this);
@@ -4524,7 +4530,7 @@
 	 * @returns {SVGElement}
 	 */
 	Canvas.prototype.getDefaultLayer = function() {
-	  return this.getLayer(BASE_LAYER);
+	  return this.getLayer(BASE_LAYER, PLANE_LAYER_INDEX);
 	};
 
 	/**
@@ -4573,8 +4579,8 @@
 	 */
 	Canvas.prototype._createLayer = function(name, index) {
 
-	  if (!index) {
-	    index = 0;
+	  if (typeof index === 'undefined') {
+	    index = UTILITY_LAYER_INDEX;
 	  }
 
 	  var childIndex = reduce(this._layers, function(childIndex, layer) {
@@ -4604,9 +4610,7 @@
 	    throw new Error('must specify a name');
 	  }
 
-	  var plane = this._planes[name];
-
-	  return plane;
+	  return this._planes[name];
 	};
 
 	/**
@@ -4635,7 +4639,7 @@
 	    };
 	  }
 
-	  var svgLayer = this.getLayer(name);
+	  var svgLayer = this.getLayer(name, PLANE_LAYER_INDEX);
 	  classes(svgLayer).add(HIDDEN_MARKER);
 
 	  var plane = this._planes[name] = {
@@ -5244,9 +5248,10 @@
 	  if (!box) {
 
 	    // compute the inner box based on the
-	    // diagrams default layer. This allows us to exclude
+	    // diagrams active plane. This allows us to exclude
 	    // external components, such as overlays
-	    innerBox = this.getDefaultLayer().getBBox();
+
+	    innerBox = (this._activePlane && this._activePlane.layer.getBBox()) || {};
 
 	    transform = transform$1(viewport);
 	    matrix = transform ? transform.matrix : createMatrix();
@@ -5262,10 +5267,10 @@
 	      height: outerBox.height / scale,
 	      scale: scale,
 	      inner: {
-	        width: innerBox.width,
-	        height: innerBox.height,
-	        x: innerBox.x,
-	        y: innerBox.y
+	        width: innerBox.width || 0,
+	        height: innerBox.height || 0,
+	        x: innerBox.x || 0,
+	        y: innerBox.y || 0
 	      },
 	      outer: outerBox
 	    };
@@ -21491,22 +21496,26 @@
 
 	Overlays.prototype._updateOverlayVisibilty = function(overlay, viewbox) {
 	  var show = overlay.show,
+	      plane = overlay.plane,
 	      minZoom = show && show.minZoom,
 	      maxZoom = show && show.maxZoom,
 	      htmlContainer = overlay.htmlContainer,
+	      activePlane = this._canvas.getActivePlane(),
 	      visible = true;
 
-	  if (show) {
+	  if (plane !== activePlane) {
+	    visible = false;
+	  } else if (show) {
 	    if (
 	      (isDefined(minZoom) && minZoom > viewbox.scale) ||
 	      (isDefined(maxZoom) && maxZoom < viewbox.scale)
 	    ) {
 	      visible = false;
 	    }
-
-	    setVisible$1(htmlContainer, visible);
 	  }
 
+	  setVisible$1(htmlContainer, visible);
+
 	  this._updateOverlayScale(overlay, viewbox);
 	};
 
@@ -41292,12 +41301,12 @@
 	      dockingPoint = intersection.bendpoint ? waypoints[intersection.index] : mid;
 
 	      // if last waypointBefore is inside shape's bounds, ignore docking point
-	      if (!isPointInsideBBox(shape, waypointsBefore[waypointsBefore.length-1])) {
+	      if (waypointsBefore.length === 1 || !isPointInsideBBox(shape, waypointsBefore[waypointsBefore.length-1])) {
 	        waypointsBefore.push(copy(dockingPoint));
 	      }
 
 	      // if first waypointAfter is inside shape's bounds, ignore docking point
-	      if (!isPointInsideBBox(shape, waypointsAfter[0])) {
+	      if (waypointsAfter.length === 1 || !isPointInsideBBox(shape, waypointsAfter[0])) {
 	        waypointsAfter.unshift(copy(dockingPoint));
 	      }
 	    }