React
Hover Design System exports the following components for rendering Tabs:
import { Tabs, TabList, TabPanels, Tab, TabPanel } from '@hoverinc/design-system-react-web';
- Tabs: Provides context and state for all components
- TabList: Wrapper for the
Tab
components - Tab: element that serves as a label for one of the tab panels and can be activated to display that panel.
- TabPanels: Wrapper for the
TabPanel
components - TabPanel: element that contains the content associated with a tab
Usage
Size
The default size for Tabs is small
, however it also supports medium
and
large
to render larger heading styles for each tab.