# FullPageTabs component for Stripe Apps

Use FullPageTabs to display sections of content.

# v8

> This is a v8 for when app-sdk-version is 8. View the full page at https://docs.stripe.com/stripe-apps/components/fullpagetabs?app-sdk-version=8.

The `FullPageTabs` component isn’t available in the selected SDK version.


# v9

> This is a v9 for when app-sdk-version is 9. View the full page at https://docs.stripe.com/stripe-apps/components/fullpagetabs?app-sdk-version=9.

To add the `FullPageTabs` component to your app:

```js
import {FullPageTabs, FullPageView, FullPageTab} from '@stripe/ui-extension-sdk/ui';
```

## Basic

The following example demonstrates how to use the `FullPageTabs` component, where a different React view is rendered for each tab.

### FullPageTabs props

| Property   | Type                                                                    |
| ---------- | ----------------------------------------------------------------------- |
| `children` | (Required)
  `React.ReactNode`

  One or more `FullPageTab` components. |

### FullPageTab props

| Property  | Type                                                        |
| --------- | ----------------------------------------------------------- |
| `content` | (Required)
  `React.ReactNode`

  Tab content.              |
| `id`      | (Required)
  `string`

  The unique identifier for the tab. |
| `label`   | (Required)
  `string`

  The label of the tab.              |


## See also

- [Design patterns to follow](https://docs.stripe.com/stripe-apps/patterns.md)
- [Style your app](https://docs.stripe.com/stripe-apps/style.md)
- [UI testing](https://docs.stripe.com/stripe-apps/ui-testing.md)
