fix: improve sd-textarea a11y [skip chromatic]

[paulovareiro29]

Description:

Closes #1492

Goals:

• Implement aria-invalid attribute on textarea when the field is invalid.
• Implement invalid-message on aria-describedby

Definition of Reviewable:

• E2E tests (features, a11y, bug fixes) are created/updated

• Stories (features, a11y) are created/updated
• relevant tickets are linked

[github-actions]

🚀 Storybook has been deployed for branch fix_improve-sd-textarea-a11y

• View Storybook

[paulovareiro29]

Some fields are invalid even when not touched, e.g. required or min-length fields are invalid when not touched, since it is empty, but in this cases the aria-invalid should not show, since the user might still be working to fill in the field.

Now aria-invalid="true" only shows when the field in is also a visual invalid state. This is controlled by showInvalidStyle attribute.

[paulovareiro29]

The previous change broke the tests I had done, just pushed a change to fix the tests...
It is rather annoying that the tests quality gate is always falling.

[MartaPintoTeixeira]

the margin between the help-text and the text area and the margin between the error message and the text area is not consistent. will create a ticket to solve this issue in both figma and dev