feat(remark-kbd-nested)!: add support for variable sections

Author: shivjm

packages/remark-kbd-nested/package.json

@@ -58,6 +58,6 @@
     "unified": "^10.1.0"
   },
   "dependencies": {
-    "micromark-extension-kbd-nested": "workspace:^0.3.1"
+    "micromark-extension-kbd-nested": "workspace:^0.4.0"
   }
 }

packages/remark-kbd-nested/src/index.ts

@@ -18,11 +18,26 @@ const fromMarkdown: FromMarkdownExtension = {
         token,
       );
     },
+    keyboardSequenceVariable: function (token) {
+      this.enter(
+        {
+          /* eslint-disable-next-line @typescript-eslint/no-unsafe-assignment,@typescript-eslint/no-explicit-any */
+          type: "variable" as any,
+          data: { hName: "var" },
+          attributes: {},
+          children: [],
+        },
+        token,
+      );
+    },
   },
   exit: {
     keyboardSequence: function (token) {
       this.exit(token);
     },
+    keyboardSequenceVariable: function (token) {
+      this.exit(token);
+    },
   },
 };
 

packages/remark-kbd-nested/tests/index.ts

@@ -22,28 +22,44 @@ describe("transforming sequences should", () => {
     assert.equal(
       parse({}, "some text **strongly** *emphasized* `code`"),
       "<p>some text <strong>strongly</strong> <em>emphasized</em> <code>code</code></p>",
-      "",
+    );
+    assert.equal(
+      parse({}, "Here is some //non// *variable* text."),
+      "<p>Here is some //non// <em>variable</em> text.</p>",
     );
   });
 
   describe("work for", () => {
-    const CASES: readonly [string | undefined, string, string][] = [
-      [undefined, "||something||", "<p><kbd>something</kbd></p>"],
+    const CASES: readonly [
+      string | undefined,
+      string,
+      string,
+      string | undefined,
+    ][] = [
+      [undefined, "||something||", "<p><kbd>something</kbd></p>", undefined],
       [
         "^",
         "Press ^^x^^.\n\nThen something.",
         "<p>Press <kbd>x</kbd>.</p>\n<p>Then something.</p>",
+        undefined,
       ],
       [
         "=",
         "1. Press === ==Ctrl== + ==Alt== + ==x== ===.\n2. Click on **Cancel**.",
         "<ol>\n<li>Press <kbd><kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>x</kbd></kbd>.</li>\n<li>Click on <strong>Cancel</strong>.</li>\n</ol>",
+        undefined,
+      ],
+      [
+        "^",
+        "Press ^^^ ^^Ctrl^^ + ^^   !! x !!  ^^ ^^^.\n\nThen something.",
+        "<p>Press <kbd><kbd>Ctrl</kbd> + <kbd><var>x</var></kbd></kbd>.</p>\n<p>Then something.</p>",
+        "!",
       ],
     ];
 
-    for (const [delimiter, input, output] of CASES) {
+    for (const [delimiter, input, output, variableDelimiter] of CASES) {
       it(`delimiter ${delimiter} and input ${JSON.stringify(input)}`, () => {
-        assert.equal(parse({ delimiter }, input), output);
+        assert.equal(parse({ delimiter, variableDelimiter }, input), output);
       });
     }
   });