vitepress 2.0.0-alpha.16 → 2.0.0-alpha.18

package/README.md

@@ -26,3 +26,14 @@ Please make sure to read the [Contributing Guide](https://github.com/vuejs/vitep
 [MIT](https://github.com/vuejs/vitepress/blob/main/LICENSE)
 
 Copyright (c) 2019-present, Yuxi (Evan) You
+
+## Special Thanks
+
+This project would not be possible without the support of these amazing companies and tools.
+
+|                                                                                                                                             |                                              |                                                                                                                                                                                                        |
+| ------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
+| <a href="https://voidzero.dev" target="_blank"><img alt="VoidZero's logo" src="https://github.com/voidzero-dev.png" width="80" /></a>         | **[VoidZero](https://voidzero.dev)**         | The company behind Vite, Vitest, Rolldown, and Oxc. VoidZero has been a long-time sponsor of VitePress. VitePress itself is built on top of this ecosystem of high-performance JavaScript tooling.     |
+| <a href="https://stackblitz.com" target="_blank"><img alt="StackBlitz's logo" src="https://github.com/stackblitz.png" width="80" /></a>       | **[StackBlitz](https://stackblitz.com)**     | Creators of WebContainers and a browser-based development platform. Their technology powers the VitePress playground and provides instant preview releases for our pull requests and commits.          |
+| <a href="https://algolia.com" target="_blank"><img alt="Algolia's logo" src="https://github.com/algolia.png" width="80" /></a>                | **[Algolia](https://algolia.com)**           | An AI-powered search platform that provides fast, scalable search. Algolia powers DocSearch for VitePress. Their team has been a long-time partner in building and maintaining our search integration. |
+| <a href="https://browserstack.com" target="_blank"><img alt="BrowserStack's logo" src="https://github.com/browserstack.png" width="80" /></a> | **[BrowserStack](https://browserstack.com)** | A cloud-based testing platform for websites and mobile apps. BrowserStack provides the cross-browser and real-device infrastructure used to ensure VitePress works consistently across all browsers.   |

package/dist/client/app/composables/copyCode.js

@@ -41,7 +41,7 @@ export function useCopyCode() {
 }
 async function copyToClipboard(text) {
     try {
-        return navigator.clipboard.writeText(text);
+        await navigator.clipboard.writeText(text);
     }
     catch {
         const element = document.createElement('textarea');

package/dist/client/app/index.js

@@ -136,7 +136,7 @@ if (inBrowser) {
             app.mount('#app');
             // scroll to hash on new tab during dev
             if (import.meta.env.DEV && location.hash) {
-                scrollTo(location.hash);
+                setTimeout(() => scrollTo(location.hash), 100);
             }
         });
     });

package/dist/client/app/router.js

@@ -1,7 +1,7 @@
 import { inject, markRaw, nextTick, reactive, readonly } from 'vue';
 import { notFoundPageData, treatAsHtml } from '../shared';
 import { siteDataRef } from './data';
-import { getScrollOffset, inBrowser, withBase } from './utils';
+import { inBrowser, withBase } from './utils';
 export const RouterSymbol = Symbol();
 // we are just using URL to parse the pathname and hash - the base doesn't
 // matter and is only passed to support same-host hrefs
@@ -18,17 +18,25 @@ export function createRouter(loadPageModule, fallbackComponent) {
     const router = {
         route,
         async go(href, options) {
+            const { hash } = new URL(href, fakeHost);
+            const hasTextFragment = inBrowser && document.fragmentDirective && hash.includes(':~:');
             href = normalizeHref(href);
             if ((await router.onBeforeRouteChange?.(href)) === false)
                 return;
-            if (!inBrowser || (await changeRoute(href, options)))
-                await loadPage(href);
+            if (!inBrowser ||
+                (await changeRoute(href, { ...options, hasTextFragment }))) {
+                await loadPage(href, { initialLoad: !!options?.initialLoad });
+            }
+            if (hasTextFragment) {
+                // this will create a new history entry, but that's almost unavoidable
+                location.hash = hash;
+            }
             syncRouteQueryAndHash();
             await router.onAfterRouteChange?.(href);
         }
     };
     let latestPendingPath = null;
-    async function loadPage(href, scrollPosition = 0, isRetry = false) {
+    async function loadPage(href, { scrollPosition = 0, isRetry = false, initialLoad = false } = {}) {
         if ((await router.onBeforePageLoad?.(href)) === false)
             return;
         const targetLoc = new URL(href, fakeHost);
@@ -61,7 +69,8 @@ export function createRouter(loadPageModule, fallbackComponent) {
                             href = actualPathname + targetLoc.search + targetLoc.hash;
                             history.replaceState({}, '', href);
                         }
-                        return scrollTo(targetLoc.hash, false, scrollPosition);
+                        if (!initialLoad)
+                            scrollTo(targetLoc.hash, scrollPosition);
                     });
                 }
             }
@@ -78,7 +87,7 @@ export function createRouter(loadPageModule, fallbackComponent) {
                 try {
                     const res = await fetch(siteDataRef.value.base + 'hashmap.json');
                     window.__VP_HASH_MAP__ = await res.json();
-                    await loadPage(href, scrollPosition, true);
+                    await loadPage(href, { scrollPosition, isRetry: true, initialLoad });
                     return;
                 }
                 catch (e) { }
@@ -134,17 +143,14 @@ export function createRouter(loadPageModule, fallbackComponent) {
             // only intercept inbound html links
             if (origin === currentLoc.origin && treatAsHtml(pathname)) {
                 e.preventDefault();
-                router.go(href, {
-                    // use smooth scroll when clicking on header anchor links
-                    smoothScroll: link.classList.contains('header-anchor')
-                });
+                router.go(href);
             }
         }, { capture: true });
         window.addEventListener('popstate', async (e) => {
             if (e.state === null)
                 return;
             const href = normalizeHref(location.href);
-            await loadPage(href, (e.state && e.state.scrollPosition) || 0);
+            await loadPage(href, { scrollPosition: e.state.scrollPosition || 0 });
             syncRouteQueryAndHash();
             await router.onAfterRouteChange?.(href);
         });
@@ -165,7 +171,7 @@ export function useRouter() {
 export function useRoute() {
     return useRouter().route;
 }
-export function scrollTo(hash, smooth = false, scrollPosition = 0) {
+export function scrollTo(hash, scrollPosition = 0) {
     if (!hash || scrollPosition) {
         window.scrollTo(0, scrollPosition);
         return;
@@ -179,18 +185,8 @@ export function scrollTo(hash, smooth = false, scrollPosition = 0) {
     }
     if (!target)
         return;
-    const targetTop = window.scrollY +
-        target.getBoundingClientRect().top -
-        getScrollOffset() +
-        Number.parseInt(window.getComputedStyle(target).paddingTop, 10) || 0;
-    const behavior = window.matchMedia('(prefers-reduced-motion)').matches
-        ? 'instant'
-        : // only smooth scroll if distance is smaller than screen height
-            smooth && Math.abs(targetTop - window.scrollY) <= window.innerHeight
-                ? 'smooth'
-                : 'auto';
     const scrollToTarget = () => {
-        window.scrollTo({ left: 0, top: targetTop, behavior });
+        target.scrollIntoView({ block: 'start' });
         // focus the target element for better accessibility
         target.focus({ preventScroll: true });
         // return if focus worked
@@ -242,15 +238,16 @@ function normalizeHref(href) {
     else if (!url.pathname.endsWith('/') && !url.pathname.endsWith('.html')) {
         url.pathname += '.html';
     }
-    return url.pathname + url.search + url.hash;
+    return url.pathname + url.search + url.hash.split(':~:')[0];
 }
-async function changeRoute(href, { smoothScroll = false, initialLoad = false, replace = false } = {}) {
+async function changeRoute(href, { initialLoad = false, replace = false, hasTextFragment = false } = {}) {
     const loc = normalizeHref(location.href);
     const nextUrl = new URL(href, location.origin);
     const currentUrl = new URL(loc, location.origin);
     if (href === loc) {
         if (!initialLoad) {
-            scrollTo(nextUrl.hash, smoothScroll);
+            if (!hasTextFragment)
+                scrollTo(nextUrl.hash);
             return false;
         }
     }
@@ -270,7 +267,8 @@ async function changeRoute(href, { smoothScroll = false, initialLoad = false, re
                     oldURL: currentUrl.href,
                     newURL: nextUrl.href
                 }));
-                scrollTo(nextUrl.hash, smoothScroll);
+                if (!hasTextFragment)
+                    scrollTo(nextUrl.hash);
             }
             return false;
         }

package/dist/client/app/utils.js

@@ -84,37 +84,3 @@ export function defineClientComponent(loader, args, cb) {
         }
     };
 }
-export function getScrollOffset() {
-    let scrollOffset = siteDataRef.value.scrollOffset;
-    let offset = 0;
-    let padding = 24;
-    if (typeof scrollOffset === 'object' && 'padding' in scrollOffset) {
-        padding = scrollOffset.padding;
-        scrollOffset = scrollOffset.selector;
-    }
-    if (typeof scrollOffset === 'number') {
-        offset = scrollOffset;
-    }
-    else if (typeof scrollOffset === 'string') {
-        offset = tryOffsetSelector(scrollOffset, padding);
-    }
-    else if (Array.isArray(scrollOffset)) {
-        for (const selector of scrollOffset) {
-            const res = tryOffsetSelector(selector, padding);
-            if (res) {
-                offset = res;
-                break;
-            }
-        }
-    }
-    return offset;
-}
-function tryOffsetSelector(selector, padding) {
-    const el = document.querySelector(selector);
-    if (!el)
-        return 0;
-    const bot = el.getBoundingClientRect().bottom;
-    if (bot < 0)
-        return 0;
-    return bot + padding;
-}

package/dist/client/index.d.ts

@@ -1,7 +1,159 @@
 import * as vue from 'vue';
-import { Component, Ref, InjectionKey, App, AsyncComponentLoader } from 'vue';
-import { PageData, Awaitable, SiteData } from '../../types/shared.js';
-export { HeadConfig, Header, PageData, SiteData } from '../../types/shared.js';
+import { Ref, Component, App, InjectionKey, AsyncComponentLoader } from 'vue';
+import { UseDarkOptions } from '@vueuse/core';
+
+// types shared between server and client
+
+
+type Awaitable<T> = T | PromiseLike<T>
+
+type DeepPartial<T> =
+  T extends Record<string, any>
+    ? T extends
+        | Date
+        | RegExp
+        | Function
+        | ReadonlyMap<any, any>
+        | ReadonlySet<any>
+        | ReadonlyArray<any>
+      ? T
+      : { [P in keyof T]?: DeepPartial<T[P]> }
+    : T
+
+interface PageData {
+  relativePath: string
+  /**
+   * differs from relativePath in case of path rewrites
+   * empty string if the page is virtual (e.g. 404 page)
+   */
+  filePath: string
+  title: string
+  titleTemplate?: string | boolean
+  description: string
+  headers: Header[]
+  frontmatter: Record<string, any>
+  params?: Record<string, any>
+  isNotFound?: boolean
+  lastUpdated?: number
+}
+
+interface Header {
+  /**
+   * The level of the header
+   *
+   * `1` to `6` for `<h1>` to `<h6>`
+   */
+  level: number
+  /**
+   * The title of the header
+   */
+  title: string
+  /**
+   * The slug of the header
+   *
+   * Typically the `id` attr of the header anchor
+   */
+  slug: string
+  /**
+   * Link of the header
+   *
+   * Typically using `#${slug}` as the anchor hash
+   */
+  link: string
+  /**
+   * The children of the header
+   */
+  children: Header[]
+}
+
+interface SiteData<ThemeConfig = any> {
+  base: string
+  cleanUrls?: boolean
+  lang: string
+  dir: string
+  title: string
+  titleTemplate?: string | boolean
+  description: string
+  head: HeadConfig[]
+  appearance:
+    | boolean
+    | 'dark'
+    | 'force-dark'
+    | 'force-auto'
+    | (Omit<UseDarkOptions, 'initialValue'> & { initialValue?: 'dark' })
+  themeConfig: ThemeConfig
+  locales: LocaleConfig<ThemeConfig>
+  localeIndex?: string
+  contentProps?: Record<string, any>
+  router: {
+    prefetchLinks: boolean
+  }
+  additionalConfig?:
+    AdditionalConfigDict<ThemeConfig> | AdditionalConfigLoader<ThemeConfig>
+}
+
+interface VitePressData<T = any> {
+  /**
+   * Site-level metadata
+   */
+  site: Ref<SiteData<T>>
+  /**
+   * themeConfig from .vitepress/config.js
+   */
+  theme: Ref<T>
+  /**
+   * Page-level metadata
+   */
+  page: Ref<PageData>
+  /**
+   * page frontmatter data
+   */
+  frontmatter: Ref<PageData['frontmatter']>
+  /**
+   * dynamic route params
+   */
+  params: Ref<PageData['params']>
+  title: Ref<string>
+  description: Ref<string>
+  lang: Ref<string>
+  dir: Ref<string>
+  localeIndex: Ref<string>
+  isDark: Ref<boolean>
+  /**
+   * Current location hash
+   */
+  hash: Ref<string>
+}
+
+type HeadConfig =
+  [string, Record<string, string>] | [string, Record<string, string>, string]
+
+interface LocaleSpecificConfig<ThemeConfig = any> {
+  lang?: string
+  dir?: string
+  title?: string
+  titleTemplate?: string | boolean
+  description?: string
+  head?: HeadConfig[]
+  themeConfig?: DeepPartial<ThemeConfig>
+}
+
+type LocaleConfig<ThemeConfig = any> = Record<
+  string,
+  LocaleSpecificConfig<ThemeConfig> & { label: string; link?: string }
+>
+
+type AdditionalConfig<ThemeConfig = any> =
+  LocaleSpecificConfig<ThemeConfig>
+
+type AdditionalConfigDict<ThemeConfig = any> = Record<
+  string,
+  AdditionalConfig<ThemeConfig>
+>
+
+type AdditionalConfigLoader<ThemeConfig = any> = (
+  relativePath: string
+) => AdditionalConfig<ThemeConfig>[] | void
 
 declare const inBrowser: boolean;
 /**
@@ -26,7 +178,6 @@ interface Router {
      */
     go: (to: string, options?: {
         initialLoad?: boolean;
-        smoothScroll?: boolean;
         replace?: boolean;
     }) => Promise<void>;
     /**
@@ -50,41 +201,6 @@ interface Router {
 declare function useRouter(): Router;
 declare function useRoute(): Route;
 
-declare const dataSymbol: InjectionKey<VitePressData>;
-interface VitePressData<T = any> {
-    /**
-     * Site-level metadata
-     */
-    site: Ref<SiteData<T>>;
-    /**
-     * themeConfig from .vitepress/config.js
-     */
-    theme: Ref<T>;
-    /**
-     * Page-level metadata
-     */
-    page: Ref<PageData>;
-    /**
-     * page frontmatter data
-     */
-    frontmatter: Ref<PageData['frontmatter']>;
-    /**
-     * dynamic route params
-     */
-    params: Ref<PageData['params']>;
-    title: Ref<string>;
-    description: Ref<string>;
-    lang: Ref<string>;
-    dir: Ref<string>;
-    localeIndex: Ref<string>;
-    isDark: Ref<boolean>;
-    /**
-     * Current location hash
-     */
-    hash: Ref<string>;
-}
-declare function useData<T = any>(): VitePressData<T>;
-
 interface EnhanceAppContext {
     app: App;
     router: Router;
@@ -104,6 +220,10 @@ interface Theme {
     NotFound?: Component;
 }
 
+declare const dataSymbol: InjectionKey<VitePressData>;
+
+declare function useData<T = any>(): VitePressData<T>;
+
 /**
  * Append base to internal (non-relative) urls
  */
@@ -118,7 +238,6 @@ declare function defineClientComponent(loader: AsyncComponentLoader, args?: any[
         [key: string]: any;
     }> | null;
 };
-declare function getScrollOffset(): number;
 
 declare const Content: vue.DefineComponent<vue.ExtractPropTypes<{
     as: {
@@ -136,4 +255,4 @@ declare const Content: vue.DefineComponent<vue.ExtractPropTypes<{
     as: string | Record<string, any>;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 
-export { Content, type EnhanceAppContext, type Route, type Router, type Theme, type VitePressData, escapeHtml as _escapeHtml, dataSymbol, defineClientComponent, getScrollOffset, inBrowser, onContentUpdated, useData, useRoute, useRouter, withBase };
+export { Content, type EnhanceAppContext, type HeadConfig, type Header, type PageData, type Route, type Router, type SiteData, type Theme, type VitePressData, escapeHtml as _escapeHtml, dataSymbol, defineClientComponent, inBrowser, onContentUpdated, useData, useRoute, useRouter, withBase };

package/dist/client/index.js

@@ -4,6 +4,6 @@
 export { dataSymbol, useData } from './app/data';
 export { useRoute, useRouter } from './app/router';
 // utilities
-export { _escapeHtml, defineClientComponent, getScrollOffset, inBrowser, onContentUpdated, withBase } from './app/utils';
+export { _escapeHtml, defineClientComponent, inBrowser, onContentUpdated, withBase } from './app/utils';
 // components
 export { Content } from './app/components/Content';

package/dist/client/shared.js

@@ -2,9 +2,9 @@ export const EXTERNAL_URL_RE = /^(?:[a-z]+:|\/\/)/i;
 export const APPEARANCE_KEY = 'vitepress-theme-appearance';
 export const VP_SOURCE_KEY = '[VP_SOURCE]';
 const UnpackStackView = Symbol('stack-view:unpack');
-const HASH_RE = /#.*$/;
+const HASH_WITHOUT_FRAGMENT_RE = /#.*?(?=:~:|$)/;
 const HASH_OR_QUERY_RE = /[?#].*$/;
-const INDEX_OR_EXT_RE = /(?:(^|\/)index)?\.(?:md|html)$/;
+const INDEX_OR_EXT_RE = /(?:(^|\/)index)?(?:\.(?:md|html))?$/;
 export const inBrowser = typeof document !== 'undefined';
 export const notFoundPageData = {
     relativePath: '404.md',
@@ -27,7 +27,7 @@ export function isActive(currentPath, matchPath, asRegex = false) {
     if (normalize(matchPath) !== currentPath) {
         return false;
     }
-    const hashMatch = matchPath.match(HASH_RE);
+    const hashMatch = matchPath.match(HASH_WITHOUT_FRAGMENT_RE);
     if (hashMatch) {
         return (inBrowser ? location.hash : '') === hashMatch[0];
     }

package/dist/client/theme-default/Layout.vue

@@ -61,6 +61,7 @@ provide(layoutInfoInjectionKey, { heroImageSlotExists })
       <template #home-hero-info><slot name="home-hero-info" /></template>
       <template #home-hero-info-after><slot name="home-hero-info-after" /></template>
       <template #home-hero-actions-after><slot name="home-hero-actions-after" /></template>
+      <template #home-hero-actions-before-actions><slot name="home-hero-actions-before-actions" /></template>
       <template #home-hero-image><slot name="home-hero-image" /></template>
       <template #home-hero-after><slot name="home-hero-after" /></template>
       <template #home-features-before><slot name="home-features-before" /></template>

package/dist/client/theme-default/components/VPAlgoliaSearchBox.vue

@@ -1,12 +1,16 @@
 <script setup lang="ts">
 import type { DocSearchInstance, DocSearchProps } from '@docsearch/js'
-import type { SidepanelInstance, SidepanelProps } from '@docsearch/sidepanel-js'
+import type { SidepanelInstance } from '@docsearch/sidepanel-js'
 import { inBrowser, useRouter } from 'vitepress'
 import type { DefaultTheme } from 'vitepress/theme'
 import { nextTick, onUnmounted, watch } from 'vue'
 import type { DocSearchAskAi } from '../../../../types/docsearch'
 import { useData } from '../composables/data'
-import { resolveMode, validateCredentials } from '../support/docsearch'
+import {
+  buildSidePanelProps,
+  resolveMode,
+  validateCredentials
+} from '../support/docsearch'
 
 import '../styles/docsearch.css'
 
@@ -105,12 +109,7 @@ async function initialize(userOptions: DefaultTheme.AlgoliaSearchOptions) {
     if (currentInitialize !== initializeCount) return
 
     sidepanelInstance = sidepanel({
-      ...(askAi.sidePanel === true ? {} : askAi.sidePanel),
-      container: '#vp-docsearch-sidepanel',
-      indexName: askAi.indexName ?? userOptions.indexName,
-      appId: askAi.appId ?? userOptions.appId,
-      apiKey: askAi.apiKey ?? userOptions.apiKey,
-      assistantId: askAi.assistantId,
+      ...buildSidePanelProps(askAi, userOptions),
       onOpen: focusInput,
       onClose: onClose.bind(null, 'sidepanel'),
       onReady: () => {
@@ -122,7 +121,7 @@ async function initialize(userOptions: DefaultTheme.AlgoliaSearchOptions) {
       keyboardShortcuts: {
         'Ctrl/Cmd+I': false
       }
-    } as SidepanelProps)
+    })
   }
 
   const options = {

package/dist/client/theme-default/components/VPButton.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { computed } from 'vue'
-import { normalizeLink } from '../support/utils'
 import { EXTERNAL_URL_RE } from '../../shared'
+import { normalizeLink } from '../support/utils'
 
 interface Props {
   tag?: string

package/dist/client/theme-default/components/VPCarbonAds.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import type { DefaultTheme } from 'vitepress/theme'
-import { ref, watch, onMounted } from 'vue'
+import { onMounted, ref, watch } from 'vue'
 import { useAside } from '../composables/aside'
 import { useData } from '../composables/data'
 
@@ -19,9 +19,14 @@ let isInitialized = false
 function init() {
   if (!isInitialized) {
     isInitialized = true
+    const params = new URLSearchParams({
+      serve: carbonOptions.code,
+      placement: carbonOptions.placement,
+      format: carbonOptions?.format || 'classic',
+    })
     const s = document.createElement('script')
     s.id = '_carbonads_js'
-    s.src = `//cdn.carbonads.com/carbon.js?serve=${carbonOptions.code}&placement=${carbonOptions.placement}`
+    s.src = `//cdn.carbonads.com/carbon.js?${params.toString()}`
     s.async = true
     container.value.appendChild(s)
   }

package/dist/client/theme-default/components/VPContent.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { resolveDynamicComponent } from 'vue'
 import NotFound from '../NotFound.vue'
 import { useData } from '../composables/data'
 import { useLayout } from '../composables/layout'
@@ -8,6 +9,10 @@ import VPPage from './VPPage.vue'
 
 const { page, frontmatter } = useData()
 const { isHome, hasSidebar } = useLayout()
+
+function isRegistered(component: string): boolean {
+  return typeof resolveDynamicComponent(component) !== 'string'
+}
 </script>
 
 <template>
@@ -18,29 +23,25 @@ const { isHome, hasSidebar } = useLayout()
   >
     <slot name="not-found" v-if="page.isNotFound"><NotFound /></slot>
 
-    <VPPage v-else-if="frontmatter.layout === 'page'">
+    <VPPage v-else-if="frontmatter.layout === 'page' && !isRegistered('page')">
       <template #page-top><slot name="page-top" /></template>
       <template #page-bottom><slot name="page-bottom" /></template>
     </VPPage>
 
-    <VPHome v-else-if="frontmatter.layout === 'home'">
+    <VPHome v-else-if="frontmatter.layout === 'home' && !isRegistered('home')">
       <template #home-hero-before><slot name="home-hero-before" /></template>
       <template #home-hero-info-before><slot name="home-hero-info-before" /></template>
       <template #home-hero-info><slot name="home-hero-info" /></template>
       <template #home-hero-info-after><slot name="home-hero-info-after" /></template>
       <template #home-hero-actions-after><slot name="home-hero-actions-after" /></template>
+      <template #home-hero-actions-before-actions><slot name="home-hero-actions-before-actions" /></template>
       <template #home-hero-image><slot name="home-hero-image" /></template>
       <template #home-hero-after><slot name="home-hero-after" /></template>
       <template #home-features-before><slot name="home-features-before" /></template>
       <template #home-features-after><slot name="home-features-after" /></template>
     </VPHome>
 
-    <component
-      v-else-if="frontmatter.layout && frontmatter.layout !== 'doc'"
-      :is="frontmatter.layout"
-    />
-
-    <VPDoc v-else>
+    <VPDoc v-else-if="(!frontmatter.layout || frontmatter.layout === 'doc') && !isRegistered('doc')">
       <template #doc-top><slot name="doc-top" /></template>
       <template #doc-bottom><slot name="doc-bottom" /></template>
 
@@ -55,6 +56,8 @@ const { isHome, hasSidebar } = useLayout()
       <template #aside-ads-after><slot name="aside-ads-after" /></template>
       <template #aside-bottom><slot name="aside-bottom" /></template>
     </VPDoc>
+
+    <component v-else :is="frontmatter.layout || 'doc'" />
   </div>
 </template>
 

package/dist/client/theme-default/components/VPDocAside.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { useData } from '../composables/data'
-import VPDocAsideOutline from './VPDocAsideOutline.vue'
 import VPDocAsideCarbonAds from './VPDocAsideCarbonAds.vue'
+import VPDocAsideOutline from './VPDocAsideOutline.vue'
 
 const { theme } = useData()
 </script>

package/dist/client/theme-default/components/VPDocAsideCarbonAds.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import { defineAsyncComponent } from 'vue'
 import type { DefaultTheme } from 'vitepress/theme'
+import { defineAsyncComponent } from 'vue'
 
 defineProps<{
   carbonAds: DefaultTheme.CarbonAdsOptions

package/dist/client/theme-default/components/VPDocAsideOutline.vue

@@ -1,9 +1,9 @@
 <script setup lang="ts">
 import { ref } from 'vue'
 import { useData } from '../composables/data'
+import { useLayout } from '../composables/layout'
 import { resolveTitle, useActiveAnchor } from '../composables/outline'
 import VPDocOutlineItem from './VPDocOutlineItem.vue'
-import { useLayout } from '../composables/layout'
 
 const { theme } = useData()
 

package/dist/client/theme-default/components/VPDocAsideSponsors.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { Sponsors } from './VPSponsors.vue'
-import type { Sponsor } from './VPSponsorsGrid.vue'
 import VPSponsors from './VPSponsors.vue'
+import type { Sponsor } from './VPSponsorsGrid.vue'
 
 defineProps<{
   tier?: string