tabulator-tables 5.3.0 → 5.3.3

package/dist/js/tabulator_esm.js

@@ -1,4 +1,4 @@
-/* Tabulator v5.3.0 (c) Oliver Folkerd 2022 */
+/* Tabulator v5.3.3 (c) Oliver Folkerd 2022 */
 class CoreFeature{
 
 	constructor(table){
@@ -469,90 +469,121 @@ class Popup extends CoreFeature{
 }
 
 class Module extends CoreFeature{
-
+	
 	constructor(table, name){
 		super(table);
-
+		
 		this._handler = null;
 	}
-
+	
 	initialize(){
 		// setup module when table is initialized, to be overridden in module
 	}
-
-
+	
+	
 	///////////////////////////////////
 	////// Options Registration ///////
 	///////////////////////////////////
-
+	
 	registerTableOption(key, value){
 		this.table.optionsList.register(key, value);
 	}
-
+	
 	registerColumnOption(key, value){
 		this.table.columnManager.optionsList.register(key, value);
 	}
-
+	
 	///////////////////////////////////
 	/// Public Function Registration ///
 	///////////////////////////////////
-
+	
 	registerTableFunction(name, func){
 		if(typeof this.table[name] === "undefined"){
 			this.table[name] = (...args) => {
 				this.table.initGuard(name);
-
+				
 				return func(...args);
 			};
 		}else {
 			console.warn("Unable to bind table function, name already in use", name);
 		}
 	}
-
+	
 	registerComponentFunction(component, func, handler){
 		return this.table.componentFunctionBinder.bind(component, func, handler);
 	}
-
+	
 	///////////////////////////////////
 	////////// Data Pipeline //////////
 	///////////////////////////////////
-
+	
 	registerDataHandler(handler, priority){
 		this.table.rowManager.registerDataPipelineHandler(handler, priority);
 		this._handler = handler;
 	}
-
+	
 	registerDisplayHandler(handler, priority){
 		this.table.rowManager.registerDisplayPipelineHandler(handler, priority);
 		this._handler = handler;
 	}
+	
+	displayRows(adjust){
+		var index = this.table.rowManager.displayRows.length - 1, 
+		lookupIndex;
+		
+		if(this._handler){
+			lookupIndex = this.table.rowManager.displayPipeline.findIndex((item) => {
+				return item.handler === this._handler;
+			});
 
+			if(lookupIndex > -1){
+				index = lookupIndex;
+			}
+		}
+		
+		if(adjust){
+			index = index + adjust;
+		}
+
+		if(this._handler){
+			if(index > -1){
+				return this.table.rowManager.getDisplayRows(index);
+			}else {
+				return this.activeRows();
+			}
+		}	
+	}
+	
+	activeRows(){
+		return this.table.rowManager.activeRows;
+	}
+	
 	refreshData(renderInPosition, handler){
 		if(!handler){
 			handler = this._handler;
 		}
-
+		
 		if(handler){
 			this.table.rowManager.refreshActiveData(handler, false, renderInPosition);
 		}
 	}
-
+	
 	///////////////////////////////////
 	//////// Footer Management ////////
 	///////////////////////////////////
-
+	
 	footerAppend(element){
 		return this.table.footerManager.append(element);
 	}
-
+	
 	footerPrepend(element){
 		return this.table.footerManager.prepend(element);
 	}
-
+	
 	footerRemove(element){
 		return this.table.footerManager.remove(element);
 	} 
-
+	
 	///////////////////////////////////
 	//////// Popups Management ////////
 	///////////////////////////////////
@@ -560,15 +591,15 @@ class Module extends CoreFeature{
 	popup(menuEl, menuContainer){
 		return new Popup(this.table, menuEl, menuContainer);
 	}
-
+	
 	///////////////////////////////////
 	//////// Alert Management ////////
 	///////////////////////////////////
-
+	
 	alert(content, type){
 		return this.table.alertManager.alert(content, type);
 	}
-
+	
 	clearAlert(){
 		return this.table.alertManager.clear();
 	}
@@ -2433,8 +2464,20 @@ class Column extends CoreFeature{
 	}
 
 	//return all columns in a group
-	getColumns(){
-		return this.columns;
+	getColumns(traverse){
+		var columns = [];
+
+		if(traverse){
+			this.columns.forEach((column) => {
+				columns.push(column);
+					
+				columns = columns.concat(column.getColumns(true));
+			});
+		}else {
+			columns = this.columns;
+		}
+		
+		return columns;
 	}
 
 	//return all columns in a group
@@ -2662,6 +2705,12 @@ class Column extends CoreFeature{
 	}
 
 	setMinWidth(minWidth){
+		if(this.maxWidth && minWidth > this.maxWidth){
+			minWidth = this.maxWidth;
+
+			console.warn("the minWidth ("+ minWidth + "px) for column '" + this.field + "' cannot be bigger that its maxWidth ("+ this.maxWidthStyled + ")");
+		}
+
 		this.minWidth = minWidth;
 		this.minWidthStyled = minWidth ? minWidth + "px" : "";
 
@@ -2673,6 +2722,12 @@ class Column extends CoreFeature{
 	}
 
 	setMaxWidth(maxWidth){
+		if(this.minWidth && maxWidth < this.minWidth){
+			maxWidth = this.minWidth;
+
+			console.warn("the maxWidth ("+ maxWidth + "px) for column '" + this.field + "' cannot be smaller that its minWidth ("+ this.minWidthStyled + ")");
+		}
+
 		this.maxWidth = maxWidth;
 		this.maxWidthStyled = maxWidth ? maxWidth + "px" : "";
 
@@ -3581,7 +3636,7 @@ class ColumnCalcs extends Module{
 
 	rowsUpdated(row){
 		if(this.table.options.groupBy){
-			this.recalcRowGroup(this);
+			this.recalcRowGroup(row);
 		}else {
 			this.recalcActiveRows();
 		}
@@ -4019,8 +4074,6 @@ class DataTree extends Module{
 
 		this.startOpen = function(){};
 
-		this.displayIndex = 0;
-
 		this.registerTableOption("dataTree", false); //enable data tree
 		this.registerTableOption("dataTreeFilter", true); //filter child rows
 		this.registerTableOption("dataTreeSort", true); //sort child rows
@@ -4052,6 +4105,10 @@ class DataTree extends Module{
 			this.field = options.dataTreeChildField;
 			this.indent = options.dataTreeChildIndent;
 
+			if(this.options("movableRows")){
+				console.warn("The movableRows option is not available with dataTree enabled, moving of child rows could result in unpredictable behavior");
+			}
+
 			if(options.dataTreeBranchElement){
 
 				if(options.dataTreeBranchElement === true){
@@ -4292,14 +4349,6 @@ class DataTree extends Module{
 		}
 	}
 
-	setDisplayIndex (index) {
-		this.displayIndex = index;
-	}
-
-	getDisplayIndex () {
-		return this.displayIndex;
-	}
-
 	getRows(rows){
 		var output = [];
 
@@ -4437,7 +4486,7 @@ class DataTree extends Module{
 	}
 
 	getTreeParentRoot(row){
-		return row.modules.dataTree.parent ? this.getTreeParentRoot(row.modules.dataTree.parent) : row;
+		return row.modules.dataTree && row.modules.dataTree.parent ? this.getTreeParentRoot(row.modules.dataTree.parent) : row;
 	}
 
 	getFilteredTreeChildren(row){
@@ -6765,7 +6814,7 @@ class Edit{
 			if(!startVis){
 				setTimeout(() => {
 					this.popup.hideOnBlur(this._resolveValue.bind(this, true));
-				});
+				}, 10);
 			}
 		}
 	}
@@ -9139,6 +9188,9 @@ class Filter extends Module{
 					getColumn:function(){
 						return column.getComponent();
 					},
+					getTable:() => {
+						return this.table;
+					},
 					getRow:function(){
 						return {
 							normalizeHeight:function(){
@@ -11032,7 +11084,7 @@ class GroupComponent {
 	}
 
 	isVisible(){
-		return this._group.visible;
+		return this._group._visible;
 	}
 
 	show(){
@@ -11413,7 +11465,7 @@ class Group{
 	hide(){
 		this.visible = false;
 		
-		if(this.groupManager.table.rowManager.getRenderMode() == "classic" && !this.groupManager.table.options.pagination){
+		if(this.groupManager.table.rowManager.getRenderMode() == "basic" && !this.groupManager.table.options.pagination){
 			
 			this.element.classList.remove("tabulator-group-visible");
 			
@@ -11434,9 +11486,7 @@ class Group{
 				});
 			}
 			
-			this.groupManager.table.rowManager.setDisplayRows(this.groupManager.updateGroupRows(), this.groupManager.getDisplayIndex());
-			
-			this.groupManager.table.rowManager.checkClassicModeGroupHeaderWidth();
+			this.groupManager.updateGroupRows(true);
 			
 		}else {
 			this.groupManager.updateGroupRows(true);
@@ -11448,7 +11498,7 @@ class Group{
 	show(){
 		this.visible = true;
 		
-		if(this.groupManager.table.rowManager.getRenderMode() == "classic" && !this.groupManager.table.options.pagination){
+		if(this.groupManager.table.rowManager.getRenderMode() == "basic" && !this.groupManager.table.options.pagination){
 			
 			this.element.classList.add("tabulator-group-visible");
 			
@@ -11474,10 +11524,8 @@ class Group{
 					prev = rowEl;
 				});
 			}
-			
-			this.groupManager.table.rowManager.setDisplayRows(this.groupManager.updateGroupRows(), this.groupManager.getDisplayIndex());
-			
-			this.groupManager.table.rowManager.checkClassicModeGroupHeaderWidth();
+
+			this.groupManager.updateGroupRows(true);
 		}else {
 			this.groupManager.updateGroupRows(true);
 		}
@@ -11659,20 +11707,19 @@ class Group{
 }
 
 class GroupRows extends Module{
-
+	
 	constructor(table){
 		super(table);
-
+		
 		this.groupIDLookups = false; //enable table grouping and set field to group by
 		this.startOpen = [function(){return false;}]; //starting state of group
 		this.headerGenerator = [function(){return "";}];
 		this.groupList = []; //ordered list of groups
 		this.allowedValues = false;
 		this.groups = {}; //hold row groups
-		this.displayIndex = 0; //index in display pipeline
-
+		
 		this.displayHandler = this.getRows.bind(this);
-
+		
 		//register table options
 		this.registerTableOption("groupBy", false); //enable table grouping and set field to group by
 		this.registerTableOption("groupStartOpen", true); //starting state of group
@@ -11685,7 +11732,7 @@ class GroupRows extends Module{
 		this.registerTableOption("groupHeaderDownload", null);
 		this.registerTableOption("groupToggleElement", "arrow");
 		this.registerTableOption("groupClosedShowCalcs", false);
-
+		
 		//register table functions
 		this.registerTableFunction("setGroupBy", this.setGroupBy.bind(this));
 		this.registerTableFunction("setGroupValues", this.setGroupValues.bind(this));
@@ -11693,11 +11740,11 @@ class GroupRows extends Module{
 		this.registerTableFunction("setGroupHeader", this.setGroupHeader.bind(this));
 		this.registerTableFunction("getGroups", this.userGetGroups.bind(this));
 		this.registerTableFunction("getGroupedData", this.userGetGroupedData.bind(this));
-
+		
 		//register component functions
 		this.registerComponentFunction("row", "getGroup", this.rowGetGroup.bind(this));
 	}
-
+	
 	//initialize group configuration
 	initialize(){
 		if(this.table.options.groupBy){
@@ -11705,7 +11752,7 @@ class GroupRows extends Module{
 				this.subscribe("cell-value-updated", this.cellUpdated.bind(this));
 				this.subscribe("row-data-changed", this.reassignRowToGroup.bind(this), 0);
 			}
-
+			
 			this.subscribe("table-built", this.configureGroupSetup.bind(this));
 			
 			this.subscribe("row-deleting", this.rowDeleting.bind(this));
@@ -11715,73 +11762,73 @@ class GroupRows extends Module{
 			this.subscribe("rows-added", this.rowsUpdated.bind(this));
 			this.subscribe("row-moving", this.rowMoving.bind(this));
 			this.subscribe("row-adding-index", this.rowAddingIndex.bind(this));
-
+			
 			this.subscribe("rows-sample", this.rowSample.bind(this));
-
+			
 			this.subscribe("render-virtual-fill", this.virtualRenderFill.bind(this));
-
+			
 			this.registerDisplayHandler(this.displayHandler, 20);
-
+			
 			this.initialized = true;
 		}
 	}
-
+	
 	configureGroupSetup(){
 		if(this.table.options.groupBy){
 			var groupBy = this.table.options.groupBy,
 			startOpen = this.table.options.groupStartOpen,
 			groupHeader = this.table.options.groupHeader;
-
+			
 			this.allowedValues = this.table.options.groupValues;
-
+			
 			if(Array.isArray(groupBy) && Array.isArray(groupHeader) && groupBy.length > groupHeader.length){
 				console.warn("Error creating group headers, groupHeader array is shorter than groupBy array");
 			}
-
+			
 			this.headerGenerator = [function(){return "";}];
 			this.startOpen = [function(){return false;}]; //starting state of group
-
+			
 			this.langBind("groups|item", (langValue, lang) => {
 				this.headerGenerator[0] = (value, count, data) => { //header layout function
 					return (typeof value === "undefined" ? "" : value) + "<span>(" + count + " " + ((count === 1) ? langValue : lang.groups.items) + ")</span>";
 				};
 			});
-
+			
 			this.groupIDLookups = [];
-
+			
 			if(Array.isArray(groupBy)){
 				if(this.table.modExists("columnCalcs") && this.table.options.columnCalcs != "table" && this.table.options.columnCalcs != "both"){
 					this.table.modules.columnCalcs.removeCalcs();
 				}
 			}else {
 				if(this.table.modExists("columnCalcs") && this.table.options.columnCalcs != "group"){
-
+					
 					var cols = this.table.columnManager.getRealColumns();
-
+					
 					cols.forEach((col) => {
 						if(col.definition.topCalc){
 							this.table.modules.columnCalcs.initializeTopRow();
 						}
-
+						
 						if(col.definition.bottomCalc){
 							this.table.modules.columnCalcs.initializeBottomRow();
 						}
 					});
 				}
 			}
-
+			
 			if(!Array.isArray(groupBy)){
 				groupBy = [groupBy];
 			}
-
+			
 			groupBy.forEach((group, i) => {
 				var lookupFunc, column;
-
+				
 				if(typeof group == "function"){
 					lookupFunc = group;
 				}else {
 					column = this.table.columnManager.getColumnByField(group);
-
+					
 					if(column){
 						lookupFunc = function(data){
 							return column.getFieldValue(data);
@@ -11792,25 +11839,25 @@ class GroupRows extends Module{
 						};
 					}
 				}
-
+				
 				this.groupIDLookups.push({
 					field: typeof group === "function" ? false : group,
 					func:lookupFunc,
 					values:this.allowedValues ? this.allowedValues[i] : false,
 				});
 			});
-
+			
 			if(startOpen){
 				if(!Array.isArray(startOpen)){
 					startOpen = [startOpen];
 				}
-
+				
 				startOpen.forEach((level) => {
 				});
-
+				
 				this.startOpen = startOpen;
 			}
-
+			
 			if(groupHeader){
 				this.headerGenerator = Array.isArray(groupHeader) ? groupHeader : [groupHeader];
 			}
@@ -11819,218 +11866,216 @@ class GroupRows extends Module{
 			this.groups = {};
 		}
 	}
-
+	
 	rowSample(rows, prevValue){
-		var group = this.getGroups(false)[0];
-
-		prevValue.push(group.getRows(false)[0]);
-
+		if(this.table.options.groupBy){
+			var group = this.getGroups(false)[0];
+			
+			prevValue.push(group.getRows(false)[0]);
+		}
+		
 		return prevValue;
 	}
-
+	
 	virtualRenderFill(){
 		var el = this.table.rowManager.tableElement;
 		var rows = this.table.rowManager.getVisibleRows();
-
-		rows = rows.filter((row) => {
-			return row.type !== "group";
-		});
-
-		el.style.minWidth = !rows.length ? this.table.columnManager.getWidth() + "px" : "";
-
-		// if(this.table.options.groupBy){
-		// 	if(this.layoutMode() != "fitDataFill" && rowsCount == this.table.modules.groupRows.countGroups()){
-		// 		el.style.minWidth = this.table.columnManager.getWidth() + "px";
-		// 	}
-		// }
+		
+		if(this.table.options.groupBy){
+			rows = rows.filter((row) => {
+				return row.type !== "group";
+			});
+			
+			el.style.minWidth = !rows.length ? this.table.columnManager.getWidth() + "px" : "";
+		}else {
+			return rows;
+		}
 	}
-
+	
 	rowAddingIndex(row, index, top){
-		this.assignRowToGroup(row);
-
-		var groupRows = row.modules.group.rows;
-
-		if(groupRows.length > 1){
-			if(!index || (index && groupRows.indexOf(index) == -1)){
-				if(top){
-					if(groupRows[0] !== row){
-						index = groupRows[0];
-						this.table.rowManager.moveRowInArray(row.modules.group.rows, row, index, !top);
+		if(this.table.options.groupBy){
+			this.assignRowToGroup(row);
+			
+			var groupRows = row.modules.group.rows;
+			
+			if(groupRows.length > 1){
+				if(!index || (index && groupRows.indexOf(index) == -1)){
+					if(top){
+						if(groupRows[0] !== row){
+							index = groupRows[0];
+							this.table.rowManager.moveRowInArray(row.modules.group.rows, row, index, !top);
+						}
+					}else {
+						if(groupRows[groupRows.length -1] !== row){
+							index = groupRows[groupRows.length -1];
+							this.table.rowManager.moveRowInArray(row.modules.group.rows, row, index, !top);
+						}
 					}
 				}else {
-					if(groupRows[groupRows.length -1] !== row){
-						index = groupRows[groupRows.length -1];
-						this.table.rowManager.moveRowInArray(row.modules.group.rows, row, index, !top);
-					}
+					this.table.rowManager.moveRowInArray(row.modules.group.rows, row, index, !top);
 				}
-			}else {
-				this.table.rowManager.moveRowInArray(row.modules.group.rows, row, index, !top);
 			}
+			
+			return index;
 		}
-
-		return index;
 	}
-
+	
 	trackChanges(){
 		this.dispatch("group-changed");
 	}
-
+	
 	///////////////////////////////////
 	///////// Table Functions /////////
 	///////////////////////////////////
-
+	
 	setGroupBy(groups){
 		this.table.options.groupBy = groups;
-
+		
 		if(!this.initialized){
 			this.initialize();
 		}
-
+		
 		this.configureGroupSetup();
-
+		
 		this.refreshData();
-
+		
 		this.trackChanges();
 	}
-
+	
 	setGroupValues(groupValues){
 		this.table.options.groupValues = groupValues;
 		this.configureGroupSetup();
 		this.refreshData();
-
+		
 		this.trackChanges();
 	}
-
+	
 	setGroupStartOpen(values){
 		this.table.options.groupStartOpen = values;
 		this.configureGroupSetup();
-
+		
 		if(this.table.options.groupBy){
 			this.refreshData();
-
+			
 			this.trackChanges();
 		}else {
 			console.warn("Grouping Update - cant refresh view, no groups have been set");
 		}
 	}
-
+	
 	setGroupHeader(values){
 		this.table.options.groupHeader = values;
 		this.configureGroupSetup();
-
+		
 		if(this.table.options.groupBy){
 			this.refreshData();
-
+			
 			this.trackChanges();
 		}else {
 			console.warn("Grouping Update - cant refresh view, no groups have been set");
 		}
 	}
-
+	
 	userGetGroups(values){
 		return this.getGroups(true);
 	}
-
+	
 	// get grouped table data in the same format as getData()
 	userGetGroupedData(){
 		return this.table.options.groupBy ?
-			this.getGroupedData() : this.getData();
+		this.getGroupedData() : this.getData();
 	}
-
-
+	
+	
 	///////////////////////////////////////
 	///////// Component Functions /////////
 	///////////////////////////////////////
-
+	
 	rowGetGroup(row){
 		return row.modules.group ? row.modules.group.getComponent() : false;
 	}
-
+	
 	///////////////////////////////////
 	///////// Internal Logic //////////
 	///////////////////////////////////
-
+	
 	rowMoving(from, to, after){
-		if(!after && to instanceof Group){
-			to = this.table.rowManager.prevDisplayRow(from) || to;
-		}
-
-		var toGroup = to instanceof Group ? to : to.modules.group;
-		var fromGroup = from instanceof Group ? from : from.modules.group;
-
-		if(toGroup === fromGroup){
-			this.table.rowManager.moveRowInArray(toGroup.rows, from, to, after);
-		}else {
-			if(fromGroup){
-				fromGroup.removeRow(from);
+		if(this.table.options.groupBy){
+			if(!after && to instanceof Group){
+				to = this.table.rowManager.prevDisplayRow(from) || to;
+			}
+			
+			var toGroup = to instanceof Group ? to : to.modules.group;
+			var fromGroup = from instanceof Group ? from : from.modules.group;
+			
+			if(toGroup === fromGroup){
+				this.table.rowManager.moveRowInArray(toGroup.rows, from, to, after);
+			}else {
+				if(fromGroup){
+					fromGroup.removeRow(from);
+				}
+				
+				toGroup.insertRow(from, to, after);
 			}
-
-			toGroup.insertRow(from, to, after);
 		}
 	}
-
-
+	
+	
 	rowDeleting(row){
 		//remove from group
-		if(row.modules.group){
+		if(this.table.options.groupBy && row.modules.group){
 			row.modules.group.removeRow(row);
 		}
 	}
-
-
+	
 	rowsUpdated(row){
-		this.updateGroupRows(true);
+		if(this.table.options.groupBy){
+			this.updateGroupRows(true);
+		}	
 	}
-
+	
 	cellUpdated(cell){
-		this.reassignRowToGroup(cell.row);
-	}
-
-
-	setDisplayIndex(index){
-		this.displayIndex = index;
-	}
-
-	getDisplayIndex(){
-		return this.displayIndex;
+		if(this.table.options.groupBy){
+			this.reassignRowToGroup(cell.row);
+		}
 	}
-
+	
 	//return appropriate rows with group headers
 	getRows(rows){
 		if(this.table.options.groupBy && this.groupIDLookups.length){
-
+			
 			this.dispatchExternal("dataGrouping");
-
+			
 			this.generateGroups(rows);
-
+			
 			if(this.subscribedExternal("dataGrouped")){
 				this.dispatchExternal("dataGrouped", this.getGroups(true));
 			}
-
+			
 			return this.updateGroupRows();
-
+			
 		}else {
 			return rows.slice(0);
 		}
 	}
-
+	
 	getGroups(component){
 		var groupComponents = [];
-
+		
 		this.groupList.forEach(function(group){
 			groupComponents.push(component ? group.getComponent() : group);
 		});
-
+		
 		return groupComponents;
 	}
-
+	
 	getChildGroups(group){
 		var groupComponents = [];
-
+		
 		if(!group){
 			group = this;
 		}
-
+		
 		group.groupList.forEach((child) => {
 			if(child.groupList.length){
 				groupComponents = groupComponents.concat(this.getChildGroups(child));
@@ -12038,91 +12083,93 @@ class GroupRows extends Module{
 				groupComponents.push(child);
 			}
 		});
-
+		
 		return groupComponents;
 	}
-
+	
 	wipe(){
-		this.groupList.forEach(function(group){
-			group.wipe();
-		});
+		if(this.table.options.groupBy){
+			this.groupList.forEach(function(group){
+				group.wipe();
+			});
+		}
 	}
-
+	
 	pullGroupListData(groupList) {
 		var groupListData = [];
-
+		
 		groupList.forEach((group) => {
 			var groupHeader = {};
 			groupHeader.level = 0;
 			groupHeader.rowCount = 0;
 			groupHeader.headerContent = "";
 			var childData = [];
-
+			
 			if (group.hasSubGroups) {
 				childData = this.pullGroupListData(group.groupList);
-
+				
 				groupHeader.level = group.level;
 				groupHeader.rowCount = childData.length - group.groupList.length; // data length minus number of sub-headers
 				groupHeader.headerContent = group.generator(group.key, groupHeader.rowCount, group.rows, group);
-
+				
 				groupListData.push(groupHeader);
 				groupListData = groupListData.concat(childData);
 			}
-
+			
 			else {
 				groupHeader.level = group.level;
 				groupHeader.headerContent = group.generator(group.key, group.rows.length, group.rows, group);
 				groupHeader.rowCount = group.getRows().length;
-
+				
 				groupListData.push(groupHeader);
-
+				
 				group.getRows().forEach((row) => {
 					groupListData.push(row.getData("data"));
 				});
 			}
 		});
-
+		
 		return groupListData;
 	}
-
+	
 	getGroupedData(){
-
+		
 		return this.pullGroupListData(this.groupList);
 	}
-
+	
 	getRowGroup(row){
 		var match = false;
-
+		
 		if(this.options("dataTree")){
 			row = this.table.modules.dataTree.getTreeParentRoot(row);
 		}
-
+		
 		this.groupList.forEach((group) => {
 			var result = group.getRowGroup(row);
-
+			
 			if(result){
 				match = result;
 			}
 		});
-
+		
 		return match;
 	}
-
+	
 	countGroups(){
 		return this.groupList.length;
 	}
-
+	
 	generateGroups(rows){
 		var oldGroups = this.groups;
-
+		
 		this.groups = {};
 		this.groupList = [];
-
+		
 		if(this.allowedValues && this.allowedValues[0]){
 			this.allowedValues[0].forEach((value) => {
 				this.createGroup(value, 0, oldGroups);
 			});
-
+			
 			rows.forEach((row) => {
 				this.assignRowToExistingGroup(row, oldGroups);
 			});
@@ -12132,53 +12179,53 @@ class GroupRows extends Module{
 			});
 		}
 	}
-
+	
 	createGroup(groupID, level, oldGroups){
 		var groupKey = level + "_" + groupID,
 		group;
-
+		
 		oldGroups = oldGroups || [];
-
+		
 		group = new Group(this, false, level, groupID, this.groupIDLookups[0].field, this.headerGenerator[0], oldGroups[groupKey]);
-
+		
 		this.groups[groupKey] = group;
 		this.groupList.push(group);
 	}
-
+	
 	assignRowToExistingGroup(row, oldGroups){
 		var groupID = this.groupIDLookups[0].func(row.getData()),
 		groupKey = "0_" + groupID;
-
+		
 		if(this.groups[groupKey]){
 			this.groups[groupKey].addRow(row);
 		}
 	}
-
+	
 	assignRowToGroup(row, oldGroups){
 		var groupID = this.groupIDLookups[0].func(row.getData()),
 		newGroupNeeded = !this.groups["0_" + groupID];
-
+		
 		if(newGroupNeeded){
 			this.createGroup(groupID, 0, oldGroups);
 		}
-
+		
 		this.groups["0_" + groupID].addRow(row);
-
+		
 		return !newGroupNeeded;
 	}
-
+	
 	reassignRowToGroup(row){
 		if(row.type === "row"){
 			var oldRowGroup = row.modules.group,
 			oldGroupPath = oldRowGroup.getPath(),
 			newGroupPath = this.getExpectedPath(row),
 			samePath;
-
+			
 			// figure out if new group path is the same as old group path
 			samePath = (oldGroupPath.length == newGroupPath.length) && oldGroupPath.every((element, index) => {
 				return element === newGroupPath[index];
 			});
-
+			
 			// refresh if they new path and old path aren't the same (aka the row's groupings have changed)
 			if(!samePath) {
 				oldRowGroup.removeRow(row);
@@ -12187,57 +12234,81 @@ class GroupRows extends Module{
 			}
 		}
 	}
-
+	
 	getExpectedPath(row) {
 		var groupPath = [], rowData = row.getData();
-
+		
 		this.groupIDLookups.forEach((groupId) => {
 			groupPath.push(groupId.func(rowData));
 		});
-
+		
 		return groupPath;
 	}
-
+	
 	updateGroupRows(force){
 		var output = [];
-
+		
 		this.groupList.forEach((group) => {
 			output = output.concat(group.getHeadersAndRows());
 		});
-
+		
 		if(force){
 			this.refreshData(true, this.displayHandler);
 		}
-
+		
 		return output;
 	}
-
+	
 	scrollHeaders(left){
-		if(this.table.options.renderHorizontal === "virtual"){
-			left -= this.table.columnManager.renderer.vDomPadLeft;
+		if(this.table.options.groupBy){
+			if(this.table.options.renderHorizontal === "virtual"){
+				left -= this.table.columnManager.renderer.vDomPadLeft;
+			}
+			
+			left = left + "px";
+			
+			this.groupList.forEach((group) => {
+				group.scrollHeader(left);
+			});
 		}
-
-		left = left + "px";
-
-		this.groupList.forEach((group) => {
-			group.scrollHeader(left);
-		});
 	}
-
+	
 	removeGroup(group){
 		var groupKey = group.level + "_" + group.key,
 		index;
-
+		
 		if(this.groups[groupKey]){
 			delete this.groups[groupKey];
-
+			
 			index = this.groupList.indexOf(group);
-
+			
 			if(index > -1){
 				this.groupList.splice(index, 1);
 			}
 		}
 	}
+	
+	checkBasicModeGroupHeaderWidth(){
+		var element = this.table.rowManager.tableElement,
+		onlyGroupHeaders = true;
+		
+		this.table.rowManager.getDisplayRows().forEach((row, index) =>{
+			this.table.rowManager.styleRow(row, index);
+			element.appendChild(row.getElement());
+			row.initialize(true);
+			
+			if(row.type !== "group"){
+				onlyGroupHeaders = false;
+			}
+		});
+		
+		if(onlyGroupHeaders){
+			element.style.minWidth = this.table.columnManager.getWidth() + "px";
+		}else {
+			element.style.minWidth = "";
+		}
+	}
+	
 }
 
 GroupRows.moduleName = "groupRows";
@@ -12335,7 +12406,7 @@ class History extends Module{
 
 		if(this.table.options.groupBy){
 
-			rows = row.getComponent().getGroup().rows;
+			rows = row.getComponent().getGroup()._getSelf().rows;
 			index = rows.indexOf(row);
 
 			if(index){
@@ -13032,7 +13103,7 @@ class Interaction extends Module{
 		var range;
 
 		if(this.table.modExists("edit")){
-			if (this.table.modules.edit.currentCell === this){
+			if (this.table.modules.edit.currentCell === cell){
 				return; //prevent instant selection of editor content
 			}
 		}
@@ -13042,11 +13113,11 @@ class Interaction extends Module{
 		try{
 			if (document.selection) { // IE
 				range = document.body.createTextRange();
-				range.moveToElementText(this.element);
+				range.moveToElementText(cell.getElement());
 				range.select();
 			} else if (window.getSelection) {
 				range = document.createRange();
-				range.selectNode(this.element);
+				range.selectNode(cell.getElement());
 				window.getSelection().removeAllRanges();
 				window.getSelection().addRange(range);
 			}
@@ -14975,8 +15046,6 @@ class Page extends Module{
 
 		this.remoteRowCountEstimate = null;
 		
-		this.displayIndex = 0; //index in display pipeline
-		
 		this.initialLoad = true;
 		this.dataChanging = false; //flag to check if data is being changed by this module
 		
@@ -15422,14 +15491,6 @@ class Page extends Module{
 		this.dispatch("page-changed");
 	}
 	
-	setDisplayIndex(index){
-		this.displayIndex = index;
-	}
-	
-	getDisplayIndex(){
-		return this.displayIndex;
-	}
-	
 	//calculate maximum page from number of rows
 	setMaxRows(rowCount){
 		if(!rowCount){
@@ -15496,9 +15557,9 @@ class Page extends Module{
 	}
 	
 	setPageToRow(row){
-		var rows = this.table.rowManager.getDisplayRows(this.displayIndex - 1);
+		var rows = this.displayRows(-1);
 		var index = rows.indexOf(row);
-		
+	
 		if(index > -1){
 			var page = this.size === true ? 1 : Math.ceil((index + 1) / this.size);
 			
@@ -16091,9 +16152,10 @@ class Persistence extends Module{
 			keys.forEach((key)=>{
 				var props = Object.getOwnPropertyDescriptor(def, key);
 				var value = def[key];
+
 				if(props){
 					Object.defineProperty(def, key, {
-						set: function(newValue){
+						set: (newValue) => {
 							value = newValue;
 
 							if(!this.defWatcherBlock){
@@ -16104,7 +16166,7 @@ class Persistence extends Module{
 								props.set(newValue);
 							}
 						},
-						get:function(){
+						get:() => {
 							if(props.get){
 								props.get();
 							}
@@ -17636,8 +17698,9 @@ class ResponsiveLayout extends Module{
 			this.subscribe("column-delete", this.initializeResponsivity.bind(this));
 
 			this.subscribe("table-redrawing", this.tableRedraw.bind(this));
-
+			
 			if(this.table.options.responsiveLayout === "collapse"){
+				this.subscribe("row-data-changed", this.generateCollapsedRowContent.bind(this));
 				this.subscribe("row-init", this.initializeRow.bind(this));
 				this.subscribe("row-layout", this.layoutRow.bind(this));
 			}
@@ -18160,18 +18223,22 @@ class SelectRow extends Module{
 				break;
 			
 			case "string":
-			
 				rowMatch = this.table.rowManager.findRow(rows);
 			
 				if(rowMatch){
 					this._selectRow(rowMatch, true, true);
+					this._rowSelectionChanged();
 				}else {
-					this.table.rowManager.getRows(rows).forEach((row) => {
+					rowMatch = this.table.rowManager.getRows(rows);
+					
+					rowMatch.forEach((row) => {
 						this._selectRow(row, true, true);
 					});
+
+					if(rowMatch.length){
+						this._rowSelectionChanged();
+					}
 				}
-			
-				this._rowSelectionChanged();
 				break;
 			
 			default:
@@ -18808,7 +18875,6 @@ class Sort extends Module{
 						}
 					}
 
-
 					if (this.table.options.columnHeaderSortMulti && (e.shiftKey || e.ctrlKey)) {
 						sorters = this.getSort();
 
@@ -18819,11 +18885,9 @@ class Sort extends Module{
 						if(match > -1){
 							sorters[match].dir = dir;
 
-							if(match != sorters.length -1){
-								match = sorters.splice(match, 1)[0];
-								if(dir != "none"){
-									sorters.push(match);
-								}
+							match = sorters.splice(match, 1)[0];
+							if(dir != "none"){
+								sorters.push(match);
 							}
 						}else {
 							if(dir != "none"){
@@ -19038,7 +19102,7 @@ class Sort extends Module{
 		var sortEl = column.modules.sort.element,
 		arrowEl;
 
-		if(typeof this.table.options.headerSortElement === "function"){
+		if(column.definition.headerSort && typeof this.table.options.headerSortElement === "function"){
 			while(sortEl.firstChild) sortEl.removeChild(sortEl.firstChild);
 
 			arrowEl = this.table.options.headerSortElement.call(this.table, column.getComponent(), dir);
@@ -20863,6 +20927,8 @@ class ColumnManager extends CoreFeature {
 		var minHeight = 0;
 		
 		if(!this.redrawBlock){
+
+			this.element.style.height="";
 			
 			this.columns.forEach((column) => {
 				column.clearVerticalAlign();
@@ -20875,7 +20941,9 @@ class ColumnManager extends CoreFeature {
 					minHeight = height;
 				}
 			});
-			
+
+			this.element.style.height = minHeight + "px";
+
 			this.columns.forEach((column) => {
 				column.verticalAlign(this.table.options.columnHeaderVertAlign, minHeight);
 			});
@@ -20886,6 +20954,8 @@ class ColumnManager extends CoreFeature {
 	
 	//////////////// Column Details /////////////////
 	findColumn(subject){
+		var columns;
+
 		if(typeof subject == "object"){
 			
 			if(subject instanceof Column){
@@ -20895,8 +20965,16 @@ class ColumnManager extends CoreFeature {
 				//subject is public column component
 				return subject._getSelf() || false;
 			}else if(typeof HTMLElement !== "undefined" && subject instanceof HTMLElement){
+
+				columns = [];
+
+				this.columns.forEach((column) => {
+					columns.push(column);
+					columns = columns.concat(column.getColumns(true));
+				});
+
 				//subject is a HTML element of the column header
-				let match = this.columns.find((column) => {
+				let match = columns.find((column) => {
 					return column.element === subject;
 				});
 				
@@ -21011,14 +21089,14 @@ class ColumnManager extends CoreFeature {
 	}
 	
 	moveColumn(from, to, after){
-		this.moveColumnActual(from, to, after);
-		
 		to.element.parentNode.insertBefore(from.element, to.element);
 		
 		if(after){
 			to.element.parentNode.insertBefore(to.element, from.element);
 		}
 		
+		this.moveColumnActual(from, to, after);
+
 		this.verticalAlignHeaders();
 		
 		this.table.rowManager.reinitialize();
@@ -22533,81 +22611,82 @@ class RowManager extends CoreFeature{
 		index = 0,
 		cascadeOrder = ["all", "dataPipeline", "display", "displayPipeline", "end"];
 		
-		
-		if(typeof handler === "function"){
-			index = this.dataPipeline.findIndex((item) => {
-				return item.handler === handler;
-			});
-			
-			if(index > -1){
-				stage = "dataPipeline";
-				
-				if(skipStage){
-					if(index == this.dataPipeline.length - 1){
-						stage = "display";
-					}else {
-						index++;
-					}
-				}
-			}else {
-				index = this.displayPipeline.findIndex((item) => {
+		if(!this.table.destroyed){
+			if(typeof handler === "function"){
+				index = this.dataPipeline.findIndex((item) => {
 					return item.handler === handler;
 				});
 				
 				if(index > -1){
-					stage = "displayPipeline";
+					stage = "dataPipeline";
 					
 					if(skipStage){
-						if(index == this.displayPipeline.length - 1){
-							stage = "end";
+						if(index == this.dataPipeline.length - 1){
+							stage = "display";
 						}else {
 							index++;
 						}
 					}
 				}else {
-					console.error("Unable to refresh data, invalid handler provided", handler);
-					return;
+					index = this.displayPipeline.findIndex((item) => {
+						return item.handler === handler;
+					});
+					
+					if(index > -1){
+						stage = "displayPipeline";
+						
+						if(skipStage){
+							if(index == this.displayPipeline.length - 1){
+								stage = "end";
+							}else {
+								index++;
+							}
+						}
+					}else {
+						console.error("Unable to refresh data, invalid handler provided", handler);
+						return;
+					}
 				}
-			}
-		}else {
-			stage = handler || "all";
-			index = 0;
-		}
-		
-		if(this.redrawBlock){
-			if(!this.redrawBlockRestoreConfig || (this.redrawBlockRestoreConfig && ((this.redrawBlockRestoreConfig.stage === stage && index < this.redrawBlockRestoreConfig.index) || (cascadeOrder.indexOf(stage) < cascadeOrder.indexOf(this.redrawBlockRestoreConfig.stage))))){
-				this.redrawBlockRestoreConfig = {
-					handler: handler,
-					skipStage: skipStage,
-					renderInPosition: renderInPosition,
-					stage:stage,
-					index:index,
-				};
+			}else {
+				stage = handler || "all";
+				index = 0;
 			}
 			
-			return;
-		}else {
-			if(Helpers.elVisible(this.element)){
-				if(renderInPosition){
-					this.reRenderInPosition(this.refreshPipelines.bind(this, handler, stage, index, renderInPosition));
+			if(this.redrawBlock){
+				if(!this.redrawBlockRestoreConfig || (this.redrawBlockRestoreConfig && ((this.redrawBlockRestoreConfig.stage === stage && index < this.redrawBlockRestoreConfig.index) || (cascadeOrder.indexOf(stage) < cascadeOrder.indexOf(this.redrawBlockRestoreConfig.stage))))){
+					this.redrawBlockRestoreConfig = {
+						handler: handler,
+						skipStage: skipStage,
+						renderInPosition: renderInPosition,
+						stage:stage,
+						index:index,
+					};
+				}
+				
+				return;
+			}else {
+				if(Helpers.elVisible(this.element)){
+					if(renderInPosition){
+						this.reRenderInPosition(this.refreshPipelines.bind(this, handler, stage, index, renderInPosition));
+					}else {
+						this.refreshPipelines(handler, stage, index, renderInPosition);
+						
+						if(!handler){
+							this.table.columnManager.renderer.renderColumns();
+						}
+						
+						this.renderTable();
+						
+						if(table.options.layoutColumnsOnNewData){
+							this.table.columnManager.redraw(true);
+						}
+					}
 				}else {
 					this.refreshPipelines(handler, stage, index, renderInPosition);
-					
-					if(!handler){
-						this.table.columnManager.renderer.renderColumns();
-					}
-					
-					this.renderTable();
-					
-					if(table.options.layoutColumnsOnNewData){
-						this.table.columnManager.redraw(true);
-					}
 				}
-			}else {
-				this.refreshPipelines(handler, stage, index, renderInPosition);
+				
+				this.dispatch("data-refreshed");
 			}
-			
-			this.dispatch("data-refreshed");
 		}
 	}
 	
@@ -22640,7 +22719,7 @@ class RowManager extends CoreFeature{
 			case "displayPipeline":
 				for(let i = index; i < this.displayPipeline.length; i++){
 					let result = this.displayPipeline[i].handler((i ? this.getDisplayRows(i - 1) : this.activeRows).slice(0), renderInPosition);
-					
+
 					this.setDisplayRows(result || this.getDisplayRows(i - 1).slice(0), i);
 				}
 			
@@ -22677,28 +22756,13 @@ class RowManager extends CoreFeature{
 		this.displayRowsCount = this.displayRows[0].length;
 	}
 	
-	getNextDisplayIndex(){
-		return this.displayRows.length;
-	}
-	
 	//set display row pipeline data
 	setDisplayRows(displayRows, index){
-		
-		var output = true;
-		
-		if(index && typeof this.displayRows[index] != "undefined"){
-			this.displayRows[index] = displayRows;
-			output = true;
-		}else {
-			this.displayRows.push(displayRows);
-			output = index = this.displayRows.length -1;
-		}
-		
+		this.displayRows[index] = displayRows;
+
 		if(index == this.displayRows.length -1){
 			this.displayRowsCount = this.displayRows[this.displayRows.length -1].length;
 		}
-		
-		return output;
 	}
 	
 	getDisplayRows(index){
@@ -22729,23 +22793,24 @@ class RowManager extends CoreFeature{
 	
 	//return only actual rows (not group headers etc)
 	getRows(type){
-		var rows;
-		
-		switch(type){
-			case "active":
-				rows = this.activeRows;
-				break;
-			
-			case "display":
-				rows = this.table.rowManager.getDisplayRows();
-				break;
-				
-			case "visible":
-				rows = this.getVisibleRows(false, true);
-				break;
+		var rows = [];
+
+		if(!type){
+			rows = this.chain("rows-retrieve", type, null, this.rows) || this.rows;
+		}else {
+			switch(type){
+				case "active":
+					rows = this.activeRows;
+					break;
 				
-			default:
-				rows = this.chain("rows-retrieve", type, null, this.rows) || this.rows;
+				case "display":
+					rows = this.table.rowManager.getDisplayRows();
+					break;
+					
+				case "visible":
+					rows = this.getVisibleRows(false, true);
+					break;
+			}
 		}
 		
 		return rows;
@@ -22788,6 +22853,8 @@ class RowManager extends CoreFeature{
 		}
 		
 		if(renderClass){
+			this.renderMode = this.table.options.renderVertical;
+			
 			this.renderer = new renderClass(this.table, this.element, this.tableElement);
 			this.renderer.initialize();
 			
@@ -22852,9 +22919,6 @@ class RowManager extends CoreFeature{
 		
 		this.scrollTop = 0;
 		this.scrollLeft = 0;
-
-		// clear empty table placeholder min
-		this.tableElement.style.minWidth = "";
 		
 		this.renderer.clearRows();
 	}
@@ -22871,6 +22935,9 @@ class RowManager extends CoreFeature{
 	_clearPlaceholder(){
 		if(this.placeholder && this.placeholder.parentNode){
 			this.placeholder.parentNode.removeChild(this.placeholder);
+			
+			// clear empty table placeholder min
+			this.tableElement.style.minWidth = "";
 		}
 	}
 	
@@ -23314,7 +23381,9 @@ class InteractionManager extends CoreFeature {
 			});
 			
 			for (let target of elTargets) {
-				targets[this.componentMap[target]] = el;
+				if(!targets[this.componentMap[target]]){
+					targets[this.componentMap[target]] = el;
+				}
 			}
 		}
 		
@@ -23329,12 +23398,13 @@ class InteractionManager extends CoreFeature {
 		//ensure row component is looked up before cell
 		var keys = Object.keys(targets).reverse(),
 		listener = this.listeners[type],
+		matches = {},
 		targetMatches = {};
 		
 		for(let key of keys){
-			let component;
-			let target = targets[key];
-			let previousTarget = this.previousTargets[key];
+			let component,
+			target = targets[key],
+			previousTarget = this.previousTargets[key];
 			
 			if(previousTarget && previousTarget.target === target){
 				component = previousTarget.component;
@@ -23363,8 +23433,8 @@ class InteractionManager extends CoreFeature {
 					
 					case "cell":
 						if(listener.components.includes("cell")){
-							if(targets["row"] instanceof Row){
-								component = targets["row"].findCell(target);
+							if(matches["row"] instanceof Row){
+								component = matches["row"].findCell(target);
 							}else {	
 								if(targets["row"]){
 									console.warn("Event Target Lookup Error - The row this cell is attached to cannot be found, has the table been reinitialized without being destroyed first?");
@@ -23376,7 +23446,7 @@ class InteractionManager extends CoreFeature {
 			}
 			
 			if(component){
-				targets[key] = component;
+				matches[key] = component;
 				targetMatches[key] = {
 					target:target,
 					component:component,
@@ -23386,12 +23456,12 @@ class InteractionManager extends CoreFeature {
 		
 		this.previousTargets = targetMatches;
 		
-		return targets;
+		return matches;
 	}
 	
 	triggerEvents(type, e, targets){
 		var listener = this.listeners[type];
-		
+
 		for(let key in targets){
 			if(targets[key] && listener.components.includes(key)){
 				this.dispatch(key + "-" + type, e, targets[key]);
@@ -24002,7 +24072,7 @@ function fitDataStretch(columns, forced){
 
 //resize columns to fit
 function fitColumns(columns, forced){
-	var totalWidth = this.table.element.clientWidth; //table element width
+	var totalWidth = this.table.rowManager.element.getBoundingClientRect().width; //table element width
 	var fixedWidth = 0; //total width of columns with a defined width
 	var flexWidth = 0; //total width available to flexible columns
 	var flexGrowUnits = 0; //total number of widthGrow blocks across all columns
@@ -24079,9 +24149,7 @@ function fitColumns(columns, forced){
 
 			nextColWidth = changeUnits ? Math.floor(remainingSpace/changeUnits) : remainingSpace;
 
-			gap = remainingSpace - (nextColWidth * changeUnits);
-
-			gap += scaleColumns(undersizeCols, remainingSpace, nextColWidth, shrinkCols);
+			gap = scaleColumns(undersizeCols, remainingSpace, nextColWidth, shrinkCols);
 		}else {
 			gap = changeUnits ? freeSpace - (Math.floor(freeSpace/changeUnits) * changeUnits) : freeSpace;
 
@@ -24145,7 +24213,7 @@ function fitColumns(columns, forced){
 
 	//increase width of last column to account for rounding errors
 	if(flexColumns.length && gapFill > 0){
-		flexColumns[flexColumns.length-1].width += + gapFill;
+		flexColumns[flexColumns.length-1].width += gapFill;
 	}
 
 	//calculate space for columns to be shrunk into
@@ -24161,7 +24229,7 @@ function fitColumns(columns, forced){
 	}
 
 	//decrease width of last column to account for rounding errors
-	if(fixedShrinkColumns.length){
+	if(gapFill && fixedShrinkColumns.length){
 		fixedShrinkColumns[fixedShrinkColumns.length-1].width -= gapFill;
 	}
 
@@ -25067,7 +25135,7 @@ class Tabulator {
 				data = JSON.parse(data);
 			}
 			
-			if(data){
+			if(data && data.length > 0){
 				data.forEach((item) => {
 					var row = this.rowManager.findRow(item[this.options.index]);
 					
@@ -25133,7 +25201,7 @@ class Tabulator {
 				data = JSON.parse(data);
 			}
 			
-			if(data){
+			if(data && data.length > 0){
 				data.forEach((item) => {
 					var row = this.rowManager.findRow(item[this.options.index]);