Syncfusion have support to create a diagram with custom shapes , Label and Port to Port Connection in React. Please find the online samples of Syncfusion Diagram. We have created flow diagram which is similar to the provided screenshot.
Please refer to the sample from the below link:
Sample link: https://codesandbox.io/s/wkvjjopv18
You can also create a label for the node or connector by using annotation property. Please find the below link for how to add label to the node or connector
Link: https://ej2.syncfusion.com/react/documentation/diagram/labels#create-annotation
