Adds both <TabNavigation> and <TabNavigationItem> components.
These are meant as a more flexible alternative to our <Tabs> etc components, as the these equire <TabPanel> components to be present, instead, TabNavigation tabs manage themselves and can run any handler when the active tab changes, thus allowing for a much more flexible and dynamic usage.
Also, <TabNavigation> does not expect the index of an active tab as a prop, the active tab can be set / accessed using its label as a string as this seems more intuitive. This solution, however, forbids using the same label on two or more tabs within a tablist, but this shouldn't occur for usability/ accessibilty reasons anyway.
To be more consistent with all other forms of navigation we have, <TabNavigation> renders an element with role="navigation".
<TabNavigationItem> renders button elements by default, or <a> elements when href prop is passed.
Adds both
<TabNavigation>and<TabNavigationItem>components.These are meant as a more flexible alternative to our
<Tabs>etc components, as the these equire<TabPanel>components to be present, instead,TabNavigationtabs manage themselves and can run any handler when the active tab changes, thus allowing for a much more flexible and dynamic usage.Also,
<TabNavigation>does not expect the index of an active tab as a prop, the active tab can be set / accessed using its label as a string as this seems more intuitive. This solution, however, forbids using the same label on two or more tabs within a tablist, but this shouldn't occur for usability/ accessibilty reasons anyway.To be more consistent with all other forms of navigation we have,
<TabNavigation>renders an element withrole="navigation".<TabNavigationItem>rendersbuttonelements by default, or<a>elements whenhrefprop is passed.