<template>
  <a v-if="isExternal" :href="href" :target="target" class="text inline-flex-row">
    {{ content }}
    <Icon name="ph:arrow-square-out-duotone" mode="svg" />
  </a>
  <NuxtLink v-else :to="href" class="text inline-flex-row">
    {{ content }}
    <Icon name="ph:link-simple-duotone" mode="svg" />
  </NuxtLink>
</template>

<script setup lang="ts">
import type { RichTextLink } from './Types'

const { href } = defineProps<RichTextLink>()

const isExternal = href.startsWith('http')
</script>
