circuit-to-svg 0.0.151 → 0.0.153

package/dist/index.js

@@ -2527,197 +2527,27 @@ function drawSchematicLabeledPoints(params) {
   };
 }
 
-// lib/sch/get-schematic-bounds-from-circuit-json.ts
-function getSchematicBoundsFromCircuitJson(soup, padding = 0.5) {
-  let minX = Number.POSITIVE_INFINITY;
-  let minY = Number.POSITIVE_INFINITY;
-  let maxX = Number.NEGATIVE_INFINITY;
-  let maxY = Number.NEGATIVE_INFINITY;
-  const portSize = 0.2;
-  for (const item of soup) {
-    if (item.type === "schematic_component") {
-      updateBounds(item.center, item.size, 0);
-    } else if (item.type === "schematic_port") {
-      updateBounds(item.center, { width: portSize, height: portSize }, 0);
-    } else if (item.type === "schematic_debug_object") {
-      if (item.shape === "rect") {
-        updateBounds(item.center, item.size, 0);
-      } else if (item.shape === "line") {
-        updateBounds(item.start, { width: 0.1, height: 0.1 }, 0);
-        updateBounds(item.end, { width: 0.1, height: 0.1 }, 0);
-      }
-    } else if (item.type === "schematic_net_label") {
-      updateBounds(item.center, { width: 1, height: 1 }, 0);
-    } else if (item.type === "schematic_trace") {
-      for (const edge of item.edges) {
-        updateBounds(edge.from, { width: 0.1, height: 0.1 }, 0);
-        updateBounds(edge.to, { width: 0.1, height: 0.1 }, 0);
-      }
-    } else if (item.type === "schematic_text") {
-      const textType = "reference_designator";
-      const fontSize = getSchMmFontSize(textType, item.font_size) ?? 0.18;
-      const text = item.text ?? "";
-      const width = text.length * fontSize;
-      const height = fontSize;
-      updateBounds(item.position, { width, height }, item.rotation ?? 0);
-    } else if (item.type === "schematic_voltage_probe") {
-      updateBounds(item.position, { width: 0.2, height: 0.4 }, 0);
-    } else if (item.type === "schematic_box") {
-      updateBounds(
-        {
-          x: item.x + item.width / 2,
-          y: item.y + item.height / 2
-        },
-        { width: item.width, height: item.height },
-        0
-      );
-    }
-  }
-  minX -= padding;
-  minY -= padding;
-  maxX += padding;
-  maxY += padding;
-  return { minX, minY, maxX, maxY };
-  function updateBounds(center, size, rotation) {
-    const corners = [
-      { x: -size.width / 2, y: -size.height / 2 },
-      { x: size.width / 2, y: -size.height / 2 },
-      { x: size.width / 2, y: size.height / 2 },
-      { x: -size.width / 2, y: size.height / 2 }
-    ];
-    for (const corner of corners) {
-      const rotatedX = corner.x * Math.cos(rotation) - corner.y * Math.sin(rotation) + center.x;
-      const rotatedY = corner.x * Math.sin(rotation) + corner.y * Math.cos(rotation) + center.y;
-      minX = Math.min(minX, rotatedX);
-      minY = Math.min(minY, rotatedY);
-      maxX = Math.max(maxX, rotatedX);
-      maxY = Math.max(maxY, rotatedY);
-    }
-  }
-}
-
-// lib/sch/svg-object-fns/create-svg-objects-from-sch-component-with-symbol.ts
-import { su as su4 } from "@tscircuit/circuit-json-util";
-import { symbols } from "schematic-symbols";
-import "svgson";
-import {
-  applyToPoint as applyToPoint26,
-  compose as compose7
-} from "transformation-matrix";
-
-// lib/utils/get-sch-stroke-size.ts
-var getSchStrokeSize = (transform) => {
-  return Math.abs(transform.a) * 0.02;
-};
-
-// lib/utils/match-sch-ports-with-symbol-ports.ts
-var getAngularDifference = (angle1, angle2) => {
-  const a1 = angle1 < 0 ? angle1 + 2 * Math.PI : angle1;
-  const a2 = angle2 < 0 ? angle2 + 2 * Math.PI : angle2;
-  let diff = Math.abs(a1 - a2);
-  if (diff > Math.PI) {
-    diff = 2 * Math.PI - diff;
-  }
-  return diff;
-};
-var matchSchPortsToSymbolPorts = ({
-  schPorts,
-  symbol,
-  schComponent
-}) => {
-  const schPortAngles = schPorts.map((port) => {
-    const dx = port.center.x - schComponent.center.x;
-    const dy = port.center.y - schComponent.center.y;
-    return {
-      port,
-      angle: Math.atan2(dy, dx)
-    };
-  });
-  const symbolPortAngles = symbol.ports.map((port) => {
-    const dx = port.x - symbol.center.x;
-    const dy = port.y - symbol.center.y;
-    return {
-      port,
-      angle: Math.atan2(dy, dx)
-    };
-  });
-  schPortAngles.sort((a, b) => a.angle - b.angle);
-  symbolPortAngles.sort((a, b) => a.angle - b.angle);
-  const matches = [];
-  const usedSymbolPorts = /* @__PURE__ */ new Set();
-  for (const schPortAngle of schPortAngles) {
-    let bestMatch = null;
-    for (const symbolPortAngle of symbolPortAngles) {
-      if (usedSymbolPorts.has(symbolPortAngle.port)) continue;
-      const angleDiff = getAngularDifference(
-        schPortAngle.angle,
-        symbolPortAngle.angle
-      );
-      if (bestMatch === null || angleDiff < bestMatch.angleDiff) {
-        bestMatch = {
-          symbolPort: symbolPortAngle.port,
-          angleDiff
-        };
-      }
-    }
-    if (bestMatch && bestMatch.angleDiff < Math.PI / 4) {
-      matches.push({
-        schPort: schPortAngle.port,
-        symbolPort: bestMatch.symbolPort
-      });
-      usedSymbolPorts.add(bestMatch.symbolPort);
-    }
+// lib/utils/get-unit-vector-from-outside-to-edge.ts
+var getUnitVectorFromOutsideToEdge = (side) => {
+  switch (side) {
+    case "top":
+      return { x: 0, y: -1 };
+    case "bottom":
+      return { x: 0, y: 1 };
+    case "left":
+      return { x: 1, y: 0 };
+    case "right":
+      return { x: -1, y: 0 };
   }
-  return matches;
-};
-
-// lib/utils/point-pairs-to-matrix.ts
-import { compose as compose6, scale as scale4, translate as translate6 } from "transformation-matrix";
-function pointPairsToMatrix(a1, a2, b1, b2) {
-  const tx = a2.x - a1.x;
-  const ty = a2.y - a1.y;
-  const originalDistance = Math.sqrt((b1.x - a1.x) ** 2 + (b1.y - a1.y) ** 2);
-  const transformedDistance = Math.sqrt((b2.x - a2.x) ** 2 + (b2.y - a2.y) ** 2);
-  const a = transformedDistance / originalDistance;
-  const translateMatrix = translate6(tx, ty);
-  const scaleMatrix = scale4(a, a);
-  return compose6(translateMatrix, scaleMatrix);
-}
-
-// lib/sch/svg-object-fns/create-svg-error-text.ts
-import { applyToPoint as applyToPoint25 } from "transformation-matrix";
-var createSvgSchErrorText = ({
-  text,
-  realCenter,
-  realToScreenTransform
-}) => {
-  const screenCenter = applyToPoint25(realToScreenTransform, realCenter);
-  return {
-    type: "element",
-    name: "text",
-    value: "",
-    attributes: {
-      x: screenCenter.x.toString(),
-      y: screenCenter.y.toString(),
-      fill: "red",
-      "text-anchor": "middle",
-      "dominant-baseline": "middle",
-      "font-family": "sans-serif",
-      "font-size": `${getSchScreenFontSize(realToScreenTransform, "error")}px`
-    },
-    children: [
-      {
-        type: "text",
-        value: text,
-        name: "",
-        attributes: {},
-        children: []
-      }
-    ]
-  };
+  throw new Error(`Invalid side: ${side}`);
 };
 
-// lib/sch/svg-object-fns/create-svg-objects-from-sch-component-with-symbol.ts
+// lib/utils/net-label-utils.ts
+import "transformation-matrix";
+import "schematic-symbols";
+var ARROW_POINT_WIDTH_FSR = 0.3;
+var END_PADDING_FSR = 0.3;
+var END_PADDING_EXTRA_PER_CHARACTER_FSR = 0.06;
 var ninePointAnchorToTextAnchor = {
   top_left: "start",
   top_right: "end",
@@ -2729,922 +2559,36 @@ var ninePointAnchorToTextAnchor = {
   middle_top: "middle",
   middle_bottom: "middle"
 };
-var createSvgObjectsFromSchematicComponentWithSymbol = ({
-  component: schComponent,
-  transform: realToScreenTransform,
-  circuitJson,
-  colorMap: colorMap2
-}) => {
-  const svgObjects = [];
-  const symbol = symbols[schComponent.symbol_name];
-  if (!symbol) {
-    return [
-      createSvgSchErrorText({
-        text: `Symbol not found: ${schComponent.symbol_name}`,
-        realCenter: schComponent.center,
-        realToScreenTransform
-      })
-    ];
-  }
-  const schPorts = su4(circuitJson).schematic_port.list({
-    schematic_component_id: schComponent.schematic_component_id
-  });
-  const srcComponent = su4(circuitJson).source_component.get(
-    schComponent.source_component_id
+var ninePointAnchorToDominantBaseline = {
+  top_left: "hanging",
+  top_right: "hanging",
+  bottom_left: "ideographic",
+  bottom_right: "ideographic",
+  center: "middle",
+  middle_left: "middle",
+  middle_right: "middle",
+  middle_top: "hanging",
+  middle_bottom: "ideographic"
+};
+function getPathRotation(anchorSide) {
+  const rotationMap = {
+    left: 180,
+    top: 90,
+    bottom: -90,
+    right: 0
+  };
+  return rotationMap[anchorSide] ?? 0;
+}
+function calculateAnchorPosition(schNetLabel, fontSizeMm, textWidthFSR) {
+  const fullWidthFsr = textWidthFSR + ARROW_POINT_WIDTH_FSR * 2 + END_PADDING_EXTRA_PER_CHARACTER_FSR * schNetLabel.text.length + END_PADDING_FSR;
+  const realTextGrowthVec = getUnitVectorFromOutsideToEdge(
+    schNetLabel.anchor_side
   );
-  const schPortsWithSymbolPorts = matchSchPortsToSymbolPorts({
-    schPorts,
-    symbol,
-    schComponent
-  });
-  if (!schPortsWithSymbolPorts[0]) {
-    return [
-      createSvgSchErrorText({
-        text: `Could not match ports for symbol ${schComponent.symbol_name}`,
-        realCenter: schComponent.center,
-        realToScreenTransform
-      })
-    ];
-  }
-  const transformFromSymbolToReal = pointPairsToMatrix(
-    schPortsWithSymbolPorts[1]?.symbolPort ?? symbol.center,
-    schPortsWithSymbolPorts[1]?.schPort.center ?? schComponent.center,
-    schPortsWithSymbolPorts[0].symbolPort,
-    schPortsWithSymbolPorts[0].schPort.center
-  );
-  const paths = symbol.primitives.filter((p) => p.type === "path");
-  const texts = symbol.primitives.filter((p) => p.type === "text");
-  const circles = symbol.primitives.filter((p) => p.type === "circle");
-  const boxes = symbol.primitives.filter((p) => p.type === "box");
-  const bounds = {
-    minX: Math.min(...paths.flatMap((p) => p.points.map((pt) => pt.x))),
-    maxX: Math.max(...paths.flatMap((p) => p.points.map((pt) => pt.x))),
-    minY: Math.min(...paths.flatMap((p) => p.points.map((pt) => pt.y))),
-    maxY: Math.max(...paths.flatMap((p) => p.points.map((pt) => pt.y)))
+  return schNetLabel.anchor_position ?? {
+    x: schNetLabel.center.x - realTextGrowthVec.x * fullWidthFsr * fontSizeMm / 2,
+    y: schNetLabel.center.y - realTextGrowthVec.y * fullWidthFsr * fontSizeMm / 2
   };
-  const [screenMinX, screenMinY] = applyToPoint26(
-    compose7(realToScreenTransform, transformFromSymbolToReal),
-    [bounds.minX, bounds.minY]
-  );
-  const [screenMaxX, screenMaxY] = applyToPoint26(
-    compose7(realToScreenTransform, transformFromSymbolToReal),
-    [bounds.maxX, bounds.maxY]
-  );
-  const rectHeight = Math.abs(screenMaxY - screenMinY);
-  const rectY = Math.min(screenMinY, screenMaxY);
-  const rectWidth = Math.abs(screenMaxX - screenMinX);
-  const rectX = Math.min(screenMinX, screenMaxX);
-  svgObjects.push({
-    name: "rect",
-    type: "element",
-    value: "",
-    attributes: {
-      class: "component-overlay",
-      x: rectX.toString(),
-      y: rectY.toString(),
-      width: rectWidth.toString(),
-      height: rectHeight.toString(),
-      fill: "transparent"
-    },
-    children: []
-  });
-  for (const path of paths) {
-    const { points, color, closed, fill } = path;
-    svgObjects.push({
-      type: "element",
-      name: "path",
-      attributes: {
-        d: points.map((p, i) => {
-          const [x, y] = applyToPoint26(
-            compose7(realToScreenTransform, transformFromSymbolToReal),
-            [p.x, p.y]
-          );
-          return `${i === 0 ? "M" : "L"} ${x} ${y}`;
-        }).join(" ") + (closed ? " Z" : ""),
-        stroke: colorMap2.schematic.component_outline,
-        fill: "none",
-        "stroke-width": `${getSchStrokeSize(realToScreenTransform)}px`
-      },
-      value: "",
-      children: []
-    });
-  }
-  for (const text of texts) {
-    const screenTextPos = applyToPoint26(
-      compose7(realToScreenTransform, transformFromSymbolToReal),
-      text
-    );
-    let textValue = "";
-    if (text.text === "{REF}") {
-      textValue = srcComponent?.name ?? "";
-    } else if (text.text === "{VAL}") {
-      textValue = schComponent.symbol_display_value ?? "";
-    }
-    const symbolHeight = Math.abs(bounds.maxY - bounds.minY);
-    const offsetFactor = 0.1;
-    const baseOffset = symbolHeight * offsetFactor;
-    const transformScale = Math.abs(transformFromSymbolToReal.a);
-    let verticalOffset = 0;
-    if (text.anchor.includes("bottom")) {
-      verticalOffset = baseOffset * transformScale;
-    } else if (text.anchor.includes("top")) {
-      verticalOffset = -baseOffset * transformScale;
-    }
-    const dominantBaseline = text.anchor.includes("bottom") ? "auto" : text.anchor.includes("top") ? "hanging" : "middle";
-    svgObjects.push({
-      name: "text",
-      type: "element",
-      attributes: {
-        x: screenTextPos.x.toString(),
-        y: (screenTextPos.y + verticalOffset).toString(),
-        fill: colorMap2.schematic.label_local,
-        "font-family": "sans-serif",
-        "text-anchor": ninePointAnchorToTextAnchor[text.anchor],
-        "dominant-baseline": dominantBaseline,
-        "font-size": `${getSchScreenFontSize(realToScreenTransform, "reference_designator")}px`
-      },
-      value: "",
-      children: [
-        {
-          type: "text",
-          value: textValue,
-          name: "",
-          attributes: {},
-          children: []
-        }
-      ]
-    });
-  }
-  for (const box of boxes) {
-    const screenBoxPos = applyToPoint26(
-      compose7(realToScreenTransform, transformFromSymbolToReal),
-      box
-    );
-    const symbolToScreenScale = compose7(
-      realToScreenTransform,
-      transformFromSymbolToReal
-    ).a;
-    svgObjects.push({
-      name: "rect",
-      type: "element",
-      attributes: {
-        x: screenBoxPos.x.toString(),
-        y: screenBoxPos.y.toString(),
-        width: (box.width * symbolToScreenScale).toString(),
-        height: (box.height * symbolToScreenScale).toString(),
-        fill: "red"
-      },
-      value: "",
-      children: []
-    });
-  }
-  for (const port of symbol.ports) {
-    const screenPortPos = applyToPoint26(
-      compose7(realToScreenTransform, transformFromSymbolToReal),
-      port
-    );
-    svgObjects.push({
-      type: "element",
-      name: "circle",
-      attributes: {
-        cx: screenPortPos.x.toString(),
-        cy: screenPortPos.y.toString(),
-        r: `${Math.abs(realToScreenTransform.a) * 0.02}px`,
-        "stroke-width": `${getSchStrokeSize(realToScreenTransform)}px`,
-        fill: "none",
-        stroke: colorMap2.schematic.component_outline
-      },
-      value: "",
-      children: []
-    });
-  }
-  for (const circle of circles) {
-    const screenCirclePos = applyToPoint26(
-      compose7(realToScreenTransform, transformFromSymbolToReal),
-      circle
-    );
-    const screenRadius = Math.abs(circle.radius * realToScreenTransform.a);
-    svgObjects.push({
-      type: "element",
-      name: "circle",
-      attributes: {
-        cx: screenCirclePos.x.toString(),
-        cy: screenCirclePos.y.toString(),
-        r: `${screenRadius}px`,
-        "stroke-width": `${getSchStrokeSize(realToScreenTransform)}px`,
-        fill: "none",
-        stroke: colorMap2.schematic.component_outline
-      },
-      value: "",
-      children: []
-    });
-  }
-  return svgObjects;
-};
-
-// lib/sch/svg-object-fns/create-svg-objects-from-sch-component-with-box.ts
-import { su as su7 } from "@tscircuit/circuit-json-util";
-import "schematic-symbols";
-import "svgson";
-import { applyToPoint as applyToPoint32 } from "transformation-matrix";
-
-// lib/sch/svg-object-fns/create-svg-objects-from-sch-port-on-box.ts
-import "transformation-matrix";
-import "@tscircuit/circuit-json-util";
-
-// lib/sch/svg-object-fns/create-svg-objects-for-sch-port-box-line.ts
-import { applyToPoint as applyToPoint27 } from "transformation-matrix";
-import { su as su5 } from "@tscircuit/circuit-json-util";
-var PIN_CIRCLE_RADIUS_MM = 0.02;
-var createSvgObjectsForSchPortBoxLine = ({
-  schPort,
-  schComponent,
-  transform,
-  circuitJson
-}) => {
-  const svgObjects = [];
-  const srcPort = su5(circuitJson).source_port.get(schPort.source_port_id);
-  const realEdgePos = {
-    x: schPort.center.x,
-    y: schPort.center.y
-  };
-  const realPinLineLength = schPort.distance_from_component_edge ?? 0.4;
-  switch (schPort.side_of_component) {
-    case "left":
-      realEdgePos.x += realPinLineLength;
-      break;
-    case "right":
-      realEdgePos.x -= realPinLineLength;
-      break;
-    case "top":
-      realEdgePos.y -= realPinLineLength;
-      break;
-    case "bottom":
-      realEdgePos.y += realPinLineLength;
-      break;
-  }
-  const screenSchPortPos = applyToPoint27(transform, schPort.center);
-  const screenRealEdgePos = applyToPoint27(transform, realEdgePos);
-  const realLineEnd = { ...schPort.center };
-  switch (schPort.side_of_component) {
-    case "left":
-      realLineEnd.x += PIN_CIRCLE_RADIUS_MM;
-      break;
-    case "right":
-      realLineEnd.x -= PIN_CIRCLE_RADIUS_MM;
-      break;
-    case "top":
-      realLineEnd.y -= PIN_CIRCLE_RADIUS_MM;
-      break;
-    case "bottom":
-      realLineEnd.y += PIN_CIRCLE_RADIUS_MM;
-      break;
-  }
-  const screenLineEnd = applyToPoint27(transform, realLineEnd);
-  svgObjects.push({
-    name: "line",
-    type: "element",
-    attributes: {
-      class: "component-pin",
-      x1: screenLineEnd.x.toString(),
-      y1: screenLineEnd.y.toString(),
-      x2: screenRealEdgePos.x.toString(),
-      y2: screenRealEdgePos.y.toString(),
-      "stroke-width": `${getSchStrokeSize(transform)}px`
-    },
-    value: "",
-    children: []
-  });
-  svgObjects.push({
-    name: "circle",
-    type: "element",
-    attributes: {
-      class: "component-pin",
-      cx: screenSchPortPos.x.toString(),
-      cy: screenSchPortPos.y.toString(),
-      r: (Math.abs(transform.a) * PIN_CIRCLE_RADIUS_MM).toString(),
-      "stroke-width": `${getSchStrokeSize(transform)}px`
-    },
-    value: "",
-    children: []
-  });
-  return svgObjects;
-};
-
-// lib/utils/get-unit-vector-from-outside-to-edge.ts
-var getUnitVectorFromOutsideToEdge = (side) => {
-  switch (side) {
-    case "top":
-      return { x: 0, y: -1 };
-    case "bottom":
-      return { x: 0, y: 1 };
-    case "left":
-      return { x: 1, y: 0 };
-    case "right":
-      return { x: -1, y: 0 };
-  }
-  throw new Error(`Invalid side: ${side}`);
-};
-
-// lib/sch/svg-object-fns/create-svg-objects-for-sch-port-pin-number-text.ts
-import { applyToPoint as applyToPoint28 } from "transformation-matrix";
-var createSvgObjectsForSchPortPinNumberText = (params) => {
-  const svgObjects = [];
-  const { schPort, schComponent, transform, circuitJson } = params;
-  const realPinNumberPos = {
-    x: schPort.center.x,
-    y: schPort.center.y
-  };
-  if (!schPort.side_of_component) return [];
-  const vecToEdge = getUnitVectorFromOutsideToEdge(schPort.side_of_component);
-  const realPinEdgeDistance = schPort.distance_from_component_edge ?? 0.4;
-  realPinNumberPos.x += vecToEdge.x * realPinEdgeDistance / 2;
-  realPinNumberPos.y += vecToEdge.y * realPinEdgeDistance / 2;
-  if (schPort.side_of_component === "top" || schPort.side_of_component === "bottom") {
-    realPinNumberPos.x -= 0.02;
-  } else {
-    realPinNumberPos.y += 0.02;
-  }
-  const screenPinNumberTextPos = applyToPoint28(transform, realPinNumberPos);
-  svgObjects.push({
-    name: "text",
-    type: "element",
-    attributes: {
-      class: "pin-number",
-      x: screenPinNumberTextPos.x.toString(),
-      y: screenPinNumberTextPos.y.toString(),
-      style: "font-family: sans-serif;",
-      fill: colorMap.schematic.pin_number,
-      "text-anchor": "middle",
-      "dominant-baseline": "auto",
-      "font-size": `${getSchScreenFontSize(transform, "pin_number")}px`,
-      transform: schPort.side_of_component === "top" || schPort.side_of_component === "bottom" ? `rotate(-90 ${screenPinNumberTextPos.x} ${screenPinNumberTextPos.y})` : ""
-    },
-    children: [
-      {
-        type: "text",
-        value: schPort.pin_number?.toString() || "",
-        name: "",
-        attributes: {},
-        children: []
-      }
-    ],
-    value: ""
-  });
-  return svgObjects;
-};
-
-// lib/sch/svg-object-fns/create-svg-objects-for-sch-port-pin-label.ts
-import { applyToPoint as applyToPoint29 } from "transformation-matrix";
-var LABEL_DIST_FROM_EDGE_MM = 0.1;
-var createSvgObjectsForSchPortPinLabel = (params) => {
-  const svgObjects = [];
-  const { schPort, schComponent, transform, circuitJson } = params;
-  const realPinNumberPos = {
-    x: schPort.center.x,
-    y: schPort.center.y
-  };
-  if (!schPort.side_of_component) return [];
-  const vecToEdge = getUnitVectorFromOutsideToEdge(schPort.side_of_component);
-  const realPinEdgeDistance = schPort.distance_from_component_edge ?? 0.4;
-  realPinNumberPos.x += vecToEdge.x * (realPinEdgeDistance + LABEL_DIST_FROM_EDGE_MM);
-  realPinNumberPos.y += vecToEdge.y * (realPinEdgeDistance + LABEL_DIST_FROM_EDGE_MM);
-  const screenPinNumberTextPos = applyToPoint29(transform, realPinNumberPos);
-  const label = schPort.display_pin_label ?? schComponent.port_labels?.[`${schPort.pin_number}`];
-  if (!label) return [];
-  svgObjects.push({
-    name: "text",
-    type: "element",
-    attributes: {
-      class: "pin-number",
-      x: screenPinNumberTextPos.x.toString(),
-      y: screenPinNumberTextPos.y.toString(),
-      style: "font-family: sans-serif;",
-      fill: colorMap.schematic.pin_number,
-      "text-anchor": schPort.side_of_component === "left" || schPort.side_of_component === "bottom" ? "start" : "end",
-      "dominant-baseline": "middle",
-      "font-size": `${getSchScreenFontSize(transform, "pin_number")}px`,
-      transform: schPort.side_of_component === "top" || schPort.side_of_component === "bottom" ? `rotate(-90 ${screenPinNumberTextPos.x} ${screenPinNumberTextPos.y})` : ""
-    },
-    children: [
-      {
-        type: "text",
-        value: label || "",
-        name: "",
-        attributes: {},
-        children: []
-      }
-    ],
-    value: ""
-  });
-  return svgObjects;
-};
-
-// lib/sch/svg-object-fns/create-svg-objects-from-sch-port-on-box.ts
-var createSvgObjectsFromSchPortOnBox = (params) => {
-  const svgObjects = [];
-  const { schPort, schComponent, transform, circuitJson } = params;
-  svgObjects.push(...createSvgObjectsForSchPortBoxLine(params));
-  svgObjects.push(...createSvgObjectsForSchPortPinNumberText(params));
-  svgObjects.push(...createSvgObjectsForSchPortPinLabel(params));
-  return svgObjects;
-};
-
-// lib/sch/svg-object-fns/create-svg-objects-for-sch-text.ts
-import { applyToPoint as applyToPoint31 } from "transformation-matrix";
-var createSvgSchText = ({
-  elm,
-  transform,
-  colorMap: colorMap2
-}) => {
-  const center = applyToPoint31(transform, elm.position);
-  const textAnchorMap = {
-    center: "middle",
-    center_right: "end",
-    bottom_left: "start",
-    bottom_center: "middle",
-    bottom_right: "end",
-    left: "start",
-    right: "end",
-    top: "middle",
-    bottom: "middle",
-    top_left: "start",
-    top_center: "middle",
-    top_right: "end",
-    center_left: "start"
-  };
-  const dominantBaselineMap = {
-    center: "middle",
-    center_right: "middle",
-    bottom_left: "ideographic",
-    bottom_center: "ideographic",
-    bottom_right: "ideographic",
-    left: "middle",
-    right: "middle",
-    top: "hanging",
-    bottom: "ideographic",
-    top_left: "hanging",
-    top_center: "hanging",
-    top_right: "hanging",
-    center_left: "middle"
-  };
-  return {
-    type: "element",
-    name: "text",
-    value: "",
-    attributes: {
-      x: center.x.toString(),
-      y: center.y.toString(),
-      fill: elm.color ?? colorMap2.schematic.sheet_label,
-      "text-anchor": textAnchorMap[elm.anchor],
-      "dominant-baseline": dominantBaselineMap[elm.anchor],
-      "font-family": "sans-serif",
-      "font-size": `${getSchScreenFontSize(transform, "reference_designator", elm.font_size)}px`,
-      transform: `rotate(${elm.rotation}, ${center.x}, ${center.y})`
-    },
-    children: [
-      {
-        type: "text",
-        value: elm.text,
-        name: elm.schematic_text_id,
-        attributes: {},
-        children: []
-      }
-    ]
-  };
-};
-
-// lib/sch/svg-object-fns/create-svg-objects-from-sch-component-with-box.ts
-var createSvgObjectsFromSchematicComponentWithBox = ({
-  component: schComponent,
-  transform,
-  circuitJson,
-  colorMap: colorMap2
-}) => {
-  const svgObjects = [];
-  const componentScreenTopLeft = applyToPoint32(transform, {
-    x: schComponent.center.x - schComponent.size.width / 2,
-    y: schComponent.center.y + schComponent.size.height / 2
-  });
-  const componentScreenBottomRight = applyToPoint32(transform, {
-    x: schComponent.center.x + schComponent.size.width / 2,
-    y: schComponent.center.y - schComponent.size.height / 2
-  });
-  const componentScreenWidth = componentScreenBottomRight.x - componentScreenTopLeft.x;
-  const componentScreenHeight = componentScreenBottomRight.y - componentScreenTopLeft.y;
-  svgObjects.push({
-    name: "rect",
-    type: "element",
-    value: "",
-    attributes: {
-      class: "component chip",
-      x: componentScreenTopLeft.x.toString(),
-      y: componentScreenTopLeft.y.toString(),
-      width: componentScreenWidth.toString(),
-      height: componentScreenHeight.toString(),
-      "stroke-width": `${getSchStrokeSize(transform)}px`,
-      fill: colorMap2.schematic.component_body,
-      stroke: colorMap2.schematic.component_outline
-    },
-    children: []
-  });
-  svgObjects.push({
-    name: "rect",
-    type: "element",
-    value: "",
-    attributes: {
-      class: "component-overlay",
-      x: componentScreenTopLeft.x.toString(),
-      y: componentScreenTopLeft.y.toString(),
-      width: componentScreenWidth.toString(),
-      height: componentScreenHeight.toString(),
-      fill: "transparent"
-    },
-    children: []
-  });
-  const schTexts = su7(circuitJson).schematic_text.list();
-  for (const schText of schTexts) {
-    if (schText.schematic_component_id === schComponent.schematic_component_id) {
-      svgObjects.push(
-        createSvgSchText({
-          elm: schText,
-          transform,
-          colorMap: colorMap2
-        })
-      );
-    }
-  }
-  const schematicPorts = su7(circuitJson).schematic_port.list({
-    schematic_component_id: schComponent.schematic_component_id
-  });
-  for (const schPort of schematicPorts) {
-    svgObjects.push(
-      ...createSvgObjectsFromSchPortOnBox({
-        schPort,
-        schComponent,
-        transform,
-        circuitJson
-      })
-    );
-  }
-  return svgObjects;
-};
-
-// lib/sch/svg-object-fns/create-svg-objects-from-sch-component.ts
-function createSvgObjectsFromSchematicComponent(params) {
-  const { component } = params;
-  const innerElements = component.symbol_name ? createSvgObjectsFromSchematicComponentWithSymbol(params) : createSvgObjectsFromSchematicComponentWithBox(params);
-  return [
-    {
-      type: "element",
-      name: "g",
-      attributes: {
-        "data-circuit-json-type": "schematic_component",
-        "data-schematic-component-id": component.schematic_component_id
-      },
-      children: innerElements,
-      value: ""
-    }
-  ];
-}
-
-// lib/sch/svg-object-fns/create-svg-objects-from-sch-voltage-probe.ts
-import { applyToPoint as applyToPoint33 } from "transformation-matrix";
-function createSvgObjectsFromSchVoltageProbe({
-  probe,
-  transform,
-  colorMap: colorMap2
-}) {
-  const [screenX, screenY] = applyToPoint33(transform, [
-    probe.position.x,
-    probe.position.y
-  ]);
-  const arrowLength = Math.abs(transform.a) * 0.6;
-  const arrowWidth = Math.abs(transform.a) * 0.28;
-  const baseX = screenX + arrowLength * Math.cos(-50 * Math.PI / 180);
-  const baseY = screenY + arrowLength * Math.sin(-50 * Math.PI / 180);
-  const tipX = screenX;
-  const tipY = screenY;
-  const arrowPath = [
-    `M ${baseX},${baseY}`,
-    `L ${tipX},${tipY}`,
-    `M ${tipX},${tipY}`,
-    `L ${tipX - arrowWidth * Math.cos((-50 + 150) * Math.PI / 180)},${tipY - arrowWidth * Math.sin((-50 + 150) * Math.PI / 180)}`,
-    `L ${tipX - arrowWidth * Math.cos((-50 + 210) * Math.PI / 180)},${tipY - arrowWidth * Math.sin((-50 + 210) * Math.PI / 180)}`,
-    "Z"
-  ].join(" ");
-  return [
-    {
-      name: "path",
-      type: "element",
-      attributes: {
-        d: arrowPath,
-        stroke: colorMap2.schematic.reference,
-        fill: colorMap2.schematic.reference,
-        "stroke-width": `${getSchStrokeSize(transform)}px`
-      },
-      value: "",
-      children: []
-    },
-    {
-      type: "element",
-      name: "text",
-      value: "",
-      attributes: {
-        x: (baseX + 8 - (baseX - baseX)).toString(),
-        y: (baseY - 10 + (baseY - baseY)).toString(),
-        fill: colorMap2.schematic.reference,
-        "text-anchor": "middle",
-        "dominant-baseline": "middle",
-        "font-family": "sans-serif",
-        "font-size": `${getSchScreenFontSize(transform, "reference_designator")}px`,
-        "font-weight": "bold",
-        "data-schematic-voltage-probe-id": probe.schematic_voltage_probe_id
-      },
-      children: [
-        {
-          type: "text",
-          value: probe.voltage ? `${probe.voltage}V` : "",
-          name: "",
-          attributes: {},
-          children: []
-        }
-      ]
-    }
-  ];
-}
-
-// lib/sch/svg-object-fns/create-svg-objects-from-sch-debug-object.ts
-import { applyToPoint as applyToPoint34 } from "transformation-matrix";
-function createSvgObjectsFromSchDebugObject({
-  debugObject,
-  transform
-}) {
-  if (debugObject.shape === "rect") {
-    let [screenLeft, screenTop] = applyToPoint34(transform, [
-      debugObject.center.x - debugObject.size.width / 2,
-      debugObject.center.y - debugObject.size.height / 2
-    ]);
-    let [screenRight, screenBottom] = applyToPoint34(transform, [
-      debugObject.center.x + debugObject.size.width / 2,
-      debugObject.center.y + debugObject.size.height / 2
-    ]);
-    [screenTop, screenBottom] = [
-      Math.min(screenTop, screenBottom),
-      Math.max(screenTop, screenBottom)
-    ];
-    const width = Math.abs(screenRight - screenLeft);
-    const height = Math.abs(screenBottom - screenTop);
-    const [screenCenterX, screenCenterY] = applyToPoint34(transform, [
-      debugObject.center.x,
-      debugObject.center.y
-    ]);
-    return [
-      {
-        name: "rect",
-        type: "element",
-        value: "",
-        attributes: {
-          x: screenLeft.toString(),
-          y: screenTop.toString(),
-          width: width.toString(),
-          height: height.toString(),
-          fill: "none",
-          stroke: "red",
-          "stroke-width": (0.02 * Math.abs(transform.a)).toString(),
-          "stroke-dasharray": "5,5"
-        },
-        children: debugObject.label ? [
-          {
-            name: "text",
-            type: "element",
-            value: "",
-            attributes: {
-              x: screenCenterX.toString(),
-              y: (screenCenterY - 10).toString(),
-              "text-anchor": "middle",
-              "font-size": (0.2 * Math.abs(transform.a)).toString(),
-              fill: "red"
-            },
-            children: [
-              {
-                type: "text",
-                value: debugObject.label,
-                name: "",
-                attributes: {},
-                children: []
-              }
-            ]
-          }
-        ] : []
-      }
-    ];
-  }
-  if (debugObject.shape === "line") {
-    const [screenStartX, screenStartY] = applyToPoint34(transform, [
-      debugObject.start.x,
-      debugObject.start.y
-    ]);
-    const [screenEndX, screenEndY] = applyToPoint34(transform, [
-      debugObject.end.x,
-      debugObject.end.y
-    ]);
-    const screenMidX = (screenStartX + screenEndX) / 2;
-    const screenMidY = (screenStartY + screenEndY) / 2;
-    return [
-      {
-        name: "line",
-        type: "element",
-        value: "",
-        attributes: {
-          x1: screenStartX.toString(),
-          y1: screenStartY.toString(),
-          x2: screenEndX.toString(),
-          y2: screenEndY.toString(),
-          stroke: "red",
-          "stroke-width": (0.02 * Math.abs(transform.a)).toString(),
-          "stroke-dasharray": "5,5"
-        },
-        children: debugObject.label ? [
-          {
-            name: "text",
-            type: "element",
-            value: "",
-            attributes: {
-              x: screenMidX.toString(),
-              y: (screenMidY - 10).toString(),
-              "text-anchor": "middle",
-              "font-size": (0.2 * Math.abs(transform.a)).toString(),
-              fill: "red"
-            },
-            children: [
-              {
-                type: "text",
-                value: debugObject.label,
-                name: "",
-                attributes: {},
-                children: []
-              }
-            ]
-          }
-        ] : []
-      }
-    ];
-  }
-  return [];
-}
-
-// lib/sch/svg-object-fns/create-svg-objects-from-sch-trace.ts
-import { applyToPoint as applyToPoint35 } from "transformation-matrix";
-function createSchematicTrace({
-  trace,
-  transform,
-  colorMap: colorMap2
-}) {
-  const edges = trace.edges;
-  if (edges.length === 0) return [];
-  const svgObjects = [];
-  let path = "";
-  for (let edgeIndex = 0; edgeIndex < edges.length; edgeIndex++) {
-    const edge = edges[edgeIndex];
-    if (edge.is_crossing) continue;
-    const [screenFromX, screenFromY] = applyToPoint35(transform, [
-      edge.from.x,
-      edge.from.y
-    ]);
-    const [screenToX, screenToY] = applyToPoint35(transform, [
-      edge.to.x,
-      edge.to.y
-    ]);
-    if (edgeIndex === 0 || edges[edgeIndex - 1]?.is_crossing) {
-      path += `M ${screenFromX} ${screenFromY} L ${screenToX} ${screenToY}`;
-    } else {
-      path += ` L ${screenToX} ${screenToY}`;
-    }
-  }
-  for (const edge of edges) {
-    if (!edge.is_crossing) continue;
-    const [screenFromX, screenFromY] = applyToPoint35(transform, [
-      edge.from.x,
-      edge.from.y
-    ]);
-    const [screenToX, screenToY] = applyToPoint35(transform, [
-      edge.to.x,
-      edge.to.y
-    ]);
-    const midX = (screenFromX + screenToX) / 2;
-    const midY = (screenFromY + screenToY) / 2;
-    const dx = screenToX - screenFromX;
-    const dy = screenToY - screenFromY;
-    const len = Math.sqrt(dx * dx + dy * dy);
-    const hopHeight = len * 0.7;
-    const perpX = -dy / len * hopHeight;
-    const perpY = dx / len * hopHeight;
-    const controlX = midX + perpX;
-    const controlY = midY - Math.abs(perpY);
-    svgObjects.push({
-      name: "path",
-      type: "element",
-      attributes: {
-        class: "trace-crossing-outline",
-        d: `M ${screenFromX} ${screenFromY} Q ${controlX} ${controlY} ${screenToX} ${screenToY}`,
-        stroke: colorMap2.schematic.background,
-        fill: "none",
-        "stroke-width": `${getSchStrokeSize(transform) * 1.5}px`,
-        "stroke-linecap": "round"
-      },
-      value: "",
-      children: []
-    });
-    svgObjects.push({
-      name: "path",
-      type: "element",
-      attributes: {
-        d: `M ${screenFromX} ${screenFromY} Q ${controlX} ${controlY} ${screenToX} ${screenToY}`,
-        stroke: colorMap2.schematic.wire,
-        fill: "none",
-        "stroke-width": `${getSchStrokeSize(transform)}px`,
-        "stroke-linecap": "round"
-      },
-      value: "",
-      children: []
-    });
-  }
-  if (path) {
-    svgObjects.push({
-      name: "path",
-      type: "element",
-      attributes: {
-        d: path,
-        class: "trace-invisible-hover-outline",
-        stroke: colorMap2.schematic.wire,
-        fill: "none",
-        "stroke-width": `${getSchStrokeSize(transform) * 8}px`,
-        "stroke-linecap": "round",
-        opacity: "0",
-        "stroke-linejoin": "round"
-      },
-      value: "",
-      children: []
-    });
-    svgObjects.push({
-      name: "path",
-      type: "element",
-      attributes: {
-        d: path,
-        stroke: colorMap2.schematic.wire,
-        fill: "none",
-        "stroke-width": `${getSchStrokeSize(transform)}px`,
-        "stroke-linecap": "round",
-        "stroke-linejoin": "round"
-      },
-      value: "",
-      children: []
-    });
-  }
-  if (trace.junctions) {
-    for (const junction of trace.junctions) {
-      const [screenX, screenY] = applyToPoint35(transform, [
-        junction.x,
-        junction.y
-      ]);
-      svgObjects.push({
-        name: "circle",
-        type: "element",
-        attributes: {
-          cx: screenX.toString(),
-          cy: screenY.toString(),
-          r: (Math.abs(transform.a) * 0.03).toString(),
-          fill: colorMap2.schematic.junction
-        },
-        value: "",
-        children: []
-      });
-    }
-  }
-  return [
-    {
-      name: "g",
-      type: "element",
-      value: "",
-      attributes: {
-        class: "trace",
-        "data-circuit-json-type": "schematic_trace",
-        "data-schematic-trace-id": trace.schematic_trace_id
-      },
-      children: svgObjects
-    }
-  ];
-}
-
-// lib/sch/svg-object-fns/create-svg-objects-for-sch-net-label.ts
-import {
-  applyToPoint as applyToPoint37,
-  compose as compose9,
-  rotate as rotate5,
-  scale as scale6,
-  translate as translate9
-} from "transformation-matrix";
+}
 
 // lib/sch/arial-text-metrics.ts
 var arialTextMetrics = {
@@ -4408,22 +3352,1143 @@ var arialTextMetrics = {
     left: -1,
     right: 13
   }
-};
+};
+
+// lib/sch/estimate-text-width.ts
+var estimateTextWidth = (text) => {
+  if (!text) return 0;
+  let totalWidth = 0;
+  for (const char of text) {
+    const metrics = arialTextMetrics[char];
+    if (metrics) {
+      totalWidth += metrics.width;
+    } else {
+      totalWidth += arialTextMetrics["?"].width;
+    }
+  }
+  return totalWidth / 27;
+};
+
+// lib/sch/get-schematic-bounds-from-circuit-json.ts
+function getSchematicBoundsFromCircuitJson(soup, padding = 0.5) {
+  let minX = Number.POSITIVE_INFINITY;
+  let minY = Number.POSITIVE_INFINITY;
+  let maxX = Number.NEGATIVE_INFINITY;
+  let maxY = Number.NEGATIVE_INFINITY;
+  const portSize = 0.2;
+  for (const item of soup) {
+    if (item.type === "schematic_component") {
+      updateBounds(item.center, item.size, 0);
+    } else if (item.type === "schematic_port") {
+      updateBounds(item.center, { width: portSize, height: portSize }, 0);
+    } else if (item.type === "schematic_debug_object") {
+      if (item.shape === "rect") {
+        updateBounds(item.center, item.size, 0);
+      } else if (item.shape === "line") {
+        updateBounds(item.start, { width: 0.1, height: 0.1 }, 0);
+        updateBounds(item.end, { width: 0.1, height: 0.1 }, 0);
+      }
+    } else if (item.type === "schematic_net_label") {
+      const fontSizeMm = getSchMmFontSize("net_label");
+      const textWidth = estimateTextWidth(item.text || "");
+      const fullWidthFsr = textWidth + ARROW_POINT_WIDTH_FSR * 2 + END_PADDING_EXTRA_PER_CHARACTER_FSR * (item.text?.length || 0) + END_PADDING_FSR;
+      const width = fullWidthFsr * fontSizeMm;
+      const height = 1.2 * fontSizeMm;
+      const rotation = getPathRotation(item.anchor_side) / 180 * Math.PI;
+      const anchorPosition = calculateAnchorPosition(
+        item,
+        fontSizeMm,
+        textWidth
+      );
+      const growthVec = getUnitVectorFromOutsideToEdge(item.anchor_side);
+      const center = {
+        x: anchorPosition.x + growthVec.x * width / 2,
+        y: anchorPosition.y + growthVec.y * width / 2
+      };
+      updateBounds(center, { width, height }, rotation);
+    } else if (item.type === "schematic_trace") {
+      for (const edge of item.edges) {
+        updateBounds(edge.from, { width: 0.1, height: 0.1 }, 0);
+        updateBounds(edge.to, { width: 0.1, height: 0.1 }, 0);
+      }
+    } else if (item.type === "schematic_text") {
+      const textType = "reference_designator";
+      const fontSize = getSchMmFontSize(textType, item.font_size) ?? 0.18;
+      const text = item.text ?? "";
+      const width = text.length * fontSize;
+      const height = fontSize;
+      updateBounds(item.position, { width, height }, item.rotation ?? 0);
+    } else if (item.type === "schematic_voltage_probe") {
+      updateBounds(item.position, { width: 0.2, height: 0.4 }, 0);
+    } else if (item.type === "schematic_box") {
+      updateBounds(
+        {
+          x: item.x + item.width / 2,
+          y: item.y + item.height / 2
+        },
+        { width: item.width, height: item.height },
+        0
+      );
+    }
+  }
+  minX -= padding;
+  minY -= padding;
+  maxX += padding;
+  maxY += padding;
+  return { minX, minY, maxX, maxY };
+  function updateBounds(center, size, rotation) {
+    const corners = [
+      { x: -size.width / 2, y: -size.height / 2 },
+      { x: size.width / 2, y: -size.height / 2 },
+      { x: size.width / 2, y: size.height / 2 },
+      { x: -size.width / 2, y: size.height / 2 }
+    ];
+    for (const corner of corners) {
+      const rotatedX = corner.x * Math.cos(rotation) - corner.y * Math.sin(rotation) + center.x;
+      const rotatedY = corner.x * Math.sin(rotation) + corner.y * Math.cos(rotation) + center.y;
+      minX = Math.min(minX, rotatedX);
+      minY = Math.min(minY, rotatedY);
+      maxX = Math.max(maxX, rotatedX);
+      maxY = Math.max(maxY, rotatedY);
+    }
+  }
+}
+
+// lib/sch/svg-object-fns/create-svg-objects-from-sch-component-with-symbol.ts
+import { su as su4 } from "@tscircuit/circuit-json-util";
+import { symbols } from "schematic-symbols";
+import "svgson";
+import {
+  applyToPoint as applyToPoint26,
+  compose as compose7
+} from "transformation-matrix";
+
+// lib/utils/get-sch-stroke-size.ts
+var getSchStrokeSize = (transform) => {
+  return Math.abs(transform.a) * 0.02;
+};
+
+// lib/utils/match-sch-ports-with-symbol-ports.ts
+var getAngularDifference = (angle1, angle2) => {
+  const a1 = angle1 < 0 ? angle1 + 2 * Math.PI : angle1;
+  const a2 = angle2 < 0 ? angle2 + 2 * Math.PI : angle2;
+  let diff = Math.abs(a1 - a2);
+  if (diff > Math.PI) {
+    diff = 2 * Math.PI - diff;
+  }
+  return diff;
+};
+var matchSchPortsToSymbolPorts = ({
+  schPorts,
+  symbol,
+  schComponent
+}) => {
+  const schPortAngles = schPorts.map((port) => {
+    const dx = port.center.x - schComponent.center.x;
+    const dy = port.center.y - schComponent.center.y;
+    return {
+      port,
+      angle: Math.atan2(dy, dx)
+    };
+  });
+  const symbolPortAngles = symbol.ports.map((port) => {
+    const dx = port.x - symbol.center.x;
+    const dy = port.y - symbol.center.y;
+    return {
+      port,
+      angle: Math.atan2(dy, dx)
+    };
+  });
+  schPortAngles.sort((a, b) => a.angle - b.angle);
+  symbolPortAngles.sort((a, b) => a.angle - b.angle);
+  const matches = [];
+  const usedSymbolPorts = /* @__PURE__ */ new Set();
+  for (const schPortAngle of schPortAngles) {
+    let bestMatch = null;
+    for (const symbolPortAngle of symbolPortAngles) {
+      if (usedSymbolPorts.has(symbolPortAngle.port)) continue;
+      const angleDiff = getAngularDifference(
+        schPortAngle.angle,
+        symbolPortAngle.angle
+      );
+      if (bestMatch === null || angleDiff < bestMatch.angleDiff) {
+        bestMatch = {
+          symbolPort: symbolPortAngle.port,
+          angleDiff
+        };
+      }
+    }
+    if (bestMatch && bestMatch.angleDiff < Math.PI / 4) {
+      matches.push({
+        schPort: schPortAngle.port,
+        symbolPort: bestMatch.symbolPort
+      });
+      usedSymbolPorts.add(bestMatch.symbolPort);
+    }
+  }
+  return matches;
+};
+
+// lib/utils/point-pairs-to-matrix.ts
+import { compose as compose6, scale as scale4, translate as translate6 } from "transformation-matrix";
+function pointPairsToMatrix(a1, a2, b1, b2) {
+  const tx = a2.x - a1.x;
+  const ty = a2.y - a1.y;
+  const originalDistance = Math.sqrt((b1.x - a1.x) ** 2 + (b1.y - a1.y) ** 2);
+  const transformedDistance = Math.sqrt((b2.x - a2.x) ** 2 + (b2.y - a2.y) ** 2);
+  const a = transformedDistance / originalDistance;
+  const translateMatrix = translate6(tx, ty);
+  const scaleMatrix = scale4(a, a);
+  return compose6(translateMatrix, scaleMatrix);
+}
+
+// lib/sch/svg-object-fns/create-svg-error-text.ts
+import { applyToPoint as applyToPoint25 } from "transformation-matrix";
+var createSvgSchErrorText = ({
+  text,
+  realCenter,
+  realToScreenTransform
+}) => {
+  const screenCenter = applyToPoint25(realToScreenTransform, realCenter);
+  return {
+    type: "element",
+    name: "text",
+    value: "",
+    attributes: {
+      x: screenCenter.x.toString(),
+      y: screenCenter.y.toString(),
+      fill: "red",
+      "text-anchor": "middle",
+      "dominant-baseline": "middle",
+      "font-family": "sans-serif",
+      "font-size": `${getSchScreenFontSize(realToScreenTransform, "error")}px`
+    },
+    children: [
+      {
+        type: "text",
+        value: text,
+        name: "",
+        attributes: {},
+        children: []
+      }
+    ]
+  };
+};
+
+// lib/sch/svg-object-fns/create-svg-objects-from-sch-component-with-symbol.ts
+var ninePointAnchorToTextAnchor2 = {
+  top_left: "start",
+  top_right: "end",
+  middle_left: "start",
+  middle_right: "end",
+  bottom_left: "start",
+  bottom_right: "end",
+  center: "middle",
+  middle_top: "middle",
+  middle_bottom: "middle"
+};
+var createSvgObjectsFromSchematicComponentWithSymbol = ({
+  component: schComponent,
+  transform: realToScreenTransform,
+  circuitJson,
+  colorMap: colorMap2
+}) => {
+  const svgObjects = [];
+  const symbol = symbols[schComponent.symbol_name];
+  if (!symbol) {
+    return [
+      createSvgSchErrorText({
+        text: `Symbol not found: ${schComponent.symbol_name}`,
+        realCenter: schComponent.center,
+        realToScreenTransform
+      })
+    ];
+  }
+  const schPorts = su4(circuitJson).schematic_port.list({
+    schematic_component_id: schComponent.schematic_component_id
+  });
+  const srcComponent = su4(circuitJson).source_component.get(
+    schComponent.source_component_id
+  );
+  const schPortsWithSymbolPorts = matchSchPortsToSymbolPorts({
+    schPorts,
+    symbol,
+    schComponent
+  });
+  if (!schPortsWithSymbolPorts[0]) {
+    return [
+      createSvgSchErrorText({
+        text: `Could not match ports for symbol ${schComponent.symbol_name}`,
+        realCenter: schComponent.center,
+        realToScreenTransform
+      })
+    ];
+  }
+  const transformFromSymbolToReal = pointPairsToMatrix(
+    schPortsWithSymbolPorts[1]?.symbolPort ?? symbol.center,
+    schPortsWithSymbolPorts[1]?.schPort.center ?? schComponent.center,
+    schPortsWithSymbolPorts[0].symbolPort,
+    schPortsWithSymbolPorts[0].schPort.center
+  );
+  const paths = symbol.primitives.filter((p) => p.type === "path");
+  const texts = symbol.primitives.filter((p) => p.type === "text");
+  const circles = symbol.primitives.filter((p) => p.type === "circle");
+  const boxes = symbol.primitives.filter((p) => p.type === "box");
+  const bounds = {
+    minX: Math.min(...paths.flatMap((p) => p.points.map((pt) => pt.x))),
+    maxX: Math.max(...paths.flatMap((p) => p.points.map((pt) => pt.x))),
+    minY: Math.min(...paths.flatMap((p) => p.points.map((pt) => pt.y))),
+    maxY: Math.max(...paths.flatMap((p) => p.points.map((pt) => pt.y)))
+  };
+  const [screenMinX, screenMinY] = applyToPoint26(
+    compose7(realToScreenTransform, transformFromSymbolToReal),
+    [bounds.minX, bounds.minY]
+  );
+  const [screenMaxX, screenMaxY] = applyToPoint26(
+    compose7(realToScreenTransform, transformFromSymbolToReal),
+    [bounds.maxX, bounds.maxY]
+  );
+  const rectHeight = Math.abs(screenMaxY - screenMinY);
+  const rectY = Math.min(screenMinY, screenMaxY);
+  const rectWidth = Math.abs(screenMaxX - screenMinX);
+  const rectX = Math.min(screenMinX, screenMaxX);
+  svgObjects.push({
+    name: "rect",
+    type: "element",
+    value: "",
+    attributes: {
+      class: "component-overlay",
+      x: rectX.toString(),
+      y: rectY.toString(),
+      width: rectWidth.toString(),
+      height: rectHeight.toString(),
+      fill: "transparent"
+    },
+    children: []
+  });
+  for (const path of paths) {
+    const { points, color, closed, fill } = path;
+    svgObjects.push({
+      type: "element",
+      name: "path",
+      attributes: {
+        d: points.map((p, i) => {
+          const [x, y] = applyToPoint26(
+            compose7(realToScreenTransform, transformFromSymbolToReal),
+            [p.x, p.y]
+          );
+          return `${i === 0 ? "M" : "L"} ${x} ${y}`;
+        }).join(" ") + (closed ? " Z" : ""),
+        stroke: colorMap2.schematic.component_outline,
+        fill: "none",
+        "stroke-width": `${getSchStrokeSize(realToScreenTransform)}px`
+      },
+      value: "",
+      children: []
+    });
+  }
+  for (const text of texts) {
+    const screenTextPos = applyToPoint26(
+      compose7(realToScreenTransform, transformFromSymbolToReal),
+      text
+    );
+    let textValue = "";
+    if (text.text === "{REF}") {
+      textValue = srcComponent?.name ?? "";
+    } else if (text.text === "{VAL}") {
+      textValue = schComponent.symbol_display_value ?? "";
+    }
+    const symbolHeight = Math.abs(bounds.maxY - bounds.minY);
+    const offsetFactor = 0.1;
+    const baseOffset = symbolHeight * offsetFactor;
+    const transformScale = Math.abs(transformFromSymbolToReal.a);
+    let verticalOffset = 0;
+    if (text.anchor.includes("bottom")) {
+      verticalOffset = baseOffset * transformScale;
+    } else if (text.anchor.includes("top")) {
+      verticalOffset = -baseOffset * transformScale;
+    }
+    const dominantBaseline = text.anchor.includes("bottom") ? "auto" : text.anchor.includes("top") ? "hanging" : "middle";
+    svgObjects.push({
+      name: "text",
+      type: "element",
+      attributes: {
+        x: screenTextPos.x.toString(),
+        y: (screenTextPos.y + verticalOffset).toString(),
+        fill: colorMap2.schematic.label_local,
+        "font-family": "sans-serif",
+        "text-anchor": ninePointAnchorToTextAnchor2[text.anchor],
+        "dominant-baseline": dominantBaseline,
+        "font-size": `${getSchScreenFontSize(realToScreenTransform, "reference_designator")}px`
+      },
+      value: "",
+      children: [
+        {
+          type: "text",
+          value: textValue,
+          name: "",
+          attributes: {},
+          children: []
+        }
+      ]
+    });
+  }
+  for (const box of boxes) {
+    const screenBoxPos = applyToPoint26(
+      compose7(realToScreenTransform, transformFromSymbolToReal),
+      box
+    );
+    const symbolToScreenScale = compose7(
+      realToScreenTransform,
+      transformFromSymbolToReal
+    ).a;
+    svgObjects.push({
+      name: "rect",
+      type: "element",
+      attributes: {
+        x: screenBoxPos.x.toString(),
+        y: screenBoxPos.y.toString(),
+        width: (box.width * symbolToScreenScale).toString(),
+        height: (box.height * symbolToScreenScale).toString(),
+        fill: "red"
+      },
+      value: "",
+      children: []
+    });
+  }
+  for (const port of symbol.ports) {
+    const screenPortPos = applyToPoint26(
+      compose7(realToScreenTransform, transformFromSymbolToReal),
+      port
+    );
+    svgObjects.push({
+      type: "element",
+      name: "circle",
+      attributes: {
+        cx: screenPortPos.x.toString(),
+        cy: screenPortPos.y.toString(),
+        r: `${Math.abs(realToScreenTransform.a) * 0.02}px`,
+        "stroke-width": `${getSchStrokeSize(realToScreenTransform)}px`,
+        fill: "none",
+        stroke: colorMap2.schematic.component_outline
+      },
+      value: "",
+      children: []
+    });
+  }
+  for (const circle of circles) {
+    const screenCirclePos = applyToPoint26(
+      compose7(realToScreenTransform, transformFromSymbolToReal),
+      circle
+    );
+    const screenRadius = Math.abs(circle.radius * realToScreenTransform.a);
+    svgObjects.push({
+      type: "element",
+      name: "circle",
+      attributes: {
+        cx: screenCirclePos.x.toString(),
+        cy: screenCirclePos.y.toString(),
+        r: `${screenRadius}px`,
+        "stroke-width": `${getSchStrokeSize(realToScreenTransform)}px`,
+        fill: "none",
+        stroke: colorMap2.schematic.component_outline
+      },
+      value: "",
+      children: []
+    });
+  }
+  return svgObjects;
+};
+
+// lib/sch/svg-object-fns/create-svg-objects-from-sch-component-with-box.ts
+import { su as su7 } from "@tscircuit/circuit-json-util";
+import "schematic-symbols";
+import "svgson";
+import { applyToPoint as applyToPoint32 } from "transformation-matrix";
+
+// lib/sch/svg-object-fns/create-svg-objects-from-sch-port-on-box.ts
+import "transformation-matrix";
+import "@tscircuit/circuit-json-util";
+
+// lib/sch/svg-object-fns/create-svg-objects-for-sch-port-box-line.ts
+import { applyToPoint as applyToPoint27 } from "transformation-matrix";
+import { su as su5 } from "@tscircuit/circuit-json-util";
+var PIN_CIRCLE_RADIUS_MM = 0.02;
+var createSvgObjectsForSchPortBoxLine = ({
+  schPort,
+  schComponent,
+  transform,
+  circuitJson
+}) => {
+  const svgObjects = [];
+  const srcPort = su5(circuitJson).source_port.get(schPort.source_port_id);
+  const realEdgePos = {
+    x: schPort.center.x,
+    y: schPort.center.y
+  };
+  const realPinLineLength = schPort.distance_from_component_edge ?? 0.4;
+  switch (schPort.side_of_component) {
+    case "left":
+      realEdgePos.x += realPinLineLength;
+      break;
+    case "right":
+      realEdgePos.x -= realPinLineLength;
+      break;
+    case "top":
+      realEdgePos.y -= realPinLineLength;
+      break;
+    case "bottom":
+      realEdgePos.y += realPinLineLength;
+      break;
+  }
+  const screenSchPortPos = applyToPoint27(transform, schPort.center);
+  const screenRealEdgePos = applyToPoint27(transform, realEdgePos);
+  const realLineEnd = { ...schPort.center };
+  switch (schPort.side_of_component) {
+    case "left":
+      realLineEnd.x += PIN_CIRCLE_RADIUS_MM;
+      break;
+    case "right":
+      realLineEnd.x -= PIN_CIRCLE_RADIUS_MM;
+      break;
+    case "top":
+      realLineEnd.y -= PIN_CIRCLE_RADIUS_MM;
+      break;
+    case "bottom":
+      realLineEnd.y += PIN_CIRCLE_RADIUS_MM;
+      break;
+  }
+  const screenLineEnd = applyToPoint27(transform, realLineEnd);
+  svgObjects.push({
+    name: "line",
+    type: "element",
+    attributes: {
+      class: "component-pin",
+      x1: screenLineEnd.x.toString(),
+      y1: screenLineEnd.y.toString(),
+      x2: screenRealEdgePos.x.toString(),
+      y2: screenRealEdgePos.y.toString(),
+      "stroke-width": `${getSchStrokeSize(transform)}px`
+    },
+    value: "",
+    children: []
+  });
+  svgObjects.push({
+    name: "circle",
+    type: "element",
+    attributes: {
+      class: "component-pin",
+      cx: screenSchPortPos.x.toString(),
+      cy: screenSchPortPos.y.toString(),
+      r: (Math.abs(transform.a) * PIN_CIRCLE_RADIUS_MM).toString(),
+      "stroke-width": `${getSchStrokeSize(transform)}px`
+    },
+    value: "",
+    children: []
+  });
+  return svgObjects;
+};
+
+// lib/sch/svg-object-fns/create-svg-objects-for-sch-port-pin-number-text.ts
+import { applyToPoint as applyToPoint28 } from "transformation-matrix";
+var createSvgObjectsForSchPortPinNumberText = (params) => {
+  const svgObjects = [];
+  const { schPort, schComponent, transform, circuitJson } = params;
+  const realPinNumberPos = {
+    x: schPort.center.x,
+    y: schPort.center.y
+  };
+  if (!schPort.side_of_component) return [];
+  const vecToEdge = getUnitVectorFromOutsideToEdge(schPort.side_of_component);
+  const realPinEdgeDistance = schPort.distance_from_component_edge ?? 0.4;
+  realPinNumberPos.x += vecToEdge.x * realPinEdgeDistance / 2;
+  realPinNumberPos.y += vecToEdge.y * realPinEdgeDistance / 2;
+  if (schPort.side_of_component === "top" || schPort.side_of_component === "bottom") {
+    realPinNumberPos.x -= 0.02;
+  } else {
+    realPinNumberPos.y += 0.02;
+  }
+  const screenPinNumberTextPos = applyToPoint28(transform, realPinNumberPos);
+  svgObjects.push({
+    name: "text",
+    type: "element",
+    attributes: {
+      class: "pin-number",
+      x: screenPinNumberTextPos.x.toString(),
+      y: screenPinNumberTextPos.y.toString(),
+      style: "font-family: sans-serif;",
+      fill: colorMap.schematic.pin_number,
+      "text-anchor": "middle",
+      "dominant-baseline": "auto",
+      "font-size": `${getSchScreenFontSize(transform, "pin_number")}px`,
+      transform: schPort.side_of_component === "top" || schPort.side_of_component === "bottom" ? `rotate(-90 ${screenPinNumberTextPos.x} ${screenPinNumberTextPos.y})` : ""
+    },
+    children: [
+      {
+        type: "text",
+        value: schPort.pin_number?.toString() || "",
+        name: "",
+        attributes: {},
+        children: []
+      }
+    ],
+    value: ""
+  });
+  return svgObjects;
+};
+
+// lib/sch/svg-object-fns/create-svg-objects-for-sch-port-pin-label.ts
+import { applyToPoint as applyToPoint29 } from "transformation-matrix";
+var LABEL_DIST_FROM_EDGE_MM = 0.1;
+var createSvgObjectsForSchPortPinLabel = (params) => {
+  const svgObjects = [];
+  const { schPort, schComponent, transform, circuitJson } = params;
+  const realPinNumberPos = {
+    x: schPort.center.x,
+    y: schPort.center.y
+  };
+  if (!schPort.side_of_component) return [];
+  const vecToEdge = getUnitVectorFromOutsideToEdge(schPort.side_of_component);
+  const realPinEdgeDistance = schPort.distance_from_component_edge ?? 0.4;
+  realPinNumberPos.x += vecToEdge.x * (realPinEdgeDistance + LABEL_DIST_FROM_EDGE_MM);
+  realPinNumberPos.y += vecToEdge.y * (realPinEdgeDistance + LABEL_DIST_FROM_EDGE_MM);
+  const screenPinNumberTextPos = applyToPoint29(transform, realPinNumberPos);
+  const label = schPort.display_pin_label ?? schComponent.port_labels?.[`${schPort.pin_number}`];
+  if (!label) return [];
+  svgObjects.push({
+    name: "text",
+    type: "element",
+    attributes: {
+      class: "pin-number",
+      x: screenPinNumberTextPos.x.toString(),
+      y: screenPinNumberTextPos.y.toString(),
+      style: "font-family: sans-serif;",
+      fill: colorMap.schematic.pin_number,
+      "text-anchor": schPort.side_of_component === "left" || schPort.side_of_component === "bottom" ? "start" : "end",
+      "dominant-baseline": "middle",
+      "font-size": `${getSchScreenFontSize(transform, "pin_number")}px`,
+      transform: schPort.side_of_component === "top" || schPort.side_of_component === "bottom" ? `rotate(-90 ${screenPinNumberTextPos.x} ${screenPinNumberTextPos.y})` : ""
+    },
+    children: [
+      {
+        type: "text",
+        value: label || "",
+        name: "",
+        attributes: {},
+        children: []
+      }
+    ],
+    value: ""
+  });
+  return svgObjects;
+};
+
+// lib/sch/svg-object-fns/create-svg-objects-from-sch-port-on-box.ts
+var createSvgObjectsFromSchPortOnBox = (params) => {
+  const svgObjects = [];
+  const { schPort, schComponent, transform, circuitJson } = params;
+  svgObjects.push(...createSvgObjectsForSchPortBoxLine(params));
+  svgObjects.push(...createSvgObjectsForSchPortPinNumberText(params));
+  svgObjects.push(...createSvgObjectsForSchPortPinLabel(params));
+  return svgObjects;
+};
+
+// lib/sch/svg-object-fns/create-svg-objects-for-sch-text.ts
+import { applyToPoint as applyToPoint31 } from "transformation-matrix";
+var createSvgSchText = ({
+  elm,
+  transform,
+  colorMap: colorMap2
+}) => {
+  const center = applyToPoint31(transform, elm.position);
+  const textAnchorMap = {
+    center: "middle",
+    center_right: "end",
+    bottom_left: "start",
+    bottom_center: "middle",
+    bottom_right: "end",
+    left: "start",
+    right: "end",
+    top: "middle",
+    bottom: "middle",
+    top_left: "start",
+    top_center: "middle",
+    top_right: "end",
+    center_left: "start"
+  };
+  const dominantBaselineMap = {
+    center: "middle",
+    center_right: "middle",
+    bottom_left: "ideographic",
+    bottom_center: "ideographic",
+    bottom_right: "ideographic",
+    left: "middle",
+    right: "middle",
+    top: "hanging",
+    bottom: "ideographic",
+    top_left: "hanging",
+    top_center: "hanging",
+    top_right: "hanging",
+    center_left: "middle"
+  };
+  return {
+    type: "element",
+    name: "text",
+    value: "",
+    attributes: {
+      x: center.x.toString(),
+      y: center.y.toString(),
+      fill: elm.color ?? colorMap2.schematic.sheet_label,
+      "text-anchor": textAnchorMap[elm.anchor],
+      "dominant-baseline": dominantBaselineMap[elm.anchor],
+      "font-family": "sans-serif",
+      "font-size": `${getSchScreenFontSize(transform, "reference_designator", elm.font_size)}px`,
+      transform: `rotate(${elm.rotation}, ${center.x}, ${center.y})`
+    },
+    children: [
+      {
+        type: "text",
+        value: elm.text,
+        name: elm.schematic_text_id,
+        attributes: {},
+        children: []
+      }
+    ]
+  };
+};
+
+// lib/sch/svg-object-fns/create-svg-objects-from-sch-component-with-box.ts
+var createSvgObjectsFromSchematicComponentWithBox = ({
+  component: schComponent,
+  transform,
+  circuitJson,
+  colorMap: colorMap2
+}) => {
+  const svgObjects = [];
+  const componentScreenTopLeft = applyToPoint32(transform, {
+    x: schComponent.center.x - schComponent.size.width / 2,
+    y: schComponent.center.y + schComponent.size.height / 2
+  });
+  const componentScreenBottomRight = applyToPoint32(transform, {
+    x: schComponent.center.x + schComponent.size.width / 2,
+    y: schComponent.center.y - schComponent.size.height / 2
+  });
+  const componentScreenWidth = componentScreenBottomRight.x - componentScreenTopLeft.x;
+  const componentScreenHeight = componentScreenBottomRight.y - componentScreenTopLeft.y;
+  svgObjects.push({
+    name: "rect",
+    type: "element",
+    value: "",
+    attributes: {
+      class: "component chip",
+      x: componentScreenTopLeft.x.toString(),
+      y: componentScreenTopLeft.y.toString(),
+      width: componentScreenWidth.toString(),
+      height: componentScreenHeight.toString(),
+      "stroke-width": `${getSchStrokeSize(transform)}px`,
+      fill: colorMap2.schematic.component_body,
+      stroke: colorMap2.schematic.component_outline
+    },
+    children: []
+  });
+  svgObjects.push({
+    name: "rect",
+    type: "element",
+    value: "",
+    attributes: {
+      class: "component-overlay",
+      x: componentScreenTopLeft.x.toString(),
+      y: componentScreenTopLeft.y.toString(),
+      width: componentScreenWidth.toString(),
+      height: componentScreenHeight.toString(),
+      fill: "transparent"
+    },
+    children: []
+  });
+  const schTexts = su7(circuitJson).schematic_text.list();
+  for (const schText of schTexts) {
+    if (schText.schematic_component_id === schComponent.schematic_component_id) {
+      svgObjects.push(
+        createSvgSchText({
+          elm: schText,
+          transform,
+          colorMap: colorMap2
+        })
+      );
+    }
+  }
+  const schematicPorts = su7(circuitJson).schematic_port.list({
+    schematic_component_id: schComponent.schematic_component_id
+  });
+  for (const schPort of schematicPorts) {
+    svgObjects.push(
+      ...createSvgObjectsFromSchPortOnBox({
+        schPort,
+        schComponent,
+        transform,
+        circuitJson
+      })
+    );
+  }
+  return svgObjects;
+};
+
+// lib/sch/svg-object-fns/create-svg-objects-from-sch-component.ts
+function createSvgObjectsFromSchematicComponent(params) {
+  const { component } = params;
+  const innerElements = component.symbol_name ? createSvgObjectsFromSchematicComponentWithSymbol(params) : createSvgObjectsFromSchematicComponentWithBox(params);
+  return [
+    {
+      type: "element",
+      name: "g",
+      attributes: {
+        "data-circuit-json-type": "schematic_component",
+        "data-schematic-component-id": component.schematic_component_id
+      },
+      children: innerElements,
+      value: ""
+    }
+  ];
+}
+
+// lib/sch/svg-object-fns/create-svg-objects-from-sch-voltage-probe.ts
+import { applyToPoint as applyToPoint33 } from "transformation-matrix";
+function createSvgObjectsFromSchVoltageProbe({
+  probe,
+  transform,
+  colorMap: colorMap2
+}) {
+  const [screenX, screenY] = applyToPoint33(transform, [
+    probe.position.x,
+    probe.position.y
+  ]);
+  const arrowLength = Math.abs(transform.a) * 0.6;
+  const arrowWidth = Math.abs(transform.a) * 0.28;
+  const baseX = screenX + arrowLength * Math.cos(-50 * Math.PI / 180);
+  const baseY = screenY + arrowLength * Math.sin(-50 * Math.PI / 180);
+  const tipX = screenX;
+  const tipY = screenY;
+  const arrowPath = [
+    `M ${baseX},${baseY}`,
+    `L ${tipX},${tipY}`,
+    `M ${tipX},${tipY}`,
+    `L ${tipX - arrowWidth * Math.cos((-50 + 150) * Math.PI / 180)},${tipY - arrowWidth * Math.sin((-50 + 150) * Math.PI / 180)}`,
+    `L ${tipX - arrowWidth * Math.cos((-50 + 210) * Math.PI / 180)},${tipY - arrowWidth * Math.sin((-50 + 210) * Math.PI / 180)}`,
+    "Z"
+  ].join(" ");
+  return [
+    {
+      name: "path",
+      type: "element",
+      attributes: {
+        d: arrowPath,
+        stroke: colorMap2.schematic.reference,
+        fill: colorMap2.schematic.reference,
+        "stroke-width": `${getSchStrokeSize(transform)}px`
+      },
+      value: "",
+      children: []
+    },
+    {
+      type: "element",
+      name: "text",
+      value: "",
+      attributes: {
+        x: (baseX + 8 - (baseX - baseX)).toString(),
+        y: (baseY - 10 + (baseY - baseY)).toString(),
+        fill: colorMap2.schematic.reference,
+        "text-anchor": "middle",
+        "dominant-baseline": "middle",
+        "font-family": "sans-serif",
+        "font-size": `${getSchScreenFontSize(transform, "reference_designator")}px`,
+        "font-weight": "bold",
+        "data-schematic-voltage-probe-id": probe.schematic_voltage_probe_id
+      },
+      children: [
+        {
+          type: "text",
+          value: probe.voltage ? `${probe.voltage}V` : "",
+          name: "",
+          attributes: {},
+          children: []
+        }
+      ]
+    }
+  ];
+}
+
+// lib/sch/svg-object-fns/create-svg-objects-from-sch-debug-object.ts
+import { applyToPoint as applyToPoint34 } from "transformation-matrix";
+function createSvgObjectsFromSchDebugObject({
+  debugObject,
+  transform
+}) {
+  if (debugObject.shape === "rect") {
+    let [screenLeft, screenTop] = applyToPoint34(transform, [
+      debugObject.center.x - debugObject.size.width / 2,
+      debugObject.center.y - debugObject.size.height / 2
+    ]);
+    let [screenRight, screenBottom] = applyToPoint34(transform, [
+      debugObject.center.x + debugObject.size.width / 2,
+      debugObject.center.y + debugObject.size.height / 2
+    ]);
+    [screenTop, screenBottom] = [
+      Math.min(screenTop, screenBottom),
+      Math.max(screenTop, screenBottom)
+    ];
+    const width = Math.abs(screenRight - screenLeft);
+    const height = Math.abs(screenBottom - screenTop);
+    const [screenCenterX, screenCenterY] = applyToPoint34(transform, [
+      debugObject.center.x,
+      debugObject.center.y
+    ]);
+    return [
+      {
+        name: "rect",
+        type: "element",
+        value: "",
+        attributes: {
+          x: screenLeft.toString(),
+          y: screenTop.toString(),
+          width: width.toString(),
+          height: height.toString(),
+          fill: "none",
+          stroke: "red",
+          "stroke-width": (0.02 * Math.abs(transform.a)).toString(),
+          "stroke-dasharray": "5,5"
+        },
+        children: debugObject.label ? [
+          {
+            name: "text",
+            type: "element",
+            value: "",
+            attributes: {
+              x: screenCenterX.toString(),
+              y: (screenCenterY - 10).toString(),
+              "text-anchor": "middle",
+              "font-size": (0.2 * Math.abs(transform.a)).toString(),
+              fill: "red"
+            },
+            children: [
+              {
+                type: "text",
+                value: debugObject.label,
+                name: "",
+                attributes: {},
+                children: []
+              }
+            ]
+          }
+        ] : []
+      }
+    ];
+  }
+  if (debugObject.shape === "line") {
+    const [screenStartX, screenStartY] = applyToPoint34(transform, [
+      debugObject.start.x,
+      debugObject.start.y
+    ]);
+    const [screenEndX, screenEndY] = applyToPoint34(transform, [
+      debugObject.end.x,
+      debugObject.end.y
+    ]);
+    const screenMidX = (screenStartX + screenEndX) / 2;
+    const screenMidY = (screenStartY + screenEndY) / 2;
+    return [
+      {
+        name: "line",
+        type: "element",
+        value: "",
+        attributes: {
+          x1: screenStartX.toString(),
+          y1: screenStartY.toString(),
+          x2: screenEndX.toString(),
+          y2: screenEndY.toString(),
+          stroke: "red",
+          "stroke-width": (0.02 * Math.abs(transform.a)).toString(),
+          "stroke-dasharray": "5,5"
+        },
+        children: debugObject.label ? [
+          {
+            name: "text",
+            type: "element",
+            value: "",
+            attributes: {
+              x: screenMidX.toString(),
+              y: (screenMidY - 10).toString(),
+              "text-anchor": "middle",
+              "font-size": (0.2 * Math.abs(transform.a)).toString(),
+              fill: "red"
+            },
+            children: [
+              {
+                type: "text",
+                value: debugObject.label,
+                name: "",
+                attributes: {},
+                children: []
+              }
+            ]
+          }
+        ] : []
+      }
+    ];
+  }
+  return [];
+}
 
-// lib/sch/estimate-text-width.ts
-var estimateTextWidth = (text) => {
-  if (!text) return 0;
-  let totalWidth = 0;
-  for (const char of text) {
-    const metrics = arialTextMetrics[char];
-    if (metrics) {
-      totalWidth += metrics.width;
+// lib/sch/svg-object-fns/create-svg-objects-from-sch-trace.ts
+import { applyToPoint as applyToPoint35 } from "transformation-matrix";
+function createSchematicTrace({
+  trace,
+  transform,
+  colorMap: colorMap2
+}) {
+  const edges = trace.edges;
+  if (edges.length === 0) return [];
+  const svgObjects = [];
+  let path = "";
+  for (let edgeIndex = 0; edgeIndex < edges.length; edgeIndex++) {
+    const edge = edges[edgeIndex];
+    if (edge.is_crossing) continue;
+    const [screenFromX, screenFromY] = applyToPoint35(transform, [
+      edge.from.x,
+      edge.from.y
+    ]);
+    const [screenToX, screenToY] = applyToPoint35(transform, [
+      edge.to.x,
+      edge.to.y
+    ]);
+    if (edgeIndex === 0 || edges[edgeIndex - 1]?.is_crossing) {
+      path += `M ${screenFromX} ${screenFromY} L ${screenToX} ${screenToY}`;
     } else {
-      totalWidth += arialTextMetrics["?"].width;
+      path += ` L ${screenToX} ${screenToY}`;
     }
   }
-  return totalWidth / 27;
-};
+  for (const edge of edges) {
+    if (!edge.is_crossing) continue;
+    const [screenFromX, screenFromY] = applyToPoint35(transform, [
+      edge.from.x,
+      edge.from.y
+    ]);
+    const [screenToX, screenToY] = applyToPoint35(transform, [
+      edge.to.x,
+      edge.to.y
+    ]);
+    const midX = (screenFromX + screenToX) / 2;
+    const midY = (screenFromY + screenToY) / 2;
+    const dx = screenToX - screenFromX;
+    const dy = screenToY - screenFromY;
+    const len = Math.sqrt(dx * dx + dy * dy);
+    const hopHeight = len * 0.7;
+    const perpX = -dy / len * hopHeight;
+    const perpY = dx / len * hopHeight;
+    const controlX = midX + perpX;
+    const controlY = midY - Math.abs(perpY);
+    svgObjects.push({
+      name: "path",
+      type: "element",
+      attributes: {
+        class: "trace-crossing-outline",
+        d: `M ${screenFromX} ${screenFromY} Q ${controlX} ${controlY} ${screenToX} ${screenToY}`,
+        stroke: colorMap2.schematic.background,
+        fill: "none",
+        "stroke-width": `${getSchStrokeSize(transform) * 1.5}px`,
+        "stroke-linecap": "round"
+      },
+      value: "",
+      children: []
+    });
+    svgObjects.push({
+      name: "path",
+      type: "element",
+      attributes: {
+        d: `M ${screenFromX} ${screenFromY} Q ${controlX} ${controlY} ${screenToX} ${screenToY}`,
+        stroke: colorMap2.schematic.wire,
+        fill: "none",
+        "stroke-width": `${getSchStrokeSize(transform)}px`,
+        "stroke-linecap": "round"
+      },
+      value: "",
+      children: []
+    });
+  }
+  if (path) {
+    svgObjects.push({
+      name: "path",
+      type: "element",
+      attributes: {
+        d: path,
+        class: "trace-invisible-hover-outline",
+        stroke: colorMap2.schematic.wire,
+        fill: "none",
+        "stroke-width": `${getSchStrokeSize(transform) * 8}px`,
+        "stroke-linecap": "round",
+        opacity: "0",
+        "stroke-linejoin": "round"
+      },
+      value: "",
+      children: []
+    });
+    svgObjects.push({
+      name: "path",
+      type: "element",
+      attributes: {
+        d: path,
+        stroke: colorMap2.schematic.wire,
+        fill: "none",
+        "stroke-width": `${getSchStrokeSize(transform)}px`,
+        "stroke-linecap": "round",
+        "stroke-linejoin": "round"
+      },
+      value: "",
+      children: []
+    });
+  }
+  if (trace.junctions) {
+    for (const junction of trace.junctions) {
+      const [screenX, screenY] = applyToPoint35(transform, [
+        junction.x,
+        junction.y
+      ]);
+      svgObjects.push({
+        name: "circle",
+        type: "element",
+        attributes: {
+          cx: screenX.toString(),
+          cy: screenY.toString(),
+          r: (Math.abs(transform.a) * 0.03).toString(),
+          class: "trace-junction",
+          fill: colorMap2.schematic.junction
+        },
+        value: "",
+        children: []
+      });
+    }
+  }
+  return [
+    {
+      name: "g",
+      type: "element",
+      value: "",
+      attributes: {
+        class: "trace",
+        "data-circuit-json-type": "schematic_trace",
+        "data-schematic-trace-id": trace.schematic_trace_id
+      },
+      children: svgObjects
+    }
+  ];
+}
+
+// lib/sch/svg-object-fns/create-svg-objects-for-sch-net-label.ts
+import {
+  applyToPoint as applyToPoint37,
+  compose as compose9,
+  rotate as rotate5,
+  scale as scale6,
+  translate as translate9
+} from "transformation-matrix";
 
 // lib/sch/svg-object-fns/create-svg-objects-for-sch-net-label-with-symbol.ts
 import {
@@ -4434,37 +4499,6 @@ import {
   translate as translate8
 } from "transformation-matrix";
 import { symbols as symbols3 } from "schematic-symbols";
-
-// lib/utils/net-label-utils.ts
-import "transformation-matrix";
-import "schematic-symbols";
-var ARROW_POINT_WIDTH_FSR = 0.3;
-var END_PADDING_FSR = 0.3;
-var END_PADDING_EXTRA_PER_CHARACTER_FSR = 0.06;
-var ninePointAnchorToTextAnchor2 = {
-  top_left: "start",
-  top_right: "end",
-  middle_left: "start",
-  middle_right: "end",
-  bottom_left: "start",
-  bottom_right: "end",
-  center: "middle",
-  middle_top: "middle",
-  middle_bottom: "middle"
-};
-var ninePointAnchorToDominantBaseline = {
-  top_left: "hanging",
-  top_right: "hanging",
-  bottom_left: "ideographic",
-  bottom_right: "ideographic",
-  center: "middle",
-  middle_left: "middle",
-  middle_right: "middle",
-  middle_top: "hanging",
-  middle_bottom: "ideographic"
-};
-
-// lib/sch/svg-object-fns/create-svg-objects-for-sch-net-label-with-symbol.ts
 var createSvgObjectsForSchNetLabelWithSymbol = ({
   schNetLabel,
   realToScreenTransform,
@@ -4613,7 +4647,7 @@ var createSvgObjectsForSchNetLabelWithSymbol = ({
         y: offsetScreenPos.y.toString(),
         fill: colorMap2.schematic.label_local,
         "font-family": "sans-serif",
-        "text-anchor": ninePointAnchorToTextAnchor2[text.anchor],
+        "text-anchor": ninePointAnchorToTextAnchor[text.anchor],
         "dominant-baseline": ninePointAnchorToDominantBaseline[text.anchor],
         "font-size": `${getSchScreenFontSize(realToScreenTransform, "reference_designator")}px`
       },
@@ -5042,6 +5076,9 @@ function convertCircuitJsonToSchematicSvg(circuitJson, options) {
               .trace:hover .trace-crossing-outline {
                 opacity: 0;
               }
+              .trace:hover .trace-junction {
+                filter: invert(1);
+              }
               .text { font-family: sans-serif; fill: ${colorMap2.schematic.wire}; }
               .pin-number { fill: ${colorMap2.schematic.pin_number}; }
               .port-label { fill: ${colorMap2.schematic.reference}; }