Skip to content
D
Documentation

PortModel

reference
3 min readUpdated

Import it from @grafloria/engine.

Also has every member of DiagramEntity, listed on its own entry.

ts
class PortModel extends DiagramEntity

Properties

NameTypeDefaultDescription
nodeIdstring''
type'input' | 'output' | 'bi'
systemType?string
positionPortPosition
alignmentPortAlignment
offsetPoint
indexnumber0
maxConnectionsnumber
currentConnectionsSet<string>
allowedTypesSet<string>
linkRolesMap<string, 'source' | 'target'>Which END of each attached link this port is — linkId → 'source'|'target'.
visiblebooleantrue
styleRecord<string, any>{}
dataRecord<string, any>{}
group?stringNamed port group. Its config is inherited; these fields override it.
explicitSidebooleanfalseWas the side actually declared by the author? A port that only says group: 'in' must inherit the GROUP's side — without this flag the constructor's alignment.side = 'right' default would silently win.
shape?PortShapeSpecNon-circle glyph: square / diamond / triangle / custom SVG path.
label?PortLabelSpecPort label + its layout mode.
layout?PortLayoutSpecLayout strategy override. Unset → the shape registry's anchor.
fromSpot?PortSpotWhere a link leaves / lands on the glyph.
toSpot?PortSpot
spread?PortSpreadSpecSpread multiple links along this port's edge instead of piling them.
dataType?stringDeclarative data type: drives link validity AND glyph colour.
isConnectableStart?booleanMay a link START at this port? Unset → true.
isConnectableEnd?booleanMay a link END at this port? Unset → true.
fromMaxLinks?number | nullCap on OUTGOING links. null/unset → unlimited.
toMaxLinks?number | nullCap on INCOMING links. null/unset → unlimited.
allowSelfLink?booleanAllow a link whose source node IS its target node. Unset → false.
allowDuplicateLinks?booleanAllow a second link between the same two ports. Either direction counts: with this off, B → A is refused when A → B exists. Unset → true.
dynamic?booleanSpawned by the dynamic auto-port allocator rather than authored.
renderingConfig?any
isHoveredbooleanfalseWhether mouse is currently hovering over this port Used for visual feedback (scaling, highlighting)
isHighlightedbooleanfalseWhether this port is highlighted as a valid connection target Set during connection drag operations
isValidTargetbooleanfalseWhether this port is a valid target for current connection Set by ConnectionStateManager during drag

Methods

  • constructor(config: { id?: string; type: 'input' | 'output' | 'bi'; systemType?: string; position?: PortPosition; alignment?: PortAlignment; side?: 'left' | 'right' | 'top' | 'bottom'; index?: number; maxConnections?: number; group?: string; shape?: PortShapeSpec; label?: PortLabelSpec; layout?: PortLayoutSpec; fromSpot?: PortSpot; toSpot?: PortSpot; spread?: PortSpreadSpec; style?: Record<string, any>; visible?: boolean; dataType?: string; isConnectableStart?: boolean; isConnectableEnd?: boolean; fromMaxLinks?: number | null; toMaxLinks?: number | null; allowSelfLink?: boolean; allowDuplicateLinks?: boolean; allowedTypes?: string[]; dynamic?: boolean; })
  • get side(): 'left' | 'right' | 'top' | 'bottom' — Get the side this port is on (convenience getter) Set the side this port is on (convenience setter)
  • set side(value: 'left' | 'right' | 'top' | 'bottom') — Get the side this port is on (convenience getter) Set the side this port is on (convenience setter)
  • setPosition(position: PortPosition): void — Set position
  • setAlignment(alignment: PortAlignment): void — Set alignment
  • setOffset(offset: Point): void — Set offset
  • addAllowedType(type: string): void — Add allowed type
  • removeAllowedType(type: string): void — Remove allowed type
  • isTypeAllowed(type: string): boolean — Check if type is allowed
  • addConnection(linkId: string, role?: 'source' | 'target'): void — Add connection
  • restoreConnection(linkId: string, role?: 'source' | 'target'): void — Load-time reconcile: register a connection WITHOUT the maxConnections guard or change tracking. The connection registry is derived state that is rebuilt deterministically from the diagram's links on load — a persisted graph may legitimately exceed a since-tightened maxConnections, so enforcement applies to NEW interactive connections (addConnection), never to reloading saved state.
  • removeConnection(linkId: string): void — Remove connection
  • canConnect(): boolean — Check if can accept more connections
  • getConnectionCount(): number — Get connection count
  • getFromLinkCount(): number — How many links LEAVE this port / how many ARRIVE at it.
  • getToLinkCount(): number
  • canConnectTo(targetPort: PortModel): boolean — Check if this port (as the SOURCE) can connect to targetPort (as the TARGET). Direction matters — this is not a symmetric predicate.
  • typeIdentity(): string — The name this port answers to when another port's allowedTypes whitelist is checked: its declared data type, else its systemType, else its direction.
  • getAbsolutePosition(nodeBounds: BoundingBox): Point — Get absolute position relative to node
  • getEdgePosition(nodeBounds: BoundingBox): Point — Get port position at node edge (for smart mode) Returns the position at the edge midpoint based on alignment
  • static findNearestPort( point: Point, ports: Map<string, PortModel>, nodeBounds: BoundingBox ): PortModel | null (static) — Find nearest port on a node to a given point Used in smart mode for auto-connect to nearest port
  • getDistanceFromPoint(point: Point, nodeBounds: BoundingBox): number — Calculate distance from point to this port
  • resetInteractionState(): void — Reset interaction state Called when connection drag ends or is cancelled
  • setRenderingConfig(config: any): void — Set port rendering configuration from template
  • getRenderingConfig(): any | undefined — Get port rendering configuration
  • getEffectiveVisibility( node: any, globalDefault?: 'always' | 'on-hover' | 'never' | 'hidden' ): 'always' | 'on-hover' | 'never' | 'hidden' — Get effective visibility considering port and node configuration Priority: port config > node metadata > default ('on-hover')
  • serialize(): SerializedPort — Serialize to JSON
  • static fromJSON(data: SerializedPort): PortModel (static) — Deserialize from JSON

Was this page helpful?