ReferenceTypes

ConnectionLineComponentProps

Source on GitHub

If you want to render a custom component for connection lines, you can set the connectionLineComponent prop on the <ReactFlow /> component. The ConnectionLineComponentProps are passed to your custom component.

export type ConnectionLineComponentProps = {
  connectionLineStyle?: React.CSSProperties;
  connectionLineType: ConnectionLineType;
  fromNode?: Node;
  fromHandle?: Handle;
  fromX: number;
  fromY: number;
  toX: number;
  toY: number;
  fromPosition: Position;
  toPosition: Position;
  connectionStatus: 'valid' | 'invalid' | null;
};

Props

#connectionLineStyle?
#connectionLineType
ConnectionLineType
#fromNode?
Node
The node the connection line originates from.
#fromHandle?
Handle
The handle on the fromNode that the connection line originates from.
#fromX
number
#fromY
number
#toX
number
#toY
number
#fromPosition
Position
#toPosition
Position
#connectionStatus
"valid" | "invalid" | null
If there is an isValidConnection callback, this prop will be set to "valid" or "invalid" based on the return value of that callback. Otherwise, it will be null.
Last updated on