chore: rename offline search to local search

pull/2218/head
Divyansh Singh 2 years ago
parent 536174912b
commit 8059ec390a

@ -53,7 +53,7 @@ export default defineConfig({
indexName: 'vitepress' indexName: 'vitepress'
}, },
// offlineSearch: true, // localSearch: true,
carbonAds: { carbonAds: {
code: 'CEBDT27Y', code: 'CEBDT27Y',

@ -1,15 +1,15 @@
# Search # Search
## Offline Search ## Local Search
VitePress supports fuzzy full-text search using a in-browser index thanks to [minisearch](https://github.com/lucaong/minisearch/). You can enable it in your `.vitepress/config.ts` with the `offlineSearch` theme config: VitePress supports fuzzy full-text search using a in-browser index thanks to [minisearch](https://github.com/lucaong/minisearch/). You can enable it in your `.vitepress/config.ts` with the `localSearch` theme config:
```ts ```ts
import { defineConfig } from 'vitepress' import { defineConfig } from 'vitepress'
export default defineConfig({ export default defineConfig({
themeConfig: { themeConfig: {
offlineSearch: true localSearch: true
} }
}) })
``` ```
@ -20,7 +20,7 @@ Example result:
Alternatively, you can use [Algolia DocSearch](#algolia-search) or some community plugins like <https://www.npmjs.com/package/vitepress-plugin-search> or <https://www.npmjs.com/package/vitepress-plugin-pagefind>. Alternatively, you can use [Algolia DocSearch](#algolia-search) or some community plugins like <https://www.npmjs.com/package/vitepress-plugin-search> or <https://www.npmjs.com/package/vitepress-plugin-pagefind>.
### i18n {#offline-search-i18n} ### i18n {#local-search-i18n}
You can use a config like this to use multilingual search: You can use a config like this to use multilingual search:
@ -29,7 +29,7 @@ import { defineConfig } from 'vitepress'
export default defineConfig({ export default defineConfig({
themeConfig: { themeConfig: {
offlineSearch: { localSearch: {
locales: { locales: {
zh: { zh: {
translations: { translations: {

@ -21,7 +21,7 @@ declare module '@theme/index' {
export default theme export default theme
} }
declare module '@offlineSearchIndex' { declare module '@localSearchIndex' {
const data: Record<string, () => Promise<{ default: string }>> const data: Record<string, () => Promise<{ default: string }>>
export default data export default data
} }

@ -3,10 +3,10 @@ import { markRaw, nextTick, onMounted, ref, shallowRef, watch, type Ref, createA
import { useRouter } from 'vitepress' import { useRouter } from 'vitepress'
import { onKeyStroke, useSessionStorage, debouncedWatch, useLocalStorage, useEventListener, computedAsync } from '@vueuse/core' import { onKeyStroke, useSessionStorage, debouncedWatch, useLocalStorage, useEventListener, computedAsync } from '@vueuse/core'
import MiniSearch, { type SearchResult } from 'minisearch' import MiniSearch, { type SearchResult } from 'minisearch'
import offlineSearchIndex from '@offlineSearchIndex' import localSearchIndex from '@localSearchIndex'
import { useData } from '../composables/data' import { useData } from '../composables/data'
import { createTranslate } from '../support/translation' import { createTranslate } from '../support/translation'
import type { ModalTranslations } from '../../../../types/offline-search' import type { ModalTranslations } from '../../../../types/local-search'
import { pathToFile, withBase } from '../../app/utils.js' import { pathToFile, withBase } from '../../app/utils.js'
defineProps<{ defineProps<{
@ -21,11 +21,11 @@ const el = ref<HTMLDivElement>()
/* Search */ /* Search */
const searchIndexData = shallowRef(offlineSearchIndex) const searchIndexData = shallowRef(localSearchIndex)
// hmr // hmr
if (import.meta.hot) { if (import.meta.hot) {
import.meta.hot.accept('/@offlineSearchIndex', (m) => { import.meta.hot.accept('/@localSearchIndex', (m) => {
if (m) { if (m) {
searchIndexData.value = m.default searchIndexData.value = m.default
} }
@ -50,9 +50,9 @@ const searchIndex = computedAsync(async () => markRaw(MiniSearch.loadJSON<Result
}, },
}))) })))
const filterText = useSessionStorage('vitepress:offline-search-filter', '') const filterText = useSessionStorage('vitepress:local-search-filter', '')
const showDetailedList = useLocalStorage('vitepress:offline-search-detailed-list', false) const showDetailedList = useLocalStorage('vitepress:local-search-detailed-list', false)
const results: Ref<(SearchResult & Result)[]> = shallowRef([]) const results: Ref<(SearchResult & Result)[]> = shallowRef([])
@ -226,7 +226,7 @@ const router = useRouter()
onKeyStroke('Enter', () => { onKeyStroke('Enter', () => {
const selectedPackage = results.value[selectedIndex.value] const selectedPackage = results.value[selectedIndex.value]
if (selectedPackage) { if (selectedPackage) {
router.go(selectedPackage.id) router.go(withBase(selectedPackage.id))
emit('close') emit('close')
} }
}) })
@ -255,7 +255,7 @@ const defaultTranslations: { modal: ModalTranslations } = {
} }
} }
const $t = createTranslate(theme.value.offlineSearch, defaultTranslations) const $t = createTranslate(theme.value.localSearch, defaultTranslations)
// Back // Back
@ -272,7 +272,7 @@ useEventListener('popstate', event => {
<template> <template>
<Teleport to="body"> <Teleport to="body">
<div ref="el" class="VPOfflineSearchBox" aria-modal="true"> <div ref="el" class="VPLocalSearchBox" aria-modal="true">
<div class="backdrop" @click="$emit('close')" /> <div class="backdrop" @click="$emit('close')" />
<div class="shell"> <div class="shell">
@ -378,7 +378,7 @@ useEventListener('popstate', event => {
</template> </template>
<style scoped lang="postcss"> <style scoped lang="postcss">
.VPOfflineSearchBox { .VPLocalSearchBox {
position: fixed; position: fixed;
z-index: 100; z-index: 100;
inset: 0; inset: 0;

@ -15,9 +15,9 @@ const VPAlgoliaSearchBox = __ALGOLIA__
? defineAsyncComponent(() => import('./VPAlgoliaSearchBox.vue')) ? defineAsyncComponent(() => import('./VPAlgoliaSearchBox.vue'))
: () => null : () => null
const VPOfflineSearchBox = __ALGOLIA__ const VPLocalSearchBox = __ALGOLIA__
? () => null ? () => null
: defineAsyncComponent(() => import('./VPOfflineSearchBox.vue')) : defineAsyncComponent(() => import('./VPLocalSearchBox.vue'))
const { theme, localeIndex } = useData() const { theme, localeIndex } = useData()
@ -32,9 +32,9 @@ const buttonText = computed(() => {
?.buttonText || ?.buttonText ||
theme.value.algolia.translations?.button?.buttonText || theme.value.algolia.translations?.button?.buttonText ||
'Search' 'Search'
} else if (typeof theme.value.offlineSearch === 'object') { } else if (typeof theme.value.localSearch === 'object') {
return theme.value.offlineSearch.locales?.[localeIndex.value]?.translations?.button?.buttonText || return theme.value.localSearch.locales?.[localeIndex.value]?.translations?.button?.buttonText ||
theme.value.offlineSearch.translations?.button?.buttonText || theme.value.localSearch.translations?.button?.buttonText ||
'Search' 'Search'
} }
return 'Search' return 'Search'
@ -101,11 +101,11 @@ function poll() {
}, 16) }, 16)
} }
// Offline search // Local search
const showSearch = ref(false) const showSearch = ref(false)
if (!__ALGOLIA__ && theme.value.offlineSearch) { if (!__ALGOLIA__ && theme.value.localSearch) {
onKeyStroke('k', event => { onKeyStroke('k', event => {
if (event.ctrlKey || event.metaKey) { if (event.ctrlKey || event.metaKey) {
event.preventDefault() event.preventDefault()
@ -134,10 +134,10 @@ onMounted(() => {
</div> </div>
</template> </template>
<template v-else-if="theme.offlineSearch"> <template v-else-if="theme.localSearch">
<VPOfflineSearchBox v-if="showSearch" :placeholder="buttonText" @close="showSearch = false" /> <VPLocalSearchBox v-if="showSearch" :placeholder="buttonText" @close="showSearch = false" />
<div id="offline-search"> <div id="local-search">
<VPNavBarSearchButton :placeholder="buttonText" @click="showSearch = true" /> <VPNavBarSearchButton :placeholder="buttonText" @click="showSearch = true" />
</div> </div>
</template> </template>

@ -22,7 +22,7 @@ import { staticDataPlugin } from './plugins/staticDataPlugin'
import { webFontsPlugin } from './plugins/webFontsPlugin' import { webFontsPlugin } from './plugins/webFontsPlugin'
import { dynamicRoutesPlugin } from './plugins/dynamicRoutesPlugin' import { dynamicRoutesPlugin } from './plugins/dynamicRoutesPlugin'
import { rewritesPlugin } from './plugins/rewritesPlugin' import { rewritesPlugin } from './plugins/rewritesPlugin'
import { offlineSearchPlugin } from './plugins/offlineSearchPlugin.js' import { localSearchPlugin } from './plugins/localSearchPlugin.js'
import { serializeFunctions, deserializeFunctions } from './utils/fnSerialize' import { serializeFunctions, deserializeFunctions } from './utils/fnSerialize'
declare module 'vite' { declare module 'vite' {
@ -361,7 +361,7 @@ export async function createVitePressPlugin(
vuePlugin, vuePlugin,
webFontsPlugin(siteConfig.useWebFonts), webFontsPlugin(siteConfig.useWebFonts),
...(userViteConfig?.plugins || []), ...(userViteConfig?.plugins || []),
await offlineSearchPlugin(siteConfig), await localSearchPlugin(siteConfig),
staticDataPlugin, staticDataPlugin,
await dynamicRoutesPlugin(siteConfig) await dynamicRoutesPlugin(siteConfig)
] ]

@ -7,9 +7,9 @@ import type { SiteConfig } from '../config'
import { createMarkdownRenderer } from '../markdown/markdown.js' import { createMarkdownRenderer } from '../markdown/markdown.js'
import { resolveSiteDataByRoute } from '../shared.js' import { resolveSiteDataByRoute } from '../shared.js'
const debug = _debug('vitepress:offline-search') const debug = _debug('vitepress:local-search')
const OFFLINE_SEARCH_INDEX_ID = '@offlineSearchIndex' const OFFLINE_SEARCH_INDEX_ID = '@localSearchIndex'
const OFFLINE_SEARCH_INDEX_REQUEST_PATH = '/' + OFFLINE_SEARCH_INDEX_ID const OFFLINE_SEARCH_INDEX_REQUEST_PATH = '/' + OFFLINE_SEARCH_INDEX_ID
interface IndexObject { interface IndexObject {
@ -19,15 +19,15 @@ interface IndexObject {
titles: string[] titles: string[]
} }
export async function offlineSearchPlugin( export async function localSearchPlugin(
siteConfig: SiteConfig siteConfig: SiteConfig
): Promise<Plugin> { ): Promise<Plugin> {
if ( if (
siteConfig.userConfig.themeConfig?.algolia || siteConfig.userConfig.themeConfig?.algolia ||
!siteConfig.userConfig.themeConfig?.offlineSearch !siteConfig.userConfig.themeConfig?.localSearch
) { ) {
return { return {
name: 'vitepress:offline-search', name: 'vitepress:local-search',
resolveId(id) { resolveId(id) {
if (id.startsWith(OFFLINE_SEARCH_INDEX_ID)) { if (id.startsWith(OFFLINE_SEARCH_INDEX_ID)) {
return `/${id}` return `/${id}`
@ -146,7 +146,7 @@ export async function offlineSearchPlugin(
} }
return { return {
name: 'vitepress:offline-search', name: 'vitepress:local-search',
configureServer(_server) { configureServer(_server) {
server = _server server = _server
@ -182,7 +182,7 @@ export async function offlineSearchPlugin(
records.push( records.push(
`${JSON.stringify( `${JSON.stringify(
locale locale
)}: () => import('@offlineSearchIndex${locale}')` )}: () => import('@localSearchIndex${locale}')`
) )
} }
return `export default {${records.join(',')}}` return `export default {${records.join(',')}}`

@ -1,5 +1,5 @@
import { DocSearchProps } from './docsearch.js' import { DocSearchProps } from './docsearch.js'
import { OfflineSearchTranslations } from './offline-search.js' import { LocalSearchTranslations } from './local-search.js'
export namespace DefaultTheme { export namespace DefaultTheme {
export interface Config { export interface Config {
@ -107,9 +107,9 @@ export namespace DefaultTheme {
algolia?: AlgoliaSearchOptions algolia?: AlgoliaSearchOptions
/** /**
* The offline search options. Set to `true` or an object to enable, `false` to disable. * The local search options. Set to `true` or an object to enable, `false` to disable.
*/ */
offlineSearch?: OfflineSearchOptions | boolean localSearch?: LocalSearchOptions | boolean
/** /**
* The carbon ads options. Leave it undefined to disable the ads feature. * The carbon ads options. Leave it undefined to disable the ads feature.
@ -301,11 +301,11 @@ export namespace DefaultTheme {
locales?: Record<string, Partial<DocSearchProps>> locales?: Record<string, Partial<DocSearchProps>>
} }
// offline search ------------------------------------------------------------ // local search ------------------------------------------------------------
export interface OfflineSearchOptions { export interface LocalSearchOptions {
translations?: OfflineSearchTranslations translations?: LocalSearchTranslations
locales?: Record<string, Partial<Omit<OfflineSearchOptions, 'locales'>>> locales?: Record<string, Partial<Omit<LocalSearchOptions, 'locales'>>>
} }
// carbon ads ---------------------------------------------------------------- // carbon ads ----------------------------------------------------------------

@ -1,4 +1,4 @@
export interface OfflineSearchTranslations { export interface LocalSearchTranslations {
button?: ButtonTranslations button?: ButtonTranslations
modal?: ModalTranslations modal?: ModalTranslations
} }
Loading…
Cancel
Save