feat[dev]: ✨ implement A11y improvements for Input Template

[yoezlem]

Description

This task describes the Storybook implementation for the Input template as part of the A11y improvements outlined in Epic https://github.com/solid-design-system/solid/issues/1465.

A11y improvements for the Input template can be found here: Input Notes.

---

Comment

See @sd-input

Additional Information

• Before working on this template ticket, please finish the main component ticket first. This template ticket is linked to the component and will be resolved once the component's A11y improvements are completed:

  1479

DoR

• [x] Item has been estimated by the team
• [x] Item dependencies have been identified and documented

DoD

• [ ] Documentation has been created/updated (if applicable)
• [ ] Migration Guide has been created/updated (if applicable)
• [ ] Relevant E2E tests (Features, A11y, Bug fixes) are created/updated
• [ ] Relevant stories (Features, A11y) are created/updated
• [ ] Implementation works successfully on feature branch

[MartaPintoTeixeira]

@smfonseca on the input "Type" section the please make sure all copy bellow input starts with Capital letter. ex: Default type

[MartaPintoTeixeira]

@smfonseca please check figma docs. We have a section called "Icon" and should have it as well in storybook.

[MartaPintoTeixeira]

@smfonseca for the samples of "Type" can you make sure they have the same content as in figma please?

ex: Date ---- "01.03.2025" inside the input ...

[MartaPintoTeixeira]

For invalid sample in figma we have "Placeholder text" inside the input

[MartaPintoTeixeira]

Can we change the max lengh to 25 please? "25 is the maximum allowed characters"

[MartaPintoTeixeira]

For the Spin Buttons in the sample instead of "Min value is 0 and max is 10" can we have "Min value is 0 and max value is 10" to be more splicit?

[MartaPintoTeixeira]

Help Text samples should say:

Help text attribute Help text slot

[smfonseca]

@MartaPintoTeixeira all comments are addressed in code. Also left you some comments in Figma.

[MartaPintoTeixeira]

Approved