easyeda 0.0.230 → 0.0.232

package/dist/browser/{dist-K77PLYJN.js → dist-7RT7ZSAD.js}

@@ -14,7 +14,7 @@ import {
   toSVG,
   toString,
   translate
-} from "./chunk-6S7LH5YP.js";
+} from "./chunk-U5UUPCU3.js";
 
 // node_modules/circuit-to-svg/dist/index.js
 var import_svgson = __toESM(require_svgson_umd(), 1);
@@ -1560,9 +1560,14 @@ function createSvgObjectsFromPcbNoteLine(noteLine, ctx) {
   return [svgObject];
 }
 function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
-  const { transform, colorMap: colorMap2 } = ctx;
+  const { transform, colorMap: colorMap2, showSolderMask } = ctx;
   const [x, y] = applyToPoint(transform, [hole.x, hole.y]);
-  const copperLayer = Array.isArray(hole.layers) && hole.layers[0] || hole.layer || "top";
+  const layer = Array.isArray(hole.layers) && hole.layers[0] || hole.layer || "top";
+  const maskLayer = layer;
+  const isCoveredWithSolderMask = Boolean(hole.is_covered_with_solder_mask);
+  const soldermaskMargin = (hole.soldermask_margin ?? 0) * Math.abs(transform.a);
+  const shouldShowSolderMask = showSolderMask && isCoveredWithSolderMask && soldermaskMargin !== 0;
+  const solderMaskColor = colorMap2.soldermaskWithCopperUnderneath.top;
   if (hole.shape === "pill") {
     const scaledOuterWidth = hole.outer_width * Math.abs(transform.a);
     const scaledOuterHeight = hole.outer_height * Math.abs(transform.a);
@@ -1585,46 +1590,161 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
         return `M${-radius},0 a${radius},${radius} 0 0 1 ${width},0 a${radius},${radius} 0 0 1 ${-width},0 z`;
       }
     };
-    return [
+    let children = [
+      // Outer pill shape
       {
-        name: "g",
+        name: "path",
         type: "element",
         attributes: {
+          class: "pcb-hole-outer",
+          fill: colorMap2.copper.top,
+          d: createPillPath(scaledOuterWidth, scaledOuterHeight),
+          transform: outerTransform,
           "data-type": "pcb_plated_hole",
-          "data-pcb-layer": "through"
+          "data-pcb-layer": layer
         },
-        children: [
-          // Outer pill shape
+        value: "",
+        children: []
+      },
+      // Inner pill shape
+      {
+        name: "path",
+        type: "element",
+        attributes: {
+          class: "pcb-hole-inner",
+          fill: colorMap2.drill,
+          d: createPillPath(scaledHoleWidth, scaledHoleHeight),
+          transform: innerTransform,
+          "data-type": "pcb_plated_hole_drill",
+          "data-pcb-layer": "drill"
+        },
+        value: "",
+        children: []
+      }
+    ];
+    if (shouldShowSolderMask) {
+      const maskWidth = scaledOuterWidth + 2 * soldermaskMargin;
+      const maskHeight = scaledOuterHeight + 2 * soldermaskMargin;
+      if (soldermaskMargin < 0) {
+        children = [
+          // 1. Draw the outer pad in soldermask color (covered)
           {
             name: "path",
             type: "element",
             attributes: {
-              class: "pcb-hole-outer",
-              fill: colorMap2.copper.top,
+              class: "pcb-hole-outer-covered",
+              fill: solderMaskColor,
               d: createPillPath(scaledOuterWidth, scaledOuterHeight),
               transform: outerTransform,
               "data-type": "pcb_plated_hole",
-              "data-pcb-layer": copperLayer
+              "data-pcb-layer": layer
             },
             value: "",
             children: []
           },
-          // Inner pill shape
+          // 2. Draw the exposed opening in copper color
           {
             name: "path",
             type: "element",
             attributes: {
-              class: "pcb-hole-inner",
-              fill: colorMap2.drill,
-              d: createPillPath(scaledHoleWidth, scaledHoleHeight),
-              transform: innerTransform,
-              "data-type": "pcb_plated_hole_drill",
-              "data-pcb-layer": "drill"
+              class: "pcb-hole-outer-exposed",
+              fill: colorMap2.copper.top,
+              d: createPillPath(maskWidth, maskHeight),
+              transform: outerTransform,
+              "data-type": "pcb_soldermask",
+              "data-pcb-layer": maskLayer
             },
             value: "",
             children: []
-          }
-        ],
+          },
+          // 3. Draw the drill hole on top
+          children[1]
+          // Original inner hole
+        ];
+      } else {
+        children.unshift({
+          name: "path",
+          type: "element",
+          attributes: {
+            class: "pcb-soldermask-cutout",
+            fill: colorMap2.substrate,
+            d: createPillPath(maskWidth, maskHeight),
+            transform: outerTransform,
+            "data-type": "pcb_soldermask_opening",
+            "data-pcb-layer": maskLayer
+          },
+          value: "",
+          children: []
+        });
+      }
+    }
+    return [
+      {
+        name: "g",
+        type: "element",
+        attributes: {
+          "data-type": "pcb_plated_hole",
+          "data-pcb-layer": "through"
+        },
+        children,
+        value: ""
+      }
+    ];
+  }
+  if (hole.shape === "oval") {
+    const scaledOuterWidth = hole.outer_width * Math.abs(transform.a);
+    const scaledOuterHeight = hole.outer_height * Math.abs(transform.a);
+    const scaledHoleWidth = hole.hole_width * Math.abs(transform.a);
+    const scaledHoleHeight = hole.hole_height * Math.abs(transform.a);
+    const rotation = hole.ccw_rotation || 0;
+    const transformStr = rotation ? `translate(${x} ${y}) rotate(${-rotation})` : `translate(${x} ${y})`;
+    const children = [
+      // Outer oval shape
+      {
+        name: "ellipse",
+        type: "element",
+        attributes: {
+          class: "pcb-hole-outer",
+          fill: colorMap2.copper.top,
+          cx: "0",
+          cy: "0",
+          rx: (scaledOuterWidth / 2).toString(),
+          ry: (scaledOuterHeight / 2).toString(),
+          transform: transformStr,
+          "data-type": "pcb_plated_hole",
+          "data-pcb-layer": layer
+        },
+        value: "",
+        children: []
+      },
+      // Inner oval shape
+      {
+        name: "ellipse",
+        type: "element",
+        attributes: {
+          class: "pcb-hole-inner",
+          fill: colorMap2.drill,
+          cx: "0",
+          cy: "0",
+          rx: (scaledHoleWidth / 2).toString(),
+          ry: (scaledHoleHeight / 2).toString(),
+          transform: transformStr,
+          "data-type": "pcb_plated_hole_drill",
+          "data-pcb-layer": "drill"
+        },
+        value: "",
+        children: []
+      }
+    ];
+    return [
+      {
+        name: "g",
+        type: "element",
+        attributes: {
+          "data-type": "pcb_plated_hole",
+          "data-pcb-layer": "through"
+        },
+        children,
         value: ""
       }
     ];
@@ -1636,46 +1756,105 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
     const scaledHoleHeight = hole.hole_diameter * Math.abs(transform.a);
     const outerRadius = Math.min(scaledOuterWidth, scaledOuterHeight) / 2;
     const innerRadius = Math.min(scaledHoleWidth, scaledHoleHeight) / 2;
-    return [
+    let children = [
       {
-        name: "g",
+        name: "circle",
         type: "element",
         attributes: {
+          class: "pcb-hole-outer",
+          fill: colorMap2.copper.top,
+          cx: x.toString(),
+          cy: y.toString(),
+          r: outerRadius.toString(),
           "data-type": "pcb_plated_hole",
-          "data-pcb-layer": "through"
+          "data-pcb-layer": layer
         },
-        children: [
+        value: "",
+        children: []
+      },
+      {
+        name: "circle",
+        type: "element",
+        attributes: {
+          class: "pcb-hole-inner",
+          fill: colorMap2.drill,
+          cx: x.toString(),
+          cy: y.toString(),
+          r: innerRadius.toString(),
+          "data-type": "pcb_plated_hole_drill",
+          "data-pcb-layer": "drill"
+        },
+        value: "",
+        children: []
+      }
+    ];
+    if (shouldShowSolderMask) {
+      const maskRadius = outerRadius + soldermaskMargin;
+      if (soldermaskMargin < 0) {
+        children = [
+          // 1. Draw the outer ring in soldermask color (covered)
           {
             name: "circle",
             type: "element",
             attributes: {
-              class: "pcb-hole-outer",
-              fill: colorMap2.copper.top,
+              class: "pcb-hole-outer-covered",
+              fill: solderMaskColor,
               cx: x.toString(),
               cy: y.toString(),
               r: outerRadius.toString(),
               "data-type": "pcb_plated_hole",
-              "data-pcb-layer": copperLayer
+              "data-pcb-layer": layer
             },
             value: "",
             children: []
           },
+          // 2. Draw the exposed opening in copper color
           {
             name: "circle",
             type: "element",
             attributes: {
-              class: "pcb-hole-inner",
-              fill: colorMap2.drill,
+              class: "pcb-hole-outer-exposed",
+              fill: colorMap2.copper.top,
               cx: x.toString(),
               cy: y.toString(),
-              r: innerRadius.toString(),
-              "data-type": "pcb_plated_hole_drill",
-              "data-pcb-layer": "drill"
+              r: maskRadius.toString(),
+              "data-type": "pcb_soldermask",
+              "data-pcb-layer": maskLayer
             },
             value: "",
             children: []
-          }
-        ],
+          },
+          // 3. Draw the drill hole on top
+          children[1]
+          // Original inner hole
+        ];
+      } else {
+        children.unshift({
+          name: "circle",
+          type: "element",
+          attributes: {
+            class: "pcb-soldermask-cutout",
+            fill: colorMap2.substrate,
+            cx: x.toString(),
+            cy: y.toString(),
+            r: maskRadius.toString(),
+            "data-type": "pcb_soldermask_opening",
+            "data-pcb-layer": maskLayer
+          },
+          value: "",
+          children: []
+        });
+      }
+    }
+    return [
+      {
+        name: "g",
+        type: "element",
+        attributes: {
+          "data-type": "pcb_plated_hole",
+          "data-pcb-layer": "through"
+        },
+        children,
         value: ""
       }
     ];
@@ -1691,22 +1870,58 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
       h.x + (h.hole_offset_x ?? 0),
       h.y + (h.hole_offset_y ?? 0)
     ]);
-    return [
+    let children = [
+      // Rectangular pad (outer shape)
       {
-        name: "g",
+        name: "rect",
         type: "element",
         attributes: {
+          class: "pcb-hole-outer-pad",
+          fill: colorMap2.copper.top,
+          x: (x - scaledRectPadWidth / 2).toString(),
+          y: (y - scaledRectPadHeight / 2).toString(),
+          width: scaledRectPadWidth.toString(),
+          height: scaledRectPadHeight.toString(),
+          ...scaledRectBorderRadius ? {
+            rx: scaledRectBorderRadius.toString(),
+            ry: scaledRectBorderRadius.toString()
+          } : {},
           "data-type": "pcb_plated_hole",
-          "data-pcb-layer": "through"
+          "data-pcb-layer": layer
         },
-        children: [
-          // Rectangular pad (outer shape)
+        value: "",
+        children: []
+      },
+      // Circular hole inside the rectangle (with optional offset)
+      {
+        name: "circle",
+        type: "element",
+        attributes: {
+          class: "pcb-hole-inner",
+          fill: colorMap2.drill,
+          cx: holeCx.toString(),
+          cy: holeCy.toString(),
+          r: holeRadius.toString(),
+          "data-type": "pcb_plated_hole_drill",
+          "data-pcb-layer": "drill"
+        },
+        value: "",
+        children: []
+      }
+    ];
+    if (shouldShowSolderMask) {
+      const maskWidth = scaledRectPadWidth + 2 * soldermaskMargin;
+      const maskHeight = scaledRectPadHeight + 2 * soldermaskMargin;
+      const maskBorderRadius = scaledRectBorderRadius + soldermaskMargin;
+      if (soldermaskMargin < 0) {
+        children = [
+          // 1. Draw the outer pad in soldermask color (covered)
           {
             name: "rect",
             type: "element",
             attributes: {
-              class: "pcb-hole-outer-pad",
-              fill: colorMap2.copper.top,
+              class: "pcb-hole-outer-covered",
+              fill: solderMaskColor,
               x: (x - scaledRectPadWidth / 2).toString(),
               y: (y - scaledRectPadHeight / 2).toString(),
               width: scaledRectPadWidth.toString(),
@@ -1716,28 +1931,68 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
                 ry: scaledRectBorderRadius.toString()
               } : {},
               "data-type": "pcb_plated_hole",
-              "data-pcb-layer": copperLayer
+              "data-pcb-layer": layer
             },
             value: "",
             children: []
           },
-          // Circular hole inside the rectangle (with optional offset)
+          // 2. Draw the exposed opening in copper color
           {
-            name: "circle",
+            name: "rect",
             type: "element",
             attributes: {
-              class: "pcb-hole-inner",
-              fill: colorMap2.drill,
-              cx: holeCx.toString(),
-              cy: holeCy.toString(),
-              r: holeRadius.toString(),
-              "data-type": "pcb_plated_hole_drill",
-              "data-pcb-layer": "drill"
+              class: "pcb-hole-outer-exposed",
+              fill: colorMap2.copper.top,
+              x: (x - maskWidth / 2).toString(),
+              y: (y - maskHeight / 2).toString(),
+              width: maskWidth.toString(),
+              height: maskHeight.toString(),
+              ...maskBorderRadius > 0 ? {
+                rx: maskBorderRadius.toString(),
+                ry: maskBorderRadius.toString()
+              } : {},
+              "data-type": "pcb_soldermask",
+              "data-pcb-layer": maskLayer
             },
             value: "",
             children: []
-          }
-        ],
+          },
+          // 3. Draw the drill hole on top
+          children[1]
+          // Original hole
+        ];
+      } else {
+        children.unshift({
+          name: "rect",
+          type: "element",
+          attributes: {
+            class: "pcb-soldermask-cutout",
+            fill: colorMap2.substrate,
+            x: (x - maskWidth / 2).toString(),
+            y: (y - maskHeight / 2).toString(),
+            width: maskWidth.toString(),
+            height: maskHeight.toString(),
+            ...scaledRectBorderRadius ? {
+              rx: maskBorderRadius.toString(),
+              ry: maskBorderRadius.toString()
+            } : {},
+            "data-type": "pcb_soldermask_opening",
+            "data-pcb-layer": maskLayer
+          },
+          value: "",
+          children: []
+        });
+      }
+    }
+    return [
+      {
+        name: "g",
+        type: "element",
+        attributes: {
+          "data-type": "pcb_plated_hole",
+          "data-pcb-layer": "through"
+        },
+        children,
         value: ""
       }
     ];
@@ -1757,22 +2012,61 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
       pillHole.y + holeOffsetY
     ]);
     const holeRadius = Math.min(scaledHoleHeight, scaledHoleWidth) / 2;
-    return [
+    let children = [
+      // Rectangular pad (outer shape)
       {
-        name: "g",
+        name: "rect",
         type: "element",
         attributes: {
+          class: "pcb-hole-outer-pad",
+          fill: colorMap2.copper.top,
+          x: (x - scaledRectPadWidth / 2).toString(),
+          y: (y - scaledRectPadHeight / 2).toString(),
+          width: scaledRectPadWidth.toString(),
+          height: scaledRectPadHeight.toString(),
+          ...scaledRectBorderRadius ? {
+            rx: scaledRectBorderRadius.toString(),
+            ry: scaledRectBorderRadius.toString()
+          } : {},
           "data-type": "pcb_plated_hole",
-          "data-pcb-layer": "through"
+          "data-pcb-layer": layer
         },
-        children: [
-          // Rectangular pad (outer shape)
+        value: "",
+        children: []
+      },
+      // pill hole inside the rectangle
+      {
+        name: "rect",
+        type: "element",
+        attributes: {
+          class: "pcb-hole-inner",
+          fill: colorMap2.drill,
+          x: (holeCenterX - scaledHoleWidth / 2).toString(),
+          y: (holeCenterY - scaledHoleHeight / 2).toString(),
+          width: scaledHoleWidth.toString(),
+          height: scaledHoleHeight.toString(),
+          rx: holeRadius.toString(),
+          ry: holeRadius.toString(),
+          "data-type": "pcb_plated_hole_drill",
+          "data-pcb-layer": "drill"
+        },
+        value: "",
+        children: []
+      }
+    ];
+    if (shouldShowSolderMask) {
+      const maskWidth = scaledRectPadWidth + 2 * soldermaskMargin;
+      const maskHeight = scaledRectPadHeight + 2 * soldermaskMargin;
+      const maskBorderRadius = scaledRectBorderRadius + soldermaskMargin;
+      if (soldermaskMargin < 0) {
+        children = [
+          // 1. Draw the outer pad in soldermask color (covered)
           {
             name: "rect",
             type: "element",
             attributes: {
-              class: "pcb-hole-outer-pad",
-              fill: colorMap2.copper.top,
+              class: "pcb-hole-outer-covered",
+              fill: solderMaskColor,
               x: (x - scaledRectPadWidth / 2).toString(),
               y: (y - scaledRectPadHeight / 2).toString(),
               width: scaledRectPadWidth.toString(),
@@ -1782,31 +2076,68 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
                 ry: scaledRectBorderRadius.toString()
               } : {},
               "data-type": "pcb_plated_hole",
-              "data-pcb-layer": copperLayer
+              "data-pcb-layer": layer
             },
             value: "",
             children: []
           },
-          // pill hole inside the rectangle
+          // 2. Draw the exposed opening in copper color
           {
             name: "rect",
             type: "element",
             attributes: {
-              class: "pcb-hole-inner",
-              fill: colorMap2.drill,
-              x: (holeCenterX - scaledHoleWidth / 2).toString(),
-              y: (holeCenterY - scaledHoleHeight / 2).toString(),
-              width: scaledHoleWidth.toString(),
-              height: scaledHoleHeight.toString(),
-              rx: holeRadius.toString(),
-              ry: holeRadius.toString(),
-              "data-type": "pcb_plated_hole_drill",
-              "data-pcb-layer": "drill"
+              class: "pcb-hole-outer-exposed",
+              fill: colorMap2.copper.top,
+              x: (x - maskWidth / 2).toString(),
+              y: (y - maskHeight / 2).toString(),
+              width: maskWidth.toString(),
+              height: maskHeight.toString(),
+              ...maskBorderRadius > 0 ? {
+                rx: maskBorderRadius.toString(),
+                ry: maskBorderRadius.toString()
+              } : {},
+              "data-type": "pcb_soldermask",
+              "data-pcb-layer": maskLayer
             },
             value: "",
             children: []
-          }
-        ],
+          },
+          // 3. Draw the drill hole on top
+          children[1]
+          // Original hole
+        ];
+      } else {
+        children.unshift({
+          name: "rect",
+          type: "element",
+          attributes: {
+            class: "pcb-soldermask-cutout",
+            fill: colorMap2.substrate,
+            x: (x - maskWidth / 2).toString(),
+            y: (y - maskHeight / 2).toString(),
+            width: maskWidth.toString(),
+            height: maskHeight.toString(),
+            ...scaledRectBorderRadius ? {
+              rx: maskBorderRadius.toString(),
+              ry: maskBorderRadius.toString()
+            } : {},
+            "data-type": "pcb_soldermask_opening",
+            "data-pcb-layer": maskLayer
+          },
+          value: "",
+          children: []
+        });
+      }
+    }
+    return [
+      {
+        name: "g",
+        type: "element",
+        attributes: {
+          "data-type": "pcb_plated_hole",
+          "data-pcb-layer": "through"
+        },
+        children,
         value: ""
       }
     ];
@@ -1826,21 +2157,61 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
       rotatedHole.y + holeOffsetY
     ]);
     const holeRadius = Math.min(scaledHoleHeight, scaledHoleWidth) / 2;
-    return [
+    let children = [
       {
-        name: "g",
+        name: "rect",
         type: "element",
         attributes: {
+          class: "pcb-hole-outer-pad",
+          fill: colorMap2.copper.top,
+          x: (-scaledRectPadWidth / 2).toString(),
+          y: (-scaledRectPadHeight / 2).toString(),
+          width: scaledRectPadWidth.toString(),
+          height: scaledRectPadHeight.toString(),
+          transform: `translate(${x} ${y}) rotate(${-rotatedHole.rect_ccw_rotation})`,
+          ...scaledRectBorderRadius ? {
+            rx: scaledRectBorderRadius.toString(),
+            ry: scaledRectBorderRadius.toString()
+          } : {},
           "data-type": "pcb_plated_hole",
-          "data-pcb-layer": "through"
+          "data-pcb-layer": layer
         },
-        children: [
+        value: "",
+        children: []
+      },
+      {
+        name: "rect",
+        type: "element",
+        attributes: {
+          class: "pcb-hole-inner",
+          fill: colorMap2.drill,
+          x: (-scaledHoleWidth / 2).toString(),
+          y: (-scaledHoleHeight / 2).toString(),
+          width: scaledHoleWidth.toString(),
+          height: scaledHoleHeight.toString(),
+          rx: holeRadius.toString(),
+          ry: holeRadius.toString(),
+          transform: `translate(${holeCenterX} ${holeCenterY}) rotate(${-rotatedHole.hole_ccw_rotation})`,
+          "data-type": "pcb_plated_hole_drill",
+          "data-pcb-layer": "drill"
+        },
+        value: "",
+        children: []
+      }
+    ];
+    if (shouldShowSolderMask) {
+      const maskWidth = scaledRectPadWidth + 2 * soldermaskMargin;
+      const maskHeight = scaledRectPadHeight + 2 * soldermaskMargin;
+      const maskBorderRadius = scaledRectBorderRadius + soldermaskMargin;
+      if (soldermaskMargin < 0) {
+        children = [
+          // 1. Draw the outer pad in soldermask color (covered)
           {
             name: "rect",
             type: "element",
             attributes: {
-              class: "pcb-hole-outer-pad",
-              fill: colorMap2.copper.top,
+              class: "pcb-hole-outer-covered",
+              fill: solderMaskColor,
               x: (-scaledRectPadWidth / 2).toString(),
               y: (-scaledRectPadHeight / 2).toString(),
               width: scaledRectPadWidth.toString(),
@@ -1851,30 +2222,186 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
                 ry: scaledRectBorderRadius.toString()
               } : {},
               "data-type": "pcb_plated_hole",
-              "data-pcb-layer": copperLayer
+              "data-pcb-layer": layer
             },
             value: "",
             children: []
           },
+          // 2. Draw the exposed opening in copper color
           {
             name: "rect",
             type: "element",
             attributes: {
-              class: "pcb-hole-inner",
-              fill: colorMap2.drill,
-              x: (-scaledHoleWidth / 2).toString(),
-              y: (-scaledHoleHeight / 2).toString(),
-              width: scaledHoleWidth.toString(),
-              height: scaledHoleHeight.toString(),
-              rx: holeRadius.toString(),
-              ry: holeRadius.toString(),
-              transform: `translate(${holeCenterX} ${holeCenterY}) rotate(${-rotatedHole.hole_ccw_rotation})`,
-              "data-type": "pcb_plated_hole_drill",
-              "data-pcb-layer": "drill"
+              class: "pcb-hole-outer-exposed",
+              fill: colorMap2.copper.top,
+              x: (-maskWidth / 2).toString(),
+              y: (-maskHeight / 2).toString(),
+              width: maskWidth.toString(),
+              height: maskHeight.toString(),
+              transform: `translate(${x} ${y}) rotate(${-rotatedHole.rect_ccw_rotation})`,
+              ...maskBorderRadius > 0 ? {
+                rx: maskBorderRadius.toString(),
+                ry: maskBorderRadius.toString()
+              } : {},
+              "data-type": "pcb_soldermask",
+              "data-pcb-layer": maskLayer
             },
             value: "",
             children: []
-          }
+          },
+          // 3. Draw the drill hole on top
+          children[1]
+          // Original hole
+        ];
+      } else {
+        children.push({
+          name: "rect",
+          type: "element",
+          attributes: {
+            class: "pcb-solder-mask",
+            fill: solderMaskColor,
+            x: (-maskWidth / 2).toString(),
+            y: (-maskHeight / 2).toString(),
+            width: maskWidth.toString(),
+            height: maskHeight.toString(),
+            transform: `translate(${x} ${y}) rotate(${-rotatedHole.rect_ccw_rotation})`,
+            ...scaledRectBorderRadius ? {
+              rx: maskBorderRadius.toString(),
+              ry: maskBorderRadius.toString()
+            } : {},
+            "data-type": "pcb_soldermask",
+            "data-pcb-layer": maskLayer
+          },
+          value: "",
+          children: []
+        });
+      }
+    }
+    return [
+      {
+        name: "g",
+        type: "element",
+        attributes: {
+          "data-type": "pcb_plated_hole",
+          "data-pcb-layer": "through"
+        },
+        children,
+        value: ""
+      }
+    ];
+  }
+  if (hole.shape === "hole_with_polygon_pad") {
+    const polygonHole = hole;
+    const padOutline = polygonHole.pad_outline || [];
+    const holeX = polygonHole.x ?? 0;
+    const holeY = polygonHole.y ?? 0;
+    const padPoints = padOutline.map(
+      (point) => applyToPoint(transform, [holeX + point.x, holeY + point.y])
+    );
+    const padPointsString = padPoints.map((p) => p.join(",")).join(" ");
+    const [holeCenterX, holeCenterY] = applyToPoint(transform, [
+      holeX + polygonHole.hole_offset_x,
+      holeY + polygonHole.hole_offset_y
+    ]);
+    const createHoleSvgObject = () => {
+      if (polygonHole.hole_shape === "circle") {
+        const scaledDiameter = (polygonHole.hole_diameter ?? 0) * Math.abs(transform.a);
+        const radius = scaledDiameter / 2;
+        return {
+          name: "circle",
+          type: "element",
+          attributes: {
+            class: "pcb-hole-inner",
+            fill: colorMap2.drill,
+            cx: holeCenterX.toString(),
+            cy: holeCenterY.toString(),
+            r: radius.toString(),
+            "data-type": "pcb_plated_hole_drill",
+            "data-pcb-layer": "drill"
+          },
+          value: "",
+          children: []
+        };
+      }
+      if (polygonHole.hole_shape === "oval") {
+        const scaledWidth = (polygonHole.hole_width ?? 0) * Math.abs(transform.a);
+        const scaledHeight = (polygonHole.hole_height ?? 0) * Math.abs(transform.a);
+        const rx = scaledWidth / 2;
+        const ry = scaledHeight / 2;
+        return {
+          name: "ellipse",
+          type: "element",
+          attributes: {
+            class: "pcb-hole-inner",
+            fill: colorMap2.drill,
+            cx: holeCenterX.toString(),
+            cy: holeCenterY.toString(),
+            rx: rx.toString(),
+            ry: ry.toString(),
+            "data-type": "pcb_plated_hole_drill",
+            "data-pcb-layer": "drill"
+          },
+          value: "",
+          children: []
+        };
+      }
+      if (polygonHole.hole_shape === "pill" || polygonHole.hole_shape === "rotated_pill") {
+        const scaledWidth = (polygonHole.hole_width ?? 0) * Math.abs(transform.a);
+        const scaledHeight = (polygonHole.hole_height ?? 0) * Math.abs(transform.a);
+        const isHorizontal = scaledWidth > scaledHeight;
+        const radius = Math.min(scaledWidth, scaledHeight) / 2;
+        const straightLength = Math.abs(
+          isHorizontal ? scaledWidth - scaledHeight : scaledHeight - scaledWidth
+        );
+        const pathD = isHorizontal ? `M${-straightLength / 2},${-radius} h${straightLength} a${radius},${radius} 0 0 1 0,${scaledHeight} h-${straightLength} a${radius},${radius} 0 0 1 0,-${scaledHeight} z` : `M${-radius},${-straightLength / 2} v${straightLength} a${radius},${radius} 0 0 0 ${scaledWidth},0 v-${straightLength} a${radius},${radius} 0 0 0 -${scaledWidth},0 z`;
+        return {
+          name: "path",
+          type: "element",
+          attributes: {
+            class: "pcb-hole-inner",
+            fill: colorMap2.drill,
+            d: pathD,
+            transform: `translate(${holeCenterX} ${holeCenterY})`,
+            "data-type": "pcb_plated_hole_drill",
+            "data-pcb-layer": "drill"
+          },
+          value: "",
+          children: []
+        };
+      }
+      return {
+        name: "g",
+        type: "element",
+        attributes: {},
+        value: "",
+        children: []
+      };
+    };
+    return [
+      {
+        name: "g",
+        type: "element",
+        attributes: {
+          "data-type": "pcb_plated_hole",
+          "data-pcb-layer": "through"
+        },
+        children: [
+          // Polygon pad (outer shape)
+          {
+            name: "polygon",
+            type: "element",
+            attributes: {
+              class: "pcb-hole-outer-pad",
+              fill: colorMap2.copper.top,
+              points: padPointsString,
+              "data-type": "pcb_plated_hole",
+              "data-pcb-layer": layer
+            },
+            value: "",
+            children: []
+          },
+          // Hole inside the polygon (with offset)
+          createHoleSvgObject()
         ],
         value: ""
       }
@@ -1920,7 +2447,7 @@ function createSvgObjectsFromPcbSilkscreenPath(silkscreenPath, ctx) {
   ];
 }
 function createSvgObjectsFromPcbSilkscreenText(pcbSilkscreenText, ctx) {
-  const { transform, layer: layerFilter, colorMap: colorMap2 } = ctx;
+  const { transform, layer: layerFilter, colorMap: colorMap2, circuitJson } = ctx;
   const {
     anchor_position,
     text,
@@ -2260,10 +2787,20 @@ var DEFAULT_PCB_COLOR_MAP = {
     inner6: "rgb(255, 105, 180)",
     bottom: "rgb(77, 127, 196)"
   },
-  soldermask: {
+  soldermaskWithCopperUnderneath: {
     top: "rgb(18, 82, 50)",
     bottom: "rgb(77, 127, 196)"
   },
+  soldermask: {
+    top: "rgb(12, 55, 33)",
+    bottom: "rgb(12, 55, 33)"
+  },
+  soldermaskOverCopper: {
+    top: "rgb(52, 135, 73)",
+    bottom: "rgb(52, 135, 73)"
+  },
+  substrate: "rgb(201, 162, 110)",
+  // FR4 substrate color (tan/beige)
   drill: "#FF26E2",
   silkscreen: {
     top: "#f2eda1",
@@ -2304,29 +2841,12 @@ function createSvgObjectsFromPcbTrace(trace, ctx) {
     const layer = "layer" in start ? start.layer : "layer" in end ? end.layer : null;
     if (!layer) continue;
     if (layerFilter && layer !== layerFilter) continue;
+    const maskLayer = layer;
     const copperColor = layerNameToColor(layer, colorMap2);
-    const maskColor = colorMap2.soldermask[layer] ?? copperColor;
+    const maskColor = colorMap2.soldermaskWithCopperUnderneath[layer];
     const traceWidth = "width" in start ? start.width : "width" in end ? end.width : null;
     const width = traceWidth ? (traceWidth * Math.abs(transform.a)).toString() : "0.3";
     if (showSolderMask) {
-      const copperObject = {
-        name: "path",
-        type: "element",
-        value: "",
-        children: [],
-        attributes: {
-          class: "pcb-trace",
-          stroke: copperColor,
-          fill: "none",
-          d: `M ${startPoint[0]} ${startPoint[1]} L ${endPoint[0]} ${endPoint[1]}`,
-          "stroke-width": width,
-          "stroke-linecap": "round",
-          "stroke-linejoin": "round",
-          "shape-rendering": "crispEdges",
-          "data-type": "pcb_trace",
-          "data-pcb-layer": layer
-        }
-      };
       const maskObject = {
         name: "path",
         type: "element",
@@ -2341,11 +2861,11 @@ function createSvgObjectsFromPcbTrace(trace, ctx) {
           "stroke-linecap": "round",
           "stroke-linejoin": "round",
           "shape-rendering": "crispEdges",
-          "data-type": "pcb_soldermask",
+          "data-type": "pcb_trace_soldermask",
           "data-pcb-layer": layer
         }
       };
-      svgObjects.push(maskObject, copperObject);
+      svgObjects.push(maskObject);
     } else {
       const maskOnlyObject = {
         name: "path",
@@ -2374,8 +2894,9 @@ function createSvgObjectsFromSmtPad(pad, ctx) {
   const { transform, layer: layerFilter, colorMap: colorMap2, showSolderMask } = ctx;
   if (layerFilter && pad.layer !== layerFilter) return [];
   const isCoveredWithSolderMask = Boolean(pad?.is_covered_with_solder_mask);
-  const shouldshowSolderMask = showSolderMask && isCoveredWithSolderMask;
-  const solderMaskColor = colorMap2.soldermask[pad.layer] ?? colorMap2.soldermask.top;
+  const shouldShowSolderMask = showSolderMask && isCoveredWithSolderMask;
+  const soldermaskWithCopperUnderneathColor = colorMap2.soldermaskWithCopperUnderneath[pad.layer] ?? colorMap2.soldermaskWithCopperUnderneath.top;
+  const soldermaskMargin = (pad.soldermask_margin ?? 0) * Math.abs(transform.a);
   if (pad.shape === "rect" || pad.shape === "rotated_rect") {
     const width = pad.width * Math.abs(transform.a);
     const height = pad.height * Math.abs(transform.d);
@@ -2404,22 +2925,103 @@ function createSvgObjectsFromSmtPad(pad, ctx) {
           } : {}
         }
       };
-      if (!shouldshowSolderMask) {
+      if (!shouldShowSolderMask) {
         return [padElement2];
       }
-      const maskElement2 = {
-        name: padElement2.name,
-        type: padElement2.type,
+      const maskWidth2 = width + 2 * soldermaskMargin;
+      const maskHeight2 = height + 2 * soldermaskMargin;
+      const maskBorderRadius2 = scaledBorderRadius ? scaledBorderRadius + soldermaskMargin : 0;
+      if (soldermaskMargin < 0) {
+        const coveredPadElement = {
+          name: "rect",
+          type: "element",
+          value: "",
+          children: [],
+          attributes: {
+            class: "pcb-pad-covered",
+            fill: soldermaskWithCopperUnderneathColor,
+            x: (-width / 2).toString(),
+            y: (-height / 2).toString(),
+            width: width.toString(),
+            height: height.toString(),
+            transform: `translate(${x} ${y}) rotate(${-pad.ccw_rotation})`,
+            "data-type": "pcb_smtpad",
+            "data-pcb-layer": pad.layer,
+            ...scaledBorderRadius ? {
+              rx: scaledBorderRadius.toString(),
+              ry: scaledBorderRadius.toString()
+            } : {}
+          }
+        };
+        const exposedOpeningElement = {
+          name: "rect",
+          type: "element",
+          value: "",
+          children: [],
+          attributes: {
+            class: "pcb-pad-exposed",
+            fill: layerNameToColor(pad.layer, colorMap2),
+            x: (-maskWidth2 / 2).toString(),
+            y: (-maskHeight2 / 2).toString(),
+            width: maskWidth2.toString(),
+            height: maskHeight2.toString(),
+            transform: `translate(${x} ${y}) rotate(${-pad.ccw_rotation})`,
+            "data-type": "pcb_soldermask",
+            "data-pcb-layer": pad.layer,
+            ...maskBorderRadius2 > 0 ? {
+              rx: maskBorderRadius2.toString(),
+              ry: maskBorderRadius2.toString()
+            } : {}
+          }
+        };
+        return [coveredPadElement, exposedOpeningElement];
+      }
+      if (soldermaskMargin === 0) {
+        const coveredPadElement = {
+          name: "rect",
+          type: "element",
+          value: "",
+          children: [],
+          attributes: {
+            class: "pcb-pad-covered",
+            fill: soldermaskWithCopperUnderneathColor,
+            x: (-width / 2).toString(),
+            y: (-height / 2).toString(),
+            width: width.toString(),
+            height: height.toString(),
+            transform: `translate(${x} ${y}) rotate(${-pad.ccw_rotation})`,
+            "data-type": "pcb_smtpad",
+            "data-pcb-layer": pad.layer,
+            ...scaledBorderRadius ? {
+              rx: scaledBorderRadius.toString(),
+              ry: scaledBorderRadius.toString()
+            } : {}
+          }
+        };
+        return [coveredPadElement];
+      }
+      const substrateElement2 = {
+        name: "rect",
+        type: "element",
         value: "",
         children: [],
         attributes: {
-          ...padElement2.attributes,
-          class: "pcb-solder-mask",
-          fill: solderMaskColor,
-          "data-type": "pcb_soldermask"
+          class: "pcb-soldermask-cutout",
+          fill: colorMap2.substrate,
+          x: (-maskWidth2 / 2).toString(),
+          y: (-maskHeight2 / 2).toString(),
+          width: maskWidth2.toString(),
+          height: maskHeight2.toString(),
+          transform: `translate(${x} ${y}) rotate(${-pad.ccw_rotation})`,
+          ...maskBorderRadius2 > 0 ? {
+            rx: maskBorderRadius2.toString(),
+            ry: maskBorderRadius2.toString()
+          } : {},
+          "data-type": "pcb_soldermask_opening",
+          "data-pcb-layer": pad.layer
         }
       };
-      return [padElement2, maskElement2];
+      return [substrateElement2, padElement2];
     }
     const padElement = {
       name: "rect",
@@ -2441,62 +3043,220 @@ function createSvgObjectsFromSmtPad(pad, ctx) {
         } : {}
       }
     };
-    if (!shouldshowSolderMask) {
+    if (!shouldShowSolderMask) {
       return [padElement];
     }
-    const maskElement = {
-      name: padElement.name,
-      type: padElement.type,
+    const maskWidth = width + 2 * soldermaskMargin;
+    const maskHeight = height + 2 * soldermaskMargin;
+    const maskBorderRadius = scaledBorderRadius ? scaledBorderRadius + soldermaskMargin : 0;
+    if (soldermaskMargin < 0) {
+      const coveredPadElement = {
+        name: "rect",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-covered",
+          fill: soldermaskWithCopperUnderneathColor,
+          x: (x - width / 2).toString(),
+          y: (y - height / 2).toString(),
+          width: width.toString(),
+          height: height.toString(),
+          "data-type": "pcb_smtpad",
+          "data-pcb-layer": pad.layer,
+          ...scaledBorderRadius ? {
+            rx: scaledBorderRadius.toString(),
+            ry: scaledBorderRadius.toString()
+          } : {}
+        }
+      };
+      const exposedOpeningElement = {
+        name: "rect",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-exposed",
+          fill: layerNameToColor(pad.layer, colorMap2),
+          x: (x - maskWidth / 2).toString(),
+          y: (y - maskHeight / 2).toString(),
+          width: maskWidth.toString(),
+          height: maskHeight.toString(),
+          "data-type": "pcb_soldermask",
+          "data-pcb-layer": pad.layer,
+          ...maskBorderRadius > 0 ? {
+            rx: maskBorderRadius.toString(),
+            ry: maskBorderRadius.toString()
+          } : {}
+        }
+      };
+      return [coveredPadElement, exposedOpeningElement];
+    }
+    if (soldermaskMargin === 0) {
+      const coveredPadElement = {
+        name: "rect",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-covered",
+          fill: soldermaskWithCopperUnderneathColor,
+          x: (x - width / 2).toString(),
+          y: (y - height / 2).toString(),
+          width: width.toString(),
+          height: height.toString(),
+          ...maskBorderRadius > 0 ? {
+            rx: scaledBorderRadius.toString(),
+            ry: scaledBorderRadius.toString()
+          } : {},
+          "data-type": "pcb_smtpad",
+          "data-pcb-layer": pad.layer
+        }
+      };
+      return [coveredPadElement];
+    }
+    const substrateElement = {
+      name: "rect",
+      type: "element",
       value: "",
       children: [],
       attributes: {
-        ...padElement.attributes,
-        class: "pcb-solder-mask",
-        fill: solderMaskColor,
-        "data-type": "pcb_soldermask"
+        class: "pcb-soldermask-cutout",
+        fill: colorMap2.substrate,
+        x: (x - maskWidth / 2).toString(),
+        y: (y - maskHeight / 2).toString(),
+        width: maskWidth.toString(),
+        height: maskHeight.toString(),
+        ...maskBorderRadius > 0 ? {
+          rx: maskBorderRadius.toString(),
+          ry: maskBorderRadius.toString()
+        } : {},
+        "data-type": "pcb_soldermask_opening",
+        "data-pcb-layer": pad.layer
       }
     };
-    return [padElement, maskElement];
+    return [substrateElement, padElement];
   }
-  if (pad.shape === "pill") {
+  if (pad.shape === "pill" || pad.shape === "rotated_pill") {
+    const isRotated = pad.shape === "rotated_pill";
     const width = pad.width * Math.abs(transform.a);
     const height = pad.height * Math.abs(transform.d);
     const radius = pad.radius * Math.abs(transform.a);
     const [x, y] = applyToPoint(transform, [pad.x, pad.y]);
+    const rotationTransformAttributes = isRotated ? {
+      transform: `translate(${x} ${y}) rotate(${-(pad.ccw_rotation ?? 0)})`
+    } : void 0;
+    const baseAttributes = {
+      class: "pcb-pad",
+      fill: layerNameToColor(pad.layer, colorMap2),
+      x: isRotated ? (-width / 2).toString() : (x - width / 2).toString(),
+      y: isRotated ? (-height / 2).toString() : (y - height / 2).toString(),
+      width: width.toString(),
+      height: height.toString(),
+      rx: radius.toString(),
+      ry: radius.toString(),
+      "data-type": "pcb_smtpad",
+      "data-pcb-layer": pad.layer,
+      ...rotationTransformAttributes ?? {}
+    };
     const padElement = {
       name: "rect",
       type: "element",
       value: "",
       children: [],
-      attributes: {
-        class: "pcb-pad",
-        fill: layerNameToColor(pad.layer, colorMap2),
-        x: (x - width / 2).toString(),
-        y: (y - height / 2).toString(),
-        width: width.toString(),
-        height: height.toString(),
-        rx: radius.toString(),
-        ry: radius.toString(),
-        "data-type": "pcb_smtpad",
-        "data-pcb-layer": pad.layer
-      }
+      attributes: baseAttributes
     };
-    if (!shouldshowSolderMask) {
+    if (!shouldShowSolderMask) {
       return [padElement];
     }
-    const maskElement = {
-      name: padElement.name,
-      type: padElement.type,
+    const maskWidth = width + 2 * soldermaskMargin;
+    const maskHeight = height + 2 * soldermaskMargin;
+    const maskRadius = radius + soldermaskMargin;
+    if (soldermaskMargin < 0) {
+      const coveredPadElement = {
+        name: "rect",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-covered",
+          fill: soldermaskWithCopperUnderneathColor,
+          x: isRotated ? (-width / 2).toString() : (x - width / 2).toString(),
+          y: isRotated ? (-height / 2).toString() : (y - height / 2).toString(),
+          width: width.toString(),
+          height: height.toString(),
+          rx: radius.toString(),
+          ry: radius.toString(),
+          "data-type": "pcb_smtpad",
+          "data-pcb-layer": pad.layer,
+          ...rotationTransformAttributes ?? {}
+        }
+      };
+      const exposedAttributes = {
+        class: "pcb-pad-exposed",
+        fill: layerNameToColor(pad.layer, colorMap2),
+        x: isRotated ? (-maskWidth / 2).toString() : (x - maskWidth / 2).toString(),
+        y: isRotated ? (-maskHeight / 2).toString() : (y - maskHeight / 2).toString(),
+        width: maskWidth.toString(),
+        height: maskHeight.toString(),
+        rx: maskRadius.toString(),
+        ry: maskRadius.toString(),
+        "data-type": "pcb_soldermask",
+        "data-pcb-layer": pad.layer,
+        ...rotationTransformAttributes ?? {}
+      };
+      const exposedOpeningElement = {
+        name: "rect",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: exposedAttributes
+      };
+      return [coveredPadElement, exposedOpeningElement];
+    }
+    if (soldermaskMargin === 0) {
+      const coveredPadElement = {
+        name: "rect",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-covered",
+          fill: soldermaskWithCopperUnderneathColor,
+          x: isRotated ? (-width / 2).toString() : (x - width / 2).toString(),
+          y: isRotated ? (-height / 2).toString() : (y - height / 2).toString(),
+          width: width.toString(),
+          height: height.toString(),
+          rx: radius.toString(),
+          ry: radius.toString(),
+          "data-type": "pcb_smtpad",
+          "data-pcb-layer": pad.layer,
+          ...rotationTransformAttributes ?? {}
+        }
+      };
+      return [coveredPadElement];
+    }
+    const substrateAttributes = {
+      class: "pcb-soldermask-cutout",
+      fill: colorMap2.substrate,
+      x: isRotated ? (-maskWidth / 2).toString() : (x - maskWidth / 2).toString(),
+      y: isRotated ? (-maskHeight / 2).toString() : (y - maskHeight / 2).toString(),
+      width: maskWidth.toString(),
+      height: maskHeight.toString(),
+      rx: maskRadius.toString(),
+      ry: maskRadius.toString(),
+      "data-type": "pcb_soldermask_opening",
+      "data-pcb-layer": pad.layer,
+      ...rotationTransformAttributes ?? {}
+    };
+    const substrateElement = {
+      name: "rect",
+      type: "element",
       value: "",
       children: [],
-      attributes: {
-        ...padElement.attributes,
-        class: "pcb-solder-mask",
-        fill: solderMaskColor,
-        "data-type": "pcb_soldermask"
-      }
+      attributes: substrateAttributes
     };
-    return [padElement, maskElement];
+    return [substrateElement, padElement];
   }
   if (pad.shape === "circle") {
     const radius = pad.radius * Math.abs(transform.a);
@@ -2516,22 +3276,77 @@ function createSvgObjectsFromSmtPad(pad, ctx) {
         "data-pcb-layer": pad.layer
       }
     };
-    if (!shouldshowSolderMask) {
+    if (!shouldShowSolderMask) {
       return [padElement];
     }
-    const maskElement = {
-      name: padElement.name,
-      type: padElement.type,
+    const maskRadius = radius + soldermaskMargin;
+    if (soldermaskMargin < 0) {
+      const coveredPadElement = {
+        name: "circle",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-covered",
+          fill: soldermaskWithCopperUnderneathColor,
+          cx: x.toString(),
+          cy: y.toString(),
+          r: radius.toString(),
+          "data-type": "pcb_smtpad",
+          "data-pcb-layer": pad.layer
+        }
+      };
+      const exposedOpeningElement = {
+        name: "circle",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-exposed",
+          fill: layerNameToColor(pad.layer, colorMap2),
+          cx: x.toString(),
+          cy: y.toString(),
+          r: maskRadius.toString(),
+          "data-type": "pcb_soldermask",
+          "data-pcb-layer": pad.layer
+        }
+      };
+      return [coveredPadElement, exposedOpeningElement];
+    }
+    if (soldermaskMargin === 0) {
+      const coveredPadElement = {
+        name: "circle",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-covered",
+          fill: soldermaskWithCopperUnderneathColor,
+          cx: x.toString(),
+          cy: y.toString(),
+          r: radius.toString(),
+          "data-type": "pcb_smtpad",
+          "data-pcb-layer": pad.layer
+        }
+      };
+      return [coveredPadElement];
+    }
+    const substrateElement = {
+      name: "circle",
+      type: "element",
       value: "",
       children: [],
       attributes: {
-        ...padElement.attributes,
-        class: "pcb-solder-mask",
-        fill: solderMaskColor,
-        "data-type": "pcb_soldermask"
+        class: "pcb-soldermask-cutout",
+        fill: colorMap2.substrate,
+        cx: x.toString(),
+        cy: y.toString(),
+        r: maskRadius.toString(),
+        "data-type": "pcb_soldermask_opening",
+        "data-pcb-layer": pad.layer
       }
     };
-    return [padElement, maskElement];
+    return [substrateElement, padElement];
   }
   if (pad.shape === "polygon") {
     const points = (pad.points ?? []).map(
@@ -2550,27 +3365,90 @@ function createSvgObjectsFromSmtPad(pad, ctx) {
         "data-pcb-layer": pad.layer
       }
     };
-    if (!shouldshowSolderMask) {
+    if (!shouldShowSolderMask) {
       return [padElement];
     }
-    const maskElement = {
-      name: padElement.name,
-      type: padElement.type,
+    let maskPoints = points;
+    if (soldermaskMargin !== 0) {
+      const centroidX = points.reduce((sum, p) => sum + p[0], 0) / points.length;
+      const centroidY = points.reduce((sum, p) => sum + p[1], 0) / points.length;
+      maskPoints = points.map(([px, py]) => {
+        const dx = px - centroidX;
+        const dy = py - centroidY;
+        const distance3 = Math.sqrt(dx * dx + dy * dy);
+        if (distance3 === 0) return [px, py];
+        const normalizedDx = dx / distance3;
+        const normalizedDy = dy / distance3;
+        return [
+          px + normalizedDx * soldermaskMargin,
+          py + normalizedDy * soldermaskMargin
+        ];
+      });
+    }
+    if (soldermaskMargin < 0) {
+      const coveredPadElement = {
+        name: "polygon",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-covered",
+          fill: soldermaskWithCopperUnderneathColor,
+          points: points.map((p) => p.join(",")).join(" "),
+          "data-type": "pcb_smtpad",
+          "data-pcb-layer": pad.layer
+        }
+      };
+      const exposedOpeningElement = {
+        name: "polygon",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-exposed",
+          fill: layerNameToColor(pad.layer, colorMap2),
+          points: maskPoints.map((p) => p.join(",")).join(" "),
+          "data-type": "pcb_soldermask",
+          "data-pcb-layer": pad.layer
+        }
+      };
+      return [coveredPadElement, exposedOpeningElement];
+    }
+    if (soldermaskMargin === 0) {
+      const coveredPadElement = {
+        name: "polygon",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-covered",
+          fill: soldermaskWithCopperUnderneathColor,
+          points: points.map((p) => p.join(",")).join(" "),
+          "data-type": "pcb_smtpad",
+          "data-pcb-layer": pad.layer
+        }
+      };
+      return [coveredPadElement];
+    }
+    const substrateElement = {
+      name: "polygon",
+      type: "element",
       value: "",
       children: [],
       attributes: {
-        ...padElement.attributes,
-        class: "pcb-solder-mask",
-        fill: solderMaskColor,
-        "data-type": "pcb_soldermask"
+        class: "pcb-soldermask-cutout",
+        fill: colorMap2.substrate,
+        points: maskPoints.map((p) => p.join(",")).join(" "),
+        "data-type": "pcb_soldermask_opening",
+        "data-pcb-layer": pad.layer
       }
     };
-    return [padElement, maskElement];
+    return [substrateElement, padElement];
   }
   return [];
 }
 function createSvgObjectsFromPcbBoard(pcbBoard, ctx) {
-  const { transform, colorMap: colorMap2 } = ctx;
+  const { transform, colorMap: colorMap2, showSolderMask } = ctx;
   const { width, height, center, outline } = pcbBoard;
   let path;
   if (outline && Array.isArray(outline) && outline.length >= 3) {
@@ -2600,35 +3478,69 @@ function createSvgObjectsFromPcbBoard(pcbBoard, ctx) {
     path = `M ${topLeft[0]} ${topLeft[1]} L ${topRight[0]} ${topRight[1]} L ${bottomRight[0]} ${bottomRight[1]} L ${bottomLeft[0]} ${bottomLeft[1]}`;
   }
   path += " Z";
-  return [
-    {
+  const svgObjects = [];
+  if (showSolderMask) {
+    const layer = ctx.layer ?? "top";
+    const maskLayer = layer === "bottom" ? "soldermask-bottom" : "soldermask-top";
+    svgObjects.push({
       name: "path",
       type: "element",
       value: "",
       children: [],
       attributes: {
-        class: "pcb-board",
+        class: "pcb-board-soldermask",
         d: path,
-        fill: "none",
-        stroke: colorMap2.boardOutline,
-        "stroke-width": (0.1 * Math.abs(transform.a)).toString(),
-        "data-type": "pcb_board",
-        "data-pcb-layer": "board"
+        fill: colorMap2.soldermask.top,
+        "fill-opacity": "0.8",
+        stroke: "none",
+        "data-type": "pcb_soldermask",
+        "data-pcb-layer": maskLayer
       }
+    });
+  }
+  svgObjects.push({
+    name: "path",
+    type: "element",
+    value: "",
+    children: [],
+    attributes: {
+      class: "pcb-board",
+      d: path,
+      fill: "none",
+      stroke: colorMap2.boardOutline,
+      "stroke-width": (0.1 * Math.abs(transform.a)).toString(),
+      "data-type": "pcb_board",
+      "data-pcb-layer": "board"
     }
-  ];
+  });
+  return svgObjects;
 }
 function createSvgObjectsFromPcbPanel(pcbPanel, ctx) {
   const { transform, colorMap: colorMap2, showSolderMask } = ctx;
   const width = Number(pcbPanel.width);
   const height = Number(pcbPanel.height);
-  const topLeft = applyToPoint(transform, [0, 0]);
-  const topRight = applyToPoint(transform, [width, 0]);
-  const bottomRight = applyToPoint(transform, [width, height]);
-  const bottomLeft = applyToPoint(transform, [0, height]);
+  const center = pcbPanel.center ?? { x: width / 2, y: height / 2 };
+  const halfWidth = width / 2;
+  const halfHeight = height / 2;
+  const topLeft = applyToPoint(transform, [
+    center.x - halfWidth,
+    center.y - halfHeight
+  ]);
+  const topRight = applyToPoint(transform, [
+    center.x + halfWidth,
+    center.y - halfHeight
+  ]);
+  const bottomRight = applyToPoint(transform, [
+    center.x + halfWidth,
+    center.y + halfHeight
+  ]);
+  const bottomLeft = applyToPoint(transform, [
+    center.x - halfWidth,
+    center.y + halfHeight
+  ]);
   const path = `M ${topLeft[0]} ${topLeft[1]} L ${topRight[0]} ${topRight[1]} L ${bottomRight[0]} ${bottomRight[1]} L ${bottomLeft[0]} ${bottomLeft[1]} Z`;
   const isCoveredWithSolderMask = pcbPanel.covered_with_solder_mask !== false;
-  const shouldshowSolderMask = Boolean(
+  const shouldShowSolderMask = Boolean(
     showSolderMask && isCoveredWithSolderMask
   );
   return [
@@ -2696,72 +3608,314 @@ function createSvgObjectsFromPcbVia(hole, ctx) {
   };
 }
 function createSvgObjectsFromPcbHole(hole, ctx) {
-  const { transform, colorMap: colorMap2 } = ctx;
+  const { transform, colorMap: colorMap2, showSolderMask } = ctx;
+  const layer = ctx.layer ?? "top";
   const [x, y] = applyToPoint(transform, [hole.x, hole.y]);
+  const isCoveredWithSolderMask = Boolean(hole.is_covered_with_solder_mask);
+  const soldermaskMargin = (hole.soldermask_margin ?? 0) * Math.abs(transform.a);
+  const shouldShowSolderMask = showSolderMask && isCoveredWithSolderMask && soldermaskMargin !== 0;
+  const solderMaskColor = colorMap2.soldermask.top;
   if (hole.hole_shape === "circle" || hole.hole_shape === "square") {
     const scaledDiameter = hole.hole_diameter * Math.abs(transform.a);
     const radius = scaledDiameter / 2;
     if (hole.hole_shape === "circle") {
-      return [
-        {
+      const holeElement2 = {
+        name: "circle",
+        type: "element",
+        attributes: {
+          class: "pcb-hole",
+          cx: x.toString(),
+          cy: y.toString(),
+          r: radius.toString(),
+          fill: colorMap2.drill,
+          "data-type": "pcb_hole",
+          "data-pcb-layer": "drill"
+        },
+        children: [],
+        value: ""
+      };
+      if (!shouldShowSolderMask) {
+        return [holeElement2];
+      }
+      const maskRadius = radius + soldermaskMargin;
+      if (soldermaskMargin < 0) {
+        const coveredElement = {
           name: "circle",
           type: "element",
+          value: "",
+          children: [],
           attributes: {
-            class: "pcb-hole",
+            class: "pcb-hole-covered",
+            fill: solderMaskColor,
             cx: x.toString(),
             cy: y.toString(),
             r: radius.toString(),
-            fill: colorMap2.drill,
             "data-type": "pcb_hole",
             "data-pcb-layer": "drill"
-          },
+          }
+        };
+        const exposedElement = {
+          name: "circle",
+          type: "element",
+          value: "",
           children: [],
-          value: ""
+          attributes: {
+            class: "pcb-hole-exposed",
+            fill: colorMap2.drill,
+            cx: x.toString(),
+            cy: y.toString(),
+            r: maskRadius.toString(),
+            "data-type": "pcb_soldermask",
+            "data-pcb-layer": "drill"
+          }
+        };
+        return [coveredElement, exposedElement];
+      }
+      const substrateElement2 = {
+        name: "circle",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-soldermask-cutout",
+          fill: colorMap2.substrate,
+          cx: x.toString(),
+          cy: y.toString(),
+          r: maskRadius.toString(),
+          "data-type": "pcb_soldermask_opening",
+          "data-pcb-layer": layer
         }
-      ];
+      };
+      return [substrateElement2, holeElement2];
     }
-    return [
-      {
+    const holeElement = {
+      name: "rect",
+      type: "element",
+      attributes: {
+        class: "pcb-hole",
+        x: (x - radius).toString(),
+        y: (y - radius).toString(),
+        width: scaledDiameter.toString(),
+        height: scaledDiameter.toString(),
+        fill: colorMap2.drill,
+        "data-type": "pcb_hole",
+        "data-pcb-layer": "drill"
+      },
+      children: [],
+      value: ""
+    };
+    if (!shouldShowSolderMask) {
+      return [holeElement];
+    }
+    const maskDiameter = scaledDiameter + 2 * soldermaskMargin;
+    if (soldermaskMargin < 0) {
+      const coveredElement = {
         name: "rect",
         type: "element",
+        value: "",
+        children: [],
         attributes: {
-          class: "pcb-hole",
+          class: "pcb-hole-covered",
+          fill: solderMaskColor,
           x: (x - radius).toString(),
           y: (y - radius).toString(),
           width: scaledDiameter.toString(),
           height: scaledDiameter.toString(),
-          fill: colorMap2.drill,
           "data-type": "pcb_hole",
           "data-pcb-layer": "drill"
-        },
+        }
+      };
+      const exposedElement = {
+        name: "rect",
+        type: "element",
+        value: "",
         children: [],
-        value: ""
+        attributes: {
+          class: "pcb-hole-exposed",
+          fill: colorMap2.drill,
+          x: (x - maskDiameter / 2).toString(),
+          y: (y - maskDiameter / 2).toString(),
+          width: maskDiameter.toString(),
+          height: maskDiameter.toString(),
+          "data-type": "pcb_soldermask",
+          "data-pcb-layer": "drill"
+        }
+      };
+      return [coveredElement, exposedElement];
+    }
+    const substrateElement = {
+      name: "rect",
+      type: "element",
+      value: "",
+      children: [],
+      attributes: {
+        class: "pcb-soldermask-cutout",
+        fill: colorMap2.substrate,
+        x: (x - maskDiameter / 2).toString(),
+        y: (y - maskDiameter / 2).toString(),
+        width: maskDiameter.toString(),
+        height: maskDiameter.toString(),
+        "data-type": "pcb_soldermask_opening",
+        "data-pcb-layer": layer
       }
-    ];
+    };
+    return [substrateElement, holeElement];
   }
   if (hole.hole_shape === "oval") {
     const scaledWidth = hole.hole_width * Math.abs(transform.a);
     const scaledHeight = hole.hole_height * Math.abs(transform.a);
     const rx = scaledWidth / 2;
     const ry = scaledHeight / 2;
-    return [
-      {
+    const holeElement = {
+      name: "ellipse",
+      type: "element",
+      attributes: {
+        class: "pcb-hole",
+        cx: x.toString(),
+        cy: y.toString(),
+        rx: rx.toString(),
+        ry: ry.toString(),
+        fill: colorMap2.drill,
+        "data-type": "pcb_hole",
+        "data-pcb-layer": "drill"
+      },
+      children: [],
+      value: ""
+    };
+    if (!shouldShowSolderMask) {
+      return [holeElement];
+    }
+    const maskRx = rx + soldermaskMargin;
+    const maskRy = ry + soldermaskMargin;
+    if (soldermaskMargin < 0) {
+      const coveredElement = {
         name: "ellipse",
         type: "element",
+        value: "",
+        children: [],
         attributes: {
-          class: "pcb-hole",
+          class: "pcb-hole-covered",
+          fill: solderMaskColor,
           cx: x.toString(),
           cy: y.toString(),
           rx: rx.toString(),
           ry: ry.toString(),
+          "data-type": "pcb_hole",
+          "data-pcb-layer": "drill"
+        }
+      };
+      const exposedElement = {
+        name: "ellipse",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-hole-exposed",
           fill: colorMap2.drill,
+          cx: x.toString(),
+          cy: y.toString(),
+          rx: maskRx.toString(),
+          ry: maskRy.toString(),
+          "data-type": "pcb_soldermask",
+          "data-pcb-layer": "drill"
+        }
+      };
+      return [coveredElement, exposedElement];
+    }
+    const substrateElement = {
+      name: "ellipse",
+      type: "element",
+      value: "",
+      children: [],
+      attributes: {
+        class: "pcb-soldermask-cutout",
+        fill: colorMap2.substrate,
+        cx: x.toString(),
+        cy: y.toString(),
+        rx: maskRx.toString(),
+        ry: maskRy.toString(),
+        "data-type": "pcb_soldermask_opening",
+        "data-pcb-layer": layer
+      }
+    };
+    return [substrateElement, holeElement];
+  }
+  if (hole.hole_shape === "rect") {
+    const scaledWidth = hole.hole_width * Math.abs(transform.a);
+    const scaledHeight = hole.hole_height * Math.abs(transform.a);
+    const holeElement = {
+      name: "rect",
+      type: "element",
+      attributes: {
+        class: "pcb-hole",
+        x: (x - scaledWidth / 2).toString(),
+        y: (y - scaledHeight / 2).toString(),
+        width: scaledWidth.toString(),
+        height: scaledHeight.toString(),
+        fill: colorMap2.drill,
+        "data-type": "pcb_hole",
+        "data-pcb-layer": "drill"
+      },
+      children: [],
+      value: ""
+    };
+    if (!shouldShowSolderMask) {
+      return [holeElement];
+    }
+    const maskWidth = scaledWidth + 2 * soldermaskMargin;
+    const maskHeight = scaledHeight + 2 * soldermaskMargin;
+    if (soldermaskMargin < 0) {
+      const coveredElement = {
+        name: "rect",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-hole-covered",
+          fill: solderMaskColor,
+          x: (x - scaledWidth / 2).toString(),
+          y: (y - scaledHeight / 2).toString(),
+          width: scaledWidth.toString(),
+          height: scaledHeight.toString(),
           "data-type": "pcb_hole",
           "data-pcb-layer": "drill"
-        },
+        }
+      };
+      const exposedElement = {
+        name: "rect",
+        type: "element",
+        value: "",
         children: [],
-        value: ""
+        attributes: {
+          class: "pcb-hole-exposed",
+          fill: colorMap2.drill,
+          x: (x - maskWidth / 2).toString(),
+          y: (y - maskHeight / 2).toString(),
+          width: maskWidth.toString(),
+          height: maskHeight.toString(),
+          "data-type": "pcb_soldermask",
+          "data-pcb-layer": "drill"
+        }
+      };
+      return [coveredElement, exposedElement];
+    }
+    const substrateElement = {
+      name: "rect",
+      type: "element",
+      value: "",
+      children: [],
+      attributes: {
+        class: "pcb-soldermask-cutout",
+        fill: colorMap2.substrate,
+        x: (x - maskWidth / 2).toString(),
+        y: (y - maskHeight / 2).toString(),
+        width: maskWidth.toString(),
+        height: maskHeight.toString(),
+        "data-type": "pcb_soldermask_opening",
+        "data-pcb-layer": layer
       }
-    ];
+    };
+    return [substrateElement, holeElement];
   }
   if (hole.hole_shape === "pill") {
     const scaledWidth = hole.hole_width * Math.abs(transform.a);
@@ -2778,21 +3932,79 @@ function createSvgObjectsFromPcbHole(hole, ctx) {
       // Vertical pill (taller than wide)
       `M${x - radius},${y - straightLength / 2} v${straightLength} a${radius},${radius} 0 0 0 ${scaledWidth},0 v-${straightLength} a${radius},${radius} 0 0 0 -${scaledWidth},0 z`
     );
-    return [
-      {
+    const holeElement = {
+      name: "path",
+      type: "element",
+      attributes: {
+        class: "pcb-hole",
+        fill: colorMap2.drill,
+        d: pathD,
+        "data-type": "pcb_hole",
+        "data-pcb-layer": "drill"
+      },
+      children: [],
+      value: ""
+    };
+    if (!shouldShowSolderMask) {
+      return [holeElement];
+    }
+    const maskWidth = scaledWidth + 2 * soldermaskMargin;
+    const maskHeight = scaledHeight + 2 * soldermaskMargin;
+    const maskIsHorizontal = maskWidth > maskHeight;
+    const maskRadius = Math.min(maskWidth, maskHeight) / 2;
+    const maskStraightLength = Math.abs(
+      maskIsHorizontal ? maskWidth - maskHeight : maskHeight - maskWidth
+    );
+    const maskPathD = maskIsHorizontal ? (
+      // Horizontal pill (wider than tall)
+      `M${x - maskStraightLength / 2},${y - maskRadius} h${maskStraightLength} a${maskRadius},${maskRadius} 0 0 1 0,${maskHeight} h-${maskStraightLength} a${maskRadius},${maskRadius} 0 0 1 0,-${maskHeight} z`
+    ) : (
+      // Vertical pill (taller than wide)
+      `M${x - maskRadius},${y - maskStraightLength / 2} v${maskStraightLength} a${maskRadius},${maskRadius} 0 0 0 ${maskWidth},0 v-${maskStraightLength} a${maskRadius},${maskRadius} 0 0 0 -${maskWidth},0 z`
+    );
+    if (soldermaskMargin < 0) {
+      const coveredElement = {
         name: "path",
         type: "element",
+        value: "",
+        children: [],
         attributes: {
-          class: "pcb-hole",
-          fill: colorMap2.drill,
+          class: "pcb-hole-covered",
+          fill: solderMaskColor,
           d: pathD,
           "data-type": "pcb_hole",
           "data-pcb-layer": "drill"
-        },
+        }
+      };
+      const exposedElement = {
+        name: "path",
+        type: "element",
+        value: "",
         children: [],
-        value: ""
+        attributes: {
+          class: "pcb-hole-exposed",
+          fill: colorMap2.drill,
+          d: maskPathD,
+          "data-type": "pcb_soldermask",
+          "data-pcb-layer": "drill"
+        }
+      };
+      return [coveredElement, exposedElement];
+    }
+    const substrateElement = {
+      name: "path",
+      type: "element",
+      value: "",
+      children: [],
+      attributes: {
+        class: "pcb-soldermask-cutout",
+        fill: colorMap2.substrate,
+        d: maskPathD,
+        "data-type": "pcb_soldermask_opening",
+        "data-pcb-layer": layer
       }
-    ];
+    };
+    return [substrateElement, holeElement];
   }
   if (hole.hole_shape === "rotated_pill") {
     const scaledWidth = hole.hole_width * Math.abs(transform.a);
@@ -2810,22 +4022,82 @@ function createSvgObjectsFromPcbHole(hole, ctx) {
       // Vertical pill (taller than wide)
       `M${-radius},${-straightLength / 2} v${straightLength} a${radius},${radius} 0 0 0 ${scaledWidth},0 v-${straightLength} a${radius},${radius} 0 0 0 -${scaledWidth},0 z`
     );
-    return [
-      {
+    const holeElement = {
+      name: "path",
+      type: "element",
+      attributes: {
+        class: "pcb-hole",
+        fill: colorMap2.drill,
+        d: pathD,
+        transform: `translate(${x} ${y}) rotate(${-rotation})`,
+        "data-type": "pcb_hole",
+        "data-pcb-layer": "drill"
+      },
+      children: [],
+      value: ""
+    };
+    if (!shouldShowSolderMask) {
+      return [holeElement];
+    }
+    const maskWidth = scaledWidth + 2 * soldermaskMargin;
+    const maskHeight = scaledHeight + 2 * soldermaskMargin;
+    const maskIsHorizontal = maskWidth > maskHeight;
+    const maskRadius = Math.min(maskWidth, maskHeight) / 2;
+    const maskStraightLength = Math.abs(
+      maskIsHorizontal ? maskWidth - maskHeight : maskHeight - maskWidth
+    );
+    const maskPathD = maskIsHorizontal ? (
+      // Horizontal pill (wider than tall)
+      `M${-maskStraightLength / 2},${-maskRadius} h${maskStraightLength} a${maskRadius},${maskRadius} 0 0 1 0,${maskHeight} h-${maskStraightLength} a${maskRadius},${maskRadius} 0 0 1 0,-${maskHeight} z`
+    ) : (
+      // Vertical pill (taller than wide)
+      `M${-maskRadius},${-maskStraightLength / 2} v${maskStraightLength} a${maskRadius},${maskRadius} 0 0 0 ${maskWidth},0 v-${maskStraightLength} a${maskRadius},${maskRadius} 0 0 0 -${maskWidth},0 z`
+    );
+    if (soldermaskMargin < 0) {
+      const coveredElement = {
         name: "path",
         type: "element",
+        value: "",
+        children: [],
         attributes: {
-          class: "pcb-hole",
-          fill: colorMap2.drill,
+          class: "pcb-hole-covered",
+          fill: solderMaskColor,
           d: pathD,
           transform: `translate(${x} ${y}) rotate(${-rotation})`,
           "data-type": "pcb_hole",
           "data-pcb-layer": "drill"
-        },
+        }
+      };
+      const exposedElement = {
+        name: "path",
+        type: "element",
+        value: "",
         children: [],
-        value: ""
+        attributes: {
+          class: "pcb-hole-exposed",
+          fill: colorMap2.drill,
+          d: maskPathD,
+          transform: `translate(${x} ${y}) rotate(${-rotation})`,
+          "data-type": "pcb_soldermask",
+          "data-pcb-layer": "drill"
+        }
+      };
+      return [coveredElement, exposedElement];
+    }
+    const substrateElement = {
+      name: "path",
+      type: "element",
+      value: "",
+      children: [],
+      attributes: {
+        class: "pcb-soldermask-cutout",
+        fill: colorMap2.substrate,
+        d: maskPathD,
+        "data-type": "pcb_soldermask_opening",
+        "data-pcb-layer": layer
       }
-    ];
+    };
+    return [substrateElement, holeElement];
   }
   return [];
 }
@@ -2939,23 +4211,34 @@ function createSvgObjectsFromPcbCutout(cutout, ctx) {
     const scaledWidth = rectCutout.width * Math.abs(transform.a);
     const scaledHeight = rectCutout.height * Math.abs(transform.d);
     const svgRotation = -(rectCutout.rotation ?? 0);
+    const { corner_radius } = rectCutout;
+    const baseCornerRadius = typeof corner_radius === "number" && corner_radius > 0 ? corner_radius : 0;
+    const transformedCornerRadiusX = baseCornerRadius * Math.abs(transform.a);
+    const transformedCornerRadiusY = baseCornerRadius * Math.abs(transform.d);
+    const attributes = {
+      class: "pcb-cutout pcb-cutout-rect",
+      x: (-scaledWidth / 2).toString(),
+      y: (-scaledHeight / 2).toString(),
+      width: scaledWidth.toString(),
+      height: scaledHeight.toString(),
+      fill: colorMap2.drill,
+      transform: toString(
+        compose(translate(cx, cy), rotate(svgRotation * Math.PI / 180))
+      ),
+      "data-type": "pcb_cutout",
+      "data-pcb-layer": "drill"
+    };
+    if (transformedCornerRadiusX > 0) {
+      attributes.rx = transformedCornerRadiusX.toString();
+    }
+    if (transformedCornerRadiusY > 0) {
+      attributes.ry = transformedCornerRadiusY.toString();
+    }
     return [
       {
         name: "rect",
         type: "element",
-        attributes: {
-          class: "pcb-cutout pcb-cutout-rect",
-          x: (-scaledWidth / 2).toString(),
-          y: (-scaledHeight / 2).toString(),
-          width: scaledWidth.toString(),
-          height: scaledHeight.toString(),
-          fill: colorMap2.drill,
-          transform: toString(
-            compose(translate(cx, cy), rotate(svgRotation * Math.PI / 180))
-          ),
-          "data-type": "pcb_cutout",
-          "data-pcb-layer": "drill"
-        },
+        attributes,
         children: [],
         value: ""
       }
@@ -3038,39 +4321,113 @@ function ringToPathD(vertices, transform) {
   d += " Z";
   return d;
 }
+function createSoldermaskCutoutElement({
+  elementType,
+  shapeAttributes,
+  layer,
+  colorMap: colorMap2,
+  additionalAttributes
+}) {
+  const baseAttributes = {
+    class: "pcb-soldermask-cutout",
+    fill: colorMap2.substrate,
+    "data-type": "pcb_soldermask_opening",
+    "data-pcb-layer": layer,
+    ...shapeAttributes,
+    ...additionalAttributes
+  };
+  return {
+    name: elementType,
+    type: "element",
+    value: "",
+    children: [],
+    attributes: baseAttributes
+  };
+}
+function createSoldermaskOverlayElement({
+  elementType,
+  shapeAttributes,
+  layer,
+  fillColor,
+  fillOpacity,
+  className,
+  additionalAttributes
+}) {
+  const baseAttributes = {
+    class: className,
+    fill: fillColor,
+    "fill-opacity": fillOpacity,
+    "data-type": "pcb_soldermask",
+    "data-pcb-layer": layer,
+    ...shapeAttributes,
+    ...additionalAttributes
+  };
+  return {
+    name: elementType,
+    type: "element",
+    value: "",
+    children: [],
+    attributes: baseAttributes
+  };
+}
 function createSvgObjectsFromPcbCopperPour(pour, ctx) {
-  const { transform, layer: layerFilter, colorMap: colorMap2 } = ctx;
+  const { transform, layer: layerFilter, colorMap: colorMap2, showSolderMask } = ctx;
   const { layer } = pour;
   if (layerFilter && layer !== layerFilter) return [];
   const color = layerNameToColor(layer, colorMap2);
   const opacity = "0.5";
+  const isCoveredWithSolderMask = pour.covered_with_solder_mask !== false;
+  const maskOverlayColor = layer === "bottom" ? colorMap2.soldermaskOverCopper.bottom : colorMap2.soldermaskOverCopper.top;
+  const maskOverlayOpacity = "0.9";
   if (pour.shape === "rect") {
     const [cx, cy] = applyToPoint(transform, [pour.center.x, pour.center.y]);
     const scaledWidth = pour.width * Math.abs(transform.a);
     const scaledHeight = pour.height * Math.abs(transform.d);
     const svgRotation = -(pour.rotation ?? 0);
-    return [
-      {
-        name: "rect",
-        type: "element",
-        attributes: {
-          class: "pcb-copper-pour pcb-copper-pour-rect",
-          x: (-scaledWidth / 2).toString(),
-          y: (-scaledHeight / 2).toString(),
-          width: scaledWidth.toString(),
-          height: scaledHeight.toString(),
-          fill: color,
-          "fill-opacity": opacity,
-          transform: toString(
-            compose(translate(cx, cy), rotate(svgRotation * Math.PI / 180))
-          ),
-          "data-type": "pcb_copper_pour",
-          "data-pcb-layer": layer
-        },
-        children: [],
-        value: ""
+    const rectAttributes = {
+      x: (-scaledWidth / 2).toString(),
+      y: (-scaledHeight / 2).toString(),
+      width: scaledWidth.toString(),
+      height: scaledHeight.toString(),
+      transform: toString(
+        compose(translate(cx, cy), rotate(svgRotation * Math.PI / 180))
+      )
+    };
+    const copperRect = {
+      name: "rect",
+      type: "element",
+      value: "",
+      children: [],
+      attributes: {
+        class: "pcb-copper-pour pcb-copper-pour-rect",
+        ...rectAttributes,
+        fill: color,
+        "fill-opacity": opacity,
+        "data-type": "pcb_copper_pour",
+        "data-pcb-layer": layer
       }
-    ];
+    };
+    const maskRect = showSolderMask ? isCoveredWithSolderMask ? createSoldermaskOverlayElement({
+      elementType: "rect",
+      shapeAttributes: rectAttributes,
+      layer,
+      fillColor: maskOverlayColor,
+      fillOpacity: maskOverlayOpacity,
+      className: "pcb-soldermask-covered-pour"
+    }) : createSoldermaskCutoutElement({
+      elementType: "rect",
+      shapeAttributes: rectAttributes,
+      layer,
+      colorMap: colorMap2
+    }) : null;
+    if (!maskRect) {
+      return [copperRect];
+    }
+    const isSubstrateOnly = !isCoveredWithSolderMask && pour.pcb_copper_pour_id?.includes("substrate_only");
+    if (isSubstrateOnly) {
+      return [maskRect];
+    }
+    return [copperRect, maskRect];
   }
   if (pour.shape === "polygon") {
     if (!pour.points || pour.points.length === 0) return [];
@@ -3078,22 +4435,41 @@ function createSvgObjectsFromPcbCopperPour(pour, ctx) {
       (p) => applyToPoint(transform, [p.x, p.y])
     );
     const pointsString = transformedPoints.map((p) => `${p[0]},${p[1]}`).join(" ");
-    return [
-      {
-        name: "polygon",
-        type: "element",
-        attributes: {
-          class: "pcb-copper-pour pcb-copper-pour-polygon",
-          points: pointsString,
-          fill: color,
-          "fill-opacity": opacity,
-          "data-type": "pcb_copper_pour",
-          "data-pcb-layer": layer
-        },
-        children: [],
-        value: ""
+    const copperPolygon = {
+      name: "polygon",
+      type: "element",
+      value: "",
+      children: [],
+      attributes: {
+        class: "pcb-copper-pour pcb-copper-pour-polygon",
+        points: pointsString,
+        fill: color,
+        "fill-opacity": opacity,
+        "data-type": "pcb_copper_pour",
+        "data-pcb-layer": layer
       }
-    ];
+    };
+    const maskPolygon = showSolderMask ? isCoveredWithSolderMask ? createSoldermaskOverlayElement({
+      elementType: "polygon",
+      shapeAttributes: { points: pointsString },
+      layer,
+      fillColor: maskOverlayColor,
+      fillOpacity: maskOverlayOpacity,
+      className: "pcb-soldermask-covered-pour"
+    }) : createSoldermaskCutoutElement({
+      elementType: "polygon",
+      shapeAttributes: { points: pointsString },
+      layer,
+      colorMap: colorMap2
+    }) : null;
+    if (!maskPolygon) {
+      return [copperPolygon];
+    }
+    const isSubstrateOnly = !isCoveredWithSolderMask && pour.pcb_copper_pour_id?.includes("substrate_only");
+    if (isSubstrateOnly) {
+      return [maskPolygon];
+    }
+    return [copperPolygon, maskPolygon];
   }
   if (pour.shape === "brep") {
     const { brep_shape } = pour;
@@ -3101,23 +4477,42 @@ function createSvgObjectsFromPcbCopperPour(pour, ctx) {
     for (const inner_ring of brep_shape.inner_rings ?? []) {
       d += ` ${ringToPathD(inner_ring.vertices, transform)}`;
     }
-    return [
-      {
-        name: "path",
-        type: "element",
-        attributes: {
-          class: "pcb-copper-pour pcb-copper-pour-brep",
-          d,
-          fill: color,
-          "fill-rule": "evenodd",
-          "fill-opacity": opacity,
-          "data-type": "pcb_copper_pour",
-          "data-pcb-layer": layer
-        },
-        children: [],
-        value: ""
+    const copperPath = {
+      name: "path",
+      type: "element",
+      value: "",
+      children: [],
+      attributes: {
+        class: "pcb-copper-pour pcb-copper-pour-brep",
+        d,
+        fill: color,
+        "fill-rule": "evenodd",
+        "fill-opacity": opacity,
+        "data-type": "pcb_copper_pour",
+        "data-pcb-layer": layer
       }
-    ];
+    };
+    const maskPath = showSolderMask ? isCoveredWithSolderMask ? createSoldermaskOverlayElement({
+      elementType: "path",
+      shapeAttributes: { d, "fill-rule": "evenodd" },
+      layer,
+      fillColor: maskOverlayColor,
+      fillOpacity: maskOverlayOpacity,
+      className: "pcb-soldermask-covered-pour"
+    }) : createSoldermaskCutoutElement({
+      elementType: "path",
+      shapeAttributes: { d, "fill-rule": "evenodd" },
+      layer,
+      colorMap: colorMap2
+    }) : null;
+    if (!maskPath) {
+      return [copperPath];
+    }
+    const isSubstrateOnly = !isCoveredWithSolderMask && pour.pcb_copper_pour_id?.includes("substrate_only");
+    if (isSubstrateOnly) {
+      return [maskPath];
+    }
+    return [copperPath, maskPath];
   }
   return [];
 }
@@ -3255,45 +4650,362 @@ function createMajorGridPatternChildren(cellSize, majorCellSize, lineColor, majo
   }
   return children;
 }
+var OFFSET_THRESHOLD_MM = 0.01;
+var TICK_SIZE_PX = 4;
+var LABEL_GAP_PX = 8;
+var LABEL_FONT_SIZE_PX = 11;
+var STROKE_WIDTH_PX = 1;
+var ANCHOR_MARKER_SIZE_PX = 5;
+var ANCHOR_MARKER_STROKE_WIDTH_PX = 1.5;
+var COMPONENT_GAP_PX = 15;
+var COMPONENT_SIDE_GAP_PX = 10;
+var DISTANCE_MULTIPLIER = 0.2;
+var MAX_OFFSET_PX = 50;
+function createAnchorOffsetIndicators(params) {
+  const {
+    groupAnchorPosition,
+    componentPosition,
+    transform,
+    componentWidth = 0,
+    componentHeight = 0
+  } = params;
+  const objects = [];
+  const [screenGroupAnchorX, screenGroupAnchorY] = applyToPoint(transform, [
+    groupAnchorPosition.x,
+    groupAnchorPosition.y
+  ]);
+  const [screenComponentX, screenComponentY] = applyToPoint(transform, [
+    componentPosition.x,
+    componentPosition.y
+  ]);
+  const offsetX = componentPosition.x - groupAnchorPosition.x;
+  const offsetY = componentPosition.y - groupAnchorPosition.y;
+  const scale9 = Math.abs(transform.a);
+  const screenComponentWidth = componentWidth * scale9;
+  const screenComponentHeight = componentHeight * scale9;
+  objects.push(createAnchorMarker(screenGroupAnchorX, screenGroupAnchorY));
+  objects.push({
+    name: "line",
+    type: "element",
+    attributes: {
+      x1: screenGroupAnchorX.toString(),
+      y1: screenGroupAnchorY.toString(),
+      x2: screenComponentX.toString(),
+      y2: screenComponentY.toString(),
+      stroke: "#ffffff",
+      "stroke-width": "0.5",
+      "stroke-dasharray": "3,3",
+      opacity: "0.5",
+      class: "anchor-offset-connector"
+    },
+    children: [],
+    value: ""
+  });
+  objects.push({
+    name: "circle",
+    type: "element",
+    attributes: {
+      cx: screenComponentX.toString(),
+      cy: screenComponentY.toString(),
+      r: "2",
+      fill: "#ffffff",
+      opacity: "0.7",
+      class: "anchor-offset-component-marker"
+    },
+    children: [],
+    value: ""
+  });
+  const yDistance = Math.abs(screenComponentY - screenGroupAnchorY);
+  const xDistance = Math.abs(screenComponentX - screenGroupAnchorX);
+  const totalDistance = Math.sqrt(xDistance * xDistance + yDistance * yDistance);
+  const componentHeightOffset = screenComponentHeight / 2 + COMPONENT_GAP_PX;
+  const dynamicOffset = Math.max(
+    componentHeightOffset,
+    Math.min(MAX_OFFSET_PX, totalDistance * DISTANCE_MULTIPLIER)
+  );
+  const horizontalLineY = offsetY > 0 ? screenComponentY - dynamicOffset : screenComponentY + dynamicOffset;
+  const componentWidthOffset = screenComponentWidth / 2 + COMPONENT_SIDE_GAP_PX;
+  const verticalLineX = offsetX > 0 ? screenComponentX + componentWidthOffset : screenComponentX - componentWidthOffset;
+  if (Math.abs(offsetX) > OFFSET_THRESHOLD_MM) {
+    objects.push(
+      ...createHorizontalDimension({
+        startX: screenGroupAnchorX,
+        endX: screenComponentX,
+        y: horizontalLineY,
+        offsetMm: offsetX,
+        offsetY
+      })
+    );
+  }
+  if (Math.abs(offsetY) > OFFSET_THRESHOLD_MM) {
+    objects.push(
+      ...createVerticalDimension({
+        x: verticalLineX,
+        startY: screenGroupAnchorY,
+        endY: screenComponentY,
+        offsetMm: -offsetY,
+        offsetX
+      })
+    );
+  }
+  return objects;
+}
+function createAnchorMarker(x, y) {
+  return {
+    name: "g",
+    type: "element",
+    attributes: {
+      class: "anchor-offset-marker",
+      "data-type": "anchor_offset_marker"
+    },
+    children: [
+      {
+        name: "line",
+        type: "element",
+        attributes: {
+          x1: x.toString(),
+          y1: (y - ANCHOR_MARKER_SIZE_PX).toString(),
+          x2: x.toString(),
+          y2: (y + ANCHOR_MARKER_SIZE_PX).toString(),
+          stroke: "#ffffff",
+          "stroke-width": ANCHOR_MARKER_STROKE_WIDTH_PX.toString(),
+          "stroke-linecap": "round"
+        },
+        children: [],
+        value: ""
+      },
+      {
+        name: "line",
+        type: "element",
+        attributes: {
+          x1: (x - ANCHOR_MARKER_SIZE_PX).toString(),
+          y1: y.toString(),
+          x2: (x + ANCHOR_MARKER_SIZE_PX).toString(),
+          y2: y.toString(),
+          stroke: "#ffffff",
+          "stroke-width": ANCHOR_MARKER_STROKE_WIDTH_PX.toString(),
+          "stroke-linecap": "round"
+        },
+        children: [],
+        value: ""
+      }
+    ],
+    value: ""
+  };
+}
+function createHorizontalDimension({
+  startX,
+  endX,
+  y,
+  offsetMm,
+  offsetY
+}) {
+  const objects = [];
+  objects.push({
+    name: "line",
+    type: "element",
+    attributes: {
+      x1: startX.toString(),
+      y1: y.toString(),
+      x2: endX.toString(),
+      y2: y.toString(),
+      stroke: "#ffffff",
+      "stroke-width": STROKE_WIDTH_PX.toString(),
+      class: "anchor-offset-dimension-x"
+    },
+    children: [],
+    value: ""
+  });
+  objects.push({
+    name: "line",
+    type: "element",
+    attributes: {
+      x1: startX.toString(),
+      y1: (y - TICK_SIZE_PX).toString(),
+      x2: startX.toString(),
+      y2: (y + TICK_SIZE_PX).toString(),
+      stroke: "#ffffff",
+      "stroke-width": STROKE_WIDTH_PX.toString()
+    },
+    children: [],
+    value: ""
+  });
+  objects.push({
+    name: "line",
+    type: "element",
+    attributes: {
+      x1: endX.toString(),
+      y1: (y - TICK_SIZE_PX).toString(),
+      x2: endX.toString(),
+      y2: (y + TICK_SIZE_PX).toString(),
+      stroke: "#ffffff",
+      "stroke-width": STROKE_WIDTH_PX.toString()
+    },
+    children: [],
+    value: ""
+  });
+  const midX = (startX + endX) / 2;
+  const labelY = offsetY > 0 ? y - TICK_SIZE_PX - LABEL_GAP_PX : y + TICK_SIZE_PX + LABEL_GAP_PX;
+  objects.push({
+    name: "text",
+    type: "element",
+    attributes: {
+      x: midX.toString(),
+      y: labelY.toString(),
+      fill: "#ffffff",
+      "font-size": LABEL_FONT_SIZE_PX.toString(),
+      "font-family": "Arial, sans-serif",
+      "text-anchor": "middle",
+      "dominant-baseline": offsetY > 0 ? "baseline" : "hanging",
+      class: "anchor-offset-label"
+    },
+    children: [
+      {
+        type: "text",
+        value: `X: ${offsetMm.toFixed(2)}mm`,
+        name: "",
+        attributes: {},
+        children: []
+      }
+    ],
+    value: ""
+  });
+  return objects;
+}
+function createVerticalDimension({
+  x,
+  startY,
+  endY,
+  offsetMm,
+  offsetX
+}) {
+  const objects = [];
+  objects.push({
+    name: "line",
+    type: "element",
+    attributes: {
+      x1: x.toString(),
+      y1: startY.toString(),
+      x2: x.toString(),
+      y2: endY.toString(),
+      stroke: "#ffffff",
+      "stroke-width": STROKE_WIDTH_PX.toString(),
+      class: "anchor-offset-dimension-y"
+    },
+    children: [],
+    value: ""
+  });
+  objects.push({
+    name: "line",
+    type: "element",
+    attributes: {
+      x1: (x - TICK_SIZE_PX).toString(),
+      y1: startY.toString(),
+      x2: (x + TICK_SIZE_PX).toString(),
+      y2: startY.toString(),
+      stroke: "#ffffff",
+      "stroke-width": STROKE_WIDTH_PX.toString()
+    },
+    children: [],
+    value: ""
+  });
+  objects.push({
+    name: "line",
+    type: "element",
+    attributes: {
+      x1: (x - TICK_SIZE_PX).toString(),
+      y1: endY.toString(),
+      x2: (x + TICK_SIZE_PX).toString(),
+      y2: endY.toString(),
+      stroke: "#ffffff",
+      "stroke-width": STROKE_WIDTH_PX.toString()
+    },
+    children: [],
+    value: ""
+  });
+  const midY = (startY + endY) / 2;
+  const labelX = offsetX < 0 ? x - TICK_SIZE_PX - 4 : x + TICK_SIZE_PX + 4;
+  objects.push({
+    name: "text",
+    type: "element",
+    attributes: {
+      x: labelX.toString(),
+      y: midY.toString(),
+      fill: "#ffffff",
+      "font-size": LABEL_FONT_SIZE_PX.toString(),
+      "font-family": "Arial, sans-serif",
+      "text-anchor": offsetX < 0 ? "end" : "start",
+      "dominant-baseline": "middle",
+      class: "anchor-offset-label"
+    },
+    children: [
+      {
+        type: "text",
+        value: `Y: ${offsetMm.toFixed(2)}mm`,
+        name: "",
+        attributes: {},
+        children: []
+      }
+    ],
+    value: ""
+  });
+  return objects;
+}
 function createSvgObjectsFromPcbComponent(component, ctx) {
-  const { transform } = ctx;
+  const { transform, circuitJson } = ctx;
   const { center, width, height, rotation = 0 } = component;
   const [x, y] = applyToPoint(transform, [center.x, center.y]);
   const scaledWidth = width * Math.abs(transform.a);
   const scaledHeight = height * Math.abs(transform.d);
   const transformStr = `translate(${x}, ${y}) rotate(${-rotation}) scale(1, -1)`;
-  if (!ctx.colorMap.debugComponent?.fill && !ctx.colorMap.debugComponent?.stroke) {
-    return [];
-  }
-  return [
-    {
-      name: "g",
-      type: "element",
-      attributes: {
-        transform: transformStr,
-        "data-type": "pcb_component",
-        "data-pcb-layer": component.layer ?? "top"
-      },
-      children: [
-        {
-          name: "rect",
-          type: "element",
-          attributes: {
-            class: "pcb-component",
-            x: (-scaledWidth / 2).toString(),
-            y: (-scaledHeight / 2).toString(),
-            width: scaledWidth.toString(),
-            height: scaledHeight.toString(),
-            fill: ctx.colorMap.debugComponent.fill ?? "transparent",
-            stroke: ctx.colorMap.debugComponent.stroke ?? "transparent",
-            "data-type": "pcb_component",
-            "data-pcb-layer": component.layer ?? "top"
-          }
-        }
-      ],
-      value: ""
+  const svgObjects = [];
+  if (ctx.showAnchorOffsets && component.positioned_relative_to_pcb_group_id && component.position_mode === "relative" && circuitJson) {
+    const pcbGroup = circuitJson.find(
+      (elm) => elm.type === "pcb_group" && elm.pcb_group_id === component.positioned_relative_to_pcb_group_id
+    );
+    if (pcbGroup?.center) {
+      svgObjects.push(
+        ...createAnchorOffsetIndicators({
+          groupAnchorPosition: pcbGroup.center,
+          componentPosition: center,
+          transform,
+          componentWidth: width,
+          componentHeight: height
+        })
+      );
     }
-  ];
+  }
+  if (!ctx.colorMap.debugComponent?.fill && !ctx.colorMap.debugComponent?.stroke) {
+    return svgObjects;
+  }
+  svgObjects.push({
+    name: "g",
+    type: "element",
+    attributes: {
+      transform: transformStr,
+      "data-type": "pcb_component",
+      "data-pcb-layer": component.layer ?? "top"
+    },
+    children: [
+      {
+        name: "rect",
+        type: "element",
+        attributes: {
+          class: "pcb-component",
+          x: (-scaledWidth / 2).toString(),
+          y: (-scaledHeight / 2).toString(),
+          width: scaledWidth.toString(),
+          height: scaledHeight.toString(),
+          fill: ctx.colorMap.debugComponent.fill ?? "transparent",
+          stroke: ctx.colorMap.debugComponent.stroke ?? "transparent",
+          "data-type": "pcb_component",
+          "data-pcb-layer": component.layer ?? "top"
+        }
+      }
+    ],
+    value: ""
+  });
+  return svgObjects;
 }
 var DEFAULT_GROUP_COLOR = "rgba(100, 200, 255, 0.6)";
 var DEFAULT_STROKE_WIDTH = 0.1;
@@ -3379,7 +5091,7 @@ function getSoftwareUsedString(circuitJson) {
 var package_default = {
   name: "circuit-to-svg",
   type: "module",
-  version: "0.0.259",
+  version: "0.0.282",
   description: "Convert Circuit JSON to SVG",
   main: "dist/index.js",
   files: [
@@ -3403,12 +5115,12 @@ var package_default = {
     "bun-match-svg": "^0.0.12",
     esbuild: "^0.20.2",
     "performance-now": "^2.1.0",
-    "circuit-json": "^0.0.297",
+    "circuit-json": "^0.0.319",
     react: "19.1.0",
     "react-cosmos": "7.0.0",
     "react-cosmos-plugin-vite": "7.0.0",
     "react-dom": "19.1.0",
-    tscircuit: "^0.0.827",
+    tscircuit: "^0.0.937",
     tsup: "^8.0.2",
     typescript: "^5.4.5",
     "vite-tsconfig-paths": "^5.0.1"
@@ -3431,11 +5143,13 @@ var TYPE_PRIORITY = {
   pcb_hole: 18,
   pcb_plated_hole_drill: 19,
   pcb_plated_hole: 20,
+  pcb_trace_soldermask: 25,
   pcb_trace: 30,
   pcb_smtpad: 30,
   pcb_copper_pour: 35,
   pcb_via: 36,
   pcb_soldermask: 40,
+  pcb_soldermask_opening: 25,
   pcb_solder_paste: 45,
   pcb_silkscreen_text: 50,
   pcb_silkscreen_path: 50,
@@ -3480,15 +5194,17 @@ function getLayerPriority(layer) {
   if (!layer) return 500;
   const normalized = layer.toLowerCase();
   if (normalized === "global") return -100;
-  if (normalized === "bottom") return 0;
+  if (normalized === "bottom") return 4;
   if (normalized === "board") return 2;
+  if (normalized === "soldermask-top" || normalized === "soldermask-bottom")
+    return 3;
   if (normalized.startsWith("inner")) {
     const match = normalized.match(/\d+/);
-    const layerIndex = match ? parseInt(match[0], 10) : 0;
+    const layerIndex = match ? Number.parseInt(match[0], 10) : 0;
     return 5 + layerIndex;
   }
   if (normalized === "through") return 18;
-  if (normalized === "top") return 20;
+  if (normalized === "top") return 17;
   if (normalized === "drill") return 30;
   if (normalized === "overlay") return 40;
   return 10;
@@ -3497,6 +5213,51 @@ function getTypePriority(type) {
   if (!type) return DEFAULT_TYPE_PRIORITY;
   return TYPE_PRIORITY[type] ?? DEFAULT_TYPE_PRIORITY;
 }
+function createErrorTextOverlay(circuitJson, dataType = "error_text_overlay") {
+  const errorElms = circuitJson.filter(
+    (elm) => elm.type.endsWith("_error")
+  );
+  if (errorElms.length === 0) {
+    return null;
+  }
+  const errorMessages = errorElms.map((e) => e.message).filter((m) => !!m);
+  if (errorMessages.length === 0) {
+    return null;
+  }
+  const textBlock = {
+    name: "text",
+    type: "element",
+    value: "",
+    attributes: {
+      x: "10",
+      y: "20",
+      fill: "red",
+      "font-family": "monospace",
+      "font-size": "12px",
+      "data-type": dataType,
+      "data-layer": "global"
+    },
+    children: errorMessages.map((msg, i) => ({
+      name: "tspan",
+      type: "element",
+      value: "",
+      attributes: {
+        x: "10",
+        dy: i === 0 ? "0" : "1.2em"
+      },
+      children: [
+        {
+          type: "text",
+          value: msg,
+          name: "",
+          attributes: {},
+          children: []
+        }
+      ]
+    }))
+  };
+  return textBlock;
+}
 function convertCircuitJsonToPcbSvg(circuitJson, options) {
   const drawPaddingOutsideBoard = options?.drawPaddingOutsideBoard ?? true;
   const layer = options?.layer;
@@ -3523,6 +5284,15 @@ function convertCircuitJsonToPcbSvg(circuitJson, options) {
       top: colorOverrides?.soldermask?.top ?? DEFAULT_PCB_COLOR_MAP.soldermask.top,
       bottom: colorOverrides?.soldermask?.bottom ?? DEFAULT_PCB_COLOR_MAP.soldermask.bottom
     },
+    soldermaskOverCopper: {
+      top: colorOverrides?.soldermaskOverCopper?.top ?? DEFAULT_PCB_COLOR_MAP.soldermaskOverCopper.top,
+      bottom: colorOverrides?.soldermaskOverCopper?.bottom ?? DEFAULT_PCB_COLOR_MAP.soldermaskOverCopper.bottom
+    },
+    soldermaskWithCopperUnderneath: {
+      top: colorOverrides?.soldermaskWithCopperUnderneath?.top ?? DEFAULT_PCB_COLOR_MAP.soldermaskWithCopperUnderneath.top,
+      bottom: colorOverrides?.soldermaskWithCopperUnderneath?.bottom ?? DEFAULT_PCB_COLOR_MAP.soldermaskWithCopperUnderneath.bottom
+    },
+    substrate: colorOverrides?.substrate ?? DEFAULT_PCB_COLOR_MAP.substrate,
     courtyard: colorOverrides?.courtyard ?? DEFAULT_PCB_COLOR_MAP.courtyard,
     debugComponent: {
       fill: colorOverrides?.debugComponent?.fill ?? DEFAULT_PCB_COLOR_MAP.debugComponent.fill,
@@ -3547,7 +5317,7 @@ function convertCircuitJsonToPcbSvg(circuitJson, options) {
       if (width === void 0 || height === void 0) {
         continue;
       }
-      const center = { x: width / 2, y: height / 2 };
+      const center = panel.center ?? { x: width / 2, y: height / 2 };
       updateBounds(center, width, height);
     } else if (circuitJsonElm.type === "pcb_board") {
       if (circuitJsonElm.outline && Array.isArray(circuitJsonElm.outline) && circuitJsonElm.outline.length >= 3) {
@@ -3663,12 +5433,13 @@ function convertCircuitJsonToPcbSvg(circuitJson, options) {
     showPcbGroups: options?.showPcbGroups,
     drawPaddingOutsideBoard,
     colorMap: colorMap2,
-    showSolderMask: options?.showSolderMask
+    showSolderMask: options?.showSolderMask,
+    showAnchorOffsets: options?.showAnchorOffsets,
+    circuitJson
   };
-  const unsortedSvgObjects = circuitJson.flatMap(
+  let unsortedSvgObjects = circuitJson.flatMap(
     (elm) => createSvgObjects({ elm, circuitJson, ctx })
   );
-  let svgObjects = sortSvgObjectsByPcbLayer(unsortedSvgObjects);
   let strokeWidth = String(0.05 * scaleFactor);
   for (const element of circuitJson) {
     if ("stroke_width" in element) {
@@ -3678,8 +5449,9 @@ function convertCircuitJsonToPcbSvg(circuitJson, options) {
   }
   if (options?.shouldDrawRatsNest) {
     const ratsNestObjects = createSvgObjectsForRatsNest(circuitJson, ctx);
-    svgObjects = sortSvgObjectsByPcbLayer([...svgObjects, ...ratsNestObjects]);
+    unsortedSvgObjects = [...unsortedSvgObjects, ...ratsNestObjects];
   }
+  const svgObjects = sortSvgObjectsByPcbLayer(unsortedSvgObjects);
   const children = [
     {
       name: "style",
@@ -3730,6 +5502,15 @@ function convertCircuitJsonToPcbSvg(circuitJson, options) {
   if (gridObjects.rect) {
     children.push(gridObjects.rect);
   }
+  if (options?.showErrorsInTextOverlay) {
+    const errorOverlay = createErrorTextOverlay(
+      circuitJson,
+      "pcb_error_text_overlay"
+    );
+    if (errorOverlay) {
+      children.push(errorOverlay);
+    }
+  }
   const softwareUsedString = getSoftwareUsedString(circuitJson);
   const version = CIRCUIT_TO_SVG_VERSION;
   const svgObject = {
@@ -4704,29 +6485,14 @@ function convertCircuitJsonToAssemblySvg(soup, options) {
   ).flatMap((item) => createSvgObjects2(item, ctx, soup));
   const softwareUsedString = getSoftwareUsedString(soup);
   const version = CIRCUIT_TO_SVG_VERSION;
-  const svgObject = {
-    name: "svg",
-    type: "element",
-    attributes: {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: svgWidth.toString(),
-      height: svgHeight.toString(),
-      ...softwareUsedString && {
-        "data-software-used-string": softwareUsedString
-      },
-      ...options?.includeVersion && {
-        "data-circuit-to-svg-version": version
-      }
-    },
-    value: "",
-    children: [
-      {
-        name: "style",
-        type: "element",
-        children: [
-          {
-            type: "text",
-            value: `
+  const children = [
+    {
+      name: "style",
+      type: "element",
+      children: [
+        {
+          type: "text",
+          value: `
               .assembly-component { 
                 fill: none; 
                 stroke: #000; 
@@ -4749,30 +6515,52 @@ function convertCircuitJsonToAssemblySvg(soup, options) {
                 stroke-width: 0.2; 
               }
             `,
-            name: "",
-            attributes: {},
-            children: []
-          }
-        ],
-        value: "",
-        attributes: {}
+          name: "",
+          attributes: {},
+          children: []
+        }
+      ],
+      value: "",
+      attributes: {}
+    },
+    {
+      name: "rect",
+      type: "element",
+      attributes: {
+        fill: "#fff",
+        x: "0",
+        y: "0",
+        width: svgWidth.toString(),
+        height: svgHeight.toString()
       },
-      {
-        name: "rect",
-        type: "element",
-        attributes: {
-          fill: "#fff",
-          x: "0",
-          y: "0",
-          width: svgWidth.toString(),
-          height: svgHeight.toString()
-        },
-        value: "",
-        children: []
+      value: "",
+      children: []
+    },
+    createSvgObjectFromAssemblyBoundary(transform, minX, minY, maxX, maxY),
+    ...svgObjects
+  ].filter((child) => child !== null);
+  if (options?.showErrorsInTextOverlay) {
+    const errorOverlay = createErrorTextOverlay(soup);
+    if (errorOverlay) {
+      children.push(errorOverlay);
+    }
+  }
+  const svgObject = {
+    name: "svg",
+    type: "element",
+    attributes: {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: svgWidth.toString(),
+      height: svgHeight.toString(),
+      ...softwareUsedString && {
+        "data-software-used-string": softwareUsedString
       },
-      createSvgObjectFromAssemblyBoundary(transform, minX, minY, maxX, maxY),
-      ...svgObjects
-    ].filter((child) => child !== null)
+      ...options?.includeVersion && {
+        "data-circuit-to-svg-version": version
+      }
+    },
+    value: "",
+    children
   };
   return (0, import_svgson4.stringify)(svgObject);
 }
@@ -6024,6 +7812,28 @@ function convertCircuitJsonToPinoutSvg(soup, options) {
   ).flatMap((item) => createSvgObjects3(item, ctx, soup));
   const softwareUsedString = getSoftwareUsedString(soup);
   const version = CIRCUIT_TO_SVG_VERSION;
+  const children = [
+    {
+      name: "rect",
+      type: "element",
+      attributes: {
+        fill: "rgb(255, 255, 255)",
+        x: "0",
+        y: "0",
+        width: svgWidth.toString(),
+        height: svgHeight.toString()
+      },
+      value: "",
+      children: []
+    },
+    ...svgObjects
+  ].filter((child) => child !== null);
+  if (options?.showErrorsInTextOverlay) {
+    const errorOverlay = createErrorTextOverlay(soup);
+    if (errorOverlay) {
+      children.push(errorOverlay);
+    }
+  }
   const svgObject = {
     name: "svg",
     type: "element",
@@ -6039,22 +7849,7 @@ function convertCircuitJsonToPinoutSvg(soup, options) {
       }
     },
     value: "",
-    children: [
-      {
-        name: "rect",
-        type: "element",
-        attributes: {
-          fill: "rgb(255, 255, 255)",
-          x: "0",
-          y: "0",
-          width: svgWidth.toString(),
-          height: svgHeight.toString()
-        },
-        value: "",
-        children: []
-      },
-      ...svgObjects
-    ].filter((child) => child !== null)
+    children
   };
   return (0, import_svgson5.stringify)(svgObject);
 }
@@ -8079,6 +9874,7 @@ function createSvgObjectsFromSchVoltageProbe({
     probe.position.x,
     probe.position.y
   ]);
+  const probeColor = probe.color ?? colorMap2.schematic.reference;
   const arrowLength = Math.abs(transform.a) * 0.6;
   const arrowWidth = Math.abs(transform.a) * 0.28;
   const baseX = screenX + arrowLength * Math.cos(-50 * Math.PI / 180);
@@ -8093,14 +9889,68 @@ function createSvgObjectsFromSchVoltageProbe({
     `L ${tipX - arrowWidth * Math.cos((-50 + 210) * Math.PI / 180)},${tipY - arrowWidth * Math.sin((-50 + 210) * Math.PI / 180)}`,
     "Z"
   ].join(" ");
+  const x = (baseX + 8 - (baseX - baseX)).toString();
+  const textChildren = [];
+  if (probe.name && probe.voltage !== void 0) {
+    textChildren.push({
+      type: "element",
+      name: "tspan",
+      value: "",
+      attributes: {
+        x
+      },
+      children: [
+        {
+          type: "text",
+          value: probe.name,
+          name: "",
+          attributes: {},
+          children: []
+        }
+      ]
+    });
+    textChildren.push({
+      type: "element",
+      name: "tspan",
+      value: "",
+      attributes: {
+        x,
+        dy: "1.2em"
+      },
+      children: [
+        {
+          type: "text",
+          value: `${probe.voltage}V`,
+          name: "",
+          attributes: {},
+          children: []
+        }
+      ]
+    });
+  } else {
+    const textParts = [];
+    if (probe.name) {
+      textParts.push(probe.name);
+    }
+    if (probe.voltage !== void 0) {
+      textParts.push(`${probe.voltage}V`);
+    }
+    textChildren.push({
+      type: "text",
+      value: textParts.join(" "),
+      name: "",
+      attributes: {},
+      children: []
+    });
+  }
   return [
     {
       name: "path",
       type: "element",
       attributes: {
         d: arrowPath,
-        stroke: colorMap2.schematic.reference,
-        fill: colorMap2.schematic.reference,
+        stroke: probeColor,
+        fill: probeColor,
         "stroke-width": `${getSchStrokeSize(transform)}px`
       },
       value: "",
@@ -8111,25 +9961,17 @@ function createSvgObjectsFromSchVoltageProbe({
       name: "text",
       value: "",
       attributes: {
-        x: (baseX + 8 - (baseX - baseX)).toString(),
-        y: (baseY - 10 + (baseY - baseY)).toString(),
-        fill: colorMap2.schematic.reference,
-        "text-anchor": "middle",
+        x,
+        y: baseY.toString(),
+        fill: probeColor,
+        "text-anchor": "start",
         "dominant-baseline": "middle",
         "font-family": "sans-serif",
         "font-size": `${getSchScreenFontSize(transform, "reference_designator")}px`,
         "font-weight": "bold",
         "data-schematic-voltage-probe-id": probe.schematic_voltage_probe_id
       },
-      children: [
-        {
-          type: "text",
-          value: probe.voltage ? `${probe.voltage}V` : "",
-          name: "",
-          attributes: {},
-          children: []
-        }
-      ]
+      children: textChildren
     }
   ];
 }
@@ -9442,6 +11284,12 @@ function convertCircuitJsonToSchematicSvg(circuitJson, options) {
   }
   const softwareUsedString = getSoftwareUsedString(circuitJson);
   const version = CIRCUIT_TO_SVG_VERSION;
+  if (options?.showErrorsInTextOverlay) {
+    const errorOverlay = createErrorTextOverlay(circuitJson);
+    if (errorOverlay) {
+      svgChildren.push(errorOverlay);
+    }
+  }
   const svgObject = {
     name: "svg",
     type: "element",
@@ -9549,7 +11397,10 @@ function convertCircuitJsonToSimulationGraphSvg({
     );
   }
   const timeAxis = buildAxisInfo(allPoints.map((point) => point.timeMs));
-  const voltageAxis = buildAxisInfo(allPoints.map((point) => point.voltage));
+  const voltageAxis = buildAxisInfo(
+    allPoints.map((point) => point.voltage),
+    true
+  );
   const plotWidth = Math.max(1, width - MARGIN.left - MARGIN.right);
   const plotHeight = Math.max(1, height - MARGIN.top - MARGIN.bottom);
   const scaleX = createLinearScale(
@@ -9620,19 +11471,23 @@ function convertCircuitJsonToSimulationGraphSvg({
 function prepareSimulationGraphs(graphs, circuitJson) {
   const palette = Array.isArray(colorMap.palette) ? colorMap.palette : [];
   const voltageProbes = circuitJson.filter(isSimulationVoltageProbe);
-  const probeIdToName = /* @__PURE__ */ new Map();
+  const sourceComponentIdToProbeName = /* @__PURE__ */ new Map();
+  const sourceComponentIdToProbeColor = /* @__PURE__ */ new Map();
   for (const probe of voltageProbes) {
-    if (probe.name && probe.simulation_voltage_probe_id) {
-      probeIdToName.set(probe.simulation_voltage_probe_id, probe.name);
+    if (probe.name && probe.source_component_id) {
+      sourceComponentIdToProbeName.set(probe.source_component_id, probe.name);
+    }
+    if (probe.color && probe.source_component_id) {
+      sourceComponentIdToProbeColor.set(probe.source_component_id, probe.color);
     }
   }
   return graphs.map((graph, index) => {
     const points = createGraphPoints(graph);
     const paletteColor = palette.length > 0 ? palette[index % palette.length] : FALLBACK_LINE_COLOR;
-    const color = paletteColor ?? FALLBACK_LINE_COLOR;
-    const probeId = graph.simulation_voltage_probe_id ?? graph.schematic_voltage_probe_id;
-    const probeName = probeId ? probeIdToName.get(probeId) : void 0;
-    const label = probeName ? `V(${probeName})` : graph.name || (probeId ? `Probe ${probeId}` : graph.simulation_transient_voltage_graph_id);
+    const probeColor = graph.source_component_id ? sourceComponentIdToProbeColor.get(graph.source_component_id) : void 0;
+    const color = graph.color ?? probeColor ?? paletteColor ?? FALLBACK_LINE_COLOR;
+    const probeName = graph.source_component_id ? sourceComponentIdToProbeName.get(graph.source_component_id) : void 0;
+    const label = probeName ? `V(${probeName})` : graph.name || (graph.source_component_id ? `Probe ${graph.source_component_id}` : graph.simulation_transient_voltage_graph_id);
     return { graph, points, color, label };
   }).filter((entry) => entry.points.length > 0);
 }
@@ -9664,7 +11519,7 @@ function getTimestamps(graph) {
   }
   return timestamps;
 }
-function buildAxisInfo(values) {
+function buildAxisInfo(values, applyPadding = false) {
   if (values.length === 0) {
     return {
       domainMin: 0,
@@ -9683,9 +11538,21 @@ function buildAxisInfo(values) {
     };
   }
   const ticks = generateTickValues(min, max);
-  const safeTicks = ticks.length > 0 ? ticks : [min, max];
-  const domainMin = safeTicks[0];
-  const domainMax = safeTicks[safeTicks.length - 1];
+  const safeTicks = ticks.length > 0 ? [...ticks] : [min, max];
+  let domainMin = safeTicks[0];
+  let domainMax = safeTicks[safeTicks.length - 1];
+  if (applyPadding && safeTicks.length > 1) {
+    const tickStep = Math.abs(safeTicks[1] - safeTicks[0]);
+    const PADDING_TOLERANCE_RATIO = 0.1;
+    if (min < domainMin + tickStep * PADDING_TOLERANCE_RATIO) {
+      domainMin -= tickStep;
+      safeTicks.unshift(domainMin);
+    }
+    if (max > domainMax - tickStep * PADDING_TOLERANCE_RATIO) {
+      domainMax += tickStep;
+      safeTicks.push(domainMax);
+    }
+  }
   return { domainMin, domainMax, ticks: safeTicks };
 }
 function generateTickValues(min, max, desired = 6) {
@@ -10016,8 +11883,8 @@ function createDataGroup(graphs, clipPathId, scaleX, scaleY) {
       "clip-path": `url(#${clipPathId})`,
       "data-simulation-transient-voltage-graph-id": entry.graph.simulation_transient_voltage_graph_id
     };
-    if (entry.graph.schematic_voltage_probe_id) {
-      baseAttributes["data-schematic-voltage-probe-id"] = entry.graph.schematic_voltage_probe_id;
+    if (entry.graph.source_component_id) {
+      baseAttributes["data-source-component-id"] = entry.graph.source_component_id;
     }
     if (entry.graph.subcircuit_connectivity_map_key) {
       baseAttributes["data-subcircuit-connectivity-map-key"] = entry.graph.subcircuit_connectivity_map_key;
@@ -10125,7 +11992,8 @@ function convertCircuitJsonToSchematicSimulationSvg({
   height = DEFAULT_HEIGHT2,
   schematicHeightRatio = DEFAULT_SCHEMATIC_RATIO,
   schematicOptions,
-  includeVersion
+  includeVersion,
+  showErrorsInTextOverlay
 }) {
   const schematicElements = circuitJson.filter(
     (element) => !isSimulationExperiment(element) && !isSimulationTransientVoltageGraph(element)
@@ -10141,7 +12009,8 @@ function convertCircuitJsonToSchematicSimulationSvg({
     ...schematicOptions,
     width,
     height: schematicHeight,
-    includeVersion: false
+    includeVersion: false,
+    showErrorsInTextOverlay
   });
   const simulationSvg = convertCircuitJsonToSimulationGraphSvg({
     circuitJson,
@@ -10333,7 +12202,8 @@ function convertCircuitJsonToSolderPasteMask(circuitJson, options) {
       const width = distance.parse(panel.width);
       const height = distance.parse(panel.height);
       if (width !== void 0 && height !== void 0) {
-        updateBounds({ x: width / 2, y: height / 2 }, width, height);
+        const center = panel.center ?? { x: width / 2, y: height / 2 };
+        updateBounds(center, width, height);
       }
     } else if (item.type === "pcb_solder_paste" && "x" in item && "y" in item) {
       updateBounds({ x: item.x, y: item.y }, 0, 0);
@@ -10367,6 +12237,38 @@ function convertCircuitJsonToSolderPasteMask(circuitJson, options) {
   ).flatMap((item) => createSvgObjects4({ elm: item, ctx }));
   const softwareUsedString = getSoftwareUsedString(circuitJson);
   const version = CIRCUIT_TO_SVG_VERSION;
+  const children = [
+    {
+      name: "style",
+      type: "element",
+      children: [
+        {
+          type: "text",
+          value: ""
+        }
+      ]
+    },
+    {
+      name: "rect",
+      type: "element",
+      attributes: {
+        class: "boundary",
+        x: "0",
+        y: "0",
+        fill: "#000",
+        width: svgWidth.toString(),
+        height: svgHeight.toString()
+      }
+    },
+    createSvgObjectFromPcbBoundary2(transform, minX, minY, maxX, maxY),
+    ...svgObjects
+  ].filter((child) => child !== null);
+  if (options?.showErrorsInTextOverlay) {
+    const errorOverlay = createErrorTextOverlay(circuitJson);
+    if (errorOverlay) {
+      children.push(errorOverlay);
+    }
+  }
   const svgObject = {
     name: "svg",
     type: "element",
@@ -10382,32 +12284,7 @@ function convertCircuitJsonToSolderPasteMask(circuitJson, options) {
       }
     },
     value: "",
-    children: [
-      {
-        name: "style",
-        type: "element",
-        children: [
-          {
-            type: "text",
-            value: ""
-          }
-        ]
-      },
-      {
-        name: "rect",
-        type: "element",
-        attributes: {
-          class: "boundary",
-          x: "0",
-          y: "0",
-          fill: "#000",
-          width: svgWidth.toString(),
-          height: svgHeight.toString()
-        }
-      },
-      createSvgObjectFromPcbBoundary2(transform, minX, minY, maxX, maxY),
-      ...svgObjects
-    ].filter((child) => child !== null)
+    children
   };
   try {
     return (0, import_svgson11.stringify)(svgObject);
@@ -10478,10 +12355,11 @@ export {
   convertCircuitJsonToSchematicSvg,
   convertCircuitJsonToSimulationGraphSvg,
   convertCircuitJsonToSolderPasteMask,
+  createErrorTextOverlay,
   createSvgObjectsForSchComponentPortHovers,
   getSoftwareUsedString,
   isSimulationExperiment,
   isSimulationTransientVoltageGraph,
   isSimulationVoltageProbe
 };
-//# sourceMappingURL=dist-K77PLYJN.js.map
+//# sourceMappingURL=dist-7RT7ZSAD.js.map