@refinitiv-ui/efx-grid 6.0.108 → 6.0.110

package/lib/tr-grid-util/es6/Color.d.ts

@@ -0,0 +1,40 @@
+
+
+declare namespace Color {
+
+}
+
+declare function rgb2Hex(rgbCode: string): string;
+
+declare function num2Hex(triplet: (number)[]|null): string;
+
+declare function num2Rgb(triplet: (number)[]|null): string;
+
+declare function hex2Num(hex: string): (number)[]|null;
+
+declare function hex2Rgb(hex: string): string;
+
+declare function getColorLuminance(color: number): number;
+
+declare function getRelativeLuminance(triplet: (number)[]|null): number;
+
+declare function getContrastRatio(lumin1: number, lumin2: number): number;
+
+declare function getContrastColor(triplet: (number)[]|null): string;
+
+declare function blendColor(baseColor: string, maxColor: string, ratio: number): (number)[]|null;
+
+export default Color;
+export {
+	Color,
+	rgb2Hex,
+	num2Hex,
+	num2Rgb,
+	hex2Num,
+	hex2Rgb,
+	getColorLuminance,
+	getRelativeLuminance,
+	getContrastRatio,
+	getContrastColor,
+	blendColor
+};

package/lib/tr-grid-util/es6/Color.js

@@ -0,0 +1,210 @@
+/** @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;
+
+export default Color;
+export {
+	Color,
+	rgb2Hex,
+	num2Hex,
+	num2Rgb,
+	hex2Num,
+	hex2Rgb,
+	getColorLuminance,
+	getRelativeLuminance,
+	getContrastRatio,
+	getContrastColor,
+	blendColor
+};

package/lib/tr-grid-util/es6/Util.d.ts

@@ -1,4 +1,4 @@
-
+import { rgb2Hex } from "./Color.js";
 
 declare namespace Util {
 
@@ -42,8 +42,6 @@ declare function isTouchDevice(): boolean;
 
 declare function nestedObjectToArray(obj: any, ary?: any[]|null): any[]|null;
 
-declare function rgb2Hex(rgbCode: string): string;
-
 declare function prepareTSVContent(data: any): string;
 
 export default Util;

package/lib/tr-grid-util/es6/Util.js

@@ -1,3 +1,5 @@
+import { rgb2Hex } from "./Color.js";
+
 /** @namespace */
 let Util = {};
 
@@ -453,43 +455,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

package/lib/types/es6/Core/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/types/es6/FilterInput.d.ts

@@ -50,6 +50,8 @@ declare class FilterInputPlugin extends GridPlugin {
 
     public setInputValue(colIndex: number, value: any): void;
 
+    public disableColumnInput(colIndex: number, disabled?: boolean|null): void;
+
     public refresh(delayMs?: number|null): void;
 
     public setFilterLogic(colIndex: number, func: ((...params: any[]) => any)|null, ctx?: any): void;

package/lib/types/es6/RealtimeGrid/ColumnDefinition.d.ts

@@ -46,7 +46,8 @@ declare namespace ColumnDefinition {
         leftPinned?: boolean|null,
         rightPinned?: boolean|null,
         info?: any,
-        focusable?: boolean|null
+        focusable?: boolean|null,
+        backgroundColor?: string|null
     };
 
 }
@@ -163,6 +164,10 @@ declare class ColumnDefinition {
 
     public isFocusable(): boolean;
 
+    public getBackgroundColor(): string;
+
+    public setBackgroundColor(color: string): void;
+
 }
 
 declare const COL_DEF: string;

package/lib/types/es6/RealtimeGrid/Grid.d.ts

@@ -211,6 +211,10 @@ declare class Grid extends EventDispatcher {
 
     public setColumnName(colIndex: number, str: string): void;
 
+    public getColumnBackgroundColor(colRef: Grid.ColumnReference|null): string;
+
+    public setColumnBackgroundColor(colRef: Grid.ColumnReference|null, color: string): void;
+
     public setColumnRenderer(colRef: Grid.ColumnReference|null, func?: ((...params: any[]) => any)|null): void;
 
     public activateColumnRenderer(colRef: Grid.ColumnReference|null, id?: string|null, func?: ((...params: any[]) => any)|null): void;

package/lib/types/es6/RowFiltering.d.ts

@@ -129,6 +129,10 @@ declare class RowFilteringPlugin extends GridPlugin {
 
     public enableSeparatorFiltering(enabled?: boolean|null): void;
 
+    public showColumnFilterIcon(colIndex: number, shown?: boolean|null): void;
+
+    public hideColumnFilterIcon(colIndex: number, hidden?: boolean|null): void;
+
 }
 
 declare function colSettings(colIndex: number, exp: RowFilteringPlugin.Expression|null, ctx?: (any|string)|null): boolean;

package/lib/versions.json

@@ -1,5 +1,5 @@
 {
-	"tr-grid-util": "1.3.153",
+	"tr-grid-util": "1.3.154",
 	"tr-grid-printer": "1.0.18",
 	"@grid/column-dragging": "1.0.20",
 	"@grid/row-segmenting": "1.0.31",
@@ -17,14 +17,14 @@
 	"tr-grid-conditional-coloring": "1.0.70",
 	"tr-grid-content-wrap": "1.0.20",
 	"tr-grid-contextmenu": "1.0.41",
-	"tr-grid-filter-input": "0.9.39",
+	"tr-grid-filter-input": "0.9.40",
 	"tr-grid-heat-map": "1.0.29",
 	"tr-grid-in-cell-editing": "1.0.87",
 	"tr-grid-pagination": "1.0.24",
 	"tr-grid-percent-bar": "1.0.24",
 	"tr-grid-range-bar": "2.0.8",
 	"tr-grid-row-dragging": "1.0.35",
-	"tr-grid-row-filtering": "1.0.77",
+	"tr-grid-row-filtering": "1.0.78",
 	"tr-grid-row-grouping": "1.0.88",
 	"tr-grid-row-selection": "1.0.30",
 	"tr-grid-rowcoloring": "1.0.25",

package/package.json

@@ -67,5 +67,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"version": "6.0.108"
+	"version": "6.0.110"
 }