React component for fancy number transitions.
Live demo
Installation
npm i -S che-react-number-easing
Usage.
const NumberEasing = require('che-react-number-easing');
<NumberEasing
ease="quintInOut"
precision={2}
speed={300}
trail={true}
useLocaleString={true}
value={15}
/>
Props
[ease]
: The easing equation for the animation.
[precision]
: How many decimal places you want to show?
[speed]
: How fast do you want to finish the animation?
- Default:
500
(ms) - Type:
number
[trail]
: Do you want trailing zeroes?
- Default:
false
- Type:
boolean
[useLocaleString]
: Use number formatting based on locale?
- Default:
false
- Type:
boolean
[value]
: The value that you want to display at the end of the animation.
Build
If you want to build this from source, you will need babel and less.
npm install
And run the pre publish script
npm run prepare