From 1ee005b72011a75a0072ef25eab803bd337e7a44 Mon Sep 17 00:00:00 2001
From: Jesper Nellemann Jakobsen <jesper.nellemann@gmail.com>
Date: Sun, 10 Nov 2024 23:15:12 +0100
Subject: [PATCH] feat(#177): enable understanding of front matter
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

**Why:**

Some users add metadata to their Markdown files in the form of
YAML-style front matter and it currently gets treated as regular
content, which looks a bit odd when rendered on the page.

Instead, we would like to be able to identify front matter and not
render it to the page. Ideally we would like to make the metadata
available and/or optionally render it to the page in some way, but this
would require some reworking of the current setup.

**What:**

* Install `markdown-it-front-matter`[^1], which enables `markdown-it` to
  parse YAML-style front matter.
* Enable `markdown-it-front-matter` via `MarkdownIt.use()` like we do
  with other plugins.
  * **Note:** This doesn’t actually do anything other than enable
    `markdown-it` to recognise front matter and not treat it as regular
    content.

[^1]: https://github.com/ParkSB/markdown-it-front-matter

---

https://github.com/jannis-baum/Vivify/issues/177
---
 package.json           | 1 +
 src/parser/markdown.ts | 4 ++++
 yarn.lock              | 5 +++++
 3 files changed, 10 insertions(+)

diff --git a/package.json b/package.json
index f9c204d..4fc81ba 100644
--- a/package.json
+++ b/package.json
@@ -25,6 +25,7 @@
     "markdown-it-deflist": "^3.0.0",
     "markdown-it-emoji": "^3.0.0",
     "markdown-it-footnote": "^4.0.0",
+    "markdown-it-front-matter": "^0.2.4",
     "markdown-it-github-alerts": "^0.3.0",
     "markdown-it-inject-linenumbers": "^0.3.0",
     "markdown-it-mark": "^4.0.0",
diff --git a/src/parser/markdown.ts b/src/parser/markdown.ts
index 20eaafc..4783bc7 100644
--- a/src/parser/markdown.ts
+++ b/src/parser/markdown.ts
@@ -1,5 +1,6 @@
 import MarkdownIt from 'markdown-it';
 import anchor from 'markdown-it-anchor';
+import frontMatter from 'markdown-it-front-matter';
 import highlight from './highlight.js';
 import graphviz from './dot.js';
 import mermaid from './mermaid.js';
@@ -59,6 +60,9 @@ mdit.use(toc, config.tocOptions);
 
 // MARK: untyped plugins done
 
+// markdown-it-front-matter requires a callback function but we aren’t doing
+// anything with it, so we just pass in a noop.
+mdit.use(frontMatter, () => {});
 // anchor has to be added after attribute plugin for ids to work
 mdit.use(anchor, {
     permalink: anchor.permalink.ariaHidden({
diff --git a/yarn.lock b/yarn.lock
index 59ef252..bb34144 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2190,6 +2190,11 @@ markdown-it-footnote@^4.0.0:
   resolved "https://registry.yarnpkg.com/markdown-it-footnote/-/markdown-it-footnote-4.0.0.tgz#02ede0cb68a42d7e7774c3abdc72d77aaa24c531"
   integrity sha512-WYJ7urf+khJYl3DqofQpYfEYkZKbmXmwxQV8c8mO/hGIhgZ1wOe7R4HLFNwqx7TjILbnC98fuyeSsin19JdFcQ==
 
+markdown-it-front-matter@^0.2.4:
+  version "0.2.4"
+  resolved "https://registry.yarnpkg.com/markdown-it-front-matter/-/markdown-it-front-matter-0.2.4.tgz#cf29bc8222149b53575699357b1ece697bf39507"
+  integrity sha512-25GUs0yjS2hLl8zAemVndeEzThB1p42yxuDEKbd4JlL3jiz+jsm6e56Ya8B0VREOkNxLYB4TTwaoPJ3ElMmW+w==
+
 markdown-it-github-alerts@^0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/markdown-it-github-alerts/-/markdown-it-github-alerts-0.3.0.tgz#acab7db57f4e204c8d1c987403c367738d7026b0"