Connection Line

A Connection Line is what you see when you click and drag out from a handle. It represents a possible edge and can snap to valid handles in close proximity. You can implement your own Connection Line by passing a Svelte component with slot="connectionLine". The useConnection hook gives you access to the current connection.

<script lang="ts">
const data: string = "world";
</script>

<h1>Hello {data}</h1>

<style>
h1 {
  font-size: 1.5rem;
}
</style>