[#73377] replace markdown-it-checkbox with custom plugin

package.json

@@ -34,7 +34,6 @@
     "highlight.js": "^11.11.1",
     "imurmurhash": "^0.1.4",
     "markdown-it": "^12.3.2",
-    "markdown-it-checkbox": "^1.1.0",
     "markdown-it-docutils": "^0.1.3",
     "mermaid": "^11.2.0",
     "preact": "^10.11.3",

src/markdown/markdownCheckboxes.js

@@ -1,5 +1,6 @@
 import { getLineById } from "./markdownSourceMap";
 import { EditorView } from "codemirror";
+import markdownIt from "markdown-it";
 
 /**
  * @param {{ target: HTMLElement }} ev
@@ -22,3 +23,48 @@ export function syncCheckboxes(ev, lineMap, editor) {
     },
   });
 }
+
+export function markdownCheckboxes(/** @type {markdownIt} */ md) {
+  md.block.ruler.before("paragraph", "checkbox", (state, startLine, _, silent) => {
+    const start = state.bMarks[startLine] + state.tShift[startLine];
+    let pos = start;
+    let max = state.eMarks[startLine];
+
+    // if it's indented more than 3 spaces, it should be a code block
+    if (state.sCount[startLine] - state.blkIndent >= 4) return false;
+
+    if (state.src.charCodeAt(pos) !== 0x5b /* [ */) return false;
+    pos++;
+    let checked;
+    if (state.src.charCodeAt(pos) === 0x20 /* space */) checked = false;
+    else if (state.src.charCodeAt(pos) === 0x78 || state.src.charCodeAt(pos) === 0x58 /* x || X */) checked = true;
+    else return false;
+    pos++;
+    if (state.src.charCodeAt(pos) !== 0x5d /* ] */) return false;
+    pos++;
+
+    if (silent) return true;
+
+    state.line = startLine + 1;
+
+    const tokenLabelOpen = state.push("label_open", "label", 1);
+    tokenLabelOpen.map = [startLine, state.line];
+
+    const tokenCheckbox = state.push("checkbox", "input", 0);
+    tokenCheckbox.markup = state.src.slice(start, pos - 1);
+    tokenCheckbox.map = [startLine, state.line];
+    tokenCheckbox.attrSet("type", "checkbox");
+    if (checked) {
+      tokenCheckbox.attrSet("checked");
+    }
+
+    const tokenInline = state.push("inline", "", 0);
+    tokenInline.content = state.src.slice(pos, max).trim();
+    tokenInline.map = [startLine, state.line];
+    tokenInline.children = [];
+
+    state.push("label_close", "label", -1);
+
+    return true;
+  });
+}

src/markdown/markdownSourceMap.js

@@ -23,6 +23,7 @@ export default function markdownSourceMap(md) {
     "checkbox_input",
     "html_block",
     "html_inline",
+    "checkbox",
   ];
 
   for (const rule of overrideRules) {

src/text.js

@@ -8,13 +8,13 @@ import markdownSourceMap from "./markdown/markdownSourceMap";
 import { checkLinks } from "./markdown/markdownLinks";
 import { colonFencedBlocks } from "./markdown/markdownFence";
 import { markdownItMapUrls } from "./markdown/markdownUrlMapping";
-import markdownCheckboxes from "markdown-it-checkbox";
 import { backslashLineBreakPlugin } from "./markdown/markdownLineBreak";
 import IMurMurHash from "imurmurhash";
 import purify from "dompurify";
 import { StateEffect } from "@codemirror/state";
 import hljs from "highlight.js/lib/core";
 import yamlHighlight from "highlight.js/lib/languages/yaml";
+import { markdownCheckboxes } from "./markdown/markdownCheckboxes";
 
 export const markdownUpdatedEffect = StateEffect.define();