1.1.1 • Published 5 years ago

use-countdown v1.1.1

Weekly downloads
3
License
ISC
Repository
github
Last release
5 years ago

use-countdown

Installation

npm install --save use-countdown

Usage

  • useCountdown

    import React from 'react'
    import { useCountdown } from 'use-countdown'
    
    export const Countdown = () => {
      const ms = useCountdown({
        targetTime: new Date(2100, 08, 12).getTime(),
        interval: 1000, // default
      })
    
      return (
        <React.Fragment>
          <h1>Countdown</h1>
          <p>{ms}</p>
        </React.Fragment>
      )
    }
  • useFormattedCountdown

    import React from 'react'
    import { useFormattedCountdown } from 'use-countdown'
    
    export const Countdown = () => {
      const countdown = useFormattedCountdown({
        targetTime: new Date(2100, 08, 12).getTime(),
        interval: 1000,
        includeSymbols: ['d', 'h', 'm'],
        separator: ' - ',
      })
      // will return like: 99d - 10h - 16m
    
      return (
        <React.Fragment>
          <h1>Formatted Countdown</h1>
          <p>{countdown}</p>
        </React.Fragment>
      )
    }

Options

export interface CountdownOptions {
    readonly targetTime: number;
    readonly interval?: number;
}

export interface FormattedCountdownOptions extends CountdownOptions {
    readonly includeSymbols?: Array<'d' | 'h' | 'm' | 's'>;
    readonly separator?: string;
}