Tabs
This is a pass through component from React-Bootstrap.
See React-Bootstrap for documentation.
Uncontrolled usage
Controlled usage
Button group usage
Pills usage
With notification
With screen reader text in notification
Responsive support
Tabs.Deprecated
Basic usage
Theme Variables (SCSS)#
$tab-notification-height: 1rem !default;$tab-notification-width: 1rem !default;$tab-notification-font-size: $font-size-xs !default;
- labels
node[]Requiredspecifies the list of elements that will be displayed within each of the tabbed views. It is the content relevant to each label. Children should not be passed as Props, but should instead be nested between the opening and closing
<Tabs> </Tabs>tags. - children
element[]Requiredspecifies the list of headings that will appear on all of the tabs that will be created.
- title
nodeRequiredSpecifies the
Tabnavigation title. - notification
nodeSpecifies notification bubble content. It appears on the top right of the
Tab. - disabled
boolSpecifies whether
Tabis disabled. - eventKey
string|numberA unique identifier for the Component, the
eventKeymakes it distinguishable from others in a set. Similar to React'skeyprop, in that it only needs to be unique amongst the Components siblings, not globally. - tabClassName
stringSpecifies class name to append to the base element.