From 969595783fde856d6b65df0b54996de40aaa8a0a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Miko=C5=82aj=20Trzci=C5=84ski?=
 <mtrzcinski@internships.svevn.com>
Date: Fri, 29 Nov 2024 14:33:18 +0100
Subject: [PATCH] [#69556] support colon fenced blocks

---
 src/hooks/markdownFence.js | 9 +++++++++
 src/hooks/useText.js       | 2 ++
 2 files changed, 11 insertions(+)
 create mode 100644 src/hooks/markdownFence.js

diff --git a/src/hooks/markdownFence.js b/src/hooks/markdownFence.js
new file mode 100644
index 0000000..5283aef
--- /dev/null
+++ b/src/hooks/markdownFence.js
@@ -0,0 +1,9 @@
+import markdownIt from "markdown-it";
+
+const colonFenceRegex = /:{3,}/g;
+
+export function colonFencedBlocks(/** @type {markdownIt} */ md) {
+  md.core.ruler.before("block", "colon", (state) => {
+    state.src = state.src.replace(colonFenceRegex, (match) => "`".repeat(match.length));
+  });
+}
diff --git a/src/hooks/useText.js b/src/hooks/useText.js
index e0a4b0e..f936ef4 100644
--- a/src/hooks/useText.js
+++ b/src/hooks/useText.js
@@ -13,6 +13,7 @@ import { ensureSyntaxTree } from "@codemirror/language";
 import { MystState } from "../mystState";
 import { useComputed } from "@preact/signals";
 import markdownCheckboxes from "markdown-it-checkbox";
+import { colonFencedBlocks } from "./markdownFence";
 
 const countOccurences = (str, pattern) => (str?.match(pattern) || []).length;
 
@@ -110,6 +111,7 @@ export const useText = ({ preview }) => {
       .use(markdownMermaid, { lineMap, parent: options.parent })
       .use(markdownSourceMap)
       .use(checkLinks)
+      .use(colonFencedBlocks)
       .use(markdownCheckboxes);
 
     if (options.backslashLineBreak.value) md.use(backslashLineBreakPlugin);