@processmaker/modeler 1.23.0 → 1.24.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@processmaker/modeler",
-  "version": "1.23.0",
+  "version": "1.24.1",
   "scripts": {
     "serve": "vue-cli-service serve",
     "open-cypress": "TZ=UTC cypress open",

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

@@ -7,15 +7,15 @@
       v-model="selectedProcess"
       :showLabels="false"
       :allow-empty="false"
-      :disabled="processList.length === 0"
       :options="processList"
+      :loading="loading"
       optionContent="name"
       class="p-0 mb-2"
-      validation="required"
+      :validation="validation"
       @search-change="searchChange"
       :searchable="true"
       :internal-search="false"
-      :preserve-search="true"
+      :preserve-search="false"
       :clear-on-select="false"
     />
 
@@ -45,6 +45,7 @@
 </template>
 
 <script>
+import debounce from 'lodash/debounce';
 import uniqBy from 'lodash/uniqBy';
 
 export default {
@@ -57,6 +58,7 @@ export default {
       loading: false ,
       processes: [],
       selectedProcessInfo: null,
+      validation: '',
     };
   },
   inheritAttrs: false,
@@ -107,7 +109,7 @@ export default {
   },
   methods: {
     searchChange(filter) {
-      this.loadProcesses(filter);
+      this.loadProcessesDebounced(filter);
     },
     filterValidProcesses(processes) {
       return processes.filter(process => {
@@ -145,6 +147,9 @@ export default {
       this.selectedProcess = this.processList.find(p => p.id === this.config.processId);
       this.selectedStartEvent = this.startEventList.find(se => se.id === this.config.startEvent);
       this.$nextTick(() => {
+        if (!this.selectedProcess) {
+          this.validation = 'required';
+        }
         this.loading = false;
       });
     },
@@ -205,6 +210,10 @@ export default {
     },
   },
   created() {
+    this.validation = !this.config.processId ? 'required' : '';
+    this.loadProcessesDebounced = debounce((filter) => {
+      this.loadProcesses(filter);
+    }, 500);
     if (this.processList.length === 0) {
       this.loadProcesses();
     } else {