Spaces:
Running
Running
File size: 1,825 Bytes
4446d89 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 |
<script lang="ts">
import type { Entry } from "./Types";
import AuthorAvatar from "../AuthorAvatar/AuthorAvatar.svelte";
import IconArrowRight from "../Icons/IconArrowRight.svelte";
export let entry: Entry;
export let isSelected: boolean;
export let onClick: (entry: Entry) => void;
</script>
<a
class="flex h-8 cursor-pointer items-center px-2
{['dataset', 'model', 'no-results', 'space'].includes(entry.type) ? 'font-mono text-xs' : ''}
{['all-datasets', 'all-models', 'all-spaces'].includes(entry.type) && !isSelected ? 'text-gray-400' : ''}
{isSelected ? 'bg-blue-500 text-white dark:bg-blue-700' : 'hover:bg-gray-50 dark:hover:bg-gray-900'}"
href={entry.href}
on:click|stopPropagation={() => onClick(entry)}
>
{#if ["all-datasets", "all-models", "all-spaces"].includes(entry.type)}
<IconArrowRight classNames="flex-none mr-1 h-3 w-3" />
{:else if ["org", "user"].includes(entry.type) && entry.imgUrl}
<AuthorAvatar
author={{
avatarUrl: entry.imgUrl,
type: entry.type === "user" ? "user" : "org",
}}
classNames="mr-1.5"
/>
{:else if entry.type === "full-text-search"}
<span
class="mr-1.5 rounded px-1 text-xs leading-tight {isSelected
? 'bg-white/10 text-white'
: 'bg-blue-500/10 text-blue-700 dark:text-blue-200'}">new</span
>
{/if}
<span
class="flex-shrink-0 truncate
{entry.type === 'model' && !isSelected
? 'rounded bg-gradient-to-b from-gray-50 to-gray-100 px-1 dark:from-gray-925 dark:to-gray-950'
: 'px-1'}"
>
{entry.label}
</span>
{#if entry.description}
<span class="pl-0.5 pr-1.5 text-gray-300">·</span>
<span class="mr-2 truncate {isSelected ? 'text-white' : 'text-gray-400'}">{entry.description}</span>
{/if}
{#if entry.type === "full-text-search"}
<IconArrowRight classNames="flex-none ml-auto h-3.5 w-3.5" />
{/if}
</a>
|