@progress/kendo-react-grid 5.4.0-dev.202205271059 → 5.4.0-dev.202206090823

package/dist/es/Grid.d.ts

@@ -65,7 +65,7 @@ export declare class Grid extends React.Component<GridProps, {}> {
             buttonCount: PropTypes.Requireable<number>;
             info: PropTypes.Requireable<boolean>;
             type: PropTypes.Requireable<string>;
-            pageSizes: PropTypes.Requireable<boolean | number[]>;
+            pageSizes: PropTypes.Requireable<boolean | (number | null | undefined)[]>;
             previousNext: PropTypes.Requireable<boolean>;
         }>>;
         pageSize: PropTypes.Requireable<number>;
@@ -102,7 +102,7 @@ export declare class Grid extends React.Component<GridProps, {}> {
         navigatable: PropTypes.Requireable<boolean>;
     };
     /** @hidden */
-    static contextType: React.Context<TableKeyboardNavigationContextType>;
+    static contextType: React.Context<TableKeyboardNavigationContextType | undefined>;
     protected dragLogic: CommonDragLogic;
     private _columns;
     private _columnsMap;
@@ -187,7 +187,7 @@ export declare class Grid extends React.Component<GridProps, {}> {
     /**
      * @hidden
      */
-    getSnapshotBeforeUpdate(): any;
+    getSnapshotBeforeUpdate(): null;
     /**
      * @hidden
      */

package/dist/es/Grid.js

@@ -24,10 +24,14 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __spreadArray = (this && this.__spreadArray) || function (to, from) {
-    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
-        to[j] = from[i];
-    return to;
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
 };
 import * as React from 'react';
 import * as PropTypes from 'prop-types';
@@ -97,6 +101,7 @@ var Grid = /** @class */ (function (_super) {
         _this._columnsMap = [[]];
         _this.contextStateRef = { current: undefined };
         _this.navigationStateRef = { current: undefined };
+        _this._data = [];
         _this.wrapperScrollTop = 0;
         _this.headerRef = React.createRef();
         _this.headerElementRef = React.createRef();
@@ -122,8 +127,8 @@ var Grid = /** @class */ (function (_super) {
             }
             else if (_this.element) {
                 var selectedRow = rowIndex < 1
-                    ? _this.element.querySelector("tbody > tr:nth-child(" + 1 + ")")
-                    : _this.element.querySelector("tbody > tr:nth-child(" + rowIndex + ")");
+                    ? _this.element.querySelector("tbody > tr:nth-child(".concat(1, ")"))
+                    : _this.element.querySelector("tbody > tr:nth-child(".concat(rowIndex, ")"));
                 if (selectedRow) {
                     selectedRow.scrollIntoView(true);
                 }
@@ -167,7 +172,8 @@ var Grid = /** @class */ (function (_super) {
             });
             if (_this.props.onKeyDown) {
                 var _a = getSelectionOptions(_this.props.selectable), mode = _a.mode, cell = _a.cell;
-                _this.props.onKeyDown.call(undefined, __assign({ dataItems: _this.getLeafDataItems(), mode: mode, cell: cell, componentId: _this._gridId, selectedField: _this.props.selectedField }, _this.getArguments(event)));
+                var ev = __assign({ dataItems: _this.getLeafDataItems(), mode: mode, cell: cell, componentId: _this._gridId, selectedField: _this.props.selectedField }, _this.getArguments(event));
+                _this.props.onKeyDown.call(undefined, ev);
             }
         };
         _this.onFocus = function (event) {
@@ -177,7 +183,8 @@ var Grid = /** @class */ (function (_super) {
         };
         _this.onNavigationAction = function (options) {
             if (_this.props.onNavigationAction) {
-                _this.props.onNavigationAction.call(undefined, __assign({ focusElement: options.focusElement }, _this.getArguments(options.event)));
+                var ev = __assign({ focusElement: options.focusElement }, _this.getArguments(options.event));
+                _this.props.onNavigationAction.call(undefined, ev);
             }
         };
         _this.rowClick = function (e, item) {
@@ -231,7 +238,7 @@ var Grid = /** @class */ (function (_super) {
             _this.raiseDataEvent(_this.props.onSortChange, { sort: sort }, { sort: sort }, syntheticEvent);
         };
         _this.filterChange = function (filter, syntheticEvent) {
-            _this.raiseDataEvent(_this.props.onFilterChange, { filter: filter }, { filter: filter, skip: 0 }, syntheticEvent);
+            _this.raiseDataEvent(_this.props.onFilterChange, { filter: filter }, { filter: filter || undefined, skip: 0 }, syntheticEvent);
         };
         _this.groupChange = function (groups, event) {
             var syntheticEvent = event.nativeEvent ?
@@ -443,11 +450,11 @@ var Grid = /** @class */ (function (_super) {
         this._data = [];
         var resolvedGroupsCount = flatData(this._data, propsData, groupingFooter, { index: this.props.skip || 0 }, this.props.group !== undefined, this.props.expandField);
         var children = React.Children.toArray(this.props.children);
-        this.initColumns(children.filter(function (child) { return child &&
+        this.initColumns(children.filter(function (child) { return child && child.type &&
             child.type.displayName === 'KendoReactGridColumn'; }), resolvedGroupsCount);
-        var toolbar = children.filter(function (child) { return child &&
+        var toolbar = children.filter(function (child) { return child && child.type &&
             child.type.displayName === 'KendoReactGridToolbar'; });
-        var noRecords = children.filter(function (child) { return child &&
+        var noRecords = children.filter(function (child) { return child && child.type &&
             child.type.displayName === 'KendoReactGridNoRecords'; });
         var leafColumns = this._columns.filter(function (c) { return c.children.length === 0; });
         var groupingPanel = groupable && (React.createElement(GroupPanel, { group: this.props.group || [], groupChange: this.groupChange, pressHandler: this.dragLogic.pressHandler, dragHandler: this.dragLogic.dragHandler, releaseHandler: this.dragLogic.releaseHandler, refCallback: this.dragLogic.refGroupPanelDiv, resolveTitle: this.resolveTitle }));
@@ -470,15 +477,15 @@ var Grid = /** @class */ (function (_super) {
                         return null;
                     }
                     var columnKey = column.id ? column.id : columnIndex;
-                    var className = "" + (column.className ? column.className + ' ' : '')
-                        + ("" + (column.locked ? 'k-grid-content-sticky' : ''));
+                    var className = "".concat(column.className ? column.className + ' ' : '')
+                        + "".concat(column.locked ? 'k-grid-content-sticky' : '');
                     var style = column.left !== undefined
                         ? !_this.isRtl
                             ? { left: column.left, right: column.right }
                             : { left: column.right, right: column.left }
                         : {};
                     var cellProps = {
-                        id: navigationTools.generateNavigatableId(rowId + "-" + String(columnIndex), idPrefix),
+                        id: navigationTools.generateNavigatableId("".concat(rowId, "-").concat(String(columnIndex)), idPrefix),
                         colSpan: colSpans[columnIndex],
                         dataItem: item.dataItem,
                         field: column.field,
@@ -541,7 +548,7 @@ var Grid = /** @class */ (function (_super) {
         var absoluteDataIndex = this.vs.propsSkip || 0;
         var body = [];
         var rowIndexStart = this._columnsMap.length + (this.props.filterable ? 1 : 0) + 1;
-        var currentAriaRowIndex;
+        var currentAriaRowIndex = 0;
         if (this._data.length) {
             var dataIndex_1 = -1;
             var detailRowCount_1 = 0;
@@ -569,8 +576,8 @@ var Grid = /** @class */ (function (_super) {
                             return (React.createElement(GridGroupCell, { id: '', dataIndex: item.dataIndex, field: group.field, dataItem: item.dataItem, key: idx, style: {}, ariaColumnIndex: 1 + idx, isSelected: false }));
                         }),
                         _this.props.expandField &&
-                            React.createElement(GridDetailHierarchyCell, { id: navigationTools.generateNavigatableId(detailRowId + "-dhcell", idPrefix) }),
-                        React.createElement(GridDetailCell, { dataItem: item.dataItem, dataIndex: item.dataIndex, colSpan: detailColspan, ariaColIndex: 2 + (_this.props.group ? _this.props.group.length : 0), detail: _this.props.detail, id: navigationTools.generateNavigatableId(detailRowId + "-dcell", idPrefix) }))));
+                            React.createElement(GridDetailHierarchyCell, { id: navigationTools.generateNavigatableId("".concat(detailRowId, "-dhcell"), idPrefix) }),
+                        React.createElement(GridDetailCell, { dataItem: item.dataItem, dataIndex: item.dataIndex, colSpan: detailColspan, ariaColIndex: 2 + (_this.props.group ? _this.props.group.length : 0), detail: _this.props.detail, id: navigationTools.generateNavigatableId("".concat(detailRowId, "-dcell"), idPrefix) }))));
                 }
             });
         }
@@ -660,7 +667,8 @@ var Grid = /** @class */ (function (_super) {
     Grid.prototype.raiseDataEvent = function (handler, data, moreData, syntheticEvent) {
         var dataStateChange = this.props.onDataStateChange;
         if (handler) {
-            handler.call(undefined, __assign(__assign({}, this.getArguments(syntheticEvent)), data));
+            var ev = __assign(__assign({}, this.getArguments(syntheticEvent)), data);
+            handler.call(undefined, ev);
         }
         else if (dataStateChange) {
             dataStateChange.call(undefined, __assign(__assign({}, this.getArguments(syntheticEvent)), { dataState: __assign(__assign({}, this.getDataState()), moreData) }));
@@ -677,7 +685,7 @@ var Grid = /** @class */ (function (_super) {
             return index;
         };
         var spliced = this._columns.splice(prev, end(prev) - prev);
-        (_a = this._columns).splice.apply(_a, __spreadArray([prev < next ? end(next - spliced.length) : next, 0], spliced));
+        (_a = this._columns).splice.apply(_a, __spreadArray([prev < next ? end(next - spliced.length) : next, 0], spliced, false));
         this._columns.filter(function (q) { return q.declarationIndex >= 0; }).forEach(function (c, i) { return c.orderIndex = i; });
         var eventColumnProps = this.columns;
         this.forceUpdate();
@@ -694,7 +702,7 @@ var Grid = /** @class */ (function (_super) {
             return;
         }
         var group = this.props.group.slice();
-        group.splice.apply(group, __spreadArray([nextIndex, 0], group.splice(prevIndex, 1)));
+        group.splice.apply(group, __spreadArray([nextIndex, 0], group.splice(prevIndex, 1), false));
         this.groupChange(group, nativeEvent);
     };
     Grid.prototype.columnToGroup = function (columnIndex, groupIndex, nativeEvent) {
@@ -765,7 +773,7 @@ var Grid = /** @class */ (function (_super) {
         };
         var columnIndexOffset = 0;
         if (this.props.expandField && (this.props.onExpandChange) && this.props.detail) {
-            this._columns.unshift(__assign(__assign({}, defaultServiceProps), { cell: GridHierarchyCell, field: this.props.expandField, headerClassName: 'k-hierarchy-cell k-header', id: navigationTools.generateNavigatableId("" + this._columns.length, idPrefix, 'column') }));
+            this._columns.unshift(__assign(__assign({}, defaultServiceProps), { cell: GridHierarchyCell, field: this.props.expandField, headerClassName: 'k-hierarchy-cell k-header', id: navigationTools.generateNavigatableId("".concat(this._columns.length), idPrefix, 'column') }));
             columnIndexOffset++;
         }
         for (var i = 0; i < groupCount; i++) {

package/dist/es/GridColumn.d.ts

@@ -3,7 +3,7 @@ import { GridColumnProps } from './interfaces/GridColumnProps';
 /**
  * @hidden
  */
-export declare const GridColumn: React.StatelessComponent<GridColumnProps>;
+export declare const GridColumn: React.FunctionComponent<GridColumnProps>;
 /**
  * @hidden
  */

package/dist/es/VirtualScroll.d.ts

@@ -13,9 +13,9 @@ export declare class VirtualScroll {
     scrollableVirtual: boolean;
     realSkip: number;
     pageSize: number;
-    PageChange: (event: Page, syntheticEvent: React.SyntheticEvent<any>) => void;
+    PageChange: ((event: Page, syntheticEvent: React.SyntheticEvent<any>) => void) | null;
     tableBody: HTMLTableSectionElement | null;
-    heightContainer: any;
+    heightContainer: null;
     fixedScroll: boolean;
     askedSkip: number | undefined;
     containerRef: React.RefObject<HTMLDivElement>;

package/dist/es/VirtualScroll.js

@@ -4,6 +4,7 @@ import * as React from 'react';
  */
 var VirtualScroll = /** @class */ (function () {
     function VirtualScroll(cached) {
+        this.table = null;
         this.containerHeight = 0;
         this.topCacheCount = 0; // 4;
         this.attendedSkip = 0; // -4;
@@ -12,6 +13,8 @@ var VirtualScroll = /** @class */ (function () {
         this.scrollableVirtual = false;
         this.realSkip = 0;
         this.pageSize = 0;
+        this.PageChange = null;
+        this.tableBody = null;
         this.heightContainer = null;
         this.fixedScroll = false;
         this.askedSkip = undefined;
@@ -63,10 +66,12 @@ var VirtualScroll = /** @class */ (function () {
     });
     VirtualScroll.prototype.changePage = function (skip, e) {
         this.attendedSkip = skip - this.topCacheCount;
-        this.PageChange({
-            skip: Math.max(0, skip - this.topCacheCount),
-            take: this.pageSize
-        }, e);
+        if (this.PageChange) {
+            this.PageChange({
+                skip: Math.max(0, skip - this.topCacheCount),
+                take: this.pageSize
+            }, e);
+        }
     };
     VirtualScroll.prototype.translate = function (dY) {
         this.tableTranslate = dY;

package/dist/es/cells/GridCell.d.ts

@@ -1,2 +1,3 @@
+import * as React from 'react';
 import { GridCellProps } from '../interfaces/GridCellProps';
-export declare const GridCell: (props: GridCellProps) => any;
+export declare const GridCell: (props: GridCellProps) => React.ReactElement<HTMLTableCellElement, string | React.JSXElementConstructor<any>> | null;

package/dist/es/cells/GridEditCell.d.ts

@@ -1,5 +1,6 @@
+import * as React from 'react';
 import { GridCellProps } from '../interfaces/GridCellProps';
 /**
  * @hidden
  */
-export declare const GridEditCell: (props: GridCellProps) => any;
+export declare const GridEditCell: (props: GridCellProps) => React.ReactElement<HTMLTableCellElement, string | React.JSXElementConstructor<any>> | null;

package/dist/es/cells/GridFilterCell.d.ts

@@ -5,7 +5,7 @@ export declare class GridFilterCell extends React.Component<GridFilterCellProps,
     /**
      * @hidden
      */
-    render(): any;
+    render(): string | number | boolean | React.ReactFragment | JSX.Element | null | undefined;
     private renderOperatorEditor;
     private inputChange;
     private operatorChange;

package/dist/es/cells/GridGroupCell.d.ts

@@ -1,5 +1,6 @@
+import * as React from 'react';
 import { GridCellProps } from '../interfaces/GridCellProps';
 /**
  * @hidden
  */
-export declare const GridGroupCell: (props: GridCellProps) => any;
+export declare const GridGroupCell: (props: GridCellProps) => React.ReactElement<HTMLTableCellElement, string | React.JSXElementConstructor<any>> | null;

package/dist/es/cells/GridHierarchyCell.d.ts

@@ -1,5 +1,6 @@
+import * as React from 'react';
 import { GridCellProps } from '../interfaces/GridCellProps';
 /**
  * @hidden
  */
-export declare const GridHierarchyCell: (props: GridCellProps) => any;
+export declare const GridHierarchyCell: (props: GridCellProps) => React.ReactElement<HTMLTableCellElement, string | React.JSXElementConstructor<any>> | null;

package/dist/es/cells/GridSelectionCell.d.ts

@@ -1,5 +1,6 @@
+/// <reference types="react" />
 import { GridCellProps } from '../interfaces/GridCellProps';
 /**
  * @hidden
  */
-export declare const GridSelectionCell: (props: GridCellProps) => any;
+export declare const GridSelectionCell: (props: GridCellProps) => JSX.Element | null;

package/dist/es/columnMenu/GridColumnMenuCheckboxFilter.js

@@ -24,10 +24,14 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __spreadArray = (this && this.__spreadArray) || function (to, from) {
-    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
-        to[j] = from[i];
-    return to;
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
 };
 import * as React from 'react';
 import { GridColumnMenuItem } from './GridColumnMenuItem';
@@ -177,7 +181,7 @@ var GridColumnMenuCheckboxFilter = /** @class */ (function (_super) {
         _this.handleCheckBoxChange = function (e, value) {
             var field = _this.props.column.field || '';
             var newFilter = __assign({}, _this.state.currentFilter);
-            var filters = __spreadArray([], _this.state.currentFilter.filters) || [];
+            var filters = __spreadArray([], _this.state.currentFilter.filters, true) || [];
             var fieldFilters = [];
             if (_this.compositeFilterIndex !== -1 && newFilter.filters[_this.compositeFilterIndex].filters && value !== 'all') {
                 fieldFilters = newFilter.filters[_this.compositeFilterIndex].filters;
@@ -219,7 +223,7 @@ var GridColumnMenuCheckboxFilter = /** @class */ (function (_super) {
         _this.isAllSelected = function () {
             var isAllChecked = false;
             if (_this.state.currentFilter) {
-                var filters_1 = __spreadArray([], _this.state.currentFilter.filters);
+                var filters_1 = __spreadArray([], _this.state.currentFilter.filters, true);
                 if (_this.compositeFilterIndex === -1) {
                     return false;
                 }
@@ -270,7 +274,7 @@ var GridColumnMenuCheckboxFilter = /** @class */ (function (_super) {
         var expandState = this.isControlled() ? this.props.expanded : this.state.expanded;
         var filterValues = [];
         if (this.state.currentFilter) {
-            var currentFilter = __spreadArray([], this.state.currentFilter.filters);
+            var currentFilter = __spreadArray([], this.state.currentFilter.filters, true);
             this.compositeFilterIndex = currentFilter.findIndex(function (filter) {
                 if (filter.filters && filter.filters.length > 0) {
                     return filter.filters[0].field === column.field;

package/dist/es/columnMenu/GridColumnMenuFilter.js

@@ -24,10 +24,14 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __spreadArray = (this && this.__spreadArray) || function (to, from) {
-    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
-        to[j] = from[i];
-    return to;
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
 };
 import * as React from 'react';
 import { isCompositeFilterDescriptor } from '@progress/kendo-data-query';
@@ -126,7 +130,7 @@ var GridColumnMenuFilter = /** @class */ (function (_super) {
          * @hidden
          */
         _this.removeGroup = function (group, rootFilter) {
-            var filters = __spreadArray([], rootFilter.filters);
+            var filters = __spreadArray([], rootFilter.filters, true);
             var groupIndex = filters
                 .findIndex(function (f) { return f === group; });
             if (groupIndex > -1) {
@@ -140,7 +144,7 @@ var GridColumnMenuFilter = /** @class */ (function (_super) {
         _this.insertGroup = function (group, rootFilter) {
             return __assign(__assign({}, rootFilter), { filters: __spreadArray([
                     group
-                ], rootFilter.filters) });
+                ], rootFilter.filters, true) });
         };
         /**
          * @hidden
@@ -260,7 +264,7 @@ var GridColumnMenuFilter = /** @class */ (function (_super) {
                 }
             }
             else {
-                updatedFilter = __assign(__assign({}, rootFilter), { filters: __spreadArray(__spreadArray([], rootFilter.filters), [currentFilterGroup]) });
+                updatedFilter = __assign(__assign({}, rootFilter), { filters: __spreadArray(__spreadArray([], rootFilter.filters, true), [currentFilterGroup], false) });
             }
             _this.props.onFilterChange(updatedFilter, event);
             if (_this.props.onCloseMenu) {

package/dist/es/columnMenu/GridColumnMenuItem.js

@@ -33,8 +33,8 @@ var GridColumnMenuItem = /** @class */ (function (_super) {
      */
     GridColumnMenuItem.prototype.render = function () {
         var _a = this.props, title = _a.title, iconClass = _a.iconClass, selected = _a.selected;
-        return (React.createElement("div", { onClick: this.onClick, className: "k-columnmenu-item " + (selected ? 'k-selected' : '') },
-            iconClass && React.createElement("span", { className: "k-icon " + iconClass }),
+        return (React.createElement("div", { onClick: this.onClick, className: "k-columnmenu-item ".concat(selected ? 'k-selected' : '') },
+            iconClass && React.createElement("span", { className: "k-icon ".concat(iconClass) }),
             title));
     };
     return GridColumnMenuItem;

package/dist/es/columnMenu/GridColumnMenuWrapper.js

@@ -49,6 +49,10 @@ var GridColumnMenuWrapper = /** @class */ (function (_super) {
             show: false
         };
         /** @hidden */
+        _this._anchor = null;
+        /** @hidden */
+        _this._content = null;
+        /** @hidden */
         _this.blurTimeout = undefined;
         /** @hidden */
         _this.blur = function () {

package/dist/es/drag/ColumnDraggable.d.ts

@@ -11,6 +11,7 @@ export interface ColumnDraggableProps {
     dragClue?: React.RefObject<DragClue | null> | null;
     headerRef?: React.RefObject<HTMLDivElement | null> | null;
     containerRef?: React.RefObject<HTMLDivElement | null> | null;
+    children?: React.ReactNode;
 }
 /**
  * @hidden

package/dist/es/drag/ColumnDraggable.js

@@ -22,6 +22,7 @@ var ColumnDraggable = /** @class */ (function (_super) {
     __extends(ColumnDraggable, _super);
     function ColumnDraggable() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.draggable = null;
         /**
          * @hidden
          */

package/dist/es/drag/ColumnResize.js

@@ -7,6 +7,9 @@ var OFFSET_ROUND = 1;
 var ColumnResize = /** @class */ (function () {
     function ColumnResize(triggerResize) {
         var _this = this;
+        // Typings. `col` and `colgroup` do not differ, both represnt a `HTMLTableColElement`.
+        // Implemented as `any`.
+        this.columns = [];
         /**
          * The settings for resizing the Grid.
          */

package/dist/es/drag/ColumnResizer.js

@@ -22,6 +22,8 @@ var ColumnResizer = /** @class */ (function (_super) {
     __extends(ColumnResizer, _super);
     function ColumnResizer() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.draggable = null;
+        _this.isDragged = false;
         /**
          * @hidden
          */

package/dist/es/drag/CommonDragLogic.js

@@ -8,6 +8,7 @@ var CommonDragLogic = /** @class */ (function () {
         var _this = this;
         this.refDragElementClue = React.createRef();
         this.refDropElementClue = React.createRef();
+        this.columns = [];
         this.reorderable = false;
         this.groupable = false;
         this.startColumn = -1;

package/dist/es/drag/GroupingIndicator.js

@@ -23,6 +23,7 @@ var GroupingIndicator = /** @class */ (function (_super) {
     __extends(GroupingIndicator, _super);
     function GroupingIndicator() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.draggable = null;
         /**
          * @hidden
          */

package/dist/es/footer/FooterRow.d.ts

@@ -13,7 +13,7 @@ export interface FooterRowProps {
  */
 export declare class FooterRow extends React.Component<FooterRowProps, {}> {
     private _element;
-    get element(): HTMLTableRowElement;
+    get element(): HTMLTableRowElement | null;
     render(): JSX.Element;
     private renderCell;
 }

package/dist/es/header/FilterRow.js

@@ -44,7 +44,7 @@ var FilterRow = /** @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     FilterRow.prototype.headerCellClassName = function (field, locked) {
-        var result = "" + (locked ? 'k-grid-header-sticky' : '');
+        var result = "".concat(locked ? 'k-grid-header-sticky' : '');
         if (this.props.sort &&
             this.props.sort.filter(function (descriptor) { return descriptor.field === field; }).length > 0) {
             result += ' k-sorted';

package/dist/es/header/GridHeaderCell.d.ts

@@ -48,5 +48,5 @@ export declare class GridHeaderCell extends React.Component<GridHeaderCellProps,
     /**
      * @hidden
      */
-    render(): any;
+    render(): string | number | boolean | React.ReactFragment | JSX.Element | null | undefined;
 }

package/dist/es/header/GridHeaderSelectionCell.d.ts

@@ -5,5 +5,5 @@ import { GridHeaderCellProps } from '../interfaces/GridHeaderCellProps';
  */
 export declare class GridHeaderSelectionCell extends React.Component<GridHeaderCellProps> {
     private _inputId;
-    render(): any;
+    render(): string | number | boolean | React.ReactElement<any, string | React.JSXElementConstructor<any>> | React.ReactFragment | (JSX.Element | null | undefined)[] | null | undefined;
 }

package/dist/es/header/HeaderRow.d.ts

@@ -39,7 +39,7 @@ export declare class HeaderRow extends React.Component<HeaderRowProps, {}> {
     constructor(props: HeaderRowProps);
     cellClick(e: React.MouseEvent<HTMLSpanElement> | React.KeyboardEvent<HTMLElement>, column: GridColumnProps): void;
     cellKeyDown: (event: React.KeyboardEvent<HTMLElement>, column: GridColumnProps) => void;
-    sortIcon(sortIndex: number): JSX.Element[];
+    sortIcon(sortIndex: number): false | (false | JSX.Element)[] | null;
     render(): JSX.Element[];
     private cells;
 }

package/dist/es/interfaces/GridCellProps.d.ts

@@ -5,7 +5,7 @@ import { CellProps } from '@progress/kendo-react-data-tools';
  * Represents the props of the GridCell component
  * ([more information]({% slug cells_grid %}#toc-grid-cells)).
  */
-export interface GridCellProps extends CellProps {
+export interface GridCellProps extends Omit<CellProps, 'onChange' | 'render'> {
     /**
      * Zero-based index of the dataItem.
      */

package/dist/es/interfaces/GridColumnProps.d.ts

@@ -9,7 +9,7 @@ import { ColumnBaseProps } from '@progress/kendo-react-data-tools';
 /**
  * The props of the GridColumn component.
  */
-export interface GridColumnProps extends ColumnBaseProps {
+export interface GridColumnProps extends Omit<ColumnBaseProps, 'cell'> {
     /**
      * Allows the column headers to be clicked and the `sortChange` event emitted.
      * You have to handle the `sortChange` event yourself and sort the data.

package/dist/es/interfaces/GridHeaderCellProps.d.ts

@@ -5,7 +5,7 @@ import { GridColumnMenuWrapperProps } from '../columnMenu/GridColumnMenuWrapper'
  * The props of the GridHeaderCell component
  * ([more information]({% slug cells_grid %}#toc-header-cells)).
  */
-export interface GridHeaderCellProps extends HeaderCellBaseProps {
+export interface GridHeaderCellProps extends Omit<HeaderCellBaseProps, 'render'> {
     /**
      * A function for overriding the default rendering of the header cell.
      */

package/dist/es/interfaces/GridSortSettings.js

@@ -1,7 +1,11 @@
-var __spreadArray = (this && this.__spreadArray) || function (to, from) {
-    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
-        to[j] = from[i];
-    return to;
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
 };
 /**
  * @hidden
@@ -11,5 +15,5 @@ export var normalize = function () {
     for (var _i = 0; _i < arguments.length; _i++) {
         settings[_i] = arguments[_i];
     }
-    return Object.assign.apply(Object, __spreadArray([{ allowUnsort: true, mode: 'single' }], settings));
+    return Object.assign.apply(Object, __spreadArray([{ allowUnsort: true, mode: 'single' }], settings, false));
 };

package/dist/es/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-react-grid',
     productName: 'KendoReact',
     productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
-    publishDate: 1653648614,
+    publishDate: 1654762396,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
 };

package/dist/es/rows/GridRow.d.ts

@@ -7,5 +7,5 @@ export declare class GridRow extends React.Component<GridRowProps, {}> {
     /**
      * @hidden
      */
-    render(): any;
+    render(): string | number | boolean | React.ReactFragment | JSX.Element | null | undefined;
 }

package/dist/es/utils/index.js

@@ -92,8 +92,8 @@ var eventKeys = [
     'columnResize',
     'columnReorder'
 ];
-var deprecatedHandlerMessage = function (oldKey, newKey) { return ("The " + oldKey + " event handler property is deprecated, " +
-    ("use https://www.telerik.com/kendo-react-ui/components/grid/api/GridProps/#toc-" + newKey + " instead")); };
+var deprecatedHandlerMessage = function (oldKey, newKey) { return ("The ".concat(oldKey, " event handler property is deprecated, ") +
+    "use https://www.telerik.com/kendo-react-ui/components/grid/api/GridProps/#toc-".concat(newKey, " instead")); };
 /**
  * @hidden
  */
@@ -125,7 +125,7 @@ export function readColumns(elements, oldColumns, idInfo, depth) {
         var oldColumn = oldColumns[index] || null;
         var children = readColumns(columnProps.children, oldColumn && oldColumn.children || [], idInfo, depth + 1);
         columns.push(Object.assign({ depth: depth }, GridColumn.defaultProps, (children.length) ? { cell: function () { return null; }, filterCell: function () { return null; } } : {}, oldColumn ? { width: oldColumn.width, orderIndex: oldColumn.orderIndex } : {}, columnProps, {
-            id: columnProps.id ? columnProps.id : navigationTools.generateNavigatableId("" + idInfo.prevId++, idInfo.idPrefix, 'column'),
+            id: columnProps.id ? columnProps.id : navigationTools.generateNavigatableId("".concat(idInfo.prevId++), idInfo.idPrefix, 'column'),
             declarationIndex: columns.length,
             children: children,
             rowSpan: 0,
@@ -175,7 +175,7 @@ export function autoGenerateColumns(data, group, expandField, idInfo) {
         fields.forEach(function (field) {
             if (field !== expandField) {
                 columns.push(Object.assign({
-                    id: navigationTools.generateNavigatableId("" + idInfo.prevId++, idInfo.idPrefix, 'column'),
+                    id: navigationTools.generateNavigatableId("".concat(idInfo.prevId++), idInfo.idPrefix, 'column'),
                     declarationIndex: -1,
                     parentIndex: -1,
                     depth: 0,