EdgeProps
When you implement a custom edge it is wrapped in a component that enables some basic functionality. Your custom edge component receives the following props:
Fields
Name | Type | Default |
---|---|---|
id | EdgeType["id"] Unique id of an edge. | |
type | EdgeType["type"] & string Type of edge defined in | |
source | EdgeType["source"] Id of source node. | |
target | EdgeType["target"] Id of target node. | |
animated | EdgeType["animated"] | |
deletable | EdgeType["deletable"] | |
selectable | EdgeType["selectable"] | |
data | any Arbitrary data passed to an edge. | |
selected | EdgeType["selected"] | |
markerStart | EdgeType["markerStart"] & string Set the marker on the beginning of an edge. | |
markerEnd | EdgeType["markerEnd"] & string Set the marker on the end of an edge. | |
zIndex | EdgeType["zIndex"] | |
ariaLabel | EdgeType["ariaLabel"] | |
interactionWidth | EdgeType["interactionWidth"] ReactFlow renders an invisible path around each edge to make them easier to click or tap on. This property sets the width of that invisible path. | |
label | EdgeType["label"] | |
labelStyle | EdgeType["labelStyle"] | |
style | EdgeType["style"] | |
class | EdgeType["class"] | |
focusable | EdgeType["focusable"] | |
sourceX | number | |
sourceY | number | |
targetX | number | |
targetY | number | |
sourcePosition | Position | |
targetPosition | Position | |
sourceHandleId | string | null | |
targetHandleId | string | null |
Last updated on