mirror of
https://github.com/imezx/Warp.git
synced 2025-04-25 07:30:02 +00:00
43 lines
940 B
Vue
43 lines
940 B
Vue
|
<script lang="ts" setup>
|
||
|
|
import type { DefaultTheme } from 'vitepress/theme'
|
||
|
|
import { computed } from 'vue'
|
||
|
|
import { useData } from '../composables/data'
|
||
|
|
import { isActive } from '../../shared'
|
||
|
|
import VPFlyout from './VPFlyout.vue'
|
||
|
|
|
||
|
|
const props = defineProps<{
|
||
|
|
item: DefaultTheme.NavItemWithChildren
|
||
|
|
}>()
|
||
|
|
|
||
|
|
const { page } = useData()
|
||
|
|
|
||
|
|
const isChildActive = (navItem: DefaultTheme.NavItem) => {
|
||
|
|
if ('link' in navItem) {
|
||
|
|
return isActive(
|
||
|
|
page.value.relativePath,
|
||
|
|
navItem.link,
|
||
|
|
!!props.item.activeMatch
|
||
|
|
)
|
||
|
|
} else {
|
||
|
|
return navItem.items.some(isChildActive)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
const childrenActive = computed(() => isChildActive(props.item))
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<VPFlyout
|
||
|
|
:class="{
|
||
|
|
VPNavBarMenuGroup: true,
|
||
|
|
active: isActive(
|
||
|
|
page.relativePath,
|
||
|
|
item.activeMatch,
|
||
|
|
!!item.activeMatch
|
||
|
|
) || childrenActive
|
||
|
|
}"
|
||
|
|
:button="item.text"
|
||
|
|
:items="item.items"
|
||
|
|
/>
|
||
|
|
</template>
|