DayPickerInput: While editing input, onBlur does not reset its state

[apalanki]

This sandbox could be used to reproduce this issue: https://codesandbox.io/s/n915z85krm

To reproduce:
Delete the day manually and tab out. The input component has invalid date thats hard to reset.

Analysis:
Since the change handlers are only triggered when the change is valid, the parent component's state does not reflect the state internal to the input, hence cannot rerender the input component.

Proposed Fix:
Reset the input box's state with value prop while triggering onBlur event. As mentioned in issue: #600, we need to filter events triggered by month change buttons in onBlur and reset state on rest.

onBlur = (event) => {
  if (!(event.relatedTarget && event.relatedTarget.classList.contains('DayPicker-Day'))) {
     // The navigation button events are filtered by ^ check
     // Reset input state with prop value
     // Call onBlur prop with event       
   }
}

I can look at creating PR this evening. This would fix #600 as well.

[gpbl]

This sandbox could be used to reproduce this issue: https://codesandbox.io/s/n915z85krm

To reproduce:
Delete the day manually and tab out. The input component has invalid date thats hard to reset.

I'm not sure what do you mean here: The input component has invalid date thats hard to reset.

Please use this code sandbox with the latest version: https://codesandbox.io/s/m7jqv6yyjy The day onDayChange is logged as undefined if the inputted day is invalid. What should happen when I delete the day manually and press the TAB key instead?

I'm closing this, I'll reopen if I can understand better the problem :)