Animate

Examples

An animation wrapper to transition components in & out.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Properties

component {string}|{Component}
Wrapping component. Defaults to <div/>.
enter {animation: , duration: , delay: }
Animation when component is entering. Possible animations:fade|slide-up|slide-down|slide-left|slide-right
keep true|false
Whether to keep or remove element from the DOM. Defaults to false.
leave {animation: , duration: , delay: }
Animation when component is leaving. Defaults to enter animation.
onAppear {function}
Callback for when the animation appears.
onLeave {function}
Callback for when the animation leaves.
visible true|false|scroll
Toggle visibility. When set to scroll, the animation will happen when the component scrolls into view. Defaults to false.