motion 10.3.0 → 10.5.0-alpha.1

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 };

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

@@ -1,9 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-
-const AnimationContext = React.createContext({});
-
-exports.AnimationContext = AnimationContext;

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

@@ -1,5 +0,0 @@
-import { createContext } from 'react';
-
-const AnimationContext = createContext({});
-
-export { AnimationContext };

package/dist/targets/react/hooks/use-animation.cjs.js

@@ -1,47 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-var animateStyle = require('../../dom/animate-style.cjs.js');
-var noop = require('../../../utils/noop.cjs.js');
-var hasChanged = require('../utils/has-changed.cjs.js');
-var options = require('../../dom/utils/options.cjs.js');
-
-function useAnimation(ref, initial, target, options$1, onStart, onComplete) {
-    const prevTarget = React.useRef(initial);
-    React.useEffect(() => {
-        const targetKeyframe = {};
-        const allKeys = new Set([
-            ...Object.keys(target),
-            ...Object.keys(prevTarget.current),
-        ]);
-        allKeys.forEach((key) => {
-            let next = target[key];
-            if (!hasChanged.hasChanged(next, prevTarget.current[key]))
-                return;
-            /**
-             * TODO: If next is undefined, throw error or record a "base value"
-             * to animate back down to
-             */
-            targetKeyframe[key] = next;
-        });
-        if (Object.keys(targetKeyframe).length && ref.current) {
-            onStart === null || onStart === void 0 ? void 0 : onStart(targetKeyframe);
-            const animationFactories = [];
-            for (const key in targetKeyframe) {
-                const animation = animateStyle.animateStyle(ref.current, key, targetKeyframe[key], options.getOptions(options$1, key));
-                animationFactories.push(animation);
-            }
-            const animations = animationFactories
-                .map((factory) => factory())
-                .filter(Boolean);
-            Promise.all(animations.map((animation) => animation.finished))
-                .then(() => onComplete === null || onComplete === void 0 ? void 0 : onComplete(targetKeyframe))
-                .catch(noop.noop);
-        }
-        prevTarget.current = target;
-    });
-}
-
-exports.useAnimation = useAnimation;

package/dist/targets/react/hooks/use-animation.es.js

@@ -1,43 +0,0 @@
-import { useRef, useEffect } from 'react';
-import { animateStyle } from '../../dom/animate-style.es.js';
-import { noop } from '../../../utils/noop.es.js';
-import { hasChanged } from '../utils/has-changed.es.js';
-import { getOptions } from '../../dom/utils/options.es.js';
-
-function useAnimation(ref, initial, target, options, onStart, onComplete) {
-    const prevTarget = useRef(initial);
-    useEffect(() => {
-        const targetKeyframe = {};
-        const allKeys = new Set([
-            ...Object.keys(target),
-            ...Object.keys(prevTarget.current),
-        ]);
-        allKeys.forEach((key) => {
-            let next = target[key];
-            if (!hasChanged(next, prevTarget.current[key]))
-                return;
-            /**
-             * TODO: If next is undefined, throw error or record a "base value"
-             * to animate back down to
-             */
-            targetKeyframe[key] = next;
-        });
-        if (Object.keys(targetKeyframe).length && ref.current) {
-            onStart === null || onStart === void 0 ? void 0 : onStart(targetKeyframe);
-            const animationFactories = [];
-            for (const key in targetKeyframe) {
-                const animation = animateStyle(ref.current, key, targetKeyframe[key], getOptions(options, key));
-                animationFactories.push(animation);
-            }
-            const animations = animationFactories
-                .map((factory) => factory())
-                .filter(Boolean);
-            Promise.all(animations.map((animation) => animation.finished))
-                .then(() => onComplete === null || onComplete === void 0 ? void 0 : onComplete(targetKeyframe))
-                .catch(noop);
-        }
-        prevTarget.current = target;
-    });
-}
-
-export { useAnimation };

package/dist/targets/react/hooks/use-exit.cjs.js

@@ -1,27 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var framerMotion = require('framer-motion');
-var React = require('react');
-var poses = require('../utils/poses.cjs.js');
-var updateTarget = require('../utils/update-target.cjs.js');
-
-function useExit(target, options, { exit, poses: poses$1 }, { exit: inheritedExit }) {
-    const [isPresent, onExitComplete] = framerMotion.usePresence();
-    /**
-     * In case we don't have an exit animation defined we still need to
-     * call onExitComplete if it exits so AnimatePresence knows it
-     * can remove this component.
-     */
-    React.useEffect(() => {
-        if (!exit)
-            onExitComplete === null || onExitComplete === void 0 ? void 0 : onExitComplete();
-    }, [isPresent]);
-    if (exit && !isPresent) {
-        updateTarget.updateTargetAndOptions(target, options, poses.resolvePose(exit, inheritedExit, poses$1));
-        return onExitComplete;
-    }
-}
-
-exports.useExit = useExit;

package/dist/targets/react/hooks/use-exit.es.js

@@ -1,23 +0,0 @@
-import { usePresence } from 'framer-motion';
-import { useEffect } from 'react';
-import { resolvePose } from '../utils/poses.es.js';
-import { updateTargetAndOptions } from '../utils/update-target.es.js';
-
-function useExit(target, options, { exit, poses }, { exit: inheritedExit }) {
-    const [isPresent, onExitComplete] = usePresence();
-    /**
-     * In case we don't have an exit animation defined we still need to
-     * call onExitComplete if it exits so AnimatePresence knows it
-     * can remove this component.
-     */
-    useEffect(() => {
-        if (!exit)
-            onExitComplete === null || onExitComplete === void 0 ? void 0 : onExitComplete();
-    }, [isPresent]);
-    if (exit && !isPresent) {
-        updateTargetAndOptions(target, options, resolvePose(exit, inheritedExit, poses));
-        return onExitComplete;
-    }
-}
-
-export { useExit };

package/dist/targets/react/hooks/use-gesture-state.cjs.js

@@ -1,17 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-var poses = require('../utils/poses.cjs.js');
-var updateTarget = require('../utils/update-target.cjs.js');
-
-function useGestureState(target, options, stylesToApply, inheritedPose, poses$1) {
-    const [isGestureActive, setGestureState] = React.useState(false);
-    if (isGestureActive || inheritedPose) {
-        updateTarget.updateTargetAndOptions(target, options, poses.resolvePose(stylesToApply, inheritedPose, poses$1));
-    }
-    return [isGestureActive || Boolean(inheritedPose), setGestureState];
-}
-
-exports.useGestureState = useGestureState;

package/dist/targets/react/hooks/use-gesture-state.es.js

@@ -1,13 +0,0 @@
-import { useState } from 'react';
-import { resolvePose } from '../utils/poses.es.js';
-import { updateTargetAndOptions } from '../utils/update-target.es.js';
-
-function useGestureState(target, options, stylesToApply, inheritedPose, poses) {
-    const [isGestureActive, setGestureState] = useState(false);
-    if (isGestureActive || inheritedPose) {
-        updateTargetAndOptions(target, options, resolvePose(stylesToApply, inheritedPose, poses));
-    }
-    return [isGestureActive || Boolean(inheritedPose), setGestureState];
-}
-
-export { useGestureState };

package/dist/targets/react/hooks/use-hover.cjs.js

@@ -1,24 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var useGestureState = require('./use-gesture-state.cjs.js');
-
-function useHover(target, options, { hover, onPointerEnter, onPointerLeave, poses, } = {}, { hover: inheritedHover }, isPoseActive) {
-    const [isHoverActive, setHoverState] = useGestureState.useGestureState(target, options, hover, inheritedHover, poses);
-    isPoseActive.hover = isHoverActive;
-    return hover
-        ? {
-            onPointerEnter: (e) => {
-                onPointerEnter === null || onPointerEnter === void 0 ? void 0 : onPointerEnter(e);
-                setHoverState(true);
-            },
-            onPointerLeave: (e) => {
-                onPointerLeave === null || onPointerLeave === void 0 ? void 0 : onPointerLeave(e);
-                setHoverState(false);
-            },
-        }
-        : {};
-}
-
-exports.useHover = useHover;

package/dist/targets/react/hooks/use-hover.es.js

@@ -1,20 +0,0 @@
-import { useGestureState } from './use-gesture-state.es.js';
-
-function useHover(target, options, { hover, onPointerEnter, onPointerLeave, poses, } = {}, { hover: inheritedHover }, isPoseActive) {
-    const [isHoverActive, setHoverState] = useGestureState(target, options, hover, inheritedHover, poses);
-    isPoseActive.hover = isHoverActive;
-    return hover
-        ? {
-            onPointerEnter: (e) => {
-                onPointerEnter === null || onPointerEnter === void 0 ? void 0 : onPointerEnter(e);
-                setHoverState(true);
-            },
-            onPointerLeave: (e) => {
-                onPointerLeave === null || onPointerLeave === void 0 ? void 0 : onPointerLeave(e);
-                setHoverState(false);
-            },
-        }
-        : {};
-}
-
-export { useHover };

package/dist/targets/react/hooks/use-press.cjs.js

@@ -1,25 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var useGestureState = require('./use-gesture-state.cjs.js');
-
-function usePress(target, options, { press, onPointerDown, poses } = {}, { press: inheritedPress }, isPoseActive) {
-    const [isPressActive, setPressState] = useGestureState.useGestureState(target, options, press, inheritedPress, poses);
-    isPoseActive.press = isPressActive;
-    if (!press)
-        return {};
-    const onPointerUp = () => {
-        setPressState(false);
-        window.removeEventListener("pointerup", onPointerUp);
-    };
-    return {
-        onPointerDown: (e) => {
-            onPointerDown === null || onPointerDown === void 0 ? void 0 : onPointerDown(e);
-            setPressState(true);
-            window.addEventListener("pointerup", onPointerUp);
-        },
-    };
-}
-
-exports.usePress = usePress;

package/dist/targets/react/hooks/use-press.es.js

@@ -1,21 +0,0 @@
-import { useGestureState } from './use-gesture-state.es.js';
-
-function usePress(target, options, { press, onPointerDown, poses } = {}, { press: inheritedPress }, isPoseActive) {
-    const [isPressActive, setPressState] = useGestureState(target, options, press, inheritedPress, poses);
-    isPoseActive.press = isPressActive;
-    if (!press)
-        return {};
-    const onPointerUp = () => {
-        setPressState(false);
-        window.removeEventListener("pointerup", onPointerUp);
-    };
-    return {
-        onPointerDown: (e) => {
-            onPointerDown === null || onPointerDown === void 0 ? void 0 : onPointerDown(e);
-            setPressState(true);
-            window.addEventListener("pointerup", onPointerUp);
-        },
-    };
-}
-
-export { usePress };

package/dist/targets/react/hooks/use-viewport.cjs.js

@@ -1,37 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-var useGestureState = require('./use-gesture-state.cjs.js');
-
-function useViewport(ref, target, options, { inViewport, poses, viewport = {}, onViewportEnter, onViewportLeave, }, { inViewport: inheritedInViewport }, isPoseActive) {
-    const { root, margin: rootMargin, once, threshold } = viewport;
-    const [isInViewport, setViewportState] = useGestureState.useGestureState(target, options, inViewport, inheritedInViewport, poses);
-    isPoseActive.inViewport = isInViewport;
-    let shouldObserve = !!inViewport || !!onViewportEnter || !!onViewportLeave;
-    if (once && isInViewport)
-        shouldObserve = false;
-    React.useEffect(() => {
-        if (!shouldObserve || typeof IntersectionObserver === "undefined")
-            return;
-        const observer = new IntersectionObserver(([entry]) => {
-            setViewportState(entry.isIntersecting);
-            const callback = entry.isIntersecting
-                ? onViewportEnter
-                : onViewportLeave;
-            callback && callback(entry);
-        }, { root: root === null || root === void 0 ? void 0 : root.current, rootMargin, threshold });
-        observer.observe(ref.current);
-        return () => observer.disconnect();
-    }, [
-        inViewport,
-        onViewportEnter,
-        onViewportLeave,
-        root,
-        rootMargin,
-        threshold,
-    ]);
-}
-
-exports.useViewport = useViewport;

package/dist/targets/react/hooks/use-viewport.es.js

@@ -1,33 +0,0 @@
-import { useEffect } from 'react';
-import { useGestureState } from './use-gesture-state.es.js';
-
-function useViewport(ref, target, options, { inViewport, poses, viewport = {}, onViewportEnter, onViewportLeave, }, { inViewport: inheritedInViewport }, isPoseActive) {
-    const { root, margin: rootMargin, once, threshold } = viewport;
-    const [isInViewport, setViewportState] = useGestureState(target, options, inViewport, inheritedInViewport, poses);
-    isPoseActive.inViewport = isInViewport;
-    let shouldObserve = !!inViewport || !!onViewportEnter || !!onViewportLeave;
-    if (once && isInViewport)
-        shouldObserve = false;
-    useEffect(() => {
-        if (!shouldObserve || typeof IntersectionObserver === "undefined")
-            return;
-        const observer = new IntersectionObserver(([entry]) => {
-            setViewportState(entry.isIntersecting);
-            const callback = entry.isIntersecting
-                ? onViewportEnter
-                : onViewportLeave;
-            callback && callback(entry);
-        }, { root: root === null || root === void 0 ? void 0 : root.current, rootMargin, threshold });
-        observer.observe(ref.current);
-        return () => observer.disconnect();
-    }, [
-        inViewport,
-        onViewportEnter,
-        onViewportLeave,
-        root,
-        rootMargin,
-        threshold,
-    ]);
-}
-
-export { useViewport };