tabulator-tables 5.3.1 → 5.3.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tabulator-tables",
-  "version": "5.3.1",
+  "version": "5.3.4",
   "description": "Interactive table generation JavaScript library",
   "style": "dist/css/tabulator.css",
   "main": "dist/js/tabulator.js",

package/src/js/core/ColumnManager.js

@@ -286,6 +286,8 @@ export default class ColumnManager extends CoreFeature {
 		var minHeight = 0;
 		
 		if(!this.redrawBlock){
+
+			this.headersElement.style.height="";
 			
 			this.columns.forEach((column) => {
 				column.clearVerticalAlign();
@@ -298,7 +300,9 @@ export default class ColumnManager extends CoreFeature {
 					minHeight = height;
 				}
 			});
-			
+
+			this.headersElement.style.height = minHeight + "px";
+
 			this.columns.forEach((column) => {
 				column.verticalAlign(this.table.options.columnHeaderVertAlign, minHeight);
 			});
@@ -444,14 +448,14 @@ export default 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();

package/src/js/core/Module.js

@@ -2,90 +2,121 @@ import CoreFeature from './CoreFeature.js';
 import Popup from './tools/Popup.js';
 
 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 ////////
 	///////////////////////////////////
@@ -93,15 +124,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();
 	}

package/src/js/core/RowManager.js

@@ -604,81 +604,82 @@ export default 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");
 		}
 	}
 	
@@ -711,7 +712,7 @@ export default 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);
 				}
 			
@@ -748,28 +749,13 @@ export default 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){
@@ -800,23 +786,24 @@ export default 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 || type === true){
+			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;
@@ -925,9 +912,6 @@ export default class RowManager extends CoreFeature{
 		
 		this.scrollTop = 0;
 		this.scrollLeft = 0;
-
-		// clear empty table placeholder min
-		this.tableElement.style.minWidth = "";
 		
 		this.renderer.clearRows();
 	}
@@ -945,6 +929,9 @@ export default class RowManager extends CoreFeature{
 		if(this.placeholder && this.placeholder.parentNode){
 			this.placeholder.parentNode.removeChild(this.placeholder);
 		}
+
+		// clear empty table placeholder min
+		this.tableElement.style.minWidth = "";
 	}
 	
 	_positionPlaceholder(){

package/src/js/core/Tabulator.js

@@ -417,7 +417,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]);
 					
@@ -483,7 +483,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]);
 					

package/src/js/core/tools/InteractionMonitor.js

@@ -236,12 +236,13 @@ export default 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;
@@ -270,8 +271,8 @@ export default 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?");
@@ -283,7 +284,7 @@ export default class InteractionManager extends CoreFeature {
 			}
 			
 			if(component){
-				targets[key] = component;
+				matches[key] = component;
 				targetMatches[key] = {
 					target:target,
 					component:component,
@@ -293,12 +294,12 @@ export default 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]);

package/src/js/modules/DataTree/DataTree.js

@@ -18,8 +18,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
@@ -295,14 +293,6 @@ class DataTree extends Module{
 		}
 	}
 
-	setDisplayIndex (index) {
-		this.displayIndex = index;
-	}
-
-	getDisplayIndex () {
-		return this.displayIndex;
-	}
-
 	getRows(rows){
 		var output = [];
 

package/src/js/modules/FrozenRows/FrozenRows.js

@@ -100,12 +100,13 @@ class FrozenRows extends Module{
 			this.topElement.appendChild(row.getElement());
 			row.initialize();
 			row.normalizeHeight();
-			this.table.rowManager.adjustTableSize();
-
+		
 			this.rows.push(row);
 
 			this.refreshData(false, "display");
 
+			this.table.rowManager.adjustTableSize();
+
 			this.styleRows();
 
 		}else{

package/src/js/modules/GroupRows/Group.js

@@ -379,9 +379,7 @@ class Group{
 				});
 			}
 			
-			this.groupManager.table.rowManager.setDisplayRows(this.groupManager.updateGroupRows(), this.groupManager.getDisplayIndex());
-			
-			this.groupManager.checkBasicModeGroupHeaderWidth();
+			this.groupManager.updateGroupRows(true);
 			
 		}else{
 			this.groupManager.updateGroupRows(true);
@@ -419,10 +417,8 @@ class Group{
 					prev = rowEl;
 				});
 			}
-			
-			this.groupManager.table.rowManager.setDisplayRows(this.groupManager.updateGroupRows(), this.groupManager.getDisplayIndex());
-			
-			this.groupManager.checkBasicModeGroupHeaderWidth();
+
+			this.groupManager.updateGroupRows(true);
 		}else{
 			this.groupManager.updateGroupRows(true);
 		}

package/src/js/modules/GroupRows/GroupComponent.js

@@ -40,7 +40,7 @@ class GroupComponent {
 	}
 
 	isVisible(){
-		return this._group.visible;
+		return this._group._visible;
 	}
 
 	show(){