ConnectionLineComponentProps
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
Name | Type |
---|---|
# connectionLineStyle? | React.CSSProperties |
# 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. |