React Tabs Component API

Tabs API

Explore the API reference for the React Tabs component and discover how to effectively utilize its props for customization.

On this page

import { CTab } from '@coreui/react'
// or
import CTab from '@coreui/react/src/components/tabs/CTab'

Property	Default	Type
className#	-	`string`
A string of all className you want applied to the base component.
disabled#	-	`boolean`
Toggle the disabled state for the component.
itemKey#	-	`string`, `number`
Item key.

import { CTabContent } from '@coreui/react'
// or
import CTabContent from '@coreui/react/src/components/tabs/CTabContent'

Property	Default	Type
className#	-	`string`
A string of all className you want applied to the base component.

import { CTabList } from '@coreui/react'
// or
import CTabList from '@coreui/react/src/components/tabs/CTabList'

Property	Default	Type
className#	-	`string`
A string of all className you want applied to the base component.
layout#	-	`'fill'`, `'justified'`
Specify a layout type for component.
variant#	-	`'pills'`, `'tabs'`, `'underline'`, `'underline-border'`
Set the nav variant to tabs or pills.

import { CTabPanel } from '@coreui/react'
// or
import CTabPanel from '@coreui/react/src/components/tabs/CTabPanel'

Property	Default	Type
className#	-	`string`
A string of all className you want applied to the base component.
itemKey#	-	`string`, `number`
Item key.
onHide#	-	`() => void`
Callback fired when the component requests to be hidden.
onShow#	-	`() => void`
Callback fired when the component requests to be shown.
transition#	`true`	`boolean`
Enable fade in and fade out transition.
visible#	-	`boolean`
Toggle the visibility of component.

import { CTabs } from '@coreui/react'
// or
import CTabs from '@coreui/react/src/components/tabs/CTabs'

Property	Default	Type
activeItemKey#	-	`string`, `number`
The active item key.
className#	-	`string`
A string of all className you want applied to the base component.
onChange#	-	`(value: string \| number) => void`
The callback is fired when the active tab changes.