requested changes

Author: thijssteel

demo/src/components/Main.js

@@ -74,7 +74,7 @@ export default class Main extends Component {
       },
       dateRangeWithDisabled: {
         selection: {
-          startDate: new Date(new Date().getTime() + 24 * 60 * 60 * 1000),
+          startDate: addDays(new Date(), 4),
           endDate: null,
           key: 'selection',
         },
@@ -345,8 +345,8 @@ export default class Main extends Component {
             moveRangeOnFirstSelection={false}
             ranges={[this.state.dateRangeWithDisabled.selection]}
             className={'PreviewArea'}
-            disabledDates={[new Date()]}
-            minDate={new Date(new Date().getTime() - 3 * 24 * 60 * 60 * 1000)}
+            disabledDates={[new Date(), addDays(new Date(), 3)]}
+            minDate={addDays(new Date(), -3)}
           />
         </Section>
       </main>

src/components/Calendar.js

@@ -116,7 +116,7 @@ class Calendar extends PureComponent {
       setTimeout(() => this.focusToDate(this.state.focusedDate), 1);
     }
   }
-  UNSAFE_componentWillReceiveProps(nextProps) {
+  componentWillReceiveProps(nextProps) {
     const propMapper = {
       dateRange: 'ranges',
       date: 'date',

src/components/DateRange.js

@@ -3,7 +3,15 @@ import PropTypes from 'prop-types';
 import Calendar from './Calendar.js';
 import { rangeShape } from './DayCell';
 import { findNextRangeIndex, generateStyles } from '../utils.js';
-import { isBefore, differenceInCalendarDays, addDays, min, isWithinInterval } from 'date-fns';
+import {
+  isBefore,
+  differenceInCalendarDays,
+  addDays,
+  min,
+  isWithinInterval,
+  isAfter,
+  max,
+} from 'date-fns';
 import classnames from 'classnames';
 import coreStyles from '../styles';
 
@@ -45,9 +53,9 @@ class DateRange extends Component {
     }
 
     // reverse dates if startDate before endDate
-    let hasBeenReversed = false;
+    let isStartDateSelected = focusedRange[1] === 0;
     if (isBefore(endDate, startDate)) {
-      hasBeenReversed = true;
+      isStartDateSelected = !isStartDateSelected;
       [startDate, endDate] = [endDate, startDate];
     }
 
@@ -59,12 +67,10 @@ class DateRange extends Component {
     );
 
     if (inValidDatesWithinRange.length > 0) {
-      if (hasBeenReversed) {
-        const minDate = new Date(Math.min.apply(null, inValidDatesWithinRange));
-        startDate = new Date(minDate.getTime() + 24 * 60 * 60 * 1000);
+      if (isStartDateSelected) {
+        startDate = addDays(max(disabledDates.filter(date => isBefore(date, endDate))), 1);
       } else {
-        const maxDate = new Date(Math.max.apply(null, inValidDatesWithinRange));
-        endDate = new Date(maxDate.getTime() - 24 * 60 * 60 * 1000);
+        endDate = addDays(min(disabledDates.filter(date => isAfter(date, startDate))), -1);
       }
     }
 
@@ -102,7 +108,7 @@ class DateRange extends Component {
     this.props.onRangeFocusChange && this.props.onRangeFocusChange(focusedRange);
   }
   updatePreview(val) {
-    if (!val || !val.wasValid) {
+    if (!val) {
       this.setState({ preview: null });
       return;
     }