@progress/kendo-vue-animation/index.d.mts

Kendo UI for Vue Animation package

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2025 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
import { ComponentOptionsMixin } from 'vue';
import { ComponentProvideOptions } from 'vue';
import { DefineComponent } from 'vue';
import { ExtractPropTypes } from 'vue';
import { PropType } from 'vue';
import { PublicProps } from 'vue';
import { Ref } from 'vue';

/**
 * @hidden
 */
export declare const animate: (transition: any, offset?: number, animationFrame?: number) => number;

/**
 * @hidden
 */
declare const Animation_2: DefineComponent<ExtractPropTypes<    {
componentChildStyle: ObjectConstructor;
childFactory: ObjectConstructor;
className: StringConstructor;
tag: StringConstructor;
id: StringConstructor;
animationEnteringStyle: ObjectConstructor;
animationExitingStyle: ObjectConstructor;
componentChildClassName: ArrayConstructor[];
transitionName: {
type: StringConstructor;
required: true;
};
appear: {
type: BooleanConstructor;
default: boolean;
};
enter: {
type: BooleanConstructor;
default: boolean;
};
exit: {
type: BooleanConstructor;
default: boolean;
};
transitionEnterDuration: {
type: NumberConstructor;
};
transitionExitDuration: {
type: NumberConstructor;
};
onEntering: PropType<(e: any) => void>;
onEnter: PropType<(e: any) => void>;
onEntered: PropType<(e: any) => void>;
onExit: PropType<(e: any) => void>;
onExiting: PropType<(e: any) => void>;
onExited: PropType<(e: any) => void>;
}>, {}, {}, {}, {
handleEntering(e: any): any;
handleEnter(e: any): any;
handleEntered(e: any): any;
handleExit(e: any): any;
handleExiting(e: any): any;
handleExited(e: any): any;
}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
componentChildStyle: ObjectConstructor;
childFactory: ObjectConstructor;
className: StringConstructor;
tag: StringConstructor;
id: StringConstructor;
animationEnteringStyle: ObjectConstructor;
animationExitingStyle: ObjectConstructor;
componentChildClassName: ArrayConstructor[];
transitionName: {
type: StringConstructor;
required: true;
};
appear: {
type: BooleanConstructor;
default: boolean;
};
enter: {
type: BooleanConstructor;
default: boolean;
};
exit: {
type: BooleanConstructor;
default: boolean;
};
transitionEnterDuration: {
type: NumberConstructor;
};
transitionExitDuration: {
type: NumberConstructor;
};
onEntering: PropType<(e: any) => void>;
onEnter: PropType<(e: any) => void>;
onEntered: PropType<(e: any) => void>;
onExit: PropType<(e: any) => void>;
onExiting: PropType<(e: any) => void>;
onExited: PropType<(e: any) => void>;
}>> & Readonly<{}>, {
appear: boolean;
enter: boolean;
exit: boolean;
}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
export { Animation_2 as Animation }

/**
 * @hidden
 */
export declare const AnimationChild: DefineComponent<ExtractPropTypes<    {
in: BooleanConstructor;
transitionName: {
type: StringConstructor;
required: true;
};
transitionStyle: ObjectConstructor;
componentChildClassName: ArrayConstructor[];
className: StringConstructor;
appear: {
type: BooleanConstructor;
default: boolean;
};
enter: {
type: BooleanConstructor;
default: boolean;
};
exit: {
type: BooleanConstructor;
default: boolean;
};
transitionEnterDuration: NumberConstructor;
transitionExitDuration: NumberConstructor;
mountOnEnter: BooleanConstructor;
unmountOnExit: BooleanConstructor;
animationEnteringStyle: ObjectConstructor;
animationEnteredStyle: ObjectConstructor;
animationExitingStyle: ObjectConstructor;
animationExitedStyle: ObjectConstructor;
onBeforeenter: PropType<(e: any) => void>;
onEntering: PropType<(e: any) => void>;
onEntered: PropType<(e: any) => void>;
onExit: PropType<(e: any) => void>;
onExiting: PropType<(e: any) => void>;
onExited: PropType<(e: any) => void>;
}>, {
elementRef: Ref<any, any>;
}, {}, {
element(this: AnimationChildAll): any;
}, {
handleBeforeEnter(e: any): any;
handleEnter(e: any): any;
handleAfterEnter(e: any): any;
handleBeforeLeave(e: any): any;
handleLeave(e: any): any;
handleAfterLeave(e: any): any;
}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
in: BooleanConstructor;
transitionName: {
type: StringConstructor;
required: true;
};
transitionStyle: ObjectConstructor;
componentChildClassName: ArrayConstructor[];
className: StringConstructor;
appear: {
type: BooleanConstructor;
default: boolean;
};
enter: {
type: BooleanConstructor;
default: boolean;
};
exit: {
type: BooleanConstructor;
default: boolean;
};
transitionEnterDuration: NumberConstructor;
transitionExitDuration: NumberConstructor;
mountOnEnter: BooleanConstructor;
unmountOnExit: BooleanConstructor;
animationEnteringStyle: ObjectConstructor;
animationEnteredStyle: ObjectConstructor;
animationExitingStyle: ObjectConstructor;
animationExitedStyle: ObjectConstructor;
onBeforeenter: PropType<(e: any) => void>;
onEntering: PropType<(e: any) => void>;
onEntered: PropType<(e: any) => void>;
onExit: PropType<(e: any) => void>;
onExiting: PropType<(e: any) => void>;
onExited: PropType<(e: any) => void>;
}>> & Readonly<{}>, {
in: boolean;
mountOnEnter: boolean;
unmountOnExit: boolean;
appear: boolean;
enter: boolean;
exit: boolean;
}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;

/**
 * @hidden
 */
declare interface AnimationChildAll extends AnimationChildMethods, AnimationChildData {
}

/**
 * @hidden
 */
declare interface AnimationChildData {
    _element: any;
    animationStep: string;
    elementRef: any;
}

/**
 * @hidden
 */
declare interface AnimationChildMethods {
    onBeforeEnter: (e: any) => void;
    onEnter: (e: any) => void;
    onAfterEnter: (e: any) => void;
    onBeforeLeave: (e: any) => void;
    onLeave: (e: any) => void;
    onAfterLeave: (e: any) => void;
}

/**
 * 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;
    /**
     * @hidden
     */
    className?: string;
    /**
     * @hidden
     */
    key?: any;
    /**
     * Specifies the transition name.
     */
    transitionStyle?: any;
    /**
     * Specifies the transition class which will be applied on the appear, enter, and exit transition.
     */
    transitionName: string;
    /**
     * Specifies the style which will be applied when the Animation reaches its entering state.
     */
    animationEnteringStyle?: any;
    /**
     * Specifies the style which will be applied when the Animation reaches its entered state.
     */
    animationEnteredStyle?: any;
    /**
     * Specifies the style which will be applied when the Animation reaches its exiting state.
     */
    animationExitingStyle?: any;
    /**
     * Specifies the style which will be applied when the Animation reaches its exited state.
     */
    animationExitedStyle?: 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: any;
}

/**
 * Inherited by all Animations. Represents the properties which can be set to an Animation.
 */
declare interface AnimationInterface {
    /**
     * Specifies the CSS class names which are set to each of the animated children elements.
     */
    componentChildClassName?: (string | string[] | undefined)[];
    /**
     * Specifies the styles which are set to each of the animated children elements.
     */
    componentChildStyle?: any;
    /**
     * Called when a component is added to an existing Animation component and the Animation has not started yet .
     */
    onEnter?: (event: AnimationEventArguments) => void;
    /**
     * Called when a component is added to an existing Animation component and the Animation is now happening.
     */
    onEntering?: (event: AnimationEventArguments) => void;
    /**
     * Called when a component is added to an existing Animation component and the Animation is now finished.
     */
    onEntered?: (event: AnimationEventArguments) => void;
    /**
     * An event that is called after the Animation has reached its exit state.
     */
    onExit?: (event: AnimationEventArguments) => void;
    /**
     * An event that is called after the Animation has reached its exiting state.
     */
    onExiting?: (event: AnimationEventArguments) => void;
    /**
     * An event that is called after the Animation has reached its exited state.
     */
    onExited?: (event: AnimationEventArguments) => void;
    /**
     * Defines whether a transition should happen on the first mount. Defaults to `false`.
     */
    appear?: boolean;
    /**
     * Specifies whether to animate the entering (showing) element ([see example]({% slug disabledstate_animation %})). Defaults to `true`.
     */
    enter?: boolean;
    /**
     * Specifies whether to animate a leaving (disappearing) element ([see example]({% slug disabledstate_animation %})). Defaults to `true`.
     */
    exit?: boolean;
    /**
     * Specifies the duration of the transition for the entering (`animation in`) Animation ([see example]({% slug duration_animation %})). After the time runs out, the Animation is terminated. Defaults to `300ms`.
     */
    transitionEnterDuration?: number;
    /**
     * Specifies the duration of the transition for the exiting (`animation out`) Animation ([see example]({% slug duration_animation %})). After the time runs out, the Animation is terminated. Defaults to `300ms`.
     */
    transitionExitDuration?: number;
    /**
     * Specifies if the Animation will use lazy-mounting on the first `in={true}`. Defaults to `false`.
     */
    mountOnEnter?: boolean;
    /**
     * Specifies if the Animation will unmount after it reaches its exited state. Defaults to `false`.
     */
    unmountOnExit?: boolean;
}

/**
 * Represent the props of the Animation components.
 */
export declare interface AnimationProps extends AnimationInterface {
    /**
     * When the element reaches its exit state, it is no longer available
     *  in the DOM.
     */
    childFactory?: any;
    /**
     * Specifies the name of the CSS class which is set to the Animation.
     */
    className?: string;
    /**
     * Specifies the node type of the parent Animation. Defaults to `div`.
     */
    tag?: string;
    /**
     * Specifies the id of the Animation.
     */
    id?: string;
    /**
     * Specifies the role of the Animation.
     */
    role?: string;
    /**
     * Specifies the id of the Animation.
     */
    key?: string;
    /**
     * @hidden
     * Specifies whether the Animation children will stack on top of each other
     *  without interfering ([see example]({% slug stacked_animation %})).
     */
    stackChildren?: boolean;
    /**
     * Specifies the `classNames` which will be applied during the
     *  transition ([see example]({% slug customizing_animation %})).
     */
    transitionName: string;
    /**
     * Specifies the style which will be applied when the Animation reaches its entering state.
     */
    animationEnteringStyle?: any;
    /**
     * Specifies the style which will be applied when the Animation reaches its entered state.
     */
    animationEnteredStyle?: any;
    /**
     * Specifies the style which will be applied when the Animation reaches its exiting state.
     */
    animationExitingStyle?: any;
    /**
     * Specifies the style which will be applied when the Animation reaches its exited state.
     */
    animationExitedStyle?: any;
}

/**
 * @hidden
 */
export declare const cancelAnimation: (animationFrame: any) => void;

/**
 * @hidden
 */
export declare const Expand: DefineComponent<ExtractPropTypes<    {
appear: {
type: BooleanConstructor;
default: boolean;
};
enter: {
type: BooleanConstructor;
default: boolean;
};
exit: {
type: BooleanConstructor;
default: boolean;
};
transitionEnterDuration: {
type: NumberConstructor;
default: number;
};
transitionExitDuration: {
type: NumberConstructor;
default: number;
};
childFactory: ObjectConstructor;
className: StringConstructor;
direction: {
type: StringConstructor;
default: string;
};
componentChildStyle: ObjectConstructor;
tag: StringConstructor;
id: StringConstructor;
}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
appear: {
type: BooleanConstructor;
default: boolean;
};
enter: {
type: BooleanConstructor;
default: boolean;
};
exit: {
type: BooleanConstructor;
default: boolean;
};
transitionEnterDuration: {
type: NumberConstructor;
default: number;
};
transitionExitDuration: {
type: NumberConstructor;
default: number;
};
childFactory: ObjectConstructor;
className: StringConstructor;
direction: {
type: StringConstructor;
default: string;
};
componentChildStyle: ObjectConstructor;
tag: StringConstructor;
id: StringConstructor;
}>> & Readonly<{}>, {
transitionEnterDuration: number;
transitionExitDuration: number;
appear: boolean;
enter: boolean;
exit: boolean;
direction: string;
}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;

/**
 * Specifies the direction of the Expand Animation ([see example]({% slug direction_animation %}#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';

/**
 * Represent the props of the [KendoVue Expand Animation component]({% slug animationtypes_animation %}#toc-expand).
 *
 * @example
 * ```html-preview
 *
 * ```
 */
export declare interface ExpandProps extends AnimationInterface {
    /**
     * After the element reached its exit state, it is no longer available in the DOM. If a DOM operation is required, access it trough the `childFactory` function.
     */
    childFactory?: any;
    /**
     * Specifies the CSS class names which are set to the Animation.
     */
    className?: string;
    /**
     * Specifies the direction of the Expand Animation. Defaults to `vertical`.
     */
    direction?: String;
    /**
     * Specifies the node type of the parent Animation. Defaults to `div`.
     */
    component?: string;
    /**
     * Specifies the tag.
     */
    tag?: string;
    /**
     * Specifies the id of the Animation.
     */
    id?: string;
    /**
     * Specifies the id of the Animation.
     */
    key?: string;
}

/**
 * @hidden
 */
export declare const Fade: DefineComponent<ExtractPropTypes<    {
appear: {
type: BooleanConstructor;
default: boolean;
};
enter: {
type: BooleanConstructor;
default: boolean;
};
exit: {
type: BooleanConstructor;
default: boolean;
};
transitionEnterDuration: {
type: NumberConstructor;
default: number;
};
transitionExitDuration: {
type: NumberConstructor;
default: number;
};
componentChildStyle: ObjectConstructor;
childFactory: ObjectConstructor;
className: StringConstructor;
tag: StringConstructor;
id: StringConstructor;
}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
appear: {
type: BooleanConstructor;
default: boolean;
};
enter: {
type: BooleanConstructor;
default: boolean;
};
exit: {
type: BooleanConstructor;
default: boolean;
};
transitionEnterDuration: {
type: NumberConstructor;
default: number;
};
transitionExitDuration: {
type: NumberConstructor;
default: number;
};
componentChildStyle: ObjectConstructor;
childFactory: ObjectConstructor;
className: StringConstructor;
tag: StringConstructor;
id: StringConstructor;
}>> & Readonly<{}>, {
transitionEnterDuration: number;
transitionExitDuration: number;
appear: boolean;
enter: boolean;
exit: boolean;
}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;

/**
 * Represent the props of the [KendoVue Fade Animation component]({% slug animationtypes_animation %}#toc-fade).
 */
export declare interface FadeProps extends AnimationInterface {
    /**
     * After the element reaches its exit state, it is no longer available
     * in the DOM. If a DOM operation is required, access it trough the `childFactory` function.
     */
    childFactory?: any;
    /**
     * Specifies CSS class names which are set to the Animation.
     */
    className?: string;
    /**
     * Specifies the node type of the parent Animation. Defaults to `div`.
     */
    component?: string;
    /**
     * Specifies the id of the Animation.
     */
    id?: string;
    /**
     * Specifies the tag.
     */
    tag?: string;
}

/**
 * @hidden
 */
export declare const Push: DefineComponent<ExtractPropTypes<    {
appear: {
type: BooleanConstructor;
default: boolean;
};
enter: {
type: BooleanConstructor;
default: boolean;
};
exit: {
type: BooleanConstructor;
default: boolean;
};
transitionEnterDuration: {
type: NumberConstructor;
default: number;
};
transitionExitDuration: {
type: NumberConstructor;
default: number;
};
childFactory: ObjectConstructor;
componentChildStyle: ObjectConstructor;
className: StringConstructor;
direction: {
type: StringConstructor;
default: string;
};
tag: StringConstructor;
id: StringConstructor;
}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
appear: {
type: BooleanConstructor;
default: boolean;
};
enter: {
type: BooleanConstructor;
default: boolean;
};
exit: {
type: BooleanConstructor;
default: boolean;
};
transitionEnterDuration: {
type: NumberConstructor;
default: number;
};
transitionExitDuration: {
type: NumberConstructor;
default: number;
};
childFactory: ObjectConstructor;
componentChildStyle: ObjectConstructor;
className: StringConstructor;
direction: {
type: StringConstructor;
default: string;
};
tag: StringConstructor;
id: StringConstructor;
}>> & Readonly<{}>, {
transitionEnterDuration: number;
transitionExitDuration: number;
appear: boolean;
enter: boolean;
exit: boolean;
direction: string;
}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;

/**
 * Specifies the direction of the Push Animation ([see example]({% slug direction_animation %}#toc-push)).
 *
 * The supported directions are:
 * * `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.
 * * (Default) `right`&mdash;Pushes the content from left to right.
 */
export declare type PushDirection = 'up' | 'down' | 'left' | 'right';

/**
 * Represent the props of the [KendoVue Push Animation component]({% slug animationtypes_animation %}#toc-push).
 *
 */
export declare interface PushProps extends AnimationInterface {
    /**
     * After the element reaches its exit state, it is no longer available in the DOM.
     * If a DOM operation is required, access it trough the `childFactory` function.
     */
    childFactory?: any;
    /**
     * Specifies the CSS class names which are set to the Animation.
     */
    className?: string;
    /**
     * Specifies the direction of the Push Animation. Defaults to `right`.
     */
    direction?: string;
    /**
     * Specifies the node type of the parent Animation. Defaults to `div`.
     */
    component?: string;
    /**
     * Specifies the tag.
     */
    tag?: string;
    /**
     * Specifies the id of the Animation.
     */
    id?: string;
    /**
     * Specifies the style of the parent Animation.
     */
    style?: any;
    /**
     * @hidden
     * Specifies whether the child elements will stack on top of each other without
     *  interfering ([more information and examples]({% slug stacked_animation %})).
     */
    stackChildren?: boolean;
}

/**
 * @hidden
 */
export declare const Reveal: DefineComponent<ExtractPropTypes<    {
appear: {
type: PropType<boolean>;
default: boolean;
};
enter: {
type: PropType<boolean>;
default: boolean;
};
exit: {
type: PropType<boolean>;
default: boolean;
};
transitionEnterDuration: {
type: PropType<number>;
default: number;
};
transitionExitDuration: {
type: PropType<number>;
default: number;
};
componentChildStyle: PropType<any>;
childFactory: PropType<any>;
className: PropType<string>;
direction: {
type: PropType<string>;
default: string;
};
tag: PropType<string>;
id: PropType<string>;
onEnter: PropType<(event: AnimationEventArguments) => void>;
onEntering: PropType<(event: AnimationEventArguments) => void>;
onExit: PropType<(event: AnimationEventArguments) => void>;
onExited: PropType<(event: AnimationEventArguments) => void>;
}>, {}, {
maxHeight: string;
maxWidth: string;
}, {
animationEnteringStyle(): RevealComputed['animationEnteringStyle'];
}, {
componentWillEnter(event: AnimationEventArguments): void;
componentIsEntering(event: AnimationEventArguments): void;
componentWillExit(event: AnimationEventArguments): void;
updateContainerDimensions(node: HTMLElement, done?: () => any): void;
}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
appear: {
type: PropType<boolean>;
default: boolean;
};
enter: {
type: PropType<boolean>;
default: boolean;
};
exit: {
type: PropType<boolean>;
default: boolean;
};
transitionEnterDuration: {
type: PropType<number>;
default: number;
};
transitionExitDuration: {
type: PropType<number>;
default: number;
};
componentChildStyle: PropType<any>;
childFactory: PropType<any>;
className: PropType<string>;
direction: {
type: PropType<string>;
default: string;
};
tag: PropType<string>;
id: PropType<string>;
onEnter: PropType<(event: AnimationEventArguments) => void>;
onEntering: PropType<(event: AnimationEventArguments) => void>;
onExit: PropType<(event: AnimationEventArguments) => void>;
onExited: PropType<(event: AnimationEventArguments) => void>;
}>> & Readonly<{}>, {
transitionEnterDuration: number;
transitionExitDuration: number;
appear: boolean;
enter: boolean;
exit: boolean;
direction: string;
}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;

/**
 * @hidden
 */
declare interface RevealComputed {
    [key: string]: any;
    animationEnteringStyle?: any;
}

/**
 * Specifies the direction of the Reveal Animation ([see example]({% slug direction_animation %}#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';

/**
 * Represent the props of the [KendoVue Reveal Animation component]({% slug animationtypes_animation %}#toc-reveal).
 *
 * @example
 * ```html-preview
 *
 * ```
 */
export declare interface RevealProps extends AnimationInterface {
    /**
     * After the element reaches its exit state, it is no longer available in the DOM.
     *  If a DOM operation is required, access it trough the `childFactory` function.
     */
    childFactory?: any;
    /**
     * Specifies the CSS class names which are set to the Animation.
     */
    className?: string;
    /**
     * Specifies the direction of the Reveal Animation. Defaults to `vertical`.
     */
    direction?: string;
    /**
     * Specifies the node type of the parent Animation. Defaults to `div`.
     */
    component?: string;
    /**
     * Specifies the tag.
     */
    tag?: string;
    /**
     * Specifies the id of the Animation.
     */
    id?: string;
    /**
     * Specifies the style of the parent Animation.
     */
    style?: any;
}

/**
 * @hidden
 */
export declare const Slide: DefineComponent<ExtractPropTypes<    {
appear: {
type: BooleanConstructor;
default: boolean;
};
enter: {
type: BooleanConstructor;
default: boolean;
};
exit: {
type: BooleanConstructor;
default: boolean;
};
transitionEnterDuration: {
type: NumberConstructor;
default: number;
};
transitionExitDuration: {
type: NumberConstructor;
default: number;
};
componentChildClassName: ArrayConstructor[];
childFactory: ObjectConstructor;
componentChildStyle: ObjectConstructor;
className: StringConstructor;
direction: {
type: StringConstructor;
default: string;
};
tag: StringConstructor;
id: StringConstructor;
role: StringConstructor;
onBeforeenter: PropType<(e: any) => void>;
onEntering: PropType<(e: any) => void>;
onEntered: PropType<(e: any) => void>;
onExit: PropType<(e: any) => void>;
onExiting: PropType<(e: any) => void>;
onExited: PropType<(e: any) => void>;
}>, {}, {}, {}, {
handleEntering(e: any): any;
handleEnter(e: any): any;
handleEntered(e: any): any;
handleExit(e: any): any;
handleExiting(e: any): any;
handleExited(e: any): any;
}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
appear: {
type: BooleanConstructor;
default: boolean;
};
enter: {
type: BooleanConstructor;
default: boolean;
};
exit: {
type: BooleanConstructor;
default: boolean;
};
transitionEnterDuration: {
type: NumberConstructor;
default: number;
};
transitionExitDuration: {
type: NumberConstructor;
default: number;
};
componentChildClassName: ArrayConstructor[];
childFactory: ObjectConstructor;
componentChildStyle: ObjectConstructor;
className: StringConstructor;
direction: {
type: StringConstructor;
default: string;
};
tag: StringConstructor;
id: StringConstructor;
role: StringConstructor;
onBeforeenter: PropType<(e: any) => void>;
onEntering: PropType<(e: any) => void>;
onEntered: PropType<(e: any) => void>;
onExit: PropType<(e: any) => void>;
onExiting: PropType<(e: any) => void>;
onExited: PropType<(e: any) => void>;
}>> & Readonly<{}>, {
transitionEnterDuration: number;
transitionExitDuration: number;
appear: boolean;
enter: boolean;
exit: boolean;
direction: string;
}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;

/**
 * Specifies the direction of the Slide Animation ([see example]({% slug direction_animation %}#toc-slide)).
 *
 * The supported directions are:
 * * `up`&mdash;On showing, slides the content from bottom to top, and vice-versa.
 * * (Default) `down`&mdash;On showing, slides the content from top to bottom, 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';

/**
 * Represent the props of the [KendoVue Slide Animation component]({% slug animationtypes_animation %}#toc-slide).
 *
 * @example
 * ```html-preview
 * ```
 */
export declare interface SlideProps extends AnimationInterface {
    /**
     * After the element reaches its exit state, it is no longer available in the DOM.
     * If a DOM operation is required, access it trough the `childFactory` function.
     */
    childFactory?: any;
    /**
     * Specifies the CSS class names which are set to the Animation.
     */
    className?: string | string[];
    /**
     * Specifies the direction of the Slide Animation. Defaults to `down`.
     */
    direction?: string;
    /**
     * Specifies the node type of the parent Animation. Defaults to `div`.
     */
    tag?: string;
    /**
     * Specifies the tag.
     */
    component?: string;
    /**
     * Specifies the id of the Animation.
     */
    id?: string;
    /**
     * Specifies the role of the Animation element.
     */
    role?: string;
    /**
     * Specifies the style of the parent Animation.
     */
    style?: any;
}

/**
 * @hidden
 */
export declare const Zoom: DefineComponent<ExtractPropTypes<    {
appear: {
type: BooleanConstructor;
default: boolean;
};
enter: {
type: BooleanConstructor;
default: boolean;
};
exit: {
type: BooleanConstructor;
default: boolean;
};
stackChildren: {
type: BooleanConstructor;
default: boolean;
};
transitionEnterDuration: {
type: NumberConstructor;
default: number;
};
transitionExitDuration: {
type: NumberConstructor;
default: number;
};
childFactory: ObjectConstructor;
className: StringConstructor;
direction: {
type: StringConstructor;
default: string;
};
tag: StringConstructor;
id: StringConstructor;
}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
appear: {
type: BooleanConstructor;
default: boolean;
};
enter: {
type: BooleanConstructor;
default: boolean;
};
exit: {
type: BooleanConstructor;
default: boolean;
};
stackChildren: {
type: BooleanConstructor;
default: boolean;
};
transitionEnterDuration: {
type: NumberConstructor;
default: number;
};
transitionExitDuration: {
type: NumberConstructor;
default: number;
};
childFactory: ObjectConstructor;
className: StringConstructor;
direction: {
type: StringConstructor;
default: string;
};
tag: StringConstructor;
id: StringConstructor;
}>> & Readonly<{}>, {
transitionEnterDuration: number;
transitionExitDuration: number;
appear: boolean;
enter: boolean;
exit: boolean;
stackChildren: boolean;
direction: string;
}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;

/**
 * Specifies the direction of the Zoom Animation ([see example]({% slug direction_animation %}#toc-zoom)).
 *
 * The supported directions are:
 * * `in`&mdash;Zooms the content from the inside to the outside.
 * * (Default) `out`&mdash;Zooms the content from the outside to the inside.
 */
export declare type ZoomDirection = 'in' | 'out';

/**
 * Represent the props of the [KendoVue Zoom Animation component]({% slug animationtypes_animation %}#toc-zoom).
 *
 * @example
 * ```html-preview
 *
 * ```
 */
export declare interface ZoomProps extends AnimationInterface {
    /**
     * After the element reaches its exit state, it is no longer available in the DOM. If a DOM operation is required, access it trough the `childFactory` function.
     */
    childFactory?: any;
    /**
     * Specifies the CSS class names which are set to the Animation.
     */
    className?: string;
    /**
     * Specifies the direction of the Zoom Animation. Defaults to `out`.
     */
    direction?: string;
    /**
     * Specifies the node type of the parent Asnimation. Defaults to `div`.
     */
    component?: string;
    /**
     * Specifies the tag.
     */
    tag?: string;
    /**
     * Specifies the id of the Animation.
     */
    id?: string;
    /**
     * Specifies the style of the parent Animation.
     */
    style?: any;
    /**
     * @hidden
     * Specifies whether the child elements will stack on top of each other without interfering ([more information and examples]({% slug stacked_animation %})).
     */
    stackChildren?: boolean;
}

export { }