elk/components/search/SearchResult.vue

32 lines
907 B
Vue

<script setup lang="ts">
import type { SearchResult } from '~/composables/masto/search'
defineProps<{
result: SearchResult
active: boolean
}>()
const onActivate = () => {
(document.activeElement as HTMLElement).blur()
}
</script>
<template>
<CommonScrollIntoView
as="RouterLink"
hover:bg-active
:active="active"
:to="result.to" py2 block px2
:aria-selected="active"
:class="{ 'bg-active': active }"
@click="() => onActivate()"
>
<SearchHashtagInfo v-if="result.type === 'hashtag'" :hashtag="result.data" />
<SearchAccountInfo v-else-if="result.type === 'account'" :account="result.data" />
<StatusCard v-else-if="result.type === 'status'" :status="result.data" :actions="false" :show-reply-to="false" />
<!-- <div v-else-if="result.type === 'action'" text-center>
{{ result.action!.label }}
</div> -->
</CommonScrollIntoView>
</template>