@sakit-sa/countdown-timer NPM

@sakit-sa/countdown-timer

Simple, easy countdown timer for React

Countdown timer

Spinner gif

Live Playground

For examples of the countdown-timer in action, go to https://abdilar.github.io/countdown-timer.

To run that demo on your own computer:

Clone this repository
npm install
npm run storybook
Visit http://localhost:6006/

Getting Started

Install

npm install @sakit-sa/countdown-timer

Usage

import CountdownTimer from '@sakit-sa/countdown-timer';

<CountdownTimer 
  time={90}
  format="[hh]:[mm]:[ss]"
  onComplete={() => console.log("The timer completed")} 
/>

Props

Name	Type	Default	Description
id	`string`	`countdown-timer-[random-number]`	The unique identifier for the component.
className	`object`	`{}`	Apply a className to the control
time	`number`	`required`	The value of the timer base on second.
format	`string`	`HH:MM:SS`	Formats a time value.
onComplete	`function`	`-`	Trigger when timer is zero.

Format Token

Token	Description
HH	`Hours` leading zero for single-digit hours.
hh	`Hours` no leading zero for single-digit hours.
MM	`Minute` leading zero for single-digit minute.
mm	`Minute` no leading zero for single-digit minute.
SS	`Second` leading zero for single-digit second.
ss	`Second` no leading zero for single-digit second.