<script setup lang="ts">
const props = defineProps<{
  text: string
  icon: string
}>()
</script>

<template>
  <Button
  variant="outline" class="text-primary border-primary bg-white hover:bg-gray-50 focus:bg-gray-150
         focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2"
         >
    <Icon :name="props.icon" class="size-4 me-2" />
    {{ props.text }}
  </Button>
</template>
