motion-v 1.1.0-alpha.0 → 1.1.0

package/dist/cjs/index.js

@@ -46,6 +46,9 @@ if (process.env.NODE_ENV !== "production") {
 }
 const MotionGlobalConfig = {};
 const isNumericalString = (v) => /^-?(?:\d+(?:\.\d+)?|\.\d+)$/u.test(v);
+function isObject(value) {
+  return typeof value === "object" && value !== null;
+}
 const isZeroValueString = (v) => /^0[^.\s]+$/u.test(v);
 // @__NO_SIDE_EFFECTS__
 function memo(callback) {
@@ -1140,14 +1143,12 @@ function replaceTransitionType(transition) {
 }
 class WithPromise {
   constructor() {
-    this.count = 0;
     this.updateFinished();
   }
   get finished() {
     return this._finished;
   }
   updateFinished() {
-    this.count++;
     this._finished = new Promise((resolve) => {
       this.resolve = resolve;
     });
@@ -1175,6 +1176,7 @@ class JSAnimation extends WithPromise {
     this.holdTime = null;
     this.playbackSpeed = 1;
     this.stop = (sync2 = true) => {
+      var _a, _b;
       if (sync2) {
         const { motionValue: motionValue2 } = this.options;
         if (motionValue2 && motionValue2.updatedAt !== time.now()) {
@@ -1185,8 +1187,7 @@ class JSAnimation extends WithPromise {
       if (this.state === "idle")
         return;
       this.teardown();
-      const { onStop } = this.options;
-      onStop && onStop();
+      (_b = (_a = this.options).onStop) == null ? void 0 : _b.call(_a);
     };
     activeAnimations.mainThread++;
     this.options = options;
@@ -1335,13 +1336,14 @@ class JSAnimation extends WithPromise {
     }
   }
   play() {
+    var _a, _b;
     if (this.isStopped)
       return;
-    const { driver = frameloopDriver, onPlay, startTime } = this.options;
+    const { driver = frameloopDriver, startTime } = this.options;
     if (!this.driver) {
       this.driver = driver((timestamp) => this.tick(timestamp));
     }
-    onPlay && onPlay();
+    (_b = (_a = this.options).onPlay) == null ? void 0 : _b.call(_a);
     const now2 = this.driver.now();
     if (this.state === "finished") {
       this.updateFinished();
@@ -1371,19 +1373,21 @@ class JSAnimation extends WithPromise {
     this.holdTime = null;
   }
   finish() {
+    var _a, _b;
+    this.notifyFinished();
     this.teardown();
     this.state = "finished";
-    const { onComplete } = this.options;
-    onComplete && onComplete();
+    (_b = (_a = this.options).onComplete) == null ? void 0 : _b.call(_a);
   }
   cancel() {
+    var _a, _b;
     this.holdTime = null;
     this.startTime = 0;
     this.tick(0);
     this.teardown();
+    (_b = (_a = this.options).onCancel) == null ? void 0 : _b.call(_a);
   }
   teardown() {
-    this.notifyFinished();
     this.state = "idle";
     this.stopDriver();
     this.startTime = this.holdTime = null;
@@ -1785,7 +1789,6 @@ class NativeAnimation extends WithPromise {
       onComplete == null ? void 0 : onComplete();
       this.notifyFinished();
     };
-    this.animation.oncancel = () => this.notifyFinished();
   }
   play() {
     if (this.isStopped)
@@ -1977,19 +1980,22 @@ function canAnimate(keyframes2, name, type, velocity) {
   }
   return hasKeyframesChanged(keyframes2) || (type === "spring" || isGenerator(type)) && velocity;
 }
+function isHTMLElement$1(element) {
+  return isObject(element) && "offsetHeight" in element;
+}
 const acceleratedValues$1 = /* @__PURE__ */ new Set([
   "opacity",
   "clipPath",
   "filter",
   "transform"
-  // TODO: Can be accelerated but currently disabled until https://issues.chromium.org/issues/41491098 is resolved
-  // or until we implement support for linear() easing.
+  // TODO: Could be re-enabled now we have support for linear() easing
   // "background-color"
 ]);
 const supportsWaapi = /* @__PURE__ */ memo(() => Object.hasOwnProperty.call(Element.prototype, "animate"));
 function supportsBrowserAnimation(options) {
+  var _a;
   const { motionValue: motionValue2, name, repeatDelay, repeatType, damping, type } = options;
-  if (!motionValue2 || !motionValue2.owner || !(motionValue2.owner.current instanceof HTMLElement)) {
+  if (!isHTMLElement$1((_a = motionValue2 == null ? void 0 : motionValue2.owner) == null ? void 0 : _a.current)) {
     return false;
   }
   const { onUpdate, transformTemplate } = motionValue2.owner.getProps();
@@ -2587,7 +2593,6 @@ class MotionValue {
    * -  `transformer`: A function to transform incoming values with.
    */
   constructor(init, options = {}) {
-    this.version = "__VERSION__";
     this.canTrackVelocity = null;
     this.events = {};
     this.updateAndNotify = (v, render = true) => {
@@ -3097,7 +3102,7 @@ function press(targetOrSelector, onPressStart, options = {}) {
   const [targets, eventOptions, cancelEvents] = setupGesture(targetOrSelector, options);
   const startPress = (startEvent) => {
     const target = startEvent.currentTarget;
-    if (!isValidPressEvent(startEvent) || isPressing.has(target))
+    if (!isValidPressEvent(startEvent))
       return;
     isPressing.add(target);
     const onPressEnd = onPressStart(target, startEvent);
@@ -3126,7 +3131,7 @@ function press(targetOrSelector, onPressStart, options = {}) {
   targets.forEach((target) => {
     const pointerDownTarget = options.useGlobalTarget ? window : target;
     pointerDownTarget.addEventListener("pointerdown", startPress, eventOptions);
-    if (target instanceof HTMLElement) {
+    if (isHTMLElement$1(target)) {
       target.addEventListener("focus", (event) => enableKeyboardPress(event, eventOptions));
       if (!isElementKeyboardAccessible(target) && !target.hasAttribute("tabindex")) {
         target.tabIndex = 0;
@@ -3261,6 +3266,12 @@ function recordStats() {
   frame.postRender(record, true);
   return reportStats;
 }
+function isSVGElement$1(element) {
+  return isObject(element) && "ownerSVGElement" in element;
+}
+function isSVGSVGElement(element) {
+  return isSVGElement$1(element) && element.tagName === "svg";
+}
 function transform(...args) {
   const useImmediate = !Array.isArray(args[0]);
   const argOffset = useImmediate ? 0 : -1;
@@ -3293,6 +3304,56 @@ function mapValue(inputValue, inputRange, outputRange, options) {
   const map = transform(inputRange, outputRange, options);
   return transformValue(() => map(inputValue.get()));
 }
+const isMotionValue = (value) => Boolean(value && value.getVelocity);
+function springValue(source, options) {
+  const initialValue = isMotionValue(source) ? source.get() : source;
+  const value = motionValue(initialValue);
+  attachSpring(value, source, options);
+  return value;
+}
+function attachSpring(value, source, options) {
+  const initialValue = value.get();
+  let activeAnimation = null;
+  let latestValue = initialValue;
+  let latestSetter;
+  const unit = typeof initialValue === "string" ? initialValue.replace(/[\d.-]/g, "") : void 0;
+  const stopAnimation2 = () => {
+    if (activeAnimation) {
+      activeAnimation.stop();
+      activeAnimation = null;
+    }
+  };
+  const startAnimation = () => {
+    stopAnimation2();
+    activeAnimation = new JSAnimation({
+      keyframes: [asNumber$1(value.get()), asNumber$1(latestValue)],
+      velocity: value.getVelocity(),
+      type: "spring",
+      restDelta: 1e-3,
+      restSpeed: 0.01,
+      ...options,
+      onUpdate: latestSetter
+    });
+  };
+  value.attach((v, set) => {
+    latestValue = v;
+    latestSetter = (latest) => set(parseValue(latest, unit));
+    frame.postRender(startAnimation);
+    return value.get();
+  }, stopAnimation2);
+  let unsubscribe = void 0;
+  if (isMotionValue(source)) {
+    unsubscribe = source.on("change", (v) => value.set(parseValue(v, unit)));
+    value.on("destroy", unsubscribe);
+  }
+  return unsubscribe;
+}
+function parseValue(v, unit) {
+  return unit ? v + unit : v;
+}
+function asNumber$1(v) {
+  return typeof v === "number" ? v : parseFloat(v);
+}
 const valueTypes = [...dimensionValueTypes, color, complex];
 const findValueType = (v) => valueTypes.find(testValueType(v));
 function chooseLayerType(valueName) {
@@ -3558,7 +3619,6 @@ const cancelSync = stepsOrder.reduce((acc, key) => {
   acc[key] = (process2) => cancelFrame(process2);
   return acc;
 }, {});
-const isMotionValue$1 = (value) => Boolean(value && value.getVelocity);
 function isDOMKeyframes(keyframes2) {
   return typeof keyframes2 === "object" && !Array.isArray(keyframes2);
 }
@@ -3697,7 +3757,7 @@ function createAnimationsFromSequence(sequence, { defaultTransition = {}, ...seq
       maxDuration = Math.max(calculatedDelay + duration, maxDuration);
       totalDuration = Math.max(targetTime, totalDuration);
     };
-    if (isMotionValue$1(subject)) {
+    if (isMotionValue(subject)) {
       const subjectSequence = getSubjectSequence(subject, sequences);
       resolveValueSequence(keyframes2, transition, getValueSequence("default", subjectSequence));
     } else {
@@ -3827,7 +3887,7 @@ function setTarget(visualElement, definition) {
   }
 }
 function isWillChangeMotionValue$1(value) {
-  return Boolean(isMotionValue$1(value) && value.add);
+  return Boolean(isMotionValue(value) && value.add);
 }
 function addValueToWillChange$1(visualElement, key) {
   const willChange = visualElement.getValue("willChange");
@@ -3991,9 +4051,6 @@ function animateTarget(visualElement, targetAndTransition, { delay: delay2 = 0,
   }
   return animations;
 }
-function isSVGElement$1(element) {
-  return element instanceof SVGElement && element.tagName !== "svg";
-}
 function convertBoundingBoxToBox$1({ top, left, right, bottom }) {
   return {
     x: { min: left, max: right },
@@ -4182,9 +4239,9 @@ function updateMotionValuesFromProps(element, next2, prev) {
   for (const key in next2) {
     const nextValue = next2[key];
     const prevValue = prev[key];
-    if (isMotionValue$1(nextValue)) {
+    if (isMotionValue(nextValue)) {
       element.addValue(key, nextValue);
-    } else if (isMotionValue$1(prevValue)) {
+    } else if (isMotionValue(prevValue)) {
       element.addValue(key, motionValue(nextValue, { owner: element }));
     } else if (prevValue !== nextValue) {
       if (element.hasValue(key)) {
@@ -4275,7 +4332,7 @@ class VisualElement {
     const { willChange, ...initialMotionValues } = this.scrapeMotionValuesFromProps(props, {}, this);
     for (const key in initialMotionValues) {
       const value = initialMotionValues[key];
-      if (latestValues[key] !== void 0 && isMotionValue$1(value)) {
+      if (latestValues[key] !== void 0 && isMotionValue(value)) {
         value.set(latestValues[key], false);
       }
     }
@@ -4510,9 +4567,9 @@ class VisualElement {
       } else if (!findValueType(value) && complex.test(target)) {
         value = getAnimatableNone(key, target);
       }
-      this.setBaseTarget(key, isMotionValue$1(value) ? value.get() : value);
+      this.setBaseTarget(key, isMotionValue(value) ? value.get() : value);
     }
-    return isMotionValue$1(value) ? value.get() : value;
+    return isMotionValue(value) ? value.get() : value;
   }
   /**
    * Set the base target to later animate back to. This is currently
@@ -4539,7 +4596,7 @@ class VisualElement {
       return valueFromInitial;
     }
     const target = this.getBaseTargetFromProps(this.props, key);
-    if (target !== void 0 && !isMotionValue$1(target))
+    if (target !== void 0 && !isMotionValue(target))
       return target;
     return this.initialValues[key] !== void 0 && valueFromInitial === void 0 ? void 0 : this.baseTarget[key];
   }
@@ -4576,7 +4633,7 @@ class DOMVisualElement extends VisualElement {
       delete this.childSubscription;
     }
     const { children } = this.props;
-    if (isMotionValue$1(children)) {
+    if (isMotionValue(children)) {
       this.childSubscription = children.on("change", (latest) => {
         if (this.current) {
           this.current.textContent = `${latest}`;
@@ -4683,7 +4740,7 @@ function scrapeMotionValuesFromProps$1(props, prevProps, visualElement) {
   const { style: style2 } = props;
   const newValues = {};
   for (const key in style2) {
-    if (isMotionValue$1(style2[key]) || prevProps.style && isMotionValue$1(prevProps.style[key]) || isForcedMotionValue(key, props) || ((_a = visualElement == null ? void 0 : visualElement.getValue(key)) == null ? void 0 : _a.liveStyle) !== void 0) {
+    if (isMotionValue(style2[key]) || prevProps.style && isMotionValue(prevProps.style[key]) || isForcedMotionValue(key, props) || ((_a = visualElement == null ? void 0 : visualElement.getValue(key)) == null ? void 0 : _a.liveStyle) !== void 0) {
       newValues[key] = style2[key];
     }
   }
@@ -4699,8 +4756,9 @@ class HTMLVisualElement extends DOMVisualElement {
     this.renderInstance = renderHTML;
   }
   readValueFromInstance(instance, key) {
+    var _a;
     if (transformProps.has(key)) {
-      return readTransformValue(instance, key);
+      return ((_a = this.projection) == null ? void 0 : _a.isProjecting) ? defaultTransformValue(key) : readTransformValue(instance, key);
     } else {
       const computedStyle = getComputedStyle$1(instance);
       const value = (isCSSVariableName(key) ? computedStyle.getPropertyValue(key) : computedStyle[key]) || 0;
@@ -4846,7 +4904,7 @@ function renderSVG(element, renderState, _styleProp, projection) {
 function scrapeMotionValuesFromProps(props, prevProps, visualElement) {
   const newValues = scrapeMotionValuesFromProps$1(props, prevProps, visualElement);
   for (const key in props) {
-    if (isMotionValue$1(props[key]) || isMotionValue$1(prevProps[key])) {
+    if (isMotionValue(props[key]) || isMotionValue(prevProps[key])) {
       const targetKey = transformPropOrder.indexOf(key) !== -1 ? "attr" + key.charAt(0).toUpperCase() + key.substring(1) : key;
       newValues[targetKey] = props[key];
     }
@@ -4900,7 +4958,7 @@ function createDOMVisualElement(element) {
       latestValues: {}
     }
   };
-  const node = isSVGElement$1(element) ? new SVGVisualElement(options) : new HTMLVisualElement(options);
+  const node = isSVGElement$1(element) && !isSVGSVGElement(element) ? new SVGVisualElement(options) : new HTMLVisualElement(options);
   node.mount(element);
   visualElementStore.set(element, node);
 }
@@ -4920,12 +4978,12 @@ function createObjectVisualElement(subject) {
   visualElementStore.set(subject, node);
 }
 function animateSingleValue(value, keyframes2, options) {
-  const motionValue$1 = isMotionValue$1(value) ? value : motionValue(value);
+  const motionValue$1 = isMotionValue(value) ? value : motionValue(value);
   motionValue$1.start(animateMotionValue("", motionValue$1, keyframes2, options));
   return motionValue$1.animation;
 }
 function isSingleValue(subject, keyframes2) {
-  return isMotionValue$1(subject) || typeof subject === "number" || typeof subject === "string" && !isDOMKeyframes(keyframes2);
+  return isMotionValue(subject) || typeof subject === "number" || typeof subject === "string" && !isDOMKeyframes(keyframes2);
 }
 function animateSubject(subject, keyframes2, options, scope) {
   const animations = [];
@@ -5053,7 +5111,7 @@ function getElementSize(target, borderBoxSize) {
   if (borderBoxSize) {
     const { inlineSize, blockSize } = borderBoxSize[0];
     return { width: inlineSize, height: blockSize };
-  } else if (target instanceof SVGElement && "getBBox" in target) {
+  } else if (isSVGElement$1(target) && "getBBox" in target) {
     return target.getBBox();
   } else {
     return {
@@ -5185,7 +5243,7 @@ function calcInset(element, container) {
   const inset = { x: 0, y: 0 };
   let current2 = element;
   while (current2 && current2 !== container) {
-    if (current2 instanceof HTMLElement) {
+    if (isHTMLElement$1(current2)) {
       inset.x += current2.offsetLeft;
       inset.y += current2.offsetTop;
       current2 = current2.offsetParent;
@@ -5346,8 +5404,10 @@ function createOnScrollHandler(element, onScroll, info, options = {}) {
 const scrollListeners = /* @__PURE__ */ new WeakMap();
 const resizeListeners = /* @__PURE__ */ new WeakMap();
 const onScrollHandlers = /* @__PURE__ */ new WeakMap();
-const getEventTarget = (element) => element === document.documentElement ? window : element;
-function scrollInfo(onScroll, { container = document.documentElement, ...options } = {}) {
+const getEventTarget = (element) => element === document.scrollingElement ? window : element;
+function scrollInfo(onScroll, { container = document.scrollingElement, ...options } = {}) {
+  if (!container)
+    return noop;
   let containerHandlers = onScrollHandlers.get(container);
   if (!containerHandlers) {
     containerHandlers = /* @__PURE__ */ new Set();
@@ -5450,10 +5510,9 @@ function attachToFunction(onScroll, options) {
     return observeTimeline(onScroll, getTimeline(options));
   }
 }
-function scroll(onScroll, { axis = "y", container = document.documentElement, ...options } = {}) {
-  if (container === document.documentElement && (axis === "y" && container.scrollHeight === container.clientHeight || axis === "x" && container.scrollWidth === container.clientWidth)) {
-    container = document.body;
-  }
+function scroll(onScroll, { axis = "y", container = document.scrollingElement, ...options } = {}) {
+  if (!container)
+    return noop;
   const optionsWithDefaults = { axis, container, ...options };
   return typeof onScroll === "function" ? attachToFunction(onScroll, optionsWithDefaults) : attachToAnimation(onScroll, optionsWithDefaults);
 }
@@ -5542,15 +5601,14 @@ function createContext(providerComponentName, contextName) {
   const injectionKey = Symbol(symbolDescription);
   const injectContext = (fallback) => {
     const context = vue.inject(injectionKey, fallback);
-    if (context)
-      return context;
-    if (context === null)
-      return context;
-    throw new Error(
-      `Injection \`${injectionKey.toString()}\` not found. Component must be used within ${Array.isArray(providerComponentName) ? `one of the following components: ${providerComponentName.join(
-        ", "
-      )}` : `\`${providerComponentName}\``}`
-    );
+    if (context === void 0) {
+      throw new Error(
+        `Injection \`${injectionKey.toString()}\` not found. Component must be used within ${Array.isArray(providerComponentName) ? `one of the following components: ${providerComponentName.join(
+          ", "
+        )}` : `\`${providerComponentName}\``}`
+      );
+    }
+    return context;
   };
   const provideContext = (contextValue) => {
     vue.provide(injectionKey, contextValue);
@@ -5558,9 +5616,6 @@ function createContext(providerComponentName, contextName) {
   };
   return [injectContext, provideContext];
 }
-function isMotionValue(value) {
-  return Boolean(value && value.getVelocity);
-}
 function useInView(domRef, options) {
   const isInView = vue.ref(false);
   vue.watch([domRef, () => vue.isRef(options) ? options.value : options], (_v1, _v2, onCleanup) => {
@@ -6858,8 +6913,9 @@ class LayoutFeature extends Feature {
   }
   didUpdate() {
     var _a, _b;
-    if (this.state.options.layout || this.state.options.layoutId || this.state.options.drag)
+    if (this.state.options.layout || this.state.options.layoutId || this.state.options.drag) {
       (_b = (_a = this.state.visualElement.projection) == null ? void 0 : _a.root) == null ? void 0 : _b.didUpdate();
+    }
   }
   mount() {
     var _a;
@@ -6891,7 +6947,7 @@ class LayoutFeature extends Feature {
     const layoutGroup = this.state.options.layoutGroup;
     const projection = this.state.visualElement.projection;
     if (projection) {
-      if (layoutGroup == null ? void 0 : layoutGroup.group) {
+      if ((layoutGroup == null ? void 0 : layoutGroup.group) && (this.state.options.layout || this.state.options.layoutId)) {
         layoutGroup.group.remove(projection);
       }
       this.didUpdate();
@@ -7441,7 +7497,7 @@ class FlatTree {
   }
 }
 function resolveMotionValue(value) {
-  return isMotionValue$1(value) ? value.get() : value;
+  return isMotionValue(value) ? value.get() : value;
 }
 const borders = ["TopLeft", "TopRight", "BottomLeft", "BottomRight"];
 const numBorders = borders.length;
@@ -7845,7 +7901,7 @@ function createProjectionNode({ attachResizeListener, defaultParent, measureScro
     mount(instance) {
       if (this.instance)
         return;
-      this.isSVG = isSVGElement$1(instance);
+      this.isSVG = isSVGElement$1(instance) && !isSVGSVGElement(instance);
       this.instance = instance;
       const { layoutId, layout, visualElement } = this.options;
       if (visualElement && !visualElement.current) {
@@ -9020,11 +9076,11 @@ class MotionState {
   unmount(unMountChildren = false) {
     const shouldDelay = this.options.layoutId && !mountedLayoutIds.has(this.options.layoutId);
     const unmount = () => {
-      if (unMountChildren) {
-        Array.from(this.children).reverse().forEach(this.unmountChild);
-      }
       const unmountState = () => {
         var _a, _b, _c;
+        if (unMountChildren) {
+          Array.from(this.children).reverse().forEach(this.unmountChild);
+        }
         (_b = (_a = this.parent) == null ? void 0 : _a.children) == null ? void 0 : _b.delete(this);
         mountedStates.delete(this.element);
         this.featureManager.unmount();
@@ -10182,13 +10238,15 @@ function notify(node) {
 function nodeGroup() {
   const nodes = /* @__PURE__ */ new Set();
   const subscriptions = /* @__PURE__ */ new WeakMap();
-  const dirtyAll = () => nodes.forEach(notify);
+  const dirtyAll = (node) => {
+    nodes.forEach(notify);
+  };
   return {
     add: (node) => {
       nodes.add(node);
       subscriptions.set(
         node,
-        node.addEventListener("willUpdate", dirtyAll)
+        node.addEventListener("willUpdate", () => dirtyAll())
       );
     },
     remove: (node) => {
@@ -10448,6 +10506,7 @@ exports.animateView = animateView;
 exports.animationMapKey = animationMapKey;
 exports.anticipate = anticipate;
 exports.applyPxDefaults = applyPxDefaults;
+exports.attachSpring = attachSpring;
 exports.backIn = backIn;
 exports.backInOut = backInOut;
 exports.backOut = backOut;
@@ -10471,6 +10530,7 @@ exports.cubicBezier = cubicBezier;
 exports.cubicBezierAsString = cubicBezierAsString;
 exports.defaultEasing = defaultEasing;
 exports.defaultOffset = defaultOffset$1;
+exports.defaultTransformValue = defaultTransformValue;
 exports.defaultValueTypes = defaultValueTypes;
 exports.degrees = degrees;
 exports.delay = delayInSeconds;
@@ -10520,10 +10580,14 @@ exports.isDragActive = isDragActive;
 exports.isDragging = isDragging;
 exports.isEasingArray = isEasingArray;
 exports.isGenerator = isGenerator;
+exports.isHTMLElement = isHTMLElement$1;
 exports.isMotionValue = isMotionValue;
 exports.isNodeOrChild = isNodeOrChild;
 exports.isNumericalString = isNumericalString;
+exports.isObject = isObject;
 exports.isPrimaryPointer = isPrimaryPointer$1;
+exports.isSVGElement = isSVGElement$1;
+exports.isSVGSVGElement = isSVGSVGElement;
 exports.isWaapiSupportedEasing = isWaapiSupportedEasing;
 exports.isZeroValueString = isZeroValueString;
 exports.keyframes = keyframes;
@@ -10578,6 +10642,7 @@ exports.secondsToMilliseconds = secondsToMilliseconds;
 exports.setDragLock = setDragLock;
 exports.setStyle = setStyle;
 exports.spring = spring;
+exports.springValue = springValue;
 exports.stagger = stagger;
 exports.startWaapiAnimation = startWaapiAnimation;
 exports.statsBuffer = statsBuffer;

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.10.4/external/framer-motion/dist/es/render/utils/setters.mjs";
+import { setTarget } from "../../external/.pnpm/framer-motion@12.12.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.10.4/external/framer-motion/dist/es/animation/animate/index.mjs";
+import { createScopedAnimate } from "../../external/.pnpm/framer-motion@12.12.1/external/framer-motion/dist/es/animation/animate/index.mjs";
 function useAnimate() {
   const dom = ref(null);
   const domProxy = new Proxy(dom, {

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.10.4/external/motion-dom/dist/es/frameloop/frame.mjs";
+import { frame } from "../../external/.pnpm/motion-dom@12.12.1/external/motion-dom/dist/es/frameloop/frame.mjs";
 function usePopLayout(props) {
   const styles = /* @__PURE__ */ new WeakMap();
   const config = useMotionConfig();

package/dist/es/components/group.mjs

@@ -4,13 +4,15 @@ function notify(node) {
 function nodeGroup() {
   const nodes = /* @__PURE__ */ new Set();
   const subscriptions = /* @__PURE__ */ new WeakMap();
-  const dirtyAll = () => nodes.forEach(notify);
+  const dirtyAll = (node) => {
+    nodes.forEach(notify);
+  };
   return {
     add: (node) => {
       nodes.add(node);
       subscriptions.set(
         node,
-        node.addEventListener("willUpdate", dirtyAll)
+        node.addEventListener("willUpdate", () => dirtyAll())
       );
     },
     remove: (node) => {

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

@@ -8,7 +8,7 @@ import { convertSvgStyleToAttributes, createStyles } from "../../state/style.mjs
 import { warning, invariant } from "hey-listen";
 import { ref, useAttrs, getCurrentInstance, onBeforeMount, onMounted, onBeforeUnmount, onUnmounted, onBeforeUpdate, onUpdated } from "vue";
 import { useMotionConfig } from "../motion-config/context.mjs";
-import { isMotionValue } from "../../utils/motion-value.mjs";
+import { isMotionValue } from "../../external/.pnpm/motion-dom@12.12.1/external/motion-dom/dist/es/value/utils/is-motion-value.mjs";
 function useMotionState(props) {
   var _a;
   const parentState = injectMotion(null);

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

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

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

@@ -1,6 +1,6 @@
 import { animateSequence } from "./sequence.mjs";
 import { animateSubject } from "./subject.mjs";
-import { GroupAnimationWithThen } from "../../../../../../../motion-dom@12.10.4/external/motion-dom/dist/es/animation/GroupAnimationWithThen.mjs";
+import { GroupAnimationWithThen } from "../../../../../../../motion-dom@12.12.1/external/motion-dom/dist/es/animation/GroupAnimationWithThen.mjs";
 function isSequence(value) {
   return Array.isArray(value) && value.some(Array.isArray);
 }

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

@@ -1,5 +1,5 @@
 import { isDOMKeyframes } from "../utils/is-dom-keyframes.mjs";
-import { resolveElements } from "../../../../../../../motion-dom@12.10.4/external/motion-dom/dist/es/utils/resolve-elements.mjs";
+import { resolveElements } from "../../../../../../../motion-dom@12.12.1/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.10.4 → framer-motion@12.12.1}/external/framer-motion/dist/es/animation/animate/sequence.mjs

@@ -1,6 +1,6 @@
 import { createAnimationsFromSequence } from "../sequence/create.mjs";
 import { animateSubject } from "./subject.mjs";
-import { spring } from "../../../../../../../motion-dom@12.10.4/external/motion-dom/dist/es/animation/generators/spring/index.mjs";
+import { spring } from "../../../../../../../motion-dom@12.12.1/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.10.4 → framer-motion@12.12.1}/external/framer-motion/dist/es/animation/animate/single-value.mjs

@@ -1,6 +1,6 @@
-import { isMotionValue } from "../../value/utils/is-motion-value.mjs";
 import { animateMotionValue } from "../interfaces/motion-value.mjs";
-import { motionValue } from "../../../../../../../motion-dom@12.10.4/external/motion-dom/dist/es/value/index.mjs";
+import { isMotionValue } from "../../../../../../../motion-dom@12.12.1/external/motion-dom/dist/es/value/utils/is-motion-value.mjs";
+import { motionValue } from "../../../../../../../motion-dom@12.12.1/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.10.4 → framer-motion@12.12.1}/external/framer-motion/dist/es/animation/animate/subject.mjs

@@ -1,11 +1,11 @@
 import { visualElementStore } from "../../render/store.mjs";
-import { isMotionValue } from "../../value/utils/is-motion-value.mjs";
 import { animateTarget } from "../interfaces/visual-element-target.mjs";
 import { createDOMVisualElement, createObjectVisualElement } from "../utils/create-visual-element.mjs";
 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.9.4/external/motion-utils/dist/es/errors.mjs";
+import { invariant } from "../../../../../../../motion-utils@12.12.1/external/motion-utils/dist/es/errors.mjs";
+import { isMotionValue } from "../../../../../../../motion-dom@12.12.1/external/motion-dom/dist/es/value/utils/is-motion-value.mjs";
 function isSingleValue(subject, keyframes) {
   return isMotionValue(subject) || typeof subject === "number" || typeof subject === "string" && !isDOMKeyframes(keyframes);
 }