<script setup>
import { NCollapseItem } from 'naive-ui'
import {computed} from "vue";
const props = defineProps({
    label: {
        type: String
    },
    counter: {
        type: [String, Number],
        default: null
    }
})

const counterText = computed(() => props.counter ? `(${props.counter})` : '')

const header = computed(() => `${props.label} ${counterText.value}`)
</script>

<template>
    <NCollapseItem :title="header">
        <slot />
    </NCollapseItem>
</template>

<style scoped>

</style>
