@nimbus-ds/tabs

The Tabs component allows us to separate content from the same hierarchy into different tabs.

Installation

$ yarn add @nimbus-ds/tabs
# or
$ npm install @nimbus-ds/tabs

Component Anatomy

The component consists of a text and a line.

Guidelines

We use the component when we have more than two contents of the same context, and we need to switch the focus between them.

Tabs

This variant serves as a container used to group the tabs.

Tabs.item

This variant is the individual tab, which allows us to display content after a tab is activated.

Content

Tab titles must be clear and summarized in up to 2 words, referring to the tab content.

Recommendation for use

• Switch between contents of the same context
• Toggle data view
• Toggle plan options

Usage

View docs here.