UNPKG

1.56 kBTypeScriptView Raw
1import { Component } from "react";
2import { TransitionProps } from "./Transition";
3
4export interface CSSTransitionClassNames {
5 appear?: string | undefined;
6 appearActive?: string | undefined;
7 appearDone?: string | undefined;
8 enter?: string | undefined;
9 enterActive?: string | undefined;
10 enterDone?: string | undefined;
11 exit?: string | undefined;
12 exitActive?: string | undefined;
13 exitDone?: string | undefined;
14}
15
16export type CSSTransitionProps<Ref extends undefined | HTMLElement = undefined> = TransitionProps<Ref> & {
17 /**
18 * The animation `classNames` applied to the component as it enters or exits.
19 * A single name can be provided and it will be suffixed for each stage: e.g.
20 *
21 * `classNames="fade"` applies `fade-enter`, `fade-enter-active`,
22 * `fade-exit`, `fade-exit-active`, `fade-appear`, and `fade-appear-active`.
23 *
24 * Each individual classNames can also be specified independently like:
25 *
26 * ```js
27 * classNames={{
28 * appear: 'my-appear',
29 * appearActive: 'my-appear-active',
30 * appearDone: 'my-appear-done',
31 * enter: 'my-enter',
32 * enterActive: 'my-enter-active',
33 * enterDone: 'my-enter-done',
34 * exit: 'my-exit',
35 * exitActive: 'my-exit-active',
36 * exitDone: 'my-exit-done'
37 * }}
38 * ```
39 */
40 classNames?: string | CSSTransitionClassNames | undefined;
41};
42
43declare class CSSTransition<Ref extends undefined | HTMLElement> extends Component<CSSTransitionProps<Ref>> {}
44
45export default CSSTransition;