motion 10.3.2 → 10.5.0-alpha.3

package/dist/targets/js/easing/utils/create-generator-easing.cjs.js

@@ -1,71 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var pregenerateKeyframes = require('./pregenerate-keyframes.cjs.js');
-
-function createGeneratorEasing(createGenerator) {
-    const keyframesCache = new WeakMap();
-    return (options = {}) => {
-        const generatorCache = new Map();
-        const getGenerator = (from = 0, to = 100, velocity = 0, isScale = false) => {
-            const key = `${from}-${to}-${velocity}-${isScale}`;
-            if (!generatorCache.has(key)) {
-                generatorCache.set(key, createGenerator(Object.assign({ from,
-                    to,
-                    velocity, restSpeed: isScale ? 0.05 : 2, restDistance: isScale ? 0.01 : 0.5 }, options)));
-            }
-            return generatorCache.get(key);
-        };
-        const getKeyframes = (generator) => {
-            if (!keyframesCache.has(generator)) {
-                keyframesCache.set(generator, pregenerateKeyframes.pregenerateKeyframes(generator));
-            }
-            return keyframesCache.get(generator);
-        };
-        return {
-            createAnimation: (keyframes, getOrigin, canUseGenerator, name, data) => {
-                let settings;
-                let generator;
-                const numKeyframes = keyframes.length;
-                let shouldUseGenerator = canUseGenerator &&
-                    numKeyframes <= 2 &&
-                    keyframes.every(isNumberOrNull);
-                if (shouldUseGenerator) {
-                    const prevAnimationState = name && data && data.prevGeneratorState[name];
-                    const velocity = prevAnimationState &&
-                        (numKeyframes === 1 ||
-                            (numKeyframes === 2 && keyframes[0] === null))
-                        ? prevAnimationState.velocity
-                        : 0;
-                    const target = keyframes[numKeyframes - 1];
-                    const unresolvedOrigin = numKeyframes === 1 ? null : keyframes[0];
-                    const origin = unresolvedOrigin === null
-                        ? prevAnimationState
-                            ? prevAnimationState.value
-                            : parseFloat(getOrigin())
-                        : unresolvedOrigin;
-                    generator = getGenerator(origin, target, velocity, name === null || name === void 0 ? void 0 : name.includes("scale"));
-                    const keyframesMetadata = getKeyframes(generator);
-                    settings = Object.assign(Object.assign({}, keyframesMetadata), { easing: "linear" });
-                }
-                else {
-                    generator = getGenerator(0, 100);
-                    const keyframesMetadata = getKeyframes(generator);
-                    settings = {
-                        easing: "ease",
-                        duration: keyframesMetadata.overshootDuration,
-                    };
-                }
-                // TODO Add test for this
-                if (generator && data && name) {
-                    data.generators[name] = generator;
-                }
-                return settings;
-            },
-        };
-    };
-}
-const isNumberOrNull = (value) => typeof value !== "string";
-
-exports.createGeneratorEasing = createGeneratorEasing;

package/dist/targets/js/easing/utils/create-generator-easing.es.js

@@ -1,67 +0,0 @@
-import { pregenerateKeyframes } from './pregenerate-keyframes.es.js';
-
-function createGeneratorEasing(createGenerator) {
-    const keyframesCache = new WeakMap();
-    return (options = {}) => {
-        const generatorCache = new Map();
-        const getGenerator = (from = 0, to = 100, velocity = 0, isScale = false) => {
-            const key = `${from}-${to}-${velocity}-${isScale}`;
-            if (!generatorCache.has(key)) {
-                generatorCache.set(key, createGenerator(Object.assign({ from,
-                    to,
-                    velocity, restSpeed: isScale ? 0.05 : 2, restDistance: isScale ? 0.01 : 0.5 }, options)));
-            }
-            return generatorCache.get(key);
-        };
-        const getKeyframes = (generator) => {
-            if (!keyframesCache.has(generator)) {
-                keyframesCache.set(generator, pregenerateKeyframes(generator));
-            }
-            return keyframesCache.get(generator);
-        };
-        return {
-            createAnimation: (keyframes, getOrigin, canUseGenerator, name, data) => {
-                let settings;
-                let generator;
-                const numKeyframes = keyframes.length;
-                let shouldUseGenerator = canUseGenerator &&
-                    numKeyframes <= 2 &&
-                    keyframes.every(isNumberOrNull);
-                if (shouldUseGenerator) {
-                    const prevAnimationState = name && data && data.prevGeneratorState[name];
-                    const velocity = prevAnimationState &&
-                        (numKeyframes === 1 ||
-                            (numKeyframes === 2 && keyframes[0] === null))
-                        ? prevAnimationState.velocity
-                        : 0;
-                    const target = keyframes[numKeyframes - 1];
-                    const unresolvedOrigin = numKeyframes === 1 ? null : keyframes[0];
-                    const origin = unresolvedOrigin === null
-                        ? prevAnimationState
-                            ? prevAnimationState.value
-                            : parseFloat(getOrigin())
-                        : unresolvedOrigin;
-                    generator = getGenerator(origin, target, velocity, name === null || name === void 0 ? void 0 : name.includes("scale"));
-                    const keyframesMetadata = getKeyframes(generator);
-                    settings = Object.assign(Object.assign({}, keyframesMetadata), { easing: "linear" });
-                }
-                else {
-                    generator = getGenerator(0, 100);
-                    const keyframesMetadata = getKeyframes(generator);
-                    settings = {
-                        easing: "ease",
-                        duration: keyframesMetadata.overshootDuration,
-                    };
-                }
-                // TODO Add test for this
-                if (generator && data && name) {
-                    data.generators[name] = generator;
-                }
-                return settings;
-            },
-        };
-    };
-}
-const isNumberOrNull = (value) => typeof value !== "string";
-
-export { createGeneratorEasing };

package/dist/targets/js/easing/utils/get-function.cjs.js

@@ -1,37 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var cubicBezier = require('../cubic-bezier.cjs.js');
-var steps = require('../steps.cjs.js');
-var noop = require('../../../../utils/noop.cjs.js');
-
-const namedEasings = {
-    ease: cubicBezier.cubicBezier(0.25, 0.1, 0.25, 1.0),
-    "ease-in": cubicBezier.cubicBezier(0.42, 0.0, 1.0, 1.0),
-    "ease-in-out": cubicBezier.cubicBezier(0.42, 0.0, 0.58, 1.0),
-    "ease-out": cubicBezier.cubicBezier(0.0, 0.0, 0.58, 1.0),
-};
-const functionArgsRegex = /\((.*?)\)/;
-function getEasingFunction(definition) {
-    // If already an easing function, return
-    if (typeof definition === "function")
-        return definition;
-    // If an easing curve definition, return bezier function
-    if (Array.isArray(definition))
-        return cubicBezier.cubicBezier(...definition);
-    // If we have a predefined easing function, return
-    if (namedEasings[definition])
-        return namedEasings[definition];
-    // If this is a steps function, attempt to create easing curve
-    if (definition.startsWith("steps")) {
-        const args = functionArgsRegex.exec(definition);
-        if (args) {
-            const argsArray = args[1].split(",");
-            return steps.steps(parseFloat(argsArray[0]), argsArray[1].trim());
-        }
-    }
-    return noop.noopReturn;
-}
-
-exports.getEasingFunction = getEasingFunction;

package/dist/targets/js/easing/utils/get-function.es.js

@@ -1,33 +0,0 @@
-import { cubicBezier } from '../cubic-bezier.es.js';
-import { steps } from '../steps.es.js';
-import { noopReturn } from '../../../../utils/noop.es.js';
-
-const namedEasings = {
-    ease: cubicBezier(0.25, 0.1, 0.25, 1.0),
-    "ease-in": cubicBezier(0.42, 0.0, 1.0, 1.0),
-    "ease-in-out": cubicBezier(0.42, 0.0, 0.58, 1.0),
-    "ease-out": cubicBezier(0.0, 0.0, 0.58, 1.0),
-};
-const functionArgsRegex = /\((.*?)\)/;
-function getEasingFunction(definition) {
-    // If already an easing function, return
-    if (typeof definition === "function")
-        return definition;
-    // If an easing curve definition, return bezier function
-    if (Array.isArray(definition))
-        return cubicBezier(...definition);
-    // If we have a predefined easing function, return
-    if (namedEasings[definition])
-        return namedEasings[definition];
-    // If this is a steps function, attempt to create easing curve
-    if (definition.startsWith("steps")) {
-        const args = functionArgsRegex.exec(definition);
-        if (args) {
-            const argsArray = args[1].split(",");
-            return steps(parseFloat(argsArray[0]), argsArray[1].trim());
-        }
-    }
-    return noopReturn;
-}
-
-export { getEasingFunction };

package/dist/targets/js/easing/utils/has-reached-target.cjs.js

@@ -1,10 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-function hasReachedTarget(origin, target, current) {
-    return ((origin < target && current >= target) ||
-        (origin > target && current <= target));
-}
-
-exports.hasReachedTarget = hasReachedTarget;

package/dist/targets/js/easing/utils/has-reached-target.es.js

@@ -1,6 +0,0 @@
-function hasReachedTarget(origin, target, current) {
-    return ((origin < target && current >= target) ||
-        (origin > target && current <= target));
-}
-
-export { hasReachedTarget };

package/dist/targets/js/easing/utils/pregenerate-keyframes.cjs.js

@@ -1,34 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const timeStep = 10;
-const maxDuration = 10000;
-function pregenerateKeyframes(generator) {
-    let overshootDuration = undefined;
-    let timestamp = timeStep;
-    let state = generator.next(0);
-    const keyframes = [state.value];
-    while (!state.done && timestamp < maxDuration) {
-        state = generator.next(timestamp);
-        keyframes.push(state.done ? state.target : state.value);
-        if (overshootDuration === undefined && state.hasReachedTarget) {
-            overshootDuration = timestamp;
-        }
-        timestamp += timeStep;
-    }
-    const duration = timestamp - timeStep;
-    /**
-     * If generating an animation that didn't actually move,
-     * generate a second keyframe so we have an origin and target.
-     */
-    if (keyframes.length === 1)
-        keyframes.push(state.value);
-    return {
-        keyframes,
-        duration: duration / 1000,
-        overshootDuration: (overshootDuration !== null && overshootDuration !== void 0 ? overshootDuration : duration) / 1000,
-    };
-}
-
-exports.pregenerateKeyframes = pregenerateKeyframes;

package/dist/targets/js/easing/utils/pregenerate-keyframes.es.js

@@ -1,30 +0,0 @@
-const timeStep = 10;
-const maxDuration = 10000;
-function pregenerateKeyframes(generator) {
-    let overshootDuration = undefined;
-    let timestamp = timeStep;
-    let state = generator.next(0);
-    const keyframes = [state.value];
-    while (!state.done && timestamp < maxDuration) {
-        state = generator.next(timestamp);
-        keyframes.push(state.done ? state.target : state.value);
-        if (overshootDuration === undefined && state.hasReachedTarget) {
-            overshootDuration = timestamp;
-        }
-        timestamp += timeStep;
-    }
-    const duration = timestamp - timeStep;
-    /**
-     * If generating an animation that didn't actually move,
-     * generate a second keyframe so we have an origin and target.
-     */
-    if (keyframes.length === 1)
-        keyframes.push(state.value);
-    return {
-        keyframes,
-        duration: duration / 1000,
-        overshootDuration: (overshootDuration !== null && overshootDuration !== void 0 ? overshootDuration : duration) / 1000,
-    };
-}
-
-export { pregenerateKeyframes };

package/dist/targets/js/utils/get-easing.cjs.js

@@ -1,14 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var wrap = require('../../../utils/wrap.cjs.js');
-var easing = require('../../dom/utils/easing.cjs.js');
-
-function getEasingForSegment(easing$1, i) {
-    return easing.isEasingList(easing$1)
-        ? easing$1[wrap.wrap(0, easing$1.length, i)]
-        : easing$1;
-}
-
-exports.getEasingForSegment = getEasingForSegment;

package/dist/targets/js/utils/get-easing.es.js

@@ -1,10 +0,0 @@
-import { wrap } from '../../../utils/wrap.es.js';
-import { isEasingList } from '../../dom/utils/easing.es.js';
-
-function getEasingForSegment(easing, i) {
-    return isEasingList(easing)
-        ? easing[wrap(0, easing.length, i)]
-        : easing;
-}
-
-export { getEasingForSegment };

package/dist/targets/js/utils/interpolate.cjs.js

@@ -1,35 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var mix = require('../../../utils/mix.cjs.js');
-var noop = require('../../../utils/noop.cjs.js');
-var progress = require('../../../utils/progress.cjs.js');
-var getEasing = require('./get-easing.cjs.js');
-var offset = require('./offset.cjs.js');
-
-const clampProgress = (p) => Math.min(1, Math.max(p, 0));
-function slowInterpolateNumbers(output, input = offset.defaultOffset(output.length), easing = noop.noopReturn) {
-    const length = output.length;
-    /**
-     * If the input length is lower than the output we
-     * fill the input to match. This currently assumes the input
-     * is an animation progress value so is a good candidate for
-     * moving outside the function.
-     */
-    const remainder = length - input.length;
-    remainder > 0 && offset.fillOffset(input, remainder);
-    return (t) => {
-        let i = 0;
-        for (; i < length - 2; i++) {
-            if (t < input[i + 1])
-                break;
-        }
-        let progressInRange = clampProgress(progress.progress(input[i], input[i + 1], t));
-        const segmentEasing = getEasing.getEasingForSegment(easing, i);
-        progressInRange = segmentEasing(progressInRange);
-        return mix.mix(output[i], output[i + 1], progressInRange);
-    };
-}
-
-exports.slowInterpolateNumbers = slowInterpolateNumbers;

package/dist/targets/js/utils/interpolate.es.js

@@ -1,31 +0,0 @@
-import { mix } from '../../../utils/mix.es.js';
-import { noopReturn } from '../../../utils/noop.es.js';
-import { progress } from '../../../utils/progress.es.js';
-import { getEasingForSegment } from './get-easing.es.js';
-import { defaultOffset, fillOffset } from './offset.es.js';
-
-const clampProgress = (p) => Math.min(1, Math.max(p, 0));
-function slowInterpolateNumbers(output, input = defaultOffset(output.length), easing = noopReturn) {
-    const length = output.length;
-    /**
-     * If the input length is lower than the output we
-     * fill the input to match. This currently assumes the input
-     * is an animation progress value so is a good candidate for
-     * moving outside the function.
-     */
-    const remainder = length - input.length;
-    remainder > 0 && fillOffset(input, remainder);
-    return (t) => {
-        let i = 0;
-        for (; i < length - 2; i++) {
-            if (t < input[i + 1])
-                break;
-        }
-        let progressInRange = clampProgress(progress(input[i], input[i + 1], t));
-        const segmentEasing = getEasingForSegment(easing, i);
-        progressInRange = segmentEasing(progressInRange);
-        return mix(output[i], output[i + 1], progressInRange);
-    };
-}
-
-export { slowInterpolateNumbers };

package/dist/targets/js/utils/offset.cjs.js

@@ -1,22 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var mix = require('../../../utils/mix.cjs.js');
-var progress = require('../../../utils/progress.cjs.js');
-
-function fillOffset(offset, remaining) {
-    const min = offset[offset.length - 1];
-    for (let i = 1; i <= remaining; i++) {
-        const offsetProgress = progress.progress(0, remaining, i);
-        offset.push(mix.mix(min, 1, offsetProgress));
-    }
-}
-function defaultOffset(length) {
-    const offset = [0];
-    fillOffset(offset, length - 1);
-    return offset;
-}
-
-exports.defaultOffset = defaultOffset;
-exports.fillOffset = fillOffset;

package/dist/targets/js/utils/offset.es.js

@@ -1,17 +0,0 @@
-import { mix } from '../../../utils/mix.es.js';
-import { progress } from '../../../utils/progress.es.js';
-
-function fillOffset(offset, remaining) {
-    const min = offset[offset.length - 1];
-    for (let i = 1; i <= remaining; i++) {
-        const offsetProgress = progress(0, remaining, i);
-        offset.push(mix(min, 1, offsetProgress));
-    }
-}
-function defaultOffset(length) {
-    const offset = [0];
-    fillOffset(offset, length - 1);
-    return offset;
-}
-
-export { defaultOffset, fillOffset };

package/dist/targets/react/animated.cjs.js

@@ -1,126 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var tslib = require('tslib');
-var React = require('react');
-var useAnimation = require('./hooks/use-animation.cjs.js');
-var useHover = require('./hooks/use-hover.cjs.js');
-var usePress = require('./hooks/use-press.cjs.js');
-var useExit = require('./hooks/use-exit.cjs.js');
-var useViewport = require('./hooks/use-viewport.cjs.js');
-var keyframes = require('./utils/keyframes.cjs.js');
-var poses = require('./utils/poses.cjs.js');
-var context = require('./context.cjs.js');
-
-function _interopNamespace(e) {
-    if (e && e.__esModule) return e;
-    var n = Object.create(null);
-    if (e) {
-        Object.keys(e).forEach(function (k) {
-            if (k !== 'default') {
-                var d = Object.getOwnPropertyDescriptor(e, k);
-                Object.defineProperty(n, k, d.get ? d : {
-                    enumerable: true,
-                    get: function () {
-                        return e[k];
-                    }
-                });
-            }
-        });
-    }
-    n['default'] = e;
-    return Object.freeze(n);
-}
-
-var React__namespace = /*#__PURE__*/_interopNamespace(React);
-
-function createAnimatedComponent(Component) {
-    function Animated(props, _externalRef) {
-        // TODO: Support externalRef if provided
-        const ref = React.useRef(null);
-        const { options: defaultOptions, style, initial, hover, press, exit, inViewport, viewport, poses: poses$1, onStart, onComplete, onViewportEnter, onViewportLeave, inherit = true } = props, forwardProps = tslib.__rest(props
-        /**
-         * Track throughout the render which poses are considered active and should
-         * be passed to children.
-         */
-        , ["options", "style", "initial", "hover", "press", "exit", "inViewport", "viewport", "poses", "onStart", "onComplete", "onViewportEnter", "onViewportLeave", "inherit"]);
-        /**
-         * Track throughout the render which poses are considered active and should
-         * be passed to children.
-         */
-        const isPoseActive = { initial: true, style: true };
-        /**
-         * Inherit poses from the parent context,
-         */
-        let inherited = React.useContext(context.AnimationContext);
-        if (!inherit)
-            inherited = {};
-        const resolvedStyle = poses.resolvePose(style, inherited.style, poses$1);
-        const resolvedInitial = poses.resolvePose(initial, inherited.initial, poses$1);
-        const initialTarget = Object.assign(Object.assign({}, resolvedStyle), resolvedInitial);
-        const target = Object.assign(Object.assign({}, resolvedInitial), resolvedStyle);
-        const options = Object.assign(Object.assign({}, defaultOptions), resolvedStyle === null || resolvedStyle === void 0 ? void 0 : resolvedStyle.options);
-        /**
-         * If we haven't created a style prop for SSR yet (this is the initial render)
-         * make one. We provide this to React every render as beyond that with manage style
-         * via animations.
-         */
-        const styleProp = React.useRef(null);
-        styleProp.current || (styleProp.current = keyframes.convertKeyframesToStyles(initialTarget));
-        /**
-         * Attach animation event handlers (gestures/exit/viewport appearance).
-         * This are called in reverse order of which styles should take priority when
-         * active, for example if there's a hover and press gesture active the press
-         * gesture will take precedence.
-         */
-        const hoverProps = useHover.useHover(target, options, props, inherited, isPoseActive);
-        const pressProps = usePress.usePress(target, options, props, inherited, isPoseActive);
-        useViewport.useViewport(ref, target, options, props, inherited, isPoseActive);
-        const onExitComplete = useExit.useExit(target, options, props, inherited);
-        /**
-         * Compare our final calculated style target with the one from the previous render
-         * and trigger any necessary animations.
-         */
-        useAnimation.useAnimation(ref, initialTarget, target, options, onStart, (animation) => {
-            onComplete && onComplete(animation);
-            onExitComplete && onExitComplete();
-        });
-        const element = React.createElement(Component, Object.assign({}, forwardProps, hoverProps, pressProps, {
-            style: styleProp.current,
-            ref,
-        }));
-        /**
-         * Create a variant context to pass forward to child components.
-         */
-        const context$1 = variantProps.reduce((acc, key) => {
-            acc[key] = undefined;
-            if (props[key]) {
-                if (typeof props[key] === "string" && isPoseActive[key]) {
-                    acc[key] = props[key];
-                }
-            }
-            else if (inherited[key]) {
-                acc[key] = inherited[key];
-            }
-            return acc;
-        }, {});
-        /**
-         * Memoize the context so we only trigger a re-render in children if the values
-         * within it change.
-         */
-        const memoizedContext = React.useMemo(() => context$1, Object.values(context$1));
-        return (React__namespace.createElement(context.AnimationContext.Provider, { value: memoizedContext }, element));
-    }
-    return React.forwardRef(Animated);
-}
-const variantProps = [
-    "initial",
-    "style",
-    "hover",
-    "press",
-    "inViewport",
-    "exit",
-];
-
-exports.createAnimatedComponent = createAnimatedComponent;

package/dist/targets/react/animated.es.js

@@ -1,101 +0,0 @@
-import { __rest } from 'tslib';
-import * as React from 'react';
-import { forwardRef, useRef, useContext, createElement, useMemo } from 'react';
-import { useAnimation } from './hooks/use-animation.es.js';
-import { useHover } from './hooks/use-hover.es.js';
-import { usePress } from './hooks/use-press.es.js';
-import { useExit } from './hooks/use-exit.es.js';
-import { useViewport } from './hooks/use-viewport.es.js';
-import { convertKeyframesToStyles } from './utils/keyframes.es.js';
-import { resolvePose } from './utils/poses.es.js';
-import { AnimationContext } from './context.es.js';
-
-function createAnimatedComponent(Component) {
-    function Animated(props, _externalRef) {
-        // TODO: Support externalRef if provided
-        const ref = useRef(null);
-        const { options: defaultOptions, style, initial, hover, press, exit, inViewport, viewport, poses, onStart, onComplete, onViewportEnter, onViewportLeave, inherit = true } = props, forwardProps = __rest(props
-        /**
-         * Track throughout the render which poses are considered active and should
-         * be passed to children.
-         */
-        , ["options", "style", "initial", "hover", "press", "exit", "inViewport", "viewport", "poses", "onStart", "onComplete", "onViewportEnter", "onViewportLeave", "inherit"]);
-        /**
-         * Track throughout the render which poses are considered active and should
-         * be passed to children.
-         */
-        const isPoseActive = { initial: true, style: true };
-        /**
-         * Inherit poses from the parent context,
-         */
-        let inherited = useContext(AnimationContext);
-        if (!inherit)
-            inherited = {};
-        const resolvedStyle = resolvePose(style, inherited.style, poses);
-        const resolvedInitial = resolvePose(initial, inherited.initial, poses);
-        const initialTarget = Object.assign(Object.assign({}, resolvedStyle), resolvedInitial);
-        const target = Object.assign(Object.assign({}, resolvedInitial), resolvedStyle);
-        const options = Object.assign(Object.assign({}, defaultOptions), resolvedStyle === null || resolvedStyle === void 0 ? void 0 : resolvedStyle.options);
-        /**
-         * If we haven't created a style prop for SSR yet (this is the initial render)
-         * make one. We provide this to React every render as beyond that with manage style
-         * via animations.
-         */
-        const styleProp = useRef(null);
-        styleProp.current || (styleProp.current = convertKeyframesToStyles(initialTarget));
-        /**
-         * Attach animation event handlers (gestures/exit/viewport appearance).
-         * This are called in reverse order of which styles should take priority when
-         * active, for example if there's a hover and press gesture active the press
-         * gesture will take precedence.
-         */
-        const hoverProps = useHover(target, options, props, inherited, isPoseActive);
-        const pressProps = usePress(target, options, props, inherited, isPoseActive);
-        useViewport(ref, target, options, props, inherited, isPoseActive);
-        const onExitComplete = useExit(target, options, props, inherited);
-        /**
-         * Compare our final calculated style target with the one from the previous render
-         * and trigger any necessary animations.
-         */
-        useAnimation(ref, initialTarget, target, options, onStart, (animation) => {
-            onComplete && onComplete(animation);
-            onExitComplete && onExitComplete();
-        });
-        const element = createElement(Component, Object.assign({}, forwardProps, hoverProps, pressProps, {
-            style: styleProp.current,
-            ref,
-        }));
-        /**
-         * Create a variant context to pass forward to child components.
-         */
-        const context = variantProps.reduce((acc, key) => {
-            acc[key] = undefined;
-            if (props[key]) {
-                if (typeof props[key] === "string" && isPoseActive[key]) {
-                    acc[key] = props[key];
-                }
-            }
-            else if (inherited[key]) {
-                acc[key] = inherited[key];
-            }
-            return acc;
-        }, {});
-        /**
-         * Memoize the context so we only trigger a re-render in children if the values
-         * within it change.
-         */
-        const memoizedContext = useMemo(() => context, Object.values(context));
-        return (React.createElement(AnimationContext.Provider, { value: memoizedContext }, element));
-    }
-    return forwardRef(Animated);
-}
-const variantProps = [
-    "initial",
-    "style",
-    "hover",
-    "press",
-    "inViewport",
-    "exit",
-];
-
-export { createAnimatedComponent };