@refinitiv-ui/efx-grid 6.0.109 → 6.0.111

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

@@ -175,6 +175,10 @@ declare class Core extends ElementWrapper {
 
     public setColumnStyle(colIndex: number, style: string, value: string, opt_type?: string|null): void;
 
+    public getColumnBackgroundColor(colIndex: number): string;
+
+    public setColumnBackgroundColor(colIndex: number, color?: string|null): void;
+
     public enableColumnClass(colIndex: number, clsName: string, enabled?: boolean|null, opt_type?: string|null): boolean;
 
     public hasColumnClass(colIndex: number, clsName: string, opt_type?: string|null): boolean;

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

@@ -620,7 +620,7 @@ Core.prototype._hasPendingRowChange = false;
 * @return {string}
 */
 Core.getVersion = function () {
-	return "5.1.111";
+	return "5.1.113";
 };
 /** {@link ElementWrapper#dispose}
 * @override
@@ -763,6 +763,9 @@ Core.prototype.getConfigObject = function (gridOptions) {
 		if (columnDef["rightPinned"]) {
 			column["rightPinned"] = columnDef["rightPinned"];
 		}
+		if (columnDef["backgroundColor"]) {
+			column["backgroundColor"] = columnDef["backgroundColor"];
+		}
 	}
 
 	// It will be overwrite in rt-grid or atlas-blotter
@@ -2051,6 +2054,10 @@ Core.prototype._deserializeColumn = function (index, jsonObj) {
 	if (value != null) {
 		colDef["rightPinned"] = value ? true : false;
 	}
+	value = jsonObj["backgroundColor"];
+	if (value != null) {
+		this.setColumnBackgroundColor(index, value);
+	}
 
 	this.setColumnRenderingHandler(index, jsonObj["renderingHandler"]);
 	this.setColumnDataBindingHandler(index, jsonObj["dataBindingHandler"]);
@@ -2310,6 +2317,56 @@ Core.prototype.setColumnStyle = function (colIndex, style, value, opt_type) {
 	}
 };
 
+/** @public
+* @param {number} colIndex
+* @return {string}
+*/
+Core.prototype.getColumnBackgroundColor = function(colIndex) {
+	let colDef = this._getColumnDef(colIndex);
+	return colDef["backgroundColor"] || "";
+};
+/** @public
+* @param {number} colIndex
+* @param {string=} color
+*/
+Core.prototype.setColumnBackgroundColor = function(colIndex, color) {
+	if(colIndex == null || typeof colIndex !== "number") {
+		return;
+	}
+
+	let colDef = this._getColumnDef(colIndex);
+	if(colDef["backgroundColor"] === color) {
+		return;
+	}
+
+	colDef["backgroundColor"] = color;
+	color = color != null ? color : "";
+
+	let sectionCount = this._settings.length;
+	for(let i = 0; i < sectionCount; ++i) {
+		let settings = this._settings[i];
+		let section = settings.getSection();
+		if(!section) {
+			continue;
+		}
+
+		if(settings.getType() !== "content") {
+			let rowCount = section.getRowCount();
+			for(let r = 0; r < rowCount; r++) {
+				let cellSpan = section.getCellColSpan(colIndex, r);
+				if(cellSpan > 1) { continue; }
+				let cell = section.getCell(colIndex, r);
+				if(cell) {
+					cell.setStyle("backgroundColor", color);
+				}
+			}
+		} else {
+			let column = section.getColumn(colIndex);
+			column.setStyle("backgroundColor", color);
+		}
+	}
+};
+
 /** @public
 * @param {number} colIndex
 * @param {string} clsName
@@ -4969,6 +5026,9 @@ Core.prototype._dispatchRowExpansionBinding = function (e) {
 		}
 
 		let ctxRow = section.getContextRow(r);
+		if(!ctxRow) {
+			continue; // The row may have been pushed out of view due to row count or height changed during the binding
+		}
 		let parentId = dataView.getExpansionParentByRowId(rowId);
 		if(parentId) { // dispatch to render row expansion
 			e["originalRowData"] = dataView.getRowData(parentId);

package/lib/grid/index.js

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

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

@@ -14857,6 +14857,7 @@ PredefinedFormula.remove = function(field) {
 * @property {boolean=} rightPinned=false If enabled, the column will not be part of the scrollable area and is pinned to the right side
 * @property {Object=} info=null For storing any additional information to the column
 * @property {boolean=} focusable=false If enabled, the column will be used to find focusable element when pressing tab key
+* @property {string=} backgroundColor CSS color value
 */
 
 /** mapping of field type to javascript type
@@ -15975,6 +15976,24 @@ ColumnDefinition.prototype._setCoreColumnDef = function(obj) {
 ColumnDefinition.prototype.isFocusable = function() {
 	return this._focusable;
 };
+/** @public
+* @return {string}
+*/
+ColumnDefinition.prototype.getBackgroundColor = function() {
+	let core = this._eventArg["core"];
+	let grid = this._eventArg["grid"];
+	let colIndex = grid.getColumnIndex(this);
+	return core.getColumnBackgroundColor(colIndex);
+};
+/** @public
+* @param {string} color
+*/
+ColumnDefinition.prototype.setBackgroundColor = function(color) {
+	let core = this._eventArg["core"];
+	let grid = this._eventArg["grid"];
+	let colIndex = grid.getColumnIndex(this);
+	core.setColumnBackgroundColor(colIndex, color);
+};
 
 
 /* harmony default export */ var js_ColumnDefinition = (ColumnDefinition);
@@ -35781,7 +35800,6 @@ let Core = function (opt_initializer) {
 	_t._onRowHightlighted = _t._onRowHightlighted.bind(_t);
 	_t._onGridClicked = _t._onGridClicked.bind(_t);
 	_t._onKeyDown = _t._onKeyDown.bind(_t);
-	_t._onKeyUp = _t._onKeyUp.bind(_t);
 
 	_t._onWindowResize = _t._onWindowResize.bind(_t);
 	_t._onSectionDataChanged = _t._onSectionDataChanged.bind(_t);
@@ -35869,7 +35887,6 @@ let Core = function (opt_initializer) {
 
 
 	_t._element.addEventListener("keydown", _t._onKeyDown);
-	_t._element.addEventListener("keyup", _t._onKeyUp);
 	if (util.isMobile || util.isTouchDevice) {
 		_t._element.addEventListener("touchmove", _t._onMouseMove, false);
 	} else {
@@ -36276,7 +36293,7 @@ Core.prototype._hasPendingRowChange = false;
 * @return {string}
 */
 Core.getVersion = function () {
-	return "5.1.110";
+	return "5.1.112";
 };
 /** {@link ElementWrapper#dispose}
 * @override
@@ -36419,6 +36436,9 @@ Core.prototype.getConfigObject = function (gridOptions) {
 		if (columnDef["rightPinned"]) {
 			column["rightPinned"] = columnDef["rightPinned"];
 		}
+		if (columnDef["backgroundColor"]) {
+			column["backgroundColor"] = columnDef["backgroundColor"];
+		}
 	}
 
 	// It will be overwrite in rt-grid or atlas-blotter
@@ -37707,6 +37727,10 @@ Core.prototype._deserializeColumn = function (index, jsonObj) {
 	if (value != null) {
 		colDef["rightPinned"] = value ? true : false;
 	}
+	value = jsonObj["backgroundColor"];
+	if (value != null) {
+		this.setColumnBackgroundColor(index, value);
+	}
 
 	this.setColumnRenderingHandler(index, jsonObj["renderingHandler"]);
 	this.setColumnDataBindingHandler(index, jsonObj["dataBindingHandler"]);
@@ -37966,6 +37990,56 @@ Core.prototype.setColumnStyle = function (colIndex, style, value, opt_type) {
 	}
 };
 
+/** @public
+* @param {number} colIndex
+* @return {string}
+*/
+Core.prototype.getColumnBackgroundColor = function(colIndex) {
+	let colDef = this._getColumnDef(colIndex);
+	return colDef["backgroundColor"] || "";
+};
+/** @public
+* @param {number} colIndex
+* @param {string=} color
+*/
+Core.prototype.setColumnBackgroundColor = function(colIndex, color) {
+	if(colIndex == null || typeof colIndex !== "number") {
+		return;
+	}
+
+	let colDef = this._getColumnDef(colIndex);
+	if(colDef["backgroundColor"] === color) {
+		return;
+	}
+
+	colDef["backgroundColor"] = color;
+	color = color != null ? color : "";
+
+	let sectionCount = this._settings.length;
+	for(let i = 0; i < sectionCount; ++i) {
+		let settings = this._settings[i];
+		let section = settings.getSection();
+		if(!section) {
+			continue;
+		}
+
+		if(settings.getType() !== "content") {
+			let rowCount = section.getRowCount();
+			for(let r = 0; r < rowCount; r++) {
+				let cellSpan = section.getCellColSpan(colIndex, r);
+				if(cellSpan > 1) { continue; }
+				let cell = section.getCell(colIndex, r);
+				if(cell) {
+					cell.setStyle("backgroundColor", color);
+				}
+			}
+		} else {
+			let column = section.getColumn(colIndex);
+			column.setStyle("backgroundColor", color);
+		}
+	}
+};
+
 /** @public
 * @param {number} colIndex
 * @param {string} clsName
@@ -41117,31 +41191,9 @@ Core.prototype._onKeyDown = function (e) {
 
 	if(onTheEdge && !e.defaultPrevented) {
 		if(onTheEdge > 0 && e.shiftKey) {
-			this._firstHiddenInput.focus(); // jump to the top
-			e.preventDefault();
+			this._firstHiddenInput.focus(); // jump to the top and move out of grid
 		} else if(onTheEdge < 0 && !e.shiftKey) {
-			this._lastHiddenInput.focus(); // skip to the end
-			e.preventDefault();
-		}
-	}
-};
-/** @private
-* @param {Object} e
-*/
-Core.prototype._onKeyUp = function (e) {
-	if(!_isTabCommand(e)) {
-		return;
-	}
-	var activeElem = _getActiveElement(this._element);
-	if(e.shiftKey) {
-		if(activeElem === this._lastHiddenInput) {
-			this._firstHiddenInput.focus();
-			e.preventDefault();
-		}
-	} else {
-		if(activeElem === this._firstHiddenInput) {
-			this._lastHiddenInput.focus();
-			e.preventDefault();
+			this._lastHiddenInput.focus(); // skip to the end and move out of grid
 		}
 	}
 };
@@ -46678,6 +46730,27 @@ Grid.prototype.setColumnName = function(colIndex, str) {
 };
 /** @public
 * @param {Grid~ColumnReference} colRef
+* @return {string}
+*/
+Grid.prototype.getColumnBackgroundColor = function(colRef) {
+	let colDef = this.getColumnDefinition(colRef);
+	if(colDef) {
+		return colDef.getBackgroundColor();
+	}
+	return "";
+};
+/** @public
+* @param {Grid~ColumnReference} colRef
+* @param {string} color
+*/
+Grid.prototype.setColumnBackgroundColor = function(colRef, color) {
+	let colDef = this.getColumnDefinition(colRef);
+	if(colDef) {
+		colDef.setBackgroundColor(color);
+	}
+};
+/** @public
+* @param {Grid~ColumnReference} colRef
 * @param {Function=} func
 */
 Grid.prototype.setColumnRenderer = function(colRef, func) {