@tscircuit/core 0.0.145 → 0.0.147

package/dist/index.js

@@ -25,6 +25,7 @@ __export(components_exports, {
   Net: () => Net,
   NetAlias: () => NetAlias,
   NormalComponent: () => NormalComponent,
+  PinHeader: () => PinHeader,
   PlatedHole: () => PlatedHole,
   Port: () => Port,
   PowerSource: () => PowerSource,
@@ -789,6 +790,20 @@ var PrimitiveComponent = class extends Renderable {
     }
     return descendants;
   }
+  /**
+   * Return the number of pins in this component, this is important for
+   * NormalComponents
+   */
+  _getPinCount() {
+    return 0;
+  }
+  /**
+   * If this component represents a SchematicBox (like a Chip), return the
+   * dimensions of the box, which allows computing the position of ports etc.
+   */
+  _getSchematicBoxDimensions() {
+    return null;
+  }
   // TODO we shouldn't need to override this, errors can be rendered and handled
   // by the Renderable class, however, the Renderable class currently doesn't
   // have access to the database or cleanup
@@ -1614,23 +1629,28 @@ var Port = class extends PrimitiveComponent {
     return this._getPcbCircuitJsonBounds().center;
   }
   _getGlobalSchematicPositionBeforeLayout() {
-    if (!this.schematicSymbolPortDef) {
-      return applyToPoint4(this.parent.computeSchematicGlobalTransform(), {
-        x: 0,
-        y: 0
-      });
-    }
     const symbol = this.parent?.getSchematicSymbol();
-    if (!symbol) {
-      console.warn(`Could not find parent symbol for ${this}`);
-      return { x: 0, y: 0 };
-    }
-    const offsetY = -0.045;
-    const transform = compose3(
-      this.parent.computeSchematicGlobalTransform(),
-      translate3(-symbol.center.x, -symbol.center.y + offsetY)
-    );
-    return applyToPoint4(transform, this.schematicSymbolPortDef);
+    if (symbol && this.schematicSymbolPortDef) {
+      const transform = compose3(
+        this.parent.computeSchematicGlobalTransform(),
+        translate3(-symbol.center.x, -symbol.center.y)
+      );
+      return applyToPoint4(transform, this.schematicSymbolPortDef);
+    }
+    const parentBoxDim = this?.parent?._getSchematicBoxDimensions();
+    if (parentBoxDim && this.props.pinNumber !== void 0) {
+      const localPortPosition = parentBoxDim.getPortPositionByPinNumber(
+        this.props.pinNumber
+      );
+      if (!localPortPosition) {
+        return { x: 0, y: 0 };
+      }
+      return applyToPoint4(
+        this.parent.computeSchematicGlobalTransform(),
+        localPortPosition
+      );
+    }
+    return { x: 0, y: 0 };
   }
   _getGlobalSchematicPositionAfterLayout() {
     const { db } = this.root;
@@ -1748,17 +1768,16 @@ var Port = class extends PrimitiveComponent {
     const container = this.getPrimitiveContainer();
     if (!container) return;
     const containerCenter = container._getGlobalSchematicPositionBeforeLayout();
-    let center = this._getGlobalSchematicPositionBeforeLayout();
-    if ("schematicDimensions" in container && props.pinNumber !== void 0) {
-      const chipDims = container.schematicDimensions;
-      center = chipDims.getPortPositionByPinNumber(props.pinNumber);
-      center.x += containerCenter.x;
-      center.y += containerCenter.y;
+    const portCenter = this._getGlobalSchematicPositionBeforeLayout();
+    let localPortInfo = null;
+    const containerDims = container._getSchematicBoxDimensions();
+    if (containerDims && props.pinNumber !== void 0) {
+      localPortInfo = containerDims.getPortPositionByPinNumber(props.pinNumber);
     }
     if (this.getSubcircuit().props._schDebugObjectsEnabled) {
       db.schematic_debug_object.insert({
         shape: "rect",
-        center,
+        center: portCenter,
         size: {
           width: 0.1,
           height: 0.1
@@ -1766,12 +1785,16 @@ var Port = class extends PrimitiveComponent {
         label: "obstacle"
       });
     }
-    this.facingDirection = getRelativeDirection(containerCenter, center);
+    this.facingDirection = getRelativeDirection(containerCenter, portCenter);
     const schematic_port = db.schematic_port.insert({
       schematic_component_id: this.parent?.schematic_component_id,
-      center,
+      center: portCenter,
       source_port_id: this.source_port_id,
-      facing_direction: this.facingDirection
+      facing_direction: this.facingDirection,
+      distance_from_component_edge: localPortInfo?.distanceFromEdge,
+      side_of_component: localPortInfo?.side,
+      pin_number: props.pinNumber,
+      true_ccw_index: localPortInfo?.trueIndex
     });
     this.schematic_port_id = schematic_port.schematic_port_id;
   }
@@ -1804,7 +1827,7 @@ import {
   isValidElement
 } from "react";
 import { symbols as symbols2 } from "schematic-symbols";
-import { z as z4 } from "zod";
+import { z as z5 } from "zod";
 
 // lib/components/primitive-components/Footprint.ts
 import { footprintProps } from "@tscircuit/props";
@@ -2015,261 +2038,576 @@ var Footprint = class extends PrimitiveComponent {
   }
 };
 
-// lib/components/base-components/NormalComponent.ts
-var debug2 = Debug2("tscircuit:core");
-var rotation3 = z4.object({
-  x: rotation,
-  y: rotation,
-  z: rotation
-});
-var NormalComponent = class extends PrimitiveComponent {
-  reactSubtrees = [];
-  isPrimitiveContainer = true;
-  constructor(props) {
-    super(props);
-    this._addChildrenFromStringFootprint();
-    this.initPorts();
+// lib/utils/schematic/getSizeOfSidesFromPortArrangement.ts
+var hasExplicitPinMapping = (pa) => {
+  for (const side of [
+    "leftSide",
+    "rightSide",
+    "topSide",
+    "bottomSide"
+  ]) {
+    if (side in pa && typeof pa[side] === "number") {
+      throw new Error(
+        `A number was specified for "${side}", you probably meant to use "size" not "side"`
+      );
+    }
   }
-  /**
-   * Override this method for better control over the auto-discovery of ports.
-   *
-   * If you override this method just do something like:
-   * initPorts() {
-   *   this.add(new Port({ pinNumber: 1, aliases: ["anode", "pos"] }))
-   *   this.add(new Port({ pinNumber: 2, aliases: ["cathode", "neg"] }))
-   * }
-   *
-   * By default, we'll pull the ports from the first place we find them:
-   * 1. `config.schematicSymbolName`
-   * 2. `props.footprint`
-   *
-   */
-  initPorts() {
-    const { config } = this;
-    const portsToCreate = [];
-    const schPortArrangement = this._parsedProps.schPortArrangement;
-    if (schPortArrangement) {
-      for (const side in schPortArrangement) {
-        const pins = schPortArrangement[side].pins;
-        if (Array.isArray(pins)) {
-          for (const pinNumber of pins) {
-            portsToCreate.push(
-              new Port(
-                {
-                  pinNumber
-                },
-                {
-                  originDescription: `schPortArrangement:${side}`
-                }
-              )
-            );
-          }
-        }
-      }
-      const sides = ["left", "right", "top", "bottom"];
-      let pinNum = 1;
-      for (const side of sides) {
-        const size = schPortArrangement[`${side}Size`];
-        for (let i = 0; i < size; i++) {
-          portsToCreate.push(
-            new Port(
-              {
-                pinNumber: pinNum++
-              },
-              {
-                originDescription: `schPortArrangement:${side}`
-              }
-            )
-          );
-        }
-      }
+  return "leftSide" in pa || "rightSide" in pa || "topSide" in pa || "bottomSide" in pa;
+};
+var getSizeOfSidesFromPortArrangement = (pa) => {
+  if (hasExplicitPinMapping(pa)) {
+    return {
+      leftSize: pa.leftSide?.pins.length ?? 0,
+      rightSize: pa.rightSide?.pins.length ?? 0,
+      topSize: pa.topSide?.pins.length ?? 0,
+      bottomSize: pa.bottomSide?.pins.length ?? 0
+    };
+  }
+  const { leftSize = 0, rightSize = 0, topSize = 0, bottomSize = 0 } = pa;
+  return { leftSize, rightSize, topSize, bottomSize };
+};
+
+// lib/utils/schematic/getAllDimensionsForSchematicBox.ts
+function isExplicitPinMappingArrangement(arrangement) {
+  return arrangement.leftSide !== void 0;
+}
+var getAllDimensionsForSchematicBox = (params) => {
+  const componentMargin = params.schPinSpacing;
+  let sidePinCounts = params.schPortArrangement ? getSizeOfSidesFromPortArrangement(params.schPortArrangement) : null;
+  const sideLengths = {
+    left: 0,
+    right: 0,
+    top: 0,
+    bottom: 0
+  };
+  let pinCount = params.pinCount ?? null;
+  if (pinCount === null) {
+    if (sidePinCounts) {
+      pinCount = sidePinCounts.leftSize + sidePinCounts.rightSize + sidePinCounts.topSize + sidePinCounts.bottomSize;
+    } else {
+      throw new Error("Could not determine pin count for the schematic box");
     }
-    const pinLabels = this._parsedProps.pinLabels;
-    if (pinLabels) {
-      for (let [pinNumber, label] of Object.entries(pinLabels)) {
-        pinNumber = pinNumber.replace("pin", "");
-        let existingPort = portsToCreate.find(
-          (p) => p._parsedProps.pinNumber === Number(pinNumber)
-        );
-        const primaryLabel = Array.isArray(label) ? label[0] : label;
-        const otherLabels = Array.isArray(label) ? label.slice(1) : [];
-        if (!existingPort) {
-          existingPort = new Port(
-            {
-              pinNumber: parseInt(pinNumber),
-              name: primaryLabel,
-              aliases: otherLabels
-            },
-            {
-              originDescription: `pinLabels:pin${pinNumber}`
-            }
-          );
-          portsToCreate.push(existingPort);
+  }
+  if (pinCount && !sidePinCounts) {
+    const rightSize = Math.floor(pinCount / 2);
+    sidePinCounts = {
+      leftSize: pinCount - rightSize,
+      rightSize,
+      topSize: 0,
+      bottomSize: 0
+    };
+  }
+  if (!sidePinCounts) {
+    sidePinCounts = {
+      leftSize: 0,
+      rightSize: 0,
+      topSize: 0,
+      bottomSize: 0
+    };
+  }
+  const schWidth = params.schWidth ?? Math.max(sidePinCounts.topSize, sidePinCounts.bottomSize) * params.schPinSpacing + 2 * componentMargin;
+  const schHeight = params.schHeight ?? Math.max(sidePinCounts.leftSize, sidePinCounts.rightSize) * params.schPinSpacing + 2 * componentMargin;
+  const distributePorts = (sideSize, sideLength, totalMargin) => {
+    if (sideSize <= 1) return 0;
+    return (sideLength - totalMargin) / (sideSize - 1);
+  };
+  const orderedTruePorts = [];
+  let truePinIndex = 0;
+  const processSide = (side, pins, direction) => {
+    const isVertical = side === "left" || side === "right";
+    const sideLength = isVertical ? schHeight : schWidth;
+    let totalMargin = 0;
+    for (const pin of pins) {
+      const pinStyle = params.schPinStyle?.[`pin${pin}`] ?? params.schPinStyle?.[pin];
+      if (pinStyle) {
+        if (isVertical) {
+          totalMargin += (pinStyle.topMargin ?? 0) + (pinStyle.bottomMargin ?? 0);
         } else {
-          existingPort.externallyAddedAliases.push(primaryLabel, ...otherLabels);
-          existingPort.props.name = primaryLabel;
+          totalMargin += (pinStyle.leftMargin ?? 0) + (pinStyle.rightMargin ?? 0);
         }
       }
     }
-    if (config.schematicSymbolName) {
-      const sym = symbols2[`${config.schematicSymbolName}_horz`];
-      if (!sym) return;
-      for (const symPort of sym.ports) {
-        const port = getPortFromHints(symPort.labels);
-        if (port) {
-          port.originDescription = `schematicSymbol:labels[0]:${symPort.labels[0]}`;
-          port.schematicSymbolPortDef = symPort;
-          portsToCreate.push(port);
+    const spacing = distributePorts(
+      pins.length,
+      sideLength - 2 * componentMargin,
+      totalMargin
+    );
+    let currentDistanceFromEdge = componentMargin;
+    pins.forEach((pinNumber, index) => {
+      const pinStyle = params.schPinStyle?.[`pin${pinNumber}`] ?? params.schPinStyle?.[pinNumber];
+      if (pinStyle) {
+        if (isVertical) {
+          if (side === "left") {
+            currentDistanceFromEdge += direction === "top-to-bottom" ? pinStyle.topMargin ?? 0 : pinStyle.bottomMargin ?? 0;
+          } else {
+            currentDistanceFromEdge += direction === "top-to-bottom" ? pinStyle.bottomMargin ?? 0 : pinStyle.topMargin ?? 0;
+          }
+        } else {
+          if (side === "top") {
+            currentDistanceFromEdge += direction === "left-to-right" ? pinStyle.leftMargin ?? 0 : pinStyle.rightMargin ?? 0;
+          } else {
+            currentDistanceFromEdge += direction === "left-to-right" ? pinStyle.rightMargin ?? 0 : pinStyle.leftMargin ?? 0;
+          }
         }
       }
-      this.addAll(portsToCreate);
-      return;
-    }
-    const portsFromFootprint = this.getPortsFromFootprint();
-    for (const port of portsFromFootprint) {
-      if (!portsToCreate.some((p) => p.isMatchingAnyOf(port.getNameAndAliases()))) {
-        portsToCreate.push(port);
+      orderedTruePorts.push({
+        trueIndex: truePinIndex,
+        pinNumber,
+        side,
+        distanceFromEdge: currentDistanceFromEdge,
+        x: 0,
+        y: 0
+      });
+      if (pinStyle) {
+        if (isVertical) {
+          if (side === "left") {
+            currentDistanceFromEdge += direction === "top-to-bottom" ? pinStyle.bottomMargin ?? 0 : pinStyle.topMargin ?? 0;
+          } else {
+            currentDistanceFromEdge += direction === "top-to-bottom" ? pinStyle.topMargin ?? 0 : pinStyle.bottomMargin ?? 0;
+          }
+        } else {
+          if (side === "top") {
+            currentDistanceFromEdge += direction === "left-to-right" ? pinStyle.rightMargin ?? 0 : pinStyle.leftMargin ?? 0;
+          } else {
+            currentDistanceFromEdge += direction === "left-to-right" ? pinStyle.leftMargin ?? 0 : pinStyle.rightMargin ?? 0;
+          }
+        }
       }
-    }
-    if (portsToCreate.length > 0) {
-      this.addAll(portsToCreate);
-    }
-  }
-  _addChildrenFromStringFootprint() {
-    const { footprint } = this.props;
-    if (!footprint) return;
-    if (typeof footprint === "string") {
-      const fpSoup = fp.string(footprint).soup();
-      const fpComponents = createComponentsFromSoup(fpSoup);
-      this.addAll(fpComponents);
-    }
-  }
-  get portMap() {
-    return new Proxy(
-      {},
-      {
-        get: (target, prop) => {
-          const port = this.children.find(
-            (c) => c.componentName === "Port" && c.isMatchingNameOrAlias(prop)
-          );
-          if (!port) {
-            throw new Error(
-              `There was an issue finding the port "${prop.toString()}" inside of a ${this.componentName} component with name: "${this.props.name}". This is a bug in @tscircuit/core`
-            );
-          }
-          return port;
-        }
-      }
-    );
-  }
-  getInstanceForReactElement(element) {
-    for (const subtree of this.reactSubtrees) {
-      if (subtree.element === element) return subtree.component;
-    }
-    return null;
-  }
-  doInitialSourceRender() {
-    const ftype = this.config.sourceFtype;
-    if (!ftype) return;
-    const { db } = this.root;
-    const { _parsedProps: props } = this;
-    const source_component = db.source_component.insert({
-      ftype,
-      name: props.name,
-      manufacturer_part_number: props.manufacturerPartNumber ?? props.mfn,
-      supplier_part_numbers: props.supplierPartNumbers
+      currentDistanceFromEdge += spacing;
+      truePinIndex++;
     });
-    this.source_component_id = source_component.source_component_id;
-  }
-  /**
-   * Render the schematic component for this NormalComponent using the
-   * config.schematicSymbolName if it exists.
-   *
-   * You can override this method to do more complicated things.
-   */
-  doInitialSchematicComponentRender() {
-    const { db } = this.root;
-    const { schematicSymbolName } = this.config;
-    if (!schematicSymbolName) return;
-    const base_symbol_name = this.config.schematicSymbolName;
-    const symbol_name_horz = `${base_symbol_name}_horz`;
-    let symbol_name;
-    if (!base_symbol_name) {
-      throw new Error(
-        "No schematic symbol defined (schematicSymbolName not provided)"
+    sideLengths[side] = sideLength;
+  };
+  if (params.schPortArrangement && isExplicitPinMappingArrangement(params.schPortArrangement)) {
+    if (params.schPortArrangement.leftSide) {
+      processSide(
+        "left",
+        params.schPortArrangement.leftSide.pins,
+        params.schPortArrangement.leftSide.direction ?? "top-to-bottom"
       );
     }
-    if (base_symbol_name in symbols2) {
-      symbol_name = base_symbol_name;
-    } else if (symbol_name_horz in symbols2) {
-      symbol_name = symbol_name_horz;
-    } else {
-      throw new Error(`Could not find schematic-symbol: "${base_symbol_name}"`);
+    if (params.schPortArrangement.rightSide) {
+      processSide(
+        "right",
+        params.schPortArrangement.rightSide.pins,
+        params.schPortArrangement.rightSide.direction ?? "bottom-to-top"
+      );
     }
-    const symbol = symbols2[symbol_name];
-    if (!symbol) {
-      throw new Error(`Could not find schematic-symbol "${symbol_name}"`);
+    if (params.schPortArrangement.topSide) {
+      processSide(
+        "top",
+        params.schPortArrangement.topSide.pins,
+        params.schPortArrangement.topSide.direction ?? "left-to-right"
+      );
     }
-    const schematic_component2 = db.schematic_component.insert({
-      center: { x: this.props.schX ?? 0, y: this.props.schY ?? 0 },
-      rotation: this.props.schRotation ?? 0,
-      size: symbol.size,
-      source_component_id: this.source_component_id,
-      symbol_name
-    });
-    this.schematic_component_id = schematic_component2.schematic_component_id;
+    if (params.schPortArrangement.bottomSide) {
+      processSide(
+        "bottom",
+        params.schPortArrangement.bottomSide.pins,
+        params.schPortArrangement.bottomSide.direction ?? "left-to-right"
+      );
+    }
+  } else {
+    const leftSide = Array.from(
+      { length: sidePinCounts.leftSize },
+      (_, i) => i + 1
+    );
+    const rightSide = Array.from(
+      { length: sidePinCounts.rightSize },
+      (_, i) => i + sidePinCounts.leftSize + 1
+    );
+    const topSide = Array.from(
+      { length: sidePinCounts.topSize },
+      (_, i) => i + sidePinCounts.leftSize + sidePinCounts.rightSize + 1
+    );
+    const bottomSide = Array.from(
+      {
+        length: pinCount - sidePinCounts.leftSize - sidePinCounts.rightSize - sidePinCounts.topSize
+      },
+      (_, i) => i + sidePinCounts.leftSize + sidePinCounts.rightSize + sidePinCounts.topSize + 1
+    );
+    processSide("left", leftSide, "top-to-bottom");
+    processSide("right", rightSide, "top-to-bottom");
+    processSide("top", topSide, "left-to-right");
+    processSide("bottom", bottomSide, "left-to-right");
   }
-  doInitialPcbComponentRender() {
-    const { db } = this.root;
-    const { _parsedProps: props } = this;
-    const pcb_component = db.pcb_component.insert({
-      center: this._getGlobalPcbPositionBeforeLayout(),
-      // width/height are computed in the PcbComponentSizeCalculation phase
-      width: 0,
-      height: 0,
-      layer: props.layer ?? "top",
-      rotation: props.pcbRotation ?? 0,
-      source_component_id: this.source_component_id
-    });
-    this.pcb_component_id = pcb_component.pcb_component_id;
+  const trueEdgePositions = {
+    left: { x: -schWidth / 2 - 0.2, y: schHeight / 2 },
+    bottom: { x: -schWidth / 2, y: schHeight / 2 + 0.2 },
+    right: { x: schWidth / 2 + 0.2, y: -schHeight / 2 },
+    top: { x: schWidth / 2, y: -schHeight / 2 - 0.2 }
+  };
+  const trueEdgeTraversalDirections = {
+    left: { x: 0, y: -1 },
+    right: { x: 0, y: 1 },
+    top: { x: -1, y: 0 },
+    bottom: { x: 1, y: 0 }
+  };
+  const truePortsWithPositions = orderedTruePorts.map((p) => {
+    const { distanceFromEdge, side } = p;
+    const edgePos = trueEdgePositions[side];
+    const edgeDir = trueEdgeTraversalDirections[side];
+    return {
+      ...p,
+      x: edgePos.x + distanceFromEdge * edgeDir.x,
+      y: edgePos.y + distanceFromEdge * edgeDir.y
+    };
+  });
+  return {
+    getPortPositionByPinNumber(pinNumber) {
+      const port = truePortsWithPositions.find(
+        (p) => p.pinNumber.toString() === pinNumber.toString()
+      );
+      if (!port) {
+        return null;
+      }
+      return port;
+    },
+    getSize() {
+      return { width: schWidth, height: schHeight };
+    },
+    pinCount
+  };
+};
+
+// lib/soup/underscorifyPortArrangement.ts
+var underscorifyPortArrangement = (portArrangement) => {
+  if (!portArrangement) return void 0;
+  if ("leftSide" in portArrangement || "rightSide" in portArrangement || "topSide" in portArrangement || "bottomSide" in portArrangement) {
+    return {
+      left_side: portArrangement.leftSide,
+      right_side: portArrangement.rightSide,
+      top_side: portArrangement.topSide,
+      bottom_side: portArrangement.bottomSide
+    };
   }
-  /**
-   * At this stage, the smtpads/pcb primitives are placed, so we can compute
-   * the width/height of the component
-   */
-  doInitialPcbComponentSizeCalculation() {
-    if (!this.pcb_component_id) return;
-    const { db } = this.root;
-    const { _parsedProps: props } = this;
-    const bounds = getBoundsOfPcbComponents(this.children);
-    if (bounds.width === 0 || bounds.height === 0) return;
-    const center = {
-      x: (bounds.minX + bounds.maxX) / 2,
-      y: (bounds.minY + bounds.maxY) / 2
+  if ("leftPinCount" in portArrangement || "rightPinCount" in portArrangement || "topPinCount" in portArrangement || "bottomPinCount" in portArrangement) {
+    return {
+      left_size: portArrangement.leftPinCount,
+      right_size: portArrangement.rightPinCount,
+      top_size: portArrangement.topPinCount,
+      bottom_size: portArrangement.bottomPinCount
     };
-    db.pcb_component.update(this.pcb_component_id, {
-      center,
-      width: bounds.width,
-      height: bounds.height
-    });
   }
-  _renderReactSubtree(element) {
+  if ("leftSize" in portArrangement || "rightSize" in portArrangement || "topSize" in portArrangement || "bottomSize" in portArrangement) {
     return {
-      element,
-      component: createInstanceFromReactElement(element)
+      left_size: portArrangement.leftSize,
+      right_size: portArrangement.rightSize,
+      top_size: portArrangement.topSize,
+      bottom_size: portArrangement.bottomSize
     };
   }
-  doInitialInitializePortsFromChildren() {
+  return void 0;
+};
+
+// lib/soup/underscorifyPinStyles.ts
+import "circuit-json";
+import "zod";
+var underscorifyPinStyles = (pinStyles) => {
+  if (!pinStyles) return void 0;
+  const underscorePinStyles = {};
+  for (const [pinName, pinStyle] of Object.entries(pinStyles)) {
+    underscorePinStyles[pinName] = {
+      bottom_margin: pinStyle.bottomMargin,
+      left_margin: pinStyle.leftMargin,
+      right_margin: pinStyle.rightMargin,
+      top_margin: pinStyle.topMargin
+    };
+  }
+  return underscorePinStyles;
+};
+
+// lib/components/base-components/NormalComponent.ts
+var debug2 = Debug2("tscircuit:core");
+var rotation3 = z5.object({
+  x: rotation,
+  y: rotation,
+  z: rotation
+});
+var NormalComponent = class extends PrimitiveComponent {
+  reactSubtrees = [];
+  _impliedFootprint;
+  isPrimitiveContainer = true;
+  constructor(props) {
+    super(props);
+    this._addChildrenFromStringFootprint();
     this.initPorts();
   }
-  doInitialReactSubtreesRender() {
-    if (isReactElement(this.props.footprint)) {
-      if (this.reactSubtrees.some((rs) => rs.element === this.props.footprint))
-        return;
-      const subtree = this._renderReactSubtree(this.props.footprint);
-      this.reactSubtrees.push(subtree);
-      this.add(subtree.component);
-    }
+  /**
+   * Override this method for better control over the auto-discovery of ports.
+   *
+   * If you override this method just do something like:
+   * initPorts() {
+   *   this.add(new Port({ pinNumber: 1, aliases: ["anode", "pos"] }))
+   *   this.add(new Port({ pinNumber: 2, aliases: ["cathode", "neg"] }))
+   * }
+   *
+   * By default, we'll pull the ports from the first place we find them:
+   * 1. `config.schematicSymbolName`
+   * 2. `props.footprint`
+   *
+   */
+  initPorts() {
+    const { config } = this;
+    const portsToCreate = [];
+    const schPortArrangement = this._parsedProps.schPortArrangement;
+    if (schPortArrangement) {
+      for (const side in schPortArrangement) {
+        const pins = schPortArrangement[side].pins;
+        if (Array.isArray(pins)) {
+          for (const pinNumber of pins) {
+            portsToCreate.push(
+              new Port(
+                {
+                  pinNumber
+                },
+                {
+                  originDescription: `schPortArrangement:${side}`
+                }
+              )
+            );
+          }
+        }
+      }
+      const sides = ["left", "right", "top", "bottom"];
+      let pinNum = 1;
+      for (const side of sides) {
+        const size = schPortArrangement[`${side}Size`];
+        for (let i = 0; i < size; i++) {
+          portsToCreate.push(
+            new Port(
+              {
+                pinNumber: pinNum++
+              },
+              {
+                originDescription: `schPortArrangement:${side}`
+              }
+            )
+          );
+        }
+      }
+    }
+    const pinLabels = this._parsedProps.pinLabels;
+    if (pinLabels) {
+      for (let [pinNumber, label] of Object.entries(pinLabels)) {
+        pinNumber = pinNumber.replace("pin", "");
+        let existingPort = portsToCreate.find(
+          (p) => p._parsedProps.pinNumber === Number(pinNumber)
+        );
+        const primaryLabel = Array.isArray(label) ? label[0] : label;
+        const otherLabels = Array.isArray(label) ? label.slice(1) : [];
+        if (!existingPort) {
+          existingPort = new Port(
+            {
+              pinNumber: parseInt(pinNumber),
+              name: primaryLabel,
+              aliases: otherLabels
+            },
+            {
+              originDescription: `pinLabels:pin${pinNumber}`
+            }
+          );
+          portsToCreate.push(existingPort);
+        } else {
+          existingPort.externallyAddedAliases.push(primaryLabel, ...otherLabels);
+          existingPort.props.name = primaryLabel;
+        }
+      }
+    }
+    if (config.schematicSymbolName) {
+      const sym = symbols2[`${config.schematicSymbolName}_horz`];
+      if (!sym) return;
+      for (const symPort of sym.ports) {
+        const port = getPortFromHints(symPort.labels);
+        if (port) {
+          port.originDescription = `schematicSymbol:labels[0]:${symPort.labels[0]}`;
+          port.schematicSymbolPortDef = symPort;
+          portsToCreate.push(port);
+        }
+      }
+      this.addAll(portsToCreate);
+      return;
+    }
+    const portsFromFootprint = this.getPortsFromFootprint();
+    for (const port of portsFromFootprint) {
+      if (!portsToCreate.some((p) => p.isMatchingAnyOf(port.getNameAndAliases()))) {
+        portsToCreate.push(port);
+      }
+    }
+    if (portsToCreate.length > 0) {
+      this.addAll(portsToCreate);
+    }
+  }
+  _getImpliedFootprintString() {
+    return null;
+  }
+  _addChildrenFromStringFootprint() {
+    let { footprint } = this.props;
+    footprint ??= this._getImpliedFootprintString?.();
+    if (!footprint) return;
+    if (typeof footprint === "string") {
+      const fpSoup = fp.string(footprint).soup();
+      const fpComponents = createComponentsFromSoup(fpSoup);
+      this.addAll(fpComponents);
+    }
+  }
+  get portMap() {
+    return new Proxy(
+      {},
+      {
+        get: (target, prop) => {
+          const port = this.children.find(
+            (c) => c.componentName === "Port" && c.isMatchingNameOrAlias(prop)
+          );
+          if (!port) {
+            throw new Error(
+              `There was an issue finding the port "${prop.toString()}" inside of a ${this.componentName} component with name: "${this.props.name}". This is a bug in @tscircuit/core`
+            );
+          }
+          return port;
+        }
+      }
+    );
+  }
+  getInstanceForReactElement(element) {
+    for (const subtree of this.reactSubtrees) {
+      if (subtree.element === element) return subtree.component;
+    }
+    return null;
+  }
+  doInitialSourceRender() {
+    const ftype = this.config.sourceFtype;
+    if (!ftype) return;
+    const { db } = this.root;
+    const { _parsedProps: props } = this;
+    const source_component = db.source_component.insert({
+      ftype,
+      name: props.name,
+      manufacturer_part_number: props.manufacturerPartNumber ?? props.mfn,
+      supplier_part_numbers: props.supplierPartNumbers
+    });
+    this.source_component_id = source_component.source_component_id;
+  }
+  /**
+   * Render the schematic component for this NormalComponent using the
+   * config.schematicSymbolName if it exists, or create a generic box if
+   * no symbol is defined.
+   *
+   * You can override this method to do more complicated things.
+   */
+  doInitialSchematicComponentRender() {
+    const { schematicSymbolName } = this.config;
+    if (schematicSymbolName) {
+      return this._doInitialSchematicComponentRenderWithSymbol();
+    }
+    const dimensions = this._getSchematicBoxDimensions();
+    if (dimensions) {
+      return this._doInitialSchematicComponentRenderWithSchematicBoxDimensions();
+    }
+  }
+  _doInitialSchematicComponentRenderWithSymbol() {
+    const { db } = this.root;
+    const base_symbol_name = this.config.schematicSymbolName;
+    const symbol_name_horz = `${base_symbol_name}_horz`;
+    let symbol_name;
+    if (!base_symbol_name) {
+      throw new Error(
+        "No schematic symbol defined (schematicSymbolName not provided)"
+      );
+    }
+    if (base_symbol_name in symbols2) {
+      symbol_name = base_symbol_name;
+    } else if (symbol_name_horz in symbols2) {
+      symbol_name = symbol_name_horz;
+    } else {
+      throw new Error(`Could not find schematic-symbol: "${base_symbol_name}"`);
+    }
+    const symbol = symbols2[symbol_name];
+    if (symbol) {
+      const schematic_component2 = db.schematic_component.insert({
+        center: { x: this.props.schX ?? 0, y: this.props.schY ?? 0 },
+        rotation: this.props.schRotation ?? 0,
+        size: symbol.size,
+        source_component_id: this.source_component_id,
+        symbol_name
+      });
+      this.schematic_component_id = schematic_component2.schematic_component_id;
+    }
+  }
+  _doInitialSchematicComponentRenderWithSchematicBoxDimensions() {
+    const { db } = this.root;
+    const { _parsedProps: props } = this;
+    const dimensions = this._getSchematicBoxDimensions();
+    const primaryPortLabels = {};
+    for (const [port, label] of Object.entries(props.pinLabels ?? {})) {
+      primaryPortLabels[port] = Array.isArray(label) ? label[0] : label;
+    }
+    const schematic_component2 = db.schematic_component.insert({
+      center: { x: props.schX ?? 0, y: props.schY ?? 0 },
+      rotation: props.schRotation ?? 0,
+      size: dimensions.getSize(),
+      port_arrangement: underscorifyPortArrangement(
+        props.schPortArrangement
+      ),
+      pin_spacing: props.schPinSpacing ?? 0.2,
+      // @ts-ignore soup needs to support distance for pin_styles
+      pin_styles: underscorifyPinStyles(props.schPinStyle),
+      port_labels: primaryPortLabels,
+      source_component_id: this.source_component_id
+    });
+    this.schematic_component_id = schematic_component2.schematic_component_id;
+  }
+  doInitialPcbComponentRender() {
+    const { db } = this.root;
+    const { _parsedProps: props } = this;
+    const pcb_component = db.pcb_component.insert({
+      center: this._getGlobalPcbPositionBeforeLayout(),
+      // width/height are computed in the PcbComponentSizeCalculation phase
+      width: 0,
+      height: 0,
+      layer: props.layer ?? "top",
+      rotation: props.pcbRotation ?? 0,
+      source_component_id: this.source_component_id
+    });
+    this.pcb_component_id = pcb_component.pcb_component_id;
+  }
+  /**
+   * At this stage, the smtpads/pcb primitives are placed, so we can compute
+   * the width/height of the component
+   */
+  doInitialPcbComponentSizeCalculation() {
+    if (!this.pcb_component_id) return;
+    const { db } = this.root;
+    const { _parsedProps: props } = this;
+    const bounds = getBoundsOfPcbComponents(this.children);
+    if (bounds.width === 0 || bounds.height === 0) return;
+    const center = {
+      x: (bounds.minX + bounds.maxX) / 2,
+      y: (bounds.minY + bounds.maxY) / 2
+    };
+    db.pcb_component.update(this.pcb_component_id, {
+      center,
+      width: bounds.width,
+      height: bounds.height
+    });
+  }
+  _renderReactSubtree(element) {
+    return {
+      element,
+      component: createInstanceFromReactElement(element)
+    };
+  }
+  doInitialInitializePortsFromChildren() {
+    this.initPorts();
+  }
+  doInitialReactSubtreesRender() {
+    if (isReactElement(this.props.footprint)) {
+      if (this.reactSubtrees.some((rs) => rs.element === this.props.footprint))
+        return;
+      const subtree = this._renderReactSubtree(this.props.footprint);
+      this.reactSubtrees.push(subtree);
+      this.add(subtree.component);
+    }
   }
   _hasExistingPortExactly(port1) {
     const existingPorts = this.children.filter(
@@ -2420,8 +2758,37 @@ var NormalComponent = class extends PrimitiveComponent {
       height: pcb_component.height
     };
   }
-  doInitialCadModelRender() {
-    const { db } = this.root;
+  _getPinCount() {
+    const schPortArrangement = this._getSchematicPortArrangement();
+    const pinCountFromSchArrangement = (schPortArrangement?.leftSize ?? 0) + (schPortArrangement?.rightSize ?? 0) + (schPortArrangement?.topSize ?? 0) + (schPortArrangement?.bottomSize ?? 0);
+    const pinCount = pinCountFromSchArrangement || this.getPortsFromFootprint().length;
+    return pinCount;
+  }
+  /**
+   * Override the schematic port arrangement if you want to customize where pins
+   * appear on a schematic box, e.g. for a pin header
+   */
+  _getSchematicPortArrangement() {
+    return this._parsedProps.schPortArrangement;
+  }
+  _getSchematicBoxDimensions() {
+    if (this.getSchematicSymbol()) return null;
+    if (!this.config.shouldRenderAsSchematicBox) return null;
+    const { _parsedProps: props } = this;
+    const pinCount = this._getPinCount();
+    const pinSpacing = props.schPinSpacing ?? 0.2;
+    const dimensions = getAllDimensionsForSchematicBox({
+      schWidth: props.schWidth,
+      schHeight: props.schHeight,
+      schPinSpacing: pinSpacing,
+      schPinStyle: props.schPinStyle,
+      pinCount,
+      schPortArrangement: this._getSchematicPortArrangement()
+    });
+    return dimensions;
+  }
+  doInitialCadModelRender() {
+    const { db } = this.root;
     const { boardThickness = 0 } = this.root?._getBoard() ?? {};
     const cadModel = this._parsedProps.cadModel;
     if (!this.pcb_component_id) return;
@@ -3425,421 +3792,126 @@ searched component ${targetComponent.getString()}, which has ports: ${targetComp
       ...position,
       layer: "top"
     }));
-    const bounds = computeObstacleBounds(obstacles);
-    const simpleRouteJsonInput = {
-      minTraceWidth: 0.1,
-      obstacles,
-      connections: [connection],
-      bounds,
-      layerCount: 1
-    };
-    let Autorouter = MultilayerIjump;
-    if (this.getSubcircuit().props._schDirectLineRoutingEnabled) {
-      Autorouter = DirectLineRouter;
-    }
-    const autorouter = new Autorouter({
-      input: simpleRouteJsonInput,
-      OBSTACLE_MARGIN: 0.1,
-      isRemovePathLoopsEnabled: true
-    });
-    const results = autorouter.solveAndMapToTraces();
-    if (results.length === 0) return;
-    const [result] = results;
-    const { route } = result;
-    const edges = [];
-    for (let i = 0; i < route.length - 1; i++) {
-      edges.push({
-        from: route[i],
-        to: route[i + 1]
-      });
-    }
-    const STUB_LENGTH = 0.15;
-    edges.unshift({
-      from: {
-        ...projectPointInDirection(
-          route[0],
-          portsWithPosition[0].facingDirection,
-          STUB_LENGTH
-        )
-      },
-      to: route[0],
-      from_schematic_port_id: portsWithPosition[0].schematic_port_id
-    });
-    edges.push({
-      from: route[route.length - 1],
-      to: {
-        ...projectPointInOppositeDirection(
-          route[route.length - 1],
-          portsWithPosition[1].facingDirection,
-          STUB_LENGTH
-        )
-      },
-      from_schematic_port_id: portsWithPosition[1].schematic_port_id
-    });
-    const trace = db.schematic_trace.insert({
-      source_trace_id: this.source_trace_id,
-      edges
-    });
-    this.schematic_trace_id = trace.schematic_trace_id;
-  }
-};
-
-// lib/components/normal-components/Capacitor.ts
-var Capacitor = class extends NormalComponent {
-  // @ts-ignore (cause the symbolName is string and not fixed)
-  get config() {
-    return {
-      componentName: "Capacitor",
-      schematicSymbolName: this.props.symbolName ?? "capacitor_horz",
-      zodProps: capacitorProps,
-      sourceFtype: FTYPE.simple_capacitor
-    };
-  }
-  initPorts() {
-    this.add(new Port({ name: "pin1", pinNumber: 1, aliases: ["anode", "pos", "left"] }));
-    this.add(new Port({ name: "pin2", pinNumber: 2, aliases: ["cathode", "neg", "right"] }));
-  }
-  doInitialCreateNetsFromProps() {
-    this._createNetsFromProps([
-      this.props.decouplingFor,
-      this.props.decouplingTo
-    ]);
-  }
-  doInitialCreateTracesFromProps() {
-    if (this.props.decouplingFor && this.props.decouplingTo) {
-      this.add(
-        new Trace({
-          from: `${this.getSubcircuitSelector()} > port.1`,
-          to: this.props.decouplingFor
-        })
-      );
-      this.add(
-        new Trace({
-          from: `${this.getSubcircuitSelector()} > port.2`,
-          to: this.props.decouplingTo
-        })
-      );
-    }
-  }
-  doInitialSourceRender() {
-    const { db } = this.root;
-    const { _parsedProps: props } = this;
-    const source_component = db.source_component.insert({
-      ftype: "simple_capacitor",
-      name: props.name,
-      // @ts-ignore
-      manufacturer_part_number: props.manufacturerPartNumber ?? props.mfn,
-      supplier_part_numbers: props.supplierPartNumbers,
-      capacitance: props.capacitance
-    });
-    this.source_component_id = source_component.source_component_id;
-  }
-};
-
-// lib/components/normal-components/Chip.ts
-import { chipProps } from "@tscircuit/props";
-
-// lib/soup/underscorifyPinStyles.ts
-import "circuit-json";
-import "zod";
-var underscorifyPinStyles = (pinStyles) => {
-  if (!pinStyles) return void 0;
-  const underscorePinStyles = {};
-  for (const [pinName, pinStyle] of Object.entries(pinStyles)) {
-    underscorePinStyles[pinName] = {
-      bottom_margin: pinStyle.bottomMargin,
-      left_margin: pinStyle.leftMargin,
-      right_margin: pinStyle.rightMargin,
-      top_margin: pinStyle.topMargin
-    };
-  }
-  return underscorePinStyles;
-};
-
-// lib/soup/underscorifyPortArrangement.ts
-var underscorifyPortArrangement = (portArrangement) => {
-  if (!portArrangement) return void 0;
-  if ("leftSide" in portArrangement || "rightSide" in portArrangement || "topSide" in portArrangement || "bottomSide" in portArrangement) {
-    return {
-      left_side: portArrangement.leftSide,
-      right_side: portArrangement.rightSide,
-      top_side: portArrangement.topSide,
-      bottom_side: portArrangement.bottomSide
-    };
-  }
-  if ("leftPinCount" in portArrangement || "rightPinCount" in portArrangement || "topPinCount" in portArrangement || "bottomPinCount" in portArrangement) {
-    return {
-      left_size: portArrangement.leftPinCount,
-      right_size: portArrangement.rightPinCount,
-      top_size: portArrangement.topPinCount,
-      bottom_size: portArrangement.bottomPinCount
-    };
-  }
-  if ("leftSize" in portArrangement || "rightSize" in portArrangement || "topSize" in portArrangement || "bottomSize" in portArrangement) {
-    return {
-      left_size: portArrangement.leftSize,
-      right_size: portArrangement.rightSize,
-      top_size: portArrangement.topSize,
-      bottom_size: portArrangement.bottomSize
-    };
-  }
-  return void 0;
-};
-
-// lib/utils/schematic/getSizeOfSidesFromPortArrangement.ts
-var hasExplicitPinMapping = (pa) => {
-  for (const side of [
-    "leftSide",
-    "rightSide",
-    "topSide",
-    "bottomSide"
-  ]) {
-    if (side in pa && typeof pa[side] === "number") {
-      throw new Error(
-        `A number was specified for "${side}", you probably meant to use "size" not "side"`
-      );
-    }
-  }
-  return "leftSide" in pa || "rightSide" in pa || "topSide" in pa || "bottomSide" in pa;
-};
-var getSizeOfSidesFromPortArrangement = (pa) => {
-  if (hasExplicitPinMapping(pa)) {
-    return {
-      leftSize: pa.leftSide?.pins.length ?? 0,
-      rightSize: pa.rightSide?.pins.length ?? 0,
-      topSize: pa.topSide?.pins.length ?? 0,
-      bottomSize: pa.bottomSide?.pins.length ?? 0
-    };
-  }
-  const { leftSize = 0, rightSize = 0, topSize = 0, bottomSize = 0 } = pa;
-  return { leftSize, rightSize, topSize, bottomSize };
-};
-
-// lib/utils/schematic/getAllDimensionsForSchematicBox.ts
-function isExplicitPinMappingArrangement(arrangement) {
-  return arrangement.leftSide !== void 0;
-}
-var getAllDimensionsForSchematicBox = (params) => {
-  const componentMargin = params.schPinSpacing;
-  let sidePinCounts = params.schPortArrangement ? getSizeOfSidesFromPortArrangement(params.schPortArrangement) : null;
-  const sideLengths = {
-    left: 0,
-    right: 0,
-    top: 0,
-    bottom: 0
-  };
-  let pinCount = params.pinCount ?? null;
-  if (pinCount === null) {
-    if (sidePinCounts) {
-      pinCount = sidePinCounts.leftSize + sidePinCounts.rightSize + sidePinCounts.topSize + sidePinCounts.bottomSize;
-    } else {
-      throw new Error("Could not determine pin count for the schematic box");
-    }
-  }
-  if (pinCount && !sidePinCounts) {
-    const rightSize = Math.floor(pinCount / 2);
-    sidePinCounts = {
-      leftSize: pinCount - rightSize,
-      rightSize,
-      topSize: 0,
-      bottomSize: 0
-    };
-  }
-  if (!sidePinCounts) {
-    sidePinCounts = {
-      leftSize: 0,
-      rightSize: 0,
-      topSize: 0,
-      bottomSize: 0
-    };
-  }
-  const schWidth = params.schWidth ?? Math.max(sidePinCounts.topSize, sidePinCounts.bottomSize) * params.schPinSpacing + 2 * componentMargin;
-  const schHeight = params.schHeight ?? Math.max(sidePinCounts.leftSize, sidePinCounts.rightSize) * params.schPinSpacing + 2 * componentMargin;
-  const distributePorts = (sideSize, sideLength, totalMargin) => {
-    if (sideSize <= 1) return 0;
-    return (sideLength - totalMargin) / (sideSize - 1);
-  };
-  const orderedTruePorts = [];
-  let truePinIndex = 0;
-  const processSide = (side, pins, direction) => {
-    const isVertical = side === "left" || side === "right";
-    const sideLength = isVertical ? schHeight : schWidth;
-    let totalMargin = 0;
-    for (const pin of pins) {
-      const pinStyle = params.schPinStyle?.[`pin${pin}`] ?? params.schPinStyle?.[pin];
-      if (pinStyle) {
-        if (isVertical) {
-          totalMargin += (pinStyle.topMargin ?? 0) + (pinStyle.bottomMargin ?? 0);
-        } else {
-          totalMargin += (pinStyle.leftMargin ?? 0) + (pinStyle.rightMargin ?? 0);
-        }
-      }
-    }
-    const spacing = distributePorts(
-      pins.length,
-      sideLength - 2 * componentMargin,
-      totalMargin
-    );
-    let currentDistanceFromEdge = componentMargin;
-    pins.forEach((pinNumber, index) => {
-      const pinStyle = params.schPinStyle?.[`pin${pinNumber}`] ?? params.schPinStyle?.[pinNumber];
-      if (pinStyle) {
-        if (isVertical) {
-          if (side === "left") {
-            currentDistanceFromEdge += direction === "top-to-bottom" ? pinStyle.topMargin ?? 0 : pinStyle.bottomMargin ?? 0;
-          } else {
-            currentDistanceFromEdge += direction === "top-to-bottom" ? pinStyle.bottomMargin ?? 0 : pinStyle.topMargin ?? 0;
-          }
-        } else {
-          if (side === "top") {
-            currentDistanceFromEdge += direction === "left-to-right" ? pinStyle.leftMargin ?? 0 : pinStyle.rightMargin ?? 0;
-          } else {
-            currentDistanceFromEdge += direction === "left-to-right" ? pinStyle.rightMargin ?? 0 : pinStyle.leftMargin ?? 0;
-          }
-        }
-      }
-      orderedTruePorts.push({
-        trueIndex: truePinIndex,
-        pinNumber,
-        side,
-        distanceFromEdge: currentDistanceFromEdge,
-        x: 0,
-        y: 0
-      });
-      if (pinStyle) {
-        if (isVertical) {
-          if (side === "left") {
-            currentDistanceFromEdge += direction === "top-to-bottom" ? pinStyle.bottomMargin ?? 0 : pinStyle.topMargin ?? 0;
-          } else {
-            currentDistanceFromEdge += direction === "top-to-bottom" ? pinStyle.topMargin ?? 0 : pinStyle.bottomMargin ?? 0;
-          }
-        } else {
-          if (side === "top") {
-            currentDistanceFromEdge += direction === "left-to-right" ? pinStyle.rightMargin ?? 0 : pinStyle.leftMargin ?? 0;
-          } else {
-            currentDistanceFromEdge += direction === "left-to-right" ? pinStyle.leftMargin ?? 0 : pinStyle.rightMargin ?? 0;
-          }
-        }
-      }
-      currentDistanceFromEdge += spacing;
-      truePinIndex++;
-    });
-    sideLengths[side] = sideLength;
-  };
-  if (params.schPortArrangement && isExplicitPinMappingArrangement(params.schPortArrangement)) {
-    if (params.schPortArrangement.leftSide) {
-      processSide(
-        "left",
-        params.schPortArrangement.leftSide.pins,
-        params.schPortArrangement.leftSide.direction ?? "top-to-bottom"
-      );
-    }
-    if (params.schPortArrangement.rightSide) {
-      processSide(
-        "right",
-        params.schPortArrangement.rightSide.pins,
-        params.schPortArrangement.rightSide.direction ?? "bottom-to-top"
-      );
-    }
-    if (params.schPortArrangement.topSide) {
-      processSide(
-        "top",
-        params.schPortArrangement.topSide.pins,
-        params.schPortArrangement.topSide.direction ?? "left-to-right"
-      );
+    const bounds = computeObstacleBounds(obstacles);
+    const simpleRouteJsonInput = {
+      minTraceWidth: 0.1,
+      obstacles,
+      connections: [connection],
+      bounds,
+      layerCount: 1
+    };
+    let Autorouter = MultilayerIjump;
+    if (this.getSubcircuit().props._schDirectLineRoutingEnabled) {
+      Autorouter = DirectLineRouter;
     }
-    if (params.schPortArrangement.bottomSide) {
-      processSide(
-        "bottom",
-        params.schPortArrangement.bottomSide.pins,
-        params.schPortArrangement.bottomSide.direction ?? "left-to-right"
-      );
+    const autorouter = new Autorouter({
+      input: simpleRouteJsonInput,
+      OBSTACLE_MARGIN: 0.1,
+      isRemovePathLoopsEnabled: true
+    });
+    const results = autorouter.solveAndMapToTraces();
+    if (results.length === 0) return;
+    const [result] = results;
+    const { route } = result;
+    const edges = [];
+    for (let i = 0; i < route.length - 1; i++) {
+      edges.push({
+        from: route[i],
+        to: route[i + 1]
+      });
     }
-  } else {
-    const leftSide = Array.from(
-      { length: sidePinCounts.leftSize },
-      (_, i) => i + 1
-    );
-    const rightSide = Array.from(
-      { length: sidePinCounts.rightSize },
-      (_, i) => i + sidePinCounts.leftSize + 1
-    );
-    const topSide = Array.from(
-      { length: sidePinCounts.topSize },
-      (_, i) => i + sidePinCounts.leftSize + sidePinCounts.rightSize + 1
-    );
-    const bottomSide = Array.from(
-      {
-        length: pinCount - sidePinCounts.leftSize - sidePinCounts.rightSize - sidePinCounts.topSize
+    const STUB_LENGTH = 0.15;
+    edges.unshift({
+      from: {
+        ...projectPointInDirection(
+          route[0],
+          portsWithPosition[0].facingDirection,
+          STUB_LENGTH
+        )
       },
-      (_, i) => i + sidePinCounts.leftSize + sidePinCounts.rightSize + sidePinCounts.topSize + 1
-    );
-    processSide("left", leftSide, "top-to-bottom");
-    processSide("right", rightSide, "top-to-bottom");
-    processSide("top", topSide, "left-to-right");
-    processSide("bottom", bottomSide, "left-to-right");
+      to: route[0],
+      from_schematic_port_id: portsWithPosition[0].schematic_port_id
+    });
+    edges.push({
+      from: route[route.length - 1],
+      to: {
+        ...projectPointInOppositeDirection(
+          route[route.length - 1],
+          portsWithPosition[1].facingDirection,
+          STUB_LENGTH
+        )
+      },
+      from_schematic_port_id: portsWithPosition[1].schematic_port_id
+    });
+    const trace = db.schematic_trace.insert({
+      source_trace_id: this.source_trace_id,
+      edges
+    });
+    this.schematic_trace_id = trace.schematic_trace_id;
   }
-  const trueEdgePositions = {
-    left: { x: -schWidth / 2 - 0.2, y: schHeight / 2 },
-    bottom: { x: -schWidth / 2, y: schHeight / 2 + 0.2 },
-    right: { x: schWidth / 2 + 0.2, y: -schHeight / 2 },
-    top: { x: schWidth / 2, y: -schHeight / 2 - 0.2 }
-  };
-  const trueEdgeTraversalDirections = {
-    left: { x: 0, y: -1 },
-    right: { x: 0, y: 1 },
-    top: { x: -1, y: 0 },
-    bottom: { x: 1, y: 0 }
-  };
-  const truePortsWithPositions = orderedTruePorts.map((p) => {
-    const { distanceFromEdge, side } = p;
-    if (side === "center") {
-      return {
-        ...p,
-        x: 0,
-        y: 0
-      };
-    }
-    const edgePos = trueEdgePositions[side];
-    const edgeDir = trueEdgeTraversalDirections[side];
+};
+
+// lib/components/normal-components/Capacitor.ts
+var Capacitor = class extends NormalComponent {
+  // @ts-ignore (cause the symbolName is string and not fixed)
+  get config() {
     return {
-      ...p,
-      x: edgePos.x + distanceFromEdge * edgeDir.x,
-      y: edgePos.y + distanceFromEdge * edgeDir.y
+      componentName: "Capacitor",
+      schematicSymbolName: this.props.symbolName ?? "capacitor_horz",
+      zodProps: capacitorProps,
+      sourceFtype: FTYPE.simple_capacitor
     };
-  });
-  return {
-    getPortPositionByPinNumber(pinNumber) {
-      const port = truePortsWithPositions.find(
-        (p) => p.pinNumber.toString() === pinNumber.toString()
+  }
+  initPorts() {
+    this.add(new Port({ name: "pin1", pinNumber: 1, aliases: ["anode", "pos", "left"] }));
+    this.add(new Port({ name: "pin2", pinNumber: 2, aliases: ["cathode", "neg", "right"] }));
+  }
+  doInitialCreateNetsFromProps() {
+    this._createNetsFromProps([
+      this.props.decouplingFor,
+      this.props.decouplingTo
+    ]);
+  }
+  doInitialCreateTracesFromProps() {
+    if (this.props.decouplingFor && this.props.decouplingTo) {
+      this.add(
+        new Trace({
+          from: `${this.getSubcircuitSelector()} > port.1`,
+          to: this.props.decouplingFor
+        })
       );
-      if (!port) {
-        return {
-          trueIndex: -1,
-          // Use -1 for non-existent ports
-          pinNumber,
-          side: "center",
-          distanceFromEdge: 0,
-          x: 0,
-          y: 0
-        };
-      }
-      return port;
-    },
-    getSize() {
-      return { width: schWidth, height: schHeight };
-    },
-    pinCount
-  };
+      this.add(
+        new Trace({
+          from: `${this.getSubcircuitSelector()} > port.2`,
+          to: this.props.decouplingTo
+        })
+      );
+    }
+  }
+  doInitialSourceRender() {
+    const { db } = this.root;
+    const { _parsedProps: props } = this;
+    const source_component = db.source_component.insert({
+      ftype: "simple_capacitor",
+      name: props.name,
+      // @ts-ignore
+      manufacturer_part_number: props.manufacturerPartNumber ?? props.mfn,
+      supplier_part_numbers: props.supplierPartNumbers,
+      capacitance: props.capacitance
+    });
+    this.source_component_id = source_component.source_component_id;
+  }
 };
 
 // lib/components/normal-components/Chip.ts
+import { chipProps } from "@tscircuit/props";
 var Chip = class extends NormalComponent {
-  schematicDimensions = null;
+  schematicBoxDimensions = null;
   get config() {
     return {
       componentName: "Chip",
-      zodProps: chipProps
+      zodProps: chipProps,
+      shouldRenderAsSchematicBox: true
     };
   }
   doInitialSourceRender() {
@@ -3853,43 +3925,6 @@ var Chip = class extends NormalComponent {
     });
     this.source_component_id = source_component.source_component_id;
   }
-  doInitialSchematicComponentRender() {
-    const { db } = this.root;
-    const { _parsedProps: props } = this;
-    const pinCountFromSchArrangement = (props.schPortArrangement?.leftSize ?? 0) + (props.schPortArrangement?.rightSize ?? 0) + (props.schPortArrangement?.topSize ?? 0) + (props.schPortArrangement?.bottomSize ?? 0);
-    const pinCount = pinCountFromSchArrangement || this.getPortsFromFootprint().length;
-    const pinSpacing = props.schPinSpacing ?? 0.2;
-    const dimensions = getAllDimensionsForSchematicBox({
-      schWidth: props.schWidth,
-      schHeight: props.schHeight,
-      schPinSpacing: pinSpacing,
-      schPinStyle: props.schPinStyle,
-      pinCount,
-      // @ts-ignore there's a subtley in the definition difference with
-      // leftSide/rightSide/topSide/bottomSide in how the direction is defined
-      // that doesn't really matter
-      schPortArrangement: props.schPortArrangement
-    });
-    this.schematicDimensions = dimensions;
-    const primaryPortLabels = {};
-    for (const [port, label] of Object.entries(props.pinLabels ?? {})) {
-      primaryPortLabels[port] = Array.isArray(label) ? label[0] : label;
-    }
-    const schematic_component2 = db.schematic_component.insert({
-      center: { x: props.schX ?? 0, y: props.schY ?? 0 },
-      rotation: props.schRotation ?? 0,
-      size: dimensions.getSize(),
-      port_arrangement: underscorifyPortArrangement(
-        props.schPortArrangement
-      ),
-      pin_spacing: pinSpacing,
-      // @ts-ignore soup needs to support distance for pin_styles
-      pin_styles: underscorifyPinStyles(props.schPinStyle),
-      port_labels: primaryPortLabels,
-      source_component_id: this.source_component_id
-    });
-    this.schematic_component_id = schematic_component2.schematic_component_id;
-  }
   doInitialPcbComponentRender() {
     const { db } = this.root;
     const { _parsedProps: props } = this;
@@ -3940,7 +3975,8 @@ var Jumper = class extends NormalComponent {
   get config() {
     return {
       componentName: "Jumper",
-      zodProps: jumperProps
+      zodProps: jumperProps,
+      shouldRenderAsSchematicBox: true
     };
   }
   doInitialSourceRender() {
@@ -3955,41 +3991,6 @@ var Jumper = class extends NormalComponent {
     });
     this.source_component_id = source_component.source_component_id;
   }
-  doInitialSchematicComponentRender() {
-    const { db } = this.root;
-    const { _parsedProps: props } = this;
-    const ports = this.children.filter((child) => child instanceof Port);
-    const pinSpacing = props.schPinSpacing ?? 0.2;
-    const dimensions = getAllDimensionsForSchematicBox({
-      schWidth: props.schWidth,
-      schHeight: props.schHeight,
-      schPinSpacing: pinSpacing,
-      schPinStyle: props.schPinStyle,
-      pinCount: ports.length,
-      // @ts-ignore there's a subtley in the definition difference with
-      // leftSide/rightSide/topSide/bottomSide in how the direction is defined
-      // that doesn't really matter
-      schPortArrangement: {
-        // TODO use schematic direction or schPortArrangement
-        rightSize: ports.length
-      }
-    });
-    this.schematicDimensions = dimensions;
-    const schematic_component2 = db.schematic_component.insert({
-      center: { x: props.schX ?? 0, y: props.schY ?? 0 },
-      rotation: props.schRotation ?? 0,
-      size: dimensions.getSize(),
-      port_arrangement: underscorifyPortArrangement(
-        props.schPortArrangement
-      ),
-      pin_spacing: pinSpacing,
-      // @ts-ignore soup needs to support distance for pin_styles
-      pin_styles: underscorifyPinStyles(props.schPinStyle),
-      port_labels: props.pinLabels,
-      source_component_id: this.source_component_id
-    });
-    this.schematic_component_id = schematic_component2.schematic_component_id;
-  }
   doInitialPcbComponentRender() {
     const { db } = this.root;
     const { _parsedProps: props } = this;
@@ -4488,6 +4489,62 @@ var Battery = class extends NormalComponent {
   }
 };
 
+// lib/components/normal-components/PinHeader.ts
+import { pinHeaderProps } from "@tscircuit/props";
+var PinHeader = class extends NormalComponent {
+  get config() {
+    return {
+      componentName: "PinHeader",
+      zodProps: pinHeaderProps,
+      shouldRenderAsSchematicBox: true
+    };
+  }
+  _getImpliedFootprintString() {
+    const pinCount = this._parsedProps.pinCount ?? this._parsedProps.pinLabels?.length ?? 0;
+    const holeDiameter = this._parsedProps.holeDiameter;
+    const platedDiameter = this._parsedProps.platedDiameter;
+    const pitch = this._parsedProps.pitch;
+    if (pinCount > 0 && pitch) {
+      if (!holeDiameter && !platedDiameter) {
+        return `pinrow${pinCount}_p${pitch}`;
+      }
+      return `pinrow${pinCount}_p${pitch}_id${holeDiameter}_od${platedDiameter}`;
+    }
+    return null;
+  }
+  initPorts() {
+    const pinCount = this._parsedProps.pinCount ?? this._parsedProps.pinLabels?.length ?? 1;
+    for (let i = 1; i <= pinCount; i++) {
+      this.add(
+        new Port({
+          name: `pin${i}`,
+          pinNumber: i,
+          aliases: []
+        })
+      );
+    }
+  }
+  _getSchematicPortArrangement() {
+    return {
+      leftSize: 0,
+      rightSize: this._parsedProps.pinCount ?? 1
+    };
+  }
+  doInitialSourceRender() {
+    const { db } = this.root;
+    const { _parsedProps: props } = this;
+    const source_component = db.source_component.insert({
+      ftype: "simple_chip",
+      name: props.name,
+      // manufacturer_part_number: props.,
+      supplier_part_numbers: props.supplierPartNumbers
+      // gender: props.gender,
+      // pitch: props.pitch,
+    });
+    this.source_component_id = source_component.source_component_id;
+  }
+};
+
 // lib/components/normal-components/Inductor.ts
 import { inductorProps } from "@tscircuit/props";
 var Inductor = class extends NormalComponent {
@@ -4783,6 +4840,7 @@ export {
   Net,
   NetAlias,
   NormalComponent,
+  PinHeader,
   PlatedHole,
   Port,
   PowerSource,