{"type":"doc","content":[{"type":"panel","attrs":{"panelType":"info"},"content":[{"type":"paragraph","content":[{"text":"The demo shown below was taken from the ","type":"text"},{"text":"official Mermaid documentation","type":"text","marks":[{"type":"link","attrs":{"href":"https://mermaid.js.org/intro/"}}]},{"text":".","type":"text"}]}]},{"type":"extension","attrs":{"layout":"default","extensionType":"com.atlassian.confluence.macro.core","extensionKey":"confluence-mermaid-macro","parameters":{"macroParams":{"searchText":{"value":"block beta columns Start Start space down down space Decision Make Decision right Yes right Process1 Process downAgain No down space r3 Done down Process2 Process r2 Done right End End style Start fill 969 style End fill 696"},"download":{"value":"true"},"fullscreen":{"value":"true"},"panZoom":{"value":"true"},"zoom":{"value":""},"theme":{"value":"default"},"disableUseMaxWidth":{"value":""},"copy":{"value":"true"},"exportWidth":{"value":""},"__bodyContent":{"value":"block-beta\n columns 3\n Start((\"Start\")) space:2\n down<[\" \"]>(down) space:2\n Decision{{\"Make Decision\"}} right<[\"Yes\"]>(right) Process1[\"Process A\"]\n downAgain<[\"No\"]>(down) space r3<[\"Done\"]>(down)\n Process2[\"Process B\"] r2<[\"Done\"]>(right) End((\"End\"))\n\n style Start fill:#969;\n style End fill:#696;"},"height":{"value":""}},"macroMetadata":{"macroId":{"value":"ab0cfda1-1987-4644-8152-312cdeea0e7b"},"schemaVersion":{"value":"1"},"indexedMacroParams":{"text":"block beta columns Start Start space down down space Decision Make Decision right Yes right Process1 Process downAgain No down space r3 Done down Process2 Process r2 Done right End End style Start fill 969 style End fill 696","type":"text"},"placeholder":[{"type":"icon","data":{"url":"https://confluence-mermaid.weweave.net/images/icon.svg"}}],"title":"Mermaid diagram"}},"localId":"76687f79-2429-4831-8ace-638ad8d97caa"}},{"type":"paragraph","content":[{"text":"Textual representation","type":"text"}]},{"type":"extension","attrs":{"layout":"default","extensionType":"com.atlassian.confluence.macro.core","extensionKey":"confluence-prism-macro","parameters":{"macroParams":{"lineNumbers":{"value":"true"},"showPreviews":{"value":"true"},"downloadFilename":{"value":"BlockDiagram.mmd"},"showInvisibles":{"value":""},"lineHighlight":{"value":""},"language":{"value":"Mermaid"},"lineNumbersStart":{"value":""},"dialogTitle":{"value":"Block diagram"},"limitHeight":{"value":""},"__bodyContent":{"value":"block-beta\n columns 3\n Start((\"Start\")) space:2\n down<[\" \"]>(down) space:2\n Decision{{\"Make Decision\"}} right<[\"Yes\"]>(right) Process1[\"Process A\"]\n downAgain<[\"No\"]>(down) space r3<[\"Done\"]>(down)\n Process2[\"Process B\"] r2<[\"Done\"]>(right) End((\"End\"))\n\n style Start fill:#969;\n style End fill:#696;"},"height":{"value":""},"clickableLinks":{"value":""}},"macroMetadata":{"macroId":{"value":"d0b9f419-c006-442b-bef7-a2efccc64e9f"},"schemaVersion":{"value":"1"},"placeholder":[{"type":"icon","data":{"url":"https://confluence-prism.weweave.net/images/icon.svg"}}],"title":"Prism syntax highlighter"}},"localId":"a414eb8d-3c6b-4293-9fb3-cf7e6f696e29"}},{"type":"paragraph","content":[{"text":"The code above is rendered by \"","type":"text","marks":[{"type":"subsup","attrs":{"type":"sup"}},{"type":"em"}]},{"text":"Prism Syntax Highlighter for Confluence","type":"text","marks":[{"type":"subsup","attrs":{"type":"sup"}},{"type":"em"},{"type":"link","attrs":{"href":"https://marketplace.atlassian.com/apps/1222532/?utm_source=confluence"}}]},{"text":"\" which supports highlighting Mermaid syntax.","type":"text","marks":[{"type":"subsup","attrs":{"type":"sup"}},{"type":"em"}]}]},{"type":"paragraph","content":[{"text":"👉 Check out the official Mermaid documentation here ","type":"text"},{"type":"inlineCard","attrs":{"url":"https://mermaid.js.org/syntax/block.html"}},{"text":".","type":"text"}]}],"version":1}

Browser not supported