fix-unsafe-lifecycles (#1374)

- change componentWillReceiveProps to componentDidUpdate
- update .eslintrc

.eslintrc

@@ -31,8 +31,8 @@
     "react/jsx-uses-vars": 2,
     "react/no-danger": 2,
     "react/no-deprecated": 2,
-    "react/no-did-mount-set-state": 2,
-    "react/no-did-update-set-state": 2,
+    "react/no-did-mount-set-state": 0,
+    "react/no-did-update-set-state": 0,
     "react/no-direct-mutation-state": 2,
     "react/no-multi-comp": 2,
     "react/no-set-state": 0,

src/calendar.jsx

@@ -142,20 +142,20 @@ export default class Calendar extends React.Component {
     }
   }
 
-  componentWillReceiveProps(nextProps) {
+  componentDidUpdate(prevProps) {
     if (
-      nextProps.preSelection &&
-      !isSameDay(nextProps.preSelection, this.props.preSelection)
+      this.props.preSelection &&
+      !isSameDay(this.props.preSelection, prevProps.preSelection)
     ) {
       this.setState({
-        date: this.localizeDate(nextProps.preSelection)
+        date: this.localizeDate(this.props.preSelection)
       });
     } else if (
-      nextProps.openToDate &&
-      !isSameDay(nextProps.openToDate, this.props.openToDate)
+      this.props.openToDate &&
+      !isSameDay(this.props.openToDate, prevProps.openToDate)
     ) {
       this.setState({
-        date: this.localizeDate(nextProps.openToDate)
+        date: this.localizeDate(this.props.openToDate)
       });
     }
   }

src/index.jsx

@@ -11,6 +11,7 @@ import {
   isDate,
   isBefore,
   isAfter,
+  equals,
   setTime,
   getSecond,
   getMinute,
@@ -52,6 +53,14 @@ function hasPreSelectionChanged(date1, date2) {
   return date1 !== date2;
 }
 
+function hasSelectionChanged(date1, date2) {
+  if (date1 && date2) {
+    return !equals(date1, date2);
+  }
+
+  return false;
+}
+
 /**
  * General datepicker component.
  */
@@ -179,19 +188,24 @@ export default class DatePicker extends React.Component {
     this.state = this.calcInitialState();
   }
 
-  componentWillReceiveProps(nextProps) {
+  componentDidUpdate(prevProps, prevState) {
     if (
-      this.props.inline &&
-      hasPreSelectionChanged(this.props.selected, nextProps.selected)
+      prevProps.inline &&
+      hasPreSelectionChanged(prevProps.selected, this.props.selected)
     ) {
-      this.setPreSelection(nextProps.selected);
+      this.setPreSelection(this.props.selected);
     }
-    if (this.props.highlightDates !== nextProps.highlightDates) {
+    if (prevProps.highlightDates !== this.props.highlightDates) {
       this.setState({
-        highlightDates: getHightLightDaysMap(nextProps.highlightDates)
+        highlightDates: getHightLightDaysMap(this.props.highlightDates)
       });
     }
-    if (!this.state.focused) this.setState({ inputValue: null });
+    if (
+      !prevState.focused &&
+      hasSelectionChanged(prevProps.selected, this.props.selected)
+    ) {
+      this.setState({ inputValue: null });
+    }
   }
 
   componentWillUnmount() {