@tscircuit/schematic-trace-solver 0.0.24 → 0.0.26

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (49) hide show
  1. package/.github/workflows/bun-test.yml +8 -0
  2. package/README.md +28 -0
  3. package/bunfig.toml +2 -2
  4. package/dist/index.js +24 -6137
  5. package/lib/solvers/NetLabelPlacementSolver/NetLabelPlacementSolver.ts +0 -1
  6. package/lib/solvers/NetLabelPlacementSolver/SingleNetLabelPlacementSolver/SingleNetLabelPlacementSolver_visualize.ts +0 -1
  7. package/lib/solvers/NetLabelPlacementSolver/SingleNetLabelPlacementSolver/geometry.ts +1 -1
  8. package/lib/solvers/SchematicTraceLinesSolver/SchematicTraceLinesSolver.ts +0 -2
  9. package/lib/solvers/SchematicTraceLinesSolver/SchematicTraceSingleLineSolver/SchematicTraceSingleLineSolver.ts +0 -1
  10. package/lib/solvers/TraceOverlapShiftSolver/TraceOverlapIssueSolver/TraceOverlapIssueSolver.ts +0 -2
  11. package/lib/solvers/TraceOverlapShiftSolver/TraceOverlapShiftSolver.ts +0 -1
  12. package/package.json +6 -7
  13. package/site/components/DownloadDropdown.tsx +4 -2
  14. package/site/examples/example01-basic.page.tsx +1 -1
  15. package/site/examples/example02.page.tsx +1 -1
  16. package/site/examples/example03.page.tsx +1 -1
  17. package/site/examples/example04-single-symbol.page.tsx +1 -1
  18. package/site/examples/example05.page.tsx +1 -1
  19. package/site/examples/example06.page.tsx +1 -1
  20. package/site/examples/example07.page.tsx +1 -1
  21. package/site/examples/example08.page.tsx +1 -1
  22. package/site/examples/example09.page.tsx +1 -1
  23. package/site/examples/example10.page.tsx +1 -1
  24. package/site/examples/example11.page.tsx +119 -0
  25. package/site/examples/example12.page.tsx +97 -0
  26. package/tests/__snapshots__/svg.snap.svg +3 -0
  27. package/tests/examples/__snapshots__/example01.snap.svg +157 -0
  28. package/tests/examples/__snapshots__/example02.snap.svg +262 -0
  29. package/tests/examples/__snapshots__/example03.snap.svg +282 -0
  30. package/tests/examples/__snapshots__/example04.snap.svg +87 -0
  31. package/tests/examples/__snapshots__/example05.snap.svg +190 -0
  32. package/tests/examples/__snapshots__/example06.snap.svg +94 -0
  33. package/tests/examples/__snapshots__/example07.snap.svg +204 -0
  34. package/tests/examples/__snapshots__/example08.snap.svg +136 -0
  35. package/tests/examples/__snapshots__/example09.snap.svg +484 -0
  36. package/tests/examples/__snapshots__/example10.snap.svg +135 -0
  37. package/tests/examples/example01.test.ts +12 -0
  38. package/tests/examples/example02.test.ts +12 -0
  39. package/tests/examples/example03.test.ts +12 -0
  40. package/tests/examples/example04.test.ts +12 -0
  41. package/tests/examples/example05.test.ts +12 -0
  42. package/tests/examples/example06.test.ts +12 -0
  43. package/tests/examples/example07.test.ts +12 -0
  44. package/tests/examples/example08.test.ts +12 -0
  45. package/tests/examples/example09.test.ts +12 -0
  46. package/tests/examples/example10.test.ts +12 -0
  47. package/tests/fixtures/matcher.ts +62 -0
  48. package/tests/fixtures/preload.ts +1 -0
  49. package/tests/svg.test.ts +11 -0
package/tests/examples/__snapshots__/example04.snap.svg ADDED
@@ -0,0 +1,87 @@
1
+ <svg width="640" height="640" viewBox="0 0 640 640" xmlns="http://www.w3.org/2000/svg">
2
+ <rect width="100%" height="100%" fill="white" />
3
+ <g>
4
+ <circle data-type="point" data-label="Q1.1
5
+ y+" data-x="0.30397715550000004" data-y="0.5800832909999993" cx="392.558734745331" cy="211.4140028125427" r="3" fill="hsl(315, 100%, 50%, 0.8)" />
6
+ </g>
7
+ <g>
8
+ <circle data-type="point" data-label="Q1.2
9
+ y-" data-x="0.31067575550000137" data-y="-0.5800832909999993" cx="394.4724578107315" cy="542.8619990624858" r="3" fill="hsl(316, 100%, 50%, 0.8)" />
10
+ </g>
11
+ <g>
12
+ <circle data-type="point" data-label="Q1.3
13
+ x-" data-x="-0.4467558855000001" data-y="-0.10250625000000019" cx="178.0818087429264" cy="406.4230119805196" r="3" fill="hsl(317, 100%, 50%, 0.8)" />
14
+ </g>
15
+ <g>
16
+ <circle data-type="point" data-label="" data-x="0.30397715550000004" data-y="0.7800832909999994" cx="392.558734745331" cy="154.27600187502844" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
17
+ </g>
18
+ <g>
19
+ <polyline data-points="0.30397715550000004,0.5800832909999993 0.31067575550000137,-0.5800832909999993" data-type="line" data-label="" points="392.558734745331,211.4140028125427 394.4724578107315,542.8619990624858" fill="none" stroke="hsl(73, 100%, 50%, 0.8)" stroke-width="1" stroke-dasharray="4 2" />
20
+ </g>
21
+ <g>
22
+ <polyline data-points="0.30397715550000004,0.5800832909999993 0.30397715550000004,0.7800832909999994 0.5467558855000001,0.7800832909999994 0.5467558855000001,-0.7800832909999995 0.31067575550000137,-0.7800832909999995 0.31067575550000137,-0.5800832909999993" data-type="line" data-label="" points="392.558734745331,211.4140028125427 392.558734745331,154.27600187502844 461.91819125707354,154.27600187502844 461.91819125707354,600 394.4724578107315,600 394.4724578107315,542.8619990624858" fill="none" stroke="purple" stroke-width="1" />
23
+ </g>
24
+ <g>
25
+ <rect data-type="rect" data-label="schematic_component_0" data-x="0" data-y="0" x="178.0818087429264" y="211.4140028125427" width="255.26738204539004" height="331.4479962499431" fill="hsl(24, 100%, 50%, 0.8)" stroke="black" stroke-width="0.003500297467857141" />
26
+ </g>
27
+ <g>
28
+ <rect data-type="rect" data-label="" data-x="0.30397715550000004" data-y="0.9800832909999995" x="363.98973427657387" y="40" width="57.13800093751422" height="114.27600187502841" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.003500297467857141" />
29
+ </g>
30
+ <g id="crosshair" style="display: none">
31
+ <line id="crosshair-h" y1="0" y2="640" stroke="#666" stroke-width="0.5" />
32
+ <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>
33
+ </g>
34
+ <script>
35
+ <![CDATA[
36
+ document.currentScript.parentElement.addEventListener('mousemove', (e) => {
37
+ const svg = e.currentTarget;
38
+ const rect = svg.getBoundingClientRect();
39
+ const x = e.clientX - rect.left;
40
+ const y = e.clientY - rect.top;
41
+ const crosshair = svg.getElementById('crosshair');
42
+ const h = svg.getElementById('crosshair-h');
43
+ const v = svg.getElementById('crosshair-v');
44
+ const coords = svg.getElementById('coordinates');
45
+
46
+ crosshair.style.display = 'block';
47
+ h.setAttribute('x1', '0');
48
+ h.setAttribute('x2', '640');
49
+ h.setAttribute('y1', y);
50
+ h.setAttribute('y2', y);
51
+ v.setAttribute('x1', x);
52
+ v.setAttribute('x2', x);
53
+ v.setAttribute('y1', '0');
54
+ v.setAttribute('y2', '640');
55
+
56
+ // Calculate real coordinates using inverse transformation
57
+ const matrix = {
58
+ "a": 285.69000468757116,
59
+ "c": 0,
60
+ "e": 305.7154997656214,
61
+ "b": 0,
62
+ "d": -285.69000468757116,
63
+ "f": 377.1380009375142
64
+ };
65
+ // Manually invert and apply the affine transform
66
+ // Since we only use translate and scale, we can directly compute:
67
+ // x' = (x - tx) / sx
68
+ // y' = (y - ty) / sy
69
+ const sx = matrix.a;
70
+ const sy = matrix.d;
71
+ const tx = matrix.e;
72
+ const ty = matrix.f;
73
+ const realPoint = {
74
+ x: (x - tx) / sx,
75
+ y: (y - ty) / sy // Flip y back since we used negative scale
76
+ }
77
+
78
+ coords.textContent = `(${realPoint.x.toFixed(2)}, ${realPoint.y.toFixed(2)})`;
79
+ coords.setAttribute('x', (x + 5).toString());
80
+ coords.setAttribute('y', (y - 5).toString());
81
+ });
82
+ document.currentScript.parentElement.addEventListener('mouseleave', () => {
83
+ document.currentScript.parentElement.getElementById('crosshair').style.display = 'none';
84
+ });
85
+ ]]>
86
+ </script>
87
+ </svg>
package/tests/examples/__snapshots__/example05.snap.svg ADDED
@@ -0,0 +1,190 @@
1
+ <svg width="640" height="640" viewBox="0 0 640 640" xmlns="http://www.w3.org/2000/svg">
2
+ <rect width="100%" height="100%" fill="white" />
3
+ <g>
4
+ <circle data-type="point" data-label="U1.1
5
+ x+" data-x="0.9" data-y="1.2" cx="329.87551490196074" cy="193.72549019607843" r="3" fill="hsl(319, 100%, 50%, 0.8)" />
6
+ </g>
7
+ <g>
8
+ <circle data-type="point" data-label="U1.2
9
+ x+" data-x="0.9" data-y="0.3999999999999999" cx="329.87551490196074" cy="281.5686274509804" r="3" fill="hsl(320, 100%, 50%, 0.8)" />
10
+ </g>
11
+ <g>
12
+ <circle data-type="point" data-label="U1.3
13
+ x+" data-x="0.9" data-y="0.5999999999999999" cx="329.87551490196074" cy="259.6078431372549" r="3" fill="hsl(321, 100%, 50%, 0.8)" />
14
+ </g>
15
+ <g>
16
+ <circle data-type="point" data-label="U1.4
17
+ x-" data-x="-0.9" data-y="0.3999999999999999" cx="132.22845607843135" cy="281.5686274509804" r="3" fill="hsl(322, 100%, 50%, 0.8)" />
18
+ </g>
19
+ <g>
20
+ <circle data-type="point" data-label="U1.5
21
+ x+" data-x="0.9" data-y="0.9999999999999998" cx="329.87551490196074" cy="215.68627450980395" r="3" fill="hsl(323, 100%, 50%, 0.8)" />
22
+ </g>
23
+ <g>
24
+ <circle data-type="point" data-label="U1.6
25
+ x+" data-x="0.9" data-y="-0.19999999999999996" cx="329.87551490196074" cy="347.45098039215685" r="3" fill="hsl(324, 100%, 50%, 0.8)" />
26
+ </g>
27
+ <g>
28
+ <circle data-type="point" data-label="U1.7
29
+ x-" data-x="-0.9" data-y="-0.7999999999999998" cx="132.22845607843135" cy="413.3333333333333" r="3" fill="hsl(325, 100%, 50%, 0.8)" />
30
+ </g>
31
+ <g>
32
+ <circle data-type="point" data-label="U1.9
33
+ x+" data-x="0.9" data-y="0.19999999999999996" cx="329.87551490196074" cy="303.5294117647059" r="3" fill="hsl(327, 100%, 50%, 0.8)" />
34
+ </g>
35
+ <g>
36
+ <circle data-type="point" data-label="U1.10
37
+ x+" data-x="0.9" data-y="0" cx="329.87551490196074" cy="325.4901960784314" r="3" fill="hsl(217, 100%, 50%, 0.8)" />
38
+ </g>
39
+ <g>
40
+ <circle data-type="point" data-label="U1.11
41
+ x+" data-x="0.9" data-y="0.7999999999999998" cx="329.87551490196074" cy="237.64705882352945" r="3" fill="hsl(218, 100%, 50%, 0.8)" />
42
+ </g>
43
+ <g>
44
+ <circle data-type="point" data-label="U1.12
45
+ x+" data-x="0.9" data-y="-1.2" cx="329.87551490196074" cy="457.2549019607843" r="3" fill="hsl(219, 100%, 50%, 0.8)" />
46
+ </g>
47
+ <g>
48
+ <circle data-type="point" data-label="U1.13
49
+ x+" data-x="0.9" data-y="-1" cx="329.87551490196074" cy="435.29411764705884" r="3" fill="hsl(220, 100%, 50%, 0.8)" />
50
+ </g>
51
+ <g>
52
+ <circle data-type="point" data-label="U1.14
53
+ x+" data-x="0.9" data-y="-0.7999999999999999" cx="329.87551490196074" cy="413.33333333333337" r="3" fill="hsl(221, 100%, 50%, 0.8)" />
54
+ </g>
55
+ <g>
56
+ <circle data-type="point" data-label="U1.15
57
+ x-" data-x="-0.9" data-y="1" cx="132.22845607843135" cy="215.68627450980392" r="3" fill="hsl(222, 100%, 50%, 0.8)" />
58
+ </g>
59
+ <g>
60
+ <circle data-type="point" data-label="U1.16
61
+ x-" data-x="-0.9" data-y="1.2" cx="132.22845607843135" cy="193.72549019607843" r="3" fill="hsl(223, 100%, 50%, 0.8)" />
62
+ </g>
63
+ <g>
64
+ <circle data-type="point" data-label="U1.17
65
+ x-" data-x="-0.9" data-y="0.5999999999999999" cx="132.22845607843135" cy="259.6078431372549" r="3" fill="hsl(224, 100%, 50%, 0.8)" />
66
+ </g>
67
+ <g>
68
+ <circle data-type="point" data-label="U1.18
69
+ x-" data-x="-0.9" data-y="-0.9999999999999998" cx="132.22845607843135" cy="435.2941176470588" r="3" fill="hsl(225, 100%, 50%, 0.8)" />
70
+ </g>
71
+ <g>
72
+ <circle data-type="point" data-label="U1.19
73
+ x-" data-x="-0.9" data-y="-0.19999999999999996" cx="132.22845607843135" cy="347.45098039215685" r="3" fill="hsl(226, 100%, 50%, 0.8)" />
74
+ </g>
75
+ <g>
76
+ <circle data-type="point" data-label="U1.20
77
+ x-" data-x="-0.9" data-y="0.7999999999999999" cx="132.22845607843135" cy="237.64705882352942" r="3" fill="hsl(248, 100%, 50%, 0.8)" />
78
+ </g>
79
+ <g>
80
+ <circle data-type="point" data-label="U1.21
81
+ x-" data-x="-0.9" data-y="-1.2" cx="132.22845607843135" cy="457.2549019607843" r="3" fill="hsl(249, 100%, 50%, 0.8)" />
82
+ </g>
83
+ <g>
84
+ <circle data-type="point" data-label="U1.22
85
+ x+" data-x="0.9" data-y="-0.5999999999999999" cx="329.87551490196074" cy="391.37254901960785" r="3" fill="hsl(250, 100%, 50%, 0.8)" />
86
+ </g>
87
+ <g>
88
+ <circle data-type="point" data-label="U1.23
89
+ x+" data-x="0.9" data-y="-0.3999999999999999" cx="329.87551490196074" cy="369.4117647058824" r="3" fill="hsl(251, 100%, 50%, 0.8)" />
90
+ </g>
91
+ <g>
92
+ <circle data-type="point" data-label="U1.25
93
+ x-" data-x="-0.9" data-y="-0.5999999999999999" cx="132.22845607843135" cy="391.37254901960785" r="3" fill="hsl(253, 100%, 50%, 0.8)" />
94
+ </g>
95
+ <g>
96
+ <circle data-type="point" data-label="U1.26
97
+ x-" data-x="-0.9" data-y="-0.3999999999999999" cx="132.22845607843135" cy="369.4117647058824" r="3" fill="hsl(254, 100%, 50%, 0.8)" />
98
+ </g>
99
+ <g>
100
+ <circle data-type="point" data-label="U1.27
101
+ x-" data-x="-0.9" data-y="0.19999999999999996" cx="132.22845607843135" cy="303.5294117647059" r="3" fill="hsl(255, 100%, 50%, 0.8)" />
102
+ </g>
103
+ <g>
104
+ <circle data-type="point" data-label="U1.28
105
+ x-" data-x="-0.9" data-y="0" cx="132.22845607843135" cy="325.4901960784314" r="3" fill="hsl(256, 100%, 50%, 0.8)" />
106
+ </g>
107
+ <g>
108
+ <circle data-type="point" data-label="LED1.1
109
+ x-" data-x="1.4798754500000002" data-y="1.0005122999999987" cx="393.54811333333333" cy="215.63002196078446" r="3" fill="hsl(57, 100%, 50%, 0.8)" />
110
+ </g>
111
+ <g>
112
+ <circle data-type="point" data-label="LED1.2
113
+ x+" data-x="2.52012455" data-y="0.9994877000000013" cx="507.7715439215686" cy="215.74252705882338" r="3" fill="hsl(58, 100%, 50%, 0.8)" />
114
+ </g>
115
+ <g>
116
+ <circle data-type="point" data-label="" data-x="2.6201245500000003" data-y="0.9994877000000013" cx="518.7519360784314" cy="215.74252705882338" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
117
+ </g>
118
+ <g>
119
+ <polyline data-points="2.52012455,0.9994877000000013 -0.9,0.7999999999999999" data-type="line" data-label="" points="507.7715439215686,215.74252705882338 132.22845607843135,237.64705882352942" fill="none" stroke="hsl(248, 100%, 50%, 0.8)" stroke-width="1" />
120
+ </g>
121
+ <g>
122
+ <polyline data-points="2.5201245500000002,0.9994877000000013 2.7201245500000004,0.9994877000000013 2.7201245500000004,2.6 -1.1,2.6 -1.1,0.7999999999999999 -0.9,0.7999999999999999" data-type="line" data-label="" points="507.77154392156865,215.74252705882338 529.7323282352942,215.74252705882338 529.7323282352942,40 110.26767176470584,40 110.26767176470584,237.64705882352942 132.22845607843135,237.64705882352942" fill="none" stroke="purple" stroke-width="1" />
123
+ </g>
124
+ <g>
125
+ <rect data-type="rect" data-label="schematic_component_0" data-x="0" data-y="0" x="132.22845607843135" y="50.98039215686276" width="197.6470588235294" height="549.0196078431372" fill="hsl(24, 100%, 50%, 0.8)" stroke="black" stroke-width="0.009107142857142857" />
126
+ </g>
127
+ <g>
128
+ <rect data-type="rect" data-label="schematic_component_1" data-x="2" data-y="1" x="393.54811333333333" y="185.61698666666672" width="114.22343058823526" height="60.13857568627441" fill="hsl(24, 100%, 50%, 0.8)" stroke="black" stroke-width="0.009107142857142857" />
129
+ </g>
130
+ <g>
131
+ <rect data-type="rect" data-label="" data-x="2.6201245500000003" data-y="0.7994877000000014" x="507.77154392156865" y="215.74252705882338" width="21.960784313725526" height="43.921568627450995" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.009107142857142857" />
132
+ </g>
133
+ <g id="crosshair" style="display: none">
134
+ <line id="crosshair-h" y1="0" y2="640" stroke="#666" stroke-width="0.5" />
135
+ <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>
136
+ </g>
137
+ <script>
138
+ <![CDATA[
139
+ document.currentScript.parentElement.addEventListener('mousemove', (e) => {
140
+ const svg = e.currentTarget;
141
+ const rect = svg.getBoundingClientRect();
142
+ const x = e.clientX - rect.left;
143
+ const y = e.clientY - rect.top;
144
+ const crosshair = svg.getElementById('crosshair');
145
+ const h = svg.getElementById('crosshair-h');
146
+ const v = svg.getElementById('crosshair-v');
147
+ const coords = svg.getElementById('coordinates');
148
+
149
+ crosshair.style.display = 'block';
150
+ h.setAttribute('x1', '0');
151
+ h.setAttribute('x2', '640');
152
+ h.setAttribute('y1', y);
153
+ h.setAttribute('y2', y);
154
+ v.setAttribute('x1', x);
155
+ v.setAttribute('x2', x);
156
+ v.setAttribute('y1', '0');
157
+ v.setAttribute('y2', '640');
158
+
159
+ // Calculate real coordinates using inverse transformation
160
+ const matrix = {
161
+ "a": 109.80392156862746,
162
+ "c": 0,
163
+ "e": 231.05198549019605,
164
+ "b": 0,
165
+ "d": -109.80392156862746,
166
+ "f": 325.4901960784314
167
+ };
168
+ // Manually invert and apply the affine transform
169
+ // Since we only use translate and scale, we can directly compute:
170
+ // x' = (x - tx) / sx
171
+ // y' = (y - ty) / sy
172
+ const sx = matrix.a;
173
+ const sy = matrix.d;
174
+ const tx = matrix.e;
175
+ const ty = matrix.f;
176
+ const realPoint = {
177
+ x: (x - tx) / sx,
178
+ y: (y - ty) / sy // Flip y back since we used negative scale
179
+ }
180
+
181
+ coords.textContent = `(${realPoint.x.toFixed(2)}, ${realPoint.y.toFixed(2)})`;
182
+ coords.setAttribute('x', (x + 5).toString());
183
+ coords.setAttribute('y', (y - 5).toString());
184
+ });
185
+ document.currentScript.parentElement.addEventListener('mouseleave', () => {
186
+ document.currentScript.parentElement.getElementById('crosshair').style.display = 'none';
187
+ });
188
+ ]]>
189
+ </script>
190
+ </svg>
package/tests/examples/__snapshots__/example06.snap.svg ADDED
@@ -0,0 +1,94 @@
1
+ <svg width="640" height="640" viewBox="0 0 640 640" xmlns="http://www.w3.org/2000/svg">
2
+ <rect width="100%" height="100%" fill="white" />
3
+ <g>
4
+ <circle data-type="point" data-label="R1.1
5
+ x-" data-x="-3.5512907000000005" data-y="0.0002732499999993365" cx="62.695035460992926" cy="319.979328605201" r="3" fill="hsl(226, 100%, 50%, 0.8)" />
6
+ </g>
7
+ <g>
8
+ <circle data-type="point" data-label="R1.2
9
+ x+" data-x="-2.4487092999999995" data-y="-0.0002732499999993365" cx="146.10544869976368" cy="320.020671394799" r="3" fill="hsl(227, 100%, 50%, 0.8)" />
10
+ </g>
11
+ <g>
12
+ <circle data-type="point" data-label="C1.1
13
+ x-" data-x="2.4487906999999995" data-y="-0.00027334999999961695" cx="516.6019026004727" cy="320.0206789598108" r="3" fill="hsl(121, 100%, 50%, 0.8)" />
14
+ </g>
15
+ <g>
16
+ <circle data-type="point" data-label="C1.2
17
+ x+" data-x="3.5512093000000005" data-y="0.00027334999999961695" cx="600" cy="319.9793210401892" r="3" fill="hsl(122, 100%, 50%, 0.8)" />
18
+ </g>
19
+ <g>
20
+ <circle data-type="point" data-label="" data-x="-3.7512907000000006" data-y="0.0002732499999993365" cx="47.565011820330994" cy="319.979328605201" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
21
+ </g>
22
+ <g>
23
+ <polyline data-points="-3.5512907000000005,0.0002732499999993365 2.4487906999999995,-0.00027334999999961695" data-type="line" data-label="" points="62.695035460992926,319.979328605201 516.6019026004727,320.0206789598108" fill="none" stroke="hsl(72, 100%, 50%, 0.8)" stroke-width="1" />
24
+ </g>
25
+ <g>
26
+ <polyline data-points="-3.5512907000000005,0.0002732499999993365 -3.7512907000000006,0.0002732499999993365 -3.7512907000000006,0.20027324999999935 2.2487906999999994,0.20027324999999935 2.2487906999999994,-0.00027334999999961695 2.4487906999999987,-0.00027334999999961695" data-type="line" data-label="" points="62.695035460992926,319.979328605201 47.565011820330994,319.979328605201 47.565011820330994,304.84930496453904 501.4718789598108,304.84930496453904 501.4718789598108,320.0206789598108 516.6019026004726,320.0206789598108" fill="none" stroke="purple" stroke-width="1" />
27
+ </g>
28
+ <g>
29
+ <rect data-type="rect" data-label="schematic_component_0" data-x="-3" data-y="0" x="62.695035460992926" y="305.2894297872341" width="83.41041323877076" height="29.421140425531803" fill="hsl(24, 100%, 50%, 0.8)" stroke="black" stroke-width="0.013218750000000003" />
30
+ </g>
31
+ <g>
32
+ <rect data-type="rect" data-label="schematic_component_1" data-x="3" data-y="0" x="516.6019026004727" y="288.22629598108733" width="83.39809739952727" height="63.547408037825335" fill="hsl(24, 100%, 50%, 0.8)" stroke="black" stroke-width="0.013218750000000003" />
33
+ </g>
34
+ <g>
35
+ <rect data-type="rect" data-label="" data-x="-3.7512907000000006" data-y="-0.19972675000000067" x="40" y="319.979328605201" width="15.130023640661989" height="30.260047281323864" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.013218750000000003" />
36
+ </g>
37
+ <g id="crosshair" style="display: none">
38
+ <line id="crosshair-h" y1="0" y2="640" stroke="#666" stroke-width="0.5" />
39
+ <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>
40
+ </g>
41
+ <script>
42
+ <![CDATA[
43
+ document.currentScript.parentElement.addEventListener('mousemove', (e) => {
44
+ const svg = e.currentTarget;
45
+ const rect = svg.getBoundingClientRect();
46
+ const x = e.clientX - rect.left;
47
+ const y = e.clientY - rect.top;
48
+ const crosshair = svg.getElementById('crosshair');
49
+ const h = svg.getElementById('crosshair-h');
50
+ const v = svg.getElementById('crosshair-v');
51
+ const coords = svg.getElementById('coordinates');
52
+
53
+ crosshair.style.display = 'block';
54
+ h.setAttribute('x1', '0');
55
+ h.setAttribute('x2', '640');
56
+ h.setAttribute('y1', y);
57
+ h.setAttribute('y2', y);
58
+ v.setAttribute('x1', x);
59
+ v.setAttribute('x2', x);
60
+ v.setAttribute('y1', '0');
61
+ v.setAttribute('y2', '640');
62
+
63
+ // Calculate real coordinates using inverse transformation
64
+ const matrix = {
65
+ "a": 75.65011820330967,
66
+ "c": 0,
67
+ "e": 331.3505966903073,
68
+ "b": 0,
69
+ "d": -75.65011820330967,
70
+ "f": 320
71
+ };
72
+ // Manually invert and apply the affine transform
73
+ // Since we only use translate and scale, we can directly compute:
74
+ // x' = (x - tx) / sx
75
+ // y' = (y - ty) / sy
76
+ const sx = matrix.a;
77
+ const sy = matrix.d;
78
+ const tx = matrix.e;
79
+ const ty = matrix.f;
80
+ const realPoint = {
81
+ x: (x - tx) / sx,
82
+ y: (y - ty) / sy // Flip y back since we used negative scale
83
+ }
84
+
85
+ coords.textContent = `(${realPoint.x.toFixed(2)}, ${realPoint.y.toFixed(2)})`;
86
+ coords.setAttribute('x', (x + 5).toString());
87
+ coords.setAttribute('y', (y - 5).toString());
88
+ });
89
+ document.currentScript.parentElement.addEventListener('mouseleave', () => {
90
+ document.currentScript.parentElement.getElementById('crosshair').style.display = 'none';
91
+ });
92
+ ]]>
93
+ </script>
94
+ </svg>
package/tests/examples/__snapshots__/example07.snap.svg ADDED
@@ -0,0 +1,204 @@
1
+ <svg width="640" height="640" viewBox="0 0 640 640" xmlns="http://www.w3.org/2000/svg">
2
+ <rect width="100%" height="100%" fill="white" />
3
+ <g>
4
+ <circle data-type="point" data-label="U3.8
5
+ x-" data-x="-1.4" data-y="0.42500000000000004" cx="179.40828494934013" cy="361.51936200417583" r="3" fill="hsl(88, 100%, 50%, 0.8)" />
6
+ </g>
7
+ <g>
8
+ <circle data-type="point" data-label="U3.4
9
+ x-" data-x="-1.4" data-y="-0.42500000000000004" cx="179.40828494934013" cy="462.0115589566159" r="3" fill="hsl(84, 100%, 50%, 0.8)" />
10
+ </g>
11
+ <g>
12
+ <circle data-type="point" data-label="U3.1
13
+ x+" data-x="1.4" data-y="0.5" cx="510.44140432208394" cy="352.65240344954873" r="3" fill="hsl(81, 100%, 50%, 0.8)" />
14
+ </g>
15
+ <g>
16
+ <circle data-type="point" data-label="U3.6
17
+ x+" data-x="1.4" data-y="0.30000000000000004" cx="510.44140432208394" cy="376.29762626188756" r="3" fill="hsl(86, 100%, 50%, 0.8)" />
18
+ </g>
19
+ <g>
20
+ <circle data-type="point" data-label="U3.5
21
+ x+" data-x="1.4" data-y="0.10000000000000009" cx="510.44140432208394" cy="399.94284907422644" r="3" fill="hsl(85, 100%, 50%, 0.8)" />
22
+ </g>
23
+ <g>
24
+ <circle data-type="point" data-label="U3.2
25
+ x+" data-x="1.4" data-y="-0.09999999999999998" cx="510.44140432208394" cy="423.5880718865653" r="3" fill="hsl(82, 100%, 50%, 0.8)" />
26
+ </g>
27
+ <g>
28
+ <circle data-type="point" data-label="U3.3
29
+ x+" data-x="1.4" data-y="-0.3" cx="510.44140432208394" cy="447.2332946989041" r="3" fill="hsl(83, 100%, 50%, 0.8)" />
30
+ </g>
31
+ <g>
32
+ <circle data-type="point" data-label="U3.7
33
+ x+" data-x="1.4" data-y="-0.5" cx="510.44140432208394" cy="470.878517511243" r="3" fill="hsl(87, 100%, 50%, 0.8)" />
34
+ </g>
35
+ <g>
36
+ <circle data-type="point" data-label="C20.1
37
+ y+" data-x="-2.3148566499999994" data-y="0.5512093000000002" cx="71.2483382963407" cy="346.5981269067292" r="3" fill="hsl(140, 100%, 50%, 0.8)" />
38
+ </g>
39
+ <g>
40
+ <circle data-type="point" data-label="C20.2
41
+ y-" data-x="-2.31430995" data-y="-0.5512093000000002" cx="71.31297251289817" cy="476.9327940540625" r="3" fill="hsl(141, 100%, 50%, 0.8)" />
42
+ </g>
43
+ <g>
44
+ <circle data-type="point" data-label="R11.1
45
+ y+" data-x="1.7580660749999977" data-y="2.3025814000000002" cx="552.7741649466568" cy="139.5402092476603" r="3" fill="hsl(125, 100%, 50%, 0.8)" />
46
+ </g>
47
+ <g>
48
+ <circle data-type="point" data-label="R11.2
49
+ y-" data-x="1.757519574999999" data-y="1.2" cx="552.7095543753222" cy="269.89412360636277" r="3" fill="hsl(126, 100%, 50%, 0.8)" />
50
+ </g>
51
+ <g>
52
+ <circle data-type="point" data-label="" data-x="-1.8574283249999997" data-y="0.7512093000000004" cx="125.32831162284043" cy="322.9529040943903" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
53
+ </g>
54
+ <g>
55
+ <circle data-type="point" data-label="" data-x="1.5999999999999999" data-y="-0.3" cx="534.0866271344228" cy="447.2332946989041" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
56
+ </g>
57
+ <g>
58
+ <circle data-type="point" data-label="" data-x="1.7580660749999977" data-y="2.3025814000000002" cx="552.7741649466568" cy="139.5402092476603" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
59
+ </g>
60
+ <g>
61
+ <circle data-type="point" data-label="" data-x="-2.31430995" data-y="-0.7512093000000004" cx="71.31297251289817" cy="500.5780168664014" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
62
+ </g>
63
+ <g>
64
+ <circle data-type="point" data-label="" data-x="1.757519574999999" data-y="0.85" cx="552.7095543753222" cy="311.2732635279558" r="3" fill="hsl(40, 100%, 50%, 0.9)" />
65
+ </g>
66
+ <g>
67
+ <polyline data-points="-2.3148566499999994,0.5512093000000002 -1.4,0.42500000000000004" data-type="line" data-label="" points="71.2483382963407,346.5981269067292 179.40828494934013,361.51936200417583" fill="none" stroke="hsl(256, 100%, 50%, 0.8)" stroke-width="1" />
68
+ </g>
69
+ <g>
70
+ <polyline data-points="-2.31430995,-0.5512093000000002 -1.4,-0.42500000000000004" data-type="line" data-label="" points="71.31297251289817,476.9327940540625 179.40828494934013,462.0115589566159" fill="none" stroke="hsl(256, 100%, 50%, 0.8)" stroke-width="1" />
71
+ </g>
72
+ <g>
73
+ <polyline data-points="1.757519574999999,1.2 1.4,0.5" data-type="line" data-label="" points="552.7095543753222,269.89412360636277 510.44140432208394,352.65240344954873" fill="none" stroke="hsl(144, 100%, 50%, 0.8)" stroke-width="1" />
74
+ </g>
75
+ <g>
76
+ <polyline data-points="-1.4,0.42500000000000004 1.4,-0.3" data-type="line" data-label="" points="179.40828494934013,361.51936200417583 510.44140432208394,447.2332946989041" fill="none" stroke="hsl(73, 100%, 50%, 0.8)" stroke-width="1" stroke-dasharray="4 2" />
77
+ </g>
78
+ <g>
79
+ <polyline data-points="-1.4,0.42500000000000004 1.4,-0.5" data-type="line" data-label="" points="179.40828494934013,361.51936200417583 510.44140432208394,470.878517511243" fill="none" stroke="hsl(73, 100%, 50%, 0.8)" stroke-width="1" stroke-dasharray="4 2" />
80
+ </g>
81
+ <g>
82
+ <polyline data-points="-1.4,0.42500000000000004 -2.3148566499999994,0.5512093000000002" data-type="line" data-label="" points="179.40828494934013,361.51936200417583 71.2483382963407,346.5981269067292" fill="none" stroke="hsl(73, 100%, 50%, 0.8)" stroke-width="1" stroke-dasharray="4 2" />
83
+ </g>
84
+ <g>
85
+ <polyline data-points="-1.4,0.42500000000000004 1.7580660749999977,2.3025814000000002" data-type="line" data-label="" points="179.40828494934013,361.51936200417583 552.7741649466568,139.5402092476603" fill="none" stroke="hsl(73, 100%, 50%, 0.8)" stroke-width="1" stroke-dasharray="4 2" />
86
+ </g>
87
+ <g>
88
+ <polyline data-points="1.4,-0.3 1.4,-0.5" data-type="line" data-label="" points="510.44140432208394,447.2332946989041 510.44140432208394,470.878517511243" fill="none" stroke="hsl(73, 100%, 50%, 0.8)" stroke-width="1" stroke-dasharray="4 2" />
89
+ </g>
90
+ <g>
91
+ <polyline data-points="1.4,-0.3 -2.3148566499999994,0.5512093000000002" data-type="line" data-label="" points="510.44140432208394,447.2332946989041 71.2483382963407,346.5981269067292" fill="none" stroke="hsl(73, 100%, 50%, 0.8)" stroke-width="1" stroke-dasharray="4 2" />
92
+ </g>
93
+ <g>
94
+ <polyline data-points="1.4,-0.3 1.7580660749999977,2.3025814000000002" data-type="line" data-label="" points="510.44140432208394,447.2332946989041 552.7741649466568,139.5402092476603" fill="none" stroke="hsl(73, 100%, 50%, 0.8)" stroke-width="1" stroke-dasharray="4 2" />
95
+ </g>
96
+ <g>
97
+ <polyline data-points="1.4,-0.5 -2.3148566499999994,0.5512093000000002" data-type="line" data-label="" points="510.44140432208394,470.878517511243 71.2483382963407,346.5981269067292" fill="none" stroke="hsl(73, 100%, 50%, 0.8)" stroke-width="1" stroke-dasharray="4 2" />
98
+ </g>
99
+ <g>
100
+ <polyline data-points="1.4,-0.5 1.7580660749999977,2.3025814000000002" data-type="line" data-label="" points="510.44140432208394,470.878517511243 552.7741649466568,139.5402092476603" fill="none" stroke="hsl(73, 100%, 50%, 0.8)" stroke-width="1" stroke-dasharray="4 2" />
101
+ </g>
102
+ <g>
103
+ <polyline data-points="-2.3148566499999994,0.5512093000000002 1.7580660749999977,2.3025814000000002" data-type="line" data-label="" points="71.2483382963407,346.5981269067292 552.7741649466568,139.5402092476603" fill="none" stroke="hsl(73, 100%, 50%, 0.8)" stroke-width="1" stroke-dasharray="4 2" />
104
+ </g>
105
+ <g>
106
+ <polyline data-points="-1.4,-0.42500000000000004 -2.31430995,-0.5512093000000002" data-type="line" data-label="" points="179.40828494934013,462.0115589566159 71.31297251289817,476.9327940540625" fill="none" stroke="hsl(157, 100%, 50%, 0.8)" stroke-width="1" stroke-dasharray="4 2" />
107
+ </g>
108
+ <g>
109
+ <polyline data-points="1.4,0.5 1.757519574999999,1.2" data-type="line" data-label="" points="510.44140432208394,352.65240344954873 552.7095543753222,269.89412360636277" fill="none" stroke="hsl(304, 100%, 50%, 0.8)" stroke-width="1" stroke-dasharray="4 2" />
110
+ </g>
111
+ <g>
112
+ <polyline data-points="-1.4,0.42500000000000004 -1.8574283249999997,0.42500000000000004 -1.8574283249999997,0.7512093000000004 -2.3148566499999994,0.7512093000000004 -2.3148566499999994,0.5512093000000002" data-type="line" data-label="" points="179.40828494934013,361.51936200417583 125.32831162284043,361.51936200417583 125.32831162284043,322.9529040943903 71.2483382963407,322.9529040943903 71.2483382963407,346.5981269067292" fill="none" stroke="purple" stroke-width="1" />
113
+ </g>
114
+ <g>
115
+ <polyline data-points="1.4,-0.5 1.5999999999999999,-0.5 1.5999999999999999,-0.3 1.4,-0.3" data-type="line" data-label="" points="510.44140432208394,470.878517511243 534.0866271344228,470.878517511243 534.0866271344228,447.2332946989041 510.44140432208394,447.2332946989041" fill="none" stroke="purple" stroke-width="1" />
116
+ </g>
117
+ <g>
118
+ <polyline data-points="-2.31430995,-0.5512093000000002 -2.31430995,-0.7512093000000004 -1.857154975,-0.7512093000000004 -1.857154975,-0.42500000000000004 -1.4,-0.42500000000000004" data-type="line" data-label="" points="71.31297251289817,476.9327940540625 71.31297251289817,500.5780168664014 125.36062873111914,500.5780168664014 125.36062873111914,462.0115589566159 179.40828494934013,462.0115589566159" fill="none" stroke="purple" stroke-width="1" />
119
+ </g>
120
+ <g>
121
+ <polyline data-points="1.757519574999999,1.2 1.757519574999999,0.5 1.4,0.5" data-type="line" data-label="" points="552.7095543753222,269.89412360636277 552.7095543753222,352.65240344954873 510.44140432208394,352.65240344954873" fill="none" stroke="purple" stroke-width="1" />
122
+ </g>
123
+ <g>
124
+ <rect data-type="rect" data-label="schematic_component_0" data-x="0" data-y="0" x="179.40828494934013" y="329.0071806372099" width="331.03311937274384" height="165.51655968637192" fill="hsl(24, 100%, 50%, 0.8)" stroke="black" stroke-width="0.008458368169642856" />
125
+ </g>
126
+ <g>
127
+ <rect data-type="rect" data-label="schematic_component_1" data-x="-2.3145833" data-y="0" x="40" y="346.5981269067292" width="62.561310809238904" height="130.33466714733333" fill="hsl(24, 100%, 50%, 0.8)" stroke="black" stroke-width="0.008458368169642856" />
128
+ </g>
129
+ <g>
130
+ <rect data-type="rect" data-label="schematic_component_2" data-x="1.7577928249999983" data-y="1.7512907000000002" x="534.0866271344228" y="139.5402092476603" width="37.3104650531335" height="130.35391435870247" fill="hsl(24, 100%, 50%, 0.8)" stroke="black" stroke-width="0.008458368169642856" />
131
+ </g>
132
+ <g>
133
+ <rect data-type="rect" data-label="" data-x="-1.8574283249999997" data-y="0.9512093000000004" x="113.50570021667099" y="275.66245846971265" width="23.645222812338858" height="47.29044562467766" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.008458368169642856" />
134
+ </g>
135
+ <g>
136
+ <rect data-type="rect" data-label="" data-x="1.5999999999999999" data-y="-0.09999999999999998" x="522.2640157282533" y="399.94284907422644" width="23.645222812338943" height="47.29044562467766" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.008458368169642856" />
137
+ </g>
138
+ <g>
139
+ <rect data-type="rect" data-label="" data-x="1.7580660749999977" data-y="2.5035814000000003" x="540.9515535404873" y="92.13153750892087" width="23.645222812338943" height="47.290445624677716" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.008458368169642856" />
140
+ </g>
141
+ <g>
142
+ <rect data-type="rect" data-label="" data-x="-2.31430995" data-y="-0.9512093000000004" x="59.4903611067287" y="500.5780168664014" width="23.645222812338886" height="47.29044562467766" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.008458368169642856" />
143
+ </g>
144
+ <g>
145
+ <rect data-type="rect" data-label="" data-x="1.957519574999999" data-y="0.85" x="552.7095543753222" y="299.45065212178633" width="47.29044562467766" height="23.64522281233883" fill="hsl(40, 100%, 50%, 0.35)" stroke="black" stroke-width="0.008458368169642856" />
146
+ </g>
147
+ <g id="crosshair" style="display: none">
148
+ <line id="crosshair-h" y1="0" y2="640" stroke="#666" stroke-width="0.5" />
149
+ <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>
150
+ </g>
151
+ <script>
152
+ <![CDATA[
153
+ document.currentScript.parentElement.addEventListener('mousemove', (e) => {
154
+ const svg = e.currentTarget;
155
+ const rect = svg.getBoundingClientRect();
156
+ const x = e.clientX - rect.left;
157
+ const y = e.clientY - rect.top;
158
+ const crosshair = svg.getElementById('crosshair');
159
+ const h = svg.getElementById('crosshair-h');
160
+ const v = svg.getElementById('crosshair-v');
161
+ const coords = svg.getElementById('coordinates');
162
+
163
+ crosshair.style.display = 'block';
164
+ h.setAttribute('x1', '0');
165
+ h.setAttribute('x2', '640');
166
+ h.setAttribute('y1', y);
167
+ h.setAttribute('y2', y);
168
+ v.setAttribute('x1', x);
169
+ v.setAttribute('x2', x);
170
+ v.setAttribute('y1', '0');
171
+ v.setAttribute('y2', '640');
172
+
173
+ // Calculate real coordinates using inverse transformation
174
+ const matrix = {
175
+ "a": 118.22611406169422,
176
+ "c": 0,
177
+ "e": 344.924844635712,
178
+ "b": 0,
179
+ "d": -118.22611406169422,
180
+ "f": 411.76546048039586
181
+ };
182
+ // Manually invert and apply the affine transform
183
+ // Since we only use translate and scale, we can directly compute:
184
+ // x' = (x - tx) / sx
185
+ // y' = (y - ty) / sy
186
+ const sx = matrix.a;
187
+ const sy = matrix.d;
188
+ const tx = matrix.e;
189
+ const ty = matrix.f;
190
+ const realPoint = {
191
+ x: (x - tx) / sx,
192
+ y: (y - ty) / sy // Flip y back since we used negative scale
193
+ }
194
+
195
+ coords.textContent = `(${realPoint.x.toFixed(2)}, ${realPoint.y.toFixed(2)})`;
196
+ coords.setAttribute('x', (x + 5).toString());
197
+ coords.setAttribute('y', (y - 5).toString());
198
+ });
199
+ document.currentScript.parentElement.addEventListener('mouseleave', () => {
200
+ document.currentScript.parentElement.getElementById('crosshair').style.display = 'none';
201
+ });
202
+ ]]>
203
+ </script>
204
+ </svg>