Merge branch 'main' into doc-zh

CHANGELOG.md

@@ -1,3 +1,20 @@
+# [1.0.0-rc.25](https://github.com/vuejs/vitepress/compare/v1.0.0-rc.24...v1.0.0-rc.25) (2023-11-05)
+
+### Bug Fixes
+
+- double-slash format url should be external link ([#3165](https://github.com/vuejs/vitepress/issues/3165)) ([7dbeac6](https://github.com/vuejs/vitepress/commit/7dbeac6df0dfc0da74dffc79998a85a3afa86874))
+- missing export types in localSearch ([#3157](https://github.com/vuejs/vitepress/issues/3157)) ([0761062](https://github.com/vuejs/vitepress/commit/0761062790b441eccd0d57d51903271f30e713af))
+- **theme:** table row background-color in custom containers ([#3179](https://github.com/vuejs/vitepress/issues/3179)) ([beecec1](https://github.com/vuejs/vitepress/commit/beecec16a8d62c18f46522d461db353c97199415))
+- **theme:** theme switch is not hidden on force-dark ([#3155](https://github.com/vuejs/vitepress/issues/3155)) ([2276c1d](https://github.com/vuejs/vitepress/commit/2276c1d4dac547bb09015fcd0df73825b32c5fad))
+
+### Features
+
+- export `mergeConfig()` ([#3143](https://github.com/vuejs/vitepress/issues/3143)) ([a850786](https://github.com/vuejs/vitepress/commit/a850786a566606fda20cc4ed71b79e975307b52a))
+
+### Performance Improvements
+
+- reduce duplicate rendering in localSearch ([#3170](https://github.com/vuejs/vitepress/issues/3170)) ([878f437](https://github.com/vuejs/vitepress/commit/878f4378cdee3c41f7643d9c7693bb607344d0c2))
+
 # [1.0.0-rc.24](https://github.com/vuejs/vitepress/compare/v1.0.0-rc.23...v1.0.0-rc.24) (2023-10-24)
 
 ### Bug Fixes

__tests__/e2e/markdown-extensions/markdown-extensions.test.ts

@@ -274,4 +274,9 @@ describe('Markdown File Inclusion', () => {
     expect(trim(await p.nth(0).textContent())).toBe('This is a region')
     expect(trim(await p.nth(1).textContent())).toBe('This is after region')
   })
+
+  test('ignore frontmatter if range is not specified', async () => {
+    const p = page.locator('.vp-doc')
+    expect(await p.textContent()).not.toContain('title')
+  })
 })

__tests__/e2e/markdown-extensions/nested-include.md

@@ -1,3 +1,7 @@
+---
+title: Nested Include
+---
+
 <!--@include: ./foo.md-->
 
 ### After Foo

docs/guide/deploy.md

@@ -285,3 +285,7 @@ Don't enable options like _Auto Minify_ for HTML code. It will remove comments f
 ### Edgio
 
 Refer [Creating and Deploying a VitePress App To Edgio](https://docs.edg.io/guides/vitepress).
+
+### Kinsta Static Site Hosting
+
+You can deploy your Vitepress website on [Kinsta](https://kinsta.com/static-site-hosting/) by following these [instructions](https://kinsta.com/docs/vitepress-static-site-example/).

docs/guide/extending-default-theme.md

@@ -101,9 +101,9 @@ import DefaultTheme from 'vitepress/theme'
 /** @type {import('vitepress').Theme} */
 export default {
   extends: DefaultTheme,
-  enhanceApp(ctx) {
+  enhanceApp({ app }) {
     // register your custom global components
-    ctx.app.component('MyGlobalComponent' /* ... */)
+    app.component('MyGlobalComponent' /* ... */)
   }
 }
 ```
@@ -118,7 +118,7 @@ export default {
   extends: DefaultTheme,
   async enhanceApp({ app }) {
     // register your custom global components
-    ctx.app.component('MyGlobalComponent' /* ... */)
+    app.component('MyGlobalComponent' /* ... */)
   }
 } satisfies Theme
 ```
@@ -135,7 +135,7 @@ import DefaultTheme from 'vitepress/theme'
 import MyLayout from './MyLayout.vue'
 
 export default {
-  ...DefaultTheme,
+  extends: DefaultTheme,
   // override the Layout with a wrapper component that
   // injects the slots
   Layout: MyLayout
@@ -168,7 +168,7 @@ import DefaultTheme from 'vitepress/theme'
 import MyComponent from './MyComponent.vue'
 
 export default {
-  ...DefaultTheme,
+  extends: DefaultTheme,
   Layout() {
     return h(DefaultTheme.Layout, null, {
       'aside-outline-before': () => h(MyComponent)

docs/guide/i18n.md

@@ -82,7 +82,7 @@ However, VitePress won't redirect `/` to `/en/` by default. You'll need to confi
 import DefaultTheme from 'vitepress/theme'
 
 export default {
-  ...DefaultTheme,
+  extends: DefaultTheme,
   setup() {
     const { lang } = useData()
     watchEffect(() => {

docs/guide/markdown.md

@@ -18,7 +18,7 @@ This allows you to link to the heading as `#my-anchor` instead of the default `#
 
 ## Links
 
-Both internal and external links gets special treatments.
+Both internal and external links get special treatment.
 
 ### Internal Links
 

docs/guide/ssr-compat.md

@@ -6,7 +6,7 @@ outline: deep
 
 VitePress pre-renders the app in Node.js during the production build, using Vue's Server-Side Rendering (SSR) capabilities. This means all custom code in theme components are subject to SSR Compatibility.
 
-The [SSR section in official Vue docs](https://vuejs.org/guide/scaling-up/ssr.html) provides more context on what is SSR, the relationship between SSR / SSG, and common notes on writing SSR-friendly code. The rule of thumb is to only access browser / DOM APIs in `beforeMount` or `mounted` hooks of Vue components.
+The [SSR section in official Vue docs](https://vuejs.org/guide/scaling-up/ssr.html) provides more context on what SSR is, the relationship between SSR / SSG, and common notes on writing SSR-friendly code. The rule of thumb is to only access browser / DOM APIs in `beforeMount` or `mounted` hooks of Vue components.
 
 ## `<ClientOnly>`
 

docs/reference/default-theme-search.md

@@ -96,7 +96,7 @@ export default defineConfig({
 })
 ```
 
-Learn more in [MiniSearch docs](https://lucaong.github.io/minisearch/classes/_minisearch_.minisearch.html).
+Learn more in [MiniSearch docs](https://lucaong.github.io/minisearch/classes/MiniSearch.MiniSearch.html).
 
 ### Custom content renderer
 

docs/reference/site-config.md

@@ -480,7 +480,7 @@ interface MarkdownOptions extends MarkdownIt.Options {
 
   // Add support for your own languages.
   // https://github.com/shikijs/shiki/blob/main/docs/languages.md#supporting-your-own-languages-with-shiki
-  languages?: Shiki.ILanguageRegistration
+  languages?: Shiki.ILanguageRegistration[]
 
   // markdown-it-anchor plugin options.
   // See: https://github.com/valeriangalliat/markdown-it-anchor#usage
@@ -491,7 +491,7 @@ interface MarkdownOptions extends MarkdownIt.Options {
   attrs?: {
     leftDelimiter?: string
     rightDelimiter?: string
-    allowedAttributes?: string[]
+    allowedAttributes?: Array<string | RegExp>
     disable?: boolean
   }
 
@@ -504,7 +504,7 @@ interface MarkdownOptions extends MarkdownIt.Options {
 
   // @mdit-vue/plugin-headers plugin options.
   // See: https://github.com/mdit-vue/mdit-vue/tree/main/packages/plugin-headers#options
-  headers?: HeadersPluginOptions
+  headers?: HeadersPluginOptions | boolean
 
   // @mdit-vue/plugin-sfc plugin options.
   // See: https://github.com/mdit-vue/mdit-vue/tree/main/packages/plugin-sfc#options
@@ -531,7 +531,7 @@ interface MarkdownOptions extends MarkdownIt.Options {
   // You need to install `markdown-it-mathjax3` and set `math` to `true` to enable it.
   // You can also pass options to `markdown-it-mathjax3` here.
   // See: https://github.com/tani/markdown-it-mathjax3#customization
-  math?: any
+  math?: boolean | any
 
   // Global custom container titles
   container?: {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vitepress",
-  "version": "1.0.0-rc.24",
+  "version": "1.0.0-rc.25",
   "description": "Vite & Vue powered static site generator",
   "type": "module",
   "packageManager": "pnpm@8.9.2",

src/client/theme-default/components/VPFooter.vue

@@ -28,6 +28,16 @@ const { hasSidebar } = useSidebar()
   display: none;
 }
 
+.VPFooter :deep(a) {
+  text-decoration-line: underline;
+  text-underline-offset: 2px;
+  transition: color 0.25s;
+}
+
+.VPFooter :deep(a:hover) {
+  color: var(--vp-c-text-1);
+}
+
 @media (min-width: 768px) {
   .VPFooter {
     padding: 32px;

src/client/theme-default/components/VPLocalSearchBox.vue

@@ -31,6 +31,7 @@ import {
 import type { ModalTranslations } from '../../../../types/local-search'
 import { pathToFile } from '../../app/utils'
 import { useData } from '../composables/data'
+import { LRUCache } from '../support/lru'
 import { createTranslate } from '../support/translation'
 
 const emit = defineEmits<{
@@ -142,9 +143,16 @@ const mark = computedAsync(async () => {
   return markRaw(new Mark(resultsEl.value))
 }, null)
 
+const cache = new LRUCache<string, Map<string, string>>(16) // 16 files
+
 debouncedWatch(
   () => [searchIndex.value, filterText.value, showDetailedList.value] as const,
   async ([index, filterTextValue, showDetailedListValue], old, onCleanup) => {
+
+    if (old?.[0] !== index) { // in case of hmr
+      cache.clear()
+    }
+
     let canceled = false
     onCleanup(() => {
       canceled = true
@@ -163,13 +171,12 @@ debouncedWatch(
       ? await Promise.all(results.value.map((r) => fetchExcerpt(r.id)))
       : []
     if (canceled) return
-    const c = new Map<string, Map<string, string>>()
     for (const { id, mod } of mods) {
       const mapId = id.slice(0, id.indexOf('#'))
-      let map = c.get(mapId)
+      let map = cache.get(mapId)
       if (map) continue
       map = new Map()
-      c.set(mapId, map)
+      cache.set(mapId, map)
       const comp = mod.default ?? mod
       if (comp?.render || comp?.setup) {
         const app = createApp(comp)
@@ -209,7 +216,7 @@ debouncedWatch(
 
     results.value = results.value.map((r) => {
       const [id, anchor] = r.id.split('#')
-      const map = c.get(id)
+      const map = cache.get(id)
       const text = map?.get(anchor) ?? ''
       for (const term in r.match) {
         terms.add(term)

src/client/theme-default/components/VPNavBarExtra.vue

@@ -28,7 +28,7 @@ const hasExtraContent = computed(
       </template>
     </div>
 
-    <div v-if="site.appearance" class="group">
+    <div v-if="site.appearance && site.appearance !== 'force-dark'" class="group">
       <div class="item appearance">
         <p class="label">
           {{ theme.darkModeSwitchLabel || 'Appearance' }}

src/client/theme-default/components/VPNavScreenAppearance.vue

@@ -6,7 +6,7 @@ const { site, theme } = useData()
 </script>
 
 <template>
-  <div v-if="site.appearance" class="VPNavScreenAppearance">
+  <div v-if="site.appearance && site.appearance !== 'force-dark'" class="VPNavScreenAppearance">
     <p class="text">
       {{ theme.darkModeSwitchLabel || 'Appearance' }}
     </p>

src/client/theme-default/components/VPNavScreenMenuGroup.vue

@@ -28,7 +28,7 @@ function toggle() {
       :aria-expanded="isOpen"
       @click="toggle"
     >
-      <span class="button-text">{{ text }}</span>
+      <span class="button-text" v-html="text"></span>
       <VPIconPlus class="button-icon" />
     </button>
 

src/client/theme-default/styles/components/vp-doc.css

@@ -164,6 +164,7 @@
 }
 
 .vp-doc tr {
+  background-color: var(--vp-c-bg);
   border-top: 1px solid var(--vp-c-divider);
   transition: background-color 0.5s;
 }

src/client/theme-default/support/lru.ts

@@ -0,0 +1,37 @@
+// adapted from https://stackoverflow.com/a/46432113/11613622
+
+export class LRUCache<K, V> {
+  private max: number
+  private cache: Map<K, V>
+
+  constructor(max: number = 10) {
+    this.max = max
+    this.cache = new Map<K, V>()
+  }
+
+  get(key: K): V | undefined {
+    let item = this.cache.get(key)
+    if (item !== undefined) {
+      // refresh key
+      this.cache.delete(key)
+      this.cache.set(key, item)
+    }
+    return item
+  }
+
+  set(key: K, val: V): void {
+    // refresh key
+    if (this.cache.has(key)) this.cache.delete(key)
+    // evict oldest
+    else if (this.cache.size === this.max) this.cache.delete(this.first()!)
+    this.cache.set(key, val)
+  }
+
+  first(): K | undefined {
+    return this.cache.keys().next().value
+  }
+
+  clear(): void {
+    this.cache.clear()
+  }
+}

src/node/config.ts

@@ -186,7 +186,7 @@ async function resolveConfigExtends(
   return resolved
 }
 
-function mergeConfig(a: UserConfig, b: UserConfig, isRoot = true) {
+export function mergeConfig(a: UserConfig, b: UserConfig, isRoot = true) {
   const merged: Record<string, any> = { ...a }
   for (const key in b) {
     const value = b[key as keyof UserConfig]

src/node/utils/processIncludes.ts

@@ -1,5 +1,6 @@
-import path from 'path'
 import fs from 'fs-extra'
+import matter from 'gray-matter'
+import path from 'path'
 import { slash } from '../shared'
 
 export function processIncludes(
@@ -30,6 +31,8 @@ export function processIncludes(
             endLine ? parseInt(endLine, 10) : undefined
           )
           .join('\n')
+      } else {
+        content = matter(content).content
       }
       includes.push(slash(includePath))
       // recursively process includes in the content

src/shared/shared.ts

@@ -14,7 +14,7 @@ export type {
   SiteData
 } from '../../types/shared'
 
-export const EXTERNAL_URL_RE = /^[a-z]+:/i
+export const EXTERNAL_URL_RE = /^(?:[a-z]+:|\/\/)/i
 export const APPEARANCE_KEY = 'vitepress-theme-appearance'
 export const HASH_RE = /#.*$/
 export const EXT_RE = /(index)?\.(md|html)$/

types/local-search.d.ts

@@ -3,12 +3,12 @@ export interface LocalSearchTranslations {
   modal?: ModalTranslations
 }
 
-interface ButtonTranslations {
+export interface ButtonTranslations {
   buttonText?: string
   buttonAriaLabel?: string
 }
 
-interface ModalTranslations {
+export interface ModalTranslations {
   displayDetails?: string
   resetButtonTitle?: string
   backButtonTitle?: string
@@ -16,7 +16,7 @@ interface ModalTranslations {
   footer?: FooterTranslations
 }
 
-interface FooterTranslations {
+export interface FooterTranslations {
   selectText?: string
   selectKeyAriaLabel?: string
   navigateText?: string