@processmaker/modeler 1.18.4 → 1.20.1

package/package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@processmaker/modeler",
-  "version": "1.18.4",
+  "version": "1.20.1",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -6077,9 +6077,9 @@
           }
         },
         "vue-loader-v16": {
-          "version": "npm:vue-loader@16.8.2",
-          "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.8.2.tgz",
-          "integrity": "sha512-Nkq+z9mAsMEK+qkXgK+9Ia7D8w9uu9j4ut0IMT5coMfux3rCgIp1QBB1CYwY0M34A1nRMSONEaWXxAAw6xSl/Q==",
+          "version": "npm:vue-loader@16.8.3",
+          "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.8.3.tgz",
+          "integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==",
           "dev": true,
           "optional": true,
           "requires": {
@@ -6127,9 +6127,9 @@
               "optional": true
             },
             "loader-utils": {
-              "version": "2.0.1",
-              "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.1.tgz",
-              "integrity": "sha512-g4miPa9uUrZz4iElkaVJgDFwKJGh8aQGM7pUL4ejXl6cu7kSb30seQOVGNMP6sW8j7DW77X68hJZ+GM7UGhXeQ==",
+              "version": "2.0.2",
+              "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.2.tgz",
+              "integrity": "sha512-TM57VeHptv569d/GKh6TAYdzKblwDNiumOdkFnejjD0XwTH87K90w3O7AiJRqdQoXygvi1VQTJTLGhJl7WqA7A==",
               "dev": true,
               "optional": true,
               "requires": {
@@ -8014,9 +8014,9 @@
       "dev": true
     },
     "bpmnlint-plugin-processmaker": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/bpmnlint-plugin-processmaker/-/bpmnlint-plugin-processmaker-1.2.3.tgz",
-      "integrity": "sha512-FzHL/53H81wvPEj9vDG+4+ozREofot3fgH8t8ABTqXazAHLYHtV2SPOky4wo+C9Mv1z40KKLoRZnb621Ul0frg==",
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/bpmnlint-plugin-processmaker/-/bpmnlint-plugin-processmaker-1.2.5.tgz",
+      "integrity": "sha512-Y2nJ4rC7D4bRqB7TcnjlTqcFgohif/iH7o3i/F5wMZYU2oldHS3AUL7axX2WdvIpSyT87cZOredCMbnmCfvFkw==",
       "requires": {
         "bpmnlint": "^7.2.1",
         "bpmnlint-utils": "^1.0.1",
@@ -8039,9 +8039,9 @@
           }
         },
         "bpmnlint": {
-          "version": "7.2.1",
-          "resolved": "https://registry.npmjs.org/bpmnlint/-/bpmnlint-7.2.1.tgz",
-          "integrity": "sha512-WbAGBbPN7mCJOUWriu8Zadu7HNxU+0oASvLAcfKYZ/2En9/aE9/e0RXUkhFqhoOx9Aw+xJGwKqH7QTI2BfigAw==",
+          "version": "7.4.0",
+          "resolved": "https://registry.npmjs.org/bpmnlint/-/bpmnlint-7.4.0.tgz",
+          "integrity": "sha512-Kxlen+5NUzVqQullMXewmSJsS9QI8chUSyrDX5jXcOWU8gBbwq8RbQeAnhOmFD3aQFh+bL3q8jCcseX3RHbGtA==",
           "requires": {
             "ansi-colors": "^4.1.1",
             "bpmn-moddle": "^7.0.3",
@@ -16660,21 +16660,21 @@
       }
     },
     "jointjs": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/jointjs/-/jointjs-3.2.0.tgz",
-      "integrity": "sha512-eI9XWSBlfgC8CuM8DD701o3aLqGtqOIB7qotxE98DNRZHQWQqRLihL/ffQ1SVqXMOmkk82lPVwBJzCjr+Nk+mQ==",
+      "version": "3.4.2",
+      "resolved": "https://registry.npmjs.org/jointjs/-/jointjs-3.4.2.tgz",
+      "integrity": "sha512-iw/mOu+y2AD3lhCAQ5RloaRJH/oIWD6rtfGJ1BvhnaF6fn2Wfec/so64LTl5rwCP1IL9cQEMIuh3eth43UwwIw==",
       "requires": {
         "backbone": "~1.4.0",
-        "dagre": "~0.8.4",
-        "graphlib": "~2.1.7",
-        "jquery": "~3.5.0",
-        "lodash": "~4.17.14"
+        "dagre": "~0.8.5",
+        "graphlib": "~2.1.8",
+        "jquery": "~3.6.0",
+        "lodash": "~4.17.21"
       },
       "dependencies": {
-        "jquery": {
-          "version": "3.5.1",
-          "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.5.1.tgz",
-          "integrity": "sha512-XwIBPqcMn57FxfT+Go5pzySnm4KWkT1Tv7gjrpT1srtf8Weynl6R273VJ5GjkRb51IzMp5nbaPjJXMWeju2MKg=="
+        "lodash": {
+          "version": "4.17.21",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
+          "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
         }
       }
     },
@@ -22249,7 +22249,7 @@
       "dependencies": {
         "source-map": {
           "version": "0.4.4",
-          "resolved": "http://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
           "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s=",
           "dev": true,
           "requires": {
@@ -24315,9 +24315,9 @@
       }
     },
     "underscore": {
-      "version": "1.11.0",
-      "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.11.0.tgz",
-      "integrity": "sha512-xY96SsN3NA461qIRKZ/+qox37YXPtSBswMGfiNptr+wrt6ds4HaMw23TP612fEyGekRE6LNRiLYr/aqbHXNedw=="
+      "version": "1.13.2",
+      "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.13.2.tgz",
+      "integrity": "sha512-ekY1NhRzq0B08g4bGuX4wd2jZx5GnKz6mKSqFL4nqBlfyMGiG10gDFhDTMEfYmDL6Jy0FUIZp7wiRB+0BP7J2g=="
     },
     "unherit": {
       "version": "1.1.2",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@processmaker/modeler",
-  "version": "1.18.4",
+  "version": "1.20.1",
   "scripts": {
     "serve": "vue-cli-service serve",
     "open-cypress": "TZ=UTC cypress open",
@@ -48,11 +48,11 @@
     "bootstrap-vue": "^2.0.4",
     "bpmn-moddle": "^6.0.7",
     "bpmnlint": "^6.4.0",
-    "bpmnlint-plugin-processmaker": "1.2.3",
+    "bpmnlint-plugin-processmaker": "1.2.5",
     "core-js": "^3.7.0",
     "file-saver": "^2.0.5",
     "jest-junit": "^12.0.0",
-    "jointjs": "^3.2.0",
+    "jointjs": "^3.4.2",
     "js-yaml-loader": "^1.2.2",
     "lodash": "^4.17.20",
     "luxon": "^1.25.0",

package/src/components/crown/crownButtons/genericFlowButton.vue

@@ -26,6 +26,7 @@ const dontShowOn = [
   'processmaker-modeler-signal-end-event',
   'processmaker-modeler-terminate-end-event',
   'processmaker-modeler-text-annotation',
+  'processmaker-modeler-sequence-flow',
 ];
 
 export default {

package/src/components/crown/utils.js

@@ -99,3 +99,125 @@ export function removeSourceDefault(node) {
     node.definition.sourceRef.set('default', null);
   }
 }
+
+export function getOrFindDataInput(moddle, task, sourceNode) {
+  if (sourceNode.$type !== 'bpmn:DataObjectReference' && sourceNode.$type !== 'bpmn:DataStoreReference') {
+    throw 'Source node must be a DataObjectReference or bpmn:DataStoreReference, got ' + sourceNode.$type;
+  }
+  const sourceNodeId = sourceNode.id;
+  const dataInputId = `data_input_${sourceNodeId}`;
+  // Check if ioSpecification exists
+  if (!task.definition.ioSpecification) {
+    task.definition.set('ioSpecification', moddle.create('bpmn:InputOutputSpecification', {
+      dataInputs: [],
+      dataOutputs: [],
+      inputSets: [],
+      outputSets: [],
+    }));
+  }
+  // Check if dataInput exists
+  if (!task.definition.ioSpecification.dataInputs) {
+    task.definition.ioSpecification.set('dataInputs', []);
+  }
+  let dataInput = task.definition.ioSpecification.dataInputs.find(input => input.id === dataInputId);
+  if (!dataInput) {
+    task.definition.ioSpecification.dataInputs.push(moddle.create('bpmn:DataInput', {
+      id: dataInputId,
+      isCollection: 'false',
+      name: sourceNode.name,
+    }));
+    task.definition.ioSpecification.set('dataInputs', task.definition.ioSpecification.dataInputs);
+  }
+  dataInput = task.definition.ioSpecification.dataInputs.find(input => input.id === dataInputId);
+  // Check if outputSet exists
+  if (!task.definition.ioSpecification.outputSets) {
+    task.definition.ioSpecification.set('outputSets', [
+      moddle.create('bpmn:OutputSet', {
+        dataInputRefs: [],
+      }),
+    ]);
+  }
+  let outputSet = task.definition.ioSpecification.outputSets[0];
+  if (!outputSet) {
+    task.definition.ioSpecification.set('outputSets', [
+      moddle.create('bpmn:OutputSet', {
+        dataInputRefs: [],
+      }),
+    ]);
+  }
+  outputSet = task.definition.ioSpecification.outputSets[0];
+  // Check if inputSet exists
+  if (!task.definition.ioSpecification.inputSets) {
+    task.definition.ioSpecification.set('inputSets', [
+      moddle.create('bpmn:InputSet', {
+        dataInputRefs: [],
+      }),
+    ]);
+  }
+  let inputSet = task.definition.ioSpecification.inputSets[0];
+  if (!inputSet) {
+    task.definition.ioSpecification.set('inputSets', [
+      moddle.create('bpmn:InputSet', {
+        dataInputRefs: [],
+      }),
+    ]);
+  }
+  inputSet = task.definition.ioSpecification.inputSets[0];
+  // Check if dataInputRef exists
+  const dataInputRef = inputSet.dataInputRefs.find(ref => ref.id === dataInputId);
+  if (!dataInputRef) {
+    inputSet.dataInputRefs.push(dataInput);
+  }
+  return dataInput;
+}
+
+
+export function removeDataInput(task, sourceNode) {
+  if (sourceNode.$type !== 'bpmn:DataObjectReference' && sourceNode.$type !== 'bpmn:DataStoreReference') {
+    throw 'Source node must be a DataObjectReference or bpmn:DataStoreReference, got ' + sourceNode.$type;
+  }
+  const sourceNodeId = sourceNode.id;
+  const dataInputId = `data_input_${sourceNodeId}`;
+  // Check if ioSpecification exists
+  if (!task.definition.ioSpecification) {
+    return;
+  }
+  // Check if dataInput exists
+  if (!task.definition.ioSpecification.dataInputs) {
+    return;
+  }
+  let dataInput = task.definition.ioSpecification.dataInputs.find(input => input.id === dataInputId);
+  if (!dataInput) {
+    return;
+  }
+  // remove dataInput from dataInputs
+  pull(task.definition.ioSpecification.dataInputs, dataInput);
+  // Check if inputSet exists
+  if (!task.definition.ioSpecification.inputSets) {
+    return;
+  }
+  let inputSet = task.definition.ioSpecification.inputSets[0];
+  if (!inputSet) {
+    return;
+  }
+  // Check if dataInputRef exists
+  const dataInputRef = inputSet.dataInputRefs.find(ref => ref.id === dataInputId);
+  if (dataInputRef) {
+    pull(inputSet.dataInputRefs, dataInputRef);
+  }
+  // Remove inputSets if it is empty (without any dataInputRefs)
+  if (inputSet.dataInputRefs.length === 0) {
+    delete task.definition.ioSpecification.inputSets;
+  }
+  // Remove outputSets if it is empty (without any dataOutputRefs)
+  if (task.definition.ioSpecification.outputSets) {
+    let outputSet = task.definition.ioSpecification.outputSets[0];
+    if (outputSet && (!outputSet.dataOutputRefs || outputSet.dataOutputRefs.length === 0)) {
+      delete task.definition.ioSpecification.outputSets;
+    }
+  }
+  // Remove ioSpecification if it is empty (without outputSets and inputSets)
+  if (!task.definition.ioSpecification.inputSets && !task.definition.ioSpecification.outputSets) {
+    delete task.definition.ioSpecification;
+  }
+}

package/src/components/modeler/XMLManager.js

@@ -23,11 +23,46 @@ export default class XMLManager {
         definitions.exporter = 'ProcessMaker Modeler';
         definitions.exporterVersion = '1.0';
 
+        // Clean broken references when loading definitions
+        this.cleanBrokenReferences(definitions);
+
         resolve(definitions);
       });
     });
   }
 
+  cleanBrokenReferences(definitions) {
+    const { rootElements, diagrams } = definitions;
+    const removed = [];
+
+    // Remove broken bpmn:SequenceFlow from bpmn:Process
+    rootElements.forEach(element => {
+      if (element.$type === 'bpmn:Process' && element.flowElements) {
+        element.flowElements = element.flowElements.filter(child => {
+          if (child.$type === 'bpmn:SequenceFlow') {
+            if (!(child.sourceRef && child.targetRef)) {
+              removed.push(child);
+            }
+            return child.sourceRef && child.targetRef;
+          }
+          return true;
+        });
+      }
+    });
+
+    // Remove BPMNEdge from bpmndi:BPMNDiagram
+    diagrams.forEach(element => {
+      if (element.$type === 'bpmndi:BPMNDiagram' && element.plane && element.plane.planeElement) {
+        element.plane.planeElement = element.plane.planeElement.filter(child => {
+          if (child.$type === 'bpmndi:BPMNEdge') {
+            return child.bpmnElement && !removed.includes(child.bpmnElement);
+          }
+          return true;
+        });
+      }
+    });
+  }
+
   download() {
     if (!this.#definitions) {
       return;

package/src/components/nodes/dataInputAssociation/dataInputAssociation.vue

@@ -21,6 +21,7 @@ import linkConfig from '@/mixins/linkConfig';
 import get from 'lodash/get';
 import associationHead from '!!url-loader!@/assets/association-head.svg';
 import CrownConfig from '@/components/crown/crownConfig/crownConfig';
+import { getOrFindDataInput, removeDataInput } from '@/components/crown/utils';
 import { pull } from 'lodash';
 
 export default {
@@ -99,8 +100,9 @@ export default {
     },
     updateDefinitionLinks() {
       const targetShape = this.shape.getTargetElement();
+      const dataInput = getOrFindDataInput(this.moddle, targetShape.component.node, this.sourceNode.definition);
+      this.node.definition.set('targetRef', dataInput);
       this.node.definition.set('sourceRef', [this.sourceNode.definition]);
-      this.node.definition.set('targetRef', null);
       targetShape.component.node.definition.set('dataInputAssociations', [this.node.definition]);
     },
   },
@@ -127,6 +129,7 @@ export default {
     this.shape.component = this;
   },
   destroyed() {
+    removeDataInput(this.targetNode, this.sourceNode.definition);
     pull(this.targetNode.definition.get('dataInputAssociations'), this.node.definition);
   },
 };

package/src/components/nodes/subProcess/SubProcessFormSelect.vue

@@ -12,7 +12,11 @@
       optionContent="name"
       class="p-0 mb-2"
       validation="required"
-      @open="loadProcesses"
+      @search-change="searchChange"
+      :searchable="true"
+      :internal-search="false"
+      :preserve-search="true"
+      :clear-on-select="false"
     />
 
     <form-multi-select
@@ -41,7 +45,6 @@
 </template>
 
 <script>
-import store from '@/store';
 import uniqBy from 'lodash/uniqBy';
 
 export default {
@@ -52,18 +55,31 @@ export default {
       config: {},
       name: '',
       loading: false ,
+      processes: [],
+      selectedProcessInfo: null,
     };
   },
   inheritAttrs: false,
   props: ['value'],
   computed: {
     processList() {
-      return this.filterValidProcesses(store.getters.globalProcesses) || [];
+      const list = this.filterValidProcesses(this.processes) || [];
+      if (this.selectedProcessInfo && !list.find(p => p.id === this.selectedProcessInfo.id)) {
+        list.push(this.selectedProcessInfo);
+      }
+      return list;
     },
     startEventList() {
       if (!this.selectedProcess) { return []; }
       return this.filterValidStartEvents(this.selectedProcess.events);
     },
+    currentProcessId() {
+      const match = window.location.href.match(/modeler\/(\d+)/);
+      if (match && match[1]) {
+        return parseInt(match[1]);
+      }
+      return null;
+    },
   },
   watch: {
     selectedProcess() {
@@ -84,15 +100,19 @@ export default {
     value: {
       handler() {
         this.config = JSON.parse(this.value);
+        this.loadSelectedProcessInfo();
       },
       immediate: true,
     },
   },
   methods: {
+    searchChange(filter) {
+      this.loadProcesses(filter);
+    },
     filterValidProcesses(processes) {
       return processes.filter(process => {
         return this.filterValidStartEvents(process.events).length > 0;
-      });
+      }).filter(process => process.id !== this.currentProcessId);
     },
     filterValidStartEvents(events) {
       return events.filter(event => {
@@ -150,8 +170,38 @@ export default {
     containsMultipleProcesses(process) {
       return uniqBy(process.events, 'ownerProcessId').length > 1;
     },
-    loadProcesses() {
-      store.dispatch('fetchGlobalProcesses');
+    loadProcesses(filter) {
+      this.loading = true;
+
+      const params = {
+        order_direction: 'asc',
+        per_page: 20,
+        status: 'all',
+        include: 'events,category',
+      };
+
+      if (filter) {
+        params.filter = filter;
+      }
+
+      window.ProcessMaker.apiClient.get('processes', {
+        params,
+      }).then(response => {
+        this.loading = false;
+        this.processes = response.data.data;
+      })
+        .catch(() => {
+          this.loading = false;
+        });
+    },
+    loadSelectedProcessInfo() {
+      if (this.config.processId) {
+        window.ProcessMaker.apiClient.get('processes/' + this.config.processId, { params: {
+          include: 'events,category',
+        } }).then(response => {
+          this.selectedProcessInfo = response.data;
+        });
+      }
     },
   },
   created() {

package/src/mixins/linkConfig.js

@@ -245,7 +245,9 @@ export default {
     this.setSource(this.sourceShape);
 
     this.$once('click', () => {
-      this.setupLinkTools();
+      this.$nextTick(() => {
+        this.setupLinkTools();
+      });
     });
 
     const targetRef = this.getTargetRef

package/src/setup/globals.js

@@ -19,8 +19,13 @@ mock.onGet(/\/processes\/\d+/).reply((config) => {
     });
   }
 
+  const regex = /processes\/(\d+)/g;
+  const matches = regex.exec(config.url);
+  const requestedId = matches[1];
+  const process = mockProcesses.data.find(p => p.id === parseInt(requestedId));
+
   return new Promise((resolve) => {
-    setTimeout(() => resolve([200, { svg: mockProcessSvg }]), 1000);
+    setTimeout(() => resolve([200, { svg: mockProcessSvg, ...process }]), 1000);
   });
 });
 

package/src/setup/mockProcesses.json

@@ -23,7 +23,15 @@
           "ownerProcessId": "ProcessId",
           "ownerProcessName": "Process Name"
         }
-      ]
+      ],
+      "category": {
+        "id": 1,
+        "name": "Uncategorized",
+        "status": "ACTIVE",
+        "is_system": 0,
+        "created_at": "2021-09-01T06:11:30-07:00",
+        "updated_at": "2021-09-01T06:11:30-07:00"
+      }
     },
     {
       "id": 3,
@@ -48,7 +56,15 @@
           "ownerProcessId": "ProcessId",
           "ownerProcessName": "Process Name"
         }
-      ]
+      ],
+      "category": {
+        "id": 1,
+        "name": "Uncategorized",
+        "status": "ACTIVE",
+        "is_system": 0,
+        "created_at": "2021-09-01T06:11:30-07:00",
+        "updated_at": "2021-09-01T06:11:30-07:00"
+      }
     },
     {
       "id": 5,
@@ -93,7 +109,15 @@
           "ownerProcessId": "Subprocess2",
           "ownerProcessName": "Subprocess Two"
         }
-      ]
+      ],
+      "category": {
+        "id": 1,
+        "name": "Uncategorized",
+        "status": "ACTIVE",
+        "is_system": 0,
+        "created_at": "2021-09-01T06:11:30-07:00",
+        "updated_at": "2021-09-01T06:11:30-07:00"
+      }
     },
     {
       "id": 1,
@@ -107,7 +131,15 @@
       "deleted_at": null,
       "created_at": "2019-04-01T16:02:14+00:00",
       "updated_at": "2019-04-02T19:11:03+00:00",
-      "events": []
+      "events": [],
+      "category": {
+        "id": 1,
+        "name": "Uncategorized",
+        "status": "ACTIVE",
+        "is_system": 0,
+        "created_at": "2021-09-01T06:11:30-07:00",
+        "updated_at": "2021-09-01T06:11:30-07:00"
+      }
     },
     {
       "id": 13,
@@ -132,7 +164,15 @@
           "ownerProcessId": "Subprocess1",
           "ownerProcessName": "Subprocess One"
         }
-      ]
+      ],
+      "category": {
+        "id": 1,
+        "name": "Uncategorized",
+        "status": "ACTIVE",
+        "is_system": 0,
+        "created_at": "2021-09-01T06:11:30-07:00",
+        "updated_at": "2021-09-01T06:11:30-07:00"
+      }
     }
   ],
   "meta": {

package/src/store.js

@@ -130,8 +130,8 @@ export default new Vuex.Store({
           params: {
             order_direction: 'asc',
             per_page: 1000,
-            status: 'active',
-            include: 'events',
+            status: 'all',
+            include: 'events,category',
           },
         });
         commit('setGlobalProcesses', data.data);