Using props for code title in mdx?

[FoxxMD]

The MDX and React docs page shows an example of importing an .mdx file and providing props, which are rendered in the mdx like:

<span>Hello {props.name}</span>

import PartialExample from './_markdown-partial-example.mdx';

<PartialExample name="Sebastien" />

However, this does seem to work for code title in code blocks:

My cool markdown/mdx is **here**.

```json5 title="{props.filename}.json"
{
    "data": {
        // ...
    }
}
```

import MyBlock from './myBlock.mdx';

<MyBlock filename={foo}/>

The rendered code block has the literal title {props.filename}.json

Using title={props.filename} produces a codeblock with no title at all.

This does work if I use the actual <CodeBlock> theme component but its way more verbose and the children content needs to be wrapped in quotes which makes it unparseable to my IDE (shows as plain text instead of codeblock syntax)

<CodeBlock
language="json5"
title={`${props.filename}.json`}>
{`{
    "data": {
        // ...
    }
    }
}`}
</CodeBlock>

Is it possible to use the normal codeblock markdown with title with props, as I want? Am I missing something about sytnax that would make this work?

[slorber]

It is not supported by default. It's not a Docusaurus limitation, but an MDX limitation, that I believe it here on purpose and make sense.

When using Markdown syntax like code blocks, JS expressions like ${props.filename} are not evaluated, only JSX elements allow you to use JS expressions. Markdown syntax is not for code, it's for content. And here, what you do is code, so you'd rather use JSX instead (MDX partial, or even a real React component)

If you want expressions like this to be evaluated, you would need to write a Remark plugin for MDX to add this behavior yourself. You may find this issue interesting: #395

[FoxxMD]

Thanks for the clarification and linked discussion