tabulator-tables 5.6.1 → 6.0.0

package/src/js/modules/ColumnCalcs/CalcComponent.js

@@ -1,4 +1,4 @@
-class CalcComponent{
+export default class CalcComponent{
 	constructor (row){
 		this._row = row;
 
@@ -43,6 +43,4 @@ class CalcComponent{
 	_getSelf(){
 		return this._row;
 	}
-}
-
-export default CalcComponent;
+}

package/src/js/modules/ColumnCalcs/ColumnCalcs.js

@@ -8,7 +8,12 @@ import Row from '../../core/row/Row.js';
 
 import defaultCalculations from './defaults/calculations.js';
 
-class ColumnCalcs extends Module{
+export default class ColumnCalcs extends Module{
+
+	static moduleName = "columnCalcs";
+
+	//load defaults
+	static calculations = defaultCalculations;
 	
 	constructor(table){
 		super(table);
@@ -397,19 +402,19 @@ class ColumnCalcs extends Module{
 	}
 	
 	rowsToData(rows){
-		var data = [];
-		
+		var data = [],
+		hasDataTreeColumnCalcs = this.table.options.dataTree && this.table.options.dataTreeChildColumnCalcs,
+		dataTree = this.table.modules.dataTree;
+
 		rows.forEach((row) => {
 			data.push(row.getData());
-			
-			if(this.table.options.dataTree && this.table.options.dataTreeChildColumnCalcs){
-				if(row.modules.dataTree && row.modules.dataTree.open){
-					var children = this.rowsToData(this.table.modules.dataTree.getFilteredTreeChildren(row));
-					data = data.concat(children);
-				}
+
+			if(hasDataTreeColumnCalcs && row.modules.dataTree?.open){
+				this.rowsToData(dataTree.getFilteredTreeChildren(row)).forEach(dataRow =>{
+					data.push(row);
+				});
 			}
 		});
-		
 		return data;
 	}
 	
@@ -578,11 +583,4 @@ class ColumnCalcs extends Module{
 			}
 		}
 	}
-}
-
-ColumnCalcs.moduleName = "columnCalcs";
-
-//load defaults
-ColumnCalcs.calculations = defaultCalculations;
-
-export default ColumnCalcs;
+}

package/src/js/modules/Comms/Comms.js

@@ -1,7 +1,8 @@
 import Module from '../../core/Module.js';
-import TableRegistry from '../../core/tools/TableRegistry.js';
 
-class Comms extends Module{
+export default class Comms extends Module{
+
+	static moduleName = "comms";
 
 	constructor(table){
 		super(table);
@@ -15,7 +16,7 @@ class Comms extends Module{
 		var connections = [],
 		connection;
 
-		connection = TableRegistry.lookupTable(selectors);
+		connection = this.table.constructor.registry.lookupTable(selectors);
 
 		connection.forEach((con) =>{
 			if(this.table !== con){
@@ -45,8 +46,4 @@ class Comms extends Module{
 			console.warn("Inter-table Comms Error - no such module:", module);
 		}
 	}
-}
-
-Comms.moduleName = "comms";
-
-export default Comms;
+}

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

@@ -4,7 +4,9 @@ import Row from '../../core/row/Row.js';
 
 import RowComponent from '../../core/row/RowComponent.js';
 
-class DataTree extends Module{
+export default class DataTree extends Module{
+
+	static moduleName = "dataTree";
 
 	constructor(table){
 		super(table);
@@ -311,7 +313,7 @@ class DataTree extends Module{
 				config = row.modules.dataTree;
 
 				if(!config.index && config.children !== false){
-					children = this.getChildren(row);
+					children = this.getChildren(row, false, true);
 
 					children.forEach((child) => {
 						child.create();
@@ -324,7 +326,7 @@ class DataTree extends Module{
 		return output;
 	}
 
-	getChildren(row, allChildren){
+	getChildren(row, allChildren, sortOnly){
 		var config = row.modules.dataTree,
 		children = [],
 		output = [];
@@ -341,13 +343,13 @@ class DataTree extends Module{
 			}
 
 			if(this.table.modExists("sort") && this.table.options.dataTreeSort){
-				this.table.modules.sort.sort(children);
+				this.table.modules.sort.sort(children, sortOnly);
 			}
 
 			children.forEach((child) => {
 				output.push(child);
 
-				var subChildren = this.getChildren(child);
+				var subChildren = this.getChildren(child, false, true);
 
 				subChildren.forEach((sub) => {
 					output.push(sub);
@@ -584,7 +586,9 @@ class DataTree extends Module{
 					output.push(component ? childRow.getComponent() : childRow);
 
 					if(recurse){
-						output = output.concat(this.getTreeChildren(childRow, component, recurse));
+						this.getTreeChildren(childRow, component, recurse).forEach(child => {
+							output.push(child);
+						});
 					}
 				}
 			});
@@ -600,8 +604,4 @@ class DataTree extends Module{
 	redrawNeeded(data){
 		return (this.field ? typeof data[this.field] !== "undefined" : false) || (this.elementField ? typeof data[this.elementField] !== "undefined" : false);
 	}
-}
-
-DataTree.moduleName = "dataTree";
-
-export default DataTree;
+}

package/src/js/modules/Download/Download.js

@@ -2,7 +2,12 @@ import Module from '../../core/Module.js';
 
 import defaultDownloaders from './defaults/downloaders.js';
 
-class Download extends Module{
+export default class Download extends Module{
+
+	static moduleName = "download";
+
+	//load defaults
+	static downloaders = defaultDownloaders;
 
 	constructor(table){
 		super(table);
@@ -10,7 +15,7 @@ class Download extends Module{
 		this.registerTableOption("downloadEncoder", function(data, mimeType){
 			return new Blob([data],{type:mimeType});
 		}); //function to manipulate download data
-		this.registerTableOption("downloadReady", undefined); //warn of function deprecation
+		// this.registerTableOption("downloadReady", undefined); //warn of function deprecation
 		this.registerTableOption("downloadConfig", {}); //download config
 		this.registerTableOption("downloadRowRange", "active"); //restrict download to active rows only
 
@@ -26,7 +31,7 @@ class Download extends Module{
 	}
 
 	deprecatedOptionsCheck(){
-		this.deprecationCheck("downloadReady", "downloadEncoder");
+		// this.deprecationCheck("downloadReady", "downloadEncoder");
 	}	
 
 	///////////////////////////////////
@@ -139,11 +144,4 @@ class Download extends Module{
 				break;
 		}
 	}
-}
-
-Download.moduleName = "download";
-
-//load defaults
-Download.downloaders = defaultDownloaders;
-
-export default Download;
+}

package/src/js/modules/Edit/Edit.js

@@ -3,7 +3,12 @@ import Helpers from '../../core/tools/Helpers.js';
 
 import defaultEditors from './defaults/editors.js';
 
-class Edit extends Module{
+export default class Edit extends Module{
+
+	static moduleName = "edit";
+
+	//load defaults
+	static editors = defaultEditors;
 	
 	constructor(table){
 		super(table);
@@ -13,19 +18,24 @@ class Edit extends Module{
 		this.recursionBlock = false; //prevent focus recursion
 		this.invalidEdit = false;
 		this.editedCells = [];
+		this.convertEmptyValues = false;
 		
 		this.editors = Edit.editors;
-		
+	
+		this.registerTableOption("editTriggerEvent", "focus");
+		this.registerTableOption("editorEmptyValue");
+		this.registerTableOption("editorEmptyValueFunc", this.emptyValueCheck.bind(this));
+
 		this.registerColumnOption("editable");
 		this.registerColumnOption("editor");
 		this.registerColumnOption("editorParams");
+		this.registerColumnOption("editorEmptyValue");
+		this.registerColumnOption("editorEmptyValueFunc");
 		
 		this.registerColumnOption("cellEditing");
 		this.registerColumnOption("cellEdited");
 		this.registerColumnOption("cellEditCancelled");
 		
-		this.registerTableOption("editTriggerEvent", "focus");
-		
 		this.registerTableFunction("getEditedCells", this.getEditedCells.bind(this));
 		this.registerTableFunction("clearCellEdited", this.clearCellEdited.bind(this));
 		this.registerTableFunction("navigatePrev", this.navigatePrev.bind(this));
@@ -62,11 +72,14 @@ class Edit extends Module{
 		this.subscribe("keybinding-nav-prev", this.navigatePrev.bind(this, undefined));
 		this.subscribe("keybinding-nav-next", this.keybindingNavigateNext.bind(this));
 		
-		
 		// this.subscribe("keybinding-nav-left", this.navigateLeft.bind(this, undefined));
 		// this.subscribe("keybinding-nav-right", this.navigateRight.bind(this, undefined));
 		this.subscribe("keybinding-nav-up", this.navigateUp.bind(this, undefined));
 		this.subscribe("keybinding-nav-down", this.navigateDown.bind(this, undefined));
+
+		if(Object.keys(this.table.options).includes("editorEmptyValue")){
+			this.convertEmptyValues = true;
+		}
 	}
 	
 	
@@ -378,11 +391,16 @@ class Edit extends Module{
 	
 	//initialize column editor
 	initializeColumn(column){
+		var convertEmpty = Object.keys(column.definition).includes("editorEmptyValue");
+
 		var config = {
 			editor:false,
 			blocked:false,
 			check:column.definition.editable,
-			params:column.definition.editorParams || {}
+			params:column.definition.editorParams || {},
+			convertEmptyValues:convertEmpty,
+			editorEmptyValue:column.definition.editorEmptyValue,
+			editorEmptyValueFunc:column.definition.editorEmptyValueFunc,
 		};
 		
 		//set column editor
@@ -628,6 +646,8 @@ class Edit extends Module{
 					if(self.editedCells.indexOf(cell) == -1){
 						self.editedCells.push(cell);
 					}
+
+					value = self.transformEmptyValues(value, cell);
 					
 					cell.setValue(value, true);
 
@@ -740,6 +760,26 @@ class Edit extends Module{
 			return false;
 		}
 	}
+
+	emptyValueCheck(value){
+		return value === "" || value === null || typeof value === "undefined";
+	}
+
+	transformEmptyValues(value, cell){
+		var mod = cell.column.modules.edit, 
+		convert = mod.convertEmptyValues || this.convertEmptyValues,
+		checkFunc;
+		
+		if(convert){
+			checkFunc = mod.editorEmptyValueFunc || this.options("editorEmptyValueFunc");
+
+			if(checkFunc && checkFunc(value)){
+				value = mod.convertEmptyValues ? mod.editorEmptyValue : this.options("editorEmptyValue");
+			}
+		}
+		
+		return value;
+	}
 	
 	blur(element){
 		if(!this.confirm("edit-blur", [element]) ){
@@ -772,12 +812,4 @@ class Edit extends Module{
 			this.editedCells.splice(editIndex, 1);
 		}
 	}
-}
-
-Edit.moduleName = "edit";
-
-//load defaults
-Edit.editors = defaultEditors;
-
-
-export default Edit;
+}

package/src/js/modules/Edit/List.js

@@ -46,21 +46,21 @@ export default class Edit{
 	}
 	
 	_deprecatedOptionsCheck(){
-		if(this.params.listItemFormatter){
-			this.cell.getTable().deprecationAdvisor.msg("The listItemFormatter editor param has been deprecated, please see the latest editor documentation for updated options");
-		}
+		// if(this.params.listItemFormatter){
+		// 	this.cell.getTable().deprecationAdvisor.msg("The listItemFormatter editor param has been deprecated, please see the latest editor documentation for updated options");
+		// }
 		
-		if(this.params.sortValuesList){
-			this.cell.getTable().deprecationAdvisor.msg("The sortValuesList editor param has been deprecated, please see the latest editor documentation for updated options");
-		}
+		// if(this.params.sortValuesList){
+		// 	this.cell.getTable().deprecationAdvisor.msg("The sortValuesList editor param has been deprecated, please see the latest editor documentation for updated options");
+		// }
 		
-		if(this.params.searchFunc){
-			this.cell.getTable().deprecationAdvisor.msg("The searchFunc editor param has been deprecated, please see the latest editor documentation for updated options");
-		}
+		// if(this.params.searchFunc){
+		// 	this.cell.getTable().deprecationAdvisor.msg("The searchFunc editor param has been deprecated, please see the latest editor documentation for updated options");
+		// }
 		
-		if(this.params.searchingPlaceholder){
-			this.cell.getTable().deprecationAdvisor.msg("The searchingPlaceholder editor param has been deprecated, please see the latest editor documentation for updated options");
-		}
+		// if(this.params.searchingPlaceholder){
+		// 	this.cell.getTable().deprecationAdvisor.msg("The searchingPlaceholder editor param has been deprecated, please see the latest editor documentation for updated options");
+		// }
 	}
 	
 	_initializeValue(){

package/src/js/modules/Edit/defaults/editors/time.js

@@ -43,8 +43,6 @@ export default function(cell, onRendered, success, cancel, editorParams){
 			console.error("Editor Error - 'date' editor 'format' param is dependant on luxon.js");
 		}
 	}
-
-	console.log("val", cellValue);
 	
 	input.value = cellValue;
 	

package/src/js/modules/Edit/defaults/editors.js

@@ -5,9 +5,7 @@ import range from './editors/range.js';
 import date from './editors/date.js';
 import time from './editors/time.js';
 import datetime from './editors/datetime.js';
-import select from './editors/select.js';
 import list from './editors/list.js';
-import autocomplete from './editors/autocomplete.js';
 import star from './editors/star.js';
 import progress from './editors/progress.js';
 import tickCross from './editors/tickCross.js';
@@ -20,9 +18,7 @@ export default {
 	date:date,
 	time:time,
 	datetime:datetime,
-	select:select,
 	list:list,
-	autocomplete:autocomplete,
 	star:star,
 	progress:progress,
 	tickCross:tickCross,

package/src/js/modules/Export/Export.js

@@ -3,7 +3,15 @@ import Module from '../../core/Module.js';
 import ExportRow from './ExportRow.js';
 import ExportColumn from './ExportColumn.js';
 
-class Export extends Module{
+import columnLookups from './defaults/columnLookups.js';
+import rowLookups from './defaults/rowLookups.js';
+
+export default class Export extends Module{
+
+	static moduleName = "export";
+
+	static columnLookups = columnLookups;
+	static rowLookups = rowLookups;
 	
 	constructor(table){
 		super(table);
@@ -11,6 +19,7 @@ class Export extends Module{
 		this.config = {};
 		this.cloneTableStyle = true;
 		this.colVisProp = "";
+		this.colVisPropAttach = "";
 		
 		this.registerTableOption("htmlOutputConfig", false); //html output config
 		
@@ -22,32 +31,32 @@ class Export extends Module{
 		this.registerTableFunction("getHtml", this.getHtml.bind(this));
 	}
 	
-	///////////////////////////////////
-	///////// Table Functions /////////
-	///////////////////////////////////
-	
-	
 	///////////////////////////////////
 	///////// Internal Logic //////////
 	///////////////////////////////////
 	
 	generateExportList(config, style, range, colVisProp){
+		var headers, body, columns, colLookup;
+
 		this.cloneTableStyle = style;
 		this.config = config || {};
 		this.colVisProp = colVisProp;
+		this.colVisPropAttach = this.colVisProp.charAt(0).toUpperCase() + this.colVisProp.slice(1);
+
+		colLookup = Export.columnLookups[range];
+
+		if(colLookup){
+			columns = colLookup.call(this.table);
+			columns = columns.filter(col => this.columnVisCheck(col));
+		}
+
+		headers = this.config.columnHeaders !== false ? this.headersToExportRows(this.generateColumnGroupHeaders(columns)) : [];
 
-		var headers, body;
-		
-		if (range === 'range') {
-			var columns = this.table.modules.selectRange.selectedColumns();
-			headers = this.config.columnHeaders !== false
-				? this.headersToExportRows(this.generateColumnGroupHeaders(columns))
-				: [];
-			body = this.bodyToExportRows(this.rowLookup(range), this.table.modules.selectRange.selectedColumns(true));
-		} else {
-			headers = this.config.columnHeaders !== false ? this.headersToExportRows(this.generateColumnGroupHeaders()) : [];
-			body = this.bodyToExportRows(this.rowLookup(range));
+		if(columns){
+			columns = columns.map(col => col.getComponent());
 		}
+		
+		body = this.bodyToExportRows(this.rowLookup(range), columns);
 
 		return headers.concat(body);
 	}
@@ -59,7 +68,8 @@ class Export extends Module{
 	}
 	
 	rowLookup(range){
-		var rows = [];
+		var rows = [], 
+		rowLookup;
 		
 		if(typeof range == "function"){
 			range.call(this.table).forEach((row) =>{
@@ -70,32 +80,9 @@ class Export extends Module{
 				}
 			});
 		}else{
-			switch(range){
-				case true:
-				case "visible":
-					rows = this.table.rowManager.getVisibleRows(false, true);
-					break;
-				
-				case "all":
-					rows = this.table.rowManager.rows;
-					break;
-				
-				case "selected":
-					rows = this.table.modules.selectRow.selectedRows;
-					break;
+			rowLookup = Export.rowLookups[range] || Export.rowLookups["active"];
 
-				case "range":
-					rows = this.table.modules.selectRange.selectedRows();
-					break;
-
-				case "active":
-				default:
-					if(this.table.options.pagination){
-						rows = this.table.rowManager.getDisplayRows(this.table.rowManager.displayRows.length - 2);
-					}else{
-						rows = this.table.rowManager.getDisplayRows();
-					}
-			}
+			rows = rowLookup.call(this.table);
 		}
 		
 		return Object.assign([], rows);
@@ -116,13 +103,15 @@ class Export extends Module{
 			}
 		});
 
+
+
 		return output;
 	}
 	
 	processColumnGroup(column){
 		var subGroups = column.columns,
 		maxDepth = 0,
-		title = column.definition["title" + (this.colVisProp.charAt(0).toUpperCase() + this.colVisProp.slice(1))] || column.definition.title;
+		title = column.definition["title" + (this.colVisPropAttach)] || column.definition.title;
 		
 		var groupData = {
 			title:title,
@@ -165,12 +154,20 @@ class Export extends Module{
 	
 	columnVisCheck(column){
 		var visProp = column.definition[this.colVisProp];
+
+		if(this.config.rowHeaders === false && column.isRowHeader){
+			return false;
+		}
 		
 		if(typeof visProp === "function"){
 			visProp = visProp.call(this.table, column.getComponent());
 		}
-		
-		return visProp !== false && (column.visible || (!column.visible && visProp));
+
+		if(visProp === false || visProp === true){
+			return visProp;
+		}
+
+		return column.visible && column.field;
 	}
 	
 	headersToExportRows(columns){
@@ -313,7 +310,7 @@ class Export extends Module{
 		headerEl = document.createElement("thead"),
 		bodyEl = document.createElement("tbody"),
 		styles = this.lookupTableStyles(),
-		rowFormatter = this.table.options["rowFormatter" + (this.colVisProp.charAt(0).toUpperCase() + this.colVisProp.slice(1))],
+		rowFormatter = this.table.options["rowFormatter" + (this.colVisPropAttach)],
 		setup = {};
 		
 		setup.rowFormatter = rowFormatter !== null ? rowFormatter : this.table.options.rowFormatter;
@@ -323,7 +320,7 @@ class Export extends Module{
 		}
 		
 		//assign group header formatter
-		setup.groupHeader = this.table.options["groupHeader" + (this.colVisProp.charAt(0).toUpperCase() + this.colVisProp.slice(1))];
+		setup.groupHeader = this.table.options["groupHeader" + (this.colVisPropAttach)];
 		
 		if(setup.groupHeader && !Array.isArray(setup.groupHeader)){
 			setup.groupHeader = [setup.groupHeader];
@@ -332,8 +329,7 @@ class Export extends Module{
 		table.classList.add("tabulator-print-table");
 		
 		this.mapElementStyles(this.table.columnManager.getHeadersElement(), headerEl, ["border-top", "border-left", "border-right", "border-bottom", "background-color", "color", "font-weight", "font-family", "font-size"]);
-		
-		
+
 		if(list.length > 1000){
 			console.warn("It may take a long time to render an HTML table with more than 1000 rows");
 		}
@@ -387,6 +383,7 @@ class Export extends Module{
 			
 			if(styles.firstRow){
 				styles.styleCells = styles.firstRow.getElementsByClassName("tabulator-cell");
+				styles.styleRowHeader = styles.firstRow.getElementsByClassName("tabulator-row-header")[0];
 				styles.firstCell = styles.styleCells[0];
 				styles.lastCell = styles.styleCells[styles.styleCells.length - 1];
 			}
@@ -416,9 +413,9 @@ class Export extends Module{
 					cellEl.classList.add(className);
 				});
 				
-				this.mapElementStyles(column.component.getElement(), cellEl, ["text-align", "border-top", "border-left", "border-right", "border-bottom", "background-color", "color", "font-weight", "font-family", "font-size"]);
+				this.mapElementStyles(column.component.getElement(), cellEl, ["text-align", "border-left", "border-right", "background-color", "color", "font-weight", "font-family", "font-size"]);
 				this.mapElementStyles(column.component._column.contentElement, cellEl, ["padding-top", "padding-left", "padding-right", "padding-bottom"]);
-				
+		
 				if(column.component._column.visible){
 					this.mapElementStyles(column.component.getElement(), cellEl, ["width"]);
 				}else{
@@ -427,8 +424,16 @@ class Export extends Module{
 					}
 				}
 				
-				if(column.component._column.parent){
+				if(column.component._column.parent && column.component._column.parent.isGroup){
 					this.mapElementStyles(column.component._column.parent.groupElement, cellEl, ["border-top"]);
+				}else{
+					this.mapElementStyles(column.component.getElement(), cellEl, ["border-top"]);
+				}
+				
+				if(column.component._column.isGroup){
+					this.mapElementStyles(column.component.getElement(), cellEl, ["border-bottom"]);
+				}else{
+					this.mapElementStyles(this.table.columnManager.getElement(), cellEl, ["border-bottom"]);
 				}
 				
 				rowEl.appendChild(cellEl);
@@ -493,7 +498,7 @@ class Export extends Module{
 				table =  this.table,
 				index = table.columnManager.findColumnIndex(column),
 				value = col.value,
-				cellStyle;
+				cellStyle, styleProps;
 				
 				var cellWrapper = {
 					modules:{},
@@ -552,11 +557,18 @@ class Export extends Module{
 				}else{
 					cellEl.innerHTML = value;
 				}
-				
-				cellStyle = styles.styleCells && styles.styleCells[index] ? styles.styleCells[index] : styles.firstCell;
+
+				styleProps = ["padding-top", "padding-left", "padding-right", "padding-bottom", "border-top", "border-left", "border-right", "border-bottom", "color", "font-weight", "font-family", "font-size", "text-align"];
+
+				if(column.isRowHeader){
+					cellStyle = styles.styleRowHeader;
+					styleProps.push("background-color");
+				}else{
+					cellStyle = styles.styleCells && styles.styleCells[index] ? styles.styleCells[index] : styles.firstCell;
+				}
 				
 				if(cellStyle){
-					this.mapElementStyles(cellStyle, cellEl, ["padding-top", "padding-left", "padding-right", "padding-bottom", "border-top", "border-left", "border-right", "border-bottom", "color", "font-weight", "font-family", "font-size", "text-align"]);
+					this.mapElementStyles(cellStyle, cellEl, styleProps);
 					
 					if(column.definition.align){
 						cellEl.style.textAlign = column.definition.align;
@@ -630,7 +642,7 @@ class Export extends Module{
 			
 			if(window.getComputedStyle){
 				var fromStyle = window.getComputedStyle(from);
-				
+
 				props.forEach(function(prop){
 					if(!to.style[lookup[prop]]){
 						to.style[lookup[prop]] = fromStyle.getPropertyValue(prop);
@@ -640,7 +652,3 @@ class Export extends Module{
 		}
 	}
 }
-
-Export.moduleName = "export";
-
-export default Export;

package/src/js/modules/Export/ExportColumn.js

@@ -1,4 +1,4 @@
-class ExportColumn{
+export default class ExportColumn{
 	constructor(value, component, width, height, depth){
 		this.value = value;
 		this.component = component || false;
@@ -6,6 +6,4 @@ class ExportColumn{
 		this.height = height;
 		this.depth = depth;
 	}
-}
-
-export default ExportColumn;
+}