tabulator-tables - npm Package Compare versions

Comparing version 6.2.5 to 6.3.0

bower.json

 {
   "name": "tabulator",
   "main": "dist/js/tabulator.js",
-  "version": "6.2.5",
+  "version": "6.3.0",
   "description": "Interactive table generation JavaScript library",
@@ -6,0 +6,0 @@ "keywords": [

package.json

 {
   "name": "tabulator-tables",
-  "version": "6.2.5",
+  "version": "6.3.0",
   "description": "Interactive table generation JavaScript library",
@@ -5,0 +5,0 @@ "style": "dist/css/tabulator.css",

src/js/core/defaults/options.js

@@ -62,6 +62,6 @@ export default {
 	dataLoaderErrorTimeout:3000,
-
 	dataSendParams:{},
+	dataReceiveParams:{},
 
-	dataReceiveParams:{},
+	dependencies:{},
 };

src/js/core/row/Row.js

@@ -166,4 +166,6 @@ import CoreFeature from '../CoreFeature.js';
 		var maxHeight = 0;
+
 		this.cells.forEach(function(cell){
 			var height = cell.getHeight();
+
 			if(height > maxHeight){
@@ -173,2 +175,3 @@ maxHeight = height;
 		});
+
 		return maxHeight;
@@ -175,0 +178,0 @@ }

src/js/core/RowManager.js

@@ -1033,5 +1033,5 @@ import CoreFeature from './CoreFeature.js';
 	//normalize height of active rows
-	normalizeHeight(){
+	normalizeHeight(force){
 		this.activeRows.forEach(function(row){
-			row.normalizeHeight();
+			row.normalizeHeight(force);
 		});
@@ -1038,0 +1038,0 @@ }

src/js/core/Tabulator.js

@@ -17,2 +17,3 @@ 'use strict';
 import DeprecationAdvisor from './tools/DeprecationAdvisor.js';
+import DependencyRegistry from './tools/DependencyRegistry.js';
 
@@ -70,2 +71,4 @@ import ModuleBinder from './tools/ModuleBinder.js';
 		this.optionsList = new OptionsList(this, "table constructor");
+
+		this.dependencyRegistry = new DependencyRegistry(this);
 		
@@ -128,5 +131,5 @@ this.initialized = false;
 		this.dataLoader.initialize();
-		// this.columnManager.initialize();
-		// this.rowManager.initialize();
 		this.footerManager.initialize();
+
+		this.dependencyRegistry.initialize();
 	}
@@ -133,0 +136,0 @@

src/js/modules/ColumnCalcs/ColumnCalcs.js

@@ -460,3 +460,3 @@ import Module from '../../core/Module.js';
 					this.genColumn.modules.format = {
-						formatter: this.table.modules.format.getFormatter(column.definition[pos + "CalcFormatter"]),
+						formatter: this.table.modules.format.lookupFormatter(column.definition[pos + "CalcFormatter"]),
 						params: column.definition[pos + "CalcFormatterParams"] || {},
@@ -466,3 +466,3 @@ };
 					this.genColumn.modules.format = {
-						formatter: this.table.modules.format.getFormatter("plaintext"),
+						formatter: this.table.modules.format.lookupFormatter("plaintext"),
 						params:{}
@@ -469,0 +469,0 @@ };

src/js/modules/Download/defaults/downloaders/pdf.js

@@ -18,3 +18,4 @@ export default function(list, options = {}, setFileContents){
 	jsPDFParams = options.jsPDF || {},
-	title = options.title ? options.title : "";
+	title = options.title ? options.title : "",
+	jspdfLib, doc;
 
@@ -86,3 +87,4 @@ if(!jsPDFParams.orientation){
 	//configure PDF
-	var doc = new jspdf.jsPDF(jsPDFParams); //set document to landscape, better for most tables
+	jspdfLib = this.dependencyRegistry.lookup("jspdf", "jsPDF");
+	doc = new jspdfLib(jsPDFParams); //set document to landscape, better for most tables
 
@@ -89,0 +91,0 @@ if(options.autoTable){

src/js/modules/Download/defaults/downloaders/xlsx.js

@@ -6,3 +6,4 @@ import CoreFeature from '../../../../core/CoreFeature.js';
 	sheetName = options.sheetName || "Sheet1",
-	workbook = XLSX.utils.book_new(),
+	XLSXLib = this.dependencyRegistry.lookup("XLSX"),
+	workbook = XLSXLib.utils.book_new(),
 	tableFeatures = new CoreFeature(this),
@@ -47,5 +48,5 @@ compression =  'compress' in options ? options.compress : true,
 		//convert rows to worksheet
-		XLSX.utils.sheet_add_aoa(worksheet, rows);
+		XLSXLib.utils.sheet_add_aoa(worksheet, rows);
 
-		worksheet['!ref'] = XLSX.utils.encode_range(range);
+		worksheet['!ref'] = XLSXLib.utils.encode_range(range);
 
@@ -101,5 +102,5 @@ if(merges.length){
 
-	output = XLSX.write(workbook, writeOptions);
+	output = XLSXLib.write(workbook, writeOptions);
 
 	setFileContents(s2ab(output), "application/octet-stream");
 }

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

@@ -12,2 +12,3 @@ import input from './editors/input.js';
 import tickCross from './editors/tickCross.js';
+import adaptable from './editors/adaptable.js';
 
@@ -26,2 +27,3 @@ export default {
 	tickCross:tickCross,
+	adaptable:adaptable,
 };

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

@@ -5,3 +5,3 @@ //input element
 	vertNav = editorParams.verticalNavigation || "editor",
-	DT = inputFormat ? (window.DateTime || luxon.DateTime) : null, 
+	DT = inputFormat ? (this.table.dependencyRegistry.lookup(["luxon", "DateTime"], "DateTime")) : null, 
 	newDatetime;
@@ -8,0 +8,0 @@

src/js/modules/Edit/Edit.js

@@ -407,8 +407,18 @@ import Module from '../../core/Module.js';
 		//set column editor
-		switch(typeof column.definition.editor){
+		config.editor = this.lookupEditor(column.definition.editor, column);
+		
+		if(config.editor){
+			column.modules.edit = config;
+		}
+	}
+
+	lookupEditor(editor, column){
+		var editorFunc;
+
+		switch(typeof editor){
 			case "string":
-				if(this.editors[column.definition.editor]){
-					config.editor = this.editors[column.definition.editor];
+				if(this.editors[editor]){
+					editorFunc = this.editors[editor];
 				}else{
-					console.warn("Editor Error - No such editor found: ", column.definition.editor);
+					console.warn("Editor Error - No such editor found: ", editor);
 				}
@@ -418,12 +428,12 @@ break;
 			case "function":
-				config.editor = column.definition.editor;
+				editorFunc = editor;
 				break;
 			
 			case "boolean":
-				if(column.definition.editor === true){
+				if(editor === true){
 					if(typeof column.definition.formatter !== "function"){
 						if(this.editors[column.definition.formatter]){
-							config.editor = this.editors[column.definition.formatter];
+							editorFunc = this.editors[column.definition.formatter];
 						}else{
-							config.editor = this.editors["input"];
+							editorFunc = this.editors["input"];
 						}
@@ -436,6 +446,4 @@ }else{
 		}
-		
-		if(config.editor){
-			column.modules.edit = config;
-		}
+
+		return editorFunc;
 	}
@@ -442,0 +450,0 @@

src/js/modules/Edit/List.js

@@ -604,4 +604,13 @@ import maskInput from './inputMask.js';
 				
-				if(val !== null && typeof val !== "undefined" && val !== ""){
-					output[val] = true;
+				if(!this._emptyValueCheck(val)){
+					if(this.params.multiselect && Array.isArray(val)){
+						val.forEach((item) => {
+							if(!this._emptyValueCheck(item)){
+								output[item] = true;
+							}
+						});
+					}else{
+						output[val] = true;
+					}
+					
 				}
@@ -616,4 +625,7 @@ });
 	}
+
+	_emptyValueCheck(value){
+		return value === null || typeof value === "undefined" || value === "";
+	}
 	
-	
 	_parseList(inputValues){
@@ -620,0 +632,0 @@ var data = [];

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

@@ -20,2 +20,5 @@ import plaintext from './formatters/plaintext.js';
 import handle from './formatters/handle.js';
+import adaptable from './formatters/adaptable.js';
+import array from './formatters/array.js';
+import json from './formatters/json.js';
 
@@ -42,2 +45,5 @@ export default {
 	handle:handle,
+	adaptable:adaptable,
+	array:array,
+	json:json,
 };

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

 export default function(cell, formatterParams, onRendered){
-	var DT = window.DateTime || luxon.DateTime;
+	var DT = this.table.dependencyRegistry.lookup(["luxon", "DateTime"], "DateTime");
 	var inputFormat = formatterParams.inputFormat || "yyyy-MM-dd HH:mm:ss";
@@ -4,0 +4,0 @@ var	outputFormat = formatterParams.outputFormat || "dd/MM/yyyy HH:mm:ss";

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

 export default function (cell, formatterParams, onRendered) {
-	var DT = window.DateTime || luxon.DateTime;
+	var DT = this.table.dependencyRegistry.lookup(["luxon", "DateTime"], "DateTime");
 	var inputFormat = formatterParams.inputFormat || "yyyy-MM-dd HH:mm:ss";
@@ -4,0 +4,0 @@ var invalid = typeof formatterParams.invalidPlaceholder !== "undefined" ? formatterParams.invalidPlaceholder : "";

src/js/modules/Format/Format.js

@@ -6,5 +6,5 @@ import Module from '../../core/Module.js';
 export default class Format extends Module{
-
+	
 	static moduleName = "format";
-
+	
 	//load defaults
@@ -38,21 +38,30 @@ static formatters = defaultFormatters;
 	initializeColumn(column){
-		column.modules.format = this.lookupFormatter(column, "");
+		column.modules.format = this.lookupTypeFormatter(column, "");
 		
 		if(typeof column.definition.formatterPrint !== "undefined"){
-			column.modules.format.print = this.lookupFormatter(column, "Print");
+			column.modules.format.print = this.lookupTypeFormatter(column, "Print");
 		}
 		
 		if(typeof column.definition.formatterClipboard !== "undefined"){
-			column.modules.format.clipboard = this.lookupFormatter(column, "Clipboard");
+			column.modules.format.clipboard = this.lookupTypeFormatter(column, "Clipboard");
 		}
 		
 		if(typeof column.definition.formatterHtmlOutput !== "undefined"){
-			column.modules.format.htmlOutput = this.lookupFormatter(column, "HtmlOutput");
+			column.modules.format.htmlOutput = this.lookupTypeFormatter(column, "HtmlOutput");
 		}
 	}
 	
-	lookupFormatter(column, type){
+	lookupTypeFormatter(column, type){
 		var config = {params:column.definition["formatter" + type + "Params"] || {}},
 		formatter = column.definition["formatter" + type];
 		
+		config.formatter = this.lookupFormatter(formatter);
+		
+		return config;
+	}
+	
+	
+	lookupFormatter(formatter){
+		var formatterFunc;
+
 		//set column formatter
@@ -62,6 +71,6 @@ switch(typeof formatter){
 				if(Format.formatters[formatter]){
-					config.formatter = Format.formatters[formatter];
+					formatterFunc = Format.formatters[formatter];
 				}else{
 					console.warn("Formatter Error - No such formatter found: ", formatter);
-					config.formatter = Format.formatters.plaintext;
+					formatterFunc = Format.formatters.plaintext;
 				}
@@ -71,11 +80,11 @@ break;
 			case "function":
-				config.formatter = formatter;
+				formatterFunc = formatter;
 				break;
 			
 			default:
-				config.formatter = Format.formatters.plaintext;
+				formatterFunc = Format.formatters.plaintext;
 				break;
 		}
 		
-		return config;
+		return formatterFunc;
 	}
@@ -95,3 +104,3 @@
 		if(column.definition.titleFormatter){
-			formatter = this.getFormatter(column.definition.titleFormatter);
+			formatter = this.lookupFormatter(column.definition.titleFormatter);
 			
@@ -196,25 +205,2 @@ onRendered = (callback) => {
 	
-	//get formatter for cell
-	getFormatter(formatter){
-		switch(typeof formatter){
-			case "string":
-				if(Format.formatters[formatter]){
-					formatter = Format.formatters[formatter];
-				}else{
-					console.warn("Formatter Error - No such formatter found: ", formatter);
-					formatter = Format.formatters.plaintext;
-				}
-				break;
-			
-			case "function":
-			//Custom formatter Function, do nothing
-				break;
-			
-			default:
-				formatter = Format.formatters.plaintext;
-				break;
-		}
-		
-		return formatter;
-	}
 }

src/js/modules/Import/defaults/importers/xlsx.js

@@ -1,6 +0,7 @@
-export default function(input, floop){
-	var workbook2 = XLSX.read(input);
-	var sheet = workbook2.Sheets[workbook2.SheetNames[0]];
+export default function(input){
+	var XLSXLib = this.dependencyRegistry.lookup("XLSX"),
+	workbook2 = XLSXLib.read(input),
+	sheet = workbook2.Sheets[workbook2.SheetNames[0]];
 	
-	return XLSX.utils.sheet_to_json(sheet, {});
+	return XLSXLib.utils.sheet_to_json(sheet, {header: 1 });
 }

src/js/modules/Import/Import.js

@@ -6,18 +6,22 @@ import Module from '../../core/Module.js';
 export default class Import extends Module{
-
+	
 	static moduleName = "import";
-
+	
 	//load defaults
 	static importers = defaultImporters;
-    
+	
 	constructor(table){
 		super(table);
-        
+		
 		this.registerTableOption("importFormat");
 		this.registerTableOption("importReader", "text");
+		this.registerTableOption("importHeaderTransform");
+		this.registerTableOption("importValueTransform");
+		this.registerTableOption("importDataValidator");
+		this.registerTableOption("importFileValidator");
 	}
-    
+	
 	initialize(){
 		this.registerTableFunction("import", this.importFromFile.bind(this));
-
+		
 		if(this.table.options.importFormat){
@@ -28,7 +32,7 @@ this.subscribe("data-loading", this.loadDataCheck.bind(this), 10);
 	}
-
+	
 	loadDataCheck(data){
 		return this.table.options.importFormat && (typeof data === "string" || (Array.isArray(data) && data.length && Array.isArray(data)));
 	}
-
+	
 	loadData(data, params, config, silent, previousData){
@@ -42,10 +46,10 @@ return this.importData(this.lookupImporter(), data)
 	}
-
+	
 	lookupImporter(importFormat){
 		var importer;
-        
+		
 		if(!importFormat){
 			importFormat = this.table.options.importFormat;
 		}
-        
+		
 		if(typeof importFormat === "string"){
@@ -56,13 +60,13 @@ importer = Import.importers[importFormat];
 		}
-
+		
 		if(!importer){
 			console.error("Import Error - Importer not found:", importFormat);
 		}
-        
+		
 		return importer;
 	}
-    
+	
 	importFromFile(importFormat, extension, importReader){
 		var importer = this.lookupImporter(importFormat);
-        
+		
 		if(importer){
@@ -72,2 +76,4 @@ return this.pickFile(extension, importReader)
 				.then(this.structureData.bind(this))
+				.then(this.mutateData.bind(this))
+				.then(this.validateData.bind(this))
 				.then(this.setData.bind(this))
@@ -77,4 +83,11 @@ .catch((err) => {
 					this.dispatchExternal("importError", err);
+					
+					console.error("Import Error:", err || "Unable to import file");
+					
+					this.table.dataLoader.alertError();
 
-					console.error("Import Error:", err || "Unable to import file");
+					setTimeout(() => {
+						this.table.dataLoader.clearAlert();
+					}, 3000);
+					
 					return Promise.reject(err);
@@ -84,3 +97,3 @@ });
 	}
-    
+	
 	pickFile(extensions, importReader){
@@ -91,36 +104,42 @@ return new Promise((resolve, reject) => {
 			input.accept = extensions;
-            
+			
 			input.addEventListener("change", (e) => {
 				var file = input.files[0],
-				reader = new FileReader();
+				reader = new FileReader(),
+				valid = this.validateFile(file);
 
-				this.dispatch("import-importing", input.files);
-				this.dispatchExternal("importImporting", input.files);
-                
-				switch(importReader || this.table.options.importReader){
-					case "buffer":
-						reader.readAsArrayBuffer(file);
-						break;
-
-					case "binary":
-						reader.readAsBinaryString(file);
-						break;
-
-					case "url":
-						reader.readAsDataURL(file);
-						break;
-
-					case "text":
-					default:
-						reader.readAsText(file);
+				if(valid === true){
+				
+					this.dispatch("import-importing", input.files);
+					this.dispatchExternal("importImporting", input.files);
+				
+					switch(importReader || this.table.options.importReader){
+						case "buffer":
+							reader.readAsArrayBuffer(file);
+							break;
+						
+						case "binary":
+							reader.readAsBinaryString(file);
+							break;
+						
+						case "url":
+							reader.readAsDataURL(file);
+							break;
+						
+						case "text":
+						default:
+							reader.readAsText(file);
+					}
+					
+					reader.onload = (e) => {
+						resolve(reader.result);
+					};
+					
+					reader.onerror = (e) => {
+						console.warn("File Load Error - Unable to read file");
+						reject(e);
+					};
+				}else{
+					reject(valid);
 				}
-                  
-				reader.onload = (e) => {
-					resolve(reader.result);
-				};
-                
-				reader.onerror = (e) => {
-					console.warn("File Load Error - Unable to read file");
-					reject();
-				};
 			});
@@ -133,16 +152,24 @@
 	}
-    
+	
 	importData(importer, fileContents){
-		var data = importer.call(this.table, fileContents);
-        
-		if(data instanceof Promise){
-			return data;
-		}else{
-			return data ? Promise.resolve(data) : Promise.reject();
-		}
+		var data;
+		
+		this.table.dataLoader.alertLoader();
+		
+		return new Promise((resolve, reject) => {
+			setTimeout(() => {
+				data = importer.call(this.table, fileContents);
+				
+				if(data instanceof Promise){
+					resolve(data);
+				}else{
+					data ? resolve(data) : reject();
+				}
+			}, 10);
+		});
 	}
-
+	
 	structureData(parsedData){
 		var data = [];
-        
+		
 		if(Array.isArray(parsedData) && parsedData.length && Array.isArray(parsedData[0])){
@@ -154,3 +181,3 @@ if(this.table.options.autoColumns){
 			}
-
+			
 			return data;
@@ -161,30 +188,75 @@ }else{
 	}
+	
+	mutateData(data){
+		var output = [];
+		
+		if(Array.isArray(data)){
+			data.forEach((row) => {
+				output.push(this.table.modules.mutator.transformRow(row, "import"));
+			});
+		}else{
+			output = data;
+		}
+		
+		return output;
+	}
+	
+	transformHeader(headers){
+		var output = [];
+		
+		if(this.table.options.importHeaderTransform){
+			headers.forEach((item) => {
+				output.push(this.table.options.importHeaderTransform.call(this.table, item, headers));
+			});
+		}else{
+			return headers;
+		}
+		
+		return output;
+	}
+	
+	transformData(row){
+		var output = [];
 
+		if(this.table.options.importValueTransform){
+			row.forEach((item) => {
+				output.push(this.table.options.importValueTransform.call(this.table, item, row));
+			});
+		}else{
+			return row;
+		}
+		
+		return output;
+	}
+	
 	structureArrayToObject(parsedData){
-		var columns = parsedData.shift();
-
+		var columns = this.transformHeader(parsedData.shift());	
+		
 		var data = parsedData.map((values) => {
 			var row = {};
 
+			values = this.transformData(values);
+			
 			columns.forEach((key, i) => {
 				row[key] = values[i];
 			});
-
+			
 			return row;
 		});
-
+		
 		return data;
 	}
-
+	
 	structureArrayToColumns(parsedData){
 		var data = [],
+		firstRow = this.transformHeader(parsedData[0]),
 		columns = this.table.getColumns();
-
+		
 		//remove first row if it is the column names
-		if(columns[0] && parsedData[0][0]){
-			if(columns[0].getDefinition().title === parsedData[0][0]){
+		if(columns[0] && firstRow[0]){
+			if(columns[0].getDefinition().title === firstRow[0]){
 				parsedData.shift();
 			}
 		}
-        
+		
 		//convert row arrays to objects
@@ -194,5 +266,7 @@ parsedData.forEach((rowData) => {
 
+			rowData = this.transformData(rowData);
+			
 			rowData.forEach((value, index) => {
 				var column = columns[index];
-
+				
 				if(column){
@@ -202,9 +276,33 @@ row[column.getField()] = value;
 			});
-
+			
 			data.push(row);
 		});
+		
+		return data;
+	}
 
+	validateFile(file){
+		if(this.table.options.importFileValidator){
+			return this.table.options.importFileValidator.call(this.table, file);
+		}
+
+		return true;
+	}
+
+	validateData(data){
+		var result;
+
+		if(this.table.options.importDataValidator){
+			result = this.table.options.importDataValidator.call(this.table, data);
+
+			if(result === true){
+				return data;
+			}else{
+				return Promise.reject(result);
+			}
+		}
+
 		return data;
 	}
-    
+	
 	setData(data){
@@ -214,4 +312,6 @@ this.dispatch("import-imported", data);
 		
+		this.table.dataLoader.clearAlert();
+		
 		return this.table.setData(data);
 	}
 }

src/js/modules/Layout/Layout.js

@@ -54,6 +54,14 @@ import Module from '../../core/Module.js';
 	layout(dataChanged){
+
+		var variableHeight = this.table.columnManager.columnsByIndex.find((column) => column.definition.variableHeight || column.definition.formatter === "textarea");
+		
 		this.dispatch("layout-refreshing");
 		Layout.modes[this.mode].call(this, this.table.columnManager.columnsByIndex, dataChanged);
+
+		if(variableHeight){
+			this.table.rowManager.normalizeHeight(true);
+		}
+
 		this.dispatch("layout-refreshed");
 	}
 }

src/js/modules/Mutator/Mutator.js

@@ -15,3 +15,3 @@ import Module from '../../core/Module.js';
 
-		this.allowedTypes = ["", "data", "edit", "clipboard"]; //list of mutation types
+		this.allowedTypes = ["", "data", "edit", "clipboard", "import"]; //list of mutation types
 		this.enabled = true;
@@ -27,2 +27,4 @@
 		this.registerColumnOption("mutatorClipboardParams");
+		this.registerColumnOption("mutatorImport");
+		this.registerColumnOption("mutatorImportParams");
 		this.registerColumnOption("mutateLink");
@@ -97,2 +99,4 @@ }
 
+		// console.log("key", key)
+
 		if(this.enabled){
@@ -99,0 +103,0 @@

src/js/modules/Page/Page.js

@@ -46,2 +46,3 @@ import Module from '../../core/Module.js';
 		this.registerTableOption("paginationAddRow", "page"); //add rows on table or page
+		this.registerTableOption("paginationOutOfRange", false); //reset the current page when the last page < this.page, values: false|function|any value accepted by setPage()
 		
@@ -806,3 +807,3 @@ this.registerTableOption("progressiveLoad", false); //progressive loading
 	_parseRemoteData(data){
-		var margin;
+		var margin, paginationOutOfRange;
 		
@@ -854,2 +855,13 @@ if(typeof data.last_page === "undefined"){
 			}else{
+
+				if(this.page > this.max){
+					console.warn( "Remote Pagination Error - Server returned last page value lower than the current page" );
+
+					paginationOutOfRange = this.options('paginationOutOfRange');
+
+					if(paginationOutOfRange){
+						return this.setPage(typeof paginationOutOfRange === 'function' ? paginationOutOfRange.call(this, this.page, this.max) :	paginationOutOfRange);
+					}
+				}
+
 				// left = this.table.rowManager.scrollLeft;
@@ -856,0 +868,0 @@ this.dispatchExternal("pageLoaded",  this.getPage());

src/js/modules/SelectRange/SelectRange.js

@@ -35,2 +35,3 @@ import Module from "../../core/Module.js";
 		this.registerTableOption("selectableRangeClearCellsValue", undefined); //value for cleared active range
+		this.registerTableOption("selectableRangeAutoFocus", true); //focus on a cell after resetRanges
 		
@@ -421,3 +422,4 @@ this.registerTableFunction("getRangesData", this.getRangesData.bind(this));
 		var moved = false,
-		range, rangeEdge, nextRow, nextCol, row, column;
+		range, rangeEdge, prevRect, nextRow, nextCol, row, column,
+		rowRect, rowManagerRect, columnRect, columnManagerRect;
 		
@@ -442,2 +444,8 @@ // Don't navigate while editing
 		range = this.activeRange;
+		prevRect = {
+			top: range.top,
+			bottom: range.bottom,
+			left: range.left,
+			right: range.right
+		};
 		
@@ -490,4 +498,2 @@ rangeEdge = expand ? range.end : range.start;
 		
-		moved = nextCol !== rangeEdge.col || nextRow !== rangeEdge.row;
-		
 		if(!expand){
@@ -502,16 +508,31 @@ range.setStart(nextRow, nextCol);
 		}
-		
+
+		moved = prevRect.top !== range.top || prevRect.bottom !== range.bottom || prevRect.left !== range.left || prevRect.right !== range.right;
+
 		if (moved) {
 			row = this.getRowByRangePos(range.end.row);
 			column = this.getColumnByRangePos(range.end.col);
+			rowRect = row.getElement().getBoundingClientRect();
+			columnRect = column.getElement().getBoundingClientRect();
+			rowManagerRect = this.table.rowManager.getElement().getBoundingClientRect();
+			columnManagerRect = this.table.columnManager.getElement().getBoundingClientRect();
 			
-			if ((dir === 'left' || dir === 'right') && column.getElement().parentNode === null) {
-				column.getComponent().scrollTo(undefined, false);
-			} else if ((dir === 'up' || dir === 'down') && row.getElement().parentNode === null) {
-				row.getComponent().scrollTo(undefined, false);
-			} else {
-				// Use faster autoScroll when the elements are on the DOM
-				this.autoScroll(range, row.getElement(), column.getElement());
+			if(!(rowRect.top >= rowManagerRect.top && rowRect.bottom <= rowManagerRect.bottom)){
+				if(row.getElement().parentNode && column.getElement().parentNode){
+					// Use faster autoScroll when the elements are on the DOM
+					this.autoScroll(range, row.getElement(), column.getElement());
+				}else{
+					row.getComponent().scrollTo(undefined, false);
+				}
 			}
-			
+
+			if(!(columnRect.left >= columnManagerRect.left + this.getRowHeaderWidth() && columnRect.right <= columnManagerRect.right)){
+				if(row.getElement().parentNode && column.getElement().parentNode){
+					// Use faster autoScroll when the elements are on the DOM
+					this.autoScroll(range, row.getElement(), column.getElement());
+				}else{
+					column.getComponent().scrollTo(undefined, false);
+				}
+			}
+
 			this.layoutElement();
@@ -686,3 +707,3 @@
 		var tableHolder = this.table.rowManager.element,
-		rowHeader, rect, view, withinHorizontalView, withinVerticalView;
+		rect, view, withinHorizontalView, withinVerticalView;
 		
@@ -697,6 +718,2 @@ if (typeof row === 'undefined') {
 		
-		if (this.rowHeader) {
-			rowHeader = this.rowHeader.getElement();
-		}
-		
 		rect = {
@@ -710,3 +727,3 @@ left: column.offsetLeft,
 		view = {
-			left: tableHolder.scrollLeft,
+			left: tableHolder.scrollLeft + this.getRowHeaderWidth(),
 			right: Math.ceil(tableHolder.scrollLeft + tableHolder.clientWidth),
@@ -717,6 +734,2 @@ top: tableHolder.scrollTop,
 		
-		if (rowHeader) {
-			view.left += rowHeader.offsetWidth;
-		}
-		
 		withinHorizontalView = view.left < rect.left &&	rect.left < view.right && view.left < rect.right &&	rect.right < view.right;
@@ -728,8 +741,5 @@
 			if (rect.left < view.left) {
-				tableHolder.scrollLeft = rect.left;
-				if (rowHeader) {
-					tableHolder.scrollLeft -= rowHeader.offsetWidth;
-				}
+				tableHolder.scrollLeft = rect.left - this.getRowHeaderWidth();
 			} else if (rect.right > view.right) {
-				tableHolder.scrollLeft = rect.right - tableHolder.clientWidth;
+				tableHolder.scrollLeft = Math.min(rect.right - tableHolder.clientWidth, rect.left - this.getRowHeaderWidth());
 			}
@@ -925,3 +935,5 @@ }
 				range.setBounds(cell);
-				this.initializeFocus(cell);
+				if(this.options("selectableRangeAutoFocus")){
+					this.initializeFocus(cell);
+				}
 			}
@@ -946,2 +958,9 @@ }
 
+	getRowHeaderWidth(){
+		if(!this.rowHeader){
+			return 0;
+		}
+		return this.rowHeader.getElement().offsetWidth;
+	}
+
 	isEmpty(value) {
@@ -948,0 +967,0 @@ return value === null || value === undefined || value === "";

src/js/modules/Sort/defaults/sorters/array.js

@@ -0,1 +1,3 @@
+import Helpers from '../../../../core/tools/Helpers.js';
+
 //sort if element contains any data
@@ -5,6 +7,24 @@ export default function(a, b, aRow, bRow, column, dir, params){
 	alignEmptyValues = params.alignEmptyValues,
-	emptyAlign = 0;
+	emptyAlign = 0,
+	table = this.table,
+	valueMap;
 
+	if(params.valueMap){
+		if(typeof params.valueMap === "string"){
+			valueMap = function(value){
+				return value.map((item) => {
+					return Helpers.retrieveNestedData(table.options.nestedFieldSeparator, params.valueMap, item);
+				});
+			};
+		}else{
+			valueMap = params.valueMap;
+		}
+	}
+
 	function calc(value){
 		var result;
+		
+		if(valueMap){
+			value = valueMap(value);
+		}
 
@@ -35,2 +55,6 @@ switch(type){
 				break;
+
+			case "string":
+				result = value.join("");
+				break;
 		}
@@ -47,3 +71,7 @@
 	}else{
-		return calc(b) - calc(a);
+		if(type === "string"){
+			return String(calc(a)).toLowerCase().localeCompare(String(calc(b)).toLowerCase());
+		}else{
+			return calc(b) - calc(a);
+		}
 	}
@@ -50,0 +78,0 @@

src/js/modules/Sort/defaults/sorters/datetime.js

 //sort datetime
 export default function(a, b, aRow, bRow, column, dir, params){
-	var DT = window.DateTime || luxon.DateTime;
+	var DT = this.table.dependencyRegistry.lookup(["luxon", "DateTime"], "DateTime");
 	var format = params.format || "dd/MM/yyyy HH:mm:ss",
@@ -5,0 +5,0 @@ alignEmptyValues = params.alignEmptyValues,

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

29652689

increased by1.42%

Number of package files

296

increased by1.72%

Lines of code

115866

increased by1.08%

No dependency changes