@dargmuesli/nuxt-vio 1.2.3 → 1.3.0

package/components/VioHr.vue

@@ -0,0 +1,3 @@
+<template>
+  <div class="h-px grow bg-gray-300 dark:bg-gray-600" />
+</template>

package/components/VioLink.vue

@@ -0,0 +1,57 @@
+<template>
+  <a
+    v-if="to.match(/^((ftp|http(s)?):\/\/|(mailto):)/)"
+    :aria-label="ariaLabel"
+    :class="classes"
+    :href="to"
+    :rel="
+      [...(nofollow ? ['nofollow'] : []), 'noopener', 'noreferrer'].join(' ')
+    "
+    target="_blank"
+    @click="emit('click')"
+  >
+    <slot />
+  </a>
+  <NuxtLink
+    v-else
+    :aria-label="ariaLabel"
+    :class="classes"
+    :to="isToRelative ? append(route.path, to) : to"
+    @click="emit('click')"
+  >
+    <slot />
+  </NuxtLink>
+</template>
+
+<script setup lang="ts">
+export interface Props {
+  ariaLabel?: string
+  isColored?: boolean
+  isToRelative?: boolean
+  isUnderlined?: boolean
+  nofollow?: boolean
+  to: string
+}
+const props = withDefaults(defineProps<Props>(), {
+  ariaLabel: undefined,
+  isColored: true,
+  isToRelative: false,
+  isUnderlined: false,
+  nofollow: false,
+})
+
+const emit = defineEmits<{
+  (e: 'click'): void
+}>()
+
+const route = useRoute()
+
+// computations
+const classes = computed(() => {
+  return [
+    'rounded',
+    ...(props.isColored ? ['text-link-dark dark:text-link-bright'] : []),
+    ...(props.isUnderlined ? ['underline'] : []),
+  ].join(' ')
+})
+</script>

package/layouts/default.vue

@@ -0,0 +1,7 @@
+<template>
+  <div class="p-4 md:px-8">
+    <main>
+      <slot />
+    </main>
+  </div>
+</template>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dargmuesli/nuxt-vio",
-  "version": "1.2.3",
+  "version": "1.3.0",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -10,7 +10,9 @@
   },
   "packageManager": "pnpm@8.2.0",
   "files": [
+    "components",
     "composables",
+    "layouts",
     "server",
     "plugins",
     "utils",