Module: components/Node/Node

Renders a single draggable node on the AutoRA Workflow Editor canvas and provides the geometry helpers used to place and connect its ports. Handles regular protocol nodes, control nodes (start/end) and the rotated diamond filter node, including dragging, selection and port connection interactions.
Source:

Methods

(static) findClosestPort(node, point) → {Object}

Finds the node port nearest to a given point in canvas coordinates.
Parameters:
Name Type Description
node Object The node object whose ports are considered.
point Object The reference point.
Properties
Name Type Description
x number The point's x coordinate.
y number The point's y coordinate.
Source:
Returns:
The closest port object ({ id, x, y }).
Type
Object

(static) getNodePorts(node) → {Array}

Computes the absolute visual/connection coordinates of a node's four ports based on its type, accounting for the 45 degree rotation of diamond filter nodes and the differing dimensions of control and regular nodes.
Parameters:
Name Type Description
node Object The node object.
Properties
Name Type Description
type string The node's type.
x number The node's x origin on the canvas.
y number The node's y origin on the canvas.
Source:
Returns:
An array of port objects, each with { id, x, y }.
Type
Array

(static) getPortType(nodeType, portId) → {string}

Determines whether a given port acts as an input or an output based on the node type and the port's position.
Parameters:
Name Type Description
nodeType string The node's type (e.g. 'filter_point', 'start_point', 'end_point').
portId string The port identifier ('top', 'right', 'bottom' or 'left').
Source:
Returns:
'input' or 'output'.
Type
string

(inner) Node(props) → {JSX.Element}

Renders a single workflow node on the canvas, adapting its layout to the node type (regular, control or diamond filter). Manages pointer-driven dragging, selection, and renders interactive connection ports colored by their input/ output role and current connection state.
Parameters:
Name Type Description
props Object
Properties
Name Type Description
node Object The node data (id, type, name, x, y).
isSelected boolean Whether this node is currently selected.
isConnecting boolean Whether a connection is being drawn from/to this node.
connections Array All current connections, used to color ports by role.
onSelect function Called with the node id when the node is selected.
onPositionChange function Called with (nodeId, newX, newY) while dragging.
onBorderClick function Called with (nodeId, point) when a port is clicked to connect.
onDragStart function Called when dragging of this node begins.
onDragEnd function Called when dragging of this node ends.
zoom number Current canvas zoom factor, used to convert pointer coordinates.
Source:
Returns:
Type
JSX.Element

(inner) getPortConnectionRole(nodeId, portId, connections, portPositions) → {string|null}

Checks whether a given port participates in any connection and returns the role it plays in that connection, by matching the port's absolute position against connection endpoints within a distance threshold.
Parameters:
Name Type Description
nodeId string The id of the node owning the port.
portId string The port identifier ('top', 'right', 'bottom' or 'left').
connections Array The list of connection objects to search.
portPositions Array Absolute port positions for the node (as returned by getNodePorts).
Source:
Returns:
'output' if the port is a connection source, 'input' if a target, or null if unconnected.
Type
string | null