Tabs

Last updated Nov 23, 2022

This section describes a Forge preview feature. Preview features are deemed stable; however, they remain under active development and may be subject to shorter deprecation windows. Preview features are suitable for early adopters in production environments.

We release preview features so partners and developers can study, test, and integrate them prior to General Availability (GA). For more information, see Forge release phases: EAP, Preview, and GA.

Tabs

To add the Tabs component to your app:

1
2
import { Tabs, Tab } from '@forge/react';

Description

A visual divider, used to organize content by grouping similar information into tabs on the same page.

Props

Name	Type	Required	Description
`children`	`Tab`	Yes	The tab components to be displayed.
`label`	`string`	Yes	The label text to display.
`children`	`ForgeComponent`	Yes	The contents to display in the tab.

Example

1
2
<Tabs>
    <Tab label="Tab 1">
        <Text>Hello world!</Text>
    </Tab>
    <Tab label="Tab 2">
        <Text>The quick brown fox jumps over the lazy dog</Text>
    </Tab>
</Tabs>

Output

Example image of rendered tabs