@hyperbook/markdown 0.23.1 → 0.23.2

package/dist/assets/directive-mermaid/client.js

@@ -1,9 +1,19 @@
 hyperbook.mermaid = (function () {
   const elementCode = ".directive-mermaid";
 
-  const loadMermaid = function (theme) {
-    window.mermaid.initialize({ theme });
-    window.mermaid.init({ theme }, document.querySelectorAll(elementCode));
+  const loadMermaid = async function (theme) {
+    window.mermaid.initialize({ theme, startOnLoad: false });
+    let i = 0;
+    for (const el of document.querySelectorAll(elementCode)) {
+      if (el.getAttribute("data-processed")) return;
+
+      el.setAttribute("data-processed", true);
+      let id = `graph-` + Date.now() + i++;
+
+      mermaid.render(id, el.innerText).then(({ svg }) => {
+        el.innerHTML = svg;
+      });
+    }
   };
 
   const resetProcessed = function () {

package/dist/index.js

@@ -63702,11 +63702,19 @@ function hash(object) {
 }
 
 // src/remarkDirectiveTabs.ts
-var remarkDirectiveTabs_default = (ctx) => () => {
-  return (tree, file) => {
-    visit(tree, function(node3) {
-      if (isDirective(node3)) {
-        if (node3.name !== "tabs") return;
+function remarkDirectiveTabs_default(ctx) {
+  return function() {
+    const self2 = this;
+    return async (tree, file) => {
+      const tabsNodes = [];
+      visit(tree, function(node3) {
+        if (isDirective(node3)) {
+          if (node3.name !== "tabs") return;
+          tabsNodes.push(node3);
+          return;
+        }
+      });
+      for (const node3 of tabsNodes) {
         const data = node3.data || (node3.data = {});
         if (node3.name === "tabs") {
           expectContainerDirective(node3, file, "tabs");
@@ -63722,9 +63730,9 @@ var remarkDirectiveTabs_default = (ctx) => () => {
           const tabContentElements = [];
           const tabTitleElements = [];
           let first = true;
-          node3.children.filter(isDirective).forEach((node4) => {
-            expectContainerDirective(node4, file, "tab");
-            let { title = "", id: tabId = hash(node4) } = node4.attributes || {};
+          for (const tabNode of node3.children.filter(isDirective)) {
+            expectContainerDirective(tabNode, file, "tab");
+            let { title = "", id: tabId = hash(tabNode) } = tabNode.attributes || {};
             let tree2 = remark(ctx).parse(title);
             remarkGemoji()(tree2);
             let hastTree = toHast(tree2);
@@ -63742,6 +63750,7 @@ var remarkDirectiveTabs_default = (ctx) => () => {
               },
               children: hastTree.children || []
             });
+            const tabContent = await remark(ctx).run(tabNode);
             tabContentElements.push({
               type: "element",
               tagName: "div",
@@ -63750,10 +63759,10 @@ var remarkDirectiveTabs_default = (ctx) => () => {
                 "data-tab-id": tabId,
                 "data-tabs-id": tabsId
               },
-              children: toHast(node4)?.children
+              children: [tabContent]
             });
             first = false;
-          });
+          }
           data.hChildren = [
             {
               type: "element",
@@ -63768,9 +63777,9 @@ var remarkDirectiveTabs_default = (ctx) => () => {
           ];
         }
       }
-    });
+    };
   };
-};
+}
 
 // src/remarkDirectiveSqlIde.ts
 var remarkDirectiveSqlIde_default = (ctx) => () => {
@@ -66656,48 +66665,55 @@ var remarkDirectiveCollapsible_default = (ctx) => () => {
     }
     return [element5];
   };
-  return (tree, file) => {
+  const collapsibleNodes = [];
+  return async (tree, file) => {
     visit(tree, function(node3) {
       if (isDirective(node3)) {
         if (node3.name !== name) return;
-        const data = node3.data || (node3.data = {});
-        const { title = "", id } = node3.data.hProperties || {};
-        expectContainerDirective(node3, file, name);
-        registerDirective(file, name, [], ["style.css"]);
-        node3.attributes = {};
-        data.hName = "div";
-        data.hProperties = {
-          class: "directive-collapsible",
-          "data-id": id
-        };
-        const children = toHast(node3)?.children.flatMap(
-          transformCollapsible
-        );
-        data.hChildren = [
-          {
-            type: "element",
-            tagName: "button",
-            properties: {
-              class: "collapsible"
-            },
-            children: [
-              {
-                type: "text",
-                value: title
-              }
-            ]
-          },
-          {
-            type: "element",
-            tagName: "div",
-            properties: {
-              class: "collapsible-content"
-            },
-            children
-          }
-        ];
+        collapsibleNodes.push(node3);
+        return;
       }
     });
+    for (const node3 of collapsibleNodes) {
+      const data = node3.data || (node3.data = {});
+      const { title = "", id } = node3.data.hProperties || {};
+      expectContainerDirective(node3, file, name);
+      registerDirective(file, name, [], ["style.css"]);
+      node3.attributes = {};
+      data.hName = "div";
+      data.hProperties = {
+        class: "directive-collapsible",
+        "data-id": id
+      };
+      const collapsibleContent = [];
+      for (const child of node3.children) {
+        collapsibleContent.push(await remark(ctx).run(child));
+      }
+      console.log(collapsibleContent);
+      data.hChildren = [
+        {
+          type: "element",
+          tagName: "button",
+          properties: {
+            class: "collapsible"
+          },
+          children: [
+            {
+              type: "text",
+              value: title
+            }
+          ]
+        },
+        {
+          type: "element",
+          tagName: "div",
+          properties: {
+            class: "collapsible-content"
+          },
+          children: collapsibleContent
+        }
+      ];
+    }
   };
 };
 
@@ -73916,6 +73932,12 @@ var remark = (ctx) => {
     remarkCollectHeadings_default(ctx),
     remarkCollectSearchDocuments_default(ctx)
   ];
+  return unified().use(remarkParse).use(remarkPlugins).use(remarkRehype, {
+    allowDangerousHtml: ctx.config.allowDangerousHtml || false
+  });
+};
+var process2 = (md, ctx) => {
+  i18n.init(ctx.config.language || "en");
   const rehypePlugins = [
     rehypeTableOfContents_default(ctx),
     rehypeQrCode_default(ctx),
@@ -73939,13 +73961,7 @@ var remark = (ctx) => {
     ],
     rehypeFormat
   ];
-  return unified().use(remarkParse).use(remarkPlugins).use(remarkRehype, {
-    allowDangerousHtml: ctx.config.allowDangerousHtml || false
-  }).use(rehypePlugins);
-};
-var process2 = (md, ctx) => {
-  i18n.init(ctx.config.language || "en");
-  return remark(ctx).use(rehypeShell_default(ctx)).use(rehypeHtmlStructure_default(ctx)).use(rehypeStringify, {
+  return remark(ctx).use(rehypePlugins).use(rehypeShell_default(ctx)).use(rehypeHtmlStructure_default(ctx)).use(rehypeStringify, {
     allowDangerousCharacters: true,
     allowDangerousHtml: ctx.config.allowDangerousHtml || false
   }).process(md);