Is there a way to have a DateRangePicker (x-date-pickers-pro) use the browsers current locale for date format?

[kristerkynning]

The problem in depth 🔍

I have a Web-UI where I don't know which locale or what language the users may be using, so I would prefer to just use whatever language/locale is configured in the browser to format the dates.

This seems to be exactly how it works for dates shown in Data Grids.

However I have DateRangePicker which defaults to "en_US". Setting it to a specific locale works fine, but is there an easy way to just use the browsers current locale?

EDIT: I should add, we are using date-fns for handling dates. The code for creating the DateRangePicker:

<LocalizationProvider dateAdapter={AdapterDateFns}>
    <DateRangePicker value={[startDate, endDate]} onChange={handleDateRangeChange} />
</LocalizationProvider>

Your environment 🌎

`npx @mui/envinfo`

``` Don't forget to mention which browser you used. Output from `npx @mui/envinfo` goes here. ```

/

Search keywords: daterangepicker locale Order ID: 70895

[alexfauquette]

The localization of the date is out of the scope of MUI. It's under the responsibility of the date library you picked (date-fns in your case)

The data grid works, because it's by default the native time picker (the <input type="date" />)

For the @mui/x-date-pickers the component relies on the date library to know what is the date format, what's the name of the months.

We provide a way to update the locale for each date library, but the strategy to pick the local according to user settings is up to you.

[flaviendelangle]

If this is a recurring pain in our community, I think we could make the bridge between our doc and the doc of the date libraries. We are doing it for the custom format [here] and for custom week start in #11223.

If this is not something a lot of people a struggling with, then we can just answer in the issue.

With that being said, I struggle to find the answer to this question for Date Fns, they don't seem to provide a way to get the locale code of the user system.

[alexfauquette]

On dayjs there is an open issue on this topic https://github.com/iamkun/dayjs/issues/732

[github-actions[bot]]

The issue has been inactive for 7 days and has been automatically closed. If you think that it has been incorrectly closed, please reopen it and provide missing information (if any) or continue the last discussion.