File tree Expand file tree Collapse file tree 1 file changed +38
-2
lines changed
Expand file tree Collapse file tree 1 file changed +38
-2
lines changed Original file line number Diff line number Diff line change 33
44[ Live demo] ( https://xendora.github.io/react-timer/examples )
55
6- [ ![ Commitizen friendly] ( https://img.shields.io/badge/commitizen-friendly-brightgreen.svg )] ( http://commitizen.github.io/cz-cli/ )
6+ ![ Travis (.org) branch] ( https://img.shields.io/travis/xendora/react-timer/master?style=for-the-badge ) ![ GitHub Release Date] ( https://img.shields.io/github/release-date/xendora/react-timer?style=for-the-badge ) ![ npm] ( https://img.shields.io/npm/v/@xendora/react-timer?style=for-the-badge ) ![ NPM] ( https://img.shields.io/npm/l/@xendora/react-timer?style=for-the-badge )
7+ ![ npm bundle size] ( https://img.shields.io/bundlephobia/min/@xendora/react-timer?style=for-the-badge ) ![ npm bundle size] ( https://img.shields.io/bundlephobia/minzip/@xendora/react-timer?style=for-the-badge )
78
89![ Basic Timer with 100ms interval] ( docs/images/incremental-counter.gif " Basic Timer with 100ms interval ")
910
@@ -20,6 +21,41 @@ npm install @xendora/react-timer
2021yarn add @xendora/react-timer
2122```
2223
24+ ### Usage
25+ ``` js
26+ import ReactTimer from " @xendora/react-timer" ;
27+
28+ // Incremental counter
29+ < ReactTimer
30+ interval= {100 }
31+ start= {0 }
32+ end= {t => t === 100 }
33+ onTick= {t => t + 1 }
34+ >
35+ {time => < span> {time}< / span> }
36+ < / ReactTimer>
37+
38+ // Decremetal counter
39+ < ReactTimer
40+ interval= {100 }
41+ start= {100 }
42+ end= {t => t === 0 }
43+ onTick= {t => t - 1 }
44+ >
45+ {time => < span> {time}< / span> }
46+ < / ReactTimer>
47+
48+ // Infinite counter
49+ < ReactTimer
50+ interval= {100 }
51+ start= {0 }
52+ end= {t => false }
53+ onTick= {t => t + 1 }
54+ >
55+ {time => < span> {time}< / span> }
56+ < / ReactTimer>
57+ ```
58+
2359## Props
2460| Name | Type | Description |
2561| ------------- | ------------- | ------------- |
@@ -33,4 +69,4 @@ yarn add @xendora/react-timer
3369
3470## License
3571
36- MIT © [ xendora] ( https://github.com/xendora )
72+ MIT © [ xendora] ( https://github.com/xendora )
You can’t perform that action at this time.
0 commit comments