Otp-timer-ts NPM

otp-timer-ts

A simple and customizable react otp timer component with typescript support. very simple and more customizable design and smallest bundle size about 13kb. You can use this component into any react and nextjs projects.

SSR Friendly
Customizable
TypeScript Support
Smallest Bundle Size(About 13kb)

Installation

$ npm i otp-timer-ts --save

Demo

Usage?

import { Otptimer } from "otp-timer-ts";

const Home = () => {
  const handleResend = () => {
    //desired function to be performed on clicking resend button
  }
  return (
    <div>
      <Otptimer minutes={0} seconds={5} onResend={handleResend} />
    </div>
  );
};

export default Home;

Options

name	Description	Default Value
seconds	number of seconds for which timer must be set	30
minutes	number of minutes for which the timer must be set	0
onResend	function that would get triggered on clicking the resend button	n/a
text	content that you want to put down	Resend otp in
ButtonText	button text	Resend
showSpinner	If you want to show any button loading	false
fetching	If you want to show any button loading icon with fetching state	false
spinnerComponent	Your custom spinner component for render	null