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 `edgeTypes`.
`source`	`EdgeType["source"]` Id of source node.
`target`	`EdgeType["target"]` Id of target node.
`animated`	`EdgeType["animated"]`
`hidden`	`EdgeType["hidden"]`
`deletable`	`EdgeType["deletable"]`
`selectable`	`EdgeType["selectable"]`
`data`	`EdgeType["data"]` 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"]`
`ariaRole`	`EdgeType["ariaRole"]` The ARIA role attribute for the edge, used for accessibility.	`"group"`
`domAttributes`	`EdgeType["domAttributes"]` General escape hatch for adding custom attributes to the edge’s DOM element.
`sourceX`	`number`
`sourceY`	`number`
`targetX`	`number`
`targetY`	`number`
`sourcePosition`	`Position`
`targetPosition`	`Position`
`sourceHandleId`	`string \| null`
`targetHandleId`	`string \| null`