#2653·mdx

Do not create newline child when two MDX expressions are adjacent

Author: talatkuyukCreated Oct 26, 2025Updated Jun 1, 2026
Labels🤞 phase/open

Initial checklist

Affected package

remark-mdx or @mdx-js/mdx itself

Steps to reproduce

I created a basic CustomMDX component

typescript
import * as runtime from "react/jsx-runtime";
import { evaluate } from "@mdx-js/mdx";

interface CustomMDXProps {
  source: string;
  [key: string]: unknown;
}

export default async function CustomMDX({ source, ...rest }: CustomMDXProps) {
  const { default: MDXContent } = await evaluate(source, {
    ...runtime,
  });

  return <MDXContent {...rest} />;
}

It works fine. I supplied two props bar and foo, and I rendered it.

typescript
<CustomMDX source={source} bar="bar" foo="foo" />;

There is an unwanted new line \n in children depending to design of the source regarding with MDX expressions. I will explain below.

Actual behavior

If the source is # {props.foo} {props.bar} the children of h1 is [props.foo, " ", props.bar] it is okey.

If the source is **{props.foo} {props.bar}** the children of strong is [props.foo, " ", props.bar] it is okey.

If the source is {props.foo} {props.bar} the children is [props.foo, "\n", props.bar] the problem: newline instead of a space.

If the source is {props.foo}{props.bar} the children is [props.foo, "\n", props.bar] the problem: actually no space but a newline appeared.

If the source is {props.foo} xyz {props.bar} the children is [props.foo, " xyz ", props.bar] it is okey.

If the source is {props.foo}x{props.bar} the children is [props.foo, "x", props.bar] No space around x, it is okey.

Expected behavior

When the source is composed just from expressions like {props.foo} {props.bar} even without a text, the children should preserve the space instead of newline expecting [props.foo, " ", props.bar] instead of [props.foo, "\n", props.bar]

Runtime

node@24, @mdx-js/mdx@latest, react@latest

Package manager

npm@latest

Operating system

macos

Build and bundle tools

No response