Add solder mask margin support for smtpads

bun.lock

@@ -8,7 +8,7 @@
         "@tscircuit/alphabet": "^0.0.8",
         "@tscircuit/math-utils": "^0.0.29",
         "@vitejs/plugin-react": "^5.0.2",
-        "circuit-json": "^0.0.321",
+        "circuit-json": "^0.0.325",
         "circuit-to-svg": "^0.0.271",
         "color": "^4.2.3",
         "react-supergrid": "^1.0.10",
@@ -596,7 +596,7 @@
 
     "chownr": ["[email protected]", "", {}, "sha512-jJ0bqzaylmJtVnNgzTeSOs8DPavpbYgEr/b0YL8/2GO3xJEhInFmhKMUnEJQjZumK7KXGFhUy89PrsJWlakBVg=="],
 
-    "circuit-json": ["[email protected].321", "", {}, "sha512-3E6RPr/LJq7i1WV+Xsw5D9TzTs0c7DaO7k9tXRE7Y9J68AAXTZjR8bQB0o/RLm7kbuUEuVNowI4a+F5CGBjpPQ=="],
+    "circuit-json": ["[email protected].325", "", {}, "sha512-6RBqf+G2HlyIb4Fi+w94QqTNT2L9LJA828V5T4039QEllFBhy2vORJ9GiyYB6VcfxTf/JSsLl3dfOnL3SLeYqg=="],
 
     "circuit-json-to-bpc": ["[email protected]", "", { "peerDependencies": { "bpc-graph": "*", "circuit-json": "*", "typescript": "^5" } }, "sha512-3wSMtPa6tJkiBQN4tsm7f0Mb7Wp90X2c8dNbULoDVE4mGGoFqP1DXqBlyvvZZl+4SjqznzQQ0EioLe2SCQTOcg=="],
 

package.json

@@ -53,7 +53,7 @@
     "@tscircuit/alphabet": "^0.0.8",
     "@tscircuit/math-utils": "^0.0.29",
     "@vitejs/plugin-react": "^5.0.2",
-    "circuit-json": "^0.0.321",
+    "circuit-json": "^0.0.325",
     "circuit-to-svg": "^0.0.271",
     "color": "^4.2.3",
     "react-supergrid": "^1.0.10",

src/examples/soldermask-margin-smtpad.fixture.tsx

@@ -0,0 +1,155 @@
+import { PCBViewer } from "../PCBViewer"
+
+const SoldermaskMarginSmtpadFixture = () => {
+  const circuit: any = [
+    {
+      type: "pcb_board",
+      pcb_board_id: "board0",
+      center: { x: 0, y: 0 },
+      width: 14,
+      height: 10,
+    },
+    // Rectangle with positive margin (mask extends beyond pad)
+    {
+      type: "pcb_smtpad",
+      pcb_smtpad_id: "pad_rect_positive",
+      shape: "rect",
+      layer: "top",
+      x: -4,
+      y: 2,
+      width: 1.6,
+      height: 1.1,
+      is_covered_with_solder_mask: true,
+      soldermask_margin: 0.2,
+    },
+    // Rectangle with negative margin (spacing around copper, copper visible)
+    {
+      type: "pcb_smtpad",
+      pcb_smtpad_id: "pad_rect_negative",
+      shape: "rect",
+      layer: "top",
+      x: -4,
+      y: -2,
+      width: 1.6,
+      height: 1.1,
+      is_covered_with_solder_mask: true,
+      soldermask_margin: -0.15,
+    },
+    // Circle with positive margin
+    {
+      type: "pcb_smtpad",
+      pcb_smtpad_id: "pad_circle_positive",
+      shape: "circle",
+      layer: "top",
+      x: 0,
+      y: 2,
+      radius: 0.75,
+      is_covered_with_solder_mask: true,
+      soldermask_margin: 0.15,
+    },
+    // Circle with negative margin
+    {
+      type: "pcb_smtpad",
+      pcb_smtpad_id: "pad_circle_negative",
+      shape: "circle",
+      layer: "top",
+      x: 0,
+      y: -2,
+      radius: 0.75,
+      is_covered_with_solder_mask: true,
+      soldermask_margin: -0.2,
+    },
+    // Pill with positive margin
+    {
+      type: "pcb_smtpad",
+      pcb_smtpad_id: "pad_pill_positive",
+      shape: "pill",
+      layer: "top",
+      x: 4,
+      y: 2,
+      width: 2.4,
+      height: 1,
+      radius: 0.5,
+      is_covered_with_solder_mask: true,
+      soldermask_margin: 0.1,
+    },
+    // Pill with negative margin
+    {
+      type: "pcb_smtpad",
+      pcb_smtpad_id: "pad_pill_negative",
+      shape: "pill",
+      layer: "top",
+      x: 4,
+      y: -2,
+      width: 2.4,
+      height: 1,
+      radius: 0.5,
+      is_covered_with_solder_mask: true,
+      soldermask_margin: -0.12,
+    },
+    // Silkscreen labels for positive margin pads (top row)
+    {
+      type: "pcb_silkscreen_text",
+      pcb_silkscreen_text_id: "text_rect_pos",
+      layer: "top",
+      anchor_position: { x: -4, y: 3.2 },
+      anchor_alignment: "center",
+      text: "+0.2mm",
+      font_size: 0.4,
+    },
+    {
+      type: "pcb_silkscreen_text",
+      pcb_silkscreen_text_id: "text_circle_pos",
+      layer: "top",
+      anchor_position: { x: 0, y: 3.2 },
+      anchor_alignment: "center",
+      text: "+0.15mm",
+      font_size: 0.4,
+    },
+    {
+      type: "pcb_silkscreen_text",
+      pcb_silkscreen_text_id: "text_pill_pos",
+      layer: "top",
+      anchor_position: { x: 4, y: 3.2 },
+      anchor_alignment: "center",
+      text: "+0.1mm",
+      font_size: 0.4,
+    },
+    // Silkscreen labels for negative margin pads (bottom row)
+    {
+      type: "pcb_silkscreen_text",
+      pcb_silkscreen_text_id: "text_rect_neg",
+      layer: "top",
+      anchor_position: { x: -4, y: -3.2 },
+      anchor_alignment: "center",
+      text: "-0.15mm",
+      font_size: 0.4,
+    },
+    {
+      type: "pcb_silkscreen_text",
+      pcb_silkscreen_text_id: "text_circle_neg",
+      layer: "top",
+      anchor_position: { x: 0, y: -3.2 },
+      anchor_alignment: "center",
+      text: "-0.2mm",
+      font_size: 0.4,
+    },
+    {
+      type: "pcb_silkscreen_text",
+      pcb_silkscreen_text_id: "text_pill_neg",
+      layer: "top",
+      anchor_position: { x: 4, y: -3.2 },
+      anchor_alignment: "center",
+      text: "-0.12mm",
+      font_size: 0.4,
+    },
+  ]
+
+  return (
+    <div style={{ backgroundColor: "black", width: "100%", height: "600px" }}>
+      <PCBViewer circuitJson={circuit} />
+    </div>
+  )
+}
+
+export default SoldermaskMarginSmtpadFixture

src/lib/Drawer.ts

@@ -112,6 +112,7 @@ export class Drawer {
   transform: Matrix
   foregroundLayer: string = "top"
   lastPoint: { x: number; y: number }
+  _tempCompositeMode?: "source-over" | "destination-out"
 
   constructor(canvasLayerMap: Record<string, HTMLCanvasElement>) {
     this.canvasLayerMap = canvasLayerMap
@@ -574,6 +575,12 @@ export class Drawer {
       ctx.fillStyle = "rgba(0,0,0,1)"
       ctx.strokeStyle = "rgba(0,0,0,1)"
     }
+
+    // Override compositing mode if temporarily set
+    if (this._tempCompositeMode) {
+      ctx.globalCompositeOperation = this._tempCompositeMode
+    }
+
     ctx.font = `${scaleOnly(inverse(transform), fontSize)}px sans-serif`
   }