bpmn-js 16.3.2 → 16.5.0

package/lib/features/modeling/behavior/SpaceToolBehavior.js

@@ -1,139 +1,207 @@
-import { forEach } from 'min-dash';
-
-import { is } from '../../../util/ModelUtil';
-
-import { isExpanded } from '../../../util/DiUtil';
-
-import {
-  GROUP_MIN_DIMENSIONS,
-  LANE_MIN_DIMENSIONS,
-  PARTICIPANT_MIN_DIMENSIONS,
-  SUB_PROCESS_MIN_DIMENSIONS,
-  TEXT_ANNOTATION_MIN_DIMENSIONS
-} from './ResizeBehavior';
-
-import { getChildLanes } from '../util/LaneUtil';
-
-/**
- * @typedef {import('diagram-js/lib/core/EventBus').default} EventBus
- *
- * @typedef {import('../../../model/Types').Shape} Shape
- */
-
-var max = Math.max;
-
-/**
- * @param {EventBus} eventBus
- */
-export default function SpaceToolBehavior(eventBus) {
-  eventBus.on('spaceTool.getMinDimensions', function(context) {
-    var shapes = context.shapes,
-        axis = context.axis,
-        start = context.start,
-        minDimensions = {};
-
-    forEach(shapes, function(shape) {
-      var id = shape.id;
-
-      if (is(shape, 'bpmn:Participant')) {
-
-        if (isHorizontal(axis)) {
-          minDimensions[ id ] = PARTICIPANT_MIN_DIMENSIONS;
-        } else {
-          minDimensions[ id ] = {
-            width: PARTICIPANT_MIN_DIMENSIONS.width,
-            height: getParticipantMinHeight(shape, start)
-          };
-        }
-
-      }
-
-      if (is(shape, 'bpmn:SubProcess') && isExpanded(shape)) {
-        minDimensions[ id ] = SUB_PROCESS_MIN_DIMENSIONS;
-      }
-
-      if (is(shape, 'bpmn:TextAnnotation')) {
-        minDimensions[ id ] = TEXT_ANNOTATION_MIN_DIMENSIONS;
-      }
-
-      if (is(shape, 'bpmn:Group')) {
-        minDimensions[ id ] = GROUP_MIN_DIMENSIONS;
-      }
-    });
-
-    return minDimensions;
-  });
-}
-
-SpaceToolBehavior.$inject = [ 'eventBus' ];
-
-
-// helpers //////////
-function isHorizontal(axis) {
-  return axis === 'x';
-}
-
-/**
- * Get minimum height for participant taking lanes into account.
- *
- * @param {Shape} participant
- * @param {number} start
- *
- * @return {number}
- */
-function getParticipantMinHeight(participant, start) {
-  var lanesMinHeight;
-
-  if (!hasChildLanes(participant)) {
-    return PARTICIPANT_MIN_DIMENSIONS.height;
-  }
-
-  lanesMinHeight = getLanesMinHeight(participant, start);
-
-  return max(PARTICIPANT_MIN_DIMENSIONS.height, lanesMinHeight);
-}
-
-function hasChildLanes(element) {
-  return !!getChildLanes(element).length;
-}
-
-function getLanesMinHeight(participant, resizeStart) {
-  var lanes = getChildLanes(participant),
-      resizedLane;
-
-  // find the nested lane which is currently resized
-  resizedLane = findResizedLane(lanes, resizeStart);
-
-  // resized lane cannot shrink below the minimum height
-  // but remaining lanes' dimensions are kept intact
-  return participant.height - resizedLane.height + LANE_MIN_DIMENSIONS.height;
-}
-
-/**
- * Find nested lane which is currently resized.
- *
- * @param {Shape[]} lanes
- * @param {number} resizeStart
- *
- * @return {Shape}
- */
-function findResizedLane(lanes, resizeStart) {
-  var i, lane, childLanes;
-
-  for (i = 0; i < lanes.length; i++) {
-    lane = lanes[i];
-
-    // resizing current lane or a lane nested
-    if (resizeStart >= lane.y && resizeStart <= lane.y + lane.height) {
-      childLanes = getChildLanes(lane);
-
-      // a nested lane is resized
-      if (childLanes.length) {
-        return findResizedLane(childLanes, resizeStart);
-      }
-
-      // current lane is the resized one
-      return lane;
-    }
-  }
-}
+import { forEach } from 'min-dash';
+
+import { is } from '../../../util/ModelUtil';
+
+import {
+  isExpanded,
+  isHorizontal
+} from '../../../util/DiUtil';
+
+import {
+  GROUP_MIN_DIMENSIONS,
+  LANE_MIN_DIMENSIONS,
+  VERTICAL_LANE_MIN_DIMENSIONS,
+  PARTICIPANT_MIN_DIMENSIONS,
+  VERTICAL_PARTICIPANT_MIN_DIMENSIONS,
+  SUB_PROCESS_MIN_DIMENSIONS,
+  TEXT_ANNOTATION_MIN_DIMENSIONS
+} from './ResizeBehavior';
+
+import { getChildLanes } from '../util/LaneUtil';
+
+/**
+ * @typedef {import('diagram-js/lib/core/EventBus').default} EventBus
+ *
+ * @typedef {import('../../../model/Types').Shape} Shape
+ */
+
+var max = Math.max;
+
+/**
+ * @param {EventBus} eventBus
+ */
+export default function SpaceToolBehavior(eventBus) {
+  eventBus.on('spaceTool.getMinDimensions', function(context) {
+    var shapes = context.shapes,
+        axis = context.axis,
+        start = context.start,
+        minDimensions = {};
+
+    forEach(shapes, function(shape) {
+      var id = shape.id;
+
+      if (is(shape, 'bpmn:Participant')) {
+        minDimensions[ id ] = getParticipantMinDimensions(shape, axis, start);
+      }
+
+      if (is(shape, 'bpmn:Lane')) {
+        minDimensions[ id ] = isHorizontal(shape) ? LANE_MIN_DIMENSIONS : VERTICAL_LANE_MIN_DIMENSIONS;
+      }
+
+      if (is(shape, 'bpmn:SubProcess') && isExpanded(shape)) {
+        minDimensions[ id ] = SUB_PROCESS_MIN_DIMENSIONS;
+      }
+
+      if (is(shape, 'bpmn:TextAnnotation')) {
+        minDimensions[ id ] = TEXT_ANNOTATION_MIN_DIMENSIONS;
+      }
+
+      if (is(shape, 'bpmn:Group')) {
+        minDimensions[ id ] = GROUP_MIN_DIMENSIONS;
+      }
+    });
+
+    return minDimensions;
+  });
+}
+
+SpaceToolBehavior.$inject = [ 'eventBus' ];
+
+
+// helpers //////////
+function isHorizontalAxis(axis) {
+  return axis === 'x';
+}
+
+/**
+ * Get minimum dimensions for participant taking lanes into account.
+ *
+ * @param {Shape} participant
+ * @param {Axis} axis
+ * @param {number} start
+ *
+ * @return {number}
+ */
+function getParticipantMinDimensions(participant, axis, start) {
+  var isHorizontalLane = isHorizontal(participant);
+
+  if (!hasChildLanes(participant)) {
+    return isHorizontalLane ? PARTICIPANT_MIN_DIMENSIONS : VERTICAL_PARTICIPANT_MIN_DIMENSIONS;
+  }
+
+  var isHorizontalResize = isHorizontalAxis(axis);
+  var minDimensions = {};
+
+  if (isHorizontalResize) {
+    if (isHorizontalLane) {
+      minDimensions = PARTICIPANT_MIN_DIMENSIONS;
+    } else {
+      minDimensions = {
+        width: getParticipantMinWidth(participant, start, isHorizontalResize),
+        height: VERTICAL_PARTICIPANT_MIN_DIMENSIONS.height
+      };
+    }
+
+  } else {
+    if (isHorizontalLane) {
+      minDimensions = {
+        width: PARTICIPANT_MIN_DIMENSIONS.width,
+        height: getParticipantMinHeight(participant, start, isHorizontalResize)
+      };
+    } else {
+      minDimensions = VERTICAL_PARTICIPANT_MIN_DIMENSIONS;
+    }
+  }
+
+  return minDimensions;
+}
+
+/**
+ * Get minimum height for participant taking lanes into account.
+ *
+ * @param {Shape} participant
+ * @param {number} start
+ * @param {boolean} isHorizontalResize
+ *
+ * @return {number}
+ */
+function getParticipantMinHeight(participant, start, isHorizontalResize) {
+  var lanesMinHeight;
+  lanesMinHeight = getLanesMinHeight(participant, start, isHorizontalResize);
+  return max(PARTICIPANT_MIN_DIMENSIONS.height, lanesMinHeight);
+}
+
+/**
+ * Get minimum width for participant taking lanes into account.
+ *
+ * @param {Shape} participant
+ * @param {number} start
+ * @param {boolean} isHorizontalResize
+ *
+ * @return {number}
+ */
+function getParticipantMinWidth(participant, start, isHorizontalResize) {
+  var lanesMinWidth;
+  lanesMinWidth = getLanesMinWidth(participant, start, isHorizontalResize);
+  return max(VERTICAL_PARTICIPANT_MIN_DIMENSIONS.width, lanesMinWidth);
+}
+
+function hasChildLanes(element) {
+  return !!getChildLanes(element).length;
+}
+
+function getLanesMinHeight(participant, resizeStart, isHorizontalResize) {
+  var lanes = getChildLanes(participant),
+      resizedLane;
+
+  // find the nested lane which is currently resized
+  resizedLane = findResizedLane(lanes, resizeStart, isHorizontalResize);
+
+  // resized lane cannot shrink below the minimum height
+  // but remaining lanes' dimensions are kept intact
+  return participant.height - resizedLane.height + LANE_MIN_DIMENSIONS.height;
+}
+
+function getLanesMinWidth(participant, resizeStart, isHorizontalResize) {
+  var lanes = getChildLanes(participant),
+      resizedLane;
+
+  // find the nested lane which is currently resized
+  resizedLane = findResizedLane(lanes, resizeStart, isHorizontalResize);
+
+  // resized lane cannot shrink below the minimum width
+  // but remaining lanes' dimensions are kept intact
+  return participant.width - resizedLane.width + VERTICAL_LANE_MIN_DIMENSIONS.width;
+}
+
+/**
+ * Find nested lane which is currently resized.
+ *
+ * @param {Shape[]} lanes
+ * @param {number} resizeStart
+ * @param {boolean} isHorizontalResize
+ *
+ * @return {Shape}
+ */
+function findResizedLane(lanes, resizeStart, isHorizontalResize) {
+  var i, lane, childLanes;
+
+  for (i = 0; i < lanes.length; i++) {
+    lane = lanes[i];
+
+    // resizing current lane or a lane nested
+    if (!isHorizontalResize && resizeStart >= lane.y && resizeStart <= lane.y + lane.height ||
+        isHorizontalResize && resizeStart >= lane.x && resizeStart <= lane.x + lane.width) {
+
+      childLanes = getChildLanes(lane);
+
+      // a nested lane is resized
+      if (childLanes.length) {
+        return findResizedLane(childLanes, resizeStart, isHorizontalResize);
+      }
+
+      // current lane is the resized one
+      return lane;
+    }
+  }
+}

package/lib/features/modeling/behavior/TextAnnotationBehavior.d.ts

@@ -0,0 +1,6 @@
+export default class TextAnnotationBehavior extends CommandInterceptor {
+    constructor(eventBus: any);
+}
+
+type EventBus = import('diagram-js/lib/core/EventBus').default;
+import CommandInterceptor from 'diagram-js/lib/command/CommandInterceptor';

package/lib/features/modeling/behavior/TextAnnotationBehavior.js

@@ -0,0 +1,43 @@
+import inherits from 'inherits-browser';
+
+import { is } from '../../../util/ModelUtil';
+
+import CommandInterceptor from 'diagram-js/lib/command/CommandInterceptor';
+
+/**
+ * @typedef {import('diagram-js/lib/core/EventBus').default} EventBus
+ */
+
+export default function TextAnnotationBehavior(eventBus) {
+
+  CommandInterceptor.call(this, eventBus);
+
+  // On Append, TextAnnotations will be created on the Root.
+  // The default for connections will create the connection in the parent of
+  // the source element, so we overwrite the parent here.
+  this.preExecute('connection.create', function(context) {
+    const { target } = context;
+
+    if (!is(target, 'bpmn:TextAnnotation')) {
+      return;
+    }
+
+    context.parent = target.parent;
+  }, true);
+
+  this.preExecute([ 'shape.create', 'shape.resize', 'elements.move' ], function(context) {
+    const shapes = context.shapes || [ context.shape ];
+
+    if (shapes.length === 1 && is(shapes[0], 'bpmn:TextAnnotation')) {
+      context.hints = context.hints || {};
+
+      context.hints.autoResize = false;
+    }
+  }, true);
+}
+
+inherits(TextAnnotationBehavior, CommandInterceptor);
+
+TextAnnotationBehavior.$inject = [
+  'eventBus'
+];

package/lib/features/modeling/behavior/index.js

@@ -32,6 +32,7 @@ import RootElementReferenceBehavior from './RootElementReferenceBehavior';
 import SpaceToolBehavior from './SpaceToolBehavior';
 import SubProcessPlaneBehavior from './SubProcessPlaneBehavior';
 import SubProcessStartEventBehavior from './SubProcessStartEventBehavior';
+import TextAnnotationBehavior from './TextAnnotationBehavior';
 import ToggleCollapseConnectionBehaviour from './ToggleCollapseConnectionBehaviour';
 import ToggleElementCollapseBehaviour from './ToggleElementCollapseBehaviour';
 import UnclaimIdBehavior from './UnclaimIdBehavior';
@@ -77,6 +78,7 @@ export default {
     'spaceToolBehavior',
     'subProcessPlaneBehavior',
     'subProcessStartEventBehavior',
+    'textAnnotationBehavior',
     'toggleCollapseConnectionBehaviour',
     'toggleElementCollapseBehaviour',
     'unclaimIdBehavior',
@@ -117,6 +119,7 @@ export default {
   spaceToolBehavior: [ 'type', SpaceToolBehavior ],
   subProcessPlaneBehavior: [ 'type', SubProcessPlaneBehavior ],
   subProcessStartEventBehavior: [ 'type', SubProcessStartEventBehavior ],
+  textAnnotationBehavior: [ 'type', TextAnnotationBehavior ],
   toggleCollapseConnectionBehaviour: [ 'type', ToggleCollapseConnectionBehaviour ],
   toggleElementCollapseBehaviour : [ 'type', ToggleElementCollapseBehaviour ],
   unclaimIdBehavior: [ 'type', UnclaimIdBehavior ],

package/lib/features/modeling/cmd/AddLaneHandler.js

@@ -12,6 +12,10 @@ import {
   LANE_INDENTATION
 } from '../util/LaneUtil';
 
+import {
+  isHorizontal
+} from '../../../util/DiUtil';
+
 /**
  * @typedef {import('diagram-js/lib/command/CommandHandler').default} CommandHandler
  *
@@ -54,14 +58,47 @@ AddLaneHandler.prototype.preExecute = function(context) {
 
   var existingChildLanes = getChildLanes(laneParent);
 
+  var isHorizontalLane = isHorizontal(shape);
+
+  // never mix up horizontal/vertical lanes
+  if (isHorizontalLane) {
+    if (location === 'left') {
+      location = 'top';
+    } else
+    if (location === 'right') {
+      location = 'bottom';
+    }
+  } else {
+    if (location === 'top') {
+      location = 'left';
+    } else
+    if (location === 'bottom') {
+      location = 'right';
+    }
+  }
+
   // (0) add a lane if we currently got none and are adding to root
   if (!existingChildLanes.length) {
-    modeling.createShape({ type: 'bpmn:Lane' }, {
+    var siblingPosition = isHorizontalLane ? {
       x: shape.x + LANE_INDENTATION,
       y: shape.y,
       width: shape.width - LANE_INDENTATION,
       height: shape.height
-    }, laneParent);
+    } : {
+      x: shape.x,
+      y: shape.y + LANE_INDENTATION,
+      width: shape.width,
+      height: shape.height - LANE_INDENTATION
+    };
+
+    modeling.createShape(
+      {
+        type: 'bpmn:Lane',
+        isHorizontal: isHorizontalLane
+      },
+      siblingPosition,
+      laneParent
+    );
   }
 
   // (1) collect affected elements to create necessary space
@@ -84,26 +121,72 @@ AddLaneHandler.prototype.preExecute = function(context) {
     });
   });
 
-  var offset = location === 'top' ? -120 : 120,
-      lanePosition = location === 'top' ? shape.y : shape.y + shape.height,
-      spacePos = lanePosition + (location === 'top' ? 10 : -10),
-      direction = location === 'top' ? 'n' : 's';
+  var offset,
+      lanePosition,
+      spacePos,
+      direction,
+      axis;
+
+  if (location === 'top') {
+    offset = -120;
+    lanePosition = shape.y;
+    spacePos = lanePosition + 10;
+    direction = 'n';
+    axis = 'y';
+  } else
+  if (location === 'left') {
+    offset = -120;
+    lanePosition = shape.x;
+    spacePos = lanePosition + 10;
+    direction = 'w';
+    axis = 'x';
+  } else
+  if (location === 'bottom') {
+    offset = 120;
+    lanePosition = shape.y + shape.height;
+    spacePos = lanePosition - 10;
+    direction = 's';
+    axis = 'y';
+  } else
+  if (location === 'right') {
+    offset = 120;
+    lanePosition = shape.x + shape.width;
+    spacePos = lanePosition - 10;
+    direction = 'e';
+    axis = 'x';
+  }
 
-  var adjustments = spaceTool.calculateAdjustments(allAffected, 'y', offset, spacePos);
+  var adjustments = spaceTool.calculateAdjustments(allAffected, axis, offset, spacePos);
+
+  var delta = isHorizontalLane ? { x: 0, y: offset } : { x: offset, y: 0 };
 
   spaceTool.makeSpace(
     adjustments.movingShapes,
     adjustments.resizingShapes,
-    { x: 0, y: offset },
+    delta,
     direction,
     spacePos
   );
 
   // (2) create new lane at open space
-  context.newLane = modeling.createShape({ type: 'bpmn:Lane' }, {
+  var newLanePosition = isHorizontalLane ? {
     x: shape.x + (isRoot ? LANE_INDENTATION : 0),
     y: lanePosition - (location === 'top' ? 120 : 0),
     width: shape.width - (isRoot ? LANE_INDENTATION : 0),
     height: 120
-  }, laneParent);
+  } : {
+    x: lanePosition - (location === 'left' ? 120 : 0),
+    y: shape.y + (isRoot ? LANE_INDENTATION : 0),
+    width: 120,
+    height: shape.height - (isRoot ? LANE_INDENTATION : 0)
+  };
+
+  context.newLane = modeling.createShape(
+    {
+      type: 'bpmn:Lane',
+      isHorizontal: isHorizontalLane
+    },
+    newLanePosition,
+    laneParent
+  );
 };

package/lib/features/modeling/util/LaneUtil.js

@@ -4,6 +4,10 @@ import {
   getParent
 } from './ModelingUtil';
 
+import {
+  isHorizontal
+} from '../../../util/DiUtil';
+
 import {
   asTRBL
 } from 'diagram-js/lib/layout/LayoutUtil';
@@ -111,16 +115,18 @@ export function computeLanesResize(shape, newBounds) {
       trblResize = getTRBLResize(shape, newBounds),
       resizeNeeded = [];
 
+  var isHorizontalLane = isHorizontal(shape);
+
   allLanes.forEach(function(other) {
 
     if (other === shape) {
       return;
     }
 
-    var topResize = 0,
-        rightResize = trblResize.right,
-        bottomResize = 0,
-        leftResize = trblResize.left;
+    var topResize = isHorizontalLane ? 0 : trblResize.top,
+        rightResize = isHorizontalLane ? trblResize.right : 0,
+        bottomResize = isHorizontalLane ? 0 : trblResize.bottom,
+        leftResize = isHorizontalLane ? trblResize.left : 0;
 
     var otherTrbl = asTRBL(other);
 
@@ -134,6 +140,16 @@ export function computeLanesResize(shape, newBounds) {
       }
     }
 
+    if (trblResize.left) {
+      if (abs(otherTrbl.right - shapeTrbl.left) < 10) {
+        rightResize = shapeNewTrbl.left - otherTrbl.right;
+      }
+
+      if (abs(otherTrbl.left - shapeTrbl.left) < 5) {
+        leftResize = shapeNewTrbl.left - otherTrbl.left;
+      }
+    }
+
     if (trblResize.bottom) {
       if (abs(otherTrbl.top - shapeTrbl.bottom) < 10) {
         topResize = shapeNewTrbl.bottom - otherTrbl.top;
@@ -144,6 +160,16 @@ export function computeLanesResize(shape, newBounds) {
       }
     }
 
+    if (trblResize.right) {
+      if (abs(otherTrbl.left - shapeTrbl.right) < 10) {
+        leftResize = shapeNewTrbl.right - otherTrbl.left;
+      }
+
+      if (abs(otherTrbl.right - shapeTrbl.right) < 5) {
+        rightResize = shapeNewTrbl.right - otherTrbl.right;
+      }
+    }
+
     if (topResize || rightResize || bottomResize || leftResize) {
 
       resizeNeeded.push({

package/lib/features/ordering/BpmnOrderingProvider.js

@@ -3,6 +3,7 @@ import inherits from 'inherits-browser';
 import OrderingProvider from 'diagram-js/lib/features/ordering/OrderingProvider';
 
 import {
+  is,
   isAny
 } from '../modeling/util/ModelingUtil';
 
@@ -54,6 +55,12 @@ export default function BpmnOrderingProvider(eventBus, canvas, translate) {
         ]
       }
     },
+    {
+      type: 'bpmn:TextAnnotation',
+      order: {
+        level: 9
+      }
+    },
     {
       type: 'bpmn:MessageFlow', order: {
         level: 9,
@@ -136,8 +143,8 @@ export default function BpmnOrderingProvider(eventBus, canvas, translate) {
 
   this.getOrdering = function(element, newParent) {
 
-    // render labels always on top
-    if (element.labelTarget) {
+    // render labels and text annotations always on top
+    if (element.labelTarget || is(element, 'bpmn:TextAnnotation')) {
       return {
         parent: canvas.findRoot(newParent) || canvas.getRootElement(),
         index: -1