Hacktron Design System

Tabs

A segmented control for switching between views of the same data.

<template>
  <Tabs
    v-model="active"
    :items="[{ label: 'Overview', value: 'overview' }, { label: 'Activity', value: 'activity' }]"
    :content="false"
    color="neutral"
  />
</template>

Props

Name Type Default
items{ label?, value?, icon?, avatar?, badge?, disabled?, ... }[]
modelValuestring | number
contentbooleantrue (UTabs's own default)
...propsUTabs props (color, size, orientation, unmountOnHide, valueKey, labelKey, ...)

Usage