circuit-to-canvas 0.0.29 → 0.0.31

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import { AnyCircuitElement, NinePointAnchor, PcbPlatedHole, PCBVia, PCBHole, PcbSmtPad, PCBTrace, PcbBoard, PcbSilkscreenText, PcbSilkscreenRect, PcbSilkscreenCircle, PcbSilkscreenLine, PcbSilkscreenPath, PcbSilkscreenPill, PcbCutout, PcbCopperPour, PcbCopperText, PcbFabricationNoteText, PcbFabricationNoteRect, PcbNoteRect, PcbFabricationNotePath, PcbNotePath, PcbNoteText, PcbNoteDimension } from 'circuit-json';
+import { AnyCircuitElement, PcbRenderLayer, NinePointAnchor, PcbPlatedHole, PCBVia, PCBHole, PcbSmtPad, PCBTrace, PcbBoard, PcbSilkscreenText, PcbSilkscreenRect, PcbSilkscreenCircle, PcbSilkscreenLine, PcbSilkscreenPath, PcbSilkscreenPill, PcbCutout, PcbCopperPour, PcbCopperText, PcbFabricationNoteText, PcbFabricationNoteRect, PcbNoteRect, PcbFabricationNotePath, PcbNotePath, PcbNoteText, PcbNoteDimension } from 'circuit-json';
 import { Matrix } from 'transformation-matrix';
 
 /**
@@ -86,7 +86,7 @@ interface DrawContext {
 }
 
 interface DrawElementsOptions {
-    layers?: string[];
+    layers?: PcbRenderLayer[];
 }
 interface CanvasLike {
     getContext(contextId: "2d"): CanvasContext | null;
@@ -99,6 +99,7 @@ declare class CircuitToCanvasDrawer {
     configure(config: DrawerConfig): void;
     setCameraBounds(bounds: CameraBounds): void;
     drawElements(elements: AnyCircuitElement[], options?: DrawElementsOptions): void;
+    private drawBoardWithSoldermask;
     private drawElement;
 }
 
@@ -287,6 +288,31 @@ interface DrawPcbSmtPadParams {
 }
 declare function drawPcbSmtPad(params: DrawPcbSmtPadParams): void;
 
+/**
+ * Draws a soldermask ring for rectangular shapes with negative margin
+ * (soldermask appears inside the pad boundary)
+ */
+declare function drawSoldermaskRingForRect(ctx: CanvasContext, center: {
+    x: number;
+    y: number;
+}, width: number, height: number, margin: number, borderRadius: number, rotation: number, realToCanvasMat: Matrix, soldermaskColor: string, padColor: string): void;
+/**
+ * Draws a soldermask ring for circular shapes with negative margin
+ * (soldermask appears inside the pad boundary)
+ */
+declare function drawSoldermaskRingForCircle(ctx: CanvasContext, center: {
+    x: number;
+    y: number;
+}, radius: number, margin: number, realToCanvasMat: Matrix, soldermaskColor: string, padColor: string): void;
+/**
+ * Draws a soldermask ring for pill shapes with negative margin
+ * (soldermask appears inside the pad boundary)
+ */
+declare function drawSoldermaskRingForPill(ctx: CanvasContext, center: {
+    x: number;
+    y: number;
+}, width: number, height: number, margin: number, rotation: number, realToCanvasMat: Matrix, soldermaskColor: string, padColor: string): void;
+
 interface DrawPcbTraceParams {
     ctx: CanvasContext;
     trace: PCBTrace;
@@ -431,4 +457,4 @@ interface DrawPcbNoteDimensionParams {
 }
 declare function drawPcbNoteDimension(params: DrawPcbNoteDimensionParams): void;
 
-export { type AlphabetLayout, type AnchorAlignment, type CameraBounds, type CanvasContext, CircuitToCanvasDrawer, type CopperColorMap, type CopperLayerName, DEFAULT_PCB_COLOR_MAP, type DrawArrowParams, type DrawCircleParams, type DrawContext, type DrawElementsOptions, type DrawLineParams, type DrawOvalParams, type DrawPathParams, type DrawPcbBoardParams, type DrawPcbCopperPourParams, type DrawPcbCopperTextParams, type DrawPcbCutoutParams, type DrawPcbFabricationNotePathParams, type DrawPcbFabricationNoteRectParams, type DrawPcbFabricationNoteTextParams, type DrawPcbHoleParams, type DrawPcbNoteDimensionParams, type DrawPcbNotePathParams, type DrawPcbNoteRectParams, type DrawPcbNoteTextParams, type DrawPcbPlatedHoleParams, type DrawPcbSilkscreenCircleParams, type DrawPcbSilkscreenLineParams, type DrawPcbSilkscreenPathParams, type DrawPcbSilkscreenPillParams, type DrawPcbSilkscreenRectParams, type DrawPcbSilkscreenTextParams, type DrawPcbSmtPadParams, type DrawPcbTraceParams, type DrawPcbViaParams, type DrawPillParams, type DrawPolygonParams, type DrawRectParams, type DrawTextParams, type DrawerConfig, type PcbColorMap, drawArrow, drawCircle, drawLine, drawOval, drawPath, drawPcbBoard, drawPcbCopperPour, drawPcbCopperText, drawPcbCutout, drawPcbFabricationNotePath, drawPcbFabricationNoteRect, drawPcbFabricationNoteText, drawPcbHole, drawPcbNoteDimension, drawPcbNotePath, drawPcbNoteRect, drawPcbNoteText, drawPcbPlatedHole, drawPcbSilkscreenCircle, drawPcbSilkscreenLine, drawPcbSilkscreenPath, drawPcbSilkscreenPill, drawPcbSilkscreenRect, drawPcbSilkscreenText, drawPcbSmtPad, drawPcbTrace, drawPcbVia, drawPill, drawPolygon, drawRect, drawText, getAlphabetLayout, getTextStartPosition, strokeAlphabetText };
+export { type AlphabetLayout, type AnchorAlignment, type CameraBounds, type CanvasContext, CircuitToCanvasDrawer, type CopperColorMap, type CopperLayerName, DEFAULT_PCB_COLOR_MAP, type DrawArrowParams, type DrawCircleParams, type DrawContext, type DrawElementsOptions, type DrawLineParams, type DrawOvalParams, type DrawPathParams, type DrawPcbBoardParams, type DrawPcbCopperPourParams, type DrawPcbCopperTextParams, type DrawPcbCutoutParams, type DrawPcbFabricationNotePathParams, type DrawPcbFabricationNoteRectParams, type DrawPcbFabricationNoteTextParams, type DrawPcbHoleParams, type DrawPcbNoteDimensionParams, type DrawPcbNotePathParams, type DrawPcbNoteRectParams, type DrawPcbNoteTextParams, type DrawPcbPlatedHoleParams, type DrawPcbSilkscreenCircleParams, type DrawPcbSilkscreenLineParams, type DrawPcbSilkscreenPathParams, type DrawPcbSilkscreenPillParams, type DrawPcbSilkscreenRectParams, type DrawPcbSilkscreenTextParams, type DrawPcbSmtPadParams, type DrawPcbTraceParams, type DrawPcbViaParams, type DrawPillParams, type DrawPolygonParams, type DrawRectParams, type DrawTextParams, type DrawerConfig, type PcbColorMap, drawArrow, drawCircle, drawLine, drawOval, drawPath, drawPcbBoard, drawPcbCopperPour, drawPcbCopperText, drawPcbCutout, drawPcbFabricationNotePath, drawPcbFabricationNoteRect, drawPcbFabricationNoteText, drawPcbHole, drawPcbNoteDimension, drawPcbNotePath, drawPcbNoteRect, drawPcbNoteText, drawPcbPlatedHole, drawPcbSilkscreenCircle, drawPcbSilkscreenLine, drawPcbSilkscreenPath, drawPcbSilkscreenPill, drawPcbSilkscreenRect, drawPcbSilkscreenText, drawPcbSmtPad, drawPcbTrace, drawPcbVia, drawPill, drawPolygon, drawRect, drawSoldermaskRingForCircle, drawSoldermaskRingForPill, drawSoldermaskRingForRect, drawText, getAlphabetLayout, getTextStartPosition, strokeAlphabetText };

package/dist/index.js

@@ -1,5 +1,24 @@
 // lib/drawer/CircuitToCanvasDrawer.ts
-import { identity, compose, translate, scale } from "transformation-matrix";
+import {
+  identity,
+  compose,
+  translate,
+  scale,
+  applyToPoint as applyToPoint15
+} from "transformation-matrix";
+
+// lib/drawer/pcb-render-layer-filter.ts
+import { getElementRenderLayers } from "@tscircuit/circuit-json-util";
+function shouldDrawElement(element, options) {
+  if (!options.layers || options.layers.length === 0) {
+    return true;
+  }
+  const elementLayers = getElementRenderLayers(element);
+  if (elementLayers.length === 0) {
+    return true;
+  }
+  return elementLayers.some((layer) => options.layers.includes(layer));
+}
 
 // lib/drawer/types.ts
 var DEFAULT_PCB_COLOR_MAP = {
@@ -496,14 +515,207 @@ function drawPcbHole(params) {
   }
 }
 
+// lib/drawer/elements/soldermask-margin.ts
+import { applyToPoint as applyToPoint6 } from "transformation-matrix";
+function drawSoldermaskRingForRect(ctx, center, width, height, margin, borderRadius, rotation, realToCanvasMat, soldermaskColor, padColor) {
+  const [cx, cy] = applyToPoint6(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);
+  ctx.save();
+  ctx.translate(cx, cy);
+  if (rotation !== 0) {
+    ctx.rotate(-rotation * (Math.PI / 180));
+  }
+  const prevCompositeOp = ctx.globalCompositeOperation;
+  if (ctx.globalCompositeOperation !== void 0) {
+    ctx.globalCompositeOperation = "source-atop";
+  }
+  const outerWidth = scaledWidth;
+  const outerHeight = scaledHeight;
+  const outerRadius = scaledRadius;
+  ctx.beginPath();
+  if (outerRadius > 0) {
+    const x = -outerWidth / 2;
+    const y = -outerHeight / 2;
+    const r = Math.min(outerRadius, outerWidth / 2, outerHeight / 2);
+    ctx.moveTo(x + r, y);
+    ctx.lineTo(x + outerWidth - r, y);
+    ctx.arcTo(x + outerWidth, y, x + outerWidth, y + r, r);
+    ctx.lineTo(x + outerWidth, y + outerHeight - r);
+    ctx.arcTo(
+      x + outerWidth,
+      y + outerHeight,
+      x + outerWidth - r,
+      y + outerHeight,
+      r
+    );
+    ctx.lineTo(x + r, y + outerHeight);
+    ctx.arcTo(x, y + outerHeight, x, y + outerHeight - r, r);
+    ctx.lineTo(x, y + r);
+    ctx.arcTo(x, y, x + r, y, r);
+  } else {
+    ctx.rect(-outerWidth / 2, -outerHeight / 2, outerWidth, outerHeight);
+  }
+  ctx.fillStyle = soldermaskColor;
+  ctx.fill();
+  if (ctx.globalCompositeOperation !== void 0) {
+    ctx.globalCompositeOperation = prevCompositeOp || "source-over";
+  }
+  const innerWidth = scaledWidth - scaledMargin * 2;
+  const innerHeight = scaledHeight - scaledMargin * 2;
+  const innerRadius = Math.max(0, scaledRadius - scaledMargin);
+  if (innerWidth > 0 && innerHeight > 0) {
+    ctx.beginPath();
+    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);
+      ctx.lineTo(x + innerWidth - r, y);
+      ctx.arcTo(x + innerWidth, y, x + innerWidth, y + r, r);
+      ctx.lineTo(x + innerWidth, y + innerHeight - r);
+      ctx.arcTo(
+        x + innerWidth,
+        y + innerHeight,
+        x + innerWidth - r,
+        y + innerHeight,
+        r
+      );
+      ctx.lineTo(x + r, y + innerHeight);
+      ctx.arcTo(x, y + innerHeight, x, y + innerHeight - r, r);
+      ctx.lineTo(x, y + r);
+      ctx.arcTo(x, y, x + r, y, r);
+    } else {
+      ctx.rect(-innerWidth / 2, -innerHeight / 2, innerWidth, innerHeight);
+    }
+    ctx.fillStyle = padColor;
+    ctx.fill();
+  }
+  ctx.restore();
+}
+function drawSoldermaskRingForCircle(ctx, center, radius, margin, realToCanvasMat, soldermaskColor, padColor) {
+  const [cx, cy] = applyToPoint6(realToCanvasMat, [center.x, center.y]);
+  const scaledRadius = radius * Math.abs(realToCanvasMat.a);
+  const scaledMargin = Math.abs(margin) * Math.abs(realToCanvasMat.a);
+  ctx.save();
+  const prevCompositeOp = ctx.globalCompositeOperation;
+  if (ctx.globalCompositeOperation !== void 0) {
+    ctx.globalCompositeOperation = "source-atop";
+  }
+  ctx.beginPath();
+  ctx.arc(cx, cy, scaledRadius, 0, Math.PI * 2);
+  ctx.fillStyle = soldermaskColor;
+  ctx.fill();
+  if (ctx.globalCompositeOperation !== void 0) {
+    ctx.globalCompositeOperation = prevCompositeOp || "source-over";
+  }
+  const innerRadius = Math.max(0, scaledRadius - scaledMargin);
+  if (innerRadius > 0) {
+    ctx.beginPath();
+    ctx.arc(cx, cy, innerRadius, 0, Math.PI * 2);
+    ctx.fillStyle = padColor;
+    ctx.fill();
+  }
+  ctx.restore();
+}
+function drawSoldermaskRingForPill(ctx, center, width, height, margin, rotation, realToCanvasMat, soldermaskColor, padColor) {
+  const [cx, cy] = applyToPoint6(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);
+  ctx.save();
+  ctx.translate(cx, cy);
+  if (rotation !== 0) {
+    ctx.rotate(-rotation * (Math.PI / 180));
+  }
+  const prevCompositeOp = ctx.globalCompositeOperation;
+  if (ctx.globalCompositeOperation !== void 0) {
+    ctx.globalCompositeOperation = "source-atop";
+  }
+  const outerWidth = scaledWidth;
+  const outerHeight = scaledHeight;
+  ctx.beginPath();
+  if (outerWidth > outerHeight) {
+    const radius = outerHeight / 2;
+    const straightLength = outerWidth - outerHeight;
+    ctx.moveTo(-straightLength / 2, -radius);
+    ctx.lineTo(straightLength / 2, -radius);
+    ctx.arc(straightLength / 2, 0, radius, -Math.PI / 2, Math.PI / 2);
+    ctx.lineTo(-straightLength / 2, radius);
+    ctx.arc(-straightLength / 2, 0, radius, Math.PI / 2, -Math.PI / 2);
+  } else if (outerHeight > outerWidth) {
+    const radius = outerWidth / 2;
+    const straightLength = outerHeight - outerWidth;
+    ctx.moveTo(radius, -straightLength / 2);
+    ctx.lineTo(radius, straightLength / 2);
+    ctx.arc(0, straightLength / 2, radius, 0, Math.PI);
+    ctx.lineTo(-radius, -straightLength / 2);
+    ctx.arc(0, -straightLength / 2, radius, Math.PI, 0);
+  } else {
+    ctx.arc(0, 0, outerWidth / 2, 0, Math.PI * 2);
+  }
+  ctx.fillStyle = soldermaskColor;
+  ctx.fill();
+  if (ctx.globalCompositeOperation !== void 0) {
+    ctx.globalCompositeOperation = prevCompositeOp || "source-over";
+  }
+  const innerWidth = scaledWidth - scaledMargin * 2;
+  const innerHeight = scaledHeight - scaledMargin * 2;
+  if (innerWidth > 0 && innerHeight > 0) {
+    ctx.beginPath();
+    if (innerWidth > innerHeight) {
+      const radius = innerHeight / 2;
+      const straightLength = innerWidth - innerHeight;
+      ctx.moveTo(-straightLength / 2, -radius);
+      ctx.lineTo(straightLength / 2, -radius);
+      ctx.arc(straightLength / 2, 0, radius, -Math.PI / 2, Math.PI / 2);
+      ctx.lineTo(-straightLength / 2, radius);
+      ctx.arc(-straightLength / 2, 0, radius, Math.PI / 2, -Math.PI / 2);
+    } else if (innerHeight > innerWidth) {
+      const radius = innerWidth / 2;
+      const straightLength = innerHeight - innerWidth;
+      ctx.moveTo(radius, -straightLength / 2);
+      ctx.lineTo(radius, straightLength / 2);
+      ctx.arc(0, straightLength / 2, radius, 0, Math.PI);
+      ctx.lineTo(-radius, -straightLength / 2);
+      ctx.arc(0, -straightLength / 2, radius, Math.PI, 0);
+    } else {
+      ctx.arc(0, 0, innerWidth / 2, 0, Math.PI * 2);
+    }
+    ctx.fillStyle = padColor;
+    ctx.fill();
+  }
+  ctx.restore();
+}
+
 // lib/drawer/elements/pcb-smtpad.ts
 function layerToColor(layer, colorMap) {
   return colorMap.copper[layer] ?? colorMap.copper.top;
 }
+function getSoldermaskColor(layer, colorMap) {
+  return colorMap.soldermaskOverCopper[layer] ?? colorMap.soldermaskOverCopper.top;
+}
 function drawPcbSmtPad(params) {
   const { ctx, pad, realToCanvasMat, colorMap } = params;
   const color = layerToColor(pad.layer, colorMap);
+  const hasSoldermask = pad.is_covered_with_solder_mask === true && pad.soldermask_margin !== void 0 && pad.soldermask_margin !== 0;
+  const margin = hasSoldermask ? pad.soldermask_margin : 0;
+  const soldermaskRingColor = getSoldermaskColor(pad.layer, colorMap);
+  const positiveMarginColor = colorMap.substrate;
   if (pad.shape === "rect") {
+    if (hasSoldermask && margin > 0) {
+      drawRect({
+        ctx,
+        center: { x: pad.x, y: pad.y },
+        width: pad.width + margin * 2,
+        height: pad.height + margin * 2,
+        fill: positiveMarginColor,
+        realToCanvasMat,
+        borderRadius: (pad.corner_radius ?? pad.rect_border_radius ?? 0) + margin
+      });
+    }
     drawRect({
       ctx,
       center: { x: pad.x, y: pad.y },
@@ -513,9 +725,35 @@ function drawPcbSmtPad(params) {
       realToCanvasMat,
       borderRadius: pad.corner_radius ?? pad.rect_border_radius ?? 0
     });
+    if (hasSoldermask && margin < 0) {
+      drawSoldermaskRingForRect(
+        ctx,
+        { x: pad.x, y: pad.y },
+        pad.width,
+        pad.height,
+        margin,
+        pad.corner_radius ?? pad.rect_border_radius ?? 0,
+        0,
+        realToCanvasMat,
+        soldermaskRingColor,
+        color
+      );
+    }
     return;
   }
   if (pad.shape === "rotated_rect") {
+    if (hasSoldermask && margin > 0) {
+      drawRect({
+        ctx,
+        center: { x: pad.x, y: pad.y },
+        width: pad.width + margin * 2,
+        height: pad.height + margin * 2,
+        fill: positiveMarginColor,
+        realToCanvasMat,
+        borderRadius: (pad.corner_radius ?? pad.rect_border_radius ?? 0) + margin,
+        rotation: pad.ccw_rotation ?? 0
+      });
+    }
     drawRect({
       ctx,
       center: { x: pad.x, y: pad.y },
@@ -526,9 +764,32 @@ function drawPcbSmtPad(params) {
       borderRadius: pad.corner_radius ?? pad.rect_border_radius ?? 0,
       rotation: pad.ccw_rotation ?? 0
     });
+    if (hasSoldermask && margin < 0) {
+      drawSoldermaskRingForRect(
+        ctx,
+        { x: pad.x, y: pad.y },
+        pad.width,
+        pad.height,
+        margin,
+        pad.corner_radius ?? pad.rect_border_radius ?? 0,
+        pad.ccw_rotation ?? 0,
+        realToCanvasMat,
+        soldermaskRingColor,
+        color
+      );
+    }
     return;
   }
   if (pad.shape === "circle") {
+    if (hasSoldermask && margin > 0) {
+      drawCircle({
+        ctx,
+        center: { x: pad.x, y: pad.y },
+        radius: pad.radius + margin,
+        fill: positiveMarginColor,
+        realToCanvasMat
+      });
+    }
     drawCircle({
       ctx,
       center: { x: pad.x, y: pad.y },
@@ -536,9 +797,30 @@ function drawPcbSmtPad(params) {
       fill: color,
       realToCanvasMat
     });
+    if (hasSoldermask && margin < 0) {
+      drawSoldermaskRingForCircle(
+        ctx,
+        { x: pad.x, y: pad.y },
+        pad.radius,
+        margin,
+        realToCanvasMat,
+        soldermaskRingColor,
+        color
+      );
+    }
     return;
   }
   if (pad.shape === "pill") {
+    if (hasSoldermask && margin > 0) {
+      drawPill({
+        ctx,
+        center: { x: pad.x, y: pad.y },
+        width: pad.width + margin * 2,
+        height: pad.height + margin * 2,
+        fill: positiveMarginColor,
+        realToCanvasMat
+      });
+    }
     drawPill({
       ctx,
       center: { x: pad.x, y: pad.y },
@@ -547,9 +829,33 @@ function drawPcbSmtPad(params) {
       fill: color,
       realToCanvasMat
     });
+    if (hasSoldermask && margin < 0) {
+      drawSoldermaskRingForPill(
+        ctx,
+        { x: pad.x, y: pad.y },
+        pad.width,
+        pad.height,
+        margin,
+        0,
+        realToCanvasMat,
+        soldermaskRingColor,
+        color
+      );
+    }
     return;
   }
   if (pad.shape === "rotated_pill") {
+    if (hasSoldermask && margin > 0) {
+      drawPill({
+        ctx,
+        center: { x: pad.x, y: pad.y },
+        width: pad.width + margin * 2,
+        height: pad.height + margin * 2,
+        fill: positiveMarginColor,
+        realToCanvasMat,
+        rotation: pad.ccw_rotation ?? 0
+      });
+    }
     drawPill({
       ctx,
       center: { x: pad.x, y: pad.y },
@@ -559,6 +865,19 @@ function drawPcbSmtPad(params) {
       realToCanvasMat,
       rotation: pad.ccw_rotation ?? 0
     });
+    if (hasSoldermask && margin < 0) {
+      drawSoldermaskRingForPill(
+        ctx,
+        { x: pad.x, y: pad.y },
+        pad.width,
+        pad.height,
+        margin,
+        pad.ccw_rotation ?? 0,
+        realToCanvasMat,
+        soldermaskRingColor,
+        color
+      );
+    }
     return;
   }
   if (pad.shape === "polygon") {
@@ -575,7 +894,7 @@ function drawPcbSmtPad(params) {
 }
 
 // lib/drawer/shapes/line.ts
-import { applyToPoint as applyToPoint6 } from "transformation-matrix";
+import { applyToPoint as applyToPoint7 } from "transformation-matrix";
 function drawLine(params) {
   const {
     ctx,
@@ -586,8 +905,8 @@ function drawLine(params) {
     realToCanvasMat,
     lineCap = "round"
   } = params;
-  const [x1, y1] = applyToPoint6(realToCanvasMat, [start.x, start.y]);
-  const [x2, y2] = applyToPoint6(realToCanvasMat, [end.x, end.y]);
+  const [x1, y1] = applyToPoint7(realToCanvasMat, [start.x, start.y]);
+  const [x2, y2] = applyToPoint7(realToCanvasMat, [end.x, end.y]);
   const scaledStrokeWidth = strokeWidth * Math.abs(realToCanvasMat.a);
   ctx.beginPath();
   ctx.moveTo(x1, y1);
@@ -628,7 +947,7 @@ function drawPcbTrace(params) {
 }
 
 // lib/drawer/shapes/path.ts
-import { applyToPoint as applyToPoint7 } from "transformation-matrix";
+import { applyToPoint as applyToPoint8 } from "transformation-matrix";
 function drawPath(params) {
   const {
     ctx,
@@ -642,7 +961,7 @@ function drawPath(params) {
   if (points.length < 2) return;
   ctx.beginPath();
   const canvasPoints = points.map(
-    (p) => applyToPoint7(realToCanvasMat, [p.x, p.y])
+    (p) => applyToPoint8(realToCanvasMat, [p.x, p.y])
   );
   const firstPoint = canvasPoints[0];
   if (!firstPoint) return;
@@ -713,11 +1032,11 @@ function drawPcbBoard(params) {
 }
 
 // lib/drawer/elements/pcb-silkscreen-text.ts
-import { applyToPoint as applyToPoint9 } from "transformation-matrix";
+import { applyToPoint as applyToPoint10 } from "transformation-matrix";
 
 // lib/drawer/shapes/text/text.ts
 import { lineAlphabet } from "@tscircuit/alphabet";
-import { applyToPoint as applyToPoint8 } from "transformation-matrix";
+import { applyToPoint as applyToPoint9 } from "transformation-matrix";
 
 // lib/drawer/shapes/text/getAlphabetLayout.ts
 var GLYPH_WIDTH_RATIO = 0.62;
@@ -814,7 +1133,7 @@ function drawText(params) {
     rotation = 0
   } = params;
   if (!text) return;
-  const [canvasX, canvasY] = applyToPoint8(realToCanvasMat, [x, y]);
+  const [canvasX, canvasY] = applyToPoint9(realToCanvasMat, [x, y]);
   const scale2 = Math.abs(realToCanvasMat.a);
   const scaledFontSize = fontSize * scale2;
   const layout = getAlphabetLayout(text, scaledFontSize);
@@ -851,7 +1170,7 @@ function drawPcbSilkscreenText(params) {
   const content = text.text ?? "";
   if (!content) return;
   const color = layerToSilkscreenColor(text.layer, colorMap);
-  const [x, y] = applyToPoint9(realToCanvasMat, [
+  const [x, y] = applyToPoint10(realToCanvasMat, [
     text.anchor_position.x,
     text.anchor_position.y
   ]);
@@ -1014,7 +1333,7 @@ function drawPcbCutout(params) {
 }
 
 // lib/drawer/elements/pcb-copper-pour.ts
-import { applyToPoint as applyToPoint10 } from "transformation-matrix";
+import { applyToPoint as applyToPoint11 } from "transformation-matrix";
 function layerToColor3(layer, colorMap) {
   return colorMap.copper[layer] ?? colorMap.copper.top;
 }
@@ -1023,7 +1342,7 @@ function drawPcbCopperPour(params) {
   const color = layerToColor3(pour.layer, colorMap);
   ctx.save();
   if (pour.shape === "rect") {
-    const [cx, cy] = applyToPoint10(realToCanvasMat, [
+    const [cx, cy] = applyToPoint11(realToCanvasMat, [
       pour.center.x,
       pour.center.y
     ]);
@@ -1044,7 +1363,7 @@ function drawPcbCopperPour(params) {
   if (pour.shape === "polygon") {
     if (pour.points && pour.points.length >= 3) {
       const canvasPoints = pour.points.map(
-        (p) => applyToPoint10(realToCanvasMat, [p.x, p.y])
+        (p) => applyToPoint11(realToCanvasMat, [p.x, p.y])
       );
       const firstPoint = canvasPoints[0];
       if (!firstPoint) {
@@ -1072,7 +1391,7 @@ function drawPcbCopperPour(params) {
 }
 
 // lib/drawer/elements/pcb-copper-text.ts
-import { applyToPoint as applyToPoint11 } from "transformation-matrix";
+import { applyToPoint as applyToPoint12 } from "transformation-matrix";
 var DEFAULT_PADDING = { left: 0.2, right: 0.2, top: 0.2, bottom: 0.2 };
 function layerToCopperColor(layer, colorMap) {
   return colorMap.copper[layer] ?? colorMap.copper.top;
@@ -1087,7 +1406,7 @@ function drawPcbCopperText(params) {
   const { ctx, text, realToCanvasMat, colorMap } = params;
   const content = text.text ?? "";
   if (!content) return;
-  const [x, y] = applyToPoint11(realToCanvasMat, [
+  const [x, y] = applyToPoint12(realToCanvasMat, [
     text.anchor_position.x,
     text.anchor_position.y
   ]);
@@ -1271,7 +1590,7 @@ function drawPcbNoteText(params) {
 }
 
 // lib/drawer/elements/pcb-note-dimension.ts
-import { applyToPoint as applyToPoint12 } from "transformation-matrix";
+import { applyToPoint as applyToPoint13 } from "transformation-matrix";
 
 // lib/drawer/shapes/arrow.ts
 function drawArrow(params) {
@@ -1356,11 +1675,11 @@ function drawPcbNoteDimension(params) {
     stroke: color,
     realToCanvasMat
   });
-  const [canvasFromX, canvasFromY] = applyToPoint12(realToCanvasMat, [
+  const [canvasFromX, canvasFromY] = applyToPoint13(realToCanvasMat, [
     fromX,
     fromY
   ]);
-  const [canvasToX, canvasToY] = applyToPoint12(realToCanvasMat, [toX, toY]);
+  const [canvasToX, canvasToY] = applyToPoint13(realToCanvasMat, [toX, toY]);
   const canvasDx = canvasToX - canvasFromX;
   const canvasDy = canvasToY - canvasFromY;
   const lineAngle = Math.atan2(canvasDy, canvasDx);
@@ -1421,15 +1740,15 @@ function drawPcbNoteDimension(params) {
 }
 
 // lib/drawer/elements/pcb-note-line.ts
-import { applyToPoint as applyToPoint13 } from "transformation-matrix";
+import { applyToPoint as applyToPoint14 } from "transformation-matrix";
 function drawPcbNoteLine(params) {
   const { ctx, line, realToCanvasMat, colorMap } = params;
   const defaultColor = "rgb(89, 148, 220)";
   const color = line.color ?? defaultColor;
   const strokeWidth = line.stroke_width ?? 0.1;
   const isDashed = line.is_dashed ?? false;
-  const [x1, y1] = applyToPoint13(realToCanvasMat, [line.x1, line.y1]);
-  const [x2, y2] = applyToPoint13(realToCanvasMat, [line.x2, line.y2]);
+  const [x1, y1] = applyToPoint14(realToCanvasMat, [line.x1, line.y1]);
+  const [x2, y2] = applyToPoint14(realToCanvasMat, [line.x2, line.y2]);
   const scaledStrokeWidth = strokeWidth * Math.abs(realToCanvasMat.a);
   ctx.save();
   if (isDashed) {
@@ -1511,11 +1830,82 @@ var CircuitToCanvasDrawer = class {
     );
   }
   drawElements(elements, options = {}) {
+    const hasSoldermaskPads = elements.some(
+      (el) => el.type === "pcb_smtpad" && el.is_covered_with_solder_mask === true
+    );
     for (const element of elements) {
-      this.drawElement(element, options);
+      if (element.type === "pcb_board" && hasSoldermaskPads) {
+        this.drawBoardWithSoldermask(element);
+      } else {
+        this.drawElement(element, options);
+      }
+    }
+  }
+  drawBoardWithSoldermask(board) {
+    const { width, height, center, outline } = board;
+    const layer = "top";
+    if (outline && Array.isArray(outline) && outline.length >= 3) {
+      const soldermaskColor = this.colorMap.soldermask[layer] ?? this.colorMap.soldermask.top;
+      const canvasPoints = outline.map((p) => {
+        const [x, y] = applyToPoint15(this.realToCanvasMat, [p.x, p.y]);
+        return { x, y };
+      });
+      this.ctx.beginPath();
+      const firstPoint = canvasPoints[0];
+      if (firstPoint) {
+        this.ctx.moveTo(firstPoint.x, firstPoint.y);
+        for (let i = 1; i < canvasPoints.length; i++) {
+          const point = canvasPoints[i];
+          if (point) {
+            this.ctx.lineTo(point.x, point.y);
+          }
+        }
+        this.ctx.closePath();
+      }
+      this.ctx.fillStyle = soldermaskColor;
+      this.ctx.fill();
+      drawPath({
+        ctx: this.ctx,
+        points: outline.map((p) => ({ x: p.x, y: p.y })),
+        stroke: this.colorMap.boardOutline,
+        strokeWidth: 0.1,
+        realToCanvasMat: this.realToCanvasMat,
+        closePath: true
+      });
+      return;
+    }
+    if (width !== void 0 && height !== void 0 && center) {
+      const soldermaskColor = this.colorMap.soldermask[layer] ?? this.colorMap.soldermask.top;
+      drawRect({
+        ctx: this.ctx,
+        center,
+        width,
+        height,
+        fill: soldermaskColor,
+        realToCanvasMat: this.realToCanvasMat
+      });
+      const halfWidth = width / 2;
+      const halfHeight = height / 2;
+      const corners = [
+        { x: center.x - halfWidth, y: center.y - halfHeight },
+        { x: center.x + halfWidth, y: center.y - halfHeight },
+        { x: center.x + halfWidth, y: center.y + halfHeight },
+        { x: center.x - halfWidth, y: center.y + halfHeight }
+      ];
+      drawPath({
+        ctx: this.ctx,
+        points: corners,
+        stroke: this.colorMap.boardOutline,
+        strokeWidth: 0.1,
+        realToCanvasMat: this.realToCanvasMat,
+        closePath: true
+      });
     }
   }
   drawElement(element, options) {
+    if (!shouldDrawElement(element, options)) {
+      return;
+    }
     if (element.type === "pcb_plated_hole") {
       drawPcbPlatedHole({
         ctx: this.ctx,
@@ -1735,6 +2125,9 @@ export {
   drawPill,
   drawPolygon,
   drawRect,
+  drawSoldermaskRingForCircle,
+  drawSoldermaskRingForPill,
+  drawSoldermaskRingForRect,
   drawText,
   getAlphabetLayout,
   getTextStartPosition,