Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[pickers] Remove reference of fields having dependant section behavior #8189

Closed
2 tasks done
Martin-Cox opened this issue Mar 9, 2023 · 3 comments · Fixed by mui/material-ui#36480
Closed
2 tasks done
Assignees
Labels
component: pickers This is the name of the generic UI component, not the React module! website Related to the marketing pages

Comments

@Martin-Cox
Copy link

Martin-Cox commented Mar 9, 2023

Duplicates

  • I have searched the existing issues

Latest version

  • I have tested the latest version

Steps to reproduce 🕹

Link to live example: https://mui.com/x/react-date-pickers/date-time-picker/#basic-usage (direct link: https://codesandbox.io/s/1m7pyd?file=/demo.tsx)

Steps:

  1. Open the "Basic usage" demo for the v6 DateTimePicker
  2. Enter the date/time "02/28/2023 01:01 AM" (28th February 2023)
  3. Select the "day" component (28)
  4. Press the Up arrow key to increment the day

Current behavior 😯

The date "resets" back to the 01st of February instead of rolling over to the 01st of March

Expected behavior 🤔

The date should roll over to the 01st of March

Context 🔦

The announcement for the v6 date/time pickers demonstrates this date/time "rollover" functionality. If you enter the same date into the demo field as in the reproduction steps and hit the Up arrow key the date changes to 01st March, instead of resetting back to the 01st February.

https://mui.com/blog/v6-beta-pickers/#enhanced-keyboard-usability
https://codesandbox.io/s/date-field-demo-pb87v0?from-embed=&file=/demo.tsx:32-112

@Martin-Cox Martin-Cox added the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label Mar 9, 2023
@MBilalShafi MBilalShafi added the component: pickers This is the name of the generic UI component, not the React module! label Mar 9, 2023
@LukasTy
Copy link
Member

LukasTy commented Mar 9, 2023

Thank you for opening this issue.
We recently changed this behavior.
The independent behavior is more correct compared to native date picker component implementations as well as from an accessibility point of view.

We'll update the blog entry to avoid this information discrepancy. 😉

@LukasTy LukasTy added docs Improvements or additions to the documentation and removed status: waiting for maintainer These issues haven't been looked at yet by a maintainer labels Mar 9, 2023
@LukasTy LukasTy added website Related to the marketing pages and removed docs Improvements or additions to the documentation labels Mar 9, 2023
@LukasTy LukasTy changed the title Missing date/time "rollover" functionality from the v6 date/time pickers announcement [pickers] Remove reference of fields having dependant section behavior Mar 9, 2023
@Martin-Cox
Copy link
Author

Martin-Cox commented Mar 9, 2023

Ah that's a shame, it was something we were hoping to use. One of the complaints with our current usage of the native Chrome date/time picker is that it doesn't rollover the dates, as users expect it behave like a calendar.

Is there a possibility this could ever return via an option? Other date/time pickers (e.g. Kendo UI) have this functionality https://demos.telerik.com/kendo-ui/datetimepicker/index

@LukasTy
Copy link
Member

LukasTy commented Mar 9, 2023

Is there a possibility this could ever return via an option?

We did consider it initially, but went for the independent approach, because of the mentioned reasons as well as the fact that it allowed us to clean up the code quite a bit.
We would consider bringing it back as an option if there is a high enough demand for it, but in essence, it's not the best approach considering the a11y implications it brings.

The fields have quite a lot of ways to change a value (number keys, arrow navigation, Page Up, PageDown, Home, End). Because of this reason, we feel that the drawbacks that having this behavior, would bring are not worth it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: pickers This is the name of the generic UI component, not the React module! website Related to the marketing pages
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants