Tabs
<Tabs>
<TabList>
<Tab>Tab 1</Tab>
<Tab>Tab 2</Tab>
</TabList>
<TabPanel>Tab 1 content</TabPanel>
<TabPanel>Tab 2 content</TabPanel>
</Tabs>
Highlighted props
For the complete list of props, use your IDE's autocomplete functionality.
Vertical tabs
<Tabs
vertical
>
<TabList>
<Tab>Tab 1</Tab>
<Tab>Tab 2</Tab>
</TabList>
<TabPanel>Tab 1 content</TabPanel>
<TabPanel>Tab 2 content</TabPanel>
</Tabs>
Misconfiguration alert
If the number of Tab
elements and TabPanel
elements doesn't match, an alert will be shown.
<Tabs>
<TabList>
<Tab>Tab 1</Tab>
<Tab>Tab 2</Tab>
</TabList>
<TabPanel>Tab 1 content</TabPanel>
// Missing Tab 2 content
</Tabs>