diff --git a/src/DateRangePickerInput/makeStories.js b/src/DateRangePickerInput/makeStories.js index 1116cc3..09ea5d5 100644 --- a/src/DateRangePickerInput/makeStories.js +++ b/src/DateRangePickerInput/makeStories.js @@ -33,11 +33,38 @@ export default (storiesOf, { onToDateChange={action('onToDateChange')} /> )) - .add('same day', () => ( + .add('range max 0', () => ( + )) + .add('range max 5', () => ( + + )) + .add('range min 2 max 5', () => ( + = 0 ? this.props.range.min : 1, + max: this.props.range.max >= 1 ? this.props.range.max : Infinity, + }; } componentDidMount() { @@ -104,7 +109,6 @@ class DateRangePickerInput extends React.Component { onDateRangeChange, onFromDateChange, onToDateChange, - minRange, } = this.props; const { formik } = this.context; @@ -145,7 +149,8 @@ class DateRangePickerInput extends React.Component { }); } } else if (isOpen === 'to') { - if (dateFnsDifferenceInCalendarDays(day, from) >= minRange) { + const selectionRange = dateFnsDifferenceInCalendarDays(day, from); + if (inRange(selectionRange, this.range.min, this.range.max + 1)) { this.setState({ isOpen: false, to: day, @@ -377,8 +382,11 @@ DateRangePickerInput.propTypes = { from: PropTypes.bool, to: PropTypes.bool, }), + range: PropTypes.shape({ + min: PropTypes.number, + max: PropTypes.number, + }), format: PropTypes.string, - minRange: PropTypes.number, fromMonth: PropTypes.instanceOf(Date), toMonth: PropTypes.instanceOf(Date), modifiers: PropTypes.object, @@ -426,7 +434,6 @@ DateRangePickerInput.defaultProps = { from: false, to: false, }, - minRange: 1, format: 'YYYY-MM-DD', onDateRangeChange: () => {}, onFromDateChange: () => {}, diff --git a/src/utils/inRange.js b/src/utils/inRange.js new file mode 100644 index 0000000..07d0293 --- /dev/null +++ b/src/utils/inRange.js @@ -0,0 +1 @@ +export default from 'lodash/inRange';