@iankibetsh/shframework 4.5.3 → 4.5.5

package/dist/dist/library.mjs.css

@@ -1,4 +1,36 @@
 
+.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;
 }
@@ -31,36 +63,20 @@
   color: white;
 }
 
-.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;
+.sh-selected-item{
+  line-height: unset!important;
 }
-.phone-number{
-  width: calc(100% - 2.2rem);
-  border: none;
-  align-self: center;
-  outline: none;
-  margin-bottom: 0;
-  padding: 0.4rem;
+.sh-suggestion-input{
+  padding: 0.375rem 0.75rem;
 }
-.sh-phone img{
-  padding: 0.125rem;
-  width: 2rem;
-  height: 2rem;
+.sh-suggest{
+  margin-bottom: 1rem;
+  padding: 0rem 0rem;
 }
-.phone-number::placeholder{
-  font-weight: 300;
-  opacity: 0.5;
+.sh-suggest-control::after{
+  margin-top: auto;
+  margin-bottom: auto;
+  margin-right: 0.255em;
 }
 
 .permissions-main {
@@ -95,22 +111,6 @@
   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

@@ -38,7 +38,7 @@ function getItem (key) {
 function removeItem (key) {
   return localStorage.removeItem(key)
 }
-var ShStorage = {
+var shStorage = {
   setItem,
   getItem,
   removeItem
@@ -144,21 +144,21 @@ const signOutUser = () => {
     const logoutApiEndPoint = getShConfig('logoutApiEndpoint', 'auth/logout');
     console.log(loginUrl, logoutApiEndPoint);
     shApis.doPost(logoutApiEndPoint).then(res => {
-        ShStorage.removeItem('access_token');
-        ShStorage.removeItem('user');
-        ShStorage.removeItem('last_activity');
+        shStorage.removeItem('access_token');
+        shStorage.removeItem('user');
+        shStorage.removeItem('last_activity');
         window.location.href = loginUrl;
     }).catch(ex => {
-        ShStorage.removeItem('access_token');
-        ShStorage.removeItem('user');
-        ShStorage.removeItem('last_activity');
+        shStorage.removeItem('access_token');
+        shStorage.removeItem('user');
+        shStorage.removeItem('last_activity');
         window.location.href = loginUrl;
     });
 };
 
 
 function getShConfig(key = null, def = ''){
-    const config = ShStorage.getItem('ShConfig') ?? {};
+    const config = shStorage.getItem('ShConfig') ?? {};
     if (key) {
         return config[key] ?? def
     }
@@ -296,17 +296,17 @@ function logoutUser(){
   }
 }
 function sessionRestored(){
-  const timeout = ShStorage.getItem('sessionTimeout') * 60;
-  const last_activity = ShStorage.getItem('last_activity');
+  const timeout = shStorage.getItem('sessionTimeout') * 60;
+  const last_activity = shStorage.getItem('last_activity');
   const pastSeconds = moment__default["default"]().diff(last_activity, 'seconds');
-  if(!ShStorage.getItem('access_token'))
+  if(!shStorage.getItem('access_token'))
     return false
   return pastSeconds < timeout
 }
 const checkSession = function (isCheking) {
-  const timeout = ShStorage.getItem('sessionTimeout');
-  const last_activity = ShStorage.getItem('last_activity');
-  if (ShStorage.getItem('access_token')) {
+  const timeout = shStorage.getItem('sessionTimeout');
+  const last_activity = shStorage.getItem('last_activity');
+  if (shStorage.getItem('access_token')) {
     const pastMinutes = moment__default["default"]().diff(last_activity, 'minutes');
     const pastSeconds = moment__default["default"]().diff(last_activity, 'seconds');
     if(pastMinutes >= timeout) {
@@ -364,17 +364,17 @@ async function shSwalLogout (seconds = 30) {
       window.ShConfirmation = null;
       clearInterval(window.shInterval);
       const timeNow = moment__default["default"]().toISOString();
-      ShStorage.setItem('last_activity', timeNow);
+      shStorage.setItem('last_activity', timeNow);
       startSession();
     }
   })
 }
 function startSession () {
   const timeNow = moment__default["default"]().toISOString();
-  const accessToken = ShStorage.getItem('access_token');
+  const accessToken = shStorage.getItem('access_token');
   if (accessToken) {
-    ShStorage.setItem('last_activity', timeNow);
-    const timout =  ShStorage.getItem('sessionTimeout');
+    shStorage.setItem('last_activity', timeNow);
+    const timout =  shStorage.getItem('sessionTimeout');
     const interval = (timout * 60 *1000) / 3;
     window.shInterval = setInterval(()=>{
       checkSession();
@@ -386,7 +386,7 @@ const updateSession = () =>{
     startSession();
   }
   const timeNow = moment__default["default"]().toISOString();
-  ShStorage.setItem('last_activity', timeNow);
+  shStorage.setItem('last_activity', timeNow);
 };
 
 const graphQlEndpoint = 'sh-ql';
@@ -407,7 +407,7 @@ function doGet (endPoint, data,extraConfig) {
   updateSession();
   let config = {
     headers: {
-      Authorization: 'Bearer ' + ShStorage.getItem('access_token')
+      Authorization: 'Bearer ' + shStorage.getItem('access_token')
     }
   };
     if (extraConfig) {
@@ -423,7 +423,7 @@ function doPost (endPoint, data, extraConfig) {
   updateSession();
   const config = {
     headers: {
-      Authorization: 'Bearer ' + ShStorage.getItem('access_token')
+      Authorization: 'Bearer ' + shStorage.getItem('access_token')
     }
   };
     if (extraConfig) {
@@ -438,7 +438,7 @@ function doDelete (endPoint, data, extraConfig) {
   updateSession();
   const config = {
     headers: {
-      Authorization: 'Bearer ' + ShStorage.getItem('access_token')
+      Authorization: 'Bearer ' + shStorage.getItem('access_token')
     }
   };
     if (extraConfig) {
@@ -453,7 +453,7 @@ function doPut (endPoint, data, extraConfig) {
     updateSession();
     const config = {
         headers: {
-        Authorization: 'Bearer ' + ShStorage.getItem('access_token')
+        Authorization: 'Bearer ' + shStorage.getItem('access_token')
         }
     };
         if (extraConfig) {
@@ -469,7 +469,7 @@ function doPatch (endPoint, data, extraConfig) {
     updateSession();
     const config = {
         headers: {
-        Authorization: 'Bearer ' + ShStorage.getItem('access_token')
+        Authorization: 'Bearer ' + shStorage.getItem('access_token')
         }
     };
         if (extraConfig) {
@@ -4054,7 +4054,7 @@ const useUserStore = pinia.defineStore('user-store', {
     setUser (){
       let user = null;
       try {
-         user = ShStorage.getItem('user') ? ShStorage.getItem('user') : null;
+         user = shStorage.getItem('user') ? shStorage.getItem('user') : null;
       } catch (error) {
         user= null;
       }
@@ -4078,7 +4078,7 @@ const useUserStore = pinia.defineStore('user-store', {
         if (typeof(user) === 'undefined') {
            user = res.data;
         }
-        ShStorage.setItem('user',user);
+        shStorage.setItem('user',user);
         user.signOut = this.signOut;
         user.logout = this.signOut;
         user.logOut = this.signOut;
@@ -4101,7 +4101,7 @@ const useUserStore = pinia.defineStore('user-store', {
       }).catch((reason) => {
         if (reason.response && reason.response.status) {
           if(reason.response.status === 401) {
-            ShStorage.setItem('user',null);
+            shStorage.setItem('user',null);
             this.user = null;
           }
           this.loggedOut = true;
@@ -4115,7 +4115,7 @@ const useUserStore = pinia.defineStore('user-store', {
         }
       }
       const timeNow = moment__default["default"]().toISOString();
-      ShStorage.setItem('session_start',timeNow);
+      shStorage.setItem('session_start',timeNow);
     },
     signOut () {
       shRepo.signOutUser();
@@ -4127,7 +4127,7 @@ const useUserStore = pinia.defineStore('user-store', {
       this.setUser();
     },
     setAccessToken (accessToken) {
-      ShStorage.setItem('access_token', accessToken);
+      shStorage.setItem('access_token', accessToken);
       this.setUser();
     }
   },
@@ -5097,7 +5097,7 @@ const __default__ = {
     },
     setCachedData: function (){
       if (this.cacheKey) {
-        this.records = ShStorage.getItem('sh_table_cache_' + this.cacheKey, null);
+        this.records = shStorage.getItem('sh_table_cache_' + this.cacheKey, null);
       }
     },
     reloadData: function (page, append){
@@ -5136,7 +5136,7 @@ const __default__ = {
         const response = req.data.data;
         this.$emit('dataLoaded', response);
         if (this.page < 2 && this.cacheKey) {
-          ShStorage.setItem('sh_table_cache_' + this.cacheKey, response.data);
+          shStorage.setItem('sh_table_cache_' + this.cacheKey, response.data);
         }
         this.pagination_data = {
           current: response.current_page,
@@ -5805,11 +5805,6 @@ const setCounts = (res) => {
     }
   });
 };
-const activetab = (tab) => {
-  if (props.activeTab) {
-    return props.activeTab === tab ? 'active' : 'active'
-  }
-};
 
 return (_ctx, _cache) => {
   const _component_router_link = vue.resolveComponent("router-link");
@@ -5826,7 +5821,7 @@ return (_ctx, _cache) => {
         }, [
           vue.createVNode(_component_router_link, {
             onClick: $event => (setTab(tab)),
-            "active-class": activetab(tab),
+            "active-class": 'active',
             class: vue.normalizeClass(["nav-link text-capitalize", 'sh_tab_' + tab]),
             to: __props.baseUrl+'/tab/'+tab,
             role: "tab"
@@ -5835,7 +5830,7 @@ return (_ctx, _cache) => {
               vue.createTextVNode(vue.toDisplayString(tab.replace(/_/g, ' ')), 1 /* TEXT */)
             ]),
             _: 2 /* DYNAMIC */
-          }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["onClick", "active-class", "to", "class"])
+          }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["onClick", "to", "class"])
         ]))
       }), 128 /* KEYED_FRAGMENT */))
     ], 2 /* CLASS */),
@@ -7144,7 +7139,7 @@ const ShFrontend = {
   install: (app, options) => {
     if(options.sessionTimeout){
       app.provide('sessionTimeout',options.sessionTimeout);
-      ShStorage.setItem('sessionTimeout',options.sessionTimeout);
+      shStorage.setItem('sessionTimeout',options.sessionTimeout);
     }
     const shFormElements = options.shFormElementClasses ?? {};
 
@@ -7212,7 +7207,7 @@ const ShFrontend = {
     const allowKeys = [];
     Object.keys(options).map(key=> ((!['string','integer','number'].includes(typeof options[key]) && !allowKeys.includes(key)) || removeKeys.includes(key)) && delete options[key]);
 
-    ShStorage.setItem('ShConfig',options);
+    shStorage.setItem('ShConfig',options);
   }
 };
 
@@ -7229,6 +7224,68 @@ var shGql = {
     mutate
 };
 
+/**
+ * useShFetch is a custom hook for fetching data from a given URL and caching it.
+ * @param {string} url - The URL to fetch data from.
+ * @param {string} path - The path to drill down to the data in the response.
+ * @param {string} cacheKey - The key to use when caching the data.
+ * @returns {object} An object containing the status, loading state, error, data, and a function to refetch the data.
+ */
+const useShFetch = (url, path, cacheKey) => {
+    const status = vue.ref('pending');
+    const loading = vue.ref(false);
+    const error = vue.ref(null);
+    const data = vue.ref(null);
+
+    vue.onMounted(() => {
+        reFetchData();
+    });
+
+    /**
+     * Fetches data from the given URL and updates the status, loading state, error, and data refs.
+     * If a cacheKey is provided and there is cached data for that key, the cached data is used instead of fetching.
+     */
+    const reFetchData = () => {
+        loading.value = true;
+        status.value = 'loading';
+        if (cacheKey && shStorage.getItem(cacheKey)) {
+            data.value = shStorage.getItem(cacheKey);
+            status.value = 'success';
+            loading.value = false;
+        } else {
+            shApis.doGet(url).then(response => {
+                status.value = 'success';
+                let res = response.data;
+                if (path) {
+                    let pathArr = path.split('.');
+                    for (let i = 0; i < pathArr.length; i++) {
+                        res = res[pathArr[i]];
+                    }
+                }
+                data.value = res;
+                if (cacheKey) {
+                    shStorage.setItem(cacheKey, res);
+                }
+            })
+                .catch(res => {
+                    status.value = 'error';
+                    error.value = res.message ? res.message : (res.error ? res.error : 'An unexpected error occurred');
+                })
+                .finally(() => {
+                    loading.value = false;
+                });
+        }
+    };
+
+    return {
+        status,
+        loading,
+        error,
+        data,
+        reFetchData
+    }
+};
+
 exports.Countries = countries;
 exports.ManagePermissions = script$8;
 exports.ShAutoForm = script$o;
@@ -7255,6 +7312,7 @@ exports.ShTabs = script$c;
 exports.shApis = shApis;
 exports.shGql = shGql;
 exports.shRepo = shRepo;
-exports.shStorage = ShStorage;
+exports.shStorage = shStorage;
 exports.useAppStore = useAppStore;
+exports.useShFetch = useShFetch;
 exports.useUserStore = useUserStore;

package/dist/library.mjs

@@ -26,7 +26,7 @@ function getItem (key) {
 function removeItem (key) {
   return localStorage.removeItem(key)
 }
-var ShStorage = {
+var shStorage = {
   setItem,
   getItem,
   removeItem
@@ -132,21 +132,21 @@ const signOutUser = () => {
     const logoutApiEndPoint = getShConfig('logoutApiEndpoint', 'auth/logout');
     console.log(loginUrl, logoutApiEndPoint);
     shApis.doPost(logoutApiEndPoint).then(res => {
-        ShStorage.removeItem('access_token');
-        ShStorage.removeItem('user');
-        ShStorage.removeItem('last_activity');
+        shStorage.removeItem('access_token');
+        shStorage.removeItem('user');
+        shStorage.removeItem('last_activity');
         window.location.href = loginUrl;
     }).catch(ex => {
-        ShStorage.removeItem('access_token');
-        ShStorage.removeItem('user');
-        ShStorage.removeItem('last_activity');
+        shStorage.removeItem('access_token');
+        shStorage.removeItem('user');
+        shStorage.removeItem('last_activity');
         window.location.href = loginUrl;
     });
 };
 
 
 function getShConfig(key = null, def = ''){
-    const config = ShStorage.getItem('ShConfig') ?? {};
+    const config = shStorage.getItem('ShConfig') ?? {};
     if (key) {
         return config[key] ?? def
     }
@@ -284,17 +284,17 @@ function logoutUser(){
   }
 }
 function sessionRestored(){
-  const timeout = ShStorage.getItem('sessionTimeout') * 60;
-  const last_activity = ShStorage.getItem('last_activity');
+  const timeout = shStorage.getItem('sessionTimeout') * 60;
+  const last_activity = shStorage.getItem('last_activity');
   const pastSeconds = moment().diff(last_activity, 'seconds');
-  if(!ShStorage.getItem('access_token'))
+  if(!shStorage.getItem('access_token'))
     return false
   return pastSeconds < timeout
 }
 const checkSession = function (isCheking) {
-  const timeout = ShStorage.getItem('sessionTimeout');
-  const last_activity = ShStorage.getItem('last_activity');
-  if (ShStorage.getItem('access_token')) {
+  const timeout = shStorage.getItem('sessionTimeout');
+  const last_activity = shStorage.getItem('last_activity');
+  if (shStorage.getItem('access_token')) {
     const pastMinutes = moment().diff(last_activity, 'minutes');
     const pastSeconds = moment().diff(last_activity, 'seconds');
     if(pastMinutes >= timeout) {
@@ -352,17 +352,17 @@ async function shSwalLogout (seconds = 30) {
       window.ShConfirmation = null;
       clearInterval(window.shInterval);
       const timeNow = moment().toISOString();
-      ShStorage.setItem('last_activity', timeNow);
+      shStorage.setItem('last_activity', timeNow);
       startSession();
     }
   })
 }
 function startSession () {
   const timeNow = moment().toISOString();
-  const accessToken = ShStorage.getItem('access_token');
+  const accessToken = shStorage.getItem('access_token');
   if (accessToken) {
-    ShStorage.setItem('last_activity', timeNow);
-    const timout =  ShStorage.getItem('sessionTimeout');
+    shStorage.setItem('last_activity', timeNow);
+    const timout =  shStorage.getItem('sessionTimeout');
     const interval = (timout * 60 *1000) / 3;
     window.shInterval = setInterval(()=>{
       checkSession();
@@ -374,7 +374,7 @@ const updateSession = () =>{
     startSession();
   }
   const timeNow = moment().toISOString();
-  ShStorage.setItem('last_activity', timeNow);
+  shStorage.setItem('last_activity', timeNow);
 };
 
 const graphQlEndpoint = 'sh-ql';
@@ -395,7 +395,7 @@ function doGet (endPoint, data,extraConfig) {
   updateSession();
   let config = {
     headers: {
-      Authorization: 'Bearer ' + ShStorage.getItem('access_token')
+      Authorization: 'Bearer ' + shStorage.getItem('access_token')
     }
   };
     if (extraConfig) {
@@ -411,7 +411,7 @@ function doPost (endPoint, data, extraConfig) {
   updateSession();
   const config = {
     headers: {
-      Authorization: 'Bearer ' + ShStorage.getItem('access_token')
+      Authorization: 'Bearer ' + shStorage.getItem('access_token')
     }
   };
     if (extraConfig) {
@@ -426,7 +426,7 @@ function doDelete (endPoint, data, extraConfig) {
   updateSession();
   const config = {
     headers: {
-      Authorization: 'Bearer ' + ShStorage.getItem('access_token')
+      Authorization: 'Bearer ' + shStorage.getItem('access_token')
     }
   };
     if (extraConfig) {
@@ -441,7 +441,7 @@ function doPut (endPoint, data, extraConfig) {
     updateSession();
     const config = {
         headers: {
-        Authorization: 'Bearer ' + ShStorage.getItem('access_token')
+        Authorization: 'Bearer ' + shStorage.getItem('access_token')
         }
     };
         if (extraConfig) {
@@ -457,7 +457,7 @@ function doPatch (endPoint, data, extraConfig) {
     updateSession();
     const config = {
         headers: {
-        Authorization: 'Bearer ' + ShStorage.getItem('access_token')
+        Authorization: 'Bearer ' + shStorage.getItem('access_token')
         }
     };
         if (extraConfig) {
@@ -4042,7 +4042,7 @@ const useUserStore = defineStore('user-store', {
     setUser (){
       let user = null;
       try {
-         user = ShStorage.getItem('user') ? ShStorage.getItem('user') : null;
+         user = shStorage.getItem('user') ? shStorage.getItem('user') : null;
       } catch (error) {
         user= null;
       }
@@ -4066,7 +4066,7 @@ const useUserStore = defineStore('user-store', {
         if (typeof(user) === 'undefined') {
            user = res.data;
         }
-        ShStorage.setItem('user',user);
+        shStorage.setItem('user',user);
         user.signOut = this.signOut;
         user.logout = this.signOut;
         user.logOut = this.signOut;
@@ -4089,7 +4089,7 @@ const useUserStore = defineStore('user-store', {
       }).catch((reason) => {
         if (reason.response && reason.response.status) {
           if(reason.response.status === 401) {
-            ShStorage.setItem('user',null);
+            shStorage.setItem('user',null);
             this.user = null;
           }
           this.loggedOut = true;
@@ -4103,7 +4103,7 @@ const useUserStore = defineStore('user-store', {
         }
       }
       const timeNow = moment().toISOString();
-      ShStorage.setItem('session_start',timeNow);
+      shStorage.setItem('session_start',timeNow);
     },
     signOut () {
       shRepo.signOutUser();
@@ -4115,7 +4115,7 @@ const useUserStore = defineStore('user-store', {
       this.setUser();
     },
     setAccessToken (accessToken) {
-      ShStorage.setItem('access_token', accessToken);
+      shStorage.setItem('access_token', accessToken);
       this.setUser();
     }
   },
@@ -5085,7 +5085,7 @@ const __default__ = {
     },
     setCachedData: function (){
       if (this.cacheKey) {
-        this.records = ShStorage.getItem('sh_table_cache_' + this.cacheKey, null);
+        this.records = shStorage.getItem('sh_table_cache_' + this.cacheKey, null);
       }
     },
     reloadData: function (page, append){
@@ -5124,7 +5124,7 @@ const __default__ = {
         const response = req.data.data;
         this.$emit('dataLoaded', response);
         if (this.page < 2 && this.cacheKey) {
-          ShStorage.setItem('sh_table_cache_' + this.cacheKey, response.data);
+          shStorage.setItem('sh_table_cache_' + this.cacheKey, response.data);
         }
         this.pagination_data = {
           current: response.current_page,
@@ -5793,11 +5793,6 @@ const setCounts = (res) => {
     }
   });
 };
-const activetab = (tab) => {
-  if (props.activeTab) {
-    return props.activeTab === tab ? 'active' : 'active'
-  }
-};
 
 return (_ctx, _cache) => {
   const _component_router_link = resolveComponent("router-link");
@@ -5814,7 +5809,7 @@ return (_ctx, _cache) => {
         }, [
           createVNode(_component_router_link, {
             onClick: $event => (setTab(tab)),
-            "active-class": activetab(tab),
+            "active-class": 'active',
             class: normalizeClass(["nav-link text-capitalize", 'sh_tab_' + tab]),
             to: __props.baseUrl+'/tab/'+tab,
             role: "tab"
@@ -5823,7 +5818,7 @@ return (_ctx, _cache) => {
               createTextVNode(toDisplayString(tab.replace(/_/g, ' ')), 1 /* TEXT */)
             ]),
             _: 2 /* DYNAMIC */
-          }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["onClick", "active-class", "to", "class"])
+          }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["onClick", "to", "class"])
         ]))
       }), 128 /* KEYED_FRAGMENT */))
     ], 2 /* CLASS */),
@@ -7132,7 +7127,7 @@ const ShFrontend = {
   install: (app, options) => {
     if(options.sessionTimeout){
       app.provide('sessionTimeout',options.sessionTimeout);
-      ShStorage.setItem('sessionTimeout',options.sessionTimeout);
+      shStorage.setItem('sessionTimeout',options.sessionTimeout);
     }
     const shFormElements = options.shFormElementClasses ?? {};
 
@@ -7200,7 +7195,7 @@ const ShFrontend = {
     const allowKeys = [];
     Object.keys(options).map(key=> ((!['string','integer','number'].includes(typeof options[key]) && !allowKeys.includes(key)) || removeKeys.includes(key)) && delete options[key]);
 
-    ShStorage.setItem('ShConfig',options);
+    shStorage.setItem('ShConfig',options);
   }
 };
 
@@ -7217,4 +7212,66 @@ var shGql = {
     mutate
 };
 
-export { countries as Countries, script$8 as ManagePermissions, script$o as ShAutoForm, script$j as ShCanvas, script$9 as ShCanvasBtn, script$4 as ShCardLayout, script$g as ShConfirmAction, script$n as ShDropDownForm, script$b as ShDynamicTabs, script$w as ShForm, ShFrontend, script$m as ShModal, script$a as ShModalBtn, script$l as ShModalForm, script$k as ShModalFormAuto, script$y as ShPhone, script$5 as ShQueryPopups, script$e as ShRange, script$7 as ShRoutePopups, script$f as ShSilentAction, script$x as ShSuggest, script$d as ShTable, script$c as ShTabs, shApis, shGql, shRepo, ShStorage as shStorage, useAppStore, useUserStore };
+/**
+ * useShFetch is a custom hook for fetching data from a given URL and caching it.
+ * @param {string} url - The URL to fetch data from.
+ * @param {string} path - The path to drill down to the data in the response.
+ * @param {string} cacheKey - The key to use when caching the data.
+ * @returns {object} An object containing the status, loading state, error, data, and a function to refetch the data.
+ */
+const useShFetch = (url, path, cacheKey) => {
+    const status = ref('pending');
+    const loading = ref(false);
+    const error = ref(null);
+    const data = ref(null);
+
+    onMounted(() => {
+        reFetchData();
+    });
+
+    /**
+     * Fetches data from the given URL and updates the status, loading state, error, and data refs.
+     * If a cacheKey is provided and there is cached data for that key, the cached data is used instead of fetching.
+     */
+    const reFetchData = () => {
+        loading.value = true;
+        status.value = 'loading';
+        if (cacheKey && shStorage.getItem(cacheKey)) {
+            data.value = shStorage.getItem(cacheKey);
+            status.value = 'success';
+            loading.value = false;
+        } else {
+            shApis.doGet(url).then(response => {
+                status.value = 'success';
+                let res = response.data;
+                if (path) {
+                    let pathArr = path.split('.');
+                    for (let i = 0; i < pathArr.length; i++) {
+                        res = res[pathArr[i]];
+                    }
+                }
+                data.value = res;
+                if (cacheKey) {
+                    shStorage.setItem(cacheKey, res);
+                }
+            })
+                .catch(res => {
+                    status.value = 'error';
+                    error.value = res.message ? res.message : (res.error ? res.error : 'An unexpected error occurred');
+                })
+                .finally(() => {
+                    loading.value = false;
+                });
+        }
+    };
+
+    return {
+        status,
+        loading,
+        error,
+        data,
+        reFetchData
+    }
+};
+
+export { countries as Countries, script$8 as ManagePermissions, script$o as ShAutoForm, script$j as ShCanvas, script$9 as ShCanvasBtn, script$4 as ShCardLayout, script$g as ShConfirmAction, script$n as ShDropDownForm, script$b as ShDynamicTabs, script$w as ShForm, ShFrontend, script$m as ShModal, script$a as ShModalBtn, script$l as ShModalForm, script$k as ShModalFormAuto, script$y as ShPhone, script$5 as ShQueryPopups, script$e as ShRange, script$7 as ShRoutePopups, script$f as ShSilentAction, script$x as ShSuggest, script$d as ShTable, script$c as ShTabs, shApis, shGql, shRepo, shStorage, useAppStore, useShFetch, useUserStore };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iankibetsh/shframework",
-  "version": "4.5.3",
+  "version": "4.5.5",
   "description": "Vue library for handling laravel backend",
   "main": "dist/library.js",
   "module": "dist/library.mjs",