@slidev/client 0.48.0-beta.2 → 0.48.0-beta.21

package/builtin/VClicks.ts

@@ -96,7 +96,7 @@ export default defineComponent({
         if (depth < +this.depth && Array.isArray(i.children))
           vNode = h(i, {}, mapSubList(i.children, depth))
         else
-          vNode = i
+          vNode = h(i)
 
         const delta = thisShowIdx - execIdx
         execIdx = thisShowIdx

package/composables/useClicks.ts

@@ -1,12 +1,13 @@
 import { sum } from '@antfu/utils'
-import type { ClicksContext } from '@slidev/types'
+import type { ClicksContext, SlideRoute } from '@slidev/types'
 import type { Ref } from 'vue'
-import { ref, shallowReactive } from 'vue'
-import type { RouteRecordRaw } from 'vue-router'
-import { currentRoute, isPrintMode, isPrintWithClicks, queryClicks, routeForceRefresh } from '../logic/nav'
+import { computed, ref, shallowReactive } from 'vue'
+import { currentSlideNo, isPrintMode, isPrintWithClicks } from '../logic/nav'
 import { normalizeAtProp } from '../logic/utils'
+import { CLICKS_MAX } from '../constants'
+import { routeForceRefresh, useRouteQuery } from '../logic/route'
 
-function useClicksContextBase(route: RouteRecordRaw | undefined, getCurrent: () => number): ClicksContext {
+function useClicksContextBase(current: Ref<number>, clicksOverrides?: number): ClicksContext {
   const relativeOffsets: ClicksContext['relativeOffsets'] = new Map()
   const map: ClicksContext['map'] = shallowReactive(new Map())
 
@@ -15,7 +16,10 @@ function useClicksContextBase(route: RouteRecordRaw | undefined, getCurrent: ()
       return isPrintMode.value && !isPrintWithClicks.value
     },
     get current() {
-      return getCurrent()
+      return current.value
+    },
+    set current(value) {
+      current.value = value
     },
     relativeOffsets,
     map,
@@ -53,31 +57,46 @@ function useClicksContextBase(route: RouteRecordRaw | undefined, getCurrent: ()
     get total() {
       // eslint-disable-next-line no-unused-expressions
       routeForceRefresh.value
-      return route?.meta?.clicks
+      return clicksOverrides
         ?? Math.max(0, ...[...map.values()].map(v => v.max || 0))
     },
   }
 }
 
-export function usePrimaryClicks(route: RouteRecordRaw | undefined): ClicksContext {
+const queryClicksRaw = useRouteQuery('clicks', '0')
+
+export function usePrimaryClicks(route: SlideRoute): ClicksContext {
   if (route?.meta?.__clicksContext)
     return route.meta.__clicksContext
-  const thisPath = +(route?.path ?? 99999)
-  const context = useClicksContextBase(route, () => {
-    const currentPath = +(currentRoute.value?.path ?? 99999)
-    if (currentPath === thisPath)
-      return queryClicks.value
-    else if (currentPath > thisPath)
-      return 99999
-    else
-      return 0
+  const thisNo = route.no
+  const current = computed({
+    get() {
+      // eslint-disable-next-line ts/no-use-before-define
+      if (context.disabled)
+        return CLICKS_MAX
+      if (currentSlideNo.value === thisNo)
+        return +(queryClicksRaw.value || 0) || 0
+      else if (currentSlideNo.value > thisNo)
+        return CLICKS_MAX
+      else
+        return 0
+    },
+    set(v) {
+      if (currentSlideNo.value === thisNo) {
+        // eslint-disable-next-line ts/no-use-before-define
+        queryClicksRaw.value = Math.min(v, context.total).toString()
+      }
+    },
   })
+  const context = useClicksContextBase(
+    current,
+    route?.meta?.clicks,
+  )
   if (route?.meta)
     route.meta.__clicksContext = context
   return context
 }
 
-export function useFixedClicks(route: RouteRecordRaw | undefined, currentInit = 0): [Ref<number>, ClicksContext] {
-  const current = ref(currentInit)
-  return [current, useClicksContextBase(route, () => current.value)]
+export function useFixedClicks(route?: SlideRoute | undefined, currentInit = 0): ClicksContext {
+  return useClicksContextBase(ref(currentInit), route?.meta?.clicks)
 }

package/composables/useContext.ts

@@ -1,16 +1,11 @@
-import type { ComputedRef } from 'vue'
 import { computed } from 'vue'
-import type { RouteLocationNormalizedLoaded } from 'vue-router'
-import type { SlidevContext } from '../modules/context'
 import { configs } from '../env'
-import { useNav } from './useNav'
+import type { SlidevContext } from '../modules/context'
+import * as nav from '../logic/nav'
 
-export function useContext(
-  route: ComputedRef<RouteLocationNormalizedLoaded>,
-): SlidevContext {
-  const nav = useNav(route)
+export function useContext(): SlidevContext {
   return {
-    nav,
+    nav: { ...nav }, // Convert the module to a plain object
     configs,
     themeConfigs: computed(() => configs.themeConfig),
   }

package/composables/useNav.ts

@@ -1,55 +1,193 @@
-import type { ComputedRef } from 'vue'
-import { computed } from 'vue'
-import type { RouteLocationNormalizedLoaded, RouteRecordRaw } from 'vue-router'
-import type { TocItem } from '@slidev/types'
-import type { SlidevContextNav } from '../modules/context'
-import { addToTree, clicks, clicksContext, clicksTotal, downloadPDF, filterTree, getPath, getTreeWithActiveStatuses, go, next, nextSlide, openInEditor, prev, prevSlide } from '../logic/nav'
-import { rawRoutes } from '../routes'
-
-export function useNav(route: ComputedRef<RouteRecordRaw | RouteLocationNormalizedLoaded>): SlidevContextNav {
-  const path = computed(() => route.value.path)
-  const total = computed(() => rawRoutes.length)
-
-  const currentPage = computed(() => Number.parseInt(path.value.split(/\//g).slice(-1)[0]) || 1)
-  const currentPath = computed(() => getPath(currentPage.value))
-  const currentRoute = computed(() => rawRoutes.find(i => i.path === `${currentPage.value}`) ?? rawRoutes.at(-1) ?? rawRoutes[0])
-  const currentSlideId = computed(() => currentRoute.value?.meta?.slide?.id)
-  const currentLayout = computed(() => currentRoute.value?.meta?.layout || (currentPage.value === 1 ? 'cover' : 'default'))
-
-  const nextRoute = computed(() => rawRoutes.find(i => i.path === `${Math.min(rawRoutes.length, currentPage.value + 1)}`))
-
-  const rawTree = computed(() => rawRoutes
-    .filter((route: RouteRecordRaw) => route.meta?.slide?.title)
-    .reduce((acc: TocItem[], route: RouteRecordRaw) => {
-      addToTree(acc, route)
-      return acc
-    }, []))
-  const treeWithActiveStatuses = computed(() => getTreeWithActiveStatuses(rawTree.value, currentRoute.value))
-  const tree = computed(() => filterTree(treeWithActiveStatuses.value))
+import type { ClicksContext, SlideRoute, TocItem } from '@slidev/types'
+import type { ComputedRef, Ref, TransitionGroupProps } from 'vue'
+import { computed, ref, watch } from 'vue'
+import type { Router } from 'vue-router'
+import { getCurrentTransition } from '../logic/transition'
+import { getSlidePath } from '../logic/slides'
+import { useTocTree } from './useTocTree'
+import { skipTransition } from './hmr'
+import { slides } from '#slidev/slides'
+
+export interface SlidevContextNav {
+  slides: Ref<SlideRoute[]>
+  total: ComputedRef<number>
+
+  currentPath: ComputedRef<string>
+  currentPage: ComputedRef<number>
+  currentSlideNo: ComputedRef<number>
+  currentSlideRoute: ComputedRef<SlideRoute>
+  currentTransition: ComputedRef<TransitionGroupProps | undefined>
+  currentLayout: ComputedRef<string>
+
+  nextRoute: ComputedRef<SlideRoute>
+  prevRoute: ComputedRef<SlideRoute>
+  hasNext: ComputedRef<boolean>
+  hasPrev: ComputedRef<boolean>
+
+  clicksContext: ComputedRef<ClicksContext>
+  clicks: ComputedRef<number>
+  clicksTotal: ComputedRef<number>
+
+  /** The table of content tree */
+  tocTree: ComputedRef<TocItem[]>
+  /** The direction of the navigation, 1 for forward, -1 for backward */
+  navDirection: Ref<number>
+  /** The direction of the clicks, 1 for forward, -1 for backward */
+  clicksDirection: Ref<number>
+  /** Utility function for open file in editor, only avaible in dev mode  */
+  openInEditor: (url?: string) => Promise<boolean>
+
+  /** Go to next click */
+  next: () => Promise<void>
+  /** Go to previous click */
+  prev: () => Promise<void>
+  /** Go to next slide */
+  nextSlide: () => Promise<void>
+  /** Go to previous slide */
+  prevSlide: (lastClicks?: boolean) => Promise<void>
+  /** Go to slide */
+  go: (page: number | string, clicks?: number) => Promise<void>
+  /** Go to the first slide */
+  goFirst: () => Promise<void>
+  /** Go to the last slide */
+  goLast: () => Promise<void>
+}
+
+export function useNavBase(
+  currentSlideRoute: ComputedRef<SlideRoute>,
+  clicksContext: ComputedRef<ClicksContext>,
+  queryClicks: Ref<number> = ref(0),
+  router?: Router,
+): SlidevContextNav {
+  const total = computed(() => slides.value.length)
+
+  const navDirection = ref(0)
+  const clicksDirection = ref(0)
+
+  const currentPath = computed(() => getSlidePath(currentSlideRoute.value))
+  const currentSlideNo = computed(() => currentSlideRoute.value.no)
+  const currentLayout = computed(() => currentSlideRoute.value.meta?.layout || (currentSlideNo.value === 1 ? 'cover' : 'default'))
+
+  const clicks = computed(() => clicksContext.value.current)
+  const clicksTotal = computed(() => clicksContext.value.total)
+  const nextRoute = computed(() => slides.value[Math.min(slides.value.length, currentSlideNo.value + 1) - 1])
+  const prevRoute = computed(() => slides.value[Math.max(1, currentSlideNo.value - 1) - 1])
+  const hasNext = computed(() => currentSlideNo.value < slides.value.length || clicks.value < clicksTotal.value)
+  const hasPrev = computed(() => currentSlideNo.value > 1 || clicks.value > 0)
+
+  const currentTransition = computed(() => getCurrentTransition(navDirection.value, currentSlideRoute.value, prevRoute.value))
+
+  watch(currentSlideRoute, (next, prev) => {
+    navDirection.value = next.no - prev.no
+  })
+
+  async function openInEditor(url?: string) {
+    if (!__DEV__)
+      return false
+    if (url == null) {
+      const slide = currentSlideRoute.value?.meta?.slide
+      if (!slide)
+        return false
+      url = `${slide.filepath}:${slide.start}`
+    }
+    await fetch(`/__open-in-editor?file=${encodeURIComponent(url)}`)
+    return true
+  }
+
+  const tocTree = useTocTree(slides)
+
+  async function next() {
+    clicksDirection.value = 1
+    if (clicksTotal.value <= queryClicks.value)
+      await nextSlide()
+    else
+      queryClicks.value += 1
+  }
+
+  async function prev() {
+    clicksDirection.value = -1
+    if (queryClicks.value <= 0)
+      await prevSlide()
+    else
+      queryClicks.value -= 1
+  }
+
+  async function nextSlide() {
+    clicksDirection.value = 1
+    if (currentSlideNo.value < slides.value.length)
+      await go(currentSlideNo.value + 1)
+  }
+
+  async function prevSlide(lastClicks = true) {
+    clicksDirection.value = -1
+    const next = Math.max(1, currentSlideNo.value - 1)
+    await go(next)
+    if (lastClicks && clicksTotal.value) {
+      router?.replace({
+        query: { ...router.currentRoute.value.query, clicks: clicksTotal.value },
+      })
+    }
+  }
+
+  function goFirst() {
+    return go(1)
+  }
+
+  function goLast() {
+    return go(total.value)
+  }
+
+  async function go(page: number | string, clicks?: number) {
+    skipTransition.value = false
+    await router?.push({
+      path: getSlidePath(page),
+      query: { ...router.currentRoute.value.query, clicks },
+    })
+  }
 
   return {
-    rawRoutes,
-    route,
-    path,
+    slides,
     total,
-    clicksContext,
-    clicks,
-    clicksTotal,
-    currentPage,
     currentPath,
-    currentRoute,
-    currentSlideId,
+    currentSlideNo,
+    currentPage: currentSlideNo,
+    currentSlideRoute,
     currentLayout,
+    currentTransition,
+    clicksDirection,
     nextRoute,
-    rawTree,
-    treeWithActiveStatuses,
-    tree,
-    go,
-    downloadPDF,
-    next,
-    nextSlide,
+    prevRoute,
+    clicksContext,
+    clicks,
+    clicksTotal,
+    hasNext,
+    hasPrev,
+    tocTree,
+    navDirection,
     openInEditor,
+    next,
     prev,
+    go,
+    goLast,
+    goFirst,
+    nextSlide,
     prevSlide,
   }
 }
+
+export function useFixedNav(
+  currentSlideRoute: SlideRoute,
+  clicksContext: ClicksContext,
+): SlidevContextNav {
+  const noop = async () => { }
+  return {
+    ...useNavBase(computed(() => currentSlideRoute), computed(() => clicksContext)),
+    next: noop,
+    prev: noop,
+    nextSlide: noop,
+    prevSlide: noop,
+    goFirst: noop,
+    goLast: noop,
+    go: noop,
+  }
+}

package/composables/useSwipeControls.ts

@@ -0,0 +1,40 @@
+import type { Ref } from 'vue'
+import { ref } from 'vue'
+import { timestamp, usePointerSwipe } from '@vueuse/core'
+import { isDrawing } from '../logic/drawings'
+import { next, nextSlide, prev, prevSlide } from '../logic/nav'
+
+export function useSwipeControls(root: Ref<HTMLElement | undefined>) {
+  const swipeBegin = ref(0)
+  const { direction, distanceX, distanceY } = usePointerSwipe(root, {
+    pointerTypes: ['touch'],
+    onSwipeStart() {
+      if (isDrawing.value)
+        return
+      swipeBegin.value = timestamp()
+    },
+    onSwipeEnd() {
+      if (!swipeBegin.value)
+        return
+      if (isDrawing.value)
+        return
+
+      const x = Math.abs(distanceX.value)
+      const y = Math.abs(distanceY.value)
+      if (x / window.innerWidth > 0.3 || x > 75) {
+        if (direction.value === 'left')
+          next()
+
+        else
+          prev()
+      }
+      else if (y / window.innerHeight > 0.4 || y > 200) {
+        if (direction.value === 'down')
+          prevSlide()
+
+        else
+          nextSlide()
+      }
+    },
+  })
+}

package/composables/useTocTree.ts

@@ -0,0 +1,63 @@
+import type { SlideRoute, TocItem } from '@slidev/types'
+import type { ComputedRef, Ref } from 'vue'
+import { computed } from 'vue'
+import { currentSlideNo, currentSlideRoute, getSlidePath } from '../logic/nav'
+
+function addToTree(tree: TocItem[], route: SlideRoute, level = 1) {
+  const titleLevel = route.meta?.slide?.level
+  if (titleLevel && titleLevel > level && tree.length > 0) {
+    addToTree(tree[tree.length - 1].children, route, level + 1)
+  }
+  else {
+    tree.push({
+      no: route.no,
+      children: [],
+      level,
+      path: getSlidePath(route.meta.slide?.frontmatter?.routeAlias ?? route.no),
+      hideInToc: Boolean(route.meta?.slide?.frontmatter?.hideInToc),
+      title: route.meta?.slide?.title,
+    })
+  }
+}
+
+function getTreeWithActiveStatuses(
+  tree: TocItem[],
+  currentRoute?: SlideRoute,
+  hasActiveParent = false,
+  parent?: TocItem,
+): TocItem[] {
+  return tree.map((item: TocItem) => {
+    const clone = {
+      ...item,
+      active: item.no === currentSlideNo.value,
+      hasActiveParent,
+    }
+    if (clone.children.length > 0)
+      clone.children = getTreeWithActiveStatuses(clone.children, currentRoute, clone.active || clone.hasActiveParent, clone)
+    if (parent && (clone.active || clone.activeParent))
+      parent.activeParent = true
+    return clone
+  })
+}
+
+function filterTree(tree: TocItem[], level = 1): TocItem[] {
+  return tree
+    .filter((item: TocItem) => !item.hideInToc)
+    .map((item: TocItem) => ({
+      ...item,
+      children: filterTree(item.children, level + 1),
+    }))
+}
+
+export function useTocTree(slides: Ref<SlideRoute[]>): ComputedRef<TocItem[]> {
+  const rawTree = computed(() => slides.value
+    .filter((route: SlideRoute) => route.meta?.slide?.title)
+    .reduce((acc: TocItem[], route: SlideRoute) => {
+      addToTree(acc, route)
+      return acc
+    }, []))
+
+  const treeWithActiveStatuses = computed(() => getTreeWithActiveStatuses(rawTree.value, currentSlideRoute.value))
+
+  return computed(() => filterTree(treeWithActiveStatuses.value))
+}

package/constants.ts

@@ -1,16 +1,17 @@
 import type { ComputedRef, InjectionKey, Ref, UnwrapNestedRefs } from 'vue'
-import type { RouteRecordRaw } from 'vue-router'
-import type { ClicksContext, RenderContext } from '@slidev/types'
+import type { ClicksContext, RenderContext, SlideRoute } from '@slidev/types'
 import type { SlidevContext } from './modules/context'
 
-export const injectionClicksContext: InjectionKey<Ref<ClicksContext>> = Symbol('slidev-clicks-context')
-export const injectionCurrentPage: InjectionKey<Ref<number>> = Symbol('slidev-page')
-export const injectionSlideScale: InjectionKey<ComputedRef<number>> = Symbol('slidev-slide-scale')
-export const injectionSlidevContext: InjectionKey<UnwrapNestedRefs<SlidevContext>> = Symbol('slidev-slidev-context')
-export const injectionRoute: InjectionKey<RouteRecordRaw> = Symbol('slidev-route')
-export const injectionRenderContext: InjectionKey<Ref<RenderContext>> = Symbol('slidev-render-context')
-export const injectionActive: InjectionKey<Ref<boolean>> = Symbol('slidev-active')
-export const injectionFrontmatter: InjectionKey<Record<string, any>> = Symbol('slidev-fontmatter')
+// Here we use string literal instead of symbols to make HMR more stable
+// The value of the injections keys are implementation details, you should always use them with the reference to the constant instead of the value
+export const injectionClicksContext = '$$slidev-clicks-context' as unknown as InjectionKey<Ref<ClicksContext>>
+export const injectionCurrentPage = '$$slidev-page' as unknown as InjectionKey<Ref<number>>
+export const injectionSlideScale = '$$slidev-slide-scale' as unknown as InjectionKey<ComputedRef<number>>
+export const injectionSlidevContext = '$$slidev-context' as unknown as InjectionKey<UnwrapNestedRefs<SlidevContext>>
+export const injectionRoute = '$$slidev-route' as unknown as InjectionKey<SlideRoute>
+export const injectionRenderContext = '$$slidev-render-context' as unknown as InjectionKey<Ref<RenderContext>>
+export const injectionActive = '$$slidev-active' as unknown as InjectionKey<Ref<boolean>>
+export const injectionFrontmatter = '$$slidev-fontmatter' as unknown as InjectionKey<Record<string, any>>
 
 export const CLASS_VCLICK_TARGET = 'slidev-vclick-target'
 export const CLASS_VCLICK_HIDDEN = 'slidev-vclick-hidden'
@@ -20,7 +21,55 @@ export const CLASS_VCLICK_HIDDEN_EXP = 'slidev-vclick-hidden-explicitly'
 export const CLASS_VCLICK_CURRENT = 'slidev-vclick-current'
 export const CLASS_VCLICK_PRIOR = 'slidev-vclick-prior'
 
+export const CLICKS_MAX = 999999
+
 export const TRUST_ORIGINS = [
   'localhost',
   '127.0.0.1',
 ]
+
+export const FRONTMATTER_FIELDS = [
+  'clicks',
+  'disabled',
+  'hide',
+  'hideInToc',
+  'layout',
+  'level',
+  'preload',
+  'routeAlias',
+  'src',
+  'title',
+  'transition',
+  'zoom',
+]
+
+export const HEADMATTER_FIELDS = [
+  ...FRONTMATTER_FIELDS,
+  'theme',
+  'titleTemplate',
+  'info',
+  'author',
+  'keywords',
+  'presenter',
+  'download',
+  'exportFilename',
+  'export',
+  'highlighter',
+  'lineNumbers',
+  'monaco',
+  'remoteAssets',
+  'selectable',
+  'record',
+  'colorSchema',
+  'routerMode',
+  'aspectRatio',
+  'canvasWidth',
+  'themeConfig',
+  'favicon',
+  'plantUmlServer',
+  'fonts',
+  'defaults',
+  'drawings',
+  'htmlAttrs',
+  'mdc',
+]

package/context.ts

@@ -0,0 +1,73 @@
+import { ref, shallowRef, toRef } from 'vue'
+import { injectLocal, objectOmit, provideLocal } from '@vueuse/core'
+import { useFixedClicks } from './composables/useClicks'
+import {
+  FRONTMATTER_FIELDS,
+  HEADMATTER_FIELDS,
+  injectionClicksContext,
+  injectionCurrentPage,
+  injectionFrontmatter,
+  injectionRenderContext,
+  injectionRoute,
+  injectionSlideScale,
+  injectionSlidevContext,
+} from './constants'
+
+const clicksContextFallback = shallowRef(useFixedClicks())
+
+/**
+ * Get the current slide context, should be called inside the setup function of a component inside slide
+ */
+export function useSlideContext() {
+  const $slidev = injectLocal(injectionSlidevContext)!
+  const $nav = toRef($slidev, 'nav')
+  const $clicksContext = injectLocal(injectionClicksContext, clicksContextFallback)!.value
+  const $clicks = toRef($clicksContext, 'current')
+  const $page = injectLocal(injectionCurrentPage)!
+  const $renderContext = injectLocal(injectionRenderContext)!
+  const $frontmatter = injectLocal(injectionFrontmatter, {})
+  const $route = injectLocal(injectionRoute, undefined)
+  const $scale = injectLocal(injectionSlideScale, ref(1))!
+
+  return {
+    $slidev,
+    $nav,
+    $clicksContext,
+    $clicks,
+    $page,
+    $route,
+    $renderContext,
+    $frontmatter,
+    $scale,
+  }
+}
+
+export function provideFrontmatter(frontmatter: Record<string, any>) {
+  provideLocal(injectionFrontmatter, frontmatter)
+
+  const {
+    $slidev,
+    $page,
+  } = useSlideContext()
+
+  // update frontmatter in router to make HMR work better
+  const route = $slidev.nav.slides.find(i => i.no === $page.value)
+  if (route?.meta?.slide?.frontmatter) {
+    for (const key of Object.keys(route.meta.slide.frontmatter)) {
+      if (!(key in frontmatter))
+        delete route.meta.slide.frontmatter[key]
+    }
+    Object.assign(route.meta.slide.frontmatter, frontmatter)
+  }
+}
+
+/**
+ * Convert frontmatter options to props for v-bind
+ * It removes known options fields, and expose an extra `frontmatter` field that contains full frontmatter
+ */
+export function frontmatterToProps(frontmatter: Record<string, any>, pageNo: number) {
+  return {
+    ...objectOmit(frontmatter, pageNo === 0 ? HEADMATTER_FIELDS : FRONTMATTER_FIELDS),
+    frontmatter,
+  }
+}

package/env.ts

@@ -1,15 +1,12 @@
-import type { SlidevConfig } from '@slidev/types'
-import type { UnwrapNestedRefs } from 'vue'
 import { computed } from 'vue'
 import { objectMap } from '@antfu/utils'
+import configs from '#slidev/configs'
 
-// @ts-expect-error missing types
-import _configs from '/@slidev/configs'
-import type { SlidevContext } from './modules/context'
+export { configs }
 
-export const configs = _configs as SlidevConfig
 export const slideAspect = configs.aspectRatio ?? (16 / 9)
 export const slideWidth = configs.canvasWidth ?? 980
+
 // To honor the aspect ratio more as possible, we need to approximate the height to the next integer.
 // Doing this, we will prevent on print, to create an additional empty white page after each page.
 export const slideHeight = Math.ceil(slideWidth / slideAspect)
@@ -17,9 +14,3 @@ export const slideHeight = Math.ceil(slideWidth / slideAspect)
 export const themeVars = computed(() => {
   return objectMap(configs.themeConfig || {}, (k, v) => [`--slidev-theme-${k}`, v])
 })
-
-declare module 'vue' {
-  interface ComponentCustomProperties {
-    $slidev: UnwrapNestedRefs<SlidevContext>
-  }
-}