comand-component-library 4.2.61 → 4.2.63

package/dist/comand-component-library.js

@@ -4638,7 +4638,8 @@ const Re = /* @__PURE__ */ P(Pr, [["render", Er]]), Hr = {
         show: !1,
         validationStatus: "",
         message: ""
-      }
+      },
+      formElementsWithError: []
     };
   },
   props: {
@@ -4765,6 +4766,9 @@ const Re = /* @__PURE__ */ P(Pr, [["render", Er]]), Hr = {
     }
   },
   methods: {
+    formElementHasError(e, t) {
+      e === "error" && !this.formElementsWithError.includes(t) ? this.formElementsWithError.push(t) : e === "success" && this.formElementsWithError.includes(t) && (this.formElementsWithError = this.formElementsWithError.filter((n) => n !== t)), this.$emit("validation-status-change", this.formElementsWithError.length ? "error" : "success");
+    },
     createHtmlId: Vi,
     showMessage(e, t) {
       this.systemMessage.show = !0, this.systemMessage.validationStatus = e, this.systemMessage.message = t;
@@ -4847,8 +4851,9 @@ function Qr(e, t, n, s, i, l) {
             autocomplete: f.autocomplete,
             minlength: f.minlength,
             maxlength: f.maxlength,
-            nativeButton: f.nativeButton
-          }, null, 8, ["element", "type", "name", "class", "id", "modelValue", "onUpdate:modelValue", "inputValue", "fieldIconClass", "selectOptions", "labelText", "placeholder", "required", "disabled", "autocomplete", "minlength", "maxlength", "nativeButton"])) : f.component === "CmdInputGroup" ? (a(), v(c, {
+            nativeButton: f.nativeButton,
+            onValidationStatusChange: (g) => l.formElementHasError(g, f.name)
+          }, null, 8, ["element", "type", "name", "class", "id", "modelValue", "onUpdate:modelValue", "inputValue", "fieldIconClass", "selectOptions", "labelText", "placeholder", "required", "disabled", "autocomplete", "minlength", "maxlength", "nativeButton", "onValidationStatusChange"])) : f.component === "CmdInputGroup" ? (a(), v(c, {
             key: 1,
             modelValue: i.formValues[f.name],
             "onUpdate:modelValue": (g) => i.formValues[f.name] = g,
@@ -11163,6 +11168,9 @@ const Xi = /* @__PURE__ */ P(Up, [["render", Gp]]), Kp = {
     }
   },
   computed: {
+    pageHasError() {
+      return this.pagesWithError.some((e) => e.page === this.currentPage);
+    },
     errorSteps() {
       const e = [];
       return this.pagesWithError.find((t) => {
@@ -11240,7 +11248,7 @@ function Jp(e, t, n, s, i, l) {
       setPrevPage: l.setPrevPage,
       setNextPage: l.setNextPage,
       disabledPrevLink: i.currentPage === 1,
-      disabledNextLink: i.currentPage === l.numberOfPages
+      disabledNextLink: i.currentPage === l.numberOfPages || l.pageHasError
     }, () => [
       n.cmdPagination.show ? (a(), v(c, L({
         key: 0,
@@ -21414,7 +21422,7 @@ const qx = /* @__PURE__ */ P(Ex, [["render", Hx]]), Rx = [
     text: "Zimbabwe",
     value: "zw"
   }
-], n1 = "comand-component-library", i1 = "4.2.61", l1 = "GPL-3.0-only", o1 = "CoManD-UI", a1 = "module", s1 = {
+], n1 = "comand-component-library", i1 = "4.2.63", l1 = "GPL-3.0-only", o1 = "CoManD-UI", a1 = "module", s1 = {
   prepublishOnly: "npm run build-lib",
   dev: "vite",
   build: "vite build",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "comand-component-library",
-  "version": "4.2.61",
+  "version": "4.2.63",
   "license": "GPL-3.0-only",
   "author": "CoManD-UI",
   "private": false,

package/src/components/CmdForm.vue

@@ -35,6 +35,7 @@
                         :minlength="item.minlength"
                         :maxlength="item.maxlength"
                         :nativeButton="item.nativeButton"
+                        @validation-status-change="formElementHasError($event, item.name)"
                     />
                     <CmdInputGroup
                         v-else-if="item.component === 'CmdInputGroup'"
@@ -124,7 +125,8 @@ export default {
                 show: false,
                 validationStatus: "",
                 message: ""
-            }
+            },
+            formElementsWithError: []
         }
     },
     props: {
@@ -251,6 +253,14 @@ export default {
         }
     },
     methods: {
+        formElementHasError(event, itemName) {
+            if (event === "error" && !this.formElementsWithError.includes(itemName)) {
+                this.formElementsWithError.push(itemName)
+            } else if (event === "success" && this.formElementsWithError.includes(itemName)) {
+                this.formElementsWithError = this.formElementsWithError.filter((element) => element !== itemName)
+            }
+            this.$emit("validation-status-change", this.formElementsWithError.length ? "error" : "success")
+        },
         createHtmlId,
         showMessage(validationStatus, message) {
             this.systemMessage.show = true

package/src/components/CmdMultistepFormWrapper.vue

@@ -28,7 +28,7 @@
             :setPrevPage="setPrevPage" 
             :setNextPage="setNextPage" 
             :disabledPrevLink="currentPage === 1" 
-            :disabledNextLink="currentPage === numberOfPages"
+            :disabledNextLink="currentPage === numberOfPages || pageHasError"
         >
             <CmdPagination 
                 v-if="cmdPagination.show" 
@@ -133,6 +133,11 @@ export default {
         }
     },
     computed: {
+        pageHasError() {
+            return this.pagesWithError.some((item) => {
+                return item.page === this.currentPage
+            })
+        },
         errorSteps() {
             const steps = []
             this.pagesWithError.find((item) => {