@iankibetsh/shframework 5.8.0 → 5.8.1

package/README.md

@@ -45,6 +45,7 @@ Enable multi-row selection and perform collective actions by passing the `multi-
       label: 'Delete Selected',
       class: 'btn-outline-danger',
       icon: 'bi-trash',
+      permission: 'delete_users',
       callback: (selectedRecords) => {
         // Handle action, e.g., send IDs to backend
         const ids = selectedRecords.map(r => r.id);

package/dist/dist/library.mjs.css

@@ -1,36 +1,4 @@
 
-.sh-phone{
-  display: flex;
-  width: 100%;
-  align-items: center;
-  padding: 0 0.25rem;
-}
-.phone-country{
-  width: 2rem;
-  border: none;
-  align-self: center;
-  outline: none !important;
-  padding: 0.4rem;
-  border-right: 1px solid #0003;
-}
-.phone-number{
-  width: calc(100% - 2.2rem);
-  border: none;
-  align-self: center;
-  outline: none;
-  margin-bottom: 0;
-  padding: 0.4rem;
-}
-.sh-phone img{
-  padding: 0.125rem;
-  width: 2rem;
-  height: 2rem;
-}
-.phone-number::placeholder{
-  font-weight: 300;
-  opacity: 0.5;
-}
-
 /* Step Container */
 .sh-form-steps-container {
   margin-bottom: 2.5rem;
@@ -292,6 +260,38 @@
   }
 }
 
+.sh-phone{
+  display: flex;
+  width: 100%;
+  align-items: center;
+  padding: 0 0.25rem;
+}
+.phone-country{
+  width: 2rem;
+  border: none;
+  align-self: center;
+  outline: none !important;
+  padding: 0.4rem;
+  border-right: 1px solid #0003;
+}
+.phone-number{
+  width: calc(100% - 2.2rem);
+  border: none;
+  align-self: center;
+  outline: none;
+  margin-bottom: 0;
+  padding: 0.4rem;
+}
+.sh-phone img{
+  padding: 0.125rem;
+  width: 2rem;
+  height: 2rem;
+}
+.phone-number::placeholder{
+  font-weight: 300;
+  opacity: 0.5;
+}
+
 .colored-toast.swal2-icon-success {
   background-color: #a5dc86 !important;
 }
@@ -333,22 +333,6 @@
   min-width: 300px;
 }
 
-.sh-selected-item{
-  line-height: unset!important;
-}
-.sh-suggestion-input{
-  padding: 0.375rem 0.75rem;
-}
-.sh-suggest{
-  margin-bottom: 1rem;
-  padding: 0rem 0rem;
-}
-.sh-suggest-control::after{
-  margin-top: auto;
-  margin-bottom: auto;
-  margin-right: 0.255em;
-}
-
 .permissions-main {
   background: #edeff2;
 }
@@ -381,6 +365,22 @@
   flex-grow: 1;
 }
 
+.sh-selected-item{
+  line-height: unset!important;
+}
+.sh-suggestion-input{
+  padding: 0.375rem 0.75rem;
+}
+.sh-suggest{
+  margin-bottom: 1rem;
+  padding: 0rem 0rem;
+}
+.sh-suggest-control::after{
+  margin-top: auto;
+  margin-bottom: auto;
+  margin-right: 0.255em;
+}
+
 .callout{
   --bs-link-color-rgb: 110,168,254;
   --bs-code-color: #e685b5;

package/dist/library.js

@@ -9,8 +9,8 @@ var bootstrap = require('bootstrap');
 var NProgress = require('nprogress');
 var vue = require('vue');
 var _ = require('lodash');
-var pinia = require('pinia');
 var vueRouter = require('vue-router');
+var pinia = require('pinia');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -4494,6 +4494,108 @@ return (_ctx, _cache) => {
 
 script$l.__file = "src/lib/components/ShCanvas.vue";
 
+const useUserStore = pinia.defineStore('user-store', {
+  state: () => ({
+    user: null,
+    role: null,
+    permissions: null,
+    menus: [],
+    loggedOut: false
+  }),
+  actions: {
+    setUser (defaultEndpoint) {
+      let user = null;
+      try {
+         user = shStorage.getItem('user') ? shStorage.getItem('user') : null;
+      } catch (error) {
+        user= null;
+      }
+      if(typeof user !== 'object'){
+        user = null;
+      }
+      if (user ) {
+        user.isAllowedTo = function (slug) {
+          if (this.permissions) {
+            let permissions = [];
+            if (typeof this.permissions === 'string') {
+              permissions = this.permissions;
+            } else {
+              permissions = this.permissions;
+            }
+            return permissions.includes(slug)
+          }
+          return false
+        };
+      }
+      this.user = user;
+      const userEndpoint = defaultEndpoint ?? vue.inject('userEndpoint','auth/user') ?? 'auth/user?defaults=1';
+
+      shApis.doGet(userEndpoint).then(res => {
+        let user = res.data.user;
+        if (typeof(user) === 'undefined') {
+           user = res.data;
+        }
+        shStorage.setItem('user',user);
+        user.signOut = this.signOut;
+        user.logout = this.signOut;
+        user.logOut = this.signOut;
+        user.isAllowedTo = function (slug) {
+          if(!slug){
+            return true
+          }
+          if (this.permissions) {
+            let permissions = [];
+            if (typeof this.permissions === 'string') {
+              permissions = this.permissions;
+            } else {
+              permissions = this.permissions;
+            }
+            return permissions.includes(slug)
+          }
+          return false
+        };
+        user.can = user.isAllowedTo;
+        this.user = user;
+      }).catch((reason) => {
+        if (reason.response && reason.response.status) {
+          if(reason.response.status === 401) {
+            shStorage.setItem('user',null);
+            this.user = null;
+          }
+          this.loggedOut = true;
+        }
+      });
+      if (this.user) {
+        if (typeof this.user.permissions === 'string') {
+          this.permissions = this.user.permissions;
+        } else {
+          this.permissions = this.user.permissions;
+        }
+      }
+      const timeNow = luxon.DateTime.now().toISO();
+      shStorage.setItem('session_start',timeNow);
+    },
+    signOut () {
+      shRepo.signOutUser();
+    },
+    logOut () {
+      this.signOut();
+    },
+    getUser () {
+      this.setUser();
+    },
+    setAccessToken (accessToken) {
+      shStorage.setItem('access_token', accessToken);
+      this.setUser();
+    }
+  },
+  getters: {
+    userId (state) {
+      return state.user === null ? null:state.user.id
+    }
+  }
+});
+
 const _hoisted_1$g = { class: "callout callout-info" };
 
 function render$2(_ctx, _cache) {
@@ -4702,108 +4804,6 @@ return (_ctx, _cache) => {
 
 script$i.__file = "src/lib/components/ShSilentAction.vue";
 
-const useUserStore = pinia.defineStore('user-store', {
-  state: () => ({
-    user: null,
-    role: null,
-    permissions: null,
-    menus: [],
-    loggedOut: false
-  }),
-  actions: {
-    setUser (defaultEndpoint) {
-      let user = null;
-      try {
-         user = shStorage.getItem('user') ? shStorage.getItem('user') : null;
-      } catch (error) {
-        user= null;
-      }
-      if(typeof user !== 'object'){
-        user = null;
-      }
-      if (user ) {
-        user.isAllowedTo = function (slug) {
-          if (this.permissions) {
-            let permissions = [];
-            if (typeof this.permissions === 'string') {
-              permissions = this.permissions;
-            } else {
-              permissions = this.permissions;
-            }
-            return permissions.includes(slug)
-          }
-          return false
-        };
-      }
-      this.user = user;
-      const userEndpoint = defaultEndpoint ?? vue.inject('userEndpoint','auth/user') ?? 'auth/user?defaults=1';
-
-      shApis.doGet(userEndpoint).then(res => {
-        let user = res.data.user;
-        if (typeof(user) === 'undefined') {
-           user = res.data;
-        }
-        shStorage.setItem('user',user);
-        user.signOut = this.signOut;
-        user.logout = this.signOut;
-        user.logOut = this.signOut;
-        user.isAllowedTo = function (slug) {
-          if(!slug){
-            return true
-          }
-          if (this.permissions) {
-            let permissions = [];
-            if (typeof this.permissions === 'string') {
-              permissions = this.permissions;
-            } else {
-              permissions = this.permissions;
-            }
-            return permissions.includes(slug)
-          }
-          return false
-        };
-        user.can = user.isAllowedTo;
-        this.user = user;
-      }).catch((reason) => {
-        if (reason.response && reason.response.status) {
-          if(reason.response.status === 401) {
-            shStorage.setItem('user',null);
-            this.user = null;
-          }
-          this.loggedOut = true;
-        }
-      });
-      if (this.user) {
-        if (typeof this.user.permissions === 'string') {
-          this.permissions = this.user.permissions;
-        } else {
-          this.permissions = this.user.permissions;
-        }
-      }
-      const timeNow = luxon.DateTime.now().toISO();
-      shStorage.setItem('session_start',timeNow);
-    },
-    signOut () {
-      shRepo.signOutUser();
-    },
-    logOut () {
-      this.signOut();
-    },
-    getUser () {
-      this.setUser();
-    },
-    setAccessToken (accessToken) {
-      shStorage.setItem('access_token', accessToken);
-      this.setUser();
-    }
-  },
-  getters: {
-    userId (state) {
-      return state.user === null ? null:state.user.id
-    }
-  }
-});
-
 const _hoisted_1$f = ["href"];
 const _hoisted_2$c = ["title"];
 
@@ -5741,6 +5741,15 @@ const getSlotName = (key) => {
   return ''
 };
 
+const {user} = pinia.storeToRefs(useUserStore());
+
+const activeMultiActions = vue.computed(() => {
+  return props.multiActions.filter(action => {
+    if (!action.permission) return true
+    return user.value.isAllowedTo(action.permission)
+  })
+});
+
 const cleanColumn = (col) => {
   const newCol = {...col};
   delete newCol.component;
@@ -6150,7 +6159,7 @@ return (_ctx, _cache) => {
             }, [
               vue.createElementVNode("thead", _hoisted_13$1, [
                 vue.createElementVNode("tr", null, [
-                  (__props.multiActions.length > 0)
+                  (activeMultiActions.value.length > 0)
                     ? (vue.openBlock(), vue.createElementBlock("th", _hoisted_14$1, [
                         vue.withDirectives(vue.createElementVNode("input", {
                           type: "checkbox",
@@ -6204,7 +6213,7 @@ return (_ctx, _cache) => {
                 (loading.value === 'loading')
                   ? (vue.openBlock(), vue.createElementBlock("tr", _hoisted_22, [
                       vue.createElementVNode("td", {
-                        colspan: __props.multiActions.length > 0 ? tableHeaders.value.length + 1 : tableHeaders.value.length
+                        colspan: activeMultiActions.value.length > 0 ? tableHeaders.value.length + 1 : tableHeaders.value.length
                       }, [...(_cache[16] || (_cache[16] = [
                         vue.createElementVNode("div", { class: "text-center" }, [
                           vue.createElementVNode("div", {
@@ -6219,13 +6228,13 @@ return (_ctx, _cache) => {
                   : (loading.value === 'error')
                     ? (vue.openBlock(), vue.createElementBlock("tr", _hoisted_24, [
                         vue.createElementVNode("td", {
-                          colspan: __props.multiActions.length > 0 ? tableHeaders.value.length + 1 : tableHeaders.value.length
+                          colspan: activeMultiActions.value.length > 0 ? tableHeaders.value.length + 1 : tableHeaders.value.length
                         }, vue.toDisplayString(loading_error.value), 9 /* TEXT, PROPS */, _hoisted_25)
                       ]))
                     : (records.value.length === 0)
                       ? (vue.openBlock(), vue.createElementBlock("tr", _hoisted_26, [
                           vue.createElementVNode("td", {
-                            colspan: __props.actions ? tableHeaders.value.length + (__props.multiActions.length > 0 ? 2:1) : tableHeaders.value.length + (__props.multiActions.length > 0 ? 1:0)
+                            colspan: __props.actions ? tableHeaders.value.length + (activeMultiActions.value.length > 0 ? 2:1) : tableHeaders.value.length + (activeMultiActions.value.length > 0 ? 1:0)
                           }, [...(_cache[17] || (_cache[17] = [
                             vue.createElementVNode("div", { class: "text-center bg-primary-light px-2 py-1 rounded no_records_div" }, [
                               vue.createElementVNode("i", { class: "bi-info-circle" }),
@@ -6240,7 +6249,7 @@ return (_ctx, _cache) => {
                               class: vue.normalizeClass(record.class),
                               onClick: $event => (rowSelected(record))
                             }, [
-                              (__props.multiActions.length > 0)
+                              (activeMultiActions.value.length > 0)
                                 ? (vue.openBlock(), vue.createElementBlock("td", {
                                     key: 0,
                                     onClick: _cache[5] || (_cache[5] = vue.withModifiers(() => {}, ["stop"]))
@@ -6353,7 +6362,7 @@ return (_ctx, _cache) => {
                             class: "single-mobile-req bg-light p-3",
                             onClick: $event => (rowSelected(record))
                           }, [
-                            (__props.multiActions.length > 0)
+                            (activeMultiActions.value.length > 0)
                               ? (vue.openBlock(), vue.createElementBlock("div", {
                                   key: 0,
                                   class: "mb-2",
@@ -6500,14 +6509,14 @@ return (_ctx, _cache) => {
           ], 64 /* STABLE_FRAGMENT */))
         }), 128 /* KEYED_FRAGMENT */))
       : vue.createCommentVNode("v-if", true),
-    (selectedItems.value.length > 0)
+    (selectedItems.value.length > 0 && activeMultiActions.value.length > 0)
       ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_63, [
           vue.createElementVNode("div", null, [
             vue.createElementVNode("span", _hoisted_64, vue.toDisplayString(selectedItems.value.length), 1 /* TEXT */),
             _cache[20] || (_cache[20] = vue.createTextVNode(" items selected ", -1 /* CACHED */))
           ]),
           vue.createElementVNode("div", _hoisted_65, [
-            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.multiActions, (action) => {
+            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(activeMultiActions.value, (action) => {
               return (vue.openBlock(), vue.createElementBlock("button", {
                 key: action.label,
                 class: vue.normalizeClass(["btn btn-sm", action.class ?? 'btn-outline-primary']),

package/dist/library.mjs

@@ -5,8 +5,8 @@ import { Modal, Offcanvas } from 'bootstrap';
 import NProgress from 'nprogress';
 import { ref, computed, watch, onMounted, openBlock, createElementBlock, createElementVNode, createTextVNode, toDisplayString, createCommentVNode, withDirectives, Fragment, renderList, unref, vModelSelect, vModelText, normalizeClass, createBlock, resolveDynamicComponent, resolveComponent, inject, useTemplateRef, mergeProps, vShow, renderSlot, normalizeStyle, Teleport, createVNode, withCtx, useSlots, onBeforeUnmount, reactive, vModelCheckbox, withModifiers, resolveDirective, shallowRef, markRaw, isRef } from 'vue';
 import _ from 'lodash';
-import { defineStore, storeToRefs } from 'pinia';
 import { useRoute, useRouter } from 'vue-router';
+import { defineStore, storeToRefs } from 'pinia';
 
 function setItem (key, value) {
   let toStore = value;
@@ -4483,6 +4483,108 @@ return (_ctx, _cache) => {
 
 script$l.__file = "src/lib/components/ShCanvas.vue";
 
+const useUserStore = defineStore('user-store', {
+  state: () => ({
+    user: null,
+    role: null,
+    permissions: null,
+    menus: [],
+    loggedOut: false
+  }),
+  actions: {
+    setUser (defaultEndpoint) {
+      let user = null;
+      try {
+         user = shStorage.getItem('user') ? shStorage.getItem('user') : null;
+      } catch (error) {
+        user= null;
+      }
+      if(typeof user !== 'object'){
+        user = null;
+      }
+      if (user ) {
+        user.isAllowedTo = function (slug) {
+          if (this.permissions) {
+            let permissions = [];
+            if (typeof this.permissions === 'string') {
+              permissions = this.permissions;
+            } else {
+              permissions = this.permissions;
+            }
+            return permissions.includes(slug)
+          }
+          return false
+        };
+      }
+      this.user = user;
+      const userEndpoint = defaultEndpoint ?? inject('userEndpoint','auth/user') ?? 'auth/user?defaults=1';
+
+      shApis.doGet(userEndpoint).then(res => {
+        let user = res.data.user;
+        if (typeof(user) === 'undefined') {
+           user = res.data;
+        }
+        shStorage.setItem('user',user);
+        user.signOut = this.signOut;
+        user.logout = this.signOut;
+        user.logOut = this.signOut;
+        user.isAllowedTo = function (slug) {
+          if(!slug){
+            return true
+          }
+          if (this.permissions) {
+            let permissions = [];
+            if (typeof this.permissions === 'string') {
+              permissions = this.permissions;
+            } else {
+              permissions = this.permissions;
+            }
+            return permissions.includes(slug)
+          }
+          return false
+        };
+        user.can = user.isAllowedTo;
+        this.user = user;
+      }).catch((reason) => {
+        if (reason.response && reason.response.status) {
+          if(reason.response.status === 401) {
+            shStorage.setItem('user',null);
+            this.user = null;
+          }
+          this.loggedOut = true;
+        }
+      });
+      if (this.user) {
+        if (typeof this.user.permissions === 'string') {
+          this.permissions = this.user.permissions;
+        } else {
+          this.permissions = this.user.permissions;
+        }
+      }
+      const timeNow = DateTime.now().toISO();
+      shStorage.setItem('session_start',timeNow);
+    },
+    signOut () {
+      shRepo.signOutUser();
+    },
+    logOut () {
+      this.signOut();
+    },
+    getUser () {
+      this.setUser();
+    },
+    setAccessToken (accessToken) {
+      shStorage.setItem('access_token', accessToken);
+      this.setUser();
+    }
+  },
+  getters: {
+    userId (state) {
+      return state.user === null ? null:state.user.id
+    }
+  }
+});
+
 const _hoisted_1$g = { class: "callout callout-info" };
 
 function render$2(_ctx, _cache) {
@@ -4691,108 +4793,6 @@ return (_ctx, _cache) => {
 
 script$i.__file = "src/lib/components/ShSilentAction.vue";
 
-const useUserStore = defineStore('user-store', {
-  state: () => ({
-    user: null,
-    role: null,
-    permissions: null,
-    menus: [],
-    loggedOut: false
-  }),
-  actions: {
-    setUser (defaultEndpoint) {
-      let user = null;
-      try {
-         user = shStorage.getItem('user') ? shStorage.getItem('user') : null;
-      } catch (error) {
-        user= null;
-      }
-      if(typeof user !== 'object'){
-        user = null;
-      }
-      if (user ) {
-        user.isAllowedTo = function (slug) {
-          if (this.permissions) {
-            let permissions = [];
-            if (typeof this.permissions === 'string') {
-              permissions = this.permissions;
-            } else {
-              permissions = this.permissions;
-            }
-            return permissions.includes(slug)
-          }
-          return false
-        };
-      }
-      this.user = user;
-      const userEndpoint = defaultEndpoint ?? inject('userEndpoint','auth/user') ?? 'auth/user?defaults=1';
-
-      shApis.doGet(userEndpoint).then(res => {
-        let user = res.data.user;
-        if (typeof(user) === 'undefined') {
-           user = res.data;
-        }
-        shStorage.setItem('user',user);
-        user.signOut = this.signOut;
-        user.logout = this.signOut;
-        user.logOut = this.signOut;
-        user.isAllowedTo = function (slug) {
-          if(!slug){
-            return true
-          }
-          if (this.permissions) {
-            let permissions = [];
-            if (typeof this.permissions === 'string') {
-              permissions = this.permissions;
-            } else {
-              permissions = this.permissions;
-            }
-            return permissions.includes(slug)
-          }
-          return false
-        };
-        user.can = user.isAllowedTo;
-        this.user = user;
-      }).catch((reason) => {
-        if (reason.response && reason.response.status) {
-          if(reason.response.status === 401) {
-            shStorage.setItem('user',null);
-            this.user = null;
-          }
-          this.loggedOut = true;
-        }
-      });
-      if (this.user) {
-        if (typeof this.user.permissions === 'string') {
-          this.permissions = this.user.permissions;
-        } else {
-          this.permissions = this.user.permissions;
-        }
-      }
-      const timeNow = DateTime.now().toISO();
-      shStorage.setItem('session_start',timeNow);
-    },
-    signOut () {
-      shRepo.signOutUser();
-    },
-    logOut () {
-      this.signOut();
-    },
-    getUser () {
-      this.setUser();
-    },
-    setAccessToken (accessToken) {
-      shStorage.setItem('access_token', accessToken);
-      this.setUser();
-    }
-  },
-  getters: {
-    userId (state) {
-      return state.user === null ? null:state.user.id
-    }
-  }
-});
-
 const _hoisted_1$f = ["href"];
 const _hoisted_2$c = ["title"];
 
@@ -5730,6 +5730,15 @@ const getSlotName = (key) => {
   return ''
 };
 
+const {user} = storeToRefs(useUserStore());
+
+const activeMultiActions = computed(() => {
+  return props.multiActions.filter(action => {
+    if (!action.permission) return true
+    return user.value.isAllowedTo(action.permission)
+  })
+});
+
 const cleanColumn = (col) => {
   const newCol = {...col};
   delete newCol.component;
@@ -6139,7 +6148,7 @@ return (_ctx, _cache) => {
             }, [
               createElementVNode("thead", _hoisted_13$1, [
                 createElementVNode("tr", null, [
-                  (__props.multiActions.length > 0)
+                  (activeMultiActions.value.length > 0)
                     ? (openBlock(), createElementBlock("th", _hoisted_14$1, [
                         withDirectives(createElementVNode("input", {
                           type: "checkbox",
@@ -6193,7 +6202,7 @@ return (_ctx, _cache) => {
                 (loading.value === 'loading')
                   ? (openBlock(), createElementBlock("tr", _hoisted_22, [
                       createElementVNode("td", {
-                        colspan: __props.multiActions.length > 0 ? tableHeaders.value.length + 1 : tableHeaders.value.length
+                        colspan: activeMultiActions.value.length > 0 ? tableHeaders.value.length + 1 : tableHeaders.value.length
                       }, [...(_cache[16] || (_cache[16] = [
                         createElementVNode("div", { class: "text-center" }, [
                           createElementVNode("div", {
@@ -6208,13 +6217,13 @@ return (_ctx, _cache) => {
                   : (loading.value === 'error')
                     ? (openBlock(), createElementBlock("tr", _hoisted_24, [
                         createElementVNode("td", {
-                          colspan: __props.multiActions.length > 0 ? tableHeaders.value.length + 1 : tableHeaders.value.length
+                          colspan: activeMultiActions.value.length > 0 ? tableHeaders.value.length + 1 : tableHeaders.value.length
                         }, toDisplayString(loading_error.value), 9 /* TEXT, PROPS */, _hoisted_25)
                       ]))
                     : (records.value.length === 0)
                       ? (openBlock(), createElementBlock("tr", _hoisted_26, [
                           createElementVNode("td", {
-                            colspan: __props.actions ? tableHeaders.value.length + (__props.multiActions.length > 0 ? 2:1) : tableHeaders.value.length + (__props.multiActions.length > 0 ? 1:0)
+                            colspan: __props.actions ? tableHeaders.value.length + (activeMultiActions.value.length > 0 ? 2:1) : tableHeaders.value.length + (activeMultiActions.value.length > 0 ? 1:0)
                           }, [...(_cache[17] || (_cache[17] = [
                             createElementVNode("div", { class: "text-center bg-primary-light px-2 py-1 rounded no_records_div" }, [
                               createElementVNode("i", { class: "bi-info-circle" }),
@@ -6229,7 +6238,7 @@ return (_ctx, _cache) => {
                               class: normalizeClass(record.class),
                               onClick: $event => (rowSelected(record))
                             }, [
-                              (__props.multiActions.length > 0)
+                              (activeMultiActions.value.length > 0)
                                 ? (openBlock(), createElementBlock("td", {
                                     key: 0,
                                     onClick: _cache[5] || (_cache[5] = withModifiers(() => {}, ["stop"]))
@@ -6342,7 +6351,7 @@ return (_ctx, _cache) => {
                             class: "single-mobile-req bg-light p-3",
                             onClick: $event => (rowSelected(record))
                           }, [
-                            (__props.multiActions.length > 0)
+                            (activeMultiActions.value.length > 0)
                               ? (openBlock(), createElementBlock("div", {
                                   key: 0,
                                   class: "mb-2",
@@ -6489,14 +6498,14 @@ return (_ctx, _cache) => {
           ], 64 /* STABLE_FRAGMENT */))
         }), 128 /* KEYED_FRAGMENT */))
       : createCommentVNode("v-if", true),
-    (selectedItems.value.length > 0)
+    (selectedItems.value.length > 0 && activeMultiActions.value.length > 0)
       ? (openBlock(), createElementBlock("div", _hoisted_63, [
           createElementVNode("div", null, [
             createElementVNode("span", _hoisted_64, toDisplayString(selectedItems.value.length), 1 /* TEXT */),
             _cache[20] || (_cache[20] = createTextVNode(" items selected ", -1 /* CACHED */))
           ]),
           createElementVNode("div", _hoisted_65, [
-            (openBlock(true), createElementBlock(Fragment, null, renderList(__props.multiActions, (action) => {
+            (openBlock(true), createElementBlock(Fragment, null, renderList(activeMultiActions.value, (action) => {
               return (openBlock(), createElementBlock("button", {
                 key: action.label,
                 class: normalizeClass(["btn btn-sm", action.class ?? 'btn-outline-primary']),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iankibetsh/shframework",
-  "version": "5.8.0",
+  "version": "5.8.1",
   "description": "Vue library for handling laravel backend",
   "repository": {
     "type": "git",