How to automatically generate and draw a smooth curve between two surfaces in JS?

I would like to be able to automatically generate smooth curves between two (flat) surfaces of DOM elements in JS, similar to the Curved Connector in Google Slides:

In GS, you can add a Curved Connector and then plug each end into any other anchor point. If the target anchor point belongs to a surface, the connector line will be perpendicular to it. Intermediate points are automatically generated and interpolated to make for a smooth curve. Here are four examples:

→ Not sure if there is a library out there? Thus far, I have sadly not found anything

Answer

d3-graphviz does all the magic:

• The edges are rendered straight by default, but are automatically bent to avoid other nodes.
• It also has an auto layouting algorithm for layered/hierarchical graphs.
• It uses graphviz (with the help of wasm) under the hood.

Here is an example: