feat(mat-datepicker): Allow mat-datepicker to be always visible

[angelaki]

Feature Description

Right now the datepicker shows only up on clicking the toggle button (or implementing some own logic). I'd love the picker to always show up if the bound control is focused.

I've tried to achieve this using a custom directive, but there are so many caveats. I'd like the focus to stay in the input and tabbing away to close it. But using the blur event doesn't work since selecting a date blurs the control, too.

Use Case

I want to make users aware of the possibility to just pick a date while keeping the comfort of filling a form by keyboard / tab only.

[crisbeto]

Right now the datepicker shows only up on clicking the toggle button (or implementing some own logic). I'd love the picker to always show up if the bound control is focused.

This should be possible already by calling the open method in the focus handler.

I've tried to achieve this using a custom directive, but there are so many caveats. I'd like the focus to stay in the input and tabbing away to close it. But using the blur event doesn't work since selecting a date blurs the control, too.

Do you mean opening the calendar while still keeping focus in the input, or using a datepicker input without a calendar? The former would break the accessibility of the datepicker since the user wouldn't know that the popup is there.

[angelaki]

Using the open method in focus moves the focus to the picker. So the user won't be able to just enter a date by keyboard. And yes, moving the focus back to the input works but breaks the accessibility a bit - just to name one of the caveats.

I want the picker to show up if the input is focused. No overlay, nothing. Just the option / hint to be able to pick a date with the mouse or keep on entering by keyboard and tabbing to the next input control.