<ui-tabs>

Tabbed content with full keyboard and ARIA support.

Navigation · stable · since 2.0.0 · extends _UIElement

Examples

<ui-tabs value="overview"><ui-tab value="overview">Overview</ui-tab><ui-tab value="history">History</ui-tab><ui-tab-panel value="overview">Overview content</ui-tab-panel><ui-tab-panel value="history">History content</ui-tab-panel></ui-tabs>

<ui-tabs><ui-tab value="one">One</ui-tab><ui-tab value="two" disabled>Two</ui-tab><ui-tab-panel value="one">First</ui-tab-panel></ui-tabs>

Playground

Generated HTML

Event log

API

Attributes and properties

Property	Attribute	Type	Default	Description
`disabled`	`disabled`	boolean	false
`busy`	`data-ui-busy`	boolean	false
`value`	`value`	string	""	Selected tab value; defaults to the first enabled tab.

Methods

select — Select a tab by value: select(value, { emit }).

Events

ui-change — User changed tab; detail { value, previous, source }.

Slots

(default) — ui-tab and ui-tab-panel children.