@tb-dev/vue 2.0.14 → 2.2.0

package/dist/composables/index.d.ts

@@ -1,8 +1,9 @@
-export * from './async-computed';
-export * from './async-ref';
 export * from './console';
-export * from './element-size';
-export * from './key-down';
-export * from './local-ref';
-export * from './session-ref';
-export * from './window-size';
+export * from './useMutex';
+export * from './asyncRef';
+export * from './localRef';
+export * from './onKeyDown';
+export * from './sessionRef';
+export * from './asyncComputed';
+export * from './useWindowSize';
+export * from './useElementSize';

package/dist/composables/useMutex/index.d.ts

@@ -0,0 +1,6 @@
+export declare function useMutex(): {
+    locked: Readonly<import('vue').Ref<boolean, boolean>>;
+    acquire: () => Promise<void>;
+    release: () => void;
+    lock: <T = unknown>(fn: () => Promise<T>) => Promise<T>;
+};

package/dist/composables/{window-size → useWindowSize}/index.d.ts

@@ -1,3 +1,5 @@
 import { Ref } from 'vue';
+import { useWindowSize } from '@vueuse/core';
+export { useWindowSize };
 export declare function useWindowHeight(): Readonly<Ref<number>>;
 export declare function useWindowWidth(): Readonly<Ref<number>>;

package/dist/index.js

@@ -1,6 +1,39 @@
+import { watch, ref, readonly, inject as inject$1, computed, effectScope, toValue, toRef } from 'vue';
+import { Mutex } from 'es-toolkit';
 import { unwrap, isNil } from '@tb-dev/utils';
-import { inject as inject$1, watch, toRef, computed, effectScope, toValue } from 'vue';
-import { computedAsync, useAsyncState, useWindowSize, useElementSize as useElementSize$1, tryOnScopeDispose, onKeyStroke, useLocalStorage, useSessionStorage } from '@vueuse/core';
+import { useAsyncState, useLocalStorage, tryOnScopeDispose, onKeyStroke, useSessionStorage, computedAsync, useWindowSize, useElementSize as useElementSize$1 } from '@vueuse/core';
+export { useWindowSize } from '@vueuse/core';
+
+function log(source) {
+  return watch(source, (value) => console.log(value));
+}
+function warn(source) {
+  return watch(source, (value) => console.warn(value));
+}
+
+function useMutex() {
+  const mutex = new Mutex();
+  const locked = ref(mutex.isLocked);
+  async function acquire() {
+    await mutex.acquire();
+    locked.value = mutex.isLocked;
+  }
+  function release() {
+    mutex.release();
+    locked.value = mutex.isLocked;
+  }
+  function lock(fn) {
+    const { resolve, reject, promise } = Promise.withResolvers();
+    acquire().then(() => fn()).then((value) => resolve(value)).catch(reject).finally(release);
+    return promise;
+  }
+  return {
+    locked: readonly(locked),
+    acquire,
+    release,
+    lock
+  };
+}
 
 function create$1() {
   let APP = null;
@@ -80,16 +113,6 @@ function create() {
 }
 const { get: getErrorHandler, set: setErrorHandler, handle: handleError } = create();
 
-function asyncComputed(initial, callback, options) {
-  const state = computedAsync(callback, initial, {
-    onError: handleError,
-    shallow: true,
-    lazy: false,
-    ...options
-  });
-  return state;
-}
-
 function asyncRef(initial, fn, options = {}) {
   const { immediate = true } = options;
   const value = useAsyncState(fn, initial, {
@@ -111,38 +134,24 @@ function asyncRef(initial, fn, options = {}) {
   };
 }
 
-function log(source) {
-  return watch(source, (value) => console.log(value));
-}
-function warn(source) {
-  return watch(source, (value) => console.warn(value));
-}
-
-function useWindowHeight() {
-  return useWindowSize().height;
-}
-function useWindowWidth() {
-  return useWindowSize().width;
-}
-
-function useElementSize(element) {
-  return useElementSize$1(toRef(element), { height: 0, width: 0 }, { box: "border-box" });
-}
-function useHeight(element) {
-  return useElementSize(element).height;
-}
-function useHeightDiff(element) {
-  const height = useHeight(element);
-  const windowHeight = useWindowHeight();
-  return computed(() => windowHeight.value - height.value);
-}
-function useWidth(element) {
-  return useElementSize(element).width;
-}
-function useWidthDiff(element) {
-  const width = useWidth(element);
-  const windowWidth = useWindowWidth();
-  return computed(() => windowWidth.value - width.value);
+function localRef(key, initial, options) {
+  const defaultValue = { inner: initial };
+  const local = useLocalStorage(key, defaultValue, {
+    deep: options?.deep ?? true,
+    initOnMounted: options?.initOnMounted ?? true,
+    onError: options?.onError ?? handleError,
+    writeDefaults: options?.writeDefaults ?? true,
+    serializer: {
+      read: JSON.parse,
+      write: JSON.stringify
+    }
+  });
+  return computed({
+    get: () => local.value.inner,
+    set: (value) => {
+      local.value.inner = value;
+    }
+  });
 }
 
 function onKeyDown(key, handler, options = {}) {
@@ -204,26 +213,6 @@ function onCtrlShiftKeyDown(key, handler, options) {
   return onKeyDown(key, handler, { ...options, ctrlKey: true, shiftKey: true });
 }
 
-function localRef(key, initial, options) {
-  const defaultValue = { inner: initial };
-  const local = useLocalStorage(key, defaultValue, {
-    deep: options?.deep ?? true,
-    initOnMounted: options?.initOnMounted ?? true,
-    onError: options?.onError ?? handleError,
-    writeDefaults: options?.writeDefaults ?? true,
-    serializer: {
-      read: JSON.parse,
-      write: JSON.stringify
-    }
-  });
-  return computed({
-    get: () => local.value.inner,
-    set: (value) => {
-      local.value.inner = value;
-    }
-  });
-}
-
 function sessionRef(key, initial, options) {
   const defaultValue = { inner: initial };
   const session = useSessionStorage(key, defaultValue, {
@@ -244,9 +233,46 @@ function sessionRef(key, initial, options) {
   });
 }
 
+function asyncComputed(initial, callback, options) {
+  const state = computedAsync(callback, initial, {
+    onError: handleError,
+    shallow: true,
+    lazy: false,
+    ...options
+  });
+  return state;
+}
+
+function useWindowHeight() {
+  return useWindowSize().height;
+}
+function useWindowWidth() {
+  return useWindowSize().width;
+}
+
+function useElementSize(element) {
+  return useElementSize$1(toRef(element), { height: 0, width: 0 }, { box: "border-box" });
+}
+function useHeight(element) {
+  return useElementSize(element).height;
+}
+function useHeightDiff(element) {
+  const height = useHeight(element);
+  const windowHeight = useWindowHeight();
+  return computed(() => windowHeight.value - height.value);
+}
+function useWidth(element) {
+  return useElementSize(element).width;
+}
+function useWidthDiff(element) {
+  const width = useWidth(element);
+  const windowWidth = useWindowWidth();
+  return computed(() => windowWidth.value - width.value);
+}
+
 function maybe(value, fn) {
   const _value = toValue(value);
   return isNil(_value) ? null : fn(_value);
 }
 
-export { asyncComputed, asyncRef, getCurrentApp, getErrorHandler, handleError, inject, localRef, log, maybe, onAltKeyDown, onCtrlKeyDown, onCtrlShiftKeyDown, onKeyDown, onShiftKeyDown, provide, runWithContext, sessionRef, setCurrentApp, setErrorHandler, tryGetCurrentApp, tryInject, tryInjectOrElse, trySetCurrentApp, useElementSize, useHeight, useHeightDiff, useWidth, useWidthDiff, useWindowHeight, useWindowWidth, warn };
+export { asyncComputed, asyncRef, getCurrentApp, getErrorHandler, handleError, inject, localRef, log, maybe, onAltKeyDown, onCtrlKeyDown, onCtrlShiftKeyDown, onKeyDown, onShiftKeyDown, provide, runWithContext, sessionRef, setCurrentApp, setErrorHandler, tryGetCurrentApp, tryInject, tryInjectOrElse, trySetCurrentApp, useElementSize, useHeight, useHeightDiff, useMutex, useWidth, useWidthDiff, useWindowHeight, useWindowWidth, warn };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tb-dev/vue",
-  "version": "2.0.14",
+  "version": "2.2.0",
   "description": "Vue utilities",
   "license": "MIT",
   "type": "module",
@@ -26,6 +26,7 @@
   "dependencies": {
     "@tb-dev/utils": "^7.0.8",
     "@vueuse/core": "^13.5.0",
+    "es-toolkit": "^1.39.7",
     "vue": "^3.5.18"
   },
   "devDependencies": {