@refinitiv-ui/efx-grid 6.0.92 → 6.0.93

package/lib/tr-grid-column-stack/es6/ColumnStack.js

@@ -70,9 +70,9 @@ import { preventDefault } from "../../tr-grid-util/es6/EventDispatcher.js";
 * @param {*} refB
 * @return {number}
 */
-var _indexSorter = function(indexMap, refA, refB) {
-	var numA = indexMap[refA];
-	var numB = indexMap[refB];
+let _indexSorter = function(indexMap, refA, refB) {
+	let numA = indexMap[refA];
+	let numB = indexMap[refB];
 	if(numA === numB) {
 		return 0;
 	}
@@ -90,7 +90,7 @@ var _indexSorter = function(indexMap, refA, refB) {
 * @param {*} refA
 * @return {boolean}
 */
-var _byValidIndex = function(indexMap, refA) {
+let _byValidIndex = function(indexMap, refA) {
 	return indexMap[refA] >= 0;
 };
 
@@ -99,11 +99,11 @@ var _byValidIndex = function(indexMap, refA) {
 * @param {Object} stackOpt
 * @return {boolean} Return true if there is any change
 */
-var _resolveActiveColumn = function(stackOpt) {
+let _resolveActiveColumn = function(stackOpt) {
 	if(stackOpt) {
-		var children = stackOpt.children;
+		let children = stackOpt.children;
 		if(children && children.length) {
-			var activeColumn = stackOpt.activeColumn;
+			let activeColumn = stackOpt.activeColumn;
 			if(!activeColumn || children.indexOf(activeColumn) < 0) {
 				stackOpt.activeColumn = stackOpt.spreading ? children[children.length - 1] : children[0];
 				return true;
@@ -116,7 +116,7 @@ var _resolveActiveColumn = function(stackOpt) {
 /** @constructor
 * @extends {GridPlugin}
 */
-var ColumnStackPlugin = function () {
+let ColumnStackPlugin = function () {
 	this._onPreSectionRender = this._onPreSectionRender.bind(this);
 	this._onColumnRemoved = this._onColumnRemoved.bind(this);
 	this._onColumnMoved = this._onColumnMoved.bind(this);
@@ -182,7 +182,7 @@ ColumnStackPlugin._runningId = 0;
  * @return {string}
  */
 ColumnStackPlugin.prototype._generateStackId = function() {
-	var sid = "Stack" + ColumnStackPlugin._runningId++;
+	let sid = "Stack" + ColumnStackPlugin._runningId++;
 	while(this._groupDefs.getGroup(sid)) {
 		sid = "Stack" + ColumnStackPlugin._runningId++;
 	}
@@ -211,7 +211,7 @@ ColumnStackPlugin.prototype.initialize = function (host, options) {
 
 	if(options) {
 		if(options["icons"]) {
-			var icons = options["icons"]["columnStack"];
+			let icons = options["icons"]["columnStack"];
 			if(icons) {
 				this._stackIconName = icons["stack"];
 				this._expandIconName = icons["expand"];
@@ -219,15 +219,15 @@ ColumnStackPlugin.prototype.initialize = function (host, options) {
 			}
 		}
 
-		var opt = options["columnStack"];
+		let opt = options["columnStack"];
 		if(opt && this._hosts.length === 1) {
-			var menuElement = opt["menuElement"];
+			let menuElement = opt["menuElement"];
 			if(menuElement && typeof menuElement === "object" && menuElement.nodeType === 1) {
 				menuElement.addEventListener("item-trigger", this._onMenuItemClicked);
 				this._menuElement = menuElement;
 			}
 
-			var menuItemClicked = opt["menuItemClicked"];
+			let menuItemClicked = opt["menuItemClicked"];
 			if(typeof menuItemClicked === "function") {
 				this._menuItemClicked = menuItemClicked;
 			}
@@ -253,7 +253,7 @@ ColumnStackPlugin.prototype.initialize = function (host, options) {
 * @param {Object} host core grid object
 */
 ColumnStackPlugin.prototype.unload = function (host) {
-	var at = this._hosts.indexOf(host);
+	let at = this._hosts.indexOf(host);
 	if(at < 0) { return; }
 	this._hosts.splice(at, 1);
 
@@ -311,7 +311,7 @@ ColumnStackPlugin._styles = prettifyCss([
 * @param {Object} grid core grid object
 */
 ColumnStackPlugin._applyThemeColor = function(grid) {
-	if (!grid._columnStackingStyles) {
+	if(!grid._columnStackingStyles) {
 		grid._columnStackingStyles = true;
 		injectCss(ColumnStackPlugin._styles, grid.getElement());
 	}
@@ -323,19 +323,19 @@ ColumnStackPlugin._applyThemeColor = function(grid) {
 ColumnStackPlugin.prototype.config = function (options) {
 	if(!options) { return; }
 
-	var columns = options["columns"];
+	let columns = options["columns"];
 	if(!columns) {
 		columns = [];
 	}
 
-	var i;
-	var colCount = columns.length;
+	let i;
+	let colCount = columns.length;
 
-	var columnStack = options.columnStack;
-	var stackId = "";
-	var stacks = {};
-	var hasStack = false;
-	var stackConfig = null;
+	let columnStack = options.columnStack;
+	let stackId = "";
+	let stacks = {};
+	let hasStack = false;
+	let stackConfig = null;
 	if(columnStack) {
 		this.addListener(columnStack, "clicked");
 		this._usingField = false;
@@ -351,9 +351,9 @@ ColumnStackPlugin.prototype.config = function (options) {
 				collapsed: columnStack.collapsed !== false,
 				fields: columnStack.fields
 			};
-		} else if (columnStack.stacks && columnStack.stacks.length) {
+		} else if(columnStack.stacks && columnStack.stacks.length) {
 			hasStack = true;
-			var stackLen = columnStack.stacks.length;
+			let stackLen = columnStack.stacks.length;
 			for(i = 0; i < stackLen; i++){
 				stackConfig = columnStack.stacks[i];
 				stackId = stackConfig.id || this._generateStackId();
@@ -370,16 +370,16 @@ ColumnStackPlugin.prototype.config = function (options) {
 
 	if(!hasStack) {
 		for(i = 0; i < colCount; ++i) {
-			var column = columns[i];
-			var stackOpt = column["stackId"] || column["stack"];
+			let column = columns[i];
+			let stackOpt = column["stackId"] || column["stack"];
 			if(!stackOpt) {
 				continue;
 			}
 
 			stackId = "";
-			var spreading = false;
-			var collapsed = true;
-			var activeColumn = "";
+			let spreading = false;
+			let collapsed = true;
+			let activeColumn = "";
 			if(typeof stackOpt === "string") {
 				stackId = stackOpt;
 			} else if(typeof stackOpt === "object") {
@@ -423,10 +423,10 @@ ColumnStackPlugin.prototype.config = function (options) {
 * @return {!Object}
 */
 ColumnStackPlugin.prototype.getConfigObject = function (gridOptions) {
-	var obj = gridOptions || {};
+	let obj = gridOptions || {};
 
 	// TODO: Handle the case where pendingStacks has not been applied
-	var stackOptions = this.getStacks();
+	let stackOptions = this.getStacks();
 
 	if(stackOptions.length) {
 		obj.columnStack = {};
@@ -466,10 +466,10 @@ ColumnStackPlugin.prototype._toColumnId = function(colRef) {
 ColumnStackPlugin.prototype._applyUserConfigs = function(stacks) {
 	if(stacks) {
 		this.removeAllStacks(false); // No UI update
-		for(var stackId in stacks) {
-			var stack = stacks[stackId];
-			var children = stack.children;
-			var fields = stack.fields;
+		for(let stackId in stacks) {
+			let stack = stacks[stackId];
+			let children = stack.children;
+			let fields = stack.fields;
 			if(fields) { // Convert all fields and indices to column Ids
 				this._usingField = true;
 				children = fields; // override children with fields
@@ -487,7 +487,7 @@ ColumnStackPlugin.prototype._applyUserConfigs = function(stacks) {
 */
 ColumnStackPlugin.prototype._getColumnStackOptions = function(colIndex) {
 	if(colIndex >= 0 && colIndex < this.getColumnCount()) {
-		var colId = this.getColumnId(colIndex);
+		let colId = this.getColumnId(colIndex);
 		return this._groupDefs.getParentGroup(colId) || null;
 	}
 	return null;
@@ -496,7 +496,7 @@ ColumnStackPlugin.prototype._getColumnStackOptions = function(colIndex) {
 * @return {!Array.<number>} Sorted column indices
 */
 ColumnStackPlugin.prototype._getSelectedColumns = function() {
-	var csp = this._getPlugin("ColumnSelectionPlugin");
+	let csp = this._getPlugin("ColumnSelectionPlugin");
 	return (csp && csp.isEnabled()) ? csp.getSelectedColumns() : [];
 };
 /** Hide the specified column to prevent it from flashing when it is added as a member of the stack
@@ -510,8 +510,8 @@ ColumnStackPlugin.prototype._hideStackedColumns = function(stack, colRefs, activ
 		return; // In spreading mode, columns in an expanded stack don't need to be hidden
 	}
 	// WARNING: activeIndex may not be valid
-	var activeIndex = (typeof activeRef === "number") ? activeRef : this.getColumnIndex(stack.activeColumn);
-	var colIndices = null;
+	let activeIndex = (typeof activeRef === "number") ? activeRef : this.getColumnIndex(stack.activeColumn);
+	let colIndices = null;
 	if(typeof colRefs === "number") {
 		colIndices = [colRefs];
 	} else if(colIndices == null) {
@@ -519,9 +519,9 @@ ColumnStackPlugin.prototype._hideStackedColumns = function(stack, colRefs, activ
 	} else {
 		colIndices = colRefs;
 	}
-	var validCount = colIndices.length;
-	for(var i = 0; i < validCount; ++i) {
-		var colIndex = colIndices[i];
+	let validCount = colIndices.length;
+	for(let i = 0; i < validCount; ++i) {
+		let colIndex = colIndices[i];
 		if(colIndex !== activeIndex) {
 			this._setColumnVisibility(colIndex, false); // Hide a column
 		}
@@ -533,8 +533,8 @@ ColumnStackPlugin.prototype._hideStackedColumns = function(stack, colRefs, activ
 */
 ColumnStackPlugin.prototype._setColumnVisibility = function(colIndex, shown) {
 	if(colIndex >= 0) {
-		var dirty = false;
-		for(var g = this._hosts.length; --g >= 0;) {
+		let dirty = false;
+		for(let g = this._hosts.length; --g >= 0;) {
 			dirty |= this._hosts[g].setColumnVisibility(colIndex, shown, 2);
 		}
 
@@ -548,7 +548,7 @@ ColumnStackPlugin.prototype._requestFilterRefresh = function() {
 	if(this._filterConflator.conflate()) {
 		return;
 	}
-	var rfp = this._getPlugin("RowFilteringPlugin");
+	let rfp = this._getPlugin("RowFilteringPlugin");
 	if(rfp && rfp["refresh"]) {
 		rfp["refresh"]();
 	}
@@ -557,7 +557,7 @@ ColumnStackPlugin.prototype._requestFilterRefresh = function() {
 * @param {Array} colRefs Array of column index, id, or field
 */
 ColumnStackPlugin.prototype._moveStackedColumns = function (colRefs) {
-	var colIndices = this.getColumnIndices(colRefs);
+	let colIndices = this.getColumnIndices(colRefs);
 	if(colIndices.length > 1) {
 		this.reorderColumns(colIndices, colIndices[0]);
 	}
@@ -575,19 +575,19 @@ ColumnStackPlugin.prototype._isIconAvailable = function() {
 * @param {Object} stackOpt
 */
 ColumnStackPlugin.prototype._updateIcon = function(colIndex, stackOpt) {
-	var spreading = (stackOpt) ? stackOpt.spreading : false;
-	var gridCount = this._hosts.length;
-
-	for(var g = 0; g < gridCount; ++g) {
-		var host = this._hosts[g];
-		var tSect = host.getSection("title");
-		var rowCount = tSect.getRowCount();
-		var cell = tSect.getCell(colIndex, rowCount - 1, true);
+	let spreading = (stackOpt) ? stackOpt.spreading : false;
+	let gridCount = this._hosts.length;
+
+	for(let g = 0; g < gridCount; ++g) {
+		let host = this._hosts[g];
+		let tSect = host.getSection("title");
+		let rowCount = tSect.getRowCount();
+		let cell = tSect.getCell(colIndex, rowCount - 1, true);
 		if(!cell) { continue; }
 
-		var stackIcon = cell._stackIcon;
+		let stackIcon = cell._stackIcon;
 		if(stackOpt) {
-			var activeStackedColumn = this.isActiveStackedColumn(colIndex);
+			let activeStackedColumn = this.isActiveStackedColumn(colIndex);
 			if(!stackIcon && activeStackedColumn) {
 				if(spreading) {
 					cell.addClass("grouping");
@@ -647,15 +647,15 @@ ColumnStackPlugin.prototype._updateUI = function() {
 	}
 
 	this._updating = true;
-	var colCount = this.getColumnCount();
-	var gridCount = this._hosts.length;
-	var stackOpt, spreading;
-	for(var c = 0; c < colCount; ++c) {
+	let colCount = this.getColumnCount();
+	let gridCount = this._hosts.length;
+	let stackOpt, spreading;
+	for(let c = 0; c < colCount; ++c) {
 		stackOpt = this._getColumnStackOptions(c);
 		spreading = (stackOpt) ? stackOpt.spreading : false;
 		spreading = spreading === true;
-		for(var g = 0; g < gridCount; ++g) {
-			var host = this._hosts[g];
+		for(let g = 0; g < gridCount; ++g) {
+			let host = this._hosts[g];
 			host.enableColumnClass(c, "grouped", spreading);
 		}
 
@@ -681,20 +681,20 @@ ColumnStackPlugin.prototype._forceUpdateUI = function() {
 * @param {boolean} collapsed
 */
 ColumnStackPlugin.prototype._collapseMember = function(colIndex, collapsed) {
-	var stackOpt = this._getColumnStackOptions(colIndex);
+	let stackOpt = this._getColumnStackOptions(colIndex);
 	if(!stackOpt) {
 		return;
 	}
 
-	for (var i = this._hosts.length; --i >= 0;) {
-		var host = this._hosts[i];
+	for(let i = this._hosts.length; --i >= 0;) {
+		let host = this._hosts[i];
 		host.enableColumnClass(colIndex, "collapsed", collapsed);
 
 		if(this.isActiveStackedColumn(colIndex)) {
 			host.setColumnVisibility(colIndex, true, 2);
-			var tSect = host.getSection("title");
-			var rowCount = tSect.getRowCount();
-			var cell = tSect.getCell(colIndex, rowCount - 1, true);
+			let tSect = host.getSection("title");
+			let rowCount = tSect.getRowCount();
+			let cell = tSect.getCell(colIndex, rowCount - 1, true);
 			if(collapsed) {
 				if(stackOpt.collapsed !== collapsed || !stackOpt._origWidth) { // Prevent from getting width while column is collapsed
 					stackOpt._origWidth = this._getColumnWidth(host, colIndex);
@@ -738,8 +738,8 @@ ColumnStackPlugin.prototype._collapseMember = function(colIndex, collapsed) {
 */
 ColumnStackPlugin.prototype._getColumnWidth = function(host, colIndex) {
 	if(host) {
-		var min = host.getMinimumColumnWidth(colIndex);
-		var size = host.getColumnCustomLaneSize(colIndex);
+		let min = host.getMinimumColumnWidth(colIndex);
+		let size = host.getColumnCustomLaneSize(colIndex);
 		return (size < min) ? min : size; // Column width cannot be smaller than min
 	}
 	return NaN;
@@ -749,7 +749,7 @@ ColumnStackPlugin.prototype._getColumnWidth = function(host, colIndex) {
 * @return {Array.<number>} Null if there is no column data
 */
 ColumnStackPlugin.prototype.getMemberIndices = function(colIndex) {
-	var stackOpt = this._getColumnStackOptions(colIndex);
+	let stackOpt = this._getColumnStackOptions(colIndex);
 	if(stackOpt) {
 		return this.getColumnIndices(stackOpt.children);
 	}
@@ -761,7 +761,7 @@ ColumnStackPlugin.prototype.getMemberIndices = function(colIndex) {
 * @return {Array.<number>} Null if it is non-grouped column
 */
 ColumnStackPlugin.prototype.collapseGroup = function(colIndex, collapsed) {
-	var stackOpt = this._getColumnStackOptions(colIndex);
+	let stackOpt = this._getColumnStackOptions(colIndex);
 	if(!stackOpt) {
 		return null;
 	}
@@ -771,9 +771,9 @@ ColumnStackPlugin.prototype.collapseGroup = function(colIndex, collapsed) {
 
 	collapsed = collapsed !== false;
 	if(stackOpt.collapsed !== collapsed) {
-		var groupMembers = this.getColumnIndices(stackOpt.children);
+		let groupMembers = this.getColumnIndices(stackOpt.children);
 		if(groupMembers) {
-			for(var j = groupMembers.length; --j >= 0;) {
+			for(let j = groupMembers.length; --j >= 0;) {
 				this._collapseMember(groupMembers[j], collapsed);
 			}
 			stackOpt.collapsed = collapsed;
@@ -799,8 +799,8 @@ ColumnStackPlugin.prototype.isColumnStackable = function(colIndices) {
 	if(!colIndices) {
 		return false;
 	}
-	var len = colIndices.length;
-	for(var i = 0; i < len; ++i) {
+	let len = colIndices.length;
+	for(let i = 0; i < len; ++i) {
 		if(this._getColumnStackOptions(colIndices[i])) {
 			return false;
 		}
@@ -816,8 +816,8 @@ ColumnStackPlugin.prototype.isColumnStacked = function(colIndices) {
 	if(!colIndices) {
 		colIndices = this._getSelectedColumns();
 	}
-	var len = colIndices.length;
-	for(var i = 0; i < len; ++i) {
+	let len = colIndices.length;
+	for(let i = 0; i < len; ++i) {
 		if(this._getColumnStackOptions(colIndices[i])) {
 			return true;
 		}
@@ -831,7 +831,7 @@ ColumnStackPlugin.prototype.isColumnStacked = function(colIndices) {
 * @see {@link ColumnStackPlugin#isColumnActive}
 */
 ColumnStackPlugin.prototype.isInactiveStackedColumn = function(colIndex) {
-	var stackOpt = this._getColumnStackOptions(colIndex);
+	let stackOpt = this._getColumnStackOptions(colIndex);
 	if(stackOpt) {
 		return !this._isActiveStackedColumn(colIndex, stackOpt);
 	}
@@ -865,7 +865,7 @@ ColumnStackPlugin.prototype._isActiveStackedColumn = function(colIndex, stackOpt
 * @return {boolean}
 */
 ColumnStackPlugin.prototype.isStackingMode = function(colIndex) {
-	var stackOpt = this._getColumnStackOptions(colIndex);
+	let stackOpt = this._getColumnStackOptions(colIndex);
 	if(stackOpt) {
 		return stackOpt.spreading !== true;
 	}
@@ -876,7 +876,7 @@ ColumnStackPlugin.prototype.isStackingMode = function(colIndex) {
 * @return {boolean}
 */
 ColumnStackPlugin.prototype.isCollapsingMode = function(colIndex) {
-	var stackOpt = this._getColumnStackOptions(colIndex);
+	let stackOpt = this._getColumnStackOptions(colIndex);
 	if(stackOpt) {
 		return stackOpt.spreading === true;
 	}
@@ -902,7 +902,7 @@ ColumnStackPlugin.prototype.isInCollection = ColumnStackPlugin.prototype.isColum
 * @return {boolean}
 */
 ColumnStackPlugin.prototype.isColumnCollapsed = function(colIndex) {
-	var stackOpt = this._getColumnStackOptions(colIndex);
+	let stackOpt = this._getColumnStackOptions(colIndex);
 	if(stackOpt) {
 		return (stackOpt.spreading === true) && (stackOpt.collapsed === true);
 	}
@@ -913,7 +913,7 @@ ColumnStackPlugin.prototype.isColumnCollapsed = function(colIndex) {
 * @return {boolean}
 */
 ColumnStackPlugin.prototype.isColumnActive = function(colIndex) {
-	var stackOpt = this._getColumnStackOptions(colIndex);
+	let stackOpt = this._getColumnStackOptions(colIndex);
 	if(stackOpt) {
 		if(stackOpt.spreading) {
 			if(!stackOpt.collapsed) {
@@ -933,9 +933,9 @@ ColumnStackPlugin.prototype.isColumnActive = function(colIndex) {
 * @return {string}
 */
 ColumnStackPlugin.prototype.getStackId = function(colRef) {
-	var colIndex = (typeof colRef === "number") ? colRef : this.getColumnIndex(colRef);
+	let colIndex = (typeof colRef === "number") ? colRef : this.getColumnIndex(colRef);
 	if(colIndex >= 0) {
-		var stackOpt = this._getColumnStackOptions(colIndex);
+		let stackOpt = this._getColumnStackOptions(colIndex);
 		if(stackOpt) {
 			return stackOpt.id || "";
 		}
@@ -949,8 +949,8 @@ ColumnStackPlugin.prototype.getStackId = function(colRef) {
 * @return {boolean} Return true if there is any change.
 */
 ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options) {
-	var updateRequired = false;
-	var sid = stackId;
+	let updateRequired = false;
+	let sid = stackId;
 	if(sid) {
 		if(this._removeStack(sid)) {
 			// TODO: pinning state are removed and may need to be kept
@@ -964,7 +964,7 @@ ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options) {
 		colRefs = this._getSelectedColumns();
 	}
 
-	var refCount = colRefs ? colRefs.length : 0;
+	let refCount = colRefs ? colRefs.length : 0;
 	if(refCount < 2) {
 		if(updateRequired) {
 			this._updateUI();
@@ -976,11 +976,11 @@ ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options) {
 		options = {};
 	}
 	// Clone user data
-	var isSpreading = options.spreading === true;
-	var isCollapsed = options.collapsed !== false;
-	var activeColumn = options.activeColumn || "";  // field or id
+	let isSpreading = options.spreading === true;
+	let isCollapsed = options.collapsed !== false;
+	let activeColumn = options.activeColumn || "";  // field or id
 	// WARNING: fields property in user option is ignored
-	var stack = {};
+	let stack = {};
 	stack.id = sid;
 	stack.name = options.name || "";
 	stack.spreading = isSpreading;
@@ -989,7 +989,7 @@ ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options) {
 
 	// If grid is not initialized, add setting to pending stacks
 	if(!this._initializedGrid) {
-		var pendingStacks = this._pendingStacks;
+		let pendingStacks = this._pendingStacks;
 		if(!pendingStacks) {
 			pendingStacks = this._pendingStacks = {};
 		}
@@ -998,7 +998,7 @@ ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options) {
 		return false;
 	}
 
-	var colIndices = this.getColumnIndices(colRefs); // WARNING: Invalid columns are filtered out
+	let colIndices = this.getColumnIndices(colRefs); // WARNING: Invalid columns are filtered out
 
 	// Prevent columns already in a stack from moving out to another stack
 	if(!this.isColumnStackable(colIndices)) {
@@ -1009,10 +1009,10 @@ ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options) {
 	}
 
 	// WARNING: Invalid columns are filtered out
-	var children = colIndices.map(this._toColumnId); // All fields and indices from colRefs will be converted to column Ids
+	let children = colIndices.map(this._toColumnId); // All fields and indices from colRefs will be converted to column Ids
 	stack.children = children; // Note: children property now contains only valid column ids
 
-	var activeIndex = -1;
+	let activeIndex = -1;
 	if(activeColumn && typeof activeColumn === "string") {
 		activeIndex = this.getColumnIndex(activeColumn);
 		stack.activeColumn = activeColumn = this.getColumnId(activeIndex); // Convert field or invalid column id to a valid id
@@ -1031,13 +1031,13 @@ ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options) {
 	this.reorderColumns(colIndices, colIndices[0]);
 
 	// Update column selection
-	var validCount = colIndices.length;
+	let validCount = colIndices.length;
 	if(!isSpreading) {
-		var csp = this._getPlugin("ColumnSelectionPlugin");
+		let csp = this._getPlugin("ColumnSelectionPlugin");
 		if(csp && csp.isEnabled()){
-			var stackSelection = false;
-			for(var i = 0; i < validCount; ++i){
-				var colIndex = colIndices[i];
+			let stackSelection = false;
+			for(let i = 0; i < validCount; ++i){
+				let colIndex = colIndices[i];
 				if(colIndex === activeIndex){
 					continue;
 				}
@@ -1070,32 +1070,32 @@ ColumnStackPlugin.prototype._verifyColumnPinning = function(stack) {
 	stack.leftPinned = false;
 	stack.rightPinned = false;
 
-	var host = this._hosts[0];
-	var leftPinnedIndex = host.getFrozenColumnCount() - 1;
-	var rightPinnedIndex = host.getFirstPinnedRightIndex();
-	var colCount = this.getColumnCount();
+	let host = this._hosts[0];
+	let leftPinnedIndex = host.getFrozenColumnCount() - 1;
+	let rightPinnedIndex = host.getFirstPinnedRightIndex();
+	let colCount = this.getColumnCount();
 
-	if (leftPinnedIndex < 0 && rightPinnedIndex === colCount) {
+	if(leftPinnedIndex < 0 && rightPinnedIndex === colCount) {
 		return;
 	}
 
-	var colIndices = this.getColumnIndices(stack.children);
-	var min = colIndices[0];
-	var max = colIndices[0];
-	for (var i = 1; i < colIndices.length; i++) {
-		var colIndex = colIndices[i];
-		if (colIndex > max) { max = colIndex; }
-		if (colIndex < min) { min = colIndex; }
+	let colIndices = this.getColumnIndices(stack.children);
+	let min = colIndices[0];
+	let max = colIndices[0];
+	for(let i = 1; i < colIndices.length; i++) {
+		let colIndex = colIndices[i];
+		if(colIndex > max) { max = colIndex; }
+		if(colIndex < min) { min = colIndex; }
 	}
 
-	if (min <= leftPinnedIndex) {
+	if(min <= leftPinnedIndex) {
 		stack.leftPinned = true;
-		if (max > leftPinnedIndex) {
+		if(max > leftPinnedIndex) {
 			this._freezeColumn(max, colCount - rightPinnedIndex);
 		}
-	} else if (max >= rightPinnedIndex) {
+	} else if(max >= rightPinnedIndex) {
 		stack.rightPinned = true;
-		if (min < rightPinnedIndex) {
+		if(min < rightPinnedIndex) {
 			this._freezeColumn(leftPinnedIndex, colCount - min);
 		}
 	}
@@ -1106,8 +1106,8 @@ ColumnStackPlugin.prototype._verifyColumnPinning = function(stack) {
 * @param {number=} numRightColumn
 */
 ColumnStackPlugin.prototype._freezeColumn = function(frozenColIndex, numRightColumn) {
-	var hosts = this._hosts;
-	for (var i = 0; i < hosts.length; i++) {
+	let hosts = this._hosts;
+	for(let i = 0; i < hosts.length; i++) {
 		hosts[i].freezeColumn(frozenColIndex, numRightColumn);
 	}
 };
@@ -1121,7 +1121,7 @@ ColumnStackPlugin.prototype._freezeColumn = function(frozenColIndex, numRightCol
 ColumnStackPlugin.prototype.setStack = function(colRefs, activeColRef) {
 	this.removeAllStacks();
 
-	var stackOptions = {};
+	let stackOptions = {};
 	if(activeColRef) {
 		stackOptions.activeColumn = activeColRef;
 	}
@@ -1137,9 +1137,9 @@ ColumnStackPlugin.prototype.setStack = function(colRefs, activeColRef) {
 ColumnStackPlugin.prototype.setStacks = function(stacks) {
 	this.removeAllStacks();
 
-	var stackCount = stacks ? stacks.length : 0;
-	for(var i = 0; i < stackCount; ++i) {
-		var stack = stacks[i];
+	let stackCount = stacks ? stacks.length : 0;
+	for(let i = 0; i < stackCount; ++i) {
+		let stack = stacks[i];
 		if(stack) {
 			if(stack.children) {
 				this.stackColumns(stack.children, stack.id, stack);
@@ -1152,35 +1152,35 @@ ColumnStackPlugin.prototype.setStacks = function(stacks) {
 * @return {!Array.<ColumnStackPlugin~StackDefinition>} Array of stack definition objects
 */
 ColumnStackPlugin.prototype.getStacks = function() {
-	var stacks = this._groupDefs.getGroupMap();
-	var stackOptions = [];
+	let stacks = this._groupDefs.getGroupMap();
+	let stackOptions = [];
 
-	for (var stackKey in stacks) {
-		var stackOption = stacks[stackKey];
-		var stackId = stackOption.id;
+	for(let stackKey in stacks) {
+		let stackOption = stacks[stackKey];
+		let stackId = stackOption.id;
 
-		var stackConfigObj = {
+		let stackConfigObj = {
 			id: stackId
 		};
-		var name = stackOption.name;
-		var collapsed = stackOption.collapsed;
-		var spreading = stackOption.spreading;
+		let name = stackOption.name;
+		let collapsed = stackOption.collapsed;
+		let spreading = stackOption.spreading;
 
-		if (name) {
+		if(name) {
 			stackConfigObj.name = name;
 		}
-		if (collapsed !== true) {
+		if(collapsed !== true) {
 			stackConfigObj.collapsed = collapsed;
 		}
-		if (spreading !== false) {
+		if(spreading !== false) {
 			stackConfigObj.spreading = spreading;
 		}
 
-		if (this._usingField) {
-			var colIndices = this.getStackMemberIndices(stackId);
-			var memberCount = colIndices.length;
-			var fields = new Array(memberCount);
-			for(var i = 0; i < memberCount; ++i) {
+		if(this._usingField) {
+			let colIndices = this.getStackMemberIndices(stackId);
+			let memberCount = colIndices.length;
+			let fields = new Array(memberCount);
+			for(let i = 0; i < memberCount; ++i) {
 				fields[i] = this.getColumnField(colIndices[i]);
 			}
 			stackConfigObj.fields = fields;
@@ -1205,11 +1205,11 @@ ColumnStackPlugin.prototype.unstackColumns = function(colIndices) {
 		colIndices = this._getSelectedColumns();
 	}
 
-	var dirty = false;
-	var len = colIndices.length;
-	for(var i = 0; i < len; ++i) {
-		var colIndex = colIndices[i];
-		var stackOpt = this._getColumnStackOptions(colIndex);
+	let dirty = false;
+	let len = colIndices.length;
+	for(let i = 0; i < len; ++i) {
+		let colIndex = colIndices[i];
+		let stackOpt = this._getColumnStackOptions(colIndex);
 		if(stackOpt) {
 			dirty = true;
 			this._removeStack(stackOpt.id);
@@ -1226,15 +1226,15 @@ ColumnStackPlugin.prototype.unstackColumns = function(colIndices) {
 * @return {boolean} Returns true if there is any change
 */
 ColumnStackPlugin.prototype._removeStack = function(stackId) {
-	var stack = this._groupDefs.getGroup(stackId);
+	let stack = this._groupDefs.getGroup(stackId);
 	if(!stack) {
 		return false;
 	}
 
-	var colIndices = this.getColumnIndices(stack.children);
-	var len = colIndices.length;
-	for(var i = 0; i < len; ++i) {
-		var colIndex = colIndices[i]; // colIndex is guaranteed to be positive (verified)
+	let colIndices = this.getColumnIndices(stack.children);
+	let len = colIndices.length;
+	for(let i = 0; i < len; ++i) {
+		let colIndex = colIndices[i]; // colIndex is guaranteed to be positive (verified)
 		if(stack.spreading && stack.collapsed) {
 			this._collapseMember(colIndex, false);
 		}
@@ -1260,10 +1260,10 @@ ColumnStackPlugin.prototype.removeStack = function(stackId) {
 * @return {boolean} true if at least one stacking removed
 */
 ColumnStackPlugin.prototype.removeAllStacks = function(enableUpdateUI) {
-	var groupIds = this._groupDefs.getGroupIds();
-	var groupCount = groupIds.length;
+	let groupIds = this._groupDefs.getGroupIds();
+	let groupCount = groupIds.length;
 	if(groupCount) {
-		for(var i = 0; i < groupCount; ++i) {
+		for(let i = 0; i < groupCount; ++i) {
 			this._removeStack(groupIds[i]);
 		}
 		this._groupDefs.removeAllGroups(); // TODO: May not necessary
@@ -1280,22 +1280,22 @@ ColumnStackPlugin.prototype.removeAllStacks = function(enableUpdateUI) {
 * @return {boolean}
 */
 ColumnStackPlugin.prototype.setActiveColumn = function(activeColumn) {
-	var colIndex = this.getColumnIndex(activeColumn);
+	let colIndex = this.getColumnIndex(activeColumn);
 	if(colIndex < 0) {
 		return false;
 	}
-	var colCount = this.getColumnCount();
+	let colCount = this.getColumnCount();
 	if(colIndex >= colCount) {
 		return false;
 	}
 
-	var colId = this.getColumnId(colIndex);
-	var stack = this._groupDefs.getParentGroup(colId);
+	let colId = this.getColumnId(colIndex);
+	let stack = this._groupDefs.getParentGroup(colId);
 	if(!stack) {
 		return false;
 	}
-	var chdr = stack.children;
-	var memberIndex = chdr.indexOf(colId);
+	let chdr = stack.children;
+	let memberIndex = chdr.indexOf(colId);
 	if(memberIndex < 0) {
 		return false;
 	}
@@ -1309,13 +1309,13 @@ ColumnStackPlugin.prototype.setActiveColumn = function(activeColumn) {
 * @see {@link ColumnStackPlugin#setActiveColumn}
 */
 ColumnStackPlugin.prototype.swapColumn = function(colRef, swappingIndex) {
-	var colIndex = (typeof colRef === "number") ? colRef : this.getColumnIndex(colRef);
+	let colIndex = (typeof colRef === "number") ? colRef : this.getColumnIndex(colRef);
 
-	var stackOpt = this._getColumnStackOptions(colIndex);
+	let stackOpt = this._getColumnStackOptions(colIndex);
 	if(!stackOpt) {
 		return false; // Invalid column index
 	}
-	var children = stackOpt.children;
+	let children = stackOpt.children;
 	if(!children) {
 		return false; // Invalid column type
 	}
@@ -1335,8 +1335,8 @@ ColumnStackPlugin.prototype._setActiveColumn = function(stack, newActiveColumn)
 		return false; // The given index is already active stacked column
 	}
 
-	var prevActiveColumnIndex = this.getColumnIndex(stack.activeColumn);
-	var newActiveColumnIndex = this.getColumnIndex(newActiveColumn);
+	let prevActiveColumnIndex = this.getColumnIndex(stack.activeColumn);
+	let newActiveColumnIndex = this.getColumnIndex(newActiveColumn);
 	stack.activeColumn = newActiveColumn; // Change active column
 
 	this._setColumnVisibility(newActiveColumnIndex, true);
@@ -1345,7 +1345,7 @@ ColumnStackPlugin.prototype._setActiveColumn = function(stack, newActiveColumn)
 	this._updateIcon(prevActiveColumnIndex, stack);
 	this._updateIcon(newActiveColumnIndex, stack);
 
-	var csp = this._getPlugin("ColumnSelectionPlugin");
+	let csp = this._getPlugin("ColumnSelectionPlugin");
 	if(csp && csp.isEnabled()) {
 		csp.selectSingleColumn(newActiveColumnIndex);
 		if(csp.dispatchSelectionChanged) {
@@ -1359,7 +1359,7 @@ ColumnStackPlugin.prototype._setActiveColumn = function(stack, newActiveColumn)
 * @param {Object} e
 */
 ColumnStackPlugin.prototype._onPreSectionRender = function (e) {
-	if (e["sectionType"] !== "title") {
+	if(e["sectionType"] !== "title") {
 		return;
 	}
 	this._forceUpdateUI();
@@ -1372,14 +1372,14 @@ ColumnStackPlugin.prototype._onColumnRemoved = function (e) {
 		return;
 	}
 
-	var colId = e.colId;
-	var stackOpt = this._groupDefs.getParentGroup(colId);
+	let colId = e.colId;
+	let stackOpt = this._groupDefs.getParentGroup(colId);
 
 	if(!stackOpt) {
 		return;
 	}
 	// update members
-	var children = stackOpt.children;
+	let children = stackOpt.children;
 	if(children.length <= 2) {
 		this._removeStack(stackOpt.id);
 		this._updateUI();
@@ -1399,18 +1399,18 @@ ColumnStackPlugin.prototype._onColumnMoved = function (e) {
 		return; // during the reordering or resetting, there is no need to recalculate stacks
 	}
 
-	var toIndex = e.toColIndex;
-	var colId = this.getColumnId(toIndex);
-	var stackOpt = this._groupDefs.getParentGroup(colId);
+	let toIndex = e.toColIndex;
+	let colId = this.getColumnId(toIndex);
+	let stackOpt = this._groupDefs.getParentGroup(colId);
 	if(!stackOpt) {
 		return;
 	}
 
-	var leftStackOpt = this._getColumnStackOptions(toIndex - 1);
-	var rightStackOpt = this._getColumnStackOptions(toIndex + 1);
+	let leftStackOpt = this._getColumnStackOptions(toIndex - 1);
+	let rightStackOpt = this._getColumnStackOptions(toIndex + 1);
 
-	var stackChange = true;
-	var dirty = false;
+	let stackChange = true;
+	let dirty = false;
 	if(stackOpt) {
 		// The move was within the same stack
 		if(stackOpt === leftStackOpt || stackOpt === rightStackOpt) {
@@ -1446,8 +1446,8 @@ ColumnStackPlugin.prototype._onColumnAdded = function (e) {
 		return;
 	}
 
-	var colIndex = e.colIndex;
-	var stackOpt = this._isWithinStack(colIndex);
+	let colIndex = e.colIndex;
+	let stackOpt = this._isWithinStack(colIndex);
 	if(stackOpt) {
 		if(this._addRefToStack(stackOpt, colIndex)) {
 			this._updateUI();
@@ -1468,7 +1468,7 @@ ColumnStackPlugin.prototype._onBeforeBatchOperation = function (e) {
 * @param {Object} e
 */
 ColumnStackPlugin.prototype._onAfterBatchOperation = function (e) {
-	var groups, groupCount, i, group;
+	let groups, groupCount, i, group;
 	if(e.batchType === "reset") {
 		this._inResetting = false;
 
@@ -1500,9 +1500,9 @@ ColumnStackPlugin.prototype._onAfterBatchOperation = function (e) {
 * @return {Object} stackOption
 */
 ColumnStackPlugin.prototype._isWithinStack = function (colIndex) {
-	var leftStackOpt = this._getColumnStackOptions(colIndex - 1);
+	let leftStackOpt = this._getColumnStackOptions(colIndex - 1);
 	if(leftStackOpt) {
-		var rightStackOpt = this._getColumnStackOptions(colIndex + 1);
+		let rightStackOpt = this._getColumnStackOptions(colIndex + 1);
 		if(leftStackOpt === rightStackOpt) {
 			return leftStackOpt;
 		}
@@ -1516,14 +1516,14 @@ ColumnStackPlugin.prototype._isWithinStack = function (colIndex) {
 * @return {boolean}
 */
 ColumnStackPlugin.prototype._addRefToStack = function (stackOption, colIndex) {
-	var colId = this._toColumnId(colIndex);
+	let colId = this._toColumnId(colIndex);
 
 	this._hideStackedColumns(stackOption, colIndex);
 
 	// Find a position to be placed in the stack
-	var rightColRef = this._toColumnId(colIndex + 1);
-	var children = stackOption.children;
-	var pos = children.indexOf(rightColRef); // WARNING This does not work for field
+	let rightColRef = this._toColumnId(colIndex + 1);
+	let children = stackOption.children;
+	let pos = children.indexOf(rightColRef); // WARNING This does not work for field
 	return this._groupDefs.addGroupChild(stackOption.id, colId, pos);
 };
 /** Remove unique ref of the specified index from the stack
@@ -1538,7 +1538,7 @@ ColumnStackPlugin.prototype._removeRefFromStack = function (stackOption, colId,
 		return false;
 	}
 
-	var isCollapsed = stackOption.spreading && stackOption.collapsed;
+	let isCollapsed = stackOption.spreading && stackOption.collapsed;
 	if(isCollapsed) {
 		this._collapseMember(colIndex, false);
 	} else {
@@ -1554,16 +1554,16 @@ ColumnStackPlugin.prototype._removeRefFromStack = function (stackOption, colId,
 * @param {boolean=} validate Remove invalid members and stack
 */
 ColumnStackPlugin.prototype._repositionMembers = function (stackOption, validate) {
-	var children = stackOption.children;
-	var refCount = children ? children.length : 0;
-
-	var indexMap = {};
-	var prevIndex = -1;
-	var dirty = false;
-	var hasInvalid = false;
-	for(var i = 0; i < refCount; i++) {
-		var colRef = children[i];
-		var colIndex = this.getColumnIndex(colRef);
+	let children = stackOption.children;
+	let refCount = children ? children.length : 0;
+
+	let indexMap = {};
+	let prevIndex = -1;
+	let dirty = false;
+	let hasInvalid = false;
+	for(let i = 0; i < refCount; i++) {
+		let colRef = children[i];
+		let colIndex = this.getColumnIndex(colRef);
 		indexMap[colRef] = colIndex;
 		if(colIndex >= 0) {
 			if(colIndex < prevIndex) {
@@ -1601,32 +1601,32 @@ ColumnStackPlugin.prototype._repositionMembers = function (stackOption, validate
 * @param {Object} e
 */
 ColumnStackPlugin.prototype._onStackButtonClicked = function(e) {
-	var elem = e.currentTarget;
+	let elem = e.currentTarget;
 	if(e.button) { // right click or middle click
 		return;
 	}
 
-	var grid = this.getRelativeGrid(e);
-	var pos = grid.getRelativePosition(e);
-	var colIndex = pos["colIndex"];
-	var colData = this._getColumnStackOptions(colIndex);
+	let grid = this.getRelativeGrid(e);
+	let pos = grid.getRelativePosition(e);
+	let colIndex = pos["colIndex"];
+	let colData = this._getColumnStackOptions(colIndex);
 	if(!colData) { return; }
 
 	e.stopPropagation();
 
-	var children = colData.children;
-	var colIndices = this.getColumnIndices(children);
+	let children = colData.children;
+	let colIndices = this.getColumnIndices(children);
 	if(colData.spreading) {
-		var collapsed = !colData.collapsed;
+		let collapsed = !colData.collapsed;
 		this.collapseGroup(colIndex, collapsed);
 		pos["menuData"] = null;
 		pos["activeIndex"] = -1;
 		pos["collapsed"] = collapsed;
 	} else {
-		var activeIndex = children.indexOf(colData.activeColumn);
-		var len = children.length;
-		var menuData = new Array(len);
-		for(var i = len; --i >= 0;) {
+		let activeIndex = children.indexOf(colData.activeColumn);
+		let len = children.length;
+		let menuData = new Array(len);
+		for(let i = len; --i >= 0;) {
 			menuData[i] = {
 				value: i,
 				selected: i === activeIndex,
@@ -1649,8 +1649,8 @@ ColumnStackPlugin.prototype._onStackButtonClicked = function(e) {
 
 	if(this._menuElement && !colData.spreading) {
 		// Populate stack member
-		var button = pos.event.srcElement;
-		var el = this._menuElement;
+		let button = pos.event.srcElement;
+		let el = this._menuElement;
 		el.data = pos["menuData"];
 		el.positionTarget = button;
 		el.opened = true;
@@ -1662,9 +1662,9 @@ ColumnStackPlugin.prototype._onStackButtonClicked = function(e) {
 */
 ColumnStackPlugin.prototype._onMenuItemClicked = function(e) {
 	if(e.detail) {
-		var selectedIndex = parseInt(e.detail.value, 0);
-		var menuData = this._menuElement.data[selectedIndex];
-		var colId = menuData.colId;
+		let selectedIndex = parseInt(e.detail.value, 0);
+		let menuData = this._menuElement.data[selectedIndex];
+		let colId = menuData.colId;
 		this.setActiveColumn(colId);
 	}
 	this._menuElement.opened = false;
@@ -1689,7 +1689,7 @@ ColumnStackPlugin.prototype.getStackMemberIndices = function(stackId) {
 */
 ColumnStackPlugin.prototype.getStackMemberIds = function(stackId) { // WARNING: This does not filter out invalid members
 	if(stackId) {
-		var stack = this._groupDefs.getGroup(stackId);
+		let stack = this._groupDefs.getGroup(stackId);
 		if(stack){
 			return stack.children;
 		}
@@ -1706,9 +1706,9 @@ ColumnStackPlugin.prototype.getColumnIdsByIndex = function(colIndices) {
 	if(!Array.isArray(colIndices)){
 		colIndices = [colIndices];
 	}
-	var colIds = [];
-	var colId;
-	for(var i = 0; i < colIndices.length; ++i) {
+	let colIds = [];
+	let colId;
+	for(let i = 0; i < colIndices.length; ++i) {
 		colId = this.getColumnId(colIndices[i]);
 		colIds.push(colId);
 	}
@@ -1724,9 +1724,9 @@ ColumnStackPlugin.prototype.getColumnIndicesByColumnIds = function(colIds) {
 	if(!Array.isArray(colIds)){
 		colIds = [colIds];
 	}
-	var colIndices = [];
-	var colIndex;
-	for(var i = 0; i < colIds.length; ++i) {
+	let colIndices = [];
+	let colIndex;
+	for(let i = 0; i < colIds.length; ++i) {
 		colIndex = this.getColumnIndex(colIds[i]);
 		colIndices.push(colIndex);
 	}
@@ -1742,12 +1742,12 @@ ColumnStackPlugin.prototype.getColumnIdsByFields = function(fields) {
 	if(!fields) {
 		return [];
 	}
-	var ary = Array.isArray(fields) ? fields : [fields];
-	var count = fields.length;
-	var outAry = new Array(count);
-	for(var i = 0; i < count; ++i) {
-		var ref = ary[i];
-		var colIndex = -1;
+	let ary = Array.isArray(fields) ? fields : [fields];
+	let count = fields.length;
+	let outAry = new Array(count);
+	for(let i = 0; i < count; ++i) {
+		let ref = ary[i];
+		let colIndex = -1;
 		if(typeof ref === "number") {
 			colIndex = ref;
 		} else if(ref) {
@@ -1766,10 +1766,10 @@ ColumnStackPlugin.prototype.getColumnIdsByFields = function(fields) {
 * @param {string} stackId
 */
 ColumnStackPlugin.prototype.addColumnToStack = function(colRef, stackId) {
-	var colId = this._toColumnId(colRef);
+	let colId = this._toColumnId(colRef);
 
-	var stack = this._groupDefs.getGroup(stackId);
-	var isColumnStackable = !this._groupDefs.getParentGroup(colId);
+	let stack = this._groupDefs.getGroup(stackId);
+	let isColumnStackable = !this._groupDefs.getParentGroup(colId);
 
 	// if column not stackable or destination stack not exist, do nothing
 	if(!isColumnStackable || !stack){
@@ -1782,17 +1782,17 @@ ColumnStackPlugin.prototype.addColumnToStack = function(colRef, stackId) {
 	this._groupDefs.addGroupChild(stackId, colId);
 
 	// To avoid state interference from Core Grid, keep the pin state before moving the columns
-	var host = this._hosts[0];
-	var leftPinnedIndex = host.getFrozenColumnCount() - 1;
-	var rightPinnedCount = host.getPinnedRightColumnCount();
-	var colIndex = this.getColumnIndex(colId);
+	let host = this._hosts[0];
+	let leftPinnedIndex = host.getFrozenColumnCount() - 1;
+	let rightPinnedCount = host.getPinnedRightColumnCount();
+	let colIndex = this.getColumnIndex(colId);
 
 	// Pack stacked columns together
 	this._moveStackedColumns(stack.children);
 
 	// If an unpinned column is added to a pinned stack, the pinning position should be updated
 	if(stack.leftPinned || stack.rightPinned) {
-		var colCount = this.getColumnCount();
+		let colCount = this.getColumnCount();
 		if(stack.leftPinned && colIndex > leftPinnedIndex) {
 			leftPinnedIndex++;
 			this._freezeColumn(leftPinnedIndex, rightPinnedCount);
@@ -1810,20 +1810,20 @@ ColumnStackPlugin.prototype.addColumnToStack = function(colRef, stackId) {
 * @param {number|string} colRef column field or column index
 */
 ColumnStackPlugin.prototype.removeColumnFromStack = function(colRef) {
-	var colIndex = (typeof colRef === "string") ? this.getColumnIndex(colRef) : colRef;
+	let colIndex = (typeof colRef === "string") ? this.getColumnIndex(colRef) : colRef;
 	if(colIndex < 0) {
 		return;
 	}
 
-	var colId = this.getColumnId(colIndex);
-	var stack = this._groupDefs.getParentGroup(colId);
+	let colId = this.getColumnId(colIndex);
+	let stack = this._groupDefs.getParentGroup(colId);
 
 	if(!stack) {
 		return;
 	}
 
-	var children = stack.children;
-	var memberCount = children.length;
+	let children = stack.children;
+	let memberCount = children.length;
 	if(memberCount <= 2) {
 		if(memberCount === 2) {
 			if(colId === children[0]) { // If the first column is removed from the stack, move it to the end of stack
@@ -1835,7 +1835,7 @@ ColumnStackPlugin.prototype.removeColumnFromStack = function(colRef) {
 		return;
 	}
 
-	var colIndices = this.getColumnIndices(children);
+	let colIndices = this.getColumnIndices(children);
 	this._removeRefFromStack(stack, colId, colIndex);
 
 	this.moveColumnById(colIndex, colIndices[memberCount - 1] + 1); // This assumes that the column order is already in correct position
@@ -1849,23 +1849,23 @@ ColumnStackPlugin.prototype.removeColumnFromStack = function(colRef) {
 * @param {string} stackId
 */
 ColumnStackPlugin.prototype.reorderStackColumns = function(colRefs, stackId) {
-	var stack = this._groupDefs.getGroup(stackId);
+	let stack = this._groupDefs.getGroup(stackId);
 	if(!stack) {
 		return;
 	}
 	if(!colRefs || !colRefs.length) {
 		return; // Nothing to be reordered
 	}
-	var colIndices = this.getColumnIndices(colRefs); // Slow
+	let colIndices = this.getColumnIndices(colRefs); // Slow
 	if(!colIndices.length) {
 		return; // Given input has no valid column
 	}
 
-	var curMemberIndices = this.getStackMemberIndices(stackId); // Slow
-	var memberCount =  curMemberIndices.length;
-	var indexMap = {};
-	for(var i = 0; i < memberCount; ++i) {
-		var colIndex = curMemberIndices[i];
+	let curMemberIndices = this.getStackMemberIndices(stackId); // Slow
+	let memberCount =  curMemberIndices.length;
+	let indexMap = {};
+	for(let i = 0; i < memberCount; ++i) {
+		let colIndex = curMemberIndices[i];
 		indexMap[colIndex] = colIndices.indexOf(colIndex);
 	}
 
@@ -1897,7 +1897,7 @@ ColumnStackPlugin.prototype.getStackName = function(stackId) {
 * @return {string} active column id
 */
 ColumnStackPlugin.prototype.getActiveColumnId = function(stackId) {
-	var stack = this._groupDefs.getGroup(stackId);
+	let stack = this._groupDefs.getGroup(stackId);
 	if(stack){
 		return stack.activeColumn || "";
 	}
@@ -1918,7 +1918,7 @@ ColumnStackPlugin.prototype.getActiveColumnField = function(stackId) {
 * @return {number} active column index
 */
 ColumnStackPlugin.prototype.getActiveColumnIndex = function(stackId) {
-	var stack = this._groupDefs.getGroup(stackId);
+	let stack = this._groupDefs.getGroup(stackId);
 	if(stack){
 		return this.getColumnIndex(stack.activeColumn);
 	}
@@ -1974,7 +1974,7 @@ ColumnStackPlugin.prototype.moveColumnById = function(srcCol, destCol) {
 ColumnStackPlugin.prototype._updateActiveColumn = function(stackOpt) {
 	if(_resolveActiveColumn(stackOpt)) {
 		// TODO: Add a proper way to set visibility to activeColumn when activeColumn is changed
-		var activeColIndex = this.getColumnIndex(stackOpt.activeColumn);
+		let activeColIndex = this.getColumnIndex(stackOpt.activeColumn);
 		if(activeColIndex >= 0) {
 			this._setColumnVisibility(activeColIndex, true);
 			this._updateUI();
@@ -1991,7 +1991,7 @@ ColumnStackPlugin.prototype.hideStack = function(stackId, hidden) {
 	if(!stackId){
 		return;
 	}
-	var stackOption = this._groupDefs.getGroup(stackId);
+	let stackOption = this._groupDefs.getGroup(stackId);
 	if(!stackOption){
 		return;
 	}
@@ -1999,9 +1999,9 @@ ColumnStackPlugin.prototype.hideStack = function(stackId, hidden) {
 	if(hidden == null){
 		hidden = true;
 	}
-	var children = stackOption.children;
-	for(var i = 0; i < children.length; i++){
-		for(var g = this._hosts.length; --g >= 0;) {
+	let children = stackOption.children;
+	for(let i = 0; i < children.length; i++){
+		for(let g = this._hosts.length; --g >= 0;) {
 			this._hosts[g].hideColumn(this.getColumnIndex(children[i]), hidden);
 		}
 	}
@@ -2024,15 +2024,15 @@ ColumnStackPlugin.prototype.showStack = function(stackId) {
 * @return {boolean|null}
 */
 ColumnStackPlugin.prototype.isStackHidden = function(stackId) {
-	var stackOption = this._groupDefs.getGroup(stackId);
-	var host = this._host || this._hosts[0];
+	let stackOption = this._groupDefs.getGroup(stackId);
+	let host = this._host || this._hosts[0];
 
 	if(!stackOption || !host){
 		return null;
 	}
 
-	var activeColIndex = this.getColumnIndex(stackOption.activeColumn);
-	var isVisible = host.isColumnVisible(activeColIndex);
+	let activeColIndex = this.getColumnIndex(stackOption.activeColumn);
+	let isVisible = host.isColumnVisible(activeColIndex);
 
 	return !isVisible;
 };
@@ -2046,8 +2046,8 @@ ColumnStackPlugin.prototype.moveStack = function(stackId, destCol) {
 	if(!stackId){
 		return false;
 	}
-	var colList = this.getStackMemberIds(stackId);
-	var dirty = this.reorderColumns(colList, destCol);
+	let colList = this.getStackMemberIds(stackId);
+	let dirty = this.reorderColumns(colList, destCol);
 	return dirty;
 };
 
@@ -2060,19 +2060,19 @@ ColumnStackPlugin.prototype.pinStack = function(stackId, side) {
 		return;
 	}
 
-	var stack = this._groupDefs.getGroup(stackId);
+	let stack = this._groupDefs.getGroup(stackId);
 	if(!stack) {
 		return;
 	}
 
-	var host = this._hosts[0];
-	var leftPinnedIndex = host.getFrozenColumnCount() - 1;
-	var rightPinnedCount = host.getPinnedRightColumnCount();
-	var colCount = this.getColumnCount();
-	var colList = this.getStackMemberIds(stackId);
-	var len = colList.length;
+	let host = this._hosts[0];
+	let leftPinnedIndex = host.getFrozenColumnCount() - 1;
+	let rightPinnedCount = host.getPinnedRightColumnCount();
+	let colCount = this.getColumnCount();
+	let colList = this.getStackMemberIds(stackId);
+	let len = colList.length;
 
-	var dest;
+	let dest;
 	if(side === "right") {
 		if(stack.rightPinned) {
 			return;
@@ -2110,7 +2110,7 @@ ColumnStackPlugin.prototype.unpinStack = function(stackId, dest) {
 		return;
 	}
 
-	var stack = this._groupDefs.getGroup(stackId);
+	let stack = this._groupDefs.getGroup(stackId);
 	if(!stack) {
 		return;
 	}
@@ -2119,17 +2119,17 @@ ColumnStackPlugin.prototype.unpinStack = function(stackId, dest) {
 		return;
 	}
 
-	var host = this._hosts[0];
-	var leftPinnedCount = host.getFrozenColumnCount();
-	var rightPinnedCount = host.getPinnedRightColumnCount();
-	var colCount = this.getColumnCount();
-	var firstRightPinnedIndex = colCount - rightPinnedCount;
-	var colList = this.getStackMemberIds(stackId);
-	var len = colList.length;
+	let host = this._hosts[0];
+	let leftPinnedCount = host.getFrozenColumnCount();
+	let rightPinnedCount = host.getPinnedRightColumnCount();
+	let colCount = this.getColumnCount();
+	let firstRightPinnedIndex = colCount - rightPinnedCount;
+	let colList = this.getStackMemberIds(stackId);
+	let len = colList.length;
 
-	var destId = null;
+	let destId = null;
 	if(dest != null) {
-		var destIdx = this.getColumnIndex(dest);
+		let destIdx = this.getColumnIndex(dest);
 		destId = this.getColumnId(destIdx);
 	}