react-time-picker-lite v1.0.3

react-time-picker-lite

A simple, lightweight React time picker. Requires React 16.8.0 or higher.

• Supports typed input only (no dropdowns).
• Rejects input characters that would create an invalid time sting, and resets if input is not a complete, valid time string when unfocussed.
• Try demo here

Installation

npm install react-time-picker-lite

Basic Example

import React, { useState } from 'react';
import TimePicker from 'react-time-picker-lite';

function App() {
  const [timeMessage, setTimeMessage] = useState(null);
  const [errorMessage, setErrorMessage] = useState(null);
  
  const handleSuccess = (hhmmString) => {
    setTimeMessage(`Time is set to ${hhmmString}.`);
    setErrorMessage(null);
  };

  const handleError = () => {
    setErrorMessage('Please insert a valid time.');
    setTimeMessage(null);
  };

  return (
    <div>
      <TimePicker
        onSuccess={handleSuccess}
        onError={handleError}
      />
      {timeMessage || errorMessage || ''}
    </div>
  );
}

Props