motion-v 1.2.0 → 1.3.0

package/dist/cjs/index.js

@@ -483,6 +483,11 @@ const color = {
   },
   transform: (v) => {
     return typeof v === "string" ? v : v.hasOwnProperty("red") ? rgba.transform(v) : hsla.transform(v);
+  },
+  getAnimatableNone: (v) => {
+    const parsed = color.parse(v);
+    parsed.alpha = 0;
+    return color.transform(parsed);
   }
 };
 const colorRegex = /(?:#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\))/giu;
@@ -550,7 +555,7 @@ function createTransformer(source) {
     return output;
   };
 }
-const convertNumbersToZero = (v) => typeof v === "number" ? 0 : v;
+const convertNumbersToZero = (v) => typeof v === "number" ? 0 : color.test(v) ? color.getAnimatableNone(v) : v;
 function getAnimatableNone$1(v) {
   const parsed = parseComplexValue(v);
   const transformer = createTransformer(v);
@@ -736,7 +741,7 @@ const generateLinearEasing = (easing, duration, resolution = 10) => {
   let points = "";
   const numPoints = Math.max(Math.round(duration / resolution), 2);
   for (let i = 0; i < numPoints; i++) {
-    points += easing(i / (numPoints - 1)) + ", ";
+    points += Math.round(easing(i / (numPoints - 1)) * 1e4) / 1e4 + ", ";
   }
   return `linear(${points.substring(0, points.length - 2)})`;
 };
@@ -3825,6 +3830,8 @@ function calcNextTime(current2, next2, prev, labels) {
     return Math.max(0, current2 + parseFloat(next2));
   } else if (next2 === "<") {
     return prev;
+  } else if (next2.startsWith("<")) {
+    return Math.max(0, prev + parseFloat(next2.slice(1)));
   } else {
     return labels.get(next2) ?? current2;
   }
@@ -3895,7 +3902,7 @@ function createAnimationsFromSequence(sequence, { defaultTransition = {}, ...seq
       let { ease: ease2 = defaultTransition.ease || "easeOut", duration } = valueTransition;
       const calculatedDelay = typeof delay2 === "function" ? delay2(elementIndex, numSubjects) : delay2;
       const numKeyframes = valueKeyframesAsList.length;
-      const createGenerator = isGenerator(type) ? type : generators == null ? void 0 : generators[type];
+      const createGenerator = isGenerator(type) ? type : generators == null ? void 0 : generators[type || "keyframes"];
       if (numKeyframes <= 2 && createGenerator) {
         let absoluteDelta = 100;
         if (numKeyframes === 2 && isNumberKeyframesArray(valueKeyframesAsList)) {
@@ -5809,6 +5816,21 @@ function removeDoneCallback(element) {
   doneCallbacks.delete(element);
 }
 const [injectAnimatePresence, provideAnimatePresence] = createContext("AnimatePresenceContext");
+function useAnimatePresence(props) {
+  const presenceContext = {
+    initial: props.initial,
+    custom: props.custom
+  };
+  vue.watch(() => props.custom, (v) => {
+    presenceContext.custom = v;
+  }, {
+    flush: "pre"
+  });
+  provideAnimatePresence(presenceContext);
+  vue.onMounted(() => {
+    presenceContext.initial = void 0;
+  });
+}
 function resolveVariant(definition, variants, custom) {
   if (Array.isArray(definition)) {
     return definition.reduce((acc, item) => {
@@ -6059,7 +6081,8 @@ function handleHoverEvent(state, entry, lifecycle) {
 }
 class InViewGesture extends Feature {
   isActive() {
-    return Boolean(this.state.options.whileInView);
+    const { whileInView, onViewportEnter, onViewportLeave } = this.state.options;
+    return Boolean(whileInView || onViewportEnter || onViewportLeave);
   }
   constructor(state) {
     super(state);
@@ -7457,7 +7480,7 @@ class AnimationFeature extends Feature {
     let variantTransition = this.state.options.transition;
     let variant = {};
     const { variants, custom, transition, animatePresenceContext } = this.state.options;
-    const customValue = core.isDef(custom) ? custom : animatePresenceContext == null ? void 0 : animatePresenceContext.custom;
+    const customValue = custom ?? (animatePresenceContext == null ? void 0 : animatePresenceContext.custom);
     this.state.activeStates = { ...this.state.activeStates, ...controlActiveState };
     STATE_TYPES.forEach((name) => {
       if (!this.state.activeStates[name] || isAnimationControls(this.state.options[name]))
@@ -9072,10 +9095,12 @@ class MotionState {
   }
   // Initialize animation target values
   initTarget(initialVariantSource) {
+    var _a;
+    const custom = this.options.custom ?? ((_a = this.options.animatePresenceContext) == null ? void 0 : _a.custom);
     this.baseTarget = initialVariantSource.reduce((acc, variant) => {
       return {
         ...acc,
-        ...resolveVariant(this.options[variant] || this.context[variant], this.options.variants)
+        ...resolveVariant(this.options[variant] || this.context[variant], this.options.variants, custom)
       };
     }, {});
     this.target = {};
@@ -9596,14 +9621,7 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
   },
   setup(__props) {
     const props = __props;
-    const presenceContext = {
-      initial: props.initial,
-      custom: props.custom
-    };
-    provideAnimatePresence(presenceContext);
-    vue.onMounted(() => {
-      presenceContext.initial = void 0;
-    });
+    useAnimatePresence(props);
     const { addPopStyle, removePopStyle, styles } = usePopLayout(props);
     function findMotionElement(el) {
       let current2 = el;
@@ -9892,18 +9910,19 @@ function useCombineMotionValues(combineValues) {
   return {
     subscribe,
     unsubscribe,
-    value
+    value,
+    updateValue
   };
 }
 function useComputed(computed) {
   collectMotionValues.current = [];
-  const { value, subscribe, unsubscribe } = useCombineMotionValues(computed);
+  const { value, subscribe, unsubscribe, updateValue } = useCombineMotionValues(computed);
   subscribe(collectMotionValues.current);
   collectMotionValues.current = void 0;
-  vue.onBeforeUpdate(() => {
+  vue.watchEffect(() => {
     unsubscribe();
     collectMotionValues.current = [];
-    computed();
+    updateValue();
     subscribe(collectMotionValues.current);
     collectMotionValues.current = void 0;
   });

package/dist/es/animation/hooks/animation-controls.mjs

@@ -1,6 +1,6 @@
 import { mountedStates } from "../../state/motion-state.mjs";
 import { invariant } from "hey-listen";
-import { setTarget } from "../../external/.pnpm/framer-motion@12.16.0/external/framer-motion/dist/es/render/utils/setters.mjs";
+import { setTarget } from "../../external/.pnpm/framer-motion@12.18.1/external/framer-motion/dist/es/render/utils/setters.mjs";
 import { resolveVariant } from "../../state/utils.mjs";
 function stopAnimation(visualElement) {
   visualElement.values.forEach((value) => value.stop());

package/dist/es/animation/hooks/use-animate.mjs

@@ -1,5 +1,5 @@
 import { ref, onUnmounted } from "vue";
-import { createScopedAnimate } from "../../external/.pnpm/framer-motion@12.16.0/external/framer-motion/dist/es/animation/animate/index.mjs";
+import { createScopedAnimate } from "../../external/.pnpm/framer-motion@12.18.1/external/framer-motion/dist/es/animation/animate/index.mjs";
 function useAnimate() {
   const dom = ref(null);
   const domProxy = new Proxy(dom, {

package/dist/es/animation/types.d.ts

@@ -1,5 +1,5 @@
 import { MotionState } from '../state';
-import { $Transition, Options } from '../types';
+import { Options } from '../types';
 /**
  * @public
  */
@@ -32,7 +32,7 @@ export interface AnimationControls {
      *
      * @public
      */
-    start: (definition: Options['animate'], transitionOverride?: $Transition) => Promise<any>;
+    start: (definition: Options['animate'], transitionOverride?: Options['transition']) => Promise<any>;
     /**
      * Instantly set to a set of properties or a variant.
      *

package/dist/es/components/animate-presence/AnimatePresence.d.ts

@@ -16,8 +16,8 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_WithDefaults<
     initial: boolean;
     anchorX: string;
 }>>>, {
-    initial: boolean;
     mode: "wait" | "popLayout" | "sync";
+    initial: boolean;
     anchorX: "left" | "right";
 }, {}>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;

package/dist/es/components/animate-presence/AnimatePresence.vue.mjs

@@ -1,6 +1,6 @@
-import { defineComponent, onMounted, onUnmounted, computed, openBlock, createBlock, resolveDynamicComponent, Transition, TransitionGroup, mergeProps, withCtx, renderSlot } from "vue";
+import { defineComponent, onUnmounted, computed, openBlock, createBlock, resolveDynamicComponent, Transition, TransitionGroup, mergeProps, withCtx, renderSlot } from "vue";
 import { mountedStates } from "../../state/motion-state.mjs";
-import { provideAnimatePresence, removeDoneCallback, doneCallbacks } from "../presence.mjs";
+import { useAnimatePresence, removeDoneCallback, doneCallbacks } from "./presence.mjs";
 import { usePopLayout } from "./use-pop-layout.mjs";
 import { delay } from "../../utils/delay.mjs";
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -19,14 +19,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     const props = __props;
-    const presenceContext = {
-      initial: props.initial,
-      custom: props.custom
-    };
-    provideAnimatePresence(presenceContext);
-    onMounted(() => {
-      presenceContext.initial = void 0;
-    });
+    useAnimatePresence(props);
     const { addPopStyle, removePopStyle, styles } = usePopLayout(props);
     function findMotionElement(el) {
       let current = el;

package/dist/es/components/{presence.d.ts → animate-presence/presence.d.ts}

@@ -1,3 +1,4 @@
+import { AnimatePresenceProps } from './types';
 export declare const doneCallbacks: WeakMap<Element, (v?: any, safeUnmount?: boolean) => void>;
 export declare function removeDoneCallback(element: Element): void;
 export interface PresenceContext {
@@ -5,3 +6,4 @@ export interface PresenceContext {
     custom?: any;
 }
 export declare const injectAnimatePresence: <T extends PresenceContext = PresenceContext>(fallback?: T) => T extends null ? PresenceContext : PresenceContext, provideAnimatePresence: (contextValue: PresenceContext) => PresenceContext;
+export declare function useAnimatePresence(props: AnimatePresenceProps): void;

package/dist/es/components/animate-presence/presence.mjs

@@ -0,0 +1,33 @@
+import { watch, onMounted } from "vue";
+import { createContext } from "../../utils/createContext.mjs";
+const doneCallbacks = /* @__PURE__ */ new WeakMap();
+function removeDoneCallback(element) {
+  const prevDoneCallback = doneCallbacks.get(element);
+  if (prevDoneCallback) {
+    element.removeEventListener("motioncomplete", prevDoneCallback);
+  }
+  doneCallbacks.delete(element);
+}
+const [injectAnimatePresence, provideAnimatePresence] = createContext("AnimatePresenceContext");
+function useAnimatePresence(props) {
+  const presenceContext = {
+    initial: props.initial,
+    custom: props.custom
+  };
+  watch(() => props.custom, (v) => {
+    presenceContext.custom = v;
+  }, {
+    flush: "pre"
+  });
+  provideAnimatePresence(presenceContext);
+  onMounted(() => {
+    presenceContext.initial = void 0;
+  });
+}
+export {
+  doneCallbacks,
+  injectAnimatePresence,
+  provideAnimatePresence,
+  removeDoneCallback,
+  useAnimatePresence
+};

package/dist/es/components/animate-presence/use-pop-layout.mjs

@@ -1,5 +1,5 @@
 import { useMotionConfig } from "../motion-config/context.mjs";
-import { frame } from "../../external/.pnpm/motion-dom@12.16.0/external/motion-dom/dist/es/frameloop/frame.mjs";
+import { frame } from "../../external/.pnpm/motion-dom@12.18.1/external/motion-dom/dist/es/frameloop/frame.mjs";
 function usePopLayout(props) {
   const styles = /* @__PURE__ */ new WeakMap();
   const config = useMotionConfig();