<template>
    <slot v-bind="$attrs"></slot>
    <!-- <Suspense suspensible>
        <NuxtLink no-prefetch class="text-accent-blue inline-flex items-center" v-if="data && data[0]"
        :to="{ path: `/explorer/${project}/${data[0].path}`, hash: hash }" :class="class">
            <PreviewContent :project="project" :path="data[0].path" :anchor="hash">
                <template #default>
                    <slot v-bind="$attrs"></slot>
                    <Icon class="w-4 h-4 inline-block" v-if="data && data[0] && data[0].type !== 'Markdown'" :height="20" :width="20"
                        :icon="`icons/link-${data[0].type.toLowerCase()}`" />
                </template>
            </PreviewContent>
        </NuxtLink>
        <NuxtLink no-prefetch v-else-if="href" :to="href" :class="class" class="text-accent-blue inline-flex items-center">
            <slot v-bind="$attrs"></slot>
            <Icon class="w-4 h-4 inline-block" v-if="data && data[0] && data[0].type !== 'Markdown'" :height="20" :width="20"
                :icon="`icons/link-${data[0].type.toLowerCase()}`" />
        </NuxtLink>
        <slot :class="class" v-else v-bind="$attrs"></slot>
    </Suspense> -->
</template>
<!--<script setup lang="ts">
import { parseURL } from 'ufo';

const props = defineProps({
    href: {
        type: String,
        required: false,
    },
    class: {
        type: String,
        required: false,
    }
});

const route = useRoute();
const { hash, pathname, protocol } = parseURL(props.href);
const project = computed(() => parseInt(Array.isArray(route.params.projectId) ? '0' : route.params.projectId));
const data = ref();

if(!!pathname && !protocol)
{
    data.value = await $fetch(`/api/project/${project.value}/file`, {
        query: {
            search: `%${pathname}`
        },
        ignoreResponseError: true,
    });
}
</script>-->