Enforce non-empty labels & titles

[sambostock]

Feature request summary

Empty label props (e.g. <TextField label="" />) should be prevented, in favour of a non-empty label combined with labelHidden.

This should also be the case for similar props (e.g. <ChoiceList title="" />). Any required string x prop, with a xHidden companion prop should disallow empty strings.

This might addressable be via types, linting, throwing an error, or some combination thereof.

Rationale

Accessibility isn’t an after thought, so we should enforce it. @AndrewMusgrave

---

🌟 Feature requests that are not yet planned will be closed. We then use the issue’s :+1: upvotes to track and set priorities. See the contribution guidelines for more information.

[sambostock]

Based on git grep '\b[a-z]\+Hidden?', it looks like the affected components are:

• [ ] src/components/Checkbox/Checkbox.tsx: labelHidden?: boolean;
• [ ] src/components/Choice/Choice.tsx: labelHidden?: boolean;
• [ ] src/components/ChoiceList/ChoiceList.tsx: titleHidden?: boolean;
• [ ] src/components/DropZone/DropZone.tsx: labelHidden?: boolean;
• [ ] src/components/Labelled/Labelled.tsx: labelHidden?: boolean;
• [ ] src/components/Page/components/Header/Header.tsx: titleHidden?: boolean;
• [ ] src/components/RadioButton/RadioButton.tsx: labelHidden?: boolean;
• [ ] src/components/RangeSlider/types.ts: labelHidden?: boolean;
• ~src/components/ResourcePicker/ResourcePicker.tsx: showHidden?: boolean;~ showHidden controls if hidden products should be displayed, not a label
• [ ] src/components/Select/Select.tsx: labelHidden?: boolean;
• [ ] src/components/TextField/TextField.tsx: labelHidden?: boolean;

[dpersing]

Thank you so much, @sambostock! We'll look into updating our documentation and tests.

[yurm04]

Thanks for the request, @sambostock . We’re not actively working on this right now, but we keep an eye on all feature requests.

I’ll close this issue for now, but we encourage everyone who wants this feature to add a 👍 to the original issue report. We’ll take your collective interest into account when we look at what to work on next. 💜