Docs
Tabs

Tabs

A set of layered sections of content—known as tab panels—that are displayed one at a time.

Component Source Primitive API Reference
Actions tab content

Usage ​

vue
<script setup lang="ts">
import { Tabs, TabsContent, TabsList, TabsTrigger } from "wedges-vue";
</script>

<template>
  <Tabs default-value="account" class="w-[400px]">
    <TabsList>
      <TabsTrigger value="account">
        Account
      </TabsTrigger>
      <TabsTrigger value="password">
        Password
      </TabsTrigger>
    </TabsList>
    <TabsContent value="account">
      Make changes to your account here.
    </TabsContent>
    <TabsContent value="password">
      Change your password here.
    </TabsContent>
  </Tabs>
</template>

API Reference ​

Props ​

PropTypeDefault
activationMode
'automatic' | 'manual'
as
AsTag | Component
'div'
asChild
boolean
 false
defaultValue
string | number
dir
'ltr' | 'rtl'
modelValue
string | number
orientation
'horizontal' | 'vertical'
'horizontal'
variant
'fill' | 'underlined' | 'contained-bottom' | 'contained-top' | null
'fill'
EmitDescription
update:modelValue

Examples ​

Edit this page on GitHub