Add note on NavList.LeadingVisual (#857)

* Add note on `NavList.LeadingVisual` * Update content/components/nav-list.mdx --------- Co-authored-by: Patrick H. Lauke <[email protected]>
primer · Sep 16, 2024 · b2f6ee8 · b2f6ee8
1 parent b0c3adc
commit b2f6ee8
Showing 1 changed file with 6 additions and 2 deletions.
diff --git a/content/components/nav-list.mdx b/content/components/nav-list.mdx
@@ -149,12 +149,16 @@ For information on responsive layout of a nav list that is used in a sidebar, se
 
 ## Accessibility
 
-Nav lists should always be labeled for assistive technologies, even if the label is visually hidden.
+Nav lists should always be labeled for assistive technologies, even if the label is visually hidden. Nav list items are links, so they should never contain buttons or other clickable elements.
 
-Nav list items are links, so they should never contain buttons or other clickable elements.
+### Inactive Items
 
 Inactive nav list items are not rendered as `<a>` tags since we don't know the href value. The only focusabe part of the item is the leading visual. See the [action list accessibility guidelines](/components/action-list#tooltips-and-dialogs-on-inactive-items) for more details.
 
+### Leading Visuals
+
+Leading visuals are intended to be decorative only; the context of the leading visual should be provided in the text of `NavList.Item`. Only the text in `NavList.item` and any trailing visuals within `NavList.Item` are included in its accessible name, while anything inside `NavList.LeadingVisual` will be ignored.
+
 ### Known accessibility issues (GitHub staff only)
 
  <AccessibilityLink label="NavList"/>