diff --git a/package.json b/package.json index 087d67bfb..365c7601c 100644 --- a/package.json +++ b/package.json @@ -78,7 +78,7 @@ "markdown-it-sup": "1.0.0", "markdown-it-task-lists": "2.1.1", "markdown-it-toc-done-right": "4.1.0", - "markmap-lib": "0.8.1", + "markmap-lib": "0.9.1", "mermaid": "8.8.1", "node-sass": "4.14.1", "react": "16.13.1", diff --git a/src/components/markdown-renderer/replace-components/markmap/markmap-frame.tsx b/src/components/markdown-renderer/replace-components/markmap/markmap-frame.tsx index 9b6749eb2..3297d8c10 100644 --- a/src/components/markdown-renderer/replace-components/markmap/markmap-frame.tsx +++ b/src/components/markdown-renderer/replace-components/markmap/markmap-frame.tsx @@ -12,14 +12,24 @@ export const MarkmapFrame: React.FC = ({ code }) => { return } const actualContainer = diagramContainer.current - Promise.all([import(/* webpackChunkName: "markmap" */ 'markmap-lib/dist/transform'), import(/* webpackChunkName: "markmap" */ 'markmap-lib/dist/view')]) - .then(([transform, view]) => { + 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]) => { 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) - const data = transform.transform(code) - view.Markmap.create(svg, {}, data) + // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment + 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) { + loader.loadCSS(styles) + } + if (scripts) { + loader.loadJS(scripts, { getMarkmap: () => view.Markmap }) + .catch(err => console.error(err)) + } + view.Markmap.create(svg, {}, root) }).catch(() => { console.error('error while loading markmap') }) }, [code]) diff --git a/src/external-types/markmap-lib/dist/transform/index.d.ts b/src/external-types/markmap-lib/dist/transform/index.d.ts index 203908d5b..0682a393e 100644 --- a/src/external-types/markmap-lib/dist/transform/index.d.ts +++ b/src/external-types/markmap-lib/dist/transform/index.d.ts @@ -1,3 +1,3 @@ declare module 'markmap-lib/dist/transform' { - export { transform } from 'markmap-lib/types/transform' + export { transform, getUsedAssets } from 'markmap-lib/types/transform' } diff --git a/src/external-types/markmap-lib/dist/util/loader.d.ts b/src/external-types/markmap-lib/dist/util/loader.d.ts new file mode 100644 index 000000000..00a6ef843 --- /dev/null +++ b/src/external-types/markmap-lib/dist/util/loader.d.ts @@ -0,0 +1,3 @@ +declare module 'markmap-lib/dist/util/loader' { + export { loadCSS, loadJS } from 'markmap-lib/types/util/loader' +} diff --git a/yarn.lock b/yarn.lock index 8fa02da59..e258e519b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3921,7 +3921,7 @@ chokidar@^2.1.8: optionalDependencies: fsevents "^1.2.7" -chokidar@^3.3.0, chokidar@^3.4.1, chokidar@^3.4.2: +chokidar@^3.3.0, chokidar@^3.4.1: version "3.4.2" resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.4.2.tgz#38dc8e658dec3809741eb3ef7bb0a47fe424232d" integrity sha512-IZHaDeBeI+sZJRX7lGcXsdzgvZqKv6sECqsbErJA4mHWfpRrD8B97kSFN4cQz6nGBGiuFia1MKR4d6c1o8Cv7A== @@ -4042,6 +4042,15 @@ cli-width@^3.0.0: resolved "https://registry.yarnpkg.com/cli-width/-/cli-width-3.0.0.tgz#a2f48437a2caa9a22436e794bf071ec9e61cedf6" integrity sha512-FxqpkPPwu1HjuN93Omfm4h8uIanXofW0RxVEW3k5RKx+mJJYSthzNhp32Kzxxy3YAEZ/Dc/EWN1vZRY0+kOhbw== +clipboard@^2.0.0: + version "2.0.6" + resolved "https://registry.yarnpkg.com/clipboard/-/clipboard-2.0.6.tgz#52921296eec0fdf77ead1749421b21c968647376" + integrity sha512-g5zbiixBRk/wyKakSwCKd7vQXDjFnAMGHoEyBogG/bw9kTD9GvdAvaoRR1ALcEzt3pVKxZR0pViekPMIS0QyGg== + dependencies: + good-listener "^1.2.2" + select "^1.1.2" + tiny-emitter "^2.0.0" + cliui@^5.0.0: version "5.0.0" resolved "https://registry.yarnpkg.com/cliui/-/cliui-5.0.0.tgz#deefcfdb2e800784aa34f46fa08e06851c7bbbc5" @@ -4184,11 +4193,6 @@ commander@^4.1.1: resolved "https://registry.yarnpkg.com/commander/-/commander-4.1.1.tgz#9fd602bd936294e9e9ef46a3f4d6964044b18068" integrity sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA== -commander@^5.1.0: - version "5.1.0" - resolved "https://registry.yarnpkg.com/commander/-/commander-5.1.0.tgz#46abbd1652f8e059bddaef99bbdcb2ad9cf179ae" - integrity sha512-P0CysNDQ7rtVw4QIQtm+MRxV66vKFSvlsQvGYXZWR3qFU0jlMKHZZZgw8e+8DSah4UDKMqnknRDQz+xuQXQ/Zg== - common-tags@^1.8.0: version "1.8.0" resolved "https://registry.yarnpkg.com/common-tags/-/common-tags-1.8.0.tgz#8e3153e542d4a39e9b10554434afaaf98956a937" @@ -5419,6 +5423,11 @@ delayed-stream@~1.0.0: resolved "https://registry.yarnpkg.com/delayed-stream/-/delayed-stream-1.0.0.tgz#df3ae199acadfb7d440aaae0b29e2272b24ec619" integrity sha1-3zrhmayt+31ECqrgsp4icrJOxhk= +delegate@^3.1.2: + version "3.2.0" + resolved "https://registry.yarnpkg.com/delegate/-/delegate-3.2.0.tgz#b66b71c3158522e8ab5744f720d8ca0c2af59166" + integrity sha512-IofjkYBZaZivn0V8nnsMJGBr4jVLxHDheKSW88PyxS5QC4Vo9ZbZVvhzlSxY87fVq3STR6r+4cGepyHkcWOQSw== + delegates@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/delegates/-/delegates-1.0.0.tgz#84c6e159b81904fdca59a0ef44cd870d31250f9a" @@ -7077,6 +7086,13 @@ globule@^1.0.0: lodash "~4.17.10" minimatch "~3.0.2" +good-listener@^1.2.2: + version "1.2.2" + resolved "https://registry.yarnpkg.com/good-listener/-/good-listener-1.2.2.tgz#d53b30cdf9313dffb7dc9a0d477096aa6d145c50" + integrity sha1-1TswzfkxPf+33JoNR3CWqm0UXFA= + dependencies: + delegate "^3.1.2" + graceful-fs@^4.1.11, graceful-fs@^4.1.15, graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.2: version "4.2.4" resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.4.tgz#2256bde14d3632958c465ebc96dc467ca07a29fb" @@ -8783,7 +8799,7 @@ jsx-ast-utils@^2.2.1, jsx-ast-utils@^2.2.3, jsx-ast-utils@^2.4.1: array-includes "^3.1.1" object.assign "^4.1.0" -katex@0.12.0: +katex@0.12.0, katex@^0.12.0: version "0.12.0" resolved "https://registry.yarnpkg.com/katex/-/katex-0.12.0.tgz#2fb1c665dbd2b043edcf8a1f5c555f46beaa0cb9" integrity sha512-y+8btoc/CK70XqcHqjxiGWBOeIL8upbS0peTPXTvgrh21n1RiWWcIpSWM+4uXq+IAgNh9YYQWdc7LVDPDAEEAg== @@ -9379,20 +9395,20 @@ markdown-it@11.0.1, markdown-it@^11.0.0: mdurl "^1.0.1" uc.micro "^1.0.5" -markmap-lib@0.8.1: - version "0.8.1" - resolved "https://registry.yarnpkg.com/markmap-lib/-/markmap-lib-0.8.1.tgz#af621824771917107d02d6559e19389349eb2ba2" - integrity sha512-P4TyP2rFY4cDCX4Qoztp3at5N+V3M4F/tM3F47hlj6Q7+A0OU481VdlIHzhVl30OQup9tyc6Pnk+tG0cNao2Nw== +markmap-lib@0.9.1: + version "0.9.1" + resolved "https://registry.yarnpkg.com/markmap-lib/-/markmap-lib-0.9.1.tgz#c239a75c75491e11dbfa4dea80ed55e1960e8782" + integrity sha512-R6DnnOQRIWP577vD8Q7zoSu1+GpH0eHn6PZ2VkIVVhiRNFlEPtv1vBIfVwFxvu5SqnukkcQNqnbakYnMaDKcdw== dependencies: "@babel/runtime" "^7.9.6" "@types/d3" "^5.7.2" - chokidar "^3.4.2" - commander "^5.1.0" d3 "^5.16.0" d3-flextree "^2.1.1" + katex "^0.12.0" koa "^2.13.0" - open "^7.0.3" + prismjs "^1.21.0" remarkable "^2.0.0" + remarkable-katex "^1.1.6" md5.js@^1.3.4: version "1.3.5" @@ -10209,7 +10225,7 @@ only@~0.0.2: resolved "https://registry.yarnpkg.com/only/-/only-0.0.2.tgz#2afde84d03e50b9a8edc444e30610a70295edfb4" integrity sha1-Kv3oTQPlC5qO3EROMGEKcCle37Q= -open@^7.0.2, open@^7.0.3: +open@^7.0.2: version "7.2.1" resolved "https://registry.yarnpkg.com/open/-/open-7.2.1.tgz#07b0ade11a43f2a8ce718480bdf3d7563a095195" integrity sha512-xbYCJib4spUdmcs0g/2mK1nKo/jO2T7INClWd/beL7PFkXRWgr8B23ssDHX/USPn2M2IjDR5UdpYs6I67SnTSA== @@ -11411,6 +11427,13 @@ pretty-format@^26.4.2: ansi-styles "^4.0.0" react-is "^16.12.0" +prismjs@^1.21.0: + version "1.21.0" + resolved "https://registry.yarnpkg.com/prismjs/-/prismjs-1.21.0.tgz#36c086ec36b45319ec4218ee164c110f9fc015a3" + integrity sha512-uGdSIu1nk3kej2iZsLyDoJ7e9bnPzIgY0naW/HdknGj61zScaprVEVGHrPoXqI+M9sP0NDnTK2jpkvmldpuqDw== + optionalDependencies: + clipboard "^2.0.0" + process-nextick-args@~2.0.0: version "2.0.1" resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.1.tgz#7820d9b16120cc55ca9ae7792680ae7dba6d7fe2" @@ -12200,6 +12223,11 @@ relateurl@^0.2.7: resolved "https://registry.yarnpkg.com/relateurl/-/relateurl-0.2.7.tgz#54dbf377e51440aca90a4cd274600d3ff2d888a9" integrity sha1-VNvzd+UUQKypCkzSdGANP/LYiKk= +remarkable-katex@^1.1.6: + version "1.1.6" + resolved "https://registry.yarnpkg.com/remarkable-katex/-/remarkable-katex-1.1.6.tgz#86bff33e9bcf5558e7dad40b97a2362d6d99003a" + integrity sha512-7wIhgPK64gBQRp44sZI3arY5plo7zd8NJ50kVvHh7XsJlQ8RBdWDrvmqj21lNCd9Oi6hJZGmIunfLky5hFErHA== + remarkable@^2.0.0: version "2.0.1" resolved "https://registry.yarnpkg.com/remarkable/-/remarkable-2.0.1.tgz#280ae6627384dfb13d98ee3995627ca550a12f31" @@ -12635,6 +12663,11 @@ select-hose@^2.0.0: resolved "https://registry.yarnpkg.com/select-hose/-/select-hose-2.0.0.tgz#625d8658f865af43ec962bfc376a37359a4994ca" integrity sha1-Yl2GWPhlr0Psliv8N2o3NZpJlMo= +select@^1.1.2: + version "1.1.2" + resolved "https://registry.yarnpkg.com/select/-/select-1.1.2.tgz#0e7350acdec80b1108528786ec1d4418d11b396d" + integrity sha1-DnNQrN7ICxEIUoeG7B1EGNEbOW0= + selfsigned@^1.10.7: version "1.10.7" resolved "https://registry.yarnpkg.com/selfsigned/-/selfsigned-1.10.7.tgz#da5819fd049d5574f28e88a9bcc6dbc6e6f3906b" @@ -13603,6 +13636,11 @@ timsort@^0.3.0: resolved "https://registry.yarnpkg.com/timsort/-/timsort-0.3.0.tgz#405411a8e7e6339fe64db9a234de11dc31e02bd4" integrity sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q= +tiny-emitter@^2.0.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/tiny-emitter/-/tiny-emitter-2.1.0.tgz#1d1a56edfc51c43e863cbb5382a72330e3555423" + integrity sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q== + tiny-invariant@^1.0.2: version "1.1.0" resolved "https://registry.yarnpkg.com/tiny-invariant/-/tiny-invariant-1.1.0.tgz#634c5f8efdc27714b7f386c35e6760991d230875"