42 lines
762 B
Vue
42 lines
762 B
Vue
<template>
|
|
<div :class="cn.b()">
|
|
<UiTabsOption
|
|
v-for="(option, index) in options"
|
|
:key="index"
|
|
:size="size"
|
|
v-bind="option"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import UiTabsOption from './option.vue'
|
|
import type { ModelValue, Props } from './types'
|
|
import { tabsContextKey } from './constants'
|
|
|
|
defineOptions({
|
|
name: 'UiTabs',
|
|
})
|
|
|
|
const props = defineProps<Props>()
|
|
|
|
const emit = defineEmits<{
|
|
'update:modelValue': [state: ModelValue]
|
|
}>()
|
|
|
|
const cn = useClassname('ui-tabs')
|
|
|
|
function handleOptionClick(value: ModelValue) {
|
|
emit('update:modelValue', value)
|
|
}
|
|
|
|
provide(tabsContextKey, {
|
|
modelValue: toRef(props, 'modelValue'),
|
|
handleOptionClick,
|
|
})
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
@use 'styles';
|
|
</style>
|