transformContentExport() — astro Function Reference

Architecture documentation for the transformContentExport() function in vite-plugin-mdx-postprocess.ts from the astro codebase.

Function typescript CoreAstro RoutingSystem called by 1

Entity Profile

CoreAstro→ RoutingSystem→ transformContentExport() — astro Function Reference

Dependency Diagram

graph TD
  b77f121d_86c3_57e6_dbc0_088f4a6a6208["transformContentExport()"]
  1d16286a_a608_ecf0_1939_33200eaee4a0["vite-plugin-mdx-postprocess.ts"]
  b77f121d_86c3_57e6_dbc0_088f4a6a6208 -->|defined in| 1d16286a_a608_ecf0_1939_33200eaee4a0
  41ea6fc9_a90c_0a26_da48_58217361f433["vitePluginMdxPostprocess()"]
  41ea6fc9_a90c_0a26_da48_58217361f433 -->|calls| b77f121d_86c3_57e6_dbc0_088f4a6a6208
  style b77f121d_86c3_57e6_dbc0_088f4a6a6208 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/integrations/mdx/src/vite-plugin-mdx-postprocess.ts lines 76–103

function transformContentExport(code: string, exports: readonly ExportSpecifier[]) {
	if (exports.find(({ n }) => n === 'Content')) return code;

	// If have `export const components`, pass that as props to `Content` as fallback
	const hasComponents = exports.find(({ n }) => n === 'components');
	const usesAstroImage = exports.find(({ n }) => n === USES_ASTRO_IMAGE_FLAG);

	// Generate code for the `components` prop passed to `MDXContent`
	let componentsCode = `{ Fragment: _Fragment${
		hasComponents ? ', ...components' : ''
	}, ...props.components,`;
	if (usesAstroImage) {
		componentsCode += ` ${JSON.stringify(ASTRO_IMAGE_ELEMENT)}: ${
			hasComponents ? 'components.img ?? ' : ''
		} props.components?.img ?? ${ASTRO_IMAGE_IMPORT}`;
	}
	componentsCode += ' }';

	// Make `Content` the default export so we can wrap `MDXContent` and pass in `Fragment`
	code = code.replace('export default function MDXContent', 'function MDXContent');
	code += `
export const Content = (props = {}) => MDXContent({
  ...props,
  components: ${componentsCode},
});
export default Content;`;
	return code;
}