@atlaskit/motion/dist/types/entering/exiting-persistence.d.ts

A set of utilities to apply motion in your application.

import React, { type ReactNode } from 'react';
export interface ExitingPersistenceProps {
    /**
     * Children can be any valid react node.
     * Either a single element,
     * multiple elements,
     * or multiple elements in an array.
     */
    children?: ReactNode;
    /**
     * When elements are exiting will exit all elements first and then mount the new ones.
     * Defaults to `false`.
     */
    exitThenEnter?: boolean;
    /**
     * When initially mounting if set to `true` all child motions will animate in.
     */
    appear?: boolean;
}
/**
 * Internal data passed to child motions.
 */
interface ExitingChildContext {
    /**
     * Will perform an exit animation instead of an enter animation.
     */
    isExiting: boolean;
    /**
     * Will be called when the animation has completed.
     */
    onFinish?: () => void;
    /**
     * Used to tell the child motions to animate in when initially mounting.
     */
    appear: boolean;
}
/**
 * How does this component work?
 *
 * It looks at changes in its children to see what is removed.
 *
 * If a child is removed it clones it and wraps it with context providing an `onFinish` callback.
 *
 * The cloned child will call the `onFinish` when it finishes its exit animation,
 * which lets `ExitingPersistence` know to stop rendering it.
 */
/**
 * __ExitingPersistence__
 *
 * Useful for enabling elements to persist and animate away when they are removed from the DOM.
 *
 * - [Examples](https://atlaskit.atlassian.com/packages/design-system/motion/docs/entering-motion)
 */
declare const ExitingPersistence: React.MemoExoticComponent<({ appear, children, exitThenEnter }: ExitingPersistenceProps) => any>;
export declare const useExitingPersistence: () => ExitingChildContext;
export default ExitingPersistence;