TabGroup Component

The TabGroup component is a flexible and customizable tab navigation system built with React.

Installation

To install the Tabs Library, you can use npm or yarn:

npm install tabs-library

or

yarn add tabs-library

Usage

To use the Tabs component within your React application: import { TabGroup } from 'tabs-library'

Props

tabsData (required) An array of objects representing tabs. Each object should contain properties:

id (number or string): A unique identifier for the tab. label (string): The text label of the tab. content (string or component): The content to be displayed when the tab is active. defaultTabId (optional) The ID of the tab that should be active by default. Defaults to the first tab if not provided.

onTabClick (optional) A function that will be called when a tab is clicked. It receives the ID of the clicked tab as a parameter.

tabType (optional) A string specifying the style of tabs. Choose from "default", "square", or "pills".

Styling

The provided CSS file contains styles for the tab group component. Customize these styles as needed to match your application's design.