<port />

Overview

The <port /> element creates a named point where traces can connect. Inside a <symbol />, it defines the position of a component pin. As a direct child of a <subcircuit />, it exposes an internal connection so the rest of the circuit can connect to it by name.

Basic Usage

export default () => (
  <board width="10mm" height="10mm">
    <chip
      name="D1"
      symbol={
        <symbol>
          {/* Diode triangle */}
          <schematicline x1={-0.3} y1={-0.4} x2={-0.3} y2={0.4} strokeWidth={0.05} />
          <schematicline x1={-0.3} y1={0.4} x2={0.3} y2={0} strokeWidth={0.05} />
          <schematicline x1={0.3} y1={0} x2={-0.3} y2={-0.4} strokeWidth={0.05} />
          {/* Cathode bar */}
          <schematicline x1={0.3} y1={-0.4} x2={0.3} y2={0.4} strokeWidth={0.05} />
          {/* Ports */}
          <port name="A" schX={-0.3} schY={0} direction="left" />
          <port name="K" schX={0.3} schY={0} direction="right" />
        </symbol>
      }
    />
  </board>
)

Props

Property	Type	Required	Default	Description
name	string	No	-	Port identifier used in selectors. Required when pinNumber is omitted
pinNumber	number	No	-	Numeric pin identifier. Also creates pinN and N selector aliases
aliases	string[]	No	[]	Additional names that can select the port
connectsTo	string | string[]	No	-	Internal port selector or selectors connected to a direct subcircuit port
schX	number	No	-	X position in schematic units for a custom symbol port
schY	number	No	-	Y position in schematic units for a custom symbol port
direction	"left" | "right" | "up" | "down"	No	-	Direction the port faces
schStemLength	number	No	-	Length of the stem line extending from the port

Exposing a Subcircuit Connection

A direct child <port /> becomes part of a subcircuit's public interface. Set connectsTo to a selector for the internal component port, then connect from the parent circuit using SUBCIRCUIT_NAME.PORT_NAME.

export default () => (
  <board width="24mm" height="14mm" routingDisabled>
    <subcircuit
      name="FILTER"
      showAsSchematicBox
      schTitle="RC Filter"
      schX={0}
    >
      <resistor name="R1" resistance="1k" footprint="0402" />
      <capacitor name="C1" capacitance="100nF" footprint="0402" />

      <port name="INPUT" direction="left" connectsTo="R1.pin1" />
      <port name="OUTPUT" direction="right" connectsTo="R1.pin2" />

      <trace from="R1.pin2" to="C1.pin1" />
      <trace from="C1.pin2" to="net.GND" />
    </subcircuit>

    <resistor
      name="R_SOURCE"
      resistance="100"
      footprint="0402"
      schX={-5}
      connections={{ pin1: "net.VCC", pin2: "FILTER.INPUT" }}
    />
    <resistor
      name="R_LOAD"
      resistance="10k"
      footprint="0402"
      schX={5}
      connections={{ pin1: "FILTER.OUTPUT", pin2: "net.GND" }}
    />
  </board>
)

Use connectsTo="R1.pin1" to choose which internal pin the port exposes. From outside the subcircuit, reference it as FILTER.INPUT, using the subcircuit name followed by the port name.

The same connection can be written with an explicit trace selector:

<trace from=".R_SOURCE > .pin2" to=".FILTER > .INPUT" />

Only direct child ports form the subcircuit interface. The showAsSchematicBox prop is optional, but when enabled, those ports become the pins on the collapsed schematic box and the internal schematic is hidden.

connectsTo also accepts an array when one exposed port must connect to more than one internal port:

<port name="GND" direction="down" connectsTo={["U1.GND", "C1.pin2"]} />

Custom Stem Length

Use schStemLength to control how far the connection stem extends from the port:

export default () => (
  <board width="10mm" height="10mm">
    <chip
      name="U1"
      symbol={
        <symbol>
          {/* Op-amp triangle */}
          <schematicline x1={-0.5} y1={-0.7} x2={-0.5} y2={0.7} strokeWidth={0.05} />
          <schematicline x1={-0.5} y1={0.7} x2={0.7} y2={0} strokeWidth={0.05} />
          <schematicline x1={0.7} y1={0} x2={-0.5} y2={-0.7} strokeWidth={0.05} />
          {/* Plus/minus labels */}
          <schematictext schX={-0.35} schY={0.35} text="+" fontSize={0.3} />
          <schematictext schX={-0.35} schY={-0.35} text="-" fontSize={0.3} />
          {/* Ports with custom stem lengths */}
          <port name="IN+" schX={-1} schY={0.35} direction="left" schStemLength={0.5} />
          <port name="IN-" schX={-1} schY={-0.35} direction="left" schStemLength={0.5} />
          <port name="OUT" schX={1.1} schY={0} direction="right" schStemLength={0.4} />
        </symbol>
      }
    />
  </board>
)