@refinitiv-ui/efx-grid 6.0.99 → 6.0.100

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

@@ -327,6 +327,8 @@ declare class Core extends ElementWrapper {
 
     public scrollToRow(sectionRef: Core.SectionReference|null, rowIndex: number, topOfView?: boolean|null): void;
 
+    public getVerticalViewInfo(): any;
+
     public getVScrollView(): any;
 
     public getScrollTop(): number;

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

@@ -574,7 +574,7 @@ Core.prototype._hasPendingRowChange = false;
 * @return {string}
 */
 Core.getVersion = function () {
-	return "5.1.102";
+	return "5.1.103";
 };
 /** {@link ElementWrapper#dispose}
 * @override
@@ -3583,33 +3583,24 @@ Core.prototype.getYScrollVal = function (sectionRef, rowIndex, topOfView) {
 	}
 
 	let rowCount = this._layoutY.getLaneCount();
-	let rowIndexOffset = (section) ? section.getRowOffset() : this._sectionStarts[this._startVScrollbarIndex];
-
-	if(rowIndexOffset) {
-		rowIndex += rowIndexOffset;
-	}
 	if (rowIndex <= 0) { rowIndex = 0; }
 	else if (rowIndex >= rowCount) { rowIndex = rowCount - 1; }
 
-	let heightOffset = this._layoutY.getLaneStart(rowIndexOffset);
-	let scrollTop = this._vscrollbar.getScrollTop();
-	let viewTop = scrollTop + heightOffset;
-	let viewTopIndex = section ? section.getFirstIndexInView() : this._layoutY.hitTest(viewTop); // TODO: Make it work in zooming mode
+	let viewInfo = this.getVerticalViewInfo();
+	let viewTopIndex = viewInfo.topRowIndex; // TODO: Make it work in zooming mode
 
 	let scrollIndex = -1;
 	if (topOfView) {
 		scrollIndex = rowIndex;
 	} else {
-		if(rowIndex <= viewTopIndex) { // Scroll up
+		if(rowIndex < viewTopIndex) { // Scroll up
 			scrollIndex = rowIndex - 3; // Have some spaces at the top for more appealing visual
 			if(scrollIndex < 0) {
 				scrollIndex = 0;
 			}
 		} else { // Scroll down
-			let viewHeight = this._vscrollbar.getHeight();
-			let viewBottom = viewTop + viewHeight;
-			let viewBottomIndex = section ? section.getLastIndexInView() : this._layoutY.hitTest(viewBottom - 0.1);
-			if (rowIndex >= viewBottomIndex) {
+			let viewBottomIndex = viewInfo.bottomRowIndex;
+			if (rowIndex > viewBottomIndex) {
 				let viewIndexSize = viewBottomIndex - viewTopIndex;
 				scrollIndex = rowIndex - viewIndexSize + 3;
 				if(scrollIndex < 0) {
@@ -3619,7 +3610,9 @@ Core.prototype.getYScrollVal = function (sectionRef, rowIndex, topOfView) {
 		}
 	}
 
-	return (scrollIndex >= 0) ? (this._layoutY.getLaneStart(scrollIndex) - heightOffset) : null;
+	let rowIndexOffset = (section) ? section.getRowOffset() : this._sectionStarts[this._startVScrollbarIndex];
+	let heightOffset = this._layoutY.getLaneStart(this._startVScrollbarIndex);
+	return (scrollIndex >= 0) ? (this._layoutY.getLaneStart(scrollIndex + rowIndexOffset) - heightOffset) : null;
 };
 /** Scroll up or down to make specified row visible in the view
 * @public
@@ -3634,6 +3627,21 @@ Core.prototype.scrollToRow = function (sectionRef, rowIndex, topOfView) {
 	}
 };
 /** @public
+* @return {Object}
+*/
+Core.prototype.getVerticalViewInfo = function() {
+	let rowIndexOffset = this._sectionStarts[this._startVScrollbarIndex];
+	let heightOffset = this._layoutY.getLaneStart(rowIndexOffset);
+	let viewHeight = this._vscrollbar.getHeight();
+	let viewTop = this._vscrollbar.getScrollTop() + heightOffset;
+	let viewBottom = viewTop + viewHeight;
+
+	return {
+		topRowIndex: this._layoutY.hitTest(viewTop) - rowIndexOffset,
+		bottomRowIndex: this._layoutY.hitTest(viewBottom - 0.1) - rowIndexOffset
+	};
+};
+/** @public
 * @return {Object} Returns null if vscrollbar does not exists
 */
 Core.prototype.getVScrollView = function () {

package/lib/grid/index.js

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

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

@@ -15285,6 +15285,7 @@ PredefinedFormula.remove = function(field) {
 * @property {boolean=} leftPinned=false If enabled, the column will not be part of the scrollable area and is pinned to the left side
 * @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
 */
 
 /** mapping of field type to javascript type
@@ -15493,6 +15494,10 @@ ColumnDefinition.prototype._info = null;
 * @private
 */
 ColumnDefinition.prototype._coreColDef = null;
+/** @type {boolean}
+* @private
+*/
+ColumnDefinition.prototype._focusable = false;
 //#endregion Private Members
 
 
@@ -15637,6 +15642,11 @@ ColumnDefinition.prototype.initialize = function(columnOption) {
 		this._sortable = val ? true : false;
 	}
 
+	val = columnOption["focusable"];
+	if(val != null) {
+		this._focusable = val ? true : false;
+	}
+
 	val = columnOption["className"] || columnOption["class"];
 	if(typeof val === "string") {
 		this._classes = val.split(" ");
@@ -16020,6 +16030,10 @@ ColumnDefinition.prototype.getConfigObject = function(colOptions) {
 		obj["autoGenerated"] = this._autoGenerated;
 	}
 
+	if(this._focusable) {
+		obj["focusable"] = true;
+	}
+
 	let core = this._eventArg["core"];
 	let grid = this._eventArg["grid"];
 	let colIndex = grid.getColumnIndex(this);
@@ -16384,6 +16398,12 @@ ColumnDefinition.prototype._setCoreColumnDef = function(obj) {
 	this._coreColDef = obj || null;
 };
 
+/** @public
+* @return {boolean}
+*/
+ColumnDefinition.prototype.isFocusable = function() {
+	return this._focusable;
+};
 
 
 /* harmony default export */ var js_ColumnDefinition = (ColumnDefinition);
@@ -31562,8 +31582,9 @@ DataView.prototype.stallSorting = function(bool) {
 				this._dispatchDataChange(data_DataTable._positionChangeArg);
 			}
 		}
+		return true;
 	}
-	return true;
+	return false;
 };
 
 /** Automatically and asyncronuosly remove group that has no member or no content. Predefined groups will not be removed in this way.
@@ -34431,12 +34452,12 @@ Virtualizer.prototype.setViewOffset = function (px) {
 };
 /** @public
 * @ignore
-* @param {number} start
-* @param {number} end
+* @param {number} startItemCount
+* @param {number} endItemCount
 */
-Virtualizer.prototype.setViewBounds = function (start, end) {
-	this._startOffsetCount = start > 0 ? start : 0;
-	this._endOffsetCount = end > 0 ? end : 0;
+Virtualizer.prototype.setViewBounds = function (startItemCount, endItemCount) {
+	this._startOffsetCount = startItemCount > 0 ? startItemCount : 0;
+	this._endOffsetCount = endItemCount > 0 ? endItemCount : 0;
 	this.validateVirtualization(); // Everytime row height is changed
 };
 /** @public
@@ -36517,7 +36538,7 @@ Core.prototype._hasPendingRowChange = false;
 * @return {string}
 */
 Core.getVersion = function () {
-	return "5.1.98";
+	return "5.1.103";
 };
 /** {@link ElementWrapper#dispose}
 * @override
@@ -37718,6 +37739,16 @@ Core.prototype._moveColumn = function (fromCol, destCol) {
 		}
 	}
 
+	// The deactivated column may be moved directly or indirectly to the current view. It's necessary to make all columns in view activated.
+	if(!this._frozenLayout) {
+		if(this._colVirtualizer.isEnabled()) {
+			let vBegin = this._colVirtualizer.getFirstIndexInView();
+			if(!((fromCol < vBegin && destCol < vBegin) || (fromCol > vEnd && destCol > vEnd))) { // Columns does not move between hidden columns
+				this._activateColumns(vBegin, vEnd, vBegin, vEnd); // To confirm that all columns in view are activated
+			}
+		}
+	}
+
 	// no need to invoke because moving column does not change column-width
 	// this._syncLayoutToColumns(minColumn, this.getColumnCount());
 
@@ -39516,33 +39547,24 @@ Core.prototype.getYScrollVal = function (sectionRef, rowIndex, topOfView) {
 	}
 
 	let rowCount = this._layoutY.getLaneCount();
-	let rowIndexOffset = (section) ? section.getRowOffset() : this._sectionStarts[this._startVScrollbarIndex];
-
-	if(rowIndexOffset) {
-		rowIndex += rowIndexOffset;
-	}
 	if (rowIndex <= 0) { rowIndex = 0; }
 	else if (rowIndex >= rowCount) { rowIndex = rowCount - 1; }
 
-	let heightOffset = this._layoutY.getLaneStart(rowIndexOffset);
-	let scrollTop = this._vscrollbar.getScrollTop();
-	let viewTop = scrollTop + heightOffset;
-	let viewTopIndex = section ? section.getFirstIndexInView() : this._layoutY.hitTest(viewTop); // TODO: Make it work in zooming mode
+	let viewInfo = this.getVerticalViewInfo();
+	let viewTopIndex = viewInfo.topRowIndex; // TODO: Make it work in zooming mode
 
 	let scrollIndex = -1;
 	if (topOfView) {
 		scrollIndex = rowIndex;
 	} else {
-		if(rowIndex <= viewTopIndex) { // Scroll up
+		if(rowIndex < viewTopIndex) { // Scroll up
 			scrollIndex = rowIndex - 3; // Have some spaces at the top for more appealing visual
 			if(scrollIndex < 0) {
 				scrollIndex = 0;
 			}
 		} else { // Scroll down
-			let viewHeight = this._vscrollbar.getHeight();
-			let viewBottom = viewTop + viewHeight;
-			let viewBottomIndex = section ? section.getLastIndexInView() : this._layoutY.hitTest(viewBottom - 0.1);
-			if (rowIndex >= viewBottomIndex) {
+			let viewBottomIndex = viewInfo.bottomRowIndex;
+			if (rowIndex > viewBottomIndex) {
 				let viewIndexSize = viewBottomIndex - viewTopIndex;
 				scrollIndex = rowIndex - viewIndexSize + 3;
 				if(scrollIndex < 0) {
@@ -39552,7 +39574,9 @@ Core.prototype.getYScrollVal = function (sectionRef, rowIndex, topOfView) {
 		}
 	}
 
-	return (scrollIndex >= 0) ? (this._layoutY.getLaneStart(scrollIndex) - heightOffset) : null;
+	let rowIndexOffset = (section) ? section.getRowOffset() : this._sectionStarts[this._startVScrollbarIndex];
+	let heightOffset = this._layoutY.getLaneStart(this._startVScrollbarIndex);
+	return (scrollIndex >= 0) ? (this._layoutY.getLaneStart(scrollIndex + rowIndexOffset) - heightOffset) : null;
 };
 /** Scroll up or down to make specified row visible in the view
 * @public
@@ -39567,6 +39591,21 @@ Core.prototype.scrollToRow = function (sectionRef, rowIndex, topOfView) {
 	}
 };
 /** @public
+* @return {Object}
+*/
+Core.prototype.getVerticalViewInfo = function() {
+	let rowIndexOffset = this._sectionStarts[this._startVScrollbarIndex];
+	let heightOffset = this._layoutY.getLaneStart(rowIndexOffset);
+	let viewHeight = this._vscrollbar.getHeight();
+	let viewTop = this._vscrollbar.getScrollTop() + heightOffset;
+	let viewBottom = viewTop + viewHeight;
+
+	return {
+		topRowIndex: this._layoutY.hitTest(viewTop) - rowIndexOffset,
+		bottomRowIndex: this._layoutY.hitTest(viewBottom - 0.1) - rowIndexOffset
+	};
+};
+/** @public
 * @return {Object} Returns null if vscrollbar does not exists
 */
 Core.prototype.getVScrollView = function () {
@@ -41664,7 +41703,15 @@ Core.prototype._updateScrollbarHeight = function (paneChanged, contentChanged, n
 		// HACK: Due to fixed layout size we need to scale view size instead of content size, when zooming
 		// TODO: Check if zoom factor is used for virtualization correctly
 		this._rowVirtualizer.setViewSize(viewSize / this._zoomFactor);
-		this._rowVirtualizer.setViewBounds(this._startVScrollbarIndex, this.getFooterCount());
+
+		let offsetRowCount = this._sectionStarts[this._startVScrollbarIndex];
+		let footerCount = this.getFooterCount();
+		let footerRowCount = 0;
+		if(footerCount) {
+			let sectionCount = this.getSectionCount();
+			footerRowCount = this._sectionStarts[sectionCount] - this._sectionStarts[sectionCount - footerCount];
+		}
+		this._rowVirtualizer.setViewBounds(offsetRowCount, footerRowCount);
 	} else {
 		this._rowVirtualizer.validateVirtualization(); // Content height may be changed
 	}
@@ -43952,6 +43999,17 @@ SortableTitlePlugin.prototype._getPlugin = function(pluginName) {
 	let host = this._hosts[0];
 	return (host) ? host.getPlugin(pluginName) : null;
 };
+
+/** @public
+* @description Click title to sort with mouse event. This is for testing purpose.
+* @ignore
+* @param {Core} grid
+* @param {Object=} mouseEvt
+*/
+SortableTitlePlugin.prototype.clickTitleByMouse = function (grid, mouseEvt) {
+	this._onClickTitle(grid, mouseEvt);
+};
+
 /** @private
 * @param {Core} grid
 * @param {MouseEvent} e
@@ -45003,6 +45061,11 @@ let Grid = function(placeholder, config) {
 	t._snapshotFillerDataChanged = t._snapshotFillerDataChanged.bind(t);
 	t._onPollingInterval = t._onPollingInterval.bind(t);
 
+	t._onKeyDown = t._onKeyDown.bind(t);
+	t._requestScroll = t._requestScroll.bind(t);
+	t._onVScroll = t._onVScroll.bind(t);
+	t._selfScrollToRow = t._selfScrollToRow.bind(t);
+
 	t._streamingConflator = new Conflator(50, t._updateStreamingData);
 	t._formulaConflator = new Conflator(300, t._onFormulaDataChanged);
 	t._chainConflator = new Conflator(100, t._addMemberOfChain);
@@ -45082,6 +45145,10 @@ let Grid = function(placeholder, config) {
 	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.listen("keydown", t._onKeyDown);
+
+	t._grid.getVScrollbar().listen("scroll", t._onVScroll);
+	t._hiddenInput = t._grid.getHiddenInput();
 
 	t._grid.enableRowHighlighting(true);
 
@@ -45267,7 +45334,14 @@ Grid.prototype._childDataField = "";
 * @private
 */
 Grid.prototype._topSection = true;
-
+/** @type {Object}
+* @private
+*/
+Grid.prototype._focusingArgs = null;
+/** @type {number}
+* @private
+*/
+Grid.prototype._scrolledRow = -1;
 /** @public
 */
 Grid.prototype.dispose = function() {
@@ -45300,6 +45374,11 @@ Grid.prototype.dispose = function() {
 		this._subs["dispose"]();
 		this._subs = null;
 	}
+
+	if(this._focusingArgs && this._focusingArgs.id) {
+		clearTimeout(this._focusingArgs.id);
+		this._focusingArgs = null;
+	}
 };
 /** @public
 * @return {Element}
@@ -47727,6 +47806,13 @@ Grid.prototype.setRicData = function(ric, values) {
 		}
 	}
 };
+/** Retrieve all RIC subscriptions. This method is not dependent on the number of rows, the RIC can vary from the current row in the grid.
+* @public
+* @return {Array.<string>}
+*/
+Grid.prototype.getAllRics = function() {
+	return this._connector.getAllRics();
+};
 /** A shorthand to set row data based on index of the specified row. It is better to keep rowDefinition object for updating data directly as row index can be changed by sorting and filtering.
 * @public
 * @param {Grid~RowReference} rowRef
@@ -48792,6 +48878,199 @@ Grid.prototype.getVScrollView = function () {
 	return this._grid.getVScrollView();
 };
 
+/** @private
+* @param {Element} el
+* @return {boolean}
+*/
+function isValidInput(el) {
+	return el && el.tagName !== "SPAN" && !el.disabled;
+}
+/** @private
+* @param {Element} el
+* @param {Element} hiddenInput
+* @return {boolean}
+*/
+function isValidTarget(el, hiddenInput) {
+	return !el.classList.contains("valigner") && el !== hiddenInput;
+}
+/** @private
+* @param {Object} cell
+* @return {boolean}
+*/
+function focusCell(cell) {
+	if(cell) {
+		let cellContent = cell.getContent();
+		if(cellContent && isValidInput(cellContent)) {
+			cellContent.focus();
+			return true;
+		}
+	}
+	return false;
+}
+/** @private
+*/
+Grid.prototype._onVScroll = function() {
+	let args = this._focusingArgs;
+	if(!args) { return; }
+
+	this._focusingArgs = null;
+	let event = args.event;
+	let cell = args.section.getCell(args.colIndex, args.rowIndex);
+	if(focusCell(cell)) {
+		event.preventDefault();
+	} else {
+		if(event.shiftKey) {
+			this._findPrevFocusableCell(event, args.colIndex, args.rowIndex, args.focusableColIndices);
+		} else {
+			this._findNextFocusableCell(event, args.colIndex, args.rowIndex, args.focusableColIndices);
+		}
+	}
+};
+/** @private
+*/
+Grid.prototype._selfScrollToRow = function() {
+	let args = this._focusingArgs;
+	if(!args) { return; }
+	args.id = 0;
+	this.scrollToRow(args.rowIndex);
+};
+/** @private
+* @param {Object} e
+* @param {number} colIndex
+* @param {number} rowIndex
+* @param {Array} focusableColIndices
+* @param {Object} section
+*/
+Grid.prototype._requestScroll = function(e, colIndex, rowIndex, focusableColIndices, section) {
+	let args = this._focusingArgs;
+	if(args) { return; }
+	if(this._scrolledRow === rowIndex) { return; } // Avoid infinite loop
+
+	this._scrolledRow = rowIndex;
+	args = this._focusingArgs = {
+		event: e,
+		colIndex: colIndex,
+		rowIndex: rowIndex,
+		focusableColIndices: focusableColIndices,
+		section: section
+	};
+
+	args.id = setTimeout(this._selfScrollToRow); // Avoid event loop protection
+};
+/** @private
+* @param {Object} e
+* @param {number} colIndex
+* @param {number} rowIndex
+* @param {Array} focusableColIndices
+* @param {Element=} content
+*/
+Grid.prototype._findNextFocusableCell = function(e, colIndex, rowIndex, focusableColIndices, content) {
+	let startIdx = focusableColIndices.indexOf(colIndex);
+
+	// Calculate starting row and column index
+	if(!isValidTarget(e.target, this._hiddenInput) || startIdx < 0) {
+		rowIndex = 0;
+		startIdx = 0;
+	} else if(isValidInput(content) && startIdx >= 0) {
+		startIdx++;
+	}
+	let grid = this._grid;
+	let section = grid.getSection("content");
+	let viewInfo = grid.getVerticalViewInfo();
+	let bottomRowIndex = viewInfo.bottomRowIndex;
+	let rowCount = this.getRowCount();
+	for(let r = rowIndex; r < rowCount; r++) {
+		for(let i = startIdx; i < focusableColIndices.length; i++) {
+			let c = focusableColIndices[i];
+			if(r > bottomRowIndex) {
+				this._requestScroll(e, c, r, focusableColIndices, section);
+				return;
+			} else {
+				let cell = section.getCell(c, r);
+				if(focusCell(cell)) {
+					e.preventDefault();
+					return;
+				}
+			}
+		}
+		startIdx = 0;
+	}
+};
+/** @private
+* @param {Object} e
+* @param {number} colIndex
+* @param {number} rowIndex
+* @param {Array} focusableColIndices
+* @param {Element=} content
+*/
+Grid.prototype._findPrevFocusableCell = function(e, colIndex, rowIndex, focusableColIndices, content) {
+	let startIdx = focusableColIndices.indexOf(colIndex);
+	let len = focusableColIndices.length;
+
+	// Calculate starting row and column index
+	if(!isValidTarget(e.target, this._hiddenInput) || startIdx < 0) {
+		rowIndex = 0;
+		startIdx = 0;
+	} else if(isValidInput(content) && startIdx >= 0) {
+		startIdx--;
+	}
+
+	let grid = this._grid;
+	let section = grid.getSection("content");
+	let viewInfo = grid.getVerticalViewInfo();
+	let topRowIndex = viewInfo.topRowIndex;
+	for(let r = rowIndex; r >= 0; r--) {
+		for(let i = startIdx; i >= 0; i--) {
+			let c = focusableColIndices[i];
+			if(r < topRowIndex) {
+				this._requestScroll(e, c, r, focusableColIndices, section);
+				return;
+			} else {
+				let cell = section.getCell(c, r);
+				if(focusCell(cell)) {
+					e.preventDefault();
+					return;
+				}
+			}
+		}
+		startIdx = len - 1;
+	}
+};
+
+/** @private
+* @param {Object} e
+*/
+Grid.prototype._onKeyDown = function(e) {
+	if (e.keyCode !== 9 || e.ctrlKey || e.altKey || e.metaKey) {
+		return;
+	}
+
+	// Find next focusable cell
+	let colDefs = this.getColumnDefinitions();
+	let colCount = colDefs.length;
+
+	let focusableColIndices = [];
+	for(let c = 0; c < colCount; c++) {
+		if(colDefs[c].isFocusable()) {
+			focusableColIndices.push(c);
+		}
+	}
+
+	if(!focusableColIndices.length) {
+		return;
+	}
+
+	this._scrolledRow = -1; // Reset the scroll loop protector
+	let pos = this.getRelativePosition(e);
+	let content = pos["cell"] ? pos["cell"].getContent() : null;
+
+	if(e.shiftKey) {
+		this._findPrevFocusableCell(e, pos["colIndex"], pos["rowIndex"], focusableColIndices, content);
+	} else {
+		this._findNextFocusableCell(e, pos["colIndex"], pos["rowIndex"], focusableColIndices, content);
+	}
+};
+
 
 /* harmony default export */ var js_Grid = (Grid);