<template>
    <div class="uk-padding-small">
        <ul class="uk-iconnav uk-flex-nowrap">
            <li v-for="item in items" :key="item.name">
                <span
                    :uk-icon="item.icon"
                    ratio="0.8"
                    :title="item.tooltip"
                    uk-tooltip="delay: 500"
                    class="uk-preserve-width uk-link uk-icon-link"
                    @click.prevent.stop="$emit('run', item)"
                ></span>
            </li>
        </ul>
    </div>
</template>

<script>
export default {
    name: 'TopPanel',
    props: {
        items: {
            type: Array,
            required: true,
        },
    },
};
</script>
