@refinitiv-ui/efx-grid 6.0.116 → 6.0.118

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

@@ -2352,7 +2352,209 @@ let translation = {
 
 /* harmony default export */ var locale_translation = (translation);
 
+// CONCATENATED MODULE: ./node_modules/tr-grid-util/es6/Color.js
+/** @namespace */
+let Color = {};
+
+/** @private
+* @constant
+* @type {RegExp}
+*/
+const NumRegExp = /\d+/g;
+
+/** Convert CSS rgb or rgba formats to CSS hex color string (with # prefix)
+* @public
+* @param {string} rgbCode RGB values without # prefix
+* @return {string} RGB in hex code (with # prefix)
+* @example
+* rgb2Hex("rgb(255, 255, 0)"); // "#FFFF00"
+* rgb2Hex("rgba(255, 255, 0, 1)"); // "#FFFF00"
+* rgb2Hex("255 255.0"); // "#FFFF00"
+* rgb2Hex("#FFFF00"); // "#FFFF00"
+* rgb2Hex("#1a1a1a"); // "#1a1a1a"
+* rgb2Hex("2552550"); // "2552550"
+* rgb2Hex("invalid"); // "invalid"
+* rgb2Hex(null); // ""
+*/
+let rgb2Hex = function (rgbCode) {
+	if(!rgbCode || typeof rgbCode !== "string") {
+		return "";
+	}
+	if(rgbCode.charAt(0) === "#") {
+		return rgbCode;
+	}
+	let rgb = rgbCode.match(NumRegExp);
+	if(!rgb || rgb.length < 3) {
+		return rgbCode;
+	}
+
+	let hex = "#";
+	for(let i = 0; i < 3; i++) {
+		let num = +rgb[i];
+		if(!(num >= 16)) { // Handle NaN case
+			hex += "0";
+		}
+		hex += (num) ? num.toString(16).toUpperCase() : "0";
+	}
+	return hex;
+};
+
+/** @public
+* @function
+* @param {Array.<number>} triplet
+* @return {string} resultColor
+*/
+let num2Hex = function (triplet) {
+	let rgb = triplet[2] | (triplet[1] << 8) | (triplet[0] << 16);
+	return ("#" + (0x1000000 + rgb).toString(16).slice(1));
+};
+/** Note that Chrome, IE, and Firefox store color in rgb representation.
+* @public
+* @function
+* @param {Array.<number>} triplet
+* @return {string} Color string in RGB represetation (e.g. rgb(100, 44, 1))
+*/
+let num2Rgb = function (triplet) {
+	return "rgb(" + triplet[0] + ", " + triplet[1] + ", " + triplet[2] + ")";
+};
+/** @public
+* @function
+* @param {string} hex
+* @return {Array.<number>} Array of size 3 which contains [red, green, blue]
+*/
+let hex2Num = function (hex) {
+	let hexInt = parseInt(hex.replace(/[^0-9A-F]/gi, ""), 16);
+	let r = (hexInt >> 16) & 255;
+	let g = (hexInt >> 8) & 255;
+	let b = hexInt & 255;
+	return [r, g, b];
+};
+/** @public
+* @function
+* @param {string} hex Color string with leading # character (e.g. #FFAA00)
+* @return {string} Color string in RGB represetation (e.g. rgb(100, 44, 1))
+*/
+let hex2Rgb = function (hex) {
+	if(hex) {
+		let hexInt = parseInt(hex.replace(/[^0-9A-F]/gi, ""), 16);
+		let r = (hexInt >> 16) & 255;
+		let g = (hexInt >> 8) & 255;
+		let b = hexInt & 255;
+		return "rgb(" + r + ", " + g + ", " + b + ")";
+	}
+	return "";
+};
+
+/** @public
+* @function
+* @param {number} color A color component (e.g., R, G, or B) with value between 0 and 255 (inclusive)
+* @return {number} Normalized luminance value between 0 and 1
+*/
+let getColorLuminance = function (color) {
+	if(!color || color < 0) {
+		return 0;
+	}
+	if(color >= 255) {
+		return 1;
+	}
+	let normalizedColor = color / 255;
+	if(normalizedColor <= 0.03928) {
+		return normalizedColor / 12.92;
+	}
+	return Math.pow((normalizedColor + 0.055) / 1.055, 2.4);
+};
+/** The relative brightness of any point in a colorspace, normalized to 0 for darkest black and 1 for lightest white (https://www.w3.org/TR/WCAG20/#relativeluminancedef)
+* @public
+* @function
+* @param {Array.<number>} triplet
+* @return {number} Normalized value between 0 and 1
+*/
+let getRelativeLuminance = function (triplet) {
+	let R = getColorLuminance(triplet[0]);
+	let G = getColorLuminance(triplet[1]);
+	let B = getColorLuminance(triplet[2]);
+
+	return 0.2126 * R + 0.7152 * G + 0.0722 * B;
+};
+/** @public
+* @function
+* @param {number} lumin1
+* @param {number} lumin2
+* @return {number} Contrast ratios can range from 1 to 21 (commonly written 1:1 to 21:1).
+*/
+let getContrastRatio = function (lumin1, lumin2) {
+	if(lumin1 === lumin2) {
+		return 1;
+	}
+	let darker = lumin1;
+	let lighter = lumin2;
+
+	if(lumin1 > lumin2) {
+		lighter = lumin1;
+		darker = lumin2;
+	}
+	return (lighter + 0.05) / (darker + 0.05);
+};
+/** @public
+* @function
+* @param {Array.<number>} triplet
+* @return {string} white or black color in hex code
+*/
+let getContrastColor = function (triplet) {
+	let luminance = getRelativeLuminance(triplet);
+	let contrastW = getContrastRatio(1, luminance);
+	let contrastB = getContrastRatio(0, luminance);
+
+	if (contrastB >= contrastW) { // Brighter color has more impact to human eye than the darker color
+		return "#000000";
+	}
+	return "#ffffff";
+};
+
+/** Blend two colors into single color with the specified ratio
+* @public
+* @function
+* @param {string} baseColor
+* @param {string} maxColor
+* @param {number} ratio [0, 1]
+* @return {Array.<number>} resultColor
+*/
+let blendColor = function (baseColor, maxColor, ratio) { // This can be optimized further
+	if (ratio > 1) {
+		ratio = 1;
+	} else if(ratio < 0) {
+		ratio = 0;
+	}
+
+	let baseColorTriplet = hex2Num(baseColor);
+	let maxColorTriplet = hex2Num(maxColor);
+	let blendResult = [];
+	for (let i = 0; i < 3; ++i) {
+		let gap = (maxColorTriplet[i] - baseColorTriplet[i]) * ratio;
+		blendResult.push(baseColorTriplet[i] + gap);
+	}
+
+	return blendResult;
+};
+
+
+Color.rgb2Hex = rgb2Hex;
+Color.num2Hex = num2Hex;
+Color.num2Rgb = num2Rgb;
+Color.hex2Num = hex2Num;
+Color.hex2Rgb = hex2Rgb;
+Color.getColorLuminance = getColorLuminance;
+Color.getRelativeLuminance = getRelativeLuminance;
+Color.getContrastRatio = getContrastRatio;
+Color.getContrastColor = getContrastColor;
+Color.blendColor = blendColor;
+
+/* harmony default export */ var es6_Color = (Color);
+
+
 // CONCATENATED MODULE: ./node_modules/tr-grid-util/es6/Util.js
+
+
 /** @namespace */
 let Util = {};
 
@@ -2808,43 +3010,6 @@ let nestedObjectToArray = function (obj, ary) {
 	return ary;
 };
 
-/** Convert CSS rgb or rgba formats to CSS hex color string (# prefix)
-* @public
-* @param {string} rgbCode
-* @return {string}
-* @example
-* rgb2Hex("rgb(255, 255, 0)"); // "#FFFF00"
-* rgb2Hex("rgba(255, 255, 0, 1)"); // "#FFFF00"
-* rgb2Hex("255 255.0"); // "#FFFF00"
-* rgb2Hex("#FFFF00"); // "#FFFF00"
-* rgb2Hex("#1a1a1a"); // "#1a1a1a"
-* rgb2Hex("2552550"); // "2552550"
-* rgb2Hex("invalid"); // "invalid"
-* rgb2Hex(null); // ""
-*/
-let rgb2Hex = function (rgbCode) {
-	if(!rgbCode || typeof rgbCode !== "string") {
-		return "";
-	}
-	if(rgbCode.charAt(0) === "#") {
-		return rgbCode;
-	}
-	let rgb = rgbCode.match(/\d+/g);
-	if(!rgb || rgb.length < 3) {
-		return rgbCode;
-	}
-
-	let hex = "#";
-	for(let i = 0; i < 3; i++) {
-		let num = +rgb[i];
-		if(!(num >= 16)) { // Handle NaN case
-			hex += "0";
-		}
-		hex += (num) ? num.toString(16).toUpperCase() : "0";
-	}
-	return hex;
-};
-
 /** transform data to tab seperated value
 * @public
 * @param {*} data
@@ -12771,7 +12936,7 @@ DataTable._proto = DataTable.prototype;
 * @property {Array.<string>=} fields=null Field that corresponds to the given static values
 * @property {boolean=} asChain=false The given ric will be treated as a chain
 * @property {string=} chainRic="" RIC to be used for chain request (overiding ric property)
-* @property {boolean=} collapsed=true Chain or segment is collapsed by default
+* @property {boolean=} collapsed Chain is collapsed by default. Segment is expanded by default.
 * @property {(string|null)=} label=null
 * @property {boolean=} hidden=true When this row is hidden
 * @property {boolean=} realTime=true Realtime row, able to request for JET/RTK
@@ -12898,7 +13063,7 @@ RowDefinition.prototype._subId = "";
 /** @type {boolean|null}
 * @private
 */
-RowDefinition.prototype._expanded = null;
+RowDefinition.prototype._collapsed = null;
 /** @type {boolean}
 * @private
 */
@@ -13030,17 +13195,15 @@ RowDefinition.prototype.initialize = function(rowOptions) {
 		this._realTime = val;
 	}
 
-	val = rowOptions["collapsed"];
-	let collapsed = extractedOptions["collapsed"];
-	if(val != null || !collapsed){
-		this._expanded = !collapsed;
-	}
-
 	val = rowOptions["asSegment"];
 	if(val != null) {
 		this._asSegment = val ? true : false;
 	}
 
+	if(this._isChain) {
+		this._collapsed = extractedOptions["collapsed"]; // Temporary state
+	}
+
 	val = rowOptions["keepModel"];
 	if(val) {
 		this._userModel = rowOptions;
@@ -13162,12 +13325,11 @@ RowDefinition.prototype.setContent = function(userInput, extractedOptions) {
 	this.resetUpdates(); // Remove all previous data updates because a new content is just entered
 
 	this._userInput = userInput;
+	let collapsed = extractedOptions["collapsed"];
 	if(realtimeRow) {
-		let expanded = !extractedOptions["collapsed"];
 		let chainRic = extractedOptions["chainRic"];
 		if(asChain === true){
-			this._ric = expanded === false ? userInput : userInput.replace("0#", "");
-			this._expanded = expanded; // Only chain can be expanded by 0#
+			this._ric = collapsed === true ? userInput : userInput.replace("0#", "");
 		} else {
 			this._ric = userInput;
 		}
@@ -13194,15 +13356,12 @@ RowDefinition.prototype.setContent = function(userInput, extractedOptions) {
 		if(this._isChain) {
 			dv.setSegmentSeparator(this._rowId, true);
 		}
-		if(this.isChainCollapsed()) {
-			if(this._expanded){
-				this.expandChain();
-			}
-		} else {
-			if (!this._expanded) {
-				this.collapseChain();
-			}
+
+		if(collapsed !== this.isChainCollapsed()) {
+			dv.collapseSegment(this._rowId, collapsed);
 		}
+		this._collapsed = null;
+
 		_stallSorting(dv, false, stalledSorting);
 		if(segmentId) { // If data id is changed and the row is a child of a segment, then segment child data id must be updated
 			dv.addSegmentChild(segmentId, this._rowId, this._dataId);
@@ -13278,9 +13437,9 @@ RowDefinition.prototype.getConfigObject = function(rowOptions) {
 		obj["asChain"] = val;
 	}
 
-	val = this._expanded;
+	val = this._collapsed;
 	if(val != null) {
-		obj["collapsed"] = !val;
+		obj["collapsed"] = val;
 	}
 
 	// check row hidden
@@ -13788,8 +13947,9 @@ RowDefinition.prototype.registerToView = function(view, rowId) {
 	if(isSegment) {
 		view.setSegmentSeparator(newRowId);
 		_stallSorting(view, false, stalledSorting);
-		if(!this._expanded) {
-			view.collapseSegment(newRowId);
+		if(this._collapsed != null) {
+			view.collapseSegment(newRowId, this._collapsed);
+			this._collapsed = null;
 		}
 	} else if(!this._parent && parentRowId) { // Constituent cannot be added to another segment
 		view.addSegmentChild(parentRowId, newRowId, this._dataId);
@@ -13907,23 +14067,22 @@ RowDefinition.prototype._toRealTimeRow = function() {
 	if(!this._ric) { // Empty row
 		return;
 	}
-	if(this.isRowHeader()) {
-		return;
+	if(this.isRowHeader() || !this._parent) {
+		return; // If the row is already a normal row or row header, it cannot be converted
 	}
 
-	this._realTimeField = true;
+	this._realTime = true;
+	this._dc.setRowData(this._dataId, null); // Remove existing data. WARNING: Trigger data update immediately
 	this._dataId = this._rowId + this._ric; // JET/RTK will generate data id to be rowId (given from this rowDef) + ric;
 
 	this._autoGenerated = false;
 	this._parent = null;
 	this._depthLevel = 0;
 
-	// Add static value to the new allocated row
-	if(this._staticValues) {
+	this.subscribeForUpdates();
+	if(this._staticValues) { // Add static value to the new allocated row
 		this.setRowData(this._staticValues);
 	}
-
-	this.subscribeForUpdates();
 };
 
 /** @public
@@ -13957,7 +14116,7 @@ RowDefinition.prototype.unlinkChain = function() {
 		view.setSegmentSeparator(rid, false);
 	}
 
-	this._isChain = this._expanded = false;
+	this._isChain = false;
 	this._chainRic = "";
 	this._userInput = this._ric;
 	this._children = null;
@@ -13970,7 +14129,6 @@ RowDefinition.prototype.unlinkChain = function() {
 */
 RowDefinition.prototype.collapseChain = function() {
 	if(this._isChain && this._view) {
-		this._expanded = false;
 		return this._view.collapseSegment(this._rowId, true);
 	}
 	return false;
@@ -13986,7 +14144,6 @@ RowDefinition.prototype.collapseChain = function() {
 */
 RowDefinition.prototype.expandChain = function() {
 	if(this._isChain && this._view) {
-		this._expanded = true;
 		return this._view.collapseSegment(this._rowId, false);
 	}
 	return false;
@@ -13999,7 +14156,7 @@ RowDefinition.prototype.expandChain = function() {
 * @return {boolean} Returns true if there is a change in view
 */
 RowDefinition.prototype.toggleChain = function() {
-	if(this._expanded) {
+	if(this.isChainExpanded()) {
 		return this.collapseChain();
 	} else {
 		return this.expandChain();
@@ -14180,6 +14337,8 @@ RowDefinition.extractRowOptions = function(rowOptions) {
 			asChain = true;
 		}
 		expanded = true;
+	} else if(asChain) {
+		expanded = false;
 	}
 
 	let extractedOptions = {};
@@ -15143,9 +15302,12 @@ ColumnDefinition.prototype.initialize = function(columnOption) {
 
 	this._setField(field, columnOption); // Perform some field manipulation
 
-	val = columnOption["name"] || columnOption["title"]; // title is migrated from Composite Grid
+	val = columnOption["name"];
+	if(val == null) {
+		val = columnOption["title"]; // For backward compatability
+	}
 	if(val != null) { // Name can be empty string
-		this._name = val;
+		this._name = (typeof val === "string") ? val : (val + "");
 		this._defaultName = false;
 	}
 
@@ -18384,6 +18546,7 @@ Cell.prototype.initialize = function () {
 			this._aligner = document.createElement("button");
 		}
 		this._aligner.className = "valigner";
+		this._aligner.role = "gridcell";
 		if(this._frontIcon) {
 			this._element.appendChild(this._frontIcon.getElement());
 		}
@@ -35747,6 +35910,7 @@ let _createHiddenInput = function () {
 	styleObj.position = "absolute";
 	styleObj.width = styleObj.height = styleObj.padding = styleObj.border = "0";
 	hiddenInput.value = "0";
+	hiddenInput.role = "grid";
 	return hiddenInput;
 };
 /** @private
@@ -36293,7 +36457,7 @@ Core.prototype._hasPendingRowChange = false;
 * @return {string}
 */
 Core.getVersion = function () {
-	return "5.1.114";
+	return "5.1.117";
 };
 /** {@link ElementWrapper#dispose}
 * @override
@@ -39364,21 +39528,21 @@ Core.prototype.getYScrollVal = function (sectionRef, rowIndex, topOfView) {
 	else if (rowIndex >= rowCount) { rowIndex = rowCount - 1; }
 
 	let viewInfo = this.getVerticalViewInfo();
-	let viewTopIndex = viewInfo.topRowIndex; // TODO: Make it work in zooming mode
+	let firstFullRow = viewInfo.firstFullRow; // TODO: Make it work in zooming mode
 
 	let scrollIndex = -1;
 	if (topOfView) {
 		scrollIndex = rowIndex;
 	} else {
-		if(rowIndex < viewTopIndex) { // Scroll up
+		if(rowIndex < firstFullRow) { // Scroll up
 			scrollIndex = rowIndex - 3; // Have some spaces at the top for more appealing visual
 			if(scrollIndex < 0) {
 				scrollIndex = 0;
 			}
 		} else { // Scroll down
-			let viewBottomIndex = viewInfo.bottomRowIndex;
-			if (rowIndex > viewBottomIndex) {
-				let viewIndexSize = viewBottomIndex - viewTopIndex;
+			let lastFullRow = viewInfo.lastFullRow;
+			if (rowIndex > lastFullRow) {
+				let viewIndexSize = lastFullRow - firstFullRow;
 				scrollIndex = rowIndex - viewIndexSize + 3;
 				if(scrollIndex < 0) {
 					scrollIndex = 0;
@@ -41100,13 +41264,20 @@ Core.prototype.getColumnIndex = function (colRef) {
 		return colRef;
 	} else if(colRef) {
 		let str = colRef;
+		let indexByField = -1;
 		let colCount = this.getColumnCount();
 		for(let c = 0; c < colCount; ++c) {
 			let colDef = this._getColumnDef(c);
-			if(str === colDef["id"] || str === colDef["field"]) {
+			if(str === colDef["id"]){
 				return c;
 			}
+			if(str === colDef["field"]) { // In case colId and field are the same, use colId first and field as a fallback
+				if(indexByField < 0) {
+					indexByField = c;
+				}
+			}
 		}
+		return indexByField;
 	}
 	return -1;
 };
@@ -41909,6 +42080,16 @@ ReferenceCounter.prototype.getAllReferences = function() {
 	return Object.keys(this._counter);
 };
 
+/** @public
+* @return {boolean}
+*/
+ReferenceCounter.prototype.hasReference = function() {
+	for (const key in this._counter) {
+		return true;
+	}
+	return false;
+};
+
 /** @public
 * @return {!Array.<string>}
 */
@@ -42165,6 +42346,14 @@ DataConnector.prototype.getAllRics = function () {
 	return this._rics.getAllReferences();
 };
 
+/**
+ * @public
+ * @returns {boolean}
+*/
+DataConnector.prototype.hasRic = function () {
+	return this._rics.hasReference();
+};
+
 /** @public
  * @returns {Array.<RowDefinition>}
 */
@@ -45170,6 +45359,12 @@ Grid.prototype._focusingArgs = null;
 * @private
 */
 Grid.prototype._scrolledRow = -1;
+/** @type {boolean}
+* @private
+*/
+Grid.prototype._unlinking = false;
+
+
 /** @public
 */
 Grid.prototype.dispose = function() {
@@ -47340,7 +47535,9 @@ Grid.prototype.unlinkChain = function(rowRef) {
 		return;
 	}
 
+	this._unlinking = true;
 	rowDef.unlinkChain();
+	this._unlinking = false;
 };
 
 /** Alias to setRic
@@ -47646,6 +47843,14 @@ Grid.prototype.setRicData = function(ric, values) {
 Grid.prototype.getAllRics = function() {
 	return this._connector.getAllRics();
 };
+
+/** Returns true if there is at least 1 RIC in the grid. This method includes RICs not in the row.
+* @public
+* @return {boolean}
+*/
+Grid.prototype.hasRic = function() {
+	return this._connector.hasRic();
+};
 /** 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
@@ -48029,6 +48234,28 @@ Grid.prototype.getSortOrder = function() {
 Grid.prototype.clearSort = function() {
 	this._stp.clearSortState(); // WARNING: No event is dispatched
 };
+/** Get sorting states from sorting columns
+* @public
+* @return {!Array.<Object>} Array of sorting states ordered by priority. If there is no sorting column, an empty array is returned
+*/
+Grid.prototype.getSortingStates = function () { // This method is mainly for backward compatability
+	let ary = [];
+	let states = this._stp.getSortingStates();
+	let stateCount = states.length;
+
+	for (let i = 0; i < stateCount; i++) {
+		let state = states[i];
+		let colIndex = this._stp.getSortedColumnIndex(i);
+
+		ary.push({
+			"colId": this.getColumnId(colIndex),
+			"colIndex": colIndex,
+			"order": state["sortOrder"]
+		});
+	}
+
+	return ary;
+};
 
 /**
 * @private
@@ -48048,7 +48275,7 @@ Grid.prototype._onQuote2PostUpdate = function (e) {
 */
 Grid.prototype._onDataChanged = function(e) {
 	let rowData = e["rowData"]; // Use rowData to retrieve corresponding subscription object
-	if (!rowData) {
+	if (!rowData || this._unlinking) {
 		return; // This must be a global change
 	}
 	let rowDef = rowData[ROW_DEF];
@@ -53076,17 +53303,17 @@ CellPainter.prototype._getStyles = function(rowData, min, max) {
 			if(this._coloringType === CellPainter.ColoringTypes.HEATMAP) {
 				let blendedColor;
 				if(ret > 0) {
-					blendedColor = CellPainter.blendColor(curCond["baseColor"], curCond["upColor"], ret);
+					blendedColor = blendColor(curCond["baseColor"], curCond["upColor"], ret);
 				} else {
-					blendedColor = CellPainter.blendColor(curCond["baseColor"], curCond["downColor"], -ret);
+					blendedColor = blendColor(curCond["baseColor"], curCond["downColor"], -ret);
 				}
 
 				if(curCond["textMode"]) {
-					CellPainter._colorObj["color"] = CellPainter.num2Hex(blendedColor);
+					CellPainter._colorObj["color"] = num2Hex(blendedColor);
 					return CellPainter._colorObj;
 				} else {
-					CellPainter._bgObj["backgroundColor"] = CellPainter.num2Hex(blendedColor);
-					CellPainter._bgObj["color"] = CellPainter.blackAndWhite(blendedColor);
+					CellPainter._bgObj["backgroundColor"] = num2Hex(blendedColor);
+					CellPainter._bgObj["color"] = getContrastColor(blendedColor);
 
 					return CellPainter._bgObj;
 				}
@@ -53118,94 +53345,50 @@ CellPainter.prototype._getStyles = function(rowData, min, max) {
 };
 
 /** @public
+* @function
 * @param {string} baseColor
 * @param {string} maxColor
 * @param {number} ratio [0, 1]
 * @return {Array.<number>} resultColor
 */
-CellPainter.blendColor = function (baseColor, maxColor, ratio) { // TODO: Optimize this
-	if (ratio > 1) {
-		ratio = 1;
-	} else if(ratio < 0) {
-		ratio = 0;
-	}
-
-	let baseColorTriplet = CellPainter.hex2Num(baseColor);
-	let maxColorTriplet = CellPainter.hex2Num(maxColor);
-	let blendResult = [];
-	for (let i = 0; i < 3; ++i) {
-		let gap = (maxColorTriplet[i] - baseColorTriplet[i]) * ratio;
-		blendResult.push(baseColorTriplet[i] + gap);
-	}
-
-	return blendResult;
-};
-
+CellPainter.blendColor = blendColor; // For backward compatability
 /** @private
+* @function
 * @param {Array.<number>} triplet
 * @return {string} resultColor
 */
-CellPainter.blackAndWhite = function (triplet) {
-	let brightness = Math.sqrt(triplet[0] * triplet[0] * 0.241 + triplet[1] * triplet[1] * 0.691 + triplet[2] * triplet[2] * 0.068);
-
-	if (brightness >= 135) { // Brighter color has more impact to human eye than the darker color
-		return '#000000';
-	}
-	return '#FFFFFF';
-};
-
+CellPainter.blackAndWhite = getContrastColor; // For backward compatability
 /** @public
 * @function
 * @param {string} rgbCode
 * @return {string} resultColor E.g. "#10FF0D"
 */
 CellPainter.rgb2Hex = rgb2Hex; // For backward compatability
-
 /** @public
 * @function
 * @param {Array.<number>} triplet
 * @return {string} resultColor
 */
-CellPainter.num2Hex = function (triplet) {
-	let rgb = triplet[2] | (triplet[1] << 8) | (triplet[0] << 16);
-	return ('#' + (0x1000000 + rgb).toString(16).slice(1));
-};
+CellPainter.num2Hex = num2Hex; // For backward compatability
 /** Note that Chrome, IE, and Firefox store color in rgb representation.
 * @public
 * @function
 * @param {Array.<number>} triplet
 * @return {string} Color string in RGB represetation (e.g. rgb(100, 44, 1))
 */
-CellPainter.num2Rgb = function (triplet) {
-	return 'rgb(' + triplet[0] + ', ' + triplet[1] + ', ' + triplet[2] + ')';
-};
+CellPainter.num2Rgb = num2Rgb; // For backward compatability
 /** @public
 * @function
 * @param {string} hex
 * @return {Array.<number>} array of size 3 which contains [red, green, blue]
 */
-CellPainter.hex2Num = function (hex) {
-	let hexInt = parseInt(hex.replace(/[^0-9A-F]/gi, ''), 16);
-	let r = (hexInt >> 16) & 255;
-	let g = (hexInt >> 8) & 255;
-	let b = hexInt & 255;
-	return [r, g, b];
-};
+CellPainter.hex2Num = hex2Num; // For backward compatability
 /** @public
 * @function
 * @param {string} hex Color string with leading # character (e.g. #FFAA00)
 * @return {string} Color string in RGB represetation (e.g. rgb(100, 44, 1))
 */
-CellPainter.hex2Rgb = function (hex) {
-	if(hex) {
-		let hexInt = parseInt(hex.replace(/[^0-9A-F]/gi, ''), 16);
-		let r = (hexInt >> 16) & 255;
-		let g = (hexInt >> 8) & 255;
-		let b = hexInt & 255;
-		return 'rgb(' + r + ', ' + g + ', ' + b + ')';
-	}
-	return '';
-};
+CellPainter.hex2Rgb = hex2Rgb; // For backward compatability
 
 /** Deprecated. Colors should be changed according to user's settings by CellPainter#loadThemeColors
 * @private
@@ -53341,11 +53524,11 @@ CellPainter._clearBlinkTimer = function(scp, opt_restoreColor) {
 CellPainter.getOppositeColor = function (hexCode) {
 	if(typeof hexCode === "string") {
 		if(hexCode.charAt(0) === "#") {
-			let triplet = CellPainter.hex2Num(hexCode);
-			return CellPainter.blackAndWhite(triplet);
+			let triplet = hex2Num(hexCode);
+			return getContrastColor(triplet);
 		}
 	} else if(Array.isArray(hexCode)) {
-		return CellPainter.blackAndWhite(hexCode);
+		return getContrastColor(hexCode);
 	}
 	return "";
 };