diff --git a/packages/nuxt/src/config/components.ts b/packages/nuxt/src/config/components.ts
index fd47a46669..efcdc71868 100644
--- a/packages/nuxt/src/config/components.ts
+++ b/packages/nuxt/src/config/components.ts
@@ -90,6 +90,7 @@ export default [
'VaMenuList',
'VaMenuItem',
'VaMenuGroup',
+ 'VaMenuFull',
'VaFormField',
'VaStickyScrollbar'
]
diff --git a/packages/ui/src/components/va-menu-list/CHANGELOG.md b/packages/ui/src/components/va-menu-list/CHANGELOG.md
new file mode 100644
index 0000000000..3914001045
--- /dev/null
+++ b/packages/ui/src/components/va-menu-list/CHANGELOG.md
@@ -0,0 +1,4 @@
+# 1.10.4
+
+- Add VaMenuFull component for Dividers and custom content
+- Removed virtual-td that breaks layout when using VaPopover, custom td or headless components
\ No newline at end of file
diff --git a/packages/ui/src/components/va-menu-list/VaMenuList.stories.ts b/packages/ui/src/components/va-menu-list/VaMenuList.stories.ts
index d1c1e213a6..ce970c64f3 100644
--- a/packages/ui/src/components/va-menu-list/VaMenuList.stories.ts
+++ b/packages/ui/src/components/va-menu-list/VaMenuList.stories.ts
@@ -2,6 +2,7 @@ import { VaDivider, VaButton, VaDropdown, VaIcon, VaAvatar } from '../../compone
import VaMenuList from './VaMenuList.vue'
import VaMenuItem from './components/VaMenuItem.vue'
import VaMenuGroup from './components/VaMenuGroup.vue'
+import VaMenuFull from './components/VaMenuFull.vue'
export default {
title: 'VaMenuList',
@@ -79,13 +80,45 @@ export const SlotUsage = () => ({
User 2
-
+
User 3
`,
})
+export const DivSlotUsage = () => ({
+ components: { VaMenuList, VaMenuItem, VaMenuGroup },
+ template: `
+
+
+
+ User 1
+
+
+ User 2
+
+
+
+ User 3
+
+
+
+ With v-if 1
+
+
+ With v-if 2
+
+
+
+ With v-if 2
+
+
+
+
+ `,
+})
+
export const HoverColor = () => ({
components: { VaMenuList, VaMenuItem, VaMenuGroup },
data: () => ({
@@ -97,7 +130,7 @@ export const HoverColor = () => ({
})
export const WithDivider = () => ({
- components: { VaMenuList, VaMenuItem, VaMenuGroup, VaDivider, VaButton },
+ components: { VaMenuList, VaMenuItem, VaMenuGroup, VaDivider, VaButton, VaMenuFull },
template: `
@@ -106,13 +139,15 @@ export const WithDivider = () => ({
User 2
-
+
+
+
User 3
-
+
Custom content
-
+
User 4
diff --git a/packages/ui/src/components/va-menu-list/VaMenuList.vue b/packages/ui/src/components/va-menu-list/VaMenuList.vue
index fc2925cac7..6c063975a7 100644
--- a/packages/ui/src/components/va-menu-list/VaMenuList.vue
+++ b/packages/ui/src/components/va-menu-list/VaMenuList.vue
@@ -2,21 +2,15 @@