---
title: TabsItem
source: https://docs.newrelic.com/docs/new-relic-solutions/build-nr-ui/sdk-component/structure/TabsItem
---

Child element of the `<Tabs>` component.

It creates a tab where the title of the tab is defined by the `label` prop and the content of the tab is defined by the `children` prop.

### Usage

```js
import { TabsItem } from 'nr1'
```

### Props

| `children` REQUIRED node | Content to show when the tab is selected.                                                                                                                                                                                                                                                                                                                           |
| ------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `className` string       | Appends class names to the component.Should be used only for positioning and spacing purposes.                                                                                                                                                                                                                                                                      |
| `disabled` boolean       | If `true`, the tab is not available for interaction.                                                                                                                                                                                                                                                                                                                |
| `label` REQUIREDstring   | Title of the tab.                                                                                                                                                                                                                                                                                                                                                   |
| `style` object           | Inline style for custom styling.It is applied to the tab content.                                                                                                                                                                                                                                                                                                   |
| `testId` string          | Adds a `data-test-id` attribute. Use it to target the component in unit and E2E tests.For a test id to be valid, prefix it with your nerdpack id, followed up by a dot.For example, `my-nerdpack.some-element`. **Note:** You might not see `data-test-id` attributes as they are removed from the DOM, to debug them pass a `e2e-test` query parameter to the URL. |
| `value` REQUIRED any     | Unique identifier of the tab.It is used when selecting the active tab.                                                                                                                                                                                                                                                                                              |
