vitepress 1.6.3 → 2.0.0-alpha.2

package/dist/client/app/index.js

@@ -128,16 +128,13 @@ function newRouter() {
 if (inBrowser) {
     createApp().then(({ app, router, data }) => {
         // wait until page component is fetched before mounting
-        router.go().then(() => {
+        router.go(location.href, { initialLoad: true }).then(() => {
             // dynamically update head tags
             useUpdateHead(router.route, data.site);
             app.mount('#app');
             // scroll to hash on new tab during dev
             if (import.meta.env.DEV && location.hash) {
-                const target = document.getElementById(decodeURIComponent(location.hash).slice(1));
-                if (target) {
-                    scrollTo(target, location.hash);
-                }
+                scrollTo(location.hash);
             }
         });
     });

package/dist/client/app/router.js

@@ -8,6 +8,8 @@ export const RouterSymbol = Symbol();
 const fakeHost = 'http://a.com';
 const getDefaultRoute = () => ({
     path: '/',
+    hash: '',
+    query: '',
     component: null,
     data: notFoundPageData
 });
@@ -15,20 +17,16 @@ export function createRouter(loadPageModule, fallbackComponent) {
     const route = reactive(getDefaultRoute());
     const router = {
         route,
-        go
-    };
-    async function go(href = inBrowser ? location.href : '/') {
-        href = normalizeHref(href);
-        if ((await router.onBeforeRouteChange?.(href)) === false)
-            return;
-        if (inBrowser && href !== normalizeHref(location.href)) {
-            // save scroll position before changing url
-            history.replaceState({ scrollPosition: window.scrollY }, '');
-            history.pushState({}, '', href);
+        async go(href, options) {
+            href = normalizeHref(href);
+            if ((await router.onBeforeRouteChange?.(href)) === false)
+                return;
+            if (!inBrowser || (await changeRoute(href, options)))
+                await loadPage(href);
+            syncRouteQueryAndHash();
+            await router.onAfterRouteChange?.(href);
         }
-        await loadPage(href);
-        await (router.onAfterRouteChange ?? router.onAfterRouteChanged)?.(href);
-    }
+    };
     let latestPendingPath = null;
     async function loadPage(href, scrollPosition = 0, isRetry = false) {
         if ((await router.onBeforePageLoad?.(href)) === false)
@@ -37,21 +35,20 @@ export function createRouter(loadPageModule, fallbackComponent) {
         const pendingPath = (latestPendingPath = targetLoc.pathname);
         try {
             let page = await loadPageModule(pendingPath);
-            if (!page) {
+            if (!page)
                 throw new Error(`Page not found: ${pendingPath}`);
-            }
             if (latestPendingPath === pendingPath) {
                 latestPendingPath = null;
                 const { default: comp, __pageData } = page;
-                if (!comp) {
+                if (!comp)
                     throw new Error(`Invalid route component: ${comp}`);
-                }
                 await router.onAfterPageLoad?.(href);
                 route.path = inBrowser ? pendingPath : withBase(pendingPath);
                 route.component = markRaw(comp);
                 route.data = import.meta.env.PROD
                     ? markRaw(__pageData)
                     : readonly(__pageData);
+                syncRouteQueryAndHash(targetLoc);
                 if (inBrowser) {
                     nextTick(() => {
                         let actualPathname = siteDataRef.value.base +
@@ -64,20 +61,7 @@ export function createRouter(loadPageModule, fallbackComponent) {
                             href = actualPathname + targetLoc.search + targetLoc.hash;
                             history.replaceState({}, '', href);
                         }
-                        if (targetLoc.hash && !scrollPosition) {
-                            let target = null;
-                            try {
-                                target = document.getElementById(decodeURIComponent(targetLoc.hash).slice(1));
-                            }
-                            catch (e) {
-                                console.warn(e);
-                            }
-                            if (target) {
-                                scrollTo(target, targetLoc.hash);
-                                return;
-                            }
-                        }
-                        window.scrollTo(0, scrollPosition);
+                        return scrollTo(targetLoc.hash, false, scrollPosition);
                     });
                 }
             }
@@ -110,13 +94,19 @@ export function createRouter(loadPageModule, fallbackComponent) {
                         .replace(/^\//, '')
                     : '404.md';
                 route.data = { ...notFoundPageData, relativePath };
+                syncRouteQueryAndHash(targetLoc);
             }
         }
     }
+    function syncRouteQueryAndHash(loc = inBrowser
+        ? location
+        : { search: '', hash: '' }) {
+        route.query = loc.search;
+        route.hash = decodeURIComponent(loc.hash);
+    }
     if (inBrowser) {
-        if (history.state === null) {
+        if (history.state === null)
             history.replaceState({}, '');
-        }
         window.addEventListener('click', (e) => {
             if (e.defaultPrevented ||
                 !(e.target instanceof Element) ||
@@ -125,46 +115,29 @@ export function createRouter(loadPageModule, fallbackComponent) {
                 e.ctrlKey ||
                 e.shiftKey ||
                 e.altKey ||
-                e.metaKey)
+                e.metaKey) {
                 return;
+            }
             const link = e.target.closest('a');
             if (!link ||
                 link.closest('.vp-raw') ||
                 link.hasAttribute('download') ||
-                link.hasAttribute('target'))
+                link.hasAttribute('target')) {
                 return;
+            }
             const linkHref = link.getAttribute('href') ??
                 (link instanceof SVGAElement ? link.getAttribute('xlink:href') : null);
             if (linkHref == null)
                 return;
-            const { href, origin, pathname, hash, search } = new URL(linkHref, link.baseURI);
-            const currentUrl = new URL(location.href); // copy to keep old data
+            const { href, origin, pathname } = new URL(linkHref, link.baseURI);
+            const currentLoc = new URL(location.href); // copy to keep old data
             // only intercept inbound html links
-            if (origin === currentUrl.origin && treatAsHtml(pathname)) {
+            if (origin === currentLoc.origin && treatAsHtml(pathname)) {
                 e.preventDefault();
-                if (pathname === currentUrl.pathname &&
-                    search === currentUrl.search) {
-                    // scroll between hash anchors in the same page
-                    // avoid duplicate history entries when the hash is same
-                    if (hash !== currentUrl.hash) {
-                        history.pushState({}, '', href);
-                        // still emit the event so we can listen to it in themes
-                        window.dispatchEvent(new HashChangeEvent('hashchange', {
-                            oldURL: currentUrl.href,
-                            newURL: href
-                        }));
-                    }
-                    if (hash) {
-                        // use smooth scroll when clicking on header anchor links
-                        scrollTo(link, hash, link.classList.contains('header-anchor'));
-                    }
-                    else {
-                        window.scrollTo(0, 0);
-                    }
-                }
-                else {
-                    go(href);
-                }
+                router.go(href, {
+                    // use smooth scroll when clicking on header anchor links
+                    smoothScroll: link.classList.contains('header-anchor')
+                });
             }
         }, { capture: true });
         window.addEventListener('popstate', async (e) => {
@@ -172,10 +145,12 @@ export function createRouter(loadPageModule, fallbackComponent) {
                 return;
             const href = normalizeHref(location.href);
             await loadPage(href, (e.state && e.state.scrollPosition) || 0);
-            await (router.onAfterRouteChange ?? router.onAfterRouteChanged)?.(href);
+            syncRouteQueryAndHash();
+            await router.onAfterRouteChange?.(href);
         });
         window.addEventListener('hashchange', (e) => {
             e.preventDefault();
+            syncRouteQueryAndHash();
         });
     }
     handleHMR(route);
@@ -183,20 +158,21 @@ export function createRouter(loadPageModule, fallbackComponent) {
 }
 export function useRouter() {
     const router = inject(RouterSymbol);
-    if (!router) {
+    if (!router)
         throw new Error('useRouter() is called without provider.');
-    }
     return router;
 }
 export function useRoute() {
     return useRouter().route;
 }
-export function scrollTo(el, hash, smooth = false) {
+export function scrollTo(hash, smooth = false, scrollPosition = 0) {
+    if (!hash || scrollPosition) {
+        window.scrollTo(0, scrollPosition);
+        return;
+    }
     let target = null;
     try {
-        target = el.classList.contains('header-anchor')
-            ? el
-            : document.getElementById(decodeURIComponent(hash).slice(1));
+        target = document.getElementById(decodeURIComponent(hash).slice(1));
     }
     catch (e) {
         console.warn(e);
@@ -222,9 +198,8 @@ function handleHMR(route) {
     if (import.meta.hot) {
         // hot reload pageData
         import.meta.hot.on('vitepress:pageData', (payload) => {
-            if (shouldHotReload(payload)) {
+            if (shouldHotReload(payload))
                 route.data = payload.pageData;
-            }
         });
     }
 }
@@ -239,9 +214,39 @@ function normalizeHref(href) {
     const url = new URL(href, fakeHost);
     url.pathname = url.pathname.replace(/(^|\/)index(\.html)?$/, '$1');
     // ensure correct deep link so page refresh lands on correct files.
-    if (siteDataRef.value.cleanUrls)
+    if (siteDataRef.value.cleanUrls) {
         url.pathname = url.pathname.replace(/\.html$/, '');
-    else if (!url.pathname.endsWith('/') && !url.pathname.endsWith('.html'))
+    }
+    else if (!url.pathname.endsWith('/') && !url.pathname.endsWith('.html')) {
         url.pathname += '.html';
+    }
     return url.pathname + url.search + url.hash;
 }
+async function changeRoute(href, { smoothScroll = false, initialLoad = false } = {}) {
+    const loc = normalizeHref(location.href);
+    const { pathname, hash } = new URL(href, fakeHost);
+    const currentLoc = new URL(loc, fakeHost);
+    if (href === loc) {
+        if (!initialLoad) {
+            scrollTo(hash, smoothScroll);
+            return false;
+        }
+    }
+    else {
+        // save scroll position before changing URL
+        history.replaceState({ scrollPosition: window.scrollY }, '');
+        history.pushState({}, '', href);
+        if (pathname === currentLoc.pathname) {
+            // scroll between hash anchors on the same page, avoid duplicate entries
+            if (hash !== currentLoc.hash) {
+                window.dispatchEvent(new HashChangeEvent('hashchange', {
+                    oldURL: currentLoc.href,
+                    newURL: href
+                }));
+                scrollTo(hash, smoothScroll);
+            }
+            return false;
+        }
+    }
+    return true;
+}

package/dist/client/index.d.ts

@@ -11,6 +11,8 @@ declare function escapeHtml(str: string): string;
 
 interface Route {
     path: string;
+    hash: string;
+    query: string;
     data: PageData;
     component: Component | null;
 }
@@ -22,7 +24,10 @@ interface Router {
     /**
      * Navigate to a new URL.
      */
-    go: (to?: string) => Promise<void>;
+    go: (to: string, options?: {
+        initialLoad?: boolean;
+        smoothScroll?: boolean;
+    }) => Promise<void>;
     /**
      * Called before the route changes. Return `false` to cancel the navigation.
      */
@@ -40,10 +45,6 @@ interface Router {
      * Called after the route changes.
      */
     onAfterRouteChange?: (to: string) => Awaitable<void>;
-    /**
-     * @deprecated use `onAfterRouteChange` instead
-     */
-    onAfterRouteChanged?: (to: string) => Awaitable<void>;
 }
 declare function useRouter(): Router;
 declare function useRoute(): Route;

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

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import docsearch from '@docsearch/js'
-import { useRoute, useRouter } from 'vitepress'
+import { useRouter } from 'vitepress'
 import type { DefaultTheme } from 'vitepress/theme'
 import { nextTick, onMounted, watch } from 'vue'
 import { useData } from '../composables/data'
@@ -10,7 +10,6 @@ const props = defineProps<{
 }>()
 
 const router = useRouter()
-const route = useRoute()
 const { site, localeIndex, lang } = useData()
 
 type DocSearchProps = Parameters<typeof docsearch>[0]
@@ -51,17 +50,7 @@ function initialize(userOptions: DefaultTheme.AlgoliaSearchOptions) {
 
     navigator: {
       navigate({ itemUrl }) {
-        const { pathname: hitPathname } = new URL(
-          window.location.origin + itemUrl
-        )
-
-        // router doesn't handle same-page navigation so we use the native
-        // browser location API for anchor navigation
-        if (route.path === hitPathname) {
-          window.location.assign(window.location.origin + itemUrl)
-        } else {
-          router.go(itemUrl)
-        }
+        router.go(itemUrl)
       }
     },
 
@@ -71,17 +60,6 @@ function initialize(userOptions: DefaultTheme.AlgoliaSearchOptions) {
           url: getRelativePath(item.url)
         })
       })
-    },
-
-    hitComponent({ hit, children }) {
-      return {
-        __v: null,
-        type: 'a',
-        ref: undefined,
-        constructor: undefined,
-        key: undefined,
-        props: { href: hit.url, children }
-      }
     }
   }) as DocSearchProps