@progress/kendo-react-grid 8.3.0-develop.9 → 8.4.0-develop.1

package/Grid.mjs

@@ -50,7 +50,10 @@ const H = class H extends r.Component {
       this.observer && this.observer.disconnect();
       const { rowIndex: t } = e;
       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));
+        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 s = t < 1 ? this.element.querySelector("tbody > tr:nth-child(1)") : this.element.querySelector(`tbody > tr:nth-child(${t + 1})`);
         s && this.containerRef.current && (this.containerRef.current.scrollTop = s.offsetTop);
@@ -103,7 +106,13 @@ const H = class H extends r.Component {
       if (this.vs.containerRef = this.containerRef, this.vs.tableBodyRef = this.tableBodyRef, this.vs.table = this.tableElement, this._slicedData = void 0, this.vs instanceof ve) {
         const { rowHeight: s = 0, detail: l, expandField: d } = this.props;
         let { detailRowHeight: p = 0 } = this.props;
-        p = l && d ? p : s, 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, s, p, this._data)) : this.vs.rowHeightService = new ne(e, s, p);
+        p = l && d ? p : s, 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,
+          s,
+          p,
+          this._data
+        )) : this.vs.rowHeightService = new ne(e, s, p);
         const h = this.vs.rowHeightService.totalHeight();
         this.vs.containerHeight = Ce ? Math.min(Re, h) : h;
       }
@@ -155,57 +164,43 @@ const H = class H extends r.Component {
         this.props.onNavigationAction.call(void 0, t);
       }
     }, this.rowClick = (e, t) => {
-      this.props.onRowClick && e.target.nodeName === "TD" && this.props.onRowClick.call(
-        void 0,
-        {
-          dataItem: t.dataItem,
-          ...this.getArguments(e)
-        }
-      );
+      this.props.onRowClick && e.target.nodeName === "TD" && this.props.onRowClick.call(void 0, {
+        dataItem: t.dataItem,
+        ...this.getArguments(e)
+      });
     }, this.rowDblClick = (e, t) => {
-      this.props.onRowDoubleClick && e.target.nodeName === "TD" && this.props.onRowDoubleClick.call(
-        void 0,
-        {
-          dataItem: t.dataItem,
-          ...this.getArguments(e)
-        }
-      );
+      this.props.onRowDoubleClick && e.target.nodeName === "TD" && this.props.onRowDoubleClick.call(void 0, {
+        dataItem: t.dataItem,
+        ...this.getArguments(e)
+      });
     }, this.itemChange = (e) => {
       const t = this.props.onItemChange;
       if (e.field === this.props.expandField || this.props.group && e.field === void 0) {
         const s = this.props.onExpandChange;
-        s && s.call(
-          void 0,
-          {
-            ...this.getArguments(e.syntheticEvent),
-            dataItem: e.dataItem,
-            dataIndex: e.dataIndex,
-            value: e.value
-          }
-        );
-        return;
-      }
-      t && t.call(
-        void 0,
-        {
+        s && s.call(void 0, {
           ...this.getArguments(e.syntheticEvent),
           dataItem: e.dataItem,
-          field: e.field,
+          dataIndex: e.dataIndex,
           value: e.value
-        }
-      );
+        });
+        return;
+      }
+      t && t.call(void 0, {
+        ...this.getArguments(e.syntheticEvent),
+        dataItem: e.dataItem,
+        dataIndex: e.dataIndex,
+        field: e.field,
+        value: e.value
+      });
     }, this.onHeaderSelectionChange = (e) => {
-      this.props.onHeaderSelectionChange && this.props.onHeaderSelectionChange.call(
-        void 0,
-        {
-          field: e.field,
-          nativeEvent: e.syntheticEvent && e.syntheticEvent.nativeEvent,
-          syntheticEvent: e.syntheticEvent,
-          target: this,
-          dataItems: this.getLeafDataItems(),
-          selectedField: this.props.selectedField
-        }
-      );
+      this.props.onHeaderSelectionChange && this.props.onHeaderSelectionChange.call(void 0, {
+        field: e.field,
+        nativeEvent: e.syntheticEvent && e.syntheticEvent.nativeEvent,
+        syntheticEvent: e.syntheticEvent,
+        target: this,
+        dataItems: this.getLeafDataItems(),
+        selectedField: this.props.selectedField
+      });
     }, this.selectionRelease = (e) => {
       if (this.props.onSelectionChange) {
         const t = this.getSlicedLeafDataItems()[e.startRowIndex], s = this.getSlicedLeafDataItems()[e.endRowIndex], l = {
@@ -266,16 +261,13 @@ const H = class H extends r.Component {
       if (this.props.onClipboard) {
         if (!this.inActiveElement() || !e)
           return;
-        this.props.onClipboard.call(
-          void 0,
-          {
-            type: e,
-            nativeEvent: t,
-            columns: this._columns,
-            dataItemKey: this.props.dataItemKey || "",
-            ...typeof this.props.clipboard != "boolean" ? this.props.clipboard : {}
-          }
-        );
+        this.props.onClipboard.call(void 0, {
+          type: e,
+          nativeEvent: t,
+          columns: this._columns,
+          dataItemKey: this.props.dataItemKey || "",
+          ...typeof this.props.clipboard != "boolean" ? this.props.clipboard : {}
+        });
       }
     }, this.inActiveElement = () => {
       var d, p, h;
@@ -284,24 +276,23 @@ const H = class H extends r.Component {
       const e = Ve(this.document), t = e ? e.matches(".k-table-td") ? e : (d = this.document) == null ? void 0 : d.body : (p = this.document) == null ? void 0 : p.body, s = t.closest(".k-grid-container"), l = t && ((h = this._element) == null ? void 0 : h.contains(t));
       return !!(t && l && s);
     }, this.onResize = (e, t, s, l, d, p) => {
-      this.resetTableWidth(), this._shouldUpdateLeftRight = !0, this._resized = !0, this._columnsMutations++, this.props.onColumnResize && this.props.onColumnResize.call(
-        void 0,
-        {
-          columns: this.columns,
-          nativeEvent: l,
-          targetColumnId: p,
-          index: e,
-          newWidth: t,
-          oldWidth: s,
-          end: d,
-          target: this
-        }
-      );
-    }, this.reInitVirtualization = y((e, t, s, l, d, p) => {
-      this.vs.reset();
-      const h = this.getVirtualScroll(this.props);
-      this.vs = new h(p);
-    }), this.flatData = y((e, t, s, l, d, p, h) => {
+      this.resetTableWidth(), this._shouldUpdateLeftRight = !0, this._resized = !0, this._columnsMutations++, this.props.onColumnResize && this.props.onColumnResize.call(void 0, {
+        columns: this.columns,
+        nativeEvent: l,
+        targetColumnId: p,
+        index: e,
+        newWidth: t,
+        oldWidth: s,
+        end: d,
+        target: this
+      });
+    }, this.reInitVirtualization = y(
+      (e, t, s, l, d, p) => {
+        this.vs.reset();
+        const h = this.getVirtualScroll(this.props);
+        this.vs = new h(p);
+      }
+    ), this.flatData = y((e, t, s, l, d, p, h) => {
       const g = [], v = vt(
         g,
         e,
@@ -311,14 +302,14 @@ const H = class H extends r.Component {
         d
       );
       return { flattedData: g, resolvedGroupsCount: v };
-    }), this.rowHeightService = y((e, t, s, l, d) => new ne(t, s, l, d)), this.childrenToArray = y((e) => r.Children.toArray(e)), this.readColumns = y(
-      (e, t, s) => {
-        const l = e.filter((d) => d && d.type && d.type.displayName === "KendoReactGridColumn");
-        return Ct(l, this.columns, { prevId: 0, idPrefix: t });
-      }
-    ), this.mapColumns = y(
-      (e, t) => Je(e, !0)
-    ), this.filterColumnsByMediaProp = (e) => e.filter((t) => M && t && t.media ? window.matchMedia(t.media).matches : t), this.configureColumns = y((e, t, s) => {
+    }), this.rowHeightService = y(
+      (e, t, s, l, d) => new ne(t, s, l, d)
+    ), this.childrenToArray = y((e) => r.Children.toArray(e)), this.readColumns = y((e, t, s) => {
+      const l = e.filter(
+        (d) => d && d.type && d.type.displayName === "KendoReactGridColumn"
+      );
+      return Ct(l, this.columns, { prevId: 0, idPrefix: t });
+    }), this.mapColumns = y((e, t) => Je(e, !0)), this.filterColumnsByMediaProp = (e) => e.filter((t) => M && t && t.media ? window.matchMedia(t.media).matches : t), this.configureColumns = y((e, t, s) => {
       this.props.selectedField && e.filter((g) => g.field === this.props.selectedField).forEach((g) => {
         g.width = g.width || "50px", g.cell = g.cell || it, g.headerCell = g.headerCell || It;
       });
@@ -357,38 +348,40 @@ const H = class H extends r.Component {
           locked: this.props.lockGroups
         }), h++;
       e.slice(h).forEach((g) => g.parentIndex >= 0 && (g.parentIndex += h));
-    }), this.getHeaderRow = y((e, t, s, l, d, p, h, g, v, z, E, G, O) => /* @__PURE__ */ r.createElement(
-      lt,
-      {
-        cells: this.props.cells,
-        sort: e,
-        sortable: t,
-        sortChange: this.sortChange,
-        group: s || [],
-        groupable: l,
-        groupChange: this.groupChange,
-        filter: d,
-        filterable: p,
-        filterOperators: h,
-        filterChange: this.filterChange,
-        columnMenu: v,
-        columnMenuIcon: z,
-        selectionChange: this.onHeaderSelectionChange,
-        columns: E,
-        columnResize: this.columnResize,
-        pressHandler: this.dragLogic.pressHandler,
-        dragHandler: this.dragLogic.dragHandler,
-        releaseHandler: this.dragLogic.releaseHandler,
-        columnsMap: G,
-        cellRender: g,
-        isRtl: O,
-        dragClue: this.dragLogic.dragClueRef,
-        headerRef: this.headerElementRef,
-        containerRef: this.containerRef,
-        navigatable: !!this.props.navigatable,
-        columnGroupChange: this.columnGroupChange
-      }
-    )), this.resolveTitle = (e) => {
+    }), this.getHeaderRow = y(
+      (e, t, s, l, d, p, h, g, v, z, E, G, O) => /* @__PURE__ */ r.createElement(
+        lt,
+        {
+          cells: this.props.cells,
+          sort: e,
+          sortable: t,
+          sortChange: this.sortChange,
+          group: s || [],
+          groupable: l,
+          groupChange: this.groupChange,
+          filter: d,
+          filterable: p,
+          filterOperators: h,
+          filterChange: this.filterChange,
+          columnMenu: v,
+          columnMenuIcon: z,
+          selectionChange: this.onHeaderSelectionChange,
+          columns: E,
+          columnResize: this.columnResize,
+          pressHandler: this.dragLogic.pressHandler,
+          dragHandler: this.dragLogic.dragHandler,
+          releaseHandler: this.dragLogic.releaseHandler,
+          columnsMap: G,
+          cellRender: g,
+          isRtl: O,
+          dragClue: this.dragLogic.dragClueRef,
+          headerRef: this.headerElementRef,
+          containerRef: this.containerRef,
+          navigatable: !!this.props.navigatable,
+          columnGroupChange: this.columnGroupChange
+        }
+      )
+    ), this.resolveTitle = (e) => {
       const t = this._columns.find((l) => l.field === e), s = t && (t.title || t.field);
       return s === void 0 ? e : s;
     }, 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), this.handleFocusInEditableRows = () => {
@@ -546,7 +539,11 @@ const H = class H extends r.Component {
     this.initializeVirtualization(a, v);
     const E = this.childrenToArray(this.props.children);
     this.initColumns(E, h);
-    const G = E.map((i) => i && i.type && i.type.displayName === "KendoReactGridToolbar" ? r.cloneElement(i, { ...i.props, ariaControls: this._gridId }) : null), O = E.filter((i) => i && i.type && i.type.displayName === "KendoReactGridNoRecords"), j = E.filter((i) => i && i.type && i.type.displayName === "KendoReactGridStatusBar"), R = this._columns.filter((i) => i.children.length === 0), q = v && /* @__PURE__ */ r.createElement(
+    const G = E.map((i) => i && i.type && i.type.displayName === "KendoReactGridToolbar" ? r.cloneElement(i, { ...i.props, ariaControls: this._gridId }) : null), O = E.filter(
+      (i) => i && i.type && i.type.displayName === "KendoReactGridNoRecords"
+    ), j = E.filter(
+      (i) => i && i.type && i.type.displayName === "KendoReactGridStatusBar"
+    ), R = this._columns.filter((i) => i.children.length === 0), q = v && /* @__PURE__ */ r.createElement(
       ht,
       {
         group: this.props.group || [],
@@ -559,7 +556,17 @@ const H = class H extends r.Component {
         ariaControls: this._gridId,
         onContextMenu: this.onContextMenu
       }
-    ), { sort: _e, sortable: xe, group: ke, filter: Te, filterable: De, filterOperators: He = Se, headerCellRender: ze, columnMenu: Ae, columnMenuIcon: Fe } = this.props, J = /* @__PURE__ */ r.createElement(
+    ), {
+      sort: _e,
+      sortable: xe,
+      group: ke,
+      filter: Te,
+      filterable: De,
+      filterOperators: He = Se,
+      headerCellRender: ze,
+      columnMenu: Ae,
+      columnMenuIcon: Fe
+    } = this.props, J = /* @__PURE__ */ r.createElement(
       at,
       {
         size: t,
@@ -601,13 +608,7 @@ const H = class H extends r.Component {
             ariaRowIndex: this._columnsMap.length + 1
           }
         ) || void 0,
-        cols: R.map((i, f) => /* @__PURE__ */ r.createElement(
-          "col",
-          {
-            key: f.toString(),
-            width: U(i)
-          }
-        ))
+        cols: R.map((i, f) => /* @__PURE__ */ r.createElement("col", { key: f.toString(), width: U(i) }))
       }
     ), Ne = this.vs && this.vs.container && this.vs.container.scrollLeft || 0, Le = parseFloat(((this.props.style || {}).width || "").toString()), { colSpans: Me, hiddenColumns: Ge } = Qe({
       enabled: this.props.columnVirtualization,
@@ -621,7 +622,10 @@ const H = class H extends r.Component {
         row: R.map((u, C) => {
           if (Ge[C])
             return null;
-          const N = u.id ? u.id : C, w = m(s.contentSticky({ locked: u.locked }), u.className), I = u.left !== void 0 ? this.isRtl ? { left: u.right, right: u.left } : { left: u.left, right: u.right } : {};
+          const N = u.id ? u.id : C, w = m(
+            s.contentSticky({ locked: u.locked }),
+            u.className
+          ), I = u.left !== void 0 ? this.isRtl ? { left: u.right, right: u.left } : { left: u.left, right: u.right } : {};
           let K = !1;
           if (u.editable && this.props.editField) {
             const x = ye(this.props.editField, i.dataItem);
@@ -649,7 +653,12 @@ const H = class H extends r.Component {
               cells: yt(this.props.cells, u.cells),
               onChange: this.itemChange,
               selectionChange: this.props.onSelectionChange ? (x) => {
-                this.selectionChange({ event: x, dataItem: i.dataItem, dataIndex: b, columnIndex: C });
+                this.selectionChange({
+                  event: x,
+                  dataItem: i.dataItem,
+                  dataIndex: b,
+                  columnIndex: C
+                });
               } : void 0,
               columnIndex: C,
               columnsCount: R.length,
@@ -689,78 +698,83 @@ const H = class H extends r.Component {
       (this._slicedData || this._data).forEach((b, F) => {
         b.rowType === "data" && (Q++, i++);
         const k = Q % 2 === 0, S = this.props.dataItemKey && je(this.props.dataItemKey)(b.dataItem), u = F + (this.vs.realSkip || 0), C = S || "ai" + u, N = C + "_1", w = Oe(b, C, i, k);
-        if (A = u + Z + f, P.push(/* @__PURE__ */ r.createElement(
-          St,
-          {
-            key: C,
-            dataItem: b.dataItem,
-            isAltRow: k,
-            isInEdit: w.isInEdit,
-            rowType: b.rowType,
-            isHidden: Y(F),
-            onClick: (I) => this.rowClick(I, b),
-            onDoubleClick: (I) => this.rowDblClick(I, b),
-            selectedField: this.props.selectedField,
-            rowHeight: this.props.rowHeight,
-            render: this.props.rowRender,
-            ariaRowIndex: A,
-            absoluteRowIndex: u,
-            dataIndex: this.vs.scrollableVirtual && !this.props.groupable ? u : i,
-            isSelected: w.isSelected
-          },
-          w.row
-        )), this.props.detail && b.rowType === "data" && b.expanded) {
-          const I = R.length - (this.props.expandField ? 1 : 0) - (this.props.group ? this.props.group.length : 0) || 1;
-          f++, A = u + Z + f, P.push(/* @__PURE__ */ r.createElement(
-            "tr",
+        if (A = u + Z + f, P.push(
+          /* @__PURE__ */ r.createElement(
+            St,
             {
-              key: N,
-              className: m(
-                s.detailTr({ isAlt: k })
-              ),
-              style: { visibility: Y(F) ? "hidden" : "", height: this.props.detailRowHeight },
-              role: "row",
-              "aria-rowindex": A
+              key: C,
+              dataItem: b.dataItem,
+              isAltRow: k,
+              isInEdit: w.isInEdit,
+              rowType: b.rowType,
+              isHidden: Y(F),
+              onClick: (I) => this.rowClick(I, b),
+              onDoubleClick: (I) => this.rowDblClick(I, b),
+              selectedField: this.props.selectedField,
+              rowHeight: this.props.rowHeight,
+              render: this.props.rowRender,
+              ariaRowIndex: A,
+              absoluteRowIndex: u,
+              dataIndex: this.vs.scrollableVirtual && !this.props.groupable ? u : i,
+              isSelected: w.isSelected
             },
-            this.props.group && this.props.group.map((K, L) => {
-              var le;
-              const _ = (le = w == null ? void 0 : w.row[L]) == null ? void 0 : le.props.style, x = _ ? this.isRtl ? { left: _.right, right: _.left } : { left: _.left, right: _.right } : {};
-              return /* @__PURE__ */ r.createElement(
-                Ee,
+            w.row
+          )
+        ), this.props.detail && b.rowType === "data" && b.expanded) {
+          const I = R.length - (this.props.expandField ? 1 : 0) - (this.props.group ? this.props.group.length : 0) || 1;
+          f++, A = u + Z + f, P.push(
+            /* @__PURE__ */ r.createElement(
+              "tr",
+              {
+                key: N,
+                className: m(s.detailTr({ isAlt: k })),
+                style: {
+                  visibility: Y(F) ? "hidden" : "",
+                  height: this.props.detailRowHeight
+                },
+                role: "row",
+                "aria-rowindex": A
+              },
+              this.props.group && this.props.group.map((K, L) => {
+                var le;
+                const _ = (le = w == null ? void 0 : w.row[L]) == null ? void 0 : le.props.style, x = _ ? this.isRtl ? { left: _.right, right: _.left } : { left: _.left, right: _.right } : {};
+                return /* @__PURE__ */ r.createElement(
+                  Ee,
+                  {
+                    id: "",
+                    dataIndex: b.dataIndex,
+                    field: K.field,
+                    dataItem: b.dataItem,
+                    key: L,
+                    style: x,
+                    ariaColumnIndex: 1 + L,
+                    isSelected: !1,
+                    locked: this.props.lockGroups,
+                    isRtl: this.isRtl,
+                    cells: this.props.cells
+                  }
+                );
+              }),
+              this.props.expandField && /* @__PURE__ */ r.createElement(
+                Dt,
                 {
-                  id: "",
-                  dataIndex: b.dataIndex,
-                  field: K.field,
+                  id: D.generateNavigatableId(`${N}-dhcell`, n)
+                }
+              ),
+              /* @__PURE__ */ r.createElement(
+                Tt,
+                {
+                  onContextMenu: this.onContextMenu,
                   dataItem: b.dataItem,
-                  key: L,
-                  style: x,
-                  ariaColumnIndex: 1 + L,
-                  isSelected: !1,
-                  locked: this.props.lockGroups,
-                  isRtl: this.isRtl,
-                  cells: this.props.cells
+                  dataIndex: b.dataIndex,
+                  colSpan: I,
+                  ariaColIndex: 2 + (this.props.group ? this.props.group.length : 0),
+                  detail: this.props.detail,
+                  id: D.generateNavigatableId(`${N}-dcell`, n)
                 }
-              );
-            }),
-            this.props.expandField && /* @__PURE__ */ r.createElement(
-              Dt,
-              {
-                id: D.generateNavigatableId(`${N}-dhcell`, n)
-              }
-            ),
-            /* @__PURE__ */ r.createElement(
-              Tt,
-              {
-                onContextMenu: this.onContextMenu,
-                dataItem: b.dataItem,
-                dataIndex: b.dataIndex,
-                colSpan: I,
-                ariaColIndex: 2 + (this.props.group ? this.props.group.length : 0),
-                detail: this.props.detail,
-                id: D.generateNavigatableId(`${N}-dcell`, n)
-              }
+              )
             )
-          ));
+          );
         }
       });
     } else
@@ -768,22 +782,14 @@ const H = class H extends r.Component {
     const Pe = () => {
       const i = this._header;
       return i && i.table && i.table.clientWidth;
-    }, ee = () => /* @__PURE__ */ r.createElement(
+    }, ee = () => /* @__PURE__ */ r.createElement("div", { key: "no-records", className: m(s.noRecords({})), style: { width: Pe() } }, /* @__PURE__ */ r.createElement(
       "div",
       {
-        key: "no-records",
-        className: m(s.noRecords({})),
-        style: { width: Pe() }
+        className: m(s.noRecordsTemplate({})),
+        [st]: D.generateNavigatableId("no-records", n)
       },
-      /* @__PURE__ */ r.createElement(
-        "div",
-        {
-          className: m(s.noRecordsTemplate({})),
-          [st]: D.generateNavigatableId("no-records", n)
-        },
-        O.length ? O : /* @__PURE__ */ r.createElement(_t, null)
-      )
-    ), te = {
+      O.length ? O : /* @__PURE__ */ r.createElement(_t, null)
+    )), te = {
       size: t,
       onPageChange: this.pagerPageChange,
       total: a,
@@ -792,18 +798,10 @@ const H = class H extends r.Component {
       take: (this.props.take !== void 0 ? this.props.take : this.props.pageSize) || 10,
       messagesMap: ut,
       ...kt(this.props.pageable || {})
-    }, se = this.props.pager ? /* @__PURE__ */ r.createElement(this.props.pager, { ...te }) : /* @__PURE__ */ r.createElement(Ze, { className: m(s.pager({})), ...te }), We = (i, f) => /* @__PURE__ */ r.createElement(
-      "col",
-      {
-        key: f.toString(),
-        width: U(i)
-      }
-    ), ie = (ae = this.props.cells) != null && ae.footerCell || this._columns.some(
-      (i) => {
-        var f;
-        return !!(i.footerCell || (f = i.cells) != null && f.footerCell);
-      }
-    ) ? /* @__PURE__ */ r.createElement(
+    }, se = this.props.pager ? /* @__PURE__ */ r.createElement(this.props.pager, { ...te }) : /* @__PURE__ */ r.createElement(Ze, { className: m(s.pager({})), ...te }), We = (i, f) => /* @__PURE__ */ r.createElement("col", { key: f.toString(), width: U(i) }), ie = (ae = this.props.cells) != null && ae.footerCell || this._columns.some((i) => {
+      var f;
+      return !!(i.footerCell || (f = i.cells) != null && f.footerCell);
+    }) ? /* @__PURE__ */ r.createElement(
       dt,
       {
         size: t,
@@ -830,16 +828,14 @@ const H = class H extends r.Component {
           this.columnResize.colGroupMain = i;
         }
       },
-      R.map(
-        (i, f) => /* @__PURE__ */ r.createElement(
-          "col",
-          {
-            key: f.toString(),
-            className: we(i.field, this.props.sort) ? m(s.sorted({})) : void 0,
-            width: U(i)
-          }
-        )
-      )
+      R.map((i, f) => /* @__PURE__ */ r.createElement(
+        "col",
+        {
+          key: f.toString(),
+          className: we(i.field, this.props.sort) ? m(s.sorted({})) : void 0,
+          width: U(i)
+        }
+      ))
     ), re = this.dragLogic.reorderable || this.dragLogic.groupable;
     if (this.props.scrollable === "none")
       return /* @__PURE__ */ r.createElement(V.Provider, { value: this.contextStateRef.current }, /* @__PURE__ */ r.createElement(
@@ -847,10 +843,7 @@ const H = class H extends r.Component {
         {
           id: this.props.id,
           style: this.props.style,
-          className: m(
-            s.wrapper({ size: t }),
-            this.props.className
-          ),
+          className: m(s.wrapper({ size: t }), this.props.className),
           ref: (i) => {
             this._element = i;
           },
@@ -878,7 +871,15 @@ const H = class H extends r.Component {
             },
             oe,
             J,
-            /* @__PURE__ */ r.createElement("tbody", { role: "rowgroup", className: m(s.tbody({})), ...ge }, P),
+            /* @__PURE__ */ r.createElement(
+              "tbody",
+              {
+                role: "rowgroup",
+                className: m(s.tbody({})),
+                ...ge
+              },
+              P
+            ),
             ie
           )
         ),
@@ -1008,17 +1009,14 @@ const H = class H extends r.Component {
       const l = { ...this.getArguments(e), ...n, targetEvent: t };
       a.call(void 0, l);
     } else
-      s && s.call(
-        void 0,
-        {
-          ...this.getArguments(e),
-          targetEvent: t || {},
-          dataState: {
-            ...this.getDataState(),
-            ...c
-          }
+      s && s.call(void 0, {
+        ...this.getArguments(e),
+        targetEvent: t || {},
+        dataState: {
+          ...this.getDataState(),
+          ...c
         }
-      );
+      });
   }
   columnReorder(a, n, c) {
     const e = this._columns[a], t = e.depth, s = (h) => {
@@ -1073,7 +1071,10 @@ const H = class H extends r.Component {
   }
   initColumns(a, n) {
     const c = D.getIdPrefix(this.navigationStateRef), e = this.readColumns(a, c, this._columnsMutations), t = this.filterColumnsByMediaProp(e);
-    this._columns = t, this._columns.length === 0 && (this._columns = wt(this.props.data, this.props.group, this.props.expandField, { prevId: 0, idPrefix: c })), this.configureColumns(this._columns, n, c), this._columnsMap = this.mapColumns(this._columns, this._columnsMutations), this.columnResize.columns = this._columns, this.dragLogic.columns = this._columns;
+    this._columns = t, this._columns.length === 0 && (this._columns = wt(this.props.data, this.props.group, this.props.expandField, {
+      prevId: 0,
+      idPrefix: c
+    })), this.configureColumns(this._columns, n, c), this._columnsMap = this.mapColumns(this._columns, this._columnsMutations), this.columnResize.columns = this._columns, this.dragLogic.columns = this._columns;
   }
   getDataState() {
     return {
@@ -1121,15 +1122,10 @@ H.displayName = "KendoReactGrid", H.defaultProps = {
       responsive: o.bool,
       info: o.bool,
       type: o.oneOf(["numeric", "input"]),
-      pageSizes: o.oneOfType(
-        [
-          o.bool,
-          o.arrayOf(o.oneOfType([
-            o.string,
-            o.number
-          ]))
-        ]
-      ),
+      pageSizes: o.oneOfType([
+        o.bool,
+        o.arrayOf(o.oneOfType([o.string, o.number]))
+      ]),
       previousNext: o.bool
     })
   ]),