gitsite-cli/test/resources/mermaid-statediagram.html

Tools for generate static web site from Markdown files in git repository.

<div class="mermaid-wrapper" style="text-align:left"><svg aria-roledescription="stateDiagram" role="graphics-document document" viewBox="0 -50 245.78125 903.5" style="max-width: 245.781px; background-color: transparent;"  xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" width="100%" id="ue693fc7" class="mermaid mermaid-statediagram"><g><defs><marker orient="auto" markerUnits="strokeWidth" markerHeight="14" markerWidth="20" refY="7" refX="19" id="ue693fc7_statediagram-barbEnd"><path d="M 19,7 L9,13 L14,7 L9,1 Z"/></marker></defs><g class="root"><g class="clusters"><g id="First" class="statediagram-state statediagram-cluster"><rect height="523" width="229.78125" y="239" x="8" class="outer"/><g transform="translate(106.890625, 239)" class="cluster-label"><foreignObject height="18.5" width="32"><div style="display: inline-block; white-space: nowrap;" xmlns="http://www.w3.org/1999/xhtml"><span class="nodeLabel">First</span></div></foreignObject></g><rect height="501.5" width="229.78125" y="256.5" x="8" class="inner"/></g><g id="Second" class="statediagram-state statediagram-cluster statediagram-cluster-alt"><rect height="409" width="189.78125" y="328" x="28" class="outer"/><g transform="translate(97.59765625, 328)" class="cluster-label"><foreignObject height="18.5" width="50.5859375"><div style="display: inline-block; white-space: nowrap;" xmlns="http://www.w3.org/1999/xhtml"><span class="nodeLabel">Second</span></div></foreignObject></g><rect height="387.5" width="189.78125" y="345.5" x="28" class="inner"/></g></g><g class="edgePaths"><path marker-end="url(#ue693fc7_statediagram-barbEnd)" style="fill:none" class="edge-thickness-normal transition" id="edge0" d="M122.890625,22L122.890625,26.166666666666668C122.890625,30.333333333333332,122.890625,38.666666666666664,122.890625,47C122.890625,55.333333333333336,122.890625,63.666666666666664,122.890625,67.83333333333333L122.890625,72"/><path marker-end="url(#ue693fc7_statediagram-barbEnd)" style="fill:none" class="edge-thickness-normal transition" id="edge1" d="M122.890625,105.5L122.890625,109.66666666666667C122.890625,113.83333333333333,122.890625,122.16666666666667,122.890625,130.5C122.890625,138.83333333333334,122.890625,147.16666666666666,122.890625,151.33333333333334L122.890625,155.5"/><path marker-end="url(#ue693fc7_statediagram-barbEnd)" style="fill:none" class="edge-thickness-normal transition" id="edge4" d="M122.890625,367L122.890625,371.1666666666667C122.890625,375.3333333333333,122.890625,383.6666666666667,122.890625,392C122.890625,400.3333333333333,122.890625,408.6666666666667,122.890625,412.8333333333333L122.890625,417"/><path marker-end="url(#ue693fc7_statediagram-barbEnd)" style="fill:none" class="edge-thickness-normal transition" id="edge2" d="M122.890625,189L122.890625,193.16666666666666C122.890625,197.33333333333334,122.890625,205.66666666666666,122.890625,214C122.890625,222.33333333333334,122.890625,230.66666666666666,122.890625,234.83333333333334L122.890625,239"/><path marker-end="url(#ue693fc7_statediagram-barbEnd)" style="fill:none" class="edge-thickness-normal transition" id="edge3" d="M122.890625,278L122.890625,282.1666666666667C122.890625,286.3333333333333,122.890625,294.6666666666667,122.890625,303C122.890625,311.3333333333333,122.890625,319.6666666666667,122.890625,323.8333333333333L122.890625,328"/><path marker-end="url(#ue693fc7_statediagram-barbEnd)" style="fill:none" class="edge-thickness-normal transition" id="edge5" d="M122.890625,450.5L122.890625,454.6666666666667C122.890625,458.8333333333333,122.890625,467.1666666666667,122.890625,475.5C122.890625,483.8333333333333,122.890625,492.1666666666667,122.890625,496.3333333333333L122.890625,500.5"/><path marker-end="url(#ue693fc7_statediagram-barbEnd)" style="fill:none" class="edge-thickness-normal transition" id="edge8" d="M122.890625,712L122.890625,716.1666666666666C122.890625,720.3333333333334,122.890625,728.6666666666666,122.890625,737C122.890625,745.3333333333334,122.890625,753.6666666666666,122.890625,762C122.890625,770.3333333333334,122.890625,778.6666666666666,122.890625,787C122.890625,795.3333333333334,122.890625,803.6666666666666,122.890625,807.8333333333334L122.890625,812"/></g><g class="edgeLabels"><g class="edgeLabel"><g transform="translate(0, 0)" class="label"><rect height="0" width="0" ry="0" rx="0"/><foreignObject height="0" width="0"><div style="display: inline-block; white-space: nowrap;" xmlns="http://www.w3.org/1999/xhtml"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel"><g transform="translate(0, 0)" class="label"><rect height="0" width="0" ry="0" rx="0"/><foreignObject height="0" width="0"><div style="display: inline-block; white-space: nowrap;" xmlns="http://www.w3.org/1999/xhtml"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel"><g transform="translate(0, 0)" class="label"><rect height="0" width="0" ry="0" rx="0"/><foreignObject height="0" width="0"><div style="display: inline-block; white-space: nowrap;" xmlns="http://www.w3.org/1999/xhtml"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel"><g transform="translate(0, 0)" class="label"><rect height="0" width="0" ry="0" rx="0"/><foreignObject height="0" width="0"><div style="display: inline-block; white-space: nowrap;" xmlns="http://www.w3.org/1999/xhtml"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel"><g transform="translate(0, 0)" class="label"><rect height="0" width="0" ry="0" rx="0"/><foreignObject height="0" width="0"><div style="display: inline-block; white-space: nowrap;" xmlns="http://www.w3.org/1999/xhtml"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel"><g transform="translate(0, 0)" class="label"><rect height="0" width="0" ry="0" rx="0"/><foreignObject height="0" width="0"><div style="display: inline-block; white-space: nowrap;" xmlns="http://www.w3.org/1999/xhtml"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel"><g transform="translate(0, 0)" class="label"><rect height="0" width="0" ry="0" rx="0"/><foreignObject height="0" width="0"><div style="display: inline-block; white-space: nowrap;" xmlns="http://www.w3.org/1999/xhtml"><span class="edgeLabel"></span></div></foreignObject></g></g></g><g class="nodes"><g transform="translate(122.890625, 15)" id="state-root_start-0" class="node default"><circle height="14" width="14" r="7" class="state-start"/></g><g transform="translate(122.890625, 88.75)" id="state-Init-1" class="node  statediagram-state undefined"><rect height="33.5" width="39.1015625" y="-16.75" x="-19.55078125" style="" class="basic label-container"/><g transform="translate(-12.05078125, -9.25)" style="" class="label"><rect/><foreignObject height="18.5" width="24.1015625"><div style="display: inline-block; white-space: nowrap;" xmlns="http://www.w3.org/1999/xhtml"><span class="nodeLabel">Init</span></div></foreignObject></g></g><g transform="translate(122.890625, 172.25)" id="state-Ready-2" class="node  statediagram-state undefined"><rect height="33.5" width="57.6015625" y="-16.75" x="-28.80078125" style="" class="basic label-container"/><g transform="translate(-21.30078125, -9.25)" style="" class="label"><rect/><foreignObject height="18.5" width="42.6015625"><div style="display: inline-block; white-space: nowrap;" xmlns="http://www.w3.org/1999/xhtml"><span class="nodeLabel">Ready</span></div></foreignObject></g></g><g transform="translate(122.890625, 271)" id="state-First_start-3" class="node default"><circle height="14" width="14" r="7" class="state-start"/></g><g transform="translate(122.890625, 360)" id="state-Second_start-4" class="node default"><circle height="14" width="14" r="7" class="state-start"/></g><g transform="translate(122.890625, 433.75)" id="state-second-5" class="node  statediagram-state undefined"><rect height="33.5" width="64.3671875" y="-16.75" x="-32.18359375" style="" class="basic label-container"/><g transform="translate(-24.68359375, -9.25)" style="" class="label"><rect/><foreignObject height="18.5" width="49.3671875"><div style="display: inline-block; white-space: nowrap;" xmlns="http://www.w3.org/1999/xhtml"><span class="nodeLabel">second</span></div></foreignObject></g></g><g transform="translate(55.5, 492.5)" class="root"><g class="clusters"><g id="Third" class="statediagram-state statediagram-cluster"><rect height="211.5" width="119.78125" y="8" x="8" class="outer"/><g transform="translate(49.02734375, 8)" class="cluster-label"><foreignObject height="18.5" width="37.7265625"><div style="display: inline-block; white-space: nowrap;" xmlns="http://www.w3.org/1999/xhtml"><span class="nodeLabel">Third</span></div></foreignObject></g><rect height="190" width="119.78125" y="25.5" x="8" class="inner"/></g></g><g class="edgePaths"><path marker-end="url(#ue693fc7_statediagram-barbEnd)" style="fill:none" class="edge-thickness-normal transition" id="edge6" d="M67.890625,47L67.890625,51.166666666666664C67.890625,55.333333333333336,67.890625,63.666666666666664,67.890625,72C67.890625,80.33333333333333,67.890625,88.66666666666667,67.890625,92.83333333333333L67.890625,97"/><path marker-end="url(#ue693fc7_statediagram-barbEnd)" style="fill:none" class="edge-thickness-normal transition" id="edge7" d="M67.890625,130.5L67.890625,134.66666666666666C67.890625,138.83333333333334,67.890625,147.16666666666666,67.890625,155.5C67.890625,163.83333333333334,67.890625,172.16666666666666,67.890625,176.33333333333334L67.890625,180.5"/></g><g class="edgeLabels"><g class="edgeLabel"><g transform="translate(0, 0)" class="label"><rect height="0" width="0" ry="0" rx="0"/><foreignObject height="0" width="0"><div style="display: inline-block; white-space: nowrap;" xmlns="http://www.w3.org/1999/xhtml"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel"><g transform="translate(0, 0)" class="label"><rect height="0" width="0" ry="0" rx="0"/><foreignObject height="0" width="0"><div style="display: inline-block; white-space: nowrap;" xmlns="http://www.w3.org/1999/xhtml"><span class="edgeLabel"></span></div></foreignObject></g></g></g><g class="nodes"><g transform="translate(67.890625, 40)" id="state-Third_start-6" class="node default"><circle height="14" width="14" r="7" class="state-start"/></g><g transform="translate(67.890625, 113.75)" id="state-third-7" class="node  statediagram-state undefined"><rect height="33.5" width="49.78125" y="-16.75" x="-24.890625" style="" class="basic label-container"/><g transform="translate(-17.390625, -9.25)" style="" class="label"><rect/><foreignObject height="18.5" width="34.78125"><div style="display: inline-block; white-space: nowrap;" xmlns="http://www.w3.org/1999/xhtml"><span class="nodeLabel">third</span></div></foreignObject></g></g><g transform="translate(67.890625, 187.5)" id="state-Third_end-7" class="node default"><circle height="14" width="14" r="7" class="state-start"/><circle height="10" width="10" r="5" class="state-end"/></g></g></g><g transform="translate(122.890625, 828.75)" id="state-END-8" class="node  statediagram-state undefined"><rect height="33.5" width="43.59375" y="-16.75" x="-21.796875" style="" class="basic label-container"/><g transform="translate(-14.296875, -9.25)" style="" class="label"><rect/><foreignObject height="18.5" width="28.59375"><div style="display: inline-block; white-space: nowrap;" xmlns="http://www.w3.org/1999/xhtml"><span class="nodeLabel">END</span></div></foreignObject></g></g></g></g></g><text class="statediagramTitleText" y="-25" x="122.890625">State Diagram Demo</text></svg></div>