Multi Connection Line

React Flow typically only allows one connection to be created at a time. This example builds on the custom connection line example to show how to draw multiple connection lines from any selected nodes at once.

Pay attention to the onConnect handler. If you forget to include this then only one connection will be created even if you have multiple selected nodes!

export default function App() {
  const data: string = "world"

  return <h1>Hello {data}</h1>
}

Read-only

⚠️

This example makes use of the special internalsSymbol to access properties on a node you won't typically need access to. Properties hidden behind this symbol don't have the same stability guarantees as the public API, so use them with caution.

Connection Line Edge Markers