I know I am missing something but how can I place the expander button on the far right of group panel?
here is the group template:
public groupExpandedTemplate(): go.Group {
return $(go.Group,
'Auto',
{
layout: $(go.TreeLayout, {
angle: 0,
comparer: go.LayoutVertex.smartComparer,
alignment: go.TreeLayout.AlignmentCenterSubtrees,
nodeSpacing: 5,
nodeIndent: 0,
nodeIndentPastParent: 0,
layerSpacing: 10,
layerSpacingParentOverlap: 0,
sorting: go.TreeLayout.SortingForwards,
rowSpacing: 10,
rowIndent: 0,
setsPortSpot: true,
setsChildPortSpot: true,
treeStyle: go.TreeLayout.StyleLayered
}),
selectionAdorned: false,
selectable: false,
selectionChanged: (thisPart: go.Part) => {
this.interactionService.onSelectionChanged(thisPart as go.Node);
}
},
$(go.Shape, 'Rectangle',
{
fill: 'transparent',
stroke: 'green'
},
),
$(go.Panel,
'Vertical',
$(go.Panel,
'Horizontal',
{
stretch: go.GraphObject.Horizontal,
background: 'lightgray'
},
$(go.TextBlock,
{
alignment: go.Spot.TopLeft,
name: 'OPERATOR_LABEL',
overflow: go.TextBlock.OverflowEllipsis,
margin: 4,
maxLines: 1,
editable: true,
isMultiline: false,
stroke: getComputedStyle(document.body).getPropertyValue('--text-primary'),
textValidation: (tb: go.TextBlock, oldstr: string, newstr: string) => {
return this.interactionService.validateStepName(oldstr, newstr);
}
},
new go.Binding('text', 'label').makeTwoWay(),
new go.Binding('font', 'active', (active) => (active ? 'bold 14px Lato-Regular' : '14px Lato-Regular'))
),
$('SubGraphExpanderButton',
{
alignment: go.Spot.TopRight,
margin: 4
}
)
),
$(go.Placeholder, { padding: 10 }),
)
);
}