Add mdx language

[remcohaszing]

This is an initial attempt to add MDX language support to Monaco editor. MDX is a language which extends markdown by allowing the use of JSX and ecmascript imports and exports.

I am having some issues implementing this though. Some help would be greatly appreciated.

I’ve been using the following code for testing:

import { MyComponent } from './MyComponent'

This is **bold {1 + 2} text**

# Hello MDX

{'foo' + 1 + 2}

{/* this is a comment */}

<MyComponent asd="text-green-700" foo='bar' asd={1 + 4}>

  This is **also** markdown.

</MyComponent>

• The JSX component highlighting is broken due to the props. If they are removed, highlighting is fixed. Fixed
• Is is possible to highlight the JavaScript expression inside the bold markdown text? Yep, done
• If I add the following JavaScript expression {1 + {}}, an error is thrown: Error: mdx: cannot pop embedded language if not inside one No longer throws, but the closing bracket does exit the javascript embedded language.

I think it’s very much usable in the current state.

[remcohaszing]

This includes syntax highlighting for JSX. It may be useful to backport these to javascript and typescript, or create new languages javascriptreact and typescriptreact to match VSCode behaviour. (#264)

This also includes some more advanced markdown features currently not available in the markdown language, such as frontmatter of nesting inline content (e.g. emphasis inside bold inside a header). It may be useful to port these to markdown too.

[hediet]

Thanks for your PR! I left a comment. Especially for third party contributions, tests are crucial!

[remcohaszing]

Sorry it took so long, but I added some tests!

[grandsmarquis]

Hello, is there any update?