Dev: add new max-length property to input component

[melaniebmn]

Summary:

Add a new max-length property to the input component.

Currently, the input component allows users to set the size attribute, which adjusts the width of the input field visually. However, it does not enforce a character limit.

We want to introduce a new max-length property for the input component to enable users to specify the maximum number of characters allowed. When the max-length is set, the component should display a character count below the input field, similar to the behavior of the textarea component. This will help users understand the available character limit as they type.

This feature was requested by a user.

✅ Definition of Done / Outcomes

• Update Requirements doc with new specifications
• Develop the component according to the requirements doc and design specs
• Add new property to input component in Storybook
• Code review
• Done when PR has been approved (not merged nor released yet)

Acceptance criteria:

• Implement properties as stated in the requirements doc
• Passes storybook a11y test without any violation
• WCAG Goal can be completed using a screen reader.
• WCAG Manual accessibility testing meets WCAG 2.1 AA requirements.
• Provides equal service in French and English.
• Dev peer reviews

Deliverables:

• [ ]Requirement doc updated
• [ ]Pull request with new max-length property