framer-motion 12.7.5 → 12.8.0

package/dist/cjs/client.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var create = require('./create-RWnxg4Sz.js');
+var create = require('./create-Bv1Fn_mR.js');
 require('motion-dom');
 require('motion-utils');
 require('react/jsx-runtime');

package/dist/cjs/{create-RWnxg4Sz.js → create-Bv1Fn_mR.js}

@@ -364,28 +364,13 @@ function delay(callback, timeout) {
     return () => motionDom.cancelFrame(checkElapsed);
 }
 
-const isKeyframesTarget = (v) => {
-    return Array.isArray(v);
-};
-
-const isCustomValue = (v) => {
-    return Boolean(v && typeof v === "object" && v.mix && v.toValue);
-};
-const resolveFinalValueInKeyframes = (v) => {
-    // TODO maybe throw if v.length - 1 is placeholder token?
-    return isKeyframesTarget(v) ? v[v.length - 1] || 0 : v;
-};
-
 /**
  * If the provided value is a MotionValue, this returns the actual value, otherwise just the value itself
  *
  * TODO: Remove and move to library
  */
 function resolveMotionValue(value) {
-    const unwrappedValue = isMotionValue(value) ? value.get() : value;
-    return isCustomValue(unwrappedValue)
-        ? unwrappedValue.toValue()
-        : unwrappedValue;
+    return isMotionValue(value) ? value.get() : value;
 }
 
 const borders = ["TopLeft", "TopRight", "BottomLeft", "BottomRight"];
@@ -2735,7 +2720,7 @@ function updateMotionValuesFromProps(element, next, prev) {
              * and warn against mismatches.
              */
             if (process.env.NODE_ENV === "development") {
-                motionUtils.warnOnce(nextValue.version === "12.7.5", `Attempting to mix Motion versions ${nextValue.version} with 12.7.5 may not work as expected.`);
+                motionUtils.warnOnce(nextValue.version === "12.8.0", `Attempting to mix Motion versions ${nextValue.version} with 12.8.0 may not work as expected.`);
             }
         }
         else if (isMotionValue(prevValue)) {
@@ -3609,6 +3594,10 @@ function resolveVariant(visualElement, definition, custom) {
     return resolveVariantFromProps(props, definition, custom !== undefined ? custom : props.custom, visualElement);
 }
 
+const isKeyframesTarget = (v) => {
+    return Array.isArray(v);
+};
+
 /**
  * Set VisualElement's MotionValue, creating a new MotionValue for it if
  * it doesn't exist.
@@ -3621,6 +3610,10 @@ function setMotionValue(visualElement, key, value) {
         visualElement.addValue(key, motionDom.motionValue(value));
     }
 }
+function resolveFinalValueInKeyframes(v) {
+    // TODO maybe throw if v.length - 1 is placeholder token?
+    return isKeyframesTarget(v) ? v[v.length - 1] || 0 : v;
+}
 function setTarget(visualElement, definition) {
     const resolved = resolveVariant(visualElement, definition);
     let { transitionEnd = {}, transition = {}, ...target } = resolved || {};

package/dist/cjs/dom.js

@@ -345,11 +345,6 @@ const isKeyframesTarget = (v) => {
     return Array.isArray(v);
 };
 
-const resolveFinalValueInKeyframes = (v) => {
-    // TODO maybe throw if v.length - 1 is placeholder token?
-    return isKeyframesTarget(v) ? v[v.length - 1] || 0 : v;
-};
-
 function getValueState(visualElement) {
     const state = [{}, {}];
     visualElement?.values.forEach((value, key) => {
@@ -402,6 +397,10 @@ function setMotionValue(visualElement, key, value) {
         visualElement.addValue(key, motionDom.motionValue(value));
     }
 }
+function resolveFinalValueInKeyframes(v) {
+    // TODO maybe throw if v.length - 1 is placeholder token?
+    return isKeyframesTarget(v) ? v[v.length - 1] || 0 : v;
+}
 function setTarget(visualElement, definition) {
     const resolved = resolveVariant(visualElement, definition);
     let { transitionEnd = {}, transition = {}, ...target } = resolved || {};
@@ -760,7 +759,7 @@ function updateMotionValuesFromProps(element, next, prev) {
              * and warn against mismatches.
              */
             if (process.env.NODE_ENV === "development") {
-                motionUtils.warnOnce(nextValue.version === "12.7.5", `Attempting to mix Motion versions ${nextValue.version} with 12.7.5 may not work as expected.`);
+                motionUtils.warnOnce(nextValue.version === "12.8.0", `Attempting to mix Motion versions ${nextValue.version} with 12.8.0 may not work as expected.`);
             }
         }
         else if (isMotionValue(prevValue)) {
@@ -2589,24 +2588,6 @@ function distance2D(a, b) {
     return Math.sqrt(xDelta ** 2 + yDelta ** 2);
 }
 
-const isCustomValueType = (v) => {
-    return v && typeof v === "object" && v.mix;
-};
-const getMixer = (v) => (isCustomValueType(v) ? v.mix : undefined);
-function transform(...args) {
-    const useImmediate = !Array.isArray(args[0]);
-    const argOffset = useImmediate ? 0 : -1;
-    const inputValue = args[0 + argOffset];
-    const inputRange = args[1 + argOffset];
-    const outputRange = args[2 + argOffset];
-    const options = args[3 + argOffset];
-    const interpolator = motionDom.interpolate(inputRange, outputRange, {
-        mixer: getMixer(outputRange[0]),
-        ...options,
-    });
-    return useImmediate ? interpolator(inputValue) : interpolator;
-}
-
 exports.animate = animate;
 exports.animateMini = animateMini;
 exports.createScopedAnimate = createScopedAnimate;
@@ -2617,7 +2598,6 @@ exports.inView = inView;
 exports.scroll = scroll;
 exports.scrollInfo = scrollInfo;
 exports.stagger = stagger;
-exports.transform = transform;
 Object.keys(motionDom).forEach(function (k) {
     if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
         enumerable: true,

package/dist/cjs/index.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
-var create = require('./create-RWnxg4Sz.js');
+var create = require('./create-Bv1Fn_mR.js');
 var motionDom = require('motion-dom');
 var motionUtils = require('motion-utils');
 
@@ -636,24 +636,6 @@ function useMotionValue(initial) {
     return value;
 }
 
-const isCustomValueType = (v) => {
-    return v && typeof v === "object" && v.mix;
-};
-const getMixer = (v) => (isCustomValueType(v) ? v.mix : undefined);
-function transform(...args) {
-    const useImmediate = !Array.isArray(args[0]);
-    const argOffset = useImmediate ? 0 : -1;
-    const inputValue = args[0 + argOffset];
-    const inputRange = args[1 + argOffset];
-    const outputRange = args[2 + argOffset];
-    const options = args[3 + argOffset];
-    const interpolator = motionDom.interpolate(inputRange, outputRange, {
-        mixer: getMixer(outputRange[0]),
-        ...options,
-    });
-    return useImmediate ? interpolator(inputValue) : interpolator;
-}
-
 function useCombineMotionValues(values, combineValues) {
     /**
      * Initialise the returned motion value. This remains the same between renders.
@@ -707,7 +689,7 @@ function useTransform(input, inputRangeOrTransformer, outputRange, options) {
     }
     const transformer = typeof inputRangeOrTransformer === "function"
         ? inputRangeOrTransformer
-        : transform(inputRangeOrTransformer, outputRange, options);
+        : motionDom.transform(inputRangeOrTransformer, outputRange, options);
     return Array.isArray(input)
         ? useListTransform(input, transformer)
         : useListTransform([input], ([latest]) => transformer(latest));
@@ -3021,7 +3003,6 @@ exports.scroll = scroll;
 exports.scrollInfo = scrollInfo;
 exports.stagger = stagger;
 exports.startOptimizedAppearAnimation = startOptimizedAppearAnimation;
-exports.transform = transform;
 exports.unwrapMotionComponent = unwrapMotionComponent;
 exports.useAnimate = useAnimate;
 exports.useAnimateMini = useAnimateMini;

package/dist/cjs/m.js

@@ -925,20 +925,13 @@ function useConstant(init) {
     return ref.current;
 }
 
-const isCustomValue = (v) => {
-    return Boolean(v && typeof v === "object" && v.mix && v.toValue);
-};
-
 /**
  * If the provided value is a MotionValue, this returns the actual value, otherwise just the value itself
  *
  * TODO: Remove and move to library
  */
 function resolveMotionValue(value) {
-    const unwrappedValue = isMotionValue(value) ? value.get() : value;
-    return isCustomValue(unwrappedValue)
-        ? unwrappedValue.toValue()
-        : unwrappedValue;
+    return isMotionValue(value) ? value.get() : value;
 }
 
 function makeState({ scrapeMotionValuesFromProps, createRenderState, onUpdate, }, props, context, presenceContext) {

package/dist/dom.d.ts

@@ -158,97 +158,4 @@ declare function delayInSeconds(callback: DelayedFunction, timeout: number): ()
 declare const distance: (a: number, b: number) => number;
 declare function distance2D(a: Point, b: Point): number;
 
-/**
- * @public
- */
-interface TransformOptions<T> {
-    /**
-     * Clamp values to within the given range. Defaults to `true`
-     *
-     * @public
-     */
-    clamp?: boolean;
-    /**
-     * Easing functions to use on the interpolations between each value in the input and output ranges.
-     *
-     * If provided as an array, the array must be one item shorter than the input and output ranges, as the easings apply to the transition **between** each.
-     *
-     * @public
-     */
-    ease?: EasingFunction | EasingFunction[];
-    /**
-     * Provide a function that can interpolate between any two values in the provided range.
-     *
-     * @public
-     */
-    mixer?: (from: T, to: T) => (v: number) => any;
-}
-/**
- * Transforms numbers into other values by mapping them from an input range to an output range.
- * Returns the type of the input provided.
- *
- * @remarks
- *
- * Given an input range of `[0, 200]` and an output range of
- * `[0, 1]`, this function will return a value between `0` and `1`.
- * The input range must be a linear series of numbers. The output range
- * can be any supported value type, such as numbers, colors, shadows, arrays, objects and more.
- * Every value in the output range must be of the same type and in the same format.
- *
- * ```jsx
- * import * as React from "react"
- * import { transform } from "framer-motion"
- *
- * export function MyComponent() {
- *    const inputRange = [0, 200]
- *    const outputRange = [0, 1]
- *    const output = transform(100, inputRange, outputRange)
- *
- *    // Returns 0.5
- *    return <div>{output}</div>
- * }
- * ```
- *
- * @param inputValue - A number to transform between the input and output ranges.
- * @param inputRange - A linear series of numbers (either all increasing or decreasing).
- * @param outputRange - A series of numbers, colors, strings, or arrays/objects of those. Must be the same length as `inputRange`.
- * @param options - Clamp: Clamp values to within the given range. Defaults to `true`.
- *
- * @public
- */
-declare function transform<T>(inputValue: number, inputRange: number[], outputRange: T[], options?: TransformOptions<T>): T;
-/**
- *
- * Transforms numbers into other values by mapping them from an input range to an output range.
- *
- * Given an input range of `[0, 200]` and an output range of
- * `[0, 1]`, this function will return a value between `0` and `1`.
- * The input range must be a linear series of numbers. The output range
- * can be any supported value type, such as numbers, colors, shadows, arrays, objects and more.
- * Every value in the output range must be of the same type and in the same format.
- *
- * ```jsx
- * import * as React from "react"
- * import { Frame, transform } from "framer"
- *
- * export function MyComponent() {
- *     const inputRange = [-200, -100, 100, 200]
- *     const outputRange = [0, 1, 1, 0]
- *     const convertRange = transform(inputRange, outputRange)
- *     const output = convertRange(-150)
- *
- *     // Returns 0.5
- *     return <div>{output}</div>
- * }
- *
- * ```
- *
- * @param inputRange - A linear series of numbers (either all increasing or decreasing).
- * @param outputRange - A series of numbers, colors or strings. Must be the same length as `inputRange`.
- * @param options - Clamp: clamp values to within the given range. Defaults to `true`.
- *
- * @public
- */
-declare function transform<T>(inputRange: number[], outputRange: T[], options?: TransformOptions<T>): (inputValue: number) => T;
-
-export { type AbsoluteKeyframe, type AnimationSequence, type At, type DOMSegment, type DOMSegmentWithTransition, type DelayedFunction, type MotionValueSegment, type MotionValueSegmentWithTransition, type ObjectSegment, type ObjectSegmentWithTransition, type ObjectTarget, type ResolvedAnimationDefinition, type ResolvedAnimationDefinitions, type Segment, type SequenceLabel, type SequenceLabelWithTime, type SequenceMap, type SequenceOptions, type SequenceTime, type ValueSequence, animate, animateMini, createScopedAnimate, delayInSeconds as delay, distance, distance2D, inView, scroll, scrollInfo, stagger, transform };
+export { type AbsoluteKeyframe, type AnimationSequence, type At, type DOMSegment, type DOMSegmentWithTransition, type DelayedFunction, type MotionValueSegment, type MotionValueSegmentWithTransition, type ObjectSegment, type ObjectSegmentWithTransition, type ObjectTarget, type ResolvedAnimationDefinition, type ResolvedAnimationDefinitions, type Segment, type SequenceLabel, type SequenceLabelWithTime, type SequenceMap, type SequenceOptions, type SequenceTime, type ValueSequence, animate, animateMini, createScopedAnimate, delayInSeconds as delay, distance, distance2D, inView, scroll, scrollInfo, stagger };