DefaultEdgeOptions
Many properties on an Edge
are optional. When a new edge is created,
the properties that are not provided will be filled in with the default values
passed to the defaultEdgeOptions
prop of the <ReactFlow />
component.
export type DefaultEdgeOptions<T> = {
type?: string;
animated?: boolean;
hidden?: boolean;
deletable?: boolean;
selectable?: boolean;
data?: T;
selected?: boolean;
markerStart?: string | EdgeMarker;
markerEnd?: string | EdgeMarker;
zIndex?: number;
ariaLabel?: string;
interactionWidth?: number;
focusable?: boolean;
};
Fields
Name | Type | Default |
---|---|---|
type | string | undefined Type of edge defined in | |
animated | boolean | |
deletable | boolean | |
selectable | boolean | |
data | Record<string, unknown> Arbitrary data passed to an edge. | |
markerStart | EdgeMarkerType Set the marker on the beginning of an edge. | |
markerEnd | EdgeMarkerType Set the marker on the end of an edge. | |
zIndex | number | |
ariaLabel | string | |
interactionWidth | number 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 | ReactNode The label or custom element to render along the edge. This is commonly a text label or some custom controls. | |
labelStyle | CSSProperties Custom styles to apply to the label. | |
labelShowBg | boolean | |
labelBgStyle | CSSProperties | |
labelBgPadding | [number, number] | |
labelBgBorderRadius | number | |
style | CSSProperties | |
className | string | |
reconnectable | boolean | HandleType Determines whether the edge can be updated by dragging the source or target to a new node.
This property will override the default set by the | |
focusable | boolean |