feat: add grayMatterOptions (#75)

* feat: add `grayMatterOptions`

* docs: update the docs

* tests: remove optional chaining for node 12

* tests: use c8 to generate coverage

Author: Arcath

README.md

@@ -451,6 +451,33 @@ const result = await bundleMDX(mdxSource, {
 const {code, frontmatter} = result
 ```
 
+#### grayMatterOptions
+
+This allows you to configure the
+[gray-matter options](https://github.com/jonschlinkert/gray-matter#options).
+
+Your function is passed the current gray-matter configuration for you to modify.
+Return your modified configuration object for gray matter.
+
+```js
+bundleMDX(mdxString, {
+  grayMatterOptions: options => {
+    options.excerpt = true
+
+    return options
+  },
+})
+```
+
+### Returns
+
+`bundleMDX` returns a promise for an object with the following properties.
+
+- `code` - The bundle of your mdx as a `string`.
+- `frontmatter` - The frontmatter `object` from gray-matter.
+- `matter` - The whole
+  [object returned by gray-matter](https://github.com/jonschlinkert/gray-matter#returned-object)
+
 ### Component Substitution
 
 MDX Bundler passes on

package.json

@@ -35,7 +35,7 @@
     "postbuild": "node ./other/cjs-ify.js",
     "lint": "kcd-scripts lint",
     "setup": "npm install && npm run validate -s",
-    "test": "uvu -i setup-tests.js src/__tests__",
+    "test": "c8 -r text -r lcov uvu -i setup-tests.js src/__tests__",
     "typecheck": "kcd-scripts typecheck",
     "validate": "kcd-scripts validate"
   },
@@ -58,6 +58,7 @@
     "@types/react": "^17.0.14",
     "@types/react-dom": "^17.0.9",
     "@types/uuid": "^8.3.1",
+    "c8": "^7.8.0",
     "cross-env": "^7.0.3",
     "esbuild": "^0.12.15",
     "jsdom": "^16.6.0",

src/__tests__/index.js

@@ -474,4 +474,30 @@ export default Demo
   assert.match(container.innerHTML, 'Portal!')
 })
 
+test('should allow gray matter options to be accessed', async () => {
+  const mdxSource = `
+---
+title: Sample
+date: 2021-07-27
+---
+
+Some excerpt
+
+---
+
+This is the rest of the content
+
+  `.trim()
+
+  const {matter} = await bundleMDX(mdxSource, {
+    grayMatterOptions: options => {
+      options.excerpt = true
+
+      return options
+    },
+  })
+
+  assert.equal((matter.excerpt ? matter.excerpt : '').trim(), 'Some excerpt')
+})
+
 test.run()

src/index.js

@@ -3,7 +3,7 @@ import path from 'path'
 import {StringDecoder} from 'string_decoder'
 import remarkFrontmatter from 'remark-frontmatter'
 import {remarkMdxFrontmatter} from 'remark-mdx-frontmatter'
-import matter from 'gray-matter'
+import grayMatter from 'gray-matter'
 import * as esbuild from 'esbuild'
 import {NodeResolvePlugin} from '@esbuild-plugins/node-resolve'
 import {globalExternals} from '@fal-works/esbuild-plugin-global-externals'
@@ -26,21 +26,24 @@ async function bundleMDX(
     esbuildOptions = options => options,
     globals = {},
     cwd = path.join(process.cwd(), `__mdx_bundler_fake_dir__`),
+    grayMatterOptions = options => options
   } = {},
 ) {
+  /* c8 ignore start */
   if (dirnameMessedUp && !process.env.ESBUILD_BINARY_PATH) {
     console.warn(
       `mdx-bundler warning: esbuild maybe unable to find its binary, if your build fails you'll need to set ESBUILD_BINARY_PATH. Learn more: https://github.com/kentcdodds/mdx-bundler/blob/main/README.md#nextjs-esbuild-enoent`,
     )
   }
+  /* c8 ignore stop */
 
   // xdm is a native ESM, and we're running in a CJS context. This is the
   // only way to import ESM within CJS
   const [{default: xdmESBuild}] = await Promise.all([
     await import('xdm/esbuild.js'),
   ])
   // extract the frontmatter
-  const {data: frontmatter} = matter(mdxSource)
+  const matter = grayMatter(mdxSource, grayMatterOptions({}))
 
   const entryPath = path.join(cwd, `./_mdx_bundler_entry_point-${uuid()}.mdx`)
 
@@ -174,8 +177,9 @@ async function bundleMDX(
 
     return {
       code: `${code};return Component.default;`,
-      frontmatter,
+      frontmatter: matter.data,
       errors: bundled.errors,
+      matter
     }
   }
 
@@ -192,8 +196,9 @@ async function bundleMDX(
 
     return {
       code: `${code};return Component.default;`,
-      frontmatter,
+      frontmatter: matter.data,
       errors: bundled.errors,
+      matter
     }
   }
 

src/types.d.ts

@@ -7,6 +7,7 @@
 import type {Plugin, BuildOptions, Loader} from 'esbuild'
 import type {ModuleInfo} from '@fal-works/esbuild-plugin-global-externals'
 import type {CoreProcessorOptions} from 'xdm/lib/compile'
+import type {GrayMatterOption, Input} from 'gray-matter'
 
 type ESBuildOptions = BuildOptions
 
@@ -117,4 +118,21 @@ type BundleMDXOptions = {
    * ```
    */
   cwd?: string
+  /**
+   * This allows you to configure the gray matter options.
+   *
+   * @example
+   * ```
+   * bundleMDX(mdxString, {
+   *   grayMatterOptions: (options) => {
+   *     options.excerpt = true
+   *
+   *     return options
+   *   }
+   * })
+   * ```
+   */
+  grayMatterOptions?: <I extends Input>(
+    options: GrayMatterOption<I, any>,
+  ) => GrayMatterOption<I, any>
 }