1.2.1 • Published 3 years ago
react-time-picker-mbalza v1.2.1
React Samay
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.
Features
- 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
Install
npm i --save react-samayUsage
import { TimePicker } from 'react-samay';
import ReactDOM from 'react-dom';
ReactDOM.render(
<TimePicker
value={new Date()}
onChange={(date) => {
console.log(date);
}}
/>,
<div id="app" />
);You can find more storybook examples here.
API
TimePicker
| 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 |