Get unlimited public & private packages + team-based management with npm Teams.Learn more »

use-timer

1.0.7 • Public • Published

use-timer

npm Version License Linux Build Status Bundle size Bundle size

Simple timer turned into React Hooks. Read about Hooks feature.

Installation

npm i use-timer --save

Examples

Try demo here: https://stackblitz.com/edit/use-timer.

Usage

Basic timer

import React from 'react';
import { useTimer } from 'use-timer';
 
const App = () => {
  const { time, start, pause, reset } = useTimer();
 
  return (
    <React.Fragment>
      <div>
        <button onClick={start}>Start</button>
        <button onClick={pause}>Pause</button>
        <button onClick={reset}>Reset</button>
      </div>
      <p>Elapsed time: {time}</p>
    </React.Fragment>
  );
};

Decremental timer

const { time, start, pause, reset } = useTimer({
  initialTime: 100,
  timerType: 'DECREMENTAL',
});

Timer with end time

const { time, start, pause, reset } = useTimer({
  endTime: 30,
  initialTime: 10,
});

Configuration

The configuration and all its parameters are optional.

Property Type Default value Description
endTime number null the value for which timer stops
initialTime number 0 the starting value for the timer
interval number 1000 the interval in milliseconds
step number 1 the value to add to each increment / decrement
timerType string "INCREMENTAL" the choice between a value that increases ("INCREMENTAL") or decreases ("DECREMENTAL")

Install

npm i use-timer

DownloadsWeekly Downloads

335

Version

1.0.7

License

ISC

Unpacked Size

18.8 kB

Total Files

14

Last publish

Collaborators

  • avatar