React animations with animate.css

Installation

Using npm:

$ npm install --save animate.css-react
$ npm install --save animate.css

Run Demo

$ git clone https://github.com/kurdin/animate.css-react
$ cd animate.css-react
$ npm install
$ npm run demo

Open browser in http://localhost:8080

Notes

You need to install and require animate.css yourself.

Usage

``js
import Animate from 'animate.css-react'

import 'animate.css/animate.css' // you need to require the css somewhere

// animate list, dont forget to add unique key to each item, don't use array index!!!
enter="bounceIn" // on Enter animation
leave="bounceOut" // on Leave animation
appear="fadeInRight" // on element Appear animation (onMount)
change="flipInX" // on element Change animation (onUpdate)
durationAppear={1000}
durationEnter={1000}
durationLeave={1000}
durationChange={1000}
animate={true|false|expression} // turn off/on animation, true by default
animateChangeIf={true|false|expression} // turn off/on Change only animation, true by default
component="ul">

{this.state.items.map(item =>


``

based on https://github.com/thiagoc7/react-animate.css