@progress/kendo-react-grid 7.5.0-develop.13 → 7.5.0-develop.15

package/Grid.mjs

@@ -7,7 +7,7 @@
  */
 "use client";
 import * as r from "react";
-import i from "prop-types";
+import o from "prop-types";
 import { RowHeightService as re, dispatchEvent as Ge, canUseDOM as V, getActiveElement as Ke, memoizeOne as S, validatePackage as Oe, shouldShowValidationUI as Pe, setScrollbarWidth as ae, getter as Ve, classNames as F, kendoThemeMaps as G, WatermarkOverlay as Ue } from "@progress/kendo-react-common";
 import { tableKeyboardNavigation as x, getSelectionOptions as le, mapColumns as We, ClipboardService as Be, TableKeyboardNavigationContext as U, isRtl as $e, tableKeyboardNavigationTools as N, tableColumnsVirtualization as je, Pager as qe, tableKeyboardNavigationScopeAttributes as ne, TableSelection as he, tableKeyboardNavigationBodyAttributes as pe, DropClue as de, DragClue as ce, updateLeft as Xe, updateRight as Je } from "@progress/kendo-react-data-tools";
 import { GridSelectionCell as Qe } from "./cells/GridSelectionCell.mjs";
@@ -35,14 +35,14 @@ import { FooterRow as yt } from "./footer/FooterRow.mjs";
 import { normalize as wt } from "./paging/GridPagerSettings.mjs";
 import { packageMetadata as Re } from "./package-metadata.mjs";
 import { GridDetailCell as St } from "./cells/GridDetailCell.mjs";
-import { GridDetailHierarchyCell as kt } from "./cells/GridDetailHierarchyCell.mjs";
-import { SAFARI_REGEX as Et } from "./constants/index.mjs";
+import { GridDetailHierarchyCell as It } from "./cells/GridDetailHierarchyCell.mjs";
+import { SAFARI_REGEX as kt } from "./constants/index.mjs";
 const _ = class _ extends r.Component {
   constructor(a) {
     super(a), this._columns = [], this._columnsMap = [[]], this._columnsMutations = 0, this._resized = !1, this._shouldUpdateLeftRight = !0, this.contextStateRef = { current: void 0 }, this.navigationStateRef = { current: void 0 }, this._data = [], this._slicedData = void 0, this.wrapperScrollTop = 0, this.showLicenseWatermark = !1, this.headerRef = r.createRef(), this.headerElementRef = r.createRef(), this._element = null, this.tableElement = null, this.containerRef = r.createRef(), this.tableBodyRef = r.createRef(), this._footer = null, this.forceUpdateTimeout = void 0, this.isRtl = !1, this.headTable = null, this.observer = null, this.handleIntersection = (e) => {
       const t = { rowIndex: this.rowIndex };
-      e.forEach((o) => {
-        o.isIntersecting || this.setCurrentOnTop(t);
+      e.forEach((i) => {
+        i.isIntersecting || this.setCurrentOnTop(t);
       });
     }, this.setCurrentOnTop = (e) => {
       if (!this.vs.container || this.props.scrollable === "none")
@@ -52,35 +52,35 @@ const _ = class _ extends r.Component {
       if (this.props.scrollable === "virtual")
         this.vs.askedSkip = t, this.vs.container.scroll(0, Math.round(this.vs.askedSkip / this.vs.total * this.vs.container.scrollHeight));
       else if (this.element) {
-        const o = t < 1 ? this.element.querySelector("tbody > tr:nth-child(1)") : this.element.querySelector(`tbody > tr:nth-child(${t + 1})`);
-        o && this.containerRef.current && (this.containerRef.current.scrollTop = o.offsetTop);
+        const i = t < 1 ? this.element.querySelector("tbody > tr:nth-child(1)") : this.element.querySelector(`tbody > tr:nth-child(${t + 1})`);
+        i && this.containerRef.current && (this.containerRef.current.scrollTop = i.offsetTop);
       }
     }, this.scrollIntoView = (e) => {
       if (!this.vs.container || this.props.scrollable === "none")
         return;
       this.rowIndex = e.rowIndex;
-      const { rowIndex: t } = e, o = this.element;
-      if (this.observer && o) {
+      const { rowIndex: t } = e, i = this.element;
+      if (this.observer && i) {
         this.observer.disconnect();
-        const n = o.querySelector(`[absolute-row-index="${t}"]`);
+        const n = i.querySelector(`[absolute-row-index="${t}"]`);
         n ? this.observer.observe(n) : this.setCurrentOnTop(e);
       }
     }, this.fitColumns = (e) => {
       this.columnResize.dblClickHandler(null, e);
-    }, this.onContextMenu = (e, t, o) => {
+    }, this.onContextMenu = (e, t, i) => {
       if (this.props.onContextMenu) {
         const n = {
           target: this,
           syntheticEvent: e,
           nativeEvent: e.nativeEvent,
           dataItem: t,
-          field: o
+          field: i
         };
         this.props.onContextMenu.call(void 0, n);
       }
     }, this.getVirtualScroll = (e) => {
-      const { rowHeight: t, detailRowHeight: o, detail: n, expandField: h, groupable: l } = e, d = this.isAllData(), f = t !== void 0 && t > 0, R = o !== void 0 && o > 0, E = l === !0 || typeof l == "object" && l.enabled !== !1;
-      return !f || E && !d || !!(n && h) && (!R || !d) ? ht : ge;
+      const { rowHeight: t, detailRowHeight: i, detail: n, expandField: h, groupable: l } = e, d = this.isAllData(), f = t !== void 0 && t > 0, R = i !== void 0 && i > 0, k = l === !0 || typeof l == "object" && l.enabled !== !1;
+      return !f || k && !d || !!(n && h) && (!R || !d) ? ht : ge;
     }, this.isAllData = () => {
       const { data: e, total: t } = this.props;
       return Array.isArray(e) ? e.length === t : e ? t === e.total : !1;
@@ -93,14 +93,14 @@ const _ = class _ extends r.Component {
         this.props.sort,
         t || this.props.rowHeight === void 0 || this.props.rowHeight === 0
       ), this.vs.fixedScroll = this.props.fixedScroll || !1, this.vs.PageChange = this.pageChange, this.vs.realSkip = this.props.skip || 0, this.vs.pageSize = (this.props.take !== void 0 ? this.props.take : this.props.pageSize) || 0, this.vs.scrollableVirtual = this.props.scrollable === "virtual", this.vs.total = e, this.vs.propsSkip = (this.props.skip || 0) + (this.props.scrollable === "virtual" ? this.vs.topCacheCount + (this.vs.attendedSkip - (this.props.skip || 0)) : 0), this.props.rowHeight !== void 0 && this.props.rowHeight > 0 && !t) {
-        const o = this.props.rowHeight * e;
-        this.vs.containerHeight = me ? Math.min(fe, o) : o;
+        const i = this.props.rowHeight * e;
+        this.vs.containerHeight = me ? Math.min(fe, i) : i;
       } else
         this.vs.containerHeight = 1533915;
       if (this.vs.containerRef = this.containerRef, this.vs.tableBodyRef = this.tableBodyRef, this.vs.table = this.tableElement, this._slicedData = void 0, this.vs instanceof ge) {
-        const { rowHeight: o = 0, detail: n, expandField: h } = this.props;
+        const { rowHeight: i = 0, detail: n, expandField: h } = this.props;
         let { detailRowHeight: l = 0 } = this.props;
-        l = n && h ? l : o, this.isAllData() ? (this.vs.total = this._data.length, this._slicedData = this._data.slice(this.vs.realSkip, this.vs.realSkip + this.vs.pageSize), this.vs.rowHeightService = this.rowHeightService(this.vs, this._data.length, o, l, this._data)) : this.vs.rowHeightService = new re(e, o, l);
+        l = n && h ? l : i, this.isAllData() ? (this.vs.total = this._data.length, this._slicedData = this._data.slice(this.vs.realSkip, this.vs.realSkip + this.vs.pageSize), this.vs.rowHeightService = this.rowHeightService(this.vs, this._data.length, i, l, this._data)) : this.vs.rowHeightService = new re(e, i, l);
         const d = this.vs.rowHeightService.totalHeight();
         this.vs.containerHeight = me ? Math.min(fe, d) : d;
       }
@@ -108,20 +108,20 @@ const _ = class _ extends r.Component {
       if (e.target !== e.currentTarget)
         return;
       clearTimeout(this.forceUpdateTimeout), this.vs.table = this.tableElement;
-      const t = e.currentTarget.scrollLeft, o = e.currentTarget.scrollTop;
-      this.props.columnVirtualization && (!this.vs.scrollableVirtual || o === this.wrapperScrollTop) && (this.forceUpdateTimeout = window.setTimeout(() => {
+      const t = e.currentTarget.scrollLeft, i = e.currentTarget.scrollTop;
+      this.props.columnVirtualization && (!this.vs.scrollableVirtual || i === this.wrapperScrollTop) && (this.forceUpdateTimeout = window.setTimeout(() => {
         this.forceUpdate();
-      }, 0)), this._header && this._header.setScrollLeft(t), this._footer && this._footer.setScrollLeft(t), this.vs && o !== this.wrapperScrollTop && this.vs.scrollHandler(e), Ge(this.props.onScroll, e, this, void 0), this.wrapperScrollTop = o;
+      }, 0)), this._header && this._header.setScrollLeft(t), this._footer && this._footer.setScrollLeft(t), this.vs && i !== this.wrapperScrollTop && this.vs.scrollHandler(e), Ge(this.props.onScroll, e, this, void 0), this.wrapperScrollTop = i;
     }, this.onKeyDown = (e) => {
       if (x.onKeyDown(e, {
         contextStateRef: this.contextStateRef,
         navigationStateRef: this.navigationStateRef,
         onNavigationAction: this.onNavigationAction
       }), this.props.onKeyDown) {
-        const { mode: t, cell: o } = le(this.props.selectable), n = {
+        const { mode: t, cell: i } = le(this.props.selectable), n = {
           dataItems: this.getLeafDataItems(),
           mode: t,
-          cell: o,
+          cell: i,
           componentId: this._gridId,
           selectedField: this.props.selectedField,
           ...this.getArguments(e)
@@ -159,8 +159,8 @@ const _ = class _ extends r.Component {
     }, this.itemChange = (e) => {
       const t = this.props.onItemChange;
       if (e.field === this.props.expandField || this.props.group && e.field === void 0) {
-        const o = this.props.onExpandChange;
-        o && o.call(
+        const i = this.props.onExpandChange;
+        i && i.call(
           void 0,
           {
             ...this.getArguments(e.syntheticEvent),
@@ -194,24 +194,26 @@ const _ = class _ extends r.Component {
       );
     }, this.selectionRelease = (e) => {
       if (this.props.onSelectionChange) {
-        const t = {
+        const t = this.getSlicedLeafDataItems()[e.startRowIndex], i = this.getSlicedLeafDataItems()[e.endRowIndex], n = {
           syntheticEvent: void 0,
           target: this,
           selectedField: this.props.selectedField || "",
           componentId: this._gridId,
           dataItems: this.getLeafDataItems(),
           dataItem: null,
+          startDataItem: t,
+          endDataItem: i,
           ...e
         };
-        this.props.onSelectionChange.call(void 0, t);
+        this.props.onSelectionChange.call(void 0, n);
       }
-    }, this.pageChange = (e, t, o) => {
+    }, this.pageChange = (e, t, i) => {
       this.raiseDataEvent(
         this.props.onPageChange,
         { page: e },
         { skip: e.skip, take: e.take },
         t,
-        o
+        i
       );
     }, this.pagerPageChange = (e) => {
       this.pageChange({ skip: e.skip, take: e.take }, e.syntheticEvent, e.targetEvent);
@@ -230,12 +232,12 @@ const _ = class _ extends r.Component {
         t
       );
     }, this.groupChange = (e, t) => {
-      const o = t.nativeEvent ? t : { nativeEvent: t.nativeEvent || t.originalEvent };
+      const i = t.nativeEvent ? t : { nativeEvent: t.nativeEvent || t.originalEvent };
       this.raiseDataEvent(
         this.props.onGroupChange,
         { group: e },
         { group: e, skip: 0 },
-        o
+        i
       );
     }, this.onClipboard = (e, t) => {
       if (this.props.onClipboard) {
@@ -256,9 +258,9 @@ const _ = class _ extends r.Component {
       var h, l, d;
       if (!V)
         return !1;
-      const e = Ke(this.document), t = e ? e.matches(".k-table-td") ? e : (h = this.document) == null ? void 0 : h.body : (l = this.document) == null ? void 0 : l.body, o = t.closest(".k-grid-container"), n = t && ((d = this._element) == null ? void 0 : d.contains(t));
-      return !!(t && n && o);
-    }, this.onResize = (e, t, o, n, h, l) => {
+      const e = Ke(this.document), t = e ? e.matches(".k-table-td") ? e : (h = this.document) == null ? void 0 : h.body : (l = this.document) == null ? void 0 : l.body, i = t.closest(".k-grid-container"), n = t && ((d = this._element) == null ? void 0 : d.contains(t));
+      return !!(t && n && i);
+    }, this.onResize = (e, t, i, n, h, l) => {
       this.resetTableWidth(), this._shouldUpdateLeftRight = !0, this._resized = !0, this._columnsMutations++, this.props.onColumnResize && this.props.onColumnResize.call(
         void 0,
         {
@@ -267,33 +269,33 @@ const _ = class _ extends r.Component {
           targetColumnId: l,
           index: e,
           newWidth: t,
-          oldWidth: o,
+          oldWidth: i,
           end: h,
           target: this
         }
       );
-    }, this.reInitVirtualization = S((e, t, o, n, h, l) => {
+    }, this.reInitVirtualization = S((e, t, i, n, h, l) => {
       this.vs.reset();
       const d = this.getVirtualScroll(this.props);
       this.vs = new d(l);
-    }), this.flatData = S((e, t, o, n, h, l, d) => {
+    }), this.flatData = S((e, t, i, n, h, l, d) => {
       const f = [], R = ct(
         f,
         e,
         t,
-        { index: o },
+        { index: i },
         n !== void 0,
         h
       );
       return { flattedData: f, resolvedGroupsCount: R };
-    }), this.rowHeightService = S((e, t, o, n, h) => new re(t, o, n, h)), this.childrenToArray = S((e) => r.Children.toArray(e)), this.readColumns = S(
-      (e, t, o) => {
+    }), this.rowHeightService = S((e, t, i, n, h) => new re(t, i, n, h)), this.childrenToArray = S((e) => r.Children.toArray(e)), this.readColumns = S(
+      (e, t, i) => {
         const n = e.filter((h) => h && h.type && h.type.displayName === "KendoReactGridColumn");
         return ut(n, this.columns, { prevId: 0, idPrefix: t });
       }
     ), this.mapColumns = S(
       (e, t) => We(e, t)
-    ), this.configureColumns = S((e, t, o) => {
+    ), this.configureColumns = S((e, t, i) => {
       this.props.selectedField && e.filter((l) => l.field === this.props.selectedField).forEach((l) => {
         l.width = l.width || "50px", l.cell = l.cell || Qe, l.headerCell = l.headerCell || Ct;
       });
@@ -332,14 +334,14 @@ const _ = class _ extends r.Component {
           locked: this.props.lockGroups
         }), h++;
       e.slice(h).forEach((l) => l.parentIndex >= 0 && (l.parentIndex += h));
-    }), this.getHeaderRow = S((e, t, o, n, h, l, d, f, R, E, z, C) => /* @__PURE__ */ r.createElement(
+    }), this.getHeaderRow = S((e, t, i, n, h, l, d, f, R, k, z, C) => /* @__PURE__ */ r.createElement(
       tt,
       {
         cells: this.props.cells,
         sort: e,
         sortable: t,
         sortChange: this.sortChange,
-        group: o || [],
+        group: i || [],
         groupable: n,
         groupChange: this.groupChange,
         filter: h,
@@ -348,7 +350,7 @@ const _ = class _ extends r.Component {
         filterChange: this.filterChange,
         columnMenu: R,
         selectionChange: this.onHeaderSelectionChange,
-        columns: E,
+        columns: k,
         columnResize: this.columnResize,
         pressHandler: this.dragLogic.pressHandler,
         dragHandler: this.dragLogic.dragHandler,
@@ -363,9 +365,9 @@ const _ = class _ extends r.Component {
         columnGroupChange: this.columnGroupChange
       }
     )), this.resolveTitle = (e) => {
-      const t = this._columns.find((n) => n.field === e), o = t && (t.title || t.field);
-      return o === void 0 ? e : o;
-    }, this.getLeafDataItems = () => this._data.filter((e) => e.rowType === "data").map((e) => e.dataItem), Oe(Re), this.showLicenseWatermark = Pe(Re);
+      const t = this._columns.find((n) => n.field === e), i = t && (t.title || t.field);
+      return i === void 0 ? e : i;
+    }, this.getLeafDataItems = () => this._data.filter((e) => e.rowType === "data").map((e) => e.dataItem), this.getSlicedLeafDataItems = () => (this._slicedData || this._data).filter((e) => e.rowType === "data").map((e) => e.dataItem), Oe(Re), this.showLicenseWatermark = Pe(Re);
     const p = this.props.groupable === !0 || typeof this.props.groupable == "object" && this.props.groupable.enabled !== !1, c = this.getVirtualScroll(a);
     this.vs = new c(p || a.rowHeight === void 0 || a.rowHeight === 0), this.dragLogic = new dt(
       this.columnReorder.bind(this),
@@ -442,7 +444,7 @@ const _ = class _ extends r.Component {
    * @hidden
    */
   componentDidMount() {
-    navigator.userAgent.match(Et) || (this.headTable && (this.headTable.style.display = "block"), this.tableElement && (this.tableElement.style.display = "block")), this.resetTableWidth(), ae();
+    navigator.userAgent.match(kt) || (this.headTable && (this.headTable.style.display = "block"), this.tableElement && (this.tableElement.style.display = "block")), this.resetTableWidth(), ae();
     const a = $e(this.element);
     this.isRtl = a, x.onComponentDidMount({
       scope: this.element || void 0,
@@ -490,7 +492,7 @@ const _ = class _ extends r.Component {
     const p = N.getIdPrefix(this.navigationStateRef), c = rt(this);
     let e = [];
     Array.isArray(this.props.data) ? (e = this.props.data, a = a || this.props.data.length) : this.props.data && (e = this.props.data.data, a = a || this.props.data.total);
-    const t = typeof this.props.groupable == "object" && this.props.groupable.footer || "none", o = this.props.scrollable === "virtual", { resolvedGroupsCount: n, flattedData: h } = this.flatData(
+    const t = typeof this.props.groupable == "object" && this.props.groupable.footer || "none", i = this.props.scrollable === "virtual", { resolvedGroupsCount: n, flattedData: h } = this.flatData(
       e,
       t,
       this.props.skip || 0,
@@ -506,7 +508,7 @@ const _ = class _ extends r.Component {
     this.initializeVirtualization(a, l);
     const f = this.childrenToArray(this.props.children);
     this.initColumns(f, n);
-    const R = f.map((s) => s && s.type && s.type.displayName === "KendoReactGridToolbar" ? r.cloneElement(s, { ...s.props, ariaControls: this._gridId }) : null), E = f.filter((s) => s && s.type && s.type.displayName === "KendoReactGridNoRecords"), z = f.filter((s) => s && s.type && s.type.displayName === "KendoReactGridStatusBar"), C = this._columns.filter((s) => s.children.length === 0), $ = l && /* @__PURE__ */ r.createElement(
+    const R = f.map((s) => s && s.type && s.type.displayName === "KendoReactGridToolbar" ? r.cloneElement(s, { ...s.props, ariaControls: this._gridId }) : null), k = f.filter((s) => s && s.type && s.type.displayName === "KendoReactGridNoRecords"), z = f.filter((s) => s && s.type && s.type.displayName === "KendoReactGridStatusBar"), C = this._columns.filter((s) => s.children.length === 0), $ = l && /* @__PURE__ */ r.createElement(
       it,
       {
         group: this.props.group || [],
@@ -519,7 +521,7 @@ const _ = class _ extends r.Component {
         ariaControls: this._gridId,
         onContextMenu: this.onContextMenu
       }
-    ), { sort: ye, sortable: we, group: Se, filter: ke, filterable: Ee, filterOperators: Ie = Ce, headerCellRender: xe, columnMenu: _e } = this.props, j = /* @__PURE__ */ r.createElement(
+    ), { sort: ye, sortable: we, group: Se, filter: Ie, filterable: ke, filterOperators: Ee = Ce, headerCellRender: xe, columnMenu: _e } = this.props, j = /* @__PURE__ */ r.createElement(
       et,
       {
         size: this.props.size,
@@ -534,9 +536,9 @@ const _ = class _ extends r.Component {
           we,
           Se,
           l,
+          Ie,
           ke,
           Ee,
-          Ie,
           xe,
           _e,
           this._columns,
@@ -572,8 +574,8 @@ const _ = class _ extends r.Component {
       tableViewPortWidth: De,
       scrollLeft: ze
     }), Le = (s, g, m) => {
-      let I = !1;
-      const k = this.props.selectedField ? be(this.props.selectedField, s.dataItem) : void 0;
+      let E = !1;
+      const I = this.props.selectedField ? be(this.props.selectedField, s.dataItem) : void 0;
       return {
         row: C.map((u, b) => {
           if (Te[b])
@@ -582,7 +584,7 @@ const _ = class _ extends r.Component {
           let w = !1;
           if (u.editable && this.props.editField) {
             const v = be(this.props.editField, s.dataItem);
-            v && (v === !0 || v === u.field) && (I = !0, w = !0);
+            v && (v === !0 || v === u.field) && (E = !0, w = !0);
           }
           const P = u.cell || w && Ze || bt, L = this.props.expandField && this.props.detail && u.field === this.props.expandField;
           return /* @__PURE__ */ r.createElement(
@@ -616,16 +618,16 @@ const _ = class _ extends r.Component {
               dataIndex: s.dataIndex,
               style: y,
               ariaColumnIndex: u.ariaColumnIndex,
-              isSelected: Array.isArray(k) && k.indexOf(b) > -1
+              isSelected: Array.isArray(I) && I.indexOf(b) > -1
             }
           );
         }),
-        isInEdit: I,
-        isSelected: typeof k == "boolean" && k
+        isInEdit: E,
+        isSelected: typeof I == "boolean" && I
       };
     };
     let q = 0;
-    if (o)
+    if (i)
       for (let s = 0; s < this.vs.topCacheCount + this.vs.attendedSkip - (this.props.skip || 0); s++) {
         const g = this._data.shift();
         if (g)
@@ -641,18 +643,18 @@ const _ = class _ extends r.Component {
     let D = 0;
     if (this._data.length) {
       let s = -1, g = 0;
-      (this._slicedData || this._data).forEach((m, I) => {
+      (this._slicedData || this._data).forEach((m, E) => {
         m.rowType === "data" && (J++, s++);
-        const k = J % 2 === 0, u = this.props.dataItemKey && Ve(this.props.dataItemKey)(m.dataItem), b = I + (this.vs.realSkip || 0), H = u || "ai" + b, T = H + "_1", y = Le(m, H, s);
+        const I = J % 2 === 0, u = this.props.dataItemKey && Ve(this.props.dataItemKey)(m.dataItem), b = E + (this.vs.realSkip || 0), H = u || "ai" + b, T = H + "_1", y = Le(m, H, s);
         if (D = b + O + g, A.push(/* @__PURE__ */ r.createElement(
           vt,
           {
             key: H,
             dataItem: m.dataItem,
-            isAltRow: k,
+            isAltRow: I,
             isInEdit: y.isInEdit,
             rowType: m.rowType,
-            isHidden: X(I),
+            isHidden: X(E),
             onClick: (w) => this.rowClick(w, m),
             onDoubleClick: (w) => this.rowDblClick(w, m),
             selectedField: this.props.selectedField,
@@ -672,9 +674,9 @@ const _ = class _ extends r.Component {
               key: T,
               className: F(
                 "k-table-row",
-                k ? "k-detail-row k-table-alt-row k-alt" : "k-detail-row"
+                I ? "k-detail-row k-table-alt-row k-alt" : "k-detail-row"
               ),
-              style: { visibility: X(I) ? "hidden" : "", height: this.props.detailRowHeight },
+              style: { visibility: X(E) ? "hidden" : "", height: this.props.detailRowHeight },
               role: "row",
               "aria-rowindex": D
             },
@@ -699,7 +701,7 @@ const _ = class _ extends r.Component {
               );
             }),
             this.props.expandField && /* @__PURE__ */ r.createElement(
-              kt,
+              It,
               {
                 id: N.generateNavigatableId(`${T}-dhcell`, p)
               }
@@ -724,7 +726,7 @@ const _ = class _ extends r.Component {
     const Fe = () => {
       const s = this._header;
       return s && s.table.clientWidth;
-    }, Q = () => /* @__PURE__ */ r.createElement("div", { key: "no-records", className: "k-grid-norecords", "aria-rowindex": O, style: { width: Fe() } }, /* @__PURE__ */ r.createElement("div", { className: "k-grid-norecords-template" }, E.length ? E : /* @__PURE__ */ r.createElement(Rt, null))), Y = {
+    }, Q = () => /* @__PURE__ */ r.createElement("div", { key: "no-records", className: "k-grid-norecords", "aria-rowindex": O, style: { width: Fe() } }, /* @__PURE__ */ r.createElement("div", { className: "k-grid-norecords-template" }, k.length ? k : /* @__PURE__ */ r.createElement(Rt, null))), Y = {
       size: this.props.size,
       onPageChange: this.pagerPageChange,
       total: a,
@@ -833,7 +835,7 @@ const _ = class _ extends r.Component {
         se && /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(de, { ref: this.dragLogic.refDropElementClue }), /* @__PURE__ */ r.createElement(ce, { ref: this.dragLogic.refDragElementClue }))
       ), z, this.props.pageable && Z);
     let M = this.props.style || {};
-    return o && (M.height || (M = Object.assign({}, M, { height: "450px" }))), /* @__PURE__ */ r.createElement(U.Provider, { value: this.contextStateRef.current }, /* @__PURE__ */ r.createElement(
+    return i && (M.height || (M = Object.assign({}, M, { height: "450px" }))), /* @__PURE__ */ r.createElement(U.Provider, { value: this.contextStateRef.current }, /* @__PURE__ */ r.createElement(
       "div",
       {
         id: this.props.id,
@@ -843,7 +845,7 @@ const _ = class _ extends r.Component {
           {
             "k-grid-md": !this.props.size,
             [`k-grid-${G.sizeMap[this.props.size] || this.props.size}`]: this.props.size,
-            "k-grid-virtual": o
+            "k-grid-virtual": i
           },
           this.props.className
         ),
@@ -912,10 +914,10 @@ const _ = class _ extends r.Component {
               )
             )
           ), K && Q()),
-          o && /* @__PURE__ */ r.createElement("div", { className: "k-height-container", role: "presentation" }, /* @__PURE__ */ r.createElement(
+          i && /* @__PURE__ */ r.createElement("div", { className: "k-height-container", role: "presentation" }, /* @__PURE__ */ r.createElement(
             "div",
             {
-              style: o ? { height: this.vs.containerHeight + "px" } : {}
+              style: i ? { height: this.vs.containerHeight + "px" } : {}
             }
           ))
         )),
@@ -929,7 +931,7 @@ const _ = class _ extends r.Component {
   }
   selectionChange(a) {
     if (this.props.onSelectionChange) {
-      const { event: p, dataItem: c, dataIndex: e, columnIndex: t } = a, { mode: o, cell: n } = le(this.props.selectable), h = {
+      const { event: p, dataItem: c, dataIndex: e, columnIndex: t } = a, { mode: i, cell: n } = le(this.props.selectable), h = {
         ...this.getArguments(p.syntheticEvent),
         dataItem: c,
         startColIndex: t,
@@ -941,7 +943,7 @@ const _ = class _ extends r.Component {
         ctrlKey: !1,
         shiftKey: !1,
         metaKey: !1,
-        mode: o,
+        mode: i,
         cell: n,
         isDrag: !1,
         componentId: this._gridId,
@@ -951,12 +953,12 @@ const _ = class _ extends r.Component {
     }
   }
   raiseDataEvent(a, p, c, e, t) {
-    const o = this.props.onDataStateChange;
+    const i = this.props.onDataStateChange;
     if (a) {
       const n = { ...this.getArguments(e), ...p, targetEvent: t };
       a.call(void 0, n);
     } else
-      o && o.call(
+      i && i.call(
         void 0,
         {
           ...this.getArguments(e),
@@ -969,13 +971,13 @@ const _ = class _ extends r.Component {
       );
   }
   columnReorder(a, p, c) {
-    const e = this._columns[a], t = e.depth, o = (d) => {
+    const e = this._columns[a], t = e.depth, i = (d) => {
       do
         d++;
       while (d < this._columns.length && this._columns[d].depth > t);
       return d;
-    }, n = this._columns.splice(a, o(a) - a);
-    this._columns.splice(a < p ? o(p - n.length) : p, 0, ...n), this._columns.filter((d) => d.declarationIndex >= 0).forEach((d, f) => d.orderIndex = f), this._columnsMutations++;
+    }, n = this._columns.splice(a, i(a) - a);
+    this._columns.splice(a < p ? i(p - n.length) : p, 0, ...n), this._columns.filter((d) => d.declarationIndex >= 0).forEach((d, f) => d.orderIndex = f), this._columnsMutations++;
     const h = this._columns[a].locked && this._columns[p].locked;
     Xe(this._columnsMap, this._columns, h || this._shouldUpdateLeftRight), Je(this._columnsMap, this._columns, h || this._shouldUpdateLeftRight), this._resized && (this._shouldUpdateLeftRight = !1, this._resized = !1);
     const l = this.columns;
@@ -1043,81 +1045,81 @@ const _ = class _ extends r.Component {
 _.displayName = "KendoReactGrid", _.defaultProps = {
   // never use this
 }, _.propTypes = {
-  data: i.oneOfType([
-    i.array,
-    i.shape({
-      data: i.array,
-      total: i.number
+  data: o.oneOfType([
+    o.array,
+    o.shape({
+      data: o.array,
+      total: o.number
     })
   ]),
-  sortable: i.oneOfType([
-    i.bool,
-    i.shape({
-      mode: i.oneOf(["single", "multiple"]),
-      allowUnsort: i.bool
+  sortable: o.oneOfType([
+    o.bool,
+    o.shape({
+      mode: o.oneOf(["single", "multiple"]),
+      allowUnsort: o.bool
     })
   ]),
-  onSortChange: i.func,
-  sort: i.array,
-  filterable: i.bool,
-  filter: i.any,
-  onFilterChange: i.func,
-  pageable: i.oneOfType([
-    i.bool,
-    i.shape({
-      buttonCount: i.number,
-      responsive: i.bool,
-      info: i.bool,
-      type: i.oneOf(["numeric", "input"]),
-      pageSizes: i.oneOfType(
+  onSortChange: o.func,
+  sort: o.array,
+  filterable: o.bool,
+  filter: o.any,
+  onFilterChange: o.func,
+  pageable: o.oneOfType([
+    o.bool,
+    o.shape({
+      buttonCount: o.number,
+      responsive: o.bool,
+      info: o.bool,
+      type: o.oneOf(["numeric", "input"]),
+      pageSizes: o.oneOfType(
         [
-          i.bool,
-          i.arrayOf(i.oneOfType([
-            i.string,
-            i.number
+          o.bool,
+          o.arrayOf(o.oneOfType([
+            o.string,
+            o.number
           ]))
         ]
       ),
-      previousNext: i.bool
+      previousNext: o.bool
     })
   ]),
-  pageSize: i.number,
-  onPageChange: i.func,
-  total: i.number,
-  skip: i.number,
-  take: i.number,
-  fixedScroll: i.bool,
-  onExpandChange: i.func,
-  expandField: i.string,
-  selectedField: i.string,
-  onSelectionChange: i.func,
-  onHeaderSelectionChange: i.func,
-  resizable: i.bool,
-  reorderable: i.bool,
-  group: i.any,
-  groupable: i.oneOfType([
-    i.bool,
-    i.shape({
-      enabled: i.bool,
-      footer: i.oneOf(["always", "visible", "none"])
+  pageSize: o.number,
+  onPageChange: o.func,
+  total: o.number,
+  skip: o.number,
+  take: o.number,
+  fixedScroll: o.bool,
+  onExpandChange: o.func,
+  expandField: o.string,
+  selectedField: o.string,
+  onSelectionChange: o.func,
+  onHeaderSelectionChange: o.func,
+  resizable: o.bool,
+  reorderable: o.bool,
+  group: o.any,
+  groupable: o.oneOfType([
+    o.bool,
+    o.shape({
+      enabled: o.bool,
+      footer: o.oneOf(["always", "visible", "none"])
     })
   ]),
-  onGroupChange: i.func,
-  onRowClick: i.func,
-  onRowDoubleClick: i.func,
-  onItemChange: i.func,
-  editField: i.string,
-  scrollable: i.oneOf(["none", "scrollable", "virtual"]),
-  rowHeight: i.number,
-  detailRowHeight: i.number,
-  detail: i.any,
-  style: i.object,
-  onDataStateChange: i.func,
-  onColumnResize: i.func,
-  onColumnReorder: i.func,
-  dataItemKey: i.string,
-  navigatable: i.bool,
-  size: i.oneOf(["small", "medium"])
+  onGroupChange: o.func,
+  onRowClick: o.func,
+  onRowDoubleClick: o.func,
+  onItemChange: o.func,
+  editField: o.string,
+  scrollable: o.oneOf(["none", "scrollable", "virtual"]),
+  rowHeight: o.number,
+  detailRowHeight: o.number,
+  detail: o.any,
+  style: o.object,
+  onDataStateChange: o.func,
+  onColumnResize: o.func,
+  onColumnReorder: o.func,
+  dataItemKey: o.string,
+  navigatable: o.bool,
+  size: o.oneOf(["small", "medium"])
 }, _.contextType = U;
 let B = _;
 at(B);