forked from coracle/flotilla
Jon Staab
32 lines
1.1 KiB
Svelte
32 lines
1.1 KiB
Svelte
<script lang="ts">
|
|
import {displayUrl} from "@welshman/lib"
|
|
import {preventDefault} from "@lib/html"
|
|
import LinkRound from "@assets/icons/link-round.svg?dataurl"
|
|
import Icon from "@lib/components/Icon.svelte"
|
|
import Link from "@lib/components/Link.svelte"
|
|
import ContentLinkDetail from "@app/components/ContentLinkDetail.svelte"
|
|
import {pushModal} from "@app/util/modal"
|
|
import {PLATFORM_URL} from "@app/core/state"
|
|
|
|
const {value} = $props()
|
|
|
|
const url = value.url.toString()
|
|
const external = !url.startsWith(PLATFORM_URL)
|
|
const href = external ? url : url.replace(PLATFORM_URL, "")
|
|
|
|
const expand = () => pushModal(ContentLinkDetail, {url}, {fullscreen: true})
|
|
</script>
|
|
|
|
{#if url.match(/\.(jpe?g|png|gif|webp)$/)}
|
|
<!-- Use a real link so people can copy the href -->
|
|
<a href={url} class="link-content whitespace-nowrap" onclick={preventDefault(expand)}>
|
|
<Icon icon={LinkRound} size={3} class="inline-block" />
|
|
{displayUrl(url)}
|
|
</a>
|
|
{:else}
|
|
<Link {external} {href} class="link-content whitespace-nowrap">
|
|
<Icon icon={LinkRound} size={3} class="inline-block" />
|
|
{displayUrl(url)}
|
|
</Link>
|
|
{/if}
|