motion-v 0.12.0 → 0.13.0-beta.2

package/dist/es/utils/use-in-view.mjs

@@ -1,8 +1,8 @@
 import { ref, watch, isRef, unref } from "vue";
-import { inView } from "../external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/render/dom/viewport/index.mjs";
+import { inView } from "../external/.pnpm/framer-motion@12.5.0/external/framer-motion/dist/es/render/dom/viewport/index.mjs";
 function useInView(domRef, options) {
   const isInView = ref(false);
-  watch([domRef, () => isRef(options) ? options.value : options], (_v1, _v2) => {
+  watch([domRef, () => isRef(options) ? options.value : options], (_v1, _v2, onCleanup) => {
     const realOptions = unref(options) || {};
     const { once } = realOptions;
     if (!domRef.value || once && isInView.value) {
@@ -14,7 +14,10 @@ function useInView(domRef, options) {
         isInView.value = false;
       };
     };
-    return inView(domRef.value, onEnter, realOptions);
+    const cleanup = inView(domRef.value, onEnter, realOptions);
+    onCleanup(() => {
+      cleanup();
+    });
   }, {
     immediate: true
   });

package/dist/es/value/use-combine-values.mjs

@@ -1,6 +1,5 @@
 import { onUnmounted } from "vue";
-import { motionValue } from "../external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/value/index.mjs";
-import { cancelFrame, frame } from "../external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/frameloop/frame.mjs";
+import { motionValue, cancelFrame, frame } from "motion-dom";
 function useCombineMotionValues(combineValues) {
   const value = motionValue(combineValues());
   const updateValue = () => value.set(combineValues());

package/dist/es/value/use-computed.mjs

@@ -1,5 +1,5 @@
 import { useCombineMotionValues } from "./use-combine-values.mjs";
-import { collectMotionValues } from "../external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/value/index.mjs";
+import { collectMotionValues } from "motion-dom";
 import { onBeforeUpdate } from "vue";
 function useComputed(computed) {
   collectMotionValues.current = [];

package/dist/es/value/use-motion-value-event.d.ts

@@ -1,3 +1,2 @@
-import { MotionValue } from 'framer-motion/dom';
-import { MotionValueEventCallbacks } from '../types';
+import { MotionValue, MotionValueEventCallbacks } from 'framer-motion/dom';
 export declare function useMotionValueEvent<V, EventName extends keyof MotionValueEventCallbacks<V>>(value: MotionValue<V>, event: EventName, callback: MotionValueEventCallbacks<V>[EventName]): VoidFunction;

package/dist/es/value/use-scroll.d.ts

@@ -5,8 +5,8 @@ export interface UseScrollOptions extends Omit<ScrollInfoOptions, 'container' |
     target?: Ref<HTMLElement | null>;
 }
 export declare function useScroll({ container, target, ...options }?: UseScrollOptions): {
-    scrollX: import('framer-motion/dom').MotionValue<number>;
-    scrollY: import('framer-motion/dom').MotionValue<number>;
-    scrollXProgress: import('framer-motion/dom').MotionValue<number>;
-    scrollYProgress: import('framer-motion/dom').MotionValue<number>;
+    scrollX: import('motion-dom').MotionValue<number>;
+    scrollY: import('motion-dom').MotionValue<number>;
+    scrollXProgress: import('motion-dom').MotionValue<number>;
+    scrollYProgress: import('motion-dom').MotionValue<number>;
 };

package/dist/es/value/use-scroll.mjs

@@ -1,7 +1,7 @@
-import { onMounted, onUnmounted, watch } from "vue";
+import { onMounted, watch } from "vue";
 import { warning } from "hey-listen";
-import { motionValue } from "../external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/value/index.mjs";
-import { scroll } from "../external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/render/dom/scroll/index.mjs";
+import { scroll } from "../external/.pnpm/framer-motion@12.5.0/external/framer-motion/dist/es/render/dom/scroll/index.mjs";
+import { motionValue } from "motion-dom";
 function refWarning(name, ref) {
   warning(
     Boolean(!ref || ref.value),
@@ -22,32 +22,30 @@ function useScroll({
   ...options
 } = {}) {
   const values = createScrollMotionValues();
-  let cleanup;
-  const setupScroll = () => {
-    cleanup == null ? void 0 : cleanup();
-    cleanup = scroll(
-      (_progress, { x, y }) => {
-        values.scrollX.set(x.current);
-        values.scrollXProgress.set(x.progress);
-        values.scrollY.set(y.current);
-        values.scrollYProgress.set(y.progress);
-      },
-      {
-        ...options,
-        container: (container == null ? void 0 : container.value) ?? void 0,
-        target: (target == null ? void 0 : target.value) ?? void 0
-      }
-    );
-  };
   onMounted(() => {
     refWarning("target", target);
     refWarning("container", container);
-    setupScroll();
   });
-  onUnmounted(() => cleanup == null ? void 0 : cleanup());
   watch(
-    () => [container == null ? void 0 : container.value, target == null ? void 0 : target.value, options.offset],
-    setupScroll
+    [container, target, () => options.offset],
+    (n, o, onCleanup) => {
+      const cleanup = scroll(
+        (_progress, { x, y }) => {
+          values.scrollX.set(x.current);
+          values.scrollXProgress.set(x.progress);
+          values.scrollY.set(y.current);
+          values.scrollYProgress.set(y.progress);
+        },
+        {
+          ...options,
+          container: (container == null ? void 0 : container.value) ?? void 0,
+          target: (target == null ? void 0 : target.value) ?? void 0
+        }
+      );
+      onCleanup(() => {
+        cleanup();
+      });
+    }
   );
   return values;
 }

package/dist/es/value/use-spring.mjs

@@ -1,7 +1,6 @@
 import { watch, isRef } from "vue";
-import { animateValue } from "../external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/animation/animators/MainThreadAnimation.mjs";
-import { motionValue } from "../external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/value/index.mjs";
-import { frame, frameData } from "../external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/frameloop/frame.mjs";
+import { animateValue } from "../external/.pnpm/framer-motion@12.5.0/external/framer-motion/dist/es/animation/animators/MainThreadAnimation.mjs";
+import { motionValue, frame, frameData } from "motion-dom";
 import { isMotionValue } from "../utils/motion-value.mjs";
 function toNumber(v) {
   if (typeof v === "number")

package/dist/es/value/use-time.d.ts

@@ -1 +1 @@
-export declare function useTime(): import('framer-motion/dom').MotionValue<number>;
+export declare function useTime(): import('motion-dom').MotionValue<number>;

package/dist/es/value/use-time.mjs

@@ -1,5 +1,5 @@
 import { useAnimationFrame } from "../utils/use-animation-frame.mjs";
-import { motionValue } from "../external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/value/index.mjs";
+import { motionValue } from "motion-dom";
 function useTime() {
   const time = motionValue(0);
   useAnimationFrame((t) => time.set(t));

package/dist/es/value/use-transform.mjs

@@ -1,14 +1,12 @@
 import { useComputed } from "./use-computed.mjs";
 import { useCombineMotionValues } from "./use-combine-values.mjs";
-import { computed, isRef } from "vue";
-import { transform } from "../external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/utils/transform.mjs";
+import { isRef, computed } from "vue";
+import { transform } from "../external/.pnpm/framer-motion@12.5.0/external/framer-motion/dist/es/utils/transform.mjs";
 function useTransform(input, inputRangeOrTransformer, outputRange, options) {
   if (typeof input === "function") {
     return useComputed(input);
   }
-  const transformer = computed(() => {
-    return typeof inputRangeOrTransformer === "function" ? inputRangeOrTransformer : transform(isRef(inputRangeOrTransformer) ? inputRangeOrTransformer.value : inputRangeOrTransformer, outputRange, options);
-  });
+  const transformer = typeof inputRangeOrTransformer === "function" ? inputRangeOrTransformer : isRef(inputRangeOrTransformer) ? computed(() => transform(inputRangeOrTransformer.value, outputRange, options)) : transform(inputRangeOrTransformer, outputRange, options);
   return Array.isArray(input) ? useListTransform(
     input,
     transformer

package/dist/es/value/use-velocity.mjs

@@ -1,6 +1,5 @@
 import { useMotionValueEvent } from "./use-motion-value-event.mjs";
-import { motionValue } from "../external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/value/index.mjs";
-import { frame } from "../external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/frameloop/frame.mjs";
+import { motionValue, frame } from "motion-dom";
 function useVelocity(value) {
   const velocity = motionValue(value.getVelocity());
   const updateVelocity = () => {

package/dist/nuxt/index.cjs

@@ -1,8 +1,31 @@
 'use strict';
 
 const kit = require('@nuxt/kit');
-const motionV = require('motion-v');
 
+const components = [
+  "Motion",
+  "AnimatePresence",
+  "LayoutGroup",
+  "MotionConfig",
+  "ReorderGroup",
+  "ReorderItem"
+];
+const utilities = [
+  "useTransform",
+  "useTime",
+  "useMotionTemplate",
+  "useSpring",
+  "useScroll",
+  "useMotionValue",
+  "useVelocity",
+  "useAnimate",
+  "useInView",
+  "useAnimationFrame",
+  "useMotionValueEvent",
+  "useLayoutGroup",
+  "useDragControls",
+  "useReducedMotion"
+];
 const index = kit.defineNuxtModule({
   meta: {
     name: "motion-v",
@@ -13,36 +36,25 @@ const index = kit.defineNuxtModule({
   },
   defaults: {
     prefix: "",
-    components: true
+    components: true,
+    utilities: true
   },
   setup(options, _nuxtApp) {
-    function getComponents() {
-      if (typeof options.components === "object") {
-        return Object.entries(motionV.components).filter(([name]) => options.components[name]).flatMap(([_, components]) => components);
-      }
-      if (options.components)
-        return Object.values(motionV.components).flat();
-      return [];
-    }
-    for (const component of getComponents()) {
-      kit.addComponent({
-        name: `${options.prefix}${component}`,
-        export: component,
-        filePath: "motion-v"
+    if (options.components) {
+      components.forEach((component) => {
+        kit.addComponent({
+          name: `${options.prefix}${component}`,
+          export: component,
+          filePath: "motion-v"
+        });
       });
     }
-    function getUtilities() {
-      if (typeof options.components === "object") {
-        return Object.entries(motionV.utilities).filter(([name]) => options.components[name]).flatMap(([_, utilities]) => utilities);
-      }
-      if (options.components)
-        return Object.values(motionV.utilities).flat();
-      return [];
-    }
-    for (const utility of getUtilities()) {
-      kit.addImports({
-        from: "motion-v",
-        name: utility
+    if (options.utilities) {
+      utilities.forEach((utility) => {
+        kit.addImports({
+          from: "motion-v",
+          name: utility
+        });
       });
     }
   }

package/dist/nuxt/index.d.cts

@@ -1,10 +1,14 @@
 import * as _nuxt_schema from '@nuxt/schema';
-import { components } from 'motion-v';
 
+declare const components: string[];
+declare const utilities: string[];
+type Components = keyof typeof components;
+type Utilities = keyof typeof utilities;
 interface ModuleOptions {
-    components: Partial<Record<keyof typeof components, boolean>> | boolean;
+    components: boolean;
+    utilities: boolean;
     prefix: string;
 }
 declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
 
-export { type ModuleOptions, _default as default };
+export { type Components, type ModuleOptions, type Utilities, _default as default };

package/dist/nuxt/index.d.mts

@@ -1,10 +1,14 @@
 import * as _nuxt_schema from '@nuxt/schema';
-import { components } from 'motion-v';
 
+declare const components: string[];
+declare const utilities: string[];
+type Components = keyof typeof components;
+type Utilities = keyof typeof utilities;
 interface ModuleOptions {
-    components: Partial<Record<keyof typeof components, boolean>> | boolean;
+    components: boolean;
+    utilities: boolean;
     prefix: string;
 }
 declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
 
-export { type ModuleOptions, _default as default };
+export { type Components, type ModuleOptions, type Utilities, _default as default };

package/dist/nuxt/index.mjs

@@ -1,6 +1,29 @@
 import { defineNuxtModule, addComponent, addImports } from '@nuxt/kit';
-import { components, utilities } from 'motion-v';
 
+const components = [
+  "Motion",
+  "AnimatePresence",
+  "LayoutGroup",
+  "MotionConfig",
+  "ReorderGroup",
+  "ReorderItem"
+];
+const utilities = [
+  "useTransform",
+  "useTime",
+  "useMotionTemplate",
+  "useSpring",
+  "useScroll",
+  "useMotionValue",
+  "useVelocity",
+  "useAnimate",
+  "useInView",
+  "useAnimationFrame",
+  "useMotionValueEvent",
+  "useLayoutGroup",
+  "useDragControls",
+  "useReducedMotion"
+];
 const index = defineNuxtModule({
   meta: {
     name: "motion-v",
@@ -11,36 +34,25 @@ const index = defineNuxtModule({
   },
   defaults: {
     prefix: "",
-    components: true
+    components: true,
+    utilities: true
   },
   setup(options, _nuxtApp) {
-    function getComponents() {
-      if (typeof options.components === "object") {
-        return Object.entries(components).filter(([name]) => options.components[name]).flatMap(([_, components]) => components);
-      }
-      if (options.components)
-        return Object.values(components).flat();
-      return [];
-    }
-    for (const component of getComponents()) {
-      addComponent({
-        name: `${options.prefix}${component}`,
-        export: component,
-        filePath: "motion-v"
+    if (options.components) {
+      components.forEach((component) => {
+        addComponent({
+          name: `${options.prefix}${component}`,
+          export: component,
+          filePath: "motion-v"
+        });
       });
     }
-    function getUtilities() {
-      if (typeof options.components === "object") {
-        return Object.entries(utilities).filter(([name]) => options.components[name]).flatMap(([_, utilities]) => utilities);
-      }
-      if (options.components)
-        return Object.values(utilities).flat();
-      return [];
-    }
-    for (const utility of getUtilities()) {
-      addImports({
-        from: "motion-v",
-        name: utility
+    if (options.utilities) {
+      utilities.forEach((utility) => {
+        addImports({
+          from: "motion-v",
+          name: utility
+        });
       });
     }
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "motion-v",
-  "version": "0.12.0",
+  "version": "0.13.0-beta.2",
   "description": "",
   "author": "",
   "license": "MIT",
@@ -67,8 +67,9 @@
   },
   "dependencies": {
     "@vueuse/core": "^10.0.0",
-    "framer-motion": "12.4.10",
-    "hey-listen": "^1.0.8"
+    "framer-motion": "12.5.0",
+    "hey-listen": "^1.0.8",
+    "motion-dom": "^12.5.0"
   },
   "devDependencies": {
     "vue": "3.4.38"

package/dist/es/constants/index.d.ts

@@ -1,9 +0,0 @@
-declare const components: {
-    motion: string[];
-};
-export { components };
-export type Components = keyof typeof components;
-export declare const utilities: {
-    utilities: string[];
-};
-export type Utilities = keyof typeof utilities;

package/dist/es/constants/index.mjs

@@ -1,31 +0,0 @@
-const components = {
-  motion: [
-    "Motion",
-    "AnimatePresence",
-    "LayoutGroup",
-    "MotionConfig",
-    "ReorderGroup",
-    "ReorderItem"
-  ]
-};
-const utilities = {
-  utilities: [
-    "useTransform",
-    "useTime",
-    "useMotionTemplate",
-    "useSpring",
-    "useScroll",
-    "useMotionValue",
-    "useVelocity",
-    "useAnimate",
-    "useInView",
-    "useAnimationFrame",
-    "useMotionValueEvent",
-    "useLayoutGroup",
-    "useDragControls"
-  ]
-};
-export {
-  components,
-  utilities
-};

package/dist/es/external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/frameloop/batcher.mjs

@@ -1,63 +0,0 @@
-import { stepsOrder } from "./order.mjs";
-import { createRenderStep } from "./render-step.mjs";
-const maxElapsed = 40;
-function createRenderBatcher(scheduleNextBatch, allowKeepAlive) {
-  let runNextFrame = false;
-  let useDefaultElapsed = true;
-  const state = {
-    delta: 0,
-    timestamp: 0,
-    isProcessing: false
-  };
-  const flagRunNextFrame = () => runNextFrame = true;
-  const steps = stepsOrder.reduce((acc, key) => {
-    acc[key] = createRenderStep(flagRunNextFrame, allowKeepAlive ? key : void 0);
-    return acc;
-  }, {});
-  const { read, resolveKeyframes, update, preRender, render, postRender } = steps;
-  const processBatch = () => {
-    const timestamp = performance.now();
-    runNextFrame = false;
-    {
-      state.delta = useDefaultElapsed ? 1e3 / 60 : Math.max(Math.min(timestamp - state.timestamp, maxElapsed), 1);
-    }
-    state.timestamp = timestamp;
-    state.isProcessing = true;
-    read.process(state);
-    resolveKeyframes.process(state);
-    update.process(state);
-    preRender.process(state);
-    render.process(state);
-    postRender.process(state);
-    state.isProcessing = false;
-    if (runNextFrame && allowKeepAlive) {
-      useDefaultElapsed = false;
-      scheduleNextBatch(processBatch);
-    }
-  };
-  const wake = () => {
-    runNextFrame = true;
-    useDefaultElapsed = true;
-    if (!state.isProcessing) {
-      scheduleNextBatch(processBatch);
-    }
-  };
-  const schedule = stepsOrder.reduce((acc, key) => {
-    const step = steps[key];
-    acc[key] = (process, keepAlive = false, immediate = false) => {
-      if (!runNextFrame)
-        wake();
-      return step.schedule(process, keepAlive, immediate);
-    };
-    return acc;
-  }, {});
-  const cancel = (process) => {
-    for (let i = 0; i < stepsOrder.length; i++) {
-      steps[stepsOrder[i]].cancel(process);
-    }
-  };
-  return { schedule, cancel, state, steps };
-}
-export {
-  createRenderBatcher
-};

package/dist/es/external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/frameloop/frame.mjs

@@ -1,10 +0,0 @@
-import "../../../../../../motion-utils@12.4.10/external/motion-utils/dist/es/errors.mjs";
-import { noop } from "../../../../../../motion-utils@12.4.10/external/motion-utils/dist/es/noop.mjs";
-import { createRenderBatcher } from "./batcher.mjs";
-const { schedule: frame, cancel: cancelFrame, state: frameData, steps: frameSteps } = createRenderBatcher(typeof requestAnimationFrame !== "undefined" ? requestAnimationFrame : noop, true);
-export {
-  cancelFrame,
-  frame,
-  frameData,
-  frameSteps
-};

package/dist/es/external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/frameloop/index-legacy.mjs

@@ -1,11 +0,0 @@
-import { stepsOrder } from "./order.mjs";
-import { frame, cancelFrame } from "./frame.mjs";
-const sync = frame;
-const cancelSync = stepsOrder.reduce((acc, key) => {
-  acc[key] = (process) => cancelFrame(process);
-  return acc;
-}, {});
-export {
-  cancelSync,
-  sync
-};

package/dist/es/external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/frameloop/microtask.mjs

@@ -1,6 +0,0 @@
-import { createRenderBatcher } from "./batcher.mjs";
-const { schedule: microtask, cancel: cancelMicrotask } = createRenderBatcher(queueMicrotask, false);
-export {
-  cancelMicrotask,
-  microtask
-};

package/dist/es/external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/frameloop/order.mjs

@@ -1,17 +0,0 @@
-const stepsOrder = [
-  "read",
-  // Read
-  "resolveKeyframes",
-  // Write/Read/Write/Read
-  "update",
-  // Compute
-  "preRender",
-  // Compute
-  "render",
-  // Write
-  "postRender"
-  // Compute
-];
-export {
-  stepsOrder
-};

package/dist/es/external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/frameloop/render-step.mjs

@@ -1,70 +0,0 @@
-import { statsBuffer } from "../stats/buffer.mjs";
-function createRenderStep(runNextFrame, stepName) {
-  let thisFrame = /* @__PURE__ */ new Set();
-  let nextFrame = /* @__PURE__ */ new Set();
-  let isProcessing = false;
-  let flushNextFrame = false;
-  const toKeepAlive = /* @__PURE__ */ new WeakSet();
-  let latestFrameData = {
-    delta: 0,
-    timestamp: 0,
-    isProcessing: false
-  };
-  let numCalls = 0;
-  function triggerCallback(callback) {
-    if (toKeepAlive.has(callback)) {
-      step.schedule(callback);
-      runNextFrame();
-    }
-    numCalls++;
-    callback(latestFrameData);
-  }
-  const step = {
-    /**
-     * Schedule a process to run on the next frame.
-     */
-    schedule: (callback, keepAlive = false, immediate = false) => {
-      const addToCurrentFrame = immediate && isProcessing;
-      const queue = addToCurrentFrame ? thisFrame : nextFrame;
-      if (keepAlive)
-        toKeepAlive.add(callback);
-      if (!queue.has(callback))
-        queue.add(callback);
-      return callback;
-    },
-    /**
-     * Cancel the provided callback from running on the next frame.
-     */
-    cancel: (callback) => {
-      nextFrame.delete(callback);
-      toKeepAlive.delete(callback);
-    },
-    /**
-     * Execute all schedule callbacks.
-     */
-    process: (frameData) => {
-      latestFrameData = frameData;
-      if (isProcessing) {
-        flushNextFrame = true;
-        return;
-      }
-      isProcessing = true;
-      [thisFrame, nextFrame] = [nextFrame, thisFrame];
-      thisFrame.forEach(triggerCallback);
-      if (stepName && statsBuffer.value) {
-        statsBuffer.value.frameloop[stepName].push(numCalls);
-      }
-      numCalls = 0;
-      thisFrame.clear();
-      isProcessing = false;
-      if (flushNextFrame) {
-        flushNextFrame = false;
-        step.process(frameData);
-      }
-    }
-  };
-  return step;
-}
-export {
-  createRenderStep
-};

package/dist/es/external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/frameloop/sync-time.mjs

@@ -1,21 +0,0 @@
-import { MotionGlobalConfig } from "../utils/GlobalConfig.mjs";
-import { frameData } from "./frame.mjs";
-let now;
-function clearTime() {
-  now = void 0;
-}
-const time = {
-  now: () => {
-    if (now === void 0) {
-      time.set(frameData.isProcessing || MotionGlobalConfig.useManualTiming ? frameData.timestamp : performance.now());
-    }
-    return now;
-  },
-  set: (newTime) => {
-    now = newTime;
-    queueMicrotask(clearTime);
-  }
-};
-export {
-  time
-};

package/dist/es/external/.pnpm/framer-motion@12.4.10/external/framer-motion/dist/es/stats/buffer.mjs

@@ -1,7 +0,0 @@
-const statsBuffer = {
-  value: null,
-  addProjectionMetrics: null
-};
-export {
-  statsBuffer
-};