@refinitiv-ui/efx-grid 6.0.18 → 6.0.20

package/lib/tr-grid-row-dragging/es6/RowDragging.d.ts

@@ -4,27 +4,28 @@ import { ElfUtil } from "../../tr-grid-util/es6/ElfUtil.js";
 import { GridPlugin } from "../../tr-grid-util/es6/GridPlugin.js";
 import Dom from "../../tr-grid-util/es6/Dom.js";
 import { DragUI } from "../../tr-grid-util/es6/DragUI.js";
+import { injectCss, prettifyCss } from "../../tr-grid-util/es6/Util.js";
 
 declare namespace RowDraggingPlugin {
 
     type Options = {
-        dragBox?: boolean,
-        disabled?: boolean,
-        mouseInput?: boolean,
-        dataTransfer?: boolean,
-        autoScroll?: boolean,
-        dragBoxRenderer?: ((...params: any[]) => any),
-        dragStart?: ((...params: any[]) => any),
-        drag?: ((...params: any[]) => any),
-        dragEnd?: ((...params: any[]) => any),
-        dataMoved?: ((...params: any[]) => any)
+        dragBox?: boolean|null,
+        disabled?: boolean|null,
+        mouseInput?: boolean|null,
+        dataTransfer?: boolean|null,
+        autoScroll?: boolean|null,
+        dragBoxRenderer?: ((...params: any[]) => any)|null,
+        dragStart?: ((...params: any[]) => any)|null,
+        drag?: ((...params: any[]) => any)|null,
+        dragEnd?: ((...params: any[]) => any)|null,
+        dataMoved?: ((...params: any[]) => any)|null
     };
 
 }
 
 declare class RowDraggingPlugin extends GridPlugin {
 
-    constructor(options?: RowDraggingPlugin.Options);
+    constructor(options?: RowDraggingPlugin.Options|null);
 
     public hasMultiTableSupport(): boolean;
 
@@ -38,7 +39,7 @@ declare class RowDraggingPlugin extends GridPlugin {
 
     public getConfigObject(out_obj?: any): any;
 
-    public startDrag(startRef: any, opt_suppressEvent?: boolean): void;
+    public startDrag(startRef: any, opt_suppressEvent?: boolean|null): void;
 
     public stopDrag(): void;
 
@@ -46,11 +47,11 @@ declare class RowDraggingPlugin extends GridPlugin {
 
     public getGuideline(): Element|null;
 
-    public disable(disabled?: boolean): void;
+    public disable(disabled?: boolean|null): void;
 
     public isDisabled(): boolean;
 
-    public disableUIs(disabled?: boolean): void;
+    public disableUIs(disabled?: boolean|null): void;
 
 }
 

package/lib/tr-grid-row-dragging/es6/RowDragging.js

@@ -4,6 +4,7 @@ import { ElfUtil } from "../../tr-grid-util/es6/ElfUtil.js";
 import { GridPlugin } from "../../tr-grid-util/es6/GridPlugin.js";
 import Dom from "../../tr-grid-util/es6/Dom.js";
 import { DragUI } from "../../tr-grid-util/es6/DragUI.js";
+import { injectCss, prettifyCss } from "../../tr-grid-util/es6/Util.js";
 
 /** @typedef {Object} RowDraggingPlugin~Options
 * @description Available options describing `rowDragging` object specified in grid's option
@@ -198,6 +199,14 @@ RowDraggingPlugin.prototype._autoScroll = true;
 */
 RowDraggingPlugin.prototype._dragUI = null;
 
+/** @private Applied theme color in row dragging and dragUI
+* @param {Object} host core grid instance
+*/
+var _applyStyles = function(host) {
+	RowDraggingPlugin._applyThemeColor(host);
+	DragUI.applyThemeColor(host);
+};
+
 /** Prevent built-in config
 * @public
 * @ignore
@@ -252,12 +261,12 @@ RowDraggingPlugin.prototype.initialize = function (host, options) {
 	});
 
 	// Share dragging styles
-	if(DragUI.stylePromise) {
-		DragUI.applyThemeColor(host);
-	} else {
+	if(!DragUI.stylePromise) {
 		DragUI.stylePromise = ElfUtil.getThemeColors();
 		DragUI.stylePromise.then(this._onThemeLoaded).catch(this._onThemeLoaded);
 	}
+	// TODO: Create a manager to manage styles. Currently, we have to use setTimeout to wait for an element to be created before applying styles
+	setTimeout(_applyStyles.bind(this, host), 0);
 
 	// In case of lazy loading
 	// host.getAllSections("content").forEach(this._registerSection);
@@ -284,10 +293,34 @@ RowDraggingPlugin.prototype.unload = function (host) {
 /** @private
 */
 RowDraggingPlugin.prototype._onThemeLoaded = function() {
+	if(!RowDraggingPlugin._styles) {
+		var styles = [
+			":host .row-dragging .cover-layer .selection-bound", [
+				"border: var(--grid-drag-indicator)"
+			],
+			":host .row-dragging .tr-lg .cell.selected-row", [
+				"background-color: unset;"
+			]
+		];
+		RowDraggingPlugin._styles = prettifyCss(styles);
+	}
+
 	var colors = ElfUtil.getColors();
 	this._dragUI.onThemeLoaded(colors); // TODO : onThemeLoaded should be static function like DragUI.applyThemeColor
 	for(var i = this._hosts.length; --i >= 0;) {
-		DragUI.applyThemeColor(this._hosts[i]);
+		_applyStyles(this._hosts[i]);
+	}
+};
+/** @private
+* @param {Object} grid core grid instance
+*/
+RowDraggingPlugin._applyThemeColor = function(grid) {
+	if(!grid || grid._rowDraggingStyles) {
+		return;
+	}
+	if(RowDraggingPlugin._styles) {
+		grid._rowDraggingStyles = true; // Prevent loading the same style twice
+		injectCss(RowDraggingPlugin._styles, grid.getParent());
 	}
 };
 
@@ -528,7 +561,9 @@ RowDraggingPlugin.prototype._onDragStart = function (e) {
 		// TODO: Just update curser will not gonna work since cell is pointer-events: none;
 		// we should do something to overwrite pointer-events first
 		// then set cursor move will have an effect
-		grid.getElement().classList.add("mouse-dragging");
+		var gridElem = grid.getElement();
+		gridElem.classList.add("mouse-dragging");
+		gridElem.classList.add("row-dragging");
 
 		this._updateGuidePosition();
 
@@ -609,7 +644,10 @@ RowDraggingPlugin.prototype._onDragEnd = function (e) {
 	}
 
 	var srcGrid = this._startingGrid || this._hosts[0];
-	srcGrid.getElement().classList.remove("mouse-dragging");
+
+	var srcGridElem = srcGrid.getElement();
+	srcGridElem.classList.remove("mouse-dragging");
+	srcGridElem.classList.remove("row-dragging");
 
 	var destPos = this._pos; // This can be null
 	if(!this._isDragCancelled()) {

package/lib/tr-grid-row-grouping/es6/RowGrouping.d.ts

@@ -29,6 +29,7 @@ declare namespace RowGroupingPlugin {
         colorTag?: boolean|null,
         predefinedColors?: any,
         groupColors?: any,
+        defaultCollapse?: boolean|null,
         clicked?: ((...params: any[]) => any)|null,
         groupAdded?: ((...params: any[]) => any)|null,
         beforeGroupAdded?: ((...params: any[]) => any)|null,
@@ -84,6 +85,10 @@ declare class RowGroupingPlugin extends GridPlugin {
 
     public setPredefinedColors(predefinedColors: any): void;
 
+    public setDefaultCollapse(collapse: boolean): void;
+
+    public getDefaultCollapse(): boolean;
+
     public sortGroups(): void;
 
     public updateHeaders(): void;

package/lib/tr-grid-row-grouping/es6/RowGrouping.js

@@ -26,6 +26,7 @@ import { injectCss, prettifyCss } from "../../tr-grid-util/es6/Util.js";
 * @property {boolean=} colorTag If not specified, the color tag will be disabled when using extension without halo theme.
 * @property {Object=} predefinedColors Predefined color object map for color tag
 * @property {Object=} groupColors The object map of group ID and predefined color.
+* @property {boolean=} defaultCollapse=false Collapsing groups by default when a group is created
 * @property {Function=} clicked=null Event handler when user clicks on arrows or cells
 * @property {Function=} groupAdded=null Event handler
 * @property {Function=} beforeGroupAdded=null Event handler
@@ -474,6 +475,9 @@ RowGroupingPlugin.prototype.config = function (options) {
 		if (option.autoGroupSorting != null) {
 			this._autoGroupSorting = !!option.autoGroupSorting;
 		}
+		if (option.defaultCollapse != null) {
+			this.setDefaultCollapse(option.defaultCollapse);
+		}
 		if (option.predefinedGroups != null) {
 			this.setPredefinedGroups(option.predefinedGroups);
 		}
@@ -665,6 +669,11 @@ RowGroupingPlugin.prototype.getConfigObject = function (gridOptions) {
 		extOptions.predefinedColors = this._predefinedColors;
 	}
 
+	var defaultCollapse = this.getDefaultCollapse();
+	if(defaultCollapse != null) {
+		extOptions.defaultCollapse = defaultCollapse;
+	}
+
 	return obj;
 };
 
@@ -994,6 +1003,27 @@ RowGroupingPlugin.prototype.setPredefinedColors = function(predefinedColors) {
 	}
 };
 
+/** @public
+* @param {boolean} collapse Predefined color object map
+*/
+RowGroupingPlugin.prototype.setDefaultCollapse = function(collapse) {
+	var dv = this.getDataView();
+	if (dv) {
+		dv.setDefaultCollapse(collapse);
+	}
+};
+
+/** @public
+* @return {boolean}
+*/
+RowGroupingPlugin.prototype.getDefaultCollapse = function() {
+	var dv = this.getDataView();
+	if (dv) {
+		return dv.getDefaultCollapse();
+	}
+	return false; // if dv did't load, the value will be false by default
+};
+
 /** Trigger group sorting logic -- re-sort the existing groups. This will not continuously apply to each data update.
 * @public
 */

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

@@ -607,7 +607,11 @@ Popup.prototype.updatePosition = function () {
 		if (t._autoClipping) {
 			t._restoreElementSize();
 		}
-		var pos = Dom.getRelativePosition(t._attachedElem, document.body);
+		var refElement = document.body;
+		if (t._positioning === "over") {
+			refElement = document.documentElement;
+		}
+		var pos = Dom.getRelativePosition(t._attachedElem, refElement);
 		var px = pos["x"];
 		var py = pos["y"];
 

package/lib/types/es6/Core/data/DataView.d.ts

@@ -188,6 +188,10 @@ declare class DataView extends EventDispatcher {
 
     public enableContentAsHeader(bool?: boolean|null): void;
 
+    public setDefaultCollapse(collapse?: boolean|null): void;
+
+    public getDefaultCollapse(): boolean;
+
     public getVisibleRowCount(): number;
 
     public isRowDataInGroup(rowData: any, groupID?: string|null): boolean;

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

@@ -17,6 +17,7 @@ declare namespace FilterInputPlugin {
         placeholder?: string,
         type?: string,
         entries?: any[],
+        defaultValue?: any,
         trigger?: string
     };
 

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

@@ -1,5 +1,6 @@
 import { Ext } from "../../tr-grid-util/es6/Ext.js";
 import { GridPlugin } from "../../tr-grid-util/es6/GridPlugin.js";
+import { ElfUtil } from "../../tr-grid-util/es6/ElfUtil.js";
 
 declare namespace PaginationPlugin {
 

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

@@ -195,7 +195,7 @@ declare class Grid extends EventDispatcher {
 
     public hasHiddenRow(): boolean;
 
-    public setRic(rowRef: Grid.RowReference|null, str: string): void;
+    public setRic(rowRef: Grid.RowReference|null, str: string, options?: RowDefinition.Options|null): void;
 
     public unlinkChain(rowRef: Grid.RowReference|null): void;
 

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

@@ -4,27 +4,28 @@ import { ElfUtil } from "../../tr-grid-util/es6/ElfUtil.js";
 import { GridPlugin } from "../../tr-grid-util/es6/GridPlugin.js";
 import Dom from "../../tr-grid-util/es6/Dom.js";
 import { DragUI } from "../../tr-grid-util/es6/DragUI.js";
+import { injectCss, prettifyCss } from "../../tr-grid-util/es6/Util.js";
 
 declare namespace RowDraggingPlugin {
 
     type Options = {
-        dragBox?: boolean,
-        disabled?: boolean,
-        mouseInput?: boolean,
-        dataTransfer?: boolean,
-        autoScroll?: boolean,
-        dragBoxRenderer?: ((...params: any[]) => any),
-        dragStart?: ((...params: any[]) => any),
-        drag?: ((...params: any[]) => any),
-        dragEnd?: ((...params: any[]) => any),
-        dataMoved?: ((...params: any[]) => any)
+        dragBox?: boolean|null,
+        disabled?: boolean|null,
+        mouseInput?: boolean|null,
+        dataTransfer?: boolean|null,
+        autoScroll?: boolean|null,
+        dragBoxRenderer?: ((...params: any[]) => any)|null,
+        dragStart?: ((...params: any[]) => any)|null,
+        drag?: ((...params: any[]) => any)|null,
+        dragEnd?: ((...params: any[]) => any)|null,
+        dataMoved?: ((...params: any[]) => any)|null
     };
 
 }
 
 declare class RowDraggingPlugin extends GridPlugin {
 
-    constructor(options?: RowDraggingPlugin.Options);
+    constructor(options?: RowDraggingPlugin.Options|null);
 
     public hasMultiTableSupport(): boolean;
 
@@ -38,7 +39,7 @@ declare class RowDraggingPlugin extends GridPlugin {
 
     public getConfigObject(out_obj?: any): any;
 
-    public startDrag(startRef: any, opt_suppressEvent?: boolean): void;
+    public startDrag(startRef: any, opt_suppressEvent?: boolean|null): void;
 
     public stopDrag(): void;
 
@@ -46,11 +47,11 @@ declare class RowDraggingPlugin extends GridPlugin {
 
     public getGuideline(): Element|null;
 
-    public disable(disabled?: boolean): void;
+    public disable(disabled?: boolean|null): void;
 
     public isDisabled(): boolean;
 
-    public disableUIs(disabled?: boolean): void;
+    public disableUIs(disabled?: boolean|null): void;
 
 }
 

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

@@ -29,6 +29,7 @@ declare namespace RowGroupingPlugin {
         colorTag?: boolean|null,
         predefinedColors?: any,
         groupColors?: any,
+        defaultCollapse?: boolean|null,
         clicked?: ((...params: any[]) => any)|null,
         groupAdded?: ((...params: any[]) => any)|null,
         beforeGroupAdded?: ((...params: any[]) => any)|null,
@@ -84,6 +85,10 @@ declare class RowGroupingPlugin extends GridPlugin {
 
     public setPredefinedColors(predefinedColors: any): void;
 
+    public setDefaultCollapse(collapse: boolean): void;
+
+    public getDefaultCollapse(): boolean;
+
     public sortGroups(): void;
 
     public updateHeaders(): void;

package/lib/versions.json

@@ -1,37 +1,37 @@
 {
-	"tr-grid-util": "1.3.81",
+	"tr-grid-util": "1.3.82",
 	"@grid/column-dragging": "1.0.10",
-	"@grid/row-segmenting": "1.0.21",
+	"@grid/row-segmenting": "1.0.22",
 	"@grid/statistics-row": "1.0.13",
 	"@grid/zoom": "1.0.11",
 	"tr-grid-auto-tooltip": "1.1.5",
 	"tr-grid-cell-selection": "1.0.32",
-	"tr-grid-checkbox": "1.0.59",
+	"tr-grid-checkbox": "1.0.60",
 	"tr-grid-column-fitter": "1.0.39",
 	"tr-grid-column-formatting": "0.9.34",
-	"tr-grid-column-grouping": "1.0.33",
+	"tr-grid-column-grouping": "1.0.35",
 	"tr-grid-column-resizing": "1.0.26",
 	"tr-grid-column-selection": "1.0.25",
 	"tr-grid-column-stack": "1.0.48",
 	"tr-grid-conditional-coloring": "1.0.57",
 	"tr-grid-content-wrap": "1.0.19",
 	"tr-grid-contextmenu": "1.0.38",
-	"tr-grid-filter-input": "0.9.29",
+	"tr-grid-filter-input": "0.9.31",
 	"tr-grid-heat-map": "1.0.28",
 	"tr-grid-in-cell-editing": "1.0.73",
-	"tr-grid-pagination": "1.0.23",
+	"tr-grid-pagination": "1.0.24",
 	"tr-grid-percent-bar": "1.0.22",
 	"tr-grid-printer": "1.0.16",
 	"tr-grid-range-bar": "1.0.9",
-	"tr-grid-row-dragging": "1.0.23",
+	"tr-grid-row-dragging": "1.0.24",
 	"tr-grid-row-filtering": "1.0.55",
-	"tr-grid-row-grouping": "1.0.79",
+	"tr-grid-row-grouping": "1.0.80",
 	"tr-grid-row-selection": "1.0.21",
 	"tr-grid-rowcoloring": "1.0.21",
 	"tr-grid-textformatting": "1.0.44",
 	"tr-grid-titlewrap": "1.0.19",
 	"@grid/formatters": "1.0.49",
-	"@grid/column-selection-dialog": "4.0.45",
-	"@grid/filter-dialog": "4.0.54",
+	"@grid/column-selection-dialog": "4.0.46",
+	"@grid/filter-dialog": "4.0.56",
 	"@grid/column-format-dialog": "4.0.43"
 }

package/package.json

@@ -58,5 +58,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"version": "6.0.18"
+	"version": "6.0.20"
 }