Swap input type number with inputmode numeric - Text and Date input

[davidhunter08]

Description

Add inputmode and spellcheck options to Text input component Nunjucks macro.

Change type="number" to inputmode="numeric" on the Date input component.

Related issues

• Update NHS number documentation examples to include inputmode='numeric' attribute nhsuk-service-manual-community-backlog#293
• Update guidance on input type="number" nhsuk-service-manual-community-backlog#223
• Date input nhsuk-service-manual-community-backlog#10

Checklist

• Tested against our testing policy (Resolution, Browser & Accessibility)
• Follows our coding standards and style guide
• CHANGELOG entry

[mcheung-nhs]

Need to update the README for date-input for the HTML markup to change the type="number"
https://github.com/nhsuk/nhsuk-frontend/blob/input-component-macro/packages/components/date-input/README.md

[davidhunter08]

Need to update the README for date-input for the HTML markup to change the type="number"
https://github.com/nhsuk/nhsuk-frontend/blob/input-component-macro/packages/components/date-input/README.md

Thanks @mcheung-nhs. I've made those changes.

[mcheung-nhs]

Hi @davidhunter08 - can see the requested changes - thanks! Do we also need to add the type="text" in the HTML as that is what is output, from the macro
type="{{ params.type | default('text') }}"

[davidhunter08]

Hi @davidhunter08 - can see the requested changes - thanks! Do we also need to add the type="text" in the HTML as that is what is output, from the macro
type="{{ params.type | default('text') }}"

Yep, you're right. I've made the changes.

[kevinkuszyk]

@davidhunter08 I may be a little late to the party here, but what's the rationale for using type="text" instead of type="number"?

Not only does it feel semantically incorrect, but you also lose some browser features (up / down arrow support on the keyboard and spinners in the UI).

We're catching up with these changes in the react components☝️, and before we apply I like to understand the context a little better.

Thanks!

/cc @KaiSpencer @Tomdango @frobernik

[mcheung-nhs]

Hi @kevinkuszyk, we were following guidance and research done by gov.uk:
https://technology.blog.gov.uk/2020/02/24/why-the-gov-uk-design-system-team-changed-the-input-type-for-numbers/

[kevinkuszyk]

Thanks @mcheung-nhs - that's exactly what I was looking for.