docs: add MDX 3 community plugin

src/languages/mdx.md

@@ -7,9 +7,11 @@ eleventyNavigation:
   order: 16
 ---
 
-[MDX](https://mdxjs.com) is a variant of [Markdown](https://daringfireball.net/projects/markdown/) that compiles to JSX, and supports embedding interactive components inside Markdown documents. Parcel supports MDX automatically using the `@parcel/transformer-mdx` plugin. When a `.mdx` file is detected, it will be installed into your project automatically.
+[MDX](https://mdxjs.com) is a variant of [Markdown](https://daringfireball.net/projects/markdown/) that compiles to JSX, and supports embedding interactive components inside Markdown documents.
 
-## Example usage
+## MDX v1 usage
+
+Parcel supports MDX v1 automatically using the `@parcel/transformer-mdx` plugin. When a `.mdx` file is detected, it will be installed into your project automatically.
 
 First, install `@mdx-js/react`. This is needed to render MDX files as React components.
 
@@ -23,7 +25,7 @@ Then, you can import a `.mdx` file into your JavaScript and render it using Reac
 {% samplefile "app.js" %}
 
 ```js
-import Hello from './hello.mdx';
+import Hello from "./hello.mdx";
 
 export function App() {
   return <Hello />;
@@ -41,3 +43,32 @@ This is a pretty cool MDX file.
 
 {% endsamplefile %}
 {% endsample %}
+
+## MDX v3 usage
+
+If you're using MDX v3, you can use the community plugin [`parcel-transformer-mdx`](https://www.npmjs.com/package/parcel-transformer-mdx).
+
+### Installation
+
+```shell
+npm i @parcel/config-default parcel-transformer-mdx -D
+```
+
+### Configuration
+
+{% sample %}
+{% samplefile ".parcelrc" %}
+
+```json
+{
+  "extends": "@parcel/config-default",
+  "transformers": {
+    "*.{md,mdx}": ["parcel-transformer-mdx"]
+  }
+}
+```
+
+{% endsamplefile %}
+{% endsample %}
+
+[1]: https://img.shields.io/librariesio/github/EasyWebApp/Parcel-transformer-MDX.svg