<template>
    <div class="sy-btn-ellipsis">
        <slot></slot>
        <button-container :buttons="buttons"></button-container>
    </div>
</template>

<script>
    import buttonContainer from './button-container.vue'
    export default {
        name: 'SyButtonList',
        components: { buttonContainer },
        props: {
            // 触发下拉框的方式
            trigger: {
                type: String,
                default: 'hover',
                validator: (value) => ['hover', 'click'].includes(value)
            },
            // 最多显示多少数量的按钮，超过此数量是显示下拉菜单
            num: {
                type: Number,
                default: 3
            }
        },
        data() {
            return {
                buttons: []
            }
        }
    }
</script>

<style lang="scss" scoped>

</style>
