Add use of tla in docs

Author: wooorm

docs/docs/getting-started.server.mdx

@@ -665,11 +665,7 @@ on how to use MDX with React Static.
   ```js path="example.js"
   import {compile} from '@mdx-js/mdx'
 
-  main()
-
-  async function main() {
-    const js = String(await compile('# hi', {jsxImportSource: '@emotion/react', /* otherOptions… */}))
-  }
+  const js = String(await compile('# hi', {jsxImportSource: '@emotion/react', /* otherOptions… */}))
   ```
 </details>
 
@@ -731,11 +727,7 @@ more info.
   ```js path="example.js"
   import {compile} from '@mdx-js/mdx'
 
-  main()
-
-  async function main() {
-    const js = String(await compile('# hi', {jsxImportSource: 'preact', /* otherOptions… */}))
-  }
+  const js = String(await compile('# hi', {jsxImportSource: 'preact', /* otherOptions… */}))
   ```
 </details>
 
@@ -811,11 +803,7 @@ info.
   ```js path="example.js"
   import {compile} from '@mdx-js/mdx'
 
-  main()
-
-  async function main() {
-    const js = String(await compile('# hi', {jsxImportSource: 'svelte-jsx', /* otherOptions… */}))
-  }
+  const js = String(await compile('# hi', {jsxImportSource: 'svelte-jsx', /* otherOptions… */}))
   ```
 </details>
 
@@ -835,12 +823,8 @@ which you might be using, for more info.
   import {compile} from '@mdx-js/mdx'
   import babel from '@babel/core'
 
-  main()
-
-  async function main() {
-    const jsx = String(await compile('# hi', {jsx: true, /* otherOptions… */}))
-    const js = (await babel.transformAsync(jsx, {plugins: ['@vue/babel-plugin-jsx']})).code
-  }
+  const jsx = String(await compile('# hi', {jsx: true, /* otherOptions… */}))
+  const js = (await babel.transformAsync(jsx, {plugins: ['@vue/babel-plugin-jsx']})).code
   ```
 </details>
 

docs/guides/embed.server.mdx

@@ -4,7 +4,7 @@ export const info = {
     {name: 'Titus Wormer', github: 'wooorm', twitter: 'wooorm'}
   ],
   published: new Date('2021-10-06'),
-  modified: new Date('2021-11-01')
+  modified: new Date('2022-06-17')
 }
 
 # Embed
@@ -35,21 +35,19 @@ import fauxOembedTransformer from '@remark-embedder/transformer-oembed'
 const remarkEmbedder = fauxRemarkEmbedder.default
 const oembedTransformer = fauxOembedTransformer.default
 
-main(`
+const code = `
 Check out this video:
 
 https://www.youtube.com/watch?v=dQw4w9WgXcQ
-`)
-
-async function main(code) {
-  console.log(
-    String(
-      await compile(code, {
-        remarkPlugins: [[remarkEmbedder, {transformers: [oembedTransformer]}]]
-      })
-    )
+`
+
+console.log(
+  String(
+    await compile(code, {
+      remarkPlugins: [[remarkEmbedder, {transformers: [oembedTransformer]}]]
+    })
   )
-}
+)
 ```
 
 <details>

docs/guides/frontmatter.server.mdx

@@ -4,7 +4,7 @@ export const info = {
     {name: 'Titus Wormer', github: 'wooorm', twitter: 'wooorm'}
   ],
   published: new Date('2021-10-06'),
-  modified: new Date('2021-11-01')
+  modified: new Date('2022-06-17')
 }
 
 # Frontmatter
@@ -50,12 +50,8 @@ Then without compiling or evaluating the metadata can be accessed like so:
 import {promises as fs} from 'node:fs'
 import yaml from 'js-yaml'
 
-main()
-
-async function main() {
-  console.log(yaml.loadAll(await fs.readFile('post.mdx'))[0])
-  // Prints `{title: 'Hi, World!'}`
-}
+console.log(yaml.loadAll(await fs.readFile('post.mdx'))[0])
+// Prints `{title: 'Hi, World!'}`
 ```
 
 Our compiler, `@mdx-js/mdx`, doesn’t understand YAML frontmatter by default but
@@ -67,15 +63,11 @@ import {promises as fs} from 'node:fs'
 import remarkFrontmatter from 'remark-frontmatter'
 import {compile} from '@mdx-js/mdx'
 
-main()
-
-async function main() {
-  console.log(
-    await compile(await fs.readFile('post.mdx'), {
-      remarkPlugins: [remarkFrontmatter]
-    })
-  )
-}
+console.log(
+  await compile(await fs.readFile('post.mdx'), {
+    remarkPlugins: [remarkFrontmatter]
+  })
+)
 ```
 
 Now it “works”.

docs/guides/gfm.server.mdx

@@ -4,7 +4,7 @@ export const info = {
     {name: 'Titus Wormer', github: 'wooorm', twitter: 'wooorm'}
   ],
   published: new Date('2021-10-06'),
-  modified: new Date('2021-11-01')
+  modified: new Date('2022-06-17')
 }
 
 # GitHub flavored markdown (GFM)
@@ -55,15 +55,11 @@ import {promises as fs} from 'node:fs'
 import {compile} from '@mdx-js/mdx'
 import remarkGfm from 'remark-gfm'
 
-main()
-
-async function main() {
-  console.log(
-    String(
-      await compile(await fs.readFile('example.mdx'), {remarkPlugins: [remarkGfm]})
-    )
+console.log(
+  String(
+    await compile(await fs.readFile('example.mdx'), {remarkPlugins: [remarkGfm]})
   )
-}
+)
 ```
 
 <details>

docs/guides/math.server.mdx

@@ -5,7 +5,7 @@ export const info = {
     {name: 'Titus Wormer', github: 'wooorm', twitter: 'wooorm'}
   ],
   published: new Date('2021-10-06'),
-  modified: new Date('2022-02-01')
+  modified: new Date('2022-06-17')
 }
 
 # Math
@@ -36,18 +36,14 @@ import {compile} from '@mdx-js/mdx'
 import rehypeKatex from 'rehype-katex'
 import remarkMath from 'remark-math'
 
-main()
-
-async function main() {
-  console.log(
-    String(
-      await compile(await fs.readFile('example.mdx'), {
-        remarkPlugins: [remarkMath],
-        rehypePlugins: [rehypeKatex]
-      })
-    )
+console.log(
+  String(
+    await compile(await fs.readFile('example.mdx'), {
+      remarkPlugins: [remarkMath],
+      rehypePlugins: [rehypeKatex]
+    })
   )
-}
+)
 ```
 
 <details>

docs/guides/syntax-highlighting.server.mdx

@@ -5,7 +5,7 @@ export const info = {
     {name: 'Titus Wormer', github: 'wooorm', twitter: 'wooorm'}
   ],
   published: new Date('2021-10-06'),
-  modified: new Date('2022-02-01')
+  modified: new Date('2022-06-17')
 }
 
 # Syntax highlighting
@@ -35,15 +35,13 @@ Use either [`rehype-highlight`][rehype-highlight]
 import rehypeHighlight from 'rehype-highlight'
 import {compile} from '@mdx-js/mdx'
 
-main(`~~~js
+const code = `~~~js
 console.log(1)
-~~~`)
+~~~`
 
-async function main(code) {
-  console.log(
-    String(await compile(code, {rehypePlugins: [rehypeHighlight]}))
-  )
-}
+console.log(
+  String(await compile(code, {rehypePlugins: [rehypeHighlight]}))
+)
 ```
 
 <details>

packages/mdx/readme.md

@@ -78,12 +78,9 @@ Add some code in `example.js` to compile `example.mdx` to JavaScript:
 import {promises as fs} from 'node:fs'
 import {compile} from '@mdx-js/mdx'
 
-main()
+const compiled = await compile(await fs.readFile('example.mdx'))
 
-async function main() {
-  const compiled = await compile(await fs.readFile('example.mdx'))
-  console.log(String(compiled))
-}
+console.log(String(compiled))
 ```
 
 Yields roughly:
@@ -285,12 +282,10 @@ A module `example.js`:
 ```js
 import {compile} from '@mdx-js/mdx'
 
-main('export const no = 3.14\n\n# hi {no}')
+const code = 'export const no = 3.14\n\n# hi {no}'
 
-async function main(code) {
-  console.log(String(await compile(code, {outputFormat: 'program'}))) // Default
-  console.log(String(await compile(code, {outputFormat: 'function-body'})))
-}
+console.log(String(await compile(code, {outputFormat: 'program'}))) // Default
+console.log(String(await compile(code, {outputFormat: 'function-body'})))
 ```
 
 …yields:
@@ -383,13 +378,10 @@ Say we have a module `example.js`:
 ```js
 import {compile} from '@mdx-js/mdx'
 
-main()
+const code = 'export {number} from "./data.js"\n\n# hi'
+const baseUrl = 'https://a.full/url' // Typically `import.meta.url`
 
-async function main() {
-  const code = 'export {number} from "./data.js"\n\n# hi'
-  const baseUrl = 'https://a.full/url' // Typically `import.meta.url`
-  console.log(String(await compile(code, {baseUrl})))
-}
+console.log(String(await compile(code, {baseUrl})))
 ```
 
 …now running `node example.js` yields:
@@ -428,14 +420,11 @@ import {promises as fs} from 'node:fs'
 import * as runtime from 'react/jsx-runtime'
 import {evaluate} from '@mdx-js/mdx'
 
-main()
+const path = 'example.mdx'
+const value = await fs.readFile(path)
+const MDXContent = (await evaluate({path, value}, runtime)).default
 
-async function main() {
-  const path = 'example.mdx'
-  const value = await fs.readFile(path)
-  const MDXContent = (await evaluate({path, value}, runtime)).default
-  console.log(MDXContent())
-}
+console.log(MDXContent())
 ```
 
 Running that would normally (production) yield:
@@ -451,14 +440,12 @@ Error: Expected component `NoteIcon` to be defined: you likely forgot to import,
 But if we change add `development: true` to our example:
 
 ```diff
-@@ -7,6 +7,6 @@ main()
- async function main() {
-   const path = 'example.mdx'
-   const value = await fs.readFile(path)
--  const MDXContent = (await evaluate({path, value}, runtime)).default
-+  const MDXContent = (await evaluate({path, value}, {development: true, ...runtime})).default
-   console.log(MDXContent({}))
- }
+@@ -7,6 +7,6 @@
+ const path = 'example.mdx'
+ const value = await fs.readFile(path)
+-const MDXContent = (await evaluate({path, value}, runtime)).default
++const MDXContent = (await evaluate({path, value}, {development: true, ...runtime})).default
+ console.log(MDXContent({}))
 ```
 
 And we’d run it again, we’d get:
@@ -491,16 +478,12 @@ import {promises as fs} from 'node:fs'
 import {SourceMapGenerator} from 'source-map'
 import {compile} from '@mdx-js/mdx'
 
-main()
-
-async function main() {
-  const file = await compile(
-    {path: 'example.mdx', value: await fs.readFile('example.mdx')},
-    {SourceMapGenerator}
-  )
+const file = await compile(
+  {path: 'example.mdx', value: await fs.readFile('example.mdx')},
+  {SourceMapGenerator}
+)
 
-  console.log(file.map)
-}
+console.log(file.map)
 ```
 
 …yields:
@@ -724,12 +707,9 @@ import remarkPresetLintConsistent from 'remark-preset-lint-consistent' // Lint r
 import {reporter} from 'vfile-reporter'
 import {compile} from '@mdx-js/mdx'
 
-main()
+const file = await compile('*like this* or _like this_?', {remarkPlugins: [remarkPresetLintConsistent]})
 
-async function main() {
-  const file = await compile('*like this* or _like this_?', {remarkPlugins: [remarkPresetLintConsistent]})
-  console.error(reporter(file))
-}
+console.error(reporter(file))
 ```
 
 Yields: