Node as Connector

Description

This example shows how to make a node behave as a connector instead of treating connectors as separate small handles only. That pattern is useful when the whole node, or a large region of it, should act like an interactive connection target.

It works well in compact editors, visual programming interfaces, and slot-based builders where dedicated tiny ports would make the UI harder to use. By letting the node itself participate in connection logic, you can keep the layout simpler without losing graph capabilities.

This is less about appearance and more about interaction design. Sometimes the best port is not a tiny port at all.

Example

When to use it

• Build compact node editors with fewer small hit targets.
• Support connection models where the whole node is conceptually a port.
• Simplify UX for touch, tablet, or dense graph interfaces.

Use this approach when explicit micro-connectors make the product harder to understand or harder to operate.

Related docs

• Node Directive
• Node Input Directive
• Node Output Directive
• Connector Inside Node Example