@refinitiv-ui/efx-grid 6.0.119 → 6.0.121

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

@@ -12941,7 +12941,7 @@ DataTable._proto = DataTable.prototype;
 * @property {boolean=} hidden=true When this row is hidden
 * @property {boolean=} realTime=true Realtime row, able to request for JET/RTK
 * @property {Object=} info=null For storing any additional information to the row
-* @property {string=} rowId Row identifier used for referencing the row
+* @property {string=} rowId Row identifier used for referencing the row. The value cannot be in "_x_" format.
 */
 
 /** @typedef {Object} RowDefinition~RowTypes
@@ -12972,6 +12972,12 @@ const ROW_TYPES = {
 	GROUP_MEMBER: "GROUP_MEMBER"
 };
 
+/** @type {RegExp}
+* @private
+* @const
+*/
+const ROW_ID_PATTERN = /^_[^_]+_$/;
+
 /** @constructor
 * @param {RowDefinition~Options=} rowOptions
 */
@@ -13160,8 +13166,12 @@ RowDefinition.prototype.initialize = function(rowOptions) {
 	if(!this._autoGenerated) {
 		let userRowId = rowOptions["rowId"];
 		if(userRowId && typeof userRowId === "string") {
-			this._rowId = this._dataId = userRowId;
-			this._userId = true;
+			if(userRowId.match(ROW_ID_PATTERN)) {
+				console.warn("Please change the rowId format to avoid duplicated rows' id causing unexpected behavior.");
+			} else {
+				this._rowId = this._dataId = userRowId;
+				this._userId = true;
+			}
 		}
 	}
 
@@ -13915,14 +13925,20 @@ RowDefinition.prototype.resetUpdates = function() {
 
 /** @public
 * @param {DataView} view
-* @param {string=} rowId
+* @param {string=} destRowId Destination position where the row will be placed BEFORE the specified position.
 */
-RowDefinition.prototype.registerToView = function(view, rowId) {
+RowDefinition.prototype.registerToView = function(view, destRowId) {
 	if(!view || this._view === view) {
 		return; // Already in the view
 	}
 	this._view = view;
 
+	let rowId = this.getRowId();
+	if(view.getRowData(rowId)) {
+		console.warn("Duplicated rows' id.");
+		return;
+	}
+
 	let rowData = null;
 	if(this._subSegment) {
 		rowData = this._view.getRowData(this.getRowId());
@@ -13937,32 +13953,27 @@ RowDefinition.prototype.registerToView = function(view, rowId) {
 
 	let parentRowId = "";
 	let isSegment = this._isChain || this._asSegment;
-	if(rowId) {
-		parentRowId = view.getSegmentParentRowId(rowId);
+	if(destRowId) {
+		parentRowId = view.getSegmentParentRowId(destRowId);
 		if(parentRowId) {
 			if(isSegment) { // A chain or a segment cannot be put inside another segment
-				rowId = _getEndOfSegmentRowId(view, rowId);
+				destRowId = _getEndOfSegmentRowId(view, destRowId);
 			} // else { // Normal row is inserted into a segment
 		}
 	}
 
 	let stalledSorting = _stallSorting(view, isSegment, false);
-
-	let newRowId = view.insertRow(rowId, rowData, this.getRowId());
-	if(newRowId !== this._rowId) {
-		this._rowId = newRowId; // In case there is some duplicate row id
-		this._userId = false;
-	}
+	view.insertRow(destRowId, rowData, rowId);
 
 	if(isSegment) {
-		view.setSegmentSeparator(newRowId);
+		view.setSegmentSeparator(rowId);
 		_stallSorting(view, false, stalledSorting);
 		if(this._collapsed != null) {
-			view.collapseSegment(newRowId, this._collapsed);
+			view.collapseSegment(rowId, this._collapsed);
 			this._collapsed = null;
 		}
 	} else if(!this._parent && parentRowId) { // Constituent cannot be added to another segment
-		view.addSegmentChild(parentRowId, newRowId, this._dataId);
+		view.addSegmentChild(parentRowId, rowId, this._dataId);
 	}
 };
 /** @private
@@ -15522,6 +15533,13 @@ ColumnDefinition.getDataType = function(field) {
 	return "";
 };
 /** @public
+* @ignore
+* @return {boolean|string|null}
+*/
+ColumnDefinition.prototype.getTooltipValue = function() {
+	return this._tooltip;
+};
+/** @public
 * @return {string}
 */
 ColumnDefinition.prototype.getTooltip = function() {
@@ -18274,6 +18292,10 @@ Cell.prototype._floatingPanel = null;
 * @type {CellFloatingPanel}
 */
 Cell.prototype._frontIcon = null;
+/** @type {Object}
+* @private
+*/
+Cell.prototype._tooltipInfo = null;
 
 //#region ElementWrapper
 /** {@link ElementWrapper#getContent}
@@ -18866,6 +18888,91 @@ Cell.prototype.getClientWidth = function () {
 Cell.prototype.getClientHeight = function () {
 	return (this._element) ? this._element.clientHeight : this.getHeight();
 };
+
+/** To remove the tooltip, pass str as an empty string. To allow cell calculation for the correct tooltip, set str to null.
+* @public
+* @param {string|null} str
+*/
+Cell.prototype.setTooltip = function(str) {
+	this.setTooltipInfo("userTooltip", str);
+	this.updateTooltip();
+};
+/** @public
+* @ignore
+* @param {string} type
+* @param {*=} tooltip
+*/
+Cell.prototype.setTooltipInfo = function(type, tooltip) {
+	let tooltipInfo = this._tooltipInfo;
+	if(!tooltipInfo) {
+		tooltipInfo = this._tooltipInfo = {};
+	}
+
+	tooltipInfo[type] = tooltip;
+};
+/** @public
+* @ignore
+*/
+Cell.prototype.updateTooltip = function() {
+	let tooltipInfo = this._tooltipInfo;
+	if(!tooltipInfo) {
+		return;
+	}
+
+	let defaultTooltip = "";
+	let customizedTooltip = null;
+
+	// Clipped text tooltip takes precedence over default group header and column tooltip
+	if(tooltipInfo["clippedText"]) { // boolean
+		defaultTooltip = customizedTooltip = tooltipInfo["clippedTextTooltip"];
+	}
+
+	if(tooltipInfo["groupHeaderTooltip"] == null) {
+		if(tooltipInfo["columnDefault"] !== false) {
+			if(tooltipInfo["columnDefault"] != null) { // true, "", string
+				customizedTooltip = tooltipInfo["columnTooltip"];
+			} else { // null
+				defaultTooltip = tooltipInfo["columnTooltip"];
+			}
+		}
+	} else { // Group header tooltip takes precedence over column tooltip
+		if(tooltipInfo["groupHeaderDefault"] !== false) {
+			if(tooltipInfo["groupHeaderDefault"] != null) {
+				customizedTooltip = tooltipInfo["groupHeaderTooltip"];
+			} else {
+				defaultTooltip = tooltipInfo["groupHeaderTooltip"];
+			}
+		}
+	}
+
+	// User tooltip take the highest precedence
+	if(tooltipInfo["userTooltip"] != null) { // "", string
+		customizedTooltip = tooltipInfo["userTooltip"];
+	}
+
+	if(customizedTooltip == null) {
+		customizedTooltip = defaultTooltip;
+	}
+
+	if(customizedTooltip) {
+		if(this.getAttribute("title") !== customizedTooltip) {
+			this.setAttribute("title", customizedTooltip);
+		}
+	} else if(this.getAttribute("title") != null) {
+		this.removeAttribute("title");
+	}
+};
+/** @public
+* @ignore
+* @param {string} type
+* @return {*}
+*/
+Cell.prototype.getTooltipInfo = function(type) {
+	if(this._tooltipInfo) {
+		return this._tooltipInfo[type];
+	}
+	return null;
+};
 //#region Internal Public Methods
 
 //#region Private Methods
@@ -32017,7 +32124,7 @@ DataView.prototype._updateRowIds = function(opt_rowIds) {
 
 	this._excludedRids = {};
 	let exclusionCount = 0;
-	exclusionCount += DataView._copyObjectKeys(this._excludedRids, this._hiddenRids);
+	exclusionCount += DataView._copyValidObjectKeys(this._excludedRids, this._hiddenRids);
 
 	// Segment separators should not be filtered out (hidden)
 	let segments = this._dt._getSegmentSeparators();
@@ -32037,7 +32144,7 @@ DataView.prototype._updateRowIds = function(opt_rowIds) {
 		}
 		this._collapsedRids = segments.getCollapsedRows();
 		 // Children of collapsed segments must be filtered out (hidden)
-		exclusionCount += DataView._copyObjectKeys(this._excludedRids, this._collapsedRids);
+		exclusionCount += DataView._copyValidObjectKeys(this._excludedRids, this._collapsedRids);
 	}
 
 	if(this._groupLevel > 0 && !opt_rowIds) { // WARNING: The line below is quite slow
@@ -32567,13 +32674,15 @@ DataView._removeArrayItems = function(ary, items) {
 * @param {Object} masterObj
 * @returns {number}
 */
-DataView._copyObjectKeys = function(baseObj, masterObj) {
+DataView._copyValidObjectKeys = function(baseObj, masterObj) {
 	if(masterObj) {
 		let count = 0;
 
 		for(let key in masterObj) {
-			baseObj[key] = 1;
-			++count; // WARNING: duplicated key can be counted more than once
+			if(masterObj[key]) {
+				baseObj[key] = 1;
+				++count; // WARNING: duplicated key can be counted more than once
+			}
 		}
 		return count;
 	}
@@ -36467,7 +36576,7 @@ Core.prototype._hasPendingRowChange = false;
 * @return {string}
 */
 Core.getVersion = function () {
-	return "5.1.117";
+	return "5.1.121";
 };
 /** {@link ElementWrapper#dispose}
 * @override
@@ -45043,11 +45152,11 @@ let _hasFieldOrId = function(colDef, str) {
 };
 
 /** Compare the difference in the 'id' property.
- * @private
- * @param {Object} obj1
- * @param {Object} obj2
- * @returns {boolean} If the id property of two objects is equal, the return will be true, otherwise it will be false.
- */
+* @private
+* @param {Object} obj1
+* @param {Object} obj2
+* @returns {boolean} If the id property of two objects is equal, the return will be true, otherwise it will be false.
+*/
 let _hasMatchingId = function(obj1, obj2) {
 	if(!obj1 || !obj2 || !obj1.id || !obj2.id) { // Handle nullable, if the object or id have null, it's means difference value
 		return false;
@@ -45055,6 +45164,25 @@ let _hasMatchingId = function(obj1, obj2) {
 	return obj1.id === obj2.id;
 };
 
+/** @private
+* @param {Object} e
+*/
+let _preventDefault = function(e) {
+	if(e) {
+		e.preventDefault();
+	}
+};
+/** @private
+* @param {number=} id
+* @returns {number} Always return 0
+*/
+let _clearTimeout = function(id) {
+	if(id) {
+		clearTimeout(id);
+	}
+	return 0;
+};
+
 /** @constructor
 * @extends {EventDispatcher}
 * @param {(Element|null)=} placeholder
@@ -45365,10 +45493,6 @@ Grid.prototype._topSection = true;
 * @private
 */
 Grid.prototype._focusingArgs = null;
-/** @type {number}
-* @private
-*/
-Grid.prototype._scrolledRow = -1;
 /** @type {boolean}
 * @private
 */
@@ -45383,10 +45507,8 @@ Grid.prototype.dispose = function() {
 		clearInterval(this._autoLayoutTimer);
 		this._autoLayoutTimer = 0;
 	}
-	if(this._pollingTimerId) {
-		clearTimeout(this._pollingTimerId);
-		this._pollingTimerId = 0;
-	}
+	this._pollingTimerId = _clearTimeout(this._pollingTimerId);
+
 	this.removeAllColumns(); // Some conflators are reset
 	this.removeAllRows(); // Some conflators are reset
 	this._sorter.dispose();
@@ -45409,9 +45531,8 @@ Grid.prototype.dispose = function() {
 	}
 
 	if(this._focusingArgs) {
-		if(this._focusingArgs.id) {
-			clearTimeout(this._focusingArgs.id);
-		}
+		_clearTimeout(this._focusingArgs.id);
+		_clearTimeout(this._focusingArgs.timeoutId);
 		this._focusingArgs = null;
 	}
 };
@@ -45716,6 +45837,7 @@ Grid.prototype.initialize = function(gridOption) {
 	this.addListener(gridOption, "beforeContentBinding");
 	this.addListener(gridOption, "firstRendered");
 	this.addListener(gridOption, "afterContentBinding");
+	this.addListener(gridOption, "tabNavigation");
 
 	if(gridOption["autoDateConversion"]) {
 		t._autoDateConversion = true;
@@ -48232,12 +48354,15 @@ Grid.prototype._renderColumnHeader = function(colIndex, arg) {
 	let colName = colDef.getName();
 	let colTooltip = colDef.getTooltip();
 	let headerAlignment = colDef.getHeaderAlignment();
+	let tooltipValue = colDef.getTooltipValue();
 
 	for(let r = 0; r < rowCount; ++r) {
 		let tCell = tSection.getCell(colIndex, r, false);
 		// Default behaviors
 		tCell.setContent(colName);
-		tCell.setTooltip(colTooltip);
+		tCell.setTooltipInfo("columnDefault", tooltipValue);
+		tCell.setTooltipInfo("columnTooltip", colTooltip);
+		tCell.updateTooltip();
 		tCell.setStyle("textAlign", headerAlignment);
 
 		if(customRenderer) {
@@ -48865,6 +48990,8 @@ Grid.prototype._logData = function(rowDefs, options) {
 
 /** @public
 * @description Replace existing row by a new row. Row Id is always changed, after the row is replaced.
+* If the rowId of the new row is identical to that of the replacing row. Grid will do nothing because
+* similar rowIds indicate that they are the same row.
 * @param {Grid~RowReference} rowRef Reference (i.e. row index, row id, or row definition) of the insert position
 * @param {(RowDefinition~Options|string)=} rowOption
 * @returns {RowDefinition} Returns null, if the row is not replaced. Otherwise, a newly created row is returned
@@ -48985,38 +49112,49 @@ Grid.prototype.getVScrollView = function () {
 	return this._grid.getVScrollView();
 };
 
-/** @private
-* @param {Element} el
-* @return {boolean}
-*/
-function isFocusableContent(el) {
-	if(el) {
-		return (el.tagName !== "SPAN" && !el.disabled);
-	}
-	return false;
-}
 /** @private
 * @param {Object} cell
+* @param {Object} args
 * @return {boolean}
 */
-function focusCell(cell) {
+Grid.prototype._focusCell = function(cell, args) {
 	if(cell) {
 		let cellContent = cell.getContent();
-		if(cellContent && isFocusableContent(cellContent)) {
-			cellContent.focus();
-			return true;
+		if(cellContent) {
+			let nfe = null;
+			if(this.hasListener("tabNavigation")) {
+				let tabNavArg = {
+					"shiftKey": args.shiftKey,
+					"activeElement": args.activeElement,
+					"cellContent": cellContent,
+					"cell": cell,
+					"colIndex": args.colIndex,
+					"rowIndex": args.rowIndex,
+					"field": args.fields ? args.fields[args.colIndex] : ""
+				};
+				this._dispatch("tabNavigation", tabNavArg);
+				nfe = tabNavArg.nextFocusableElement;
+			} else if(cellContent.tagName !== "SPAN") {
+				nfe = cellContent;
+			}
+
+			if(nfe && nfe !== args.activeElement && !nfe.disabled) {
+				nfe.focus();
+				return true;
+			}
 		}
 	}
 	return false;
-}
+};
 /** @private
 */
 Grid.prototype._onVScroll = function() {
 	let args = this._focusingArgs;
 	if(args) {
+		args.timeoutId = _clearTimeout(args.timeoutId);
 		this._focusingArgs = null;
 		let cell = this._grid.getCell("content", args.colIndex, args.rowIndex);
-		if(!focusCell(cell)) {
+		if(!this._focusCell(cell, args)) {
 			if(args.shiftKey) {
 				this._focusPrevCellContent(args);
 			} else {
@@ -49027,6 +49165,11 @@ Grid.prototype._onVScroll = function() {
 };
 /** @private
 */
+Grid.prototype._onScrollTimeout = function() {
+	this._focusingArgs = null;
+};
+/** @private
+*/
 Grid.prototype._selfScrollToRow = function() {
 	let args = this._focusingArgs;
 	if(args) {
@@ -49036,20 +49179,14 @@ Grid.prototype._selfScrollToRow = function() {
 };
 /** @private
 * @param {Object} args
-* @param {number} colIndex
-* @param {number} rowIndex
 */
-Grid.prototype._requestScroll = function(args, colIndex, rowIndex) {
-	if(this._focusingArgs || this._scrolledRow === args.rowIndex) {
-		return; // Avoid infinite loop
+Grid.prototype._requestScroll = function(args) {
+	if(!this._focusingArgs) {
+		this._focusingArgs = args;
+		args.event = null; // The event is invalid after the scroll
+		args.id = setTimeout(this._selfScrollToRow, 0); // Avoid event loop protection
+		args.timeoutId = setTimeout(this._onScrollTimeout, 100); // To avoid a fail case where scroll cannot be performed
 	}
-
-	this._scrolledRow = args.rowIndex;
-	this._focusingArgs = args;
-	args.colIndex = colIndex;
-	args.rowIndex = rowIndex;
-	args.event = null; // The event is invalid after the scroll
-	args.id = setTimeout(this._selfScrollToRow); // Avoid event loop protection
 };
 /** @private
 * @param {Object} args
@@ -49073,28 +49210,27 @@ Grid.prototype._focusNextCellContent = function(args) {
 			startIdx = i;
 		}
 	}
-	// If the current focus is on a valid content, starts on the next cell
-	if(args.event && args.validContent) {
-		startIdx++;
-	}
 
 	let grid = this._grid;
 	let section = grid.getSection("content");
 	let viewInfo = grid.getVerticalViewInfo();
 	let lastFullRow = viewInfo.lastFullRow;
 	let rowCount = this.getRowCount();
+
+	args.fields = grid.getColumnFields();
 	for(let r = rowIndex; r < rowCount; r++) {
+		args.rowIndex = r;
 		for(i = startIdx; i < len; i++) {
 			let c = focusableColIndices[i];
+			args.colIndex = c;
 			if(r > lastFullRow) {
-				this._requestScroll(args, c, r);
+				_preventDefault(args.event);
+				this._requestScroll(args);
 				return;
 			} else {
 				let cell = section.getCell(c, r);
-				if(focusCell(cell)) {
-					if(args.event) {
-						args.event.preventDefault();
-					}
+				if(this._focusCell(cell, args)) {
+					_preventDefault(args.event);
 					return;
 				}
 			}
@@ -49102,9 +49238,8 @@ Grid.prototype._focusNextCellContent = function(args) {
 		startIdx = 0;
 	}
 
-	if(args.validContent) { // The current focus on the last focusable content
-		this._grid.getHiddenInput().focus();
-	}
+	// The current focus on the last focusable content
+	this._grid.getHiddenInput().focus();
 };
 /** @private
 * @param {Object} args
@@ -49128,27 +49263,26 @@ Grid.prototype._focusPrevCellContent = function(args) {
 			startIdx = i;
 		}
 	}
-	// If the current focus is on a valid content, starts on the next cell
-	if(args.event && args.validContent) {
-		--startIdx;
-	}
 
 	let grid = this._grid;
 	let section = grid.getSection("content");
 	let viewInfo = grid.getVerticalViewInfo();
 	let firstFullRow = viewInfo.firstFullRow;
+
+	args.fields = this.getColumnFields();
 	for(let r = rowIndex; r >= 0; r--) {
+		args.rowIndex = r;
 		for(i = startIdx; i >= 0; i--) {
 			let c = focusableColIndices[i];
+			args.colIndex = c;
 			if(r < firstFullRow) {
-				this._requestScroll(args, c, r);
+				_preventDefault(args.event);
+				this._requestScroll(args);
 				return;
 			} else {
 				let cell = section.getCell(c, r);
-				if(focusCell(cell)) {
-					if(args.event) {
-						args.event.preventDefault();
-					}
+				if(this._focusCell(cell, args)) {
+					_preventDefault(args.event);
 					return;
 				}
 			}
@@ -49156,15 +49290,18 @@ Grid.prototype._focusPrevCellContent = function(args) {
 		startIdx = len - 1;
 	}
 
-	if(args.validContent) { // The current focus on the last focusable content
-		this._grid.getHiddenInput(true).focus();
-	}
+	// The current focus on the last focusable content
+	this._grid.getHiddenInput(true).focus();
 };
 
 /** @private
 * @param {Object} e
 */
 Grid.prototype._onTabNavigation = function(e) {
+	if(this._focusingArgs) {
+		return; // Cannot do another tab navigation while waiting for scrolling
+	}
+
 	let colDefs = this.getColumnDefinitions();
 	let colCount = colDefs.length;
 
@@ -49179,19 +49316,8 @@ Grid.prototype._onTabNavigation = function(e) {
 		return;
 	}
 
-	this._scrolledRow = -1; // Reset the scroll loop protector
 	let keyEvt = e.event;
 	let pos = this.getRelativePosition(keyEvt);
-	let validContent = true;
-	let activeElement = e.activeElement;
-	if(activeElement) {
-		validContent = !activeElement.classList.contains("valigner");
-	}
-
-	if(validContent) {
-		let content = pos["cell"] ? pos["cell"].getContent() : null;
-		validContent = isFocusableContent(content);
-	}
 	let startingRowIndex = pos["rowIndex"];
 	if(e.onTheEdge) {
 		let viewInfo = this._grid.getVerticalViewInfo();
@@ -49203,7 +49329,7 @@ Grid.prototype._onTabNavigation = function(e) {
 		colIndex: pos["colIndex"],
 		rowIndex: startingRowIndex,
 		focusableColIndices: focusableColIndices,
-		validContent: validContent
+		activeElement: e.activeElement
 	};
 
 	if(keyEvt.shiftKey) {
@@ -49213,6 +49339,16 @@ Grid.prototype._onTabNavigation = function(e) {
 	}
 };
 
+/** @public
+* @ignore
+* @return {!Object}
+*/
+Grid.prototype._getEventHandlers = function() {
+	return {
+		"tabNavigation": this._onTabNavigation
+	};
+};
+
 
 /* harmony default export */ var js_Grid = (Grid);