motion-v 0.6.2 → 0.7.0

package/dist/es/components/motion/NameSpace.mjs

@@ -0,0 +1,47 @@
+import { defineComponent, h } from "vue";
+import _sfc_main from "./Motion.vue.mjs";
+const componentCache = /* @__PURE__ */ new Map();
+const motion = new Proxy(_sfc_main, {
+  get(target, prop) {
+    if (typeof prop === "symbol")
+      return target[prop];
+    let motionComponent = componentCache.get(prop);
+    if (prop === "create") {
+      return (component) => {
+        return defineComponent({
+          inheritAttrs: false,
+          name: `motion.${component.$name}`,
+          setup(_, { attrs, slots }) {
+            return () => {
+              return h(_sfc_main, {
+                ...attrs,
+                as: component,
+                asChild: false
+              }, slots);
+            };
+          }
+        });
+      };
+    }
+    if (!motionComponent) {
+      motionComponent = defineComponent({
+        inheritAttrs: false,
+        name: `motion.${prop}`,
+        setup(_, { attrs, slots }) {
+          return () => {
+            return h(_sfc_main, {
+              ...attrs,
+              as: prop,
+              asChild: false
+            }, slots);
+          };
+        }
+      });
+      componentCache.set(prop, motionComponent);
+    }
+    return motionComponent;
+  }
+});
+export {
+  motion
+};

package/dist/es/constants/index.mjs

@@ -1,5 +1,6 @@
 const components = {
   motion: [
+    "motion",
     "Motion",
     "AnimatePresence",
     "LayoutGroup",
@@ -19,7 +20,8 @@ const utilities = {
     "useInView",
     "useAnimationFrame",
     "useMotionValueEvent",
-    "useLayoutGroup"
+    "useLayoutGroup",
+    "useDragControls"
   ]
 };
 export {

package/dist/es/features/gestures/drag/use-drag-controls.mjs

@@ -0,0 +1,43 @@
+class DragControls {
+  constructor() {
+    this.componentControls = /* @__PURE__ */ new Set();
+  }
+  /**
+   * Subscribe a component's internal `VisualElementDragControls` to the user-facing API.
+   *
+   * @internal
+   */
+  subscribe(controls) {
+    this.componentControls.add(controls);
+    return () => this.componentControls.delete(controls);
+  }
+  /**
+   * Start a drag gesture on every `motion` component that has this set of drag controls
+   * passed into it via the `dragControls` prop.
+   *
+   * ```jsx
+   * dragControls.start(e, {
+   *   snapToCursor: true
+   * })
+   * ```
+   *
+   * @param event - PointerEvent
+   * @param options - Options
+   *
+   * @public
+   */
+  start(event, options) {
+    this.componentControls.forEach((controls) => {
+      controls.start(
+        event,
+        options
+      );
+    });
+  }
+}
+const createDragControls = () => new DragControls();
+const useDragControls = createDragControls;
+export {
+  DragControls,
+  useDragControls
+};

package/dist/es/features/gestures/in-view/index.mjs

@@ -19,21 +19,41 @@ class InViewGesture extends Feature {
   constructor(state) {
     super(state);
   }
-  mount() {
+  startObserver() {
     const element = this.state.element;
     if (!element)
       return;
+    this.unmount();
+    const { once, ...viewOptions } = this.state.getOptions().inViewOptions || {};
     this.unmount = inView(
       element,
       (entry) => {
         handleHoverEvent(this.state, entry, "Enter");
-        return (endEvent) => {
-          handleHoverEvent(this.state, entry, "Leave");
-        };
-      }
+        if (!once) {
+          return (endEvent) => {
+            handleHoverEvent(this.state, entry, "Leave");
+          };
+        }
+      },
+      viewOptions
+    );
+  }
+  mount() {
+    this.startObserver();
+  }
+  update() {
+    const { props, prevProps } = this.state.visualElement;
+    const hasOptionsChanged = ["amount", "margin", "root"].some(
+      hasViewportOptionChanged(props, prevProps)
     );
+    if (hasOptionsChanged) {
+      this.startObserver();
+    }
   }
 }
+function hasViewportOptionChanged({ inViewOptions = {} }, { inViewOptions: prevViewport = {} } = {}) {
+  return (name) => inViewOptions[name] !== prevViewport[name];
+}
 export {
   InViewGesture
 };

package/dist/es/features/layout/projection.mjs

@@ -3,7 +3,7 @@ import { HTMLProjectionNode } from "../../external/.pnpm/framer-motion@11.16.6/e
 import { getClosestProjectingNode } from "./utils.mjs";
 import { addScaleCorrector } from "../../external/.pnpm/framer-motion@11.16.6/external/framer-motion/dist/es/projection/styles/scale-correction.mjs";
 import { defaultScaleCorrector } from "./config.mjs";
-import { doneCallbacks } from "../../components/presence.mjs";
+import { isHTMLElement } from "../gestures/drag/utils/is.mjs";
 class ProjectionFeature extends Feature {
   constructor(state) {
     super(state);
@@ -16,43 +16,17 @@ class ProjectionFeature extends Feature {
       options["data-framer-portal-id"] ? void 0 : getClosestProjectingNode(this.state.visualElement.parent)
     );
     this.state.visualElement.projection.isPresent = true;
-    this.state.visualElement.projection.setOptions({
-      layout: options.layout,
-      layoutId: options.layoutId,
-      // TODO: drag
-      alwaysMeasureLayout: false,
-      visualElement: this.state.visualElement,
-      animationType: typeof options.layout === "string" ? options.layout : "both",
-      // initialPromotionConfig
-      layoutRoot: options.layoutRoot,
-      layoutScroll: options.layoutScroll,
-      crossfade: options.crossfade,
-      onExitComplete: () => {
-        var _a;
-        if (!((_a = this.state.visualElement.projection) == null ? void 0 : _a.isPresent)) {
-          const done = doneCallbacks.get(this.state.element);
-          this.state.isSafeToRemove = true;
-          if (done) {
-            done({
-              detail: {
-                isExit: true
-              }
-            }, true);
-          }
-        }
-      }
-    });
+    this.setOptions();
   }
   beforeMount() {
     this.initProjection();
   }
-  update() {
+  setOptions() {
     const options = this.state.options;
     this.state.visualElement.projection.setOptions({
       layout: options.layout,
       layoutId: options.layoutId,
-      // TODO: drag
-      alwaysMeasureLayout: false,
+      alwaysMeasureLayout: Boolean(options.drag) || options.dragConstraints && isHTMLElement(options.dragConstraints),
       visualElement: this.state.visualElement,
       animationType: typeof options.layout === "string" ? options.layout : "both",
       // initialPromotionConfig
@@ -61,6 +35,9 @@ class ProjectionFeature extends Feature {
       crossfade: options.crossfade
     });
   }
+  update() {
+    this.setOptions();
+  }
   mount() {
     var _a;
     (_a = this.state.visualElement.projection) == null ? void 0 : _a.mount(this.state.element);

package/dist/es/index.mjs

@@ -1,8 +1,9 @@
-import { default as default2 } from "./components/Motion.vue.mjs";
-import { default as default3 } from "./components/LayoutGroup.vue.mjs";
+import { default as default2 } from "./components/LayoutGroup.vue.mjs";
 import { useLayoutGroup } from "./components/use-layout-group.mjs";
 import { injectLayoutGroup, injectMotion, provideLayoutGroup, provideMotion } from "./components/context.mjs";
 import { components, utilities } from "./constants/index.mjs";
+import { useDragControls } from "./features/gestures/drag/use-drag-controls.mjs";
+import { default as default3 } from "./components/motion/Motion.vue.mjs";
 import { default as default4 } from "./components/animate-presence/AnimatePresence.vue.mjs";
 import { default as default5 } from "./components/motion-config/MotionConfig.vue.mjs";
 import { MotionValue, motionValue, motionValue as motionValue2 } from "./external/.pnpm/framer-motion@11.16.6/external/framer-motion/dist/es/value/index.mjs";
@@ -38,6 +39,7 @@ import { transform } from "./external/.pnpm/framer-motion@11.16.6/external/frame
 import { wrap } from "./external/.pnpm/framer-motion@11.16.6/external/framer-motion/dist/es/utils/wrap.mjs";
 import { cancelSync, sync } from "./external/.pnpm/framer-motion@11.16.6/external/framer-motion/dist/es/frameloop/index-legacy.mjs";
 import { cancelFrame, frame, frameData, frameSteps } from "./external/.pnpm/framer-motion@11.16.6/external/framer-motion/dist/es/frameloop/frame.mjs";
+import { motion } from "./components/motion/NameSpace.mjs";
 import { provideMotionConfig, useMotionConfig } from "./components/motion-config/context.mjs";
 import { useComputed } from "./value/use-computed.mjs";
 import { useCombineMotionValues } from "./value/use-combine-values.mjs";
@@ -57,8 +59,8 @@ import { millisecondsToSeconds, secondsToMilliseconds } from "./utils/time-conve
 import { getContextWindow } from "./utils/get-context-window.mjs";
 export {
   default4 as AnimatePresence,
-  default3 as LayoutGroup,
-  default2 as Motion,
+  default2 as LayoutGroup,
+  default3 as Motion,
   default5 as MotionConfig,
   MotionValue,
   animate,
@@ -99,6 +101,7 @@ export {
   millisecondsToSeconds,
   mirrorEasing,
   mix,
+  motion,
   motionValue,
   noop,
   pipe,
@@ -120,6 +123,7 @@ export {
   useAnimationFrame,
   useCombineMotionValues,
   useComputed,
+  useDragControls,
   useInView,
   useLayoutGroup,
   useMotionConfig,

package/dist/es/state/motion-state.mjs

@@ -1,18 +1,17 @@
 import { invariant } from "hey-listen";
 import { visualElementStore } from "../external/.pnpm/framer-motion@11.16.6/external/framer-motion/dist/es/render/store.mjs";
+import { isDef } from "@vueuse/core";
 import { resolveVariant, getOptions, hasChanged } from "./utils.mjs";
 import { FeatureManager } from "../features/feature-manager.mjs";
 import { style } from "./style.mjs";
 import { transformResetValue } from "./transform.mjs";
 import { motionEvent } from "./event.mjs";
 import { createVisualElement } from "./create-visual-element.mjs";
-import { animateVariantsChildren } from "./animate-variants-children.mjs";
 import { doneCallbacks } from "../components/presence.mjs";
 import { frame } from "../external/.pnpm/framer-motion@11.16.6/external/framer-motion/dist/es/frameloop/frame.mjs";
 import { noop } from "../external/.pnpm/motion-utils@11.16.0/external/motion-utils/dist/es/noop.mjs";
 import "../external/.pnpm/motion-utils@11.16.0/external/motion-utils/dist/es/errors.mjs";
 import { animate } from "../external/.pnpm/framer-motion@11.16.6/external/framer-motion/dist/es/animation/animate/index.mjs";
-import { isDef } from "../external/.pnpm/@vueuse_shared@12.0.0_typescript@5.7.2/external/@vueuse/shared/index.mjs";
 const STATE_TYPES = ["initial", "animate", "inView", "hover", "press", "whileDrag", "exit"];
 const mountedStates = /* @__PURE__ */ new WeakMap();
 let id = 0;
@@ -24,7 +23,7 @@ class MotionState {
     this.isVShow = false;
     this.children = /* @__PURE__ */ new Set();
     this.activeStates = {
-      // initial: true,
+      initial: true,
       animate: true
     };
     this._context = null;
@@ -58,6 +57,7 @@ class MotionState {
     this.initTarget(initialVariantSource);
     this.featureManager = new FeatureManager(this);
   }
+  // Get animation context, falling back to parent context
   get context() {
     if (!this._context) {
       const handler = {
@@ -70,13 +70,16 @@ class MotionState {
     }
     return this._context;
   }
+  // Initialize animation target values
   initTarget(initialVariantSource) {
     this.baseTarget = resolveVariant(this.options[initialVariantSource] || this.context[initialVariantSource], this.options.variants) || {};
     this.target = {};
   }
+  // Get initial animation state
   get initial() {
     return isDef(this.options.initial) ? this.options.initial : this.context.initial;
   }
+  // Update visual element with new options
   updateOptions() {
     this.visualElement.update({
       ...this.options,
@@ -91,6 +94,7 @@ class MotionState {
   beforeMount() {
     this.featureManager.beforeMount();
   }
+  // Mount motion state to DOM element
   mount(element, options, notAnimate = false) {
     invariant(
       Boolean(element),
@@ -115,13 +119,14 @@ class MotionState {
       }
     }
     this.featureManager.mount();
-    if (!notAnimate) {
-      this.animateUpdates(true);
+    if (!notAnimate && this.options.animate) {
+      this.animateUpdates();
     }
   }
   beforeUnmount() {
     this.featureManager.beforeUnmount();
   }
+  // Unmount motion state and optionally unmount children
   unmount(unMountChildren = false) {
     var _a, _b, _c;
     mountedStates.delete(this.element);
@@ -147,6 +152,7 @@ class MotionState {
   beforeUpdate() {
     this.featureManager.beforeUpdate();
   }
+  // Update motion state with new options
   update(options, notAnimate = false) {
     const prevAnimate = JSON.stringify(this.options.animate);
     this.options = options;
@@ -160,31 +166,33 @@ class MotionState {
       this.animateUpdates();
     }
   }
+  // Set animation state active status
   setActive(name, isActive, isAnimate = true) {
     var _a;
     if (!this.element || this.activeStates[name] === isActive)
       return;
     this.activeStates[name] = isActive;
     (_a = this.visualElement.variantChildren) == null ? void 0 : _a.forEach((child) => {
-      child.state.setActive(name, isActive, !isActive);
+      child.state.setActive(name, isActive, false);
     });
     if (isAnimate) {
       this.animateUpdates();
     }
   }
-  animateUpdates(isInitial = false) {
+  // Core animation update logic
+  animateUpdates(controlActiveState = void 0, controlDelay = 0) {
+    var _a;
     const prevTarget = this.target;
-    this.target = {};
-    const activeState = {};
+    this.target = {
+      ...this.baseTarget
+    };
     const animationOptions = {};
     let transition;
+    if (controlActiveState) {
+      this.activeStates = { ...this.activeStates, ...controlActiveState };
+    }
     for (const name of STATE_TYPES) {
-      if (name === "initial") {
-        if (!isInitial) {
-          continue;
-        }
-      }
-      if (!this.activeStates[name] && name !== "initial") {
+      if (!this.activeStates[name]) {
         continue;
       }
       const definition = isDef(this.options[name]) ? this.options[name] : this.context[name];
@@ -194,15 +202,9 @@ class MotionState {
         this.options.custom
       );
       transition = Object.assign({}, this.options.transition, variant == null ? void 0 : variant.transition);
-      if (typeof definition === "string") {
-        activeState[name] = {
-          definition,
-          transition
-        };
-      }
       if (!variant)
         continue;
-      const allTarget = { ...prevTarget, ...variant };
+      const allTarget = { ...variant };
       for (const key in allTarget) {
         if (key === "transition")
           continue;
@@ -214,18 +216,15 @@ class MotionState {
       }
     }
     const allTargetKeys = /* @__PURE__ */ new Set([
-      ...Object.keys(this.target),
-      ...Object.keys(prevTarget)
+      ...Object.keys(this.target)
     ]);
     const animationFactories = [];
     allTargetKeys.forEach((key) => {
-      var _a;
-      if (this.target[key] === void 0) {
-        this.target[key] = this.baseTarget[key];
-      }
+      var _a2;
       if (hasChanged(prevTarget[key], this.target[key])) {
-        (_a = this.baseTarget)[key] ?? (_a[key] = style.get(this.element, key));
+        (_a2 = this.baseTarget)[key] ?? (_a2[key] = style.get(this.element, key));
         const keyValue = this.target[key] === "none" ? transformResetValue[key] : this.target[key];
+        const targetTransition = animationOptions[key];
         animationFactories.push(
           () => {
             return animate(
@@ -233,7 +232,10 @@ class MotionState {
               {
                 [key]: keyValue
               },
-              animationOptions[key] || {}
+              {
+                ...targetTransition,
+                delay: ((targetTransition == null ? void 0 : targetTransition.delay) || 0) + controlDelay
+              }
             );
           }
         );
@@ -241,10 +243,15 @@ class MotionState {
     });
     let getChildAnimations = () => Promise.resolve();
     let childAnimations = [];
-    if (Object.keys(activeState).length) {
-      const { getAnimations, animations: animations2 } = animateVariantsChildren(this, activeState, isInitial);
-      getChildAnimations = getAnimations;
-      childAnimations = animations2;
+    if (((_a = this.visualElement.variantChildren) == null ? void 0 : _a.size) && !controlActiveState) {
+      const { staggerChildren = 0, staggerDirection = 1, delayChildren = 0 } = transition || {};
+      const maxStaggerDuration = (this.visualElement.variantChildren.size - 1) * staggerChildren;
+      const generateStaggerDuration = staggerDirection === 1 ? (i = 0) => i * staggerChildren : (i = 0) => maxStaggerDuration - i * staggerChildren;
+      childAnimations = Array.from(this.visualElement.variantChildren).map((child, index) => {
+        const childDelay = delayChildren + generateStaggerDuration(index);
+        return child.state.animateUpdates(this.activeStates, childDelay);
+      }).filter(Boolean);
+      getChildAnimations = () => Promise.all(childAnimations.map((animation) => animation()));
     }
     let animations;
     const getAnimation = () => {
@@ -253,29 +260,38 @@ class MotionState {
     };
     const { when } = transition;
     let animationPromise;
-    if (when) {
-      const [first, last] = when === "beforeChildren" ? [getAnimation, getChildAnimations] : [getChildAnimations, getAnimation];
-      animationPromise = first().then(() => last());
-    } else {
-      animationPromise = Promise.all([getAnimation(), getChildAnimations()]);
-    }
     const isExit = this.activeStates.exit;
-    if (!(animations == null ? void 0 : animations.length) && !childAnimations.length) {
-      if (isExit) {
-        this.element.dispatchEvent(motionEvent("motionstart", this.target));
-        this.element.dispatchEvent(motionEvent("motioncomplete", {
-          ...this.target
-        }, isExit));
+    const animationTarget = { ...this.target };
+    const element = this.element;
+    function finishAnimation() {
+      if (!(animations == null ? void 0 : animations.length) && !childAnimations.length) {
+        if (isExit) {
+          element.dispatchEvent(motionEvent("motionstart", animationTarget));
+          element.dispatchEvent(motionEvent("motioncomplete", animationTarget, isExit));
+        }
+        return;
       }
-      return;
+      element.dispatchEvent(motionEvent("motionstart", animationTarget));
+      animationPromise.then(() => {
+        element.dispatchEvent(motionEvent("motioncomplete", animationTarget, isExit));
+      }).catch(noop);
+    }
+    function getAnimationPromise() {
+      if (when) {
+        const [first, last] = when === "beforeChildren" ? [getAnimation, getChildAnimations] : [getChildAnimations, getAnimation];
+        animationPromise = first().then(() => last());
+        finishAnimation();
+        return animationPromise;
+      } else {
+        animationPromise = Promise.all([getAnimation(), getChildAnimations()]);
+        finishAnimation();
+        return animationPromise;
+      }
+    }
+    if (controlActiveState) {
+      return getAnimationPromise;
     }
-    const animationTarget = this.target;
-    this.element.dispatchEvent(motionEvent("motionstart", animationTarget));
-    animationPromise.then(() => {
-      this.element.dispatchEvent(motionEvent("motioncomplete", {
-        ...animationTarget
-      }, isExit));
-    }).catch(noop);
+    getAnimationPromise();
   }
   isMounted() {
     return Boolean(this.element);

package/dist/es/state/transform.mjs

@@ -1,3 +1,4 @@
+import "@vueuse/core";
 import { noopReturn } from "./utils.mjs";
 const rotation = {
   syntax: "<angle>",

package/dist/src/components/animate-presence/utils.d.ts

@@ -0,0 +1 @@
+export declare function requestIdleCallback(callback: () => void): void;

package/dist/src/components/index.d.ts

@@ -1,2 +1,3 @@
+export { Motion, motion } from './motion';
 export * from './animate-presence';
 export * from './motion-config';

package/dist/src/components/{Motion.d.ts → motion/Motion.d.ts}

@@ -1,5 +1,5 @@
 import { IntrinsicElementAttributes } from 'vue';
-import { ElementType, Options, SVGAttributesWithMotionValues, SetMotionValueType } from '../types';
+import { ElementType, Options, SVGAttributesWithMotionValues, SetMotionValueType } from '../../types';
 export interface MotionProps<T extends ElementType = 'div', K = unknown> extends Options<K> {
     as?: T;
     asChild?: boolean;

package/dist/src/components/motion/NameSpace.d.ts

@@ -0,0 +1,11 @@
+import { DefineComponent, ExtractPropTypes, ExtractPublicPropTypes, IntrinsicElementAttributes } from 'vue';
+import { MotionProps } from './Motion';
+type ComponentProps<T> = T extends DefineComponent<ExtractPropTypes<infer Props>, any, any> ? ExtractPublicPropTypes<Props> : never;
+type MotionComponentProps = IntrinsicElementAttributes & {
+    create: <T extends DefineComponent>(T: any) => DefineComponent<MotionProps<any, unknown> & ComponentProps<T>>;
+};
+interface MotionNameSpace extends Record<keyof IntrinsicElementAttributes, DefineComponent<MotionProps<keyof IntrinsicElementAttributes, unknown> & MotionComponentProps[keyof IntrinsicElementAttributes]>> {
+    create: MotionComponentProps['create'];
+}
+export declare const motion: MotionNameSpace;
+export {};

package/dist/src/components/motion/index.d.ts

@@ -0,0 +1,2 @@
+export { motion } from './NameSpace';
+export { default as Motion, type MotionProps } from './Motion';

package/dist/src/features/gestures/drag/VisualElementDragControls.d.ts

@@ -1,4 +1,4 @@
-import { MotionProps } from '../../../components/Motion';
+import { MotionProps } from '../../../components/motion/Motion';
 import { Options } from '../../../types';
 import { Point, VisualElement } from 'framer-motion';
 export declare const elementDragControls: WeakMap<VisualElement<unknown, unknown, {}>, VisualElementDragControls>;

package/dist/src/features/gestures/in-view/index.d.ts

@@ -3,5 +3,7 @@ import { Feature } from '../..';
 export declare class InViewGesture extends Feature {
     isActive(): boolean;
     constructor(state: MotionState);
+    startObserver(): void;
     mount(): void;
+    update(): void;
 }

package/dist/src/features/layout/projection.d.ts

@@ -3,6 +3,7 @@ export declare class ProjectionFeature extends Feature {
     constructor(state: any);
     initProjection(): void;
     beforeMount(): void;
+    setOptions(): void;
     update(): void;
     mount(): void;
 }

package/dist/src/index.d.ts

@@ -1,6 +1,5 @@
 export * from 'framer-motion/dom';
 export { motionValue as useMotionValue } from 'framer-motion/dom';
-export { default as Motion, type MotionProps } from './components/Motion';
 export * from './components';
 export { default as LayoutGroup } from './components/LayoutGroup';
 export { useLayoutGroup } from './components/use-layout-group';
@@ -11,4 +10,5 @@ export * from './constants';
 export * from './types';
 export * from './animation';
 export * from './utils';
+export { useDragControls } from './features/gestures/drag/use-drag-controls';
 export type { PanInfo } from './features/gestures/pan/PanSession';

package/dist/src/state/animate-variants-children.d.ts

@@ -1,9 +1,9 @@
 import { MotionState } from './motion-state';
-import { AnimateOptions, AnimationFactory } from '../types';
+import { $Transition, AnimationFactory } from '../types';
 export type ActiveVariant = {
     [key: string]: {
         definition: string;
-        transition: AnimateOptions;
+        transition: $Transition;
     };
 };
 export declare function animateVariantsChildren(state: MotionState, activeState: ActiveVariant, isFirstAnimate?: boolean): {

package/dist/src/state/motion-state.d.ts

@@ -3,6 +3,9 @@ import { DOMKeyframesDefinition, VisualElement } from 'framer-motion';
 declare const STATE_TYPES: readonly ["initial", "animate", "inView", "hover", "press", "whileDrag", "exit"];
 type StateType = typeof STATE_TYPES[number];
 export declare const mountedStates: WeakMap<Element, MotionState>;
+/**
+ * Core class that manages animation state and orchestrates animations
+ */
 export declare class MotionState {
     readonly id: string;
     element: HTMLElement | null;
@@ -30,7 +33,7 @@ export declare class MotionState {
     beforeUpdate(): void;
     update(options: Options, notAnimate?: boolean): void;
     setActive(name: StateType, isActive: boolean, isAnimate?: boolean): void;
-    animateUpdates(isInitial?: boolean): void;
+    animateUpdates(controlActiveState?: typeof this.activeStates, controlDelay?: number): () => Promise<any>;
     isMounted(): boolean;
     getOptions(): Options<any>;
     willUpdate(label: string): void;

package/dist/src/state/utils.d.ts

@@ -1,12 +1,12 @@
-import { Options } from '../types';
-import { AnimationOptions, Variant } from 'framer-motion';
+import { $Transition, Options } from '../types';
+import { Variant } from 'framer-motion';
 import { IntrinsicElementAttributes } from 'vue';
 export declare function resolveVariant(definition?: Options['initial'], variants?: Options['variants'], custom?: Options['custom']): Variant | undefined;
 export declare function hasChanged(a: any, b: any): boolean;
 export declare function shallowCompare(next: any[], prev: any[]): boolean;
 export declare function addUniqueItem<T>(array: T[], item: T): void;
 export declare function removeItem<T>(array: T[], item: T): void;
-export declare function getOptions(options: AnimationOptions, key: string): AnimationOptions;
+export declare function getOptions(options: $Transition, key: string): $Transition;
 export declare function isCssVar(name: string): boolean;
 export declare const noopReturn: <V>(v: V) => V;
 export declare function isNumber(value: any): boolean;