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

package/lib/statistics-row/es6/index.d.ts

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

package/lib/statistics-row/es6/index.js

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

package/lib/tr-grid-auto-tooltip/es6/AutoTooltip.d.ts

@@ -0,0 +1,46 @@
+import { Ext } from "../../tr-grid-util/es6/Ext.js";
+import { GridPlugin } from "../../tr-grid-util/es6/GridPlugin.js";
+import { Conflator } from "../../tr-grid-util/es6/Conflator.js";
+
+declare namespace AutoTooltipPlugin {
+
+    type Options = {
+        header?: boolean|null,
+        title?: boolean|null,
+        footer?: boolean|null,
+        content?: boolean|null,
+        quickMode?: boolean|null
+    };
+
+    type ColumnOptions = {
+        autoTooltip?: boolean|null
+    };
+
+}
+
+declare class AutoTooltipPlugin extends GridPlugin {
+
+    constructor(options?: AutoTooltipPlugin.Options|null);
+
+    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 applyTooltip(colIndex: number, fromR?: number|null, toR?: number|null): void;
+
+    public applyTooltipToColumns(colIndices?: (number)[]|null): void;
+
+    public applyTooltipToAllColumns(): void;
+
+    public requestTooltipUpdate(): void;
+
+}
+
+export default AutoTooltipPlugin;
+export { AutoTooltipPlugin, AutoTooltipPlugin as AutoTooltip, AutoTooltipPlugin as AutoTooltipExtension };

package/lib/tr-grid-auto-tooltip/es6/AutoTooltip.js

@@ -0,0 +1,617 @@
+import { Ext } from "../../tr-grid-util/es6/Ext.js";
+import { GridPlugin } from "../../tr-grid-util/es6/GridPlugin.js";
+import { Conflator } from "../../tr-grid-util/es6/Conflator.js";
+
+/** @private
+* @type {boolean}
+*/
+let isSafari = navigator.vendor &&
+	navigator.vendor.indexOf('Apple') > -1 &&
+	navigator.userAgent &&
+	navigator.userAgent.indexOf('CriOS') == -1 &&
+	navigator.userAgent.indexOf('FxiOS') == -1;
+
+/** @typedef {Object} AutoTooltipPlugin~Options
+* @description Available options describing `autoTooltip` object specified in grid's option
+* @property {boolean=} header=false If true, text in the header sections (top section) will be qualified for showing tooltip.
+* @property {boolean=} title=false Alias to `header`
+* @property {boolean=} footer=false If true, text in the footer sections will be qualified for showing tooltip.
+* @property {boolean=} content=true If true, text in the content section will be qualified for showing tooltip. Use autoTooltip flag in column configuration to turn on auto-tooltip for individual column
+* @property {boolean=} quickMode=false Deprecated
+*/
+
+/** @typedef {Object} AutoTooltipPlugin~ColumnOptions
+* @description Available column options specified in grid's column configuration
+* @property {boolean=} autoTooltip=false If enabled, the column is qualified for showing tooltip
+*/
+
+/** @constructor
+* @param {AutoTooltipPlugin~Options=} options
+* @extends {GridPlugin}
+*/
+let AutoTooltipPlugin = function (options) {
+	this.applyTooltipToAllColumns = this.applyTooltipToAllColumns.bind(this);
+	this._onPreSectionDataBinding = this._onPreSectionDataBinding.bind(this);
+	this._onPostSectionDataBinding = this._onPostSectionDataBinding.bind(this);
+	this._onColumnAdded = this._onColumnAdded.bind(this);
+
+	this._requestNonContentSectionUpdate = this._requestNonContentSectionUpdate.bind(this);
+	this._nonContentSectionUpdateConflator = new Conflator(300, this._requestNonContentSectionUpdate);
+
+	this._requestContentSectionUpdate = this._requestContentSectionUpdate.bind(this);
+	this._contentSectionUpdateConflator = new Conflator(300, this._requestContentSectionUpdate);
+
+	this.requestTooltipUpdate = this.requestTooltipUpdate.bind(this);
+	this._tooltipUpdateConflator = new Conflator(300, this.requestTooltipUpdate);
+
+	this._hosts = [];
+
+	if (options) {
+		this.config({ autoTooltip: options });
+	}
+};
+Ext.inherits(AutoTooltipPlugin, GridPlugin);
+
+/** @private
+* @param {Object} column
+* @return {boolean}
+*/
+AutoTooltipPlugin._isColumnVisible = function(column) {
+	if(!column) {
+		return false;
+	}
+
+	if(column.getVisibility && !column.getVisibility()) {
+		return false;
+	}
+
+	let colElem = column.getElement();
+	if(!colElem) {
+		return false;
+	}
+
+	return true;
+};
+
+/** @private
+* @param {Array.<Object>} hosts
+* @return {boolean}
+*/
+AutoTooltipPlugin._isUpdateRequired = function(hosts) {
+	let len = hosts.length;
+	if(len <= 0 || isSafari) {
+		return false;
+	}
+	return true;
+};
+
+/** If true, include title sections into the calculation
+* @type {boolean}
+* @private
+*/
+AutoTooltipPlugin.prototype._title = false;
+/** If true, include footer sections into the calculation
+* @type {boolean}
+* @private
+*/
+AutoTooltipPlugin.prototype._footer = false;
+/** If true, include content section into the calculation
+* @type {boolean}
+* @private
+*/
+AutoTooltipPlugin.prototype._contentTooltip = true;
+/** @type {number}
+* @private
+*/
+AutoTooltipPlugin.prototype._applyTimer = 0;
+/** @type {number}
+* @private
+*/
+AutoTooltipPlugin.prototype._calcDelay = 300;
+
+/** @type {boolean}
+* @private
+*/
+AutoTooltipPlugin.prototype._nonContentSectionUpdated = false;
+
+/** @public
+* @return {string}
+*/
+AutoTooltipPlugin.prototype.getName = function () {
+	return "AutoTooltipPlugin"; // Read Only
+};
+
+/** @public
+* @param {Object} host core grid
+* @param {Object=} options
+*/
+AutoTooltipPlugin.prototype.initialize = function (host, options) {
+	if (this._hosts.indexOf(host) >= 0) { return; }
+
+	this._hosts.push(host);
+
+	this.config(options);
+
+	if (isSafari) {
+		// ignore safari browser.
+		// casue safari will automatically show tooltip when text is ellipsis.
+		return;
+	}
+	host.listen("preSectionDataBinding", this._onPreSectionDataBinding);
+	host.listen("postSectionDataBinding", this._onPostSectionDataBinding);
+	host.listen("widthChanged", this.requestTooltipUpdate);
+	host.listen("columnAdded", this._onColumnAdded);
+
+	// In case of lazy loading
+	this._requestAllSectionsUpdate();
+};
+
+/** @public
+* @param {Object} host core grid
+*/
+AutoTooltipPlugin.prototype.unload = function (host) {
+	let at = this._hosts.indexOf(host);
+	if (at < 0) { return; }
+	this._hosts.splice(at, 1);
+
+	host.unlisten("preSectionDataBinding", this._onPreSectionDataBinding);
+	host.unlisten("postSectionDataBinding", this._onPostSectionDataBinding);
+	host.unlisten("widthChanged", this.requestTooltipUpdate);
+	host.unlisten("columnAdded", this._onColumnAdded);
+
+	if (!this._hosts.length) {
+		this._tooltipUpdateConflator.reset();
+		this._nonContentSectionUpdateConflator.reset();
+	}
+
+	this._dispose();
+};
+
+/** @public
+* @param {Object=} options Grid configuration object
+*/
+AutoTooltipPlugin.prototype.config = function (options) {
+	if (!options) { return; }
+
+	let extOptions = options.autoTooltip;
+	if(extOptions) {
+		// header is alias of title
+		let val = extOptions["title"] || extOptions["header"];
+		if (val != null) {
+			this._title = val ? true : false;
+		}
+		val = extOptions["footer"];
+		if (val != null) {
+			this._footer = val ? true : false;
+		}
+		// Enable auto tooltip to all column by default
+		val = extOptions["content"];
+		if (val != null) {
+			this._contentTooltip = val ? true : false;
+		}
+	}
+
+	// Retrive auto tooltip data from columns
+	let columns = options["columns"];
+	if (columns) {
+		let len = columns.length;
+		for (let c = 0; c < len; ++c) {
+			this._configColumn(c, columns[c]);
+		}
+	}
+};
+
+/** @public
+* @param {Object=} gridOptions
+* @return {!Object}
+*/
+AutoTooltipPlugin.prototype.getConfigObject = function (gridOptions) {
+	let obj = gridOptions || {};
+
+	let columns = obj.columns;
+	if(!columns) {
+		columns = obj.columns = [];
+	}
+
+	let len = this.getColumnCount();
+	for(let i = 0; i < len; ++i) {
+		let column = columns[i];
+		if(!column) {
+			column = columns[i] = {};
+		}
+
+		let colOptions = this._getColumnOption(i, "autoTooltip");
+		if(colOptions === true) {
+			column.autoTooltip = true;
+		}
+	}
+
+	let extOptions = obj.autoTooltip;
+	if(!extOptions) {
+		extOptions = obj.autoTooltip = {};
+	}
+
+	if(this._title === true) {
+		extOptions.title = true;
+	}
+
+	if(this._contentTooltip === true) {
+		extOptions.content = true;
+	}
+
+	if(this._footer === true) {
+		extOptions.footer = true;
+	}
+
+	return obj;
+};
+
+/** @private
+* @param {number} colIndex
+* @param {number} columnConfig
+*/
+AutoTooltipPlugin.prototype._configColumn = function(colIndex, columnConfig) {
+	if(columnConfig) {
+		let val = columnConfig["autoTooltip"];
+		if (val != null) {
+			this._newColumnData(colIndex)["autoTooltip"] = val ? true : false;
+		}
+	}
+};
+
+/** Force update and calculation on a single column. It is not recommended to be used multiple time successively
+* @public
+* @param {number} colIndex Column index
+* @param {number=} fromR Start row index
+* @param {number=} toR End row index
+*/
+AutoTooltipPlugin.prototype.applyTooltip = function (colIndex, fromR, toR) {
+	let hosts = this._hosts;
+	if(!AutoTooltipPlugin._isUpdateRequired(hosts)) {
+		return;
+	}
+
+	for (let i = 0; i < hosts.length; ++i) {
+		let host = this._hosts[i];
+		if (this._title) {
+			let titles = host.getAllSections("title");
+			for (let t = titles.length; --t >= 0;) {
+				this._updateNonContentSection(titles[t], colIndex);
+			}
+		}
+		if (this._footer) {
+			let footers = host.getAllSections("footer");
+			for (let j = footers.length; --j >= 0;) {
+				this._updateNonContentSection(footers[j], colIndex);
+			}
+		}
+
+		if(this._isTooltipCandidate(colIndex)) {
+			this._updateContentSection(host.getSection("content"), colIndex, fromR, toR);
+		}
+	}
+};
+
+/** Force update and calculation on specific columns
+* @public
+* @param {Array.<number>=} colIndices Column indices
+*/
+AutoTooltipPlugin.prototype.applyTooltipToColumns = function (colIndices) {
+	let host = this._hosts ? this._hosts[0] : null;
+	if (host && host.getElement()) {
+		let len = colIndices ? colIndices.length : 0;
+		for (let i = 0; i < len; ++i) {
+			this.applyTooltip(colIndices[i]);
+		}
+	}
+};
+
+/** Force update and calculation on all columns
+* @public
+*/
+AutoTooltipPlugin.prototype.applyTooltipToAllColumns = function () {
+	this._applyTimer = 0;
+	let colCount = this.getColumnCount();
+	for (let c = 0; c < colCount; ++c) {
+		this.applyTooltip(c);
+	}
+};
+
+/** This is similar applyTooltipToColumns() method, but it consolidate multiple requests into one for better performance
+* @public
+*/
+AutoTooltipPlugin.prototype.requestTooltipUpdate = function () {
+	if(this._tooltipUpdateConflator.conflate()) {
+		return;
+	}
+
+	this.applyTooltipToAllColumns();
+};
+
+/**
+* @private
+*/
+AutoTooltipPlugin.prototype._requestAllSectionsUpdate = function () {
+	if(!this._nonContentSectionUpdated) {
+		this._requestNonContentSectionUpdate();
+	}
+
+	this._requestContentSectionUpdate();
+};
+
+/** @private
+*/
+AutoTooltipPlugin.prototype._requestNonContentSectionUpdate = function () {
+	if(this._nonContentSectionUpdateConflator.conflate()) {
+		return;
+	}
+
+	let hosts = this._hosts;
+	if(!AutoTooltipPlugin._isUpdateRequired(hosts)) {
+		return;
+	}
+
+	this._nonContentSectionUpdated = true;
+
+	let colCount = this.getColumnCount();
+	let sections, s, c;
+	for(let i = 0; i < hosts.length; ++i) {
+		let host = hosts[i];
+
+		sections = host.getAllSections("title");
+		for(s = 0; s < sections.length; s++) {
+			for(c = 0; c < colCount; c++) {
+				this._updateNonContentSection(sections[s], c);
+			}
+		}
+
+		sections = host.getAllSections("footer");
+		for(s = 0; s < sections.length; s++) {
+			for(c = 0; c < colCount; c++) {
+				this._updateNonContentSection(sections[s], c);
+			}
+		}
+	}
+};
+
+
+/** @private
+*/
+AutoTooltipPlugin.prototype._requestContentSectionUpdate = function () {
+	if(this._contentSectionUpdateConflator.conflate()) {
+		return;
+	}
+
+	let hosts = this._hosts;
+	if(!AutoTooltipPlugin._isUpdateRequired(hosts)) {
+		return;
+	}
+
+	let colCount = this.getColumnCount();
+	for(let i = 0; i < hosts.length; ++i) {
+		let section = hosts[i].getSection("content");
+		for(let c = 0; c < colCount; c++) {
+			if(this._isTooltipCandidate(c)) {
+				this._updateContentSection(section, c);
+			}
+		}
+	}
+};
+
+/**
+* @private
+* @param {Object} section ILayoutGrid
+* @param {number} colIndex Column index
+* @return {boolean} True if there is any change, otherwise false
+*/
+AutoTooltipPlugin.prototype._updateNonContentSection = function (section, colIndex) {
+	if(!section) { return false; }
+
+	let column = section.getColumn(colIndex);
+	if(!AutoTooltipPlugin._isColumnVisible(column)) {
+		return false;
+	}
+
+	let rowCount = section.getRowCount();
+	for(let r = 0; r < rowCount; ++r) {
+		let cell = section.getCell(colIndex, r, false); // Ignore cell span
+		if(!cell || !cell.isVisible()) { return false; }
+
+		let elem = cell.getContent();
+		if(!elem) { return false; }
+
+		let tooltipInfo = cell.getTooltipInfo();
+		if(tooltipInfo) {
+			if(tooltipInfo["userTooltip"] != null ||
+				tooltipInfo["groupHeaderDefault"] != null ||
+				tooltipInfo["columnDefault"] != null) {
+
+				cell.setTooltipInfo("clippedText", false);
+				cell.removeAttribute("ef-title");
+				continue;
+			}
+		}
+
+		// Set tooltip only if text's length is longer than column width.
+		let sw = elem.scrollWidth;
+		if(sw && sw > elem.offsetWidth) {
+			cell.setTooltipInfo("clippedText", true);
+
+			let tooltip = cell.getTextContent();
+			cell.setTooltipInfo("clippedTextTooltip", tooltip);
+			cell.setAttribute("ef-title", tooltip);
+		} else {
+			cell.setTooltipInfo("clippedText", false);
+			cell.removeAttribute("ef-title");
+		}
+		cell.updateTooltip();
+	}
+	return true;
+};
+
+/**
+* @private
+* @param {Object} section ILayoutGrid
+* @param {number} colIndex Column index
+* @param {number=} fromR Start row index
+* @param {number=} toR End row index
+* @return {boolean} True if there is any change, otherwise false
+*/
+AutoTooltipPlugin.prototype._updateContentSection = function (section, colIndex, fromR, toR) {
+	if (!section) { return false; }
+
+	if (fromR == null) {
+		fromR = section.getFirstIndexInView();
+	} else if(!fromR) {
+		fromR = 0;
+	}
+
+	if (toR == null) {
+		toR = section.getLastIndexInView() + 1;
+	}
+
+	if (fromR >= toR) {
+		return false;
+	}
+
+	let columnObj = section.getColumn(colIndex);
+	if (!columnObj) {
+		return false;
+	}
+
+	if(columnObj.getVisibility && !columnObj.getVisibility()) {
+		return false;
+	}
+
+	let colElem = columnObj.getElement();
+	if (!colElem) {
+		return false;
+	}
+
+	for (let r = fromR; r < toR; ++r) {
+		let cell = section.getCell(colIndex, r, false); // Ignore cell span
+		if (cell && cell.isVisible()) {
+
+			if (cell._userDefinedTooltip == null) {
+				let tooltipProp = cell.getTooltip() || cell.getAttribute('ef-title');
+				cell._userDefinedTooltip = tooltipProp || '';
+			}
+
+			let elem = cell.getContent();
+			let tooltip = "";
+			if (elem) {
+				let sw = elem.scrollWidth;
+
+				// Set tooltip only if text's length is longer than column width.
+				if (sw && sw > elem.offsetWidth) {
+					tooltip = cell.getTextContent(); // TODO: Allow custom tooltip text
+				} else if (cell._userDefinedTooltip) {
+					tooltip = cell._userDefinedTooltip;
+				}
+			}
+
+			// for check when row is changed we will clear cache in _onPreSectionDataBinding event
+			cell._previousPos = r + '-' + colIndex;
+
+			// TODO: Avoiding using getter and setter in the same loop
+			cell.setTooltip(tooltip);
+
+			// to make sure ef-title value will actually change
+			cell.setAttribute('ef-title', tooltip);
+		}
+	}
+	return true;
+};
+
+/** Use for clear tooltip cache in cell when data change (from setData method) or row data change (from user scroll grid)
+* @private
+* @param {Object} section ILayoutGrid
+* @param {number} colIndex Column index
+* @param {number=} fromRowIndex Start row index
+* @param {number=} toRowIndex End row index
+* @param {boolean=} isDataChange=false Case data is actually changed
+*/
+AutoTooltipPlugin.prototype._clearTooltipCache = function (section, colIndex, fromRowIndex, toRowIndex, isDataChange) {
+	if(!this._isTooltipCandidate(colIndex)) {
+		return;
+	}
+
+	for (let rowIndex = fromRowIndex; rowIndex < toRowIndex; rowIndex++) {
+		let cell = section.getCell(colIndex, rowIndex);
+		// if isDataChange = true
+		if (isDataChange || (cell && cell._userDefinedTooltip != null)) {
+			cell._userDefinedTooltip = null;
+
+			// Need to check cell._previousPos
+			// because sometime _onPreSectionDataBinding will be call twice
+			// so if we carelessly clear all tooltip then the tooltip that user assign by himself will be accidentally delete
+			// Therefore, in this case we will try to move change ef-title attribute into title instead
+			// to avoid conflict about ef-title and title
+			// and if user have intention to change tooltip by himself (in case data update)
+			// it gonna overwrite title attribute alone
+			if (cell._previousPos === rowIndex + '-' + colIndex
+				&& !isDataChange // in case isDataChange be true then we need to clear all tooltip cache in else block
+			) {
+				let tooltip = cell.getTooltip() || cell.getAttribute('ef-title');
+				if (tooltip) {
+					cell.removeAttribute('ef-title');
+					cell.setTooltip(tooltip);
+				}
+			}
+			// in case row change, data change by sorting or filter or data update we can freely clear previous tooltip
+			else {
+				cell.removeAttribute('ef-title');
+				cell.setTooltip('');
+			}
+		}
+	}
+};
+
+/** @private
+* @param {Object} e event from preSectionDataBinding
+*/
+AutoTooltipPlugin.prototype._onPreSectionDataBinding = function (e) {
+	if (e && e.sectionType === "content") {
+		let colCount = this.getColumnCount();
+		let isDataChange = e.actualUpdate === true;
+		for (let c = 0; c < colCount; ++c) {
+			this._clearTooltipCache(e.section, c, e.fromRowIndex, e.toRowIndex, isDataChange);
+		}
+	}
+};
+
+/** @private
+* @param {Object} e event from preSectionDataBinding
+*/
+AutoTooltipPlugin.prototype._onPostSectionDataBinding = function (e) {
+	this._requestAllSectionsUpdate();
+};
+
+/** @private
+* @param {Object} e
+*/
+AutoTooltipPlugin.prototype._onColumnAdded = function(e) {
+	if(e.context && e.colIndex != null) {
+		this._configColumn(e.colIndex, e.context);
+		this._nonContentSectionUpdated = false; // Allow title/footer update in postSectionDataBinding
+	}
+};
+
+
+/** Check if the content section of the given column is eligible for tooltip processing
+* @private
+* @param {number} colIndex
+* @return {boolean}
+*/
+AutoTooltipPlugin.prototype._isTooltipCandidate = function (colIndex) {
+	let bool = this._getColumnOption(colIndex, "autoTooltip");
+	if(bool != null) {
+		return bool ? true : false;
+	}
+	return this._contentTooltip;
+};
+
+
+
+export default AutoTooltipPlugin;
+export { AutoTooltipPlugin, AutoTooltipPlugin as AutoTooltip, AutoTooltipPlugin as AutoTooltipExtension };

package/lib/tr-grid-auto-tooltip/es6/index.d.ts

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

package/lib/tr-grid-auto-tooltip/es6/index.js

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