What is the best mask to handle durations (ISO 8601)

[sneko]

Hi,

I would like to have a duration field, I thought about common "timepicker" components to hack the UI... but it does not allow more than 24 hours as value... And I'm not a fan of 3 different inputs.

So I think masking may be the best approach.

For now I thought about a mask like:

        mask: [
          {
            mask: '0[0]s',
          },
          {
            mask: '0[0]m[0[0]s]',
          },
          {
            mask: '0[0][0]h[0[0]m[0[0]s]]',
          },
        ]

But I'm wondering if someone has a better approach? In term of UX it's a bit complex for a lambda user to understand the logic when typing multiple numbers it's sliding the category from minutes to hours.

Thank you,

Note: when I'm mentioning ISO 8601 in my case I'm just interested in what is after the T separation in the standard (to focus only on hours/minutes/seconds). Using it helps me then to make any additional verification or computation with known librairies.