devextreme 21.2.6 → 21.2.7

package/esm/ui/grid_core/ui.grid_core.focus.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.focus.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
@@ -311,17 +311,21 @@ var FocusController = core.ViewController.inherit({
         var focusedRowIndex = that._dataController.getRowIndexByKey(change.focusedRowKey);
         var rowsView = that.getView("rowsView");
         var $tableElement;
+        var $mainRow;
         each(rowsView.getTableElements(), (function(index, element) {
             var isMainTable = 0 === index;
             $tableElement = $(element);
             that._clearPreviousFocusedRow($tableElement, focusedRowIndex);
-            that._prepareFocusedRow({
+            var $row = that._prepareFocusedRow({
                 changedItem: that._dataController.getVisibleRows()[focusedRowIndex],
                 $tableElement: $tableElement,
-                focusedRowIndex: focusedRowIndex,
-                isMainTable: isMainTable
-            })
-        }))
+                focusedRowIndex: focusedRowIndex
+            });
+            if (isMainTable) {
+                $mainRow = $row
+            }
+        }));
+        $mainRow && rowsView.scrollToElementVertically($mainRow)
     },
     _clearPreviousFocusedRow: function($tableElement, focusedRowIndex) {
         var $prevRowFocusedElement = $tableElement.find(FOCUSED_ROW_SELECTOR).filter((_, focusedRow) => {
@@ -341,14 +345,10 @@ var FocusController = core.ViewController.inherit({
         if (changedItem && ("data" === changedItem.rowType || "group" === changedItem.rowType)) {
             var focusedRowIndex = options.focusedRowIndex;
             var $tableElement = options.$tableElement;
-            var isMainTable = options.isMainTable;
             var tabIndex = this.option("tabindex") || 0;
             var rowsView = this.getView("rowsView");
             $row = $(rowsView._getRowElements($tableElement).eq(focusedRowIndex));
-            $row.addClass(ROW_FOCUSED_CLASS).attr("tabindex", tabIndex);
-            if (isMainTable) {
-                rowsView.scrollToElementVertically($row)
-            }
+            $row.addClass(ROW_FOCUSED_CLASS).attr("tabindex", tabIndex)
         }
         return $row
     }

package/esm/ui/grid_core/ui.grid_core.grid_view.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.grid_view.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/

package/esm/ui/grid_core/ui.grid_core.header_filter.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.header_filter.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/

package/esm/ui/grid_core/ui.grid_core.header_filter_core.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.header_filter_core.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/

package/esm/ui/grid_core/ui.grid_core.header_panel.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.header_panel.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
@@ -29,6 +29,7 @@ import {
 var HEADER_PANEL_CLASS = "header-panel";
 var TOOLBAR_BUTTON_CLASS = "toolbar-button";
 var TOOLBAR_ARIA_LABEL = "-ariaToolbar";
+var DEFAULT_TOOLBAR_ITEM_NAMES = ["addRowButton", "applyFilterButton", "columnChooserButton", "exportButton", "groupPanel", "revertButton", "saveButton", "searchPanel"];
 var HeaderPanel = ColumnsView.inherit({
     _getToolbarItems: function() {
         return []
@@ -65,6 +66,11 @@ var HeaderPanel = ColumnsView.inherit({
         return options.toolbarOptions
     },
     _normalizeToolbarItems(defaultItems, userItems) {
+        defaultItems.forEach(button => {
+            if (!DEFAULT_TOOLBAR_ITEM_NAMES.includes(button.name)) {
+                throw new Error("Default toolbar item '".concat(button.name, "' is not added to DEFAULT_TOOLBAR_ITEM_NAMES"))
+            }
+        });
         var defaultProps = {
             location: "after"
         };
@@ -80,17 +86,15 @@ var HeaderPanel = ColumnsView.inherit({
             defaultButtonsByNames[button.name] = button
         });
         var normalizedItems = userItems.map(button => {
-            var needHideButton = false;
             if (isString(button)) {
                 button = {
                     name: button
-                };
-                needHideButton = true
+                }
             }
             if (isDefined(button.name)) {
                 if (isDefined(defaultButtonsByNames[button.name])) {
                     button = extend(true, {}, defaultButtonsByNames[button.name], button)
-                } else if (needHideButton) {
+                } else if (DEFAULT_TOOLBAR_ITEM_NAMES.includes(button.name)) {
                     button.visible = false
                 }
             }

package/esm/ui/grid_core/ui.grid_core.keyboard_navigation.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.keyboard_navigation.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
@@ -78,6 +78,7 @@ var EDIT_MODE_CELL = "cell";
 var FOCUS_TYPE_ROW = "row";
 var FOCUS_TYPE_CELL = "cell";
 var COLUMN_HEADERS_VIEW = "columnHeadersView";
+var FUNCTIONAL_KEYS = ["shift", "control", "alt"];
 
 function isGroupRow($row) {
     return $row && $row.hasClass(GROUP_ROW_CLASS)
@@ -272,7 +273,7 @@ var KeyboardNavigationController = core.ViewController.inherit({
         }
         this._isNeedFocus = true;
         this._isNeedScroll = true;
-        this._updateFocusedCellPositionByTarget(originalEvent.target);
+        FUNCTIONAL_KEYS.indexOf(e.keyName) < 0 && this._updateFocusedCellPositionByTarget(originalEvent.target);
         if (!isHandled) {
             switch (e.keyName) {
                 case "leftArrow":
@@ -295,8 +296,7 @@ var KeyboardNavigationController = core.ViewController.inherit({
                     isHandled = true;
                     break;
                 case "space":
-                    this._spaceKeyHandler(e, isEditing);
-                    isHandled = true;
+                    isHandled = this._spaceKeyHandler(e, isEditing);
                     break;
                 case "A":
                     if (isCommandKeyPressed(e.originalEvent)) {
@@ -384,14 +384,16 @@ var KeyboardNavigationController = core.ViewController.inherit({
         }
     },
     _upDownKeysHandler: function(eventArgs, isEditing) {
+        var _this$_editingControl;
         var rowIndex = this._focusedCellPosition.rowIndex;
         var visibleRowIndex = this.getVisibleRowIndex();
         var $row = this._focusedView && this._focusedView.getRow(visibleRowIndex);
         var $event = eventArgs.originalEvent;
         var isUpArrow = "upArrow" === eventArgs.keyName;
         var dataSource = this._dataController.dataSource();
+        var isRowEditingInCurrentRow = null === (_this$_editingControl = this._editingController) || void 0 === _this$_editingControl ? void 0 : _this$_editingControl.isEditRow(visibleRowIndex);
         var isEditingNavigationMode = this._isFastEditingStarted();
-        var allowNavigate = (!isEditing || isEditingNavigationMode) && $row && !isDetailRow($row);
+        var allowNavigate = (!isRowEditingInCurrentRow || !isEditing || isEditingNavigationMode) && $row && !isDetailRow($row);
         if (allowNavigate) {
             isEditingNavigationMode && this._closeEditCell();
             if (!this._navigateNextCell($event, eventArgs.keyName)) {
@@ -435,10 +437,12 @@ var KeyboardNavigationController = core.ViewController.inherit({
                     shift: eventArgs.shift,
                     control: eventArgs.ctrl
                 });
-                eventArgs.originalEvent.preventDefault()
+                eventArgs.originalEvent.preventDefault();
+                return true
             }
+            return false
         } else {
-            this._beginFastEditing(eventArgs.originalEvent)
+            return this._beginFastEditing(eventArgs.originalEvent)
         }
     },
     _ctrlAKeyHandler: function(eventArgs, isEditing) {
@@ -1985,7 +1989,8 @@ export var keyboardNavigationModule = {
                     var result = this.items().length - 1;
                     var virtualItemsCount = this.virtualItemsCount();
                     if (virtualItemsCount) {
-                        result += virtualItemsCount.begin + virtualItemsCount.end
+                        var rowIndexOffset = this.getRowIndexOffset();
+                        result += rowIndexOffset + virtualItemsCount.end
                     }
                     return result
                 }

package/esm/ui/grid_core/ui.grid_core.master_detail.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.master_detail.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/

package/esm/ui/grid_core/ui.grid_core.modules.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.modules.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/

package/esm/ui/grid_core/ui.grid_core.pager.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.pager.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
@@ -27,7 +27,7 @@ var PagerView = modules.View.inherit({
         var dataController = this.getController("data");
         dataController.changed.add(e => {
             if (e && e.repaintChangesOnly) {
-                var pager = this._getPager();
+                var pager = this._pager;
                 if (pager) {
                     pager.option({
                         pageIndex: getPageIndex(dataController),
@@ -40,14 +40,11 @@ var PagerView = modules.View.inherit({
                     this.render()
                 }
             } else if (!e || "update" !== e.changeType && "updateSelection" !== e.changeType && "updateFocusedRow" !== e.changeType) {
+                this._pager = null;
                 this.render()
             }
         })
     },
-    _getPager: function() {
-        var $element = this.element();
-        return $element && $element.data("dxPager")
-    },
     _renderCore: function() {
         var $element = this.element().addClass(this.addWidgetPrefix(PAGER_CLASS));
         var pagerOptions = this.option("pager") || {};
@@ -85,12 +82,19 @@ var PagerView = modules.View.inherit({
         if (isDefined(pagerOptions.infoText)) {
             options.infoText = pagerOptions.infoText
         }
+        if (this._pager) {
+            this._pager.repaint();
+            return
+        }
         if (hasWindow()) {
-            this._createComponent($element, Pager, options)
+            this._pager = this._createComponent($element, Pager, options)
         } else {
             $element.addClass("dx-pager").html('<div class="dx-pages"><div class="dx-page"></div></div>')
         }
     },
+    getPager: function() {
+        return this._pager
+    },
     getPageSizes: function() {
         var dataController = this.getController("data");
         var pagerOptions = this.option("pager");
@@ -141,12 +145,16 @@ var PagerView = modules.View.inherit({
                 this._pageSizes = null
             }
             if (!isDataSource) {
+                this._pager = null;
                 this._invalidate();
                 if (hasWindow() && isPager && this.component) {
                     this.component.resize()
                 }
             }
         }
+    },
+    dispose: function() {
+        this._pager = null
     }
 });
 export var pagerModule = {

package/esm/ui/grid_core/ui.grid_core.row_dragging.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.row_dragging.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
@@ -63,7 +63,8 @@ var RowDraggingExtender = {
             var _this$sortableFixedNa;
             null === (_this$sortableFixedNa = this[sortableFixedName]) || void 0 === _this$sortableFixedNa ? void 0 : _this$sortableFixedNa.$element().css("pointerEvents", toggle ? "auto" : "")
         };
-        var filter = this.option("dataRowTemplate") ? "> table > tbody.dx-row:not(.dx-freespace-row):not(.dx-virtual-row)" : "> table > tbody > .dx-row:not(.dx-freespace-row):not(.dx-virtual-row)";
+        var rowSelector = ".dx-row:not(.dx-freespace-row):not(.dx-virtual-row):not(.dx-header-row):not(.dx-footer-row)";
+        var filter = this.option("dataRowTemplate") ? "> table > tbody".concat(rowSelector) : "> table > tbody > ".concat(rowSelector);
         if ((allowReordering || this[currentSortableName]) && $content.length) {
             this[currentSortableName] = this._createComponent($content, Sortable, extend({
                 component: this.component,

package/esm/ui/grid_core/ui.grid_core.rows.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.rows.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/

package/esm/ui/grid_core/ui.grid_core.search.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.search.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/

package/esm/ui/grid_core/ui.grid_core.selection.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.selection.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
@@ -404,13 +404,13 @@ var SelectionController = gridCore.Controller.inherit(function() {
         getSelectedRowsData: function() {
             return this._selection.getSelectedItems()
         },
-        changeItemSelection: function(visibleItemIndex, keys) {
+        changeItemSelection: function(visibleItemIndex, keys, setFocusOnly) {
             keys = keys || {};
             if (this.isSelectionWithCheckboxes()) {
                 keys.control = true
             }
             var loadedItemIndex = visibleItemIndex + this._dataController.getRowIndexOffset() - this._dataController.getRowIndexOffset(true);
-            return this._selection.changeItemSelection(loadedItemIndex, keys)
+            return this._selection.changeItemSelection(loadedItemIndex, keys, setFocusOnly)
         },
         focusedItemIndex: function(itemIndex) {
             if (isDefined(itemIndex)) {

package/esm/ui/grid_core/ui.grid_core.sorting.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.sorting.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/

package/esm/ui/grid_core/ui.grid_core.sorting_mixin.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.sorting_mixin.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/

package/esm/ui/grid_core/ui.grid_core.state_storing.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.state_storing.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/

package/esm/ui/grid_core/ui.grid_core.state_storing_core.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.state_storing_core.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/

package/esm/ui/grid_core/ui.grid_core.utils.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.utils.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/

package/esm/ui/grid_core/ui.grid_core.validating.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.validating.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
@@ -426,7 +426,8 @@ var ValidatingController = modules.Controller.inherit({
                 var adapter = validator.option("adapter");
                 if (adapter) {
                     adapter.getValue = getValue;
-                    adapter.validationRequestsCallbacks = []
+                    adapter.validationRequestsCallbacks = [];
+                    adapter.bypass = () => parameters.row.isNewRow && !this._isValidationInProgress && !editingController.isCellModified(parameters)
                 }
             }
             return validator
@@ -645,7 +646,7 @@ export var validatingModule = {
                     }
                 },
                 _validateEditFormAfterUpdate: function(row, isCustomSetCellValue) {
-                    if (isCustomSetCellValue && this._editForm && !row.isNewRow) {
+                    if (isCustomSetCellValue && this._editForm) {
                         this._editForm.validate()
                     }
                     this.callBase.apply(this, arguments)
@@ -1149,9 +1150,13 @@ export var validatingModule = {
                     if (showValidationMessage && $cell && column && validationResult && validationResult.brokenRules) {
                         var errorMessages = [];
                         validationResult.brokenRules.forEach((function(rule) {
-                            errorMessages.push(rule.message)
+                            if (rule.message) {
+                                errorMessages.push(rule.message)
+                            }
                         }));
-                        this._showValidationMessage($focus, errorMessages, column.alignment || "left", revertTooltip)
+                        if (errorMessages.length) {
+                            this._showValidationMessage($focus, errorMessages, column.alignment || "left", revertTooltip)
+                        }
                     }!hideBorder && this._rowsView.element() && this._rowsView.updateFreeSpaceRowHeight()
                 },
                 focus: function($element, hideBorder) {

package/esm/ui/grid_core/ui.grid_core.virtual_columns.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.virtual_columns.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/

package/esm/ui/grid_core/ui.grid_core.virtual_columns_core.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.virtual_columns_core.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/

package/esm/ui/grid_core/ui.grid_core.virtual_scrolling.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.virtual_scrolling.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
@@ -90,6 +90,7 @@ var VirtualScrollingDataSourceAdapterExtender = function() {
         init: function() {
             this.callBase.apply(this, arguments);
             this._items = [];
+            this._totalCount = -1;
             this._isLoaded = true;
             this._loadPageCount = 1;
             this._virtualScrollController = new VirtualScrollController(this.component, this._getVirtualScrollDataOptions())
@@ -169,6 +170,7 @@ var VirtualScrollingDataSourceAdapterExtender = function() {
         _handleDataChanged: function(e) {
             if (false === this.option(LEGACY_SCROLLING_MODE)) {
                 this._items = this._dataSource.items().slice();
+                this._totalCount = this._dataSourceTotalCount(true);
                 this.callBase.apply(this, arguments);
                 return
             }
@@ -189,6 +191,9 @@ var VirtualScrollingDataSourceAdapterExtender = function() {
         items: function() {
             return this._items
         },
+        _dataSourceTotalCount: function(isBase) {
+            return false === this.option(LEGACY_SCROLLING_MODE) && isVirtualMode(this) && !isBase ? this._totalCount : this.callBase()
+        },
         itemsCount: function(isBase) {
             if (isBase || false === this.option(LEGACY_SCROLLING_MODE)) {
                 return this.callBase()
@@ -669,7 +674,7 @@ export var virtualScrollingModule = {
                         return baseResult
                     },
                     _loadDataSource: function() {
-                        if (this._rowsScrollController) {
+                        if (this._rowsScrollController && isVirtualPaging(this)) {
                             var _this$getLoadPagePara, _this$_dataSource;
                             var {
                                 loadPageCount: loadPageCount
@@ -694,7 +699,7 @@ export var virtualScrollingModule = {
                                 var component = this.component;
                                 var scrollable = component.getScrollable && component.getScrollable();
                                 var isSortingOperation = this.dataSource().operationTypes().sorting;
-                                if (scrollable && !isSortingOperation) {
+                                if (scrollable && !isSortingOperation && rowIndex >= 0) {
                                     var rowElement = component.getRowElement(rowIndex);
                                     var $rowElement = rowElement && rowElement[0] && $(rowElement[0]);
                                     var top = $rowElement && $rowElement.position().top;
@@ -770,7 +775,7 @@ export var virtualScrollingModule = {
                                 return false === that.option(LEGACY_SCROLLING_MODE) ? that._itemCount : that._items.filter(isItemCountable).length
                             },
                             hasKnownLastPage: function() {
-                                return true
+                                return false === that.option(LEGACY_SCROLLING_MODE) ? that.hasKnownLastPage() : true
                             },
                             pageIndex: function(index) {
                                 if (void 0 !== index) {
@@ -1133,8 +1138,9 @@ export var virtualScrollingModule = {
                             pageIndex: pageIndex,
                             loadPageCount: loadPageCount
                         } = this.getLoadPageParams();
+                        var pageIndexIsValid = this._pageIndexIsValid(pageIndex);
                         var result = null;
-                        if (!this._isLoading && (pageIndex !== loadedPageParams.pageIndex || loadPageCount !== loadedPageParams.loadPageCount)) {
+                        if (!this._isLoading && pageIndexIsValid && (pageIndex !== loadedPageParams.pageIndex || loadPageCount !== loadedPageParams.loadPageCount)) {
                             result = {
                                 pageIndex: pageIndex,
                                 loadPageCount: loadPageCount
@@ -1142,6 +1148,13 @@ export var virtualScrollingModule = {
                         }
                         return result
                     },
+                    _pageIndexIsValid: function(pageIndex) {
+                        var result = true;
+                        if (isAppendMode(this) && this.hasKnownLastPage() || isVirtualMode(this)) {
+                            result = pageIndex * this.pageSize() < this.totalItemsCount()
+                        }
+                        return result
+                    },
                     _loadItems: function(checkLoading) {
                         var _dataSourceAdapter$lo, _dataSourceAdapter$pa;
                         var virtualPaging = isVirtualPaging(this);

package/esm/ui/grid_core/ui.grid_core.virtual_scrolling_core.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/grid_core/ui.grid_core.virtual_scrolling_core.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
@@ -330,7 +330,8 @@ export var VirtualScrollController = Class.inherit(function() {
             var _this$option2;
             var virtualMode = this.option("scrolling.mode") === SCROLLING_MODE_VIRTUAL;
             var totalItemsCount = this._dataOptions.totalItemsCount();
-            var topIndex = this._viewportItemIndex;
+            var hasKnownLastPage = this._dataOptions.hasKnownLastPage();
+            var topIndex = hasKnownLastPage && this._viewportItemIndex > totalItemsCount ? totalItemsCount : this._viewportItemIndex;
             var bottomIndex = this._viewportSize + topIndex;
             var maxGap = this.option("scrolling.prerenderedRowChunkSize") || 1;
             var isScrollingBack = this.isScrollingBack();

package/esm/ui/hierarchical_collection/ui.data_adapter.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/hierarchical_collection/ui.data_adapter.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/

package/esm/ui/hierarchical_collection/ui.data_converter.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/hierarchical_collection/ui.data_converter.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/

package/esm/ui/hierarchical_collection/ui.hierarchical_collection_widget.js

@@ -1,7 +1,7 @@
 /**
  * DevExtreme (esm/ui/hierarchical_collection/ui.hierarchical_collection_widget.js)
- * Version: 21.2.6
- * Build date: Tue Mar 01 2022
+ * Version: 21.2.7
+ * Build date: Mon Apr 11 2022
  *
  * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/