Refine datepicker keyboard navigation

[maxokorokov]

Bug description

Currently the datepicker doesn't handle focus well at the navigation level (year, month, next, previous) as the whole ngb-datepicker element handles both keyboard and focus.

For instance clicking on the year select box will cause the focus to be lost, clicking on arrows will not cause this.

More importantly you loose the ability to use keyboard on select boxes and next/previous buttons.

See any demo here: https://ng-bootstrap.github.io/#/components/datepicker/examples

Proposed solution

See the screenshot below:

• Handle the keyboard navigation only inside the green area
• Handle focusing at the day (1) level, not at the datepicker level
• The focus should move in the order (1)-(2)-(3)-(4)-(5) defined on screen (we shouldn't care about what is inside navigation bar anymore)

[hvinh]

Hello,

The focus order should follow the visual reading order, so maybe 2-3-4-5-1 instead of 1-2-3-4-5

https://www.w3.org/TR/2016/NOTE-WCAG20-TECHS-20161007/C27

Kind regards