tabulator-tables 5.4.3 → 5.4.4

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

@@ -1,12 +1,12 @@
-import List from '../../List.js';
-
-export default function(cell, onRendered, success, cancel, editorParams){
-
-	this.deprecationMsg("The autocomplete editor has been deprecated, please use the new list editor with the 'autocomplete' editorParam");
-
-	editorParams.autocomplete = true;
-
-	var list = new List(this, cell, onRendered, success, cancel, editorParams);
-
-	return list.input;
+import List from '../../List.js';
+
+export default function(cell, onRendered, success, cancel, editorParams){
+
+	this.deprecationMsg("The autocomplete editor has been deprecated, please use the new list editor with the 'autocomplete' editorParam");
+
+	editorParams.autocomplete = true;
+
+	var list = new List(this, cell, onRendered, success, cancel, editorParams);
+
+	return list.input;
 }

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

@@ -1,110 +1,138 @@
-//input element
-export default function(cell, onRendered, success, cancel, editorParams){
-	var inputFormat = editorParams.format,
-	DT = inputFormat ? (window.DateTime || luxon.DateTime) : null;
-	
-	//create and style input
-	var cellValue = cell.getValue(),
-	input = document.createElement("input");
-	
-	function convertDate(value){
-		var newDatetime;
-		
-		if(DT.isDateTime(value)){
-			newDatetime = value;
-		}else if(inputFormat === "iso"){
-			newDatetime = DT.fromISO(String(value));
-		}else{
-			newDatetime = DT.fromFormat(String(value), inputFormat);
-		}
-		
-		return newDatetime.toFormat("yyyy-MM-dd");
-	}
-	
-	input.type = "date";
-	input.style.padding = "4px";
-	input.style.width = "100%";
-	input.style.boxSizing = "border-box";
-
-	if(editorParams.max){
-		input.setAttribute("max", inputFormat ? convertDate(editorParams.max) : editorParams.max);
-	}
-
-	if(editorParams.min){
-		input.setAttribute("min", inputFormat ? convertDate(editorParams.min) : editorParams.min);
-	}
-	
-	if(editorParams.elementAttributes && typeof editorParams.elementAttributes == "object"){
-		for (let key in editorParams.elementAttributes){
-			if(key.charAt(0) == "+"){
-				key = key.slice(1);
-				input.setAttribute(key, input.getAttribute(key) + editorParams.elementAttributes["+" + key]);
-			}else{
-				input.setAttribute(key, editorParams.elementAttributes[key]);
-			}
-		}
-	}
-	
-	cellValue = typeof cellValue !== "undefined" ? cellValue : "";
-	
-	if(inputFormat){
-		if(DT){		
-			cellValue = convertDate(cellValue);			
-		}else{
-			console.error("Editor Error - 'date' editor 'inputFormat' param is dependant on luxon.js");
-		}
-	}
-	
-	input.value = cellValue;
-	
-	onRendered(function(){
-		input.focus({preventScroll: true});
-		input.style.height = "100%";
-		
-		if(editorParams.selectContents){
-			input.select();
-		}
-	});
-	
-	function onChange(e){
-		var value = input.value;
-		
-		if(((cellValue === null || typeof cellValue === "undefined") && value !== "") || value !== cellValue){
-			
-			if(value && inputFormat){
-				value = DT.fromFormat(String(value), "yyyy-MM-dd").toFormat(inputFormat);
-			}
-			
-			if(success(value)){
-				cellValue = input.value; //persist value if successfully validated incase editor is used as header filter
-			}
-		}else{
-			cancel();
-		}
-	}
-	
-	//submit new value on blur or change
-	input.addEventListener("change", onChange);
-	input.addEventListener("blur", onChange);
-	
-	//submit new value on enter
-	input.addEventListener("keydown", function(e){
-		switch(e.keyCode){
-			// case 9:
-			case 13:
-				onChange(e);
-				break;
-			
-			case 27:
-				cancel();
-				break;
-			
-			case 35:
-			case 36:
-				e.stopPropagation();
-				break;
-		}
-	});
-	
-	return input;
-}
+//input element
+export default function(cell, onRendered, success, cancel, editorParams){
+	var inputFormat = editorParams.format,
+	vertNav = editorParams.verticalNavigation || "editor",
+	DT = inputFormat ? (window.DateTime || luxon.DateTime) : null;
+	
+	//create and style input
+	var cellValue = cell.getValue(),
+	input = document.createElement("input");
+	
+	function convertDate(value){
+		var newDatetime;
+		
+		if(DT.isDateTime(value)){
+			newDatetime = value;
+		}else if(inputFormat === "iso"){
+			newDatetime = DT.fromISO(String(value));
+		}else{
+			newDatetime = DT.fromFormat(String(value), inputFormat);
+		}
+		
+		return newDatetime.toFormat("yyyy-MM-dd");
+	}
+	
+	input.type = "date";
+	input.style.padding = "4px";
+	input.style.width = "100%";
+	input.style.boxSizing = "border-box";
+
+	if(editorParams.max){
+		input.setAttribute("max", inputFormat ? convertDate(editorParams.max) : editorParams.max);
+	}
+
+	if(editorParams.min){
+		input.setAttribute("min", inputFormat ? convertDate(editorParams.min) : editorParams.min);
+	}
+	
+	if(editorParams.elementAttributes && typeof editorParams.elementAttributes == "object"){
+		for (let key in editorParams.elementAttributes){
+			if(key.charAt(0) == "+"){
+				key = key.slice(1);
+				input.setAttribute(key, input.getAttribute(key) + editorParams.elementAttributes["+" + key]);
+			}else{
+				input.setAttribute(key, editorParams.elementAttributes[key]);
+			}
+		}
+	}
+	
+	cellValue = typeof cellValue !== "undefined" ? cellValue : "";
+	
+	if(inputFormat){
+		if(DT){		
+			cellValue = convertDate(cellValue);			
+		}else{
+			console.error("Editor Error - 'date' editor 'format' param is dependant on luxon.js");
+		}
+	}
+	
+	input.value = cellValue;
+	
+	onRendered(function(){
+		if(cell._getSelf){
+			input.focus({preventScroll: true});
+			input.style.height = "100%";
+			
+			if(editorParams.selectContents){
+				input.select();
+			}
+		}
+	});
+	
+	function onChange(){
+		var value = input.value,
+		luxDate;
+		
+		if(((cellValue === null || typeof cellValue === "undefined") && value !== "") || value !== cellValue){
+			
+			if(value && inputFormat){
+				luxDate = DT.fromFormat(String(value), "yyyy-MM-dd");
+
+				switch(inputFormat){
+					case true:
+						value = luxDate;
+						break;
+
+					case "iso":
+						value = luxDate.toISO();
+						break;
+
+					default:
+						value = luxDate.toFormat(inputFormat);
+				}
+			}
+			
+			if(success(value)){
+				cellValue = input.value; //persist value if successfully validated incase editor is used as header filter
+			}
+		}else{
+			cancel();
+		}
+	}
+	
+	//submit new value on blur
+	input.addEventListener("blur", function(e) {
+		if (e.relatedTarget || e.rangeParent || e.explicitOriginalTarget !== input) {
+			onChange(); // only on a "true" blur; not when focusing browser's date/time picker
+		}
+	});
+	
+	//submit new value on enter
+	input.addEventListener("keydown", function(e){
+		switch(e.keyCode){
+			// case 9:
+			case 13:
+				onChange();
+				break;
+			
+			case 27:
+				cancel();
+				break;
+			
+			case 35:
+			case 36:
+				e.stopPropagation();
+				break;
+			
+			case 38: //up arrow
+			case 40: //down arrow
+				if(vertNav == "editor"){
+					e.stopImmediatePropagation();
+					e.stopPropagation();
+				}
+				break;
+		}
+	});
+	
+	return input;
+}

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

@@ -1,97 +1,125 @@
-//input element
-export default function(cell, onRendered, success, cancel, editorParams){
-	var inputFormat = editorParams.format,
-	DT = inputFormat ? (window.DateTime || luxon.DateTime) : null, 
-	newDatetime;
-
-	//create and style input
-	var cellValue = cell.getValue(),
-	input = document.createElement("input");
-	
-	input.type = "datetime-local";
-	input.style.padding = "4px";
-	input.style.width = "100%";
-	input.style.boxSizing = "border-box";
-	
-	if(editorParams.elementAttributes && typeof editorParams.elementAttributes == "object"){
-		for (let key in editorParams.elementAttributes){
-			if(key.charAt(0) == "+"){
-				key = key.slice(1);
-				input.setAttribute(key, input.getAttribute(key) + editorParams.elementAttributes["+" + key]);
-			}else{
-				input.setAttribute(key, editorParams.elementAttributes[key]);
-			}
-		}
-	}
-	
-	cellValue = typeof cellValue !== "undefined" ? cellValue : "";
-	
-	if(inputFormat){
-		if(DT){
-			if(DT.isDateTime(cellValue)){
-				newDatetime = cellValue;
-			}else if(inputFormat === "iso"){
-				newDatetime = DT.fromISO(String(cellValue));
-			}else{
-				newDatetime = DT.fromFormat(String(cellValue), inputFormat);
-			}
-
-			cellValue = newDatetime.toFormat("yyyy-MM-dd")  + "T" + newDatetime.toFormat("hh:mm");
-		}else{
-			console.error("Editor Error - 'date' editor 'inputFormat' param is dependant on luxon.js");
-		}
-	}
-
-	input.value = cellValue;
-	
-	onRendered(function(){
-		input.focus({preventScroll: true});
-		input.style.height = "100%";
-		
-		if(editorParams.selectContents){
-			input.select();
-		}
-	});
-	
-	function onChange(e){
-		var value = input.value;
-
-		if(((cellValue === null || typeof cellValue === "undefined") && value !== "") || value !== cellValue){
-
-			if(value && inputFormat){
-				value = DT.fromISO(String(value)).toFormat(inputFormat);
-			}
-
-			if(success(value)){
-				cellValue = input.value; //persist value if successfully validated incase editor is used as header filter
-			}
-		}else{
-			cancel();
-		}
-	}
-	
-	//submit new value on blur or change
-	input.addEventListener("change", onChange);
-	input.addEventListener("blur", onChange);
-	
-	//submit new value on enter
-	input.addEventListener("keydown", function(e){
-		switch(e.keyCode){
-			// case 9:
-			case 13:
-				onChange(e);
-				break;
-			
-			case 27:
-				cancel();
-				break;
-			
-			case 35:
-			case 36:
-				e.stopPropagation();
-				break;
-		}
-	});
-	
-	return input;
-}
+//input element
+export default function(cell, onRendered, success, cancel, editorParams){
+	var inputFormat = editorParams.format,
+	vertNav = editorParams.verticalNavigation || "editor",
+	DT = inputFormat ? (window.DateTime || luxon.DateTime) : null, 
+	newDatetime;
+	
+	//create and style input
+	var cellValue = cell.getValue(),
+	input = document.createElement("input");
+	
+	input.type = "datetime-local";
+	input.style.padding = "4px";
+	input.style.width = "100%";
+	input.style.boxSizing = "border-box";
+	
+	if(editorParams.elementAttributes && typeof editorParams.elementAttributes == "object"){
+		for (let key in editorParams.elementAttributes){
+			if(key.charAt(0) == "+"){
+				key = key.slice(1);
+				input.setAttribute(key, input.getAttribute(key) + editorParams.elementAttributes["+" + key]);
+			}else{
+				input.setAttribute(key, editorParams.elementAttributes[key]);
+			}
+		}
+	}
+	
+	cellValue = typeof cellValue !== "undefined" ? cellValue : "";
+	
+	if(inputFormat){
+		if(DT){
+			if(DT.isDateTime(cellValue)){
+				newDatetime = cellValue;
+			}else if(inputFormat === "iso"){
+				newDatetime = DT.fromISO(String(cellValue));
+			}else{
+				newDatetime = DT.fromFormat(String(cellValue), inputFormat);
+			}
+			
+			cellValue = newDatetime.toFormat("yyyy-MM-dd")  + "T" + newDatetime.toFormat("hh:mm");
+		}else{
+			console.error("Editor Error - 'date' editor 'format' param is dependant on luxon.js");
+		}
+	}
+	
+	input.value = cellValue;
+	
+	onRendered(function(){
+		if(cell._getSelf){
+			input.focus({preventScroll: true});
+			input.style.height = "100%";
+			
+			if(editorParams.selectContents){
+				input.select();
+			}
+		}
+	});
+	
+	function onChange(){
+		var value = input.value,
+		luxDateTime;
+		
+		if(((cellValue === null || typeof cellValue === "undefined") && value !== "") || value !== cellValue){
+
+			if(value && inputFormat){
+				luxDateTime = DT.fromISO(String(value));
+
+				switch(inputFormat){
+					case true:
+						value = luxDateTime;
+						break;
+
+					case "iso":
+						value = luxDateTime.toISO();
+						break;
+
+					default:
+						value = luxDateTime.toFormat(inputFormat);
+				}
+			}
+			
+			if(success(value)){
+				cellValue = input.value; //persist value if successfully validated incase editor is used as header filter
+			}
+		}else{
+			cancel();
+		}
+	}
+	
+	//submit new value on blur
+	input.addEventListener("blur", function(e) {
+		if (e.relatedTarget || e.rangeParent || e.explicitOriginalTarget !== input) {
+			onChange(); // only on a "true" blur; not when focusing browser's date/time picker
+		}
+	});
+	
+	//submit new value on enter
+	input.addEventListener("keydown", function(e){
+		switch(e.keyCode){
+			// case 9:
+			case 13:
+				onChange();
+				break;
+			
+			case 27:
+				cancel();
+				break;
+			
+			case 35:
+			case 36:
+				e.stopPropagation();
+				break;
+
+			case 38: //up arrow
+			case 40: //down arrow
+				if(vertNav == "editor"){
+					e.stopImmediatePropagation();
+					e.stopPropagation();
+				}
+				break;
+		}
+	});
+	
+	return input;
+}

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

@@ -1,75 +1,77 @@
-import maskInput from '../../inputMask.js';
-
-//input element
-export default function(cell, onRendered, success, cancel, editorParams){
-	//create and style input
-	var cellValue = cell.getValue(),
-	input = document.createElement("input");
-
-	input.setAttribute("type", editorParams.search ? "search" : "text");
-
-	input.style.padding = "4px";
-	input.style.width = "100%";
-	input.style.boxSizing = "border-box";
-
-	if(editorParams.elementAttributes && typeof editorParams.elementAttributes == "object"){
-		for (let key in editorParams.elementAttributes){
-			if(key.charAt(0) == "+"){
-				key = key.slice(1);
-				input.setAttribute(key, input.getAttribute(key) + editorParams.elementAttributes["+" + key]);
-			}else{
-				input.setAttribute(key, editorParams.elementAttributes[key]);
-			}
-		}
-	}
-
-	input.value = typeof cellValue !== "undefined" ? cellValue : "";
-
-	onRendered(function(){
-		input.focus({preventScroll: true});
-		input.style.height = "100%";
-
-		if(editorParams.selectContents){
-			input.select();
-		}
-	});
-
-	function onChange(e){
-		if(((cellValue === null || typeof cellValue === "undefined") && input.value !== "") || input.value !== cellValue){
-			if(success(input.value)){
-				cellValue = input.value; //persist value if successfully validated incase editor is used as header filter
-			}
-		}else{
-			cancel();
-		}
-	}
-
-	//submit new value on blur or change
-	input.addEventListener("change", onChange);
-	input.addEventListener("blur", onChange);
-
-	//submit new value on enter
-	input.addEventListener("keydown", function(e){
-		switch(e.keyCode){
-			// case 9:
-			case 13:
-				onChange(e);
-				break;
-
-			case 27:
-				cancel();
-				break;
-
-			case 35:
-			case 36:
-				e.stopPropagation();
-				break;
-		}
-	});
-
-	if(editorParams.mask){
-		maskInput(input, editorParams);
-	}
-
-	return input;
+import maskInput from '../../inputMask.js';
+
+//input element
+export default function(cell, onRendered, success, cancel, editorParams){
+	//create and style input
+	var cellValue = cell.getValue(),
+	input = document.createElement("input");
+
+	input.setAttribute("type", editorParams.search ? "search" : "text");
+
+	input.style.padding = "4px";
+	input.style.width = "100%";
+	input.style.boxSizing = "border-box";
+
+	if(editorParams.elementAttributes && typeof editorParams.elementAttributes == "object"){
+		for (let key in editorParams.elementAttributes){
+			if(key.charAt(0) == "+"){
+				key = key.slice(1);
+				input.setAttribute(key, input.getAttribute(key) + editorParams.elementAttributes["+" + key]);
+			}else{
+				input.setAttribute(key, editorParams.elementAttributes[key]);
+			}
+		}
+	}
+
+	input.value = typeof cellValue !== "undefined" ? cellValue : "";
+
+	onRendered(function(){
+		if(cell._getSelf){
+			input.focus({preventScroll: true});
+			input.style.height = "100%";
+
+			if(editorParams.selectContents){
+				input.select();
+			}
+		}
+	});
+
+	function onChange(e){
+		if(((cellValue === null || typeof cellValue === "undefined") && input.value !== "") || input.value !== cellValue){
+			if(success(input.value)){
+				cellValue = input.value; //persist value if successfully validated incase editor is used as header filter
+			}
+		}else{
+			cancel();
+		}
+	}
+
+	//submit new value on blur or change
+	input.addEventListener("change", onChange);
+	input.addEventListener("blur", onChange);
+
+	//submit new value on enter
+	input.addEventListener("keydown", function(e){
+		switch(e.keyCode){
+			// case 9:
+			case 13:
+				onChange(e);
+				break;
+
+			case 27:
+				cancel();
+				break;
+
+			case 35:
+			case 36:
+				e.stopPropagation();
+				break;
+		}
+	});
+
+	if(editorParams.mask){
+		maskInput(input, editorParams);
+	}
+
+	return input;
 }

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

@@ -1,7 +1,7 @@
-import List from '../../List.js';
-
-export default function(cell, onRendered, success, cancel, editorParams){
-	var list = new List(this, cell, onRendered, success, cancel, editorParams);
-
-	return list.input;
+import List from '../../List.js';
+
+export default function(cell, onRendered, success, cancel, editorParams){
+	var list = new List(this, cell, onRendered, success, cancel, editorParams);
+
+	return list.input;
 }