File

packages/eui/packages/components/eui-tabs-v2/eui-tabs-v2.component.ts

Description

eUI Tabs component helps to organize content into separate views where only one view can be visible at a time. Each tab's label is shown in the tab header and the active tab is designated with a primary ink bar visual. The active tab may be set using the activeTabIndex input option or when the user selects one of the tab labels in the header. When the list of tab labels exceeds the width of the header or its container, pagination controls appear to let the user scroll left and right across the tabs.

Implements

OnInit OnChanges OnDestroy AfterViewInit

Metadata

Index

Properties
Methods
Inputs
Outputs
HostBindings
Accessors

Inputs

activeTabIndex
Type : number
Default value : 0

Index of the active tab

ariaLabel
Type : string
Default value : 'eUI Tabs'

Sets the aria-label attribute for the host element.

e2eAttr
Type : string
Default value : 'eui-tabs-v2'
isMainNavigation
Type : boolean
Default value : false

Outputs

tabActivate
Type : EventEmitter

Event emitted when a tab is activated

tabClick
Type : EventEmitter

Event emitted when a tab is clicked

tabClose
Type : EventEmitter

Event emitted when a tab is closed

HostBindings

class
Type : string

Methods

Public activateTab
activateTab(index: number, isAnimated, options: object)

Activate a tab having index passed in parameter if exists.

Parameters :
Name Type Optional Default value Description
index number No

Index of the tab to close

isAnimated No true

Whether the tab activation should be animated

options object No { emitEvent: true }

Object with emitEvent property to emit the event or not

Returns : void
Public closeTab
closeTab(index: number)

Close a tab having index passed in parameter if exists.

Parameters :
Name Type Optional Description
index number No

Index of the tab to close

Returns : void
Public goToLeft
goToLeft()

Scroll to the left handler

Returns : void
Public goToRight
goToRight()

Scroll to the rihgt handler

Returns : void

Properties

_tabs
Type : QueryList<EuiTabV2Component>
Decorators :
@ContentChildren(undefined, {descendants: false})
Public currentOffset
Type : number
Default value : 0
euiTabListItems
Type : QueryList<ElementRef>
Decorators :
@ViewChildren('euiTabListItems')
euiTabsHeaders
Type : ElementRef
Decorators :
@ViewChild('euiTabsHeaders')
euiTabsHeadersContainer
Type : ElementRef
Decorators :
@ViewChild('euiTabsHeadersContainer')
Public navigationLeftButtonDisabled
Default value : true
Public navigationRightButtonDisabled
Default value : false
Public scrolling
Default value : false
Public tabs
Type : EuiTabV2Component[]
Default value : []

Accessors

elementClass
getelementClass()
euiTabsHeadersContainerWidth
geteuiTabsHeadersContainerWidth()

Width of the tabs headers container

Returns : number
euiTabsHeadersWidth
geteuiTabsHeadersWidth()

Width of the tabs headers

Returns : number

results matching ""

    No results matching ""