refactor(core): swizzle wrap should use ReactNode instead of JSX.Element (#10747)

This commit is contained in:
Sébastien Lorber 2024-12-06 18:24:18 +01:00 committed by GitHub
parent f9825af43e
commit 4966dce36e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 16 additions and 16 deletions

View file

@ -43,14 +43,14 @@ export default function FirstLevelComponentWrapper(props) {
`; `;
exports[`wrap TypeScript wrap ComponentInFolder 2`] = ` exports[`wrap TypeScript wrap ComponentInFolder 2`] = `
"import React from 'react'; "import React, {type ReactNode} from 'react';
import ComponentInFolder from '@theme-original/ComponentInFolder'; import ComponentInFolder from '@theme-original/ComponentInFolder';
import type ComponentInFolderType from '@theme/ComponentInFolder'; import type ComponentInFolderType from '@theme/ComponentInFolder';
import type {WrapperProps} from '@docusaurus/types'; import type {WrapperProps} from '@docusaurus/types';
type Props = WrapperProps<typeof ComponentInFolderType>; type Props = WrapperProps<typeof ComponentInFolderType>;
export default function ComponentInFolderWrapper(props: Props): JSX.Element { export default function ComponentInFolderWrapper(props: Props): ReactNode {
return ( return (
<> <>
<ComponentInFolder {...props} /> <ComponentInFolder {...props} />
@ -61,14 +61,14 @@ export default function ComponentInFolderWrapper(props: Props): JSX.Element {
`; `;
exports[`wrap TypeScript wrap ComponentInFolder/ComponentInSubFolder 2`] = ` exports[`wrap TypeScript wrap ComponentInFolder/ComponentInSubFolder 2`] = `
"import React from 'react'; "import React, {type ReactNode} from 'react';
import ComponentInSubFolder from '@theme-original/ComponentInFolder/ComponentInSubFolder'; import ComponentInSubFolder from '@theme-original/ComponentInFolder/ComponentInSubFolder';
import type ComponentInSubFolderType from '@theme/ComponentInFolder/ComponentInSubFolder'; import type ComponentInSubFolderType from '@theme/ComponentInFolder/ComponentInSubFolder';
import type {WrapperProps} from '@docusaurus/types'; import type {WrapperProps} from '@docusaurus/types';
type Props = WrapperProps<typeof ComponentInSubFolderType>; type Props = WrapperProps<typeof ComponentInSubFolderType>;
export default function ComponentInSubFolderWrapper(props: Props): JSX.Element { export default function ComponentInSubFolderWrapper(props: Props): ReactNode {
return ( return (
<> <>
<ComponentInSubFolder {...props} /> <ComponentInSubFolder {...props} />
@ -79,14 +79,14 @@ export default function ComponentInSubFolderWrapper(props: Props): JSX.Element {
`; `;
exports[`wrap TypeScript wrap FirstLevelComponent 2`] = ` exports[`wrap TypeScript wrap FirstLevelComponent 2`] = `
"import React from 'react'; "import React, {type ReactNode} from 'react';
import FirstLevelComponent from '@theme-original/FirstLevelComponent'; import FirstLevelComponent from '@theme-original/FirstLevelComponent';
import type FirstLevelComponentType from '@theme/FirstLevelComponent'; import type FirstLevelComponentType from '@theme/FirstLevelComponent';
import type {WrapperProps} from '@docusaurus/types'; import type {WrapperProps} from '@docusaurus/types';
type Props = WrapperProps<typeof FirstLevelComponentType>; type Props = WrapperProps<typeof FirstLevelComponentType>;
export default function FirstLevelComponentWrapper(props: Props): JSX.Element { export default function FirstLevelComponentWrapper(props: Props): ReactNode {
return ( return (
<> <>
<FirstLevelComponent {...props} /> <FirstLevelComponent {...props} />

View file

@ -283,14 +283,14 @@ exports[`swizzle wrap ComponentInFolder JS: theme dir tree 1`] = `
`; `;
exports[`swizzle wrap ComponentInFolder TS: ComponentInFolder/index.tsx 1`] = ` exports[`swizzle wrap ComponentInFolder TS: ComponentInFolder/index.tsx 1`] = `
"import React from 'react'; "import React, {type ReactNode} from 'react';
import ComponentInFolder from '@theme-original/ComponentInFolder'; import ComponentInFolder from '@theme-original/ComponentInFolder';
import type ComponentInFolderType from '@theme/ComponentInFolder'; import type ComponentInFolderType from '@theme/ComponentInFolder';
import type {WrapperProps} from '@docusaurus/types'; import type {WrapperProps} from '@docusaurus/types';
type Props = WrapperProps<typeof ComponentInFolderType>; type Props = WrapperProps<typeof ComponentInFolderType>;
export default function ComponentInFolderWrapper(props: Props): JSX.Element { export default function ComponentInFolderWrapper(props: Props): ReactNode {
return ( return (
<> <>
<ComponentInFolder {...props} /> <ComponentInFolder {...props} />
@ -328,14 +328,14 @@ exports[`swizzle wrap ComponentInFolder/ComponentInSubFolder JS: theme dir tree
`; `;
exports[`swizzle wrap ComponentInFolder/ComponentInSubFolder TS: ComponentInFolder/ComponentInSubFolder/index.tsx 1`] = ` exports[`swizzle wrap ComponentInFolder/ComponentInSubFolder TS: ComponentInFolder/ComponentInSubFolder/index.tsx 1`] = `
"import React from 'react'; "import React, {type ReactNode} from 'react';
import ComponentInSubFolder from '@theme-original/ComponentInFolder/ComponentInSubFolder'; import ComponentInSubFolder from '@theme-original/ComponentInFolder/ComponentInSubFolder';
import type ComponentInSubFolderType from '@theme/ComponentInFolder/ComponentInSubFolder'; import type ComponentInSubFolderType from '@theme/ComponentInFolder/ComponentInSubFolder';
import type {WrapperProps} from '@docusaurus/types'; import type {WrapperProps} from '@docusaurus/types';
type Props = WrapperProps<typeof ComponentInSubFolderType>; type Props = WrapperProps<typeof ComponentInSubFolderType>;
export default function ComponentInSubFolderWrapper(props: Props): JSX.Element { export default function ComponentInSubFolderWrapper(props: Props): ReactNode {
return ( return (
<> <>
<ComponentInSubFolder {...props} /> <ComponentInSubFolder {...props} />
@ -373,14 +373,14 @@ exports[`swizzle wrap ComponentInFolder/Sibling JS: theme dir tree 1`] = `
`; `;
exports[`swizzle wrap ComponentInFolder/Sibling TS: ComponentInFolder/Sibling.tsx 1`] = ` exports[`swizzle wrap ComponentInFolder/Sibling TS: ComponentInFolder/Sibling.tsx 1`] = `
"import React from 'react'; "import React, {type ReactNode} from 'react';
import Sibling from '@theme-original/ComponentInFolder/Sibling'; import Sibling from '@theme-original/ComponentInFolder/Sibling';
import type SiblingType from '@theme/ComponentInFolder/Sibling'; import type SiblingType from '@theme/ComponentInFolder/Sibling';
import type {WrapperProps} from '@docusaurus/types'; import type {WrapperProps} from '@docusaurus/types';
type Props = WrapperProps<typeof SiblingType>; type Props = WrapperProps<typeof SiblingType>;
export default function SiblingWrapper(props: Props): JSX.Element { export default function SiblingWrapper(props: Props): ReactNode {
return ( return (
<> <>
<Sibling {...props} /> <Sibling {...props} />
@ -416,14 +416,14 @@ exports[`swizzle wrap FirstLevelComponent JS: theme dir tree 1`] = `
`; `;
exports[`swizzle wrap FirstLevelComponent TS: FirstLevelComponent.tsx 1`] = ` exports[`swizzle wrap FirstLevelComponent TS: FirstLevelComponent.tsx 1`] = `
"import React from 'react'; "import React, {type ReactNode} from 'react';
import FirstLevelComponent from '@theme-original/FirstLevelComponent'; import FirstLevelComponent from '@theme-original/FirstLevelComponent';
import type FirstLevelComponentType from '@theme/FirstLevelComponent'; import type FirstLevelComponentType from '@theme/FirstLevelComponent';
import type {WrapperProps} from '@docusaurus/types'; import type {WrapperProps} from '@docusaurus/types';
type Props = WrapperProps<typeof FirstLevelComponentType>; type Props = WrapperProps<typeof FirstLevelComponentType>;
export default function FirstLevelComponentWrapper(props: Props): JSX.Element { export default function FirstLevelComponentWrapper(props: Props): ReactNode {
return ( return (
<> <>
<FirstLevelComponent {...props} /> <FirstLevelComponent {...props} />

View file

@ -128,14 +128,14 @@ export async function wrap({
const toPath = path.resolve(siteDir, THEME_PATH, wrapperFileName); const toPath = path.resolve(siteDir, THEME_PATH, wrapperFileName);
const content = typescript const content = typescript
? `import React from 'react'; ? `import React, {type ReactNode} from 'react';
import ${componentName} from '@theme-${importType}/${themeComponentName}'; import ${componentName} from '@theme-${importType}/${themeComponentName}';
import type ${componentName}Type from '@theme/${themeComponentName}'; import type ${componentName}Type from '@theme/${themeComponentName}';
import type {WrapperProps} from '@docusaurus/types'; import type {WrapperProps} from '@docusaurus/types';
type Props = WrapperProps<typeof ${componentName}Type>; type Props = WrapperProps<typeof ${componentName}Type>;
export default function ${wrapperComponentName}(props: Props): JSX.Element { export default function ${wrapperComponentName}(props: Props): ReactNode {
return ( return (
<> <>
<${componentName} {...props} /> <${componentName} {...props} />