2020-02-20 18:06:50 +01:00
|
|
|
<script>
|
2020-11-18 20:18:18 +01:00
|
|
|
import { getContext } from "svelte"
|
|
|
|
|
2020-11-20 10:50:10 +01:00
|
|
|
const { linkable, styleable } = getContext("sdk")
|
2020-11-24 12:02:10 +01:00
|
|
|
const component = getContext("component")
|
2020-11-13 16:42:32 +01:00
|
|
|
|
2020-02-25 16:21:23 +01:00
|
|
|
export let url = ""
|
|
|
|
export let text = ""
|
|
|
|
export let openInNewTab = false
|
2021-02-26 10:58:24 +01:00
|
|
|
export let external = false
|
2020-02-25 16:21:23 +01:00
|
|
|
|
|
|
|
$: target = openInNewTab ? "_blank" : "_self"
|
2020-02-20 18:06:50 +01:00
|
|
|
</script>
|
|
|
|
|
2021-02-26 10:58:24 +01:00
|
|
|
{#if external}
|
2021-05-04 12:04:42 +02:00
|
|
|
<a href={url || "/"} {target} use:styleable={$component.styles}>
|
2021-02-26 10:58:24 +01:00
|
|
|
{text}
|
|
|
|
<slot />
|
|
|
|
</a>
|
|
|
|
{:else}
|
2021-05-04 12:04:42 +02:00
|
|
|
<a href={url || "/"} use:linkable {target} use:styleable={$component.styles}>
|
2021-02-26 10:58:24 +01:00
|
|
|
{text}
|
|
|
|
<slot />
|
|
|
|
</a>
|
|
|
|
{/if}
|
2021-05-25 11:11:41 +02:00
|
|
|
|
|
|
|
<style>
|
|
|
|
a {
|
|
|
|
color: var(--spectrum-alias-text-color);
|
|
|
|
}
|
|
|
|
</style>
|