@tscircuit/schematic-trace-solver 0.0.87 → 0.0.88

package/tests/examples/__snapshots__/example30.snap.svg

@@ -1,294 +1,92 @@
-<svg width="640" height="640" viewBox="0 0 640 640" xmlns="http://www.w3.org/2000/svg">
-  <rect width="100%" height="100%" fill="white" />
-  <g>
-    <circle data-type="point" data-label="P.1
-x-" data-x="-0.6000000000000001" data-y="1.0999999999999999" cx="222" cy="158.99999999999997" r="3" fill="hsl(235, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.2
-x-" data-x="-0.6000000000000001" data-y="0.8999999999999999" cx="222" cy="186.99999999999994" r="3" fill="hsl(236, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.3
-x-" data-x="-0.6000000000000001" data-y="0.6999999999999998" cx="222" cy="214.99999999999997" r="3" fill="hsl(237, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.4
-x-" data-x="-0.6000000000000001" data-y="0.4999999999999998" cx="222" cy="242.99999999999997" r="3" fill="hsl(238, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.5
-x-" data-x="-0.6000000000000001" data-y="0.2999999999999998" cx="222" cy="271" r="3" fill="hsl(239, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.6
-x-" data-x="-0.6000000000000001" data-y="0.09999999999999987" cx="222" cy="298.99999999999994" r="3" fill="hsl(240, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.7
-x-" data-x="-0.6000000000000001" data-y="-0.10000000000000009" cx="222" cy="326.99999999999994" r="3" fill="hsl(241, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.8
-x-" data-x="-0.6000000000000001" data-y="-0.30000000000000004" cx="222" cy="354.99999999999994" r="3" fill="hsl(242, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.9
-x-" data-x="-0.6000000000000001" data-y="-0.5" cx="222" cy="382.99999999999994" r="3" fill="hsl(243, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.10
-x-" data-x="-0.6000000000000001" data-y="-0.7" cx="222" cy="410.99999999999994" r="3" fill="hsl(133, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.11
-x-" data-x="-0.6000000000000001" data-y="-0.8999999999999999" cx="222" cy="438.99999999999994" r="3" fill="hsl(134, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.12
-x-" data-x="-0.6000000000000001" data-y="-1.0999999999999999" cx="222" cy="466.9999999999999" r="3" fill="hsl(135, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.13
-x+" data-x="0.6000000000000001" data-y="-1.0999999999999999" cx="390" cy="466.9999999999999" r="3" fill="hsl(136, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.14
-x+" data-x="0.6000000000000001" data-y="-0.8999999999999999" cx="390" cy="438.99999999999994" r="3" fill="hsl(137, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.15
-x+" data-x="0.6000000000000001" data-y="-0.6999999999999998" cx="390" cy="410.9999999999999" r="3" fill="hsl(138, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.16
-x+" data-x="0.6000000000000001" data-y="-0.4999999999999998" cx="390" cy="382.9999999999999" r="3" fill="hsl(139, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.17
-x+" data-x="0.6000000000000001" data-y="-0.2999999999999998" cx="390" cy="354.9999999999999" r="3" fill="hsl(140, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.18
-x+" data-x="0.6000000000000001" data-y="-0.09999999999999987" cx="390" cy="326.99999999999994" r="3" fill="hsl(141, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.19
-x+" data-x="0.6000000000000001" data-y="0.10000000000000009" cx="390" cy="298.99999999999994" r="3" fill="hsl(142, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.20
-x+" data-x="0.6000000000000001" data-y="0.30000000000000004" cx="390" cy="270.99999999999994" r="3" fill="hsl(164, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.21
-x+" data-x="0.6000000000000001" data-y="0.5" cx="390" cy="242.99999999999994" r="3" fill="hsl(165, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.22
-x+" data-x="0.6000000000000001" data-y="0.7" cx="390" cy="214.99999999999994" r="3" fill="hsl(166, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.23
-x+" data-x="0.6000000000000001" data-y="0.8999999999999999" cx="390" cy="186.99999999999994" r="3" fill="hsl(167, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="P.24
-x+" data-x="0.6000000000000001" data-y="1.0999999999999999" cx="390" cy="158.99999999999997" r="3" fill="hsl(168, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="anchorPoint
-orientation: y+" data-x="-0.8" data-y="1.4999999999999998" cx="194" cy="102.99999999999997" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="anchorPoint
-orientation: x-" data-x="-0.6000000000000001" data-y="0.8999999999999999" cx="222" cy="186.99999999999994" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="anchorPoint
-orientation: x+" data-x="0.6000000000000001" data-y="-0.2999999999999998" cx="390" cy="354.9999999999999" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="anchorPoint
-orientation: x-" data-x="-0.6000000000000001" data-y="0.6999999999999998" cx="222" cy="214.99999999999997" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="anchorPoint
-orientation: x+" data-x="0.6000000000000001" data-y="-0.4999999999999998" cx="390" cy="382.9999999999999" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="anchorPoint
-orientation: y-" data-x="-1.1510000000000002" data-y="-1.6" cx="144.85999999999996" cy="537" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="anchorPoint
-orientation: x-" data-x="-0.6000000000000001" data-y="0.2999999999999998" cx="222" cy="271" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="anchorPoint
-orientation: x+" data-x="0.6000000000000001" data-y="-0.8999999999999999" cx="390" cy="438.99999999999994" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="anchorPoint
-orientation: x-" data-x="-0.6000000000000001" data-y="0.09999999999999987" cx="222" cy="298.99999999999994" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="anchorPoint
-orientation: x+" data-x="0.6000000000000001" data-y="-1.0999999999999999" cx="390" cy="466.9999999999999" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="anchorPoint
-orientation: x-" data-x="-0.6000000000000001" data-y="-0.10000000000000009" cx="222" cy="326.99999999999994" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="anchorPoint
-orientation: x+" data-x="0.6000000000000001" data-y="0.10000000000000009" cx="390" cy="298.99999999999994" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
-  </g>
-  <g>
-    <polyline data-points="-0.6000000000000001,1.0999999999999999 0.6000000000000001,-0.09999999999999987" data-type="line" data-label="" points="222,158.99999999999997 390,326.99999999999994" fill="none" stroke="hsl(16, 100%, 50%, 0.8)" stroke-width="1" />
-  </g>
-  <g>
-    <polyline data-points="-0.6000000000000001,0.8999999999999999 0.6000000000000001,-0.2999999999999998" data-type="line" data-label="" points="222,186.99999999999994 390,354.9999999999999" fill="none" stroke="hsl(128, 100%, 50%, 0.8)" stroke-width="1" />
-  </g>
-  <g>
-    <polyline data-points="-0.6000000000000001,0.6999999999999998 0.6000000000000001,-0.4999999999999998" data-type="line" data-label="" points="222,214.99999999999997 390,382.9999999999999" fill="none" stroke="hsl(32, 100%, 50%, 0.8)" stroke-width="1" />
-  </g>
-  <g>
-    <polyline data-points="-0.6000000000000001,0.4999999999999998 0.6000000000000001,-0.6999999999999998" data-type="line" data-label="" points="222,242.99999999999997 390,410.9999999999999" fill="none" stroke="hsl(144, 100%, 50%, 0.8)" stroke-width="1" />
-  </g>
-  <g>
-    <polyline data-points="-0.6000000000000001,0.2999999999999998 0.6000000000000001,-0.8999999999999999" data-type="line" data-label="" points="222,271 390,438.99999999999994" fill="none" stroke="hsl(104, 100%, 50%, 0.8)" stroke-width="1" />
-  </g>
-  <g>
-    <polyline data-points="-0.6000000000000001,0.09999999999999987 0.6000000000000001,-1.0999999999999999" data-type="line" data-label="" points="222,298.99999999999994 390,466.9999999999999" fill="none" stroke="hsl(160, 100%, 50%, 0.8)" stroke-width="1" />
-  </g>
-  <g>
-    <polyline data-points="-0.6000000000000001,-0.10000000000000009 0.6000000000000001,0.10000000000000009" data-type="line" data-label="" points="222,326.99999999999994 390,298.99999999999994" fill="none" stroke="hsl(120, 100%, 50%, 0.8)" stroke-width="1" />
-  </g>
-  <g>
-    <polyline data-points="-0.6000000000000001,1.0999999999999999 -0.8,1.0999999999999999 -0.8,1.4999999999999998 1.1510000000000002,1.4999999999999998 1.1510000000000002,-0.09999999999999992 0.6000000000000001,-0.09999999999999987" data-type="line" data-label="" points="222,158.99999999999997 194,158.99999999999997 194,102.99999999999997 467.14000000000004,102.99999999999997 467.14000000000004,326.99999999999994 390,326.99999999999994" fill="none" stroke="purple" stroke-width="1" />
-  </g>
-  <g>
-    <polyline data-points="-0.6000000000000001,0.4999999999999998 -1.1510000000000002,0.4999999999999998 -1.1510000000000002,-1.6 1.451,-1.6 1.451,-0.6999999999999998 0.6000000000000001,-0.6999999999999998" data-type="line" data-label="" points="222,242.99999999999997 144.85999999999996,242.99999999999997 144.85999999999996,537 509.14,537 509.14,410.9999999999999 390,410.9999999999999" fill="none" stroke="purple" stroke-width="1" />
-  </g>
-  <g>
-    <rect data-type="rect" data-label="schematic_component_0" data-x="0" data-y="0" x="222" y="130.99999999999997" width="168" height="363.9999999999999" fill="hsl(24, 100%, 50%, 0.8)" stroke="black" stroke-width="0.007142857142857143" />
-  </g>
-  <g>
-    <rect data-type="rect" data-label="netId: P.pin1 to P.pin18
-globalConnNetId: connectivity_net0
-available orientations: y+" data-x="-0.8" data-y="1.7249999999999999" x="180" y="39.99999999999994" width="28" height="63.00000000000003" fill="#ef444466" stroke="#ef4444" stroke-width="0.007142857142857143" />
-  </g>
-  <g>
-    <rect data-type="rect" data-label="netId: P.pin2 to P.pin17
-globalConnNetId: connectivity_net1
-available orientations: any" data-x="-0.8260000000000001" data-y="0.8999999999999999" x="158.85999999999999" y="172.99999999999997" width="63" height="27.99999999999997" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143" />
-  </g>
-  <g>
-    <rect data-type="rect" data-label="netId: P.pin2 to P.pin17
-globalConnNetId: connectivity_net1
-available orientations: any" data-x="0.8260000000000001" data-y="-0.2999999999999998" x="390.14" y="340.99999999999994" width="63" height="27.999999999999943" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143" />
-  </g>
-  <g>
-    <rect data-type="rect" data-label="netId: P.pin3 to P.pin16
-globalConnNetId: connectivity_net2
-available orientations: any" data-x="-0.8260000000000001" data-y="0.6999999999999998" x="158.85999999999999" y="200.99999999999997" width="63" height="27.99999999999997" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143" />
-  </g>
-  <g>
-    <rect data-type="rect" data-label="netId: P.pin3 to P.pin16
-globalConnNetId: connectivity_net2
-available orientations: any" data-x="0.8260000000000001" data-y="-0.4999999999999998" x="390.14" y="368.9999999999999" width="63" height="28" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143" />
-  </g>
-  <g>
-    <rect data-type="rect" data-label="netId: P.pin4 to P.pin15
-globalConnNetId: connectivity_net3
-available orientations: y-" data-x="-1.1510000000000002" data-y="-1.8250000000000002" x="130.85999999999996" y="537" width="28.00000000000003" height="63" fill="#00000066" stroke="#000000" stroke-width="0.007142857142857143" />
-  </g>
-  <g>
-    <rect data-type="rect" data-label="netId: P.pin5 to P.pin14
-globalConnNetId: connectivity_net4
-available orientations: any" data-x="-0.8260000000000001" data-y="0.2999999999999998" x="158.85999999999999" y="257" width="63" height="27.999999999999943" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143" />
-  </g>
-  <g>
-    <rect data-type="rect" data-label="netId: P.pin5 to P.pin14
-globalConnNetId: connectivity_net4
-available orientations: any" data-x="0.8260000000000001" data-y="-0.8999999999999999" x="390.14" y="424.99999999999994" width="63" height="27.999999999999943" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143" />
-  </g>
-  <g>
-    <rect data-type="rect" data-label="netId: P.pin6 to P.pin13
-globalConnNetId: connectivity_net5
-available orientations: any" data-x="-0.8260000000000001" data-y="0.09999999999999987" x="158.85999999999999" y="284.99999999999994" width="63" height="28" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143" />
-  </g>
-  <g>
-    <rect data-type="rect" data-label="netId: P.pin6 to P.pin13
-globalConnNetId: connectivity_net5
-available orientations: any" data-x="0.8260000000000001" data-y="-1.0999999999999999" x="390.14" y="452.9999999999999" width="63" height="28.000000000000057" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143" />
-  </g>
-  <g>
-    <rect data-type="rect" data-label="netId: P.pin7 to P.pin19
-globalConnNetId: connectivity_net6
-available orientations: any" data-x="-0.8260000000000001" data-y="-0.10000000000000009" x="158.85999999999999" y="312.99999999999994" width="63" height="28" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143" />
-  </g>
-  <g>
-    <rect data-type="rect" data-label="netId: P.pin7 to P.pin19
-globalConnNetId: connectivity_net6
-available orientations: any" data-x="0.8260000000000001" data-y="0.10000000000000009" x="390.14" y="284.99999999999994" width="63" height="28" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143" />
-  </g>
-  <g id="crosshair" style="display: none">
-    <line id="crosshair-h" y1="0" y2="640" stroke="#666" stroke-width="0.5" />
-    <line id="crosshair-v" x1="0" x2="640" stroke="#666" stroke-width="0.5" /><text id="coordinates" font-family="monospace" font-size="12" fill="#666"></text>
-  </g>
-  <script>
-    <![CDATA[
-    document.currentScript.parentElement.addEventListener('mousemove', (e) => {
-      const svg = e.currentTarget;
-      const rect = svg.getBoundingClientRect();
-      const x = e.clientX - rect.left;
-      const y = e.clientY - rect.top;
-      const crosshair = svg.getElementById('crosshair');
-      const h = svg.getElementById('crosshair-h');
-      const v = svg.getElementById('crosshair-v');
-      const coords = svg.getElementById('coordinates');
+<svg width="640" height="640" viewBox="0 0 640 640" xmlns="http://www.w3.org/2000/svg"><rect width="100%" height="100%" fill="white"/><g><polyline data-points="-0.6000000000000001,1.0999999999999999 0.6000000000000001,-0.09999999999999987" data-type="line" data-label="" points="222,158.99999999999997 390,326.99999999999994" fill="none" stroke="hsl(16, 100%, 50%, 0.8)" stroke-width="1px"/></g><g><polyline data-points="-0.6000000000000001,0.8999999999999999 0.6000000000000001,-0.2999999999999998" data-type="line" data-label="" points="222,186.99999999999994 390,354.9999999999999" fill="none" stroke="hsl(128, 100%, 50%, 0.8)" stroke-width="1px"/></g><g><polyline data-points="-0.6000000000000001,0.6999999999999998 0.6000000000000001,-0.4999999999999998" data-type="line" data-label="" points="222,214.99999999999997 390,382.9999999999999" fill="none" stroke="hsl(32, 100%, 50%, 0.8)" stroke-width="1px"/></g><g><polyline data-points="-0.6000000000000001,0.4999999999999998 0.6000000000000001,-0.6999999999999998" data-type="line" data-label="" points="222,242.99999999999997 390,410.9999999999999" fill="none" stroke="hsl(144, 100%, 50%, 0.8)" stroke-width="1px"/></g><g><polyline data-points="-0.6000000000000001,0.2999999999999998 0.6000000000000001,-0.8999999999999999" data-type="line" data-label="" points="222,271 390,438.99999999999994" fill="none" stroke="hsl(104, 100%, 50%, 0.8)" stroke-width="1px"/></g><g><polyline data-points="-0.6000000000000001,0.09999999999999987 0.6000000000000001,-1.0999999999999999" data-type="line" data-label="" points="222,298.99999999999994 390,466.9999999999999" fill="none" stroke="hsl(160, 100%, 50%, 0.8)" stroke-width="1px"/></g><g><polyline data-points="-0.6000000000000001,-0.10000000000000009 0.6000000000000001,0.10000000000000009" data-type="line" data-label="" points="222,326.99999999999994 390,298.99999999999994" fill="none" stroke="hsl(120, 100%, 50%, 0.8)" stroke-width="1px"/></g><g><polyline data-points="-0.6000000000000001,1.0999999999999999 -0.8,1.0999999999999999 -0.8,1.4999999999999998 1.1510000000000002,1.4999999999999998 1.1510000000000002,-0.09999999999999992 0.6000000000000001,-0.09999999999999987" data-type="line" data-label="" points="222,158.99999999999997 194,158.99999999999997 194,102.99999999999997 467.14000000000004,102.99999999999997 467.14000000000004,326.99999999999994 390,326.99999999999994" fill="none" stroke="purple" stroke-width="1px"/></g><g><polyline data-points="-0.6000000000000001,0.4999999999999998 -1.1510000000000002,0.4999999999999998 -1.1510000000000002,-1.6 1.451,-1.6 1.451,-0.6999999999999998 0.6000000000000001,-0.6999999999999998" data-type="line" data-label="" points="222,242.99999999999997 144.85999999999996,242.99999999999997 144.85999999999996,537 509.14,537 509.14,410.9999999999999 390,410.9999999999999" fill="none" stroke="purple" stroke-width="1px"/></g><g><rect data-type="rect" data-label="schematic_component_0" data-x="0" data-y="0" x="222" y="131" width="168" height="363.9999999999999" fill="hsl(24, 100%, 50%, 0.8)" stroke="black" stroke-width="0.007142857142857143"/></g><g><rect data-type="rect" data-label="netId: P.pin1 to P.pin18
+globalConnNetId: connectivity_net0" data-x="-0.8" data-y="1.7249999999999999" x="180" y="39.99999999999996" width="28" height="63.00000000000003" fill="#ef444466" stroke="#ef4444" stroke-width="0.007142857142857143"/></g><g><rect data-type="rect" data-label="netId: P.pin2 to P.pin17
+globalConnNetId: connectivity_net1" data-x="-0.8260000000000001" data-y="0.8999999999999999" x="158.85999999999999" y="172.99999999999994" width="63" height="27.99999999999997" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143"/></g><g><rect data-type="rect" data-label="netId: P.pin2 to P.pin17
+globalConnNetId: connectivity_net1" data-x="0.8260000000000001" data-y="-0.2999999999999998" x="390.14" y="340.9999999999999" width="63" height="27.999999999999943" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143"/></g><g><rect data-type="rect" data-label="netId: P.pin3 to P.pin16
+globalConnNetId: connectivity_net2" data-x="-0.8260000000000001" data-y="0.6999999999999998" x="158.85999999999999" y="201" width="63" height="27.99999999999997" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143"/></g><g><rect data-type="rect" data-label="netId: P.pin3 to P.pin16
+globalConnNetId: connectivity_net2" data-x="0.8260000000000001" data-y="-0.4999999999999998" x="390.14" y="368.9999999999999" width="63" height="28" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143"/></g><g><rect data-type="rect" data-label="netId: P.pin4 to P.pin15
+globalConnNetId: connectivity_net3" data-x="-1.1510000000000002" data-y="-1.8250000000000002" x="130.85999999999996" y="537" width="28.00000000000003" height="63" fill="#00000066" stroke="#000000" stroke-width="0.007142857142857143"/></g><g><rect data-type="rect" data-label="netId: P.pin5 to P.pin14
+globalConnNetId: connectivity_net4" data-x="-0.8260000000000001" data-y="0.2999999999999998" x="158.85999999999999" y="257" width="63" height="27.999999999999943" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143"/></g><g><rect data-type="rect" data-label="netId: P.pin5 to P.pin14
+globalConnNetId: connectivity_net4" data-x="0.8260000000000001" data-y="-0.8999999999999999" x="390.14" y="425" width="63" height="27.999999999999943" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143"/></g><g><rect data-type="rect" data-label="netId: P.pin6 to P.pin13
+globalConnNetId: connectivity_net5" data-x="-0.8260000000000001" data-y="0.09999999999999987" x="158.85999999999999" y="284.99999999999994" width="63" height="28" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143"/></g><g><rect data-type="rect" data-label="netId: P.pin6 to P.pin13
+globalConnNetId: connectivity_net5" data-x="0.8260000000000001" data-y="-1.0999999999999999" x="390.14" y="452.9999999999999" width="63" height="28.000000000000057" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143"/></g><g><rect data-type="rect" data-label="netId: P.pin7 to P.pin19
+globalConnNetId: connectivity_net6" data-x="-0.8260000000000001" data-y="-0.10000000000000009" x="158.85999999999999" y="312.99999999999994" width="63" height="28" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143"/></g><g><rect data-type="rect" data-label="netId: P.pin7 to P.pin19
+globalConnNetId: connectivity_net6" data-x="0.8260000000000001" data-y="0.10000000000000009" x="390.14" y="284.99999999999994" width="63" height="28" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.007142857142857143"/></g><g><circle data-type="point" data-label="P.1
+x-" data-x="-0.6000000000000001" data-y="1.0999999999999999" cx="222" cy="158.99999999999997" r="3" fill="hsl(235, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.2
+x-" data-x="-0.6000000000000001" data-y="0.8999999999999999" cx="222" cy="186.99999999999994" r="3" fill="hsl(236, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.3
+x-" data-x="-0.6000000000000001" data-y="0.6999999999999998" cx="222" cy="214.99999999999997" r="3" fill="hsl(237, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.4
+x-" data-x="-0.6000000000000001" data-y="0.4999999999999998" cx="222" cy="242.99999999999997" r="3" fill="hsl(238, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.5
+x-" data-x="-0.6000000000000001" data-y="0.2999999999999998" cx="222" cy="271" r="3" fill="hsl(239, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.6
+x-" data-x="-0.6000000000000001" data-y="0.09999999999999987" cx="222" cy="298.99999999999994" r="3" fill="hsl(240, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.7
+x-" data-x="-0.6000000000000001" data-y="-0.10000000000000009" cx="222" cy="326.99999999999994" r="3" fill="hsl(241, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.8
+x-" data-x="-0.6000000000000001" data-y="-0.30000000000000004" cx="222" cy="354.99999999999994" r="3" fill="hsl(242, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.9
+x-" data-x="-0.6000000000000001" data-y="-0.5" cx="222" cy="382.99999999999994" r="3" fill="hsl(243, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.10
+x-" data-x="-0.6000000000000001" data-y="-0.7" cx="222" cy="410.99999999999994" r="3" fill="hsl(133, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.11
+x-" data-x="-0.6000000000000001" data-y="-0.8999999999999999" cx="222" cy="438.99999999999994" r="3" fill="hsl(134, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.12
+x-" data-x="-0.6000000000000001" data-y="-1.0999999999999999" cx="222" cy="466.9999999999999" r="3" fill="hsl(135, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.13
+x+" data-x="0.6000000000000001" data-y="-1.0999999999999999" cx="390" cy="466.9999999999999" r="3" fill="hsl(136, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.14
+x+" data-x="0.6000000000000001" data-y="-0.8999999999999999" cx="390" cy="438.99999999999994" r="3" fill="hsl(137, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.15
+x+" data-x="0.6000000000000001" data-y="-0.6999999999999998" cx="390" cy="410.9999999999999" r="3" fill="hsl(138, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.16
+x+" data-x="0.6000000000000001" data-y="-0.4999999999999998" cx="390" cy="382.9999999999999" r="3" fill="hsl(139, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.17
+x+" data-x="0.6000000000000001" data-y="-0.2999999999999998" cx="390" cy="354.9999999999999" r="3" fill="hsl(140, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.18
+x+" data-x="0.6000000000000001" data-y="-0.09999999999999987" cx="390" cy="326.99999999999994" r="3" fill="hsl(141, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.19
+x+" data-x="0.6000000000000001" data-y="0.10000000000000009" cx="390" cy="298.99999999999994" r="3" fill="hsl(142, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.20
+x+" data-x="0.6000000000000001" data-y="0.30000000000000004" cx="390" cy="270.99999999999994" r="3" fill="hsl(164, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.21
+x+" data-x="0.6000000000000001" data-y="0.5" cx="390" cy="242.99999999999994" r="3" fill="hsl(165, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.22
+x+" data-x="0.6000000000000001" data-y="0.7" cx="390" cy="214.99999999999994" r="3" fill="hsl(166, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.23
+x+" data-x="0.6000000000000001" data-y="0.8999999999999999" cx="390" cy="186.99999999999994" r="3" fill="hsl(167, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="P.24
+x+" data-x="0.6000000000000001" data-y="1.0999999999999999" cx="390" cy="158.99999999999997" r="3" fill="hsl(168, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="anchorPoint
+orientation: y+" data-x="-0.8" data-y="1.4999999999999998" cx="194" cy="102.99999999999997" r="3" fill="hsl(40, 100%, 50%, 0.9)"/></g><g><circle data-type="point" data-label="anchorPoint
+orientation: x-" data-x="-0.6000000000000001" data-y="0.8999999999999999" cx="222" cy="186.99999999999994" r="3" fill="hsl(40, 100%, 50%, 0.9)"/></g><g><circle data-type="point" data-label="anchorPoint
+orientation: x+" data-x="0.6000000000000001" data-y="-0.2999999999999998" cx="390" cy="354.9999999999999" r="3" fill="hsl(40, 100%, 50%, 0.9)"/></g><g><circle data-type="point" data-label="anchorPoint
+orientation: x-" data-x="-0.6000000000000001" data-y="0.6999999999999998" cx="222" cy="214.99999999999997" r="3" fill="hsl(40, 100%, 50%, 0.9)"/></g><g><circle data-type="point" data-label="anchorPoint
+orientation: x+" data-x="0.6000000000000001" data-y="-0.4999999999999998" cx="390" cy="382.9999999999999" r="3" fill="hsl(40, 100%, 50%, 0.9)"/></g><g><circle data-type="point" data-label="anchorPoint
+orientation: y-" data-x="-1.1510000000000002" data-y="-1.6" cx="144.85999999999996" cy="537" r="3" fill="hsl(40, 100%, 50%, 0.9)"/></g><g><circle data-type="point" data-label="anchorPoint
+orientation: x-" data-x="-0.6000000000000001" data-y="0.2999999999999998" cx="222" cy="271" r="3" fill="hsl(40, 100%, 50%, 0.9)"/></g><g><circle data-type="point" data-label="anchorPoint
+orientation: x+" data-x="0.6000000000000001" data-y="-0.8999999999999999" cx="390" cy="438.99999999999994" r="3" fill="hsl(40, 100%, 50%, 0.9)"/></g><g><circle data-type="point" data-label="anchorPoint
+orientation: x-" data-x="-0.6000000000000001" data-y="0.09999999999999987" cx="222" cy="298.99999999999994" r="3" fill="hsl(40, 100%, 50%, 0.9)"/></g><g><circle data-type="point" data-label="anchorPoint
+orientation: x+" data-x="0.6000000000000001" data-y="-1.0999999999999999" cx="390" cy="466.9999999999999" r="3" fill="hsl(40, 100%, 50%, 0.9)"/></g><g><circle data-type="point" data-label="anchorPoint
+orientation: x-" data-x="-0.6000000000000001" data-y="-0.10000000000000009" cx="222" cy="326.99999999999994" r="3" fill="hsl(40, 100%, 50%, 0.9)"/></g><g><circle data-type="point" data-label="anchorPoint
+orientation: x+" data-x="0.6000000000000001" data-y="0.10000000000000009" cx="390" cy="298.99999999999994" r="3" fill="hsl(40, 100%, 50%, 0.9)"/></g><g id="crosshair" style="display: none"><line id="crosshair-h" y1="0" y2="640" stroke="#666" stroke-width="0.5"/><line id="crosshair-v" x1="0" x2="640" stroke="#666" stroke-width="0.5"/><text id="coordinates" font-family="monospace" font-size="12" fill="#666"></text></g><script><![CDATA[
+              document.currentScript.parentElement.addEventListener('mousemove', (e) => {
+                const svg = e.currentTarget;
+                const rect = svg.getBoundingClientRect();
+                const x = e.clientX - rect.left;
+                const y = e.clientY - rect.top;
+                const crosshair = svg.getElementById('crosshair');
+                const h = svg.getElementById('crosshair-h');
+                const v = svg.getElementById('crosshair-v');
+                const coords = svg.getElementById('coordinates');
+                
+                crosshair.style.display = 'block';
+                h.setAttribute('x1', '0');
+                h.setAttribute('x2', '640');
+                h.setAttribute('y1', y);
+                h.setAttribute('y2', y);
+                v.setAttribute('x1', x);
+                v.setAttribute('x2', x);
+                v.setAttribute('y1', '0');
+                v.setAttribute('y2', '640');
 
-      crosshair.style.display = 'block';
-      h.setAttribute('x1', '0');
-      h.setAttribute('x2', '640');
-      h.setAttribute('y1', y);
-      h.setAttribute('y2', y);
-      v.setAttribute('x1', x);
-      v.setAttribute('x2', x);
-      v.setAttribute('y1', '0');
-      v.setAttribute('y2', '640');
-
-      // Calculate real coordinates using inverse transformation
-      const matrix = {
-        "a": 140,
-        "c": 0,
-        "e": 306,
-        "b": 0,
-        "d": -140,
-        "f": 312.99999999999994
-      };
-      // Manually invert and apply the affine transform
-      // Since we only use translate and scale, we can directly compute:
-      // x' = (x - tx) / sx
-      // y' = (y - ty) / sy
-      const sx = matrix.a;
-      const sy = matrix.d;
-      const tx = matrix.e;
-      const ty = matrix.f;
-      const realPoint = {
-        x: (x - tx) / sx,
-        y: (y - ty) / sy // Flip y back since we used negative scale
-      }
-
-      coords.textContent = `(${realPoint.x.toFixed(2)}, ${realPoint.y.toFixed(2)})`;
-      coords.setAttribute('x', (x + 5).toString());
-      coords.setAttribute('y', (y - 5).toString());
-    });
-    document.currentScript.parentElement.addEventListener('mouseleave', () => {
-      document.currentScript.parentElement.getElementById('crosshair').style.display = 'none';
-    });
-    ]]>
-  </script>
-</svg>
+                // Calculate real coordinates using inverse transformation
+                const matrix = {"a":140,"c":0,"e":306,"b":0,"d":-140,"f":312.99999999999994};
+                // Manually invert and apply the affine transform
+                // Since we only use translate and scale, we can directly compute:
+                // x' = (x - tx) / sx
+                // y' = (y - ty) / sy
+                const sx = matrix.a;
+                const sy = matrix.d;
+                const tx = matrix.e; 
+                const ty = matrix.f;
+                const realPoint = {
+                  x: (x - tx) / sx,
+                  y: (y - ty) / sy // Flip y back since we used negative scale
+                }
+                
+                coords.textContent = `(${realPoint.x.toFixed(2)}, ${realPoint.y.toFixed(2)})`;
+                coords.setAttribute('x', (x + 5).toString());
+                coords.setAttribute('y', (y - 5).toString());
+              });
+              document.currentScript.parentElement.addEventListener('mouseleave', () => {
+                document.currentScript.parentElement.getElementById('crosshair').style.display = 'none';
+              });
+            ]]></script></svg>

package/tests/examples/__snapshots__/example31.snap.svg

@@ -1,89 +1,48 @@
-<svg width="640" height="640" viewBox="0 0 640 640" xmlns="http://www.w3.org/2000/svg">
-  <rect width="100%" height="100%" fill="white" />
-  <g>
-    <circle data-type="point" data-label="U1.1
-x+" data-x="1.2000000000000002" data-y="0.30000000000000004" cx="338.66666666666674" cy="298.22222222222223" r="3" fill="hsl(319, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="R1.1
-x+" data-x="3" data-y="-0.10000000000000016" cx="562.6666666666667" cy="348" r="3" fill="hsl(226, 100%, 50%, 0.8)" />
-  </g>
-  <g>
-    <circle data-type="point" data-label="anchorPoint
-orientation: y+" data-x="3.2" data-y="0.30000000000000004" cx="587.5555555555557" cy="298.22222222222223" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
-  </g>
-  <g>
-    <polyline data-points="1.2000000000000002,0.30000000000000004 3,-0.10000000000000016" data-type="line" data-label="" points="338.66666666666674,298.22222222222223 562.6666666666667,348" fill="none" stroke="hsl(190, 100%, 50%, 0.8)" stroke-width="1" stroke-dasharray="4 2" />
-  </g>
-  <g>
-    <polyline data-points="1.2000000000000002,0.30000000000000004 3.2,0.30000000000000004 3.2,-0.10000000000000016 3,-0.10000000000000016" data-type="line" data-label="" points="338.66666666666674,298.22222222222223 587.5555555555557,298.22222222222223 587.5555555555557,348 562.6666666666667,348" fill="none" stroke="purple" stroke-width="1" />
-  </g>
-  <g>
-    <rect data-type="rect" data-label="schematic_component_0" data-x="0" data-y="0" x="40.00000000000003" y="273.3333333333333" width="298.66666666666674" height="124.44444444444446" fill="hsl(24, 100%, 50%, 0.8)" stroke="black" stroke-width="0.008035714285714287" />
-  </g>
-  <g>
-    <rect data-type="rect" data-label="schematic_component_1" data-x="2.45" data-y="-0.10000000000000009" x="425.7777777777778" y="323.80111200000005" width="136.8888888888889" height="48.39777599999991" fill="hsl(24, 100%, 50%, 0.8)" stroke="black" stroke-width="0.008035714285714287" />
-  </g>
-  <g>
-    <rect data-type="rect" data-label="netId: VCC
-globalConnNetId: connectivity_net0
-available orientations: y+" data-x="3.2" data-y="0.525" x="575.1111111111111" y="242.22222222222223" width="24.888888888888914" height="56" fill="#ef444466" stroke="#ef4444" stroke-width="0.008035714285714287" />
-  </g>
-  <g id="crosshair" style="display: none">
-    <line id="crosshair-h" y1="0" y2="640" stroke="#666" stroke-width="0.5" />
-    <line id="crosshair-v" x1="0" x2="640" stroke="#666" stroke-width="0.5" /><text id="coordinates" font-family="monospace" font-size="12" fill="#666"></text>
-  </g>
-  <script>
-    <![CDATA[
-    document.currentScript.parentElement.addEventListener('mousemove', (e) => {
-      const svg = e.currentTarget;
-      const rect = svg.getBoundingClientRect();
-      const x = e.clientX - rect.left;
-      const y = e.clientY - rect.top;
-      const crosshair = svg.getElementById('crosshair');
-      const h = svg.getElementById('crosshair-h');
-      const v = svg.getElementById('crosshair-v');
-      const coords = svg.getElementById('coordinates');
+<svg width="640" height="640" viewBox="0 0 640 640" xmlns="http://www.w3.org/2000/svg"><rect width="100%" height="100%" fill="white"/><g><polyline data-points="1.2000000000000002,0.30000000000000004 3,-0.10000000000000016" data-type="line" data-label="" points="338.66666666666674,298.22222222222223 562.6666666666667,348" fill="none" stroke="hsl(190, 100%, 50%, 0.8)" stroke-width="1px" stroke-dasharray="4 2"/></g><g><polyline data-points="1.2000000000000002,0.30000000000000004 3.2,0.30000000000000004 3.2,-0.10000000000000016 3,-0.10000000000000016" data-type="line" data-label="" points="338.66666666666674,298.22222222222223 587.5555555555557,298.22222222222223 587.5555555555557,348 562.6666666666667,348" fill="none" stroke="purple" stroke-width="1px"/></g><g><rect data-type="rect" data-label="schematic_component_0" data-x="0" data-y="0" x="40" y="273.3333333333333" width="298.66666666666674" height="124.44444444444446" fill="hsl(24, 100%, 50%, 0.8)" stroke="black" stroke-width="0.008035714285714287"/></g><g><rect data-type="rect" data-label="schematic_component_1" data-x="2.45" data-y="-0.10000000000000009" x="425.7777777777778" y="323.80111200000005" width="136.8888888888889" height="48.39777599999991" fill="hsl(24, 100%, 50%, 0.8)" stroke="black" stroke-width="0.008035714285714287"/></g><g><rect data-type="rect" data-label="netId: VCC
+globalConnNetId: connectivity_net0" data-x="3.2" data-y="0.525" x="575.1111111111112" y="242.22222222222223" width="24.888888888888914" height="56" fill="#ef444466" stroke="#ef4444" stroke-width="0.008035714285714287"/></g><g><circle data-type="point" data-label="U1.1
+x+" data-x="1.2000000000000002" data-y="0.30000000000000004" cx="338.66666666666674" cy="298.22222222222223" r="3" fill="hsl(319, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="R1.1
+x+" data-x="3" data-y="-0.10000000000000016" cx="562.6666666666667" cy="348" r="3" fill="hsl(226, 100%, 50%, 0.8)"/></g><g><circle data-type="point" data-label="anchorPoint
+orientation: y+" data-x="3.2" data-y="0.30000000000000004" cx="587.5555555555557" cy="298.22222222222223" r="3" fill="hsl(40, 100%, 50%, 0.9)"/></g><g id="crosshair" style="display: none"><line id="crosshair-h" y1="0" y2="640" stroke="#666" stroke-width="0.5"/><line id="crosshair-v" x1="0" x2="640" stroke="#666" stroke-width="0.5"/><text id="coordinates" font-family="monospace" font-size="12" fill="#666"></text></g><script><![CDATA[
+              document.currentScript.parentElement.addEventListener('mousemove', (e) => {
+                const svg = e.currentTarget;
+                const rect = svg.getBoundingClientRect();
+                const x = e.clientX - rect.left;
+                const y = e.clientY - rect.top;
+                const crosshair = svg.getElementById('crosshair');
+                const h = svg.getElementById('crosshair-h');
+                const v = svg.getElementById('crosshair-v');
+                const coords = svg.getElementById('coordinates');
+                
+                crosshair.style.display = 'block';
+                h.setAttribute('x1', '0');
+                h.setAttribute('x2', '640');
+                h.setAttribute('y1', y);
+                h.setAttribute('y2', y);
+                v.setAttribute('x1', x);
+                v.setAttribute('x2', x);
+                v.setAttribute('y1', '0');
+                v.setAttribute('y2', '640');
 
-      crosshair.style.display = 'block';
-      h.setAttribute('x1', '0');
-      h.setAttribute('x2', '640');
-      h.setAttribute('y1', y);
-      h.setAttribute('y2', y);
-      v.setAttribute('x1', x);
-      v.setAttribute('x2', x);
-      v.setAttribute('y1', '0');
-      v.setAttribute('y2', '640');
-
-      // Calculate real coordinates using inverse transformation
-      const matrix = {
-        "a": 124.44444444444444,
-        "c": 0,
-        "e": 189.33333333333337,
-        "b": 0,
-        "d": -124.44444444444444,
-        "f": 335.55555555555554
-      };
-      // Manually invert and apply the affine transform
-      // Since we only use translate and scale, we can directly compute:
-      // x' = (x - tx) / sx
-      // y' = (y - ty) / sy
-      const sx = matrix.a;
-      const sy = matrix.d;
-      const tx = matrix.e;
-      const ty = matrix.f;
-      const realPoint = {
-        x: (x - tx) / sx,
-        y: (y - ty) / sy // Flip y back since we used negative scale
-      }
-
-      coords.textContent = `(${realPoint.x.toFixed(2)}, ${realPoint.y.toFixed(2)})`;
-      coords.setAttribute('x', (x + 5).toString());
-      coords.setAttribute('y', (y - 5).toString());
-    });
-    document.currentScript.parentElement.addEventListener('mouseleave', () => {
-      document.currentScript.parentElement.getElementById('crosshair').style.display = 'none';
-    });
-    ]]>
-  </script>
-</svg>
+                // Calculate real coordinates using inverse transformation
+                const matrix = {"a":124.44444444444444,"c":0,"e":189.33333333333337,"b":0,"d":-124.44444444444444,"f":335.55555555555554};
+                // Manually invert and apply the affine transform
+                // Since we only use translate and scale, we can directly compute:
+                // x' = (x - tx) / sx
+                // y' = (y - ty) / sy
+                const sx = matrix.a;
+                const sy = matrix.d;
+                const tx = matrix.e; 
+                const ty = matrix.f;
+                const realPoint = {
+                  x: (x - tx) / sx,
+                  y: (y - ty) / sy // Flip y back since we used negative scale
+                }
+                
+                coords.textContent = `(${realPoint.x.toFixed(2)}, ${realPoint.y.toFixed(2)})`;
+                coords.setAttribute('x', (x + 5).toString());
+                coords.setAttribute('y', (y - 5).toString());
+              });
+              document.currentScript.parentElement.addEventListener('mouseleave', () => {
+                document.currentScript.parentElement.getElementById('crosshair').style.display = 'none';
+              });
+            ]]></script></svg>