@varlet/use 3.6.4 → 3.7.0

package/lib/index.cjs

@@ -56,6 +56,7 @@ __export(src_exports, {
   useEventListener: () => useEventListener,
   useId: () => useId,
   useInitialized: () => useInitialized,
+  useMotion: () => useMotion,
   useParent: () => useParent,
   useTouch: () => useTouch,
   useVModel: () => useVModel,
@@ -497,6 +498,55 @@ function useVModel(props, key, options = {}) {
   );
   return proxy;
 }
+
+// src/useMotion.ts
+var import_shared9 = require("@varlet/shared");
+var import_vue13 = require("vue");
+function useMotion(options) {
+  const value = (0, import_vue13.ref)(getter(options.from));
+  const state = (0, import_vue13.ref)("pending");
+  let ctx = createMotionContext();
+  function getter(value2) {
+    return (0, import_shared9.isFunction)(value2) ? value2() : value2;
+  }
+  function reset() {
+    ctx.reset();
+    value.value = getter(options.from);
+    state.value = "pending";
+    ctx = createMotionContext();
+  }
+  function start() {
+    ctx.start();
+  }
+  function pause() {
+    ctx.pause();
+  }
+  function createMotionContext() {
+    return (0, import_shared9.motion)({
+      from: getter(options.from),
+      to: getter(options.to),
+      duration: options.duration ? getter(options.duration) : 300,
+      timingFunction: options.timingFunction,
+      onStateChange(newState) {
+        state.value = newState;
+      },
+      frame({ value: newValue, done }) {
+        var _a;
+        value.value = newValue;
+        if (done) {
+          (_a = options.onFinished) == null ? void 0 : _a.call(options, value.value);
+        }
+      }
+    });
+  }
+  return {
+    value,
+    state,
+    start,
+    pause,
+    reset
+  };
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   keyInProvides,
@@ -509,6 +559,7 @@ function useVModel(props, key, options = {}) {
   useEventListener,
   useId,
   useInitialized,
+  useMotion,
   useParent,
   useTouch,
   useVModel,

package/lib/index.d.cts

@@ -1,5 +1,6 @@
 import * as vue from 'vue';
 import { Ref, ComponentInternalInstance, ComputedRef, WatchSource, WritableComputedRef } from 'vue';
+import { MotionState } from '@varlet/shared';
 
 type UseEventListenerTarget = EventTarget | Ref<EventTarget | undefined | null> | (() => EventTarget);
 interface UseEventListenerOptions {
@@ -88,4 +89,19 @@ interface UseVModelOptions<P, K extends keyof P> {
 }
 declare function useVModel<P extends Record<string, any>, K extends keyof P>(props: P, key: K, options?: UseVModelOptions<P, K>): WritableComputedRef<P[K]> | Ref<P[K]>;
 
-export { TouchDirection, UseChildrenBaseProvider, UseClickOutsideTarget, UseEventListenerOptions, UseEventListenerTarget, UseVModelOptions, UseWindowSizeOptions, keyInProvides, onSmartMounted, onSmartUnmounted, onWindowResize, useChildren, useClickOutside, useClientId, useEventListener, useId, useInitialized, useParent, useTouch, useVModel, useWindowSize };
+interface UseMotionOptions {
+    from: number | (() => number);
+    to: number | (() => number);
+    duration?: number | (() => number);
+    timingFunction?: (v: number) => number;
+    onFinished?: (value: number) => void;
+}
+declare function useMotion(options: UseMotionOptions): {
+    value: vue.Ref<number>;
+    state: vue.Ref<MotionState>;
+    start: () => void;
+    pause: () => void;
+    reset: () => void;
+};
+
+export { TouchDirection, UseChildrenBaseProvider, UseClickOutsideTarget, UseEventListenerOptions, UseEventListenerTarget, UseMotionOptions, UseVModelOptions, UseWindowSizeOptions, keyInProvides, onSmartMounted, onSmartUnmounted, onWindowResize, useChildren, useClickOutside, useClientId, useEventListener, useId, useInitialized, useMotion, useParent, useTouch, useVModel, useWindowSize };

package/lib/index.d.ts

@@ -1,5 +1,6 @@
 import * as vue from 'vue';
 import { Ref, ComponentInternalInstance, ComputedRef, WatchSource, WritableComputedRef } from 'vue';
+import { MotionState } from '@varlet/shared';
 
 type UseEventListenerTarget = EventTarget | Ref<EventTarget | undefined | null> | (() => EventTarget);
 interface UseEventListenerOptions {
@@ -88,4 +89,19 @@ interface UseVModelOptions<P, K extends keyof P> {
 }
 declare function useVModel<P extends Record<string, any>, K extends keyof P>(props: P, key: K, options?: UseVModelOptions<P, K>): WritableComputedRef<P[K]> | Ref<P[K]>;
 
-export { TouchDirection, UseChildrenBaseProvider, UseClickOutsideTarget, UseEventListenerOptions, UseEventListenerTarget, UseVModelOptions, UseWindowSizeOptions, keyInProvides, onSmartMounted, onSmartUnmounted, onWindowResize, useChildren, useClickOutside, useClientId, useEventListener, useId, useInitialized, useParent, useTouch, useVModel, useWindowSize };
+interface UseMotionOptions {
+    from: number | (() => number);
+    to: number | (() => number);
+    duration?: number | (() => number);
+    timingFunction?: (v: number) => number;
+    onFinished?: (value: number) => void;
+}
+declare function useMotion(options: UseMotionOptions): {
+    value: vue.Ref<number>;
+    state: vue.Ref<MotionState>;
+    start: () => void;
+    pause: () => void;
+    reset: () => void;
+};
+
+export { TouchDirection, UseChildrenBaseProvider, UseClickOutsideTarget, UseEventListenerOptions, UseEventListenerTarget, UseMotionOptions, UseVModelOptions, UseWindowSizeOptions, keyInProvides, onSmartMounted, onSmartUnmounted, onWindowResize, useChildren, useClickOutside, useClientId, useEventListener, useId, useInitialized, useMotion, useParent, useTouch, useVModel, useWindowSize };

package/lib/index.js

@@ -474,6 +474,55 @@ function useVModel(props, key, options = {}) {
   );
   return proxy;
 }
+
+// src/useMotion.ts
+import { isFunction as isFunction3, motion } from "@varlet/shared";
+import { ref as ref7 } from "vue";
+function useMotion(options) {
+  const value = ref7(getter(options.from));
+  const state = ref7("pending");
+  let ctx = createMotionContext();
+  function getter(value2) {
+    return isFunction3(value2) ? value2() : value2;
+  }
+  function reset() {
+    ctx.reset();
+    value.value = getter(options.from);
+    state.value = "pending";
+    ctx = createMotionContext();
+  }
+  function start() {
+    ctx.start();
+  }
+  function pause() {
+    ctx.pause();
+  }
+  function createMotionContext() {
+    return motion({
+      from: getter(options.from),
+      to: getter(options.to),
+      duration: options.duration ? getter(options.duration) : 300,
+      timingFunction: options.timingFunction,
+      onStateChange(newState) {
+        state.value = newState;
+      },
+      frame({ value: newValue, done }) {
+        var _a;
+        value.value = newValue;
+        if (done) {
+          (_a = options.onFinished) == null ? void 0 : _a.call(options, value.value);
+        }
+      }
+    });
+  }
+  return {
+    value,
+    state,
+    start,
+    pause,
+    reset
+  };
+}
 export {
   keyInProvides,
   onSmartMounted,
@@ -485,6 +534,7 @@ export {
   useEventListener,
   useId,
   useInitialized,
+  useMotion,
   useParent,
   useTouch,
   useVModel,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varlet/use",
-  "version": "3.6.4",
+  "version": "3.7.0",
   "type": "module",
   "main": "lib/index.cjs",
   "module": "lib/index.js",
@@ -33,12 +33,12 @@
     "url": "https://github.com/varletjs/varlet/issues"
   },
   "dependencies": {
-    "@varlet/shared": "3.6.4"
+    "@varlet/shared": "3.7.0"
   },
   "devDependencies": {
     "@types/node": "^18.7.18",
     "tsup": "7.2.0",
-    "typescript": "^5.1.5",
+    "typescript": "5.3.3",
     "vue": "3.4.21"
   },
   "peerDependencies": {