camunda-bpmn-js 0.13.0-alpha.2 → 0.13.0-alpha.3

package/dist/base-modeler.development.js

@@ -17361,16 +17361,16 @@
 	    return drawPath(parentGfx, path, assign({ 'data-marker': type }, attrs));
 	  }
 
+	  function renderer(type) {
+	    return handlers[type];
+	  }
+
 	  function as(type) {
 	    return function(parentGfx, element) {
-	      return handlers[type](parentGfx, element);
+	      return renderer(type)(parentGfx, element);
 	    };
 	  }
 
-	  function renderer(type) {
-	    return handlers[type];
-	  }
-
 	  function renderEventContent(element, parentGfx) {
 
 	    var event = getSemantic(element);
@@ -18851,6 +18851,7 @@
 	  // extension API, use at your own risk
 	  this._drawPath = drawPath;
 
+	  this._renderer = renderer;
 	}
 
 
@@ -18872,7 +18873,7 @@
 
 	BpmnRenderer.prototype.drawShape = function(parentGfx, element) {
 	  var type = element.type;
-	  var h = this.handlers[type];
+	  var h = this._renderer(type);
 
 	  /* jshint -W040 */
 	  return h(parentGfx, element);
@@ -18880,7 +18881,7 @@
 
 	BpmnRenderer.prototype.drawConnection = function(parentGfx, element) {
 	  var type = element.type;
-	  var h = this.handlers[type];
+	  var h = this._renderer(type);
 
 	  /* jshint -W040 */
 	  return h(parentGfx, element);
@@ -19885,7 +19886,7 @@
 	  });
 	}
 
-	var translateModule = {
+	var translate$2 = {
 	  translate: [ 'value', translate$1 ]
 	};
 
@@ -20366,7 +20367,7 @@
 
 	var ImportModule = {
 	  __depends__: [
-	    translateModule
+	    translate$2
 	  ],
 	  bpmnImporter: [ 'type', BpmnImporter ]
 	};
@@ -22735,6 +22736,11 @@
 
 	  plane.get('planeElement').forEach(function(diElement) {
 	    var bo = diElement.bpmnElement;
+
+	    if (!bo) {
+	      return;
+	    }
+
 	    var parent = bo.$parent;
 
 	    if (is$1(bo, 'bpmn:SubProcess') && !diElement.isExpanded) {
@@ -22764,7 +22770,7 @@
 	    var parent = element.parent;
 
 	    // parent is expanded, get nearest collapsed parent
-	    while (parent && !collapsedElements.includes(parent)) {
+	    while (parent && collapsedElements.indexOf(parent) === -1) {
 	      parent = parent.$parent;
 	    }
 
@@ -23102,7 +23108,7 @@
 	// modules the viewer is composed of
 	Viewer.prototype._modules = [
 	  CoreModule$1,
-	  translateModule,
+	  translate$2,
 	  SelectionModule,
 	  OverlaysModule,
 	  DrilldownModdule
@@ -23255,7 +23261,7 @@
 	  }
 
 	  var allowedModifiers = this._getAllowedModifiers(event.target);
-	  return !allowedModifiers.includes(event.key);
+	  return allowedModifiers.indexOf(event.key) === -1;
 	};
 
 	Keyboard.prototype._getAllowedModifiers = function(element) {
@@ -31568,6 +31574,537 @@
 	  connectionPreview: [ 'type', ConnectionPreview ]
 	};
 
+	function getOriginal$1(event) {
+	  return event.originalEvent || event.srcEvent;
+	}
+
+	function isButton$1(event, button) {
+	  return (getOriginal$1(event) || event).button === button;
+	}
+
+	function isPrimaryButton$1(event) {
+
+	  // button === 0 -> left áka primary mouse button
+	  return isButton$1(event, 0);
+	}
+
+	function isAuxiliaryButton$1(event) {
+
+	  // button === 1 -> auxiliary áka wheel button
+	  return isButton$1(event, 1);
+	}
+
+	function toSVGPoints$1(points) {
+	  var result = '';
+
+	  for (var i = 0, p; (p = points[i]); i++) {
+	    result += p.x + ',' + p.y + ' ';
+	  }
+
+	  return result;
+	}
+
+	function createLine$1(points, attrs) {
+
+	  var line = create('polyline');
+	  attr$1(line, { points: toSVGPoints$1(points) });
+
+	  if (attrs) {
+	    attr$1(line, attrs);
+	  }
+
+	  return line;
+	}
+
+	function updateLine$1(gfx, points) {
+	  attr$1(gfx, { points: toSVGPoints$1(points) });
+
+	  return gfx;
+	}
+
+	function allowAll$1(event) { return true; }
+
+	function allowPrimaryAndAuxiliary$1(event) {
+	  return isPrimaryButton$1(event) || isAuxiliaryButton$1(event);
+	}
+
+	var LOW_PRIORITY$7 = 500;
+
+
+	/**
+	 * A plugin that provides interaction events for diagram elements.
+	 *
+	 * It emits the following events:
+	 *
+	 *   * element.click
+	 *   * element.contextmenu
+	 *   * element.dblclick
+	 *   * element.hover
+	 *   * element.mousedown
+	 *   * element.mousemove
+	 *   * element.mouseup
+	 *   * element.out
+	 *
+	 * Each event is a tuple { element, gfx, originalEvent }.
+	 *
+	 * Canceling the event via Event#preventDefault()
+	 * prevents the original DOM operation.
+	 *
+	 * @param {EventBus} eventBus
+	 */
+	function InteractionEvents$1(eventBus, elementRegistry, styles) {
+
+	  var self = this;
+
+	  /**
+	   * Fire an interaction event.
+	   *
+	   * @param {string} type local event name, e.g. element.click.
+	   * @param {DOMEvent} event native event
+	   * @param {djs.model.Base} [element] the diagram element to emit the event on;
+	   *                                   defaults to the event target
+	   */
+	  function fire(type, event, element) {
+
+	    if (isIgnored(type, event)) {
+	      return;
+	    }
+
+	    var target, gfx, returnValue;
+
+	    if (!element) {
+	      target = event.delegateTarget || event.target;
+
+	      if (target) {
+	        gfx = target;
+	        element = elementRegistry.get(gfx);
+	      }
+	    } else {
+	      gfx = elementRegistry.getGraphics(element);
+	    }
+
+	    if (!gfx || !element) {
+	      return;
+	    }
+
+	    returnValue = eventBus.fire(type, {
+	      element: element,
+	      gfx: gfx,
+	      originalEvent: event
+	    });
+
+	    if (returnValue === false) {
+	      event.stopPropagation();
+	      event.preventDefault();
+	    }
+	  }
+
+	  // TODO(nikku): document this
+	  var handlers = {};
+
+	  function mouseHandler(localEventName) {
+	    return handlers[localEventName];
+	  }
+
+	  function isIgnored(localEventName, event) {
+
+	    var filter = ignoredFilters[localEventName] || isPrimaryButton$1;
+
+	    // only react on left mouse button interactions
+	    // except for interaction events that are enabled
+	    // for secundary mouse button
+	    return !filter(event);
+	  }
+
+	  var bindings = {
+	    click: 'element.click',
+	    contextmenu: 'element.contextmenu',
+	    dblclick: 'element.dblclick',
+	    mousedown: 'element.mousedown',
+	    mousemove: 'element.mousemove',
+	    mouseover: 'element.hover',
+	    mouseout: 'element.out',
+	    mouseup: 'element.mouseup',
+	  };
+
+	  var ignoredFilters = {
+	    'element.contextmenu': allowAll$1,
+	    'element.mousedown': allowPrimaryAndAuxiliary$1,
+	    'element.mouseup': allowPrimaryAndAuxiliary$1,
+	    'element.click': allowPrimaryAndAuxiliary$1,
+	    'element.dblclick': allowPrimaryAndAuxiliary$1
+	  };
+
+
+	  // manual event trigger //////////
+
+	  /**
+	   * Trigger an interaction event (based on a native dom event)
+	   * on the target shape or connection.
+	   *
+	   * @param {string} eventName the name of the triggered DOM event
+	   * @param {MouseEvent} event
+	   * @param {djs.model.Base} targetElement
+	   */
+	  function triggerMouseEvent(eventName, event, targetElement) {
+
+	    // i.e. element.mousedown...
+	    var localEventName = bindings[eventName];
+
+	    if (!localEventName) {
+	      throw new Error('unmapped DOM event name <' + eventName + '>');
+	    }
+
+	    return fire(localEventName, event, targetElement);
+	  }
+
+
+	  var ELEMENT_SELECTOR = 'svg, .djs-element';
+
+	  // event handling ///////
+
+	  function registerEvent(node, event, localEvent, ignoredFilter) {
+
+	    var handler = handlers[localEvent] = function(event) {
+	      fire(localEvent, event);
+	    };
+
+	    if (ignoredFilter) {
+	      ignoredFilters[localEvent] = ignoredFilter;
+	    }
+
+	    handler.$delegate = delegate.bind(node, ELEMENT_SELECTOR, event, handler);
+	  }
+
+	  function unregisterEvent(node, event, localEvent) {
+
+	    var handler = mouseHandler(localEvent);
+
+	    if (!handler) {
+	      return;
+	    }
+
+	    delegate.unbind(node, event, handler.$delegate);
+	  }
+
+	  function registerEvents(svg) {
+	    forEach(bindings, function(val, key) {
+	      registerEvent(svg, key, val);
+	    });
+	  }
+
+	  function unregisterEvents(svg) {
+	    forEach(bindings, function(val, key) {
+	      unregisterEvent(svg, key, val);
+	    });
+	  }
+
+	  eventBus.on('canvas.destroy', function(event) {
+	    unregisterEvents(event.svg);
+	  });
+
+	  eventBus.on('canvas.init', function(event) {
+	    registerEvents(event.svg);
+	  });
+
+
+	  // hit box updating ////////////////
+
+	  eventBus.on([ 'shape.added', 'connection.added' ], function(event) {
+	    var element = event.element,
+	        gfx = event.gfx;
+
+	    eventBus.fire('interactionEvents.createHit', { element: element, gfx: gfx });
+	  });
+
+	  // Update djs-hit on change.
+	  // A low priortity is necessary, because djs-hit of labels has to be updated
+	  // after the label bounds have been updated in the renderer.
+	  eventBus.on([
+	    'shape.changed',
+	    'connection.changed'
+	  ], LOW_PRIORITY$7, function(event) {
+
+	    var element = event.element,
+	        gfx = event.gfx;
+
+	    eventBus.fire('interactionEvents.updateHit', { element: element, gfx: gfx });
+	  });
+
+	  eventBus.on('interactionEvents.createHit', LOW_PRIORITY$7, function(event) {
+	    var element = event.element,
+	        gfx = event.gfx;
+
+	    self.createDefaultHit(element, gfx);
+	  });
+
+	  eventBus.on('interactionEvents.updateHit', function(event) {
+	    var element = event.element,
+	        gfx = event.gfx;
+
+	    self.updateDefaultHit(element, gfx);
+	  });
+
+
+	  // hit styles ////////////
+
+	  var STROKE_HIT_STYLE = createHitStyle('djs-hit djs-hit-stroke');
+
+	  var CLICK_STROKE_HIT_STYLE = createHitStyle('djs-hit djs-hit-click-stroke');
+
+	  var ALL_HIT_STYLE = createHitStyle('djs-hit djs-hit-all');
+
+	  var HIT_TYPES = {
+	    'all': ALL_HIT_STYLE,
+	    'click-stroke': CLICK_STROKE_HIT_STYLE,
+	    'stroke': STROKE_HIT_STYLE
+	  };
+
+	  function createHitStyle(classNames, attrs) {
+
+	    attrs = assign({
+	      stroke: 'white',
+	      strokeWidth: 15
+	    }, attrs || {});
+
+	    return styles.cls(classNames, [ 'no-fill', 'no-border' ], attrs);
+	  }
+
+
+	  // style helpers ///////////////
+
+	  function applyStyle(hit, type) {
+
+	    var attrs = HIT_TYPES[type];
+
+	    if (!attrs) {
+	      throw new Error('invalid hit type <' + type + '>');
+	    }
+
+	    attr$1(hit, attrs);
+
+	    return hit;
+	  }
+
+	  function appendHit(gfx, hit) {
+	    append(gfx, hit);
+	  }
+
+
+	  // API
+
+	  /**
+	   * Remove hints on the given graphics.
+	   *
+	   * @param {SVGElement} gfx
+	   */
+	  this.removeHits = function(gfx) {
+	    var hits = all('.djs-hit', gfx);
+
+	    forEach(hits, remove$1);
+	  };
+
+	  /**
+	   * Create default hit for the given element.
+	   *
+	   * @param {djs.model.Base} element
+	   * @param {SVGElement} gfx
+	   *
+	   * @return {SVGElement} created hit
+	   */
+	  this.createDefaultHit = function(element, gfx) {
+	    var waypoints = element.waypoints,
+	        isFrame = element.isFrame,
+	        boxType;
+
+	    if (waypoints) {
+	      return this.createWaypointsHit(gfx, waypoints);
+	    } else {
+
+	      boxType = isFrame ? 'stroke' : 'all';
+
+	      return this.createBoxHit(gfx, boxType, {
+	        width: element.width,
+	        height: element.height
+	      });
+	    }
+	  };
+
+	  /**
+	   * Create hits for the given waypoints.
+	   *
+	   * @param {SVGElement} gfx
+	   * @param {Array<Point>} waypoints
+	   *
+	   * @return {SVGElement}
+	   */
+	  this.createWaypointsHit = function(gfx, waypoints) {
+
+	    var hit = createLine$1(waypoints);
+
+	    applyStyle(hit, 'stroke');
+
+	    appendHit(gfx, hit);
+
+	    return hit;
+	  };
+
+	  /**
+	   * Create hits for a box.
+	   *
+	   * @param {SVGElement} gfx
+	   * @param {string} hitType
+	   * @param {Object} attrs
+	   *
+	   * @return {SVGElement}
+	   */
+	  this.createBoxHit = function(gfx, type, attrs) {
+
+	    attrs = assign({
+	      x: 0,
+	      y: 0
+	    }, attrs);
+
+	    var hit = create('rect');
+
+	    applyStyle(hit, type);
+
+	    attr$1(hit, attrs);
+
+	    appendHit(gfx, hit);
+
+	    return hit;
+	  };
+
+	  /**
+	   * Update default hit of the element.
+	   *
+	   * @param  {djs.model.Base} element
+	   * @param  {SVGElement} gfx
+	   *
+	   * @return {SVGElement} updated hit
+	   */
+	  this.updateDefaultHit = function(element, gfx) {
+
+	    var hit = query('.djs-hit', gfx);
+
+	    if (!hit) {
+	      return;
+	    }
+
+	    if (element.waypoints) {
+	      updateLine$1(hit, element.waypoints);
+	    } else {
+	      attr$1(hit, {
+	        width: element.width,
+	        height: element.height
+	      });
+	    }
+
+	    return hit;
+	  };
+
+	  this.fire = fire;
+
+	  this.triggerMouseEvent = triggerMouseEvent;
+
+	  this.mouseHandler = mouseHandler;
+
+	  this.registerEvent = registerEvent;
+	  this.unregisterEvent = unregisterEvent;
+	}
+
+
+	InteractionEvents$1.$inject = [
+	  'eventBus',
+	  'elementRegistry',
+	  'styles'
+	];
+
+
+	/**
+	 * An event indicating that the mouse hovered over an element
+	 *
+	 * @event element.hover
+	 *
+	 * @type {Object}
+	 * @property {djs.model.Base} element
+	 * @property {SVGElement} gfx
+	 * @property {Event} originalEvent
+	 */
+
+	/**
+	 * An event indicating that the mouse has left an element
+	 *
+	 * @event element.out
+	 *
+	 * @type {Object}
+	 * @property {djs.model.Base} element
+	 * @property {SVGElement} gfx
+	 * @property {Event} originalEvent
+	 */
+
+	/**
+	 * An event indicating that the mouse has clicked an element
+	 *
+	 * @event element.click
+	 *
+	 * @type {Object}
+	 * @property {djs.model.Base} element
+	 * @property {SVGElement} gfx
+	 * @property {Event} originalEvent
+	 */
+
+	/**
+	 * An event indicating that the mouse has double clicked an element
+	 *
+	 * @event element.dblclick
+	 *
+	 * @type {Object}
+	 * @property {djs.model.Base} element
+	 * @property {SVGElement} gfx
+	 * @property {Event} originalEvent
+	 */
+
+	/**
+	 * An event indicating that the mouse has gone down on an element.
+	 *
+	 * @event element.mousedown
+	 *
+	 * @type {Object}
+	 * @property {djs.model.Base} element
+	 * @property {SVGElement} gfx
+	 * @property {Event} originalEvent
+	 */
+
+	/**
+	 * An event indicating that the mouse has gone up on an element.
+	 *
+	 * @event element.mouseup
+	 *
+	 * @type {Object}
+	 * @property {djs.model.Base} element
+	 * @property {SVGElement} gfx
+	 * @property {Event} originalEvent
+	 */
+
+	/**
+	 * An event indicating that the context menu action is triggered
+	 * via mouse or touch controls.
+	 *
+	 * @event element.contextmenu
+	 *
+	 * @type {Object}
+	 * @property {djs.model.Base} element
+	 * @property {SVGElement} gfx
+	 * @property {Event} originalEvent
+	 */
+
+	var InteractionEventsModule$1 = {
+	  __init__: [ 'interactionEvents' ],
+	  interactionEvents: [ 'type', InteractionEvents$1 ]
+	};
+
 	var min = Math.min,
 	    max$1 = Math.max;
 
@@ -32201,7 +32738,7 @@
 
 	var DirectEditingModule = {
 	  __depends__: [
-	    InteractionEventsModule
+	    InteractionEventsModule$1
 	  ],
 	  __init__: [ 'directEditing' ],
 	  directEditing: [ 'type', DirectEditing ]
@@ -33154,7 +33691,7 @@
 	  return !!element.labelTarget;
 	}
 
-	var LOW_PRIORITY$7 = 750;
+	var LOW_PRIORITY$8 = 750;
 
 
 	function CreatePreview(
@@ -33199,7 +33736,7 @@
 	    return dragGroup;
 	  }
 
-	  eventBus.on('create.move', LOW_PRIORITY$7, function(event) {
+	  eventBus.on('create.move', LOW_PRIORITY$8, function(event) {
 
 	    var hover = event.hover,
 	        context = event.context,
@@ -34566,12 +35103,12 @@
 	  });
 	}
 
-	var LOW_PRIORITY$8 = 750;
+	var LOW_PRIORITY$9 = 750;
 
 
 	function BpmnCopyPaste(bpmnFactory, eventBus, moddleCopy) {
 
-	  eventBus.on('copyPaste.copyElement', LOW_PRIORITY$8, function(context) {
+	  eventBus.on('copyPaste.copyElement', LOW_PRIORITY$9, function(context) {
 	    var descriptor = context.descriptor,
 	        element = context.element;
 
@@ -38379,7 +38916,7 @@
 	}
 
 	var LOWER_PRIORITY = 1200;
-	var LOW_PRIORITY$9 = 800;
+	var LOW_PRIORITY$a = 800;
 
 	/**
 	 * Basic grid snapping that covers connecting, creating, moving, resizing shapes, moving bendpoints
@@ -38393,7 +38930,7 @@
 
 	  var self = this;
 
-	  eventBus.on('diagram.init', LOW_PRIORITY$9, function() {
+	  eventBus.on('diagram.init', LOW_PRIORITY$a, function() {
 	    self.setActive(active);
 	  });
 
@@ -39284,7 +39821,7 @@
 	  return true;
 	};
 
-	var InteractionEventsModule$1 = {
+	var InteractionEventsModule$2 = {
 	  __init__: [ 'bpmnInteractionEvents' ],
 	  bpmnInteractionEvents: [ 'type', BpmnInteractionEvents ]
 	};
@@ -39870,7 +40407,7 @@
 	var MARKER_RESIZING = 'djs-resizing',
 	    MARKER_RESIZE_NOT_OK = 'resize-not-ok';
 
-	var LOW_PRIORITY$a = 500;
+	var LOW_PRIORITY$b = 500;
 
 
 	/**
@@ -39931,7 +40468,7 @@
 	  }
 
 	  // add and update previews
-	  eventBus.on('resize.move', LOW_PRIORITY$a, function(event) {
+	  eventBus.on('resize.move', LOW_PRIORITY$b, function(event) {
 	    updateFrame(event.context);
 	  });
 
@@ -41028,7 +41565,7 @@
 	  'modeling'
 	];
 
-	var LOW_PRIORITY$b = 500;
+	var LOW_PRIORITY$c = 500;
 
 
 	/**
@@ -41041,7 +41578,7 @@
 
 	  var self = this;
 
-	  this.postExecuted('elements.create', LOW_PRIORITY$b, function(context) {
+	  this.postExecuted('elements.create', LOW_PRIORITY$c, function(context) {
 	    var elements = context.elements;
 
 	    elements = elements.filter(function(shape) {
@@ -41064,7 +41601,7 @@
 	  }, true);
 
 
-	  this.preExecute('elements.move', LOW_PRIORITY$b, function(context) {
+	  this.preExecute('elements.move', LOW_PRIORITY$c, function(context) {
 	    var shapes = context.shapes,
 	        host = context.newHost;
 
@@ -41190,167 +41727,6 @@
 
 	inherits_browser(BoundaryEventBehavior, CommandInterceptor);
 
-	var LOW_PRIORITY$c = 500;
-
-
-	/**
-	 * Add referenced root elements (error, escalation, message, signal) if they don't exist.
-	 * Copy referenced root elements on copy & paste.
-	 */
-	function RootElementReferenceBehavior(
-	    bpmnjs, eventBus, injector, moddleCopy, bpmnFactory
-	) {
-	  injector.invoke(CommandInterceptor, this);
-
-	  function canHaveRootElementReference(element) {
-	    return isAny(element, [ 'bpmn:ReceiveTask', 'bpmn:SendTask' ]) ||
-	      hasAnyEventDefinition(element, [
-	        'bpmn:ErrorEventDefinition',
-	        'bpmn:EscalationEventDefinition',
-	        'bpmn:MessageEventDefinition',
-	        'bpmn:SignalEventDefinition'
-	      ]);
-	  }
-
-	  function hasRootElement(rootElement) {
-	    var definitions = bpmnjs.getDefinitions(),
-	        rootElements = definitions.get('rootElements');
-
-	    return !!find(rootElements, matchPattern({ id: rootElement.id }));
-	  }
-
-	  function getRootElementReferencePropertyName(eventDefinition) {
-	    if (is$1(eventDefinition, 'bpmn:ErrorEventDefinition')) {
-	      return 'errorRef';
-	    } else if (is$1(eventDefinition, 'bpmn:EscalationEventDefinition')) {
-	      return 'escalationRef';
-	    } else if (is$1(eventDefinition, 'bpmn:MessageEventDefinition')) {
-	      return 'messageRef';
-	    } else if (is$1(eventDefinition, 'bpmn:SignalEventDefinition')) {
-	      return 'signalRef';
-	    }
-	  }
-
-	  function getRootElement(businessObject) {
-	    if (isAny(businessObject, [ 'bpmn:ReceiveTask', 'bpmn:SendTask' ])) {
-	      return businessObject.get('messageRef');
-	    }
-
-	    var eventDefinitions = businessObject.get('eventDefinitions'),
-	        eventDefinition = eventDefinitions[ 0 ];
-
-	    return eventDefinition.get(getRootElementReferencePropertyName(eventDefinition));
-	  }
-
-	  function setRootElement(businessObject, rootElement) {
-	    if (isAny(businessObject, [ 'bpmn:ReceiveTask', 'bpmn:SendTask' ])) {
-	      return businessObject.set('messageRef', rootElement);
-	    }
-
-	    var eventDefinitions = businessObject.get('eventDefinitions'),
-	        eventDefinition = eventDefinitions[ 0 ];
-
-	    return eventDefinition.set(getRootElementReferencePropertyName(eventDefinition), rootElement);
-	  }
-
-	  // create shape
-	  this.executed('shape.create', function(context) {
-	    var shape = context.shape;
-
-	    if (!canHaveRootElementReference(shape)) {
-	      return;
-	    }
-
-	    var businessObject = getBusinessObject(shape),
-	        rootElement = getRootElement(businessObject),
-	        rootElements;
-
-	    if (rootElement && !hasRootElement(rootElement)) {
-	      rootElements = bpmnjs.getDefinitions().get('rootElements');
-
-	      // add root element
-	      add$1(rootElements, rootElement);
-
-	      context.addedRootElement = rootElement;
-	    }
-	  }, true);
-
-	  this.reverted('shape.create', function(context) {
-	    var addedRootElement = context.addedRootElement;
-
-	    if (!addedRootElement) {
-	      return;
-	    }
-
-	    var rootElements = bpmnjs.getDefinitions().get('rootElements');
-
-	    // remove root element
-	    remove$2(rootElements, addedRootElement);
-	  }, true);
-
-	  eventBus.on('copyPaste.copyElement', function(context) {
-	    var descriptor = context.descriptor,
-	        element = context.element;
-
-	    if (!canHaveRootElementReference(element)) {
-	      return;
-	    }
-
-	    var businessObject = getBusinessObject(element),
-	        rootElement = getRootElement(businessObject);
-
-	    if (rootElement) {
-	      descriptor.referencedRootElement = rootElement;
-	    }
-	  });
-
-	  eventBus.on('copyPaste.pasteElement', LOW_PRIORITY$c, function(context) {
-	    var descriptor = context.descriptor,
-	        businessObject = descriptor.businessObject;
-
-	    if (!canHaveRootElementReference(businessObject)) {
-	      return;
-	    }
-
-	    var referencedRootElement = descriptor.referencedRootElement;
-
-	    if (!referencedRootElement) {
-	      return;
-	    }
-
-	    if (!hasRootElement(referencedRootElement)) {
-	      referencedRootElement = moddleCopy.copyElement(
-	        referencedRootElement,
-	        bpmnFactory.create(referencedRootElement.$type)
-	      );
-	    }
-
-	    setRootElement(businessObject, referencedRootElement);
-	  });
-	}
-
-	RootElementReferenceBehavior.$inject = [
-	  'bpmnjs',
-	  'eventBus',
-	  'injector',
-	  'moddleCopy',
-	  'bpmnFactory'
-	];
-
-	inherits_browser(RootElementReferenceBehavior, CommandInterceptor);
-
-	// helpers //////////
-
-	function hasAnyEventDefinition(element, types) {
-	  if (!isArray(types)) {
-	    types = [ types ];
-	  }
-
-	  return some(types, function(type) {
-	    return hasEventDefinition(element, type);
-	  });
-	}
-
 	function CreateBehavior(injector) {
 	  injector.invoke(CommandInterceptor, this);
 
@@ -41371,118 +41747,6 @@
 
 	inherits_browser(CreateBehavior, CommandInterceptor);
 
-	var HIGH_PRIORITY$8 = 1500;
-	var HIGHEST_PRIORITY = 2000;
-
-
-	/**
-	 * Correct hover targets in certain situations to improve diagram interaction.
-	 *
-	 * @param {ElementRegistry} elementRegistry
-	 * @param {EventBus} eventBus
-	 * @param {Canvas} canvas
-	 */
-	function FixHoverBehavior(elementRegistry, eventBus, canvas) {
-
-	  eventBus.on([
-	    'create.hover',
-	    'create.move',
-	    'create.out',
-	    'create.end',
-	    'shape.move.hover',
-	    'shape.move.move',
-	    'shape.move.out',
-	    'shape.move.end'
-	  ], HIGH_PRIORITY$8, function(event) {
-	    var context = event.context,
-	        shape = context.shape || event.shape,
-	        hover = event.hover;
-
-	    // ensure elements are not dropped onto a bpmn:Lane but onto
-	    // the underlying bpmn:Participant
-	    if (is$1(hover, 'bpmn:Lane') && !isAny(shape, [ 'bpmn:Lane', 'bpmn:Participant' ])) {
-	      event.hover = getLanesRoot(hover);
-	      event.hoverGfx = elementRegistry.getGraphics(event.hover);
-	    }
-
-	    var rootElement = canvas.getRootElement();
-
-	    // ensure bpmn:Group and label elements are dropped
-	    // always onto the root
-	    if (hover !== rootElement && (shape.labelTarget || is$1(shape, 'bpmn:Group'))) {
-	      event.hover = rootElement;
-	      event.hoverGfx = elementRegistry.getGraphics(event.hover);
-	    }
-	  });
-
-	  eventBus.on([
-	    'connect.hover',
-	    'connect.out',
-	    'connect.end',
-	    'connect.cleanup',
-	    'global-connect.hover',
-	    'global-connect.out',
-	    'global-connect.end',
-	    'global-connect.cleanup'
-	  ], HIGH_PRIORITY$8, function(event) {
-	    var hover = event.hover;
-
-	    // ensure connections start/end on bpmn:Participant,
-	    // not the underlying bpmn:Lane
-	    if (is$1(hover, 'bpmn:Lane')) {
-	      event.hover = getLanesRoot(hover) || hover;
-	      event.hoverGfx = elementRegistry.getGraphics(event.hover);
-	    }
-	  });
-
-
-	  eventBus.on([
-	    'bendpoint.move.hover'
-	  ], HIGH_PRIORITY$8, function(event) {
-	    var context = event.context,
-	        hover = event.hover,
-	        type = context.type;
-
-	    // ensure reconnect start/end on bpmn:Participant,
-	    // not the underlying bpmn:Lane
-	    if (is$1(hover, 'bpmn:Lane') && /reconnect/.test(type)) {
-	      event.hover = getLanesRoot(hover) || hover;
-	      event.hoverGfx = elementRegistry.getGraphics(event.hover);
-	    }
-	  });
-
-
-	  eventBus.on([
-	    'connect.start'
-	  ], HIGH_PRIORITY$8, function(event) {
-	    var context = event.context,
-	        start = context.start;
-
-	    // ensure connect start on bpmn:Participant,
-	    // not the underlying bpmn:Lane
-	    if (is$1(start, 'bpmn:Lane')) {
-	      context.start = getLanesRoot(start) || start;
-	    }
-	  });
-
-
-	  // allow movement of participants from lanes
-	  eventBus.on('shape.move.start', HIGHEST_PRIORITY, function(event) {
-	    var shape = event.shape;
-
-	    if (is$1(shape, 'bpmn:Lane')) {
-	      event.shape = getLanesRoot(shape) || shape;
-	    }
-	  });
-
-	}
-
-	FixHoverBehavior.$inject = [
-	  'elementRegistry',
-	  'eventBus',
-	  'canvas'
-	];
-
 	/**
 	 * BPMN specific create data object behavior
 	 */
@@ -41520,7 +41784,7 @@
 
 	var PARTICIPANT_BORDER_WIDTH = 30;
 
-	var HIGH_PRIORITY$9 = 2000;
+	var HIGH_PRIORITY$8 = 2000;
 
 
 	/**
@@ -41533,7 +41797,7 @@
 	  eventBus.on([
 	    'create.start',
 	    'shape.move.start'
-	  ], HIGH_PRIORITY$9, function(event) {
+	  ], HIGH_PRIORITY$8, function(event) {
 	    var context = event.context,
 	        shape = context.shape,
 	        rootElement = canvas.getRootElement();
@@ -41568,7 +41832,7 @@
 	  });
 
 	  // force hovering process when creating first participant
-	  eventBus.on('create.start', HIGH_PRIORITY$9, function(event) {
+	  eventBus.on('create.start', HIGH_PRIORITY$8, function(event) {
 	    var context = event.context,
 	        shape = context.shape,
 	        rootElement = canvas.getRootElement(),
@@ -41580,7 +41844,7 @@
 	    }
 
 	    if (is$1(shape, 'bpmn:Participant') && is$1(rootElement, 'bpmn:Process')) {
-	      eventBus.on('element.hover', HIGH_PRIORITY$9, ensureHoveringProcess);
+	      eventBus.on('element.hover', HIGH_PRIORITY$8, ensureHoveringProcess);
 
 	      eventBus.once('create.cleanup', function() {
 	        eventBus.off('element.hover', ensureHoveringProcess);
@@ -41601,7 +41865,7 @@
 
 	  // when creating mutliple elements through `elements.create` parent must be set to collaboration
 	  // and passed to `shape.create` as hint
-	  this.preExecute('elements.create', HIGH_PRIORITY$9, function(context) {
+	  this.preExecute('elements.create', HIGH_PRIORITY$8, function(context) {
 	    var elements = context.elements,
 	        parent = context.parent,
 	        participant = findParticipant(elements),
@@ -42560,6 +42824,118 @@
 	  return is$1(connection, 'bpmn:SequenceFlow');
 	}
 
+	var HIGH_PRIORITY$9 = 1500;
+	var HIGHEST_PRIORITY = 2000;
+
+
+	/**
+	 * Correct hover targets in certain situations to improve diagram interaction.
+	 *
+	 * @param {ElementRegistry} elementRegistry
+	 * @param {EventBus} eventBus
+	 * @param {Canvas} canvas
+	 */
+	function FixHoverBehavior(elementRegistry, eventBus, canvas) {
+
+	  eventBus.on([
+	    'create.hover',
+	    'create.move',
+	    'create.out',
+	    'create.end',
+	    'shape.move.hover',
+	    'shape.move.move',
+	    'shape.move.out',
+	    'shape.move.end'
+	  ], HIGH_PRIORITY$9, function(event) {
+	    var context = event.context,
+	        shape = context.shape || event.shape,
+	        hover = event.hover;
+
+	    // ensure elements are not dropped onto a bpmn:Lane but onto
+	    // the underlying bpmn:Participant
+	    if (is$1(hover, 'bpmn:Lane') && !isAny(shape, [ 'bpmn:Lane', 'bpmn:Participant' ])) {
+	      event.hover = getLanesRoot(hover);
+	      event.hoverGfx = elementRegistry.getGraphics(event.hover);
+	    }
+
+	    var rootElement = canvas.getRootElement();
+
+	    // ensure bpmn:Group and label elements are dropped
+	    // always onto the root
+	    if (hover !== rootElement && (shape.labelTarget || is$1(shape, 'bpmn:Group'))) {
+	      event.hover = rootElement;
+	      event.hoverGfx = elementRegistry.getGraphics(event.hover);
+	    }
+	  });
+
+	  eventBus.on([
+	    'connect.hover',
+	    'connect.out',
+	    'connect.end',
+	    'connect.cleanup',
+	    'global-connect.hover',
+	    'global-connect.out',
+	    'global-connect.end',
+	    'global-connect.cleanup'
+	  ], HIGH_PRIORITY$9, function(event) {
+	    var hover = event.hover;
+
+	    // ensure connections start/end on bpmn:Participant,
+	    // not the underlying bpmn:Lane
+	    if (is$1(hover, 'bpmn:Lane')) {
+	      event.hover = getLanesRoot(hover) || hover;
+	      event.hoverGfx = elementRegistry.getGraphics(event.hover);
+	    }
+	  });
+
+
+	  eventBus.on([
+	    'bendpoint.move.hover'
+	  ], HIGH_PRIORITY$9, function(event) {
+	    var context = event.context,
+	        hover = event.hover,
+	        type = context.type;
+
+	    // ensure reconnect start/end on bpmn:Participant,
+	    // not the underlying bpmn:Lane
+	    if (is$1(hover, 'bpmn:Lane') && /reconnect/.test(type)) {
+	      event.hover = getLanesRoot(hover) || hover;
+	      event.hoverGfx = elementRegistry.getGraphics(event.hover);
+	    }
+	  });
+
+
+	  eventBus.on([
+	    'connect.start'
+	  ], HIGH_PRIORITY$9, function(event) {
+	    var context = event.context,
+	        start = context.start;
+
+	    // ensure connect start on bpmn:Participant,
+	    // not the underlying bpmn:Lane
+	    if (is$1(start, 'bpmn:Lane')) {
+	      context.start = getLanesRoot(start) || start;
+	    }
+	  });
+
+
+	  // allow movement of participants from lanes
+	  eventBus.on('shape.move.start', HIGHEST_PRIORITY, function(event) {
+	    var shape = event.shape;
+
+	    if (is$1(shape, 'bpmn:Lane')) {
+	      event.shape = getLanesRoot(shape) || shape;
+	    }
+	  });
+
+	}
+
+	FixHoverBehavior.$inject = [
+	  'elementRegistry',
+	  'eventBus',
+	  'canvas'
+	];
+
 	var HIGH_PRIORITY$a = 2000;
 
 
@@ -42568,7 +42944,7 @@
 	 */
 	function GroupBehavior(
 	    bpmnFactory,
-	    canvas,
+	    bpmnjs,
 	    elementRegistry,
 	    eventBus,
 	    injector,
@@ -42576,18 +42952,6 @@
 	) {
 	  injector.invoke(CommandInterceptor, this);
 
-	  /**
-	   * Gets process definitions
-	   *
-	   * @return {ModdleElement} definitions
-	   */
-	  function getDefinitions() {
-	    var rootElement = canvas.getRootElement(),
-	        businessObject = getBusinessObject(rootElement);
-
-	    return businessObject.$parent;
-	  }
-
 	  /**
 	   * Removes a referenced category value for a given group shape
 	   *
@@ -42623,7 +42987,7 @@
 	   */
 	  function removeCategory(category) {
 
-	    var definitions = getDefinitions();
+	    var definitions = bpmnjs.getDefinitions();
 
 	    remove$2(definitions.get('rootElements'), category);
 	  }
@@ -42688,7 +43052,7 @@
 
 	      var businessObject = getBusinessObject(shape),
 	          categoryValueRef = businessObject.categoryValueRef,
-	          definitions = getDefinitions(),
+	          definitions = bpmnjs.getDefinitions(),
 	          category = categoryValueRef ? categoryValueRef.$parent : null;
 
 	      add$1(category.get('categoryValue'), categoryValueRef);
@@ -42706,7 +43070,7 @@
 
 	    if (is$1(businessObject, 'bpmn:Group') && !businessObject.categoryValueRef) {
 
-	      var definitions = getDefinitions(),
+	      var definitions = bpmnjs.getDefinitions(),
 	          categoryValue = createCategoryValue(definitions, bpmnFactory);
 
 	      // link the reference to the Group
@@ -42734,7 +43098,7 @@
 	        categoryValue;
 
 	    if (is$1(property, 'bpmn:CategoryValue')) {
-	      categoryValue = createCategoryValue(getDefinitions(), bpmnFactory);
+	      categoryValue = createCategoryValue(bpmnjs.getDefinitions(), bpmnFactory);
 
 	      // return copy of category
 	      return moddleCopy.copyElement(property, categoryValue);
@@ -42745,7 +43109,7 @@
 
 	GroupBehavior.$inject = [
 	  'bpmnFactory',
-	  'canvas',
+	  'bpmnjs',
 	  'elementRegistry',
 	  'eventBus',
 	  'injector',
@@ -44024,7 +44388,7 @@
 	}
 
 	function getWaypointsInsideBounds(waypoints, bounds) {
-	  var originalWaypoints = map(waypoints, getOriginal$1);
+	  var originalWaypoints = map(waypoints, getOriginal$2);
 
 	  return filter(originalWaypoints, function(waypoint) {
 	    return isInsideBounds(waypoint, bounds);
@@ -44041,7 +44405,7 @@
 	  return getOrientation(bounds, point, 1) === 'intersect';
 	}
 
-	function getOriginal$1(point) {
+	function getOriginal$2(point) {
 	  return point.original || point;
 	}
 
@@ -44154,6 +44518,151 @@
 	  'translate'
 	];
 
+	/**
+	 * BPMN specific behavior ensuring that bpmndi:Label's dc:Bounds are removed
+	 * when shape is resized.
+	 */
+	function RemoveEmbeddedLabelBoundsBehavior(eventBus, modeling) {
+	  CommandInterceptor.call(this, eventBus);
+
+	  this.preExecute('shape.resize', function(context) {
+	    var shape = context.shape;
+
+	    var di = getDi(shape),
+	        label = di && di.get('label'),
+	        bounds = label && label.get('bounds');
+
+	    if (bounds) {
+	      modeling.updateModdleProperties(shape, label, {
+	        bounds: undefined
+	      });
+	    }
+	  }, true);
+	}
+
+	inherits_browser(RemoveEmbeddedLabelBoundsBehavior, CommandInterceptor);
+
+	RemoveEmbeddedLabelBoundsBehavior.$inject = [
+	  'eventBus',
+	  'modeling'
+	];
+
+	function RemoveElementBehavior(eventBus, bpmnRules, modeling) {
+
+	  CommandInterceptor.call(this, eventBus);
+
+	  /**
+	   * Combine sequence flows when deleting an element
+	   * if there is one incoming and one outgoing
+	   * sequence flow
+	   */
+	  this.preExecute('shape.delete', function(e) {
+
+	    var shape = e.context.shape;
+
+	    // only handle [a] -> [shape] -> [b] patterns
+	    if (shape.incoming.length !== 1 || shape.outgoing.length !== 1) {
+	      return;
+	    }
+
+	    var inConnection = shape.incoming[0],
+	        outConnection = shape.outgoing[0];
+
+	    // only handle sequence flows
+	    if (!is$1(inConnection, 'bpmn:SequenceFlow') || !is$1(outConnection, 'bpmn:SequenceFlow')) {
+	      return;
+	    }
+
+	    if (bpmnRules.canConnect(inConnection.source, outConnection.target, inConnection)) {
+
+	      // compute new, combined waypoints
+	      var newWaypoints = getNewWaypoints(inConnection.waypoints, outConnection.waypoints);
+
+	      modeling.reconnectEnd(inConnection, outConnection.target, newWaypoints);
+	    }
+	  });
+
+	}
+
+	inherits_browser(RemoveElementBehavior, CommandInterceptor);
+
+	RemoveElementBehavior.$inject = [
+	  'eventBus',
+	  'bpmnRules',
+	  'modeling'
+	];
+
+
+	// helpers //////////////////////
+
+	function getDocking$1(point) {
+	  return point.original || point;
+	}
+
+
+	function getNewWaypoints(inWaypoints, outWaypoints) {
+
+	  var intersection = lineIntersect(
+	    getDocking$1(inWaypoints[inWaypoints.length - 2]),
+	    getDocking$1(inWaypoints[inWaypoints.length - 1]),
+	    getDocking$1(outWaypoints[1]),
+	    getDocking$1(outWaypoints[0]));
+
+	  if (intersection) {
+	    return [].concat(
+	      inWaypoints.slice(0, inWaypoints.length - 1),
+	      [ intersection ],
+	      outWaypoints.slice(1));
+	  } else {
+	    return [
+	      getDocking$1(inWaypoints[0]),
+	      getDocking$1(outWaypoints[outWaypoints.length - 1])
+	    ];
+	  }
+	}
+
+	/**
+	 * BPMN specific remove behavior
+	 */
+	function RemoveParticipantBehavior(eventBus, modeling) {
+
+	  CommandInterceptor.call(this, eventBus);
+
+
+	  /**
+	   * morph collaboration diagram into process diagram
+	   * after the last participant has been removed
+	   */
+
+	  this.preExecute('shape.delete', function(context) {
+
+	    var shape = context.shape,
+	        parent = shape.parent;
+
+	    // activate the behavior if the shape to be removed
+	    // is a participant
+	    if (is$1(shape, 'bpmn:Participant')) {
+	      context.collaborationRoot = parent;
+	    }
+	  }, true);
+
+	  this.postExecute('shape.delete', function(context) {
+
+	    var collaborationRoot = context.collaborationRoot;
+
+	    if (collaborationRoot && !collaborationRoot.businessObject.participants.length) {
+
+	      // replace empty collaboration with process diagram
+	      modeling.makeProcess();
+	    }
+	  }, true);
+
+	}
+
+	RemoveParticipantBehavior.$inject = [ 'eventBus', 'modeling' ];
+
+	inherits_browser(RemoveParticipantBehavior, CommandInterceptor);
+
 	function ReplaceConnectionBehavior(eventBus, modeling, bpmnRules, injector) {
 
 	  CommandInterceptor.call(this, eventBus);
@@ -44326,48 +44835,6 @@
 	  'injector'
 	];
 
-	/**
-	 * BPMN specific remove behavior
-	 */
-	function RemoveParticipantBehavior(eventBus, modeling) {
-
-	  CommandInterceptor.call(this, eventBus);
-
-
-	  /**
-	   * morph collaboration diagram into process diagram
-	   * after the last participant has been removed
-	   */
-
-	  this.preExecute('shape.delete', function(context) {
-
-	    var shape = context.shape,
-	        parent = shape.parent;
-
-	    // activate the behavior if the shape to be removed
-	    // is a participant
-	    if (is$1(shape, 'bpmn:Participant')) {
-	      context.collaborationRoot = parent;
-	    }
-	  }, true);
-
-	  this.postExecute('shape.delete', function(context) {
-
-	    var collaborationRoot = context.collaborationRoot;
-
-	    if (collaborationRoot && !collaborationRoot.businessObject.participants.length) {
-
-	      // replace empty collaboration with process diagram
-	      modeling.makeProcess();
-	    }
-	  }, true);
-
-	}
-
-	RemoveParticipantBehavior.$inject = [ 'eventBus', 'modeling' ];
-
-	inherits_browser(RemoveParticipantBehavior, CommandInterceptor);
-
 	/**
 	 * BPMN-specific replace behavior.
 	 */
@@ -44701,78 +45168,165 @@
 	  'modeling'
 	];
 
-	function RemoveElementBehavior(eventBus, bpmnRules, modeling) {
-
-	  CommandInterceptor.call(this, eventBus);
-
-	  /**
-	   * Combine sequence flows when deleting an element
-	   * if there is one incoming and one outgoing
-	   * sequence flow
-	   */
-	  this.preExecute('shape.delete', function(e) {
-
-	    var shape = e.context.shape;
-
-	    // only handle [a] -> [shape] -> [b] patterns
-	    if (shape.incoming.length !== 1 || shape.outgoing.length !== 1) {
-	      return;
-	    }
-
-	    var inConnection = shape.incoming[0],
-	        outConnection = shape.outgoing[0];
-
-	    // only handle sequence flows
-	    if (!is$1(inConnection, 'bpmn:SequenceFlow') || !is$1(outConnection, 'bpmn:SequenceFlow')) {
-	      return;
-	    }
-
-	    if (bpmnRules.canConnect(inConnection.source, outConnection.target, inConnection)) {
-
-	      // compute new, combined waypoints
-	      var newWaypoints = getNewWaypoints(inConnection.waypoints, outConnection.waypoints);
-
-	      modeling.reconnectEnd(inConnection, outConnection.target, newWaypoints);
-	    }
-	  });
-
-	}
-
-	inherits_browser(RemoveElementBehavior, CommandInterceptor);
-
-	RemoveElementBehavior.$inject = [
-	  'eventBus',
-	  'bpmnRules',
-	  'modeling'
-	];
-
-
-	// helpers //////////////////////
-
-	function getDocking$1(point) {
-	  return point.original || point;
-	}
-
-
-	function getNewWaypoints(inWaypoints, outWaypoints) {
-
-	  var intersection = lineIntersect(
-	    getDocking$1(inWaypoints[inWaypoints.length - 2]),
-	    getDocking$1(inWaypoints[inWaypoints.length - 1]),
-	    getDocking$1(outWaypoints[1]),
-	    getDocking$1(outWaypoints[0]));
-
-	  if (intersection) {
-	    return [].concat(
-	      inWaypoints.slice(0, inWaypoints.length - 1),
-	      [ intersection ],
-	      outWaypoints.slice(1));
-	  } else {
-	    return [
-	      getDocking$1(inWaypoints[0]),
-	      getDocking$1(outWaypoints[outWaypoints.length - 1])
-	    ];
-	  }
+	var LOW_PRIORITY$f = 500;
+
+
+	/**
+	 * Add referenced root elements (error, escalation, message, signal) if they don't exist.
+	 * Copy referenced root elements on copy & paste.
+	 */
+	function RootElementReferenceBehavior(
+	    bpmnjs, eventBus, injector, moddleCopy, bpmnFactory
+	) {
+	  injector.invoke(CommandInterceptor, this);
+
+	  function canHaveRootElementReference(element) {
+	    return isAny(element, [ 'bpmn:ReceiveTask', 'bpmn:SendTask' ]) ||
+	      hasAnyEventDefinition(element, [
+	        'bpmn:ErrorEventDefinition',
+	        'bpmn:EscalationEventDefinition',
+	        'bpmn:MessageEventDefinition',
+	        'bpmn:SignalEventDefinition'
+	      ]);
+	  }
+
+	  function hasRootElement(rootElement) {
+	    var definitions = bpmnjs.getDefinitions(),
+	        rootElements = definitions.get('rootElements');
+
+	    return !!find(rootElements, matchPattern({ id: rootElement.id }));
+	  }
+
+	  function getRootElementReferencePropertyName(eventDefinition) {
+	    if (is$1(eventDefinition, 'bpmn:ErrorEventDefinition')) {
+	      return 'errorRef';
+	    } else if (is$1(eventDefinition, 'bpmn:EscalationEventDefinition')) {
+	      return 'escalationRef';
+	    } else if (is$1(eventDefinition, 'bpmn:MessageEventDefinition')) {
+	      return 'messageRef';
+	    } else if (is$1(eventDefinition, 'bpmn:SignalEventDefinition')) {
+	      return 'signalRef';
+	    }
+	  }
+
+	  function getRootElement(businessObject) {
+	    if (isAny(businessObject, [ 'bpmn:ReceiveTask', 'bpmn:SendTask' ])) {
+	      return businessObject.get('messageRef');
+	    }
+
+	    var eventDefinitions = businessObject.get('eventDefinitions'),
+	        eventDefinition = eventDefinitions[ 0 ];
+
+	    return eventDefinition.get(getRootElementReferencePropertyName(eventDefinition));
+	  }
+
+	  function setRootElement(businessObject, rootElement) {
+	    if (isAny(businessObject, [ 'bpmn:ReceiveTask', 'bpmn:SendTask' ])) {
+	      return businessObject.set('messageRef', rootElement);
+	    }
+
+	    var eventDefinitions = businessObject.get('eventDefinitions'),
+	        eventDefinition = eventDefinitions[ 0 ];
+
+	    return eventDefinition.set(getRootElementReferencePropertyName(eventDefinition), rootElement);
+	  }
+
+	  // create shape
+	  this.executed('shape.create', function(context) {
+	    var shape = context.shape;
+
+	    if (!canHaveRootElementReference(shape)) {
+	      return;
+	    }
+
+	    var businessObject = getBusinessObject(shape),
+	        rootElement = getRootElement(businessObject),
+	        rootElements;
+
+	    if (rootElement && !hasRootElement(rootElement)) {
+	      rootElements = bpmnjs.getDefinitions().get('rootElements');
+
+	      // add root element
+	      add$1(rootElements, rootElement);
+
+	      context.addedRootElement = rootElement;
+	    }
+	  }, true);
+
+	  this.reverted('shape.create', function(context) {
+	    var addedRootElement = context.addedRootElement;
+
+	    if (!addedRootElement) {
+	      return;
+	    }
+
+	    var rootElements = bpmnjs.getDefinitions().get('rootElements');
+
+	    // remove root element
+	    remove$2(rootElements, addedRootElement);
+	  }, true);
+
+	  eventBus.on('copyPaste.copyElement', function(context) {
+	    var descriptor = context.descriptor,
+	        element = context.element;
+
+	    if (!canHaveRootElementReference(element)) {
+	      return;
+	    }
+
+	    var businessObject = getBusinessObject(element),
+	        rootElement = getRootElement(businessObject);
+
+	    if (rootElement) {
+	      descriptor.referencedRootElement = rootElement;
+	    }
+	  });
+
+	  eventBus.on('copyPaste.pasteElement', LOW_PRIORITY$f, function(context) {
+	    var descriptor = context.descriptor,
+	        businessObject = descriptor.businessObject;
+
+	    if (!canHaveRootElementReference(businessObject)) {
+	      return;
+	    }
+
+	    var referencedRootElement = descriptor.referencedRootElement;
+
+	    if (!referencedRootElement) {
+	      return;
+	    }
+
+	    if (!hasRootElement(referencedRootElement)) {
+	      referencedRootElement = moddleCopy.copyElement(
+	        referencedRootElement,
+	        bpmnFactory.create(referencedRootElement.$type)
+	      );
+	    }
+
+	    setRootElement(businessObject, referencedRootElement);
+	  });
+	}
+
+	RootElementReferenceBehavior.$inject = [
+	  'bpmnjs',
+	  'eventBus',
+	  'injector',
+	  'moddleCopy',
+	  'bpmnFactory'
+	];
+
+	inherits_browser(RootElementReferenceBehavior, CommandInterceptor);
+
+	// helpers //////////
+
+	function hasAnyEventDefinition(element, types) {
+	  if (!isArray(types)) {
+	    types = [ types ];
+	  }
+
+	  return some(types, function(type) {
+	    return hasEventDefinition(element, type);
+	  });
 	}
 
 	var max$5 = Math.max;
@@ -44885,50 +45439,7 @@
 	  }
 	}
 
-	/**
-	 * Add start event replacing element with expanded sub process.
-	 *
-	 * @param {Injector} injector
-	 * @param {Modeling} modeling
-	 */
-	function SubProcessStartEventBehavior(injector, modeling) {
-	  injector.invoke(CommandInterceptor, this);
-
-	  this.postExecuted('shape.replace', function(event) {
-	    var oldShape = event.context.oldShape,
-	        newShape = event.context.newShape;
-
-	    if (
-	      !is$1(newShape, 'bpmn:SubProcess') ||
-	      !is$1(oldShape, 'bpmn:Task') ||
-	      !isExpanded(newShape)
-	    ) {
-	      return;
-	    }
-
-	    var position = getStartEventPosition(newShape);
-
-	    modeling.createShape({ type: 'bpmn:StartEvent' }, position, newShape);
-	  });
-	}
-
-	SubProcessStartEventBehavior.$inject = [
-	  'injector',
-	  'modeling'
-	];
-
-	inherits_browser(SubProcessStartEventBehavior, CommandInterceptor);
-
-	// helpers //////////
-
-	function getStartEventPosition(shape) {
-	  return {
-	    x: shape.x + shape.width / 6,
-	    y: shape.y + shape.height / 2
-	  };
-	}
-
-	var LOW_PRIORITY$f = 400;
+	var LOW_PRIORITY$g = 400;
 	var HIGH_PRIORITY$c = 600;
 
 	var DEFAULT_POSITION$1 = {
@@ -45129,7 +45640,7 @@
 	  this.reverted('element.updateProperties', function(context) {
 	    var shape = context.element;
 
-	    if (!isCollapsedSubProcess(shape)) {
+	    if (!is$1(shape, 'bpmn:SubProcess')) {
 	      return;
 	    }
 
@@ -45143,6 +45654,13 @@
 	      return;
 	    }
 
+	    if (isPlane(shape)) {
+	      elementRegistry.updateId(shape, toPlaneId(oldId));
+	      elementRegistry.updateId(newId, oldId);
+
+	      return;
+	    }
+
 	    var planeElement = elementRegistry.get(toPlaneId(newId));
 
 	    if (!planeElement) {
@@ -45175,7 +45693,7 @@
 
 
 	  // create/remove plane for the subprocess
-	  this.executed('shape.toggleCollapse', LOW_PRIORITY$f, function(context) {
+	  this.executed('shape.toggleCollapse', LOW_PRIORITY$g, function(context) {
 	    var shape = context.shape;
 
 	    if (!is$1(shape, 'bpmn:SubProcess')) {
@@ -45193,7 +45711,7 @@
 
 
 	  // create/remove plane for the subprocess
-	  this.reverted('shape.toggleCollapse', LOW_PRIORITY$f, function(context) {
+	  this.reverted('shape.toggleCollapse', LOW_PRIORITY$g, function(context) {
 	    var shape = context.shape;
 
 	    if (!is$1(shape, 'bpmn:SubProcess')) {
@@ -45462,6 +45980,49 @@
 	  'elementRegistry'
 	];
 
+	/**
+	 * Add start event replacing element with expanded sub process.
+	 *
+	 * @param {Injector} injector
+	 * @param {Modeling} modeling
+	 */
+	function SubProcessStartEventBehavior(injector, modeling) {
+	  injector.invoke(CommandInterceptor, this);
+
+	  this.postExecuted('shape.replace', function(event) {
+	    var oldShape = event.context.oldShape,
+	        newShape = event.context.newShape;
+
+	    if (
+	      !is$1(newShape, 'bpmn:SubProcess') ||
+	      !is$1(oldShape, 'bpmn:Task') ||
+	      !isExpanded(newShape)
+	    ) {
+	      return;
+	    }
+
+	    var position = getStartEventPosition(newShape);
+
+	    modeling.createShape({ type: 'bpmn:StartEvent' }, position, newShape);
+	  });
+	}
+
+	SubProcessStartEventBehavior.$inject = [
+	  'injector',
+	  'modeling'
+	];
+
+	inherits_browser(SubProcessStartEventBehavior, CommandInterceptor);
+
+	// helpers //////////
+
+	function getStartEventPosition(shape) {
+	  return {
+	    x: shape.x + shape.width / 6,
+	    y: shape.y + shape.height / 2
+	  };
+	}
+
 	function ToggleCollapseConnectionBehaviour(
 	    eventBus, modeling
 	) {
@@ -45497,7 +46058,7 @@
 
 
 	    function handleConnection(c, incoming) {
-	      if (allChildren.includes(c.source) && allChildren.includes(c.target)) {
+	      if (allChildren.indexOf(c.source) !== -1 && allChildren.indexOf(c.target) !== -1) {
 	        return;
 	      }
 
@@ -45520,7 +46081,7 @@
 	  'modeling',
 	];
 
-	var LOW_PRIORITY$g = 500;
+	var LOW_PRIORITY$h = 500;
 
 
 	function ToggleElementCollapseBehaviour(
@@ -45578,7 +46139,7 @@
 	    };
 	  }
 
-	  this.executed([ 'shape.toggleCollapse' ], LOW_PRIORITY$g, function(e) {
+	  this.executed([ 'shape.toggleCollapse' ], LOW_PRIORITY$h, function(e) {
 
 	    var context = e.context,
 	        shape = context.shape;
@@ -45601,7 +46162,7 @@
 	    }
 	  });
 
-	  this.reverted([ 'shape.toggleCollapse' ], LOW_PRIORITY$g, function(e) {
+	  this.reverted([ 'shape.toggleCollapse' ], LOW_PRIORITY$h, function(e) {
 
 	    var context = e.context;
 	    var shape = context.shape;
@@ -45616,7 +46177,7 @@
 	    }
 	  });
 
-	  this.postExecuted([ 'shape.toggleCollapse' ], LOW_PRIORITY$g, function(e) {
+	  this.postExecuted([ 'shape.toggleCollapse' ], LOW_PRIORITY$h, function(e) {
 	    var shape = e.context.shape,
 	        defaultSize = elementFactory.getDefaultSize(shape),
 	        newBounds;
@@ -45706,7 +46267,55 @@
 
 	UnclaimIdBehavior.$inject = [ 'canvas', 'injector', 'moddle', 'modeling' ];
 
-	var LOW_PRIORITY$h = 500,
+	/**
+	 * A behavior that unsets the Default property of
+	 * sequence flow source on element delete, if the
+	 * removed element is the Gateway or Task's default flow.
+	 *
+	 * @param {EventBus} eventBus
+	 * @param {Modeling} modeling
+	 */
+	function DeleteSequenceFlowBehavior(eventBus, modeling) {
+
+	  CommandInterceptor.call(this, eventBus);
+
+
+	  this.preExecute('connection.delete', function(event) {
+	    var context = event.context,
+	        connection = context.connection,
+	        source = connection.source;
+
+	    if (isDefaultFlow(connection, source)) {
+	      modeling.updateProperties(source, {
+	        'default': null
+	      });
+	    }
+	  });
+	}
+
+	inherits_browser(DeleteSequenceFlowBehavior, CommandInterceptor);
+
+	DeleteSequenceFlowBehavior.$inject = [
+	  'eventBus',
+	  'modeling'
+	];
+
+
+	// helpers //////////////////////
+
+	function isDefaultFlow(connection, source) {
+
+	  if (!is$1(connection, 'bpmn:SequenceFlow')) {
+	    return false;
+	  }
+
+	  var sourceBo = getBusinessObject(source),
+	      sequenceFlow = getBusinessObject(connection);
+
+	  return sourceBo.get('default') === sequenceFlow;
+	}
+
+	var LOW_PRIORITY$i = 500,
 	    HIGH_PRIORITY$d = 5000;
 
 
@@ -45788,7 +46397,7 @@
 	    initContext();
 	  });
 
-	  this.postExecuted(laneRefUpdateEvents, LOW_PRIORITY$h, function(event) {
+	  this.postExecuted(laneRefUpdateEvents, LOW_PRIORITY$i, function(event) {
 	    releaseContext();
 	  });
 
@@ -45857,54 +46466,6 @@
 	  };
 	}
 
-	/**
-	 * A behavior that unsets the Default property of
-	 * sequence flow source on element delete, if the
-	 * removed element is the Gateway or Task's default flow.
-	 *
-	 * @param {EventBus} eventBus
-	 * @param {Modeling} modeling
-	 */
-	function DeleteSequenceFlowBehavior(eventBus, modeling) {
-
-	  CommandInterceptor.call(this, eventBus);
-
-
-	  this.preExecute('connection.delete', function(event) {
-	    var context = event.context,
-	        connection = context.connection,
-	        source = connection.source;
-
-	    if (isDefaultFlow(connection, source)) {
-	      modeling.updateProperties(source, {
-	        'default': null
-	      });
-	    }
-	  });
-	}
-
-	inherits_browser(DeleteSequenceFlowBehavior, CommandInterceptor);
-
-	DeleteSequenceFlowBehavior.$inject = [
-	  'eventBus',
-	  'modeling'
-	];
-
-
-	// helpers //////////////////////
-
-	function isDefaultFlow(connection, source) {
-
-	  if (!is$1(connection, 'bpmn:SequenceFlow')) {
-	    return false;
-	  }
-
-	  var sourceBo = getBusinessObject(source),
-	      sequenceFlow = getBusinessObject(connection);
-
-	  return sourceBo.get('default') === sequenceFlow;
-	}
-
 	var BehaviorModule = {
 	  __init__: [
 	    'adaptiveLabelPositioningBehavior',
@@ -45912,17 +46473,16 @@
 	    'associationBehavior',
 	    'attachEventBehavior',
 	    'boundaryEventBehavior',
-	    'rootElementReferenceBehavior',
 	    'createBehavior',
-	    'fixHoverBehavior',
 	    'createDataObjectBehavior',
 	    'createParticipantBehavior',
-	    'dataStoreBehavior',
 	    'dataInputAssociationBehavior',
+	    'dataStoreBehavior',
 	    'deleteLaneBehavior',
 	    'detachEventBehavior',
 	    'dropOnFlowBehavior',
 	    'eventBasedGatewayBehavior',
+	    'fixHoverBehavior',
 	    'groupBehavior',
 	    'importDockingFix',
 	    'isHorizontalFix',
@@ -45930,28 +46490,28 @@
 	    'messageFlowBehavior',
 	    'modelingFeedback',
 	    'removeElementBehavior',
+	    'removeEmbeddedLabelBoundsBehavior',
 	    'removeParticipantBehavior',
 	    'replaceConnectionBehavior',
 	    'replaceElementBehaviour',
 	    'resizeBehavior',
 	    'resizeLaneBehavior',
-	    'toggleCollapseConnectionBehaviour',
-	    'toggleElementCollapseBehaviour',
+	    'rootElementReferenceBehavior',
 	    'spaceToolBehavior',
-	    'subProcessStartEventBehavior',
 	    'subProcessPlaneBehavior',
+	    'subProcessStartEventBehavior',
+	    'toggleCollapseConnectionBehaviour',
+	    'toggleElementCollapseBehaviour',
 	    'unclaimIdBehavior',
-	    'unsetDefaultFlowBehavior',
-	    'updateFlowNodeRefsBehavior'
+	    'updateFlowNodeRefsBehavior',
+	    'unsetDefaultFlowBehavior'
 	  ],
 	  adaptiveLabelPositioningBehavior: [ 'type', AdaptiveLabelPositioningBehavior ],
 	  appendBehavior: [ 'type', AppendBehavior ],
 	  associationBehavior: [ 'type', AssociationBehavior ],
 	  attachEventBehavior: [ 'type', AttachEventBehavior ],
 	  boundaryEventBehavior: [ 'type', BoundaryEventBehavior ],
-	  rootElementReferenceBehavior: [ 'type', RootElementReferenceBehavior ],
 	  createBehavior: [ 'type', CreateBehavior ],
-	  fixHoverBehavior: [ 'type', FixHoverBehavior ],
 	  createDataObjectBehavior: [ 'type', CreateDataObjectBehavior ],
 	  createParticipantBehavior: [ 'type', CreateParticipantBehavior$1 ],
 	  dataInputAssociationBehavior: [ 'type', DataInputAssociationBehavior ],
@@ -45960,26 +46520,29 @@
 	  detachEventBehavior: [ 'type', DetachEventBehavior ],
 	  dropOnFlowBehavior: [ 'type', DropOnFlowBehavior ],
 	  eventBasedGatewayBehavior: [ 'type', EventBasedGatewayBehavior ],
+	  fixHoverBehavior: [ 'type', FixHoverBehavior ],
 	  groupBehavior: [ 'type', GroupBehavior ],
 	  importDockingFix: [ 'type', ImportDockingFix ],
 	  isHorizontalFix: [ 'type', IsHorizontalFix ],
 	  labelBehavior: [ 'type', LabelBehavior ],
 	  messageFlowBehavior: [ 'type', MessageFlowBehavior ],
 	  modelingFeedback: [ 'type', ModelingFeedback ],
-	  replaceConnectionBehavior: [ 'type', ReplaceConnectionBehavior ],
+	  removeElementBehavior: [ 'type', RemoveElementBehavior ],
+	  removeEmbeddedLabelBoundsBehavior: ['type', RemoveEmbeddedLabelBoundsBehavior ],
 	  removeParticipantBehavior: [ 'type', RemoveParticipantBehavior ],
+	  replaceConnectionBehavior: [ 'type', ReplaceConnectionBehavior ],
 	  replaceElementBehaviour: [ 'type', ReplaceElementBehaviour ],
 	  resizeBehavior: [ 'type', ResizeBehavior$1 ],
 	  resizeLaneBehavior: [ 'type', ResizeLaneBehavior ],
-	  removeElementBehavior: [ 'type', RemoveElementBehavior ],
-	  toggleCollapseConnectionBehaviour: [ 'type', ToggleCollapseConnectionBehaviour ],
-	  toggleElementCollapseBehaviour : [ 'type', ToggleElementCollapseBehaviour ],
+	  rootElementReferenceBehavior: [ 'type', RootElementReferenceBehavior ],
 	  spaceToolBehavior: [ 'type', SpaceToolBehavior$1 ],
-	  subProcessStartEventBehavior: [ 'type', SubProcessStartEventBehavior ],
 	  subProcessPlaneBehavior: [ 'type', SubProcessPlaneBehavior ],
+	  subProcessStartEventBehavior: [ 'type', SubProcessStartEventBehavior ],
+	  toggleCollapseConnectionBehaviour: [ 'type', ToggleCollapseConnectionBehaviour ],
+	  toggleElementCollapseBehaviour : [ 'type', ToggleElementCollapseBehaviour ],
 	  unclaimIdBehavior: [ 'type', UnclaimIdBehavior ],
-	  updateFlowNodeRefsBehavior: [ 'type', UpdateFlowNodeRefsBehavior ],
-	  unsetDefaultFlowBehavior: [ 'type', DeleteSequenceFlowBehavior ]
+	  unsetDefaultFlowBehavior: [ 'type', DeleteSequenceFlowBehavior ],
+	  updateFlowNodeRefsBehavior: [ 'type', UpdateFlowNodeRefsBehavior ]
 	};
 
 	function getBoundaryAttachment(position, targetBounds) {
@@ -47080,7 +47643,7 @@
 	        level: 9,
 	        containers: [
 	          'bpmn:Collaboration',
-	          'bpmn:Process'
+	          'bpmn:FlowElementsContainer'
 	        ]
 	      }
 	    },
@@ -47108,7 +47671,7 @@
 	        level: 10,
 	        containers: [
 	          'bpmn:Collaboration',
-	          'bpmn:Process'
+	          'bpmn:FlowElementsContainer'
 	        ]
 	      }
 	    },
@@ -47218,7 +47781,7 @@
 
 	var OrderingModule = {
 	  __depends__: [
-	    translateModule
+	    translate$2
 	  ],
 	  __init__: [ 'bpmnOrderingProvider' ],
 	  bpmnOrderingProvider: [ 'type', BpmnOrderingProvider ]
@@ -48134,7 +48697,7 @@
 	  return collection;
 	}
 
-	var LOW_PRIORITY$i = 250,
+	var LOW_PRIORITY$j = 250,
 	    HIGH_PRIORITY$f = 1400;
 
 
@@ -48165,7 +48728,7 @@
 	  });
 
 	  // add labels to visual's group
-	  movePreview && eventBus.on('shape.move.start', LOW_PRIORITY$i, function(e) {
+	  movePreview && eventBus.on('shape.move.start', LOW_PRIORITY$j, function(e) {
 
 	    var context = e.context,
 	        shapes = context.shapes;
@@ -48294,7 +48857,7 @@
 	  labelSupport: [ 'type', LabelSupport ]
 	};
 
-	var LOW_PRIORITY$j = 251,
+	var LOW_PRIORITY$k = 251,
 	    HIGH_PRIORITY$g = 1401;
 
 	var MARKER_ATTACH$1 = 'attach-ok';
@@ -48336,7 +48899,7 @@
 	  });
 
 	  // add attachers to the visual's group
-	  movePreview && eventBus.on('shape.move.start', LOW_PRIORITY$j, function(e) {
+	  movePreview && eventBus.on('shape.move.start', LOW_PRIORITY$k, function(e) {
 
 	    var context = e.context,
 	        shapes = context.shapes,
@@ -48618,7 +49181,7 @@
 	  attachSupport: [ 'type', AttachSupport ]
 	};
 
-	var LOW_PRIORITY$k = 250;
+	var LOW_PRIORITY$l = 250;
 
 	/**
 	 * The tool manager acts as middle-man between the available tool's and the Palette,
@@ -48694,7 +49257,7 @@
 	    eventsToRegister.push(event + '.canceled');
 	  });
 
-	  eventBus.on(eventsToRegister, LOW_PRIORITY$k, function(event) {
+	  eventBus.on(eventsToRegister, LOW_PRIORITY$l, function(event) {
 
 	    // We defer the de-activation of the tool to the .activate phase,
 	    // so we're able to check if we want to toggle off the current
@@ -49323,7 +49886,7 @@
 	var MARKER_DRAGGING = 'djs-dragging',
 	    MARKER_RESIZING$1 = 'djs-resizing';
 
-	var LOW_PRIORITY$l = 250;
+	var LOW_PRIORITY$m = 250;
 
 	var max$6 = Math.max;
 
@@ -49398,7 +49961,7 @@
 	  });
 
 	  // add and update move/resize previews
-	  eventBus.on('spaceTool.move', LOW_PRIORITY$l, function(event) {
+	  eventBus.on('spaceTool.move', LOW_PRIORITY$m, function(event) {
 
 	    var context = event.context,
 	        line = context.line,
@@ -50055,7 +50618,18 @@
 
 	BpmnUpdater.prototype.updateBounds = function(shape) {
 
-	  var di = getDi(shape);
+	  var di = getDi(shape),
+	      embeddedLabelBounds = getEmbeddedLabelBounds(shape);
+
+	  // update embedded label bounds if possible
+	  if (embeddedLabelBounds) {
+	    var embeddedLabelBoundsDelta = delta(embeddedLabelBounds, di.get('bounds'));
+
+	    assign(embeddedLabelBounds, {
+	      x: shape.x + embeddedLabelBoundsDelta.x,
+	      y: shape.y + embeddedLabelBoundsDelta.y
+	    });
+	  }
 
 	  var target = (shape instanceof Label) ? this._getLabel(di) : di;
 
@@ -50430,6 +51004,33 @@
 	  };
 	}
 
+	/**
+	 * Return dc:Bounds of bpmndi:BPMNLabel if exists.
+	 *
+	 * @param {djs.model.shape} shape
+	 *
+	 * @returns {Object|undefined}
+	 */
+	function getEmbeddedLabelBounds(shape) {
+	  if (!is$1(shape, 'bpmn:Activity')) {
+	    return;
+	  }
+
+	  var di = getDi(shape);
+
+	  if (!di) {
+	    return;
+	  }
+
+	  var label = di.get('label');
+
+	  if (!label) {
+	    return;
+	  }
+
+	  return label.get('bounds');
+	}
+
 	/**
 	 * A bpmn-aware factory for diagram-js shapes
 	 */
@@ -55607,7 +56208,7 @@
 	  connectionDocking: [ 'type', CroppingConnectionDocking ]
 	};
 
-	var LOW_PRIORITY$m = 500,
+	var LOW_PRIORITY$n = 500,
 	    MEDIUM_PRIORITY = 1250,
 	    HIGH_PRIORITY$i = 1500;
 
@@ -55706,7 +56307,7 @@
 	  // to let others modify the move event before we update
 	  // the context
 	  //
-	  eventBus.on('shape.move.move', LOW_PRIORITY$m, function(event) {
+	  eventBus.on('shape.move.move', LOW_PRIORITY$n, function(event) {
 
 	    var context = event.context,
 	        validatedShapes = context.validatedShapes,
@@ -55852,7 +56453,7 @@
 	  });
 	}
 
-	var LOW_PRIORITY$n = 499;
+	var LOW_PRIORITY$o = 499;
 
 	var MARKER_DRAGGING$1 = 'djs-dragging',
 	    MARKER_OK$3 = 'drop-ok',
@@ -55930,7 +56531,7 @@
 	  // assign a low priority to this handler
 	  // to let others modify the move context before
 	  // we draw things
-	  eventBus.on('shape.move.start', LOW_PRIORITY$n, function(event) {
+	  eventBus.on('shape.move.start', LOW_PRIORITY$o, function(event) {
 	    var context = event.context,
 	        dragShapes = context.shapes,
 	        allDraggedElements = context.allDraggedElements;
@@ -55977,7 +56578,7 @@
 	  });
 
 	  // update previews
-	  eventBus.on('shape.move.move', LOW_PRIORITY$n, function(event) {
+	  eventBus.on('shape.move.move', LOW_PRIORITY$o, function(event) {
 
 	    var context = event.context,
 	        dragGroup = context.dragGroup,
@@ -57320,13 +57921,13 @@
 	    LassoToolModule,
 	    HandToolModule,
 	    GlobalConnectModule,
-	    translateModule
+	    translate$2
 	  ],
 	  __init__: [ 'paletteProvider' ],
 	  paletteProvider: [ 'type', PaletteProvider ]
 	};
 
-	var LOW_PRIORITY$o = 250;
+	var LOW_PRIORITY$p = 250;
 
 
 	function BpmnReplacePreview(
@@ -57407,7 +58008,7 @@
 	    });
 	  }
 
-	  eventBus.on('shape.move.move', LOW_PRIORITY$o, function(event) {
+	  eventBus.on('shape.move.move', LOW_PRIORITY$p, function(event) {
 
 	    var context = event.context,
 	        canExecute = context.canExecute;
@@ -59337,7 +59938,7 @@
 	  DistributeElementsModule$1,
 	  EditorActionsModule$1,
 	  GridSnappingModule$1,
-	  InteractionEventsModule$1,
+	  InteractionEventsModule$2,
 	  KeyboardModule$1,
 	  KeyboardMoveSelectionModule,
 	  LabelEditingModule,
@@ -59363,6 +59964,24 @@
 	  Modeler.prototype._modelingModules
 	);
 
+	/**
+	 * SVGs for elements are generated by the {@link GraphicsFactory}.
+	 *
+	 * This utility gives quick access to the important semantic
+	 * parts of an element.
+	 */
+
+	/**
+	 * Returns the visual part of a diagram element
+	 *
+	 * @param {Snap<SVGElement>} gfx
+	 *
+	 * @return {Snap<SVGElement>}
+	 */
+	function getVisual$1(gfx) {
+	  return gfx.childNodes[0];
+	}
+
 	var MINIMAP_VIEWBOX_PADDING = 50;
 
 	var RANGE$1 = { min: 0.2, max: 4 },
@@ -59370,7 +59989,7 @@
 
 	var DELTA_THRESHOLD$1 = 0.1;
 
-	var LOW_PRIORITY$p = 250;
+	var LOW_PRIORITY$q = 250;
 
 
 	/**
@@ -59644,7 +60263,7 @@
 	  });
 
 	  // update on elements changed
-	  eventBus.on('elements.changed', LOW_PRIORITY$p, function(context) {
+	  eventBus.on('elements.changed', LOW_PRIORITY$q, function(context) {
 	    var elements = context.elements;
 
 	    elements.forEach(function(element) {
@@ -60030,7 +60649,7 @@
 	      visual;
 
 	  if (gfx) {
-	    visual = getVisual(gfx);
+	    visual = getVisual$1(gfx);
 
 	    if (visual) {
 	      var elementGfx = clone(visual);
@@ -60863,8 +61482,9 @@
 
 	function Group(props) {
 	  const {
-	    id,
+	    element,
 	    entries = [],
+	    id,
 	    label
 	  } = props;
 	  const [open, setOpen] = useLayoutState(['groups', id, 'open'], false);
@@ -60912,7 +61532,16 @@
 	      })]
 	    }), o$2("div", {
 	      class: classnames('bio-properties-panel-group-entries', open ? 'open' : ''),
-	      children: entries.map(e => e.component)
+	      children: entries.map(entry => {
+	        const {
+	          component: Component,
+	          id
+	        } = entry;
+	        return a(Component, { ...entry,
+	          key: id,
+	          element: element
+	        });
+	      })
 	    })]
 	  });
 	}
@@ -60930,7 +61559,7 @@
 	const DEFAULT_DESCRIPTION = {};
 	/**
 	 * @typedef { {
-	 *    component: import('preact').ComponentChild,
+	 *    component: import('preact').Component,
 	 *    id: String,
 	 *    isEdited?: Function
 	 * } } EntryDefinition
@@ -61058,13 +61687,13 @@
 	          class: "bio-properties-panel-scroll-container",
 	          children: groups.map(group => {
 	            const {
-	              component: GroupComponent = Group,
+	              component: Component = Group,
 	              id
 	            } = group;
-	            return o$2(GroupComponent, {
-	              element: element,
-	              ...group
-	            }, id);
+	            return a(Component, { ...group,
+	              key: id,
+	              element: element
+	            });
 	          })
 	        })]
 	      })
@@ -61495,6 +62124,66 @@
 	  debounceInput: ['factory', debounceInput]
 	};
 
+	/**
+	 * Failsafe remove an element from a collection
+	 *
+	 * @param  {Array<Object>} [collection]
+	 * @param  {Object} [element]
+	 *
+	 * @return {number} the previous index of the element
+	 */
+
+	/**
+	 * Fail save add an element to the given connection, ensuring
+	 * it does not yet exist.
+	 *
+	 * @param {Array<Object>} collection
+	 * @param {Object} element
+	 * @param {number} idx
+	 */
+	function add$2(collection, element, idx) {
+
+	  if (!collection || !element) {
+	    return;
+	  }
+
+	  if (typeof idx !== 'number') {
+	    idx = -1;
+	  }
+
+	  var currentIdx = collection.indexOf(element);
+
+	  if (currentIdx !== -1) {
+
+	    if (currentIdx === idx) {
+
+	      // nothing to do, position has not changed
+	      return;
+	    } else {
+
+	      if (idx !== -1) {
+
+	        // remove from current position
+	        collection.splice(currentIdx, 1);
+	      } else {
+
+	        // already exists in collection
+	        return;
+	      }
+	    }
+	  }
+
+	  if (idx !== -1) {
+
+	    // insert at specified position
+	    collection.splice(idx, 0, element);
+	  } else {
+
+	    // push to end
+	    collection.push(element);
+	  }
+	}
+
 	// Note: this is the semver.org version of the spec that it implements
 	// Not necessarily the package version of this code.
 	const SEMVER_SPEC_VERSION = '2.0.0';
@@ -65392,7 +66081,9 @@
 	  'SignalStartEvent': StartEventSignalIcon,
 	  'TimerStartEvent': StartEventTimerIcon,
 	  'CollapsedSubProcess': SubprocessCollapsedIcon,
+	  'CollapsedAdHocSubProcess': SubprocessCollapsedIcon,
 	  'ExpandedSubProcess': SubprocessExpandedIcon,
+	  'ExpandedAdHocSubProcess': SubprocessExpandedIcon,
 	  'Task': TaskNoneIcon,
 	  'TextAnnotation': TextAnnotationicon,
 	  'Transaction': TransactionIcon,
@@ -66000,6 +66691,14 @@
 	  return compensateEventDefinition && compensateEventDefinition.get('activityRef');
 	}
 
+	/**
+	 * @typedef { import('@bpmn-io/properties-panel').EntryDefinition } Entry
+	 */
+
+	/**
+	 * @returns {Array<Entry>} entries
+	 */
+
 	function CompensationProps(props) {
 	  const {
 	    element
@@ -66011,15 +66710,11 @@
 
 	  return [{
 	    id: 'waitForCompletion',
-	    component: o$2(WaitForCompletion, {
-	      element: element
-	    }),
+	    component: WaitForCompletion,
 	    isEdited: isEdited$6
 	  }, {
 	    id: 'activityRef',
-	    component: o$2(ActivityRef, {
-	      element: element
-	    }),
+	    component: ActivityRef,
 	    isEdited: isEdited$4
 	  }];
 	}
@@ -66229,18 +66924,14 @@
 	  } = props;
 	  const entries = [{
 	    id: 'documentation',
-	    component: o$2(ElementDocumentationProperty, {
-	      element: element
-	    }),
+	    component: ElementDocumentationProperty,
 	    isEdited: isEdited$2
 	  }];
 
 	  if (hasProcessRef$2(element)) {
 	    entries.push({
 	      id: 'processDocumentation',
-	      component: o$2(ProcessDocumentationProperty, {
-	        element: element
-	      }),
+	      component: ProcessDocumentationProperty,
 	      isEdited: isEdited$2
 	    });
 	  }
@@ -66433,24 +67124,18 @@
 	  const error = getError(element);
 	  let entries = [{
 	    id: 'errorRef',
-	    component: o$2(ErrorRef$1, {
-	      element: element
-	    }),
+	    component: ErrorRef$1,
 	    isEdited: isEdited$4
 	  }];
 
 	  if (error) {
 	    entries = [...entries, {
 	      id: 'errorName',
-	      component: o$2(ErrorName$1, {
-	        element: element
-	      }),
+	      component: ErrorName$1,
 	      isEdited: isEdited$1
 	    }, {
 	      id: 'errorCode',
-	      component: o$2(ErrorCode$1, {
-	        element: element
-	      }),
+	      component: ErrorCode$1,
 	      isEdited: isEdited$1
 	    }];
 	  }
@@ -66636,24 +67321,18 @@
 	  const escalation = getEscalation(element);
 	  let entries = [{
 	    id: 'escalationRef',
-	    component: o$2(EscalationRef, {
-	      element: element
-	    }),
+	    component: EscalationRef,
 	    isEdited: isEdited$4
 	  }];
 
 	  if (escalation) {
 	    entries = [...entries, {
 	      id: 'escalationName',
-	      component: o$2(EscalationName, {
-	        element: element
-	      }),
+	      component: EscalationName,
 	      isEdited: isEdited$1
 	    }, {
 	      id: 'escalationCode',
-	      component: o$2(EscalationCode, {
-	        element: element
-	      }),
+	      component: EscalationCode,
 	      isEdited: isEdited$1
 	    }];
 	  }
@@ -66815,6 +67494,14 @@
 	  return sortBy(elements, e => (e.name || '').toLowerCase());
 	}
 
+	/**
+	 * @typedef { import('@bpmn-io/properties-panel').EntryDefinition } Entry
+	 */
+
+	/**
+	 * @returns {Array<Entry>} entries
+	 */
+
 	function ExecutableProps(props) {
 	  const {
 	    element
@@ -66826,9 +67513,7 @@
 
 	  return [{
 	    id: 'isExecutable',
-	    component: o$2(Executable, {
-	      element: element
-	    }),
+	    component: Executable,
 	    isEdited: isEdited$6
 	  }];
 	}
@@ -66931,15 +67616,18 @@
 	  return SPACE_REGEX.test(value);
 	}
 
-	function IdProps(props) {
-	  const {
-	    element
-	  } = props;
+	/**
+	 * @typedef { import('@bpmn-io/properties-panel').EntryDefinition } Entry
+	 */
+
+	/**
+	 * @returns {Array<Entry>} entries
+	 */
+
+	function IdProps() {
 	  return [{
 	    id: 'id',
-	    component: o$2(Id$3, {
-	      element: element
-	    }),
+	    component: Id$3,
 	    isEdited: isEdited$1
 	  }];
 	}
@@ -66978,6 +67666,14 @@
 	  });
 	}
 
+	/**
+	 * @typedef { import('@bpmn-io/properties-panel').EntryDefinition } Entry
+	 */
+
+	/**
+	 * @returns {Array<Entry>} entries
+	 */
+
 	function LinkProps(props) {
 	  const {
 	    element
@@ -66989,9 +67685,7 @@
 
 	  return [{
 	    id: 'linkName',
-	    component: o$2(LinkName, {
-	      element: element
-	    }),
+	    component: LinkName,
 	    isEdited: isEdited$1
 	  }];
 	}
@@ -67051,18 +67745,14 @@
 	  const message = getMessage(element);
 	  let entries = [{
 	    id: 'messageRef',
-	    component: o$2(MessageRef, {
-	      element: element
-	    }),
+	    component: MessageRef,
 	    isEdited: isEdited$4
 	  }];
 
 	  if (message) {
 	    entries = [...entries, {
 	      id: 'messageName',
-	      component: o$2(MessageName, {
-	        element: element
-	      }),
+	      component: MessageName,
 	      isEdited: isEdited$1
 	    }];
 	  }
@@ -67196,6 +67886,14 @@
 	  return sortBy(elements, e => (e.name || '').toLowerCase());
 	}
 
+	/**
+	 * @typedef { import('@bpmn-io/properties-panel').EntryDefinition } Entry
+	 */
+
+	/**
+	 * @returns {Array<Entry>} entries
+	 */
+
 	function MultiInstanceProps$2(props) {
 	  const {
 	    element
@@ -67207,15 +67905,11 @@
 
 	  const entries = [{
 	    id: 'loopCardinality',
-	    component: o$2(LoopCardinality, {
-	      element: element
-	    }),
+	    component: LoopCardinality,
 	    isEdited: isEdited$1
 	  }, {
 	    id: 'completionCondition',
-	    component: o$2(CompletionCondition$1, {
-	      element: element
-	    }),
+	    component: CompletionCondition$1,
 	    isEdited: isEdited$1
 	  }];
 	  return entries;
@@ -67439,6 +68133,14 @@
 	  return getBody(completionCondition);
 	}
 
+	/**
+	 * @typedef { import('@bpmn-io/properties-panel').EntryDefinition } Entry
+	 */
+
+	/**
+	 * @returns {Array<Entry>} entries
+	 */
+
 	function NameProps(props) {
 	  const {
 	    element
@@ -67450,9 +68152,7 @@
 
 	  return [{
 	    id: 'name',
-	    component: o$2(Name$3, {
-	      element: element
-	    }),
+	    component: Name$3,
 	    isEdited: isEdited$1
 	  }];
 	}
@@ -67533,12 +68233,20 @@
 	    categoryValue: [categoryValue]
 	  }); // add to correct place
 
-	  add$1(definitions.get('rootElements'), category);
+	  add$2(definitions.get('rootElements'), category);
 	  getBusinessObject(category).$parent = definitions;
 	  getBusinessObject(categoryValue).$parent = category;
 	  return categoryValue;
 	}
 
+	/**
+	 * @typedef { import('@bpmn-io/properties-panel').EntryDefinition } Entry
+	 */
+
+	/**
+	 * @returns {Array<Entry>} entries
+	 */
+
 	function ProcessProps(props) {
 	  const {
 	    element
@@ -67550,15 +68258,11 @@
 
 	  return [{
 	    id: 'processId',
-	    component: o$2(ProcessId, {
-	      element: element
-	    }),
+	    component: ProcessId,
 	    isEdited: isEdited$1
 	  }, {
 	    id: 'processName',
-	    component: o$2(ProcessName, {
-	      element: element
-	    }),
+	    component: ProcessName,
 	    isEdited: isEdited$1
 	  }];
 	}
@@ -67661,18 +68365,14 @@
 	  const signal = getSignal(element);
 	  let entries = [{
 	    id: 'signalRef',
-	    component: o$2(SignalRef, {
-	      element: element
-	    }),
+	    component: SignalRef,
 	    isEdited: isEdited$4
 	  }];
 
 	  if (signal) {
 	    entries = [...entries, {
 	      id: 'signalName',
-	      component: o$2(SignalName, {
-	        element: element
-	      }),
+	      component: SignalName,
 	      isEdited: isEdited$1
 	    }];
 	  }
@@ -67831,23 +68531,19 @@
 	  const entries = [];
 	  entries.push({
 	    id: getId(idPrefix, 'timerEventDefinitionType'),
-	    component: o$2(TimerEventDefinitionType$1, {
-	      element: element,
-	      timerEventDefinition: timerEventDefinition,
-	      timerEventDefinitionType: timerEventDefinitionType
-	    }),
-	    isEdited: isEdited$4
+	    component: TimerEventDefinitionType$1,
+	    isEdited: isEdited$4,
+	    timerEventDefinition,
+	    timerEventDefinitionType
 	  });
 
 	  if (timerEventDefinitionType) {
 	    entries.push({
 	      id: getId(idPrefix, 'timerEventDefinitionValue'),
-	      component: o$2(TimerEventDefinitionValue$1, {
-	        element: element,
-	        timerEventDefinition: timerEventDefinition,
-	        timerEventDefinitionType: timerEventDefinitionType
-	      }),
-	      isEdited: isEdited$1
+	      component: TimerEventDefinitionValue$1,
+	      isEdited: isEdited$1,
+	      timerEventDefinition,
+	      timerEventDefinitionType
 	    });
 	  }
 
@@ -68062,9 +68758,7 @@
 	function GeneralGroup(element) {
 	  const entries = [...NameProps({
 	    element
-	  }), ...IdProps({
-	    element
-	  }), ...ProcessProps({
+	  }), ...IdProps(), ...ProcessProps({
 	    element
 	  }), ...ExecutableProps({
 	    element