@vuepress-plume/plugin-search 1.0.0-rc.213 → 1.0.0-rc.215

package/dist/client/components/Search.vue

@@ -4,8 +4,10 @@ import { onKeyStroke } from '@vueuse/core'
 import {
   computed,
   defineAsyncComponent,
+  nextTick,
   ref,
   toRef,
+  useTemplateRef,
 } from 'vue'
 import { useLocale } from '../composables/index.js'
 import SearchButton from './SearchButton.vue'
@@ -19,19 +21,49 @@ const SearchBox = defineAsyncComponent(() => import('./SearchBox.vue'))
 
 const showSearch = ref(false)
 
+const searchButtonRef = useTemplateRef<{ focus: () => void }>('searchButton')
+
 const locale = useLocale(toRef(() => props.locales))
 
 /**
- * Text shown when JavaScript is disabled.
+ * Hand focus back to the trigger button.
+ *
+ * 把焦点归还给触发按钮。
  *
- * 禁用 JavaScript 时展示的提示文本。
+ * The search box unmounts its own focus trap, so without this the focused input
+ * disappears and focus falls back to `<body>`, forcing keyboard users to tab
+ * through the whole page again.
  *
- * `<noscript>` 仅在脚本被禁用时渲染，且必须是纯文本：启用脚本时浏览器会把
- * 其中的内容当作原始文本，若包含元素或 HTML 实体会造成水合不匹配。
- * `<noscript>` only renders with scripting disabled, and must stay plain text:
- * with scripting enabled browsers parse its content as raw text, so elements or
- * HTML entities would cause a hydration mismatch.
+ * 搜索框卸载时会一并销毁自身的焦点陷阱：若不显式归还，被聚焦的输入框随组件
+ * 消失后焦点会落到 `<body>`，键盘用户只能从页面第一个元素重新 Tab 一遍。
  */
+function restoreSearchFocus() {
+  // 等待卸载完成（焦点陷阱销毁）后再归还焦点，否则会被其收尾逻辑覆盖。
+  // Wait until the unmount finished (the focus trap is destroyed), otherwise the
+  // trap teardown would override the focus we just set.
+  nextTick(() => searchButtonRef.value?.focus())
+}
+
+function closeSearch(options?: { restoreFocus?: boolean }) {
+  showSearch.value = false
+
+  if (options?.restoreFocus === false) {
+    nextTick(() => {
+      const main = document.querySelector<HTMLElement>('main, [role="main"]')
+      if (!main) {
+        searchButtonRef.value?.focus()
+        return
+      }
+      if (!main.hasAttribute('tabindex'))
+        main.setAttribute('tabindex', '-1')
+      main.focus({ preventScroll: true })
+    })
+    return
+  }
+
+  restoreSearchFocus()
+}
+
 const noscriptText = computed(
   () => locale.value.noscriptText || 'Search is unavailable without JavaScript.',
 )
@@ -79,11 +111,11 @@ function isEditingContent(event: KeyboardEvent): boolean {
       v-if="showSearch"
       :locales="locales"
       :options="options"
-      @close="showSearch = false"
+      @close="closeSearch"
     />
 
     <div id="local-search">
-      <SearchButton :locales="locales" @click="showSearch = true" />
+      <SearchButton ref="searchButton" :locales="locales" :expanded="showSearch" @click="showSearch = true" />
     </div>
 
     <noscript>{{ noscriptText }}</noscript>
@@ -96,8 +128,6 @@ function isEditingContent(event: KeyboardEvent): boolean {
   align-items: center;
 }
 
-/* 仅在禁用 JavaScript 时可见的降级提示。
-   Fallback hint that is only visible when JavaScript is disabled. */
 .search-wrapper noscript {
   font-size: 13px;
   line-height: 1.4;

package/dist/client/components/SearchBox.vue

@@ -22,8 +22,10 @@ import {
   ref,
   shallowRef,
   toRef,
+  useId,
   watch,
 } from 'vue'
+import { isNavigationFailure, NavigationFailureType } from 'vue-router'
 import { usePageLang, useRouteLocale, useRouter, withBase } from 'vuepress/client'
 import { createTokenizer } from '../../shared/index.js'
 import { loadSearchIndexJSON, useLocale } from '../composables/index.js'
@@ -37,7 +39,11 @@ const { locales, options } = defineProps<{
 }>()
 
 const emit = defineEmits<{
-  (e: 'close'): void
+  // `restoreFocus: false` 表示关闭是因为页面已切换到搜索结果，焦点不应归还给触发按钮。
+  //
+  // `restoreFocus: false` means the box is closing because the page really moved to
+  // the result, so focus must not go back to the trigger button.
+  (e: 'close', options?: { restoreFocus?: boolean }): void
 }>()
 
 const routeLocale = useRouteLocale()
@@ -47,12 +53,21 @@ const lang = usePageLang()
 const el = shallowRef<HTMLElement>()
 const resultsEl = shallowRef<HTMLElement>()
 
+const uid = useId()
+const labelId = `${uid}-label`
+const inputId = `${uid}-input`
+const listId = `${uid}-list`
+
+function optionId(index: number) {
+  return `${uid}-option-${index}`
+}
+
 interface Result {
   title: string
   titles: string[]
 }
 
-const { activate } = useFocusTrap(el, { immediate: true })
+const { activate } = useFocusTrap(el, { immediate: true, returnFocusOnDeactivate: false })
 
 const isSearchIndexLoading = ref(false)
 const isSearching = ref(false)
@@ -129,8 +144,8 @@ const searchIndex = computedAsync(async (onCancel) => {
           prefix: true,
           boost: { title: 4, text: 2, titles: 1 },
           tokenize,
+          ...options.miniSearch?.searchOptions,
         },
-        ...options.miniSearch?.searchOptions,
         ...options.miniSearch?.options,
       }),
     )
@@ -160,6 +175,16 @@ watch(filterText, () => {
   enableNoResults.value = false
 })
 
+const searchStatusText = computed(() => {
+  if (searchIndexError.value)
+    return searchIndexError.value
+  if (!filterText.value || !enableNoResults.value)
+    return ''
+  if (!results.value.length)
+    return `${locale.value.noResultsText || 'No results for'} "${filterText.value}"`
+  return `${results.value.length} results`
+})
+
 const mark = computedAsync(async () => {
   if (!resultsEl.value)
     return
@@ -197,10 +222,10 @@ watchDebounced(
     if (canceled)
       return
 
-    await new Promise((r) => {
+    await new Promise((done) => {
       mark.value?.unmark({
         done: () => {
-          mark.value?.markRegExp(formMarkRegex(terms), { done: r })
+          mark.value?.markRegExp(formMarkRegex(terms), { done })
         },
       })
     })
@@ -236,6 +261,10 @@ function onSearchBarClick(event: PointerEvent) {
 const selectedIndex = ref(-1)
 const disableMouseOver = ref(false)
 
+const activeDescendantId = computed(() =>
+  results.value[selectedIndex.value] ? optionId(selectedIndex.value) : undefined,
+)
+
 watch(results, (r) => {
   selectedIndex.value = r.length ? 0 : -1
   scrollToSelectedResult()
@@ -264,6 +293,12 @@ function isMacCtrlShortcut(event: KeyboardEvent) {
 
 function selectPreviousResult(event: KeyboardEvent) {
   event.preventDefault()
+
+  if (!results.value.length) {
+    selectedIndex.value = -1
+    return
+  }
+
   selectedIndex.value--
   if (selectedIndex.value < 0)
     selectedIndex.value = results.value.length - 1
@@ -274,6 +309,12 @@ function selectPreviousResult(event: KeyboardEvent) {
 
 function selectNextResult(event: KeyboardEvent) {
   event.preventDefault()
+
+  if (!results.value.length) {
+    selectedIndex.value = -1
+    return
+  }
+
   selectedIndex.value++
   if (selectedIndex.value >= results.value.length)
     selectedIndex.value = 0
@@ -310,17 +351,33 @@ const router = useRouter()
 let closedByPopstate = false
 
 /**
- * Whether the search box is being closed because a result is being opened.
+ * Whether the URL leaves the current page because a result is being opened, so
+ * unmount must not roll back the temporary history entry pushed on mount.
  *
- * 搜索框是否因跳转到搜索结果而关闭。
- *
- * In that case the URL must stay on the target page, so history must not be
- * rolled back on unmount.
- *
- * 此时 URL 必须停留在目标页面，卸载时不能回退历史。
+ * 为 true 表示 URL 会离开当前页（搜索结果导航在途、已成功或被更新的导航接替），
+ * 卸载时不能回退挂载时压入的临时历史条目。
  */
 let navigatingToResult = false
 
+/**
+ * Open a search result: navigate to the target page, then close the box.
+ *
+ * 打开搜索结果：跳转到目标页面后再关闭搜索框。
+ */
+async function openResult(id: string) {
+  navigatingToResult = true
+  // 用 replace 顶替挂载时 pushState 的临时历史条目，避免从结果页返回时多一次 Back。
+  const navigation = router.replace(id)
+
+  const navigated = await navigation.then(
+    failure => failure === undefined || isNavigationFailure(failure, NavigationFailureType.cancelled),
+    () => false,
+  )
+
+  navigatingToResult = navigated
+  emit('close', { restoreFocus: !navigated })
+}
+
 onKeyStroke('Enter', (e) => {
   if (e.isComposing)
     return
@@ -334,14 +391,8 @@ onKeyStroke('Enter', (e) => {
     return
   }
 
-  if (selectedPackage) {
-    navigatingToResult = true
-    // 用 replace 顶替挂载时 pushState 的临时历史条目，避免从结果页返回时多一次 Back。
-    // Replace the temporary history entry pushed on mount, so returning from the
-    // result page does not require an extra Back press.
-    router.replace(selectedPackage.id)
-    emit('close')
-  }
+  if (selectedPackage)
+    openResult(selectedPackage.id)
 })
 
 onKeyStroke('Escape', () => {
@@ -364,6 +415,8 @@ useEventListener('popstate', (event) => {
 /** Lock body */
 const isLocked = useScrollLock(typeof document !== 'undefined' ? document.body : null)
 
+let appEl: Element | null = null
+
 onMounted(() => {
   nextTick(() => {
     isLocked.value = true
@@ -371,15 +424,19 @@ onMounted(() => {
   })
 })
 
+onMounted(() => {
+  appEl = document.querySelector('#app')
+  appEl?.setAttribute('inert', '')
+})
+
+onBeforeUnmount(() => {
+  appEl?.removeAttribute('inert')
+})
+
 onBeforeUnmount(() => {
   isLocked.value = false
   // 配对挂载时的 pushState，避免反复开关搜索框累积历史条目。
   // 若该条目已被浏览器后退键（popstate）消费，或正在跳转到搜索结果，则不能回退。
-  //
-  // Pair the pushState made on mount so repeated open/close does not pile up
-  // history entries. Skip the rollback when the entry was already consumed by
-  // the browser back button (popstate), or when opening a result (the URL must
-  // stay on the target page).
   if (!closedByPopstate && !navigatingToResult)
     window.history.back()
 })
@@ -404,12 +461,11 @@ function formMarkRegex(terms: Set<string>) {
 }
 
 function selectedClick(e: MouseEvent, p: SearchResult & Result) {
+  if (e.button !== 0 || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey)
+    return
+
   e.preventDefault()
-  navigatingToResult = true
-  // 同 Enter 键路径：replace 消费掉挂载时压入的临时历史条目。
-  // Same as the Enter path: replace consumes the temp entry pushed on mount.
-  router.replace(p.id)
-  emit('close')
+  openResult(p.id)
 }
 </script>
 
@@ -417,16 +473,23 @@ function selectedClick(e: MouseEvent, p: SearchResult & Result) {
   <Teleport to="body">
     <div
       ref="el"
-      role="button"
-      :aria-owns="results?.length ? 'localsearch-list' : undefined"
-      aria-expanded="true"
-      aria-haspopup="listbox"
-      aria-labelledby="localsearch-label"
+      role="dialog"
+      aria-modal="true"
+      :aria-label="buttonText"
       class="VPLocalSearchBox"
     >
+      <!-- eslint-disable-next-line vue-a11y/no-static-element-interactions, vue-a11y/click-events-have-key-events -->
       <div class="backdrop" @click="$emit('close')" />
 
       <div class="shell">
+        <div
+          class="sr-only"
+          role="status"
+          aria-live="polite"
+          aria-atomic="true"
+        >
+          {{ searchStatusText }}
+        </div>
         <form
           class="search-bar"
           @pointerup="onSearchBarClick($event)"
@@ -434,15 +497,18 @@ function selectedClick(e: MouseEvent, p: SearchResult & Result) {
         >
           <!-- eslint-disable vue-a11y/label-has-for -->
           <label
-            id="localsearch-label"
+            :id="labelId"
             :title="buttonText"
-            for="localsearch-input"
+            :for="inputId"
           >
             <SearchIcon class="search-icon" />
+            <span class="sr-only">{{ buttonText }}</span>
           </label>
           <div class="search-actions before">
             <button
+              type="button"
               class="back-button"
+              :aria-label="locale.backButtonTitle"
               :title="locale.backButtonTitle"
               @click="$emit('close')"
             >
@@ -450,20 +516,23 @@ function selectedClick(e: MouseEvent, p: SearchResult & Result) {
             </button>
           </div>
           <input
-            id="localsearch-input"
+            :id="inputId"
             ref="searchInput"
             v-model="filterText"
             :placeholder="buttonText"
-            aria-labelledby="localsearch-label"
+            role="combobox"
+            aria-autocomplete="list"
+            :aria-expanded="results.length > 0 ? 'true' : 'false'"
+            :aria-controls="listId"
+            :aria-labelledby="labelId"
+            :aria-activedescendant="activeDescendantId"
             class="search-input"
           >
           <div class="search-actions">
             <span
               class="search-loading"
               :class="{ active: showSearchSpinner }"
-              :role="showSearchSpinner ? 'status' : undefined"
-              aria-live="polite"
-              :aria-label="showSearchSpinner ? 'Loading search results' : undefined"
+              aria-hidden="true"
             />
             <button
               class="clear-button"
@@ -478,40 +547,42 @@ function selectedClick(e: MouseEvent, p: SearchResult & Result) {
         </form>
 
         <ul
-          :id="results?.length ? 'localsearch-list' : undefined"
+          :id="listId"
           ref="resultsEl"
-          :role="results?.length ? 'listbox' : undefined"
-          :aria-labelledby="results?.length ? 'localsearch-label' : undefined"
+          role="listbox"
+          :aria-labelledby="labelId"
           class="results"
+          tabindex="-1"
           @mousemove="disableMouseOver = false"
         >
           <li
             v-for="(p, index) in results"
+            :id="optionId(index)"
             :key="p.id"
             role="option"
             :aria-selected="selectedIndex === index ? 'true' : 'false'"
+            tabindex="-1"
+            @mouseenter="!disableMouseOver && (selectedIndex = index)"
+            @focusin="selectedIndex = index"
           >
             <a
-              :href="withBase(p.id)"
               class="result"
               :class="{
                 selected: selectedIndex === index,
               }"
-              :aria-label="[...p.titles, p.title].join(' > ')"
-              @mouseenter="!disableMouseOver && (selectedIndex = index)"
-              @focusin="selectedIndex = index"
+              :href="withBase(p.id)"
               @click="selectedClick($event, p)"
             >
               <div>
                 <div class="titles">
-                  <span class="title-icon">#</span>
+                  <span class="title-icon" aria-hidden="true">#</span>
                   <span
                     v-for="(t, i) in p.titles"
                     :key="i"
                     class="title"
                   >
                     <span class="text" v-html="t" />
-                    <svg width="18" height="18" viewBox="0 0 24 24">
+                    <svg width="18" height="18" viewBox="0 0 24 24" aria-hidden="true">
                       <path
                         fill="none"
                         stroke="currentColor"
@@ -529,24 +600,24 @@ function selectedClick(e: MouseEvent, p: SearchResult & Result) {
               </div>
             </a>
           </li>
-          <li
-            v-if="searchIndexError"
-            class="no-results error"
-            role="alert"
-          >
-            {{ searchIndexError }}
-          </li>
-          <li
-            v-else-if="filterText && !results.length && enableNoResults"
-            class="no-results"
-          >
-            {{ locale.noResultsText }} "<strong>{{ filterText }}</strong>"
-          </li>
         </ul>
 
+        <div
+          v-if="searchIndexError"
+          class="no-results error"
+        >
+          {{ searchIndexError }}
+        </div>
+        <div
+          v-else-if="filterText && !results.length && enableNoResults"
+          class="no-results"
+        >
+          {{ locale.noResultsText }} "<strong>{{ filterText }}</strong>"
+        </div>
+
         <div class="search-keyboard-shortcuts">
           <span>
-            <kbd :aria-label="locale.footer?.navigateUpKeyAriaLabel ?? ''">
+            <kbd :aria-label="locale.footer?.navigateUpKeyAriaLabel || 'up arrow'">
               <svg width="14" height="14" viewBox="0 0 24 24">
                 <path
                   fill="none"
@@ -558,7 +629,7 @@ function selectedClick(e: MouseEvent, p: SearchResult & Result) {
                 />
               </svg>
             </kbd>
-            <kbd :aria-label="locale.footer?.navigateDownKeyAriaLabel ?? ''">
+            <kbd :aria-label="locale.footer?.navigateDownKeyAriaLabel || 'down arrow'">
               <svg width="14" height="14" viewBox="0 0 24 24">
                 <path
                   fill="none"
@@ -573,7 +644,7 @@ function selectedClick(e: MouseEvent, p: SearchResult & Result) {
             {{ locale.footer?.navigateText ?? '' }}
           </span>
           <span>
-            <kbd :aria-label="locale.footer?.selectKeyAriaLabel ?? ''">
+            <kbd :aria-label="locale.footer?.selectKeyAriaLabel || 'enter'">
               <svg width="14" height="14" viewBox="0 0 24 24">
                 <g
                   fill="none"
@@ -590,7 +661,7 @@ function selectedClick(e: MouseEvent, p: SearchResult & Result) {
             {{ locale.footer?.selectText ?? '' }}
           </span>
           <span>
-            <kbd :aria-label="locale.footer?.closeKeyAriaLabel ?? ''">esc</kbd>
+            <kbd :aria-label="locale.footer?.closeKeyAriaLabel || 'esc'">esc</kbd>
             {{ locale.footer?.closeText ?? '' }}
           </span>
         </div>
@@ -632,6 +703,7 @@ svg {
 
 .shell {
   position: relative;
+  box-sizing: border-box;
   display: flex;
   flex-direction: column;
   gap: 16px;
@@ -647,7 +719,7 @@ svg {
 @media (max-width: 767px) {
   .shell {
     width: 100vw;
-    height: 100vh;
+    height: 100dvh;
     max-height: none;
     margin: 0;
     border-radius: 0;
@@ -659,7 +731,7 @@ svg {
   align-items: center;
   padding: 0 12px;
   cursor: text;
-  border: 1px solid var(--vp-c-divider);
+  border: 1px solid var(--vp-c-text-2);
   border-radius: 4px;
 }
 
@@ -744,7 +816,7 @@ svg {
   height: 18px;
   margin: 8px;
   visibility: hidden;
-  border: 2px solid var(--vp-c-divider);
+  border: 2px solid var(--vp-c-text-2);
   border-top-color: var(--vp-c-brand-1);
   border-radius: 50%;
 }
@@ -828,6 +900,10 @@ svg {
   list-style: none;
 }
 
+.results:empty {
+  display: none;
+}
+
 .result {
   display: flex;
   gap: 8px;
@@ -835,10 +911,14 @@ svg {
   line-height: 1rem;
   border: solid 2px var(--vp-mini-search-result-border);
   border-radius: 4px;
-  outline: none;
   transition: none;
 }
 
+.result:focus-visible {
+  outline: 2px solid var(--vp-c-brand-1);
+  outline-offset: 2px;
+}
+
 .result > div {
   width: 100%;
   margin: 12px;
@@ -872,8 +952,7 @@ svg {
 
 .title-icon {
   font-weight: 500;
-  color: var(--vp-c-brand-1);
-  opacity: 0.5;
+  color: var(--vp-c-text-2);
 }
 
 .title :deep(svg) {

package/dist/client/components/SearchButton.vue

@@ -1,19 +1,46 @@
 <script lang="ts" setup>
 import type { SearchBoxLocales } from '../../shared/index.js'
-import { toRef } from 'vue'
+import { toRef, useTemplateRef } from 'vue'
 import { useLocale } from '../composables/index.js'
 
-const { locales } = defineProps<{
+const { locales, expanded } = defineProps<{
   locales: SearchBoxLocales
+  expanded?: boolean
 }>()
 
 const locale = useLocale(toRef(() => locales))
+
+const buttonEl = useTemplateRef<HTMLButtonElement>('button')
+
+/**
+ * Move focus back to the trigger button.
+ *
+ * 将焦点移回触发按钮。
+ *
+ * Exposed so the search box can hand focus back to this trigger after closing,
+ * which keeps keyboard users from being thrown back to the top of the page.
+ *
+ * 暴露该方法，使搜索框在关闭后能把焦点归还给该触发按钮，
+ * 避免键盘用户的焦点被弹回页面顶部。
+ */
+function focus() {
+  buttonEl.value?.focus({ preventScroll: true })
+}
+
+defineExpose({ focus })
 </script>
 
 <template>
-  <button type="button" class="mini-search mini-search-button" :aria-label="locale.placeholder">
+  <button
+    ref="button"
+    type="button"
+    class="mini-search mini-search-button"
+    :aria-label="locale.placeholder"
+    aria-haspopup="dialog"
+    :aria-expanded="expanded ? 'true' : 'false'"
+  >
     <span class="mini-search-button-container">
-      <span class="mini-search-search-icon vpi-mini-search" aria-label="search icon" />
+      <span class="mini-search-search-icon vpi-mini-search" aria-hidden="true" />
       <span class="mini-search-button-placeholder">{{ locale.placeholder }}</span>
     </span>
     <span class="mini-search-button-keys">
@@ -40,13 +67,13 @@ const locale = useLocale(toRef(() => locales))
   background: transparent;
 }
 
-.mini-search-button:focus {
-  outline: 1px dotted;
-  outline: 5px auto -webkit-focus-ring-color;
+.mini-search-button:focus-visible {
+  outline: var(--vp-focus-ring-width) solid var(--vp-focus-ring-color);
+  outline-offset: var(--vp-focus-ring-offset);
 }
 
 .mini-search-button:focus:not(:focus-visible) {
-  outline: none !important;
+  outline: none;
 }
 
 @media (min-width: 768px) {

package/dist/client/composables/index.js

@@ -61,5 +61,4 @@ if (__VUEPRESS_DEV__ && (import.meta.webpackHot || import.meta.hot))
   __VUE_HMR_RUNTIME__.updateSearchIndex = (data) => {
     searchIndexData.value = data
   }
-
 export {loadSearchIndexJSON, useLocale, useSearchIndex}

package/dist/client/config.js

@@ -15,5 +15,4 @@ var config_default = defineClientConfig({
     )
   },
 })
-
 export {config_default as default}

package/dist/node/index.d.ts

@@ -20,9 +20,6 @@ interface SearchIndexOptions {
  *
  * 为 VuePress 应用中的所有页面准备搜索索引。
  *
- * This function indexes all pages concurrently, creating separate MiniSearch
- * instances for each locale, and writes the indexes to temporary files.
- *
  * 此函数并发索引所有页面，为每个语言创建独立的 MiniSearch 实例，
  * 并将索引写入临时文件。
  *

package/dist/node/index.js

@@ -485,5 +485,4 @@ function searchPlugin({locales = {}, isSearchable, ...searchOptions} = {}) {
     },
   })
 }
-
 export {prepareSearchIndex, searchPlugin}

package/dist/shared/index.d.ts

@@ -1,5 +1,27 @@
 import {Options} from 'minisearch'
 import {LocaleConfig, Page} from 'vuepress/core'
+/**
+ * Create a tokenizer shared by the node (index build) and client (query) sides.
+ *
+ * 创建由 Node 端（构建索引）与客户端（查询）共享的分词器。
+ *
+ * MiniSearch requires the tokenizer used to build the index to be identical to
+ * the one used at query time. Defining it in one place guarantees both sides
+ * use the same strategy: `Intl.Segmenter` when available, otherwise the same
+ * deterministic whitespace fallback. Blank and punctuation-only tokens are
+ * discarded on both sides, so they never pollute the index or the query.
+ *
+ * MiniSearch 要求构建索引与查询时使用完全一致的分词器。集中定义可保证两端策略一致：
+ * 支持 `Intl.Segmenter` 时使用它分词，否则统一退化为确定性的空白符分词。
+ * 两端都会丢弃空白与纯标点词元，避免污染索引与查询。
+ *
+ * @param lang - Language code for word segmentation / 用于分词的语言代码
+ * @returns Tokenizer that splits a string into tokens / 将字符串切分为词元的函数
+ * @example
+ * const tokenize = createTokenizer('en')
+ * tokenize('Hello world') // ['Hello', 'world'] with Intl.Segmenter
+ */
+export declare function createTokenizer(lang: string): (text: string) => string[]
 /**
  * Locale options for search UI strings.
  *
@@ -59,28 +81,6 @@ export interface SearchLocaleOptions {
  * 搜索框的语言配置类型。
  */
 export type SearchBoxLocales = LocaleConfig<SearchLocaleOptions>
-/**
- * Create a tokenizer shared by the node (index build) and client (query) sides.
- *
- * 创建由 Node 端（构建索引）与客户端（查询）共享的分词器。
- *
- * MiniSearch requires the tokenizer used to build the index to be identical to
- * the one used at query time. Defining it in one place guarantees both sides
- * use the same strategy: `Intl.Segmenter` when available, otherwise the same
- * deterministic whitespace fallback. Blank and punctuation-only tokens are
- * discarded on both sides, so they never pollute the index or the query.
- *
- * MiniSearch 要求构建索引与查询时使用完全一致的分词器。集中定义可保证两端策略一致：
- * 支持 `Intl.Segmenter` 时使用它分词，否则统一退化为确定性的空白符分词。
- * 两端都会丢弃空白与纯标点词元，避免污染索引与查询。
- *
- * @param lang - Language code for word segmentation / 用于分词的语言代码
- * @returns Tokenizer that splits a string into tokens / 将字符串切分为词元的函数
- * @example
- * const tokenize = createTokenizer('en')
- * tokenize('Hello world') // ['Hello', 'world'] with Intl.Segmenter
- */
-export declare function createTokenizer(lang: string): (text: string) => string[]
 /**
  * Options for the search plugin.
  *

package/dist/shared/index.js

@@ -1,16 +1,32 @@
+const SPACE_OR_PUNCTUATION_RE = /[\n\r\p{Z}\p{P}]+/u
+const UNSPACED_RUN_RE =
+  /[\p{scx=Han}\p{scx=Hiragana}\p{scx=Katakana}]+|[^\p{scx=Han}\p{scx=Hiragana}\p{scx=Katakana}]+/gu
+const UNSPACED_START_RE = /^[\p{scx=Han}\p{scx=Hiragana}\p{scx=Katakana}]/u
+const NO_SPACE_AND_PUNCTUATION_RE_RE = /\p{L}|\p{N}/u
+
 function isWordToken(token) {
-  return /\p{L}|\p{N}/u.test(token)
+  return NO_SPACE_AND_PUNCTUATION_RE_RE.test(token)
 }
 
 function createTokenizer(lang) {
   if (typeof Intl !== 'undefined' && typeof Intl.Segmenter === 'function') {
     const segmenter = new Intl.Segmenter(lang, {granularity: 'word'})
-    return (text) =>
-      Array.from(segmenter.segment(text))
-        .map((segment) => segment.segment)
+    return (text) => {
+      return text
+        .split(SPACE_OR_PUNCTUATION_RE)
+        .flatMap(
+          (term) =>
+            term
+              .match(UNSPACED_RUN_RE)
+              ?.flatMap((run) =>
+                UNSPACED_START_RE.test(run)
+                  ? Array.from(segmenter.segment(run), (part) => part.segment)
+                  : run,
+              ) ?? term,
+        )
         .filter(isWordToken)
+    }
   }
-  return (text) => text.split(/\s+/).filter(isWordToken)
+  return (text) => text.split(SPACE_OR_PUNCTUATION_RE).filter(isWordToken)
 }
-
 export {createTokenizer}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@vuepress-plume/plugin-search",
   "type": "module",
-  "version": "1.0.0-rc.213",
+  "version": "1.0.0-rc.215",
   "description": "The Plugin for VuePress 2 - local search",
   "author": "pengzhanbo <volodymyr@foxmail.com>",
   "license": "MIT",
@@ -44,12 +44,13 @@
     "@vueuse/core": "^15.0.0",
     "@vueuse/integrations": "^15.0.0",
     "chokidar": "5.0.0",
-    "focus-trap": "^8.2.2",
+    "focus-trap": "^8.2.4",
     "mark.js": "^8.11.1",
     "minisearch": "^7.2.0",
-    "p-map": "^7.0.8",
-    "sanitize-html": "^2.18.0",
-    "vue": "^3.5.43"
+    "p-map": "^7.1.1",
+    "sanitize-html": "^2.18.1",
+    "vue": "^3.5.44",
+    "vue-router": "^5.4.0"
   },
   "publishConfig": {
     "access": "public",