64 lines
1.3 KiB
Svelte
64 lines
1.3 KiB
Svelte
<script lang="ts">
|
|
import { identify, useEntity } from "../lib/entity";
|
|
|
|
import HashBadge from "./HashBadge.svelte";
|
|
|
|
import Marquee from "./Marquee.svelte";
|
|
import UpLink from "./UpLink.svelte";
|
|
|
|
export let address: string;
|
|
export let link = false;
|
|
export let isFile = false;
|
|
export let resolve = true;
|
|
|
|
// Identification
|
|
let inferredIds = [];
|
|
const { attributes, backlinks } = useEntity(address, () => resolve);
|
|
$: {
|
|
if (resolve) {
|
|
identify($attributes, $backlinks).then((inferredEntries) => {
|
|
inferredIds = inferredEntries.map((eid) => eid.value);
|
|
});
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<div class="address" class:identified={Boolean(inferredIds)}>
|
|
<HashBadge {address} />
|
|
<Marquee>
|
|
{#if isFile}
|
|
<UpLink to={{ entity: address }}>
|
|
{address}
|
|
</UpLink>
|
|
{:else if link}
|
|
<UpLink to={{ entity: address }}>
|
|
{inferredIds.join(" | ") || address}
|
|
</UpLink>
|
|
{:else}
|
|
{inferredIds.join(" | ") || address}
|
|
{/if}
|
|
</Marquee>
|
|
</div>
|
|
|
|
<style scoped lang="scss">
|
|
.address {
|
|
font-family: var(--monospace-font);
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
&,
|
|
& a {
|
|
line-break: anywhere;
|
|
}
|
|
|
|
&.identified {
|
|
font-family: var(--default-font);
|
|
font-size: 0.95em;
|
|
line-break: auto;
|
|
}
|
|
|
|
.hash-badge {
|
|
margin-right: 0.5em;
|
|
}
|
|
}
|
|
</style>
|