Description
In using this component, we've discovered that it's not super clear how label
is expected to be used as a prop: it's marked as required
and throws errors if not provided, but sometimes a consuming app won't want to display a text label above the select.
The reason we have it required
is because, regardless of whether the label is displayed, some value should be provided to tell screen readers what the select is. So, if the label isn't needed visually, devs should set :isLabelVisible="false"
So, we need to document this better. My current idea is to add validation to the label
property - rather than marking it as required
, add a validation hook where, if it's not passed in, we can console.warn
that the component won't be accessible to screen readers when a label is not provided. If you'd like it to not display visually, simply set isLabelVisible
There are probably other approaches we could take as well