70 lines
1.6 KiB
TypeScript
70 lines
1.6 KiB
TypeScript
import type { DefaultTheme } from 'vitepress/theme'
|
|
import { ref, computed, watch } from 'vue'
|
|
import { useData, useRoute } from 'vitepress'
|
|
|
|
export function useNav() {
|
|
const isScreenOpen = ref(false)
|
|
|
|
function openScreen() {
|
|
isScreenOpen.value = true
|
|
window.addEventListener('resize', closeScreenOnTabletWindow)
|
|
}
|
|
|
|
function closeScreen() {
|
|
isScreenOpen.value = false
|
|
window.removeEventListener('resize', closeScreenOnTabletWindow)
|
|
}
|
|
|
|
function toggleScreen() {
|
|
isScreenOpen.value ? closeScreen() : openScreen()
|
|
}
|
|
|
|
/**
|
|
* Close screen when the user resizes the window wider than tablet size.
|
|
*/
|
|
function closeScreenOnTabletWindow() {
|
|
window.outerWidth >= 768 && closeScreen()
|
|
}
|
|
|
|
const route = useRoute()
|
|
watch(() => route.path, closeScreen)
|
|
|
|
return {
|
|
isScreenOpen,
|
|
openScreen,
|
|
closeScreen,
|
|
toggleScreen
|
|
}
|
|
}
|
|
|
|
export function useLanguageLinks() {
|
|
const { site, localePath, theme } = useData()
|
|
|
|
return computed(() => {
|
|
const { langs } = site.value
|
|
const localePaths = Object.keys(langs)
|
|
|
|
// one language
|
|
if (localePaths.length < 2) {
|
|
return null
|
|
}
|
|
|
|
const route = useRoute()
|
|
|
|
// intentionally remove the leading slash because each locale has one
|
|
const currentPath = route.path.replace(localePath.value, '')
|
|
|
|
const candidates = localePaths.map((localePath) => ({
|
|
text: langs[localePath].label,
|
|
link: `${localePath}${currentPath}`
|
|
}))
|
|
|
|
const selectText = theme.value.selectText || 'Languages'
|
|
|
|
return {
|
|
text: selectText,
|
|
items: candidates
|
|
} as DefaultTheme.NavItemWithChildren
|
|
})
|
|
}
|