Selected Node Directional Line Creation
This example shows a focused graph authoring pattern where selecting one node reveals directional chips for creating new outgoing connections. It uses relation-graph's editing state, around-node overlay rendering, and interactive line creation flow to save new edges without building a full diagram editor shell.
Directional Line Creation from a Selected Node
What This Example Builds
This example builds a lightweight graph editing workspace where one selected node becomes the source of new outgoing connections. The page starts with a small seeded graph, hides the built-in toolbar, and adds its own floating helper window plus an around-node toolbar.
Users can click a node, use modifier keys to adjust the editing selection, drag a selection box, and then launch a new connection from small chips pla