TabGroup

A TabGroup typically consists of a set of tabs, each representing a distinct section or view of content. Users can click or tap on the tabs to switch content between different sections.

Use Cases:

✅ Content organization: Use a TabGroup to organize related content into separate sections, such as different categories, features, or aspects of a larger topic.

✅ Navigation enhancement: Provide users with an efficient and structured way to navigate between different views or sections of a complex interface.

✅ Multi-step processes: Utilize a TabGroup to guide users through multi-step processes, where each tab represents a step or stage of the process.

Not to Use Cases:

❌ Excessive tabs: Avoid overwhelming users with too many tabs, as a cluttered interface can make navigation confusing and decrease usability.

❌ Single-option tabs: Do not use a TabGroup if you only have one tab or if the content is too minimal to warrant a tabbed layout. Consider using other UI elements like buttons or links for singular actions.

❌ Complex interactions: Avoid using a TabGroup for highly interactive or complex interactions that require dynamic updates between multiple sections. A different UI pattern, such as a wizard or accordion, may be more appropriate.

Last updated