Spreadsheet module

src/js/core/ColumnManager.js

@@ -407,6 +407,10 @@ export default class ColumnManager extends CoreFeature {
 
 		return index > -1 ? this.columnsByIndex[index] : false;
 	}
+
+	getVisibleColumnsByIndex() {
+		return this.columnsByIndex.filter((col) => col.visible);
+	}
 
 	getColumns(){
 		return this.columns;

src/js/core/TabulatorFull.js

@@ -8,4 +8,4 @@ class TabulatorFull extends Tabulator {}
 //bind modules and static functionality
 new ModuleBinder(TabulatorFull, modules);
 
-export default TabulatorFull;
+export default TabulatorFull;

src/js/core/column/Column.js

@@ -942,6 +942,10 @@ class Column extends CoreFeature{
 
 		return this.component;
 	}
+
+	get position() {
+		return this.table.columnManager.getVisibleColumnsByIndex().indexOf(this) + 1;
+	}
 }
 
 Column.defaultOptionList = defaultOptions;

src/js/core/modules/optional.js

@@ -31,5 +31,6 @@ export {default as ResizeTableModule} from '../../modules/ResizeTable/ResizeTabl
 export {default as ResponsiveLayoutModule} from '../../modules/ResponsiveLayout/ResponsiveLayout.js';
 export {default as SelectRowModule} from '../../modules/SelectRow/SelectRow.js';
 export {default as SortModule} from '../../modules/Sort/Sort.js';
+export {default as SpreadsheetModule} from '../../modules/Spreadsheet/Spreadsheet.js';
 export {default as TooltipModule} from '../../modules/Tooltip/Tooltip.js';
-export {default as ValidateModule} from '../../modules/Validate/Validate.js';
+export {default as ValidateModule} from '../../modules/Validate/Validate.js';

src/js/core/rendering/renderers/VirtualDomHorizontal.js

@@ -580,4 +580,4 @@ export default class VirtualDomHorizontal extends Renderer{
 			}
 		}
 	}
-}
+}

src/js/core/tools/Helpers.js

@@ -44,4 +44,18 @@ export default class Helpers{
 
 		return clone;
 	}
-}
+
+	static debounce(func, delay = 0) {
+		var timeoutId;
+
+		return function (...args) {
+			const context = this;
+
+			clearTimeout(timeoutId);
+
+			timeoutId = setTimeout(() => {
+				func.apply(context, args);
+			}, delay);
+		};
+	}
+}

src/js/core/tools/InteractionMonitor.js

@@ -226,11 +226,11 @@ export default class InteractionManager extends CoreFeature {
 				}
 			}
 		}
-		
+
 		if(targets.group && targets.group === targets.row){
 			delete targets.row;
 		}
-		
+
 		return targets;
 	}
 
@@ -319,4 +319,4 @@ export default class InteractionManager extends CoreFeature {
 			}
 		}
 	}
-}
+}

src/js/modules/Edit/Edit.js

@@ -13,6 +13,7 @@ class Edit extends Module{
 		this.recursionBlock = false; //prevent focus recursion
 		this.invalidEdit = false;
 		this.editedCells = [];
+		this.elementToFocusOnBlur = false;
 
 		this.editors = Edit.editors;
 
@@ -55,13 +56,16 @@ class Edit extends Module{
 		this.subscribe("row-deleting", this.rowDeleteCheck.bind(this));
 		this.subscribe("row-layout", this.rowEditableCheck.bind(this));
 		this.subscribe("data-refreshing", this.cancelEdit.bind(this));
-
-		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 (!this.table.options.spreadsheet) {
+			this.subscribe("keybinding-nav-prev", this.navigatePrev.bind(this, undefined));
+			this.subscribe("keybinding-nav-next", this.keybindingNavigateNext.bind(this));
+			// FIXME this doesn't respect input navigations when editing
+			// 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));
+		}
 	}
 
 
@@ -677,26 +681,34 @@ class Edit extends Module{
 						}
 					}else{
 						console.warn("Edit Error - Editor should return an instance of Node, the editor returned:", cellEditor);
-						element.blur();
+						this.blur(cell);
 						return false;
 					}
 				}else{
-					element.blur();
+					this.blur(cell);
 					return false;
 				}
 
 				return true;
 			}else{
 				this.mouseClick = false;
-				element.blur();
+				this.blur(cell);
 				return false;
 			}
 		}else{
 			this.mouseClick = false;
-			element.blur();
+			this.blur(cell);
 			return false;
 		}
 	}
+
+	blur(cell) {
+		if (this.elementToFocusOnBlur) {
+			this.elementToFocusOnBlur.focus();
+		} else {
+			cell.getElement().blur();
+		}
+	}
 
 	getEditedCells(){
 		var output = [];

src/js/modules/Export/Export.js

@@ -35,10 +35,20 @@ class Export extends Module{
 		this.cloneTableStyle = style;
 		this.config = config || {};
 		this.colVisProp = colVisProp;
-
-		var headers = this.config.columnHeaders !== false ? this.headersToExportRows(this.generateColumnGroupHeaders()) : [];
-		var body = this.bodyToExportRows(this.rowLookup(range));
-
+
+		var headers, body;
+
+		if (range === 'spreadsheet') {
+			var columns = this.table.modules.spreadsheet.selectedColumns;
+			headers = this.config.columnHeaders !== false
+				? this.headersToExportRows(this.generateColumnGroupHeaders(columns.map((component) => component._column)))
+				: [];
+			body = this.bodyToExportRows(this.rowLookup(range), columns);
+		} else {
+			headers = this.config.columnHeaders !== false ? this.headersToExportRows(this.generateColumnGroupHeaders()) : [];
+			body = this.bodyToExportRows(this.rowLookup(range));
+		}
+
 		return headers.concat(body);
 	}
 
@@ -73,7 +83,11 @@ class Export extends Module{
 				case "selected":
 					rows = this.table.modules.selectRow.selectedRows;
 					break;
-
+
+				case "spreadsheet":
+					rows = this.table.modules.spreadsheet.selectedRows;
+					break;
+
 				case "active":
 				default:
 					if(this.table.options.pagination){
@@ -87,10 +101,12 @@ class Export extends Module{
 		return Object.assign([], rows);
 	}
 
-	generateColumnGroupHeaders(){
+	generateColumnGroupHeaders(columns){
 		var output = [];
 
-		var columns = this.config.columnGroups !== false ? this.table.columnManager.columns : this.table.columnManager.columnsByIndex;
+		if (!columns) {
+			columns = this.config.columnGroups !== false ? this.table.columnManager.columns : this.table.columnManager.columnsByIndex;
+		}
 
 		columns.forEach((column) => {
 			var colData = this.processColumnGroup(column);
@@ -99,7 +115,7 @@ class Export extends Module{
 				output.push(colData);
 			}
 		});
-		
+
 		return output;
 	}
 
@@ -227,16 +243,16 @@ class Export extends Module{
 		return exportRows;
 	}
 
-	bodyToExportRows(rows){
-
-		var columns = [];
+	bodyToExportRows(rows, columns = []){
 		var exportRows = [];
 
-		this.table.columnManager.columnsByIndex.forEach((column) => {
-			if (this.columnVisCheck(column)) {
-				columns.push(column.getComponent());
-			}
-		});
+		if (columns.length === 0) {
+			this.table.columnManager.columnsByIndex.forEach((column) => {
+				if (this.columnVisCheck(column)) {
+					columns.push(column.getComponent());
+				}
+			});
+		}
 
 		if(this.config.columnCalcs !== false && this.table.modExists("columnCalcs")){
 			if(this.table.modules.columnCalcs.topInitialized){

src/js/modules/Format/defaults/formatters/rownum.js

@@ -1,10 +1,14 @@
 export default function(cell, formatterParams, onRendered){
 	var content = document.createElement("span");
 	var row = cell.getRow();
+	var table = cell.getTable();
 
 	row.watchPosition((position) => {
+		if (formatterParams.relativeToPage) {
+			position += table.modules.page.getPageSize() * (table.modules.page.getPage() - 1);
+		}
 		content.innerText = position;
 	});
 
 	return content;
-}
+}

src/js/modules/Keybindings/defaults/actions.js

@@ -83,6 +83,79 @@ export default {
 		this.dispatch("keybinding-nav-down", e);
 	},
 
+	spreadsheetJumpLeft: function(e){
+		if (!this.table.options.spreadsheet) return;
+		if (this.table.modules.spreadsheet.navigate("jump", "left")) {
+			e.preventDefault();
+		}
+	},
+	spreadsheetJumpRight: function(e){
+		if (!this.table.options.spreadsheet) return;
+		if (this.table.modules.spreadsheet.navigate("jump", "right")) {
+			e.preventDefault();
+		}
+	},
+	spreadsheetJumpUp: function(e){
+		if (!this.table.options.spreadsheet) return;
+		if (this.table.modules.spreadsheet.navigate("jump", "up")) {
+			e.preventDefault();
+		}
+	},
+	spreadsheetJumpDown: function(e){
+		if (!this.table.options.spreadsheet) return;
+		if (this.table.modules.spreadsheet.navigate("jump", "down")) {
+			e.preventDefault();
+		}
+	},
+	spreadsheetExpandLeft: function(e){
+		if (!this.table.options.spreadsheet) return;
+		if (this.table.modules.spreadsheet.navigate("expand", "left")) {
+			e.preventDefault();
+		}
+	},
+	spreadsheetExpandRight: function(e){
+		if (!this.table.options.spreadsheet) return;
+		if (this.table.modules.spreadsheet.navigate("expand", "right")) {
+			e.preventDefault();
+		}
+	},
+	spreadsheetExpandUp: function(e){
+		if (!this.table.options.spreadsheet) return;
+		if (this.table.modules.spreadsheet.navigate("expand", "up")) {
+			e.preventDefault();
+		}
+	},
+	spreadsheetExpandDown: function(e){
+		if (!this.table.options.spreadsheet) return;
+		if (this.table.modules.spreadsheet.navigate("expand", "down")) {
+			e.preventDefault();
+		}
+	},
+	spreadsheetExpandJumpLeft: function(e){
+		if (!this.table.options.spreadsheet) return;
+		if (this.table.modules.spreadsheet.navigate("expand-jump", "left")) {
+			e.preventDefault();
+		}
+	},
+	spreadsheetExpandJumpRight: function(e){
+		if (!this.table.options.spreadsheet) return;
+		if (this.table.modules.spreadsheet.navigate("expand-jump", "right")) {
+			e.preventDefault();
+		}
+	},
+	spreadsheetExpandJumpUp: function(e){
+		if (!this.table.options.spreadsheet) return;
+		if (this.table.modules.spreadsheet.navigate("expand-jump", "up")) {
+			e.preventDefault();
+		}
+	},
+	spreadsheetExpandJumpDown: function(e){
+		if (!this.table.options.spreadsheet) return;
+		if (this.table.modules.spreadsheet.navigate("expand-jump", "down")) {
+			e.preventDefault();
+		}
+	},
+
 	undo:function(e){
 		var cell = false;
 		if(this.table.options.history && this.table.modExists("history") && this.table.modExists("edit")){
@@ -116,4 +189,4 @@ export default {
 			}
 		}
 	},
-};
+};

src/js/modules/Keybindings/defaults/bindings.js

@@ -3,11 +3,26 @@ export default {
 	navNext:9,
 	navUp:38,
 	navDown:40,
+	navLeft:37,
+	navRight:39,
 	scrollPageUp:33,
 	scrollPageDown:34,
 	scrollToStart:36,
 	scrollToEnd:35,
 	undo:["ctrl + 90", "meta + 90"],
 	redo:["ctrl + 89", "meta + 89"],
 	copyToClipboard:["ctrl + 67", "meta + 67"],
-};
+
+	spreadsheetJumpUp:["ctrl + 38", "meta + 38"],
+	spreadsheetJumpDown:["ctrl + 40", "meta + 40"],
+	spreadsheetJumpLeft:["ctrl + 37", "meta + 37"],
+	spreadsheetJumpRight:["ctrl + 39", "meta + 39"],
+	spreadsheetExpandUp:"shift + 38",
+	spreadsheetExpandDown:"shift + 40",
+	spreadsheetExpandLeft:"shift + 37",
+	spreadsheetExpandRight:"shift + 39",
+	spreadsheetExpandJumpUp:["ctrl + shift + 38", "meta + shift + 38"],
+	spreadsheetExpandJumpDown:["ctrl + shift + 40", "meta + shift + 40"],
+	spreadsheetExpandJumpLeft:["ctrl + shift + 37", "meta + shift + 37"],
+	spreadsheetExpandJumpRight:["ctrl + shift + 39", "meta + shift + 39"],
+};