Open
Description
I am working on a project picker component that is using tabs for switching between lists of projects. Since the content type for each tab is the same, only the source changes, I wish to use single tabpanel with a virtualised-list inside.
<!DOCTYPE html>
<html>
<body>
<tab-container>
<div role="tablist">
<button type="button" role="tab" aria-selected="true">Tab one</button>
<button type="button" role="tab" tabindex="-1">Tab two</button>
<button type="button" role="tab" tabindex="-1">Tab three</button>
</div>
<div role="tabpanel">
<virtualised-list></virtualised-list>
</div>
</tab-container>
<script src="https://cdn.skypack.dev/@github/tab-container-element" type="module"></script>
</body>
</html>After talking to @keithamus I have learned that currently tab-container requires to have the same set of tabpanels as tabs as it announces panel changes to the screen reader.
Is that feasible to support mentioned use case and comply with accessibility requirements set on the tab-container-element?
Metadata
Metadata
Assignees
Labels
No labels