@refinitiv-ui/efx-grid 6.0.1 → 6.0.2

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

@@ -0,0 +1,1319 @@
+import Ext from "../../../tr-grid-util/es6/Ext.js";
+import EventDispatcher from "../grid/event/EventDispatcher.js";
+import DataView from "./DataView.js"; // eslint-disable-line
+import DataTable from "./DataTable.js"; // eslint-disable-line
+import ColumnStats from "./ColumnStats.js"; // eslint-disable-line
+
+/** @event WrappedView#dataChanged
+* @description Trigger when data within the data view has been changed. Not only actual change in data, but also position change will trigger this event.
+* @property {boolean} globalChange Indicates a big change. User should expect all data has been change. With active sorting or filtering, this flag will always be true due to multiple changes in row position.
+* @property {string} type Type of changes. Possible values are "inserted", "removed", "updated", and undefined
+* @property {string} rid Row Id
+* @property {Object.<string, *>} rowData Column values of the changed row in JSON object format
+*/
+
+/** WrappedView doesn't hold the actual data. It is just a transform view (by applying wrap operation) of the data from the {@link DataView}
+* @constructor
+* @extends {EventDispatcher}
+* @param {WrappedView~Options} options
+*/
+var WrappedView = function(options) {
+	this._onDataChanged = this._onDataChanged.bind(this);
+	this._onWrapSizeChanged = this._onWrapSizeChanged.bind(this);
+
+	this._dv = options["dataView"];
+	this._dt = this._dv.getDataTable();
+
+	this._dv.listen("dataChanged", this._onDataChanged);
+	this._dv.listen("wrapSizeChanged", this._onWrapSizeChanged);
+
+	this._wrapIndex = options["wrapIndex"];
+
+	this._refreshRids(options["rids"]);
+
+	this._addEvents("dataChanged");
+};
+Ext.inherits(WrappedView, EventDispatcher);
+
+/** The configuration object for WrappedView
+* @typedef {Object} WrappedView~Options
+* @property {DataView} dataView
+* @property {number} wrapIndex
+* @property {Array.<string> rids
+*/
+WrappedView.Options;
+
+/** @private
+* @type {DataView}
+*/
+WrappedView.prototype._dv = null;
+/** @private
+* @type {DataTable}
+*/
+WrappedView.prototype._dt = null;
+/** @private
+* @type {number}
+*/
+WrappedView.prototype._wrapIndex = 0;
+/** List of row Ids
+* @private
+* @type {!Array.<string>}
+*/
+WrappedView.prototype._rids;
+/** @private
+* @type {Conflator}
+*/
+WrappedView.prototype._dataConflator = null;
+
+
+/** @private
+* @param {Object} e
+*/
+WrappedView.prototype._onDataChanged = function(e) {
+	if(this._dv) {
+		var rids = this._dv.getVisibleRowIds(true);
+		if(this._refreshRids(rids)) {
+			if(!e["globalChange"]) {
+				e["globalChange"] = true; // TODO: Optimize how we to dispatch globalChange
+			}
+			this._dispatch("dataChanged", e);
+		}
+	}
+};
+/** @private
+* @param {Object} e
+*/
+WrappedView.prototype._onWrapSizeChanged = function(e) {
+	if(this._refreshRids(e["rids"])) {
+		this._dispatch("dataChanged", DataTable._globalChangeArg);
+	}
+};
+
+/** @private
+* @param {Array.<string>} rids
+* @return {boolean} Returns true if there is any change
+*/
+WrappedView.prototype._refreshRids = function(rids) {
+	var dirty = false;
+	if(this._dv && Array.isArray(rids)) {
+		var wrapSize = this.getWrapSize();
+		if(wrapSize > 0) {
+			var startIndex = wrapSize * this._wrapIndex;
+
+			if(startIndex < rids.length) {
+				dirty = true;
+				this._rids = rids.slice(startIndex, startIndex + wrapSize);
+			} else if(this._rids.length) {
+				dirty = true;
+				this._rids.length = 0;
+			}
+		}
+	}
+	return dirty;
+};
+/** @public
+*/
+WrappedView.prototype.dispose = function() {
+	if(this._dv) {
+		this.unlistenAll();
+		this._dv.unlisten("dataChanged", this._onDataChanged);
+		this._dv.unlisten("wrapSizeChanged", this._onWrapSizeChanged);
+		this._dt = this._dv = null;
+	}
+};
+
+/** Get data by row id and column id (field)
+* @public
+* @param {string} rid
+* @param {string} cid
+* @returns {Object.<string, *>}
+*/
+WrappedView.prototype.getData = function(rid, cid) {
+	return this._dt.getData(rid, cid);
+};
+/** Get entire row data by row id
+* @public
+* @param {string} rid
+* @return {Object.<string, *>}
+*/
+WrappedView.prototype.getRowData = function(rid) {
+	return this._dt.getRowData(rid);
+};
+/** @public
+* @param {string} cid
+* @param {boolean=} inclNonDataRow=false If enabled, group header rows are included
+* @return {!Array}
+*/
+WrappedView.prototype.getColumnData = function(cid, inclNonDataRow) {
+	var rids = this.getAllRowIds(true, inclNonDataRow);
+
+	var rows = [];
+	var len = rids.length;
+	for(var r = 0; r < len; ++r) {
+		var rowData = this._dt.getRowData(rids[r]);
+		if(rowData) {
+			rows.push(rowData[cid]);
+		} else if(inclNonDataRow) {
+			rows.push(null);
+		}
+	}
+	return rows;
+};
+/** @public
+* @param {number} rowIndex
+* @return {string}
+* @see {@link WrappedView#getRowIndex}
+*/
+WrappedView.prototype.getRowId = function(rowIndex) {
+	return this._rids[rowIndex] || "";
+};
+/** @private
+* @param {number|string} rowRef
+* @return {string}
+*/
+WrappedView.prototype._toRowId = function(rowRef) {
+	if(typeof rowRef === "number") {
+		return this._rids[rowRef] || "";
+	}
+	return /** @type{string} */(rowRef || "");
+};
+/** @private
+* @param {Array.<number|string>} rowRefs
+* @return {!Array.<string>}
+*/
+WrappedView.prototype._toRowIds = function(rowRefs) {
+	var rowCount = Array.isArray(rowRefs) ? rowRefs.length : 0;
+	var ary = new Array(rowCount);
+	var rids = this._rids;
+	for(var r = 0; r < rowCount; ++r) {
+		var rowRef = rowRefs[r];
+		if(typeof rowRef === "number") {
+			ary[r] = rids[rowRef] || "";
+		} else {
+			ary[r] = rowRef || "";
+		}
+	}
+	return ary;
+};
+/** Return all row ids with row data, excluding the group header rows (auto generated rows).
+* @public
+* @param {boolean=} shallowCopy=false If enabled, no new copy of Array is created (better for performance).
+* @param {boolean=} inclNonDataRow=false If enabled, group header rows are included. In pagination mode, this flag will always be true.
+* @return {!Array.<string>}
+* @see {@link WrappedView#getAllRowData}
+* @see {@link WrappedView#getMultipleRowData}
+* @see {@link WrappedView#getSortedRowIds}
+* @see {@link WrappedView#getVisibleRowIds}
+*/
+WrappedView.prototype.getAllRowIds = function(shallowCopy, inclNonDataRow) {
+	return (shallowCopy) ? this._rids : this._rids.slice(0); // Fastest way to clone an array is Array.slice()
+};
+/** This method returns current visible rows (i.e. Rows in other pages or in collapsed groups are excluded). Group header rows may be included in the results.
+* @public
+* @param {boolean=} shallowCopy=false If enabled, no new copy of Array is created (better for performance).
+* @return {!Array.<string>}
+* @see {@link WrappedView#getAllRowData}
+*/
+WrappedView.prototype.getVisibleRowIds = function(shallowCopy) {
+	return (shallowCopy) ? this._rids : this._rids.slice(0); // Fastest way to clone an array is Array.slice()
+};
+/** Return all data rows that is filtered and sorted, excluding header rows or paging. This method ignores pagination.
+* @public
+* @param {boolean=} shallowCopy=false If enabled, no new copy of Array is created (better for performance).
+* @return {!Array.<string>}
+* @see {@link WrappedView#getAllRowData}
+*/
+WrappedView.prototype.getSortedRowIds = function(shallowCopy) {
+	return (shallowCopy) ? this._rids : this._rids.slice(0); // Fastest way to clone an array is Array.slice()
+};
+/** This method is quite slow
+* @public
+* @param {string} rid
+* @return {number}
+* @see {@link WrappedView#getRowId}
+*/
+WrappedView.prototype.getRowIndex = function(rid) {
+	return this._rids.indexOf(rid);
+};
+/** @public
+* @return {number}
+*/
+WrappedView.prototype.getRowCount = function() {
+	return this._rids.length;
+};
+/** @public
+* @param {number} rowIndex
+* @param {string} cid
+* @returns {Object.<string, *>}
+*/
+WrappedView.prototype.getDataAt = function(rowIndex, cid) {
+	return this._dt.getData(this.getRowId(rowIndex), cid);
+};
+/** This method is slow. When working with huge amount of rows, use getRowData in combination with getAllRowIds(true) instead of calling getRowDataAt multiple times.
+* @public
+* @param {number} rowIndex
+* @return {Object.<string, *>}
+*/
+WrappedView.prototype.getRowDataAt = function(rowIndex) {
+	return this._dt.getRowData(this.getRowId(rowIndex));
+};
+/** @public
+* @param {string} rid
+* @param {string} cid
+* @returns {Object.<string, *>}
+*/
+WrappedView.prototype.getPreviousData = function(rid, cid) {
+	return this._dt.getPreviousData(rid, cid);
+};
+/** @public
+* @param {Array.<string>} rids
+* @param {number=} opt_from
+* @param {number=} opt_to EXCLUSIVE
+* @return {!Array.<Object>}
+*/
+WrappedView.prototype.getMultipleRowData = function(rids, opt_from, opt_to) {
+	return this._dt.getMultipleRowData(rids, opt_from, opt_to);
+};
+/** Return all rows with row data, excluding the group header rows (auto generated rows)
+* @public
+* @return {!Array.<Object>}
+*/
+WrappedView.prototype.getAllRowData = function() {
+	return this.getMultipleRowData(this.getAllRowIds(true));
+};
+
+/** @public
+* @param {string} rid
+* @param {string} cid
+* @param {*} value
+* @return {boolean} Return true if there is any change, and false otherwise
+*/
+WrappedView.prototype.setData = function(rid, cid, value) {
+	if(this._dt) {
+		return this._dt.setData(rid, cid, value);
+	}
+	return false;
+};
+/** @public
+* @param {string} rid
+* @param {Object.<string, *>=} values
+* @param {Object=} opt_eventArg
+* @return {boolean} Return true if there is any change, and false otherwise
+*/
+WrappedView.prototype.setRowData = function(rid, values, opt_eventArg) {
+	return this._dv.setRowData(rid, values, opt_eventArg);
+};
+/** Set data in a column manner. This is faster than repeatedly calling {@link DataTable#setData}
+* @public
+* @param {string} cid
+* @param {Array} valueList
+* @param {Array.<string>=} opt_ridList Specify row id to be set corresponding to the data item
+*/
+WrappedView.prototype.setColumnData = function(cid, valueList, opt_ridList) {
+	//  Note: This function should filter out row expansion before calling dt.setColumnData
+	if(this._dt) {
+		this._dt.setColumnData(cid, valueList, opt_ridList);
+	}
+};
+/** This method is slow. When working with huge amount of rows, use setData in combination with getAllRowIds(true) instead of calling setDataAt multiple times.
+* @public
+* @param {number} rowIndex
+* @param {string} cid
+* @param {*} value
+* @return {boolean} Return true if there is any change, and false otherwise
+*/
+WrappedView.prototype.setDataAt = function(rowIndex, cid, value) {
+	var rid = this.getRowId(rowIndex);
+	if(rid && this._dt) {
+		return this._dt.setData(rid, cid, value);
+	}
+	return false;
+};
+/** This method is slow. When working with huge amount of rows, use setRowData in combination with getAllRowIds(true) instead of calling setRowDataAt multiple times.
+* @public
+* @param {number} rowIndex
+* @param {Object.<string, *>=} values
+* @param {Object=} opt_eventArg
+* @return {boolean} Return true if there is any change, and false otherwise
+*/
+WrappedView.prototype.setRowDataAt = function(rowIndex, values, opt_eventArg) {
+	var rid = this.getRowId(rowIndex);
+	return this.setRowData(rid, values, opt_eventArg);
+};
+
+/** @public
+* @param {string|number} rowRef The position of the new row
+* @param {Object.<string, *>=} opt_values
+* @param {string|null=} opt_rid If the given row Id already exists, data is updated and no new row is added. Leave blank or null to let DataTable generate unique row Id
+* @return {string} Return Row id that has been inserted or changed
+*/
+WrappedView.prototype.insertRow = function(rowRef, opt_values, opt_rid) { // Data changed event may be dispatched
+	var rowId = this._toRowId(rowRef);
+	return this._dv.insertRow(rowId, opt_values, opt_rid);
+};
+
+/** Permanently remove the specified row by row id or WrappedView's row index. If you want to temporarily remove the row, use {@link WrappedView#hideRows} instead
+* @public
+* @param {number|string} rowRef
+*/
+WrappedView.prototype.removeRow = function(rowRef) {
+	if(this._dt) {
+		this._dt.removeRow(this._toRowId(rowRef)); // Trigger dataChanged
+	}
+};
+/** Permanently remove the specified rows by row id or WrappedView's row index. If you want to temporarily remove the rows, use {@link WrappedView#hideRows} instead
+* @public
+* @param {Array.<number|string>} rowRefs
+*/
+WrappedView.prototype.removeRows = function(rowRefs) {
+	if(this._dt) {
+		this._dt.removeRows(this._toRowIds(rowRefs)); // Trigger dataChanged
+	}
+};
+/** Move a single row or multiple rows to the position BEFORE the specified target row.
+* @public
+* @param {Array.<number|string>|number|string} fromRef The value could be row index, row id, or array of row indices or row ids.
+* @param {number|string} toRef Destination target could be row index or row id
+* @return {Array.<string>|string} rid rowId or array of the rowId of the moved row(s)
+* @example
+* ary = [0, 1, 2];
+* move(ary, 0, 1); // [0, 1, 2] Move index 0 to the position before index 1 (nothing is changed)
+* move(ary, 1, 0); // [1, 0, 2] Move index 1 to the position before index 0
+*/
+WrappedView.prototype.moveRow = function(fromRef, toRef) {
+	var toRid = this._toRowId(toRef);
+	var fromIndices = /** @type{!Array.<number>} */(Array.isArray(fromRef) ? fromRef : [fromRef]);
+	var fromRids = this._toRowIds(fromIndices);
+
+	// if(this._dt.hasSegmentation()) {
+	// this.synchronizeRowOrder();
+	// }
+
+	return this._dv.moveRow(fromRids, toRid);
+};
+
+/** Returns the root data source (DataTable) of all data views
+* @public
+* @return {DataTable}
+* @see {@link WrappedView#getDataSource}
+*/
+WrappedView.prototype.getDataTable = function() {
+	return this._dt;
+};
+/** Return source for this data view which could be another data view or a data table.
+* @public
+* @return {DataView}
+* @see {@link WrappedView#getDataTable}
+*/
+WrappedView.prototype.getDataSource = function() {
+	return this._dv;
+};
+/** @public
+* @param {DataView=} source
+*/
+WrappedView.prototype.setDataSource = function(source) {
+
+};
+
+/** @public
+* @param {number} milliSecond
+*/
+WrappedView.prototype.setConflationRate = function (milliSecond) {
+	this._dv.setConflationRate(milliSecond);
+};
+
+/** @public
+* @return {number}
+*/
+WrappedView.prototype.getConflationRate = function () {
+	return this._dv.getConflationRate();
+};
+
+/**
+* @public
+* @ignore
+* @return {Object.<string, DataTable.SortLogic>}
+*/
+WrappedView.prototype.getSortingLogics = function() {
+	return this._dt ? this._dt.getSortingLogics() : null;
+};
+/** @public
+* @param {string|Array.<string>} cid
+* @param {string|number|Array.<string|number>=} opt_sortOrder
+* @param {Function|Array.<Function>=} sortLogics
+* @param {boolean=} noOptimization=false Force to sort without optimization to refresh all rowIds again.
+*/
+WrappedView.prototype.sort = function (cid, opt_sortOrder, sortLogics, noOptimization) {
+	this._dv.sort(cid, opt_sortOrder, sortLogics, noOptimization);
+};
+/** @public
+* @param {string|Array.<string>} cid
+* @param {string|number|Array.<string|number>=} opt_sortOrder
+*/
+WrappedView.prototype.sortOnce = function(cid, opt_sortOrder) {
+	this._dv.sortOnce(cid, opt_sortOrder);
+};
+/** @public
+* @param {DataTable.SortLogic} func
+* @example
+* customLogic = function(a, b, sortOrder) {
+*   return (a - b) * sortOrder; // for numeric comparison
+* };
+* var dt = new DataTable();
+* var dv = new DataView(dt);
+* dv.setSortingLogic(customLogic);
+* dv.sort("Column id", "ascending");
+*/
+WrappedView.prototype.setSortingLogic = function(func) {
+	if(this._dt) {
+		this._dt.setSortingLogic(func);
+	}
+};
+/** Specified sorting logic for the column with the given column id. This will override logic set by {@link WrappedView#setSortingLogic}, when the column is sorted
+* @public
+* @param {string} cid
+* @param {DataTable.SortLogic} func Use null to remove current sorting logic
+*/
+WrappedView.prototype.setColumnSortingLogic = function(cid, func) {
+	if(this._dt) {
+		this._dt.setColumnSortingLogic(cid, func);
+	}
+};
+/** Check if this view is in sorting mode
+* @public
+* @return {boolean}
+*/
+WrappedView.prototype.isSorting = function() {
+	return this._dv.isSorting();
+};
+
+/** Hide rows in the data view
+ * @param {string|number} rId Row id to hide. If the rId is a number, it will be treated as a row index
+ * @param {boolean=} opt_show show if false
+ * @public
+ */
+WrappedView.prototype.hideRow = function(rId, opt_show) {
+	this.showRows([rId], opt_show === false);
+};
+/** Hide rows in the data view
+ * @param {Array.<string|number>} rowRefs Array of row ids or indices to hide
+ * @param {boolean=} opt_show show if false
+ * @public
+ */
+WrappedView.prototype.hideRows = function(rowRefs, opt_show) {
+	this.showRows(rowRefs, opt_show === false);
+};
+/**
+ * Show/hide rows in the data view
+ * @param {Array.<string|number>} rowRefs Array of row ids or indices to hide
+ * @param {boolean=} opt_show hide instead show if false
+ * @public
+ */
+WrappedView.prototype.showRows = function(rowRefs, opt_show) {
+	var rids = this._toRowIds(rowRefs);
+	this._dv.showRows(rids, opt_show);
+};
+/** Unhide all rows
+* @public
+*/
+WrappedView.prototype.unhideAllRows = function(){
+	this._dv.unhideAllRows();
+};
+/** Check if there is any hidden row
+* @public
+* @return {boolean}
+*/
+WrappedView.prototype.hasHiddenRow = function(){
+	return this._dv.hasHiddenRow();
+};
+
+/** @public
+* @param {string|function(string, Object.<string, *>):boolean} cid Use string to identify column name. Use function for custom filter logic. Function will take rowId and column values as parameters, and return boolean value
+* @param {*=} value
+* @param {boolean=} opt_filteringOut
+* @return {boolean} Return true if there is any change. Otherwise, return false.
+* @example
+* dv.filterIn("FIELD", "Some value");
+* dv.filterIn(function(rowId, rowData)) { // This is equivalent with the above statement
+*     return rowData["FIELD"] === "Some value";
+* });
+*/
+WrappedView.prototype.filterIn = function(cid, value, opt_filteringOut) {
+	return this._dv.filterIn(cid, value, opt_filteringOut);
+};
+/** @public
+* @param {string|function(string, Object.<string, *>):boolean} cid Use string to identify column name. Use function for custom filter logic. Function will take rowId and column values as parameters, and return boolean value
+* @param {*=} value
+* @return {boolean} Return true if there is any change. Otherwise, return false.
+* @example
+* dv.filterIn("FIELD", "Some value");
+* dv.filterOut(function(rowId, rowData)) { // This is equivalent with the above statement
+*     return rowData["FIELD"] !== "Some value";
+* });
+*/
+WrappedView.prototype.filterOut = function(cid, value) {
+	return this.filterIn(cid, value, true);
+};
+/** @public
+* @param {string|Function} cid Use string to identify column name. Use function for custom filter logic. Function will take rowId and column values as parameters, and return boolean value
+* @param {*=} value
+* @param {boolean=} opt_filteringOut
+*/
+WrappedView.prototype.filterInOnce = function(cid, value, opt_filteringOut) {
+	this._dv.filterInOnce(cid, value, opt_filteringOut);
+};
+/** @public
+* @suppress {checkTypes}
+* @param {string|function(string, Object.<string, *>):boolean} cid Use string to identify column name. Use function for custom filter logic. Function will take rowId and column values as parameters, and return boolean value
+* @param {*=} value
+*/
+WrappedView.prototype.filterOutOnce = function(cid, value) {
+	this.filterInOnce(cid, value, true);
+};
+/** @public
+*/
+WrappedView.prototype.clearFilter = function() {
+	this._dv.clearFilter();
+};
+
+/** Disable the page index correction
+* @public
+* @param {boolean=} opt_disable
+*/
+WrappedView.prototype.disablePageCorrection = function(opt_disable) {
+};
+/** Goes to the specified page
+* @public
+* @param {number} pageIndex
+* @return {boolean} True if there is any change, otherwise false
+*/
+WrappedView.prototype.setPage = function (pageIndex) { return false; };
+/** {@link WrappedView#setPage}
+* @public
+* @function
+*/
+WrappedView.prototype.gotoPage = WrappedView.prototype.setPage;
+/** Goes to the next page. If current page is already the last page, nothing is performed
+* @public
+* @return {boolean} True if there is any change, otherwise false
+*/
+WrappedView.prototype.nextPage = function () {
+	return false;
+};
+/** Goes back to the previous page. If current page is already the first page, nothing is performed
+* @public
+* @return {boolean} True if there is any change, otherwise false
+*/
+WrappedView.prototype.previousPage = function () {
+	return false;
+};
+/** {@link WrappedView#previousPage}
+* @public
+* @function
+*/
+WrappedView.prototype.prevPage = WrappedView.prototype.previousPage;
+/** Goes to the last page
+* @public
+* @return {boolean} True if there is any change, otherwise false
+*/
+WrappedView.prototype.lastPage = function () {
+	return false;
+};
+/** Goes to the first page
+* @public
+* @return {boolean} True if there is any change, otherwise false
+*/
+WrappedView.prototype.firstPage = function () {
+	return false;
+};
+
+/**
+* @public
+* @return {number}
+*/
+WrappedView.prototype.getCurrentPage = function () {
+	return 1;
+};
+/** {@link WrappedView#getCurrentPage}
+* @public
+* @function
+*/
+WrappedView.prototype.getPageIndex = WrappedView.prototype.getCurrentPage;
+/** Verifies that current page is the last page
+* @public
+* @return {boolean}
+*/
+WrappedView.prototype.isOnLastPage = function () {
+	return true;
+};
+/** Verifies that current page is the first page
+* @public
+* @return {boolean}
+*/
+WrappedView.prototype.isOnFirstPage = function () {
+	return true;
+};
+
+/** Get total number of rows in a single page
+* @public
+* @return {number}
+*/
+WrappedView.prototype.getPageSize = function () {
+	return 0;
+};
+/** Get total number of pages
+* @public
+* @return {number}
+*/
+WrappedView.prototype.getPageCount = function () {
+	return 1;
+};
+/** {@link WrappedView#getTotalPages}
+* @public
+* @function
+*/
+WrappedView.prototype.getTotalPages = WrappedView.prototype.getPageCount;
+/** Shrink current view to the specified size. Set it 0 to reset to original size
+* @public
+* @param {number} pageSize
+*/
+WrappedView.prototype.setPageSize = function (pageSize) {};
+
+/** Group all rows by the specified criteria. The criteria can be field name (field value will be used as a group id) or a function that takes row data and returns group id.
+* @public
+* @param {string|Function|Array.<string|Function>} cid Column id or grouper method that take one parameter for row data in JSON format, and returns groupId (string)
+* @param {Array=} opt_predefinedGroups
+*/
+WrappedView.prototype.groupBy = function (cid, opt_predefinedGroups) {
+	this._dv.groupBy(cid, opt_predefinedGroups);
+};
+/** addGroup is used to add a single predefined group or multiple predefined groups.
+* @public
+* @param {*|Array} value
+*/
+WrappedView.prototype.addGroup = function (value) {
+	this._dv.addGroup(value);
+};
+/** Sort all of its descendants based on given compare function
+* @public
+* @param {Function=} compare Default is sorting by text. If null or false value is given, no sorting is performed
+*/
+WrappedView.prototype.sortGroups = function (compare) {
+	this._dv.sortGroups(compare);
+};
+/** Move the specified group within its group
+* @public
+* @param {number|string} groupRef
+* @param {number} destIndex
+*/
+WrappedView.prototype.moveGroup = function (groupRef, destIndex) {
+	this._dv.moveGroup(groupRef, destIndex);
+};
+/** WARNING: This could be very slow to perform
+* @public
+* @param {Array} predefinedGroups Use two dimensional array to define groups for multi-level grouping. The first item is for the top level groups. The second item is for the second level groups, and so on. If one dimentional array is given, it is treated as the first item in the two-dimentionsal array.
+* @example
+* dv.setPredefinedGroups(["a", "b", "c"]); // Create empty three empty groups
+* dv.setPredefinedGroups([ // Create two empty groups, and each group has 3 sub-groups
+*   ["Main Group 1", "Main 2"],
+*   ["Sub 1", "Sub 2", "Sub 3"]
+* ]);
+*/
+WrappedView.prototype.setPredefinedGroups = function (predefinedGroups) {
+	this._dv.setPredefinedGroups(predefinedGroups);
+};
+
+/** Add a footer to current group
+* @public
+* @param {number=} opt_num Number of footer to be added. If not specified, the number is one.
+*/
+WrappedView.prototype.addFooter = function (opt_num) {
+	this._dv.addFooter(opt_num);
+};
+/** Remove all footers in the gurrent view
+* @public
+*/
+WrappedView.prototype.removeFooter = function () {
+	this._dv.removeFooter();
+};
+
+/** Enable/Disable multi-group row mode
+* @public
+* @ignore
+* @param {boolean=} enabled
+*/
+WrappedView.prototype.enableMultiGroup = function(enabled) {
+	this._dv.enableMultiGroup(enabled);
+};
+
+/** Get a group DataView by group row id. If content row id is given, null is returned (unlike getGroup method).<br>
+* Nested groups and other groups outside of this group branch will be searched.
+* @public
+* @param {string} rowId Group Id, row Id or group index (for immediate child groups)
+* @return {DataView}
+* @see {@link WrappedView#getGroup}
+*/
+WrappedView.prototype.getGroupByRowId = function (rowId) {
+	return this._dv.getGroupByRowId(rowId);
+};
+/** Get a corresponding DataView by the given group Id, row Id or group index. If row Id of content row is given, a parent group will be returned. <br>
+* Nested groups and other groups outside of this group branch will be searched.
+* @public
+* @param {number|string} groupRef Group Id, row Id or group index (for immediate child groups)
+* @return {DataView}
+* @see {@link WrappedView#getGroupByRowId}
+*/
+WrappedView.prototype.getGroup = function (groupRef) {
+	return this._dv.getGroup(groupRef);
+};
+/** Get all group descendants
+* @public
+* @param {Array=} out_ary
+* @return {!Array.<DataView>}
+*/
+WrappedView.prototype.getAllGroups = function (out_ary) {
+	return this._dv.getAllGroups(out_ary);
+};
+/** Get immediate group members row ids in array list
+* @public
+* @return {Array.<string>}
+*/
+WrappedView.prototype.getGroupList = function () {
+	return this._dv.getGroupList();
+};
+/** Get group id (string) of this data view. Only exists if this data view is a child data view
+* @public
+* @return {string}
+*/
+WrappedView.prototype.getGroupId = function () {
+	return this._dv.getGroupId();
+};
+/** Get group value (any data type) of this data view. Only exists if this data view is a child data view
+* @public
+* @return {*}
+*/
+WrappedView.prototype.getGroupValue = function () {
+	return this._dv.getGroupValue();
+};
+/** Row id used by parent data view as a header row for referencing
+* @public
+* @return {string}
+*/
+WrappedView.prototype.getGroupRowId = function () {
+	return this._dv.getGroupRowId();
+};
+/**
+* @public
+* @ignore
+* @param {number} rid
+* @return {number}
+*/
+WrappedView.prototype.getFooterRowIndex = function (rid) {
+	return this._dv.getFooterRowIndex(rid);
+};
+/** A List of the footer row ids. Footer row is placed at the bottom of all other rows in this view
+* @public
+* @ignore
+* @return {Array.<string>} Null if there is no footer row
+*/
+WrappedView.prototype.getFooterRowIds = function () {
+	return this._dv.getFooterRowIds();
+};
+/**
+* @public
+* @return {boolean}
+*/
+WrappedView.prototype.hasGroup = function () {
+	return this._dv.hasGroup();
+};
+/** Deprecated in favor of getGroupByRowId
+* @public
+* @return {null}
+* @see {@link WrappedView#getGroupByRowId}
+*/
+WrappedView.prototype.getGroupRows = function () {
+	return null;
+};
+/** Get group level of the corresponding row. If the given index is not specified, header row (the view itself) is used instead. Group level 0 means it is the root data view.
+* @public
+* @param {(number|string)=} rowRef
+* @return {number}
+*/
+WrappedView.prototype.getGroupLevel = function (rowRef) {
+	var rowId = this._toRowId(rowRef);
+	return this._dv.getGroupLevel(rowId);
+};
+
+/** Statistics (e.g. Sum, Avg, Max, and Min) of the specified column will be collected on every update. WARNING: CPU usage is intensive. Do disable, if the column is no longer used.
+* @public
+* @param {string} cid
+* @param {boolean=} opt_enabled
+* @param {string=} opt_refId
+* @return {ColumnStats} ColumnStats Object
+*/
+WrappedView.prototype.enableColumnStats = function(cid, opt_enabled, opt_refId) {
+	return this._dv.enableColumnStats(cid, opt_enabled, opt_refId);
+};
+/** @public
+ * @param {string} cid
+* @return {ColumnStats} ColumnStats. Return null if the column has not been enabled
+*/
+WrappedView.prototype.getColumnStats = function(cid) {
+	return this._dv.getColumnStats(cid);
+};
+
+/** This method temporarily remove all rows from the view, which can improve performance as further updates and operations will be ignored
+* @public
+* @param {boolean=} opt_hidden
+* @returns {boolean}
+*/
+WrappedView.prototype.hide = function(opt_hidden) {
+	return this._dv.hide(opt_hidden);
+};
+/** @public
+* @return {boolean}
+*/
+WrappedView.prototype.isHidden = function() {
+	return this._dv.isHidden();
+};
+/** @public
+* @param {string} rowId
+* @return {boolean} Returns true when this row is hidden
+*/
+WrappedView.prototype.isHiddenRow = function(rowId) {
+	return this._dv.isHiddenRow(rowId);
+};
+
+/** Collapse current view. This works only if the view is generated as a child view
+* @public
+* @param {boolean=} opt_collapsed
+*/
+WrappedView.prototype.collapse = function(opt_collapsed) {
+	this._dv.collapse(opt_collapsed);
+};
+/** Collapse all children and descendants, excluding itself and its parent
+* @public
+* @param {boolean=} opt_collapsed
+*/
+WrappedView.prototype.collapseAllGroups = function(opt_collapsed) {
+	this._dv.collapseAllGroups(opt_collapsed);
+};
+/** @public
+*/
+WrappedView.prototype.toggleCollapsedState = function() {
+	this.collapse(!this.isCollapsed());
+};
+/** @public
+* @return {boolean}
+*/
+WrappedView.prototype.isCollapsed = function() {
+	return this._dv.isCollapsed();
+};
+/** Content as header mode indicates that the group headers cannot be collapsed and the first row in the group will always be shown.
+* @public
+* @param {boolean=} bool
+*/
+WrappedView.prototype.enableContentAsHeader = function(bool) {
+	this._dv.enableContentAsHeader(bool);
+};
+
+/** This will not include collapsed group and rows
+* @public
+* @return {number}
+*/
+WrappedView.prototype.getVisibleRowCount = function() {
+	return this._rids.length;
+};
+
+/** @public
+* @description check weather row object is in group
+* @param {Object} rowData
+* @param {string=} groupID Default group id is the group id of the DataView that is being called.
+* @return {boolean}
+*/
+WrappedView.prototype.isRowDataInGroup = function (rowData, groupID) {
+	return this._dv.isRowDataInGroup(rowData, groupID);
+};
+
+/** @public
+* @description check weather row ID is in group
+* @param {string} rowId
+* @param {string=} groupID Default group id is the group id of the DataView that is being called.
+* @return {boolean}
+*/
+WrappedView.prototype.isRowIdInGroup = function (rowId, groupID) {
+	return this._dv.isRowIdInGroup(rowId, groupID);
+};
+
+/** The row expansion will be directly below the specified row, even if this data view is sorted.
+* @public
+* @param {string} rid Row Id
+* @param {number=} count=1
+*/
+WrappedView.prototype.addRowExpansion = function(rid, count) {
+	this._dv.addRowExpansion(rid, count);
+};
+/**
+* @public
+* @param {string} rid Row Id
+*/
+WrappedView.prototype.removeRowExpansion = function(rid) {
+	this._dv.removeRowExpansion(rid, count);
+};
+/**
+* @public
+* @param {string|number} rowRef Row Id or index
+* @param {boolean=} force
+* @param {number=} count=1
+*/
+WrappedView.prototype.toggleRowExpansion = function(rowRef, force, count) {
+	var rid = this._toRowId(rowRef);
+	this._dv.toggleRowExpansion(rid, force, count);
+};
+/** @public
+*/
+WrappedView.prototype.removeAllRowExpansions = function() {
+	this._dv.removeAllRowExpansions();
+};
+/** Deprecated. Use {@link WrappedView#getExpansionParents} instead. Get all rows with expansion (not row expansion itself) will contains row id, otherwise undefined.
+* @public
+* @ignore
+* @param {number=} from
+* @param {number=} to EXCLUSIVE
+* @return {!Array.<string|undefined>}
+*/
+WrappedView.prototype.getRowsWithExpansion = function(from, to) {
+	return this._dv.getRowsWithExpansion(from, to); // TODO: Convert row index to row id
+};
+/** Get row expansion states from the specified range. The returned value will be row id for row expansion, otherwise empty string for other types of row (e.g. normal row, or group header row)
+* @public
+* @param {number=} from
+* @param {number=} to EXCLUSIVE
+* @return {Array.<string>} object mapping of rowIndex and parentRowId
+*/
+WrappedView.prototype.getExpansionParents = function (from, to) {
+	return this._dv.getExpansionParents(from, to); // TODO: Convert row index to row id
+};
+
+/** Check if the specified row is itself a row expansion.
+* @public
+* @param {string} rid rowId
+* @return {boolean}
+*/
+WrappedView.prototype.isRowExpansion = function(rid) {
+	return this._dv.isRowExpansion(rid);
+};
+/** Check if the specified row has row expansion (not row expansion itself).
+* @public
+* @param {string} rid rowId
+* @return {boolean}
+*/
+WrappedView.prototype.hasRowExpansion = function(rid) {
+	return this._dv.hasRowExpansion(rid);
+};
+/** Get row Id of the row expansion by providing the row Id of the row with row expansion (not row expansion itself). This is NOT recommended for normal usage, since the row expansion contains no data in the DataView
+* @public
+* @param {string} rid rowId
+* @param {number=} idx=0
+* @return {string} Empty string is returned if the provided row does not contains a row expansion.
+*/
+WrappedView.prototype.getRowExpansionId = function(rid, idx) {
+	return this._dv.getRowExpansionId(rid, idx);
+};
+
+/** Get index from the row expansion id. Any row other than row expansion will yield negative value (-1)
+* @public
+* @param {string} rid Row expansion id
+* @return {number}
+*/
+WrappedView.prototype.getRowExpansionIndex = function(rid) {
+	return this._dv.getRowExpansionIndex(rid);
+};
+/**
+* @public
+* @param {function(Object):boolean} searchLogic Function that takes row data object and return boolean value
+* @param {Array.<string>=} opt_out Array for containing row ids
+* @return {!Array.<string>} List of row ids
+*/
+WrappedView.prototype.searchAll = function(searchLogic, opt_out) {
+	return this._dv.searchAll(searchLogic, opt_out);
+};
+/**
+* @public
+* @param {number|string} rowRef
+* @param {function(Object):boolean} searchLogic Function that takes row data object and return boolean value
+* @return {number} Row index
+*/
+WrappedView.prototype.searchPrev = function(rowRef, searchLogic) {
+	var rid = this._toRowId(rowRef);
+	return this._dv.searchPrev(rid, searchLogic);
+};
+/**
+* @public
+* @param {number|string} rowRef
+* @param {function(Object):boolean} searchLogic Function that takes row data object and return boolean value
+* @return {number} Row index
+*/
+WrappedView.prototype.searchNext = function(rowRef, searchLogic) {
+	var rid = this._toRowId(rowRef);
+	return this._dv.searchNext(rid, searchLogic);
+};
+
+/** Blocks all row insertion and removal, but keep updating the data
+* @public
+* @param {boolean=} opt_bool
+* @return {boolean} True if there is any change
+*/
+WrappedView.prototype.stall = function(opt_bool) {
+	return this._dv.stall(opt_bool);
+};
+/** Automatically and asyncronuosly remove group that has no member or no content. Predefined groups will not be removed in this way.
+* @public
+* @param {boolean=} opt_bool
+* @return {boolean} True if there is any change
+*/
+WrappedView.prototype.enableAutoGroupRemoval = function(opt_bool) {
+	return this._dv.enableAutoGroupRemoval(opt_bool);
+};
+/** Automatically hide null or undefined group header, while keeping the group's items intact.
+* @public
+* @param {boolean=} opt_bool
+* @return {boolean} True if there is any change
+*/
+WrappedView.prototype.enableAutoGroupHiding = function(opt_bool) {
+	return this._dv.enableAutoGroupHiding(opt_bool);
+};
+
+/** Copy row order in data view to its data table
+* @public
+*/
+WrappedView.prototype.synchronizeRowOrder = function() {
+	this._dv.synchronizeRowOrder();
+};
+/** Set visible row as segment separator (hidden or filtered rows cannot be a segment separator)
+* @public
+* @param {string|number} rowRef Row id or row index
+* @param {boolean=} enabled
+* @return {boolean} Return true if there is any change
+*/
+WrappedView.prototype.setSegmentSeparator = function(rowRef, enabled) {
+	var rowId = this._toRowId(rowRef);
+	return this._dv.setSegmentSeparator(rowId, enabled);
+};
+/**
+* @public
+* @return {boolean} Return true if there is any change
+*/
+WrappedView.prototype.unsetAllSegmentSeparators = function() {
+	return this._dt.unsetAllSegmentSeparators();
+};
+/**
+* @public
+* @return {boolean}
+*/
+WrappedView.prototype.hasSegmentation = function() {
+	return this._dt.hasSegmentation();
+};
+/**
+* @public
+* @param {string} rid
+* @return {boolean}
+*/
+WrappedView.prototype.isSegmentSeparator = function(rid) {
+	return this._dt.isSegmentSeparator(rid);
+};
+
+/**
+* @public
+* @param {string} rid
+* @return {string} parent row id of this segmentation. If the parent row id for this segmentation cannot be found, return ""
+*/
+WrappedView.prototype.getSegmentParentRowId = function(rid) {
+	return this._dt.getSegmentParentRowId(rid);
+};
+/** @public
+* @param {string|number} rowRef Row id or row index
+* @param {boolean=} collapsed
+* @return {boolean} Return true if there is any change
+*/
+WrappedView.prototype.collapseSegment = function(rowRef, collapsed) {
+	var rid = this._toRowId(rowRef);
+	return this._dv.collapseSegment(rid, collapsed);
+};
+/** @public
+* @param {string|number} rowRef Row id or row index
+* @param {boolean=} expanded
+* @return {boolean} Return true if there is any change
+*/
+WrappedView.prototype.expandSegment = function(rowRef, expanded) {
+	return this.collapseSegment(rowRef, expanded === false);
+};
+/** @public
+* @return {boolean} Return true if there is any change
+*/
+WrappedView.prototype.expandAllSegments = function() {
+	return this._dv.expandAllSegments();
+};
+/** Deprecated.
+* @public
+* @ignore
+*/
+WrappedView.prototype.setSegmentCollapsingLogic = function() {};
+/** @public
+* @param {string|number} rowRef Row id or row index
+* @return {boolean} Return true if only the given row is a collapsed segment separator
+*/
+WrappedView.prototype.isSegmentCollapsed = function(rowRef) {
+	var rid = this._toRowId(rowRef);
+	return this._dv.isSegmentCollapsed(rid, collapsed);
+};
+/** Remove existing segment children and fill the segments with all contnet rows before the next segment separator
+* @public
+* @param {string|number} segmentRef Row id or row index
+*/
+WrappedView.prototype.fillSegment = function(segmentRef) {
+	var rid = this._toRowId(segmentRef);
+	this._dv.fillSegment(rid);
+};
+/** Remove all existing segment children in each segment and fill the segments with all contnet rows before the next segment separator
+* @public
+*/
+WrappedView.prototype.fillSegments = function() {
+	this._dv.fillSegments();
+};
+/** @public
+* @param {string|number} segmentRef Row id or row index
+* @param {string|number} rowRef Row id, row index
+* @return {boolean} Return true if there is any change
+*/
+WrappedView.prototype.addSegmentChild = function(segmentRef, rowRef) {
+	var segmentId = this._toRowId(segmentRef);
+	var rowId = this._toRowId(rowRef);
+	return this._dv.addSegmentChild(segmentId, rowId);
+};
+/** @public
+* @param {string|number} segmentRef Row id or row index
+* @param {Array.<string|number>} rowRefs Array of row ids or row indices
+* @return {boolean} Return true if there is any change
+*/
+WrappedView.prototype.addSegmentChildren = function(segmentRef, rowRefs) {
+	var segmentId = this._toRowId(segmentRef);
+	var rowId = this._toRowId(rowRef);
+	return this._dv.addSegmentChildren(segmentId, rowId);
+};
+/** @public
+* @param {string|number} segmentRef Row id or row index
+* @param {string|number} rowRef Row id, row index
+* @return {boolean} Return true if there is any change
+*/
+WrappedView.prototype.removeSegmentChild = function(segmentRef, rowRef) {
+	var segmentId = this._toRowId(segmentRef);
+	var rowId = this._toRowId(rowRef);
+	return this._dv.removeSegmentChild(segmentId, rowId);
+};
+/** @public
+* @param {string|number} segmentRef Row id or row index
+* @param {Array.<string|number>} rowRefs Array of row ids or row indices. If null is given, no child will be removed.
+* @return {boolean} Return true if there is any change
+*/
+WrappedView.prototype.removeSegmentChildren = function(segmentRef, rowRefs) {
+	var segmentId = this._toRowId(segmentRef);
+	var rowId = this._toRowId(rowRef);
+	return this._dv.removeSegmentChildren(segmentId, rowId);
+};
+/** @public
+* @return {boolean} Return true if there is any change
+*/
+WrappedView.prototype.removeAllSegmentChildren = function() {
+	return this._dt.removeAllSegmentChildren();
+};
+/** Get row ids of all segment separator
+* @public
+* @return {Array.<string>} Return null if there is no segment separator
+*/
+WrappedView.prototype.getSegmentIds = function() {
+	return this._dt.getSegmentIds();
+};
+/** Get row ids of all children from the specified segment
+* @public
+* @param {string|number} segmentRef Row id or row index
+* @return {Array.<string>} Returns array of row ids. Returns null if there is no child or no segment separator found
+*/
+WrappedView.prototype.getSegmentChildIds = function(segmentRef) {
+	return this._dt.getSegmentChildIds(this._toRowId(segmentRef));
+};
+/** Sort all of existing segments by given compare function
+* @public
+* @param {Function} compare
+*/
+WrappedView.prototype.sortSegments = function (compare) {
+	this._dt.sortSegments(compare);
+};
+
+/** Return 0, if there is no wrapping
+* @public
+* @return {number}
+*/
+WrappedView.prototype.getWrapSize = function () {
+	return this._dv.getWrapSize();
+};
+/** Return null, if there is no wrapping
+* @public
+* @return {Array.<WrappedView>}
+*/
+WrappedView.prototype.getWrappedViews = function () {
+	return this._dv.getWrappedViews();
+};
+/**
+* @public
+* @param {number=} wrapSize
+* @fires DataView#wrapCountChanged
+*/
+WrappedView.prototype.wrapView = function (wrapSize) {
+	this._dv.wrapView(wrapSize);
+};
+
+/** Construct a JSON object that is compatible with console.table()
+* @public
+* @param {Object=} opt_options {@link DataCache#dump}
+* @return {!Array.<Object>} Return a JSON object that is compatible with console.table()
+* @see {@link DataCache#dump}
+*/
+WrappedView.prototype.dump = function(opt_options) {
+	return DataCache.constructTable(this.getMultipleRowData(this._rids), opt_options, this._rids);
+};
+/** Print current data and structure to console panel
+* @public
+* @param {Object=} opt_options
+* @example
+// Options have the following format:
+// {
+//  "colNames": Array.<string>,
+//  "rowCount": number,
+//  "startIndex": number,
+//  "getter": function(Object, string):*,
+//  "withRowIds": boolean
+//}
+dv.log({"rowCount": 10}); // Showing 10 records
+dv.log({"getter": function(rowData, colName){
+	var complexData = rowData[colName];
+	return complextData.someProperty;
+}});
+*/
+WrappedView.prototype.log = function(opt_options) {
+	console.table(this.dump(opt_options));
+};
+
+
+/** Check if the row should be filtered out
+* @public
+* @param {string} rid
+* @param {Object} rowData
+* @return {boolean}
+*/
+WrappedView.prototype.isRowFiltered = function(rid, rowData) {
+	return this._dv.isRowFiltered(rid, rowData);
+};
+
+export default WrappedView;
+export { WrappedView };