React Live-Time

A simple time-ago component for React. Made with ❤️ using hooks!

Table of Contents

• Installation
• Usage
• Props
• Date Formats
• Examples

Installation

Using NPM:

npm i react-live-time

Using Yarn:

yarn add react-live-time

Usage

import React from 'react';
import ReactLiveTime from 'react-live-time';

function MyApp() {
  return <ReactLiveTime time={Date.now()} />;
}

Props

Name	Type	Default	Description
time	Date/Number	undefined	The value to be converted into timeago.
format	String	isoDateTime	The format of the displayed date. This is only valid for dates 24-hours and over.
showSeconds	Boolean	false	Controls whether to show x seconds ago.. and maintain a timer for it.
className	String	undefined	Specify a custom class to the inner element.
id	String	undefined	Specify a custom ID to the inner element.
style	Object	undefined	Specify custom inline styles to the inner element.
renderer	Function	undefined	A custom renderer, which gets all the following data as render props: {time, status, text, format }

Date Formats

The format props supports a large number of date formats. It relies on dateformat package. You can find the list of mask options and the predefined named formats.

Examples

There is a basic example up and running on the GitHub pages.

License

GPL-3.0 © samrith-s