@refinitiv-ui/efx-grid 6.0.12 → 6.0.14

package/lib/tr-grid-column-stack/es6/ColumnStack.d.ts

@@ -10,12 +10,13 @@ import { preventDefault } from "../../tr-grid-util/es6/EventDispatcher.js";
 declare namespace ColumnStackPlugin {
 
     type Options = {
-        fields: (string)[]|null
+        fields: (string)[]|null,
+        stacks: (ColumnStackPlugin.StackDefinition)[]|null
     };
 
     type ColumnOptions = {
         stackId?: string|null,
-        stack?: (string|StackOptions)|null
+        stack?: (string|ColumnStackPlugin.StackOptions)|null
     };
 
     type StackOptions = {
@@ -24,6 +25,21 @@ declare namespace ColumnStackPlugin {
         collapsed?: boolean|null
     };
 
+    type StackDefinition = {
+        id: string,
+        spreading?: boolean|null,
+        collapsed?: boolean|null,
+        children: (string)[]|null,
+        name?: string|null,
+        activeColumn?: string|null
+    };
+
+    type StackConfiguration = {
+        spreading?: boolean|null,
+        collapsed?: boolean|null,
+        activeColumn?: string|null
+    };
+
 }
 
 declare class ColumnStackPlugin extends GridPlugin {
@@ -66,9 +82,9 @@ declare class ColumnStackPlugin extends GridPlugin {
 
     public getStackId(colIndex: number): string;
 
-    public stackColumns(colRefs?: (number|string)[]|null, stackId?: string|null, options?: any, sort?: boolean|null): boolean;
+    public stackColumns(colRefs?: (number|string)[]|null, stackId?: string|null, options?: ColumnStackPlugin.StackConfiguration|null): boolean;
 
-    public setStack(colRefs?: (number|string)[]|null): boolean;
+    public setStack(colRefs?: (number|string)[]|null, activeColRef?: number|string|null): boolean;
 
     public unstackColumns(colIndices?: (number)[]|null): boolean;
 
@@ -90,6 +106,10 @@ declare class ColumnStackPlugin extends GridPlugin {
 
     public reorderStackColumns(colRefs: (number|string)[]|null, stackId: string): void;
 
+    public setStackName(stackId: string, name: string): void;
+
+    public getStackName(stackId: string): string;
+
 }
 
 export default ColumnStackPlugin;

package/lib/tr-grid-column-stack/es6/ColumnStack.js

@@ -10,12 +10,13 @@ import { preventDefault } from "../../tr-grid-util/es6/EventDispatcher.js";
 /** @typedef {Object} ColumnStackPlugin~Options
 * @description Available options describing `columnStack` object specified in grid's option
 * @property {Array.<string>} fields Fields for stacking. The minimum is 2 fields.
+* @property {Array.<ColumnStackPlugin~StackDefinition>} stacks List of stacking configuration
 */
 
 /** @typedef {Object} ColumnStackPlugin~ColumnOptions
 * @description Extension column options that can be specified on each individual grid's column option.
 * @property {string=} stackId Group ID
-* @property {(string|StackOptions)=} stack Group ID or StackOptions object
+* @property {(string|ColumnStackPlugin~StackOptions)=} stack Group ID or StackOptions object
 */
 
 /** @typedef {Object} ColumnStackPlugin~StackOptions
@@ -25,6 +26,23 @@ import { preventDefault } from "../../tr-grid-util/es6/EventDispatcher.js";
 * @property {boolean=} collapsed=true If disabled, this group will be expanded at the first time
 */
 
+/** @typedef {Object} ColumnStackPlugin~StackDefinition
+* @description Available options for setting stack
+* @property {string} id Group ID
+* @property {boolean=} spreading=false If specified true, this group will be running in collapsing mode
+* @property {boolean=} collapsed=true If disabled, this group will be expanded at the first time
+* @property {Array.<string>} children Children column ID
+* @property {string=} name="" Name defined for specific stack
+* @property {string=} activeColumn="" Column Id of active column in stack
+*/
+
+/** @typedef {Object} ColumnStackPlugin~StackConfiguration
+* @description Available options describing grouped column displaying
+* @property {boolean=} spreading=false If specified true, this group will be running in collapsing mode
+* @property {boolean=} collapsed=true If disabled, this group will be expanded at the first time
+* @property {string=} activeColumn="" Column index or field for set as active column
+*/
+
 /** @constructor
 * @extends {GridPlugin}
 */
@@ -185,7 +203,9 @@ ColumnStackPlugin.prototype.config = function (options) {
 	if(!options) { return; }
 
 	var columns = options["columns"];
-	if(!columns) { return; }
+	if(!columns) {
+		columns = [];
+	}
 
 	var i, len = columns.length;
 	for(i = 0; i < len; ++i) {
@@ -203,6 +223,19 @@ ColumnStackPlugin.prototype.config = function (options) {
 				spreading: columnStack.spreading === true,
 				collapsed: columnStack.collapsed !== false
 			};
+		} else if (columnStack.stacks && columnStack.stacks.length) {
+			var stackLen = columnStack.stacks.length;
+			for(i = 0; i < stackLen; i++){
+				var stackConfig = columnStack.stacks[i];
+				sid = stackConfig.id || this._generateStackId();
+				if(stackConfig.collapsed == null){
+					stackConfig.collapsed = true;
+				}
+				if(stackConfig.spreading == null){
+					stackConfig.spreading = false;
+				}
+				stacks[sid] = stackConfig;
+			}
 		}
 	} else {
 		var column, stackOpt;
@@ -231,8 +264,17 @@ ColumnStackPlugin.prototype.config = function (options) {
 	}
 
 	if(this._initializedGrid) {
+		if(Object.keys(stacks).length){
+			this.removeAllStacks(false);
+		} else {
+			this.removeAllStacks();
+		}
 		for(sid in stacks) {
-			this.stackColumns(stacks[sid].colRefs, sid, stacks[sid]);
+			var config = stacks[sid];
+			if(!config.colRefs){
+				this._transformStackConfig(config);
+			}
+			this.stackColumns(config.colRefs, sid, config);
 		}
 	} else {
 		this._pendingStacks = this._pendingStacks || stacks;
@@ -250,27 +292,34 @@ ColumnStackPlugin.prototype.getConfigObject = function (gridOptions) {
 	if (this._columnStack != null) {
 		obj.columnStack = this._columnStack;
 	} else {
-		var columns = obj.columns;
-		if (!columns) {
-			columns = obj.columns = [];
-		}
-
-		var len = this.getColumnCount();
-		for (var i = 0; i < len; ++i) {
-			var column = columns[i];
-			if (!column) {
-				column = columns[i] = {};
-			}
-
-			var stackOpt = this._getColumnStackOptions(i);
-			if (!stackOpt) continue;
-
-			column.stack = {
-				id: stackOpt.stackId,
-				spreading: stackOpt.spreading,
-				collapsed: stackOpt.collapsed
+		var stacks = this._stacks;
+		var stackOptions = [];
+
+		for (var stackKey in stacks) {
+			var stackOption = stacks[stackKey];
+			var activeColIndex = this._getColumnIndex(stackOption.activeColumn);
+			var stackConfigObj = {
+				id: stackOption.stackId,
+				children: this.getStackMemberIds(stackOption.stackId),
+				activeColumn: this.getColumnId(activeColIndex)
 			};
+			var name = stackOption.name;
+			var collapsed = stackOption.collapsed;
+			var spreading = stackOption.spreading;
+			if (name) {
+				stackConfigObj.name = name;
+			}
+			if (collapsed !== true) {
+				stackConfigObj.collapsed = collapsed;
+			}
+			if (spreading !== false) {
+				stackConfigObj.spreading = spreading;
+			}
+			stackOptions.push(stackConfigObj);
 		}
+
+		obj.columnStack = {};
+		obj.columnStack.stacks = stackOptions;
 	}
 
 	return obj;
@@ -280,8 +329,12 @@ ColumnStackPlugin.prototype.getConfigObject = function (gridOptions) {
 */
 ColumnStackPlugin.prototype._afterInit = function () {
 	if(this._pendingStacks) {
+		this.removeAllStacks(false);
 		for(var sid in this._pendingStacks) {
 			var stackOpt = this._pendingStacks[sid];
+			if(!stackOpt.colRefs){
+				this._transformStackConfig(stackOpt);
+			}
 			this.stackColumns(stackOpt.colRefs, sid, stackOpt);
 		}
 		this._pendingStacks = null;
@@ -331,6 +384,37 @@ ColumnStackPlugin.prototype._setColumnStackOptions = function(colIndex, stackOpt
 	}
 };
 /** @private
+* @param {object} stackConfig
+* @return {object} stack config object
+*/
+ColumnStackPlugin.prototype._transformStackConfig = function(stackConfig) {
+	stackConfig.colRefs = [];
+	var children = stackConfig.children;
+	var activeColumn = stackConfig.activeColumn;
+	var field;
+	if(children){
+		var childLen = stackConfig.children.length;
+		for(var j = 0; j < childLen; j++){
+			var colIndex = this.getColumnIndex(children[j]);
+			if(colIndex !== -1){
+				field = this._getField(colIndex);
+				stackConfig.colRefs.push(field);
+			}
+		}
+	}
+	if(activeColumn){
+		var activeColIndex = this.getColumnIndex(activeColumn);
+		if(activeColIndex !== -1){
+			field = this._getField(colIndex);
+			if(field){
+				stackConfig.activeColumn;
+			}
+
+		}
+	}
+	return stackConfig;
+};
+/** @private
 * @param {number} colIndex
 * @return {*}
 */
@@ -771,16 +855,16 @@ ColumnStackPlugin.prototype.getStackId = function(colIndex) {
 /** @public
 * @param {Array.<number|string>=} colRefs Names of fields or column indices. If not specified, selected columns will be used.
 * @param {string=} stackId Must be unique
-* @param {Object=} options
-* @param {boolean=} sort Default to true. If enable and colRefs are column indices, column in stack will be sorted
+* @param {ColumnStackPlugin~StackConfiguration=} options
 * @return {boolean} Return true if all of the given columns is stacked together
 */
-ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options, sort) {
+ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options) {
+	var needSorting = true;
+
 	if(!colRefs) {
 		colRefs = this._getSelectedColumns();
 	}
 
-	var needSorting = sort !== null ? sort : true;
 	if(colRefs.length) {
 		if(typeof colRefs[0] === "string") {// Do not sort in the case of field stack
 			needSorting = false;
@@ -811,10 +895,17 @@ ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options, s
 
 	options = options || {};
 
-	var activeIndex = colRefs[0];
+	var activeIndex = options.activeColumn ? this.getColumnIndices(options.activeColumn) : colRefs[0];
+	if (activeIndex.length){
+		activeIndex = activeIndex[0];
+	}
+	if(activeIndex == null || colRefs.indexOf(activeIndex) == -1){
+		activeIndex = colRefs[0];
+	}
 	// Collecting data
 	var stack = {};
 	stack.stackId = sid;
+	stack.name = options.name || "";
 	stack.spreading = options.spreading === true;
 	if(stack.spreading) {
 		activeIndex = colRefs[len - 1];
@@ -827,6 +918,10 @@ ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options, s
 		this._setColumnStackOptions(colIndex, stack);
 		stack.stackRefs[i] = this._getColumnStacking(colIndex);
 
+		if(colIndex == activeIndex){
+			stack.activeColumn = stack.stackRefs[i];
+		}
+
 		// Prevent from flashing in stack mode
 		if(colIndex !== activeIndex && stack.collapsed !== false) {
 			this._setColumnVisibility(colIndex, false);
@@ -839,12 +934,12 @@ ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options, s
 	if(stack.spreading) {
 		stack.activeColumn = stack.stackRefs[stack.stackRefs.length - 1]; // Right most column is the active column
 	} else {
-		stack.activeColumn = stack.stackRefs[0]; // Left most column is the active column
 		var csp = this._getPlugin("ColumnSelectionPlugin");
 		if(csp && csp.isEnabled()) {
 			csp.selectSingleColumn(activeIndex);
 		}
 	}
+
 	this._stacks[sid] = stack;
 
 	var cfp = this._getPlugin("ColumnFilterPlugin");
@@ -861,9 +956,10 @@ ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options, s
 *  When adding columns, Grid will attempt to restore stacking
 *  if there are at least two visible columns that match to the retained fields.
 * @param {Array.<number|string>=} colRefs Field names or column indices
+* @param {number|string=} activeColRef Field names or column index  of active column
 * @return {boolean} If the stack has been updated, return true.
 */
-ColumnStackPlugin.prototype.setStack = function(colRefs) {
+ColumnStackPlugin.prototype.setStack = function(colRefs, activeColRef) {
 	// Keep state
 	var i, colRef, type;
 	var fields = [];
@@ -878,6 +974,9 @@ ColumnStackPlugin.prototype.setStack = function(colRefs) {
 			}
 		}
 	}
+	if(activeColRef && typeof activeColRef === "number") {
+		activeColRef = this._getField(activeColRef);
+	}
 
 	if(fields.length > 1) {
 		if(!this._columnStack) {
@@ -911,29 +1010,19 @@ ColumnStackPlugin.prototype.setStack = function(colRefs) {
 		return this.removeAllStacks();
 	}
 
-	// Check old data stacking
-	var count = 0;
-
-	if(this._stacks[sid]) {
-		var stackRefs = this._stacks[sid].stackRefs;
-		if(stackRefs.length === colRefs.length) {
-			for (i = 0; i < colRefs.length; i++) {
-				var stacking = this._getColumnStacking(colRefs[i]);
-				var oldStacking = stackRefs[i];
-				if(stacking === oldStacking) {
-					count++;
-				}
-			}
-			if(count === colRefs.length) {
-				return false;
+	var activeIndex = colRefs[0]; // For the active index, choose the first element.
+	if(activeColRef){
+		var indices = this.getColumnIndices(activeColRef);
+		if(indices.length){
+			var index = indices[0];
+			if(colRefs.indexOf(index) !== -1){
+				activeIndex = indices[0];
 			}
 		}
 	}
 
 	this.removeAllStacks(false); // Remove the stack without updating the UI (UI will only update when column is stacked)
 
-	var activeIndex = colRefs[0]; // For the active index, choose the first element.
-
 	// Collecting data
 	var stack = {};
 	stack.stackId = sid;
@@ -944,6 +1033,10 @@ ColumnStackPlugin.prototype.setStack = function(colRefs) {
 		stack.stackRefs[i] = this._getColumnStacking(colIndex);
 		this._setColumnStackOptions(colIndex, stack);
 
+		if(colIndex == activeIndex){
+			stack.activeColumn = stack.stackRefs[i];
+		}
+
 		// Prevent from flashing in stack mode
 		if(colIndex !== activeIndex && stack.collapsed !== false) {
 			this._setColumnVisibility(colIndex, false);
@@ -953,7 +1046,7 @@ ColumnStackPlugin.prototype.setStack = function(colRefs) {
 	// Make sure that all columns stay packed together
 	this._moveStackedColumns(stack.stackRefs);
 
-	stack.activeColumn = stack.stackRefs[0]; // The first stacking (the first given columns) is the active column
+	// stack.activeColumn = stack.stackRefs[0]; // The first stacking (the first given columns) is the active column
 	this._stacks[sid] = stack;
 	var cfp = this._getPlugin("ColumnFilterPlugin");
 	if(cfp) {
@@ -1098,8 +1191,6 @@ ColumnStackPlugin.prototype.swapColumn = function(colRef, swappingIndex) {
 		return false; // The given index is already active stacked column
 	}
 
-	colData.stackRefs.splice(swappingIndex, 1);
-	colData.stackRefs.unshift(newActiveColumn); // Move data to front
 	var prevActiveColumnIndex = this._getColumnIndex(colData.activeColumn);
 	var newActiveColumnIndex = this._getColumnIndex(newActiveColumn);
 	colData.activeColumn = newActiveColumn; // Change active column
@@ -1107,8 +1198,6 @@ ColumnStackPlugin.prototype.swapColumn = function(colRef, swappingIndex) {
 	this._setColumnVisibility(newActiveColumnIndex, true);
 	this._setColumnVisibility(prevActiveColumnIndex, false); // Hide current active column
 
-	this._moveColumn(newActiveColumnIndex, prevActiveColumnIndex); // Move UI to front
-
 	var csp = this._getPlugin("ColumnSelectionPlugin");
 	if(csp && csp.isEnabled()) {
 		csp.selectSingleColumn(newActiveColumnIndex);
@@ -1120,6 +1209,7 @@ ColumnStackPlugin.prototype.swapColumn = function(colRef, swappingIndex) {
 
 	colData = this._getColumnStackOptions(prevActiveColumnIndex);
 	this._updateIcon(prevActiveColumnIndex, colData);
+	this._updateIcon(newActiveColumnIndex, colData);
 
 	return true;
 };
@@ -1342,6 +1432,7 @@ ColumnStackPlugin.prototype._onStackButtonClicked = function(e) {
 
 	var stackRefs = colData.stackRefs;
 	var activeIndex = stackRefs.indexOf(colData.activeColumn);
+
 	var len = stackRefs.length;
 	var colIndices = new Array(len);
 	var menuData = new Array(len);
@@ -1601,11 +1692,45 @@ ColumnStackPlugin.prototype.reorderStackColumns = function(colRefs, stackId) {
 		collapsed: stack.collapsed
 	};
 
+	for(i = 0; i < newStackMembers.length; i++){
+		newStackMembers[i] = this._getField(newStackMembers[i]);
+	}
+
 	this.unstackColumns(stackMemberIndices);
-	this.stackColumns(newStackMembers, stackId, options, false);
+	this.stackColumns(newStackMembers, stackId, options);
 
 };
 
+/** @public
+* @description Set stack name to a stack
+* @param {string} stackId
+* @param {string} name
+*/
+ColumnStackPlugin.prototype.setStackName = function(stackId, name) {
+	if(stackId !== null) {
+		var stack = this._stacks[stackId];
+		if(stack){
+			stack.name = name;
+		}
+	}
+};
+
+/** @public
+* @description Get stack name from specific stack
+* @param {string} stackId
+* @return {string} Stack name
+*/
+ColumnStackPlugin.prototype.getStackName = function(stackId) {
+	var stackName  = "";
+	if(stackId !== null) {
+		var stack = this._stacks[stackId];
+		if(stack){
+			stackName = stack.name;
+		}
+	}
+	return stackName;
+};
+
 
 export default ColumnStackPlugin;
 export { ColumnStackPlugin, ColumnStackPlugin as ColumnStack, ColumnStackPlugin as ColumnStackExtension };

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

@@ -26,7 +26,8 @@ declare namespace RowPainter {
         groupLevel?: number|null,
         nonGroupRow?: boolean|null,
         colorTagClass?: string|null,
-        indentSize?: number|null
+        indentSize?: number|null,
+        content: any
     };
 
 }

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

@@ -25,6 +25,7 @@ import { Icon } from "./Icon.js";
 * @property {boolean=} nonGroupRow
 * @property {string=} colorTagClass CSS class for custom coloring
 * @property {number=} indentSize
+* @property {*} content Content to be rendered on the first cell. If null or undefined value is given, no content will be changed.
 */
 
 /**
@@ -335,7 +336,12 @@ RowPainter.prototype.applyHeaderStyle = function(e) {
 		if (this._clickableCell) {
 			cell.listen("click", this._onCellClicked); // WARNING: content row share this same listener with this header cell
 		}
-		if (!this._segmentMode) {
+		if (this._segmentMode) {
+			var content = e.content;
+			if(content != null) {
+				cell.setContent(content);
+			}
+		} else {
 			cell.setContent(e.groupId || "");
 		}
 	}

package/lib/tr-grid-util/es6/jet/mockDataAPI.d.ts

@@ -1,4 +1,5 @@
 import { DataGenerator } from "./DataGenerator.js";
+import { DateTime } from "../DateTime.js";
 
 declare namespace DataGrid {