Is this something like you are looking for?
<!DOCTYPE html>
<html>
<head>
<title>Minimal GoJS Sample</title>
<!-- Copyright 1998-2022 by Northwoods Software Corporation. -->
</head>
<body>
<div id="myDiagramDiv" style="border: solid 1px black; width:100%; height:600px"></div>
<script src="https://unpkg.com/gojs"></script>
<script src="https://unpkg.com/gojs/extensions/ScrollingTable.js"></script>
<script id="code">
const $ = go.GraphObject.make;
const myDiagram =
$(go.Diagram, "myDiagramDiv",
{
initialScale: 2,
"undoManager.isEnabled": true
});
myDiagram.nodeTemplate =
$(go.Node, "Vertical",
{
selectionObjectName: "SCROLLER",
resizable: true, resizeObjectName: "SCROLLER",
},
$(go.TextBlock,
{ font: "bold 14px sans-serif" },
new go.Binding("text")),
$(go.Panel, "Auto",
$(go.Shape, { fill: "white" }),
$("ScrollingTable",
{
name: "SCROLLER",
width: 120, height: 200, // initial size
stretch: go.GraphObject.Fill // but stretches vertically
},
new go.Binding("TABLE.itemArray", "items"),
new go.Binding("desiredSize", "size", go.Size.parse).makeTwoWay(go.Size.stringify),
{
"TABLE.itemTemplate":
$(go.Panel, "TableRow",
{ defaultStretch: go.GraphObject.Horizontal },
$(go.Panel, "Table",
{ defaultStretch: go.GraphObject.Horizontal, margin: 1 },
$(go.RowColumnDefinition, { row: 0, background: "gray" }),
$(go.Panel, "Horizontal", { row: 0, margin: new go.Margin(2, 2, 0, 2) },
$("PanelExpanderButton"),
$(go.TextBlock,
new go.Binding("text", "name"))
),
$(go.Panel, "Vertical", { row: 1, name: "COLLAPSIBLE" /*, visible: false */ },
new go.Binding("itemArray", "values"))
)
)
}
)
)
);
const arr = [ { text: "header", items: [] }];
const items = arr[0].items;
for (let i = 0; i < 5; i++) {
const values = [];
for (let j = 0; j < Math.random()*5; j++) values.push("value " + j.toString());
items.push({ name: "item " + i.toString(), values: values });
}
myDiagram.model = new go.GraphLinksModel(arr);
</script>
</body>
</html>