import DefaultTheme from 'vitepress/theme'
import { h, defineComponent } from 'vue'
import InstallApp from './InstallApp.vue'
import './custom.css'

if (typeof window !== 'undefined') {
  import('virtual:pwa-register').then(({ registerSW }) => {
    registerSW({ immediate: true })
  })
}

/** 旧 markdown 的 <font> 标签改为 div，避免手机端布局溢出 */
const MdFont = defineComponent({
  name: 'MdFont',
  setup(_, { slots }) {
    return () => h('div', { class: 'vp-md-font' }, slots.default?.())
  },
})

export default {
  extends: DefaultTheme,
  enhanceApp({ app }) {
    app.component('font', MdFont)
  },
  Layout: () => {
    return h(DefaultTheme.Layout, null, {
      'layout-bottom': () => h(InstallApp),
    })
  },
}