animate-on-view/dist/react/index.d.ts

High-performance, zero-dependency animation library for React/Next.js and Svelte with TypeScript support

import * as React from 'react';
import React__default from 'react';

interface AnimationVariant {
    initial: React__default.CSSProperties;
    animate: React__default.CSSProperties;
    transition?: {
        duration?: number;
        delay?: number;
        easing?: string;
    };
}
type AnimationType = 'fadeIn' | 'fadeInUp' | 'fadeInDown' | 'fadeInLeft' | 'fadeInRight' | 'slideUp' | 'slideDown' | 'slideLeft' | 'slideRight' | 'scaleIn' | 'scaleOut' | 'scaleX' | 'scaleY' | 'rotateIn' | 'rotateInLeft' | 'rotateInRight' | 'flipX' | 'flipY' | 'zoomIn' | 'zoomInUp' | 'zoomInDown' | 'zoomInLeft' | 'zoomInRight' | 'bounceIn' | 'bounceInUp' | 'bounceInDown' | 'bounceInLeft' | 'bounceInRight' | 'elasticIn' | 'elasticInUp' | 'elasticInDown' | 'blurIn' | 'blurInUp' | 'skewIn' | 'skewInUp' | 'rollIn' | 'lightSpeedIn' | 'jackInTheBox' | 'gentle' | 'soft' | 'smooth' | 'dramatic' | 'explosive';
interface BaseAnimateProps {
    type?: AnimationType;
    variant?: AnimationVariant;
    threshold?: number;
    rootMargin?: string;
    triggerOnce?: boolean;
    duration?: number;
    delay?: number;
    easing?: string;
    className?: string;
    style?: React__default.CSSProperties;
    onInView?: () => void;
    onOutView?: () => void;
}
interface AnimateProps extends BaseAnimateProps {
    children: React__default.ReactNode;
}
interface AnimateElementProps extends BaseAnimateProps {
    children?: React__default.ReactNode;
}

declare const AnimateOnView: React__default.ForwardRefExoticComponent<AnimateProps & React__default.RefAttributes<HTMLDivElement>>;
declare const animate: {
    div: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLDivElement> & React__default.HTMLAttributes<HTMLDivElement>, "ref"> & React__default.RefAttributes<any>>;
    span: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLSpanElement> & React__default.HTMLAttributes<HTMLSpanElement>, "ref"> & React__default.RefAttributes<any>>;
    h1: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLHeadingElement> & React__default.HTMLAttributes<HTMLHeadingElement>, "ref"> & React__default.RefAttributes<any>>;
    h2: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLHeadingElement> & React__default.HTMLAttributes<HTMLHeadingElement>, "ref"> & React__default.RefAttributes<any>>;
    h3: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLHeadingElement> & React__default.HTMLAttributes<HTMLHeadingElement>, "ref"> & React__default.RefAttributes<any>>;
    h4: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLHeadingElement> & React__default.HTMLAttributes<HTMLHeadingElement>, "ref"> & React__default.RefAttributes<any>>;
    h5: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLHeadingElement> & React__default.HTMLAttributes<HTMLHeadingElement>, "ref"> & React__default.RefAttributes<any>>;
    h6: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLHeadingElement> & React__default.HTMLAttributes<HTMLHeadingElement>, "ref"> & React__default.RefAttributes<any>>;
    p: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLParagraphElement> & React__default.HTMLAttributes<HTMLParagraphElement>, "ref"> & React__default.RefAttributes<any>>;
    img: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLImageElement> & React__default.ImgHTMLAttributes<HTMLImageElement>, "ref"> & React__default.RefAttributes<any>>;
    section: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLElement> & React__default.HTMLAttributes<HTMLElement>, "ref"> & React__default.RefAttributes<any>>;
    article: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLElement> & React__default.HTMLAttributes<HTMLElement>, "ref"> & React__default.RefAttributes<any>>;
    aside: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLElement> & React__default.HTMLAttributes<HTMLElement>, "ref"> & React__default.RefAttributes<any>>;
    header: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLElement> & React__default.HTMLAttributes<HTMLElement>, "ref"> & React__default.RefAttributes<any>>;
    footer: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLElement> & React__default.HTMLAttributes<HTMLElement>, "ref"> & React__default.RefAttributes<any>>;
    main: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLElement> & React__default.HTMLAttributes<HTMLElement>, "ref"> & React__default.RefAttributes<any>>;
    nav: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLElement> & React__default.HTMLAttributes<HTMLElement>, "ref"> & React__default.RefAttributes<any>>;
    ul: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLUListElement> & React__default.HTMLAttributes<HTMLUListElement>, "ref"> & React__default.RefAttributes<any>>;
    ol: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLOListElement> & React__default.OlHTMLAttributes<HTMLOListElement>, "ref"> & React__default.RefAttributes<any>>;
    li: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLLIElement> & React__default.LiHTMLAttributes<HTMLLIElement>, "ref"> & React__default.RefAttributes<any>>;
    button: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLButtonElement> & React__default.ButtonHTMLAttributes<HTMLButtonElement>, "ref"> & React__default.RefAttributes<any>>;
    input: React__default.ForwardRefExoticComponent<Omit<BaseAnimateProps & React__default.ClassAttributes<HTMLInputElement> & React__default.InputHTMLAttributes<HTMLInputElement>, "ref"> & React__default.RefAttributes<any>>;
};

interface UseIntersectionObserverProps {
    threshold?: number;
    rootMargin?: string;
    triggerOnce?: boolean;
}
declare const useIntersectionObserver: ({ threshold, rootMargin, triggerOnce, }: UseIntersectionObserverProps) => {
    ref: React.RefObject<HTMLElement>;
    isInView: boolean;
};

declare const defaultVariants: Record<string, AnimationVariant>;

export { AnimateOnView, animate, defaultVariants, useIntersectionObserver };
export type { AnimateElementProps, AnimateProps, AnimationType, AnimationVariant, BaseAnimateProps };