docs/test_cases/t30018_package_mermaid.svg

<svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" aria-roledescription="flowchart-v2" role="graphics-document document" viewBox="0 0 369.015625 216" style="max-width: 369.016px; background-color: white;" class="flowchart" width="369.015625" id="my-svg">
  <style>#my-svg{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#my-svg .error-icon{fill:#552222;}#my-svg .error-text{fill:#552222;stroke:#552222;}#my-svg .edge-thickness-normal{stroke-width:1px;}#my-svg .edge-thickness-thick{stroke-width:3.5px;}#my-svg .edge-pattern-solid{stroke-dasharray:0;}#my-svg .edge-thickness-invisible{stroke-width:0;fill:none;}#my-svg .edge-pattern-dashed{stroke-dasharray:3;}#my-svg .edge-pattern-dotted{stroke-dasharray:2;}#my-svg .marker{fill:#333333;stroke:#333333;}#my-svg .marker.cross{stroke:#333333;}#my-svg svg{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;}#my-svg p{margin:0;}#my-svg .label{font-family:"trebuchet ms",verdana,arial,sans-serif;color:#333;}#my-svg .cluster-label text{fill:#333;}#my-svg .cluster-label span{color:#333;}#my-svg .cluster-label span p{background-color:transparent;}#my-svg .label text,#my-svg span{fill:#333;color:#333;}#my-svg .node rect,#my-svg .node circle,#my-svg .node ellipse,#my-svg .node polygon,#my-svg .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#my-svg .rough-node .label text,#my-svg .node .label text,#my-svg .image-shape .label,#my-svg .icon-shape .label{text-anchor:middle;}#my-svg .node .katex path{fill:#000;stroke:#000;stroke-width:1px;}#my-svg .rough-node .label,#my-svg .node .label,#my-svg .image-shape .label,#my-svg .icon-shape .label{text-align:center;}#my-svg .node.clickable{cursor:pointer;}#my-svg .root .anchor path{fill:#333333!important;stroke-width:0;stroke:#333333;}#my-svg .arrowheadPath{fill:#333333;}#my-svg .edgePath .path{stroke:#333333;stroke-width:2.0px;}#my-svg .flowchart-link{stroke:#333333;fill:none;}#my-svg .edgeLabel{background-color:rgba(232,232,232, 0.8);text-align:center;}#my-svg .edgeLabel p{background-color:rgba(232,232,232, 0.8);}#my-svg .edgeLabel rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#my-svg .labelBkg{background-color:rgba(232, 232, 232, 0.5);}#my-svg .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#my-svg .cluster text{fill:#333;}#my-svg .cluster span{color:#333;}#my-svg div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:12px;background:hsl(80, 100%, 96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#my-svg .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#333;}#my-svg rect.text{fill:none;stroke-width:0;}#my-svg .icon-shape,#my-svg .image-shape{background-color:rgba(232,232,232, 0.8);text-align:center;}#my-svg .icon-shape p,#my-svg .image-shape p{background-color:rgba(232,232,232, 0.8);padding:2px;}#my-svg .icon-shape rect,#my-svg .image-shape rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#my-svg :root{--mermaid-font-family:"trebuchet ms",verdana,arial,sans-serif;}</style>
  <g>
    <marker orient="auto" markerHeight="8" markerWidth="8" markerUnits="userSpaceOnUse" refY="5" refX="5" viewBox="0 0 10 10" class="marker flowchart-v2" id="my-svg_flowchart-v2-pointEnd">
      <path style="stroke-width: 1; stroke-dasharray: 1, 0;" class="arrowMarkerPath" d="M 0 0 L 10 5 L 0 10 z"/>
    </marker>
    <marker orient="auto" markerHeight="8" markerWidth="8" markerUnits="userSpaceOnUse" refY="5" refX="4.5" viewBox="0 0 10 10" class="marker flowchart-v2" id="my-svg_flowchart-v2-pointStart">
      <path style="stroke-width: 1; stroke-dasharray: 1, 0;" class="arrowMarkerPath" d="M 0 5 L 10 10 L 10 0 z"/>
    </marker>
    <marker orient="auto" markerHeight="11" markerWidth="11" markerUnits="userSpaceOnUse" refY="5" refX="11" viewBox="0 0 10 10" class="marker flowchart-v2" id="my-svg_flowchart-v2-circleEnd">
      <circle style="stroke-width: 1; stroke-dasharray: 1, 0;" class="arrowMarkerPath" r="5" cy="5" cx="5"/>
    </marker>
    <marker orient="auto" markerHeight="11" markerWidth="11" markerUnits="userSpaceOnUse" refY="5" refX="-1" viewBox="0 0 10 10" class="marker flowchart-v2" id="my-svg_flowchart-v2-circleStart">
      <circle style="stroke-width: 1; stroke-dasharray: 1, 0;" class="arrowMarkerPath" r="5" cy="5" cx="5"/>
    </marker>
    <marker orient="auto" markerHeight="11" markerWidth="11" markerUnits="userSpaceOnUse" refY="5.2" refX="12" viewBox="0 0 11 11" class="marker cross flowchart-v2" id="my-svg_flowchart-v2-crossEnd">
      <path style="stroke-width: 2; stroke-dasharray: 1, 0;" class="arrowMarkerPath" d="M 1,1 l 9,9 M 10,1 l -9,9"/>
    </marker>
    <marker orient="auto" markerHeight="11" markerWidth="11" markerUnits="userSpaceOnUse" refY="5.2" refX="-1" viewBox="0 0 11 11" class="marker cross flowchart-v2" id="my-svg_flowchart-v2-crossStart">
      <path style="stroke-width: 2; stroke-dasharray: 1, 0;" class="arrowMarkerPath" d="M 1,1 l 9,9 M 10,1 l -9,9"/>
    </marker>
    <g class="root">
      <g class="clusters"/>
      <g class="edgePaths"/>
      <g class="edgeLabels"/>
      <g class="nodes">
        <g transform="translate(0, 0)" class="root">
          <g class="clusters">
            <g data-look="classic" id="C_0003843859098646855966" class="cluster clickable">
              <rect height="200" width="353.015625" y="8" x="8" style=""/>
              <g transform="translate(158.7109375, 8)" class="cluster-label">
                <foreignObject height="24" width="51.59375">
                  <div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;">
                    <span class="nodeLabel">
                      <p>context</p>
                    </span>
                  </div>
                </foreignObject>
              </g>
            </g>
          </g>
          <g class="edgePaths">
            <path marker-end="url(#my-svg_flowchart-v2-pointEnd)" style="" class="edge-thickness-normal edge-pattern-dotted edge-thickness-normal edge-pattern-solid flowchart-link" id="L_C_0002248550955268609788_C_0003355864554476120606_0" d="M204.953,91.681L211.203,86.901C217.453,82.121,229.953,72.56,239.365,67.78C248.777,63,255.102,63,260.759,63C266.417,63,271.408,63,273.903,63L276.398,63"/>
            <path marker-end="url(#my-svg_flowchart-v2-pointEnd)" style="" class="edge-thickness-normal edge-pattern-dotted edge-thickness-normal edge-pattern-solid flowchart-link" id="L_C_0002248550955268609788_C_0017076543520870634420_1" d="M204.953,124.319L211.203,129.099C217.453,133.879,229.953,143.44,239.328,148.22C248.703,153,254.953,153,260.536,153C266.12,153,271.036,153,273.495,153L275.953,153"/>
            <path marker-end="url(#my-svg_flowchart-v2-pointEnd)" style="" class="edge-thickness-normal edge-pattern-dotted edge-thickness-normal edge-pattern-solid flowchart-link" id="L_C_0012969559982727096966_C_0002248550955268609788_2" d="M87.281,108L93.531,108C99.781,108,112.281,108,121.656,108C131.031,108,137.281,108,142.865,108C148.448,108,153.365,108,155.823,108L158.281,108"/>
          </g>
          <g class="edgeLabels">
            <g class="edgeLabel">
              <g transform="translate(0, 0)" class="label">
                <foreignObject height="0" width="0">
                  <div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;" class="labelBkg">
                    <span class="edgeLabel"/>
                  </div>
                </foreignObject>
              </g>
            </g>
            <g class="edgeLabel">
              <g transform="translate(0, 0)" class="label">
                <foreignObject height="0" width="0">
                  <div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;" class="labelBkg">
                    <span class="edgeLabel"/>
                  </div>
                </foreignObject>
              </g>
            </g>
            <g class="edgeLabel">
              <g transform="translate(0, 0)" class="label">
                <foreignObject height="0" width="0">
                  <div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;" class="labelBkg">
                    <span class="edgeLabel"/>
                  </div>
                </foreignObject>
              </g>
            </g>
          </g>
          <g class="nodes">
            <g transform="translate(66.390625, 108)" id="C_0012969559982727096966" class="node">
              <rect height="40" width="41.78125" y="-20" x="-20.890625" style="" class="basic label-container"/>
              <g transform="translate(-4.890625, -12)" style="" class="label">
                <rect/>
                <foreignObject height="24" width="9.78125">
                  <div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;">
                    <span class="nodeLabel">
                      <p>F</p>
                    </span>
                  </div>
                </foreignObject>
              </g>
            </g>
            <g transform="translate(183.6171875, 108)" id="C_0002248550955268609788" class="node">
              <rect height="40" width="42.671875" y="-20" x="-21.3359375" style="" class="basic label-container"/>
              <g transform="translate(-5.3359375, -12)" style="" class="label">
                <rect/>
                <foreignObject height="24" width="10.671875">
                  <div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;">
                    <span class="nodeLabel">
                      <p>E</p>
                    </span>
                  </div>
                </foreignObject>
              </g>
            </g>
            <g transform="translate(301.734375, 63)" id="C_0003355864554476120606" class="node">
              <rect height="40" width="42.671875" y="-20" x="-21.3359375" style="" class="basic label-container"/>
              <g transform="translate(-5.3359375, -12)" style="" class="label">
                <rect/>
                <foreignObject height="24" width="10.671875">
                  <div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;">
                    <span class="nodeLabel">
                      <p>B</p>
                    </span>
                  </div>
                </foreignObject>
              </g>
            </g>
            <g transform="translate(301.734375, 153)" id="C_0017076543520870634420" class="node">
              <rect height="40" width="43.5625" y="-20" x="-21.78125" style="" class="basic label-container"/>
              <g transform="translate(-5.78125, -12)" style="" class="label">
                <rect/>
                <foreignObject height="24" width="11.5625">
                  <div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;">
                    <span class="nodeLabel">
                      <p>D</p>
                    </span>
                  </div>
                </foreignObject>
              </g>
            </g>
          </g>
        </g>
      </g>
    </g>
  </g>
</svg>