circuit-to-svg 0.0.311 → 0.0.313

package/dist/index.d.ts

@@ -72,6 +72,16 @@ interface Options$4 {
     showSolderMask?: boolean;
     grid?: PcbGridOptions;
     showAnchorOffsets?: boolean;
+    viewport?: {
+        minX: number;
+        minY: number;
+        maxX: number;
+        maxY: number;
+    };
+    viewportTarget?: {
+        pcb_panel_id?: string;
+        pcb_board_id?: string;
+    };
 }
 interface PcbContext {
     transform: Matrix;

package/dist/index.js

@@ -3877,10 +3877,10 @@ function createSvgObjectsFromSmtPad(pad, ctx) {
       maskPoints = points.map(([px, py]) => {
         const dx = px - centroidX;
         const dy = py - centroidY;
-        const distance5 = Math.sqrt(dx * dx + dy * dy);
-        if (distance5 === 0) return [px, py];
-        const normalizedDx = dx / distance5;
-        const normalizedDy = dy / distance5;
+        const distance6 = Math.sqrt(dx * dx + dy * dy);
+        if (distance6 === 0) return [px, py];
+        const normalizedDx = dx / distance6;
+        const normalizedDy = dy / distance6;
         return [
           px + normalizedDx * soldermaskMargin,
           py + normalizedDy * soldermaskMargin
@@ -4086,11 +4086,11 @@ function createAnchorOffsetIndicators(params) {
 function getTrimmedConnectorLine(x1, y1, x2, y2) {
   const dx = x2 - x1;
   const dy = y2 - y1;
-  const distance5 = Math.hypot(dx, dy);
+  const distance6 = Math.hypot(dx, dy);
   const totalTrim = CONNECTOR_GROUP_GAP_PX + CONNECTOR_COMPONENT_GAP_PX;
-  if (!(distance5 > totalTrim)) return { x1, y1, x2, y2 };
-  const ux = dx / distance5;
-  const uy = dy / distance5;
+  if (!(distance6 > totalTrim)) return { x1, y1, x2, y2 };
+  const ux = dx / distance6;
+  const uy = dy / distance6;
   return {
     x1: x1 + ux * CONNECTOR_GROUP_GAP_PX,
     y1: y1 + uy * CONNECTOR_GROUP_GAP_PX,
@@ -5047,9 +5047,9 @@ var findNearestPointInNet = (sourcePoint, netId, connectivity, circuitJson) => {
     if (pos) {
       const dx = sourcePoint.x - pos.x;
       const dy = sourcePoint.y - pos.y;
-      const distance5 = Math.sqrt(dx * dx + dy * dy);
-      if (distance5 > 0 && distance5 < minDistance) {
-        minDistance = distance5;
+      const distance6 = Math.sqrt(dx * dx + dy * dy);
+      if (distance6 > 0 && distance6 < minDistance) {
+        minDistance = distance6;
         nearestPoint = pos;
       }
     }
@@ -5270,12 +5270,86 @@ import {
   translate as translate5,
   toString as matrixToString8
 } from "transformation-matrix";
+var KEEPOUT_PATTERN_ID = "pcb-keepout-pattern";
+var KEEPOUT_PATTERN_SIZE = 20;
+var KEEPOUT_LINE_SPACING = 5;
+var KEEPOUT_BACKGROUND_COLOR = "rgba(255, 107, 107, 0.2)";
+function createKeepoutPatternLines(keepoutColor) {
+  const patternLines = [];
+  for (let i = -KEEPOUT_PATTERN_SIZE; i <= KEEPOUT_PATTERN_SIZE; i += KEEPOUT_LINE_SPACING) {
+    patternLines.push({
+      name: "line",
+      type: "element",
+      value: "",
+      attributes: {
+        x1: i.toString(),
+        y1: "0",
+        x2: (i + KEEPOUT_PATTERN_SIZE).toString(),
+        y2: KEEPOUT_PATTERN_SIZE.toString(),
+        stroke: keepoutColor,
+        "stroke-width": "1"
+      },
+      children: []
+    });
+  }
+  return patternLines;
+}
+function createKeepoutPatternDefs(keepoutColor) {
+  return {
+    name: "defs",
+    type: "element",
+    value: "",
+    attributes: {},
+    children: [
+      {
+        name: "pattern",
+        type: "element",
+        value: "",
+        attributes: {
+          id: KEEPOUT_PATTERN_ID,
+          width: KEEPOUT_PATTERN_SIZE.toString(),
+          height: KEEPOUT_PATTERN_SIZE.toString(),
+          patternUnits: "userSpaceOnUse"
+        },
+        children: createKeepoutPatternLines(keepoutColor)
+      }
+    ]
+  };
+}
+function createKeepoutBaseAttributes(keepoutId, layer, shapeClass, description) {
+  const attributes = {
+    class: `pcb-keepout ${shapeClass} pcb-keepout-background`,
+    "data-type": "pcb_keepout",
+    "data-pcb-layer": layer,
+    "data-pcb-keepout-id": keepoutId,
+    stroke: "none"
+  };
+  if (description) {
+    attributes["data-description"] = description;
+  }
+  return attributes;
+}
+function createKeepoutPatternAttributes(keepoutId, layer, shapeClass, description) {
+  const attributes = {
+    class: `pcb-keepout ${shapeClass} pcb-keepout-pattern`,
+    fill: `url(#${KEEPOUT_PATTERN_ID})`,
+    "data-type": "pcb_keepout",
+    "data-pcb-layer": layer,
+    "data-pcb-keepout-id": keepoutId,
+    stroke: "none"
+  };
+  if (description) {
+    attributes["data-description"] = description;
+  }
+  return attributes;
+}
 function createSvgObjectsFromPcbKeepout(keepout, ctx) {
   const { transform, layer: layerFilter, colorMap: colorMap2 } = ctx;
   if (layerFilter && !keepout.layers.includes(layerFilter)) {
     return [];
   }
   const svgObjects = [];
+  const keepoutColor = colorMap2.keepout;
   for (const layer of keepout.layers) {
     if (layerFilter && layer !== layerFilter) {
       continue;
@@ -5288,32 +5362,50 @@ function createSvgObjectsFromPcbKeepout(keepout, ctx) {
       ]);
       const scaledWidth = rectKeepout.width * Math.abs(transform.a);
       const scaledHeight = rectKeepout.height * Math.abs(transform.d);
-      const transformedStrokeWidth = 0.1 * Math.abs(transform.a);
-      const attributes = {
-        class: "pcb-keepout pcb-keepout-rect",
+      const baseTransform = matrixToString8(compose5(translate5(cx, cy)));
+      const backgroundAttributes = {
+        ...createKeepoutBaseAttributes(
+          rectKeepout.pcb_keepout_id,
+          layer,
+          "pcb-keepout-rect",
+          rectKeepout.description
+        ),
         x: (-scaledWidth / 2).toString(),
         y: (-scaledHeight / 2).toString(),
         width: scaledWidth.toString(),
         height: scaledHeight.toString(),
-        fill: "none",
-        stroke: colorMap2.keepout ?? "#FF6B6B",
-        "stroke-width": transformedStrokeWidth.toString(),
-        "stroke-dasharray": `${transformedStrokeWidth * 3} ${transformedStrokeWidth * 2}`,
-        transform: matrixToString8(compose5(translate5(cx, cy))),
-        "data-type": "pcb_keepout",
-        "data-pcb-layer": layer,
-        "data-pcb-keepout-id": rectKeepout.pcb_keepout_id
+        fill: KEEPOUT_BACKGROUND_COLOR,
+        transform: baseTransform
       };
-      if (rectKeepout.description) {
-        attributes["data-description"] = rectKeepout.description;
-      }
-      svgObjects.push({
-        name: "rect",
-        type: "element",
-        attributes,
-        children: [],
-        value: ""
-      });
+      const patternAttributes = {
+        ...createKeepoutPatternAttributes(
+          rectKeepout.pcb_keepout_id,
+          layer,
+          "pcb-keepout-rect",
+          rectKeepout.description
+        ),
+        x: (-scaledWidth / 2).toString(),
+        y: (-scaledHeight / 2).toString(),
+        width: scaledWidth.toString(),
+        height: scaledHeight.toString(),
+        transform: baseTransform
+      };
+      svgObjects.push(
+        {
+          name: "rect",
+          type: "element",
+          attributes: backgroundAttributes,
+          children: [],
+          value: ""
+        },
+        {
+          name: "rect",
+          type: "element",
+          attributes: patternAttributes,
+          children: [],
+          value: ""
+        }
+      );
     } else if (keepout.shape === "circle") {
       const circleKeepout = keepout;
       const [cx, cy] = applyToPoint33(transform, [
@@ -5321,30 +5413,45 @@ function createSvgObjectsFromPcbKeepout(keepout, ctx) {
         circleKeepout.center.y
       ]);
       const scaledRadius = circleKeepout.radius * Math.abs(transform.a);
-      const transformedStrokeWidth = 0.1 * Math.abs(transform.a);
-      const attributes = {
-        class: "pcb-keepout pcb-keepout-circle",
+      const backgroundAttributes = {
+        ...createKeepoutBaseAttributes(
+          circleKeepout.pcb_keepout_id,
+          layer,
+          "pcb-keepout-circle",
+          circleKeepout.description
+        ),
         cx: cx.toString(),
         cy: cy.toString(),
         r: scaledRadius.toString(),
-        fill: "none",
-        stroke: colorMap2.keepout ?? "#FF6B6B",
-        "stroke-width": transformedStrokeWidth.toString(),
-        "stroke-dasharray": `${transformedStrokeWidth * 3} ${transformedStrokeWidth * 2}`,
-        "data-type": "pcb_keepout",
-        "data-pcb-layer": layer,
-        "data-pcb-keepout-id": circleKeepout.pcb_keepout_id
+        fill: KEEPOUT_BACKGROUND_COLOR
       };
-      if (circleKeepout.description) {
-        attributes["data-description"] = circleKeepout.description;
-      }
-      svgObjects.push({
-        name: "circle",
-        type: "element",
-        attributes,
-        children: [],
-        value: ""
-      });
+      const patternAttributes = {
+        ...createKeepoutPatternAttributes(
+          circleKeepout.pcb_keepout_id,
+          layer,
+          "pcb-keepout-circle",
+          circleKeepout.description
+        ),
+        cx: cx.toString(),
+        cy: cy.toString(),
+        r: scaledRadius.toString()
+      };
+      svgObjects.push(
+        {
+          name: "circle",
+          type: "element",
+          attributes: backgroundAttributes,
+          children: [],
+          value: ""
+        },
+        {
+          name: "circle",
+          type: "element",
+          attributes: patternAttributes,
+          children: [],
+          value: ""
+        }
+      );
     }
   }
   return svgObjects;
@@ -5927,7 +6034,7 @@ function getSoftwareUsedString(circuitJson) {
 var package_default = {
   name: "circuit-to-svg",
   type: "module",
-  version: "0.0.310",
+  version: "0.0.312",
   description: "Convert Circuit JSON to SVG",
   main: "dist/index.js",
   files: [
@@ -6501,6 +6608,128 @@ function getPcbBoundsFromCircuitJson(circuitJson) {
   }
 }
 
+// lib/utils/get-viewport-bounds.ts
+import { distance as distance3 } from "circuit-json";
+var getViewportBounds = ({
+  circuitJson,
+  drawPaddingOutsideBoard,
+  baseBounds,
+  viewportOptions
+}) => {
+  let padding = drawPaddingOutsideBoard ? 1 : 0;
+  let boundsMinX = drawPaddingOutsideBoard || !baseBounds.hasBoardBounds ? baseBounds.minX : baseBounds.boardMinX;
+  let boundsMinY = drawPaddingOutsideBoard || !baseBounds.hasBoardBounds ? baseBounds.minY : baseBounds.boardMinY;
+  let boundsMaxX = drawPaddingOutsideBoard || !baseBounds.hasBoardBounds ? baseBounds.maxX : baseBounds.boardMaxX;
+  let boundsMaxY = drawPaddingOutsideBoard || !baseBounds.hasBoardBounds ? baseBounds.maxY : baseBounds.boardMaxY;
+  let hasPanelBounds = false;
+  let panelMinX = Number.POSITIVE_INFINITY;
+  let panelMinY = Number.POSITIVE_INFINITY;
+  let panelMaxX = Number.NEGATIVE_INFINITY;
+  let panelMaxY = Number.NEGATIVE_INFINITY;
+  const panelBoundsById = /* @__PURE__ */ new Map();
+  const boardBoundsById = /* @__PURE__ */ new Map();
+  for (const elm of circuitJson) {
+    if (elm.type === "pcb_panel") {
+      const panel = elm;
+      const panelBounds = rectBounds(panel.center, panel.width, panel.height);
+      if (!panelBounds) continue;
+      panelMinX = Math.min(panelMinX, panelBounds.minX);
+      panelMinY = Math.min(panelMinY, panelBounds.minY);
+      panelMaxX = Math.max(panelMaxX, panelBounds.maxX);
+      panelMaxY = Math.max(panelMaxY, panelBounds.maxY);
+      hasPanelBounds = true;
+      if (panel.pcb_panel_id) {
+        panelBoundsById.set(panel.pcb_panel_id, panelBounds);
+      }
+    } else if (elm.type === "pcb_board") {
+      const board = elm;
+      const outlineBounds = getOutlineBounds(board.outline);
+      const boardBounds = outlineBounds ?? rectBounds(board.center, board.width, board.height);
+      if (boardBounds && board.pcb_board_id) {
+        boardBoundsById.set(board.pcb_board_id, boardBounds);
+      }
+    }
+  }
+  if (viewportOptions?.viewport) {
+    const { minX, minY, maxX, maxY } = viewportOptions.viewport;
+    boundsMinX = minX;
+    boundsMinY = minY;
+    boundsMaxX = maxX;
+    boundsMaxY = maxY;
+    padding = 0;
+  } else if (viewportOptions?.viewportTarget?.pcb_panel_id) {
+    const panelBounds = panelBoundsById.get(
+      viewportOptions.viewportTarget.pcb_panel_id
+    );
+    if (!panelBounds) {
+      throw new Error(
+        `Viewport target panel '${viewportOptions.viewportTarget.pcb_panel_id}' not found`
+      );
+    }
+    boundsMinX = panelBounds.minX;
+    boundsMinY = panelBounds.minY;
+    boundsMaxX = panelBounds.maxX;
+    boundsMaxY = panelBounds.maxY;
+    padding = 0;
+  } else if (viewportOptions?.viewportTarget?.pcb_board_id) {
+    const boardBounds = boardBoundsById.get(
+      viewportOptions.viewportTarget.pcb_board_id
+    );
+    if (!boardBounds) {
+      throw new Error(
+        `Viewport target board '${viewportOptions.viewportTarget.pcb_board_id}' not found`
+      );
+    }
+    boundsMinX = boardBounds.minX;
+    boundsMinY = boardBounds.minY;
+    boundsMaxX = boardBounds.maxX;
+    boundsMaxY = boardBounds.maxY;
+    padding = 0;
+  } else if (hasPanelBounds) {
+    boundsMinX = panelMinX;
+    boundsMinY = panelMinY;
+    boundsMaxX = panelMaxX;
+    boundsMaxY = panelMaxY;
+  }
+  return { boundsMinX, boundsMinY, boundsMaxX, boundsMaxY, padding };
+};
+function rectBounds(center, width, height) {
+  if (!center || width === void 0 || height === void 0) return;
+  const cx = distance3.parse(center.x);
+  const cy = distance3.parse(center.y);
+  if (cx === void 0 || cy === void 0) return;
+  const numericWidth = distance3.parse(width);
+  const numericHeight = distance3.parse(height);
+  if (numericWidth === void 0 || numericHeight === void 0) return;
+  const halfW = numericWidth / 2;
+  const halfH = numericHeight / 2;
+  return {
+    minX: cx - halfW,
+    minY: cy - halfH,
+    maxX: cx + halfW,
+    maxY: cy + halfH
+  };
+}
+function getOutlineBounds(outline) {
+  if (!outline || outline.length < 3) return;
+  let minX = Number.POSITIVE_INFINITY;
+  let minY = Number.POSITIVE_INFINITY;
+  let maxX = Number.NEGATIVE_INFINITY;
+  let maxY = Number.NEGATIVE_INFINITY;
+  for (const pt of outline) {
+    const x = distance3.parse(pt.x);
+    const y = distance3.parse(pt.y);
+    if (x === void 0 || y === void 0) continue;
+    minX = Math.min(minX, x);
+    minY = Math.min(minY, y);
+    maxX = Math.max(maxX, x);
+    maxY = Math.max(maxY, y);
+  }
+  if (!Number.isFinite(minX) || !Number.isFinite(minY)) return;
+  if (!Number.isFinite(maxX) || !Number.isFinite(maxY)) return;
+  return { minX, minY, maxX, maxY };
+}
+
 // lib/pcb/convert-circuit-json-to-pcb-svg.ts
 function convertCircuitJsonToPcbSvg(circuitJson, options) {
   const drawPaddingOutsideBoard = options?.drawPaddingOutsideBoard ?? true;
@@ -6555,20 +6784,34 @@ function convertCircuitJsonToPcbSvg(circuitJson, options) {
     boardMaxY,
     hasBoardBounds
   } = getPcbBoundsFromCircuitJson(circuitJson);
-  const padding = drawPaddingOutsideBoard ? 1 : 0;
-  const boundsMinX = drawPaddingOutsideBoard || !hasBoardBounds ? minX : boardMinX;
-  const boundsMinY = drawPaddingOutsideBoard || !hasBoardBounds ? minY : boardMinY;
-  const boundsMaxX = drawPaddingOutsideBoard || !hasBoardBounds ? maxX : boardMaxX;
-  const boundsMaxY = drawPaddingOutsideBoard || !hasBoardBounds ? maxY : boardMaxY;
+  const { boundsMinX, boundsMinY, boundsMaxX, boundsMaxY, padding } = getViewportBounds({
+    circuitJson,
+    drawPaddingOutsideBoard,
+    baseBounds: {
+      minX,
+      minY,
+      maxX,
+      maxY,
+      boardMinX,
+      boardMinY,
+      boardMaxX,
+      boardMaxY,
+      hasBoardBounds
+    },
+    viewportOptions: {
+      viewport: options?.viewport,
+      viewportTarget: options?.viewportTarget
+    }
+  });
   const circuitWidth = boundsMaxX - boundsMinX + 2 * padding;
   const circuitHeight = boundsMaxY - boundsMinY + 2 * padding;
   let svgWidth = options?.width ?? 800;
   let svgHeight = options?.height ?? 600;
   if (options?.matchBoardAspectRatio) {
-    const boardWidth = boardMaxX - boardMinX;
-    const boardHeight = boardMaxY - boardMinY;
-    if (boardWidth > 0 && boardHeight > 0) {
-      const aspect = boardWidth / boardHeight;
+    const viewportWidth = boundsMaxX - boundsMinX;
+    const viewportHeight = boundsMaxY - boundsMinY;
+    if (viewportWidth > 0 && viewportHeight > 0) {
+      const aspect = viewportWidth / viewportHeight;
       if (options?.width && !options?.height) {
         svgHeight = options.width / aspect;
       } else if (options?.height && !options?.width) {
@@ -6649,6 +6892,14 @@ function convertCircuitJsonToPcbSvg(circuitJson, options) {
   if (gridObjects.defs) {
     children.push(gridObjects.defs);
   }
+  const hasKeepouts = circuitJson.some((elm) => elm.type === "pcb_keepout");
+  if (hasKeepouts) {
+    children.push(
+      createKeepoutPatternDefs(
+        colorMap2.keepout ?? DEFAULT_PCB_COLOR_MAP.keepout
+      )
+    );
+  }
   children.push({
     name: "rect",
     type: "element",
@@ -13506,7 +13757,7 @@ function formatNumber2(value) {
 }
 
 // lib/pcb/convert-circuit-json-to-solder-paste-mask.ts
-import { distance as distance4 } from "circuit-json";
+import { distance as distance5 } from "circuit-json";
 import { stringify as stringify7 } from "svgson";
 import {
   applyToPoint as applyToPoint77,
@@ -13624,8 +13875,8 @@ function convertCircuitJsonToSolderPasteMask(circuitJson, options) {
       }
     } else if (item.type === "pcb_panel") {
       const panel = item;
-      const width = distance4.parse(panel.width);
-      const height = distance4.parse(panel.height);
+      const width = distance5.parse(panel.width);
+      const height = distance5.parse(panel.height);
       if (width !== void 0 && height !== void 0) {
         const center = panel.center ?? { x: width / 2, y: height / 2 };
         updateBounds(center, width, height);