Skip to content

Commit 152a538

Browse files
committed
Address a11y issue in new story
1 parent 51e5f11 commit 152a538

1 file changed

Lines changed: 53 additions & 47 deletions

File tree

packages/react/src/NavList/NavList.features.stories.tsx

Lines changed: 53 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -104,53 +104,59 @@ export const NestedDisclosure: Story = {
104104

105105
export const GroupedNestedLevels: Story = {
106106
render: () => (
107-
<NavList aria-label="Grouped nested levels">
108-
<NavList.Group title="Level 3 leaf">
109-
<NavList.Item defaultExpanded>
110-
Level 2 disclosure
111-
<NavList.SubNav>
112-
<NavList.Item href="#" aria-current="page">
113-
Level 3 current leaf
114-
</NavList.Item>
115-
</NavList.SubNav>
116-
</NavList.Item>
117-
</NavList.Group>
118-
<NavList.Group title="Level 4 leaf">
119-
<NavList.Item defaultExpanded>
120-
Level 2 disclosure
121-
<NavList.SubNav>
122-
<NavList.Item defaultExpanded>
123-
Level 3 disclosure
124-
<NavList.SubNav>
125-
<NavList.Item href="#" aria-current="page">
126-
Level 4 current leaf
127-
</NavList.Item>
128-
</NavList.SubNav>
129-
</NavList.Item>
130-
</NavList.SubNav>
131-
</NavList.Item>
132-
</NavList.Group>
133-
<NavList.Group title="Level 5 leaf">
134-
<NavList.Item defaultExpanded>
135-
Level 2 disclosure
136-
<NavList.SubNav>
137-
<NavList.Item defaultExpanded>
138-
Level 3 disclosure
139-
<NavList.SubNav>
140-
<NavList.Item defaultExpanded>
141-
Level 4 disclosure
142-
<NavList.SubNav>
143-
<NavList.Item href="#" aria-current="page">
144-
Level 5 current leaf
145-
</NavList.Item>
146-
</NavList.SubNav>
147-
</NavList.Item>
148-
</NavList.SubNav>
149-
</NavList.Item>
150-
</NavList.SubNav>
151-
</NavList.Item>
152-
</NavList.Group>
153-
</NavList>
107+
<>
108+
<NavList aria-label="Grouped navigation with a level 3 leaf">
109+
<NavList.Group title="Level 3 leaf">
110+
<NavList.Item defaultExpanded>
111+
Level 2 disclosure
112+
<NavList.SubNav>
113+
<NavList.Item href="#" aria-current="page">
114+
Level 3 current leaf
115+
</NavList.Item>
116+
</NavList.SubNav>
117+
</NavList.Item>
118+
</NavList.Group>
119+
</NavList>
120+
<NavList aria-label="Grouped navigation with a level 4 leaf">
121+
<NavList.Group title="Level 4 leaf">
122+
<NavList.Item defaultExpanded>
123+
Level 2 disclosure
124+
<NavList.SubNav>
125+
<NavList.Item defaultExpanded>
126+
Level 3 disclosure
127+
<NavList.SubNav>
128+
<NavList.Item href="#" aria-current="page">
129+
Level 4 current leaf
130+
</NavList.Item>
131+
</NavList.SubNav>
132+
</NavList.Item>
133+
</NavList.SubNav>
134+
</NavList.Item>
135+
</NavList.Group>
136+
</NavList>
137+
<NavList aria-label="Grouped navigation with a level 5 leaf">
138+
<NavList.Group title="Level 5 leaf">
139+
<NavList.Item defaultExpanded>
140+
Level 2 disclosure
141+
<NavList.SubNav>
142+
<NavList.Item defaultExpanded>
143+
Level 3 disclosure
144+
<NavList.SubNav>
145+
<NavList.Item defaultExpanded>
146+
Level 4 disclosure
147+
<NavList.SubNav>
148+
<NavList.Item href="#" aria-current="page">
149+
Level 5 current leaf
150+
</NavList.Item>
151+
</NavList.SubNav>
152+
</NavList.Item>
153+
</NavList.SubNav>
154+
</NavList.Item>
155+
</NavList.SubNav>
156+
</NavList.Item>
157+
</NavList.Group>
158+
</NavList>
159+
</>
154160
),
155161
}
156162

0 commit comments

Comments
 (0)