React Data Grid: Add ability to include group-level summary on a per-column basis. Right now, to add per column summary data to the grouped children row, an XTemplate is required, however, even though the per column summarized data is in the XTemplate, it is not aligned to the column headers.

Code:
this.groupHeaderTemplate = new Ext.XTemplate('<div>{name} {[this.summarizeChildren(values.groupField, values.children)]}</div>', {
    summarizeChildren: function(groupField, children){
        return [`Quantity: ${sum(children.map(c => c.data['Quantity']))}`,
        `On Hand: ${sum(children.map(c => c.data['OnHand']))}`,
        `Cost Price: $${sum(children.map(c => c.data['CostPrice']))}`,
        `Order Value: $${sum(children.map(c => c.data['OrderValue']))}`].join(', ');
    }
});

<Column t text="Site Group 1" dataIndex="SiteGroup1Description" width={100} groupHeaderTpl={this.groupHeaderTemplate}  groupable={true}/>