[v3] rename nextraConfig.flexsearch to nextraConfig.search (#2256)

Author: Dimitri POSTOLOV

.changeset/selfish-penguins-deliver.md

@@ -0,0 +1,5 @@
+---
+'nextra': major
+---
+
+- rename `nextraConfig.flexsearch` to `nextraConfig.search`

docs/next.config.mjs

@@ -4,7 +4,7 @@ const withNextra = nextra({
   theme: 'nextra-theme-docs',
   themeConfig: './theme.config.tsx',
   latex: true,
-  flexsearch: {
+  search: {
     codeblocks: false
   },
   defaultShowCopyCode: true

docs/pages/docs/docs-theme/api/use-config.mdx

@@ -52,8 +52,6 @@ context.
   [Table of Contents Sidebar](/docs/docs-theme/theme-configuration#toc-sidebar)
 - `useNextSeoOptions`: a function that passes data to Next.js SEO component.
   (see [SEO Options](/docs/docs-theme/theme-configuration#seo-options))
-- `flexsearch`: data about search configuration
-- `title`: Title about current document
+- `title`: title about current page
 - `frontMatter`: parsed [front matter](https://jekyllrb.com/docs/front-matter)
   data
-- `flexsearch`: data for search configuration

examples/docs/next.config.mjs

@@ -4,7 +4,7 @@ const withNextra = nextra({
   theme: 'nextra-theme-docs',
   themeConfig: './src/theme.config.js',
   latex: true,
-  flexsearch: {
+  search: {
     codeblock: false
   }
 })

examples/docs/src/pages/themes/docs/configuration.mdx

@@ -572,7 +572,7 @@ export default {
 
 <Unstable />
 
-## `flexsearch`
+## `search`
 
 Enable Nextra built-in search
 
@@ -586,7 +586,7 @@ import nextra from 'nextra'
 const withNextra = nextra({
   theme: 'nextra-theme-blog',
   themeConfig: './theme.config.js',
-  flexsearch: {
+  search: {
     codeblock: false
   }
 })

packages/nextra-theme-docs/src/components/navbar.tsx

@@ -164,7 +164,7 @@ export function Navbar({ items }: NavBarProps): ReactElement {
           )
         })}
 
-        {config.flexsearch &&
+        {process.env.NEXTRA_SEARCH &&
           renderComponent(config.search.component, {
             className: 'nx-hidden md:nx-inline-block mx-min-w-[200px]'
           })}

packages/nextra-theme-docs/src/components/sidebar.tsx

@@ -415,7 +415,7 @@ export function Sidebar({
         )}
         ref={containerRef}
       >
-        {config.flexsearch && (
+        {process.env.NEXTRA_SEARCH && (
           <div className="nx-px-4 nx-pt-4 md:nx-hidden">
             {renderComponent(config.search.component)}
           </div>

packages/nextra-theme-docs/src/contexts/config.tsx

@@ -10,7 +10,7 @@ import type { Context } from '../types'
 import { MenuProvider } from './menu'
 
 type Config<FrontMatterType = FrontMatter> = DocsThemeConfig &
-  Pick<PageOpts<FrontMatterType>, 'flexsearch' | 'title' | 'frontMatter'>
+  Pick<PageOpts<FrontMatterType>, 'title' | 'frontMatter'>
 
 const ConfigContext = createContext<Config>({
   title: '',
@@ -98,7 +98,6 @@ export const ConfigProvider = ({
   }
   const extendedConfig: Config = {
     ...theme,
-    flexsearch: pageOpts.flexsearch,
     title: pageOpts.title,
     frontMatter: pageOpts.frontMatter
   }

packages/nextra/__test__/loader.test.ts

@@ -31,8 +31,8 @@ describe('tree shaking', async () => {
   it('should not include default `pageOpts.frontMatter: {}`', () => {
     expect(testPage.includes('frontMatter:')).toBe(true)
   })
-  it('should not include `pageOpts.flexsearch`', () => {
-    expect(testPage.includes('flexsearch:')).toBe(false)
+  it('should not include `pageOpts.search`', () => {
+    expect(testPage.includes('search:')).toBe(false)
   })
   it('should not include `themeConfig`', () => {
     expect(testPage.includes('themeConfig:')).toBe(false)

packages/nextra/src/compile.ts

@@ -79,7 +79,7 @@ const clonedRemarkLinkRewrite = remarkLinkRewrite.bind(null)
 type CompileMdxOptions = Pick<
   LoaderOptions,
   | 'staticImage'
-  | 'flexsearch'
+  | 'search'
   | 'defaultShowCopyCode'
   | 'readingTime'
   | 'latex'
@@ -97,7 +97,7 @@ export async function compileMdx(
   source: string,
   {
     staticImage,
-    flexsearch,
+    search,
     readingTime,
     latex,
     codeHighlight,
@@ -116,16 +116,16 @@ export async function compileMdx(
   let searchIndexKey: string | null = null
   if (ERROR_ROUTES.has(route)) {
     /* skip */
-  } else if (typeof flexsearch === 'object') {
-    if (flexsearch.indexKey) {
-      searchIndexKey = flexsearch.indexKey(filePath, route, locale)
+  } else if (typeof search === 'object') {
+    if (search.indexKey) {
+      searchIndexKey = search.indexKey(filePath, route, locale)
       if (searchIndexKey === '') {
         searchIndexKey = locale || DEFAULT_LOCALE
       }
     } else {
       searchIndexKey = locale || DEFAULT_LOCALE
     }
-  } else if (flexsearch) {
+  } else if (search) {
     searchIndexKey = locale || DEFAULT_LOCALE
   }
 
@@ -218,7 +218,7 @@ export async function compileMdx(
         remarkCustomHeadingId,
         [remarkHeadings, { isRemoteContent }] satisfies Pluggable,
         // structurize should be before remarkHeadings because we attach #id attribute to heading node
-        flexsearch && ([remarkStructurize, flexsearch] satisfies Pluggable),
+        search && ([remarkStructurize, search] satisfies Pluggable),
         staticImage && remarkStaticImage,
         readingTime && remarkReadingTime,
         latex && remarkMath,

packages/nextra/src/constants.ts

@@ -11,7 +11,7 @@ export const DEFAULT_LOCALE = 'en-US'
 
 export const DEFAULT_CONFIG = {
   staticImage: true,
-  flexsearch: {
+  search: {
     codeblocks: true
   },
   codeHighlight: true

packages/nextra/src/index.ts

@@ -47,7 +47,7 @@ const nextra: Nextra = nextraConfig =>
       return rules
     }
 
-    const nextraLoaderOptions = {
+    const loaderOptions = {
       ...DEFAULT_CONFIG,
       ...nextraConfig,
       locales
@@ -61,14 +61,15 @@ const nextra: Nextra = nextraConfig =>
     return {
       ...nextConfig,
       ...(nextConfig.output !== 'export' && { rewrites }),
-      ...(hasI18n && {
-        env: {
+      env: {
+        ...nextConfig.env,
+        ...(hasI18n && {
           NEXTRA_DEFAULT_LOCALE:
-            nextConfig.i18n?.defaultLocale || DEFAULT_LOCALE,
-          ...nextConfig.env
-        },
-        i18n: undefined
-      }),
+            nextConfig.i18n?.defaultLocale || DEFAULT_LOCALE
+        }),
+        NEXTRA_SEARCH: String(!!loaderOptions.search)
+      },
+      ...(hasI18n && { i18n: undefined }),
       pageExtensions: [
         ...(nextConfig.pageExtensions || DEFAULT_EXTENSIONS),
         ...MARKDOWN_EXTENSIONS
@@ -78,7 +79,7 @@ const nextra: Nextra = nextraConfig =>
           config.plugins ||= []
           config.plugins.push(new NextraPlugin({ locales }))
 
-          if (nextraLoaderOptions.flexsearch) {
+          if (loaderOptions.search) {
             config.plugins.push(new NextraSearchPlugin())
           }
         }
@@ -103,7 +104,7 @@ const nextra: Nextra = nextraConfig =>
               options.defaultLoaders.babel,
               {
                 loader: 'nextra/loader',
-                options: nextraLoaderOptions
+                options: loaderOptions
               }
             ]
           },
@@ -116,7 +117,7 @@ const nextra: Nextra = nextraConfig =>
               {
                 loader: 'nextra/loader',
                 options: {
-                  ...nextraLoaderOptions,
+                  ...loaderOptions,
                   isPageImport: true
                 }
               }
@@ -135,7 +136,7 @@ const nextra: Nextra = nextraConfig =>
               options.defaultLoaders.babel,
               {
                 loader: 'nextra/loader',
-                options: nextraLoaderOptions
+                options: loaderOptions
               }
             ]
           }

packages/nextra/src/loader.ts

@@ -58,16 +58,16 @@ async function loader(
     isPageImport = false,
     theme,
     themeConfig,
-    locales,
     defaultShowCopyCode,
-    flexsearch,
-    latex,
+    search,
     staticImage,
     readingTime: _readingTime,
-    mdxOptions,
+    latex,
+    codeHighlight,
     transform,
     transformPageOpts,
-    codeHighlight
+    mdxOptions,
+    locales
   } = context.getOptions()
   context.cacheable(true)
 
@@ -114,26 +114,21 @@ ${OFFICIAL_THEMES.includes(theme) ? `import '${theme}/style.css'` : ''}`
     isAppFileFromNodeModules = mdxPath.includes('/node_modules/')
     // Relative path instead of a package name
     const themeConfigImport = themeConfig
-      ? `import __nextra_themeConfig from '${slash(path.resolve(themeConfig))}'`
+      ? `import __themeConfig from '${slash(path.resolve(themeConfig))}'`
       : ''
 
-    return `import __nextra_layout from '${layoutPath}'
+    const content = isAppFileFromNodeModules
+      ? 'export default function App({ Component, pageProps }) { return <Component {...pageProps} />}'
+      : [cssImports, source].join('\n')
+
+    return `import __layout from '${layoutPath}'
 ${themeConfigImport}
-${
-  isAppFileFromNodeModules
-    ? 'export default function App({ Component, pageProps }) { return <Component {...pageProps} />}'
-    : [cssImports, source].join('\n')
-}
+${content}
 
 const __nextra_internal__ = globalThis[Symbol.for('__nextra_internal__')] ||= Object.create(null)
 __nextra_internal__.context ||= Object.create(null)
-__nextra_internal__.Layout = __nextra_layout
-__nextra_internal__.flexsearch = ${JSON.stringify(flexsearch)}
-${
-  themeConfigImport
-    ? '__nextra_internal__.themeConfig = __nextra_themeConfig'
-    : ''
-}`
+__nextra_internal__.Layout = __layout
+${themeConfigImport && '__nextra_internal__.themeConfig = __themeConfig'}`
   }
 
   const { fileMap } = (await import(
@@ -196,7 +191,7 @@ ${
     readingTime: _readingTime,
     defaultShowCopyCode,
     staticImage,
-    flexsearch,
+    search,
     latex,
     codeHighlight,
     route,

packages/nextra/src/mdx-plugins/remark-structurize.ts

@@ -1,6 +1,6 @@
 import type { Root } from 'mdast'
 import type { Plugin } from 'unified'
-import type { Flexsearch, StructurizedData } from '../types'
+import type { Search, StructurizedData } from '../types'
 
 const CODE_TABLE_QUOTE_LIST = new Set<string>([
   'code',
@@ -10,7 +10,7 @@ const CODE_TABLE_QUOTE_LIST = new Set<string>([
   'mdxJsxFlowElement'
 ])
 
-export const remarkStructurize: Plugin<[Flexsearch], Root> = options => {
+export const remarkStructurize: Plugin<[Search], Root> = options => {
   const opts = { codeblocks: true, ...(options as any) }
   const structurizedData: StructurizedData = Object.create(null)
   let activeSlug = ''

packages/nextra/src/setup-page.ts

@@ -140,7 +140,6 @@ export function setupNextraPage({
   __nextra_internal__.pageMap = pageOpts.pageMap
 
   pageOpts.frontMatter ||= {}
-  pageOpts.flexsearch = __nextra_internal__.flexsearch
   __nextra_internal__.context[route] = {
     Content: MDXContent,
     pageOpts

packages/nextra/src/types.ts

@@ -91,7 +91,6 @@ export type PageOpts<FrontMatterType = FrontMatter> = {
   headings: Heading[]
   hasJsxInH1?: boolean
   timestamp?: number
-  flexsearch?: Flexsearch
   readingTime?: ReadingTime
 }
 
@@ -103,7 +102,7 @@ export type ReadingTime = {
 }
 
 type Theme = string
-export type Flexsearch =
+export type Search =
   | boolean
   | {
       /**
@@ -134,7 +133,7 @@ export type NextraConfig = {
   theme: Theme
   themeConfig?: string
   defaultShowCopyCode?: boolean
-  flexsearch?: Flexsearch
+  search?: Search
   staticImage?: boolean
   readingTime?: boolean
   latex?: boolean
@@ -176,7 +175,6 @@ export type NextraInternalGlobal = typeof globalThis & {
     refreshListeners: Record<string, (() => void)[]>
     Layout: FC<any>
     themeConfig?: ThemeConfig
-    flexsearch?: Flexsearch
   }
 }