@refinitiv-ui/efx-grid 6.0.53 → 6.0.55

package/lib/rt-grid/es6/FieldDefinition.d.ts

@@ -8,6 +8,8 @@ declare namespace FieldDefinition {
 
     function get(field: string): any;
 
+    function getFieldInfo(field: string): any;
+
     function hasFieldInfo(field: string): boolean;
 
     function getTimeSeriesChildren(field: string): any;
@@ -18,8 +20,6 @@ declare namespace FieldDefinition {
 
     function setSynapseConfig(config: Grid.SynapseConfig|null): void;
 
-    function setFieldCaching(caching: boolean): void;
-
     function disableTimeSeriesExpansion(disabled: boolean): void;
 
     function isFormula(field: string): boolean;

package/lib/rt-grid/es6/FieldDefinition.js

@@ -10,9 +10,9 @@ import { Deferred } from "../../tr-grid-util/es6/Deferred.js";
 * @const
 */
 var SYNAPSE_URL =
-	'/synapse/service/suggestions/suggest/?'
-	+ 'hits=1' // search only 1 result
-	+ '&profile=' + encodeURIComponent('Field Selector');
+	"/synapse/service/suggestions/suggest/?"
+	+ "hits=1" // search only 1 result
+	+ "&profile=" + encodeURIComponent("Field Selector");
 
 /* @namespace */
 var FieldDefinition = {};
@@ -129,18 +129,13 @@ FieldDefinition._timeSeriesChildren = {};
 * @private
 * @const
 */
-FieldDefinition._synapse = '';
+FieldDefinition._synapse = "";
 /**
 * @type {string}
 * @private
 * @const
 */
-FieldDefinition._lang = 'en';
-/**
-* @type {boolean}
-* @private
-*/
-FieldDefinition._caching = false;
+FieldDefinition._lang = "en";
 /**
 * @type {boolean}
 * @private
@@ -167,17 +162,22 @@ FieldDefinition.set = function(field, def) {
 		}
 	}
 };
-/** @public
+/** Get field definition object
+* @public
 * @function
 * @param {string} field
 * @return {Object}
 */
 FieldDefinition.get = function(field) {
-	if(this._caching) {
-		return FieldDefinition._defs[field];
-	}
-	return null;
+	return FieldDefinition._defs[field] || null;
 };
+/** Get field definition object
+* @public
+* @function
+* @param {string} field
+* @return {Object}
+*/
+FieldDefinition.getFieldInfo = FieldDefinition.get;
 
 /** @public
 * @function
@@ -186,7 +186,7 @@ FieldDefinition.get = function(field) {
 */
 FieldDefinition.hasFieldInfo = function(field) {
 	var val = FieldDefinition.get(field);
-	return val && val.field; // Already preventing an error caused by accessing a property on a null value
+	return (val && val.field) ? true : false; // Already preventing an error caused by accessing a property on a null value
 };
 
 /** @public
@@ -222,15 +222,6 @@ FieldDefinition.remove = function(field) {
 */
 FieldDefinition.setSynapseConfig = function (config) {
 	FieldDefinition._synapse = config;
-
-};
-
-/** @public
-* @function
-* @param {boolean} caching
-*/
-FieldDefinition.setFieldCaching = function (caching) {
-	FieldDefinition._caching = caching;
 };
 
 /** @public
@@ -355,7 +346,7 @@ FieldDefinition.getFieldProperty = function(field, propertyName) {
 	return null;
 };
 
-/** to get more info about field via synapse service
+/** To get more info about field via synapse service
 * @private
 * @param {string} field
 * @returns {Promise}
@@ -387,12 +378,12 @@ FieldDefinition.loadFieldInfo = function (field) {
 	// everything fine, call synapse service
 	else {
 		var queryUrl = SYNAPSE_URL
-			+ '&api-key=' + encodeURIComponent(synapse.apiKey)
-			+ '&contextApp=' + encodeURIComponent(synapse.contextApp)
-			+ '&language=' + encodeURIComponent(FieldDefinition._lang)
-			+ '&query=' + encodeURIComponent(field);
+			+ "&api-key=" + encodeURIComponent(synapse.apiKey)
+			+ "&contextApp=" + encodeURIComponent(synapse.contextApp)
+			+ "&language=" + encodeURIComponent(FieldDefinition._lang)
+			+ "&query=" + encodeURIComponent(field);
 		if (synapse.auth) {
-			queryUrl += '&auth=' + encodeURIComponent(synapse.auth);
+			queryUrl += "&auth=" + encodeURIComponent(synapse.auth);
 		}
 		// TODO: handle client timeout
 		var xmr = new XMLHttpRequest();
@@ -401,9 +392,9 @@ FieldDefinition.loadFieldInfo = function (field) {
 		FieldDefinition._loadingField[field] = defer;
 
 		// for now we care only successful case
-		xmr.addEventListener('loadend', onLoadEnd);
-		xmr.addEventListener('timeout', onError);
-		xmr.addEventListener('error', onError);
+		xmr.addEventListener("loadend", onLoadEnd);
+		xmr.addEventListener("timeout", onError);
+		xmr.addEventListener("error", onError);
 		xmr.open("GET", queryUrl, true); // true for asynchronous
 		xmr.send();
 	}
@@ -431,7 +422,7 @@ FieldDefinition._mockOnLoadEndData = function (field, defer) {
 	var fieldUpperCase = field.toUpperCase();
 	var fieldLowerCase = fieldUpperCase.toLowerCase();
 	var label;
-	if (fieldLowerCase.indexOf('_') === 2) { // transform XX_ABCD -> Abcd
+	if (fieldLowerCase.indexOf("_") === 2) { // transform XX_ABCD -> Abcd
 		label = fieldUpperCase[3] + fieldLowerCase.substring(4);
 	} else {
 		label = fieldUpperCase[0] + fieldLowerCase.substring(1);
@@ -493,49 +484,49 @@ FieldDefinition._mockOnLoadEndData = function (field, defer) {
 function onLoadEnd(e) {
 	var xmr = e.currentTarget;
 	var defer = xmr._defer;
-	var resolve = defer.resolve;
-	var reject = defer.reject;
+	var field = xmr._field;
 
-	delete FieldDefinition._loadingField[xmr._field];
+	delete FieldDefinition._loadingField[field];
 
 	if (xmr.status === 200) { // case success
-		var returnObj = {
-			field: xmr._field,
-			fieldDefinition: null
-		};
 		var res = JSON.parse(xmr.responseText);
+		var fieldDef = null;
 
 		var result = res.result && res.result[0];
 		if (result) {
 			var item = result.hits && result.hits[0];
 			if (item && item.p) {
 				var profile = item.p;
-				if (profile.fn.toUpperCase() === xmr._field.toUpperCase()) {
-					var fieldDef = FieldDefinition.get(xmr._field) || {};
+				if (profile.fn.toUpperCase() === field.toUpperCase()) {
+					fieldDef = FieldDefinition.get(field) || {};
 
 					fieldDef.field = profile.fn; // name
+					fieldDef.name = profile.fl; // label
 					fieldDef.rank = profile.Rank;
 					fieldDef.fieldDataType = profile.fdt; // data type
+					fieldDef.id = profile.fid;
 					fieldDef.IsMonitorOnlyField = profile.fimo;
 					fieldDef.IsRealtimePortfolioField = profile.firp;
 					fieldDef.IsRealtimeField = profile.firt;
-					fieldDef.name = profile.fl; // label
 					fieldDef.source = profile.fsrc;
 					fieldDef.sourceRank = profile.fsrnk;
 					fieldDef.description = item.title;
 
-					FieldDefinition.set(xmr._field, fieldDef);
-					returnObj.fieldDefinition = fieldDef;
+					FieldDefinition.set(field, fieldDef);
 				}
 			}
 		}
-		resolve(returnObj);
+		if(fieldDef) {
+			defer.resolve(fieldDef);
+		} else {
+			defer.reject("No definition for " + field);
+		}
 	} else if (xmr._error) { // case error && time out
-		xmr._error.field = xmr._field;
-		reject(xmr._error);
+		xmr._error.field = field;
+		defer.reject(xmr._error);
 	} else { // case status not 200
-		reject({
-			field: xmr._field,
+		defer.reject({
+			field: field,
 			status: xmr.status,
 			statusText: xmr.statusText,
 			request: xmr

package/lib/rt-grid/es6/Grid.d.ts

@@ -133,9 +133,13 @@ declare class Grid extends EventDispatcher {
 
     public replaceColumn(columnOption: ColumnDefinition.Options|string|null, colRef: Grid.ColumnReference|null): void;
 
+    public getFieldInfo(field: string): any;
+
+    public loadFieldInfo(field: string): Promise<any>|null;
+
     public setColumns(columns: (any)[]|null): void;
 
-    public restoreColumns(columns: (any)[]|null): void;
+    public restoreColumns(columns: (any)[]|null, byId?: boolean|null): void;
 
     public setFields(ary: (string)[]|null): void;
 

package/lib/rt-grid/es6/Grid.js

@@ -198,15 +198,6 @@ var cloneRowData = function(fromRowDef, toRowDef) {
 	}
 };
 
-/** @private
-* @param {string} sortField
-* @param {Object} elemData
-* @param {number} index
-*/
-var mapRowOrder = function (sortField, elemData, index) { // edit name
-	elemData[sortField] = index; // Make column for sort with user data array
-};
-
 /** @private
 * @param {RowDefinition} rowDef
 * @return {boolean}
@@ -291,6 +282,19 @@ var _hasFieldOrId = function(colDef, str) {
 	return (colDef.getField() === str) || (colDef.getId() === str);
 };
 
+/** Compare the difference in the 'id' property.
+ * @private
+ * @param {Object} obj1
+ * @param {Object} obj2
+ * @returns {boolean} If the id property of two objects is equal, the return will be true, otherwise it will be false.
+ */
+var _hasMatchingId = function(obj1, obj2) {
+	if(!obj1 || !obj2 || !obj1.id || !obj2.id) { // Handle nullable, if the object or id have null, it's means difference value
+		return false;
+	}
+	return obj1.id === obj2.id;
+};
+
 /** @constructor
 * @extends {EventDispatcher}
 * @param {(Element|null)=} placeholder
@@ -840,7 +844,6 @@ Grid.prototype.initialize = function(gridOption) {
 
 	if (gridOption["fieldCaching"]) {
 		t._fieldCaching = gridOption["fieldCaching"];
-		FieldDefinition.setFieldCaching(t._fieldCaching);
 	}
 
 	if(gridOption["timeSeriesExpansion"] != null) {
@@ -1590,8 +1593,8 @@ Grid.prototype.replaceColumn = function (columnOption, colRef) {
  * @param {Object} response
  */
 Grid.prototype._onFieldLoadedSuccess = function (field, colDef, response) {
-	if (response && response.fieldDefinition) {
-		var fieldDef = response.fieldDefinition;
+	if (response && response.id) {
+		var fieldDef = response;
 		if (colDef && colDef.getField() === field) {
 			if (colDef.isDefaultName() && fieldDef.name) {
 				colDef.setName(fieldDef.name);
@@ -1639,6 +1642,34 @@ Grid.prototype._setScrollbarParent = function (host) {
 	this._grid.getHScrollbar().attachToExternalElement(host);
 };
 
+/** Get stored field information. If field information has not been requested or no data has been received yet, null value is returned.
+* @public
+* @function
+* @param {string} field
+* @return {Object}
+*/
+Grid.prototype.getFieldInfo = function(field) {
+	return FieldDefinition.getFieldInfo(field);
+};
+/** Request field information from Synapse service. If field information already exists, a resolved promise is returned. Synapse config must be supplied before the request can be made.
+* @public
+* @function
+* @param {string} field
+* @return {Promise}
+* @example
+* var gridConfig = {
+*   synapse: { // define synapse configuration
+*     apiKey: "xxx",
+*     contextApp: "xxx",
+*     auth: "xxx" (optional)
+*   }
+* };
+* var promise = grid.loadFieldInfo("CF_LAST");
+*/
+Grid.prototype.loadFieldInfo = function(field) {
+	return FieldDefinition.loadFieldInfo(field);
+};
+
 /**
 * @private
 * @param {string} field
@@ -1697,8 +1728,9 @@ Grid.prototype.setColumns = function(columns) {
 /** Remove, add and keep column based on the given column data
 * @public
 * @param {Array.<Object>} columns Array of column options
+* @param {boolean=} byId=false, if enable it, this method will only check for differences in the 'id' property
 */
-Grid.prototype.restoreColumns = function(columns) {
+Grid.prototype.restoreColumns = function(columns, byId) {
 	var grid = this._grid;
 	grid.startBatch("reset");
 	var configObj = this.getConfigObject();
@@ -1707,6 +1739,7 @@ Grid.prototype.restoreColumns = function(columns) {
 	var preColLen = previousColumns.length;
 	var newColLen = columns.length;
 
+	var compareLogic = byId ? _hasMatchingId : deepEqual;
 	var removingFields = [];
 	var keepingColumns = [];
 	var columnOrdering = [];
@@ -1716,7 +1749,7 @@ Grid.prototype.restoreColumns = function(columns) {
 	for (i = 0; i < preColLen; i++) {
 		found = false;
 		for (j = 0; j < newColLen; j++) {
-			if (deepEqual(previousColumns[i], columns[j])) {
+			if(compareLogic(previousColumns[i], columns[j])) {
 				keepingColumns.push(previousColumns[i]);
 				found = true;
 				break;
@@ -1737,7 +1770,7 @@ Grid.prototype.restoreColumns = function(columns) {
 	for (i = 0; i < newColLen; i++) {
 		found = false;
 		for (j = 0; j < keepingLen; j++) { // loop only keeping column
-			if (deepEqual(columns[i], keepingColumns[j])) {
+			if(compareLogic(columns[i], keepingColumns[j])) {
 				found = true;
 				var colIndex = this.getColumnIndex(columns[i].field); // We cannot use 'i' (colIndex) in this case, as it will sort the columns. Instead, we need to obtain a new column index from the field.
 				columnOrdering.push(this.getColumnId(colIndex));
@@ -2416,20 +2449,11 @@ Grid.prototype.updateDataSet = function(records, rowIdentifier) {
 	}
 
 	// Map new data index
-	var newDataMap = {};
 	var recordCount = records.length;
-	var record, i;
-	for (i = 0; i < recordCount; i++) {
-		record = records[i];
-		newDataMap[record[rowIdentifier]] = record; // Assign a new data map to compare to the previous data
-	}
-
 	var fieldSorting = "ROW_ORDER"; // TODO: Should be config by options
-	records.forEach(mapRowOrder.bind(null, fieldSorting));
-
 	var oldDataMap = {};
-	var rowDef, id;
-	var rowDefs = this.getRowDefinitions(); // WARNING: Filtered and hidden rows are not included
+	var rowDef, id, record, i;
+	var rowDefs = this.getAllRowDefinitions(); // Include the filter/hidden rows
 	var rowDefCount = rowDefs.length;
 	for (i = 0; i < rowDefCount; i++) {
 		rowDef = rowDefs[i];
@@ -2443,26 +2467,35 @@ Grid.prototype.updateDataSet = function(records, rowIdentifier) {
 		}
 	}
 
-	// Check Remove previous data
-	for (var rowIdentifierName in oldDataMap) {
-		if (oldDataMap[rowIdentifierName] && !newDataMap[rowIdentifierName]) {
-			this.removeRow(oldDataMap[rowIdentifierName]); // Slow
-		}
-	}
-
 	// Check Update and Insert
-	for (i = 0; i < recordCount; i++) {
+	var idMap = {};
+	var newDataMap = {};
+	for (i = recordCount - 1; i >= 0; i--) {
 		record = records[i];
 		id = record[rowIdentifier];
 		rowDef = oldDataMap[id];
+		newDataMap[id] = record; // Assign a new data map to compare to the previous data
+		record[fieldSorting] = i;
+		if(idMap[id]) { // Prevent assign data in duplicate row
+			continue;
+		}
+		idMap[id] = true;
 		if (!rowDef) {
-			this.insertRow({ values: newDataMap[id]}); // Insert last position
+			this.insertRow({ values: record}); // Insert last position
 		} else {
 			rowDef.setRowData(record);
 		}
 	}
+
+	// Check Remove previous data
+	for (var rowIdentifierName in oldDataMap) {
+		if (oldDataMap[rowIdentifierName] && !newDataMap[rowIdentifierName]) {
+			this.removeRow(oldDataMap[rowIdentifierName]); // Slow
+		}
+	}
+
 	// Sorting
-	this._dt.sortOnce("ROW_DEF", "a", compareNumber, fieldSorting);
+	this._dt.sortOnce(ROW_DEF, "a", compareNumber, fieldSorting);
 };
 /** @private
 * @param {Array|Object} item

package/lib/statistics-row/es6/StatisticsRow.js

@@ -702,7 +702,7 @@ StatisticsRowPlugin.prototype._onPostSectionDataBinding = function (e) {
 	}
 	// Render stuff
 	for(c = 0; c < colCount; ++c) {
-		this._renderStatistics(c, statistics[c], e.actualUpdate);
+		this._renderStatistics(c, statistics[c], e ? e.actualUpdate : false);
 	}
 
 	if(this.hasListener("postRendering")) {

package/lib/tr-grid-auto-tooltip/es6/AutoTooltip.d.ts

@@ -4,22 +4,22 @@ import { GridPlugin } from "../../tr-grid-util/es6/GridPlugin.js";
 declare namespace AutoTooltipPlugin {
 
     type Options = {
-        header?: boolean,
-        title?: boolean,
-        footer?: boolean,
-        content?: boolean,
-        quickMode?: boolean
+        header?: boolean|null,
+        title?: boolean|null,
+        footer?: boolean|null,
+        content?: boolean|null,
+        quickMode?: boolean|null
     };
 
     type ColumnOptions = {
-        autoTooltip?: boolean
+        autoTooltip?: boolean|null
     };
 
 }
 
 declare class AutoTooltipPlugin extends GridPlugin {
 
-    constructor(options?: AutoTooltipPlugin.Options);
+    constructor(options?: AutoTooltipPlugin.Options|null);
 
     public getName(): string;
 
@@ -31,9 +31,9 @@ declare class AutoTooltipPlugin extends GridPlugin {
 
     public getConfigObject(gridOptions?: any): any;
 
-    public applyTooltip(colIndex: number, fromR?: number, toR?: number): void;
+    public applyTooltip(colIndex: number, fromR?: number|null, toR?: number|null): void;
 
-    public applyTooltipToColumns(colIndices?: (number)[]): void;
+    public applyTooltipToColumns(colIndices?: (number)[]|null): void;
 
     public applyTooltipToAllColumns(): void;
 

package/lib/tr-grid-auto-tooltip/es6/AutoTooltip.js

@@ -279,12 +279,14 @@ AutoTooltipPlugin.prototype.applyTooltipToAllColumns = function () {
 AutoTooltipPlugin.prototype._applyTooltipToSection = function (section, colIndex, fromR, toR) {
 	if (!section) { return false; }
 
-	if (!fromR) {
+	if (fromR == null) {
+		fromR = section.getFirstIndexInView();
+	} else if(!fromR) {
 		fromR = 0;
 	}
 
 	if (toR == null) {
-		toR = section.getRowCount();
+		toR = section.getLastIndexInView() + 1;
 	}
 
 	if (fromR >= toR) {
@@ -296,6 +298,10 @@ AutoTooltipPlugin.prototype._applyTooltipToSection = function (section, colIndex
 		return false;
 	}
 
+	if(columnObj.getVisibility && !columnObj.getVisibility()) {
+		return false;
+	}
+
 	var colElem = columnObj.getElement();
 	if (!colElem) {
 		return false;

package/lib/tr-grid-column-grouping/es6/ColumnGrouping.d.ts

@@ -93,6 +93,8 @@ declare class ColumnGroupingPlugin extends GridPlugin {
 
     public unpinGroup(groupId: string, dest?: (number|string)|null): void;
 
+    public selectGroupHeaders(colIndices: (number)[]|null): void;
+
     public static getObjectIndex(column: any): number;
 
     public static getObjectId(column: any): string;

package/lib/tr-grid-column-grouping/es6/ColumnGrouping.js

@@ -71,6 +71,10 @@ ColumnGroupingPlugin.prototype._rerenderTimerId = 0;
 /** @type {number}
 * @private
 */
+ColumnGroupingPlugin.prototype._groupHeaderTimerId = 0;
+/** @type {number}
+* @private
+*/
 ColumnGroupingPlugin.prototype._addingTimerId = 0;
 /** @type {Array}
 * @private
@@ -84,6 +88,11 @@ ColumnGroupingPlugin.prototype._legacyColumnGroups = null;
 * @private
 */
 ColumnGroupingPlugin.prototype._inPinning = false;
+/** @type {!Object.<string, boolean>}
+* @description A map of selected groups
+* @private
+*/
+ColumnGroupingPlugin.prototype._selectedColMap;
 
 /** @private
 * @param {number} a
@@ -298,6 +307,10 @@ ColumnGroupingPlugin.prototype.unload = function (host) {
       clearTimeout(this._rerenderTimerId);
       this._rerenderTimerId = 0;
     }
+    if (this._groupHeaderTimerId) {
+      clearTimeout(this._groupHeaderTimerId);
+      this._groupHeaderTimerId = 0;
+    }
     if (this._addingTimerId) {
       clearTimeout(this._addingTimerId);
       this._addingTimerId = 0;
@@ -485,6 +498,7 @@ ColumnGroupingPlugin.prototype._applyGrouping = function () {
           if (cell) {
             // TODO: The style and class from the user will not be reset, for example, the color or background
             cell.removeClass("no-sort");
+            cell.removeClass("selected-group");
             cell.removeAttribute("group-id");
           }
         }
@@ -655,6 +669,14 @@ ColumnGroupingPlugin.prototype._requestApplyGrouping = function () {
     this._rerenderTimerId = setTimeout(this._applyGrouping.bind(this), 10);
   }
 };
+/** Set a timer to call renderGroups only once to avoid performance issue
+* @private
+*/
+ColumnGroupingPlugin.prototype._requestGroupRendering = function () {
+  if (!this._groupHeaderTimerId) {
+    this._groupHeaderTimerId = setTimeout(this.renderGroups.bind(this), 10);
+  }
+};
 /** Apply nearest grouping to column.
 * @private
 * @param {number} colIndex
@@ -753,11 +775,16 @@ ColumnGroupingPlugin.prototype._spanGroupHorizontally = function (titleSection)
     spanIndices = [];
     groupDef = visibleGroupMap[id];
     colIds = GroupDefinitions.getLeafDescendants(visibleGroupMap, id);
+    var isAllSelected = this._selectedColMap ? true : false;
     for (i = 0; i < colIds.length; i++) {
-      index = this._getColumnIndexById(colIds[i]);
+      var colId = colIds[i];
+      index = this._getColumnIndexById(colId);
       if (index > -1) {
         spanIndices.push(index);
       }
+      if (isAllSelected && this._selectedColMap) {
+        isAllSelected &= this._selectedColMap[colId];
+      }
     }
     spanIndices.sort(ColumnGroupingPlugin._ascSortLogic);
     len = spanIndices.length;
@@ -767,6 +794,10 @@ ColumnGroupingPlugin.prototype._spanGroupHorizontally = function (titleSection)
       var end = spanIndices[len - 1];
       section.setCellColSpan(start, groupDef["onRow"], end - start + 1);
       groupDef["colIndex"] = start;
+      if (isAllSelected) {
+        var cell = section.getCell(start, groupDef["onRow"]);
+        cell.addClass("selected-group");
+      }
     }
   }
 };
@@ -774,6 +805,7 @@ ColumnGroupingPlugin.prototype._spanGroupHorizontally = function (titleSection)
 * @public
 */
 ColumnGroupingPlugin.prototype.renderGroups = function () {
+  this._groupHeaderTimerId = 0;
   var hostCount = this._hosts.length;
   var groupMap = this._visibleGroupMap;
   for (var i = 0; i < hostCount; ++i) {
@@ -798,6 +830,17 @@ ColumnGroupingPlugin.prototype._renderGroup = function (groupDef, section) {
   }
   var rowIndex = groupDef["onRow"];
   var cell = section.getCell(colIndex, rowIndex);
+  var colIds = GroupDefinitions.getLeafDescendants(this._visibleGroupMap, groupDef["id"]);
+  var isAllSelected = false;
+  if (this._selectedColMap) {
+    isAllSelected = true;
+    for (var i = 0; i < colIds.length; i++) {
+      if (!this._selectedColMap[colIds[i]]) {
+        isAllSelected = false;
+        break;
+      }
+    }
+  }
   if (cell) {
     // Overide the defaults
     cell.setStyle("text-align", groupDef["alignment"] || "");
@@ -807,6 +850,11 @@ ColumnGroupingPlugin.prototype._renderGroup = function (groupDef, section) {
     // Additional cell settings must be removed in the _applyGrouping() method
     cell.addClass("no-sort");
     cell.setAttribute("group-id", groupDef["id"]);
+    if (isAllSelected) {
+      cell.addClass("selected-group");
+    } else {
+      cell.removeClass("selected-group");
+    }
     if (groupDef["legacyRender"]) {
       // Built-in version if render receive colIndex, cell, groupDefinition as arguments
       groupDef["legacyRender"](colIndex, cell, groupDef);
@@ -1710,6 +1758,26 @@ ColumnGroupingPlugin.prototype.unpinGroup = function (groupId, dest) {
     this.moveGroup(groupId, destId);
   }
 };
+/** @public
+* @param {Array<number>} colIndices
+*/
+ColumnGroupingPlugin.prototype.selectGroupHeaders = function (colIndices) {
+  var host = this._hosts[0];
+  var count = colIndices.length;
+  if (host && count) {
+    var colIds = [];
+    for (var i = 0; i < count; i++) {
+      colIds.push(host.getColumnId(colIndices[i]));
+    }
+    var colMap = host.createColumnMap(colIds);
+    if (colMap) {
+      this._selectedColMap = colMap;
+    }
+  } else {
+    this._selectedColMap = null;
+  }
+  this._requestGroupRendering();
+};
 
 /** Get column index from column object
 * @public