32 lines
584 B
Vue
32 lines
584 B
Vue
<template>
|
|
<div role="tablist" class="tabs tabs-boxed">
|
|
<button
|
|
v-for="option in options"
|
|
:key="option.value"
|
|
type="button"
|
|
role="tab"
|
|
class="tab"
|
|
:class="{ 'tab-active': modelValue === option.value }"
|
|
@click="$emit('update:modelValue', option.value)"
|
|
>
|
|
{{ option.label }}
|
|
</button>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
interface Option {
|
|
value: string
|
|
label: string
|
|
}
|
|
|
|
defineProps<{
|
|
modelValue: string
|
|
options: Option[]
|
|
}>()
|
|
|
|
defineEmits<{
|
|
(e: 'update:modelValue', value: string): void
|
|
}>()
|
|
</script>
|