[Bug]: The document's sample code is of incorrect type

[markH5]

Version

System:win10 x64
Browsers:
npmPackages:pnpm 10.2.0

Details

https://rspress.dev/guide/advanced/custom-theme#3-custom-home-page-and-404-page
https://rspress.dev/zh/guide/advanced/custom-theme#3-%E8%87%AA%E5%AE%9A%E4%B9%89%E7%BB%84%E4%BB%B6

has some type error

Reproduce link

https://github.com/markH5/my_search_doc_err

Reproduce Steps

Setup 1

Install the dependencies:

pnpm create rspress@latest
pnpm i react
pnpm i react-dom

pnpm i typescript -D
pnpm i @types/react -D
pnpm i @types/react-dom -D

get

  "dependencies": {
    "react": "^19.0.0",
    "react-dom": "^19.0.0",
    "rspress": "^1.40.2"
  },
  "devDependencies": {
    "@types/node": "^18.11.17",
    "@types/react": "^19.0.8",
    "@types/react-dom": "^19.0.3",
    "typescript": "^5.7.3"
  }

Setup 2

copy code from doc https://rspress.dev/guide/advanced/custom-theme#3-custom-home-page-and-404-page

// theme/index.tsx
import Theme, { Search } from 'rspress/theme';

// Use slot
const Layout = () => <Theme.Layout beforeNavTitle={<div>some content</div>} />;
// Custom Home Page
const HomeLayout = () => <div>Home</div>;
// Custom 404 page
const NotFoundLayout = () => <div>404</div>;

export default {
  ...Theme,
  Layout,
  HomeLayout,
  NotFoundLayout,
};

// Custom Search Component
const MySearch = () => <div className="my-search">{Search}</div>;
export { MySearch as Search };
// re-export
export * from 'rspress/theme';

type error

hover at {Search} get ts type error

Type '() => Element' is not assignable to type 'ReactNode'. ts(2322)

[SoonIter]

- const MySearch = () => <div className="my-search">{Search}</div>;
+ const MySearch = () => <div className="my-search"><Search /></div>;

try this line, might be doc mistake

[markH5]

I guess so, it can work now, thank you.