Merge pull request #40 from nblackburn/feature/refactor-link

Refactor link
nblackburn · Nov 6, 2022 · 7031197 · 7031197
2 parents a78789f + a0a0f16
commit 7031197
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 16 deletions.
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
     "name": "@nblackburn/website",
     "private": true,
-    "version": "1.7.2",
+    "version": "1.7.3",
     "scripts": {
         "start": "astro dev",
         "build": "astro build",

diff --git a/src/components/link.vue b/src/components/link.vue
@@ -1,15 +1,5 @@
-<template>
-    <a
-        :href="refLink"
-        :rel="isExternal ? 'noopener' : ''"
-        :target="isExternal ? '_blank' : ''"
-    >
-        <slot />
-    </a>
-</template>
-
 <script lang="ts">
-import { computed } from 'vue';
+import { h } from 'vue';
 import { isExternalLink, buildRefLink } from '@utilities/refLink';
 
 export default {
@@ -24,11 +14,23 @@ export default {
         }
     },
 
-    setup(props) {
-        const isExternal = computed(() => isExternalLink(props.href));
-        const refLink = computed(() => buildRefLink(props.href, props.ref));
+    setup(props, { slots }) {
+        const tag = props.href ? 'a' : 'span';
+        const isExternal = isExternalLink(props.href);
+        const href = buildRefLink(props.href, props.ref);
+        const rel = isExternal ? 'noopener' : undefined;
+        const target = isExternal ? '_blank' : undefined;
 
-        return { isExternal, refLink };
+        return () =>
+            h(
+                tag,
+                {
+                    rel,
+                    href,
+                    target
+                },
+                slots.default()
+            );
     }
 };
 </script>