Add aria-current="page" to active navigation item (#36946)

WordPress · Nov 30, 2021 · 201ee37 · 201ee37
1 parent 81015b0
commit 201ee37
Showing 1 changed file with 10 additions and 2 deletions.
diff --git a/packages/components/src/navigation/item/index.js b/packages/components/src/navigation/item/index.js
@@ -52,8 +52,10 @@ export default function NavigationItem( props ) {
 		return null;
 	}
 
+	const isActive = item && activeItem === item;
+
 	const classes = classnames( className, {
-		'is-active': item && activeItem === item,
+		'is-active': isActive,
 	} );
 
 	const onItemClick = ( event ) => {
@@ -67,7 +69,13 @@ export default function NavigationItem( props ) {
 	const baseProps = children ? props : { ...props, onClick: undefined };
 	const itemProps = isText
 		? restProps
-		: { as: Button, href, onClick: onItemClick, ...restProps };
+		: {
+				as: Button,
+				href,
+				onClick: onItemClick,
+				'aria-current': isActive ? 'page' : undefined,
+				...restProps,
+		  };
 
 	return (
 		<NavigationItemBase { ...baseProps } className={ classes }>