xyflow / xyflow

React Flow | Svelte Flow - Powerful open source libraries for building node-based UIs with React (https://reactflow.dev) or Svelte (https://svelteflow.dev). Ready out-of-the-box and infinitely customizable.
https://xyflow.com
MIT License
22.07k stars 1.46k forks source link

Setting connectionMode to loose prevents self-connections from handles rendered in the same CustomNode #4161

Open jonlev1n opened 2 months ago

jonlev1n commented 2 months ago

Describe the Bug

Using the Easy Connect example, setting the connectionMode prop to "loose" somehow disables the ability for the source handle to connect to a target handle rendered in the same node.

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

  1. Open Easy Connect in the code sandbox
  2. Set connectionMode={ConnectionMode.Loose}
  3. Observe that the connection line no longer "snaps" when the source node and target node are the same

Expected behavior

As a user, I would expect that the ConnectionMode.Loose would not prevent self-connection

Screenshots or Videos

With default strict settings:

https://github.com/xyflow/xyflow/assets/8312367/4c9c748a-cb22-4e0c-b770-f13a75c6d9fa

And with loose:

https://github.com/xyflow/xyflow/assets/8312367/a1f45f22-fcb1-46df-8959-86592419168d

Platform

Additional context

No response