Update dependency markmap-lib to v0.10.1 (#745)

* Update dependency markmap-lib to v0.10.1

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

Co-authored-by: Renovate Bot <bot@renovateapp.com>
Co-authored-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

package.json

@@ -78,7 +78,8 @@
         "markdown-it-sup": "1.0.0",
         "markdown-it-task-lists": "2.1.1",
         "markdown-it-toc-done-right": "4.1.0",
-        "markmap-lib": "0.9.2",
+        "markmap-lib": "0.10.1",
+        "markmap-view": "^0.1.1",
         "mermaid": "8.8.3",
         "node-sass": "4.14.1",
         "react": "17.0.1",

src/components/markdown-renderer/replace-components/markmap/markmap-frame.tsx

@@ -39,35 +39,25 @@ export const MarkmapFrame: React.FC<MarkmapFrameProps> = ({ code }) => {
       return
     }
     const actualContainer = diagramContainer.current
-    Promise.all([import(/* webpackChunkName: "markmap" */ 'markmap-lib/dist/transform'), import(/* webpackChunkName: "markmap" */ 'markmap-lib/dist/view'), import(/* webpackChunkName: "markmap" */ 'markmap-lib/dist/util/loader')])
-      .then(([transform, view, loader]) => {
+    Promise.all([import(/* webpackChunkName: "markmap" */ 'markmap-lib'), import(/* webpackChunkName: "markmap" */ 'markmap-view')])
+      .then(([{ transform }, { Markmap }]) => {
         const svg: SVGSVGElement = document.createElementNS('http://www.w3.org/2000/svg', 'svg')
         svg.setAttribute('width', '100%')
         actualContainer.querySelectorAll('svg').forEach(child => child.remove())
         actualContainer.appendChild(svg)
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment,@typescript-eslint/no-unsafe-call
-        const { root, features } = transform.transform(code)
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-assignment
-        const { styles, scripts } = transform.getUsedAssets(features)
-        if (styles) {
-          // eslint-disable-next-line @typescript-eslint/no-unsafe-call
-          loader.loadCSS(styles)
-        }
-        if (scripts) {
-          // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-return,@typescript-eslint/no-unsafe-member-access
-          loader.loadJS(scripts, { getMarkmap: () => view.Markmap })
-            .catch(err => console.error(err))
-        }
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access
-        view.Markmap.create(svg, {}, root)
-      }).catch(() => { console.error('error while loading markmap') })
+        const { root } = transform(code)
+        Markmap.create(svg, {}, root)
+      }).catch(() => {
+        console.error('error while loading markmap')
+      })
   }, [code])
 
   return (
     <Fragment>
       <div className={'text-center'} ref={diagramContainer}/>
       <div className={'text-right button-inside'}>
-        <LockButton locked={disablePanAndZoom} onLockedChanged={(newState => setDisablePanAndZoom(newState))} title={ disablePanAndZoom ? t('renderer.markmap.locked') : t('renderer.markmap.unlocked')}/>
+        <LockButton locked={disablePanAndZoom} onLockedChanged={(newState => setDisablePanAndZoom(newState))}
+                    title={disablePanAndZoom ? t('renderer.markmap.locked') : t('renderer.markmap.unlocked')}/>
       </div>
     </Fragment>
   )