1.1.0 • Published 5 years ago

use-clock v1.1.0

Weekly downloads
24
License
MIT
Repository
github
Last release
5 years ago

use-clock

React Hook for sharing clock logic with timezone capabilities

NPM JavaScript Style Guide

Install

npm install --save use-clock

Usage

import React from 'react';
import useClock from 'use-clock';

function App() {
  const { time, onTimezone, raw } = useClock("HH:mm:ss");
  const londonTime = onTimezone("Europe/London");
  const brasiliaTime = onTimezone("America/Sao_Paulo");
  return (
    <div>
      <div><b>Computer time:</b> {time}</div>
      <div><b>London time:</b> {londonTime}</div>
      <div><b>Brasilia time:</b> {brasiliaTime}</div>
      <div><b>Raw time:</b> {raw.format("dddd, MMMM Do YYYY, h:mm:ss a")}</div>
    </div>
  );
}

export default App;

useClock(<format: String>, <period: Number>)

ParamTypeDefaultDescription
formatString"DD/MM/YYYY HH:mm:ss"Any string accepted by moment.format
periodNumber1000Time, in miliseconds, that the clock is updated

onTimezone(<timezone: String>)

ParamTypeDefaultDescription
timezoneStringComputer timezone as per moment.tz.guess()Any string accepted as a timezone

Dependency

This package has moment-timezone as a dependency, which increases the bundle size significantly. Beware if it's a concern!

In the future, we may switch to a more lightweight dependency such as date-fns. Feel free to contribute!

License

MIT © rafaelquintanilha