Clay: [Date Picker] Unexpected behavior using keyboard arrows

[drakonux]

Reviewing the current behavior of the date picker component I noticed that the calendar behaves in a different way I expected:

Steps to Reproduce

1. Open the calendar
2. Click on a date
3. Click on the input (to change manually the date)
4. Press the right arrow ➡️
5. Click on the input (to change manually the date)
6. Press the right arrow ➡️
7. ~Delete the date~

Expected behavior

1. Pressing ⬅️ ➡️ moves left/right one char position the cursor

2. Besides, when the cursor is placed:

AT THE START of the string:

• Pressing ⬆️ or ⬅️: nothing
• Pressing ⬇️ : move the cursor to the end of the string

AT THE END of the string:

• Pressing ⬆️ : move the cursor to the start of the string
• Pressing ⬇️ or ➡️ : nothing

cc\ @marcoscv-work

[matuzalemsteles]

I think this is related to the focus control that we have enabled for Date Picker to also use the arrow keys, I think we can disable it for now.

[drakonux]

I thought the keyboard support for the "calendar" is important. Are you suggesting disabling that? that will deteriorate the accessibility of the component, isn't it?

[matuzalemsteles]

Well, partially, what I am suggesting would be to disable the focus via the arrows but it will still allow the focus with tab and tab + shift.

[drakonux]

I'm still not sure of doing it but if you see it clear, go on.

ps. We should have the focus behavior defined, but I'm afraid we don't have it.

[marcoscv-work]

Probably we would need to disable the current focus control and create a specific behavior for data piker

[matuzalemsteles]

Yeah, it won't cause so much trouble because we still have the focus. But yes, we need more details about the behavior of focus in Date Picker so that we can improve this in Date Picker and maybe also for Color Picker.

Some libraries implement different focus behaviors on Date Picker, when there is a little time left (when passing this migration that I'm working on), I can bring up some use cases so that we can think about it more.

[github-actions[bot]]

This issue has been merged and will be released in DXP at https://issues.liferay.com/browse/LPS-128920