Datepicker: Unable to enter date manually

[chuyler]

As seen from demo page: https://react.lightningdesignsystem.com/components/date-pickers/

Click on the date picker component and start entering a date using the keyboard

Expected: the characters should be displayed as typed in, date picker component should close, user should be able to continue to enter numeric and date format characters based on locale ( 0-9 / - etc).

Actual: As soon as first numeric character is entered, the date is auto-completed to the first day of the first month of this year. Enter "1" and it fills in "1/1/2021". Enter "2" and it fills in "2/1/2021". You cannot modify this date without it continuing to change it on you.

This was previously reported 2 years ago but has not been properly resolved.
#2285

[welcome]

Thanks for opening your first issue! 👋
If you have found this library helpful, please star it. A maintainer will try to respond within 7 days. If you haven’t heard anything by then, please bump this thread.

[interactivellama]

The previous bug removed focus from the input, but great call out on the example. Would changing state on focus blur of the input fix the issue instead of the onChange event?

[chuyler]

That may solve it. As long as the user can finish typing in the date before it attempts to format it should be fine.

[abusarah-tech]

@chuyler If you look at the examples on storybook, you should be able to see an example that uses a custom input. In the documentation they point out to the examples as well to get more familiar with the library. I made an example on how you should use it.

[chuyler]

@Abuhafsa Your example suffers from the same bug. Regardless of what is used for an input, when the user types in a single character into the text box, it tries to format the date. It needs to wait until all characters have been entered before triggering the formatter. I tried using "onBlur" instead of "onChange" to update the state but that doesn't work either.

[stale]

This issue has been automatically marked as stale, because it has not had recent activity. It will be closed if no further activity occurs. Maintainers are responsible for tech debt and project health. This is most likely a new components or component feature request. Please submit a pull request for or request feedback on this feature. Thank you.

[chuyler]

I have made an attempt at fixing this so our customers can enter dates manually. Please review the fix and suggest improvements.

[brahimkraiem]

Hello, anyone has resolved this feature ?

[chuyler]

@brahimkraiem see my pull request above that has not been merged. If you can convince them to merge it, we'll have this working.

[anujsingla]

@interactivellama
I hope you are doing well.
Could you please take this issue on priority? Actually, we are facing this issue and the user is not able to edit the date manually.
Please let me know if I can take this issue

[chuyler]

Is this package still under development? How has no one else prioritized the ability to change dates? I provided a solution but no one is willing to review and merge it.