Entering motion

Children as function. Will be passed props for you to hook up. The state arg can be used to know if the motion is entering or exiting.

The distance the element moves in a direction-based animation. A proportional distance is based on the size of the element. A constant distance will always move the same amount, regardless of size.

How long the motion will take.

The direction the element will enter from using a slide animation. If undefined, no slide will be applied.

The direction the element will exit to using a slide animation. If undefined but entranceDirection is set, it will exit to the opposite side by default.

Can be used to pause the animation before it has finished.

Will callback when the motion has finished in the particular direction. If it finished entering direction will be entering. And vice versa for exiting.

A custom function used to override the default animation timings. Returns which animation curve to use depending on the current transitioning state.

A custom function used to override the default animation timings when exiting. Returns which animation curve to use depending on the current transitioning state.

Children as function. Will be passed props for you to hook up. The state arg can be used to know if the motion is entering or exiting.

How long the motion will take.

Direction the element will slide in from. E.g. "right" will slide in from the right to the left.

If exitTo is not set, exiting will reverse this motion. E.g. If enterFrom: "right", will slide out to the right.

Direction the element will slide out towards. E.g. "right" will slide out to the right.

If this is not set, exiting will reverse the entrance motion. E.g. If enterFrom: "right", will slide out to the right.

Whether an element will fade on enter, on exit or both.

'none' is the default and will cause the element to not fade, 'in' will cause the element to fade on enter, 'out' will cause the element to fade on exit, 'inout' will cause the element to fade on both.

Can be used to pause the animation before it has finished.

Will callback when the motion has finished in the particular direction. If it finished entering direction will be entering. And vice versa for exiting.

Children as function. Will be passed props for you to hook up. The state arg can be used to know if the motion is entering or exiting.

How long the motion will take.

Can be used to pause the animation before it has finished.

Will callback when the motion has finished in the particular direction. If it finished entering direction will be entering. And vice versa for exiting.

Children as function. Will be passed props for you to hook up. The state arg can be used to know if the motion is entering or exiting.

How long the motion will take.

Will callback when the motion has finished in the particular direction. If it finished entering direction will be entering. And vice versa for exiting.