fix(NavigationMenu): nested accordion context at every level (#4363)

Co-authored-by: Benjamin Canac <canacb1@gmail.com>
This commit is contained in:
Vachmara
2025-06-17 10:49:07 +02:00
committed by GitHub
parent 52f1963833
commit 2fa8db64dd

View File

@@ -236,20 +236,13 @@ const lists = computed<NavigationMenuItem[][]>(() =>
: [] : []
) )
function getAccordionDefaultValue(list: NavigationMenuItem[]) { function getAccordionDefaultValue(list: NavigationMenuItem[], level = 0) {
function findItemsWithDefaultOpen(items: NavigationMenuItem[], level = 0): string[] { const indexes = list.reduce((acc: string[], item, index) => {
return items.reduce((acc: string[], item, index) => { if (item.defaultOpen || item.open) {
if (item.defaultOpen || item.open) { acc.push(item.value || (level > 0 ? `item-${level}-${index}` : `item-${index}`))
acc.push(item.value || (level > 0 ? `item-${level}-${index}` : `item-${index}`)) }
} return acc
if (item.children?.length) { }, [])
acc.push(...findItemsWithDefaultOpen(item.children, level + 1))
}
return acc
}, [])
}
const indexes = findItemsWithDefaultOpen(list)
return props.type === 'single' ? indexes[0] : indexes return props.type === 'single' ? indexes[0] : indexes
} }
@@ -378,7 +371,14 @@ function getAccordionDefaultValue(list: NavigationMenuItem[]) {
</ULink> </ULink>
<AccordionContent v-if="orientation === 'vertical' && item.children?.length && !collapsed" :class="ui.content({ class: [props.ui?.content, item.ui?.content] })"> <AccordionContent v-if="orientation === 'vertical' && item.children?.length && !collapsed" :class="ui.content({ class: [props.ui?.content, item.ui?.content] })">
<ul :class="ui.childList({ class: props.ui?.childList })"> <AccordionRoot
v-bind="({
...accordionProps,
defaultValue: getAccordionDefaultValue(item.children, level + 1)
} as AccordionRootProps)"
as="ul"
:class="ui.childList({ class: props.ui?.childList })"
>
<ReuseItemTemplate <ReuseItemTemplate
v-for="(childItem, childIndex) in item.children" v-for="(childItem, childIndex) in item.children"
:key="childIndex" :key="childIndex"
@@ -387,7 +387,7 @@ function getAccordionDefaultValue(list: NavigationMenuItem[]) {
:level="level + 1" :level="level + 1"
:class="ui.childItem({ class: [props.ui?.childItem, childItem.ui?.childItem] })" :class="ui.childItem({ class: [props.ui?.childItem, childItem.ui?.childItem] })"
/> />
</ul> </AccordionRoot>
</AccordionContent> </AccordionContent>
</component> </component>
</DefineItemTemplate> </DefineItemTemplate>