diff --git a/.changeset/blue-roses-give.md b/.changeset/blue-roses-give.md new file mode 100644 index 0000000000..2479c33e46 --- /dev/null +++ b/.changeset/blue-roses-give.md @@ -0,0 +1,8 @@ +--- +'@backstage/plugin-catalog-react': patch +--- + +Accessibility updates: + +- Wrapped the `EntityLifecyclePicker`, `EntityOwnerPicker`, `EntityTagPicker`, in `label` elements +- Changed group name `Typography` component to `span` (from default `h6`), added `aria-label` to the `List` component, and `role` of `menuitem` to the container of the `MenuItem` component diff --git a/.changeset/olive-rats-rest.md b/.changeset/olive-rats-rest.md new file mode 100644 index 0000000000..46e76f7c17 --- /dev/null +++ b/.changeset/olive-rats-rest.md @@ -0,0 +1,30 @@ +--- +'@backstage/create-app': patch +--- + +Accessibility updates: + +- Added `aria-label` to the sidebar Logo link. To enable this for an existing app, please make the following changes: + +`packages/app/src/components/Root/Root.tsx` + +```diff +const SidebarLogo = () => { + const classes = useSidebarLogoStyles(); + const { isOpen } = useContext(SidebarContext); + + return ( +
+ + {isOpen ? : } + +
+ ); +}; +``` diff --git a/.changeset/quick-ladybugs-try.md b/.changeset/quick-ladybugs-try.md new file mode 100644 index 0000000000..aad1b200b6 --- /dev/null +++ b/.changeset/quick-ladybugs-try.md @@ -0,0 +1,7 @@ +--- +'@backstage/plugin-catalog': patch +--- + +Accessibility updates: + +- Added screen reader elements to describe default table `Action` buttons diff --git a/.changeset/short-jokes-applaud.md b/.changeset/short-jokes-applaud.md new file mode 100644 index 0000000000..b1b4f55858 --- /dev/null +++ b/.changeset/short-jokes-applaud.md @@ -0,0 +1,8 @@ +--- +'@backstage/core-components': patch +--- + +Accessibility updates: + +- Added `aria-label` to the `Select` component +- Changed heading level used in the header of `Table` component diff --git a/packages/app/src/components/Root/Root.tsx b/packages/app/src/components/Root/Root.tsx index a51ca20c37..ac62c81899 100644 --- a/packages/app/src/components/Root/Root.tsx +++ b/packages/app/src/components/Root/Root.tsx @@ -77,6 +77,7 @@ const SidebarLogo = () => { to="/" underline="none" className={classes.link} + aria-label="Home" > {isOpen ? : } diff --git a/packages/core-components/src/components/Select/Select.tsx b/packages/core-components/src/components/Select/Select.tsx index 31097d8aab..2edf74882f 100644 --- a/packages/core-components/src/components/Select/Select.tsx +++ b/packages/core-components/src/components/Select/Select.tsx @@ -199,6 +199,7 @@ export function SelectComponent(props: SelectProps) { {label}