chore(theme): export FallbackHeading for reusing

packages/core/src/node/eject.ts

@@ -36,6 +36,7 @@ export async function getAvailableComponents(): Promise<string[]> {
     'Badge',
     'Callout',
     'DocFooter',
+    'FallbackHeading',
     'HomeFeature',
     'HomeHero',
     'HomeBackground',

packages/core/src/theme/components/DocContent/index.tsx

@@ -1,9 +1,9 @@
 import { MDXProvider } from '@mdx-js/react';
 import { Content, usePage, useSite } from '@rspress/core/runtime';
-import { Callout, getCustomMDXComponent } from '@theme';
-import './doc.scss';
+import { Callout, FallbackHeading, getCustomMDXComponent } from '@theme';
 import { useScrollAfterNav } from '../../logic/useScrollAfterNav';
-import { FallbackHeading } from './FallbackHeading';
+
+import './doc.scss';
 
 export function FallbackTitle() {
   const { site } = useSite();

packages/core/src/theme/components/DocContent/FallbackHeading.tsx → packages/core/src/theme/components/FallbackHeading/index.tsx

@@ -1,15 +1,17 @@
-import { renderInlineMarkdown } from '@theme';
+import { getCustomMDXComponent, renderInlineMarkdown } from '@theme';
 import { slug } from 'github-slugger';
-import { A } from './docComponents/a';
-import { H1, H2, H3, H4, H5, H6 } from './docComponents/title';
+import { useMemo } from 'react';
 
-const HEADING_MAP = {
-  1: H1,
-  2: H2,
-  3: H3,
-  4: H4,
-  5: H5,
-  6: H6,
+const getHeadingMap = () => {
+  const { h1, h2, h3, h4, h5, h6 } = getCustomMDXComponent();
+  return {
+    1: h1,
+    2: h2,
+    3: h3,
+    4: h4,
+    5: h5,
+    6: h6,
+  };
 };
 
 /**
@@ -28,7 +30,14 @@ export function FallbackHeading({
 }) {
   const titleSlug = title && slug(title.trim());
 
-  const Element = HEADING_MAP[level] || H1;
+  const Element = useMemo(() => {
+    const headingMap = getHeadingMap();
+    return headingMap[level] || headingMap[1];
+  }, [level]);
+
+  const A = useMemo(() => {
+    return getCustomMDXComponent().a;
+  }, []);
 
   return (
     titleSlug && (

packages/core/src/theme/components/Overview/OverviewGroup.tsx

@@ -1,8 +1,7 @@
 import { Link, renderInlineMarkdown } from '@theme';
 import './OverviewGroup.scss';
 import type { Header } from '@rspress/core';
-import { SvgWrapper } from '@theme';
-import { FallbackHeading } from '../DocContent/FallbackHeading';
+import { FallbackHeading, SvgWrapper } from '@theme';
 import IconPlugin from './icons/plugin.svg';
 
 export interface GroupItem {

packages/core/src/theme/components/Overview/index.tsx

@@ -10,9 +10,13 @@ import {
   usePageData,
   useSidebar,
 } from '@rspress/core/runtime';
-import { type Group, type GroupItem, OverviewGroup } from '@theme';
+import {
+  FallbackHeading,
+  type Group,
+  type GroupItem,
+  OverviewGroup,
+} from '@theme';
 import { useEffect, useMemo, useRef, useState } from 'react';
-import { FallbackHeading } from '../DocContent/FallbackHeading';
 import {
   isSidebarDivider,
   isSidebarSectionHeader,

packages/core/src/theme/index.ts

@@ -21,6 +21,7 @@ export { DocContent } from './components/DocContent/index';
 export { DocFooter } from './components/DocFooter/index';
 export { EditLink } from './components/EditLink/index';
 export { useEditLink } from './components/EditLink/useEditLink';
+export { FallbackHeading } from './components/FallbackHeading/index';
 export { HomeBackground } from './components/HomeBackground/index';
 export { HomeFeature } from './components/HomeFeature/index';
 export { HomeFooter } from './components/HomeFooter/index';