()
A configurable React component For counting up the number in your React appilcation.
react-number-increment.
Installation
```bash
yarn add react-number-increment
```
```bash
npm install react-number-increment
```
Import
```js
import Counter from "react-number-increment";
```
Simple example
```js
```
This will start a count up transition from
0 to
100 on render with speed of 1ms.
Example
```js
// import "./App.css";
import Counter from "react-number-increment";
function App() {
return (
<div className="App">
<Counter
start=0 // starting
end=500 // ends
speed=1 // 100ms
decrement // in case if you want to decrement
style={{ fontSize: "200px", fontWeight: 900 }} // add custom style
threshold=1 // viewport 1=100%,
child="+" // add childs ie + , - , *
offset=5 // increments by 5
seperate="," // seperates number in comma
/>
</div>
);
}
export default App;
```
Note that
offsetend={4} will add the offset to the ending value.
Add end and starting Number
```js
```
Tip: If you need to start the render prop component immediately, you can set speed={0}.
If you know about default values 👍
| key | Value | Guide / What they does |
| --------- | ----- | ---------------------- |
| start | 0 | Starting value |
| end | 100 | Ending value |
| speed | 1 | 1 is 100ms speed. |
| decrement | 0 | pass to decrement |
| offsetend | 0 | Adds the value in end |
| threshold | .5 | 1 = 100% |
| child | "+" | 100- , 2000
, "-", "" |
| offset | null | 5 // increments by 5 |
| seperate | null | "," - 10,900 |
License ISC
