@iankibetsh/shframework 1.8.0 → 1.8.3

package/dist/library.js

@@ -1896,6 +1896,14 @@ var script$s = {
   mounted () {
     this.setSelectedCountry();
   },
+  watch: {
+    modelValue: function(newVal){
+      if(!this.input){
+        let phone = newVal.replace('+254','');
+        this.input = phone.replace('+1','');
+      }
+    }
+  },
   methods: {
     updateValue: function () {
       let phone = this.input;
@@ -1991,7 +1999,7 @@ const _hoisted_4$c = ["onClick"];
 const _hoisted_5$a = ["id"];
 const _hoisted_6$9 = ["id", "aria-labelledby"];
 const _hoisted_7$7 = { key: 0 };
-const _hoisted_8$5 = ["onClick"];
+const _hoisted_8$6 = ["onClick"];
 const _hoisted_9$6 = {
   key: 1,
   class: "dropdown-item sh-suggest-no-results"
@@ -2127,7 +2135,7 @@ return (_ctx, _cache) => {
                           onClick: $event => (addSuggestion(suggestion)),
                           class: vue.normalizeClass(["dropdown-item", vue.unref(selectedSuggestions).includes(suggestion) ? 'active':'']),
                           href: "#"
-                        }, vue.toDisplayString(suggestion.name ?? suggestion.text), 11 /* TEXT, CLASS, PROPS */, _hoisted_8$5)
+                        }, vue.toDisplayString(suggestion.name ?? suggestion.text), 11 /* TEXT, CLASS, PROPS */, _hoisted_8$6)
                       ]))
                     : vue.createCommentVNode("v-if", true)
                 ], 64 /* STABLE_FRAGMENT */))
@@ -2487,7 +2495,7 @@ const _hoisted_4$b = /*#__PURE__*/vue.createElementVNode("i", { class: "bi-excla
 const _hoisted_5$9 = { key: 0 };
 const _hoisted_6$8 = { key: 1 };
 const _hoisted_7$6 = { class: "row" };
-const _hoisted_8$4 = { class: "fg-label control-label text-capitalize control-bel col-md-12 request-form-label mb-2" };
+const _hoisted_8$5 = { class: "fg-label control-label text-capitalize control-bel col-md-12 request-form-label mb-2" };
 const _hoisted_9$5 = { class: "col-md-12" };
 const _hoisted_10$4 = ["data-cy", "placeholder", "name", "onFocus", "onChange"];
 const _hoisted_11$3 = ["data-cy", "placeholder", "name", "onFocus", "onUpdate:modelValue"];
@@ -2559,7 +2567,7 @@ function render$2(_ctx, _cache, $props, $setup, $data, $options) {
             class: vue.normalizeClass(["form-group", 'col-md-' + $options.getColumns()]),
             key: field
           }, [
-            vue.createElementVNode("label", _hoisted_8$4, vue.toDisplayString($options.getLabel(field)), 1 /* TEXT */),
+            vue.createElementVNode("label", _hoisted_8$5, vue.toDisplayString($options.getLabel(field)), 1 /* TEXT */),
             vue.createElementVNode("div", _hoisted_9$5, [
               ($options.getFieldType(field) === 'component')
                 ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.customComponent[field]), {
@@ -2762,7 +2770,11 @@ const modelValueUpdated = (e) => {
 vue.onMounted(()=>{
   props.modelValue && (inputModel.value = props.modelValue);
 });
-
+vue.watch(()=>props.modelValue, (newValue)=>{
+  if(newValue) {
+    inputModel.value = newValue;
+  }
+});
 
 return (_ctx, _cache) => {
   return vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
@@ -2803,7 +2815,11 @@ const modelValueUpdated = (e) => {
 vue.onMounted(()=>{
   props.modelValue && (inputModel.value = props.modelValue);
 });
-
+vue.watch(()=>props.modelValue, (newValue)=>{
+  if(newValue) {
+    inputModel.value = newValue;
+  }
+});
 
 return (_ctx, _cache) => {
   return vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
@@ -2844,6 +2860,12 @@ vue.onMounted(()=>{
   props.modelValue && (inputModel.value = props.modelValue);
 });
 
+vue.watch(()=>props.modelValue, (newValue)=>{
+  if(newValue) {
+    inputModel.value = newValue;
+  }
+});
+
 
 return (_ctx, _cache) => {
   return vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
@@ -2881,7 +2903,11 @@ const modelValueUpdated = (e) => {
 vue.onMounted(()=>{
   props.modelValue && (inputModel.value = props.modelValue);
 });
-
+vue.watch(()=>props.modelValue, (newValue)=>{
+  if(newValue) {
+    inputModel.value = newValue;
+  }
+});
 
 return (_ctx, _cache) => {
   return vue.withDirectives((vue.openBlock(), vue.createElementBlock("textarea", {
@@ -2941,7 +2967,11 @@ vue.onMounted(()=>{
     });
   }
 });
-
+vue.watch(()=>props.modelValue, (newValue)=>{
+  if(newValue) {
+    inputModel.value = newValue;
+  }
+});
 
 return (_ctx, _cache) => {
   return vue.withDirectives((vue.openBlock(), vue.createElementBlock("select", {
@@ -3005,17 +3035,18 @@ return (_ctx, _cache) => {
 script$k.__file = "src/lib/components/form-components/PasswordInput.vue";
 
 const _hoisted_1$i = /*#__PURE__*/vue.createElementVNode("div", null, null, -1 /* HOISTED */);
-const _hoisted_2$b = ["innerHTML"];
+const _hoisted_2$b = ["onUpdate:modelValue"];
 const _hoisted_3$a = ["innerHTML"];
 const _hoisted_4$a = ["innerHTML"];
-const _hoisted_5$8 = ["disabled"];
-const _hoisted_6$7 = {
+const _hoisted_5$8 = ["innerHTML"];
+const _hoisted_6$7 = ["disabled"];
+const _hoisted_7$5 = {
   key: 0,
   class: "spinner-border spinner-border-sm",
   role: "status",
   "aria-hidden": "true"
 };
-const _hoisted_7$5 = { key: 1 };
+const _hoisted_8$4 = { key: 1 };
 
 
 var script$j = {
@@ -3094,7 +3125,7 @@ shFormElementClasses.value = vue.inject('shFormElementClasses');
 const shAutoForm = vue.ref(null);
 const closeModal = e => {
   setTimeout(() => {
-    const modal = script$j.value.closest('.modal-dialog');
+    const modal = shAutoForm.value.closest('.modal-dialog');
     if(modal){
       const closeBtn = modal.querySelector('[data-bs-dismiss="modal"]');
       closeBtn && closeBtn.click();
@@ -3151,17 +3182,24 @@ const submitForm = e => {
   return false
 };
 const submitBtnWidth = vue.ref(null);
-const setExistingData = ()=>{
-  console.log(props.currentData, formFields.value);
-  const existingData = props.currentData;
+const setExistingData = (existingData)=>{
   if (props.currentData) {
-    formFields.value.map(field=>{
-      existingData[field.field] && (field.value = existingData[field.field]);
+    const newFields = formFields.value.map(fl=>{
+      if(existingData[fl.field]) {
+        fl.value = existingData[fl.field];
+      }
+      return fl
+      // console.log(fl)
+      // console.log(field, existingData)
+      // existingData[field.field] && (field.value = existingData[field.field])
     });
+    formFields.value = null;
+    console.log(newFields);
+    formFields.value = newFields;
   }
 };
-vue.watch(()=>props.currentData,()=>{
-  setExistingData();
+vue.watch(()=>props.currentData,(newData)=>{
+  setExistingData(newData);
 });
 vue.onMounted((ev)=>{
   props.fields && props.fields.map(field=>{
@@ -3183,8 +3221,13 @@ vue.onMounted((ev)=>{
         value: null
       });
     }
+    formFields.value.push({
+      field: 'id',
+      type: 'hidden'
+      // label: 'IF'
+    });
   });
-  setExistingData();
+  setExistingData(props.currentData);
 });
 
 
@@ -3202,42 +3245,50 @@ return (_ctx, _cache) => {
           key: field,
           class: vue.normalizeClass(getElementClass('formGroup'))
         }, [
-          (!vue.unref(isFloating) && field.label)
-            ? (vue.openBlock(), vue.createElementBlock("label", {
+          (field.type === 'hidden')
+            ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
                 key: 0,
-                class: vue.normalizeClass(getElementClass('formLabel')),
-                innerHTML: field.label
-              }, null, 10 /* CLASS, PROPS */, _hoisted_2$b))
-            : vue.createCommentVNode("v-if", true),
-          (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(getFieldComponent(field)), vue.mergeProps(getComponentProps(field), {
-            isInvalid: typeof validationErrors.value[field.field] !== 'undefined',
-            onClick: $event => (removeValidationError(field.field)),
-            "onUpdate:modelValue": [$event => (removeValidationError(field.field)), $event => ((formFields.value[index].value) = $event)],
-            modelValue: formFields.value[index].value,
-            class: getComponentClass(field.field)
-          }), null, 16 /* FULL_PROPS */, ["isInvalid", "onClick", "onUpdate:modelValue", "modelValue", "class"])),
-          (vue.unref(isFloating) && field.label)
-            ? (vue.openBlock(), vue.createElementBlock("label", {
-                key: 1,
-                class: vue.normalizeClass(getElementClass('formLabel')),
-                innerHTML: field.label
-              }, null, 10 /* CLASS, PROPS */, _hoisted_3$a))
-            : vue.createCommentVNode("v-if", true),
-          (field.helper)
-            ? (vue.openBlock(), vue.createElementBlock("div", {
-                key: 2,
-                class: vue.normalizeClass(getElementClass('helperText')),
-                innerHTML: field.helper
-              }, null, 10 /* CLASS, PROPS */, _hoisted_4$a))
-            : vue.createCommentVNode("v-if", true),
-          (validationErrors.value[field.field])
-            ? (vue.openBlock(), vue.createElementBlock("div", {
-                key: 3,
-                class: vue.normalizeClass(getElementClass('invalidFeedback'))
-              }, vue.toDisplayString(validationErrors.value[field.field]), 3 /* TEXT, CLASS */))
-            : vue.createCommentVNode("v-if", true),
-          vue.createCommentVNode("      <h5>{{ getFieldComponent(field) }}</h5>"),
-          vue.createCommentVNode("      <h5>{{ getComponentProps(field) }}</h5>")
+                type: "hidden",
+                "onUpdate:modelValue": $event => ((formFields.value[index].value) = $event)
+              }, null, 8 /* PROPS */, _hoisted_2$b)), [
+                [vue.vModelText, formFields.value[index].value]
+              ])
+            : (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
+                (!vue.unref(isFloating) && field.label)
+                  ? (vue.openBlock(), vue.createElementBlock("label", {
+                      key: 0,
+                      class: vue.normalizeClass(getElementClass('formLabel')),
+                      innerHTML: field.label
+                    }, null, 10 /* CLASS, PROPS */, _hoisted_3$a))
+                  : vue.createCommentVNode("v-if", true),
+                (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(getFieldComponent(field)), vue.mergeProps(getComponentProps(field), {
+                  isInvalid: typeof validationErrors.value[field.field] !== 'undefined',
+                  onClick: $event => (removeValidationError(field.field)),
+                  "onUpdate:modelValue": [$event => (removeValidationError(field.field)), $event => ((formFields.value[index].value) = $event)],
+                  modelValue: formFields.value[index].value,
+                  class: getComponentClass(field.field)
+                }), null, 16 /* FULL_PROPS */, ["isInvalid", "onClick", "onUpdate:modelValue", "modelValue", "class"])),
+                (vue.unref(isFloating) && field.label)
+                  ? (vue.openBlock(), vue.createElementBlock("label", {
+                      key: 1,
+                      class: vue.normalizeClass(getElementClass('formLabel')),
+                      innerHTML: field.label
+                    }, null, 10 /* CLASS, PROPS */, _hoisted_4$a))
+                  : vue.createCommentVNode("v-if", true),
+                (field.helper)
+                  ? (vue.openBlock(), vue.createElementBlock("div", {
+                      key: 2,
+                      class: vue.normalizeClass(getElementClass('helperText')),
+                      innerHTML: field.helper
+                    }, null, 10 /* CLASS, PROPS */, _hoisted_5$8))
+                  : vue.createCommentVNode("v-if", true),
+                (validationErrors.value[field.field])
+                  ? (vue.openBlock(), vue.createElementBlock("div", {
+                      key: 3,
+                      class: vue.normalizeClass(getElementClass('invalidFeedback'))
+                    }, vue.toDisplayString(validationErrors.value[field.field]), 3 /* TEXT, CLASS */))
+                  : vue.createCommentVNode("v-if", true)
+              ], 64 /* STABLE_FRAGMENT */))
         ], 2 /* CLASS */))
       }), 128 /* KEYED_FRAGMENT */)),
       vue.createElementVNode("div", {
@@ -3251,12 +3302,12 @@ return (_ctx, _cache) => {
           class: vue.normalizeClass(getElementClass('actionBtn'))
         }, [
           (loading.value)
-            ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_6$7))
+            ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_7$5))
             : vue.createCommentVNode("v-if", true),
           (!loading.value)
-            ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_7$5, "Submit"))
+            ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_8$4, "Submit"))
             : vue.createCommentVNode("v-if", true)
-        ], 14 /* CLASS, STYLE, PROPS */, _hoisted_5$8)
+        ], 14 /* CLASS, STYLE, PROPS */, _hoisted_6$7)
       ], 2 /* CLASS */)
     ], 34 /* CLASS, HYDRATE_EVENTS */)
   ], 64 /* STABLE_FRAGMENT */))
@@ -3983,7 +4034,7 @@ script$b.__file = "src/lib/components/ShSilentAction.vue";
 
 var script$a = {
   name: 'sh-table',
-  props: ['endPoint', 'headers', 'pageCount', 'actions', 'hideCount', 'hideLoadMore', 'links', 'reload', 'hideSearch', 'sharedData', 'searchPlaceholder', 'event', 'displayMore', 'displayMoreBtnClass', 'moreDetailsColumns', 'moreDetailsFields', 'hasDownload', 'downloadFields', 'tableHover', 'hideIds', 'paginationStyle'],
+  props: ['endPoint', 'headers','query', 'pageCount', 'actions', 'hideCount', 'hideLoadMore', 'links', 'reload', 'hideSearch', 'sharedData', 'searchPlaceholder', 'event', 'displayMore', 'displayMoreBtnClass', 'moreDetailsColumns', 'moreDetailsFields', 'hasDownload', 'downloadFields', 'tableHover', 'hideIds', 'paginationStyle'],
   inject: ['channel'],
   data () {
     return {
@@ -4004,10 +4055,14 @@ var script$a = {
       hasCanvas: 0,
       selectedRecord: null,
       timeOut: null,
+      tableHeaders: [],
       pageStyle: this.paginationStyle ?? shRepo.getShConfig('tablePaginationStyle','loadMore')
     }
   },
   mounted () {
+    if(this.headers){
+      this.tableHeaders = this.headers;
+    }
     if (this.event) ;
     if (this.actions && this.actions.actions) {
       this.actions.actions.forEach(action => {
@@ -4172,7 +4227,13 @@ var script$a = {
       if (this.pagination_data) {
         this.pagination_data.loading = 1;
       }
-      shApis.doGet(this.endPoint, data).then(req => {
+      let endPoint = this.endPoint;
+      if(!this.endPoint && this.query){
+        //send ql query
+        endPoint = 'sh-ql';
+        data.query = this.query;
+      }
+      shApis.doGet(endPoint, data).then(req => {
         this.$emit('dataReloaded', this.pagination_data);
         this.loading = 'done';
         const response = req.data.data;
@@ -4185,6 +4246,9 @@ var script$a = {
           loading: 0,
           displayCount: response.total > response.per_page ? response.per_page : response.total
         };
+        if(!this.headers && response.total > 0){
+          this.tableHeaders = Object.keys(response.data[0]);
+        }
         if (append) {
           this.records.push(...response.data);
           let totalShown = response.total > response.per_page ? response.per_page * response.current_page : response.total;
@@ -4486,7 +4550,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             }, [
               vue.createElementVNode("thead", _hoisted_21, [
                 vue.createElementVNode("tr", null, [
-                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.headers, (title) => {
+                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($data.tableHeaders, (title) => {
                     return (vue.openBlock(), vue.createElementBlock("th", { key: title }, [
                       (typeof title === 'string')
                         ? (vue.openBlock(), vue.createElementBlock("a", {
@@ -4518,19 +4582,19 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                 ($data.loading === 'loading')
                   ? (vue.openBlock(), vue.createElementBlock("tr", _hoisted_27, [
                       vue.createElementVNode("td", {
-                        colspan: $props.headers.length
+                        colspan: $data.tableHeaders.length
                       }, _hoisted_30, 8 /* PROPS */, _hoisted_28)
                     ]))
                   : ($data.loading === 'error')
                     ? (vue.openBlock(), vue.createElementBlock("tr", _hoisted_31, [
                         vue.createElementVNode("td", {
-                          colspan: $props.headers.length
+                          colspan: $data.tableHeaders.length
                         }, vue.toDisplayString($data.loading_error), 9 /* TEXT, PROPS */, _hoisted_32)
                       ]))
                     : ($data.records.length === 0)
                       ? (vue.openBlock(), vue.createElementBlock("tr", _hoisted_33, [
                           vue.createElementVNode("td", {
-                            colspan: $props.actions ? $props.headers.length + 1 : $props.headers.length
+                            colspan: $props.actions ? $data.tableHeaders.length + 1 : $data.tableHeaders.length
                           }, [
                             _hoisted_35,
                             vue.createTextVNode(" No records found ")
@@ -4543,7 +4607,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                               class: vue.normalizeClass(record.class),
                               onClick: $event => ($options.rowSelected(record))
                             }, [
-                              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.headers, (key) => {
+                              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($data.tableHeaders, (key) => {
                                 return (vue.openBlock(), vue.createElementBlock("td", { key: key }, [
                                   (typeof key === 'string' && $props.links && $props.links[key])
                                     ? (vue.openBlock(), vue.createBlock(_component_router_link, {
@@ -4704,7 +4768,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                             class: "single-mobile-req bg-light p-3",
                             onClick: $event => ($options.rowSelected(record))
                           }, [
-                            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.headers, (key) => {
+                            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($data.tableHeaders, (key) => {
                               return (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
                                 key: key[0]
                               }, [
@@ -5248,7 +5312,7 @@ const _hoisted_6$3 = {
   key: 1,
   class: "d-flex flex-column w-100 px-2"
 };
-const _hoisted_7$2 = ["checked", "disabled"];
+const _hoisted_7$2 = ["checked", "onClick", "disabled"];
 const _hoisted_8$2 = ["onClick"];
 const _hoisted_9$2 = {
   id: "permissions-content",
@@ -5348,7 +5412,7 @@ const setPermissionsChanged = ()=>{
   permissionsChanged.value = true;
   return true
 };
-const checkAllPermissions = ()=>{
+const checkAllPermissions = (module)=>{
   if(selectedPermissions.value.length > 0) {
     selectedPermissions.value = [];
   } else {
@@ -5360,6 +5424,7 @@ const checkAllPermissions = ()=>{
         selectedPermissions.value.push(permission);
       });
     });
+    selectedPermissions.value.push(module);
   }
   permissionsChanged.value = true;
 };
@@ -5386,7 +5451,7 @@ return (_ctx, _cache) => {
               }, [
                 vue.createElementVNode("input", {
                   checked: departmentModules.value.includes(module),
-                  onClick: checkAllPermissions,
+                  onClick: $event => (checkAllPermissions(module)),
                   disabled: selectedModule.value !== module,
                   type: "checkbox"
                 }, null, 8 /* PROPS */, _hoisted_7$2),

package/dist/library.mjs

@@ -2,7 +2,7 @@ import Axios from 'axios';
 import moment from 'moment';
 import Swal from 'sweetalert2';
 import NProgress from 'nprogress';
-import { openBlock, createElementBlock, createElementVNode, createTextVNode, toDisplayString, createCommentVNode, withDirectives, Fragment, renderList, vModelSelect, vModelText, ref, onMounted, unref, normalizeClass, resolveComponent, createBlock, resolveDynamicComponent, inject, watch, mergeProps, normalizeStyle, renderSlot, createVNode, normalizeProps, guardReactiveProps, withCtx, createStaticVNode, shallowRef, vModelCheckbox, pushScopeId, popScopeId, markRaw, computed, isRef } from 'vue';
+import { openBlock, createElementBlock, createElementVNode, createTextVNode, toDisplayString, createCommentVNode, withDirectives, Fragment, renderList, vModelSelect, vModelText, ref, onMounted, unref, normalizeClass, resolveComponent, createBlock, resolveDynamicComponent, watch, inject, mergeProps, normalizeStyle, renderSlot, createVNode, normalizeProps, guardReactiveProps, withCtx, createStaticVNode, shallowRef, vModelCheckbox, pushScopeId, popScopeId, markRaw, computed, isRef } from 'vue';
 import _ from 'lodash';
 import { useRoute, useRouter } from 'vue-router';
 import { defineStore, storeToRefs } from 'pinia';
@@ -1884,6 +1884,14 @@ var script$s = {
   mounted () {
     this.setSelectedCountry();
   },
+  watch: {
+    modelValue: function(newVal){
+      if(!this.input){
+        let phone = newVal.replace('+254','');
+        this.input = phone.replace('+1','');
+      }
+    }
+  },
   methods: {
     updateValue: function () {
       let phone = this.input;
@@ -1979,7 +1987,7 @@ const _hoisted_4$c = ["onClick"];
 const _hoisted_5$a = ["id"];
 const _hoisted_6$9 = ["id", "aria-labelledby"];
 const _hoisted_7$7 = { key: 0 };
-const _hoisted_8$5 = ["onClick"];
+const _hoisted_8$6 = ["onClick"];
 const _hoisted_9$6 = {
   key: 1,
   class: "dropdown-item sh-suggest-no-results"
@@ -2115,7 +2123,7 @@ return (_ctx, _cache) => {
                           onClick: $event => (addSuggestion(suggestion)),
                           class: normalizeClass(["dropdown-item", unref(selectedSuggestions).includes(suggestion) ? 'active':'']),
                           href: "#"
-                        }, toDisplayString(suggestion.name ?? suggestion.text), 11 /* TEXT, CLASS, PROPS */, _hoisted_8$5)
+                        }, toDisplayString(suggestion.name ?? suggestion.text), 11 /* TEXT, CLASS, PROPS */, _hoisted_8$6)
                       ]))
                     : createCommentVNode("v-if", true)
                 ], 64 /* STABLE_FRAGMENT */))
@@ -2475,7 +2483,7 @@ const _hoisted_4$b = /*#__PURE__*/createElementVNode("i", { class: "bi-exclamati
 const _hoisted_5$9 = { key: 0 };
 const _hoisted_6$8 = { key: 1 };
 const _hoisted_7$6 = { class: "row" };
-const _hoisted_8$4 = { class: "fg-label control-label text-capitalize control-bel col-md-12 request-form-label mb-2" };
+const _hoisted_8$5 = { class: "fg-label control-label text-capitalize control-bel col-md-12 request-form-label mb-2" };
 const _hoisted_9$5 = { class: "col-md-12" };
 const _hoisted_10$4 = ["data-cy", "placeholder", "name", "onFocus", "onChange"];
 const _hoisted_11$3 = ["data-cy", "placeholder", "name", "onFocus", "onUpdate:modelValue"];
@@ -2547,7 +2555,7 @@ function render$2(_ctx, _cache, $props, $setup, $data, $options) {
             class: normalizeClass(["form-group", 'col-md-' + $options.getColumns()]),
             key: field
           }, [
-            createElementVNode("label", _hoisted_8$4, toDisplayString($options.getLabel(field)), 1 /* TEXT */),
+            createElementVNode("label", _hoisted_8$5, toDisplayString($options.getLabel(field)), 1 /* TEXT */),
             createElementVNode("div", _hoisted_9$5, [
               ($options.getFieldType(field) === 'component')
                 ? (openBlock(), createBlock(resolveDynamicComponent($props.customComponent[field]), {
@@ -2750,7 +2758,11 @@ const modelValueUpdated = (e) => {
 onMounted(()=>{
   props.modelValue && (inputModel.value = props.modelValue);
 });
-
+watch(()=>props.modelValue, (newValue)=>{
+  if(newValue) {
+    inputModel.value = newValue;
+  }
+});
 
 return (_ctx, _cache) => {
   return withDirectives((openBlock(), createElementBlock("input", {
@@ -2791,7 +2803,11 @@ const modelValueUpdated = (e) => {
 onMounted(()=>{
   props.modelValue && (inputModel.value = props.modelValue);
 });
-
+watch(()=>props.modelValue, (newValue)=>{
+  if(newValue) {
+    inputModel.value = newValue;
+  }
+});
 
 return (_ctx, _cache) => {
   return withDirectives((openBlock(), createElementBlock("input", {
@@ -2832,6 +2848,12 @@ onMounted(()=>{
   props.modelValue && (inputModel.value = props.modelValue);
 });
 
+watch(()=>props.modelValue, (newValue)=>{
+  if(newValue) {
+    inputModel.value = newValue;
+  }
+});
+
 
 return (_ctx, _cache) => {
   return withDirectives((openBlock(), createElementBlock("input", {
@@ -2869,7 +2891,11 @@ const modelValueUpdated = (e) => {
 onMounted(()=>{
   props.modelValue && (inputModel.value = props.modelValue);
 });
-
+watch(()=>props.modelValue, (newValue)=>{
+  if(newValue) {
+    inputModel.value = newValue;
+  }
+});
 
 return (_ctx, _cache) => {
   return withDirectives((openBlock(), createElementBlock("textarea", {
@@ -2929,7 +2955,11 @@ onMounted(()=>{
     });
   }
 });
-
+watch(()=>props.modelValue, (newValue)=>{
+  if(newValue) {
+    inputModel.value = newValue;
+  }
+});
 
 return (_ctx, _cache) => {
   return withDirectives((openBlock(), createElementBlock("select", {
@@ -2993,17 +3023,18 @@ return (_ctx, _cache) => {
 script$k.__file = "src/lib/components/form-components/PasswordInput.vue";
 
 const _hoisted_1$i = /*#__PURE__*/createElementVNode("div", null, null, -1 /* HOISTED */);
-const _hoisted_2$b = ["innerHTML"];
+const _hoisted_2$b = ["onUpdate:modelValue"];
 const _hoisted_3$a = ["innerHTML"];
 const _hoisted_4$a = ["innerHTML"];
-const _hoisted_5$8 = ["disabled"];
-const _hoisted_6$7 = {
+const _hoisted_5$8 = ["innerHTML"];
+const _hoisted_6$7 = ["disabled"];
+const _hoisted_7$5 = {
   key: 0,
   class: "spinner-border spinner-border-sm",
   role: "status",
   "aria-hidden": "true"
 };
-const _hoisted_7$5 = { key: 1 };
+const _hoisted_8$4 = { key: 1 };
 
 
 var script$j = {
@@ -3082,7 +3113,7 @@ shFormElementClasses.value = inject('shFormElementClasses');
 const shAutoForm = ref(null);
 const closeModal = e => {
   setTimeout(() => {
-    const modal = script$j.value.closest('.modal-dialog');
+    const modal = shAutoForm.value.closest('.modal-dialog');
     if(modal){
       const closeBtn = modal.querySelector('[data-bs-dismiss="modal"]');
       closeBtn && closeBtn.click();
@@ -3139,17 +3170,24 @@ const submitForm = e => {
   return false
 };
 const submitBtnWidth = ref(null);
-const setExistingData = ()=>{
-  console.log(props.currentData, formFields.value);
-  const existingData = props.currentData;
+const setExistingData = (existingData)=>{
   if (props.currentData) {
-    formFields.value.map(field=>{
-      existingData[field.field] && (field.value = existingData[field.field]);
+    const newFields = formFields.value.map(fl=>{
+      if(existingData[fl.field]) {
+        fl.value = existingData[fl.field];
+      }
+      return fl
+      // console.log(fl)
+      // console.log(field, existingData)
+      // existingData[field.field] && (field.value = existingData[field.field])
     });
+    formFields.value = null;
+    console.log(newFields);
+    formFields.value = newFields;
   }
 };
-watch(()=>props.currentData,()=>{
-  setExistingData();
+watch(()=>props.currentData,(newData)=>{
+  setExistingData(newData);
 });
 onMounted((ev)=>{
   props.fields && props.fields.map(field=>{
@@ -3171,8 +3209,13 @@ onMounted((ev)=>{
         value: null
       });
     }
+    formFields.value.push({
+      field: 'id',
+      type: 'hidden'
+      // label: 'IF'
+    });
   });
-  setExistingData();
+  setExistingData(props.currentData);
 });
 
 
@@ -3190,42 +3233,50 @@ return (_ctx, _cache) => {
           key: field,
           class: normalizeClass(getElementClass('formGroup'))
         }, [
-          (!unref(isFloating) && field.label)
-            ? (openBlock(), createElementBlock("label", {
+          (field.type === 'hidden')
+            ? withDirectives((openBlock(), createElementBlock("input", {
                 key: 0,
-                class: normalizeClass(getElementClass('formLabel')),
-                innerHTML: field.label
-              }, null, 10 /* CLASS, PROPS */, _hoisted_2$b))
-            : createCommentVNode("v-if", true),
-          (openBlock(), createBlock(resolveDynamicComponent(getFieldComponent(field)), mergeProps(getComponentProps(field), {
-            isInvalid: typeof validationErrors.value[field.field] !== 'undefined',
-            onClick: $event => (removeValidationError(field.field)),
-            "onUpdate:modelValue": [$event => (removeValidationError(field.field)), $event => ((formFields.value[index].value) = $event)],
-            modelValue: formFields.value[index].value,
-            class: getComponentClass(field.field)
-          }), null, 16 /* FULL_PROPS */, ["isInvalid", "onClick", "onUpdate:modelValue", "modelValue", "class"])),
-          (unref(isFloating) && field.label)
-            ? (openBlock(), createElementBlock("label", {
-                key: 1,
-                class: normalizeClass(getElementClass('formLabel')),
-                innerHTML: field.label
-              }, null, 10 /* CLASS, PROPS */, _hoisted_3$a))
-            : createCommentVNode("v-if", true),
-          (field.helper)
-            ? (openBlock(), createElementBlock("div", {
-                key: 2,
-                class: normalizeClass(getElementClass('helperText')),
-                innerHTML: field.helper
-              }, null, 10 /* CLASS, PROPS */, _hoisted_4$a))
-            : createCommentVNode("v-if", true),
-          (validationErrors.value[field.field])
-            ? (openBlock(), createElementBlock("div", {
-                key: 3,
-                class: normalizeClass(getElementClass('invalidFeedback'))
-              }, toDisplayString(validationErrors.value[field.field]), 3 /* TEXT, CLASS */))
-            : createCommentVNode("v-if", true),
-          createCommentVNode("      <h5>{{ getFieldComponent(field) }}</h5>"),
-          createCommentVNode("      <h5>{{ getComponentProps(field) }}</h5>")
+                type: "hidden",
+                "onUpdate:modelValue": $event => ((formFields.value[index].value) = $event)
+              }, null, 8 /* PROPS */, _hoisted_2$b)), [
+                [vModelText, formFields.value[index].value]
+              ])
+            : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                (!unref(isFloating) && field.label)
+                  ? (openBlock(), createElementBlock("label", {
+                      key: 0,
+                      class: normalizeClass(getElementClass('formLabel')),
+                      innerHTML: field.label
+                    }, null, 10 /* CLASS, PROPS */, _hoisted_3$a))
+                  : createCommentVNode("v-if", true),
+                (openBlock(), createBlock(resolveDynamicComponent(getFieldComponent(field)), mergeProps(getComponentProps(field), {
+                  isInvalid: typeof validationErrors.value[field.field] !== 'undefined',
+                  onClick: $event => (removeValidationError(field.field)),
+                  "onUpdate:modelValue": [$event => (removeValidationError(field.field)), $event => ((formFields.value[index].value) = $event)],
+                  modelValue: formFields.value[index].value,
+                  class: getComponentClass(field.field)
+                }), null, 16 /* FULL_PROPS */, ["isInvalid", "onClick", "onUpdate:modelValue", "modelValue", "class"])),
+                (unref(isFloating) && field.label)
+                  ? (openBlock(), createElementBlock("label", {
+                      key: 1,
+                      class: normalizeClass(getElementClass('formLabel')),
+                      innerHTML: field.label
+                    }, null, 10 /* CLASS, PROPS */, _hoisted_4$a))
+                  : createCommentVNode("v-if", true),
+                (field.helper)
+                  ? (openBlock(), createElementBlock("div", {
+                      key: 2,
+                      class: normalizeClass(getElementClass('helperText')),
+                      innerHTML: field.helper
+                    }, null, 10 /* CLASS, PROPS */, _hoisted_5$8))
+                  : createCommentVNode("v-if", true),
+                (validationErrors.value[field.field])
+                  ? (openBlock(), createElementBlock("div", {
+                      key: 3,
+                      class: normalizeClass(getElementClass('invalidFeedback'))
+                    }, toDisplayString(validationErrors.value[field.field]), 3 /* TEXT, CLASS */))
+                  : createCommentVNode("v-if", true)
+              ], 64 /* STABLE_FRAGMENT */))
         ], 2 /* CLASS */))
       }), 128 /* KEYED_FRAGMENT */)),
       createElementVNode("div", {
@@ -3239,12 +3290,12 @@ return (_ctx, _cache) => {
           class: normalizeClass(getElementClass('actionBtn'))
         }, [
           (loading.value)
-            ? (openBlock(), createElementBlock("span", _hoisted_6$7))
+            ? (openBlock(), createElementBlock("span", _hoisted_7$5))
             : createCommentVNode("v-if", true),
           (!loading.value)
-            ? (openBlock(), createElementBlock("span", _hoisted_7$5, "Submit"))
+            ? (openBlock(), createElementBlock("span", _hoisted_8$4, "Submit"))
             : createCommentVNode("v-if", true)
-        ], 14 /* CLASS, STYLE, PROPS */, _hoisted_5$8)
+        ], 14 /* CLASS, STYLE, PROPS */, _hoisted_6$7)
       ], 2 /* CLASS */)
     ], 34 /* CLASS, HYDRATE_EVENTS */)
   ], 64 /* STABLE_FRAGMENT */))
@@ -3971,7 +4022,7 @@ script$b.__file = "src/lib/components/ShSilentAction.vue";
 
 var script$a = {
   name: 'sh-table',
-  props: ['endPoint', 'headers', 'pageCount', 'actions', 'hideCount', 'hideLoadMore', 'links', 'reload', 'hideSearch', 'sharedData', 'searchPlaceholder', 'event', 'displayMore', 'displayMoreBtnClass', 'moreDetailsColumns', 'moreDetailsFields', 'hasDownload', 'downloadFields', 'tableHover', 'hideIds', 'paginationStyle'],
+  props: ['endPoint', 'headers','query', 'pageCount', 'actions', 'hideCount', 'hideLoadMore', 'links', 'reload', 'hideSearch', 'sharedData', 'searchPlaceholder', 'event', 'displayMore', 'displayMoreBtnClass', 'moreDetailsColumns', 'moreDetailsFields', 'hasDownload', 'downloadFields', 'tableHover', 'hideIds', 'paginationStyle'],
   inject: ['channel'],
   data () {
     return {
@@ -3992,10 +4043,14 @@ var script$a = {
       hasCanvas: 0,
       selectedRecord: null,
       timeOut: null,
+      tableHeaders: [],
       pageStyle: this.paginationStyle ?? shRepo.getShConfig('tablePaginationStyle','loadMore')
     }
   },
   mounted () {
+    if(this.headers){
+      this.tableHeaders = this.headers;
+    }
     if (this.event) ;
     if (this.actions && this.actions.actions) {
       this.actions.actions.forEach(action => {
@@ -4160,7 +4215,13 @@ var script$a = {
       if (this.pagination_data) {
         this.pagination_data.loading = 1;
       }
-      shApis.doGet(this.endPoint, data).then(req => {
+      let endPoint = this.endPoint;
+      if(!this.endPoint && this.query){
+        //send ql query
+        endPoint = 'sh-ql';
+        data.query = this.query;
+      }
+      shApis.doGet(endPoint, data).then(req => {
         this.$emit('dataReloaded', this.pagination_data);
         this.loading = 'done';
         const response = req.data.data;
@@ -4173,6 +4234,9 @@ var script$a = {
           loading: 0,
           displayCount: response.total > response.per_page ? response.per_page : response.total
         };
+        if(!this.headers && response.total > 0){
+          this.tableHeaders = Object.keys(response.data[0]);
+        }
         if (append) {
           this.records.push(...response.data);
           let totalShown = response.total > response.per_page ? response.per_page * response.current_page : response.total;
@@ -4474,7 +4538,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             }, [
               createElementVNode("thead", _hoisted_21, [
                 createElementVNode("tr", null, [
-                  (openBlock(true), createElementBlock(Fragment, null, renderList($props.headers, (title) => {
+                  (openBlock(true), createElementBlock(Fragment, null, renderList($data.tableHeaders, (title) => {
                     return (openBlock(), createElementBlock("th", { key: title }, [
                       (typeof title === 'string')
                         ? (openBlock(), createElementBlock("a", {
@@ -4506,19 +4570,19 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                 ($data.loading === 'loading')
                   ? (openBlock(), createElementBlock("tr", _hoisted_27, [
                       createElementVNode("td", {
-                        colspan: $props.headers.length
+                        colspan: $data.tableHeaders.length
                       }, _hoisted_30, 8 /* PROPS */, _hoisted_28)
                     ]))
                   : ($data.loading === 'error')
                     ? (openBlock(), createElementBlock("tr", _hoisted_31, [
                         createElementVNode("td", {
-                          colspan: $props.headers.length
+                          colspan: $data.tableHeaders.length
                         }, toDisplayString($data.loading_error), 9 /* TEXT, PROPS */, _hoisted_32)
                       ]))
                     : ($data.records.length === 0)
                       ? (openBlock(), createElementBlock("tr", _hoisted_33, [
                           createElementVNode("td", {
-                            colspan: $props.actions ? $props.headers.length + 1 : $props.headers.length
+                            colspan: $props.actions ? $data.tableHeaders.length + 1 : $data.tableHeaders.length
                           }, [
                             _hoisted_35,
                             createTextVNode(" No records found ")
@@ -4531,7 +4595,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                               class: normalizeClass(record.class),
                               onClick: $event => ($options.rowSelected(record))
                             }, [
-                              (openBlock(true), createElementBlock(Fragment, null, renderList($props.headers, (key) => {
+                              (openBlock(true), createElementBlock(Fragment, null, renderList($data.tableHeaders, (key) => {
                                 return (openBlock(), createElementBlock("td", { key: key }, [
                                   (typeof key === 'string' && $props.links && $props.links[key])
                                     ? (openBlock(), createBlock(_component_router_link, {
@@ -4692,7 +4756,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                             class: "single-mobile-req bg-light p-3",
                             onClick: $event => ($options.rowSelected(record))
                           }, [
-                            (openBlock(true), createElementBlock(Fragment, null, renderList($props.headers, (key) => {
+                            (openBlock(true), createElementBlock(Fragment, null, renderList($data.tableHeaders, (key) => {
                               return (openBlock(), createElementBlock(Fragment, {
                                 key: key[0]
                               }, [
@@ -5236,7 +5300,7 @@ const _hoisted_6$3 = {
   key: 1,
   class: "d-flex flex-column w-100 px-2"
 };
-const _hoisted_7$2 = ["checked", "disabled"];
+const _hoisted_7$2 = ["checked", "onClick", "disabled"];
 const _hoisted_8$2 = ["onClick"];
 const _hoisted_9$2 = {
   id: "permissions-content",
@@ -5336,7 +5400,7 @@ const setPermissionsChanged = ()=>{
   permissionsChanged.value = true;
   return true
 };
-const checkAllPermissions = ()=>{
+const checkAllPermissions = (module)=>{
   if(selectedPermissions.value.length > 0) {
     selectedPermissions.value = [];
   } else {
@@ -5348,6 +5412,7 @@ const checkAllPermissions = ()=>{
         selectedPermissions.value.push(permission);
       });
     });
+    selectedPermissions.value.push(module);
   }
   permissionsChanged.value = true;
 };
@@ -5374,7 +5439,7 @@ return (_ctx, _cache) => {
               }, [
                 createElementVNode("input", {
                   checked: departmentModules.value.includes(module),
-                  onClick: checkAllPermissions,
+                  onClick: $event => (checkAllPermissions(module)),
                   disabled: selectedModule.value !== module,
                   type: "checkbox"
                 }, null, 8 /* PROPS */, _hoisted_7$2),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iankibetsh/shframework",
-  "version": "1.8.0",
+  "version": "1.8.3",
   "description": "Vue library for handling laravel backend",
   "main": "dist/library.js",
   "module": "dist/library.mjs",
@@ -23,6 +23,7 @@
   "license": "ISC",
   "peerDependencies": {
     "axios": "^0.27.2",
+    "bootstrap": "^5.3.0-alpha1",
     "bootstrap-icons": "^1.9.1",
     "moment": "^2.29.3",
     "nprogress": "^0.2.0",
@@ -37,8 +38,14 @@
     "rollup-plugin-dotenv": "^0.3.0",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-plugin-vue": "^6.0.0",
-    "vuepress": "^2.0.0-beta.48",
-    "bootstrap": "^5.2.0"
+    "@vitejs/plugin-vue": "^3.2.0",
+    "@vue/test-utils": "^2.2.4",
+    "eslint": "^8.22.0",
+    "eslint-plugin-vue": "^9.3.0",
+    "jsdom": "^20.0.3",
+    "sass": "^1.56.2",
+    "vite": "^3.2.4",
+    "vitest": "^0.25.3"
   },
   "dependencies": {
     "vue-router": "^4.1.4"