tabulator-tables 5.4.4 → 5.5.0

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

@@ -18,7 +18,7 @@ export default class Edit{
 		
 		this.initialValues = null; 
 		
-		this.isFilter = !cell._getSelf;
+		this.isFilter = cell.getType() === "header";
 		
 		this.filterTimeout = null;
 		this.filtered = false;
@@ -84,7 +84,7 @@ export default class Edit{
 		function clickStop(e){
 			e.stopPropagation();
 		}	
-	
+		
 		if(!this.isFilter){
 			this.input.style.height = "100%";
 			this.input.focus({preventScroll: true});
@@ -308,6 +308,7 @@ export default class Edit{
 				break;
 			
 			case 9: //tab
+				this._keyTab(e);
 				break;
 			
 			default:
@@ -354,6 +355,16 @@ export default class Edit{
 	//////// Keyboard Navigation /////////
 	//////////////////////////////////////
 	
+	_keyTab(e){
+		if(this.params.autocomplete && this.lastAction === "typing"){
+			this._resolveValue(true);
+		}else{
+			if(this.focusedItem){
+				this._chooseItem(this.focusedItem, true);
+			}
+		}
+	}
+	
 	_keyUp(e){
 		var index = this.displayItems.indexOf(this.focusedItem);
 		
@@ -991,7 +1002,7 @@ export default class Edit{
 	
 	_resolveValue(blur){
 		var output, initialValue;
-
+		
 		if(this.popup){
 			this.popup.hide(true);
 		}

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

@@ -59,7 +59,7 @@ export default function(cell, onRendered, success, cancel, editorParams){
 	input.value = cellValue;
 	
 	onRendered(function(){
-		if(cell._getSelf){
+		if(cell.getType() === "cell"){
 			input.focus({preventScroll: true});
 			input.style.height = "100%";
 			

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

@@ -46,7 +46,7 @@ export default function(cell, onRendered, success, cancel, editorParams){
 	input.value = cellValue;
 	
 	onRendered(function(){
-		if(cell._getSelf){
+		if(cell.getType() === "cell"){
 			input.focus({preventScroll: true});
 			input.style.height = "100%";
 			

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

@@ -26,7 +26,7 @@ export default function(cell, onRendered, success, cancel, editorParams){
 	input.value = typeof cellValue !== "undefined" ? cellValue : "";
 
 	onRendered(function(){
-		if(cell._getSelf){
+		if(cell.getType() === "cell"){
 			input.focus({preventScroll: true});
 			input.style.height = "100%";
 

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

@@ -43,7 +43,7 @@ export default function(cell, onRendered, success, cancel, editorParams){
 	};
 
 	onRendered(function () {
-		if(cell._getSelf){
+		if(cell.getType() === "cell"){
 			//submit new value on blur
 			input.removeEventListener("blur", blurFunc);
 

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

@@ -36,7 +36,7 @@ export default function(cell, onRendered, success, cancel, editorParams){
 	input.value = cellValue;
 	
 	onRendered(function () {
-		if(cell._getSelf){
+		if(cell.getType() === "cell"){
 			input.focus({preventScroll: true});
 			input.style.height = "100%";
 		}

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

@@ -31,7 +31,7 @@ export default function(cell, onRendered, success, cancel, editorParams){
 	input.value = value;
 
 	onRendered(function(){
-		if(cell._getSelf){
+		if(cell.getType() === "cell"){
 			input.focus({preventScroll: true});
 			input.style.height = "100%";
 

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

@@ -32,7 +32,7 @@ export default function(cell, onRendered, success, cancel, editorParams){
 	
 	if(this.table.browser != "firefox" && this.table.browser != "safari"){ //prevent blur issue on mac firefox
 		onRendered(function(){
-			if(cell._getSelf){
+			if(cell.getType() === "cell"){
 				input.focus({preventScroll: true});
 			}
 		});

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

@@ -47,7 +47,7 @@ export default function(cell, onRendered, success, cancel, editorParams){
 	input.value = cellValue;
 	
 	onRendered(function(){
-		if(cell._getSelf){
+		if(cell.getType() == "cell"){
 			input.focus({preventScroll: true});
 			input.style.height = "100%";
 			

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

@@ -489,6 +489,9 @@ class Export extends Module{
 					getElement:function(){
 						return cellEl;
 					},
+					getType:function(){
+						return "cell";
+					},
 					getColumn:function(){
 						return column.getComponent();
 					},

package/src/js/modules/Filter/Filter.js

@@ -22,6 +22,7 @@ class Filter extends Module{
 		this.registerTableOption("initialFilter", false); //initial filtering criteria
 		this.registerTableOption("initialHeaderFilter", false); //initial header filtering criteria
 		this.registerTableOption("headerFilterLiveFilterDelay", 300); //delay before updating column after user types in header filter
+		this.registerTableOption("placeholderHeaderFilter", false); //placeholder when header filter is empty
 
 		this.registerColumnOption("headerFilter");
 		this.registerColumnOption("headerFilterPlaceholder");
@@ -57,6 +58,7 @@ class Filter extends Module{
 		this.subscribe("column-width-fit-before", this.hideHeaderFilterElements.bind(this));
 		this.subscribe("column-width-fit-after", this.showHeaderFilterElements.bind(this));
 		this.subscribe("table-built", this.tableBuilt.bind(this));
+		this.subscribe("placeholder", this.generatePlaceholder.bind(this));
 
 		if(this.table.options.filterMode === "remote"){
 			this.subscribe("data-params", this.remoteFilterParams.bind(this));
@@ -92,6 +94,12 @@ class Filter extends Module{
 		return params;
 	}
 
+	generatePlaceholder(text){
+		if(this.table.options.placeholderHeaderFilter && Object.keys(this.headerFilters).length){
+			return this.table.options.placeholderHeaderFilter;
+		}
+	}
+
 	///////////////////////////////////
 	///////// Table Functions /////////
 	///////////////////////////////////
@@ -375,6 +383,9 @@ class Filter extends Module{
 					getTable:() => {
 						return this.table;
 					},
+					getType:() => {
+						return "header";
+					},
 					getRow:function(){
 						return {
 							normalizeHeight:function(){

package/src/js/modules/Format/Format.js

@@ -96,6 +96,9 @@ class Format extends Module{
 				getElement:function(){
 					return el;
 				},
+				getType:function(){
+					return "header";
+				},
 				getColumn:function(){
 					return column.getComponent();
 				},

package/src/js/modules/Format/defaults/formatters/money.js

@@ -1,7 +1,7 @@
 export default function(cell, formatterParams, onRendered){
 	var floatVal = parseFloat(cell.getValue()),
 	sign = "",
-	number, integer, decimal, rgx;
+	number, integer, decimal, rgx, value;
 
 	var decimalSym = formatterParams.decimal || ".";
 	var thousandSym = formatterParams.thousand || ",";
@@ -33,5 +33,12 @@ export default function(cell, formatterParams, onRendered){
 		}
 	}
 
-	return after ? sign + integer + decimal + symbol : sign + symbol + integer + decimal;
+	value = integer + decimal;
+	
+	if(sign === true){
+		value = "(" + value  + ")";
+		return after ? value + symbol : symbol + value;
+	}else{
+		return after ? sign + value + symbol : sign + symbol + value;
+	}
 }

package/src/js/modules/FrozenColumns/FrozenColumns.js

@@ -257,7 +257,7 @@ class FrozenColumns extends Module{
 	layoutElement(element, column){
 		var position;
 		
-		if(column.modules.frozen){
+		if(column.modules.frozen && element){
 			element.style.position = "sticky";
 
 			if(this.table.rtl){

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

@@ -55,6 +55,10 @@ class GroupComponent {
 		this._group.toggleVisibility();
 	}
 
+	scrollTo(position, ifVisible){
+		return this._group.groupManager.table.rowManager.scrollToRow(this._group, position, ifVisible);
+	}
+
 	_getSelf(){
 		return this._group;
 	}

package/src/js/modules/Interaction/Interaction.js

@@ -134,8 +134,20 @@ class Interaction extends Module{
 
 		this.subscribe("column-init", this.initializeColumn.bind(this));
 		this.subscribe("cell-dblclick", this.cellContentsSelectionFixer.bind(this));
+		this.subscribe("scroll-horizontal", this.clearTouchWatchers.bind(this));
+		this.subscribe("scroll-vertical", this.clearTouchWatchers.bind(this));
 	}
 
+	clearTouchWatchers(){
+		var types = Object.values(this.touchWatchers);
+
+		types.forEach((type) => {
+			for(let key in type){
+				type[key] = null;
+			}
+		});
+	}
+		
 	cellContentsSelectionFixer(e, cell){
 		var range;
 

package/src/js/modules/Persistence/Persistence.js

@@ -88,6 +88,7 @@ class Persistence extends Module{
 			this.config = {
 				sort:this.table.options.persistence === true || this.table.options.persistence.sort,
 				filter:this.table.options.persistence === true || this.table.options.persistence.filter,
+				headerFilter:this.table.options.persistence === true || this.table.options.persistence.headerFilter,
 				group:this.table.options.persistence === true || this.table.options.persistence.group,
 				page:this.table.options.persistence === true || this.table.options.persistence.page,
 				columns:this.table.options.persistence === true ? ["title", "width", "visible"] : this.table.options.persistence.columns,
@@ -138,6 +139,7 @@ class Persistence extends Module{
 			this.subscribe("table-redraw", this.tableRedraw.bind(this));
 
 			this.subscribe("filter-changed", this.eventSave.bind(this, "filter"));
+			this.subscribe("filter-changed", this.eventSave.bind(this, "headerFilter"));
 			this.subscribe("sort-changed", this.eventSave.bind(this, "sort"));
 			this.subscribe("group-changed", this.eventSave.bind(this, "group"));
 			this.subscribe("page-changed", this.eventSave.bind(this, "page"));
@@ -157,7 +159,7 @@ class Persistence extends Module{
 	}
 
 	tableBuilt(){
-		var sorters, filters;
+		var sorters, filters, headerFilters;
 
 		if(this.config.sort){
 			sorters = this.load("sort");
@@ -174,6 +176,14 @@ class Persistence extends Module{
 				this.table.options.initialFilter = filters;
 			}
 		}
+		if(this.config.headerFilter){
+			headerFilters = this.load("headerFilter");
+
+			if(!headerFilters === false){
+				this.table.options.initialHeaderFilter = headerFilters;
+			}
+		}
+		
 	}
 
 	tableRedraw(force){
@@ -334,6 +344,10 @@ class Persistence extends Module{
 				data = this.table.modules.filter.getFilters();
 				break;
 
+			case "headerFilter":
+				data = this.table.modules.filter.getHeaderFilters();
+				break;
+
 			case "sort":
 				data = this.validateSorters(this.table.modules.sort.getSort());
 				break;

package/src/js/modules/ResponsiveLayout/ResponsiveLayout.js

@@ -272,6 +272,9 @@ class ResponsiveLayout extends Module{
 						getData:function(){
 							return data;
 						},
+						getType:function(){
+							return "cell";
+						},
 						getElement:function(){
 							return document.createElement("div");
 						},

package/src/js/modules/SelectRow/SelectRow.js

@@ -194,7 +194,7 @@ class SelectRow extends Module{
 	}
 
 	checkRowSelectability(row){
-		if(row.type === "row"){
+		if(row && row.type === "row"){
 			return this.table.options.selectableCheck.call(this.table, row.getComponent());
 		}
 
@@ -214,48 +214,44 @@ class SelectRow extends Module{
 	
 	//select a number of rows
 	selectRows(rows){
-		var rowMatch;
+		var changes = [], 
+		rowMatch, change;
 		
 		switch(typeof rows){
 			case "undefined":
-				this.table.rowManager.rows.forEach((row) => {
-					this._selectRow(row, true, true);
-				});
-			
-				this._rowSelectionChanged();
+				rowMatch = this.table.rowManager.rows;
 				break;
 			
 			case "string":
 				rowMatch = this.table.rowManager.findRow(rows);
 			
-				if(rowMatch){
-					this._selectRow(rowMatch, true, true);
-					this._rowSelectionChanged();
-				}else{
+				if(!rowMatch){
 					rowMatch = this.table.rowManager.getRows(rows);
-					
-					rowMatch.forEach((row) => {
-						this._selectRow(row, true, true);
-					});
-
-					if(rowMatch.length){
-						this._rowSelectionChanged();
-					}
 				}
 				break;
 			
 			default:
-				if(Array.isArray(rows)){
-					rows.forEach((row) => {
-						this._selectRow(row, true, true);
-					});
-				
-					this._rowSelectionChanged();
-				}else{
-					this._selectRow(rows, false, true);
-				}
+				rowMatch = rows;
 				break;
 		}
+
+		if(Array.isArray(rowMatch)){
+			if(rowMatch.length){
+				rowMatch.forEach((row) => {
+					change = this._selectRow(row, true, true);
+
+					if(change){
+						changes.push(change);
+					}
+				});
+
+				this._rowSelectionChanged(false, changes);
+			}
+		}else{
+			if(rowMatch){
+				this._selectRow(rowMatch, false, true);
+			}
+		}	
 	}
 	
 	//select an individual row
@@ -293,7 +289,9 @@ class SelectRow extends Module{
 				
 				this.dispatchExternal("rowSelected", row.getComponent());
 				
-				this._rowSelectionChanged(silent);
+				this._rowSelectionChanged(silent, row);
+
+				return row;
 			}
 		}else{
 			if(!silent){
@@ -308,39 +306,51 @@ class SelectRow extends Module{
 	
 	//deselect a number of rows
 	deselectRows(rows, silent){
-		var self = this,
-		rowCount;
+		var changes = [], 
+		rowMatch, change;
 		
-		if(typeof rows == "undefined"){
+		switch(typeof rows){
+			case "undefined":
+				rowMatch = Object.assign([], this.selectedRows);
+				break;
 			
-			rowCount = self.selectedRows.length;
+			case "string":
+				rowMatch = this.table.rowManager.findRow(rows);
 			
-			for(let i = 0; i < rowCount; i++){
-				self._deselectRow(self.selectedRows[0], true);
-			}
+				if(!rowMatch){
+					rowMatch = this.table.rowManager.getRows(rows);
+				}
+				break;
 			
-			if(rowCount){
-				self._rowSelectionChanged(silent);
+			default:
+				rowMatch = rows;
+				break;
+		}
+
+		if(Array.isArray(rowMatch)){
+			if(rowMatch.length){
+				rowMatch.forEach((row) => {
+					change = this._deselectRow(row, true, true);
+
+					if(change){
+						changes.push(change);
+					}
+				});
+
+				this._rowSelectionChanged(silent, [], changes);
 			}
-			
 		}else{
-			if(Array.isArray(rows)){
-				rows.forEach(function(row){
-					self._deselectRow(row, true);
-				});
-				
-				self._rowSelectionChanged(silent);
-			}else{
-				self._deselectRow(rows, silent);
+			if(rowMatch){
+				this._deselectRow(rowMatch, silent, true);
 			}
-		}
+		}	
 	}
 	
 	//deselect an individual row
 	_deselectRow(rowInfo, silent){
 		var self = this,
 		row = self.table.rowManager.findRow(rowInfo),
-		index;
+		index, element;
 		
 		if(row){
 			index = self.selectedRows.findIndex(function(selectedRow){
@@ -348,8 +358,13 @@ class SelectRow extends Module{
 			});
 			
 			if(index > -1){
+
+				element = row.getElement();
+				
+				if(element){
+					element.classList.remove("tabulator-selected");
+				}
 				
-				row.getElement().classList.remove("tabulator-selected");
 				if(!row.modules.select){
 					row.modules.select = {};
 				}
@@ -366,7 +381,9 @@ class SelectRow extends Module{
 				
 				this.dispatchExternal("rowDeselected", row.getComponent());
 				
-				self._rowSelectionChanged(silent);
+				self._rowSelectionChanged(silent, undefined, row);
+
+				return row;
 			}
 		}else{
 			if(!silent){
@@ -386,7 +403,6 @@ class SelectRow extends Module{
 	}
 	
 	getSelectedRows(){
-		
 		var rows = [];
 		
 		this.selectedRows.forEach(function(row){
@@ -396,7 +412,7 @@ class SelectRow extends Module{
 		return rows;
 	}
 	
-	_rowSelectionChanged(silent){
+	_rowSelectionChanged(silent, selected = [], deselected = []){
 		if(this.headerCheckboxElement){
 			if(this.selectedRows.length === 0){
 				this.headerCheckboxElement.checked = false;
@@ -411,7 +427,19 @@ class SelectRow extends Module{
 		}
 		
 		if(!silent){
-			this.dispatchExternal("rowSelectionChanged", this.getSelectedData(), this.getSelectedRows());
+			if(!Array.isArray(selected)){
+				selected = [selected];
+			}
+
+			selected = selected.map(row => row.getComponent());
+
+			if(!Array.isArray(deselected)){
+				deselected = [deselected];
+			}
+
+			deselected = deselected.map(row => row.getComponent());
+
+			this.dispatchExternal("rowSelectionChanged", this.getSelectedData(), this.getSelectedRows(), selected, deselected);
 		}
 	}