Reason bindings for react-dates
Reason bindings for react-dates.
🚧 🏗
Status It is not completed, we are adding bindings as we go. Doesn't follow semver.
npm
Installation,yarn add @ahrefs/bs-react-dates
npm install --save @ahrefs/bs-react-dates
Then add @ahrefs/bs-react-dates
to bs-dependencies
in your bsconfig.json
:
{
...
"bs-dependencies": ["@ahrefs/bs-react-dates"]
}
To include styles
[%bs.raw {|require('react-dates/lib/css/_datepicker.css')|}];
react-dates
assumes that box-sizing: border-box
is set globally in your page's CSS. At least do this, to make it display properly.
.DateRangePicker *,
.SingleDatePicker *,
.DayPickerRangeController * {
box-sizing: border-box;
}
Examples
[%bs.raw {|require('react-dates/lib/css/_datepicker.css')|}];
[@react.component]
let make = () => {
let (dates, setDates) = React.useState(_ => DateRangePicker.Dates.{startDate: None, endDate: None});
let (focusedInput, setFocusedInput) = React.useState(_ => None);
<DateRangePicker
startDate=?{dates.startDate}
startDateId="startDateId"
endDate=?{dates.endDate}
endDateId="endDateId"
?focusedInput
onDatesChange={v => setDates(_ => v)}
onFocusChange={v => setFocusedInput(_ => v)}
isOutsideRange={_day => false}
/>;
};
TODO
- [x] DateRangePicker
- [x] SingleDatePicker
- [x] DayPickerRangeController
- [ ] can/should I remove dep on
bs-moment
?