mui-x
mui-x copied to clipboard
[pickers] Selected days not highlighted when using prop showDaysOutsideCurrentMonth
Duplicates
- [X] I have searched the existing issues
Latest version
- [X] I have tested the latest version
Steps to reproduce 🕹
Link to live example: DateRangePicker with showDaysOutsideCurrentMonth prop
Steps:
- Select the range 29/01/2023 - 04/02/2023
Current behavior 😯
When January is in view, only the days in January are highlighted. When February is in view, only the days in February are highlighted.
Expected behavior 🤔
When using DateRangePicker with the showDaysOutsideCurrentMonth prop, all selected days should be highlighted even if they are in different months
Context 🔦
I want the user to be able to automatically select a week after clicking on a day. When a day is clicked, the week including that day will be selected because in my context it only makes sense to select weeks, hence I used showDaysOutsideCurrentMonth. I am using DateRangePicker for this, not sure if there is a better component.
Your environment 🌎
npx @mui/envinfo
System:
OS: macOS 13.1
Binaries:
Node: 18.12.1 - /usr/local/bin/node
Yarn: 1.22.17 - /usr/local/bin/yarn
npm: 8.19.2 - /usr/local/bin/npm
Browsers:
Chrome: 110.0.5481.100
Edge: Not Found
Firefox: Not Found
Safari: 16.2
npmPackages:
@emotion/react: 11.10.4 => 11.10.4
@emotion/styled: 11.10.4 => 11.10.4
@mui/icons-material: 5.11.0 => 5.11.0
@mui/lab: 5.0.0-alpha.113 => 5.0.0-alpha.113
@mui/material: 5.11.1 => 5.11.1
@mui/system: 5.11.1 => 5.11.1
@mui/types: 7.2.3 => 7.2.3
@mui/x-data-grid: 6.0.0-alpha.14 => 6.0.0-alpha.14
@mui/x-data-grid-generator: 6.0.0-alpha.14 => 6.0.0-alpha.14
@mui/x-data-grid-premium: 6.0.0-alpha.14 => 6.0.0-alpha.14
@mui/x-data-grid-pro: 6.0.0-alpha.14 => 6.0.0-alpha.14
@mui/x-date-pickers: 6.0.0-alpha.15 => 6.0.0-alpha.15
@mui/x-date-pickers-pro: 6.0.0-alpha.15 => 6.0.0-alpha.15
@types/react: 18.0.27 => 18.0.27
react: 18.2.0 => 18.2.0
react-dom: 18.2.0 => 18.2.0
styled-components: 5.3.5 => 5.3.5
typescript: 5.0.0-dev.20230217 => 5.0.0-dev.20230217
Used Chrome
Order ID 💳 (optional)
54728