[Bug] Input placeholder for hours always shows as 12-hour clock format

[MakzaR]

Way to reproduce:

1. Pass HH:mm:ss string to DateField format prop:

return <DateField format={'HH:mm:ss'} ... />

2. Focus on created field.

Expected:
Input placeholder shows as is.

Actual result:
Input placeholder converts HH to hh.

Attachments:

The bug appears on all components using <DateField>:

• Date Field
• Date Picker
• Relative Date Field
• Relative Date Picker

I guess, the problem is with getSectionPlaceholder function as it uses hard-coded value from i18n:

• date-components/src/components/DateField/utils.ts

  Line 365 in e897f50

  return i18n('hour_placeholder').repeat(2);

• date-components/src/components/DateField/i18n/en.json

  Line 6 in e897f50

  "hour_placeholder": "h",

[MakzaR]

I've made a PR to fix this, but i can't link it to the issue: #161

[korvin89]

@MakzaR Hi! Sorry for long response.

Here's the deal: the characters that are used to form the placeholder have nothing to do with the actual format that is used for input. That is, for example, hh means that you need to enter two numbers to indicate the hour, and so on. Users of the interfaces that will be built using data-components most likely do not know anything about the difference between the 'HHandhh` formats in moment or dayjs. In this regard, we believe that it seems impractical to complicate the logic in this place, and users should communicate information about the input format in other more accessible ways - hints, using am/pm format, and so on.