From 8b4e2da3656deddff1cf6edb2c81ec1f2891ebea Mon Sep 17 00:00:00 2001
From: Stuart Clark <stu@rtclark.net>
Date: Fri, 10 Nov 2023 10:37:52 +1100
Subject: [PATCH] feat(#9): update menu

---
 src/components/Menu.vue       |  2 +-
 src/components/MenuItem.vue   | 12 +++++++-----
 src/components/Navigation.vue |  5 ++++-
 3 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index c1a1e51..c188bce 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -35,7 +35,7 @@ export default {
     },
     type: {
       type: String,
-      default: 'collapsible'
+      default: undefined
     }
   }
 }
diff --git a/src/components/MenuItem.vue b/src/components/MenuItem.vue
index 30f63df..7ba05c8 100644
--- a/src/components/MenuItem.vue
+++ b/src/components/MenuItem.vue
@@ -26,23 +26,24 @@
 
     <!-- Children - Collapsible -->
     <div
-      v-if="isCollapsible && hasChildren"
+      v-if="!isFlyout && hasChildren"
       class="ct-menu__sub-menu__wrapper"
       :class="{
         [`ct-menu__sub-menu__wrapper--level-${level + 1}`]: true,
       }"
-      data-collapsible-panel
-      data-collapsible-trigger-no-icon
+      :data-collapsible-panel="isCollapsible"
+      :data-collapsible-trigger-no-icon="isCollapsible"
     >
       <CTMenu
         class="ct-menu__sub-menu"
         :level="level + 1"
         :items="item.children"
+        :theme="theme"
       />
     </div>
 
     <!-- Children - Flyout -->
-    <CTFlyout v-if="isFlyout && hasChildren">
+    <CTFlyout v-else-if="isFlyout && hasChildren">
       <template #open-button>
         <CTButton
           class="ct-mobile-navigation__open-subsection-trigger"
@@ -73,6 +74,7 @@
           :items="item.children"
           :level="level + 1"
           type="flyout"
+          :theme="theme"
         />
       </div>
     </CTFlyout>
@@ -96,7 +98,7 @@ export default {
     },
     type: {
       type: String,
-      default: 'collapsible'
+      default: undefined
     }
   },
 
diff --git a/src/components/Navigation.vue b/src/components/Navigation.vue
index 4ab3a78..0427d39 100644
--- a/src/components/Navigation.vue
+++ b/src/components/Navigation.vue
@@ -12,6 +12,7 @@
           class="ct-navigation__menu"
           :theme="theme"
           :items="items"
+          :type="type"
         />
       </slot>
     </div>
@@ -40,7 +41,9 @@ export default {
   },
 
   computed: {
-    dropdownClass: ({ dropdown }) => `ct-navigation--${dropdown}`
+    dropdownClass: ({ dropdown }) => `ct-navigation--${dropdown}`,
+
+    type: ({ dropdown }) => dropdown === 'dropdown' ? 'collapsible' : undefined,
   }
 }
 </script>