mikel-markdown 0.25.1 → 0.26.1

package/README.md

@@ -55,6 +55,18 @@ And finally, compile your template:
 const result = m({}); // --> '<p>Hello <strong>world</strong></p>'
 ```
 
+### Embedded HTML Blocks
+
+By default, `mikel-markdown` transforms most content to ensure consistent Markdown rendering, including HTML blocks. However, if you need to include raw HTML blocks, such as `<div>`, `<section>`, or custom components, you can wrap your HTML block between `<!--html-->` and `<!--/html-->` like so:
+
+```html
+<!--html-->
+<div class="center">
+  <p>This content will be preserved as raw HTML.</p>
+</div>
+<!--/html-->
+```
+
 ## Helpers
 
 ### `#markdown`

package/index.js

@@ -80,14 +80,14 @@ const allExpressions = {
         replace: (args, cn) => {
             return render("ul", {class: cn.list}, render("li", {class: cn.listItem}, args[1]));
         },
-        afterRegex: /(<\/ul>\n(?:.*)<ul ?(?:class=".*")?>*)+/g
+        afterRegex: /(<\/ul>\n(?:.*)<ul ?(?:class="[^"]*")?>*)+/g
     },
     orderedList: {
         regex: /^[\t\s]*?(?:\d(?:\)|\.))\s(.*)/gm,
         replace: (args, cn) => {
             return render("ol", {class: cn.list}, render("li", {class: cn.listItem}, args[1]));
         },
-        afterRegex: /(<\/ol>\n(?:.*)<ol ?(?:class=".*")?>*)+/g
+        afterRegex: /(<\/ol>\n(?:.*)<ol ?(?:class="[^"]*")?>*)+/g
     },
     strong: {
         regex: /(?:\*\*|__)([^\n]+?)(?:\*\*|__)/g,
@@ -101,8 +101,8 @@ const allExpressions = {
         regex: /^((?:.+(?:\n|$))+)/gm,
         replace: (args, cn) => {
             const line = args[0].trim();
-            // Check if the line starts with a block tag
-            if (/^\<\/?(ul|ol|bl|h\d|p|div|sty|scr).*/.test(line.slice(0, 4)) === true) {
+            // check if the line starts with a block tag or is an empty line
+            if (!line || /^\<(\/? *(ul|ol|bl|h\d|p|div|sty|scr|t)|!--)/.test(line.slice(0, 4))) {
                 return line;
             }
             return render("p", {class: cn.paragraph}, line.replace(/\n/g, ""));
@@ -110,10 +110,13 @@ const allExpressions = {
     }
 };
 
-// @description inline expressions
-const inlineExpressions = Object.fromEntries(["code", "link", "strong", "emphasis"].map(key => {
-    return [key, allExpressions[key]];
-}));
+// @description get only inline expressions
+const getInlineExpressions = expressions => {
+    const fields = ["code", "link", "strong", "emphasis", "image"].filter(key => !!expressions[key]);
+    return Object.fromEntries(fields.map(key => {
+        return [key, expressions[key]];
+    }));
+};
 
 // @description markdown parser
 const parser = (str = "", options = {}) => {
@@ -121,13 +124,19 @@ const parser = (str = "", options = {}) => {
     const expressions = options?.expressions || allExpressions; // custom expressions
     const ignoredBlocks = []; // chunks to ignore
     str = str.replace(/\r\n/g, "\n");
+    // ignore html blocks
+    const htmlBlockRegex = /<!--html-->([\s\S]*?)<!--\/html-->/gm;
+    str = str.replace(htmlBlockRegex, match => {
+        ignoredBlocks.push(match);
+        return `<!--HTML-BLOCK-${(ignoredBlocks.length - 1)}-->`;
+    });
     // replace all expressions
     Object.keys(expressions).forEach(key => {
         str = str.replace(expressions[key].regex, (...args) => {
             const value = expressions[key].replace(args, classNames);
             if (key === "pre" || key === "code") {
                 ignoredBlocks.push(value);
-                return `<pre>{IGNORED%${(ignoredBlocks.length - 1)}}</pre>`;
+                return `<!--HTML-BLOCK-${(ignoredBlocks.length - 1)}-->`;
             }
             // other value --> return the value provided by the renderer
             return value;
@@ -137,10 +146,10 @@ const parser = (str = "", options = {}) => {
             str = str.replace(expressions[key].afterRegex, "");
         }
     });
-    // Replace all the ignored blocks
-    for (let i = ignoredBlocks.length - 1; i >= 0; i--) {
-        str = str.replace(`<pre>{IGNORED%${i}}</pre>`, ignoredBlocks[i]);
-    }
+    // replace all the ignored blocks
+    ignoredBlocks.forEach((block, index) => {
+        str = str.replace(`<!--HTML-BLOCK-${index}-->`, block);
+    });
     return str;
 };
 
@@ -154,8 +163,8 @@ const markdownPlugin = (options = {}) => {
             },
             inlineMarkdown: params => {
                 return parser(params.fn(params.data) || "", {
-                    expressions: inlineExpressions,
                     ...options,
+                    expressions: getInlineExpressions(options.expressions || allExpressions),
                 });
             },
         },

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "mikel-markdown",
     "description": "A mikel helper for parsing markdown content.",
-    "version": "0.25.1",
+    "version": "0.26.1",
     "type": "module",
     "license": "MIT",
     "author": {