DateTimePicker inconsistent time format 24h vs 12h format in Firefox

[fbucek]

What package has an issue

@mantine/core

Describe the bug

I cannot change format for TimeInput, but problem is that it does not work as expected and time format differs in Firefox

21:57 vs 09:57 PM

Main example: https://mantine.dev/dates/date-time-picker/

Would be nice to have posibility to force 24 or 12h format.

Often application are developed in one language only so automatic change base on localization can only cause problem.

What version of @mantine/hooks page do you have in package.json?

6.0.11

If possible, please include a link to a codesandbox with the reproduced problem

No response

Do you know how to fix the issue

No

Are you willing to participate in fixing this issue and create a pull request with the fix

None

Possible fix

No response

[rtivital]

DateTimePicker uses TimeInput component under the hood. TimeInput component is a native input[type="time"] – its format is based on user system language (as far as I know, this behavior cannot be changed). Formatted value of DateTimePicker can be changed with valueFormat prop – https://mantine.dev/dates/date-time-picker/#value-format

[fbucek]

Thanks for clariication. So only option for me is to create custom component, which wont use input[type="time"].
I would expect that both shown times are in 24 format or both in AM/PM or possible to change both, but DateTimePicker can change only part using valueFormat.

So problem is that time input using some kind of native implementation which is browser dependend and other is using different implementation which is browser independent.

[rtivital]

You can also try changing value format based on user locale

[guvenaltunsoyy]

Why does not support custom time formatter or rendering?