Screen reader text is not overridable, therefore not translatable

[irl]

Summary

The application I am building will be used by non-English speakers. This means that all strings in the application must be translatable. I propose to add props to all elements that contain screen-reader, and other, text that allows for that text to be overridden.

I am explicitly not proposing that support for any specific translation framework is implemented.

💬 Description

For every component that has screen reader only text, or other text, new props are added to allow that text to be overridden.

💰 Use value

Where applications need to be used by non-English speakers, this will allow accessibility features to remain fully functional.

📝 Acceptance Criteria

Given a component is used that currently contains screen reader text
When no alternative text is provided via a prop
Then the original default text is used

Given a component is used that currently contains screen reader text
When alternative text is provided via a prop
Then that text is displayed instead

 🧾 Guidance

An index of default text strings would be useful to bootstrap translations. Providing YAML files with those strings pre-translated into some languages would also be handy, but the exact format of those files will vary by application, so has less value. I also don't think that having the text translated into however many languages should be a requirement for inclusion of new components, application developers will have their application specific strings to translate anyway.