The Tab
is a low-level component that just renders an accessible tab widget
along with some general styles and an optional icon.
This component renders an accessible tab panel with enter and exit
animations. This probably should only be used internally as it relies on the
TabPanels
component along with the TransitionGroup
from
react-transition-group
to work as expected.
This component allows you to control the visibility of the TabPanel
components and animating the next and current panels as needed. This works by
looping over all the children and getting the current TabPanel
by the
activeIndex
. This is why the children for this component can only be
TabPanel
and should not be conditional.
The Tabs
component is used to render all the configured tabs
from the
parent TabsManager
component inside of the TabsList
.
The TabsList
component is the container for all the individual Tab
s that
should be rendered. This handles adding an active indicator underneath the
active tab and animating it to the new location when a new tab becomes
active. It also handles the ability update which tab is selected when it has
been clicked or updated with keyboard movement.
This should probably not be used outside of this package unless a custom implementation is desired.
The TabsManager
is used to configure your Tabs
component and handle some
of the default behavior such as:
activeIndex
id
prefix for all tabs for simplicityThis hook returns the current "state" for the tabs which can be useful if you need additional control or access to the tabs behavior.
Generated using TypeDoc
The supported types of alignments for the tabs.