@maxax/hooks 1.0.0

package/dist/index.cjs

@@ -0,0 +1,899 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  createBreakpointListen: () => createBreakpointListen,
+  lockHtmlScrollRightCompensationRef: () => lockHtmlScrollRightCompensationRef,
+  useBoolean: () => useBoolean,
+  useBreakpoint: () => useBreakpoint,
+  useBrowserLocation: () => useBrowserLocation,
+  useComputed: () => useComputed,
+  useContext: () => useContext,
+  useCountDown: () => useCountDown,
+  useDeferredTrue: () => useDeferredTrue,
+  useEventListener: () => useEventListener,
+  useHookTable: () => useHookTable,
+  useInjectionCollection: () => useInjectionCollection,
+  useInjectionElementCollection: () => useInjectionElementCollection,
+  useInjectionInstanceCollection: () => useInjectionInstanceCollection,
+  useIsComposing: () => useIsComposing,
+  useLayoutContentStyle: () => useLayoutContentStyle,
+  useLayoutFooterStyle: () => useLayoutFooterStyle,
+  useLayoutHeaderStyle: () => useLayoutHeaderStyle,
+  useLoading: () => useLoading,
+  useLocalPage: () => useLocalPage,
+  useLockHtmlScroll: () => useLockHtmlScroll,
+  useMemo: () => useMemo,
+  useMergedState: () => useMergedState,
+  useScript: () => useScript,
+  useScroll: () => useScroll,
+  useSignal: () => useSignal,
+  useSvgIconRender: () => useSvgIconRender
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/use-boolean.ts
+var import_vue = require("vue");
+function useBoolean(initValue = false) {
+  const bool = (0, import_vue.ref)(initValue);
+  function setBool(value) {
+    bool.value = value;
+  }
+  function setTrue() {
+    setBool(true);
+  }
+  function setFalse() {
+    setBool(false);
+  }
+  function toggle() {
+    setBool(!bool.value);
+  }
+  return {
+    bool,
+    setBool,
+    setTrue,
+    setFalse,
+    toggle
+  };
+}
+
+// src/use-breakpoint.ts
+var import_vue3 = require("vue");
+
+// src/enum/breakpointEnum.ts
+var SizeEnum = /* @__PURE__ */ ((SizeEnum2) => {
+  SizeEnum2["XS"] = "XS";
+  SizeEnum2["SM"] = "SM";
+  SizeEnum2["MD"] = "MD";
+  SizeEnum2["LG"] = "LG";
+  SizeEnum2["XL"] = "XL";
+  SizeEnum2["XXL"] = "XXL";
+  return SizeEnum2;
+})(SizeEnum || {});
+var ScreenEnum = /* @__PURE__ */ ((ScreenEnum2) => {
+  ScreenEnum2[ScreenEnum2["XS"] = 320] = "XS";
+  ScreenEnum2[ScreenEnum2["SM"] = 640] = "SM";
+  ScreenEnum2[ScreenEnum2["MD"] = 768] = "MD";
+  ScreenEnum2[ScreenEnum2["LG"] = 960] = "LG";
+  ScreenEnum2[ScreenEnum2["XL"] = 1280] = "XL";
+  ScreenEnum2[ScreenEnum2["XXL"] = 1536] = "XXL";
+  return ScreenEnum2;
+})(ScreenEnum || {});
+var screenMap = /* @__PURE__ */ new Map();
+screenMap.set("XS" /* XS */, 320 /* XS */);
+screenMap.set("SM" /* SM */, 640 /* SM */);
+screenMap.set("MD" /* MD */, 768 /* MD */);
+screenMap.set("LG" /* LG */, 960 /* LG */);
+screenMap.set("XL" /* XL */, 1280 /* XL */);
+screenMap.set("XXL" /* XXL */, 1536 /* XXL */);
+
+// src/use-event-listener.ts
+var import_vue2 = require("vue");
+var import_core = require("@vueuse/core");
+function useEventListener({ el = window, name, listener, options, autoRemove = true, isDebounce = true, wait = 80 }) {
+  let remove = () => {
+  };
+  const isAddRef = (0, import_vue2.ref)(false);
+  if (el) {
+    const element = (0, import_vue2.ref)(el);
+    const handler = isDebounce ? (0, import_core.useDebounceFn)(listener, wait) : (0, import_core.useThrottleFn)(listener, wait);
+    const realHandler = wait ? handler : listener;
+    const removeEventListener = (e) => {
+      isAddRef.value = true;
+      e.removeEventListener(name, realHandler, options);
+    };
+    const addEventListener = (e) => e.addEventListener(name, realHandler, options);
+    const removeWatch = (0, import_vue2.watch)(
+      element,
+      (v, _ov, cleanUp) => {
+        if (v) {
+          !(0, import_vue2.unref)(isAddRef) && addEventListener(v);
+          cleanUp(() => {
+            autoRemove && removeEventListener(v);
+          });
+        }
+      },
+      { immediate: true }
+    );
+    remove = () => {
+      removeEventListener(element.value);
+      removeWatch();
+    };
+  }
+  return { removeEvent: remove };
+}
+
+// src/use-breakpoint.ts
+var globalScreenRef;
+var globalWidthRef;
+var globalRealWidthRef;
+function useBreakpoint() {
+  return {
+    screenRef: (0, import_vue3.computed)(() => (0, import_vue3.unref)(globalScreenRef)),
+    widthRef: globalWidthRef,
+    screenEnum: ScreenEnum,
+    realWidthRef: globalRealWidthRef
+  };
+}
+function createBreakpointListen(fn) {
+  const screenRef = (0, import_vue3.ref)("XL" /* XL */);
+  const realWidthRef = (0, import_vue3.ref)(window.innerWidth);
+  function getWindowWidth() {
+    const width = document.body.clientWidth;
+    const xs = screenMap.get("XS" /* XS */);
+    const sm = screenMap.get("SM" /* SM */);
+    const md = screenMap.get("MD" /* MD */);
+    const lg = screenMap.get("LG" /* LG */);
+    const xl = screenMap.get("XL" /* XL */);
+    if (width < xs) {
+      screenRef.value = "XS" /* XS */;
+    } else if (width < sm) {
+      screenRef.value = "SM" /* SM */;
+    } else if (width < md) {
+      screenRef.value = "MD" /* MD */;
+    } else if (width < lg) {
+      screenRef.value = "LG" /* LG */;
+    } else if (width < xl) {
+      screenRef.value = "XL" /* XL */;
+    } else {
+      screenRef.value = "XXL" /* XXL */;
+    }
+    realWidthRef.value = width;
+  }
+  useEventListener({
+    el: window,
+    name: "resize",
+    listener: () => {
+      getWindowWidth();
+      resizeFn();
+    }
+    // Wait: 100,
+  });
+  getWindowWidth();
+  globalScreenRef = (0, import_vue3.computed)(() => (0, import_vue3.unref)(screenRef));
+  globalWidthRef = (0, import_vue3.computed)(() => screenMap.get((0, import_vue3.unref)(screenRef)));
+  globalRealWidthRef = (0, import_vue3.computed)(() => (0, import_vue3.unref)(realWidthRef));
+  function resizeFn() {
+    fn == null ? void 0 : fn({
+      screen: globalScreenRef,
+      width: globalWidthRef,
+      realWidth: globalRealWidthRef,
+      screenEnum: ScreenEnum,
+      screenMap,
+      sizeEnum: SizeEnum
+    });
+  }
+  resizeFn();
+  return {
+    screenRef: globalScreenRef,
+    screenEnum: ScreenEnum,
+    widthRef: globalWidthRef,
+    realWidthRef: globalRealWidthRef
+  };
+}
+
+// src/use-browser-location.ts
+var import_vue4 = require("vue");
+var isBrowser = typeof document !== "undefined" && typeof window !== "undefined";
+function useBrowserLocation(customWindow = isBrowser ? window : null) {
+  const getWindowLocation = () => {
+    const { hash, host, hostname, href, origin, pathname, port, protocol, search } = (customWindow == null ? void 0 : customWindow.location) || {};
+    return {
+      hash,
+      host,
+      hostname,
+      href,
+      origin,
+      pathname,
+      port,
+      protocol,
+      search
+    };
+  };
+  const locationState = (0, import_vue4.ref)(getWindowLocation());
+  const updateLocation = () => {
+    locationState.value = getWindowLocation();
+  };
+  (0, import_vue4.onMounted)(() => {
+    if (customWindow) {
+      customWindow.addEventListener("popstate", updateLocation);
+      customWindow.addEventListener("hashchange", updateLocation);
+    }
+  });
+  (0, import_vue4.onUnmounted)(() => {
+    if (customWindow) {
+      customWindow.removeEventListener("popstate", updateLocation);
+      customWindow.removeEventListener("hashchange", updateLocation);
+    }
+  });
+  return locationState;
+}
+
+// src/use-collection.ts
+var import_vue5 = require("vue");
+function useInjectionInstanceCollection(injectionName, collectionKey, registerKeyRef) {
+  var _a;
+  const injection = (0, import_vue5.inject)(injectionName, null);
+  if (injection === null) return;
+  const vm = (_a = (0, import_vue5.getCurrentInstance)()) == null ? void 0 : _a.proxy;
+  (0, import_vue5.watch)(registerKeyRef, registerInstance);
+  registerInstance(registerKeyRef.value);
+  (0, import_vue5.onBeforeUnmount)(() => {
+    registerInstance(void 0, registerKeyRef.value);
+  });
+  function registerInstance(key, oldKey) {
+    if (!injection) return;
+    const collection = injection[collectionKey];
+    if (oldKey !== void 0) removeInstance(collection, oldKey);
+    if (key !== void 0) addInstance(collection, key);
+  }
+  function removeInstance(collection, key) {
+    if (!collection[key]) collection[key] = [];
+    collection[key].splice(
+      collection[key].findIndex((instance) => instance === vm),
+      1
+    );
+  }
+  function addInstance(collection, key) {
+    if (!collection[key]) collection[key] = [];
+    if (!~collection[key].findIndex((instance) => instance === vm)) {
+      collection[key].push(vm);
+    }
+  }
+}
+function useInjectionCollection(injectionName, collectionKey, valueRef) {
+  const injection = (0, import_vue5.inject)(injectionName, null);
+  if (injection === null) return;
+  if (!(collectionKey in injection)) {
+    injection[collectionKey] = [];
+  }
+  injection[collectionKey].push(valueRef.value);
+  (0, import_vue5.watch)(valueRef, (value, prevValue) => {
+    const collectionArray = injection[collectionKey];
+    const index = collectionArray.findIndex((collectionValue) => collectionValue === prevValue);
+    if (~index) collectionArray.splice(index, 1);
+    collectionArray.push(value);
+  });
+  (0, import_vue5.onBeforeUnmount)(() => {
+    const collectionArray = injection[collectionKey];
+    const index = collectionArray.findIndex((collectionValue) => collectionValue === valueRef.value);
+    if (~index) collectionArray.splice(index, 1);
+  });
+}
+function useInjectionElementCollection(injectionName, collectionKey, getElement) {
+  const injection = (0, import_vue5.inject)(injectionName, null);
+  if (injection === null) return;
+  if (!(collectionKey in injection)) {
+    injection[collectionKey] = [];
+  }
+  (0, import_vue5.onMounted)(() => {
+    const el = getElement();
+    if (!el) return;
+    injection[collectionKey].push(el);
+  });
+  (0, import_vue5.onBeforeUnmount)(() => {
+    const collectionArray = injection[collectionKey];
+    const element = getElement();
+    const index = collectionArray.findIndex((collectionElement) => collectionElement === element);
+    if (~index) collectionArray.splice(index, 1);
+  });
+}
+
+// src/use-context.ts
+var import_vue6 = require("vue");
+function useContext(contextName, fn) {
+  const { useProvide, useInject: useStore } = createContext(contextName);
+  function setupStore(...args) {
+    const context = fn(...args);
+    return useProvide(context);
+  }
+  return {
+    /** Setup store in the parent component */
+    setupStore,
+    /** Use store in the child component */
+    useStore
+  };
+}
+function createContext(contextName) {
+  const injectKey = Symbol(contextName);
+  function useProvide(context) {
+    (0, import_vue6.provide)(injectKey, context);
+    return context;
+  }
+  function useInject() {
+    return (0, import_vue6.inject)(injectKey);
+  }
+  return {
+    useProvide,
+    useInject
+  };
+}
+
+// src/use-count-down.ts
+var import_vue7 = require("vue");
+var import_core2 = require("@vueuse/core");
+function useCountDown(seconds) {
+  const FPS_PER_SECOND = 60;
+  const fps = (0, import_vue7.ref)(0);
+  const count = (0, import_vue7.computed)(() => Math.ceil(fps.value / FPS_PER_SECOND));
+  const isCounting = (0, import_vue7.computed)(() => fps.value > 0);
+  const { pause, resume } = (0, import_core2.useRafFn)(
+    () => {
+      if (fps.value > 0) {
+        fps.value -= 1;
+      } else {
+        pause();
+      }
+    },
+    { immediate: false }
+  );
+  function start(updateSeconds = seconds) {
+    fps.value = FPS_PER_SECOND * updateSeconds;
+    resume();
+  }
+  function stop() {
+    fps.value = 0;
+    pause();
+  }
+  (0, import_vue7.onScopeDispose)(() => {
+    pause();
+  });
+  return {
+    count,
+    isCounting,
+    start,
+    stop
+  };
+}
+
+// src/use-deferred-true.ts
+var import_vue8 = require("vue");
+function useDeferredTrue(valueRef, delay, shouldDelayRef) {
+  if (!delay) return valueRef;
+  const delayedRef = (0, import_vue8.ref)(valueRef.value);
+  let timerId = null;
+  (0, import_vue8.watch)(valueRef, (value) => {
+    if (timerId !== null) window.clearTimeout(timerId);
+    if (value === true) {
+      if (shouldDelayRef && !shouldDelayRef.value) {
+        delayedRef.value = true;
+      } else {
+        timerId = window.setTimeout(() => {
+          delayedRef.value = true;
+        }, delay);
+      }
+    } else {
+      delayedRef.value = false;
+    }
+  });
+  return delayedRef;
+}
+
+// src/use-is-composing.ts
+var import_vue9 = require("vue");
+var isComposingRef = (0, import_vue9.ref)(false);
+function compositionStartHandler() {
+  isComposingRef.value = true;
+}
+function compositionEndHandler() {
+  isComposingRef.value = false;
+}
+var mountedCount = 0;
+function useIsComposing() {
+  if (document && window) {
+    (0, import_vue9.onBeforeMount)(() => {
+      if (!mountedCount) {
+        window.addEventListener("compositionstart", compositionStartHandler);
+        window.addEventListener("compositionend", compositionEndHandler);
+      }
+      mountedCount++;
+    });
+    (0, import_vue9.onBeforeUnmount)(() => {
+      if (mountedCount <= 1) {
+        window.removeEventListener("compositionstart", compositionStartHandler);
+        window.removeEventListener("compositionend", compositionEndHandler);
+        mountedCount = 0;
+      } else {
+        mountedCount--;
+      }
+    });
+  }
+  return isComposingRef;
+}
+
+// src/use-layout-style.ts
+var import_vue10 = require("vue");
+var import_core3 = require("@vueuse/core");
+var import_utils = require("@maxax/utils");
+
+// src/const/index.ts
+var CSS_VARIABLE_LAYOUT_CONTENT_HEIGHT = "--max-content-height";
+var CSS_VARIABLE_LAYOUT_CONTENT_WIDTH = "--max-content-width";
+var CSS_VARIABLE_LAYOUT_HEADER_HEIGHT = "--max-header-height";
+var CSS_VARIABLE_LAYOUT_FOOTER_HEIGHT = "--max-footer-height";
+
+// src/use-layout-style.ts
+function useLayoutContentStyle(diffHeight = 0) {
+  let resizeObserver = null;
+  const contentElement = (0, import_vue10.ref)(null);
+  const visibleDomRect = (0, import_vue10.ref)(null);
+  const contentHeight = (0, import_core3.useCssVar)(CSS_VARIABLE_LAYOUT_CONTENT_HEIGHT);
+  const contentWidth = (0, import_core3.useCssVar)(CSS_VARIABLE_LAYOUT_CONTENT_WIDTH);
+  const overlayStyle = (0, import_vue10.computed)(() => {
+    var _a;
+    const { height, left, top, width } = (_a = visibleDomRect.value) != null ? _a : {};
+    return {
+      height: `${height}px`,
+      left: `${left}px`,
+      position: "fixed",
+      top: `${top}px`,
+      width: `${width}px`,
+      zIndex: 150
+    };
+  });
+  const debouncedCalcHeight = (0, import_core3.useDebounceFn)((_entries) => {
+    visibleDomRect.value = (0, import_utils.getElementVisibleRect)(contentElement.value);
+    contentHeight.value = `${visibleDomRect.value.height - diffHeight}px`;
+    contentWidth.value = `${visibleDomRect.value.width}px`;
+  }, 16);
+  (0, import_vue10.onMounted)(() => {
+    if (contentElement.value && !resizeObserver) {
+      resizeObserver = new ResizeObserver(debouncedCalcHeight);
+      resizeObserver.observe(contentElement.value);
+    }
+  });
+  (0, import_vue10.onUnmounted)(() => {
+    resizeObserver == null ? void 0 : resizeObserver.disconnect();
+    resizeObserver = null;
+  });
+  return { contentElement, overlayStyle, visibleDomRect };
+}
+function useLayoutHeaderStyle() {
+  const headerHeight = (0, import_core3.useCssVar)(CSS_VARIABLE_LAYOUT_HEADER_HEIGHT);
+  return {
+    getLayoutHeaderHeight: () => {
+      return Number.parseInt(`${headerHeight.value}`, 10);
+    },
+    setLayoutHeaderHeight: (height) => {
+      headerHeight.value = `${height}px`;
+    }
+  };
+}
+function useLayoutFooterStyle() {
+  const footerHeight = (0, import_core3.useCssVar)(CSS_VARIABLE_LAYOUT_FOOTER_HEIGHT);
+  return {
+    getLayoutFooterHeight: () => {
+      return Number.parseInt(`${footerHeight.value}`, 10);
+    },
+    setLayoutFooterHeight: (height) => {
+      footerHeight.value = `${height}px`;
+    }
+  };
+}
+
+// src/use-loading.ts
+function useLoading(initValue = false) {
+  const { bool: loading, setTrue: startLoading, setFalse: endLoading } = useBoolean(initValue);
+  return {
+    loading,
+    startLoading,
+    endLoading
+  };
+}
+
+// src/use-local-page.ts
+var import_vue11 = require("vue");
+function pagination(list, pageNo, pageSize) {
+  const offset = (pageNo - 1) * Number(pageSize);
+  const ret = offset + Number(pageSize) >= list.length ? list.slice(offset, list.length) : list.slice(offset, offset + Number(pageSize));
+  return ret;
+}
+function useLocalPage(list, pageSize) {
+  const currentPage = (0, import_vue11.ref)(1);
+  const pageSizeRef = (0, import_vue11.ref)(pageSize);
+  const listRef = (0, import_vue11.ref)(list);
+  const getPaginationList = (0, import_vue11.computed)(() => {
+    return pagination((0, import_vue11.unref)(listRef), (0, import_vue11.unref)(currentPage), (0, import_vue11.unref)(pageSizeRef));
+  });
+  const getTotal = (0, import_vue11.computed)(() => {
+    return (0, import_vue11.unref)(listRef).length;
+  });
+  function setCurrentPage(page) {
+    currentPage.value = page;
+  }
+  function setPageSize(size) {
+    pageSizeRef.value = size;
+  }
+  function setPagination(page) {
+    setCurrentPage(page.currentPage);
+    setPageSize(page.pageSize);
+  }
+  function getPageList() {
+    return pagination((0, import_vue11.unref)(listRef), (0, import_vue11.unref)(currentPage), (0, import_vue11.unref)(pageSizeRef));
+  }
+  return { setCurrentPage, getTotal, setPageSize, getPaginationList, setPagination, getPageList };
+}
+
+// src/use-lock-html-scroll.ts
+var import_vue12 = require("vue");
+var lockCount = 0;
+var originalMarginRight = "";
+var originalOverflow = "";
+var originalOverflowX = "";
+var originalOverflowY = "";
+var lockHtmlScrollRightCompensationRef = (0, import_vue12.ref)("0px");
+function useLockHtmlScroll(lockRef) {
+  if (typeof document === "undefined") return;
+  const el = document.documentElement;
+  let watchStopHandle;
+  let activated = false;
+  const unlock = () => {
+    el.style.marginRight = originalMarginRight;
+    el.style.overflow = originalOverflow;
+    el.style.overflowX = originalOverflowX;
+    el.style.overflowY = originalOverflowY;
+    lockHtmlScrollRightCompensationRef.value = "0px";
+  };
+  (0, import_vue12.onMounted)(() => {
+    watchStopHandle = (0, import_vue12.watch)(
+      lockRef,
+      (value) => {
+        if (value) {
+          if (!lockCount) {
+            const scrollbarWidth = window.innerWidth - el.offsetWidth;
+            if (scrollbarWidth > 0) {
+              originalMarginRight = el.style.marginRight;
+              el.style.marginRight = `${scrollbarWidth}px`;
+              lockHtmlScrollRightCompensationRef.value = `${scrollbarWidth}px`;
+            }
+            originalOverflow = el.style.overflow;
+            originalOverflowX = el.style.overflowX;
+            originalOverflowY = el.style.overflowY;
+            el.style.overflow = "hidden";
+            el.style.overflowX = "hidden";
+            el.style.overflowY = "hidden";
+          }
+          activated = true;
+          lockCount++;
+        } else {
+          lockCount--;
+          if (!lockCount) {
+            unlock();
+          }
+          activated = false;
+        }
+      },
+      {
+        immediate: true
+      }
+    );
+  });
+  (0, import_vue12.onBeforeUnmount)(() => {
+    watchStopHandle == null ? void 0 : watchStopHandle();
+    if (activated) {
+      lockCount--;
+      if (!lockCount) {
+        unlock();
+      }
+      activated = false;
+    }
+  });
+}
+
+// src/use-memo.ts
+var import_vue13 = require("vue");
+function useMemo(getterOrOptions) {
+  const computedValueRef = (0, import_vue13.computed)(getterOrOptions);
+  const valueRef = (0, import_vue13.ref)(computedValueRef.value);
+  (0, import_vue13.watch)(computedValueRef, (value) => {
+    valueRef.value = value;
+  });
+  if (typeof getterOrOptions === "function") {
+    return valueRef;
+  }
+  return {
+    __v_isRef: true,
+    get value() {
+      return valueRef.value;
+    },
+    set value(v) {
+      ;
+      getterOrOptions.set(v);
+    }
+  };
+}
+
+// src/use-merged-state.ts
+var import_vue14 = require("vue");
+function useMergedState(controlledStateRef, uncontrolledStateRef) {
+  (0, import_vue14.watch)(controlledStateRef, (value) => {
+    if (value !== void 0) {
+      uncontrolledStateRef.value = value;
+    }
+  });
+  return (0, import_vue14.computed)(() => {
+    if (controlledStateRef.value === void 0) {
+      return uncontrolledStateRef.value;
+    }
+    return controlledStateRef.value;
+  });
+}
+
+// src/use-script.ts
+var import_vue15 = require("vue");
+function useScript(opts) {
+  const isLoading = (0, import_vue15.ref)(false);
+  const error = (0, import_vue15.ref)(false);
+  const success = (0, import_vue15.ref)(false);
+  let script;
+  const promise = new Promise((resolve, reject) => {
+    (0, import_vue15.onMounted)(() => {
+      script = document.createElement("script");
+      script.type = "text/javascript";
+      script.onload = () => {
+        isLoading.value = false;
+        success.value = true;
+        error.value = false;
+        resolve("");
+      };
+      script.onerror = (err) => {
+        isLoading.value = false;
+        success.value = false;
+        error.value = true;
+        reject(err);
+      };
+      script.src = opts.src;
+      document.head.appendChild(script);
+    });
+  });
+  (0, import_vue15.onUnmounted)(() => {
+    script && script.remove();
+  });
+  return {
+    isLoading,
+    error,
+    success,
+    toPromise: () => promise
+  };
+}
+
+// src/use-scroll.ts
+var import_vue16 = require("vue");
+var import_core4 = require("@vueuse/core");
+var import_utils2 = require("@maxax/utils");
+function useScroll(refEl, options) {
+  const refX = (0, import_vue16.ref)(0);
+  const refY = (0, import_vue16.ref)(0);
+  let handler = () => {
+    if ((0, import_utils2.isWindow)(refEl.value)) {
+      refX.value = refEl.value.scrollX;
+      refY.value = refEl.value.scrollY;
+    } else if (refEl.value) {
+      refX.value = refEl.value.scrollLeft;
+      refY.value = refEl.value.scrollTop;
+    }
+  };
+  if ((0, import_utils2.isObject)(options)) {
+    let wait = 0;
+    if (options && options.wait && options.wait > 0) {
+      wait = options.wait;
+      Reflect.deleteProperty(options, "wait");
+    }
+    handler = (0, import_core4.useThrottleFn)(handler, wait);
+  }
+  let stopWatch;
+  (0, import_vue16.onMounted)(() => {
+    stopWatch = (0, import_vue16.watch)(
+      refEl,
+      (el, prevEl, onCleanup) => {
+        if (el) {
+          el.addEventListener("scroll", handler);
+        } else if (prevEl) {
+          prevEl.removeEventListener("scroll", handler);
+        }
+        onCleanup(() => {
+          refX.value = 0;
+          refY.value = 0;
+          el && el.removeEventListener("scroll", handler);
+        });
+      },
+      { immediate: true }
+    );
+  });
+  (0, import_vue16.onUnmounted)(() => {
+    refEl.value && refEl.value.removeEventListener("scroll", handler);
+  });
+  function stop() {
+    stopWatch && stopWatch();
+  }
+  return { refX, refY, stop };
+}
+
+// src/use-signal.ts
+var import_vue17 = require("vue");
+function useSignal(initialValue, options) {
+  const { useRef } = options || {};
+  const state = useRef ? (0, import_vue17.ref)(initialValue) : (0, import_vue17.shallowRef)(initialValue);
+  return createSignal(state);
+}
+function useComputed(getterOrOptions, debugOptions) {
+  const isGetter = typeof getterOrOptions === "function";
+  const computedValue = (0, import_vue17.computed)(getterOrOptions, debugOptions);
+  if (isGetter) {
+    return () => computedValue.value;
+  }
+  return createSignal(computedValue);
+}
+function createSignal(state) {
+  const signal = () => state.value;
+  signal.set = (value) => {
+    state.value = value;
+  };
+  signal.update = (updater) => {
+    state.value = updater(state.value);
+  };
+  signal.mutate = (mutator) => {
+    mutator(state.value);
+    (0, import_vue17.triggerRef)(state);
+  };
+  signal.getRef = () => state;
+  return signal;
+}
+
+// src/use-svg-icon-render.ts
+var import_vue18 = require("vue");
+function useSvgIconRender(SvgIcon) {
+  const SvgIconVNode = (config) => {
+    const { color, fontSize, icon, localIcon } = config;
+    const style = {};
+    if (color) {
+      style.color = color;
+    }
+    if (fontSize) {
+      style.fontSize = `${fontSize}px`;
+    }
+    if (!icon && !localIcon) {
+      return void 0;
+    }
+    return () => (0, import_vue18.h)(SvgIcon, { icon, localIcon, style });
+  };
+  return {
+    SvgIconVNode
+  };
+}
+
+// src/use-table.ts
+var import_vue19 = require("vue");
+var import_utils3 = require("@maxax/utils");
+function useHookTable(config) {
+  const { loading, startLoading, endLoading } = useLoading();
+  const { bool: empty, setBool: setEmpty } = useBoolean();
+  const { apiFn, apiParams, transformer, immediate = true, getColumnChecks, getColumns } = config;
+  const searchParams = (0, import_vue19.reactive)((0, import_utils3.jsonClone)({ ...apiParams }));
+  const allColumns = (0, import_vue19.ref)(config.columns());
+  const data = (0, import_vue19.ref)([]);
+  const columnChecks = (0, import_vue19.ref)(getColumnChecks(config.columns()));
+  const columns = (0, import_vue19.computed)(() => getColumns(allColumns.value, columnChecks.value));
+  function reloadColumns() {
+    allColumns.value = config.columns();
+    const checkMap = new Map(columnChecks.value.map((col) => [col.key, col.checked]));
+    const defaultChecks = getColumnChecks(allColumns.value);
+    columnChecks.value = defaultChecks.map((col) => {
+      var _a;
+      return {
+        ...col,
+        checked: (_a = checkMap.get(col.key)) != null ? _a : col.checked
+      };
+    });
+  }
+  async function getData() {
+    var _a;
+    startLoading();
+    const formattedParams = formatSearchParams(searchParams);
+    const response = await apiFn(formattedParams);
+    const transformed = transformer(response);
+    data.value = transformed.data;
+    setEmpty(transformed.data.length === 0);
+    await ((_a = config.onFetched) == null ? void 0 : _a.call(config, transformed));
+    endLoading();
+  }
+  function formatSearchParams(params) {
+    const formattedParams = {};
+    Object.entries(params).forEach(([key, value]) => {
+      if (value !== null && value !== void 0) {
+        formattedParams[key] = value;
+      }
+    });
+    return formattedParams;
+  }
+  function updateSearchParams(params) {
+    Object.assign(searchParams, params);
+  }
+  function resetSearchParams() {
+    Object.assign(searchParams, (0, import_utils3.jsonClone)(apiParams));
+  }
+  if (immediate) {
+    getData();
+  }
+  return {
+    loading,
+    empty,
+    data,
+    columns,
+    columnChecks,
+    reloadColumns,
+    getData,
+    searchParams,
+    updateSearchParams,
+    resetSearchParams
+  };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createBreakpointListen,
+  lockHtmlScrollRightCompensationRef,
+  useBoolean,
+  useBreakpoint,
+  useBrowserLocation,
+  useComputed,
+  useContext,
+  useCountDown,
+  useDeferredTrue,
+  useEventListener,
+  useHookTable,
+  useInjectionCollection,
+  useInjectionElementCollection,
+  useInjectionInstanceCollection,
+  useIsComposing,
+  useLayoutContentStyle,
+  useLayoutFooterStyle,
+  useLayoutHeaderStyle,
+  useLoading,
+  useLocalPage,
+  useLockHtmlScroll,
+  useMemo,
+  useMergedState,
+  useScript,
+  useScroll,
+  useSignal,
+  useSvgIconRender
+});
+//# sourceMappingURL=index.cjs.map