@refinitiv-ui/efx-grid 6.0.18 → 6.0.20

package/lib/core/es6/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/core/es6/data/DataView.js

@@ -1054,7 +1054,7 @@ DataView.prototype.prevPage = DataView.prototype.previousPage;
 * @fires DataView#dataChanged
 */
 DataView.prototype.lastPage = function () {
-	return this.gotoPage(this._lastPageIndex - 1);
+	return this.gotoPage(this._lastPageIndex);
 };
 /** Goes to the first page
 * @public
@@ -1760,6 +1760,20 @@ DataView.prototype.isCollapsed = function() {
 DataView.prototype.enableContentAsHeader = function(bool) {
 	this._shared.contentAsHeader = bool !== false;
 };
+/** set default collapse when new groups added
+* @public
+* @param {boolean=} collapse=false, if enable it, it will be set collapsing by default
+*/
+DataView.prototype.setDefaultCollapse = function(collapse) {
+	this._shared.defaultCollapse = !!collapse;
+};
+/** get default collapse when new groups added
+* @public
+* @return {boolean}
+*/
+DataView.prototype.getDefaultCollapse = function() {
+	return !!this._shared.defaultCollapse; // it can be null, convert to boolean
+};
 /** @private
 * @return {?Array.<string>}
 */
@@ -3678,6 +3692,10 @@ DataView.prototype._addGroup = function (value) {
 		}
 	}
 	member = new DataView();
+	var collapsed = this._shared.defaultCollapse;
+	if(collapsed != null) {
+		member._collapsed = collapsed;
+	}
 	member._groupId = groupId;
 	if(typeof value == "string") { // TODO: Raw value should not always be a string
 		if(value == "null") {

package/lib/core/es6/data/SegmentCollection.js

@@ -440,26 +440,38 @@ SegmentCollection.prototype.getSegmentValues = function(rids) {
 	var prevSegment = null;
 	var segmentValues = new Array(rowCount);
 	var segmentVal = 0;
+	var highestVal = -10;
 	var offset = 0;
 	for(var r = 0; r < rowCount; ++r) {
 		var rid = rids[r];
 		curSegment = segmentSeparators[rid];
-		if(curSegment) {
+		if(curSegment) { // segment separator
+			if(prevSegment !== curSegment) {
+				prevSegment = curSegment;
+				segmentVal = curSegment.getOrder() * 100;
+				if(segmentVal > highestVal) {
+					highestVal = segmentVal;
+				}
+			}
 			offset = 0;
 		} else {
 			var parentId = childToSegmentId[rid];
-			if(parentId) {
+			if(parentId) { // segment member
 				curSegment = segmentSeparators[parentId];
+				if(prevSegment !== curSegment) {
+					prevSegment = curSegment;
+					segmentVal = curSegment.getOrder() * 100;
+					if(segmentVal > highestVal) {
+						highestVal = segmentVal;
+					}
+				}
 				offset = 1;
-			} else {
-				offset = prevSegment ? 10 : 0;
+			} else { // row outside of segments
+				segmentVal = highestVal;
+				offset = 10;
 			}
 		}
 
-		if(curSegment && prevSegment !== curSegment) {
-			prevSegment = curSegment;
-			segmentVal = curSegment.getOrder() * 100;
-		}
 		segmentValues[r] = segmentVal + offset;
 	}
 

package/lib/core/es6/grid/Core.js

@@ -528,7 +528,7 @@ Core.prototype._rowHeightTimerId = 0;
 * @return {string}
 */
 Core.getVersion = function () {
-	return "5.1.27";
+	return "5.1.31";
 };
 /** {@link ElementWrapper#dispose}
 * @override

package/lib/core/es6/grid/components/Cell.js

@@ -13,8 +13,6 @@ import CellFloatingPanel from "../components/CellFloatingPanel.js";
 * @param {ILayoutGrid=} opt_section Parent section
 */
 var Cell = function (opt_element, opt_section) {
-	this._onFocus = this._onFocus.bind(this);
-
 	this._id = Cell._runningId++;
 	this._element = document.createElement("div");
 	this._element.className = "cell";
@@ -358,7 +356,6 @@ Cell.prototype.initialize = function () {
 			this._aligner = document.createElement("div");
 		} else {
 			this._aligner = document.createElement("button");
-			this._aligner.addEventListener('focus', this._onFocus);
 		}
 		this._aligner.className = "valigner";
 		if(this._frontIcon) {
@@ -724,16 +721,6 @@ Cell.prototype._updateDisplay = function () {
 		this._element.style.display = "none";
 	}
 };
-
-/** @private
-* @param {Event} e
-*/
-Cell.prototype._onFocus = function (e) {
-	if (!this._section) return;
-
-	var core = this._section._getContext();
-	core.getElement().focus({ preventScroll: true });
-};
 //#endregion Private Methods
 
 

package/lib/filter-dialog/lib/checkbox-list.js

@@ -5,59 +5,72 @@ import "@refinitiv-ui/elements/item";
 import "@refinitiv-ui/elements/checkbox";
 import translation from "./locale/translation.js";
 
-/**
+/** @type {number}
 * @private
-* @param {Object=} states
+* @constant
+*/
+const ITEM_LIMIT = 500;
+
+/** @private
+* @function
+* @param {*=} val
 * @return {string}
 */
-const _getStateText = function(states) {
-	if(typeof states === "string") {
-		return states;
-	} else if(states) {
-		return states.title || states.label || "";
+const _toLabelText = function(val) {
+	if(typeof val === "string") {
+		return val;
+	} else if(val) {
+		return val.title || val.label || "";
 	}
 	return "";
 };
-/**
-* @private
-* @param {Element} item
-* @param {Object=} states
+/** @private
+* @function
+* @param {*} val
+* @param {number} idx
+* @return {!Object}
 */
-const _updateItemStates = function(item, states) {
-	item._label.textContent = _getStateText(states);
-	item._checkbox.checked = (states && states.checked) ? true : false;
+const _toItemStates = function(val, idx) {
+	return {
+		label: _toLabelText(val),
+		checked: (val && val.checked) ? true : false,
+		index: idx,
+		elem: null
+	};
 };
-/**
-* @private
-* @param {Array.<Element>} ary Array of Items
-* @param {(string|Function)=} inputFilter
-* @return {!Array} Array containing filtered data objects
+/** @private
+* @function
+* @param {!Object} state
+* @param {*} val
 */
-const _filter = function(ary, inputFilter) {
-	var len = ary ? ary.length : 0;
-	if(!len || !inputFilter) {
-		return ary; // No new copy is generated
+const _assignItemState = function(state, val) {
+	state.label = _toLabelText(val);
+	state.checked = (val && val.checked) ? true : false;
+	if(state.elem) {
+		_updateElement(state.elem, state.label, state.checked);
 	}
-
-	var filterMethod, ctx;
-	if(typeof inputFilter === "function") {
-		filterMethod = inputFilter;
-		ctx = ary;
-	} else {
-		filterMethod = _caseInsensitiveFilter;
-		ctx = (inputFilter + "").toLowerCase(); // Convert to lowercased string for case insensitive comparison
+};
+/** @private
+* @function
+* @param {!Object} state
+* @return {boolean}
+*/
+const _getCheckedState = function(state) {
+	return state.elem ? state.elem._checkbox.checked : state.checked;
+};
+/** @private
+* @function
+* @param {!Element} elem
+* @param {string} txt
+* @param {boolean} checked
+*/
+const _updateElement = function(elem, txt, checked) {
+	if(elem._label.textContent !== txt) {
+		elem._label.textContent = txt;
 	}
-
-	var filteredList = [];
-	for(var i = 0; i < len; ++i) {
-		var elem = ary[i];
-		var str = elem._label.textContent;
-		if(filterMethod(str, i, ctx)) {
-			filteredList.push(elem);
-		}
+	if(elem._checkbox.checked !== checked) {
+		elem._checkbox.checked = checked;
 	}
-
-	return filteredList;
 };
 /** @private
 * @param {string} str
@@ -81,16 +94,19 @@ class CheckboxList extends BasicElement {
 	constructor() {
 		super();
 
-		this.lang = "en";
-		this._translation = translation;
 		this.selectAll = this.selectAll.bind(this);
 		this.deselectAll = this.deselectAll.bind(this);
 		this._onItemClicked = this._onItemClicked.bind(this);
+		this._toItemElement = this._toItemElement.bind(this);
+		this._byLabelText = this._byLabelText.bind(this);
+
+		this.lang = "en";
+		this._translation = translation;
 
 		this._config = {};
+		this._states = []; // Item states before filtering
 		this._cachedItems = []; // To avoid repeatedly creating the same item element
 		this._items = []; // Actual existing elements (filtered items)
-		this._origItems = this._items; // Original items before being filtered
 		this._inputFilter = null;
 	}
 
@@ -152,38 +168,40 @@ class CheckboxList extends BasicElement {
 
 	updated(changedProps) {
 		if (changedProps.has("data")) {
-			var list = this.data;
-			var len = list ? list.length : 0;
-
+			var dataList = this.data;
+			var len = dataList ? dataList.length : 0;
 			if (this._cachedItems.length < len) {
 				this._cachedItems.length = len;
 			}
-			this._items = new Array(len);
-
-			for (var i = 0; i < len; i++) {
-				var item = this._cachedItems[i]; // ef-item
-				if (!item) {
-					item = this._cachedItems[i] = this._templateItemEl.cloneNode(true);
-					item.addEventListener("click", this._onItemClicked);
-
-					var itemContainer = item.firstChild; // div.item-container
-					item._checkbox = itemContainer.firstChild; // ef-checkbox
-					item._label = itemContainer.lastChild; // label
-				}
-				this._items[i] = item;
 
-				_updateItemStates(item, list[i]);
-			}
+			this._states = dataList.map(_toItemStates);
+			this._filterItems();
+			this._renderItems();
+		}
+	}
 
-			if (this._inputFilter) {
-				this._origItems = this._items;
-				this._items = _filter(this._origItems, this._inputFilter);
-			} else {
-				this._origItems = this._items;
+	/** @private
+	* @param {!Object} state
+	* @return {!Element}
+	*/
+	_toItemElement(state) {
+		var elem = state.elem;
+		if(!elem) {
+			var idx = state.index;
+			elem = this._cachedItems[idx];
+			if(!elem) {
+				elem = this._cachedItems[idx] = this._templateItemEl.cloneNode(true);
+				elem.addEventListener("click", this._onItemClicked);
+
+				var itemContainer = elem.firstChild; // div.item-container
+				elem._checkbox = itemContainer.firstChild; // ef-checkbox
+				elem._label = itemContainer.lastChild; // label
 			}
 
-			this._renderItems();
+			_updateElement(elem, state.label, state.checked);
+			state.elem = elem;
 		}
+		return elem;
 	}
 	/**
 	* @private
@@ -198,9 +216,11 @@ class CheckboxList extends BasicElement {
 		while(container.lastChild) {
 			container.removeChild(container.lastChild);
 		}
-		var len = this._items.length;
+
+		var ary = this._items;
+		var len = ary.length;
 		for(var i = 0; i < len; ++i) {
-			container.appendChild(this._items[i]);
+			container.appendChild(ary[i]);
 		}
 		this._updateSelectAllState();
 	}
@@ -228,9 +248,10 @@ class CheckboxList extends BasicElement {
 			return;
 		}
 
-		var len = this._items.length;
+		var states = this._states;
+		var len = states.length;
 		for(var i = 0; i < len; ++i) {
-			_updateItemStates(this._items[i], this.data[i]);
+			_assignItemState(states[i], this.data[i]);
 		}
 
 		this._updateSelectAllState();
@@ -242,11 +263,13 @@ class CheckboxList extends BasicElement {
 	*/
 	getSelectedItems() {
 		var items = [];
-		var len = this._items.length;
+		var states = this._states;
+		var len = states.length;
 		for(var i = 0; i < len; ++i) {
-			if(this._items[i]._checkbox.checked) {
+			var state = states[i];
+			if(_getCheckedState(state)) {
 				items.push({
-					title: this._items[i]._label.textContent,
+					title: state.label,
 					index: i
 				});
 			}
@@ -260,9 +283,10 @@ class CheckboxList extends BasicElement {
 	*/
 	selectAll(selected) {
 		selected = selected !== false;
-		var len = this._items.length;
+		var ary = this._items;
+		var len = ary.length;
 		for(var i = 0; i < len; ++i) {
-			this._items[i]._checkbox.checked = selected;
+			ary[i]._checkbox.checked = selected;
 		}
 		this._updateSelectAllState(selected);
 	}
@@ -288,18 +312,60 @@ class CheckboxList extends BasicElement {
 			dirty = true;
 		}
 		if(dirty) {
-			this._items = _filter(this._origItems, this._inputFilter);
+			this._filterItems();
 			this._renderItems();
 		}
 	}
 
+	/**
+	* @private
+	*/
+	_filterItems() {
+		var states = this._states;
+		var len = states ? states.length : 0;
+		if(!len) {
+			this._items.length = 0;
+			return; // No new copy is generated
+		}
+
+		var inputFilter = this._inputFilter;
+		if(inputFilter) {
+			if(typeof inputFilter === "function") {
+				this._filterMethod = inputFilter;
+				this._filterCtx = states;
+			} else {
+				this._filterMethod = _caseInsensitiveFilter;
+				this._filterCtx = (inputFilter + "").toLowerCase(); // Convert to lowercased string for case insensitive comparison
+			}
+			states = states.filter(this._byLabelText);
+
+			this._filterMethod = null;
+			this._filterCtx = null;
+		}
+
+		if(states.length > ITEM_LIMIT) {
+			states = states.slice(0, ITEM_LIMIT);
+		}
+
+		this._items = states.map(this._toItemElement);
+	}
+	/**
+	* @private
+	* @param {Object} state
+	* @param {number} idx
+	* @return {boolean}
+	*/
+	_byLabelText(state, idx) {
+		return this._filterMethod(state.label, idx, this._filterCtx);
+	}
+
 	/**
 	* @private
 	* @param {Event} e
 	*/
 	_onItemClicked(e) {
-		var itemEl = e.currentTarget;
 		if(e.target.tagName !== "EF-CHECKBOX") { // checkbox may already toggle its state
+			var itemEl = e.currentTarget;
 			itemEl._checkbox.checked = !itemEl._checkbox.checked;
 		}
 		this._updateSelectAllState();
@@ -315,10 +381,11 @@ class CheckboxList extends BasicElement {
 		}
 
 		if(selected == null) {
-			var len = this._items.length;
+			var ary = this._items;
+			var len = ary.length;
 			selected = len ? false : true;
 			for (var i = 0; i < len; i++) {
-				if (this._items[i]._checkbox.checked) {
+				if (ary[i]._checkbox.checked) {
 					selected = true;
 					break;
 				}