countdown-timer-mui

This library is Countdown Timer

Component by MUI, @mui/material

countdown-timer-mui

Support ReactJS, NextJS

Getting started

npm i countdown-timer-mui

or

yarn add countdown-timer-mui

How to use

ReactJS

import { CountDownTimer } from "countdown-timer-mui"

NextJS

import dynamic from "next/dynamic";
const CountDownTimer = dynamic(
  () => import("countdown-timer-mui").then((mod) => mod.CountDownTimer),
  { ssr: false }
);

Example

<CountDownTimer
    display={true}
    containerStyle={{}}
    targetDate={"2023-12-01T00:00:00.000Z"}
    daysType={"d"}
    hoursType={""}
    minutesType={""}
    secondsType={""}
    timerContainerStyles={{}}
    timerFontStyles={{}}
    formatBetween={":"}
    formatBetweenStyle={{}}
/>

Attribute

Attribute	type	options	description
display	bool
containerStyle	object	sx props
targetDate	string	date format	date time format
daysType, hoursType, minutesType, secondsType	string	ex. "days", "hr", "minutes", "ss"	text after timer
timerContainerStyles	object	sx props
timerFontStyles	object	sx props
formatBetween	string	ex. ":", "-", "/"	text display between each container
formatBetweenStyle	object	sx props