https://github.com/trevorblades/react-countdown-rp
⏳ A render props component that counts down
https://github.com/trevorblades/react-countdown-rp
component countdown react render-props timer
Last synced: about 2 months ago
JSON representation
⏳ A render props component that counts down
- Host: GitHub
- URL: https://github.com/trevorblades/react-countdown-rp
- Owner: trevorblades
- Created: 2019-02-15T03:19:56.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2021-08-10T21:52:56.000Z (almost 5 years ago)
- Last Synced: 2025-09-23T18:41:52.661Z (9 months ago)
- Topics: component, countdown, react, render-props, timer
- Language: JavaScript
- Homepage: https://npm.im/react-countdown-rp
- Size: 91.8 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# react-countdown-rp
A React render prop component that counts down from *now* to a future time
## Installation
```bash
$ npm install react-countdown-rp
```
## Usage
Specify a future time (in milliseconds) in the `endsAt` prop. The countdown will stop once it reaches 0. The `children` function is passed `secondsRemaining` and `msRemaining` numbers that you can use to render elements.
```js
import Countdown from 'react-countdown-rp';
// 10 second countdown
{({secondsRemaining, msRemaining}) => (
{secondsRemaining}
{msRemaining}
)}
```
| Prop name | Type | Required | Description |
| ----------- | ------ | -------- | ------------------------------------------------------------------------- |
| endsAt | number | yes | Millseconds representing the end date (e.g. `date.getTime()`) |
| children | func | yes | Called with object `{secondsRemaining, msRemaining}` as the only argument |
| onCompleted | func | no | Fired when the countdown reaches 0 |