[pickers] Allow for hour and minutes selectors to not scroll to selected option

[rmojicacertinia]

Summary

Hi everyone! I have been worked with MUI components for a while and having a great experience overall. However, there is an interesting behaviour that I would like to ask you about.

When using a DateTimePicker, if you set a time and then interact with the component again, the management of the scroll may be confusing. The hours and minutes are scrolled so that the selected option is the first one showing from the top.

This behavior may look confusing for users since they may not notice that they can choose other options that are above the scroll. If, for instance, the default time is already set when first seeing the component, the user has no visual clue at first glance to know that there are more options available.

I think it would be nice to inlcude at least an option for the scroll to show the options above or not scrolling at all. It can be done as it is now manually modifying the code, but the modifications needed are quite clumsy and convoluted

Examples

You can test the current behavior on the MUI page, in the Basic usage example. Set the hour, and the minutest to the latest options available (the ones at the bottom, which should result in 11:55). When using the component again the 11 and 55 options should be at the top of the scroll and no other option visible without scrolling.

MUI page: https://mui.com/x/react-date-pickers/date-time-picker/

Motivation

I think it would be a great feature that will allow users to see more clearly what options are available for them on the DateTimePicker component.

Search keywords: DateTimePicker Scroll

[github-actions]

This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue.
Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.