JSPM

react-human-timer

1.0.1
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • 0
  • Score
    100M100P100Q23418F
  • License MIT

React component wrapper for human-timer: tiny, human readable timer with no external dependencies. Specify the duration in seconds, add callbacks to timer ticks and end, stop it at any moment.

Package Exports

  • react-human-timer

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-human-timer) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-human-timer

React component wrapper for human-timer: tiny, human readable timer with no external dependencies. Specify the duration in seconds, add callbacks to timer ticks and end, stop it at any moment.

Here's the main human-timer library


Installation:

npm install --save react-human-timer

Test

npm run test


Usage:

 <HumanTimer 
    onTick={(timer) => console.log("tick", timer)} 
    onEnd={(timer) => console.log("end", timer)} 
    active={true} // set to false to pause the timer, default is true
    zeroes={false}  // won't turn 5 mins into 05 mins, default is true
    seconds={7200} // 2 hour long duration
>
    {
        (timer) => (
            <div>
                <p>Hours: {timer.hours}</p>
                <p>Minutes: {timer.minutes}</p>
                <p>Seconds: {timer.seconds}</p>
            </div>
        )
    }
</HumanTimer>

Is there something wrong?

Please tell me!