@syncfusion/ej2-treegrid 32.1.25 → 32.2.3

package/dist/es6/ej2-treegrid.es5.js

@@ -1,5 +1,5 @@
 import { Property, merge, ChildProperty, Collection, isNullOrUndefined, Browser, removeClass, addClass, getValue, createElement, setValue, extend as extend$1, Internationalization, getEnumValue, compile, Component, L10n, EventHandler, KeyboardEvents, SanitizeHtmlHelper, Complex, Event, NotifyPropertyChanges, closest, setStyleAttribute, select, classList, debounce, remove } from '@syncfusion/ej2-base';
-import { Grid, Logger as Logger$1, detailLists, Clipboard, getObject, parentsUntil, Print as Print$1, templateCompiler, appendChildren, extend, CellRenderer, getUid, CellType, Freeze as Freeze$1, getNumberFormat, getActualProperties, iterateArrayOrObject, RowDropSettings as RowDropSettings$1, Reorder as Reorder$1, Resize as Resize$1, Scroll, RowDD as RowDD$1, VirtualRowModelGenerator, Filter as Filter$1, Data, ExportHelper, ExcelExport as ExcelExport$1, PdfExport as PdfExport$1, Page as Page$1, Toolbar as Toolbar$1, calculateAggregate, Aggregate as Aggregate$1, Sort as Sort$1, ColumnMenu as ColumnMenu$1, ContextMenu as ContextMenu$1, resetRowIndex, Edit as Edit$1, CommandColumn as CommandColumn$1, DetailRow as DetailRow$1, Cell, getVisiblePage, VirtualContentRenderer, InterSectionObserver, getTransformValues, RenderType, VirtualHeaderRenderer, VirtualScroll as VirtualScroll$1, ColumnChooser as ColumnChooser$1, RowRenderer, InfiniteScroll as InfiniteScroll$1 } from '@syncfusion/ej2-grids';
+import { Grid, Logger as Logger$1, detailLists, Clipboard, getObject, parentsUntil, Print as Print$1, templateCompiler, appendChildren, extend, CellRenderer, getUid, CellType, Freeze as Freeze$1, getNumberFormat, getActualProperties, iterateArrayOrObject, RowDropSettings as RowDropSettings$1, Reorder as Reorder$1, Resize as Resize$1, Scroll, RowDD as RowDD$1, VirtualRowModelGenerator, Filter as Filter$1, Data, ExportHelper, ExcelExport as ExcelExport$1, PdfExport as PdfExport$1, Page as Page$1, Toolbar as Toolbar$1, calculateAggregate, Aggregate as Aggregate$1, Sort as Sort$1, ColumnMenu as ColumnMenu$1, ContextMenu as ContextMenu$1, resetRowIndex, Edit as Edit$1, CommandColumn as CommandColumn$1, DetailRow as DetailRow$1, Cell, getVisiblePage, VirtualContentRenderer, InterSectionObserver, getTransformValues, RenderType, VirtualHeaderRenderer, VirtualScroll as VirtualScroll$1, ColumnChooser as ColumnChooser$1, getRowIndexFromElement, RowRenderer, InfiniteScroll as InfiniteScroll$1 } from '@syncfusion/ej2-grids';
 import { createCheckBox } from '@syncfusion/ej2-buttons';
 import { DataManager, ODataAdaptor, WebApiAdaptor, WebMethodAdaptor, CacheAdaptor, UrlAdaptor, Query, DataUtil, RemoteSaveAdaptor, Deferred, JsonAdaptor, Predicate as Predicate$1 } from '@syncfusion/ej2-data';
 import { showSpinner, hideSpinner, createSpinner } from '@syncfusion/ej2-popups';
@@ -600,6 +600,8 @@ var ariaColIndex = 'aria-colindex';
 var ariaRowIndex = 'aria-rowindex';
 /** @hidden */
 var actionFailure = 'actionFailure';
+/** @hidden */
+var collapseActionComplete = 'collapseActionComplete';
 
 var __extends$5 = (undefined && undefined.__extends) || (function () {
     var extendStatics = function (d, b) {
@@ -4348,6 +4350,7 @@ var TreeGrid = /** @__PURE__ @class */ (function (_super) {
         _this.componentRefresh = Component.prototype.refresh;
         _this.isComponentRefresh = false;
         _this.isVirtualExpandCollapse = false;
+        _this.isInfiniteCollapse = false;
         _this.objectEqualityChecker = function (old, current) {
             if (old) {
                 var keys = Object.keys(old);
@@ -5224,12 +5227,12 @@ var TreeGrid = /** @__PURE__ @class */ (function (_super) {
         var checkboxColumn = this.columnModel.filter(function (col) { return col.showCheckbox; });
         var treeColumn = this.columns[this.treeColumnIndex];
         if (checkboxColumn.length !== 0) {
-            if (checkboxColumn !== treeColumn) {
-                failureCases.push('ShowCheckbox column should not be defined other than the tree column.');
-            }
             if (checkboxColumn.length > 1) {
                 failureCases.push('Only one column can have the ShowCheckbox option enabled.');
             }
+            else if (checkboxColumn[0].field !== treeColumn.field) {
+                failureCases.push('ShowCheckbox column should not be defined other than the tree column.');
+            }
         }
         var alignColumn;
         if (this.treeColumnIndex !== null && this.treeColumnIndex !== -1 && this.treeColumnIndex < this.columns.length) {
@@ -5861,6 +5864,12 @@ var TreeGrid = /** @__PURE__ @class */ (function (_super) {
             if (args.action === 'clearFilter' && _this.enableCollapseAll) {
                 _this.collapseAll();
             }
+            if (args.action === 'clearFilter' && _this.enableInfiniteScrolling) {
+                _this.expandAll();
+            }
+            if (args.requestType === 'sorting' && _this.enableInfiniteScrolling) {
+                _this.expandAll();
+            }
             if (_this.action === 'indenting' || _this.action === 'outdenting') {
                 _this.action = _this.action === 'indenting' ? 'indented' : 'outdented';
                 var selectedItem_1 = [_this.selectedRecords];
@@ -7716,13 +7725,6 @@ var TreeGrid = /** @__PURE__ @class */ (function (_super) {
             else if (!this.isCollapseAll) {
                 this.trigger(collapsed, collapseArgs);
             }
-            if (this.enableInfiniteScrolling) {
-                var scrollHeight = this.grid.getContent().firstElementChild.scrollHeight;
-                var scrollTop = this.grid.getContent().firstElementChild.scrollTop;
-                if ((scrollHeight - scrollTop) < this.grid.getRowHeight() + +this.height) {
-                    this.grid.getContent().firstElementChild.scrollBy(0, this.grid.getRowHeight());
-                }
-            }
         }
     };
     TreeGrid.prototype.updateExpandStateMapping = function (record, state) {
@@ -8106,10 +8108,13 @@ var TreeGrid = /** @__PURE__ @class */ (function (_super) {
                 if ((!isCountRequired(this) || childRecords.length) || action === 'collapse') {
                     this.localExpand(action, row, record);
                 }
+                if (this.enableInfiniteScrolling && action === 'collapse' && !this.isCollapseAll) {
+                    this.notify(collapseActionComplete, { isCollapse: true, data: record, row: row });
+                }
                 var lastrowIdx = this.getVisibleRecords()[this.getVisibleRecords().length - 1]['index'];
                 var lastRow = this.getRowByIndex(lastrowIdx);
                 var borderElement = lastRow ? lastRow.nextElementSibling ? lastRow.nextElementSibling.classList.contains('e-detailrow') ? lastRow.nextElementSibling : lastRow : lastRow : null;
-                if (this.grid.getContentTable().clientHeight <= this.grid.getContent().clientHeight && !isNullOrUndefined(borderElement) && !borderElement.cells[0].classList.contains('e-lastrowcell')) {
+                if (!this.isInfiniteCollapse && this.grid.getContentTable().clientHeight <= this.grid.getContent().clientHeight && !isNullOrUndefined(borderElement) && !borderElement.cells[0].classList.contains('e-lastrowcell')) {
                     this.lastRowBorder(borderElement, true);
                 }
             }
@@ -8124,7 +8129,7 @@ var TreeGrid = /** @__PURE__ @class */ (function (_super) {
                 targetEle.closest('.e-treerowcell').classList.remove('e-cellselectionbackground');
                 targetEle.closest('.e-treerowcell').removeAttribute('aria-selected');
             }
-            if (this.isPixelHeight() && !row.cells[0].classList.contains('e-lastrowcell')) {
+            if (this.isPixelHeight() && !row.cells[0].classList.contains('e-lastrowcell') && !this.isInfiniteCollapse) {
                 var totalRows = this.getRows();
                 var rows = this.getContentTable().rows;
                 totalRows = [].slice.call(rows);
@@ -8141,6 +8146,7 @@ var TreeGrid = /** @__PURE__ @class */ (function (_super) {
             this.notify('rowExpandCollapse', { detailrows: detailrows, action: displayAction, record: record, row: row });
             this.updateAltRow(gridRows);
         }
+        this.isInfiniteCollapse = false;
     };
     TreeGrid.prototype.updateChildOnDemand = function (expandingArgs) {
         var _this = this;
@@ -8273,11 +8279,18 @@ var TreeGrid = /** @__PURE__ @class */ (function (_super) {
         }
     };
     TreeGrid.prototype.localExpand = function (action, row, record) {
+        var _this = this;
         var rows;
         var detailRow = row.nextElementSibling ? row.nextElementSibling.classList.contains('e-detailrow') ? row.nextElementSibling : null : null;
-        var childRecords = this.grid.currentViewData.filter(function (e) {
-            return e.parentUniqueID === record.uniqueID;
-        });
+        var childRecords;
+        if (this.enableInfiniteScrolling) {
+            childRecords = this.grid.getRowsObject().filter(function (e) { return e.data.parentUniqueID === record.uniqueID; });
+        }
+        else {
+            childRecords = this.grid.currentViewData.filter(function (e) {
+                return e.parentUniqueID === record.uniqueID;
+            });
+        }
         if (this.isPixelHeight() && row.cells[0].classList.contains('e-lastrowcell')) {
             this.lastRowBorder(row, false);
         }
@@ -8317,9 +8330,9 @@ var TreeGrid = /** @__PURE__ @class */ (function (_super) {
             });
         }
         var gridRowsObject = this.grid.getRowsObject();
-        var currentViewData = this.grid.currentViewData;
+        var currentViewData = this.enableInfiniteScrolling ? this.grid.getRowsObject() : this.grid.currentViewData;
         var currentRecord = currentViewData.filter(function (e) {
-            return e.uniqueID === record.uniqueID;
+            return _this.enableInfiniteScrolling ? e.data.uniqueID === record.uniqueID : e.uniqueID === record.uniqueID;
         });
         var currentIndex = currentViewData.indexOf(currentRecord[0]);
         if (!isNullOrUndefined(gridRowsObject[parseInt(currentIndex.toString(), 10)].visible) &&
@@ -16683,6 +16696,10 @@ var InfiniteScroll = /** @__PURE__ @class */ (function () {
         this.parent.grid.on('infinite-edit-handler', this.infiniteEditHandler, this);
         this.parent.grid.on('infinite-crud-cancel', this.createRows, this);
         this.parent.grid.on('content-ready', this.contentready, this);
+        this.parent.on(collapseActionComplete, this.collapseActionComplete, this);
+        this.parent.grid.on('data-ready', this.onDataReady, this);
+        this.dataBoundFunction = this.dataBound.bind(this);
+        this.parent.addEventListener(dataBound, this.dataBoundFunction);
     };
     /**
      * @hidden
@@ -16698,6 +16715,53 @@ var InfiniteScroll = /** @__PURE__ @class */ (function () {
         this.parent.off(pagingActions, this.infinitePageAction);
         this.parent.grid.off('infinite-crud-cancel', this.createRows);
         this.parent.grid.off('content-ready', this.contentready);
+        this.parent.off(collapseActionComplete, this.collapseActionComplete);
+        this.parent.grid.off('data-ready', this.onDataReady);
+        this.parent.removeEventListener(dataBound, this.dataBoundFunction);
+    };
+    InfiniteScroll.prototype.dataBound = function () {
+        if (this.treeAction === 'collapse') {
+            this.treeAction = 'refresh';
+            this.makeCollapseRequest();
+        }
+        else if (this.treeAction === 'refresh') {
+            this.treeAction = null;
+        }
+    };
+    InfiniteScroll.prototype.onDataReady = function (e) {
+        if (!isNullOrUndefined(e.count) && e.requestType !== 'infiniteScroll') {
+            this.maxPage = Math.ceil(e.count / this.parent.pageSettings.pageSize);
+        }
+    };
+    InfiniteScroll.prototype.collapseActionComplete = function (args) {
+        if (!this.parent.infiniteScrollSettings.enableCache && args.isCollapse) {
+            var contentBounds = this.parent.getContent().firstElementChild.getBoundingClientRect();
+            var tableBounds = this.parent.grid.contentModule.getTable().getBoundingClientRect();
+            if (Math.round(tableBounds.bottom - this.parent.grid.getRowHeight()) <= Math.round(contentBounds.bottom)) {
+                this.treeAction = 'collapse';
+                this.collapsedData = args.data;
+                this.makeCollapseRequest(args);
+            }
+        }
+    };
+    InfiniteScroll.prototype.makeCollapseRequest = function (args) {
+        var rows = this.parent.getRows();
+        var index = getRowIndexFromElement(rows[rows.length - 1]);
+        var previousPage = this.parent.grid.pageSettings.currentPage;
+        var nextPage = Math.ceil(index / this.parent.grid.pageSettings.pageSize) + 1;
+        if ((previousPage >= this.maxPage) || (nextPage > this.maxPage)) {
+            return;
+        }
+        this.parent.grid.pageSettings.currentPage = nextPage;
+        this.parent['isInfiniteCollapse'] = true;
+        var scrollArg = {
+            requestType: 'infiniteScroll',
+            currentPage: this.parent.grid.pageSettings.currentPage,
+            prevPage: previousPage,
+            startIndex: index + 1,
+            direction: 'down'
+        };
+        this.parent.grid.notify('model-changed', scrollArg);
     };
     /**
      * Handles the Expand Collapse action for Remote data with infinite scrolling.
@@ -16757,6 +16821,7 @@ var InfiniteScroll = /** @__PURE__ @class */ (function () {
      * @returns {void}
      */
     InfiniteScroll.prototype.infinitePageAction = function (pageingDetails) {
+        var _this = this;
         var dm = new DataManager(pageingDetails.result);
         var expanded = new Predicate$1('expanded', 'notequal', null).or('expanded', 'notequal', undefined);
         var visualData = dm.executeLocal(new Query().where(expanded));
@@ -16788,7 +16853,12 @@ var InfiniteScroll = /** @__PURE__ @class */ (function () {
                 if (!isCache && actionArgs.requestType === 'delete') {
                     var skip = lastIndex - actionArgs.data.length + 1;
                     var take = actionArgs.data.length;
-                    query = query.skip(skip).take(take);
+                    if (skip < 0) {
+                        query = query.take(take);
+                    }
+                    else {
+                        query = query.skip(skip).take(take);
+                    }
                 }
                 else if (isCache && actionArgs.requestType === 'delete' ||
                     (actionArgs.requestType === 'save' && actionArgs.action === 'add')) {
@@ -16796,13 +16866,36 @@ var InfiniteScroll = /** @__PURE__ @class */ (function () {
                     query = query.take(this.parent.infiniteScrollSettings.initialBlocks * this.parent.pageSettings.pageSize);
                 }
                 else {
-                    query = query.page(current, size);
+                    if (this.treeAction !== 'collapse' && this.treeAction !== 'refresh') {
+                        query = query.page(current, size);
+                    }
                 }
             }
             else {
                 query = query.page(current, size);
             }
             dm.dataSource.json = visualData;
+            if (this.treeAction === 'collapse') {
+                var rows = this.parent.getRows();
+                var skip = getRowIndexFromElement(rows[rows.length - 1]) + 1;
+                query = query.skip(skip);
+                var renderedChildDataCount = this.parent.grid.getRowsObject().filter(function (record) {
+                    return record.data.parentUniqueID === _this.collapsedData.uniqueID;
+                }).length;
+                var remainingChildDataCount = this.collapsedData.childRecords.length - renderedChildDataCount;
+                if (remainingChildDataCount > 0) {
+                    query = query.take(Math.max(remainingChildDataCount, 0));
+                }
+                else {
+                    query = query.take(this.parent.pageSettings.pageSize);
+                }
+            }
+            else if (this.treeAction === 'refresh') {
+                var rows = this.parent.getRows();
+                var skip = getRowIndexFromElement(rows[rows.length - 1]) + 1;
+                query = query.skip(skip);
+                query = query.take(this.parent.infiniteScrollSettings.initialBlocks * this.parent.pageSettings.pageSize);
+            }
             if (!isCache && !isNullOrUndefined(actionArgs) && actionArgs.requestType === 'save' && actionArgs.action === 'add') {
                 pageingDetails.result = [actionArgs.data];
             }
@@ -16954,5 +17047,5 @@ var InfiniteScroll = /** @__PURE__ @class */ (function () {
     return InfiniteScroll;
 }());
 
-export { Aggregate, AggregateColumn, AggregateRow, Column, ColumnChooser, ColumnMenu, CommandColumn, ContextMenu, ContextMenuItems, DataManipulation, DetailRow, Edit, EditSettings, ExcelExport, Filter, FilterSettings, Freeze, InfiniteScroll, InfiniteScrollSettings, LoadingIndicator, Logger, Page, PageSettings, PdfExport, Predicate, Render, Reorder, Resize, RowDD, RowDropSettings, SearchSettings, Selection, SelectionSettings, Sort, SortDescriptor, SortSettings, StackedColumn, Toolbar, ToolbarItem, TreeClipboard, TreeGrid, TreeGridColumn, TreeVirtual, TreeVirtualRowModelGenerator, VirtualScroll, actionBegin, actionComplete, actionFailure, ariaColIndex, ariaRowIndex, autoCol, batchAdd, batchCancel, batchDelete, batchEditFormRendered, batchSave, beforeBatchAdd, beforeBatchCancel, beforeBatchDelete, beforeBatchSave, beforeCopy, beforeDataBound, beforeExcelExport, beforePaste, beforePdfExport, beforeStartEdit, beginAdd, beginEdit, cellEdit, cellSave, cellSaved, checkboxChange, collapsed, collapsing, content, contextMenuClick, contextMenuOpen, crudAction, dataBound, dataListener, dataStateChange, destroy, detailDataBound, doubleTap, expanded, expanding, extendArray, findChildrenRecords, findParentRecords, frozenContent, frozenHeader, frozenLeft, frozenRight, getExpandStatus, getParentData, getPlainData, headerContent, indexModifier, isCheckboxcolumn, isCountRequired, isFilterChildHierarchy, isHidden, isOffline, isRemoteData, keyPressed, leftRight, load, localPagedExpandCollapse, movableContent, movableHeader, pagingActions, printGridInit, queryCellInfo, recordDoubleClick, remoteExpand, resizeStop, rowDataBound, rowDeselected, rowDeselecting, rowDrag, rowDragStart, rowDragStartHelper, rowDrop, rowDropped, rowSelected, rowSelecting, rowdraging, rowsAdd, rowsRemove, savePreviousRowPosition, table, toolbarClick, treeGridDetails, updateData, virtualActionArgs, virtualColumnIndex };
+export { Aggregate, AggregateColumn, AggregateRow, Column, ColumnChooser, ColumnMenu, CommandColumn, ContextMenu, ContextMenuItems, DataManipulation, DetailRow, Edit, EditSettings, ExcelExport, Filter, FilterSettings, Freeze, InfiniteScroll, InfiniteScrollSettings, LoadingIndicator, Logger, Page, PageSettings, PdfExport, Predicate, Render, Reorder, Resize, RowDD, RowDropSettings, SearchSettings, Selection, SelectionSettings, Sort, SortDescriptor, SortSettings, StackedColumn, Toolbar, ToolbarItem, TreeClipboard, TreeGrid, TreeGridColumn, TreeVirtual, TreeVirtualRowModelGenerator, VirtualScroll, actionBegin, actionComplete, actionFailure, ariaColIndex, ariaRowIndex, autoCol, batchAdd, batchCancel, batchDelete, batchEditFormRendered, batchSave, beforeBatchAdd, beforeBatchCancel, beforeBatchDelete, beforeBatchSave, beforeCopy, beforeDataBound, beforeExcelExport, beforePaste, beforePdfExport, beforeStartEdit, beginAdd, beginEdit, cellEdit, cellSave, cellSaved, checkboxChange, collapseActionComplete, collapsed, collapsing, content, contextMenuClick, contextMenuOpen, crudAction, dataBound, dataListener, dataStateChange, destroy, detailDataBound, doubleTap, expanded, expanding, extendArray, findChildrenRecords, findParentRecords, frozenContent, frozenHeader, frozenLeft, frozenRight, getExpandStatus, getParentData, getPlainData, headerContent, indexModifier, isCheckboxcolumn, isCountRequired, isFilterChildHierarchy, isHidden, isOffline, isRemoteData, keyPressed, leftRight, load, localPagedExpandCollapse, movableContent, movableHeader, pagingActions, printGridInit, queryCellInfo, recordDoubleClick, remoteExpand, resizeStop, rowDataBound, rowDeselected, rowDeselecting, rowDrag, rowDragStart, rowDragStartHelper, rowDrop, rowDropped, rowSelected, rowSelecting, rowdraging, rowsAdd, rowsRemove, savePreviousRowPosition, table, toolbarClick, treeGridDetails, updateData, virtualActionArgs, virtualColumnIndex };
 //# sourceMappingURL=ej2-treegrid.es5.js.map