@progress/kendo-react-grid 7.1.0-develop.1 → 7.1.0-develop.10

package/index.mjs

@@ -5,18 +5,18 @@
 "use client";
 import * as l from "react";
 import p from "prop-types";
-import { useId as It, Keys as me, IconWrap as O, classNames as y, getScrollbarWidth as St, kendoThemeMaps as K, Draggable as yt, withIdHOC as wt, dispatchEvent as us, memoizeOne as B, validatePackage as gs, shouldShowValidationUI as fs, canUseDOM as it, setScrollbarWidth as ot, getter as Se, WatermarkOverlay as ms, toIconName as Cs, clone as bs } from "@progress/kendo-react-common";
-import { tableKeyboardNavigationTools as z, useTableKeyboardNavigation as q, TABLE_ROW_INDEX_ATTRIBUTE as xs, TABLE_COL_INDEX_ATTRIBUTE as ks, isRtl as Rt, tableKeyboardNavigationHeaderAttributes as lt, ColumnResizer as vs, HeaderThElement as Ft, getIndex as nt, tableKeyboardNavigation as X, getSelectionOptions as at, mapColumns as Es, tableColumnsVirtualization as Is, Pager as Ss, TableKeyboardNavigationContext as ye, tableKeyboardNavigationScopeAttributes as ht, TableSelection as ct, tableKeyboardNavigationBodyAttributes as dt, DropClue as pt, DragClue as ut, updateLeft as ys, updateRight as ws } from "@progress/kendo-react-data-tools";
-import { getSelectedState as ti, getSelectedStateFromKeyDown as si, setSelectedState as ri } from "@progress/kendo-react-data-tools";
+import { useId as It, Keys as me, IconWrap as O, classNames as y, getScrollbarWidth as St, kendoThemeMaps as K, Draggable as yt, withIdHOC as wt, dispatchEvent as us, memoizeOne as B, validatePackage as gs, shouldShowValidationUI as fs, canUseDOM as it, setScrollbarWidth as ot, getter as ye, WatermarkOverlay as ms, toIconName as Cs, clone as bs } from "@progress/kendo-react-common";
+import { tableKeyboardNavigationTools as z, useTableKeyboardNavigation as q, TABLE_ROW_INDEX_ATTRIBUTE as xs, TABLE_COL_INDEX_ATTRIBUTE as ks, isRtl as Rt, tableKeyboardNavigationHeaderAttributes as lt, ColumnResizer as vs, HeaderThElement as Ft, getIndex as nt, tableKeyboardNavigation as X, getSelectionOptions as at, mapColumns as Es, tableColumnsVirtualization as Is, Pager as Ss, TableKeyboardNavigationContext as we, tableKeyboardNavigationScopeAttributes as ht, TableSelection as ct, tableKeyboardNavigationBodyAttributes as dt, DropClue as pt, DragClue as ut, updateLeft as ys, updateRight as ws } from "@progress/kendo-react-data-tools";
+import { getSelectedState as ei, getSelectedStateFromKeyDown as ti, setSelectedState as si } from "@progress/kendo-react-data-tools";
 import { useLocalization as Nt, provideLocalizationService as G, registerForLocalization as M, useInternationalization as Rs, registerForIntl as Dt } from "@progress/kendo-react-intl";
-import { minusIcon as Fs, plusIcon as Ns, moreVerticalIcon as Ds, sortAscSmallIcon as Be, sortDescSmallIcon as We, filterIcon as Ve, filterClearIcon as Ts, xCircleIcon as Gs, caretAltDownIcon as Ms, caretAltLeftIcon as Hs, caretAltRightIcon as zs, groupIcon as Ls, ungroupIcon as Os, searchIcon as Tt, xIcon as _s } from "@progress/kendo-svg-icons";
-import { NumericTextBox as Ke, TextBox as Gt, Input as Mt, Checkbox as fe, InputPrefix as Ps } from "@progress/kendo-react-inputs";
+import { minusIcon as Fs, plusIcon as Ns, filterIcon as Ce, sortAscSmallIcon as We, sortDescSmallIcon as Ve, filterClearIcon as Ds, xCircleIcon as Ts, caretAltDownIcon as Gs, caretAltLeftIcon as Ms, caretAltRightIcon as Hs, groupIcon as zs, ungroupIcon as Ls, searchIcon as Tt, xIcon as Os } from "@progress/kendo-svg-icons";
+import { NumericTextBox as Ke, TextBox as Gt, Input as Mt, Checkbox as fe, InputPrefix as _s } from "@progress/kendo-react-inputs";
 import { DatePicker as Ue } from "@progress/kendo-react-dateinputs";
-import { Popup as As } from "@progress/kendo-react-popup";
+import { Popup as Ps } from "@progress/kendo-react-popup";
 import { Button as W } from "@progress/kendo-react-buttons";
 import { DropDownList as oe } from "@progress/kendo-react-dropdowns";
 import { isCompositeFilterDescriptor as gt, filterBy as ft } from "@progress/kendo-data-query";
-import { Reveal as Bs } from "@progress/kendo-react-animation";
+import { Reveal as As } from "@progress/kendo-react-animation";
 const he = (r) => null;
 he.displayName = "KendoReactGridColumn";
 he.defaultProps = {
@@ -136,7 +136,7 @@ function zt(r, t, s, o = 0) {
   }
   return e;
 }
-function Ws(r, t, s, o) {
+function Bs(r, t, s, o) {
   let e = [];
   Array.isArray(r) ? e = r : r && (e = r.data);
   const i = [];
@@ -169,7 +169,7 @@ function Ws(r, t, s, o) {
   }
   return i;
 }
-const Vs = (r, t) => {
+const Ws = (r, t) => {
   let s = r[t.parentIndex];
   for (; s; ) {
     if (s.footerCell)
@@ -177,7 +177,7 @@ const Vs = (r, t) => {
     s = r[s.parentIndex];
   }
   return !1;
-}, Ks = (r) => r.filter((t) => Vs(r, t) ? !1 : !!t.footerCell || !(t.children && t.children.length > 0)), Ie = (r) => r.width !== void 0 ? Math.floor(parseFloat(r.width.toString())) + "px" : void 0, Lt = (r) => (r.sort((t, s) => t.declarationIndex - s.declarationIndex), r.map((t) => {
+}, Vs = (r) => r.filter((t) => Ws(r, t) ? !1 : !!t.footerCell || !(t.children && t.children.length > 0)), Se = (r) => r.width !== void 0 ? Math.floor(parseFloat(r.width.toString())) + "px" : void 0, Lt = (r) => (r.sort((t, s) => t.declarationIndex - s.declarationIndex), r.map((t) => {
   const {
     declarationIndex: s,
     parentIndex: o,
@@ -193,7 +193,7 @@ const Vs = (r, t) => {
     children: Lt(c),
     ...d
   } : d;
-})), we = typeof window != "undefined" && /Firefox/.test(window.navigator.userAgent), mt = 17895697, Ce = (r, t) => {
+})), Re = typeof window != "undefined" && /Firefox/.test(window.navigator.userAgent), mt = 17895697, be = (r, t) => {
   if (!(!r && !t))
     return t ? r ? {
       ...r,
@@ -215,7 +215,7 @@ const Vs = (r, t) => {
         ...t.edit || {}
       }
     } : t : r;
-}, Us = (r) => {
+}, Ks = (r) => {
   const t = l.useCallback(
     (d) => {
       r.selectionChange && r.selectionChange({ syntheticEvent: d });
@@ -230,18 +230,17 @@ const Vs = (r, t) => {
     role: "gridcell",
     ...e
   }, n = [
-    /* @__PURE__ */ l.createElement(
+    /* @__PURE__ */ l.createElement("span", { key: 1, className: "k-checkbox-wrap" }, /* @__PURE__ */ l.createElement(
       "input",
       {
-        key: "1",
         checked: typeof o == "boolean" && o,
         id: s,
         type: "checkbox",
         className: "k-checkbox k-checkbox-md k-rounded-md",
         onChange: t
       }
-    ),
-    /* @__PURE__ */ l.createElement("label", { className: "k-checkbox-label", htmlFor: s, key: "2" })
+    )),
+    /* @__PURE__ */ l.createElement("label", { className: "k-checkbox-label", htmlFor: s, key: 2 })
   ];
   const a = r.rowType !== "groupHeader" ? /* @__PURE__ */ l.createElement(
     "td",
@@ -255,38 +254,38 @@ const Vs = (r, t) => {
     return /* @__PURE__ */ l.createElement(d, { ...r, tdProps: i }, n);
   }
   return r.render ? r.render.call(void 0, a, r) : a;
-}, Re = "grid.noRecords", qs = "grid.pagerInfo", $s = "grid.pagerFirstPage", js = "grid.pagerPreviousPage", Xs = "grid.pagerNextPage", Ys = "grid.pagerLastPage", Js = "grid.pagerItemsPerPage", Qs = "grid.pagerPage", Zs = "grid.pagerPageSizeAriaLabel", er = "grid.pagerOf", tr = "grid.pagerTotalPages", Fe = "grid.groupPanelEmpty", Ot = "grid.groupColumn", _t = "grid.ungroupColumn", Ne = "grid.columnMenu", U = "grid.filterClearButton", le = "grid.filterSubmitButton", ne = "grid.filterTitle", De = "grid.sortAscending", Te = "grid.sortDescending", Ge = "grid.searchPlaceholder", Me = "grid.filterCheckAll", He = "grid.filterChooseOperator", ze = "grid.filterSelectedItems", Le = "grid.sortAriaLabel", Oe = "grid.filterAriaLabel", _e = "grid.groupPanelAriaLabel", Pt = "grid.groupExpand", At = "grid.groupCollapse", Bt = "grid.detailExpand", Wt = "grid.detailCollapse", v = {
+}, Fe = "grid.noRecords", Us = "grid.pagerInfo", qs = "grid.pagerFirstPage", $s = "grid.pagerPreviousPage", js = "grid.pagerNextPage", Xs = "grid.pagerLastPage", Ys = "grid.pagerItemsPerPage", Js = "grid.pagerPage", Qs = "grid.pagerPageSizeAriaLabel", Zs = "grid.pagerOf", er = "grid.pagerTotalPages", Ne = "grid.groupPanelEmpty", Ot = "grid.groupColumn", _t = "grid.ungroupColumn", De = "grid.columnMenu", U = "grid.filterClearButton", le = "grid.filterSubmitButton", ne = "grid.filterTitle", Te = "grid.sortAscending", Ge = "grid.sortDescending", Me = "grid.searchPlaceholder", He = "grid.filterCheckAll", ze = "grid.filterChooseOperator", Le = "grid.filterSelectedItems", Oe = "grid.sortAriaLabel", _e = "grid.filterAriaLabel", Pe = "grid.groupPanelAriaLabel", Pt = "grid.groupExpand", At = "grid.groupCollapse", Bt = "grid.detailExpand", Wt = "grid.detailCollapse", v = {
   [Bt]: "Expand detail row",
   [Wt]: "Collapse detail row",
   [Pt]: "Expand group",
   [At]: "Collapse Group",
-  [Re]: "No records available",
-  [Fe]: "Drag a column header and drop it here to group by that column",
+  [Fe]: "No records available",
+  [Ne]: "Drag a column header and drop it here to group by that column",
   [U]: "Clear",
   [le]: "Filter",
   [ne]: "Filter",
-  [De]: "Sort Ascending",
-  [Te]: "Sort Descending",
-  [Le]: "Sortable",
+  [Te]: "Sort Ascending",
+  [Ge]: "Sort Descending",
+  [Oe]: "Sortable",
   [Ot]: "Group Column",
   [_t]: "Ungroup Column",
-  [Ne]: "Column menu",
-  [Js]: "items per page",
-  [qs]: "{0} - {1} of {2} items",
-  [$s]: "Go to the first page",
-  [js]: "Go to the previous page",
-  [Xs]: "Go to the next page",
-  [Ys]: "Go to the last page",
-  [Qs]: "Page",
-  [Zs]: "Page size",
-  [er]: "of",
-  [tr]: "{0}",
-  [Ge]: "Search",
-  [Me]: "Check All",
-  [He]: "Choose Operator",
-  [ze]: "selected items",
-  [Oe]: "Filter",
-  [_e]: "Group panel",
+  [De]: "Column menu",
+  [Ys]: "items per page",
+  [Us]: "{0} - {1} of {2} items",
+  [qs]: "Go to the first page",
+  [$s]: "Go to the previous page",
+  [js]: "Go to the next page",
+  [Xs]: "Go to the last page",
+  [Js]: "Page",
+  [Qs]: "Page size",
+  [Zs]: "of",
+  [er]: "{0}",
+  [Me]: "Search",
+  [He]: "Check All",
+  [ze]: "Choose Operator",
+  [Le]: "selected items",
+  [_e]: "Filter",
+  [Pe]: "Group panel",
   "grid.filterEqOperator": "Is equal to",
   "grid.filterNotEqOperator": "Is not equal to",
   "grid.filterIsNullOperator": "Is null",
@@ -311,11 +310,11 @@ const Vs = (r, t) => {
   "grid.filterAndLogic": "And",
   "grid.filterOrLogic": "Or"
 };
-function sr(r) {
+function tr(r) {
   const t = r.replace(/^pager\.([a-z])/, (s, o) => "grid.pager" + o.toUpperCase());
   return { messageKey: t, defaultMessage: v[t] };
 }
-const rr = (r) => {
+const sr = (r) => {
   let t = null, s = null, o = null;
   const e = T(r.field, r.dataItem), i = q(r.id), n = Nt(), a = l.useCallback(
     (d) => {
@@ -380,7 +379,7 @@ const rr = (r) => {
     return /* @__PURE__ */ l.createElement(d, { ...r, tdProps: s }, o);
   }
   return r.render ? r.render.call(void 0, t, r) : t;
-}, ir = xs, re = ks, or = (r) => {
+}, rr = xs, re = ks, ir = (r) => {
   const t = T(r.field, r.dataItem);
   let s = null;
   const o = y("k-table-td", "k-grid-edit-cell", {
@@ -481,17 +480,16 @@ const rr = (r) => {
         role: "gridcell",
         ...i
       }, a = [
-        /* @__PURE__ */ l.createElement(
+        /* @__PURE__ */ l.createElement("span", { key: 1, className: "k-checkbox-wrap" }, /* @__PURE__ */ l.createElement(
           "input",
           {
             checked: t || !1,
             id: e,
             type: "checkbox",
             className: "k-checkbox k-checkbox-md k-rounded-md",
-            onChange: h,
-            key: 1
+            onChange: h
           }
-        ),
+        )),
         /* @__PURE__ */ l.createElement("label", { className: "k-checkbox-label", htmlFor: e, key: 2 })
       ], s = /* @__PURE__ */ l.createElement(
         "td",
@@ -535,7 +533,7 @@ const rr = (r) => {
   }
   return r.render ? r.render.call(void 0, s, r) : s;
 };
-class lr extends l.Component {
+class or extends l.Component {
   constructor() {
     super(...arguments), this.headerWrap = null, this.table = null, this.syncScroll = !1, this.scrollbarWidth = St(), this.onScroll = (t) => {
       if (this.syncScroll) {
@@ -629,7 +627,7 @@ class lr extends l.Component {
   }
 }
 const Vt = (...r) => Object.assign({ allowUnsort: !0, mode: "single" }, ...r);
-class nr extends l.PureComponent {
+class lr extends l.PureComponent {
   constructor() {
     super(...arguments), this.draggable = null, this.onPress = (t) => {
       const s = this.draggable && this.draggable.element;
@@ -703,20 +701,20 @@ class Kt extends l.Component {
         onMouseDown: this.onAnchorMouseDown,
         onKeyDown: this.onAnchorKeyDown,
         href: "#",
-        "aria-label": `${n}${e.toLanguageString(Ne, v[Ne])}`
+        "aria-label": `${n}${e.toLanguageString(De, v[De])}`
       },
-      /* @__PURE__ */ l.createElement(O, { name: "more-vertical", icon: Ds })
+      /* @__PURE__ */ l.createElement(O, { name: "filter", icon: Ce })
     ), /* @__PURE__ */ l.createElement(
-      As,
+      Ps,
       {
         anchor: this._anchor,
-        show: this.state.show
+        show: this.state.show,
+        popupClass: "k-column-menu k-column-menu-popup k-grid-columnmenu-popup"
       },
       /* @__PURE__ */ l.createElement(
         "div",
         {
           ref: (a) => this._content = a,
-          className: "k-grid-columnmenu-popup",
           tabIndex: 0,
           onBlur: this.blur,
           onFocus: this.focus,
@@ -733,7 +731,7 @@ class Kt extends l.Component {
     ));
   }
 }
-class ar extends l.Component {
+class nr extends l.Component {
   /**
    * @hidden
    */
@@ -757,10 +755,10 @@ class ar extends l.Component {
     return this.props.render ? this.props.render.call(void 0, o, this.props) : o;
   }
 }
-const hr = {
+const ar = {
   true: { asc: "desc", desc: "", "": "asc" },
   false: { asc: "desc", desc: "asc", "": "asc" }
-}, cr = {
+}, hr = {
   none: "none",
   asc: "ascending",
   desc: "descending"
@@ -777,9 +775,9 @@ class Ut extends l.Component {
         "k-header": !0,
         "k-grid-header-sticky": e.locked,
         "k-sorted": this.props.sort && this.props.sort.some((k) => k.field === e.field)
-      }, e.headerClassName), d = e.left !== void 0 ? this.props.isRtl ? { left: e.right, right: e.left } : { left: e.left, right: e.right } : {}, g = G(this).toLanguageString(Le, v[Le]);
+      }, e.headerClassName), d = e.left !== void 0 ? this.props.isRtl ? { left: e.right, right: e.left } : { left: e.left, right: e.right } : {}, g = G(this).toLanguageString(Oe, v[Oe]);
       let m = e.isAccessible ? {
-        ariaSort: cr[a],
+        ariaSort: hr[a],
         role: "columnheader",
         ariaColumnIndex: e.ariaColumnIndex,
         ariaSelected: !1,
@@ -787,7 +785,7 @@ class Ut extends l.Component {
       } : {
         role: "presentation"
       };
-      const u = e.declarationIndex >= 0 ? ++this.index : --this.serviceIndex, b = e.headerCell ? e.headerCell : ar, E = /* @__PURE__ */ l.createElement(
+      const u = e.declarationIndex >= 0 ? ++this.index : --this.serviceIndex, b = e.headerCell ? e.headerCell : nr, E = /* @__PURE__ */ l.createElement(
         b,
         {
           key: 1,
@@ -840,7 +838,7 @@ class Ut extends l.Component {
             autofit: (k) => this.props.columnResize && this.props.columnResize.dblClickHandler(k, [e.id])
           }
         )
-      ], I = Ce(this.props.cells, e.cells);
+      ], I = be(this.props.cells, e.cells);
       if (I && I.headerCell) {
         const k = I.headerCell;
         return /* @__PURE__ */ l.createElement(k, { key: u, thProps: C, index: o }, x);
@@ -858,7 +856,7 @@ class Ut extends l.Component {
   cellClick(t, s) {
     if (t.preventDefault(), !this.props.sortChange)
       return;
-    const { allowUnsort: o, mode: e } = Vt(this.props.sortable || !1, s.sortable || !1), i = (this.props.sort || []).filter((h) => h.field === s.field)[0], n = hr[o][i && i.dir || ""], a = e === "single" ? [] : (this.props.sort || []).filter((h) => h.field !== s.field);
+    const { allowUnsort: o, mode: e } = Vt(this.props.sortable || !1, s.sortable || !1), i = (this.props.sort || []).filter((h) => h.field === s.field)[0], n = ar[o][i && i.dir || ""], a = e === "single" ? [] : (this.props.sort || []).filter((h) => h.field !== s.field);
     n !== "" && s.field && a.push({ field: s.field, dir: n }), this.props.sortChange(a, t);
   }
   sortIcon(t) {
@@ -867,7 +865,7 @@ class Ut extends l.Component {
         O,
         {
           name: "sort-" + this.props.sort[t].dir + "-small",
-          icon: this.props.sort[t].dir === "asc" ? Be : We
+          icon: this.props.sort[t].dir === "asc" ? We : Ve
         }
       )),
       this.props.sort.length > 1 && /* @__PURE__ */ l.createElement("span", { key: 2, className: "k-sort-icon" }, /* @__PURE__ */ l.createElement("span", { className: "k-sort-order" }, t + 1))
@@ -875,7 +873,7 @@ class Ut extends l.Component {
   }
   render() {
     return this.serviceIndex = 0, this.index = -1, this.props.columnsMap.map((t, s) => this.props.pressHandler && /* @__PURE__ */ l.createElement(
-      nr,
+      lr,
       {
         key: s,
         pressHandler: this.props.pressHandler,
@@ -891,7 +889,7 @@ class Ut extends l.Component {
   }
 }
 M(Ut);
-const dr = [
+const cr = [
   { text: "grid.filterAndLogic", operator: "and" },
   { text: "grid.filterOrLogic", operator: "or" }
 ], Ct = {
@@ -933,11 +931,11 @@ const dr = [
 }, L = (r) => r === "isnull" || r === "isnotnull" || r === "isempty" || r === "isnotempty", ie = (r, t) => r.map((s) => ({
   text: t.toLanguageString(s.text, v[s.text]),
   operator: s.operator
-})), pr = "eq", qt = [
+})), dr = "eq", qt = [
   { text: "grid.filterBooleanAll", operator: "" },
   { text: "grid.filterIsTrue", operator: !0 },
   { text: "grid.filterIsFalse", operator: !1 }
-], ur = {
+], pr = {
   text: !1,
   numeric: !1,
   date: !1,
@@ -959,11 +957,11 @@ const dr = [
       return;
   }
   s.onChange({ value: r, operator: e, syntheticEvent: t });
-}, jt = (r, t) => t ? r[t][0].operator : r[0].operator, Pe = (r) => r || "text", Xt = (r, t) => {
+}, jt = (r, t) => t ? r[t][0].operator : r[0].operator, Ae = (r) => r || "text", Xt = (r, t) => {
   const s = r.target.value;
   t({
     value: s.operator,
-    operator: s.operator === "" ? "" : pr,
+    operator: s.operator === "" ? "" : dr,
     syntheticEvent: r.syntheticEvent
   });
 }, Yt = (r, t, s) => {
@@ -985,10 +983,10 @@ class Jt extends l.Component {
           onChange: this.operatorChange,
           className: "k-dropdown-operator",
           iconClassName: "k-i-filter k-icon",
-          svgIcon: Ve,
+          svgIcon: Ce,
           data: this.props.operators,
           textField: "text",
-          title: s.toLanguageString(He, v[He]),
+          title: s.toLanguageString(ze, v[ze]),
           popupSettings: {
             width: ""
           }
@@ -1005,7 +1003,7 @@ class Jt extends l.Component {
       {
         size: this.props.size,
         icon: "filter-clear",
-        svgIcon: Ts,
+        svgIcon: Ds,
         className: y({
           "k-clear-button-visible": !!(!(this.props.value === null || this.props.value === "") || this.props.operator)
         }),
@@ -1095,7 +1093,7 @@ class Jt extends l.Component {
   }
 }
 M(Jt);
-const gr = "k-table-row k-filter-row";
+const ur = "k-table-row k-filter-row";
 class Qt extends l.Component {
   headerCellClassName(t, s) {
     let o = `${s ? "k-grid-header-sticky" : ""}`;
@@ -1126,7 +1124,7 @@ class Qt extends l.Component {
     let e = 0, i = -1;
     const n = this.props.columns.filter((a) => a.children.length === 0).map(
       (a) => {
-        const h = Pe(a.filter), c = o(a.field), d = a.filterable ? t.toLanguageString(Oe, v[Oe]) : void 0;
+        const h = Ae(a.filter), c = o(a.field), d = a.filterable ? t.toLanguageString(_e, v[_e]) : void 0;
         let g = c && c.value;
         g === void 0 && (g = h === "text" ? "" : null);
         const m = a.filterable && {
@@ -1152,7 +1150,7 @@ class Qt extends l.Component {
           className: y("k-table-th", this.headerCellClassName(a.field, a.locked) || void 0),
           role: "columnheader",
           ...b
-        }, x = m && (a.filterCell ? /* @__PURE__ */ l.createElement(a.filterCell, { ...m }) : /* @__PURE__ */ l.createElement(Jt, { size: this.props.size, ...m })), I = Ce(this.props.cells, a.cells);
+        }, x = m && (a.filterCell ? /* @__PURE__ */ l.createElement(a.filterCell, { ...m }) : /* @__PURE__ */ l.createElement(Jt, { size: this.props.size, ...m })), I = be(this.props.cells, a.cells);
         if (I && I.filterCell) {
           const k = I.filterCell;
           return /* @__PURE__ */ l.createElement(k, { key: u, ...m, thProps: C, index: i }, x);
@@ -1167,7 +1165,7 @@ class Qt extends l.Component {
         );
       }
     );
-    return /* @__PURE__ */ l.createElement("tr", { className: gr, "aria-rowindex": this.props.ariaRowIndex, role: "row" }, n);
+    return /* @__PURE__ */ l.createElement("tr", { className: ur, "aria-rowindex": this.props.ariaRowIndex, role: "row" }, n);
   }
 }
 M(Qt);
@@ -1222,7 +1220,7 @@ class Zt extends l.Component {
           O,
           {
             name: "sort-" + t + "-small",
-            icon: t === "asc" ? Be : We,
+            icon: t === "asc" ? We : Ve,
             size: "small"
           }
         )),
@@ -1237,7 +1235,7 @@ class Zt extends l.Component {
             O,
             {
               name: "x-circle",
-              icon: Gs,
+              icon: Ts,
               size: "small"
             }
           )
@@ -1283,16 +1281,16 @@ class es extends l.Component {
         ref: this.props.refCallback,
         className: "k-grouping-header",
         role: "toolbar",
-        "aria-label": G(this).toLanguageString(_e, v[_e]),
+        "aria-label": G(this).toLanguageString(Pe, v[Pe]),
         "aria-controls": this.props.ariaControls || ""
       },
       /* @__PURE__ */ l.createElement("div", { className: "k-chip-list k-chip-list-md", role: "none" }, s),
-      /* @__PURE__ */ l.createElement("div", { className: "k-grouping-drop-container" }, !s.length && G(this).toLanguageString(Fe, v[Fe]), " ")
+      /* @__PURE__ */ l.createElement("div", { className: "k-grouping-drop-container" }, !s.length && G(this).toLanguageString(Ne, v[Ne]), " ")
     );
   }
 }
 M(es);
-class fr extends l.Component {
+class gr extends l.Component {
   constructor() {
     super(...arguments), this.footerWrap = null, this.table = null, this.scrollbarWidth = St();
   }
@@ -1355,7 +1353,7 @@ class fr extends l.Component {
     ) : /* @__PURE__ */ l.createElement("tfoot", { className: "k-table-tfoot" }, this.props.row);
   }
 }
-class mr {
+class fr {
   constructor(t) {
     this.table = null, this.containerHeight = 0, this.topCacheCount = 0, this.attendedSkip = 0, this.propsSkip = 0, this.total = 0, this.scrollableVirtual = !1, this.realSkip = 0, this.pageSize = 0, this.PageChange = null, this.tableBodyRef = l.createRef(), this.fixedScroll = !1, this.askedSkip = void 0, this.containerRef = l.createRef(), this.tableTransform = "", this.prevScrollPos = 0, this.tableTranslate = 0, this.scrollSyncing = !1, this.reactVersion = Number.parseFloat(l.version), this.topItems = (s, o) => {
       if (!this.container || o)
@@ -1513,7 +1511,7 @@ class xt {
     return this.containerRef.current;
   }
   translate(t, s) {
-    this.scrollableVirtual && this.table && (we || this.reactVersion <= 17 || s ? this.table.style.transform = "translateY(" + t + "px)" : this.tableTransform = "translateY(" + t + "px)");
+    this.scrollableVirtual && this.table && (Re || this.reactVersion <= 17 || s ? this.table.style.transform = "translateY(" + t + "px)" : this.tableTransform = "translateY(" + t + "px)");
   }
   changePage(t, s) {
     this.PageChange && this.PageChange({ skip: Math.max(0, t), take: this.pageSize }, s);
@@ -1543,8 +1541,8 @@ class xt {
     }
   }
 }
-const Cr = 1, br = 20;
-class xr {
+const mr = 1, Cr = 20;
+class br {
   constructor(t) {
     this.columns = [], this.resizable = !1, this.isRtl = !1, this.setIsRtl = (s) => {
       this.isRtl = s;
@@ -1581,7 +1579,7 @@ class xr {
       let g = [];
       d.forEach((m) => {
         h.forEach((u) => {
-          m.children[u] && (m.children[u].width = "", g[u] = Math.max(g[u] || 0, m.children[u].offsetWidth + Cr));
+          m.children[u] && (m.children[u].width = "", g[u] = Math.max(g[u] || 0, m.children[u].offsetWidth + mr));
         });
       }), d.forEach((m) => {
         h.forEach((u) => {
@@ -1650,7 +1648,7 @@ class xr {
   }
   updateNextLockedCol(t, s, o) {
     const e = s.index, i = this.colGroupMain.parentElement.closest(".k-grid"), n = i == null ? void 0 : i.clientWidth, a = this.columns.filter((h) => h.locked).map((h) => parseInt(h.width + "", 10)).reduce((h, c) => h + c, 0);
-    !s.locked || n <= a + br || this.columns.forEach((h) => {
+    !s.locked || n <= a + Cr || this.columns.forEach((h) => {
       if (h != null && h.locked && o) {
         const c = t == null ? void 0 : t.querySelectorAll('[aria-colindex="' + h.ariaColumnIndex + '"]');
         c == null || c.forEach((d) => {
@@ -1661,7 +1659,7 @@ class xr {
     });
   }
 }
-class kr {
+class xr {
   constructor(t, s, o) {
     this.refDragElementClue = l.createRef(), this.refDropElementClue = l.createRef(), this.columns = [], this.reorderable = !1, this.groupable = !1, this.startColumn = -1, this.startGroup = -1, this.currentColumn = -1, this.currentGroup = -1, this.groupPanelDivElement = null, this.refGroupPanelDiv = (e) => {
       this.groupPanelDivElement = e && e.children ? e.children[0] : e;
@@ -1752,7 +1750,7 @@ class kr {
     });
   }
 }
-const vr = (r) => {
+const kr = (r) => {
   let t = null;
   const s = Rs(), o = q(r.id), e = l.useCallback((c) => {
     r.onContextMenu && r.onContextMenu.call(void 0, c, r.dataItem, r.field);
@@ -1808,11 +1806,11 @@ const vr = (r) => {
     [c, h, n, g]
   ), D = l.useCallback((F) => {
     r.onContextMenu && r.onContextMenu.call(void 0, F, r.dataItem, r.field);
-  }, [r.onContextMenu, r.dataItem, r.field]), de = (F, xe) => {
-    const pe = c ? At : Pt, ke = C.toLanguageString(pe, v[pe]);
+  }, [r.onContextMenu, r.dataItem, r.field]), de = (F, ke) => {
+    const pe = c ? At : Pt, ve = C.toLanguageString(pe, v[pe]);
     return x = {
       className: "k-table-td",
-      style: { ...r.style, ...xe },
+      style: { ...r.style, ...ke },
       colSpan: F,
       key: "g-colspan",
       role: "gridcell",
@@ -1836,13 +1834,13 @@ const vr = (r) => {
         },
         href: "#",
         tabIndex: -1,
-        "aria-label": ke
+        "aria-label": ve
       },
       /* @__PURE__ */ l.createElement(
         O,
         {
           name: c ? "caret-alt-down" : u ? "caret-alt-left" : "caret-alt-right",
-          icon: c ? Ms : u ? Hs : zs
+          icon: c ? Gs : u ? Ms : Hs
         }
       )
     ), n[b] instanceof Date && n[b].toString ? n[b].toString() : n[b]), /* @__PURE__ */ l.createElement(
@@ -1889,7 +1887,7 @@ const vr = (r) => {
   }
   return d ? d.call(void 0, t, r) : t;
 };
-class Er extends l.Component {
+class vr extends l.Component {
   /**
    * @hidden
    */
@@ -1897,7 +1895,7 @@ class Er extends l.Component {
     const t = y(
       "k-table-row",
       {
-        "k-grouping-row": this.props.rowType === "groupHeader",
+        "k-table-group-row k-grouping-row": this.props.rowType === "groupHeader",
         "k-group-footer": this.props.rowType === "groupFooter",
         "k-master-row": this.props.rowType !== "groupHeader" && this.props.rowType !== "groupFooter",
         "k-table-alt-row k-alt": this.props.rowType !== "groupHeader" && this.props.rowType !== "groupFooter" && this.props.isAltRow,
@@ -1919,23 +1917,22 @@ class Er extends l.Component {
         "aria-rowindex": this.props.ariaRowIndex,
         "absolute-row-index": this.props.absoluteRowIndex,
         key: this.props.absoluteRowIndex,
-        [ir]: this.props.rowType === "data" ? this.props.dataIndex : void 0
+        [rr]: this.props.rowType === "data" ? this.props.dataIndex : void 0
       },
       this.props.children
     );
     return this.props.render ? this.props.render.call(void 0, s, this.props) : s;
   }
 }
-class Ir extends l.Component {
+class Er extends l.Component {
   get _inputId() {
     return this.props.id;
   }
   render() {
     const { columnMenuWrapperProps: t } = this.props, s = [
-      /* @__PURE__ */ l.createElement(
+      /* @__PURE__ */ l.createElement("span", { key: 0, className: "k-checkbox-wrap" }, /* @__PURE__ */ l.createElement(
         "input",
         {
-          key: 0,
           checked: this.props.selectionValue,
           id: this._inputId,
           type: "checkbox",
@@ -1945,25 +1942,25 @@ class Ir extends l.Component {
             syntheticEvent: o
           })
         }
-      ),
+      )),
       /* @__PURE__ */ l.createElement("label", { key: 1, className: "k-checkbox-label", htmlFor: this._inputId }),
       t.columnMenu && /* @__PURE__ */ l.createElement(Kt, { ...t })
     ];
     return this.props.render ? this.props.render.call(void 0, s, this.props) : s;
   }
 }
-const Sr = wt(Ir);
+const Ir = wt(Er);
 class qe extends l.Component {
   /**
    * @hidden
    */
   render() {
-    return this.props.children || G(this).toLanguageString(Re, v[Re]);
+    return this.props.children || G(this).toLanguageString(Fe, v[Fe]);
   }
 }
 qe.displayName = "KendoReactGridNoRecords";
 M(qe);
-class yr extends l.Component {
+class Sr extends l.Component {
   constructor() {
     super(...arguments), this._element = null, this.renderCell = (t, s) => {
       const o = {
@@ -1980,7 +1977,7 @@ class yr extends l.Component {
         field: t.field,
         ariaColumnIndex: t.ariaColumnIndex,
         ...o
-      }, i = Ce(this.props.cells, t.cells);
+      }, i = be(this.props.cells, t.cells);
       if (i && i.footerCell) {
         const n = i.footerCell;
         return /* @__PURE__ */ l.createElement(n, { ...e, tdProps: o, index: s });
@@ -1992,10 +1989,10 @@ class yr extends l.Component {
     return this._element;
   }
   render() {
-    return /* @__PURE__ */ l.createElement("tr", { className: "k-table-row", role: "row", "aria-rowindex": this.props.ariaRowIndex }, Ks(this.props.columns).map(this.renderCell));
+    return /* @__PURE__ */ l.createElement("tr", { className: "k-table-row", role: "row", "aria-rowindex": this.props.ariaRowIndex }, Vs(this.props.columns).map(this.renderCell));
   }
 }
-const wr = ({
+const yr = ({
   buttonCount: r = 10,
   info: t = !0,
   type: s = "numeric",
@@ -2011,14 +2008,14 @@ const wr = ({
   responsive: i !== !1,
   type: s,
   pageSizeValue: n
-}), Rr = (r) => wr(r === !0 ? {} : r), vt = {
+}), wr = (r) => yr(r === !0 ? {} : r), vt = {
   name: "@progress/kendo-react-grid",
   productName: "KendoReact",
   productCodes: ["KENDOUIREACT", "KENDOUICOMPLETE"],
-  publishDate: 1705312964,
+  publishDate: 1706106852,
   version: "",
   licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/"
-}, Fr = (r) => {
+}, Rr = (r) => {
   const { colSpan: t, ariaColIndex: s, dataItem: o, dataIndex: e, id: i } = r, n = q(i), a = l.useCallback((h) => {
     r.onContextMenu && r.onContextMenu.call(void 0, h, r.dataItem);
   }, [r.onContextMenu, r.dataItem]);
@@ -2034,7 +2031,7 @@ const wr = ({
     },
     /* @__PURE__ */ l.createElement(r.detail, { dataItem: o, dataIndex: e })
   );
-}, Nr = (r) => {
+}, Fr = (r) => {
   const t = q(r.id);
   return /* @__PURE__ */ l.createElement("td", { className: "k-table-td k-hierarchy-cell", ...t, role: "gridcell" });
 };
@@ -2081,7 +2078,7 @@ let ce = class extends l.Component {
       }
     }, this.getVirtualScroll = (e) => {
       const { rowHeight: i, detailRowHeight: n, detail: a, expandField: h, groupable: c } = e, d = this.isAllData(), g = i !== void 0 && i > 0, m = n !== void 0 && n > 0, u = c === !0 || typeof c == "object" && c.enabled !== !1;
-      return !g || u && !d || !!(a && h) && (!m || !d) ? mr : xt;
+      return !g || u && !d || !!(a && h) && (!m || !d) ? fr : xt;
     }, this.isAllData = () => {
       const { data: e, total: i } = this.props;
       return Array.isArray(e) ? e.length === i : e ? i === e.total : !1;
@@ -2095,7 +2092,7 @@ let ce = class extends l.Component {
         i || 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 && !i) {
         const n = this.props.rowHeight * e;
-        this.vs.containerHeight = we ? Math.min(mt, n) : n;
+        this.vs.containerHeight = Re ? Math.min(mt, n) : n;
       } 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 xt) {
@@ -2103,7 +2100,7 @@ let ce = class extends l.Component {
         let { detailRowHeight: c = 0 } = this.props;
         c = a && h ? c : n, 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, n, c, this._data)) : this.vs.rowHeightService = new bt(e, n, c);
         const d = this.vs.rowHeightService.totalHeight();
-        this.vs.containerHeight = we ? Math.min(mt, d) : d;
+        this.vs.containerHeight = Re ? Math.min(mt, d) : d;
       }
     }, this.scrollHandler = (e) => {
       if (e.target !== e.currentTarget)
@@ -2275,7 +2272,7 @@ let ce = class extends l.Component {
       (e) => Es(e)
     ), this.configureColumns = B((e, i, n) => {
       this.props.selectedField && e.filter((c) => c.field === this.props.selectedField).forEach((c) => {
-        c.width = c.width || "50px", c.cell = c.cell || Us, c.headerCell = c.headerCell || Sr;
+        c.width = c.width || "50px", c.cell = c.cell || Ks, c.headerCell = c.headerCell || Ir;
       });
       const a = {
         id: "",
@@ -2299,7 +2296,7 @@ let ce = class extends l.Component {
       let h = 0;
       this.props.expandField && this.props.onExpandChange && this.props.detail && (e.unshift({
         ...a,
-        cell: rr,
+        cell: sr,
         field: this.props.expandField,
         headerClassName: "k-hierarchy-cell k-header",
         id: z.generateNavigatableId(`${this._columns.length}`, n, "column")
@@ -2346,11 +2343,11 @@ let ce = class extends l.Component {
       return n === void 0 ? e : n;
     }, this.getLeafDataItems = () => this._data.filter((e) => e.rowType === "data").map((e) => e.dataItem), gs(vt), this.showLicenseWatermark = fs(vt);
     const s = this.props.groupable === !0 || typeof this.props.groupable == "object" && this.props.groupable.enabled !== !1, o = this.getVirtualScroll(t);
-    this.vs = new o(s || t.rowHeight === void 0 || t.rowHeight === 0), this.dragLogic = new kr(
+    this.vs = new o(s || t.rowHeight === void 0 || t.rowHeight === 0), this.dragLogic = new xr(
       this.columnReorder.bind(this),
       this.groupReorder.bind(this),
       this.columnToGroup.bind(this)
-    ), this.columnResize = new xr(this.onResize), X.onConstructor({
+    ), this.columnResize = new br(this.onResize), X.onConstructor({
       navigatable: !!t.navigatable,
       contextStateRef: this.contextStateRef,
       navigationStateRef: this.navigationStateRef,
@@ -2499,7 +2496,7 @@ let ce = class extends l.Component {
         onContextMenu: this.onContextMenu
       }
     ), { sort: E, sortable: C, group: x, filter: I, filterable: k, filterOperators: _ = Ct, headerCellRender: D, columnMenu: de } = this.props, Y = /* @__PURE__ */ l.createElement(
-      lr,
+      or,
       {
         size: this.props.size,
         columnResize: this.columnResize,
@@ -2541,16 +2538,16 @@ let ce = class extends l.Component {
           "col",
           {
             key: w.toString(),
-            width: Ie(f)
+            width: Se(f)
           }
         ))
       }
-    ), $ = this.vs && this.vs.container && this.vs.container.scrollLeft || 0, F = parseFloat(((this.props.style || {}).width || "").toString()), { colSpans: xe, hiddenColumns: pe } = Is({
+    ), $ = this.vs && this.vs.container && this.vs.container.scrollLeft || 0, F = parseFloat(((this.props.style || {}).width || "").toString()), { colSpans: ke, hiddenColumns: pe } = Is({
       enabled: this.props.columnVirtualization,
       columns: u,
       tableViewPortWidth: F,
       scrollLeft: $
-    }), ke = (f, w, R) => {
+    }), ve = (f, w, R) => {
       let j = !1;
       const V = this.props.selectedField ? T(this.props.selectedField, f.dataItem) : void 0;
       return {
@@ -2563,22 +2560,22 @@ let ce = class extends l.Component {
             const H = T(this.props.editField, f.dataItem);
             H && (H === !0 || H === S.field) && (j = !0, A = !0);
           }
-          let Ee = S.cell || A && or || vr;
+          let Ie = S.cell || A && ir || kr;
           return /* @__PURE__ */ l.createElement(
-            Ee,
+            Ie,
             {
               onContextMenu: this.onContextMenu,
               key: ee,
               locked: this.props.lockGroups,
               id: z.generateNavigatableId(`${w}-${String(N)}`, s),
-              colSpan: xe[N],
+              colSpan: ke[N],
               dataItem: f.dataItem,
               field: S.field,
               editor: S.editor,
               format: S.format,
               className: te,
               render: this.props.cellRender,
-              cells: Ce(this.props.cells, S.cells),
+              cells: be(this.props.cells, S.cells),
               onChange: this.itemChange,
               selectionChange: this.props.onSelectionChange ? (H) => {
                 this.selectionChange({ event: H, dataItem: f.dataItem, dataIndex: R, columnIndex: N });
@@ -2610,15 +2607,15 @@ let ce = class extends l.Component {
       }
     const je = (f) => f >= this._data.length - J;
     let Xe = this.vs.realSkip || 0;
-    const Q = [], ve = this._columnsMap.length + (this.props.filterable ? 1 : 0) + 1;
+    const Q = [], Ee = this._columnsMap.length + (this.props.filterable ? 1 : 0) + 1;
     let Z = 0;
     if (this._data.length) {
       let f = -1, w = 0;
       (this._slicedData || this._data).forEach((R, j) => {
         R.rowType === "data" && (Xe++, f++);
-        const V = Xe % 2 === 0, S = this.props.dataItemKey && Se(this.props.dataItemKey)(R.dataItem), N = j + (this.vs.realSkip || 0), ee = S || "ai" + N, te = ee + "_1", P = ke(R, ee, f);
-        if (Z = N + ve + w, Q.push(/* @__PURE__ */ l.createElement(
-          Er,
+        const V = Xe % 2 === 0, S = this.props.dataItemKey && ye(this.props.dataItemKey)(R.dataItem), N = j + (this.vs.realSkip || 0), ee = S || "ai" + N, te = ee + "_1", P = ve(R, ee, f);
+        if (Z = N + Ee + w, Q.push(/* @__PURE__ */ l.createElement(
+          vr,
           {
             key: ee,
             dataItem: R.dataItem,
@@ -2639,7 +2636,7 @@ let ce = class extends l.Component {
           P.row
         )), this.props.detail && R.rowType === "data" && R.expanded) {
           const A = u.length - (this.props.expandField ? 1 : 0) - (this.props.group ? this.props.group.length : 0) || 1;
-          w++, Z = N + ve + w, Q.push(/* @__PURE__ */ l.createElement(
+          w++, Z = N + Ee + w, Q.push(/* @__PURE__ */ l.createElement(
             "tr",
             {
               key: te,
@@ -2651,7 +2648,7 @@ let ce = class extends l.Component {
               role: "row",
               "aria-rowindex": Z
             },
-            this.props.group && this.props.group.map((Ee, H) => {
+            this.props.group && this.props.group.map((Ie, H) => {
               var rt;
               const se = (rt = P == null ? void 0 : P.row[H]) == null ? void 0 : rt.props.style, ps = se ? this.isRtl ? { left: se.right, right: se.left } : { left: se.left, right: se.right } : {};
               return /* @__PURE__ */ l.createElement(
@@ -2659,7 +2656,7 @@ let ce = class extends l.Component {
                 {
                   id: "",
                   dataIndex: R.dataIndex,
-                  field: Ee.field,
+                  field: Ie.field,
                   dataItem: R.dataItem,
                   key: H,
                   style: ps,
@@ -2672,13 +2669,13 @@ let ce = class extends l.Component {
               );
             }),
             this.props.expandField && /* @__PURE__ */ l.createElement(
-              Nr,
+              Fr,
               {
                 id: z.generateNavigatableId(`${te}-dhcell`, s)
               }
             ),
             /* @__PURE__ */ l.createElement(
-              Fr,
+              Rr,
               {
                 onContextMenu: this.onContextMenu,
                 dataItem: R.dataItem,
@@ -2693,7 +2690,7 @@ let ce = class extends l.Component {
         }
       });
     } else
-      Q.push(/* @__PURE__ */ l.createElement("tr", { key: "no-records", className: "k-table-row k-grid-norecords", role: "row", "aria-rowindex": ve }, /* @__PURE__ */ l.createElement("td", { className: "k-table-td", colSpan: u.length, role: "gridcell" }, g.length ? g : /* @__PURE__ */ l.createElement(qe, null))));
+      Q.push(/* @__PURE__ */ l.createElement("tr", { key: "no-records", className: "k-table-row k-grid-norecords", role: "row", "aria-rowindex": Ee }, /* @__PURE__ */ l.createElement("td", { className: "k-table-td", colSpan: u.length, role: "gridcell" }, g.length ? g : /* @__PURE__ */ l.createElement(qe, null))));
     const Ye = {
       size: this.props.size,
       onPageChange: this.pagerPageChange,
@@ -2701,13 +2698,13 @@ let ce = class extends l.Component {
       dir: this.isRtl ? "rtl" : void 0,
       skip: this.vs.propsSkip || 0,
       take: (this.props.take !== void 0 ? this.props.take : this.props.pageSize) || 10,
-      messagesMap: sr,
-      ...Rr(this.props.pageable || {})
+      messagesMap: tr,
+      ...wr(this.props.pageable || {})
     }, Je = this.props.pager ? /* @__PURE__ */ l.createElement(this.props.pager, { ...Ye }) : /* @__PURE__ */ l.createElement(Ss, { className: "k-grid-pager", ...Ye }), cs = (f) => this.props.sort && this.props.sort.filter((w) => w.field === f).length > 0, ds = (f, w) => /* @__PURE__ */ l.createElement(
       "col",
       {
         key: w.toString(),
-        width: Ie(f)
+        width: Se(f)
       }
     ), Qe = (st = this.props.cells) != null && st.footerCell || this._columns.some(
       (f) => {
@@ -2715,14 +2712,14 @@ let ce = class extends l.Component {
         return !!(f.footerCell || (w = f.cells) != null && w.footerCell);
       }
     ) ? /* @__PURE__ */ l.createElement(
-      fr,
+      gr,
       {
         size: this.props.size,
         columnResize: this.columnResize,
         staticHeaders: this.props.scrollable !== "none",
         ref: (f) => this._footer = f,
         row: /* @__PURE__ */ l.createElement(
-          yr,
+          Sr,
           {
             cells: this.props.cells,
             columns: this._columns,
@@ -2745,13 +2742,13 @@ let ce = class extends l.Component {
           {
             key: w.toString(),
             className: cs(f.field) ? "k-sorted" : void 0,
-            width: Ie(f)
+            width: Se(f)
           }
         )
       )
     ), et = this.dragLogic.reorderable || this.dragLogic.groupable, tt = this.props.columnVirtualization ? "block" : "table";
     if (this.props.scrollable === "none")
-      return /* @__PURE__ */ l.createElement(ye.Provider, { value: this.contextStateRef.current }, /* @__PURE__ */ l.createElement(
+      return /* @__PURE__ */ l.createElement(we.Provider, { value: this.contextStateRef.current }, /* @__PURE__ */ l.createElement(
         "div",
         {
           id: this.props.id,
@@ -2801,7 +2798,7 @@ let ce = class extends l.Component {
         et && /* @__PURE__ */ l.createElement(l.Fragment, null, /* @__PURE__ */ l.createElement(pt, { ref: this.dragLogic.refDropElementClue }), /* @__PURE__ */ l.createElement(ut, { ref: this.dragLogic.refDragElementClue }))
       ), m, this.props.pageable && Je);
     let ue = this.props.style || {};
-    return this.props.scrollable === "virtual" && (ue.height || (ue = Object.assign({}, ue, { height: "450px" }))), /* @__PURE__ */ l.createElement(ye.Provider, { value: this.contextStateRef.current }, /* @__PURE__ */ l.createElement(
+    return this.props.scrollable === "virtual" && (ue.height || (ue = Object.assign({}, ue, { height: "450px" }))), /* @__PURE__ */ l.createElement(we.Provider, { value: this.contextStateRef.current }, /* @__PURE__ */ l.createElement(
       "div",
       {
         id: this.props.id,
@@ -2983,7 +2980,7 @@ let ce = class extends l.Component {
   }
   initColumns(t, s) {
     const o = z.getIdPrefix(this.navigationStateRef);
-    this._columns = this.readColumns(t, o, this._columnsMutations), this._columns.length === 0 && (this._columns = Ws(this.props.data, this.props.group, this.props.expandField, { prevId: 0, idPrefix: o })), this.configureColumns(this._columns, s, o), this._columnsMap = this.mapColumns(this._columns), this.columnResize.columns = this._columns, this.dragLogic.columns = this._columns;
+    this._columns = this.readColumns(t, o, this._columnsMutations), this._columns.length === 0 && (this._columns = Bs(this.props.data, this.props.group, this.props.expandField, { prevId: 0, idPrefix: o })), this.configureColumns(this._columns, s, o), this._columnsMap = this.mapColumns(this._columns), this.columnResize.columns = this._columns, this.dragLogic.columns = this._columns;
   }
   getDataState() {
     return {
@@ -3030,6 +3027,7 @@ ce.propTypes = {
     p.bool,
     p.shape({
       buttonCount: p.number,
+      responsive: p.bool,
       info: p.bool,
       type: p.oneOf(["numeric", "input"]),
       pageSizes: p.oneOfType(
@@ -3082,8 +3080,8 @@ ce.propTypes = {
   navigatable: p.bool,
   size: p.oneOf(["small", "medium"])
 };
-ce.contextType = ye;
-class be extends l.Component {
+ce.contextType = we;
+class xe extends l.Component {
   /**
    * @hidden
    */
@@ -3129,12 +3127,12 @@ class ts extends l.Component {
    */
   render() {
     const { group: t, column: s } = this.props, o = G(this), e = !!(t && s.field && t.find((n) => n.field === s.field)), i = e ? _t : Ot;
-    return /* @__PURE__ */ l.createElement(be, null, /* @__PURE__ */ l.createElement(
+    return /* @__PURE__ */ l.createElement(xe, null, /* @__PURE__ */ l.createElement(
       ae,
       {
         title: o.toLanguageString(i, v[i]),
         iconClass: e ? "k-i-ungroup" : "k-i-group",
-        svgIcon: e ? Os : Ls,
+        svgIcon: e ? Ls : zs,
         onClick: this.onGroupClick
       }
     ));
@@ -3142,7 +3140,7 @@ class ts extends l.Component {
 }
 Dt(ts);
 M(ts);
-const ss = "asc", rs = "desc", Dr = {
+const ss = "asc", rs = "desc", Nr = {
   true: {
     asc: { asc: "", desc: "desc" },
     desc: { asc: "asc", desc: "" },
@@ -3163,7 +3161,7 @@ class $e extends l.Component {
     }, this.onSort = (t, s) => {
       if (t.preventDefault(), !this.props.onSortChange)
         return;
-      const { column: o, sortable: e, sort: i } = this.props, { allowUnsort: n, mode: a } = Vt(e || !1, !1), h = (i || []).filter((g) => g.field === o.field)[0], c = Dr[n][h && h.dir || ""][s], d = a === "single" ? [] : (this.props.sort || []).filter((g) => g.field !== o.field);
+      const { column: o, sortable: e, sort: i } = this.props, { allowUnsort: n, mode: a } = Vt(e || !1, !1), h = (i || []).filter((g) => g.field === o.field)[0], c = Nr[n][h && h.dir || ""][s], d = a === "single" ? [] : (this.props.sort || []).filter((g) => g.field !== o.field);
       c !== "" && o.field && d.push({ field: o.field, dir: c }), this.props.onSortChange(d, t);
     };
   }
@@ -3172,21 +3170,21 @@ class $e extends l.Component {
    */
   render() {
     const { sort: t, column: s } = this.props, o = is(s.field, t), e = G(this);
-    return /* @__PURE__ */ l.createElement(be, null, /* @__PURE__ */ l.createElement(
+    return /* @__PURE__ */ l.createElement(xe, null, /* @__PURE__ */ l.createElement(
       ae,
       {
-        title: e.toLanguageString(De, v[De]),
+        title: e.toLanguageString(Te, v[Te]),
         iconClass: "k-i-sort-asc-sm",
-        svgIcon: Be,
+        svgIcon: We,
         selected: os(o, t),
         onClick: this.onAscClick
       }
     ), /* @__PURE__ */ l.createElement(
       ae,
       {
-        title: e.toLanguageString(Te, v[Te]),
+        title: e.toLanguageString(Ge, v[Ge]),
         iconClass: "k-i-sort-desc-sm",
-        svgIcon: We,
+        svgIcon: Ve,
         selected: ls(o, t),
         onClick: this.onDescClick
       }
@@ -3211,7 +3209,7 @@ class ns extends l.Component {
         className: y("k-columnmenu-item-content", this.props.className),
         style: this.props.style
       },
-      /* @__PURE__ */ l.createElement(Bs, { style: { position: "relative", display: "block" } }, this.props.show ? this.props.children : null)
+      /* @__PURE__ */ l.createElement(As, { style: { position: "relative", display: "block" } }, this.props.show ? this.props.children : null)
     );
   }
 }
@@ -3295,7 +3293,7 @@ class Et extends l.Component {
     }
   }
 }
-class Tr extends l.Component {
+class Dr extends l.Component {
   render() {
     const {
       firstFilterProps: t,
@@ -3317,7 +3315,7 @@ class Tr extends l.Component {
     ), /* @__PURE__ */ l.createElement(Et, { ...o })));
   }
 }
-const Ae = (r) => r || { filters: [], logic: "and" }, ge = (r, t) => Ae(t).filters.filter((e) => gt(e) ? e.filters && e.filters.length && e.filters.length <= 2 && !e.filters.find((i) => gt(i) || i.field !== r) : !1)[0] || null;
+const Be = (r) => r || { filters: [], logic: "and" }, ge = (r, t) => Be(t).filters.filter((e) => gt(e) ? e.filters && e.filters.length && e.filters.length <= 2 && !e.filters.find((i) => gt(i) || i.field !== r) : !1)[0] || null;
 class as extends l.Component {
   constructor(t) {
     super(t), this.removeGroup = (o, e) => {
@@ -3363,7 +3361,7 @@ class as extends l.Component {
     }, this.clear = (o) => {
       if (o.preventDefault(), !this.props.onFilterChange)
         return;
-      const e = this.props.column.field, i = Ae(this.props.filter), n = ge(e, this.props.filter), a = i.filters.filter((h) => h !== n);
+      const e = this.props.column.field, i = Be(this.props.filter), n = ge(e, this.props.filter), a = i.filters.filter((h) => h !== n);
       a.length ? this.props.onFilterChange({ ...i, filters: a }, o) : this.props.onFilterChange(null, o), this.props.onCloseMenu && this.props.onCloseMenu();
     }, this.currentFilterGroup = () => ({
       ...this.state.filterGroup,
@@ -3371,7 +3369,7 @@ class as extends l.Component {
     }), this.submit = (o) => {
       if (o.preventDefault(), !this.props.onFilterChange)
         return;
-      const e = this.props.column.field, i = Ae(this.props.filter), n = ge(e, this.props.filter), a = this.currentFilterGroup();
+      const e = this.props.column.field, i = Be(this.props.filter), n = ge(e, this.props.filter), a = this.currentFilterGroup();
       let h = null;
       if (n && a.filters.length > 0) {
         const c = i.filters.map((d) => d === n ? a : d);
@@ -3394,7 +3392,7 @@ class as extends l.Component {
     };
     let s;
     if (t.column && t.column.field) {
-      const o = Pe(t.column.filter), e = jt(t.filterOperators, o);
+      const o = Ae(t.column.filter), e = jt(t.filterOperators, o);
       s = ge(t.column.field, t.filter), s = s ? {
         ...s,
         filters: s.filters.map((i) => ({ ...i }))
@@ -3418,7 +3416,7 @@ class as extends l.Component {
     const { column: t, filterUI: s, hideSecondFilter: o, filterOperators: e } = this.props;
     if (!t || !t.field)
       return /* @__PURE__ */ l.createElement("div", null);
-    const i = Pe(t.filter), n = o !== void 0 ? o : ur[i], a = G(this), h = this.state.filterGroup.filters, c = ie(e[i], a), d = ie(qt, a), g = {
+    const i = Ae(t.filter), n = o !== void 0 ? o : pr[i], a = G(this), h = this.state.filterGroup.filters, c = ie(e[i], a), d = ie(qt, a), g = {
       field: t.field,
       value: h[0].value,
       operator: h[0].operator,
@@ -3434,7 +3432,7 @@ class as extends l.Component {
       booleanValues: d,
       onChange: this.secondFilterChange,
       filterType: i
-    }, u = this.state.filterGroup.logic, b = ie(dr, a), E = {
+    }, u = this.state.filterGroup.logic, b = ie(cr, a), E = {
       value: b.find((D) => D.operator === (u === null ? "" : u)),
       onChange: this.logicChange,
       data: b
@@ -3446,23 +3444,23 @@ class as extends l.Component {
       onLogicChange: E.onChange,
       hideSecondFilter: n
     }, I = this.currentFilterGroup().filters.length !== 0 || L(h[0].operator) || L(h[1].operator), k = this.isControlled() ? this.props.expanded : this.state.expanded, _ = this.props.alwaysExpand;
-    return /* @__PURE__ */ l.createElement(be, null, !_ && /* @__PURE__ */ l.createElement(
+    return /* @__PURE__ */ l.createElement(xe, null, !_ && /* @__PURE__ */ l.createElement(
       ae,
       {
         title: a.toLanguageString(ne, v[ne]),
         iconClass: "k-i-filter",
-        svgIcon: Ve,
+        svgIcon: Ce,
         onClick: this.onFilterExpand
       }
     ), /* @__PURE__ */ l.createElement(ns, { show: _ || !!k }, /* @__PURE__ */ l.createElement("div", { className: "kendo-grid-filter-menu-container" }, /* @__PURE__ */ l.createElement(
       "form",
       {
-        className: "k-filter-menu k-group k-reset k-state-border-up",
+        className: "k-filter-menu",
         onSubmit: this.submit,
         onReset: this.clear,
         onKeyDown: (D) => D.stopPropagation()
       },
-      /* @__PURE__ */ l.createElement("div", { className: "k-filter-menu-container" }, C ? /* @__PURE__ */ l.createElement(C, { ...x }) : /* @__PURE__ */ l.createElement(Tr, { ...x }), /* @__PURE__ */ l.createElement("div", { className: "k-actions k-actions-stretched" }, /* @__PURE__ */ l.createElement(
+      /* @__PURE__ */ l.createElement("div", { className: "k-filter-menu-container" }, C ? /* @__PURE__ */ l.createElement(C, { ...x }) : /* @__PURE__ */ l.createElement(Dr, { ...x }), /* @__PURE__ */ l.createElement("div", { className: "k-actions k-actions-stretched" }, /* @__PURE__ */ l.createElement(
         W,
         {
           themeColor: "primary",
@@ -3481,7 +3479,7 @@ class as extends l.Component {
 }
 as.active = (r, t) => !!ge(r, t);
 M(as);
-const Gr = (r, t) => r.length !== t.length ? !1 : r.every((s, o) => s === t[o]);
+const Tr = (r, t) => r.length !== t.length ? !1 : r.every((s, o) => s === t[o]);
 class hs extends l.Component {
   constructor(t) {
     super(t), this.defaultFilter = () => this.props.filter ? bs(this.props.filter) : { filters: [], logic: "and" }, this.isControlled = () => this.props.expanded !== void 0, this.parseData = (s, o) => {
@@ -3567,7 +3565,7 @@ class hs extends l.Component {
    */
   componentDidUpdate() {
     let t = this.props.column.field || "", s = this.props.data.map((o) => T(t, o));
-    Gr(s, this.state.dataFromProps) || this.setState({
+    Tr(s, this.state.dataFromProps) || this.setState({
       data: s,
       dataFromProps: s
     });
@@ -3592,7 +3590,7 @@ class hs extends l.Component {
       {
         className: "k-input-inner",
         type: "text",
-        placeholder: s.toLanguageString(Ge, v[Ge]),
+        placeholder: s.toLanguageString(Me, v[Me]),
         value: this.state.value,
         onChange: (a) => this.handleSearchChange(a.nativeEvent)
       }
@@ -3604,28 +3602,28 @@ class hs extends l.Component {
         className: "k-input-button",
         onClick: this.handleClear,
         icon: "x",
-        svgIcon: _s
+        svgIcon: Os
       }
     )), n = e.filter((a, h) => e.indexOf(a) === h);
-    return /* @__PURE__ */ l.createElement(be, null, /* @__PURE__ */ l.createElement(
+    return /* @__PURE__ */ l.createElement(xe, null, /* @__PURE__ */ l.createElement(
       ae,
       {
         title: s.toLanguageString(ne, v[ne]),
         iconClass: "k-i-filter",
-        svgIcon: Ve,
+        svgIcon: Ce,
         onClick: this.onFilterExpand
       }
     ), /* @__PURE__ */ l.createElement(ns, { show: !!o }, /* @__PURE__ */ l.createElement("div", { className: "kendo-grid-filter-menu-container" }, /* @__PURE__ */ l.createElement(
       "form",
       {
-        className: "k-filter-menu k-group k-reset k-state-border-up",
+        className: "k-filter-menu",
         onSubmit: this.submit,
         onReset: this.clear
       },
       /* @__PURE__ */ l.createElement("div", { className: "k-filter-menu-container" }, i, /* @__PURE__ */ l.createElement("ul", { className: "k-reset k-multicheck-wrap" }, /* @__PURE__ */ l.createElement("li", { className: "k-item k-check-all-wrap" }, /* @__PURE__ */ l.createElement(
         fe,
         {
-          label: s.toLanguageString(Me, v[Me]),
+          label: s.toLanguageString(He, v[He]),
           onChange: (a) => this.handleCheckBoxChange(a, "all"),
           checked: this.isAllSelected()
         }
@@ -3636,7 +3634,7 @@ class hs extends l.Component {
           onChange: (c) => this.handleCheckBoxChange(c, a),
           checked: n.includes(a)
         }
-      )))), /* @__PURE__ */ l.createElement("div", { className: "k-filter-selected-items" }, n.length + " " + s.toLanguageString(ze, v[ze])), /* @__PURE__ */ l.createElement("div", { className: "k-actions k-hstack k-justify-content-stretch" }, /* @__PURE__ */ l.createElement(
+      )))), /* @__PURE__ */ l.createElement("div", { className: "k-filter-selected-items" }, n.length + " " + s.toLanguageString(Le, v[Le])), /* @__PURE__ */ l.createElement("div", { className: "k-actions k-hstack k-justify-content-stretch" }, /* @__PURE__ */ l.createElement(
         W,
         {
           themeColor: "primary",
@@ -3658,7 +3656,7 @@ hs.defaultProps = {
   uniqueData: !0
 };
 M(hs);
-const Mr = (r) => {
+const Gr = (r) => {
   const [t, s] = l.useState(""), o = l.useMemo(() => new Set(r.columnsState.map((u) => u.id)), [r.columnsState]), e = l.useMemo(() => r.columns.filter((u) => {
     var b;
     return (b = u.title || u.field) == null ? void 0 : b.toLowerCase().includes(t.toLowerCase());
@@ -3673,13 +3671,13 @@ const Mr = (r) => {
     const E = i.slice();
     E[b] = u, n(E);
   }, [i]);
-  return /* @__PURE__ */ l.createElement("form", { className: "k-filter-menu k-group k-reset" }, /* @__PURE__ */ l.createElement("div", { className: "k-filter-menu-container" }, /* @__PURE__ */ l.createElement(
+  return /* @__PURE__ */ l.createElement("form", { className: "k-filter-menu" }, /* @__PURE__ */ l.createElement("div", { className: "k-filter-menu-container" }, /* @__PURE__ */ l.createElement(
     Gt,
     {
       className: "k-searchbox",
       value: t,
       onChange: (u) => s(String(u.target.value)),
-      prefix: () => /* @__PURE__ */ l.createElement(Ps, null, /* @__PURE__ */ l.createElement(O, { name: "search", icon: Tt }))
+      prefix: () => /* @__PURE__ */ l.createElement(_s, null, /* @__PURE__ */ l.createElement(O, { name: "search", icon: Tt }))
     }
   ), /* @__PURE__ */ l.createElement("ul", { className: "k-reset k-multicheck-wrap" }, !t && /* @__PURE__ */ l.createElement("li", { className: "k-item k-check-all-wrap" }, /* @__PURE__ */ l.createElement(
     fe,
@@ -3701,8 +3699,8 @@ const Mr = (r) => {
     }
   )))), /* @__PURE__ */ l.createElement("div", { className: "k-filter-selected-items" }, c, " selected items"), /* @__PURE__ */ l.createElement("div", { className: "k-actions k-actions-start k-actions-horizontal" }, /* @__PURE__ */ l.createElement(W, { type: "button", themeColor: "primary", onClick: a }, "Apply"), /* @__PURE__ */ l.createElement(W, { type: "button", onClick: h }, "Reset"))));
 };
-Mr.displayName = "GridColumnMenuColumnsList";
-class Jr extends l.Component {
+Gr.displayName = "GridColumnMenuColumnsList";
+class Yr extends l.Component {
   /**
    * @hidden
    */
@@ -3710,7 +3708,7 @@ class Jr extends l.Component {
     return null;
   }
 }
-class Hr extends l.Component {
+class Mr extends l.Component {
   /**
    * @hidden
    */
@@ -3734,21 +3732,21 @@ class Hr extends l.Component {
     );
   }
 }
-Hr.displayName = "KendoReactGridToolbar";
-const zr = (r) => {
+Mr.displayName = "KendoReactGridToolbar";
+const Hr = (r) => {
   const { data: t = [] } = r;
   return /* @__PURE__ */ l.createElement("div", { className: "k-selection-aggregates k-grid-selection-aggregates" }, t.map((s, o) => /* @__PURE__ */ l.createElement("div", { key: o }, /* @__PURE__ */ l.createElement("span", { className: "k-selection-aggregates-item-text" }, s.type, ": "), /* @__PURE__ */ l.createElement("span", { className: "k-selection-aggregates-item-value" }, s.formattedValue))));
 };
-zr.displayName = "KendoReactGridStatusBar";
-const Lr = (r) => {
+Hr.displayName = "KendoReactGridStatusBar";
+const zr = (r) => {
   var s;
   const t = r.slice();
   for (let o = 0; o < t.length; o++)
     for (; t[o] && ((s = t[o].children) != null && s.length); )
       t.splice(o, 1, ...t[o].children);
   return t;
-}, Qr = (r) => {
-  const { dataItems: t, target: s, selectedField: o } = r, i = Lr(s.columns).map((C) => C.field).filter((C) => C && typeof C == "string").map((C) => Se(C)), n = Se(o), a = { dates: [], numbers: [], booleans: [], others: [] }, h = (C) => {
+}, Jr = (r) => {
+  const { dataItems: t, target: s, selectedField: o } = r, i = zr(s.columns).map((C) => C.field).filter((C) => C && typeof C == "string").map((C) => ye(C)), n = ye(o), a = { dates: [], numbers: [], booleans: [], others: [] }, h = (C) => {
     typeof C == "number" ? a.numbers.push(C) : typeof C == "boolean" ? a.booleans.push(C) : C instanceof Date ? a.dates.push(C) : a.others.push(C);
   };
   t.forEach((C) => {
@@ -3772,52 +3770,52 @@ const Lr = (r) => {
     const x = C, I = u[x];
     I !== void 0 && E.push({ type: x, value: I, formattedValue: b(I, x) });
   }), E;
-}, Or = wt(ce);
-Or.displayName = "KendoReactGrid";
+}, Lr = wt(ce);
+Lr.displayName = "KendoReactGrid";
 export {
   re as GRID_COL_INDEX_ATTRIBUTE,
-  ir as GRID_ROW_INDEX_ATTRIBUTE,
-  Or as Grid,
-  vr as GridCell,
+  rr as GRID_ROW_INDEX_ATTRIBUTE,
+  Lr as Grid,
+  kr as GridCell,
   ce as GridClassComponent,
   he as GridColumn,
   hs as GridColumnMenuCheckboxFilter,
-  Mr as GridColumnMenuColumnsList,
+  Gr as GridColumnMenuColumnsList,
   as as GridColumnMenuFilter,
   Et as GridColumnMenuFilterCell,
-  Tr as GridColumnMenuFilterUI,
+  Dr as GridColumnMenuFilterUI,
   ts as GridColumnMenuGroup,
   ae as GridColumnMenuItem,
   ns as GridColumnMenuItemContent,
-  be as GridColumnMenuItemGroup,
+  xe as GridColumnMenuItemGroup,
   $e as GridColumnMenuSort,
   Kt as GridColumnMenuWrapper,
-  kr as GridCommonDragLogic,
-  Jr as GridDetailRow,
-  or as GridEditCell,
+  xr as GridCommonDragLogic,
+  Yr as GridDetailRow,
+  ir as GridEditCell,
   Jt as GridFilterCell,
   kt as GridGroupCell,
-  ar as GridHeaderCell,
-  rr as GridHierarchyCell,
+  nr as GridHeaderCell,
+  sr as GridHierarchyCell,
   qe as GridNoRecords,
-  Er as GridRow,
-  Us as GridSelectionCell,
-  Hr as GridToolbar,
-  zr as StatusBar,
+  vr as GridRow,
+  Ks as GridSelectionCell,
+  Mr as GridToolbar,
+  Hr as StatusBar,
   qt as booleanFilterValues,
   ge as filterGroupByField,
-  ti as getSelectedState,
-  si as getSelectedStateFromKeyDown,
-  Qr as getStatusData,
+  ei as getSelectedState,
+  ti as getSelectedStateFromKeyDown,
+  Jr as getStatusData,
   v as gridMessages,
-  Lr as leafColumns,
+  zr as leafColumns,
   Ct as operators,
-  $s as pagerFirstPage,
-  qs as pagerInfo,
-  Js as pagerItemPerPage,
-  Ys as pagerLastPage,
-  Xs as pagerNextPage,
-  js as pagerPreviousPage,
-  Ae as rootFilterOrDefault,
-  ri as setSelectedState
+  qs as pagerFirstPage,
+  Us as pagerInfo,
+  Ys as pagerItemPerPage,
+  Xs as pagerLastPage,
+  js as pagerNextPage,
+  $s as pagerPreviousPage,
+  Be as rootFilterOrDefault,
+  si as setSelectedState
 };