motion-v 1.0.0-beta.3 → 1.0.0

package/dist/es/components/reorder/utils.d.ts

@@ -3,4 +3,4 @@ export declare function compareMin<V>(a: ItemData<V>, b: ItemData<V>): number;
 export declare function getValue<V>(item: ItemData<V>): V;
 export declare function checkReorder<T>(order: ItemData<T>[], value: T, offset: number, velocity: number): ItemData<T>[];
 export declare function moveItem<T>([...arr]: T[], fromIndex: number, toIndex: number): T[];
-export declare function useDefaultMotionValue(value: any, defaultValue?: number): import('framer-motion/dom').MotionValue<any>;
+export declare function useDefaultMotionValue(value: any, defaultValue?: number): import('motion-dom').MotionValue<any>;

package/dist/es/components/reorder/utils.mjs

@@ -1,5 +1,6 @@
 import { mixNumber } from "../../utils/mix/number.mjs";
-import { motionValue } from "../../external/.pnpm/motion-dom@12.9.0/external/motion-dom/dist/es/value/index.mjs";
+import { motionValue } from "../../external/.pnpm/motion-dom@12.5.0/external/motion-dom/dist/es/value/index.mjs";
+import "../../external/.pnpm/motion-utils@12.5.0/external/motion-utils/dist/es/errors.mjs";
 import { isMotionValue } from "../../utils/motion-value.mjs";
 function compareMin(a, b) {
   return a.layout.min - b.layout.min;

package/dist/es/external/.pnpm/{framer-motion@12.9.0 → framer-motion@12.5.0}/external/framer-motion/dist/es/animation/animate/index.mjs

@@ -1,6 +1,7 @@
+import { GroupPlaybackControls } from "../../../../../../../motion-dom@12.5.0/external/motion-dom/dist/es/animation/controls/Group.mjs";
+import "../../../../../../../motion-utils@12.5.0/external/motion-utils/dist/es/errors.mjs";
 import { animateSequence } from "./sequence.mjs";
 import { animateSubject } from "./subject.mjs";
-import { GroupAnimationWithThen } from "../../../../../../../motion-dom@12.9.0/external/motion-dom/dist/es/animation/GroupAnimationWithThen.mjs";
 function isSequence(value) {
   return Array.isArray(value) && value.some(Array.isArray);
 }
@@ -12,7 +13,7 @@ function createScopedAnimate(scope) {
     } else {
       animations = animateSubject(subjectOrSequence, optionsOrKeyframes, options, scope);
     }
-    const animation = new GroupAnimationWithThen(animations);
+    const animation = new GroupPlaybackControls(animations);
     if (scope) {
       scope.animations.push(animation);
     }

package/dist/es/external/.pnpm/{framer-motion@12.9.0 → framer-motion@12.5.0}/external/framer-motion/dist/es/animation/animate/resolve-subjects.mjs

@@ -1,5 +1,6 @@
+import "../../../../../../../motion-utils@12.5.0/external/motion-utils/dist/es/errors.mjs";
+import { resolveElements } from "../../../../../../../motion-dom@12.5.0/external/motion-dom/dist/es/utils/resolve-elements.mjs";
 import { isDOMKeyframes } from "../utils/is-dom-keyframes.mjs";
-import { resolveElements } from "../../../../../../../motion-dom@12.9.0/external/motion-dom/dist/es/utils/resolve-elements.mjs";
 function resolveSubjects(subject, keyframes, scope, selectorCache) {
   if (typeof subject === "string" && isDOMKeyframes(keyframes)) {
     return resolveElements(subject, scope, selectorCache);

package/dist/es/external/.pnpm/{framer-motion@12.9.0 → framer-motion@12.5.0}/external/framer-motion/dist/es/animation/animate/sequence.mjs

@@ -1,6 +1,6 @@
+import { spring } from "../generators/spring/index.mjs";
 import { createAnimationsFromSequence } from "../sequence/create.mjs";
 import { animateSubject } from "./subject.mjs";
-import { spring } from "../../../../../../../motion-dom@12.9.0/external/motion-dom/dist/es/animation/generators/spring/index.mjs";
 function animateSequence(sequence, options, scope) {
   const animations = [];
   const animationDefinitions = createAnimationsFromSequence(sequence, options, scope, { spring });

package/dist/es/external/.pnpm/{framer-motion@12.9.0 → framer-motion@12.5.0}/external/framer-motion/dist/es/animation/animate/single-value.mjs

@@ -1,6 +1,7 @@
+import "../../../../../../../motion-utils@12.5.0/external/motion-utils/dist/es/errors.mjs";
+import { motionValue } from "../../../../../../../motion-dom@12.5.0/external/motion-dom/dist/es/value/index.mjs";
 import { isMotionValue } from "../../value/utils/is-motion-value.mjs";
 import { animateMotionValue } from "../interfaces/motion-value.mjs";
-import { motionValue } from "../../../../../../../motion-dom@12.9.0/external/motion-dom/dist/es/value/index.mjs";
 function animateSingleValue(value, keyframes, options) {
   const motionValue$1 = isMotionValue(value) ? value : motionValue(value);
   motionValue$1.start(animateMotionValue("", motionValue$1, keyframes, options));

package/dist/es/external/.pnpm/{framer-motion@12.9.0 → framer-motion@12.5.0}/external/framer-motion/dist/es/animation/animate/subject.mjs

@@ -1,3 +1,4 @@
+import { invariant } from "../../../../../../../motion-utils@12.5.0/external/motion-utils/dist/es/errors.mjs";
 import { visualElementStore } from "../../render/store.mjs";
 import { isMotionValue } from "../../value/utils/is-motion-value.mjs";
 import { animateTarget } from "../interfaces/visual-element-target.mjs";
@@ -5,7 +6,6 @@ import { createDOMVisualElement, createObjectVisualElement } from "../utils/crea
 import { isDOMKeyframes } from "../utils/is-dom-keyframes.mjs";
 import { resolveSubjects } from "./resolve-subjects.mjs";
 import { animateSingleValue } from "./single-value.mjs";
-import { invariant } from "../../../../../../../motion-utils@12.8.3/external/motion-utils/dist/es/errors.mjs";
 function isSingleValue(subject, keyframes) {
   return isMotionValue(subject) || typeof subject === "number" || typeof subject === "string" && !isDOMKeyframes(keyframes);
 }

package/dist/es/external/.pnpm/framer-motion@12.5.0/external/framer-motion/dist/es/animation/animators/AcceleratedAnimation.mjs

@@ -0,0 +1,247 @@
+import "../../../../../../../motion-utils@12.5.0/external/motion-utils/dist/es/errors.mjs";
+import { noop } from "../../../../../../../motion-utils@12.5.0/external/motion-utils/dist/es/noop.mjs";
+import { millisecondsToSeconds, secondsToMilliseconds } from "../../../../../../../motion-utils@12.5.0/external/motion-utils/dist/es/time-conversion.mjs";
+import { isGenerator } from "../../../../../../../motion-dom@12.5.0/external/motion-dom/dist/es/animation/generators/utils/is-generator.mjs";
+import { attachTimeline } from "../../../../../../../motion-dom@12.5.0/external/motion-dom/dist/es/animation/waapi/utils/attach-timeline.mjs";
+import { isWaapiSupportedEasing } from "../../../../../../../motion-dom@12.5.0/external/motion-dom/dist/es/animation/waapi/utils/easing.mjs";
+import { supportsLinearEasing } from "../../../../../../../motion-dom@12.5.0/external/motion-dom/dist/es/utils/supports/linear-easing.mjs";
+import { anticipate } from "../../easing/anticipate.mjs";
+import { backInOut } from "../../easing/back.mjs";
+import { circInOut } from "../../easing/circ.mjs";
+import { DOMKeyframesResolver } from "../../render/dom/DOMKeyframesResolver.mjs";
+import { BaseAnimation } from "./BaseAnimation.mjs";
+import { MainThreadAnimation } from "./MainThreadAnimation.mjs";
+import { acceleratedValues } from "./utils/accelerated-values.mjs";
+import { startWaapiAnimation } from "./waapi/index.mjs";
+import { getFinalKeyframe } from "./waapi/utils/get-final-keyframe.mjs";
+import { supportsWaapi } from "./waapi/utils/supports-waapi.mjs";
+const sampleDelta = 10;
+const maxDuration = 2e4;
+function requiresPregeneratedKeyframes(options) {
+  return isGenerator(options.type) || options.type === "spring" || !isWaapiSupportedEasing(options.ease);
+}
+function pregenerateKeyframes(keyframes, options) {
+  const sampleAnimation = new MainThreadAnimation({
+    ...options,
+    keyframes,
+    repeat: 0,
+    delay: 0,
+    isGenerator: true
+  });
+  let state = { done: false, value: keyframes[0] };
+  const pregeneratedKeyframes = [];
+  let t = 0;
+  while (!state.done && t < maxDuration) {
+    state = sampleAnimation.sample(t);
+    pregeneratedKeyframes.push(state.value);
+    t += sampleDelta;
+  }
+  return {
+    times: void 0,
+    keyframes: pregeneratedKeyframes,
+    duration: t - sampleDelta,
+    ease: "linear"
+  };
+}
+const unsupportedEasingFunctions = {
+  anticipate,
+  backInOut,
+  circInOut
+};
+function isUnsupportedEase(key) {
+  return key in unsupportedEasingFunctions;
+}
+class AcceleratedAnimation extends BaseAnimation {
+  constructor(options) {
+    super(options);
+    const { name, motionValue, element, keyframes } = this.options;
+    this.resolver = new DOMKeyframesResolver(keyframes, (resolvedKeyframes, finalKeyframe) => this.onKeyframesResolved(resolvedKeyframes, finalKeyframe), name, motionValue, element);
+    this.resolver.scheduleResolve();
+  }
+  initPlayback(keyframes, finalKeyframe) {
+    let { duration = 300, times, ease, type, motionValue, name, startTime } = this.options;
+    if (!motionValue.owner || !motionValue.owner.current) {
+      return false;
+    }
+    if (typeof ease === "string" && supportsLinearEasing() && isUnsupportedEase(ease)) {
+      ease = unsupportedEasingFunctions[ease];
+    }
+    if (requiresPregeneratedKeyframes(this.options)) {
+      const { onComplete, onUpdate, motionValue: motionValue2, element, ...options } = this.options;
+      const pregeneratedAnimation = pregenerateKeyframes(keyframes, options);
+      keyframes = pregeneratedAnimation.keyframes;
+      if (keyframes.length === 1) {
+        keyframes[1] = keyframes[0];
+      }
+      duration = pregeneratedAnimation.duration;
+      times = pregeneratedAnimation.times;
+      ease = pregeneratedAnimation.ease;
+      type = "keyframes";
+    }
+    const animation = startWaapiAnimation(motionValue.owner.current, name, keyframes, { ...this.options, duration, times, ease });
+    animation.startTime = startTime !== null && startTime !== void 0 ? startTime : this.calcStartTime();
+    if (this.pendingTimeline) {
+      attachTimeline(animation, this.pendingTimeline);
+      this.pendingTimeline = void 0;
+    } else {
+      animation.onfinish = () => {
+        const { onComplete } = this.options;
+        motionValue.set(getFinalKeyframe(keyframes, this.options, finalKeyframe));
+        onComplete && onComplete();
+        this.cancel();
+        this.resolveFinishedPromise();
+      };
+    }
+    return {
+      animation,
+      duration,
+      times,
+      type,
+      ease,
+      keyframes
+    };
+  }
+  get duration() {
+    const { resolved } = this;
+    if (!resolved)
+      return 0;
+    const { duration } = resolved;
+    return millisecondsToSeconds(duration);
+  }
+  get time() {
+    const { resolved } = this;
+    if (!resolved)
+      return 0;
+    const { animation } = resolved;
+    return millisecondsToSeconds(animation.currentTime || 0);
+  }
+  set time(newTime) {
+    const { resolved } = this;
+    if (!resolved)
+      return;
+    const { animation } = resolved;
+    animation.currentTime = secondsToMilliseconds(newTime);
+  }
+  get speed() {
+    const { resolved } = this;
+    if (!resolved)
+      return 1;
+    const { animation } = resolved;
+    return animation.playbackRate;
+  }
+  set speed(newSpeed) {
+    const { resolved } = this;
+    if (!resolved)
+      return;
+    const { animation } = resolved;
+    animation.playbackRate = newSpeed;
+  }
+  get state() {
+    const { resolved } = this;
+    if (!resolved)
+      return "idle";
+    const { animation } = resolved;
+    return animation.playState;
+  }
+  get startTime() {
+    const { resolved } = this;
+    if (!resolved)
+      return null;
+    const { animation } = resolved;
+    return animation.startTime;
+  }
+  /**
+   * Replace the default DocumentTimeline with another AnimationTimeline.
+   * Currently used for scroll animations.
+   */
+  attachTimeline(timeline) {
+    if (!this._resolved) {
+      this.pendingTimeline = timeline;
+    } else {
+      const { resolved } = this;
+      if (!resolved)
+        return noop;
+      const { animation } = resolved;
+      attachTimeline(animation, timeline);
+    }
+    return noop;
+  }
+  play() {
+    if (this.isStopped)
+      return;
+    const { resolved } = this;
+    if (!resolved)
+      return;
+    const { animation } = resolved;
+    if (animation.playState === "finished") {
+      this.updateFinishedPromise();
+    }
+    animation.play();
+  }
+  pause() {
+    const { resolved } = this;
+    if (!resolved)
+      return;
+    const { animation } = resolved;
+    animation.pause();
+  }
+  stop() {
+    this.resolver.cancel();
+    this.isStopped = true;
+    if (this.state === "idle")
+      return;
+    this.resolveFinishedPromise();
+    this.updateFinishedPromise();
+    const { resolved } = this;
+    if (!resolved)
+      return;
+    const { animation, keyframes, duration, type, ease, times } = resolved;
+    if (animation.playState === "idle" || animation.playState === "finished") {
+      return;
+    }
+    if (this.time) {
+      const { motionValue, onUpdate, onComplete, element, ...options } = this.options;
+      const sampleAnimation = new MainThreadAnimation({
+        ...options,
+        keyframes,
+        duration,
+        type,
+        ease,
+        times,
+        isGenerator: true
+      });
+      const sampleTime = secondsToMilliseconds(this.time);
+      motionValue.setWithVelocity(sampleAnimation.sample(sampleTime - sampleDelta).value, sampleAnimation.sample(sampleTime).value, sampleDelta);
+    }
+    const { onStop } = this.options;
+    onStop && onStop();
+    this.cancel();
+  }
+  complete() {
+    const { resolved } = this;
+    if (!resolved)
+      return;
+    resolved.animation.finish();
+  }
+  cancel() {
+    const { resolved } = this;
+    if (!resolved)
+      return;
+    resolved.animation.cancel();
+  }
+  static supports(options) {
+    const { motionValue, name, repeatDelay, repeatType, damping, type } = options;
+    if (!motionValue || !motionValue.owner || !(motionValue.owner.current instanceof HTMLElement)) {
+      return false;
+    }
+    const { onUpdate, transformTemplate } = motionValue.owner.getProps();
+    return supportsWaapi() && name && acceleratedValues.has(name) && /**
+     * If we're outputting values to onUpdate then we can't use WAAPI as there's
+     * no way to read the value from WAAPI every frame.
+     */
+    !onUpdate && !transformTemplate && !repeatDelay && repeatType !== "mirror" && damping !== 0 && type !== "inertia";
+  }
+}
+export {
+  AcceleratedAnimation
+};

package/dist/es/external/.pnpm/framer-motion@12.5.0/external/framer-motion/dist/es/animation/animators/BaseAnimation.mjs

@@ -0,0 +1,102 @@
+import "../../../../../../../motion-utils@12.5.0/external/motion-utils/dist/es/errors.mjs";
+import { time } from "../../../../../../../motion-dom@12.5.0/external/motion-dom/dist/es/frameloop/sync-time.mjs";
+import { flushKeyframeResolvers } from "../../render/utils/KeyframesResolver.mjs";
+import { canAnimate } from "./utils/can-animate.mjs";
+import { getFinalKeyframe } from "./waapi/utils/get-final-keyframe.mjs";
+const MAX_RESOLVE_DELAY = 40;
+class BaseAnimation {
+  constructor({ autoplay = true, delay = 0, type = "keyframes", repeat = 0, repeatDelay = 0, repeatType = "loop", ...options }) {
+    this.isStopped = false;
+    this.hasAttemptedResolve = false;
+    this.createdAt = time.now();
+    this.options = {
+      autoplay,
+      delay,
+      type,
+      repeat,
+      repeatDelay,
+      repeatType,
+      ...options
+    };
+    this.updateFinishedPromise();
+  }
+  /**
+   * This method uses the createdAt and resolvedAt to calculate the
+   * animation startTime. *Ideally*, we would use the createdAt time as t=0
+   * as the following frame would then be the first frame of the animation in
+   * progress, which would feel snappier.
+   *
+   * However, if there's a delay (main thread work) between the creation of
+   * the animation and the first commited frame, we prefer to use resolvedAt
+   * to avoid a sudden jump into the animation.
+   */
+  calcStartTime() {
+    if (!this.resolvedAt)
+      return this.createdAt;
+    return this.resolvedAt - this.createdAt > MAX_RESOLVE_DELAY ? this.resolvedAt : this.createdAt;
+  }
+  /**
+   * A getter for resolved data. If keyframes are not yet resolved, accessing
+   * this.resolved will synchronously flush all pending keyframe resolvers.
+   * This is a deoptimisation, but at its worst still batches read/writes.
+   */
+  get resolved() {
+    if (!this._resolved && !this.hasAttemptedResolve) {
+      flushKeyframeResolvers();
+    }
+    return this._resolved;
+  }
+  /**
+   * A method to be called when the keyframes resolver completes. This method
+   * will check if its possible to run the animation and, if not, skip it.
+   * Otherwise, it will call initPlayback on the implementing class.
+   */
+  onKeyframesResolved(keyframes, finalKeyframe) {
+    this.resolvedAt = time.now();
+    this.hasAttemptedResolve = true;
+    const { name, type, velocity, delay, onComplete, onUpdate, isGenerator } = this.options;
+    if (!isGenerator && !canAnimate(keyframes, name, type, velocity)) {
+      if (!delay) {
+        onUpdate && onUpdate(getFinalKeyframe(keyframes, this.options, finalKeyframe));
+        onComplete && onComplete();
+        this.resolveFinishedPromise();
+        return;
+      } else {
+        this.options.duration = 0;
+      }
+    }
+    const resolvedAnimation = this.initPlayback(keyframes, finalKeyframe);
+    if (resolvedAnimation === false)
+      return;
+    this._resolved = {
+      keyframes,
+      finalKeyframe,
+      ...resolvedAnimation
+    };
+    this.onPostResolved();
+  }
+  onPostResolved() {
+  }
+  /**
+   * Allows the returned animation to be awaited or promise-chained. Currently
+   * resolves when the animation finishes at all but in a future update could/should
+   * reject if its cancels.
+   */
+  then(resolve, reject) {
+    return this.currentFinishedPromise.then(resolve, reject);
+  }
+  flatten() {
+    if (!this.options.allowFlatten)
+      return;
+    this.options.type = "keyframes";
+    this.options.ease = "linear";
+  }
+  updateFinishedPromise() {
+    this.currentFinishedPromise = new Promise((resolve) => {
+      this.resolveFinishedPromise = resolve;
+    });
+  }
+}
+export {
+  BaseAnimation
+};