fix: update to markmap v0.18

Author: gera2ld

README.md

@@ -73,8 +73,8 @@ plugins:
       encoding: utf-8
       file_extension: .mm.md
       d3_version: 7
-      lib_version: 0.15.3
-      view_version: 0.15.3
+      lib_version: 0.18
+      view_version: 0.18
 ```
 
 In addition, feel free to define your favourite source urls like this:
@@ -89,8 +89,8 @@ plugins:
 
 extra_javascript:
   - https://unpkg.com/d3@7/dist/d3.min.js
-  - https://unpkg.com/markmap-lib@0.15.3/dist/browser/index.js
-  - https://unpkg.com/markmap-view@0.15.3/dist/browser/index.js
+  - https://unpkg.com/markmap-lib@0.18/dist/browser/index.iife.js
+  - https://unpkg.com/markmap-view@0.18/dist/browser/index.js
 ```
 
 ## Troubleshooting

mkdocs_markmap/defaults.py

@@ -14,12 +14,12 @@ class JsModuleConfig(object):
 )
 
 MARKMAP_LIB: JsModuleConfig = JsModuleConfig(
-    version="0.15.4",
+    version="0.18",
     uri="https://unpkg.com/markmap-lib@{}",
 )
 
 MARKMAP_VIEW: JsModuleConfig = JsModuleConfig(
-    version="0.15.4",
+    version="0.18",
     uri="https://unpkg.com/markmap-view@{}",
 )
 

mkdocs_markmap/static_files/mkdocs-markmap.js

@@ -3,7 +3,25 @@
     const assets = transformer.getAssets();
     const loading = Promise.all([
         assets.styles && markmap.loadCSS(assets.styles),
-        assets.scripts && markmap.loadJS(assets.scripts),
+        markmap.loadJS([
+            ...transformer.plugins.flatMap(
+                (plugin) =>
+                    plugin.config?.preloadScripts?.map((item) =>
+                        item.data.src
+                            ? {
+                                  ...item,
+                                  data: {
+                                      ...item.data,
+                                      src: transformer.urlBuilder.getFullUrl(
+                                          item.data.src
+                                      ),
+                                  },
+                              }
+                            : item
+                    ) || []
+            ),
+            ...(assets.scripts || []),
+        ]),
     ]);
 
     function parseData(content) {
@@ -19,8 +37,9 @@
     }
 
     function resetMarkmap(m, el) {
-        const { minX, maxX, minY, maxY } = m.state;
-        const height = (el.clientWidth * (maxX - minX)) / (maxY - minY);
+        if (!m.state.rect) return;
+        const { x1, y1, x2, y2 } = m.state.rect;
+        const height = (el.offsetWidth / (x2 - x1)) * (y2 - y1);
         el.style.height = height + "px";
         m.fit();
     }
@@ -44,11 +63,9 @@
         el.innerHTML = "<svg>";
         svg = el.firstChild;
         const { root, options } = parseData(content);
-        const m = markmap.Markmap.create(svg, options, root);
-        resetMarkmap(m, el);
-        transformer.hooks.retransform.tap(() => {
-            const { root, options } = parseData(content);
-            m.setData(root, options);
+        const m = markmap.Markmap.create(svg, options);
+        m.setData(root);
+        requestAnimationFrame(() => {
             resetMarkmap(m, el);
         });
     }