<template>
  <component
    :is="to ? NuxtLink : 'button'"
    :to="to"
    class="inline-flex items-center gap-2 rounded-full bg-[#f6f1ea] px-4 py-2 text-sm font-bold text-[#5f4b33] transition hover:bg-[#ece2d3]"
    @click="!to && $emit('click')"
  >
    <Icon v-if="icon" :name="icon" size="16" />
    <slot />
  </component>
</template>

<script setup lang="ts">
import { NuxtLink } from '#components'

defineProps<{
  to?: string
  icon?: string
}>()

defineEmits<{
  (e: 'click'): void
}>()
</script>
