AnimationChildProps

Represents the props of the child Animation elements.

Name	Type	Default	Description
animationEnteredStyle?	any		Inline styles applied when the Animation has entered. ts <AnimationChild animationEnteredStyle={{ opacity: 1 }} />
animationEnteringStyle?	any		Specifies the style which will be applied when the Animation reaches its entering state. ts <AnimationChild animationEnteringStyle={{ opacity: 0.5 }} />
animationExitedStyle?	any		Inline styles applied when the Animation has exited. ts <AnimationChild animationExitedStyle={{ opacity: 0 }} />
animationExitingStyle?	any		Specifies the style which will be applied when the Animation reaches its exiting state. ts <AnimationChild animationExitingStyle={{ opacity: 0.5 }} />
appear?	boolean		Defines whether a transition should happen on the first mount. Defaults to false.
className?	string		Custom CSS class to apply to the Animation container. ts <AnimationChild className="custom-animation-class" />
componentChildClassName?	string		Specifies the CSS class names which are set to each of the animated children elements.
componentChildStyle?	any		Specifies the styles which are set to each of the animated children elements.
enter?	boolean		Specifies whether to animate the entering (showing) element (see example). Defaults to true.
exit?	boolean		Specifies whether to animate a leaving (disappearing) element (see example). Defaults to true.
in?	boolean		Controlled by TransitionGroup if present. Otherwise, sets the state of the enter or exit Animations.
mountOnEnter?	boolean		Specifies if the Animation will use lazy-mounting on the first in={true}. Defaults to false.
onEnter?	(event: AnimationEventArguments) => void		Called when a component is added to an existing Animation component and the Animation has not started yet (more information and example).
onEntered?	(event: AnimationEventArguments) => void		Called when a component is added to an existing Animation component and the Animation is now finished (more information and example).
onEntering?	(event: AnimationEventArguments) => void		Called when a component is added to an existing Animation component and the Animation is now happening (more information and example).
onExit?	(event: AnimationEventArguments) => void		An event that is called after the Animation has reached its exit state (more information and example).
onExited?	(event: AnimationEventArguments) => void		An event that is called after the Animation has reached its exited state (more information and example).
onExiting?	(event: AnimationEventArguments) => void		An event that is called after the Animation has reached its exiting state (more information and example).
style?	any		Custom inline styles to apply to the Animation container. ts <AnimationChild style={{ backgroundColor: "red" }} />
transitionEnterDuration?	number		Specifies the duration of the transition for the entering (animation in) Animation (see example). After the time runs out, the Animation is terminated. Defaults to 300ms.
transitionExitDuration?	number		Specifies the duration of the transition for the exiting (animation out) Animation (see example). After the time runs out, the Animation is terminated. Defaults to 300ms.
transitionName	string		Specifies the base class name for the transition. This class will be used to generate the appear, enter, and exit transition classes. ts <AnimationChild transitionName="fade" />
unmountOnExit?	boolean		Specifies if the Animation will unmount after it reaches its exited state. Defaults to false.
unstyled?	AnimationsClassStructure		Provides unstyled options for the Animation. Accepts an object implementing the AnimationsClassStructure interface. ts <AnimationChild unstyled={{ appear: "custom-appear-class" }} />