@processmaker/modeler 1.39.17 → 1.39.18

package/dist/modeler.umd.js

@@ -12828,7 +12828,7 @@ ___CSS_LOADER_EXPORT___.push([module.id, ".weekday[data-v-4ae18478]{padding:.75e
 
 /***/ }),
 
-/***/ 85346:
+/***/ 80201:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -12842,7 +12842,7 @@ __webpack_require__.r(__webpack_exports__);
 
 var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
 // Module
-___CSS_LOADER_EXPORT___.push([module.id, ".box[data-v-423da30e]{border:1px solid #5faaee;position:absolute;pointer-events:none}", ""]);
+___CSS_LOADER_EXPORT___.push([module.id, ".box[data-v-1d953204]{border:1px solid #5faaee;position:absolute;pointer-events:none}", ""]);
 // Exports
 /* harmony default export */ __webpack_exports__["default"] = (___CSS_LOADER_EXPORT___);
 
@@ -26441,19 +26441,19 @@ var update = add("a84bfd8c", content, true, {"sourceMap":false,"shadowMode":fals
 
 /***/ }),
 
-/***/ 38479:
+/***/ 67491:
 /***/ (function(module, __unused_webpack_exports, __webpack_require__) {
 
 // style-loader: Adds some css to the DOM by adding a <style> tag
 
 // load the styles
-var content = __webpack_require__(85346);
+var content = __webpack_require__(80201);
 if(content.__esModule) content = content.default;
 if(typeof content === 'string') content = [[module.id, content, '']];
 if(content.locals) module.exports = content.locals;
 // add the styles to the DOM
 var add = (__webpack_require__(54402)/* ["default"] */ .Z)
-var update = add("4a535834", content, true, {"sourceMap":false,"shadowMode":false});
+var update = add("347f5550", content, true, {"sourceMap":false,"shadowMode":false});
 
 /***/ }),
 
@@ -28915,8 +28915,6 @@ var es_array_map = __webpack_require__(21249);
 var es_array_concat = __webpack_require__(92222);
 // EXTERNAL MODULE: ./node_modules/core-js/modules/es.array.sort.js
 var es_array_sort = __webpack_require__(2707);
-// EXTERNAL MODULE: ./node_modules/core-js/modules/web.url.to-json.js
-var web_url_to_json = __webpack_require__(83753);
 // EXTERNAL MODULE: ./node_modules/lodash/get.js
 var get = __webpack_require__(27361);
 var get_default = /*#__PURE__*/__webpack_require__.n(get);
@@ -32002,7 +32000,6 @@ var COLOR_COMPLETED_FILL = '#D6FFE6';
 
 
 
-
 var endpoints = {
   source: 'source',
   target: 'target'
@@ -32292,19 +32289,6 @@ function isPoint(item) {
         if (_this8.updateDefinitionLinks) {
           _this8.updateDefinitionLinks();
         }
-        if (_this8.shape.component.node.type === 'processmaker-modeler-data-input-association') {
-          if (_this8.$parent.isMultiplayer) {
-            var genericLink = _this8.shape.findView(_this8.paper);
-            var waypoint = [genericLink.sourceAnchor.toJSON(), genericLink.targetAnchor.toJSON()];
-            window.ProcessMaker.EventBus.$emit('multiplayer-addFlow', {
-              type: _this8.shape.component.node.type,
-              id: "node_".concat(_this8.$parent.nodeIdGenerator.getDefinitionNumber()),
-              sourceRefId: _this8.sourceNode.definition.id,
-              targetRefId: _this8.targetNode.definition.id,
-              waypoint: waypoint
-            });
-          }
-        }
         _this8.$emit('save-state');
       });
       this.shape.listenToOnce(this.paper, 'cell:mouseleave', function () {
@@ -32981,16 +32965,18 @@ function removeBoundaryEvents(graph, node, removeNode) {
   var nodeShape = graph.getCells().find(function (el) {
     return el.component && el.component.node === node;
   });
-  nodeShape.getEmbeddedCells({
-    deep: true
-  }).filter(function (cell) {
-    return cell.component && cell.component.node.isBpmnType('bpmn:BoundaryEvent');
-  }).forEach(function (boundaryEventShape) {
-    graph.getConnectedLinks(boundaryEventShape).forEach(function (shape) {
-      return removeNode(shape.component.node);
+  if (nodeShape) {
+    nodeShape.getEmbeddedCells({
+      deep: true
+    }).filter(function (cell) {
+      return cell.component && cell.component.node.isBpmnType('bpmn:BoundaryEvent');
+    }).forEach(function (boundaryEventShape) {
+      graph.getConnectedLinks(boundaryEventShape).forEach(function (shape) {
+        return removeNode(shape.component.node);
+      });
+      removeNode(boundaryEventShape.component.node);
     });
-    removeNode(boundaryEventShape.component.node);
-  });
+  }
 }
 function removeOutgoingAndIncomingRefsToFlow(node) {
   if (node.isBpmnType(bpmnType, config_bpmnType)) {
@@ -38404,6 +38390,285 @@ var sequenceFlow_component = normalizeComponent(
 )
 
 /* harmony default export */ var sequenceFlow = (sequenceFlow_component.exports);
+;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/checkPrivateRedeclaration.js
+
+function _checkPrivateRedeclaration(obj, privateCollection) {
+  if (privateCollection.has(obj)) {
+    throw new TypeError("Cannot initialize the same private elements twice on an object");
+  }
+}
+;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classPrivateFieldInitSpec.js
+
+function _classPrivateFieldInitSpec(obj, privateMap, value) {
+  _checkPrivateRedeclaration(obj, privateMap);
+  privateMap.set(obj, value);
+}
+;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classApplyDescriptorGet.js
+function _classApplyDescriptorGet(receiver, descriptor) {
+  if (descriptor.get) {
+    return descriptor.get.call(receiver);
+  }
+  return descriptor.value;
+}
+;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classExtractFieldDescriptor.js
+
+function _classExtractFieldDescriptor(receiver, privateMap, action) {
+  if (!privateMap.has(receiver)) {
+    throw new TypeError("attempted to " + action + " private field on non-instance");
+  }
+  return privateMap.get(receiver);
+}
+;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classPrivateFieldGet.js
+
+
+function _classPrivateFieldGet(receiver, privateMap) {
+  var descriptor = _classExtractFieldDescriptor(receiver, privateMap, "get");
+  return _classApplyDescriptorGet(receiver, descriptor);
+}
+;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classCheckPrivateStaticAccess.js
+
+function _classCheckPrivateStaticAccess(receiver, classConstructor) {
+  if (receiver !== classConstructor) {
+    throw new TypeError("Private static access of wrong provenance");
+  }
+}
+;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classCheckPrivateStaticFieldDescriptor.js
+
+function _classCheckPrivateStaticFieldDescriptor(descriptor, action) {
+  if (descriptor === undefined) {
+    throw new TypeError("attempted to " + action + " private static field before its declaration");
+  }
+}
+;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classStaticPrivateFieldSpecGet.js
+
+
+
+function _classStaticPrivateFieldSpecGet(receiver, classConstructor, descriptor) {
+  _classCheckPrivateStaticAccess(receiver, classConstructor);
+  _classCheckPrivateStaticFieldDescriptor(descriptor, "get");
+  return _classApplyDescriptorGet(receiver, descriptor);
+}
+;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classApplyDescriptorSet.js
+
+function _classApplyDescriptorSet(receiver, descriptor, value) {
+  if (descriptor.set) {
+    descriptor.set.call(receiver, value);
+  } else {
+    if (!descriptor.writable) {
+      throw new TypeError("attempted to set read only private field");
+    }
+    descriptor.value = value;
+  }
+}
+;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classStaticPrivateFieldSpecSet.js
+
+
+
+function _classStaticPrivateFieldSpecSet(receiver, classConstructor, descriptor, value) {
+  _classCheckPrivateStaticAccess(receiver, classConstructor);
+  _classCheckPrivateStaticFieldDescriptor(descriptor, "set");
+  _classApplyDescriptorSet(receiver, descriptor, value);
+  return value;
+}
+// EXTERNAL MODULE: ./node_modules/core-js/modules/es.object.get-own-property-names.js
+var es_object_get_own_property_names = __webpack_require__(36210);
+// EXTERNAL MODULE: ./node_modules/core-js/modules/es.string.match.js
+var es_string_match = __webpack_require__(4723);
+// EXTERNAL MODULE: ./node_modules/core-js/modules/es.regexp.constructor.js
+var es_regexp_constructor = __webpack_require__(24603);
+// EXTERNAL MODULE: ./node_modules/core-js/modules/es.regexp.dot-all.js
+var es_regexp_dot_all = __webpack_require__(28450);
+// EXTERNAL MODULE: ./node_modules/core-js/modules/es.regexp.sticky.js
+var es_regexp_sticky = __webpack_require__(88386);
+// EXTERNAL MODULE: ./node_modules/core-js/modules/es.regexp.to-string.js
+var es_regexp_to_string = __webpack_require__(39714);
+// EXTERNAL MODULE: ./node_modules/core-js/modules/es.weak-map.js
+var es_weak_map = __webpack_require__(4129);
+;// CONCATENATED MODULE: ./src/NodeIdGenerator.js
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+var _generateDefinitionId = /*#__PURE__*/new WeakMap();
+var _generateDiagramId = /*#__PURE__*/new WeakMap();
+var _generateProcessId = /*#__PURE__*/new WeakMap();
+var NodeIdGenerator = /*#__PURE__*/function () {
+  function NodeIdGenerator(definitions) {
+    _classCallCheck(this, NodeIdGenerator);
+    _classPrivateFieldInitSpec(this, _generateDefinitionId, {
+      writable: true,
+      value: function value() {
+        var _NodeIdGenerator$coun3, _NodeIdGenerator$coun4;
+        var id = NodeIdGenerator.prefix + _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _counter);
+        _classStaticPrivateFieldSpecSet(NodeIdGenerator, NodeIdGenerator, _counter, (_NodeIdGenerator$coun3 = _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _counter), _NodeIdGenerator$coun4 = _NodeIdGenerator$coun3++, _NodeIdGenerator$coun3)), _NodeIdGenerator$coun4;
+        return id;
+      }
+    });
+    _classPrivateFieldInitSpec(this, _generateDiagramId, {
+      writable: true,
+      value: function value() {
+        var _NodeIdGenerator$diag3, _NodeIdGenerator$diag4;
+        var id = NodeIdGenerator.prefix + _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _diagramCounter) + '_di';
+        _classStaticPrivateFieldSpecSet(NodeIdGenerator, NodeIdGenerator, _diagramCounter, (_NodeIdGenerator$diag3 = _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _diagramCounter), _NodeIdGenerator$diag4 = _NodeIdGenerator$diag3++, _NodeIdGenerator$diag3)), _NodeIdGenerator$diag4;
+        return id;
+      }
+    });
+    _classPrivateFieldInitSpec(this, _generateProcessId, {
+      writable: true,
+      value: function value() {
+        var _NodeIdGenerator$proc, _NodeIdGenerator$proc2;
+        var id = NodeIdGenerator.processPrefix + _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _processCounter);
+        _classStaticPrivateFieldSpecSet(NodeIdGenerator, NodeIdGenerator, _processCounter, (_NodeIdGenerator$proc = _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _processCounter), _NodeIdGenerator$proc2 = _NodeIdGenerator$proc++, _NodeIdGenerator$proc)), _NodeIdGenerator$proc2;
+        return id;
+      }
+    });
+    this.definitions = definitions;
+    this.refreshLastIdCounter();
+    this.refreshLastDiagramIdCounter();
+    this.refreshLastProcessIdCounter();
+  }
+  _createClass(NodeIdGenerator, [{
+    key: "findById",
+    value: function findById(id) {
+      var _this = this;
+      var root = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.definitions.rootElements;
+      var walked = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+      if (walked.indexOf(root) > -1) return;
+      var found;
+      if (root instanceof Array) {
+        walked.push(root);
+        root.find(function (item) {
+          return found = _this.findById(id, item, walked);
+        });
+      } else if (root instanceof Object && root.$type) {
+        walked.push(root);
+        if (root.id === id) return root;
+        Object.getOwnPropertyNames(root).find(function (key) {
+          return found = !(root[key] instanceof Function) && key.substring(0, 1) !== '$' && _this.findById(id, root[key], walked);
+        });
+      }
+      return found;
+    }
+  }, {
+    key: "matchIds",
+    value: function matchIds(idRegex, root) {
+      var _this2 = this;
+      var walked = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+      var lastIdCounter = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
+      if (walked.indexOf(root) > -1) return lastIdCounter;
+      if (root instanceof Array) {
+        walked.push(root);
+        root.forEach(function (item) {
+          return lastIdCounter = _this2.matchIds(idRegex, item, walked, lastIdCounter);
+        });
+      } else if (root instanceof Object) {
+        walked.push(root);
+        if (root.id) {
+          var match = String(root.id).match(idRegex);
+          var idCounter = match ? parseInt(match[1]) : 0;
+          if (idCounter > lastIdCounter) {
+            lastIdCounter = idCounter;
+          }
+        }
+        Object.getOwnPropertyNames(root).forEach(function (key) {
+          if (!(root[key] instanceof Function) && key.substring(0, 1) !== '$') {
+            lastIdCounter = _this2.matchIds(idRegex, root[key], walked, lastIdCounter);
+          }
+        });
+      }
+      return lastIdCounter;
+    }
+  }, {
+    key: "refreshLastIdCounter",
+    value: function refreshLastIdCounter() {
+      var lastIdCounter = this.matchIds(new RegExp("^".concat(NodeIdGenerator.prefix, "(\\d+)$")), this.definitions.rootElements);
+      _classStaticPrivateFieldSpecSet(NodeIdGenerator, NodeIdGenerator, _counter, lastIdCounter + 1);
+    }
+  }, {
+    key: "getCounter",
+    value: function getCounter() {
+      this.refreshLastIdCounter();
+      return _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _counter);
+    }
+  }, {
+    key: "getDefinitionNumber",
+    value: function getDefinitionNumber() {
+      return _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _counter);
+    }
+  }, {
+    key: "updateCounters",
+    value: function updateCounters() {
+      var _NodeIdGenerator$coun, _NodeIdGenerator$coun2, _NodeIdGenerator$diag, _NodeIdGenerator$diag2;
+      _classStaticPrivateFieldSpecSet(NodeIdGenerator, NodeIdGenerator, _counter, (_NodeIdGenerator$coun = _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _counter), _NodeIdGenerator$coun2 = _NodeIdGenerator$coun++, _NodeIdGenerator$coun)), _NodeIdGenerator$coun2;
+      _classStaticPrivateFieldSpecSet(NodeIdGenerator, NodeIdGenerator, _diagramCounter, (_NodeIdGenerator$diag = _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _diagramCounter), _NodeIdGenerator$diag2 = _NodeIdGenerator$diag++, _NodeIdGenerator$diag)), _NodeIdGenerator$diag2;
+    }
+  }, {
+    key: "refreshLastDiagramIdCounter",
+    value: function refreshLastDiagramIdCounter() {
+      var lastIdCounter = this.matchIds(new RegExp("^".concat(NodeIdGenerator.prefix, "(\\d+)_di$")), this.definitions.diagrams);
+      _classStaticPrivateFieldSpecSet(NodeIdGenerator, NodeIdGenerator, _diagramCounter, lastIdCounter + 1);
+    }
+  }, {
+    key: "refreshLastProcessIdCounter",
+    value: function refreshLastProcessIdCounter() {
+      var lastIdCounter = this.matchIds(new RegExp("^".concat(NodeIdGenerator.processPrefix, "(\\d+)$")), this.definitions.rootElements);
+      _classStaticPrivateFieldSpecSet(NodeIdGenerator, NodeIdGenerator, _processCounter, lastIdCounter + 1);
+    }
+  }, {
+    key: "generate",
+    value: function generate() {
+      var definitionId = _classPrivateFieldGet(this, _generateDefinitionId).call(this);
+      var diagramId = _classPrivateFieldGet(this, _generateDiagramId).call(this);
+      return [definitionId, diagramId];
+    }
+  }, {
+    key: "generateProcessId",
+    value: function generateProcessId() {
+      return _classPrivateFieldGet(this, _generateProcessId).call(this);
+    }
+  }]);
+  return NodeIdGenerator;
+}(); // Singleton instance
+_defineProperty(NodeIdGenerator, "prefix", 'node_');
+_defineProperty(NodeIdGenerator, "processPrefix", 'Process_');
+var _counter = {
+  writable: true,
+  value: 1
+};
+var _diagramCounter = {
+  writable: true,
+  value: 1
+};
+var _processCounter = {
+  writable: true,
+  value: 1
+};
+
+var singleton = null;
+function getNodeIdGenerator(definitions) {
+  if (!singleton) {
+    singleton = new NodeIdGenerator(definitions);
+  }
+  return singleton;
+}
 ;// CONCATENATED MODULE: ./src/components/nodes/sequenceFlow/index.js
 
 
@@ -38415,6 +38680,10 @@ var sequenceFlow_component = normalizeComponent(
 
 
 
+
+
+
+
 var sequenceFlow_id = 'processmaker-modeler-sequence-flow';
 /* harmony default export */ var nodes_sequenceFlow = ({
   id: sequenceFlow_id,
@@ -38489,7 +38758,30 @@ var sequenceFlow_id = 'processmaker-modeler-sequence-flow';
         })
       }]
     }, documentationAccordionConfig, advancedAccordionConfig]
-  }]
+  }],
+  multiplayerClient: function multiplayerClient(modeler, data) {
+    return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
+      var paper, sourceElem, targetElem, flow, actualFlow, nodeIdereator;
+      return _regeneratorRuntime().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            paper = modeler.paper;
+            sourceElem = modeler.getElementByNodeId(data.sourceRefId);
+            targetElem = modeler.getElementByNodeId(data.targetRefId);
+            if (sourceElem && targetElem) {
+              flow = new SequenceFlow(modeler.nodeRegistry, modeler.moddle, paper);
+              actualFlow = flow.makeFlowNode(sourceElem, targetElem, data.waypoint); // add Nodes
+              modeler.addNode(actualFlow, data.id, true);
+              nodeIdereator = getNodeIdGenerator(modeler.definitions);
+              nodeIdereator.updateCounters();
+            }
+          case 4:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }))();
+  }
 });
 ;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/nodes/messageFlow/messageFlow.vue?vue&type=template&id=2025c58d&
 var messageFlowvue_type_template_id_2025c58d_render = function render() {
@@ -38673,6 +38965,10 @@ var messageFlow_config_id = 'processmaker-modeler-message-flow';
 
 
 
+
+
+
+
 /* harmony default export */ var nodes_messageFlow = ({
   id: messageFlow_config_id,
   component: messageFlow,
@@ -38702,7 +38998,30 @@ var messageFlow_config_id = 'processmaker-modeler-message-flow';
         config: inspectors_nameConfigSettings
       }]
     }, documentationAccordionConfig, advancedAccordionConfig]
-  }]
+  }],
+  multiplayerClient: function multiplayerClient(modeler, data) {
+    return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
+      var paper, sourceElem, targetElem, flow, actualFlow, nodeIdereator;
+      return _regeneratorRuntime().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            paper = modeler.paper;
+            sourceElem = modeler.getElementByNodeId(data.sourceRefId);
+            targetElem = modeler.getElementByNodeId(data.targetRefId);
+            if (sourceElem && targetElem) {
+              flow = new MessageFlow(modeler.nodeRegistry, modeler.moddle, paper);
+              actualFlow = flow.makeFlowNode(sourceElem, targetElem, data.waypoint); // add Nodes
+              modeler.addNode(actualFlow, data.id, true);
+              nodeIdereator = getNodeIdGenerator(modeler.definitions);
+              nodeIdereator.updateCounters();
+            }
+          case 4:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }))();
+  }
 });
 // EXTERNAL MODULE: ./node_modules/svg-inline-loader/index.js!./src/assets/message-end-event.svg
 var message_end_event = __webpack_require__(18256);
@@ -39016,8 +39335,6 @@ var MessageSelectvue_type_template_id_395d11da_scoped_true_staticRenderFns = [];
 
 ;// CONCATENATED MODULE: ./src/components/inspectors/MessageSelect.vue?vue&type=template&id=395d11da&scoped=true&
 
-// EXTERNAL MODULE: ./node_modules/core-js/modules/es.string.match.js
-var es_string_match = __webpack_require__(4723);
 // EXTERNAL MODULE: ./node_modules/core-js/modules/es.array.find-index.js
 var es_array_find_index = __webpack_require__(34553);
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/inspectors/MessageSelect.vue?vue&type=script&lang=js&
@@ -43947,283 +44264,6 @@ var LoopCharacteristics_component = normalizeComponent(
 /* harmony default export */ var LoopCharacteristics = (LoopCharacteristics_component.exports);
 // EXTERNAL MODULE: ./node_modules/core-js/modules/es.object.assign.js
 var es_object_assign = __webpack_require__(19601);
-// EXTERNAL MODULE: ./node_modules/core-js/modules/es.object.get-own-property-names.js
-var es_object_get_own_property_names = __webpack_require__(36210);
-;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/checkPrivateRedeclaration.js
-
-function _checkPrivateRedeclaration(obj, privateCollection) {
-  if (privateCollection.has(obj)) {
-    throw new TypeError("Cannot initialize the same private elements twice on an object");
-  }
-}
-;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classPrivateFieldInitSpec.js
-
-function _classPrivateFieldInitSpec(obj, privateMap, value) {
-  _checkPrivateRedeclaration(obj, privateMap);
-  privateMap.set(obj, value);
-}
-;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classApplyDescriptorGet.js
-function _classApplyDescriptorGet(receiver, descriptor) {
-  if (descriptor.get) {
-    return descriptor.get.call(receiver);
-  }
-  return descriptor.value;
-}
-;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classExtractFieldDescriptor.js
-
-function _classExtractFieldDescriptor(receiver, privateMap, action) {
-  if (!privateMap.has(receiver)) {
-    throw new TypeError("attempted to " + action + " private field on non-instance");
-  }
-  return privateMap.get(receiver);
-}
-;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classPrivateFieldGet.js
-
-
-function _classPrivateFieldGet(receiver, privateMap) {
-  var descriptor = _classExtractFieldDescriptor(receiver, privateMap, "get");
-  return _classApplyDescriptorGet(receiver, descriptor);
-}
-;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classCheckPrivateStaticAccess.js
-
-function _classCheckPrivateStaticAccess(receiver, classConstructor) {
-  if (receiver !== classConstructor) {
-    throw new TypeError("Private static access of wrong provenance");
-  }
-}
-;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classCheckPrivateStaticFieldDescriptor.js
-
-function _classCheckPrivateStaticFieldDescriptor(descriptor, action) {
-  if (descriptor === undefined) {
-    throw new TypeError("attempted to " + action + " private static field before its declaration");
-  }
-}
-;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classStaticPrivateFieldSpecGet.js
-
-
-
-function _classStaticPrivateFieldSpecGet(receiver, classConstructor, descriptor) {
-  _classCheckPrivateStaticAccess(receiver, classConstructor);
-  _classCheckPrivateStaticFieldDescriptor(descriptor, "get");
-  return _classApplyDescriptorGet(receiver, descriptor);
-}
-;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classApplyDescriptorSet.js
-
-function _classApplyDescriptorSet(receiver, descriptor, value) {
-  if (descriptor.set) {
-    descriptor.set.call(receiver, value);
-  } else {
-    if (!descriptor.writable) {
-      throw new TypeError("attempted to set read only private field");
-    }
-    descriptor.value = value;
-  }
-}
-;// CONCATENATED MODULE: ./node_modules/@vue/babel-preset-app/node_modules/@babel/runtime/helpers/esm/classStaticPrivateFieldSpecSet.js
-
-
-
-function _classStaticPrivateFieldSpecSet(receiver, classConstructor, descriptor, value) {
-  _classCheckPrivateStaticAccess(receiver, classConstructor);
-  _classCheckPrivateStaticFieldDescriptor(descriptor, "set");
-  _classApplyDescriptorSet(receiver, descriptor, value);
-  return value;
-}
-// EXTERNAL MODULE: ./node_modules/core-js/modules/es.regexp.constructor.js
-var es_regexp_constructor = __webpack_require__(24603);
-// EXTERNAL MODULE: ./node_modules/core-js/modules/es.regexp.dot-all.js
-var es_regexp_dot_all = __webpack_require__(28450);
-// EXTERNAL MODULE: ./node_modules/core-js/modules/es.regexp.sticky.js
-var es_regexp_sticky = __webpack_require__(88386);
-// EXTERNAL MODULE: ./node_modules/core-js/modules/es.regexp.to-string.js
-var es_regexp_to_string = __webpack_require__(39714);
-// EXTERNAL MODULE: ./node_modules/core-js/modules/es.weak-map.js
-var es_weak_map = __webpack_require__(4129);
-;// CONCATENATED MODULE: ./src/NodeIdGenerator.js
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-var _generateDefinitionId = /*#__PURE__*/new WeakMap();
-var _generateDiagramId = /*#__PURE__*/new WeakMap();
-var _generateProcessId = /*#__PURE__*/new WeakMap();
-var NodeIdGenerator = /*#__PURE__*/function () {
-  function NodeIdGenerator(definitions) {
-    _classCallCheck(this, NodeIdGenerator);
-    _classPrivateFieldInitSpec(this, _generateDefinitionId, {
-      writable: true,
-      value: function value() {
-        var _NodeIdGenerator$coun3, _NodeIdGenerator$coun4;
-        var id = NodeIdGenerator.prefix + _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _counter);
-        _classStaticPrivateFieldSpecSet(NodeIdGenerator, NodeIdGenerator, _counter, (_NodeIdGenerator$coun3 = _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _counter), _NodeIdGenerator$coun4 = _NodeIdGenerator$coun3++, _NodeIdGenerator$coun3)), _NodeIdGenerator$coun4;
-        return id;
-      }
-    });
-    _classPrivateFieldInitSpec(this, _generateDiagramId, {
-      writable: true,
-      value: function value() {
-        var _NodeIdGenerator$diag3, _NodeIdGenerator$diag4;
-        var id = NodeIdGenerator.prefix + _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _diagramCounter) + '_di';
-        _classStaticPrivateFieldSpecSet(NodeIdGenerator, NodeIdGenerator, _diagramCounter, (_NodeIdGenerator$diag3 = _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _diagramCounter), _NodeIdGenerator$diag4 = _NodeIdGenerator$diag3++, _NodeIdGenerator$diag3)), _NodeIdGenerator$diag4;
-        return id;
-      }
-    });
-    _classPrivateFieldInitSpec(this, _generateProcessId, {
-      writable: true,
-      value: function value() {
-        var _NodeIdGenerator$proc, _NodeIdGenerator$proc2;
-        var id = NodeIdGenerator.processPrefix + _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _processCounter);
-        _classStaticPrivateFieldSpecSet(NodeIdGenerator, NodeIdGenerator, _processCounter, (_NodeIdGenerator$proc = _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _processCounter), _NodeIdGenerator$proc2 = _NodeIdGenerator$proc++, _NodeIdGenerator$proc)), _NodeIdGenerator$proc2;
-        return id;
-      }
-    });
-    this.definitions = definitions;
-    this.refreshLastIdCounter();
-    this.refreshLastDiagramIdCounter();
-    this.refreshLastProcessIdCounter();
-  }
-  _createClass(NodeIdGenerator, [{
-    key: "findById",
-    value: function findById(id) {
-      var _this = this;
-      var root = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.definitions.rootElements;
-      var walked = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
-      if (walked.indexOf(root) > -1) return;
-      var found;
-      if (root instanceof Array) {
-        walked.push(root);
-        root.find(function (item) {
-          return found = _this.findById(id, item, walked);
-        });
-      } else if (root instanceof Object && root.$type) {
-        walked.push(root);
-        if (root.id === id) return root;
-        Object.getOwnPropertyNames(root).find(function (key) {
-          return found = !(root[key] instanceof Function) && key.substring(0, 1) !== '$' && _this.findById(id, root[key], walked);
-        });
-      }
-      return found;
-    }
-  }, {
-    key: "matchIds",
-    value: function matchIds(idRegex, root) {
-      var _this2 = this;
-      var walked = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
-      var lastIdCounter = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
-      if (walked.indexOf(root) > -1) return lastIdCounter;
-      if (root instanceof Array) {
-        walked.push(root);
-        root.forEach(function (item) {
-          return lastIdCounter = _this2.matchIds(idRegex, item, walked, lastIdCounter);
-        });
-      } else if (root instanceof Object) {
-        walked.push(root);
-        if (root.id) {
-          var match = String(root.id).match(idRegex);
-          var idCounter = match ? parseInt(match[1]) : 0;
-          if (idCounter > lastIdCounter) {
-            lastIdCounter = idCounter;
-          }
-        }
-        Object.getOwnPropertyNames(root).forEach(function (key) {
-          if (!(root[key] instanceof Function) && key.substring(0, 1) !== '$') {
-            lastIdCounter = _this2.matchIds(idRegex, root[key], walked, lastIdCounter);
-          }
-        });
-      }
-      return lastIdCounter;
-    }
-  }, {
-    key: "refreshLastIdCounter",
-    value: function refreshLastIdCounter() {
-      var lastIdCounter = this.matchIds(new RegExp("^".concat(NodeIdGenerator.prefix, "(\\d+)$")), this.definitions.rootElements);
-      _classStaticPrivateFieldSpecSet(NodeIdGenerator, NodeIdGenerator, _counter, lastIdCounter + 1);
-    }
-  }, {
-    key: "getCounter",
-    value: function getCounter() {
-      this.refreshLastIdCounter();
-      return _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _counter);
-    }
-  }, {
-    key: "getDefinitionNumber",
-    value: function getDefinitionNumber() {
-      return _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _counter);
-    }
-  }, {
-    key: "updateCounters",
-    value: function updateCounters() {
-      var _NodeIdGenerator$coun, _NodeIdGenerator$coun2, _NodeIdGenerator$diag, _NodeIdGenerator$diag2;
-      _classStaticPrivateFieldSpecSet(NodeIdGenerator, NodeIdGenerator, _counter, (_NodeIdGenerator$coun = _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _counter), _NodeIdGenerator$coun2 = _NodeIdGenerator$coun++, _NodeIdGenerator$coun)), _NodeIdGenerator$coun2;
-      _classStaticPrivateFieldSpecSet(NodeIdGenerator, NodeIdGenerator, _diagramCounter, (_NodeIdGenerator$diag = _classStaticPrivateFieldSpecGet(NodeIdGenerator, NodeIdGenerator, _diagramCounter), _NodeIdGenerator$diag2 = _NodeIdGenerator$diag++, _NodeIdGenerator$diag)), _NodeIdGenerator$diag2;
-    }
-  }, {
-    key: "refreshLastDiagramIdCounter",
-    value: function refreshLastDiagramIdCounter() {
-      var lastIdCounter = this.matchIds(new RegExp("^".concat(NodeIdGenerator.prefix, "(\\d+)_di$")), this.definitions.diagrams);
-      _classStaticPrivateFieldSpecSet(NodeIdGenerator, NodeIdGenerator, _diagramCounter, lastIdCounter + 1);
-    }
-  }, {
-    key: "refreshLastProcessIdCounter",
-    value: function refreshLastProcessIdCounter() {
-      var lastIdCounter = this.matchIds(new RegExp("^".concat(NodeIdGenerator.processPrefix, "(\\d+)$")), this.definitions.rootElements);
-      _classStaticPrivateFieldSpecSet(NodeIdGenerator, NodeIdGenerator, _processCounter, lastIdCounter + 1);
-    }
-  }, {
-    key: "generate",
-    value: function generate() {
-      var definitionId = _classPrivateFieldGet(this, _generateDefinitionId).call(this);
-      var diagramId = _classPrivateFieldGet(this, _generateDiagramId).call(this);
-      return [definitionId, diagramId];
-    }
-  }, {
-    key: "generateProcessId",
-    value: function generateProcessId() {
-      return _classPrivateFieldGet(this, _generateProcessId).call(this);
-    }
-  }]);
-  return NodeIdGenerator;
-}(); // Singleton instance
-_defineProperty(NodeIdGenerator, "prefix", 'node_');
-_defineProperty(NodeIdGenerator, "processPrefix", 'Process_');
-var _counter = {
-  writable: true,
-  value: 1
-};
-var _diagramCounter = {
-  writable: true,
-  value: 1
-};
-var _processCounter = {
-  writable: true,
-  value: 1
-};
-
-var singleton = null;
-function getNodeIdGenerator(definitions) {
-  if (!singleton) {
-    singleton = new NodeIdGenerator(definitions);
-  }
-  return singleton;
-}
 ;// CONCATENATED MODULE: ./src/NodeInspector.js
 
 
@@ -45480,8 +45520,8 @@ var textAnnotation_id = 'processmaker-modeler-text-annotation';
     }, documentationAccordionConfig, advancedAccordionConfig]
   }]
 });
-;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/nodes/pool/pool.vue?vue&type=template&id=294eae13&
-var poolvue_type_template_id_294eae13_render = function render() {
+;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/nodes/pool/pool.vue?vue&type=template&id=fbed1670&
+var poolvue_type_template_id_fbed1670_render = function render() {
   var _vm = this,
     _c = _vm._self._c;
   return _c('crown-config', _vm._g({
@@ -45534,7 +45574,7 @@ var poolvue_type_template_id_294eae13_render = function render() {
     }
   })], 1);
 };
-var poolvue_type_template_id_294eae13_staticRenderFns = [];
+var poolvue_type_template_id_fbed1670_staticRenderFns = [];
 
 ;// CONCATENATED MODULE: ./src/assets/highlight-shape.svg
 var highlight_shape_namespaceObject = __webpack_require__.p + "img/highlight-shape.5f7b1ba9.svg";
@@ -46180,176 +46220,6 @@ var poolLane_component = normalizeComponent(
 )
 
 /* harmony default export */ var poolLane = (poolLane_component.exports);
-;// CONCATENATED MODULE: ./src/components/nodes/poolLane/index.js
-
-
-
-
-
-/* harmony default export */ var nodes_poolLane = ({
-  id: poolLane_config_id,
-  component: poolLane,
-  bpmnType: 'bpmn:Lane',
-  control: false,
-  category: 'BPMN',
-  label: 'Lane',
-  definition: function definition(moddle) {
-    return moddle.create('bpmn:Lane', {
-      name: ''
-    });
-  },
-  diagram: function diagram(moddle) {
-    return moddle.create('bpmndi:BPMNShape', {
-      bounds: moddle.create('dc:Bounds', {
-        height: 150,
-        width: 600,
-        x: null,
-        y: null
-      })
-    });
-  },
-  inspectorConfig: [{
-    name: 'Lane',
-    items: [{
-      component: 'FormAccordion',
-      container: true,
-      config: {
-        initiallyOpen: true,
-        label: 'Properties',
-        icon: 'cog',
-        name: 'inspector-accordion-pool-lane'
-      },
-      items: [{
-        component: 'FormInput',
-        config: inspectors_nameConfigSettings
-      }]
-    }, documentationAccordionConfig, advancedAccordionConfig]
-  }]
-});
-;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/crown/crownButtons/addLaneAboveButton.vue?vue&type=template&id=fc69b4f4&
-var addLaneAboveButtonvue_type_template_id_fc69b4f4_render = function render() {
-  var _vm = this,
-    _c = _vm._self._c;
-  return _c('crown-button', _vm._g({
-    attrs: {
-      "id": "lane-above-button",
-      "aria-label": "Add lane above icon",
-      "width": 25
-    }
-  }, _vm.$listeners), [_c('font-awesome-icon', {
-    attrs: {
-      "icon": ['fpm', 'fa-lane-above']
-    }
-  })], 1);
-};
-var addLaneAboveButtonvue_type_template_id_fc69b4f4_staticRenderFns = [];
-
-;// CONCATENATED MODULE: ./src/assets/lane-above.svg
-var lane_above_namespaceObject = __webpack_require__.p + "img/lane-above.37ee2b80.svg";
-;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/crown/crownButtons/addLaneAboveButton.vue?vue&type=script&lang=js&
-
-
-
-
-
-/* harmony default export */ var addLaneAboveButtonvue_type_script_lang_js_ = ({
-  components: {
-    CrownButton: crownButton,
-    FontAwesomeIcon: vue_fontawesome_.FontAwesomeIcon
-  },
-  data: function data() {
-    return {
-      laneAboveIcon: lane_above_namespaceObject
-    };
-  },
-  created: function created() {
-    fontawesome_svg_core_.library.add(faLaneAbove);
-  }
-});
-;// CONCATENATED MODULE: ./src/components/crown/crownButtons/addLaneAboveButton.vue?vue&type=script&lang=js&
- /* harmony default export */ var crownButtons_addLaneAboveButtonvue_type_script_lang_js_ = (addLaneAboveButtonvue_type_script_lang_js_); 
-;// CONCATENATED MODULE: ./src/components/crown/crownButtons/addLaneAboveButton.vue
-
-
-
-
-
-/* normalize component */
-;
-var addLaneAboveButton_component = normalizeComponent(
-  crownButtons_addLaneAboveButtonvue_type_script_lang_js_,
-  addLaneAboveButtonvue_type_template_id_fc69b4f4_render,
-  addLaneAboveButtonvue_type_template_id_fc69b4f4_staticRenderFns,
-  false,
-  null,
-  null,
-  null
-  
-)
-
-/* harmony default export */ var addLaneAboveButton = (addLaneAboveButton_component.exports);
-;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/crown/crownButtons/addLaneBelowButton.vue?vue&type=template&id=4b1af748&
-var addLaneBelowButtonvue_type_template_id_4b1af748_render = function render() {
-  var _vm = this,
-    _c = _vm._self._c;
-  return _c('crown-button', _vm._g({
-    attrs: {
-      "id": "lane-below-button",
-      "aria-label": "Add lane below icon",
-      "width": 25
-    }
-  }, _vm.$listeners), [_c('font-awesome-icon', {
-    attrs: {
-      "icon": ['fpm', 'fa-lane-below']
-    }
-  })], 1);
-};
-var addLaneBelowButtonvue_type_template_id_4b1af748_staticRenderFns = [];
-
-;// CONCATENATED MODULE: ./src/assets/lane-below.svg
-var lane_below_namespaceObject = __webpack_require__.p + "img/lane-below.22169670.svg";
-;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/crown/crownButtons/addLaneBelowButton.vue?vue&type=script&lang=js&
-
-
-
-
-
-/* harmony default export */ var addLaneBelowButtonvue_type_script_lang_js_ = ({
-  components: {
-    CrownButton: crownButton,
-    FontAwesomeIcon: vue_fontawesome_.FontAwesomeIcon
-  },
-  data: function data() {
-    return {
-      laneBelowIcon: lane_below_namespaceObject
-    };
-  },
-  created: function created() {
-    fontawesome_svg_core_.library.add(faLaneBelow);
-  }
-});
-;// CONCATENATED MODULE: ./src/components/crown/crownButtons/addLaneBelowButton.vue?vue&type=script&lang=js&
- /* harmony default export */ var crownButtons_addLaneBelowButtonvue_type_script_lang_js_ = (addLaneBelowButtonvue_type_script_lang_js_); 
-;// CONCATENATED MODULE: ./src/components/crown/crownButtons/addLaneBelowButton.vue
-
-
-
-
-
-/* normalize component */
-;
-var addLaneBelowButton_component = normalizeComponent(
-  crownButtons_addLaneBelowButtonvue_type_script_lang_js_,
-  addLaneBelowButtonvue_type_template_id_4b1af748_render,
-  addLaneBelowButtonvue_type_template_id_4b1af748_staticRenderFns,
-  false,
-  null,
-  null,
-  null
-  
-)
-
-/* harmony default export */ var addLaneBelowButton = (addLaneBelowButton_component.exports);
 ;// CONCATENATED MODULE: ./src/components/nodes/pool/poolShape.js
 
 
@@ -46758,6 +46628,227 @@ function configurePool(collaboration, node, graph) {
 function elementShouldHaveFlowNodeRef(element) {
   return element.component && element.component.node.type !== poolLane_config_id && element.component.node.type !== textAnnotation_id && element.component.node.type !== dataObject_id && element.component.node.type !== dataStore_id;
 }
+;// CONCATENATED MODULE: ./src/components/nodes/poolLane/index.js
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+/* harmony default export */ var nodes_poolLane = ({
+  id: poolLane_config_id,
+  component: poolLane,
+  bpmnType: 'bpmn:Lane',
+  control: false,
+  category: 'BPMN',
+  label: 'Lane',
+  definition: function definition(moddle) {
+    return moddle.create('bpmn:Lane', {
+      name: ''
+    });
+  },
+  diagram: function diagram(moddle) {
+    return moddle.create('bpmndi:BPMNShape', {
+      bounds: moddle.create('dc:Bounds', {
+        height: 150,
+        width: 600,
+        x: null,
+        y: null
+      })
+    });
+  },
+  inspectorConfig: [{
+    name: 'Lane',
+    items: [{
+      component: 'FormAccordion',
+      container: true,
+      config: {
+        initiallyOpen: true,
+        label: 'Properties',
+        icon: 'cog',
+        name: 'inspector-accordion-pool-lane'
+      },
+      items: [{
+        component: 'FormInput',
+        config: inspectors_nameConfigSettings
+      }]
+    }, documentationAccordionConfig, advancedAccordionConfig]
+  }],
+  multiplayerClient: function multiplayerClient(modeler, data) {
+    return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
+      var pool, definition, nodeIdereator, diagram, node;
+      return _regeneratorRuntime().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            pool = modeler.getElementByNodeId(data.poolId);
+            definition = modeler.moddle.create('bpmn:Lane', {
+              name: data.name
+            });
+            if (!pool.component.laneSet && pool.component.createLaneSet) {
+              pool.component.createLaneSet([data.laneSetId]);
+              /* If there are currently elements in the pool, add them to the first lane */
+              pool.component.shape.getEmbeddedCells().filter(function (element) {
+                return elementShouldHaveFlowNodeRef(element);
+              }).forEach(function (element) {
+                definition.get('flowNodeRef').push(element.component.node.definition);
+              });
+              nodeIdereator = getNodeIdGenerator(modeler.definitions);
+              nodeIdereator.updateCounters();
+            }
+            diagram = modeler.moddle.create('bpmndi:BPMNShape', {
+              bounds: modeler.moddle.create('dc:Bounds', {
+                height: data.height,
+                width: data.width,
+                x: data.x,
+                y: data.y
+              })
+            });
+            node = new Node(data.type, definition, diagram);
+            _context.next = 7;
+            return modeler.addNode(node, data.id, true);
+          case 7:
+            modeler.setShapeStacking(pool.component.shape);
+          case 8:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }))();
+  }
+});
+;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/crown/crownButtons/addLaneAboveButton.vue?vue&type=template&id=fc69b4f4&
+var addLaneAboveButtonvue_type_template_id_fc69b4f4_render = function render() {
+  var _vm = this,
+    _c = _vm._self._c;
+  return _c('crown-button', _vm._g({
+    attrs: {
+      "id": "lane-above-button",
+      "aria-label": "Add lane above icon",
+      "width": 25
+    }
+  }, _vm.$listeners), [_c('font-awesome-icon', {
+    attrs: {
+      "icon": ['fpm', 'fa-lane-above']
+    }
+  })], 1);
+};
+var addLaneAboveButtonvue_type_template_id_fc69b4f4_staticRenderFns = [];
+
+;// CONCATENATED MODULE: ./src/assets/lane-above.svg
+var lane_above_namespaceObject = __webpack_require__.p + "img/lane-above.37ee2b80.svg";
+;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/crown/crownButtons/addLaneAboveButton.vue?vue&type=script&lang=js&
+
+
+
+
+
+/* harmony default export */ var addLaneAboveButtonvue_type_script_lang_js_ = ({
+  components: {
+    CrownButton: crownButton,
+    FontAwesomeIcon: vue_fontawesome_.FontAwesomeIcon
+  },
+  data: function data() {
+    return {
+      laneAboveIcon: lane_above_namespaceObject
+    };
+  },
+  created: function created() {
+    fontawesome_svg_core_.library.add(faLaneAbove);
+  }
+});
+;// CONCATENATED MODULE: ./src/components/crown/crownButtons/addLaneAboveButton.vue?vue&type=script&lang=js&
+ /* harmony default export */ var crownButtons_addLaneAboveButtonvue_type_script_lang_js_ = (addLaneAboveButtonvue_type_script_lang_js_); 
+;// CONCATENATED MODULE: ./src/components/crown/crownButtons/addLaneAboveButton.vue
+
+
+
+
+
+/* normalize component */
+;
+var addLaneAboveButton_component = normalizeComponent(
+  crownButtons_addLaneAboveButtonvue_type_script_lang_js_,
+  addLaneAboveButtonvue_type_template_id_fc69b4f4_render,
+  addLaneAboveButtonvue_type_template_id_fc69b4f4_staticRenderFns,
+  false,
+  null,
+  null,
+  null
+  
+)
+
+/* harmony default export */ var addLaneAboveButton = (addLaneAboveButton_component.exports);
+;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/crown/crownButtons/addLaneBelowButton.vue?vue&type=template&id=4b1af748&
+var addLaneBelowButtonvue_type_template_id_4b1af748_render = function render() {
+  var _vm = this,
+    _c = _vm._self._c;
+  return _c('crown-button', _vm._g({
+    attrs: {
+      "id": "lane-below-button",
+      "aria-label": "Add lane below icon",
+      "width": 25
+    }
+  }, _vm.$listeners), [_c('font-awesome-icon', {
+    attrs: {
+      "icon": ['fpm', 'fa-lane-below']
+    }
+  })], 1);
+};
+var addLaneBelowButtonvue_type_template_id_4b1af748_staticRenderFns = [];
+
+;// CONCATENATED MODULE: ./src/assets/lane-below.svg
+var lane_below_namespaceObject = __webpack_require__.p + "img/lane-below.22169670.svg";
+;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/crown/crownButtons/addLaneBelowButton.vue?vue&type=script&lang=js&
+
+
+
+
+
+/* harmony default export */ var addLaneBelowButtonvue_type_script_lang_js_ = ({
+  components: {
+    CrownButton: crownButton,
+    FontAwesomeIcon: vue_fontawesome_.FontAwesomeIcon
+  },
+  data: function data() {
+    return {
+      laneBelowIcon: lane_below_namespaceObject
+    };
+  },
+  created: function created() {
+    fontawesome_svg_core_.library.add(faLaneBelow);
+  }
+});
+;// CONCATENATED MODULE: ./src/components/crown/crownButtons/addLaneBelowButton.vue?vue&type=script&lang=js&
+ /* harmony default export */ var crownButtons_addLaneBelowButtonvue_type_script_lang_js_ = (addLaneBelowButtonvue_type_script_lang_js_); 
+;// CONCATENATED MODULE: ./src/components/crown/crownButtons/addLaneBelowButton.vue
+
+
+
+
+
+/* normalize component */
+;
+var addLaneBelowButton_component = normalizeComponent(
+  crownButtons_addLaneBelowButtonvue_type_script_lang_js_,
+  addLaneBelowButtonvue_type_template_id_4b1af748_render,
+  addLaneBelowButtonvue_type_template_id_4b1af748_staticRenderFns,
+  false,
+  null,
+  null,
+  null
+  
+)
+
+/* harmony default export */ var addLaneBelowButton = (addLaneBelowButton_component.exports);
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/nodes/pool/pool.vue?vue&type=script&lang=js&
 
 
@@ -46872,6 +46963,26 @@ function elementShouldHaveFlowNodeRef(element) {
       pull_default()(this.containingProcess.get('flowElements'), elementDefinition);
       toPool.component.containingProcess.get('flowElements').push(elementDefinition);
     },
+    moveElementRemote: function moveElementRemote(element, toPool) {
+      var elementDefinition = element.component.node.definition;
+      if (this.laneSet) {
+        /* Remove references to the element from the current Lane */
+        var containingLane = this.laneSet.get('lanes').find(function (lane) {
+          return lane.get('flowNodeRef').includes(elementDefinition);
+        });
+        pull_default()(containingLane.get('flowNodeRef'), elementDefinition);
+      }
+
+      /* Remove references to the element from the current process */
+      pull_default()(this.containingProcess.get('flowElements'), elementDefinition);
+      element.component.node.pool = toPool;
+      this.shape.unembed(element);
+      toPool.component.shape.embed(element);
+      if (element.component.node.type !== poolLane_config_id && toPool.component.laneSet) {
+        toPool.component.updateLaneChildren();
+      }
+      this.$emit('set-shape-stacking', element.component.shape);
+    },
     moveElement: function moveElement(element, toPool) {
       var elementDefinition = element.component.node.definition;
       if (this.laneSet) {
@@ -46891,12 +47002,14 @@ function elementShouldHaveFlowNodeRef(element) {
       toPool.component.addToPool(element);
     },
     addLane: function addLane() {
-      var _this3 = this;
+      var _arguments = arguments,
+        _this3 = this;
       return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
-        var lanes, definition;
+        var emitMultiplayer, lanes, definition;
         return _regeneratorRuntime().wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
+              emitMultiplayer = _arguments.length > 0 && _arguments[0] !== undefined ? _arguments[0] : true;
               /* A Lane element must be contained in a LaneSet element.
                  * Get the current laneSet element or create a new one. */
               lanes = [];
@@ -46912,39 +47025,60 @@ function elementShouldHaveFlowNodeRef(element) {
                 lanes.push(_this3.pushNewLane(definition));
               }
               lanes.push(_this3.pushNewLane());
-              _context.next = 5;
-              return Promise.all(lanes);
-            case 5:
+              _context.next = 6;
+              return Promise.all(lanes).then(function (val) {
+                if (emitMultiplayer && _this3.$parent.isMultiplayer) {
+                  window.ProcessMaker.EventBus.$emit('multiplayer-addLanes', val);
+                }
+              });
+            case 6:
               _this3.$emit('set-shape-stacking', _this3.shape);
               _this3.graph.getLinks().forEach(function (link) {
                 _this3.$emit('set-shape-stacking', link);
               });
               _this3.$emit('save-state');
-            case 8:
+            case 9:
             case "end":
               return _context.stop();
           }
         }, _callee);
       }))();
     },
-    createLaneSet: function createLaneSet() {
+    createLaneSet: function createLaneSet(id) {
       var laneSet = this.moddle.create('bpmn:LaneSet');
       this.laneSet = laneSet;
       var generator = this.nodeIdGenerator;
-      var _generator$generate = generator.generate(),
-        _generator$generate2 = _slicedToArray(_generator$generate, 1),
-        laneSetId = _generator$generate2[0];
+      var _ref2 = id !== null && id !== void 0 ? id : generator.generate(),
+        _ref3 = _slicedToArray(_ref2, 1),
+        laneSetId = _ref3[0];
       this.laneSet.set('id', laneSetId);
       this.containingProcess.get('laneSets').push(laneSet);
     },
     pushNewLane: function pushNewLane() {
-      var definition = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : nodes_poolLane.definition(this.moddle, this.$t);
-      definition.set('color', this.node.definition.get('color'));
-      this.$emit('set-pool-target', this.shape);
-      var diagram = nodes_poolLane.diagram(this.moddle);
-      diagram.bounds.width = this.shape.getBBox().width;
-      this.$emit('add-node', new Node(nodes_poolLane.id, definition, diagram));
-      return this.$nextTick();
+      var _arguments2 = arguments,
+        _this4 = this;
+      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
+        var definition, diagram, node;
+        return _regeneratorRuntime().wrap(function _callee2$(_context2) {
+          while (1) switch (_context2.prev = _context2.next) {
+            case 0:
+              definition = _arguments2.length > 0 && _arguments2[0] !== undefined ? _arguments2[0] : nodes_poolLane.definition(_this4.moddle, _this4.$t);
+              definition.set('color', _this4.node.definition.get('color'));
+              _this4.$emit('set-pool-target', _this4.shape);
+              diagram = nodes_poolLane.diagram(_this4.moddle);
+              diagram.bounds.width = _this4.shape.getBBox().width;
+              node = new Node(nodes_poolLane.id, definition, diagram);
+              _this4.$emit('add-node', node);
+              _context2.next = 9;
+              return _this4.$nextTick();
+            case 9:
+              return _context2.abrupt("return", node);
+            case 10:
+            case "end":
+              return _context2.stop();
+          }
+        }, _callee2);
+      }))();
     },
     addToPool: function addToPool(element) {
       if (element.component.node.isBpmnType('bpmn:BoundaryEvent')) {
@@ -47097,11 +47231,11 @@ function elementShouldHaveFlowNodeRef(element) {
       });
     },
     resizeLanes: function resizeLanes() {
-      var _this4 = this;
+      var _this5 = this;
       this.sortedLanes().forEach(function (laneShape, index, lanes) {
-        var _this4$shape$get = _this4.shape.get('size'),
-          width = _this4$shape$get.width,
-          height = _this4$shape$get.height;
+        var _this5$shape$get = _this5.shape.get('size'),
+          width = _this5$shape$get.width,
+          height = _this5$shape$get.height;
         var _laneShape$get = laneShape.get('size'),
           laneHeight = _laneShape$get.height;
         var _laneShape$position = laneShape.position({
@@ -47131,17 +47265,17 @@ function elementShouldHaveFlowNodeRef(element) {
       });
     },
     captureChildren: function captureChildren() {
-      var _this5 = this;
-      this.graph.getElements().filter(function (_ref2) {
-        var component = _ref2.component;
-        return component && component !== _this5;
-      }).forEach(function (_ref3) {
-        var component = _ref3.component;
+      var _this6 = this;
+      this.graph.getElements().filter(function (_ref4) {
+        var component = _ref4.component;
+        return component && component !== _this6;
+      }).forEach(function (_ref5) {
+        var component = _ref5.component;
         if (component.node.isBpmnType('bpmn:BoundaryEvent')) {
           return;
         }
-        _this5.shape.embed(component.shape);
-        component.node.pool = _this5.shape;
+        _this6.shape.embed(component.shape);
+        component.node.pool = _this6.shape;
       });
       this.$emit('set-shape-stacking', this.shape);
       this.resizePool(this.shape);
@@ -47156,7 +47290,7 @@ function elementShouldHaveFlowNodeRef(element) {
       });
     },
     resizePool: function resizePool(pool) {
-      var _this6 = this;
+      var _this7 = this;
       this.fitEmbeds();
       var _this$shape$get = this.shape.get('size'),
         width = _this$shape$get.width,
@@ -47165,7 +47299,7 @@ function elementShouldHaveFlowNodeRef(element) {
       this.shape.resize( /* Add labelWidth to ensure elements don't overlap with the pool label */
       Math.max(width, bounds.width), Math.max(height, bounds.height));
       this.shape.getEmbeddedCells().forEach(function (cell) {
-        _this6.expandToFitElement(cell, pool);
+        _this7.expandToFitElement(cell, pool);
       });
       var _this$shape$position = this.shape.position(),
         x = _this$shape$position.x,
@@ -47179,14 +47313,14 @@ function elementShouldHaveFlowNodeRef(element) {
       this.node.diagram.bounds.height = newHeight;
     },
     updateLaneChildren: function updateLaneChildren() {
-      var _this7 = this;
+      var _this8 = this;
       /* Ensure elements in the pool are added to the lanes they are above */
 
       var newLaneRefs = {};
       this.shape.getEmbeddedCells().filter(function (element) {
-        return elementShouldHaveFlowNodeRef(element) && element.component.node.pool === _this7.shape;
+        return elementShouldHaveFlowNodeRef(element) && element.component.node.pool === _this8.shape;
       }).forEach(function (element) {
-        var lane = _this7.graph.findModelsUnderElement(element, {
+        var lane = _this8.graph.findModelsUnderElement(element, {
           searchBy: 'center'
         }).find(function (element) {
           return element.component && element.component.node.type === poolLane_config_id;
@@ -47210,9 +47344,9 @@ function elementShouldHaveFlowNodeRef(element) {
       return this.collaboration.get('participants').length > 0;
     },
     setPoolSize: function setPoolSize(pool) {
-      var _this8 = this;
+      var _this9 = this;
       pool.getEmbeddedCells().forEach(function (cell) {
-        _this8.expandToFitElement(cell, pool);
+        _this9.expandToFitElement(cell, pool);
       });
       var _pool$position = pool.position(),
         x = _pool$position.x,
@@ -47265,8 +47399,8 @@ function elementShouldHaveFlowNodeRef(element) {
 ;
 var pool_component = normalizeComponent(
   pool_poolvue_type_script_lang_js_,
-  poolvue_type_template_id_294eae13_render,
-  poolvue_type_template_id_294eae13_staticRenderFns,
+  poolvue_type_template_id_fbed1670_render,
+  poolvue_type_template_id_fbed1670_staticRenderFns,
   false,
   null,
   null,
@@ -47549,10 +47683,10 @@ var ValidationStatus_component = normalizeComponent(
 )
 
 /* harmony default export */ var ValidationStatus = (ValidationStatus_component.exports);
-;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/modeler/Modeler.vue?vue&type=template&id=7da49550&
+;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/modeler/Modeler.vue?vue&type=template&id=95ee0562&
 
 
-var Modelervue_type_template_id_7da49550_render = function render() {
+var Modelervue_type_template_id_95ee0562_render = function render() {
   var _vm = this,
     _c = _vm._self._c;
   return _c('span', {
@@ -47771,9 +47905,9 @@ var Modelervue_type_template_id_7da49550_render = function render() {
     }
   }) : _vm._e()], 2)], 1);
 };
-var Modelervue_type_template_id_7da49550_staticRenderFns = [];
+var Modelervue_type_template_id_95ee0562_staticRenderFns = [];
 
-;// CONCATENATED MODULE: ./src/components/modeler/Modeler.vue?vue&type=template&id=7da49550&
+;// CONCATENATED MODULE: ./src/components/modeler/Modeler.vue?vue&type=template&id=95ee0562&
 
 ;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/nodes/boundaryEvent/boundaryEvent.vue?vue&type=template&id=2979ecac&
 var boundaryEventvue_type_template_id_2979ecac_render = function render() {
@@ -48365,8 +48499,9 @@ external_vue_default().use(vuex_esm);
   },
   actions: {
     getUserPinnedObjects: function getUserPinnedObjects(_ref) {
+      var _window$ProcessMaker, _window$ProcessMaker$;
       var commit = _ref.commit;
-      if (!window.ProcessMaker.user) {
+      if (((_window$ProcessMaker = window.ProcessMaker) === null || _window$ProcessMaker === void 0 ? void 0 : (_window$ProcessMaker$ = _window$ProcessMaker.user) === null || _window$ProcessMaker$ === void 0 ? void 0 : _window$ProcessMaker$.id) === 'standalone') {
         // For standalone version of Modeler
         var pinnedNodes = localStorage.pinnedNodes ? JSON.parse(localStorage.pinnedNodes) : [];
         pinnedNodes.forEach(function (node) {
@@ -48386,11 +48521,12 @@ external_vue_default().use(vuex_esm);
       });
     },
     addUserPinnedObject: function addUserPinnedObject(_ref3, pinnedNode) {
+      var _window$ProcessMaker2, _window$ProcessMaker3;
       var commit = _ref3.commit,
         state = _ref3.state;
       commit('setPinnedNodes', pinnedNode);
       var pinnedNodes = state.pinnedNodeTypes;
-      if (!window.ProcessMaker.user) {
+      if (((_window$ProcessMaker2 = window.ProcessMaker) === null || _window$ProcessMaker2 === void 0 ? void 0 : (_window$ProcessMaker3 = _window$ProcessMaker2.user) === null || _window$ProcessMaker3 === void 0 ? void 0 : _window$ProcessMaker3.id) === 'standalone') {
         // For standalone version of Modeler
         localStorage.pinnedNodes = JSON.stringify(pinnedNodes);
         return;
@@ -48404,11 +48540,12 @@ external_vue_default().use(vuex_esm);
       });
     },
     removeUserPinnedObject: function removeUserPinnedObject(_ref4, nodeToUnpin) {
+      var _window$ProcessMaker4, _window$ProcessMaker5;
       var commit = _ref4.commit,
         state = _ref4.state;
       commit('setUnpinNode', nodeToUnpin);
       var pinnedNodes = state.pinnedNodeTypes;
-      if (!window.ProcessMaker.user) {
+      if (((_window$ProcessMaker4 = window.ProcessMaker) === null || _window$ProcessMaker4 === void 0 ? void 0 : (_window$ProcessMaker5 = _window$ProcessMaker4.user) === null || _window$ProcessMaker5 === void 0 ? void 0 : _window$ProcessMaker5.id) === 'standalone') {
         // For standalone version of Modeler
         localStorage.pinnedNodes = JSON.stringify(pinnedNodes);
         return;
@@ -52068,9 +52205,9 @@ var ValidatePanel_component = normalizeComponent(
 
 
 
-;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/topRail/multiplayerViewUsers/MultiplayerViewUsers.vue?vue&type=template&id=4e79eacd&
+;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/topRail/multiplayerViewUsers/MultiplayerViewUsers.vue?vue&type=template&id=7a85ab32&
 
-var MultiplayerViewUsersvue_type_template_id_4e79eacd_render = function render() {
+var MultiplayerViewUsersvue_type_template_id_7a85ab32_render = function render() {
   var _vm = this,
     _c = _vm._self._c;
   return _c('b-avatar-group', {
@@ -52086,9 +52223,9 @@ var MultiplayerViewUsersvue_type_template_id_4e79eacd_render = function render()
     })];
   })], 2);
 };
-var MultiplayerViewUsersvue_type_template_id_4e79eacd_staticRenderFns = [];
+var MultiplayerViewUsersvue_type_template_id_7a85ab32_staticRenderFns = [];
 
-;// CONCATENATED MODULE: ./src/components/topRail/multiplayerViewUsers/MultiplayerViewUsers.vue?vue&type=template&id=4e79eacd&
+;// CONCATENATED MODULE: ./src/components/topRail/multiplayerViewUsers/MultiplayerViewUsers.vue?vue&type=template&id=7a85ab32&
 
 ;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/topRail/multiplayerViewUsers/avatar/Avatar.vue?vue&type=template&id=1c50a604&scoped=true&
 var Avatarvue_type_template_id_1c50a604_scoped_true_render = function render() {
@@ -52281,7 +52418,8 @@ var Avatar_component = normalizeComponent(
     filteredPlayers: function filteredPlayers() {
       var allPlayers = (0,external_lodash_.uniqBy)(this.players, 'name');
       return allPlayers.filter(function (player) {
-        return player.name.toLowerCase() !== window.ProcessMaker.user.fullName.toLowerCase();
+        var _window$ProcessMaker$;
+        return player.name.toLowerCase() !== ((_window$ProcessMaker$ = window.ProcessMaker.user) === null || _window$ProcessMaker$ === void 0 ? void 0 : _window$ProcessMaker$.fullName.toLowerCase());
       });
     }
   }
@@ -52298,8 +52436,8 @@ var Avatar_component = normalizeComponent(
 ;
 var MultiplayerViewUsers_component = normalizeComponent(
   multiplayerViewUsers_MultiplayerViewUsersvue_type_script_lang_js_,
-  MultiplayerViewUsersvue_type_template_id_4e79eacd_render,
-  MultiplayerViewUsersvue_type_template_id_4e79eacd_staticRenderFns,
+  MultiplayerViewUsersvue_type_template_id_7a85ab32_render,
+  MultiplayerViewUsersvue_type_template_id_7a85ab32_staticRenderFns,
   false,
   null,
   null,
@@ -54564,8 +54702,8 @@ var RailBottom_component = normalizeComponent(
 )
 
 /* harmony default export */ var RailBottom = (RailBottom_component.exports);
-;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/nodes/genericFlow/genericFlow.vue?vue&type=template&id=22431668&
-var genericFlowvue_type_template_id_22431668_render = function render() {
+;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/nodes/genericFlow/genericFlow.vue?vue&type=template&id=4a213ae8&
+var genericFlowvue_type_template_id_4a213ae8_render = function render() {
   var _vm = this,
     _c = _vm._self._c;
   return _c('crown-config', _vm._g({
@@ -54584,8 +54722,10 @@ var genericFlowvue_type_template_id_22431668_render = function render() {
     }
   }, _vm.$listeners));
 };
-var genericFlowvue_type_template_id_22431668_staticRenderFns = [];
+var genericFlowvue_type_template_id_4a213ae8_staticRenderFns = [];
 
+// EXTERNAL MODULE: ./node_modules/core-js/modules/web.url.to-json.js
+var web_url_to_json = __webpack_require__(83753);
 ;// CONCATENATED MODULE: ./src/components/nodes/genericFlow/DataOutputAssociation.js
 
 
@@ -54753,16 +54893,6 @@ var BpmnFlows = [{
       var flow = new bpmnFlow.factory(this.nodeRegistry, this.moddle, this.paper);
       var genericLink = this.shape.findView(this.paper);
       var waypoint = [genericLink.sourceAnchor.toJSON(), genericLink.targetAnchor.toJSON()];
-      // Multiplayer hook
-      if (this.$parent.isMultiplayer) {
-        window.ProcessMaker.EventBus.$emit('multiplayer-addFlow', {
-          type: bpmnFlow.type,
-          id: "node_".concat(this.$parent.nodeIdGenerator.getDefinitionNumber()),
-          sourceRefId: this.sourceNode.definition.id,
-          targetRefId: this.targetNode.definition.id,
-          waypoint: waypoint
-        });
-      }
       this.$emit('replace-generic-flow', {
         actualFlow: flow.makeFlowNode(this.sourceShape, this.target, waypoint),
         genericFlow: this.node,
@@ -54801,8 +54931,8 @@ var BpmnFlows = [{
 ;
 var genericFlow_component = normalizeComponent(
   genericFlow_genericFlowvue_type_script_lang_js_,
-  genericFlowvue_type_template_id_22431668_render,
-  genericFlowvue_type_template_id_22431668_staticRenderFns,
+  genericFlowvue_type_template_id_4a213ae8_render,
+  genericFlowvue_type_template_id_4a213ae8_staticRenderFns,
   false,
   null,
   null,
@@ -54811,8 +54941,8 @@ var genericFlow_component = normalizeComponent(
 )
 
 /* harmony default export */ var genericFlow = (genericFlow_component.exports);
-;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/modeler/Selection.vue?vue&type=template&id=423da30e&scoped=true&
-var Selectionvue_type_template_id_423da30e_scoped_true_render = function render() {
+;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/modeler/Selection.vue?vue&type=template&id=1d953204&scoped=true&
+var Selectionvue_type_template_id_1d953204_scoped_true_render = function render() {
   var _vm = this,
     _c = _vm._self._c;
   return _vm.showLasso && _vm.style ? _c('div', {
@@ -54842,7 +54972,7 @@ var Selectionvue_type_template_id_423da30e_scoped_true_render = function render(
     }
   }, _vm.$listeners))], 1) : _vm._e();
 };
-var Selectionvue_type_template_id_423da30e_scoped_true_staticRenderFns = [];
+var Selectionvue_type_template_id_1d953204_scoped_true_staticRenderFns = [];
 
 ;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/crown/crownMultiselect/crownMultiselect.vue?vue&type=template&id=bcd827ec&scoped=true&
 
@@ -56349,7 +56479,7 @@ var crownMultiselect_component = normalizeComponent(
               _this5.overPoolStopDrag();
               _this5.updateSelectionBox();
               if (_this5.isMultiplayer) {
-                window.ProcessMaker.EventBus.$emit('multiplayer-updateNodes', _this5.getProperties());
+                window.ProcessMaker.EventBus.$emit('multiplayer-updateNodes', _this5.getProperties(_this5.selected));
               }
             case 9:
             case "end":
@@ -56358,17 +56488,46 @@ var crownMultiselect_component = normalizeComponent(
         }, _callee3);
       }))();
     },
-    getProperties: function getProperties() {
+    getProperties: function getProperties(shapes) {
+      var _this6 = this;
       var changed = [];
       var shapesToNotTranslate = ['PoolLane', 'standard.Link', 'processmaker.components.nodes.boundaryEvent.Shape'];
-      this.selected.filter(function (shape) {
+      shapes.filter(function (shape) {
         return !shapesToNotTranslate.includes(shape.model.get('type'));
       }).forEach(function (shape) {
+        if (shape.model.get('type') === 'processmaker.modeler.bpmn.pool') {
+          var children = shape.model.component.getElementsUnderArea(shape.model, _this6.graph);
+          changed = [].concat(_toConsumableArray(changed), _toConsumableArray(_this6.getContainerProperties(children, changed)));
+        } else {
+          var _node$pool;
+          var node = shape.model.component.node;
+          var defaultData = {
+            id: node.definition.id,
+            properties: {
+              x: shape.model.get('position').x,
+              y: shape.model.get('position').y,
+              height: shape.model.get('size').height,
+              width: shape.model.get('size').width
+            }
+          };
+          if (node !== null && node !== void 0 && (_node$pool = node.pool) !== null && _node$pool !== void 0 && _node$pool.component) {
+            defaultData['poolId'] = node.pool.component.id;
+          }
+          changed.push(defaultData);
+        }
+      });
+      return changed;
+    },
+    getContainerProperties: function getContainerProperties(children) {
+      var changed = [];
+      children.forEach(function (model) {
         changed.push({
-          id: shape.model.component.node.definition.id,
+          id: model.component.node.definition.id,
           properties: {
-            clientX: shape.model.get('position').x,
-            clientY: shape.model.get('position').y
+            x: model.get('position').x,
+            y: model.get('position').y,
+            height: model.get('size').height,
+            width: model.get('size').width
           }
         });
       });
@@ -56571,39 +56730,39 @@ var crownMultiselect_component = normalizeComponent(
      * Stop dragging elements that are in a pool
      */
     overPoolStopDrag: function overPoolStopDrag() {
-      var _this6 = this;
+      var _this7 = this;
       return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4() {
         return _regeneratorRuntime().wrap(function _callee4$(_context4) {
           while (1) switch (_context4.prev = _context4.next) {
             case 0:
-              if (!_this6.isNotPoolChilds(_this6.selected)) {
+              if (!_this7.isNotPoolChilds(_this7.selected)) {
                 _context4.next = 4;
                 break;
               }
-              _this6.updateFlowsWaypoint();
-              _this6.$emit('save-state');
+              _this7.updateFlowsWaypoint();
+              _this7.$emit('save-state');
               return _context4.abrupt("return");
             case 4:
-              if (_this6.isOutOfThePool) {
-                _this6.rollbackSelection();
-                if (_this6.invalidPool) {
-                  _this6.invalidPool.model.component.shape.attr('body/fill', poolColor);
-                  _this6.invalidPool = null;
+              if (_this7.isOutOfThePool) {
+                _this7.rollbackSelection();
+                if (_this7.invalidPool) {
+                  _this7.invalidPool.model.component.shape.attr('body/fill', poolColor);
+                  _this7.invalidPool = null;
                 }
               } else {
-                _this6.updateFlowsWaypoint();
-                if (_this6.newPool) {
+                _this7.updateFlowsWaypoint();
+                if (_this7.newPool) {
                   /* Remove the shape from its current pool */
-                  _this6.moveElements(_this6.selected, _this6.oldPool, _this6.newPool);
-                  _this6.moveConectedLinks(_this6.conectedLinks, _this6.oldPool, _this6.newPool);
-                  _this6.newPool = null;
-                  _this6.oldPool = null;
-                  _this6.updateLaneChildren(_this6.selected);
-                  _this6.$emit('save-state');
+                  _this7.moveElements(_this7.selected, _this7.oldPool, _this7.newPool);
+                  _this7.moveConectedLinks(_this7.conectedLinks, _this7.oldPool, _this7.newPool);
+                  _this7.newPool = null;
+                  _this7.oldPool = null;
+                  _this7.updateLaneChildren(_this7.selected);
+                  _this7.$emit('save-state');
                 } else {
-                  _this6.expandToFitElement(_this6.selected);
-                  _this6.updateLaneChildren(_this6.selected);
-                  _this6.$emit('save-state');
+                  _this7.expandToFitElement(_this7.selected);
+                  _this7.updateLaneChildren(_this7.selected);
+                  _this7.$emit('save-state');
                 }
               }
             case 5:
@@ -56617,35 +56776,35 @@ var crownMultiselect_component = normalizeComponent(
      * Rollback drag an element outside it's pool parent
      */
     rollbackSelection: function rollbackSelection() {
-      var _this7 = this;
+      var _this8 = this;
       return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee5() {
         var deltaX, deltaY, scale, shapesToNotTranslate;
         return _regeneratorRuntime().wrap(function _callee5$(_context5) {
           while (1) switch (_context5.prev = _context5.next) {
             case 0:
-              deltaX = _this7.initialPosition.left - _this7.left;
-              deltaY = _this7.initialPosition.top - _this7.top;
-              _this7.style.left = "".concat(_this7.initialPosition.left, "px");
-              _this7.style.top = "".concat(_this7.initialPosition.top, "px");
-              scale = _this7.paperManager.paper.scale();
+              deltaX = _this8.initialPosition.left - _this8.left;
+              deltaY = _this8.initialPosition.top - _this8.top;
+              _this8.style.left = "".concat(_this8.initialPosition.left, "px");
+              _this8.style.top = "".concat(_this8.initialPosition.top, "px");
+              scale = _this8.paperManager.paper.scale();
               shapesToNotTranslate = ['PoolLane', 'standard.Link', 'processmaker.components.nodes.boundaryEvent.Shape'];
-              _this7.selected.filter(function (shape) {
+              _this8.selected.filter(function (shape) {
                 return !shapesToNotTranslate.includes(shape.model.get('type'));
               }).forEach(function (shape) {
                 shape.model.translate(deltaX / scale.sx, deltaY / scale.sy);
               });
-              _this7.isOutOfThePool = false;
+              _this8.isOutOfThePool = false;
               _context5.next = 10;
               return store.commit('allowSavingElementPosition');
             case 10:
-              _this7.paperManager.setStateValid();
+              _this8.paperManager.setStateValid();
               _context5.next = 13;
-              return _this7.$nextTick();
+              return _this8.$nextTick();
             case 13:
               _context5.next = 15;
-              return _this7.paperManager.awaitScheduledUpdates();
+              return _this8.paperManager.awaitScheduledUpdates();
             case 15:
-              _this7.updateSelectionBox(true);
+              _this8.updateSelectionBox(true);
             case 16:
             case "end":
               return _context5.stop();
@@ -56757,9 +56916,9 @@ var crownMultiselect_component = normalizeComponent(
 });
 ;// CONCATENATED MODULE: ./src/components/modeler/Selection.vue?vue&type=script&lang=js&
  /* harmony default export */ var modeler_Selectionvue_type_script_lang_js_ = (Selectionvue_type_script_lang_js_); 
-// EXTERNAL MODULE: ./node_modules/vue-style-loader/index.js??clonedRuleSet-55.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-55.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/stylePostLoader.js!./node_modules/@vue/cli-service/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-55.use[2]!./node_modules/@vue/cli-service/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-55.use[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/modeler/Selection.vue?vue&type=style&index=0&id=423da30e&prod&scoped=true&lang=css&
-var Selectionvue_type_style_index_0_id_423da30e_prod_scoped_true_lang_css_ = __webpack_require__(38479);
-;// CONCATENATED MODULE: ./src/components/modeler/Selection.vue?vue&type=style&index=0&id=423da30e&prod&scoped=true&lang=css&
+// EXTERNAL MODULE: ./node_modules/vue-style-loader/index.js??clonedRuleSet-55.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-55.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/stylePostLoader.js!./node_modules/@vue/cli-service/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-55.use[2]!./node_modules/@vue/cli-service/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-55.use[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/modeler/Selection.vue?vue&type=style&index=0&id=1d953204&prod&scoped=true&lang=css&
+var Selectionvue_type_style_index_0_id_1d953204_prod_scoped_true_lang_css_ = __webpack_require__(67491);
+;// CONCATENATED MODULE: ./src/components/modeler/Selection.vue?vue&type=style&index=0&id=1d953204&prod&scoped=true&lang=css&
 
 ;// CONCATENATED MODULE: ./src/components/modeler/Selection.vue
 
@@ -56772,11 +56931,11 @@ var Selectionvue_type_style_index_0_id_423da30e_prod_scoped_true_lang_css_ = __w
 
 var Selection_component = normalizeComponent(
   modeler_Selectionvue_type_script_lang_js_,
-  Selectionvue_type_template_id_423da30e_scoped_true_render,
-  Selectionvue_type_template_id_423da30e_scoped_true_staticRenderFns,
+  Selectionvue_type_template_id_1d953204_scoped_true_render,
+  Selectionvue_type_template_id_1d953204_scoped_true_staticRenderFns,
   false,
   null,
-  "423da30e",
+  "1d953204",
   null
   
 )
@@ -75347,22 +75506,6 @@ var Room = /*#__PURE__*/function () {
 
 
 
-
-
-
-var multiplayer_BpmnFlows = [{
-  type: 'processmaker-modeler-text-annotation',
-  factory: DataOutputAssociation
-}, {
-  type: 'processmaker-modeler-sequence-flow',
-  factory: SequenceFlow
-}, {
-  type: 'processmaker-modeler-message-flow',
-  factory: MessageFlow
-}, {
-  type: 'processmaker-modeler-data-input-association',
-  factory: DataOutputAssociation
-}];
 var _nodeIdGenerator = /*#__PURE__*/new WeakMap();
 var Multiplayer = /*#__PURE__*/function () {
   function Multiplayer(modeler) {
@@ -75387,22 +75530,25 @@ var Multiplayer = /*#__PURE__*/function () {
   _createClass(Multiplayer, [{
     key: "init",
     value: function init() {
-      var _this = this;
+      var _window$ProcessMaker$,
+        _this = this;
       // Get the node id generator
       _classPrivateFieldSet(this, _nodeIdGenerator, getNodeIdGenerator(this.modeler.definitions));
       // Get the room name from the process id
-      this.room = new Room("room-".concat(window.ProcessMaker.modeler.process.id));
+      var processId = (_window$ProcessMaker$ = window.ProcessMaker.modeler.process.uuid) !== null && _window$ProcessMaker$ !== void 0 ? _window$ProcessMaker$ : window.ProcessMaker.modeler.process.id;
+      this.room = new Room("room-".concat(processId));
 
       // Connect to websocket server
       this.clientIO = esm_lookup(window.ProcessMaker.multiplayer.host, {
         transports: ['websocket', 'polling']
       });
       this.clientIO.on('connect', function () {
+        var _window$ProcessMaker$2, _window$ProcessMaker$3;
         // Join the room
         _this.clientIO.emit('joinRoom', {
           roomName: _this.room.getRoom(),
-          clientName: window.ProcessMaker.user.fullName,
-          clientAvatar: window.ProcessMaker.user.avatar
+          clientName: (_window$ProcessMaker$2 = window.ProcessMaker.user) === null || _window$ProcessMaker$2 === void 0 ? void 0 : _window$ProcessMaker$2.fullName,
+          clientAvatar: (_window$ProcessMaker$3 = window.ProcessMaker.user) === null || _window$ProcessMaker$3 === void 0 ? void 0 : _window$ProcessMaker$3.avatar
         });
       });
       this.clientIO.on('clientJoined', function (payload) {
@@ -75496,14 +75642,14 @@ var Multiplayer = /*#__PURE__*/function () {
       window.ProcessMaker.EventBus.$on('multiplayer-addFlow', function (data) {
         _this.addFlow(data);
       });
+      window.ProcessMaker.EventBus.$on('multiplayer-addLanes', function (lanes) {
+        _this.addLaneNodes(lanes);
+      });
     }
   }, {
     key: "addNode",
     value: function addNode(data) {
-      // Add the new element to the process
-      this.createShape(data);
       // Add the new element to the shared array
-      // this.yArray.push([data]);
       var yMapNested = new YMap();
       this.doTransact(yMapNested, data);
       this.yArray.push([yMapNested]);
@@ -75515,21 +75661,20 @@ var Multiplayer = /*#__PURE__*/function () {
   }, {
     key: "createShape",
     value: function createShape(value) {
-      this.modeler.handleDropProcedure(value, false);
+      if (this.modeler.nodeRegistry[value.type] && this.modeler.nodeRegistry[value.type].multiplayerClient) {
+        this.modeler.nodeRegistry[value.type].multiplayerClient(this.modeler, value);
+      } else {
+        this.modeler.addRemoteNode(value);
+      }
       _classPrivateFieldGet(this, _nodeIdGenerator).updateCounters();
     }
   }, {
     key: "createRemoteShape",
     value: function createRemoteShape(changes) {
       var _this2 = this;
-      var flows = ['processmaker-modeler-sequence-flow', 'processmaker-modeler-text-annotation', 'processmaker-modeler-message-flow', 'processmaker-modeler-data-input-association'];
       return new Promise(function (resolve) {
         changes.map(function (data) {
-          if (flows.includes(data.type)) {
-            _this2.createFlow(data);
-          } else {
-            _this2.createShape(data);
-          }
+          _this2.createShape(data);
         });
         resolve();
       });
@@ -75538,18 +75683,20 @@ var Multiplayer = /*#__PURE__*/function () {
     key: "removeNode",
     value: function removeNode(data) {
       var index = this.getIndex(data.definition.id);
-      this.removeShape(data);
-      this.yArray.delete(index, 1); // delete one element
-
-      // Encode the state as an update and send it to the server
-      var stateUpdate = encodeStateAsUpdate(this.yDoc);
-      // Send the update to the web socket server
-      this.clientIO.emit('removeElement', stateUpdate);
+      if (index >= 0) {
+        this.removeShape(data);
+        this.yArray.delete(index, 1); // delete one element
+        // Encode the state as an update and send it to the server
+        var stateUpdate = encodeStateAsUpdate(this.yDoc);
+        // Send the update to the web socket server
+        this.clientIO.emit('removeElement', stateUpdate);
+      }
     }
   }, {
     key: "getIndex",
     value: function getIndex(id) {
       var index = -1;
+      var found = false;
       var _iterator = _createForOfIteratorHelper(this.yArray),
         _step;
       try {
@@ -75557,6 +75704,7 @@ var Multiplayer = /*#__PURE__*/function () {
           var value = _step.value;
           index++;
           if (value.get('id') === id) {
+            found = true;
             break;
           }
         }
@@ -75565,7 +75713,7 @@ var Multiplayer = /*#__PURE__*/function () {
       } finally {
         _iterator.f();
       }
-      return index;
+      return found ? index : -1;
     }
   }, {
     key: "getNodeById",
@@ -75596,7 +75744,10 @@ var Multiplayer = /*#__PURE__*/function () {
       data.forEach(function (value) {
         var index = _this3.getIndex(value.id);
         var nodeToUpdate = _this3.yArray.get(index);
-        _this3.doTransact(nodeToUpdate, value.properties);
+        var updateData = value.poolId ? _objectSpread2(_objectSpread2({}, value.properties), {
+          poolId: value.poolId
+        }) : value.properties;
+        _this3.doTransact(nodeToUpdate, updateData);
       });
     }
   }, {
@@ -75607,13 +75758,11 @@ var Multiplayer = /*#__PURE__*/function () {
       var nodeToUpdate = this.yArray.get(index);
       // Update the node id in the nodeData
       nodeData.id = "node_".concat(_classPrivateFieldGet(this, _nodeIdGenerator).getDefinitionNumber());
-      // Replace the node in the process
-      this.modeler.replaceNodeProcedure(nodeData, true);
       // Update the node id generator
       _classPrivateFieldGet(this, _nodeIdGenerator).updateCounters();
       // Update the node in the shared array
       this.yDoc.transact(function () {
-        nodeToUpdate.set('control', newControl);
+        nodeToUpdate.set('type', newControl);
         nodeToUpdate.set('id', nodeData.id);
       });
 
@@ -75627,14 +75776,17 @@ var Multiplayer = /*#__PURE__*/function () {
   }, {
     key: "replaceShape",
     value: function replaceShape(updatedNode) {
+      var _this$modeler$paper$l = this.modeler.paper.localToClientPoint(updatedNode),
+        clientX = _this$modeler$paper$l.x,
+        clientY = _this$modeler$paper$l.y;
       // Get the node to update
       var node = this.getNodeById(updatedNode.oldNodeId);
       // Update the node id in the nodeData
       var nodeData = {
-        clientX: updatedNode.clientX,
-        clientY: updatedNode.clientY,
+        clientX: clientX,
+        clientY: clientY,
         control: {
-          type: updatedNode.control.type
+          type: updatedNode.type
         },
         nodeThatWillBeReplaced: node,
         id: updatedNode.id
@@ -75665,37 +75817,45 @@ var Multiplayer = /*#__PURE__*/function () {
     }
   }, {
     key: "updateShapes",
-    value: function updateShapes(data) {
-      var paper = this.modeler.paper;
-      var element = this.getJointElement(paper.model, data.id);
-      // Update the element's position attribute
-      element.set('position', {
-        x: data.clientX,
-        y: data.clientY
-      });
-      // Trigger a rendering of the element on the paper
-      paper.findViewByModel(element).update();
-    }
-  }, {
-    key: "getJointElement",
-    value: function getJointElement(graph, targetValue) {
-      var cells = graph.getCells();
-      var _iterator2 = _createForOfIteratorHelper(cells),
-        _step2;
-      try {
-        for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
-          var cell = _step2.value;
-          if (cell.component.id === targetValue) {
-            return cell;
+    value: function () {
+      var _updateShapes = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(data) {
+        var paper, element, newPool;
+        return _regeneratorRuntime().wrap(function _callee2$(_context2) {
+          while (1) switch (_context2.prev = _context2.next) {
+            case 0:
+              paper = this.modeler.paper;
+              element = this.modeler.getElementByNodeId(data.id);
+              newPool = this.modeler.getElementByNodeId(data.poolId); // Update the element's position attribute
+              element.resize( /* Add labelWidth to ensure elements don't overlap with the pool label */
+              data.width, data.height);
+              element.set('position', {
+                x: data.x,
+                y: data.y
+              });
+              // Trigger a rendering of the element on the paper
+              _context2.next = 7;
+              return paper.findViewByModel(element).update();
+            case 7:
+              _context2.next = 9;
+              return element.component.$nextTick();
+            case 9:
+              _context2.next = 11;
+              return this.modeler.paperManager.awaitScheduledUpdates();
+            case 11:
+              if (newPool && element.component.node.pool && element.component.node.pool.component.id !== data.poolId) {
+                element.component.node.pool.component.moveElementRemote(element, newPool);
+              }
+            case 12:
+            case "end":
+              return _context2.stop();
           }
-        }
-      } catch (err) {
-        _iterator2.e(err);
-      } finally {
-        _iterator2.f();
+        }, _callee2, this);
+      }));
+      function updateShapes(_x2) {
+        return _updateShapes.apply(this, arguments);
       }
-      return null; // Return null if no matching element is found
-    }
+      return updateShapes;
+    }()
   }, {
     key: "addFlow",
     value: function addFlow(data) {
@@ -75709,21 +75869,54 @@ var Multiplayer = /*#__PURE__*/function () {
       _classPrivateFieldGet(this, _nodeIdGenerator).updateCounters();
     }
   }, {
-    key: "createFlow",
-    value: function createFlow(data) {
-      var paper = this.modeler.paper;
-      var sourceElem = this.getJointElement(paper.model, data.sourceRefId);
-      var targetElem = this.getJointElement(paper.model, data.targetRefId);
-      if (sourceElem && targetElem) {
-        var bpmnFlow = multiplayer_BpmnFlows.find(function (FlowClass) {
-          return FlowClass.type === data.type;
+    key: "addLaneNodes",
+    value: function addLaneNodes(lanes) {
+      var _this4 = this;
+      var pool = this.getPool(lanes);
+      window.ProcessMaker.EventBus.$emit('multiplayer-updateNodes', [{
+        id: pool.component.node.definition.id,
+        properties: {
+          x: pool.component.node.diagram.bounds.x,
+          y: pool.component.node.diagram.bounds.y,
+          height: pool.component.node.diagram.bounds.height,
+          width: pool.component.node.diagram.bounds.width,
+          isAddingLaneAbove: pool.isAddingLaneAbove
+        }
+      }]);
+      this.yDoc.transact(function () {
+        lanes.forEach(function (lane) {
+          var yMapNested = new YMap();
+          var data = _this4.prepareLaneData(lane);
+          _this4.doTransact(yMapNested, data);
+          _this4.yArray.push([yMapNested]);
+          var stateUpdate = encodeStateAsUpdate(_this4.yDoc);
+          _this4.clientIO.emit('createElement', stateUpdate);
         });
-        var flow = new bpmnFlow.factory(this.modeler.nodeRegistry, this.modeler.moddle, this.modeler.paper);
-        var actualFlow = flow.makeFlowNode(sourceElem, targetElem, data.waypoint);
-        // add Nodes
-        this.modeler.addNode(actualFlow, data.id);
-        _classPrivateFieldGet(this, _nodeIdGenerator).updateCounters();
+      });
+    }
+  }, {
+    key: "prepareLaneData",
+    value: function prepareLaneData(lane) {
+      var data = {
+        type: lane.type,
+        id: lane.definition.id,
+        name: lane.definition.name,
+        x: lane.diagram.bounds.x,
+        y: lane.diagram.bounds.y,
+        width: lane.diagram.bounds.width,
+        height: lane.diagram.bounds.height,
+        poolId: lane.pool.component.node.definition.id,
+        laneSetId: lane.pool.component.laneSet.id
+      };
+      return data;
+    }
+  }, {
+    key: "getPool",
+    value: function getPool(lanes) {
+      if (lanes && lanes.length > 0) {
+        return lanes[0].pool;
       }
+      return false;
     }
   }]);
   return Multiplayer;
@@ -76192,6 +76385,12 @@ var Multiplayer = /*#__PURE__*/function () {
         return _this4.paper.findViewByModel(shape);
       });
     },
+    getElementByNodeId: function getElementByNodeId(id) {
+      var cells = this.paper.model.getCells();
+      return cells.find(function (cell) {
+        return cell.component && cell.component.id === id;
+      });
+    },
     close: function close() {
       var _this5 = this;
       return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4() {
@@ -76856,71 +77055,83 @@ var Multiplayer = /*#__PURE__*/function () {
         control: control
       });
     },
-    handleDrop: function handleDrop(data) {
-      var clientX = data.clientX,
-        clientY = data.clientY,
-        control = data.control;
-      if (this.isMultiplayer) {
-        window.ProcessMaker.EventBus.$emit('multiplayer-addNode', {
-          clientX: clientX,
-          clientY: clientY,
-          control: control,
-          id: "node_".concat(this.nodeIdGenerator.getDefinitionNumber())
-        });
-      } else {
-        this.handleDropProcedure(data);
-      }
-    },
-    handleDropProcedure: function handleDropProcedure(data) {
-      var _arguments4 = arguments,
-        _this26 = this;
+    addRemoteNode: function addRemoteNode(data) {
+      var _this26 = this;
       return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee13() {
-        var selected, clientX, clientY, control, nodeThatWillBeReplaced, id, definition, diagram, _this26$paperManager$, x, y, newNode, nodeMigrator;
+        var definition, diagram, newNode;
         return _regeneratorRuntime().wrap(function _callee13$(_context13) {
           while (1) switch (_context13.prev = _context13.next) {
             case 0:
-              selected = _arguments4.length > 1 && _arguments4[1] !== undefined ? _arguments4[1] : true;
-              clientX = data.clientX, clientY = data.clientY, control = data.control, nodeThatWillBeReplaced = data.nodeThatWillBeReplaced, id = data.id;
-              _this26.validateDropTarget({
+              definition = _this26.nodeRegistry[data.type].definition(_this26.moddle, _this26.$t);
+              diagram = _this26.nodeRegistry[data.type].diagram(_this26.moddle);
+              diagram.bounds.x = data.x;
+              diagram.bounds.y = data.y;
+              newNode = _this26.createNode(data.type, definition, diagram);
+              _context13.next = 7;
+              return _this26.addNode(newNode, data.id, true);
+            case 7:
+              _context13.next = 9;
+              return _this26.$nextTick();
+            case 9:
+              _context13.next = 11;
+              return _this26.paperManager.awaitScheduledUpdates();
+            case 11:
+              if (_this26.autoValidate) {
+                _this26.validateBpmnDiagram();
+              }
+            case 12:
+            case "end":
+              return _context13.stop();
+          }
+        }, _callee13);
+      }))();
+    },
+    handleDrop: function handleDrop(data) {
+      var _this27 = this;
+      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee14() {
+        var clientX, clientY, control, nodeThatWillBeReplaced, definition, diagram, _this27$paperManager$, x, y, newNode, nodeMigrator;
+        return _regeneratorRuntime().wrap(function _callee14$(_context14) {
+          while (1) switch (_context14.prev = _context14.next) {
+            case 0:
+              clientX = data.clientX, clientY = data.clientY, control = data.control, nodeThatWillBeReplaced = data.nodeThatWillBeReplaced;
+              _this27.validateDropTarget({
                 clientX: clientX,
                 clientY: clientY,
                 control: control
               });
-              if (_this26.allowDrop) {
-                _context13.next = 5;
+              if (_this27.allowDrop) {
+                _context14.next = 4;
                 break;
               }
-              return _context13.abrupt("return");
-            case 5:
-              definition = _this26.nodeRegistry[control.type].definition(_this26.moddle, _this26.$t);
-              diagram = _this26.nodeRegistry[control.type].diagram(_this26.moddle);
-              _this26$paperManager$ = _this26.paperManager.clientToGridPoint(clientX, clientY), x = _this26$paperManager$.x, y = _this26$paperManager$.y;
+              return _context14.abrupt("return");
+            case 4:
+              definition = _this27.nodeRegistry[control.type].definition(_this27.moddle, _this27.$t);
+              diagram = _this27.nodeRegistry[control.type].diagram(_this27.moddle);
+              _this27$paperManager$ = _this27.paperManager.clientToGridPoint(clientX, clientY), x = _this27$paperManager$.x, y = _this27$paperManager$.y;
               diagram.bounds.x = x;
               diagram.bounds.y = y;
-              newNode = _this26.createNode(control.type, definition, diagram);
+              newNode = _this27.createNode(control.type, definition, diagram);
               if (newNode.isBpmnType('bpmn:BoundaryEvent')) {
-                _this26.setShapeCenterUnderCursor(diagram);
+                _this27.setShapeCenterUnderCursor(diagram);
               }
-              if (selected) {
-                _this26.highlightNode(newNode);
-              }
-              _context13.next = 15;
-              return _this26.addNode(newNode, id, selected);
-            case 15:
+              _this27.highlightNode(newNode);
+              _context14.next = 14;
+              return _this27.addNode(newNode);
+            case 14:
               if (nodeThatWillBeReplaced) {
-                _context13.next = 17;
+                _context14.next = 16;
                 break;
               }
-              return _context13.abrupt("return");
-            case 17:
-              nodeMigrator = new NodeMigrator(nodeThatWillBeReplaced, definition, _this26.graph, newNode, _this26.processes, _this26.collaboration);
+              return _context14.abrupt("return");
+            case 16:
+              nodeMigrator = new NodeMigrator(nodeThatWillBeReplaced, definition, _this27.graph, newNode, _this27.processes, _this27.collaboration);
               nodeMigrator.migrate();
-              return _context13.abrupt("return", newNode);
-            case 20:
+              return _context14.abrupt("return", newNode);
+            case 19:
             case "end":
-              return _context13.stop();
+              return _context14.stop();
           }
-        }, _callee13);
+        }, _callee14);
       }))();
     },
     setShapeCenterUnderCursor: function setShapeCenterUnderCursor(diagram) {
@@ -76928,236 +77139,273 @@ var Multiplayer = /*#__PURE__*/function () {
       diagram.bounds.y -= diagram.bounds.height / 2;
     },
     selectNewNode: function selectNewNode(node) {
-      var _this27 = this;
-      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee14() {
+      var _this28 = this;
+      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee15() {
         var newNodeComponent, view;
-        return _regeneratorRuntime().wrap(function _callee14$(_context14) {
-          while (1) switch (_context14.prev = _context14.next) {
+        return _regeneratorRuntime().wrap(function _callee15$(_context15) {
+          while (1) switch (_context15.prev = _context15.next) {
             case 0:
-              _context14.next = 2;
-              return _this27.$nextTick();
+              _context15.next = 2;
+              return _this28.$nextTick();
             case 2:
-              _context14.next = 4;
-              return _this27.paperManager.awaitScheduledUpdates();
+              _context15.next = 4;
+              return _this28.paperManager.awaitScheduledUpdates();
             case 4:
-              newNodeComponent = _this27.$refs.nodeComponent.find(function (component) {
+              newNodeComponent = _this28.$refs.nodeComponent.find(function (component) {
                 return component.node === node;
               });
               view = newNodeComponent.shapeView;
-              _context14.next = 8;
-              return _this27.$refs.selector.selectElement(view);
+              _context15.next = 8;
+              return _this28.$refs.selector.selectElement(view);
             case 8:
             case "end":
-              return _context14.stop();
+              return _context15.stop();
           }
-        }, _callee14);
+        }, _callee15);
       }))();
     },
+    multiplayerHook: function multiplayerHook(node, fromClient) {
+      var blackList = ['processmaker-modeler-lane', 'processmaker-modeler-generic-flow', 'processmaker-modeler-sequence-flow', 'processmaker-modeler-association', 'processmaker-modeler-data-input-association', 'processmaker-modeler-data-input-association'];
+      var flowTypes = ['processmaker-modeler-sequence-flow', 'processmaker-modeler-message-flow'];
+      if (!this.isMultiplayer) {
+        return;
+      }
+      if (!fromClient) {
+        if (!blackList.includes(node.type) && !flowTypes.includes(node.type)) {
+          var _node$pool;
+          var defaultData = {
+            x: node.diagram.bounds.x,
+            y: node.diagram.bounds.y,
+            height: node.diagram.bounds.height,
+            width: node.diagram.bounds.width,
+            type: node.type,
+            id: node.definition.id,
+            isAddingLaneAbove: true
+          };
+          if (node !== null && node !== void 0 && (_node$pool = node.pool) !== null && _node$pool !== void 0 && _node$pool.component) {
+            defaultData['poolId'] = node.pool.component.id;
+          }
+          window.ProcessMaker.EventBus.$emit('multiplayer-addNode', defaultData);
+        }
+        if (flowTypes.includes(node.type)) {
+          window.ProcessMaker.EventBus.$emit('multiplayer-addFlow', {
+            id: node.definition.id,
+            type: node.type,
+            sourceRefId: node.definition.sourceRef.id,
+            targetRefId: node.definition.targetRef.id,
+            waypoint: node.diagram.waypoint
+          });
+        }
+      }
+    },
     addNode: function addNode(node) {
-      var _arguments5 = arguments,
-        _this28 = this;
-      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee15() {
-        var id, selected, targetProcess;
-        return _regeneratorRuntime().wrap(function _callee15$(_context15) {
-          while (1) switch (_context15.prev = _context15.next) {
+      var _arguments4 = arguments,
+        _this29 = this;
+      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee16() {
+        var id, fromClient, targetProcess;
+        return _regeneratorRuntime().wrap(function _callee16$(_context16) {
+          while (1) switch (_context16.prev = _context16.next) {
             case 0:
-              id = _arguments5.length > 1 && _arguments5[1] !== undefined ? _arguments5[1] : null;
-              selected = _arguments5.length > 2 && _arguments5[2] !== undefined ? _arguments5[2] : true;
+              id = _arguments4.length > 1 && _arguments4[1] !== undefined ? _arguments4[1] : null;
+              fromClient = _arguments4.length > 2 && _arguments4[2] !== undefined ? _arguments4[2] : false;
               if (!node.pool) {
-                node.pool = _this28.poolTarget;
+                node.pool = _this29.poolTarget;
               }
-              targetProcess = node.getTargetProcess(_this28.processes, _this28.processNode);
+              targetProcess = node.getTargetProcess(_this29.processes, _this29.processNode);
               addNodeToProcess(node, targetProcess);
-              node.setIds(_this28.nodeIdGenerator, id);
-              _this28.planeElements.push(node.diagram);
+              node.setIds(_this29.nodeIdGenerator, id);
+              _this29.planeElements.push(node.diagram);
+              // add multiplayer logic as a hook
+              _this29.multiplayerHook(node, fromClient);
               store.commit('addNode', node);
-              _this28.poolTarget = null;
+              _this29.poolTarget = null;
 
               // add processmaker-modeler-generic-flow
               if (![sequenceFlow_id, poolLane_config_id, association_id, messageFlow_config_id, config_id, dataInputAssociation_config_id, genericFlow_config_id].includes(node.type)) {
-                _context15.next = 11;
+                _context16.next = 12;
                 break;
               }
-              return _context15.abrupt("return");
-            case 11:
-              if (selected) {
+              return _context16.abrupt("return");
+            case 12:
+              if (!fromClient) {
                 // Select the node after it has been added to the store (does not apply to flows)
-                _this28.selectNewNode(node);
+                _this29.selectNewNode(node);
               }
-              return _context15.abrupt("return", new Promise(function (resolve) {
+              return _context16.abrupt("return", new Promise(function (resolve) {
                 setTimeout(function () {
-                  _this28.pushToUndoStack();
+                  _this29.pushToUndoStack();
                   resolve();
                 });
               }));
-            case 13:
+            case 14:
             case "end":
-              return _context15.stop();
+              return _context16.stop();
           }
-        }, _callee15);
+        }, _callee16);
       }))();
     },
     addClonedNodes: function addClonedNodes(nodes) {
-      var _this29 = this;
-      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee16() {
-        return _regeneratorRuntime().wrap(function _callee16$(_context16) {
-          while (1) switch (_context16.prev = _context16.next) {
+      var _this30 = this;
+      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee17() {
+        return _regeneratorRuntime().wrap(function _callee17$(_context17) {
+          while (1) switch (_context17.prev = _context17.next) {
             case 0:
               nodes.forEach(function (node) {
                 if (!node.pool) {
-                  node.pool = _this29.poolTarget;
+                  node.pool = _this30.poolTarget;
                 }
-                var targetProcess = node.getTargetProcess(_this29.processes, _this29.processNode);
+                var targetProcess = node.getTargetProcess(_this30.processes, _this30.processNode);
                 addNodeToProcess(node, targetProcess);
-                _this29.planeElements.push(node.diagram);
+                _this30.planeElements.push(node.diagram);
+                _this30.multiplayerHook(node, false);
                 store.commit('addNode', node);
-                _this29.poolTarget = null;
+                _this30.poolTarget = null;
               });
             case 1:
             case "end":
-              return _context16.stop();
+              return _context17.stop();
           }
-        }, _callee16);
+        }, _callee17);
       }))();
     },
     removeNode: function removeNode(node, options) {
-      var _this30 = this;
-      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee17() {
-        return _regeneratorRuntime().wrap(function _callee17$(_context17) {
-          while (1) switch (_context17.prev = _context17.next) {
+      var _this31 = this;
+      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee18() {
+        return _regeneratorRuntime().wrap(function _callee18$(_context18) {
+          while (1) switch (_context18.prev = _context18.next) {
             case 0:
               // Check if the node is not replaced
-              if (_this30.isMultiplayer && !(options !== null && options !== void 0 && options.isReplaced)) {
+              if (_this31.isMultiplayer && !(options !== null && options !== void 0 && options.isReplaced)) {
                 // Emit event to server to remove node
                 window.ProcessMaker.EventBus.$emit('multiplayer-removeNode', node);
               }
-              _this30.removeNodeProcedure(node, options);
+              _this31.removeNodeProcedure(node, options);
             case 2:
             case "end":
-              return _context17.stop();
+              return _context18.stop();
           }
-        }, _callee17);
+        }, _callee18);
       }))();
     },
     removeNodeProcedure: function removeNodeProcedure(node) {
-      var _arguments6 = arguments,
-        _this31 = this;
-      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee18() {
+      var _arguments5 = arguments,
+        _this32 = this;
+      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee19() {
         var _ref6, _ref6$removeRelations, removeRelationships;
-        return _regeneratorRuntime().wrap(function _callee18$(_context18) {
-          while (1) switch (_context18.prev = _context18.next) {
+        return _regeneratorRuntime().wrap(function _callee19$(_context19) {
+          while (1) switch (_context19.prev = _context19.next) {
             case 0:
-              _ref6 = _arguments6.length > 1 && _arguments6[1] !== undefined ? _arguments6[1] : {}, _ref6$removeRelations = _ref6.removeRelationships, removeRelationships = _ref6$removeRelations === void 0 ? true : _ref6$removeRelations;
+              _ref6 = _arguments5.length > 1 && _arguments5[1] !== undefined ? _arguments5[1] : {}, _ref6$removeRelations = _ref6.removeRelationships, removeRelationships = _ref6$removeRelations === void 0 ? true : _ref6$removeRelations;
               if (node) {
-                _context18.next = 3;
+                _context19.next = 3;
                 break;
               }
-              return _context18.abrupt("return");
+              return _context19.abrupt("return");
             case 3:
               if (removeRelationships) {
-                removeNodeFlows(node, _this31);
-                removeNodeMessageFlows(node, _this31);
-                removeNodeAssociations(node, _this31);
+                removeNodeFlows(node, _this32);
+                removeNodeMessageFlows(node, _this32);
+                removeNodeAssociations(node, _this32);
               }
               removeOutgoingAndIncomingRefsToFlow(node);
-              removeBoundaryEvents(_this31.graph, node, _this31.removeNode);
+              removeBoundaryEvents(_this32.graph, node, _this32.removeNode);
               removeSourceDefault(node);
-              _this31.removeNodesFromLane(node);
-              _this31.removeNodesFromPool(node);
+              _this32.removeNodesFromLane(node);
+              _this32.removeNodesFromPool(node);
               store.commit('removeNode', node);
-              store.commit('highlightNode', _this31.processNode);
-              _this31.$refs.selector.clearSelection();
-              _context18.next = 14;
-              return _this31.$nextTick();
+              store.commit('highlightNode', _this32.processNode);
+              _this32.$refs.selector.clearSelection();
+              _context19.next = 14;
+              return _this32.$nextTick();
             case 14:
-              _context18.next = 16;
-              return _this31.pushToUndoStack();
+              _context19.next = 16;
+              return _this32.pushToUndoStack();
             case 16:
               // force to update the processNode property in every delete
-              _this31.processes = _this31.getProcesses();
-              if (_this31.processes && _this31.processes.length > 0) {
-                _this31.processNode = new Node('processmaker-modeler-process', _this31.processes[0], _this31.planeElements.find(function (diagram) {
-                  return diagram.bpmnElement.id === _this31.processes[0].id;
+              _this32.processes = _this32.getProcesses();
+              if (_this32.processes && _this32.processes.length > 0) {
+                _this32.processNode = new Node('processmaker-modeler-process', _this32.processes[0], _this32.planeElements.find(function (diagram) {
+                  return diagram.bpmnElement.id === _this32.processes[0].id;
                 }));
               }
             case 18:
             case "end":
-              return _context18.stop();
+              return _context19.stop();
           }
-        }, _callee18);
+        }, _callee19);
       }))();
     },
     removeNodes: function removeNodes() {
-      var _this32 = this;
-      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee21() {
-        return _regeneratorRuntime().wrap(function _callee21$(_context21) {
-          while (1) switch (_context21.prev = _context21.next) {
+      var _this33 = this;
+      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee22() {
+        return _regeneratorRuntime().wrap(function _callee22$(_context22) {
+          while (1) switch (_context22.prev = _context22.next) {
             case 0:
-              _context21.next = 2;
-              return _this32.performSingleUndoRedoTransaction( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee20() {
-                return _regeneratorRuntime().wrap(function _callee20$(_context20) {
-                  while (1) switch (_context20.prev = _context20.next) {
+              _context22.next = 2;
+              return _this33.performSingleUndoRedoTransaction( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee21() {
+                return _regeneratorRuntime().wrap(function _callee21$(_context21) {
+                  while (1) switch (_context21.prev = _context21.next) {
                     case 0:
-                      _context20.next = 2;
-                      return _this32.paperManager.performAtomicAction( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee19() {
+                      _context21.next = 2;
+                      return _this33.paperManager.performAtomicAction( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee20() {
                         var waitPromises;
-                        return _regeneratorRuntime().wrap(function _callee19$(_context19) {
-                          while (1) switch (_context19.prev = _context19.next) {
+                        return _regeneratorRuntime().wrap(function _callee20$(_context20) {
+                          while (1) switch (_context20.prev = _context20.next) {
                             case 0:
                               waitPromises = [];
-                              _this32.highlightedNodes.forEach(function (node) {
-                                return waitPromises.push(_this32.removeNode(node, {
+                              _this33.highlightedNodes.forEach(function (node) {
+                                return waitPromises.push(_this33.removeNode(node, {
                                   removeRelationships: true
                                 }));
                               });
-                              _context19.next = 4;
+                              _context20.next = 4;
                               return Promise.all(waitPromises);
                             case 4:
                               store.commit('highlightNode');
                             case 5:
                             case "end":
-                              return _context19.stop();
+                              return _context20.stop();
                           }
-                        }, _callee19);
+                        }, _callee20);
                       })));
                     case 2:
                     case "end":
-                      return _context20.stop();
+                      return _context21.stop();
                   }
-                }, _callee20);
+                }, _callee21);
               })));
             case 2:
             case "end":
-              return _context21.stop();
+              return _context22.stop();
           }
-        }, _callee21);
+        }, _callee22);
       }))();
     },
     replaceNode: function replaceNode(_ref9) {
-      var _this33 = this;
+      var _this34 = this;
       var node = _ref9.node,
         typeToReplaceWith = _ref9.typeToReplaceWith;
-      this.performSingleUndoRedoTransaction( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee23() {
-        return _regeneratorRuntime().wrap(function _callee23$(_context23) {
-          while (1) switch (_context23.prev = _context23.next) {
+      this.performSingleUndoRedoTransaction( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee24() {
+        return _regeneratorRuntime().wrap(function _callee24$(_context24) {
+          while (1) switch (_context24.prev = _context24.next) {
             case 0:
-              _context23.next = 2;
-              return _this33.paperManager.performAtomicAction( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee22() {
-                var _this33$paper$localTo, clientX, clientY, nodeData, nodeTypes, newControl;
-                return _regeneratorRuntime().wrap(function _callee22$(_context22) {
-                  while (1) switch (_context22.prev = _context22.next) {
+              _context24.next = 2;
+              return _this34.paperManager.performAtomicAction( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee23() {
+                var _node$diagram$bounds, x, y, nodeData, nodeTypes, newControl;
+                return _regeneratorRuntime().wrap(function _callee23$(_context23) {
+                  while (1) switch (_context23.prev = _context23.next) {
                     case 0:
-                      _this33$paper$localTo = _this33.paper.localToClientPoint(node.diagram.bounds), clientX = _this33$paper$localTo.x, clientY = _this33$paper$localTo.y;
+                      _node$diagram$bounds = node.diagram.bounds, x = _node$diagram$bounds.x, y = _node$diagram$bounds.y;
                       nodeData = {
-                        clientX: clientX,
-                        clientY: clientY,
+                        x: x,
+                        y: y,
                         control: {
                           type: typeToReplaceWith
                         },
                         nodeThatWillBeReplaced: node
                       };
-                      if (!_this33.isMultiplayer) {
-                        _context22.next = 8;
+                      if (!_this34.isMultiplayer) {
+                        _context23.next = 8;
                         break;
                       }
                       // Get all node types
@@ -77171,81 +77419,81 @@ var Multiplayer = /*#__PURE__*/function () {
                       if (newControl.length === 1) {
                         window.ProcessMaker.EventBus.$emit('multiplayer-replaceNode', {
                           nodeData: nodeData,
-                          newControl: newControl[0]
+                          newControl: newControl[0].type
                         });
                       }
-                      _context22.next = 10;
+                      _context23.next = 10;
                       break;
                     case 8:
-                      _context22.next = 10;
-                      return _this33.replaceNodeProcedure(nodeData);
+                      _context23.next = 10;
+                      return _this34.replaceNodeProcedure(nodeData, true);
                     case 10:
                     case "end":
-                      return _context22.stop();
+                      return _context23.stop();
                   }
-                }, _callee22);
+                }, _callee23);
               })));
             case 2:
             case "end":
-              return _context23.stop();
+              return _context24.stop();
           }
-        }, _callee23);
+        }, _callee24);
       })));
     },
     replaceNodeProcedure: function replaceNodeProcedure(data) {
-      var _arguments7 = arguments,
-        _this34 = this;
-      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee24() {
-        var isReplaced, _this34$paper$localTo, clientX, clientY, newNode;
-        return _regeneratorRuntime().wrap(function _callee24$(_context24) {
-          while (1) switch (_context24.prev = _context24.next) {
+      var _arguments6 = arguments,
+        _this35 = this;
+      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee25() {
+        var isReplaced, _this35$paper$localTo, clientX, clientY, newNode;
+        return _regeneratorRuntime().wrap(function _callee25$(_context25) {
+          while (1) switch (_context25.prev = _context25.next) {
             case 0:
-              isReplaced = _arguments7.length > 1 && _arguments7[1] !== undefined ? _arguments7[1] : false;
+              isReplaced = _arguments6.length > 1 && _arguments6[1] !== undefined ? _arguments6[1] : false;
               if (isReplaced) {
                 // Get the clientX and clientY from the node that will be replaced
-                _this34$paper$localTo = _this34.paper.localToClientPoint(data.nodeThatWillBeReplaced.diagram.bounds), clientX = _this34$paper$localTo.x, clientY = _this34$paper$localTo.y;
+                _this35$paper$localTo = _this35.paper.localToClientPoint(data.nodeThatWillBeReplaced.diagram.bounds), clientX = _this35$paper$localTo.x, clientY = _this35$paper$localTo.y;
                 data.clientX = clientX;
                 data.clientY = clientY;
               }
-              _context24.next = 4;
-              return _this34.handleDropProcedure(data);
+              _context25.next = 4;
+              return _this35.handleDrop(data);
             case 4:
-              newNode = _context24.sent;
-              _context24.next = 7;
-              return _this34.removeNode(data.nodeThatWillBeReplaced, {
+              newNode = _context25.sent;
+              _context25.next = 7;
+              return _this35.removeNode(data.nodeThatWillBeReplaced, {
                 removeRelationships: false,
                 isReplaced: isReplaced
               });
             case 7:
-              _this34.highlightNode(newNode);
-              _this34.selectNewNode(newNode);
+              _this35.highlightNode(newNode);
+              _this35.selectNewNode(newNode);
             case 9:
             case "end":
-              return _context24.stop();
+              return _context25.stop();
           }
-        }, _callee24);
+        }, _callee25);
       }))();
     },
     replaceAiNode: function replaceAiNode(_ref12) {
-      var _this35 = this;
+      var _this36 = this;
       var node = _ref12.node,
         typeToReplaceWith = _ref12.typeToReplaceWith,
         assetId = _ref12.assetId,
         assetName = _ref12.assetName,
         redirectTo = _ref12.redirectTo;
-      this.performSingleUndoRedoTransaction( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee26() {
-        return _regeneratorRuntime().wrap(function _callee26$(_context26) {
-          while (1) switch (_context26.prev = _context26.next) {
+      this.performSingleUndoRedoTransaction( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee27() {
+        return _regeneratorRuntime().wrap(function _callee27$(_context27) {
+          while (1) switch (_context27.prev = _context27.next) {
             case 0:
-              _context26.next = 2;
-              return _this35.paperManager.performAtomicAction( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee25() {
-                var _this35$paper$localTo, clientX, clientY, newNode;
-                return _regeneratorRuntime().wrap(function _callee25$(_context25) {
-                  while (1) switch (_context25.prev = _context25.next) {
+              _context27.next = 2;
+              return _this36.paperManager.performAtomicAction( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee26() {
+                var _this36$paper$localTo, clientX, clientY, newNode;
+                return _regeneratorRuntime().wrap(function _callee26$(_context26) {
+                  while (1) switch (_context26.prev = _context26.next) {
                     case 0:
-                      _this35$paper$localTo = _this35.paper.localToClientPoint(node.diagram.bounds), clientX = _this35$paper$localTo.x, clientY = _this35$paper$localTo.y;
-                      _context25.next = 3;
-                      return _this35.handleDropProcedure({
+                      _this36$paper$localTo = _this36.paper.localToClientPoint(node.diagram.bounds), clientX = _this36$paper$localTo.x, clientY = _this36$paper$localTo.y;
+                      _context26.next = 3;
+                      return _this36.handleDrop({
                         clientX: clientX,
                         clientY: clientY,
                         control: {
@@ -77254,7 +77502,7 @@ var Multiplayer = /*#__PURE__*/function () {
                         nodeThatWillBeReplaced: node
                       });
                     case 3:
-                      newNode = _context25.sent;
+                      newNode = _context26.sent;
                       if (typeToReplaceWith === 'processmaker-modeler-task') {
                         newNode.definition.screenRef = assetId;
                         newNode.definition.name = assetName;
@@ -77269,95 +77517,95 @@ var Multiplayer = /*#__PURE__*/function () {
                         newNode.definition.config = "{\"calledElement\":\"ProcessId-".concat(assetId, "\",\"processId\":").concat(assetId, ",\"startEvent\":\"node_1\",\"name\":\"").concat(assetName, "\"}");
                         redirectTo = "".concat(redirectTo, "/").concat(newNode.id);
                       }
-                      _context25.next = 9;
-                      return _this35.removeNode(node, {
+                      _context26.next = 9;
+                      return _this36.removeNode(node, {
                         removeRelationships: false
                       });
                     case 9:
-                      _this35.highlightNode(newNode);
-                      _this35.selectNewNode(newNode);
-                      _context25.next = 13;
-                      return _this35.pushToUndoStack();
+                      _this36.highlightNode(newNode);
+                      _this36.selectNewNode(newNode);
+                      _context26.next = 13;
+                      return _this36.pushToUndoStack();
                     case 13:
-                      _context25.next = 15;
-                      return _this35.$nextTick();
+                      _context26.next = 15;
+                      return _this36.$nextTick();
                     case 15:
-                      _this35.saveBpmn(redirectTo, newNode.id);
+                      _this36.saveBpmn(redirectTo, newNode.id);
                     case 16:
                     case "end":
-                      return _context25.stop();
+                      return _context26.stop();
                   }
-                }, _callee25);
+                }, _callee26);
               })));
             case 2:
             case "end":
-              return _context26.stop();
+              return _context27.stop();
           }
-        }, _callee26);
+        }, _callee27);
       })));
     },
     replaceGenericFlow: function replaceGenericFlow(_ref15) {
-      var _this36 = this;
+      var _this37 = this;
       var actualFlow = _ref15.actualFlow,
         genericFlow = _ref15.genericFlow,
         targetNode = _ref15.targetNode;
-      this.performSingleUndoRedoTransaction( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee28() {
-        return _regeneratorRuntime().wrap(function _callee28$(_context28) {
-          while (1) switch (_context28.prev = _context28.next) {
+      this.performSingleUndoRedoTransaction( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee29() {
+        return _regeneratorRuntime().wrap(function _callee29$(_context29) {
+          while (1) switch (_context29.prev = _context29.next) {
             case 0:
-              _context28.next = 2;
-              return _this36.paperManager.performAtomicAction( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee27() {
-                return _regeneratorRuntime().wrap(function _callee27$(_context27) {
-                  while (1) switch (_context27.prev = _context27.next) {
+              _context29.next = 2;
+              return _this37.paperManager.performAtomicAction( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee28() {
+                return _regeneratorRuntime().wrap(function _callee28$(_context28) {
+                  while (1) switch (_context28.prev = _context28.next) {
                     case 0:
-                      _context27.next = 2;
-                      return _this36.highlightNode(null);
+                      _context28.next = 2;
+                      return _this37.highlightNode(null);
                     case 2:
-                      _context27.next = 4;
-                      return _this36.$nextTick();
+                      _context28.next = 4;
+                      return _this37.$nextTick();
                     case 4:
-                      _context27.next = 6;
-                      return _this36.addNode(actualFlow);
+                      _context28.next = 6;
+                      return _this37.addNode(actualFlow);
                     case 6:
-                      _context27.next = 8;
+                      _context28.next = 8;
                       return store.commit('removeNode', genericFlow);
                     case 8:
-                      _context27.next = 10;
-                      return _this36.$nextTick();
+                      _context28.next = 10;
+                      return _this37.$nextTick();
                     case 10:
-                      _context27.next = 12;
-                      return _this36.highlightNode(targetNode);
+                      _context28.next = 12;
+                      return _this37.highlightNode(targetNode);
                     case 12:
                     case "end":
-                      return _context27.stop();
+                      return _context28.stop();
                   }
-                }, _callee27);
+                }, _callee28);
               })));
             case 2:
             case "end":
-              return _context28.stop();
+              return _context29.stop();
           }
-        }, _callee28);
+        }, _callee29);
       })));
     },
     performSingleUndoRedoTransaction: function performSingleUndoRedoTransaction(cb) {
-      var _this37 = this;
-      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee29() {
-        return _regeneratorRuntime().wrap(function _callee29$(_context29) {
-          while (1) switch (_context29.prev = _context29.next) {
+      var _this38 = this;
+      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee30() {
+        return _regeneratorRuntime().wrap(function _callee30$(_context30) {
+          while (1) switch (_context30.prev = _context30.next) {
             case 0:
               undoRedoStore.commit('disableSavingState');
-              _context29.next = 3;
+              _context30.next = 3;
               return cb();
             case 3:
               undoRedoStore.commit('enableSavingState');
-              _context29.next = 6;
-              return _this37.pushToUndoStack();
+              _context30.next = 6;
+              return _this38.pushToUndoStack();
             case 6:
             case "end":
-              return _context29.stop();
+              return _context30.stop();
           }
-        }, _callee29);
+        }, _callee30);
       }))();
     },
     removeNodesFromLane: function removeNodesFromLane(node) {
@@ -77370,36 +77618,36 @@ var Multiplayer = /*#__PURE__*/function () {
       pull_default()(containingLane.get('flowNodeRef'), node.definition);
     },
     removeNodesFromPool: function removeNodesFromPool(node) {
-      var _this38 = this;
+      var _this39 = this;
       if (node.type === 'processmaker-modeler-pool' && node.definition.processRef) {
         if (node.definition.processRef.artifacts) {
           node.definition.processRef.artifacts.forEach(function (artifact) {
-            var nodeToRemove = _this38.nodes.find(function (n) {
+            var nodeToRemove = _this39.nodes.find(function (n) {
               return n.definition === artifact;
             });
             if (nodeToRemove) {
-              _this38.removeNode(nodeToRemove);
+              _this39.removeNode(nodeToRemove);
             }
           });
         }
         if (node.definition.processRef.flowElements) {
           node.definition.processRef.flowElements.forEach(function (flowElement) {
-            var nodeToRemove = _this38.nodes.find(function (n) {
+            var nodeToRemove = _this39.nodes.find(function (n) {
               return n.definition === flowElement;
             });
             if (nodeToRemove) {
-              _this38.removeNode(nodeToRemove);
+              _this39.removeNode(nodeToRemove);
             }
           });
         }
         var laneSets = node.definition.processRef.laneSets;
         if (!!laneSets && laneSets.length > 0) {
           laneSets[0].lanes.forEach(function (lane) {
-            var nodeToRemove = _this38.nodes.find(function (n) {
+            var nodeToRemove = _this39.nodes.find(function (n) {
               return n.definition === lane;
             });
             if (nodeToRemove) {
-              _this38.removeNode(nodeToRemove);
+              _this39.removeNode(nodeToRemove);
             }
           });
         }
@@ -77427,13 +77675,13 @@ var Multiplayer = /*#__PURE__*/function () {
       return shape.component != null;
     },
     setShapeStacking: function setShapeStacking(shape) {
-      var _this39 = this;
+      var _this40 = this;
       if (this.isRendering || !shape.component.node.isType('processmaker-modeler-pool') && shape === this.previouslyStackedShape) {
         return;
       }
       this.previouslyStackedShape = shape;
       this.paperManager.performAtomicAction(function () {
-        return ensureShapeIsNotCovered(shape, _this39.graph);
+        return ensureShapeIsNotCovered(shape, _this40.graph);
       });
     },
     showSavedNotification: function showSavedNotification() {
@@ -77467,49 +77715,49 @@ var Multiplayer = /*#__PURE__*/function () {
       return false;
     },
     pointerDowInShape: function pointerDowInShape(event, element) {
-      var _this40 = this;
-      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee30() {
+      var _this41 = this;
+      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee31() {
         var x, y, shapeView;
-        return _regeneratorRuntime().wrap(function _callee30$(_context30) {
-          while (1) switch (_context30.prev = _context30.next) {
+        return _regeneratorRuntime().wrap(function _callee31$(_context31) {
+          while (1) switch (_context31.prev = _context31.next) {
             case 0:
               x = event.clientX, y = event.clientY;
-              shapeView = _this40.paper.findViewByModel(element);
-              _this40.isDragging = false;
-              _this40.isSelecting = false;
-              _this40.isIntoTheSelection = false;
-              _this40.dragStart = {
+              shapeView = _this41.paper.findViewByModel(element);
+              _this41.isDragging = false;
+              _this41.isSelecting = false;
+              _this41.isIntoTheSelection = false;
+              _this41.dragStart = {
                 x: x,
                 y: y
               };
               // Verify if is in the selection box
-              if (!_this40.isPointInSelection(event)) {
-                _context30.next = 10;
+              if (!_this41.isPointInSelection(event)) {
+                _context31.next = 10;
                 break;
               }
-              _this40.isIntoTheSelection = true;
-              _context30.next = 15;
+              _this41.isIntoTheSelection = true;
+              _context31.next = 15;
               break;
             case 10:
               if (event.shiftKey) {
-                _context30.next = 15;
+                _context31.next = 15;
                 break;
               }
-              _context30.next = 13;
-              return _this40.$refs.selector.selectElement(shapeView);
+              _context31.next = 13;
+              return _this41.$refs.selector.selectElement(shapeView);
             case 13:
-              _context30.next = 15;
-              return _this40.$nextTick();
+              _context31.next = 15;
+              return _this41.$nextTick();
             case 15:
-              _this40.$refs.selector.startDrag({
+              _this41.$refs.selector.startDrag({
                 clientX: event.clientX,
                 clientY: event.clientY
               });
             case 16:
             case "end":
-              return _context30.stop();
+              return _context31.stop();
           }
-        }, _callee30);
+        }, _callee31);
       }))();
     },
     pointerDownHandler: function pointerDownHandler(event) {
@@ -77630,7 +77878,7 @@ var Multiplayer = /*#__PURE__*/function () {
     this.$emit('set-xml-manager', this.xmlManager);
   },
   mounted: function mounted() {
-    var _this41 = this;
+    var _this42 = this;
     store.commit('setReadOnly', this.readOnly);
     this.graph = new external_jointjs_.dia.Graph();
     store.commit('setGraph', this.graph);
@@ -77649,47 +77897,47 @@ var Multiplayer = /*#__PURE__*/function () {
     store.commit('setPaper', this.paperManager.paper);
     this.paperManager.addEventHandler('element:pointerclick', this.blurFocusedScreenBuilderElement, this);
     this.paperManager.addEventHandler('blank:pointerdown', function (event, x, y) {
-      if (_this41.isGrabbing) return;
+      if (_this42.isGrabbing) return;
       if (store.getters.isReadOnly) {
-        _this41.isGrabbing = true;
+        _this42.isGrabbing = true;
       }
-      var scale = _this41.paperManager.scale;
-      _this41.canvasDragPosition = {
+      var scale = _this42.paperManager.scale;
+      _this42.canvasDragPosition = {
         x: x * scale.sx,
         y: y * scale.sy
       };
-      _this41.isOverShape = false;
-      _this41.pointerDownHandler(event);
+      _this42.isOverShape = false;
+      _this42.pointerDownHandler(event);
     }, this);
     this.paperManager.addEventHandler('cell:mouseover element:mouseover', function (_ref19) {
       var shape = _ref19.model;
-      if (_this41.isBpmnNode(shape) && shape.attr('body/cursor') !== 'default' && !_this41.isGrabbing) {
+      if (_this42.isBpmnNode(shape) && shape.attr('body/cursor') !== 'default' && !_this42.isGrabbing) {
         shape.attr('body/cursor', 'move');
       }
       // If the user is panning the Paper while hovering an element, ignore the default move cursor
-      if (_this41.isGrabbing && _this41.isBpmnNode(shape)) {
+      if (_this42.isGrabbing && _this42.isBpmnNode(shape)) {
         shape.attr('body/cursor', 'grabbing');
       }
     });
     this.paperManager.addEventHandler('blank:pointerup', function (event) {
-      _this41.isGrabbing = false;
-      _this41.canvasDragPosition = null;
-      _this41.activeNode = null;
-      _this41.pointerUpHandler(event);
+      _this42.isGrabbing = false;
+      _this42.canvasDragPosition = null;
+      _this42.activeNode = null;
+      _this42.pointerUpHandler(event);
     }, this);
     this.paperManager.addEventHandler('cell:pointerup', function (cellView, event) {
-      _this41.canvasDragPosition = null;
-      _this41.activeNode = null;
-      _this41.pointerUpHandler(event, cellView);
+      _this42.canvasDragPosition = null;
+      _this42.activeNode = null;
+      _this42.pointerUpHandler(event, cellView);
     }, this);
     this.$refs['paper-container'].addEventListener('mouseenter', function () {
       store.commit('setClientLeftPaper', false);
     });
     this.$el.addEventListener('mousemove', function (event) {
-      _this41.pointerMoveHandler(event);
+      _this42.pointerMoveHandler(event);
     });
     this.$refs['paper-container'].addEventListener('mouseleave', function () {
-      _this41.paperManager.removeEventHandler('blank:pointermove');
+      _this42.paperManager.removeEventHandler('blank:pointermove');
       store.commit('setClientLeftPaper', true);
     });
     this.paperManager.addEventHandler('cell:pointerclick', function (cellView, evt, x, y) {
@@ -77700,44 +77948,44 @@ var Multiplayer = /*#__PURE__*/function () {
     });
     this.paperManager.addEventHandler('cell:pointerclick', function (_ref20, event) {
       var shape = _ref20.model;
-      if (!_this41.isBpmnNode(shape)) {
+      if (!_this42.isBpmnNode(shape)) {
         return;
       }
 
       // ignore click event if the user is Grabbing the paper
-      if (_this41.isGrabbing) return;
+      if (_this42.isGrabbing) return;
       shape.component.$emit('click', event);
-      _this41.$emit('click', {
+      _this42.$emit('click', {
         event: event,
-        node: _this41.highlightedNode.definition
+        node: _this42.highlightedNode.definition
       });
     });
     this.paperManager.addEventHandler('cell:pointerdown', function (_ref21, event) {
       var shape = _ref21.model;
-      if (!_this41.isBpmnNode(shape)) {
+      if (!_this42.isBpmnNode(shape)) {
         return;
       }
       // If the user is pressing Space (grabbing) and clicking on a Cell, return
-      if (_this41.isGrabbing) {
+      if (_this42.isGrabbing) {
         return;
       }
-      _this41.setShapeStacking(shape);
-      _this41.activeNode = shape.component.node;
-      _this41.isOverShape = true;
-      _this41.pointerDowInShape(event, shape);
+      _this42.setShapeStacking(shape);
+      _this42.activeNode = shape.component.node;
+      _this42.isOverShape = true;
+      _this42.pointerDowInShape(event, shape);
     });
     // If the user is grabbing the paper while he clicked in a cell, move the paper and not the cell
     this.paperManager.addEventHandler('cell:pointermove', function (_, event, x, y) {
-      if (_this41.isGrabbing) {
-        if (!_this41.canvasDragPosition) {
-          var scale = _this41.paperManager.scale;
-          _this41.canvasDragPosition = {
+      if (_this42.isGrabbing) {
+        if (!_this42.canvasDragPosition) {
+          var scale = _this42.paperManager.scale;
+          _this42.canvasDragPosition = {
             x: x * scale.sx,
             y: y * scale.sy
           };
         }
-        if (_this41.canvasDragPosition && !_this41.clientLeftPaper) {
-          _this41.paperManager.translate(event.offsetX - _this41.canvasDragPosition.x, event.offsetY - _this41.canvasDragPosition.y);
+        if (_this42.canvasDragPosition && !_this42.clientLeftPaper) {
+          _this42.paperManager.translate(event.offsetX - _this42.canvasDragPosition.x, event.offsetY - _this42.canvasDragPosition.y);
         }
       }
     });
@@ -77748,28 +77996,28 @@ var Multiplayer = /*#__PURE__*/function () {
       modeler: this,
       registerMenuAction: this.registerMenuAction,
       loadXML: function () {
-        var _loadXML = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee31(xml) {
+        var _loadXML = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee32(xml) {
           var multiplayer;
-          return _regeneratorRuntime().wrap(function _callee31$(_context31) {
-            while (1) switch (_context31.prev = _context31.next) {
+          return _regeneratorRuntime().wrap(function _callee32$(_context32) {
+            while (1) switch (_context32.prev = _context32.next) {
               case 0:
-                _context31.next = 2;
-                return _this41.loadXML(xml);
+                _context32.next = 2;
+                return _this42.loadXML(xml);
               case 2:
-                _context31.next = 4;
+                _context32.next = 4;
                 return undoRedoStore.dispatch('pushState', xml);
               case 4:
                 try {
-                  multiplayer = new Multiplayer(_this41);
+                  multiplayer = new Multiplayer(_this42);
                   multiplayer.init();
                 } catch (error) {
                   console.warn('Could not initialize multiplayer', error);
                 }
               case 5:
               case "end":
-                return _context31.stop();
+                return _context32.stop();
             }
-          }, _callee31);
+          }, _callee32);
         }));
         function loadXML(_x) {
           return _loadXML.apply(this, arguments);
@@ -77777,18 +78025,18 @@ var Multiplayer = /*#__PURE__*/function () {
         return loadXML;
       }(),
       addWarnings: function addWarnings(warnings) {
-        return _this41.$emit('warnings', warnings);
+        return _this42.$emit('warnings', warnings);
       },
       addBreadcrumbs: function addBreadcrumbs(breadcrumbs) {
-        return _this41.breadcrumbData.push(breadcrumbs);
+        return _this42.breadcrumbData.push(breadcrumbs);
       }
     });
     this.$root.$on('replace-ai-node', function (data) {
-      _this41.replaceAiNode(data);
+      _this42.replaceAiNode(data);
     });
     window.ProcessMaker.EventBus.$on('save-changes', function (redirectUrl) {
       if (redirectUrl) {
-        _this41.redirect(redirectUrl);
+        _this42.redirect(redirectUrl);
       }
     });
   }
@@ -77810,8 +78058,8 @@ var modelervue_type_style_index_0_prod_lang_scss_ = __webpack_require__(26695);
 
 var Modeler_component = normalizeComponent(
   modeler_Modelervue_type_script_lang_js_,
-  Modelervue_type_template_id_7da49550_render,
-  Modelervue_type_template_id_7da49550_staticRenderFns,
+  Modelervue_type_template_id_95ee0562_render,
+  Modelervue_type_template_id_95ee0562_staticRenderFns,
   false,
   null,
   null,