Edge Actions

addEdge

addEdge: (edge: WorkflowEdge) => void

// Usage — called from React Flow's onConnect callback when the user draws a connection
const { addEdge } = useWorkflowStore();

// React Flow provides the connection object; we map it to a WorkflowEdge
addEdge({
    id          : crypto.randomUUID(),
    source      : connection.source!,
    sourceHandle: connection.sourceHandle!,
    target      : connection.target!,
    targetHandle: connection.targetHandle!
});

// Validation runs before addEdge is called:
// - Cannot connect an output port to itself
// - Cannot create duplicate connections (same source+handle → same target+handle)
// - Ports must be compatible (input handle accepts from output handle)

updateEdge

updateEdge: (id: string, patch: Partial<WorkflowEdge>) => void

// Usage — called when an edge connection point is dragged to a new target
const { updateEdge } = useWorkflowStore();

updateEdge('edge-001', {
    target      : 'node-new-target',
    targetHandle: 'in'
});

removeEdge

removeEdge: (id: string) => void

// Usage — called when the user selects an edge and presses Delete
const { removeEdge } = useWorkflowStore();

removeEdge('edge-001');

// Note: edges are also removed automatically when either connected node is removed
// (removeNode cascades to removeEdge for all connected edges)

setEdgeLabel

setEdgeLabel: (id: string, label: string) => void

// Usage — called when a user double-clicks an edge to rename it
// Labels are shown on the canvas edge line
const { setEdgeLabel } = useWorkflowStore();

setEdgeLabel('edge-001', 'On Approval');

// The edge label is stored in edge.data.label
// Used for documentation/readability — does not affect execution routing

Edge Constraints