51 lines
1.6 KiB
TypeScript
51 lines
1.6 KiB
TypeScript
import type { App } from 'vue'
|
|
import FloatingVue, { recomputeAllPoppers } from 'floating-vue'
|
|
import 'floating-vue/dist/style.css'
|
|
|
|
const isMobile = typeof navigator !== 'undefined' && /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)
|
|
|
|
export type FloatingVueConfig = Parameters<(typeof FloatingVue)['install']>[1]
|
|
|
|
export function enhanceTwoslash(app: App) {
|
|
if (typeof window !== 'undefined') {
|
|
// Recompute poppers when clicking on a tab
|
|
window.addEventListener('click', (e) => {
|
|
const path = e.composedPath()
|
|
if (path.some((el: any) => el?.classList?.contains?.('vp-code-group') || el?.classList?.contains?.('tabs')))
|
|
recomputeAllPoppers()
|
|
}, { passive: true })
|
|
}
|
|
app.use(FloatingVue, {
|
|
themes: {
|
|
'twoslash': {
|
|
$extend: 'dropdown',
|
|
triggers: isMobile ? ['touch'] : ['hover', 'touch'],
|
|
popperTriggers: isMobile ? ['touch'] : ['hover', 'touch'],
|
|
placement: 'bottom-start',
|
|
overflowPadding: 10,
|
|
delay: 0,
|
|
handleResize: false,
|
|
autoHide: true,
|
|
instantMove: true,
|
|
flip: false,
|
|
arrowPadding: 8,
|
|
autoBoundaryMaxSize: true,
|
|
},
|
|
'twoslash-query': {
|
|
$extend: 'twoslash',
|
|
triggers: ['click'],
|
|
popperTriggers: ['click'],
|
|
autoHide: false,
|
|
},
|
|
'twoslash-completion': {
|
|
$extend: 'twoslash-query',
|
|
triggers: ['click'],
|
|
popperTriggers: ['click'],
|
|
autoHide: false,
|
|
distance: 0,
|
|
arrowOverflow: true,
|
|
},
|
|
},
|
|
})
|
|
}
|