fix bug with menu item double trigger

deck9 · May 29, 2023 · 57318cc · 57318cc
1 parent fd9bc63
commit 57318cc
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 6 deletions.
diff --git a/.nvmrc b/.nvmrc
@@ -0,0 +1 @@
+lts/*
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@deck9/ui",
-  "version": "0.12.9",
+  "version": "0.12.10",
   "description": "The UI components used in deck9 software applications.",
   "author": "Philipp Reinking <[email protected]> (https://deck9.co)",
   "scripts": {

diff --git a/src/Menu/MenuLink.vue b/src/Menu/MenuLink.vue
@@ -1,18 +1,33 @@
 <template>
   <MenuItem v-slot="{ active }" v-bind="{ disabled }">
-    <span
-      class="flex items-center justify-between px-4 py-2 text-xs leading-5 transition-colors duration-100 rounded-lg"
+    <component
+      :is="as || 'span'"
+      class="
+        flex
+        items-center
+        justify-between
+        px-4
+        py-2
+        text-xs
+        leading-5
+        transition-colors
+        duration-100
+        rounded-lg
+      "
       :class="[
         active ? 'bg-grey-200' : '',
         disabled
           ? 'opacity-50 pointer-events-none'
           : 'hover:bg-grey-200 focus:bg-grey-200 focus:outline-none',
       ]"
-      v-bind="$attrs"
     >
       <span>{{ label }}</span>
-      <span v-if="meta" class="bg-grey-300 px-2 rounded-lg max-w-[66px] truncate">{{ meta }}</span>
-    </span>
+      <span
+        v-if="meta"
+        class="bg-grey-300 px-2 rounded-lg max-w-[66px] truncate"
+        >{{ meta }}</span
+      >
+    </component>
   </MenuItem>
 </template>
 
@@ -23,5 +38,6 @@ defineProps<{
   label?: string;
   meta?: string;
   disabled?: boolean;
+  as?: string;
 }>();
 </script>