@tscircuit/pcb-viewer 1.11.268 → 1.11.270

package/dist/index.js

@@ -6278,7 +6278,8 @@ var STORAGE_KEYS = {
   IS_SHOWING_PCB_GROUPS: "pcb_viewer_is_showing_pcb_groups",
   PCB_GROUP_VIEW_MODE: "pcb_viewer_group_view_mode",
   IS_SHOWING_COPPER_POURS: "pcb_viewer_is_showing_copper_pours",
-  IS_SHOWING_GROUP_ANCHOR_OFFSETS: "pcb_viewer_is_showing_group_anchor_offsets"
+  IS_SHOWING_GROUP_ANCHOR_OFFSETS: "pcb_viewer_is_showing_group_anchor_offsets",
+  IS_SHOWING_SOLDER_MASK: "pcb_viewer_is_showing_solder_mask"
 };
 var getStoredBoolean = (key, defaultValue) => {
   if (typeof window === "undefined") return defaultValue;
@@ -6338,6 +6339,10 @@ var createStore = (initialState = {}, disablePcbGroups = false) => createZustand
       STORAGE_KEYS.IS_SHOWING_GROUP_ANCHOR_OFFSETS,
       true
     ),
+    is_showing_solder_mask: getStoredBoolean(
+      STORAGE_KEYS.IS_SHOWING_SOLDER_MASK,
+      false
+    ),
     pcb_group_view_mode: disablePcbGroups ? "all" : getStoredString(
       STORAGE_KEYS.PCB_GROUP_VIEW_MODE,
       DEFAULT_PCB_GROUP_VIEW_MODE
@@ -6375,6 +6380,10 @@ var createStore = (initialState = {}, disablePcbGroups = false) => createZustand
       );
       set({ is_showing_group_anchor_offsets: is_showing });
     },
+    setIsShowingSolderMask: (is_showing) => {
+      setStoredBoolean(STORAGE_KEYS.IS_SHOWING_SOLDER_MASK, is_showing);
+      set({ is_showing_solder_mask: is_showing });
+    },
     setPcbGroupViewMode: (mode) => {
       if (disablePcbGroups) return;
       setStoredString(STORAGE_KEYS.PCB_GROUP_VIEW_MODE, mode);
@@ -7139,76 +7148,123 @@ var convertElementToPrimitives = (element, allElements) => {
     }
     case "pcb_board": {
       const { width, height, center, outline } = element;
+      const primitives = [];
+      const hasSolderMask = allElements.some(
+        (elm) => elm.type === "pcb_smtpad" && elm.is_covered_with_solder_mask === true
+      );
+      if (hasSolderMask) {
+        if (outline && outline.length > 2) {
+          primitives.push({
+            _pcb_drawing_object_id: `polygon_${globalPcbDrawingObjectCount++}`,
+            pcb_drawing_type: "polygon",
+            points: normalizePolygonPoints(outline),
+            layer: "soldermask_top",
+            _element: element
+          });
+          primitives.push({
+            _pcb_drawing_object_id: `polygon_${globalPcbDrawingObjectCount++}`,
+            pcb_drawing_type: "polygon",
+            points: normalizePolygonPoints(outline),
+            layer: "soldermask_bottom",
+            _element: element
+          });
+        } else if (width && height) {
+          primitives.push({
+            _pcb_drawing_object_id: `rect_${globalPcbDrawingObjectCount++}`,
+            pcb_drawing_type: "rect",
+            x: center.x,
+            y: center.y,
+            w: width,
+            h: height,
+            layer: "soldermask_top",
+            _element: element
+          });
+          primitives.push({
+            _pcb_drawing_object_id: `rect_${globalPcbDrawingObjectCount++}`,
+            pcb_drawing_type: "rect",
+            x: center.x,
+            y: center.y,
+            w: width,
+            h: height,
+            layer: "soldermask_bottom",
+            _element: element
+          });
+        }
+      }
       if (outline && outline.length > 2) {
-        return outline.map((point, index, array) => ({
-          _pcb_drawing_object_id: `line_${globalPcbDrawingObjectCount++}`,
-          pcb_drawing_type: "line",
-          x1: point.x,
-          y1: point.y,
-          x2: index === array.length - 1 ? array[0].x : array[index + 1].x,
-          y2: index === array.length - 1 ? array[0].y : array[index + 1].y,
-          width: 1,
-          zoomIndependent: true,
-          layer: "board",
-          _element: element
-        }));
+        primitives.push(
+          ...outline.map((point, index, array) => ({
+            _pcb_drawing_object_id: `line_${globalPcbDrawingObjectCount++}`,
+            pcb_drawing_type: "line",
+            x1: point.x,
+            y1: point.y,
+            x2: index === array.length - 1 ? array[0].x : array[index + 1].x,
+            y2: index === array.length - 1 ? array[0].y : array[index + 1].y,
+            width: 1,
+            zoomIndependent: true,
+            layer: "board",
+            _element: element
+          }))
+        );
+      } else {
+        primitives.push(
+          {
+            _pcb_drawing_object_id: `line_${globalPcbDrawingObjectCount++}`,
+            pcb_drawing_type: "line",
+            x1: center.x - width / 2,
+            y1: center.y - height / 2,
+            x2: center.x + width / 2,
+            y2: center.y - height / 2,
+            width: 1,
+            zoomIndependent: true,
+            layer: "board",
+            _element: element
+          },
+          {
+            _pcb_drawing_object_id: `line_${globalPcbDrawingObjectCount++}`,
+            pcb_drawing_type: "line",
+            x1: center.x - width / 2,
+            y1: center.y + height / 2,
+            x2: center.x + width / 2,
+            y2: center.y + height / 2,
+            width: 1,
+            zoomIndependent: true,
+            layer: "board",
+            _element: element
+          },
+          {
+            _pcb_drawing_object_id: `line_${globalPcbDrawingObjectCount++}`,
+            pcb_drawing_type: "line",
+            x1: center.x - width / 2,
+            y1: center.y - height / 2,
+            x2: center.x - width / 2,
+            y2: center.y + height / 2,
+            width: 1,
+            zoomIndependent: true,
+            layer: "board",
+            _element: element
+          },
+          {
+            _pcb_drawing_object_id: `line_${globalPcbDrawingObjectCount++}`,
+            pcb_drawing_type: "line",
+            x1: center.x + width / 2,
+            y1: center.y - height / 2,
+            x2: center.x + width / 2,
+            y2: center.y + height / 2,
+            width: 1,
+            zoomIndependent: true,
+            layer: "board",
+            _element: element
+          }
+        );
       }
-      return [
-        {
-          _pcb_drawing_object_id: `line_${globalPcbDrawingObjectCount++}`,
-          pcb_drawing_type: "line",
-          x1: center.x - width / 2,
-          y1: center.y - height / 2,
-          x2: center.x + width / 2,
-          y2: center.y - height / 2,
-          width: 1,
-          zoomIndependent: true,
-          layer: "board",
-          _element: element
-        },
-        {
-          _pcb_drawing_object_id: `line_${globalPcbDrawingObjectCount++}`,
-          pcb_drawing_type: "line",
-          x1: center.x - width / 2,
-          y1: center.y + height / 2,
-          x2: center.x + width / 2,
-          y2: center.y + height / 2,
-          width: 1,
-          zoomIndependent: true,
-          layer: "board",
-          _element: element
-        },
-        {
-          _pcb_drawing_object_id: `line_${globalPcbDrawingObjectCount++}`,
-          pcb_drawing_type: "line",
-          x1: center.x - width / 2,
-          y1: center.y - height / 2,
-          x2: center.x - width / 2,
-          y2: center.y + height / 2,
-          width: 1,
-          zoomIndependent: true,
-          layer: "board",
-          _element: element
-        },
-        {
-          _pcb_drawing_object_id: `line_${globalPcbDrawingObjectCount++}`,
-          pcb_drawing_type: "line",
-          x1: center.x + width / 2,
-          y1: center.y - height / 2,
-          x2: center.x + width / 2,
-          y2: center.y + height / 2,
-          width: 1,
-          zoomIndependent: true,
-          layer: "board",
-          _element: element
-        }
-      ];
+      return primitives;
     }
     case "pcb_smtpad": {
       if (element.shape === "rect" || element.shape === "rotated_rect") {
-        const { shape, x, y, width, height, layer, rect_border_radius } = element;
+        const { x, y, width, height, layer, rect_border_radius } = element;
         const corner_radius = element.corner_radius ?? rect_border_radius ?? 0;
-        return [
+        const primitives = [
           {
             _pcb_drawing_object_id: `rect_${globalPcbDrawingObjectCount++}`,
             pcb_drawing_type: "rect",
@@ -7225,9 +7281,152 @@ var convertElementToPrimitives = (element, allElements) => {
             roundness: corner_radius
           }
         ];
+        if (element.is_covered_with_solder_mask) {
+          const rawMargin = element.soldermask_margin;
+          const maskLayer = layer === "bottom" ? "soldermask_with_copper_bottom" : "soldermask_with_copper_top";
+          if (rawMargin === void 0 || rawMargin === null) {
+            const soldermask_margin2 = 0;
+            const openingWidth = Math.max(0.01, width + 2 * soldermask_margin2);
+            const openingHeight = Math.max(0.01, height + 2 * soldermask_margin2);
+            const openingPrimitive = {
+              _pcb_drawing_object_id: `rect_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "rect",
+              x,
+              y,
+              w: openingWidth,
+              h: openingHeight,
+              layer: maskLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              ccw_rotation: element.ccw_rotation,
+              roundness: corner_radius
+            };
+            if (element.solder_mask_color) {
+              openingPrimitive.color = element.solder_mask_color;
+            }
+            primitives.push(openingPrimitive);
+            const maskCoverageLayer = layer === "bottom" ? "soldermask_bottom" : "soldermask_top";
+            const fullMaskCoverage = {
+              _pcb_drawing_object_id: `rect_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "rect",
+              x,
+              y,
+              w: width,
+              h: height,
+              layer: maskCoverageLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              ccw_rotation: element.ccw_rotation,
+              roundness: corner_radius
+            };
+            primitives.push(fullMaskCoverage);
+            const cutoutOpening = {
+              _pcb_drawing_object_id: `rect_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "rect",
+              x,
+              y,
+              w: openingWidth,
+              h: openingHeight,
+              layer: maskCoverageLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              ccw_rotation: element.ccw_rotation,
+              roundness: corner_radius,
+              composite_mode: "destination-out"
+            };
+            primitives.push(cutoutOpening);
+            return primitives;
+          }
+          const soldermask_margin = rawMargin;
+          if (soldermask_margin === 0) {
+            return primitives;
+          }
+          if (soldermask_margin > 0) {
+            const marginRing = {
+              _pcb_drawing_object_id: `rect_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "rect",
+              x,
+              y,
+              w: width + 2 * soldermask_margin,
+              h: height + 2 * soldermask_margin,
+              layer: maskLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              ccw_rotation: element.ccw_rotation,
+              roundness: corner_radius,
+              color: "rgb(201, 162, 110)"
+            };
+            primitives.push(marginRing);
+            const cutout = {
+              _pcb_drawing_object_id: `rect_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "rect",
+              x,
+              y,
+              w: width,
+              h: height,
+              layer: maskLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              ccw_rotation: element.ccw_rotation,
+              roundness: corner_radius,
+              composite_mode: "destination-out"
+            };
+            primitives.push(cutout);
+          } else {
+            const openingWidth = Math.max(0.01, width + 2 * soldermask_margin);
+            const openingHeight = Math.max(0.01, height + 2 * soldermask_margin);
+            const innerRingBase = {
+              _pcb_drawing_object_id: `rect_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "rect",
+              x,
+              y,
+              w: width,
+              h: height,
+              layer: maskLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              ccw_rotation: element.ccw_rotation,
+              roundness: corner_radius
+            };
+            if (element.solder_mask_color) {
+              innerRingBase.color = element.solder_mask_color;
+            }
+            primitives.push(innerRingBase);
+            const innerCutout = {
+              _pcb_drawing_object_id: `rect_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "rect",
+              x,
+              y,
+              w: openingWidth,
+              h: openingHeight,
+              layer: maskLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              ccw_rotation: element.ccw_rotation,
+              roundness: corner_radius,
+              composite_mode: "destination-out"
+            };
+            primitives.push(innerCutout);
+          }
+        }
+        return primitives;
       } else if (element.shape === "circle") {
         const { x, y, radius, layer } = element;
-        return [
+        const primitives = [
           {
             _pcb_drawing_object_id: `circle_${globalPcbDrawingObjectCount++}`,
             pcb_drawing_type: "circle",
@@ -7241,9 +7440,129 @@ var convertElementToPrimitives = (element, allElements) => {
             _source_port
           }
         ];
+        if (element.is_covered_with_solder_mask) {
+          const rawMargin = element.soldermask_margin;
+          const maskLayer = layer === "bottom" ? "soldermask_with_copper_bottom" : "soldermask_with_copper_top";
+          if (rawMargin === void 0 || rawMargin === null) {
+            const soldermask_margin2 = 0;
+            const openingRadius = Math.max(0.01, radius + soldermask_margin2);
+            const openingPrimitive = {
+              _pcb_drawing_object_id: `circle_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "circle",
+              x,
+              y,
+              r: openingRadius,
+              layer: maskLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port
+            };
+            if (element.solder_mask_color) {
+              openingPrimitive.color = element.solder_mask_color;
+            }
+            primitives.push(openingPrimitive);
+            const maskCoverageLayer = layer === "bottom" ? "soldermask_bottom" : "soldermask_top";
+            const fullMaskCoverage = {
+              _pcb_drawing_object_id: `circle_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "circle",
+              x,
+              y,
+              r: radius,
+              layer: maskCoverageLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port
+            };
+            primitives.push(fullMaskCoverage);
+            const cutoutOpening = {
+              _pcb_drawing_object_id: `circle_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "circle",
+              x,
+              y,
+              r: openingRadius,
+              layer: maskCoverageLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              composite_mode: "destination-out"
+            };
+            primitives.push(cutoutOpening);
+            return primitives;
+          }
+          const soldermask_margin = rawMargin;
+          if (soldermask_margin === 0) {
+            return primitives;
+          }
+          if (soldermask_margin > 0) {
+            const marginRing = {
+              _pcb_drawing_object_id: `circle_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "circle",
+              x,
+              y,
+              r: radius + soldermask_margin,
+              layer: maskLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              color: "rgb(201, 162, 110)"
+            };
+            primitives.push(marginRing);
+            const cutout = {
+              _pcb_drawing_object_id: `circle_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "circle",
+              x,
+              y,
+              r: radius,
+              layer: maskLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              composite_mode: "destination-out"
+            };
+            primitives.push(cutout);
+          } else {
+            const openingRadius = Math.max(0.01, radius + soldermask_margin);
+            const innerRingBase = {
+              _pcb_drawing_object_id: `circle_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "circle",
+              x,
+              y,
+              r: radius,
+              layer: maskLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port
+            };
+            if (element.solder_mask_color) {
+              innerRingBase.color = element.solder_mask_color;
+            }
+            primitives.push(innerRingBase);
+            const innerCutout = {
+              _pcb_drawing_object_id: `circle_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "circle",
+              x,
+              y,
+              r: openingRadius,
+              layer: maskLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              composite_mode: "destination-out"
+            };
+            primitives.push(innerCutout);
+          }
+        }
+        return primitives;
       } else if (element.shape === "polygon") {
         const { layer, points } = element;
-        return [
+        const primitives = [
           {
             _pcb_drawing_object_id: `polygon_${globalPcbDrawingObjectCount++}`,
             pcb_drawing_type: "polygon",
@@ -7255,9 +7574,27 @@ var convertElementToPrimitives = (element, allElements) => {
             _source_port
           }
         ];
+        if (element.is_covered_with_solder_mask) {
+          const maskLayer = layer === "bottom" ? "soldermask_with_copper_bottom" : "soldermask_with_copper_top";
+          const maskPrimitive = {
+            _pcb_drawing_object_id: `polygon_${globalPcbDrawingObjectCount++}`,
+            pcb_drawing_type: "polygon",
+            points: normalizePolygonPoints(points),
+            layer: maskLayer,
+            _element: element,
+            _parent_pcb_component,
+            _parent_source_component,
+            _source_port
+          };
+          if (element.solder_mask_color) {
+            maskPrimitive.color = element.solder_mask_color;
+          }
+          primitives.push(maskPrimitive);
+        }
+        return primitives;
       } else if (element.shape === "pill" || element.shape === "rotated_pill") {
         const { x, y, width, height, layer } = element;
-        return [
+        const primitives = [
           {
             _pcb_drawing_object_id: `pill_${globalPcbDrawingObjectCount++}`,
             pcb_drawing_type: "pill",
@@ -7273,6 +7610,142 @@ var convertElementToPrimitives = (element, allElements) => {
             ccw_rotation: element.ccw_rotation
           }
         ];
+        if (element.is_covered_with_solder_mask) {
+          const rawMargin = element.soldermask_margin;
+          const maskLayer = layer === "bottom" ? "soldermask_with_copper_bottom" : "soldermask_with_copper_top";
+          if (rawMargin === void 0 || rawMargin === null) {
+            const soldermask_margin2 = 0;
+            const openingWidth = Math.max(0.01, width + 2 * soldermask_margin2);
+            const openingHeight = Math.max(0.01, height + 2 * soldermask_margin2);
+            const openingPrimitive = {
+              _pcb_drawing_object_id: `pill_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "pill",
+              x,
+              y,
+              w: openingWidth,
+              h: openingHeight,
+              layer: maskLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              ccw_rotation: element.ccw_rotation
+            };
+            if (element.solder_mask_color) {
+              openingPrimitive.color = element.solder_mask_color;
+            }
+            primitives.push(openingPrimitive);
+            const maskCoverageLayer = layer === "bottom" ? "soldermask_bottom" : "soldermask_top";
+            const fullMaskCoverage = {
+              _pcb_drawing_object_id: `pill_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "pill",
+              x,
+              y,
+              w: width,
+              h: height,
+              layer: maskCoverageLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              ccw_rotation: element.ccw_rotation
+            };
+            primitives.push(fullMaskCoverage);
+            const cutoutOpening = {
+              _pcb_drawing_object_id: `pill_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "pill",
+              x,
+              y,
+              w: openingWidth,
+              h: openingHeight,
+              layer: maskCoverageLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              ccw_rotation: element.ccw_rotation,
+              composite_mode: "destination-out"
+            };
+            primitives.push(cutoutOpening);
+            return primitives;
+          }
+          const soldermask_margin = rawMargin;
+          if (soldermask_margin === 0) {
+            return primitives;
+          }
+          if (soldermask_margin > 0) {
+            const marginRing = {
+              _pcb_drawing_object_id: `pill_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "pill",
+              x,
+              y,
+              w: width + 2 * soldermask_margin,
+              h: height + 2 * soldermask_margin,
+              layer: maskLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              ccw_rotation: element.ccw_rotation,
+              color: "rgb(201, 162, 110)"
+            };
+            primitives.push(marginRing);
+            const cutout = {
+              _pcb_drawing_object_id: `pill_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "pill",
+              x,
+              y,
+              w: width,
+              h: height,
+              layer: maskLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              ccw_rotation: element.ccw_rotation,
+              composite_mode: "destination-out"
+            };
+            primitives.push(cutout);
+          } else {
+            const openingWidth = Math.max(0.01, width + 2 * soldermask_margin);
+            const openingHeight = Math.max(0.01, height + 2 * soldermask_margin);
+            const innerRingBase = {
+              _pcb_drawing_object_id: `pill_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "pill",
+              x,
+              y,
+              w: width,
+              h: height,
+              layer: maskLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              ccw_rotation: element.ccw_rotation
+            };
+            if (element.solder_mask_color) {
+              innerRingBase.color = element.solder_mask_color;
+            }
+            primitives.push(innerRingBase);
+            const innerCutout = {
+              _pcb_drawing_object_id: `pill_${globalPcbDrawingObjectCount++}`,
+              pcb_drawing_type: "pill",
+              x,
+              y,
+              w: openingWidth,
+              h: openingHeight,
+              layer: maskLayer,
+              _element: element,
+              _parent_pcb_component,
+              _parent_source_component,
+              _source_port,
+              ccw_rotation: element.ccw_rotation,
+              composite_mode: "destination-out"
+            };
+            primitives.push(innerCutout);
+          }
+        }
+        return primitives;
       }
       return [];
     }
@@ -8543,6 +9016,14 @@ var colors_default = {
     plated_hole: "rgb(26, 196, 210)",
     ratsnest: "rgba(245, 255, 213, 0.702)",
     select_overlay: "rgb(4, 255, 67)",
+    soldermaskWithCopper: {
+      top: "rgb(18, 82, 50)",
+      bottom: "rgb(77, 127, 196)"
+    },
+    soldermask: {
+      top: "rgb(12, 55, 33)",
+      bottom: "rgb(12, 55, 33)"
+    },
     through_via: "rgb(236, 236, 236)",
     user_1: "rgb(194, 194, 194)",
     user_2: "rgb(89, 148, 220)",
@@ -8739,6 +9220,10 @@ var LAYER_NAME_TO_COLOR = {
   bottom_silkscreen: colors_default.board.b_silks,
   top_fabrication: colors_default.board.f_fab,
   bottom_fabrication: colors_default.board.b_fab,
+  soldermask_top: colors_default.board.soldermask.top,
+  soldermask_bottom: colors_default.board.soldermask.bottom,
+  soldermask_with_copper_top: colors_default.board.soldermaskWithCopper.top,
+  soldermask_with_copper_bottom: colors_default.board.soldermaskWithCopper.bottom,
   notes: colors_default.board.user_2,
   ...colors_default.board
 };
@@ -8750,9 +9235,13 @@ var DEFAULT_DRAW_ORDER = [
   "inner2",
   "inner1",
   "bottom",
+  "soldermask_bottom",
   "bottom_silkscreen",
   "top",
+  "soldermask_top",
   "top_silkscreen",
+  "soldermask_with_copper_bottom",
+  "soldermask_with_copper_top",
   "board"
 ];
 var Drawer = class {
@@ -8763,6 +9252,7 @@ var Drawer = class {
   transform;
   foregroundLayer = "top";
   lastPoint;
+  _tempCompositeMode;
   constructor(canvasLayerMap) {
     this.canvasLayerMap = canvasLayerMap;
     this.ctxLayerMap = Object.fromEntries(
@@ -9044,23 +9534,27 @@ var Drawer = class {
    */
   orderAndFadeLayers() {
     const { canvasLayerMap, foregroundLayer } = this;
+    const associatedSilkscreen = foregroundLayer === "top" ? "top_silkscreen" : foregroundLayer === "bottom" ? "bottom_silkscreen" : void 0;
+    const maskWithCopperLayerForForeground = foregroundLayer === "top" ? "soldermask_with_copper_top" : foregroundLayer === "bottom" ? "soldermask_with_copper_bottom" : void 0;
     const opaqueLayers = /* @__PURE__ */ new Set([
       foregroundLayer,
       "drill",
       "other",
       "board",
-      foregroundLayer === "top" ? "top_silkscreen" : foregroundLayer === "bottom" ? "bottom_silkscreen" : ""
+      ...associatedSilkscreen ? [associatedSilkscreen] : [],
+      ...maskWithCopperLayerForForeground ? [maskWithCopperLayerForForeground] : []
     ]);
-    const associatedSilkscreen = foregroundLayer === "top" ? "top_silkscreen" : foregroundLayer === "bottom" ? "bottom_silkscreen" : void 0;
     const layersToShiftToTop = [
       foregroundLayer,
-      ...associatedSilkscreen ? [associatedSilkscreen] : []
+      ...associatedSilkscreen ? [associatedSilkscreen] : [],
+      ...maskWithCopperLayerForForeground ? [maskWithCopperLayerForForeground] : []
     ];
     const order = [
       ...DEFAULT_DRAW_ORDER.filter(
         (l) => !layersToShiftToTop.includes(l)
       ),
       foregroundLayer,
+      ...maskWithCopperLayerForForeground ? [maskWithCopperLayerForForeground] : [],
       "drill",
       ...associatedSilkscreen ? [associatedSilkscreen] : []
     ];
@@ -9099,6 +9593,9 @@ var Drawer = class {
       ctx.fillStyle = "rgba(0,0,0,1)";
       ctx.strokeStyle = "rgba(0,0,0,1)";
     }
+    if (this._tempCompositeMode) {
+      ctx.globalCompositeOperation = this._tempCompositeMode;
+    }
     ctx.font = `${scaleOnly(inverse(transform), fontSize)}px sans-serif`;
   }
   moveTo(x, y) {
@@ -9388,6 +9885,9 @@ var drawRect = (drawer, rect) => {
     layer: rect.layer,
     size: rect.stroke_width
   });
+  if (rect.composite_mode) {
+    drawer._tempCompositeMode = rect.composite_mode;
+  }
   drawer.rect({
     x: rect.x,
     y: rect.y,
@@ -9400,12 +9900,18 @@ var drawRect = (drawer, rect) => {
     stroke_width: rect.stroke_width,
     roundness: rect.roundness
   });
+  if (rect.composite_mode) {
+    drawer._tempCompositeMode = void 0;
+  }
 };
 var drawRotatedRect = (drawer, rect) => {
   drawer.equip({
     color: getColor(rect),
     layer: rect.layer
   });
+  if (rect.composite_mode) {
+    drawer._tempCompositeMode = rect.composite_mode;
+  }
   drawer.rotatedRect(
     rect.x,
     rect.y,
@@ -9415,20 +9921,35 @@ var drawRotatedRect = (drawer, rect) => {
     rect.roundness,
     rect.mesh_fill
   );
+  if (rect.composite_mode) {
+    drawer._tempCompositeMode = void 0;
+  }
 };
 var drawRotatedPill = (drawer, pill) => {
   drawer.equip({
     color: getColor(pill),
     layer: pill.layer
   });
+  if (pill.composite_mode) {
+    drawer._tempCompositeMode = pill.composite_mode;
+  }
   drawer.rotatedPill(pill.x, pill.y, pill.w, pill.h, pill.ccw_rotation);
+  if (pill.composite_mode) {
+    drawer._tempCompositeMode = void 0;
+  }
 };
 var drawCircle = (drawer, circle) => {
   drawer.equip({
     color: getColor(circle),
     layer: circle.layer
   });
+  if (circle.composite_mode) {
+    drawer._tempCompositeMode = circle.composite_mode;
+  }
   drawer.circle(circle.x, circle.y, circle.r, circle.mesh_fill);
+  if (circle.composite_mode) {
+    drawer._tempCompositeMode = void 0;
+  }
 };
 var drawOval = (drawer, oval) => {
   drawer.equip({
@@ -9442,7 +9963,13 @@ var drawPill = (drawer, pill) => {
     color: getColor(pill),
     layer: pill.layer
   });
+  if (pill.composite_mode) {
+    drawer._tempCompositeMode = pill.composite_mode;
+  }
   drawer.pill(pill.x, pill.y, pill.w, pill.h);
+  if (pill.composite_mode) {
+    drawer._tempCompositeMode = void 0;
+  }
 };
 var drawPolygon = (drawer, polygon) => {
   drawer.equip({
@@ -9497,7 +10024,11 @@ var orderedLayers = [
   "board",
   "bottom_silkscreen",
   "bottom",
+  "soldermask_bottom",
   "top",
+  "soldermask_top",
+  "soldermask_with_copper_bottom",
+  "soldermask_with_copper_top",
   "top_silkscreen",
   "inner1",
   "inner2",
@@ -9518,16 +10049,28 @@ var CanvasPrimitiveRenderer = ({
 }) => {
   const canvasRefs = useRef2({});
   const selectedLayer = useGlobalStore((s) => s.selected_layer);
+  const isShowingSolderMask = useGlobalStore((s) => s.is_showing_solder_mask);
   useEffect4(() => {
     if (!canvasRefs.current) return;
     if (Object.keys(canvasRefs.current).length === 0) return;
-    const drawer = new Drawer(canvasRefs.current);
+    const filteredCanvasRefs = Object.fromEntries(
+      Object.entries(canvasRefs.current).filter(([layer, canvas]) => {
+        if (!canvas) return false;
+        if (!isShowingSolderMask && layer.includes("soldermask")) {
+          return false;
+        }
+        return true;
+      })
+    );
+    if (Object.keys(filteredCanvasRefs).length === 0) return;
+    const drawer = new Drawer(filteredCanvasRefs);
     if (transform) drawer.transform = transform;
     drawer.clear();
     drawer.foregroundLayer = selectedLayer;
-    drawPrimitives(drawer, primitives);
+    const filteredPrimitives = isShowingSolderMask ? primitives : primitives.filter((p) => !p.layer?.includes("soldermask"));
+    drawPrimitives(drawer, filteredPrimitives);
     drawer.orderAndFadeLayers();
-  }, [primitives, transform, selectedLayer]);
+  }, [primitives, transform, selectedLayer, isShowingSolderMask]);
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -9551,13 +10094,22 @@ var CanvasPrimitiveRenderer = ({
             stringifyCoord: (x, y, z) => `${toMMSI(x, z)}, ${toMMSI(y, z)}`
           }
         ),
-        orderedLayers.map((l) => l.replace(/-/g, "")).map((layer, i) => /* @__PURE__ */ jsx3(
+        orderedLayers.filter((layer) => {
+          if (!isShowingSolderMask) {
+            return !layer.includes("soldermask");
+          }
+          return true;
+        }).map((l) => l.replace(/-/g, "")).map((layer, i) => /* @__PURE__ */ jsx3(
           "canvas",
           {
             className: `pcb-layer-${layer}`,
             ref: (el) => {
               canvasRefs.current ??= {};
-              canvasRefs.current[layer] = el;
+              if (el) {
+                canvasRefs.current[layer] = el;
+              } else {
+                delete canvasRefs.current[layer];
+              }
             },
             style: {
               position: "absolute",
@@ -13077,7 +13629,7 @@ import { css as css3 } from "@emotion/css";
 // package.json
 var package_default = {
   name: "@tscircuit/pcb-viewer",
-  version: "1.11.266",
+  version: "1.11.269",
   main: "dist/index.js",
   type: "module",
   repository: "tscircuit/pcb-viewer",
@@ -13130,7 +13682,7 @@ var package_default = {
     "@tscircuit/alphabet": "^0.0.3",
     "@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",
@@ -13345,6 +13897,7 @@ var ToolbarOverlay = ({ children, elements }) => {
     setIsShowingCopperPours,
     setIsShowingPcbGroups,
     setIsShowingGroupAnchorOffsets,
+    setIsShowingSolderMask,
     setPcbGroupViewMode,
     setHoveredErrorId
   } = useGlobalStore((s) => ({
@@ -13364,6 +13917,7 @@ var ToolbarOverlay = ({ children, elements }) => {
       is_showing_copper_pours: s.is_showing_copper_pours,
       is_showing_pcb_groups: s.is_showing_pcb_groups,
       is_showing_group_anchor_offsets: s.is_showing_group_anchor_offsets,
+      is_showing_solder_mask: s.is_showing_solder_mask,
       pcb_group_view_mode: s.pcb_group_view_mode
     },
     setEditMode: s.setEditMode,
@@ -13374,6 +13928,7 @@ var ToolbarOverlay = ({ children, elements }) => {
     setIsShowingCopperPours: s.setIsShowingCopperPours,
     setIsShowingPcbGroups: s.setIsShowingPcbGroups,
     setIsShowingGroupAnchorOffsets: s.setIsShowingGroupAnchorOffsets,
+    setIsShowingSolderMask: s.setIsShowingSolderMask,
     setPcbGroupViewMode: s.setPcbGroupViewMode,
     setHoveredErrorId: s.setHoveredErrorId
   }));
@@ -13863,6 +14418,16 @@ var ToolbarOverlay = ({ children, elements }) => {
                           }
                         }
                       ),
+                      /* @__PURE__ */ jsx16(
+                        CheckboxMenuItem,
+                        {
+                          label: "Show Solder Mask",
+                          checked: viewSettings.is_showing_solder_mask,
+                          onClick: () => {
+                            setIsShowingSolderMask(!viewSettings.is_showing_solder_mask);
+                          }
+                        }
+                      ),
                       /* @__PURE__ */ jsx16(
                         CheckboxMenuItem,
                         {