Time picker for React.js
This is a fork from rc-time-picker, which is no longer maintained. I have also mixed styling support from time-picker-io.
- Uses native date object
- Dropdown based hours, minutes, seconds & meridiem selection.
- Keyboard navigation
- Similar API as
rc-time-picker
- Written with Typescript, with built-in typings
npm i --save react-samay
import { TimePicker } from 'react-samay';
import ReactDOM from 'react-dom';
// import css file
import 'react-samay/index.css';
ReactDOM.render(
<TimePicker
value={new Date()}
onChange={(date) => {
console.log(date);
}}
/>,
<div id="app" />,
);
You can find more storybook examples here.
Name | Type | Default |
---|---|---|
prefixCls | String | 'react-samay' |
disabled | Boolean | false |
open | Boolean | false |
defaultValue | Date | null |
defaultOpenValue | Date | new Date() |
value | Date | null |
placeholder | String | '' |
className | String | '' |
inputClassName | String | '' |
name | String | - |
id | String | '' |
showHour | Boolean | true |
showMinute | Boolean | true |
showSecond | Boolean | true |
format | String | - |
disabledHours | Function | - |
disabledMinutes | Function | - |
disabledSeconds | Function | - |
use12Hours | Boolean | false |
hideDisabledOptions | Boolean | false |
onChange | Function | null |
onAmPmChange | Function | null |
onOpen | Function({ open }) | |
onClose | Function({ open }) | |
hourStep | Number | 1 |
minuteStep | Number | 1 |
secondStep | Number | 1 |