Due to the overlapping of the port on the right side of the node with the TreeExpanderButton, there is an issue where when trying to select the port, the TreeExpanderButton gets selected, or when trying to select the TreeExpanderButton, the port gets selected. Is it possible to resolve the overlapping issue by placing the TreeExpanderButton outside the node’s bounds?
The code for creating the ports and TreeExpanderButton for the node is as follows:
export function createNodeTemplate(self) {
return $(
go.Node,
'Spot',
createDragDropEventsForNode(),
{
cursor: 'move',
locationSpot: go.Spot.Left,
selectionObjectName: 'NODE',
layoutConditions: go.Part.LayoutStandard & ~go.Part.LayoutNodeSized,
// ...
$(
'TreeExpanderButton',
{ name: 'NodeTreeExpanderBtn' },
{
alignment: go.Spot.Right,
'ButtonIcon.strokeWidth': 0,
'ButtonBorder.figure': 'Circle',
'ButtonIcon.visible': false,
// ...
}
),
makePort('T', go.Spot.Top),
makePort('L', go.Spot.Left),
makePort('R', go.Spot.Right),
makePort('B', go.Spot.Bottom),
);
}