git724/forgejo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 4

Add mermaid JS renderer (#12334)

Browse source 
* Add mermaid JS renderer

For feature parity with GitLab. Tested in files, issues, wiki, editor.
arc-green only does an inversion because the renderer seems to like to
render white backgrounds on boxes.

Ref: https://github.com/go-gitea/gitea/issues/3340
Fixes: https://github.com/go-gitea/gitea/issues/12307

* add feature entry, switch to neutral theme, remove border

* add bindFunctions support

* remove unnecessary border-radius

Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
This commit is contained in:
silverwind 2020-07-27 08:24:09 +02:00 • committed by GitHub
parent 46ef562a16
commit 4315e313d1
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 521 additions and 41 deletions
Download patch file Download diff file Expand all files Collapse all files

23
web_src/js/markdown/mermaid.js Normal file
View file

@ -0,0 +1,23 @@
import {random} from '../utils.js';
export async function renderMermaid(els) {
if (!els || !els.length) return;
const {mermaidAPI} = await import(/* webpackChunkName: "mermaid" */'mermaid');
mermaidAPI.initialize({
startOnLoad: false,
theme: 'neutral',
securityLevel: 'strict',
});
for (const el of els) {
mermaidAPI.render(`mermaid-${random(12)}`, el.textContent, (svg, bindFunctions) => {
const div = document.createElement('div');
div.classList.add('mermaid-chart');
div.innerHTML = svg;
if (typeof bindFunctions === 'function') bindFunctions(div);
el.closest('pre').replaceWith(div);
});
}
}