feat(org): Ported components to mjs and named exports

sites/shared/mdx/compiler.js

@@ -1,55 +0,0 @@
-// MDX compiler
-import { compile } from '@mdx-js/mdx'
-
-// Remark plugins we want to use
-import remarkFrontmatter from 'remark-frontmatter'
-import remarkGfm from 'remark-gfm'
-import { remarkIntroPlugin } from './remark-intro-plugin.mjs'
-import smartypants from 'remark-smartypants'
-import mdxPluginToc from './mdx-plugin-toc.mjs'
-// Rehype plugins we want to use
-import rehypeHighlight from 'rehype-highlight'
-import rehypeAutolinkHeadings from 'rehype-autolink-headings'
-import rehypeSlug from 'rehype-slug'
-// Simple frontmatter extractor
-import frontmatter from 'front-matter'
-/*
- * Summary: Compiles the markdown it receives to MDX.
- *
- * @param (string) language - language to load (eg: 'en')
- * @param (string) site - site to load (either 'dev' or 'org')
- * @param (string) slug - slug of the page (eg: 'guides/patterns')
- *
- * @link https://mdxjs.com/guides/mdx-on-demand/
- *
- */
-const mdxCompiler = async (md) => {
-  const intro = []
-  const mdx = String(
-    await compile(md, {
-      outputFormat: 'function-body',
-      development: false,
-      remarkPlugins: [remarkFrontmatter, remarkGfm, smartypants, [remarkIntroPlugin, { intro }]],
-      rehypePlugins: [
-        [rehypeHighlight, { plainText: ['dot', 'http'] }],
-        rehypeSlug,
-        rehypeAutolinkHeadings,
-      ],
-    })
-  )
-
-  // This is not ideal as we're adding a second pass but for now it will do
-  // See: https://github.com/remarkjs/remark-toc/issues/37
-  const toc = String(
-    await compile(md, {
-      outputFormat: 'function-body',
-      development: false,
-      remarkPlugins: [remarkFrontmatter, remarkGfm, smartypants, mdxPluginToc],
-      rehypePlugins: [rehypeSlug],
-    })
-  )
-
-  return { mdx, intro, toc, frontmatter: frontmatter(md)?.attributes }
-}
-
-export default mdxCompiler