Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

ios-react-time-picker

pool1129170MIT0.3.0TypeScript support: included

ios style time picker for React app.

react time picker, time picker, ios time picker, time picker react ios, wheel time picker, wheel picker, select time, select ios time picker

readme

ios-react-time-picker

ios style time picker for React app 😎.

ios-react-timer

 

install

npm i ios-react-time-picker

 

how to use

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

export default const  MyApp = () => {
   const [value, setValue] = useState('10:00');

   const onChange = (timeValue) => {
      setValue(timeValue);
   }

   return (
      <div>
         <TimePicker value={value} onChange={onChange} hourType={12} minType={1} />
      </div>
   );
}

 

Example

default 12-hour 24-hour
12hour demo 12hour demo 24hour demo
1-minutes 5-minutes 10-minutes
default demo 5minutes demo 10minutes demo

 

API

Name Type Default Description
value string N/A The current selected time in string format.
onChange Dispatch<SetStateAction<string>> N/A Function called when the time value changes.
hourType 12 | 24 24 Determines whether to use a 12-hour or 24-hour format for the time display.
minType 1 | 5 | 10 1 Interval for minutes, allowing 1, 5, or 10-minute increments.

 

License

The MIT License.