EMC Example Output - Arrow Routing Implementation (PR #73)

example.svg

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1500 550"><defs><marker id="arrowhead" markerWidth="10" markerHeight="10" refX="9" refY="3" orient="auto"><polygon points="0 0, 10 3, 0 6" fill="#000000" /></marker></defs><text x="110" y="85" font-family="sans-serif" font-size="24" text-anchor="start">User Registration</text><g transform="translate(80, 170) rotate(-90)"><text x="0" y="-7" text-anchor="middle" font-family="sans-serif" font-size="10">UI,</text><text x="0" y="7" text-anchor="middle" font-family="sans-serif" font-size="10">Automations</text></g><g transform="translate(80, 290) rotate(-90)"><text x="0" y="-14" text-anchor="middle" font-family="sans-serif" font-size="10">Commands,</text><text x="0" y="0" text-anchor="middle" font-family="sans-serif" font-size="10">Projections,</text><text x="0" y="14" text-anchor="middle" font-family="sans-serif" font-size="10">Queries</text></g><g transform="translate(80, 410) rotate(-90)"><text x="0" y="0" text-anchor="middle" font-family="sans-serif" font-size="10">Events</text></g><line x1="50" y1="110" x2="1450" y2="110" stroke="#cccccc" stroke-width="1"/><line x1="50" y1="230" x2="1450" y2="230" stroke="#cccccc" stroke-width="1"/><line x1="50" y1="350" x2="1450" y2="350" stroke="#cccccc" stroke-width="1"/><line x1="50" y1="470" x2="1450" y2="470" stroke="#cccccc" stroke-width="1"/><line x1="50" y1="110" x2="50" y2="470" stroke="#cccccc" stroke-width="1"/><line x1="100" y1="110" x2="100" y2="470" stroke="#cccccc" stroke-width="1"/><line x1="1450" y1="110" x2="1450" y2="470" stroke="#cccccc" stroke-width="1"/><text x="150" y="105" font-family="sans-serif" font-size="14" text-anchor="start">Registration</text><rect x="150" y="130" width="150" height="80" fill="#ffffff" stroke="#000000" stroke-width="2"/><text x="225" y="175" font-family="sans-serif" font-size="16" text-anchor="middle">Registration Form</text><rect x="150" y="250" width="150" height="80" fill="#3b82f6" stroke="#000000" stroke-width="2"/><text x="225" y="295" font-family="sans-serif" font-size="16" text-anchor="middle">Validate Input</text><rect x="350" y="250" width="150" height="80" fill="#3b82f6" stroke="#000000" stroke-width="2"/><text x="425" y="295" font-family="sans-serif" font-size="16" text-anchor="middle">Register User</text><rect x="550" y="250" width="150" height="80" fill="#eab308" stroke="#000000" stroke-width="2"/><text x="625" y="295" font-family="sans-serif" font-size="16" text-anchor="middle">Check Duplicate</text><g class="robot" transform="translate(350, 130)"><g transform="translate(75, 8) scale(0.65) translate(-75, 0)"><rect x="55" y="2" width="40" height="25" rx="5" fill="#ffffff" stroke="#000000" stroke-width="2"/><line x1="65" y1="2" x2="60" y2="-5" stroke="#000000" stroke-width="2"/><circle cx="60" cy="-7" r="3" fill="#ffffff" stroke="#000000" stroke-width="1"/><line x1="85" y1="2" x2="90" y2="-5" stroke="#000000" stroke-width="2"/><circle cx="90" cy="-7" r="3" fill="#ffffff" stroke="#000000" stroke-width="1"/><circle cx="67" cy="12" r="4" fill="#000000" stroke="#000000" stroke-width="1"/><circle cx="83" cy="12" r="4" fill="#000000" stroke="#000000" stroke-width="1"/><rect x="50" y="30" width="50" height="35" rx="3" fill="#ffffff" stroke="#000000" stroke-width="2"/><line x1="50" y1="35" x2="35" y2="42" stroke="#000000" stroke-width="3"/><line x1="35" y1="42" x2="22" y2="54" stroke="#000000" stroke-width="3"/><rect x="17" y="51" width="10" height="5" rx="1" fill="#ffffff" stroke="#000000" stroke-width="1"/><line x1="100" y1="35" x2="115" y2="42" stroke="#000000" stroke-width="3"/><line x1="115" y1="42" x2="128" y2="54" stroke="#000000" stroke-width="3"/><circle cx="130" cy="56" r="5" fill="#ffffff" stroke="#000000" stroke-width="1"/><circle cx="130" cy="56" r="2" fill="#000000" stroke="#000000" stroke-width="1"/><line x1="60" y1="65" x2="55" y2="78" stroke="#000000" stroke-width="3"/><line x1="90" y1="65" x2="95" y2="78" stroke="#000000" stroke-width="3"/></g></g><text x="425" y="202" font-family="sans-serif" font-size="12" text-anchor="middle">Validate Email</text><rect x="150" y="370" width="150" height="80" fill="#a855f7" stroke="#000000" stroke-width="2"/><text x="225" y="415" font-family="sans-serif" font-size="16" text-anchor="middle">User Registered</text><rect x="750" y="250" width="150" height="80" fill="#22c55e" stroke="#000000" stroke-width="2"/><text x="825" y="295" font-family="sans-serif" font-size="16" text-anchor="middle">User Directory</text><path d="M 225 170 L 200 250" stroke="black" stroke-width="2" fill="none" marker-end="url(#arrowhead)"/><path d="M 225 290 L 200 370" stroke="black" stroke-width="2" fill="none" marker-end="url(#arrowhead)"/><path d="M 225 410 L 400 370 L 600 370 L 800 370 L 800 250" stroke="black" stroke-width="2" fill="none" marker-end="url(#arrowhead)"/><path d="M 625 290 L 800 250" stroke="black" stroke-width="2" fill="none" marker-end="url(#arrowhead)"/><line x1="925" y1="110" x2="925" y2="470" stroke="#cccccc" stroke-width="1"/><text x="950" y="105" font-family="sans-serif" font-size="14" text-anchor="start">Email Verification</text><rect x="950" y="130" width="150" height="80" fill="#ffffff" stroke="#000000" stroke-width="2"/><text x="1025" y="175" font-family="sans-serif" font-size="16" text-anchor="middle">Verification Page</text><rect x="950" y="250" width="150" height="80" fill="#3b82f6" stroke="#000000" stroke-width="2"/><text x="1025" y="295" font-family="sans-serif" font-size="16" text-anchor="middle">Verify Email</text><rect x="950" y="370" width="150" height="80" fill="#a855f7" stroke="#000000" stroke-width="2"/><text x="1025" y="415" font-family="sans-serif" font-size="16" text-anchor="middle">Email Verified</text><rect x="1150" y="250" width="150" height="80" fill="#22c55e" stroke="#000000" stroke-width="2"/><text x="1225" y="295" font-family="sans-serif" font-size="16" text-anchor="middle">Verification Tokens</text><path d="M 1025 170 L 1000 250" stroke="black" stroke-width="2" fill="none" marker-end="url(#arrowhead)"/><path d="M 1025 290 L 1000 370" stroke="black" stroke-width="2" fill="none" marker-end="url(#arrowhead)"/><path d="M 1025 410 L 1200 370 L 1200 250" stroke="black" stroke-width="2" fill="none" marker-end="url(#arrowhead)"/></svg>