diff --git a/packages/mdx/lib/plugin/recma-document.js b/packages/mdx/lib/plugin/recma-document.js index a25e0009c..c3dd96ccd 100644 --- a/packages/mdx/lib/plugin/recma-document.js +++ b/packages/mdx/lib/plugin/recma-document.js @@ -241,7 +241,9 @@ export function recmaDocument(options) { child.expression.type === 'JSXFragment') ) { content = true - replacement.push(...createMdxContent(child.expression, Boolean(layout))) + replacement.push( + ...createMdxContent(child.expression, outputFormat, Boolean(layout)) + ) } else { // This catch-all branch is because plugins might add other things. // Normally, we only have import/export/jsx, but just add whatever’s @@ -252,7 +254,9 @@ export function recmaDocument(options) { // If there was no JSX content at all, add an empty function. if (!content) { - replacement.push(...createMdxContent(undefined, Boolean(layout))) + replacement.push( + ...createMdxContent(undefined, outputFormat, Boolean(layout)) + ) } exportedIdentifiers.push(['MDXContent', 'default']) @@ -305,11 +309,6 @@ export function recmaDocument(options) { ] } }) - } else { - replacement.push({ - type: 'ExportDefaultDeclaration', - declaration: {type: 'Identifier', name: 'MDXContent'} - }) } tree.body = replacement @@ -497,14 +496,16 @@ export function recmaDocument(options) { } /** - * @param {Readonly | undefined} [content] + * @param {Readonly | undefined} content * Content. + * @param {'function-body' | 'program'} outputFormat + * Output format. * @param {boolean | undefined} [hasInternalLayout=false] * Whether there’s an internal layout (default: `false`). - * @returns {Array} + * @returns {Array} * Functions. */ - function createMdxContent(content, hasInternalLayout) { + function createMdxContent(content, outputFormat, hasInternalLayout) { /** @type {JSXElement} */ const element = { type: 'JSXElement', @@ -597,6 +598,23 @@ export function recmaDocument(options) { } }) + /** @type {FunctionDeclaration} */ + const declaration = { + type: 'FunctionDeclaration', + id: {type: 'Identifier', name: 'MDXContent'}, + params: [ + { + type: 'AssignmentPattern', + left: {type: 'Identifier', name: 'props'}, + right: {type: 'ObjectExpression', properties: []} + } + ], + body: { + type: 'BlockStatement', + body: [{type: 'ReturnStatement', argument: result}] + } + } + return [ { type: 'FunctionDeclaration', @@ -615,21 +633,9 @@ export function recmaDocument(options) { ] } }, - { - type: 'FunctionDeclaration', - id: {type: 'Identifier', name: 'MDXContent'}, - params: [ - { - type: 'AssignmentPattern', - left: {type: 'Identifier', name: 'props'}, - right: {type: 'ObjectExpression', properties: []} - } - ], - body: { - type: 'BlockStatement', - body: [{type: 'ReturnStatement', argument: result}] - } - } + outputFormat === 'program' + ? {type: 'ExportDefaultDeclaration', declaration} + : declaration ] } } diff --git a/packages/mdx/readme.md b/packages/mdx/readme.md index af6ea2e81..eb9bf5152 100644 --- a/packages/mdx/readme.md +++ b/packages/mdx/readme.md @@ -520,8 +520,7 @@ Configuration for `createProcessor` (TypeScript type). import {Fragment as _Fragment, jsx as _jsx} from 'react/jsx-runtime' export {number} from 'https://a.full/data.js' function _createMdxContent(props) { /* … */ } - function MDXContent(props = {}) { /* … */ } - export default MDXContent + export default function MDXContent(props = {}) { /* … */ } ``` diff --git a/packages/mdx/test/compile.js b/packages/mdx/test/compile.js index e43920751..bf2bb606c 100644 --- a/packages/mdx/test/compile.js +++ b/packages/mdx/test/compile.js @@ -1058,11 +1058,10 @@ test('@mdx-js/mdx: compile (JSX)', async function (t) { ' };', ' return <_components.p><_components.em>{"a"};', '}', - 'function MDXContent(props = {}) {', + 'export default function MDXContent(props = {}) {', ' const {wrapper: MDXLayout} = props.components || ({});', ' return MDXLayout ? <_createMdxContent {...props} /> : _createMdxContent(props);', '}', - 'export default MDXContent;', '' ].join('\n') ) @@ -1076,11 +1075,10 @@ test('@mdx-js/mdx: compile (JSX)', async function (t) { 'function _createMdxContent(props) {', ' return ;', '}', - 'function MDXContent(props = {}) {', + 'export default function MDXContent(props = {}) {', ' const {wrapper: MDXLayout} = props.components || ({});', ' return MDXLayout ? <_createMdxContent {...props} /> : _createMdxContent(props);', '}', - 'export default MDXContent;', '' ].join('\n') ) @@ -1099,11 +1097,10 @@ test('@mdx-js/mdx: compile (JSX)', async function (t) { ' if (!c.d) _missingMdxReference("c.d", true);', ' return <><>;', '}', - 'function MDXContent(props = {}) {', + 'export default function MDXContent(props = {}) {', ' const {wrapper: MDXLayout} = props.components || ({});', ' return MDXLayout ? <_createMdxContent {...props} /> : _createMdxContent(props);', '}', - 'export default MDXContent;', 'function _missingMdxReference(id, component) {', ' throw new Error("Expected " + (component ? "component" : "object") + " `" + id + "` to be defined: you likely forgot to import, pass, or provide it.");', '}', @@ -1122,11 +1119,10 @@ test('@mdx-js/mdx: compile (JSX)', async function (t) { 'function _createMdxContent(props) {', ' return <><>{"a "}{}{" b"};', '}', - 'function MDXContent(props = {}) {', + 'export default function MDXContent(props = {}) {', ' const {wrapper: MDXLayout} = props.components || ({});', ' return MDXLayout ? <_createMdxContent {...props} /> : _createMdxContent(props);', '}', - 'export default MDXContent;', '' ].join('\n') ) @@ -1146,11 +1142,10 @@ test('@mdx-js/mdx: compile (JSX)', async function (t) { ' }, _component0 = _components["a-b"];', ' return <>{<_component0>};', '}', - 'function MDXContent(props = {}) {', + 'export default function MDXContent(props = {}) {', ' const {wrapper: MDXLayout} = props.components || ({});', ' return MDXLayout ? <_createMdxContent {...props} /> : _createMdxContent(props);', '}', - 'export default MDXContent;', '' ].join('\n') ) @@ -1169,11 +1164,10 @@ test('@mdx-js/mdx: compile (JSX)', async function (t) { ' };', ' return <_components.p>{"Hello "}{props.name};', '}', - 'function MDXContent(props = {}) {', + 'export default function MDXContent(props = {}) {', ' const {wrapper: MDXLayout} = props.components || ({});', ' return MDXLayout ? <_createMdxContent {...props} /> : _createMdxContent(props);', '}', - 'export default MDXContent;', '' ].join('\n') ) @@ -1201,10 +1195,9 @@ test('@mdx-js/mdx: compile (JSX)', async function (t) { ' };', ' return <_components.p>{"a"};', '}', - 'function MDXContent(props = {}) {', + 'export default function MDXContent(props = {}) {', ' return <_createMdxContent {...props} />;', '}', - 'export default MDXContent;', '' ].join('\n') ) @@ -1232,15 +1225,13 @@ test('@mdx-js/mdx: compile (JSX)', async function (t) { ' };', ' return <_components.p>{"a"};', '}', - 'function MDXContent(props = {}) {', + 'export default function MDXContent(props = {}) {', ' const {wrapper: MDXLayout} = {', ' ..._provideComponents(),', ' ...props.components', ' };', ' return MDXLayout ? <_createMdxContent {...props} /> : _createMdxContent(props);', - '}', - 'export default MDXContent;', '' ].join('\n') ) diff --git a/packages/mdx/test/syntax.js b/packages/mdx/test/syntax.js index ace1f4a80..43996a768 100644 --- a/packages/mdx/test/syntax.js +++ b/packages/mdx/test/syntax.js @@ -656,7 +656,7 @@ test('@mdx-js/mdx: syntax: MDX (JSX)', async function (t) { ' })', ' });', '}', - 'function MDXContent(props = {}) {', + 'export default function MDXContent(props = {}) {', ' const {wrapper: MDXLayout} = props.components || ({});', ' return MDXLayout ? _jsx(MDXLayout, {', ' ...props,', @@ -665,7 +665,6 @@ test('@mdx-js/mdx: syntax: MDX (JSX)', async function (t) { ' })', ' }) : _createMdxContent(props);', '}', - 'export default MDXContent;', '' ].join('\n') ) @@ -880,7 +879,7 @@ test('@mdx-js/mdx: syntax: MDX (ESM)', async function (t) { ' columnNumber: 1', ' }, this);', '}', - 'function MDXContent(props = {}) {', + 'export default function MDXContent(props = {}) {', ' const {wrapper: MDXLayout} = props.components || ({});', ' return MDXLayout ? _jsxDEV(MDXLayout, {', ' ...props,', @@ -893,7 +892,6 @@ test('@mdx-js/mdx: syntax: MDX (ESM)', async function (t) { ' fileName: "path/to/file.js"', ' }, this) : _createMdxContent(props);', '}', - 'export default MDXContent;', 'function _missingMdxReference(id, component, place) {', ' throw new Error("Expected " + (component ? "component" : "object") + " `" + id + "` to be defined: you likely forgot to import, pass, or provide it." + (place ? "\\nIt’s referenced in your code at `" + place + "` in `path/to/file.js`" : ""));', '}',