spoiler tag

docs/.vitepress/config.mts

@@ -1,4 +1,4 @@
-import { defineConfig } from "vitepress";
+import { defineConfig, MarkdownOptions } from "vitepress";
 
 // https://vitepress.dev/reference/site-config
 export default defineConfig({
@@ -13,4 +13,53 @@ export default defineConfig({
       level: "deep",
     },
   },
+  markdown: {
+    config(md) {
+      const mdInline: MarkdownOptions["config"] = (md) => {
+        const className = "md";
+
+        md.core.ruler.after("inline", "inline_class_md", (state: any) => {
+          const tokens = state.tokens;
+          const tagPattern = new RegExp(
+            `class=(?:\"|')([^\"']*\\b${escapeReg(className)}\\b[^\"']*)(?:\"|')`,
+            "i",
+          );
+
+          for (let i = 0; i < tokens.length; i++) {
+            const t = tokens[i];
+            if (!/^(html_inline|html_block)$/.test(t.type)) continue;
+            const html = t.content;
+            // match tags with class including the target class, capture inner content (non-greedy)
+            const pattern = new RegExp(
+              `<([a-zA-Z0-9-]+)(\\b[^>]*)?>([\\s\\S]*?)<\\/\\1>`,
+              "gi",
+            );
+            let lastIndex = 0;
+            let out = "";
+            let m;
+            while ((m = pattern.exec(html)) !== null) {
+              const [full, tagName, attrs = "", inner] = m;
+              const idx = m.index;
+              if (idx > lastIndex) out += html.slice(lastIndex, idx);
+              if (tagPattern.test(attrs)) {
+                // render inner as inline markdown
+                out += `<${tagName}${attrs}>${md.renderInline(inner)}</${tagName}>`;
+              } else {
+                out += full;
+              }
+              lastIndex = idx + full.length;
+            }
+            if (lastIndex === 0) continue;
+            if (lastIndex < html.length) out += html.slice(lastIndex);
+            t.content = out;
+          }
+        });
+
+        function escapeReg(s: string) {
+          return s.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+        }
+      };
+      md.use(mdInline);
+    },
+  },
 });