Around-Node Quick Actions
This example shows how to mount custom quick-action trays around the nodes that are currently in relation-graph's editing state. It combines seeded selection, modifier-based multi-select, marquee retargeting, a dotted editor-style canvas, and a floating settings window, while keeping the action chips themselves as placement-focused placeholders.
Eight-Direction Quick Actions Around Edited Nodes
What This Example Builds
This example builds a lightweight graph editing workspace where custom quick-action trays are attached to the nodes that are currently in relation-graph’s editing state. The page shows a full-height dotted canvas, a floating helper window, and white action groups positioned above, below, left, right, and at all four corners of the edited nodes.
Users can click a node, toggle more nodes into the editing set with mo