Define when Button url is external

This commit is contained in:
2021-11-07 11:48:01 +01:00
parent 60f2ee526d
commit 380cb3e7d4

View File

@@ -16,6 +16,12 @@
...[color, size].map(variant => variant && `${className}--${variant}`), ...[color, size].map(variant => variant && `${className}--${variant}`),
$$props.class $$props.class
].join(' ').trim() ].join(' ').trim()
// Define external links
let rel: string, target: string
$: isExternal = /(http(s?)):\/\//i.test(url)
$: rel = isExternal ? 'external noopener noreferrer' : null
$: target = isExternal ? '_blank' : null
</script> </script>
{#if tag === 'button'} {#if tag === 'button'}
@@ -24,7 +30,13 @@
<SplitText {text} clone={true} /> <SplitText {text} clone={true} />
</button> </button>
{:else if tag === 'a'} {:else if tag === 'a'}
<a href={url} class={classes} on:click sveltekit:prefetch> <a
href={url} class={classes}
{rel} {target}
sveltekit:prefetch={url && isExternal ? null : true}
disabled={disabled}
on:click
>
<slot /> <slot />
<SplitText {text} clone={true} /> <SplitText {text} clone={true} />
</a> </a>