framer-motion 10.2.2 → 10.2.3

package/dist/index.d.ts

@@ -877,142 +877,58 @@ interface CustomValueType {
     toValue: () => number | string;
 }
 
-interface Animation$1<V> {
-    next: (t: number) => {
-        value: V;
-        done: boolean;
-    };
-    flipTarget: () => void;
-}
-/**
- * An update function. It accepts a timestamp used to advance the animation.
- */
-declare type Update = (timestamp: number) => void;
 /**
- * Drivers accept a update function and call it at an interval. This interval
- * could be a synchronous loop, a setInterval, or tied to the device's framerate.
+ * @public
  */
-interface DriverControls {
-    start: () => void;
+interface AnimationPlaybackControls {
+    currentTime?: number | null;
     stop: () => void;
 }
-declare type Driver = (update: Update) => DriverControls;
-
-interface VelocityOptions {
-    velocity?: number;
-    restSpeed?: number;
-    restDelta?: number;
-}
-interface AnimationLifecycleOptions<V> {
-    onUpdate?: (v: V) => void;
-    onComplete?: VoidFunction;
-    onPlay?: VoidFunction;
-    onRepeat?: VoidFunction;
-    onStop?: VoidFunction;
-}
-interface AnimationPlaybackOptions {
-    repeat?: number;
-    repeatType?: "loop" | "reverse" | "mirror";
-    repeatDelay?: number;
-}
-interface DurationSpringOptions {
-    duration?: number;
-    bounce?: number;
-}
-interface SpringOptions extends DurationSpringOptions, VelocityOptions {
-    stiffness?: number;
-    damping?: number;
-    mass?: number;
-}
-interface DecayOptions extends VelocityOptions {
-    keyframes?: number[];
-    power?: number;
-    timeConstant?: number;
-    modifyTarget?: (v: number) => number;
-}
-interface InertiaOptions$1 extends DecayOptions {
-    bounceStiffness?: number;
-    bounceDamping?: number;
-    min?: number;
-    max?: number;
-}
-interface KeyframeOptions {
-    ease?: Easing | Easing[];
-    times?: number[];
-}
-interface AnimationOptions$2<V = any> extends AnimationLifecycleOptions<V>, AnimationPlaybackOptions, Omit<SpringOptions, "keyframes">, Omit<InertiaOptions$1, "keyframes">, KeyframeOptions {
-    keyframes: V[];
-    elapsed?: number;
-    driver?: Driver;
-    type?: "decay" | "spring" | "keyframes" | "tween";
-    duration?: number;
-    autoplay?: boolean;
-}
 /**
  * @public
  */
-declare type ControlsAnimationDefinition = string | string[] | TargetAndTransition | TargetResolver;
-interface PlaybackControls {
-    stop: () => void;
-    currentTime?: number;
+interface AnimationPlaybackLifecycles<V> {
+    onUpdate?: (latest: V) => void;
+    onPlay?: () => void;
+    onComplete?: () => void;
+    onRepeat?: () => void;
+    onStop?: () => void;
 }
 /**
  * @public
  */
-interface AnimationControls {
-    /**
-     * Starts an animation on all linked components.
-     *
-     * @remarks
-     *
-     * ```jsx
-     * controls.start("variantLabel")
-     * controls.start({
-     *   x: 0,
-     *   transition: { duration: 1 }
-     * })
-     * ```
-     *
-     * @param definition - Properties or variant label to animate to
-     * @param transition - Optional `transtion` to apply to a variant
-     * @returns - A `Promise` that resolves when all animations have completed.
-     *
-     * @public
-     */
-    start(definition: ControlsAnimationDefinition, transitionOverride?: Transition): Promise<any>;
-    /**
-     * Instantly set to a set of properties or a variant.
-     *
-     * ```jsx
-     * // With properties
-     * controls.set({ opacity: 0 })
-     *
-     * // With variants
-     * controls.set("hidden")
-     * ```
-     *
-     * @privateRemarks
-     * We could perform a similar trick to `.start` where this can be called before mount
-     * and we maintain a list of of pending actions that get applied on mount. But the
-     * expectation of `set` is that it happens synchronously and this would be difficult
-     * to do before any children have even attached themselves. It's also poor practise
-     * and we should discourage render-synchronous `.start` calls rather than lean into this.
-     *
-     * @public
-     */
-    set(definition: ControlsAnimationDefinition): void;
-    /**
-     * Stops animations on all linked components.
-     *
-     * ```jsx
-     * controls.stop()
-     * ```
-     *
-     * @public
-     */
-    stop(): void;
-    mount(): () => void;
-}
+declare type AnimationOptions$2<V> = (Tween | Spring) & AnimationPlaybackLifecycles<V> & {
+    delay?: number;
+    type?: "tween" | "spring";
+};
+/**
+ * Animate a single value or a `MotionValue`.
+ *
+ * The first argument is either a `MotionValue` to animate, or an initial animation value.
+ *
+ * The second is either a value to animate to, or an array of keyframes to animate through.
+ *
+ * The third argument can be either tween or spring options, and optional lifecycle methods: `onUpdate`, `onPlay`, `onComplete`, `onRepeat` and `onStop`.
+ *
+ * Returns `AnimationPlaybackControls`, currently just a `stop` method.
+ *
+ * ```javascript
+ * const x = useMotionValue(0)
+ *
+ * useEffect(() => {
+ *   const controls = animate(x, 100, {
+ *     type: "spring",
+ *     stiffness: 2000,
+ *     onComplete: v => {}
+ *   })
+ *
+ *   return controls.stop
+ * })
+ * ```
+ *
+ * @public
+ */
+declare function animate<V>(from: MotionValue<V> | V, to: V | V[], transition?: AnimationOptions$2<V>): AnimationPlaybackControls;
 
 /**
  * @public
@@ -1176,6 +1092,139 @@ declare class MotionValue<V = any> {
 }
 declare function motionValue<V>(init: V, options?: MotionValueOptions): MotionValue<V>;
 
+interface Animation$1<V> {
+    next: (t: number) => {
+        value: V;
+        done: boolean;
+    };
+    flipTarget: () => void;
+}
+/**
+ * An update function. It accepts a timestamp used to advance the animation.
+ */
+declare type Update = (timestamp: number) => void;
+/**
+ * Drivers accept a update function and call it at an interval. This interval
+ * could be a synchronous loop, a setInterval, or tied to the device's framerate.
+ */
+interface DriverControls {
+    start: () => void;
+    stop: () => void;
+}
+declare type Driver = (update: Update) => DriverControls;
+
+interface VelocityOptions {
+    velocity?: number;
+    restSpeed?: number;
+    restDelta?: number;
+}
+interface AnimationLifecycleOptions<V> {
+    onUpdate?: (v: V) => void;
+    onComplete?: VoidFunction;
+    onPlay?: VoidFunction;
+    onRepeat?: VoidFunction;
+    onStop?: VoidFunction;
+}
+interface AnimationPlaybackOptions {
+    repeat?: number;
+    repeatType?: "loop" | "reverse" | "mirror";
+    repeatDelay?: number;
+}
+interface DurationSpringOptions {
+    duration?: number;
+    bounce?: number;
+}
+interface SpringOptions extends DurationSpringOptions, VelocityOptions {
+    stiffness?: number;
+    damping?: number;
+    mass?: number;
+}
+interface DecayOptions extends VelocityOptions {
+    keyframes?: number[];
+    power?: number;
+    timeConstant?: number;
+    modifyTarget?: (v: number) => number;
+}
+interface InertiaOptions$1 extends DecayOptions {
+    bounceStiffness?: number;
+    bounceDamping?: number;
+    min?: number;
+    max?: number;
+}
+interface KeyframeOptions {
+    ease?: Easing | Easing[];
+    times?: number[];
+}
+interface AnimationOptions$1<V = any> extends AnimationLifecycleOptions<V>, AnimationPlaybackOptions, Omit<SpringOptions, "keyframes">, Omit<InertiaOptions$1, "keyframes">, KeyframeOptions {
+    keyframes: V[];
+    elapsed?: number;
+    driver?: Driver;
+    type?: "decay" | "spring" | "keyframes" | "tween";
+    duration?: number;
+    autoplay?: boolean;
+}
+/**
+ * @public
+ */
+declare type ControlsAnimationDefinition = string | string[] | TargetAndTransition | TargetResolver;
+/**
+ * @public
+ */
+interface AnimationControls {
+    /**
+     * Starts an animation on all linked components.
+     *
+     * @remarks
+     *
+     * ```jsx
+     * controls.start("variantLabel")
+     * controls.start({
+     *   x: 0,
+     *   transition: { duration: 1 }
+     * })
+     * ```
+     *
+     * @param definition - Properties or variant label to animate to
+     * @param transition - Optional `transtion` to apply to a variant
+     * @returns - A `Promise` that resolves when all animations have completed.
+     *
+     * @public
+     */
+    start(definition: ControlsAnimationDefinition, transitionOverride?: Transition): Promise<any>;
+    /**
+     * Instantly set to a set of properties or a variant.
+     *
+     * ```jsx
+     * // With properties
+     * controls.set({ opacity: 0 })
+     *
+     * // With variants
+     * controls.set("hidden")
+     * ```
+     *
+     * @privateRemarks
+     * We could perform a similar trick to `.start` where this can be called before mount
+     * and we maintain a list of of pending actions that get applied on mount. But the
+     * expectation of `set` is that it happens synchronously and this would be difficult
+     * to do before any children have even attached themselves. It's also poor practise
+     * and we should discourage render-synchronous `.start` calls rather than lean into this.
+     *
+     * @public
+     */
+    set(definition: ControlsAnimationDefinition): void;
+    /**
+     * Stops animations on all linked components.
+     *
+     * ```jsx
+     * controls.stop()
+     * ```
+     *
+     * @public
+     */
+    stop(): void;
+    mount(): () => void;
+}
+
 interface RefObject<T> {
     current: T | null;
 }
@@ -1346,59 +1395,6 @@ declare class NodeStack {
     removeLeadSnapshot(): void;
 }
 
-/**
- * @public
- */
-interface AnimationPlaybackControls {
-    stop: () => void;
-    isAnimating: () => boolean;
-}
-/**
- * @public
- */
-interface AnimationPlaybackLifecycles<V> {
-    onUpdate?: (latest: V) => void;
-    onPlay?: () => void;
-    onComplete?: () => void;
-    onRepeat?: () => void;
-    onStop?: () => void;
-}
-/**
- * @public
- */
-declare type AnimationOptions$1<V> = (Tween | Spring) & AnimationPlaybackLifecycles<V> & {
-    delay?: number;
-    type?: "tween" | "spring";
-};
-/**
- * Animate a single value or a `MotionValue`.
- *
- * The first argument is either a `MotionValue` to animate, or an initial animation value.
- *
- * The second is either a value to animate to, or an array of keyframes to animate through.
- *
- * The third argument can be either tween or spring options, and optional lifecycle methods: `onUpdate`, `onPlay`, `onComplete`, `onRepeat` and `onStop`.
- *
- * Returns `AnimationPlaybackControls`, currently just a `stop` method.
- *
- * ```javascript
- * const x = useMotionValue(0)
- *
- * useEffect(() => {
- *   const controls = animate(x, 100, {
- *     type: "spring",
- *     stiffness: 2000,
- *     onComplete: v => {}
- *   })
- *
- *   return controls.stop
- * })
- * ```
- *
- * @public
- */
-declare function animate<V>(from: MotionValue<V> | V, to: V | V[], transition?: AnimationOptions$1<V>): AnimationPlaybackControls;
-
 interface WithDepth {
     depth: number;
 }
@@ -1572,9 +1568,12 @@ declare function MeasureLayout(props: MotionProps & {
     visualElement: VisualElement;
 }): JSX.Element;
 
+interface FeatureClass<Props = unknown> {
+    new (props: Props): Feature<Props>;
+}
 declare type HydratedFeatureDefinition = {
     isEnabled: (props: MotionProps) => boolean;
-    Feature: typeof Feature<unknown>;
+    Feature: FeatureClass<unknown>;
     ProjectionNode?: any;
     MeasureLayout?: typeof MeasureLayout;
 };
@@ -4418,7 +4417,7 @@ declare function useResetProjection(): () => void;
  */
 declare function buildTransform(transform: HTMLRenderState["transform"], { enableHardwareAcceleration, allowTransformNone, }: DOMVisualElementOptions, transformIsDefault: boolean, transformTemplate?: MotionProps["transformTemplate"]): string;
 
-declare function animateValue<V = number>({ duration, driver, elapsed, repeat: repeatMax, repeatType, repeatDelay, keyframes, autoplay, onPlay, onStop, onComplete, onRepeat, onUpdate, type, ...options }: AnimationOptions$2<V>): {
+declare function animateValue<V = number>({ duration, driver, elapsed, repeat: repeatMax, repeatType, repeatDelay, keyframes, autoplay, onPlay, onStop, onComplete, onRepeat, onUpdate, type, ...options }: AnimationOptions$1<V>): {
     stop: () => void;
     /**
      * Set the current time of the animation. This is purposefully
@@ -4453,7 +4452,7 @@ declare function animateValue<V = number>({ duration, driver, elapsed, repeat: r
     };
 };
 
-declare function inertia({ keyframes, velocity, min, max, power, timeConstant, bounceStiffness, bounceDamping, restDelta, modifyTarget, driver, onUpdate, onComplete, onStop, }: AnimationOptions$2): {
+declare function inertia({ keyframes, velocity, min, max, power, timeConstant, bounceStiffness, bounceDamping, restDelta, modifyTarget, driver, onUpdate, onComplete, onStop, }: AnimationOptions$1): {
     stop: () => void;
 };
 
@@ -4519,7 +4518,7 @@ declare const optimizedAppearDataAttribute: string;
 /**
  * This is based on the spring implementation of Wobble https://github.com/skevy/wobble
  */
-declare function spring({ keyframes, restDelta, restSpeed, ...options }: AnimationOptions$2<number>): Animation$1<number>;
+declare function spring({ keyframes, restDelta, restSpeed, ...options }: AnimationOptions$1<number>): Animation$1<number>;
 declare namespace spring {
     var needsInterpolation: (a: any, b: any) => boolean;
 }
@@ -4587,4 +4586,4 @@ declare function useInvertedScale(scale?: Partial<ScaleMotionValues>): ScaleMoti
 
 declare const AnimateSharedLayout: React$1.FunctionComponent<React$1.PropsWithChildren<unknown>>;
 
-export { AnimatePresence, AnimatePresenceProps, AnimateSharedLayout, AnimationControls, AnimationLifecycleOptions, AnimationLifecycles, AnimationOptions$1 as AnimationOptions, AnimationPlaybackControls, AnimationPlaybackOptions, AnimationProps, AnimationType, Axis, AxisDelta, BezierDefinition, BoundingBox, Box, ControlsAnimationDefinition, CreateVisualElement, CustomDomComponent, CustomValueType, Cycle, CycleState, DecayOptions, DelayedFunction, Delta, DeprecatedLayoutGroupContext, DevMessage, DragControls, DragElastic, DragHandlers, DraggableProps, DurationSpringOptions, Easing, EasingDefinition, EasingFunction, EasingModifier, EventInfo, FeatureBundle, FeatureDefinition, FeatureDefinitions, FeaturePackage, FeaturePackages, FlatTree, FocusHandlers, ForwardRefComponent, HTMLMotionProps, HoverHandlers, HydratedFeatureDefinition, HydratedFeatureDefinitions, IProjectionNode, Inertia, InertiaOptions$1 as InertiaOptions, InterpolateOptions, KeyframeOptions, Keyframes, KeyframesTarget, LayoutGroup, LayoutGroupContext, LayoutProps, LazyFeatureBundle$1 as LazyFeatureBundle, LazyMotion, LazyProps, MixerFactory, MotionAdvancedProps, MotionConfig, MotionConfigContext, MotionConfigProps, MotionContext, MotionProps, MotionStyle, MotionTransform, MotionValue, None, Orchestration, PanHandlers, PanInfo, PassiveEffect, PlaybackControls, Point, PresenceContext, RelayoutInfo, RenderComponent, Reorder, Repeat, ResolveLayoutTransition, ResolvedKeyframesTarget, ResolvedSingleTarget, ResolvedValueTarget, ResolvedValues, SVGAttributesAsMotionValues, SVGMotionProps, ScrapeMotionValuesFromProps, ScrollMotionValues, SingleTarget, Spring, SpringOptions, Subscriber, SwitchLayoutGroupContext, TapHandlers, TapInfo, Target, TargetAndTransition, TransformPoint, Transition, Tween, ValueTarget, ValueType, Variant, VariantLabels, Variants, VelocityOptions, VisualElement, VisualState, addPointerEvent, addPointerInfo, addScaleCorrector, animate, animateValue, animateVisualElement, animationControls, animations, anticipate, backIn, backInOut, backOut, buildTransform, calcLength, checkTargetForNewValues, circIn, circInOut, circOut, clamp, color, complex, createBox, createDomMotionComponent, createMotionComponent, cubicBezier, delay, distance, distance2D, domAnimation, domMax, easeIn, easeInOut, easeOut, filterProps, frameData, inView, inertia, interpolate, invariant, isBrowser, isDragActive, isMotionComponent, isMotionValue, isValidMotionProp, m, makeUseVisualState, mix, motion, motionValue, optimizedAppearDataAttribute, pipe, progress, px, resolveMotionValue, scroll, spring, startOptimizedAppearAnimation, sync, transform, unwrapMotionComponent, useAnimation, useAnimationControls, useAnimationFrame, useCycle, useAnimatedState as useDeprecatedAnimatedState, useInvertedScale as useDeprecatedInvertedScale, useDomEvent, useDragControls, useElementScroll, useForceUpdate, useInView, useInstantLayoutTransition, useInstantTransition, useIsPresent, useIsomorphicLayoutEffect, useMotionTemplate, useMotionValue, useMotionValueEvent, usePresence, useReducedMotion, useReducedMotionConfig, useResetProjection, useScroll, useSpring, useTime, useTransform, useUnmountEffect, useVelocity, useViewportScroll, useWillChange, warning, wrap };
+export { AnimatePresence, AnimatePresenceProps, AnimateSharedLayout, AnimationControls, AnimationLifecycleOptions, AnimationLifecycles, AnimationOptions$2 as AnimationOptions, AnimationPlaybackControls, AnimationPlaybackOptions, AnimationProps, AnimationType, Axis, AxisDelta, BezierDefinition, BoundingBox, Box, ControlsAnimationDefinition, CreateVisualElement, CustomDomComponent, CustomValueType, Cycle, CycleState, DecayOptions, DelayedFunction, Delta, DeprecatedLayoutGroupContext, DevMessage, DragControls, DragElastic, DragHandlers, DraggableProps, DurationSpringOptions, Easing, EasingDefinition, EasingFunction, EasingModifier, EventInfo, FeatureBundle, FeatureDefinition, FeatureDefinitions, FeaturePackage, FeaturePackages, FlatTree, FocusHandlers, ForwardRefComponent, HTMLMotionProps, HoverHandlers, HydratedFeatureDefinition, HydratedFeatureDefinitions, IProjectionNode, Inertia, InertiaOptions$1 as InertiaOptions, InterpolateOptions, KeyframeOptions, Keyframes, KeyframesTarget, LayoutGroup, LayoutGroupContext, LayoutProps, LazyFeatureBundle$1 as LazyFeatureBundle, LazyMotion, LazyProps, MixerFactory, MotionAdvancedProps, MotionConfig, MotionConfigContext, MotionConfigProps, MotionContext, MotionProps, MotionStyle, MotionTransform, MotionValue, None, Orchestration, PanHandlers, PanInfo, PassiveEffect, Point, PresenceContext, RelayoutInfo, RenderComponent, Reorder, Repeat, ResolveLayoutTransition, ResolvedKeyframesTarget, ResolvedSingleTarget, ResolvedValueTarget, ResolvedValues, SVGAttributesAsMotionValues, SVGMotionProps, ScrapeMotionValuesFromProps, ScrollMotionValues, SingleTarget, Spring, SpringOptions, Subscriber, SwitchLayoutGroupContext, TapHandlers, TapInfo, Target, TargetAndTransition, TransformPoint, Transition, Tween, ValueTarget, ValueType, Variant, VariantLabels, Variants, VelocityOptions, VisualElement, VisualState, addPointerEvent, addPointerInfo, addScaleCorrector, animate, animateValue, animateVisualElement, animationControls, animations, anticipate, backIn, backInOut, backOut, buildTransform, calcLength, checkTargetForNewValues, circIn, circInOut, circOut, clamp, color, complex, createBox, createDomMotionComponent, createMotionComponent, cubicBezier, delay, distance, distance2D, domAnimation, domMax, easeIn, easeInOut, easeOut, filterProps, frameData, inView, inertia, interpolate, invariant, isBrowser, isDragActive, isMotionComponent, isMotionValue, isValidMotionProp, m, makeUseVisualState, mix, motion, motionValue, optimizedAppearDataAttribute, pipe, progress, px, resolveMotionValue, scroll, spring, startOptimizedAppearAnimation, sync, transform, unwrapMotionComponent, useAnimation, useAnimationControls, useAnimationFrame, useCycle, useAnimatedState as useDeprecatedAnimatedState, useInvertedScale as useDeprecatedInvertedScale, useDomEvent, useDragControls, useElementScroll, useForceUpdate, useInView, useInstantLayoutTransition, useInstantTransition, useIsPresent, useIsomorphicLayoutEffect, useMotionTemplate, useMotionValue, useMotionValueEvent, usePresence, useReducedMotion, useReducedMotionConfig, useResetProjection, useScroll, useSpring, useTime, useTransform, useUnmountEffect, useVelocity, useViewportScroll, useWillChange, warning, wrap };

package/dist/projection.dev.js

@@ -1992,7 +1992,7 @@
            * This will be replaced by the build step with the latest version number.
            * When MotionValues are provided to motion components, warn if versions are mixed.
            */
-          this.version = "10.2.2";
+          this.version = "10.2.3";
           /**
            * Duration, in milliseconds, since last updating frame.
            *
@@ -2329,7 +2329,6 @@
       value.start(createMotionValueAnimation("", value, to, transition));
       return {
           stop: () => value.stop(),
-          isAnimating: () => value.isAnimating(),
       };
   }
 
@@ -5185,7 +5184,7 @@
                * and warn against mismatches.
                */
               {
-                  warnOnce(nextValue.version === "10.2.2", `Attempting to mix Framer Motion versions ${nextValue.version} with 10.2.2 may not work as expected.`);
+                  warnOnce(nextValue.version === "10.2.3", `Attempting to mix Framer Motion versions ${nextValue.version} with 10.2.3 may not work as expected.`);
               }
           }
           else if (isMotionValue(prevValue)) {

package/dist/three-entry.d.ts

@@ -855,63 +855,9 @@ interface CustomValueType {
 /**
  * @public
  */
-declare type ControlsAnimationDefinition = string | string[] | TargetAndTransition | TargetResolver;
-/**
- * @public
- */
-interface AnimationControls {
-    /**
-     * Starts an animation on all linked components.
-     *
-     * @remarks
-     *
-     * ```jsx
-     * controls.start("variantLabel")
-     * controls.start({
-     *   x: 0,
-     *   transition: { duration: 1 }
-     * })
-     * ```
-     *
-     * @param definition - Properties or variant label to animate to
-     * @param transition - Optional `transtion` to apply to a variant
-     * @returns - A `Promise` that resolves when all animations have completed.
-     *
-     * @public
-     */
-    start(definition: ControlsAnimationDefinition, transitionOverride?: Transition): Promise<any>;
-    /**
-     * Instantly set to a set of properties or a variant.
-     *
-     * ```jsx
-     * // With properties
-     * controls.set({ opacity: 0 })
-     *
-     * // With variants
-     * controls.set("hidden")
-     * ```
-     *
-     * @privateRemarks
-     * We could perform a similar trick to `.start` where this can be called before mount
-     * and we maintain a list of of pending actions that get applied on mount. But the
-     * expectation of `set` is that it happens synchronously and this would be difficult
-     * to do before any children have even attached themselves. It's also poor practise
-     * and we should discourage render-synchronous `.start` calls rather than lean into this.
-     *
-     * @public
-     */
-    set(definition: ControlsAnimationDefinition): void;
-    /**
-     * Stops animations on all linked components.
-     *
-     * ```jsx
-     * controls.stop()
-     * ```
-     *
-     * @public
-     */
-    stop(): void;
-    mount(): () => void;
+interface AnimationPlaybackControls {
+    currentTime?: number | null;
+    stop: () => void;
 }
 
 /**
@@ -1068,6 +1014,68 @@ declare class MotionValue<V = any> {
     destroy(): void;
 }
 
+/**
+ * @public
+ */
+declare type ControlsAnimationDefinition = string | string[] | TargetAndTransition | TargetResolver;
+/**
+ * @public
+ */
+interface AnimationControls {
+    /**
+     * Starts an animation on all linked components.
+     *
+     * @remarks
+     *
+     * ```jsx
+     * controls.start("variantLabel")
+     * controls.start({
+     *   x: 0,
+     *   transition: { duration: 1 }
+     * })
+     * ```
+     *
+     * @param definition - Properties or variant label to animate to
+     * @param transition - Optional `transtion` to apply to a variant
+     * @returns - A `Promise` that resolves when all animations have completed.
+     *
+     * @public
+     */
+    start(definition: ControlsAnimationDefinition, transitionOverride?: Transition): Promise<any>;
+    /**
+     * Instantly set to a set of properties or a variant.
+     *
+     * ```jsx
+     * // With properties
+     * controls.set({ opacity: 0 })
+     *
+     * // With variants
+     * controls.set("hidden")
+     * ```
+     *
+     * @privateRemarks
+     * We could perform a similar trick to `.start` where this can be called before mount
+     * and we maintain a list of of pending actions that get applied on mount. But the
+     * expectation of `set` is that it happens synchronously and this would be difficult
+     * to do before any children have even attached themselves. It's also poor practise
+     * and we should discourage render-synchronous `.start` calls rather than lean into this.
+     *
+     * @public
+     */
+    set(definition: ControlsAnimationDefinition): void;
+    /**
+     * Stops animations on all linked components.
+     *
+     * ```jsx
+     * controls.stop()
+     * ```
+     *
+     * @public
+     */
+    stop(): void;
+    mount(): () => void;
+}
+
 interface RefObject<T> {
     current: T | null;
 }
@@ -1233,14 +1241,6 @@ declare class NodeStack {
     removeLeadSnapshot(): void;
 }
 
-/**
- * @public
- */
-interface AnimationPlaybackControls {
-    stop: () => void;
-    isAnimating: () => boolean;
-}
-
 interface WithDepth {
     depth: number;
 }
@@ -1414,9 +1414,12 @@ declare function MeasureLayout(props: MotionProps & {
     visualElement: VisualElement;
 }): JSX.Element;
 
+interface FeatureClass<Props = unknown> {
+    new (props: Props): Feature<Props>;
+}
 declare type HydratedFeatureDefinition = {
     isEnabled: (props: MotionProps) => boolean;
-    Feature: typeof Feature<unknown>;
+    Feature: FeatureClass<unknown>;
     ProjectionNode?: any;
     MeasureLayout?: typeof MeasureLayout;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "framer-motion",
-    "version": "10.2.2",
+    "version": "10.2.3",
     "description": "A simple and powerful React and JavaScript animation library",
     "main": "dist/cjs/index.js",
     "module": "dist/es/index.mjs",
@@ -103,6 +103,10 @@
             "path": "./dist/size-rollup-animate.js",
             "maxSize": "10 kB"
         },
+        {
+            "path": "./dist/size-rollup-animate.js",
+            "maxSize": "10 kB"
+        },
         {
             "path": "./dist/size-webpack-m.js",
             "maxSize": "4.8 kB"
@@ -116,5 +120,5 @@
             "maxSize": "30.55 kB"
         }
     ],
-    "gitHead": "daeddff03d931dba8ca04611b66b64b4f40b4736"
+    "gitHead": "6e3a7c75b2da8e6d3f083e05fd5a6499ee8210ad"
 }