Locked Property in Anchor Does Not Prevent Anchor Connections from Appearing Visually

[fdsgdshn]

Hi,

I am using the Svelvet library to create a node system with multiple anchors (connection points) on each node. I want to use the locked property to prevent connections between anchors when their data types are incompatible. However, even though I set the locked property to true for incompatible anchors, they can still visually connect in the browser, which creates a misleading user experience.

Steps to Reproduce:

• I created a Svelvet container with multiple nodes.

• To prevent interactions between incompatible anchors, I applied the locked property.

• When the data types of two anchors are incompatible, I set locked to true.

Despite this, the anchors still visually connect in the browser (edges are rendered between them), even though no actual connection is established.

Expected Behavior:

• When locked={true}, no connection should be allowed between anchors, and the user should not be able to visually see the anchors connect.

• The visual connection (the edge) should not be rendered between incompatible anchors when locked is true.

Current Behavior:

• While incompatible anchor connections are not logically saved (no data is recorded), the anchors still appear visually connected in the browser, and the edges are rendered.

• The locked property only prevents the connections from being saved but does not stop the visual connection from appearing.

Suggestion:
When the locked property is true, it should not only prevent saving the connection but also block the visual rendering of the edge between incompatible anchors. This will ensure that the user does not see any visual connection when it's not allowed.

Additional Notes:
This issue is particularly noticeable when dealing with anchor connections based on data type compatibility. The locked property should fully block any visual representation of the connection.

Best Regards