@tscircuit/pcb-viewer 1.5.0 → 1.6.0

package/dist/index.js

@@ -13390,7 +13390,7 @@ var import_soup2 = __toESM(require_dist());
 // package.json
 var package_default = {
     name: "@tscircuit/pcb-viewer",
-    version: "1.4.6",
+    version: "1.5.0",
     main: "dist/index.js",
     repository: "tscircuit/pcb-viewer",
     license: "MIT",
@@ -14243,48 +14243,57 @@ var EditTraceHintOverlay = function(param) {
                     var route = e.route;
                     var pcb_port = (0, import_soup_util2.su)(soup).pcb_port.get(e.pcb_port_id);
                     var pcb_port_screen = (0, import_transformation_matrix6.applyToPoint)(transform, pcb_port);
-                    return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react13.Fragment, {
+                    var strokeInput = [
+                        {
+                            x: pcb_port_screen.x,
+                            y: pcb_port_screen.y,
+                            trace_width: 0.5
+                        }
+                    ].concat(// Start with a small width
+                    _to_consumable_array(route.map(function(r) {
+                        if (r === void 0) {
+                            throw new Error("route contains undefined point");
+                        }
+                        return {
+                            x: (0, import_transformation_matrix6.applyToPoint)(transform, r).x,
+                            y: (0, import_transformation_matrix6.applyToPoint)(transform, r).y,
+                            trace_width: r.trace_width
+                        };
+                    })));
+                    var expandedStroke = getExpandedStroke(strokeInput, 0.5);
+                    var expandedPath = expandedStroke.map(function(point, index) {
+                        return "".concat(index === 0 ? "M" : "L", " ").concat(point.x, ",").concat(point.y);
+                    }).join(" ") + " Z";
+                    var originalPath = strokeInput.map(function(point, index) {
+                        return "".concat(index === 0 ? "M" : "L", " ").concat(point.x, ",").concat(point.y);
+                    }).join(" ");
+                    return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("g", {
                         children: [
-                            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("rect", {
-                                x: pcb_port_screen.x - 10,
-                                y: pcb_port_screen.y - 10,
-                                width: 20,
-                                height: 20,
+                            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("path", {
+                                d: expandedPath,
+                                fill: "red"
+                            }, "expanded-path-".concat(e.pcb_port_id)),
+                            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("path", {
+                                d: originalPath,
+                                style: {
+                                    mixBlendMode: "difference"
+                                },
                                 stroke: "red"
-                            }, "rect-".concat(e.pcb_port_id)),
-                            route.map(function(r, index) {
-                                var start = index === 0 ? pcb_port_screen : (0, import_transformation_matrix6.applyToPoint)(transform, route[index - 1]);
-                                var end = (0, import_transformation_matrix6.applyToPoint)(transform, r);
-                                var width = r === null || r === void 0 ? void 0 : r.trace_width;
-                                var angle = Math.atan2(end.y - start.y, end.x - start.x);
-                                var dx = width !== null && width !== void 0 ? width : 0.5 * Math.sin(angle);
-                                var dy = width !== null && width !== void 0 ? width : 0.5 * -Math.cos(angle);
-                                var topLeft = "".concat(start.x - dx, ",").concat(start.y - dy);
-                                var topRight = "".concat(end.x - dx, ",").concat(end.y - dy);
-                                var bottomRight = "".concat(end.x + dx, ",").concat(end.y + dy);
-                                var bottomLeft = "".concat(start.x + dx, ",").concat(start.y + dy);
-                                return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("path", {
-                                    fill: "red",
-                                    d: "M ".concat(topLeft, " L ").concat(topRight, " L ").concat(bottomRight, " L ").concat(bottomLeft, " Z")
-                                }, "path-".concat(e.pcb_port_id, "-").concat(index));
-                            }),
-                            route.map(function(r) {
-                                return _object_spread({}, r, (0, import_transformation_matrix6.applyToPoint)(transform, r));
-                            }).map(function(r, i) {
-                                return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react13.Fragment, {
+                            }, "original-path-".concat(e.pcb_port_id)),
+                            strokeInput.map(function(r, i) {
+                                return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("g", {
                                     children: [
                                         /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("circle", {
                                             cx: r.x,
                                             cy: r.y,
-                                            r: 8,
+                                            r: r.trace_width ? r.trace_width / 2 : 8,
                                             stroke: "red"
                                         }),
                                         r.via && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("circle", {
                                             cx: r.x,
                                             cy: r.y,
-                                            r: 16,
-                                            stroke: "red",
-                                            fill: "transparent"
+                                            r: r.trace_width ? r.trace_width / 2 : 8,
+                                            stroke: "red"
                                         })
                                     ]
                                 }, i);
@@ -14314,6 +14323,83 @@ var EditTraceHintOverlay = function(param) {
         ]
     });
 };
+function getExpandedStroke(strokeInput, defaultWidth) {
+    if (strokeInput.length < 2) {
+        throw new Error("Stroke must have at least two points");
+    }
+    var stroke = strokeInput.map(function(point) {
+        if (Array.isArray(point)) {
+            return {
+                x: point[0],
+                y: point[1]
+            };
+        }
+        return point;
+    });
+    var leftSide = [];
+    var rightSide = [];
+    function getNormal(p1, p2) {
+        var dx = p2.x - p1.x;
+        var dy = p2.y - p1.y;
+        var length = Math.sqrt(dx * dx + dy * dy);
+        return {
+            x: -dy / length,
+            y: dx / length
+        };
+    }
+    function addPoint(point, normal, factor, width) {
+        var halfWidth = width / 2;
+        var newPoint = {
+            x: point.x + normal.x * halfWidth * factor,
+            y: point.y + normal.y * halfWidth * factor
+        };
+        if (factor > 0) {
+            leftSide.push(newPoint);
+        } else {
+            rightSide.unshift(newPoint);
+        }
+    }
+    var firstNormal = getNormal(stroke[0], stroke[1]);
+    var _stroke__trace_width;
+    var firstWidth = (_stroke__trace_width = stroke[0].trace_width) !== null && _stroke__trace_width !== void 0 ? _stroke__trace_width : defaultWidth;
+    addPoint(stroke[0], firstNormal, 1, firstWidth);
+    addPoint(stroke[0], firstNormal, -1, firstWidth);
+    for(var i = 1; i < stroke.length - 1; i++){
+        var prev = stroke[i - 1];
+        var current = stroke[i];
+        var next = stroke[i + 1];
+        var normalPrev = getNormal(prev, current);
+        var normalNext = getNormal(current, next);
+        var miterX = normalPrev.x + normalNext.x;
+        var miterY = normalPrev.y + normalNext.y;
+        var miterLength = Math.sqrt(miterX * miterX + miterY * miterY);
+        var _current_trace_width;
+        var currentWidth = (_current_trace_width = current.trace_width) !== null && _current_trace_width !== void 0 ? _current_trace_width : defaultWidth;
+        var miterLimit = 2;
+        if (miterLength / 2 > miterLimit * (currentWidth / 2)) {
+            addPoint(current, normalPrev, 1, currentWidth);
+            addPoint(current, normalNext, 1, currentWidth);
+            addPoint(current, normalPrev, -1, currentWidth);
+            addPoint(current, normalNext, -1, currentWidth);
+        } else {
+            var scale2 = 1 / miterLength;
+            addPoint(current, {
+                x: miterX * scale2,
+                y: miterY * scale2
+            }, 1, currentWidth);
+            addPoint(current, {
+                x: miterX * scale2,
+                y: miterY * scale2
+            }, -1, currentWidth);
+        }
+    }
+    var lastNormal = getNormal(stroke[stroke.length - 2], stroke[stroke.length - 1]);
+    var _stroke__trace_width1;
+    var lastWidth = (_stroke__trace_width1 = stroke[stroke.length - 1].trace_width) !== null && _stroke__trace_width1 !== void 0 ? _stroke__trace_width1 : defaultWidth;
+    addPoint(stroke[stroke.length - 1], lastNormal, 1, lastWidth);
+    addPoint(stroke[stroke.length - 1], lastNormal, -1, lastWidth);
+    return _to_consumable_array(leftSide).concat(_to_consumable_array(rightSide));
+}
 // src/components/RatsNestOverlay.tsx
 var import_transformation_matrix7 = require("transformation-matrix");
 var import_soup_util3 = __toESM(require_dist2());