@progress/kendo-react-animation 13.3.0-develop.9 → 13.4.0-develop.1

package/index.d.ts

@@ -5,760 +5,13 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { AnimationsClassStructure } from '@progress/kendo-react-common';
-import { default as default_2 } from 'prop-types';
-import { JSX } from 'react/jsx-runtime';
-import * as React_2 from 'react';
-
-declare const Animation_2: {
-    (props: AnimationProps): JSX.Element;
-    propTypes: {
-        children: default_2.Requireable<NonNullable<default_2.ReactNodeLike>>;
-        childFactory: default_2.Requireable<any>;
-        className: default_2.Requireable<string>;
-        component: default_2.Requireable<default_2.ReactNodeLike>;
-        id: default_2.Requireable<string>;
-        style: default_2.Requireable<any>;
-        transitionName: default_2.Validator<string>;
-        appear: default_2.Validator<boolean>;
-        enter: default_2.Validator<boolean>;
-        exit: default_2.Validator<boolean>;
-        transitionEnterDuration: default_2.Validator<number>;
-        transitionExitDuration: default_2.Validator<number>;
-    };
-};
-export { Animation_2 as Animation }
-
-export declare const AnimationChild: React_2.ForwardRefExoticComponent<AnimationChildProps & React_2.RefAttributes<AnimationChildHandle | null>>;
-
-/**
- * Represents the AnimationChild handle.
- */
-export declare interface AnimationChildHandle {
-    /**
-     * Gets the element.
-     */
-    element: HTMLDivElement | null;
-    /**
-     * Gets the props.
-     */
-    props: AnimationChildProps;
-}
-
-/**
- * Represents the props of the child Animation elements.
- */
-export declare interface AnimationChildProps extends AnimationInterface {
-    /**
-     * Controlled by `TransitionGroup` if present. Otherwise, sets the state of the enter or exit animations.
-     */
-    in?: boolean;
-    /**
-     * Custom inline styles to apply to the Animation container.
-     *
-     * @example
-     * <AnimationChild style={{ backgroundColor: "red" }} />
-     */
-    style?: any;
-    /**
-     * Custom CSS class to apply to the Animation container.
-     *
-     * @example
-     * <AnimationChild className="custom-animation-class" />
-     */
-    className?: string;
-    /**
-     * Specifies the base class name for the transition. This class generates
-     * the `appear`, `enter`, and `exit` transition classes.
-     *
-     * @example
-     * <AnimationChild transitionName="fade" />
-     */
-    transitionName: string;
-    /**
-     * Specifies the style that applies when the Animation reaches its entering state.
-     *
-     * @example
-     * <AnimationChild animationEnteringStyle={{ opacity: 0.5 }} />
-     */
-    animationEnteringStyle?: any;
-    /**
-     * Inline styles that apply when the Animation has entered.
-     *
-     * @example
-     * <AnimationChild animationEnteredStyle={{ opacity: 1 }} />
-     */
-    animationEnteredStyle?: any;
-    /**
-     * Specifies the style that applies when the Animation reaches its exiting state.
-     *
-     * @example
-     * <AnimationChild animationExitingStyle={{ opacity: 0.5 }} />
-     */
-    animationExitingStyle?: any;
-    /**
-     * Inline styles that apply when the Animation has exited.
-     *
-     * @example
-     * <AnimationChild animationExitedStyle={{ opacity: 0 }} />
-     */
-    animationExitedStyle?: any;
-    /**
-     * Provides unstyled options for the Animation. Accepts an object
-     * that implements the `AnimationsClassStructure` interface.
-     *
-     * @example
-     * <AnimationChild unstyled={{ appear: "custom-appear-class" }} />
-     */
-    unstyled?: AnimationsClassStructure;
-}
-
-/** @hidden */
-declare type AnimationConfig = {
-    initial?: React_2.CSSProperties;
-    duration?: number;
-    appear?: boolean;
-    onStart?: any;
-    onUpdate?: any;
-    onEnd?: any;
-};
-
-/**
- * The arguments that are passed to the life-cycle hooks.
- */
-declare interface AnimationEventArguments {
-    /**
-     * The element that is currently being animated.
-     */
-    animatedElement: HTMLElement;
-    /**
-     * The AnimationChild component which controls the animation.
-     */
-    target: AnimationChildHandle;
-}
-
-/**
- * Inherited by all animations. Represents the properties you can set to an Animation.
- */
-declare interface AnimationInterface {
-    /**
-     * @hidden
-     */
-    children?: React.ReactNode;
-    /**
-     * Specifies the CSS class names that are set to each of the animated children elements.
-     */
-    componentChildClassName?: string;
-    /**
-     * Specifies the styles that are set to each of the animated children elements.
-     */
-    componentChildStyle?: any;
-    /**
-     * Called when you add a component to an existing Animation component and the Animation has not started yet ([more information and example](https://www.telerik.com/kendo-react-ui/components/animation/hooks#toc-adding-child-elements)).
-     */
-    onEnter?: (event: AnimationEventArguments) => void;
-    /**
-     * Called when you add a component to an existing Animation component and the Animation is now happening ([more information and example](https://www.telerik.com/kendo-react-ui/components/animation/hooks#toc-adding-child-elements)).
-     */
-    onEntering?: (event: AnimationEventArguments) => void;
-    /**
-     * Called when you add a component to an existing Animation component and the Animation is now finished ([more information and example](https://www.telerik.com/kendo-react-ui/components/animation/hooks#toc-adding-child-elements)).
-     */
-    onEntered?: (event: AnimationEventArguments) => void;
-    /**
-     * An event called after the Animation has reached its exit state ([more information and example](https://www.telerik.com/kendo-react-ui/components/animation/hooks#toc-removing-child-elements)).
-     */
-    onExit?: (event: AnimationEventArguments) => void;
-    /**
-     * An event called after the Animation has reached its exiting state ([more information and example](https://www.telerik.com/kendo-react-ui/components/animation/hooks#toc-removing-child-elements)).
-     */
-    onExiting?: (event: AnimationEventArguments) => void;
-    /**
-     * An event called after the Animation has reached its exited state ([more information and example](https://www.telerik.com/kendo-react-ui/components/animation/hooks#toc-removing-child-elements)).
-     */
-    onExited?: (event: AnimationEventArguments) => void;
-    /**
-     * @hidden
-     * This event is always triggered in contrast to `onExited` which TransitionGroup prevents when target element is not removed from DOM.
-     */
-    onAfterExited?: (event: AnimationEventArguments) => void;
-    /**
-     * Defines whether a transition should happen on the first mount.
-     *
-     * @default false
-     */
-    appear?: boolean;
-    /**
-     * Specifies whether to animate the entering (showing) element ([see example](https://www.telerik.com/kendo-react-ui/components/animation/disabled-state)).
-     *
-     * @default true
-     */
-    enter?: boolean;
-    /**
-     * Specifies whether to animate a leaving (disappearing) element ([see example](https://www.telerik.com/kendo-react-ui/components/animation/disabled-state)).
-     *
-     * @default true
-     */
-    exit?: boolean;
-    /**
-     * Specifies the duration of the transition for the entering (`animation in`) Animation ([see example](https://www.telerik.com/kendo-react-ui/components/animation/duration)). After the time runs out, the Animation is terminated.
-     *
-     * @default 300
-     */
-    transitionEnterDuration?: number;
-    /**
-     * Specifies the duration of the transition for the exiting (`animation out`) Animation ([see example](https://www.telerik.com/kendo-react-ui/components/animation/duration)). After the time runs out, the Animation is terminated.
-     *
-     * @default 300
-     */
-    transitionExitDuration?: number;
-    /**
-     * Specifies if the Animation uses lazy-mounting on the first `in={true}`.
-     *
-     * @default false
-     */
-    mountOnEnter?: boolean;
-    /**
-     * Specifies if the Animation unmounts after it reaches its exited state.
-     *
-     * @default false
-     */
-    unmountOnExit?: boolean;
-}
-
-/**
- * Represents the props of the [KendoReact Animation component](https://www.telerik.com/kendo-react-ui/components/animation).
- */
-export declare interface AnimationProps extends AnimationInterface {
-    /**
-     * A function for customizing the rendering of child elements.
-     *
-     * @example
-     * <Animation childFactory={(child) => React.cloneElement(child, { ariaHidden: true })} />
-     */
-    childFactory?: any;
-    /**
-     * Specifies the CSS class names to be applied to the Animation container.
-     *
-     * @example
-     * <Animation className="animation-container" />
-     */
-    className?: string;
-    /**
-     * Specifies the HTML tag of the parent Animation container.
-     *
-     * @default "div"
-     * @example
-     * <Animation component="main" />
-     */
-    component?: React_2.ReactNode;
-    /**
-     * Specifies the `id` attribute of the Animation container.
-     *
-     * @example
-     * <Animation id="animation-container" />
-     */
-    id?: string;
-    /**
-     * Specifies the inline styles to be applied to the Animation container.
-     *
-     * @example
-     * <Animation style={{ width: "100%" }} />
-     */
-    style?: any;
-    /**
-     * Determines whether child elements will stack on top of each other during the animation.
-     *
-     * @example
-     * <Animation stackChildren={true} />
-     */
-    stackChildren?: boolean;
-    /**
-     * Specifies the base class name for the transition.
-     *
-     * @example
-     * <Animation transitionName="fade" />
-     */
-    transitionName: string;
-    /**
-     * Specifies the inline styles applied when the Animation is entering.
-     *
-     * @example
-     * <Animation animationEnteringStyle={{ opacity: 0.5 }} />
-     */
-    animationEnteringStyle?: any;
-    /**
-     * Specifies the inline styles applied when the Animation has entered.
-     *
-     * @example
-     * <Animation animationEnteredStyle={{ opacity: 1 }} />
-     */
-    animationEnteredStyle?: any;
-    /**
-     * Specifies the inline styles applied when the Animation is exiting.
-     *
-     * @example
-     * <Animation animationExitingStyle={{ opacity: 0.5 }} />
-     */
-    animationExitingStyle?: any;
-    /**
-     * Specifies the inline styles applied when the Animation has exited.
-     *
-     * @example
-     * <Animation animationExitedStyle={{ opacity: 0 }} />
-     */
-    animationExitedStyle?: any;
-    /**
-     * Provides unstyled options for the Animation.
-     *
-     * @example
-     * <Animation unstyled={{ appear: "unstyled-appear" }} />
-     */
-    unstyled?: AnimationsClassStructure;
-}
-
-export declare const Expand: {
-    (props: ExpandProps): JSX.Element;
-    propTypes: {
-        children: default_2.Requireable<NonNullable<default_2.ReactNodeLike>>;
-        childFactory: default_2.Requireable<any>;
-        className: default_2.Requireable<string>;
-        direction: default_2.Requireable<string>;
-        component: default_2.Requireable<default_2.ReactNodeLike>;
-        id: default_2.Requireable<string>;
-        style: default_2.Requireable<any>;
-    };
-};
-
-/**
- * Specifies the direction of the Expand Animation ([see example](https://www.telerik.com/kendo-react-ui/components/animation/direction#toc-expand)).
- *
- * The supported directions are:
- * * (Default) `vertical`&mdash;Expands the content from center to top and bottom, and vice-versa.
- * * `horizontal`&mdash;Expands the content from center to left and right, and vice-versa.
- */
-export declare type ExpandDirection = 'horizontal' | 'vertical';
-
-/**
- * Represents the props of the [KendoReact Expand Animation component](https://www.telerik.com/kendo-react-ui/components/animation/types#toc-expand).
- */
-export declare interface ExpandProps extends AnimationInterface {
-    /**
-     * A function for customizing the rendering of child elements.
-     *
-     * @example
-     * <Expand childFactory={(child) => React.cloneElement(child, { role: "button" })} />
-     */
-    childFactory?: any;
-    /**
-     * Specifies the CSS class names to be applied to the Animation container.
-     *
-     * @example
-     * <Expand className="expand-animation" />
-     */
-    className?: string;
-    /**
-     * Specifies the direction of the Expand Animation.
-     *
-     * @default "vertical"
-     * @example
-     * <Expand direction="horizontal" />
-     */
-    direction?: ExpandDirection;
-    /**
-     * Specifies the HTML tag of the parent Animation container.
-     *
-     * @default "div"
-     * @example
-     * <Expand component="nav" />
-     */
-    component?: React_2.ReactNode;
-    /**
-     * Specifies the `id` attribute of the Animation container.
-     *
-     * @example
-     * <Expand id="expand-animation-container" />
-     */
-    id?: string;
-    /**
-     * Specifies the inline styles to be applied to the Animation container.
-     *
-     * @example
-     * <Expand style={{ display: "flex" }} />
-     */
-    style?: any;
-}
-
-export declare const Fade: {
-    (props: FadeProps): JSX.Element;
-    propTypes: {
-        children: default_2.Requireable<NonNullable<default_2.ReactNodeLike>>;
-        childFactory: default_2.Requireable<any>;
-        className: default_2.Requireable<string>;
-        component: default_2.Requireable<default_2.ReactNodeLike>;
-        id: default_2.Requireable<string>;
-        style: default_2.Requireable<any>;
-    };
-};
-
-/**
- * Represents the props of the [KendoReact Fade Animation component](https://www.telerik.com/kendo-react-ui/components/animation/types#toc-fade).
- */
-export declare interface FadeProps extends AnimationInterface {
-    /**
-     * A function for customizing the rendering of child elements.
-     *
-     * @example
-     * <Fade childFactory={(child) => React.cloneElement(child, { draggable: true })} />
-     */
-    childFactory?: any;
-    /**
-     * Specifies the CSS class names to be applied to the Animation container.
-     *
-     * @example
-     * <Fade className="fade-animation" />
-     */
-    className?: string;
-    /**
-     * Specifies the HTML tag of the parent Animation container.
-     *
-     * @default "div"
-     * @example
-     * <Fade component="header" />
-     */
-    component?: React_2.ReactNode;
-    /**
-     * Specifies the `id` attribute of the Animation container.
-     *
-     * @example
-     * <Fade id="fade-animation-container" />
-     */
-    id?: string;
-    /**
-     * Specifies the inline styles to be applied to the Animation container.
-     *
-     * @example
-     * <Fade style={{ color: "blue" }} />
-     */
-    style?: any;
-}
-
-export declare const Push: {
-    (props: PushProps): JSX.Element;
-    propTypes: {
-        children: default_2.Requireable<NonNullable<default_2.ReactNodeLike>>;
-        childFactory: default_2.Requireable<any>;
-        className: default_2.Requireable<string>;
-        direction: default_2.Requireable<string>;
-        component: default_2.Requireable<default_2.ReactNodeLike>;
-        id: default_2.Requireable<string>;
-        style: default_2.Requireable<any>;
-        stackChildren: default_2.Requireable<boolean>;
-    };
-};
-
-/**
- * Specifies the direction of the Push Animation ([see example](https://www.telerik.com/kendo-react-ui/components/animation/direction#toc-push)).
- *
- * The supported directions are:
- * * (Default) `right`&mdash;Pushes the content from left to right.
- * * `up`&mdash;Pushes the content from bottom to top.
- * * `down`&mdash;Pushes the content from top to bottom.
- * * `left`&mdash;Pushes the content from right to left.
- */
-export declare type PushDirection = 'up' | 'down' | 'left' | 'right';
-
-/**
- * Represents the props of the [KendoReact Push Animation component](https://www.telerik.com/kendo-react-ui/components/animation/types#toc-push).
- */
-export declare interface PushProps extends AnimationInterface {
-    /**
-     * A function for customizing the rendering of child elements.
-     *
-     * @example
-     * <Push childFactory={(child) => React.cloneElement(child, { tabIndex: 0 })} />
-     */
-    childFactory?: any;
-    /**
-     * Specifies the CSS class names to be applied to the Animation container.
-     *
-     * @example
-     * <Push className="push-animation" />
-     */
-    className?: string;
-    /**
-     * Specifies the direction of the Push Animation.
-     *
-     * @default "right"
-     * @example
-     * <Push direction="up" />
-     */
-    direction?: PushDirection;
-    /**
-     * Specifies the HTML tag of the parent Animation container.
-     *
-     * @default "div"
-     * @example
-     * <Push component="footer" />
-     */
-    component?: React_2.ReactNode;
-    /**
-     * Specifies the `id` attribute of the Animation container.
-     *
-     * @example
-     * <Push id="push-animation-container" />
-     */
-    id?: string;
-    /**
-     * Specifies the inline styles to be applied to the Animation container.
-     *
-     * @example
-     * <Push style={{ border: "1px solid black" }} />
-     */
-    style?: any;
-    /**
-     * Determines whether child elements will stack on top of each other during the animation.
-     *
-     * @default false
-     * @example
-     * <Push stackChildren={true} />
-     */
-    stackChildren?: boolean;
-}
-
-export declare const Reveal: {
-    (props: RevealProps): JSX.Element;
-    propTypes: {
-        children: default_2.Requireable<NonNullable<default_2.ReactNodeLike>>;
-        childFactory: default_2.Requireable<any>;
-        className: default_2.Requireable<string>;
-        direction: default_2.Requireable<string>;
-        component: default_2.Requireable<default_2.ReactNodeLike>;
-        id: default_2.Requireable<string>;
-        style: default_2.Requireable<any>;
-    };
-};
-
-/**
- * Specifies the direction of the Reveal Animation ([see example](https://www.telerik.com/kendo-react-ui/components/animation/direction#toc-reveal)).
- *
- * The supported directions are:
- * * (Default) `vertical`&mdash;Reveals the height of the content.
- * * `horizontal`&mdash;Reveals the width of the content.
- */
-export declare type RevealDirection = 'horizontal' | 'vertical';
-
-/**
- * Represents the props of the [KendoReact Reveal Animation component](https://www.telerik.com/kendo-react-ui/components/animation/types#toc-reveal).
- */
-export declare interface RevealProps extends AnimationInterface {
-    /**
-     * A function for customizing the rendering of child elements.
-     *
-     * @example
-     * <Reveal childFactory={(child) => React.cloneElement(child, { hidden: true })} />
-     */
-    childFactory?: any;
-    /**
-     * Specifies the CSS class names to be applied to the Animation container.
-     *
-     * @example
-     * <Reveal className="reveal-animation" />
-     */
-    className?: string;
-    /**
-     * Specifies the direction of the Reveal Animation.
-     *
-     * @default "vertical"
-     * @example
-     * <Reveal direction="horizontal" />
-     */
-    direction?: RevealDirection;
-    /**
-     * Specifies the HTML tag of the parent Animation container.
-     *
-     * @default "div"
-     * @example
-     * <Reveal component="aside" />
-     */
-    component?: React_2.ReactNode;
-    /**
-     * Specifies the `id` attribute of the Animation container.
-     *
-     * @example
-     * <Reveal id="reveal-animation-container" />
-     */
-    id?: string;
-    /**
-     * Specifies the inline styles to be applied to the Animation container.
-     *
-     * @example
-     * <Reveal style={{ padding: "20px" }} />
-     */
-    style?: any;
-    /**
-     * @hidden
-     * This is synchronious variant of `onEnter` event.
-     */
-    onBeforeEnter?: (event: AnimationEventArguments) => void;
-}
-
-export declare const Slide: {
-    (props: SlideProps): JSX.Element;
-    propTypes: {
-        children: default_2.Requireable<NonNullable<default_2.ReactNodeLike>>;
-        childFactory: default_2.Requireable<any>;
-        className: default_2.Requireable<string>;
-        direction: default_2.Requireable<string>;
-        component: default_2.Requireable<default_2.ReactNodeLike>;
-        id: default_2.Requireable<string>;
-        style: default_2.Requireable<any>;
-    };
-};
-
-/**
- * Specifies the direction of the Slide Animation ([see example](https://www.telerik.com/kendo-react-ui/components/animation/direction#toc-slide)).
- *
- * The supported directions are:
- * * (Default) `down`&mdash;On showing, slides the content from top to bottom, and vice-versa.
- * * `up`&mdash;On showing, slides the content from bottom to top, and vice-versa.
- * * `left`&mdash;On showing, slides the content from right to left, and vice-versa.
- * * `right`&mdash;On showing, slides the content from left to right, and vice-versa.
- */
-export declare type SlideDirection = 'up' | 'down' | 'left' | 'right';
-
-/**
- * Represents the props of the [KendoReact Slide Animation component](https://www.telerik.com/kendo-react-ui/components/animation/types#toc-slide).
- */
-export declare interface SlideProps extends AnimationInterface {
-    /**
-     * A function for customizing the rendering of child elements.
-     *
-     * @example
-     * <Slide childFactory={(child) => React.cloneElement(child, { style: { opacity: 0.5 } })} />
-     */
-    childFactory?: any;
-    /**
-     * Specifies the CSS class names to be applied to the Animation container.
-     *
-     * @example
-     * <Slide className="slide-animation" />
-     */
-    className?: string;
-    /**
-     * Specifies the direction of the Slide Animation.
-     *
-     * @default "down"
-     * @example
-     * <Slide direction="left" />
-     */
-    direction?: SlideDirection;
-    /**
-     * Specifies the HTML tag of the parent Animation container.
-     *
-     * @default "div"
-     * @example
-     * <Slide component="article" />
-     */
-    component?: React_2.ReactNode;
-    /**
-     * Specifies the `id` attribute of the Animation container.
-     *
-     * @example
-     * <Slide id="slide-animation-container" />
-     */
-    id?: string;
-    /**
-     * Specifies the inline styles to be applied to the Animation container.
-     *
-     * @example
-     * <Slide style={{ margin: "10px" }} />
-     */
-    style?: any;
-}
-
-/** @hidden */
-export declare const useAnimation: (config: AnimationConfig, deps: any[]) => void;
-
-export declare const Zoom: {
-    (props: ZoomProps): JSX.Element;
-    propTypes: {
-        children: default_2.Requireable<NonNullable<default_2.ReactNodeLike>>;
-        childFactory: default_2.Requireable<any>;
-        className: default_2.Requireable<string>;
-        direction: default_2.Requireable<string>;
-        component: default_2.Requireable<default_2.ReactNodeLike>;
-        id: default_2.Requireable<string>;
-        style: default_2.Requireable<any>;
-        stackChildren: default_2.Requireable<boolean>;
-    };
-};
-
-/**
- * Specifies the direction of the Zoom Animation ([see example](https://www.telerik.com/kendo-react-ui/components/animation/direction#toc-zoom)).
- *
- * The supported directions are:
- * * (Default) `out`&mdash;Zooms the content from the outside to the inside.
- * * `in`&mdash;Zooms the content from the inside to the outside.
- */
-export declare type ZoomDirection = 'in' | 'out';
-
-/**
- * Represents the props of the [KendoReact Zoom Animation component](https://www.telerik.com/kendo-react-ui/components/animation/types#toc-zoom).
- */
-export declare interface ZoomProps extends AnimationInterface {
-    /**
-     * A function for customizing the rendering of child elements.
-     *
-     * @example
-     * <Zoom childFactory={(child) => React.cloneElement(child, { className: 'custom-class' })} />
-     */
-    childFactory?: any;
-    /**
-     * Specifies the CSS class names to be applied to the Animation container.
-     *
-     * @example
-     * <Zoom className="zoom-animation" />
-     */
-    className?: string;
-    /**
-     * Specifies the direction of the Zoom Animation.
-     *
-     * @default "out"
-     * @example
-     * <Zoom direction="in" />
-     */
-    direction?: ZoomDirection;
-    /**
-     * Specifies the HTML tag of the parent Animation container.
-     *
-     * @default "div"
-     * @example
-     * <Zoom component="section" />
-     */
-    component?: React_2.ReactNode;
-    /**
-     * Specifies the `id` attribute of the Animation container.
-     *
-     * @example
-     * <Zoom id="zoom-animation-container" />
-     */
-    id?: string;
-    /**
-     * Specifies the inline styles to be applied to the Animation container.
-     *
-     * @example
-     * <Zoom style={{ backgroundColor: "red" }} />
-     */
-    style?: any;
-    /**
-     * Determines whether child elements will stack on top of each other during the animation.
-     *
-     * @default false
-     * @example
-     * <Zoom stackChildren={true} />
-     */
-    stackChildren?: boolean;
-}
-
-export { }
+import { Animation, AnimationProps } from './Animation.js';
+import { AnimationChild, AnimationChildHandle, AnimationChildProps } from './AnimationChild.js';
+import { Fade, FadeProps } from './Fade.js';
+import { Expand, ExpandDirection, ExpandProps } from './Expand.js';
+import { Push, PushDirection, PushProps } from './Push.js';
+import { Slide, SlideDirection, SlideProps } from './Slide.js';
+import { Zoom, ZoomDirection, ZoomProps } from './Zoom.js';
+import { Reveal, RevealDirection, RevealProps } from './Reveal.js';
+import { useAnimation } from './hooks/useAnimation.js';
+export { Animation, AnimationProps, AnimationChild, AnimationChildHandle, AnimationChildProps, Fade, FadeProps, Expand, ExpandProps, ExpandDirection, Push, PushProps, PushDirection, Slide, SlideProps, SlideDirection, Zoom, ZoomProps, ZoomDirection, Reveal, RevealProps, RevealDirection, useAnimation };