<koa-tabs>

<koa-tabs>

It makes it easy to explore and switch between different views or functional aspects of an app, or to browse categorized data sets.

Demo

Styling

Custom property Description Default
--tabs Mixin applied to the tabs {}

KoaTabsBehavior offers

Behaviors

Polymer.IronMenubarBehavior
Behaviors

Polymer.IronMenuBehavior

Host attributes

Attribute Value
role 'tablist'

Properties

Name Type Description Default
scrollable Boolean If true, tabs are scrollable and the tab width is based on the label width. false
selected String Gets or sets the selected element. The default is to use the index of the item.

<koa-tab>

It is styled to look like a tab. It should be used in conjunction with koa-tabs.

Styling

Custom property Description Default
--tab Mixin applied to the tab {}
--tab-content Mixin applied to the tab content {}
--tab-content-unselected Mixin applied to the tab content when the tab is not selected {}

KoaTabBehavior offers

Behaviors

Polymer.IronButtonState

Properties

Name Type Description Default
active Boolean If true, the button is a toggle and is currently in the active state. false
pressed Boolean If true, the user is currently holding down the button. false
toggles Boolean If true, the button toggles the active state with each tap or press of the spacebar. false
Polymer.IronControlState

Properties

Name Type Description Default
disabled Boolean If true, the user cannot interact with this element. false
focused Boolean If true, the element currently has focus. false

Host attributes

Attribute Value
role 'tab'