@refinitiv-ui/efx-grid 6.0.57 → 6.0.59

package/lib/rt-grid/es6/Grid.d.ts

@@ -181,9 +181,9 @@ declare class Grid extends EventDispatcher {
 
     public _initDuplicateRicData(rowDef: RowDefinition|null): void;
 
-    public insertRow(rowOption?: any, rowRef?: Grid.RowReference|null): any;
+    public insertRow(rowOption?: (RowDefinition.Options|string)|null, rowRef?: Grid.RowReference|null): RowDefinition|null;
 
-    public insertRows(rowOptions: (any)[]|null, rowRef?: Grid.RowReference|null, opt_fields?: (string)[]|null): void;
+    public insertRows(rowOptions: (RowDefinition.Options|string)[]|null, rowRef?: Grid.RowReference|null, opt_fields?: (string)[]|null): void;
 
     public addStaticDataRows(dataRows: any[]|null, fields?: (string)[]|null): void;
 
@@ -323,7 +323,7 @@ declare class Grid extends EventDispatcher {
 
     public logDV(opt_options?: any): void;
 
-    public replaceRow(rowRef: Grid.RowReference|null, rowOption?: any): any;
+    public replaceRow(rowRef: Grid.RowReference|null, rowOption?: (RowDefinition.Options|string)|null): RowDefinition|null;
 
     public scrollToColumn(colIndex: number, leftOfView?: boolean|null): boolean;
 

package/lib/rt-grid/es6/Grid.js

@@ -613,6 +613,14 @@ Grid.prototype.dispose = function() {
 	this._grid.dispose();
 	this._connector.reset();
 
+	if(!this._sharedDataSource) { // make sure that it is the final grid, and that it will be dispose data
+		if(this._dt) {
+			this._dt.dispose();
+		}
+		if(this._dv) {
+			this._dv.dispose();
+		}
+	}
 	this._mainGrid = this._dt = this._dv = null;
 
 	if(this._subs) {
@@ -1573,16 +1581,16 @@ Grid.prototype.replaceColumn = function (columnOption, colRef) {
 	}
 
 	var colDef = this.getColumnDefinition(colIndex);
-	if(colDef.getChildren()) { // Parent time series field doesn't provide hidden property
+	if(colDef && colDef.getChildren().length > 0) { // Parent time series field doesn't provide hidden property
 		colConfig["hidden"] = false;
 	}
 
-	if(colConfig.id == null) {
+	if(colDef && colConfig.id == null) {
 		colConfig.id =  colDef.getId(); // retain ID
 	}
 	this._grid.startBatch("reset");
+	this.removeColumn(colIndex);
 	this.insertColumn(colConfig, colIndex);
-	this.removeColumn(colIndex + 1); // remove existing column after insert
 	this._grid.stopBatch("reset");
 };
 
@@ -2287,9 +2295,9 @@ Grid.prototype._initDuplicateRicData = function(rowDef) {
 	}
 };
 /** @public
-* @param {Object=} rowOption
+* @param {(RowDefinition~Options|string)=} rowOption
 * @param {Grid~RowReference=} rowRef Reference (i.e. row index, row id, or row definition) of the insert position
-* @returns {Object}
+* @returns {RowDefinition}
 * @example
 * var grid = new rt.Grid(grid_div, options);
 * grid.insertRow({"ric": "RIC"}, 0); // A new row is added at the top
@@ -2320,7 +2328,7 @@ Grid.prototype.insertRow = function(rowOption, rowRef) {
 	return rowDef;
 };
 /** @public
-* @param {Array.<Object>} rowOptions Array of row option object
+* @param {Array.<RowDefinition~Options|string>} rowOptions Array of row option object
 * @param {Grid~RowReference=} rowRef Reference (i.e. row index, row id, or row definition) of the insert position
 * @param {Array.<string>=} opt_fields
 * @example
@@ -3970,8 +3978,8 @@ Grid.prototype._logData = function(rowDefs, options) {
 /** @public
 * @description Replace existing row with a new row. Row ID would be changed, after row is replaced.
 * @param {Grid~RowReference} rowRef Reference (i.e. row index, row id, or row definition) of the insert position
-* @param {Object=} rowOption
-* @returns {Object}
+* @param {(RowDefinition~Options|string)=} rowOption
+* @returns {RowDefinition}
 */
 Grid.prototype.replaceRow = function(rowRef, rowOption) {
 	var rowId = this._getRowId(rowRef);

package/lib/tr-grid-column-stack/es6/ColumnStack.d.ts

@@ -14,7 +14,9 @@ declare namespace ColumnStackPlugin {
         fields: (string)[]|null,
         stacks: (ColumnStackPlugin.StackDefinition)[]|null,
         autoStacking?: boolean|null,
-        clicked?: ((...params: any[]) => any)|null
+        clicked?: ((...params: any[]) => any)|null,
+        menuElement?: Element|null,
+        menuItemClicked?: ((...params: any[]) => any)|null
     };
 
     type ColumnOptions = {

package/lib/tr-grid-column-stack/es6/ColumnStack.js

@@ -10,10 +10,12 @@ import { preventDefault } from "../../tr-grid-util/es6/EventDispatcher.js";
 
 /** @typedef {Object} ColumnStackPlugin~Options
 * @description Available options describing `columnStack` object specified in grid's option
-* @property {Array.<string>} fields Fields for stacking. The minimum is 2 fields.
+* @property {Array.<string>} fields Fields for stacking. The minimum is 2 fields
 * @property {Array.<ColumnStackPlugin~StackDefinition>} stacks List of stacking configuration
 * @property {boolean=} autoStacking Deprecated. Stacks are automatically maintained as long as its members exist
 * @property {Function=} clicked=null Event handler when user clicks on stack/expanding icon
+* @property {Element=} menuElement Element used to display a column selection list
+* @property {Function=} menuItemClicked When the menuElement is specified and menu item is clicked, an event handler is called
 */
 
 /** @typedef {Object} ColumnStackPlugin~ColumnOptions
@@ -122,6 +124,7 @@ var ColumnStackPlugin = function () {
 	this._onBeforeBatchOperation = this._onBeforeBatchOperation.bind(this);
 	this._onAfterBatchOperation = this._onAfterBatchOperation.bind(this);
 	this._onPinningChanged = this._onPinningChanged.bind(this);
+	this._onMenuItemClicked = this._onMenuItemClicked.bind(this);
 
 	this._onStackButtonClicked = this._onStackButtonClicked.bind(this);
 	this._updateUI = this._updateUI.bind(this);
@@ -165,6 +168,14 @@ ColumnStackPlugin.prototype._inResetting = false;
 * @private
 */
 ColumnStackPlugin.prototype._inPinning = false;
+/** @type {Element}
+* @private
+*/
+ColumnStackPlugin.prototype._menuElement = null;
+/** @type {Function}
+* @private
+*/
+ColumnStackPlugin.prototype._menuItemClicked = null;
 
 /** @type {number}
 * @private
@@ -201,12 +212,28 @@ ColumnStackPlugin.prototype.initialize = function (host, options) {
 	if(this._hosts.indexOf(host) >= 0) { return; }
 	this._hosts.push(host);
 
-	if(options && options["icons"]) {
-		var icons = options["icons"]["columnStack"];
-		if(icons) {
-			this._stackIconName = icons["stack"];
-			this._expandIconName = icons["expand"];
-			this._collapseIconName = icons["collapse"];
+	if(options) {
+		if(options["icons"]) {
+			var icons = options["icons"]["columnStack"];
+			if(icons) {
+				this._stackIconName = icons["stack"];
+				this._expandIconName = icons["expand"];
+				this._collapseIconName = icons["collapse"];
+			}
+		}
+
+		var opt = options["columnStack"];
+		if(opt && this._hosts.length === 1) {
+			var menuElement = opt["menuElement"];
+			if(menuElement && typeof menuElement === "object" && menuElement.nodeType === 1) {
+				menuElement.addEventListener("item-trigger", this._onMenuItemClicked);
+				this._menuElement = menuElement;
+			}
+
+			var menuItemClicked = opt["menuItemClicked"];
+			if(typeof menuItemClicked === "function") {
+				this._menuItemClicked = menuItemClicked;
+			}
 		}
 	}
 
@@ -242,6 +269,10 @@ ColumnStackPlugin.prototype.unload = function (host) {
 	host.unlisten("preSectionRender", this._onPreSectionRender);
 	host.unlisten("pinningChanged", this._onPinningChanged);
 
+	if(this._menuElement) {
+		this._menuElement.removeEventListener("item-trigger", this._onMenuItemClicked);
+	}
+
 	if(this._hosts.length <= 0) {
 		this._conflator.reset();
 		this._groupDefs.removeAllGroups();
@@ -1608,7 +1639,8 @@ ColumnStackPlugin.prototype._onStackButtonClicked = function(e) {
 				value: i,
 				selected: i === activeIndex,
 				label: this.getColumnName(colIndices[i]),
-				field: this.getColumnField(colIndices[i])
+				field: this.getColumnField(colIndices[i]),
+				colId: children[i]
 			};
 		}
 		pos["menuData"] = menuData;
@@ -1622,9 +1654,33 @@ ColumnStackPlugin.prototype._onStackButtonClicked = function(e) {
 	pos["stackId"] = colData.id;
 
 	elem.focus();
+
+	if(this._menuElement && !colData.spreading) {
+		// Populate stack member
+		var button = pos.event.srcElement;
+		var el = this._menuElement;
+		el.data = pos["menuData"];
+		el.positionTarget = button;
+		el.opened = true;
+	}
 	this._dispatch("clicked", pos);
 };
+/** @private
+* @param {Object} e
+*/
+ColumnStackPlugin.prototype._onMenuItemClicked = function(e) {
+	if(e.detail) {
+		var selectedIndex = parseInt(e.detail.value, 0);
+		var menuData = this._menuElement.data[selectedIndex];
+		var colId = menuData.colId;
+		this.setActiveColumn(colId);
+	}
+	this._menuElement.opened = false;
 
+	if(this._menuItemClicked) {
+		this._menuItemClicked(e);
+	}
+};
 /** @public
 * @description Get member column indices in a stack
 * @param {string} stackId

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

@@ -10,7 +10,7 @@ declare namespace TextFormattingPlugin {
         formatType?: string|null,
         type?: string|null,
         field?: string|null,
-        decimalPlaces?: number|null,
+        decimalPlaces?: (number|boolean)|null,
         precisionEnabled?: boolean|null,
         plusSign?: boolean|null,
         separator?: boolean|null,

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

@@ -9,9 +9,9 @@ import { DateTime } from '../../tr-grid-util/es6/DateTime.js';
 * @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, date, time and datetime
+* @property {string} formatType Available options are: number, scaled, percent, and datetime
 * @property {string} field Field defined in the column
-* @property {number=} decimalPlaces=2
+* @property {(number|boolean)=} decimalPlaces=2
 * @property {boolean=} plusSign
 * @property {boolean=} separator
 * @property {boolean=} percentSign
@@ -26,7 +26,7 @@ import { DateTime } from '../../tr-grid-util/es6/DateTime.js';
 * @property {string=} formatType Available options are: number, scaled, percent, and datetime
 * @property {string=} type Alias to formatType
 * @property {string=} field Field is required but can be defined in the column definition object
-* @property {number=} decimalPlaces=2
+* @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
@@ -34,8 +34,8 @@ import { DateTime } from '../../tr-grid-util/es6/DateTime.js';
 * @property {string=} scalingUnit Value can be million or billion
 * @property {boolean=} multiplyBy100=false
 * @property {boolean=} mutiplyBy100=false Alias of multiplyBy100
-* @property {string=} dateTimeFormat
-* @property {boolean=} useUTCTime
+* @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).
 */
@@ -306,6 +306,30 @@ TextFormattingPlugin.prototype._setColumnFormat = function (colIndex, userObj) {
   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;
     nf = new NumberFormatter(fo);
     ff.setNumberFormatter(nf.format);
   }
@@ -341,6 +365,12 @@ TextFormattingPlugin.prototype.getColumnFormatOptions = function (colIndex, opti
     }
     if (numberFormatter) {
       numberFormatter.getOptions(options);
+      var precision = colData["precision"];
+      if (precision != null) {
+        options["decimalPlaces"] = precision;
+      } else {
+        delete options["decimalPlaces"];
+      }
     }
   }
   return options;

package/lib/tr-grid-util/es6/ElementObserver.js

@@ -38,7 +38,8 @@ ElementObserver._getNewId = function () {
 	return id;
 };
 
-/** @private Observe any element
+/** Observe any element
+* @private
 * @param {Element} elem
 * @param {Function} listener
 * @param {Object=} opt_option
@@ -101,7 +102,8 @@ ElementObserver.addLanguageListener = function(element) {
 	ElementObserver._addObserver(document.documentElement, _onLanguageMutated.bind(null, element));
 };
 
-/** @public Add a listener to a html attribute
+/** Add a listener to a html attribute
+* @public
 * @param {Element} element An element within the DOM tree to watch for changes
 * @param {Function} listener A function which will be called on each attribute change
 * @param {string=} attributeName If not specified, listener will be called on every attribute change

package/lib/tr-grid-util/es6/ElementWrapper.js

@@ -63,7 +63,8 @@ ElementWrapper.prototype.getMousePosition = function(e, retObj) {
 */
 ElementWrapper.prototype.addEventListener = function(type, listener) {
 	ElementWrapper.base(this, "addEventListener", type, listener);
-	if(this._elem["on" + type] != null) { // TODO: This won't work with Custom Element
+	// TODO: This won't work with Custom Element
+	if(this._elem["on" + type] !== undefined) { // eslint-disable-line
 		this._elem.addEventListener(type, listener, false);
 	}
 };
@@ -74,7 +75,7 @@ ElementWrapper.prototype.addEventListener = function(type, listener) {
 */
 ElementWrapper.prototype.removeEventListener = function(type, listener) {
 	ElementWrapper.base(this, "removeEventListener", type, listener);
-	if(this._elem["on" + type] != null) {
+	if(this._elem["on" + type] !== undefined) { // eslint-disable-line
 		this._elem.removeEventListener(type, listener, false);
 	}
 };

package/lib/tr-grid-util/es6/GridPlugin.js

@@ -259,6 +259,11 @@ GridPlugin.prototype.getColumnIndex = function (colRef) {
 * @return {Array.<number>} column indices
 */
 GridPlugin.prototype.getColumnIndices = function (colRefs) {
+	var api = this.getGridApi();
+	if(api.getColumnIndices) {
+		return api.getColumnIndices(colRefs);
+	}
+
 	// TODO: Unify the below logics
 	if(this._compositeGrid) {
 		var allFields = this._compositeGrid.getColumnFields();

package/lib/tr-grid-util/es6/SubTable.d.ts

@@ -30,9 +30,9 @@ declare class SubTable extends ElementWrapper {
 
     public getAllCells(): (Element)[];
 
-    public getAllRows(): HTMLCollection|null;
+    public getAllRows(): (Element)[];
 
-    public getRows(): HTMLCollection|null;
+    public getRows(): (Element)[];
 
     public getRow(r: number): Element|null;
 
@@ -70,5 +70,7 @@ declare class SubTable extends ElementWrapper {
 
 declare function tdElem(e: Event|null): number;
 
+declare function trElem(colIndex: number, rowIndex?: number|null): number;
+
 export default SubTable;
 export { SubTable };