useStopwatch

Hook that creates a stopwatch functionality

time

test coverage

Last changed: last month

Installation

Library

CLI

Manual

import { useStopwatch } from '@siberiacancode/reactuse';

Usage

const { seconds, minutes, start, pause, reset } = useStopwatch(1000, { enabled: false });
// or
const { seconds, minutes, start, pause, reset } = useStopwatch({ initialTime: 1000, enabled: false });

Demo

source

Api

Parameters

Name	Type	Default	Note
initialTime?	number	0	The initial time of the timer
options.enabled?	boolean	true	The enabled state of the timer

Returns

UseStopwatchReturn

Parameters

Name	Type	Default	Note
options.initialTime?	number	0	-The initial time of the timer
options.enabled?	boolean	true	The enabled state of the timer

Returns

UseStopwatchReturn

Type declaration

export interface UseStopwatchReturn {
  /** The total count of the stopwatch */
  count: number;
  /** The day count of the stopwatch */
  days: number;
  /** The hour count of the stopwatch */
  hours: number;
  /** The minute count of the stopwatch */
  minutes: number;
  /** The over state of the stopwatch */
  over: boolean;
  /** The paused state of the stopwatch */
  paused: boolean;
  /** The second count of the stopwatch */
  seconds: number;
  /** The function to pause the stopwatch */
  pause: () => void;
  /** The function to reset the stopwatch */
  reset: () => void;
  /** The function to start the stopwatch */
  start: () => void;
  /** The function to toggle the stopwatch */
  toggle: () => void;
}

export interface UseStopwatchOptions {
  /** The enabled state of the timer */
  enabled?: boolean;
}

interface UseStopwatch {
  (initialTime?: number, options?: UseStopwatchOptions): UseStopwatchReturn;
  (options?: UseStopwatchOptions & { initialTime?: number }): UseStopwatchReturn;
}

Source

Source • Demo

Contributors

D

debabin

S

sereda