Selected Node Line Creation With Target Endpoint Selection
This example shows a compact graph authoring workflow where selecting one node reveals directional chips for launching a new outgoing connection. It combines a custom around-node toolbar with relation-graph's built-in connect overlay, so users can start from a preset source side and then choose where the new line attaches on the target node before it is saved.
Selected-Node Line Creation With Target Endpoint Selection
What This Example Builds
This example builds a compact connection-authoring workspace on top of a small seeded graph. The page uses a full-height dotted canvas, a floating helper window, and a custom around-node toolbar that only appears when exactly one node is in editing state.
Users can click nodes, adjust selection with modifier keys, clear the canvas state, and launch a new outgoing line from directional chips above, below,