circuit-to-canvas 0.0.49 → 0.0.51

package/lib/drawer/elements/pcb-soldermask/via.ts

@@ -0,0 +1,27 @@
+import type { PcbVia } from "circuit-json"
+import type { Matrix } from "transformation-matrix"
+import { applyToPoint } from "transformation-matrix"
+import type { CanvasContext, PcbColorMap } from "../../types"
+
+/**
+ * Process soldermask for a via.
+ * Vias typically have soldermask openings to expose the copper ring.
+ */
+export function processViaSoldermask(params: {
+  ctx: CanvasContext
+  via: PcbVia
+  realToCanvasMat: Matrix
+  colorMap: PcbColorMap
+}): void {
+  const { ctx, via, realToCanvasMat, colorMap } = params
+  // Vias typically have soldermask openings to expose the copper ring
+  // Draw substrate color to simulate the cutout
+  const [cx, cy] = applyToPoint(realToCanvasMat, [via.x, via.y])
+  const scaledRadius = (via.outer_diameter / 2) * Math.abs(realToCanvasMat.a)
+
+  ctx.fillStyle = colorMap.substrate
+  ctx.beginPath()
+  ctx.arc(cx, cy, scaledRadius, 0, Math.PI * 2)
+  ctx.closePath()
+  ctx.fill()
+}

package/lib/drawer/elements/soldermask-margin.ts

@@ -17,13 +17,29 @@ export function drawSoldermaskRingForRect(
   realToCanvasMat: Matrix,
   soldermaskColor: string,
   padColor: string,
+  asymmetricMargins?: {
+    left: number
+    right: number
+    top: number
+    bottom: number
+  },
 ): void {
   const [cx, cy] = applyToPoint(realToCanvasMat, [center.x, center.y])
   const scaledWidth = width * Math.abs(realToCanvasMat.a)
   const scaledHeight = height * Math.abs(realToCanvasMat.a)
-  const scaledMargin = Math.abs(margin) * Math.abs(realToCanvasMat.a)
   const scaledRadius = borderRadius * Math.abs(realToCanvasMat.a)
 
+  const ml = asymmetricMargins?.left ?? margin
+  const mr = asymmetricMargins?.right ?? margin
+  const mt = asymmetricMargins?.top ?? margin
+  const mb = asymmetricMargins?.bottom ?? margin
+
+  // Thickness of the soldermask ring (only if negative margin)
+  const scaledThicknessL = Math.max(0, -ml) * Math.abs(realToCanvasMat.a)
+  const scaledThicknessR = Math.max(0, -mr) * Math.abs(realToCanvasMat.a)
+  const scaledThicknessT = Math.max(0, -mt) * Math.abs(realToCanvasMat.a)
+  const scaledThicknessB = Math.max(0, -mb) * Math.abs(realToCanvasMat.a)
+
   ctx.save()
   ctx.translate(cx, cy)
 
@@ -76,16 +92,31 @@ export function drawSoldermaskRingForRect(
     ctx.globalCompositeOperation = prevCompositeOp || "source-over"
   }
 
-  // Restore pad color in inner rectangle (reduced by margin)
-  const innerWidth = scaledWidth - scaledMargin * 2
-  const innerHeight = scaledHeight - scaledMargin * 2
-  const innerRadius = Math.max(0, scaledRadius - scaledMargin)
+  // Restore pad color in inner rectangle (reduced by margins)
+  const innerWidth = Math.max(
+    0,
+    scaledWidth - (scaledThicknessL + scaledThicknessR),
+  )
+  const innerHeight = Math.max(
+    0,
+    scaledHeight - (scaledThicknessT + scaledThicknessB),
+  )
+  const innerRadius = Math.max(
+    0,
+    scaledRadius -
+      (scaledThicknessL +
+        scaledThicknessR +
+        scaledThicknessT +
+        scaledThicknessB) /
+        4,
+  )
 
   if (innerWidth > 0 && innerHeight > 0) {
     ctx.beginPath()
+    const x = -scaledWidth / 2 + scaledThicknessL
+    const y = -scaledHeight / 2 + scaledThicknessT
+
     if (innerRadius > 0) {
-      const x = -innerWidth / 2
-      const y = -innerHeight / 2
       const r = Math.min(innerRadius, innerWidth / 2, innerHeight / 2)
 
       ctx.moveTo(x + r, y)
@@ -104,7 +135,7 @@ export function drawSoldermaskRingForRect(
       ctx.lineTo(x, y + r)
       ctx.arcTo(x, y, x + r, y, r)
     } else {
-      ctx.rect(-innerWidth / 2, -innerHeight / 2, innerWidth, innerHeight)
+      ctx.rect(x, y, innerWidth, innerHeight)
     }
 
     ctx.fillStyle = padColor

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "circuit-to-canvas",
   "main": "dist/index.js",
-  "version": "0.0.49",
+  "version": "0.0.51",
   "type": "module",
   "scripts": {
     "build": "tsup-node ./lib/index.ts --format esm --dts",
@@ -17,7 +17,7 @@
     "@tscircuit/math-utils": "^0.0.29",
     "@types/bun": "latest",
     "bun-match-svg": "^0.0.14",
-    "circuit-json": "^0.0.348",
+    "circuit-json": "^0.0.356",
     "circuit-json-to-connectivity-map": "^0.0.23",
     "circuit-to-svg": "^0.0.303",
     "looks-same": "^10.0.1",

package/tests/board-snapshot/usb-c-flashlight-board.test.ts

@@ -9,6 +9,7 @@ test("USB-C flashlight - comprehensive comparison (circuit-to-canvas vs circuit-
   const stackedPng = await getStackedPngSvgComparison(circuitElements, {
     width: 400,
     height: 800,
+    showSoldermask: true,
   })
 
   await expect(stackedPng).toMatchPngSnapshot(import.meta.path)

package/tests/elements/pcb-comprehensive-soldermask-margin.test.ts

@@ -1,7 +1,7 @@
 import { expect, test } from "bun:test"
 import { createCanvas } from "@napi-rs/canvas"
-import { CircuitToCanvasDrawer } from "../../lib/drawer"
 import type { AnyCircuitElement } from "circuit-json"
+import { CircuitToCanvasDrawer } from "../../lib/drawer"
 
 /**
  * Comprehensive test for soldermask margin functionality:
@@ -1273,7 +1273,7 @@ test("comprehensive soldermask margin test", async () => {
   ]
 
   drawer.setCameraBounds({ minX: -95, maxX: 90, minY: -22, maxY: 22 })
-  drawer.drawElements(circuit)
+  drawer.drawElements(circuit, { showSoldermask: true })
 
   await expect(canvas.toBuffer("image/png")).toMatchPngSnapshot(
     import.meta.path,

package/tests/elements/pcb-hole-soldermask-margin.test.ts

@@ -2,7 +2,7 @@ import { expect, test } from "bun:test"
 import { createCanvas } from "@napi-rs/canvas"
 import { CircuitToCanvasDrawer } from "../../lib/drawer"
 
-test("draw holes with positive soldermask margins", async () => {
+test("draw holes with positive and negative soldermask margins", async () => {
   const canvas = createCanvas(800, 600)
   const ctx = canvas.getContext("2d")
   const drawer = new CircuitToCanvasDrawer(ctx)
@@ -29,6 +29,122 @@ test("draw holes with positive soldermask margins", async () => {
 
       soldermask_margin: 0.2,
     },
+    // Circle with negative margin
+    {
+      type: "pcb_hole",
+      pcb_hole_id: "hole_circle_negative",
+      hole_shape: "circle",
+      x: -4,
+      y: -2,
+      hole_diameter: 1.0,
+
+      soldermask_margin: -0.15,
+    },
+    // Square with positive margin
+    {
+      type: "pcb_hole",
+      pcb_hole_id: "hole_square_positive",
+      hole_shape: "square",
+      x: -1,
+      y: 2,
+      hole_diameter: 1.0,
+
+      soldermask_margin: 0.15,
+    },
+    // Square with negative margin
+    {
+      type: "pcb_hole",
+      pcb_hole_id: "hole_square_negative",
+      hole_shape: "square",
+      x: -1,
+      y: -2,
+      hole_diameter: 1.0,
+
+      soldermask_margin: -0.1,
+    },
+    // Oval with positive margin
+    {
+      type: "pcb_hole",
+      pcb_hole_id: "hole_oval_positive",
+      hole_shape: "oval",
+      x: 2,
+      y: 2,
+      hole_width: 1.5,
+      hole_height: 0.8,
+
+      soldermask_margin: 0.1,
+    },
+    // Oval with negative margin
+    {
+      type: "pcb_hole",
+      pcb_hole_id: "hole_oval_negative",
+      hole_shape: "oval",
+      x: 2,
+      y: -2,
+      hole_width: 1.5,
+      hole_height: 0.8,
+
+      soldermask_margin: -0.12,
+    },
+    // Rect with positive margin
+    {
+      type: "pcb_hole",
+      pcb_hole_id: "hole_rect_positive",
+      hole_shape: "rect",
+      x: 5,
+      y: 2,
+      hole_width: 1.5,
+      hole_height: 0.8,
+
+      soldermask_margin: 0.15,
+    },
+    // Pill with positive margin
+    {
+      type: "pcb_hole",
+      pcb_hole_id: "hole_pill_positive",
+      hole_shape: "pill",
+      x: -2.5,
+      y: 0,
+      hole_width: 1.5,
+      hole_height: 0.8,
+
+      soldermask_margin: 0.1,
+    },
+    // Pill with negative margin
+    {
+      type: "pcb_hole",
+      pcb_hole_id: "hole_pill_negative",
+      hole_shape: "pill",
+      x: -2.5,
+      y: -4,
+      hole_width: 1.5,
+      hole_height: 0.8,
+
+      soldermask_margin: -0.08,
+    },
+    // Pill with negative margin
+    {
+      type: "pcb_hole",
+      pcb_hole_id: "hole_pill_negative",
+      hole_shape: "pill",
+      x: -2.5,
+      y: -4,
+      hole_width: 1.5,
+      hole_height: 0.8,
+
+      soldermask_margin: -0.08,
+    },
+    // Circle with positive margin (mask extends beyond hole)
+    {
+      type: "pcb_hole",
+      pcb_hole_id: "hole_circle_positive",
+      hole_shape: "circle",
+      x: -4,
+      y: 2,
+      hole_diameter: 1.0,
+
+      soldermask_margin: 0.2,
+    },
     // Square with positive margin
     {
       type: "pcb_hole",
@@ -122,10 +238,47 @@ test("draw holes with positive soldermask margins", async () => {
       text: "+0.1mm",
       font_size: 0.4,
     },
+    // Labels for negative margin holes (bottom row)
+    {
+      type: "pcb_silkscreen_text",
+      pcb_silkscreen_text_id: "text_circle_neg",
+      layer: "top",
+      anchor_position: { x: -4, y: -0.8 },
+      anchor_alignment: "center",
+      text: "-0.15mm",
+      font_size: 0.4,
+    },
+    {
+      type: "pcb_silkscreen_text",
+      pcb_silkscreen_text_id: "text_square_neg",
+      layer: "top",
+      anchor_position: { x: -1, y: -0.8 },
+      anchor_alignment: "center",
+      text: "-0.1mm",
+      font_size: 0.4,
+    },
+    {
+      type: "pcb_silkscreen_text",
+      pcb_silkscreen_text_id: "text_oval_neg",
+      layer: "top",
+      anchor_position: { x: 2, y: -0.8 },
+      anchor_alignment: "center",
+      text: "-0.12mm",
+      font_size: 0.4,
+    },
+    {
+      type: "pcb_silkscreen_text",
+      pcb_silkscreen_text_id: "text_pill_neg",
+      layer: "top",
+      anchor_position: { x: -2.5, y: -2.8 },
+      anchor_alignment: "center",
+      text: "-0.08mm",
+      font_size: 0.4,
+    },
   ]
 
   drawer.setCameraBounds({ minX: -7, maxX: 7, minY: -5, maxY: 5 })
-  drawer.drawElements(circuit)
+  drawer.drawElements(circuit, { showSoldermask: true })
 
   await expect(canvas.toBuffer("image/png")).toMatchPngSnapshot(
     import.meta.path,