@refinitiv-ui/efx-grid 0.0.0-dev.12023565035.1

package/lib/tr-grid-textformatting/es6/TextFormatting.d.ts

@@ -0,0 +1,72 @@
+import {Ext} from '../../tr-grid-util/es6/Ext.js';
+import {GridPlugin} from '../../tr-grid-util/es6/GridPlugin.js';
+import {NumberFormatter} from '../../tr-grid-util/es6/NumberFormatter.js';
+import { FieldFormatter } from '../../tr-grid-util/es6/FieldFormatter.js';
+import { DateTime } from '../../tr-grid-util/es6/DateTime.js';
+
+declare namespace TextFormattingPlugin {
+
+    type FormatOptions = {
+        formatType?: string|null,
+        field?: string|null,
+        decimalPlaces?: (number|boolean)|null,
+        precisionEnabled?: boolean|null,
+        plusSign?: boolean|null,
+        separator?: boolean|null,
+        percentSign?: boolean|null,
+        scalingUnit?: string|null,
+        multiplyBy100?: boolean|null,
+        dateTimeFormat?: string|null,
+        useUTCTime?: boolean|null,
+        autoTextFormatting?: boolean|null,
+        formatLogic?: ((...params: any[]) => any)|null
+    };
+
+    type ColumnOptions = TextFormattingPlugin.FormatOptions|null;
+
+    type GridOptions = {
+        autoTextFormatting?: boolean|null
+    };
+
+    type FormatLogicArguments = {
+        colIndex: number,
+        rowIndex: number,
+        field: string,
+        formattedText: string,
+        cell: any,
+        rowData: any,
+        format: ((...params: any[]) => any)|null
+    };
+
+}
+
+declare class TextFormattingPlugin extends GridPlugin {
+
+    constructor();
+
+    public getName(): string;
+
+    public hasMultiTableSupport(): boolean;
+
+    public initialize(host: any, options?: any): void;
+
+    public unload(host: any): void;
+
+    public config(options?: any): void;
+
+    public getConfigObject(gridOptions?: any): any;
+
+    public setColumnFormat(colIndex: number, formatOptions: TextFormattingPlugin.FormatOptions|null): void;
+
+    public getColumnFormatOptions(colIndex: number, options?: any): any;
+
+    public getFormatter(colIndex: number): FieldFormatter|null;
+
+    public formatText(colIndex: number, obj: any): string;
+
+    public openDialog(colIndex: number): void;
+
+}
+
+export default TextFormattingPlugin;
+export { TextFormattingPlugin, TextFormattingPlugin as TextFormatting, TextFormattingPlugin as TextFormattingExtension };

package/lib/tr-grid-textformatting/es6/TextFormatting.js

@@ -0,0 +1,543 @@
+import {Ext} from '../../tr-grid-util/es6/Ext.js';
+import {GridPlugin} from '../../tr-grid-util/es6/GridPlugin.js';
+import {NumberFormatter} from '../../tr-grid-util/es6/NumberFormatter.js';
+import { FieldFormatter } from '../../tr-grid-util/es6/FieldFormatter.js';
+import { DateTime } from '../../tr-grid-util/es6/DateTime.js';
+
+
+/** @event TextFormattingPlugin#formatChanged
+* @description Fired only when a user click OK from the format dialog, that is generated from this extension
+* @type {Object}
+* @property {number} colIndex
+* @property {string} formatType Available options are: number, scaled, percent, and datetime
+* @property {string} field Field defined in the column
+* @property {(number|boolean)=} decimalPlaces=2
+* @property {boolean=} plusSign
+* @property {boolean=} separator
+* @property {boolean=} percentSign
+* @property {string=} scalingUnit Value can be million or billion
+* @property {boolean=} multiplyBy100
+* @property {string=} dateTimeFormat
+* @property {boolean=} useUTCTime
+*/
+
+/** @typedef {Object} TextFormattingPlugin~FormatOptions
+* @description Available options that can be specified in the `formatType` property of each column configuration object
+* @property {string=} formatType Available options are: number, scaled, percent, and datetime
+* @property {string=} field Field is required but can be defined in the column definition object
+* @property {(number|boolean)=} decimalPlaces=2
+* @property {boolean=} precisionEnabled=true If disabled, number of decimal will remain as original.
+* @property {boolean=} plusSign=false
+* @property {boolean=} separator=false Thousands separators
+* @property {boolean=} percentSign=false If the formatType is percent and the value of percentSign is not specified, the percentSign is set to true by default
+* @property {string=} scalingUnit=million Value can be million or billion
+* @property {boolean=} multiplyBy100=false
+* @property {string=} dateTimeFormat="MM/DD/YYYY"
+* @property {boolean=} useUTCTime=true
+* @property {boolean=} autoTextFormatting=true If disabled, the extension's automatic formatting will not be triggered, including `formatLogic`
+* @property {Function=} formatLogic=null If specified all default formatting will be prevented and replaced by the given function. This should be used when the column has custom rendering. The function must retrieve, format, and insert the data with the provided arguments (i.e., TextFormattingPlugin~FormatLogicArguments).
+*/
+
+/** @typedef {TextFormattingPlugin~FormatOptions} TextFormattingPlugin~ColumnOptions
+* @description Available options that can be specified on the column configuration object
+*/
+
+/** @typedef {Object} TextFormattingPlugin~GridOptions
+* @description Available options that can be specified on the grid configuration object
+* @property {boolean=} autoTextFormatting=true If disabled, the extension's automatic formatting will be disabled for all columns
+*/
+
+/** @typedef {Object} TextFormattingPlugin~FormatLogicArguments
+* @description Event argument object for formatLogic function
+* @property {number} colIndex
+* @property {number} rowIndex
+* @property {string} field
+* @property {string} formattedText Text that is formatted by the formatter of the specified column
+* @property {*} cell Grid cell instance
+* @property {Object} rowData Row data object
+* @property {Function} format Function that is used to produce formattedText
+*/
+
+/** @constructor
+* @extends {GridPlugin}
+*/
+var TextFormattingPlugin = function () {
+	this._onSectionBinding = this._onSectionBinding.bind(this);
+	this._onColumnAdded = this._onColumnAdded.bind(this);
+
+	this._hosts = [];
+};
+Ext.inherits(TextFormattingPlugin, GridPlugin);
+
+/** @type {boolean}
+* @private
+*/
+TextFormattingPlugin.prototype._noFormatting = true;
+/** @type {boolean}
+* @private
+*/
+TextFormattingPlugin.prototype._disabled = false;
+/** @type {string}
+* @private
+*/
+TextFormattingPlugin.prototype._idnSource = "";
+
+/** @public
+* @return {string}
+*/
+TextFormattingPlugin.prototype.getName = function () {
+	return "TextFormattingPlugin"; // Read Only
+};
+
+/** Plugin that has multi-table support means that it can have multiple hosts/tables and share its states across those hosts/tables.
+* @public
+* @return {boolean}
+*/
+TextFormattingPlugin.prototype.hasMultiTableSupport = function () {
+	return true;
+};
+
+/** @public
+* @param {Object} host core grid instance
+* @param {Object=} options
+*/
+TextFormattingPlugin.prototype.initialize = function (host, options) {
+	if (this._hosts.indexOf(host) >= 0) return;
+	this._hosts.push(host);
+
+	host.listen("postSectionDataBinding", this._onSectionBinding);
+	if(this._hosts.length === 1) {
+		host.listen("columnAdded", this._onColumnAdded);
+
+		this.config(options);
+	}
+};
+/** @override
+* @ignore
+*/
+TextFormattingPlugin.prototype._afterInit = function () {
+	// WOWRKAROUND : In test-resource and tr-grid-util, avoid using static variables. duplicating DateTime
+	var rtGrid = this._realTimeGrid;
+	if(rtGrid && rtGrid.setDateTimeUtil) {
+		rtGrid.setDateTimeUtil(DateTime);
+	}
+};
+/** @public
+* @param {Object} host core grid instance
+*/
+TextFormattingPlugin.prototype.unload = function (host) {
+	var at = this._hosts.indexOf(host);
+	if(at < 0) { return; }
+
+	host.unlisten("postSectionDataBinding", this._onSectionBinding);
+	host.unlisten("columnAdded", this._onColumnAdded);
+
+	this._hosts.splice(at, 1);
+};
+
+
+/** @public
+* @param {Object=} options
+*/
+TextFormattingPlugin.prototype.config = function (options) {
+	if(!options) { return; }
+
+	this._idnSource = (options["idnSource"]) ? "idn" : "";
+
+	var bool = options["autoTextFormatting"];
+	if(bool != null) {
+		this._disabled = !bool;
+	}
+
+	var columns = options.columns;
+	if(!columns) { return; }
+	// WARNING: Name colliding between column definition and format option can occur
+
+	var dirty = 0;
+	var len = columns.length;
+	for(var i = 0; i < len; ++i) {
+		dirty |= this._setColumnFormat(i, columns[i]);
+	}
+
+	// WOWRKAROUND : In test-resource and tr-grid-util, avoid using static variables. duplicating DateTime
+	var lang = options["lang"];
+	if(lang) {
+		DateTime.setLocale(lang);
+	}
+
+	if(dirty) {
+		len = this._hosts.length;
+		for(i = 0; i < len; ++i) {
+			this._hosts[i]["requestRowRefresh"]();
+		}
+	}
+};
+
+/** @public
+* @param {Object=} gridOptions
+* @return {!Object}
+*/
+TextFormattingPlugin.prototype.getConfigObject = function (gridOptions) {
+	var obj = gridOptions || {};
+	if(this._idnSource) {
+		obj.idnSource = true;
+	}
+	if(this._disabled) {
+		obj.autoTextFormatting = false;
+	}
+
+	var columns = obj.columns;
+	if(!columns) {
+		columns = obj.columns = [];
+	}
+
+	var len = this.getColumnCount();
+	for(var i = 0; i < len; ++i) {
+		var column = columns[i];
+		if(!column) {
+			column = columns[i] = {};
+		}
+		this.getColumnFormatOptions(i, column);
+		// TODO: move the formatting option (column level) into formatting property (column extension option level)
+	}
+
+	return obj;
+};
+
+/** @public
+* @param {number} colIndex
+* @param {TextFormattingPlugin~FormatOptions} formatOptions
+*/
+TextFormattingPlugin.prototype.setColumnFormat = function (colIndex, formatOptions) {
+	if(this._setColumnFormat(colIndex, formatOptions)) {
+		var len = this._hosts.length;
+		for(var i = 0; i < len; ++i) {
+			this._hosts[i]["requestRowRefresh"]();
+		}
+	}
+};
+/** @private
+* @param {number} colIndex
+* @param {TextFormattingPlugin~FormatOptions} userObj This can be column configuration object or FormatTypeObject
+* @return {boolean} Returns true if there is any change
+*/
+TextFormattingPlugin.prototype._setColumnFormat = function (colIndex, userObj) {
+	var colData = this._newColumnData(colIndex);
+	var colDef = userObj;
+	var fo = null; // Actual Format Options
+
+	var field;
+	if(colDef) { // Extract field and format type
+		// Extract options from column definition object first
+		field = colDef["field"];
+
+		var autoTextFormatting = colDef["autoTextFormatting"];
+		if(autoTextFormatting != null) {
+			colData["autoTextFormatting"] = autoTextFormatting ? true : false;
+		}
+		var formatLogic = colDef["formatLogic"];
+		if(typeof formatLogic === "function") {
+			colData["formatLogic"] = formatLogic;
+		}
+
+		// Fallback
+		fo = colDef["formatType"] || colDef["type"];
+		// Format type may be an format option object at this point
+		if(fo && typeof fo === "object") { // The formatType can be the format options (object) itself
+			if(fo["field"]) {
+				field = fo["field"];
+			}
+
+			autoTextFormatting = fo["autoTextFormatting"];
+			if(autoTextFormatting != null) {
+				colData["autoTextFormatting"] = autoTextFormatting ? true : false;
+			}
+			formatLogic = fo["formatLogic"];
+			if(typeof formatLogic === "function") {
+				colData["formatLogic"] = formatLogic;
+			}
+		} else {
+			fo = colDef;
+			// colDef = null;
+		}
+	}
+	var prevFO = colData["formatOptions"]; // For later use
+
+	// Clear previously stored data
+	colData["formatOptions"] = null;
+	colData["textFormatter"] = null;
+	colData["numberFormatter"] = null;
+
+	// Check if the provided arguments are valid and sufficient
+	if(!fo) {
+		return (prevFO) ? true : false;
+	}
+
+	var fot = fo["formatType"] || fo["type"];
+	if(!fot || typeof fot != "string") { // Format type must be string
+		return (prevFO) ? true : false;
+	}
+
+	fot = fot.toLowerCase(); // Guaranteed that all format types are case insensitive
+	if(fot === "general") { // "general" type means no formatting
+		return (prevFO) ? true : false;
+	}
+	if(!field) { // The field is not given try our best to get it
+		field = this._getField(colIndex);
+		if(!field) {
+			if(prevFO) {
+				field = prevFO["field"];
+			}
+		}
+	}
+
+	// Format option is valid after this point
+	this._noFormatting = false; // Quick workaround
+
+	// WARNING: We directly store and modify user data. This may inadvertently cause some bugs
+	fo["field"] = field;
+	fo["formatType"] = fot;
+	if(!fo["formattedField"]) {
+		fo["formattedField"] = field + "_FORMATTED";
+	}
+	if(fo["idnSource"] == null) {
+		fo["idnSource"] = this._idnSource;
+	}
+
+	var ff = new FieldFormatter(fo); // FieldFormatter will be used for rendering
+	var nf = null;
+	if(fot == "number" || fot == "scaled" || fot == "percent") {
+		var precision = fo["decimalPlaces"];
+		var precisionEnabled = fo["precisionEnabled"];
+		if(typeof precision == "number"){
+			colData["precision"] = precision;
+			if(precisionEnabled == null){
+				precisionEnabled = true;
+			}
+		} else if(precision == true){
+			colData["precision"] = null;
+			precision = 2;
+			precisionEnabled = true;
+		} else if(precision === false) {
+			colData["precision"] = null;
+			precision = 0;
+			precisionEnabled = false;
+		} else {
+			colData["precision"] = null;
+			precision = 2;
+			if(precisionEnabled == null){
+				precisionEnabled = true;
+			}
+		}
+
+		fo["decimalPlaces"] = precision;
+		fo["precisionEnabled"] = precisionEnabled;
+
+		if(fot === "percent") {
+			var percentSign = fo["percentSign"];
+			if(percentSign == null) {
+				fo["percentSign"] = true;
+			} else {
+				colData["percentSign"] = percentSign;
+			}
+		}
+
+		nf = new NumberFormatter(fo);
+		ff.setNumberFormatter(nf.format);
+
+	}
+
+	colData["formatOptions"] = fo;
+	colData["textFormatter"] = ff;
+	colData["numberFormatter"] = nf;
+
+	// Everything is done. Request for re-rendering
+	return true;
+};
+/** @public
+* @param {number} colIndex
+* @param {Object=} options Object for storing returned data
+* @return {!Object}
+*/
+TextFormattingPlugin.prototype.getColumnFormatOptions = function (colIndex, options) {
+	if(!options) { options = {}; }
+
+	var colData = this._getColumnData(colIndex);
+	if(colData) {
+		var formatOptions = colData["formatOptions"];
+		var textFormatter = colData["textFormatter"];
+		var numberFormatter = colData["numberFormatter"];
+
+		if(colData["autoTextFormatting"] != null) {
+			options["autoTextFormatting"] = colData["autoTextFormatting"];
+		}
+		if(formatOptions) {
+			options["formatType"] = formatOptions.formatType || formatOptions.type;
+		}
+		if(textFormatter) {
+			textFormatter.getOptions(options);
+		}
+		if(numberFormatter) {
+			numberFormatter.getOptions(options);
+			var precision = colData["precision"];
+			if(precision != null){
+				options["decimalPlaces"] = precision;
+			} else {
+				delete options["decimalPlaces"];
+			}
+
+			if(options["formatType"] === "percent" && colData["percentSign"] != null) {
+				options["percentSign"] = colData["percentSign"];
+			}
+		}
+	}
+	return options;
+};
+/** @private
+* @param {Object} e
+*/
+TextFormattingPlugin.prototype._onColumnAdded = function(e) {
+	if(e.context) {
+		this._setColumnFormat(e.colIndex, e.context);
+	}
+};
+
+/** @private
+* @param {Object} colData
+* @return {boolean}
+*/
+TextFormattingPlugin._hasAutoFormatting = function (colData) {
+	if(colData) {
+		if(
+			colData["autoTextFormatting"] === false ||
+			colData["percentBar"] ||
+			colData["rangeBar"]
+		) {
+			return false;
+		}
+		return true;
+	}
+	return false;
+};
+
+/** @private
+* @param {Object} e
+*/
+TextFormattingPlugin.prototype._onSectionBinding = function (e) {
+	if(this._noFormatting || this._disabled) { return; }
+
+	var section = e["section"];
+	var dataRows = e["dataRows"];
+	var colCount = section.getColumnCount();
+	var fromR = /** @type{number} */(e["fromRowIndex"]);
+	var toR = /** @type{number} */(e["toRowIndex"]);
+	var arg = {};
+
+	for (var c = 0; c < colCount; ++c) {
+		var colData = this._getColumnData(c); // will get column data from hosts[0] only
+		if(!TextFormattingPlugin._hasAutoFormatting(colData)) {
+			continue;
+		}
+
+		var formatOptions = /** @type{TextFormattingPlugin~FormatOptions} */(colData["formatOptions"]);
+
+		if(!formatOptions) { continue; }
+
+		var formatter = colData["textFormatter"];
+		var formatLogic = colData["formatLogic"];
+
+		arg.colIndex = c;
+		arg.field = formatter.getField();
+		arg.format = formatter.format; // WARNING: Accessing private member
+		for (var r = fromR; r < toR; ++r) {
+			var cell = section.getCell(c, r, false);
+			if(cell) {
+				var rowData = this._getRowData(dataRows[r]);
+				arg.formattedText = TextFormattingPlugin._getFormattedText(formatter, rowData, cell);
+				if(formatLogic) {
+					arg.rowIndex = r;
+					arg.cell = cell;
+					arg.rowData = rowData;
+					formatLogic(arg);
+				} else {
+					cell.setTextContent(arg.formattedText);
+				}
+			}
+		}
+	}
+};
+
+/** @private
+* @param {FieldFormatter} formatter
+* @param {Object} rowData
+* @param {Object} cell Grid cell instance
+* @return {string}
+*/
+TextFormattingPlugin._getFormattedText = function(formatter, rowData, cell) {
+	if(rowData) {
+		return formatter.formatRowData(rowData);
+	} else {
+		var content = cell.getContent();
+		if(content) {
+			return formatter.formatValue(content.textContent);
+		}
+	}
+	return "";
+};
+
+/** @public
+* @param {number} colIndex
+* @return {FieldFormatter}
+*/
+TextFormattingPlugin.prototype.getFormatter = function (colIndex) {
+	return this._getColumnOption(colIndex, "textFormatter") || null;
+};
+/** Format the given object by the formatter from the specified column. The object is converted to string, if no formatter is specified
+* @public
+* @param {number} colIndex
+* @param {*} obj The object can be string, number, boolean, or Date object
+* @return {string}
+*/
+TextFormattingPlugin.prototype.formatText = function (colIndex, obj) {
+	if(obj != null) {
+		var formatter = this.getFormatter(colIndex);
+		return (formatter) ? formatter.formatValue(obj) : obj + "";
+	}
+	return "";
+};
+
+/** @public
+* @param {number} colIndex
+*/
+TextFormattingPlugin.prototype.openDialog = function (colIndex) {
+	if (!this._formatDialog) {
+		this._formatDialog = document.createElement('tr-grid-format-dialog');
+		this._formatDialog.addEventListener('data-change', this._onFormatDialogDataChange.bind(this));
+	}
+
+	if (this._formatDialog.is === 'tr-grid-format-dialog') { // Check that tr-grid-format-dialog is imported
+		var options = this.getColumnFormatOptions(colIndex);
+		this._formatDialog.data = {
+			valueFormatTab: options
+		};
+		this._formatDialog.colIndex = colIndex;
+		this._formatDialog.show();
+	}
+};
+
+/** @private
+* @param {Object} e
+*/
+TextFormattingPlugin.prototype._onFormatDialogDataChange = function (e) {
+	var colIndex = this._formatDialog.colIndex;
+	var obj = e.detail.data.valueFormatTab;
+	this.setColumnFormat(colIndex, obj);
+
+	obj.colIndex = colIndex;
+	this._dispatch("formatChanged", obj);
+};
+
+
+
+export default TextFormattingPlugin;
+export { TextFormattingPlugin, TextFormattingPlugin as TextFormatting, TextFormattingPlugin as TextFormattingExtension };

package/lib/tr-grid-textformatting/es6/index.d.ts

@@ -0,0 +1 @@
+export * from "./TextFormatting";

package/lib/tr-grid-textformatting/es6/index.js

@@ -0,0 +1 @@
+export * from "./TextFormatting.js";

package/lib/tr-grid-titlewrap/es6/TitleWrap.d.ts

@@ -0,0 +1,27 @@
+import { Ext } from '../../tr-grid-util/es6/Ext.js';
+import { GridPlugin } from '../../tr-grid-util/es6/GridPlugin.js';
+
+declare class TitleWrapPlugin extends GridPlugin {
+
+    constructor();
+
+    public getName(): string;
+
+    public initialize(host: any, options?: any): void;
+
+    public unload(host: any): void;
+
+    public config(options?: any): void;
+
+    public getConfigObject(gridOptions?: any): any;
+
+    public adjustRowHeight(sectionRef: any, from?: number|null, to?: number|null): boolean;
+
+    public adjustRowHeightAt(sectionRef: any, rowIndex: number): boolean;
+
+}
+
+declare function val(gridOptions?: any): any;
+
+export default TitleWrapPlugin;
+export { TitleWrapPlugin, TitleWrapPlugin as TitleWrap, TitleWrapPlugin as TitleWrapExtension };