Thank you very much for providing a simple stand-alone example.
If you set
portId: “”
on the group’s row 1 panel, I think the link point for the group will naturally be the middle of that square area, rather than for the whole node including the header. You probably also want to move those fromSpot and toSpot settings that were on the Group (which was the default port) to that panel with the portId setting.
Part of the problem with locations is that a collapsed group has invisible members, so those members don’t help locate or size the group. That’s why in the absence of a Diagram.layout (well, it’s disabled due to isOngoing false) the group won’t have any real location. Which is why you implemented a “SelectionGrouped” DiagramEvent listener. That’s good. But you don’t want to move the new group because that would also shift the member nodes.
Here’s what I would do:
"SelectionGrouped": e => {
const grp = e.subject;
const b = e.diagram.computePartsBounds(grp.memberParts);
grp.location = b.center;
grp.findExternalLinksConnected().each(l => l.invalidateRoute());
},
I’m not sure why that last line seems to be needed. Maybe that’s a bug.