Typing any characters in SingleDatePickerInput cause an error

[lucaprevitali]

Typing any characters in SingleDatePickerInput cause an error

Detailed description

Describe in detail the issue you're having.

Like the title say if a user types any character in the SingleDatePickerInput component a TypeError will be raised, the message is:

date.format is not a function at SingleDatePickerInputController.getDateString (vendors~main.b7d6788d.iframe.bundle.js:2) at SingleDatePickerInputController.render (vendors~main.b7d6788d.iframe.bundle.js:2)
I think that Moment is trying to parse a not Moment object, a solution can be to use isValid method of Moment before format the input

Is this a feature request (new component, new icon), a bug, or a general issue?

Bug

Is this issue related to a specific component?

SingleDatePickerInput

What did you expect to happen? What happened instead? What would you like to see changed?

Having no error when a user type in this component.
In addition, for my use case the input of this component could be readOnly. Would be cool if there was a prop readOnly for this component.

What browser are you working in?

Chrome 95

What version of the WFP UI (Carbon Design System) are you using?

1.4.0. But the bug is visible also in the documentation with version 1.20.3

Steps to reproduce the issue

1. Go to https://uikit.wfp.org/docs/index.html?path=/docs/components-ui-elements-datepicker--single-date-picker-default
2. Scroll to "Date Picker Hook Form" section
3. Type any character in the date input

[Utzel-Butzel]

@lucaprevitali There was another issue which ist now also fixed. https://uikit.wfp.org/next-docs/index.html?path=/docs/components-ui-elements-datepicker--single-date-picker-default

If you need a readOnly state it would be best if you implement it on your side. Disabled should be already possible. react-dates/react-dates#660