## Background
- **Description:** we need to implement characters counter to use it in TextArea T284272
- **History:** characters counter discussed in the Field component task T309239#8638272
- **Known use case(s):** //describe known use cases for this component, including the project, team, and timeline//
- **Considerations:** //list any known challenges or blockers, or any other important information//
### User stories
- As a user, I need to know how many characters I can type in an input.
- As a user, I need to know when I'm exceeding the characters when typing in an input.
### Previous implementations
-
### Design explorations
Some design explorations are captured in [[ https://www.figma.com/file/uBYlqttQgO2tXXxTVJQj0T/Form-field---T309239?node-id=1504%3A12578&t=mjV6LCmaEz478XYA-11 | this Figma file ]]:
{F36888300}
### Design spec
// Once a component spec sheet has been created in Figma, remove the note stating the spec is missing and link to the spec below. //
| Component spec sheet |
### Open questions
[] We need to evaluate if we want to indicate the exceeded characters and, if yes, the style for these exceeded characters.
{F36888306}
[] We need to define the right padding between the helper text and characters counter so both texts are not too close to each other when the helper text is too long. Also, we need to define the maximum case to know how both texts grow when they are long.
{F36888303}
[] Do we want to implement the error validation message as part of the characters counter?
{F36888401}
### Acceptance criteria (or Done)
**Design**
[] Design the Figma spec sheet and add it in this task
[] Update the component in the Figma [[ https://www.figma.com/file/KoDuJMadWBXtsOtzGS4134/❖-Codex-components?node-id=1891%3A4420&viewport=287%2C338%2C0.28 | library ]]. //This step will be done by a DST member.//
**Code**
[] Implement the component in Codex