@refinitiv-ui/efx-grid 6.0.69 → 6.0.71

package/lib/core/es6/grid/Core.d.ts

@@ -447,5 +447,7 @@ declare function path(obj: ElementWrapper|Element|Event|MouseEvent, context?: an
 
 declare function cellElement(): ElementWrapper;
 
+declare function toR(): void;
+
 export default Core;
 export { Core };

package/lib/core/es6/grid/Core.js

@@ -33,6 +33,8 @@ import VirtualizedLayoutGrid from "./VirtualizedLayoutGrid.js";
 */
 /** @event Core#beforeContentBinding */
 /** @event Core#postSectionDataBinding */
+/** @event Core#firstRendered */
+/** @event Core#afterContentBinding */
 /** @event Core#rowHighlighted */
 
 /** @event Core#rowAdded
@@ -203,6 +205,8 @@ var Core = function (opt_initializer) {
 		"beforeContentBinding",
 		"preSectionDataBinding",
 		"postSectionDataBinding",
+		"firstRendered",
+		"afterContentBinding",
 		"rowExpansionBinding",
 		"rowHighlighted",
 		"preForcedUpdate",
@@ -555,6 +559,10 @@ Core.prototype._groupDefs = null;
 * @private
 */
 Core.prototype._batches = null;
+/** @type {boolean}
+* @private
+*/
+Core.prototype._firstRendered = false;
 //#region Public Methods
 
 /**
@@ -562,7 +570,7 @@ Core.prototype._batches = null;
 * @return {string}
 */
 Core.getVersion = function () {
-	return "5.1.77";
+	return "5.1.80";
 };
 /** {@link ElementWrapper#dispose}
 * @override
@@ -1370,6 +1378,7 @@ Core.prototype.getColumnCount = function () {
 * @fires Core#preSectionDataBinding
 * @fires Core#columnDataBinding
 * @fires Core#postSectionDataBinding
+* @fires Core#afterContentBinding
 */
 Core.prototype.setColumnCount = function(num) {
 	var colCount = this._layoutX.getLaneCount();
@@ -1398,6 +1407,7 @@ Core.prototype.setColumnCount = function(num) {
 * @fires Core#preSectionDataBinding
 * @fires Core#columnDataBinding
 * @fires Core#postSectionDataBinding
+* @fires Core#afterContentBinding
 */
 Core.prototype.insertColumn = function (index, jsonObj) {
 	var prevCount = this.getColumnCount();
@@ -2013,6 +2023,7 @@ Core.prototype._deserializeColumn = function (index, jsonObj) {
 * @fires Core#preSectionDataBinding
 * @fires Core#columnDataBinding
 * @fires Core#postSectionDataBinding
+* @fires Core#afterContentBinding
 */
 Core.prototype.addRow = function (opt_num) {
 	if (opt_num == null) { opt_num = 1; }
@@ -3817,6 +3828,7 @@ Core.prototype.synchronizeHScrollbar = function (subGrid) {
 * @fires Core#preSectionDataBinding
 * @fires Core#columnDataBinding
 * @fires Core#postSectionDataBinding
+* @fires Core#afterContentBinding
 */
 Core.prototype.updateRowData = function (sectionRef, fromRowIndex, lastRowIndex, userParam) {
 	var ss = this.getSectionSettings(sectionRef || "content");
@@ -4951,7 +4963,9 @@ Core.prototype._onSectionDataChanged = function (e) {
 		rowDataCollection = dataView.getMultipleRowData(rids, fromR, toR);
 		e["dataRows"] = rowDataCollection;
 	}
-	if(e["sectionType"] === "content"){
+
+	var isContentSection = e["sectionType"] === "content";
+	if(isContentSection){
 		this._dispatch("beforeContentBinding", e);
 	}
 	this._dispatch("preSectionDataBinding", e);
@@ -4985,10 +4999,24 @@ Core.prototype._onSectionDataChanged = function (e) {
 	this._dispatch("postSectionDataBinding", e);
 	this._dispatchRowExpansionBinding(e);
 
+	if(isContentSection){
+		if(!this._firstRendered) {
+			this._dispatch("firstRendered", e);
+			this._firstRendered = true;
+		}
+		this._dispatch("afterContentBinding", e);
+	}
 	section._startBindingSession(false);
 	this._dispatchingDataChanged = false;
 };
 
+/** @public
+* @ignore
+*/
+Core.prototype.resetInternalState = function() {
+	this._firstRendered = false;
+};
+
 /** @private
 * @param {VScrollbar|HScrollbar} scrollbar
 * @returns {boolean}

package/lib/core/es6/grid/VirtualizedLayoutGrid.js

@@ -775,7 +775,14 @@ VirtualizedLayoutGrid.prototype.getFirstIndexInView = function () {
 
 /** @inheritDoc */
 VirtualizedLayoutGrid.prototype.getLastIndexInView = function () {
-	return this._firstIndex + this._getInnerRowCount() - 1;
+	var li = this._firstIndex + this._getInnerRowCount() - 1;
+	var core = this._grid._getContext();
+	var dv = core.getDataSource();
+	var actualLastIndex = dv ? dv.getRowCount() - 1 : -1;
+	if (li > actualLastIndex) { //Avoid incorrect index because the delay of row count synchronization after filtering
+		return actualLastIndex;
+	}
+	return li;
 };
 
 /** @inheritDoc */

package/lib/filter-dialog/lib/filter-dialog.js

@@ -137,7 +137,7 @@ class FilterDialog extends BasicElement {
 	constructor() {
 		super();
 
-		this._updateDialogHeight = this._updateDialogHeight.bind(this);
+		this._onWindowResized = this._onWindowResized.bind(this);
 		this._afterDialogOpened = this._afterDialogOpened.bind(this);
 
 		this.lang = "en";
@@ -155,7 +155,7 @@ class FilterDialog extends BasicElement {
 			"autoRepositioning": false,
 			"uiBlocking": true
 		});
-		this._dialogHeightTimerId = 0;
+		this._winResizedTimer = 0;
 		ElementObserver.addLanguageListener(this);
 	}
 
@@ -417,7 +417,9 @@ class FilterDialog extends BasicElement {
 		if (changedProps.has("isShown")) {
 			if (this.isShown) {
 				this._updateUIState(); // should updateUIState everytime popup being show
-				this._popup.show(); // Update position
+				if(this._popup.isHidden()) { // If popup is not already in doc, append it
+					this._popup.show(); // Popup position will also be modified
+				}
 				setTimeout(this._afterDialogOpened, 0); //use setTimeout to make sure everything is rendered before focus
 			} else { // This is to handle the case where isShown is directly modified from the dialog. We need to synchronize the states
 				this._popup.hide();
@@ -429,13 +431,16 @@ class FilterDialog extends BasicElement {
 	* @private
 	*/
 	_afterDialogOpened() {
-		if(this.isShown) {
-			this._cancelBtn.focus(); // Keep focus on cancel button when open dialog
-			this._updateDialogHeight(true);
-			if(!this._firstRendered) {
-				this._firstRendered = true;
-				this._popup.show(); // Update position
-			}
+		if(!this.isShown) {
+			return;
+		}
+
+		this._cancelBtn.focus(); // Keep focus on cancel button when open dialog
+		this._updateDialogHeight(); // position of the popup element will always be updated
+
+		var popupElem = this._popup.getElement();
+		if(popupElem) {// After all changes, ensure that visibility is reset back
+			popupElem.style.visibility = "";
 		}
 	}
 
@@ -451,8 +456,11 @@ class FilterDialog extends BasicElement {
 	* @public
 	*/
 	show() {
+		var popupElem = this._popup.getElement();
+		if(popupElem) {// To prevent blinking due to size and position change
+			popupElem.style.visibility = "hidden";
+		}
 		this._popup.appendChild(this); // To force first time initialization, focus is already included in updated()
-
 		this._popup.show();
 	}
 
@@ -474,9 +482,9 @@ class FilterDialog extends BasicElement {
 	*/
 	_onPopupHidden() {
 		this.isShown = false; // For backward compatability
-		if (this._dialogHeightTimerId) {
-			clearTimeout(this._dialogHeightTimerId);
-			this._dialogHeightTimerId = 0;
+		if (this._winResizedTimer) {
+			clearTimeout(this._winResizedTimer);
+			this._winResizedTimer = 0;
 		}
 	}
 
@@ -484,10 +492,18 @@ class FilterDialog extends BasicElement {
 	* @private
 	*/
 	_onWindowResize() {
-		if(!this._dialogHeightTimerId && this.isShown){
-			this._dialogHeightTimerId = setTimeout(this._updateDialogHeight, 500);
+		if(!this._winResizedTimer && this.isShown){
+			this._winResizedTimer = setTimeout(this._onWindowResized, 400);
 		}
 	}
+	/**
+	* @private
+	*/
+	_onWindowResized() {
+		this._winResizedTimer = 0;
+		this._updateDialogHeight();
+	}
+
 
 	/**
 	* @public
@@ -563,21 +579,42 @@ class FilterDialog extends BasicElement {
 		e.preventDefault();
 		e.stopPropagation();
 		this._updateFilterModeSelectionUI();
-		this._updateDialogHeight(true);
+		this._updateDialogHeight();
 	}
 
+	/**
+	* @private
+	* @param {string} oper
+	* @param {*} val
+	* @returns {boolean}
+	*/
+	_isValidCondition(oper, val) {
+		if(oper) {
+			if(val || val === 0) {
+				return true;
+			}
+		}
+		return false;
+	}
 	/**
 	* @private
 	* @param {object} e - event
 	*/
 	_onDoneBtnClick(e) {
-		let context;
+		let eventArg = {
+			bubbles: false,
+			detail: {
+				fieldDataType: this.fieldDataType
+			}
+		};
 		if (this._isAdvancedFilterMode()) {
 			// Retrieve filter conditions from UI;
 			let oper1, oper2, val1, val2, connector;
 			var dateTimeType = toDateTimeType(this.fieldDataType);
 			var fdt = dateTimeType ? dateTimeType : this.fieldDataType.toLowerCase();
+			var useUTCTime = false;
 			if (fdt === DATE_TIME) {
+				useUTCTime = this.useUTCTime;
 				oper1 = this._dateTimeComboBoxes[0].value;
 				val1 = this._dateTimePickers[0].value;
 				if(val1) {
@@ -624,29 +661,32 @@ class FilterDialog extends BasicElement {
 					}
 				}
 			}
+			var ary2D = [];
+
+			if(this._isValidCondition(oper1, val1)) {
+				ary2D.push([oper1, val1]);
+			}
 
-			context = {
-				bubbles: false,
-				detail: {
-					conditions: [
-						[oper1, val1, connector, fdt == DATE_TIME ? this.useUTCTime : null],
-						[oper2, val2, null, fdt == DATE_TIME ? this.useUTCTime : null]
-					],
-					fieldDataType: this.fieldDataType
+			if(this._isValidCondition(oper2, val2)) {
+				if(ary2D.length) {
+					ary2D[0][2] = connector;
 				}
-			};
+				ary2D.push([oper2, val2]);
+			}
+
+			if(useUTCTime) {
+				ary2D.forEach(function(itm) {
+					item[3] = true;
+				});
+			}
+
+			eventArg.detail.conditions = ary2D;
 		} else {
-			context = {
-				bubbles: false,
-				detail: {
-					value: this._dataSelector.getSelectedItems(),
-					fieldDataType: this.fieldDataType
-				}
-			};
+			eventArg.detail.value = this._dataSelector.getSelectedItems();
 		}
 
-		this.dispatchEvent(new CustomEvent("filterChanged", context));
-		this.dispatchEvent(new CustomEvent("confirm", context));
+		this.dispatchEvent(new CustomEvent("filterChanged", eventArg));
+		this.dispatchEvent(new CustomEvent("confirm", eventArg));
 		this.hide();
 	}
 
@@ -808,40 +848,39 @@ class FilterDialog extends BasicElement {
 			}
 		}
 	}
-	/**
-	* @private
-	* @param {boolean=} afterOpened
+	/** @private
+	* @returns {boolean}
 	*/
-	_updateDialogHeight(afterOpened) {
-		if(!afterOpened) {
-			this._dialogHeightTimerId = 0;
-		}
-
-		this._popup.updatePosition(false); // update position without fallback
+	_updateDialogHeight() {
 		this._rootContainer.classList.remove("compact");
 		this._rootContainer.style.height = "";
+		this._popup.updatePosition(false); // update position without fallback
 
 		const position = Dom.getRelativePosition(this, document.body);
 		const dialogHeight = this.offsetHeight;
-		const windowHeight = window.innerHeight;
+		const windowHeight = window.innerHeight - 5; // Add some buffer
 		const dialogCoverage = position.y + dialogHeight;
 		const heightDiff = dialogCoverage - windowHeight;
-		const isAdvancedFilter = this._isAdvancedFilterMode();
-		const minHeight = isAdvancedFilter ? 262 : 216;
-		const compactThreshold = 409;
 
-		if( heightDiff > 0 ){
+		var heightChange = false;
+		if(heightDiff > 0) {
+			heightChange = true;
+			const isAdvancedFilter = this._isAdvancedFilterMode();
+			const minHeight = isAdvancedFilter ? 262 : 216;
 			let newHeight = dialogHeight - heightDiff;
 			if(newHeight < minHeight || isAdvancedFilter){
 				newHeight = minHeight;
 			}
 			this._rootContainer.style.height = newHeight + "px";
 
+			const compactThreshold = 409;
 			if(newHeight < compactThreshold){
 				this._rootContainer.classList.add("compact");
 			}
 		}
-		this._popup.updatePosition();
+
+		this._popup.updatePosition(); // This must be called to apply fallback or height change
+		return heightChange;
 	}
 	/**
 	* @private

package/lib/grid/index.js

@@ -1,3 +1,3 @@
 import {Grid} from "./lib/efx-grid.js";
 export {Grid}
-window.EFX_GRID = { version: "6.0.69" };
+window.EFX_GRID = { version: "6.0.71" };

package/lib/rt-grid/dist/rt-grid.js

@@ -35691,6 +35691,8 @@ VirtualizedLayoutGrid._proto = VirtualizedLayoutGrid.prototype;
 */
 /** @event Core#beforeContentBinding */
 /** @event Core#postSectionDataBinding */
+/** @event Core#firstRendered */
+/** @event Core#afterContentBinding */
 /** @event Core#rowHighlighted */
 
 /** @event Core#rowAdded
@@ -35861,6 +35863,8 @@ var Core = function (opt_initializer) {
 		"beforeContentBinding",
 		"preSectionDataBinding",
 		"postSectionDataBinding",
+		"firstRendered",
+		"afterContentBinding",
 		"rowExpansionBinding",
 		"rowHighlighted",
 		"preForcedUpdate",
@@ -36213,6 +36217,10 @@ Core.prototype._groupDefs = null;
 * @private
 */
 Core.prototype._batches = null;
+/** @type {boolean}
+* @private
+*/
+Core.prototype._firstRendered = false;
 //#region Public Methods
 
 /**
@@ -36220,7 +36228,7 @@ Core.prototype._batches = null;
 * @return {string}
 */
 Core.getVersion = function () {
-	return "5.1.77";
+	return "5.1.78";
 };
 /** {@link ElementWrapper#dispose}
 * @override
@@ -37028,6 +37036,7 @@ Core.prototype.getColumnCount = function () {
 * @fires Core#preSectionDataBinding
 * @fires Core#columnDataBinding
 * @fires Core#postSectionDataBinding
+* @fires Core#afterContentBinding
 */
 Core.prototype.setColumnCount = function(num) {
 	var colCount = this._layoutX.getLaneCount();
@@ -37056,6 +37065,7 @@ Core.prototype.setColumnCount = function(num) {
 * @fires Core#preSectionDataBinding
 * @fires Core#columnDataBinding
 * @fires Core#postSectionDataBinding
+* @fires Core#afterContentBinding
 */
 Core.prototype.insertColumn = function (index, jsonObj) {
 	var prevCount = this.getColumnCount();
@@ -37671,6 +37681,7 @@ Core.prototype._deserializeColumn = function (index, jsonObj) {
 * @fires Core#preSectionDataBinding
 * @fires Core#columnDataBinding
 * @fires Core#postSectionDataBinding
+* @fires Core#afterContentBinding
 */
 Core.prototype.addRow = function (opt_num) {
 	if (opt_num == null) { opt_num = 1; }
@@ -39475,6 +39486,7 @@ Core.prototype.synchronizeHScrollbar = function (subGrid) {
 * @fires Core#preSectionDataBinding
 * @fires Core#columnDataBinding
 * @fires Core#postSectionDataBinding
+* @fires Core#afterContentBinding
 */
 Core.prototype.updateRowData = function (sectionRef, fromRowIndex, lastRowIndex, userParam) {
 	var ss = this.getSectionSettings(sectionRef || "content");
@@ -40609,7 +40621,9 @@ Core.prototype._onSectionDataChanged = function (e) {
 		rowDataCollection = dataView.getMultipleRowData(rids, fromR, toR);
 		e["dataRows"] = rowDataCollection;
 	}
-	if(e["sectionType"] === "content"){
+
+	var isContentSection = e["sectionType"] === "content";
+	if(isContentSection){
 		this._dispatch("beforeContentBinding", e);
 	}
 	this._dispatch("preSectionDataBinding", e);
@@ -40643,10 +40657,24 @@ Core.prototype._onSectionDataChanged = function (e) {
 	this._dispatch("postSectionDataBinding", e);
 	this._dispatchRowExpansionBinding(e);
 
+	if(isContentSection){
+		if(!this._firstRendered) {
+			this._dispatch("firstRendered", e);
+			this._firstRendered = true;
+		}
+		this._dispatch("afterContentBinding", e);
+	}
 	section._startBindingSession(false);
 	this._dispatchingDataChanged = false;
 };
 
+/** @public
+* @ignore
+*/
+Core.prototype.resetInternalState = function() {
+	this._firstRendered = false;
+};
+
 /** @private
 * @param {VScrollbar|HScrollbar} scrollbar
 * @returns {boolean}
@@ -44332,7 +44360,6 @@ SortableTitlePlugin._proto = SortableTitlePlugin.prototype;
 * @property {number=} contentRightPadding=0 Padding that is added next to the right most column. The padding is still a part of scrollable content.
 * @property {number=} contentBottomPadding=0 Padding that is added below the last section. The padding is still a part of scrollable content.
 * @property {number=} dataConflationRate=0 set delay for data to avoid to much sorting operation when data changed
-* @property {Function=} dataComposed Handler for dataComposed event
 * @property {boolean=} autoDateConversion=false If enabled, date-time field with numeric value will be automatically converted to native date object.
 * @property {boolean=} textSelect=false If enabled, user can select content text by using mouse drag.
 * @property {string=} lang laguage for config localization date time, if null the default language is "en"
@@ -44344,6 +44371,10 @@ SortableTitlePlugin._proto = SortableTitlePlugin.prototype;
 * @property {string=} childDataField=CHILD_VALUES The given field will be used to store children's static data, such as row color assignment.
 * @property {boolean=} topSection=true If disabled, title section will not be rendered
 * @property {SortableTitlePlugin~Options=} sorting Options for sorting
+* @property {Function=} dataComposed Handler for dataComposed event
+* @property {Function=} beforeContentBinding Handler for beforeContentBinding event
+* @property {Function=} firstRendered Handler for firstRendered event
+* @property {Function=} afterContentBinding Handler for afterContentBinding event
 */
 
 /** @typedef {number|string|RowDefinition} Grid~RowReference
@@ -44414,6 +44445,16 @@ SortableTitlePlugin._proto = SortableTitlePlugin.prototype;
 * @description Trigger before content binding.
 */
 
+/** @event Grid#firstRendered
+* @property {Object} e Event of firstRendered
+* @description This event is triggered when the content is rendered for the first time.
+*/
+
+/** @event Grid#afterContentBinding
+* @property {Object} e Event of afterContentBinding
+* @description Trigger after content binding.
+*/
+
 /** @event Grid#beforeRowRemoved
 * @description Fired only when a row will be removed through Grid's API and before occurring of the actual removal
 */
@@ -44568,7 +44609,6 @@ var Grid = function(placeholder, config) {
 	t.updateColumnTitle = t.updateColumnTitle.bind(t);
 	t._populateTimeSeriesChildren = t._populateTimeSeriesChildren.bind(t);
 
-	t._onBeforeContentBinding = t._onBeforeContentBinding.bind(t);
 	t._onPostSectionDataBinding = t._onPostSectionDataBinding.bind(t);
 	t._asyncClearDataUpdates = t._asyncClearDataUpdates.bind(t);
 	t._clearDataUpdates = t._clearDataUpdates.bind(t);
@@ -44661,9 +44701,11 @@ var Grid = function(placeholder, config) {
 		t._grid.loadPlugin(t._stp, config);
 	}
 
-	t._grid.listen("beforeContentBinding", t._onBeforeContentBinding);
+	t._grid.listen("beforeContentBinding", t._dispatch.bind(t, "beforeContentBinding"));
 	t._grid.listen("preSectionRender", t._onColumnHeaderBinding);
 	t._grid.listen("postSectionDataBinding", t._onPostSectionDataBinding);
+	t._grid.listen("firstRendered", t._dispatch.bind(t, "firstRendered"));
+	t._grid.listen("afterContentBinding", t._dispatch.bind(t, "afterContentBinding"));
 
 	t._grid.enableRowHighlighting(true);
 
@@ -45071,6 +45113,7 @@ Grid.prototype.initialize = function(gridOption) {
 	var t = this; // For minimizing file size
 	t._initializing = true;
 	var grid = t._grid; // core grid
+	grid.resetInternalState();
 	gridOption = grid.normalizeConfig(gridOption);
 
 	var exts = gridOption["plugins"] || gridOption["extensions"];
@@ -45177,10 +45220,10 @@ Grid.prototype.initialize = function(gridOption) {
 		t.listen("rowExpansionBinding", rowExpansionBinding);
 	}
 
-	var dataComposedHandler = gridOption["dataComposed"];
-	if(typeof dataComposedHandler === "function") {
-		t.listen("dataComposed", dataComposedHandler);
-	}
+	this.addListener(gridOption, "dataComposed");
+	this.addListener(gridOption, "beforeContentBinding");
+	this.addListener(gridOption, "firstRendered");
+	this.addListener(gridOption, "afterContentBinding");
 
 	if(gridOption["autoDateConversion"]) {
 		t._autoDateConversion = true;
@@ -46836,7 +46879,6 @@ Grid.prototype.removeAllRows = function() {
 
 	// TODO: This logic should also be in the core grid
 	this._grid.getVScrollbar().setScrollTop(0);
-	this._grid.getHScrollbar().setScrollLeft(0);
 };
 /** WARNING: This does not remove data stored in the data cache
 * @private
@@ -47794,13 +47836,6 @@ Grid.prototype._mainSorter = function (rowDefA, rowDefB, order) {
 	return this._columnSorter(rowDefA, rowDefB, order);
 };
 
-/** @private
-* @param {Object} e
-*/
-Grid.prototype._onBeforeContentBinding = function(e) {
-	this._dispatch("beforeContentBinding", e);
-};
-
 /** @private
 * @param {Object} e
 */