chore: Add proper textual name, role and state to breadcrumb last item

cloudscape-design · Feb 10, 2025 · dfdedd5 · dfdedd5
1 parent 03d0574
commit dfdedd5
Showing 1 changed file with 7 additions and 0 deletions.
diff --git a/src/breadcrumb-group/item/item.tsx b/src/breadcrumb-group/item/item.tsx
@@ -101,11 +101,18 @@ export function BreadcrumbItem<T extends BreadcrumbGroupProps.Item>({
   const anchorAttributes: React.AnchorHTMLAttributes<HTMLAnchorElement> = {
     href: item.href || '#',
     onClick: isLast ? preventDefault : onClickHandler,
+    tabIndex: 0,
   };
   if (isGhost) {
     anchorAttributes.tabIndex = -1;
   }
 
+  if (isLast) {
+    anchorAttributes.role = 'link';
+    anchorAttributes['aria-disabled'] = true;
+    anchorAttributes['aria-current'] = 'page';
+  }
+
   const breadcrumbItem = (
     <FunnelBreadcrumbItem
       className={styles.text}