tabulator-tables 6.5.0 → 6.5.1

package/src/js/modules/Filter/defaults/filters.js

@@ -0,0 +1,215 @@
+export default {
+
+	//equal to
+	"=":function(filterVal, rowVal, rowData, filterParams){
+		return rowVal == filterVal ? true : false;
+	},
+
+	//less than
+	"<":function(filterVal, rowVal, rowData, filterParams){
+		return rowVal < filterVal ? true : false;
+	},
+
+	//less than or equal to
+	"<=":function(filterVal, rowVal, rowData, filterParams){
+		return rowVal <= filterVal ? true : false;
+	},
+
+	//greater than
+	">":function(filterVal, rowVal, rowData, filterParams){
+		return rowVal > filterVal ? true : false;
+	},
+
+	//greater than or equal to
+	">=":function(filterVal, rowVal, rowData, filterParams){
+		return rowVal >= filterVal ? true : false;
+	},
+
+	//not equal to
+	"!=":function(filterVal, rowVal, rowData, filterParams){
+		return rowVal != filterVal ? true : false;
+	},
+
+	"regex":function(filterVal, rowVal, rowData, filterParams){
+
+		if(typeof filterVal == "string"){
+			filterVal = new RegExp(filterVal);
+		}
+
+		return filterVal.test(rowVal);
+	},
+
+	//contains the string
+	"like":function(filterVal, rowVal, rowData, filterParams){
+		if(filterVal === null || typeof filterVal === "undefined"){
+			return rowVal === filterVal ? true : false;
+		}else{
+			if(typeof rowVal !== 'undefined' && rowVal !== null){
+				return String(rowVal).toLowerCase().indexOf(filterVal.toLowerCase()) > -1;
+			}
+			else{
+				return false;
+			}
+		}
+	},
+
+	//contains the keywords
+	"keywords":function(filterVal, rowVal, rowData, filterParams){
+		var keywords = filterVal.toLowerCase().split(typeof filterParams.separator === "undefined" ? " " : filterParams.separator),
+		value = String(rowVal === null || typeof rowVal === "undefined" ? "" : rowVal).toLowerCase(),
+		matches = [];
+
+		keywords.forEach((keyword) =>{
+			if(value.includes(keyword)){
+				matches.push(true);
+			}
+		});
+
+		return filterParams.matchAll ? matches.length === keywords.length : !!matches.length;
+	},
+
+	//starts with the string
+	"starts":function(filterVal, rowVal, rowData, filterParams){
+		if(filterVal === null || typeof filterVal === "undefined"){
+			return rowVal === filterVal ? true : false;
+		}else{
+			if(typeof rowVal !== 'undefined' && rowVal !== null){
+				return String(rowVal).toLowerCase().startsWith(filterVal.toLowerCase());
+			}
+			else{
+				return false;
+			}
+		}
+	},
+
+	//ends with the string
+	"ends":function(filterVal, rowVal, rowData, filterParams){
+		if(filterVal === null || typeof filterVal === "undefined"){
+			return rowVal === filterVal ? true : false;
+		}else{
+			if(typeof rowVal !== 'undefined' && rowVal !== null){
+				return String(rowVal).toLowerCase().endsWith(filterVal.toLowerCase());
+			}
+			else{
+				return false;
+			}
+		}
+	},
+
+	//in array
+	"in":function(filterVal, rowVal, rowData, filterParams){
+		if(Array.isArray(filterVal)){
+			return filterVal.length ? filterVal.indexOf(rowVal) > -1 : true;
+		}else{
+			console.warn("Filter Error - filter value is not an array:", filterVal);
+			return false;
+		}
+	},
+
+	// Smart filter
+	// Supports ., !, <, >, <=, >=, = and falls back to like filter
+	"smart": function (filterVal, rowVal, rowData, filterParams) {
+		const search = filterVal.trim();
+
+		// searching . returns all non-empty cells
+		if (search === ".") return !(rowVal === null || rowVal == "");
+		// searching ! returns all empty cells
+		if (search === "!") return rowVal === null || rowVal == "";
+		
+		// number comparisons - use existing filters
+		if (search.indexOf("<=") === 0)
+			return this["<="](
+				parseFloat(search.substring(2)),
+				rowVal,
+				rowData,
+				filterParams
+			);
+		if (search.indexOf(">=") === 0)
+			return this[">="](
+				parseFloat(search.substring(2)),
+				rowVal,
+				rowData,
+				filterParams
+			);
+		if (search.indexOf("<") === 0)
+			return this["<"](
+				parseFloat(search.substring(1)),
+				rowVal,
+				rowData,
+				filterParams
+			);
+		if (search.indexOf(">") === 0)
+			return this[">"](
+				parseFloat(search.substring(1)),
+				rowVal,
+				rowData,
+				filterParams
+			);
+		if (search.indexOf("=") === 0)
+			return this["="](search.substring(1).trim(), rowVal, rowData, filterParams);
+
+		// we got a string like "ne ci"
+		// convert this to "ne AND ci" to find "New York City"
+		if (search.includes(" ")) {
+			// Split by spaces and join with AND for fuzzy search
+			const terms = search.split(/\s+/).filter((term) => term.length > 0);
+			if (terms.length > 1) {
+				const fuzzySearch = terms.join(" AND ");
+				return this["smarter"](fuzzySearch, rowVal, rowData, filterParams);
+			}
+		}
+
+		// otherwise we use the regular like filter
+		return this["like"](search, rowVal, rowData, filterParams);
+	},
+
+	// Smarter filter
+	// Just like the smart filter but you can combine multiple filters (AND/OR)
+	// Examples:
+	// - "john AND smith" - both terms must match
+	// - "john OR jane" - either term must match
+	// - ">100 AND <500" - value must be between 100 and 500
+	// - "! OR foo" - either empty or foo
+	"smarter": function (filterVal, rowVal, rowData, filterParams) {
+		const search = filterVal.trim();
+
+		// If no search value, show all rows
+		if (!search) return true;
+
+		// Split by AND/OR operators while preserving the operators
+		const parts = search.split(/\s+(AND|OR)\s+/i);
+
+		// If no operators found, use the original smart filter
+		if (parts.length === 1) {
+			return this["smart"](search, rowVal, rowData, filterParams);
+		}
+
+		// Process each part and operator
+		let result = null;
+		let currentOperator = null;
+
+		for (let i = 0; i < parts.length; i++) {
+			const part = parts[i].trim();
+
+			if (part === "AND" || part === "OR") {
+				currentOperator = part;
+				continue;
+			}
+
+			// Apply the smart filter to this part
+			const partResult = this["smart"](part, rowVal, rowData, filterParams);
+
+			// Combine results based on operator
+			if (result === null) {
+				result = partResult;
+			} else if (currentOperator === "AND") {
+				result = result && partResult;
+			} else if (currentOperator === "OR") {
+				result = result || partResult;
+			}
+		}
+
+		return result !== null ? result : true;
+	},
+
+};

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

@@ -0,0 +1,200 @@
+import Module from '../../core/Module.js';
+
+import defaultFormatters from './defaults/formatters.js';
+
+export default class Format extends Module{
+	
+	static moduleName = "format";
+	
+	//load defaults
+	static formatters = defaultFormatters;
+	
+	constructor(table){
+		super(table);
+		
+		this.registerColumnOption("formatter");
+		this.registerColumnOption("formatterParams");
+		
+		this.registerColumnOption("formatterPrint");
+		this.registerColumnOption("formatterPrintParams");
+		this.registerColumnOption("formatterClipboard");
+		this.registerColumnOption("formatterClipboardParams");
+		this.registerColumnOption("formatterHtmlOutput");
+		this.registerColumnOption("formatterHtmlOutputParams");
+		this.registerColumnOption("titleFormatter");
+		this.registerColumnOption("titleFormatterParams");
+	}
+	
+	initialize(){
+		this.subscribe("cell-format", this.formatValue.bind(this));
+		this.subscribe("cell-rendered", this.cellRendered.bind(this));
+		this.subscribe("column-layout", this.initializeColumn.bind(this));
+		this.subscribe("column-format", this.formatHeader.bind(this));
+	}
+	
+	//initialize column formatter
+	initializeColumn(column){
+		column.modules.format = this.lookupTypeFormatter(column, "");
+		
+		if(typeof column.definition.formatterPrint !== "undefined"){
+			column.modules.format.print = this.lookupTypeFormatter(column, "Print");
+		}
+		
+		if(typeof column.definition.formatterClipboard !== "undefined"){
+			column.modules.format.clipboard = this.lookupTypeFormatter(column, "Clipboard");
+		}
+		
+		if(typeof column.definition.formatterHtmlOutput !== "undefined"){
+			column.modules.format.htmlOutput = this.lookupTypeFormatter(column, "HtmlOutput");
+		}
+	}
+	
+	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
+		switch(typeof formatter){
+			case "string":
+				if(Format.formatters[formatter]){
+					formatterFunc = Format.formatters[formatter];
+				}else{
+					console.warn("Formatter Error - No such formatter found: ", formatter);
+					formatterFunc = Format.formatters.plaintext;
+				}
+				break;
+			
+			case "function":
+				formatterFunc = formatter;
+				break;
+			
+			default:
+				formatterFunc = Format.formatters.plaintext;
+				break;
+		}
+		
+		return formatterFunc;
+	}
+	
+	cellRendered(cell){
+		if(cell.modules.format && cell.modules.format.renderedCallback && !cell.modules.format.rendered){
+			cell.modules.format.renderedCallback();
+			cell.modules.format.rendered = true;
+		}
+	}
+	
+	//return a formatted value for a column header
+	formatHeader(column, title, el){
+		var formatter, params, onRendered, mockCell;
+		
+		if(column.definition.titleFormatter){
+			formatter = this.lookupFormatter(column.definition.titleFormatter);
+			
+			onRendered = (callback) => {
+				column.titleFormatterRendered = callback;
+			};
+			
+			mockCell = {
+				getValue:function(){
+					return title;
+				},
+				getElement:function(){
+					return el;
+				},
+				getType:function(){
+					return "header";
+				},
+				getColumn:function(){
+					return column.getComponent();
+				},
+				getTable:() => {
+					return this.table;
+				}
+			};
+			
+			params = column.definition.titleFormatterParams || {};
+			
+			params = typeof params === "function" ? params() : params;
+			
+			return formatter.call(this, mockCell, params, onRendered);
+		}else{
+			return title;
+		}
+	}
+	
+	
+	//return a formatted value for a cell
+	formatValue(cell){
+		var component = cell.getComponent(),
+		params = typeof cell.column.modules.format.params === "function" ? cell.column.modules.format.params(component) : cell.column.modules.format.params;
+		
+		function onRendered(callback){
+			if(!cell.modules.format){
+				cell.modules.format = {};
+			}
+			
+			cell.modules.format.renderedCallback = callback;
+			cell.modules.format.rendered = false;
+		}
+		
+		return cell.column.modules.format.formatter.call(this, component, params, onRendered);
+	}
+	
+	formatExportValue(cell, type){
+		var formatter = cell.column.modules.format[type],
+		params;
+		
+		if(formatter){
+			params = typeof formatter.params === "function" ? formatter.params(cell.getComponent()) : formatter.params;
+			
+			function onRendered(callback){
+				if(!cell.modules.format){
+					cell.modules.format = {};
+				}
+				
+				cell.modules.format.renderedCallback = callback;
+				cell.modules.format.rendered = false;
+			}
+			
+			return formatter.formatter.call(this, cell.getComponent(), params, onRendered);
+			
+		}else{
+			return this.formatValue(cell);
+		}
+	}
+	
+	sanitizeHTML(value){
+		if(value){
+			var entityMap = {
+				'&': '&',
+				'<': '&lt;',
+				'>': '&gt;',
+				'"': '&quot;',
+				"'": '&#39;',
+				'/': '&#x2F;',
+				'`': '&#x60;',
+				'=': '&#x3D;'
+			};
+			
+			return String(value).replace(/[&<>"'`=/]/g, function (s) {
+				return entityMap[s];
+			});
+		}else{
+			return value;
+		}
+	}
+	
+	emptyToSpace(value){
+		return value === null || typeof value === "undefined" || value === "" ? "&nbsp;" : value;
+	}
+	
+}

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

@@ -0,0 +1,32 @@
+export default function(cell, params, onRendered){
+	var lookup, formatterFunc, formatterParams;
+    
+	function defaultLookup(cell){
+		var value = cell.getValue(),
+		formatter = "plaintext";
+        
+		switch(typeof value){           
+			case "boolean":
+				formatter = "tickCross";
+				break;
+            
+			case "string":
+				if(value.includes("\n")){
+					formatter = "textarea";
+				}
+				break;
+		}
+        
+		return formatter;
+	}
+    
+	lookup = params.formatterLookup ? params.formatterLookup(cell) : defaultLookup(cell);
+
+	if(params.paramsLookup){
+		formatterParams = typeof params.paramsLookup === "function" ? params.paramsLookup(lookup, cell) : params.paramsLookup[lookup];
+	}
+
+	formatterFunc = this.table.modules.format.lookupFormatter(lookup);
+    
+	return  formatterFunc.call(this, cell, formatterParams || {}, onRendered);
+}

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

@@ -0,0 +1,30 @@
+import Helpers from '../../../../core/tools/Helpers.js';
+
+export default function(cell, formatterParams, onRendered){
+	var delimiter = formatterParams.delimiter || ",",
+	value = cell.getValue(),
+	table = this.table,
+	valueMap;
+	
+	if(formatterParams.valueMap){
+		if(typeof formatterParams.valueMap === "string"){
+			valueMap = function(value){
+				return value.map((item) => {
+					return Helpers.retrieveNestedData(table.options.nestedFieldSeparator, formatterParams.valueMap, item);
+				});
+			};
+		}else{
+			valueMap = formatterParams.valueMap;
+		}
+	}
+
+	if(Array.isArray(value)){
+		if(valueMap){
+			value = valueMap(value);
+		}
+
+		return value.join(delimiter);
+	}else{
+		return value;
+	}
+}

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

@@ -0,0 +1,3 @@
+export default function(cell, formatterParams, onRendered){
+	return '<svg enable-background="new 0 0 24 24" height="14" width="14" viewBox="0 0 24 24" xml:space="preserve" ><path fill="#CE1515" d="M22.245,4.015c0.313,0.313,0.313,0.826,0,1.139l-6.276,6.27c-0.313,0.312-0.313,0.826,0,1.14l6.273,6.272  c0.313,0.313,0.313,0.826,0,1.14l-2.285,2.277c-0.314,0.312-0.828,0.312-1.142,0l-6.271-6.271c-0.313-0.313-0.828-0.313-1.141,0  l-6.276,6.267c-0.313,0.313-0.828,0.313-1.141,0l-2.282-2.28c-0.313-0.313-0.313-0.826,0-1.14l6.278-6.269  c0.313-0.312,0.313-0.826,0-1.14L1.709,5.147c-0.314-0.313-0.314-0.827,0-1.14l2.284-2.278C4.308,1.417,4.821,1.417,5.135,1.73  L11.405,8c0.314,0.314,0.828,0.314,1.141,0.001l6.276-6.267c0.312-0.312,0.826-0.312,1.141,0L22.245,4.015z"/></svg>';
+}

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

@@ -0,0 +1,3 @@
+export default function(cell, formatterParams, onRendered){
+	return '<svg enable-background="new 0 0 24 24" height="14" width="14" viewBox="0 0 24 24" xml:space="preserve" ><path fill="#2DC214" clip-rule="evenodd" d="M21.652,3.211c-0.293-0.295-0.77-0.295-1.061,0L9.41,14.34  c-0.293,0.297-0.771,0.297-1.062,0L3.449,9.351C3.304,9.203,3.114,9.13,2.923,9.129C2.73,9.128,2.534,9.201,2.387,9.351  l-2.165,1.946C0.078,11.445,0,11.63,0,11.823c0,0.194,0.078,0.397,0.223,0.544l4.94,5.184c0.292,0.296,0.771,0.776,1.062,1.07  l2.124,2.141c0.292,0.293,0.769,0.293,1.062,0l14.366-14.34c0.293-0.294,0.293-0.777,0-1.071L21.652,3.211z" fill-rule="evenodd"/></svg>';
+}

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

@@ -0,0 +1,4 @@
+export default function(cell, formatterParams, onRendered){
+	cell.getElement().style.backgroundColor = this.sanitizeHTML(cell.getValue());
+	return "";
+}

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

@@ -0,0 +1,39 @@
+export default function(cell, formatterParams, onRendered){
+	var DT = this.table.dependencyRegistry.lookup(["luxon", "DateTime"], "DateTime");
+	var inputFormat = formatterParams.inputFormat || "yyyy-MM-dd HH:mm:ss";
+	var	outputFormat = formatterParams.outputFormat || "dd/MM/yyyy HH:mm:ss";
+	var	invalid = typeof formatterParams.invalidPlaceholder !== "undefined" ? formatterParams.invalidPlaceholder : "";
+	var value = cell.getValue();
+
+	if(typeof DT != "undefined"){
+		var newDatetime;
+
+		if(DT.isDateTime(value)){
+			newDatetime = value;
+		}else if(inputFormat === "x"){
+			newDatetime = DT.fromMillis(value);	
+		}else if(inputFormat === "iso"){
+			newDatetime = DT.fromISO(String(value));
+		}else{
+			newDatetime = DT.fromFormat(String(value), inputFormat);
+		}
+
+		if(newDatetime.isValid){
+			if(formatterParams.timezone){
+				newDatetime = newDatetime.setZone(formatterParams.timezone);
+			}
+
+			return newDatetime.toFormat(outputFormat);
+		}else{
+			if(invalid === true || !value){
+				return value;
+			}else if(typeof invalid === "function"){
+				return invalid(value);
+			}else{
+				return invalid;
+			}
+		}
+	}else{
+		console.error("Format Error - 'datetime' formatter is dependant on luxon.js");
+	}
+}

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

@@ -0,0 +1,43 @@
+export default function (cell, formatterParams, onRendered) {
+	var DT = this.table.dependencyRegistry.lookup(["luxon", "DateTime"], "DateTime");
+	var inputFormat = formatterParams.inputFormat || "yyyy-MM-dd HH:mm:ss";
+	var invalid = typeof formatterParams.invalidPlaceholder !== "undefined" ? formatterParams.invalidPlaceholder : "";
+	var suffix = typeof formatterParams.suffix !== "undefined" ? formatterParams.suffix : false;
+	var unit = typeof formatterParams.unit !== "undefined" ? formatterParams.unit : "days";
+	var humanize = typeof formatterParams.humanize !== "undefined" ? formatterParams.humanize : false;
+	var date = typeof formatterParams.date !== "undefined" ? formatterParams.date : DT.now();
+	var value = cell.getValue();
+
+	if(typeof DT != "undefined"){
+		var newDatetime;
+
+		if(DT.isDateTime(value)){
+			newDatetime = value;
+		}else if(inputFormat === "x"){
+			newDatetime = DT.fromMillis(value);	
+		}else if(inputFormat === "iso"){
+			newDatetime = DT.fromISO(String(value));
+		}else{
+			newDatetime = DT.fromFormat(String(value), inputFormat);
+		}
+
+		if (newDatetime.isValid){
+			if(humanize){
+				return newDatetime.diff(date, unit).toHuman()  + (suffix ? " " + suffix : "");
+			}else{
+				return parseInt(newDatetime.diff(date, unit)[unit]) + (suffix ? " " + suffix : "");
+			}
+		} else {
+
+			if (invalid === true) {
+				return value;
+			} else if (typeof invalid === "function") {
+				return invalid(value);
+			} else {
+				return invalid;
+			}
+		}
+	}else{
+		console.error("Format Error - 'datetimediff' formatter is dependant on luxon.js");
+	}
+}

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

@@ -0,0 +1,4 @@
+export default function(cell, formatterParams, onRendered){
+	cell.getElement().classList.add("tabulator-row-handle");
+	return "<div class='tabulator-row-handle-box'><div class='tabulator-row-handle-bar'></div><div class='tabulator-row-handle-bar'></div><div class='tabulator-row-handle-bar'></div></div>";
+}

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

@@ -0,0 +1,3 @@
+export default function(cell, formatterParams, onRendered){
+	return cell.getValue();
+}

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

@@ -0,0 +1,40 @@
+export default function(cell, formatterParams, onRendered){
+	var el = document.createElement("img"),
+	src = cell.getValue();
+
+	if(formatterParams.urlPrefix){
+		src = formatterParams.urlPrefix + cell.getValue();
+	}
+
+	if(formatterParams.urlSuffix){
+		src = src + formatterParams.urlSuffix;
+	}
+
+	el.setAttribute("src", src);
+
+	switch(typeof formatterParams.height){
+		case "number":
+			el.style.height = formatterParams.height + "px";
+			break;
+
+		case "string":
+			el.style.height = formatterParams.height;
+			break;
+	}
+
+	switch(typeof formatterParams.width){
+		case "number":
+			el.style.width = formatterParams.width + "px";
+			break;
+
+		case "string":
+			el.style.width = formatterParams.width;
+			break;
+	}
+
+	el.addEventListener("load", function(){
+		cell.getRow().normalizeHeight();
+	});
+
+	return el;
+}

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

@@ -0,0 +1,12 @@
+export default function(cell, formatterParams, onRendered){
+	var indent = formatterParams.indent || "\t",
+	multiline = typeof formatterParams.multiline === "undefined" ? true : formatterParams.multiline,
+	replacer = formatterParams.replacer || null,
+	value = cell.getValue();
+	
+	if(multiline){
+		cell.getElement().style.whiteSpace = "pre-wrap";
+	}
+
+	return JSON.stringify(value, replacer, indent);
+}