diff --git a/docs/components/input/use-cases.md b/docs/components/input/use-cases.md index 67d80aca2..9fd4d3102 100644 --- a/docs/components/input/use-cases.md +++ b/docs/components/input/use-cases.md @@ -13,6 +13,19 @@ Can be provided via the `label` attribute or via the `slot="label"`. export const label = () => html` `; ``` +## Label sr-only (a11y) + +Can be provided via the `label-sr-only` boolean attribute. + +The label will be hidden, but still readable by screen readers. + +```js preview-story +export const labelSrOnly = () => + html` `; +``` + +> Note: Once we support the ElementInternals API, the equivalent will be `` + ## Help-text A helper text shown below the label to give extra clarification.