README
react-input-datepicker
A simple and reusable input datepicker component for React (Demo)
Install
npm install react-input-datepicker
Usage
import React, { useState, useCallback } from 'react';
import InputDatepicker from 'react-input-datepicker';
export const App = () => {
const [value, setValue] = useState<Date | null>();
const onDateChange = useCallback((date: Date) => {
setValue(date);
}, []);
return (
<InputDatepicker
value={value}
onDateChange={onDateChange}
minDate={new Date(1900, 0, 1)}
maxDate={new Date()}
/>
);
};
Available Props
Prop | Type | Default | Options |
---|---|---|---|
value | Date | - | - |
onDateChange | func | - | - |
minDate | Date | - | - |
maxDate | Date | - | - |
maxDateMessage | string | 'Date must be less than {maxDate + 1}' | - |
minDateMessage | string | 'Date must be greater than {minDate - 1}' | - |
invalidMessage | string | 'Not a valid date' | - |
showLabels | boolean | true | true, false |
showErrors | boolean | true | true, false |
showPlaceholders | boolean | true | true, false |
format | string | 'month/day/year' | 'day/month/year', 'day/year/month', 'month/day/year', 'month/year/day', 'year/month/day', 'year/day/month' |
labels | Object | English labels | { year: 'Year'; month: 'Month'; day: 'Day'; } |
License
MIT © JMcAmmond