fix: wrong element type

Author: essenmitsosse

app/components/AppHeader.vue

@@ -150,7 +150,7 @@ onKeyStroke(
       </div>
 
       <!-- End: Desktop nav items + Mobile menu button -->
-      <ButtonGroup class="hidden sm:flex flex-shrink-0">
+      <ButtonGroup as="div" class="hidden sm:flex flex-shrink-0">
         <!-- Desktop: Compare link -->
         <LinkBase variant="button-secondary" to="/compare" keyshortcut="c">
           {{ $t('nav.compare') }}

app/components/Button/Group.vue

@@ -1,7 +1,14 @@
+<script setup lang="ts">
+const props = defineProps<{
+  as?: string | Component
+}>()
+</script>
+
 <template>
-  <nav
+  <component
+    :is="props.as || 'nav'"
     class="flex items-center shrink-0 ms-auto [&>*:not(:first-child)]:rounded-s-none [&>*:not(:first-child)]:border-s-0 [&>*:not(:last-child)]:rounded-e-none"
   >
     <slot />
-  </nav>
+  </component>
 </template>