@vrojs/use 0.0.2 → 0.0.4

package/dist/index.d.ts

@@ -50,12 +50,35 @@ interface UseAsyncTaskResult<T, D> {
 declare function useAsyncTask<T extends AnyPromiseFn>(task: T, options: UseAsyncTaskOptions<T> & Required<Pick<UseAsyncTaskOptions<T>, 'initialValue'>>): UseAsyncTaskResult<T, Awaited<ReturnType<T>>>;
 declare function useAsyncTask<T extends AnyPromiseFn>(task: T, options?: UseAsyncTaskOptions<T>): UseAsyncTaskResult<T, Awaited<ReturnType<T>> | undefined>;
 
+type MaybeRef<T> = T | Ref<T>;
+interface UseBodyScrollLockReturn {
+    locked: Ref<boolean>;
+    lock: () => void;
+    unlock: () => void;
+    toggle: (value?: boolean) => void;
+}
+/**
+ * 锁定/解锁 body 滚动
+ * @param initialLocked - 初始锁定状态，或外部响应式布尔值
+ */
+declare function useBodyScrollLock(initialLocked?: MaybeRef<boolean>): UseBodyScrollLockReturn;
+
 declare function useComposition(): {
     handleCompositionStart: (event: CompositionEvent) => void;
     handleCompositionEnd: (event: CompositionEvent) => void;
 };
 
-declare function useCountDown(start?: number): readonly [vue.Ref<number, number>, (st?: number) => void];
+interface UseCountDownOptions {
+    /**
+     * 每次倒计时值变化时触发，包括初始值和最终的 0
+     */
+    onChange?: (count: number) => void;
+    /**
+     * 倒计时结束时触发
+     */
+    onFinish?: () => void;
+}
+declare function useCountDown(start?: number, options?: UseCountDownOptions): readonly [vue.Ref<number, number>, (st?: number) => void];
 
 type Loose<T> = T & {
     [key: string]: any;
@@ -260,4 +283,4 @@ declare function useVisible<T extends Record<string, any>, R = any>(options?: Us
     hide: (reason?: any) => Promise<void>;
 };
 
-export { type TransferOptions, type UseAsyncTaskOptions, type UseAsyncTaskResult, type UseEventListenerOptions, type UseKeepAliveOptions, type UseKeepAliveState$1 as UseKeepAliveState, type UseKeepPositionOptions, type UseKeepPositionState, type UsePagingOptions, type UsePagingStatus, type UsePagingTask, type UsePagingTaskOptions, type UsePagingTaskResult, type UsePagingTriggerOptions, type UseSetState, type UseSetStateAction, type UseTransitionNameOptions, type UseTransitionNameState, type UseVisibleOptions, type UseVisibleShowOptions, debounceRef, useAsyncTask, useComposition, useCountDown, useEventListener, useId, useKeepAlive, useKeepAliveByPosition, useKeepPosition, usePaging, useParams, useQuery, useState, useToggle, useTransfer, useTransitionName, useVisible };
+export { type TransferOptions, type UseAsyncTaskOptions, type UseAsyncTaskResult, type UseBodyScrollLockReturn, type UseCountDownOptions, type UseEventListenerOptions, type UseKeepAliveOptions, type UseKeepAliveState$1 as UseKeepAliveState, type UseKeepPositionOptions, type UseKeepPositionState, type UsePagingOptions, type UsePagingStatus, type UsePagingTask, type UsePagingTaskOptions, type UsePagingTaskResult, type UsePagingTriggerOptions, type UseSetState, type UseSetStateAction, type UseTransitionNameOptions, type UseTransitionNameState, type UseVisibleOptions, type UseVisibleShowOptions, debounceRef, useAsyncTask, useBodyScrollLock, useComposition, useCountDown, useEventListener, useId, useKeepAlive, useKeepAliveByPosition, useKeepPosition, usePaging, useParams, useQuery, useState, useToggle, useTransfer, useTransitionName, useVisible };

package/dist/index.js

@@ -117,6 +117,66 @@ function useAsyncTask(task, options) {
   };
 }
 
+// src/useBodyScrollLock/index.ts
+import { getCurrentScope, isRef, onScopeDispose, ref as ref2, unref, watch } from "vue";
+var lockCount = 0;
+var originalOverflow = "";
+function lockBody() {
+  if (typeof document === "undefined") return;
+  if (lockCount === 0) {
+    originalOverflow = document.body.style.overflow;
+    document.body.style.overflow = "hidden";
+  }
+  lockCount++;
+}
+function unlockBody() {
+  if (typeof document === "undefined" || lockCount <= 0) return;
+  lockCount--;
+  if (lockCount === 0) {
+    document.body.style.overflow = originalOverflow;
+    originalOverflow = "";
+  }
+}
+function useBodyScrollLock(initialLocked = false) {
+  const locked = isRef(initialLocked) ? initialLocked : ref2(unref(initialLocked));
+  let currentLocked = false;
+  const sync = (value) => {
+    if (value === currentLocked) return;
+    if (value) {
+      lockBody();
+    } else {
+      unlockBody();
+    }
+    currentLocked = value;
+  };
+  const stop = watch(locked, sync, { immediate: true });
+  const cleanup = () => {
+    stop();
+    if (currentLocked) {
+      unlockBody();
+      currentLocked = false;
+    }
+  };
+  if (getCurrentScope()) {
+    onScopeDispose(cleanup);
+  }
+  const lock = () => {
+    locked.value = true;
+  };
+  const unlock = () => {
+    locked.value = false;
+  };
+  const toggle = (value = !locked.value) => {
+    locked.value = value;
+  };
+  return {
+    locked,
+    lock,
+    unlock,
+    toggle
+  };
+}
+
 // src/useComposition/index.ts
 function useComposition() {
   const handleCompositionStart = (event) => {
@@ -136,21 +196,23 @@ function useComposition() {
 }
 
 // src/useCountDown/index.ts
-import { ref as ref2 } from "vue";
-function useCountDown(start = 60) {
-  const countRef = ref2(0);
+import { ref as ref3 } from "vue";
+function useCountDown(start = 60, options = {}) {
+  const countRef = ref3(0);
   let timer;
   const trigger = (st = start) => {
     clearTimeout(timer);
     let loop;
     (loop = (count) => {
+      var _a, _b;
+      count = Math.max(count, 0);
       countRef.value = count;
+      (_a = options.onChange) == null ? void 0 : _a.call(options, count);
       if (count <= 0) {
-        countRef.value = 0;
+        (_b = options.onFinish) == null ? void 0 : _b.call(options);
         return;
       }
-      count--;
-      timer = setTimeout(loop, 1e3, count);
+      timer = setTimeout(loop, 1e3, count - 1);
     })(st);
   };
   return [countRef, trigger];
@@ -158,19 +220,19 @@ function useCountDown(start = 60) {
 
 // src/useEventListener/index.ts
 import {
-  watch,
-  isRef,
-  unref,
-  onUnmounted,
+  isRef as isRef2,
+  onActivated as onActivated2,
   onDeactivated,
   onMounted,
-  onActivated as onActivated2
+  onUnmounted,
+  unref as unref2,
+  watch as watch2
 } from "vue";
 function useEventListener(type, listener, options = {}) {
   const { target = window, passive = false, capture = false } = options;
   let attached;
   const add = (target2) => {
-    let element = unref(target2);
+    let element = unref2(target2);
     if (element == null ? void 0 : element.$el) {
       element = element.$el;
     }
@@ -183,7 +245,7 @@ function useEventListener(type, listener, options = {}) {
     }
   };
   const remove = (target2) => {
-    let element = unref(target2);
+    let element = unref2(target2);
     if (element == null ? void 0 : element.$el) {
       element = element.$el;
     }
@@ -196,8 +258,8 @@ function useEventListener(type, listener, options = {}) {
   onDeactivated(() => remove(target));
   onActivated2(() => add(target));
   onMounted(() => add(target));
-  if (isRef(target)) {
-    watch(target, (val, oldVal) => {
+  if (isRef2(target)) {
+    watch2(target, (val, oldVal) => {
       remove(oldVal);
       add(val);
     });
@@ -215,10 +277,10 @@ function useId() {
 
 // src/useKeepAlive/index.ts
 import { isNumber, isUndefined } from "@daysnap/utils";
-import { ref as ref3, watch as watch2 } from "vue";
+import { ref as ref4, watch as watch3 } from "vue";
 import { useRoute } from "vue-router";
-var keepAliveList = ref3();
-var includes = ref3([]);
+var keepAliveList = ref4();
+var includes = ref4([]);
 var getHistoryState = () => {
   var _a;
   return (_a = history.state) != null ? _a : {};
@@ -228,7 +290,7 @@ function useKeepAlive(options) {
   if (isUndefined(keepAliveList.value)) {
     keepAliveList.value = [];
     const route = useRoute();
-    watch2(
+    watch3(
       () => __spreadValues({}, route),
       (to, from) => {
         var _a2;
@@ -253,7 +315,7 @@ function useKeepAlive(options) {
       }
     );
     const ms = isNumber(options) ? options : 0;
-    watch2(
+    watch3(
       () => keepAliveList.value,
       (nv, ov) => {
         if (JSON.stringify(nv) !== JSON.stringify(ov)) {
@@ -286,10 +348,10 @@ function useKeepAlive(options) {
 }
 
 // src/useKeepAliveByPosition/index.ts
-import { ref as ref4, watch as watch3, computed } from "vue";
+import { isBoolean, isUndefined as isUndefined2 } from "@daysnap/utils";
+import { computed, ref as ref5, watch as watch4 } from "vue";
 import { useRoute as useRoute2 } from "vue-router";
-import { isUndefined as isUndefined2, isBoolean } from "@daysnap/utils";
-var keepAliveList2 = ref4();
+var keepAliveList2 = ref5();
 var setState = (state, ms = 0) => {
   if (JSON.stringify(state) !== JSON.stringify(keepAliveList2.value)) {
     setTimeout(() => keepAliveList2.value = state, ms);
@@ -310,7 +372,7 @@ function useKeepAliveByPosition(options) {
   if (isUndefined2(keepAliveList2.value)) {
     keepAliveList2.value = [];
     const route = useRoute2();
-    watch3(
+    watch4(
       () => __spreadValues({}, route),
       (_, from) => {
         var _a2;
@@ -346,11 +408,11 @@ function useKeepAliveByPosition(options) {
 
 // src/useKeepPosition/index.ts
 import { pick } from "@daysnap/utils";
-import { onActivated as onActivated3, nextTick, ref as ref5 } from "vue";
+import { nextTick, onActivated as onActivated3, ref as ref6 } from "vue";
 import { onBeforeRouteLeave } from "vue-router";
 function useKeepPosition(options = {}) {
   const { selectors } = options;
-  const state = ref5();
+  const state = ref6();
   const getTarget = () => {
     var _a, _b;
     return (_b = (_a = options.getTarget) == null ? void 0 : _a.call(options)) != null ? _b : selectors ? document.querySelector(selectors) : document.documentElement;
@@ -383,7 +445,7 @@ function useKeepPosition(options = {}) {
 
 // src/usePaging/index.ts
 import { isArray, isBoolean as isBoolean2, isFunction as isFunction2, isObject, isString } from "@daysnap/utils";
-import { computed as computed2, onBeforeMount as onBeforeMount2, reactive, ref as ref6 } from "vue";
+import { computed as computed2, onBeforeMount as onBeforeMount2, reactive, ref as ref7 } from "vue";
 function usePaging(task, options = {}) {
   const { initialStatus, immediate, scrollSelector = ".hor-scroll" } = options;
   const pagingStatus = reactive(
@@ -407,7 +469,7 @@ function usePaging(task, options = {}) {
       }
     }
   };
-  const pagingData = ref6([]);
+  const pagingData = ref7([]);
   const pagingReset = () => {
     pagingStatus.pagingIndex = 0;
     pagingStatus.pagingTotal = -1;
@@ -473,7 +535,10 @@ function usePaging(task, options = {}) {
       if (isFunction2(options2)) {
         options2();
       }
-      return console.log("\u6CA1\u6709\u66F4\u591A\u4E86");
+      return console.log("\u6CA1\u6709\u66F4\u591A\u4E86...");
+    }
+    if (pagingStatus.pagingLoading) {
+      return console.log("\u6B63\u5728\u52A0\u8F7D\u4E2D...");
     }
     pagingTrigger(pagingStatus.pagingIndex + 1, options2);
   };
@@ -512,9 +577,9 @@ function useQuery() {
 
 // src/useState/index.ts
 import { isFunction as isFunction3 } from "@daysnap/utils";
-import { ref as ref7 } from "vue";
+import { ref as ref8 } from "vue";
 function useState(initialState) {
-  const state = ref7(initialState);
+  const state = ref8(initialState);
   const setState2 = (value) => {
     state.value = isFunction3(value) ? value(state.value) : value;
   };
@@ -522,9 +587,9 @@ function useState(initialState) {
 }
 
 // src/useToggle/index.ts
-import { ref as ref8 } from "vue";
+import { ref as ref9 } from "vue";
 function useToggle(initialValue = false) {
-  const visible = ref8(initialValue);
+  const visible = ref9(initialValue);
   const toggle = (value = !visible.value) => {
     visible.value = value;
   };
@@ -559,7 +624,7 @@ function useTransfer() {
 }
 
 // src/useTransitionName/index.ts
-import { ref as ref9, watch as watch4 } from "vue";
+import { ref as ref10, watch as watch5 } from "vue";
 import { useRoute as useRoute5 } from "vue-router";
 var KEY = "$$useTransitionName__state";
 var get = () => {
@@ -575,9 +640,9 @@ var set = (state) => {
 };
 function useTransitionName(options) {
   const { deep } = options;
-  const name = ref9("");
+  const name = ref10("");
   const route = useRoute5();
-  watch4(
+  watch5(
     () => __spreadValues({}, route),
     (to, from) => {
       const { position } = history.state || {};
@@ -603,10 +668,10 @@ function useTransitionName(options) {
 }
 
 // src/useVisible/index.ts
-import { ref as ref10 } from "vue";
+import { ref as ref11 } from "vue";
 function useVisible(options = {}) {
   const { showCallback, hideCallback, confirmCallback } = options;
-  const visible = ref10(false);
+  const visible = ref11(false);
   let resolve;
   let reject;
   let beforeClose;
@@ -650,6 +715,7 @@ function useVisible(options = {}) {
 export {
   debounceRef,
   useAsyncTask,
+  useBodyScrollLock,
   useComposition,
   useCountDown,
   useEventListener,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vrojs/use",
-  "version": "0.0.2",
+  "version": "0.0.4",
   "type": "module",
   "description": "vrojs composables",
   "main": "dist/index.js",
@@ -28,7 +28,7 @@
     "vue-router": ">=4.2.4"
   },
   "devDependencies": {
-    "@daysnap/utils": "^0.1.34",
+    "@daysnap/utils": "^0.1.36",
     "rimraf": "^6.0.1",
     "tsup": "^8.5.1",
     "typescript": "^5.9.3",