vitepress 2.0.0-alpha.20 → 2.0.0-alpha.21

package/README.md

@@ -31,10 +31,30 @@ Copyright (c) 2019-present, Yuxi (Evan) You
 
 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.   |
-| <a href="https://netlify.com" target="_blank"><img alt="Netlify's logo" src="https://github.com/netlify.png" width="80" /></a>                | **[Netlify](https://netlify.com)**           | A platform for building, deploying, and hosting modern web projects. Netlify powers our website deployments with their generous open source plan and provides deploy previews for the pull requests.   |
+<table>
+  <tr>
+    <td width="120" align="center"><a href="https://voidzero.dev" target="_blank"><img alt="VoidZero's logo" src="https://github.com/voidzero-dev.png" width="80" /></a></td>
+    <td><strong><a href="https://voidzero.dev">VoidZero</a></strong></td>
+    <td>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.</td>
+  </tr>
+  <tr>
+    <td width="120" align="center"><a href="https://stackblitz.com" target="_blank"><img alt="StackBlitz's logo" src="https://github.com/stackblitz.png" width="80" /></a></td>
+    <td><strong><a href="https://stackblitz.com">StackBlitz</a></strong></td>
+    <td>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.</td>
+  </tr>
+  <tr>
+    <td width="120" align="center"><a href="https://algolia.com" target="_blank"><img alt="Algolia's logo" src="https://github.com/algolia.png" width="80" /></a></td>
+    <td><strong><a href="https://algolia.com">Algolia</a></strong></td>
+    <td>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.</td>
+  </tr>
+  <tr>
+    <td width="120" align="center"><a href="https://browserstack.com" target="_blank"><img alt="BrowserStack's logo" src="https://github.com/browserstack.png" width="80" /></a></td>
+    <td><strong><a href="https://browserstack.com">BrowserStack</a></strong></td>
+    <td>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.</td>
+  </tr>
+  <tr>
+    <td width="120" align="center"><a href="https://netlify.com" target="_blank"><img alt="Netlify's logo" src="https://github.com/netlify.png" width="80" /></a></td>
+    <td><strong><a href="https://netlify.com">Netlify</a></strong></td>
+    <td>A platform for building, deploying, and hosting modern web projects. Netlify powers our website deployments with their generous open source plan and provides deploy previews for the pull requests.</td>
+  </tr>
+</table>

package/THIRD-PARTY-NOTICES.md

@@ -6,7 +6,7 @@ VitePress is published under the MIT license (see LICENSE). The published vitepr
 
 License: MIT
 By: Anthony Fu <anthonyfu117@hotmail.com>
-Repository: https://github.com/antfu/install-pkg
+Repository: https://github.com/antfu-collective/install-pkg
 
 > MIT License
 >
@@ -691,7 +691,7 @@ Repository: https://github.com/jonschlinkert/gray-matter
 
 License: MIT
 By: netroy <aditya@netroy.in> (http://netroy.in/)
-Repository: https://github.com/image-size/image-size
+Repository: https://codeberg.org/image-size/image-size
 
 > The MIT License (MIT)
 >

package/dist/client/app/components/ClientOnly.d.ts

@@ -1,6 +1,5 @@
 //#region src/client/app/components/ClientOnly.d.ts
-declare const ClientOnly: import("vue").DefineComponent<{}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+export declare const ClientOnly: import("vue").DefineComponent<{}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
   [key: string]: any;
 }>[] | null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-//#endregion
-export { ClientOnly };
+//#endregion

package/dist/client/app/components/Content.d.ts

@@ -1,5 +1,5 @@
 //#region src/client/app/components/Content.d.ts
-declare const Content: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+export declare const Content: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
   as: {
     type: (ObjectConstructor | StringConstructor)[];
     default: string;
@@ -14,5 +14,4 @@ declare const Content: import("vue").DefineComponent<import("vue").ExtractPropTy
 }>> & Readonly<{}>, {
   as: string | Record<string, any>;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-//#endregion
-export { Content };
+//#endregion

package/dist/client/app/composables/codeGroups.d.ts

@@ -1,4 +1,3 @@
 //#region src/client/app/composables/codeGroups.d.ts
-declare function useCodeGroups(): void;
-//#endregion
-export { useCodeGroups };
+export declare function useCodeGroups(): void;
+//#endregion

package/dist/client/app/composables/copyCode.d.ts

@@ -1,4 +1,3 @@
 //#region src/client/app/composables/copyCode.d.ts
-declare function useCopyCode(): void;
-//#endregion
-export { useCopyCode };
+export declare function useCopyCode(): void;
+//#endregion

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

@@ -41,7 +41,7 @@ async function copyToClipboard(text) {
 		element.setAttribute("readonly", "");
 		element.style.contain = "strict";
 		element.style.position = "absolute";
-		element.style.left = "-9999px";
+		element.style.insetInlineStart = "-9999px";
 		element.style.fontSize = "12pt";
 		const selection = document.getSelection();
 		const originalRange = selection ? selection.rangeCount > 0 && selection.getRangeAt(0) : null;

package/dist/client/app/composables/head.d.ts

@@ -1,6 +1,5 @@
 import { Route, SiteData } from "../../shared.js";
 import { Ref } from "vue";
 //#region src/client/app/composables/head.d.ts
-declare function useUpdateHead(route: Route, siteDataByRouteRef: Ref<SiteData>): void;
-//#endregion
-export { useUpdateHead };
+export declare function useUpdateHead(route: Route, siteDataByRouteRef: Ref<SiteData>): void;
+//#endregion

package/dist/client/app/composables/icon.d.ts

@@ -6,8 +6,7 @@ import { ComputedRef, MaybeRefOrGetter } from "vue";
  * the build emits its CSS rule; in dev the SVG is served on demand and
  * applied to `el` inline.
  */
-declare function useIcon(icon: MaybeRefOrGetter<string | {
+export declare function useIcon(icon: MaybeRefOrGetter<string | {
   svg: string;
 } | undefined>, el?: MaybeRefOrGetter<HTMLElement | null>): ComputedRef<string | undefined>;
-//#endregion
-export { useIcon };
+//#endregion

package/dist/client/app/composables/preFetch.d.ts

@@ -1,4 +1,3 @@
 //#region src/client/app/composables/preFetch.d.ts
-declare function usePrefetch(): void;
-//#endregion
-export { usePrefetch };
+export declare function usePrefetch(): void;
+//#endregion

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

@@ -1,65 +1,66 @@
 import { EXTERNAL_URL_RE, inBrowser } from "../../shared.js";
 import { pathToFile } from "../utils.js";
-import { useRoute } from "../router.js";
-import { onMounted, onUnmounted, watch } from "vue";
+import { getRoutableLinkUrl, useRoute } from "../router.js";
+import { computed, onMounted, onUnmounted, watch } from "vue";
+import { useNetwork } from "@vueuse/core";
 //#region src/client/app/composables/preFetch.ts
 const hasFetched = /* @__PURE__ */ new Set();
 const createLink = () => document.createElement("link");
-const viaDOM = (url) => {
+const viaDOM = (url, onError) => {
 	const link = createLink();
 	link.rel = `prefetch`;
 	if (EXTERNAL_URL_RE.test(url)) link.crossOrigin = "";
 	link.href = url;
+	link.onerror = () => {
+		link.remove();
+		onError();
+	};
 	document.head.appendChild(link);
 };
-const viaXHR = (url) => {
+const viaXHR = (url, onError) => {
 	const req = new XMLHttpRequest();
 	req.open("GET", url, true);
 	req.withCredentials = !EXTERNAL_URL_RE.test(url);
+	req.onerror = onError;
 	req.send();
 };
-let link;
-const doFetch = inBrowser && (link = createLink()) && link.relList && link.relList.supports && link.relList.supports("prefetch") ? viaDOM : viaXHR;
 function usePrefetch() {
 	if (!inBrowser) return;
-	if (!window.IntersectionObserver) return;
-	let conn;
-	if ((conn = navigator.connection) && (conn.saveData || /2g/.test(conn.effectiveType))) return;
+	const { isOnline, saveData, effectiveType } = useNetwork();
+	const isWeak = computed(() => !isOnline.value || saveData.value || !!effectiveType.value?.includes("2g"));
+	const prefetch = createLink().relList.supports("prefetch") ? viaDOM : viaXHR;
 	const rIC = window.requestIdleCallback || setTimeout;
 	let observer = null;
 	const observeLinks = () => {
 		if (observer) observer.disconnect();
 		observer = new IntersectionObserver((entries) => {
 			entries.forEach((entry) => {
-				if (entry.isIntersecting) {
-					const link = entry.target;
-					observer.unobserve(link);
-					const { pathname } = link;
-					if (!hasFetched.has(pathname)) {
-						hasFetched.add(pathname);
-						const pageChunkPath = pathToFile(pathname);
-						if (pageChunkPath) doFetch(pageChunkPath);
-					}
-				}
+				if (!entry.isIntersecting || isWeak.value) return;
+				const link = entry.target;
+				observer.unobserve(link);
+				const url = getRoutableLinkUrl(link);
+				const pageChunkPath = url && pathToFile(url.pathname);
+				if (!pageChunkPath || hasFetched.has(pageChunkPath)) return;
+				hasFetched.add(pageChunkPath);
+				prefetch(pageChunkPath, () => hasFetched.delete(pageChunkPath));
 			});
 		});
 		rIC(() => {
 			document.querySelectorAll("#app a").forEach((link) => {
-				const { hostname, pathname } = new URL(link.href instanceof SVGAnimatedString ? link.href.animVal : link.href, link.baseURI);
-				const extMatch = pathname.match(/\.\w+$/);
-				if (extMatch && extMatch[0] !== ".html") return;
-				if (link.target !== "_blank" && hostname === location.hostname) {
-					if (pathname !== location.pathname) observer.observe(link);
-					else hasFetched.add(pathname);
-				}
+				const url = getRoutableLinkUrl(link);
+				if (url && url.pathname !== location.pathname) observer.observe(link);
 			});
 		});
 	};
 	onMounted(observeLinks);
 	const route = useRoute();
-	watch(() => route.path, observeLinks);
+	watch(() => route.path, () => {
+		const pageChunkPath = pathToFile(location.pathname);
+		if (pageChunkPath) hasFetched.add(pageChunkPath);
+		observeLinks();
+	});
 	onUnmounted(() => {
-		observer && observer.disconnect();
+		observer?.disconnect();
 	});
 }
 //#endregion

package/dist/client/app/data.d.ts

@@ -1,9 +1,9 @@
 import { Route, SiteData, VitePressData } from "../shared.js";
 import { InjectionKey, Ref } from "vue";
 //#region src/client/app/data.d.ts
-declare const dataSymbol: InjectionKey<VitePressData>;
-declare const siteDataRef: Ref<SiteData>;
-declare function initData(route: Route): VitePressData;
-declare function useData<T = any>(): VitePressData<T>;
+export declare const dataSymbol: InjectionKey<VitePressData>;
+export declare const siteDataRef: Ref<SiteData>;
+export declare function initData(route: Route): VitePressData;
+export declare function useData<T = any>(): VitePressData<T>;
 //#endregion
-export { type VitePressData, dataSymbol, initData, siteDataRef, useData };
+export type { VitePressData };

package/dist/client/app/devtools.d.ts

@@ -3,6 +3,5 @@ import "./data.js";
 import { Router } from "./router.js";
 import { App } from "vue";
 //#region src/client/app/devtools.d.ts
-declare const setupDevtools: (app: App, router: Router, data: VitePressData) => void;
-//#endregion
-export { setupDevtools };
+export declare const setupDevtools: (app: App, router: Router, data: VitePressData) => void;
+//#endregion

package/dist/client/app/index.d.ts

@@ -3,10 +3,9 @@ import "./data.js";
 import { Router } from "./router.js";
 import { App } from "vue";
 //#region src/client/app/index.d.ts
-declare function createApp(): Promise<{
+export declare function createApp(): Promise<{
   app: App<any>;
   router: Router;
   data: VitePressData<any>;
 }>;
-//#endregion
-export { createApp };
+//#endregion

package/dist/client/app/index.js

@@ -8,7 +8,7 @@ import { useCodeGroups } from "./composables/codeGroups.js";
 import { useCopyCode } from "./composables/copyCode.js";
 import { useUpdateHead } from "./composables/head.js";
 import { usePrefetch } from "./composables/preFetch.js";
-import { createApp as createApp$1, createSSRApp, defineComponent, h, onMounted, watchEffect } from "vue";
+import { createApp as createApp$1, createSSRApp, defineComponent, h, watchEffect } from "vue";
 import RawTheme from "@theme/index";
 //#region src/client/app/index.ts
 function resolveThemeExtends(theme) {
@@ -34,11 +34,9 @@ const VitePressApp = defineComponent({
 	name: "VitePressApp",
 	setup() {
 		const { site, lang, dir } = useData();
-		onMounted(() => {
-			watchEffect(() => {
-				document.documentElement.lang = lang.value;
-				document.documentElement.dir = dir.value;
-			});
+		if (inBrowser) watchEffect(() => {
+			document.documentElement.lang = lang.value;
+			document.documentElement.dir = dir.value;
 		});
 		if (import.meta.env.PROD && site.value.router.prefetchLinks) usePrefetch();
 		useCopyCode();

package/dist/client/app/router.d.ts

@@ -1,7 +1,7 @@
 import { Awaitable, PageData, Route } from "../shared.js";
 import { Component, InjectionKey } from "vue";
 //#region src/client/app/router.d.ts
-interface Router {
+export interface Router {
   /**
    * Current route.
    */
@@ -31,14 +31,19 @@ interface Router {
    */
   onAfterRouteChange?: (to: string) => Awaitable<void>;
 }
-declare const RouterSymbol: InjectionKey<Router>;
+export declare const RouterSymbol: InjectionKey<Router>;
 interface PageModule {
   __pageData: PageData;
   default: Component;
 }
-declare function createRouter(loadPageModule: (path: string) => Awaitable<PageModule | null>, fallbackComponent?: Component): Router;
-declare function useRouter(): Router;
-declare function useRoute(): Route;
-declare function scrollTo(hash: string, scrollPosition?: number): void;
-//#endregion
-export { Router, RouterSymbol, createRouter, scrollTo, useRoute, useRouter };
+export declare function createRouter(loadPageModule: (path: string) => Awaitable<PageModule | null>, fallbackComponent?: Component): Router;
+export declare function useRouter(): Router;
+export declare function useRoute(): Route;
+export declare function scrollTo(hash: string, scrollPosition?: number): void;
+/**
+ * Resolves the URL of a link the router handles on the client side, or `null`
+ * if it's left to the browser (explicit `target`, `download`, `.vp-raw`,
+ * other origins, non-html files).
+ */
+export declare function getRoutableLinkUrl(link: HTMLAnchorElement | SVGAElement): URL | null;
+//#endregion

package/dist/client/app/router.js

@@ -95,13 +95,10 @@ function createRouter(loadPageModule, fallbackComponent) {
 		window.addEventListener("click", (e) => {
 			if (e.defaultPrevented || !(e.target instanceof Element) || e.target.closest("button") || e.button !== 0 || e.ctrlKey || e.shiftKey || e.altKey || e.metaKey) return;
 			const link = e.target.closest("a");
-			if (!link || link.closest(".vp-raw") || link.hasAttribute("download") || 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 } = new URL(linkHref, link.baseURI);
-			if (origin === new URL(location.href).origin && treatAsHtml(pathname)) {
+			const url = link && getRoutableLinkUrl(link);
+			if (url) {
 				e.preventDefault();
-				router.go(href);
+				router.go(url.href);
 			}
 		}, { capture: true });
 		window.addEventListener("popstate", async (e) => {
@@ -155,6 +152,18 @@ function scrollTo(hash, scrollPosition = 0) {
 	};
 	requestAnimationFrame(scrollToTarget);
 }
+/**
+* Resolves the URL of a link the router handles on the client side, or `null`
+* if it's left to the browser (explicit `target`, `download`, `.vp-raw`,
+* other origins, non-html files).
+*/
+function getRoutableLinkUrl(link) {
+	if (link.closest(".vp-raw") || link.hasAttribute("download") || link.hasAttribute("target")) return null;
+	const href = link.getAttribute("href") ?? (link instanceof SVGAElement ? link.getAttribute("xlink:href") : null);
+	if (href == null) return null;
+	const url = new URL(href, link.baseURI);
+	return url.origin === location.origin && treatAsHtml(url.pathname) ? url : null;
+}
 function handleHMR(route) {
 	if (import.meta.hot) import.meta.hot.on("vitepress:pageData", (payload) => {
 		if (shouldHotReload(payload)) route.data = payload.pageData;
@@ -199,4 +208,4 @@ async function changeRoute(href, { initialLoad = false, replace = false, hasText
 	return true;
 }
 //#endregion
-export { RouterSymbol, createRouter, scrollTo, useRoute, useRouter };
+export { RouterSymbol, createRouter, getRoutableLinkUrl, scrollTo, useRoute, useRouter };

package/dist/client/app/ssr.d.ts

@@ -1,5 +1,4 @@
 import { SSGContext } from "../shared.js";
 //#region src/client/app/ssr.d.ts
-declare function render(path: string): Promise<SSGContext>;
-//#endregion
-export { render };
+export declare function render(path: string): Promise<SSGContext>;
+//#endregion

package/dist/client/app/theme.d.ts

@@ -2,12 +2,12 @@ import { Awaitable, SiteData } from "../shared.js";
 import { Router } from "./router.js";
 import { App, Component, Ref } from "vue";
 //#region src/client/app/theme.d.ts
-interface EnhanceAppContext {
+export interface EnhanceAppContext {
   app: App;
   router: Router;
   siteData: Ref<SiteData>;
 }
-interface Theme {
+export interface Theme {
   Layout?: Component;
   enhanceApp?: (ctx: EnhanceAppContext) => Awaitable<void>;
   extends?: Theme;
@@ -21,5 +21,4 @@ interface Theme {
    */
   NotFound?: Component;
 }
-//#endregion
-export { EnhanceAppContext, Theme };
+//#endregion

package/dist/client/app/utils.d.ts

@@ -1,5 +1,5 @@
 import { Awaitable, escapeHtml, inBrowser, joinPath } from "../shared.js";
-import { AsyncComponentLoader } from "vue";
+import { AsyncComponentLoader, SetupContext } from "vue";
 //#region src/client/app/utils.d.ts
 /**
  * Runtime base path used by the app.
@@ -11,25 +11,25 @@ import { AsyncComponentLoader } from "vue";
  * - dev browser: uses `'/'` (dev server always mounts at root)
  * - prod browser: resolves from the page's `__VP_SITE_ROOT__`
  */
-declare function runtimeBase(): string;
+export declare function runtimeBase(): string;
 /**
  * Prepend base to internal (non-relative) urls
  */
-declare function withBase(path: string): string;
+export declare function withBase(path: string): string;
 /**
  * Converts a url path to the corresponding js chunk filename.
  */
-declare function pathToFile(path: string): string | null;
-declare let contentUpdatedCallbacks: (() => any)[];
+export declare function pathToFile(path: string): string | null;
+export declare let contentUpdatedCallbacks: (() => any)[];
 /**
  * Register callback that is called every time the markdown content is updated
  * in the DOM.
  */
-declare function onContentUpdated(fn: () => any): void;
-declare function defineClientComponent(loader: AsyncComponentLoader, args?: any[], cb?: () => Awaitable<void>): {
-  setup(): () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+export declare function onContentUpdated(fn: () => any): void;
+export declare function defineClientComponent(loader: AsyncComponentLoader, args?: any[], cb?: () => Awaitable<void>): {
+  setup(_: unknown, { slots }: SetupContext): () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
   }> | null;
 };
 //#endregion
-export { escapeHtml as _escapeHtml, contentUpdatedCallbacks, defineClientComponent, inBrowser, joinPath, onContentUpdated, pathToFile, runtimeBase, withBase };
+export { escapeHtml as _escapeHtml, inBrowser, joinPath };

package/dist/client/app/utils.js

@@ -1,6 +1,6 @@
-import { EXTERNAL_URL_RE, RELATIVE_BASE_SENTINEL, escapeHtml, inBrowser, isRelativeBase, joinPath, sanitizeFileName } from "../shared.js";
+import { EXTERNAL_URL_RE, RELATIVE_BASE_SENTINEL, escapeHtml, inBrowser, isRelativeBase, joinPath, pageChunkPath, sanitizeFileName } from "../shared.js";
 import { siteDataRef } from "./data.js";
-import { h, onMounted, shallowRef } from "vue";
+import { h, isVNode, onMounted, shallowRef } from "vue";
 import { tryOnUnmounted } from "@vueuse/core";
 //#region src/client/app/utils.ts
 let resolvedBase;
@@ -50,7 +50,7 @@ function pathToFile(path) {
 			pageHash = __VP_HASH_MAP__[pagePath.toLowerCase()];
 		}
 		if (!pageHash) return null;
-		pagePath = `${__ASSETS_BASE__ || base}${__ASSETS_DIR__}/${pagePath}.${pageHash}.js`;
+		pagePath = `${__ASSETS_BASE__ || base}${__ASSETS_DIR__}/${pageChunkPath(pagePath, pageHash)}`;
 	} else pagePath = `./${sanitizeFileName(pagePath.slice(1).replace(/\//g, "_"))}.md.js`;
 	return pagePath;
 }
@@ -66,7 +66,7 @@ function onContentUpdated(fn) {
 	});
 }
 function defineClientComponent(loader, args, cb) {
-	return { setup() {
+	return { setup(_, { slots }) {
 		const comp = shallowRef();
 		onMounted(async () => {
 			let res = await loader();
@@ -74,7 +74,12 @@ function defineClientComponent(loader, args, cb) {
 			comp.value = res;
 			await cb?.();
 		});
-		return () => comp.value ? h(comp.value, ...args ?? []) : null;
+		return () => {
+			if (!comp.value) return null;
+			const props = args?.[0];
+			if ((!args || args.length < 2) && (props == null || typeof props === "object" && !Array.isArray(props) && !isVNode(props))) return h(comp.value, props, slots);
+			return h(comp.value, ...args ?? []);
+		};
 	} };
 }
 //#endregion

package/dist/client/shared.d.ts

@@ -1,13 +1,13 @@
 import { AdditionalConfig, AdditionalConfigDict, AdditionalConfigLoader, Awaitable, CodeCopyButtonOptions, ContainerOptions, DefaultTheme, HeadConfig, HeadConfig as HeadConfig$1, Header, LocaleConfig, LocaleSpecificConfig, MarkdownEnv, MarkdownLocaleOptions, PageData, PageData as PageData$1, PageDataPayload, Route, SSGContext, SiteData, SiteData as SiteData$1, VitePressData } from "../../types/shared.js";
 //#region src/client/shared.d.ts
-declare const EXTERNAL_URL_RE: RegExp;
-declare const APPEARANCE_KEY = "vitepress-theme-appearance";
+export declare const EXTERNAL_URL_RE: RegExp;
+export declare const APPEARANCE_KEY = "vitepress-theme-appearance";
 /**
  * Parses a fully qualified `collection:name` icon name, corresponding to
  * the `vpi-<collection>-<name>` class. Returns null for anything else,
  * keeping malformed input out of generated selectors and class attributes.
  */
-declare function parseIconName(name: string): {
+export declare function parseIconName(name: string): {
   collection: string;
   icon: string;
 } | null;
@@ -15,53 +15,74 @@ declare function parseIconName(name: string): {
  * Placeholder prepended to SSR-emitted URLs when base is relative, later
  * replaced with each page's `../` prefix back to the site root.
  */
-declare const RELATIVE_BASE_SENTINEL = "/__VP_BASE__/";
-declare function isRelativeBase(base: string): boolean;
+export declare const RELATIVE_BASE_SENTINEL = "/__VP_BASE__/";
+export declare function isRelativeBase(base: string): boolean;
 /**
  * The ../-prefix that leads from `relativePath`'s directory back to the
  * site root ('./' for root-level pages).
  */
-declare function relativePathToRoot(relativePath: string): string;
+export declare function relativePathToRoot(relativePath: string): string;
 /**
  * Join two paths, collapsing slash collisions but keeping the `//` that
  * follows a protocol.
  */
-declare function joinPath(base: string, path: string): string;
-declare const VP_SOURCE_KEY = "[VP_SOURCE]";
-declare const inBrowser: boolean;
-declare const notFoundPageData: PageData$1;
-declare function isActive(currentPath: string, currentHash: string, matchPath: string, asRegex?: boolean, skipHashCheck?: boolean): boolean;
-declare function normalize(path: string): string;
-declare function isExternal(path: string): boolean;
-declare function getLocaleForPath(siteData: SiteData$1 | undefined, relativePath: string): string;
+export declare function joinPath(base: string, path: string): string;
+export declare const VP_SOURCE_KEY = "[VP_SOURCE]";
+export declare const inBrowser: boolean;
+export declare const notFoundPageData: PageData$1;
+export declare function isActive(currentPath: string, currentHash: string, matchPath: string, asRegex?: boolean, skipHashCheck?: boolean): boolean;
+export declare function normalize(path: string): string;
+export declare function isExternal(path: string): boolean;
+export declare function getLocaleForPath(siteData: SiteData$1 | undefined, relativePath: string): string;
 /**
  * Resolves the site data for a route, layering the matched locale and
  * additional configs over the root config.
  */
-declare function resolveSiteDataByRoute(siteData: SiteData$1, relativePath: string, filePath?: string): SiteData$1;
+export declare function resolveSiteDataByRoute(siteData: SiteData$1, relativePath: string, filePath?: string): SiteData$1;
 /**
  * Create the page title string based on config.
  */
-declare function createTitle(siteData: SiteData$1, pageData: PageData$1): string;
-declare function mergeHead(...headArrays: HeadConfig$1[][]): HeadConfig$1[];
-declare function sanitizeFileName(name: string): string;
-declare function slash(p: string): string;
-declare function treatAsHtml(filename: string): boolean;
-declare function escapeRegExp(str: string): string;
+export declare function createTitle(siteData: SiteData$1, pageData: PageData$1): string;
+export declare function mergeHead(...headArrays: HeadConfig$1[][]): HeadConfig$1[];
+export declare function sanitizeFileName(name: string): string;
+/**
+ * Output path of a page's client chunk relative to `assetsDir`, from its hash
+ * map entry. The entry is the chunk's hash, prefixed with the subdirectory the
+ * build put the chunk in when `assetsShards` is set (`<shard>/<hash>`), so the
+ * client never has to guess the layout.
+ */
+export declare function pageChunkPath(pageName: string, hashEntry: string, ext?: string): string;
+export declare function slash(p: string): string;
+export declare function treatAsHtml(filename: string): boolean;
+/**
+ * Default `tokenize` of the local search. It splits on spaces and punctuation
+ * like MiniSearch does, and additionally segments the runs of Chinese or
+ * Japanese characters inside those words, as they are not separated by spaces.
+ * Everything else is kept as MiniSearch would.
+ *
+ * It is used both when building the index and when searching in the browser.
+ * A browser without `Intl.Segmenter` (e.g. Firefox < 125) falls back to the
+ * plain split, which can't match multi-word queries against an index that was
+ * built with segmentation.
+ *
+ * @internal
+ */
+export declare function tokenizeSearchText(text: string): string[];
+export declare function escapeRegExp(str: string): string;
 /**
  * @internal
  */
-declare function escapeHtml(str: string): string;
+export declare function escapeHtml(str: string): string;
 /**
  * Creates a readonly proxy behaving like a deep merge of the given layers,
  * without mutating them. Earlier layers take precedence.
  */
-declare function stackView<T extends ObjectType>(..._layers: Partial<T>[]): T;
-declare namespace stackView {
+export declare function stackView<T extends ObjectType>(..._layers: Partial<T>[]): T;
+export declare namespace stackView {
   var unpack: <T>(obj: T) => T[] | undefined;
 }
 type ObjectType = Record<PropertyKey, any>;
-declare function isObject(value: unknown): value is ObjectType;
-declare function isShell(lang: string): boolean;
+export declare function isObject(value: unknown): value is ObjectType;
+export declare function isShell(lang: string): boolean;
 //#endregion
-export { APPEARANCE_KEY, type AdditionalConfig, type AdditionalConfigDict, type AdditionalConfigLoader, type Awaitable, type CodeCopyButtonOptions, type ContainerOptions, type DefaultTheme, EXTERNAL_URL_RE, type HeadConfig, type Header, type LocaleConfig, type LocaleSpecificConfig, type MarkdownEnv, type MarkdownLocaleOptions, type PageData, type PageDataPayload, RELATIVE_BASE_SENTINEL, type Route, type SSGContext, type SiteData, VP_SOURCE_KEY, type VitePressData, createTitle, escapeHtml, escapeRegExp, getLocaleForPath, inBrowser, isActive, isExternal, isObject, isRelativeBase, isShell, joinPath, mergeHead, normalize, notFoundPageData, parseIconName, relativePathToRoot, resolveSiteDataByRoute, sanitizeFileName, slash, stackView, treatAsHtml };
+export type { AdditionalConfig, AdditionalConfigDict, AdditionalConfigLoader, Awaitable, CodeCopyButtonOptions, ContainerOptions, DefaultTheme, HeadConfig, Header, LocaleConfig, LocaleSpecificConfig, MarkdownEnv, MarkdownLocaleOptions, PageData, PageDataPayload, Route, SSGContext, SiteData, VitePressData };