@refinitiv-ui/efx-grid 6.0.39 → 6.0.41

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

@@ -25,6 +25,7 @@ declare namespace ColumnDefinition {
         rowSorting?: boolean|null,
         sortable?: boolean|null,
         sort?: string|null,
+        sortOrder?: string|null,
         styles?: any,
         width?: number|null,
         minWidth?: number|null,

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

@@ -30,7 +30,8 @@ import Engine from "../../tr-grid-util/es6/formula/Engine.js";
 * @property {ColumnDefinition~SortLogic=} sorter=null Alias to `sortLogic`
 * @property {boolean=} rowSorting=null If set to true, RowDefinition object will be used for sorting comparison. If set to false, data from the given `field` will be used for sorting comparison.
 * @property {boolean=} sortable=true If disabled, the column cannot be sorted by user click
-* @property {string=} sort="" This column will be sorted at the initialization in the specified order (e.g. "asc", "desc")
+* @property {string=} sort="" Deprecated Alias to `sortOrder`
+* @property {string=} sortOrder="" The column can be sorted in ascending and descending order by specifying the order "a", "d". This option will sort the column when it is initialized or inserted at runtime.
 * @property {Object=} styles=null Key/value pair Object specifying CSS styles
 * @property {number=} width=NaN If specified, column will have a fixed width in pixel
 * @property {number=} minWidth=NaN If specified, column will have a minimum width in pixel
@@ -408,7 +409,7 @@ ColumnDefinition.prototype.initialize = function(columnOption) {
 	}
 
 	// Deprecate
-	val = columnOption["sort"];
+	val = columnOption["sortOrder"] || columnOption["sort"];
 	if(val) {
 		this._initialOrder = val;
 	}
@@ -658,11 +659,13 @@ ColumnDefinition.prototype.isScalable = function() {
 	var colIndex = grid.getColumnIndex(this);
 	return core.getColumnScalability(colIndex);
 };
-/** @public
- * @deprecated
+/** Deprecated, this function will be return initial sort order of this column, The current sort state may be different from initial sort state.
+* @public
+* @deprecated
 * @return {string}
 */
 ColumnDefinition.prototype.getInitialSortOrder = function() {
+	// WARNING: This state is different from `sortOrder`, it is the state when grid is initialized.
 	return this._initialOrder;
 };
 /** @public
@@ -766,10 +769,6 @@ ColumnDefinition.prototype.getConfigObject = function(colOptions) {
 		obj["sortable"] = false;
 	}
 
-	if(this._initialOrder) {
-		obj["sort"] = this._initialOrder;
-	}
-
 	var classes = this._classes;
 	if(classes && classes.length > 0) {
 		obj["className"] = classes.join(" ");

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

@@ -318,6 +318,8 @@ declare class Grid extends EventDispatcher {
 
     public logDV(opt_options?: any): void;
 
+    public replaceRow(rowRef: Grid.RowReference|null, rowOption?: any): any;
+
 }
 
 declare function borders(gridOptions?: any): any;

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

@@ -230,6 +230,45 @@ var compareNumber = function(rowDefA, rowDefB, sortOrder, fieldName) { // edit n
 	return (rowDefA.getData(fieldName) - rowDefB.getData(fieldName)) * sortOrder; // for numeric comparison
 };
 
+/**
+ * @private
+* @param {string} rowDefA
+* @param {string} rowDefB
+* @param {string} sortOrder
+* @return {number} The outcome of the value comparison
+*/
+var _sortChildrenOfChain =  function (rowDefA, rowDefB, sortOrder) {
+	var parentA = rowDefA.getParent();
+
+	if (!parentA) {
+	  return 0;
+	}
+
+	var parentB = rowDefB.getParent();
+
+	if (!parentB) {
+	  return 0;
+	}
+
+	if (parentA !== parentB) {
+	  return 0;
+	}
+
+	var a = rowDefA.getData('CHILD_ORDER');
+
+	if (a == null) {
+	  return 0;
+	}
+
+	var b = rowDefB.getData('CHILD_ORDER');
+
+	if (b == null) {
+	  return 0;
+	}
+
+	return ( a - b ) * sortOrder;
+};
+
 /** @private
 * @param {ColumnDefinition} colDef
 * @return {string}
@@ -258,6 +297,7 @@ var Grid = function(placeholder, config) {
 	var t = this; // This is to primarily reduce file size
 
 	t._onDataChanged = t._onDataChanged.bind(t);
+	t._onQuote2PostUpdate = t._onQuote2PostUpdate.bind(t);
 	t._onDataComposed = t._onDataComposed.bind(t);
 	t._onSubSegmentChanged = t._onSubSegmentChanged.bind(t);
 	t._recalculateFormulas = t._recalculateFormulas.bind(t);
@@ -616,6 +656,7 @@ Grid.prototype.initSubscription = function() {
 	this._subs = s;
 	this._subs["start"]();
 	this._dc.setSubscriptions(s);
+	this._subs.addEventListener("postUpdate", this._onQuote2PostUpdate);
 
 	// TODO: Subscriptions should be registered per row.
 	// However, chain subscription cannot be integrated with DataConnector in this current implementation.
@@ -1528,6 +1569,9 @@ Grid.prototype.replaceColumn = function (columnOption, colRef) {
 		colConfig["hidden"] = false;
 	}
 
+	if(colConfig.id == null) {
+		colConfig.id =  colDef.getId(); // retain ID
+	}
 	this._grid.startBatch("reset");
 	this.insertColumn(colConfig, colIndex);
 	this.removeColumn(colIndex + 1); // remove existing column after insert
@@ -1678,12 +1722,6 @@ Grid.prototype.restoreColumns = function(columns) {
 		}
 	}
 
-	var sortingStates;
-	var removeLen = removingFields.length;
-	if(removeLen > 0 && this._stp) {
-		sortingStates = this._stp.getSortingStates().slice(); // We need to clone array for avoid object reference in remove column
-	}
-
 	this.removeColumns(removingFields);
 
 	var keepingLen = keepingColumns.length;
@@ -1711,10 +1749,6 @@ Grid.prototype.restoreColumns = function(columns) {
 		this._grid.freezeLayout(prevState);
 	}
 
-	if(removeLen > 0 && this._stp) {
-		this._stp.sortColumns(sortingStates);
-	}
-
 	grid.reorderColumns(columnOrdering);
 	grid.stopBatch("reset");
 };
@@ -2601,37 +2635,29 @@ Grid.prototype.hasHiddenRow = function(){
 /** Set RIC to the specified row
 * @public
 * @param {Grid~RowReference} rowRef
-* @param {string} str
+* @param {string} str RIC to be set to a row
 * @param {RowDefinition~Options=} options
 */
 Grid.prototype.setRic = function(rowRef, str, options) {
 	if(this._mainGrid) {
-		this._mainGrid.setRic(this._toRowId(rowRef), str);
+		this._mainGrid.setRic(this._toRowId(rowRef), str, options);
 		return;
 	}
 	var rowDef = this._getRowDefinitionByRef(rowRef);
 	if(rowDef) {
 		options = options || {};
-		var newChain = false;
-		if(str.indexOf("0#") > 0 || options["asChain"]) {
-			newChain = true;
+		options["ric"] = str;
+		var extractedOptions = RowDefinition.extractRowOptions(options);
+		var oldRic = rowDef.getSymbol();
+		if(rowDef.setContent(str, extractedOptions)) { // The given string may not be a RIC
+			this._connector.removeRic(rowDef, oldRic);
+			this._initDuplicateRicData(rowDef);
+			this._connector.addRic(rowDef);
 		}
-		if(rowDef.isChain() || newChain) {
-			if(rowDef.getRic() !== str.replace("0#", "")) {
-				var rowIndex = this._dv.getRowIndex(rowDef.getRowId());
-				this.removeRow(rowDef);
 
-				options["ric"] = str;
-				this.insertRow(options, rowIndex);
-			}
-		} else {
-			var oldRic = rowDef.getSymbol();
-			var permId = options["permId"] || "";
-			if(rowDef.setContent(str, permId)) { // The given string may not be a RIC
-				this._connector.removeRic(rowDef, oldRic);
-				this._initDuplicateRicData(rowDef);
-				this._connector.addRic(rowDef);
-			}
+		var values = options["values"];
+		if(values != null) {
+			rowDef.setStaticRowData(values, options["fields"]);
 		}
 	}
 };
@@ -3337,6 +3363,19 @@ Grid.prototype.clearSort = function() {
 	this._stp.clearSortState(); // WARNING: No event is dispatched
 };
 
+/**
+* @private
+* @param {Object} e Event object from quote2
+*/
+Grid.prototype._onQuote2PostUpdate = function (e) {
+	if(e.childOrderChange) { // For dynamic chain when CHILD_ORDER from the server change, it will be call sort children
+		if(!this.isSorting()) {
+			// Use rowDef for get CHILD_ORDER to sort
+			this._dt.sortOnce("ROW_DEF", "a", _sortChildrenOfChain);
+		}
+	}
+};
+
 /** @private
 * @param {!Object} e
 */
@@ -3882,6 +3921,28 @@ Grid.prototype._logData = function(rowDefs, options) {
 
 	console.table(tbl); // eslint-disable-line
 };
+/** @public
+* @description Replace existing row with a new row. Row ID would be changed, after row is replaced.
+* @param {Grid~RowReference} rowRef Reference (i.e. row index, row id, or row definition) of the insert position
+* @param {Object=} rowOption
+* @returns {Object}
+*/
+Grid.prototype.replaceRow = function(rowRef, rowOption) {
+	var rowId = this._getRowId(rowRef);
+	var rowDef = this._getRowDefinitionByRef(rowRef);
+	if(rowDef.isAutoGenerated()) { // Users cannot replace auto-generated
+		return  null;
+	}
+	var configObj = rowDef.getConfigObject();
+
+	if(deepEqual(configObj, rowOption)){
+		return null;
+	} else {
+		var insertedRow = this.insertRow(rowOption, rowId);
+		this.removeRow(rowId);
+		return insertedRow;
+	}
+};
 
 export { Grid };
 export default Grid;

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

@@ -13,7 +13,8 @@ declare namespace RowDefinition {
         chainRic?: string|null,
         collapsed?: boolean|null,
         label?: (string|null)|null,
-        hidden?: boolean|null
+        hidden?: boolean|null,
+        realTime?: boolean|null
     };
 
     type RowTypes = {
@@ -37,8 +38,6 @@ declare class RowDefinition {
 
     public initialize(rowOptions?: RowDefinition.Options|null): void;
 
-    public setContent(userInput: string, permId?: string|null, asChain?: boolean|null, expanded?: boolean|null, realTime?: boolean|null): boolean;
-
     public getRowId(): string;
 
     public getConfigObject(rowOptions?: RowDefinition.Options|null): RowDefinition.Options|null;
@@ -105,7 +104,7 @@ declare class RowDefinition {
 
     public resetUpdates(): void;
 
-    public registerToView(view: DataTable|null, rowId?: string|null): void;
+    public registerToView(view: DataView|null, rowId?: string|null): void;
 
     public static deregisterFromView(rowIds: (string)[]|null, rowDef: RowDefinition|null): (string)[]|null;
 
@@ -143,7 +142,7 @@ declare const ROW_DEF: string;
 
 declare const ROW_TYPES: RowDefinition.RowTypes;
 
-declare function rowData(userInput: string, permId?: string|null, asChain?: boolean|null, expanded?: boolean|null, realTime?: boolean|null): boolean;
+declare function rowData(userInput: string, extractedOptions: any): boolean;
 
 export {RowDefinition, ROW_DEF, ROW_TYPES};
 export default RowDefinition;

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

@@ -15,7 +15,7 @@ import { DataTable } from "../../core/es6/data/DataTable.js";
 * @property {boolean=} collapsed=true Chain is collapsed by default
 * @property {(string|null)=} label=null
 * @property {boolean=} hidden=true When this row is hidden
-* @pro // realTime
+* @property {boolean=} realTime=true Realtime row, able to request for JET/RTK
 */
 
 /** @typedef {Object} RowDefinition~RowTypes
@@ -217,6 +217,8 @@ RowDefinition.prototype.initialize = function(rowOptions) {
 		return;
 	}
 
+	var extractedOptions = RowDefinition.extractRowOptions(rowOptions);
+
 	var val = rowOptions["permId"];
 	if(val != null) {
 		this._permId = val;
@@ -234,13 +236,8 @@ RowDefinition.prototype.initialize = function(rowOptions) {
 	if(val != null) {
 		this._chainRic = val;
 	}
-	val = rowOptions["values"];
-	// eslint-disable-next-line no-undefined
-	if(val !== undefined) {
-		this.setStaticRowData(val, rowOptions["fields"]);
-	}
 
-	val = rowOptions["asChain"];
+	val = extractedOptions["asChain"];
 	if(val !== null) {
 		this._isChain = val;
 	}
@@ -251,29 +248,24 @@ RowDefinition.prototype.initialize = function(rowOptions) {
 	}
 
 	val = rowOptions["collapsed"];
-	if(val != null){
-		this._expanded = !val;
+	var collapsed = extractedOptions["collapsed"];
+	if(val != null || !collapsed){
+		this._expanded = !collapsed;
 	}
 	val = rowOptions["keepModel"];
 	if(val) {
 		this._userModel = rowOptions;
 	}
 
-	var expanded = this._expanded;
 	var symbol = this._ric || this._chainRic;
-	var asChain = this._isChain || !!this._chainRic;
-	if(this._ric && this._ric.indexOf("0#") >= 0){
-		asChain = true;
-		expanded = true;
-	}
-	if(this._isChain === false){
-		asChain = false;
-	}
-	if(this._expanded === false){
-		expanded = false;
-	}
 	if(symbol || this._permId){
-		this.setContent(symbol, this._permId, asChain, expanded); // this._dataId is modified
+		this.setContent(symbol, extractedOptions); // this._dataId is modified
+	}
+
+	val = rowOptions["values"];
+	// eslint-disable-next-line no-undefined
+	if(val !== undefined) {
+		this.setStaticRowData(val, rowOptions["fields"]);
 	}
 };
 /** @private
@@ -300,14 +292,12 @@ RowDefinition.prototype._initializeAsConstituent = function(rowOptions) {
 	}
 };
 /** @public
+* @ignore
 * @param {string} userInput RIC
-* @param {string=} permId=null Organization PermId, which use for getting ADC data for private  company
-* @param {boolean=} asChain
-* @param {boolean=} expanded
-* @param {boolean=} realTime
+* @param {Object} extractedOptions
 * @return {boolean} True if there is any change otherwise false
 */
-RowDefinition.prototype.setContent = function(userInput, permId, asChain, expanded) {
+RowDefinition.prototype.setContent = function(userInput, extractedOptions) {
 	if(this._autoGenerated) { // AutoGenerated RowDefinition cannot be changed by user input
 		return false;
 	}
@@ -319,6 +309,7 @@ RowDefinition.prototype.setContent = function(userInput, permId, asChain, expand
 	}
 
 	var dirty = (this._userInput !== userInput);
+	var permId = extractedOptions["permId"];
 	if(this._permId !== permId){
 		this._permId = permId || "";
 		dirty = true;
@@ -327,33 +318,42 @@ RowDefinition.prototype.setContent = function(userInput, permId, asChain, expand
 		return false;
 	}
 
-	this.unsubscribeForUpdates();
+	if(!this.unsubscribeForUpdates()){
+		this._clearStaticData();
+	}
 	this.resetUpdates(); // Remove all previous data updates because a new content is just entered
 
-	// TODO: handle changing between chain and ric row
 	this._userInput = userInput;
 	if(this._userInput.charAt(0) === "'") { // This is a row header
 		this._ric = this._chainRic = ""; // No ric for realtime request
 	} else {
-		if(this._userInput.indexOf("0#") >= 0) {
-			if(asChain === false){
-				this._ric = this._userInput;
-			} else {
-				this._ric = expanded === false ? this._userInput : this._userInput.replace("0#", "");
-				this._expanded = expanded;
-				this._isChain = true; // Only chain can be expanded by 0#
-				this._chainRic = this._userInput;
-				if(this._view) {
-					this._view.setSegmentSeparator(this._rowId);
-					this.expandChain();
-				}
-			}
+		var asChain = extractedOptions["asChain"];
+		var expanded = !extractedOptions["collapsed"];
+		var chainRic = extractedOptions["chainRic"];
+		if(asChain === true){
+			this._ric = expanded === false ? this._userInput : this._userInput.replace("0#", "");
+			this._expanded = expanded; // Only chain can be expanded by 0#
 		} else {
 			this._ric = this._userInput;
-			if(asChain){
-				this._isChain = true;
+		}
+		this._isChain = asChain;
+		this._chainRic = chainRic || "";
+	}
+
+	if(this._view) {
+		if(this._isChain){
+			var rid = this.getRowId();
+			var segmentId = this._view.getSegmentParentRowId(rid);
+			if(segmentId){
+				this._view.removeSegmentChild(segmentId, rid);
 			}
 		}
+		this._view.setSegmentSeparator(this._rowId, !!this._isChain);
+		if(this._expanded && this.isChainCollapsed()){
+			this.expandChain();
+		} else if (!this._expanded && this.isChainExpanded()){
+			this.collapseChain();
+		}
 	}
 
 	this._dataId = this._rowId + this.getSymbol(); // JET/RTK will generate data id to be rowId (given from this rowDef) + ric;
@@ -769,8 +769,17 @@ RowDefinition.prototype.subscribeForUpdates = function() {
 	var prevRowData = this.unsubscribeForUpdates();
 
 	if(this.isChain()) {
-		this._subId = subs["addChain"](this._chainRic || this._ric, this._rowId); // Some chain require 0# symbol to populate its constituents
-		// TODO: Handle Dynamic chain such as .PG.PA
+		var symbol = this._chainRic;
+		if(!symbol){
+			symbol = this._ric;
+			if(symbol.indexOf("0#") < 0){
+				var count = (symbol.match(/\./g) || []).length;
+				if(count < 2){
+					symbol = "0#" + symbol;
+				}
+			}
+		}
+		this._subId = subs["addChain"](symbol, this._rowId); // Some chain require 0# symbol to populate its constituents
 	} else if(this._ric) {
 		this._subId = subs["addRic"](this._ric, this._rowId);
 	}
@@ -798,7 +807,7 @@ RowDefinition.prototype.unsubscribeForUpdates = function() {
 	this.resetUpdates();
 	// TODO: Reset only if this is the last ric
 	this._dc.setRowData(this._dataId, null); // Trigger data update immediately
-	// TODO: Handle static values
+	this._clearStaticData();
 	// eslint-disable-next-line consistent-return
 	return prevRowData;
 };
@@ -847,7 +856,7 @@ RowDefinition.prototype.resetUpdates = function() {
 };
 
 /** @public
-* @param {DataTable} view
+* @param {DataView} view
 * @param {string=} rowId
 */
 RowDefinition.prototype.registerToView = function(view, rowId) {
@@ -964,11 +973,17 @@ RowDefinition.prototype.addConstituent = function(ric) {
 	}
 
 	if(this._view) {
-		// WARNING: ChildCount may not be enough to determine proper inserting position
-		// TODO: Handle nested children
 		var rowId = this.getRowId();
-		var rowIndex = this._view.getRowIndex(rowId) + this.getChildCount(); // Children must be directly under its parent
-		childDef.registerToView(this._view, this._view.getRowId(rowIndex));
+		// WARNING: insert position, we prioritize using CHILD_ORDER (From server) in dc first. If it does not exist, the last row of the segment will be pushed
+		var childOrder = childDef.getData("CHILD_ORDER");
+		var parentIndex =  this._view.getRowIndex(rowId);
+		var position =  parentIndex + this.getChildCount(); // push the last position
+		if(childOrder != null) {
+			// Warning: We need to carry a value of 1 because the CHILD_ORDER starts with 0, and it will be added to the parentIndex. In case the parent rowIndex is not included.
+			position = parentIndex + childOrder + 1; // insert between segment
+		} // else {} it will be push in the last row of segment
+		childDef.registerToView(this._view, this._view.getRowId(position));
+		// TODO: Handle nested children
 		this._view.addSegmentChild(rowId, childDef.getRowId(), childDef.getDataId());
 	}
 
@@ -1210,6 +1225,42 @@ RowDefinition.prototype.getUserModel = function() {
 RowDefinition.toRowId = function(rowDef) {
 	return rowDef.getRowId();
 };
+/** For transforming row options into standard format
+* @public
+* @ignore
+* @function
+* @param {RowDefinition~Options} rowOptions
+* @return {RowDefinition~Options}
+*/
+RowDefinition.extractRowOptions = function(rowOptions) {
+	var ric = rowOptions["ric"];
+	var permId = rowOptions["permId"];
+	var chainRic = rowOptions["chainRic"];
+	var collapsed = rowOptions["collapsed"];
+	var asChain = rowOptions["asChain"];
+	if(asChain == null && chainRic){
+		asChain = true;
+	}
+	var expanded = null;
+	if(ric && ric.indexOf("0#") >= 0){
+		if(asChain == null){
+			asChain = true;
+		}
+		expanded = true;
+	}
+
+	var extractedOptions = {};
+	if(collapsed == null) {
+		extractedOptions["collapsed"] = !expanded;
+	} else {
+		extractedOptions["collapsed"] = collapsed;
+	}
+	extractedOptions["ric"] = ric;
+	extractedOptions["permId"] = permId;
+	extractedOptions["chainRic"] = chainRic;
+	extractedOptions["asChain"] = asChain;
+	return extractedOptions;
+};
 /** For mapping row Id by Array.map()
 * @public
 * @function

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

@@ -64,10 +64,6 @@ ColumnGroupingPlugin.prototype._maxDepth = 0;
 * @private
 */
 ColumnGroupingPlugin.prototype._restructuring = false;
-/** @type {boolean}
-* @private
-*/
-ColumnGroupingPlugin.prototype._autoGrouping = true;
 /** @type {number}
 * @private
 */
@@ -894,9 +890,11 @@ ColumnGroupingPlugin.prototype._applyTimeSeries = function (e) {
 * @param {Object} e dispatching of columnAdded event object
 */
 ColumnGroupingPlugin.prototype._onColumnAdded = function (e) {
-  var colIndex = e.colIndex;
-  this._requestApplyAddChildGroup(e);
-  this._applyNearestGrouping(colIndex);
+  var batches = e["batches"];
+  if (!(batches && batches["reset"])) {
+    this._requestApplyAddChildGroup(e);
+    this._applyNearestGrouping(e.colIndex);
+  }
   this._requestApplyGrouping();
 };
 /** @private
@@ -908,7 +906,8 @@ ColumnGroupingPlugin.prototype._onColumnChanged = function () {
 * @param {Object} e dispatching of columnMoved event object
 */
 ColumnGroupingPlugin.prototype._onColumnMoved = function (e) {
-  if (this._autoGrouping) {
+  var batches = e["batches"];
+  if (!(batches && batches["move"])) {
     this._applyNearestGrouping(e.toColIndex);
   }
   this._requestApplyGrouping();
@@ -917,11 +916,16 @@ ColumnGroupingPlugin.prototype._onColumnMoved = function (e) {
 * @param {Object} e
 */
 ColumnGroupingPlugin.prototype._onColumnRemoved = function (e) {
-  var colId = e.colId;
-  if (colId) {
-    if (this._groupDefs.unsetParent(colId)) {
-      this._requestApplyGrouping();
+  var batches = e["batches"];
+  if (!(batches && batches["reset"])) {
+    var colId = e.colId;
+    if (colId) {
+      if (this._groupDefs.unsetParent(colId)) {
+        this._requestApplyGrouping();
+      }
     }
+  } else {
+    this._requestApplyGrouping();
   }
 };
 /** @private
@@ -1028,29 +1032,22 @@ ColumnGroupingPlugin.prototype._onBeforeColumnBoundUpdate = function (e) {
 */
 ColumnGroupingPlugin.prototype.addColumnToGroup = function (column, groupId, colIndex) {
   if (!column) return;
-  var columnIndex = -1;
-  if (colIndex == null) {
+  var destIndex = this.getColumnCount();
+  if (colIndex != null) {
     var groupDef = this._groupDefs.getGroup(groupId);
     if (groupDef) {
-      var childIndices = this.getChildColumnIndices(groupId);
-      if (childIndices && childIndices.length) {
-        // Child indices need to be sorted here
-        columnIndex = childIndices[childIndices.length - 1] + 1; // Put new column next to the last child in the group
-      }
-
       this._groupDefs.addGroupChild(groupId, column.id);
     }
-  } else {
-    columnIndex = colIndex;
-  }
-  if (columnIndex < 0) {
-    columnIndex = this.getColumnCount();
+    destIndex = colIndex;
   }
   if (this._realTimeGrid) {
     // TODO: Support multi-table feature
-    this._realTimeGrid.insertColumn(column, columnIndex);
+    this._realTimeGrid.insertColumn(column, destIndex);
   } else if (this._compositeGrid) {
-    this._compositeGrid.insertColumn(columnIndex, column);
+    this._compositeGrid.insertColumn(destIndex, column);
+  }
+  if (colIndex == null) {
+    this.setColumnParent(column.id || destColIndex, groupId);
   }
 };
 
@@ -1622,13 +1619,7 @@ ColumnGroupingPlugin.prototype.moveGroup = function (id, destCol) {
 * @return {boolean}
 */
 ColumnGroupingPlugin.prototype.reorderColumns = function (colList, destCol) {
-  var dirty = false;
-  // TODO: create method for toggling autoGrouping flag
-  this._autoGrouping = false; // Prevent re-grouping in columnMoved event
-
-  this._reorderColumns(colList, destCol);
-  this._autoGrouping = true;
-  return dirty;
+  return this._reorderColumns(colList, destCol);
 };
 /** Move the specified column to position before the destination
 * @public
@@ -1637,12 +1628,7 @@ ColumnGroupingPlugin.prototype.reorderColumns = function (colList, destCol) {
 * @return {boolean}
 */
 ColumnGroupingPlugin.prototype.moveColumnById = function (srcCol, destCol) {
-  var dirty = false;
-  this._autoGrouping = false; // Prevent re-grouping in columnMoved event
-
-  this._moveColumnById(srcCol, destCol);
-  this._autoGrouping = true;
-  return dirty;
+  return this._moveColumnById(srcCol, destCol);
 };
 /** @public
 * @param {string} groupId