<template>
    <div :class="`${ns.b('group')}`">
        <slot/>
    </div>
</template>

<script lang="ts">
export default {
    name: "MoButtonGroup",
};
</script>
<script lang="ts" setup>
import {provide, reactive, toRef} from 'vue'
import {buttonGroupContextKey} from '@moui/tokens'
import {useNamespace} from '@moui/hooks'
import {buttonGroupProps} from './button-group.ts'

const props = defineProps(buttonGroupProps)
provide(
    buttonGroupContextKey,
    reactive({
        size: toRef(props, 'size'),
        type: toRef(props, 'type'),
    })
)
const ns = useNamespace('button')
</script>
