motion 12.18.1 → 12.19.0

package/dist/es/framer-motion/dist/es/animation/interfaces/visual-element-target.mjs

@@ -1,85 +0,0 @@
-import { setTarget } from '../../render/utils/setters.mjs';
-import { addValueToWillChange } from '../../value/use-will-change/add-will-change.mjs';
-import { getOptimisedAppearId } from '../optimized-appear/get-appear-id.mjs';
-import { animateMotionValue } from './motion-value.mjs';
-import { getValueTransition } from '../../../../../motion-dom/dist/es/animation/utils/get-value-transition.mjs';
-import { frame } from '../../../../../motion-dom/dist/es/frameloop/frame.mjs';
-import { positionalKeys } from '../../../../../motion-dom/dist/es/render/utils/keys-position.mjs';
-
-/**
- * Decide whether we should block this animation. Previously, we achieved this
- * just by checking whether the key was listed in protectedKeys, but this
- * posed problems if an animation was triggered by afterChildren and protectedKeys
- * had been set to true in the meantime.
- */
-function shouldBlockAnimation({ protectedKeys, needsAnimating }, key) {
-    const shouldBlock = protectedKeys.hasOwnProperty(key) && needsAnimating[key] !== true;
-    needsAnimating[key] = false;
-    return shouldBlock;
-}
-function animateTarget(visualElement, targetAndTransition, { delay = 0, transitionOverride, type } = {}) {
-    let { transition = visualElement.getDefaultTransition(), transitionEnd, ...target } = targetAndTransition;
-    if (transitionOverride)
-        transition = transitionOverride;
-    const animations = [];
-    const animationTypeState = type &&
-        visualElement.animationState &&
-        visualElement.animationState.getState()[type];
-    for (const key in target) {
-        const value = visualElement.getValue(key, visualElement.latestValues[key] ?? null);
-        const valueTarget = target[key];
-        if (valueTarget === undefined ||
-            (animationTypeState &&
-                shouldBlockAnimation(animationTypeState, key))) {
-            continue;
-        }
-        const valueTransition = {
-            delay,
-            ...getValueTransition(transition || {}, key),
-        };
-        /**
-         * If the value is already at the defined target, skip the animation.
-         */
-        const currentValue = value.get();
-        if (currentValue !== undefined &&
-            !value.isAnimating &&
-            !Array.isArray(valueTarget) &&
-            valueTarget === currentValue &&
-            !valueTransition.velocity) {
-            continue;
-        }
-        /**
-         * If this is the first time a value is being animated, check
-         * to see if we're handling off from an existing animation.
-         */
-        let isHandoff = false;
-        if (window.MotionHandoffAnimation) {
-            const appearId = getOptimisedAppearId(visualElement);
-            if (appearId) {
-                const startTime = window.MotionHandoffAnimation(appearId, key, frame);
-                if (startTime !== null) {
-                    valueTransition.startTime = startTime;
-                    isHandoff = true;
-                }
-            }
-        }
-        addValueToWillChange(visualElement, key);
-        value.start(animateMotionValue(key, value, valueTarget, visualElement.shouldReduceMotion && positionalKeys.has(key)
-            ? { type: false }
-            : valueTransition, visualElement, isHandoff));
-        const animation = value.animation;
-        if (animation) {
-            animations.push(animation);
-        }
-    }
-    if (transitionEnd) {
-        Promise.all(animations).then(() => {
-            frame.update(() => {
-                transitionEnd && setTarget(visualElement, transitionEnd);
-            });
-        });
-    }
-    return animations;
-}
-
-export { animateTarget };

package/dist/es/framer-motion/dist/es/animation/interfaces/visual-element-variant.mjs

@@ -1,65 +0,0 @@
-import { resolveVariant } from '../../render/utils/resolve-dynamic-variants.mjs';
-import { animateTarget } from './visual-element-target.mjs';
-
-function animateVariant(visualElement, variant, options = {}) {
-    const resolved = resolveVariant(visualElement, variant, options.type === "exit"
-        ? visualElement.presenceContext?.custom
-        : undefined);
-    let { transition = visualElement.getDefaultTransition() || {} } = resolved || {};
-    if (options.transitionOverride) {
-        transition = options.transitionOverride;
-    }
-    /**
-     * If we have a variant, create a callback that runs it as an animation.
-     * Otherwise, we resolve a Promise immediately for a composable no-op.
-     */
-    const getAnimation = resolved
-        ? () => Promise.all(animateTarget(visualElement, resolved, options))
-        : () => Promise.resolve();
-    /**
-     * If we have children, create a callback that runs all their animations.
-     * Otherwise, we resolve a Promise immediately for a composable no-op.
-     */
-    const getChildAnimations = visualElement.variantChildren && visualElement.variantChildren.size
-        ? (forwardDelay = 0) => {
-            const { delayChildren = 0, staggerChildren, staggerDirection, } = transition;
-            return animateChildren(visualElement, variant, delayChildren + forwardDelay, staggerChildren, staggerDirection, options);
-        }
-        : () => Promise.resolve();
-    /**
-     * If the transition explicitly defines a "when" option, we need to resolve either
-     * this animation or all children animations before playing the other.
-     */
-    const { when } = transition;
-    if (when) {
-        const [first, last] = when === "beforeChildren"
-            ? [getAnimation, getChildAnimations]
-            : [getChildAnimations, getAnimation];
-        return first().then(() => last());
-    }
-    else {
-        return Promise.all([getAnimation(), getChildAnimations(options.delay)]);
-    }
-}
-function animateChildren(visualElement, variant, delayChildren = 0, staggerChildren = 0, staggerDirection = 1, options) {
-    const animations = [];
-    const maxStaggerDuration = (visualElement.variantChildren.size - 1) * staggerChildren;
-    const generateStaggerDuration = staggerDirection === 1
-        ? (i = 0) => i * staggerChildren
-        : (i = 0) => maxStaggerDuration - i * staggerChildren;
-    Array.from(visualElement.variantChildren)
-        .sort(sortByTreeOrder)
-        .forEach((child, i) => {
-        child.notify("AnimationStart", variant);
-        animations.push(animateVariant(child, variant, {
-            ...options,
-            delay: delayChildren + generateStaggerDuration(i),
-        }).then(() => child.notify("AnimationComplete", variant)));
-    });
-    return Promise.all(animations);
-}
-function sortByTreeOrder(a, b) {
-    return a.sortNodePosition(b);
-}
-
-export { animateVariant, sortByTreeOrder };

package/dist/es/framer-motion/dist/es/animation/interfaces/visual-element.mjs

@@ -1,26 +0,0 @@
-import { resolveVariant } from '../../render/utils/resolve-dynamic-variants.mjs';
-import { animateTarget } from './visual-element-target.mjs';
-import { animateVariant } from './visual-element-variant.mjs';
-
-function animateVisualElement(visualElement, definition, options = {}) {
-    visualElement.notify("AnimationStart", definition);
-    let animation;
-    if (Array.isArray(definition)) {
-        const animations = definition.map((variant) => animateVariant(visualElement, variant, options));
-        animation = Promise.all(animations);
-    }
-    else if (typeof definition === "string") {
-        animation = animateVariant(visualElement, definition, options);
-    }
-    else {
-        const resolvedDefinition = typeof definition === "function"
-            ? resolveVariant(visualElement, definition, options.custom)
-            : definition;
-        animation = Promise.all(animateTarget(visualElement, resolvedDefinition, options));
-    }
-    return animation.then(() => {
-        visualElement.notify("AnimationComplete", definition);
-    });
-}
-
-export { animateVisualElement };

package/dist/es/framer-motion/dist/es/animation/optimized-appear/data-id.mjs

@@ -1,6 +0,0 @@
-import { camelToDash } from '../../render/dom/utils/camel-to-dash.mjs';
-
-const optimizedAppearDataId = "framerAppearId";
-const optimizedAppearDataAttribute = "data-" + camelToDash(optimizedAppearDataId);
-
-export { optimizedAppearDataAttribute, optimizedAppearDataId };

package/dist/es/framer-motion/dist/es/animation/optimized-appear/get-appear-id.mjs

@@ -1,7 +0,0 @@
-import { optimizedAppearDataAttribute } from './data-id.mjs';
-
-function getOptimisedAppearId(visualElement) {
-    return visualElement.props[optimizedAppearDataAttribute];
-}
-
-export { getOptimisedAppearId };

package/dist/es/framer-motion/dist/es/animation/optimized-appear/handoff.mjs

@@ -1,38 +0,0 @@
-import { appearAnimationStore } from './store.mjs';
-import { appearStoreId } from './store-id.mjs';
-
-function handoffOptimizedAppearAnimation(elementId, valueName, frame) {
-    const storeId = appearStoreId(elementId, valueName);
-    const optimisedAnimation = appearAnimationStore.get(storeId);
-    if (!optimisedAnimation) {
-        return null;
-    }
-    const { animation, startTime } = optimisedAnimation;
-    function cancelAnimation() {
-        window.MotionCancelOptimisedAnimation?.(elementId, valueName, frame);
-    }
-    /**
-     * We can cancel the animation once it's finished now that we've synced
-     * with Motion.
-     *
-     * Prefer onfinish over finished as onfinish is backwards compatible with
-     * older browsers.
-     */
-    animation.onfinish = cancelAnimation;
-    if (startTime === null || window.MotionHandoffIsComplete?.(elementId)) {
-        /**
-         * If the startTime is null, this animation is the Paint Ready detection animation
-         * and we can cancel it immediately without handoff.
-         *
-         * Or if we've already handed off the animation then we're now interrupting it.
-         * In which case we need to cancel it.
-         */
-        cancelAnimation();
-        return null;
-    }
-    else {
-        return startTime;
-    }
-}
-
-export { handoffOptimizedAppearAnimation };

package/dist/es/framer-motion/dist/es/animation/optimized-appear/start.mjs

@@ -1,171 +0,0 @@
-import { optimizedAppearDataId } from './data-id.mjs';
-import { getOptimisedAppearId } from './get-appear-id.mjs';
-import { handoffOptimizedAppearAnimation } from './handoff.mjs';
-import { appearAnimationStore, appearComplete } from './store.mjs';
-import { appearStoreId } from './store-id.mjs';
-import { startWaapiAnimation } from '../../../../../motion-dom/dist/es/animation/waapi/start-waapi-animation.mjs';
-import { noop } from '../../../../../motion-utils/dist/es/noop.mjs';
-
-/**
- * A single time to use across all animations to manually set startTime
- * and ensure they're all in sync.
- */
-let startFrameTime;
-/**
- * A dummy animation to detect when Chrome is ready to start
- * painting the page and hold off from triggering the real animation
- * until then. We only need one animation to detect paint ready.
- *
- * https://bugs.chromium.org/p/chromium/issues/detail?id=1406850
- */
-let readyAnimation;
-/**
- * Keep track of animations that were suspended vs cancelled so we
- * can easily resume them when we're done measuring layout.
- */
-const suspendedAnimations = new Set();
-function resumeSuspendedAnimations() {
-    suspendedAnimations.forEach((data) => {
-        data.animation.play();
-        data.animation.startTime = data.startTime;
-    });
-    suspendedAnimations.clear();
-}
-function startOptimizedAppearAnimation(element, name, keyframes, options, onReady) {
-    // Prevent optimised appear animations if Motion has already started animating.
-    if (window.MotionIsMounted) {
-        return;
-    }
-    const id = element.dataset[optimizedAppearDataId];
-    if (!id)
-        return;
-    window.MotionHandoffAnimation = handoffOptimizedAppearAnimation;
-    const storeId = appearStoreId(id, name);
-    if (!readyAnimation) {
-        readyAnimation = startWaapiAnimation(element, name, [keyframes[0], keyframes[0]], 
-        /**
-         * 10 secs is basically just a super-safe duration to give Chrome
-         * long enough to get the animation ready.
-         */
-        { duration: 10000, ease: "linear" });
-        appearAnimationStore.set(storeId, {
-            animation: readyAnimation,
-            startTime: null,
-        });
-        /**
-         * If there's no readyAnimation then there's been no instantiation
-         * of handoff animations.
-         */
-        window.MotionHandoffAnimation = handoffOptimizedAppearAnimation;
-        window.MotionHasOptimisedAnimation = (elementId, valueName) => {
-            if (!elementId)
-                return false;
-            /**
-             * Keep a map of elementIds that have started animating. We check
-             * via ID instead of Element because of hydration errors and
-             * pre-hydration checks. We also actively record IDs as they start
-             * animating rather than simply checking for data-appear-id as
-             * this attrbute might be present but not lead to an animation, for
-             * instance if the element's appear animation is on a different
-             * breakpoint.
-             */
-            if (!valueName) {
-                return appearComplete.has(elementId);
-            }
-            const animationId = appearStoreId(elementId, valueName);
-            return Boolean(appearAnimationStore.get(animationId));
-        };
-        window.MotionHandoffMarkAsComplete = (elementId) => {
-            if (appearComplete.has(elementId)) {
-                appearComplete.set(elementId, true);
-            }
-        };
-        window.MotionHandoffIsComplete = (elementId) => {
-            return appearComplete.get(elementId) === true;
-        };
-        /**
-         * We only need to cancel transform animations as
-         * they're the ones that will interfere with the
-         * layout animation measurements.
-         */
-        window.MotionCancelOptimisedAnimation = (elementId, valueName, frame, canResume) => {
-            const animationId = appearStoreId(elementId, valueName);
-            const data = appearAnimationStore.get(animationId);
-            if (!data)
-                return;
-            if (frame && canResume === undefined) {
-                /**
-                 * Wait until the end of the subsequent frame to cancel the animation
-                 * to ensure we don't remove the animation before the main thread has
-                 * had a chance to resolve keyframes and render.
-                 */
-                frame.postRender(() => {
-                    frame.postRender(() => {
-                        data.animation.cancel();
-                    });
-                });
-            }
-            else {
-                data.animation.cancel();
-            }
-            if (frame && canResume) {
-                suspendedAnimations.add(data);
-                frame.render(resumeSuspendedAnimations);
-            }
-            else {
-                appearAnimationStore.delete(animationId);
-                /**
-                 * If there are no more animations left, we can remove the cancel function.
-                 * This will let us know when we can stop checking for conflicting layout animations.
-                 */
-                if (!appearAnimationStore.size) {
-                    window.MotionCancelOptimisedAnimation = undefined;
-                }
-            }
-        };
-        window.MotionCheckAppearSync = (visualElement, valueName, value) => {
-            const appearId = getOptimisedAppearId(visualElement);
-            if (!appearId)
-                return;
-            const valueIsOptimised = window.MotionHasOptimisedAnimation?.(appearId, valueName);
-            const externalAnimationValue = visualElement.props.values?.[valueName];
-            if (!valueIsOptimised || !externalAnimationValue)
-                return;
-            const removeSyncCheck = value.on("change", (latestValue) => {
-                if (externalAnimationValue.get() !== latestValue) {
-                    window.MotionCancelOptimisedAnimation?.(appearId, valueName);
-                    removeSyncCheck();
-                }
-            });
-            return removeSyncCheck;
-        };
-    }
-    const startAnimation = () => {
-        readyAnimation.cancel();
-        const appearAnimation = startWaapiAnimation(element, name, keyframes, options);
-        /**
-         * Record the time of the first started animation. We call performance.now() once
-         * here and once in handoff to ensure we're getting
-         * close to a frame-locked time. This keeps all animations in sync.
-         */
-        if (startFrameTime === undefined) {
-            startFrameTime = performance.now();
-        }
-        appearAnimation.startTime = startFrameTime;
-        appearAnimationStore.set(storeId, {
-            animation: appearAnimation,
-            startTime: startFrameTime,
-        });
-        if (onReady)
-            onReady(appearAnimation);
-    };
-    appearComplete.set(id, false);
-    if (readyAnimation.ready) {
-        readyAnimation.ready.then(startAnimation).catch(noop);
-    }
-    else {
-        startAnimation();
-    }
-}
-
-export { startOptimizedAppearAnimation };

package/dist/es/framer-motion/dist/es/animation/optimized-appear/store-id.mjs

@@ -1,8 +0,0 @@
-import { transformProps } from '../../../../../motion-dom/dist/es/render/utils/keys-transform.mjs';
-
-const appearStoreId = (elementId, valueName) => {
-    const key = transformProps.has(valueName) ? "transform" : valueName;
-    return `${elementId}: ${key}`;
-};
-
-export { appearStoreId };

package/dist/es/framer-motion/dist/es/animation/optimized-appear/store.mjs

@@ -1,4 +0,0 @@
-const appearAnimationStore = new Map();
-const appearComplete = new Map();
-
-export { appearAnimationStore, appearComplete };

package/dist/es/framer-motion/dist/es/animation/sequence/create.mjs

@@ -1,256 +0,0 @@
-import { resolveSubjects } from '../animate/resolve-subjects.mjs';
-import { calculateRepeatDuration } from './utils/calc-repeat-duration.mjs';
-import { calcNextTime } from './utils/calc-time.mjs';
-import { addKeyframes } from './utils/edit.mjs';
-import { normalizeTimes } from './utils/normalize-times.mjs';
-import { compareByTime } from './utils/sort.mjs';
-import { isMotionValue } from '../../../../../motion-dom/dist/es/value/utils/is-motion-value.mjs';
-import { defaultOffset } from '../../../../../motion-dom/dist/es/animation/keyframes/offsets/default.mjs';
-import { isGenerator } from '../../../../../motion-dom/dist/es/animation/generators/utils/is-generator.mjs';
-import { createGeneratorEasing } from '../../../../../motion-dom/dist/es/animation/generators/utils/create-generator-easing.mjs';
-import { fillOffset } from '../../../../../motion-dom/dist/es/animation/keyframes/offsets/fill.mjs';
-import { invariant } from '../../../../../motion-utils/dist/es/errors.mjs';
-import { getEasingForSegment } from '../../../../../motion-utils/dist/es/easing/utils/get-easing-for-segment.mjs';
-import { progress } from '../../../../../motion-utils/dist/es/progress.mjs';
-import { secondsToMilliseconds } from '../../../../../motion-utils/dist/es/time-conversion.mjs';
-
-const defaultSegmentEasing = "easeInOut";
-const MAX_REPEAT = 20;
-function createAnimationsFromSequence(sequence, { defaultTransition = {}, ...sequenceTransition } = {}, scope, generators) {
-    const defaultDuration = defaultTransition.duration || 0.3;
-    const animationDefinitions = new Map();
-    const sequences = new Map();
-    const elementCache = {};
-    const timeLabels = new Map();
-    let prevTime = 0;
-    let currentTime = 0;
-    let totalDuration = 0;
-    /**
-     * Build the timeline by mapping over the sequence array and converting
-     * the definitions into keyframes and offsets with absolute time values.
-     * These will later get converted into relative offsets in a second pass.
-     */
-    for (let i = 0; i < sequence.length; i++) {
-        const segment = sequence[i];
-        /**
-         * If this is a timeline label, mark it and skip the rest of this iteration.
-         */
-        if (typeof segment === "string") {
-            timeLabels.set(segment, currentTime);
-            continue;
-        }
-        else if (!Array.isArray(segment)) {
-            timeLabels.set(segment.name, calcNextTime(currentTime, segment.at, prevTime, timeLabels));
-            continue;
-        }
-        let [subject, keyframes, transition = {}] = segment;
-        /**
-         * If a relative or absolute time value has been specified we need to resolve
-         * it in relation to the currentTime.
-         */
-        if (transition.at !== undefined) {
-            currentTime = calcNextTime(currentTime, transition.at, prevTime, timeLabels);
-        }
-        /**
-         * Keep track of the maximum duration in this definition. This will be
-         * applied to currentTime once the definition has been parsed.
-         */
-        let maxDuration = 0;
-        const resolveValueSequence = (valueKeyframes, valueTransition, valueSequence, elementIndex = 0, numSubjects = 0) => {
-            const valueKeyframesAsList = keyframesAsList(valueKeyframes);
-            const { delay = 0, times = defaultOffset(valueKeyframesAsList), type = "keyframes", repeat, repeatType, repeatDelay = 0, ...remainingTransition } = valueTransition;
-            let { ease = defaultTransition.ease || "easeOut", duration } = valueTransition;
-            /**
-             * Resolve stagger() if defined.
-             */
-            const calculatedDelay = typeof delay === "function"
-                ? delay(elementIndex, numSubjects)
-                : delay;
-            /**
-             * If this animation should and can use a spring, generate a spring easing function.
-             */
-            const numKeyframes = valueKeyframesAsList.length;
-            const createGenerator = isGenerator(type)
-                ? type
-                : generators?.[type || "keyframes"];
-            if (numKeyframes <= 2 && createGenerator) {
-                /**
-                 * As we're creating an easing function from a spring,
-                 * ideally we want to generate it using the real distance
-                 * between the two keyframes. However this isn't always
-                 * possible - in these situations we use 0-100.
-                 */
-                let absoluteDelta = 100;
-                if (numKeyframes === 2 &&
-                    isNumberKeyframesArray(valueKeyframesAsList)) {
-                    const delta = valueKeyframesAsList[1] - valueKeyframesAsList[0];
-                    absoluteDelta = Math.abs(delta);
-                }
-                const springTransition = { ...remainingTransition };
-                if (duration !== undefined) {
-                    springTransition.duration = secondsToMilliseconds(duration);
-                }
-                const springEasing = createGeneratorEasing(springTransition, absoluteDelta, createGenerator);
-                ease = springEasing.ease;
-                duration = springEasing.duration;
-            }
-            duration ?? (duration = defaultDuration);
-            const startTime = currentTime + calculatedDelay;
-            /**
-             * If there's only one time offset of 0, fill in a second with length 1
-             */
-            if (times.length === 1 && times[0] === 0) {
-                times[1] = 1;
-            }
-            /**
-             * Fill out if offset if fewer offsets than keyframes
-             */
-            const remainder = times.length - valueKeyframesAsList.length;
-            remainder > 0 && fillOffset(times, remainder);
-            /**
-             * If only one value has been set, ie [1], push a null to the start of
-             * the keyframe array. This will let us mark a keyframe at this point
-             * that will later be hydrated with the previous value.
-             */
-            valueKeyframesAsList.length === 1 &&
-                valueKeyframesAsList.unshift(null);
-            /**
-             * Handle repeat options
-             */
-            if (repeat) {
-                invariant(repeat < MAX_REPEAT, "Repeat count too high, must be less than 20");
-                duration = calculateRepeatDuration(duration, repeat);
-                const originalKeyframes = [...valueKeyframesAsList];
-                const originalTimes = [...times];
-                ease = Array.isArray(ease) ? [...ease] : [ease];
-                const originalEase = [...ease];
-                for (let repeatIndex = 0; repeatIndex < repeat; repeatIndex++) {
-                    valueKeyframesAsList.push(...originalKeyframes);
-                    for (let keyframeIndex = 0; keyframeIndex < originalKeyframes.length; keyframeIndex++) {
-                        times.push(originalTimes[keyframeIndex] + (repeatIndex + 1));
-                        ease.push(keyframeIndex === 0
-                            ? "linear"
-                            : getEasingForSegment(originalEase, keyframeIndex - 1));
-                    }
-                }
-                normalizeTimes(times, repeat);
-            }
-            const targetTime = startTime + duration;
-            /**
-             * Add keyframes, mapping offsets to absolute time.
-             */
-            addKeyframes(valueSequence, valueKeyframesAsList, ease, times, startTime, targetTime);
-            maxDuration = Math.max(calculatedDelay + duration, maxDuration);
-            totalDuration = Math.max(targetTime, totalDuration);
-        };
-        if (isMotionValue(subject)) {
-            const subjectSequence = getSubjectSequence(subject, sequences);
-            resolveValueSequence(keyframes, transition, getValueSequence("default", subjectSequence));
-        }
-        else {
-            const subjects = resolveSubjects(subject, keyframes, scope, elementCache);
-            const numSubjects = subjects.length;
-            /**
-             * For every element in this segment, process the defined values.
-             */
-            for (let subjectIndex = 0; subjectIndex < numSubjects; subjectIndex++) {
-                /**
-                 * Cast necessary, but we know these are of this type
-                 */
-                keyframes = keyframes;
-                transition = transition;
-                const thisSubject = subjects[subjectIndex];
-                const subjectSequence = getSubjectSequence(thisSubject, sequences);
-                for (const key in keyframes) {
-                    resolveValueSequence(keyframes[key], getValueTransition(transition, key), getValueSequence(key, subjectSequence), subjectIndex, numSubjects);
-                }
-            }
-        }
-        prevTime = currentTime;
-        currentTime += maxDuration;
-    }
-    /**
-     * For every element and value combination create a new animation.
-     */
-    sequences.forEach((valueSequences, element) => {
-        for (const key in valueSequences) {
-            const valueSequence = valueSequences[key];
-            /**
-             * Arrange all the keyframes in ascending time order.
-             */
-            valueSequence.sort(compareByTime);
-            const keyframes = [];
-            const valueOffset = [];
-            const valueEasing = [];
-            /**
-             * For each keyframe, translate absolute times into
-             * relative offsets based on the total duration of the timeline.
-             */
-            for (let i = 0; i < valueSequence.length; i++) {
-                const { at, value, easing } = valueSequence[i];
-                keyframes.push(value);
-                valueOffset.push(progress(0, totalDuration, at));
-                valueEasing.push(easing || "easeOut");
-            }
-            /**
-             * If the first keyframe doesn't land on offset: 0
-             * provide one by duplicating the initial keyframe. This ensures
-             * it snaps to the first keyframe when the animation starts.
-             */
-            if (valueOffset[0] !== 0) {
-                valueOffset.unshift(0);
-                keyframes.unshift(keyframes[0]);
-                valueEasing.unshift(defaultSegmentEasing);
-            }
-            /**
-             * If the last keyframe doesn't land on offset: 1
-             * provide one with a null wildcard value. This will ensure it
-             * stays static until the end of the animation.
-             */
-            if (valueOffset[valueOffset.length - 1] !== 1) {
-                valueOffset.push(1);
-                keyframes.push(null);
-            }
-            if (!animationDefinitions.has(element)) {
-                animationDefinitions.set(element, {
-                    keyframes: {},
-                    transition: {},
-                });
-            }
-            const definition = animationDefinitions.get(element);
-            definition.keyframes[key] = keyframes;
-            definition.transition[key] = {
-                ...defaultTransition,
-                duration: totalDuration,
-                ease: valueEasing,
-                times: valueOffset,
-                ...sequenceTransition,
-            };
-        }
-    });
-    return animationDefinitions;
-}
-function getSubjectSequence(subject, sequences) {
-    !sequences.has(subject) && sequences.set(subject, {});
-    return sequences.get(subject);
-}
-function getValueSequence(name, sequences) {
-    if (!sequences[name])
-        sequences[name] = [];
-    return sequences[name];
-}
-function keyframesAsList(keyframes) {
-    return Array.isArray(keyframes) ? keyframes : [keyframes];
-}
-function getValueTransition(transition, key) {
-    return transition && transition[key]
-        ? {
-            ...transition,
-            ...transition[key],
-        }
-        : { ...transition };
-}
-const isNumber = (keyframe) => typeof keyframe === "number";
-const isNumberKeyframesArray = (keyframes) => keyframes.every(isNumber);
-
-export { createAnimationsFromSequence, getValueTransition };