diff --git a/README.md b/README.md index 70b797c..e8fb64a 100644 --- a/README.md +++ b/README.md @@ -32,10 +32,39 @@ or Define in your plugin settings file. This will apply to **all** mermaid diagrams that you render. +``` +%%{init: {'theme': 'dark'}}%% +flowchart LR +A[Hard] -->|Text| B(Round) +B --> C{Decision} +C -->|One| D[Result 1] +C -->|Three| E[Result 2] +``` + +``` +%%{init: {'theme': 'dark'}}%% +flowchart LR +A[Hard] -->|Text| B(Round) +B --> C{Decision} +C -->|One| D[Result 1] +C -->|Three| E[Result 2] +``` + ``` { - "theme": '', - "colour": '' + "config": { + "theme": "dark", + "colour": "#2f3437" + } +} + +or + +{ + "config": { + "theme": "dark", + "colour": "gray" + } } ``` diff --git a/package.json b/package.json index a1fbb4a..9c6936e 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,7 @@ "icon": "./icon.svg" }, "name": "logseq-mermaid-plugin", - "version": "1.0.9", + "version": "1.0.10", "description": "", "main": "dist/index.html", "targets": { diff --git a/src/convert.ts b/src/convert.ts index 27ce045..f9d4641 100644 --- a/src/convert.ts +++ b/src/convert.ts @@ -6,14 +6,14 @@ export const renderMermaid = async (type, payload, colour, mermaidUUID) => { const matchData = mermaidBlock.content.match(/```mermaid(.|\n)*?```/gm); let toDecode = matchData[0]; - if (logseq.settings) { - toDecode = toDecode.replace( - '```mermaid', - `%%{init: { 'theme': ${logseq.settings.theme} } }%%` - ); - } else { - toDecode = toDecode.replace('```mermaid', '').replace('```', ''); + + if (logseq.settings.config) { + const initStr = `\n%%{init: {'theme': '${logseq.settings.config.theme}'}}%%`; + toDecode = toDecode.slice(0, 10) + initStr + toDecode.slice(10); } + + toDecode = toDecode.replace('```mermaid', '').replace('```', ''); + toDecode = toDecode.replace('\n', ' '); const jsonString = btoa(toDecode); @@ -27,14 +27,16 @@ export const renderMermaid = async (type, payload, colour, mermaidUUID) => { }; const handleEvent = async () => { - if (logseq.settings) { - if (logseq.settings.colour.startsWith('#')) { + if (logseq.settings.config) { + const { colour } = logseq.settings.config; + + if (colour.startsWith('#')) { renderBlock( `` ); - } else if (!colour.startsWith('#')) { + } else if (!logseq.settings.colour.startsWith('#')) { renderBlock( `` );